/* =========================================================
   DIVORCE LAWYER
   WHAT WE DO SUB-PAGE FAMILY
========================================================= */

.tml-practice-divorce {
    --practice-navy: #0f1d2d;
    --practice-navy-2: #172b40;
    --practice-gold: #c99a48;
    --practice-gold-dark: #a67627;
    --practice-cream: #f7f3ec;
    --practice-paper: #fdfbf7;
    --practice-soft: #f1eee8;
    --practice-text: #17212d;
    --practice-muted: #68727d;
    --practice-border: rgba(15,29,45,.11);

    /*
     * IMPORTANT:
     * Do not use overflow:hidden here.
     * It prevents the sticky "In This Guide" panel
     * from behaving correctly.
     */
    overflow: visible;

    background: #fff;
    color: var(--practice-text);
}


/* =========================================================
   HERO
========================================================= */

.tml-practice-divorce
.tml-practice-hero {
    position: relative;

    min-height: 710px;

    overflow: hidden;

    background-color:
        var(--practice-navy);

    background-image:
        var(--tml-practice-hero-image);

    background-repeat: no-repeat;

    background-size: cover;

    background-position:
        center right;
}


.tml-practice-divorce
.tml-practice-hero-overlay {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            90deg,
            rgba(6,16,27,.98) 0%,
            rgba(6,16,27,.92) 38%,
            rgba(6,16,27,.72) 63%,
            rgba(6,16,27,.46) 100%
        );
}


.tml-practice-divorce
.tml-practice-hero-lines {
    position: absolute;

    width: 620px;
    height: 620px;

    right: -250px;
    top: -270px;

    border:
        1px solid
        rgba(201,154,72,.13);

    border-radius: 50%;

    box-shadow:
        0 0 0 105px
        rgba(201,154,72,.02);

    pointer-events: none;
}


.tml-practice-divorce
.tml-practice-hero-shell {
    position: relative;
    z-index: 2;

    padding-top: 27px;
    padding-bottom: 70px;
}


.tml-practice-divorce
.tml-practice-breadcrumb {
    display: flex;
    align-items: center;

    gap: 8px;

    color:
        rgba(255,255,255,.45);

    font-size: 10px;
}


.tml-practice-divorce
.tml-practice-breadcrumb a {
    color:
        rgba(255,255,255,.68);

    text-decoration: none;
}


.tml-practice-divorce
.tml-practice-hero-layout {
    min-height: 590px;

    display: grid;

    grid-template-columns:
        minmax(0,1.15fr)
        minmax(330px,.65fr);

    gap: 75px;

    align-items: center;
}


.tml-practice-divorce
.tml-practice-hero-copy {
    max-width: 760px;
}


.tml-practice-divorce
.tml-practice-kicker,
.tml-practice-divorce
.tml-practice-section-no {
    display: inline-block;

    color:
        var(--practice-gold);

    font-size: 10px;

    font-weight: 800;

    letter-spacing: .13em;

    text-transform: uppercase;
}


.tml-practice-divorce
.tml-practice-hero-copy h1 {
    margin:
        18px 0 0;

    color: #fff;

    font-family:
        Georgia,
        serif;

    font-size:
        clamp(60px,6.2vw,92px);

    font-weight: 500;

    line-height: .95;
}


.tml-practice-divorce
.tml-practice-hero-copy h1 em {
    display: block;

    margin-top: 8px;

    color:
        #e1b96c;

    font-style: italic;
}


.tml-practice-divorce
.tml-practice-hero-copy > p {
    max-width: 680px;

    margin:
        27px 0 0;

    color:
        rgba(255,255,255,.72);

    font-size: 17px;

    line-height: 1.8;
}


.tml-practice-divorce
.tml-practice-hero-actions {
    display: flex;

    flex-wrap: wrap;

    gap: 12px;

    margin-top: 31px;
}


/* =========================================================
   BUTTONS
========================================================= */

.tml-practice-divorce
.tml-practice-btn {
    min-height: 50px;

    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 10px;

    padding:
        0 23px;

    border-radius: 999px;

    font-size: 10px;

    font-weight: 800;

    letter-spacing: .06em;

    text-decoration: none;

    text-transform: uppercase;

    transition:
        transform .25s ease,
        background .25s ease,
        color .25s ease,
        border-color .25s ease;
}


.tml-practice-divorce
.tml-practice-btn:hover {
    transform:
        translateY(-3px);
}


.tml-practice-divorce
.tml-practice-btn-gold {
    color: #fff;

    background:
        var(--practice-gold);
}


.tml-practice-divorce
.tml-practice-btn-gold:hover {
    color:
        var(--practice-navy);

    background: #fff;
}


.tml-practice-divorce
.tml-practice-btn-outline {
    color: #fff;

    border:
        1px solid
        rgba(255,255,255,.22);

    background:
        rgba(255,255,255,.035);
}


.tml-practice-divorce
.tml-practice-btn-light {
    color:
        var(--practice-navy);

    background: #fff;
}


/* =========================================================
   EXPLORE LINK
========================================================= */

.tml-practice-divorce
.tml-practice-hero-explore {
    display: inline-flex;

    align-items: center;

    gap: 9px;

    margin-top: 26px;

    color:
        rgba(255,255,255,.68);

    font-size: 9px;

    font-weight: 700;

    letter-spacing: .06em;

    text-decoration: none;

    text-transform: uppercase;
}


/* =========================================================
   HERO PROOF
========================================================= */

.tml-practice-divorce
.tml-practice-hero-proof {
    display: flex;

    flex-wrap: wrap;

    gap:
        12px 26px;

    margin-top: 35px;

    padding-top: 24px;

    border-top:
        1px solid
        rgba(255,255,255,.11);
}


.tml-practice-divorce
.tml-practice-hero-proof > div {
    display: flex;

    align-items: center;

    gap: 7px;

    color:
        rgba(255,255,255,.64);

    font-size: 10px;
}


.tml-practice-divorce
.tml-practice-hero-proof i {
    width: 18px;
    height: 18px;

    display: inline-flex;

    align-items: center;
    justify-content: center;

    border:
        1px solid
        rgba(201,154,72,.32);

    border-radius: 50%;

    color:
        #e1b96c;

    font-size: 9px;

    font-style: normal;
}


/* =========================================================
   HERO DASHBOARD
========================================================= */

.tml-practice-divorce
.tml-practice-hero-dashboard {
    position: relative;

    padding: 26px;

    overflow: hidden;

    border:
        1px solid
        rgba(255,255,255,.13);

    border-radius:
        24px 24px 70px 24px;

    background:
        rgba(255,255,255,.06);

    backdrop-filter:
        blur(12px);

    -webkit-backdrop-filter:
        blur(12px);

    box-shadow:
        0 25px 60px
        rgba(0,0,0,.18);
}


.tml-practice-divorce
.tml-practice-dashboard-label {
    display: block;

    color:
        rgba(255,255,255,.54);

    font-size: 9px;

    font-weight: 800;

    letter-spacing: .1em;

    text-transform: uppercase;
}


.tml-practice-divorce
.tml-practice-dashboard-visual {
    margin-top: 15px;

    padding: 20px;

    border-radius: 18px;

    background:
        rgba(255,255,255,.06);
}


.tml-practice-divorce
.tml-practice-dashboard-visual svg {
    display: block;

    width: 100%;
    height: auto;
}


.tml-practice-divorce
.tml-practice-illus-line {
    fill: none;

    stroke:
        rgba(255,255,255,.38);

    stroke-width: 2;
}


.tml-practice-divorce
.tml-practice-illus-heavy {
    fill: none;

    stroke:
        rgba(255,255,255,.67);

    stroke-width: 4;
}


.tml-practice-divorce
.tml-practice-illus-shape {
    fill:
        rgba(255,255,255,.08);

    stroke:
        rgba(255,255,255,.38);

    stroke-width: 2;
}


.tml-practice-divorce
.tml-practice-illus-gold {
    fill: none;

    stroke:
        #e1b96c;

    stroke-width: 2;
}


.tml-practice-divorce
.tml-practice-dashboard-caption {
    margin-top: 20px;

    color:
        rgba(255,255,255,.55);

    font-family:
        Georgia,
        serif;

    font-size: 16px;

    line-height: 1.5;
}


