/* =============================================================
   MediCare+ — Premium Healthcare Landing Page
   style.css
   -------------------------------------------------------------
   01. Design tokens
   02. Base & reset
   03. Utilities & shared components
   04. Scroll progress + custom cursor
   05. Navbar
   06. Hero
   07. Stats strip
   08. About
   09. Services
   10. Specialists
   11. Advanced care / technology
   12. Patient journey
   13. Testimonials
   14. Appointment CTA
   15. Footer
   16. Reveal animations
   17. Responsive
   ============================================================= */

/* ---------- 01. DESIGN TOKENS ---------- */
:root{
  /* colour system */
  --navy-900:#061a33;
  --navy-800:#0b2545;
  --navy-700:#123a63;
  --navy-600:#1c4f80;
  --blue-600:#1f6feb;
  --blue-500:#2f80ff;
  --blue-400:#5b9dff;
  --blue-100:#e3edff;
  --blue-50:#f2f7ff;
  --cyan-500:#18b5c9;
  --cyan-400:#34d3e0;
  --cyan-100:#dcf7fa;
  --white:#ffffff;
  --paper:#f6f9ff;
  --ink:#0d1b2a;
  --muted:#5a6b81;
  --line:rgba(11,37,69,.09);
  --line-strong:rgba(11,37,69,.14);

  /* gradients */
  --grad-brand:linear-gradient(120deg,var(--blue-500) 0%,var(--cyan-400) 100%);
  --grad-deep:linear-gradient(135deg,var(--navy-800) 0%,var(--navy-700) 55%,#0e4b73 100%);
  --grad-soft:linear-gradient(160deg,#ffffff 0%,var(--blue-50) 100%);

  /* radii */
  --r-sm:12px;
  --r-md:18px;
  --r-lg:26px;
  --r-xl:34px;
  --r-2xl:44px;
  --r-pill:999px;

  /* shadows */
  --sh-xs:0 2px 8px rgba(11,37,69,.06);
  --sh-sm:0 6px 20px rgba(11,37,69,.07);
  --sh-md:0 16px 40px rgba(11,37,69,.09);
  --sh-lg:0 28px 70px rgba(11,37,69,.13);
  --sh-xl:0 40px 110px rgba(11,37,69,.18);
  --sh-brand:0 18px 42px rgba(47,128,255,.30);

  /* spacing */
  --sp-1:.5rem;
  --sp-2:1rem;
  --sp-3:1.5rem;
  --sp-4:2rem;
  --sp-5:3rem;
  --sp-6:4rem;
  --sp-7:6rem;
  --sp-8:8rem;

  --container:1240px;
  --nav-h:86px;

  /* motion */
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --t-fast:.22s;
  --t:.4s;
  --t-slow:.75s;
}

/* ---------- 02. BASE & RESET ---------- */
*,*::before,*::after{box-sizing:border-box;}
*{margin:0;padding:0;}

html{
  scroll-behavior:smooth;
  scroll-padding-top:calc(var(--nav-h) + 16px);
  -webkit-text-size-adjust:100%;
}

body{
  font-family:"Inter","Segoe UI",-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;
  color:var(--ink);
  background:var(--white);
  line-height:1.65;
  font-size:16.5px;
  letter-spacing:-.006em;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

img{max-width:100%;display:block;height:auto;}
a{color:inherit;text-decoration:none;}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;}
ul,ol{list-style:none;}
address{font-style:normal;}
svg{display:block;}

h1,h2,h3,h4{line-height:1.12;letter-spacing:-.028em;font-weight:700;}

::selection{background:var(--cyan-400);color:var(--navy-900);}

:focus-visible{
  outline:2.5px solid var(--blue-500);
  outline-offset:3px;
  border-radius:6px;
}

.skip-link{
  position:absolute;left:-999px;top:10px;z-index:2000;
  background:var(--navy-800);color:#fff;padding:.7rem 1.2rem;border-radius:var(--r-sm);
}
.skip-link:focus{left:16px;}

/* custom scrollbar (desktop) */
@media (pointer:fine){
  ::-webkit-scrollbar{width:10px;}
  ::-webkit-scrollbar-track{background:var(--blue-50);}
  ::-webkit-scrollbar-thumb{background:linear-gradient(var(--blue-400),var(--cyan-400));border-radius:99px;border:2px solid var(--blue-50);}
}

/* ---------- 03. UTILITIES & SHARED ---------- */
.container{
  width:100%;
  max-width:var(--container);
  margin-inline:auto;
  padding-inline:clamp(1.1rem,4vw,2.2rem);
}

.section{
  position:relative;
  padding-block:clamp(4.5rem,9vw,8rem);
}

.h2{
  font-size:clamp(2rem,4.2vw,3.35rem);
  letter-spacing:-.035em;
}
.h2--light{color:#fff;}

.lead{
  font-size:clamp(1rem,1.25vw,1.12rem);
  color:var(--muted);
  max-width:56ch;
  margin-top:1.1rem;
}
.lead--light{color:rgba(226,238,255,.72);}

.grad{
  background:var(--grad-brand);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}
.grad--light{
  background:linear-gradient(100deg,#7fc4ff 0%,var(--cyan-400) 60%,#a7f3f8 100%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
}

.eyebrow{
  display:inline-flex;align-items:center;gap:.55rem;
  font-size:.735rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  color:var(--blue-600);margin-bottom:1rem;
}
.eyebrow::before{
  content:"";width:26px;height:2px;border-radius:2px;background:var(--grad-brand);
}
.eyebrow--light{color:var(--cyan-400);}

.sec-head{
  display:grid;grid-template-columns:1.35fr .85fr;gap:clamp(1.5rem,4vw,3.5rem);
  align-items:end;margin-bottom:clamp(2.5rem,5vw,4rem);
}
.sec-head--center{grid-template-columns:1fr;text-align:center;justify-items:center;}
.sec-head--center .eyebrow{justify-content:center;}
.sec-head__note{color:var(--muted);font-size:1.02rem;padding-bottom:.4rem;}

.pill{
  display:inline-flex;align-items:center;gap:.6rem;
  padding:.5rem 1.05rem .5rem .75rem;
  background:var(--white);
  border:1px solid var(--line-strong);
  border-radius:var(--r-pill);
  font-size:.82rem;font-weight:600;color:var(--navy-700);
  box-shadow:var(--sh-xs);
}
.pill--light{
  background:rgba(255,255,255,.14);
  border-color:rgba(255,255,255,.28);
  color:#fff;
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
}
.pill__dot{
  width:8px;height:8px;border-radius:50%;background:var(--cyan-500);
  box-shadow:0 0 0 4px rgba(52,211,224,.22);
  animation:softPulse 2.4s var(--ease) infinite;
}
.pill--light .pill__dot{background:#8ef3ff;box-shadow:0 0 0 4px rgba(142,243,255,.24);}

@keyframes softPulse{
  0%,100%{transform:scale(1);opacity:1;}
  50%{transform:scale(.78);opacity:.65;}
}

/* icons */
.ico{
  display:inline-grid;place-items:center;flex:none;
  width:34px;height:34px;border-radius:11px;
}
.ico--cyan{background:var(--cyan-100);color:var(--cyan-500);}
.ico--blue{background:var(--blue-100);color:var(--blue-600);}
.ico--navy{background:rgba(11,37,69,.08);color:var(--navy-800);}

.stars{color:#ffb020;letter-spacing:.12em;font-size:.95rem;line-height:1;}

.dot-live{
  width:8px;height:8px;border-radius:50%;flex:none;
  background:#22c55e;box-shadow:0 0 0 3px rgba(34,197,94,.2);
  animation:softPulse 2s var(--ease) infinite;
}

/* buttons */
.btn{
  --btn-y:.95rem;
  position:relative;
  display:inline-flex;align-items:center;justify-content:center;gap:.6rem;
  padding:var(--btn-y) 1.7rem;
  border-radius:var(--r-pill);
  font-weight:650;font-size:.95rem;letter-spacing:-.01em;
  cursor:pointer;isolation:isolate;overflow:hidden;
  transition:transform var(--t) var(--ease-out),box-shadow var(--t) var(--ease),
             background-color var(--t) var(--ease),color var(--t) var(--ease),
             border-color var(--t) var(--ease);
  will-change:transform;
}
.btn > *{position:relative;z-index:2;}
.btn--sm{--btn-y:.72rem;padding-inline:1.35rem;font-size:.9rem;}

.btn--primary{
  background:var(--grad-brand);color:#fff;
  box-shadow:var(--sh-brand);
}
.btn--primary::before{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(120deg,var(--cyan-400) 0%,var(--blue-500) 100%);
  opacity:0;transition:opacity var(--t) var(--ease);
}
.btn--primary:hover::before{opacity:1;}
.btn--primary:hover{box-shadow:0 22px 52px rgba(47,128,255,.42);}

.btn--ghost{
  background:var(--white);color:var(--navy-800);
  border:1px solid var(--line-strong);box-shadow:var(--sh-xs);
}
.btn--ghost:hover{border-color:var(--blue-400);color:var(--blue-600);box-shadow:var(--sh-sm);}

.btn--dark{background:var(--navy-800);color:#fff;box-shadow:0 16px 36px rgba(11,37,69,.24);}
.btn--dark:hover{background:var(--navy-700);box-shadow:0 20px 46px rgba(11,37,69,.3);}

.btn--white{background:#fff;color:var(--navy-800);box-shadow:0 18px 46px rgba(4,20,40,.24);}
.btn--white:hover{box-shadow:0 24px 56px rgba(4,20,40,.32);}

.btn--outline{
  background:rgba(255,255,255,.08);color:#fff;
  border:1px solid rgba(255,255,255,.4);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
}
.btn--outline:hover{background:rgba(255,255,255,.18);border-color:#fff;}

.btn:active{transform:scale(.975);}

/* shine sweep on hover */
.btn::after{
  content:"";position:absolute;top:0;left:-60%;width:45%;height:100%;z-index:3;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.32),transparent);
  transform:skewX(-18deg);transition:left .65s var(--ease-out);
  pointer-events:none;
}
.btn:hover::after{left:130%;}
.btn--ghost::after,.btn--white::after{background:linear-gradient(100deg,transparent,rgba(47,128,255,.14),transparent);}

.link-arrow{
  display:inline-flex;align-items:center;gap:.5rem;
  font-weight:650;color:var(--blue-600);font-size:.95rem;
  transition:gap var(--t) var(--ease),color var(--t) var(--ease);
}
.link-arrow:hover{gap:.85rem;color:var(--cyan-500);}

/* floating animation */
.float{animation:floaty 6.5s var(--ease) infinite;animation-delay:var(--d,0s);}
@keyframes floaty{
  0%,100%{transform:translate3d(0,0,0);}
  50%{transform:translate3d(0,-13px,0);}
}

/* ---------- 04. SCROLL PROGRESS + CURSOR ---------- */
.scroll-progress{
  position:fixed;inset:0 0 auto 0;height:3px;z-index:1200;
  background:rgba(11,37,69,.06);pointer-events:none;
}
.scroll-progress span{
  display:block;height:100%;width:0;
  background:var(--grad-brand);
  box-shadow:0 0 12px rgba(52,211,224,.6);
  transition:width .1s linear;
}

.cursor,.cursor-ring{
  position:fixed;top:0;left:0;z-index:9999;pointer-events:none;
  border-radius:50%;opacity:0;
  transition:opacity .3s var(--ease);
}
.cursor{
  width:7px;height:7px;background:var(--blue-600);
  transform:translate(-50%,-50%);
}
.cursor-ring{
  width:36px;height:36px;border:1.5px solid rgba(47,128,255,.55);
  transform:translate(-50%,-50%);
  transition:opacity .3s var(--ease),width .3s var(--ease-out),
             height .3s var(--ease-out),background-color .3s var(--ease),
             border-color .3s var(--ease);
}
body.cursor-ready .cursor,
body.cursor-ready .cursor-ring{opacity:1;}
body.cursor-ready.cursor-hidden .cursor,
body.cursor-ready.cursor-hidden .cursor-ring{opacity:0;}
.cursor-ring.is-hover{
  width:62px;height:62px;
  background:rgba(47,128,255,.10);
  border-color:rgba(52,211,224,.75);
}
.cursor-ring.is-down{width:26px;height:26px;}
@media (pointer:coarse),(max-width:900px){
  .cursor,.cursor-ring{display:none;}
}

/* ---------- 05. NAVBAR ---------- */
.nav{
  position:fixed;inset:0 0 auto 0;z-index:1100;
  transition:background-color var(--t) var(--ease),box-shadow var(--t) var(--ease),
             border-color var(--t) var(--ease),backdrop-filter var(--t) var(--ease);
  border-bottom:1px solid transparent;
}
.nav__inner{
  height:var(--nav-h);
  display:flex;align-items:center;justify-content:space-between;gap:1.5rem;
  transition:height var(--t) var(--ease);
}
.nav.is-scrolled{
  background:rgba(255,255,255,.78);
  backdrop-filter:blur(18px) saturate(160%);
  -webkit-backdrop-filter:blur(18px) saturate(160%);
  border-bottom-color:var(--line);
  box-shadow:0 10px 34px rgba(11,37,69,.07);
}
.nav.is-scrolled .nav__inner{height:70px;}

.logo{display:inline-flex;align-items:center;gap:.65rem;font-weight:800;font-size:1.22rem;letter-spacing:-.035em;}
.logo__mark{
  display:grid;place-items:center;width:38px;height:38px;
  border-radius:12px;background:var(--grad-brand);color:#fff;
  box-shadow:0 8px 20px rgba(47,128,255,.34);
  transition:transform var(--t) var(--ease-out),box-shadow var(--t) var(--ease);
}
.logo:hover .logo__mark{transform:rotate(90deg) scale(1.06);box-shadow:0 10px 26px rgba(52,211,224,.45);}
.logo__text{color:var(--navy-800);}
.logo__text em{font-style:normal;color:var(--cyan-500);}

.nav__links{display:flex;align-items:center;gap:.35rem;}
/* drawer-only chrome: hidden on desktop, shown inside the mobile drawer */
.nav__drawer-head{display:none;}
.nav__link{
  position:relative;padding:.55rem .95rem;border-radius:var(--r-pill);
  font-size:.94rem;font-weight:550;color:var(--navy-700);
  transition:color var(--t) var(--ease),background-color var(--t) var(--ease);
}
.nav__link::after{
  content:"";position:absolute;left:50%;bottom:.28rem;translate:-50% 0;
  width:0;height:2px;border-radius:2px;background:var(--grad-brand);
  transition:width var(--t) var(--ease-out);
}
.nav__link:hover{color:var(--blue-600);}
.nav__link:hover::after,.nav__link.is-active::after{width:20px;}
.nav__link.is-active{color:var(--blue-600);font-weight:650;}

.nav__right{display:flex;align-items:center;gap:.8rem;}
.nav__cta-mobile{display:none;}

/* --- menu button: rounded container + two-phase burger/X morph --- */
.burger{
  display:none;
  position:relative;
  width:46px;height:46px;
  border-radius:14px;
  border:1px solid var(--line-strong);
  background:#fff;
  place-items:center;
  box-shadow:var(--sh-xs);
  -webkit-tap-highlight-color:transparent;
  transition:background-color var(--t) var(--ease),border-color var(--t) var(--ease),
             box-shadow var(--t) var(--ease),transform var(--t-fast) var(--ease-out);
}
/* soft brand wash that fades in on hover / while open */
.burger::before{
  content:"";position:absolute;inset:0;border-radius:inherit;
  background:linear-gradient(140deg,rgba(47,128,255,.10),rgba(52,211,224,.14));
  opacity:0;transition:opacity var(--t) var(--ease);
}
.burger:hover{border-color:rgba(47,128,255,.38);box-shadow:var(--sh-sm);}
.burger:hover::before{opacity:1;}
.burger:active{transform:scale(.94);}
.burger.is-open{border-color:rgba(47,128,255,.42);box-shadow:var(--sh-sm);}
.burger.is-open::before{opacity:1;}

/* fixed-size icon box keeps the lines optically centred in the button */
.burger__box{
  position:relative;z-index:1;
  display:block;width:20px;height:14px;
}
.burger__line{
  position:absolute;left:0;top:50%;
  width:100%;height:2px;margin-top:-1px;
  /* closed state: lines spread apart only AFTER the X has un-rotated */
  transition:transform .32s var(--ease-out) .17s;
}
.burger__line i{
  display:block;width:100%;height:100%;
  border-radius:2px;background:var(--navy-800);
  transition:transform .32s var(--ease-out) 0s,
             opacity .2s var(--ease) .12s,
             background-color var(--t) var(--ease);
}
.burger__line:nth-child(1){transform:translateY(-6px);}
.burger__line:nth-child(3){transform:translateY(6px);}
.burger:hover .burger__line i{background:var(--blue-600);}

/* open state: lines converge to centre first, then rotate into the X */
.burger.is-open .burger__line{transform:translateY(0);transition-delay:0s;}
.burger.is-open .burger__line i{transition-delay:.19s;}
.burger.is-open .burger__line:nth-child(1) i{transform:rotate(45deg);}
.burger.is-open .burger__line:nth-child(3) i{transform:rotate(-45deg);}
/* middle line collapses into the centre point */
.burger.is-open .burger__line:nth-child(2) i{
  opacity:0;transform:scaleX(.15);transition-delay:0s,0s,0s;
}

.nav-backdrop{
  /* sits above the navbar, below the drawer — single clear stacking order */
  position:fixed;inset:0;z-index:1150;
  background:rgba(6,26,51,.42);
  backdrop-filter:blur(6px) saturate(120%);
  -webkit-backdrop-filter:blur(6px) saturate(120%);
  opacity:0;visibility:hidden;
  transition:opacity .45s var(--ease),visibility 0s linear .45s;
}
.nav-backdrop.is-visible{
  opacity:1;visibility:visible;
  transition:opacity .45s var(--ease),visibility 0s linear 0s;
}

/* ---------- 06. HERO ---------- */
.hero{
  position:relative;
  padding-top:calc(var(--nav-h) + clamp(2rem,5vw,4rem));
  padding-bottom:clamp(4rem,7vw,6rem);
  min-height:100svh;
  display:flex;align-items:center;
  background:
    radial-gradient(1100px 600px at 78% 18%,rgba(52,211,224,.13),transparent 62%),
    radial-gradient(900px 700px at 8% 6%,rgba(47,128,255,.11),transparent 60%),
    var(--grad-soft);
  overflow:hidden;
}
.hero__bg{position:absolute;inset:0;pointer-events:none;}
.blob{position:absolute;border-radius:50%;filter:blur(80px);opacity:.5;}
.blob--1{width:520px;height:520px;top:-140px;right:-90px;background:rgba(52,211,224,.4);}
.blob--2{width:460px;height:460px;bottom:-180px;left:-140px;background:rgba(47,128,255,.28);}
.grid-lines{
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(11,37,69,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(11,37,69,.045) 1px,transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(circle at 50% 40%,#000 0%,transparent 72%);
  -webkit-mask-image:radial-gradient(circle at 50% 40%,#000 0%,transparent 72%);
}

.hero__inner{
  position:relative;z-index:2;
  display:grid;grid-template-columns:1.02fr .98fr;
  gap:clamp(2rem,5vw,4.5rem);align-items:center;
}

.hero__title{
  font-size:clamp(2.5rem,5.3vw,4.35rem);
  letter-spacing:-.042em;line-height:1.05;
  margin-top:1.4rem;
}
.hero__title .line{display:block;overflow:hidden;}
.hero__title .line > span{
  display:block;
  transform:translateY(105%);
  transition:transform 1s var(--ease-out);
}
.hero__title.is-in .line > span{transform:translateY(0);}
.hero__title.is-in .line:nth-child(2) > span{transition-delay:.11s;}
.hero__title.is-in .line:nth-child(3) > span{transition-delay:.22s;}

.hero__lead{
  color:var(--muted);font-size:clamp(1rem,1.2vw,1.1rem);
  max-width:50ch;margin-top:1.5rem;
}
.hero__actions{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:2.1rem;}

.hero__trust{display:flex;align-items:center;gap:1rem;margin-top:2.4rem;}
.avatars{display:flex;align-items:center;}
.avatars img,.avatars__more{
  width:42px;height:42px;border-radius:50%;object-fit:cover;
  border:3px solid #fff;box-shadow:var(--sh-xs);margin-right:-12px;
}
.avatars__more{
  display:grid;place-items:center;background:var(--navy-800);color:#fff;
  font-size:.72rem;font-weight:700;letter-spacing:-.02em;
}
.hero__trust-text p{font-size:.88rem;color:var(--muted);margin-top:.2rem;}
.hero__trust-text strong{color:var(--navy-800);}

/* hero visual composition */
.hero__visual{position:relative;}
.hero__stage{
  position:relative;
  aspect-ratio:1/1.06;
  max-width:560px;margin-inline:auto;
}
.stage__ring{
  position:absolute;inset:6% 8% 4% 6%;
  border-radius:50%;
  border:1.5px dashed rgba(47,128,255,.26);
  animation:spinSlow 46s linear infinite;
}
.stage__glow{
  position:absolute;inset:12%;
  border-radius:50%;
  background:radial-gradient(circle,rgba(52,211,224,.28),transparent 68%);
  filter:blur(28px);
}
@keyframes spinSlow{to{transform:rotate(360deg);}}

.hero__photo{
  position:absolute;left:50%;bottom:0;translate:-50% 0;
  width:78%;height:94%;
  border-radius:210px 210px var(--r-2xl) var(--r-2xl);
  overflow:hidden;
  background:linear-gradient(180deg,#dceaff,#f4f9ff);
  box-shadow:var(--sh-xl);
}
.hero__photo img{width:100%;height:100%;object-fit:cover;object-position:50% 22%;}
.hero__photo::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 55%,rgba(11,37,69,.18));
}

/* floating cards */
.fcard{
  position:absolute;z-index:3;
  background:rgba(255,255,255,.84);
  backdrop-filter:blur(16px) saturate(150%);
  -webkit-backdrop-filter:blur(16px) saturate(150%);
  border:1px solid rgba(255,255,255,.75);
  border-radius:var(--r-md);
  box-shadow:var(--sh-lg);
  padding:.85rem .95rem;
  will-change:transform;
}
.fcard__row{display:flex;align-items:center;gap:.6rem;}
.fcard__row strong{display:block;font-size:.83rem;color:var(--navy-800);line-height:1.3;}
.fcard__row small{font-size:.68rem;color:var(--muted);}

.fcard--stats{top:6%;left:-4%;width:186px;}
.fcard__value{font-size:1.5rem;font-weight:800;color:var(--navy-800);margin-top:.5rem;letter-spacing:-.04em;}
.fcard__value span{font-size:.72rem;font-weight:600;color:var(--muted);}
.spark{width:100%;height:30px;margin-top:.2rem;}
.spark path{
  stroke-dasharray:260;stroke-dashoffset:260;
  animation:drawLine 3.4s var(--ease) infinite;
}
@keyframes drawLine{
  0%{stroke-dashoffset:260;}
  55%{stroke-dashoffset:0;}
  100%{stroke-dashoffset:0;opacity:.35;}
}

.fcard--appt{bottom:16%;right:-6%;width:214px;}
.fcard__head{display:flex;align-items:center;gap:.55rem;margin-bottom:.6rem;}
.fcard__head strong{font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);}
.fcard__name{font-size:.98rem;font-weight:750;color:var(--navy-800);letter-spacing:-.02em;}
.fcard__meta{font-size:.75rem;color:var(--muted);margin-top:.1rem;}
.fcard__bar{height:5px;border-radius:99px;background:var(--blue-100);margin-top:.7rem;overflow:hidden;}
.fcard__bar i{
  display:block;height:100%;width:72%;border-radius:99px;background:var(--grad-brand);
  animation:barFill 3.8s var(--ease) infinite;
}
@keyframes barFill{
  0%,100%{width:34%;}
  50%{width:78%;}
}

.fcard--badge{
  top:30%;right:-8%;
  display:flex;align-items:center;gap:.7rem;
  padding:.8rem 1.1rem .8rem .85rem;
  background:var(--navy-800);border-color:rgba(255,255,255,.14);
  box-shadow:0 22px 46px rgba(11,37,69,.34);
}
.fcard--badge strong{display:block;font-size:1.08rem;color:#fff;letter-spacing:-.03em;line-height:1.1;}
.fcard--badge small{font-size:.68rem;color:rgba(226,238,255,.62);}
.pulse{
  width:12px;height:12px;border-radius:50%;flex:none;
  background:var(--cyan-400);position:relative;
}
.pulse::after{
  content:"";position:absolute;inset:-6px;border-radius:50%;
  border:1.5px solid var(--cyan-400);opacity:.7;
  animation:ripple 2.2s var(--ease-out) infinite;
}
@keyframes ripple{
  0%{transform:scale(.6);opacity:.8;}
  100%{transform:scale(1.5);opacity:0;}
}

.fcard--avail{
  bottom:2%;left:-2%;
  display:flex;align-items:center;gap:.55rem;
  padding:.7rem 1rem;
}
.fcard--avail p{font-size:.8rem;color:var(--muted);}
.fcard--avail strong{color:var(--navy-800);}

.fcard--exp{
  top:-2%;right:6%;width:150px;text-align:left;
  background:rgba(255,255,255,.9);
}
.fcard__exp-num{
  font-size:1.85rem;font-weight:800;letter-spacing:-.05em;
  background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;line-height:1;
}
.fcard__exp-num span{font-size:1.1rem;}
.fcard--exp p{font-size:.7rem;color:var(--muted);margin-top:.3rem;line-height:1.4;}

.scroll-hint{
  position:absolute;left:50%;bottom:1.6rem;translate:-50% 0;z-index:3;
  display:flex;flex-direction:column;align-items:center;gap:.5rem;
  font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);
  transition:color var(--t) var(--ease);
}
.scroll-hint:hover{color:var(--blue-600);}
.scroll-hint__mouse{
  width:23px;height:37px;border-radius:99px;border:1.5px solid rgba(11,37,69,.24);
  display:grid;justify-items:center;padding-top:7px;
}
.scroll-hint__mouse i{
  width:3px;height:7px;border-radius:2px;background:var(--blue-500);
  animation:mouseDot 1.9s var(--ease) infinite;
}
@keyframes mouseDot{
  0%{transform:translateY(0);opacity:0;}
  30%{opacity:1;}
  70%{transform:translateY(11px);opacity:0;}
  100%{opacity:0;}
}

/* ---------- 07. STATS ---------- */
.stats{position:relative;padding-block:clamp(2rem,4vw,3rem);}
.stats__panel{
  display:grid;grid-template-columns:.86fr 1.4fr;gap:clamp(1.6rem,3.4vw,3rem);
  background:var(--grad-deep);
  border-radius:var(--r-2xl);
  padding:clamp(2rem,4vw,3.4rem);
  color:#fff;position:relative;overflow:hidden;
  box-shadow:var(--sh-lg);
}
.stats__panel::before{
  content:"";position:absolute;top:-40%;right:-10%;
  width:520px;height:520px;border-radius:50%;
  background:radial-gradient(circle,rgba(52,211,224,.32),transparent 66%);
  filter:blur(30px);
}
.stats__panel::after{
  content:"";position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:52px 52px;
  mask-image:linear-gradient(115deg,#000,transparent 70%);
  -webkit-mask-image:linear-gradient(115deg,#000,transparent 70%);
}
.stats__aside,.stats__grid{position:relative;z-index:2;}
.stats__aside .eyebrow{color:var(--cyan-400);}
.stats__title{font-size:clamp(1.55rem,2.5vw,2.1rem);letter-spacing:-.035em;}
.stats__aside p{color:rgba(226,238,255,.66);font-size:.95rem;margin-top:.9rem;max-width:34ch;}
.stats__aside .link-arrow{color:var(--cyan-400);margin-top:1.3rem;}
.stats__aside .link-arrow:hover{color:#fff;}

.stats__grid{
  display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(.8rem,1.6vw,1.2rem);
}
.stat{
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.12);
  border-radius:var(--r-lg);
  padding:1.4rem 1.4rem 1.25rem;
  transition:transform var(--t) var(--ease-out),background-color var(--t) var(--ease),
             border-color var(--t) var(--ease);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
}
.stat:nth-child(even){transform:translateY(16px);}
.stat:hover{background:rgba(255,255,255,.12);border-color:rgba(52,211,224,.4);transform:translateY(-6px);}
.stat:nth-child(even):hover{transform:translateY(10px);}
.stat--accent{background:linear-gradient(150deg,rgba(52,211,224,.22),rgba(47,128,255,.14));}
.stat__ico{
  display:grid;place-items:center;width:38px;height:38px;border-radius:12px;
  background:rgba(52,211,224,.16);color:var(--cyan-400);margin-bottom:1rem;
}
.stat__num{
  font-size:clamp(1.9rem,3.4vw,2.7rem);font-weight:800;letter-spacing:-.05em;
  line-height:1;color:#fff;font-variant-numeric:tabular-nums;
}
.stat__label{font-size:.85rem;color:rgba(226,238,255,.68);margin-top:.45rem;}
.stat__bar{display:block;height:4px;border-radius:99px;background:rgba(255,255,255,.12);margin-top:1.1rem;overflow:hidden;}
.stat__bar i{
  display:block;height:100%;width:0;border-radius:99px;
  background:linear-gradient(90deg,var(--blue-400),var(--cyan-400));
  transition:width 1.6s var(--ease-out) .25s;
}
.stat.is-visible .stat__bar i{width:var(--w);}

/* ---------- 08. ABOUT ---------- */
.about{background:var(--white);}
.about__inner{
  display:grid;grid-template-columns:.95fr 1.05fr;
  gap:clamp(2.5rem,6vw,5.5rem);align-items:center;
}
.about__media{position:relative;padding-bottom:3.5rem;padding-left:1rem;}
.about__img{border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--sh-lg);}
.about__img img{transition:transform 1.1s var(--ease-out);}
.about__img:hover img{transform:scale(1.06);}
.about__img--main{aspect-ratio:4/5;}
.about__img--main img{width:100%;height:100%;object-fit:cover;}
.about__img--sub{
  position:absolute;right:-8%;bottom:0;width:58%;aspect-ratio:4/3.2;
  border:6px solid #fff;box-shadow:var(--sh-xl);
}
.about__img--sub img{width:100%;height:100%;object-fit:cover;}
.about__chip{
  position:absolute;top:8%;left:-8%;z-index:3;
  display:flex;align-items:center;gap:.7rem;
  background:rgba(255,255,255,.9);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.8);
  border-radius:var(--r-md);padding:.75rem .95rem;
  box-shadow:var(--sh-lg);
}
.about__chip strong{display:block;font-size:.86rem;color:var(--navy-800);line-height:1.3;}
.about__chip small{font-size:.68rem;color:var(--muted);}
.about__dots{
  position:absolute;left:-2.5rem;bottom:2rem;width:120px;height:120px;z-index:-1;
  background-image:radial-gradient(rgba(47,128,255,.3) 1.6px,transparent 1.6px);
  background-size:15px 15px;border-radius:8px;
}

.about__list{display:grid;gap:1.35rem;margin-top:2.2rem;margin-bottom:2.4rem;}
.about__list li{display:flex;gap:1rem;align-items:flex-start;}
.about__list h3{font-size:1.02rem;letter-spacing:-.02em;color:var(--navy-800);}
.about__list p{font-size:.92rem;color:var(--muted);margin-top:.22rem;max-width:46ch;}

/* ---------- 09. SERVICES ---------- */
.services{
  background:
    radial-gradient(800px 400px at 90% 0%,rgba(52,211,224,.10),transparent 60%),
    var(--paper);
}
.svc-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  grid-auto-rows:minmax(0,auto);
  gap:clamp(1rem,1.8vw,1.5rem);
}
.svc{
  position:relative;isolation:isolate;overflow:hidden;
  background:#fff;border:1px solid var(--line);
  border-radius:var(--r-xl);
  padding:clamp(1.6rem,2.3vw,2.1rem);
  box-shadow:var(--sh-xs);
  transition:transform .45s var(--ease-out),box-shadow .45s var(--ease),
             border-color .45s var(--ease);
  cursor:pointer;
  min-height:250px;
  display:flex;flex-direction:column;
}
/* asymmetric grid: tall feature card + full-width emergency banner */
.svc--tall{grid-row:span 2;justify-content:flex-start;}
.svc--banner{grid-column:span 3;min-height:0;}
.svc__glow{
  position:absolute;inset:0;z-index:-1;opacity:0;
  background:linear-gradient(150deg,rgba(47,128,255,.07),rgba(52,211,224,.13));
  transition:opacity .45s var(--ease);
}
.svc:hover{transform:translateY(-9px);box-shadow:var(--sh-lg);border-color:rgba(52,211,224,.45);}
.svc:hover .svc__glow{opacity:1;}

.svc__ico{
  display:grid;place-items:center;width:58px;height:58px;
  border-radius:18px;margin-bottom:1.4rem;
  background:var(--blue-100);color:var(--blue-600);
  transition:transform .5s var(--ease-out),background-color .45s var(--ease),color .45s var(--ease);
}
.svc:hover .svc__ico{
  transform:translateY(-4px) scale(1.07);
  background:var(--grad-brand);color:#fff;
  box-shadow:0 12px 28px rgba(47,128,255,.3);
}
.svc h3{font-size:1.28rem;letter-spacing:-.03em;color:var(--navy-800);}
.svc p{font-size:.93rem;color:var(--muted);margin-top:.55rem;max-width:44ch;flex:1;}
.svc__link{
  display:inline-flex;align-items:center;gap:.45rem;margin-top:1.4rem;
  font-size:.87rem;font-weight:650;color:var(--blue-600);
  transition:gap .35s var(--ease-out);
}
.svc__link svg{transition:transform .35s var(--ease-out);}
.svc:hover .svc__link{gap:.75rem;}
.svc:hover .svc__link svg{transform:translateX(3px);}

.svc--tall h3{font-size:1.55rem;}
.svc--tall p{margin-bottom:0;flex:0 1 auto;}
.svc--tall .svc__link{margin-top:auto;padding-top:1.2rem;}

.svc__tag{
  display:inline-block;align-self:flex-start;
  font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--cyan-500);background:var(--cyan-100);
  padding:.3rem .7rem;border-radius:var(--r-pill);margin-bottom:.85rem;
}
.svc__points{display:grid;gap:.55rem;margin-top:1.3rem;}
.svc__points li{
  position:relative;padding-left:1.5rem;
  font-size:.88rem;color:var(--muted);line-height:1.5;
}
.svc__points li::before{
  content:"";position:absolute;left:0;top:.5em;
  width:8px;height:8px;border-radius:50%;
  background:var(--grad-brand);opacity:.85;
}
.svc__mini{
  display:grid;grid-template-columns:1fr 1fr;gap:.8rem;
  margin-top:1.6rem;padding-top:1.3rem;border-top:1px solid var(--line);
}
.svc__mini strong{
  display:block;font-size:1.35rem;letter-spacing:-.04em;color:var(--navy-800);line-height:1.1;
}
.svc__mini small{font-size:.72rem;color:var(--muted);}

/* emergency banner layout */
.svc--banner{
  flex-direction:row;align-items:center;gap:clamp(1.2rem,3vw,2.4rem);
  padding-block:clamp(1.5rem,2.4vw,2rem);
}
.svc--banner .svc__ico{margin-bottom:0;}
.svc__banner-copy{flex:1;}
.svc--banner p{margin-top:.4rem;max-width:62ch;flex:0 1 auto;}
.svc--banner .svc__link{margin-top:0;white-space:nowrap;}
.svc--dark{
  background:var(--grad-deep);border-color:transparent;color:#fff;
  box-shadow:0 20px 46px rgba(11,37,69,.22);
}
.svc--dark h3{color:#fff;}
.svc--dark p{color:rgba(226,238,255,.66);}
.svc--dark .svc__ico{background:rgba(52,211,224,.18);color:var(--cyan-400);}
.svc--dark:hover .svc__ico{background:var(--cyan-400);color:var(--navy-800);}
.svc--dark .svc__link{color:var(--cyan-400);}
.svc--dark .svc__glow{background:linear-gradient(150deg,rgba(52,211,224,.2),transparent);}
.svc--dark:hover{border-color:rgba(52,211,224,.5);}

/* ---------- 10. SPECIALISTS ---------- */
.docs{background:#fff;}
.docs__grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1rem,1.8vw,1.5rem);
}
.doc{
  border-radius:var(--r-xl);overflow:hidden;background:#fff;
  border:1px solid var(--line);
  box-shadow:var(--sh-xs);
  transition:transform .45s var(--ease-out),box-shadow .45s var(--ease);
}
.doc:hover{transform:translateY(-10px);box-shadow:var(--sh-xl);}
.doc__media{
  position:relative;aspect-ratio:4/4.6;overflow:hidden;
  background:linear-gradient(180deg,#e6f0ff,#f5f9ff);
}
.doc__media img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease-out);}
.doc:hover .doc__media img{transform:scale(1.08);}
.doc__media::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 40%,rgba(6,26,51,.72));
  opacity:0;transition:opacity .45s var(--ease);
}
.doc:hover .doc__media::after{opacity:1;}

.doc__status{
  position:absolute;top:.9rem;left:.9rem;z-index:3;
  display:inline-flex;align-items:center;gap:.4rem;
  padding:.35rem .7rem;border-radius:var(--r-pill);
  background:rgba(255,255,255,.88);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  font-size:.7rem;font-weight:650;color:var(--navy-800);
  box-shadow:var(--sh-xs);
}
.doc__status i{width:7px;height:7px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 3px rgba(34,197,94,.18);}
.doc__status--soon i{background:#f59e0b;box-shadow:0 0 0 3px rgba(245,158,11,.18);}

.doc__hover{
  position:absolute;left:0;right:0;bottom:0;z-index:3;
  padding:1.2rem;
  opacity:0;transform:translateY(14px);
  transition:opacity .45s var(--ease),transform .5s var(--ease-out);
}
.doc:hover .doc__hover{opacity:1;transform:translateY(0);}
.doc__hover p{color:#fff;font-size:.86rem;line-height:1.5;font-style:italic;}
.doc__socials{display:flex;gap:.4rem;margin-top:.8rem;}
.doc__socials span{
  display:grid;place-items:center;width:28px;height:28px;border-radius:9px;
  background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.25);
  color:#fff;font-size:.68rem;font-weight:700;
  transition:background-color .3s var(--ease);
}
.doc__socials span:hover{background:rgba(255,255,255,.32);}

.doc__body{padding:1.15rem 1.25rem 1.4rem;}
.doc__body h3{font-size:1.06rem;letter-spacing:-.025em;color:var(--navy-800);}
.doc__spec{font-size:.85rem;color:var(--blue-600);font-weight:600;margin-top:.15rem;}
.doc__meta{
  display:flex;align-items:center;justify-content:space-between;gap:.5rem;
  margin-top:.85rem;padding-top:.8rem;border-top:1px solid var(--line);
  font-size:.78rem;color:var(--muted);
}
.doc__rate{color:#ffb020;font-weight:700;}

/* ---------- 11. TECHNOLOGY ---------- */
.tech{
  position:relative;overflow:hidden;
  background:var(--navy-900);
  color:#fff;
}
.tech__bg{position:absolute;inset:0;pointer-events:none;}
.tech__orb{position:absolute;border-radius:50%;filter:blur(90px);}
.tech__orb--1{width:560px;height:560px;top:-180px;left:-120px;background:rgba(47,128,255,.24);}
.tech__orb--2{width:520px;height:520px;bottom:-200px;right:-100px;background:rgba(52,211,224,.20);}
.tech__grid{
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:70px 70px;
  mask-image:radial-gradient(circle at 30% 50%,#000,transparent 78%);
  -webkit-mask-image:radial-gradient(circle at 30% 50%,#000,transparent 78%);
}
.tech__lines{position:absolute;inset:0;width:100%;height:100%;opacity:.85;}
.tech__lines path{
  stroke-dasharray:1400;stroke-dashoffset:1400;
  animation:flowLine 9s var(--ease) infinite;
}
.tech__lines path:nth-child(2){animation-delay:2.2s;}
@keyframes flowLine{
  0%{stroke-dashoffset:1400;}
  50%{stroke-dashoffset:0;}
  100%{stroke-dashoffset:-1400;}
}

.tech__inner{
  position:relative;z-index:2;
  display:grid;grid-template-columns:1.05fr .95fr;
  gap:clamp(2.5rem,5vw,4.5rem);align-items:center;
}
.tech__cards{
  display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-top:2.4rem;
}
.tcard{
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.1);
  border-radius:var(--r-lg);padding:1.35rem;
  transition:transform var(--t) var(--ease-out),background-color var(--t) var(--ease),
             border-color var(--t) var(--ease);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
}
.tcard:hover{
  transform:translateY(-6px);
  background:rgba(255,255,255,.09);
  border-color:rgba(52,211,224,.42);
}
.tcard__ico{
  display:grid;place-items:center;width:40px;height:40px;border-radius:13px;
  background:linear-gradient(140deg,rgba(52,211,224,.25),rgba(47,128,255,.18));
  color:var(--cyan-400);margin-bottom:.95rem;
  transition:box-shadow var(--t) var(--ease);
}
.tcard:hover .tcard__ico{box-shadow:0 0 0 1px rgba(52,211,224,.4),0 8px 24px rgba(52,211,224,.25);}
.tcard h3{font-size:1rem;letter-spacing:-.02em;color:#fff;}
.tcard p{font-size:.86rem;color:rgba(226,238,255,.6);margin-top:.35rem;}

.tech__visual{position:relative;}
.tech__frame{
  position:relative;border-radius:var(--r-xl);overflow:hidden;
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 40px 90px rgba(0,0,0,.5);
  aspect-ratio:4/3;
}
.tech__frame img{width:100%;height:100%;object-fit:cover;}
.tech__scan{
  position:absolute;left:0;right:0;height:34%;
  background:linear-gradient(180deg,transparent,rgba(52,211,224,.16),transparent);
  animation:scanY 5.5s var(--ease) infinite;
}
@keyframes scanY{
  0%,100%{transform:translateY(-40%);opacity:0;}
  20%{opacity:1;}
  80%{opacity:1;}
  100%{transform:translateY(300%);}
}

.tech__hud{
  position:absolute;left:-6%;bottom:8%;width:214px;
  background:rgba(9,28,52,.82);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border:1px solid rgba(52,211,224,.28);
  border-radius:var(--r-md);padding:.95rem 1.05rem;
  box-shadow:0 24px 50px rgba(0,0,0,.45);
}
.hud__row{display:flex;justify-content:space-between;align-items:center;gap:.6rem;font-size:.76rem;color:rgba(226,238,255,.6);}
.hud__row strong{color:var(--cyan-400);font-size:.8rem;}
.hud__row--sm{margin-top:.6rem;}
.hud__meter{height:5px;border-radius:99px;background:rgba(255,255,255,.1);margin-top:.65rem;overflow:hidden;}
.hud__meter i{
  display:block;height:100%;border-radius:99px;
  background:linear-gradient(90deg,var(--blue-500),var(--cyan-400));
  animation:barFill 4.6s var(--ease) infinite;
}
.tech__pill{
  position:absolute;top:6%;right:-4%;
  display:inline-flex;align-items:center;gap:.5rem;
  padding:.55rem 1rem;border-radius:var(--r-pill);
  background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.2);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  font-size:.78rem;font-weight:600;color:#fff;
}

/* ---------- 12. PATIENT JOURNEY ---------- */
.journey{background:var(--paper);}
.journey__layout{
  display:grid;grid-template-columns:.95fr 1.05fr;
  gap:clamp(2rem,5vw,4.5rem);align-items:start;
}
.journey__sticky{position:sticky;top:calc(var(--nav-h) + 3rem);}
.jvisual{
  border-radius:var(--r-xl);overflow:hidden;background:#fff;
  box-shadow:var(--sh-lg);border:1px solid var(--line);
}
.jvisual__imgwrap{aspect-ratio:16/11;overflow:hidden;position:relative;}
.jvisual__imgwrap img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease-out);}
.jvisual__imgwrap::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 55%,rgba(11,37,69,.25));
}
.jvisual__panel{padding:1.5rem 1.6rem 1.7rem;}
.jvisual__step{
  font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);
}
.jvisual__step b{color:var(--blue-600);font-size:.85rem;}
.jvisual__panel h3{font-size:1.42rem;letter-spacing:-.03em;color:var(--navy-800);margin-top:.6rem;}
.jvisual__panel p{font-size:.94rem;color:var(--muted);margin-top:.5rem;min-height:3.2em;}
.jvisual__progress{height:5px;border-radius:99px;background:var(--blue-100);margin-top:1.2rem;overflow:hidden;}
.jvisual__progress i{
  display:block;height:100%;width:25%;border-radius:99px;background:var(--grad-brand);
  transition:width .55s var(--ease-out);
}
.jvisual.is-swapping .jvisual__imgwrap img{transform:scale(1.05);}

.journey__steps{position:relative;padding-left:3.6rem;}
.journey__steps::before{
  content:"";position:absolute;left:17px;top:14px;bottom:14px;width:2px;
  background:var(--line-strong);border-radius:2px;
}
.journey__steps::after{
  content:"";position:absolute;left:17px;top:14px;width:2px;height:0;
  background:linear-gradient(180deg,var(--blue-500),var(--cyan-400));
  border-radius:2px;box-shadow:0 0 12px rgba(52,211,224,.55);
  height:var(--fill,0%);
  max-height:calc(100% - 28px);
  transition:height .18s linear;
}
.jstep{position:relative;padding-bottom:clamp(1.5rem,3vw,2.4rem);}
.jstep:last-child{padding-bottom:0;}
.jstep__node{
  position:absolute;left:-3.6rem;top:10px;
  display:grid;place-items:center;width:36px;height:36px;border-radius:50%;
  background:#fff;border:2px solid var(--line-strong);
  font-size:.72rem;font-weight:800;color:var(--muted);
  z-index:2;
  transition:border-color .45s var(--ease),color .45s var(--ease),
             transform .45s var(--ease-out),box-shadow .45s var(--ease),
             background-color .45s var(--ease);
}
.jstep.is-active .jstep__node{
  background:var(--grad-brand);border-color:transparent;color:#fff;
  transform:scale(1.12);
  box-shadow:0 10px 24px rgba(47,128,255,.35);
}
.jstep__card{
  background:#fff;border:1px solid var(--line);
  border-radius:var(--r-lg);padding:1.5rem 1.6rem;
  box-shadow:var(--sh-xs);
  opacity:.55;
  transition:opacity .45s var(--ease),transform .5s var(--ease-out),
             box-shadow .45s var(--ease),border-color .45s var(--ease);
}
.jstep.is-active .jstep__card{
  opacity:1;transform:translateX(6px);
  box-shadow:var(--sh-md);border-color:rgba(52,211,224,.4);
}
.jstep__card h3{font-size:1.2rem;letter-spacing:-.028em;color:var(--navy-800);}
.jstep__card p{font-size:.93rem;color:var(--muted);margin-top:.5rem;}
.jstep__tags{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:1rem;}
.jstep__tags li{
  font-size:.74rem;font-weight:600;color:var(--blue-600);
  background:var(--blue-50);border:1px solid var(--blue-100);
  padding:.3rem .7rem;border-radius:var(--r-pill);
}

/* ---------- 13. TESTIMONIALS ---------- */
.tst{background:#fff;overflow:hidden;}
.tst__nav{display:flex;gap:.6rem;justify-content:flex-end;padding-bottom:.4rem;}
.tst__btn{
  display:grid;place-items:center;width:48px;height:48px;border-radius:50%;
  border:1px solid var(--line-strong);background:#fff;color:var(--navy-800);
  transition:background-color var(--t) var(--ease),color var(--t) var(--ease),
             transform var(--t) var(--ease-out),box-shadow var(--t) var(--ease),
             border-color var(--t) var(--ease);
}
.tst__btn:hover{
  background:var(--grad-brand);color:#fff;border-color:transparent;
  transform:translateY(-3px);box-shadow:var(--sh-brand);
}

.tst__viewport{overflow:hidden;border-radius:var(--r-xl);}
.tst__track{
  display:flex;
  transition:transform .75s var(--ease-out);
  will-change:transform;
}
.tcard-q{
  flex:0 0 100%;
  position:relative;
  background:
    radial-gradient(700px 300px at 90% -10%,rgba(52,211,224,.12),transparent 60%),
    var(--grad-soft);
  border:1px solid var(--line);
  border-radius:var(--r-xl);
  padding:clamp(2rem,4vw,3.2rem);
  overflow:hidden;
}
.quote{
  position:absolute;top:-1.5rem;right:2rem;
  font-size:11rem;line-height:1;font-weight:800;
  color:rgba(47,128,255,.09);pointer-events:none;
}
.tcard-q p{
  font-size:clamp(1.08rem,1.9vw,1.55rem);
  line-height:1.55;letter-spacing:-.025em;color:var(--navy-800);
  margin-top:1rem;max-width:62ch;font-weight:450;
}
.tcard-q footer{display:flex;align-items:center;gap:.95rem;margin-top:2rem;}
.tcard-q footer img{width:56px;height:56px;border-radius:50%;object-fit:cover;border:3px solid #fff;box-shadow:var(--sh-sm);}
.tcard-q footer strong{display:block;font-size:1rem;color:var(--navy-800);letter-spacing:-.02em;}
.tcard-q footer small{font-size:.8rem;color:var(--muted);}

.tst__dots{display:flex;justify-content:center;gap:.55rem;margin-top:1.8rem;}
.tst__dots button{
  width:9px;height:9px;border-radius:50%;background:var(--line-strong);
  transition:width var(--t) var(--ease-out),background-color var(--t) var(--ease);
}
.tst__dots button.is-active{width:30px;border-radius:99px;background:var(--grad-brand);}

/* ---------- 14. CTA ---------- */
.cta{background:#fff;padding-bottom:clamp(4rem,8vw,7rem);}
.cta__panel{
  position:relative;overflow:hidden;
  border-radius:var(--r-2xl);
  background:var(--grad-deep);
  padding:clamp(3rem,6.5vw,5.5rem) clamp(1.5rem,5vw,4rem);
  text-align:center;color:#fff;
  box-shadow:var(--sh-xl);
  isolation:isolate;
}
.cta__bg{position:absolute;inset:0;z-index:-1;pointer-events:none;}
.cta__shape{position:absolute;border-radius:50%;filter:blur(10px);}
.cta__shape--1{
  width:280px;height:280px;top:-90px;left:-60px;
  background:radial-gradient(circle,rgba(52,211,224,.35),transparent 68%);
}
.cta__shape--2{
  width:340px;height:340px;bottom:-140px;right:-70px;
  background:radial-gradient(circle,rgba(47,128,255,.4),transparent 68%);
}
.cta__shape--3{
  width:170px;height:170px;top:22%;right:16%;
  background:radial-gradient(circle,rgba(255,255,255,.14),transparent 66%);
}
.cta__pulse{
  position:absolute;left:0;right:0;bottom:8%;width:100%;height:120px;opacity:.4;
}
.cta__pulse path{
  stroke-dasharray:1200;stroke-dashoffset:1200;
  animation:flowLine 8s var(--ease) infinite;
}
.cta__content{position:relative;z-index:2;display:grid;justify-items:center;}
.cta__title{
  font-size:clamp(2rem,4.4vw,3.5rem);letter-spacing:-.04em;
  margin-top:1.2rem;max-width:18ch;
}
.cta__content > p{
  color:rgba(226,238,255,.7);margin-top:1.1rem;max-width:56ch;font-size:1.03rem;
}
.cta__actions{display:flex;flex-wrap:wrap;gap:.9rem;justify-content:center;margin-top:2.2rem;}

/* ---------- 15. FOOTER ---------- */
.footer{
  background:var(--navy-900);color:rgba(226,238,255,.62);
  padding-top:clamp(3.5rem,6vw,5.5rem);
  position:relative;overflow:hidden;
}
.footer::before{
  content:"";position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(52,211,224,.5),transparent);
}
.footer__top{
  display:grid;grid-template-columns:1.6fr .8fr .8fr .8fr 1.1fr;
  gap:clamp(1.6rem,3vw,2.6rem);
  padding-bottom:clamp(2.5rem,4vw,3.5rem);
}
.logo--footer .logo__text{color:#fff;}
.footer__tag{
  color:var(--cyan-400);font-weight:600;font-size:.92rem;margin-top:1rem;letter-spacing:-.01em;
}
.footer__desc{font-size:.9rem;margin-top:.7rem;max-width:40ch;line-height:1.7;}
.socials{display:flex;gap:.55rem;margin-top:1.5rem;}
.socials a{
  display:grid;place-items:center;width:40px;height:40px;border-radius:12px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);
  color:rgba(226,238,255,.75);
  transition:background-color var(--t) var(--ease),color var(--t) var(--ease),
             transform var(--t) var(--ease-out),border-color var(--t) var(--ease);
}
.socials a:hover{
  background:var(--grad-brand);color:#fff;border-color:transparent;
  transform:translateY(-4px);box-shadow:0 10px 24px rgba(47,128,255,.32);
}

.footer__col h3{
  font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:#fff;
  margin-bottom:1.15rem;font-weight:700;
}
.footer__col ul{display:grid;gap:.65rem;}
.footer__col a{
  font-size:.9rem;
  transition:color var(--t) var(--ease),padding-left var(--t) var(--ease-out);
}
.footer__col a:hover{color:var(--cyan-400);padding-left:5px;}

.footer__contact li{display:flex;gap:.7rem;align-items:flex-start;font-size:.9rem;}
.footer__contact .ico{
  width:30px;height:30px;border-radius:9px;
  background:rgba(52,211,224,.13);color:var(--cyan-400);
}
.footer__contact address{line-height:1.6;}
.footer__cta{margin-top:1.4rem;}

.footer__bottom{
  display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center;
  padding-block:1.6rem;
  border-top:1px solid rgba(255,255,255,.08);
  font-size:.85rem;
}
.footer__legal{display:flex;gap:.75rem;align-items:center;}
.footer__legal a:hover{color:var(--cyan-400);}
.footer__legal span{opacity:.4;}

/* ---------- 16. REVEAL ANIMATIONS ---------- */
[data-reveal]{
  opacity:0;
  transform:translateY(34px);
  transition:opacity .85s var(--ease-out),transform .95s var(--ease-out);
  transition-delay:var(--delay,0ms);
  will-change:opacity,transform;
}
[data-reveal].is-visible{opacity:1;transform:none;}

[data-reveal="left"]{transform:translateX(-40px);}
[data-reveal="right"]{transform:translateX(40px);}
[data-reveal="scale"]{transform:scale(.94);}

.parallax{will-change:transform;}

/* reduced motion */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  [data-reveal]{opacity:1 !important;transform:none !important;}
  .hero__title .line > span{transform:none !important;}
  .cursor,.cursor-ring{display:none;}
  /* the mobile panel still needs to open/close instantly, not linger */
  .nav__links,.nav__links.is-open,
  .nav-backdrop,.nav-backdrop.is-visible{transition-delay:0s !important;}
}

/* ---------- 17. RESPONSIVE ---------- */
@media (max-width:1180px){
  .hero__stage{max-width:490px;}
  .fcard--stats{left:-2%;width:172px;}
  .fcard--appt{right:-2%;width:198px;}
  .fcard--exp{right:2%;}
  .fcard--badge{right:-2%;}
  .footer__top{grid-template-columns:1.4fr 1fr 1fr;row-gap:2.6rem;}
  .footer__col--contact{grid-column:span 3;}
  .footer__contact{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem;}
}

@media (max-width:1024px){
  :root{--nav-h:74px;}

  /* ---- mobile navigation drawer (slides in from the LEFT) ---- */
  .nav__links{
    position:fixed;top:0;left:0;bottom:0;
    z-index:1200;                        /* above the navbar and all page content */
    width:min(400px,86vw);
    height:100vh;height:100dvh;
    flex-direction:column;align-items:stretch;justify-content:flex-start;
    gap:0;
    padding:clamp(1.1rem,4vw,1.5rem) clamp(1.4rem,5vw,1.9rem) 2.25rem;
    background:rgba(255,255,255,.97);
    backdrop-filter:blur(26px) saturate(170%);
    -webkit-backdrop-filter:blur(26px) saturate(170%);
    box-shadow:30px 0 80px rgba(11,37,69,.18);
    transform:translate3d(-100%,0,0);    /* fully off-screen to the left */
    transition:transform .58s var(--ease-out),visibility 0s linear .58s;
    visibility:hidden;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
  }
  .nav__links.is-open{
    transform:translate3d(0,0,0);
    visibility:visible;
    transition:transform .58s var(--ease-out),visibility 0s linear 0s;
  }
  /* soft brand glow anchored to the drawer's top corner */
  .nav__links::before{
    content:"";position:absolute;top:-90px;left:-70px;
    width:250px;height:250px;border-radius:50%;
    background:radial-gradient(circle,rgba(52,211,224,.20),transparent 70%);
    pointer-events:none;
  }

  /* drawer header: brand + close button */
  .nav__drawer-head{
    display:flex !important;
    align-items:center;
    /* match the navbar height so the drawer logo lines up with the burger */
    min-height:var(--nav-h);
    padding-bottom:1.1rem;margin-bottom:.5rem;
    border-bottom:1px solid var(--line);
    opacity:0;transform:translateX(-18px);
    transition:opacity .45s var(--ease),transform .55s var(--ease-out);
  }
  .nav__links.is-open .nav__drawer-head{
    opacity:1;transform:none;transition-delay:.1s;
  }
  .logo--drawer{font-size:1.18rem;}

  .nav__link{
    position:relative;
    display:flex;align-items:center;
    min-height:58px;                    /* generous tap target */
    padding:.55rem .35rem;
    font-size:1.12rem;font-weight:600;letter-spacing:-.022em;
    border-bottom:1px solid var(--line);border-radius:0;
    opacity:0;transform:translateX(-24px);
    transition:opacity .45s var(--ease),transform .55s var(--ease-out),
               color var(--t) var(--ease),padding-left var(--t) var(--ease-out);
  }
  .nav__links.is-open .nav__link{opacity:1;transform:none;}
  /* staggered entrance, offset after the drawer header */
  .nav__links.is-open .nav__link:nth-of-type(1){transition-delay:.16s;}
  .nav__links.is-open .nav__link:nth-of-type(2){transition-delay:.22s;}
  .nav__links.is-open .nav__link:nth-of-type(3){transition-delay:.28s;}
  .nav__links.is-open .nav__link:nth-of-type(4){transition-delay:.34s;}
  .nav__links.is-open .nav__link:nth-of-type(5){transition-delay:.40s;}
  .nav__links.is-open .nav__link:nth-of-type(6){transition-delay:.46s;}
  .nav__link::after{display:none;}

  /* gradient bar marks the active section */
  .nav__link::before{
    content:"";position:absolute;left:-.35rem;top:50%;translate:0 -50%;
    width:3px;height:0;border-radius:3px;background:var(--grad-brand);
    transition:height .35s var(--ease-out);
  }
  .nav__link.is-active::before{height:24px;}
  .nav__link.is-active,.nav__link:hover{padding-left:.95rem;}

  .nav__cta-mobile{
    display:inline-flex;width:100%;margin-top:auto;
    border-bottom:0;min-height:56px;
    opacity:0;transform:translateX(-24px);
    transition:opacity .45s var(--ease),transform .55s var(--ease-out),
               box-shadow var(--t) var(--ease);
  }
  .nav__links.is-open .nav__cta-mobile{
    opacity:1;transform:none;transition-delay:.52s;
  }

  .nav__cta{display:none;}
  .nav__right{position:relative;z-index:2;}
  .burger{display:grid;}

  /* While the drawer is open the navbar floats above the overlay so the
     hamburger stays visible and tappable, but its own bar styling is
     neutralised so it doesn't paint a strip over the dim layer.
     The logo sits behind the drawer, so only the button shows through. */
  body.menu-open .nav{
    z-index:1250;
    background:transparent;
    box-shadow:none;
    border-bottom-color:transparent;
    backdrop-filter:none;-webkit-backdrop-filter:none;
  }
  /* only the navbar's own logo hides (the drawer has its own) */
  body.menu-open .nav__inner > .logo{opacity:0;transition:opacity .3s var(--ease);}

  /* lock background scroll without a layout shift (scrollbar width compensated in JS) */
  body.menu-open{
    overflow:hidden;
    padding-right:var(--sbw,0px);
    touch-action:none;
  }
  body.menu-open .nav{padding-right:var(--sbw,0px);}

  .hero{min-height:auto;}
  .hero__inner{grid-template-columns:1fr;gap:3.5rem;}
  .hero__copy{max-width:640px;}
  .hero__stage{max-width:460px;}
  .scroll-hint{display:none;}

  .stats__panel{grid-template-columns:1fr;}
  .about__inner{grid-template-columns:1fr;gap:4rem;}
  .about__media{max-width:560px;margin-inline:auto;width:100%;}
  .svc-grid{grid-template-columns:repeat(2,1fr);}
  /* the feature card becomes a full-width panel on tablet */
  .svc--tall{grid-row:span 1;grid-column:span 2;}
  .svc--tall .svc__points{grid-template-columns:repeat(2,1fr);column-gap:1.5rem;}
  .svc--tall .svc__mini{grid-template-columns:repeat(4,auto);justify-content:start;column-gap:2.5rem;}
  .svc--banner{grid-column:span 2;}
  .docs__grid{grid-template-columns:repeat(2,1fr);}
  .tech__inner{grid-template-columns:1fr;gap:3rem;}
  .journey__layout{grid-template-columns:1fr;gap:2.5rem;}
  .journey__sticky{position:static;}
  .jvisual{max-width:620px;}
  .sec-head{grid-template-columns:1fr;align-items:start;}
  .sec-head__note{padding-bottom:0;}
  .tst__nav{justify-content:flex-start;}
}

@media (max-width:720px){
  body{font-size:15.8px;}
  .section{padding-block:clamp(3.4rem,10vw,4.6rem);}

  .hero__stage{max-width:380px;}
  .fcard{padding:.7rem .8rem;border-radius:14px;}
  .fcard--stats{width:150px;top:4%;left:-3%;}
  .fcard__value{font-size:1.2rem;}
  .spark{height:24px;}
  .fcard--appt{width:172px;right:-4%;bottom:14%;}
  .fcard__name{font-size:.86rem;}
  .fcard--exp{width:124px;}
  .fcard__exp-num{font-size:1.5rem;}
  .fcard--badge{padding:.65rem .85rem;}
  .fcard--badge strong{font-size:.95rem;}
  .fcard--avail{left:0;bottom:0;}
  .fcard--avail p{font-size:.72rem;}

  .hero__trust{flex-wrap:wrap;}
  .stats__grid{grid-template-columns:1fr;}
  .stat:nth-child(even){transform:none;}
  .stat:nth-child(even):hover{transform:translateY(-6px);}
  .stats__panel{border-radius:var(--r-xl);}

  .about__img--sub{position:relative;right:auto;bottom:auto;width:100%;margin-top:1rem;}
  .about__media{padding-bottom:0;padding-left:0;}
  .about__chip{left:auto;right:.8rem;top:.8rem;}
  .about__dots{display:none;}

  .svc-grid{grid-template-columns:1fr;}
  .svc--tall{grid-row:span 1;grid-column:span 1;}
  .svc--tall .svc__points{grid-template-columns:1fr;}
  .svc--tall .svc__mini{grid-template-columns:1fr 1fr;column-gap:.8rem;}
  .svc--banner{grid-column:span 1;flex-direction:column;align-items:flex-start;gap:0;}
  .svc--banner .svc__ico{margin-bottom:1.4rem;}
  .svc--banner .svc__link{margin-top:1.4rem;}
  .svc{min-height:auto;}
  .docs__grid{grid-template-columns:1fr;}
  .doc__media{aspect-ratio:4/3.4;}
  .doc__hover{opacity:1;transform:none;}
  .doc__media::after{opacity:1;}

  .tech__cards{grid-template-columns:1fr;}
  .tech__hud{left:auto;right:4%;bottom:-6%;width:186px;}
  .tech__pill{top:-4%;right:auto;left:2%;}

  .journey__steps{padding-left:2.9rem;}
  .journey__steps::before,.journey__steps::after{left:13px;}
  .jstep__node{left:-2.9rem;width:28px;height:28px;font-size:.66rem;}
  .jstep__card{padding:1.2rem 1.25rem;}

  .quote{font-size:7rem;right:1rem;}
  .tcard-q footer{flex-wrap:wrap;}

  .cta__panel{border-radius:var(--r-xl);}
  .cta__actions .btn{width:100%;}

  .footer__top{grid-template-columns:1fr 1fr;}
  .footer__brand{grid-column:span 2;}
  .footer__col--contact{grid-column:span 2;}
  .footer__bottom{flex-direction:column;text-align:center;gap:.7rem;}
}

@media (max-width:420px){
  .hero__stage{max-width:330px;}
  .fcard--stats{width:132px;}
  .fcard--appt{width:150px;}
  .fcard--exp{width:106px;}
  .footer__top{grid-template-columns:1fr;}
  .footer__brand,.footer__col--contact{grid-column:span 1;}
}