/* ==========================================================================
   CM Hospital — Design System
   Palette : forest green on white     Type : Poppins (max weight 600)
   ========================================================================== */

:root {
    /* ---- Brand green ---- */
    --g-950:#062018; --g-900:#0a3126; --g-800:#0e4331;
    --g-700:#12573e; --g-600:#177049; --g-500:#1f8d5b;
    --g-400:#3fae78; --g-300:#7fcaa2; --g-200:#b9e2cc;
    --g-100:#ddf1e6; --g-50:#f1f9f4;

    /* ---- Neutrals ---- */
    --n-900:#10201a; --n-800:#1d3229; --n-700:#33473e;
    --n-600:#516158; --n-500:#637368; --n-400:#98a49d;
    --n-300:#c4cec8; --n-200:#e3e9e5; --n-100:#f0f4f2; --n-50:#f7faf8;
    --white:#fff;

    /* ---- Status ---- */
    --danger:#b8202b; --danger-soft:#fdf2f2;
    --warning:#9a6a00; --warning-soft:#fdf8ec;
    --success:var(--g-600);

    /* ---- Semantic ---- */
    --brand:var(--g-700);
    --brand-dark:var(--g-800);
    --brand-light:var(--g-500);
    --accent:var(--g-600);
    --bg:var(--white);
    --bg-soft:var(--n-50);
    --bg-tint:var(--g-50);
    --text:var(--n-800);
    --text-muted:var(--n-500);
    --border:var(--n-200);

    /* ---- Type ---- */
    --font:'Poppins',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
    --font-head:var(--font);
    --font-body:var(--font);
    --w-regular:400;
    --w-medium:500;
    --w-semi:600;

    /* ---- Depth : soft, low-contrast ---- */
    --sh-xs:0 1px 2px rgba(6,32,24,.05);
    --sh-sm:0 1px 3px rgba(6,32,24,.06),0 1px 2px rgba(6,32,24,.04);
    --sh-md:0 4px 16px rgba(6,32,24,.07);
    --sh-lg:0 12px 32px rgba(6,32,24,.09);
    --sh-xl:0 24px 56px rgba(6,32,24,.13);
    --sh-brand:0 8px 24px rgba(18,87,62,.18);

    /* ---- Geometry ---- */
    --r-sm:8px; --r-md:12px; --r-lg:18px; --r-xl:26px; --r-full:999px;
    --container:1280px;
    --nav-h:74px;
    --ease:cubic-bezier(.22,.68,0,1);
}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 20px)}
body{
    margin:0;font-family:var(--font);font-size:16px;font-weight:var(--w-regular);line-height:1.75;
    color:var(--text);background:var(--bg);
    -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
    overflow-x:hidden;
}
img,svg,video,iframe{max-width:100%;display:block}
img,svg,video{height:auto}

h1,h2,h3,h4,h5,h6{
    font-family:var(--font);font-weight:var(--w-semi);line-height:1.25;
    color:var(--n-900);margin:0 0 .5em;letter-spacing:-.02em;
}
h1{font-size:clamp(2rem,3.9vw,3.05rem);line-height:1.16}
h2{font-size:clamp(1.55rem,2.7vw,2.2rem)}
h3{font-size:clamp(1.12rem,1.6vw,1.32rem)}
h4{font-size:1.02rem}
h5{font-size:.95rem}
p{margin:0 0 1.15em}
a{color:var(--brand);text-decoration:none;transition:color .2s}
a:hover{color:var(--g-500)}
ul,ol{margin:0 0 1.15em;padding-left:1.25em}
li{margin-bottom:.42em}
strong,b{font-weight:var(--w-semi);color:var(--n-900)}
em{font-style:italic}
small{font-size:.85em}
hr{border:0;border-top:1px solid var(--border);margin:2rem 0}
:focus-visible{outline:2px solid var(--g-500);outline-offset:3px;border-radius:4px}
::selection{background:var(--g-100);color:var(--g-900)}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0;overflow:hidden}
/* Available to screen readers and search engines, not shown on screen */
.sr-only{
    position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
    clip:rect(0,0,0,0);white-space:nowrap;border:0;
}

/* ---------- Layout ---------- */
.container{width:100%;max-width:var(--container);margin:0 auto;padding:0 24px}
.container-narrow{max-width:820px}
.section{padding:clamp(56px,6.5vw,96px) 0}
.section-sm{padding:clamp(38px,4.5vw,60px) 0}
.section-soft{background:var(--bg-soft)}
/* a section that runs straight into the next one, so the two paddings
   do not stack into a dead band of white */
.section-flush-b{padding-bottom:clamp(30px,3.2vw,46px)}
.section-tint{background:var(--g-50)}
.section-dark{background:var(--g-950);color:rgba(255,255,255,.78)}
.section-dark h1,.section-dark h2,.section-dark h3,.section-dark h4{color:var(--white)}

.grid{display:grid;gap:24px}
.g-2{grid-template-columns:repeat(2,1fr)}
.g-3{grid-template-columns:repeat(3,1fr)}
.g-4{grid-template-columns:repeat(4,1fr)}
.g-auto-260{grid-template-columns:repeat(auto-fill,minmax(255px,1fr))}
/* auto-fill, not auto-fit: the photo cards are square, so with auto-fit a lone
   card (one consultant, or a filter that leaves one) stretched to the full
   width and its photo became as tall as the page was wide. */
.g-auto-300{grid-template-columns:repeat(auto-fit,minmax(290px,1fr))}
.g-auto-340{grid-template-columns:repeat(auto-fit,minmax(330px,1fr))}
.gap-sm{gap:14px}

/* ---------- Utilities (replace inline styles) ---------- */
.text-center{text-align:center}
.text-left{text-align:left}
.mt-0{margin-top:0}   .mb-0{margin-bottom:0}
.mt-1{margin-top:.7rem}  .mb-1{margin-bottom:.7rem}
.mt-2{margin-top:1.4rem} .mb-2{margin-bottom:1.4rem}
.mt-3{margin-top:2.2rem} .mb-3{margin-bottom:2.2rem}
.mt-4{margin-top:3rem}   .mb-4{margin-bottom:3rem}
.pt-0{padding-top:0}
.w-full{width:100%}
.flex{display:flex}
.flex-col{flex-direction:column}
.items-center{align-items:center}
.justify-center{justify-content:center}
.wrap{flex-wrap:wrap}
.self-start{align-self:flex-start}
.muted{color:var(--text-muted)}
.small{font-size:.88rem}
.lead{font-size:1.05rem;color:var(--text-muted)}
.no-pointer{pointer-events:none}
.stack{display:flex;flex-direction:column;gap:12px}

/* ---------- Section heads ---------- */
.section-head{max-width:680px;margin:0 auto clamp(32px,3.6vw,50px);text-align:center}
.section-head.left{margin-left:0;text-align:left}
.section-head h2{margin-bottom:.55rem}
.section-head p{color:var(--text-muted);font-size:1rem;margin-bottom:0}
.eyebrow{
    display:inline-block;font-size:.74rem;font-weight:var(--w-semi);letter-spacing:.16em;
    text-transform:uppercase;color:var(--g-600);margin-bottom:.8rem;
}
h1 em,h2 em,h3 em{font-style:normal;color:var(--g-600);font-weight:inherit}
.hero h1 em{color:var(--g-300)}

/* ---------- Buttons ---------- */
.btn{
    display:inline-flex;align-items:center;justify-content:center;gap:.55em;
    padding:.82em 1.6em;border:1px solid transparent;border-radius:var(--r-full);
    font-family:var(--font);font-size:.92rem;font-weight:var(--w-medium);line-height:1.2;
    cursor:pointer;text-align:center;white-space:nowrap;
    transition:background .22s,color .22s,border-color .22s,box-shadow .22s,transform .22s var(--ease);
}
.btn i{font-size:.9em}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:none}
.btn-primary{background:var(--brand);color:var(--white);box-shadow:var(--sh-brand)}
.btn-primary:hover{background:var(--g-800);color:var(--white)}
.btn-accent{background:var(--g-600);color:var(--white);box-shadow:var(--sh-brand)}
.btn-accent:hover{background:var(--g-700);color:var(--white)}
.btn-outline{background:transparent;color:var(--brand);border-color:var(--n-300)}
.btn-outline:hover{background:var(--g-50);border-color:var(--g-400);color:var(--g-800)}
.btn-white{background:var(--white);color:var(--g-800);box-shadow:var(--sh-md)}
.btn-white:hover{background:var(--g-50);color:var(--g-900)}
.btn-ghost-white{background:transparent;color:var(--white);border-color:rgba(255,255,255,.42)}
.btn-ghost-white:hover{background:var(--white);color:var(--g-800);border-color:var(--white)}
.btn-danger{background:var(--danger);color:var(--white)}
.btn-danger:hover{background:#96181f;color:var(--white)}
.btn-sm{padding:.58em 1.15em;font-size:.85rem}
.btn-lg{padding:.98em 2em;font-size:.98rem}
.btn-block{width:100%}
.btn-group{display:flex;flex-wrap:wrap;gap:12px}
.btn-group-col{flex-direction:column}

.link-more{
    display:inline-flex;align-items:center;gap:.45em;
    font-weight:var(--w-medium);font-size:.9rem;color:var(--brand);
}
.link-more i{font-size:.8em;transition:transform .25s var(--ease)}
.link-more:hover i{transform:translateX(4px)}

/* ---------- Badges, icons, stars ---------- */
/* Inline brand marks, sized like the icon font they replaced */
.brand-icon{width:1em;height:1em;display:inline-block;vertical-align:-.125em;fill:currentColor}
.btn .brand-icon,.wa-handoff-text h3 .brand-icon{width:1.05em;height:1.05em}

.badge{
    display:inline-flex;align-items:center;gap:.4em;padding:.34em .8em;border-radius:var(--r-full);
    background:var(--g-100);color:var(--g-800);font-size:.72rem;font-weight:var(--w-medium);
    letter-spacing:.05em;text-transform:uppercase;
}
.badge-accent{background:var(--g-600);color:var(--white)}
.badge-live{background:rgba(184,32,43,.09);color:var(--danger)}
.badge-live::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--danger);animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}

.icon-box{
    display:grid;place-items:center;flex:0 0 auto;width:50px;height:50px;border-radius:var(--r-md);
    background:var(--g-50);color:var(--g-600);font-size:1.22rem;
    transition:background .3s,color .3s;
}
.icon-box-lg{width:62px;height:62px;font-size:1.5rem}
.icon-box-danger{background:var(--danger-soft);color:var(--danger)}

