/* UnityPulse site styles. Mobile first; tablet from 640px; desktop from 1024px. */

/* ---------- Fonts (self-hosted, latin subset, variable) ---------- */
@font-face{font-family:"Plus Jakarta Sans";font-style:normal;font-weight:200 800;font-display:swap;src:url(../fonts/PlusJakartaSans-latin.woff2) format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:100 900;font-display:swap;src:url(../fonts/Inter-latin.woff2) format("woff2")}

/* ---------- Tokens ---------- */
:root{
  --primary:#184977;--primary-2:#0F3358;--primary-tint:#E9F0F7;--primary-soft:#D3E1F0;
  --ink:#0F1720;--text:#1F2933;--muted:#5B6570;--faint:#8B95A1;
  --bg:#FFFFFF;--band:#F4F6F9;--line:#E4E8ED;--line-2:#CBD2DA;
  --note:#FFF1A8;--ok:#22A06B;--warn:#B54A1E;
  --tscribe:#E0683A;--tscribe-text:#B54A1E;--tscribe-tint:#FDEEE6;--ureport:#2563EB;--ureport-text:#1D4FC4;--ureport-tint:#E6EEFD;
  --font-head:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-body:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --r:8px;--r-lg:16px;--r-xl:24px;
  --shadow-float:0 30px 60px -24px rgba(15,23,32,.22),0 8px 18px -10px rgba(15,23,32,.12);
  --shadow-real:0 1px 1px rgba(15,23,32,.04),0 2px 4px rgba(15,23,32,.04),0 8px 16px -4px rgba(15,23,32,.08),0 24px 48px -12px rgba(15,23,32,.18),0 48px 80px -24px rgba(24,73,119,.16);
  --ease-out:cubic-bezier(.23,1,.32,1);--ease-in-out:cubic-bezier(.77,0,.175,1);
  --wrap:1200px;--gutter:20px;
}