.tml-practice-divorce
.tml-practice-dashboard-caption strong {
    display: block;

    color: #fff;

    font-size: 22px;

    font-weight: 500;
}


.tml-practice-divorce
.tml-practice-dashboard-stats {
    display: grid;

    grid-template-columns:
        repeat(2,minmax(0,1fr));

    gap: 1px;

    margin-top: 22px;

    background:
        rgba(255,255,255,.09);
}


.tml-practice-divorce
.tml-practice-dashboard-stats > div {
    padding: 17px;

    background:
        rgba(10,25,39,.7);
}


.tml-practice-divorce
.tml-practice-dashboard-stats strong {
    display: block;

    color:
        #e1b96c;

    font-family:
        Georgia,
        serif;

    font-size: 24px;

    font-weight: 500;
}


.tml-practice-divorce
.tml-practice-dashboard-stats span {
    display: block;

    margin-top: 4px;

    color:
        rgba(255,255,255,.5);

    font-size: 9px;

    letter-spacing: .05em;

    text-transform: uppercase;
}


/* =========================================================
   METRICS
========================================================= */

.tml-practice-divorce
.tml-practice-metrics {
    background:
        var(--practice-paper);

    border-bottom:
        1px solid
        var(--practice-border);
}


.tml-practice-divorce
.tml-practice-metrics-grid {
    display: grid;

    grid-template-columns:
        repeat(4,minmax(0,1fr));
}


.tml-practice-divorce
.tml-practice-metrics-grid > div {
    padding:
        25px 28px;

    border-right:
        1px solid
        var(--practice-border);
}


.tml-practice-divorce
.tml-practice-metrics-grid > div:last-child {
    border-right: 0;
}


.tml-practice-divorce
.tml-practice-metrics-grid strong {
    display: block;

    color:
        var(--practice-navy);

    font-family:
        Georgia,
        serif;

    font-size: 28px;

    font-weight: 500;
}


.tml-practice-divorce
.tml-practice-metrics-grid span {
    display: block;

    margin-top: 5px;

    color:
        var(--practice-muted);

    font-size: 10px;

    letter-spacing: .04em;

    text-transform: uppercase;
}


/* =========================================================
   GUIDE LAYOUT
========================================================= */

.tml-practice-divorce
.tml-practice-guide {
    position: relative;

    padding:
        110px 0;
}


.tml-practice-divorce
.tml-practice-guide-layout {
    position: relative;

    display: grid;

    grid-template-columns:
        230px
        minmax(0,1fr);

    gap: 70px;

    align-items: start;
}


/* =========================================================
   STICKY "IN THIS GUIDE"
========================================================= */

.tml-practice-divorce
.tml-practice-index {
    position: -webkit-sticky;
    position: sticky;

    top: 150px;

    align-self: start;

    height: max-content;

    z-index: 20;

    padding: 23px;

    border:
        1px solid
        var(--practice-border);

    border-radius:
        18px 18px 42px 18px;

    background:
        rgba(253,251,247,.98);

    box-shadow:
        0 14px 35px
        rgba(15,29,45,.055);

    backdrop-filter:
        blur(8px);

    -webkit-backdrop-filter:
        blur(8px);
}


.tml-practice-divorce
.tml-practice-index-label {
    display: block;

    padding-bottom: 14px;

    border-bottom:
        1px solid
        var(--practice-border);

    color:
        var(--practice-gold-dark);

    font-size: 9px;

    font-weight: 800;

    letter-spacing: .08em;

    text-transform: uppercase;
}


.tml-practice-divorce
.tml-practice-index nav {
    display: grid;

    margin-top: 8px;
}


.tml-practice-divorce
.tml-practice-index a {
    display: grid;

    grid-template-columns:
        28px 1fr;

    gap: 9px;

    align-items: center;

    padding:
        13px 0;

    border-bottom:
        1px solid
        var(--practice-border);

    color:
        var(--practice-muted);

    font-size: 11px;

    line-height: 1.35;

    text-decoration: none;

    transition:
        color .25s ease,
        padding-left .25s ease;
}


.tml-practice-divorce
.tml-practice-index a:last-child {
    border-bottom: 0;
}


.tml-practice-divorce
.tml-practice-index a:hover,
.tml-practice-divorce
.tml-practice-index a.is-active {
    padding-left: 5px;

    color:
        var(--practice-gold-dark);
}


.tml-practice-divorce
.tml-practice-index a span {
    color:
        rgba(15,29,45,.28);

    font-family:
        Georgia,
        serif;
}


/* =========================================================
   ARTICLE
========================================================= */

.tml-practice-divorce
.tml-practice-article {
    min-width: 0;
}


.tml-practice-divorce
.tml-practice-article-meta {
    display: flex;

    flex-wrap: wrap;

    gap: 8px;
}


.tml-practice-divorce
.tml-practice-article-meta span {
    padding:
        7px 10px;

    border-radius: 999px;

    background:
        var(--practice-cream);

    color:
        var(--practice-gold-dark);

    font-size: 9px;

    font-weight: 800;

    letter-spacing: .05em;

    text-transform: uppercase;
}


.tml-practice-divorce
.tml-practice-article-head > p {
    margin:
        14px 0 0;

    color:
        var(--practice-muted);

    font-size: 12px;
}


.tml-practice-divorce
.tml-practice-article-head h2,
.tml-practice-divorce
.tml-practice-content-block > h2,
.tml-practice-divorce
.tml-practice-section-heading h2 {
    margin:
        18px 0 0;

    color:
        var(--practice-navy);

    font-family:
        Georgia,
        serif;

    font-size:
        clamp(37px,4vw,55px);

    font-weight: 500;

    line-height: 1.07;
}


.tml-practice-divorce
.tml-practice-article-head h2 em,
.tml-practice-divorce
.tml-practice-content-block > h2 em,
.tml-practice-divorce
.tml-practice-section-heading h2 em {
    color:
        var(--practice-gold-dark);

    font-style: italic;
}


.tml-practice-divorce
.tml-practice-article-lead {
    max-width: 870px;

    margin-top:
        24px !important;

    font-size:
        16px !important;

    line-height:
        1.85 !important;
}


.tml-practice-divorce
.tml-practice-content-block {
    padding-top: 100px;

    scroll-margin-top: 100px;
}


.tml-practice-divorce
.tml-practice-content-block p,
.tml-practice-divorce
.tml-practice-section-heading > p {
    margin:
        20px 0 0;

    color:
        var(--practice-muted);

    font-size: 15px;

    line-height: 1.85;
}


/* =========================================================
   KEY POINT
========================================================= */

.tml-practice-divorce
.tml-practice-keypoint {
    display: grid;

    grid-template-columns:
        54px
        1fr;

    gap: 18px;

    margin-top: 30px;

    padding: 26px;

    border-left:
        3px solid
        var(--practice-gold);

    background:
        #f6f1e8;
}


.tml-practice-divorce
.tml-practice-keypoint-icon {
    width: 48px;
    height: 48px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 15px;

    background:
        rgba(201,154,72,.11);

    color:
        var(--practice-gold-dark);
}


.tml-practice-divorce
.tml-practice-keypoint-icon svg {
    width: 24px;
    height: 24px;

    fill: none;

    stroke:
        currentColor;

    stroke-width: 1.6;
}


.tml-practice-divorce
.tml-practice-keypoint small {
    color:
        var(--practice-gold-dark);

    font-size: 9px;

    font-weight: 800;

    letter-spacing: .08em;

    text-transform: uppercase;
}


.tml-practice-divorce
.tml-practice-keypoint p {
    margin-top: 7px;

    font-size: 14px;
}


/* =========================================================
   GROUNDS
========================================================= */

.tml-practice-divorce
.tml-divorce-ground-grid {
    display: grid;

    grid-template-columns:
        repeat(2,minmax(0,1fr));

    gap: 16px;

    margin-top: 36px;
}


.tml-practice-divorce
.tml-divorce-ground {
    position: relative;

    min-height: 300px;

    padding: 27px;

    overflow: hidden;

    border:
        1px solid
        var(--practice-border);

    border-radius:
        18px 18px 48px 18px;

    background: #fff;

    transition:
        transform .38s cubic-bezier(.22,1,.36,1),
        box-shadow .38s ease,
        border-color .3s ease;
}


