/* =============================================================================
   EFFECTS LAYER (js/effects.js)
   ============================================================================= */
html.lenis,html.lenis body{height:auto}
html.lenis,html.lenis *{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}

/* ---- hero aurora: three soft light blobs drifting behind the copy ---- */
.fx-aurora{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.fx-aurora i{position:absolute;border-radius:50%;opacity:.55;will-change:transform}
.fx-aurora i:nth-child(1){width:52vw;height:52vw;left:-12vw;top:-18vw;background:radial-gradient(circle,rgba(21,84,184,.22) 0%,rgba(21,84,184,0) 62%);animation:fxDrift1 18s ease-in-out infinite alternate}
.fx-aurora i:nth-child(2){width:46vw;height:46vw;right:-10vw;top:10%;background:radial-gradient(circle,rgba(56,189,248,.26) 0%,rgba(56,189,248,0) 62%);animation:fxDrift2 22s ease-in-out infinite alternate}
.fx-aurora i:nth-child(3){width:40vw;height:40vw;left:30%;bottom:-22vw;background:radial-gradient(circle,rgba(14,154,167,.18) 0%,rgba(14,154,167,0) 62%);animation:fxDrift3 20s ease-in-out infinite alternate}
@keyframes fxDrift1{to{transform:translate3d(14vw,10vw,0) scale(1.15)}}
@keyframes fxDrift2{to{transform:translate3d(-16vw,8vw,0) scale(.9)}}
@keyframes fxDrift3{to{transform:translate3d(10vw,-12vw,0) scale(1.2)}}
@media (max-width:768px){.fx-aurora i{opacity:.7}.fx-aurora i:nth-child(1){width:110vw;height:110vw}.fx-aurora i:nth-child(2){width:100vw;height:100vw}.fx-aurora i:nth-child(3){width:90vw;height:90vw}}
.fx-spot{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;transition:opacity .5s;background:radial-gradient(420px circle at var(--x,50%) var(--y,50%),rgba(255,255,255,.55),rgba(255,255,255,0) 70%)}
.fx-spot.on{opacity:1}
.hero-content-center,.hero-trust-strip{position:relative;z-index:2}

/* ---- custom cursor ---- */
.fx-cursor-dot,.fx-cursor-ring{position:fixed;left:0;top:0;z-index:10000;pointer-events:none;opacity:0;transition:opacity .3s}
html.fx-cursor .fx-cursor-dot,html.fx-cursor .fx-cursor-ring{opacity:1}
.fx-cursor-dot{width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;background:#1554B8}
.fx-cursor-ring{width:38px;height:38px;margin:-19px 0 0 -19px}
.fx-cursor-ring span{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;border:1.5px solid rgba(21,84,184,.45);font:600 11px/1 var(--f-body);letter-spacing:.06em;color:#fff;text-transform:uppercase;transition:transform .35s cubic-bezier(.2,.8,.2,1),background .3s,border-color .3s}
.fx-cursor-ring.is-link span{transform:scale(1.6);background:rgba(21,84,184,.1);border-color:rgba(21,84,184,.25)}
.fx-cursor-ring.is-view span{transform:scale(2.2);background:#1554B8;border-color:#1554B8}
.fx-cursor-ring.is-down span{transform:scale(.8)}
.why-us-section:hover ~ .fx-cursor-ring span{border-color:rgba(255,255,255,.5)}

/* ---- 3D tilt + glare ---- */
html body .fx-tilt.fx-tilt{transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .6s cubic-bezier(.2,.8,.2,1);transform-style:preserve-3d;position:relative;overflow:hidden}
html body .fx-tilt.fx-tilt-on{transition:transform .12s linear}
.fx-glare{position:absolute;inset:0;pointer-events:none;border-radius:inherit;opacity:0;transition:opacity .4s;background:radial-gradient(360px circle at var(--gx,50%) var(--gy,50%),rgba(255,255,255,.55),rgba(255,255,255,0) 60%);mix-blend-mode:soft-light;z-index:3}
.fx-tilt-on .fx-glare{opacity:1}

/* ---- ripple ---- */
.fx-ripple-host{overflow:hidden}
.fx-ripple{position:absolute;border-radius:50%;pointer-events:none;background:rgba(255,255,255,.45);transform:scale(0);animation:fxRipple .7s cubic-bezier(.2,.8,.2,1) forwards;z-index:0}
@keyframes fxRipple{to{transform:scale(1);opacity:0}}

/* ---- nav hide/show (uses `translate`, so the nav's own transforms are untouched) ---- */
.floating-notch-nav{transition:translate .45s cubic-bezier(.2,.8,.2,1),opacity .35s}
.floating-notch-nav.fx-nav-hide{translate:0 -140%;opacity:0}

/* ---- dark sections: rounded window that opens as it scrolls in ---- */
.why-us-section,.agency-footer{will-change:clip-path}

/* =============================================================================
   HERO: both clinics
   ============================================================================= */
.hero-centres{display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:860px;margin:30px auto 0;text-align:left}
.hc-card{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:14px 16px;border-radius:18px;background:rgba(255,255,255,.78);border:1px solid rgba(226,232,242,.95);box-shadow:0 14px 34px -20px rgba(7,23,46,.35);text-decoration:none;color:#0F1D33;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s,border-color .3s}
.hc-card:hover{transform:translateY(-3px);border-color:rgba(21,84,184,.35);box-shadow:0 22px 40px -22px rgba(21,84,184,.45)}
.hc-pin{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:#E8F0FB;color:#1554B8}
.hc-txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.hc-txt b{font:600 15px/1.25 var(--f-display);letter-spacing:-.01em}
.hc-txt span{font-size:13px;line-height:1.4;color:#475872}
.hc-go{font-size:12.5px;font-weight:600;color:#1554B8;white-space:nowrap;padding:7px 11px;border-radius:999px;background:#E8F0FB;transition:background .3s,color .3s}
.hc-card:hover .hc-go{background:#1554B8;color:#fff}
.hc-status{grid-column:1 / -1;justify-self:center;display:inline-flex;align-items:center;gap:8px;margin:4px 0 0;font-size:13.5px;font-weight:500;color:#475872}
.hc-status i{width:8px;height:8px;border-radius:50%;background:#94A3B8;position:relative}
.hc-status.open i{background:#10B981}
.hc-status.open i::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid #10B981;animation:hcPulse 1.8s ease-out infinite}
.hc-status.open span b{color:#047857}
@keyframes hcPulse{from{transform:scale(.6);opacity:1}to{transform:scale(1.8);opacity:0}}
@media (max-width:768px){
  .hero-centres{grid-template-columns:1fr;gap:10px;margin-top:22px}
  .hc-card{padding:12px 12px;gap:10px;border-radius:16px}
  .hc-pin{width:34px;height:34px}
  .hc-txt b{font-size:14.5px}
  .hc-txt span{font-size:12.5px}
  .hc-go{padding:6px 9px;font-size:12px}
}

/* =============================================================================
   CLINIC IN NUMBERS (dark band, flows into Why-Us)
   ============================================================================= */
.impact-band{position:relative;background:#030712;color:#fff;padding:clamp(72px,9vw,120px) 0 0;overflow:hidden}
.impact-band::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(60% 70% at 15% 0%,rgba(21,84,184,.35),transparent 70%),radial-gradient(50% 60% at 90% 30%,rgba(56,189,248,.14),transparent 70%)}
.impact-band .wrap{position:relative}
.ib-eyebrow{display:flex;align-items:center;gap:12px;margin:0 0 34px;font:600 12px/1 var(--f-body);letter-spacing:.18em;text-transform:uppercase;color:#60A5FA}
.ib-eyebrow::before{content:"";width:28px;height:2px;background:#60A5FA}
.ib-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(255,255,255,.12)}
.ib-stat{padding:34px 28px 38px 0}
.ib-stat + .ib-stat{padding-left:28px;border-left:1px solid rgba(255,255,255,.12)}
.ib-stat b{display:block;font:700 clamp(46px,5.6vw,84px)/1 var(--f-display);letter-spacing:-.045em;font-variant-numeric:tabular-nums;background:linear-gradient(180deg,#fff 30%,#9CC3FF 130%);-webkit-background-clip:text;background-clip:text;color:transparent}
.ib-stat b em{font-style:normal;font-size:.55em;margin-left:4px;vertical-align:.55em;color:#F5B83D;-webkit-text-fill-color:#F5B83D}
.ib-stat p{margin:14px 0 0;color:#A9B8CC;font-size:15px;line-height:1.45;max-width:22ch}
.ib-ticker{position:relative;margin-top:clamp(40px,6vw,70px);border-top:1px solid rgba(255,255,255,.1);border-bottom:1px solid rgba(255,255,255,.1);overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.ib-track{display:flex;width:max-content;animation:ibScroll 48s linear infinite}
.ib-track span{display:inline-flex;align-items:center;gap:28px;padding:22px 0 22px 28px;font:600 clamp(20px,2.4vw,30px)/1 var(--f-display);letter-spacing:-.02em;color:rgba(255,255,255,.28);white-space:nowrap;transition:color .3s}
.ib-track span::after{content:"";width:8px;height:8px;border-radius:50%;background:#1554B8}
.ib-track span:hover{color:#fff}
@keyframes ibScroll{to{transform:translateX(-50%)}}
@media (max-width:900px){.ib-grid{grid-template-columns:1fr 1fr}.ib-stat:nth-child(3){padding-left:0;border-left:0}.ib-stat:nth-child(n+3){border-top:1px solid rgba(255,255,255,.12)}}
@media (max-width:480px){.ib-stat{padding:26px 14px 28px 0}.ib-stat + .ib-stat{padding-left:14px}.ib-stat:nth-child(3){padding-left:0}.ib-stat p{font-size:13.5px}}
@media (prefers-reduced-motion:reduce){.ib-track{animation:none}}
@media (min-width:769px){.hero-centres{margin-bottom:28px}}
@media (max-width:768px){.hero-centres{margin-bottom:18px}}