.stars{display:inline-flex;gap:2px;color:#d9a441;font-size:.8rem}
.stars .muted{color:var(--n-300)}

/* ==========================================================================
   HEADER
   ========================================================================== */
.topbar{
    background:var(--g-900);color:rgba(255,255,255,.72);font-size:.8rem;
    padding:8px 0;position:relative;z-index:60;
}
.topbar .container{display:flex;align-items:center;justify-content:space-between;gap:20px}
.topbar-left,.topbar-right{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.topbar span,.topbar a{display:inline-flex;align-items:center;gap:.45em}
.topbar a{color:rgba(255,255,255,.82)}
.topbar a:hover{color:var(--white)}
.topbar i{color:var(--g-400);font-size:.9em}
.topbar .emg{color:var(--white);font-weight:var(--w-medium)}
.topbar .emg i{color:#ff9b8d}
.topbar-social{display:flex;gap:15px;padding-left:4px}
.topbar-social a{font-size:.92rem;color:rgba(255,255,255,.6)}

.site-header{
    position:sticky;top:0;z-index:70;background:var(--white);
    border-bottom:1px solid var(--border);transition:box-shadow .3s;
}
.site-header.scrolled{box-shadow:var(--sh-md)}
.nav-wrap{position:relative;display:flex;align-items:center;gap:20px;height:var(--nav-h)}

.logo{display:flex;align-items:center;flex:0 0 auto}
/* the width/height attributes hold the 745:132 ratio, so the header does not
   reflow while the logo loads */
/* the City Miracle lockup is two lines and squarer than the old one, so it
   needs a little more height to read; each step is the most the row allows */
.logo-img{height:45px;width:auto;display:block}
@media (max-width:1180px){.logo-img{height:40px}}
@media (max-width:640px){.logo-img{height:36px}}
@media (max-width:380px){.logo-img{height:32px}}

.main-nav{margin-left:auto}
.main-nav>ul{display:flex;align-items:center;gap:2px;list-style:none;margin:0;padding:0}
.main-nav>ul>li{position:relative;margin:0}
.main-nav>ul>li.has-mega{position:static}
.main-nav>ul>li>a{
    display:flex;align-items:center;gap:.38em;padding:.6em .78em;border-radius:var(--r-sm);
    font-size:.9rem;font-weight:var(--w-medium);color:var(--n-700);white-space:nowrap;
}
.main-nav>ul>li>a:hover,.main-nav>ul>li>a.active{color:var(--g-700);background:var(--g-50)}
.main-nav>ul>li>a i.caret{font-size:.58rem;opacity:.55;transition:transform .25s}
.main-nav>ul>li:hover>a i.caret{transform:rotate(180deg)}

.dropdown{
    position:absolute;top:calc(100% + 10px);left:-6px;min-width:250px;
    background:var(--white);border:1px solid var(--border);border-radius:var(--r-md);
    box-shadow:var(--sh-lg);padding:8px;list-style:none;margin:0;
    opacity:0;visibility:hidden;transform:translateY(8px);
    transition:opacity .22s,transform .22s var(--ease),visibility .22s;
}
.main-nav li:hover>.dropdown,.dropdown:focus-within{opacity:1;visibility:visible;transform:translateY(0)}
.dropdown::before{content:"";position:absolute;top:-10px;left:0;right:0;height:10px}
.dropdown li{margin:0}
.dropdown a{
    display:flex;align-items:center;gap:.65em;padding:.58em .75em;border-radius:var(--r-sm);
    font-size:.88rem;font-weight:var(--w-regular);color:var(--n-700);
}
.dropdown a:hover{background:var(--g-50);color:var(--g-700)}
.dropdown a i{width:16px;text-align:center;color:var(--g-500);font-size:.88em}
.dropdown-mega{
    left:auto;right:0;width:min(660px,calc(100vw - 48px));min-width:0;padding:16px;
    display:grid;grid-template-columns:repeat(2,1fr);gap:2px 12px;
}
@media (max-width:1240px){.dropdown-mega{grid-template-columns:1fr}}
.dropdown-mega .mega-head{
    grid-column:1/-1;padding:.1em .75em .65em;font-size:.7rem;font-weight:var(--w-semi);letter-spacing:.14em;
    text-transform:uppercase;color:var(--text-muted);border-bottom:1px solid var(--border);margin-bottom:8px;
}
.dropdown-mega .mega-all{grid-column:1/-1;margin-top:8px;padding-top:10px;border-top:1px solid var(--border)}
.dropdown-mega .mega-all a{justify-content:center;background:var(--g-50);font-weight:var(--w-medium);color:var(--g-700)}


.nav-cta{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.nav-toggle{
    display:none;width:42px;height:42px;border:1px solid var(--border);border-radius:var(--r-sm);
    background:var(--white);color:var(--g-800);font-size:1.05rem;cursor:pointer;
}

/* Mobile nav */
.mobile-nav{
    position:fixed;inset:0 0 0 auto;width:min(390px,88vw);background:var(--white);
    z-index:200;padding:20px;overflow-y:auto;box-shadow:var(--sh-xl);
    transform:translateX(102%);transition:transform .35s var(--ease);
}
.mobile-nav.open{transform:translateX(0)}
.mobile-nav-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid var(--border)}
.mobile-nav-close{width:40px;height:40px;border:1px solid var(--border);border-radius:var(--r-sm);background:var(--white);font-size:1.05rem;cursor:pointer;color:var(--n-700)}
.mobile-nav ul{list-style:none;margin:0;padding:0}
.mobile-nav>ul>li{border-bottom:1px solid var(--n-100);margin:0}
.mobile-nav>ul>li>a,.m-toggle{
    display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;
    padding:.88em .2em;font-size:.96rem;font-weight:var(--w-medium);color:var(--n-800);
    background:none;border:0;font-family:inherit;cursor:pointer;text-align:left;
}
.m-toggle i{transition:transform .3s;color:var(--g-500);font-size:.75rem}
.m-toggle[aria-expanded="true"] i{transform:rotate(180deg)}
.m-sub{max-height:0;overflow:hidden;transition:max-height .35s var(--ease)}
.m-sub ul{padding:0 0 .5em .2em}
.m-sub li{margin:0}
.m-sub a{display:flex;align-items:center;gap:.6em;padding:.5em 0;font-size:.89rem;color:var(--n-600)}
.m-sub a i{color:var(--g-500);width:16px;font-size:.85em}
.mobile-nav .btn{margin-top:8px}
.nav-overlay{
    position:fixed;inset:0;background:rgba(6,32,24,.45);
    z-index:190;opacity:0;visibility:hidden;transition:.3s;
}
.nav-overlay.open{opacity:1;visibility:visible}

/* ==========================================================================
   HERO SLIDER  (photo · quote · badge, with a floating search bar)
   ========================================================================== */
.hero-slider{
    position:relative;background:linear-gradient(120deg,var(--g-50) 0%,var(--white) 55%,var(--n-50) 100%);
    overflow:hidden;
}
.hero-slider>.hs-viewport{max-width:none;padding:0}
.hs-viewport{position:relative;min-height:clamp(470px,48vw,620px)}
.hs-slide{
    position:absolute;inset:0;display:grid;
    grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
    align-items:center;gap:clamp(24px,4vw,64px);
    min-height:clamp(470px,48vw,620px);
    opacity:0;visibility:hidden;transition:opacity .6s var(--ease),visibility .6s;
}
.hs-slide.is-active{opacity:1;visibility:visible;position:relative}
/* keep the text and badge on the page's content grid while the photo runs to the edge */
.hs-slide.is-active .hs-body>*{animation:hsIn .65s var(--ease) both}
.hs-slide.is-active .hs-body>*:nth-child(2){animation-delay:.09s}
.hs-slide.is-active .hs-body>*:nth-child(3){animation-delay:.17s}
@keyframes hsIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* Left photo, bleeding off the edge and fading into the background */
.hs-media{position:relative;align-self:stretch;overflow:hidden;min-height:100%}
.hs-media img{width:100%;height:100%;object-fit:cover;object-position:center 28%}
.hs-media::after{
    content:"";position:absolute;inset:0;
    background:linear-gradient(90deg,
        rgba(6,32,24,.20) 0%,
        rgba(6,32,24,.04) 46%,
        rgba(255,255,255,.35) 74%,
        var(--white) 100%);
}
.hs-media-tint::after{
    background:linear-gradient(90deg,
        rgba(6,32,24,.26) 0%,
        rgba(6,32,24,.06) 44%,
        rgba(255,255,255,.38) 74%,
        var(--white) 100%);
}

/* Quote */
.hs-body{
    padding:clamp(30px,3.8vw,56px) max(24px, calc((100vw - var(--container)) / 2 + 24px)) clamp(30px,3.8vw,56px) 0;
    max-width:none;
}
.hs-quote{
    position:relative;margin:0 0 1.6rem;padding:0;
    font-size:clamp(1.2rem,2.35vw,2.05rem);line-height:1.45;font-weight:var(--w-regular);
    color:var(--n-800);letter-spacing:-.015em;
}
.hs-quote strong{font-weight:var(--w-semi);color:var(--g-800)}
.hs-quote::before,.hs-quote::after{
    font-size:1.5em;line-height:0;color:var(--g-300);font-weight:var(--w-semi);
}
.hs-quote::before{content:"\201C";margin-right:.08em;vertical-align:-.32em}
.hs-quote::after{content:"\201D";margin-left:.06em;vertical-align:-.32em}
.hs-attr{display:flex;flex-direction:column;gap:.12rem;margin-bottom:1.7rem}
.hs-attr strong{font-size:clamp(1.02rem,1.45vw,1.24rem);font-weight:var(--w-semi);color:var(--n-900)}
.hs-attr span{font-size:.9rem;color:var(--text-muted)}
.hs-actions{display:flex;flex-wrap:wrap;gap:11px}


/* Controls */
.hs-nav{
    position:absolute;top:50%;transform:translateY(-50%);z-index:4;
    width:42px;height:42px;border-radius:50%;display:grid;place-items:center;
    background:var(--white);border:1px solid var(--border);color:var(--g-800);
    font-size:.88rem;cursor:pointer;box-shadow:var(--sh-sm);transition:.22s;
}
.hs-nav:hover{background:var(--g-700);border-color:var(--g-700);color:var(--white)}
.hs-prev{left:14px}
.hs-next{right:14px}
.hs-dots{
    position:absolute;left:0;right:0;bottom:58px;z-index:4;
    display:flex;justify-content:center;gap:8px;
}
.hs-dot{
    width:9px;height:9px;padding:0;border-radius:50%;border:0;cursor:pointer;
    background:var(--n-300);transition:.24s;
}
.hs-dot.is-active{background:var(--g-700);width:26px;border-radius:var(--r-full)}
.hs-dot:hover{background:var(--g-500)}

/* Floating search bar */
.hero-search{position:relative;z-index:6;margin-top:-34px}
.hero-search-inner{
    display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:stretch;
    background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);
    box-shadow:var(--sh-lg);overflow:hidden;
}
.hs-search-field{position:relative;display:flex;align-items:center;gap:12px;padding:12px 16px}
.hs-search-field>i{
    display:grid;place-items:center;flex:0 0 auto;width:38px;height:38px;border-radius:50%;
    background:var(--g-700);color:var(--white);font-size:.88rem;
}
.hs-search-field input{
    border:0;padding:.6em 0;font-size:.98rem;background:none;
}
.hs-search-field input:focus{outline:0;box-shadow:none}
.hero-search .btn{border-radius:0;padding-inline:clamp(22px,2.8vw,40px);white-space:nowrap}
.hero-search .btn-search{background:var(--g-700);color:var(--white);border:0}
.hero-search .btn-search:hover{background:var(--g-800);transform:none}
.hero-search .btn-book{background:var(--white);color:var(--g-800);border:0;border-left:1px solid var(--border)}
.hero-search .btn-book:hover{background:var(--g-50);transform:none}

@media (max-width:1024px){
    .hs-slide{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:28px;min-height:430px}
    .hs-viewport{min-height:430px}
}
@media (max-width:860px){
    .hs-viewport{min-height:0}
    .hs-slide{grid-template-columns:1fr;gap:0;min-height:0}
    .hs-media{height:230px;order:-1}
    .hs-media::after{background:linear-gradient(180deg,rgba(6,32,24,.3) 0%,rgba(6,32,24,.06) 45%,var(--white) 99%)}
    .hs-body{padding:24px 20px 40px;max-width:none}
    .hs-nav{top:115px}
    /* dots sit under the slide on small screens instead of over the buttons */
    .hs-dots{position:static;bottom:auto;padding:4px 0 18px}
    /* and once they are in the flow the card must not be pulled back over them */
    .hero-search{margin-top:0}
    .hero-search-inner{grid-template-columns:1fr}
    .hero-search .btn-book{border-left:0;border-top:1px solid var(--border)}
    .hs-search-field{border-bottom:1px solid var(--border)}
}
@media (max-width:600px){
    .hs-nav{width:36px;height:36px}
    .hs-prev{left:8px}.hs-next{right:8px}
}
@media (prefers-reduced-motion:reduce){
    .hs-slide.is-active .hs-body>*{animation:none}
}

/* ---------- Quick access strip ---------- */
.quick-strip{position:relative;z-index:5;margin-top:-48px}
.quick-strip-flat{margin-top:clamp(34px,4vw,56px)}
.quick-strip .grid{gap:0;background:var(--white);border:1px solid var(--border);border-radius:0;box-shadow:var(--sh-md);overflow:hidden}
.quick-item{
    display:flex;align-items:center;gap:14px;padding:24px 22px;
    border-right:1px solid var(--border);transition:background .24s;color:var(--text);
}
.quick-item:last-child{border-right:0}
.quick-item:hover{background:var(--g-50);color:var(--text)}
.quick-item .icon-box{background:none;border-radius:0;width:auto;height:auto;font-size:1.5rem;color:var(--g-700)}
.quick-item:hover .icon-box{background:none;color:var(--g-800)}
.quick-item h2,.quick-item h3,.quick-item h4{margin:0 0 .12rem;font-size:.96rem;font-weight:var(--w-semi);color:var(--n-900);letter-spacing:-.01em;line-height:1.4}
.quick-item p{margin:0;font-size:.81rem;color:var(--text-muted);line-height:1.5}

/* ==========================================================================
   PAGE HERO
   ========================================================================== */
.page-hero{
    position:relative;background:var(--g-900) center/cover no-repeat;
    padding:clamp(48px,6vw,84px) 0 clamp(44px,5.5vw,72px);color:var(--white);
}
.page-hero::before{
    content:"";position:absolute;inset:0;
    background:linear-gradient(100deg,var(--g-950) 0%,rgba(10,49,38,.92) 52%,rgba(18,87,62,.7) 100%);
}
.page-hero .container{position:relative;z-index:2}
.page-hero h1{color:var(--white);margin:0 0 .45rem;max-width:22ch}
.page-hero p{color:rgba(255,255,255,.76);max-width:62ch;font-size:1rem;margin:0}
.breadcrumb{display:flex;align-items:center;flex-wrap:wrap;gap:.5em;font-size:.82rem;margin-bottom:1rem;color:rgba(255,255,255,.55)}
.breadcrumb a{color:rgba(255,255,255,.78);display:inline-flex;align-items:center;gap:.4em}
.breadcrumb a:hover{color:var(--white)}
.breadcrumb>*:not(:last-child)::after{content:"/";margin-left:.55em;opacity:.4}
.breadcrumb span:last-child{color:var(--white);font-weight:var(--w-medium)}

/* ==========================================================================
   CARDS
   ========================================================================== */
.card{
    background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);
    padding:26px;transition:box-shadow .28s,border-color .28s,transform .28s var(--ease);
}
.card:hover{box-shadow:var(--sh-md);border-color:var(--g-200);transform:translateY(-2px)}
.card-flat:hover{transform:none}
.card h3{margin-bottom:.5rem}
.card>p:last-child{margin-bottom:0}
.card-icon-row{display:flex;gap:16px;align-items:flex-start}

/* Speciality tile — line icon over the name, separated by hairlines rather
   than boxed in cards. */
.dept-grid{
    display:grid;grid-template-columns:repeat(5,1fr);
    border-top:1px solid var(--border);border-left:1px solid var(--border);
    background:var(--white);
}
.dept-tile{
    display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:18px;
    padding:clamp(26px,3vw,40px) 18px;text-align:center;color:var(--n-800);
    border-right:1px solid var(--border);border-bottom:1px solid var(--border);
    transition:background .25s,color .25s;
    --icon-accent:var(--g-500);
}
.dept-tile:hover{background:var(--g-50);color:var(--g-800);--icon-accent:var(--g-600)}
.dept-tile-icon{display:block;color:var(--n-700);transition:color .25s}
.dept-tile:hover .dept-tile-icon{color:var(--g-800)}
.dept-tile-icon svg{width:clamp(52px,5vw,66px);height:clamp(52px,5vw,66px);display:block}
.dept-tile-name{font-size:.98rem;font-weight:var(--w-semi);line-height:1.4;letter-spacing:-.01em}
/* same icon set, used inline beside text on the international page */
a.feature-card{color:var(--text);--icon-accent:var(--g-500)}
a.feature-card:hover{color:var(--text);--icon-accent:var(--g-600)}
.intl-icon{flex:0 0 auto;color:var(--n-700)}
.intl-icon svg{width:46px;height:46px;display:block}

@media (max-width:1180px){
    .dept-grid{grid-template-columns:repeat(4,1fr)}
}
@media (max-width:900px){
    .dept-grid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:600px){
    .dept-grid{grid-template-columns:repeat(2,1fr)}
    .dept-tile{gap:12px;padding:22px 12px}
    .dept-tile-name{font-size:.88rem}
}

/* Doctor card */
/* Consultant cards: the portrait leads, the name and speciality sit under it,
   and one action closes the card. Softly rounded rather than hard-square — a
   face reads better inside a curve than a corner. */
.doctor-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.doctor-card{
    display:flex;flex-direction:column;overflow:hidden;
    background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);
    transition:box-shadow .28s,border-color .28s,transform .28s var(--ease);
}
.doctor-card:hover{box-shadow:var(--sh-md);border-color:var(--g-200);transform:translateY(-3px)}
.doctor-photo{position:relative;display:block;aspect-ratio:1/1;overflow:hidden;background:var(--g-50)}
.doctor-photo img{
    width:100%;height:100%;object-fit:cover;object-position:center 18%;display:block;
    transition:transform .55s var(--ease);
}
.doctor-card:hover .doctor-photo img{transform:scale(1.04)}
/* a soft wash at the foot of the picture so the card reads as one piece */
.doctor-photo::after{
    content:"";position:absolute;inset:auto 0 0 0;height:38%;pointer-events:none;
    background:linear-gradient(to top,rgba(6,32,24,.16),transparent);
}
/* where no photograph exists yet the icon should read as an absence, not as a
   bold graphic sitting among the faces */