.tml-practice-divorce
.tml-divorce-ground::after {
    content: "";

    position: absolute;

    width: 140px;
    height: 140px;

    right: -90px;
    bottom: -90px;

    border-radius: 50%;

    background:
        var(--ground-color);

    opacity: .07;

    transition:
        transform .4s ease;
}


.tml-practice-divorce
.tml-divorce-ground:hover {
    transform:
        translateY(-7px);

    border-color:
        rgba(15,29,45,.17);

    box-shadow:
        0 22px 48px
        rgba(15,29,45,.08);
}


.tml-practice-divorce
.tml-divorce-ground:hover::after {
    transform:
        scale(1.5);
}


.tml-practice-divorce
.tml-ground-red {
    --ground-color: #b75c5c;
}


.tml-practice-divorce
.tml-ground-purple {
    --ground-color: #7e68a9;
}


.tml-practice-divorce
.tml-ground-gold {
    --ground-color: #c99a48;
}


.tml-practice-divorce
.tml-ground-blue {
    --ground-color: #4e79a8;
}


.tml-practice-divorce
.tml-ground-green {
    --ground-color: #548b6a;
}


.tml-practice-divorce
.tml-ground-teal {
    --ground-color: #438e8c;
}


.tml-practice-divorce
.tml-divorce-ground-icon {
    width: 45px;
    height: 45px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 13px;

    background:
        color-mix(
            in srgb,
            var(--ground-color) 12%,
            white
        );

    color:
        var(--ground-color);
}


.tml-practice-divorce
.tml-divorce-ground-icon svg {
    width: 22px;
    height: 22px;

    fill: none;

    stroke:
        currentColor;

    stroke-width: 1.6;

    stroke-linecap: round;
    stroke-linejoin: round;
}


.tml-practice-divorce
.tml-divorce-ground-no {
    position: absolute;

    right: 22px;
    top: 22px;

    color:
        rgba(15,29,45,.16);

    font-family:
        Georgia,
        serif;

    font-size: 18px;
}


.tml-practice-divorce
.tml-divorce-ground h3 {
    margin:
        34px 0 0;

    color:
        var(--practice-navy);

    font-family:
        Georgia,
        serif;

    font-size: 24px;

    font-weight: 500;
}


.tml-practice-divorce
.tml-divorce-ground p {
    margin-top: 12px;

    font-size: 13px;

    line-height: 1.75;
}


.tml-practice-divorce
.tml-practice-wife-ground {
    margin-top: 18px;

    padding: 25px;

    border:
        1px solid
        rgba(201,154,72,.22);

    background:
        #fff8e9;
}


.tml-practice-divorce
.tml-practice-wife-ground > span {
    color:
        var(--practice-gold-dark);

    font-size: 10px;

    font-weight: 800;

    text-transform: uppercase;
}


.tml-practice-divorce
.tml-practice-wife-ground p {
    font-size: 14px;
}


/* =========================================================
   MUTUAL VS CONTESTED
========================================================= */

.tml-practice-divorce
.tml-divorce-versus {
    position: relative;

    display: grid;

    grid-template-columns:
        1fr 64px 1fr;

    gap: 0;

    margin-top: 38px;

    overflow: hidden;

    border-radius: 22px;

    box-shadow:
        0 18px 48px
        rgba(15,29,45,.08);
}


.tml-practice-divorce
.tml-divorce-versus-side {
    padding: 31px;

    background: #fff;
}


.tml-practice-divorce
.tml-versus-mutual {
    background:
        linear-gradient(
            145deg,
            #f2f8f5,
            #fff
        );
}


.tml-practice-divorce
.tml-versus-contested {
    background:
        linear-gradient(
            145deg,
            #fff5f2,
            #fff
        );
}


.tml-practice-divorce
.tml-divorce-versus-tag {
    display: inline-block;

    color:
        var(--practice-gold-dark);

    font-size: 9px;

    font-weight: 800;

    letter-spacing: .08em;

    text-transform: uppercase;
}


.tml-practice-divorce
.tml-divorce-versus-side > strong {
    display: block;

    margin-top: 8px;

    color:
        var(--practice-navy);

    font-family:
        Georgia,
        serif;

    font-size: 28px;

    font-weight: 500;
}


.tml-practice-divorce
.tml-divorce-versus-side ul {
    display: grid;

    gap: 0;

    margin:
        25px 0 0;

    padding: 0;

    list-style: none;
}


.tml-practice-divorce
.tml-divorce-versus-side li {
    display: grid;

    grid-template-columns:
        1fr 1fr;

    gap: 15px;

    padding:
        14px 0;

    border-top:
        1px solid
        var(--practice-border);
}


.tml-practice-divorce
.tml-divorce-versus-side li span {
    color:
        var(--practice-muted);

    font-size: 11px;
}


.tml-practice-divorce
.tml-divorce-versus-side li b {
    color:
        var(--practice-navy);

    font-size: 11px;

    text-align: right;
}


/* CENTER */

.tml-practice-divorce
.tml-divorce-versus-center {
    display: flex;

    align-items: center;
    justify-content: center;

    background:
        var(--practice-navy);
}


.tml-practice-divorce
.tml-divorce-versus-center span {
    width: 40px;
    height: 40px;

    display: flex;

    align-items: center;
    justify-content: center;

    border:
        1px solid
        rgba(255,255,255,.16);

    border-radius: 50%;

    color:
        #e1b96c;

    font-family:
        Georgia,
        serif;

    font-size: 12px;
}


/* =========================================================
   ADVOCATE NOTE
========================================================= */

.tml-practice-divorce
.tml-practice-advocate-note {
    margin:
        25px 0 0;

    padding:
        28px 31px;

    border: 0;

    border-radius: 18px;

    background:
        var(--practice-navy);

    color: #fff;
}


.tml-practice-divorce
.tml-practice-advocate-note > span {
    color:
        #e1b96c;

    font-size: 9px;

    font-weight: 800;

    letter-spacing: .08em;

    text-transform: uppercase;
}


.tml-practice-divorce
.tml-practice-advocate-note p {
    margin-top: 12px;

    color:
        rgba(255,255,255,.7);

    font-family:
        Georgia,
        serif;

    font-size: 17px;

    line-height: 1.7;
}


/* =========================================================
   PROCESS
========================================================= */

.tml-practice-divorce
.tml-divorce-process {
    position: relative;

    margin-top: 42px;

    padding-left: 82px;
}


.tml-practice-divorce
.tml-divorce-process::before {
    content: "";

    position: absolute;

    left: 48px;
    top: 20px;
    bottom: 20px;

    width: 1px;

    background:
        linear-gradient(
            to bottom,
            var(--practice-gold),
            rgba(201,154,72,.08)
        );
}


.tml-practice-divorce
.tml-divorce-process-step {
    position: relative;

    min-height: 150px;

    padding:
        0 0 42px;
}


.tml-practice-divorce
.tml-divorce-process-step:last-child {
    padding-bottom: 0;
}


.tml-practice-divorce
.tml-divorce-process-no {
    position: absolute;

    left: -82px;
    top: 0;

    width: 48px;
    height: 48px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background:
        var(--practice-navy);

    color:
        #e1b96c;

    font-family:
        Georgia,
        serif;

    font-size: 13px;
}


.tml-practice-divorce
.tml-divorce-process-dot {
    position: absolute;

    left: -38px;
    top: 18px;

    width: 9px;
    height: 9px;

    border:
        2px solid
        var(--practice-gold);

    border-radius: 50%;

    background: #fff;
}


.tml-practice-divorce
.tml-divorce-process-step h3 {
    margin: 0;

    color:
        var(--practice-navy);

    font-family:
        Georgia,
        serif;

    font-size: 23px;

    font-weight: 500;
}


.tml-practice-divorce
.tml-divorce-process-step p {
    max-width: 770px;

    margin-top: 11px;

    font-size: 14px;

    line-height: 1.8;
}


/* =========================================================
   LAW TABLE
========================================================= */

.tml-practice-divorce
.tml-practice-law-table {
    margin-top: 32px;

    overflow: hidden;

    border:
        1px solid
        var(--practice-border);

    border-radius: 16px;
}


