/* ==========================================================
   MEDILINE BIOTEX — Home (deep build)
   Palette derived from the logo mark
   ========================================================== */
:root{
  --teal:#0FA8A8; --teal-lt:#3FD0D0; --teal-pale:#DEF7F7; --teal-dk:#06797B;
  --orange:#F26522; --amber:#F7931E; --peach:#FFF0E6;
  --blue:#2E7BC4; --blue-dk:#1B3F94; --navy:#1F2C7A; --sky:#ECF3FC;
  --ink:#0A2029; --ink-2:#12313D; --slate:#42616C; --mist:#F2FAFA; --line:#DBEBEB;
  --white:#fff; --green:#18C08F;

  --g-warm:linear-gradient(135deg,#F26522 0%,#F7931E 100%);
  --g-cool:linear-gradient(135deg,#1B3F94 0%,#2E7BC4 100%);
  --g-brand:linear-gradient(135deg,#0FA8A8 0%,#2E7BC4 100%);
  --g-mint:linear-gradient(135deg,#3FD0D0 0%,#0FA8A8 100%);
  --g-tri:linear-gradient(120deg,#0FA8A8 0%,#2E7BC4 46%,#F26522 100%);

  --display:'Sora',system-ui,sans-serif;
  --body:'Inter',system-ui,sans-serif;
  --mono:'IBM Plex Mono',monospace;

  --gut:clamp(18px,5vw,64px);
  --maxw:1280px;
  --sh-sm:0 4px 18px rgba(10,32,41,.06);
  --sh-md:0 14px 44px rgba(10,32,41,.10);
  --sh-lg:0 28px 70px rgba(10,32,41,.16);
  --ease:cubic-bezier(.2,.8,.3,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--white);color:var(--ink);font-family:var(--body);
  font-size:16.5px;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul{margin:0;padding:0;list-style:none}
button{font-family:inherit}
:focus-visible{outline:3px solid var(--orange);outline-offset:3px;border-radius:4px}
::selection{background:var(--teal-lt);color:#043536}

.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--gut)}
.sec{padding-block:clamp(52px,6.4vw,94px);position:relative}
.sec-mist{background:var(--mist)}
.sec-sky{background:var(--sky)}
.sec-peach{background:var(--peach)}

/* ---------- type ---------- */
.eyebrow{display:inline-flex;align-items:center;gap:9px;font-family:var(--mono);
  font-size:11.5px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;
  color:var(--teal-dk);background:var(--teal-pale);padding:6px 14px 6px 10px;
  border-radius:100px;margin:0 0 16px}
.eyebrow i{width:7px;height:7px;border-radius:50%;background:var(--orange);flex:none;
  animation:blip 1.9s ease-in-out infinite}
@keyframes blip{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.3;transform:scale(.65)}}
.eyebrow.on-dark{background:rgba(255,255,255,.13);color:#BFF0F0}
.h1{font-family:var(--display);font-weight:800;font-size:clamp(36px,5.7vw,68px);
  line-height:1.05;letter-spacing:-.035em;margin:0}
.h2{font-family:var(--display);font-weight:700;font-size:clamp(27px,3.6vw,45px);
  line-height:1.11;letter-spacing:-.028em;margin:0 0 12px}
.h3{font-family:var(--display);font-weight:600;font-size:20px;line-height:1.3;
  letter-spacing:-.015em;margin:0 0 10px}
.h4{font-family:var(--display);font-weight:600;font-size:16.5px;margin:0 0 10px}
.lede{font-size:clamp(16.5px,1.5vw,19.5px);color:var(--slate);max-width:60ch;margin:0}
.sub{color:var(--slate);max-width:62ch;margin:0}
.grad-text{background:var(--g-brand);-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent}
.grad-warm{background:var(--g-warm);-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:10px;font-weight:600;font-size:15px;
  padding:14px 27px;border-radius:100px;border:2px solid transparent;cursor:pointer;
  position:relative;overflow:hidden;isolation:isolate;
  transition:transform .28s var(--ease),box-shadow .28s,background .28s,color .28s}
.btn svg{width:16px;height:16px;transition:transform .28s}
.btn:hover svg{transform:translateX(4px)}
.btn-warm{background:var(--g-warm);color:#fff;box-shadow:0 10px 26px rgba(242,101,34,.32)}
.btn-warm:hover{transform:translateY(-3px);box-shadow:0 18px 38px rgba(242,101,34,.44)}
.btn-teal{background:var(--g-mint);color:#fff;box-shadow:0 10px 26px rgba(15,168,168,.3)}
.btn-teal:hover{transform:translateY(-3px);box-shadow:0 18px 38px rgba(15,168,168,.42)}
.btn-out{border-color:var(--ink);color:var(--ink)}
.btn-out:hover{background:var(--ink);color:#fff;transform:translateY(-3px)}
.btn-white{background:#fff;color:var(--ink);box-shadow:var(--sh-md)}
.btn-white:hover{transform:translateY(-3px)}
.btn-ghost{border-color:rgba(255,255,255,.45);color:#fff}
.btn-ghost:hover{background:#fff;color:var(--ink);border-color:#fff;transform:translateY(-3px)}
.btn-sm{padding:11px 21px;font-size:14px}
.ripple{position:absolute;border-radius:50%;background:rgba(255,255,255,.45);
  transform:scale(0);animation:rip .65s ease-out forwards;pointer-events:none;z-index:-1}
@keyframes rip{to{transform:scale(4);opacity:0}}

/* ---------- cursor glow ---------- */
#glow{position:fixed;width:420px;height:420px;border-radius:50%;pointer-events:none;z-index:1;
  background:radial-gradient(circle,rgba(63,208,208,.16),transparent 66%);
  transform:translate(-50%,-50%);opacity:0;transition:opacity .4s;mix-blend-mode:multiply}
body.has-cursor #glow{opacity:1}

/* ---------- top ticker ---------- */
#tick{background:var(--ink);color:#BFE3E6;overflow:hidden;height:38px;
  display:flex;align-items:center;position:relative;z-index:160}
.tick-track{display:flex;gap:44px;width:max-content;animation:slide 34s linear infinite;
  font-family:var(--mono);font-size:11.5px;letter-spacing:.11em;text-transform:uppercase;white-space:nowrap}
.tick-track span{display:flex;align-items:center;gap:11px}
.tick-track u{text-decoration:none;width:5px;height:5px;border-radius:50%;background:var(--orange)}
@keyframes slide{to{transform:translateX(-50%)}}

/* ---------- progress ---------- */
#prog{position:fixed;top:0;left:0;height:3px;width:0;z-index:200;background:var(--g-tri)}

/* ---------- header ---------- */
#hdr{position:sticky;top:0;z-index:150;background:rgba(255,255,255,0);
  transition:background .35s,box-shadow .35s,padding .35s;padding-block:10px}
#hdr.stuck{background:rgba(255,255,255,.95);backdrop-filter:blur(14px);
  box-shadow:0 2px 26px rgba(10,32,41,.09);padding-block:6px}
.hdr-in{display:flex;align-items:center;gap:16px}
.logo{flex:none;line-height:0}
.logo img{height:64px;width:auto;flex:none;transition:height .35s}
#hdr.stuck .logo img{height:52px}
.nav{display:flex;align-items:center;gap:2px;margin-left:auto;min-width:0;flex-wrap:nowrap}
.nav>a{font-size:14.5px;font-weight:500;padding:9px 12px;border-radius:100px;position:relative;
  transition:color .22s}
.nav>a::after{content:"";position:absolute;left:50%;bottom:3px;width:0;height:2px;
  background:var(--g-warm);border-radius:2px;transform:translateX(-50%);transition:width .3s}
.nav>a:hover{color:var(--teal-dk)}
.nav>a:hover::after,.nav>a.active::after{width:22px}
.nav>a.active{color:var(--teal-dk)}
.nav .btn{margin-left:10px}
#burger{display:none;margin-left:auto;width:46px;height:46px;border-radius:50%;border:none;
  background:var(--teal-pale);cursor:pointer;position:relative}
#burger span{position:absolute;left:14px;width:18px;height:2px;background:var(--teal-dk);
  border-radius:2px;transition:.3s}
#burger span:nth-child(1){top:17px}#burger span:nth-child(2){top:23px}#burger span:nth-child(3){top:29px}
#burger.x span:nth-child(1){top:23px;transform:rotate(45deg)}
#burger.x span:nth-child(2){opacity:0}
#burger.x span:nth-child(3){top:23px;transform:rotate(-45deg)}
#drawer{position:fixed;inset:0 0 0 auto;width:min(340px,86vw);background:#fff;z-index:149;
  transform:translateX(100%);visibility:hidden;transition:transform .45s var(--ease),visibility 0s linear .45s;padding:100px 32px 40px;
  box-shadow:var(--sh-lg);display:none;overflow-y:auto}
#drawer.open{transform:none;visibility:visible;transition:transform .45s var(--ease),visibility 0s}
#drawer a{display:block;padding:15px 0;border-bottom:1px solid var(--line);
  font-family:var(--display);font-weight:600;font-size:18px}

/* ---------- hero ---------- */
#hero{position:relative;padding-top:clamp(34px,4.4vw,58px);padding-bottom:0;overflow:hidden;
  background:radial-gradient(940px 580px at 88% -10%,rgba(63,208,208,.32),transparent 62%),
             radial-gradient(780px 520px at 4% 6%,rgba(46,123,196,.20),transparent 62%),
             radial-gradient(720px 500px at 60% 100%,rgba(247,147,30,.17),transparent 60%),
             linear-gradient(180deg,#F7FDFD 0%,#fff 80%)}
#net{position:absolute;inset:0;width:100%;height:100%;opacity:.9;pointer-events:none;z-index:1}
#hero .wrap{position:relative;z-index:3}
.blob{position:absolute;border-radius:50%;opacity:.55;pointer-events:none;z-index:2}
.b1{width:15px;height:15px;background:var(--orange);top:26%;left:7%}
.b2{width:9px;height:9px;background:var(--teal);top:64%;left:14%}
.b3{width:21px;height:21px;background:var(--blue);top:16%;right:11%}
.b4{width:12px;height:12px;background:var(--amber);top:74%;right:18%}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,5vw,68px);align-items:center}
.h1 .word{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.06em}
.fx .h1 .word i{display:inline-block;font-style:normal;transform:translateY(112%);
  transition:transform .9s var(--ease)}
body.ready .h1 .word i{transform:none}
.rotator{display:flex;align-items:center;gap:12px;margin-top:18px;font-family:var(--mono);
  font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--slate)}
.rotator b{color:var(--teal-dk);font-weight:500;min-width:16ch;display:inline-block}
.rotator u{text-decoration:none;width:7px;height:7px;border-radius:50%;background:var(--green);
  animation:blip 1.5s infinite}
.hero-cta{display:flex;flex-wrap:wrap;gap:13px;margin-top:26px}
.hero-tick{display:flex;flex-wrap:wrap;gap:20px;margin-top:22px;font-family:var(--mono);
  font-size:12px;letter-spacing:.06em;color:var(--slate)}
.hero-tick span{display:flex;align-items:center;gap:8px}
.hero-tick b{width:6px;height:6px;border-radius:50%;background:var(--teal);flex:none}

.hero-vis{position:relative;perspective:1100px;margin-top:26px}
.vis-card{background:#fff;border-radius:22px;box-shadow:var(--sh-lg);padding:22px;
  border:1px solid var(--line);transition:transform .18s ease-out;transform-style:preserve-3d}
.vis-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.vis-head p{margin:0;font-family:var(--mono);font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--slate)}
.live{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:10.5px;
  color:var(--teal-dk);background:var(--teal-pale);padding:5px 11px;border-radius:100px;letter-spacing:.1em}