.doctor-photo .portrait-fallback{color:var(--g-300);--icon-accent:var(--g-200);--icon-bg:var(--g-50)}
.doctor-photo .portrait-fallback svg{width:44%;height:44%}
.doctor-photo-fallback{position:absolute;inset:0;display:grid;place-items:center;color:var(--g-300);font-size:clamp(2.6rem,5vw,3.6rem)}

/* a speciality's consultants: centred, so one or two do not sit off to the left,
   and never wider than a card in the full doctors list */
.team-row{display:flex;flex-wrap:wrap;justify-content:center;gap:22px}
.team-row>*{flex:0 1 calc((100% - 66px) / 4);min-width:240px}
@media (max-width:560px){.team-row>*{flex-basis:100%;min-width:0;max-width:380px}}
.doctor-body{display:flex;flex-direction:column;align-items:flex-start;flex:1;padding:16px 18px 18px}
.doctor-body h2,.doctor-body h3{font-size:1.02rem;font-weight:var(--w-semi);margin:0 0 .2rem;letter-spacing:-.015em;line-height:1.35}
.doctor-designation{font-size:.85rem;color:var(--g-700);margin:0 0 1rem;line-height:1.5}
.doctor-card .btn{margin-top:auto;width:100%;justify-content:center}
/* a leadership post with the person named: portrait in place of the icon */
.leader-photo{flex:0 0 auto;width:76px;height:76px;border-radius:50%;object-fit:cover;object-position:center 30%;background:var(--g-50)}
.feature-card .leader-role{margin:0 0 .45rem;font-size:.8rem;font-weight:var(--w-medium);color:var(--g-700);line-height:1.45}

.doctor-opd{display:flex;gap:.45em;align-items:flex-start;font-size:.8rem;color:var(--n-600);margin:0 0 .7rem;line-height:1.5}
.doctor-opd i{color:var(--g-600);margin-top:.25em;flex:0 0 auto}
.doctor-opd a{white-space:nowrap}

/* the consultants widget on a speciality page */
.mini-avatar{
    display:grid;place-items:center;width:46px;height:46px;flex:0 0 auto;
    border-radius:var(--r-sm);overflow:hidden;
    background:var(--g-50);color:var(--g-600);--icon-accent:var(--g-500);--icon-bg:var(--g-50);
}
.mini-avatar svg{width:28px;height:28px;display:block}

@media (max-width:1080px){.doctor-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:780px){.doctor-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:460px){.doctor-grid{grid-template-columns:1fr}}

/* Speciality posters. The artwork is a finished 1:1 creative that already
   carries the name, the summary and the highlights, so the card shows it whole
   rather than cropping it to a 16:10 strip, and the body below is only the
   heading and the link — a machine-readable name and an obvious way in. */
.poster-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.poster-card{
    position:relative;display:flex;flex-direction:column;background:var(--white);
    border:1px solid var(--border);border-radius:0;overflow:hidden;
    transition:box-shadow .28s,border-color .28s;
}
/* One link per card, stretched over the whole thing. The poster is then a plain
   image rather than a second link with no accessible name of its own. */
.poster-link::after{content:"";position:absolute;inset:0}
.poster-card:focus-within{outline:2px solid var(--g-600);outline-offset:2px}
.poster-card:hover{box-shadow:var(--sh-md);border-color:var(--g-200)}
.poster-thumb{display:block;aspect-ratio:1/1;overflow:hidden;background:var(--n-100)}
.poster-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .55s var(--ease)}
.poster-card:hover .poster-thumb img{transform:scale(1.03)}
.poster-body{
    display:flex;align-items:center;justify-content:space-between;gap:16px;
    padding:16px 20px;border-top:1px solid var(--border);
}
.poster-body h3{font-size:1rem;font-weight:var(--w-semi);margin:0;line-height:1.4;letter-spacing:-.01em}
.poster-body h3 a{color:var(--n-900)}
.poster-body h3 a:hover{color:var(--g-700)}
.poster-body .link-more{margin:0;flex:0 0 auto;font-size:.82rem;color:var(--g-700)}
.poster-card:hover .link-more{color:var(--g-800)}
@media (max-width:980px){.poster-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:620px){
    .poster-grid{grid-template-columns:1fr}
    .poster-body{flex-direction:column;align-items:flex-start;gap:8px}
}

/* Blog card */
.blog-card{
    background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;
    display:flex;flex-direction:column;transition:box-shadow .28s,border-color .28s,transform .28s var(--ease);
}
.blog-card:hover{box-shadow:var(--sh-md);border-color:var(--g-200);transform:translateY(-3px)}
.blog-thumb{position:relative;display:block;aspect-ratio:16/10;overflow:hidden;background:var(--n-100)}
.blog-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .55s var(--ease)}
.blog-card:hover .blog-thumb img{transform:scale(1.04)}
.blog-thumb .badge{position:absolute;top:13px;left:13px;background:var(--white);color:var(--g-800)}
.blog-body{padding:20px;display:flex;flex-direction:column;flex:1}
.blog-meta{display:flex;flex-wrap:wrap;gap:14px;font-size:.77rem;color:var(--text-muted);margin-bottom:.6rem}
.blog-meta span{display:inline-flex;align-items:center;gap:.4em}
.blog-meta i{color:var(--g-500)}
.blog-body h3{font-size:1.06rem;line-height:1.42;margin:0 0 .5rem}
.blog-body h3 a{color:var(--n-900)}
.blog-body h3 a:hover{color:var(--g-700)}
.blog-body p{font-size:.87rem;color:var(--text-muted);margin-bottom:1rem;line-height:1.65}
.blog-body .link-more{margin-top:auto}

/* Featured post */
.feature-post{
    background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);
    overflow:hidden;display:grid;grid-template-columns:1fr 1fr;transition:box-shadow .3s;
}
.feature-post:hover{box-shadow:var(--sh-md)}
.feature-post-media{position:relative;display:block;min-height:330px;background:var(--n-100);overflow:hidden}
.feature-post-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .55s var(--ease)}
.feature-post:hover .feature-post-media img{transform:scale(1.03)}
.feature-post-body{padding:clamp(24px,3vw,40px);display:flex;flex-direction:column;justify-content:center}
.feature-post-body h2{font-size:clamp(1.35rem,2.1vw,1.8rem);margin-bottom:.6rem}
.feature-post-body h2 a{color:var(--n-900)}
.feature-post-body h2 a:hover{color:var(--g-700)}
.author-line{display:flex;align-items:center;gap:10px;margin-top:auto;padding-top:13px;border-top:1px solid var(--n-100)}
.author-line img{width:32px;height:32px;border-radius:50%;object-fit:cover;flex:0 0 auto}
.author-line div{font-size:.8rem;line-height:1.35}
.author-line strong{display:block;color:var(--n-800);font-weight:var(--w-medium)}
.author-line span{color:var(--text-muted)}

/* Package card */
.package-card{
    position:relative;background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);
    padding:28px 24px;display:flex;flex-direction:column;
    transition:box-shadow .28s,border-color .28s,transform .28s var(--ease);
}
.package-card:hover{box-shadow:var(--sh-md);transform:translateY(-3px)}
.package-card.popular{border-color:var(--g-500);box-shadow:var(--sh-sm)}
.package-tag{
    position:absolute;top:-12px;left:50%;transform:translateX(-50%);
    padding:.36em 1em;border-radius:var(--r-full);background:var(--g-600);color:var(--white);
    font-size:.68rem;font-weight:var(--w-medium);letter-spacing:.11em;text-transform:uppercase;white-space:nowrap;
}
.package-head{text-align:center;padding-bottom:18px;border-bottom:1px solid var(--border)}
.package-head .icon-box{margin:0 auto 12px}
.package-head h3{font-size:1.08rem;margin:0 0 .28rem}
.package-head p{font-size:.83rem;color:var(--text-muted);margin:0}
.package-price{display:flex;align-items:baseline;justify-content:center;flex-wrap:wrap;gap:.5em;padding:18px 0}
.package-price .old{font-size:.92rem;color:var(--n-500);text-decoration:line-through}
.package-price .now{font-size:1.9rem;font-weight:var(--w-semi);color:var(--g-800);letter-spacing:-.03em}
.package-price .tests{width:100%;text-align:center;font-size:.75rem;font-weight:var(--w-medium);color:var(--g-600);letter-spacing:.07em;text-transform:uppercase}
.check-list{list-style:none;padding:0;margin:0 0 20px;display:flex;flex-direction:column;gap:.45em}
.check-list li{display:flex;align-items:flex-start;gap:.6em;font-size:.86rem;color:var(--n-600);margin:0;line-height:1.6}
.check-list li i{color:var(--g-500);margin-top:.36em;font-size:.72rem;flex:0 0 auto}
.check-list li.more{color:var(--g-700);font-weight:var(--w-medium);padding-left:1.3em}
.package-card .btn{margin-top:auto}

/* Feature card */
.feature-card{
    display:flex;gap:16px;padding:24px;background:var(--white);border:1px solid var(--border);
    border-radius:0;transition:box-shadow .28s,border-color .28s;
}
.feature-card:hover{box-shadow:var(--sh-md);border-color:var(--g-200)}
/* no tile behind the glyph: the icon carries the accent on its own. The column
   keeps a fixed width so every card's text starts on the same line, and the
   glyph sits flush with the card padding rather than centred in dead space. */
.feature-card .icon-box{
    background:none;border-radius:0;width:40px;height:40px;
    place-items:center start;font-size:1.7rem;color:var(--g-600);
}
.feature-card:hover .icon-box{background:none;color:var(--g-700)}
.feature-card h3{font-size:1rem;margin:0 0 .35rem;line-height:1.45}
.feature-card p{font-size:.86rem;color:var(--text-muted);margin:0;line-height:1.65}