/* ---------- Reset and base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font-family:var(--font-body);font-size:16px;line-height:1.6;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,h4,h5{font-family:var(--font-head);color:var(--ink);letter-spacing:-.025em;line-height:1.1;font-weight:700;margin:0}
h1{font-weight:800;letter-spacing:-.035em;line-height:1.04}
.lt{color:var(--faint);font-weight:inherit}
p{margin:0}
p+p{margin-top:1em}
a{color:inherit;text-decoration:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
button,input,select,textarea{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
h1,h2,h3{text-wrap:balance}
p,li{text-wrap:pretty}
[id]{scroll-margin-top:84px}
img,svg{display:block;max-width:100%}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
ul,ol{margin:0;padding:0}
:focus-visible{outline:2px solid var(--primary);outline-offset:3px;border-radius:4px}
::selection{background:var(--primary-soft)}
.skip{position:absolute;left:12px;top:-60px;background:var(--ink);color:#fff;padding:10px 14px;border-radius:8px;z-index:100;font-weight:600}
.skip:focus{top:12px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.wrap{width:min(var(--wrap),100% - 2*var(--gutter));margin-inline:auto}
.lede{color:var(--muted)}
.small{font-size:14px;color:var(--muted)}
.muted{color:var(--muted)}
.center{text-align:center}
.link{color:var(--primary);font-weight:600;transition:color 150ms ease}
.link:hover{color:var(--primary-2)}
.link.u{border-bottom:1px solid var(--primary-soft);padding-bottom:1px;transition:border-color 150ms ease}
.link.u:hover{border-color:var(--primary)}
.prose a:not(.btn){color:var(--primary);font-weight:500;border-bottom:1px solid var(--primary-soft)}
.prose a:not(.btn):hover{border-color:var(--primary)}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--font-body);font-weight:600;font-size:15px;line-height:1;padding:15px 22px;border-radius:999px;border:1px solid transparent;white-space:nowrap;cursor:pointer;transition:transform 160ms var(--ease-out),background-color 150ms ease,border-color 150ms ease,box-shadow 150ms ease}
.btn:active{transform:scale(.97)}
.btn-primary{background:var(--primary);color:#fff;box-shadow:0 10px 24px -12px rgba(24,73,119,.6)}
.btn-primary:hover{background:var(--primary-2)}
.btn-ghost{border-color:var(--line-2);color:var(--ink);background:#fff}
.btn-ghost:hover{border-color:var(--faint);background:var(--band)}
.btn-white{background:#fff;color:var(--primary)}
.btn-white:hover{background:var(--primary-tint)}
.btn-outline-white{border-color:rgba(255,255,255,.4);color:#fff}
.btn-outline-white:hover{border-color:#fff;background:rgba(255,255,255,.08)}
.btn-ts{background:var(--tscribe-text);color:#fff}.btn-ts:hover{background:#9E3F17}
.btn-ur{background:var(--ureport);color:#fff}.btn-ur:hover{background:#1D4FC4}
.btn-sm{padding:11px 16px;font-size:14px}
.btn-block{width:100%}
.ext-ic{width:14px;height:14px;display:inline-block;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17L17 7M9 7h8v8'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17L17 7M9 7h8v8'/%3E%3C/svg%3E") center/contain no-repeat}

/* ---------- Header ---------- */
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);transition:box-shadow 200ms ease}
.site-header.scrolled{box-shadow:0 1px 0 var(--line),0 8px 24px -16px rgba(15,23,32,.18)}
.hdr{display:flex;align-items:center;justify-content:space-between;height:64px;gap:16px}
.lockup{display:inline-flex;align-items:center;gap:10px;padding:8px 0;font-family:var(--font-head);font-weight:800;font-size:18px;color:var(--ink);letter-spacing:-.02em}
.lockup img{width:26px;height:26px}
.nav{display:none}
.hdr-actions{display:flex;align-items:center;gap:10px}
.hdr .signin{display:none}
.menu-btn{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:14px;color:var(--ink);border:1px solid var(--line-2);border-radius:999px;padding:9px 12px;background:#fff}
.menu-btn i{width:16px;height:2px;background:var(--ink);box-shadow:0 5px 0 var(--ink),0 -5px 0 var(--ink);display:block}
.hdr .btn-register{display:none}
/* sign-in popover */
.signin{position:relative}
.signin>button{font-weight:600;font-size:15px;color:var(--primary);padding:8px 4px;display:inline-flex;align-items:center;gap:6px}
.signin>button::after{content:"";width:8px;height:8px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px)}
.signin-menu{position:absolute;right:0;top:calc(100% + 8px);width:260px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 20px 40px -16px rgba(15,23,32,.25);padding:6px;transform-origin:top right;opacity:0;transform:scale(.96) translateY(-4px);pointer-events:none;transition:opacity 150ms var(--ease-out),transform 150ms var(--ease-out)}
.signin-menu.open{opacity:1;transform:none;pointer-events:auto}
.signin-menu a{display:block;padding:10px 12px;border-radius:8px;font-size:14px;color:var(--ink)}
.signin-menu a:hover{background:var(--band)}
.signin-menu a small{display:block;color:var(--muted);font-size:12px;font-weight:400}
.signin-menu .sep{height:1px;background:var(--line);margin:6px 8px}
/* mobile sheet */
.sheet{position:fixed;inset:0;z-index:60;visibility:hidden}
.sheet[data-open]{visibility:visible}
.sheet .scrim{position:absolute;inset:0;background:rgba(15,23,32,.3);opacity:0;transition:opacity 200ms ease}
.sheet[data-open] .scrim{opacity:1}
.sheet .panel{position:absolute;top:0;right:0;bottom:0;width:min(360px,88vw);background:#fff;padding:0 max(20px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) 20px;overflow:auto;overscroll-behavior:contain;transform:translateX(100%);transition:transform 260ms cubic-bezier(.32,.72,0,1);box-shadow:-20px 0 60px -30px rgba(15,23,32,.3)}
.sheet[data-open] .panel{transform:none}
.sheet .hdr{border-bottom:1px solid var(--line)}
.sheet nav{padding-top:8px}
.sheet nav a{display:block;padding:14px 0;border-bottom:1px solid var(--line);font-family:var(--font-head);font-weight:700;font-size:20px;letter-spacing:-.02em;color:var(--ink)}
.sheet .sheet-acts{display:grid;gap:8px;margin-top:20px}
.sheet .sheet-sub{margin-top:18px;font-size:13px;color:var(--muted)}
.sheet .sheet-sub a{color:var(--primary);font-weight:600}
.sheet .close-btn{font-weight:600;font-size:14px;border:1px solid var(--line-2);border-radius:999px;padding:9px 12px}

/* ---------- Sections ---------- */
section{padding:60px 0}
.stitle h2{font-size:30px}
.slede{color:var(--muted);font-size:15px;margin-top:12px;max-width:58ch}
.band{background:var(--band)}
.band-rounded{background:var(--band);border-radius:24px 24px 0 0}

/* ---------- Reveal ---------- */
.rv{opacity:0;transform:translateY(14px);transition:opacity 600ms var(--ease-out),transform 600ms var(--ease-out)}
.rv.in{opacity:1;transform:none}
.rv-d1{transition-delay:80ms}.rv-d2{transition-delay:160ms}.rv-d3{transition-delay:240ms}

/* ---------- Hero ---------- */
.hero{position:relative;padding:36px 0 0;overflow:hidden}
.hero .h-text h1{font-size:38px;max-width:14ch}
.hero .h-text .lede{font-size:16px;margin-top:14px;max-width:52ch}
.hero .acts{display:grid;gap:8px;margin-top:22px}
.hero .cluster{position:relative;height:330px;margin-top:32px}
.frag{position:absolute;background:#fff;border-radius:14px;box-shadow:var(--shadow-real);border:1px solid rgba(15,23,32,.06);font-size:13px;color:var(--text);line-height:1.45;will-change:transform}
.frag .t{font-family:var(--font-head);font-weight:700;font-size:14px;line-height:1.2;color:var(--ink);letter-spacing:-.01em}
.frag .sub{color:var(--muted);font-size:12px;margin-top:2px}
.tag{display:inline-block;font-weight:600;font-size:11px;line-height:1;padding:5px 8px;border-radius:999px;background:var(--primary-tint);color:var(--primary)}
.tag.ts{background:var(--tscribe-tint);color:var(--tscribe-text)}
.tag.ur{background:var(--ureport-tint);color:var(--ureport-text)}
.frag.note{background:var(--note);border:0;border-radius:4px;box-shadow:0 1px 2px rgba(120,100,0,.08),0 12px 24px -10px rgba(120,100,0,.35),0 30px 50px -24px rgba(120,100,0,.3);font-weight:500;font-size:14px;line-height:1.4;color:#3B3406;padding:22px 18px 18px}
.frag.note::before{content:"";position:absolute;top:-8px;left:50%;width:14px;height:14px;border-radius:50%;background:#D9483B;box-shadow:0 3px 6px rgba(0,0,0,.3);transform:translateX(-50%)}
.frag .row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:8px 0;border-top:1px solid var(--line)}
.frag .row:first-of-type{border-top:0}
.frag .mic{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:12px;color:var(--primary)}
.frag .mic i{width:8px;height:8px;border-radius:50%;background:#E0453A;box-shadow:0 0 0 4px rgba(224,69,58,.15)}
.frag .chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.frag .chips span{font-weight:600;font-size:12px;padding:8px 10px;border-radius:8px;background:var(--band);color:var(--ink);border:1px solid var(--line)}
.frag .chips span.on{background:var(--primary);color:#fff;border-color:var(--primary)}
.frag .rep{margin-top:10px;font-size:13px;line-height:1.5}
.frag .rep b{color:var(--ink);font-weight:600}
.frag.org{left:0;top:0;width:250px;padding:12px 14px;--rot:-2deg}
.frag.note{right:0;top:195px;width:190px;--rot:4deg}
.frag.emr,.frag.report{display:none}
@media (max-width:639.98px){.m-none{display:none!important}}
.frag{transform:rotate(var(--rot,0deg))}
/* entrance and idle drift */
.hero.anim .frag{opacity:0;transform:rotate(var(--rot,0deg)) translateY(18px) scale(.96)}
.hero.anim.ready .frag{opacity:1;transform:rotate(var(--rot,0deg));transition:opacity 700ms var(--ease-out),transform 900ms var(--ease-out)}
.hero.anim.ready .frag:nth-child(1){transition-delay:80ms}.hero.anim.ready .frag:nth-child(2){transition-delay:180ms}.hero.anim.ready .frag:nth-child(3){transition-delay:280ms}.hero.anim.ready .frag:nth-child(4){transition-delay:380ms}
@media (hover:hover) and (pointer:fine){.hero.anim.ready .frag:hover{transform:rotate(var(--rot,0deg)) translateY(-4px);transition-duration:220ms}}

/* ---------- Reasons ---------- */
.reasons{border-top:1px solid var(--line);margin-top:28px}
.reason{display:grid;gap:8px;padding:22px 0;border-bottom:1px solid var(--line)}
.reason h3{font-size:21px;max-width:16ch}
.reason p{color:var(--muted);font-size:14px}
.reason .n{font-weight:600;font-size:12px;color:var(--primary);display:block;margin-bottom:8px}

/* ---------- Organisation ---------- */
.org .regbtn{margin-top:18px}
.org .regbtn .btn{width:100%}
.steps{counter-reset:s;display:grid;gap:20px;margin-top:28px;list-style:none}
.step{position:relative;padding-left:48px}
.step::before{counter-increment:s;content:counter(s);position:absolute;left:0;top:0;width:32px;height:32px;border-radius:50%;background:var(--primary);color:#fff;font-family:var(--font-head);font-weight:700;font-size:14px;line-height:32px;text-align:center}
.step h3{font-size:16px;margin-bottom:4px}
.step p{font-size:14px;color:var(--muted)}
.dash{background:#fff;border-radius:var(--r-lg);box-shadow:var(--shadow-float);border:1px solid var(--line);overflow:hidden;font-size:12px;margin-top:28px}
.dash .top{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-bottom:1px solid var(--line);color:var(--muted)}
.dash .top b{color:var(--ink);font-family:var(--font-head);font-weight:700;font-size:13px;display:inline-flex;align-items:center;gap:8px}
.dash .top b img{width:16px;height:16px}
.dash .tabs{display:none;gap:4px;padding:10px 12px 0;border-bottom:1px solid var(--line);color:var(--muted)}
.dash .tabs span{padding:8px 12px 12px;border-bottom:2px solid transparent;margin-bottom:-1px}
.dash .tabs span.on{color:var(--primary);font-weight:600;border-bottom-color:var(--primary)}
.dash .tools{display:none;justify-content:space-between;align-items:center;padding:12px 18px;color:var(--muted)}
.dash .tools .search{border:1px solid var(--line);border-radius:8px;padding:7px 10px;width:220px;background:var(--band)}
.dash .tools .add{background:var(--primary);color:#fff;font-weight:600;padding:8px 12px;border-radius:8px;font-size:12px}
.dash table{width:100%;border-collapse:collapse}
.dash th{text-align:left;font-weight:500;color:var(--faint);font-size:11px;padding:6px 12px;border-bottom:1px solid var(--line);background:#FAFBFC}
.dash td{padding:9px 12px;border-top:1px solid var(--line);color:var(--text);vertical-align:middle;white-space:nowrap}
.dash tr:first-child td{border-top:0}
.dash td:first-child{font-weight:600;color:var(--ink)}
.dash td:last-child{font-variant-numeric:tabular-nums}
.dash .av{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--primary-tint);color:var(--primary);font-weight:700;font-size:10px;margin-right:6px;vertical-align:middle}
.dash .av.ts{background:var(--tscribe-tint);color:var(--tscribe-text)}
.dash .p{font-weight:600;font-size:11px;padding:5px 8px;border-radius:999px;display:inline-block;color:#fff}
.dash .p.ts{background:var(--tscribe)}.dash .p.ur{background:var(--ureport)}
.dash .st{display:inline-flex;align-items:center;gap:6px;color:var(--muted)}
.dash .st i{width:7px;height:7px;border-radius:50%;background:var(--ok);display:inline-block}
.dash .st.off i{background:var(--line-2)}
.dash .hide-m{display:none}
.dash .tw{overflow-x:auto}
.btn-register .lbl-l{display:none}

/* ---------- Product panels ---------- */
.panels{display:grid;gap:16px;margin-top:20px}
.panel{border-radius:var(--r-xl);padding:24px;position:relative;overflow:hidden;transition:transform 220ms var(--ease-out),box-shadow 220ms var(--ease-out);transform-style:preserve-3d}
.panel.ts{background:linear-gradient(180deg,#FDF3EE,#FBE9E0)}
.panel.ur{background:linear-gradient(180deg,#EEF4FD,#E6EEFB)}
.panel h3{font-size:26px;margin:12px 0 6px}
.panel .who{font-weight:600;font-size:15px}
.panel.ts .who{color:var(--tscribe-text)}.panel.ur .who{color:var(--ureport-text)}
.panel p{color:var(--muted);font-size:14px;margin-top:10px}
.panel .acts{display:flex;gap:10px;margin-top:20px;flex-wrap:wrap}
.panel .domain{font-weight:600;font-size:12px;padding:6px 10px;border-radius:999px;background:#fff;display:inline-block}
.panel.ts .domain{color:var(--tscribe-text)}.panel.ur .domain{color:var(--ureport-text)}
.panel ul{list-style:none;display:grid;gap:8px;margin-top:16px;font-size:14px;color:var(--text)}
.panel ul li{padding-left:18px;position:relative}
.panel ul li::before{content:"";position:absolute;left:0;top:9px;width:8px;height:2px;background:currentColor;opacity:.5}
@media (hover:hover) and (pointer:fine){
  .panel:hover{transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(-2px);box-shadow:0 30px 50px -30px rgba(15,23,32,.25)}
}

/* ---------- Chooser ---------- */
.chooser{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-float);padding:18px;margin-top:24px}
.chooser h3{font-size:18px;margin-bottom:12px}
.chooser .field{display:flex;align-items:center;gap:10px;border:1px solid var(--line-2);border-radius:10px;padding:0 14px;background:#fff;color:var(--muted);transition:border-color 150ms ease,box-shadow 150ms ease}
.chooser .field:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-tint)}
.chooser .field svg{width:16px;height:16px;flex:none}
.chooser input{flex:1;border:0;background:none;font:inherit;font-size:15px;color:var(--ink);padding:12px 0;outline:none;min-width:0}
.chooser .list{margin-top:8px;border:1px solid var(--line);border-radius:10px;overflow:hidden;font-size:15px;max-height:190px;overflow-y:auto}
.chooser .list:empty{display:none}
.chooser .list button{display:block;width:100%;text-align:left;overflow-wrap:anywhere;padding:9px 14px;border-top:1px solid var(--line);transition:background-color 120ms ease}
.chooser .list button:first-child{border-top:0}
.chooser .list button:hover,.chooser .list button[aria-selected="true"]{background:var(--primary-tint);color:var(--primary);font-weight:600}
.chooser .list .none{padding:10px 14px;color:var(--muted);font-size:14px}
.answer{margin-top:12px;background:var(--band);border-radius:6px;padding:12px 14px;color:var(--muted);font-size:14px;transition:background-color 220ms ease,color 220ms ease}
.answer.show{background:var(--note);color:#3B3406;animation:ansin 260ms var(--ease-out)}
@keyframes ansin{from{opacity:.4;transform:translateY(6px)}to{opacity:1;transform:none}}
.answer b{font-family:var(--font-head);color:var(--ink);font-size:16px;display:block;margin-bottom:2px}
.answer a{color:var(--primary);font-weight:600;border-bottom:1px solid var(--primary-soft)}

/* ---------- Flow ---------- */
.flow-h{display:none}
.flow-v{margin-top:28px;display:grid;grid-template-columns:40px 1fr;gap:0 12px}
.flow-v svg{width:40px;height:100%;overflow:visible}
.flow-v .items{display:grid;grid-auto-rows:1fr;gap:0}
.flow-v .items>div{padding:6px 0}
.flow-v .items>div,.flow-labels>div{transition:transform 300ms var(--ease-out);transform:translateY(4px)}
.flow-v .items>div h3,.flow-labels>div h3{color:var(--muted);transition:color 300ms ease}
.flow-v .items>div.on,.flow-labels>div.on{transform:none}
.flow-v .items>div.on h3,.flow-labels>div.on h3{color:var(--ink)}
.flow-v h3,.flow-labels h3{font-size:16px;margin-bottom:2px}
.flow-v p,.flow-labels p{font-size:14px;color:var(--muted)}
.flow-svg .base{fill:none;stroke:var(--line-2);stroke-width:1.5;stroke-dasharray:3 6}
.flow-svg .draw{fill:none;stroke:var(--primary);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.flow-svg circle{fill:#fff;stroke:var(--primary);stroke-width:2.5;transition:fill 200ms ease,transform 300ms var(--ease-out);transform-box:fill-box;transform-origin:center}
.flow-svg circle.on{fill:var(--primary)}
.flow-svg circle.pop{transform:scale(1.35)}
.flow-svg .pkt{fill:var(--primary);opacity:0;transition:opacity 200ms ease}
.flow-svg .pkt.on{opacity:1}
.flow-labels{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;text-align:center;margin-top:8px}
.flow-labels p{margin:0 auto;max-width:22ch}
.flow-toggle{font-size:14px;border-bottom:1px solid var(--primary-soft);padding-bottom:1px}

/* ---------- Extension window ---------- */
.win{margin-top:24px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-float);overflow:hidden;font-size:12px;color:var(--muted)}
.win .bar{display:flex;gap:6px;align-items:center;padding:8px 10px;border-bottom:1px solid var(--line);background:var(--band)}
.win .bar i{width:8px;height:8px;border-radius:50%;background:var(--line-2);display:block}
.win .bar .url{display:none;margin-left:8px;flex:1;height:20px;border-radius:6px;background:#fff;border:1px solid var(--line);font-size:11px;padding:2px 8px;line-height:14px}
.win .body{padding:14px;display:grid;gap:10px}
.win .fld{border:1px solid var(--line);border-radius:8px;padding:8px 10px;height:34px;background:var(--band);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.win .fld.hide-m{display:none}
.win .fld.big{height:210px;position:relative;border-color:var(--primary);box-shadow:0 0 0 4px var(--primary-tint);color:var(--text);line-height:1.5;background:#fff;white-space:normal}
.win .menu{position:absolute;left:10px;bottom:10px;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 12px 30px -10px rgba(0,0,0,.25);font-size:12px;color:var(--text);width:190px;overflow:hidden}
.win .menu div{padding:7px 10px;border-top:1px solid var(--line)}.win .menu div:first-child{border:0}
.win .menu div.on{background:var(--primary-tint);color:var(--primary);font-weight:600}
.win .micbtn{position:absolute;right:10px;bottom:10px;width:40px;height:40px;border-radius:50%;background:var(--primary);display:grid;place-items:center;box-shadow:0 10px 20px -8px rgba(24,73,119,.6)}
.win .micbtn i{width:10px;height:10px;border-radius:50%;background:#fff;display:block}
.stores{display:grid;gap:8px;margin-top:20px}
.store{display:inline-flex;align-items:center;gap:10px;border:1px solid var(--line-2);border-radius:12px;padding:10px 14px;background:#fff;font-weight:600;font-size:14px;line-height:1.2;color:var(--ink);transition:border-color 150ms ease,transform 160ms var(--ease-out)}
.store:hover{border-color:var(--faint)}
.store:active{transform:scale(.97)}
.store small{display:block;font-weight:400;color:var(--muted);font-size:11px}
.store svg{width:22px;height:22px;flex:none}

/* ---------- Assurance list ---------- */
.assure{display:grid;margin-top:20px}
.assure>div{padding:16px 0;border-bottom:1px solid var(--line)}
.assure h3{font-size:16px;margin-bottom:4px}
.assure p{font-size:14px;color:var(--muted)}

/* ---------- Nigeria ---------- */
.langs{display:flex;gap:6px;flex-wrap:wrap;font-size:13px;color:var(--muted);align-items:center;margin-top:16px}
.langs span{border:1px solid var(--line-2);border-radius:999px;padding:5px 10px;color:var(--ink);font-weight:500;background:#fff}
.pts{display:grid;gap:18px;margin-top:24px}
.pts h3{font-size:16px;margin-bottom:2px}
.pts p{font-size:14px;color:var(--muted)}

/* ---------- FAQ accordion ---------- */
.faq{border-top:1px solid var(--line);margin-top:20px}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 0;font-family:var(--font-head);font-weight:600;font-size:16px;line-height:1.3;color:var(--ink);letter-spacing:-.01em;cursor:pointer}
.faq summary::-webkit-details-marker{display:none}
.faq summary .ic{width:26px;height:26px;border:1px solid var(--line-2);border-radius:50%;display:grid;place-items:center;flex:none;position:relative;transition:transform 200ms var(--ease-out),background-color 150ms ease}
.faq summary .ic::before,.faq summary .ic::after{content:"";position:absolute;background:var(--muted);width:10px;height:1.5px;border-radius:2px}
.faq summary .ic::after{transform:rotate(90deg);transition:transform 200ms var(--ease-out)}
.faq details[open] summary .ic{background:var(--primary-tint);border-color:var(--primary-soft)}
.faq details[open] summary .ic::after{transform:rotate(0)}
.faq .a{display:grid;grid-template-rows:0fr;transition:grid-template-rows 240ms var(--ease-out)}
.faq details[open] .a{grid-template-rows:1fr}
.faq .a>div{overflow:hidden}
.faq .a p{color:var(--muted);font-size:14px;padding-bottom:16px}
.faq .a a{color:var(--primary);font-weight:600;border-bottom:1px solid var(--primary-soft)}

/* ---------- CTA band ---------- */
.ctas{padding-top:0}
.cta{background:var(--primary);color:#fff;border-radius:var(--r-xl);padding:36px 24px;position:relative;overflow:hidden}
.cta h2{color:#fff;font-size:28px}
.cta p{color:#C9D9EA;margin-top:10px;font-size:15px}
.cta .acts{display:grid;gap:8px;margin-top:22px}

/* ---------- Footer ---------- */
.site-footer{border-top:1px solid var(--line);color:var(--muted);font-size:14px;padding:40px 0 24px}
.site-footer h2{font-family:var(--font-head);font-size:13px;color:var(--ink);margin-bottom:14px;letter-spacing:0}
.site-footer ul{list-style:none;display:grid;gap:9px}
.site-footer a:hover{color:var(--primary)}
.site-footer .cols{display:grid;grid-template-columns:1fr 1fr;gap:24px 16px;margin-top:24px}
.site-footer .bottom{display:grid;gap:6px;border-top:1px solid var(--line);margin-top:32px;padding-top:18px;font-size:12px;color:var(--muted)}
.site-footer .bottom a{color:var(--muted)}

/* ---------- Subpages ---------- */
.page-hero{padding:40px 0 8px}
.page-hero h1{font-size:34px;max-width:18ch}
.page-hero .lede{font-size:16px;margin-top:14px;max-width:56ch}
.page-hero .acts{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.crumbs{font-size:13px;color:var(--muted);display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.crumbs a{color:var(--muted)}.crumbs a:hover{color:var(--primary)}
.crumbs span[aria-current]{color:var(--muted)}
.crumbs>*+*::before{content:"/";color:var(--line-2);margin-right:8px}
.prose{max-width:66ch}
.prose h2{font-size:24px;margin-top:40px;margin-bottom:12px}
.prose h3{font-size:18px;margin-top:26px;margin-bottom:8px}
.prose p,.prose li{color:var(--text);font-size:16px}
.prose ul,.prose ol{padding-left:22px;margin:12px 0}
.prose li+li{margin-top:6px}
.prose table{border-collapse:collapse;width:100%;font-size:14px;margin:16px 0}
.prose th,.prose td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top}
.prose th{font-weight:600;color:var(--ink);background:var(--band)}
.grid-2{display:grid;gap:24px}
.grid-3{display:grid;gap:20px}
.feature{padding:20px 0;border-top:1px solid var(--line)}
.feature h3{font-size:18px;margin-bottom:6px}
.feature p{font-size:15px;color:var(--muted)}
.feature .k{font-weight:600;font-size:12px;color:var(--primary);display:block;margin-bottom:8px}
.callout{background:var(--band);border-radius:var(--r-lg);padding:20px}
.callout h3{font-size:17px;margin-bottom:6px}
.callout p{font-size:14px;color:var(--muted)}
.callout.note{background:var(--note);color:#3B3406}
.callout.note p{color:#5a4d0a}
.ladder{border-top:1px solid var(--line);margin-top:24px}
.ladder>div{padding:20px 0;border-bottom:1px solid var(--line);display:grid;gap:6px}
.ladder h3{font-size:18px}
.ladder p{font-size:14px;color:var(--muted)}
.ladder .who{font-size:13px;color:var(--primary);font-weight:600}
.ladder .floor{display:inline-block;font-size:11px;font-weight:600;background:var(--note);color:#7a5a00;border-radius:999px;padding:4px 8px;margin-left:8px;vertical-align:middle;font-family:var(--font-body);letter-spacing:0}
.perm{display:grid;gap:12px;margin-top:20px}
.perm>div{border:1px solid var(--line);border-radius:12px;padding:16px}
.perm h3{font-size:15px;margin-bottom:4px}
.perm p{font-size:14px;color:var(--muted)}
.perm code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;background:var(--band);padding:2px 6px;border-radius:4px;color:var(--ink)}

/* ---------- Legal ---------- */
.legal{display:grid;gap:32px;padding-bottom:40px}
.legal .toc{background:var(--band);border-radius:var(--r-lg);padding:18px 20px;font-size:14px}
.legal .toc h2{font-size:13px;font-family:var(--font-body);font-weight:600;color:var(--muted);margin-bottom:10px;letter-spacing:0}
.legal .toc ol{list-style:none;display:grid;gap:6px;counter-reset:t}
.legal .toc li{counter-increment:t;display:flex;gap:8px}
.legal .toc li::before{content:counter(t) ".";color:var(--faint);min-width:20px}
.legal .toc a{color:var(--text)}.legal .toc a:hover{color:var(--primary)}
.page-hero .updated{font-size:14px;color:var(--muted);margin-top:12px;max-width:70ch}
.legal .prose h2{scroll-margin-top:90px}

/* ---------- Contact form ---------- */
.form{display:grid;gap:14px;margin-top:8px}
.form label{display:grid;gap:6px;font-size:14px;font-weight:500;color:var(--ink)}
.form input,.form select,.form textarea{font:inherit;font-size:15px;padding:12px 14px;border:1px solid var(--line-2);border-radius:10px;background:#fff;color:var(--ink);width:100%;transition:border-color 150ms ease,box-shadow 150ms ease}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-tint)}
.form textarea{min-height:140px;resize:vertical}
.form .row{display:grid;gap:14px}
.form .status{font-size:14px;color:var(--muted);min-height:1.2em}
.form .status.err{color:var(--warn)}
.form .status.ok{color:var(--ok)}
.form-done{display:none;background:var(--band);border-radius:var(--r-lg);padding:24px}
.form-done h3{font-size:20px;margin-bottom:8px}
.form-done p{color:var(--muted);font-size:15px}
.form-done .btn{margin-top:16px}
.contact-side{display:grid;gap:14px;align-content:start}
.contact-side .card{border:1px solid var(--line);border-radius:12px;padding:16px}
.contact-side h2{font-size:15px;margin-bottom:4px;letter-spacing:-.01em}
.contact-side p{font-size:14px;color:var(--muted)}
.contact-side a{color:var(--primary);font-weight:600}

/* ---------- 404 ---------- */
.nf{padding:80px 0;text-align:center}
.nf h1{font-size:44px}
.nf p{color:var(--muted);margin-top:12px}
.nf .acts{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:24px}

/* ---------- Table of specialties / comparison ---------- */
.cmp{width:100%;border-collapse:collapse;font-size:14px;margin-top:24px}
.cmp th,.cmp td{padding:12px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.cmp th{font-weight:600;color:var(--ink);background:var(--band)}
.cmp td:first-child{font-weight:500;color:var(--ink)}
.cmp .y{color:var(--ok);font-weight:600}.cmp .n{color:var(--faint)}
.table-wrap{overflow-x:auto}

/* ======================== TABLET (640px+) ======================== */
@media (min-width:640px){
  :root{--gutter:32px}
  section{padding:80px 0}
  .stitle{text-align:center}
  .stitle h2{font-size:36px;max-width:18ch;margin-inline:auto}
  .slede{text-align:center;font-size:16px;margin-inline:auto}
  .band-rounded{border-radius:32px 32px 0 0}
  .hdr{height:68px}
  .nav{display:flex;gap:22px;font-weight:500;font-size:14px;color:var(--text)}
  .nav a{padding:6px 0;border-bottom:2px solid transparent;transition:color 150ms ease}
  .nav a:hover{color:var(--primary)}
  .nav a[aria-current="page"]{color:var(--primary);border-bottom-color:var(--primary)}
  .nav .more{display:none}
  .hdr .btn-register{display:inline-flex}
  .dash th.hide-l,.dash td.hide-l{display:none}
  /* hero */
  .hero{padding:56px 0 0}
  .hero .h-text h1{font-size:50px;max-width:600px}
  .hero .h-text .lede{font-size:17px;margin-top:18px}
  .hero .acts{display:flex;gap:10px;margin-top:26px}
  .hero .cluster{height:410px;margin-top:40px}
  .frag.org{left:0;top:10px;width:250px;padding:14px 16px;--rot:-3deg}
  .frag.note{left:290px;right:auto;top:0;width:200px;--rot:4deg}
  .frag.report{display:block;right:0;top:170px;width:240px;padding:14px 16px;--rot:-2deg}
  .frag.emr{display:block;left:30px;top:250px;width:230px;padding:14px 16px;--rot:2deg}
  .frag .rep{display:block}
  /* reasons */
  .reasons{margin-top:44px}
  .reason{grid-template-columns:200px 1fr;gap:24px;padding:26px 0}
  .reason h3{font-size:22px}
  .reason p{font-size:15px;align-self:center}
  /* org */
  .org .regbtn{display:flex;justify-content:center;margin-top:20px}
  .org .regbtn .btn{width:auto}
  .dash{margin-top:44px;font-size:13px}
  .dash .tabs{display:flex}
  .dash th{font-size:12px;padding:6px 16px}
  .dash td{padding:10px 16px}
  .dash .hide-m{display:table-cell}
  .steps{grid-template-columns:1fr 1fr;gap:24px 32px;margin-top:40px}
  .step h3{font-size:17px}
  /* panels */
  .panels{gap:20px;margin-top:24px}
  .panel{padding:32px}
  .panel h3{font-size:28px}
  .panel p{font-size:15px}
  .chooser{padding:24px;display:grid;grid-template-columns:1fr 1fr;gap:16px 24px;margin-top:32px}
  .chooser h3{grid-column:1/3;font-size:20px;margin:0}
  .chooser .answer{margin-top:0;align-self:start}
  /* flow */
  .flow-v{display:none}
  .flow-h{display:block;margin-top:40px}
  .flow-labels{gap:12px}
  .flow-labels h3{font-size:14px}.flow-labels p{font-size:12px}
  /* ext */
  .win{margin-top:36px;font-size:13px}
  .win .bar .url{display:block}
  .win .bar i{width:10px;height:10px}
  .win .body{padding:18px;grid-template-columns:1fr 1fr;gap:12px}
  .win .fld{height:36px}
  .win .fld.hide-m{display:block}
  .win .fld.big{grid-column:1/3;height:190px;padding-right:240px}
  .win .menu{left:auto;bottom:auto;right:12px;top:12px;width:210px}
  .win .menu div{padding:8px 12px}
  .win .micbtn{width:44px;height:44px;right:14px;bottom:14px}
  .stores{grid-template-columns:repeat(3,1fr)}
  /* assure */
  .assure{grid-template-columns:1fr 1fr;gap:0 32px;margin-top:40px}
  .assure>div{padding:22px 0}
  .pts{grid-template-columns:1fr 1fr;gap:22px 32px;margin-top:32px}
  .pts h3{font-size:17px}
  /* faq */
  .faq{margin-top:36px}
  .faq summary{font-size:17px;padding:20px 0}
  .faq .a p{font-size:15px;padding-bottom:20px}
  /* cta */
  .cta{padding:52px 32px;text-align:center}
  .cta h2{font-size:34px}
  .cta p{font-size:16px;margin-inline:auto;max-width:52ch}
  .cta .acts{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin-top:26px}
  /* footer */
  .site-footer{padding:44px 0 24px}
  .site-footer .cols{grid-template-columns:repeat(4,1fr);gap:20px;margin-top:32px}
  .site-footer .bottom{display:flex;justify-content:space-between;margin-top:36px;font-size:13px}
  /* subpages */
  .page-hero{padding:56px 0 8px}
  .page-hero h1{font-size:44px}
  .page-hero .lede{font-size:17px}
  .grid-2{grid-template-columns:1fr 1fr;gap:32px}
  .grid-3{grid-template-columns:1fr 1fr;gap:24px}
  .ladder>div{grid-template-columns:200px 1fr;gap:8px 24px;align-items:baseline}
  .ladder .who{grid-column:2}
  .perm{grid-template-columns:1fr 1fr}
  .legal{grid-template-columns:240px 1fr;gap:48px;align-items:start}
  .legal .toc{position:sticky;top:88px}
  .form .row{grid-template-columns:1fr 1fr}
  .contact-grid{display:grid;grid-template-columns:1fr 300px;gap:40px;align-items:start}
  .nf h1{font-size:60px}
}

/* ======================== DESKTOP (1024px+) ======================== */
@media (min-width:1024px){
  :root{--gutter:40px}
  section{padding:110px 0}
  .stitle h2{font-size:44px}
  .slede{font-size:18px;margin-top:16px}
  .band-rounded{border-radius:40px 40px 0 0}
  .hdr{height:76px}
  .nav{gap:30px;font-size:15px}
  .nav .more{display:inline}
  .btn-register .lbl-l{display:inline}.btn-register .lbl-s{display:none}
  .hdr .signin{display:block}
  .menu-btn{display:none}
  /* hero: text left, cluster right */
  .hero{padding:0;height:720px}
  .hero .wrap{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;height:100%}
  .hero .h-text h1{font-size:54px;max-width:none}
  .hero .h-text .lede{font-size:19px;max-width:48ch;margin-top:24px}
  .hero .acts{margin-top:34px}
  .hero .cluster{height:520px;margin-top:0}
  .frag.org{left:0;top:20px;width:240px;padding:14px 16px;--rot:-3deg}
  .frag.note{left:auto;right:0;top:0;width:200px;padding:22px 18px 18px;font-size:14px;--rot:5deg}
  .frag.emr{left:0;top:auto;bottom:70px;width:220px;padding:14px 16px;--rot:2deg}
  .frag.report{right:0;top:auto;bottom:0;width:240px;padding:14px 16px;--rot:-3deg}
  /* reasons in two columns */
  .reasons-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 64px;margin-top:64px}
  .reasons-grid .reasons{margin-top:0}
  .reason{grid-template-columns:1fr 1fr;gap:32px;padding:34px 0}
  .reason h3{font-size:26px}
  .reason p{font-size:16px}
  /* org: steps left, dash right */
  .org .two{display:grid;grid-template-columns:5fr 7fr;gap:64px;align-items:center;margin-top:64px}
  .org .two .steps{grid-template-columns:1fr;gap:26px;margin-top:0}
  .org .two .dash{margin-top:0;transform:rotate(-1.5deg)}
  .dash .tools{display:flex}
  .dash{font-size:12px}
  .dash td{padding:9px 12px}.dash th{padding:6px 12px}
  .step h3{font-size:19px}.step p{font-size:15px}
  .step{padding-left:56px}
  .step::before{width:36px;height:36px;line-height:36px;font-size:15px}
  /* panels */
  .panels{grid-template-columns:1fr 1fr;gap:24px;margin-top:64px}
  .panel{padding:40px}
  .panel h3{font-size:34px;margin-top:14px}
  .panel p{font-size:16px}
  .chooser{width:640px;margin:48px auto 0;padding:28px;gap:20px 28px}
  .chooser h3{font-size:22px}
  /* flow */
  .flow-h{margin-top:56px}
  .flow-labels{gap:24px}
  .flow-labels h3{font-size:17px;margin-bottom:4px}.flow-labels p{font-size:14px}
  /* ext */
  .ext .two{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;margin-top:0}
  .ext .two .stitle{text-align:left}
  .ext .two .stitle h2{margin-inline:0;max-width:none}
  .ext .two .slede{text-align:left;margin-inline:0}
  .win{margin-top:0}
  .win .body{padding:20px;gap:14px}
  .win .fld.big{height:200px}
  .stores{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
  /* assure */
  .assure{gap:0 48px;margin-top:56px}
  .assure h3{font-size:18px}.assure p{font-size:15px}
  /* nigeria */
  .nigeria .two{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}
  .nigeria .two .stitle{text-align:left}
  .nigeria .two .stitle h2{margin-inline:0;max-width:none}
  .nigeria .two .slede{text-align:left;margin-inline:0}
  .nigeria .pts{grid-template-columns:1fr;gap:22px;margin-top:8px}
  .pts h3{font-size:18px}.pts p{font-size:15px}
  .langs{font-size:14px;margin-top:22px}
  .langs span{padding:6px 12px}
  /* faq */
  .faq{width:820px;margin:48px auto 0}
  .faq summary{font-size:18px}
  /* cta */
  .cta{padding:72px 40px}
  .cta h2{font-size:44px}
  .cta p{font-size:18px}
  /* footer */
  .site-footer{padding:56px 0 28px}
  .site-footer .cols{grid-template-columns:2fr 1fr 1fr 1fr 1fr;gap:24px}
  .site-footer .bottom{margin-top:44px;padding-top:22px}
  /* subpages */
  .page-hero{padding:72px 0 16px}
  .page-hero h1{font-size:56px}
  .page-hero .lede{font-size:19px}
  .grid-3{grid-template-columns:repeat(3,1fr);gap:32px}
  .prose h2{font-size:28px}
  .legal{grid-template-columns:260px 1fr;gap:64px}
  .contact-grid{grid-template-columns:1fr 340px;gap:64px}
}

@media (min-width:1200px){
  .hero .wrap{grid-template-columns:600px 1fr}
  .hero .h-text h1{font-size:64px}
  .frag.org{width:290px;padding:16px 18px}
  .frag.note{width:240px;padding:26px 22px 22px;font-size:15px}
  .frag.emr{width:255px;padding:16px 18px;bottom:56px}
  .frag.report{width:285px;padding:16px 18px}
  .dash th.hide-l,.dash td.hide-l{display:table-cell}.dash{font-size:13px}.dash td{padding:10px 16px}.dash th{padding:6px 16px}}


/* ---------- Touch targets on coarse pointers (44px minimum) ---------- */
@media (pointer:coarse){
  .btn,.btn-sm,.menu-btn,.store,.close-btn,.signin>button{min-height:44px}
  .chooser .list button{padding:12px 14px}
  .site-footer ul a,.crumbs a,.signin-menu a{display:inline-block;padding:6px 0}
  .faq summary{min-height:48px}
  .flow-toggle{padding:10px 4px}
}

/* ======================== Reduced motion ======================== */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .rv{opacity:1;transform:none;transition:none}
  .hero.anim .frag{opacity:1;transform:rotate(var(--rot,0deg));transition:none;animation:none!important}
    .flow-v .items>div,.flow-labels>div{transform:none}
  .flow-v .items>div h3,.flow-labels>div h3{color:var(--ink)}
  .flow-svg .draw{stroke-dashoffset:0!important}
  .flow-svg circle{fill:var(--primary)}
  .panel:hover{transform:none}
  .sheet .panel,.sheet .scrim,.signin-menu,.faq .a,.answer{transition:none}
  .btn,.store{transition:none}
}