.live i{width:6px;height:6px;border-radius:50%;background:var(--green);animation:blip 1.4s infinite}
.gauge{position:relative;text-align:center;padding:0}
.gauge svg{width:172px;height:172px;transform:rotate(-90deg)}
.gauge circle{fill:none;stroke-width:13;stroke-linecap:round}
.gauge .bg{stroke:var(--teal-pale)}
.gauge .fg{stroke:url(#gg);stroke-dasharray:534;stroke-dashoffset:534;
  transition:stroke-dashoffset 2.2s var(--ease)}
.gauge .val{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.gauge .val b{font-family:var(--display);font-weight:800;font-size:38px;line-height:1;letter-spacing:-.03em;
  display:flex;align-items:baseline;justify-content:center;gap:1px;white-space:nowrap}
.gauge .val b .unit{font-size:.52em;font-weight:700}
.gauge .val>span{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--slate);margin-top:6px}
.vis-rows{display:grid;gap:7px;margin-top:12px}
.vrow{display:flex;align-items:center;gap:11px;background:var(--mist);border-radius:12px;
  padding:10px 13px;font-size:13px}
.vrow em{font-style:normal;margin-left:auto;font-family:var(--mono);font-size:11.5px;
  color:var(--teal-dk);font-weight:500}
.vrow u{text-decoration:none;width:8px;height:8px;border-radius:50%;background:var(--teal);flex:none}
.vrow.warm u{background:var(--amber)}.vrow.warm em{color:#B4600B}
.float-chip{position:absolute;background:#fff;border-radius:15px;box-shadow:var(--sh-md);
  padding:12px 16px;display:flex;align-items:center;gap:11px;border:1px solid var(--line);z-index:4;
  animation:bob 5s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-11px)}}
.float-chip b{font-family:var(--display);font-weight:700;font-size:17px;display:block;line-height:1.15}
.float-chip small{font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--slate);display:block}
.float-chip .ico{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;flex:none}
.fc1{top:-40px;left:-30px}
.fc2{bottom:-26px;right:-26px;animation-delay:-2.4s}
.scroll-cue{display:flex;flex-direction:column;align-items:center;gap:6px;margin-top:clamp(14px,2vw,26px);
  font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--slate)}
.scroll-cue i{width:1px;height:44px;background:linear-gradient(var(--teal),transparent);position:relative}
.scroll-cue i::after{content:"";position:absolute;top:0;left:-2px;width:5px;height:5px;border-radius:50%;
  background:var(--orange);animation:fall 2s ease-in-out infinite}
@keyframes fall{0%{top:0;opacity:0}20%{opacity:1}80%{opacity:1}100%{top:40px;opacity:0}}
.pulse-wrap{margin-top:clamp(22px,3vw,36px);padding-bottom:0}
.pulse{width:100%;height:44px;display:block;overflow:visible}
.pulse path{fill:none;stroke-linecap:round;stroke-linejoin:round}
.pulse .flat{stroke:var(--line);stroke-width:1.5}
.pulse .live-line{stroke:var(--teal);stroke-width:2.5;stroke-dasharray:1600;stroke-dashoffset:1600;
  animation:draw 2.5s var(--ease) 1.2s forwards}
@keyframes draw{to{stroke-dashoffset:0}}