/* ==========================================================================
   MEET THE TEAM band  (heading, speciality picker, cut-out group photo)
   ========================================================================== */
/* no wrapper padding: .team-band sets its own top space and the cut-out
   photo is meant to sit on the section edge */
.team-band-section{padding:0}
.team-band{
    position:relative;overflow:hidden;background:var(--white);
    padding:clamp(26px,3vw,42px) 0 0;text-align:center;
}
/* soft contour lines behind the copy, like a topographic watermark */
.team-band::before{
    content:"";position:absolute;inset:0;pointer-events:none;
    background:
      radial-gradient(120% 80% at 8% 12%, var(--g-50) 0%, transparent 55%),
      radial-gradient(110% 75% at 94% 20%, var(--g-50) 0%, transparent 58%);
}
.team-band>*{position:relative;z-index:1}
.team-band-head{max-width:720px;margin:0 auto;padding:0 24px}
.team-band-head h2{margin-bottom:.5rem}
.team-band-head p{color:var(--text-muted);font-size:1.02rem;margin-bottom:0}


.team-band-photo{
    margin-top:clamp(14px,2vw,24px);
    line-height:0;
}
.team-band-photo img{
    /* full bleed: no max-width, so the photo grows with the viewport instead of
       leaving gaps at the sides on a wide screen */
    width:100%;margin:0;display:block;
    /* reserve the box before the lazy image lands, so nothing jumps */
    aspect-ratio:2170/481;object-fit:cover;object-position:center bottom;
}

@media (max-width:600px){
    .team-band-photo{margin-top:12px}
}

/* ==========================================================================
   STATS
   ========================================================================== */
.stats-band{background:var(--g-800);color:var(--white)}
/* four figures, one row, at every width — the general .g-4 would fold them to two on tablets */
.stats-band .g-4{grid-template-columns:repeat(4,1fr)}
.stat{text-align:center;padding:10px}
.stat i{font-size:1.5rem;color:var(--g-300);margin-bottom:.6rem;display:block}
.stat-num{font-size:clamp(1.9rem,3.1vw,2.6rem);font-weight:var(--w-semi);line-height:1.1;letter-spacing:-.03em;color:var(--white)}
.stat-label{font-size:.84rem;color:rgba(255,255,255,.72);margin-top:.4rem}

/* ==========================================================================
   SPLIT SECTIONS
   ========================================================================== */
/* Both columns share the row height, so the photo always squares up with the
   text beside it instead of ending short. */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,4.5vw,64px);align-items:stretch}
.split>*{align-self:stretch;min-width:0}
.split-media{position:relative;display:flex;flex-direction:column;min-height:100%}
.split-media img{border-radius:var(--r-lg);width:100%;object-fit:cover;box-shadow:var(--sh-md)}
.split-media>img{flex:1 1 auto;height:100%;min-height:340px}
/* the text column stays vertically centred against a tall photo */
.split>div:not(.split-media){display:flex;flex-direction:column;justify-content:center}
.split-media-stack{display:grid;grid-template-columns:1fr 1fr;gap:14px;flex:1 1 auto;min-height:340px}
.split-media-stack img{height:100%}
.split-media-stack img:first-child{grid-row:span 2;height:100%}
.media-float{
    position:absolute;bottom:-20px;left:-16px;background:var(--white);border-radius:var(--r-md);
    padding:18px 22px;box-shadow:var(--sh-lg);display:flex;align-items:center;gap:13px;max-width:76%;
    border:1px solid var(--border);
}
.media-float .num{font-size:1.8rem;font-weight:var(--w-semi);color:var(--g-700);line-height:1;letter-spacing:-.03em}
.media-float p{margin:0;font-size:.8rem;color:var(--text-muted);line-height:1.5}
.tick-list{list-style:none;padding:0;margin:0 0 1.6rem;display:grid;gap:.7em}
.tick-list li{display:flex;align-items:flex-start;gap:.7em;font-size:.94rem;margin:0}
.tick-list li i{
    flex:0 0 auto;display:grid;place-items:center;width:21px;height:21px;border-radius:50%;
    background:var(--g-100);color:var(--g-700);font-size:.62rem;margin-top:.28em;
}

/* ==========================================================================
   TESTIMONIALS
   ========================================================================== */
.testimonial-card{
    background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);padding:26px;
    display:flex;flex-direction:column;height:100%;
}
.testimonial-card blockquote{margin:.9rem 0 1.3rem;font-size:.94rem;line-height:1.75;color:var(--n-700)}
.testimonial-foot{display:flex;align-items:center;gap:13px;margin-top:auto;padding-top:16px;border-top:1px solid var(--n-100)}
.testimonial-foot img{width:46px;height:46px;border-radius:50%;object-fit:cover;flex:0 0 auto}
.testimonial-foot strong{display:block;font-size:.93rem;color:var(--n-900);line-height:1.35;font-weight:var(--w-semi)}
.testimonial-foot span{display:block;font-size:.77rem;color:var(--text-muted)}
.testimonial-treat{
    display:inline-block;margin-top:.4rem;padding:.22em .65em;border-radius:var(--r-sm);
    background:var(--g-50);color:var(--g-700);font-size:.71rem;font-weight:var(--w-medium);
}

/* Slider */
.slider{position:relative}
.slider-track{
    display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;
    scroll-behavior:smooth;padding:2px 2px 20px;
    scrollbar-width:none;-ms-overflow-style:none;
}
.slider-track::-webkit-scrollbar{display:none}
.slider-track>*{flex:0 0 min(380px,86vw);scroll-snap-align:start}
.slider-nav{display:flex;justify-content:center;gap:10px;margin-top:4px}
.slider-btn{
    width:44px;height:44px;border-radius:50%;border:1px solid var(--n-300);background:var(--white);
    color:var(--g-700);font-size:.9rem;cursor:pointer;transition:.22s;display:grid;place-items:center;
}
.slider-btn:hover{background:var(--g-700);border-color:var(--g-700);color:var(--white)}
.slider-btn:disabled{opacity:.32;cursor:not-allowed}

/* ==========================================================================
   FORMS
   ========================================================================== */
.form-row{position:relative;margin-bottom:18px}
.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:0 18px}
.form-grid .full{grid-column:1/-1}
label{display:block;font-size:.84rem;font-weight:var(--w-medium);color:var(--n-700);margin-bottom:.4em}
label .req{color:var(--danger)}
input[type=text],input[type=email],input[type=tel],input[type=date],input[type=time],input[type=number],input[type=search],select,textarea{
    width:100%;padding:.78em .95em;border:1px solid var(--n-300);border-radius:var(--r-sm);
    font-family:inherit;font-size:.92rem;font-weight:var(--w-regular);color:var(--text);background:var(--white);
    transition:border-color .2s,box-shadow .2s;
}
input:hover,select:hover,textarea:hover{border-color:var(--n-400)}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--g-500);box-shadow:0 0 0 3px var(--g-50)}
input::placeholder,textarea::placeholder{color:var(--n-500)}
textarea{resize:vertical;min-height:114px;line-height:1.65}
select{
    appearance:none;cursor:pointer;padding-right:2.5em;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23637368' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat:no-repeat;background-position:right .9em center;background-size:15px;
}
.field-error{display:block;margin-top:.35em;font-size:.79rem;color:var(--danger);font-weight:var(--w-regular)}
.field-error i{margin-right:.25em}
input.invalid,select.invalid,textarea.invalid{border-color:var(--danger);background:var(--danger-soft)}
.form-hint{font-size:.79rem;color:var(--text-muted);margin-top:.35em;line-height:1.6}
.checkbox-row{display:flex;align-items:flex-start;gap:.65em;font-size:.86rem;color:var(--n-600)}
.checkbox-row input{width:auto;margin-top:.32em;accent-color:var(--g-700)}
.checkbox-row label{margin:0;font-weight:var(--w-regular);font-size:.86rem;line-height:1.65}

.radio-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));gap:10px}
.radio-card{position:relative}
.radio-card input{position:absolute;opacity:0;pointer-events:none}
.radio-card label{
    display:flex;align-items:center;gap:.6em;margin:0;padding:.85em 1em;cursor:pointer;
    border:1px solid var(--n-300);border-radius:var(--r-sm);font-weight:var(--w-medium);font-size:.87rem;
    color:var(--n-700);transition:.2s;background:var(--white);line-height:1.4;
}
.radio-card label i{color:var(--g-500);flex:0 0 auto}
.radio-card input:checked+label{border-color:var(--g-600);background:var(--g-50);color:var(--g-800)}
.radio-card input:checked+label i{color:var(--g-700)}
.radio-card input:focus-visible+label{outline:2px solid var(--g-500);outline-offset:2px}

