:root{
    --navy-950:#070D18;
    --navy-900:#0A1628;
    --navy-800:#101F38;
    --navy-700:#162a4a;
    --line:#22344f;
    --cyan:#3DCBFF;
    --cyan-dim:#1f7a99;
    --amber:#F2A65A;
    --amber-dim:#7a5630;
    --ink:#F5F7FA;
    --slate:#8B98AC;
    --slate-dim:#5c6a82;
    --radius:14px;
    --maxw:1180px;
  }

  *{margin:0;padding:0;box-sizing:border-box;}

  html{scroll-behavior:smooth;}

  body{
    background:var(--navy-950);
    color:var(--ink);
    font-family:'Inter',sans-serif;
    line-height:1.55;
    overflow-x:hidden;
  }

  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto;}
    *{animation-duration:0.001s !important; transition-duration:0.001s !important;}
  }

  h1,h2,h3,h4{
    font-family:'Space Grotesk',sans-serif;
    font-weight:600;
    letter-spacing:-0.01em;
    line-height:1.1;
  }

  .mono{
    font-family:'IBM Plex Mono',monospace;
    letter-spacing:0.04em;
    text-transform:uppercase;
    font-size:0.72rem;
  }

  a{color:inherit;text-decoration:none;}

  img{display:block;max-width:100%;}

  .wrap{
    max-width:var(--maxw);
    margin:0 auto;
    padding:0 32px;
  }

  section{position:relative;}

  /* ---------- Focus visibility ---------- */
  a:focus-visible, button:focus-visible{
    outline:2px solid var(--cyan);
    outline-offset:3px;
    border-radius:4px;
  }

  /* ================= NAV ================= */
  header{
    position:fixed;
    top:0;left:0;right:0;
    z-index:100;
    background:rgba(7,13,24,0.78);
    backdrop-filter:blur(10px);
    border-bottom:1px solid transparent;
    transition:border-color 0.3s ease, background 0.3s ease;
  }
  header.scrolled{
    border-color:var(--line);
  }
  nav.wrap{
    display:flex;
    align-items:center;
    justify-content:space-between;
    height:72px;
  }
  .brand{
    display:flex;
    align-items:center;
    gap:10px;
    font-family:'Space Grotesk',sans-serif;
    font-weight:700;
    font-size:1.15rem;
  }
  .brand-mark{
    width:26px;height:26px;
    flex-shrink:0;
  }
  .navlinks{
    display:flex;
    gap:36px;
    font-size:0.92rem;
    color:var(--slate);
  }
  .navlinks a{transition:color 0.2s ease;}
  .navlinks a:hover{color:var(--ink);}
  .nav-cta{
    border:1px solid var(--cyan-dim);
    color:var(--cyan);
    padding:9px 20px;
    border-radius:999px;
    font-size:0.88rem;
    font-weight:500;
    transition:background 0.2s ease, color 0.2s ease;
    white-space:nowrap;
  }
  .nav-cta:hover{background:var(--cyan);color:var(--navy-950);}
  .navlinks-mobile-toggle{display:none;}

  @media (max-width: 860px){
    .navlinks{display:none;}
    nav.wrap{height:64px;}
  }

  /* ================= HERO ================= */
  .hero{
    padding:168px 0 120px;
    position:relative;
  }
  .hero-grid{
    display:grid;
    grid-template-columns:1.05fr 0.95fr;
    gap:56px;
    align-items:center;
  }
  @media (max-width: 940px){
    .hero-grid{grid-template-columns:1fr; gap:64px;}
    .hero{padding:140px 0 80px;}
  }

  .eyebrow{
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:var(--cyan);
    margin-bottom:22px;
  }
  .eyebrow::before{
    content:'';
    width:6px;height:6px;
    border-radius:50%;
    background:var(--cyan);
    box-shadow:0 0 0 4px rgba(61,203,255,0.18);
  }

  .hero h1{
    font-size:clamp(2.4rem, 4.6vw, 3.6rem);
    margin-bottom:22px;
  }
  .hero h1 .accent{color:var(--cyan);}

  .hero p.lead{
    font-size:1.1rem;
    color:var(--slate);
    max-width:520px;
    margin-bottom:34px;
  }

  .hero-ctas{
    display:flex;
    gap:16px;
    flex-wrap:wrap;
  }

  .btn-primary{
    background:var(--cyan);
    color:var(--navy-950);
    padding:14px 28px;
    border-radius:999px;
    font-weight:600;
    font-size:0.96rem;
    display:inline-flex;
    align-items:center;
    gap:8px;
    transition:transform 0.15s ease, box-shadow 0.2s ease;
    border:none;
    cursor:pointer;
  }
  .btn-primary:hover{
    transform:translateY(-2px);
    box-shadow:0 8px 24px rgba(61,203,255,0.25);
  }
  .btn-secondary{
    border:1px solid var(--line);
    color:var(--ink);
    padding:14px 26px;
    border-radius:999px;
    font-weight:500;
    font-size:0.96rem;
    transition:border-color 0.2s ease, background 0.2s ease;
  }
  .btn-secondary:hover{
    border-color:var(--slate-dim);
    background:var(--navy-800);
  }

  .hero-stats{
    display:flex;
    gap:36px;
    margin-top:52px;
    flex-wrap:wrap;
  }
  .hero-stat .num{
    font-family:'Space Grotesk',sans-serif;
    font-size:1.9rem;
    font-weight:700;
    color:var(--ink);
  }
  .hero-stat .label{
    font-family:'IBM Plex Mono',monospace;
    font-size:0.68rem;
    letter-spacing:0.04em;
    text-transform:uppercase;
    color:var(--slate-dim);
    margin-top:4px;
  }

  /* ---- Hero visual: animated wayfinding path ---- */
  .hero-visual{
    position:relative;
    aspect-ratio:1/1;
    max-width:480px;
    margin:0 auto;
  }
  .hero-visual svg{width:100%;height:100%;}

  .hero-visual-image{
    aspect-ratio:1/1;
    max-width:520px;
    border-radius:18px;
    overflow:hidden;
    border:1px solid rgba(61,203,255,0.18);
    box-shadow:0 22px 70px rgba(0,0,0,0.38);
    background:var(--navy-950);
  }
  .hero-visual-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
  }

  .grid-dot{fill:var(--line);}
  .floorplan rect,
  .floorplan path{
    fill:none;
    stroke:rgba(139,152,172,0.28);
    stroke-width:1.4;
    vector-effect:non-scaling-stroke;
  }
  .floorplan rect{
    fill:rgba(16,31,56,0.26);
  }
  .rooms rect{
    fill:rgba(16,31,56,0.18);
  }
  .room-label{
    fill:rgba(139,152,172,0.42);
    font-size:7px;
  }
  .route-glow{
    fill:none;
    stroke:rgba(61,203,255,0.16);
    stroke-width:11;
    stroke-linecap:round;
    stroke-linejoin:round;
  }
  .route-path{
    fill:none;
    stroke:var(--cyan);
    stroke-width:2.8;
    stroke-linecap:round;
    stroke-linejoin:round;
    stroke-dasharray:6 8;
    stroke-dashoffset:1000;
    animation:drawRoute 3.2s ease-out forwards infinite;
  }
  @keyframes drawRoute{
    0%{stroke-dashoffset:1000;}
    55%{stroke-dashoffset:0;}
    100%{stroke-dashoffset:0;}
  }
  .pin-pulse{
    animation:pulse 2.4s ease-in-out infinite;
    transform-origin:center;
  }
  @keyframes pulse{
    0%,100%{opacity:0.35; r:14;}
    50%{opacity:0; r:26;}
  }
  .origin-dot{fill:var(--slate);}
  .dest-dot{fill:var(--cyan);}
  .floor-label{
    font-family:'IBM Plex Mono', monospace;
    font-size:9px;
    fill:var(--slate-dim);
    letter-spacing:0.5px;
  }

  /* ================= SECTION SHARED ================= */
  .section{
    padding:108px 0;
    border-top:1px solid var(--line);
  }
  .section-head{
    max-width:680px;
    margin-bottom:64px;
  }
  .section-head.center{
    margin-left:auto;
    margin-right:auto;
    text-align:center;
  }
  .section-eyebrow{
    color:var(--cyan);
    margin-bottom:14px;
    display:block;
  }
  .section-head h2{
    font-size:clamp(1.7rem, 3vw, 2.3rem);
    margin-bottom:16px;
  }
  .section-head p{
    color:var(--slate);
    font-size:1.04rem;
  }

  /* ================= HOW IT WORKS ================= */
  .pipeline{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:0;
    position:relative;
  }
  @media (max-width:880px){
    .pipeline{grid-template-columns:1fr; gap:28px;}
  }
  .pipeline::before{
    content:'';
    position:absolute;
    top:34px;
    left:0;right:0;
    height:1px;
    background:repeating-linear-gradient(to right, var(--line) 0 8px, transparent 8px 16px);
    z-index:0;
  }
  @media (max-width:880px){.pipeline::before{display:none;}}
  .pipe-step{
    position:relative;
    z-index:1;
    padding-right:24px;
  }
  .pipe-num{
    width:68px;height:68px;
    border-radius:50%;
    background:var(--navy-900);
    border:1px solid var(--line);
    display:flex;
    align-items:center;
    justify-content:center;
    font-family:'IBM Plex Mono',monospace;
    color:var(--cyan);
    font-size:0.85rem;
    margin-bottom:22px;
  }
  .pipe-step h4{
    font-size:1.08rem;
    margin-bottom:10px;
  }
  .pipe-step p{
    color:var(--slate);
    font-size:0.93rem;
  }

  /* ================= BENEFITS (org / patient split) ================= */
  .benefits-split{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:28px;
  }
  @media (max-width:780px){.benefits-split{grid-template-columns:1fr;}}

  .benefit-card{
    background:var(--navy-900);
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:36px;
  }
  .benefit-card .mono{color:var(--slate-dim); display:block; margin-bottom:8px;}
  .benefit-card h3{font-size:1.3rem; margin-bottom:20px;}
  .benefit-list{list-style:none;}
  .benefit-list li{
    display:flex;
    gap:12px;
    padding:13px 0;
    border-top:1px solid var(--line);
    font-size:0.95rem;
    color:var(--ink);
  }
  .benefit-list li:first-child{border-top:none;}
  .benefit-list li .tick{
    color:var(--cyan);
    flex-shrink:0;
    margin-top:2px;
  }
  .benefit-list li span.body{color:var(--slate);}

  /* ================= STAT BAND ================= */
  .stat-band{
    background:var(--navy-900);
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
    padding:72px 0;
  }
  .stat-band-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:32px;
    text-align:center;
  }
  @media (max-width:780px){.stat-band-grid{grid-template-columns:repeat(2,1fr);}}
  .stat-band .num{
    font-family:'Space Grotesk',sans-serif;
    font-size:2.4rem;
    font-weight:700;
    color:var(--cyan);
  }
  .stat-band .label{
    font-family:'IBM Plex Mono',monospace;
    font-size:0.68rem;
    text-transform:uppercase;
    letter-spacing:0.04em;
    color:var(--slate);
    margin-top:8px;
  }

  /* ================= USE CASES ================= */
  .usecase-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:24px;
  }
  @media (max-width:920px){.usecase-grid{grid-template-columns:1fr 1fr;}}
  @media (max-width:620px){.usecase-grid{grid-template-columns:1fr;}}

  .usecase-card{
    background:var(--navy-900);
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:28px;
    transition:border-color 0.2s ease, transform 0.2s ease;
  }
  .usecase-card:hover{
    border-color:var(--cyan-dim);
    transform:translateY(-3px);
  }
  .usecase-tag{
    display:inline-block;
    font-family:'IBM Plex Mono',monospace;
    font-size:0.65rem;
    text-transform:uppercase;
    letter-spacing:0.04em;
    color:var(--cyan);
    border:1px solid var(--cyan-dim);
    padding:4px 10px;
    border-radius:999px;
    margin-bottom:18px;
  }
  .usecase-card h4{font-size:1.05rem; margin-bottom:10px;}
  .usecase-card p{color:var(--slate); font-size:0.9rem;}

  /* ================= ACCESSIBILITY / SENSORY+ ================= */
  .sensory-section{
    background:radial-gradient(ellipse at top right, rgba(242,166,90,0.06), transparent 60%), var(--navy-950);
  }
  .sensory-layout{
    display:grid;
    grid-template-columns:0.95fr 1.05fr;
    gap:64px;
    align-items:center;
  }
  @media (max-width:940px){.sensory-layout{grid-template-columns:1fr; gap:48px;}}

  .sensory-eyebrow{color:var(--amber); margin-bottom:14px; display:block;}
  .sensory-section h2{font-size:clamp(1.7rem,3vw,2.3rem); margin-bottom:18px;}
  .sensory-section .lead{color:var(--slate); font-size:1.04rem; margin-bottom:36px; max-width:480px;}

  .sense-toggles{
    display:flex;
    gap:10px;
    margin-bottom:28px;
  }
  .sense-btn{
    background:var(--navy-900);
    border:1px solid var(--line);
    color:var(--slate);
    padding:10px 18px;
    border-radius:999px;
    font-size:0.88rem;
    font-weight:500;
    cursor:pointer;
    display:flex;
    align-items:center;
    gap:8px;
    transition:all 0.2s ease;
  }
  .sense-btn[aria-pressed="true"]{
    background:rgba(242,166,90,0.12);
    border-color:var(--amber);
    color:var(--amber);
  }
  .sense-btn:hover{border-color:var(--slate-dim);}

  .sensory-note{
    color:var(--slate-dim);
    font-size:0.85rem;
    border-left:2px solid var(--amber-dim);
    padding-left:14px;
  }

  /* Sensory demo card */
  .sensory-demo{
    background:var(--navy-900);
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:38px;
    position:relative;
    overflow:hidden;
    min-height:340px;
  }
  .demo-header{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    margin-bottom:28px;
  }
  .demo-header .mono{color:var(--slate-dim);}
  .demo-dest{
    font-family:'Space Grotesk',sans-serif;
    font-size:1.15rem;
    margin-top:6px;
  }
  .demo-body{min-height:180px;}
  .demo-instruction{
    font-size:1.4rem;
    font-family:'Space Grotesk',sans-serif;
    transition:opacity 0.3s ease;
    margin-bottom:18px;
  }
  .demo-detail{
    color:var(--slate);
    font-size:0.92rem;
    line-height:1.6;
  }
  .demo-visual-row{
    display:flex;
    gap:10px;
    margin-top:22px;
  }
  .pulse-chip{
    width:14px;height:14px;
    border-radius:50%;
    background:var(--amber);
    animation:chipPulse 1.4s ease-in-out infinite;
  }
  .pulse-chip:nth-child(2){animation-delay:0.2s;}
  .pulse-chip:nth-child(3){animation-delay:0.4s;}
  @keyframes chipPulse{
    0%,100%{opacity:0.25; transform:scale(0.85);}
    50%{opacity:1; transform:scale(1.1);}
  }
  .demo-visual-row.hidden{display:none;}

  /* ================= ROADMAP STRIP ================= */
  .roadmap-strip{
    display:flex;
    gap:0;
    border:1px solid var(--line);
    border-radius:var(--radius);
    overflow:hidden;
  }
  @media (max-width:780px){.roadmap-strip{flex-direction:column;}}
  .roadmap-col{
    flex:1;
    padding:32px;
    border-right:1px solid var(--line);
  }
  @media (max-width:780px){
    .roadmap-col{border-right:none; border-bottom:1px solid var(--line);}
  }
  .roadmap-col:last-child{border-right:none; border-bottom:none;}
  .roadmap-col .mono{color:var(--cyan); display:block; margin-bottom:6px;}
  .roadmap-col h4{font-size:1.1rem; margin-bottom:14px;}
  .roadmap-col ul{list-style:none; color:var(--slate); font-size:0.88rem;}
  .roadmap-col ul li{padding:5px 0;}

  /* ================= TEAM ================= */
  .team-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:28px;
  }
  @media (max-width:920px){.team-grid{grid-template-columns:repeat(2,1fr);}}
  @media (max-width:560px){.team-grid{grid-template-columns:1fr;}}

  .team-card{
    text-align:left;
  }
  .team-photo{
    width:100%;
    aspect-ratio:1/1;
    border-radius:var(--radius);
    background:var(--navy-800);
    border:1px solid var(--line);
    margin-bottom:18px;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
  }
  .team-photo img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
  }
  .team-photo .initials{
    font-family:'Space Grotesk',sans-serif;
    font-size:1.8rem;
    color:var(--slate-dim);
  }
  .team-card h4{font-size:1.05rem; margin-bottom:4px;}
  .team-card .role{
    font-family:'IBM Plex Mono',monospace;
    font-size:0.7rem;
    text-transform:uppercase;
    letter-spacing:0.03em;
    color:var(--cyan);
    margin-bottom:14px;
    display:block;
  }
  .team-card p{color:var(--slate); font-size:0.88rem;}

  /* ================= CONTACT / FOOTER CTA ================= */
  .cta-section{
    text-align:center;
    padding:120px 0;
  }
  .cta-section h2{
    font-size:clamp(2rem,4vw,2.8rem);
    margin-bottom:20px;
  }
  .cta-section p{
    color:var(--slate);
    max-width:480px;
    margin:0 auto 40px;
    font-size:1.05rem;
  }

  footer{
    border-top:1px solid var(--line);
    padding:48px 0;
  }
  .footer-row{
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap;
    gap:20px;
  }
  .footer-brand{
    display:flex;
    align-items:center;
    gap:10px;
    font-family:'Space Grotesk',sans-serif;
    font-weight:600;
  }
  footer .copyright{
    color:var(--slate-dim);
    font-size:0.82rem;
  }
  .footer-links{
    display:flex;
    gap:28px;
    font-size:0.88rem;
    color:var(--slate);
  }
  .footer-links a:hover{color:var(--cyan);}

  /* scroll reveal */
  .reveal{
    opacity:0;
    transform:translateY(16px);
    transition:opacity 0.6s ease, transform 0.6s ease;
  }
  .reveal.in{
    opacity:1;
    transform:translateY(0);
  }