.tml-practice-divorce
.tml-practice-law-table > div {
    display: grid;

    grid-template-columns:
        .7fr 1.3fr 1fr;

    gap: 22px;

    padding:
        17px 19px;

    border-bottom:
        1px solid
        var(--practice-border);

    background: #fff;
}


.tml-practice-divorce
.tml-practice-law-table > div:last-child {
    border-bottom: 0;
}


.tml-practice-divorce
.tml-practice-law-table-head {
    background:
        var(--practice-navy) !important;

    color: #fff;

    font-size: 10px;

    font-weight: 800;

    letter-spacing: .05em;

    text-transform: uppercase;
}


.tml-practice-divorce
.tml-practice-law-table strong {
    color:
        var(--practice-navy);

    font-size: 12px;
}


.tml-practice-divorce
.tml-practice-law-table span {
    color:
        var(--practice-muted);

    font-size: 12px;

    line-height: 1.55;
}


/* =========================================================
   COURT ROUTE
========================================================= */

.tml-practice-divorce
.tml-divorce-court-route {
    position: relative;

    display: grid;

    grid-template-columns:
        repeat(3,minmax(0,1fr));

    gap: 0;

    margin-top: 38px;
}


.tml-practice-divorce
.tml-divorce-court-route::before {
    content: "";

    position: absolute;

    left: 0;
    right: 0;
    top: 31px;

    height: 1px;

    background:
        var(--practice-border);
}


.tml-practice-divorce
.tml-divorce-court-stop {
    position: relative;

    z-index: 2;

    min-height: 170px;

    padding:
        0 20px;

    color: inherit;

    text-decoration: none;
}


.tml-practice-divorce
.tml-divorce-court-stop > span {
    width: 62px;
    height: 62px;

    display: flex;

    align-items: center;
    justify-content: center;

    border:
        1px solid
        rgba(201,154,72,.28);

    border-radius: 50%;

    background:
        var(--practice-paper);

    color:
        var(--practice-gold-dark);

    font-family:
        Georgia,
        serif;

    transition:
        background .3s ease,
        color .3s ease,
        transform .3s ease;
}


.tml-practice-divorce
.tml-divorce-court-stop:hover > span {
    transform:
        scale(1.07);

    color: #fff;

    background:
        var(--practice-gold-dark);
}


.tml-practice-divorce
.tml-divorce-court-stop strong {
    display: block;

    margin-top: 18px;

    color:
        var(--practice-navy);

    font-family:
        Georgia,
        serif;

    font-size: 19px;

    font-weight: 500;
}


.tml-practice-divorce
.tml-divorce-court-stop small {
    display: block;

    margin-top: 6px;

    color:
        var(--practice-muted);

    font-size: 11px;

    line-height: 1.5;
}


/* =========================================================
   REVIEWS
========================================================= */

.tml-practice-divorce
.tml-practice-reviews {
    display: grid;

    gap: 14px;

    margin-top: 35px;
}


.tml-practice-divorce
.tml-practice-review {
    position: relative;

    padding:
        28px 31px;

    border:
        1px solid
        var(--practice-border);

    border-radius: 17px;

    background: #fff;

    transition:
        transform .3s ease,
        box-shadow .3s ease;
}


.tml-practice-divorce
.tml-practice-review:hover {
    transform:
        translateX(6px);

    box-shadow:
        0 18px 38px
        rgba(15,29,45,.06);
}


.tml-practice-divorce
.tml-practice-review-stars {
    color:
        #f2a91f;

    font-size: 15px;

    letter-spacing: 2px;
}


.tml-practice-divorce
.tml-practice-review blockquote {
    max-width: 810px;

    margin:
        17px 0 0;

    border: 0;

    color:
        var(--practice-navy);

    font-family:
        Georgia,
        serif;

    font-size: 17px;

    line-height: 1.7;
}


.tml-practice-divorce
.tml-practice-review-person {
    display: flex;

    align-items: center;

    gap: 12px;

    margin-top: 22px;
}


.tml-practice-divorce
.tml-practice-review-person > span {
    width: 40px;
    height: 40px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background:
        var(--practice-cream);

    color:
        var(--practice-gold-dark);

    font-size: 11px;

    font-weight: 800;
}


.tml-practice-divorce
.tml-practice-review-person strong {
    display: block;

    color:
        var(--practice-navy);

    font-size: 12px;
}


.tml-practice-divorce
.tml-practice-review-person small {
    display: block;

    margin-top: 3px;

    color:
        var(--practice-muted);

    font-size: 10px;
}


/* =========================================================
   FAQ DECK
========================================================= */

.tml-practice-divorce
.tml-divorce-faq-deck {
    display: grid;

    grid-template-columns:
        .78fr 1.22fr;

    gap: 18px;

    margin-top: 36px;
}


.tml-practice-divorce
.tml-divorce-faq-questions {
    display: grid;

    align-content: start;

    border:
        1px solid
        var(--practice-border);

    border-radius: 17px;

    overflow: hidden;

    background: #fff;
}


.tml-practice-divorce
.tml-divorce-faq-question {
    width: 100%;

    display: grid;

    grid-template-columns:
        34px 1fr;

    gap: 11px;

    align-items: center;

    min-height: 76px;

    padding:
        13px 16px;

    border: 0;

    border-bottom:
        1px solid
        var(--practice-border);

    background:
        transparent;

    text-align: left;

    cursor: pointer;

    transition:
        background .25s ease,
        padding-left .25s ease;
}


.tml-practice-divorce
.tml-divorce-faq-question:last-child {
    border-bottom: 0;
}


.tml-practice-divorce
.tml-divorce-faq-question:hover,
.tml-practice-divorce
.tml-divorce-faq-question.is-active {
    padding-left: 21px;

    background:
        var(--practice-navy);
}


.tml-practice-divorce
.tml-divorce-faq-question span {
    color:
        var(--practice-gold-dark);

    font-family:
        Georgia,
        serif;

    font-size: 13px;
}


.tml-practice-divorce
.tml-divorce-faq-question strong {
    color:
        var(--practice-navy);

    font-family:
        Georgia,
        serif;

    font-size: 15px;

    font-weight: 500;

    line-height: 1.35;
}


.tml-practice-divorce
.tml-divorce-faq-question:hover strong,
.tml-practice-divorce
.tml-divorce-faq-question.is-active strong {
    color: #fff;
}


.tml-practice-divorce
.tml-divorce-faq-answer-stage {
    position: relative;

    min-height: 510px;

    overflow: hidden;

    border-radius:
        19px 19px 60px 19px;

    background:
        var(--practice-navy);
}


.tml-practice-divorce
.tml-divorce-faq-answer-stage::after {
    content: "?";

    position: absolute;

    right: 25px;
    bottom: -90px;

    color:
        rgba(255,255,255,.025);

    font-family:
        Georgia,
        serif;

    font-size: 320px;

    line-height: 1;
}


.tml-practice-divorce
.tml-divorce-faq-answer {
    position: absolute;

    inset: 0;

    z-index: 2;

    display: flex;

    flex-direction: column;

    justify-content: center;

    padding: 46px;

    opacity: 0;

    visibility: hidden;

    transform:
        translateY(16px);

    transition:
        opacity .32s ease,
        transform .32s ease,
        visibility .32s ease;
}


.tml-practice-divorce
.tml-divorce-faq-answer.is-active {
    opacity: 1;

    visibility: visible;

    transform:
        translateY(0);
}


.tml-practice-divorce
.tml-divorce-faq-answer > span {
    color:
        #e1b96c;

    font-family:
        Georgia,
        serif;

    font-size: 17px;
}


.tml-practice-divorce
.tml-divorce-faq-answer h3 {
    max-width: 620px;

    margin:
        18px 0 0;

    color: #fff;

    font-family:
        Georgia,
        serif;

    font-size:
        clamp(27px,3vw,39px);

    font-weight: 500;

    line-height: 1.15;
}


.tml-practice-divorce
.tml-divorce-faq-answer p {
    max-width: 680px;

    margin-top: 21px;

    color:
        rgba(255,255,255,.66);

    font-size: 14px;

    line-height: 1.82;
}


/* =========================================================
   DARK PRACTICE SCOPE
========================================================= */

.tml-practice-divorce
.tml-practice-scope {
    position: relative;

    padding:
        105px 0;

    overflow: hidden;

    background:
        var(--practice-navy);
}