.alert{
    display:flex;gap:13px;padding:16px 18px;border-radius:var(--r-md);margin-bottom:24px;
    font-size:.9rem;line-height:1.65;border:1px solid transparent;
}
.alert i{font-size:1.05rem;margin-top:.16em;flex:0 0 auto}
.alert strong{display:block;margin-bottom:.15em;font-weight:var(--w-semi)}
.alert p:last-child{margin-bottom:0}
.alert-success{background:var(--g-50);border-color:var(--g-200);color:var(--g-900)}
.alert-success i{color:var(--g-600)}
.alert-error{background:var(--danger-soft);border-color:#f1cdcf;color:#7d1a22}
.alert-error i{color:var(--danger)}
.alert-info{background:var(--g-50);border-color:var(--g-100);color:var(--g-900)}
.alert-info i{color:var(--g-600)}
.alert-warn{background:var(--warning-soft);border-color:#f0e0bb;color:#6d4c00}
.alert-warn i{color:var(--warning)}

/* WhatsApp hand-off after a successful application */
.wa-handoff{
    display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:22px;
    padding:22px 24px;background:var(--g-50);border:1px solid var(--g-200);
}
.wa-handoff-text h3{display:flex;align-items:center;gap:.5em;font-size:1rem;font-weight:var(--w-semi);margin:0 0 .35rem}
.wa-handoff-text h3 i{color:#25d366}
.wa-handoff-text p{font-size:.86rem;color:var(--text-muted);margin:0;max-width:60ch;line-height:1.65}
.wa-handoff .btn{flex:0 0 auto}
.btn-whatsapp{background:#25d366;color:#0a3126;border:1px solid #25d366}
.btn-whatsapp:hover{background:#1eb958;border-color:#1eb958;color:#0a3126}
@media (max-width:760px){
    .wa-handoff{flex-direction:column;align-items:stretch;gap:16px}
    .wa-handoff .btn{width:100%;justify-content:center}
}

/* The real file input stays in the DOM for validation and keyboard use, but is
   visually replaced by a label that reports the chosen filename. */
.file-field{
    display:flex;align-items:center;gap:14px;cursor:pointer;
    border:1px solid var(--border);border-radius:var(--r-sm);background:var(--white);
    padding:7px 14px 7px 7px;transition:border-color .22s,box-shadow .22s;
}
.file-field:hover{border-color:var(--g-300)}
input[type=file]:focus-visible+.form-hint{outline:none}
input[type=file]:focus-visible~.file-field,
.file-field:focus-within{border-color:var(--g-500);box-shadow:0 0 0 3px var(--g-100)}
.file-btn{
    display:inline-flex;align-items:center;gap:.5em;flex:0 0 auto;
    padding:.5em 1em;border-radius:var(--r-xs,4px);background:var(--g-50);color:var(--g-800);
    font-size:.85rem;font-weight:var(--w-medium);white-space:nowrap;
}
.file-name{
    font-size:.86rem;color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.file-name.has-file{color:var(--g-800);font-weight:var(--w-medium)}
/* the input itself is taken out of the flow but stays focusable */
.form-row input[type=file]{
    position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
    clip:rect(0 0 0 0);white-space:nowrap;border:0;
}
.page-careers .file-field,.page-careers .file-btn,
.page-careers .wa-handoff,.page-careers .btn-whatsapp{border-radius:0}

.form-panel{
    background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);
    padding:clamp(22px,2.8vw,36px);
}
.form-section-title{
    display:flex;align-items:center;gap:.65em;font-size:.98rem;font-weight:var(--w-semi);
    color:var(--n-900);margin:0 0 1.1rem;padding-bottom:.75rem;border-bottom:1px solid var(--border);width:100%;
}
.form-section-title i{color:var(--g-600)}
.form-section-title .step{
    display:grid;place-items:center;width:24px;height:24px;border-radius:50%;flex:0 0 auto;
    background:var(--g-700);color:var(--white);font-size:.74rem;font-weight:var(--w-medium);
}
fieldset{border:0;padding:0;margin:0 0 1.8rem}

/* ==========================================================================
   FILTERS
   ========================================================================== */
.filter-bar{
    display:flex;flex-wrap:wrap;gap:14px;align-items:flex-end;
    background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);
    padding:18px 20px;margin-bottom:28px;
}
.filter-bar .f-item{flex:1 1 190px;min-width:0}
.filter-bar .f-item label,.filter-bar .f-search label{font-size:.72rem;letter-spacing:.09em;text-transform:uppercase;color:var(--text-muted)}
.filter-bar .f-search{flex:1 1 250px;position:relative}
.filter-bar .f-search input{padding-left:2.5em}
.filter-bar .f-search i{position:absolute;left:.95em;bottom:.9em;color:var(--n-500);font-size:.88rem}
.filter-count{font-size:.86rem;color:var(--text-muted);margin-bottom:20px}
.filter-count strong{color:var(--n-900)}

.chip-row{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:28px}
.chip{
    padding:.48em 1.05em;border-radius:var(--r-full);border:1px solid var(--n-300);
    background:var(--white);color:var(--n-600);font-size:.85rem;font-weight:var(--w-medium);cursor:pointer;
    font-family:inherit;transition:.2s;
}
.chip:hover{border-color:var(--g-400);color:var(--g-700)}
.chip.active{background:var(--g-700);border-color:var(--g-700);color:var(--white)}
/* The health-library chips are links, not buttons, so each speciality has a
   url of its own that can be shared and indexed. */
a.chip{display:inline-block;text-decoration:none;line-height:1.45}
a.chip:hover{text-decoration:none}

/* Health library paging */
.blog-pager{
    display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:44px;
}
.blog-pager-nums{display:flex;gap:6px;flex-wrap:wrap}
.blog-pager-nums a,.blog-pager-nums span{
    min-width:40px;padding:.5em .7em;border-radius:var(--r-md,10px);border:1px solid var(--n-300);
    background:var(--white);color:var(--n-600);font-size:.88rem;font-weight:var(--w-medium);
    text-align:center;text-decoration:none;transition:.2s;
}
.blog-pager-nums a:hover{border-color:var(--g-400);color:var(--g-700);text-decoration:none}
.blog-pager-nums .on{background:var(--g-700);border-color:var(--g-700);color:var(--white)}

.empty-state{
    text-align:center;padding:54px 24px;background:var(--bg-soft);border:1px dashed var(--n-300);
    border-radius:var(--r-lg);
}
.empty-state i{font-size:2.1rem;color:var(--n-300);margin-bottom:.9rem}
.empty-state h3{font-size:1.08rem}
.empty-state p{color:var(--text-muted);margin:0}

/* ==========================================================================
   TABS & ACCORDION
   ========================================================================== */
.tabs{display:flex;flex-wrap:wrap;gap:4px;border-bottom:1px solid var(--border);margin-bottom:28px}
.tab-btn{
    padding:.8em 1.3em;border:0;background:none;font-family:inherit;font-size:.92rem;font-weight:var(--w-medium);
    color:var(--text-muted);cursor:pointer;position:relative;transition:color .2s;
}
.tab-btn::after{
    content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--g-600);
    transform:scaleX(0);transition:transform .28s var(--ease);
}
.tab-btn:hover{color:var(--n-800)}
.tab-btn.active{color:var(--g-700)}
.tab-btn.active::after{transform:scaleX(1)}
.tab-panel{display:none}
.tab-panel.active{display:block;animation:fadeUp .35s var(--ease)}
@keyframes fadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

.accordion{border:1px solid var(--border);border-radius:var(--r-md);overflow:hidden;background:var(--white)}
.accordion+.accordion{margin-top:10px}
.acc-head{
    display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;
    padding:1.05em 1.3em;background:var(--white);border:0;font-family:inherit;font-size:.95rem;
    font-weight:var(--w-medium);color:var(--n-800);text-align:left;cursor:pointer;transition:background .2s;
}
.acc-head:hover{background:var(--g-50)}
.acc-head i{
    flex:0 0 auto;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;
    background:var(--g-50);color:var(--g-700);font-size:.7rem;transition:transform .3s var(--ease),background .2s,color .2s;
}
.acc-head[aria-expanded="true"]{background:var(--g-50);color:var(--g-900)}
.acc-head[aria-expanded="true"] i{transform:rotate(45deg);background:var(--g-700);color:var(--white)}
.acc-body{max-height:0;overflow:hidden;transition:max-height .35s var(--ease)}
.acc-body-inner{padding:0 1.3em 1.2em;color:var(--n-600);font-size:.92rem;line-height:1.75}
.acc-body-inner p:last-child,.acc-body-inner ul:last-child{margin-bottom:0}

/* ==========================================================================
   TIMELINE
   ========================================================================== */
.timeline{position:relative;padding-left:0;list-style:none;margin:0}
.timeline::before{content:"";position:absolute;left:calc(80px + 10px);top:6px;bottom:6px;width:1px;background:var(--border)}
.timeline li{display:grid;grid-template-columns:80px 42px 1fr;gap:0 2px;margin:0 0 26px;position:relative}
.timeline .t-year{font-size:1.02rem;font-weight:var(--w-semi);color:var(--g-700);text-align:right;padding-right:14px;padding-top:1px;letter-spacing:-.02em}
.timeline .t-dot{
    position:relative;z-index:2;justify-self:center;width:21px;height:21px;border-radius:50%;
    background:var(--white);border:2px solid var(--g-500);margin-top:4px;
    display:grid;place-items:center;
}
.timeline .t-dot::after{content:"";width:7px;height:7px;border-radius:50%;background:var(--g-600)}
.timeline .t-body{padding-left:12px;padding-bottom:2px}
.timeline .t-body h3,.timeline .t-body h4{margin:0 0 .25rem;font-size:1rem;font-weight:var(--w-semi);line-height:1.45}
.timeline .t-body p{margin:0;font-size:.89rem;color:var(--text-muted);line-height:1.7}

/* ==========================================================================
   GALLERY
   ========================================================================== */
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.gallery-item{
    position:relative;display:block;aspect-ratio:4/3;border-radius:var(--r-md);overflow:hidden;
    background:var(--n-100);cursor:zoom-in;
}
.gallery-item img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.gallery-item::after{
    content:"\f00e";font-family:"Font Awesome 6 Free";font-weight:900;
    position:absolute;inset:0;display:grid;place-items:center;color:var(--white);font-size:1.25rem;
    background:rgba(10,49,38,.5);opacity:0;transition:opacity .28s;
}
.gallery-item:hover img{transform:scale(1.05)}
.gallery-item:hover::after{opacity:1}

.lightbox{
    position:fixed;inset:0;z-index:300;background:rgba(6,32,24,.95);
    display:grid;place-items:center;padding:5vh 5vw;
    opacity:0;visibility:hidden;transition:.28s;
}
.lightbox.open{opacity:1;visibility:visible}
.lightbox img{max-width:100%;max-height:80vh;border-radius:var(--r-md)}
.lightbox-cap{color:rgba(255,255,255,.82);text-align:center;margin-top:14px;font-size:.89rem}
.lightbox-close,.lightbox-arrow{
    position:absolute;display:grid;place-items:center;border-radius:50%;
    background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);color:var(--white);
    cursor:pointer;transition:.22s;
}
.lightbox-close{top:20px;right:20px;width:44px;height:44px;font-size:1.05rem}
.lightbox-arrow{top:50%;transform:translateY(-50%);width:48px;height:48px;font-size:1rem}
.lightbox-close:hover,.lightbox-arrow:hover{background:var(--white);color:var(--g-900)}
.lightbox-prev{left:16px}.lightbox-next{right:16px}

/* ==========================================================================
   ARTICLE
   ========================================================================== */
.article-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:clamp(28px,3.6vw,50px);align-items:start}
/* grid children default to min-width:auto, which lets a wide child — the tab
   strip here — stretch the column instead of scrolling inside it */
.article-layout>*{min-width:0}
.article{font-size:1rem;line-height:1.85;color:var(--n-700)}
.article>img,.article figure img{border-radius:var(--r-lg);margin-bottom:1.8rem;box-shadow:var(--sh-sm)}
.article h2{font-size:1.4rem;margin:2.1rem 0 .7rem;color:var(--n-900)}
.article h3{font-size:1.14rem;margin:1.7rem 0 .55rem;color:var(--n-900)}
.article h4{font-size:1.02rem;margin:1.5rem 0 .5rem}
.article ul,.article ol{margin-bottom:1.4rem}
.article li{margin-bottom:.5em}
.article blockquote{
    margin:1.8rem 0;padding:1.3rem 1.6rem;border-left:3px solid var(--g-500);
    background:var(--g-50);border-radius:0 var(--r-md) var(--r-md) 0;
    font-size:1rem;color:var(--g-900);
}
.article blockquote p:last-child{margin-bottom:0}
.article-meta{
    display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;
    padding:16px 0;margin-bottom:1.8rem;border-top:1px solid var(--border);border-bottom:1px solid var(--border);
    font-size:.85rem;color:var(--text-muted);
}
.article-meta>span{display:inline-flex;align-items:center;gap:.4em}
.article-meta i{color:var(--g-500)}
.article-author{display:flex;align-items:center;gap:10px}
.article-author img{width:40px;height:40px;border-radius:50%;object-fit:cover}
.article-author strong{display:block;font-size:.88rem;color:var(--n-900);line-height:1.35;font-weight:var(--w-semi)}
.article-author span{font-size:.76rem}
.tag-row{display:flex;flex-wrap:wrap;gap:8px;margin:2.2rem 0}
.tag{
    padding:.36em .9em;border-radius:var(--r-full);background:var(--n-100);color:var(--n-600);
    font-size:.8rem;font-weight:var(--w-medium);
}
.tag:hover{background:var(--g-100);color:var(--g-800)}
.share-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:20px 0;border-top:1px solid var(--border)}
.share-row span{font-size:.86rem;font-weight:var(--w-medium);color:var(--n-700)}
.share-btn{
    display:grid;place-items:center;width:38px;height:38px;border-radius:50%;
    background:var(--n-100);color:var(--n-600);font-size:.88rem;transition:.22s;border:0;cursor:pointer;
}
.share-btn:hover{background:var(--g-700);color:var(--white)}

.author-box{display:flex;gap:20px;align-items:flex-start;flex-wrap:wrap}
.author-box-photo{width:110px;flex:0 0 auto;border-radius:var(--r-md);overflow:hidden}
.author-box-body{flex:1 1 250px}
.author-box-body h3{font-size:1.08rem;margin:.25rem 0}
.author-box-role{font-size:.87rem;color:var(--g-700);font-weight:var(--w-medium);margin-bottom:.45rem}
.author-box-body p{font-size:.89rem;color:var(--text-muted)}

/* Sidebar */
.sidebar{display:flex;flex-direction:column;gap:20px;position:sticky;top:calc(var(--nav-h) + 20px)}
.widget{background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);padding:22px}
.widget-title{
    font-size:.95rem;font-weight:var(--w-semi);margin:0 0 1rem;padding-bottom:.7rem;
    border-bottom:1px solid var(--border);display:flex;align-items:center;gap:.55em;
}
.widget-title i{color:var(--g-600);font-size:.9em}
.widget ul{list-style:none;padding:0;margin:0}
.widget li{margin:0}
.widget li+li{border-top:1px solid var(--n-100)}
.widget li a{display:block;padding:.68em 0;font-size:.88rem;color:var(--n-700)}
.widget li a:hover{color:var(--g-700)}
.widget li a.no-pointer,.widget .static-row{display:block;padding:.68em 0;font-size:.88rem;color:var(--n-700)}
.widget .check-list{margin-bottom:0}
.mini-post{display:flex;gap:12px;padding:.8em 0}
.mini-post img{width:64px;height:52px;border-radius:var(--r-sm);object-fit:cover;flex:0 0 auto}
.mini-post h3,.mini-post h4{margin:0 0 .2rem;font-size:.86rem;font-weight:var(--w-medium);line-height:1.45}
.mini-post h3 a,.mini-post h4 a{color:var(--n-800)}
.mini-post h3 a:hover,.mini-post h4 a:hover{color:var(--g-700)}
.mini-post time{font-size:.74rem;color:var(--text-muted)}
.widget-cta{background:var(--g-800);border-color:transparent;text-align:center}
.widget-cta h2,.widget-cta h3,.widget-cta h4{color:var(--white);font-size:1.1rem;margin-bottom:.45rem;text-transform:none;letter-spacing:-.01em}
.widget-cta p{color:rgba(255,255,255,.74);font-size:.87rem;margin-bottom:1.1rem}

/* ==========================================================================
   DOCTOR PROFILE
   ========================================================================== */