/* ---------- reveals ---------- */
.fx .rv{opacity:0;transform:translateY(38px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.fx .rv-l{opacity:0;transform:translateX(-44px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.fx .rv-r{opacity:0;transform:translateX(44px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.fx .rv-s{opacity:0;transform:scale(.93);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.fx .rv-f{opacity:0;transition:opacity 1s var(--ease)}
.in{opacity:1!important;transform:none!important}

/* ---------- stats band ---------- */
#stats{background:var(--g-brand);overflow:hidden;padding-block:clamp(38px,4.6vw,58px);position:relative}
#stats::after{content:"";position:absolute;inset:0;
  background:radial-gradient(620px 320px at 12% 130%,rgba(255,255,255,.22),transparent 60%)}
.stat-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;position:relative;z-index:2}
.stat{text-align:center;color:#fff;position:relative}
.stat::after{content:"";position:absolute;right:-12px;top:14%;bottom:14%;width:1px;background:rgba(255,255,255,.22)}
.stat:last-child::after{display:none}
.stat b{font-family:var(--display);font-weight:800;font-size:clamp(28px,3.1vw,44px);line-height:1;
  letter-spacing:-.035em;display:block}
.stat>span{font-family:var(--mono);font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;
  opacity:.9;display:block;margin-top:11px}
.stat b{white-space:nowrap}
.stat b .count{font:inherit;letter-spacing:inherit;text-transform:none;opacity:1;display:inline}

/* ---------- about ---------- */
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,76px);align-items:center}
.mosaic{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.tile{border-radius:18px;padding:20px 18px;color:#fff;position:relative;overflow:hidden;
  min-height:130px;display:flex;flex-direction:column;justify-content:flex-end;
  transition:transform .4s var(--ease),box-shadow .4s}
.tile:hover{transform:translateY(-7px) scale(1.02);box-shadow:var(--sh-md)}
.tile b{font-family:var(--display);font-weight:800;font-size:32px;line-height:1;letter-spacing:-.03em}
.tile span{font-family:var(--mono);font-size:10px;letter-spacing:.13em;text-transform:uppercase;
  opacity:.92;margin-top:8px;display:block}
.tile>svg{flex:none;width:25px;height:25px;opacity:.72;margin-bottom:auto}
.tile>svg+b{margin-top:16px}
.t1{background:var(--g-mint)}.t2{background:var(--g-cool)}
.t3{background:var(--g-warm)}.t4{background:var(--ink)}
.pill-list{display:grid;gap:9px;margin-top:20px}
.pill-list li{display:flex;gap:13px;align-items:flex-start;font-size:15.5px;color:var(--slate)}
.pill-list .ck{width:22px;height:22px;border-radius:50%;background:var(--teal-pale);display:grid;
  place-items:center;flex:none;margin-top:3px}
.pill-list .ck svg{width:11px;height:11px}

/* ---------- pinned horizontal process ---------- */
#flow{background:var(--ink);color:#D2E4E8;position:relative}
#flowTrack{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;
  justify-content:center;gap:clamp(18px,2.6vw,32px);overflow:hidden}
#flowInner{display:flex;align-items:stretch;gap:clamp(18px,2.6vw,34px);
  padding-inline:var(--gut);will-change:transform;flex:none}
.stage{width:min(80vw,440px);flex:none;display:flex;flex-direction:column;background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.12);border-radius:24px;padding:clamp(22px,2.6vw,32px);position:relative;
  transition:border-color .4s,background .4s}
.stage.hot{border-color:rgba(242,101,34,.55);background:rgba(242,101,34,.07)}
.stage .n{font-family:var(--mono);font-size:11px;letter-spacing:.18em;color:var(--teal-lt);display:block;margin-bottom:16px}
.stage.hot .n{color:var(--amber)}
.stage h3{font-family:var(--display);font-weight:700;font-size:clamp(21px,2.4vw,28px);color:#fff;
  margin:0 0 12px;letter-spacing:-.02em}
.stage p{margin:0;color:#96B4BC;font-size:15px}
.stage .kv{display:flex;justify-content:space-between;gap:14px;padding:12px 0;
  border-bottom:1px solid rgba(255,255,255,.1);font-size:13.5px}
.stage .kv:last-child{border-bottom:none}
.stage .kv em{font-style:normal;font-family:var(--mono);font-size:11.5px;color:#C6DEE3}
.stage .kvs{margin-top:22px}
.flow-head{flex:none}
.flow-head .h2{margin-bottom:0}
.flow-bar{flex:none;margin-inline:var(--gut);height:2px;background:rgba(255,255,255,.13);
  border-radius:2px;overflow:hidden}
.flow-bar i{display:block;height:100%;width:0;background:var(--g-warm)}

/* ---------- tabs ---------- */
.tabs{display:flex;flex-wrap:wrap;gap:9px;margin-top:24px}
.tab{font-family:var(--display);font-weight:600;font-size:14.5px;padding:12px 22px;border-radius:100px;
  border:2px solid var(--line);background:#fff;cursor:pointer;transition:.3s;color:var(--slate)}
.tab:hover{border-color:var(--teal-lt);color:var(--teal-dk)}
.tab.on{background:var(--g-brand);border-color:transparent;color:#fff;box-shadow:0 10px 24px rgba(15,168,168,.28)}
.panes{margin-top:26px}
.pane{display:none}.pane.on{display:block}
.pane-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(26px,4vw,56px);align-items:center}
.pane-card{background:#fff;border:1px solid var(--line);border-radius:20px;
  padding:clamp(20px,2.5vw,32px);box-shadow:var(--sh-sm)}
.spec{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);
  border-radius:16px;overflow:hidden;margin-top:18px}
.spec div{background:#fff;padding:17px 19px}
.spec b{display:block;font-family:var(--display);font-weight:700;font-size:19px;letter-spacing:-.02em}
.spec span{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--slate);margin-top:5px;display:block}

/* ---------- cold chain lab ---------- */
#cold{background:var(--sky)}
.lab{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(22px,3.2vw,46px);margin-top:26px;align-items:start}
.bands{display:grid;gap:11px}
.band{background:#fff;border:2px solid var(--line);border-radius:16px;padding:18px 20px;cursor:pointer;
  transition:.32s;display:flex;align-items:center;gap:14px}
.band:hover{border-color:var(--teal-lt)}
.band.on{border-color:var(--teal);box-shadow:0 12px 30px rgba(15,168,168,.16);transform:translateX(6px)}
.band .sw{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;flex:none;color:#fff}
.band .sw svg{width:18px;height:18px}
.band b{display:block;font-family:var(--display);font-weight:600;font-size:15.5px}
.band span{font-family:var(--mono);font-size:11px;color:var(--slate);letter-spacing:.06em}
.band em{margin-left:auto;font-style:normal;font-family:var(--mono);font-size:13px;font-weight:500;color:var(--teal-dk)}
.readout{background:var(--ink);border-radius:22px;padding:clamp(20px,2.6vw,30px);color:#D2E4E8;position:relative;overflow:hidden}
.readout::after{content:"";position:absolute;inset:0;
  background:radial-gradient(500px 300px at 90% 0%,rgba(15,168,168,.22),transparent 60%);pointer-events:none}
.readout>*{position:relative;z-index:2}
.ro-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}
.ro-head h4{color:#fff;margin:0}
.ro-now{font-family:var(--display);font-weight:800;font-size:clamp(40px,5.5vw,64px);line-height:1;
  letter-spacing:-.04em;color:#fff}
.ro-now sup{font-size:.4em;font-weight:600;vertical-align:super;color:var(--teal-lt)}
.ro-meta{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  color:#8FB0B8;margin-top:8px}
#chart{width:100%;height:132px;margin-top:14px;display:block}
#chart path.line{fill:none;stroke:var(--teal-lt);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
#chart path.area{fill:url(#ca);stroke:none}
#chart line.lim{stroke:rgba(242,101,34,.5);stroke-width:1;stroke-dasharray:4 4}
.ro-foot{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(255,255,255,.13);
  border-radius:14px;overflow:hidden;margin-top:16px}
.ro-foot div{background:var(--ink);padding:15px 16px}
.ro-foot b{display:block;font-family:var(--display);font-weight:700;font-size:18px;color:#fff}
.ro-foot span{font-family:var(--mono);font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;
  color:#8FB0B8;margin-top:5px;display:block}
.note{font-family:var(--mono);font-size:11px;color:var(--slate);letter-spacing:.05em;margin-top:16px}

/* ---------- coverage radar ---------- */
#reach{background:var(--ink);color:#D2E4E8;overflow:hidden}
#reach .h2{color:#fff}#reach .sub{color:#96B4BC}
.reach-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3.6vw,52px);align-items:center;margin-top:24px}
.radar{position:relative;aspect-ratio:1;max-width:460px;margin-inline:auto;width:100%}
.radar svg{width:100%;height:100%;overflow:visible}
.radar circle.ring{fill:none;stroke:rgba(255,255,255,.14);stroke-width:1}
.radar .sweep{transform-origin:50% 50%;animation:sweep 5s linear infinite}
@keyframes sweep{to{transform:rotate(360deg)}}
.radar .core{fill:var(--orange)}
.radar .halo{fill:none;stroke:var(--orange);stroke-width:1.5;opacity:0;
  animation:halo 3s ease-out infinite}
@keyframes halo{0%{r:8;opacity:.9}100%{r:70;opacity:0}}
.mk{cursor:pointer}
.mk circle.d{fill:var(--teal-lt);transition:.3s}
.mk text{fill:#BFD8DE;font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.08em}
.mk:hover circle.d,.mk.on circle.d{fill:var(--amber);r:8}
.mk:hover text,.mk.on text{fill:#fff}
.terr{display:grid;gap:9px}
.terr-row{display:flex;align-items:center;gap:14px;background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.11);border-radius:14px;padding:14px 18px;transition:.32s;cursor:pointer}
.terr-row:hover,.terr-row.on{background:rgba(15,168,168,.14);border-color:rgba(63,208,208,.5);transform:translateX(6px)}
.terr-row b{font-family:var(--display);font-weight:600;font-size:15px;color:#fff}
.terr-row span{margin-left:auto;font-family:var(--mono);font-size:11px;color:#96B4BC;letter-spacing:.06em}
.terr-row u{text-decoration:none;width:8px;height:8px;border-radius:50%;background:var(--teal-lt);flex:none}

/* ---------- therapies ---------- */
.filters{display:flex;flex-wrap:wrap;gap:9px;margin-top:22px}
.filt{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;
  padding:10px 18px;border-radius:100px;border:2px solid var(--line);background:#fff;cursor:pointer;
  color:var(--slate);transition:.3s}
.filt:hover{border-color:var(--teal-lt);color:var(--teal-dk)}
.filt.on{background:var(--ink);border-color:var(--ink);color:#fff}
.ther-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(232px,1fr));gap:13px;margin-top:22px}
.ther{background:#fff;border:1px solid var(--line);border-radius:18px;padding:22px 20px;
  transition:transform .38s var(--ease),box-shadow .38s,border-color .38s;position:relative;overflow:hidden}
.ther::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--g-brand);
  transform:scaleY(0);transform-origin:top;transition:transform .42s}
.ther:hover{transform:translateY(-8px);box-shadow:var(--sh-md);border-color:transparent}
.ther:hover::before{transform:scaleY(1)}
.ther .ico{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;margin-bottom:15px;
  transition:transform .4s var(--ease)}
.ther:hover .ico{transform:rotate(-8deg) scale(1.08)}
.ther .ico svg{width:22px;height:22px}
.ther p{margin:0;font-size:13.5px;color:var(--slate);line-height:1.6}
.ther .lvl{margin-top:15px}
.ther .lvl i{display:block;height:4px;border-radius:4px;background:var(--line);overflow:hidden;position:relative}
.ther .lvl i b{position:absolute;inset:0;width:0;background:var(--g-brand);border-radius:4px;
  transition:width 1.2s var(--ease)}
.ther .lvl span{font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--slate);margin-top:7px;display:block}
.ic-teal{background:var(--teal-pale);color:var(--teal-dk)}
.ic-orange{background:var(--peach);color:var(--orange)}
.ic-blue{background:var(--sky);color:var(--blue-dk)}

/* ---------- marquee ---------- */
.marq{overflow:hidden;position:relative;padding-block:9px;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marq-track{display:flex;gap:13px;width:max-content;animation:slide 40s linear infinite}
.marq.rev .marq-track{animation-direction:reverse;animation-duration:46s}
.marq.slow .marq-track{animation-duration:54s}
.marq:hover .marq-track{animation-play-state:paused}
.brand-chip{background:#fff;border:1px solid var(--line);border-radius:100px;padding:13px 27px;
  font-family:var(--display);font-weight:600;font-size:14.5px;white-space:nowrap;transition:.3s}
.brand-chip:hover{border-color:var(--teal-lt);color:var(--teal-dk);box-shadow:var(--sh-sm);transform:translateY(-3px)}

/* ---------- CFA ---------- */
.cfa-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:26px}
.cfa{background:#fff;border:1px solid var(--line);border-radius:16px;padding:23px 21px;
  transition:.38s;position:relative;overflow:hidden}
.cfa:hover{transform:translateY(-7px);box-shadow:var(--sh-md);border-color:transparent}
.cfa b{display:block;font-family:var(--display);font-weight:700;font-size:16px;margin-bottom:7px}
.cfa span{font-family:var(--mono);font-size:11px;letter-spacing:.07em;color:var(--slate)}
.cfa .flag{position:absolute;top:0;right:0;width:36px;height:36px;background:var(--g-brand);
  clip-path:polygon(100% 0,0 0,100% 100%);opacity:.14;transition:.38s}
.cfa:hover .flag{opacity:.34}

/* ---------- clients ---------- */
.cl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(212px,1fr));gap:10px;margin-top:26px}
.cl{background:#fff;border:1px solid var(--line);border-radius:14px;padding:19px 18px;font-size:14.5px;
  font-weight:500;transition:.32s;display:flex;align-items:center;gap:11px}
.cl u{text-decoration:none;width:7px;height:7px;border-radius:50%;background:var(--teal-lt);flex:none;transition:.32s}
.cl:hover{border-color:var(--teal-lt);transform:translateY(-5px);box-shadow:var(--sh-sm)}
.cl:hover u{background:var(--orange);transform:scale(1.6)}

/* ---------- why us: rings ---------- */
.rings{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:30px}
.ring-card{text-align:center;background:#fff;border:1px solid var(--line);border-radius:20px;
  padding:24px 18px;transition:.4s var(--ease)}
.ring-card:hover{transform:translateY(-8px);box-shadow:var(--sh-md);border-color:transparent}
.ring{position:relative;width:108px;height:108px;margin:0 auto 12px}
.ring svg{width:108px;height:108px;transform:rotate(-90deg)}
.ring circle{fill:none;stroke-width:9;stroke-linecap:round}
.ring .rb{stroke:var(--teal-pale)}
.ring .rf{stroke-dasharray:333;stroke-dashoffset:333;transition:stroke-dashoffset 1.8s var(--ease)}
/* line-height centring keeps the number+unit on one inline baseline.
   flex/grid here would either top-align (baseline) or split the unit onto its own row. */
.ring .lbl{position:absolute;inset:0;text-align:center;line-height:108px;white-space:nowrap;
  font-family:var(--display);font-weight:800;font-size:25px;letter-spacing:-.03em}
.ring .lbl .unit{font-size:.56em;font-weight:700;letter-spacing:0;margin-left:1px}
.ring-card p{margin:5px 0 0;font-size:13.5px;color:var(--slate);line-height:1.55}

/* ---------- timeline ---------- */
.tl{position:relative;margin-top:32px;padding-left:0}
.tl-spine{position:absolute;left:15px;top:6px;bottom:6px;width:2px;background:var(--line);border-radius:2px;overflow:hidden}
.tl-spine i{display:block;width:100%;height:0;background:var(--g-brand)}
.tl-item{position:relative;padding-left:52px;padding-bottom:26px}
.tl-item:last-child{padding-bottom:0}
.tl-item .dot{position:absolute;left:6px;top:4px;width:20px;height:20px;border-radius:50%;background:#fff;
  border:2px solid var(--line);display:grid;place-items:center;transition:.45s;z-index:2}
.tl-item .dot i{width:7px;height:7px;border-radius:50%;background:var(--line);transition:.45s}
.tl-item.lit .dot{border-color:var(--teal)}
.tl-item.lit .dot i{background:var(--teal)}
.tl-item:last-child.lit .dot{border-color:var(--orange)}
.tl-item:last-child.lit .dot i{background:var(--orange)}
.tl-item .yr{font-family:var(--mono);font-size:12px;letter-spacing:.14em;color:var(--teal-dk);
  display:block;margin-bottom:6px}
.tl-item h3{font-family:var(--display);font-weight:600;font-size:19px;margin:0 0 6px}
.tl-item p{margin:0;color:var(--slate);font-size:15px;max-width:60ch}

/* ---------- leadership ---------- */
.ppl{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:30px}
.person{background:#fff;border:1px solid var(--line);border-radius:22px;padding:clamp(22px,2.6vw,32px);
  transition:.42s var(--ease);position:relative;overflow:hidden}
.person::after{content:"";position:absolute;top:0;left:0;right:0;height:5px;background:var(--g-brand);
  transform:scaleX(0);transform-origin:left;transition:transform .55s}
.person:hover{transform:translateY(-9px);box-shadow:var(--sh-lg);border-color:transparent}
.person:hover::after{transform:scaleX(1)}
.person .av{width:58px;height:58px;border-radius:16px;background:var(--g-brand);color:#fff;display:grid;
  place-items:center;font-family:var(--display);font-weight:800;font-size:22px;margin-bottom:15px;
  transition:transform .45s var(--ease)}
.person:hover .av{transform:rotate(-7deg) scale(1.06)}
.person.warm .av{background:var(--g-warm)}
.person .role{font-family:var(--mono);font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;
  color:var(--teal-dk);margin:0 0 8px}
.person p{color:var(--slate);font-size:15px;margin:13px 0 0}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:15px}
.chips span{font-family:var(--mono);font-size:10.5px;background:var(--mist);border:1px solid var(--line);
  padding:6px 12px;border-radius:100px;color:var(--slate);transition:.3s}
.person:hover .chips span{border-color:var(--teal-lt);color:var(--teal-dk)}

/* ---------- sister ---------- */
#sister{background:var(--g-cool);color:#fff;overflow:hidden;position:relative}
#sister::after{content:"";position:absolute;inset:0;
  background:radial-gradient(640px 400px at 88% 12%,rgba(255,255,255,.16),transparent 62%)}
#sister .wrap{position:relative;z-index:2}
.sister-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,68px);align-items:center}
#sister .h2{color:#fff}#sister .sub{color:rgba(255,255,255,.85)}
.glass{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.22);border-radius:22px;
  padding:clamp(24px,3vw,36px);backdrop-filter:blur(8px)}
