/* Talia – base styles */
/* Base */
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
:root{
  --bg:#0b1020; --bg-rgb:11,16,32; --bg-elev:#0f1730; --card:#121a36; --surface:#10182e;
  --text:#e6eaf2; --muted:#a9b0c5;
  /* Brand palette */
  --brand-primary:#3354ff;
  --brand-secondary:#9458f7;
  --brand-accent:#00dcc0;
  --grad-brand:linear-gradient(135deg,var(--brand-primary),var(--brand-secondary) 60%,var(--brand-accent));
  --grad-brand-soft:linear-gradient(135deg,rgba(51,84,255,.08),rgba(148,88,247,.08) 60%,rgba(0,220,192,.08));
  --grad-secondary:linear-gradient(135deg,#ff7e5f,#feb47b);
  --grad-success:linear-gradient(135deg,#42e695,#3bb2b8);
  --grad-warning:linear-gradient(135deg,#8a2d00,#a14b00);
  --grad-danger:linear-gradient(135deg,#f85032,#e73827);
  /* legacy tokens */
  --brand-blue:var(--brand-primary);
  --brand-purple:var(--brand-secondary);
  --brand-teal:var(--brand-accent);
  --danger:#ff5577; --ok:#5ad67d; --warning:#f6c156;
  --ring:36,112,255; --radius:16px;
  --shadow:0 10px 30px rgba(0,0,0,.35),0 1px 0 rgba(255,255,255,.04) inset;
  --ease:cubic-bezier(.4,0,.2,1);
  --grad-hero:radial-gradient(1200px 700px at 80% -20%, rgba(51,84,255,.25), transparent 60%),
              radial-gradient(900px 600px at -10% 10%, rgba(148,88,247,.18), transparent 60%),
              radial-gradient(800px 400px at 60% 120%, rgba(0,220,192,.15), transparent 40%);
  --chart-line:#fff; --chart-grid:rgba(255,255,255,.12); --chart-label:rgba(255,255,255,.7);
  --shield-stroke:rgba(255,255,255,.48);
}
@media (prefers-color-scheme: light){
  :root:not([data-theme="dark"]){
    --bg:#f8fafc; --bg-rgb:248,250,252; --bg-elev:#ffffff; --card:#ffffff; --surface:#f0f4ff;
    --text:#0b1020; --muted:#495067;
    --chart-line:#0b1020; --chart-grid:rgba(0,0,0,.14); --chart-label:rgba(0,0,0,.65);
    --grad-warning:linear-gradient(135deg,#ffbb00,#ff7700);
    --shield-stroke:rgba(0,0,0,.50);
  }
}
html[data-theme="light"]{
  --bg:#f8fafc; --bg-rgb:248,250,252; --bg-elev:#ffffff; --card:#ffffff; --surface:#f0f4ff;
  --text:#0b1020; --muted:#495067;
  --chart-line:#0b1020; --chart-grid:rgba(0,0,0,.14); --chart-label:rgba(0,0,0,.65);
  --grad-warning:linear-gradient(135deg,#ffbb00,#ff7700);
  --shield-stroke:rgba(0,0,0,.50);
}

body{font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial;
     color:var(--text); background:var(--bg); line-height:1.6; -webkit-font-smoothing:antialiased;
     transition:background-color .4s var(--ease),color .4s var(--ease)}
body.nav-open{overflow:hidden}
.container{max-width:1200px;margin:0 auto;padding:0 24px}
.flex{display:flex;align-items:center}
/* Ensure media scales fluidly without losing fidelity */
img,svg,canvas{max-width:100%;height:auto}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
.skip-link{position:absolute;left:-999px;top:0;background:#000;color:#fff;padding:8px 12px;z-index:1000}
.skip-link:focus{left:8px}

/* Progress */
.progress{position:fixed;top:0;left:0;height:3px;width:100%;z-index:200;background:linear-gradient(90deg,var(--brand-primary),var(--brand-secondary) 60%,var(--brand-accent));box-shadow:0 0 12px rgba(0,0,0,.3);transform-origin:left;transform:scaleX(0);opacity:0;transition:transform .15s var(--ease),opacity .4s var(--ease);will-change:transform}

/* Header */
.site-header{position:sticky;top:0;z-index:100;backdrop-filter:saturate(180%) blur(12px);background:var(--bg);background:color-mix(in oklab,var(--bg) 70%,transparent);border-bottom:1px solid color-mix(in oklab,var(--text) 10%,transparent)}
.header-inner{justify-content:space-between;min-height:64px;gap:24px;position:relative}
.brand{display:inline-flex;align-items:center;gap:12px;text-decoration:none;color:inherit}
.nav-toggle{display:none}
.nav-toggle svg{transition:transform .3s var(--ease)}
.nav-toggle[aria-expanded="true"] svg{transform:rotate(90deg)}
.nav-list{display:flex;gap:20px;list-style:none;margin:0;padding:0}
.nav-list a{color:var(--muted);text-decoration:none;padding:10px 6px;border-radius:10px;transition:color .2s var(--ease),background-color .2s var(--ease)}
.nav-list a:hover{color:var(--text);background:color-mix(in oklab,var(--text) 8%,transparent)}
.header-ctas{display:flex;gap:12px;align-items:center}
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:12px;border:1px solid color-mix(in oklab,var(--text) 15%,transparent);background:color-mix(in oklab,var(--text) 5%,transparent);color:var(--text);cursor:pointer;transition:background .3s var(--ease)}
.theme-toggle:hover{background:color-mix(in oklab,var(--text) 10%,transparent)}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:44px;padding:0 18px;text-decoration:none;border-radius:12px;border:1px solid rgba(255,255,255,.1);box-shadow:var(--shadow);cursor:pointer;transition:transform .3s cubic-bezier(.4,0,.2,1),background .3s cubic-bezier(.4,0,.2,1),color .3s cubic-bezier(.4,0,.2,1),box-shadow .3s cubic-bezier(.4,0,.2,1);font-weight:600;position:relative;overflow:hidden;background-size:200% 200%;text-align:center;line-height:1;white-space:nowrap;appearance:none;-webkit-appearance:none}
.btn::after{content:"";position:absolute;top:-50%;left:-75%;width:50%;height:200%;background:rgba(255,255,255,.25);transform:rotate(35deg);transition:left .7s;pointer-events:none}
.btn.primary{background:var(--grad-brand);color:#fff;border:none}
.btn.secondary{background:var(--grad-secondary);color:#fff;border:none}
.btn.success{background:var(--grad-success);color:#fff;border:none}
.btn.warning{background:var(--grad-warning);color:var(--text);border:none}
.btn.danger{background:var(--grad-danger);color:#fff;border:none}
.btn.ghost{background:transparent;color:var(--text);border:1px solid rgba(255,255,255,.3)}
.btn.ghost::after{display:none}
.btn:hover{transform:translateY(-2px) scale(1.02);box-shadow:0 14px 28px rgba(0,0,0,.45),0 1px 0 rgba(255,255,255,.04) inset}
.btn:not(.ghost):hover{animation:gradient-pan 4s linear infinite}
.btn:hover::after{left:125%}
.btn:active{transform:translateY(0) scale(.96)}
@keyframes gradient-pan{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}

/* Type */
.display{font-size:clamp(2.4rem,6vw,4.4rem);line-height:1.1;letter-spacing:-.02em;margin:0 0 12px}
.h1{font-size:clamp(1.8rem,4.2vw,2.6rem);margin:0 0 10px}
.lead{font-size:clamp(1rem,1.8vw,1.25rem);color:var(--muted);max-width:60ch}
.eyebrow{letter-spacing:.12em;text-transform:uppercase;font-weight:700;font-size:.85rem;color:var(--muted)}
.muted{color:var(--muted)} .tiny{font-size:.85rem}
.section{padding:clamp(64px,12vw,140px) 0;position:relative;content-visibility:auto;contain-intrinsic-size:600px}
.section-intro{margin-bottom:32px}
.section[data-transition]{transform-origin:50% 20%;transform:translateY(40px) scale(.97);opacity:0;transition:transform .8s cubic-bezier(.22,1,.36,1),opacity .8s cubic-bezier(.22,1,.36,1)}
.section[data-transition].is-in{transform:translateY(0) scale(1);opacity:1}
.hero{padding-top:96px;background:var(--grad-hero);overflow:hidden}
.hero-inner{display:grid;grid-template-columns:1.1fr 1fr;gap:24px;align-items:center}
.hero-bullets{list-style:disc;padding:0;margin:14px 0 0;display:grid;gap:6px;color:var(--muted)}
.hero-bullets li.reveal{transform:translateY(12px);opacity:0}
.hero-bullets li.reveal.is-visible{transform:translateY(0);opacity:1;transition:transform .6s cubic-bezier(.4,0,.2,1),opacity .6s cubic-bezier(.4,0,.2,1)}
.hero-visual{position:relative;width:100%;min-height:360px;aspect-ratio:4/3;border-radius:24px;overflow:hidden;background:linear-gradient(180deg,rgba(255,255,255,.06),transparent);outline:1px solid rgba(255,255,255,.06)}
/* Scale canvases to container size for consistent rendering */
.hero-visual canvas,.video-frame canvas{width:100%;height:100%;display:block}
.hero-gradient{position:absolute;inset:0;pointer-events:none;background:
  radial-gradient(600px 300px at 10% 20%, rgba(46,91,255,.15), transparent 60%),
  radial-gradient(800px 400px at 90% 10%, rgba(138,92,246,.15), transparent 60%),
  radial-gradient(600px 400px at 50% 120%, rgba(0,216,164,.12), transparent 60%);
  mix-blend-mode:screen}
.accent-dot{color:var(--brand-teal)}

.platform .section-intro{position:sticky;top:0;z-index:5;background:var(--bg)}
.platform .sticky-stage{position:relative;height:240vh}
/* Leave more vertical room so section title stays visible while devices pin. */
.platform .stage-pin{position:sticky;top:24vh;height:76vh;display:grid;grid-template-columns:1fr 1fr 1fr;align-items:end;gap:16px;perspective:1000px}
/* Stack illustration and caption so the entire unit anchors to the stage floor. */
.device{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;transform-style:preserve-3d;transition:transform .8s cubic-bezier(.4,0,.2,1),opacity .6s cubic-bezier(.4,0,.2,1),filter .5s cubic-bezier(.4,0,.2,1);opacity:.6;filter:saturate(.8)}
.device.active{opacity:1;transform:translateY(-10px) scale(1.05);filter:saturate(1)}
/* Keep device art pinned to the stage floor when scaled via JS */
/* Longer transform for more natural shrink of the phone illustration */
.device .device-frame{width:100%;height:auto;filter:drop-shadow(0 20px 30px rgba(0,0,0,.35));transform-origin:bottom center;transition:filter .5s cubic-bezier(.4,0,.2,1),transform 1.2s cubic-bezier(.4,0,.2,1)}
.device.active .device-frame{filter:drop-shadow(0 28px 40px rgba(0,0,0,.45))}
.device .frame{fill:var(--surface);transition:fill .4s ease}
.device .titlebar{fill:rgba(255,255,255,.06)} .device .screen{fill:#0a1026}
.device .sensor{fill:#111a3a} .device .ui .ui-bar{fill:rgba(255,255,255,.1)}
.device .ui .ui-pill,.device .ui .ui-card{fill:rgba(255,255,255,.08)}
.device.active[data-device="patient"] .frame{fill:color-mix(in oklab,var(--surface) 70%,var(--brand-blue))}
.device.active[data-device="doctor"] .frame{fill:color-mix(in oklab,var(--surface) 70%,var(--brand-purple))}
.device.active[data-device="admin"] .frame{fill:color-mix(in oklab,var(--surface) 70%,var(--brand-teal))}
/* Center and separate captions from artwork. */
.device-caption{text-align:center;margin-top:8px}
/* Keep legend aligned with the shifted stage-pin top offset. */
.stage-legend{position:sticky;top:calc(24vh + 10px);margin-top:-60vh;align-self:start;list-style:none;margin:0;padding:0}
.stage-legend .legend-item{display:flex;align-items:center;gap:8px;color:var(--muted);padding:10px 12px;border-left:2px solid transparent;border-radius:8px;cursor:pointer;background:none;border:none;text-align:left;width:100%;font:inherit}
.stage-legend .legend-item:hover{background:rgba(255,255,255,.04)}
.stage-legend .legend-item.active{color:var(--text);border-left:2px solid rgba(var(--ring),.8)}
.stage-legend .dot{width:8px;height:8px;border-radius:999px;display:inline-block;background:var(--grad-brand)}

/* Features/Investors/Team/Contact (same as v3.1 with minor tweaks) */
.features .feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.feature-card{background:var(--card);border:1px solid rgba(255,255,255,.06);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow);transform:translateY(18px);opacity:0;will-change:transform,opacity}
.feature-card.reveal.is-visible{transform:translateY(0);opacity:1;transition:transform .7s cubic-bezier(.4,0,.2,1),opacity .7s cubic-bezier(.4,0,.2,1)}
.icon{width:28px;height:28px;border-radius:8px;background:var(--grad-brand);box-shadow:0 6px 18px rgba(0,0,0,.35)}
.icon.lock{clip-path:path("M14 2c3 0 5 2 5 5v3h1a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2h1V7c0-3 2-5 5-5z")}
.icon.id{clip-path:path("M4 4h20v16H4V4zm2 2v12h16V6H6zm2 2h6v3H8V8zm0 5h10v3H8v-3z")}
.icon.ai{clip-path:path("M12 2l2.2 4.5L19 7l-3.6 3.1L16 15l-4-2-4 2 1-4.9L5 7l4.8-.5L12 2z")}
.icon.files{clip-path:path("M6 2h8l6 6v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2zm8 2v6h6")}
.icon.shield{clip-path:path("M12 2l8 4v6c0 5-3.3 9.5-8 10-4.7-.5-8-5-8-10V6l8-4z")}
.icon.roles{clip-path:path("M12 2a5 5 0 1 1 0 10 5 5 0 0 1 0-10zm-8 18c0-4 8-4 8-4s8 0 8 4v2H4v-2z")}

/* Security */
.security .security-illus{margin:24px 0 8px;display:flex;justify-content:center;align-items:center}
#shield-svg{width:min(92vw,880px);height:auto}
#shield-svg #handshake{stroke:var(--shield-stroke)}
#shield-svg #lock rect,#shield-svg #lock path{stroke:var(--shield-stroke)}
.security .trust-points{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.trust-card{background:var(--card);border:1px solid rgba(255,255,255,.06);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow);transform:translateY(18px);opacity:0;will-change:transform,opacity}
.trust-card.reveal.is-visible{transform:translateY(0);opacity:1;transition:transform .7s cubic-bezier(.4,0,.2,1),opacity .7s cubic-bezier(.4,0,.2,1)}
.badge{display:inline-flex;align-items:center;justify-content:center;width:48px;height:28px;border-radius:999px;background:var(--grad-brand);font-weight:800;letter-spacing:.08em}

/* Investors */
.investor-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.chart-card{background:var(--card);border:1px solid rgba(255,255,255,.06);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow);transform:translateY(18px);opacity:0;will-change:transform,opacity}
.chart-card.reveal.is-visible{transform:translateY(0);opacity:1;transition:transform .7s cubic-bezier(.4,0,.2,1),opacity .7s cubic-bezier(.4,0,.2,1)}
.chart{width:100%;height:280px}
.adv-list{margin:10px 0 0;color:var(--muted);display:grid;gap:8px;padding-left:18px}

/* Team */
.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.team-card{background:var(--card);border:1px solid rgba(255,255,255,.06);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow);display:grid;grid-template-columns:86px 1fr;gap:14px;align-items:center;transform:translateY(18px);opacity:0;will-change:transform,opacity}
.team-card.reveal.is-visible{transform:translateY(0);opacity:1;transition:transform .7s cubic-bezier(.4,0,.2,1),opacity .7s cubic-bezier(.4,0,.2,1)}
.team-avatar{width:86px;height:86px;object-fit:cover;border-radius:16px;overflow:hidden;display:block;background:var(--grad-brand)}
.team-meta h4{margin:0 0 4px;font-size:1.1rem}
.team-meta .title{font-weight:600}
.team-meta .edu,.team-meta .loc{color:var(--muted);font-size:.95rem}
.team-meta .bio{color:var(--muted);font-size:.95rem;margin-top:4px}

/* Contact & Footer */
.contact-inner{display:grid;grid-template-columns:1.2fr .8fr;gap:24px;align-items:center}
.contact-form{display:flex;gap:8px;align-items:center;background:var(--card);padding:8px;border-radius:12px;border:1px solid rgba(255,255,255,.06);box-shadow:var(--shadow);flex-wrap:wrap}
.contact-form input{flex:1;height:44px;border:none;outline:none;padding:0 12px;border-radius:10px;color:var(--text);background:rgba(255,255,255,.06)}
.contact-form p{flex-basis:100%;margin:0}
.site-footer{border-top:1px solid rgba(255,255,255,.06);padding:30px 0}
.footer-inner{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}
.footer-links{list-style:none;display:grid;gap:8px;padding:0;margin:0}
.footer-links a{color:var(--muted);text-decoration:none}
.footer-links a:hover{color:var(--text)}
.footer-social{display:flex;gap:12px}
.footer-social .social{display:inline-flex;width:40px;height:40px;align-items:center;justify-content:center;border-radius:12px;border:1px solid rgba(255,255,255,.06)}

/* Responsive */
@media (max-width:1080px){
  .hero-inner{grid-template-columns:1fr}
  .platform .stage-pin{grid-template-columns:1fr;height:68vh}
  .device{transform:scale(.86)}
  .features .feature-grid{grid-template-columns:1fr 1fr}
  .security .trust-points{grid-template-columns:1fr 1fr}
  .investor-grid{grid-template-columns:1fr}
  .team-grid{grid-template-columns:1fr 1fr}
  .contact-inner{grid-template-columns:1fr}
  .stage-legend{display:none}
}
@media (max-width:720px){
  /* Mobile nav becomes an absolute dropdown */
  .nav-list{position:absolute;top:calc(100% + 8px);right:0;background:var(--bg-elev);border:1px solid color-mix(in oklab,var(--text) 15%,transparent);border-radius:12px;flex-direction:column;width:200px;padding:12px 0;box-shadow:0 10px 24px rgba(0,0,0,.35);opacity:0;visibility:hidden;transform-origin:top right;transform:scale(.96) translateY(-10px);pointer-events:none;will-change:transform,opacity;transition:opacity .35s var(--ease),transform .35s var(--ease),visibility 0s linear .35s;z-index:1000}
  .nav-list a{padding:10px 16px;text-align:right}
  .nav-list.open{opacity:1;visibility:visible;transform:scale(1) translateY(0);pointer-events:auto;transition:opacity .35s var(--ease),transform .35s var(--ease),visibility 0s}
  .nav-toggle{display:inline-flex;width:38px;height:38px;align-items:center;justify-content:center;border-radius:10px;border:1px solid color-mix(in oklab,var(--text) 15%,transparent);background:color-mix(in oklab,var(--text) 5%,transparent);color:var(--text);cursor:pointer;transition:background .3s var(--ease)}
  .nav-toggle:hover{background:color-mix(in oklab,var(--text) 10%,transparent)}
  .header-ctas > .btn{display:none}
  .team-grid{grid-template-columns:1fr}
  /* Stack grids for narrow viewports */
  .features .feature-grid,.security .trust-points{grid-template-columns:1fr}
  /* Footer columns collapse vertically */
  .footer-inner{flex-direction:column;align-items:center;text-align:center}
  .footer-links{justify-items:center}
}

/* Compact phone layout and extra-small tweaks */
@media (max-width:480px){
  .container{padding:0 16px}
  .header-inner{min-height:56px}
  .hero-inner{gap:16px}
  .hero-visual{min-height:260px}
  .cta-row{flex-direction:column;gap:12px}
  .cta-row .btn{width:100%}
  .contact-form{flex-direction:column;align-items:stretch}
  .contact-form input,.contact-form button{width:100%}
  .footer-inner{flex-direction:column;align-items:flex-start}
}

/* Very small handsets */
@media (max-width:360px){
  /* Scale headings and spacing to avoid overflow on narrow phones */
  .display{font-size:clamp(2rem,8vw,3.4rem)}
  .h1{font-size:clamp(1.6rem,6vw,2.2rem)}
  .section{padding:clamp(40px,12vw,96px) 0}
  .header-inner{gap:16px}
}

/* Wide and ultra‑wide displays */
@media (min-width:1440px){
  /* Allow content to breathe a bit more on large viewports */
  .container{max-width:1320px}
}
@media (min-width:1600px){
  /* Slightly wider container on very large displays */
  .container{max-width:1400px}
}
@media (min-width:1920px){
  /* Use additional width on TV‑scale viewports */
  .container{max-width:1600px}
}

@media (min-width:2560px){
  /* Expand layout on 2.5K+ displays without altering design proportions */
  .container{max-width:1800px}
}

@media (min-width:3840px){
  /* Ultra‑wide 4K displays */
  .container{max-width:2000px}
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  body,
  .device,
  .feature-card,
  .trust-card,
  .chart-card,
  .team-card,
  .reveal,
  .section[data-transition],
  .progress,
  .nav-list{transition:none !important}

  /* ensure elements are visible without entrance animations */
  .section[data-transition],
  .feature-card,
  .trust-card,
  .chart-card,
  .team-card,
  .reveal{transform:none !important;opacity:1 !important}
  :target::after{animation:none !important;transform:none !important;opacity:1 !important}
}

/* ===== Modal & Form (premium UI) ===== */
.modal-open, .nav-open { overflow: hidden; }

.modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
}
.modal[hidden] { display: none !important; }

.modal__backdrop {
  position: absolute; inset: 0;
  background: var(--bg);
  background: color-mix(in oklab, var(--bg) 70%, black 20%);
  backdrop-filter: blur(8px) saturate(120%);
}
.modal__dialog {
  position: relative;
  width: min(720px, 92vw);
  margin: 8vh auto;
  border-radius: 16px;
  background: var(--bg-elev);
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 40px 80px rgba(0,0,0,.5);
  padding: 20px;
  max-height: 84vh;
  overflow: auto;
}
.modal__header { margin-bottom: 8px; }
.modal__close {
  position: absolute; top: 8px; right: 10px;
  width: 40px; height: 40px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.1);
  background: rgba(255,255,255,.04);
  color: var(--text);
  cursor: pointer;
}
.modal__close:hover { background: rgba(255,255,255,.08); }

/* Form layout */
.modal__form { display: grid; gap: 14px; }
.form__row {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
}
.form__field { display: grid; gap: 6px; }
.form__field--full { grid-column: 1 / -1; }
.form__actions { display: flex; gap: 10px; align-items: center; }

label { font-weight: 600; }
input, select, textarea {
  appearance: none;
  width: 100%; min-height: 44px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.06);
  color: var(--text);
  transition: border-color .2s var(--ease), box-shadow .2s var(--ease), background .2s var(--ease);
}
textarea { min-height: 120px; resize: vertical; }
input::placeholder, textarea::placeholder { color: color-mix(in oklab, var(--muted) 80%, transparent); }

input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: none;
  border-color: rgba(var(--ring), .9);
  box-shadow: 0 0 0 3px rgba(var(--ring), .25);
  background: rgba(255,255,255,.08);
}

  .checkbox { display: grid; grid-auto-flow: column; gap: 8px; align-items: start; cursor: pointer; }
.checkbox input {
  appearance: auto;
  width: 18px;
  height: 18px;
  min-height: 18px;
  margin-top: 3px;
  background: initial;
  border: initial;
}
.form__agree { display: grid; gap: 10px; border-top: 1px solid rgba(255,255,255,.06); padding-top: 10px; }

.field-error {
  color: #fff;
  background: color-mix(in oklab, var(--danger) 28%, transparent);
  border: 1px solid color-mix(in oklab, var(--danger) 40%, transparent);
  border-radius: 10px;
  padding: 6px 8px;
  font-size: .9rem;
}
.is-invalid input, input.is-invalid, select.is-invalid, textarea.is-invalid {
  border-color: color-mix(in oklab, var(--danger) 60%, transparent);
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--danger) 28%, transparent);
}

.form__status {
  min-height: 22px;
  color: var(--text);
}
.modal__form.is-success .form__status {
  color: color-mix(in oklab, var(--ok) 75%, var(--text));
}

/* Policies: details/summary */
.policies details {
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px;
  background: var(--bg-elev);
  box-shadow: var(--shadow);
  margin-bottom: 12px;
}
.policies summary {
  cursor: pointer;
  padding: 14px 16px;
  list-style: none;
  font-weight: 700;
  display: flex; align-items: center; gap: 10px;
}
.policies summary::-webkit-details-marker { display: none; }
.policies summary::after {
  content: '';
  width: 10px; height: 10px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
  transform: rotate(-45deg);
  margin-left: auto;
  opacity: .7;
  transition: transform .25s var(--ease);
}
.policies details[open] summary::after { transform: rotate(45deg); }
.policies .policy-body { padding: 0 16px 14px 16px; color: var(--muted); }

/* Inputs on small screens */
@media (max-width: 720px) {
  .form__row { grid-template-columns: 1fr; }
  .modal__dialog { margin: 6vh auto; width: 94vw; }
}


/* ===== Print-optimized layout ===== */
@media print {
  * {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
    color-adjust: exact;
  }
  :root {
    --bg: #ffffff; --bg-rgb:255,255,255; --bg-elev: #ffffff; --card: #ffffff; --surface: #ffffff;
    --text: #000000; --muted: #222; --chart-line: #000; --chart-grid: rgba(0,0,0,.15); --chart-label: rgba(0,0,0,.8);
  }
  body {
    background: #fff !important; color: #000 !important;
    -webkit-font-smoothing: auto;
  }
  .progress, .hero-gradient, .hero-visual canvas { display: none !important; }
  .site-header, .site-footer { border: none; box-shadow: none; }
  .btn, .switch, .footer-social, .stage-legend { display: none !important; }
  .section { padding: 24px 0 !important; break-inside: avoid; page-break-inside: avoid; }
  .container { max-width: none !important; }
  .feature-card, .chart-card, .trust-card, .team-card {
    box-shadow: none !important; border-color: #ddd !important; transform: none !important; opacity: 1 !important;
  }
  .chart { height: 220px !important; }
  details { border-color: #ddd !important; }
  summary::after { display: none !important; }
}
/* ===== Final polish: focus, anchors, forms, contrast ===== */

/* Header height token + anchor comfort scrolling */
:root {
  --header-h: 64px;
}
@media (max-width:480px){ :root{ --header-h: 56px } }
html {
  /* Useful when users navigate via hash or external links */
  scroll-padding-top: calc(var(--header-h) + 8px);
}

/* Premium focus rings for all key interactives */
:root {
  --focus-shadow: 0 0 0 3px rgba(var(--ring), .35), 0 0 0 6px rgba(255,255,255,.08);
}
:where(.btn, .nav-toggle, .theme-toggle, .legend-item, .nav-list a, .footer-links a, .social, summary,
       .team-card, input, select, textarea, button):focus-visible {
  outline: none;
  box-shadow: var(--focus-shadow);
  border-color: rgba(var(--ring), .85);
}
:where(.btn, .legend-item, .nav-list a, .footer-links a, .social):hover {
  filter: saturate(1.05) brightness(1.02);
}

/* Active nav link styling */
.nav-list a.is-active {
  color: var(--text);
  background: color-mix(in oklab,var(--text) 8%,transparent);
}

/* Form comfort & clarity */
input[type="checkbox"], input[type="radio"] { accent-color: var(--brand-purple); }
.modal__form .form__row { row-gap: 14px; }
.modal__form label + :where(input,select,textarea) { margin-top: 2px; }
.modal__form .form__actions { margin-top: 4px; }
.contact-form :where(input,button) { min-height: 44px; }

/* Details/summary hit area + spacing */
.policies summary { min-height: 44px; }
.policies .policy-body :where(h4,p,ul,ol){ margin-top: 8px; }
.policies .policy-body ul{ padding-left: 18px; }

/* Anchors that are direct hash targets get a gentle reveal to help orientation */
:target {
  scroll-margin-top: calc(var(--header-h) + 12px);
  position: relative;
}
:target::after {
  content: "";
  position: absolute;
  inset: -6px;
  border: 6px solid rgba(var(--ring), .15);
  border-radius: inherit;
  transform: scale(1);
  opacity: 0;
  animation: targetPulse .8s ease-out 1;
}
@keyframes targetPulse {
  0% { transform: scale(1); opacity: 0; }
  50% { transform: scale(1.06); opacity: .6; }
  100% { transform: scale(1.12); opacity: 0; }
}

/* High-contrast users: stronger borders & text */
@media (prefers-contrast: more) {
  .feature-card, .chart-card, .trust-card, .team-card, .contact-form, .modal__dialog, .policies details {
    border-color: color-mix(in oklab, var(--text) 30%, transparent);
  }
  .btn.primary { filter: saturate(1.1) contrast(1.05); }
  .nav-list a.is-active { background: color-mix(in oklab, var(--text) 12%, transparent); }
}

/* Small niceties */
.hero-bullets li::marker { color: var(--brand-teal); }
.footer-links a:focus-visible { text-decoration: underline; }