.profile-head{display:grid;grid-template-columns:288px 1fr;gap:clamp(24px,3.2vw,42px);align-items:start}
.profile-photo{border-radius:var(--r-lg);overflow:hidden;aspect-ratio:1/1;background:var(--n-100);box-shadow:var(--sh-sm)}
.profile-photo img{width:100%;height:100%;object-fit:cover;object-position:center 22%}
.profile-info h1,.profile-name{margin:.6rem 0 .3rem;font-size:clamp(1.7rem,3.1vw,2.4rem);font-weight:var(--w-semi);line-height:1.2;letter-spacing:-.025em;color:var(--n-900)}
.profile-role{font-size:1rem;color:var(--g-700);font-weight:var(--w-medium);margin-bottom:.4rem}
.profile-qual{color:var(--text-muted);font-size:.92rem;margin-bottom:1.2rem}
.profile-stats{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:1.5rem}
.profile-stat{background:var(--white);border:1px solid var(--border);border-radius:var(--r-md);padding:12px 18px;min-width:120px}
.profile-stat .v{font-size:1.35rem;font-weight:var(--w-semi);color:var(--g-700);line-height:1.2;letter-spacing:-.02em}
.profile-stat .l{font-size:.75rem;color:var(--text-muted)}
.fee-card{background:var(--g-50);border:1px solid var(--g-100);border-radius:var(--r-md);padding:18px}
.fee-card h2,.fee-card h3{font-size:.82rem;font-weight:var(--w-medium);letter-spacing:.09em;text-transform:uppercase;color:var(--text-muted);margin-bottom:.4rem}
.fee-card .amount{font-size:1.6rem;font-weight:var(--w-semi);color:var(--g-800);line-height:1.2;margin:0 0 .3rem;letter-spacing:-.02em}
.fee-card p{margin:0;font-size:.79rem;color:var(--text-muted);line-height:1.6}
.cred-list{padding-left:0;list-style:none;margin:0}
.cred-list li{display:flex;gap:.65em;align-items:flex-start;font-size:.9rem;margin-bottom:.65em;color:var(--n-600)}
.cred-list li i{color:var(--g-500);margin-top:.35em;font-size:.76em;flex:0 0 auto}

.schedule-table{width:100%;border-collapse:collapse;font-size:.89rem}
.schedule-table th,.schedule-table td{padding:.8em .95em;text-align:left;border-bottom:1px solid var(--border)}
.schedule-table th{font-size:.72rem;letter-spacing:.09em;text-transform:uppercase;color:var(--text-muted);font-weight:var(--w-medium);background:var(--n-50)}
.schedule-table tr:last-child td{border-bottom:0}
.schedule-table .yes{color:var(--g-600);font-weight:var(--w-medium)}
.schedule-table .no{color:var(--n-500)}
.table-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:var(--r-md);background:var(--white)}

/* ==========================================================================
   CTA BANDS
   ========================================================================== */
.cta-band{
    background:var(--g-800);color:var(--white);border-radius:var(--r-xl);
    padding:clamp(30px,4vw,52px);
}
.cta-band h2{color:var(--white);margin-bottom:.5rem}
.cta-band p{color:rgba(255,255,255,.76);max-width:58ch;margin-bottom:1.6rem}
.cta-band .eyebrow{color:var(--g-300)}
.cta-split{display:grid;grid-template-columns:1.2fr auto;gap:30px;align-items:center}
/* A grid child will not shrink below its content, and the band's buttons do not
   wrap, so on the narrowest phones the longest label pushed the page sideways.
   Let the column shrink, and let the buttons take the full width and wrap. */
.cta-split>*{min-width:0}
@media (max-width:420px){
    .cta-band .btn{white-space:normal;width:100%;justify-content:center;text-align:center}
}
.cta-split p{margin-bottom:0}

/* The right of this band was empty above the numbers, so the reception desk
   fills it. It is masked rather than cut out: the photograph fades into the
   green on its left and bottom instead of sitting in it as a rectangle. */