.glass h4{color:#fff}
.glass .row{display:flex;justify-content:space-between;gap:18px;padding:13px 0;
  border-bottom:1px solid rgba(255,255,255,.16);font-size:14.5px}
.glass .row:last-child{border-bottom:none}
.glass .row em{font-style:normal;font-family:var(--mono);font-size:12.5px;color:#CFE4FF}

/* ---------- FAQ carousel ---------- */
.faq-stage{background:#fff;border:1px solid var(--line);border-radius:24px;
  padding:clamp(24px,3.2vw,42px);margin-top:26px;position:relative;min-height:200px;box-shadow:var(--sh-sm)}
.faq-q{font-family:var(--display);font-weight:700;font-size:clamp(20px,2.4vw,28px);letter-spacing:-.02em;
  margin:0 0 14px}
.faq-a{color:var(--slate);margin:0;max-width:74ch}
.faq-nav{display:flex;align-items:center;gap:12px;margin-top:22px}
.fnav{width:44px;height:44px;border-radius:50%;border:2px solid var(--line);background:#fff;cursor:pointer;
  display:grid;place-items:center;transition:.3s}
.fnav:hover{border-color:var(--teal);background:var(--teal-pale)}
.fnav svg{width:17px;height:17px}
.dots{display:flex;gap:7px;margin-left:auto}
.dots i{width:8px;height:8px;border-radius:50%;background:var(--line);cursor:pointer;transition:.3s}
.dots i.on{background:var(--g-warm);width:26px;border-radius:8px}
.faq-count{font-family:var(--mono);font-size:12px;color:var(--slate);letter-spacing:.1em}

/* ---------- compliance accordion ---------- */
.acc{margin-top:26px;border-top:1px solid var(--line)}
.acc-item{border-bottom:1px solid var(--line)}
.acc-hd{display:flex;align-items:center;gap:17px;padding:19px 4px;cursor:pointer;
  font-family:var(--display);font-weight:600;font-size:18px;transition:color .25s}
.acc-hd:hover{color:var(--teal-dk)}
.acc-hd .n{font-family:var(--mono);font-size:12px;color:var(--teal);letter-spacing:.1em;flex:none}
.acc-hd .pm{margin-left:auto;width:32px;height:32px;border-radius:50%;background:var(--mist);display:grid;
  place-items:center;flex:none;transition:.35s;position:relative}
.acc-hd .pm::before,.acc-hd .pm::after{content:"";position:absolute;background:var(--teal-dk);
  border-radius:2px;transition:.35s}
.acc-hd .pm::before{width:12px;height:2px}
.acc-hd .pm::after{width:2px;height:12px}
.acc-item.open .acc-hd .pm{background:var(--g-warm);transform:rotate(180deg)}
.acc-item.open .acc-hd .pm::before,.acc-item.open .acc-hd .pm::after{background:#fff}
.acc-item.open .acc-hd .pm::after{opacity:0}
.acc-bd{display:none;padding:0 4px 22px 46px}
.acc-bd p{margin:0 0 13px;color:var(--slate);max-width:70ch}
.acc-bd .kv{display:inline-flex;gap:10px;align-items:center;background:var(--mist);border:1px solid var(--line);
  border-radius:100px;padding:8px 16px;font-family:var(--mono);font-size:12px;margin:4px 7px 4px 0}
.acc-bd .kv u{text-decoration:none;color:var(--teal-dk);letter-spacing:.1em;text-transform:uppercase;font-size:9.5px}

/* ---------- split CTA ---------- */
.split{display:grid;grid-template-columns:1fr 1fr}
.half{padding:clamp(34px,4.6vw,62px) clamp(24px,4vw,56px)}
.half.a{background:var(--peach)}
.half.b{background:var(--ink);color:#D2E4E8}
.half.b .h2{color:#fff}.half.b .sub{color:#96B4BC}

/* ---------- contact ---------- */
.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(28px,5vw,62px)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-top:20px}
.field{position:relative}.field.full{grid-column:1/-1}
.field input,.field textarea{width:100%;font-family:var(--body);font-size:15.5px;padding:15px 17px;
  border:2px solid var(--line);border-radius:14px;background:#fff;color:var(--ink);
  transition:border-color .25s,box-shadow .25s}
.field textarea{min-height:108px;resize:vertical}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--teal-lt);
  box-shadow:0 0 0 4px rgba(63,208,208,.16)}
.field label{position:absolute;left:18px;top:15px;font-size:15px;color:#8FA6AD;pointer-events:none;
  transition:.22s;background:#fff;padding-inline:5px}
.field input:focus+label,.field input.has+label,
.field textarea:focus+label,.field textarea.has+label{top:-9px;left:14px;font-size:11px;
  font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--teal-dk)}
.cinfo{display:grid;gap:10px;margin-top:22px}
.cinfo a,.cinfo div.ci{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--line);
  border-radius:16px;padding:14px 17px;transition:.3s}
.cinfo a:hover{border-color:var(--teal-lt);transform:translateX(6px);box-shadow:var(--sh-sm)}
.cinfo .ico{width:40px;height:40px;border-radius:12px;background:var(--teal-pale);color:var(--teal-dk);
  display:grid;place-items:center;flex:none}
.cinfo .ico svg{width:18px;height:18px}
.cinfo b{display:block;font-family:var(--display);font-weight:600;font-size:15px}
.cinfo small{font-size:13.5px;color:var(--slate);display:block;line-height:1.55}
#formMsg{display:none;margin-top:15px;background:var(--teal-pale);border-radius:14px;padding:15px 18px;
  font-size:14.5px;color:var(--teal-dk);font-weight:500}

/* ---------- footer ---------- */
#ftr{background:var(--ink);color:#8FADB6;padding-block:clamp(42px,5vw,64px) 22px}
#ftr img{height:62px;width:auto;margin-bottom:18px}
.f-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:28px}
#ftr h4{font-family:var(--mono);font-size:10px;letter-spacing:.17em;text-transform:uppercase;
  color:var(--teal-lt);margin:0 0 12px;font-weight:500}
#ftr a{display:block;padding:4px 0;font-size:14.5px;color:#C0D9DF;transition:.25s}
#ftr a:hover{color:#fff;transform:translateX(4px)}
#ftr address{font-style:normal;font-size:14.5px;line-height:1.7;color:#C0D9DF}
.socials{display:flex;gap:9px;margin-top:16px}
.socials a{width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.09);
  border:1px solid rgba(255,255,255,.13);display:grid;place-items:center;padding:0;
  color:#C0D9DF;transition:background .28s,color .28s,transform .28s var(--ease),border-color .28s}
.socials a:hover{transform:translateY(-4px);color:#fff;border-color:transparent}
.socials a.s-fb:hover{background:#1877F2}
.socials a.s-ig:hover{background:linear-gradient(45deg,#F09433,#DC2743 55%,#BC1888)}
.socials a.s-yt:hover{background:#FF0000}
.socials svg{width:17px;height:17px;display:block}
.f-btm{border-top:1px solid rgba(255,255,255,.12);margin-top:30px;padding-top:18px;display:flex;
  justify-content:space-between;gap:16px;flex-wrap:wrap;font-family:var(--mono);font-size:11px;
  letter-spacing:.06em;color:#79989F}

#toTop.show{opacity:1;visibility:visible;transform:none}
#toTop .btnface{position:absolute;inset:5px;border-radius:50%;background:var(--g-warm);color:#fff;
  display:grid;place-items:center;box-shadow:0 8px 20px rgba(242,101,34,.34)}
#toTop:hover .btnface{transform:translateY(-2px)}
#toTop svg.ring{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
#toTop svg.ring circle{fill:none;stroke-width:3}
#toTop svg.ring .rb{stroke:rgba(242,101,34,.22)}
#toTop svg.ring .rf{stroke:var(--orange);stroke-linecap:round;stroke-dasharray:151;stroke-dashoffset:151}
#toTop .btnface svg{width:18px;height:18px}

/* ---------- responsive ---------- */
@media(max-width:1080px){
  .stat-grid{grid-template-columns:repeat(3,1fr);gap:30px 20px}
  .stat:nth-child(3n)::after{display:none}
  .cfa-grid,.rings{grid-template-columns:repeat(2,1fr)}
  .f-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:940px){
  .nav{display:none}#burger{display:block}#drawer{display:block}
  .hero-grid,.about-grid,.pane-grid,.sister-grid,.contact-grid,.split,.lab,.reach-grid{grid-template-columns:1fr}
  .ppl{grid-template-columns:1fr}
  .float-chip{display:none}
  #glow{display:none}
  #flowTrack{height:auto;position:static;display:block;gap:0}
  #flowInner{flex-direction:column;transform:none!important;padding-inline:0}
  .stage{width:100%}
  .flow-head{margin-bottom:26px}
  .flow-bar{display:none}
  #flow{padding-block:clamp(70px,8vw,110px)}
}
@media(max-width:600px){
  .cfa-grid,.spec,.form-grid,.rings,.ro-foot{grid-template-columns:1fr}
  .f-grid{grid-template-columns:1fr}
  .acc-bd{padding-left:4px}
  .mosaic{grid-template-columns:1fr 1fr}
}
@media(prefers-reduced-motion:reduce){
  *{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .rv,.rv-l,.rv-r,.rv-s,.rv-f{opacity:1!important;transform:none!important}
  .h1 .word i{transform:none!important}
  html{scroll-behavior:auto}
}

/* ---------- WhatsApp float + hero legend ---------- */
#floats{position:fixed;right:22px;bottom:22px;z-index:145;display:flex;flex-direction:column;
  align-items:flex-end;gap:12px}
#wa,#toTop{position:relative;flex:none}

#wa{width:56px;height:56px;border-radius:50%;background:#25D366;color:#fff;display:grid;
  place-items:center;box-shadow:0 10px 26px rgba(37,211,102,.4);
  transition:transform .3s var(--ease),box-shadow .3s}
#wa svg{width:29px;height:29px;display:block}
#wa:hover,#wa:focus-visible{transform:translateY(-3px) scale(1.05);
  box-shadow:0 16px 36px rgba(37,211,102,.52)}
#wa .ping{position:absolute;inset:0;border-radius:50%;border:2px solid #25D366;
  animation:waPing 2.6s ease-out infinite;pointer-events:none}
@keyframes waPing{0%{transform:scale(1);opacity:.65}70%,100%{transform:scale(1.5);opacity:0}}
#wa .badge{position:absolute;top:0;right:0;width:13px;height:13px;border-radius:50%;
  background:var(--orange);border:2px solid #fff;z-index:2}
#wa .say{position:absolute;right:calc(100% + 12px);top:50%;transform:translateY(-50%) translateX(8px);
  background:var(--ink);color:#fff;font-size:13.5px;font-weight:600;white-space:nowrap;
  padding:9px 15px;border-radius:9px;opacity:0;visibility:hidden;pointer-events:none;
  box-shadow:var(--sh-md);transition:opacity .28s,transform .28s var(--ease),visibility .28s}
#wa .say::after{content:"";position:absolute;left:100%;top:50%;margin-top:-5px;
  border:5px solid transparent;border-left-color:var(--ink)}
#wa:hover .say,#wa:focus-visible .say{opacity:1;visibility:visible;transform:translateY(-50%) translateX(0)}

#toTop{width:52px;height:52px;border:none;background:none;cursor:pointer;padding:0;
  opacity:0;visibility:hidden;transform:translateY(10px);
  transition:opacity .3s,visibility .3s,transform .3s var(--ease)}

.net-key{position:absolute;left:var(--gut);bottom:18px;z-index:3;display:flex;flex-wrap:wrap;
  gap:16px;font-family:var(--mono);font-size:10px;letter-spacing:.11em;text-transform:uppercase;
  color:var(--slate);opacity:.72}
.net-key span{display:flex;align-items:center;gap:7px}
.net-key i{width:9px;height:9px;border-radius:2px;flex:none}

@media(max-width:940px){
  #floats{right:14px;bottom:14px;gap:10px}
  #wa{width:52px;height:52px}
  #wa svg{width:27px;height:27px}
  #wa .say{display:none}
  #toTop{width:46px;height:46px}
  .net-key{display:none}
}
@media(prefers-reduced-motion:reduce){#wa .ping{animation:none;opacity:0}}


/* ---------- gallery ---------- */
.gal{display:grid;grid-template-columns:repeat(4,1fr);gap:11px;margin-top:26px}
.gal figure{margin:0;position:relative;overflow:hidden;border-radius:16px;background:var(--teal-pale);
  aspect-ratio:4/3;cursor:pointer}
.gal figure.wide{grid-column:span 2}
.gal figure.tall{grid-row:span 2;aspect-ratio:auto}
.gal img{width:100%;height:100%;object-fit:cover;transition:transform .75s var(--ease)}
.gal figure:hover img{transform:scale(1.07)}
.gal figcaption{position:absolute;left:0;right:0;bottom:0;padding:26px 16px 13px;color:#fff;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;
  background:linear-gradient(transparent,rgba(8,32,41,.82));opacity:0;transform:translateY(8px);
  transition:opacity .35s,transform .35s var(--ease)}
.gal figure:hover figcaption{opacity:1;transform:none}
.gal figure::after{content:"";position:absolute;inset:0;border:2px solid var(--teal);
  border-radius:16px;opacity:0;transition:opacity .35s}
.gal figure:hover::after{opacity:1}

#lightbox{position:fixed;inset:0;z-index:200;background:rgba(8,32,41,.93);display:none;
  align-items:center;justify-content:center;padding:24px;backdrop-filter:blur(6px)}
#lightbox img{max-width:min(1100px,92vw);max-height:86vh;width:auto;border-radius:14px;
  box-shadow:var(--sh-lg)}
#lbClose{position:absolute;top:20px;right:20px;width:46px;height:46px;border-radius:50%;border:none;
  background:rgba(255,255,255,.14);color:#fff;cursor:pointer;display:grid;place-items:center;transition:.3s}
#lbClose:hover{background:var(--orange)}
#lbClose svg{width:18px;height:18px}
#lbCap{position:absolute;bottom:24px;left:0;right:0;text-align:center;color:#BFD8DE;
  font-family:var(--mono);font-size:11.5px;letter-spacing:.13em;text-transform:uppercase}