.tml-practice-divorce
.tml-practice-scope::before {
    content: "LAW";

    position: absolute;

    right: -45px;
    top: -105px;

    color:
        rgba(255,255,255,.025);

    font-family:
        Georgia,
        serif;

    font-size: 300px;

    line-height: 1;

    pointer-events: none;
}


.tml-practice-divorce
.tml-practice-scope-head {
    position: relative;

    z-index: 2;

    max-width: 780px;

    margin: 0 auto;

    text-align: center;
}


.tml-practice-divorce
.tml-practice-scope-head h2 {
    margin:
        14px 0 0;

    color: #fff;

    font-family:
        Georgia,
        serif;

    font-size:
        clamp(40px,4.2vw,59px);

    font-weight: 500;

    line-height: 1.06;
}


.tml-practice-divorce
.tml-practice-scope-head h2 em {
    color:
        #e1b96c;

    font-style: italic;
}


.tml-practice-divorce
.tml-practice-scope-head p {
    max-width: 700px;

    margin:
        21px auto 0;

    color:
        rgba(255,255,255,.62);

    font-size: 15px;

    line-height: 1.8;
}


.tml-practice-divorce
.tml-practice-scope-track {
    position: relative;

    z-index: 2;

    display: grid;

    grid-template-columns:
        repeat(4,minmax(240px,1fr));

    gap: 15px;

    margin-top: 48px;
}


.tml-practice-divorce
.tml-practice-scope-track a {
    min-height: 205px;

    display: flex;

    flex-direction: column;

    padding: 23px;

    border:
        1px solid
        rgba(255,255,255,.11);

    border-radius:
        16px 16px 42px 16px;

    background:
        rgba(255,255,255,.045);

    color: inherit;

    text-decoration: none;

    transition:
        transform .35s ease,
        background .35s ease,
        border-color .35s ease,
        box-shadow .35s ease;
}


.tml-practice-divorce
.tml-practice-scope-track a:hover {
    transform:
        translateY(-6px);

    border-color:
        rgba(225,185,108,.35);

    background:
        rgba(255,255,255,.075);

    box-shadow:
        0 22px 48px
        rgba(0,0,0,.17);
}


.tml-practice-divorce
.tml-practice-scope-track a > span {
    color:
        #e1b96c;

    font-family:
        Georgia,
        serif;

    font-size: 13px;
}


.tml-practice-divorce
.tml-practice-scope-track strong {
    margin-top: 33px;

    color: #fff;

    font-family:
        Georgia,
        serif;

    font-size: 20px;

    font-weight: 500;
}


.tml-practice-divorce
.tml-practice-scope-track small {
    margin-top: 9px;

    color:
        rgba(255,255,255,.53);

    font-size: 11px;

    line-height: 1.65;
}


/* =========================================================
   COURTS
========================================================= */

.tml-practice-divorce
.tml-practice-courts {
    padding:
        110px 0;

    background: #fff;
}


.tml-practice-divorce
.tml-practice-courts-layout {
    display: grid;

    grid-template-columns:
        .75fr 1.25fr;

    gap: 85px;

    align-items: start;
}


.tml-practice-divorce
.tml-practice-courts-copy {
    position: sticky;

    top: 130px;
}


.tml-practice-divorce
.tml-practice-courts-copy h2,
.tml-practice-divorce
.tml-practice-consult-copy h2 {
    margin:
        14px 0 0;

    color:
        var(--practice-navy);

    font-family:
        Georgia,
        serif;

    font-size:
        clamp(40px,4.2vw,59px);

    font-weight: 500;

    line-height: 1.06;
}


.tml-practice-divorce
.tml-practice-courts-copy h2 em,
.tml-practice-divorce
.tml-practice-consult-copy h2 em {
    color:
        var(--practice-gold-dark);

    font-style: italic;
}


.tml-practice-divorce
.tml-practice-courts-copy p {
    margin:
        21px 0 0;

    color:
        var(--practice-muted);

    font-size: 15px;

    line-height: 1.8;
}


.tml-practice-divorce
.tml-practice-courts-network {
    border-top:
        1px solid
        var(--practice-border);
}


.tml-practice-divorce
.tml-practice-courts-network a {
    display: grid;

    grid-template-columns:
        44px 1fr;

    gap: 15px;

    padding:
        21px 3px;

    border-bottom:
        1px solid
        var(--practice-border);

    color: inherit;

    text-decoration: none;

    transition:
        padding-left .3s ease,
        background .3s ease;
}


.tml-practice-divorce
.tml-practice-courts-network a:hover {
    padding-left: 13px;

    background:
        var(--practice-paper);
}


.tml-practice-divorce
.tml-practice-courts-network a > span {
    color:
        var(--practice-gold-dark);

    font-family:
        Georgia,
        serif;

    font-size: 13px;
}


.tml-practice-divorce
.tml-practice-courts-network strong {
    display: block;

    color:
        var(--practice-navy);

    font-family:
        Georgia,
        serif;

    font-size: 19px;

    font-weight: 500;
}


.tml-practice-divorce
.tml-practice-courts-network small {
    grid-column: 2;

    color:
        var(--practice-muted);

    font-size: 11px;

    line-height: 1.5;
}


/* =========================================================
   CONSULTATION
========================================================= */

.tml-practice-divorce
.tml-practice-consult {
    position: relative;

    padding:
        95px 0;

    overflow: hidden;

    background:
        var(--practice-navy);
}


.tml-practice-divorce
.tml-practice-consult-layout {
    display: grid;

    grid-template-columns:
        .85fr 1.15fr;

    gap:
        35px 80px;

    align-items: start;
}


.tml-practice-divorce
.tml-practice-consult-copy h2 {
    color: #fff;
}


.tml-practice-divorce
.tml-practice-consult-copy h2 em {
    color:
        #e1b96c;
}


.tml-practice-divorce
.tml-practice-consult-details {
    display: grid;

    grid-template-columns:
        repeat(2,minmax(0,1fr));

    gap: 12px;
}


.tml-practice-divorce
.tml-practice-consult-details > * {
    padding: 19px;

    border:
        1px solid
        rgba(255,255,255,.11);

    border-radius: 13px;

    color: inherit;

    text-decoration: none;

    background:
        rgba(255,255,255,.035);
}


.tml-practice-divorce
.tml-practice-consult-details span {
    display: block;

    color:
        rgba(255,255,255,.48);

    font-size: 9px;

    letter-spacing: .06em;

    text-transform: uppercase;
}


.tml-practice-divorce
.tml-practice-consult-details strong {
    display: block;

    margin-top: 7px;

    color: #fff;

    font-size: 12px;

    line-height: 1.5;
}


.tml-practice-divorce
.tml-practice-consult-actions {
    grid-column:
        1 / -1;

    display: flex;

    flex-wrap: wrap;

    gap: 12px;

    margin-top: 10px;
}


/* =========================================================
   REVEAL
========================================================= */

.tml-practice-divorce
.tml-practice-reveal {
    opacity: 0;

    transform:
        translateY(22px);

    transition:
        opacity .7s ease,
        transform .7s cubic-bezier(.22,1,.36,1);
}


