/* ============ DESIGN SYSTEM ============ */
:root{
  --blue:#0F62FE; --blue-70:#0043CE; --blue-30:#78A9FF; --blue-10:#EDF5FF;
  --navy:#001D36; --navy-2:#00294D;
  --graphite:#161616; --gray-90:#262626; --gray-80:#393939;
  --gray-70:#525252; --gray-60:#6F6F6F; --gray-50:#8D8D8D;
  --gray-30:#C6C6C6; --gray-20:#E0E0E0; --gray-10:#F4F4F4;
  --white:#FFFFFF;
  --emerald:#24A148; --emerald-lt:#42BE65; --purple:#A56EFF; --gold:#D2A106;
  --cyan:#1192E8; --cyan-lt:#33B1FF;
  --ff:'IBM Plex Sans',system-ui,-apple-system,sans-serif;
  --fm:'IBM Plex Mono',ui-monospace,monospace;
  --fs:'IBM Plex Serif',Georgia,serif;
  --ease:cubic-bezier(.16,.84,.44,1);
  --pad:clamp(20px,5vw,88px);
  --maxw:1360px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--ff);background:var(--white);color:var(--graphite);
  font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
::selection{background:var(--blue);color:#fff}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--pad);width:100%}
.sec{padding:clamp(72px,10vw,140px) 0;position:relative}
.dark{background:var(--navy);color:var(--white)}
.deep{background:var(--graphite);color:var(--white)}
.lgray{background:var(--gray-10)}

/* --- Type scale --- */
h1,h2,h3,h4{font-weight:600;letter-spacing:-.025em;line-height:1.08}
.h-hero{font-size:clamp(2.4rem,5.6vw,4.6rem);font-weight:600;letter-spacing:-.038em;line-height:1.03}
.h-sec{font-size:clamp(1.9rem,3.6vw,3.1rem);letter-spacing:-.032em;line-height:1.08}
.h-sub{font-size:clamp(1.15rem,1.7vw,1.5rem);font-weight:600;letter-spacing:-.02em}
.lede{font-size:clamp(1.02rem,1.35vw,1.28rem);line-height:1.62;color:var(--gray-70);font-weight:350;max-width:66ch}
.dark .lede,.deep .lede,.cta-band .lede{color:rgba(255,255,255,.82)}
.dark .h-sec,.deep .h-sec,.whynuron .h-sec,.unify .h-sec,.cta-band .h-sec{color:#fff}
.eyebrow{font-family:var(--fm);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;
  font-weight:500;color:var(--blue);display:flex;align-items:center;gap:12px;margin-bottom:22px}
.eyebrow::before{content:"";width:26px;height:1px;background:var(--blue);flex:none}
.dark .eyebrow,.deep .eyebrow{color:var(--cyan-lt)}
.dark .eyebrow::before,.deep .eyebrow::before{background:var(--cyan-lt)}

/* --- Nav --- */
nav{position:fixed;top:0;left:0;right:0;z-index:1000;transition:background .45s var(--ease),
  border-color .45s,backdrop-filter .45s;border-bottom:1px solid transparent}
nav.scrolled{background:rgba(255,255,255,.9);backdrop-filter:saturate(180%) blur(18px);
  border-bottom-color:var(--gray-20)}
.navi{display:flex;align-items:center;justify-content:space-between;height:70px}
.logo{height:28px;width:auto;transition:filter .4s var(--ease)}
/* Transparent PNG: on dark backgrounds render the mark in white so it stays legible */
nav:not(.scrolled) .logo{filter:brightness(0) invert(1)}
.nlinks{display:flex;gap:38px;align-items:center;margin-left:auto;margin-right:32px}
.nlinks a{font-size:.9rem;font-weight:450;color:var(--graphite);position:relative;padding:4px 0;opacity:.85}
nav:not(.scrolled) .nlinks a{color:#fff}
.nlinks a::after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:1.5px;
  background:var(--blue);transition:width .32s var(--ease)}
nav:not(.scrolled) .nlinks a::after{background:var(--cyan-lt)}
.nlinks a:hover{opacity:1}.nlinks a:hover::after{width:100%}
.btn{display:inline-flex;align-items:center;gap:10px;font-size:.92rem;font-weight:500;
  padding:13px 24px;border-radius:6px;border:1px solid transparent;cursor:pointer;
  transition:all .3s var(--ease);font-family:var(--ff);position:relative;overflow:hidden}
.btn-p{background:var(--blue);color:#fff}
.btn-p:hover{background:var(--blue-70);transform:translateY(-2px);
  box-shadow:0 10px 30px -8px rgba(15,98,254,.55)}
.btn-g{border-color:var(--gray-30);color:var(--graphite);background:var(--white)}
.btn-g:hover{border-color:var(--blue);color:var(--blue);background:var(--blue-10);transform:translateY(-2px)}
/* On dark backgrounds: frosted panel so the CTA is always legible, not just on hover */
nav:not(.scrolled) .btn-g,.dark .btn-g,.deep .btn-g,.cta-band .btn-g,.hero .btn-g{
  background:rgba(255,255,255,.97);border-color:#fff;color:var(--navy);font-weight:550}
nav:not(.scrolled) .btn-g:hover,.dark .btn-g:hover,.deep .btn-g:hover,
.cta-band .btn-g:hover,.hero .btn-g:hover{
  background:var(--blue-10);border-color:var(--blue-30);color:var(--blue-70);
  transform:translateY(-2px);box-shadow:0 12px 32px -10px rgba(0,0,0,.5)}
.btn .ar{transition:transform .3s var(--ease)}
.btn:hover .ar{transform:translateX(4px)}
.burger{display:none;background:none;border:0;cursor:pointer;padding:8px;flex-direction:column;gap:5px}
.burger span{width:22px;height:1.6px;background:var(--graphite);transition:.3s;display:block}
nav:not(.scrolled) .burger span{background:#fff}
.mobile{position:fixed;inset:70px 0 auto 0;background:#fff;border-bottom:1px solid var(--gray-20);
  padding:24px var(--pad) 34px;display:none;flex-direction:column;gap:2px;z-index:999;
  transform:translateY(-12px);opacity:0;transition:.3s var(--ease)}
.mobile.on{transform:none;opacity:1}
.mobile a{padding:15px 0;font-size:1.05rem;font-weight:500;border-bottom:1px solid var(--gray-10)}

/* --- HERO --- */
.hero{min-height:100vh;min-height:100svh;background:var(--navy);color:#fff;
  display:flex;align-items:center;position:relative;overflow:hidden;padding:120px 0 70px}
#particles{position:absolute;inset:0;width:100%;height:100%}
.hero::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(120% 90% at 78% 30%,rgba(17,146,232,.20),transparent 58%),
  radial-gradient(90% 70% at 8% 88%,rgba(15,98,254,.20),transparent 60%),
  linear-gradient(to bottom,rgba(0,29,54,.35) 0%,transparent 22%,rgba(0,29,54,.55) 100%)}
.hgrid{position:absolute;inset:0;opacity:.28;
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),
  linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:76px 76px;
  -webkit-mask-image:radial-gradient(80% 70% at 50% 45%,#000,transparent);
  mask-image:radial-gradient(80% 70% at 50% 45%,#000,transparent)}
.hero .wrap{position:relative;z-index:3}
.hinner{max-width:1000px}
.htag{display:inline-flex;align-items:center;gap:10px;font-family:var(--fm);font-size:.7rem;
  letter-spacing:.14em;text-transform:uppercase;padding:8px 16px;border-radius:100px;
  border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.05);
  backdrop-filter:blur(10px);margin-bottom:30px;color:rgba(255,255,255,.9)}
.pulse{width:6px;height:6px;border-radius:50%;background:var(--emerald-lt);
  box-shadow:0 0 0 0 rgba(66,190,101,.7);animation:pl 2.4s infinite}
@keyframes pl{70%{box-shadow:0 0 0 9px rgba(66,190,101,0)}100%{box-shadow:0 0 0 0 rgba(66,190,101,0)}}
.hero h1 .ln{display:block;overflow:hidden}
.hero h1 .ln span{display:block;transform:translateY(105%);
  animation:up 1.05s var(--ease) forwards}
@keyframes up{to{transform:none}}
.grad{background:linear-gradient(96deg,#fff 8%,var(--cyan-lt) 62%,var(--blue-30) 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.hero .lede{color:rgba(255,255,255,.78);margin-top:30px;max-width:60ch;font-size:clamp(1rem,1.3vw,1.2rem)}
.hcta{display:flex;gap:14px;margin-top:44px;flex-wrap:wrap}
.scroll-c{position:absolute;bottom:36px;left:50%;transform:translateX(-50%);z-index:4;
  font-family:var(--fm);font-size:.62rem;letter-spacing:.2em;color:rgba(255,255,255,.42);
  display:flex;flex-direction:column;align-items:center;gap:10px}
.scroll-c i{width:1px;height:36px;background:linear-gradient(var(--cyan-lt),transparent);
  animation:sc 2s infinite}
@keyframes sc{0%,100%{opacity:.3;transform:scaleY(.6)}50%{opacity:1;transform:scaleY(1)}}

/* --- Metrics bar --- */
.mbar{border-top:1px solid rgba(255,255,255,.1);margin-top:clamp(48px,7vw,84px);
  padding-top:34px;display:grid;grid-template-columns:repeat(4,1fr);gap:8px;position:relative;z-index:3}
.mbar .m{padding-right:20px;border-right:1px solid rgba(255,255,255,.1)}
.mbar .m:last-child{border-right:0}
.mnum{font-size:clamp(1.5rem,3vw,2.55rem);font-weight:600;letter-spacing:-.03em;line-height:1;
  background:linear-gradient(180deg,#fff,rgba(255,255,255,.62));-webkit-background-clip:text;
  background-clip:text;-webkit-text-fill-color:transparent;font-variant-numeric:tabular-nums}
.mlab{font-size:clamp(.94rem,1.05vw,1.05rem);color:rgba(255,255,255,.88);margin-top:14px;
  line-height:1.5;max-width:24ch;font-weight:400;letter-spacing:-.005em}

/* --- Reveal --- */
.rv{opacity:0;transform:translateY(26px);transition:opacity .85s var(--ease),transform .85s var(--ease)}
.rv.in{opacity:1;transform:none}

/* --- Grids --- */
.g2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,5vw,80px);align-items:center}
.g2-t{align-items:start}
.head{max-width:860px;margin-bottom:clamp(40px,5vw,64px)}

/* --- Platform teaser cards --- */
.tease{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.tcard{background:#fff;border:1px solid var(--gray-20);border-radius:12px;padding:34px 30px;
  transition:.4s var(--ease);position:relative;overflow:hidden}
.tcard::before{content:"";position:absolute;top:0;left:0;width:100%;height:2px;
  background:linear-gradient(90deg,var(--blue),var(--cyan));transform:scaleX(0);
  transform-origin:left;transition:transform .5s var(--ease)}
.tcard:hover{transform:translateY(-5px);box-shadow:0 22px 50px -22px rgba(0,29,54,.24);border-color:var(--blue-30)}
.tcard:hover::before{transform:scaleX(1)}
.tcard .ic{color:var(--blue);margin-bottom:20px}
.tcard h3{font-size:1.18rem;margin-bottom:12px;letter-spacing:-.02em;color:var(--navy)}
.tcard p{font-size:.95rem;color:var(--gray-70);line-height:1.65}

/* --- Segments (audience) --- */
.segs{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--gray-20);
  border:1px solid var(--gray-20);border-radius:14px;overflow:hidden}
.seg{background:#fff;padding:38px 30px 34px;transition:.45s var(--ease);position:relative;
  display:flex;flex-direction:column}
.seg::after{content:"";position:absolute;left:0;top:0;width:3px;height:100%;
  background:var(--blue);transform:scaleY(0);transform-origin:top;transition:transform .45s var(--ease)}
.seg:hover{background:var(--gray-10)}
.seg:hover::after{transform:scaleY(1)}
.seg .sn{font-family:var(--fm);font-size:.68rem;color:var(--gray-50);letter-spacing:.12em;margin-bottom:18px}
.seg h3{font-size:1.18rem;margin-bottom:12px;letter-spacing:-.02em}
.seg .sd{font-size:.9rem;color:var(--gray-70);line-height:1.6;margin-bottom:24px;
  padding-bottom:22px;border-bottom:1px solid var(--gray-20)}
/* Subgrid: each card shares the row track sizes of the parent grid, so the
   label, heading, intro and bullet list all line up across cards regardless
   of copy length. Falls back to normal flow where subgrid is unsupported. */
@media(min-width:1081px){
  .segs{grid-template-rows:auto auto auto auto}
  .seg{display:grid;grid-template-rows:subgrid;grid-row:span 4;align-content:start}
  .seg .sd{margin-bottom:0;padding-bottom:22px}
  .seg ul{padding-top:24px}
}
.seg ul{list-style:none;display:flex;flex-direction:column;gap:14px}
.seg li{font-size:.86rem;color:var(--gray-80);line-height:1.55;padding-left:19px;position:relative}
.seg li::before{content:"";position:absolute;left:0;top:8px;width:6px;height:6px;
  border-radius:1px;background:var(--blue);opacity:.5;transform:rotate(45deg)}
.seg:hover li::before{opacity:1}

/* --- Module matrix --- */
.mod{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.mcard{border-radius:10px;padding:22px 20px 24px;background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.1);transition:.4s var(--ease);cursor:default}
.mcard:hover{background:rgba(17,146,232,.1);border-color:rgba(51,177,255,.45);transform:translateY(-4px)}
.mcard h4{font-family:var(--fm);font-size:.66rem;letter-spacing:.13em;text-transform:uppercase;
  color:var(--cyan-lt);font-weight:600;padding-bottom:14px;margin-bottom:15px;
  border-bottom:1px solid rgba(255,255,255,.12)}
.mcard ul{list-style:none;display:flex;flex-direction:column;gap:9px}
.mcard li{font-size:.795rem;color:rgba(255,255,255,.68);line-height:1.4;transition:color .25s}
.mcard:hover li{color:rgba(255,255,255,.92)}

/* --- Feature list --- */
.flist{list-style:none;display:flex;flex-direction:column;gap:2px;margin-top:8px}
.flist li{display:flex;gap:18px;padding:22px 0;border-bottom:1px solid var(--gray-20);align-items:flex-start}
.dark .flist li,.deep .flist li{border-color:rgba(255,255,255,.12)}
.flist .n{font-family:var(--fm);font-size:.7rem;color:var(--blue);padding-top:3px;flex:none}
.dark .flist .n{color:var(--cyan-lt)}
.flist p{font-size:.98rem;line-height:1.6;color:var(--gray-80)}
.dark .flist p{color:rgba(255,255,255,.78)}

/* --- Quote / mission --- */
.mission{border-left:3px solid var(--blue);padding:6px 0 6px 32px;margin-top:40px}
.mission p{font-family:var(--fs);font-size:clamp(1.25rem,2.3vw,1.85rem);line-height:1.4;
  font-weight:300;letter-spacing:-.015em}

/* --- Team --- */
.team{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--gray-20);
  border:1px solid var(--gray-20);border-radius:14px;overflow:hidden}
.tm{background:#fff;padding:30px 28px;display:flex;gap:18px;align-items:center;transition:.35s var(--ease);
  color:inherit;text-decoration:none;position:relative}
.tm:hover{background:var(--gray-10)}
.tm:focus-visible{outline:2px solid var(--blue);outline-offset:-2px;z-index:1}
.av{width:52px;height:52px;border-radius:50%;flex:none;display:grid;place-items:center;
  font-family:var(--fm);font-size:.85rem;font-weight:600;color:#fff;letter-spacing:.02em;
  background:linear-gradient(140deg,var(--navy-2),var(--blue));overflow:hidden}
.tm:nth-child(3n+2) .av{background:linear-gradient(140deg,var(--graphite),var(--cyan))}
.tm:nth-child(3n) .av{background:linear-gradient(140deg,var(--navy),var(--emerald))}
.tm h4{font-size:.98rem;letter-spacing:-.015em;margin-bottom:4px}
.tm span{font-size:.8rem;color:var(--blue);font-weight:450;line-height:1.35;display:block}
.tm > div{flex:1;min-width:0;padding-right:8px}
.tm::after{content:"";width:16px;height:16px;flex:none;margin-left:auto;opacity:.35;
  background-color:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M4.98 3.5C4.98 4.88 3.86 6 2.5 6S0 4.88 0 3.5 1.12 1 2.5 1s2.48 1.12 2.48 2.5zM.25 8.25h4.5V24H.25V8.25zM8.34 8.25h4.31v2.14h.06c.6-1.14 2.07-2.34 4.26-2.34 4.56 0 5.4 3 5.4 6.9V24h-4.5v-7.74c0-1.84-.03-4.22-2.57-4.22-2.57 0-2.96 2-2.96 4.08V24h-4.5V8.25z'/%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'%3E%3Cpath fill='%23000' d='M4.98 3.5C4.98 4.88 3.86 6 2.5 6S0 4.88 0 3.5 1.12 1 2.5 1s2.48 1.12 2.48 2.5zM.25 8.25h4.5V24H.25V8.25zM8.34 8.25h4.31v2.14h.06c.6-1.14 2.07-2.34 4.26-2.34 4.56 0 5.4 3 5.4 6.9V24h-4.5v-7.74c0-1.84-.03-4.22-2.57-4.22-2.57 0-2.96 2-2.96 4.08V24h-4.5V8.25z'/%3E%3C/svg%3E") center/contain no-repeat;
  transition:opacity .25s var(--ease),color .25s var(--ease)}
.tm:hover::after{opacity:1;color:#0A66C2}
a.tm[href*="stanford"]::after{
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M14 3h7v7h-2V6.41l-9.29 9.3-1.42-1.42 9.3-9.29H14V3zM5 5h6v2H7v10h10v-4h2v6H5V5z'/%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'%3E%3Cpath fill='%23000' d='M14 3h7v7h-2V6.41l-9.29 9.3-1.42-1.42 9.3-9.29H14V3zM5 5h6v2H7v10h10v-4h2v6H5V5z'/%3E%3C/svg%3E") center/contain no-repeat}
a.tm[href*="stanford"]:hover::after{color:var(--blue)}

/* --- Trust strip --- */
.trust{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.tr{padding:26px 24px;border-radius:10px;background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.1);transition:.35s var(--ease)}
.tr:hover{border-color:rgba(51,177,255,.4);background:rgba(255,255,255,.07)}
.tr .ic{color:var(--cyan-lt);margin-bottom:16px}
.tr h4{font-size:.95rem;margin-bottom:8px}
.tr p{font-size:.84rem;color:rgba(255,255,255,.6);line-height:1.55}

/* --- CTA / schedule (aligned two-column) --- */
.cta-band{background:linear-gradient(115deg,var(--navy) 0%,#002F57 55%,#00437A 100%);
  color:#fff;position:relative;overflow:hidden}
.cta-band .hgrid{opacity:.28}

.cta-align{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(28px,4vw,56px);align-items:start}
.cta-copy,.cta-book{display:flex;flex-direction:column;justify-content:flex-start;min-height:0}
.cta-copy .h-sec{max-width:17ch;color:#fff}
.cta-copy .lede{margin-top:20px;max-width:40ch;color:rgba(255,255,255,.78)}
.cta-eyebrow{color:var(--cyan-lt)!important;margin-bottom:18px}
.cta-eyebrow::before{background:var(--cyan-lt)!important}

.cta-steps{list-style:none;margin:clamp(26px,3.5vw,36px) 0 0;padding:0;
  display:flex;flex-direction:column;border-top:1px solid rgba(255,255,255,.14)}
.cta-steps li{display:grid;grid-template-columns:44px 1fr;gap:12px;align-items:start;
  padding:16px 0;border-bottom:1px solid rgba(255,255,255,.12)}
.cta-step-n{font-family:var(--fm);font-size:.95rem;letter-spacing:.06em;
  font-weight:600;color:rgba(120,169,255,.55);line-height:1.2;padding-top:3px}
.cta-steps strong{display:block;font-size:.98rem;font-weight:600;color:#fff;
  letter-spacing:-.015em;margin-bottom:4px}
.cta-steps span{display:block;font-size:.88rem;line-height:1.5;color:rgba(255,255,255,.6)}

.book-card{width:100%;background:#fff;border-radius:16px;overflow:hidden;
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 28px 70px -30px rgba(0,8,24,.55);line-height:0}
#calendlyEmbed{width:100%;height:680px;background:#fff}
#calendlyEmbed iframe{display:block;width:100%!important;height:100%!important;border:0;
  background:#fff}

@media(max-width:900px){
  .cta-align{grid-template-columns:1fr;gap:32px}
  #calendlyEmbed{height:720px}
}
@media(max-width:520px){
  .cta-steps li{grid-template-columns:36px 1fr;gap:10px}
  #calendlyEmbed{height:760px}
}

/* --- Footer --- */
footer{background:var(--graphite);color:rgba(255,255,255,.62);padding:76px 0 34px;font-size:.88rem}
.fgrid{display:grid;grid-template-columns:1.6fr repeat(3,1fr);gap:44px;
  padding-bottom:48px;border-bottom:1px solid rgba(255,255,255,.12)}
footer h5{font-family:var(--fm);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(255,255,255,.42);margin-bottom:20px;font-weight:500}
footer ul{list-style:none;display:flex;flex-direction:column;gap:13px}
footer a:hover{color:#fff}
.fbot{padding-top:26px;display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;
  font-size:.78rem;color:rgba(255,255,255,.4)}
footer .logo{height:26px;filter:brightness(0) invert(1);margin-bottom:22px}

/* --- SVG graphic helpers --- */
.flow{width:100%;height:auto;overflow:visible}
.dash{stroke-dasharray:9 8;animation:dashmove 1.1s linear infinite}
@keyframes dashmove{to{stroke-dashoffset:-34}}
.blip{animation:blip 3s var(--ease) infinite}
@keyframes blip{0%,100%{opacity:.25}50%{opacity:1}}
.panel{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);
  border-radius:14px;padding:clamp(22px,3vw,38px)}
.lgray .panel{background:#fff;border-color:var(--gray-20)}


/* --- Hero photographic layer --- */
.hero-bg{position:absolute;inset:0;background-image:url("../images/hero-bg.jpg");
  background-size:cover;background-position:60% center;opacity:.72;
  transform:scale(1.06);animation:heroIn 2.2s var(--ease) forwards;will-change:transform}
@keyframes heroIn{to{transform:scale(1)}}
.hero::before{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(100deg,rgba(0,20,38,.94) 0%,rgba(0,24,45,.78) 42%,rgba(0,29,54,.42) 72%,rgba(0,29,54,.55) 100%)}
#particles{z-index:2}
.hgrid{z-index:2}

/* --- Control tower layout --- */
.ct{display:grid;grid-template-columns:1fr;gap:24px}
.ct-flow{overflow-x:auto}
/* Keep the flow diagram intact under Windows High Contrast / forced-colors mode.
   Without this the browser strips fill-opacity and the whole SVG collapses. */
@media (forced-colors: active){
  .ct-flow svg, .ct-flow svg *{forced-color-adjust:none}
  .ct-flow .card{fill:#0d2138;stroke:#5a8fd0}
  .ct-flow .clbl{fill:#ffffff}
  .ct-flow .kpi-n{fill:#ffffff}
  .ct-flow .kpi-l{fill:#c9d6e8}
  .ct-flow .dcap{fill:#c9d6e8}
  .ct-flow .np-t{fill:#ffffff}
  .ct-flow .np-s{fill:#c9d6e8}
  .ct-flow .tile-t{fill:#ffffff}
}
.ct-flow svg.flow{opacity:0;transition:opacity .5s ease}
.fonts-ready .ct-flow svg.flow,.no-js .ct-flow svg.flow{opacity:1}
.shot{position:relative;border-radius:14px;overflow:hidden;
  border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.04);
  box-shadow:0 40px 90px -40px rgba(0,0,0,.75)}
.shot img{width:100%;height:auto;display:block}
.shot::after{content:"";position:absolute;inset:0;pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);border-radius:14px}
.shot figcaption{font-family:var(--fm);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;
  color:rgba(255,255,255,.55);padding:14px 20px;border-top:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.25);position:relative;z-index:2}

/* --- Generic figure --- */
.fig{border-radius:14px;overflow:hidden;border:1px solid var(--gray-20);background:var(--gray-10)}
.fig img{width:100%;height:auto;display:block;transition:transform .9s var(--ease)}
.fig:hover img{transform:scale(1.03)}
.fig-dark{border-color:rgba(0,29,54,.14);background:var(--navy);
  box-shadow:0 30px 70px -35px rgba(0,29,54,.5)}

/* --- Section texture band --- */
.lgray{background-color:var(--gray-10);background-image:url("../images/texture-bg.jpg");
  background-size:cover;background-position:center}

/* --- Team avatar as photo --- */
img.av{object-fit:cover;object-position:center top;background:var(--gray-20)}
.tm:hover img.av{filter:none}
img.av{filter:saturate(.92)}


/* --- Sub-head inside a merged section --- */
.subhead{margin:clamp(44px,6vw,72px) 0 clamp(28px,3.5vw,40px);
  padding-top:clamp(28px,3.5vw,38px);border-top:1px solid rgba(255,255,255,.14);
  display:flex;flex-wrap:wrap;align-items:baseline;gap:10px 28px}
.subhead h3{flex:none}
.subhead p{font-size:.98rem;line-height:1.6;color:rgba(255,255,255,.62);
  max-width:62ch;font-weight:350}
@media(max-width:760px){.subhead{display:block}.subhead p{margin-top:10px}}



/* --- "Extending AI-Powered Intelligence..." on a single line --- */
.extend-line{margin-top:clamp(40px,5vw,56px);color:#fff;font-weight:450;
  letter-spacing:-.022em;line-height:1.3;white-space:nowrap;
  font-size:clamp(.62rem,1.66vw,1.36rem)}
@media(max-width:640px){.extend-line{white-space:normal;font-size:1.02rem;line-height:1.5}}


/* --- CTA under the sectors grid --- */
.seg-cta{display:flex;justify-content:center;margin-top:clamp(36px,4.5vw,54px)}
@media(max-width:620px){.seg-cta .btn{width:100%;justify-content:center}}


.dash-img{width:100%;height:auto;display:block;background:rgba(255,255,255,.04)}

/* =============== UNIFYING LAYER SECTION =============== */
.unify{overflow:hidden}
.unify-lede{font-family:var(--fs);font-weight:300;
  font-size:clamp(1.35rem,2.6vw,2.15rem);line-height:1.34;letter-spacing:-.02em;
  max-width:26ch;color:#fff}
.unify-grid{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);
  gap:clamp(28px,4vw,56px);align-items:center;
  margin-top:clamp(44px,5.5vw,72px)}

/* --- left stack --- */
.stackcol{display:flex;flex-direction:column}
.tier{border-radius:12px;padding:22px 26px;text-align:center;
  border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.045);
  transition:.4s var(--ease)}
.tier:hover{border-color:rgba(51,177,255,.5);background:rgba(17,146,232,.09);
  transform:translateY(-2px)}
.tier h4{font-size:clamp(1.05rem,1.5vw,1.32rem);letter-spacing:-.02em;color:#fff}
.tier p{font-size:.88rem;line-height:1.5;color:rgba(255,255,255,.62);margin-top:7px}
.tier-core{background:linear-gradient(150deg,rgba(15,98,254,.20),rgba(17,146,232,.07));
  border-color:rgba(120,169,255,.38);padding:26px}
.tier-core h4{font-size:clamp(1.2rem,1.8vw,1.55rem)}
.tier-core p{color:rgba(255,255,255,.78)}
.chips{display:flex;flex-wrap:wrap;gap:9px;justify-content:center;margin-top:18px}
.chips span{font-size:.78rem;font-weight:500;padding:8px 14px;border-radius:6px;
  color:#fff;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.2);
  white-space:nowrap;transition:.3s var(--ease)}
.tier-core:hover .chips span{border-color:rgba(120,169,255,.5);background:rgba(15,98,254,.22)}

/* animated flow connector between tiers */
.connector{height:38px;display:flex;justify-content:center;align-items:center}
.connector span{width:2px;height:100%;border-radius:2px;position:relative;
  background:linear-gradient(rgba(120,169,255,.15),rgba(120,169,255,.5),rgba(120,169,255,.15));
  overflow:hidden}
.connector span::after{content:"";position:absolute;left:0;width:2px;height:12px;
  background:var(--cyan-lt);box-shadow:0 0 8px var(--cyan-lt)}
/* Existing Plants -> Nuron Enterprise: pulse travels downward */
.conn-down span::after{animation:flowdown 2.4s linear infinite}
/* New Plants -> Nuron Enterprise: pulse travels upward */
.conn-up span::after{animation:flowup 2.4s linear infinite}
@keyframes flowdown{0%{top:-14px}100%{top:100%}}
@keyframes flowup{0%{top:100%}100%{top:-14px}}

/* --- right: dashboard --- */
.shot-tower{margin:0}
.unify-cap{margin-top:18px;text-align:center;font-style:italic;
  font-size:clamp(.88rem,1.05vw,1rem);color:rgba(255,255,255,.66);line-height:1.5}

@media(max-width:900px){
  .unify-grid{grid-template-columns:1fr;gap:34px}
  .unify-lede{max-width:none}
}
@media(prefers-reduced-motion:reduce){
  .conn-down span::after,.conn-up span::after{animation:none;opacity:.6}}



/* Why Nuron: text column carries more copy, so give it extra width and
   centre the honeycomb against it rather than top-aligning. */
.whygrid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
  gap:clamp(32px,4.5vw,64px);align-items:center}
@media(max-width:900px){.whygrid{grid-template-columns:1fr;gap:38px}}

/* =============== WHY NURON — HONEYCOMB =============== */
.whynuron{overflow:hidden}
.whynuron .h-sec{font-size:clamp(1.75rem,3.1vw,2.7rem)}
.hivewrap{display:flex;align-items:center;justify-content:center}
.hive{width:100%;height:auto;max-width:640px;overflow:visible}
.hive-sub{margin-top:26px;font-size:.95rem;line-height:1.6;
  color:rgba(255,255,255,.62);max-width:46ch}
/* cells fade+scale in on reveal */
.hive .cellg{opacity:0;transform-box:fill-box;transform-origin:center;
  transform:scale(.86);
  animation:hivein .7s var(--ease) forwards;animation-delay:var(--d)}
@keyframes hivein{to{opacity:1;transform:scale(1)}}
.hive .cellg:hover .hx{fill-opacity:.42}
@media(max-width:900px){.hive{max-width:520px}}
@media(prefers-reduced-motion:reduce){
  .hive .cellg{opacity:1;transform:none;animation:none}}


/* --- About: Vision / Mission cards --- */
.vm-card{border-left:3px solid var(--blue);padding:4px 0 4px 24px}
.vm-label{font-family:var(--fm);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;
  font-weight:600;color:var(--blue);display:block;margin-bottom:8px}
.vm-text{font-family:var(--fs);font-size:clamp(1.15rem,1.8vw,1.5rem);line-height:1.4;
  font-weight:300;letter-spacing:-.015em;color:var(--graphite)}


/* --- Responsive --- */
@media(max-width:1080px){
  .segs,.mod,.trust,.team{grid-template-columns:repeat(2,1fr)}
  .fgrid{grid-template-columns:1fr 1fr}
}
@media(max-width:860px){
  .nlinks,.navi .btn{display:none}
  .burger{display:flex}.mobile{display:flex}
  .g2{grid-template-columns:1fr}
  .mbar{grid-template-columns:1fr 1fr;gap:26px 8px}
  .tease{grid-template-columns:1fr}
}
@media(max-width:860px){.hero-bg{background-position:68% center;opacity:.55}}
@media(max-width:620px){
  .segs,.mod,.trust,.team,.fgrid{grid-template-columns:1fr}
  .mbar .m{border-right:0}
  .hcta .btn{width:100%;justify-content:center}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important}
  .rv{opacity:1;transform:none}
  .hero h1 .ln span{transform:none;animation:none}
  .hero-bg{transform:none;animation:none}
}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px;border-radius:3px}

/* ===== PRODUCTS SECTION (merged) ===== */
.products{padding:clamp(72px,10vw,140px) 0;position:relative;overflow:hidden;
  background:var(--white);color:var(--graphite)}
.products .hgrid{position:absolute;inset:0;opacity:.5;pointer-events:none;
  background-image:linear-gradient(rgba(0,29,54,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(0,29,54,.05) 1px,transparent 1px);
  background-size:76px 76px;
  -webkit-mask-image:radial-gradient(80% 70% at 50% 40%,#000,transparent);
  mask-image:radial-gradient(80% 70% at 50% 40%,#000,transparent)}

.eyebrow{font-family:var(--fm);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;
  font-weight:500;color:var(--blue);display:flex;align-items:center;gap:12px;margin-bottom:22px}
.eyebrow::before{content:"";width:26px;height:1px;background:var(--blue);flex:none}
.h-sec{font-size:clamp(1.9rem,3.6vw,3.1rem);font-weight:600;letter-spacing:-.032em;
  line-height:1.08;max-width:20ch;color:var(--navy)}
.lede{font-size:clamp(1.02rem,1.35vw,1.28rem);line-height:1.62;color:var(--gray-70);
  font-weight:350;max-width:68ch;margin-top:24px}
.head{max-width:900px;margin-bottom:clamp(46px,6vw,72px);position:relative;z-index:2}


/* ---- architecture diagram ---- */
.archwrap{position:relative;z-index:2;margin:clamp(10px,3vw,30px) 0 clamp(46px,6vw,72px);
  padding:clamp(24px,3.5vw,48px);border-radius:16px;
  background:linear-gradient(180deg,#FBFCFE,#F4F7FB);border:1px solid var(--gray-20);
  box-shadow:0 24px 60px -34px rgba(0,29,54,.18)}
.arch{width:100%;height:auto;display:block;overflow:visible}
.archcap{font-family:var(--fm);font-size:.68rem;letter-spacing:.13em;text-transform:uppercase;
  color:var(--gray-60);text-align:center;margin-top:22px}
.arch .pulse{animation:archdash 2.4s linear infinite}
@keyframes archdash{to{stroke-dashoffset:0}}
@media(max-width:760px){.archwrap{overflow-x:auto}.arch{min-width:780px}}

/* ---- product grid ---- */
.pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;position:relative;z-index:2}
.pcard{position:relative;border-radius:14px;padding:34px 30px 32px;overflow:hidden;
  background:var(--white);border:1px solid var(--gray-20);
  transition:transform .45s var(--ease),border-color .45s,background .45s;
  display:flex;flex-direction:column;min-height:290px}
.pcard::before{content:"";position:absolute;top:0;left:0;width:100%;height:3px;
  background:var(--accent);transform:scaleX(0);transform-origin:left;
  transition:transform .5s var(--ease)}
.pcard::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;
  transition:opacity .5s var(--ease);
  background:radial-gradient(120% 80% at 100% 0%,color-mix(in srgb,var(--accent) 22%,transparent),transparent 60%)}
.pcard:hover{transform:translateY(-6px);border-color:color-mix(in srgb,var(--accent) 60%,transparent);
  background:var(--white);box-shadow:0 22px 50px -24px color-mix(in srgb,var(--accent) 40%,rgba(0,29,54,.3))}
.pcard:hover::before{transform:scaleX(1)}
.pcard:hover::after{opacity:1}

.pcard .top{display:flex;align-items:center;gap:14px;margin-bottom:18px}
.picon{width:44px;height:44px;border-radius:10px;flex:none;display:grid;place-items:center;
  color:var(--accent);background:color-mix(in srgb,var(--accent) 16%,transparent);
  border:1px solid color-mix(in srgb,var(--accent) 40%,transparent)}
.ptag{font-family:var(--fm);font-size:.62rem;letter-spacing:.13em;text-transform:uppercase;
  color:color-mix(in srgb,var(--accent) 68%,var(--navy));font-weight:700}
.pcard h3{font-size:1.28rem;letter-spacing:-.02em;margin-bottom:12px;line-height:1.15;color:var(--navy)}
.pcard p{font-size:.92rem;line-height:1.62;color:var(--gray-70)}
.pcard h3 .n{color:var(--navy)}

/* featured (Nuron Enterprise) spans two columns */
.pcard.feature{grid-column:span 2;
  background:linear-gradient(135deg,var(--blue-10),var(--white))}
.pcard.feature h3{font-size:1.5rem}
.pcard.feature p{font-size:.98rem;max-width:60ch}

.foot-note{margin-top:clamp(40px,5vw,60px);position:relative;z-index:2;
  display:flex;gap:14px;align-items:flex-start;padding:22px 26px;border-radius:12px;
  background:var(--gray-10);border:1px solid var(--gray-20)}
.foot-note svg{color:var(--blue);flex:none;margin-top:2px}
.foot-note p{font-size:.92rem;line-height:1.6;color:var(--gray-70)}
.foot-note b{color:var(--navy);font-weight:600}

.rv{opacity:0;transform:translateY(24px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.rv.in{opacity:1;transform:none}

@media(max-width:980px){
  .pgrid{grid-template-columns:repeat(2,1fr)}
  .pcard.feature{grid-column:span 2}
}
@media(max-width:620px){
  .pgrid{grid-template-columns:1fr}
  .pcard.feature{grid-column:span 1}
}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none}}

.card{fill:rgba(255,255,255,.05);stroke:rgba(255,255,255,.18);stroke-width:1.5}
   .clbl{font-family:'IBM Plex Sans',sans-serif;font-size:19px;fill:#ffffff;font-weight:600}
   .tile-t{font-family:'IBM Plex Mono',monospace;font-size:14px;font-weight:700;
           fill:#fff;text-anchor:middle;letter-spacing:.06em}
   .conn{stroke:#8FD9FF;stroke-width:3;fill:none;stroke-linecap:round;
         filter:drop-shadow(0 0 4px rgba(140,225,255,.6))}
   .bracket{stroke:#5b83b8;stroke-width:2;fill:none;stroke-dasharray:5 5}
   .np-t{font-family:'IBM Plex Sans',sans-serif;font-weight:700;font-size:26px;fill:#fff}
   .np-s{font-family:'IBM Plex Mono',monospace;font-size:13px;fill:#ffffff;
         letter-spacing:.14em;font-weight:600}
   .dcap{font-family:'IBM Plex Mono',monospace;font-size:13px;fill:#ffffff;
         letter-spacing:.1em;font-weight:700}
   .kpi-n{font-family:'IBM Plex Sans',sans-serif;font-weight:700;font-size:26px;fill:#fff}
   .kpi-l{font-family:'IBM Plex Mono',monospace;font-size:10.5px;fill:#ffffff;
          letter-spacing:.02em;font-weight:600}
   @media (prefers-reduced-motion:reduce){.pulse{display:none}}

.arch .lbl{font-family:'IBM Plex Sans',sans-serif;fill:#161616;text-anchor:middle;font-weight:500;font-size:20px}.arch .sys{font-size:24px;font-weight:600}.arch .cap{font-family:'IBM Plex Mono',monospace;font-size:16px;letter-spacing:.08em;
      fill:#6F6F6F;text-anchor:middle;text-transform:uppercase}.arch .node{font-size:24px;font-weight:600;fill:#161616}.arch .wire{stroke:#78A9FF;stroke-width:3;fill:none}.arch .flow{stroke:#0F62FE;stroke-width:4;fill:none;stroke-linecap:round}.arch .pulse{stroke:#33B1FF;stroke-width:5;fill:none;stroke-linecap:round;stroke-dasharray:16 200}.arch .box{fill:#F4F4F4;stroke:#E0E0E0}.arch .eqlbl{font-family:'IBM Plex Sans',sans-serif;font-size:20px;font-weight:600;
        fill:#393939;text-anchor:middle}.arch .eqsub{font-family:'IBM Plex Mono',monospace;font-size:15px;letter-spacing:.06em;
        fill:#6F6F6F;text-anchor:middle;text-transform:uppercase}@media (prefers-reduced-motion: reduce){.arch .pulse{animation:none;opacity:.5;stroke-dasharray:none}}

.hx{stroke-width:2.5;transition:none}
 .ht{font-family:'IBM Plex Sans',sans-serif;font-weight:600;font-size:21px;
     fill:#fff;text-anchor:middle;letter-spacing:-.02em}
 .hs{font-family:'IBM Plex Sans',sans-serif;font-weight:400;font-size:16px;
     fill:rgba(255,255,255,.82);text-anchor:middle}
 .ct{font-family:'IBM Plex Sans',sans-serif;font-weight:700;font-size:25px;
     fill:#001D36;text-anchor:middle;letter-spacing:-.025em}
 .cs{font-family:'IBM Plex Sans',sans-serif;font-weight:500;font-size:17px;
     fill:#0F62FE;text-anchor:middle}
 .spoke{stroke:#33B1FF;stroke-width:2.5;fill:none;opacity:.5;stroke-linecap:round}
 .hive .pulse{stroke:#7FDBFF;stroke-width:3.5;fill:none;stroke-linecap:round;
        stroke-dasharray:16 150;filter:drop-shadow(0 0 5px rgba(127,219,255,.9))}
 @media (prefers-reduced-motion: reduce){
   .cellg,.pulse,.halo,.ring{animation:none !important}
   .pulse{opacity:.55;stroke-dasharray:none}
 }