@media(max-width:940px){.gal{grid-template-columns:repeat(2,1fr)}.gal figure.tall{grid-row:auto;aspect-ratio:4/3}}
@media(max-width:600px){.gal{grid-template-columns:1fr}.gal figure.wide{grid-column:auto}}

/* ==========================================================
   PRODUCTS PAGE — additions to the shared system
   ========================================================== */

/* ---------- page head ---------- */
#phead{position:relative;overflow:hidden;padding-block:clamp(30px,4vw,52px) clamp(40px,5vw,66px);
  background:radial-gradient(900px 540px at 86% -12%,rgba(63,208,208,.30),transparent 62%),
             radial-gradient(720px 480px at 2% 10%,rgba(46,123,196,.18),transparent 62%),
             radial-gradient(640px 420px at 58% 108%,rgba(247,147,30,.16),transparent 60%),
             linear-gradient(180deg,#F7FDFD 0%,#fff 82%)}
.crumb{display:flex;align-items:center;gap:9px;font-family:var(--mono);font-size:11px;
  letter-spacing:.13em;text-transform:uppercase;color:var(--slate);margin:0 0 18px}
.crumb a{color:var(--teal-dk)}
.crumb a:hover{text-decoration:underline}
.crumb i{width:4px;height:4px;border-radius:50%;background:var(--line)}
.phead-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(26px,4vw,60px);align-items:center}
.qstats{display:grid;grid-template-columns:repeat(2,1fr);gap:11px}
.qstat{background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px 18px;
  box-shadow:var(--sh-sm);transition:transform .35s var(--ease),box-shadow .35s}
.qstat:hover{transform:translateY(-5px);box-shadow:var(--sh-md)}
.qstat b{display:block;font-family:var(--display);font-weight:800;font-size:30px;line-height:1;
  letter-spacing:-.03em}
.qstat span{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--slate);margin-top:8px}
.qstat.warm b{color:var(--orange)}
.qstat.cool b{color:var(--blue-dk)}
.qstat.teal b{color:var(--teal-dk)}

/* ---------- therapy explorer ---------- */
.explorer{display:grid;grid-template-columns:.72fr 1.28fr;gap:clamp(18px,2.6vw,34px);margin-top:26px;
  align-items:start}
.exp-list{display:grid;gap:7px}
.exp-item{display:flex;align-items:center;gap:13px;background:#fff;border:2px solid var(--line);
  border-radius:14px;padding:13px 15px;cursor:pointer;text-align:left;width:100%;
  transition:border-color .3s,transform .3s var(--ease),box-shadow .3s}
.exp-item:hover{border-color:var(--teal-lt)}
.exp-item.on{border-color:var(--teal);box-shadow:0 10px 26px rgba(15,168,168,.16);transform:translateX(5px)}
.exp-item .ico{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;flex:none}
.exp-item .ico svg{width:18px;height:18px}
.exp-item b{font-family:var(--display);font-weight:600;font-size:14.5px;display:block}
.exp-item span{font-family:var(--mono);font-size:10px;letter-spacing:.09em;color:var(--slate);
  text-transform:uppercase}
.exp-item .arrow{margin-left:auto;opacity:0;transform:translateX(-6px);transition:.3s;color:var(--teal)}
.exp-item.on .arrow{opacity:1;transform:none}
.exp-item .arrow svg{width:15px;height:15px}

.exp-panel{background:#fff;border:1px solid var(--line);border-radius:22px;
  padding:clamp(22px,2.8vw,34px);box-shadow:var(--sh-sm);min-height:430px}
.exp-top{display:flex;align-items:flex-start;gap:16px;flex-wrap:wrap}
.exp-top .big{width:54px;height:54px;border-radius:15px;display:grid;place-items:center;flex:none}
.exp-top .big svg{width:26px;height:26px}
.exp-title{font-family:var(--display);font-weight:700;font-size:clamp(23px,2.5vw,30px);
  letter-spacing:-.025em;margin:0 0 4px}
.band-chip{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:11px;
  letter-spacing:.1em;padding:6px 13px;border-radius:100px;background:var(--sky);color:var(--blue-dk)}
.band-chip u{text-decoration:none;width:7px;height:7px;border-radius:50%;background:currentColor}
.band-chip.cold{background:var(--sky);color:var(--blue-dk)}
.band-chip.cool{background:var(--teal-pale);color:var(--teal-dk)}
.band-chip.amb{background:var(--peach);color:#B4600B}
.exp-body{margin-top:18px;color:var(--slate)}
.exp-cols{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:16px;overflow:hidden;margin-top:20px}
.exp-cols div{background:#fff;padding:16px 18px}
.exp-cols h5{margin:0 0 7px;font-family:var(--mono);font-size:10px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--slate);font-weight:500}
.exp-cols p{margin:0;font-size:14px;line-height:1.55}
.meter{margin-top:20px}
.meter .lab{display:flex;justify-content:space-between;font-family:var(--mono);font-size:10.5px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--slate);margin-bottom:8px}
.meter .bar{height:6px;border-radius:6px;background:var(--line);overflow:hidden}
.meter .bar i{display:block;height:100%;width:0;border-radius:6px;background:var(--g-brand);
  transition:width 1s var(--ease)}
.supp{display:flex;flex-wrap:wrap;gap:7px;margin-top:18px}
.supp span{font-family:var(--mono);font-size:11px;background:var(--mist);border:1px solid var(--line);
  padding:6px 12px;border-radius:100px;color:var(--slate)}

/* ---------- storage matrix ---------- */
.matrix{margin-top:26px;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#fff}
.mx-row{display:grid;grid-template-columns:1.15fr .7fr 1.15fr .7fr;gap:1px;background:var(--line)}
.mx-row>div{background:#fff;padding:15px 18px;font-size:14.5px;display:flex;align-items:center}
.mx-row.head>div{background:var(--ink);color:#BFE3E6;font-family:var(--mono);font-size:10px;
  letter-spacing:.14em;text-transform:uppercase}
.mx-row:not(.head):hover>div{background:var(--mist)}
.mx-row b{font-family:var(--display);font-weight:600;font-size:14.5px}
.mx-row .t{font-family:var(--mono);font-size:12px;font-weight:500}
.mx-row .t.cold{color:var(--blue-dk)}
.mx-row .t.cool{color:var(--teal-dk)}
.mx-row .t.amb{color:#B4600B}
.mx-row .yes{color:var(--teal-dk);font-family:var(--mono);font-size:12px}
.mx-row .no{color:#93A9B0;font-family:var(--mono);font-size:12px}

/* ---------- formats ---------- */
.fmt-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin-top:26px}
.fmt{background:#fff;border:1px solid var(--line);border-radius:18px;padding:24px 22px;
  transition:transform .38s var(--ease),box-shadow .38s,border-color .38s;position:relative;overflow:hidden}
.fmt:hover{transform:translateY(-7px);box-shadow:var(--sh-md);border-color:transparent}
.fmt::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--g-brand);
  transform:scaleX(0);transform-origin:left;transition:transform .45s}
.fmt:hover::before{transform:scaleX(1)}
.fmt .ico{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;margin-bottom:14px;
  transition:transform .4s var(--ease)}
.fmt:hover .ico{transform:rotate(-8deg) scale(1.07)}
.fmt .ico svg{width:22px;height:22px}
.fmt p{margin:0;font-size:13.5px;color:var(--slate);line-height:1.6}
.fmt .tagline{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--teal-dk);margin-top:12px;display:block;padding-top:11px;border-top:1px solid var(--line)}

/* ---------- ordering steps ---------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:34px;position:relative}
.steps::before{content:"";position:absolute;left:24px;right:24px;top:23px;height:2px;
  background:rgba(255,255,255,.14);border-radius:2px}
.step{position:relative}
.step .n{width:46px;height:46px;border-radius:50%;background:var(--ink);border:2px solid rgba(255,255,255,.2);
  display:grid;place-items:center;font-family:var(--mono);font-size:13px;color:#BFE3E6;position:relative;z-index:2;
  transition:.45s}
.step.lit .n{border-color:var(--orange);background:var(--orange);color:#fff;
  box-shadow:0 0 0 6px rgba(242,101,34,.16)}
.step h3{font-family:var(--display);font-weight:600;font-size:17px;color:#fff;margin:20px 0 8px}
.step p{margin:0;font-size:14px;color:#96B4BC;line-height:1.6}
.step .when{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--teal-lt);margin-top:12px;display:block}

/* ---------- availability widget ---------- */
.avail{background:#fff;border:1px solid var(--line);border-radius:22px;padding:clamp(22px,3vw,36px);
  box-shadow:var(--sh-sm)}
.pick{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 6px}
.pick button{font-family:var(--mono);font-size:11.5px;letter-spacing:.07em;padding:9px 15px;
  border-radius:100px;border:2px solid var(--line);background:#fff;cursor:pointer;color:var(--slate);
  transition:.28s}
.pick button:hover{border-color:var(--teal-lt);color:var(--teal-dk)}
.pick button.on{background:var(--ink);border-color:var(--ink);color:#fff}
.avail .hint{font-family:var(--mono);font-size:11px;color:var(--slate);letter-spacing:.05em}

/* ---------- covid band ---------- */
#covid{background:var(--g-cool);color:#fff;position:relative;overflow:hidden}
#covid::after{content:"";position:absolute;inset:0;
  background:radial-gradient(620px 400px at 88% 10%,rgba(255,255,255,.16),transparent 62%)}
#covid .wrap{position:relative;z-index:2}
#covid .h2{color:#fff}
#covid .sub{color:rgba(255,255,255,.86)}
.covid-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(26px,4vw,62px);align-items:center}

@media(max-width:1080px){
  .fmt-grid{grid-template-columns:repeat(2,1fr)}
  .steps{grid-template-columns:repeat(2,1fr);row-gap:30px}
  .steps::before{display:none}
}
@media(max-width:940px){
  .phead-grid,.explorer,.covid-grid{grid-template-columns:1fr}
  .exp-panel{min-height:0}
  .exp-list{grid-template-columns:repeat(2,1fr);display:grid}
  .exp-item.on{transform:none}
  .mx-row{grid-template-columns:1fr 1fr}
  .mx-row.head{display:none}
  .mx-row>div{padding:12px 15px}
  .mx-row>div:nth-child(1){grid-column:1/-1;background:var(--mist)}
}
@media(max-width:600px){
  .fmt-grid,.steps,.exp-cols,.qstats{grid-template-columns:1fr}
  .exp-list{grid-template-columns:1fr}
  .mx-row{grid-template-columns:1fr}
}

/* ==========================================================
   SHARED PATCH — navigation, responsiveness, overflow guards
   ========================================================== */

/* anchor targets clear the sticky header */
section[id],div[id]{scroll-margin-top:86px}

/* long headline words must never push the page sideways */
.h1,.h2,.h3,.exp-title,.faq-q{overflow-wrap:break-word}
.h1 .word{max-width:100%}

/* ---------- mobile drawer ---------- */
#navScrim{position:fixed;inset:0;z-index:148;background:rgba(8,32,41,.5);backdrop-filter:blur(3px);
  opacity:0;visibility:hidden;transition:opacity .38s,visibility .38s}
#navScrim.on{opacity:1;visibility:visible}
#drawer{padding:104px 26px 32px}
#drawer .d-head{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--slate);margin:0 0 6px}
#drawer a{display:block;padding:14px 0;border-bottom:1px solid var(--line);
  font-family:var(--display);font-weight:600;font-size:17.5px;transition:color .22s,padding-left .22s}
#drawer a:hover,#drawer a:focus-visible{color:var(--teal-dk);padding-left:5px}
#drawer a.on{color:var(--teal-dk)}
.d-actions{display:grid;gap:9px;margin-top:22px}
.d-actions a{display:flex!important;align-items:center;justify-content:center;gap:9px;
  border-bottom:none!important;border-radius:100px;padding:13px 18px!important;font-size:14.5px!important;
  font-family:var(--body)!important;font-weight:600!important}