.emergency-band{
    position:relative;overflow:hidden;
    display:grid;grid-template-columns:1fr minmax(0,290px);gap:clamp(22px,3vw,44px);
    align-items:end;
    background:var(--g-900);color:var(--white);
    padding:clamp(26px,3.2vw,40px);border-radius:var(--r-xl);
}
.emergency-band h2,.emergency-band h3{color:var(--white)}
.emergency-band p{color:rgba(255,255,255,.76)}
.emergency-band .badge-live{background:rgba(255,255,255,.14);color:var(--white)}
.emergency-band .badge-live::before{background:#ff8f7d}
.emergency-intro{max-width:56ch;margin-bottom:1.6rem}
.emergency-photo{position:relative;align-self:stretch;min-height:280px;margin:-40px -40px -40px 0}
.emergency-photo img{
    position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 12%;
    -webkit-mask-image:linear-gradient(to right,transparent,#000 42%),linear-gradient(to top,transparent,#000 26%);
            mask-image:linear-gradient(to right,transparent,#000 42%),linear-gradient(to top,transparent,#000 26%);
    -webkit-mask-composite:source-in;
            mask-composite:intersect;
}
/* one browser in the wild ignores mask-composite; a single left fade still reads */
@supports not (mask-composite: intersect){
    .emergency-photo img{-webkit-mask-image:linear-gradient(to right,transparent,#000 42%);
                                 mask-image:linear-gradient(to right,transparent,#000 42%)}
}
@media (max-width:900px){
    .emergency-band{grid-template-columns:1fr}
    .emergency-photo{display:none}
}
/* two by two beside the photograph: four across would not fit the narrower
   column, and three-plus-one reads as a mistake */
.emergency-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
@media (max-width:620px){.emergency-grid{grid-template-columns:1fr}}
.emergency-num{
    display:flex;align-items:center;gap:13px;padding:16px 18px;border-radius:var(--r-md);
    background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);
    transition:background .22s;color:var(--white);
}
.emergency-num:hover{background:rgba(255,255,255,.13);color:var(--white)}
.emergency-num i{font-size:1.3rem;flex:0 0 auto;color:var(--g-300)}
.emergency-num small{display:block;font-size:.72rem;opacity:.72;letter-spacing:.05em;text-transform:uppercase;margin-bottom:.1rem}
.emergency-num strong{font-size:1rem;color:var(--white);font-weight:var(--w-semi)}

/* ==========================================================================
   FOOTER
   ========================================================================== */
.site-footer{background:var(--g-950);color:rgba(255,255,255,.64);padding:clamp(48px,5.5vw,72px) 0 0;font-size:.9rem}
.footer-grid{display:grid;grid-template-columns:1.45fr .92fr 1.02fr .92fr 1.35fr;gap:clamp(20px,2.2vw,34px);padding-bottom:44px}
.site-footer h2,.site-footer h3,.site-footer h4{
    color:var(--white);font-size:.82rem;font-weight:var(--w-semi);
    letter-spacing:.13em;text-transform:uppercase;margin-bottom:1.2rem;
}
.site-footer p{color:rgba(255,255,255,.6);line-height:1.75;font-size:.88rem}
.site-footer ul{list-style:none;padding:0;margin:0}
.site-footer li{margin-bottom:.55em}
.site-footer a{color:rgba(255,255,255,.68)}
.site-footer a:hover{color:var(--white)}
.footer-links a{display:inline-flex;align-items:flex-start;gap:.5em;font-size:.86rem;line-height:1.5}
.footer-links i{font-size:.55rem;color:var(--g-400);margin-top:.55em;flex:0 0 auto}
.footer-logo{display:flex;align-items:center;margin-bottom:1.1rem}
.footer-logo .logo-img{height:46px}
.footer-contact li{display:flex;gap:.7em;align-items:flex-start;color:rgba(255,255,255,.66);font-size:.86rem;line-height:1.6}
.footer-contact i{color:var(--g-400);margin-top:.35em;width:14px;flex:0 0 auto;font-size:.88em}
.footer-contact strong{color:var(--white);display:block;font-size:.9rem;font-weight:var(--w-medium)}
.footer-contact a{color:inherit}
.footer-social{display:flex;gap:10px;margin-top:1.3rem}
.footer-social a{
    display:grid;place-items:center;width:36px;height:36px;border-radius:50%;
    background:rgba(255,255,255,.07);color:rgba(255,255,255,.78);font-size:.88rem;transition:.22s;
}
.footer-social a:hover{background:var(--g-600);color:var(--white)}
.footer-badges{display:flex;flex-wrap:wrap;gap:8px;margin-top:1.3rem}
.footer-badge{
    display:inline-flex;align-items:center;gap:.45em;padding:.4em .8em;border-radius:var(--r-sm);
    background:rgba(255,255,255,.06);font-size:.73rem;font-weight:var(--w-medium);color:rgba(255,255,255,.78);
}
.footer-badge i{color:var(--g-400)}
.newsletter{display:flex;gap:8px;margin-top:.8rem;max-width:320px}
.newsletter input{
    flex:1;padding:.72em .9em;border-radius:var(--r-sm);border:1px solid rgba(255,255,255,.16);
    background:rgba(255,255,255,.05);color:var(--white);font-size:.87rem;
}
.newsletter input::placeholder{color:rgba(255,255,255,.5)}
.newsletter input:focus{border-color:var(--g-500);box-shadow:none;background:rgba(255,255,255,.09)}
.newsletter button{
    width:44px;flex:0 0 auto;border:0;border-radius:var(--r-sm);background:var(--g-600);
    color:var(--white);font-size:.9rem;cursor:pointer;transition:.22s;
}
.newsletter button:hover{background:var(--g-500)}
.footer-bottom{
    border-top:1px solid rgba(255,255,255,.08);padding:20px 0;
    display:flex;flex-wrap:wrap;gap:10px 24px;align-items:center;justify-content:space-between;
    font-size:.82rem;color:rgba(255,255,255,.5);
}
.footer-bottom-links{display:flex;flex-wrap:wrap;gap:18px}
/* who built the site: present, but quieter than the hospital's own lines */
.footer-credit{color:rgba(255,255,255,.5)}
.footer-credit a{color:rgba(255,255,255,.72);font-weight:var(--w-medium)}
.footer-credit a:hover{color:var(--white);text-decoration:underline}
.footer-disclaimer{
    padding:14px 0 20px;font-size:.76rem;color:rgba(255,255,255,.5);line-height:1.75;
    border-top:1px solid rgba(255,255,255,.05);margin:0;
}
.footer-disclaimer strong{color:rgba(255,255,255,.55);font-weight:var(--w-medium)}

/* ==========================================================================
   FLOATING ACTIONS
   ========================================================================== */
.float-actions{position:fixed;right:18px;bottom:18px;z-index:90;display:flex;flex-direction:column;gap:10px}
.float-btn{
    position:relative;display:grid;place-items:center;width:50px;height:50px;border-radius:50%;
    color:var(--white);font-size:1.15rem;box-shadow:var(--sh-lg);transition:transform .24s var(--ease);
}
.float-btn:hover{transform:scale(1.06);color:var(--white)}
.float-wa{background:#25d366}
.float-call{background:var(--g-700)}
.float-btn .tip{
    position:absolute;right:calc(100% + 10px);top:50%;transform:translateY(-50%);
    padding:.45em .8em;border-radius:var(--r-sm);background:var(--n-900);color:var(--white);
    font-size:.78rem;font-weight:var(--w-medium);white-space:nowrap;opacity:0;pointer-events:none;transition:.22s;
}
.float-btn:hover .tip{opacity:1}
.to-top{
    position:fixed;left:18px;bottom:18px;z-index:90;width:42px;height:42px;border-radius:50%;
    background:var(--white);border:1px solid var(--border);color:var(--g-700);font-size:.9rem;
    cursor:pointer;box-shadow:var(--sh-md);opacity:0;visibility:hidden;transition:.28s;
}
.to-top.show{opacity:1;visibility:visible}
.to-top:hover{background:var(--g-700);color:var(--white);border-color:var(--g-700)}

/* ==========================================================================
   MISC COMPONENTS
   ========================================================================== */
.logo-row{display:flex;flex-wrap:wrap;gap:10px}
.logo-row-center{justify-content:center}
.logo-pill{
    display:inline-flex;align-items:center;gap:.5em;padding:.58em 1.05em;border-radius:var(--r-sm);
    background:var(--white);border:1px solid var(--border);font-size:.84rem;font-weight:var(--w-regular);
    color:var(--n-700);transition:.22s;
}
.logo-pill:hover{border-color:var(--g-400);color:var(--g-700)}
.logo-pill i{color:var(--g-500);font-size:.9em}

/* Vacancies: one row per post, details on the left and the action pinned right,
   so Apply is visible without opening anything. */
.vacancy-list{display:flex;flex-direction:column;gap:14px}
.vacancy{
    display:flex;align-items:center;gap:26px;padding:24px 26px;
    background:var(--white);border:1px solid var(--border);border-radius:0;
    transition:box-shadow .28s,border-color .28s;
}
.vacancy:hover{box-shadow:var(--sh-md);border-color:var(--g-200)}
.vacancy-main{flex:1 1 auto;min-width:0}
.vacancy-main h3{font-size:1.06rem;font-weight:var(--w-semi);margin:0 0 .55rem;letter-spacing:-.01em;line-height:1.4}
.vacancy-badges{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 .7rem}
.badge-quiet{background:var(--n-100);color:var(--n-700)}
.vacancy-desc{font-size:.88rem;color:var(--text-muted);line-height:1.65;margin:0 0 .7rem}
.vacancy-meta{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px 22px}
.vacancy-meta li{display:flex;align-items:flex-start;gap:.5em;font-size:.82rem;color:var(--n-700);line-height:1.5}
.vacancy-meta i{color:var(--g-600);font-size:.8rem;margin-top:.22em;flex:0 0 auto}
.vacancy-action{flex:0 0 auto}
.vacancy-action .btn{white-space:nowrap}
.vacancy-badges .badge{letter-spacing:.03em}
.page-careers .badge{border-radius:0}

/* the Human Resources profile at the top of the careers page */
.hr-profile-role{margin:0 0 1.1rem;font-size:.95rem;font-weight:var(--w-medium);color:var(--g-700)}
#hr-desk .split-media>img{object-position:center 22%;max-height:560px}
#hr-desk .btn-group{flex-wrap:wrap}
@media (max-width:560px){#hr-desk .btn-group .btn{flex:1 1 100%;justify-content:center}}

.vacancy-spec{
    display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:26px;
    padding:24px 26px;background:var(--g-50);border:1px solid var(--g-200);border-radius:0;
}
.vacancy-spec h3{font-size:1rem;font-weight:var(--w-semi);margin:0 0 .3rem}
.vacancy-spec p{font-size:.86rem;color:var(--text-muted);margin:0;max-width:62ch;line-height:1.65}
.vacancy-spec .btn{flex:0 0 auto}

@media (max-width:760px){
    .vacancy,.vacancy-spec{flex-direction:column;align-items:stretch;gap:16px}
    .vacancy-action .btn,.vacancy-spec .btn{width:100%;justify-content:center}
}

/* Careers runs hard-square, like the specialities grid and the feature cards —
   form controls included, so the attach field matches the fields around it. */
.page-careers .info-card,
.page-careers .form-panel,
.page-careers .alert,
.page-careers .media-float,
.page-careers .split-media>img,
.page-careers .form-row input,
.page-careers .form-row select,
.page-careers .form-row textarea{border-radius:0}

.info-card{display:flex;gap:14px;padding:20px;background:var(--white);border:1px solid var(--border);border-radius:var(--r-md);color:var(--text)}
a.info-card{transition:border-color .22s,box-shadow .22s}
a.info-card:hover{border-color:var(--g-300);box-shadow:var(--sh-sm);color:var(--text)}
.info-card>i{color:var(--g-600);font-size:1.1rem;margin-top:.2em;flex:0 0 auto}
.info-card h2,.info-card h3,.info-card h4{margin:0 0 .25rem;font-size:.95rem;font-weight:var(--w-semi);line-height:1.45;letter-spacing:-.01em}
.info-card p{margin:0;font-size:.86rem;color:var(--text-muted);line-height:1.65}
.info-card-sm{padding:15px}
.info-card-sm h2,.info-card-sm h3,.info-card-sm h4{font-size:.9rem}
.info-card-sm p{font-size:.81rem}

.map-frame{border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--border);line-height:0}
.map-frame iframe{width:100%;height:400px;border:0;display:block;filter:grayscale(.2)}

.pill-list{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:0 0 1.2rem}
.pill-list li{margin:0;padding:.4em .95em;border-radius:var(--r-full);background:var(--g-50);color:var(--g-800);font-size:.84rem}

.service-item{display:flex;gap:14px;padding:18px 0;border-bottom:1px solid var(--n-100)}
.service-item:last-child{border-bottom:0}
.service-item .n{
    flex:0 0 auto;display:grid;place-items:center;width:30px;height:30px;border-radius:var(--r-sm);
    background:var(--g-50);color:var(--g-700);font-size:.8rem;font-weight:var(--w-medium);
}
.service-item h3,.service-item h4{margin:0 0 .22rem;font-size:.98rem;font-weight:var(--w-semi);line-height:1.45}
.service-item p{margin:0;font-size:.88rem;color:var(--text-muted);line-height:1.7}

/* the OPD token steps, numbered by .service-item rather than the list itself */
.token-steps{list-style:none;margin:0 0 1rem;padding:0}
.token-steps .service-item{margin:0}
.token-mini{margin:0 0 .9rem;padding-left:1.3em;display:grid;gap:.35em;font-size:.88rem;color:var(--n-700)}
.token-mini li{margin:0;padding-left:.2em}
.widget-photo{margin:-22px -22px 18px;border-radius:var(--r-lg) var(--r-lg) 0 0;overflow:hidden}
.widget-photo img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}

/* support services: three to a row, a short last row centred rather than left hanging */
.services-row{display:flex;flex-wrap:wrap;justify-content:center;gap:24px}
.services-row>*{flex:0 1 calc((100% - 48px) / 3);min-width:0}
@media (max-width:980px){.services-row>*{flex-basis:calc((100% - 24px) / 2)}}
@media (max-width:640px){.services-row{gap:14px}.services-row>*{flex-basis:100%}}

.timetable td small{display:block;color:var(--text-muted);font-size:.78rem;line-height:1.45;margin-top:.15em}
.timetable .nowrap{white-space:nowrap}
@media (max-width:600px){
    .timetable th,.timetable td{padding:.7em .6em}
}

.stat-inline{display:flex;flex-wrap:wrap;gap:10px 26px;margin:0 0 1.5rem;padding:0;list-style:none}
.stat-inline li{margin:0;display:flex;align-items:center;gap:.5em;font-size:.86rem;font-weight:var(--w-regular);color:var(--n-600)}
.stat-inline i{color:var(--g-500);font-size:.85em}

.prose-panel{background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);padding:clamp(22px,2.8vw,36px)}
.prose-panel>h2:first-child,.prose-panel>.eyebrow:first-child{margin-top:0}
.prose-panel h2{font-size:1.35rem;margin-top:2rem}
.prose-panel h3{font-size:1.08rem;margin-top:1.6rem}
/* a card heading inside an article sits level with its icon or number */
.prose-panel .service-item h3,.prose-panel .info-card h3{margin-top:0}
.alert-error .tick-list li i{background:#f6d5d8;color:var(--danger)}
.alert .tick-list{gap:.55em}
.prose-panel p,.prose-panel li{color:var(--n-600);font-size:.94rem}
.prose-panel strong{color:var(--n-900)}

.quick-link-label{font-size:.92rem;font-weight:var(--w-medium);color:var(--n-900);line-height:1.45}

.link-list{padding-left:0;list-style:none;margin:0}
.link-list li{padding:.4em 0;border-bottom:1px solid var(--n-100);margin:0}
.link-list li:last-child{border-bottom:0}
.link-list a{font-size:.89rem}
.link-list i{color:var(--g-500);width:17px;font-size:.85em}
.link-list .meta{font-size:.78rem;color:var(--text-muted)}

.number-lg{font-size:clamp(4rem,10vw,6.5rem);font-weight:var(--w-semi);line-height:1;color:var(--g-100);letter-spacing:-.03em;margin-bottom:.5rem}

.pagination{display:flex;justify-content:center;gap:6px;margin-top:40px;flex-wrap:wrap}
.pagination a,.pagination span{
    display:grid;place-items:center;min-width:40px;height:40px;padding:0 .75em;border-radius:var(--r-sm);
    border:1px solid var(--border);background:var(--white);font-size:.88rem;font-weight:var(--w-medium);color:var(--n-700);
}
.pagination a:hover{border-color:var(--g-400);color:var(--g-700)}
.pagination .current{background:var(--g-700);border-color:var(--g-700);color:var(--white)}

/* Contact block that closes the home page — kept compact, since the footer
   repeats the same details straight underneath it. */
.basic-info-band{padding-top:clamp(26px,3vw,40px);padding-bottom:clamp(26px,3vw,40px);background:var(--bg-soft)}
.basic-info-band .section-head{margin-bottom:clamp(20px,2.4vw,30px)}
.basic-info-band .card{padding:20px 22px}
.basic-info-band .num-row{padding:.5em 0}
.basic-info-band .num-row a{font-size:.98rem}
.basic-info-band .time-row{padding:.42em 0;font-size:.86rem}
.basic-info-band .map-frame iframe{height:300px}
@media (max-width:860px){
    .basic-info-band .map-frame iframe{height:240px}
}

/* ---------- Extra utilities ---------- */
.icon-box-sm{width:40px;height:40px;font-size:1rem;border-radius:var(--r-sm)}
/* The MD's message runs without a photograph, so it needs a reading measure of
   its own rather than the full content column. */
.md-message{max-width:820px;margin:0 auto}
.md-message h2{margin-bottom:1.1rem}
.md-message p{font-size:1.02rem;line-height:1.85}
.md-sign{margin-top:2rem;padding-top:1.4rem;border-top:1px solid var(--border)}
/* the founder's line, set apart from the message that follows it */
.lead-quote{
    margin:.4rem 0 1.3rem;padding-left:18px;border-left:3px solid var(--g-500);
    font-size:1.12rem;line-height:1.6;color:var(--g-800);font-weight:var(--w-medium);
}
#md-message .split-media>img{object-position:center 20%}

/* This page runs hard-square: every panel on it drops its corner radius. */
.page-directors .card,
.page-directors .icon-box,
.page-directors .cta-band,
.page-directors .alert,
.page-directors .director-card{border-radius:0}

/* Chief executive: a portrait beside a short brief on the home page, the same
   portrait leading the page it links to. */
.ceo-band{
    display:grid;grid-template-columns:132px 1fr;gap:clamp(20px,3vw,34px);align-items:center;
    padding:clamp(22px,2.6vw,32px);background:var(--white);
    border:1px solid var(--border);color:var(--text);
    transition:box-shadow .28s,border-color .28s;
}
.ceo-band:hover{box-shadow:var(--sh-md);border-color:var(--g-200);color:var(--text)}
.ceo-band-photo{display:block;width:132px;height:132px;border-radius:50%;overflow:hidden;background:var(--g-50)}
.ceo-band-photo img{width:100%;height:100%;object-fit:cover;object-position:center 22%;display:block}
.ceo-band-body{display:block}
.ceo-band-body strong{display:block;font-size:1.16rem;font-weight:var(--w-semi);margin:.2rem 0 .1rem;letter-spacing:-.015em}
.ceo-band-role{display:block;font-size:.82rem;color:var(--g-700);font-weight:var(--w-medium);margin-bottom:.6rem}
.ceo-band-text{display:block;font-size:.92rem;color:var(--text-muted);line-height:1.7;max-width:72ch}
.ceo-band .link-more{margin-top:.7rem}

.ceo-intro{display:grid;grid-template-columns:300px 1fr;gap:clamp(28px,4vw,56px);align-items:start}
/* the portrait we were given is a circular crop, so the frame is a circle */
.ceo-portrait{border-radius:50%;overflow:hidden;background:var(--g-50);aspect-ratio:1/1}
.ceo-portrait img{width:100%;height:100%;object-fit:cover;object-position:center 22%;display:block}
.ceo-meta{display:flex;flex-wrap:wrap;gap:8px 22px;margin:.2rem 0 1.1rem}
.ceo-meta span{display:flex;align-items:center;gap:.5em;font-size:.86rem;color:var(--n-700)}
.ceo-meta i{color:var(--g-600);font-size:.82rem}

/* the person icon standing in until a photograph is supplied */
.portrait-fallback{display:grid;place-items:center;width:100%;height:100%;border-radius:inherit;overflow:hidden;
    background:var(--g-50);color:var(--g-600);--icon-accent:var(--g-500);--icon-bg:var(--g-50)}
.portrait-fallback svg{width:58%;height:58%;display:block}

@media (max-width:820px){
    .ceo-band{grid-template-columns:96px 1fr;gap:18px;align-items:start}
    .ceo-band-photo{width:96px;height:96px}
    .ceo-intro{grid-template-columns:1fr;gap:26px}
    .ceo-portrait{max-width:280px}
}
@media (max-width:520px){
    .ceo-band{grid-template-columns:1fr;gap:16px}
    .ceo-band-photo{width:110px;height:110px}
}

/* Board portraits: four square photographs on one row, squared off to match
   the specialities grid and the feature cards. */
.director-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:20px}
.director-card{
    background:var(--white);border:1px solid var(--border);border-radius:0;overflow:hidden;
    display:flex;flex-direction:column;transition:box-shadow .28s,border-color .28s;
}
.director-card:hover{box-shadow:var(--sh-md);border-color:var(--g-200)}
.director-photo{display:block;aspect-ratio:1/1;overflow:hidden;background:var(--n-100)}
.director-photo img{width:100%;height:100%;object-fit:cover;object-position:center 18%;
    transition:transform .55s var(--ease)}
.director-card:hover .director-photo img{transform:scale(1.03)}
.director-body{padding:16px 18px 18px;text-align:center}
.director-body h3{font-size:1.02rem;font-weight:var(--w-semi);margin:0;letter-spacing:-.01em;line-height:1.4}
.director-role{
    display:block;margin-top:.3rem;font-size:.69rem;font-weight:var(--w-medium);
    letter-spacing:.1em;text-transform:uppercase;color:var(--g-600);
}
@media (max-width:1080px){.director-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:760px){.director-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.director-grid{grid-template-columns:1fr;gap:18px}}

.leader-photo{aspect-ratio:1/1}
.old-price{color:var(--n-500);text-decoration:line-through}
.price-now{color:var(--g-800);font-weight:var(--w-semi)}
.mt-auto{margin-top:auto}
.num-row{display:flex;align-items:center;gap:13px;padding:.65em 0;border-bottom:1px solid var(--n-100)}
.num-row:last-child{border-bottom:0}
.num-row small{display:block;font-size:.74rem;color:var(--text-muted);letter-spacing:.03em;line-height:1.4}
.num-row a{font-size:1.02rem;font-weight:var(--w-semi);color:var(--g-800);letter-spacing:-.01em}
.num-row a:hover{color:var(--g-600)}
.time-row{display:flex;align-items:baseline;justify-content:space-between;gap:14px;flex-wrap:wrap;
    padding:.55em 0;border-bottom:1px solid var(--n-100);font-size:.89rem}
.time-row:last-child{border-bottom:0}
.time-row span{color:var(--text-muted);display:inline-flex;align-items:center;gap:.5em}
.time-row strong{color:var(--n-900);font-weight:var(--w-medium);text-align:right}
.stat-value{font-size:1.9rem;font-weight:var(--w-semi);color:var(--g-800);line-height:1.15;letter-spacing:-.03em}
.head-count{font-size:.8rem;font-weight:var(--w-regular);color:var(--text-muted);margin-left:.5em}
.icon-green{color:var(--g-600)}
.plain-list{padding-left:0;list-style:none;margin:0}
.plain-list li{margin:0}
.sub-head{font-size:1.02rem;font-weight:var(--w-semi);margin:2rem 0 1rem;display:flex;align-items:center;gap:.55em}
.sub-head:first-of-type{margin-top:0}
.sub-head i{color:var(--g-600);font-size:.92em}
.card-title-sm{font-size:1rem;font-weight:var(--w-semi);margin:0 0 .5rem}
.narrow-56{max-width:56ch}
.narrow-30{max-width:30ch}
.center-box{max-width:740px;margin:0 auto}
.badge-on-dark{background:rgba(255,255,255,.16);color:var(--white);margin-bottom:1rem}
.two-col{columns:2;column-gap:26px}
@media (max-width:860px){.two-col{columns:1}}

/* ---------- Reveal ---------- */
.js .reveal{opacity:0;transform:translateY(18px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.js .reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
    *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
    .js .reveal{opacity:1;transform:none}
    html{scroll-behavior:auto}
}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width:1160px){
    .footer-grid{grid-template-columns:repeat(4,1fr)}
    .footer-brand{grid-column:1/-1}
    .g-4{grid-template-columns:repeat(2,1fr)}
    .article-layout{grid-template-columns:minmax(0,1fr) 285px}
}
/* Eight top-level items need the full 1280px column. Below that the desktop
   nav would spill past the header, so it hands over to the drawer. */
@media (max-width:1279px){
    .main-nav{display:none}
    .nav-toggle{display:grid;place-items:center}
    .nav-cta{margin-left:auto}
}
@media (max-width:1150px){
    :root{--nav-h:68px}
    .split{grid-template-columns:1fr;gap:32px;align-items:center}
    .split-media{order:-1;min-height:0}
    .split-media>img{aspect-ratio:4/3;flex:none;height:auto;min-height:0}
    .split-media-stack{min-height:0}
    .profile-head{grid-template-columns:230px 1fr}
    .article-layout{grid-template-columns:1fr}
    .sidebar{position:static;flex-direction:row;flex-wrap:wrap}
    .sidebar .widget{flex:1 1 290px;min-width:0}
    .quick-strip .grid{grid-template-columns:repeat(2,1fr)}
    .quick-item{border-bottom:1px solid var(--border)}
    .quick-item:nth-child(2n){border-right:0}
    .cta-split{grid-template-columns:1fr;gap:20px}
    .feature-post{grid-template-columns:1fr}
    .feature-post-media{min-height:230px}
}
@media (max-width:860px){
    .topbar .hide-sm{display:none}
    .topbar .container{justify-content:center}
    .g-3,.g-4,.g-2{grid-template-columns:1fr}
    .g-auto-340,.g-auto-300{grid-template-columns:1fr}
    .form-grid{grid-template-columns:1fr}
    .footer-grid{grid-template-columns:repeat(2,1fr)}
    .profile-head{grid-template-columns:1fr}
    .profile-photo{max-width:270px}
    /* the four figures stay on one line on every screen, just smaller */
    .stats-band .g-4{grid-template-columns:repeat(4,1fr);gap:10px}
    .stat{padding:4px 2px}
    .stat i{font-size:1.15rem;margin-bottom:.4rem}
    .stat-num{font-size:1.35rem}
    .stat-label{font-size:.72rem;line-height:1.3;margin-top:.25rem}
    .timeline::before{left:10px}
    .timeline li{grid-template-columns:21px 1fr;gap:0 14px}
    .timeline .t-year{grid-column:1/-1;text-align:left;padding:0 0 .35rem 35px;order:-1}
    .timeline .t-dot{justify-self:start}
    .timeline .t-body{padding-left:0}
    .map-frame iframe{height:300px}
    .media-float{left:0;bottom:-14px;padding:14px 16px;max-width:88%}
    .author-box-photo{width:88px}
}
@media (max-width:640px){
    .nav-book-label{display:none}
    .nav-book{width:42px;height:42px;padding:0;border-radius:50%}
    .nav-cta{gap:8px}
}
@media (max-width:600px){
    .container{padding:0 18px}
    .topbar .hide-xs{display:none}
    .quick-strip{margin-top:-28px}
    .quick-strip-flat{margin-top:28px}
    .quick-strip .grid{grid-template-columns:1fr}
    .quick-item{border-right:0}
    .btn-group .btn{width:100%}
    .footer-grid{grid-template-columns:1fr}
    .footer-bottom{flex-direction:column;text-align:center}
    .stats-band .g-4{gap:4px}
    .stat i{font-size:1rem;margin-bottom:.3rem}
    .stat-num{font-size:1.05rem;letter-spacing:-.02em}
    .stat-label{font-size:.62rem}
    .tabs{gap:0;overflow-x:auto;flex-wrap:nowrap;-ms-overflow-style:none;scrollbar-width:none}
    .tabs::-webkit-scrollbar{display:none}
    .tab-btn{white-space:nowrap;padding:.75em 1em;font-size:.88rem}
    .float-actions{right:14px;bottom:14px}
    .to-top{left:14px;bottom:14px}
    .testimonial-card{padding:22px}
    .lightbox-arrow{width:40px;height:40px}
    .lightbox-prev{left:6px}.lightbox-next{right:6px}
}

/* ---------- Print ---------- */
/* ==========================================================================
   PHONE DOCK AND ASSISTANT
   A bottom bar the way a hospital app lays it out, shown on phones only. It
   takes over from the floating WhatsApp and call buttons there, which would
   otherwise sit on top of it.
   ========================================================================== */
.mobile-dock{display:none}
.chatbot[hidden]{display:none!important}

.chatbot{
    position:fixed;z-index:120;right:18px;bottom:18px;width:min(380px,calc(100vw - 36px));
    max-height:min(580px,calc(100vh - 120px));max-height:min(580px,calc(100dvh - 120px));
    display:flex;flex-direction:column;overflow:hidden;
    background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--sh-lg);
}
.chatbot-head{
    display:flex;align-items:center;gap:12px;padding:14px 14px 14px 16px;
    background:var(--g-900);color:var(--white);
}
.chatbot-avatar{
    display:grid;place-items:center;flex:0 0 auto;width:38px;height:38px;border-radius:50%;
    background:rgba(255,255,255,.14);font-size:1rem;
}
.chatbot-head h2{margin:0;font-size:.98rem;font-weight:var(--w-semi);color:var(--white);line-height:1.3}
.chatbot-head p{margin:0;font-size:.76rem;color:rgba(255,255,255,.72);line-height:1.4}
.chatbot-close{
    margin-left:auto;display:grid;place-items:center;width:40px;height:40px;border:0;border-radius:50%;
    background:transparent;color:var(--white);font-size:1.1rem;cursor:pointer;
}
.chatbot-close:hover,.chatbot-close:focus-visible{background:rgba(255,255,255,.14)}

.chatbot-head,.chatbot-chips,.chatbot-form{flex:0 0 auto}
.chatbot-log{flex:1 1 auto;min-height:0;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px;background:var(--n-50)}
.chat-msg{max-width:88%;padding:10px 12px;border-radius:14px;font-size:.88rem;line-height:1.55}
.chat-msg p{margin:0}
.chat-msg p+p{margin-top:.4em}
.chat-bot{align-self:flex-start;background:var(--white);border:1px solid var(--border);border-bottom-left-radius:4px;color:var(--text)}
.chat-user{align-self:flex-end;background:var(--g-700);color:var(--white);border-bottom-right-radius:4px;white-space:pre-wrap;overflow-wrap:anywhere}
.chat-bot.is-urgent{border-color:#f1c2c5;background:var(--danger-soft)}
.chat-bot.is-urgent p:first-child{color:var(--danger);font-weight:var(--w-semi)}
.chat-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.chat-action{
    display:inline-flex;align-items:center;min-height:36px;padding:.4em .9em;border-radius:var(--r-full);
    border:1px solid var(--g-200);background:var(--white);color:var(--g-800);
    font-size:.8rem;font-weight:var(--w-medium);text-decoration:none;
}
.chat-action:hover{background:var(--g-50);color:var(--g-900)}
.chat-action.is-primary{background:var(--g-700);border-color:var(--g-700);color:var(--white)}
.chat-action.is-primary:hover{background:var(--g-800);color:var(--white)}
.is-urgent .chat-action.is-primary{background:var(--danger);border-color:var(--danger)}

.chatbot-chips{
    display:flex;gap:6px;overflow-x:auto;padding:10px 12px;border-top:1px solid var(--border);
    background:var(--white);scrollbar-width:none;
}
.chatbot-chips::-webkit-scrollbar{display:none}
.chat-chip{
    flex:0 0 auto;min-height:34px;padding:.35em .85em;border-radius:var(--r-full);
    border:1px solid var(--border);background:var(--n-50);color:var(--n-700);
    font:inherit;font-size:.78rem;font-weight:var(--w-medium);white-space:nowrap;cursor:pointer;
}
.chat-chip:hover{border-color:var(--g-300);color:var(--g-800)}
.chatbot-form{display:flex;gap:8px;padding:10px 12px 12px;border-top:1px solid var(--border);background:var(--white)}
/* 16px so iOS does not zoom the page when the field is focused */
.chatbot-form input{flex:1 1 auto;min-width:0;height:44px;padding:0 14px;font-size:16px;border-radius:var(--r-full)}
.chatbot-form button{
    flex:0 0 auto;display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:50%;
    background:var(--g-700);color:var(--white);cursor:pointer;
}
.chatbot-form button:hover{background:var(--g-800)}

@media (max-width:767px){
    .mobile-dock{
        position:fixed;left:0;right:0;bottom:0;z-index:110;
        display:grid;grid-template-columns:repeat(5,1fr);
        padding:6px 4px calc(6px + env(safe-area-inset-bottom));
        background:var(--white);border-top:1px solid var(--border);
        box-shadow:0 -6px 20px rgba(6,32,24,.08);
    }
    .dock-item{
        display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
        min-height:52px;padding:4px 2px;border:0;background:none;cursor:pointer;
        color:var(--n-600);font:inherit;font-size:.68rem;font-weight:var(--w-medium);line-height:1.1;
        text-decoration:none;-webkit-tap-highlight-color:transparent;
    }
    .dock-item i{font-size:1.2rem;line-height:1}
    .dock-item .brand-icon{width:1.25rem;height:1.25rem}
    .dock-item:hover,.dock-item:focus-visible{color:var(--g-800)}
    .dock-item.is-current,.dock-item[aria-expanded="true"]{color:var(--g-700)}
    .dock-item.is-current span,.dock-item[aria-expanded="true"] span{font-weight:var(--w-semi)}
    /* booking is the one action the bar exists for, so it gets the filled mark */
    .dock-book i{
        display:grid;place-items:center;width:34px;height:34px;margin-top:-4px;border-radius:50%;
        background:var(--g-700);color:var(--white);font-size:1rem;
    }
    .dock-wa .brand-icon{color:#1a9e52}

    /* room for the bar, so the footer's last line is never under it */
    body{padding-bottom:calc(68px + env(safe-area-inset-bottom))}
    .float-actions{display:none}
    .to-top{bottom:calc(78px + env(safe-area-inset-bottom))}

    .chatbot{
        left:8px;right:8px;width:auto;
        bottom:calc(72px + env(safe-area-inset-bottom));
        max-height:calc(100vh - 190px);max-height:calc(100dvh - 190px);
    }
}

@media print{
    .topbar,.site-header,.site-footer,.float-actions,.to-top,.nav-overlay,.mobile-nav,.hero-search{display:none!important}
    body{font-size:11pt;color:#000}
    .page-hero{background:none!important;color:#000;padding:0 0 18pt}
    .page-hero::before{display:none}
    .page-hero h1,.page-hero p{color:#000}
    .section{padding:12pt 0}
    a{color:#000;text-decoration:underline}
    .card,.doctor-card,.package-card{break-inside:avoid;box-shadow:none;border:1px solid #ccc}
}