/* ORVI unified stylesheet: shared styles, dark mode, RTL, and treatment page styles. */



/* ===== merged from style.css ===== */
/* =========================================================
   ORVI ABOUT PAGE
   ========================================================= */

:root{
    --violet:#6651a8;
    --violet-dark:#4d3b86;
    --violet-soft:#eee9fb;

    --lavender:#f7f4ff;
    --lavender-2:#ede8fa;

    --ink:#272238;
    --ink-soft:#4f4960;
    --muted:#746d82;

    --white:#ffffff;
    --paper:#fffdf9;

    --border:rgba(91,72,139,.16);

    --shadow:0 22px 55px rgba(58,44,92,.12);
    --shadow-soft:0 12px 32px rgba(58,44,92,.08);

    --radius:24px;

    --header-height:76px;

    --serif:"Playfair Display",serif;
    --sans:"DM Sans",sans-serif;

    --transition:.35s cubic-bezier(.2,.75,.25,1);
}

/* =========================================================
   RESET
   ========================================================= */

*{
    box-sizing:border-box;
    margin:0;
    padding:0;
}

html{
    scroll-behavior:smooth;
    scroll-padding-top:var(--header-height);
}

body{
    font-family:var(--sans);
    background:var(--paper);
    color:var(--ink);
    font-size:15px;
    line-height:1.65;
    overflow-x:hidden;
    padding-top:var(--header-height);
    transition:
        background .35s ease,
        color .35s ease;
}

img{
    display:block;
    max-width:100%;
}

button,
a{
    font:inherit;
}

button{
    cursor:pointer;
}

a{
    color:inherit;
    text-decoration:none;
}

p{
    font-size:15px;
}

.container{
    width:min(1180px,calc(100% - 48px));
    margin-inline:auto;
}

/* =========================================================
   DARK MODE
   ========================================================= */





















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

.site-header{
    position:fixed;
    top:0;
    left:0;
    right:0;
    height:var(--header-height);
    z-index:99999;

    background:rgba(255,253,249,.94);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);

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

    transition:
        background .3s ease,
        border .3s ease;
}

.navbar{
    height:var(--header-height);

    display:flex;
    align-items:center;

    gap:26px;
    min-width:0;
}

.brand{
    display:flex;
    align-items:center;
    gap:10px;

    flex:0 0 auto;
    min-width:0;
}

.brand-mark{
    width:46px;
    height:46px;
    min-width:46px;

    border-radius:15px;

    display:grid;
    place-items:center;

    background:linear-gradient(
        145deg,
        var(--violet),
        var(--violet-dark)
    );

    color:#fff;

    box-shadow:0 10px 25px rgba(102,81,168,.25);
}

.brand-tooth{
    width:27px;
    height:30px;

    fill:none;
    stroke:currentColor;
    stroke-width:2.2;
}

.brand-text{
    display:flex;
    flex-direction:column;
    min-width:0;
}

.brand-name{
    font-family:var(--serif);
    font-size:27px;
    line-height:1;
    font-weight:700;
    letter-spacing:.03em;
}

.brand-sub{
    margin-top:4px;

    font-size:9px;
    line-height:1;
    font-weight:700;
    letter-spacing:.11em;
    text-transform:uppercase;

    color:var(--muted);

    white-space:nowrap;
}

.nav-links{
    margin-left:auto;

    display:flex;
    align-items:center;
    gap:3px;

    min-width:0;
}

.nav-links > a,
.nav-dropdown > button{
    border:0;
    background:transparent;

    color:var(--ink-soft);

    padding:10px 10px;

    border-radius:12px;

    font-size:14px;
    font-weight:600;

    white-space:nowrap;

    transition:
        color .25s ease,
        background .25s ease;
}

.nav-links > a:hover,
.nav-dropdown > button:hover,
.nav-links > a.active{
    color:var(--violet);
    background:var(--violet-soft);
}

.nav-dropdown{
    position:relative;
}

.nav-dropdown > button{
    display:flex;
    align-items:center;
    gap:5px;
}

.chevron{
    font-size:14px;
    line-height:1;
}

.dropdown-menu{
    position:absolute;

    top:calc(100% + 10px);
    left:50%;

    transform:
        translate(-50%,8px)
        scale(.97);

    width:180px;

    padding:8px;

    background:var(--white);

    border:1px solid var(--border);
    border-radius:16px;

    box-shadow:var(--shadow);

    opacity:0;
    visibility:hidden;

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

.nav-dropdown.is-open .dropdown-menu{
    opacity:1;
    visibility:visible;

    transform:
        translate(-50%,0)
        scale(1);
}

.dropdown-menu a{
    display:block;

    padding:10px 12px;

    border-radius:10px;

    font-size:14px;
    font-weight:600;

    color:var(--ink-soft);

    transition:
        background .25s ease,
        color .25s ease;
}

.dropdown-menu a:hover,
.dropdown-menu a.active{
    background:var(--violet-soft);
    color:var(--violet);
}

.nav-actions{
    display:flex;
    align-items:center;
    gap:7px;

    flex:0 0 auto;
}

.icon-btn{
    width:40px;
    height:40px;
    min-width:40px;

    display:grid;
    place-items:center;

    border:1px solid var(--border);
    border-radius:50%;

    background:var(--white);
    color:var(--ink);

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

.icon-btn:hover{
    transform:translateY(-2px);
    border-color:rgba(102,81,168,.35);
    color:var(--violet);
}

.btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    min-height:42px;

    padding:0 18px;

    border-radius:999px;

    font-size:14px;
    font-weight:700;

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

.btn-primary{
    background:var(--violet);
    color:#fff;

    box-shadow:0 10px 25px rgba(102,81,168,.22);
}

.btn-primary:hover{
    transform:translateY(-2px);
    box-shadow:0 15px 30px rgba(102,81,168,.28);
}

.btn-outline{
    border:1px solid var(--border);
    background:var(--white);
    color:var(--ink);
}

.btn-outline:hover{
    transform:translateY(-2px);
    border-color:var(--violet);
    color:var(--violet);
}

/* =========================================================
   HAMBURGER
   ========================================================= */

.menu-toggle{
    display:none;

    position:relative;

    width:42px;
    height:42px;
    min-width:42px;

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

    padding:0;

    border:1px solid var(--border);
    border-radius:50%;

    background:var(--white);
    color:var(--ink);

    overflow:visible;
}

.hamburger-icon{
    width:20px;
    height:16px;

    display:flex;
    flex-direction:column;
    justify-content:space-between;

    line-height:0;
}

.hamburger-icon span{
    display:block;

    width:20px;
    height:2px;
    flex:0 0 2px;

    border-radius:999px;

    background:currentColor;

    transform-origin:center;

    transition:
        transform .25s ease,
        opacity .18s ease;
}

.menu-toggle[aria-expanded="true"]
.hamburger-icon{
    justify-content:center;
}

.menu-toggle[aria-expanded="true"]
.hamburger-icon span:nth-child(1){
    transform:translateY(1px) rotate(45deg);
}

.menu-toggle[aria-expanded="true"]
.hamburger-icon span:nth-child(2){
    opacity:0;
    transform:scaleX(0);
}

.menu-toggle[aria-expanded="true"]
.hamburger-icon span:nth-child(3){
    transform:translateY(-1px) rotate(-45deg);
}

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

.mobile-panel{
    position:fixed;

    top:calc(var(--header-height) + 10px);
    left:15px;
    right:15px;

    max-height:calc(100dvh - var(--header-height) - 24px);

    overflow-y:auto;
    overflow-x:hidden;

    padding:12px;

    background:var(--white);

    border:1px solid var(--border);
    border-radius:20px;

    box-shadow:var(--shadow);

    opacity:0;
    visibility:hidden;

    transform:translateY(-10px);

    transition:
        opacity .25s ease,
        transform .25s ease,
        visibility .25s ease;

    z-index:99998;
}

.mobile-panel.open{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
}

.mobile-panel a,
.mobile-panel button{
    width:100%;

    min-height:46px;

    display:flex;
    align-items:center;
    justify-content:space-between;

    padding:0 14px;

    border:0;
    border-radius:12px;

    background:transparent;

    color:var(--ink);

    font-size:14px;
    font-weight:600;

    text-align:left;
}

.mobile-panel a:hover,
.mobile-panel button:hover{
    background:var(--violet-soft);
    color:var(--violet);
}

.mobile-home-links{
    display:none;
    padding:4px 0 6px 12px;
}

.mobile-home-links.open{
    display:block;
}

.mobile-home-links a{
    min-height:40px;
    font-size:13px;
}

.mobile-divider{
    height:1px;
    margin:8px 0;

    background:var(--border);
}

/* =========================================================
   GENERAL
   ========================================================= */

.section{
    position:relative;
    padding:96px 0;
}

.section-heading{
    max-width:760px;
    margin-bottom:50px;
}

.section-kicker{
    display:inline-flex;
    align-items:center;
    gap:9px;

    margin-bottom:14px;

    color:var(--violet);

    font-size:14px;
    font-weight:800;
    letter-spacing:.13em;
    text-transform:uppercase;
}

.section-kicker::before{
    content:"";

    width:30px;
    height:2px;

    border-radius:999px;

    background:var(--violet);
}

.section-heading h2{
    font-family:var(--serif);

    font-size:clamp(36px,4.2vw,56px);
    line-height:1.08;

    letter-spacing:-.025em;

    margin-bottom:18px;
}

.section-heading p{
    max-width:680px;

    color:var(--muted);

    font-size:16px;
    line-height:1.8;
}

/* =========================================================
   SECTION 1 — ABOUT HERO
   ========================================================= */

.hero{
    min-height:650px;

    display:flex;
    align-items:center;

    overflow:hidden;

    background:
        radial-gradient(
            circle at 78% 22%,
            rgba(102,81,168,.16),
            transparent 30%
        ),
        linear-gradient(
            135deg,
            #f7f4ff 0%,
            #fffdf9 60%,
            #f2eefc 100%
        );
}

.hero-grid{
    display:grid;

    grid-template-columns:
        minmax(0,1.05fr)
        minmax(360px,.95fr);

    gap:70px;

    align-items:center;
}

.hero-copy{
    position:relative;
    z-index:2;
}

.hero-badge{
    display:inline-flex;
    align-items:center;
    gap:8px;

    padding:8px 13px;

    margin-bottom:22px;

    border:1px solid var(--border);
    border-radius:999px;

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

    color:var(--violet);

    font-size:13px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
}



.hero-copy h1{
    max-width:760px;

    font-family:var(--serif);

    font-size:clamp(48px,6vw,76px);
    line-height:1.02;

    letter-spacing:-.04em;

    margin-bottom:22px;
}

.hero-copy h1 span{
    color:var(--violet);
}

.hero-copy > p{
    max-width:650px;

    color:var(--ink-soft);

    font-size:17px;
    line-height:1.8;

    margin-bottom:30px;
}

.hero-buttons{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
}

.hero-stats{
    display:flex;
    flex-wrap:wrap;

    gap:28px;

    margin-top:42px;
}

.hero-stat{
    display:flex;
    flex-direction:column;
}

.hero-stat strong{
    font-family:var(--serif);

    font-size:27px;
    line-height:1;

    color:var(--ink);
}

.hero-stat span{
    margin-top:7px;

    font-size:13px;
    color:var(--muted);
}

.hero-visual{
    position:relative;

    min-height:520px;
}

.hero-image{
    position:absolute;

    inset:10px 25px 30px 25px;

    overflow:hidden;

    border-radius:32px;

    box-shadow:var(--shadow);

    transform:rotate(1deg);
}

.hero-image img{
    width:100%;
    height:100%;

    object-fit:cover;
}

.hero-image::after{
    content:"";

    position:absolute;
    inset:0;

    background:
        linear-gradient(
            180deg,
            transparent 55%,
            rgba(30,20,55,.25)
        );
}

.hero-floating{
    position:absolute;

    display:flex;
    align-items:center;
    gap:11px;

    padding:13px 16px;

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

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

    box-shadow:var(--shadow-soft);

    backdrop-filter:blur(12px);

    animation:floatCard 4s ease-in-out infinite;
}



.hero-floating.one{
    top:60px;
    left:0;
}

.hero-floating.two{
    right:0;
    bottom:75px;

    animation-delay:-2s;
}

.hero-floating-icon{
    width:36px;
    height:36px;

    display:grid;
    place-items:center;

    border-radius:12px;

    background:var(--violet-soft);
    color:var(--violet);

    font-size:17px;
}

.hero-floating strong{
    display:block;
    font-size:13px;
}

.hero-floating span{
    display:block;

    margin-top:2px;

    color:var(--muted);

    font-size:11px;
}

@keyframes floatCard{
    0%,100%{
        transform:translateY(0);
    }

    50%{
        transform:translateY(-9px);
    }
}

/* =========================================================
   SECTION 2 — HISTORY
   ========================================================= */

.history{
    background:var(--lavender);
}

.history-grid{
    display:grid;

    grid-template-columns:
        minmax(300px,.85fr)
        minmax(0,1.15fr);

    gap:65px;

    align-items:center;
}

.history-visual{
    position:relative;

    min-height:470px;
}

.history-main-image{
    position:absolute;

    inset:0 40px 35px 0;

    overflow:hidden;

    border-radius:30px;

    box-shadow:var(--shadow);
}

.history-main-image img{
    width:100%;
    height:100%;

    object-fit:cover;
}

.history-year{
    position:absolute;

    right:0;
    bottom:0;

    width:170px;
    height:170px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    background:var(--violet);

    color:#fff;

    box-shadow:0 20px 40px rgba(102,81,168,.28);

    z-index:2;
}

.history-year strong{
    font-family:var(--serif);

    font-size:42px;
    line-height:1;
}

.history-year span{
    margin-top:7px;

    font-size:12px;
    letter-spacing:.1em;
    text-transform:uppercase;
}

.history-content .section-heading{
    margin-bottom:30px;
}

.history-content .section-heading h2{
    max-width:600px;
}

.history-copy{
    display:grid;
    gap:18px;

    color:var(--ink-soft);
}

.history-copy p{
    line-height:1.85;
}

.history-milestones{
    display:grid;

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

    gap:14px;

    margin-top:34px;
}

.history-milestone{
    padding:18px;

    background:var(--white);

    border:1px solid var(--border);
    border-radius:18px;

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

.history-milestone:hover{
    transform:translateY(-5px);
    box-shadow:var(--shadow-soft);
}

.history-milestone strong{
    display:block;

    font-family:var(--serif);

    color:var(--violet);

    font-size:23px;
}

.history-milestone span{
    display:block;

    margin-top:5px;

    color:var(--muted);

    font-size:13px;
}

/* =========================================================
   SECTION 3 — MISSION & VALUES
   ========================================================= */

.mission{
    background:var(--paper);
}

.mission-layout{
    display:grid;

    grid-template-columns:
        minmax(280px,.75fr)
        minmax(0,1.25fr);

    gap:60px;

    align-items:start;
}

.mission-statement{
    position:sticky;
    top:110px;
}

.mission-statement h2{
    font-family:var(--serif);

    font-size:clamp(38px,4.5vw,58px);
    line-height:1.05;

    margin-bottom:20px;
}

.mission-statement h2 span{
    color:var(--violet);
}

.mission-statement p{
    color:var(--muted);

    line-height:1.8;
}

.mission-quote{
    margin-top:28px;

    padding:20px;

    border-left:3px solid var(--violet);

    background:var(--lavender);

    border-radius:0 16px 16px 0;

    color:var(--ink-soft);

    font-family:var(--serif);
    font-size:17px;
    line-height:1.6;
}

.mission-cards{
    display:grid;

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

    gap:16px;
}

.mission-card{
    min-height:210px;

    padding:27px;

    border:1px solid var(--border);
    border-radius:24px;

    background:var(--white);

    box-shadow:var(--shadow-soft);

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

.mission-card:hover{
    transform:translateY(-7px);
    box-shadow:var(--shadow);
}

.mission-icon{
    width:46px;
    height:46px;

    display:grid;
    place-items:center;

    margin-bottom:22px;

    border-radius:14px;

    background:var(--violet-soft);
    color:var(--violet);

    font-size:20px;
}

.mission-card h3{
    font-family:var(--serif);

    font-size:23px;

    margin-bottom:9px;
}

.mission-card p{
    color:var(--muted);

    font-size:14px;
    line-height:1.75;
}

/* =========================================================
   SECTION 4 — TEAM
   ========================================================= */

.team{
    background:var(--lavender);
}

.team-heading-row{
    display:flex;
    align-items:end;
    justify-content:space-between;

    gap:30px;

    margin-bottom:45px;
}

.team-heading-row .section-heading{
    margin-bottom:0;
}

.team-note{
    max-width:300px;

    color:var(--muted);

    font-size:14px;
    line-height:1.7;
}

.doctors{
    display:grid;

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

    gap:20px;
}

.doctor-card{
    position:relative;

    overflow:hidden;

    background:var(--white);

    border:1px solid var(--border);
    border-radius:26px;

    box-shadow:var(--shadow-soft);

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

.doctor-card:hover{
    transform:translateY(-8px);
    box-shadow:var(--shadow);
}

.doctor-image{
    position:relative;

    height:350px;

    overflow:hidden;
}

.doctor-image img{
    width:100%;
    height:100%;

    object-fit:cover;

    transition:transform .5s ease;
}

.doctor-card:hover .doctor-image img{
    transform:scale(1.045);
}

.doctor-number{
    position:absolute;

    top:15px;
    left:15px;

    padding:7px 10px;

    border-radius:999px;

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

    color:var(--violet);

    font-size:11px;
    font-weight:800;
    letter-spacing:.08em;
}

.doctor-content{
    padding:22px;
}

.doctor-content h3{
    font-family:var(--serif);

    font-size:25px;
    line-height:1.15;

    margin-bottom:5px;
}

.doctor-role{
    color:var(--violet);

    font-size:13px;
    font-weight:800;

    letter-spacing:.05em;
}

.doctor-content p{
    margin-top:13px;

    color:var(--muted);

    font-size:14px;
    line-height:1.7;
}

.doctor-tags{
    display:flex;
    flex-wrap:wrap;

    gap:7px;

    margin-top:17px;
}

.doctor-tags span{
    padding:6px 9px;

    border-radius:999px;

    background:var(--lavender);

    color:var(--ink-soft);

    font-size:11px;
    font-weight:700;
}

/* =========================================================
   SECTION 5 — TESTIMONIALS
   ========================================================= */

.testimonials{
    background:var(--paper);
}

.testimonial-layout{
    display:grid;

    grid-template-columns:
        minmax(260px,.7fr)
        minmax(0,1.3fr);

    gap:60px;

    align-items:center;
}

.testimonial-intro h2{
    font-family:var(--serif);

    font-size:clamp(38px,4.5vw,58px);
    line-height:1.05;

    margin-bottom:20px;
}

.testimonial-intro h2 span{
    color:var(--violet);
}

.testimonial-intro p{
    color:var(--muted);

    line-height:1.8;
}

.rating-box{
    display:inline-flex;
    flex-direction:column;

    margin-top:28px;

    padding:18px 20px;

    border:1px solid var(--border);
    border-radius:20px;

    background:var(--lavender);
}

.rating-stars{
    color:#d7a947;

    letter-spacing:3px;

    font-size:17px;
}

.rating-box strong{
    margin-top:6px;

    font-family:var(--serif);

    font-size:25px;
}

.rating-box span{
    color:var(--muted);

    font-size:12px;
}

.testimonial-list{
    display:grid;

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

    gap:16px;
}

.testimonial-card{
    padding:25px;

    border:1px solid var(--border);
    border-radius:23px;

    background:var(--white);

    box-shadow:var(--shadow-soft);

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

.testimonial-card:hover{
    transform:translateY(-5px);
    box-shadow:var(--shadow);
}

.testimonial-top{
    display:flex;
    align-items:center;
    justify-content:space-between;

    margin-bottom:16px;
}

.patient{
    display:flex;
    align-items:center;
    gap:11px;
}

.patient-avatar{
    width:42px;
    height:42px;

    display:grid;
    place-items:center;

    border-radius:50%;

    background:var(--violet-soft);
    color:var(--violet);

    font-weight:800;
}

.patient strong{
    display:block;

    font-size:14px;
}

.patient span{
    display:block;

    margin-top:2px;

    color:var(--muted);

    font-size:11px;
}

.quote-mark{
    color:var(--violet);

    font-family:Georgia,serif;

    font-size:40px;
    line-height:.6;
}

.testimonial-card p{
    color:var(--ink-soft);

    font-size:14px;
    line-height:1.8;
}

/* =========================================================
   SECTION 6 — CTA
   ========================================================= */

.cta{
    background:var(--lavender);
}

.cta-box{
    position:relative;

    overflow:hidden;

    padding:65px;

    border-radius:32px;

    background:
        radial-gradient(
            circle at 88% 20%,
            rgba(255,255,255,.18),
            transparent 28%
        ),
        linear-gradient(
            135deg,
            var(--violet-dark),
            var(--violet)
        );

    color:#fff;

    box-shadow:0 25px 60px rgba(76,58,127,.25);
}

.cta-box::before,
.cta-box::after{
    content:"";

    position:absolute;

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

    border-radius:50%;
}

.cta-box::before{
    width:260px;
    height:260px;

    right:-90px;
    top:-100px;
}

.cta-box::after{
    width:170px;
    height:170px;

    left:-80px;
    bottom:-90px;
}

.cta-content{
    position:relative;
    z-index:2;

    max-width:760px;
}

.cta-content .section-kicker{
    color:#e6ddff;
}

.cta-content .section-kicker::before{
    background:#e6ddff;
}

.cta-content h2{
    font-family:var(--serif);

    font-size:clamp(38px,4.8vw,60px);
    line-height:1.05;

    margin-bottom:18px;
}

.cta-content p{
    max-width:650px;

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

    font-size:16px;
    line-height:1.8;

    margin-bottom:27px;
}

.cta-buttons{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
}

.cta .btn-primary{
    background:#fff;
    color:var(--violet);

    box-shadow:none;
}

.cta .btn-outline{
    border-color:rgba(255,255,255,.35);
    background:transparent;
    color:#fff;
}

/* =========================================================
   FOOTER
   ========================================================= */

.footer{
    padding:70px 0 22px;

    background:#211d2c;

    color:#fff;
}

.footer-grid{
    display:grid;

    grid-template-columns:
        1.25fr
        .7fr
        .9fr
        1fr;

    gap:42px;

    padding-bottom:50px;

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

.footer-brand .brand{
    color:#fff;
}

.footer-brand .brand-sub{
    color:#c7bfd7;
}

.footer-brand p{
    max-width:340px;

    margin-top:20px;

    color:#c8c2d2;

    font-size:14px;
    line-height:1.8;
}

.footer-socials{
    display:flex;
    gap:8px;

    margin-top:20px;
}

.social{
    width:38px;
    height:38px;

    display:grid;
    place-items:center;

    border:1px solid rgba(255,255,255,.14);
    border-radius:50%;

    color:#fff;

    font-size:12px;
    font-weight:800;

    transition:
        background .25s ease,
        transform .25s ease;
}

.social:hover{
    background:var(--violet);
    transform:translateY(-3px);
}

.footer-col{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
}

.footer-col h4{
    margin-bottom:17px;

    color:#fff;

    font-size:15px;
}

.footer-col a{
    margin-bottom:10px;

    color:#c8c2d2;

    font-size:14px;

    transition:
        color .25s ease,
        transform .25s ease;
}

.footer-col a:hover{
    color:#fff;
    transform:translateX(3px);
}

.footer-contact-item{
    display:flex;
    align-items:flex-start;
    gap:9px;

    margin-bottom:13px;

    color:#c8c2d2;

    font-size:14px;
    line-height:1.55;
}

.footer-contact-item span:first-child{
    color:#cfc2f5;
}

.footer-bottom{
    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:20px;

    padding-top:20px;
}

.footer-bottom p{
    color:#a9a2b4;
    font-size:14px;
}

.footer-bottom-links{
    display:flex;
    flex-wrap:wrap;
    gap:18px;
}

.footer-bottom-links a{
    color:#a9a2b4;
    font-size:14px;
}

.footer-bottom-links a:hover{
    color:#fff;
}

/* =========================================================
   BACK TO TOP
   ========================================================= */

.back-to-top{
    position:fixed;

    right:22px;
    bottom:22px;

    width:48px;
    height:48px;

    display:grid;
    place-items:center;

    border:1px solid rgba(102,81,168,.25);
    border-radius:15px;

    background:var(--violet);
    color:#fff;

    font-size:21px;
    font-weight:800;

    z-index:100000;

    opacity:0;
    visibility:hidden;

    transform:translateY(12px);

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

.back-to-top.show{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
}



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

.reveal{
    opacity:0;
    transform:translateY(28px);

    transition:
        opacity .75s ease,
        transform .75s cubic-bezier(.2,.75,.25,1);
}

.reveal.visible{
    opacity:1;
    transform:translateY(0);
}

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

@media(max-width:1200px){

    .container{
        width:min(1180px,calc(100% - 36px));
    }

    .nav-links{
        gap:0;
    }

    .nav-links > a,
    .nav-dropdown > button{
        padding-inline:8px;
    }

    .hero-grid{
        gap:45px;
    }

    .hero-copy h1{
        font-size:clamp(46px,6vw,66px);
    }

    .hero-visual{
        min-height:470px;
    }

    .history-grid,
    .testimonial-layout,
    .mission-layout{
        gap:42px;
    }

    .footer-grid{
        gap:30px;
    }
}

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

@media(max-width:900px){

    :root{
        --header-height:68px;
    }

    body{
        padding-top:68px;
    }

    .site-header{
        height:68px;
    }

    .navbar{
        height:68px;
        gap:10px;
    }

    .nav-links{
        display:none;
    }

    .nav-actions > .btn{
        display:none;
    }

    .menu-toggle{
        display:flex;
    }

    .hero{
        min-height:auto;
        padding:80px 0;
    }

    .hero-grid{
        grid-template-columns:1fr;
        gap:45px;
    }

    .hero-copy{
        max-width:800px;
    }

    .hero-visual{
        width:100%;
        max-width:650px;
        margin-inline:auto;
        min-height:500px;
    }

    .history-grid{
        grid-template-columns:1fr;
        gap:45px;
    }

    .history-visual{
        max-width:600px;
        width:100%;
        margin-inline:auto;
    }

    .mission-layout{
        grid-template-columns:1fr;
    }

    .mission-statement{
        position:static;
        max-width:700px;
    }

    .team-heading-row{
        align-items:flex-start;
        flex-direction:column;
    }

    .doctors{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .testimonial-layout{
        grid-template-columns:1fr;
    }

    .testimonial-intro{
        max-width:700px;
    }

    .footer-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }
}

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

@media(max-width:600px){

    :root{
        --header-height:64px;
    }

    body{
        padding-top:64px;
    }

    .site-header{
        height:64px;
    }

    .container{
        width:calc(100% - 24px);
    }

    .navbar{
        height:64px;
        gap:7px;
    }

    .brand{
        gap:8px;
        min-width:0;
        flex:1 1 auto;
        overflow:hidden;
    }

    .brand-mark{
        width:39px;
        height:39px;
        min-width:39px;
        border-radius:12px;
    }

    .brand-tooth{
        width:23px;
        height:25px;
    }

    .brand-name{
        font-size:22px;
    }

    .brand-sub{
        font-size:8px;
        max-width:180px;
        overflow:hidden;
        text-overflow:ellipsis;
    }

    .nav-actions{
        gap:5px;
    }

    .nav-actions .icon-btn{
        width:40px;
        height:40px;
        min-width:40px;
    }

    .menu-toggle{
        width:40px;
        height:40px;
        min-width:40px;
    }

    .hero{
        padding:65px 0;
    }

    .hero-grid{
        gap:35px;
    }

    .hero-copy h1{
        font-size:clamp(42px,12vw,58px);
    }

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

    .hero-buttons{
        flex-direction:column;
        align-items:stretch;
    }

    .hero-buttons .btn{
        width:100%;
    }

    .hero-stats{
        gap:18px;
        justify-content:space-between;
    }

    .hero-stat strong{
        font-size:22px;
    }

    .hero-stat span{
        font-size:11px;
    }

    .hero-visual{
        min-height:410px;
    }

    .hero-image{
        inset:0 12px 25px 12px;
        border-radius:25px;
    }

    .hero-floating{
        padding:10px 12px;
        gap:8px;
    }

    .hero-floating.one{
        top:25px;
        left:0;
    }

    .hero-floating.two{
        right:0;
        bottom:40px;
    }

    .hero-floating-icon{
        width:31px;
        height:31px;
        border-radius:10px;
    }

    .hero-floating strong{
        font-size:11px;
    }

    .hero-floating span{
        font-size:9px;
    }

    .section{
        padding:68px 0;
    }

    .section-heading{
        margin-bottom:34px;
    }

    .section-heading h2{
        font-size:clamp(34px,10vw,45px);
    }

    .section-heading p{
        font-size:15px;
    }

    .history-visual{
        min-height:370px;
    }

    .history-main-image{
        inset:0 30px 30px 0;
        border-radius:24px;
    }

    .history-year{
        width:130px;
        height:130px;
    }

    .history-year strong{
        font-size:32px;
    }

    .history-year span{
        font-size:9px;
    }

    .history-milestones{
        grid-template-columns:1fr;
    }

    .mission-cards{
        grid-template-columns:1fr;
    }

    .mission-card{
        min-height:auto;
    }

    .doctors{
        grid-template-columns:1fr;
    }

    .doctor-image{
        height:330px;
    }

    .testimonial-list{
        grid-template-columns:1fr;
    }

    .cta-box{
        padding:42px 25px;
        border-radius:25px;
    }

    .cta-buttons{
        flex-direction:column;
        align-items:stretch;
    }

    .cta-buttons .btn{
        width:100%;
    }

    .footer{
        padding-top:55px;
    }

    .footer-grid{
        grid-template-columns:1fr;
        gap:34px;
    }

    .footer-bottom{
        align-items:flex-start;
        flex-direction:column;
    }

    .footer-bottom-links{
        gap:10px 16px;
    }

    .mobile-panel{
        left:10px;
        right:10px;

        top:calc(var(--header-height) + 8px);

        max-height:calc(100dvh - 78px);
    }

    .back-to-top{
        width:44px;
        height:44px;

        right:14px;
        bottom:14px;
    }

    
}

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

@media(max-width:420px){

    .container{
        width:calc(100% - 20px);
    }

    .brand-mark{
        width:37px;
        height:37px;
        min-width:37px;
    }

    .brand-name{
        font-size:19px;
    }

    .brand-sub{
        font-size:7px;
        letter-spacing:.03em;
    }

    .nav-actions{
        gap:4px;
    }

    .nav-actions .icon-btn,
    .menu-toggle{
        width:38px;
        height:38px;
        min-width:38px;
    }

    .hamburger-icon{
        width:19px;
        height:15px;
    }

    .hamburger-icon span{
        width:19px;
    }

    .hero-copy h1{
        font-size:41px;
    }

    .hero-visual{
        min-height:350px;
    }

    .hero-floating{
        max-width:170px;
    }

    .history-year{
        width:112px;
        height:112px;
    }

    .history-year strong{
        font-size:28px;
    }

    .cta-box{
        padding:35px 20px;
    }
}

@media(max-width:360px){

    .navbar{
        gap:5px;
    }

    .brand-name{
        font-size:18px;
    }

    .brand-sub{
        font-size:6.5px;
    }

    .nav-actions{
        gap:3px;
    }

    .nav-actions .icon-btn,
    .menu-toggle{
        width:36px;
        height:36px;
        min-width:36px;
    }

    .hamburger-icon{
        width:18px;
        height:14px;
    }

    .hamburger-icon span{
        width:18px;
    }

    .hero-copy h1{
        font-size:37px;
    }

    .hero-floating{
        display:none;
    }
}

/* =========================================================
   RTL
   ========================================================= */































/* =========================================================
   ACCESSIBILITY
   ========================================================= */

button:focus-visible,
a:focus-visible{
    outline:3px solid rgba(102,81,168,.35);
    outline-offset:3px;
}

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

    *,
    *::before,
    *::after{
        scroll-behavior:auto !important;
        animation-duration:.01ms !important;
        animation-iteration-count:1 !important;
        transition-duration:.01ms !important;
    }

}




/* =========================================================
   ABOUT FINAL POLISH — HOME1 HEADER + CENTERED STORIES
   Only header hardening + Patient Stories styling
   ========================================================= */
:root{--orvi-header-h:76px;}
html{scroll-padding-top:var(--orvi-header-h);}
body{padding-top:var(--orvi-header-h);overflow-x:clip;}
.site-header{
    position:fixed !important;
    top:0 !important;left:0 !important;right:0 !important;
    width:100% !important;height:var(--orvi-header-h) !important;
    z-index:999999 !important;margin:0 !important;transform:none !important;
    isolation:isolate;overflow:visible !important;
}
.site-header .navbar{
    position:relative;z-index:1000000;
    min-height:var(--orvi-header-h);height:var(--orvi-header-h);
}

/* ---------- STORIES: completely new centered editorial layout ---------- */
.testimonials{
    padding:110px 0 120px;
    background:
      radial-gradient(circle at 50% 18%,rgba(102,81,168,.10),transparent 34%),
      var(--paper);
    overflow:hidden;
}
.testimonial-layout{
    display:block;
    width:min(1080px,calc(100% - 48px));
    margin-inline:auto;
}
.testimonial-intro{
    max-width:760px;
    margin:0 auto 68px;
    text-align:center;
}
.testimonial-intro .section-kicker{
    justify-content:center;
}
.testimonial-intro .section-kicker::before{display:none;}
.testimonial-intro h2{
    font-family:var(--serif);
    font-size:clamp(42px,6vw,72px);
    line-height:1.02;
    letter-spacing:-.045em;
    margin-bottom:20px;
}
.testimonial-intro h2 span{
    display:block;
    color:var(--violet);
}
.testimonial-intro > p{
    max-width:650px;
    margin:0 auto;
    color:var(--muted);
    font-size:16px;
    line-height:1.85;
}
.rating-box{
    width:max-content;
    max-width:100%;
    margin:28px auto 0;
    padding:12px 20px;
    display:flex;
    align-items:center;
    gap:12px;
    border:1px solid var(--border);
    border-radius:999px;
    background:var(--white);
    box-shadow:0 12px 30px rgba(58,44,92,.07);
}
.rating-stars{color:var(--violet);letter-spacing:2px;}
.rating-box strong{font-size:14px;}
.rating-box span{font-size:12px;color:var(--muted);}

.testimonial-list{
    position:relative;
    display:flex;
    flex-direction:column;
    gap:0;
    border:0;
}
.testimonial-list::before{
    content:"";
    position:absolute;
    top:0;bottom:0;left:50%;
    width:1px;
    background:linear-gradient(to bottom,transparent,var(--border) 8%,var(--border) 92%,transparent);
    transform:translateX(-50%);
}
.testimonial-card{
    position:relative;
    width:50%;
    padding:42px 54px 46px 0;
    border:0;
    border-bottom:1px solid var(--border);
    border-radius:0;
    background:transparent;
    box-shadow:none;
    transition:transform .35s ease,opacity .35s ease;
}
.testimonial-card:nth-child(even){
    align-self:flex-end;
    padding:42px 0 46px 54px;
    border-bottom:0;
}
.testimonial-card:nth-child(odd)::after,
.testimonial-card:nth-child(even)::after{
    content:"";
    position:absolute;
    top:52px;
    width:10px;height:10px;
    border:2px solid var(--paper);
    border-radius:50%;
    background:var(--violet);
    box-shadow:0 0 0 1px var(--violet);
}
.testimonial-card:nth-child(odd)::after{right:-6px;}
.testimonial-card:nth-child(even)::after{left:-6px;}
.testimonial-card:hover{transform:none;box-shadow:none;background:transparent;}
.testimonial-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    margin-bottom:18px;
}
.patient{display:flex;align-items:center;gap:12px;}
.patient-avatar{
    width:44px;height:44px;min-width:44px;
    display:grid;place-items:center;
    border-radius:50%;
    background:var(--violet-soft);
    color:var(--violet);
    font-size:12px;font-weight:800;
}
.patient strong{display:block;font-size:14px;}
.patient span{display:block;margin-top:2px;color:var(--muted);font-size:12px;}
.quote-mark{
    display:block;
    font-family:Georgia,serif;
    color:var(--violet);
    font-size:42px;
    line-height:.7;
}
.testimonial-card p{
    max-width:520px;
    margin:0;
    font-family:var(--serif);
    font-size:20px;
    line-height:1.7;
    color:var(--ink);
}
.testimonial-card:nth-child(even) p{margin-left:auto;}






@media(max-width:1100px){
    :root{--orvi-header-h:72px;}
    .site-header,.site-header .navbar{height:var(--orvi-header-h);min-height:var(--orvi-header-h);}
}
@media(max-width:850px){
    :root{--orvi-header-h:68px;}
    .site-header,.site-header .navbar{height:var(--orvi-header-h);min-height:var(--orvi-header-h);}
    .mobile-panel{top:calc(var(--orvi-header-h) + 1px) !important;z-index:1000001 !important;}
}
@media(max-width:560px){
    :root{--orvi-header-h:64px;}
    .site-header,.site-header .navbar{height:var(--orvi-header-h);min-height:var(--orvi-header-h);}
    .mobile-panel{top:calc(var(--orvi-header-h) + 8px) !important;}
}
@media(max-width:760px){
    .testimonials{padding:82px 0 88px;}
    .testimonial-layout{width:min(100% - 32px,680px);}
    .testimonial-intro{margin-bottom:48px;}
    .testimonial-list::before{left:18px;transform:none;}
    .testimonial-card,
    .testimonial-card:nth-child(even){
        width:100%;
        align-self:stretch;
        padding:30px 0 34px 52px;
        border-bottom:1px solid var(--border);
    }
    .testimonial-card:nth-child(even)::after,
    .testimonial-card:nth-child(odd)::after{
        left:13px;right:auto;top:39px;
    }
    .testimonial-card p,
    .testimonial-card:nth-child(even) p{max-width:none;margin:0;}
}
@media(max-width:520px){
    .testimonial-intro h2{font-size:43px;}
    .testimonial-intro > p{font-size:14px;}
    .rating-box{border-radius:18px;flex-wrap:wrap;justify-content:center;gap:8px 10px;padding:12px 15px;}
    .testimonial-card{padding-left:44px !important;}
    .testimonial-card:nth-child(even)::after,
    .testimonial-card:nth-child(odd)::after{left:11px;}
    .testimonial-list::before{left:16px;}
    .testimonial-card p{font-size:18px;}
}



/* =========================================================
   STORIES — PREMIUM SMILE JOURNAL / CENTERED LAYOUT
   Stories only; all other sections remain unchanged.
   ========================================================= */
.testimonials{
    background:
        radial-gradient(circle at 50% 8%,rgba(102,81,168,.10),transparent 30%),
        var(--paper) !important;
    overflow:hidden;
}
.testimonial-layout{
    display:block !important;
    width:min(1080px,calc(100% - 48px)) !important;
    margin-inline:auto !important;
}
.testimonial-intro{
    max-width:780px;
    margin:0 auto 58px;
    text-align:center;
}
.testimonial-intro .section-kicker{
    justify-content:center;
}
.testimonial-intro .section-kicker::before{display:none;}
.testimonial-intro h2{
    font-size:clamp(44px,6vw,72px) !important;
    line-height:.98 !important;
    letter-spacing:-.045em;
    margin-bottom:20px !important;
}
.testimonial-intro h2 span{
    display:block;
    color:var(--violet);
}
.testimonial-intro>p{
    max-width:650px;
    margin:0 auto;
    font-size:16px !important;
    line-height:1.8;
}
.rating-box{
    margin:26px auto 0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    display:flex !important;
    flex-direction:row !important;
    align-items:center;
    justify-content:center;
    gap:12px;
}
.rating-stars{font-size:16px !important;letter-spacing:2px;}
.rating-box strong{font-size:20px !important;margin:0 !important;}
.rating-box span{font-size:12px !important;padding-left:12px;border-left:1px solid var(--border);}
.testimonial-list{
    display:grid !important;
    grid-template-columns:repeat(12,minmax(0,1fr)) !important;
    gap:0 !important;
    border-top:1px solid var(--border);
    border-bottom:1px solid var(--border);
}
.testimonial-card{
    position:relative;
    min-height:270px;
    padding:38px 42px 42px !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    transition:background .35s ease,transform .35s ease !important;
}
.testimonial-card:nth-child(1){
    grid-column:span 7;
    border-right:1px solid var(--border) !important;
}
.testimonial-card:nth-child(2){grid-column:span 5;}
.testimonial-card:nth-child(3){
    grid-column:span 5;
    border-top:1px solid var(--border) !important;
    border-right:1px solid var(--border) !important;
}
.testimonial-card:nth-child(4){
    grid-column:span 7;
    border-top:1px solid var(--border) !important;
}
.testimonial-card::before{
    content:"“";
    position:absolute;
    top:17px;
    right:28px;
    font-family:Georgia,serif;
    font-size:92px;
    line-height:1;
    color:var(--violet-soft);
    z-index:0;
}
.testimonial-card:hover{
    transform:none !important;
    background:linear-gradient(135deg,var(--lavender),transparent 72%) !important;
}
.testimonial-top{
    position:relative;
    z-index:1;
    margin-bottom:25px !important;
}
.patient-avatar{
    width:48px !important;
    height:48px !important;
    border-radius:14px !important;
    background:var(--violet) !important;
    color:#fff !important;
}
.patient strong{font-size:15px !important;}
.patient span{font-size:12px !important;}
.quote-mark{display:none !important;}
.testimonial-card p{
    position:relative;
    z-index:1;
    max-width:620px;
    margin:0;
    font-family:var(--serif);
    color:var(--ink) !important;
    font-size:19px !important;
    line-height:1.7 !important;
}
.testimonial-card:nth-child(2) p,.testimonial-card:nth-child(3) p{font-size:17px !important;}


@media(max-width:800px){
    .testimonial-layout{width:min(100% - 32px,680px) !important;}
    .testimonial-intro{margin-bottom:40px;}
    .rating-box{flex-wrap:wrap;gap:8px;}
    .rating-box span{border-left:0;padding-left:0;width:100%;}
    .testimonial-list{display:block !important;}
    .testimonial-card,.testimonial-card:nth-child(1),.testimonial-card:nth-child(2),.testimonial-card:nth-child(3),.testimonial-card:nth-child(4){
        min-height:0;
        padding:30px 8px 34px !important;
        border-right:0 !important;
        border-top:0 !important;
        border-bottom:1px solid var(--border) !important;
    }
    .testimonial-card:last-child{border-bottom:0 !important;}
    .testimonial-card p{font-size:18px !important;}
}
@media(max-width:480px){
    .testimonial-layout{width:calc(100% - 28px) !important;}
    .testimonial-intro h2{font-size:42px !important;}
    .testimonial-card{padding:26px 4px 30px !important;}
    .testimonial-card::before{right:8px;font-size:72px;}
    .testimonial-card p{font-size:17px !important;}
}



/* Patient Stories — editorial split layout */
.testimonials{
    padding:110px 0 105px !important;
    overflow:hidden !important;
    background:var(--paper) !important;
}
.testimonials .testimonial-layout{
    display:grid !important;
    grid-template-columns:minmax(310px,.72fr) minmax(0,1.28fr) !important;
    gap:70px !important;
    align-items:center !important;
    width:min(1180px,calc(100% - 48px)) !important;
    margin-inline:auto !important;
}
.testimonial-intro{
    max-width:430px !important;
    margin:0 !important;
}
.testimonial-intro .section-kicker{
    margin-bottom:18px !important;
}
.testimonial-intro h2{
    font-family:var(--serif) !important;
    font-size:clamp(46px,5.3vw,68px) !important;
    line-height:.99 !important;
    letter-spacing:-.045em !important;
    margin:0 0 22px !important;
}
.testimonial-intro h2 span{color:var(--violet) !important;}
.testimonial-intro>p{
    max-width:390px !important;
    margin:0 !important;
    color:var(--muted) !important;
    font-size:15px !important;
    line-height:1.75 !important;
}
.rating-box{
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
    margin-top:26px !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
}
.rating-stars{
    font-size:13px !important;
    letter-spacing:2px !important;
    color:#d6a34a !important;
    order:2;
}
.rating-box strong{
    font-family:var(--serif) !important;
    font-size:27px !important;
    margin:0 !important;
    order:1;
}
.rating-box span{
    font-size:12px !important;
    color:var(--muted) !important;
    order:3;
}
.testimonial-slider{
    position:relative !important;
    min-width:0 !important;
}
.testimonial-track{
    position:relative !important;
    min-height:235px !important;
}
.testimonial-slide{
    position:absolute !important;
    inset:0 !important;
    padding:30px 32px 29px !important;
    border:1px solid var(--border) !important;
    border-radius:24px !important;
    background:var(--lavender) !important;
    box-shadow:none !important;
    opacity:0 !important;
    transform:translateX(30px) !important;
    pointer-events:none !important;
    transition:opacity .5s ease,transform .5s ease !important;
}
.testimonial-slide.is-active{
    opacity:1 !important;
    transform:translateX(0) !important;
    pointer-events:auto !important;
}
.testimonial-slide .quote-mark{
    display:block !important;
    color:#b6a2ee !important;
    font-size:38px !important;
    line-height:.7 !important;
    margin-bottom:28px !important;
}
.testimonial-slide>p{
    max-width:760px !important;
    margin:0 0 24px !important;
    font-family:var(--serif) !important;
    font-size:20px !important;
    line-height:1.45 !important;
    color:var(--ink) !important;
}
.testimonial-slide .patient{
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
}
.testimonial-slide .patient-avatar{
    width:38px !important;
    height:38px !important;
    border-radius:50% !important;
    display:grid !important;
    place-items:center !important;
    background:var(--ink) !important;
    color:#fff !important;
    font-size:11px !important;
    font-weight:700 !important;
}
.testimonial-slide .patient strong{
    display:block !important;
    font-size:13px !important;
}
.testimonial-slide .patient span{
    display:block !important;
    margin-top:3px !important;
    font-size:12px !important;
    color:var(--muted) !important;
}
.testimonial-controls{
    position:absolute !important;
    right:10px !important;
    bottom:-1px !important;
    display:flex !important;
    gap:8px !important;
    z-index:4 !important;
}
.testimonial-controls button{
    width:36px !important;
    height:36px !important;
    border:1px solid var(--border) !important;
    border-radius:50% !important;
    background:var(--white) !important;
    color:var(--ink) !important;
    display:grid !important;
    place-items:center !important;
    cursor:pointer !important;
    font-size:15px !important;
    transition:transform .25s ease,background .25s ease !important;
}
.testimonial-controls button:hover{transform:translateY(-2px) !important;background:var(--paper) !important;}
@media(max-width:900px){
    .testimonials .testimonial-layout{grid-template-columns:1fr !important;gap:45px !important;}
    .testimonial-intro{max-width:700px !important;}
    .testimonial-intro>p{max-width:620px !important;}
    .testimonial-track{min-height:245px !important;}
}
@media(max-width:600px){
    .testimonials{padding:80px 0 82px !important;}
    .testimonials .testimonial-layout{width:min(100% - 28px,1180px) !important;gap:34px !important;}
    .testimonial-intro h2{font-size:clamp(42px,12vw,58px) !important;}
    .testimonial-slide{padding:26px 23px 25px !important;border-radius:20px !important;}
    .testimonial-slide>p{font-size:18px !important;line-height:1.5 !important;}
    .testimonial-track{min-height:280px !important;}
    .testimonial-controls{right:8px !important;bottom:8px !important;}
}



/* =========================================================
   STORIES — CENTERED EDITORIAL LAYOUT
   Only the Patient Stories section is changed.
   ========================================================= */
.testimonials{
    padding:105px 0 110px !important;
    overflow:hidden !important;
    background:var(--paper) !important;
}

.testimonials .testimonial-layout{
    width:min(1180px,calc(100% - 48px)) !important;
    margin-inline:auto !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    gap:0 !important;
}

.testimonial-intro{
    width:100% !important;
    max-width:900px !important;
    margin:0 auto 48px !important;
    text-align:center !important;
}

.testimonial-intro .section-kicker{
    justify-content:center !important;
    margin-bottom:18px !important;
}

.testimonial-intro .section-kicker::before{
    display:none !important;
}

.testimonial-intro h2{
    max-width:900px !important;
    margin:0 auto 18px !important;
    font-family:var(--serif) !important;
    font-size:clamp(42px,5.4vw,70px) !important;
    line-height:1.02 !important;
    letter-spacing:-.045em !important;
    text-align:center !important;
}

.testimonial-intro h2 span{
    color:var(--violet) !important;
}

.testimonial-intro>p{
    max-width:650px !important;
    margin:0 auto !important;
    text-align:center !important;
    line-height:1.8 !important;
}

.rating-box{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:max-content !important;
    margin:22px auto 0 !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
}

.testimonial-slider{
    position:relative !important;
    width:min(980px,100%) !important;
    margin-inline:auto !important;
}

.testimonial-track{
    position:relative !important;
    width:100% !important;
    min-height:225px !important;
}

.testimonial-slide{
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    min-height:225px !important;
    padding:40px 72px 42px !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    align-items:center !important;
    text-align:center !important;
    border:1px solid var(--border) !important;
    border-radius:28px !important;
    background:var(--lavender) !important;
    box-shadow:none !important;
    opacity:0 !important;
    transform:translateX(35px) !important;
    pointer-events:none !important;
    transition:opacity .55s ease,transform .55s ease !important;
}

.testimonial-slide.is-active{
    opacity:1 !important;
    transform:translateX(0) !important;
    pointer-events:auto !important;
}

.testimonial-slide .quote-mark{
    margin:0 0 14px !important;
    color:#b5a1eb !important;
    font-family:Georgia,serif !important;
    font-size:44px !important;
    line-height:.7 !important;
}

.testimonial-slide>p{
    width:100% !important;
    max-width:790px !important;
    margin:0 auto 25px !important;
    font-family:var(--serif) !important;
    font-size:clamp(20px,2.2vw,27px) !important;
    line-height:1.45 !important;
    color:var(--ink) !important;
    text-align:center !important;
}

.testimonial-slide .patient{
    justify-content:center !important;
    margin-inline:auto !important;
}

.testimonial-controls{
    position:absolute !important;
    right:18px !important;
    bottom:18px !important;
    display:flex !important;
    gap:8px !important;
    z-index:5 !important;
}

.testimonial-controls button{
    width:38px !important;
    height:38px !important;
    display:grid !important;
    place-items:center !important;
    border:1px solid var(--border) !important;
    border-radius:50% !important;
    background:var(--white) !important;
    color:var(--ink) !important;
}

.testimonial-controls button:hover{
    transform:translateY(-2px) !important;
    color:var(--violet) !important;
}

@media(max-width:700px){
    .testimonials{
        padding:80px 0 85px !important;
    }

    .testimonials .testimonial-layout{
        width:min(100% - 28px,1180px) !important;
    }

    .testimonial-intro{
        margin-bottom:38px !important;
    }

    .testimonial-intro h2{
        font-size:clamp(39px,11vw,58px) !important;
    }

    .testimonial-track,
    .testimonial-slide{
        min-height:285px !important;
    }

    .testimonial-slide{
        padding:35px 25px 55px !important;
        border-radius:23px !important;
    }

    .testimonial-slide>p{
        font-size:19px !important;
        line-height:1.5 !important;
    }

    .testimonial-controls{
        right:14px !important;
        bottom:12px !important;
    }
}




/* PATIENT STORIES — compact kinetic editorial rail */
.testimonials{
  padding:78px 0 82px !important;
  overflow:hidden !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(185,166,238,.20), transparent 34%),
    var(--paper) !important;
}
.testimonials .testimonial-layout{
  width:min(1220px,calc(100% - 64px)) !important;
  margin-inline:auto !important;
  display:block !important;
}
.testimonial-intro{
  width:100% !important;
  max-width:920px !important;
  margin:0 auto 34px !important;
  text-align:center !important;
}
.testimonial-intro .section-kicker{
  justify-content:center !important;
  margin-bottom:11px !important;
}
.testimonial-intro .section-kicker::before{display:none !important;}
.testimonial-intro h2{
  max-width:900px !important;
  margin:0 auto 11px !important;
  font-size:clamp(39px,5vw,64px) !important;
  line-height:.98 !important;
  letter-spacing:-.045em !important;
  text-align:center !important;
}
.testimonial-intro h2 span{color:var(--violet) !important;}
.testimonial-intro>p{
  max-width:620px !important;
  margin:0 auto !important;
  font-size:14px !important;
  line-height:1.65 !important;
  text-align:center !important;
}
.rating-box{
  margin:12px auto 0 !important;
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  gap:8px !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
.rating-box strong{font-size:17px !important;}
.rating-stars{font-size:12px !important;letter-spacing:2px !important;}
.rating-box span{font-size:11px !important;}

/* wide horizontal story rail — intentionally not a card/grid */
.testimonial-slider{
  position:relative !important;
  width:100% !important;
  margin:0 auto !important;
  padding:0 66px !important;
}
.testimonial-slider::before,
.testimonial-slider::after{
  content:"";
  position:absolute;
  top:50%;
  width:42px;
  height:1px;
  background:var(--border);
  transform:translateY(-50%);
  z-index:4;
}
.testimonial-slider::before{left:0;}
.testimonial-slider::after{right:0;}
.testimonial-track{
  position:relative !important;
  width:100% !important;
  min-height:174px !important;
  border-top:1px solid var(--border) !important;
  border-bottom:1px solid var(--border) !important;
}
.testimonial-slide{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  min-height:174px !important;
  padding:25px 74px !important;
  display:grid !important;
  grid-template-columns:150px minmax(0,1fr) 150px !important;
  align-items:center !important;
  gap:28px !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  opacity:0 !important;
  transform:translateX(55px) !important;
  pointer-events:none !important;
  transition:opacity .6s ease,transform .6s cubic-bezier(.22,.8,.2,1) !important;
}
.testimonial-slide.is-active{
  opacity:1 !important;
  transform:translateX(0) !important;
  pointer-events:auto !important;
}
.testimonial-slide .quote-mark{
  display:none !important;
}
.testimonial-slide>p{
  grid-column:2 !important;
  grid-row:1 !important;
  width:100% !important;
  max-width:720px !important;
  margin:0 auto !important;
  font-family:var(--serif) !important;
  font-size:clamp(21px,2.1vw,29px) !important;
  line-height:1.28 !important;
  letter-spacing:-.018em !important;
  color:var(--ink) !important;
  text-align:center !important;
}
.testimonial-slide .patient{
  grid-column:1 !important;
  grid-row:1 !important;
  justify-content:flex-start !important;
  margin:0 !important;
}
.testimonial-slide .patient strong{
  font-size:13px !important;
}
.testimonial-slide .patient span{
  font-size:11px !important;
}
.testimonial-slide .patient-avatar{
  width:42px !important;
  height:42px !important;
}
.testimonial-controls{
  position:static !important;
  display:flex !important;
  justify-content:flex-end !important;
  gap:7px !important;
  margin-top:13px !important;
}
.testimonial-controls button{
  width:34px !important;
  height:34px !important;
  border:1px solid var(--border) !important;
  background:var(--white) !important;
  color:var(--ink) !important;
}
.testimonial-controls button:hover{
  transform:translateY(-2px) !important;
  background:var(--lavender) !important;
  color:var(--violet) !important;
}




@media(max-width:800px){
  .testimonials{padding:66px 0 70px !important;}
  .testimonials .testimonial-layout{width:min(100% - 30px,1220px) !important;}
  .testimonial-intro{margin-bottom:25px !important;}
  .testimonial-slider{padding:0 8px !important;}
  .testimonial-slider::before,.testimonial-slider::after{display:none !important;}
  .testimonial-track,.testimonial-slide{min-height:205px !important;}
  .testimonial-slide{
    padding:25px 18px !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
    align-content:center !important;
  }
  .testimonial-slide>p{
    grid-column:1 !important;
    grid-row:1 !important;
    font-size:20px !important;
    line-height:1.38 !important;
  }
  
  .testimonial-controls{margin-top:10px !important;justify-content:center !important;}
  
}
@media(prefers-reduced-motion:reduce){
  .testimonial-slide{transition:none !important;}
}



/* =========================================================
   FINAL CENTER FIX — CTA + DESKTOP HEADER NAV
   ========================================================= */

/* Keep the desktop navigation visually centered in the header */
@media (min-width:901px){
  .site-header .navbar{
    position:relative !important;
  }
  .site-header .nav-links{
    position:absolute !important;
    left:50% !important;
    top:50% !important;
    transform:translate(-50%,-50%) !important;
    width:max-content !important;
    max-width:calc(100% - 430px) !important;
    justify-content:center !important;
    align-items:center !important;
    margin:0 !important;
    z-index:5 !important;
  }
}

/* Start Your Journey — compact, centered editorial CTA */
.cta{
  padding:72px 0 78px !important;
  text-align:center !important;
}

.cta .container{
  display:flex !important;
  justify-content:center !important;
}

.cta-box{
  width:min(980px,100%) !important;
  margin:0 auto !important;
  padding:58px 70px 62px !important;
  border-radius:30px !important;
  text-align:center !important;
}

.cta-content{
  max-width:760px !important;
  margin:0 auto !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
}

.cta-content .section-kicker{
  justify-content:center !important;
  margin-bottom:15px !important;
}

.cta-content .section-kicker::before{
  display:none !important;
}

.cta-content h2{
  max-width:700px !important;
  margin:0 auto 16px !important;
  font-size:clamp(40px,5vw,62px) !important;
  line-height:1.02 !important;
}

.cta-content p{
  max-width:650px !important;
  margin:0 auto 25px !important;
  line-height:1.7 !important;
}

.cta-buttons{
  justify-content:center !important;
  align-items:center !important;
}

@media(max-width:700px){
  .cta{
    padding:58px 0 62px !important;
  }
  .cta-box{
    padding:45px 24px 48px !important;
    border-radius:24px !important;
  }
  .cta-content h2{
    font-size:clamp(36px,11vw,52px) !important;
  }
  .cta-content p{
    font-size:15px !important;
  }
  .cta-buttons{
    width:100% !important;
  }
  .cta-buttons .btn{
    width:100% !important;
    justify-content:center !important;
  }
}



/* FINAL HEADER + START YOUR JOURNEY SPACING FIX */
@media (min-width:1101px){
  .site-header .navbar{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) !important;
    align-items:center !important;
    gap:20px !important;
    width:min(1180px,calc(100% - 48px)) !important;
    margin:0 auto !important;
  }
  .site-header .brand{justify-self:start !important;}
  .site-header .nav-links{
    position:static !important;
    transform:none !important;
    width:auto !important;
    max-width:none !important;
    justify-self:center !important;
    margin:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:26px !important;
    white-space:nowrap !important;
  }
  .site-header .nav-actions{
    justify-self:end !important;
    margin:0 !important;
    display:flex !important;
    align-items:center !important;
    gap:7px !important;
  }
}

.cta{
  padding:38px 0 46px !important;
}
.cta .container{
  width:min(1180px,calc(100% - 48px)) !important;
  margin-inline:auto !important;
}
.cta-box{
  width:min(1000px,100%) !important;
  min-height:0 !important;
  margin:0 auto !important;
  padding:48px 72px 50px !important;
  border-radius:30px !important;
  box-sizing:border-box !important;
}
.cta-content{
  max-width:780px !important;
}
.cta-content h2{
  margin-bottom:13px !important;
}
.cta-content p{
  margin-bottom:21px !important;
}
@media(max-width:700px){
  .cta{padding:30px 0 36px !important;}
  .cta .container{width:calc(100% - 28px) !important;}
  .cta-box{
    width:100% !important;
    padding:38px 22px 40px !important;
    border-radius:24px !important;
  }
}



/* JOURNEY + HEADER FINAL ALIGNMENT */
@media (min-width:701px){
  .site-header .nav-links{
    gap:20px !important;
  }

  .cta{
    padding:0 !important;
    margin:0 !important;
  }

  .cta .container{
    width:min(1180px,calc(100% - 48px)) !important;
    max-width:1180px !important;
    margin:0 auto !important;
    padding:0 !important;
  }

  .cta-box{
    width:100% !important;
    max-width:none !important;
    min-height:352px !important;
    margin:0 !important;
    padding:46px 72px 48px !important;
    border-radius:0 0 28px 28px !important;
    box-sizing:border-box !important;
  }
}

@media (max-width:700px){
  .cta{
    padding:0 14px !important;
    margin:0 !important;
  }
  .cta .container{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
  }
  .cta-box{
    width:100% !important;
    min-height:0 !important;
    margin:0 !important;
    padding:38px 22px 40px !important;
    border-radius:0 0 24px 24px !important;
  }
  .site-header .nav-links{
    gap:14px !important;
  }
}



/* FINAL SPACING FIX — header navigation + CTA breathing room */
@media (min-width:1101px){
  .site-header .nav-links{
    gap:16px !important;
  }
}

/* Give Start Your Journey clear breathing room above and below. */
.cta{
  padding:30px 0 52px !important;
  margin:0 !important;
}
.cta .container{
  width:min(1180px,calc(100% - 48px)) !important;
  max-width:1180px !important;
  margin:0 auto !important;
  padding:0 !important;
}
.cta-box{
  width:100% !important;
  max-width:none !important;
  min-height:0 !important;
  height:auto !important;
  margin:0 auto !important;
  padding:44px 72px 46px !important;
  box-sizing:border-box !important;
  border-radius:28px !important;
}

@media (max-width:1100px) and (min-width:901px){
  .site-header .nav-links{
    gap:10px !important;
  }
}

@media (max-width:900px){
  .cta{
    padding:26px 0 40px !important;
  }
  .cta .container{
    width:calc(100% - 28px) !important;
  }
  .cta-box{
    padding:38px 28px 40px !important;
    border-radius:24px !important;
  }
}

@media (max-width:700px){
  .site-header .nav-links{
    gap:12px !important;
  }
}

@media (max-width:560px){
  .cta{
    padding:22px 0 32px !important;
  }
  .cta .container{
    width:calc(100% - 24px) !important;
  }
  .cta-box{
    padding:34px 20px 36px !important;
    border-radius:22px !important;
  }
}



/* TRUE FINAL FIX — keep header clean, tighten nav, give Journey breathing room */
@media (min-width:1101px){
  .site-header .nav-links{gap:12px !important;}
}
@media (min-width:901px) and (max-width:1100px){
  .site-header .nav-links{gap:9px !important;}
}

/* Journey section: clear space above AND below the box. */
.cta{
  padding:30px 0 52px !important;
  margin:0 !important;
  box-sizing:border-box !important;
}
.cta .container{
  width:min(1180px,calc(100% - 48px)) !important;
  max-width:1180px !important;
  margin:0 auto !important;
  padding:0 !important;
}
.cta-box{
  width:100% !important;
  max-width:none !important;
  min-height:0 !important;
  height:auto !important;
  margin:0 !important;
  padding:42px 72px 44px !important;
  border-radius:28px !important;
  box-sizing:border-box !important;
}

@media (max-width:900px){
  .cta{padding:26px 0 42px !important;}
  .cta .container{width:calc(100% - 28px) !important;}
  .cta-box{padding:38px 28px 40px !important;border-radius:24px !important;}
}
@media (max-width:560px){
  .cta{padding:22px 0 34px !important;}
  .cta .container{width:calc(100% - 24px) !important;}
  .cta-box{padding:34px 20px 36px !important;border-radius:22px !important;}
}



/* =========================================================
   FINAL RESPONSIVE HEADER / LOGO ALIGNMENT
   ========================================================= */
.site-header .navbar{
    box-sizing:border-box !important;
}
.site-header .brand{
    align-items:center !important;
    height:100% !important;
}
.site-header .brand-mark{
    width:46px !important;
    height:46px !important;
    min-width:46px !important;
    flex:0 0 46px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    border-radius:50% !important;
    line-height:0 !important;
    padding:0 !important;
    box-sizing:border-box !important;
}
.site-header .brand-tooth{
    display:block !important;
    width:25px !important;
    height:29px !important;
    flex:0 0 auto !important;
    margin:0 !important;
    transform:translateY(-.5px) !important;
}
.site-header .brand-text{
    justify-content:center !important;
    min-width:0 !important;
}
.site-header .brand-name,
.site-header .brand-sub{
    display:block !important;
}

/* Keep desktop header groups vertically centered and evenly spaced. */
@media (min-width:1101px){
    .site-header .navbar{
        height:var(--orvi-header-h) !important;
        min-height:var(--orvi-header-h) !important;
    }
    .site-header .nav-links{gap:12px !important;}
    .site-header .nav-actions{gap:7px !important;}
}

/* Tablet: switch before the header gets cramped. */
@media (max-width:1100px) and (min-width:901px){
    .site-header .navbar{
        height:72px !important;
        min-height:72px !important;
        gap:10px !important;
    }
    .site-header .brand-mark{
        width:44px !important;
        height:44px !important;
        min-width:44px !important;
        flex-basis:44px !important;
    }
    .site-header .brand-tooth{
        width:24px !important;
        height:28px !important;
    }
    .site-header .nav-links{gap:9px !important;}
}

/* Mobile header: all three controls stay on one baseline. */
@media (max-width:900px){
    .site-header .navbar{
        height:68px !important;
        min-height:68px !important;
        gap:8px !important;
    }
    .site-header .brand{
        flex:1 1 auto !important;
        min-width:0 !important;
    }
    .site-header .brand-mark{
        width:42px !important;
        height:42px !important;
        min-width:42px !important;
        flex-basis:42px !important;
        border-radius:50% !important;
    }
    .site-header .brand-tooth{
        width:23px !important;
        height:27px !important;
    }
    .site-header .nav-actions{
        display:flex !important;
        align-items:center !important;
        justify-content:flex-end !important;
        gap:6px !important;
        flex:0 0 auto !important;
        margin:0 !important;
    }
    .site-header .nav-actions .icon-btn,
    .site-header .menu-toggle{
        width:42px !important;
        height:42px !important;
        min-width:42px !important;
        flex:0 0 42px !important;
        margin:0 !important;
    }
}

@media (max-width:560px){
    .site-header .navbar{
        height:64px !important;
        min-height:64px !important;
        gap:6px !important;
    }
    .site-header .brand{
        gap:7px !important;
    }
    .site-header .brand-mark{
        width:39px !important;
        height:39px !important;
        min-width:39px !important;
        flex-basis:39px !important;
        border-radius:50% !important;
    }
    .site-header .brand-tooth{
        width:21px !important;
        height:25px !important;
    }
    .site-header .brand-name{
        font-size:21px !important;
    }
    .site-header .brand-sub{
        font-size:7px !important;
        letter-spacing:.09em !important;
        margin-top:3px !important;
    }
    .site-header .nav-actions{
        gap:4px !important;
    }
    .site-header .nav-actions .icon-btn,
    .site-header .menu-toggle{
        width:38px !important;
        height:38px !important;
        min-width:38px !important;
        flex-basis:38px !important;
    }
    .site-header .hamburger-icon{
        width:18px !important;
        height:15px !important;
    }
    .site-header .hamburger-icon span{
        width:18px !important;
    }
}

@media (max-width:390px){
    .site-header .navbar{
        gap:4px !important;
    }
    .site-header .brand{
        gap:6px !important;
    }
    .site-header .brand-mark{
        width:37px !important;
        height:37px !important;
        min-width:37px !important;
        flex-basis:37px !important;
    }
    .site-header .brand-tooth{
        width:20px !important;
        height:24px !important;
    }
    .site-header .brand-name{
        font-size:20px !important;
    }
    .site-header .brand-sub{
        display:none !important;
    }
    .site-header .nav-actions{
        gap:3px !important;
    }
    .site-header .nav-actions .icon-btn,
    .site-header .menu-toggle{
        width:36px !important;
        height:36px !important;
        min-width:36px !important;
        flex-basis:36px !important;
    }
}

/* Very narrow screens: prevent horizontal header overflow. */
@media (max-width:340px){
    .site-header .brand-name{font-size:19px !important;}
    .site-header .brand-mark{
        width:35px !important;height:35px !important;
        min-width:35px !important;flex-basis:35px !important;
    }
    .site-header .nav-actions .icon-btn,
    .site-header .menu-toggle{
        width:34px !important;height:34px !important;
        min-width:34px !important;flex-basis:34px !important;
    }
}



/* RTL + DARK MODE CIRCLES — exact visual centering at every breakpoint */
.site-header #rtlToggle,
.site-header #darkToggle,
.site-header .menu-toggle{
    position:relative !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    padding:0 !important;
    line-height:1 !important;
    text-align:center !important;
    box-sizing:border-box !important;
    vertical-align:middle !important;
}
.site-header #rtlToggle > span,
.site-header #darkToggle > span{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:100% !important;
    height:100% !important;
    margin:0 !important;
    padding:0 !important;
    line-height:1 !important;
    font-size:15px !important;
    font-weight:500 !important;
    transform:none !important;
}
.site-header #darkToggle > span{
    font-size:17px !important;
    transform:translateY(-.5px) !important;
}
.site-header #rtlToggle > span{
    transform:translateY(-.5px) !important;
}
@media(max-width:900px){
    .site-header #rtlToggle,
    .site-header #darkToggle,
    .site-header .menu-toggle{
        flex-shrink:0 !important;
    }
}
@media(max-width:560px){
    .site-header #rtlToggle > span,
    .site-header #darkToggle > span{
        font-size:14px !important;
    }
    .site-header #darkToggle > span{font-size:16px !important;}
}
@media(max-width:390px){
    .site-header #rtlToggle > span,
    .site-header #darkToggle > span{
        font-size:13px !important;
    }
    .site-header #darkToggle > span{font-size:15px !important;}
}



/* FINAL ABOUT ALIGNMENT — header + journey only */
:root{--orvi-header-h:76px;}
html{scroll-padding-top:var(--orvi-header-h) !important;}
body{padding-top:var(--orvi-header-h) !important;overflow-x:hidden !important;}

.site-header{
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  width:100% !important;
  height:var(--orvi-header-h) !important;
  margin:0 !important;
  padding:0 !important;
  transform:none !important;
  z-index:9999999 !important;
}

.site-header .navbar{
  width:min(1180px,calc(100% - 48px)) !important;
  max-width:1180px !important;
  height:var(--orvi-header-h) !important;
  min-height:var(--orvi-header-h) !important;
  margin:0 auto !important;
  padding:0 !important;
  display:grid !important;
  grid-template-columns:auto minmax(0,1fr) auto !important;
  align-items:center !important;
  column-gap:18px !important;
}

.site-header .brand{justify-self:start !important;}

.site-header .nav-links{
  position:static !important;
  transform:none !important;
  width:auto !important;
  max-width:none !important;
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
  justify-self:center !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:16px !important;
  white-space:nowrap !important;
}

.site-header .nav-links > *{margin:0 !important;}
.site-header .nav-actions{
  justify-self:end !important;
  margin:0 !important;
  padding:0 !important;
  display:flex !important;
  align-items:center !important;
  gap:7px !important;
  white-space:nowrap !important;
}

/* Keep the CTA exactly on the same horizontal grid as the header. */
.cta{
  padding:0 !important;
  margin:0 !important;
}
.cta .container{
  width:min(1180px,calc(100% - 48px)) !important;
  max-width:1180px !important;
  margin:0 auto !important;
  padding:0 !important;
}
.cta-box{
  width:100% !important;
  max-width:none !important;
  min-height:0 !important;
  height:auto !important;
  margin:0 !important;
  padding:42px 72px 44px !important;
  box-sizing:border-box !important;
  border-radius:0 0 28px 28px !important;
}
.cta-content{
  max-width:780px !important;
  margin:0 auto !important;
}
.cta-content .section-kicker{margin-bottom:12px !important;}
.cta-content h2{margin:0 auto 12px !important;}
.cta-content p{margin:0 auto 18px !important;}

@media(max-width:1100px){
  :root{--orvi-header-h:72px;}
  .site-header,.site-header .navbar{height:var(--orvi-header-h) !important;min-height:var(--orvi-header-h) !important;}
  .site-header .nav-links{gap:12px !important;}
}

@media(max-width:900px){
  :root{--orvi-header-h:68px;}
  .site-header,.site-header .navbar{height:var(--orvi-header-h) !important;min-height:var(--orvi-header-h) !important;}
  .site-header .navbar{display:flex !important;gap:10px !important;}
  .site-header .nav-links{display:none !important;}
  .cta .container{width:calc(100% - 28px) !important;}
  .cta-box{padding:38px 28px 40px !important;border-radius:0 0 24px 24px !important;}
}

@media(max-width:560px){
  :root{--orvi-header-h:64px;}
  .site-header,.site-header .navbar{height:var(--orvi-header-h) !important;min-height:var(--orvi-header-h) !important;}
  .cta .container{width:calc(100% - 24px) !important;}
  .cta-box{padding:34px 20px 36px !important;}
}



/* REAL FINAL FIX — Journey box must breathe above AND below; never touch footer */
.cta{
  display:block !important;
  padding:32px 0 56px !important;
  margin:0 !important;
  box-sizing:border-box !important;
}
.cta .container{
  width:min(1180px,calc(100% - 48px)) !important;
  max-width:1180px !important;
  margin:0 auto !important;
  padding:0 !important;
}
.cta-box{
  display:block !important;
  width:100% !important;
  max-width:none !important;
  height:auto !important;
  min-height:0 !important;
  margin:0 !important;
  padding:42px 72px 44px !important;
  border-radius:28px !important;
  box-sizing:border-box !important;
}
.site-header .nav-links{gap:12px !important;}

@media(max-width:1100px){
  .site-header .nav-links{gap:10px !important;}
}
@media(max-width:900px){
  .cta{padding:28px 0 46px !important;}
  .cta .container{width:calc(100% - 28px) !important;}
  .cta-box{padding:38px 28px 40px !important;border-radius:24px !important;}
}
@media(max-width:560px){
  .cta{padding:24px 0 38px !important;}
  .cta .container{width:calc(100% - 24px) !important;}
  .cta-box{padding:34px 20px 36px !important;border-radius:22px !important;}
}



/* =========================================================
   RESPONSIVE FINAL HARDENING
   Header + mobile menu + horizontal overflow fixes
   ========================================================= */
html,body{
  width:100%;
  max-width:100%;
  overflow-x:hidden !important;
}

.site-header{
  width:100% !important;
  max-width:100vw !important;
  overflow:visible !important;
}

@media (max-width:900px){
  :root{--orvi-header-h:68px !important;}

  body{
    padding-top:68px !important;
    overflow-x:hidden !important;
  }

  .site-header,
  .site-header .navbar{
    height:68px !important;
    min-height:68px !important;
  }

  .site-header .navbar{
    width:calc(100% - 24px) !important;
    max-width:none !important;
    margin:0 auto !important;
    padding:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:8px !important;
  }

  .site-header .brand{
    flex:1 1 auto !important;
    min-width:0 !important;
    max-width:none !important;
    justify-self:auto !important;
    overflow:hidden !important;
  }

  .site-header .nav-links{
    display:none !important;
  }

  .site-header .nav-actions{
    flex:0 0 auto !important;
    justify-self:auto !important;
    display:flex !important;
    align-items:center !important;
    gap:6px !important;
    margin:0 !important;
    padding:0 !important;
  }

  .site-header .nav-actions > .btn{
    display:none !important;
  }

  .site-header .nav-actions .icon-btn,
  .site-header .menu-toggle{
    display:flex !important;
    flex:0 0 auto !important;
    width:42px !important;
    height:42px !important;
    min-width:42px !important;
    min-height:42px !important;
    margin:0 !important;
  }

  .mobile-panel{
    top:calc(68px + 8px) !important;
    left:12px !important;
    right:12px !important;
    width:auto !important;
    max-width:none !important;
    max-height:calc(100dvh - 88px) !important;
    z-index:10000000 !important;
    box-sizing:border-box !important;
  }

  /* Prevent tablet widths from creating clipped card rows. */
  .mission-layout{
    grid-template-columns:1fr !important;
    gap:34px !important;
  }

  .mission-statement{
    position:static !important;
  }

  .mission-cards{
    grid-template-columns:1fr !important;
    width:100% !important;
  }

  .mission-card{
    width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
  }

  .history-milestones{
    grid-template-columns:1fr 1fr !important;
  }
}

@media (max-width:560px){
  :root{--orvi-header-h:64px !important;}

  body{padding-top:64px !important;}

  .site-header,
  .site-header .navbar{
    height:64px !important;
    min-height:64px !important;
  }

  .site-header .navbar{
    width:calc(100% - 16px) !important;
    gap:5px !important;
  }

  .site-header .brand{
    gap:7px !important;
  }

  .site-header .brand-mark{
    width:38px !important;
    height:38px !important;
    min-width:38px !important;
  }

  .site-header .brand-name{
    font-size:20px !important;
    line-height:1 !important;
  }

  .site-header .brand-sub{
    font-size:7px !important;
    white-space:nowrap !important;
  }

  .site-header .nav-actions{
    gap:4px !important;
  }

  .site-header .nav-actions .icon-btn,
  .site-header .menu-toggle{
    width:38px !important;
    height:38px !important;
    min-width:38px !important;
    min-height:38px !important;
  }

  .mobile-panel{
    top:calc(64px + 8px) !important;
    left:10px !important;
    right:10px !important;
    max-height:calc(100dvh - 82px) !important;
  }

  .history-milestones{
    grid-template-columns:1fr !important;
  }

  .mission-cards{
    gap:12px !important;
  }
}

@media (max-width:360px){
  .site-header .navbar{
    width:calc(100% - 12px) !important;
  }

  .site-header .brand-sub{
    display:none !important;
  }

  .site-header .brand-name{
    font-size:19px !important;
  }

  .site-header .nav-actions{
    gap:3px !important;
  }

  .site-header .nav-actions .icon-btn,
  .site-header .menu-toggle{
    width:36px !important;
    height:36px !important;
    min-width:36px !important;
    min-height:36px !important;
  }

  .mobile-panel{
    left:8px !important;
    right:8px !important;
  }
}



/* Desktop: hamburger hidden. Mobile/tablet: hamburger remains available. */
@media (min-width:901px){
  .site-header .menu-toggle{
    display:none !important;
    visibility:hidden !important;
    pointer-events:none !important;
  }
}
@media (max-width:900px){
  .site-header .menu-toggle{
    display:flex !important;
    visibility:visible !important;
    pointer-events:auto !important;
    align-items:center !important;
    justify-content:center !important;
  }
}

/* =========================================================
   CONTACT HERO
   PREMIUM CONTACT INTRO
   ========================================================= */

.contact-page .contact-hero{
    min-height:650px;
    display:flex;
    align-items:center;
    position:relative;
    overflow:hidden;
    isolation:isolate;
    background:
        radial-gradient(circle at 8% 20%, rgba(102,81,168,.16), transparent 28%),
        radial-gradient(circle at 88% 78%, rgba(102,81,168,.13), transparent 30%),
        linear-gradient(135deg,#f6f2ff 0%,#fffdf9 55%,#f0ebfb 100%);
}

.contact-page .contact-hero::before{
    content:"";
    position:absolute;
    width:360px;
    height:360px;
    border:1px solid rgba(102,81,168,.13);
    border-radius:50%;
    right:-145px;
    top:-150px;
    box-shadow:0 0 0 35px rgba(102,81,168,.035),0 0 0 70px rgba(102,81,168,.025);
    pointer-events:none;
}

.contact-page .contact-hero::after{
    content:"";
    position:absolute;
    width:120px;
    height:120px;
    border-radius:28px;
    left:-45px;
    bottom:35px;
    background:rgba(102,81,168,.055);
    transform:rotate(24deg);
    pointer-events:none;
}

.contact-page .hero-grid{
    display:grid;
    grid-template-columns:minmax(0,1.02fr) minmax(390px,.98fr);
    gap:58px;
    align-items:center;
    position:relative;
    z-index:1;
}

.contact-page .hero-copy{
    position:relative;
    z-index:2;
    padding:24px 0;
}

.contact-page .hero-badge{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:9px 14px;
    margin-bottom:20px;
    border:1px solid rgba(102,81,168,.18);
    border-radius:999px;
    background:rgba(255,255,255,.76);
    color:var(--violet);
    font-size:13px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
    box-shadow:0 8px 22px rgba(58,44,92,.06);
}

.contact-page .hero-badge::before{
    content:"";
    width:8px;
    height:8px;
    flex:0 0 8px;
    border-radius:50%;
    background:var(--violet);
    box-shadow:0 0 0 5px rgba(102,81,168,.10);
}

.contact-page .hero-copy h1{
    max-width:720px;
    font-family:var(--serif);
    font-size:clamp(50px,6vw,76px);
    line-height:1.02;
    letter-spacing:-.045em;
    margin-bottom:20px;
}

.contact-page .hero-copy h1 span{
    color:var(--violet);
}

.contact-page .hero-copy > p{
    max-width:650px;
    color:var(--ink-soft);
    font-size:17px;
    line-height:1.82;
    margin-bottom:29px;
}

.contact-page .hero-actions{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
}

.contact-page .hero-actions .btn{
    min-height:46px;
    padding-inline:20px;
}

.contact-page .hero-points{
    display:flex;
    flex-wrap:wrap;
    gap:12px 18px;
    margin-top:28px;
}

.contact-page .hero-point{
    display:flex;
    align-items:center;
    gap:8px;
    color:var(--ink-soft);
    font-size:13px;
    font-weight:600;
}

.contact-page .hero-point i{
    width:27px;
    height:27px;
    min-width:27px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:var(--violet-soft);
    color:var(--violet);
    font-style:normal;
    font-weight:800;
}

.contact-page .hero-photo-wrap{
    position:relative;
    min-height:510px;
    padding:18px 12px 38px 28px;
}

.contact-page .hero-photo-wrap::before{
    content:"";
    position:absolute;
    width:105px;
    height:105px;
    left:0;
    top:0;
    border-radius:50%;
    background:var(--violet-soft);
    opacity:.9;
}

.contact-page .hero-photo-wrap::after{
    content:"";
    position:absolute;
    width:85px;
    height:85px;
    right:-5px;
    bottom:4px;
    border-radius:24px;
    background:rgba(102,81,168,.10);
    transform:rotate(18deg);
}

.contact-page .hero-photo{
    position:absolute;
    inset:18px 12px 38px 28px;
    overflow:hidden;
    border-radius:34px;
    border:7px solid rgba(255,255,255,.72);
    box-shadow:0 28px 65px rgba(58,44,92,.18);
    transform:none;
    z-index:1;
}

.contact-page .hero-photo img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
    transition:transform .7s ease;
}

.contact-page .hero-photo:hover img{
    transform:scale(1.035);
}

.contact-page .hero-photo::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,transparent 48%,rgba(31,20,54,.32));
}

.contact-page .hero-note{
    position:absolute;
    left:0;
    bottom:0;
    max-width:275px;
    padding:17px 19px;
    border:1px solid rgba(255,255,255,.7);
    border-radius:19px;
    background:rgba(255,255,255,.94);
    box-shadow:0 18px 38px rgba(58,44,92,.15);
    backdrop-filter:blur(14px);
    z-index:3;
}

.contact-page .hero-note strong{
    display:block;
    font-size:14px;
}

.contact-page .hero-note span{
    display:block;
    color:var(--muted);
    font-size:12px;
    line-height:1.5;
    margin-top:3px;
}


/* =========================================================
   QUICK CONTACT
   ========================================================= */

.contact-page .quick-strip{
    padding:28px 0;

    background:#fff;
}

.contact-page .quick-grid{
    display:grid;

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

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

    border-radius:22px;

    overflow:hidden;

    box-shadow:var(--shadow-soft);

    background:var(--white);
}

.contact-page .quick-item{
    padding:22px 20px;

    display:flex;
    align-items:center;

    gap:13px;

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

.contact-page .quick-item:last-child{
    border-right:0;
}

.contact-page .quick-icon{
    width:42px;
    height:42px;
    min-width:42px;

    display:grid;
    place-items:center;

    border-radius:13px;

    background:var(--violet-soft);

    color:var(--violet);

    font-weight:800;
}

.contact-page .quick-item strong{
    display:block;

    font-size:13px;
}

.contact-page .quick-item span span{
    display:block;

    color:var(--muted);

    font-size:12px;

    margin-top:2px;
}


/* =========================================================
   GENERAL SECTION
   ========================================================= */

.contact-page .section-kicker{
    display:inline-flex;
    align-items:center;

    gap:9px;

    margin-bottom:14px;

    color:var(--violet);

    font-size:14px;
    font-weight:800;

    letter-spacing:.13em;

    text-transform:uppercase;
}

.contact-page .section-kicker::before{
    content:"";

    width:30px;
    height:2px;

    border-radius:999px;

    background:var(--violet);
}

.contact-page .section-heading{
    max-width:760px;

    margin-bottom:32px;
}

.contact-page .section-heading h2{
    font-family:var(--serif);

    font-size:clamp(36px,4.2vw,55px);

    line-height:1.08;

    letter-spacing:-.025em;

    margin-bottom:16px;
}

.contact-page .section-heading p{
    max-width:650px;

    color:var(--muted);

    font-size:16px;

    line-height:1.8;
}


/* =========================================================
   LOCATION
   ========================================================= */

.contact-page .location-section{
    padding:70px 0;

    background:#fff;
}

.contact-page .location-grid{
    display:grid;

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

    gap:45px;

    align-items:stretch;
}

.contact-page .info-panel{
    padding:30px;

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

    border-radius:26px;

    background:var(--paper);

    box-shadow:var(--shadow-soft);
}

.contact-page .info-panel h3{
    font-family:var(--serif);

    font-size:28px;

    margin-bottom:18px;
}

.contact-page .address-line{
    display:flex;

    align-items:flex-start;

    gap:12px;

    padding:15px 0;

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

.contact-page .address-line:last-of-type{
    border-bottom:0;
}

.contact-page .address-icon{
    width:35px;
    height:35px;
    min-width:35px;

    display:grid;
    place-items:center;

    border-radius:11px;

    background:var(--violet-soft);

    color:var(--violet);

    font-weight:800;
}

.contact-page .address-line strong{
    display:block;

    font-size:13px;
}

.contact-page .address-line span span{
    display:block;

    color:var(--muted);

    font-size:13px;

    margin-top:2px;
}

.contact-page .location-buttons{
    margin-top:20px;

    display:flex;
    flex-wrap:wrap;

    gap:10px;
}

.contact-page .map-card{
    min-height:500px;

    overflow:hidden;

    border-radius:28px;

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

    box-shadow:var(--shadow);
}

.contact-page .map-card iframe{
    width:100%;
    height:100%;

    min-height:500px;

    border:0;

    display:block;
}

.contact-page body.dark .map-card iframe{
    filter:
        grayscale(.2)
        saturate(.7)
        brightness(.8);
}


/* =========================================================
   ENQUIRY
   ========================================================= */

.contact-page .booking-section{
    padding:70px 0;

    background:var(--lavender);
}

.contact-page .booking-grid{
    display:grid;

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

    gap:48px;

    align-items:start;
}

.contact-page .booking-intro{
    position:sticky;

    top:100px;
}

.contact-page .booking-intro h2{
    font-family:var(--serif);

    font-size:clamp(38px,4.5vw,58px);

    line-height:1.06;

    letter-spacing:-.025em;

    margin-bottom:17px;
}

.contact-page .booking-intro h2 span{
    color:var(--violet);
}

.contact-page .booking-intro > p{
    color:var(--muted);

    font-size:15px;

    line-height:1.8;

    max-width:460px;
}

.contact-page .booking-list{
    margin-top:27px;

    display:grid;

    gap:12px;
}

.contact-page .booking-list div{
    display:flex;

    gap:10px;

    align-items:flex-start;

    font-size:13px;

    color:var(--ink-soft);
}

.contact-page .booking-list b{
    width:24px;
    height:24px;
    min-width:24px;

    display:grid;
    place-items:center;

    border-radius:50%;

    background:var(--violet);

    color:#fff;

    font-size:11px;
}

.contact-page .form-card{
    padding:32px;

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

    border-radius:28px;

    background:var(--paper);

    box-shadow:var(--shadow-soft);
}

.contact-page .form-top{
    display:flex;

    justify-content:space-between;
    align-items:flex-end;

    gap:20px;

    margin-bottom:24px;
}

.contact-page .form-top h3{
    font-family:var(--serif);

    font-size:31px;
}

.contact-page .form-top p{
    color:var(--muted);

    font-size:12px;
}

.contact-page .form-grid{
    display:grid;

    grid-template-columns:
        1fr
        1fr;

    gap:16px;
}

.contact-page .field{
    display:flex;

    flex-direction:column;

    gap:7px;
}

.contact-page .field.full{
    grid-column:1/-1;
}

.contact-page .field label{
    font-size:13px;

    font-weight:700;
}

.contact-page .field input,
.contact-page .field select,
.contact-page .field textarea{
    width:100%;

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

    border-radius:13px;

    background:var(--white);

    color:var(--ink);

    outline:0;

    padding:12px 14px;

    font:inherit;

    font-size:14px;

    transition:
        border-color .2s ease,
        box-shadow .2s ease;
}

.contact-page .field input,
.contact-page .field select{
    height:47px;
}

.contact-page .field textarea{
    min-height:125px;

    resize:vertical;
}

.contact-page .field input:focus,
.contact-page .field select:focus,
.contact-page .field textarea:focus{
    border-color:var(--violet);

    box-shadow:
        0 0 0 4px rgba(102,81,168,.1);
}


/* ALL INVALID BOXES BECOME RED TOGETHER */

.contact-page .field.error input,
.contact-page .field.error select,
.contact-page .field.error textarea{
    border-color:#d64c5a;

    box-shadow:
        0 0 0 3px rgba(214,76,90,.1);
}

.contact-page .error-text{
    display:none;

    color:#c73545;

    font-size:12px;

    font-weight:600;
}

.contact-page .field.error .error-text{
    display:block;
}

.contact-page .checkbox-field{
    grid-column:1/-1;
}

.contact-page .check-wrap{
    display:flex;

    align-items:flex-start;

    gap:10px;

    font-size:13px;

    color:var(--muted);
}

.contact-page .check-wrap input{
    width:18px;
    height:18px;
    min-width:18px;
    flex:0 0 18px;
    margin:3px 0 0;
    padding:0;
    accent-color:var(--violet);
}

.contact-page .checkbox-field.error .check-wrap{
    color:#c73545;
}

.contact-page .form-bottom{
    display:flex;

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

    gap:18px;

    margin-top:20px;
}

.contact-page .form-message{
    font-size:12px;

    font-weight:700;
}

.contact-page .form-message.success{
    color:#36835c;
}

.contact-page .form-message.fail{
    color:#c73545;
}

.contact-page .form-note{
    margin-top:15px;

    color:var(--muted);

    font-size:12px;
}


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

.contact-page .process-section{
    padding:70px 0;

    background:#fff;
}

.contact-page .process-head{
    display:flex;

    justify-content:space-between;
    align-items:flex-end;

    gap:30px;

    margin-bottom:38px;
}

.contact-page .process-head .section-heading{
    margin-bottom:0;
}

.contact-page .process-head > p{
    max-width:360px;

    color:var(--muted);

    font-size:14px;
}

.contact-page .process-grid{
    display:grid;

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

    gap:18px;
}

.contact-page .process-step{
    min-height:225px;

    padding:27px;

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

    border-radius:22px;

    background:var(--paper);

    position:relative;

    overflow:hidden;
}

.contact-page .process-step::after{
    content:"";

    position:absolute;

    width:110px;
    height:110px;

    border-radius:50%;

    right:-38px;
    bottom:-45px;

    background:var(--violet-soft);
}

.contact-page .process-no{
    font-family:var(--serif);

    font-size:43px;

    color:var(--violet);

    line-height:1;
}

.contact-page .process-step h3{
    font-family:var(--serif);

    font-size:25px;

    margin:23px 0 8px;
}

.contact-page .process-step p{
    color:var(--muted);

    font-size:13px;

    line-height:1.75;

    max-width:330px;
}


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

.contact-page .faq-section{
    padding:70px 0;

    background:#fff;
}

.contact-page .faq-grid{
    display:grid;

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

    gap:60px;

    align-items:start;
}

.contact-page .faq-intro{
    position:sticky;

    top:100px;
}

.contact-page .faq-intro h2{
    font-family:var(--serif);

    font-size:clamp(38px,4.5vw,57px);

    line-height:1.06;

    margin-bottom:16px;
}

.contact-page .faq-intro p{
    color:var(--muted);

    font-size:15px;

    line-height:1.8;
}

.contact-page .faq-list{
    display:grid;

    gap:10px;
}

.contact-page .faq-item{
    border:1px solid var(--border);

    border-radius:17px;

    background:var(--paper);

    overflow:hidden;
}

.contact-page .faq-question{
    width:100%;

    min-height:62px;

    padding:0 18px;

    border:0;

    background:transparent;

    color:var(--ink);

    display:flex;

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

    gap:20px;

    text-align:left;

    font-weight:700;

    font-size:14px;
}

.contact-page .faq-plus{
    font-size:22px;

    color:var(--violet);

    transition:transform .25s ease;
}

.contact-page .faq-answer{
    display:grid;

    grid-template-rows:0fr;

    transition:grid-template-rows .3s ease;
}

.contact-page .faq-answer > div{
    overflow:hidden;
}

.contact-page .faq-answer p{
    padding:0 18px 17px;

    color:var(--muted);

    font-size:13px;

    line-height:1.75;
}

.contact-page .faq-item.open .faq-answer{
    grid-template-rows:1fr;
}

.contact-page .faq-item.open .faq-plus{
    transform:rotate(45deg);
}


/* =========================================================
   FINAL CTA
   ========================================================= */

.contact-page .cta-section{
    padding:18px 0 55px;

    background:#fff;
}

.contact-page .cta-box{
    position:relative;

    overflow:hidden;

    padding:42px 48px;

    border-radius:30px;

    background:
        linear-gradient(
            135deg,
            var(--violet-dark),
            var(--violet)
        );

    color:#fff;

    box-shadow:var(--shadow);
}

.contact-page .cta-box::after{
    content:"";

    position:absolute;

    width:240px;
    height:240px;

    border-radius:50%;

    right:-90px;
    top:-100px;

    border:35px solid rgba(255,255,255,.08);
}

.contact-page .cta-content{
    position:relative;

    z-index:2;

    width:100%;
    max-width:900px;
    margin-inline:auto;
    text-align:center;
    margin-inline:auto;
    text-align:center;
}

.contact-page .cta-content .section-kicker{
    width:100%;
    justify-content:center;
    color:#e6ddff;
}

.contact-page .cta-content .section-kicker::before{
    background:#e6ddff;
}

.contact-page .cta-content h2{
    font-family:var(--serif);

    font-size:clamp(38px,4.8vw,60px);

    line-height:1.05;

    margin-bottom:18px;
}

.contact-page .cta-content p{
    max-width:720px;
    margin-inline:auto;
    margin-left:auto;
    margin-right:auto;

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

    font-size:16px;

    line-height:1.8;

    margin-bottom:27px;
}

.contact-page .cta-buttons{
    display:flex;
    justify-content:center;

    flex-wrap:wrap;
    justify-content:center;

    gap:12px;
}

.contact-page .cta-box .btn-primary{
    background:#fff;

    color:var(--violet);

    box-shadow:none;
}

.contact-page .cta-box .btn-outline{
    border-color:rgba(255,255,255,.35);

    background:transparent;

    color:#fff;
}

/* =========================================================
   CONTACT PAGE RESPONSIVE LAYOUT
   Header/footer responsiveness remains controlled by the
   approved About-page shared stylesheet.
   ========================================================= */

@media (max-width:1200px){
    .contact-page .hero-grid{gap:45px;}
}

@media (max-width:900px){
    .contact-page .contact-hero{min-height:auto;padding:80px 0;}
    .contact-page .hero-grid{grid-template-columns:1fr;gap:45px;}
    .contact-page .hero-photo-wrap{width:100%;max-width:650px;margin-inline:auto;min-height:500px;}
    .contact-page .quick-grid{grid-template-columns:repeat(2,1fr);}
    .contact-page .quick-item:nth-child(2){border-right:0;}
    .contact-page .quick-item:nth-child(-n/**/+2){border-bottom:1px solid var(--border);}
    .contact-page .location-grid,
.contact-page .booking-grid,
.contact-page .faq-grid{grid-template-columns:1fr;}
    .contact-page .booking-intro,
.contact-page .faq-intro{position:static;}
    .contact-page .process-head{align-items:flex-start;flex-direction:column;}
    .contact-page .process-grid{grid-template-columns:repeat(2,1fr);}
}

@media (max-width:600px){
    .contact-page .contact-hero{padding:65px 0;}
    .contact-page .hero-grid{gap:35px;}
    .contact-page .hero-copy h1{font-size:clamp(42px,12vw,58px);}
    .contact-page .hero-copy>p{font-size:15px;}
    .contact-page .hero-actions{flex-direction:column;align-items:stretch;}
    .contact-page .hero-actions .btn{width:100%;}
    .contact-page .hero-points{display:grid;gap:10px;}
    .contact-page .hero-photo-wrap{min-height:390px;}
    .contact-page .hero-photo{inset:0 10px 28px 10px;border-radius:25px;}
    .contact-page .hero-note{left:0;bottom:0;padding:13px 14px;}
    .contact-page .quick-strip,
.contact-page .location-section,
.contact-page .booking-section,
.contact-page .process-section,
.contact-page .faq-section{padding:65px 0;}
    .contact-page .quick-grid{grid-template-columns:1fr;}
    .contact-page .quick-item{border-right:0;border-bottom:1px solid var(--border);}
    .contact-page .quick-item:last-child{border-bottom:0;}
    .contact-page .section-heading h2{font-size:clamp(34px,10vw,45px);}
    .contact-page .location-grid{gap:25px;}
    .contact-page .info-panel{padding:24px;}
    .contact-page .map-card,
.contact-page .map-card iframe{min-height:390px;}
    .contact-page .form-card{padding:22px;}
    .contact-page .form-grid{grid-template-columns:1fr;}
    .contact-page .field.full,
.contact-page .checkbox-field{grid-column:auto;}
    .contact-page .form-top{align-items:flex-start;flex-direction:column;gap:4px;}
    .contact-page .form-bottom{align-items:stretch;flex-direction:column;}
    .contact-page .form-bottom .btn{width:100%;}
    .contact-page .process-grid{grid-template-columns:1fr;}
    .contact-page .process-step{min-height:auto;}
    .contact-page .faq-intro h2{font-size:42px;}
    .contact-page .cta-section{padding:18px 0 65px;}
    .contact-page .cta-box{padding:42px 25px;border-radius:25px;}
    .contact-page .cta-buttons{flex-direction:column;align-items:stretch;}
    .contact-page .cta-buttons .btn{width:100%;}
}

@media (max-width:420px){
    .contact-page .hero-copy h1{font-size:41px;}
    .contact-page .hero-photo-wrap{min-height:350px;}
}

@media (max-width:360px){
    .contact-page .hero-copy h1{font-size:37px;}
    .contact-page .hero-note{display:none;}
}

/* Contact page readability overrides */
.contact-page body{font-size:16px;}
.contact-page p{font-size:16px;}
.contact-page .quick-item strong,
.contact-page .address-line strong{font-size:14px;}
.contact-page .quick-item span span,
.contact-page .address-line span span,
.contact-page .form-top p,
.contact-page .error-text,
.contact-page .form-message,
.contact-page .form-note,
.contact-page .hero-note span{font-size:13px;}
.contact-page .hero-point,
.contact-page .booking-list div,
.contact-page .process-step p,
.contact-page .faq-answer p{font-size:14px;}
.contact-page .field label,
.contact-page .check-wrap{font-size:14px;}




/* =========================================================
   CONTACT PAGE — FINAL ENQUIRY VISUAL FIXES
   ========================================================= */
.contact-page .booking-intro-photo{position:relative;width:100%;height:340px;margin-bottom:28px;overflow:hidden;border-radius:26px;border:1px solid var(--border);box-shadow:var(--shadow-soft);background:var(--lavender-2);}
.contact-page .booking-intro-photo img{width:100%;height:100%;object-fit:cover;object-position:center;display:block;transition:transform .5s ease,filter .35s ease;}
.contact-page .booking-intro-photo:hover img{transform:scale(1.035);}
.contact-page .booking-photo-tag{position:absolute;left:16px;bottom:16px;max-width:calc(100% - 32px);padding:9px 13px;border-radius:12px;background:rgba(39,34,56,.82);color:#fff;font-size:12px;line-height:1.35;backdrop-filter:blur(10px);}
@media(max-width:900px){.contact-page .booking-intro-photo{height:320px;}}
@media(max-width:600px){.contact-page .booking-intro-photo{height:260px;margin-bottom:22px;border-radius:22px;}}


/* =========================================================
   SHARED FOOTER TYPOGRAPHY — ABOUT + CONTACT
   Keep footer text consistent across all pages.
   ========================================================= */
.footer-brand p{font-size:16px;}
.footer-col h4{font-size:17px;}
.footer-col a{font-size:16px;}
.footer-contact-item{font-size:16px;}
.footer-bottom p,.footer-bottom-links a{font-size:16px;}

/* Contact enquiry date control */
.contact-page .form-card input[type="date"]{
    color-scheme:light;
}


/* =========================================================
   ORVI DOCTORS PAGE — CLEAN ISOLATED STYLES
   Only applies to the Doctors page. Shared About/Contact
   header, footer, typography and spacing remain untouched.
   ========================================================= */
body.doctors-page{overflow-x:hidden;}
body.doctors-page .doctor-hero{padding:54px 0 42px;background:radial-gradient(circle at 85% 20%,rgba(102,81,168,.13),transparent 28%),linear-gradient(135deg,#f7f4ff 0%,#fffdf9 60%,#f2eefc 100%);}
body.doctors-page .doctor-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.86fr);gap:56px;align-items:center;}
body.doctors-page .doctor-hero .eyebrow{display:inline-flex;align-items:center;gap:9px;color:var(--violet);font-size:14px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;}
body.doctors-page .doctor-hero .eyebrow::before{content:"";width:30px;height:2px;border-radius:999px;background:var(--violet);flex:0 0 auto;}
body.doctors-page .doctor-hero h1{font-family:var(--serif);font-size:clamp(44px,5.7vw,70px);line-height:1.04;letter-spacing:-.035em;margin:16px 0 17px;max-width:690px;}
body.doctors-page .doctor-hero h1 em{color:var(--violet);font-weight:500;}
body.doctors-page .doctor-hero-copy{max-width:570px;color:var(--muted);font-size:16px;line-height:1.75;margin:0;}
body.doctors-page .hero-actions{display:flex;gap:10px;margin-top:23px;flex-wrap:wrap;}
body.doctors-page .hero-image{height:430px;border-radius:28px;overflow:hidden;box-shadow:var(--shadow);position:relative;background:var(--lavender-2);}
body.doctors-page .hero-image img{width:100%;height:100%;object-fit:cover;display:block;}
body.doctors-page .hero-badge{position:absolute;left:18px;bottom:18px;background:rgba(255,255,255,.92);padding:13px 16px;border-radius:16px;box-shadow:var(--shadow-soft);}
body.doctors-page .hero-badge strong{display:block;font-family:var(--serif);font-size:25px;color:var(--violet);}
body.doctors-page .hero-badge span{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;}

body.doctors-page .team-intro{padding:42px 0 32px;text-align:center;}
body.doctors-page .team-intro-inner{max-width:920px;margin:0 auto;}
body.doctors-page .team-intro .section-kicker{display:inline-flex;align-items:center;justify-content:center;gap:9px;color:var(--violet);font-size:14px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;}
body.doctors-page .team-intro .section-kicker::before{content:"";width:30px;height:2px;border-radius:999px;background:var(--violet);}
body.doctors-page .team-intro h2{font-family:var(--serif);font-size:clamp(34px,3.6vw,49px);line-height:1.06;letter-spacing:-.022em;margin:12px auto;max-width:900px;}
body.doctors-page .team-intro p{max-width:650px;margin:0 auto;color:var(--muted);font-size:15px;line-height:1.65;}

body.doctors-page .doctors-section{padding:26px 0 58px;}
body.doctors-page .doctors-heading{display:flex;justify-content:flex-start;align-items:flex-start;gap:40px;margin-bottom:28px;}
body.doctors-page .doctors-heading .section-kicker{display:inline-flex;align-items:center;gap:9px;color:var(--violet);font-size:14px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;}
body.doctors-page .doctors-heading .section-kicker::before{content:"";width:30px;height:2px;background:var(--violet);border-radius:999px;}
body.doctors-page .doctors-heading p{display:none;}
body.doctors-page .doctor-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:center;padding:30px 0;border-top:1px solid var(--border);}
body.doctors-page .doctor-card:last-child{border-bottom:1px solid var(--border);}
body.doctors-page .doctor-card.reverse .doctor-photo{order:2;}
body.doctors-page .doctor-card.reverse .doctor-details{order:1;}
body.doctors-page .doctor-photo{height:405px;min-width:0;border-radius:26px;overflow:hidden;background:var(--lavender-2);position:relative;}
body.doctors-page .doctor-photo img{width:100%;height:100%;object-fit:cover;display:block;}
body.doctors-page .doctor-number{position:absolute;top:16px;left:16px;width:48px;height:48px;border-radius:14px;background:rgba(255,255,255,.92);display:grid;place-items:center;color:var(--violet);font-family:var(--serif);font-size:17px;}
body.doctors-page .doctor-details{min-width:0;padding:8px 28px;box-sizing:border-box;}
body.doctors-page .doctor-role{font-size:13px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--violet);margin-bottom:9px;line-height:1.4;}
body.doctors-page .doctor-name{font-family:var(--serif);font-size:clamp(38px,4.1vw,58px);line-height:1.04;letter-spacing:-.03em;margin:0;overflow-wrap:anywhere;}
body.doctors-page .doctor-title{font-size:16px;font-weight:700;color:var(--violet-dark);margin:10px 0 12px;line-height:1.45;}
body.doctors-page .doctor-bio{max-width:520px;color:var(--muted);font-size:15px;line-height:1.72;margin:0;}
body.doctors-page .doctor-meta{display:flex;gap:28px;margin:17px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:13px 0;}
body.doctors-page .meta-item{min-width:0;}
body.doctors-page .meta-item strong{display:block;font-family:var(--serif);font-size:23px;line-height:1.1;}
body.doctors-page .meta-item span{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;line-height:1.4;}
body.doctors-page .specialties{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:18px;}
body.doctors-page .specialties span{border:1px solid var(--border);background:rgba(255,255,255,.5);border-radius:999px;padding:7px 10px;font-size:12px;color:var(--ink-soft);line-height:1.25;}
body.doctors-page .doctor-actions{display:flex;align-items:center;gap:16px;flex-wrap:wrap;}
body.doctors-page .text-link{font-size:13px;font-weight:700;color:var(--violet);}

body.doctors-page .focus-section{padding:60px 0;background:var(--lavender);border-top:1px solid var(--border);border-bottom:1px solid var(--border);}
body.doctors-page .focus-head{text-align:center;max-width:760px;margin:0 auto 26px;}
body.doctors-page .focus-head h2{font-family:var(--serif);font-size:clamp(36px,4.2vw,56px);line-height:1.07;margin:12px 0;}
body.doctors-page .focus-head h2 em{color:var(--violet);font-weight:500;}
body.doctors-page .focus-head p{color:var(--muted);font-size:15px;line-height:1.75;margin:0;}
body.doctors-page .focus-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;}
body.doctors-page .focus-card{min-height:230px;border-radius:20px;overflow:hidden;position:relative;background:#312943;color:#fff;}
body.doctors-page .focus-card img{width:100%;height:100%;object-fit:cover;display:block;opacity:.82;transition:transform .6s;}
body.doctors-page .focus-card:hover img{transform:scale(1.04);}
body.doctors-page .focus-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 25%,rgba(30,23,45,.9) 100%);}
body.doctors-page .focus-content{position:absolute;left:17px;right:17px;bottom:16px;z-index:2;}
body.doctors-page .focus-no{font-size:11px;letter-spacing:.12em;color:#ddd3ec;}
body.doctors-page .focus-content h3{font-family:var(--serif);font-size:25px;line-height:1.05;margin:4px 0;}
body.doctors-page .focus-content p{font-size:12px;line-height:1.45;color:#eee8f2;margin:0;}

body.doctors-page .method-section{padding:58px 0;}
body.doctors-page .method-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.8fr);gap:45px;align-items:end;margin-bottom:25px;}
body.doctors-page .method-head h2{font-family:var(--serif);font-size:clamp(36px,4.2vw,54px);line-height:1.07;margin:11px 0 0;}
body.doctors-page .method-head h2 em{color:var(--violet);font-weight:500;}
body.doctors-page .method-head>p{max-width:430px;color:var(--muted);font-size:15px;line-height:1.75;margin:0;}
body.doctors-page .method-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--border);border-bottom:1px solid var(--border);}
body.doctors-page .method-step{padding:23px 20px 24px;border-right:1px solid var(--border);min-width:0;}
body.doctors-page .method-step:last-child{border-right:0;}
body.doctors-page .method-num{color:var(--violet);font-family:var(--serif);font-size:18px;}
body.doctors-page .method-step h3{font-family:var(--serif);font-size:29px;line-height:1.05;margin:8px 0;}
body.doctors-page .method-step p{font-size:14px;color:var(--muted);line-height:1.65;margin:0;}
body.doctors-page .method-tag{display:inline-block;margin-top:15px;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--violet);}

body.doctors-page .find-section{padding:45px 0 60px;}
body.doctors-page .find-box{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:45px;background:var(--violet-dark);color:#fff;border-radius:28px;padding:38px 42px;}
body.doctors-page .find-box h2{font-family:var(--serif);font-size:clamp(36px,4vw,52px);line-height:1.05;margin:12px 0;}
body.doctors-page .find-box p{color:#ddd3e9;max-width:430px;font-size:15px;line-height:1.7;margin:0;}
body.doctors-page .find-note{margin-top:18px;font-size:12px;text-transform:uppercase;letter-spacing:.1em;color:#ddd3e9;}
body.doctors-page .find-eyebrow{color:#e3d8f0;}
body.doctors-page .find-eyebrow::before{background:#e3d8f0;}
body.doctors-page .choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;}
body.doctors-page .choice input{position:absolute;opacity:0;}
body.doctors-page .choice label{display:flex;align-items:center;justify-content:space-between;min-height:56px;padding:0 15px;border:1px solid rgba(255,255,255,.22);border-radius:13px;font-size:13px;color:#fff;cursor:pointer;background:rgba(255,255,255,.05);}
body.doctors-page .choice label::after{content:'+';width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.12);flex:0 0 auto;}
body.doctors-page .choice input:checked+label{background:#fff;color:var(--violet-dark);border-color:#fff;}
body.doctors-page .choice input:checked+label::after{content:'✓';background:var(--violet);color:#fff;}
body.doctors-page .find-submit{width:100%;margin-top:10px;border:0;cursor:pointer;background:#fff;color:var(--violet-dark);}
body.doctors-page .find-submit:hover{background:#f4efff;}

/* Doctor CTA: visible in light mode and consistent with the ORVI page palette. */
body.doctors-page .cta-section{padding:0 0 68px;}
body.doctors-page .cta-section .cta-box{position:relative;width:100%;max-width:980px;margin:0 auto;padding:48px 30px;text-align:center;background:var(--lavender-2);color:var(--ink);border-radius:28px;box-shadow:none;}
body.doctors-page .cta-section .cta-box::before,body.doctors-page .cta-section .cta-box::after{display:none;}
body.doctors-page .cta-section .section-kicker{justify-content:center;color:var(--violet);}
body.doctors-page .cta-section .section-kicker::before{display:none;}
body.doctors-page .cta-section .cta-box h2{font-family:var(--serif);font-size:clamp(38px,5vw,62px);line-height:1.05;color:var(--ink);margin:12px auto 14px;max-width:800px;}
body.doctors-page .cta-section .cta-box p{max-width:560px;margin:0 auto 22px;color:var(--muted);font-size:15px;line-height:1.7;}
body.doctors-page .cta-section .cta-buttons{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:12px;}

@media(max-width:1100px){
 body.doctors-page .doctor-hero-grid{gap:40px;}
 body.doctors-page .doctor-hero h1{font-size:clamp(42px,5.6vw,62px);}
 body.doctors-page .doctor-photo{height:370px;}
 body.doctors-page .focus-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
}
@media(max-width:900px){
 body.doctors-page .doctor-hero{padding:48px 0 38px;}
 body.doctors-page .doctor-hero-grid{grid-template-columns:1fr;gap:28px;}
 body.doctors-page .doctor-hero-copy{max-width:760px;}
 body.doctors-page .hero-image{height:400px;max-width:700px;}
 body.doctors-page .team-intro{padding:38px 0 30px;}
 body.doctors-page .team-intro h2{font-size:clamp(32px,5.2vw,44px);}
 body.doctors-page .doctors-section{padding:24px 0 48px;}
 body.doctors-page .doctor-card{grid-template-columns:1fr;gap:24px;padding:28px 0;}
 body.doctors-page .doctor-card.reverse .doctor-photo,body.doctors-page .doctor-card.reverse .doctor-details{order:initial;}
 body.doctors-page .doctor-photo{height:360px;max-width:700px;}
 body.doctors-page .doctor-details{max-width:760px;padding:4px 22px;}
 body.doctors-page .doctor-name{font-size:clamp(38px,7vw,54px);}
 body.doctors-page .focus-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
 body.doctors-page .method-head{grid-template-columns:1fr;gap:10px;}
 body.doctors-page .method-grid{grid-template-columns:1fr 1fr;}
 body.doctors-page .method-step:nth-child(2){border-right:0;}
 body.doctors-page .method-step:nth-child(n+3){border-top:1px solid var(--border);}
 body.doctors-page .find-box{grid-template-columns:1fr;gap:25px;padding:32px;}
}
@media(max-width:600px){
 body.doctors-page .doctor-hero{padding:42px 0 32px;}
 body.doctors-page .doctor-hero h1{font-size:clamp(38px,11vw,52px);line-height:1.06;}
 body.doctors-page .doctor-hero-copy{font-size:15px;line-height:1.7;}
 body.doctors-page .hero-actions{flex-direction:column;align-items:stretch;}
 body.doctors-page .hero-actions .btn{width:100%;}
 body.doctors-page .hero-image{height:310px;width:100%;}
 body.doctors-page .team-intro{padding:32px 0 26px;}
 body.doctors-page .team-intro h2{font-size:36px;line-height:1.08;}
 body.doctors-page .team-intro p{font-size:14px;line-height:1.6;}
 body.doctors-page .doctors-section{padding:20px 0 42px;}
 body.doctors-page .doctor-card{padding:20px 0;gap:20px;}
 body.doctors-page .doctor-photo{height:300px;width:100%;border-radius:22px;}
 body.doctors-page .doctor-number{top:12px;left:12px;width:44px;height:44px;}
 body.doctors-page .doctor-role{font-size:12px;line-height:1.45;}
 body.doctors-page .doctor-details{padding:2px 18px;}
 body.doctors-page .doctor-name{font-size:clamp(34px,10vw,44px);line-height:1.05;}
 body.doctors-page .doctor-title{font-size:15px;line-height:1.45;}
 body.doctors-page .doctor-bio{font-size:14px;line-height:1.65;}
 body.doctors-page .doctor-meta{gap:20px;margin:14px 0;padding:11px 0;}
 body.doctors-page .meta-item strong{font-size:21px;}
 body.doctors-page .meta-item span{font-size:10px;line-height:1.35;}
 body.doctors-page .specialties{margin-bottom:15px;}
 body.doctors-page .specialties span{font-size:11px;padding:6px 9px;}
 body.doctors-page .doctor-actions{gap:12px;}
 body.doctors-page .focus-section{padding:46px 0;}
 body.doctors-page .focus-grid{grid-template-columns:1fr;gap:10px;}
 body.doctors-page .focus-card{min-height:250px;}
 body.doctors-page .method-section{padding:46px 0;}
 body.doctors-page .method-grid{grid-template-columns:1fr;}
 body.doctors-page .method-step{border-right:0;border-bottom:1px solid var(--border);padding:20px 0;}
 body.doctors-page .method-step:last-child{border-bottom:0;}
 body.doctors-page .find-section{padding:35px 0 45px;}
 body.doctors-page .find-box{padding:27px 20px;border-radius:22px;}
 body.doctors-page .find-box h2{font-size:40px;}
 body.doctors-page .choice-grid{grid-template-columns:1fr;}
 body.doctors-page .choice label{min-height:52px;font-size:14px;}
 body.doctors-page .cta-section{padding-bottom:48px;}
 body.doctors-page .cta-section .cta-box{padding:40px 20px;border-radius:24px;}
 body.doctors-page .cta-section .cta-box h2{font-size:clamp(36px,10vw,50px);}
}
@media(max-width:390px){
 body.doctors-page .doctor-details{padding-inline:16px;}
 body.doctors-page .doctor-photo{height:270px;}
 body.doctors-page .doctor-name{font-size:34px;}
 body.doctors-page .doctor-actions{align-items:stretch;}
 body.doctors-page .doctor-actions .btn{width:100%;}
 body.doctors-page .text-link{text-align:center;width:100%;}
 body.doctors-page .cta-section .cta-box{padding:34px 16px;}
}

/* ORVI DOCTORS — FINAL TEXT CONTRAST SAFEGUARDS */
body.doctors-page .doctor-hero h1,body.doctors-page .team-intro h2,body.doctors-page .doctor-name,body.doctors-page .focus-head h2,body.doctors-page .method-head h2{color:var(--ink);}
body.doctors-page .doctor-title{color:var(--violet-dark);}
body.doctors-page .doctor-bio,body.doctors-page .team-intro p,body.doctors-page .focus-head p,body.doctors-page .method-head>p,body.doctors-page .method-step p{color:var(--muted);}
body.doctors-page .doctor-actions .btn-primary{background:var(--violet);color:#fff;}
body.doctors-page .doctor-actions .text-link{color:var(--violet);}
body.doctors-page .specialties span{background:#fff;color:var(--ink-soft);border-color:var(--border);}



/* ===== PATIENT-DASHBOARD — SCOPED BASE STYLES ===== */


    /* =========================================================
       ORVI PATIENT DASHBOARD
       FULL STANDALONE PROTOTYPE
    ========================================================= */

    body.patient-dashboard {

      --lavender-50:#faf8fd;
      --lavender-100:#f2ebf8;
      --lavender-200:#e5d8ef;
      --lavender-300:#d2bee2;
      --lavender-400:#b696ca;
      --lavender-500:#9671b2;
      --lavender-600:#76538f;
      --lavender-700:#5c3d70;

      --paper:#ffffff;
      --paper-soft:#fcfbfd;

      --ink:#29242d;
      --ink-soft:#49414e;
      --muted:#756d7c;

      --line:#e7e1ea;

      --success:#62806b;
      --success-bg:#edf5ef;

      --warning:#9c7643;
      --warning-bg:#faf1e2;

      --danger:#a35d61;
      --danger-bg:#faeeee;

      --sidebar-width:268px;

      --shadow-sm:
        0 8px 28px rgba(62,45,76,.055);

      --shadow-md:
        0 18px 50px rgba(62,45,76,.10);

      --radius-sm:14px;
      --radius-md:20px;
      --radius-lg:28px;

      --transition:.25s ease;
    }


    /* =========================================================
       RESET
    ========================================================= */

    body.patient-dashboard *,
body.patient-dashboard *::before,
body.patient-dashboard *::after {
      box-sizing:border-box;
      margin:0;
      padding:0;
    }

    html body.patient-dashboard {
      scroll-behavior:smooth;
    }

    body.patient-dashboard {
      min-height:100vh;
      font-family:"DM Sans",sans-serif;
      font-size:15px;
      line-height:1.65;
      background:var(--lavender-50);
      color:var(--ink);
      overflow-x:hidden;

      transition:
        background var(--transition),
        color var(--transition);
    }

    body.patient-dashboard button,
body.patient-dashboard input,
body.patient-dashboard select,
body.patient-dashboard textarea {
      font:inherit;
    }

    body.patient-dashboard button {
      cursor:pointer;
    }

    body.patient-dashboard a {
      color:inherit;
      text-decoration:none;
    }

    body.patient-dashboard img {
      display:block;
      max-width:100%;
    }


    /* =========================================================
       DASHBOARD SHELL
    ========================================================= */

    body.patient-dashboard .dashboard-shell {
      min-height:100vh;
    }


    /* =========================================================
       SIDEBAR
       DESKTOP = FIXED LEFT
    ========================================================= */

    body.patient-dashboard .sidebar {
      position:fixed;

      top:0;
      left:0;
      bottom:0;

      width:var(--sidebar-width);

      background:var(--paper);

      border-right:1px solid var(--line);

      padding:25px 17px 18px;

      display:flex;
      flex-direction:column;

      z-index:1000;

      overflow-y:auto;

      transform:translateX(0);

      transition:
        transform var(--transition),
        background var(--transition),
        border-color var(--transition);
    }


    /* =========================================================
       MAIN AREA
    ========================================================= */

    body.patient-dashboard .main-area {
      min-height:100vh;

      margin-left:var(--sidebar-width);

      transition:
        margin var(--transition);
    }


    /* =========================================================
       SIDEBAR BRAND
    ========================================================= */

    body.patient-dashboard .sidebar-brand {

      display:flex;
      align-items:center;

      gap:12px;

      padding:0 9px 24px;

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

      margin-bottom:23px;
    }

    body.patient-dashboard .brand-mark {

      width:45px;
      height:45px;

      flex:0 0 45px;

      border-radius:50%;

      display:grid;
      place-items:center;

      color:var(--lavender-700);

      background:var(--lavender-100);

      border:1px solid var(--lavender-200);
    }

    body.patient-dashboard .brand-mark svg {
      width:27px;
      height:27px;
    }

    body.patient-dashboard .brand-text strong {

      display:block;

      font-family:"Playfair Display",serif;

      font-size:23px;

      line-height:1;

      letter-spacing:.04em;
    }

    body.patient-dashboard .brand-text span {

      display:block;

      margin-top:6px;

      color:var(--muted);

      font-size:13px;

      line-height:1.2;

      font-weight:600;

      letter-spacing:.08em;

      text-transform:uppercase;
    }


    /* =========================================================
       NAV LABEL
    ========================================================= */

    body.patient-dashboard .nav-label {

      padding:0 11px;

      margin-bottom:10px;

      color:var(--muted);

      font-size:13px;

      font-weight:700;

      letter-spacing:.1em;

      text-transform:uppercase;
    }


    /* =========================================================
       SIDEBAR NAVIGATION
    ========================================================= */

    body.patient-dashboard .sidebar-nav {

      display:flex;

      flex-direction:column;

      gap:5px;
    }

    body.patient-dashboard .nav-item {

      width:100%;

      min-height:49px;

      display:flex;

      align-items:center;

      gap:12px;

      padding:11px 13px;

      border:0;

      border-radius:14px;

      background:transparent;

      color:var(--muted);

      text-align:left;

      font-size:14px;

      font-weight:600;

      transition:
        background var(--transition),
        color var(--transition),
        transform var(--transition);
    }

    body.patient-dashboard .nav-item:hover {

      color:var(--lavender-700);

      background:var(--lavender-50);

      transform:translateX(2px);
    }

    body.patient-dashboard .nav-item.active {

      color:var(--lavender-700);

      background:var(--lavender-100);

      box-shadow:
        inset 3px 0 0 var(--lavender-600);
    }

    body.patient-dashboard .nav-icon {

      width:20px;
      height:20px;

      flex:0 0 20px;

      display:grid;
      place-items:center;
    }

    body.patient-dashboard .nav-icon svg {

      width:19px;
      height:19px;

      stroke:currentColor;
    }


    /* =========================================================
       SIDEBAR BOTTOM
    ========================================================= */

    body.patient-dashboard .sidebar-bottom {
      margin-top:auto;
    }

    body.patient-dashboard .sidebar-divider {

      height:1px;

      background:var(--line);

      margin:20px 7px;
    }

    body.patient-dashboard .logout-btn {

      width:100%;

      min-height:48px;

      display:flex;

      align-items:center;

      gap:12px;

      padding:11px 13px;

      border:0;

      border-radius:14px;

      background:transparent;

      color:var(--danger);

      font-size:14px;

      font-weight:600;

      text-align:left;
    }

    body.patient-dashboard .logout-btn:hover {
      background:var(--danger-bg);
    }


    /* =========================================================
       SIDEBAR OVERLAY
    ========================================================= */

    body.patient-dashboard .sidebar-overlay {

      position:fixed;

      inset:0;

      background:rgba(30,23,35,.48);

      opacity:0;

      visibility:hidden;

      z-index:900;

      transition:
        opacity var(--transition),
        visibility var(--transition);
    }

    body.patient-dashboard .sidebar-overlay.active {

      opacity:1;

      visibility:visible;
    }


    /* =========================================================
       TOP BAR
    ========================================================= */

    body.patient-dashboard .topbar {

      min-height:82px;

      padding:16px 34px;

      display:flex;

      align-items:center;

      justify-content:space-between;

      gap:20px;

      position:sticky;

      top:0;

      z-index:500;

      background:rgba(250,248,253,.92);

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

      backdrop-filter:blur(16px);
    }

    body.patient-dashboard .topbar-left {

      display:flex;

      align-items:center;

      gap:15px;

      min-width:0;
    }

    body.patient-dashboard .mobile-menu-btn {

      width:43px;
      height:43px;

      display:none;

      place-items:center;

      border-radius:50%;

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

      background:var(--paper);

      color:var(--ink);
    }

    body.patient-dashboard .mobile-menu-btn svg {

      width:20px;
      height:20px;
    }

    body.patient-dashboard .page-heading small {

      display:block;

      margin-bottom:2px;

      color:var(--muted);

      font-size:13px;

      font-weight:700;

      letter-spacing:.08em;

      text-transform:uppercase;
    }

    body.patient-dashboard .page-heading h1 {

      font-family:"Playfair Display",serif;

      font-size:27px;

      line-height:1.15;

      font-weight:600;
    }


    /* =========================================================
       TOPBAR ACTIONS
    ========================================================= */

    body.patient-dashboard .topbar-actions {

      display:flex;

      align-items:center;

      gap:8px;
    }

    body.patient-dashboard .round-control {

      width:42px;
      height:42px;

      display:grid;
      place-items:center;

      border-radius:50%;

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

      background:var(--paper);

      color:var(--ink);

      transition:all var(--transition);
    }

    body.patient-dashboard .round-control:hover {

      color:var(--lavender-700);

      background:var(--lavender-100);

      border-color:var(--lavender-300);
    }

    body.patient-dashboard .round-control svg {

      width:19px;
      height:19px;
    }

    body.patient-dashboard .notification-btn {
      position:relative;
    }

    body.patient-dashboard .notification-dot {

      position:absolute;

      width:8px;
      height:8px;

      top:7px;
      right:7px;

      border-radius:50%;

      background:var(--danger);

      border:2px solid var(--paper);
    }

    body.patient-dashboard .patient-mini {

      display:flex;

      align-items:center;

      gap:11px;

      margin-left:7px;

      padding-left:15px;

      border-left:1px solid var(--line);
    }

    body.patient-dashboard .patient-avatar {

      width:42px;
      height:42px;

      display:grid;
      place-items:center;

      border-radius:50%;

      color:var(--lavender-700);

      background:
        linear-gradient(
          135deg,
          var(--lavender-200),
          var(--lavender-100)
        );

      font-size:13px;

      font-weight:700;
    }

    body.patient-dashboard .patient-mini-text strong {

      display:block;

      font-size:14px;

      line-height:1.3;
    }

    body.patient-dashboard .patient-mini-text span {

      display:block;

      margin-top:2px;

      color:var(--muted);

      font-size:13px;
    }


    /* =========================================================
       MAIN CONTENT
    ========================================================= */

    body.patient-dashboard .content {

      width:min(1480px,100%);

      margin:0 auto;

      padding:36px;
    }


    /* =========================================================
       GENERAL SECTION
    ========================================================= */

    body.patient-dashboard .dashboard-section {

      margin-bottom:28px;

      scroll-margin-top:105px;
    }

    body.patient-dashboard .section-heading {

      display:flex;

      align-items:flex-end;

      justify-content:space-between;

      gap:20px;

      margin-bottom:16px;
    }

    body.patient-dashboard .section-heading .eyebrow {

      display:block;

      margin-bottom:5px;

      color:var(--lavender-600);

      font-size:13px;

      font-weight:700;

      letter-spacing:.11em;

      text-transform:uppercase;
    }

    body.patient-dashboard .section-heading h2 {

      font-family:"Playfair Display",serif;

      font-size:27px;

      line-height:1.2;

      font-weight:600;
    }

    body.patient-dashboard .section-heading p {

      max-width:560px;

      color:var(--muted);

      font-size:14px;

      line-height:1.7;
    }


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

    body.patient-dashboard .dashboard-hero {

      display:grid;

      grid-template-columns:
        minmax(0,1.12fr)
        minmax(370px,.88fr);

      min-height:400px;

      overflow:hidden;

      border-radius:var(--radius-lg);

      background:var(--paper);

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

      box-shadow:var(--shadow-sm);

      margin-bottom:28px;
    }

    body.patient-dashboard .hero-copy {

      padding:45px;

      display:flex;

      flex-direction:column;

      justify-content:center;

      background:
        radial-gradient(
          circle at 100% 0%,
          var(--lavender-100),
          transparent 42%
        );
    }

    body.patient-dashboard .hero-eyebrow {

      display:inline-flex;

      width:max-content;

      padding:7px 11px;

      margin-bottom:17px;

      border-radius:999px;

      color:var(--lavender-700);

      background:var(--lavender-100);

      font-size:13px;

      font-weight:700;

      letter-spacing:.08em;

      text-transform:uppercase;
    }

    body.patient-dashboard .hero-copy h2 {

      max-width:690px;

      font-family:"Playfair Display",serif;

      font-size:clamp(32px,4vw,53px);

      line-height:1.1;

      font-weight:600;

      margin-bottom:17px;
    }

    body.patient-dashboard .hero-copy h2 em {

      color:var(--lavender-600);

      font-style:normal;
    }

    body.patient-dashboard .hero-copy p {

      max-width:620px;

      color:var(--muted);

      font-size:15px;

      line-height:1.8;

      margin-bottom:25px;
    }

    body.patient-dashboard .hero-actions {

      display:flex;

      align-items:center;

      gap:11px;

      flex-wrap:wrap;
    }

    body.patient-dashboard .hero-status {

      display:flex;

      align-items:center;

      gap:12px;

      margin-top:27px;

      padding-top:20px;

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

    body.patient-dashboard .status-dot {

      width:11px;
      height:11px;

      border-radius:50%;

      background:var(--success);

      box-shadow:
        0 0 0 5px var(--success-bg);
    }

    body.patient-dashboard .hero-status strong {

      display:block;

      font-size:14px;
    }

    body.patient-dashboard .hero-status span {

      display:block;

      margin-top:2px;

      color:var(--muted);

      font-size:13px;
    }

    body.patient-dashboard .hero-photo {

      min-height:400px;

      position:relative;

      overflow:hidden;
    }

    body.patient-dashboard .hero-photo img {

      width:100%;
      height:100%;

      object-fit:cover;
    }

    body.patient-dashboard .hero-photo::after {

      content:"";

      position:absolute;

      inset:0;

      background:
        linear-gradient(
          90deg,
          rgba(255,255,255,.04),
          rgba(80,55,95,.16)
        );
    }

    body.patient-dashboard .hero-photo-caption {

      position:absolute;

      left:22px;
      bottom:22px;

      z-index:2;

      padding:11px 14px;

      border-radius:12px;

      color:#fff;

      background:rgba(45,31,53,.68);

      backdrop-filter:blur(10px);

      font-size:13px;

      font-weight:600;
    }


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

    body.patient-dashboard .btn {

      min-height:44px;

      display:inline-flex;

      align-items:center;

      justify-content:center;

      gap:8px;

      padding:10px 17px;

      border-radius:11px;

      border:1px solid transparent;

      font-size:14px;

      font-weight:700;

      transition:all var(--transition);
    }

    body.patient-dashboard .btn-primary {

      color:#fff;

      background:var(--lavender-600);
    }

    body.patient-dashboard .btn-primary:hover {

      background:var(--lavender-700);

      transform:translateY(-1px);
    }

    body.patient-dashboard .btn-outline {

      color:var(--lavender-700);

      background:transparent;

      border-color:var(--lavender-300);
    }

    body.patient-dashboard .btn-outline:hover {

      background:var(--lavender-100);
    }


    /* =========================================================
       QUICK OVERVIEW
    ========================================================= */

    body.patient-dashboard .overview-grid {

      display:grid;

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

      gap:16px;
    }

    body.patient-dashboard .overview-item {

      min-height:180px;

      padding:23px;

      border-radius:var(--radius-md);

      background:var(--paper);

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

      box-shadow:var(--shadow-sm);

      display:flex;

      flex-direction:column;

      justify-content:space-between;
    }

    body.patient-dashboard .overview-icon {

      width:46px;
      height:46px;

      display:grid;
      place-items:center;

      border-radius:14px;

      background:var(--lavender-100);

      color:var(--lavender-700);
    }

    body.patient-dashboard .overview-icon svg {

      width:21px;
      height:21px;
    }

    body.patient-dashboard .overview-item:nth-child(2) .overview-icon {

      background:var(--success-bg);

      color:var(--success);
    }

    body.patient-dashboard .overview-item:nth-child(3) .overview-icon {

      background:var(--warning-bg);

      color:var(--warning);
    }

    body.patient-dashboard .overview-item:nth-child(4) .overview-icon {

      background:#f0ebf6;

      color:var(--lavender-600);
    }

    body.patient-dashboard .overview-label {

      margin-top:17px;

      color:var(--muted);

      font-size:13px;
    }

    body.patient-dashboard .overview-value {

      margin-top:3px;

      font-family:"Playfair Display",serif;

      font-size:28px;

      line-height:1.15;
    }

    body.patient-dashboard .overview-note {

      margin-top:5px;

      color:var(--muted);

      font-size:13px;
    }


    /* =========================================================
       APPOINTMENT
    ========================================================= */

    body.patient-dashboard .appointment-layout {

      display:grid;

      grid-template-columns:
        minmax(0,1.2fr)
        minmax(320px,.8fr);

      overflow:hidden;

      border-radius:var(--radius-lg);

      background:var(--paper);

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

      box-shadow:var(--shadow-sm);
    }

    body.patient-dashboard .appointment-main {

      padding:34px;
    }

    body.patient-dashboard .appointment-side {

      min-height:330px;

      position:relative;

      overflow:hidden;

      background:var(--lavender-100);
    }

    body.patient-dashboard .appointment-side img {

      width:100%;
      height:100%;

      object-fit:cover;
    }

    body.patient-dashboard .appointment-side::after {

      content:"";

      position:absolute;

      inset:0;

      background:
        linear-gradient(
          180deg,
          transparent 35%,
          rgba(45,30,53,.62)
        );
    }

    body.patient-dashboard .appointment-side-info {

      position:absolute;

      left:22px;
      right:22px;
      bottom:22px;

      z-index:2;

      color:#fff;
    }

    body.patient-dashboard .appointment-side-info span {

      display:block;

      margin-bottom:4px;

      font-size:13px;

      opacity:.85;
    }

    body.patient-dashboard .appointment-side-info strong {

      display:block;

      font-family:"Playfair Display",serif;

      font-size:24px;

      line-height:1.2;
    }

    body.patient-dashboard .appointment-side-info small {

      display:block;

      margin-top:4px;

      font-size:13px;

      opacity:.9;
    }

    body.patient-dashboard .appointment-top {

      display:flex;

      align-items:center;

      justify-content:space-between;

      gap:20px;

      padding-bottom:22px;

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

    body.patient-dashboard .doctor-profile {

      display:flex;

      align-items:center;

      gap:15px;
    }

    body.patient-dashboard .doctor-photo {

      width:68px;
      height:68px;

      flex:0 0 68px;

      overflow:hidden;

      border-radius:50%;

      border:4px solid var(--lavender-100);
    }

    body.patient-dashboard .doctor-photo img {

      width:100%;
      height:100%;

      object-fit:cover;
    }

    body.patient-dashboard .doctor-info strong {

      display:block;

      font-size:17px;
    }

    body.patient-dashboard .doctor-info span {

      display:block;

      margin-top:3px;

      color:var(--muted);

      font-size:13px;
    }

    body.patient-dashboard .appointment-status {

      padding:7px 11px;

      border-radius:999px;

      color:var(--success);

      background:var(--success-bg);

      font-size:13px;

      font-weight:700;
    }

    body.patient-dashboard .appointment-detail-grid {

      display:grid;

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

      gap:13px;

      margin-top:24px;
    }

    body.patient-dashboard .appointment-detail {

      min-height:100px;

      padding:17px;

      border-radius:14px;

      background:var(--lavender-50);

      border:1px solid var(--lavender-100);
    }

    body.patient-dashboard .appointment-detail span {

      display:block;

      color:var(--muted);

      font-size:13px;

      text-transform:uppercase;

      letter-spacing:.05em;
    }

    body.patient-dashboard .appointment-detail strong {

      display:block;

      margin-top:6px;

      font-size:15px;

      line-height:1.45;
    }

    body.patient-dashboard .appointment-actions {

      display:flex;

      align-items:center;

      gap:10px;

      margin-top:23px;

      flex-wrap:wrap;
    }


    /* =========================================================
       TREATMENT JOURNEY
    ========================================================= */

    body.patient-dashboard .treatment-section {

      display:grid;

      grid-template-columns:
        minmax(340px,.88fr)
        minmax(0,1.12fr);

      min-height:450px;

      overflow:hidden;

      border-radius:var(--radius-lg);

      background:var(--paper);

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

      box-shadow:var(--shadow-sm);
    }

    body.patient-dashboard .treatment-image {

      min-height:450px;

      overflow:hidden;

      position:relative;
    }

    body.patient-dashboard .treatment-image img {

      width:100%;
      height:100%;

      object-fit:cover;
    }

    body.patient-dashboard .treatment-image-label {

      position:absolute;

      left:22px;
      bottom:22px;

      padding:10px 13px;

      border-radius:10px;

      color:#fff;

      background:rgba(42,29,50,.72);

      backdrop-filter:blur(10px);

      font-size:13px;

      font-weight:600;
    }

    body.patient-dashboard .treatment-content {

      padding:37px;

      display:flex;

      flex-direction:column;

      justify-content:center;
    }

    body.patient-dashboard .treatment-content h2 {

      font-family:"Playfair Display",serif;

      font-size:31px;

      line-height:1.2;

      margin-bottom:9px;
    }

    body.patient-dashboard .treatment-content > p {

      max-width:600px;

      color:var(--muted);

      font-size:14px;

      line-height:1.75;
    }

    body.patient-dashboard .progress-display {

      display:grid;

      grid-template-columns:145px 1fr;

      gap:27px;

      align-items:center;

      margin-top:28px;
    }

    body.patient-dashboard .progress-ring {

      width:130px;
      height:130px;

      margin:auto;

      border-radius:50%;

      display:grid;

      place-items:center;

      position:relative;

      background:
        conic-gradient(
          var(--lavender-600) 0 68%,
          var(--lavender-100) 68% 100%
        );
    }

    body.patient-dashboard .progress-ring::after {

      content:"";

      position:absolute;

      inset:10px;

      border-radius:50%;

      background:var(--paper);
    }

    body.patient-dashboard .progress-ring-content {

      position:relative;

      z-index:1;

      text-align:center;
    }

    body.patient-dashboard .progress-ring-content strong {

      display:block;

      font-family:"Playfair Display",serif;

      font-size:29px;

      line-height:1;
    }

    body.patient-dashboard .progress-ring-content span {

      display:block;

      margin-top:4px;

      color:var(--muted);

      font-size:13px;
    }

    body.patient-dashboard .progress-copy h3 {

      font-size:18px;

      margin-bottom:5px;
    }

    body.patient-dashboard .progress-copy p {

      color:var(--muted);

      font-size:14px;

      line-height:1.7;

      margin-bottom:17px;
    }

    body.patient-dashboard .progress-line {

      height:9px;

      overflow:hidden;

      border-radius:20px;

      background:var(--lavender-100);
    }

    body.patient-dashboard .progress-line span {

      display:block;

      width:68%;

      height:100%;

      border-radius:inherit;

      background:var(--lavender-600);
    }

    body.patient-dashboard .progress-meta {

      display:flex;

      justify-content:space-between;

      gap:15px;

      margin-top:7px;

      color:var(--muted);

      font-size:13px;
    }

    body.patient-dashboard .journey {

      display:grid;

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

      gap:10px;

      margin-top:30px;
    }

    body.patient-dashboard .journey-step {

      min-height:112px;

      padding:16px;

      border-top:3px solid var(--line);

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

    body.patient-dashboard .journey-step.done {

      border-color:var(--lavender-500);
    }

    body.patient-dashboard .journey-step.current {

      border-color:var(--success);
    }

    body.patient-dashboard .journey-step-number {

      color:var(--muted);

      font-size:13px;

      font-weight:700;
    }

    body.patient-dashboard .journey-step strong {

      display:block;

      margin-top:5px;

      font-size:14px;
    }

    body.patient-dashboard .journey-step span {

      display:block;

      margin-top:4px;

      color:var(--muted);

      font-size:13px;
    }


    /* =========================================================
       PROGRESS PHOTOS
    ========================================================= */

    body.patient-dashboard .photos-section {

      padding:30px;

      border-radius:var(--radius-lg);

      background:var(--paper);

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

      box-shadow:var(--shadow-sm);
    }

    body.patient-dashboard .photo-grid {

      display:grid;

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

      gap:18px;
    }

    body.patient-dashboard .photo-card {

      overflow:hidden;

      border-radius:18px;

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

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

    body.patient-dashboard .photo-card-image {

      height:275px;

      position:relative;

      overflow:hidden;

      background:var(--lavender-100);
    }

    body.patient-dashboard .photo-card-image img {

      width:100%;
      height:100%;

      object-fit:cover;

      transition:transform .5s ease;
    }

    body.patient-dashboard .photo-card:hover .photo-card-image img {

      transform:scale(1.04);
    }

    body.patient-dashboard .photo-badge {

      position:absolute;

      left:14px;
      top:14px;

      padding:7px 10px;

      border-radius:999px;

      color:var(--ink);

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

      backdrop-filter:blur(10px);

      font-size:13px;

      font-weight:700;
    }

    body.patient-dashboard .photo-card-content {

      padding:18px;
    }

    body.patient-dashboard .photo-card-content h3 {

      font-size:17px;

      margin-bottom:4px;
    }

    body.patient-dashboard .photo-card-content p {

      color:var(--muted);

      font-size:13px;
    }


    /* =========================================================
       PAYMENT PLAN
    ========================================================= */

    body.patient-dashboard .payment-section {

      display:grid;

      grid-template-columns:
        minmax(300px,.75fr)
        minmax(0,1.25fr);

      overflow:hidden;

      border-radius:var(--radius-lg);

      background:var(--paper);

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

      box-shadow:var(--shadow-sm);
    }

    body.patient-dashboard .payment-summary {

      padding:35px;

      background:
        linear-gradient(
          145deg,
          var(--lavender-700),
          var(--lavender-600)
        );

      color:#fff;
    }

    body.patient-dashboard .payment-summary .eyebrow {

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

      font-size:13px;

      font-weight:700;

      letter-spacing:.1em;

      text-transform:uppercase;
    }

    body.patient-dashboard .payment-summary h2 {

      margin-top:10px;

      font-family:"Playfair Display",serif;

      font-size:32px;

      line-height:1.15;
    }

    body.patient-dashboard .payment-summary p {

      margin-top:9px;

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

      font-size:14px;
    }

    body.patient-dashboard .amount-block {

      margin-top:30px;

      padding-top:24px;

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

    body.patient-dashboard .amount-block span {

      display:block;

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

      font-size:13px;
    }

    body.patient-dashboard .amount-block strong {

      display:block;

      margin-top:3px;

      font-family:"Playfair Display",serif;

      font-size:39px;

      line-height:1.1;
    }

    body.patient-dashboard .payment-progress {

      margin-top:22px;
    }

    body.patient-dashboard .payment-progress-head {

      display:flex;

      justify-content:space-between;

      gap:15px;

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

      font-size:13px;

      margin-bottom:7px;
    }

    body.patient-dashboard .payment-progress-line {

      height:9px;

      border-radius:20px;

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

      overflow:hidden;
    }

    body.patient-dashboard .payment-progress-line span {

      display:block;

      width:68%;

      height:100%;

      border-radius:inherit;

      background:#fff;
    }

    body.patient-dashboard .payment-content {

      padding:35px;
    }

    body.patient-dashboard .payment-content-header {

      display:flex;

      align-items:flex-start;

      justify-content:space-between;

      gap:20px;

      margin-bottom:25px;
    }

    body.patient-dashboard .payment-content-header h3 {

      font-family:"Playfair Display",serif;

      font-size:24px;
    }

    body.patient-dashboard .payment-content-header p {

      margin-top:4px;

      color:var(--muted);

      font-size:14px;
    }

    body.patient-dashboard .payment-next {

      padding:11px 14px;

      border-radius:12px;

      background:var(--warning-bg);

      color:var(--warning);

      font-size:13px;

      font-weight:700;

      white-space:nowrap;
    }

    body.patient-dashboard .installments {

      display:flex;

      flex-direction:column;
    }

    body.patient-dashboard .installment {

      display:grid;

      grid-template-columns:42px 1fr auto;

      gap:14px;

      align-items:center;

      min-height:75px;

      padding:13px 0;

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

    body.patient-dashboard .installment:last-child {

      border-bottom:0;
    }

    body.patient-dashboard .installment-dot {

      width:35px;
      height:35px;

      display:grid;
      place-items:center;

      border-radius:50%;

      color:var(--lavender-700);

      background:var(--lavender-100);

      font-size:13px;

      font-weight:700;
    }

    body.patient-dashboard .installment.paid .installment-dot {

      color:var(--success);

      background:var(--success-bg);
    }

    body.patient-dashboard .installment.current .installment-dot {

      color:var(--warning);

      background:var(--warning-bg);
    }

    body.patient-dashboard .installment-info strong {

      display:block;

      font-size:14px;
    }

    body.patient-dashboard .installment-info span {

      display:block;

      margin-top:2px;

      color:var(--muted);

      font-size:13px;
    }

    body.patient-dashboard .installment-amount {

      font-size:15px;

      font-weight:700;

      text-align:right;
    }


    /* =========================================================
       CARE TIMELINE
    ========================================================= */

    body.patient-dashboard .care-section {

      display:grid;

      grid-template-columns:
        minmax(0,1.1fr)
        minmax(310px,.9fr);

      gap:20px;
    }

    body.patient-dashboard .care-panel {

      padding:30px;

      border-radius:var(--radius-lg);

      background:var(--paper);

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

      box-shadow:var(--shadow-sm);
    }

    body.patient-dashboard .care-panel h2 {

      font-family:"Playfair Display",serif;

      font-size:25px;

      margin-bottom:7px;
    }

    body.patient-dashboard .care-panel > p {

      color:var(--muted);

      font-size:14px;

      margin-bottom:24px;
    }

    body.patient-dashboard .timeline {

      position:relative;

      padding-left:25px;
    }

    body.patient-dashboard .timeline::before {

      content:"";

      position:absolute;

      left:5px;

      top:7px;

      bottom:7px;

      width:1px;

      background:var(--line);
    }

    body.patient-dashboard .timeline-item {

      position:relative;

      padding:0 0 23px 20px;
    }

    body.patient-dashboard .timeline-item:last-child {

      padding-bottom:0;
    }

    body.patient-dashboard .timeline-item::before {

      content:"";

      position:absolute;

      left:-25px;

      top:5px;

      width:11px;
      height:11px;

      border-radius:50%;

      background:var(--lavender-600);

      border:3px solid var(--lavender-100);
    }

    body.patient-dashboard .timeline-date {

      color:var(--lavender-600);

      font-size:13px;

      font-weight:700;
    }

    body.patient-dashboard .timeline-item h3 {

      margin-top:3px;

      font-size:16px;
    }

    body.patient-dashboard .timeline-item p {

      margin-top:3px;

      color:var(--muted);

      font-size:13px;

      line-height:1.65;
    }


    /* =========================================================
       CARE TEAM
    ========================================================= */

    body.patient-dashboard .team-panel {

      position:relative;

      overflow:hidden;

      min-height:360px;

      border-radius:var(--radius-lg);

      background:var(--lavender-100);

      border:1px solid var(--lavender-200);

      box-shadow:var(--shadow-sm);
    }

    body.patient-dashboard .team-panel img {

      width:100%;
      height:100%;

      min-height:360px;

      object-fit:cover;
    }

    body.patient-dashboard .team-overlay {

      position:absolute;

      inset:auto 0 0 0;

      padding:27px;

      color:#fff;

      background:
        linear-gradient(
          transparent,
          rgba(40,27,47,.88)
        );
    }

    body.patient-dashboard .team-overlay small {

      font-size:13px;

      opacity:.8;
    }

    body.patient-dashboard .team-overlay h2 {

      margin-top:5px;

      font-family:"Playfair Display",serif;

      font-size:27px;
    }

    body.patient-dashboard .team-overlay p {

      max-width:480px;

      margin-top:5px;

      font-size:13px;

      opacity:.86;
    }

    body.patient-dashboard .team-overlay .btn {

      margin-top:16px;
    }


    /* =========================================================
       QUICK ACTIONS
    ========================================================= */

    body.patient-dashboard .quick-actions {

      display:grid;

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

      gap:15px;
    }

    body.patient-dashboard .quick-action {

      min-height:145px;

      padding:22px;

      display:flex;

      flex-direction:column;

      justify-content:space-between;

      text-align:left;

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

      border-radius:18px;

      background:var(--paper);

      box-shadow:var(--shadow-sm);

      transition:
        transform var(--transition),
        border-color var(--transition),
        background var(--transition);
    }

    body.patient-dashboard .quick-action:hover {

      transform:translateY(-3px);

      border-color:var(--lavender-300);

      background:var(--lavender-50);
    }

    body.patient-dashboard .quick-action-icon {

      width:45px;
      height:45px;

      display:grid;
      place-items:center;

      border-radius:13px;

      color:var(--lavender-700);

      background:var(--lavender-100);
    }

    body.patient-dashboard .quick-action-icon svg {

      width:21px;
      height:21px;
    }

    body.patient-dashboard .quick-action strong {

      display:block;

      margin-top:16px;

      font-size:15px;
    }

    body.patient-dashboard .quick-action span {

      display:block;

      margin-top:3px;

      color:var(--muted);

      font-size:13px;
    }


    /* =========================================================
       MODAL
    ========================================================= */

    body.patient-dashboard .modal {

      position:fixed;

      inset:0;

      display:grid;

      place-items:center;

      padding:20px;

      background:rgba(28,21,33,.58);

      opacity:0;

      visibility:hidden;

      z-index:2000;

      transition:
        opacity var(--transition),
        visibility var(--transition);
    }

    body.patient-dashboard .modal.active {

      opacity:1;

      visibility:visible;
    }

    body.patient-dashboard .modal-box {

      width:min(620px,100%);

      max-height:90vh;

      overflow:auto;

      border-radius:24px;

      background:var(--paper);

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

      box-shadow:var(--shadow-md);

      transform:translateY(15px);

      transition:transform var(--transition);
    }

    body.patient-dashboard .modal.active .modal-box {

      transform:translateY(0);
    }

    body.patient-dashboard .modal-header {

      display:flex;

      align-items:flex-start;

      justify-content:space-between;

      gap:15px;

      padding:25px 27px;

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

    body.patient-dashboard .modal-header h2 {

      font-family:"Playfair Display",serif;

      font-size:25px;
    }

    body.patient-dashboard .modal-header p {

      margin-top:4px;

      color:var(--muted);

      font-size:13px;
    }

    body.patient-dashboard .close-modal {

      width:38px;
      height:38px;

      display:grid;
      place-items:center;

      border-radius:50%;

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

      background:transparent;

      color:var(--ink);
    }

    body.patient-dashboard .modal-body {

      padding:27px;
    }

    body.patient-dashboard .form-grid {

      display:grid;

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

      gap:16px;
    }

    body.patient-dashboard .field {

      display:flex;

      flex-direction:column;

      gap:7px;
    }

    body.patient-dashboard .field.full {

      grid-column:1/-1;
    }

    body.patient-dashboard .field label {

      font-size:14px;

      font-weight:700;
    }

    body.patient-dashboard .field input,
body.patient-dashboard .field select,
body.patient-dashboard .field textarea {

      width:100%;

      min-height:47px;

      padding:10px 13px;

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

      border-radius:11px;

      outline:none;

      color:var(--ink);

      background:var(--paper-soft);

      font-size:14px;
    }

    body.patient-dashboard .field textarea {

      min-height:110px;

      resize:vertical;
    }

    body.patient-dashboard .field input:focus,
body.patient-dashboard .field select:focus,
body.patient-dashboard .field textarea:focus {

      border-color:var(--lavender-400);

      box-shadow:
        0 0 0 3px var(--lavender-100);
    }

    body.patient-dashboard .modal-actions {

      display:flex;

      justify-content:flex-end;

      gap:10px;

      margin-top:22px;
    }


    /* =========================================================
       DARK MODE
    ========================================================= */

    

    

    

    

    

    

    

    

    

    

    


    /* =========================================================
       RTL
    ========================================================= */

    

    

    

    

    

    

    

    

    

    

    

    

    


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

    @media (max-width:1200px) {

      body.patient-dashboard .content {
        padding:28px;
      }

      body.patient-dashboard .dashboard-hero {

        grid-template-columns:
          minmax(0,1fr)
          minmax(310px,.75fr);
      }

      body.patient-dashboard .hero-copy {
        padding:35px;
      }

      body.patient-dashboard .overview-grid {
        grid-template-columns:
          repeat(2,1fr);
      }

      body.patient-dashboard .appointment-layout {

        grid-template-columns:
          1fr 330px;
      }

      body.patient-dashboard .quick-actions {

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


    /* =========================================================
       MOBILE SIDEBAR
       IMPORTANT:
       SIDEBAR BECOMES DRAWER.
       MAIN CONTENT NO LONGER HAS SIDEBAR MARGIN.
    ========================================================= */

    @media (max-width:900px) {

      body.patient-dashboard .sidebar {

        width:min(310px,86vw);

        transform:translateX(-105%);

        box-shadow:
          15px 0 45px rgba(40,27,47,.16);
      }

      body.patient-dashboard .sidebar.open {

        transform:translateX(0);
      }

      body.patient-dashboard .main-area {

        margin-left:0;
      }

      body.patient-dashboard .mobile-menu-btn {

        display:grid;
      }

      body.patient-dashboard .topbar {

        min-height:72px;

        padding:13px 18px;
      }

      body.patient-dashboard .content {

        padding:22px 18px;
      }

      body.patient-dashboard .dashboard-hero {

        grid-template-columns:1fr;

      }

      body.patient-dashboard .hero-copy {

        padding:32px 25px;
      }

      body.patient-dashboard .hero-photo {

        min-height:330px;
      }

      body.patient-dashboard .appointment-layout {

        grid-template-columns:1fr;
      }

      body.patient-dashboard .appointment-side {

        min-height:320px;

        order:-1;
      }

      body.patient-dashboard .treatment-section {

        grid-template-columns:1fr;
      }

      body.patient-dashboard .treatment-image {

        min-height:320px;
      }

      body.patient-dashboard .treatment-content {

        padding:30px 25px;
      }

      body.patient-dashboard .payment-section {

        grid-template-columns:1fr;
      }

      body.patient-dashboard .care-section {

        grid-template-columns:1fr;
      }

      body.patient-dashboard .photo-grid {

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

      body.patient-dashboard .overview-grid {

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


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

    @media (max-width:640px) {

      body.patient-dashboard {
        font-size:14px;
      }

      body.patient-dashboard .topbar {

        padding:12px 14px;
      }

      body.patient-dashboard .page-heading small {

        font-size:12px;
      }

      body.patient-dashboard .page-heading h1 {

        font-size:22px;
      }

      body.patient-dashboard .topbar-actions {

        gap:5px;
      }

      body.patient-dashboard .round-control {

        width:39px;
        height:39px;
      }

      body.patient-dashboard .patient-mini {

        display:none;
      }

      body.patient-dashboard .content {

        padding:18px 14px;
      }

      body.patient-dashboard .dashboard-section {

        margin-bottom:21px;
      }

      body.patient-dashboard .dashboard-hero {

        margin-bottom:21px;

        border-radius:21px;
      }

      body.patient-dashboard .hero-copy {

        padding:28px 20px;
      }

      body.patient-dashboard .hero-copy h2 {

        font-size:34px;
      }

      body.patient-dashboard .hero-copy p {

        font-size:14px;
      }

      body.patient-dashboard .hero-photo {

        min-height:270px;
      }

      body.patient-dashboard .hero-actions {

        width:100%;
      }

      body.patient-dashboard .hero-actions .btn {

        width:100%;
      }

      body.patient-dashboard .overview-grid {

        grid-template-columns:1fr;

        gap:11px;
      }

      body.patient-dashboard .overview-item {

        min-height:145px;
      }

      body.patient-dashboard .section-heading {

        align-items:flex-start;

        flex-direction:column;

        gap:8px;
      }

      body.patient-dashboard .section-heading h2 {

        font-size:24px;
      }

      body.patient-dashboard .appointment-main {

        padding:23px 19px;
      }

      body.patient-dashboard .appointment-side {

        min-height:270px;
      }

      body.patient-dashboard .appointment-top {

        align-items:flex-start;

        flex-direction:column;
      }

      body.patient-dashboard .appointment-detail-grid {

        grid-template-columns:1fr;

        gap:9px;
      }

      body.patient-dashboard .appointment-actions {

        flex-direction:column;
      }

      body.patient-dashboard .appointment-actions .btn {

        width:100%;
      }

      body.patient-dashboard .treatment-content {

        padding:25px 19px;
      }

      body.patient-dashboard .progress-display {

        grid-template-columns:1fr;

        gap:20px;
      }

      body.patient-dashboard .journey {

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

      body.patient-dashboard .photo-grid {

        grid-template-columns:1fr;
      }

      body.patient-dashboard .photos-section {

        padding:20px 16px;
      }

      body.patient-dashboard .photo-card-image {

        height:260px;
      }

      body.patient-dashboard .payment-summary,
body.patient-dashboard .payment-content {

        padding:25px 20px;
      }

      body.patient-dashboard .payment-content-header {

        flex-direction:column;
      }

      body.patient-dashboard .installment {

        grid-template-columns:
          38px 1fr;
      }

      body.patient-dashboard .installment-amount {

        grid-column:2;

        text-align:left !important;
      }

      body.patient-dashboard .care-panel {

        padding:23px 19px;
      }

      body.patient-dashboard .quick-actions {

        grid-template-columns:1fr;
      }

      body.patient-dashboard .quick-action {

        min-height:125px;
      }

      body.patient-dashboard .form-grid {

        grid-template-columns:1fr;
      }

      body.patient-dashboard .field.full {

        grid-column:auto;
      }

      body.patient-dashboard .modal {

        padding:12px;
      }

      body.patient-dashboard .modal-header,
body.patient-dashboard .modal-body {

        padding:21px 18px;
      }

      body.patient-dashboard .modal-actions {

        flex-direction:column-reverse;
      }

      body.patient-dashboard .modal-actions .btn {

        width:100%;
      }

      

      

      
    }


    /* =========================================================
       VERY SMALL
    ========================================================= */

    @media (max-width:420px) {

      body.patient-dashboard .topbar {

        gap:8px;
      }

      body.patient-dashboard .page-heading h1 {

        font-size:20px;
      }

      body.patient-dashboard .round-control {

        width:37px;
        height:37px;
      }

      body.patient-dashboard .hero-copy h2 {

        font-size:30px;
      }

      body.patient-dashboard .journey {

        grid-template-columns:1fr;
      }

      body.patient-dashboard .journey-step {

        min-height:auto;
      }

      body.patient-dashboard .payment-summary h2 {

        font-size:28px;
      }

      body.patient-dashboard .amount-block strong {

        font-size:34px;
      }
    }


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

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

      body.patient-dashboard *,
body.patient-dashboard *::before,
body.patient-dashboard *::after {

        scroll-behavior:auto !important;

        transition:none !important;
      }
    }

  

/* DESKTOP ONLY: image fills the exact grid row created by the content */
@media (min-width:901px){
  body.patient-dashboard .appointment-layout {
    display:grid !important;
    align-items:stretch !important;
  }
  body.patient-dashboard .appointment-main {
    min-height:0 !important;
  }
  body.patient-dashboard .appointment-side {
    position:relative !important;
    height:auto !important;
    min-height:0 !important;
    align-self:stretch !important;
    overflow:hidden !important;
  }
  body.patient-dashboard .appointment-side img {
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
    object-fit:cover !important;
  }

  body.patient-dashboard .care-section {
    display:grid !important;
    align-items:stretch !important;
  }
  body.patient-dashboard .care-panel {
    min-height:0 !important;
  }
  body.patient-dashboard .team-panel {
    position:relative !important;
    height:auto !important;
    min-height:0 !important;
    align-self:stretch !important;
    overflow:hidden !important;
  }
  body.patient-dashboard .team-panel img {
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
    object-fit:cover !important;
  }
}


/* FINAL: desktop image panels must exactly follow the content row height */
@media (min-width:901px){
  body.patient-dashboard .appointment-layout {display:grid !important;align-items:stretch !important;}
  body.patient-dashboard .appointment-side {height:auto !important;min-height:0 !important;align-self:stretch !important;}
  body.patient-dashboard .appointment-side img {height:100% !important;min-height:0 !important;width:100%;object-fit:cover;display:block;}
  body.patient-dashboard .care-section {display:grid !important;align-items:stretch !important;}
  body.patient-dashboard .team-panel {height:auto !important;min-height:0 !important;align-self:stretch !important;}
  body.patient-dashboard .team-panel img {height:100% !important;min-height:0 !important;width:100%;object-fit:cover;display:block;}
}
/* Preserve the original quick-action SVG icons */
body.patient-dashboard .quick-action-icon {width:45px !important;height:45px !important;flex:0 0 45px !important;display:grid !important;place-items:center !important;}
body.patient-dashboard .quick-action-icon svg {width:21px !important;height:21px !important;display:block !important;}
body.patient-dashboard .quick-action > span:not(.quick-action-icon) {display:block;}
@media (max-width:900px){
  body.patient-dashboard .appointment-side {height:300px !important;min-height:300px !important;}
  body.patient-dashboard .team-panel {height:360px !important;min-height:360px !important;}
  body.patient-dashboard .team-panel img {height:100% !important;min-height:0 !important;}
}


/* DESKTOP ONLY — MATCH SIDE IMAGES TO THE CONTENT ROW HEIGHT */
@media (min-width:901px){
  body.patient-dashboard .appointment-layout {
    display:grid !important;
    align-items:stretch !important;
  }
  body.patient-dashboard .appointment-side {
    min-height:0 !important;
    height:auto !important;
    align-self:stretch !important;
    overflow:hidden !important;
  }
  body.patient-dashboard .appointment-side img {
    display:block !important;
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
    object-fit:cover !important;
  }

  body.patient-dashboard .care-section {
    display:grid !important;
    align-items:stretch !important;
  }
  body.patient-dashboard .team-panel {
    min-height:0 !important;
    height:auto !important;
    align-self:stretch !important;
    overflow:hidden !important;
  }
  body.patient-dashboard .team-panel img {
    display:block !important;
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
    object-fit:cover !important;
  }
}



/* ===== ADMIN-DASHBOARD — SCOPED BASE STYLES ===== */


/* =========================================================
   ROOT
========================================================= */

body.admin-dashboard {
    --lavender-50:#fbf9ff;
    --lavender-100:#f2edff;
    --lavender-200:#e4d9ff;
    --lavender-300:#d1bfff;
    --lavender-500:#8b63d9;
    --lavender-600:#7350bd;
    --lavender-700:#593b99;
    --violet:#6e4ab4;

    --paper:#fffdfb;
    --white:#ffffff;
    --ink:#27232d;
    --muted:#756e7e;
    --soft:#9a93a3;
    --line:#e9e3ed;

    --green:#42866a;
    --green-bg:#e9f6ef;

    --orange:#b87532;
    --orange-bg:#fff1df;

    --red:#b45353;
    --red-bg:#fdeaea;

    --blue:#4f709c;
    --blue-bg:#eaf1fa;

    --shadow-sm:0 8px 25px rgba(48,35,70,.06);
    --shadow-md:0 18px 50px rgba(48,35,70,.09);

    --sidebar-width:270px;
    --topbar-height:78px;

    --radius-sm:14px;
    --radius-md:20px;
    --radius-lg:28px;
}

body.admin-dashboard * {
    box-sizing:border-box;
    margin:0;
    padding:0;
}

html body.admin-dashboard {
    scroll-behavior:smooth;
}

body.admin-dashboard {
    font-family:"DM Sans",sans-serif;
    background:var(--lavender-50);
    color:var(--ink);
    font-size:15px;
    line-height:1.6;
    overflow-x:hidden;
}

body.admin-dashboard button,
body.admin-dashboard input,
body.admin-dashboard select,
body.admin-dashboard textarea {
    font:inherit;
}

body.admin-dashboard button {
    cursor:pointer;
}

body.admin-dashboard img {
    display:block;
    max-width:100%;
}

body.admin-dashboard a {
    color:inherit;
    text-decoration:none;
}

/* =========================================================
   DARK MODE
========================================================= */



/* =========================================================
   SIDEBAR
========================================================= */

body.admin-dashboard .sidebar {
    position:fixed;
    top:0;
    left:0;
    width:var(--sidebar-width);
    height:100vh;
    background:var(--paper);
    border-right:1px solid var(--line);
    display:flex;
    flex-direction:column;
    z-index:1000;
    transition:.3s ease;
}

body.admin-dashboard .sidebar-brand {
    height:var(--topbar-height);
    padding:0 26px;
    display:flex;
    align-items:center;
    gap:12px;
    border-bottom:1px solid var(--line);
}

body.admin-dashboard .brand-mark {
    width:38px;
    height:38px;
    border-radius:13px;
    display:grid;
    place-items:center;
    background:var(--lavender-100);
    color:var(--lavender-700);
}

body.admin-dashboard .brand-mark svg {
    width:23px;
    height:23px;
}

body.admin-dashboard .brand-text {
    line-height:1.1;
}

body.admin-dashboard .brand-text strong {
    display:block;
    font-family:"Playfair Display",serif;
    font-size:22px;
    letter-spacing:.02em;
}

body.admin-dashboard .brand-text span {
    display:block;
    margin-top:3px;
    color:var(--muted);
    font-size:12px;
    letter-spacing:.08em;
    text-transform:uppercase;
}

body.admin-dashboard .sidebar-nav {
    flex:1;
    padding:25px 15px;
    overflow-y:auto;
}

body.admin-dashboard .nav-label {
    padding:0 12px;
    margin:0 0 10px;
    color:var(--soft);
    font-size:12px;
    font-weight:700;
    letter-spacing:.09em;
    text-transform:uppercase;
}

body.admin-dashboard .nav-item {
    width:100%;
    min-height:48px;
    border:0;
    background:transparent;
    color:var(--muted);
    border-radius:14px;
    display:flex;
    align-items:center;
    gap:13px;
    padding:10px 13px;
    margin-bottom:5px;
    text-align:left;
    transition:.2s ease;
}

body.admin-dashboard .nav-item:hover {
    background:var(--lavender-100);
    color:var(--lavender-700);
}

body.admin-dashboard .nav-item.active {
    background:var(--lavender-100);
    color:var(--lavender-700);
    font-weight:700;
}

body.admin-dashboard .nav-icon {
    width:21px;
    height:21px;
    flex:0 0 21px;
    display:grid;
    place-items:center;
}

body.admin-dashboard .nav-icon svg {
    width:19px;
    height:19px;
}

body.admin-dashboard .sidebar-bottom {
    padding:15px;
    border-top:1px solid var(--line);
}

body.admin-dashboard .admin-mini {
    display:flex;
    align-items:center;
    gap:11px;
    padding:12px;
    margin-bottom:10px;
    border-radius:15px;
    background:var(--lavender-100);
}

body.admin-dashboard .admin-avatar {
    width:40px;
    height:40px;
    border-radius:50%;
    background:var(--lavender-600);
    color:#fff;
    display:grid;
    place-items:center;
    font-size:13px;
    font-weight:700;
}

body.admin-dashboard .admin-mini strong {
    display:block;
    font-size:14px;
}

body.admin-dashboard .admin-mini span {
    display:block;
    color:var(--muted);
    font-size:12px;
}

body.admin-dashboard .logout-btn {
    width:100%;
    min-height:46px;
    border:1px solid var(--line);
    border-radius:13px;
    background:transparent;
    color:var(--muted);
    display:flex;
    align-items:center;
    gap:12px;
    padding:10px 13px;
}

body.admin-dashboard .logout-btn:hover {
    color:var(--red);
    border-color:var(--red);
}

/* =========================================================
   MAIN
========================================================= */

body.admin-dashboard .main {
    min-height:100vh;
    margin-left:var(--sidebar-width);
}

/* =========================================================
   TOPBAR
========================================================= */

body.admin-dashboard .topbar {
    position:sticky;
    top:0;
    height:var(--topbar-height);
    background:rgba(255,253,251,.92);
    backdrop-filter:blur(18px);
    border-bottom:1px solid var(--line);
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 32px;
    z-index:800;
}



body.admin-dashboard .topbar-left {
    display:flex;
    align-items:center;
    gap:15px;
}

body.admin-dashboard .mobile-menu {
    display:none;
    width:43px;
    height:43px;
    border:1px solid var(--line);
    background:var(--paper);
    color:var(--ink);
    border-radius:13px;
    place-items:center;
}

body.admin-dashboard .mobile-menu svg {
    width:20px;
}

body.admin-dashboard .page-title small {
    display:block;
    color:var(--muted);
    font-size:12px;
}

body.admin-dashboard .page-title strong {
    display:block;
    font-size:20px;
    line-height:1.2;
}

body.admin-dashboard .topbar-actions {
    display:flex;
    align-items:center;
    gap:9px;
}

body.admin-dashboard .circle-btn {
    width:42px;
    height:42px;
    border:1px solid var(--line);
    border-radius:50%;
    background:var(--paper);
    color:var(--ink);
    display:grid;
    place-items:center;
}

body.admin-dashboard .circle-btn:hover {
    color:var(--lavender-700);
    border-color:var(--lavender-300);
}

body.admin-dashboard .circle-btn svg {
    width:18px;
    height:18px;
}

body.admin-dashboard .notification {
    position:relative;
}

body.admin-dashboard .notification-dot {
    position:absolute;
    top:8px;
    right:8px;
    width:7px;
    height:7px;
    background:var(--red);
    border:2px solid var(--paper);
    border-radius:50%;
}

body.admin-dashboard .top-admin {
    display:flex;
    align-items:center;
    gap:10px;
    margin-left:7px;
    padding-left:14px;
    border-left:1px solid var(--line);
}

body.admin-dashboard .top-admin-avatar {
    width:38px;
    height:38px;
    border-radius:50%;
    background:var(--lavender-600);
    color:white;
    display:grid;
    place-items:center;
    font-size:12px;
    font-weight:700;
}

body.admin-dashboard .top-admin span {
    color:var(--muted);
    font-size:13px;
}

/* =========================================================
   CONTENT
========================================================= */

body.admin-dashboard .content {
    max-width:1500px;
    margin:0 auto;
    padding:34px;
}

body.admin-dashboard .dashboard-section {
    margin-bottom:32px;
    scroll-margin-top:100px;
}

body.admin-dashboard .section-heading {
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:30px;
    margin-bottom:18px;
}

body.admin-dashboard .eyebrow {
    display:inline-block;
    margin-bottom:5px;
    color:var(--lavender-600);
    font-size:12px;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
}

body.admin-dashboard .section-heading h2 {
    font-family:"Playfair Display",serif;
    font-size:31px;
    line-height:1.15;
}

body.admin-dashboard .section-heading > p {
    max-width:470px;
    color:var(--muted);
    font-size:14px;
}

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

body.admin-dashboard .admin-hero {
    display:grid;
    grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr);
    border:1px solid var(--line);
    border-radius:var(--radius-lg);
    overflow:hidden;
    background:var(--paper);
    box-shadow:var(--shadow-sm);
}

body.admin-dashboard .hero-main {
    position:relative;
    min-height:390px;
    padding:40px;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    background:
        radial-gradient(circle at 85% 15%,rgba(139,99,217,.17),transparent 30%),
        linear-gradient(135deg,var(--paper),var(--lavender-50));
}

body.admin-dashboard .hero-main h1 {
    max-width:720px;
    font-family:"Playfair Display",serif;
    font-size:clamp(35px,4vw,58px);
    line-height:1.05;
    letter-spacing:-.025em;
}

body.admin-dashboard .hero-main h1 span {
    color:var(--lavender-600);
}

body.admin-dashboard .hero-main > div > p {
    max-width:650px;
    margin-top:17px;
    color:var(--muted);
    font-size:16px;
}

body.admin-dashboard .hero-bottom {
    display:flex;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
}

body.admin-dashboard .btn {
    min-height:46px;
    padding:10px 18px;
    border-radius:13px;
    border:1px solid var(--line);
    background:var(--paper);
    color:var(--ink);
    font-weight:700;
}

body.admin-dashboard .btn-primary {
    border-color:var(--lavender-600);
    background:var(--lavender-600);
    color:#fff;
}

body.admin-dashboard .btn-primary:hover {
    background:var(--lavender-700);
}

body.admin-dashboard .btn-soft {
    background:var(--lavender-100);
    border-color:var(--lavender-200);
    color:var(--lavender-700);
}

body.admin-dashboard .hero-image {
    min-height:390px;
    position:relative;
    overflow:hidden;
}

body.admin-dashboard .hero-image img {
    width:100%;
    height:100%;
    object-fit:cover;
}

body.admin-dashboard .hero-image::after {
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,transparent 45%,rgba(20,15,28,.4));
}

/* =========================================================
   KPI STRIP
========================================================= */

body.admin-dashboard .kpi-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:14px;
    margin-top:18px;
}

body.admin-dashboard .kpi {
    min-height:150px;
    padding:23px;
    background:var(--paper);
    border:1px solid var(--line);
    border-radius:20px;
    box-shadow:var(--shadow-sm);
}

body.admin-dashboard .kpi-top {
    display:flex;
    align-items:center;
    justify-content:space-between;
}

body.admin-dashboard .kpi-icon {
    width:43px;
    height:43px;
    display:grid;
    place-items:center;
    border-radius:13px;
    background:var(--lavender-100);
    color:var(--lavender-700);
}

body.admin-dashboard .kpi-icon svg {
    width:20px;
    height:20px;
}

body.admin-dashboard .kpi-label {
    display:block;
    margin-top:18px;
    color:var(--muted);
    font-size:13px;
}

body.admin-dashboard .kpi strong {
    display:block;
    margin-top:2px;
    font-size:27px;
    line-height:1.1;
}

body.admin-dashboard .kpi-note {
    display:block;
    margin-top:4px;
    color:var(--green);
    font-size:13px;
}

/* =========================================================
   APPOINTMENTS
========================================================= */

body.admin-dashboard .appointment-layout {
    display:grid;
    grid-template-columns:minmax(0,1.2fr) minmax(310px,.8fr);
    align-items:stretch;
    overflow:hidden;
    border-radius:var(--radius-lg);
    border:1px solid var(--line);
    background:var(--paper);
    box-shadow:var(--shadow-sm);
}

body.admin-dashboard .appointment-main {
    padding:32px;
}

body.admin-dashboard .appointment-side {
    position:relative;
    min-height:100%;
    overflow:hidden;
}

body.admin-dashboard .appointment-side img {
    width:100%;
    height:100%;
    object-fit:cover;
}

body.admin-dashboard .appointment-side::after {
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,transparent 45%,rgba(24,17,31,.65));
}

body.admin-dashboard .appointment-side-copy {
    position:absolute;
    z-index:2;
    left:25px;
    right:25px;
    bottom:25px;
    color:white;
}

body.admin-dashboard .appointment-side-copy small {
    font-size:12px;
    opacity:.8;
}

body.admin-dashboard .appointment-side-copy strong {
    display:block;
    margin-top:4px;
    font-family:"Playfair Display",serif;
    font-size:24px;
}

body.admin-dashboard .appointment-top {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
    padding-bottom:25px;
    border-bottom:1px solid var(--line);
}

body.admin-dashboard .patient-profile {
    display:flex;
    align-items:center;
    gap:13px;
}

body.admin-dashboard .patient-photo {
    width:58px;
    height:58px;
    overflow:hidden;
    border-radius:17px;
    background:var(--lavender-100);
}

body.admin-dashboard .patient-photo img {
    width:100%;
    height:100%;
    object-fit:cover;
}

body.admin-dashboard .patient-info strong {
    display:block;
    font-size:17px;
}

body.admin-dashboard .patient-info span {
    display:block;
    margin-top:2px;
    color:var(--muted);
    font-size:13px;
}

body.admin-dashboard .status {
    padding:7px 12px;
    border-radius:30px;
    background:var(--green-bg);
    color:var(--green);
    font-size:12px;
    font-weight:700;
}

body.admin-dashboard .appointment-grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:15px;
    margin-top:25px;
}

body.admin-dashboard .appointment-detail {
    padding:17px;
    border-radius:15px;
    background:var(--lavender-50);
    border:1px solid var(--line);
}

body.admin-dashboard .appointment-detail span {
    display:block;
    color:var(--muted);
    font-size:12px;
}

body.admin-dashboard .appointment-detail strong {
    display:block;
    margin-top:4px;
    font-size:15px;
}

body.admin-dashboard .appointment-actions {
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    margin-top:20px;
}

/* =========================================================
   PATIENT MANAGEMENT
========================================================= */

body.admin-dashboard .patient-layout {
    display:grid;
    grid-template-columns:minmax(0,1fr) 330px;
    gap:18px;
}

body.admin-dashboard .panel {
    background:var(--paper);
    border:1px solid var(--line);
    border-radius:var(--radius-lg);
    box-shadow:var(--shadow-sm);
    overflow:hidden;
}

body.admin-dashboard .panel-head {
    padding:23px 25px;
    border-bottom:1px solid var(--line);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;
}

body.admin-dashboard .panel-head h3 {
    font-size:19px;
}

body.admin-dashboard .panel-head p {
    color:var(--muted);
    font-size:13px;
}

body.admin-dashboard .search-box {
    width:250px;
    min-height:43px;
    border:1px solid var(--line);
    border-radius:12px;
    background:var(--lavender-50);
    color:var(--ink);
    padding:9px 13px;
    outline:none;
}

body.admin-dashboard .search-box:focus {
    border-color:var(--lavender-500);
}

body.admin-dashboard .patient-table {
    width:100%;
    border-collapse:collapse;
}

body.admin-dashboard .patient-table th {
    padding:15px 20px;
    text-align:left;
    color:var(--soft);
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:.06em;
    border-bottom:1px solid var(--line);
}

body.admin-dashboard .patient-table td {
    padding:17px 20px;
    border-bottom:1px solid var(--line);
    font-size:14px;
}

body.admin-dashboard .patient-table tr:last-child td {
    border-bottom:0;
}

body.admin-dashboard .table-patient {
    display:flex;
    align-items:center;
    gap:11px;
}

body.admin-dashboard .table-avatar {
    width:39px;
    height:39px;
    border-radius:12px;
    overflow:hidden;
    flex:0 0 39px;
    background:var(--lavender-100);
}

body.admin-dashboard .table-avatar img {
    width:100%;
    height:100%;
    object-fit:cover;
}

body.admin-dashboard .table-patient strong {
    display:block;
}

body.admin-dashboard .table-patient span {
    display:block;
    color:var(--muted);
    font-size:12px;
}

body.admin-dashboard .badge {
    display:inline-flex;
    align-items:center;
    padding:5px 9px;
    border-radius:20px;
    font-size:12px;
    font-weight:700;
}

body.admin-dashboard .badge.green {
    color:var(--green);
    background:var(--green-bg);
}

body.admin-dashboard .badge.orange {
    color:var(--orange);
    background:var(--orange-bg);
}

body.admin-dashboard .badge.blue {
    color:var(--blue);
    background:var(--blue-bg);
}

body.admin-dashboard .patient-side {
    padding:25px;
}

body.admin-dashboard .patient-side h3 {
    font-size:19px;
}

body.admin-dashboard .patient-side > p {
    margin-top:3px;
    color:var(--muted);
    font-size:13px;
}

body.admin-dashboard .mini-stat {
    padding:17px 0;
    border-bottom:1px solid var(--line);
}

body.admin-dashboard .mini-stat:last-child {
    border-bottom:0;
}

body.admin-dashboard .mini-stat span {
    color:var(--muted);
    font-size:13px;
}

body.admin-dashboard .mini-stat strong {
    display:block;
    margin-top:2px;
    font-size:24px;
}

/* =========================================================
   TREATMENT MONITOR
========================================================= */

body.admin-dashboard .treatment-layout {
    display:grid;
    grid-template-columns:1.05fr .95fr;
    gap:18px;
}

body.admin-dashboard .treatment-visual {
    position:relative;
    min-height:440px;
    overflow:hidden;
    border-radius:var(--radius-lg);
}

body.admin-dashboard .treatment-visual img {
    width:100%;
    height:100%;
    object-fit:cover;
}

body.admin-dashboard .treatment-visual::after {
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,transparent 35%,rgba(23,17,30,.75));
}

body.admin-dashboard .treatment-overlay {
    position:absolute;
    z-index:2;
    left:30px;
    right:30px;
    bottom:27px;
    color:#fff;
}

body.admin-dashboard .treatment-overlay small {
    font-size:12px;
    opacity:.8;
}

body.admin-dashboard .treatment-overlay h3 {
    margin-top:5px;
    font-family:"Playfair Display",serif;
    font-size:29px;
}

body.admin-dashboard .treatment-overlay p {
    margin-top:5px;
    max-width:550px;
    font-size:13px;
    opacity:.88;
}

body.admin-dashboard .treatment-panel {
    padding:29px;
    background:var(--paper);
    border:1px solid var(--line);
    border-radius:var(--radius-lg);
    box-shadow:var(--shadow-sm);
}

body.admin-dashboard .treatment-panel h3 {
    font-size:20px;
}

body.admin-dashboard .progress-row {
    margin-top:24px;
}

body.admin-dashboard .progress-meta {
    display:flex;
    justify-content:space-between;
    gap:10px;
    font-size:13px;
}

body.admin-dashboard .progress-meta span {
    color:var(--muted);
}

body.admin-dashboard .progress-bar {
    height:10px;
    margin-top:9px;
    border-radius:30px;
    background:var(--lavender-100);
    overflow:hidden;
}

body.admin-dashboard .progress-fill {
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg,var(--lavender-500),var(--lavender-700));
}

body.admin-dashboard .stage-list {
    margin-top:25px;
    border-top:1px solid var(--line);
}

body.admin-dashboard .stage {
    display:flex;
    gap:13px;
    padding:17px 0;
    border-bottom:1px solid var(--line);
}

body.admin-dashboard .stage:last-child {
    border-bottom:0;
}

body.admin-dashboard .stage-dot {
    width:28px;
    height:28px;
    flex:0 0 28px;
    border-radius:50%;
    display:grid;
    place-items:center;
    font-size:11px;
    font-weight:700;
    background:var(--lavender-100);
    color:var(--lavender-700);
}

body.admin-dashboard .stage.done .stage-dot {
    background:var(--green-bg);
    color:var(--green);
}

body.admin-dashboard .stage.current .stage-dot {
    background:var(--lavender-600);
    color:#fff;
}

body.admin-dashboard .stage strong {
    display:block;
    font-size:14px;
}

body.admin-dashboard .stage span {
    display:block;
    color:var(--muted);
    font-size:12px;
}

/* =========================================================
   FINANCE
========================================================= */

body.admin-dashboard .finance-layout {
    display:grid;
    grid-template-columns:.9fr 1.1fr;
    gap:18px;
}

body.admin-dashboard .finance-summary {
    padding:30px;
    border-radius:var(--radius-lg);
    background:
        radial-gradient(circle at 80% 15%,rgba(139,99,217,.22),transparent 32%),
        var(--paper);
    border:1px solid var(--line);
    box-shadow:var(--shadow-sm);
}

body.admin-dashboard .finance-summary h3 {
    font-size:20px;
}

body.admin-dashboard .finance-amount {
    margin-top:28px;
}

body.admin-dashboard .finance-amount span {
    display:block;
    color:var(--muted);
    font-size:13px;
}

body.admin-dashboard .finance-amount strong {
    display:block;
    margin-top:2px;
    font-family:"Playfair Display",serif;
    font-size:42px;
}

body.admin-dashboard .finance-bar {
    height:12px;
    margin-top:19px;
    background:var(--lavender-100);
    border-radius:30px;
    overflow:hidden;
}

body.admin-dashboard .finance-bar div {
    width:58%;
    height:100%;
    background:var(--lavender-600);
    border-radius:inherit;
}

body.admin-dashboard .finance-summary > p {
    margin-top:10px;
    color:var(--muted);
    font-size:13px;
}

body.admin-dashboard .finance-summary .btn {
    margin-top:23px;
}

body.admin-dashboard .installment-panel {
    padding:28px;
    border-radius:var(--radius-lg);
    background:var(--paper);
    border:1px solid var(--line);
    box-shadow:var(--shadow-sm);
}

body.admin-dashboard .installment-panel h3 {
    font-size:20px;
}

body.admin-dashboard .installment-list {
    margin-top:15px;
}

body.admin-dashboard .installment {
    display:grid;
    grid-template-columns:35px 1fr auto;
    gap:13px;
    align-items:center;
    padding:15px 0;
    border-bottom:1px solid var(--line);
}

body.admin-dashboard .installment:last-child {
    border-bottom:0;
}

body.admin-dashboard .installment-dot {
    width:30px;
    height:30px;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:var(--lavender-100);
    color:var(--lavender-700);
    font-size:12px;
    font-weight:700;
}

body.admin-dashboard .installment.paid .installment-dot {
    background:var(--green-bg);
    color:var(--green);
}

body.admin-dashboard .installment strong {
    display:block;
    font-size:14px;
}

body.admin-dashboard .installment span {
    display:block;
    color:var(--muted);
    font-size:12px;
}

body.admin-dashboard .installment amount {
    font-size:14px;
    font-weight:700;
}

/* =========================================================
   PROGRESS PHOTOS
========================================================= */

body.admin-dashboard .photo-grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:16px;
}

body.admin-dashboard .photo-card {
    overflow:hidden;
    border-radius:var(--radius-lg);
    background:var(--paper);
    border:1px solid var(--line);
    box-shadow:var(--shadow-sm);
}

body.admin-dashboard .photo-image {
    height:285px;
    overflow:hidden;
}

body.admin-dashboard .photo-image img {
    width:100%;
    height:100%;
    object-fit:cover;
    transition:.5s ease;
}

body.admin-dashboard .photo-card:hover .photo-image img {
    transform:scale(1.04);
}

body.admin-dashboard .photo-info {
    padding:19px;
}

body.admin-dashboard .photo-info span {
    color:var(--muted);
    font-size:12px;
}

body.admin-dashboard .photo-info strong {
    display:block;
    margin-top:3px;
    font-size:16px;
}

/* =========================================================
   ACTIVITY
========================================================= */

body.admin-dashboard .activity-layout {
    display:grid;
    grid-template-columns:1.1fr .9fr;
    gap:18px;
}

body.admin-dashboard .activity-panel {
    padding:29px;
    background:var(--paper);
    border:1px solid var(--line);
    border-radius:var(--radius-lg);
    box-shadow:var(--shadow-sm);
}

body.admin-dashboard .activity-panel h3 {
    font-size:20px;
}

body.admin-dashboard .activity-item {
    display:grid;
    grid-template-columns:42px 1fr auto;
    gap:13px;
    align-items:start;
    padding:19px 0;
    border-bottom:1px solid var(--line);
}

body.admin-dashboard .activity-item:last-child {
    border-bottom:0;
}

body.admin-dashboard .activity-icon {
    width:38px;
    height:38px;
    border-radius:12px;
    display:grid;
    place-items:center;
    background:var(--lavender-100);
    color:var(--lavender-700);
}

body.admin-dashboard .activity-icon svg {
    width:18px;
}

body.admin-dashboard .activity-item strong {
    display:block;
    font-size:14px;
}

body.admin-dashboard .activity-item p {
    margin-top:2px;
    color:var(--muted);
    font-size:13px;
}

body.admin-dashboard .activity-time {
    color:var(--soft);
    font-size:12px;
    white-space:nowrap;
}

/* =========================================================
   QUICK ACTIONS
========================================================= */

body.admin-dashboard .quick-actions {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:14px;
}

body.admin-dashboard .quick-action {
    min-height:155px;
    padding:21px;
    text-align:left;
    border:1px solid var(--line);
    border-radius:20px;
    background:var(--paper);
    color:var(--ink);
    box-shadow:var(--shadow-sm);
    transition:.25s ease;
}

body.admin-dashboard .quick-action:hover {
    transform:translateY(-3px);
    border-color:var(--lavender-300);
}

body.admin-dashboard .quick-action-icon {
    width:45px;
    height:45px;
    flex:0 0 45px;
    display:grid !important;
    place-items:center !important;
    border-radius:13px;
    background:var(--lavender-100);
    color:var(--lavender-700);
}

body.admin-dashboard .quick-action-icon svg {
    width:21px;
    height:21px;
    display:block;
}

body.admin-dashboard .quick-action strong {
    display:block;
    margin-top:17px;
    font-size:15px;
}

body.admin-dashboard .quick-action > span:not(.quick-action-icon) {
    display:block;
    margin-top:3px;
    color:var(--muted);
    font-size:13px;
}

/* =========================================================
   OVERLAY / TOAST
========================================================= */

body.admin-dashboard .overlay {
    display:none;
    position:fixed;
    inset:0;
    background:rgba(15,10,20,.45);
    z-index:900;
}

body.admin-dashboard .overlay.show {
    display:block;
}

body.admin-dashboard .toast {
    position:fixed;
    right:25px;
    bottom:25px;
    max-width:360px;
    padding:15px 18px;
    border-radius:15px;
    background:var(--ink);
    color:var(--paper);
    box-shadow:var(--shadow-md);
    transform:translateY(30px);
    opacity:0;
    pointer-events:none;
    transition:.3s ease;
    z-index:2000;
    font-size:14px;
}

body.admin-dashboard .toast.show {
    transform:translateY(0);
    opacity:1;
}

/* =========================================================
   RTL
========================================================= */















/* =========================================================
   RESPONSIVE
========================================================= */

@media(max-width:1200px){

    body.admin-dashboard .kpi-grid {
        grid-template-columns:repeat(2,1fr);
    }

    body.admin-dashboard .quick-actions {
        grid-template-columns:repeat(2,1fr);
    }

    body.admin-dashboard .patient-layout {
        grid-template-columns:1fr;
    }

    body.admin-dashboard .treatment-layout,
body.admin-dashboard .finance-layout,
body.admin-dashboard .activity-layout {
        grid-template-columns:1fr;
    }
}

@media(max-width:1000px){

    body.admin-dashboard .admin-hero {
        grid-template-columns:1fr;
    }

    body.admin-dashboard .hero-image {
        min-height:330px;
    }

    body.admin-dashboard .appointment-layout {
        grid-template-columns:1fr;
    }

    body.admin-dashboard .appointment-side {
        min-height:320px;
    }

    body.admin-dashboard .photo-grid {
        grid-template-columns:repeat(2,1fr);
    }
}

@media(max-width:900px){

    body.admin-dashboard .sidebar {
        left:-100%;
        width:min(290px,86vw);
        box-shadow:var(--shadow-md);
    }

    body.admin-dashboard .sidebar.open {
        left:0;
    }

    

    

    

    body.admin-dashboard .mobile-menu {
        display:grid;
    }

    body.admin-dashboard .topbar {
        padding:0 18px;
    }

    body.admin-dashboard .top-admin span {
        display:none;
    }

    body.admin-dashboard .content {
        padding:25px 18px;
    }

    body.admin-dashboard .section-heading {
        align-items:flex-start;
        flex-direction:column;
        gap:7px;
    }

    body.admin-dashboard .section-heading h2 {
        font-size:28px;
    }

    body.admin-dashboard .hero-main {
        min-height:390px;
        padding:30px;
    }

    body.admin-dashboard .hero-image {
        min-height:300px;
    }

    body.admin-dashboard .appointment-grid {
        grid-template-columns:1fr 1fr;
    }

    body.admin-dashboard .treatment-visual {
        min-height:390px;
    }
}

@media(max-width:650px){

    body.admin-dashboard {
        font-size:14px;
    }

    body.admin-dashboard .topbar {
        height:70px;
    }

    body.admin-dashboard .page-title small {
        display:none;
    }

    body.admin-dashboard .page-title strong {
        font-size:17px;
    }

    body.admin-dashboard .circle-btn {
        width:39px;
        height:39px;
    }

    body.admin-dashboard .notification {
        display:none;
    }

    body.admin-dashboard .content {
        padding:20px 14px;
    }

    body.admin-dashboard .dashboard-section {
        margin-bottom:25px;
    }

    body.admin-dashboard .hero-main {
        min-height:400px;
        padding:25px;
    }

    body.admin-dashboard .hero-main h1 {
        font-size:38px;
    }

    body.admin-dashboard .hero-main > div > p {
        font-size:14px;
    }

    body.admin-dashboard .hero-bottom {
        flex-direction:column;
        align-items:stretch;
    }

    body.admin-dashboard .hero-bottom .btn {
        width:100%;
    }

    body.admin-dashboard .hero-image {
        min-height:260px;
    }

    body.admin-dashboard .kpi-grid {
        grid-template-columns:1fr;
    }

    body.admin-dashboard .kpi {
        min-height:135px;
    }

    body.admin-dashboard .appointment-main {
        padding:22px;
    }

    body.admin-dashboard .appointment-top {
        align-items:flex-start;
        flex-direction:column;
    }

    body.admin-dashboard .appointment-grid {
        grid-template-columns:1fr;
    }

    body.admin-dashboard .appointment-side {
        min-height:280px;
    }

    body.admin-dashboard .patient-table {
        min-width:680px;
    }

    body.admin-dashboard .panel {
        overflow-x:auto;
    }

    body.admin-dashboard .panel-head {
        align-items:flex-start;
        flex-direction:column;
    }

    body.admin-dashboard .search-box {
        width:100%;
    }

    body.admin-dashboard .treatment-visual {
        min-height:340px;
    }

    body.admin-dashboard .treatment-overlay {
        left:22px;
        right:22px;
        bottom:22px;
    }

    body.admin-dashboard .treatment-overlay h3 {
        font-size:25px;
    }

    body.admin-dashboard .treatment-panel,
body.admin-dashboard .finance-summary,
body.admin-dashboard .installment-panel,
body.admin-dashboard .activity-panel {
        padding:22px;
    }

    body.admin-dashboard .finance-amount strong {
        font-size:36px;
    }

    body.admin-dashboard .photo-grid {
        grid-template-columns:1fr;
    }

    body.admin-dashboard .photo-image {
        height:300px;
    }

    body.admin-dashboard .quick-actions {
        grid-template-columns:1fr;
    }

    body.admin-dashboard .quick-action {
        min-height:125px;
    }

    body.admin-dashboard .toast {
        left:14px;
        right:14px;
        bottom:14px;
        max-width:none;
    }
}



/* =========================================================
   DASHBOARD NAV DROPDOWN — SHARED WEBSITE HEADER
========================================================= */
.dashboard-nav-dropdown{position:relative;}
.dashboard-nav-button{white-space:nowrap;}
.dashboard-nav-dropdown .dashboard-dropdown-menu{min-width:185px;right:0;left:auto;}
.dashboard-nav-dropdown .dashboard-dropdown-menu a{white-space:nowrap;}
.dashboard-nav-dropdown.is-open .dashboard-dropdown-menu{opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto;}
.mobile-dashboard-menu{width:100%;}
.mobile-dashboard-button{width:100%;display:flex;align-items:center;justify-content:space-between;border:0;background:transparent;color:inherit;font:inherit;padding:14px 0;cursor:pointer;}
.mobile-dashboard-links{display:none;padding:0 0 8px 14px;}
.mobile-dashboard-links.open{display:grid;}
.mobile-dashboard-links a{padding:9px 0;}
@media(max-width:900px){
  .dashboard-nav-dropdown{display:none !important;}
}


/* =========================================================
   DASHBOARD SHELL NORMALIZATION — PATIENT + ADMIN
   Compact sticky header / shared alignment / responsive sizing
========================================================= */
body.patient-dashboard .sidebar,
body.admin-dashboard .sidebar{
    top:0;
    height:100vh;
}

body.patient-dashboard .sidebar-brand,
body.admin-dashboard .sidebar-brand{
    min-height:64px;
    height:64px;
    padding-top:0;
    padding-bottom:0;
    margin-bottom:14px;
    display:flex;
    align-items:center;
}

body.patient-dashboard .topbar,
body.admin-dashboard .topbar{
    position:sticky;
    top:0;
    height:64px;
    min-height:64px;
    padding:0 24px;
    display:flex;
    align-items:center;
    z-index:1200;
}

body.patient-dashboard .page-heading h1,
body.admin-dashboard .page-title strong{
    font-size:24px;
    line-height:1.1;
    font-weight:600;
}

body.patient-dashboard .page-heading small,
body.admin-dashboard .page-title small{
    font-size:11px;
    line-height:1.1;
    margin-bottom:3px;
}

body.patient-dashboard .topbar-left,
body.admin-dashboard .topbar-left,
body.patient-dashboard .topbar-actions,
body.admin-dashboard .topbar-actions{
    min-height:0;
    align-items:center;
}

body.patient-dashboard .round-control,
body.admin-dashboard .circle-btn{
    width:40px;
    height:40px;
    flex:0 0 40px;
}

body.patient-dashboard .patient-mini,
body.admin-dashboard .top-admin{
    min-height:40px;
    align-items:center;
}

body.patient-dashboard .content,
body.admin-dashboard .content{
    scroll-margin-top:80px;
}

body.patient-dashboard .dashboard-section,
body.admin-dashboard .dashboard-section{
    scroll-margin-top:82px;
}

/* Shared portal switch inside dashboard sidebars */
body.patient-dashboard .portal-switch,
body.admin-dashboard .portal-switch{
    display:grid;
    gap:4px;
    margin:0 0 12px;
    padding:8px;
    border:1px solid var(--line);
    border-radius:14px;
    background:var(--lavender-50);
}

body.patient-dashboard .portal-link,
body.admin-dashboard .portal-link{
    display:flex;
    align-items:center;
    min-height:36px;
    padding:7px 10px;
    border-radius:10px;
    color:var(--muted);
    font-size:12px;
    font-weight:700;
    line-height:1.2;
    text-decoration:none;
    transition:background .2s ease,color .2s ease;
}

body.patient-dashboard .portal-link:hover,
body.admin-dashboard .portal-link:hover,
body.patient-dashboard .portal-link.active,
body.admin-dashboard .portal-link.active{
    color:var(--lavender-700);
    background:var(--lavender-100);
}

@media (max-width:900px){
    body.patient-dashboard .topbar,
    body.admin-dashboard .topbar{
        height:60px;
        min-height:60px;
        padding:0 16px;
    }
    body.patient-dashboard .page-heading h1,
    body.admin-dashboard .page-title strong{
        font-size:21px;
    }
    body.patient-dashboard .page-heading small,
    body.admin-dashboard .page-title small{
        font-size:10px;
    }
    body.patient-dashboard .round-control,
    body.admin-dashboard .circle-btn{
        width:38px;
        height:38px;
        flex-basis:38px;
    }
    body.patient-dashboard .sidebar-brand,
    body.admin-dashboard .sidebar-brand{
        min-height:64px;
        height:64px;
        margin-bottom:10px;
    }
}

@media (max-width:560px){
    body.patient-dashboard .topbar,
    body.admin-dashboard .topbar{
        padding:0 12px;
        gap:8px;
    }
    body.patient-dashboard .topbar-left,
    body.admin-dashboard .topbar-left{
        gap:8px;
        min-width:0;
    }
    body.patient-dashboard .topbar-actions,
    body.admin-dashboard .topbar-actions{
        gap:5px;
    }
    body.patient-dashboard .page-heading h1,
    body.admin-dashboard .page-title strong{
        font-size:19px;
    }
}

/* Final shared dashboard visual alignment */
body.patient-dashboard .sidebar,
body.admin-dashboard .sidebar{
    padding:0 15px 15px;
}
body.patient-dashboard .sidebar-brand,
body.admin-dashboard .sidebar-brand{
    width:100%;
    padding-left:10px;
    padding-right:10px;
    border-bottom:1px solid var(--line);
    margin-bottom:14px;
}
body.patient-dashboard .brand-mark,
body.admin-dashboard .brand-mark{
    width:42px;
    height:42px;
    min-width:42px;
    flex:0 0 42px;
    border-radius:50%;
}
body.patient-dashboard .brand-mark svg,
body.admin-dashboard .brand-mark svg{
    width:24px;
    height:24px;
}
body.patient-dashboard .brand-text strong,
body.admin-dashboard .brand-text strong{
    font-size:22px;
    line-height:1;
}
body.patient-dashboard .brand-text span,
body.admin-dashboard .brand-text span{
    font-size:10px;
    line-height:1.1;
    margin-top:4px;
}
body.patient-dashboard .sidebar-nav,
body.admin-dashboard .sidebar-nav{
    padding:0;
}
body.patient-dashboard .sidebar-bottom,
body.admin-dashboard .sidebar-bottom{
    padding:0;
}


/* =========================================================
   FINAL DASHBOARD FIX — COMPACT / STICKY / SHARED SHELL
   Patient + Admin use the same shell measurements.
========================================================= */
body.patient-dashboard .sidebar,
body.admin-dashboard .sidebar{
    top:0 !important;
    bottom:0 !important;
    height:100vh !important;
    padding:0 15px 14px !important;
    overflow-y:auto;
}

body.patient-dashboard .main-area,
body.admin-dashboard .main{
    margin-top:0 !important;
    padding-top:0 !important;
    min-height:100vh;
}

body.patient-dashboard .topbar,
body.admin-dashboard .topbar{
    position:sticky !important;
    top:0 !important;
    height:64px !important;
    min-height:64px !important;
    margin:0 !important;
    padding:0 24px !important;
    box-sizing:border-box !important;
    display:flex !important;
    align-items:center !important;
    z-index:1500 !important;
}

body.patient-dashboard .sidebar-brand,
body.admin-dashboard .sidebar-brand{
    height:64px !important;
    min-height:64px !important;
    margin:0 0 12px !important;
    padding:0 10px !important;
    box-sizing:border-box !important;
    flex:0 0 64px !important;
}

body.patient-dashboard .sidebar-nav,
body.admin-dashboard .sidebar-nav{
    flex:1 1 auto !important;
    min-height:0 !important;
    overflow-y:auto !important;
    padding:0 !important;
}

body.patient-dashboard .sidebar-bottom,
body.admin-dashboard .sidebar-bottom{
    flex:0 0 auto !important;
    margin-top:auto !important;
    padding:0 !important;
}

/* Dashboard sidebar contains only Logout at the bottom. */
body.patient-dashboard .sidebar-bottom .sidebar-divider,
body.admin-dashboard .sidebar-bottom .sidebar-divider{
    margin:12px 7px 8px !important;
}

body.patient-dashboard .logout-btn,
body.admin-dashboard .logout-btn{
    width:100% !important;
    min-height:44px !important;
    margin:0 !important;
    padding:9px 12px !important;
    border:0 !important;
    border-radius:12px !important;
    box-sizing:border-box !important;
}

/* Same header typography and controls on both dashboards. */
body.patient-dashboard .page-heading h1,
body.admin-dashboard .page-title strong{
    margin:0 !important;
    font-size:22px !important;
    line-height:1.15 !important;
    font-weight:600 !important;
}
body.patient-dashboard .page-heading small,
body.admin-dashboard .page-title small{
    margin:0 0 2px !important;
    font-size:11px !important;
    line-height:1.1 !important;
}
body.patient-dashboard .topbar-left,
body.admin-dashboard .topbar-left{
    display:flex !important;
    align-items:center !important;
    min-width:0 !important;
    gap:12px !important;
}
body.patient-dashboard .topbar-actions,
body.admin-dashboard .topbar-actions{
    display:flex !important;
    align-items:center !important;
    gap:8px !important;
    min-width:0 !important;
}
body.patient-dashboard .round-control,
body.admin-dashboard .circle-btn{
    width:40px !important;
    height:40px !important;
    min-width:40px !important;
    min-height:40px !important;
    flex:0 0 40px !important;
}

/* Prevent dashboard header from creating any extra vertical area. */
body.patient-dashboard .content,
body.admin-dashboard .content{
    margin-top:0 !important;
    padding-top:24px;
}

@media (max-width:900px){
    body.patient-dashboard .topbar,
    body.admin-dashboard .topbar{
        height:60px !important;
        min-height:60px !important;
        padding:0 16px !important;
    }
    body.patient-dashboard .sidebar-brand,
    body.admin-dashboard .sidebar-brand{
        height:60px !important;
        min-height:60px !important;
        flex-basis:60px !important;
    }
    body.patient-dashboard .page-heading h1,
    body.admin-dashboard .page-title strong{
        font-size:20px !important;
    }
    body.patient-dashboard .page-heading small,
    body.admin-dashboard .page-title small{
        font-size:10px !important;
    }
    body.patient-dashboard .round-control,
    body.admin-dashboard .circle-btn{
        width:38px !important;
        height:38px !important;
        min-width:38px !important;
        min-height:38px !important;
        flex-basis:38px !important;
    }
}

@media (max-width:640px){
    body.patient-dashboard .topbar,
    body.admin-dashboard .topbar{
        height:58px !important;
        min-height:58px !important;
        padding:0 12px !important;
        gap:6px !important;
    }
    body.patient-dashboard .topbar-left,
    body.admin-dashboard .topbar-left{
        gap:8px !important;
    }
    body.patient-dashboard .topbar-actions,
    body.admin-dashboard .topbar-actions{
        gap:5px !important;
    }
    body.patient-dashboard .page-heading h1,
    body.admin-dashboard .page-title strong{
        font-size:18px !important;
    }
    body.patient-dashboard .page-heading small,
    body.admin-dashboard .page-title small{
        display:none !important;
    }
    body.patient-dashboard .patient-mini-text,
    body.admin-dashboard .top-admin span{
        display:none !important;
    }
    body.patient-dashboard .content,
    body.admin-dashboard .content{
        padding-top:18px !important;
    }
}

/* Mobile admin drawer uses the same behavior as patient. */
@media (max-width:900px){
    body.admin-dashboard .main{
        margin-left:0 !important;
    }
}

/* Remove the public-site header offset from standalone dashboards. */
body.patient-dashboard,
body.admin-dashboard{
    padding-top:0 !important;
    margin:0 !important;
}


/* =========================================================
   FINAL DASHBOARD HEADER FIX — TRUE FIXED / RESPONSIVE
   The dashboard header must remain visible while the page scrolls.
   Keep the existing header design; only change its positioning.
========================================================= */
body.admin-dashboard,
body.patient-dashboard{
    --dashboard-sidebar-w:270px;
    --dashboard-topbar-h:64px;
}

/* Remove the header from document scrolling completely. */
body.admin-dashboard .topbar,
body.patient-dashboard .topbar{
    position:fixed !important;
    top:0 !important;
    right:0 !important;
    left:var(--dashboard-sidebar-w) !important;
    width:auto !important;
    height:var(--dashboard-topbar-h) !important;
    min-height:var(--dashboard-topbar-h) !important;
    margin:0 !important;
    box-sizing:border-box !important;
    z-index:5000 !important;
}

/* Reserve exactly the header height so content never hides underneath it. */
body.admin-dashboard .main,
body.patient-dashboard .main-area{
    position:relative !important;
    min-height:100vh !important;
    padding-top:var(--dashboard-topbar-h) !important;
    overflow:visible !important;
}

/* RTL: fixed header starts after the right-hand sidebar. */
html.rtl body.admin-dashboard .topbar,
html.rtl body.patient-dashboard .topbar,
body.admin-dashboard.rtl .topbar,
body.patient-dashboard.rtl .topbar{
    left:0 !important;
    right:var(--dashboard-sidebar-w) !important;
}

/* Mobile/tablet: sidebar becomes a drawer, so the header spans the full viewport. */
@media (max-width:900px){
    body.admin-dashboard,
    body.patient-dashboard{
        --dashboard-sidebar-w:0px;
        --dashboard-topbar-h:60px;
    }

    body.admin-dashboard .topbar,
    body.patient-dashboard .topbar{
        left:0 !important;
        right:0 !important;
        width:100% !important;
        height:60px !important;
        min-height:60px !important;
        top:0 !important;
        z-index:5000 !important;
    }

    html.rtl body.admin-dashboard .topbar,
    html.rtl body.patient-dashboard .topbar,
    body.admin-dashboard.rtl .topbar,
    body.patient-dashboard.rtl .topbar{
        left:0 !important;
        right:0 !important;
    }

    body.admin-dashboard .main,
    body.patient-dashboard .main-area{
        padding-top:60px !important;
    }
}

@media (max-width:640px){
    body.admin-dashboard,
    body.patient-dashboard{
        --dashboard-topbar-h:58px;
    }

    body.admin-dashboard .topbar,
    body.patient-dashboard .topbar{
        height:58px !important;
        min-height:58px !important;
        padding-left:12px !important;
        padding-right:12px !important;
    }

    body.admin-dashboard .main,
    body.patient-dashboard .main-area{
        padding-top:58px !important;
    }
}

/* Keep the mobile drawer above page content but below the dashboard header. */
@media (max-width:900px){
    body.admin-dashboard .sidebar,
    body.patient-dashboard .sidebar{
        z-index:4000 !important;
    }

    body.admin-dashboard .overlay,
    body.patient-dashboard .sidebar-overlay{
        z-index:3500 !important;
    }
}


/* =========================================================
   ADMIN DASHBOARD — TYPOGRAPHY IDENTICAL TO PATIENT DASHBOARD
   Typography only. Keeps the existing admin layout/content.
========================================================= */
body.admin-dashboard,
body.admin-dashboard button,
body.admin-dashboard input,
body.admin-dashboard select,
body.admin-dashboard textarea{
    font-family:"DM Sans",sans-serif !important;
}
body.admin-dashboard{
    font-size:15px !important;
    line-height:1.65 !important;
}

/* Sidebar / brand */
body.admin-dashboard .brand-text strong{
    font-family:"Playfair Display",serif !important;
    font-size:23px !important;
    line-height:1 !important;
    font-weight:600 !important;
    letter-spacing:.04em !important;
}
body.admin-dashboard .brand-text span{
    font-family:"DM Sans",sans-serif !important;
    margin-top:6px !important;
    font-size:13px !important;
    line-height:1.2 !important;
    font-weight:600 !important;
    letter-spacing:.08em !important;
    text-transform:uppercase !important;
}
body.admin-dashboard .nav-label{
    font-size:13px !important;
    line-height:1.3 !important;
    font-weight:700 !important;
    letter-spacing:.1em !important;
    text-transform:uppercase !important;
}
body.admin-dashboard .nav-item,
body.admin-dashboard .logout-btn{
    font-family:"DM Sans",sans-serif !important;
    font-size:14px !important;
    line-height:1.4 !important;
    font-weight:600 !important;
}
body.admin-dashboard .admin-mini strong,
body.admin-dashboard .top-admin span{
    font-size:14px !important;
    line-height:1.3 !important;
}
body.admin-dashboard .admin-mini span{
    font-size:13px !important;
    line-height:1.3 !important;
}

/* Topbar — same scale as patient portal */
body.admin-dashboard .page-title small{
    font-size:13px !important;
    line-height:1.3 !important;
    font-weight:700 !important;
    letter-spacing:.08em !important;
    text-transform:uppercase !important;
}
body.admin-dashboard .page-title strong{
    font-family:"Playfair Display",serif !important;
    font-size:27px !important;
    line-height:1.15 !important;
    font-weight:600 !important;
}
body.admin-dashboard .circle-btn,
body.admin-dashboard .top-admin-avatar{
    font-size:13px !important;
    font-weight:700 !important;
}

/* Section heading — exact patient dashboard scale */
body.admin-dashboard .section-heading .eyebrow,
body.admin-dashboard .eyebrow{
    font-size:13px !important;
    line-height:1.3 !important;
    font-weight:700 !important;
    letter-spacing:.11em !important;
    text-transform:uppercase !important;
}
body.admin-dashboard .section-heading h2{
    font-family:"Playfair Display",serif !important;
    font-size:27px !important;
    line-height:1.2 !important;
    font-weight:600 !important;
    letter-spacing:normal !important;
}
body.admin-dashboard .section-heading p{
    font-size:14px !important;
    line-height:1.7 !important;
}

/* Hero — exact patient dashboard hero typography */
body.admin-dashboard .hero-main h1{
    font-family:"Playfair Display",serif !important;
    font-size:clamp(32px,4vw,53px) !important;
    line-height:1.1 !important;
    font-weight:600 !important;
    letter-spacing:normal !important;
}
body.admin-dashboard .hero-main h1 span{
    font-weight:600 !important;
}
body.admin-dashboard .hero-main > div > p{
    font-size:15px !important;
    line-height:1.8 !important;
}
body.admin-dashboard .hero-status strong,
body.admin-dashboard .hero-status span{
    font-size:14px !important;
    line-height:1.3 !important;
}
body.admin-dashboard .hero-status span{
    font-size:13px !important;
}

/* Buttons */
body.admin-dashboard .btn{
    font-family:"DM Sans",sans-serif !important;
    font-size:14px !important;
    line-height:1.4 !important;
    font-weight:700 !important;
}

/* KPI / overview values — same patient dashboard rhythm */
body.admin-dashboard .kpi-label,
body.admin-dashboard .kpi-note{
    font-size:13px !important;
    line-height:1.5 !important;
}
body.admin-dashboard .kpi-label{font-weight:600 !important;}
body.admin-dashboard .kpi strong{
    font-family:"Playfair Display",serif !important;
    font-size:28px !important;
    line-height:1.15 !important;
    font-weight:500 !important;
}

/* All admin content headings use the same serif treatment */
body.admin-dashboard .panel-head h3,
body.admin-dashboard .patient-side h3,
body.admin-dashboard .treatment-panel h3,
body.admin-dashboard .finance-summary h3,
body.admin-dashboard .installment-panel h3,
body.admin-dashboard .activity-panel h3{
    font-family:"Playfair Display",serif !important;
    font-size:24px !important;
    line-height:1.2 !important;
    font-weight:600 !important;
}
body.admin-dashboard .panel-head p,
body.admin-dashboard .patient-side > p,
body.admin-dashboard .finance-summary > p,
body.admin-dashboard .treatment-overlay p,
body.admin-dashboard .activity-item p{
    font-size:14px !important;
    line-height:1.7 !important;
}

/* Names / metadata */
body.admin-dashboard .patient-info strong,
body.admin-dashboard .appointment-detail strong,
body.admin-dashboard .table-patient strong,
body.admin-dashboard .mini-stat strong,
body.admin-dashboard .stage strong,
body.admin-dashboard .installment strong,
body.admin-dashboard .activity-item strong,
body.admin-dashboard .quick-action strong{
    font-size:15px !important;
    line-height:1.4 !important;
    font-weight:700 !important;
}
body.admin-dashboard .patient-info span,
body.admin-dashboard .appointment-detail span,
body.admin-dashboard .table-patient span,
body.admin-dashboard .mini-stat span,
body.admin-dashboard .stage span,
body.admin-dashboard .installment span,
body.admin-dashboard .activity-item span,
body.admin-dashboard .quick-action > span:not(.quick-action-icon){
    font-size:13px !important;
    line-height:1.5 !important;
}

/* Treatment / finance / photos */
body.admin-dashboard .treatment-overlay h3{
    font-family:"Playfair Display",serif !important;
    font-size:27px !important;
    line-height:1.2 !important;
    font-weight:600 !important;
}
body.admin-dashboard .finance-amount strong{
    font-family:"Playfair Display",serif !important;
    font-size:39px !important;
    line-height:1.1 !important;
    font-weight:500 !important;
}
body.admin-dashboard .photo-info span{font-size:13px !important;line-height:1.4 !important;}
body.admin-dashboard .photo-info strong{font-size:17px !important;line-height:1.3 !important;}
body.admin-dashboard .patient-table th,
body.admin-dashboard .patient-table td{
    font-size:13px !important;
    line-height:1.5 !important;
}
body.admin-dashboard input,
body.admin-dashboard select,
body.admin-dashboard textarea,
body.admin-dashboard .search-box{
    font-size:14px !important;
    line-height:1.5 !important;
}

@media (max-width:900px){
    body.admin-dashboard .page-title strong{font-size:27px !important;}
    body.admin-dashboard .section-heading h2{font-size:27px !important;}
    body.admin-dashboard .hero-main h1{font-size:clamp(32px,4vw,53px) !important;}
}
@media (max-width:650px){
    body.admin-dashboard .page-title strong{font-size:27px !important;}
    body.admin-dashboard .section-heading h2{font-size:27px !important;}
    body.admin-dashboard .hero-main h1{font-size:clamp(32px,10vw,45px) !important;}
    body.admin-dashboard .hero-main > div > p{font-size:15px !important;}
    body.admin-dashboard .panel-head h3,
    body.admin-dashboard .patient-side h3,
    body.admin-dashboard .treatment-panel h3,
    body.admin-dashboard .finance-summary h3,
    body.admin-dashboard .installment-panel h3,
    body.admin-dashboard .activity-panel h3{font-size:24px !important;}
}

/* =========================================================
   FINAL DASHBOARD PARITY
   Admin uses the Patient Dashboard shell as the single visual
   reference: same colors, logo geometry, spacing, controls and
   responsive behavior. Admin content remains admin-specific.
========================================================= */
body.admin-dashboard{
    --lavender-50:#faf8fd;
    --lavender-100:#f2ebf8;
    --lavender-200:#e5d8ef;
    --lavender-300:#d2bee2;
    --lavender-400:#b696ca;
    --lavender-500:#9671b2;
    --lavender-600:#76538f;
    --lavender-700:#5c3d70;
    --paper:#ffffff;
    --paper-soft:#fcfbfd;
    --ink:#29242d;
    --ink-soft:#49414e;
    --muted:#756d7c;
    --line:#e7e1ea;
    --success:#62806b;
    --success-bg:#edf5ef;
    --warning:#9c7643;
    --warning-bg:#faf1e2;
    --danger:#a35d61;
    --danger-bg:#faeeee;
    --sidebar-width:268px;
    --shadow-sm:0 8px 28px rgba(62,45,76,.055);
    --shadow-md:0 18px 50px rgba(62,45,76,.10);
    --radius-sm:14px;
    --radius-md:20px;
    --radius-lg:28px;
    --transition:.25s ease;
    background:var(--lavender-50);
    color:var(--ink);
}

body.admin-dashboard .sidebar{
    width:var(--sidebar-width);
    padding:25px 17px 18px;
    background:var(--paper);
    border-right:1px solid var(--line);
    transition:transform var(--transition),background var(--transition),border-color var(--transition);
}
body.admin-dashboard .sidebar-brand{
    height:auto;
    min-height:0;
    padding:0 9px 24px;
    margin-bottom:23px;
    border-bottom:1px solid var(--line);
    gap:12px;
}
body.admin-dashboard .brand-mark{
    width:45px;
    height:45px;
    flex:0 0 45px;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:var(--lavender-100);
    color:var(--lavender-700);
    border:1px solid var(--lavender-200);
}
body.admin-dashboard .brand-mark svg{width:27px;height:27px;}
body.admin-dashboard .brand-text strong{
    font-family:"Playfair Display",serif;
    font-size:23px;
    line-height:1;
    letter-spacing:.04em;
}
body.admin-dashboard .brand-text span{
    margin-top:6px;
    color:var(--muted);
    font-size:13px;
    line-height:1.2;
    font-weight:600;
    letter-spacing:.08em;
    text-transform:uppercase;
}
body.admin-dashboard .sidebar-nav{padding:0;overflow-y:auto;display:flex;flex-direction:column;gap:5px;}
body.admin-dashboard .nav-label{
    padding:0 11px;
    margin-bottom:10px;
    color:var(--muted);
    font-size:13px;
    font-weight:700;
    letter-spacing:.1em;
}
body.admin-dashboard .nav-item{
    width:100%;
    min-height:49px;
    display:flex;
    align-items:center;
    gap:12px;
    padding:11px 13px;
    margin:0;
    border:0;
    border-radius:14px;
    background:transparent;
    color:var(--muted);
    text-align:left;
    font-size:14px;
    font-weight:600;
    transition:background var(--transition),color var(--transition),transform var(--transition);
}
body.admin-dashboard .nav-item:hover{
    color:var(--lavender-700);
    background:var(--lavender-50);
    transform:translateX(2px);
}
body.admin-dashboard .nav-item.active{
    color:var(--lavender-700);
    background:var(--lavender-100);
    box-shadow:inset 3px 0 0 var(--lavender-600);
    font-weight:600;
}
body.admin-dashboard .nav-icon{width:20px;height:20px;flex:0 0 20px;display:grid;place-items:center;}
body.admin-dashboard .nav-icon svg{width:19px;height:19px;stroke:currentColor;}
body.admin-dashboard .sidebar-bottom{margin-top:auto;padding:0;border-top:0;}
body.admin-dashboard .logout-btn{
    width:100%;min-height:48px;display:flex;align-items:center;gap:12px;padding:11px 13px;
    border:0;border-radius:14px;background:transparent;color:var(--danger);font-size:14px;font-weight:600;text-align:left;
}
body.admin-dashboard .logout-btn:hover{background:var(--danger-bg);border-color:transparent;}

body.admin-dashboard .main{margin-left:var(--sidebar-width);min-height:100vh;}
body.admin-dashboard .topbar{
    min-height:82px;height:auto;padding:16px 34px;position:sticky;top:0;z-index:1200;
    background:rgba(250,248,253,.92);border-bottom:1px solid var(--line);backdrop-filter:blur(16px);
}
body.admin-dashboard .topbar-left{gap:15px;min-width:0;}
body.admin-dashboard .mobile-menu{
    width:43px;height:43px;display:none;place-items:center;border-radius:50%;border:1px solid var(--line);
    background:var(--paper);color:var(--ink);
}
body.admin-dashboard .mobile-menu svg{width:20px;height:20px;}
body.admin-dashboard .page-title small{display:block;margin-bottom:2px;color:var(--muted);font-size:12px;line-height:1.2;}
body.admin-dashboard .page-title strong{display:block;font-family:"Playfair Display",serif;font-size:24px;line-height:1.1;font-weight:600;}
body.admin-dashboard .topbar-actions{gap:8px;}
body.admin-dashboard .circle-btn{
    width:43px;height:43px;flex:0 0 43px;border-radius:50%;border:1px solid var(--line);background:var(--paper);color:var(--ink);
    display:grid;place-items:center;
}
body.admin-dashboard .circle-btn svg{width:19px;height:19px;}
body.admin-dashboard .top-admin{gap:10px;margin-left:7px;padding-left:14px;border-left:1px solid var(--line);}
body.admin-dashboard .top-admin-avatar{width:40px;height:40px;border-radius:50%;background:var(--lavender-600);font-size:12px;}
body.admin-dashboard .top-admin span{color:var(--muted);font-size:13px;}

body.admin-dashboard .content{max-width:none;margin:0;padding:34px;}
body.admin-dashboard .dashboard-section{scroll-margin-top:100px;}
body.admin-dashboard .section-heading h2{font-family:"Playfair Display",serif;font-size:31px;line-height:1.15;}
body.admin-dashboard .eyebrow{color:var(--lavender-600);font-size:12px;font-weight:700;letter-spacing:.08em;}
body.admin-dashboard .section-heading > p{color:var(--muted);font-size:14px;}

/* Admin dark mode uses the exact Patient Dashboard palette. */
html.dark body.admin-dashboard{
    --lavender-50:#17131a;
    --lavender-100:#28202d;
    --lavender-200:#3c2f45;
    --lavender-300:#584366;
    --lavender-400:#816397;
    --lavender-500:#a384ba;
    --lavender-600:#b394ca;
    --lavender-700:#d0b7e2;
    --paper:#211c24;
    --paper-soft:#28222c;
    --ink:#f4eff7;
    --ink-soft:#ddd4e2;
    --muted:#b6aebc;
    --line:#3a323f;
    --success:#9abb9f;
    --success-bg:#243429;
    --warning:#d4ad70;
    --warning-bg:#382d20;
    --danger:#dc9296;
    --danger-bg:#382426;
    background:#17131a;
    color:var(--ink);
}
html.dark body.admin-dashboard .topbar{background:rgba(23,19,26,.92);}

@media(max-width:900px){
    body.admin-dashboard .sidebar{
        left:0;
        width:min(310px,86vw);
        transform:translateX(-105%);
        box-shadow:15px 0 45px rgba(40,27,47,.16);
    }
    body.admin-dashboard .sidebar.open{transform:translateX(0);}
    body.admin-dashboard .main{margin-left:0;}
    body.admin-dashboard .mobile-menu{display:grid;}
    body.admin-dashboard .topbar{min-height:72px;padding:13px 18px;}
    body.admin-dashboard .content{padding:22px 18px;}
}
@media(max-width:640px){
    body.admin-dashboard{font-size:14px;}
    body.admin-dashboard .topbar{padding:12px 14px;}
    body.admin-dashboard .page-title small{font-size:12px;}
    body.admin-dashboard .page-title strong{font-size:22px;}
    body.admin-dashboard .topbar-actions{gap:5px;}
    body.admin-dashboard .circle-btn{width:39px;height:39px;flex-basis:39px;}
    body.admin-dashboard .top-admin{display:none;}
    body.admin-dashboard .content{padding:18px 14px;}
}

/* Final color parity for Admin content accents */
body.admin-dashboard .hero-main{
    background:radial-gradient(circle at 100% 0%,var(--lavender-100),transparent 42%);
}
body.admin-dashboard .hero-main h1 span,
body.admin-dashboard .eyebrow,
body.admin-dashboard .btn-soft,
body.admin-dashboard .kpi-icon,
body.admin-dashboard .nav-item.active,
body.admin-dashboard .nav-item:hover{
    color:var(--lavender-700);
}
body.admin-dashboard .btn-soft,
body.admin-dashboard .kpi-icon{
    background:var(--lavender-100);
    border-color:var(--lavender-200);
}
body.admin-dashboard .btn-primary{
    background:var(--lavender-600);
    border-color:var(--lavender-600);
    color:#fff;
}
body.admin-dashboard .btn-primary:hover{background:var(--lavender-700);}
body.admin-dashboard .hero-image::after{
    background:linear-gradient(90deg,rgba(255,255,255,.04),rgba(80,55,95,.16));
}
html.dark body.admin-dashboard .hero-main{
    background:radial-gradient(circle at 100% 0%,var(--lavender-100),transparent 42%);
}
html.dark body.admin-dashboard .hero-image::after{
    background:linear-gradient(90deg,rgba(20,14,25,.08),rgba(20,14,25,.35));
}

/* =========================================================
   DASHBOARD FINAL PARITY + VERTICAL FILL
   Patient Dashboard is the visual reference for both shells.
========================================================= */

body.patient-dashboard .topbar,
body.admin-dashboard .topbar{
  min-height:94px;
  padding:20px 34px;
}

body.patient-dashboard .page-heading h1,
body.admin-dashboard .page-title strong{
  font-family:"Playfair Display",serif;
  font-size:27px;
  line-height:1.15;
  font-weight:600;
}

body.patient-dashboard .page-heading small,
body.admin-dashboard .page-title small{
  display:block;
  margin-bottom:3px;
  color:var(--muted);
  font-size:13px;
  line-height:1.2;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}

body.patient-dashboard .content,
body.admin-dashboard .content{
  min-height:calc(100vh - 94px);
}

body.patient-dashboard .dashboard-section,
body.admin-dashboard .dashboard-section{
  min-height:calc(100vh - 166px);
}

body.patient-dashboard .sidebar,
body.admin-dashboard .sidebar{
  height:100vh;
}

@media(max-width:900px){
  body.patient-dashboard .topbar,
  body.admin-dashboard .topbar{
    min-height:82px;
    padding:17px 18px;
  }

  body.patient-dashboard .content,
  body.admin-dashboard .content{
    min-height:calc(100vh - 82px);
  }

  body.patient-dashboard .dashboard-section,
  body.admin-dashboard .dashboard-section{
    min-height:calc(100vh - 128px);
  }
}

@media(max-width:640px){
  body.patient-dashboard .topbar,
  body.admin-dashboard .topbar{
    min-height:78px;
    padding:14px 14px;
  }

  body.patient-dashboard .page-heading h1,
  body.admin-dashboard .page-title strong{
    font-size:23px;
  }

  body.patient-dashboard .page-heading small,
  body.admin-dashboard .page-title small{
    font-size:11px;
  }

  body.patient-dashboard .content,
  body.admin-dashboard .content{
    min-height:calc(100vh - 78px);
  }

  body.patient-dashboard .dashboard-section,
  body.admin-dashboard .dashboard-section{
    min-height:calc(100vh - 110px);
  }
}

@media(max-width:390px){
  body.patient-dashboard .topbar,
  body.admin-dashboard .topbar{
    min-height:74px;
    padding:12px 12px;
  }

  body.patient-dashboard .page-heading h1,
  body.admin-dashboard .page-title strong{
    font-size:21px;
  }

  body.patient-dashboard .content,
  body.admin-dashboard .content{
    min-height:calc(100vh - 74px);
  }
}


/* =========================================================
   FINAL DASHBOARD VISUAL PARITY — PATIENT + ADMIN
   Patient Dashboard is the single visual reference.
========================================================= */
body.patient-dashboard,
body.admin-dashboard{
  --dashboard-sidebar-w:268px;
  --dashboard-topbar-h:88px;
}

/* Exact Patient Dashboard palette for both dashboards. */
body.admin-dashboard{
  --lavender-50:#faf8fd;
  --lavender-100:#f2ebf8;
  --lavender-200:#e5d8ef;
  --lavender-300:#d2bee2;
  --lavender-400:#b696ca;
  --lavender-500:#9671b2;
  --lavender-600:#76538f;
  --lavender-700:#5c3d70;
  --paper:#ffffff;
  --paper-soft:#fcfbfd;
  --ink:#29242d;
  --ink-soft:#49414e;
  --muted:#756d7c;
  --line:#e7e1ea;
  --success:#62806b;
  --success-bg:#edf5ef;
  --warning:#9c7643;
  --warning-bg:#faf1e2;
  --danger:#a35d61;
  --danger-bg:#faeeee;
  --sidebar-width:268px;
  --radius-sm:14px;
  --radius-md:20px;
  --radius-lg:28px;
  --transition:.25s ease;
  background:var(--lavender-50);
  color:var(--ink);
}

html.dark body.admin-dashboard{
  --lavender-50:#17131a;
  --lavender-100:#28202d;
  --lavender-200:#3c2f45;
  --lavender-300:#584366;
  --lavender-400:#816397;
  --lavender-500:#a384ba;
  --lavender-600:#b394ca;
  --lavender-700:#d0b7e2;
  --paper:#211c24;
  --paper-soft:#28222c;
  --ink:#f4eff7;
  --ink-soft:#ddd4e2;
  --muted:#b6aebc;
  --line:#3a323f;
  --success:#9abb9f;
  --success-bg:#243429;
  --warning:#d4ad70;
  --warning-bg:#382d20;
  --danger:#dc9296;
  --danger-bg:#382426;
  background:var(--lavender-50);
  color:var(--ink);
}

/* Same fixed sidebar geometry. */
body.patient-dashboard .sidebar,
body.admin-dashboard .sidebar{
  width:var(--dashboard-sidebar-w) !important;
  height:100vh !important;
  top:0 !important;
  bottom:0 !important;
}

/* Larger, identical header on desktop. */
body.patient-dashboard .topbar,
body.admin-dashboard .topbar{
  position:fixed !important;
  top:0 !important;
  left:var(--dashboard-sidebar-w) !important;
  right:0 !important;
  width:auto !important;
  height:var(--dashboard-topbar-h) !important;
  min-height:var(--dashboard-topbar-h) !important;
  padding:0 30px !important;
  display:flex !important;
  align-items:center !important;
  box-sizing:border-box !important;
  z-index:5000 !important;
}

html.rtl body.patient-dashboard .topbar,
html.rtl body.admin-dashboard .topbar,
body.patient-dashboard.rtl .topbar,
body.admin-dashboard.rtl .topbar{
  left:0 !important;
  right:var(--dashboard-sidebar-w) !important;
}

/* Identical sidebar brand scale/alignment. */
body.patient-dashboard .sidebar-brand,
body.admin-dashboard .sidebar-brand{
  height:88px !important;
  min-height:88px !important;
  flex:0 0 88px !important;
  padding:0 9px !important;
  margin:0 0 18px !important;
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
  box-sizing:border-box !important;
}
body.patient-dashboard .brand-mark,
body.admin-dashboard .brand-mark{
  width:45px !important;
  height:45px !important;
  min-width:45px !important;
  flex:0 0 45px !important;
  border-radius:50% !important;
  display:grid !important;
  place-items:center !important;
  background:var(--lavender-100) !important;
  color:var(--lavender-700) !important;
  border:1px solid var(--lavender-200) !important;
}
body.patient-dashboard .brand-mark svg,
body.admin-dashboard .brand-mark svg{
  width:27px !important;
  height:27px !important;
}
body.patient-dashboard .brand-text strong,
body.admin-dashboard .brand-text strong{
  font-family:"Playfair Display",serif !important;
  font-size:23px !important;
  line-height:1 !important;
  font-weight:600 !important;
  letter-spacing:.04em !important;
}
body.patient-dashboard .brand-text span,
body.admin-dashboard .brand-text span{
  margin-top:6px !important;
  color:var(--muted) !important;
  font-size:13px !important;
  line-height:1.2 !important;
  font-weight:600 !important;
  letter-spacing:.08em !important;
}

/* Identical sidebar navigation typography and spacing. */
body.patient-dashboard .sidebar-nav,
body.admin-dashboard .sidebar-nav{
  padding:0 !important;
  gap:5px !important;
}
body.patient-dashboard .nav-label,
body.admin-dashboard .nav-label{
  padding:0 11px !important;
  margin-bottom:10px !important;
  color:var(--muted) !important;
  font-size:13px !important;
  font-weight:700 !important;
  letter-spacing:.1em !important;
}
body.patient-dashboard .nav-item,
body.admin-dashboard .nav-item{
  min-height:49px !important;
  padding:11px 13px !important;
  margin:0 !important;
  gap:12px !important;
  border-radius:14px !important;
  font-size:14px !important;
  font-weight:600 !important;
}
body.patient-dashboard .nav-item.active,
body.admin-dashboard .nav-item.active{
  color:var(--lavender-700) !important;
  background:var(--lavender-100) !important;
  box-shadow:inset 3px 0 0 var(--lavender-600) !important;
  font-weight:600 !important;
}
body.patient-dashboard .nav-item:hover,
body.admin-dashboard .nav-item:hover{
  color:var(--lavender-700) !important;
  background:var(--lavender-50) !important;
}

/* Identical page title typography. */
body.patient-dashboard .page-heading h1,
body.admin-dashboard .page-title strong{
  font-family:"Playfair Display",serif !important;
  font-size:27px !important;
  line-height:1.15 !important;
  font-weight:600 !important;
}
body.patient-dashboard .page-heading small,
body.admin-dashboard .page-title small{
  color:var(--muted) !important;
  font-size:13px !important;
  line-height:1.2 !important;
  font-weight:700 !important;
  letter-spacing:.08em !important;
}

/* Content fills the available viewport instead of stopping early. */
body.patient-dashboard .main-area,
body.admin-dashboard .main{
  margin-left:var(--dashboard-sidebar-w) !important;
  min-height:100vh !important;
  padding-top:var(--dashboard-topbar-h) !important;
  box-sizing:border-box !important;
}
body.patient-dashboard .content,
body.admin-dashboard .content{
  width:min(1480px,100%) !important;
  max-width:none !important;
  min-height:calc(100vh - var(--dashboard-topbar-h)) !important;
  margin:0 auto !important;
  padding:32px !important;
  box-sizing:border-box !important;
}
body.patient-dashboard .dashboard-section,
body.admin-dashboard .dashboard-section{
  min-height:calc(100vh - var(--dashboard-topbar-h) - 64px) !important;
  margin-bottom:28px !important;
  scroll-margin-top:calc(var(--dashboard-topbar-h) + 18px) !important;
}

/* The final dashboard section must end with its real content, not a forced viewport-height blank area. */
body.admin-dashboard #quick-actions,
body.patient-dashboard #profile{
  min-height:0 !important;
  height:auto !important;
  margin-bottom:0 !important;
}

body.admin-dashboard #quick-actions .quick-actions,
body.patient-dashboard #profile{
  margin-bottom:0 !important;
}

/* Match dashboard control sizes. */
body.patient-dashboard .round-control,
body.admin-dashboard .circle-btn{
  width:43px !important;
  height:43px !important;
  min-width:43px !important;
  min-height:43px !important;
  flex:0 0 43px !important;
  border-radius:50% !important;
}

@media(max-width:900px){
  body.patient-dashboard,
  body.admin-dashboard{
    --dashboard-sidebar-w:0px;
    --dashboard-topbar-h:78px;
  }
  body.patient-dashboard .topbar,
  body.admin-dashboard .topbar{
    left:0 !important;
    right:0 !important;
    width:100% !important;
    height:78px !important;
    min-height:78px !important;
    padding:0 20px !important;
  }
  html.rtl body.patient-dashboard .topbar,
  html.rtl body.admin-dashboard .topbar,
  body.patient-dashboard.rtl .topbar,
  body.admin-dashboard.rtl .topbar{
    left:0 !important;
    right:0 !important;
  }
  body.patient-dashboard .sidebar,
  body.admin-dashboard .sidebar{
    width:min(310px,86vw) !important;
  }
  body.patient-dashboard .main-area,
  body.admin-dashboard .main{
    margin-left:0 !important;
    padding-top:78px !important;
  }
  body.patient-dashboard .content,
  body.admin-dashboard .content{
    min-height:calc(100vh - 78px) !important;
    padding:28px 20px !important;
  }
  body.patient-dashboard .dashboard-section,
  body.admin-dashboard .dashboard-section{
    min-height:calc(100vh - 78px - 56px) !important;
  }
  body.patient-dashboard .sidebar-brand,
  body.admin-dashboard .sidebar-brand{
    height:78px !important;
    min-height:78px !important;
    flex-basis:78px !important;
  }
}

@media(max-width:640px){
  body.patient-dashboard,
  body.admin-dashboard{
    --dashboard-topbar-h:72px;
  }
  body.patient-dashboard .topbar,
  body.admin-dashboard .topbar{
    height:72px !important;
    min-height:72px !important;
    padding:0 14px !important;
  }
  body.patient-dashboard .main-area,
  body.admin-dashboard .main{
    padding-top:72px !important;
  }
  body.patient-dashboard .content,
  body.admin-dashboard .content{
    min-height:calc(100vh - 72px) !important;
    padding:22px 14px !important;
  }
  body.patient-dashboard .dashboard-section,
  body.admin-dashboard .dashboard-section{
    min-height:calc(100vh - 72px - 44px) !important;
  }
  body.patient-dashboard .page-heading h1,
  body.admin-dashboard .page-title strong{
    font-size:21px !important;
  }
  body.patient-dashboard .page-heading small,
  body.admin-dashboard .page-title small{
    font-size:11px !important;
  }
  body.patient-dashboard .round-control,
  body.admin-dashboard .circle-btn{
    width:40px !important;
    height:40px !important;
    min-width:40px !important;
    min-height:40px !important;
    flex-basis:40px !important;
  }
  body.patient-dashboard .sidebar-brand,
  body.admin-dashboard .sidebar-brand{
    height:72px !important;
    min-height:72px !important;
    flex-basis:72px !important;
  }
}


/* =========================================================
   DASHBOARD BRAND + THEME CONTROLS — EXACT ABOUT PAGE IDENTITY
   Patient + Admin use the same ORVI logo, name and control visuals
   as the finalized About page at every breakpoint.
========================================================= */
body.patient-dashboard .sidebar-brand.dashboard-brand,
body.admin-dashboard .sidebar-brand.dashboard-brand{
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
    width:100% !important;
    min-height:76px !important;
    height:76px !important;
    padding:0 10px !important;
    margin:0 0 14px !important;
    border-bottom:1px solid var(--line) !important;
    box-sizing:border-box !important;
    flex:0 0 76px !important;
}

body.patient-dashboard .dashboard-about-brand,
body.admin-dashboard .dashboard-about-brand{
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
    min-width:0 !important;
    width:100% !important;
    color:inherit !important;
    text-decoration:none !important;
}

body.patient-dashboard .dashboard-about-brand .brand-mark,
body.admin-dashboard .dashboard-about-brand .brand-mark{
    width:46px !important;
    height:46px !important;
    min-width:46px !important;
    flex:0 0 46px !important;
    border-radius:15px !important;
    display:grid !important;
    place-items:center !important;
    background:linear-gradient(145deg,var(--violet),var(--violet-dark)) !important;
    color:#fff !important;
    box-shadow:0 10px 25px rgba(102,81,168,.25) !important;
}

body.patient-dashboard .dashboard-about-brand .brand-tooth,
body.admin-dashboard .dashboard-about-brand .brand-tooth{
    width:27px !important;
    height:30px !important;
    fill:none !important;
    stroke:currentColor !important;
    stroke-width:2.2 !important;
}

body.patient-dashboard .dashboard-about-brand .brand-text,
body.admin-dashboard .dashboard-about-brand .brand-text{
    display:flex !important;
    flex-direction:column !important;
    min-width:0 !important;
}

body.patient-dashboard .dashboard-about-brand .brand-name,
body.admin-dashboard .dashboard-about-brand .brand-name{
    font-family:var(--serif) !important;
    font-size:27px !important;
    line-height:1 !important;
    font-weight:700 !important;
    letter-spacing:.03em !important;
}

body.patient-dashboard .dashboard-about-brand .brand-sub,
body.admin-dashboard .dashboard-about-brand .brand-sub{
    margin-top:4px !important;
    font-family:var(--sans) !important;
    font-size:9px !important;
    line-height:1 !important;
    font-weight:700 !important;
    letter-spacing:.11em !important;
    text-transform:uppercase !important;
    color:var(--muted) !important;
    white-space:nowrap !important;
}

body.patient-dashboard .about-style-control,
body.admin-dashboard .about-style-control{
    display:grid !important;
    place-items:center !important;
    width:40px !important;
    height:40px !important;
    min-width:40px !important;
    flex:0 0 40px !important;
    padding:0 !important;
    border:1px solid var(--line) !important;
    border-radius:50% !important;
    background:var(--paper) !important;
    color:var(--ink) !important;
    box-shadow:none !important;
    font-size:17px !important;
    line-height:1 !important;
}

body.patient-dashboard .about-style-control span,
body.admin-dashboard .about-style-control span{
    display:grid !important;
    place-items:center !important;
    width:100% !important;
    height:100% !important;
    font-family:var(--sans) !important;
    font-size:17px !important;
    line-height:1 !important;
}

html.dark body.patient-dashboard .about-style-control,
html.dark body.admin-dashboard .about-style-control,
body.dark body.patient-dashboard .about-style-control,
body.dark body.admin-dashboard .about-style-control{
    background:var(--paper) !important;
    color:var(--ink) !important;
    border-color:var(--line) !important;
}

@media(max-width:900px){
    body.patient-dashboard .sidebar-brand.dashboard-brand,
    body.admin-dashboard .sidebar-brand.dashboard-brand{
        min-height:72px !important;
        height:72px !important;
        flex-basis:72px !important;
    }
    body.patient-dashboard .dashboard-about-brand .brand-mark,
    body.admin-dashboard .dashboard-about-brand .brand-mark{
        width:42px !important;
        height:42px !important;
        min-width:42px !important;
        flex-basis:42px !important;
    }
    body.patient-dashboard .dashboard-about-brand .brand-tooth,
    body.admin-dashboard .dashboard-about-brand .brand-tooth{
        width:24px !important;
        height:27px !important;
    }
    body.patient-dashboard .dashboard-about-brand .brand-name,
    body.admin-dashboard .dashboard-about-brand .brand-name{
        font-size:24px !important;
    }
    body.patient-dashboard .dashboard-about-brand .brand-sub,
    body.admin-dashboard .dashboard-about-brand .brand-sub{
        font-size:8px !important;
    }
}

@media(max-width:560px){
    body.patient-dashboard .sidebar-brand.dashboard-brand,
    body.admin-dashboard .sidebar-brand.dashboard-brand{
        min-height:68px !important;
        height:68px !important;
        flex-basis:68px !important;
        padding-inline:8px !important;
    }
    body.patient-dashboard .dashboard-about-brand .brand-mark,
    body.admin-dashboard .dashboard-about-brand .brand-mark{
        width:40px !important;
        height:40px !important;
        min-width:40px !important;
        flex-basis:40px !important;
        border-radius:13px !important;
    }
    body.patient-dashboard .dashboard-about-brand .brand-name,
    body.admin-dashboard .dashboard-about-brand .brand-name{
        font-size:21px !important;
    }
    body.patient-dashboard .dashboard-about-brand .brand-sub,
    body.admin-dashboard .dashboard-about-brand .brand-sub{
        font-size:7px !important;
        letter-spacing:.09em !important;
    }
    body.patient-dashboard .about-style-control,
    body.admin-dashboard .about-style-control{
        width:38px !important;
        height:38px !important;
        min-width:38px !important;
        flex-basis:38px !important;
    }
}


/* FINAL SECTION HEIGHT RESET — desktop/tablet/mobile */
body.admin-dashboard #quick-actions,
body.patient-dashboard #profile{
  min-height:0 !important;
  height:auto !important;
  margin-bottom:0 !important;
}

@media(max-width:900px){
  body.admin-dashboard #quick-actions,
  body.patient-dashboard #profile{
    min-height:0 !important;
    height:auto !important;
    margin-bottom:0 !important;
  }
}

@media(max-width:640px){
  body.admin-dashboard #quick-actions,
  body.patient-dashboard #profile{
    min-height:0 !important;
    height:auto !important;
    margin-bottom:0 !important;
  }
}

/* =========================================================
   TREATMENTS PAGE — PAGE-SCOPED CONTENT STYLES
   Uses the About page global chrome/typography.
   ========================================================= */
body.treatments-page{
    --lav:#f7f4ff;
    --shadow2:0 10px 30px rgba(58,44,92,.09);
    --line:rgba(91,72,139,.15);
}
body.treatments-page .braces-process-editorial{padding:82px 0 86px;background:var(--paper);overflow:hidden;}
body.treatments-page .editorial-process-head{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(280px,.65fr);gap:70px;align-items:end;margin-bottom:52px;}
body.treatments-page .editorial-process-head .kicker{color:var(--violet);}
body.treatments-page .editorial-process-head h2{font-family:var(--serif);font-size:clamp(38px,4.6vw,62px);line-height:1.05;letter-spacing:-1.5px;margin:10px 0 0;color:var(--ink);}
body.treatments-page .editorial-process-head h2 span{color:var(--violet);}
body.treatments-page .editorial-process-head>p{max-width:470px;margin:0 0 3px;font-size:15px;line-height:1.8;color:var(--muted);}
body.treatments-page .braces-road{position:relative;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));padding:10px 0 0;}
body.treatments-page .road-line{position:absolute;left:5%;right:5%;top:31px;height:1px;background:linear-gradient(90deg,rgba(102,81,168,.12),var(--violet),rgba(102,81,168,.12));}
body.treatments-page .road-step{position:relative;min-width:0;text-align:center;padding:0 12px;}
body.treatments-page .road-marker{position:relative;z-index:2;margin:0 auto 25px;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--paper);border:1.5px solid rgba(102,81,168,.38);color:var(--violet);font-size:13px;font-weight:900;letter-spacing:.04em;box-shadow:0 0 0 7px var(--paper);transition:.3s ease;}
body.treatments-page .road-step.active .road-marker,
body.treatments-page .road-step:hover .road-marker{background:var(--violet);border-color:var(--violet);color:#fff;transform:scale(1.08);box-shadow:0 0 0 7px var(--paper),0 9px 25px rgba(102,81,168,.2);}
body.treatments-page .road-copy small{display:block;font-size:13px;letter-spacing:1.35px;font-weight:900;color:var(--violet);margin-bottom:8px;}
body.treatments-page .road-copy h3{font-family:var(--serif);font-size:20px;line-height:1.15;margin:0 0 8px;color:var(--ink);}
body.treatments-page .road-copy p{font-size:13px;line-height:1.6;color:var(--muted);margin:0 auto;max-width:170px;}
body.treatments-page .road-step:not(:last-child):after{content:"›";position:absolute;right:-5px;top:18px;color:rgba(102,81,168,.42);font-size:18px;z-index:3;}
body.treatments-page .editorial-process-note{margin-top:48px;border-top:1px solid var(--border);border-bottom:1px solid var(--border);display:grid;grid-template-columns:repeat(3,1fr);}
body.treatments-page .editorial-process-note>div{padding:19px 25px;min-height:76px;display:flex;flex-direction:column;justify-content:center;}
body.treatments-page .editorial-process-note>div+div{border-left:1px solid var(--border);}
body.treatments-page .editorial-process-note b{font-size:13px;color:var(--ink);margin-bottom:4px;}
body.treatments-page .editorial-process-note span{font-size:13px;line-height:1.55;color:var(--muted);}
@media (max-width:1000px){
body.treatments-page .editorial-process-head{grid-template-columns:1fr;gap:14px;margin-bottom:40px;}
body.treatments-page .editorial-process-head>p{max-width:680px;}
body.treatments-page .braces-road{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:42px;}
body.treatments-page .road-line{display:none;}
body.treatments-page .road-step:not(:last-child):after{display:none;}
body.treatments-page .road-marker{margin-bottom:18px;}
}
@media (max-width:650px){
body.treatments-page .braces-process-editorial{padding:64px 0 68px;}
body.treatments-page .editorial-process-head h2{font-size:38px;letter-spacing:-.8px;}
body.treatments-page .editorial-process-head>p{font-size:14px;line-height:1.7;}
body.treatments-page .braces-road{grid-template-columns:1fr 1fr;gap:34px 8px;}
body.treatments-page .road-step{padding:0 8px;}
body.treatments-page .road-marker{width:40px;height:40px;margin-bottom:15px;}
body.treatments-page .road-copy h3{font-size:18px;}
body.treatments-page .road-copy p{font-size:13px;max-width:145px;}
body.treatments-page .editorial-process-note{grid-template-columns:1fr;margin-top:36px;}
body.treatments-page .editorial-process-note>div{padding:14px 17px;min-height:auto;}
body.treatments-page .editorial-process-note>div+div{border-left:0;border-top:1px solid var(--border);}
}
body.treatments-page .editorial-process-note{background:var(--white)!important;border:1px solid var(--line)!important;box-shadow:var(--shadow2);}
body.treatments-page .editorial-process-note .process-note-item{background:var(--white);border-right:1px solid var(--line);}
body.treatments-page .editorial-process-note .process-note-item:last-child{border-right:0;}
body.treatments-page .editorial-process-note .process-note-item b{color:var(--ink)!important;font-size:13px!important;}
body.treatments-page .editorial-process-note .process-note-item div>span{color:var(--muted)!important;font-size:13px!important;line-height:1.6!important;}
body.treatments-page .editorial-process-note .process-note-item.time{background:linear-gradient(135deg,var(--white),#fbf9ff);}
body.treatments-page .editorial-process-note .process-note-item.adjust{background:linear-gradient(135deg,#fbf9ff,var(--lav));}
body.treatments-page .editorial-process-note .process-note-item.role{background:linear-gradient(135deg,var(--lav),var(--white));}
body.treatments-page .editorial-process-note .process-note-item .note-icon{color:var(--violet-dark)!important;}
@media (max-width:1050px){
body.treatments-page .editorial-process-note .process-note-item{border-right:0;border-bottom:1px solid var(--line);}
body.treatments-page .editorial-process-note .process-note-item:last-child{border-bottom:0;}
}
@media (max-width:700px){
body.treatments-page .editorial-process-note .process-note-item{padding:15px 16px;min-height:78px;}
}
body.treatments-page .hero{padding:62px 0 76px;background:radial-gradient(circle at 84% 8%,rgba(102,81,168,.18),transparent 29%),linear-gradient(135deg,var(--lav),var(--paper) 68%)}
body.treatments-page .hero-grid{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(450px,.98fr);gap:58px;align-items:center}
body.treatments-page .hero h1{font-size:clamp(48px,6vw,76px);margin:12px 0 22px}
body.treatments-page .hero h1 span{color:var(--violet)}
body.treatments-page .hero-copy{max-width:650px}
body.treatments-page .hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:27px}
body.treatments-page .hero-note{display:flex;align-items:center;gap:10px;margin-top:23px;color:var(--muted);font-size:13px}
body.treatments-page .tick{width:27px;height:27px;border-radius:50%;display:grid;place-items:center;background:var(--violet-soft);color:var(--violet);font-weight:900}
body.treatments-page .hero-visual{position:relative;height:500px}
body.treatments-page .hero-photo{position:absolute;inset:0 10% 7% 0;border-radius:34px;overflow:hidden;box-shadow:var(--shadow)}
body.treatments-page .hero-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(39,34,56,.34))}
body.treatments-page .hero-small{position:absolute;right:0;bottom:0;width:42%;height:43%;border:9px solid var(--paper);border-radius:24px;overflow:hidden;box-shadow:var(--shadow2)}
body.treatments-page .hero-tag{position:absolute;left:25px;bottom:30px;z-index:2;background:rgba(255,255,255,.9);backdrop-filter:blur(10px);border-radius:15px;padding:12px 15px;box-shadow:var(--shadow2)}
body.treatments-page .hero-tag b{display:block;font-size:13px}
body.treatments-page .hero-tag span{font-size:13px;color:var(--muted)}
body.treatments-page .start{padding:88px 0}
body.treatments-page .section-head{max-width:700px;margin-bottom:38px}
body.treatments-page .section-head h2{margin:9px 0 13px}
body.treatments-page .section-head h2 span{color:var(--violet)}
body.treatments-page .section-head .lead{max-width:620px}
body.treatments-page .choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
body.treatments-page .choice{position:relative;min-height:350px;border-radius:28px;overflow:hidden;background:var(--ink);color:#fff;box-shadow:var(--shadow);isolation:isolate}
body.treatments-page .choice img{position:absolute;inset:0;opacity:.72;transition:.5s}
body.treatments-page .choice:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 20%,rgba(19,15,30,.9) 100%);z-index:1}
body.treatments-page .choice:hover img{transform:scale(1.05)}
body.treatments-page .choice-content{position:absolute;z-index:2;left:28px;right:28px;bottom:27px}
body.treatments-page .choice-tag{font-size:13px;letter-spacing:.16em;font-weight:800;color:#e9dcff}
body.treatments-page .choice h3{font-size:37px;margin:7px 0}
body.treatments-page .choice p{font-size:14px;color:#eee8f7;max-width:500px}
body.treatments-page .choice-link{display:inline-block;margin-top:13px;font-size:13px;font-weight:800;color:#fff}
body.treatments-page .movement{padding:0 0 92px}
body.treatments-page .movement-box{background:var(--ink);color:#fff;border-radius:30px;padding:46px;display:grid;grid-template-columns:.9fr 1.1fr;gap:50px;align-items:center;overflow:hidden;position:relative}
body.treatments-page .movement-box:before{content:"";position:absolute;width:420px;height:420px;border-radius:50%;background:rgba(102,81,168,.45);right:-150px;top:-190px;filter:blur(5px)}
body.treatments-page .movement-copy{position:relative;z-index:1}
body.treatments-page .movement-copy h2{margin:9px 0 16px}
body.treatments-page .movement-copy h2 span{color:#cfc1ff}
body.treatments-page .movement-copy p{color:#d8d2e5}
body.treatments-page .movement-steps{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
body.treatments-page .move-step{padding:21px;border:1px solid rgba(255,255,255,.14);border-radius:20px;background:rgba(255,255,255,.06)}
body.treatments-page .move-step .num{width:35px;height:35px;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--violet);font-weight:900;margin-bottom:28px}
body.treatments-page .move-step b{display:block;font-size:16px;margin-bottom:5px}
body.treatments-page .move-step span{font-size:13px;color:#c8c0d8}
body.treatments-page .chapter{padding:95px 0;position:relative}
body.treatments-page .chapter.braces{background:var(--lav)}
body.treatments-page .chapter.aligners{background:var(--paper)}
body.treatments-page .chapter-top{display:grid;grid-template-columns:.72fr 1.28fr;gap:50px;align-items:end;margin-bottom:48px}
body.treatments-page .chapter-number{font-size:86px;line-height:.8;font-family:var(--serif);color:var(--violet-soft);font-weight:700}
body.treatments-page .chapter-top h2{margin-top:12px}
body.treatments-page .chapter-top h2 span{color:var(--violet)}
body.treatments-page .chapter-top>p{font-size:16px;color:var(--soft);max-width:600px;justify-self:end}
body.treatments-page .feature{display:grid;grid-template-columns:1fr 1fr;min-height:500px;border-radius:30px;overflow:hidden;box-shadow:var(--shadow);background:var(--white);border:1px solid var(--line)}
body.treatments-page .feature-image{position:relative;min-height:500px}
body.treatments-page .feature-image img{position:absolute;inset:0}
body.treatments-page .feature-label{position:absolute;left:22px;bottom:22px;background:rgba(255,255,255,.92);color:var(--ink);padding:10px 14px;border-radius:12px;font-size:13px;font-weight:800;box-shadow:var(--shadow2)}
body.treatments-page .feature-copy{padding:48px 48px;display:flex;flex-direction:column;justify-content:center}
body.treatments-page .feature-copy .kicker{margin-bottom:10px}
body.treatments-page .feature-copy h3{font-size:40px;margin-bottom:15px}
body.treatments-page .feature-copy>p{font-size:15px;color:var(--soft);max-width:520px}
body.treatments-page .facts{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:25px}
body.treatments-page .fact{padding:15px 16px;border:1px solid var(--line);border-radius:15px;background:var(--lav)}
body.treatments-page .fact b{display:block;font-size:13px;margin-bottom:3px}
body.treatments-page .fact span{font-size:13px;color:var(--muted)}
body.treatments-page .chapter.aligners .feature{grid-template-columns:1fr 1fr}
body.treatments-page .chapter.aligners .feature-image{order:2}
body.treatments-page .chapter.aligners .feature-copy{order:1}
body.treatments-page .type-section{padding-top:42px}
body.treatments-page .type-heading{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:22px}
body.treatments-page .type-heading h3{font-size:32px}
body.treatments-page .type-heading p{max-width:480px;color:var(--muted);font-size:13px}
body.treatments-page .type-list{display:grid;grid-template-columns:1fr 1fr;gap:18px}
body.treatments-page .type-card{display:grid;grid-template-columns:160px 1fr;min-height:180px;background:var(--white);border:1px solid var(--line);border-radius:22px;overflow:hidden;box-shadow:var(--shadow2)}
body.treatments-page .type-card img{height:100%;min-height:180px}
body.treatments-page .type-content{padding:23px}
body.treatments-page .type-content small{color:var(--violet);font-weight:800;letter-spacing:.12em;font-size:13px}
body.treatments-page .type-content h4{font-size:25px;margin:7px 0 8px}
body.treatments-page .type-content p{font-size:13px;color:var(--soft)}
body.treatments-page .type-points{display:flex;flex-wrap:wrap;gap:6px;margin-top:13px}
body.treatments-page .type-points span{padding:5px 8px;background:var(--violet-soft);color:var(--violet-dark);font-size:13px;font-weight:800;border-radius:999px}
@media (max-width:1050px){
body.treatments-page .editorial-process-note{grid-template-columns:1fr}
body.treatments-page .process-note-item{border-right:0;border-bottom:1px solid rgba(255,255,255,.12)}
body.treatments-page .process-note-item:last-child{border-bottom:0}
body.treatments-page .living-braces-head{grid-template-columns:1fr;gap:12px}
body.treatments-page .living-braces-head>p{justify-self:start}
body.treatments-page .living-braces-layout{grid-template-columns:1fr;gap:28px}
body.treatments-page .living-visual{min-height:330px}
body.treatments-page .living-visual-art{inset:75px 25px 90px}
}
body.treatments-page .aligner-journey{padding:94px 0}
body.treatments-page .journey-head{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:38px}
body.treatments-page .journey-head h2{margin-top:9px}
body.treatments-page .journey-head h2 span{color:var(--violet)}
body.treatments-page .journey-head p{max-width:470px;color:var(--soft)}
body.treatments-page .journey-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--line);border-radius:28px;overflow:hidden;background:var(--white)}
body.treatments-page .journey-card{padding:27px 22px;border-right:1px solid var(--line);position:relative}
body.treatments-page .journey-card:last-child{border-right:0}
body.treatments-page .journey-card:after{content:"→";position:absolute;right:-12px;top:26px;width:25px;height:25px;border-radius:50%;background:var(--violet);color:#fff;display:grid;place-items:center;font-size:13px;z-index:2}
body.treatments-page .journey-card:last-child:after{display:none}
body.treatments-page .journey-num{font:700 38px var(--serif);color:var(--violet-soft)}
body.treatments-page .journey-card h3{font-size:22px;margin:6px 0}
body.treatments-page .journey-card p{font-size:13px;color:var(--soft)}
body.treatments-page .journey-img{height:110px;margin-top:18px;border-radius:15px;overflow:hidden}
body.treatments-page .daily{padding:0 0 94px}
body.treatments-page .daily-box{display:grid;grid-template-columns:.95fr 1.05fr;min-height:500px;border-radius:30px;overflow:hidden;background:var(--ink);color:#fff}
body.treatments-page .daily-image{min-height:500px;position:relative}
body.treatments-page .daily-image:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent,rgba(18,15,29,.55))}
body.treatments-page .daily-caption{position:absolute;left:25px;bottom:25px;z-index:2}
body.treatments-page .daily-caption b{display:block;font-size:15px}
body.treatments-page .daily-caption span{font-size:13px;color:#ddd5e8}
body.treatments-page .daily-content{padding:52px 52px}
body.treatments-page .daily-content h2{margin:9px 0 17px}
body.treatments-page .daily-content h2 span{color:#cfc1ff}
body.treatments-page .routine{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:28px}
body.treatments-page .routine-item{border:1px solid rgba(255,255,255,.13);border-radius:17px;padding:16px;background:rgba(255,255,255,.05)}
body.treatments-page .routine-item b{display:block;font-size:14px}
body.treatments-page .routine-item span{display:block;color:#c8c0d8;font-size:13px;margin-top:4px}
body.treatments-page .editorial-process-note{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:34px;border:1px solid rgba(255,255,255,.14);border-radius:20px;overflow:hidden;background:rgba(255,255,255,.055)}
body.treatments-page .process-note-item{display:flex;align-items:flex-start;gap:13px;padding:18px 20px;min-height:92px;border-right:1px solid rgba(255,255,255,.12);transition:.3s ease}
body.treatments-page .process-note-item:last-child{border-right:0}
body.treatments-page .process-note-item:hover{background:rgba(255,255,255,.08)}
body.treatments-page .process-note-item .note-icon{width:34px;height:34px;flex:0 0 34px;border-radius:11px;display:grid;place-items:center;background:#fff;color:var(--violet-dark);font-size:14px;font-weight:900;box-shadow:0 8px 20px rgba(0,0,0,.16)}
body.treatments-page .process-note-item b{display:block;color:#fff;font-size:13px;margin:1px 0 3px}
body.treatments-page .process-note-item div>span{display:block;color:#cfc8dc;font-size:13px;line-height:1.55}
body.treatments-page .process-note-item.time .note-icon{background:#efe8ff}
body.treatments-page .process-note-item.adjust .note-icon{background:#ddd2ff}
body.treatments-page .process-note-item.role .note-icon{background:#f7f1ff}
body.treatments-page .adjust{padding:92px 0;background:var(--paper);position:relative;overflow:hidden}
body.treatments-page .adjust:before{content:"";position:absolute;width:430px;height:430px;border-radius:50%;background:rgba(102,81,168,.08);left:-250px;top:40px}
body.treatments-page .adjust .container{position:relative;z-index:1}
body.treatments-page .living-braces-head{display:grid;grid-template-columns:minmax(0,.95fr) minmax(280px,.55fr);gap:55px;align-items:end;margin-bottom:42px}
body.treatments-page .living-braces-head h2{margin:9px 0 0;max-width:690px}
body.treatments-page .living-braces-head h2 span{color:var(--violet)}
body.treatments-page .living-braces-head>p{font-size:15px;line-height:1.75;color:var(--soft);max-width:390px;justify-self:end}
body.treatments-page .living-braces-layout{display:grid;grid-template-columns:.7fr 1.3fr;gap:48px;align-items:stretch}
body.treatments-page .living-visual{min-height:430px;border-radius:28px;background:linear-gradient(145deg,#4d3b86,#6651a8 55%,#8170bc);color:#fff;padding:25px;position:relative;overflow:hidden;box-shadow:0 24px 55px rgba(58,44,92,.18)}
body.treatments-page .living-visual:before{content:"";position:absolute;width:300px;height:300px;border-radius:50%;border:1px solid rgba(255,255,255,.13);right:-130px;top:-110px}
body.treatments-page .living-visual-top,
body.treatments-page .living-visual-bottom{position:relative;z-index:2;display:flex;justify-content:space-between;gap:15px}
body.treatments-page .living-visual-top{font-size:13px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:#e6ddff}
body.treatments-page .living-visual-bottom{position:absolute;left:25px;right:25px;bottom:25px;display:block}
body.treatments-page .living-visual-bottom strong{display:block;font:600 24px/1.15 var(--serif);margin-bottom:5px}
body.treatments-page .living-visual-bottom span{font-size:13px;color:#ded6ed}
body.treatments-page .living-visual-art{position:absolute;inset:95px 25px 105px;display:flex;align-items:center;justify-content:center}
body.treatments-page .tooth-row{display:flex;gap:3px;align-items:flex-end;position:relative;z-index:2;transform:rotate(-2deg)}
body.treatments-page .tooth-row i{display:block;width:37px;height:49px;border-radius:10px 10px 15px 15px;background:linear-gradient(180deg,#fff,#ebe5f8);box-shadow:inset 0 -5px 0 rgba(102,81,168,.08),0 10px 18px rgba(26,18,48,.18);position:relative}
body.treatments-page .tooth-row i:nth-child(2),
body.treatments-page .tooth-row i:nth-child(6){height:56px}
body.treatments-page .tooth-row i:nth-child(3),
body.treatments-page .tooth-row i:nth-child(5){height:61px}
body.treatments-page .tooth-row i:nth-child(4){height:64px}
body.treatments-page .brace-wire{position:absolute;z-index:3;width:260px;height:4px;background:#bca9ed;border-radius:99px;box-shadow:0 0 0 2px rgba(255,255,255,.15);top:52%;transform:translateY(-50%) rotate(-2deg)}
body.treatments-page .brace-wire:after{content:"";position:absolute;left:0;right:0;top:-5px;height:14px;background:radial-gradient(circle,#fff 0 3px,transparent 4px) 0 0/43px 14px repeat-x;opacity:.9}
body.treatments-page .living-glow{position:absolute;width:220px;height:120px;background:rgba(255,255,255,.16);filter:blur(40px);border-radius:50%;top:35%;left:50%;transform:translate(-50%,-50%)}
body.treatments-page .living-content{border-top:1px solid var(--line)}
body.treatments-page .living-point{display:grid;grid-template-columns:70px 1fr;gap:22px;padding:28px 0;border-bottom:1px solid var(--line)}
body.treatments-page .living-point-number{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line);background:var(--lav);color:var(--violet);font-weight:900;font-size:13px}
body.treatments-page .living-point-body .kicker{font-size:13px}
body.treatments-page .living-point-body h3{font-size:30px;margin:5px 0 8px}
body.treatments-page .living-point-body p{font-size:14px;line-height:1.75;color:var(--soft);max-width:670px}
body.treatments-page .living-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:15px}
body.treatments-page .living-actions span{font-size:13px;font-weight:800;color:var(--violet-dark);padding:7px 10px;border-bottom:1px solid rgba(102,81,168,.25);background:transparent}
body.treatments-page .living-actions span:before{content:"✓";margin-right:6px;color:var(--violet)}
body.treatments-page .duration{padding:88px 0;background:var(--lav)}
body.treatments-page .duration-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:55px;align-items:center}
body.treatments-page .duration-grid h2{margin:9px 0 16px}
body.treatments-page .duration-grid h2 span{color:var(--violet)}
body.treatments-page .duration-grid>div>p{color:var(--soft);font-size:15px}
body.treatments-page .duration-note{margin-top:20px;padding:15px 17px;background:var(--white);border:1px solid var(--line);border-radius:15px;font-size:13px;color:var(--muted)}
body.treatments-page .duration-side{display:grid;grid-template-columns:1fr 1fr;gap:12px}
body.treatments-page .duration-stat{background:var(--white);border:1px solid var(--line);border-radius:20px;padding:23px;min-height:150px}
body.treatments-page .duration-stat strong{font:700 38px var(--serif);color:var(--violet);display:block}
body.treatments-page .duration-stat b{font-size:14px;display:block;margin:5px 0}
body.treatments-page .duration-stat span{font-size:13px;color:var(--muted)}
body.treatments-page .compare{padding:94px 0}
body.treatments-page .compare-head{text-align:center;max-width:720px;margin:0 auto 38px}
body.treatments-page .compare-head h2{margin:9px 0 13px}
body.treatments-page .compare-head h2 span{color:var(--violet)}
body.treatments-page .compare-board{display:grid;grid-template-columns:1fr 1fr;gap:20px}
body.treatments-page .compare-panel{border:1px solid var(--line);border-radius:28px;overflow:hidden;background:var(--white);box-shadow:var(--shadow2)}
body.treatments-page .compare-panel>header{padding:25px 28px;background:var(--lav);display:flex;justify-content:space-between;align-items:center}
body.treatments-page .compare-panel.align>header{background:var(--violet);color:#fff}
body.treatments-page .compare-panel header h3{font-size:30px}
body.treatments-page .compare-panel header span{font-size:13px;font-weight:800;letter-spacing:.12em}
body.treatments-page .compare-rows{padding:7px 25px 18px}
body.treatments-page .compare-row{display:grid;grid-template-columns:125px 1fr;gap:15px;padding:16px 0;border-bottom:1px solid var(--line)}
body.treatments-page .compare-row:last-child{border-bottom:0}
body.treatments-page .compare-row b{font-size:13px;color:var(--muted)}
body.treatments-page .compare-row span{font-size:13px;color:var(--soft)}
body.treatments-page .decision{padding:90px 0;background:var(--lav)}
body.treatments-page .decision-head{display:flex;justify-content:space-between;align-items:end;gap:35px;margin-bottom:35px}
body.treatments-page .decision-head h2{margin-top:9px}
body.treatments-page .decision-head h2 span{color:var(--violet)}
body.treatments-page .decision-head p{max-width:440px;color:var(--soft)}
body.treatments-page .decision-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
body.treatments-page .decision-card{background:var(--white);border:1px solid var(--line);border-radius:25px;padding:28px;display:grid;grid-template-columns:70px 1fr;gap:22px;box-shadow:var(--shadow2)}
body.treatments-page .decision-letter{width:62px;height:62px;border-radius:19px;background:var(--violet);color:#fff;display:grid;place-items:center;font:700 30px var(--serif)}
body.treatments-page .decision-card h3{font-size:27px;margin-bottom:7px}
body.treatments-page .decision-card p{font-size:13px;color:var(--soft)}
body.treatments-page .decision-card ul{list-style:none;margin-top:14px;display:grid;gap:7px}
body.treatments-page .decision-card li{font-size:13px;font-weight:700}
body.treatments-page .decision-card li:before{content:"✓";color:var(--violet);font-weight:900;margin-right:8px}
body.treatments-page .support{padding:84px 0}
body.treatments-page .support-line{display:grid;grid-template-columns:1fr 1fr 1fr;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
body.treatments-page .support-item{padding:25px 20px;border-right:1px solid var(--line)}
body.treatments-page .support-item:last-child{border-right:0}
body.treatments-page .support-item small{color:var(--violet);font-weight:900}
body.treatments-page .support-item h3{font-size:23px;margin:7px 0}
body.treatments-page .support-item p{font-size:13px;color:var(--soft)}
body.treatments-page .faq{padding:85px 0;background:var(--lav)}
body.treatments-page .faq-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:60px}
body.treatments-page .faq-intro h2{margin:9px 0 13px}
body.treatments-page .faq-intro h2 span{color:var(--violet)}
body.treatments-page .faq-intro p{color:var(--soft)}
body.treatments-page .faq-list{border-top:1px solid var(--line)}
body.treatments-page .faq-item{border-bottom:1px solid var(--line)}
body.treatments-page .faq-q{width:100%;padding:20px 0;border:0;background:none;color:var(--ink);display:flex;justify-content:space-between;text-align:left;font-size:15px;font-weight:800}
body.treatments-page .faq-q span{color:var(--violet);font-size:20px}
body.treatments-page .faq-a{display:none;padding:0 35px 19px 0;color:var(--soft);font-size:13px}
body.treatments-page .faq-item.open .faq-a{display:block}
body.treatments-page .faq-item.open .faq-q span{transform:rotate(45deg)}
body.treatments-page .final-note{padding:20px 0;color:var(--muted);font-size:13px}
body.treatments-page .cta{padding:0 0 90px}
body.treatments-page .cta-box{border-radius:30px;background:linear-gradient(135deg,var(--violet),var(--violet-dark));color:#fff;padding:48px 55px;display:flex;justify-content:space-between;align-items:center;gap:25px;box-shadow:var(--shadow)}
body.treatments-page .cta-box h2{font-size:42px;margin-bottom:7px}
body.treatments-page .cta-box p{color:#e8e1f4}
body.treatments-page .cta-box .btn{background:#fff;color:var(--violet-dark)}
@media (max-width:1050px){
body.treatments-page .hero-grid{grid-template-columns:1fr 1fr;gap:35px}
body.treatments-page .hero-visual{height:440px}
body.treatments-page .chapter-top,
body.treatments-page .process-layout,
body.treatments-page .duration-grid,
body.treatments-page .faq-grid{grid-template-columns:1fr}
body.treatments-page .chapter-number{display:none}
body.treatments-page .chapter-top>p{justify-self:start}
body.treatments-page .feature-copy{padding:38px}
body.treatments-page .journey-grid{grid-template-columns:repeat(2,1fr)}
body.treatments-page .journey-card:nth-child(2){border-right:0}
body.treatments-page .journey-card:nth-child(-n/**/+2){border-bottom:1px solid var(--line)}
body.treatments-page .journey-card:after{display:none}
}
@media (max-width:820px){
body.treatments-page .hero{padding:45px 0 58px}
body.treatments-page .hero-grid,
body.treatments-page .choice-grid,
body.treatments-page .feature,
body.treatments-page .adjust-grid,
body.treatments-page .compare-board,
body.treatments-page .decision-grid,
body.treatments-page .daily-box{grid-template-columns:1fr}
body.treatments-page .hero h1{font-size:clamp(43px,11vw,64px)}
body.treatments-page .hero-visual{height:400px;margin-top:15px}
body.treatments-page .hero-photo{right:7%}
body.treatments-page .hero-small{width:39%;height:40%}
body.treatments-page .movement-box{grid-template-columns:1fr;padding:35px 25px}
body.treatments-page .movement-steps{grid-template-columns:1fr}
body.treatments-page .start,
body.treatments-page .process,
body.treatments-page .aligner-journey,
body.treatments-page .compare,
body.treatments-page .decision,
body.treatments-page .faq,
body.treatments-page .support{padding-top:70px;padding-bottom:70px}
body.treatments-page .type-list{grid-template-columns:1fr}
body.treatments-page .type-card{grid-template-columns:130px 1fr}
body.treatments-page .journey-grid{grid-template-columns:1fr}
body.treatments-page .journey-card{border-right:0!important;border-bottom:1px solid var(--line)}
body.treatments-page .journey-card:last-child{border-bottom:0}
body.treatments-page .daily-image{min-height:350px}
body.treatments-page .daily-content{padding:35px 25px}
body.treatments-page .routine{grid-template-columns:1fr}
body.treatments-page .duration-side{grid-template-columns:1fr 1fr}
body.treatments-page .decision-head,
body.treatments-page .journey-head{display:block}
body.treatments-page .decision-head p,
body.treatments-page .journey-head p{margin-top:14px}
body.treatments-page .support-line{grid-template-columns:1fr}
body.treatments-page .support-item{border-right:0;border-bottom:1px solid var(--line)}
body.treatments-page .support-item:last-child{border-bottom:0}
body.treatments-page .cta-box{padding:35px 25px;display:block}
body.treatments-page .cta-box h2{font-size:34px}
body.treatments-page .cta-box .btn{margin-top:20px}
}
@media (max-width:820px){
body.treatments-page .editorial-process-note{margin-top:26px}
body.treatments-page .living-braces-layout{gap:20px}
body.treatments-page .living-visual{min-height:310px;border-radius:23px}
body.treatments-page .living-point{grid-template-columns:48px 1fr;gap:14px;padding:23px 0}
body.treatments-page .living-point-number{width:42px;height:42px}
body.treatments-page .living-point-body h3{font-size:25px}
body.treatments-page .living-point-body p{font-size:13px}
body.treatments-page .living-actions{gap:5px}
body.treatments-page .living-actions span{font-size:13px;padding:5px 7px}
}
@media (max-width:560px){
body.treatments-page .hero-grid{grid-template-columns:1fr}
body.treatments-page .hero-visual{height:330px}
body.treatments-page .hero-photo{right:0;inset:0 0 8% 0}
body.treatments-page .hero-small{width:43%;height:40%;border-width:6px}
body.treatments-page .hero-tag{left:14px;bottom:20px}
body.treatments-page .hero-actions .btn{width:100%}
body.treatments-page .choice{min-height:310px}
body.treatments-page .movement-box{border-radius:23px}
body.treatments-page .feature-image{min-height:320px}
body.treatments-page .feature-copy{padding:28px 22px}
body.treatments-page .feature-copy h3{font-size:31px}
body.treatments-page .facts{grid-template-columns:1fr}
body.treatments-page .type-card{grid-template-columns:1fr}
body.treatments-page .type-card img{height:200px}
body.treatments-page .type-content{padding:20px}
body.treatments-page .daily-image{min-height:290px}
body.treatments-page .duration-side{grid-template-columns:1fr}
body.treatments-page .compare-row{grid-template-columns:1fr;gap:5px}
body.treatments-page .decision-card{grid-template-columns:1fr}
body.treatments-page .cta-box h2{font-size:31px}
}
body.treatments-page .compact-step.feature{background:var(--ink);border-color:var(--ink);color:#fff;transform:translateY(-7px);box-shadow:0 18px 38px rgba(39,34,56,.2);}
body.treatments-page .compact-step.feature:before{background:#cfc1ff;}
body.treatments-page .compact-step.feature:hover{transform:translateY(-10px);}
body.treatments-page .compact-step.feature .compact-number{color:#cfc1ff;}
body.treatments-page .compact-step.feature .compact-icon{background:rgba(255,255,255,.12);color:#fff;}
body.treatments-page .compact-step.feature small{color:#cfc1ff;}
body.treatments-page .compact-step.feature h3{color:#fff;}
body.treatments-page .compact-step.feature p{color:#d9d4e2;}
@media (max-width:1100px){
body.treatments-page .compact-step.feature{transform:none;}
body.treatments-page .compact-step.feature:hover{transform:translateY(-5px);}
}
body.treatments-page .hero{padding:48px 0 60px}
body.treatments-page .hero-visual{height:455px}
body.treatments-page .start{padding:68px 0 72px}
body.treatments-page .movement{padding:0 0 68px}
body.treatments-page .movement-box{padding:40px 44px}
body.treatments-page .chapter{padding:72px 0 76px}
body.treatments-page .chapter-top{margin-bottom:36px}
body.treatments-page .feature{min-height:440px}
body.treatments-page .feature-image{min-height:440px}
body.treatments-page .feature-copy{padding:40px 44px}
body.treatments-page .type-section{padding-top:30px}
body.treatments-page .braces-process-editorial{padding:64px 0 68px}
body.treatments-page .editorial-process-head{margin-bottom:40px}
body.treatments-page .adjust{padding:68px 0 72px}
body.treatments-page .aligner-journey{padding:68px 0 72px}
body.treatments-page .daily{padding:0 0 72px}
body.treatments-page .daily-box,
body.treatments-page .daily-image{min-height:440px}
body.treatments-page .daily-content{padding:42px 44px}
body.treatments-page .duration{padding:68px 0 72px}
body.treatments-page .compare{padding:68px 0 72px}
body.treatments-page .decision{padding:68px 0 72px}
body.treatments-page .support{padding:68px 0 72px}
body.treatments-page .faq{padding:68px 0 72px}
body.treatments-page .cta{padding:0 0 72px}
body.treatments-page .treatment-essentials{padding:0 0 72px;background:var(--paper)}
body.treatments-page .essentials-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,.72fr);gap:55px;align-items:end;margin-bottom:30px}
body.treatments-page .essentials-head h2{margin-top:8px}
body.treatments-page .essentials-head p{font-size:15px;line-height:1.75;color:var(--muted);max-width:500px;margin:0 0 2px}
body.treatments-page .essentials-flow{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
body.treatments-page .essential-item{display:grid;grid-template-columns:auto 1fr;gap:16px;padding:23px 22px 24px 0;min-height:128px;align-items:start}
body.treatments-page .essential-item+.essential-item{padding-left:22px;border-left:1px solid var(--line)}
body.treatments-page .essential-no{font:700 28px/1 var(--serif);color:var(--violet)}
body.treatments-page .essential-item b{display:block;font-size:14px;margin-bottom:5px;color:var(--ink)}
body.treatments-page .essential-item p{font-size:13px;line-height:1.6;color:var(--muted);margin:0}
@media (max-width:900px){
body.treatments-page .hero{padding-top:38px}
body.treatments-page .hero-visual{height:400px}
body.treatments-page .chapter{padding:60px 0 64px}
body.treatments-page .feature{min-height:390px}
body.treatments-page .feature-image{min-height:390px}
body.treatments-page .daily-box,
body.treatments-page .daily-image{min-height:390px}
body.treatments-page .essentials-head{grid-template-columns:1fr;gap:10px}
body.treatments-page .essentials-flow{grid-template-columns:1fr 1fr}
body.treatments-page .essential-item{padding:20px}
body.treatments-page .essential-item+.essential-item{border-left:0}
body.treatments-page .essential-item:nth-child(2n){border-left:1px solid var(--line)}
body.treatments-page .essential-item:nth-child(n/**/+3){border-top:1px solid var(--line)}
}
@media (max-width:650px){
body.treatments-page .hero{padding:34px 0 48px}
body.treatments-page .hero-visual{height:330px}
body.treatments-page .start{padding:52px 0 58px}
body.treatments-page .movement{padding-bottom:55px}
body.treatments-page .movement-box{padding:28px 22px}
body.treatments-page .chapter{padding:52px 0 58px}
body.treatments-page .feature-copy{padding:30px 24px}
body.treatments-page .feature{min-height:auto}
body.treatments-page .feature-image{min-height:300px}
body.treatments-page .braces-process-editorial{padding:52px 0 56px}
body.treatments-page .adjust{padding:54px 0 58px}
body.treatments-page .aligner-journey{padding:54px 0 58px}
body.treatments-page .daily{padding-bottom:58px}
body.treatments-page .daily-box{min-height:auto}
body.treatments-page .daily-image{min-height:300px}
body.treatments-page .daily-content{padding:30px 24px}
body.treatments-page .duration,
body.treatments-page .compare,
body.treatments-page .decision,
body.treatments-page .support,
body.treatments-page .faq{padding:54px 0 58px}
body.treatments-page .cta{padding-bottom:58px}
body.treatments-page .treatment-essentials{padding:0 0 56px}
body.treatments-page .essentials-head{gap:8px;margin-bottom:22px}
body.treatments-page .essentials-head h2{font-size:34px}
body.treatments-page .essentials-head p{font-size:14px}
body.treatments-page .essentials-flow{grid-template-columns:1fr}
body.treatments-page .essential-item,
body.treatments-page .essential-item+.essential-item,
body.treatments-page .essential-item:nth-child(2n){border-left:0;border-top:1px solid var(--line);padding:17px 0;min-height:auto}
body.treatments-page .essential-item:first-child{border-top:0}
body.treatments-page .essential-no{font-size:24px}
}



/* =========================================================
   HOME 1 PAGE — SMILE TRANSFORMATIONS
   (scoped to .home1-page; tokens and sizes follow About)
   ========================================================= */

.home1-page .nav-dropdown > button.active{
    color:var(--violet);
    background:var(--violet-soft);
}

.home1-page .hm-alt{
    background:var(--lavender);
}

.home1-page .hero::before,
.home1-page .hero::after{
    content:"";
    position:absolute;
    border-radius:50%;
    pointer-events:none;
    background:radial-gradient(circle,rgba(102,81,168,.16),transparent 70%);
    animation:hmDrift 9s ease-in-out infinite;
}

.home1-page .hero::before{
    width:320px;
    height:320px;
    top:-90px;
    left:-80px;
}

.home1-page .hero::after{
    width:260px;
    height:260px;
    bottom:-70px;
    right:30%;
    animation-delay:-4s;
}

.home1-page .hero{
    position:relative;
}

.home1-page .hero .container{
    position:relative;
    z-index:1;
}

@keyframes hmDrift{
    0%,100%{transform:translate(0,0) scale(1);}
    50%{transform:translate(26px,18px) scale(1.12);}
}

.hm-spark{
    display:inline-block;
    animation:hmSpark 2.4s ease-in-out infinite;
}

@keyframes hmSpark{
    0%,100%{transform:scale(1) rotate(0);}
    50%{transform:scale(1.35) rotate(25deg);}
}

/* ---------- split layout ---------- */

.hm-split{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:60px;
    align-items:center;
}

.hm-split-rev .hm-split-visual{
    order:-1;
}

.hm-h2{
    font-family:var(--serif);
    font-size:clamp(36px,4.2vw,56px);
    line-height:1.08;
    letter-spacing:-.025em;
    margin-bottom:18px;
}

.hm-lead{
    max-width:560px;
    margin-bottom:24px;
    color:var(--muted);
    font-size:16px;
    line-height:1.8;
}

/* ---------- before / after slider ---------- */

.hm-compare{
    --pos:50%;
    position:relative;
    width:100%;
    aspect-ratio:4/3;
    max-height:400px;
    overflow:hidden;
    border-radius:28px;
    box-shadow:var(--shadow);
    direction:ltr;
    user-select:none;
    touch-action:pan-y;
    background:var(--lavender-2);
}

.hm-compare img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    transition:opacity .35s ease;
}

.hm-compare.is-swapping img{
    opacity:0;
}

.hm-compare-before{
    position:absolute;
    inset:0;
    clip-path:inset(0 calc(100% - var(--pos)) 0 0);
}

.hm-compare-before img{
    filter:grayscale(.5) sepia(.45) brightness(.85) contrast(.95);
}

.hm-compare-line{
    position:absolute;
    top:0;
    bottom:0;
    left:var(--pos);
    width:3px;
    background:#fff;
    transform:translateX(-50%);
    box-shadow:0 0 14px rgba(0,0,0,.25);
}

.hm-compare-knob{
    position:absolute;
    top:50%;
    left:var(--pos);
    width:46px;
    height:46px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:#fff;
    color:var(--violet);
    font-size:18px;
    font-weight:800;
    transform:translate(-50%,-50%);
    box-shadow:var(--shadow-soft);
    animation:hmPulseRing 2.4s ease-out infinite;
}

@keyframes hmPulseRing{
    0%{box-shadow:0 0 0 0 rgba(255,255,255,.7);}
    100%{box-shadow:0 0 0 18px rgba(255,255,255,0);}
}

.hm-compare input{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    margin:0;
    opacity:0;
    cursor:ew-resize;
}

.hm-tag{
    position:absolute;
    top:14px;
    padding:6px 12px;
    border-radius:999px;
    background:rgba(255,255,255,.9);
    color:var(--ink);
    font-size:11px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.hm-tag-before{left:14px;}
.hm-tag-after{right:14px;}

/* ---------- why ORVI ---------- */

.hm-split-visual{
    position:relative;
}

.hm-why-image{
    overflow:hidden;
    max-height:400px;
    aspect-ratio:4/3;
    border-radius:28px;
    box-shadow:var(--shadow);
}

.hm-why-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform 1.2s ease;
}

.hm-split-visual:hover .hm-why-image img{
    transform:scale(1.06);
}

.hm-float{
    right:-10px;
    bottom:28px;
    animation-delay:-1s;
}

.hm-checks{
    list-style:none;
    display:grid;
    gap:14px;
    margin-bottom:26px;
}

.hm-checks li{
    display:flex;
    align-items:flex-start;
    gap:12px;
    color:var(--ink-soft);
    font-size:15px;
    line-height:1.6;
}

.hm-checks strong{
    color:var(--ink);
}

.hm-checks svg{
    flex:0 0 26px;
    width:26px;
    height:26px;
    fill:var(--violet-soft);
    stroke:var(--violet);
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.hm-checks svg path{
    fill:none;
    stroke-dasharray:22;
    stroke-dashoffset:22;
    transition:stroke-dashoffset .7s ease .4s;
}

.hm-split-copy.visible .hm-checks svg path{
    stroke-dashoffset:0;
}

.hm-split-copy.visible .hm-checks li:nth-child(2) svg path{transition-delay:.65s;}
.hm-split-copy.visible .hm-checks li:nth-child(3) svg path{transition-delay:.9s;}
.hm-split-copy.visible .hm-checks li:nth-child(4) svg path{transition-delay:1.15s;}

.hm-mini-stats{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:12px;
}

.hm-mini-stats > div{
    padding:14px 12px;
    border:1px solid var(--border);
    border-radius:18px;
    background:var(--white);
    text-align:center;
}

.hm-mini-stats strong{
    display:block;
    color:var(--violet);
    font-family:var(--serif);
    font-size:27px;
    line-height:1;
}

.hm-mini-stats span{
    font-size:13px;
    color:var(--muted);
}

/* ---------- doctors ---------- */

.hm-doctors{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:22px;
}

.hm-doctor{
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:var(--radius);
    background:var(--white);
    box-shadow:var(--shadow-soft);
    transition:
        transform .4s cubic-bezier(.2,.75,.25,1),
        box-shadow .4s ease,
        opacity .75s ease;
}

.hm-doctor:hover{
    transform:translateY(-7px);
    box-shadow:var(--shadow);
}

.hm-doctor-img{
    position:relative;
    height:230px;
    overflow:hidden;
}

.hm-doctor-img img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:top;
    transition:transform .8s ease;
}

.hm-doctor:hover .hm-doctor-img img{
    transform:scale(1.07);
}

.hm-chip{
    position:absolute;
    left:50%;
    bottom:14px;
    padding:8px 16px;
    border-radius:999px;
    background:var(--violet);
    color:#fff;
    font-size:13px;
    font-weight:700;
    white-space:nowrap;
    transform:translate(-50%,60px);
    opacity:0;
    transition:transform .4s cubic-bezier(.2,.75,.25,1),opacity .3s ease;
}

.hm-doctor:hover .hm-chip,
.hm-chip:focus-visible{
    transform:translate(-50%,0);
    opacity:1;
}

.hm-doctor-body{
    padding:20px 22px 24px;
}

.hm-doctor-body h3{
    font-family:var(--serif);
    font-size:22px;
    margin-bottom:4px;
}

.hm-role{
    margin-bottom:8px;
    color:var(--violet);
    font-size:12px;
    font-weight:800;
    letter-spacing:.1em;
    text-transform:uppercase;
}

.hm-doctor-body p{
    color:var(--muted);
    font-size:14px;
    line-height:1.7;
}

/* ---------- reviews carousel ---------- */

.hm-reviews{
    --per:3;
    overflow:hidden;
    direction:ltr;
    padding:6px 0 10px;
}

.hm-reviews-track{
    display:flex;
    gap:20px;
    transition:transform .7s cubic-bezier(.2,.75,.25,1);
}

.hm-review{
    flex:0 0 calc((100% - (var(--per) - 1) * 20px) / var(--per));
    padding:26px;
    border:1px solid var(--border);
    border-radius:var(--radius);
    background:var(--white);
    box-shadow:var(--shadow-soft);
}

.hm-stars{
    margin-bottom:12px;
    color:#e9a83b;
    font-size:17px;
    letter-spacing:3px;
}

.hm-reviews.visible .hm-stars{
    animation:hmStars .8s ease both;
}

@keyframes hmStars{
    0%{opacity:0;transform:scale(.6);letter-spacing:-2px;}
    100%{opacity:1;transform:scale(1);letter-spacing:3px;}
}

.hm-review p{
    margin-bottom:18px;
    color:var(--ink-soft);
    font-size:15px;
    line-height:1.7;
}

.hm-author{
    display:flex;
    align-items:center;
    gap:12px;
}

.hm-author > span{
    width:42px;
    height:42px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:var(--violet-soft);
    color:var(--violet);
    font-family:var(--serif);
    font-size:18px;
    font-weight:700;
}

.hm-author strong{
    display:block;
    font-size:14px;
}

.hm-author small{
    color:var(--muted);
    font-size:12px;
}

.hm-dots{
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:20px;
}

.hm-dots button{
    width:9px;
    height:9px;
    padding:0;
    border:0;
    border-radius:999px;
    background:var(--border);
    transition:width .35s ease,background .35s ease;
}

.hm-dots button.is-active{
    width:28px;
    background:var(--violet);
}

/* ---------- CTA ---------- */

.hm-cta{
    position:relative;
    display:grid;
    grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
    gap:44px;
    align-items:center;
    overflow:hidden;
    padding:50px;
    border-radius:32px;
    background:linear-gradient(135deg,var(--violet-dark),var(--violet));
    color:#fff;
    box-shadow:var(--shadow);
}

.hm-orb{
    position:absolute;
    border-radius:50%;
    background:rgba(255,255,255,.1);
    animation:hmDrift 8s ease-in-out infinite;
}

.hm-orb-1{width:200px;height:200px;top:-60px;right:30%;}
.hm-orb-2{width:140px;height:140px;bottom:-40px;left:-30px;animation-delay:-3s;}

.hm-cta-copy,
.hm-form{
    position:relative;
    z-index:1;
}

.hm-cta .section-kicker{
    color:#fff;
}

.hm-cta .section-kicker::before{
    background:#fff;
}

.hm-cta h2{
    margin-bottom:14px;
    font-family:var(--serif);
    font-size:clamp(36px,4.2vw,52px);
    line-height:1.08;
    letter-spacing:-.025em;
}

.hm-cta-copy > p{
    max-width:480px;
    margin-bottom:20px;
    color:rgba(255,255,255,.85);
    font-size:16px;
    line-height:1.8;
}

.hm-chips{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}

.hm-chips span{
    padding:8px 14px;
    border:1px solid rgba(255,255,255,.3);
    border-radius:999px;
    background:rgba(255,255,255,.12);
    font-size:13px;
    font-weight:600;
}

.hm-form{
    display:grid;
    gap:12px;
    padding:24px;
    border-radius:24px;
    background:var(--white);
    box-shadow:var(--shadow);
}

.hm-form input,
.hm-form select{
    width:100%;
    min-height:46px;
    padding:0 14px;
    border:1px solid var(--border);
    border-radius:14px;
    background:var(--paper);
    color:var(--ink);
    font:inherit;
    font-size:14px;
    transition:border-color .25s ease,box-shadow .25s ease;
}

.hm-form input:focus,
.hm-form select:focus{
    outline:0;
    border-color:var(--violet);
    box-shadow:0 0 0 4px rgba(102,81,168,.14);
}

.hm-form .btn{
    min-height:46px;
}

.hm-pulse{
    animation:hmBtnPulse 2.6s ease-out infinite;
}

@keyframes hmBtnPulse{
    0%{box-shadow:0 0 0 0 rgba(102,81,168,.45);}
    70%,100%{box-shadow:0 0 0 14px rgba(102,81,168,0);}
}

.hm-form-msg{
    min-height:0;
    color:var(--violet);
    font-size:13px;
    font-weight:700;
    text-align:center;
}

/* ---------- responsive ---------- */

@media(max-width:1000px){
    .hm-reviews{--per:2;}
    .hm-split{gap:40px;}
    .hm-cta{padding:40px;gap:32px;}
}

@media(max-width:900px){
    .hm-split{grid-template-columns:1fr;}
    .hm-split-rev .hm-split-visual{order:0;}
    .hm-doctors{grid-template-columns:repeat(2,minmax(0,1fr));}
    .hm-cta{grid-template-columns:1fr;}
    .hm-compare,.hm-why-image{max-height:340px;}
}

@media(max-width:640px){
    .hm-reviews{--per:1;}
    .hm-doctors{grid-template-columns:1fr;}
    .hm-doctor-img{height:210px;}
    .hm-chip{opacity:1;transform:translate(-50%,0);}
    .hm-cta{padding:28px 20px;border-radius:26px;}
    .hm-form{padding:18px;}
    .hm-h2{font-size:clamp(34px,10vw,45px);}
    .hm-cta h2{font-size:clamp(34px,10vw,45px);}
    .hm-lead{font-size:15px;}
    .hm-float{right:0;bottom:16px;padding:10px 12px;gap:8px;}
}

@media(max-width:420px){
    .hm-mini-stats strong{font-size:22px;}
    .hm-mini-stats span{font-size:11px;}
}

@media(prefers-reduced-motion:reduce){
    .home1-page *,
    .home1-page *::before,
    .home1-page *::after{
        animation:none !important;
        transition-duration:.01ms !important;
    }
    .hm-checks svg path{stroke-dashoffset:0;}
}

/* Home 1: count-up spans must inherit the big number style */
.home1-page .hero-stat strong span,
.home1-page .hm-mini-stats strong span{
    margin:0;
    font-size:inherit;
    color:inherit;
    font-weight:inherit;
}

.home1-page .hm-reviews{
    padding:6px 0 26px;
    margin-bottom:-14px;
}


/* =========================================================
   HOME 1 — PREMIUM UPGRADE (sections 2–4 + page-wide motion)
   ========================================================= */

/* ---------- scroll progress bar ---------- */
.hm-progress-bar{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:3px;
    z-index:2000;
    transform:scaleX(0);
    transform-origin:left;
    background:linear-gradient(90deg,var(--violet),#b49cf2);
}

/* ---------- hero entrance + shimmer ---------- */
.home1-page .hero-copy.reveal > *{
    opacity:0;
    transform:translateY(24px);
    transition:opacity .7s ease,transform .8s cubic-bezier(.2,.75,.25,1);
}
.home1-page .hero-copy.reveal.visible > *{
    opacity:1;
    transform:none;
}
.home1-page .hero-copy.reveal.visible > *:nth-child(1){transition-delay:.05s;}
.home1-page .hero-copy.reveal.visible > *:nth-child(2){transition-delay:.18s;}
.home1-page .hero-copy.reveal.visible > *:nth-child(3){transition-delay:.32s;}
.home1-page .hero-copy.reveal.visible > *:nth-child(4){transition-delay:.46s;}
.home1-page .hero-copy.reveal.visible > *:nth-child(5){transition-delay:.6s;}

@keyframes hmShimmer{
    0%{background-position:0% 50%;}
    100%{background-position:250% 50%;}
}


/* ---------- animated headings ---------- */
.hm-words .w{
    display:inline-block;
    overflow:hidden;
    vertical-align:top;
    padding-bottom:.14em;
    margin-bottom:-.14em;
}
.hm-words .w > span{
    display:inline-block;
    transform:translateY(112%);
    transition:transform .8s cubic-bezier(.2,.75,.25,1);
}
.reveal.visible .hm-words .w > span,
.hm-words.visible .w > span{
    transform:none;
}

/* ---------- section 2 : real smile journeys ---------- */
.hm-journeys{
    overflow:hidden;
}
.hm-deco{
    position:absolute;
    pointer-events:none;
    color:var(--violet);
    opacity:.1;
}
.hm-deco svg{
    width:100%;
    height:100%;
    fill:currentColor;
}
.hm-deco-1{width:74px;height:92px;top:9%;left:3%;animation:hmBob 7s ease-in-out infinite;}
.hm-deco-2{width:54px;height:68px;bottom:9%;right:4%;animation:hmBob 8s ease-in-out -3s infinite;transform:rotate(18deg);}
.hm-deco-3{top:16%;right:9%;font-size:38px;animation:hmSpark 3s ease-in-out infinite;}
@keyframes hmBob{
    0%,100%{transform:translateY(0) rotate(-6deg);}
    50%{transform:translateY(-18px) rotate(8deg);}
}

.hm-tabs{
    position:relative;
    display:flex;
    width:fit-content;
    max-width:100%;
    gap:2px;
    padding:5px;
    margin-bottom:18px;
    border:1px solid var(--border);
    border-radius:999px;
    background:var(--white);
    box-shadow:var(--shadow-soft);
}
.hm-tab-pill{
    position:absolute;
    top:5px;
    bottom:5px;
    left:5px;
    width:0;
    border-radius:999px;
    background:linear-gradient(135deg,var(--violet),var(--violet-dark));
    box-shadow:0 8px 20px rgba(102,81,168,.3);
    transition:left .45s cubic-bezier(.2,.75,.25,1),width .45s cubic-bezier(.2,.75,.25,1);
}
.hm-tab{
    position:relative;
    z-index:1;
    min-height:40px;
    padding:0 20px;
    border:0;
    border-radius:999px;
    background:transparent;
    color:var(--ink-soft);
    font-size:14px;
    font-weight:700;
    transition:color .3s ease;
}
.hm-tab:hover{color:var(--violet);}
.hm-tab.is-active,
.hm-tab.is-active:hover{color:#fff;}

.hm-facts{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-bottom:24px;
}
.hm-facts > div{
    padding:13px 14px;
    border:1px solid var(--border);
    border-radius:18px;
    background:var(--white);
    box-shadow:var(--shadow-soft);
    overflow:hidden;
}
.hm-facts small{
    display:block;
    margin-bottom:3px;
    color:var(--muted);
    font-size:11px;
    font-weight:800;
    letter-spacing:.1em;
    text-transform:uppercase;
}
.hm-facts strong{
    display:block;
    font-size:14px;
    line-height:1.35;
    transition:transform .35s ease,opacity .35s ease;
}
.hm-facts.is-flip strong{
    opacity:0;
    transform:translateY(10px);
}

.hm-compare-wrap{
    position:relative;
}
.hm-compare-wrap::before{
    content:"";
    position:absolute;
    inset:-16px 18px 18px -16px;
    border-radius:32px;
    background:linear-gradient(135deg,rgba(102,81,168,.28),rgba(169,139,245,.12));
    animation:hmTilt 9s ease-in-out infinite;
}
.hm-compare-wrap::after{
    content:"";
    position:absolute;
    right:-12px;
    bottom:-12px;
    width:110px;
    height:110px;
    border-radius:50%;
    background-image:radial-gradient(var(--violet) 1.6px,transparent 1.8px);
    background-size:14px 14px;
    opacity:.35;
    z-index:-1;
}
@keyframes hmTilt{
    0%,100%{transform:rotate(-2deg);}
    50%{transform:rotate(2.5deg);}
}
.hm-compare{
    z-index:1;
}
.hm-hint{
    position:absolute;
    left:50%;
    bottom:14px;
    padding:7px 14px;
    border-radius:999px;
    background:rgba(255,255,255,.92);
    color:var(--violet-dark);
    font-size:12px;
    font-weight:800;
    white-space:nowrap;
    transform:translateX(-50%);
    pointer-events:none;
    animation:hmHint 2.2s ease-in-out infinite;
    transition:opacity .4s ease;
}
.hm-compare.is-touched .hm-hint{
    opacity:0;
}
@keyframes hmHint{
    0%,100%{transform:translateX(-50%) scale(1);}
    50%{transform:translateX(-50%) scale(1.06);}
}

.hm-score{
    z-index:3;
    left:-18px;
    bottom:34px;
    animation-delay:-2.4s;
}
.hm-score svg{
    width:44px;
    height:44px;
    transform:rotate(-90deg);
}
.hm-score circle{
    fill:none;
    stroke-width:4;
}
.hm-score .ring-bg{stroke:var(--violet-soft);}
.hm-score .ring{
    stroke:var(--violet);
    stroke-linecap:round;
    stroke-dasharray:113.1;
    stroke-dashoffset:60;
    transition:stroke-dashoffset .25s ease;
}
.hm-score em{
    font-style:normal;
    color:var(--violet);
    font-weight:800;
    font-size:inherit;
}

/* ---------- section 3 : treatments showcase ---------- */
.hm-showcase{
    display:grid;
    grid-template-columns:minmax(230px,290px) minmax(0,1fr);
    gap:22px;
    align-items:stretch;
}
.hm-show-list{
    display:flex;
    flex-direction:column;
    gap:12px;
}
.hm-show-item{
    position:relative;
    flex:1;
    display:flex;
    align-items:center;
    gap:14px;
    padding:16px 18px;
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:20px;
    background:var(--white);
    color:var(--ink);
    text-align:left;
    box-shadow:var(--shadow-soft);
    transition:transform .35s cubic-bezier(.2,.75,.25,1),border-color .3s ease,background .3s ease,box-shadow .3s ease;
}
.hm-show-item:hover{
    transform:translateX(5px);
    border-color:var(--violet);
}
.hm-show-item.is-active{
    transform:translateX(10px);
    border-color:var(--violet);
    background:var(--violet-soft);
    box-shadow:var(--shadow);
}
.hm-show-num{
    flex:0 0 38px;
    height:38px;
    display:grid;
    place-items:center;
    border-radius:12px;
    background:var(--violet-soft);
    color:var(--violet);
    font-family:var(--serif);
    font-size:17px;
    font-weight:700;
    transition:var(--transition);
}
.hm-show-item.is-active .hm-show-num{
    background:var(--violet);
    color:#fff;
    transform:rotate(-6deg) scale(1.06);
}
.hm-show-txt strong{
    display:block;
    font-size:15.5px;
    line-height:1.3;
}
.hm-show-txt small{
    color:var(--muted);
    font-size:13px;
}
.hm-progress{
    position:absolute;
    left:0;
    bottom:0;
    height:3px;
    width:0;
    background:linear-gradient(90deg,var(--violet),#b49cf2);
}
.hm-show-item.is-active .hm-progress{
    animation:hmFill 6.5s linear forwards;
}
.hm-showcase.is-paused .hm-show-item.is-active .hm-progress{
    animation-play-state:paused;
}
@keyframes hmFill{
    from{width:0;}
    to{width:100%;}
}

.hm-show-panel{
    position:relative;
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:18px;
    align-items:center;
    min-height:380px;
    padding:36px 34px;
    overflow:hidden;
    border-radius:32px;
    background:linear-gradient(135deg,#4d3b86 0%,#6651a8 55%,#7c63c8 100%);
    color:#fff;
    box-shadow:var(--shadow);
}
.hm-show-glow{
    position:absolute;
    border-radius:50%;
    pointer-events:none;
    background:radial-gradient(circle,rgba(255,255,255,.2),transparent 70%);
    animation:hmDrift 9s ease-in-out infinite;
}
.hm-show-glow.g1{width:300px;height:300px;top:-110px;right:-60px;}
.hm-show-glow.g2{width:220px;height:220px;bottom:-90px;left:20%;animation-delay:-4s;}
.hm-show-info,
.hm-show-art{
    position:relative;
    z-index:1;
}
.hm-show-info{
    transition:opacity .3s ease,transform .3s ease;
}
.hm-show-panel.is-changing .hm-show-info{
    opacity:0;
    transform:translateY(12px);
}
.hm-show-tag{
    display:inline-block;
    margin-bottom:14px;
    padding:6px 13px;
    border:1px solid rgba(255,255,255,.3);
    border-radius:999px;
    background:rgba(255,255,255,.14);
    font-size:12px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
}
.hm-show-info h3{
    margin-bottom:10px;
    font-family:var(--serif);
    font-size:clamp(28px,3vw,38px);
    line-height:1.1;
    letter-spacing:-.02em;
}
.hm-show-info > p{
    max-width:420px;
    margin-bottom:18px;
    color:rgba(255,255,255,.88);
    font-size:15px;
    line-height:1.75;
}
.hm-show-meta{
    list-style:none;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-bottom:20px;
}
.hm-show-meta li{
    padding:11px 12px;
    border-radius:16px;
    background:rgba(255,255,255,.13);
    border:1px solid rgba(255,255,255,.16);
}
.hm-show-meta small{
    display:block;
    margin-bottom:2px;
    color:rgba(255,255,255,.7);
    font-size:10.5px;
    font-weight:800;
    letter-spacing:.1em;
    text-transform:uppercase;
}
.hm-show-meta strong{
    display:block;
    font-size:13px;
    line-height:1.35;
}
.hm-btn-light{
    background:#fff;
    color:var(--violet-dark);
    box-shadow:0 12px 26px rgba(0,0,0,.18);
}
.hm-btn-light span{
    display:inline-block;
    margin-left:6px;
    transition:transform .3s ease;
}
.hm-btn-light:hover{
    transform:translateY(-2px);
}
.hm-btn-light:hover span{
    transform:translateX(4px);
}

.hm-show-art svg{
    display:block;
    width:100%;
    height:auto;
    overflow:visible;
    filter:drop-shadow(0 14px 26px rgba(30,20,60,.35));
}
.hm-show-art .gum{
    fill:none;
    stroke:rgba(255,255,255,.16);
    stroke-width:34;
    stroke-linecap:round;
}
.hm-show-art .tooth{
    fill:#fff;
    transform-box:fill-box;
    transform-origin:50% 60%;
}
.hm-showcase.visible .hm-show-art.play .tooth{
    animation:hmStraighten 1.2s cubic-bezier(.2,.8,.2,1) calc(var(--i) * .09s) both;
}
.hm-showcase[data-key="early"].visible .hm-show-art.play .tooth{
    animation-name:hmGrow;
}
@keyframes hmStraighten{
    from{transform:rotate(var(--r0)) translateX(var(--dx0));}
    to{transform:none;}
}
@keyframes hmGrow{
    from{transform:scale(.45);opacity:.3;}
    to{transform:none;opacity:1;}
}
.hm-show-art .ov{
    opacity:0;
    transition:opacity .2s ease;
}
.hm-showcase[data-key="braces"] .ov-braces,
.hm-showcase[data-key="ceramic"] .ov-ceramic,
.hm-showcase[data-key="aligners"] .ov-aligners,
.hm-showcase[data-key="early"] .ov-early{
    opacity:1;
    transition:opacity .6s ease 1.1s;
}
.hm-show-art .wire{
    fill:none;
    stroke:#c9cde3;
    stroke-width:3;
    stroke-linecap:round;
    stroke-linejoin:round;
    stroke-dasharray:420;
}
.hm-show-art .wire-thin{
    stroke:rgba(255,255,255,.75);
    stroke-width:1.8;
}
.hm-show-art .ov-braces .br{
    fill:#d9dcee;
    stroke:#8d92b3;
    stroke-width:1.5;
}
.hm-show-art .ov-ceramic .br{
    fill:#fff4e4;
    stroke:#f1d5ad;
    stroke-width:1.5;
    filter:drop-shadow(0 0 5px rgba(255,236,200,.9));
}
.hm-show-art .tray{
    fill:rgba(255,255,255,.16);
    stroke:rgba(255,255,255,.9);
    stroke-width:2;
    stroke-linejoin:round;
    stroke-dasharray:8 6;
    animation:hmDash 2.5s linear infinite;
}
@keyframes hmDash{
    to{stroke-dashoffset:-28;}
}
.hm-showcase.visible .hm-show-art.play .wire{
    animation:hmDraw 1.3s ease 1s both;
}
@keyframes hmDraw{
    from{stroke-dashoffset:420;}
    to{stroke-dashoffset:0;}
}
.hm-show-art .spark{
    fill:#fff;
    font-size:15px;
    transform-box:fill-box;
    transform-origin:center;
    animation:hmTwinkle 2.6s ease-in-out infinite;
}
.hm-show-art .s2{animation-delay:-.8s;}
.hm-show-art .s3{animation-delay:-1.6s;font-size:12px;}
.hm-show-art .s4{animation-delay:-2s;font-size:11px;}
@keyframes hmTwinkle{
    0%,100%{opacity:.25;transform:scale(.6);}
    50%{opacity:1;transform:scale(1.25);}
}

/* ---------- responsive : upgrade ---------- */
@media(max-width:1000px){
    .hm-showcase{grid-template-columns:minmax(210px,250px) minmax(0,1fr);}
    .hm-show-panel{grid-template-columns:1fr;padding:30px 28px;}
    .hm-show-art{max-width:380px;margin-inline:auto;order:-1;}
    .hm-score{left:-8px;}
}

@media(max-width:900px){
    .hm-showcase{grid-template-columns:1fr;}
    .hm-show-list{
        flex-direction:row;
        overflow-x:auto;
        padding:4px 2px 10px;
        scroll-snap-type:x proximity;
        -webkit-overflow-scrolling:touch;
    }
    .hm-show-item{
        flex:0 0 auto;
        min-width:210px;
        scroll-snap-align:start;
    }
    .hm-show-item.is-active,
    .hm-show-item:hover{transform:translateY(-3px);}
    .hm-deco-1{opacity:.06;}
}

@media(max-width:640px){
    .hm-tabs{width:100%;}
    .hm-tab{flex:1 1 auto;padding:0 10px;}
    .hm-facts{gap:8px;}
    .hm-facts > div{padding:11px 10px;}
    .hm-facts strong{font-size:12.5px;}
    .hm-score{left:0;bottom:44px;}
    .hm-compare-wrap::before{inset:-10px 10px 10px -10px;}
    .hm-show-panel{padding:24px 18px;min-height:0;border-radius:26px;}
    .hm-show-meta{grid-template-columns:1fr 1fr 1fr;gap:8px;}
    .hm-show-meta li{padding:9px 8px;}
    .hm-show-meta strong{font-size:12px;}
    .hm-show-info h3{font-size:clamp(26px,8vw,32px);}
}

@media(prefers-reduced-motion:reduce){
    .hm-words .w > span{transform:none;}
    .home1-page .hero-copy.reveal > *{opacity:1;transform:none;}
}

/* ---------- treatments showcase : photo ---------- */
.hm-show-art{
    display:grid;
    gap:14px;
}
.hm-show-photo{
    position:relative;
    height:170px;
    overflow:hidden;
    border:3px solid rgba(255,255,255,.85);
    border-radius:24px;
    box-shadow:0 18px 36px rgba(30,20,60,.35);
    transform:rotate(-1.5deg);
    transition:opacity .3s ease,transform .5s cubic-bezier(.2,.75,.25,1);
}
.hm-show-photo img{
    width:100%;
    height:100%;
    object-fit:cover;
    animation:hmKen 14s ease-in-out infinite alternate;
}
.hm-show-photo::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,transparent 55%,rgba(30,20,55,.45));
}
.hm-show-panel.is-changing .hm-show-photo{
    opacity:0;
    transform:rotate(1.5deg) scale(.95);
}
@keyframes hmKen{
    from{transform:scale(1);}
    to{transform:scale(1.12);}
}
.hm-show-chip{
    position:absolute;
    left:12px;
    bottom:12px;
    z-index:1;
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:6px 12px;
    border-radius:999px;
    background:rgba(255,255,255,.92);
    color:var(--violet-dark);
    font-size:12px;
    font-weight:800;
    animation:floatCard 4s ease-in-out infinite;
}
.hm-show-chip i{
    font-style:normal;
    color:var(--violet);
}
@media(max-width:640px){
    .hm-show-photo{height:150px;border-radius:20px;}
}
@media(prefers-reduced-motion:reduce){
    .hm-show-photo img,.hm-show-chip{animation:none;}
}


/* =========================================================
   HOME 1 — PRICING PLANS + FAQ
   ========================================================= */

/* ---------- pricing plans ---------- */
.hm-plans{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:22px;
    align-items:stretch;
}

.hm-plan{
    position:relative;
    display:flex;
    flex-direction:column;
    padding:32px 28px 28px;
    border:1px solid var(--border);
    border-radius:var(--radius);
    background:var(--white);
    box-shadow:var(--shadow-soft);
    transition:
        transform .4s cubic-bezier(.2,.75,.25,1),
        box-shadow .4s ease,
        opacity .75s ease;
}

.hm-plan:hover{
    transform:translateY(-8px);
    box-shadow:var(--shadow);
}

.hm-plan.is-featured{
    border-color:var(--violet);
    box-shadow:var(--shadow);
}

.hm-plan-badge{
    position:absolute;
    top:-13px;
    left:50%;
    transform:translateX(-50%);
    padding:6px 16px;
    border-radius:999px;
    background:var(--violet);
    color:#fff;
    font-size:12px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
    white-space:nowrap;
}

.hm-plan h3{
    font-family:var(--serif);
    font-size:24px;
    margin-bottom:4px;
}

.hm-plan-tag{
    color:var(--muted);
    font-size:14px;
}

.hm-plan-price{
    margin:22px 0;
    padding:18px 0;
    border-top:1px solid var(--border);
    border-bottom:1px solid var(--border);
}

.hm-plan-price small{
    display:block;
    margin-bottom:2px;
    color:var(--muted);
    font-size:12px;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.hm-plan-price strong{
    font-family:var(--serif);
    font-size:40px;
    line-height:1.1;
    color:var(--violet);
}

.hm-plan-price span{
    display:block;
    margin-top:2px;
    color:var(--muted);
    font-size:13px;
}

.hm-plan-list{
    flex:1;
    display:grid;
    gap:12px;
    margin-bottom:26px;
    list-style:none;
    padding:0;
}

.hm-plan-list li{
    display:flex;
    align-items:flex-start;
    gap:10px;
    color:var(--ink-soft);
    font-size:14.5px;
    line-height:1.55;
}

.hm-plan-list svg{
    flex:none;
    width:20px;
    height:20px;
    margin-top:1px;
    fill:var(--violet-soft);
    stroke:var(--violet);
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.hm-plan .btn{
    width:100%;
    justify-content:center;
    text-align:center;
}

.hm-plans-note{
    margin-top:28px;
    text-align:center;
    color:var(--muted);
    font-size:13.5px;
}

/* ---------- FAQ accordion ---------- */
.hm-faq-split{
    align-items:start;
}

.hm-faq{
    display:grid;
    gap:14px;
}

.hm-faq-item{
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:20px;
    background:var(--white);
    box-shadow:var(--shadow-soft);
    transition:border-color .3s ease,box-shadow .3s ease;
}

.hm-faq-item.is-open{
    border-color:var(--violet);
    box-shadow:var(--shadow);
}

.hm-faq-item h3{
    margin:0;
    font-family:var(--sans);
}

.hm-faq-q{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    width:100%;
    padding:20px 22px;
    border:0;
    background:none;
    color:var(--ink);
    font:inherit;
    font-size:16px;
    font-weight:700;
    text-align:left;
    cursor:pointer;
}

.hm-faq-q:focus-visible{
    outline:2px solid var(--violet);
    outline-offset:-4px;
    border-radius:20px;
}

.hm-faq-q:hover{color:var(--violet);}

.hm-faq-icon{
    position:relative;
    flex:none;
    width:30px;
    height:30px;
    border-radius:50%;
    background:var(--violet-soft);
    transition:background .3s ease,transform .4s cubic-bezier(.2,.75,.25,1);
}

.hm-faq-icon::before,
.hm-faq-icon::after{
    content:"";
    position:absolute;
    top:50%;
    left:50%;
    width:12px;
    height:2px;
    margin:-1px 0 0 -6px;
    border-radius:2px;
    background:var(--violet);
    transition:transform .4s cubic-bezier(.2,.75,.25,1),background .3s ease;
}

.hm-faq-icon::after{transform:rotate(90deg);}

.hm-faq-item.is-open .hm-faq-icon{background:var(--violet);}
.hm-faq-item.is-open .hm-faq-icon::before,
.hm-faq-item.is-open .hm-faq-icon::after{background:#fff;}
.hm-faq-item.is-open .hm-faq-icon::after{transform:rotate(0deg);}

.hm-faq-a{
    display:grid;
    grid-template-rows:0fr;
    transition:grid-template-rows .45s cubic-bezier(.2,.75,.25,1);
}

.hm-faq-item.is-open .hm-faq-a{grid-template-rows:1fr;}

.hm-faq-a-inner{
    overflow:hidden;
    min-height:0;
}

.hm-faq-a-inner p{
    padding:0 22px 22px;
    color:var(--muted);
    font-size:15px;
    line-height:1.75;
}

@media(max-width:1000px){
    .hm-plans{gap:16px;}
    .hm-plan{padding:30px 22px 24px;}
    .hm-plan-price strong{font-size:34px;}
}

@media(max-width:900px){
    .hm-plans{grid-template-columns:1fr;max-width:480px;margin:0 auto;gap:26px;}
}

@media(max-width:640px){
    .hm-faq-q{padding:18px;font-size:15px;}
    .hm-faq-a-inner p{padding:0 18px 18px;}
}


/* =========================================================
   HOME 1 — HERO (professional)
   ========================================================= */

.home1-page .hm-hero{
    flex-direction:column;
    align-items:stretch;
    justify-content:center;
    min-height:0;
    padding:76px 0 0;
}

.home1-page .hm-hero-main{
    gap:72px;
    grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);
}

.home1-page .hm-hero .hero-copy h1{
    max-width:640px;
    font-size:clamp(44px,5.4vw,72px);
    line-height:1.04;
}
.home1-page .hm-hero .hero-copy > p{
    max-width:560px;
    margin-bottom:32px;
}
.home1-page .hm-hero .hero-buttons .btn{
    min-height:50px;
    padding:0 26px;
    font-size:15px;
}

.hm-hero-points{
    display:flex;
    flex-wrap:wrap;
    gap:12px 26px;
    margin-top:34px;
    padding-top:26px;
    border-top:1px solid var(--border);
    list-style:none;
}
.hm-hero-points li{
    display:flex;
    align-items:center;
    gap:9px;
    color:var(--ink-soft);
    font-size:14px;
    font-weight:600;
}
.hm-hero-points svg{
    flex:none;
    width:20px;
    height:20px;
    fill:var(--violet-soft);
    stroke:var(--violet);
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
}

/* photo */
.home1-page .hm-hero-visual{min-height:0;}
.hm-photo{
    position:relative;
    height:540px;
    overflow:hidden;
    border-radius:32px;
    background:var(--lavender-2);
    box-shadow:var(--shadow);
}
.hm-photo img{
    width:100%;
    height:100%;
    object-fit:cover;
}
.hm-photo::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,transparent 60%,rgba(30,20,55,.22));
}

.hm-fl{
    position:absolute;
    z-index:2;
    display:flex;
    align-items:center;
    gap:12px;
    padding:14px 18px;
    border:1px solid var(--border);
    border-radius:18px;
    background:var(--white);
    box-shadow:var(--shadow-soft);
}
.hm-fl-1{top:36px;left:-28px;}
.hm-fl-2{bottom:40px;right:-24px;}
.hm-fl-icon{
    flex:none;
    display:grid;
    place-items:center;
    width:40px;
    height:40px;
    border-radius:12px;
    background:var(--violet-soft);
    color:var(--violet);
    font-size:18px;
}
.hm-fl-body strong{display:block;font-size:14px;line-height:1.2;color:var(--ink);}
.hm-fl-body span{display:block;margin-top:3px;color:var(--muted);font-size:12.5px;}

/* stats bar */
.hm-hero-bar{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    margin-top:64px;
    margin-bottom:64px;
    padding:26px 10px;
    position:relative;
    z-index:3;
    border:1px solid var(--border);
    border-radius:26px;
    background:var(--white);
    box-shadow:var(--shadow);
}
.hm-hero-stat{
    display:flex;
    flex-direction:column;
    align-items:center;
    padding:4px 12px;
    text-align:center;
    border-inline-start:1px solid var(--border);
}
.hm-hero-stat:first-child{border-inline-start:0;}
.hm-hero-stat strong{
    font-family:var(--serif);
    font-size:clamp(26px,3vw,36px);
    line-height:1;
    color:var(--ink);
}
.hm-hero-stat > span{
    margin-top:9px;
    color:var(--muted);
    font-size:13.5px;
}
.home1-page .hm-hero-stat strong span{
    margin:0;
    font-size:inherit;
    color:inherit;
    font-weight:inherit;
}


@media(max-width:1000px){
    .home1-page .hm-hero-main{gap:48px;}
    .hm-photo{height:480px;}
    .hm-fl-1{left:-12px;}
    .hm-fl-2{right:-10px;}
}
@media(max-width:900px){
    .home1-page .hm-hero{padding-top:52px;}
    .home1-page .hm-hero-main{grid-template-columns:1fr;gap:40px;}
    .hm-photo{height:420px;}
    .hm-hero-bar{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:22px;margin-top:48px;}
    .hm-hero-stat:nth-child(3){border-inline-start:0;}
}
@media(max-width:560px){
    .home1-page .hm-hero{padding-top:38px;}
    .home1-page .hm-hero .hero-buttons .btn{width:100%;}
    .hm-photo{height:340px;border-radius:26px;}
    .hm-fl{padding:10px 12px;gap:9px;border-radius:15px;}
    .hm-fl-icon{width:34px;height:34px;font-size:15px;}
    .hm-fl-1{top:18px;left:8px;}
    .hm-fl-2{bottom:18px;right:8px;}
    .hm-hero-points{flex-direction:column;gap:10px;}
}


/* =========================================================
   HOME 1 — HOW IT WORKS (professional)
   ========================================================= */

.home1-page .hm-process .section-heading{
    margin-inline:auto;
    text-align:center;
}
.home1-page .hm-process .section-heading .section-kicker{justify-content:center;}
.home1-page .hm-process .section-heading p{margin-inline:auto;}

.hm-journey{
    position:relative;
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:24px;
}
.hm-track,
.hm-track-fill{
    position:absolute;
    border-radius:3px;
    pointer-events:none;
}
.hm-track{background:var(--border);}
.hm-track-fill{background:var(--violet);}

.hm-j-step{
    position:relative;
    z-index:2;
    display:flex;
    flex-direction:column;
    align-items:center;
}
.hm-j-icon{
    flex:none;
    display:grid;
    place-items:center;
    width:60px;
    height:60px;
    border:2px solid var(--border);
    border-radius:50%;
    background:var(--white);
    color:var(--violet);
    box-shadow:var(--shadow-soft);
    transition:background .4s ease,color .4s ease,border-color .4s ease;
}
.hm-j-icon svg{
    width:26px;
    height:26px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
}
.hm-j-step.is-on .hm-j-icon{
    border-color:var(--violet);
    background:var(--violet);
    color:#fff;
}

.hm-j-card{
    flex:1;
    width:100%;
    margin-top:22px;
    padding:26px 22px 24px;
    border:1px solid var(--border);
    border-radius:var(--radius);
    background:var(--white);
    box-shadow:var(--shadow-soft);
    transition:transform .35s cubic-bezier(.2,.75,.25,1),box-shadow .35s ease,border-color .35s ease;
}
.hm-j-card:hover{
    transform:translateY(-5px);
    box-shadow:var(--shadow);
}
.hm-j-step.is-on .hm-j-card{border-color:rgba(102,81,168,.35);}

.hm-j-num{
    display:block;
    margin-bottom:8px;
    color:var(--violet);
    font-size:12px;
    font-weight:800;
    letter-spacing:.12em;
    text-transform:uppercase;
}
.hm-j-card h3{
    margin-bottom:10px;
    font-family:var(--serif);
    font-size:23px;
    line-height:1.2;
}
.hm-j-when{
    display:inline-block;
    margin-bottom:14px;
    padding:4px 12px;
    border-radius:999px;
    background:var(--violet-soft);
    color:var(--violet);
    font-size:11.5px;
    font-weight:800;
    letter-spacing:.06em;
    text-transform:uppercase;
}
.hm-j-card p{
    color:var(--muted);
    font-size:14.5px;
    line-height:1.7;
}
.hm-j-points{
    display:grid;
    gap:9px;
    margin-top:18px;
    padding-top:18px;
    border-top:1px solid var(--border);
    list-style:none;
    text-align:left;
}
.hm-j-points li{
    display:flex;
    align-items:flex-start;
    gap:10px;
    color:var(--ink-soft);
    font-size:13.5px;
    line-height:1.5;
}
.hm-j-points li::before{
    content:"✓";
    flex:none;
    display:grid;
    place-items:center;
    width:18px;
    height:18px;
    margin-top:1px;
    border-radius:50%;
    background:var(--violet-soft);
    color:var(--violet);
    font-size:10px;
    font-weight:800;
}

.hm-process-foot{
    margin-top:46px;
    text-align:center;
}

@media(max-width:1000px){
    .hm-journey{gap:16px;}
    .hm-j-card{padding:22px 16px 20px;}
    .hm-j-card h3{font-size:21px;}
}
@media(max-width:900px){
    .hm-journey{grid-template-columns:1fr;gap:20px;}
    .hm-j-step{flex-direction:row;align-items:flex-start;gap:18px;}
    .hm-j-icon{width:52px;height:52px;}
    .hm-j-icon svg{width:22px;height:22px;}
    .hm-j-card{margin-top:0;}
}
@media(prefers-reduced-motion:reduce){
    .hm-j-card:hover{transform:none;}
}

/* align the checklists across all four step cards */
.hm-j-card{display:flex;flex-direction:column;}
.hm-j-card > .hm-j-when{align-self:flex-start;}
.hm-j-card p{flex:1;}
@media(max-width:900px){.hm-j-card{flex:1;}}


/* =========================================================
   ORVI AUTH PAGES — LOGIN / REGISTER (scoped to body.auth-body)
   ========================================================= */

/* AUTH PAGE STYLES: login.html */
body.auth-body {

      --auth-purple: #6651a8;
      --auth-purple-dark: #514087;
      --auth-text: #282435;
      --auth-muted: #777386;
      --auth-border: #e5e1ed;
      --auth-field: #fbfaff;
      --auth-bg: #fff;
      --auth-header-height: 62px;
    
}
body.auth-body {
      margin: 0;
      min-height: 100vh;
      min-height: 100svh;
      color: var(--auth-text);
      background: var(--auth-bg);
      font-family: "DM Sans", sans-serif;
    }
/* Fixed toolbar */
    .auth-topbar {
      position: fixed;
      inset: 0 0 auto;
      z-index: 9999;
      height: var(--auth-header-height);
      padding: 0 clamp(14px, 4vw, 48px);
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      background: var(--auth-bg);
      border-bottom: 1px solid var(--auth-border);
      box-shadow: 0 3px 16px rgba(30, 24, 48, .04);
    }

    .auth-back {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      min-height: 38px;
      padding: 0 13px;
      border: 1px solid var(--auth-border);
      border-radius: 30px;
      background: var(--auth-bg);
      font-size: 12px;
      font-weight: 700;
      white-space: nowrap;
    }

    .auth-controls { display: flex; align-items: center; gap: 8px; }

    .auth-control {
      min-width: 38px;
      height: 38px;
      padding: 0 10px;
      display: grid;
      place-items: center;
      border: 1px solid var(--auth-border);
      border-radius: 30px;
      background: var(--auth-bg);
      color: var(--auth-text);
      font-size: 12px;
      font-weight: 700;
    }

    .auth-back:hover, .auth-control:hover {
      border-color: var(--auth-purple);
      color: var(--auth-purple);
    }

    /* Centered page — no oversized empty columns */
    .auth-page {
      width: 100%;
      min-height: 100vh;
      min-height: 100svh;
      padding: calc(var(--auth-header-height) + 28px) 18px 28px;
      display: grid;
      place-items: center;
    }

    .auth-card {
      width: 100%;
      max-width: 440px;
      margin: 0 auto;
      padding: 34px clamp(22px, 5vw, 38px) 30px;
      border: 1px solid var(--auth-border);
      border-radius: 22px;
      background: var(--auth-bg);
      box-shadow: 0 16px 48px rgba(38, 30, 59, .075);
    }

    .auth-brand {
      width: fit-content;
      display: flex;
      align-items: center;
      gap: 11px;
      margin: 0 auto 28px;
    }

    .auth-mark {
      width: 48px;
      height: 48px;
      flex: 0 0 48px;
      display: grid;
      place-items: center;
      border-radius: 14px;
      background: linear-gradient(145deg, #7864bd, #514087);
      color: #fff;
      box-shadow: 0 7px 18px rgba(102, 81, 168, .2);
    }

    .auth-mark svg {
      width: 27px;
      height: 30px;
      fill: none;
      stroke: currentColor;
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
    }

    .auth-brand strong {
      display: block;
      font-family: "Playfair Display", serif;
      font-size: 27px;
      line-height: 1;
      letter-spacing: .5px;
    }

    .auth-brand small {
      display: block;
      margin-top: 6px;
      color: var(--auth-muted);
      font-size: 8px;
      font-weight: 700;
      letter-spacing: .8px;
    }

    .auth-kicker {
      display: block;
      margin-bottom: 10px;
      color: var(--auth-purple);
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 1.8px;
      text-align: center;
    }

    .auth-card h1 {
      margin: 0;
      font-family: "Playfair Display", serif;
      font-size: clamp(30px, 5vw, 36px);
      font-weight: 600;
      line-height: 1.2;
      text-align: center;
    }

    .auth-intro {
      margin: 11px 0 25px;
      color: var(--auth-muted);
      font-size: 13px;
      line-height: 1.8;
      text-align: center;
    }

    .auth-form { display: grid; gap: 17px; }
    .auth-field { min-width: 0; }

    .auth-field > label {
      display: block;
      margin-bottom: 8px;
      font-size: 12px;
      font-weight: 700;
    }

    .auth-field > input,
    .auth-password input {
      display: block;
      width: 100%;
      height: 49px;
      min-width: 0;
      padding: 0 13px;
      border: 1px solid var(--auth-border);
      border-radius: 10px;
      outline: none;
      background: var(--auth-field);
      color: var(--auth-text);
      font-size: 13px;
      transition: border-color .2s, box-shadow .2s;
    }

    .auth-field input::placeholder { color: #9993a8; }

    .auth-field > input:focus,
    .auth-password input:focus {
      border-color: var(--auth-purple);
      box-shadow: 0 0 0 3px rgba(102, 81, 168, .1);
    }

    .auth-password { position: relative; }

    .auth-password input { padding-right: 62px; }

    .auth-password button {
      position: absolute;
      top: 50%;
      right: 12px;
      transform: translateY(-50%);
      padding: 5px 0 5px 5px;
      border: 0;
      background: transparent;
      color: var(--auth-purple);
      font-size: 11px;
      font-weight: 700;
    }

    .auth-error {
      display: block;
      min-height: 0;
      margin-top: 5px;
      color: #bd3048;
      font-size: 11px;
    }

    .auth-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      flex-wrap: wrap;
      gap: 10px;
      margin-top: -2px;
      font-size: 11px;
    }

    .auth-check {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      color: var(--auth-muted);
    }

    .auth-check input {
      width: 15px;
      height: 15px;
      margin: 0;
      accent-color: var(--auth-purple);
    }

    .auth-forgot, .auth-switch a {
      color: var(--auth-purple);
      font-weight: 700;
    }

    .auth-submit {
      width: 100%;
      min-height: 49px;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      padding: 12px 16px;
      border: 0;
      border-radius: 30px;
      background: var(--auth-purple);
      color: #fff;
      box-shadow: 0 7px 18px rgba(102, 81, 168, .18);
      font-size: 12px;
      font-weight: 700;
      letter-spacing: .5px;
      transition: background .2s, transform .2s;
    }

    .auth-submit:hover {
      background: var(--auth-purple-dark);
      transform: translateY(-1px);
    }

    .auth-message {
      display: none;
      margin: 0;
      padding: 10px 12px;
      border-radius: 9px;
      font-size: 12px;
      line-height: 1.6;
      overflow-wrap: anywhere;
    }

    .auth-message.show { display: block; }
    .auth-message.error { color: #b3263c; background: #fff0f2; }
    .auth-message.success { color: #247342; background: #edf8f0; }

    .auth-switch {
      margin: 21px 0 0;
      color: var(--auth-muted);
      font-size: 12px;
      line-height: 1.7;
      text-align: center;
    }

    .auth-switch a:hover, .auth-forgot:hover { text-decoration: underline; }

    @media (max-width: 480px) {
body.auth-body {
 --auth-header-height: 58px; 
}
.auth-topbar { padding-inline: 10px; }
      .auth-back { min-height: 35px; padding-inline: 10px; font-size: 11px; }
      .auth-control { min-width: 35px; height: 35px; padding-inline: 8px; }
      .auth-controls { gap: 5px; }

      .auth-page {
        padding: calc(var(--auth-header-height) + 18px) 12px 20px;
        place-items: start center;
      }

      .auth-card {
        max-width: 400px;
        padding: 25px 19px 24px;
        border-radius: 17px;
      }

      .auth-brand { margin-bottom: 23px; }
      .auth-brand strong { font-size: 25px; }
      .auth-card h1 { font-size: 31px; }
      .auth-intro { margin-bottom: 22px; }
      .auth-form { gap: 15px; }
    }

    @media (max-width: 340px) {
      .auth-card { padding-inline: 15px; }
      .auth-back { gap: 5px; padding-inline: 8px; }
      .auth-row { font-size: 10px; }
    }

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


/* AUTH PAGE STYLES: register.html */
body.auth-body {

      --auth-purple: #6651a8;
      --auth-purple-dark: #514087;
      --auth-text: #282435;
      --auth-muted: #777386;
      --auth-border: #e5e1ed;
      --auth-field: #fbfaff;
      --auth-bg: #fff;
      --auth-header-height: 62px;
    
}
body.auth-body {
      margin: 0;
      min-height: 100vh;
      min-height: 100svh;
      color: var(--auth-text);
      background: var(--auth-bg);
      font-family: "DM Sans", sans-serif;
    }
.auth-topbar {
      position: fixed;
      inset: 0 0 auto;
      z-index: 9999;
      height: var(--auth-header-height);
      padding: 0 clamp(14px, 4vw, 48px);
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      background: var(--auth-bg);
      border-bottom: 1px solid var(--auth-border);
      box-shadow: 0 3px 16px rgba(30, 24, 48, .04);
    }

    .auth-back {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      min-height: 38px;
      padding: 0 13px;
      border: 1px solid var(--auth-border);
      border-radius: 30px;
      background: var(--auth-bg);
      font-size: 12px;
      font-weight: 700;
      white-space: nowrap;
    }

    .auth-controls { display: flex; align-items: center; gap: 8px; }

    .auth-control {
      min-width: 38px;
      height: 38px;
      padding: 0 10px;
      display: grid;
      place-items: center;
      border: 1px solid var(--auth-border);
      border-radius: 30px;
      background: var(--auth-bg);
      color: var(--auth-text);
      font-size: 12px;
      font-weight: 700;
    }

    .auth-back:hover, .auth-control:hover {
      border-color: var(--auth-purple);
      color: var(--auth-purple);
    }

    /* Compact centered card */
    .auth-page {
      width: 100%;
      min-height: 100vh;
      min-height: 100svh;
      padding: calc(var(--auth-header-height) + 20px) 18px 20px;
      display: grid;
      place-items: center;
    }

    .auth-card {
      width: 100%;
      max-width: 460px;
      margin: 0 auto;
      padding: 27px clamp(22px, 5vw, 38px) 25px;
      border: 1px solid var(--auth-border);
      border-radius: 22px;
      background: var(--auth-bg);
      box-shadow: 0 16px 48px rgba(38, 30, 59, .075);
    }

    .auth-brand {
      width: fit-content;
      display: flex;
      align-items: center;
      gap: 11px;
      margin: 0 auto 21px;
    }

    .auth-mark {
      width: 45px;
      height: 45px;
      flex: 0 0 45px;
      display: grid;
      place-items: center;
      border-radius: 13px;
      background: linear-gradient(145deg, #7864bd, #514087);
      color: #fff;
      box-shadow: 0 7px 18px rgba(102, 81, 168, .2);
    }

    .auth-mark svg {
      width: 27px;
      height: 30px;
      fill: none;
      stroke: currentColor;
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
    }

    .auth-brand strong {
      display: block;
      font-family: "Playfair Display", serif;
      font-size: 26px;
      line-height: 1;
    }

    .auth-brand small {
      display: block;
      margin-top: 6px;
      color: var(--auth-muted);
      font-size: 8px;
      font-weight: 700;
      letter-spacing: .8px;
    }

    .auth-kicker {
      display: block;
      margin-bottom: 8px;
      color: var(--auth-purple);
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 1.8px;
      text-align: center;
    }

    .auth-card h1 {
      margin: 0;
      font-family: "Playfair Display", serif;
      font-size: clamp(29px, 5vw, 34px);
      font-weight: 600;
      line-height: 1.2;
      text-align: center;
    }

    .auth-intro {
      margin: 9px 0 20px;
      color: var(--auth-muted);
      font-size: 12px;
      line-height: 1.7;
      text-align: center;
    }

    .auth-form { display: grid; gap: 12px; }
    .auth-field { min-width: 0; }

    .auth-field > label {
      display: block;
      margin-bottom: 6px;
      font-size: 12px;
      font-weight: 700;
    }

    .auth-field > input,
    .auth-password input {
      display: block;
      width: 100%;
      min-width: 0;
      height: 45px;
      padding: 0 13px;
      border: 1px solid var(--auth-border);
      border-radius: 10px;
      outline: none;
      background: var(--auth-field);
      color: var(--auth-text);
      font-size: 12px;
      transition: border-color .2s, box-shadow .2s;
    }

    .auth-field input::placeholder { color: #9993a8; }

    .auth-field > input:focus,
    .auth-password input:focus {
      border-color: var(--auth-purple);
      box-shadow: 0 0 0 3px rgba(102, 81, 168, .1);
    }

    .auth-password { position: relative; }
    .auth-password input { padding-right: 62px; }

    .auth-password button {
      position: absolute;
      top: 50%;
      right: 12px;
      transform: translateY(-50%);
      padding: 5px 0 5px 5px;
      border: 0;
      background: transparent;
      color: var(--auth-purple);
      font-size: 11px;
      font-weight: 700;
    }

    .auth-error {
      display: block;
      margin-top: 4px;
      color: #bd3048;
      font-size: 10px;
    }

    .auth-terms {
      display: flex;
      align-items: flex-start;
      gap: 8px;
      margin: 1px 0 2px;
      color: var(--auth-muted);
      font-size: 11px;
      line-height: 1.6;
    }

    .auth-terms input {
      width: 15px;
      height: 15px;
      flex-shrink: 0;
      margin: 2px 0 0;
      accent-color: var(--auth-purple);
    }

    .auth-terms a, .auth-switch a {
      color: var(--auth-purple);
      font-weight: 700;
    }

    .auth-submit {
      width: 100%;
      min-height: 47px;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      padding: 11px 16px;
      border: 0;
      border-radius: 30px;
      background: var(--auth-purple);
      color: #fff;
      box-shadow: 0 7px 18px rgba(102, 81, 168, .18);
      font-size: 12px;
      font-weight: 700;
      letter-spacing: .4px;
      transition: background .2s, transform .2s;
    }

    .auth-submit:hover {
      background: var(--auth-purple-dark);
      transform: translateY(-1px);
    }

    .auth-message {
      display: none;
      margin: 0;
      padding: 10px 12px;
      border-radius: 9px;
      font-size: 11px;
      line-height: 1.6;
      overflow-wrap: anywhere;
    }

    .auth-message.show { display: block; }
    .auth-message.error { color: #b3263c; background: #fff0f2; }
    .auth-message.success { color: #247342; background: #edf8f0; }

    .auth-switch {
      margin: 15px 0 0;
      color: var(--auth-muted);
      font-size: 12px;
      line-height: 1.7;
      text-align: center;
    }

    .auth-switch a:hover { text-decoration: underline; }

    @media (max-width: 480px) {
body.auth-body {
 --auth-header-height: 58px; 
}
.auth-topbar { padding-inline: 10px; }
      .auth-back { min-height: 35px; padding-inline: 10px; font-size: 11px; }
      .auth-control { min-width: 35px; height: 35px; padding-inline: 8px; }
      .auth-controls { gap: 5px; }

      .auth-page {
        padding: calc(var(--auth-header-height) + 14px) 12px 16px;
        place-items: start center;
      }

      .auth-card {
        max-width: 410px;
        padding: 22px 18px 21px;
        border-radius: 17px;
      }

      .auth-form { gap: 11px; }
      .auth-intro { margin-bottom: 17px; }
    }

    @media (max-width: 340px) {
      .auth-card { padding-inline: 14px; }
      .auth-back { gap: 5px; padding-inline: 8px; }
    }


/* =========================================================
   ORVI AUTH PAGES — LARGER, MORE BALANCED CARD
   Scoped to login.html and register.html only.
   ========================================================= */
body.auth-body {
  --auth-header-height: 68px;
}
body.auth-body .auth-page {
  box-sizing: border-box;
  width: 100%;
  min-height: 100vh;
  min-height: 100dvh;
  padding: calc(var(--auth-header-height) + 34px) 24px 42px;
  display: grid;
  place-items: center;
}
body.auth-body .auth-card {
  box-sizing: border-box;
  width: min(100%, 600px);
  max-width: 600px;
  margin-inline: auto;
  padding: 46px clamp(30px, 5vw, 58px) 42px;
  border-radius: 28px;
  box-shadow: 0 22px 64px rgba(38, 30, 59, .10);
}
body.auth-body .auth-brand {
  gap: 14px;
  margin-bottom: 32px;
}
body.auth-body .auth-mark {
  width: 58px;
  height: 58px;
  flex-basis: 58px;
  border-radius: 17px;
}
body.auth-body .auth-mark svg {
  width: 32px;
  height: 35px;
}
body.auth-body .auth-brand strong {
  font-size: 32px;
}
body.auth-body .auth-brand small {
  font-size: 9px;
  letter-spacing: 1px;
}
body.auth-body .auth-kicker {
  margin-bottom: 13px;
  font-size: 11px;
  letter-spacing: 2px;
}
body.auth-body .auth-card h1 {
  margin: 0 0 10px;
  font-size: clamp(36px, 4vw, 46px);
  line-height: 1.16;
}
body.auth-body .auth-intro {
  margin-bottom: 30px;
  font-size: 15px;
  line-height: 1.7;
}
body.auth-body .auth-form {
  gap: 20px;
}
body.auth-body .auth-form label,
body.auth-body .auth-label {
  font-size: 14px;
  margin-bottom: 9px;
}
body.auth-body .auth-form input:not([type="checkbox"]),
body.auth-body .auth-input,
body.auth-body .auth-form select {
  width: 100%;
  min-height: 56px;
  padding: 14px 16px;
  font-size: 15px;
  border-radius: 13px;
}
body.auth-body .auth-submit,
body.auth-body .auth-form button[type="submit"] {
  min-height: 56px;
  font-size: 14px;
  border-radius: 999px;
}
body.auth-body .auth-row,
body.auth-body .auth-account-switch,
body.auth-body .auth-footer,
body.auth-body .auth-help {
  font-size: 14px;
}
body.auth-body .auth-account-switch {
  margin-top: 28px;
}
body.auth-body .auth-topbar {
  height: var(--auth-header-height);
  min-height: var(--auth-header-height);
  padding-inline: clamp(16px, 4vw, 56px);
}
body.auth-body .auth-back {
  min-height: 42px;
  padding-inline: 16px;
  font-size: 13px;
}
body.auth-body .auth-control {
  min-width: 42px;
  height: 42px;
  font-size: 13px;
}
@media (max-width: 700px) {
  body.auth-body .auth-page {
    padding: calc(var(--auth-header-height) + 24px) 18px 30px;
    place-items: center;
  }
  body.auth-body .auth-card {
    width: min(100%, 560px);
    padding: 36px clamp(22px, 5vw, 38px) 32px;
    border-radius: 24px;
  }
  body.auth-body .auth-brand { margin-bottom: 27px; }
  body.auth-body .auth-mark {
    width: 52px;
    height: 52px;
    flex-basis: 52px;
  }
  body.auth-body .auth-brand strong { font-size: 29px; }
  body.auth-body .auth-card h1 { font-size: clamp(32px, 7vw, 40px); }
  body.auth-body .auth-intro { margin-bottom: 25px; }
  body.auth-body .auth-form { gap: 17px; }
}
@media (max-width: 420px) {
  body.auth-body { --auth-header-height: 62px; }
  body.auth-body .auth-topbar { padding-inline: 11px; gap: 8px; }
  body.auth-body .auth-back { min-height: 37px; padding-inline: 10px; font-size: 11px; }
  body.auth-body .auth-control { min-width: 36px; height: 36px; padding-inline: 8px; }
  body.auth-body .auth-page { padding: calc(var(--auth-header-height) + 18px) 12px 22px; }
  body.auth-body .auth-card { padding: 29px 20px 26px; border-radius: 20px; }
  body.auth-body .auth-brand { gap: 10px; margin-bottom: 24px; }
  body.auth-body .auth-mark { width: 46px; height: 46px; flex-basis: 46px; }
  body.auth-body .auth-brand strong { font-size: 26px; }
  body.auth-body .auth-brand small { font-size: 7px; letter-spacing: .6px; }
  body.auth-body .auth-card h1 { font-size: 32px; }
  body.auth-body .auth-intro { font-size: 13px; margin-bottom: 22px; }
  body.auth-body .auth-form { gap: 15px; }
  body.auth-body .auth-form input:not([type="checkbox"]),
  body.auth-body .auth-input,
  body.auth-body .auth-form select { min-height: 51px; font-size: 14px; }
  body.auth-body .auth-submit,
  body.auth-body .auth-form button[type="submit"] { min-height: 52px; }
}


/* AUTH PAGES — reduce the gap below the fixed header */
@media (min-width: 701px) {
  body.auth-body .auth-page {
    align-content: start;
    place-items: start center;
    padding-top: calc(var(--auth-header-height) + 14px);
    padding-bottom: 28px;
  }
}
@media (max-width: 700px) {
  body.auth-body .auth-page {
    align-content: start;
    place-items: start center;
    padding-top: calc(var(--auth-header-height) + 14px);
  }
}


/* ORVI AUTH — responsive spacing and visible validation feedback */
body.auth-body .auth-page {
  box-sizing: border-box;
  min-height: 100vh;
  min-height: 100dvh;
  padding: calc(var(--auth-header-height, 68px) + 14px) 20px 28px;
  display: grid;
  align-content: start;
  justify-items: center;
}
body.auth-body .auth-card {
  width: min(100%, 600px);
  min-width: 0;
  box-sizing: border-box;
  margin: 0 auto;
}
body.auth-body .auth-form,
body.auth-body .auth-field,
body.auth-body .auth-password { min-width: 0; }
body.auth-body .auth-field input,
body.auth-body .auth-password input {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
}
body.auth-body .auth-error {
  min-height: 0;
  font-size: 12px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}
body.auth-body input[aria-invalid="true"] {
  border-color: #c8324b !important;
  box-shadow: 0 0 0 2px rgba(200, 50, 75, .12);
}
body.auth-body .auth-terms { align-items: flex-start; }
body.auth-body .auth-terms input { flex: 0 0 auto; margin-top: 4px; }
@media (max-width: 700px) {
  body.auth-body .auth-page {
    padding: calc(var(--auth-header-height, 68px) + 12px) 16px 24px;
  }
  body.auth-body .auth-card { width: min(100%, 560px); padding: 32px clamp(20px, 5vw, 34px) 28px; }
  body.auth-body .auth-topbar { padding-inline: 14px; }
}
@media (max-width: 420px) {
  body.auth-body .auth-page { padding: calc(var(--auth-header-height, 62px) + 10px) 10px 18px; }
  body.auth-body .auth-card { padding: 26px 18px 24px; border-radius: 18px; }
  body.auth-body .auth-topbar { gap: 8px; padding-inline: 10px; }
  body.auth-body .auth-back { max-width: calc(100vw - 130px); }
  body.auth-body .auth-controls { gap: 6px; }
  body.auth-body .auth-control { min-width: 36px; }
  body.auth-body .auth-card h1 { font-size: clamp(28px, 8vw, 34px); }
  body.auth-body .auth-intro { font-size: 13px; }
}

/* ABOUT PAGE — alignment and patient-story visibility refinements */
body:has(#about) .hero-badge{display:inline-flex;align-items:center;justify-content:center;line-height:1.2;min-height:40px;padding:10px 18px;white-space:nowrap;}
body:has(#about) .hero-copy{min-width:0;}
body:has(#about) .hero-copy h1{max-width:680px;text-wrap:balance;}
body:has(#about) .testimonials .testimonial-layout{max-width:1220px;}
body:has(#about) .testimonial-slide{grid-template-columns:minmax(190px,220px) minmax(0,1fr) 0 !important;gap:24px !important;padding-inline:36px !important;}
body:has(#about) .testimonial-slide .patient{min-width:0;width:100%;gap:12px;}
body:has(#about) .testimonial-slide .patient>div:last-child{min-width:0;}
body:has(#about) .testimonial-slide .patient strong,
body:has(#about) .testimonial-slide .patient span{display:block;max-width:100%;overflow-wrap:anywhere;white-space:normal;line-height:1.45;}
body:has(#about) .testimonial-slide>p{grid-column:2 !important;}
@media(max-width:800px){
 body:has(#about) .testimonial-slide{grid-template-columns:minmax(0,1fr) !important;padding:24px 18px !important;}
 body:has(#about) .testimonial-slide .patient{grid-column:1 !important;grid-row:2 !important;justify-content:center !important;}
 body:has(#about) .testimonial-slide>p{grid-column:1 !important;grid-row:1 !important;}
 body:has(#about) .hero-badge{margin-bottom:14px;}
}


/* =========================================================
   PATIENT DASHBOARD — REMOVE EXCESS EMPTY SPACE + REFRESH BOX COLOR
   Scoped to patient dashboard only.
========================================================= */
body.patient-dashboard .dashboard-section {
  min-height: 0 !important;
  height: auto !important;
  margin-bottom: 34px !important;
}
body.patient-dashboard .content {
  min-height: 0 !important;
  padding-bottom: 42px !important;
}
body.patient-dashboard .dashboard-section > * {
  min-height: 0;
}
/* Patient dashboard payment panel — use ORVI's established violet brand palette. */
body.patient-dashboard .payment-summary {
  background: linear-gradient(135deg, #6651A8 0%, #4D3B86 100%) !important;
  color: #FFFFFF !important;
  border-color: rgba(255,255,255,.18) !important;
}
body.patient-dashboard .payment-summary .eyebrow,
body.patient-dashboard .payment-summary h2,
body.patient-dashboard .payment-summary p,
body.patient-dashboard .payment-summary .amount-block,
body.patient-dashboard .payment-summary .amount-block span,
body.patient-dashboard .payment-summary .amount-block strong,
body.patient-dashboard .payment-summary .payment-progress,
body.patient-dashboard .payment-summary .payment-progress-head {
  color: #FFFFFF !important;
}
body.patient-dashboard .payment-summary .payment-progress-line {
  background: rgba(255,255,255,.24) !important;
}
body.patient-dashboard .payment-summary .payment-progress-line span {
  background: #FFFFFF !important;
}
@media (max-width: 900px) {
  body.patient-dashboard .dashboard-section { margin-bottom: 26px !important; }
}


/* =========================================================
   ORVI FINAL RESPONSIVE + DASHBOARD READABILITY PATCH
   Home 2 intentionally left untouched as requested.
   ========================================================= */
@media (max-width: 900px) {
  body.patient-dashboard .sidebar,
  body.admin-dashboard .sidebar {
    position: fixed !important;
    inset: 0 auto 0 0 !important;
    width: min( min(86vw, 320px), calc(100vw - 48px)) !important;
    max-width: calc(100vw - 48px) !important;
    height: 100dvh !important;
    overflow-y: auto !important;
    z-index: 2001 !important;
    transform: translateX(-110%) !important;
    visibility: hidden;
    pointer-events: none;
    transition: transform .25s ease, visibility .25s ease;
  }
  body.patient-dashboard .sidebar.open,
  body.admin-dashboard .sidebar.open {
    transform: translateX(0) !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }
  body.patient-dashboard #sidebarOverlay,
  body.admin-dashboard #overlay,
  body.admin-dashboard #sidebarOverlay {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2000 !important;
    background: rgba(12, 16, 24, .58) !important;
    display: block;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }
  body.patient-dashboard #sidebarOverlay.active,
  body.admin-dashboard #overlay.active,
  body.admin-dashboard #sidebarOverlay.active {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }
  body.patient-dashboard .mobile-menu-btn,
  body.admin-dashboard .mobile-menu {
    display: inline-grid !important;
    flex: 0 0 auto;
    place-items: center;
    position: relative;
    z-index: 1202;
    cursor: pointer;
  }
  body.patient-dashboard .main-content,
  body.admin-dashboard .main-content,
  body.patient-dashboard .dashboard-main,
  body.admin-dashboard .dashboard-main {
    width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
  }
  body.patient-dashboard .topbar,
  body.admin-dashboard .topbar {
    padding-left: clamp(12px, 3vw, 24px) !important;
    padding-right: clamp(12px, 3vw, 24px) !important;
    gap: 10px;
  }
}

/* All dashboard text stays comfortably above 12px. */
body.patient-dashboard,
body.admin-dashboard { font-size: 14px; }
body.patient-dashboard .sidebar-nav .nav-item,
body.admin-dashboard .sidebar-nav .nav-item { font-size: 14px !important; }
body.patient-dashboard .page-heading small,
body.admin-dashboard .page-title small,
body.patient-dashboard .muted,
body.admin-dashboard .muted,
body.patient-dashboard .stat-label,
body.admin-dashboard .stat-label,
body.patient-dashboard .table th,
body.admin-dashboard .table th,
body.patient-dashboard .table td,
body.admin-dashboard .table td,
body.patient-dashboard .form-label,
body.admin-dashboard .form-label,
body.patient-dashboard label,
body.admin-dashboard label,
body.patient-dashboard .status,
body.admin-dashboard .status,
body.patient-dashboard .badge,
body.admin-dashboard .badge,
body.patient-dashboard .helper-text,
body.admin-dashboard .helper-text {
  font-size: 13px !important;
  line-height: 1.45;
}
body.patient-dashboard input,
body.patient-dashboard select,
body.patient-dashboard textarea,
body.patient-dashboard button,
body.admin-dashboard input,
body.admin-dashboard select,
body.admin-dashboard textarea,
body.admin-dashboard button { font-size: 14px; }
body.patient-dashboard .table-wrap,
body.admin-dashboard .table-wrap,
body.patient-dashboard .table-responsive,
body.admin-dashboard .table-responsive {
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
body.patient-dashboard img,
body.admin-dashboard img,
body.patient-dashboard svg,
body.admin-dashboard svg { max-width: 100%; }

/* Make links and controls reliably tappable on narrow touch screens. */
@media (max-width: 600px) {
  body.patient-dashboard .topbar-actions,
  body.admin-dashboard .topbar-actions { gap: 6px !important; }
  body.patient-dashboard .round-control,
  body.admin-dashboard .circle-btn,
  body.patient-dashboard .about-style-control,
  body.admin-dashboard .about-style-control { min-width: 40px; min-height: 40px; }
  body.patient-dashboard .content,
  body.admin-dashboard .content,
  body.patient-dashboard .main-content,
  body.admin-dashboard .main-content { padding-left: 12px !important; padding-right: 12px !important; }
  body.patient-dashboard .card,
  body.admin-dashboard .card,
  body.patient-dashboard .panel,
  body.admin-dashboard .panel { min-width: 0; max-width: 100%; }
  body.patient-dashboard table,
  body.admin-dashboard table { min-width: 560px; }
}


/* =========================================================
   ORVI DASHBOARD MOBILE BRAND + LOGOUT REDIRECT FIX
   Applies to both patient and admin dashboards.
========================================================= */
body.patient-dashboard .sidebar-brand.dashboard-brand,
body.admin-dashboard .sidebar-brand.dashboard-brand{
    display:flex !important;
    align-items:center !important;
    visibility:visible !important;
    opacity:1 !important;
    flex-shrink:0 !important;
    overflow:visible !important;
    position:relative !important;
    z-index:2 !important;
}
body.patient-dashboard .sidebar-brand.dashboard-brand .dashboard-about-brand,
body.admin-dashboard .sidebar-brand.dashboard-brand .dashboard-about-brand{
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
    width:100% !important;
    min-width:0 !important;
    visibility:visible !important;
    opacity:1 !important;
    text-decoration:none !important;
}
body.patient-dashboard .dashboard-about-brand .brand-mark,
body.admin-dashboard .dashboard-about-brand .brand-mark{
    display:grid !important;
    place-items:center !important;
    flex:0 0 42px !important;
    width:42px !important;
    height:42px !important;
    min-width:42px !important;
    visibility:visible !important;
    opacity:1 !important;
}
body.patient-dashboard .dashboard-about-brand .brand-tooth,
body.admin-dashboard .dashboard-about-brand .brand-tooth{
    display:block !important;
    width:24px !important;
    height:27px !important;
    visibility:visible !important;
}
body.patient-dashboard .dashboard-about-brand .brand-text,
body.admin-dashboard .dashboard-about-brand .brand-text{
    display:flex !important;
    flex:1 1 auto !important;
    flex-direction:column !important;
    min-width:0 !important;
    visibility:visible !important;
    opacity:1 !important;
}
@media(max-width:560px){
    body.patient-dashboard .sidebar-brand.dashboard-brand,
    body.admin-dashboard .sidebar-brand.dashboard-brand{
        min-height:72px !important;
        height:auto !important;
        padding:8px 10px 14px !important;
    }
    body.patient-dashboard .dashboard-about-brand .brand-sub,
    body.admin-dashboard .dashboard-about-brand .brand-sub{
        display:block !important;
        font-size:9px !important;
        line-height:1.25 !important;
        white-space:normal !important;
        overflow-wrap:anywhere !important;
    }
}


/* =========================================================
   ORVI DASHBOARD MOBILE SIDEBAR BRAND + READABILITY FIX
   Applied to both Patient and Admin dashboards
   ========================================================= */
body.patient-dashboard .sidebar .sidebar-brand.dashboard-brand,
body.admin-dashboard .sidebar .sidebar-brand.dashboard-brand {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 100% !important;
  min-height: 76px;
  align-items: center !important;
  justify-content: flex-start !important;
  padding: 18px 18px 16px !important;
  margin: 0 0 12px !important;
  flex-shrink: 0 !important;
  overflow: visible !important;
  border-bottom: 1px solid var(--border-color, rgba(100,116,139,.2));
}
body.patient-dashboard .sidebar .dashboard-about-brand,
body.admin-dashboard .sidebar .dashboard-about-brand {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  align-items: center !important;
  gap: 11px !important;
  width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  color: var(--text-primary, inherit) !important;
  text-decoration: none !important;
  overflow: visible !important;
}
body.patient-dashboard .sidebar .dashboard-about-brand .brand-mark,
body.admin-dashboard .sidebar .dashboard-about-brand .brand-mark {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 42px !important;
}
body.patient-dashboard .sidebar .dashboard-about-brand .brand-tooth,
body.admin-dashboard .sidebar .dashboard-about-brand .brand-tooth {
  display: block !important;
  width: 28px !important;
  height: 32px !important;
  max-width: none !important;
  fill: currentColor;
  visibility: visible !important;
  opacity: 1 !important;
}
body.patient-dashboard .sidebar .dashboard-about-brand .brand-text,
body.admin-dashboard .sidebar .dashboard-about-brand .brand-text {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  flex-direction: column !important;
  gap: 2px !important;
  min-width: 0 !important;
  overflow: visible !important;
}
body.patient-dashboard .sidebar .dashboard-about-brand .brand-name,
body.admin-dashboard .sidebar .dashboard-about-brand .brand-name {
  display: block !important;
  font-size: 21px !important;
  line-height: 1.15 !important;
  font-weight: 800 !important;
  letter-spacing: .02em;
}
body.patient-dashboard .sidebar .dashboard-about-brand .brand-sub,
body.admin-dashboard .sidebar .dashboard-about-brand .brand-sub {
  display: block !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
  font-weight: 600 !important;
  white-space: normal !important;
}

/* Increase dashboard text size and weight for comfortable reading. */
body.patient-dashboard .sidebar .nav-label,
body.admin-dashboard .sidebar .nav-label {
  font-size: 13px !important;
  font-weight: 800 !important;
  letter-spacing: .09em !important;
}
body.patient-dashboard .sidebar .nav-item,
body.admin-dashboard .sidebar .nav-item,
body.patient-dashboard .sidebar .logout-btn,
body.admin-dashboard .sidebar .logout-btn {
  font-size: 15px !important;
  font-weight: 650 !important;
  line-height: 1.45 !important;
}
body.patient-dashboard .sidebar,
body.admin-dashboard .sidebar {
  font-size: 15px !important;
  font-weight: 500;
}
body.patient-dashboard .dashboard-main,
body.admin-dashboard .dashboard-main,
body.patient-dashboard .main-content,
body.admin-dashboard .main-content,
body.patient-dashboard .dashboard-content,
body.admin-dashboard .dashboard-content {
  font-size: 15px;
}
body.patient-dashboard .dashboard-main h1,
body.admin-dashboard .dashboard-main h1,
body.patient-dashboard .main-content h1,
body.admin-dashboard .main-content h1,
body.patient-dashboard .dashboard-content h1,
body.admin-dashboard .dashboard-content h1 {
  font-size: clamp(25px, 2.2vw, 32px) !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
}
body.patient-dashboard .dashboard-main h2,
body.admin-dashboard .dashboard-main h2,
body.patient-dashboard .main-content h2,
body.admin-dashboard .main-content h2,
body.patient-dashboard .dashboard-content h2,
body.admin-dashboard .dashboard-content h2 {
  font-size: clamp(19px, 1.6vw, 23px) !important;
  font-weight: 750 !important;
  line-height: 1.3 !important;
}
body.patient-dashboard .dashboard-main h3,
body.admin-dashboard .dashboard-main h3,
body.patient-dashboard .main-content h3,
body.admin-dashboard .main-content h3,
body.patient-dashboard .dashboard-content h3,
body.admin-dashboard .dashboard-content h3 {
  font-size: 17px !important;
  font-weight: 750 !important;
}
body.patient-dashboard .dashboard-main p,
body.admin-dashboard .dashboard-main p,
body.patient-dashboard .main-content p,
body.admin-dashboard .main-content p,
body.patient-dashboard .dashboard-content p,
body.admin-dashboard .dashboard-content p,
body.patient-dashboard .dashboard-main label,
body.admin-dashboard .dashboard-main label,
body.patient-dashboard .main-content label,
body.admin-dashboard .main-content label,
body.patient-dashboard .dashboard-content label,
body.admin-dashboard .dashboard-content label {
  font-size: 14px !important;
  font-weight: 500;
  line-height: 1.55;
}
body.patient-dashboard .dashboard-main button,
body.admin-dashboard .dashboard-main button,
body.patient-dashboard .main-content button,
body.admin-dashboard .main-content button,
body.patient-dashboard .dashboard-content button,
body.admin-dashboard .dashboard-content button,
body.patient-dashboard .dashboard-main input,
body.admin-dashboard .dashboard-main input,
body.patient-dashboard .dashboard-main select,
body.admin-dashboard .dashboard-main select,
body.patient-dashboard .dashboard-main textarea,
body.admin-dashboard .dashboard-main textarea {
  font-size: 14px;
  font-weight: 600;
}
@media (max-width: 900px) {
  body.patient-dashboard .sidebar .sidebar-brand.dashboard-brand,
  body.admin-dashboard .sidebar .sidebar-brand.dashboard-brand {
    display: flex !important;
    min-height: 82px !important;
    padding: 20px 18px 16px !important;
  }
  body.patient-dashboard .sidebar .dashboard-about-brand .brand-name,
  body.admin-dashboard .sidebar .dashboard-about-brand .brand-name {
    font-size: 22px !important;
  }
  body.patient-dashboard .sidebar .dashboard-about-brand .brand-sub,
  body.admin-dashboard .sidebar .dashboard-about-brand .brand-sub {
    font-size: 12px !important;
  }
  body.patient-dashboard .sidebar .nav-item,
  body.admin-dashboard .sidebar .nav-item,
  body.patient-dashboard .sidebar .logout-btn,
  body.admin-dashboard .sidebar .logout-btn {
    min-height: 48px;
    font-size: 15px !important;
    font-weight: 650 !important;
  }
}


/* ORVI RESPONSIVE DASHBOARD NAVIGATION VISIBILITY FIX */
@media (max-width: 900px) {
  body.patient-dashboard #sidebar.open,
  body.admin-dashboard #sidebar.open {
    visibility: visible !important; opacity: 1 !important; pointer-events: auto !important;
    transform: translateX(0) !important; z-index: 2002 !important;
  }
  body.patient-dashboard #sidebarOverlay.active,
  body.admin-dashboard #overlay.show {
    visibility: visible !important; opacity: 1 !important; pointer-events: auto !important;
    z-index: 2001 !important;
  }
  body.patient-dashboard .sidebar .nav-item,
  body.admin-dashboard .sidebar .nav-item {
    min-height: 46px; cursor: pointer; touch-action: manipulation;
  }
}


/* =========================================================
   ORVI DASHBOARD FINAL OVERRIDE — BRAND + READABILITY
   ========================================================= */
body.patient-dashboard .sidebar .sidebar-brand.dashboard-brand,
body.admin-dashboard .sidebar .sidebar-brand.dashboard-brand {
  display:flex !important; visibility:visible !important; opacity:1 !important;
  align-items:center !important; min-height:84px !important; height:auto !important;
  padding:18px 18px 20px !important; margin:0 !important;
  overflow:visible !important; flex-shrink:0 !important;
  border-bottom:1px solid var(--border-color, rgba(120,120,140,.18)) !important;
}
body.patient-dashboard .sidebar .dashboard-about-brand,
body.admin-dashboard .sidebar .dashboard-about-brand {
  display:flex !important; visibility:visible !important; opacity:1 !important;
  align-items:center !important; gap:12px !important; width:100% !important;
  min-width:0 !important; color:inherit !important; text-decoration:none !important;
}
body.patient-dashboard .sidebar .dashboard-about-brand .brand-mark,
body.admin-dashboard .sidebar .dashboard-about-brand .brand-mark {
  display:grid !important; place-items:center !important; flex:0 0 44px !important;
  width:44px !important; height:44px !important; visibility:visible !important; opacity:1 !important;
  border-radius:13px !important; background:var(--primary, #6d4aa0) !important;
}
body.patient-dashboard .sidebar .dashboard-about-brand .brand-tooth,
body.admin-dashboard .sidebar .dashboard-about-brand .brand-tooth {
  display:block !important; width:27px !important; height:30px !important;
  fill:none !important; stroke:#fff !important; stroke-width:1.8 !important;
  visibility:visible !important; opacity:1 !important;
}
body.patient-dashboard .sidebar .dashboard-about-brand .brand-text,
body.admin-dashboard .sidebar .dashboard-about-brand .brand-text {
  display:flex !important; flex-direction:column !important; gap:3px !important;
  min-width:0 !important; visibility:visible !important; opacity:1 !important;
}
body.patient-dashboard .sidebar .dashboard-about-brand .brand-name,
body.admin-dashboard .sidebar .dashboard-about-brand .brand-name {
  display:block !important; font-size:25px !important; line-height:1.1 !important;
  font-weight:800 !important; letter-spacing:.04em !important; visibility:visible !important;
}
body.patient-dashboard .sidebar .dashboard-about-brand .brand-sub,
body.admin-dashboard .sidebar .dashboard-about-brand .brand-sub {
  display:block !important; font-size:13px !important; line-height:1.35 !important;
  font-weight:600 !important; white-space:normal !important; visibility:visible !important;
}
body.patient-dashboard .sidebar, body.admin-dashboard .sidebar {
  overflow-y:auto !important; overscroll-behavior:contain !important;
}
body.patient-dashboard .sidebar .nav-label, body.admin-dashboard .sidebar .nav-label {
  font-size:14px !important; font-weight:800 !important; letter-spacing:.1em !important;
}
body.patient-dashboard .sidebar .nav-item, body.admin-dashboard .sidebar .nav-item,
body.patient-dashboard .sidebar .logout-btn, body.admin-dashboard .sidebar .logout-btn {
  font-size:16px !important; font-weight:700 !important; line-height:1.45 !important;
  min-height:48px !important;
}
body.patient-dashboard .dashboard-main, body.admin-dashboard .dashboard-main,
body.patient-dashboard .main-content, body.admin-dashboard .main-content,
body.patient-dashboard .dashboard-content, body.admin-dashboard .dashboard-content {
  font-size:16px !important;
}
body.patient-dashboard .dashboard-main h1, body.admin-dashboard .dashboard-main h1,
body.patient-dashboard .main-content h1, body.admin-dashboard .main-content h1 {
  font-size:clamp(27px, 3vw, 34px) !important; font-weight:800 !important; line-height:1.2 !important;
}
body.patient-dashboard .dashboard-main h2, body.admin-dashboard .dashboard-main h2,
body.patient-dashboard .main-content h2, body.admin-dashboard .main-content h2 {
  font-size:23px !important; font-weight:800 !important; line-height:1.3 !important;
}
body.patient-dashboard .dashboard-main p, body.admin-dashboard .dashboard-main p,
body.patient-dashboard .main-content p, body.admin-dashboard .main-content p,
body.patient-dashboard .dashboard-main label, body.admin-dashboard .dashboard-main label,
body.patient-dashboard .main-content label, body.admin-dashboard .main-content label {
  font-size:15px !important; font-weight:500 !important; line-height:1.6 !important;
}
@media (max-width:900px) {
  body.patient-dashboard #sidebar.open, body.admin-dashboard #sidebar.open {
    display:flex !important; visibility:visible !important; opacity:1 !important;
    transform:translateX(0) !important; z-index:9999 !important;
  }
  body.patient-dashboard #sidebar .sidebar-brand.dashboard-brand,
  body.admin-dashboard #sidebar .sidebar-brand.dashboard-brand { display:flex !important; }
}


/* ORVI MOBILE PAGE NAVIGATION FIX — REAL PAGE ROUTES + TAP ACCESS */
@media (max-width: 900px) {
  .mobile-panel { position: absolute; z-index: 5000 !important; pointer-events: auto !important; }
  .mobile-panel a, .mobile-panel button, .mobile-home-links a, .mobile-dashboard-links a {
    pointer-events: auto !important; touch-action: manipulation; cursor: pointer;
  }
  .mobile-panel a { display: flex; position: relative; z-index: 5001; min-height: 44px; align-items: center; }
  .mobile-home-links, .mobile-dashboard-links { position: relative; z-index: 5001; }
}


/* =========================================================
   HOME 2 PAGE — SECTIONS 1–3
   (scoped to .home2-page; colours, type sizes, radii and
   breakpoints follow Home 1 / About)
   ========================================================= */

/* ---------- shared bits ---------- */
.h2-center{
    max-width:760px;
    margin-inline:auto;
    text-align:center;
}
.h2-center .section-kicker{justify-content:center;}
.h2-center p{margin-inline:auto;}

.h2-flip{display:inline-block;}

.home2-page img.is-broken{
    visibility:hidden;
}
.home2-page .is-broken-wrap{
    background:
        radial-gradient(circle at 30% 20%,rgba(102,81,168,.35),transparent 55%),
        linear-gradient(135deg,var(--lavender-2),var(--violet-soft));
}

/* ---------- SECTION 1 : HERO ---------- */
.home2-page .h2-hero{
    flex-direction:column;
    align-items:stretch;
    justify-content:center;
    min-height:0;
    padding:76px 0 0;
}
.home2-page .h2-hero-main{
    gap:64px;
    grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);
    padding-bottom:72px;
}
.home2-page .h2-hero .hero-copy h1{
    max-width:640px;
    font-size:clamp(44px,5.4vw,70px);
    line-height:1.04;
}
.home2-page .h2-hero .hero-copy h1 span{display:block;}
.home2-page .h2-hero .hero-copy > p{
    max-width:560px;
    margin-bottom:32px;
}
.home2-page .h2-hero .hero-buttons .btn{
    min-height:50px;
    padding:0 26px;
    font-size:15px;
}

.h2-proof{
    display:flex;
    align-items:center;
    gap:16px;
    margin-top:34px;
    padding-top:26px;
    border-top:1px solid var(--border);
}
.h2-avatars{display:flex;flex:none;}
.h2-avatars img{
    width:42px;
    height:42px;
    margin-inline-start:-12px;
    border:3px solid var(--paper);
    border-radius:50%;
    object-fit:cover;
    background:var(--lavender-2);
    box-shadow:0 4px 10px rgba(58,44,92,.12);
}
.h2-avatars img:first-child{margin-inline-start:0;}
.h2-proof-text strong{
    display:block;
    color:var(--ink);
    font-size:15px;
    line-height:1.3;
}
.h2-proof-text strong em{
    margin-inline-end:6px;
    color:#e9a83b;
    font-style:normal;
    letter-spacing:2px;
}
.h2-proof-text span{
    display:block;
    margin-top:3px;
    color:var(--muted);
    font-size:13.5px;
}

/* visual collage */
.home2-page .h2-hero-visual{
    position:relative;
    height:560px;
    min-height:0;
}
.h2-arch{
    position:absolute;
    inset-block:0;
    inset-inline:0 64px;
    overflow:hidden;
    border-radius:240px 240px 32px 32px;
    background:var(--lavender-2);
    box-shadow:var(--shadow);
    clip-path:inset(100% 0 0 0 round 240px 240px 32px 32px);
    transition:clip-path 1.3s cubic-bezier(.2,.75,.25,1) .15s;
}
.reveal.visible .h2-arch{
    clip-path:inset(0 0 0 0 round 240px 240px 32px 32px);
}
.h2-arch img{
    width:100%;
    height:100%;
    object-fit:cover;
    transform:scale(1.18);
    transition:transform 2.2s cubic-bezier(.2,.75,.25,1) .15s;
}
.reveal.visible .h2-arch img{transform:scale(1);}
.h2-arch::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,transparent 58%,rgba(30,20,55,.28));
}

.h2-orbit{
    position:absolute;
    top:34px;
    inset-inline-end:0;
    z-index:2;
    width:172px;
    height:172px;
    overflow:hidden;
    border:6px solid var(--paper);
    border-radius:50%;
    background:var(--lavender-2);
    box-shadow:var(--shadow);
    animation:h2Float 5.5s ease-in-out infinite;
    translate:calc(var(--px,0) * 18px) calc(var(--py,0) * 14px);
    transition:translate .35s ease-out;
}
.h2-orbit img{width:100%;height:100%;object-fit:cover;}

.h2-seal{
    position:absolute;
    inset-inline-end:10px;
    bottom:92px;
    z-index:3;
    display:grid;
    place-items:center;
    width:124px;
    height:124px;
    border-radius:50%;
    background:var(--violet);
    color:#fff;
    box-shadow:0 18px 40px rgba(102,81,168,.35);
    translate:calc(var(--px,0) * -12px) calc(var(--py,0) * -10px);
    transition:translate .35s ease-out;
}
.h2-seal svg.ring{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    animation:h2Spin 16s linear infinite;
}
.h2-seal svg.ring text{
    fill:#fff;
    font-size:10.5px;
    font-weight:700;
    letter-spacing:.14em;
}
.h2-seal .tooth{
    position:relative;
    width:34px;
    height:38px;
    fill:#fff;
    stroke:none;
}

.h2-fl{
    position:absolute;
    z-index:3;
    display:flex;
    align-items:center;
    gap:12px;
    padding:14px 18px;
    border:1px solid var(--border);
    border-radius:18px;
    background:var(--white);
    box-shadow:var(--shadow-soft);
    translate:calc(var(--px,0) * -10px) calc(var(--py,0) * 8px);
    transition:translate .35s ease-out;
}
.h2-fl-slot{
    top:70px;
    inset-inline-start:-30px;
    animation:h2Float 6s ease-in-out -2s infinite;
}
.h2-fl-prog{
    bottom:38px;
    inset-inline-start:-18px;
    min-width:236px;
    flex-direction:column;
    align-items:stretch;
    gap:10px;
    animation:h2Float 6.5s ease-in-out -4s infinite;
}
.h2-live{
    position:relative;
    flex:none;
    width:12px;
    height:12px;
    border-radius:50%;
    background:#35b779;
}
.h2-live::after{
    content:"";
    position:absolute;
    inset:0;
    border-radius:50%;
    background:#35b779;
    animation:h2Ping 2s ease-out infinite;
}
.h2-fl-body strong{display:block;font-size:14px;line-height:1.2;color:var(--ink);}
.h2-fl-body span{display:block;margin-top:3px;color:var(--muted);font-size:12.5px;}
.h2-prog-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    font-size:14px;
    font-weight:700;
    color:var(--ink);
}
.h2-prog-head b{color:var(--violet);font-family:var(--serif);font-size:18px;}
.h2-prog-bar{
    height:8px;
    overflow:hidden;
    border-radius:999px;
    background:var(--lavender-2);
}
.h2-prog-bar i{
    display:block;
    height:100%;
    width:82%;
    border-radius:inherit;
    background:linear-gradient(90deg,var(--violet),#b49cf2);
    transform:scaleX(0);
    transform-origin:left;
    transition:transform 2.2s cubic-bezier(.2,.75,.25,1) 1s;
}
.reveal.visible .h2-prog-bar i{transform:scaleX(1);}
.h2-prog-sub{color:var(--muted);font-size:12.5px;}

@keyframes h2Float{
    0%,100%{transform:translateY(0);}
    50%{transform:translateY(-12px);}
}
@keyframes h2Spin{to{transform:rotate(360deg);}}
@keyframes h2Ping{
    0%{transform:scale(1);opacity:.7;}
    100%{transform:scale(3.2);opacity:0;}
}

/* marquee band */
.h2-marquee{
    position:relative;
    z-index:3;
    overflow:hidden;
    direction:ltr;
    padding:17px 0;
    background:linear-gradient(90deg,var(--violet-dark),var(--violet),var(--violet-dark));
    color:#fff;
}
.h2-marquee-track{
    display:flex;
    width:max-content;
    animation:h2Marquee 42s linear infinite;
}
.h2-marquee:hover .h2-marquee-track{animation-play-state:paused;}
.h2-marquee-group{
    display:flex;
    flex:none;
    align-items:center;
}
.h2-marquee-group span{
    display:inline-flex;
    align-items:center;
    gap:26px;
    padding-inline-end:26px;
    font-size:13px;
    font-weight:800;
    letter-spacing:.14em;
    text-transform:uppercase;
    white-space:nowrap;
}
.h2-marquee-group span::after{
    content:"✦";
    color:#cbbdf5;
    font-size:12px;
}
@keyframes h2Marquee{
    from{transform:translateX(0);}
    to{transform:translateX(-50%);}
}

/* ---------- SECTION 2 : SMILE FINDER ---------- */
.h2-finder{overflow:hidden;}
.h2-finder .section-heading{margin-bottom:46px;}
.h2-finder-grid{
    display:grid;
    grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);
    gap:28px;
    align-items:stretch;
}
.h2-concerns{
    display:flex;
    flex-direction:column;
    gap:12px;
}
.h2-concern{
    position:relative;
    flex:1;
    display:flex;
    align-items:center;
    gap:16px;
    padding:16px 18px;
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:20px;
    background:var(--white);
    color:var(--ink);
    text-align:start;
    box-shadow:var(--shadow-soft);
    transition:transform .35s cubic-bezier(.2,.75,.25,1),border-color .3s ease,background .3s ease,box-shadow .3s ease;
}
.h2-concern:hover{
    transform:translateX(6px);
    border-color:rgba(102,81,168,.38);
}
.h2-concern.is-active{
    border-color:var(--violet);
    background:var(--violet-soft);
    box-shadow:var(--shadow);
}
.h2-c-icon{
    flex:none;
    display:grid;
    place-items:center;
    width:48px;
    height:48px;
    border-radius:15px;
    background:var(--violet-soft);
    color:var(--violet);
    transition:background .3s ease,color .3s ease,transform .4s cubic-bezier(.2,.75,.25,1);
}
.h2-concern.is-active .h2-c-icon{
    background:var(--violet);
    color:#fff;
    transform:rotate(-8deg) scale(1.06);
}
.h2-c-icon svg{
    width:24px;
    height:24px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
}
.h2-c-txt{min-width:0;}
.h2-c-txt strong{
    display:block;
    font-size:16px;
    line-height:1.25;
}
.h2-c-txt small{
    display:block;
    margin-top:3px;
    color:var(--muted);
    font-size:13px;
}
.h2-c-arrow{
    margin-inline-start:auto;
    flex:none;
    color:var(--violet);
    font-size:18px;
    opacity:0;
    transform:translateX(-8px);
    transition:opacity .3s ease,transform .3s ease;
}
.h2-concern.is-active .h2-c-arrow,
.h2-concern:hover .h2-c-arrow{
    opacity:1;
    transform:none;
}
.h2-progress{
    position:absolute;
    inset-inline:0;
    bottom:0;
    height:3px;
    background:var(--violet);
    transform:scaleX(0);
    transform-origin:left;
}
.h2-concern.is-active .h2-progress{animation:h2Fill 7s linear forwards;}
.h2-finder-grid.is-paused .h2-concern.is-active .h2-progress{animation-play-state:paused;}
@keyframes h2Fill{to{transform:scaleX(1);}}

.h2-result{
    display:grid;
    grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:28px;
    background:var(--white);
    box-shadow:var(--shadow);
}
.h2-result-img{
    position:relative;
    min-height:440px;
    overflow:hidden;
    background:var(--lavender-2);
}
.h2-result-img img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    transform:scale(1.04);
    transition:opacity .45s ease,transform 1.6s cubic-bezier(.2,.75,.25,1);
}
.h2-result.is-swap .h2-result-img img{
    opacity:0;
    transform:scale(1.14);
}
.h2-result-img::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,transparent 55%,rgba(30,20,55,.32));
}
.h2-result-chip{
    position:absolute;
    z-index:2;
    inset-inline:16px auto;
    bottom:16px;
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:9px 14px;
    border-radius:999px;
    background:rgba(255,255,255,.92);
    color:#272238;
    font-size:12.5px;
    font-weight:800;
    letter-spacing:.04em;
}
.h2-result-chip i{color:var(--violet);font-style:normal;}

.h2-result-body{
    display:flex;
    flex-direction:column;
    gap:15px;
    padding:34px 32px;
    transition:opacity .3s ease,transform .45s cubic-bezier(.2,.75,.25,1);
}
.h2-result.is-swap .h2-result-body{
    opacity:0;
    transform:translateY(14px);
}
.h2-tag{
    align-self:flex-start;
    padding:6px 12px;
    border-radius:999px;
    background:var(--violet-soft);
    color:var(--violet);
    font-size:12px;
    font-weight:800;
    letter-spacing:.1em;
    text-transform:uppercase;
}
.h2-result-body h3{
    font-family:var(--serif);
    font-size:clamp(26px,2.6vw,34px);
    line-height:1.12;
    letter-spacing:-.02em;
}
.h2-result-body > p{
    color:var(--ink-soft);
    font-size:15px;
    line-height:1.75;
}
.h2-meters{
    display:grid;
    gap:11px;
    padding:16px 0;
    border-block:1px solid var(--border);
}
.h2-meter{
    display:grid;
    grid-template-columns:92px minmax(0,1fr) 42px;
    align-items:center;
    gap:12px;
    color:var(--ink-soft);
    font-size:13.5px;
    font-weight:600;
}
.h2-meter b{
    color:var(--ink);
    font-size:13.5px;
    text-align:end;
}
.h2-bar{
    height:8px;
    overflow:hidden;
    border-radius:999px;
    background:var(--lavender-2);
}
.h2-bar i{
    display:block;
    width:var(--v,0%);
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg,var(--violet),#b49cf2);
    transform:scaleX(0);
    transform-origin:left;
    transition:transform 1s cubic-bezier(.2,.75,.25,1);
}
.h2-result.is-ready .h2-bar i{transform:scaleX(1);}
.h2-result.is-ready .h2-meter:nth-child(2) .h2-bar i{transition-delay:.12s;}
.h2-result.is-ready .h2-meter:nth-child(3) .h2-bar i{transition-delay:.24s;}

.h2-facts{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    list-style:none;
}
.h2-facts li{
    padding:12px 14px;
    border:1px solid var(--border);
    border-radius:16px;
    background:var(--lavender);
}
.h2-facts small{
    display:block;
    color:var(--muted);
    font-size:11.5px;
    font-weight:700;
    letter-spacing:.06em;
    text-transform:uppercase;
}
.h2-facts strong{
    display:block;
    margin-top:4px;
    color:var(--ink);
    font-size:14px;
    line-height:1.25;
}
.h2-result-body .btn{
    align-self:flex-start;
    margin-top:auto;
    min-height:48px;
    padding:0 24px;
    font-size:15px;
}

/* ---------- SECTION 3 : BENTO ---------- */
.h2-head-split{
    display:grid;
    grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
    gap:48px;
    align-items:end;
    margin-bottom:48px;
}
.h2-head-split h2{
    font-family:var(--serif);
    font-size:clamp(36px,4.2vw,56px);
    line-height:1.08;
    letter-spacing:-.025em;
}
.h2-head-split p{
    color:var(--muted);
    font-size:16px;
    line-height:1.8;
    margin-bottom:16px;
}
.h2-text-link{
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:var(--violet);
    font-size:15px;
    font-weight:800;
}
.h2-text-link span{transition:transform .3s ease;}
.h2-text-link:hover span{transform:translateX(5px);}

.h2-bento{
    display:grid;
    grid-template-columns:repeat(12,minmax(0,1fr));
    gap:20px;
}
.h2-tile{
    position:relative;
    display:flex;
    flex-direction:column;
    overflow:hidden;
    padding:28px;
    border:1px solid var(--border);
    border-radius:var(--radius);
    background:var(--white);
    box-shadow:var(--shadow-soft);
    transition:transform .4s cubic-bezier(.2,.75,.25,1),box-shadow .4s ease,opacity .75s ease;
}
.h2-tile.reveal.visible{transition-delay:var(--d,0s);}
.h2-tile.reveal.visible:hover{
    transition-delay:0s;
    transform:translateY(-6px);
    box-shadow:var(--shadow);
}
.h2-mini-kicker{
    display:inline-block;
    margin-bottom:10px;
    color:var(--violet);
    font-size:12px;
    font-weight:800;
    letter-spacing:.13em;
    text-transform:uppercase;
}
.h2-tile h3{
    font-family:var(--serif);
    font-size:clamp(22px,2.1vw,27px);
    line-height:1.18;
    letter-spacing:-.015em;
    margin-bottom:10px;
}
.h2-tile > p,
.h2-tile-copy > p{
    color:var(--ink-soft);
    font-size:14.5px;
    line-height:1.75;
}

.h2-t-scan{grid-column:span 7;grid-row:span 2;min-height:500px;}
.h2-t-preview{grid-column:span 5;}
.h2-t-stats{grid-column:span 5;}
.h2-t-care,.h2-t-hours,.h2-t-emi{grid-column:span 4;}

/* scan tile */
.h2-t-scan{
    justify-content:flex-end;
    padding:34px;
    border:0;
    color:#fff;
    background:linear-gradient(160deg,#43337a,#1f1740);
}
.h2-t-scan .h2-mini-kicker{color:#cbbdf5;}
.h2-t-scan h3{
    max-width:480px;
    color:#fff;
    font-size:clamp(28px,3vw,38px);
    line-height:1.12;
}
.h2-t-scan .h2-tile-copy > p{
    max-width:470px;
    color:#e0d9f3;
    font-size:15px;
}
.h2-scan-photo{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    opacity:.5;
    mix-blend-mode:luminosity;
    transform:scale(1.04);
    transition:transform 2s cubic-bezier(.2,.75,.25,1);
}
.h2-t-scan:hover .h2-scan-photo{transform:scale(1.1);}
.h2-scan-shade{
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,rgba(31,23,64,.2) 0%,rgba(31,23,64,.5) 45%,rgba(31,23,64,.95) 100%);
}
.h2-scan-grid{
    position:absolute;
    inset:0;
    background-image:radial-gradient(rgba(255,255,255,.3) 1px,transparent 1.6px);
    background-size:24px 24px;
    -webkit-mask-image:linear-gradient(180deg,#000 0%,transparent 70%);
    mask-image:linear-gradient(180deg,#000 0%,transparent 70%);
}
.h2-scanline{
    position:absolute;
    inset-inline:0;
    top:-100px;
    height:100px;
    border-bottom:2px solid #e3d9ff;
    background:linear-gradient(180deg,transparent,rgba(180,156,242,.32));
    box-shadow:0 12px 28px -10px rgba(180,156,242,.9);
    animation:h2Scan 4.6s ease-in-out infinite;
}
@keyframes h2Scan{
    0%{top:-100px;opacity:0;}
    12%{opacity:1;}
    88%{opacity:1;}
    100%{top:100%;opacity:0;}
}
.h2-corner{
    position:absolute;
    width:34px;
    height:34px;
    border:2px solid rgba(255,255,255,.7);
}
.h2-corner.c1{top:22px;inset-inline-start:22px;border-inline-end:0;border-bottom:0;border-start-start-radius:10px;}
.h2-corner.c2{top:22px;inset-inline-end:22px;border-inline-start:0;border-bottom:0;border-start-end-radius:10px;}
.h2-scan-tag{
    position:absolute;
    z-index:2;
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:8px 14px;
    border:1px solid rgba(255,255,255,.28);
    border-radius:999px;
    background:rgba(255,255,255,.16);
    backdrop-filter:blur(10px);
    color:#fff;
    font-size:12.5px;
    font-weight:700;
    animation:h2Pop 6s ease-in-out infinite;
}
.h2-scan-tag::before{
    content:"";
    width:8px;
    height:8px;
    border-radius:50%;
    background:#7be3ae;
    box-shadow:0 0 0 4px rgba(123,227,174,.25);
}
.h2-scan-tag.t1{top:64px;inset-inline-start:34px;}
.h2-scan-tag.t2{top:116px;inset-inline-end:34px;animation-delay:1.2s;}
.h2-scan-tag.t3{top:182px;inset-inline-start:74px;animation-delay:2.4s;}
@keyframes h2Pop{
    0%,100%{opacity:.35;transform:translateY(8px) scale(.96);}
    20%,80%{opacity:1;transform:none;}
}
.h2-tile-copy{position:relative;z-index:2;}

/* preview tile */
.h2-teeth{
    width:100%;
    height:auto;
    margin:6px 0 14px;
    overflow:visible;
}
.h2-gum{
    fill:none;
    stroke:rgba(102,81,168,.25);
    stroke-width:10;
    stroke-linecap:round;
}
.h2-tooth{
    fill:#fff;
    stroke:rgba(102,81,168,.55);
    stroke-width:2;
    transform-box:fill-box;
    transform-origin:50% 90%;
    animation:h2Align 7s cubic-bezier(.6,0,.3,1) infinite alternate;
    animation-delay:calc(var(--i) * .14s);
}
@keyframes h2Align{
    0%,12%{transform:translateX(var(--dx)) rotate(var(--r));}
    88%,100%{transform:none;}
}
.h2-timeline{
    position:relative;
    height:6px;
    margin-top:auto;
    border-radius:999px;
    background:var(--lavender-2);
}
.h2-timeline i{
    position:absolute;
    inset-block:0;
    inset-inline-start:0;
    border-radius:inherit;
    background:linear-gradient(90deg,var(--violet),#b49cf2);
    animation:h2Grow 7s cubic-bezier(.6,0,.3,1) infinite alternate;
}
.h2-timeline i::after{
    content:"";
    position:absolute;
    top:50%;
    inset-inline-end:-7px;
    width:16px;
    height:16px;
    border:3px solid var(--violet);
    border-radius:50%;
    background:var(--white);
    transform:translateY(-50%);
}
@keyframes h2Grow{
    0%,12%{width:4%;}
    88%,100%{width:100%;}
}
.h2-timeline-labels{
    display:flex;
    justify-content:space-between;
    margin-top:12px;
    color:var(--muted);
    font-size:12.5px;
    font-weight:700;
    letter-spacing:.04em;
}

/* stats tile */
.h2-stat-row{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    margin:16px 0 6px;
}
.h2-stat-row > div{
    padding-inline:14px;
    border-inline-start:1px solid var(--border);
}
.h2-stat-row > div:first-child{padding-inline-start:0;border-inline-start:0;}
.h2-stat-row strong{
    display:block;
    color:var(--violet);
    font-family:var(--serif);
    font-size:clamp(26px,2.6vw,34px);
    line-height:1;
}
.h2-stat-row strong span{margin:0;font-size:inherit;color:inherit;font-weight:inherit;}
.h2-stat-row strong small{
    margin-inline-start:2px;
    font-family:var(--sans);
    font-size:14px;
    font-weight:800;
}
.h2-stat-row > div > span{
    display:block;
    margin-top:8px;
    color:var(--muted);
    font-size:12.5px;
    line-height:1.4;
}
.h2-chart{
    position:relative;
    margin-top:auto;
    padding-top:14px;
}
.h2-chart svg{display:block;width:100%;height:auto;overflow:visible;}
.h2-chart .area{
    fill:url(#h2Area);
    opacity:0;
    transition:opacity 1.2s ease 1.2s;
}
.h2-chart .line{
    fill:none;
    stroke:var(--violet);
    stroke-width:3;
    stroke-linecap:round;
    stroke-dasharray:420;
    stroke-dashoffset:420;
    transition:stroke-dashoffset 2.2s cubic-bezier(.2,.75,.25,1) .3s;
}
.h2-chart .dot{
    fill:var(--white);
    stroke:var(--violet);
    stroke-width:3;
    opacity:0;
    transition:opacity .4s ease 2.2s;
}
.reveal.visible .h2-chart .line{stroke-dashoffset:0;}
.reveal.visible .h2-chart .area,
.reveal.visible .h2-chart .dot{opacity:1;}
.h2-chart-cap{
    margin-top:8px;
    color:var(--muted);
    font-size:12.5px;
    font-weight:600;
}

/* care tile */
.h2-t-care{padding:0;}
.h2-care-photo{
    position:relative;
    height:206px;
    flex:none;
    overflow:hidden;
    background:var(--lavender-2);
}
.h2-care-photo img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform 1.4s cubic-bezier(.2,.75,.25,1);
}
.h2-t-care:hover .h2-care-photo img{transform:scale(1.08);}
.h2-care-photo::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,transparent 50%,rgba(30,20,55,.3));
}
.h2-team{
    position:relative;
    z-index:2;
    display:flex;
    align-items:center;
    gap:12px;
    margin:-22px 28px 0;
}
.h2-team-stack{display:flex;}
.h2-team-stack img{
    width:44px;
    height:44px;
    margin-inline-start:-12px;
    border:3px solid var(--white);
    border-radius:50%;
    object-fit:cover;
    background:var(--lavender-2);
    box-shadow:0 6px 14px rgba(58,44,92,.18);
    transition:transform .3s ease;
}
.h2-team-stack img:first-child{margin-inline-start:0;}
.h2-t-care:hover .h2-team-stack img{transform:translateY(-4px);}
.h2-team-stack img:nth-child(2){transition-delay:.04s;}
.h2-team-stack img:nth-child(3){transition-delay:.08s;}
.h2-team-stack img:nth-child(4){transition-delay:.12s;}
.h2-team small{
    padding:6px 12px;
    border-radius:999px;
    background:var(--violet);
    color:#fff;
    font-size:11.5px;
    font-weight:800;
    letter-spacing:.06em;
    text-transform:uppercase;
}
.h2-care-body{
    display:flex;
    flex:1;
    flex-direction:column;
    padding:20px 28px 28px;
}
.h2-checklist{
    display:grid;
    gap:11px;
    margin-top:auto;
    padding-top:16px;
    list-style:none;
}
.h2-checklist li{
    display:flex;
    align-items:center;
    gap:11px;
    color:var(--ink-soft);
    font-size:14px;
    font-weight:600;
}
.h2-checklist svg{
    flex:none;
    width:24px;
    height:24px;
    fill:var(--violet-soft);
    stroke:var(--violet);
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
}
.h2-checklist svg path{
    fill:none;
    stroke-dasharray:22;
    stroke-dashoffset:22;
    transition:stroke-dashoffset .7s ease .5s;
}
.reveal.visible .h2-checklist svg path{stroke-dashoffset:0;}
.reveal.visible .h2-checklist li:nth-child(2) svg path{transition-delay:.75s;}
.reveal.visible .h2-checklist li:nth-child(3) svg path{transition-delay:1s;}

/* hours tile */
.h2-open{
    display:inline-flex;
    align-items:center;
    align-self:flex-start;
    gap:9px;
    margin-bottom:16px;
    padding:7px 13px;
    border-radius:999px;
    background:var(--violet-soft);
    color:var(--violet-dark);
    font-size:13px;
    font-weight:800;
}
.h2-open .h2-live{width:10px;height:10px;}
.h2-open.is-closed .h2-live,
.h2-open.is-closed .h2-live::after{background:#d9776b;}
.h2-days{
    display:grid;
    gap:6px;
    margin-top:auto;
    padding-top:16px;
    list-style:none;
}
.h2-days li{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:9px 14px;
    border:1px solid transparent;
    border-radius:13px;
    color:var(--ink-soft);
    font-size:13.5px;
    font-weight:600;
    transition:background .3s ease,border-color .3s ease;
}
.h2-days li span:last-child{color:var(--muted);font-weight:500;}
.h2-days li.is-today{
    border-color:var(--violet);
    background:var(--violet-soft);
    color:var(--ink);
}
.h2-days li.is-today span:last-child{color:var(--violet-dark);font-weight:800;}
.h2-days li.is-off span:last-child{font-style:italic;}
.h2-callout{
    display:flex;
    align-items:center;
    gap:14px;
    margin-top:14px;
    padding:14px 16px;
    border:1px dashed rgba(102,81,168,.45);
    border-radius:16px;
    background:var(--lavender);
    color:var(--ink);
    transition:transform .3s ease,border-color .3s ease,background .3s ease;
}
.h2-callout:hover{
    transform:translateY(-3px);
    border-color:var(--violet);
    background:var(--violet-soft);
}
.h2-callout-icon{
    flex:none;
    display:grid;
    place-items:center;
    width:40px;
    height:40px;
    border-radius:12px;
    background:var(--violet);
    color:#fff;
    font-size:17px;
    animation:h2Ring 3.2s ease-in-out infinite;
}
.h2-callout strong{display:block;font-size:14px;line-height:1.25;}
.h2-callout small{display:block;margin-top:2px;color:var(--muted);font-size:13px;}
@keyframes h2Ring{
    0%,60%,100%{transform:rotate(0);}
    66%{transform:rotate(-16deg);}
    72%{transform:rotate(14deg);}
    78%{transform:rotate(-10deg);}
    84%{transform:rotate(8deg);}
}

/* emi tile */
.h2-plan-chips{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin:4px 0 18px;
}
.h2-plan-chip{
    padding:8px 13px;
    border:1px solid var(--border);
    border-radius:999px;
    background:var(--white);
    color:var(--ink-soft);
    font-size:12.5px;
    font-weight:700;
    transition:background .3s ease,color .3s ease,border-color .3s ease,transform .3s ease;
}
.h2-plan-chip:hover{border-color:var(--violet);color:var(--violet);transform:translateY(-2px);}
.h2-plan-chip.is-active,
.h2-plan-chip.is-active:hover{
    border-color:var(--violet);
    background:var(--violet);
    color:#fff;
}
.h2-range{
    display:block;
    margin-bottom:18px;
}
.h2-range > span{
    display:flex;
    justify-content:space-between;
    margin-bottom:12px;
    color:var(--ink-soft);
    font-size:13.5px;
    font-weight:600;
}
.h2-range b{color:var(--violet);}
.h2-range input{
    -webkit-appearance:none;
    appearance:none;
    display:block;
    width:100%;
    height:8px;
    border-radius:999px;
    outline:none;
    background:linear-gradient(90deg,var(--violet) var(--p,33%),var(--lavender-2) var(--p,33%));
    cursor:pointer;
}
.h2-range input::-webkit-slider-thumb{
    -webkit-appearance:none;
    width:24px;
    height:24px;
    border:4px solid var(--violet);
    border-radius:50%;
    background:#fff;
    box-shadow:0 4px 12px rgba(102,81,168,.4);
    transition:transform .2s ease;
}
.h2-range input::-moz-range-thumb{
    width:16px;
    height:16px;
    border:4px solid var(--violet);
    border-radius:50%;
    background:#fff;
    box-shadow:0 4px 12px rgba(102,81,168,.4);
}
.h2-range input:active::-webkit-slider-thumb{transform:scale(1.18);}
.h2-range input:focus-visible{outline:2px solid var(--violet);outline-offset:6px;}
.h2-emi-out{
    margin-top:auto;
    padding:18px 20px;
    border-radius:20px;
    background:linear-gradient(135deg,var(--violet),var(--violet-dark));
    color:#fff;
}
.h2-emi-out small{
    display:block;
    color:#d9cffa;
    font-size:12px;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
}
.h2-emi-out strong{
    display:block;
    margin:4px 0 2px;
    font-family:var(--serif);
    font-size:clamp(32px,3vw,40px);
    line-height:1.05;
}
.h2-emi-out > span{display:block;color:#e8e1fb;font-size:13px;}
.h2-emi-out strong span{display:inline;margin:0;color:inherit;font-size:inherit;}
.h2-note{
    margin:12px 0 16px;
    color:var(--muted);
    font-size:12.5px;
    line-height:1.6;
}
.h2-t-emi .btn{min-height:46px;}

/* ---------- RESPONSIVE ---------- */
@media(max-width:1100px){
    .home2-page .h2-hero-main{gap:44px;}
    .home2-page .h2-hero-visual{height:500px;}
    .h2-arch{inset-inline-end:48px;}
    .h2-orbit{width:140px;height:140px;}
    .h2-seal{width:108px;height:108px;bottom:84px;}
    .h2-fl-slot{inset-inline-start:-14px;}
    .h2-fl-prog{inset-inline-start:-8px;}
    .h2-result-img{min-height:400px;}
    .h2-result-body{padding:28px 24px;}
    .h2-t-scan{grid-column:span 12;grid-row:auto;min-height:440px;}
    .h2-t-preview,.h2-t-stats{grid-column:span 6;}
    .h2-t-care,.h2-t-hours{grid-column:span 6;}
    .h2-t-emi{grid-column:span 12;}
}
@media(max-width:1000px){
    .h2-finder-grid{grid-template-columns:1fr;gap:20px;}
    .h2-concerns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));}
    .h2-concern:last-child{grid-column:span 2;}
    .h2-concern:hover{transform:translateY(-3px);}
    .h2-head-split{grid-template-columns:1fr;gap:18px;}
}
@media(max-width:900px){
    .home2-page .h2-hero{padding-top:52px;}
    .home2-page .h2-hero-main{grid-template-columns:1fr;gap:44px;padding-bottom:56px;}
    .home2-page .h2-hero-visual{height:480px;max-width:560px;width:100%;margin-inline:auto;}
}
@media(max-width:760px){
    .h2-result{grid-template-columns:1fr;}
    .h2-result-img{min-height:250px;}
    .h2-t-preview,.h2-t-stats,.h2-t-care,.h2-t-hours{grid-column:span 12;}
    .h2-t-scan{min-height:460px;}
}
@media(max-width:640px){
    .h2-concerns{grid-template-columns:1fr;}
    .h2-concern:last-child{grid-column:auto;}
    .h2-c-arrow{display:none;}
    .h2-facts{grid-template-columns:1fr 1fr 1fr;gap:8px;}
    .h2-facts li{padding:10px 10px;}
    .h2-facts strong{font-size:13px;}
    .h2-meter{grid-template-columns:78px minmax(0,1fr) 38px;gap:10px;}
    .h2-tile{padding:24px 22px;}
    .h2-t-scan{padding:26px 22px;}
    .h2-t-care{padding:0;}
    .h2-care-body{padding:20px 22px 24px;}
    .h2-team{margin-inline:22px;}
    .h2-result-body .btn{width:100%;}
    .h2-bento{gap:16px;}
}
@media(max-width:560px){
    .home2-page .h2-hero{padding-top:38px;}
    .home2-page .h2-hero .hero-buttons .btn{width:100%;}
    .home2-page .h2-hero-visual{height:410px;}
    .h2-arch{inset-inline-end:34px;border-radius:170px 170px 26px 26px;}
    .h2-orbit{top:18px;width:104px;height:104px;border-width:4px;}
    .h2-seal{width:86px;height:86px;bottom:112px;inset-inline-end:2px;}
    .h2-seal .tooth{width:24px;height:27px;}
    .h2-seal svg.ring text{font-size:11.5px;}
    .h2-fl{padding:10px 12px;gap:9px;border-radius:15px;}
    .h2-fl-slot{top:34px;inset-inline-start:6px;}
    .h2-fl-prog{bottom:16px;inset-inline-start:6px;min-width:200px;}
    .h2-proof{flex-direction:column;align-items:flex-start;gap:12px;}
    .h2-scan-tag.t3{inset-inline-start:34px;top:168px;}
    .h2-scan-tag{font-size:11.5px;padding:7px 11px;}
    .h2-stat-row > div{padding-inline:10px;}
    .h2-stat-row > div > span{font-size:11.5px;}
    .h2-marquee-group span{font-size:12px;}
}
@media(max-width:420px){
    .h2-facts{grid-template-columns:1fr;}
    .h2-facts li{display:flex;align-items:center;justify-content:space-between;gap:10px;}
    .h2-facts strong{margin-top:0;text-align:end;}
    .h2-stat-row strong{font-size:23px;}
}

@media(min-width:641px) and (max-width:1100px){
    .h2-t-emi .btn{align-self:flex-start;padding:0 30px;}
}


/* =========================================================
   HOME 2 PAGE — SECTIONS 4–6
   (roadmap stepper, patient stories, FAQ + booking)
   ========================================================= */

/* ---------- SECTION 4 : ROADMAP ---------- */
.h2-journey{overflow:hidden;}
.h2-journey .section-heading{margin-bottom:44px;}
.h2-roadmap{display:grid;gap:26px;}
.h2-steps{
    position:relative;
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
}
.h2-steps-line{
    position:absolute;
    top:27px;
    inset-inline:12.5%;
    height:4px;
    border-radius:999px;
    background:var(--lavender-2);
    overflow:hidden;
}
.h2-steps-line i{
    display:block;
    width:100%;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg,var(--violet),#b49cf2);
    transform:scaleX(0);
    transform-origin:left;
    transition:transform .7s cubic-bezier(.2,.75,.25,1);
}
.h2-step{
    position:relative;
    z-index:1;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:4px;
    padding:0 6px;
    border:0;
    background:none;
    color:var(--ink-soft);
    font:inherit;
    text-align:center;
    cursor:pointer;
}
.h2-step-dot{
    display:grid;
    place-items:center;
    width:54px;
    height:54px;
    margin-bottom:8px;
    border:2px solid var(--lavender-2);
    border-radius:50%;
    background:var(--white);
    color:var(--violet);
    font-family:var(--serif);
    font-size:21px;
    font-weight:700;
    box-shadow:var(--shadow-soft);
    transition:background .35s ease,color .35s ease,border-color .35s ease,transform .35s cubic-bezier(.2,.75,.25,1);
}
.h2-step:hover .h2-step-dot{transform:translateY(-3px);border-color:var(--violet);}
.h2-step.is-done .h2-step-dot{border-color:var(--violet);}
.h2-step.is-active .h2-step-dot{
    border-color:var(--violet);
    background:var(--violet);
    color:#fff;
    transform:scale(1.1);
    box-shadow:0 0 0 7px rgba(102,81,168,.16),var(--shadow-soft);
}
.h2-step strong{font-size:15.5px;line-height:1.25;color:var(--ink);}
.h2-step small{color:var(--muted);font-size:12.5px;font-weight:600;}
.h2-step:focus-visible{outline:2px solid var(--violet);outline-offset:6px;border-radius:16px;}
.h2-step-panel .h2-checklist{margin-top:0;padding-top:0;}
.h2-step-panel .h2-checklist svg path{stroke-dashoffset:0;}
.h2-step-nav{
    display:flex;
    align-items:center;
    gap:10px;
    margin-top:auto;
    padding-top:4px;
}
.h2-step-nav .btn{margin:0 0 0 6px;min-height:48px;padding:0 24px;font-size:15px;}
.h2-step-btn{
    display:grid;
    place-items:center;
    width:48px;
    height:48px;
    border:1px solid var(--border);
    border-radius:50%;
    background:var(--white);
    color:var(--violet);
    font-size:18px;
    cursor:pointer;
    transition:background .3s ease,color .3s ease,border-color .3s ease,transform .3s ease;
}
.h2-step-btn:hover{background:var(--violet);border-color:var(--violet);color:#fff;transform:translateY(-2px);}

/* ---------- SECTION 5 : STORIES ---------- */
.h2-stories-grid{
    display:grid;
    grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);
    gap:20px;
}
.h2-rating{
    position:relative;
    display:flex;
    flex-direction:column;
    overflow:hidden;
    padding:32px 30px;
    border-radius:var(--radius);
    background:linear-gradient(145deg,var(--violet),var(--violet-dark));
    color:#fff;
    box-shadow:var(--shadow);
}
.h2-rating::after{
    content:"";
    position:absolute;
    top:-70px;
    inset-inline-end:-70px;
    width:210px;
    height:210px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(255,255,255,.18),transparent 70%);
}
.h2-rating .h2-mini-kicker{color:#cbbdf5;}
.h2-rating-score{display:flex;align-items:baseline;gap:8px;}
.h2-rating-score strong{font-family:var(--serif);font-size:clamp(64px,7vw,88px);line-height:1;letter-spacing:-.03em;}
.h2-rating-score strong span{font-size:inherit;color:inherit;margin:0;}
.h2-rating-of{color:#d9cffa;font-size:18px;font-weight:700;}
.h2-rating-stars{margin:6px 0 4px;color:#f2b84b;font-size:22px;letter-spacing:4px;}
.h2-rating > p{color:#e8e1fb;font-size:14.5px;}
.h2-rating-bars{display:grid;gap:12px;margin-top:auto;padding-top:28px;list-style:none;}
.h2-rating-bars li{display:grid;grid-template-columns:34px minmax(0,1fr) 38px;align-items:center;gap:12px;font-size:13px;font-weight:700;color:#e8e1fb;}
.h2-rating-bars b{text-align:end;color:#fff;}
.h2-rating-bars .h2-bar{background:rgba(255,255,255,.2);}
.h2-rating-bars .h2-bar i{background:#fff;}
.h2-rating.reveal.visible .h2-bar i{transform:scaleX(1);}
.h2-rating.reveal.visible li:nth-child(2) .h2-bar i{transition-delay:.12s;}
.h2-rating.reveal.visible li:nth-child(3) .h2-bar i{transition-delay:.24s;}

.h2-quote{
    position:relative;
    display:flex;
    flex-direction:column;
    overflow:hidden;
    padding:38px 36px 30px;
    border:1px solid var(--border);
    border-radius:var(--radius);
    background:var(--white);
    box-shadow:var(--shadow-soft);
}
.h2-quote-mark{
    position:absolute;
    top:-6px;
    inset-inline-end:26px;
    color:var(--violet-soft);
    font-family:var(--serif);
    font-size:190px;
    line-height:1;
    pointer-events:none;
    user-select:none;
}
.h2-quote-main{position:relative;flex:1;transition:opacity .3s ease,transform .45s cubic-bezier(.2,.75,.25,1);}
.h2-quote.is-swap .h2-quote-main{opacity:0;transform:translateY(10px);}
.h2-stars{margin-bottom:14px;color:#e9a83b;font-size:19px;letter-spacing:4px;}
.h2-quote blockquote{
    margin:0 0 24px;
    color:var(--ink);
    font-family:var(--serif);
    font-size:clamp(21px,2.3vw,29px);
    line-height:1.4;
    letter-spacing:-.01em;
}
.h2-quote-by strong{display:block;color:var(--ink);font-size:15.5px;}
.h2-quote-by span{display:block;margin-top:2px;color:var(--muted);font-size:13.5px;}
.h2-quote-pick{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-top:28px;
    padding-top:22px;
    border-top:1px solid var(--border);
}
.h2-who{
    position:relative;
    display:flex;
    align-items:center;
    gap:10px;
    overflow:hidden;
    padding:9px 12px;
    border:1px solid var(--border);
    border-radius:16px;
    background:var(--white);
    color:var(--ink-soft);
    font:inherit;
    cursor:pointer;
    transition:background .3s ease,border-color .3s ease,transform .3s ease;
}
.h2-who:hover{border-color:var(--violet);transform:translateY(-2px);}
.h2-who span{
    display:grid;
    place-items:center;
    flex:none;
    width:34px;
    height:34px;
    border-radius:50%;
    background:var(--violet-soft);
    color:var(--violet);
    font-family:var(--serif);
    font-size:16px;
    font-weight:700;
    transition:background .3s ease,color .3s ease;
}
.h2-who small{font-size:13.5px;font-weight:700;}
.h2-who.is-active{border-color:var(--violet);background:var(--lavender);color:var(--ink);}
.h2-who.is-active span{background:var(--violet);color:#fff;}
.h2-who.is-active .h2-progress{animation:h2Fill 6s linear forwards;}
.h2-quote.is-paused .h2-who.is-active .h2-progress{animation-play-state:paused;}
.h2-who:focus-visible{outline:2px solid var(--violet);outline-offset:3px;}

/* ---------- SECTION 6 : FAQ + BOOKING ---------- */
.h2-ask-grid{
    display:grid;
    grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
    gap:56px;
    align-items:start;
}
.h2-ask-copy .section-kicker{margin-bottom:14px;}
.h2-ask-copy h2{
    max-width:560px;
    margin-bottom:14px;
    font-family:var(--serif);
    font-size:clamp(36px,4.2vw,54px);
    line-height:1.08;
    letter-spacing:-.025em;
}
.h2-ask-lead{max-width:540px;margin-bottom:30px;color:var(--muted);font-size:16px;line-height:1.8;}
.h2-book{
    position:sticky;
    top:104px;
    overflow:hidden;
    padding:34px 32px 28px;
    border-radius:28px;
    background:linear-gradient(150deg,var(--violet),var(--violet-dark));
    color:#fff;
    box-shadow:var(--shadow);
}
.h2-book > *{position:relative;z-index:1;}
.h2-orb{position:absolute !important;z-index:0 !important;border-radius:50%;pointer-events:none;}
.h2-orb-1{top:-80px;inset-inline-end:-60px;width:240px;height:240px;background:radial-gradient(circle,rgba(255,255,255,.2),transparent 70%);animation:h2Float 9s ease-in-out infinite;}
.h2-orb-2{bottom:-90px;inset-inline-start:-70px;width:220px;height:220px;background:radial-gradient(circle,rgba(180,156,242,.35),transparent 70%);animation:h2Float 11s ease-in-out infinite reverse;}
@keyframes h2Float{0%,100%{transform:translateY(0);}50%{transform:translateY(18px);}}
.h2-book .h2-mini-kicker{color:#cbbdf5;}
.h2-book h3{margin-bottom:10px;font-family:var(--serif);font-size:clamp(26px,2.6vw,34px);line-height:1.15;letter-spacing:-.015em;}
.h2-book > p{margin-bottom:22px;color:#e8e1fb;font-size:15px;line-height:1.7;}
.h2-form{display:grid;gap:12px;}
.h2-form input,
.h2-form select{
    width:100%;
    min-height:48px;
    padding:0 16px;
    border:1px solid transparent;
    border-radius:14px;
    background:#fff;
    color:#272238;
    font:inherit;
    font-size:14.5px;
    transition:border-color .25s ease,box-shadow .25s ease;
}
.h2-form input:focus,
.h2-form select:focus{outline:0;border-color:#cbbdf5;box-shadow:0 0 0 4px rgba(255,255,255,.22);}
.h2-form .btn{
    min-height:50px;
    border:0;
    background:#fff;
    color:var(--violet-dark);
    font-weight:800;
    box-shadow:none;
}
.h2-form .btn:hover{background:var(--violet-soft);transform:translateY(-2px);}
.h2-form-msg{min-height:0;color:#fff;font-size:13.5px;font-weight:700;text-align:center;}
.h2-book-points{
    display:grid;
    gap:9px;
    margin-top:18px;
    padding-top:18px;
    border-top:1px solid rgba(255,255,255,.22);
    list-style:none;
}
.h2-book-points li{display:flex;align-items:center;gap:10px;color:#e8e1fb;font-size:13.5px;font-weight:600;}
.h2-book-points span{color:#f2b84b;font-size:12px;}

/* ---------- RESPONSIVE (4–6) ---------- */
@media(max-width:1000px){
    .h2-stories-grid{grid-template-columns:1fr;}
    .h2-rating{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:30px;align-items:center;}
    .h2-rating .h2-mini-kicker,.h2-rating-score,.h2-rating-stars,.h2-rating > p{grid-column:1;}
    .h2-rating-bars{grid-column:2;grid-row:1 / span 4;margin-top:0;padding-top:0;}
    .h2-ask-grid{grid-template-columns:1fr;gap:36px;}
    .h2-book{position:relative;top:auto;max-width:640px;}
}
@media(max-width:760px){
    .h2-step-panel .h2-result-img{min-height:240px;}
    .h2-quote-pick{grid-template-columns:1fr 1fr;}
}
@media(max-width:640px){
    .h2-steps{gap:4px;}
    .h2-steps-line{top:23px;}
    .h2-step-dot{width:46px;height:46px;font-size:18px;}
    .h2-step strong{font-size:13px;}
    .h2-step small{font-size:11px;}
    .h2-step-nav .btn{flex:1;margin-left:0;padding:0 16px;}
    .h2-rating{display:flex;flex-direction:column;align-items:stretch;padding:28px 24px;}
    .h2-rating-bars{margin-top:auto;padding-top:24px;}
    .h2-quote{padding:30px 22px 22px;}
    .h2-quote-mark{font-size:140px;}
    .h2-book{padding:28px 22px 24px;}
}


/* =====================================================
   HOME 2 — REAL RESULTS + CARE FOR EVERY AGE
   ===================================================== */
.home2-page .h2-results-intro,.home2-page .h2-age-intro{display:flex;align-items:end;justify-content:space-between;gap:32px;margin-bottom:30px}
.home2-page .h2-results-intro h2,.home2-page .h2-age-intro h2{margin:10px 0 0;font-family:var(--serif);font-size:clamp(34px,4.2vw,54px);line-height:1.08;letter-spacing:-.03em}
.home2-page .h2-results-intro>p,.home2-page .h2-age-intro>p{max-width:410px;margin:0 0 5px;color:var(--muted);font-size:15.5px;line-height:1.8}
.home2-page .h2-results-filters{display:flex;flex-wrap:wrap;gap:9px;margin:0 0 24px}
.home2-page .h2-results-filter{min-height:42px;padding:0 18px;border:1px solid var(--border);border-radius:999px;background:var(--white);color:var(--ink-soft);font:inherit;font-size:13.5px;font-weight:700;cursor:pointer;transition:background .25s ease,color .25s ease,border-color .25s ease,transform .25s ease}
.home2-page .h2-results-filter:hover{transform:translateY(-2px);border-color:var(--violet)}
.home2-page .h2-results-filter.is-active{background:var(--violet);border-color:var(--violet);color:#fff}
.home2-page .h2-results-cases{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.home2-page .h2-result-case{min-width:0;overflow:hidden;border:1px solid var(--border);border-radius:22px;background:var(--white);transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease}
.home2-page .h2-result-case:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:var(--violet-soft)}
.home2-page .h2-result-case[hidden]{display:none!important}
.home2-page .h2-case-visual{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:3px;overflow:hidden;aspect-ratio:1.45;background:var(--lavender)}
.home2-page .h2-case-photo{position:relative;min-width:0;overflow:hidden}
.home2-page .h2-case-photo img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .65s cubic-bezier(.2,.75,.25,1);filter:saturate(.88)}
.home2-page .h2-result-case:hover .h2-case-photo img{transform:scale(1.045)}
.home2-page .h2-case-photo>span{position:absolute;bottom:10px;left:10px;padding:5px 9px;border-radius:7px;background:rgba(255,255,255,.92);color:#302744;font-size:11px;font-weight:800;letter-spacing:.04em}
.home2-page .h2-case-arrow{position:absolute;top:50%;left:50%;display:grid;place-items:center;width:34px;height:34px;transform:translate(-50%,-50%);border:2px solid rgba(255,255,255,.8);border-radius:50%;background:var(--violet);color:#fff;font-size:17px;box-shadow:0 4px 16px #34245a30}
.home2-page .h2-case-copy{padding:20px 20px 22px}
.home2-page .h2-case-type{display:inline-block;margin-bottom:8px;color:var(--violet);font-size:11px;font-weight:800;letter-spacing:.11em;text-transform:uppercase}
.home2-page .h2-case-copy h3{margin:0 0 8px;color:var(--ink);font-family:var(--serif);font-size:23px;line-height:1.2}
.home2-page .h2-case-copy p{margin:0;color:var(--muted);font-size:14px;line-height:1.7}
.home2-page .h2-results-disclaimer{max-width:850px;margin:17px 0 0;color:var(--muted);font-size:12px;line-height:1.6}
.home2-page .h2-age-care{overflow:hidden;background:var(--lavender)}
.home2-page .h2-age-intro{align-items:end;margin-bottom:25px}
.home2-page .h2-age-rows{border-top:1px solid var(--border)}
.home2-page .h2-age-row{display:grid;grid-template-columns:70px minmax(150px,.72fr) minmax(0,1.45fr) 40px;align-items:center;gap:24px;padding:22px 0;border-bottom:1px solid var(--border);transition:padding .3s ease}
.home2-page .h2-age-row:hover{padding-inline:10px}
.home2-page .h2-age-index{align-self:start;padding-top:6px;color:var(--violet);font-size:13px;font-weight:800;letter-spacing:.04em}
.home2-page .h2-age-index span{color:var(--muted)}
.home2-page .h2-age-image{height:145px;overflow:hidden;border-radius:16px;background:var(--violet-soft)}
.home2-page .h2-age-image img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.home2-page .h2-age-row:hover .h2-age-image img{transform:scale(1.05)}
.home2-page .h2-age-label{color:var(--violet);font-size:10.5px;font-weight:800;letter-spacing:.1em}
.home2-page .h2-age-content h3{margin:6px 0 7px;color:var(--ink);font-family:var(--serif);font-size:clamp(22px,2.5vw,29px);line-height:1.2}
.home2-page .h2-age-content p{max-width:600px;margin:0 0 10px;color:var(--muted);font-size:14px;line-height:1.7}
.home2-page .h2-age-link{display:inline-flex;align-items:center;gap:9px;color:var(--ink);font-size:13px;font-weight:800;text-decoration:none}
.home2-page .h2-age-link span{color:var(--violet);transition:transform .25s ease}
.home2-page .h2-age-link:hover span{transform:translate(3px,-3px)}
.home2-page .h2-age-symbol{display:grid;place-items:center;width:38px;height:38px;border:1px solid var(--border);border-radius:50%;color:var(--violet);font-size:17px;transition:transform .35s ease,background .35s ease}
.home2-page .h2-age-row:hover .h2-age-symbol{transform:rotate(45deg);background:var(--white)}
.home2-page .h2-age-cta{display:flex;align-items:center;justify-content:space-between;gap:22px;margin-top:28px;padding:24px 28px;border:1px solid var(--border);border-radius:20px;background:var(--white)}
.home2-page .h2-age-cta .section-kicker{font-size:11px}
.home2-page .h2-age-cta h3{margin:5px 0 0;color:var(--ink);font-family:var(--serif);font-size:clamp(23px,2.5vw,30px)}
.home2-page .h2-age-cta .btn{flex:none}
@media(max-width:900px){.home2-page .h2-results-cases{grid-template-columns:repeat(2,minmax(0,1fr))}.home2-page .h2-result-case:last-child{grid-column:1/-1}.home2-page .h2-result-case:last-child .h2-case-visual{aspect-ratio:2.2}.home2-page .h2-age-row{grid-template-columns:48px minmax(130px,.7fr) minmax(0,1.5fr) 30px;gap:16px}.home2-page .h2-age-image{height:130px}}
@media(max-width:640px){.home2-page .h2-results-intro,.home2-page .h2-age-intro{display:block}.home2-page .h2-results-intro>p,.home2-page .h2-age-intro>p{margin-top:15px}.home2-page .h2-results-cases{grid-template-columns:1fr;gap:15px}.home2-page .h2-result-case:last-child{grid-column:auto}.home2-page .h2-result-case:last-child .h2-case-visual{aspect-ratio:1.45}.home2-page .h2-case-copy{padding:17px}.home2-page .h2-age-row{grid-template-columns:35px 100px minmax(0,1fr);gap:12px;padding:17px 0}.home2-page .h2-age-image{height:112px}.home2-page .h2-age-symbol{display:none}.home2-page .h2-age-content h3{font-size:21px}.home2-page .h2-age-content p{font-size:13px;line-height:1.6}.home2-page .h2-age-label{font-size:9px;letter-spacing:.05em}.home2-page .h2-age-cta{align-items:flex-start;flex-direction:column;padding:21px}.home2-page .h2-age-cta .btn{width:100%;justify-content:center}.home2-page .h2-results-filters{gap:7px}.home2-page .h2-results-filter{padding:0 13px;font-size:12.5px}}
@media(prefers-reduced-motion:reduce){.home2-page .h2-result-case,.home2-page .h2-case-photo img,.home2-page .h2-age-row,.home2-page .h2-age-image img,.home2-page .h2-age-symbol{transition:none!important}}


/* =========================================================
   NAV DROPDOWN ARROW — drawn in CSS so it sits dead-centre with the text
   (the old "⌄" text glyph sits low in most fonts)
========================================================= */
.chevron{
    font-size:0 !important;
    line-height:0 !important;
    flex:none;
    display:inline-block;
    width:7px;height:7px;
    margin-inline-start:2px;
    border-right:2px solid currentColor;
    border-bottom:2px solid currentColor;
    border-radius:0 0 2px 0;
    transform:translateY(-3px) rotate(45deg);
    transition:transform .3s ease;
}
.nav-dropdown.is-open > button .chevron,
button[aria-expanded="true"] .chevron{
    transform:translateY(0) rotate(-135deg);
}
.nav-dropdown > button{align-items:center}
.nav-dropdown .dropdown-menu::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px} /* keeps hover alive between button and menu */

/* RESPONSIVE NAV ACTIVE STATE — clear current-page and expanded-menu feedback */
@media (max-width: 900px) {
  .mobile-panel a.active,
  .mobile-panel a[aria-current="page"],
  .mobile-home-links a.active,
  .mobile-dashboard-links a.active {
    color: var(--violet) !important;
    background: var(--violet-soft) !important;
    box-shadow: inset 3px 0 0 var(--violet);
    font-weight: 700 !important;
  }
  .mobile-panel .mobile-home-menu > button[aria-expanded="true"],
  .mobile-panel .mobile-dashboard-menu > button[aria-expanded="true"] {
    color: var(--violet) !important;
    background: var(--violet-soft) !important;
  }
  .mobile-panel a:focus-visible,
  .mobile-panel button:focus-visible {
    outline: 2px solid var(--violet) !important;
    outline-offset: 2px;
  }
}
.nav-links > a[aria-current="page"] {
  color: var(--violet) !important;
  background: var(--violet-soft) !important;
}
.nav-dropdown.current-section > button {
  color: var(--violet) !important;
  background: var(--violet-soft) !important;
}

/* HOME 1 WHY ORVI — final narrow-screen layout correction */
.home1-page #why .hm-split,
.home1-page #why .hm-split-visual,
.home1-page #why .hm-split-copy {
  box-sizing: border-box;
  min-width: 0;
  max-width: none !important;
}
.home1-page #why .hm-split-visual {
  width: 100% !important;
  justify-self: stretch;
}
.home1-page #why .hm-why-image {
  display: block;
  width: 100% !important;
  max-width: none !important;
  min-width: 0;
  overflow: hidden;
}
.home1-page #why .hm-why-image img {
  display: block;
  width: 100% !important;
  max-width: none !important;
  height: 100%;
  object-fit: cover;
}
.home1-page #why .hm-float {
  position: absolute;
  z-index: 2;
  right: 12px !important;
  bottom: 12px !important;
  max-width: calc(100% - 24px) !important;
}
@media (max-width: 900px) {
  .home1-page #why .hm-split {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100%;
    gap: 26px;
  }
  .home1-page #why .hm-split-visual,
  .home1-page #why .hm-split-copy {
    grid-column: 1 / -1;
    width: 100% !important;
  }
  .home1-page #why .hm-why-image {
    aspect-ratio: 1.55 / 1;
    max-height: none !important;
  }
}
@media (max-width: 600px) {
  .home1-page #why > .container { width: calc(100% - 32px) !important; }
  .home1-page #why .hm-split { gap: 22px; }
  .home1-page #why .hm-why-image { aspect-ratio: 1.25 / 1; border-radius: 20px; }
  .home1-page #why .hm-float { right: 8px !important; bottom: 8px !important; padding: 8px 10px; gap: 8px; }
  .home1-page #why .hm-float strong { font-size: 11px; line-height: 1.3; }
  .home1-page #why .hm-float span { font-size: 10px; }
  .home1-page #why .hm-split-copy h2 { font-size: clamp(30px, 8vw, 42px); line-height: 1.12; }
}
@media (max-width: 380px) {
  .home1-page #why > .container { width: calc(100% - 24px) !important; }
  .home1-page #why .hm-why-image { aspect-ratio: 1.12 / 1; }
  .home1-page #why .hm-float { max-width: calc(100% - 16px) !important; padding: 7px 8px; }
}

/* Current-page and expanded-menu active states — all responsive sizes */
.site-header .nav-links a.active,
.site-header .nav-links a[aria-current="page"],
.site-header .mobile-panel a.active,
.site-header .mobile-panel a[aria-current="page"],
.site-header .mobile-home-links a.active,
.site-header .mobile-home-links a[aria-current="page"],
.site-header .mobile-dashboard-links a.active,
.site-header .mobile-dashboard-links a[aria-current="page"] {
  color: var(--violet) !important;
  background: var(--violet-soft) !important;
  font-weight: 800 !important;
  border-radius: 10px;
}
.site-header .nav-dropdown.current-section > button,
.site-header .mobile-home-menu.current-section > button,
.site-header .mobile-dashboard-menu.current-section > button,
.site-header .mobile-panel .mobile-home-menu > button[aria-expanded="true"],
.site-header .mobile-panel .mobile-dashboard-menu > button[aria-expanded="true"] {
  color: var(--violet) !important;
  background: var(--violet-soft) !important;
  font-weight: 800 !important;
}
.site-header a:focus-visible,
.site-header button:focus-visible {
  outline: 2px solid var(--violet) !important;
  outline-offset: 3px;
}


/* ===== merged from darkmode.css ===== */
/* ORVI — Dark Mode styles extracted from finalized About page */

body.dark{
    --paper:#171522;
    --white:#211e2d;

    --lavender:#211d30;
    --lavender-2:#2a2540;

    --ink:#f7f3ff;
    --ink-soft:#d5cee4;
    --muted:#aaa1bc;

    --border:rgba(225,216,255,.15);

    --shadow:0 22px 55px rgba(0,0,0,.28);
    --shadow-soft:0 12px 32px rgba(0,0,0,.22);

    background:#171522;
    color:#f7f3ff;
}
body.dark .site-header{
    background:rgba(23,21,34,.94);
}
body.dark .hero{
    background:
        radial-gradient(circle at 80% 15%,rgba(102,81,168,.22),transparent 32%),
        linear-gradient(135deg,#211d30,#171522);
}
body.dark .history{
    background:#211d30;
}
body.dark .mission{
    background:#171522;
}
body.dark .team{
    background:#211d30;
}
body.dark .testimonials{
    background:#171522;
}
body.dark .cta{
    background:#211d30;
}
body.dark .about-card,
body.dark .history-panel,
body.dark .mission-card,
body.dark .doctor-card,
body.dark .testimonial-card{
    background:#242031;
    border-color:rgba(225,216,255,.12);
}
body.dark .icon-btn{
    background:#242031;
    color:#f7f3ff;
}
body.dark .hero-badge{
    background:#29253a;
}
body.dark .hero-floating{
    background:rgba(38,33,53,.92);
    border-color:rgba(255,255,255,.1);
}
body.dark .testimonials{
    background:
      radial-gradient(circle at 50% 18%,rgba(102,81,168,.18),transparent 34%),
      var(--paper);
}
body.dark .rating-box{background:#242031;box-shadow:0 12px 30px rgba(0,0,0,.18);}
body.dark .testimonial-card{background:transparent;border-color:var(--border);}
body.dark .testimonial-list::before{background:linear-gradient(to bottom,transparent,var(--border) 8%,var(--border) 92%,transparent);}
body.dark .testimonials{
    background:
        radial-gradient(circle at 50% 8%,rgba(102,81,168,.18),transparent 30%),
        var(--paper) !important;
}
body.dark .testimonial-card:hover{
    background:linear-gradient(135deg,rgba(102,81,168,.13),transparent 72%) !important;
}


/* =========================================================
   CONTACT PAGE DARK MODE
   ========================================================= */
body.dark .contact-hero{
    background:
        radial-gradient(circle at 80% 15%,rgba(102,81,168,.22),transparent 32%),
        linear-gradient(135deg,#211d30,#171522);
}
body.dark .quick-strip,
body.dark .location-section,
body.dark .process-section,
body.dark .faq-section{
    background:#171522;
}
body.dark .booking-section{
    background:#211d30;
}
body.dark .info-panel,
body.dark .form-card,
body.dark .process-step,
body.dark .faq-item{
    background:#242031;
    border-color:rgba(225,216,255,.12);
}
body.dark .hero-badge{
    background:#29253a;
}
body.dark .hero-note{
    background:rgba(38,33,53,.92);
    border-color:rgba(255,255,255,.1);
}
body.dark .icon-btn{
    background:#242031;
    color:#f7f3ff;
}
body.dark .map-card iframe{
    filter:grayscale(.2) saturate(.7) brightness(.8);
}




/* FINAL CONTACT DARK-MODE COVERAGE */
body.dark.contact-page .contact-hero,body.dark.contact-page .quick-strip,body.dark.contact-page .location-section,body.dark.contact-page .process-section,body.dark.contact-page .faq-section{color:var(--ink);}
body.dark.contact-page .cta-section{background:#171522 !important;}
body.dark.contact-page .cta-box{background:linear-gradient(135deg,#3f316f,#6651a8) !important;color:#fff;box-shadow:0 22px 55px rgba(0,0,0,.32);}
body.dark.contact-page .cta-content h2,body.dark.contact-page .cta-content p,body.dark.contact-page .cta-content .section-kicker{color:#fff;}
body.dark.contact-page .cta-content .section-kicker::before{background:#e6ddff;}
body.dark.contact-page .cta-box .btn-primary{background:#fff;color:#4d3b86;}
body.dark.contact-page .cta-box .btn-outline{color:#fff;border-color:rgba(255,255,255,.45);background:transparent;}
body.dark.contact-page .booking-intro-photo{background:#242031;border-color:rgba(225,216,255,.14);}
body.dark.contact-page .booking-photo-tag{background:rgba(20,18,30,.86);color:#fff;}
body.dark.contact-page .booking-list div{color:var(--ink-soft);}
body.dark.contact-page .form-card h3,body.dark.contact-page .form-card label,body.dark.contact-page .form-card .field,body.dark.contact-page .form-card .form-top p,body.dark.contact-page .form-card .form-note{color:var(--ink);}
body.dark.contact-page .form-card input,body.dark.contact-page .form-card select,body.dark.contact-page .form-card textarea{background:#1d1a29;color:#f7f3ff;border-color:rgba(225,216,255,.16);}
body.dark.contact-page .form-card input::placeholder,body.dark.contact-page .form-card textarea::placeholder{color:#aaa1bc;}
body.dark.contact-page .form-card select option{background:#1d1a29;color:#f7f3ff;}
body.dark.contact-page .faq-question{color:#f7f3ff;}body.dark.contact-page .faq-answer{color:#d5cee4;}
body.dark.contact-page .info-panel h3,body.dark.contact-page .info-panel strong,body.dark.contact-page .info-panel .address-line{color:#f7f3ff;}
body.dark.contact-page .info-panel p,body.dark.contact-page .info-panel span{color:#d5cee4;}


/* Contact page icon + date control dark-mode fixes */
body.dark.contact-page .info-panel .address-icon{
    background:#332c4a !important;
    color:#e6ddff !important;
    border:1px solid rgba(230,221,255,.12);
}
body.dark.contact-page .form-card input[type="date"]{
    color-scheme:dark;
    color:#f7f3ff !important;
}
body.dark.contact-page .form-card input[type="date"]::-webkit-calendar-picker-indicator{
    filter:invert(1) brightness(1.25);
    opacity:.95;
    cursor:pointer;
}
body.dark.contact-page .booking-intro-photo{
    min-height:340px;
}
@media(max-width:900px){
    body.dark.contact-page .booking-intro-photo{min-height:320px;}
}
@media(max-width:600px){
    body.dark.contact-page .booking-intro-photo{min-height:260px;}
}


/* ORVI DOCTORS — ISOLATED DARK MODE */
body.dark.doctors-page .doctor-hero{background:radial-gradient(circle at 80% 15%,rgba(102,81,168,.22),transparent 32%),linear-gradient(135deg,#211d30,#171522);color:#f7f3ff;}
body.dark.doctors-page .doctor-hero h1{color:#f7f3ff;}
body.dark.doctors-page .doctor-hero h1 em{color:#b9a8ea;}
body.dark.doctors-page .doctor-hero-copy{color:#d5cee4;}
body.dark.doctors-page .hero-badge{background:rgba(38,33,53,.94);border:1px solid rgba(225,216,255,.12);}
body.dark.doctors-page .hero-badge strong{color:#b9a8ea;}
body.dark.doctors-page .hero-badge span{color:#d5cee4;}
body.dark.doctors-page .team-intro h2,body.dark.doctors-page .doctor-name,body.dark.doctors-page .focus-head h2,body.dark.doctors-page .method-head h2{color:#f7f3ff;}
body.dark.doctors-page .team-intro p,body.dark.doctors-page .focus-head p,body.dark.doctors-page .method-head>p,body.dark.doctors-page .doctor-bio,body.dark.doctors-page .meta-item span,body.dark.doctors-page .method-step p{color:#d5cee4;}
body.dark.doctors-page .doctor-title{color:#b9a8ea;}
body.dark.doctors-page .doctor-role,body.dark.doctors-page .doctors-heading .section-kicker,body.dark.doctors-page .team-intro .section-kicker,body.dark.doctors-page .focus-head .section-kicker,body.dark.doctors-page .method-head .section-kicker{color:#a996e0;}
body.dark.doctors-page .specialties span{background:#2d2940;color:#eee9f8;border-color:rgba(225,216,255,.24);}
body.dark.doctors-page .doctor-actions .btn-primary{background:#7058ba;color:#fff;border-color:#7058ba;box-shadow:0 10px 25px rgba(0,0,0,.28);}
body.dark.doctors-page .doctor-actions .btn-primary:hover{background:#8068c8;color:#fff;}
body.dark.doctors-page .text-link{color:#b9a8ea;}
body.dark.doctors-page .focus-section{background:#211d30;}
body.dark.doctors-page .focus-card{background:#2a2540;}
body.dark.doctors-page .method-step{color:#f7f3ff;}
body.dark.doctors-page .method-num,body.dark.doctors-page .method-tag{color:#b9a8ea;}
body.dark.doctors-page .find-box{background:#3f316f;color:#fff;}
body.dark.doctors-page .find-box h2{color:#fff;}
body.dark.doctors-page .find-box p,body.dark.doctors-page .find-note{color:#e1d9f0;}
body.dark.doctors-page .choice label{color:#fff;background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.28);}
body.dark.doctors-page .choice label::after{background:rgba(255,255,255,.14);color:#fff;}
body.dark.doctors-page .choice input:checked+label{background:#fff;color:#4d3b86;border-color:#fff;}
body.dark.doctors-page .find-submit{background:#fff;color:#4d3b86;}
body.dark.doctors-page .find-submit:hover{background:#f4efff;color:#4d3b86;}
body.dark.doctors-page .cta-section .cta-box{background:#2a2540;color:#f7f3ff;}
body.dark.doctors-page .cta-section .cta-box h2{color:#f7f3ff;}
body.dark.doctors-page .cta-section .cta-box p{color:#d5cee4;}
body.dark.doctors-page .cta-section .section-kicker{color:#e3d8f0;}
body.dark.doctors-page .cta-section .btn-primary{background:#7058ba;color:#fff;}
body.dark.doctors-page .cta-section .btn-outline{background:#242031;color:#f7f3ff;border-color:rgba(225,216,255,.24);}
body.dark.doctors-page .cta-section .btn-outline:hover{background:#302a43;color:#fff;border-color:#a996e0;}




/* ===== PATIENT-DASHBOARD — SCOPED DARK MODE ===== */
html.dark body.patient-dashboard {

      --lavender-50:#17131a;
      --lavender-100:#28202d;
      --lavender-200:#3c2f45;
      --lavender-300:#584366;
      --lavender-400:#816397;
      --lavender-500:#a384ba;
      --lavender-600:#b394ca;
      --lavender-700:#d0b7e2;

      --paper:#211c24;
      --paper-soft:#28222c;

      --ink:#f4eff7;
      --ink-soft:#ddd4e2;
      --muted:#b6aebc;

      --line:#3a323f;

      --success:#9abb9f;
      --success-bg:#243429;

      --warning:#d4ad70;
      --warning-bg:#382d20;

      --danger:#dc9296;
      --danger-bg:#382426;
    }html.dark body.patient-dashboard {
      background:#17131a;
      color:var(--ink);
    }html.dark body.patient-dashboard .topbar {
      background:rgba(23,19,26,.92);
    }html.dark body.patient-dashboard .hero-copy {
      background:
        radial-gradient(
          circle at 100% 0%,
          #2d2333,
          transparent 42%
        );
    }html.dark body.patient-dashboard .hero-photo::after {
      background:
        linear-gradient(
          90deg,
          rgba(20,14,25,.08),
          rgba(20,14,25,.35)
        );
    }html.dark body.patient-dashboard .btn-primary {
      background:#9b78b7;
      color:#fff;
    }html.dark body.patient-dashboard .btn-primary:hover {
      background:#ad89c8;
    }html.dark body.patient-dashboard .btn-outline {
      color:#d3bce3;
      border-color:#715981;
    }html.dark body.patient-dashboard .btn-outline:hover {
      background:#30263a;
    }html.dark body.patient-dashboard .photo-badge {
      color:#29232d;
      background:rgba(255,255,255,.88);
    }html.dark body.patient-dashboard .team-overlay {
      background:
        linear-gradient(
          transparent,
          rgba(15,10,18,.94)
        );
    }


/* ===== ADMIN-DASHBOARD — SCOPED DARK MODE ===== */
body.admin-dashboard.dark {
    --lavender-50:#15131b;
    --lavender-100:#211d2a;
    --lavender-200:#393044;
    --lavender-300:#4c3e5d;

    --paper:#1c1922;
    --white:#24202c;

    --ink:#f5f0fa;
    --muted:#b8afc2;
    --soft:#9990a4;
    --line:#37313e;

    --green:#7cc19d;
    --green-bg:#193328;

    --orange:#e0a866;
    --orange-bg:#392a1b;

    --red:#e18a8a;
    --red-bg:#3a2022;

    --blue:#8db0df;
    --blue-bg:#202f43;

    --shadow-sm:0 8px 25px rgba(0,0,0,.18);
    --shadow-md:0 18px 50px rgba(0,0,0,.25);
}body.admin-dashboard.dark .topbar {
    background:rgba(28,25,34,.92);
}

/* Dashboard compact shell dark-mode parity */
html.dark body.patient-dashboard .portal-switch,
body.admin-dashboard.dark .portal-switch{
    background:rgba(255,255,255,.025);
}
html.dark body.patient-dashboard .topbar,
body.admin-dashboard.dark .topbar{
    border-bottom-color:var(--line);
}

/* =========================================================
   TREATMENTS PAGE — DARK MODE
   ========================================================= */
body.dark.treatments-page{
    --lav:#201b2e;
    --shadow2:0 12px 32px rgba(0,0,0,.25);
    --line:rgba(235,227,255,.14);
}
body.dark.treatments-page .braces-process-editorial{background:var(--paper);}
body.dark.treatments-page .editorial-process-head h2,
body.dark.treatments-page .road-copy h3,
body.dark.treatments-page .editorial-process-note b{color:#fff;}
body.dark.treatments-page .editorial-process-head>p,
body.dark.treatments-page .road-copy p,
body.dark.treatments-page .editorial-process-note span{color:#c7c1cf;}
body.dark.treatments-page .road-line{background:linear-gradient(90deg,rgba(207,193,255,.1),#9f8bd6,rgba(207,193,255,.1));}
body.dark.treatments-page .road-marker{background:var(--paper);box-shadow:0 0 0 7px var(--paper);}
body.dark.treatments-page .road-step.active .road-marker,
body.dark.treatments-page .road-step:hover .road-marker{background:#9f8bd6;border-color:#9f8bd6;color:#fff;box-shadow:0 0 0 7px var(--paper),0 9px 25px rgba(0,0,0,.25);}
body.dark.treatments-page .editorial-process-note{border-color:rgba(255,255,255,.1);}
body.dark.treatments-page .editorial-process-note>div+div{border-color:rgba(255,255,255,.1);}
@media (max-width:650px){
body.dark.treatments-page .editorial-process-note>div+div{border-top-color:rgba(255,255,255,.1);}
}
body.dark.treatments-page .editorial-process-note .process-note-item{background:#252130;}
body.dark.treatments-page .editorial-process-note .process-note-item.time{background:#252130;}
body.dark.treatments-page .editorial-process-note .process-note-item.adjust{background:#2a2437;}
body.dark.treatments-page .editorial-process-note .process-note-item.role{background:#252130;}
body.dark.treatments-page .editorial-process-note .process-note-item b{color:#fff!important;}
body.dark.treatments-page .editorial-process-note .process-note-item div>span{color:#c9c2d4!important;}
body.dark.treatments-page .hero-tag{background:rgba(36,32,49,.9)}
body.dark.treatments-page .feature-label{background:rgba(36,32,49,.94);color:var(--ink)}
body.dark.treatments-page .compact-step.feature{background:#302a40;border-color:#302a40;}
body.dark.treatments-page .essentials-head p,
body.dark.treatments-page .essential-item p{color:#c7c1cf}
body.dark.treatments-page .essential-item b{color:#fff}



/* ORVI — Home 1 dark mode */
body.dark.home1-page .hm-alt{background:#211d30;}
body.dark .hm-card,
body.dark .hm-doctor,
body.dark .hm-review,
body.dark .hm-mini-stats > div,
body.dark .hm-dot,
body.dark .hm-tab{
    background:#242031;
    border-color:rgba(225,216,255,.12);
}
body.dark .hm-tab.is-active{background:var(--violet);color:#fff;}
body.dark .hm-form{background:#242031;}
body.dark .hm-form input,
body.dark .hm-form select{
    background:#171522;
    color:#f7f3ff;
    border-color:rgba(225,216,255,.15);
}
body.dark .hm-icon,
body.dark .hm-author > span{background:#2d2745;}
body.dark .hm-checks svg{fill:#2d2745;}
body.dark .hm-card:hover .hm-icon{background:var(--violet);}
body.dark .hm-form-msg{color:#cbbdf5;}

/* ORVI — Home 1 upgrade, dark mode */
body.dark .hm-tabs,
body.dark .hm-facts > div,
body.dark .hm-show-item{
    background:#242031;
    border-color:rgba(225,216,255,.12);
}
body.dark .hm-show-item.is-active{background:#2d2745;border-color:var(--violet);}
body.dark .hm-show-num{background:#2d2745;}
body.dark .hm-hint,
body.dark .hm-tag{background:rgba(36,32,49,.92);color:#f7f3ff;}
body.dark .hm-score .ring-bg{stroke:#3a3354;}
body.dark .hm-deco{opacity:.16;}
body.dark .hm-show-chip{background:rgba(36,32,49,.92);color:#f7f3ff;}
body.dark .hm-show-chip i{color:#cbbdf5;}

/* ORVI — Home 1 pricing + FAQ dark mode */
body.dark .hm-plan,
body.dark .hm-faq-item{
    background:#242031;
    border-color:rgba(225,216,255,.12);
}
body.dark .hm-plan.is-featured,
body.dark .hm-faq-item.is-open{border-color:var(--violet);}
body.dark .hm-plan-price{border-color:rgba(225,216,255,.12);}
body.dark .hm-plan-price strong{color:#cbbdf5;}
body.dark .hm-plan-list svg{fill:#2d2745;}
body.dark .hm-faq-icon{background:#2d2745;}
body.dark .hm-faq-item.is-open .hm-faq-icon{background:var(--violet);}
body.dark .hm-faq-q{color:#f7f3ff;}
body.dark .hm-faq-q:hover{color:#cbbdf5;}


/* =========================================================
   ORVI AUTH PAGES — DARK MODE ONLY
   Scoped to body.auth-body so existing pages are unchanged.
   ========================================================= */
body.auth-body.dark-mode {
  --auth-text: #f4f0fb;
  --auth-muted: #b8b1c9;
  --auth-border: #393344;
  --auth-field: #211d2a;
  --auth-bg: #17141d;
  color: var(--auth-text);
  background: var(--auth-bg);
}
body.auth-body.dark-mode .auth-card,
body.auth-body.dark-mode .auth-topbar,
body.auth-body.dark-mode .auth-back,
body.auth-body.dark-mode .auth-control { background: var(--auth-bg); }

/* ABOUT PAGE — ensure labels, patient stories and controls remain readable in dark mode */
body.dark:has(#about) .hero-badge{color:#d8caff !important;background:#29253a !important;border:1px solid rgba(216,202,255,.22) !important;}
body.dark:has(#about) .hero-copy h1,
body.dark:has(#about) .hero-copy p,
body.dark:has(#about) .testimonial-intro h2,
body.dark:has(#about) .testimonial-intro>p,
body.dark:has(#about) .testimonial-slide>p{color:#f6f3ff !important;}
body.dark:has(#about) .testimonial-intro h2 span{color:#b8a2ff !important;}
body.dark:has(#about) .testimonial-intro .section-kicker{color:#c5b4ff !important;}
body.dark:has(#about) .rating-box strong{color:#fff !important;}
body.dark:has(#about) .rating-box span{color:#d2cddd !important;}
body.dark:has(#about) .testimonial-slide .patient strong{color:#fff !important;}
body.dark:has(#about) .testimonial-slide .patient span{color:#c9c3d6 !important;}
body.dark:has(#about) .testimonial-slide .patient-avatar{background:#f0eaff !important;color:#4c397d !important;flex-shrink:0;}
body.dark:has(#about) .testimonial-track{border-color:rgba(223,214,255,.22) !important;}
body.dark:has(#about) .testimonial-slider::before,
body.dark:has(#about) .testimonial-slider::after{background:rgba(223,214,255,.32) !important;}
body.dark:has(#about) .testimonial-controls button{background:#282337 !important;color:#f8f5ff !important;border-color:rgba(223,214,255,.3) !important;}
body.dark:has(#about) .testimonial-controls button:hover{background:#514078 !important;color:#fff !important;}


/* CONTACT PAGE — dark-mode visibility fixes */
body.dark.contact-page .hero-badge,
body.dark.contact-page .contact-hero .hero-badge {
  color: #c4b5fd !important;
  background: rgba(102, 81, 168, .18) !important;
  border-color: rgba(196, 181, 253, .28) !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
body.dark.contact-page .form-card input[type="date"],
body.dark.contact-page .form-card input[type="date"]:focus {
  color: #f7f3ff !important;
  background-color: #211d30 !important;
  border-color: #51436f !important;
  color-scheme: dark;
  opacity: 1 !important;
}
body.dark.contact-page .form-card input[type="date"]::-webkit-calendar-picker-indicator {
  filter: invert(1) brightness(1.7) !important;
  opacity: 1 !important;
}
body.dark.contact-page .form-card input[type="date"]::-moz-calendar-picker-indicator {
  filter: invert(1) brightness(1.7) !important;
}


/* FINAL FIX: force the native date-picker calendar icon to white in dark mode */
html[data-theme="dark"] body.contact-page input[type="date"]::-webkit-calendar-picker-indicator,
body.dark.contact-page input[type="date"]::-webkit-calendar-picker-indicator,
[data-theme="dark"] body.contact-page input[type="date"]::-webkit-calendar-picker-indicator,
body.contact-page.dark input[type="date"]::-webkit-calendar-picker-indicator {
  filter: brightness(0) invert(1) !important;
  opacity: 1 !important;
  cursor: pointer;
}

html[data-theme="dark"] body.contact-page input[type="date"],
body.dark.contact-page input[type="date"],
[data-theme="dark"] body.contact-page input[type="date"],
body.contact-page.dark input[type="date"] {
  color-scheme: dark !important;
}


/* CONTACT PAGE: force the native date calendar glyph to white.
   The date input lives inside .field (not .form-card). */
body.dark.contact-page .field input[type="date"] {
  color-scheme: dark !important;
  -webkit-appearance: auto !important;
  appearance: auto !important;
}
body.dark.contact-page .field input[type="date"]::-webkit-calendar-picker-indicator {
  opacity: 1 !important;
  filter: brightness(0) invert(1) !important;
  -webkit-filter: brightness(0) invert(1) !important;
  cursor: pointer !important;
}
body.dark.contact-page .field input[type="date"]::-webkit-clear-button,
body.dark.contact-page .field input[type="date"]::-webkit-inner-spin-button {
  filter: brightness(0) invert(1) !important;
}


/* =========================================================
   LOGIN / REGISTER VISIBILITY HOTFIX
   Handles both the auth toggle class (.dark-mode) and the
   main-site shared theme class (.dark). Never leave pale
   text on a white auth card.
   ========================================================= */
body.auth-body:not(.dark-mode):not(.dark) {
  --auth-text: #282435 !important;
  --auth-muted: #625d70 !important;
  --auth-purple: #5f489f !important;
  --auth-border: #e2dced !important;
  --auth-field: #fbfaff !important;
  --auth-bg: #ffffff !important;
  color: #282435 !important;
  background: #f7f5fb !important;
}
body.auth-body:not(.dark-mode):not(.dark) .auth-card {
  background: #ffffff !important;
  color: #282435 !important;
  border-color: #e2dced !important;
}
body.auth-body:not(.dark-mode):not(.dark) .auth-brand strong,
body.auth-body:not(.dark-mode):not(.dark) .auth-card h1,
body.auth-body:not(.dark-mode):not(.dark) .auth-form label,
body.auth-body:not(.dark-mode):not(.dark) .auth-check,
body.auth-body:not(.dark-mode):not(.dark) .auth-switch {
  color: #282435 !important;
}
body.auth-body:not(.dark-mode):not(.dark) .auth-brand small,
body.auth-body:not(.dark-mode):not(.dark) .auth-intro,
body.auth-body:not(.dark-mode):not(.dark) .auth-row {
  color: #625d70 !important;
}
body.auth-body.dark,
body.auth-body.dark-mode {
  --auth-text: #f7f3ff !important;
  --auth-muted: #c8bfdc !important;
  --auth-purple: #c4b2ff !important;
  --auth-border: #40364f !important;
  --auth-field: #211b2c !important;
  --auth-bg: #17131e !important;
  color: #f7f3ff !important;
  background: #17131e !important;
  color-scheme: dark;
}
body.auth-body.dark .auth-card,
body.auth-body.dark-mode .auth-card {
  background: #211b2a !important;
  color: #f7f3ff !important;
  border-color: #40364f !important;
}
body.auth-body.dark .auth-brand strong,
body.auth-body.dark .auth-card h1,
body.auth-body.dark .auth-form label,
body.auth-body.dark .auth-check,
body.auth-body.dark .auth-switch,
body.auth-body.dark-mode .auth-brand strong,
body.auth-body.dark-mode .auth-card h1,
body.auth-body.dark-mode .auth-form label,
body.auth-body.dark-mode .auth-check,
body.auth-body.dark-mode .auth-switch {
  color: #f7f3ff !important;
}
body.auth-body.dark .auth-brand small,
body.auth-body.dark .auth-intro,
body.auth-body.dark .auth-row,
body.auth-body.dark-mode .auth-brand small,
body.auth-body.dark-mode .auth-intro,
body.auth-body.dark-mode .auth-row {
  color: #c8bfdc !important;
}
body.auth-body.dark .auth-field input,
body.auth-body.dark .auth-password input,
body.auth-body.dark-mode .auth-field input,
body.auth-body.dark-mode .auth-password input {
  background: #17131e !important;
  color: #ffffff !important;
  border-color: #514663 !important;
}
body.auth-body.dark .auth-field input::placeholder,
body.auth-body.dark .auth-password input::placeholder,
body.auth-body.dark-mode .auth-field input::placeholder,
body.auth-body.dark-mode .auth-password input::placeholder {
  color: #b8aecb !important;
  opacity: 1 !important;
}
body.auth-body.dark .auth-topbar,
body.auth-body.dark-mode .auth-topbar,
body.auth-body.dark .auth-control,
body.auth-body.dark-mode .auth-control,
body.auth-body.dark .auth-back,
body.auth-body.dark-mode .auth-back {
  background: #17131e !important;
  color: #f7f3ff !important;
  border-color: #40364f !important;
}
body.auth-body.dark .auth-back span,
body.auth-body.dark-mode .auth-back span,
body.auth-body.dark .auth-forgot,
body.auth-body.dark-mode .auth-forgot,
body.auth-body.dark .auth-password button,
body.auth-body.dark-mode .auth-password button,
body.auth-body.dark .auth-switch a,
body.auth-body.dark-mode .auth-switch a {
  color: #c4b2ff !important;
}
body.auth-body.dark .auth-submit,
body.auth-body.dark-mode .auth-submit {
  color: #ffffff !important;
  background: #6651a8 !important;
}


/* ---------- HOME 2 (sections 1–3) ---------- */
body.dark .h2-concern.is-active{background:#2d2745;border-color:var(--violet);}
body.dark .h2-c-icon,
body.dark .h2-tag,
body.dark .h2-open{background:#2d2745;color:#cbbdf5;}
body.dark .h2-concern.is-active .h2-c-icon{background:var(--violet);color:#fff;}
body.dark .h2-facts li{background:#211d30;}
body.dark .h2-days li.is-today{background:#2d2745;}
body.dark .h2-days li.is-today span:last-child{color:#cbbdf5;}
body.dark .h2-plan-chip{background:#242031;}
body.dark .h2-plan-chip.is-active{background:var(--violet);}
body.dark .h2-checklist svg{fill:#2d2745;}
body.dark .h2-avatars img,
body.dark .h2-orbit{border-color:#171522;}
body.dark .h2-team-stack img{border-color:#211e2d;}
body.dark .h2-result-chip{background:rgba(36,32,49,.92);color:#f7f3ff;}
body.dark .h2-result-chip i{color:#cbbdf5;}
body.dark .h2-tooth{fill:#f4f0ff;}
body.dark .h2-chart .dot{fill:#211e2d;}
body.dark .h2-timeline i::after{background:#211e2d;}
body.dark .h2-range input{background:linear-gradient(90deg,var(--violet) var(--p,33%),#3a3354 var(--p,33%));}
body.dark .h2-text-link{color:#cbbdf5;}

body.dark .h2-callout{background:#211d30;}
body.dark .h2-callout:hover{background:#2d2745;}

/* HOME 2 — SECTIONS 4–6 */
body.dark .h2-step-dot{background:#242031;border-color:#3a3354;color:#cbbdf5;}
body.dark .h2-step.is-active .h2-step-dot{background:var(--violet);border-color:var(--violet);color:#fff;}
body.dark .h2-step.is-done .h2-step-dot{border-color:var(--violet);}
body.dark .h2-steps-line{background:#3a3354;}
body.dark .h2-step strong{color:#f7f3ff;}
body.dark .h2-step-btn{background:#242031;border-color:#3a3354;color:#cbbdf5;}
body.dark .h2-step-btn:hover{background:var(--violet);color:#fff;}
body.dark .h2-quote-mark{color:#2d2745;}
body.dark .h2-quote blockquote,
body.dark .h2-quote-by strong{color:#f7f3ff;}
body.dark .h2-who{background:#242031;border-color:#3a3354;}
body.dark .h2-who span{background:#2d2745;color:#cbbdf5;}
body.dark .h2-who.is-active{background:#2d2745;border-color:var(--violet);color:#f7f3ff;}
body.dark .h2-who.is-active span{background:var(--violet);color:#fff;}
body.dark .h2-quote-pick{border-top-color:#3a3354;}
body.dark .h2-ask-copy h2{color:#f7f3ff;}


/* ===== merged from rtl.css ===== */
/* ORVI — RTL styles extracted from finalized About page */

html[dir="rtl"] .back-to-top{
    right:auto;
    left:22px;
}
@media (max-width:600px) {
html[dir="rtl"] .back-to-top{
        right:auto;
        left:14px;
    }
}
html[dir="rtl"] body{
    text-align:right;
}
html[dir="rtl"] .nav-actions{
    margin-left:0;
    margin-right:auto;
}
html[dir="rtl"] .brand{
    direction:rtl;
}
html[dir="rtl"] .nav-links{
    direction:rtl;
}
html[dir="rtl"] .dropdown-menu{
    left:auto;
    right:50%;

    transform:
        translate(50%,8px)
        scale(.97);
}
html[dir="rtl"]
.nav-dropdown.is-open
.dropdown-menu{
    transform:
        translate(50%,0)
        scale(1);
}
html[dir="rtl"] .mobile-panel{
    direction:rtl;
    text-align:right;
}
html[dir="rtl"] .mobile-home-links{
    padding-left:0;
    padding-right:12px;
}
html[dir="rtl"] .history-main-image{
    right:40px;
    left:0;
}
html[dir="rtl"] .history-year{
    right:auto;
    left:0;
}
html[dir="rtl"] .mission-quote{
    border-left:0;
    border-right:3px solid var(--violet);

    border-radius:16px 0 0 16px;
}
html[dir="rtl"] .footer-col{
    align-items:flex-start;
}
html[dir="rtl"] .footer-contact-item{
    direction:rtl;
}
html[dir="rtl"] .footer-col a:hover{
    transform:translateX(-3px);
}
html[dir="rtl"] .back-to-top{
    right:auto;
    left:22px;
}
html[dir="rtl"] .testimonial-intro{text-align:right !important;}
html[dir="rtl"] .testimonial-controls{right:auto !important;left:10px !important;}
html[dir="rtl"] .testimonial-slide .patient{
  grid-column:3 !important;
  justify-content:flex-end !important;
  text-align:right !important;
}
html[dir="rtl"] .testimonial-slide>p{grid-column:2 !important;}
html[dir="rtl"] .testimonial-controls{justify-content:flex-start !important;}
@media (max-width:800px) {
.testimonial-slide .patient,
  html[dir="rtl"] .testimonial-slide .patient{
    grid-column:1 !important;
    grid-row:2 !important;
    justify-content:center !important;
    text-align:center !important;
  }
html[dir="rtl"] .testimonial-controls{justify-content:center !important;}
}


/* =========================================================
   CONTACT PAGE RTL
   ========================================================= */
html[dir="rtl"] .quick-item{border-right:0;border-left:1px solid var(--border);}
html[dir="rtl"] .quick-item:last-child{border-left:0;}
html[dir="rtl"] .hero-note{left:auto;right:0;}
html[dir="rtl"] .map-card{direction:ltr;}
html[dir="rtl"] .faq-question{text-align:right;}


/* ORVI DOCTORS — ISOLATED RTL */
html[dir="rtl"] body.doctors-page .doctor-card.reverse .doctor-photo{order:1;}
html[dir="rtl"] body.doctors-page .doctor-card.reverse .doctor-details{order:2;}
html[dir="rtl"] body.doctors-page .doctor-number{left:auto;right:16px;}
html[dir="rtl"] body.doctors-page .method-step{border-right:0;border-left:1px solid var(--border);}
html[dir="rtl"] body.doctors-page .method-step:last-child{border-left:0;}
@media(max-width:900px){
 html[dir="rtl"] body.doctors-page .doctor-card.reverse .doctor-photo,
 html[dir="rtl"] body.doctors-page .doctor-card.reverse .doctor-details{order:initial;}
}
@media(max-width:600px){
 html[dir="rtl"] body.doctors-page .doctor-number{right:12px;left:auto;}
 html[dir="rtl"] body.doctors-page .method-step{border-left:0;border-right:0;border-bottom:1px solid var(--border);}
}



/* ===== PATIENT-DASHBOARD — SCOPED RTL ===== */
html.rtl body.patient-dashboard .sidebar {

      left:auto;
      right:0;

      border-right:0;

      border-left:1px solid var(--line);
    }html.rtl body.patient-dashboard .main-area {

      margin-left:0;

      margin-right:var(--sidebar-width);
    }html.rtl body.patient-dashboard .nav-item {

      text-align:right;
    }html.rtl body.patient-dashboard .nav-item.active {

      box-shadow:
        inset -3px 0 0 var(--lavender-600);
    }html.rtl body.patient-dashboard .patient-mini {

      margin-left:0;

      margin-right:7px;

      padding-left:0;

      padding-right:15px;

      border-left:0;

      border-right:1px solid var(--line);
    }html.rtl body.patient-dashboard .timeline {

      padding-left:0;

      padding-right:25px;
    }html.rtl body.patient-dashboard .timeline::before {

      left:auto;

      right:5px;
    }html.rtl body.patient-dashboard .timeline-item {

      padding-left:0;

      padding-right:20px;
    }html.rtl body.patient-dashboard .timeline-item::before {

      left:auto;

      right:-25px;
    }html.rtl body.patient-dashboard .installment-amount {

      text-align:left;
    }html.rtl body.patient-dashboard .hero-photo-caption {

      left:auto;

      right:22px;
    }html.rtl body.patient-dashboard .treatment-image-label {

      left:auto;

      right:22px;
    }html.rtl body.patient-dashboard .team-overlay {

      text-align:right;
    }@media (max-width:640px) {html.rtl body.patient-dashboard .sidebar {

        transform:translateX(105%);
      }html.rtl body.patient-dashboard .sidebar.open {

        transform:translateX(0);
      }html.rtl body.patient-dashboard .main-area {

        margin-right:0;
      }}


/* ===== ADMIN-DASHBOARD — SCOPED RTL ===== */
body.admin-dashboard.rtl {
    direction:rtl;
}body.admin-dashboard.rtl .sidebar {
    left:auto;
    right:0;
    border-right:0;
    border-left:1px solid var(--line);
}body.admin-dashboard.rtl .main {
    margin-left:0;
    margin-right:var(--sidebar-width);
}body.admin-dashboard.rtl .nav-item {
    text-align:right;
}body.admin-dashboard.rtl .top-admin {
    margin-left:0;
    margin-right:7px;
    padding-left:0;
    padding-right:14px;
    border-left:0;
    border-right:1px solid var(--line);
}body.admin-dashboard.rtl .patient-table th,
body.admin-dashboard.rtl .patient-table td {
    text-align:right;
}body.admin-dashboard.rtl .quick-action {
    text-align:right;
}@media(max-width:900px){body.admin-dashboard.rtl .sidebar {
        right:-100%;
        left:auto;
    }body.admin-dashboard.rtl .sidebar.open {
        right:0;
    }body.admin-dashboard .main,
body.admin-dashboard.rtl .main {
        margin-left:0;
        margin-right:0;
    }}

/* Dashboard shell RTL alignment */
html.rtl body.patient-dashboard .portal-link,
body.admin-dashboard.rtl .portal-link{
    text-align:right;
}
html.rtl body.patient-dashboard .topbar,
body.admin-dashboard.rtl .topbar{
    direction:rtl;
}

/* =========================================================
   TREATMENTS PAGE — RTL
   ========================================================= */
html[dir="rtl"] .treatments-page .treat-float-card{left:auto;right:-32px}
html[dir="rtl"] .treatments-page .treat-orbit{right:auto;left:-22px}
html[dir="rtl"] .treatments-page .aligner-note{left:auto;right:-30px}
html[dir="rtl"] .treatments-page .detail-points{direction:rtl}
html[dir="rtl"] .treatments-page .treatment-feature ul{padding-left:0;padding-right:19px}
html[dir="rtl"] .treatments-page .treatment-feature a span,
html[dir="rtl"] .treatments-page .text-link span{transform:rotate(180deg)}
html[dir="rtl"] .treatments-page .treatment-feature a:hover span,
html[dir="rtl"] .treatments-page .text-link:hover span{transform:rotate(180deg) translateX(4px)}
@media(max-width:720px){
  html[dir="rtl"] .treatments-page .treat-float-card{right:10px}
  html[dir="rtl"] .treatments-page .aligner-note{right:10px}
}



/* ORVI — Home 1 RTL */
html[dir="rtl"] .hm-review{direction:rtl;text-align:right;}
html[dir="rtl"] .hm-steps::before{transform-origin:right;}
html[dir="rtl"] .hm-link span,
html[dir="rtl"] .hm-compare-knob{display:inline-block;}
html[dir="rtl"] .hm-link span{transform:scaleX(-1);}
html[dir="rtl"] .hm-card:hover .hm-link span{transform:scaleX(-1) translateX(5px);}
html[dir="rtl"] .hm-float{right:auto;left:-10px;}
html[dir="rtl"] .hm-split-copy,
html[dir="rtl"] .hm-cta-copy,
html[dir="rtl"] .hm-form{direction:rtl;text-align:right;}
html[dir="rtl"] .hm-step{text-align:center;}
html[dir="rtl"] .hm-checks li{flex-direction:row;}
@media(max-width:640px){
    html[dir="rtl"] .hm-float{right:auto;left:0;}
}

/* ORVI — Home 1 upgrade, RTL */
html[dir="rtl"] .hm-progress-bar{left:auto;right:0;transform-origin:right;}
html[dir="rtl"] .hm-show-item{text-align:right;}
html[dir="rtl"] .hm-show-item:hover{transform:translateX(-5px);}
html[dir="rtl"] .hm-show-item.is-active{transform:translateX(-10px);}
html[dir="rtl"] .hm-progress{left:auto;right:0;}
html[dir="rtl"] .hm-score{left:auto;right:-18px;}
html[dir="rtl"] .hm-btn-light span{margin-left:0;margin-right:6px;transform:scaleX(-1);}
html[dir="rtl"] .hm-btn-light:hover span{transform:scaleX(-1) translateX(4px);}
html[dir="rtl"] .hm-show-info,
html[dir="rtl"] .hm-facts{direction:rtl;text-align:right;}
html[dir="rtl"] .hm-tabs{direction:rtl;}
@media(max-width:900px){
    html[dir="rtl"] .hm-show-item:hover,
    html[dir="rtl"] .hm-show-item.is-active{transform:translateY(-3px);}
}
html[dir="rtl"] .hm-show-chip{left:auto;right:12px;}

/* ORVI — Home 1 pricing + FAQ RTL */
html[dir="rtl"] .hm-plan,
html[dir="rtl"] .hm-faq{direction:rtl;text-align:right;}
html[dir="rtl"] .hm-plan .btn{text-align:center;}
html[dir="rtl"] .hm-faq-q{text-align:right;}

/* ORVI — Home 1 hero + How It Works RTL */
html[dir="rtl"] .hm-fl-1{left:auto;right:-28px;}
html[dir="rtl"] .hm-fl-2{right:auto;left:-24px;}
html[dir="rtl"] .hm-j-points{text-align:right;}
@media(max-width:900px){
    html[dir="rtl"] .hm-j-card{text-align:right;}
}


/* =========================================================
   ORVI AUTH PAGES — RTL ONLY
   Scoped to auth pages; does not change the rest of the site.
   ========================================================= */
html[dir="rtl"] body.auth-body .auth-password input { padding: 0 13px 0 62px; }
html[dir="rtl"] body.auth-body .auth-password button { right: auto; left: 12px; }
html[dir="rtl"] body.auth-body .auth-back { flex-direction: row-reverse; }


/* ---------- HOME 2 (sections 1–3) ---------- */
html[dir="rtl"] .h2-flip{transform:scaleX(-1);}
html[dir="rtl"] .h2-concern:hover{transform:translateX(-6px);}
html[dir="rtl"] .h2-c-arrow{transform:translateX(8px);}
html[dir="rtl"] .h2-concern.is-active .h2-c-arrow,
html[dir="rtl"] .h2-concern:hover .h2-c-arrow{transform:none;}
html[dir="rtl"] .h2-progress,
html[dir="rtl"] .h2-bar i,
html[dir="rtl"] .h2-prog-bar i{transform-origin:right;}
html[dir="rtl"] .h2-text-link:hover span{transform:scaleX(-1) translateX(5px);}
html[dir="rtl"] .h2-hero-copy,
html[dir="rtl"] .h2-result-body,
html[dir="rtl"] .h2-tile,
html[dir="rtl"] .h2-concern{direction:rtl;text-align:right;}
html[dir="rtl"] .h2-teeth,
html[dir="rtl"] .h2-chart svg,
html[dir="rtl"] .h2-seal svg.ring{direction:ltr;}
@media(max-width:1000px){
    html[dir="rtl"] .h2-concern:hover{transform:translateY(-3px);}
}

/* HOME 2 — SECTIONS 4–6 */
html[dir="rtl"] .h2-steps-line i,
html[dir="rtl"] .h2-rating-bars .h2-bar i{transform-origin:right;}
html[dir="rtl"] .h2-step-nav .btn{margin:0 6px 0 0;}
html[dir="rtl"] .h2-step-panel .h2-result-body,
html[dir="rtl"] .h2-rating,
html[dir="rtl"] .h2-quote,
html[dir="rtl"] .h2-book,
html[dir="rtl"] .h2-ask-copy,
html[dir="rtl"] .h2-who{direction:rtl;text-align:right;}
html[dir="rtl"] .hm-faq-q{text-align:right;}
@media(max-width:640px){
    html[dir="rtl"] .h2-step-nav .btn{margin:0;}
}


/* ===== merged from treatments.css ===== */
/* =========================================================
   ORVI — TREATMENTS PAGE (rebuilt)
   All selectors are prefixed tx- so nothing leaks into other pages.
   Uses the site tokens from style.css (--violet, --ink, --paper ...)
   and follows body.dark / html[dir="rtl"] like the rest of the site.
   ========================================================= */

body.tx-page{
  --tx-violet:var(--violet,#6651a8);
  --tx-violet-d:var(--violet-dark,#4d3b86);
  --tx-soft:var(--violet-soft,#eee9fb);
  --tx-tooth:#fbf7ee;
  --tx-tooth-edge:#d9d0bd;
  --tx-wire:#8b8fa3;
  --tx-gum:#f2b9c0;
  --tx-aligner:rgba(120,170,255,.28);
  --tx-card:#ffffff;
  --tx-line:rgba(91,72,139,.16);
  --tx-green:#2f9e78;
  --tx-amber:#d98a2b;
  background:var(--paper);
}
body.dark.tx-page{
  --tx-card:#211e2d;
  --tx-line:rgba(225,216,255,.14);
  --tx-tooth:#f1ead9;
  --tx-tooth-edge:#a79f8d;
  --tx-wire:#b8bcd0;
  --tx-gum:#b4606f;
  --tx-soft:#2a2540;
}

.tx-wrap{width:min(1180px,calc(100% - 48px));margin-inline:auto}
.tx-sec{padding:96px 0;position:relative}
.tx-kicker{display:inline-flex;align-items:center;gap:10px;font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--tx-violet)}
.tx-kicker::before{content:"";width:28px;height:2px;background:currentColor;border-radius:2px}
.tx-h2{font-family:var(--serif);font-size:clamp(30px,4.2vw,50px);line-height:1.1;color:var(--ink);margin:14px 0 16px;font-weight:600}
.tx-h2 em{font-style:normal;color:var(--tx-violet)}
.tx-lead{font-size:18px;line-height:1.7;color:var(--ink-soft);max-width:640px}
.tx-head{max-width:760px;margin-bottom:52px}
.tx-head.center{margin-inline:auto;text-align:center}
.tx-head.center .tx-lead{margin-inline:auto}
.tx-btn{display:inline-flex;align-items:center;gap:10px;padding:15px 28px;border-radius:999px;font-weight:700;font-size:15px;text-decoration:none;border:2px solid transparent;transition:transform .3s,box-shadow .3s,background .3s,color .3s;cursor:pointer;font-family:inherit}
.tx-btn.primary{background:var(--tx-violet);color:#fff;box-shadow:0 14px 30px rgba(102,81,168,.28)}
.tx-btn.primary:hover{transform:translateY(-3px);background:var(--tx-violet-d)}
.tx-btn.ghost{border-color:var(--tx-violet);color:var(--tx-violet);background:transparent}
.tx-btn.ghost:hover{background:var(--tx-violet);color:#fff;transform:translateY(-3px)}
.tx-btn.light{background:#fff;color:var(--tx-violet-d)}
.tx-btn.light:hover{transform:translateY(-3px)}

/* ---------- reveal (own, so it works even if main.js changes) ---------- */
.tx-rv{opacity:0;transform:translateY(34px);transition:opacity .8s cubic-bezier(.2,.75,.25,1),transform .8s cubic-bezier(.2,.75,.25,1)}
.tx-rv.in{opacity:1;transform:none}
.tx-rv.d1{transition-delay:.12s}.tx-rv.d2{transition-delay:.24s}.tx-rv.d3{transition-delay:.36s}
.tx-rv.left{transform:translateX(-40px)}.tx-rv.right{transform:translateX(40px)}
.tx-rv.left.in,.tx-rv.right.in{transform:none}

/* ---------- scroll progress ---------- */
.tx-progress{position:fixed;top:var(--orvi-header-h,76px);left:0;height:3px;width:0;background:linear-gradient(90deg,#9f8bd6,var(--tx-violet));z-index:99990;transition:width .1s linear}

/* =========================================================
   HERO
   ========================================================= */
.tx-hero{padding:70px 0 90px;background:
  radial-gradient(circle at 85% 10%,rgba(102,81,168,.16),transparent 38%),
  radial-gradient(circle at 5% 90%,rgba(159,139,214,.14),transparent 34%),var(--lavender);overflow:hidden}
.tx-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.tx-hero h1{font-family:var(--serif);font-size:clamp(38px,5.4vw,66px);line-height:1.05;color:var(--ink);margin:18px 0 22px;font-weight:600}
.tx-hero h1 em{font-style:normal;color:var(--tx-violet);display:block}
.tx-hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin:30px 0 26px}
.tx-hero-points{display:flex;flex-wrap:wrap;gap:10px 22px;font-size:14px;color:var(--ink-soft);font-weight:500}
.tx-hero-points span::before{content:"✓";color:var(--tx-green);font-weight:800;margin-right:8px}
.tx-hero-visual{position:relative;min-height:460px}
.tx-hero-photo{position:absolute;inset:0 0 70px 40px;border-radius:30px;overflow:hidden;box-shadow:var(--shadow)}
.tx-hero-photo img,.tx-hero-mini img{width:100%;height:100%;object-fit:cover;display:block}
.tx-hero-photo img{animation:txKen 18s ease-in-out infinite alternate}
@keyframes txKen{from{transform:scale(1)}to{transform:scale(1.09)}}
.tx-hero-mini{position:absolute;left:0;bottom:0;width:46%;aspect-ratio:4/3;border-radius:22px;overflow:hidden;border:6px solid var(--paper);box-shadow:var(--shadow);animation:txFloat 6s ease-in-out infinite}
.tx-hero-badge{position:absolute;right:-8px;top:34px;background:var(--tx-card);border:1px solid var(--tx-line);border-radius:18px;padding:14px 18px;box-shadow:var(--shadow);animation:txFloat 5s ease-in-out infinite .8s;max-width:210px}
.tx-hero-badge b{display:block;font-size:15px;color:var(--ink)}
.tx-hero-badge span{font-size:13px;color:var(--muted)}
@keyframes txFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}

/* ---------- sticky sub nav ---------- */
.tx-subnav{position:sticky;top:var(--orvi-header-h,76px);z-index:900;background:color-mix(in srgb,var(--paper) 92%,transparent);backdrop-filter:blur(14px);border-bottom:1px solid var(--tx-line)}
.tx-subnav-in{display:flex;gap:6px;overflow-x:auto;padding:10px 0;scrollbar-width:none}
.tx-subnav-in::-webkit-scrollbar{display:none}
.tx-subnav a{flex:none;padding:9px 18px;border-radius:999px;font-size:14px;font-weight:600;color:var(--ink-soft);text-decoration:none;transition:.3s}
.tx-subnav a:hover{background:var(--tx-soft);color:var(--tx-violet)}
.tx-subnav a.on{background:var(--tx-violet);color:#fff}

/* =========================================================
   THE BIG IDEA — interactive tooth-movement demo
   ========================================================= */
.tx-idea{background:var(--paper)}
.tx-demo{display:grid;grid-template-columns:1.2fr .8fr;gap:30px;align-items:stretch}
.tx-stage{background:var(--tx-card);border:1px solid var(--tx-line);border-radius:28px;padding:26px;box-shadow:var(--shadow-soft);position:relative;overflow:hidden}
.tx-stage-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;font-size:13px;font-weight:700;letter-spacing:.1em;color:var(--muted);text-transform:uppercase}
.tx-stage-top b{color:var(--tx-violet)}
.tx-svg{width:100%;height:auto;display:block}
.tx-slider-box{margin-top:14px}
.tx-slider{-webkit-appearance:none;appearance:none;width:100%;height:8px;border-radius:99px;background:linear-gradient(90deg,var(--tx-violet) var(--p,0%),var(--tx-soft) var(--p,0%));outline:none;cursor:pointer}
.tx-slider::-webkit-slider-thumb{-webkit-appearance:none;width:28px;height:28px;border-radius:50%;background:#fff;border:4px solid var(--tx-violet);box-shadow:0 4px 14px rgba(102,81,168,.4);cursor:grab}
.tx-slider::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:#fff;border:4px solid var(--tx-violet);cursor:grab}
.tx-slider-labels{display:flex;justify-content:space-between;font-size:13px;color:var(--muted);margin-top:10px;font-weight:600}
.tx-demo-side{display:flex;flex-direction:column;gap:14px}
.tx-fact{background:var(--tx-card);border:1px solid var(--tx-line);border-radius:20px;padding:20px 22px;display:flex;gap:16px;align-items:flex-start;transition:transform .3s,box-shadow .3s}
.tx-fact:hover{transform:translateX(6px);box-shadow:var(--shadow-soft)}
.tx-fact i{flex:none;width:44px;height:44px;border-radius:14px;background:var(--tx-soft);color:var(--tx-violet);display:grid;place-items:center;font-style:normal;font-weight:800;font-size:15px}
.tx-fact b{display:block;color:var(--ink);margin-bottom:4px;font-size:16px}
.tx-fact p{font-size:14.5px;line-height:1.6;color:var(--ink-soft)}

/* tooth svg bits */
.tx-tooth{fill:var(--tx-tooth);stroke:var(--tx-tooth-edge);stroke-width:2}
.tx-gum{fill:var(--tx-gum)}

/* =========================================================
   CHOOSER CARDS
   ========================================================= */
.tx-choose{background:var(--lavender)}
.tx-choose-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.tx-choice{position:relative;border-radius:30px;overflow:hidden;min-height:440px;display:flex;align-items:flex-end;text-decoration:none;color:#fff;isolation:isolate;box-shadow:var(--shadow)}
.tx-choice img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform 1.1s cubic-bezier(.2,.75,.25,1)}
.tx-choice::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(30,22,55,.05) 25%,rgba(30,22,55,.92))}
.tx-choice:hover img{transform:scale(1.08)}
.tx-choice-body{padding:34px}
.tx-chip{display:inline-block;background:rgba(255,255,255,.18);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.3);padding:6px 14px;border-radius:99px;font-size:12px;font-weight:700;letter-spacing:.12em;margin-bottom:14px}
.tx-choice h3{font-family:var(--serif);font-size:34px;margin-bottom:10px}
.tx-choice p{color:rgba(255,255,255,.88);line-height:1.65;max-width:460px;font-size:15.5px}
.tx-choice .go{display:inline-flex;gap:8px;margin-top:18px;font-weight:700;transition:gap .3s}
.tx-choice:hover .go{gap:16px}

/* =========================================================
   CHAPTER (braces / aligners)
   ========================================================= */
.tx-chapter{position:relative}
.tx-chapter.braces{background:var(--paper)}
.tx-chapter.aligners{background:var(--lavender)}
.tx-chapter-num{position:absolute;top:30px;right:5%;font-family:var(--serif);font-size:clamp(120px,18vw,240px);line-height:1;color:var(--tx-violet);opacity:.06;font-weight:700;pointer-events:none;user-select:none}
.tx-split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.tx-split.flip .tx-media{order:2}
.tx-media{position:relative}
.tx-media-img{border-radius:28px;overflow:hidden;aspect-ratio:4/3.3;box-shadow:var(--shadow);position:relative}
.tx-media-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.2s cubic-bezier(.2,.75,.25,1)}
.tx-media:hover .tx-media-img img{transform:scale(1.06)}
.tx-pin{position:absolute;display:flex;align-items:center;gap:10px;background:var(--tx-card);color:var(--ink);border:1px solid var(--tx-line);padding:9px 16px 9px 10px;border-radius:99px;font-size:13px;font-weight:700;box-shadow:var(--shadow);animation:txFloat 5s ease-in-out infinite}
.tx-pin::before{content:"";width:12px;height:12px;border-radius:50%;background:var(--tx-violet);box-shadow:0 0 0 0 rgba(102,81,168,.5);animation:txPulse 2s infinite}
@keyframes txPulse{70%{box-shadow:0 0 0 14px rgba(102,81,168,0)}100%{box-shadow:0 0 0 0 rgba(102,81,168,0)}}
.tx-pin.p1{left:-18px;top:14%}.tx-pin.p2{right:-14px;top:46%;animation-delay:.7s}.tx-pin.p3{left:8%;bottom:-16px;animation-delay:1.4s}
.tx-copy h3{font-family:var(--serif);font-size:clamp(26px,3.2vw,38px);color:var(--ink);margin:12px 0 14px;line-height:1.15}
.tx-copy>p{color:var(--ink-soft);line-height:1.75;font-size:16.5px}
.tx-parts{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:26px}
.tx-part{background:var(--tx-card);border:1px solid var(--tx-line);border-radius:18px;padding:18px;transition:.3s}
.tx-part:hover{transform:translateY(-5px);box-shadow:var(--shadow-soft);border-color:var(--tx-violet)}
.tx-part b{display:block;color:var(--ink);margin-bottom:5px}
.tx-part span{font-size:14px;line-height:1.55;color:var(--ink-soft)}

/* ---------- animated BRACES anatomy ---------- */
.tx-anatomy{margin-top:70px;background:var(--tx-card);border:1px solid var(--tx-line);border-radius:30px;padding:36px;box-shadow:var(--shadow-soft)}
.tx-anatomy-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center}
.tx-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.tx-tab{border:1.5px solid var(--tx-line);background:transparent;color:var(--ink-soft);padding:10px 20px;border-radius:99px;font-weight:700;font-size:14px;cursor:pointer;font-family:inherit;transition:.3s}
.tx-tab:hover{border-color:var(--tx-violet);color:var(--tx-violet)}
.tx-tab.on{background:var(--tx-violet);border-color:var(--tx-violet);color:#fff}
.tx-tabpanel{display:none;animation:txFade .6s}
.tx-tabpanel.on{display:block}
@keyframes txFade{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.tx-tabpanel h4{font-size:22px;font-family:var(--serif);color:var(--ink);margin-bottom:10px}
.tx-tabpanel p{color:var(--ink-soft);line-height:1.7;margin-bottom:14px}
.tx-tags{display:flex;flex-wrap:wrap;gap:8px}
.tx-tags span{background:var(--tx-soft);color:var(--tx-violet);padding:6px 14px;border-radius:99px;font-size:13px;font-weight:700}
.tx-bracket-anim .arch{stroke-dasharray:900;stroke-dashoffset:900}
.tx-bracket-anim.in .arch{animation:txDraw 2.4s .3s forwards ease-out}
@keyframes txDraw{to{stroke-dashoffset:0}}
.tx-bracket-anim .brk{opacity:0;transform-box:fill-box;transform-origin:center;transform:scale(.2)}
.tx-bracket-anim.in .brk{animation:txPop .55s forwards cubic-bezier(.3,1.6,.5,1)}
@keyframes txPop{to{opacity:1;transform:scale(1)}}
.tx-callout{opacity:0}
.tx-bracket-anim.in .tx-callout{animation:txFade .7s 2.4s forwards}
.tx-bracket-anim .arch,.tx-bracket-anim .brk,.tx-bracket-anim .tie{transition:opacity .4s,stroke .4s,fill .4s}
.tx-bracket-anim .tie{opacity:0;transform-box:fill-box;transform-origin:center}
.tx-bracket-anim.in .tie{animation:txPop .5s 1.6s forwards cubic-bezier(.3,1.6,.5,1)}
.tx-bracket-anim[data-focus="brackets"] .arch,
.tx-bracket-anim[data-focus="brackets"] .tie,
.tx-bracket-anim[data-focus="wire"] .brk,
.tx-bracket-anim[data-focus="wire"] .tie,
.tx-bracket-anim[data-focus="ties"] .arch,
.tx-bracket-anim[data-focus="ties"] .brk{opacity:.25!important}
.tx-bracket-anim[data-focus="wire"] .arch{stroke:var(--tx-violet);stroke-width:7}
.tx-bracket-anim[data-focus="brackets"] .brk rect{fill:var(--tx-violet)}
.tx-bracket-anim[data-focus="ties"] .tie{fill:#e0568a}

/* brace type cards */
.tx-types{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:70px}
.tx-type{background:var(--tx-card);border:1px solid var(--tx-line);border-radius:26px;overflow:hidden;transition:transform .4s,box-shadow .4s;display:flex;flex-direction:column}
.tx-type:hover{transform:translateY(-10px);box-shadow:var(--shadow)}
.tx-type-img{height:200px;overflow:hidden;position:relative;background:var(--tx-soft)}
.tx-type-img img{width:100%;height:100%;object-fit:cover;transition:transform .9s}
.tx-type:hover .tx-type-img img{transform:scale(1.1)}
.tx-type-svg{display:grid;place-items:center;height:100%;padding:20px}
.tx-type-body{padding:24px;display:flex;flex-direction:column;gap:10px;flex:1}
.tx-type-body small{font-size:12px;font-weight:700;letter-spacing:.14em;color:var(--tx-violet)}
.tx-type-body h4{font-family:var(--serif);font-size:23px;color:var(--ink)}
.tx-type-body p{font-size:15px;line-height:1.65;color:var(--ink-soft)}
.tx-meter{margin-top:auto;display:grid;gap:9px;padding-top:10px}
.tx-meter div{display:grid;grid-template-columns:78px 1fr;align-items:center;gap:10px;font-size:12.5px;font-weight:700;color:var(--muted)}
.tx-meter i{display:block;height:7px;border-radius:9px;background:var(--tx-soft);overflow:hidden;position:relative}
.tx-meter i::after{content:"";position:absolute;inset:0;width:0;background:linear-gradient(90deg,#9f8bd6,var(--tx-violet));border-radius:9px;transition:width 1.4s cubic-bezier(.2,.75,.25,1) .3s}
.tx-type.in .tx-meter i::after{width:var(--w)}

/* =========================================================
   TIMELINE (braces journey) — scroll-drawn line
   ========================================================= */
.tx-journey{background:var(--lavender)}
.tx-timeline{position:relative;max-width:900px;margin:0 auto;padding-left:0}
.tx-tl-line{position:absolute;left:50%;top:0;bottom:0;width:4px;background:var(--tx-line);transform:translateX(-50%);border-radius:4px}
.tx-tl-fill{position:absolute;left:0;top:0;width:100%;height:0;background:linear-gradient(180deg,#9f8bd6,var(--tx-violet));border-radius:4px;transition:height .2s linear}
.tx-tl-item{position:relative;width:50%;padding:0 54px 56px 0;text-align:right}
.tx-tl-item:nth-child(odd){margin-left:0}
.tx-tl-item.r{margin-left:50%;padding:0 0 56px 54px;text-align:left}
.tx-tl-dot{position:absolute;right:-22px;top:0;width:44px;height:44px;border-radius:50%;background:var(--paper);border:3px solid var(--tx-line);display:grid;place-items:center;font-weight:800;font-size:14px;color:var(--muted);transition:.5s;z-index:2}
.tx-tl-item.r .tx-tl-dot{right:auto;left:-22px}
.tx-tl-item.in .tx-tl-dot{background:var(--tx-violet);border-color:var(--tx-violet);color:#fff;box-shadow:0 0 0 8px rgba(102,81,168,.16);transform:scale(1.08)}
.tx-tl-card{background:var(--tx-card);border:1px solid var(--tx-line);border-radius:22px;padding:24px 26px;box-shadow:var(--shadow-soft);transition:.4s}
.tx-tl-card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.tx-tl-card small{font-size:12px;font-weight:700;letter-spacing:.14em;color:var(--tx-violet)}
.tx-tl-card h4{font-family:var(--serif);font-size:22px;color:var(--ink);margin:6px 0 8px}
.tx-tl-card p{font-size:15px;line-height:1.65;color:var(--ink-soft)}
.tx-tl-ico{width:100%;height:70px;margin-bottom:12px}
.tx-notes{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:30px}
.tx-note{background:var(--tx-card);border:1px solid var(--tx-line);border-left:5px solid var(--tx-violet);border-radius:18px;padding:20px 22px}
.tx-note b{display:block;color:var(--ink);margin-bottom:5px}
.tx-note span{font-size:14.5px;line-height:1.6;color:var(--ink-soft)}

/* =========================================================
   LIVING WITH BRACES — day by day
   ========================================================= */
.tx-living{background:var(--paper)}
.tx-days{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.tx-day{background:var(--tx-card);border:1px solid var(--tx-line);border-radius:24px;padding:26px 22px;position:relative;overflow:hidden;transition:.4s}
.tx-day:hover{transform:translateY(-8px);box-shadow:var(--shadow)}
.tx-day::before{content:"";position:absolute;left:0;right:0;top:0;height:5px;background:linear-gradient(90deg,#9f8bd6,var(--tx-violet))}
.tx-day small{font-size:12px;font-weight:700;letter-spacing:.14em;color:var(--muted)}
.tx-day h4{font-family:var(--serif);font-size:21px;color:var(--ink);margin:8px 0 10px}
.tx-day p{font-size:14.5px;line-height:1.6;color:var(--ink-soft)}
.tx-feel{display:flex;gap:4px;margin:16px 0 4px;align-items:flex-end;height:34px}
.tx-feel i{flex:1;background:var(--tx-soft);border-radius:4px;height:var(--h);transform-origin:bottom;transform:scaleY(0);transition:transform .8s cubic-bezier(.2,.75,.25,1)}
.tx-day.in .tx-feel i{transform:scaleY(1);background:var(--tx-violet);opacity:var(--o,1)}
.tx-feel-label{font-size:12px;color:var(--muted);font-weight:600}
.tx-dodont{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:34px}
.tx-dd{border-radius:24px;padding:28px;border:1px solid var(--tx-line);background:var(--tx-card)}
.tx-dd h4{display:flex;align-items:center;gap:12px;font-family:var(--serif);font-size:22px;color:var(--ink);margin-bottom:16px}
.tx-dd h4 i{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-style:normal;color:#fff;font-size:16px}
.tx-dd.do h4 i{background:var(--tx-green)}.tx-dd.dont h4 i{background:#d35a6a}
.tx-dd ul{list-style:none;display:grid;gap:11px}
.tx-dd li{font-size:15px;line-height:1.55;color:var(--ink-soft);padding-left:26px;position:relative}
.tx-dd li::before{content:"✓";position:absolute;left:0;color:var(--tx-green);font-weight:800}
.tx-dd.dont li::before{content:"✕";color:#d35a6a}

/* =========================================================
   ALIGNERS — animated tray stepper
   ========================================================= */
.tx-aligner-lab{margin-top:70px;background:linear-gradient(135deg,#3e2f6f,#5b46a1);border-radius:32px;padding:44px;color:#fff;position:relative;overflow:hidden}
.tx-aligner-lab::before{content:"";position:absolute;width:420px;height:420px;border-radius:50%;right:-120px;top:-160px;background:radial-gradient(circle,rgba(255,255,255,.16),transparent 65%)}
.tx-aligner-lab h3{font-family:var(--serif);font-size:clamp(26px,3vw,36px);margin:10px 0 10px}
.tx-aligner-lab>p{color:rgba(255,255,255,.82);max-width:620px;line-height:1.7}
.tx-aligner-lab .tx-kicker{color:#cfc1ff}
.tx-lab-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:34px;margin-top:30px;align-items:center}
.tx-lab-stage{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);border-radius:24px;padding:22px;backdrop-filter:blur(6px)}
.tx-trays{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.tx-tray-btn{border:1.5px solid rgba(255,255,255,.35);background:transparent;color:#fff;padding:9px 16px;border-radius:99px;font-weight:700;font-size:13px;cursor:pointer;font-family:inherit;transition:.3s}
.tx-tray-btn:hover{background:rgba(255,255,255,.15)}
.tx-tray-btn.on{background:#fff;color:var(--tx-violet-d);border-color:#fff}
.tx-play{display:inline-flex;align-items:center;gap:8px;margin-top:14px;background:rgba(255,255,255,.14);border:1.5px solid rgba(255,255,255,.3);color:#fff;padding:10px 20px;border-radius:99px;cursor:pointer;font-weight:700;font-family:inherit;font-size:14px;transition:.3s}
.tx-play:hover{background:rgba(255,255,255,.26)}
.tx-lab-side{display:grid;gap:14px}
.tx-stat{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);border-radius:18px;padding:18px 20px}
.tx-stat b{font-size:30px;font-family:var(--serif);display:block;line-height:1.1}
.tx-stat span{font-size:14px;color:rgba(255,255,255,.8)}
.tx-lab-stage .tx-tooth{fill:#fbf7ee}
.tx-aligner-shell{fill:rgba(160,200,255,.16);stroke:rgba(190,220,255,.95);stroke-width:2.5}

/* aligner process cards */
.tx-steps4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:70px;counter-reset:s}
.tx-step{background:var(--tx-card);border:1px solid var(--tx-line);border-radius:26px;overflow:hidden;transition:.4s;display:flex;flex-direction:column}
.tx-step:hover{transform:translateY(-10px);box-shadow:var(--shadow)}
.tx-step-img{height:170px;overflow:hidden;position:relative;background:var(--tx-soft)}
.tx-step-img img{width:100%;height:100%;object-fit:cover;transition:transform .9s}
.tx-step:hover .tx-step-img img{transform:scale(1.1)}
.tx-step-img .n{position:absolute;left:14px;top:14px;width:40px;height:40px;border-radius:50%;background:var(--tx-violet);color:#fff;display:grid;place-items:center;font-weight:800;box-shadow:0 8px 18px rgba(0,0,0,.25)}
.tx-step-body{padding:22px}
.tx-step-body h4{font-family:var(--serif);font-size:21px;color:var(--ink);margin-bottom:8px}
.tx-step-body p{font-size:14.5px;line-height:1.62;color:var(--ink-soft)}
.tx-step-svg{display:grid;place-items:center;height:100%}

/* wear clock */
.tx-wear{display:grid;grid-template-columns:.9fr 1.1fr;gap:44px;align-items:center;margin-top:70px;background:var(--tx-card);border:1px solid var(--tx-line);border-radius:30px;padding:40px;box-shadow:var(--shadow-soft)}
.tx-clock{width:100%;max-width:320px;margin-inline:auto}
.tx-clock .ring{fill:none;stroke-width:26;transform:rotate(-90deg);transform-origin:center;stroke-dasharray:628;stroke-dashoffset:628;transition:stroke-dashoffset 2s cubic-bezier(.2,.75,.25,1)}
.tx-clock.in .ring{stroke-dashoffset:calc(628 - 628 * 22 / 24)}
.tx-clock .ring-bg{fill:none;stroke:var(--tx-soft);stroke-width:26}
.tx-clock text{font-family:var(--serif);fill:var(--ink)}
.tx-legend{display:grid;gap:12px;margin-top:20px}
.tx-legend div{display:flex;gap:12px;align-items:flex-start;font-size:15px;color:var(--ink-soft);line-height:1.55}
.tx-legend i{flex:none;width:14px;height:14px;border-radius:5px;margin-top:5px;background:var(--tx-violet)}
.tx-legend i.o{background:var(--tx-soft);border:2px solid var(--tx-violet)}

/* =========================================================
   COMPARE
   ========================================================= */
.tx-compare{background:var(--paper)}
.tx-toggle{display:inline-flex;background:var(--tx-soft);border-radius:99px;padding:5px;margin:0 auto 34px;position:relative}
.tx-toggle button{position:relative;z-index:2;border:0;background:transparent;padding:12px 26px;min-width:110px;border-radius:99px;font-weight:700;font-size:15px;color:var(--ink-soft);cursor:pointer;font-family:inherit;transition:color .3s}
.tx-toggle button.on{color:#fff}
.tx-toggle .pill{position:absolute;z-index:1;top:5px;bottom:5px;left:5px;width:calc(33.333% - 3.4px);background:var(--tx-violet);border-radius:99px;transition:transform .4s cubic-bezier(.3,1.2,.5,1)}
.tx-toggle[data-v="braces"] .pill{transform:translateX(100%)}
.tx-toggle[data-v="aligners"] .pill{transform:translateX(200%)}
.tx-cmp{border:1px solid var(--tx-line);border-radius:28px;overflow:hidden;background:var(--tx-card);box-shadow:var(--shadow-soft)}
.tx-cmp-head,.tx-cmp-row{display:grid;grid-template-columns:1.1fr 1fr 1fr}
.tx-cmp-head{background:var(--tx-violet);color:#fff;font-weight:700}
.tx-cmp-head div{padding:20px 24px;font-family:var(--serif);font-size:20px}
.tx-cmp-row{border-top:1px solid var(--tx-line);transition:background .3s}
.tx-cmp-row:hover{background:var(--tx-soft)}
.tx-cmp-row div{padding:20px 24px;font-size:15px;line-height:1.55;color:var(--ink-soft)}
.tx-cmp-row div:first-child{font-weight:700;color:var(--ink)}
.tx-cmp-row div:nth-child(2),.tx-cmp-row div:nth-child(3){transition:opacity .4s}
.tx-cmp[data-v="braces"] .tx-cmp-row div:nth-child(3),
.tx-cmp[data-v="braces"] .tx-cmp-head div:nth-child(3){opacity:.28}
.tx-cmp[data-v="aligners"] .tx-cmp-row div:nth-child(2),
.tx-cmp[data-v="aligners"] .tx-cmp-head div:nth-child(2){opacity:.28}
.tx-cmp[data-v="both"] div{opacity:1!important}

/* =========================================================
   AFTER CARE / RETAINER
   ========================================================= */
.tx-after{background:var(--lavender)}
.tx-after-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.tx-after-card{background:var(--tx-card);border:1px solid var(--tx-line);border-radius:26px;padding:32px 28px;transition:.4s;position:relative;overflow:hidden}
.tx-after-card:hover{transform:translateY(-8px);box-shadow:var(--shadow)}
.tx-after-card .big{font-family:var(--serif);font-size:64px;line-height:1;color:var(--tx-violet);opacity:.18;position:absolute;right:20px;top:14px;font-weight:700}
.tx-after-card h4{font-family:var(--serif);font-size:23px;color:var(--ink);margin-bottom:10px}
.tx-after-card p{font-size:15.5px;line-height:1.7;color:var(--ink-soft)}

/* =========================================================
   FAQ
   ========================================================= */
.tx-faq{background:var(--paper)}
.tx-faq-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:56px;align-items:start}
.tx-faq-list{display:grid;gap:14px}
.tx-q{background:var(--tx-card);border:1px solid var(--tx-line);border-radius:20px;overflow:hidden;transition:.3s}
.tx-q.open{border-color:var(--tx-violet);box-shadow:var(--shadow-soft)}
.tx-q button{width:100%;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px 26px;background:none;border:0;font-family:inherit;font-size:17px;font-weight:700;color:var(--ink);cursor:pointer;text-align:left}
.tx-q button span{flex:none;width:32px;height:32px;border-radius:50%;background:var(--tx-soft);color:var(--tx-violet);display:grid;place-items:center;font-size:20px;transition:transform .4s,background .3s}
.tx-q.open button span{transform:rotate(45deg);background:var(--tx-violet);color:#fff}
.tx-q .a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s cubic-bezier(.2,.75,.25,1)}
.tx-q.open .a{grid-template-rows:1fr}
.tx-q .a>div{overflow:hidden}
.tx-q .a p{padding:0 26px 24px;font-size:15.5px;line-height:1.75;color:var(--ink-soft)}

.tx-disclaimer{margin-top:44px;padding:20px 26px;border-radius:18px;background:var(--tx-soft);color:var(--ink-soft);font-size:14.5px;line-height:1.65;border-left:5px solid var(--tx-violet)}
.tx-disclaimer strong{color:var(--ink)}

/* =========================================================
   CTA
   ========================================================= */
.tx-cta{padding:30px 0 100px;background:var(--paper)}
.tx-cta-box{background:linear-gradient(135deg,#3e2f6f,#6651a8);border-radius:36px;padding:60px;display:flex;justify-content:space-between;align-items:center;gap:30px;color:#fff;position:relative;overflow:hidden}
.tx-cta-box::before,.tx-cta-box::after{content:"";position:absolute;border-radius:50%;background:rgba(255,255,255,.07);animation:txFloat 8s ease-in-out infinite}
.tx-cta-box::before{width:300px;height:300px;right:-80px;top:-100px}
.tx-cta-box::after{width:180px;height:180px;left:30%;bottom:-90px;animation-delay:2s}
.tx-cta-box h2{font-family:var(--serif);font-size:clamp(28px,3.6vw,44px);margin-bottom:10px;position:relative}
.tx-cta-box p{color:rgba(255,255,255,.85);font-size:17px;position:relative}
.tx-cta-box .tx-btn{position:relative;flex:none}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width:1024px){
  .tx-hero-grid,.tx-demo,.tx-split,.tx-anatomy-grid,.tx-lab-grid,.tx-wear,.tx-faq-grid{grid-template-columns:1fr}
  .tx-split.flip .tx-media{order:0}
  .tx-hero-visual{min-height:400px}
  .tx-types,.tx-after-grid{grid-template-columns:1fr 1fr}
  .tx-days,.tx-steps4{grid-template-columns:1fr 1fr}
  .tx-pin.p1{left:6px}.tx-pin.p2{right:6px}
}
@media (max-width:760px){
  .tx-sec{padding:70px 0}
  .tx-wrap{width:min(100% - 32px,1180px)}
  .tx-choose-grid,.tx-types,.tx-after-grid,.tx-days,.tx-steps4,.tx-dodont,.tx-notes,.tx-parts{grid-template-columns:1fr}
  .tx-hero{padding:44px 0 60px}
  .tx-hero-visual{min-height:340px}
  .tx-hero-photo{inset:0 0 60px 20px}
  .tx-hero-badge{right:0;top:12px;max-width:170px;padding:10px 14px}
  .tx-choice{min-height:380px}
  .tx-anatomy,.tx-aligner-lab,.tx-wear{padding:22px}
  .tx-cta-box{flex-direction:column;align-items:flex-start;padding:38px 26px}
  /* timeline collapses to a single left rail */
  .tx-tl-line{left:21px}
  .tx-tl-item,.tx-tl-item.r{width:100%;margin-left:0;padding:0 0 38px 62px;text-align:left}
  .tx-tl-dot,.tx-tl-item.r .tx-tl-dot{left:0;right:auto}
  .tx-cmp-head div,.tx-cmp-row div{padding:14px 12px;font-size:13px}
  .tx-cmp-head div{font-size:15px}
  .tx-pin{display:none}
  .tx-chapter-num{font-size:110px;top:10px}
}

/* =========================================================
   RTL
   ========================================================= */
html[dir="rtl"] .tx-hero-photo{inset:0 40px 70px 0}
html[dir="rtl"] .tx-hero-mini{left:auto;right:0}
html[dir="rtl"] .tx-hero-badge{right:auto;left:-8px}
html[dir="rtl"] .tx-pin.p1{left:auto;right:-18px}
html[dir="rtl"] .tx-pin.p2{right:auto;left:-14px}
html[dir="rtl"] .tx-pin.p3{left:auto;right:8%}
html[dir="rtl"] .tx-chapter-num{right:auto;left:5%}
html[dir="rtl"] .tx-hero-points span::before{margin-right:0;margin-left:8px}
html[dir="rtl"] .tx-fact:hover{transform:translateX(-6px)}
html[dir="rtl"] .tx-q button{text-align:right}
html[dir="rtl"] .tx-dd li{padding-left:0;padding-right:26px}
html[dir="rtl"] .tx-dd li::before{left:auto;right:0}
html[dir="rtl"] .tx-note{border-left:1px solid var(--tx-line);border-right:5px solid var(--tx-violet)}
html[dir="rtl"] .tx-disclaimer{border-left:0;border-right:5px solid var(--tx-violet)}
html[dir="rtl"] .tx-after-card .big{right:auto;left:20px}
html[dir="rtl"] .tx-tl-item{text-align:left}
html[dir="rtl"] .tx-tl-item.r{text-align:right}
html[dir="rtl"] .tx-step-img .n{left:auto;right:14px}
html[dir="rtl"] .tx-slider{direction:ltr}
@media (max-width:760px){
  html[dir="rtl"] .tx-tl-line{left:auto;right:21px}
  html[dir="rtl"] .tx-tl-item,html[dir="rtl"] .tx-tl-item.r{padding:0 62px 38px 0;text-align:right}
  html[dir="rtl"] .tx-tl-dot,html[dir="rtl"] .tx-tl-item.r .tx-tl-dot{left:auto;right:0}
}

/* =========================================================
   REDUCED MOTION
   ========================================================= */
@media (prefers-reduced-motion:reduce){
  .tx-rv{opacity:1;transform:none;transition:none}
  .tx-hero-photo img,.tx-hero-mini,.tx-hero-badge,.tx-pin,.tx-pin::before,.tx-cta-box::before,.tx-cta-box::after{animation:none}
  .tx-bracket-anim .arch{stroke-dashoffset:0}
  .tx-bracket-anim .brk,.tx-callout{opacity:1;transform:none}
}


/* =========================================================
   TREATMENTS PAGE — RESPONSIVE HARDENING
   Remove the floating hero callout and keep every section usable
   from small phones through wide desktop screens.
   ========================================================= */
body.tx-page .tx-hero-badge{display:none!important}
body.tx-page img,body.tx-page svg{max-width:100%}
body.tx-page .tx-wrap{min-width:0}
body.tx-page .tx-hero-grid>* ,
body.tx-page .tx-demo>* ,
body.tx-page .tx-split>* ,
body.tx-page .tx-anatomy-grid>* ,
body.tx-page .tx-lab-grid>* ,
body.tx-page .tx-wear>* ,
body.tx-page .tx-faq-grid>*{min-width:0}
body.tx-page .tx-hero-visual{width:100%;min-width:0}
body.tx-page .tx-hero-photo{min-width:0}
body.tx-page .tx-hero-mini{max-width:230px}
body.tx-page .tx-hero-actions .tx-btn{max-width:100%;white-space:normal;text-align:center;justify-content:center}
body.tx-page .tx-subnav-in{overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
body.tx-page .tx-cmp{overflow-x:auto;overscroll-behavior-x:contain}
body.tx-page .tx-cmp-head,body.tx-page .tx-cmp-row{min-width:600px}
body.tx-page .tx-cmp-head>div,body.tx-page .tx-cmp-row>div{overflow-wrap:anywhere}
body.tx-page .tx-toggle{max-width:100%}
body.tx-page .tx-toggle button{min-width:0}

@media (min-width:1440px){
  body.tx-page .tx-wrap{width:min(1240px,calc(100% - 80px))}
  body.tx-page .tx-hero-grid{gap:clamp(48px,5vw,76px)}
  body.tx-page .tx-hero-visual{min-height:500px}
}
@media (max-width:1024px){
  body.tx-page .tx-hero-grid{gap:32px}
  body.tx-page .tx-hero-visual{min-height:390px;max-width:680px;margin:0 auto;width:100%}
  body.tx-page .tx-hero-photo{inset:0 0 56px 28px}
  body.tx-page .tx-hero-mini{width:42%;max-width:210px}
  body.tx-page .tx-head{margin-bottom:34px}
  body.tx-page .tx-sec{padding-block:76px}
  body.tx-page .tx-cta-box{gap:24px}
}
@media (max-width:760px){
  body.tx-page .tx-wrap{width:calc(100% - 32px)}
  body.tx-page .tx-hero{padding:42px 0 48px}
  body.tx-page .tx-hero-grid{grid-template-columns:minmax(0,1fr);gap:30px}
  body.tx-page .tx-hero h1{font-size:clamp(34px,8vw,48px);line-height:1.08;overflow-wrap:normal}
  body.tx-page .tx-lead{font-size:16px;line-height:1.65}
  body.tx-page .tx-hero-actions{gap:10px;margin:22px 0}
  body.tx-page .tx-hero-actions .tx-btn{padding:12px 18px;font-size:14px}
  body.tx-page .tx-hero-points{gap:8px 14px;font-size:13px}
  body.tx-page .tx-hero-visual{min-height:clamp(270px,72vw,380px);max-width:560px}
  body.tx-page .tx-hero-photo{inset:0 0 48px 16px;border-radius:22px}
  body.tx-page .tx-hero-mini{width:42%;max-width:180px;border-width:4px;border-radius:16px}
  body.tx-page .tx-sec{padding-block:58px}
  body.tx-page .tx-head{margin-bottom:28px}
  body.tx-page .tx-h2{font-size:clamp(27px,6.5vw,38px)}
  body.tx-page .tx-stage,body.tx-page .tx-anatomy,body.tx-page .tx-aligner-lab,body.tx-page .tx-wear{padding:18px;border-radius:22px}
  body.tx-page .tx-cmp-head,body.tx-page .tx-cmp-row{min-width:560px}
  body.tx-page .tx-cta{padding:20px 0 64px}
  body.tx-page .tx-cta-box{padding:30px 22px;border-radius:26px;align-items:flex-start}
  body.tx-page .tx-cta-box .tx-btn{white-space:normal}
  body.tx-page .tx-q button{padding:17px 18px;font-size:15px}
  body.tx-page .tx-q .a p{padding:0 18px 20px}
}
@media (max-width:480px){
  body.tx-page .tx-wrap{width:calc(100% - 28px)}
  body.tx-page .tx-hero{padding:32px 0 38px}
  body.tx-page .tx-hero h1{font-size:clamp(31px,9vw,40px);margin:14px 0 16px}
  body.tx-page .tx-hero-actions{display:grid;grid-template-columns:minmax(0,1fr);align-items:stretch}
  body.tx-page .tx-hero-actions .tx-btn{width:100%}
  body.tx-page .tx-hero-visual{min-height:260px}
  body.tx-page .tx-hero-photo{inset:0 0 36px 10px;border-radius:18px}
  body.tx-page .tx-hero-mini{width:44%;border-width:3px;border-radius:13px}
  body.tx-page .tx-hero-points{display:grid;grid-template-columns:1fr;gap:7px}
  body.tx-page .tx-subnav a{padding:8px 13px;font-size:13px}
  body.tx-page .tx-sec{padding-block:48px}
  body.tx-page .tx-stage,body.tx-page .tx-anatomy,body.tx-page .tx-aligner-lab,body.tx-page .tx-wear{padding:14px;border-radius:18px}
  body.tx-page .tx-toggle{display:flex;width:100%;padding:4px}
  body.tx-page .tx-toggle button{flex:1;padding:10px 5px;font-size:13px}
  body.tx-page .tx-toggle .pill{left:4px;width:calc(33.333% - 2.7px);top:4px;bottom:4px}
  body.tx-page .tx-cmp-head,body.tx-page .tx-cmp-row{min-width:520px}
  body.tx-page .tx-cmp-head div,body.tx-page .tx-cmp-row div{padding:12px 10px;font-size:12px}
  body.tx-page .tx-cta-box{padding:26px 18px}
  body.tx-page .tx-cta-box p{font-size:15px;line-height:1.6}
  body.tx-page .tx-disclaimer{padding:16px 18px;font-size:13px}
}
@media (max-width:360px){
  body.tx-page .tx-wrap{width:calc(100% - 24px)}
  body.tx-page .tx-hero h1{font-size:30px}
  body.tx-page .tx-hero-visual{min-height:230px}
  body.tx-page .tx-hero-photo{inset:0 0 30px 7px}
  body.tx-page .tx-hero-mini{width:46%}
  body.tx-page .tx-kicker{font-size:10px;letter-spacing:.12em}
  body.tx-page .tx-btn{font-size:13px}
  body.tx-page .tx-cmp-head,body.tx-page .tx-cmp-row{min-width:500px}
}
@media (prefers-reduced-motion:reduce){
  body.tx-page .tx-hero-photo img,body.tx-page .tx-hero-mini{animation:none!important}
}