.d-actions a:hover{padding-left:18px!important}
.d-actions .call{background:var(--g-warm);color:#fff}
.d-actions .whats{background:#25D366;color:#fff}
.d-actions svg{width:17px;height:17px;flex:none}
#drawer .d-foot{margin-top:22px;font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;
  color:var(--slate);line-height:1.75}

/* ---------- responsive storage matrix ---------- */
@media(max-width:940px){
  .matrix{border-radius:16px}
  .mx-row{grid-template-columns:1fr;gap:0}
  .mx-row.head{display:none}
  .mx-row{border-bottom:1px solid var(--line)}
  .mx-row:last-child{border-bottom:none}
  .mx-row>div{padding:11px 16px;border-bottom:1px solid var(--line);align-items:flex-start;
    flex-direction:column;gap:4px}
  .mx-row>div:last-child{border-bottom:none}
  .mx-row>div::before{content:attr(data-l);font-family:var(--mono);font-size:9.5px;letter-spacing:.13em;
    text-transform:uppercase;color:var(--slate)}
  .mx-row>div:first-child{background:var(--mist)}
  .mx-row>div:first-child::before{display:none}
}

/* ---------- small-screen refinements ---------- */
@media(max-width:600px){
  .hdr-in{gap:12px}
  .logo img{height:46px}
  #hdr.stuck .logo img{height:40px}
  .eyebrow{font-size:10.5px;letter-spacing:.14em;padding:6px 12px 6px 9px}
  .hero-cta .btn,.d-actions a{width:100%;justify-content:center}
  .hero-tick{gap:12px;font-size:11px}
  .crumb{font-size:10px}
  .tabs{gap:7px}
  .tab{font-size:13.5px;padding:10px 16px}
  .filt{font-size:11px;padding:9px 14px}
  .brand-chip{padding:11px 20px;font-size:13.5px}
  .faq-nav{flex-wrap:wrap;row-gap:12px}
  .dots{margin-left:0;width:100%}
  .acc-hd{font-size:16px;gap:12px}
  .exp-cols{grid-template-columns:1fr}
  .qstat b{font-size:26px}
  .f-btm{flex-direction:column;gap:8px}
  .ro-now{font-size:38px}
  .stage{width:100%}
}
@media(max-width:400px){
  .h1{font-size:31px}
  .h2{font-size:24px}
  .stat b{font-size:30px}
}

/* ==========================================================
   PARALLAX BANDS + PHOTOGRAPHY
   Photos: Unsplash (free licence, no attribution required)
   ========================================================== */

/* NOTE: overflow:hidden must NOT sit on .px itself — it makes the section a scroll
   container, which silently kills position:sticky on descendants (#flowTrack).
   The oversized parallax image is clipped by .px-frame instead. */
.px{position:relative;isolation:isolate}
.px>.px-frame{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.px-frame>.px-bg{position:absolute;left:0;right:0;top:-16%;height:132%;
  background-size:cover;background-position:center;will-change:transform;
  transform:translate3d(0,0,0);backface-visibility:hidden}
.px-frame>.px-veil{position:absolute;inset:0}
.px>*:not(.px-frame){position:relative;z-index:2}
/* Restore the sticky track that the generic rule above would otherwise flatten.
   Scoped to desktop: below 940px the track is deliberately static (see style2.css),
   and this file loads last, so an unscoped rule would override that. */
@media(min-width:941px){#flowTrack{position:sticky;z-index:2}}

/* veils — brand colour sits over the photograph, never raw imagery behind text */
.veil-brand{background:linear-gradient(135deg,rgba(15,168,168,.94) 0%,rgba(46,123,196,.90) 100%)}
.veil-ink{background:linear-gradient(180deg,rgba(10,32,41,.95) 0%,rgba(10,32,41,.88) 55%,rgba(10,32,41,.94) 100%)}
.veil-cool{background:linear-gradient(135deg,rgba(27,63,148,.93) 0%,rgba(46,123,196,.88) 100%)}
.veil-deep{background:linear-gradient(180deg,rgba(10,32,41,.86) 0%,rgba(10,32,41,.70) 45%,rgba(10,32,41,.90) 100%)}
.veil-light{background:linear-gradient(180deg,rgba(247,253,253,.90) 0%,rgba(255,255,255,.93) 60%,rgba(255,255,255,.99) 100%)}
.veil-teal-soft{background:linear-gradient(135deg,rgba(6,121,123,.92) 0%,rgba(15,168,168,.86) 100%)}

/* ---------- statement band ---------- */
.state{padding-block:clamp(84px,11vw,168px);text-align:center;color:#fff}
.state .px-in{max-width:900px;margin:0 auto;padding-inline:var(--gut)}
.state .mark{font-family:var(--mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--teal-lt);margin:0 0 22px;display:block}
.state h2{font-family:var(--display);font-weight:700;font-size:clamp(28px,4.4vw,54px);
  line-height:1.14;letter-spacing:-.03em;margin:0;color:#fff}
.state h2 em{font-style:normal;color:var(--amber)}
.state p{color:rgba(255,255,255,.82);font-size:clamp(15.5px,1.5vw,18px);margin:22px auto 0;max-width:62ch}
.state .line{width:100%;max-width:520px;height:34px;margin:30px auto 0;display:block;overflow:visible}
.state .line path{fill:none;stroke-linecap:round;stroke-linejoin:round}
.state .line .b{stroke:rgba(255,255,255,.22);stroke-width:1.4}
.fx .state .line .f{stroke:var(--amber);stroke-width:2.2;stroke-dasharray:900;stroke-dashoffset:900;
  transition:stroke-dashoffset 2.2s var(--ease)}
.state.in .line .f{stroke-dashoffset:0}
.state .kpis{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(24px,5vw,64px);margin-top:44px}
.state .kpi b{display:block;font-family:var(--display);font-weight:800;font-size:clamp(28px,3.6vw,44px);
  line-height:1;letter-spacing:-.035em;color:#fff}
.state .kpi span{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.16em;
  text-transform:uppercase;color:rgba(255,255,255,.72);margin-top:10px}

/* ---------- hero photo wash ---------- */
#hero>.hero-photo{position:absolute;inset:0;z-index:0;background-size:cover;background-position:center 30%;
  opacity:.20;will-change:transform;filter:saturate(.85)}
#hero>.hero-wash{position:absolute;inset:0;z-index:0;pointer-events:none;
  background:linear-gradient(100deg,rgba(255,255,255,.96) 0%,rgba(255,255,255,.86) 38%,rgba(255,255,255,.55) 68%,rgba(255,255,255,.72) 100%)}
#hero>.wrap{z-index:3}
#net{z-index:1!important}

/* ---------- products page head photo ---------- */
#phead .px-bg{opacity:.34;filter:saturate(.8)}

/* ---------- capability / therapy photo cards ---------- */
.shot{position:relative;border-radius:18px;overflow:hidden;aspect-ratio:16/10;background:var(--teal-pale)}
.shot img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.shot:hover img{transform:scale(1.06)}
.shot figcaption{position:absolute;left:0;right:0;bottom:0;padding:30px 18px 14px;color:#fff;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;
  background:linear-gradient(transparent,rgba(8,32,41,.85))}
.shot-pair{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:22px}

@media(max-width:940px){
  .px-frame>.px-bg{top:-10%;height:120%}
  .shot-pair{grid-template-columns:1fr}
  #hero>.hero-wash{background:linear-gradient(180deg,rgba(255,255,255,.94) 0%,rgba(255,255,255,.88) 55%,rgba(255,255,255,.95) 100%)}
  #hero>.hero-photo{opacity:.14}
}
@media(prefers-reduced-motion:reduce){
  .px-frame>.px-bg,#hero>.hero-photo{transform:none!important}
  .state .line .f{stroke-dashoffset:0}
}


/* ---------- legibility over photography ---------- */
#flow .px-veil{background:linear-gradient(180deg,rgba(10,32,41,.96) 0%,rgba(10,32,41,.93) 50%,rgba(10,32,41,.97) 100%)}
#flow .stage{background:rgba(18,49,61,.82);border-color:rgba(255,255,255,.16);
  backdrop-filter:blur(6px);box-shadow:0 20px 50px rgba(0,0,0,.28)}
#flow .stage.hot{background:rgba(40,42,42,.86);border-color:rgba(242,101,34,.62)}
#flow .stage p{color:#A8C4CC}
#reach .px-veil{background:linear-gradient(180deg,rgba(10,32,41,.95) 0%,rgba(10,32,41,.90) 50%,rgba(10,32,41,.96) 100%)}
#ordering .px-veil{background:linear-gradient(180deg,rgba(10,32,41,.95) 0%,rgba(10,32,41,.91) 100%)}
#ordering .step .n{background:rgba(18,49,61,.9)}

/* ==========================================================
   CERTIFICATIONS, TEAM, GALLERY, CONTACT — added Oct 2026
   ========================================================== */

/* ---------- certification cards ---------- */
.certs{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:28px}
.cert{display:grid;grid-template-columns:172px 1fr;gap:20px;background:#fff;border:1px solid var(--line);
  border-radius:20px;padding:20px;transition:transform .38s var(--ease),box-shadow .38s,border-color .38s}
.cert:hover{transform:translateY(-6px);box-shadow:var(--sh-md);border-color:transparent}
.cert .shotwrap{margin:0;position:relative;border-radius:12px;overflow:hidden;border:1px solid var(--line);
  background:var(--mist);cursor:zoom-in;aspect-ratio:3/4}
.cert .shotwrap img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .7s var(--ease)}
.cert .shotwrap:hover img{transform:scale(1.05)}
.cert .shotwrap::after{content:"View";position:absolute;left:0;right:0;bottom:0;padding:16px 8px 7px;
  text-align:center;font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;
  color:#fff;background:linear-gradient(transparent,rgba(8,32,41,.85));opacity:0;transition:opacity .3s}
.cert .shotwrap:hover::after{opacity:1}
.cert h3{font-family:var(--display);font-weight:700;font-size:20px;letter-spacing:-.02em;margin:0 0 4px}
.cert .issuer{font-family:var(--mono);font-size:11px;letter-spacing:.09em;color:var(--teal-dk);margin:0 0 12px}
.cert p{margin:0 0 14px;font-size:14px;color:var(--slate);line-height:1.6}
.cert dl{display:grid;grid-template-columns:auto 1fr;gap:5px 14px;margin:0;font-size:13px}
.cert dt{font-family:var(--mono);font-size:10px;letter-spacing:.11em;text-transform:uppercase;
  color:var(--slate);align-self:center}
.cert dd{margin:0;font-weight:500}
.cert .verify{display:inline-flex;align-items:center;gap:7px;margin-top:14px;font-family:var(--mono);
  font-size:11px;letter-spacing:.06em;color:var(--teal-dk);border-bottom:1px solid var(--teal-lt);
  padding-bottom:2px}
.cert .verify:hover{color:var(--orange);border-color:var(--orange)}
.cert-note{display:flex;gap:13px;align-items:flex-start;background:var(--peach);border:1px solid #FBD9C4;
  border-radius:16px;padding:16px 19px;margin-top:16px;font-size:14.5px;color:#8A3D0B}
.cert-note svg{width:19px;height:19px;flex:none;margin-top:2px;color:var(--orange)}
.f-cert{display:flex;gap:7px;margin:14px 0 0;flex-wrap:wrap}
.f-cert span{font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;border:1px solid rgba(255,255,255,.22);
  color:#BFE3E6;padding:5px 10px;border-radius:100px}

/* ---------- principal groups ---------- */
.pgroups{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;margin-top:28px}
.pgroup{background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px 22px}
.pgroup.lead{grid-column:span 3}
.pgroup h3{font-family:var(--display);font-weight:700;font-size:18px;margin:0 0 4px}
.pgroup .cnt{font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:var(--teal-dk);display:block;margin-bottom:6px}
.pgroup p{margin:0 0 16px;font-size:13.5px;color:var(--slate);line-height:1.6}
.plist{display:flex;flex-wrap:wrap;gap:7px}
.plist span{font-size:13px;background:var(--mist);border:1px solid var(--line);padding:7px 13px;
  border-radius:100px;transition:.28s}
.plist span:hover{border-color:var(--teal-lt);color:var(--teal-dk);transform:translateY(-2px)}
.pgroup.lead .plist span{background:#fff}

/* ---------- team ---------- */
.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:28px}
.tcard{background:#fff;border:1px solid var(--line);border-radius:20px;padding:26px 22px;
  transition:transform .4s var(--ease),box-shadow .4s,border-color .4s;position:relative;overflow:hidden}
.tcard::after{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--g-brand);
  transform:scaleX(0);transform-origin:left;transition:transform .5s}
.tcard:hover{transform:translateY(-7px);box-shadow:var(--sh-md);border-color:transparent}
.tcard:hover::after{transform:scaleX(1)}
.tcard .av{width:54px;height:54px;border-radius:15px;display:grid;place-items:center;color:#fff;
  font-family:var(--display);font-weight:800;font-size:19px;margin-bottom:16px;transition:transform .45s var(--ease)}
.tcard:hover .av{transform:rotate(-7deg) scale(1.06)}
.av-teal{background:var(--g-mint)}.av-cool{background:var(--g-cool)}.av-warm{background:var(--g-warm)}
.tcard h3{font-family:var(--display);font-weight:700;font-size:18px;margin:0 0 3px}
.tcard .role{font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;
  color:var(--teal-dk);margin:0 0 11px}
.tcard p{margin:0;font-size:14px;color:var(--slate);line-height:1.6}
.deskcard{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:18px;overflow:hidden;margin-top:24px}
.deskcard>div{background:#fff;padding:22px 20px}
.deskcard b{display:block;font-family:var(--display);font-weight:600;font-size:15.5px;margin-bottom:5px}
.deskcard span{font-family:var(--mono);font-size:11px;color:var(--slate);letter-spacing:.05em;line-height:1.7;display:block}
.deskcard a{color:var(--teal-dk);border-bottom:1px solid var(--teal-lt)}
.deskcard a:hover{color:var(--orange);border-color:var(--orange)}

/* ---------- gallery filters ---------- */
.gal-filters{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.galf{font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;padding:10px 17px;
  border-radius:100px;border:2px solid var(--line);background:#fff;cursor:pointer;color:var(--slate);transition:.3s}
.galf:hover{border-color:var(--teal-lt);color:var(--teal-dk)}
.galf.on{background:var(--ink);border-color:var(--ink);color:#fff}

/* ---------- contact page ---------- */
.offices{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:28px}
.office{background:#fff;border:1px solid var(--line);border-radius:20px;padding:26px 24px;transition:.38s;
  position:relative;overflow:hidden}
.office:hover{transform:translateY(-6px);box-shadow:var(--sh-md);border-color:transparent}
.office .badge2{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:10px;
  letter-spacing:.14em;text-transform:uppercase;background:var(--teal-pale);color:var(--teal-dk);
  padding:6px 12px;border-radius:100px;margin-bottom:14px}
.office h3{font-family:var(--display);font-weight:700;font-size:19px;margin:0 0 9px}
.office address{font-style:normal;font-size:14.5px;color:var(--slate);line-height:1.75;margin-bottom:14px}
.office .row2{display:flex;gap:10px;flex-wrap:wrap}
.mapwrap{margin-top:16px;border-radius:20px;overflow:hidden;border:1px solid var(--line);background:var(--mist)}
.mapwrap iframe{display:block;width:100%;height:380px;border:0}
.routes{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:26px}
.route{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--line);
  border-radius:16px;padding:18px 20px;transition:.3s}
.route:hover{border-color:var(--teal-lt);transform:translateY(-4px);box-shadow:var(--sh-sm)}
.route .ico{width:40px;height:40px;border-radius:12px;background:var(--teal-pale);color:var(--teal-dk);
  display:grid;place-items:center;flex:none}
.route .ico svg{width:18px;height:18px}
.route b{display:block;font-family:var(--display);font-weight:600;font-size:15px;margin-bottom:2px}
.route small{display:block;font-size:13.5px;color:var(--slate);line-height:1.55}
.route .tagm{font-family:var(--mono);font-size:10px;letter-spacing:.11em;text-transform:uppercase;
  color:var(--orange);display:block;margin-top:5px}

/* ---------- misc ---------- */
.lede-2{font-size:clamp(16px,1.4vw,18px);color:var(--slate);max-width:64ch;margin:0}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:clamp(26px,4vw,58px);align-items:start}
.anchor-nav{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.anchor-nav a{font-family:var(--mono);font-size:11.5px;letter-spacing:.07em;padding:9px 15px;
  border-radius:100px;border:1px solid var(--line);background:#fff;color:var(--slate);transition:.28s}
.anchor-nav a:hover{border-color:var(--teal);color:var(--teal-dk);transform:translateY(-2px)}

@media(max-width:1080px){
  .pgroups{grid-template-columns:1fr}
  .pgroup.lead{grid-column:auto}
  .team-grid,.deskcard{grid-template-columns:1fr 1fr}
}
@media(max-width:940px){
  .certs,.offices,.two-col,.routes{grid-template-columns:1fr}
}
@media(max-width:600px){
  .cert{grid-template-columns:1fr}
  .cert .shotwrap{max-width:200px}
  .team-grid,.deskcard{grid-template-columns:1fr}
  .mapwrap iframe{height:300px}
}

/* ---------- footer certification links ---------- */
.f-cert{display:flex;gap:8px;margin:14px 0 0;flex-wrap:wrap}
.f-cert a{display:inline-flex;align-items:center;gap:7px;padding:6px 12px;border-radius:100px;
  border:1px solid rgba(255,255,255,.22);font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;
  color:#BFE3E6;transition:.28s}
.f-cert a:hover{border-color:var(--teal-lt);color:#fff;background:rgba(63,208,208,.12);transform:none}
.f-cert .vf{color:var(--teal-lt);border-bottom:1px solid currentColor;padding-bottom:1px}
.f-cert a:hover .vf{color:var(--amber)}
.f-social{font-family:var(--mono);font-size:10.5px;letter-spacing:.07em;color:#6E8C95;margin:14px 0 0}

/* ==========================================================
   TURNOVER — annual figures, Oct 2026
   One series, one hue. The part-year bar is the same entity
   with incomplete data, so it keeps the brand colour family
   but carries a hatch + an explicit label: it must never read
   as a decline against the five complete years beside it.
   ========================================================== */
.turn-grid{display:grid;grid-template-columns:.78fr 1.22fr;gap:clamp(24px,4vw,56px);
  align-items:center;margin-top:28px}
.turn-hero{background:#fff;border:1px solid var(--line);border-radius:22px;
  padding:clamp(24px,3vw,34px);box-shadow:var(--sh-sm)}
.turn-hero .lbl{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--teal-dk);margin:0 0 10px}
.turn-hero .big{font-family:var(--display);font-weight:800;letter-spacing:-.04em;
  line-height:1;font-size:clamp(44px,6vw,68px);color:var(--ink);display:flex;
  align-items:baseline;gap:4px;white-space:nowrap}
.turn-hero .big .cur{font-size:.42em;font-weight:700;color:var(--teal-dk)}
.turn-hero .big .un{font-size:.34em;font-weight:700;color:var(--slate);letter-spacing:0}
.turn-hero .cap{font-size:14.5px;color:var(--slate);margin:16px 0 0;line-height:1.62;max-width:46ch}
.turn-hero .facts{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);
  border-radius:14px;overflow:hidden;margin-top:18px}
.turn-hero .facts div{background:#fff;padding:13px 16px;display:flex;justify-content:space-between;
  align-items:baseline;gap:14px}
.turn-hero .facts dt,.turn-hero .facts span.k{font-family:var(--mono);font-size:10px;
  letter-spacing:.11em;text-transform:uppercase;color:var(--slate)}
.turn-hero .facts b{font-family:var(--display);font-weight:700;font-size:16px;letter-spacing:-.02em}

/* ---- the plot ---- */
.chartcard{background:#fff;border:1px solid var(--line);border-radius:22px;
  padding:clamp(22px,2.8vw,32px);box-shadow:var(--sh-sm)}
.chart-hd{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;
  flex-wrap:wrap;margin-bottom:6px}
.chart-hd h3{font-family:var(--display);font-weight:700;font-size:18px;letter-spacing:-.02em;margin:0}
.chart-hd p{margin:4px 0 0;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--slate)}
.chart-key{display:flex;gap:16px;flex-wrap:wrap;font-family:var(--mono);font-size:10.5px;
  letter-spacing:.08em;color:var(--slate)}
.chart-key span{display:flex;align-items:center;gap:7px}
.chart-key i{width:13px;height:13px;border-radius:3px;flex:none}
.chart-key i.full{background:var(--teal)}
.chart-key i.part{background:var(--orange);
  background-image:repeating-linear-gradient(135deg,rgba(255,255,255,.55) 0 2px,transparent 2px 5px)}

.bars{display:grid;grid-template-columns:repeat(6,1fr);gap:clamp(8px,1.4vw,18px);
  align-items:end;height:290px;margin-top:22px;padding-top:26px;position:relative}
.bars::before,.bars::after{content:"";position:absolute;left:0;right:0;height:1px;
  background:var(--line);pointer-events:none}
.bars::before{top:26px}
.bars::after{bottom:0}
.bar{position:relative;height:100%;display:flex;flex-direction:column;justify-content:flex-end;
  cursor:default}
.bar .v{font-family:var(--display);font-weight:700;font-size:clamp(12px,1.15vw,15px);
  letter-spacing:-.02em;text-align:center;margin-bottom:8px;color:var(--ink);
  opacity:0;transform:translateY(6px);transition:opacity .5s var(--ease),transform .5s var(--ease)}
.bar .col{width:100%;height:0;border-radius:5px 5px 0 0;background:var(--teal);
  transition:height 1.1s var(--ease),background .25s;position:relative}
.bar.part .col{background:var(--orange);
  background-image:repeating-linear-gradient(135deg,rgba(255,255,255,.55) 0 2px,transparent 2px 5px)}
.bar:hover .col{background:var(--teal-dk)}
.bar.part:hover .col{background:#D9541A}
.bar .yr{font-family:var(--mono);font-size:clamp(9.5px,.85vw,11px);letter-spacing:.06em;
  text-align:center;color:var(--slate);margin-top:10px;white-space:nowrap}
.bar .yr em{font-style:normal;display:block;color:var(--orange);font-size:.92em;margin-top:3px}
.in .bar .v{opacity:1;transform:none}
.bar .tip{position:absolute;bottom:100%;left:50%;transform:translateX(-50%) translateY(-6px);
  background:var(--ink);color:#fff;font-size:12.5px;line-height:1.45;white-space:nowrap;
  padding:9px 13px;border-radius:9px;opacity:0;visibility:hidden;pointer-events:none;
  box-shadow:var(--sh-md);transition:opacity .22s,visibility .22s,transform .22s var(--ease);z-index:5}
.bar .tip b{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.06em;
  color:var(--teal-lt);font-weight:500;margin-bottom:2px}
.bar:hover .tip{opacity:1;visibility:visible;transform:translateX(-50%) translateY(-10px)}
.chart-note{display:flex;gap:12px;align-items:flex-start;margin-top:20px;padding-top:18px;
  border-top:1px solid var(--line);font-size:13.5px;color:var(--slate);line-height:1.6}
.chart-note svg{width:17px;height:17px;flex:none;margin-top:2px;color:var(--teal-dk)}

/* table fallback — the contrast WARN on the brand teal obliges a readable
   alternative to colour, and procurement readers copy numbers out anyway */
.turn-table{width:100%;border-collapse:collapse;margin-top:20px;font-size:14px}
.turn-table caption{text-align:left;font-family:var(--mono);font-size:10px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--slate);padding-bottom:10px}
.turn-table th,.turn-table td{text-align:right;padding:10px 12px;border-bottom:1px solid var(--line)}
.turn-table th:first-child,.turn-table td:first-child{text-align:left}
.turn-table thead th{font-family:var(--mono);font-size:10px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--slate);font-weight:500}
.turn-table tbody td{font-variant-numeric:tabular-nums}
.turn-table tbody tr:last-child td{border-bottom:none;color:var(--orange);font-weight:600}
.turn-toggle{margin-top:14px;font-family:var(--mono);font-size:11px;letter-spacing:.08em;
  color:var(--teal-dk);background:none;border:none;border-bottom:1px solid var(--teal-lt);
  padding:0 0 2px;cursor:pointer}
.turn-toggle:hover{color:var(--orange);border-color:var(--orange)}

@media(max-width:940px){
  .turn-grid{grid-template-columns:1fr}
  .bars{height:240px}
}
@media(max-width:600px){
  .bars{height:210px;gap:6px}
  .bar .v{font-size:10.5px}
  .bar .yr{font-size:8.5px}
  .chart-hd{flex-direction:column;gap:10px}
}


/* ---------- header: narrow-desktop band ----------
   Between the drawer breakpoint (940px) and ~1100px the six nav links plus
   the phone button no longer clear the enlarged logo, and the nav wrapped
   onto three rows. The links are the navigation and must stay; the phone
   button steps out here — the number is still in the footer, and below
   940px the drawer carries its own Call button. */
@media(max-width:1100px) and (min-width:941px){
  .nav .btn{display:none}
  .nav>a{padding:9px 10px;font-size:14px}
  .hdr-in{gap:14px}
}
@media(max-width:1020px) and (min-width:941px){
  .nav>a{padding:8px 8px;font-size:13.5px}
  .logo img{height:56px}
  #hdr.stuck .logo img{height:48px}
}


/* ==========================================================
   19 Oct 2026 — six-stat band, three branches, sales + CFA split
   ========================================================== */
.stat b .u{font-style:normal;font-size:.42em;font-weight:700;margin-left:4px;letter-spacing:0;opacity:.9}
.nw{white-space:nowrap}
@media(max-width:600px){
  .stat-grid{grid-template-columns:repeat(2,1fr);gap:26px 14px}
  .stat:nth-child(3n)::after{display:block}
  .stat:nth-child(2n)::after{display:none}
  .stat b{font-size:30px}
}

/* ---- offices: three cards ---- */
.offices{grid-template-columns:repeat(3,1fr)}
@media(max-width:1080px){.offices{grid-template-columns:1fr 1fr}.offices .office:first-child{grid-column:1/-1}}
@media(max-width:700px){.offices{grid-template-columns:1fr}}
.f-br{display:block;margin-top:6px;font-family:var(--mono);font-size:10.5px;letter-spacing:.07em;color:#8FB0B8}

/* ---- sales + CFA composition bar ----
   Two segments of one whole. Teal = our sales, #314CA4 (a stop in the logo's
   own blue gradient) = CFA operations. Validated: normal-vision dE 26.6,
   worst CVD dE 25.2. The teal contrast warning is relieved by a value label
   printed inside both segments, plus the key. */
.splitcard{background:#fff;border:1px solid var(--line);border-radius:22px;
  padding:clamp(22px,2.8vw,32px);box-shadow:var(--sh-sm);margin-top:18px}
.split-hd{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;flex-wrap:wrap}
.split-hd h3{font-family:var(--display);font-weight:700;font-size:18px;letter-spacing:-.02em;margin:0}
.split-hd p{margin:4px 0 0;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--slate)}
.chart-key i.k-own{background:var(--teal)}
.chart-key i.k-cfa{background:#314CA4}
.splitbar{display:flex;gap:2px;height:78px;margin-top:20px;border-radius:12px;overflow:hidden;background:var(--mist)}
.splitbar .seg{flex:0 0 var(--w);min-width:0;display:flex;flex-direction:column;justify-content:center;
  padding:0 18px;color:#fff;overflow:hidden;white-space:nowrap;transition:flex-basis 1.2s var(--ease)}
.splitbar .seg.s-own{background:var(--teal)}
.splitbar .seg.s-cfa{background:#314CA4}
.splitbar .seg b{font-family:var(--display);font-weight:800;font-size:clamp(17px,2vw,24px);letter-spacing:-.025em;line-height:1.1}
.splitbar .seg span{font-family:var(--mono);font-size:10px;letter-spacing:.11em;text-transform:uppercase;
  opacity:.92;margin-top:4px}
.fx .splitcard:not(.in) .seg{flex-basis:0}
.split-ft{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:20px;padding-top:18px;
  border-top:1px solid var(--line)}
.split-ft p{margin:0;font-size:13.5px;color:var(--slate);line-height:1.6}
.split-ft strong{color:var(--ink);font-weight:600}
@media(max-width:700px){
  .split-ft{grid-template-columns:1fr}
  .splitbar{height:auto;flex-direction:column;border-radius:12px}
  .splitbar .seg{flex:none;width:100%;padding:14px 16px}
  .fx .splitcard:not(.in) .seg{flex-basis:auto;opacity:0}
}

/* radar: a branch is a place we operate from, not a territory we serve —
   square + orange, matching the Bangalore hub rather than the teal territory dots */
.mk.br rect.d{fill:var(--orange);transition:.3s}
.mk.br:hover rect.d,.mk.br.on rect.d{fill:var(--amber)}
.terr-row.br u{background:var(--orange);border-radius:2px}

/* therapy explorer: replaces the inferred "Supplied by" chips */
.supp-cta{margin:18px 0 0}
.supp-cta a{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:11.5px;
  letter-spacing:.07em;color:var(--teal-dk);border-bottom:1px solid var(--teal-lt);padding-bottom:2px;transition:.25s}
.supp-cta a:hover{color:var(--orange);border-color:var(--orange)}
.supp-cta svg{width:13px;height:13px;transition:transform .25s}
.supp-cta a:hover svg{transform:translateX(3px)}

/* principal groups: two relationship cards under the lead card (group-company card removed) */
.pgroups{grid-template-columns:1fr 1fr}
.pgroup.lead{grid-column:1/-1}
@media(max-width:1080px){.pgroups{grid-template-columns:1fr}}

/* map: open-in-app link sits on the map's bottom edge */
.mapwrap{position:relative}
.map-open{position:absolute;right:14px;bottom:14px;display:inline-flex;align-items:center;gap:7px;
  background:#fff;color:var(--ink);font-size:13px;font-weight:600;padding:9px 14px;border-radius:100px;
  box-shadow:var(--sh-md);transition:.25s}
.map-open:hover{background:var(--ink);color:#fff}
.map-open svg{width:13px;height:13px}
.maplink{color:var(--teal-dk);font-family:var(--mono);font-size:11px;letter-spacing:.05em}

/* Home enquiry card: the map takes whatever height the contact list leaves,
   so both columns end level instead of the card trailing empty space */
.enq-card{display:flex;flex-direction:column}
.enq-map{position:relative;flex:1 1 auto;min-height:240px;margin-top:22px;border-radius:16px;
  overflow:hidden;border:1px solid var(--line);background:var(--mist)}
.enq-map iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
@media(max-width:940px){.enq-map{flex:none;height:280px}}

/* ==========================================================
   FUNCTION HEADS — Oct 21 2026 (from client's details.docx)
   ========================================================== */
.heads{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:28px;align-items:stretch}
.head-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:26px 24px 24px;
  display:flex;flex-direction:column;position:relative;overflow:hidden;
  transition:transform .4s var(--ease),box-shadow .4s,border-color .4s}
.head-card::after{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--g-brand);
  transform:scaleX(0);transform-origin:left;transition:transform .5s}
.head-card:hover{transform:translateY(-6px);box-shadow:var(--sh-md);border-color:transparent}
.head-card:hover::after{transform:scaleX(1)}
.hc-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
.head-card .av{width:54px;height:54px;border-radius:15px;display:grid;place-items:center;color:#fff;flex:none;
  font-family:var(--display);font-weight:800;font-size:19px;transition:transform .45s var(--ease)}
.head-card:hover .av{transform:rotate(-7deg) scale(1.06)}
.hc-team{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--slate);
  background:var(--mist);border:1px solid var(--line);border-radius:100px;padding:6px 12px;white-space:nowrap}
.hc-team b{font-family:var(--display);font-size:14px;letter-spacing:-.01em;color:var(--teal-dk);margin-right:2px}
.head-card h3{font-family:var(--display);font-weight:700;font-size:20px;letter-spacing:-.02em;margin:0 0 4px}
.head-card .role{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--teal-dk);margin:0 0 14px;line-height:1.6}
.hc-desc{margin:0;font-size:14.5px;color:var(--slate);line-height:1.65}
.hc-kr{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);
  font-weight:500;margin:20px 0 10px;padding-top:16px;border-top:1px solid var(--line)}
.hc-list{display:grid;gap:9px;margin:0;padding:0;list-style:none}
.hc-list li{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;color:var(--slate);line-height:1.55}
.hc-list li svg{width:14px;height:14px;flex:none;margin-top:3px;color:var(--teal);
  background:var(--teal-pale);border-radius:50%;padding:3px;box-sizing:content-box}
.hc-list b{color:var(--ink);font-weight:600}
.team-sum{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:18px;overflow:hidden;margin-top:18px}
.team-sum>div{background:#fff;padding:20px 22px}
.team-sum>div:first-child{background:var(--ink);color:#fff}
.team-sum b{display:block;font-family:var(--display);font-weight:800;font-size:28px;letter-spacing:-.03em;line-height:1}
.team-sum>div:first-child b{color:var(--teal-lt)}
.team-sum span{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--slate);margin-top:8px}
.team-sum>div:first-child span{color:#9CB8C0}
@media(max-width:1080px){.heads{grid-template-columns:1fr 1fr}.heads .head-card:last-child{grid-column:1/-1}}
@media(max-width:760px){
  .heads{grid-template-columns:1fr}.heads .head-card:last-child{grid-column:auto}
  .team-sum{grid-template-columns:1fr 1fr}.team-sum>div:first-child{grid-column:1/-1}
}

/* ---------- keyboard focus (Oct 21) ---------- */
.acc-hd:focus-visible,.band:focus-visible,.gal figure:focus-visible,.shotwrap:focus-visible,
button:focus-visible,a:focus-visible{outline:2px solid var(--teal);outline-offset:3px;border-radius:6px}

/* ---------- leadership award badge (Oct 22) ---------- */
.award{display:flex;align-items:center;gap:13px;margin:18px 0 4px;padding:12px 16px;border-radius:14px;
  background:linear-gradient(135deg,rgba(242,101,34,.10),rgba(247,147,30,.06));border:1px solid rgba(242,101,34,.22)}
.award .aw-ico{flex:none;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;
  background:var(--g-warm);color:#fff}
.award .aw-ico svg{width:20px;height:20px}
.award b{display:block;font-family:Sora,sans-serif;font-size:15px;color:var(--navy,#1F2C7A)}
.award small{display:block;font-family:"IBM Plex Mono",monospace;font-size:11.5px;letter-spacing:.04em;color:#6b7280;margin-top:2px}
/* hero headline is longer since Oct 22 — keep it to a calmer size on desktop */
@media (min-width:941px){#hero .h1{font-size:clamp(44px,4.1vw,60px)}}
.award .nw{white-space:nowrap}

/* turnover tooltips: edge bars anchor inward so tips never run off a phone screen (Oct 22) */
@media (max-width:760px){
  .bar .tip{white-space:normal;width:max-content;max-width:180px}
  .bars > .bar:nth-child(-n+3) .tip{left:0;transform:translateY(-6px)}
  .bars > .bar:nth-child(-n+3):hover .tip{transform:translateY(-10px)}
  .bars > .bar:nth-child(n+4) .tip{left:auto;right:0;transform:translateY(-6px)}
  .bars > .bar:nth-child(n+4):hover .tip{transform:translateY(-10px)}
}
/* smallest phones (320px): long emails and chart labels must not force the layout wider than the screen (Oct 22) */
.contact-grid>*,.turn-grid>*,.cinfo>a>span,.route>span{min-width:0}
.cinfo b,.route b,.cinfo small,.route small{overflow-wrap:break-word}
.bars>.bar{min-width:0}
@media (max-width:360px){.bar .v{font-size:9.5px;letter-spacing:0}.bar .yr{font-size:8.5px;letter-spacing:0}}
@media (max-width:940px){.hero-cta .btn{text-align:center}}