.tml-practice-divorce
.tml-practice-reveal.is-visible {
    opacity: 1;

    transform:
        translateY(0);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1050px) {

    .tml-practice-divorce
    .tml-practice-hero-layout {
        grid-template-columns: 1fr;
    }


    .tml-practice-divorce
    .tml-practice-hero-dashboard {
        max-width: 620px;
    }


    .tml-practice-divorce
    .tml-practice-guide-layout {
        grid-template-columns: 1fr;

        gap: 45px;
    }


    /*
     * On tablet the guide becomes a horizontal navigation.
     * Sticky sidebar is desktop-only.
     */

    .tml-practice-divorce
    .tml-practice-index {
        position: static;

        height: auto;
    }


    .tml-practice-divorce
    .tml-practice-index nav {
        grid-template-columns:
            repeat(4,minmax(0,1fr));

        gap: 0;
    }


    .tml-practice-divorce
    .tml-practice-index a {
        padding:
            12px 8px;

        border-right:
            1px solid
            var(--practice-border);
    }


    .tml-practice-divorce
    .tml-divorce-court-route {
        grid-template-columns:
            repeat(2,minmax(0,1fr));

        gap:
            30px 0;
    }


    .tml-practice-divorce
    .tml-divorce-court-route::before {
        display: none;
    }


    .tml-practice-divorce
    .tml-practice-scope-track {
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }


    .tml-practice-divorce
    .tml-practice-courts-layout {
        grid-template-columns: 1fr;

        gap: 40px;
    }


    .tml-practice-divorce
    .tml-practice-courts-copy {
        position: static;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 720px) {

    .tml-practice-divorce
    .tml-practice-hero {
        min-height: 650px;

        background-position:
            62% center;
    }


    .tml-practice-divorce
    .tml-practice-hero-layout {
        min-height: auto;

        padding-top: 65px;
    }


    .tml-practice-divorce
    .tml-practice-hero-copy h1 {
        font-size:
            clamp(49px,13vw,66px);
    }


    .tml-practice-divorce
    .tml-practice-hero-copy > p {
        font-size: 15px;
    }


    .tml-practice-divorce
    .tml-practice-hero-actions {
        flex-direction: column;
    }


    .tml-practice-divorce
    .tml-practice-btn {
        width: 100%;
    }


    .tml-practice-divorce
    .tml-practice-hero-dashboard {
        display: none;
    }


    .tml-practice-divorce
    .tml-practice-metrics-grid {
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }


    .tml-practice-divorce
    .tml-practice-metrics-grid > div:nth-child(2) {
        border-right: 0;
    }


    .tml-practice-divorce
    .tml-practice-metrics-grid > div:nth-child(-n+2) {
        border-bottom:
            1px solid
            var(--practice-border);
    }


    .tml-practice-divorce
    .tml-practice-guide,
    .tml-practice-divorce
    .tml-practice-scope,
    .tml-practice-divorce
    .tml-practice-courts,
    .tml-practice-divorce
    .tml-practice-consult {
        padding:
            75px 0;
    }


    /* GUIDE HORIZONTAL SCROLLER */

    .tml-practice-divorce
    .tml-practice-index {
        overflow-x: auto;

        padding: 0;

        border-radius: 13px;

        scrollbar-width: none;
    }


    .tml-practice-divorce
    .tml-practice-index::-webkit-scrollbar {
        display: none;
    }


    .tml-practice-divorce
    .tml-practice-index-label {
        display: none;
    }


    .tml-practice-divorce
    .tml-practice-index nav {
        min-width: max-content;

        display: flex;
    }


    .tml-practice-divorce
    .tml-practice-index a {
        min-width: 145px;

        border-bottom: 0;

        font-size: 10px;
    }


    .tml-practice-divorce
    .tml-practice-content-block {
        padding-top: 75px;
    }


    .tml-practice-divorce
    .tml-practice-content-block p,
    .tml-practice-divorce
    .tml-practice-section-heading > p {
        font-size: 14px;

        line-height: 1.78;
    }


    .tml-practice-divorce
    .tml-divorce-ground-grid {
        grid-template-columns: 1fr;
    }


    .tml-practice-divorce
    .tml-divorce-ground {
        min-height: auto;
    }


    .tml-practice-divorce
    .tml-divorce-ground p {
        font-size: 13px;
    }


    .tml-practice-divorce
    .tml-divorce-versus {
        grid-template-columns: 1fr;
    }


    .tml-practice-divorce
    .tml-divorce-versus-center {
        min-height: 54px;
    }


    .tml-practice-divorce
    .tml-divorce-process {
        padding-left: 65px;
    }


    .tml-practice-divorce
    .tml-divorce-process::before {
        left: 31px;
    }


    .tml-practice-divorce
    .tml-divorce-process-no {
        left: -65px;

        width: 42px;
        height: 42px;
    }


    .tml-practice-divorce
    .tml-divorce-process-dot {
        left: -38px;
    }


    .tml-practice-divorce
    .tml-divorce-process-step p {
        font-size: 13px;
    }


    .tml-practice-divorce
    .tml-practice-law-table {
        overflow-x: auto;
    }


    .tml-practice-divorce
    .tml-practice-law-table > div {
        min-width: 700px;
    }


    .tml-practice-divorce
    .tml-divorce-court-route {
        grid-template-columns: 1fr;
    }


    .tml-practice-divorce
    .tml-divorce-faq-deck {
        grid-template-columns: 1fr;
    }


    .tml-practice-divorce
    .tml-divorce-faq-answer-stage {
        min-height: 540px;

        border-radius:
            17px 17px 45px 17px;
    }


    .tml-practice-divorce
    .tml-divorce-faq-answer {
        padding:
            30px 23px;
    }


    .tml-practice-divorce
    .tml-divorce-faq-answer p {
        font-size: 13px;
    }


    /* DARK SCOPE SCROLLER */

    .tml-practice-divorce
    .tml-practice-scope-track {
        display: flex;

        gap: 14px;

        overflow-x: auto;

        padding-bottom: 15px;

        scroll-snap-type:
            x mandatory;

        scrollbar-width: none;
    }


    .tml-practice-divorce
    .tml-practice-scope-track::-webkit-scrollbar {
        display: none;
    }


    .tml-practice-divorce
    .tml-practice-scope-track a {
        min-width: 255px;

        scroll-snap-align: start;
    }


    .tml-practice-divorce
    .tml-practice-scope::before {
        font-size: 170px;

        right: -30px;
        top: -30px;
    }


    .tml-practice-divorce
    .tml-practice-consult-layout {
        grid-template-columns: 1fr;
    }


    .tml-practice-divorce
    .tml-practice-consult-details {
        grid-template-columns: 1fr;
    }


    .tml-practice-divorce
    .tml-practice-consult-actions {
        grid-column: auto;

        flex-direction: column;
    }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .tml-practice-divorce
    .tml-practice-reveal {
        opacity: 1;

        transform: none;

        transition: none;
    }


    .tml-practice-divorce
    .tml-divorce-ground,
    .tml-practice-divorce
    .tml-practice-review,
    .tml-practice-divorce
    .tml-practice-scope-track a {
        transition: none;
    }

}


/* =========================================================
   DOCUMENTATION
   PAGE-SPECIFIC EXTENSIONS
========================================================= */


/* =========================================================
   HERO
========================================================= */

.tml-practice-documentation
.tml-documentation-hero-visual {
    min-height: 240px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 18px;
    padding: 18px;
    border-radius: 18px;
    background: rgba(255, 255, 255, .055);
}

.tml-practice-documentation
.tml-documentation-hero-visual svg {
    width: 100%;
    max-width: 300px;
}


/* =========================================================
   JUMP NAVIGATION
========================================================= */

.tml-practice-documentation
.tml-doc-jump {
    padding: 21px 0;
    border-bottom: 1px solid var(--practice-border);
    background: #fff;
}

.tml-practice-documentation
.tml-doc-jump .tml-shell {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 25px;
    align-items: center;
}

.tml-practice-documentation
.tml-doc-jump-label {
    color: var(--practice-gold-dark);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.tml-practice-documentation
.tml-doc-jump-links {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.tml-practice-documentation
.tml-doc-jump-links a {
    padding: 7px 11px;
    border: 1px solid var(--practice-border);
    border-radius: 999px;
    color: var(--practice-muted);
    background: var(--practice-paper);
    font-size: 10px;
    text-decoration: none;
    transition:
        color .25s ease,
        background .25s ease,
        border-color .25s ease,
        transform .25s ease;
}

.tml-practice-documentation
.tml-doc-jump-links a:hover {
    transform: translateY(-2px);
    color: #fff;
    border-color: var(--practice-navy);
    background: var(--practice-navy);
}


/* =========================================================
   INTRO
========================================================= */

.tml-practice-documentation
.tml-doc-intro {
    padding: 105px 0;
    background: var(--practice-cream);
}

.tml-practice-documentation
.tml-doc-intro-layout {
    display: grid;
    grid-template-columns: 1fr .8fr;
    gap: 70px;
    align-items: center;
}

.tml-practice-documentation
.tml-doc-intro-copy h2 {
    margin: 14px 0 0;
    color: var(--practice-navy);
    font-family: Georgia, serif;
    font-size: clamp(42px, 4.3vw, 61px);
    font-weight: 500;
    line-height: 1.06;
}

.tml-practice-documentation
.tml-doc-intro-copy h2 em {
    display: block;
    color: var(--practice-gold-dark);
    font-style: italic;
}

.tml-practice-documentation
.tml-doc-intro-copy p {
    max-width: 720px;
    margin-top: 18px;
    color: var(--practice-muted);
    font-size: 15px;
    line-height: 1.82;
}


/* =========================================================
   LEGEND
========================================================= */

.tml-practice-documentation
.tml-doc-legend {
    padding: 30px;
    border: 1px solid var(--practice-border);
    border-radius: 18px 18px 52px 18px;
    background: #fff;
    box-shadow: 0 20px 50px rgba(15, 29, 45, .05);
}

.tml-practice-documentation
.tml-doc-legend-title {
    display: block;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--practice-border);
    color: var(--practice-navy);
    font-family: Georgia, serif;
    font-size: 22px;
}

.tml-practice-documentation
.tml-doc-legend > div {
    display: grid;
    grid-template-columns: 36px 1fr;
    gap: 12px;
    padding: 18px 0;
    border-bottom: 1px solid var(--practice-border);
}

.tml-practice-documentation
.tml-doc-legend > div:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.tml-practice-documentation
.tml-doc-legend p {
    margin: 0;
    color: var(--practice-muted);
    font-size: 12px;
    line-height: 1.6;
}

.tml-practice-documentation
.tml-doc-legend strong {
    display: block;
    margin-bottom: 3px;
    color: var(--practice-navy);
    font-size: 13px;
}


/* =========================================================
   STATUS MARKERS
========================================================= */

.tml-practice-documentation
.tml-doc-status {
    width: 29px;
    height: 29px;
    flex: 0 0 29px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 11px;
    font-weight: 800;
}

.tml-practice-documentation
.tml-doc-status.is-mandatory {
    color: #387f5c;
    background: rgba(56, 127, 92, .11);
}

.tml-practice-documentation
.tml-doc-status.is-situational {
    color: var(--practice-gold-dark);
    border: 1px solid rgba(201, 154, 72, .33);
    background: transparent;
}


/* =========================================================
   DARK PRE-FILE SECTION
========================================================= */

.tml-practice-documentation
.tml-doc-prefile {
    position: relative;
    padding: 95px 0;
    overflow: hidden;
    background: var(--practice-navy);
}

.tml-practice-documentation
.tml-doc-prefile::after {
    content: "FILE";
    position: absolute;
    right: -40px;
    top: -60px;
    color: rgba(255, 255, 255, .018);
    font-family: Georgia, serif;
    font-size: 250px;
    line-height: 1;
}

.tml-practice-documentation
.tml-doc-prefile-layout {
    position: relative;
    z-index: 2;
}

.tml-practice-documentation
.tml-doc-prefile-head {
    max-width: 800px;
}

.tml-practice-documentation
.tml-doc-prefile-head h2 {
    margin: 14px 0 0;
    color: #fff;
    font-family: Georgia, serif;
    font-size: clamp(42px, 4.3vw, 61px);
    font-weight: 500;
    line-height: 1.06;
}

.tml-practice-documentation
.tml-doc-prefile-head h2 em {
    display: block;
    color: #e1b96c;
    font-style: italic;
}

.tml-practice-documentation
.tml-doc-prefile-rules {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1px;
    margin-top: 45px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 18px;
    background: rgba(255, 255, 255, .1);
}

.tml-practice-documentation
.tml-doc-prefile-rules article {
    min-height: 220px;
    padding: 24px;
    background: rgba(255, 255, 255, .045);
    transition: background .3s ease;
}

.tml-practice-documentation
.tml-doc-prefile-rules article:hover {
    background: rgba(255, 255, 255, .075);
}

.tml-practice-documentation
.tml-doc-prefile-rules span {
    color: #e1b96c;
    font-family: Georgia, serif;
    font-size: 14px;
}

.tml-practice-documentation
.tml-doc-prefile-rules strong {
    display: block;
    margin-top: 30px;
    color: #fff;
    font-family: Georgia, serif;
    font-size: 19px;
    font-weight: 500;
}

.tml-practice-documentation
.tml-doc-prefile-rules p {
    margin-top: 9px;
    color: rgba(255, 255, 255, .52);
    font-size: 11px;
    line-height: 1.65;
}


/* =========================================================
   DOCUMENT LIBRARY
========================================================= */

.tml-practice-documentation
.tml-doc-library {
    padding: 105px 0;
    background: #f8f7f3;
}

.tml-practice-documentation
.tml-doc-library-layout {
    display: grid;
    grid-template-columns: 225px minmax(0, 1fr);
    gap: 36px;
    align-items: start;
}


/* =========================================================
   STICKY GUIDE
========================================================= */

.tml-practice-documentation
.tml-doc-library-index {
    position: sticky;
    top: 115px;
}


/* =========================================================
   CASE FILES
========================================================= */

.tml-practice-documentation
.tml-doc-case-files {
    display: grid;
    gap: 34px;
}

.tml-practice-documentation
.tml-doc-case-file {
    position: relative;
    padding: 34px;
    scroll-margin-top: 115px;
    border: 1px solid var(--practice-border);
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 18px 45px rgba(15, 29, 45, .045);
}

.tml-practice-documentation
.tml-doc-case-file::before {
    content: "";
    position: absolute;
    top: 0;
    left: 34px;
    right: 34px;
    height: 3px;
    border-radius: 0 0 8px 8px;
    background: var(--doc-accent, var(--practice-gold));
}


/* =========================================================
   ACCENT VARIANTS
========================================================= */

.tml-practice-documentation
.tml-doc-accent-gold {
    --doc-accent: #c69a48;
}

.tml-practice-documentation
.tml-doc-accent-blue {
    --doc-accent: #4d7fa4;
}

.tml-practice-documentation
.tml-doc-accent-green {
    --doc-accent: #4b8a68;
}

.tml-practice-documentation
.tml-doc-accent-violet {
    --doc-accent: #746aa2;
}

.tml-practice-documentation
.tml-doc-accent-red {
    --doc-accent: #ae5b55;
}

.tml-practice-documentation
.tml-doc-accent-rose {
    --doc-accent: #a65f79;
}

.tml-practice-documentation
.tml-doc-accent-navy {
    --doc-accent: #273d59;
}


/* =========================================================
   CASE HEADER
========================================================= */

.tml-practice-documentation
.tml-doc-case-header {
    display: grid;
    grid-template-columns: 64px 1fr;
    gap: 19px;
    align-items: start;
}

.tml-practice-documentation
.tml-doc-case-number {
    width: 56px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 15px;
    color: var(--doc-accent);
    background: color-mix(
        in srgb,
        var(--doc-accent) 10%,
        white
    );
    font-family: Georgia, serif;
    font-size: 17px;
}

.tml-practice-documentation
.tml-doc-case-header > div:last-child > span {
    color: var(--doc-accent);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.tml-practice-documentation
.tml-doc-case-header h2 {
    margin: 6px 0 0;
    color: var(--practice-navy);
    font-family: Georgia, serif;
    font-size: 30px;
    font-weight: 500;
    line-height: 1.15;
}

.tml-practice-documentation
.tml-doc-case-header p {
    max-width: 720px;
    margin-top: 8px;
    color: var(--practice-muted);
    font-size: 13px;
    line-height: 1.65;
}


/* =========================================================
   DOCUMENT GROUPS
========================================================= */

.tml-practice-documentation
.tml-doc-group {
    margin-top: 29px;
    overflow: hidden;
    border: 1px solid var(--practice-border);
    border-radius: 15px;
    background: #f7f7f5;
}

.tml-practice-documentation
.tml-doc-group-title {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 16px 18px;
    background: var(--practice-navy);
}

.tml-practice-documentation
.tml-doc-group-title > span {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--doc-accent);
}

.tml-practice-documentation
.tml-doc-group-title h3 {
    margin: 0;
    color: #fff;
    font-family: Georgia, serif;
    font-size: 17px;
    font-weight: 500;
}


/* =========================================================
   DOCUMENT ITEMS
   INDIVIDUAL RECTANGULAR CARDS
========================================================= */

.tml-practice-documentation
.tml-doc-items {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    padding: 18px;
    background: #f7f7f5;
}


/* Each document is now an independent card */

.tml-practice-documentation
.tml-doc-item {
    position: relative;
    min-height: 122px;

    display: grid;
    grid-template-columns: 34px 1fr;
    gap: 13px;

    align-items: start;

    padding: 19px 20px;

    overflow: hidden;

    border: 1px solid var(--practice-border);
    border-radius: 13px;

    background: #fff;

    box-shadow:
        0 5px 15px rgba(15, 29, 45, .025);

    transition:
        transform .28s ease,
        border-color .28s ease,
        box-shadow .28s ease,
        background .28s ease;
}


/* Accent line only on hover */

.tml-practice-documentation
.tml-doc-item::after {
    content: "";

    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;

    width: 3px;

    background: var(--doc-accent);

    opacity: 0;

    transition:
        opacity .28s ease;
}


/* Hover */

.tml-practice-documentation
.tml-doc-item:hover {
    transform: translateY(-3px);

    border-color:
        color-mix(
            in srgb,
            var(--doc-accent) 28%,
            #d8dce0
        );

    background:
        color-mix(
            in srgb,
            var(--doc-accent) 3%,
            white
        );

    box-shadow:
        0 12px 28px rgba(15, 29, 45, .065);
}

.tml-practice-documentation
.tml-doc-item:hover::after {
    opacity: 1;
}


/* Prevent odd count from stretching */

.tml-practice-documentation
.tml-doc-item:last-child:nth-child(odd) {
    grid-column: auto;
}


/* Status icon */

.tml-practice-documentation
.tml-doc-item
.tml-doc-status {
    margin-top: 1px;
}


/* Document title */

.tml-practice-documentation
.tml-doc-item strong {
    display: block;

    color: var(--practice-navy);

    font-family: Georgia, serif;

    font-size: 15px;

    font-weight: 500;

    line-height: 1.35;
}


/* Document description */

.tml-practice-documentation
.tml-doc-item p {
    margin: 7px 0 0;

    color: var(--practice-muted);

    font-size: 11px;

    line-height: 1.62;
}


/* =========================================================
   PRACTICE NOTE
========================================================= */

.tml-practice-documentation
.tml-doc-case-note {
    margin-top: 18px;
    padding: 20px 22px;
    border-left: 3px solid var(--doc-accent);
    background:
        color-mix(
            in srgb,
            var(--doc-accent) 7%,
            white
        );
}

.tml-practice-documentation
.tml-doc-case-note > span {
    display: block;
    color: var(--doc-accent);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.tml-practice-documentation
.tml-doc-case-note p {
    margin: 7px 0 0;
    color: var(--practice-muted);
    font-size: 12px;
    line-height: 1.65;
}


/* =========================================================
   BEST PRACTICES
========================================================= */

.tml-practice-documentation
.tml-doc-best {
    padding: 105px 0;
    background: #fff;
}

.tml-practice-documentation
.tml-doc-best-head {
    max-width: 820px;
}

.tml-practice-documentation
.tml-doc-best-head h2 {
    margin: 14px 0 0;
    color: var(--practice-navy);
    font-family: Georgia, serif;
    font-size: clamp(42px, 4.3vw, 61px);
    font-weight: 500;
    line-height: 1.06;
}

.tml-practice-documentation
.tml-doc-best-head h2 em {
    display: block;
    color: var(--practice-gold-dark);
    font-style: italic;
}

.tml-practice-documentation
.tml-doc-best-head p {
    max-width: 720px;
    margin-top: 18px;
    color: var(--practice-muted);
    font-size: 15px;
    line-height: 1.82;
}

.tml-practice-documentation
.tml-doc-best-grid {
    margin-top: 38px;
    border-top: 1px solid var(--practice-border);
}

.tml-practice-documentation
.tml-doc-best-item {
    display: grid;
    grid-template-columns: 55px 1fr;
    gap: 18px;
    padding: 22px 0;
    border-bottom: 1px solid var(--practice-border);
    transition:
        padding-left .25s ease,
        background .25s ease;
}

.tml-practice-documentation
.tml-doc-best-item:hover {
    padding-left: 10px;
    background:
        linear-gradient(
            90deg,
            rgba(201, 154, 72, .055),
            transparent
        );
}

.tml-practice-documentation
.tml-doc-best-no {
    width: 39px;
    height: 39px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: var(--practice-gold-dark);
    background: rgba(201, 154, 72, .11);
    font-size: 10px;
}

.tml-practice-documentation
.tml-doc-best-item h3 {
    margin: 0;
    color: var(--practice-navy);
    font-family: Georgia, serif;
    font-size: 20px;
    font-weight: 500;
}

.tml-practice-documentation
.tml-doc-best-item p {
    max-width: 850px;
    margin: 6px 0 0;
    color: var(--practice-muted);
    font-size: 13px;
    line-height: 1.65;
}


/* =========================================================
   FAQ
========================================================= */

.tml-practice-documentation
.tml-doc-faq {
    padding: 105px 0;
    background: var(--practice-cream);
}

.tml-practice-documentation
.tml-doc-faq-inner {
    max-width: 1080px;
    margin: 0 auto;
}


/* =========================================================
   TABLET — 1100PX
========================================================= */

@media (max-width: 1100px) {

    .tml-practice-documentation
    .tml-doc-library-layout {
        grid-template-columns: 190px minmax(0, 1fr);
        gap: 25px;
    }


    .tml-practice-documentation
    .tml-doc-prefile-rules {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}


/* =========================================================
   TABLET — 900PX
========================================================= */

@media (max-width: 900px) {

    .tml-practice-documentation
    .tml-doc-intro-layout {
        grid-template-columns: 1fr;
        gap: 40px;
    }


    .tml-practice-documentation
    .tml-doc-library-layout {
        display: block;
    }


    .tml-practice-documentation
    .tml-doc-library-index {
        position: relative;
        top: auto;
        margin-bottom: 30px;
    }


    .tml-practice-documentation
    .tml-doc-items {
        gap: 12px;
        padding: 15px;
    }


    .tml-practice-documentation
    .tml-doc-item {
        padding: 17px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 720px) {

    .tml-practice-documentation
    .tml-doc-intro,

    .tml-practice-documentation
    .tml-doc-prefile,

    .tml-practice-documentation
    .tml-doc-library,

    .tml-practice-documentation
    .tml-doc-best,

    .tml-practice-documentation
    .tml-doc-faq {
        padding: 75px 0;
    }


    /* Jump navigation */

    .tml-practice-documentation
    .tml-doc-jump .tml-shell {
        grid-template-columns: 1fr;
        gap: 12px;
    }


    .tml-practice-documentation
    .tml-doc-jump-links {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 6px;
    }


    .tml-practice-documentation
    .tml-doc-jump-links a {
        flex: 0 0 auto;
    }


    /* Pre-file */

    .tml-practice-documentation
    .tml-doc-prefile-rules {
        grid-template-columns: 1fr;
    }


    /* Case file */

    .tml-practice-documentation
    .tml-doc-case-file {
        padding: 24px 18px;
    }


    .tml-practice-documentation
    .tml-doc-case-file::before {
        left: 18px;
        right: 18px;
    }


    /* Case header */

    .tml-practice-documentation
    .tml-doc-case-header {
        grid-template-columns: 48px 1fr;
        gap: 13px;
    }


    .tml-practice-documentation
    .tml-doc-case-number {
        width: 44px;
        height: 44px;
        border-radius: 12px;
        font-size: 14px;
    }


    .tml-practice-documentation
    .tml-doc-case-header h2 {
        font-size: 25px;
    }


    /* Document cards */

    .tml-practice-documentation
    .tml-doc-items {
        grid-template-columns: 1fr;

        gap: 11px;

        padding: 13px;
    }


    .tml-practice-documentation
    .tml-doc-item {
        min-height: auto;

        grid-template-columns:
            32px 1fr;

        gap: 11px;

        padding:
            16px 15px;
    }


    .tml-practice-documentation
    .tml-doc-item:last-child:nth-child(odd) {
        grid-column: auto;
    }


    /* Background decoration */

    .tml-practice-documentation
    .tml-doc-prefile::after {
        font-size: 140px;
        top: -10px;
    }

}