/* Verapath marketing — HOMEPAGE theme (design_handoff_v8 'V8 Platform.html' inline <style>), re-scoped .B -> .B.light so the homepage chrome overrides (video-hero nav, luxe canvas) never leak onto the .B sub-pages. */
/* ============ LIGHT - light theme of homepage ============ */
.B.light{background:var(--paper);color:var(--ink)}
.B.light .shell{width:var(--shell);margin-inline:auto}
.mk{display:inline-block;width:auto;height:1em;vertical-align:-.06em}
.mk svg{height:100%;width:auto;display:block}
.B.light ::selection{background:var(--lime);color:var(--forest)}
.glow{text-shadow:0 0 32px color-mix(in srgb,var(--lime) 55%,transparent)}

/* ---- Nav ---- */
.B.light nav[data-nav]{position:fixed;inset:0 0 auto 0;z-index:50;transition:background .4s var(--ease),backdrop-filter .4s,border-color .4s}
.B.light nav .bar{width:var(--shell);margin-inline:auto;display:flex;align-items:center;justify-content:space-between;height:76px}
.B.light nav[data-nav].scrolled{background:color-mix(in srgb,var(--paper) 72%,transparent);backdrop-filter:blur(16px) saturate(1.2);border-bottom:1px solid var(--line)}
.B.light .brand{display:flex;align-items:center;gap:.5rem;font-family:var(--serif);font-size:1.5rem;color:var(--ink)}
.B.light .brand{gap:.6rem}
.B.light .brand .mk{color:var(--forest);height:1.05rem;width:auto;filter:none}
.B.light .navlinks{display:flex;gap:2rem;font-size:.95rem;color:var(--mute)}
.B.light .navlinks a:hover{color:var(--lime)}
.B.light .sys{display:inline-flex;align-items:center;gap:.45rem;font-size:.78rem;color:var(--mute);border:1px solid var(--line);border-radius:999px;padding:.35rem .75rem;margin-right:14px}
.B.light .sys i{width:7px;height:7px;border-radius:50%;background:var(--lime);box-shadow:0 0 8px var(--lime);animation:sysblink 2.6s infinite}
@keyframes sysblink{0%,100%{opacity:1}50%{opacity:.45}}
@media(max-width:1060px){.B.light .navlinks,.B.light .sys{display:none}}

/* ---- Hero ---- */
.B.light .hero{position:relative;min-height:100svh;display:flex;align-items:center;overflow:hidden;
  background:radial-gradient(125% 95% at 72% -10%, var(--mint-2) 0%, var(--paper) 56%)}
.B.light .hero{background:#eef2ee}
.B.light .hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;background:#eef2ee center center/cover no-repeat;filter:sepia(.12) saturate(1.12) hue-rotate(14deg) brightness(1.02) contrast(1.03)}
.B.light .hero-grade{display:none}
.B.light .hero .veil{position:absolute;inset:0;z-index:1;background:
  linear-gradient(90deg, color-mix(in srgb,var(--paper) 90%,transparent) 0%, color-mix(in srgb,var(--paper) 42%,transparent) 46%, transparent 72%),
  linear-gradient(180deg, color-mix(in srgb,var(--paper) 72%,transparent) 0%, transparent 26%)}
.B.light .hero .shell{position:relative;z-index:2;padding:120px 0 80px}
.B.light .hpill{display:inline-flex;align-items:center;gap:.6rem;border:1px solid var(--line);
  background:#ffffff;border-radius:999px;padding:.5rem .95rem;font-size:.8rem;color:var(--mute);font-weight:650}
.B.light .hpill .dot{width:7px;height:7px;border-radius:50%;background:var(--lime);box-shadow:0 0 10px var(--lime)}
.B.light .hero h1{font-family:var(--serif);font-size:var(--t-display);line-height:.9;margin:1.2rem 0 0;max-width:16ch;letter-spacing:-.035em}
.B.light .hero h1 em{font-style:italic;color:var(--lime)}
.B.light .hero p.sub{font-size:var(--t-lead);max-width:46ch;margin:1.5rem 0 0;color:var(--mute)}
.B.light .cta-row{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:2.2rem}
.B.light .metrics{display:flex;gap:2.6rem;margin-top:3rem;flex-wrap:wrap}
.B.light .metrics .m .n{font-family:var(--serif);font-size:2.4rem;color:var(--lime);line-height:1}
.B.light .metrics .m .l{font-size:.82rem;color:var(--mute);margin-top:.3rem}
.B.light .htagline{display:flex;gap:.7rem;flex-wrap:wrap;margin-top:2.6rem;font-family:var(--serif);font-size:1.08rem;line-height:1.3;color:var(--forest)}
.B.light .htagline span{position:relative}
.B.light .cue{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);z-index:3;color:var(--mute);
  font-size:.5rem;letter-spacing:.26em;text-transform:uppercase;display:flex;flex-direction:column;align-items:center;gap:13px;font-weight:650}
.B.light .cue .ln{width:1px;height:34px;background:linear-gradient(var(--lime),transparent);animation:cue 1.8s var(--ease) infinite}
@keyframes cue{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}50.1%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* hero FX switcher */
.B.light .fxsw{position:absolute;right:28px;bottom:24px;z-index:4;display:flex;align-items:center;gap:6px;
  border:1px solid var(--line);background:color-mix(in srgb,var(--paper) 65%,transparent);
  backdrop-filter:blur(10px);border-radius:999px;padding:5px 6px 5px 14px}
.B.light .fxsw .lab{font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--mute);font-weight:650;margin-right:4px}
.B.light .fxsw button{font-family:var(--sans);font-weight:650;font-size:.78rem;color:var(--mute);background:transparent;
  border:1px solid transparent;border-radius:999px;padding:.42rem .8rem;cursor:pointer;transition:all .3s var(--ease)}
.B.light .fxsw button:hover{color:var(--ink)}
.B.light .fxsw button[aria-selected=true]{background:var(--lime);color:var(--forest)}
@media(max-width:880px){.B.light .fxsw{right:50%;transform:translateX(50%);bottom:70px}}

/* trusted-by marquee */
.B.light .trust{border-block:1px solid var(--line);padding:44px 0;background:var(--paper-3);overflow:hidden}
.B.light .trust .lab{font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;color:var(--mute);font-weight:650;
  text-align:center;display:block;margin-bottom:26px}
.B.light .marquee{position:relative;overflow:hidden;
  mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.B.light .mtrack{display:flex;width:max-content;animation:mscroll 32s linear infinite}
.B.light .marquee:hover .mtrack{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.B.light .mtrack{animation:none}}
@keyframes mscroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.B.light .trust .lg{display:flex;align-items:center;justify-content:center;background:var(--paper);border-radius:12px;
  padding:12px 26px;height:62px;flex:none;margin-right:18px;transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.B.light .trust .lg:hover{transform:translateY(-3px);box-shadow:0 14px 30px -16px rgba(34,48,41,.16)}
.B.light .trust .lg img{height:32px;width:auto;display:block}

/* ---- sections ---- */
.B.light section.block{padding:110px 0;position:relative}
.B.light .head{max-width:64ch}
.B.light .head .eyebrow{color:var(--lime)}
.B.light .head h2{font-family:var(--serif);font-size:var(--t-h2);margin:.8rem 0 0;line-height:1.04}
.B.light .head h2 em{font-style:italic;color:var(--lime)}
.B.light .head h2.ind-h2{white-space:nowrap;font-size:clamp(2rem,1rem + 3vw,3.4rem)}
@media(max-width:760px){.B.light .head h2.ind-h2{white-space:normal}}
.B.light .head p{margin-top:1rem;color:var(--mute);font-size:var(--t-lead)}

/* third option */
.B.light .choice{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:50px;border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;background:var(--line)}
@media(max-width:820px){.B.light .choice{grid-template-columns:1fr}}
.B.light .ch{background:#ffffff;padding:34px;position:relative;transition:background .5s var(--ease)}
.B.light .ch .tag{font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:var(--mute);font-weight:650}
.B.light .ch h3{font-family:var(--serif);font-size:1.6rem;margin:.7rem 0 .5rem}
.B.light .ch p{color:var(--mute);font-size:.96rem}
.B.light .ch.win{background:linear-gradient(160deg,var(--mint),var(--mint-2))}
.B.light .ch.win h3{color:var(--lime)}
.B.light .ch.win::after{content:"";position:absolute;inset:0;border:1px solid color-mix(in srgb,var(--lime) 40%,transparent);pointer-events:none}
.B.light .ch .num{font-size:.8rem;color:var(--mute);opacity:.5}

/* ---- architecture section ---- */
.B.light .demo{background:radial-gradient(100% 100% at 50% 0%, var(--paper-2), var(--paper))}
.B.light .archframe{margin-top:46px;border:1px solid var(--line);border-radius:var(--radius-lg);
  background:#ffffff;padding:18px 18px 8px}

#arch .ar-chips{display:flex;gap:6px;flex-wrap:wrap;align-items:center;padding:0 4px 14px}
#arch .ar-chip{font-family:var(--sans);font-weight:650;font-size:.82rem;letter-spacing:.04em;color:var(--mute);
  background:transparent;border:1px solid var(--line);padding:.5rem .95rem;border-radius:999px;cursor:pointer;transition:all .3s var(--ease)}
#arch .ar-chip[aria-selected=true]{background:var(--lime);color:var(--forest);border-color:var(--lime)}
#arch .ar-chip:hover:not([aria-selected=true]){color:var(--ink);border-color:color-mix(in srgb,var(--lime) 50%,transparent)}
#arch .ar-live{margin-left:auto;font-size:.78rem;color:var(--lime);display:inline-flex;align-items:center;gap:.45rem}
#arch .ar-live i{width:7px;height:7px;border-radius:50%;background:var(--lime);box-shadow:0 0 8px var(--lime);animation:sysblink 2s infinite}

#arch .ar-wrap{position:relative;overflow:hidden;border-radius:16px;background:#ffffff;border:1px solid var(--line)}
#arch .ar-stage{position:absolute;top:0;left:0;width:1500px;height:920px;transform-origin:top left}
#arch .ar-svg{position:absolute;inset:0;width:100%;height:100%}
#arch .ar-zlab{position:absolute;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--mute);font-weight:650}

#arch .ar-wire{fill:none;stroke:#22372b;stroke-width:1.5;transition:stroke .4s}
#arch .ar-wire.on{stroke:color-mix(in srgb,var(--lime) 55%,#22372b);stroke-width:2}
#arch .ar-wire.hot{stroke:var(--lime);stroke-width:2.5;filter:drop-shadow(0 0 6px rgba(163,233,107,.6))}

#arch .ar-card{position:absolute;border-radius:14px;border:1px solid var(--line);background:#ffffff;padding:14px 16px;
  transition:all .45s var(--ease);cursor:default;overflow:hidden}
#arch .ar-card .k{font-size:.66rem;letter-spacing:.13em;font-weight:650;color:var(--mute)}
#arch .ar-card .t{font-family:var(--sans);font-weight:650;font-size:.95rem;color:var(--ink);margin-top:5px;line-height:1.25}
#arch .ar-card .d{font-size:.78rem;color:var(--mute);margin-top:6px;line-height:1.4}
#arch .ar-card .f{font-size:.7rem;color:var(--mute);margin-top:9px;padding-top:8px;border-top:1px solid var(--line)}
#arch .ar-card.z-ai .k{color:#7a5fc0}
#arch .ar-card.z-people .k{color:var(--green)}
#arch .ar-card.z-edge .k{color:#b07d3a}
#arch .ar-card.dark{background:linear-gradient(160deg,var(--mint),var(--mint-2));border-color:color-mix(in srgb,var(--lime) 40%,transparent)}
#arch .ar-card.dark .k{color:var(--lime)}
#arch .ar-card.on{border-color:color-mix(in srgb,var(--lime) 55%,transparent);background:var(--mint-2);
  box-shadow:0 0 34px -10px color-mix(in srgb,var(--lime) 35%,transparent);transform:translateY(-3px)}
#arch .ar-card.dim{opacity:.45}
#arch .ar-card:hover{opacity:1;border-color:var(--lime);transform:translateY(-3px)}

#arch .ar-hub{position:absolute;border-radius:50%;background:radial-gradient(120% 120% at 30% 20%,#2a4a35,#16291e 70%);
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
  border:1px solid color-mix(in srgb,var(--lime) 45%,transparent);
  box-shadow:0 0 70px -12px color-mix(in srgb,var(--lime) 40%,transparent)}
#arch .ar-hub .ring{position:absolute;inset:-14px;border-radius:50%;border:1px dashed color-mix(in srgb,var(--lime) 30%,transparent);
  animation:arspin 40s linear infinite}
@keyframes arspin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){#arch .ar-hub .ring{animation:none}}
#arch .ar-hub .mark{width:62px;height:40px;color:var(--lime);filter:drop-shadow(0 0 12px rgba(163,233,107,.5))}
#arch .ar-hub .mark svg{width:100%;height:100%}
#arch .ar-hub .n{font-family:var(--serif);font-size:1.5rem;letter-spacing:.02em;color:#fff;margin-top:8px}
#arch .ar-hub .s{font-size:.72rem;letter-spacing:.24em;color:var(--lime);font-weight:650;margin-top:2px}
#arch .ar-hub .p{font-size:.7rem;color:var(--mute);margin-top:6px;font-style:italic;font-family:var(--serif)}
#arch .ar-hub.pulse{animation:arpulse .9s var(--ease)}
@keyframes arpulse{0%{box-shadow:0 0 70px -12px rgba(163,233,107,.4)}35%{box-shadow:0 0 110px -6px rgba(163,233,107,.75)}100%{box-shadow:0 0 70px -12px rgba(163,233,107,.4)}}

#arch .ar-pill{position:absolute;transform:translate(-50%,-50%);font-size:.72rem;font-weight:650;color:var(--ink);
  background:#ffffff;border:1px solid var(--line);border-radius:999px;padding:.4rem .8rem;white-space:nowrap;z-index:3}

#arch .ar-parts{position:absolute;inset:0;pointer-events:none}
#arch .ar-dot{position:absolute;width:7px;height:7px;border-radius:50%;background:var(--lime);
  box-shadow:0 0 10px var(--lime);offset-rotate:0deg}
#arch .ar-dot.go{animation:argo 5.2s linear infinite}
#arch .ar-dot.back{animation:arback 5.2s linear infinite}
@keyframes argo{from{offset-distance:0%;opacity:0}8%{opacity:1}92%{opacity:1}to{offset-distance:100%;opacity:0}}
@keyframes arback{from{offset-distance:100%;opacity:0}8%{opacity:1}92%{opacity:1}to{offset-distance:0%;opacity:0}}

#arch .ar-console{margin-top:10px;background:#ffffff;border:1px solid var(--line);border-radius:12px;
  padding:12px 16px;min-height:96px}
#arch .ar-line{font-family:ui-monospace,'SF Mono',Menlo,monospace;font-size:.78rem;color:var(--mute);
  padding:3px 0;animation:arin .5s var(--ease)}
@keyframes arin{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
#arch .ar-line .tm{color:var(--mute);margin-right:10px}
#arch .ar-line .tg{display:inline-block;min-width:54px;color:var(--lime);margin-right:10px;text-transform:uppercase;font-size:.7rem;letter-spacing:.08em}

/* feature trio */
.B.light .feat{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:50px}
@media(max-width:820px){.B.light .feat{grid-template-columns:1fr}}
.B.light .fc{border:1px solid var(--line);border-radius:var(--radius);padding:28px;background:#ffffff;
  transition:transform .5s var(--ease),border-color .5s,background .5s;position:relative;overflow:hidden}
.B.light .fc:hover{transform:translateY(-5px);border-color:color-mix(in srgb,var(--lime) 45%,transparent);background:color-mix(in srgb,var(--lime) 6%,transparent)}
.B.light .fc .ic{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;background:var(--mint-2);color:var(--lime);
  border:1px solid color-mix(in srgb,var(--lime) 30%,transparent);margin-bottom:16px;font-size:1.1rem}
.B.light .fc h3{font-size:1.15rem;font-weight:650}
.B.light .fc p{color:var(--mute);font-size:.94rem;margin-top:.5rem}

/* ===== Principles band + Products grid (v4) ===== */
.B.light .prin{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:40px}
.B.light .prin span{font-family:var(--serif);font-size:1.15rem;color:var(--forest);border:1px solid rgba(255,255,255,.72);border-radius:999px;padding:.7rem 1.4rem;background:rgba(255,255,255,.6);backdrop-filter:blur(6px);box-shadow:0 16px 40px -34px rgba(34,48,41,.45);transition:transform .4s var(--ease),background .4s var(--ease)}
.B.light .prin span:hover{transform:translateY(-3px);background:#fff}
.B.light .prodgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:46px}
@media(max-width:1080px){.B.light .prodgrid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.B.light .prodgrid{grid-template-columns:1fr}}
.B.light .pg{display:flex;flex-direction:column;border-radius:20px;padding:26px;background:rgba(255,255,255,.7);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.7);box-shadow:0 22px 56px -44px rgba(34,48,41,.42);transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.B.light .pg:hover{transform:translateY(-5px);box-shadow:0 32px 72px -46px rgba(34,48,41,.5)}
.B.light .pg .k{font-size:.68rem;font-weight:650;letter-spacing:.12em;text-transform:uppercase;color:var(--green);min-height:2.6em;display:flex;align-items:flex-start}
.B.light .pg h3{font-family:var(--serif);font-size:1.4rem;color:var(--forest);margin-top:.6rem;line-height:1.1}
.B.light .pg p{color:var(--mute);font-size:.9rem;margin-top:.5rem;flex:1}
.B.light .pg .go{color:var(--green);font-weight:650;font-size:.9rem;margin-top:1rem;display:inline-flex;align-items:center;gap:.4rem}
.B.light .pg .go .arr{transition:transform .35s var(--ease)}
.B.light .pg:hover .go .arr{transform:translateX(4px)}


/* ===== FAQ (v5) ===== */
.B.light .faq{max-width:860px;margin:46px auto 0;display:flex;flex-direction:column;gap:12px}
.B.light .faq details{border-radius:18px;background:rgba(255,255,255,.7);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.72);box-shadow:0 20px 50px -42px rgba(34,48,41,.45);overflow:hidden}
.B.light .faq summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px;font-family:var(--serif);font-size:1.15rem;color:var(--forest)}
.B.light .faq summary::-webkit-details-marker{display:none}
.B.light .faq summary::after{content:"+";font-family:var(--sans);color:var(--green);font-size:1.3rem;font-weight:650;transition:transform .3s var(--ease);flex:none}
.B.light .faq details[open] summary::after{transform:rotate(45deg)}
.B.light .faq .a{padding:0 24px 20px;color:color-mix(in srgb,var(--ink) 72%,transparent);font-size:1rem;line-height:1.6;max-width:64ch}


/* ===== v6 CRO additions ===== */
.B.light .proofband{margin-top:0;padding:0}
.B.light .proofgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
@media(max-width:1000px){.B.light .proofgrid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.B.light .proofgrid{grid-template-columns:1fr}}
.B.light .proof{border-radius:20px;padding:26px;background:rgba(255,255,255,.7);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.7);box-shadow:0 22px 56px -44px rgba(34,48,41,.42);text-align:center;display:flex;flex-direction:column;justify-content:center;align-items:center}ter}
.B.light .proof .n{font-family:var(--serif);font-size:clamp(2rem,1.4rem + 1.6vw,3rem);color:var(--forest);line-height:1}
.B.light .proof .n em{font-style:italic;color:var(--green)}
.B.light .proof .l{color:var(--mute);font-size:.9rem;margin-top:.5rem;line-height:1.45}
.B.light .proof .one{font-family:var(--serif);font-size:1.08rem;line-height:1.5;color:var(--forest);text-wrap:balance}
.B.light .proof .one em{font-style:normal;font-weight:600;color:var(--green)}
.B.light .archlist{list-style:none;margin:1.1rem 0 0;padding:0;display:flex;flex-direction:column;gap:.6rem;max-width:54ch}
.B.light .archlist li{display:flex;gap:.7rem;align-items:flex-start;color:color-mix(in srgb,var(--ink) 82%,transparent);font-size:1.02rem;line-height:1.5}
.B.light .archlist li::before{content:"";flex:none;width:22px;height:22px;margin-top:1px;border-radius:50%;background:var(--mint);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232E7D46' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center;background-size:13px}
.B.light .archintro{margin-top:52px;max-width:60ch}
.B.light .archintro h3{font-family:var(--serif);font-size:var(--t-h2);color:var(--forest);line-height:1.04;margin:0}
.B.light .archintro h3 em{font-style:italic;color:var(--green)}
.B.light .archintro p{color:color-mix(in srgb,var(--ink) 74%,transparent);font-size:1.05rem;line-height:1.55;margin:.7rem 0 0}
.B.light .midcta{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;border-radius:22px;padding:30px 34px;margin-top:56px;background:var(--forest);box-shadow:0 34px 80px -48px rgba(34,48,41,.55)}
.B.light .midcta .t{font-family:var(--serif);font-size:1.45rem;color:#fff;line-height:1.15;max-width:30ch}
.B.light .midcta .t em{font-style:italic;color:var(--lime)}
.B.light .midcta .r{display:flex;gap:12px;flex-wrap:wrap}
.B.light .quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:46px}
@media(max-width:900px){.B.light .quotes{grid-template-columns:1fr}}
.B.light .q{border-radius:20px;padding:30px;background:rgba(255,255,255,.7);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.7);box-shadow:0 22px 56px -44px rgba(34,48,41,.42);display:flex;flex-direction:column}
.B.light .q .mark{font-family:var(--serif);font-size:2.6rem;color:var(--green);line-height:.6;margin-bottom:14px}
.B.light .q p{font-family:var(--serif);font-size:1.12rem;color:var(--forest);line-height:1.45;flex:1}
.B.light .q .who{margin-top:1.2rem;font-size:.85rem;color:var(--mute)}
.B.light .q .who b{display:block;color:var(--forest);font-weight:650}
.B.light .q .ph-tag{margin-top:.9rem;font-size:.7rem;font-weight:650;letter-spacing:.1em;text-transform:uppercase;color:var(--coral);opacity:.75}
.B.light .q.feat{max-width:820px;margin:46px auto 0;padding:46px 52px;text-align:center;align-items:center}
.B.light .q.feat p{font-size:clamp(1.3rem,1rem + 1.2vw,1.8rem);line-height:1.4}
.B.light .q.feat .mark{font-size:3.4rem}

/* ===== Meet Max ===== */
.B.light .max{position:relative;overflow:hidden;background:radial-gradient(110% 90% at 80% 0%, var(--mint-2) 0%, var(--paper) 60%)}
.B.light .max .halo2{position:absolute;right:-8%;top:6%;width:560px;height:560px;border-radius:50%;
  background:radial-gradient(circle, color-mix(in srgb,var(--lime) 13%,transparent), transparent 62%);filter:blur(10px);z-index:0}
.B.light .max .shell{position:relative;z-index:1}
.B.light .maxhead{display:flex;align-items:center;gap:16px}
.B.light .maxhead .badge{display:inline-flex;align-items:center;gap:.5rem;border:1px solid var(--line);
  background:#ffffff;border-radius:999px;padding:.4rem .8rem;font-size:.78rem;color:var(--lime);font-weight:650}
.B.light .maxhead .badge i{width:7px;height:7px;border-radius:50%;background:var(--lime);box-shadow:0 0 8px var(--lime);animation:sysblink 2.4s infinite}

.B.light .maxstage{display:grid;grid-template-columns:1fr 1.15fr;gap:24px;margin-top:42px;align-items:stretch}
@media(max-width:940px){.B.light .maxstage{grid-template-columns:1fr}}

/* chat side */
.B.light .mx-panel{border:1px solid var(--line);border-radius:var(--radius-lg);background:#ffffff;
  display:flex;flex-direction:column;overflow:hidden}
.B.light .mx-top{display:flex;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--line);background:var(--mint-2)}
.B.light .mx-orb{position:relative;width:38px;height:38px;border-radius:50%;flex:none;
  background:radial-gradient(120% 120% at 30% 25%, #c8ff8f, #6fbf45 60%, #2c6e2a);
  box-shadow:0 0 0 1px color-mix(in srgb,var(--lime) 50%,transparent),0 0 22px -2px color-mix(in srgb,var(--lime) 70%,transparent)}
.B.light .mx-orb::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:1px solid color-mix(in srgb,var(--lime) 35%,transparent);opacity:0;transition:opacity .3s}
.B.light .mx-orb.think::after{opacity:1;animation:mxring 1.1s ease-out infinite}
@keyframes mxring{0%{transform:scale(.85);opacity:.8}100%{transform:scale(1.4);opacity:0}}
.B.light .mx-orb.think{animation:mxpulse 1.1s ease-in-out infinite}
@keyframes mxpulse{0%,100%{box-shadow:0 0 0 1px color-mix(in srgb,var(--lime) 50%,transparent),0 0 22px -2px color-mix(in srgb,var(--lime) 70%,transparent)}50%{box-shadow:0 0 0 1px var(--lime),0 0 34px 2px color-mix(in srgb,var(--lime) 85%,transparent)}}
.B.light .mx-top .who b{font-weight:650;font-size:.96rem;display:block}
.B.light .mx-top .who small{color:var(--mute);font-size:.76rem}
.B.light .mx-top .stat{margin-left:auto;font-size:.72rem;color:var(--mute);display:inline-flex;align-items:center;gap:.4rem}
.B.light .mx-top .stat i{width:6px;height:6px;border-radius:50%;background:var(--lime)}

.B.light .mx-log{padding:20px;display:flex;flex-direction:column;gap:12px;min-height:230px;justify-content:flex-end;flex:1}
.B.light .mx-bubble{max-width:88%;padding:.7rem .95rem;border-radius:14px;font-size:.92rem;line-height:1.45;animation:mxin .4s var(--ease)}
@keyframes mxin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.B.light .mx-bubble.user{align-self:flex-end;background:var(--mint);border:1px solid color-mix(in srgb,var(--green) 22%,transparent);color:var(--ink);border-bottom-right-radius:5px}
.B.light .mx-bubble.max{align-self:flex-start;background:color-mix(in srgb,var(--lime) 12%,transparent);border:1px solid color-mix(in srgb,var(--lime) 30%,transparent);color:var(--ink);border-bottom-left-radius:5px}
.B.light .mx-bubble.max b{color:var(--lime);font-weight:650}
.B.light .mx-bubble.typing::after{content:"▍";color:var(--lime);animation:mxcar 1s steps(2) infinite}
@keyframes mxcar{50%{opacity:0}}
.B.light .mx-dots{display:inline-flex;gap:4px;padding:2px 0}
.B.light .mx-dots i{width:6px;height:6px;border-radius:50%;background:var(--lime);opacity:.5;animation:mxdot 1.1s infinite}
.B.light .mx-dots i:nth-child(2){animation-delay:.18s}.B.light .mx-dots i:nth-child(3){animation-delay:.36s}
@keyframes mxdot{0%,100%{opacity:.35;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
.B.light .mx-chips{display:flex;gap:8px;padding:0 20px 18px;flex-wrap:wrap}
.B.light .mx-chip{font-family:var(--sans);font-weight:650;font-size:.8rem;color:var(--mute);background:transparent;
  border:1px solid var(--line);border-radius:999px;padding:.45rem .85rem;cursor:pointer;transition:all .3s var(--ease);display:flex;align-items:center;gap:.45rem}
.B.light .mx-chip .d{width:7px;height:7px;border-radius:2px;background:var(--mute-2)}
.B.light .mx-chip[aria-selected=true]{background:var(--lime);color:var(--forest);border-color:var(--lime)}
.B.light .mx-chip[aria-selected=true] .d{background:var(--forest)}
.B.light .mx-chip:hover:not([aria-selected=true]){color:var(--ink);border-color:color-mix(in srgb,var(--lime) 45%,transparent)}

/* build side */
.B.light .mx-canvas{position:relative;border:1px solid var(--line);border-radius:var(--radius-lg);background:#ffffff;overflow:hidden;min-height:380px;
  background-image:radial-gradient(rgba(34,48,41,.06) 1px,transparent 1px);background-size:26px 26px}
.B.light .mx-canvas .label{position:absolute;left:18px;top:14px;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--mute);font-weight:650;z-index:4}
.B.light .mx-scene{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:54px 30px 30px;opacity:0;visibility:hidden;transition:opacity .5s var(--ease)}
.B.light .mx-scene.active{opacity:1;visibility:visible}

/* generic build pieces: hidden until .playing */
.B.light .mx-scene .pop{opacity:0;transform:translateY(10px) scale(.96);transition:opacity .5s var(--ease),transform .5s var(--ease)}
.B.light .mx-scene.playing .pop{opacity:1;transform:none}
.B.light .mx-scene .pop[data-d="1"]{transition-delay:.15s}
.B.light .mx-scene .pop[data-d="2"]{transition-delay:.35s}
.B.light .mx-scene .pop[data-d="3"]{transition-delay:.55s}
.B.light .mx-scene .pop[data-d="4"]{transition-delay:.75s}
.B.light .mx-scene .pop[data-d="5"]{transition-delay:.95s}
.B.light .mx-scene .pop[data-d="6"]{transition-delay:1.15s}

/* scene: agent card */
.B.light .agcard{width:min(360px,100%);border:1px solid color-mix(in srgb,var(--lime) 30%,transparent);border-radius:18px;background:#ffffff;
  box-shadow:0 0 50px -16px color-mix(in srgb,var(--lime) 40%,transparent);padding:22px}
.B.light .agcard .ag-h{display:flex;align-items:center;gap:12px}
.B.light .agcard .ag-ic{width:42px;height:42px;border-radius:11px;background:var(--lime);color:var(--forest);display:grid;place-items:center;font-weight:650;flex:none}
.B.light .agcard .ag-h b{font-family:var(--serif);font-size:1.25rem}
.B.light .agcard .ag-h small{display:block;color:var(--mute);font-size:.76rem}
.B.light .ag-row{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--mute);font-weight:650;margin:16px 0 8px}
.B.light .ag-chips{display:flex;gap:7px;flex-wrap:wrap}
.B.light .ag-chips span{font-size:.78rem;background:var(--mint-2);border:1px solid var(--line);border-radius:8px;padding:.32rem .6rem;color:var(--ink)}
.B.light .ag-guards{display:flex;gap:7px;flex-wrap:wrap}
.B.light .ag-guards span{font-size:.76rem;display:inline-flex;align-items:center;gap:.35rem;background:color-mix(in srgb,var(--lime) 12%,transparent);
  border:1px solid color-mix(in srgb,var(--lime) 30%,transparent);border-radius:999px;padding:.3rem .6rem;color:var(--lime)}
.B.light .ag-live{margin-top:16px;display:flex;align-items:center;gap:.5rem;font-size:.82rem;color:var(--lime);font-weight:650}
.B.light .ag-live i{width:8px;height:8px;border-radius:50%;background:var(--lime);box-shadow:0 0 8px var(--lime);animation:sysblink 1.8s infinite}

/* scene: workflow */
.B.light .wf{display:flex;align-items:center;gap:0;flex-wrap:nowrap}
.B.light .wf .node{width:118px;border:1px solid var(--line);border-radius:13px;background:#ffffff;padding:14px 12px;text-align:center;position:relative}
.B.light .wf .node .ic{width:34px;height:34px;border-radius:9px;margin:0 auto 8px;display:grid;place-items:center;background:var(--mint-2);color:var(--lime);border:1px solid var(--line)}
.B.light .wf .node b{font-size:.84rem;font-weight:650;display:block}
.B.light .wf .node small{font-size:.7rem;color:var(--mute)}
.B.light .wf .node.new{border-color:color-mix(in srgb,var(--lime) 55%,transparent);background:var(--mint-2);box-shadow:0 0 34px -10px color-mix(in srgb,var(--lime) 45%,transparent)}
.B.light .wf .node.new .ic{background:var(--lime);color:var(--forest)}
.B.light .wf .arrow{width:30px;height:2px;background:var(--line);position:relative;flex:none}
.B.light .wf .arrow.lit{background:color-mix(in srgb,var(--lime) 60%,transparent)}
.B.light .wf .arrow::after{content:"";position:absolute;right:-1px;top:-3px;border-left:6px solid var(--line);border-block:4px solid transparent}
.B.light .wf .arrow.lit::after{border-left-color:var(--lime)}
/* the inserted middle node + its arrows collapse in */
.B.light .mx-scene .wf .ins{max-width:0;overflow:hidden;opacity:0;transition:max-width .6s var(--ease),opacity .5s var(--ease);display:flex;align-items:center}
.B.light .mx-scene.playing .wf .ins{max-width:200px;opacity:1;transition-delay:.5s}
.B.light .wf-note{margin-top:18px;font-size:.82rem;color:var(--mute);text-align:center}
.B.light .wf-note b{color:var(--lime)}

/* scene: config */
.B.light .cfg{width:min(380px,100%);display:flex;flex-direction:column;gap:14px}
.B.light .cfg .crow{border:1px solid var(--line);border-radius:13px;background:#ffffff;padding:14px 16px}
.B.light .cfg .crow .k{font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--mute);font-weight:650}
.B.light .cfg .crow .v{display:flex;align-items:center;justify-content:space-between;margin-top:8px;font-weight:650;font-size:.92rem}
.B.light .cfg .meter{height:8px;border-radius:999px;background:var(--mint-2);margin-top:10px;overflow:hidden;border:1px solid var(--line)}
.B.light .cfg .meter i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--green),var(--lime));transition:width 1.1s var(--ease) .4s;border-radius:999px}
.B.light .mx-scene.playing .cfg .meter i{width:72%}
.B.light .cfg .toggle{width:42px;height:24px;border-radius:999px;background:var(--line);position:relative;transition:background .4s var(--ease) .6s}
.B.light .cfg .toggle::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:var(--mute);transition:transform .4s var(--ease) .6s,background .4s .6s}
.B.light .mx-scene.playing .cfg .toggle{background:color-mix(in srgb,var(--lime) 55%,transparent)}
.B.light .mx-scene.playing .cfg .toggle::after{transform:translateX(18px);background:var(--lime)}
.B.light .cfg .route{font-size:.82rem;color:var(--lime);font-weight:650}
.B.light .cfg .applied{align-self:flex-start;display:inline-flex;align-items:center;gap:.5rem;font-size:.82rem;color:var(--lime);font-weight:650}
.B.light .cfg .applied i{width:18px;height:18px;border-radius:50%;background:var(--lime);color:var(--forest);display:grid;place-items:center;font-size:.7rem}

/* stat band */
.B.light .band{border-block:1px solid var(--line);padding:80px 0}
.B.light .statgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;text-align:center}
@media(max-width:820px){.B.light .statgrid{grid-template-columns:1fr 1fr;gap:40px 20px}}
.B.light .statgrid .s .n{font-family:var(--serif);font-size:clamp(2.6rem,1.4rem + 3vw,4rem);color:var(--lime);line-height:1}
.B.light .statgrid .s .l{color:var(--mute);font-size:.86rem;margin-top:.5rem}

/* audiences */
.B.light .aud{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:50px}
@media(max-width:820px){.B.light .aud{grid-template-columns:1fr}}
.B.light .au{position:relative;border-radius:var(--radius-lg);overflow:hidden;min-height:340px;display:flex;align-items:flex-end;
  border:1px solid var(--line)}
.B.light .au img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.4;transition:transform .8s var(--ease),opacity .6s}
.B.light .au:hover img{transform:scale(1.07);opacity:.55}
.B.light .au::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 30%,var(--paper))}
.B.light .au .bd{position:relative;z-index:1;padding:26px}
.B.light .au h3{font-family:var(--serif);font-size:1.4rem;color:var(--ink)}
.B.light .au p{color:var(--mute);font-size:.92rem;margin-top:.5rem}

/* CTA */
.B.light .cta{position:relative;text-align:center;padding:130px 0;overflow:hidden}
.B.light .cta h2{font-family:var(--serif);font-size:var(--t-h1);max-width:20ch;margin:0 auto;line-height:1.02}
.B.light .cta h2 em{font-style:italic;color:var(--lime)}
.B.light .cta p{color:var(--mute);margin:1.2rem auto 0;max-width:48ch}
.B.light .cta .cta-row{justify-content:center}
.B.light .cta .halo{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:680px;height:680px;border-radius:50%;
  background:radial-gradient(circle, color-mix(in srgb,var(--lime) 16%,transparent), transparent 62%);z-index:0;filter:blur(8px)}
.B.light .cta .shell{position:relative;z-index:1}

/* footer — light, flows on the page gradient (soft fade, no slab) */
.B.light footer{padding:40px 0 44px;border-top:none;background:transparent;color:var(--mute);position:relative}
.B.light .fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1fr;gap:30px}
@media(max-width:820px){.B.light .fgrid{grid-template-columns:1fr 1fr}}
.B.light footer h5{font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);margin-bottom:1rem;font-weight:650}
.B.light footer a{display:block;color:var(--mute);padding:.3rem 0;font-size:.95rem}
.B.light footer a:hover{color:var(--green)}
.B.light footer .brand{color:var(--forest)}
.B.light footer .brand .mk{color:var(--forest)}
.B.light footer p{color:var(--mute)!important}
.B.light .fbar{display:flex;justify-content:space-between;border-top:1px solid var(--line);margin-top:52px;padding-top:24px;font-size:.85rem;color:var(--mute);flex-wrap:wrap;gap:10px}

/* ===== LIGHT-MODE TUNED OVERRIDES ===== */
.B.light .head h2,.B.light .ch h3,.B.light .agcard .ag-h b,.B.light .statgrid .s .n{color:var(--forest)}
.B.light .hero h1{color:var(--forest)}
.B.light .glow{text-shadow:none}
.B.light .hero h1 em{color:var(--green)}
.B.light .hero p.sub{color:color-mix(in srgb,var(--ink) 74%,transparent)}
.B.light .head p,.B.light .fc p,.B.light .ch p{color:color-mix(in srgb,var(--ink) 70%,transparent)}
.B.light .metrics .m .n{color:var(--forest)}
.B.light .cue{color:var(--mute)}
.B.light .cue .ln{background:linear-gradient(var(--green),transparent)}
.B.light .head .eyebrow{color:var(--green)}
.B.light .head h2 em{color:var(--green)}

/* nav */
.B.light .brand{color:var(--forest)}
.B.light .brand .mk{color:var(--forest);filter:none}
.B.light .navlinks{color:color-mix(in srgb,var(--ink) 68%,transparent)}
.B.light .navlinks a:hover{color:var(--green)}
.B.light nav[data-nav].scrolled{background:color-mix(in srgb,var(--paper) 88%,transparent);border-bottom:1px solid var(--line)}

/* third option */
.B.light .choice{background:var(--line)}

/* ===== VIDEO HERO (cinematic, dark scrim) - wins over light-mode tuning ===== */
.B.light .hero{background:#0c1310}
.B.light .hero-video{z-index:0}
/* Blazor adaptation: the video element's pre-paint backdrop is the hero's dark
   tone so the white hero copy stays readable in the instant before the poster
   or first frame paints. The V8 sheet ships a light #eef2ee here, which the
   dark video hero overrides anyway. */
.B.light .hero-video{background:#0c1310}
/* dark cinematic scrim: heavier lower-left for text, lets sky breathe upper-right */
.B.light .hero .veil{z-index:1;background:
  linear-gradient(95deg, rgba(12,19,16,.74) 0%, rgba(12,19,16,.44) 32%, rgba(12,19,16,.06) 58%, rgba(12,19,16,.12) 100%),
  linear-gradient(0deg, rgba(12,19,16,.66) 0%, rgba(12,19,16,.06) 30%, transparent 52%)}
/* path overlay */
/* (removed - video loops on its own) */
/* hero content goes light over footage */
.B.light .hero .shell{z-index:3}
.B.light .hero h1{color:#fff;text-shadow:0 2px 30px rgba(0,0,0,.45)}
.B.light .hero h1 em{color:var(--lime)}
.B.light .hero p.sub{color:rgba(255,255,255,.9);text-shadow:0 1px 16px rgba(0,0,0,.4)}
.B.light .hero .hpill{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.22);color:#fff;backdrop-filter:blur(6px)}
.B.light .hero .hpill .dot{background:var(--lime);box-shadow:0 0 10px var(--lime)}
.B.light .hero .metrics .m .n{color:#fff}
.B.light .hero .metrics .m .l{color:rgba(255,255,255,.72)}
.B.light .hero .htagline{color:rgba(255,255,255,.92);text-shadow:0 1px 14px rgba(0,0,0,.45)}
.B.light .hero .cue{color:rgba(255,255,255,.7)}
.B.light .hero .cue .ln{background:linear-gradient(var(--lime),transparent)}
.B.light .hero .btn-ghost{border-color:rgba(255,255,255,.3);color:#fff}
.B.light .hero .btn-ghost:hover{border-color:#fff;background:rgba(255,255,255,.08)}
/* nav: light over the video at top, flips to light-paper panel once scrolled */
.B.light nav[data-nav] .brand{color:#fff}
.B.light nav[data-nav] .brand .mk{color:#fff}
.B.light nav[data-nav] .navlinks{color:rgba(255,255,255,.82)}
.B.light nav[data-nav] .navlinks a:hover{color:var(--lime)}
.B.light nav[data-nav] .btn-ghost[data-login]{border-color:rgba(255,255,255,.32);color:#fff}
.B.light nav[data-nav].scrolled .brand{color:var(--forest)}
.B.light nav[data-nav].scrolled .brand .mk{color:var(--forest)}
.B.light nav[data-nav].scrolled .navlinks{color:color-mix(in srgb,var(--ink) 68%,transparent)}
.B.light nav[data-nav].scrolled .navlinks a:hover{color:var(--green)}
.B.light nav[data-nav].scrolled .btn-ghost[data-login]{border-color:var(--line);color:var(--ink)}
.B.light .ch.win h3{color:var(--green)}
.B.light .ch.win::after{border-color:color-mix(in srgb,var(--green) 35%,transparent)}

/* feature cards */
.B.light .fc{box-shadow:0 10px 30px -22px rgba(34,48,41,.4)}
.B.light .fc:hover{background:var(--mint-2)}
.B.light .fc .ic{color:var(--green)}
.B.light .fc h3{color:var(--forest)}

/* architecture */
.B.light .archframe{box-shadow:0 24px 60px -40px rgba(34,48,41,.45)}
#arch .ar-wrap{box-shadow:inset 0 0 0 1px var(--line)}
#arch .ar-chip{color:var(--mute)}
#arch .ar-chip[aria-selected=true]{color:var(--forest)}
#arch .ar-live{color:var(--green)}
#arch .ar-wire{stroke:#ccddd2}
#arch .ar-wire.on{stroke:var(--green)}
#arch .ar-wire.hot{stroke:var(--green);filter:drop-shadow(0 0 5px rgba(14,166,101,.5))}
#arch .ar-card{box-shadow:0 8px 22px -14px rgba(34,48,41,.35)}
#arch .ar-card .t{color:var(--forest)}
#arch .ar-card.on{background:var(--mint-2);box-shadow:0 0 0 1px color-mix(in srgb,var(--green) 45%,transparent),0 12px 28px -16px rgba(14,166,101,.5)}
#arch .ar-card.dark{border-color:color-mix(in srgb,var(--green) 40%,transparent)}
#arch .ar-card.dark .k{color:var(--green)}
#arch .ar-card:hover{border-color:var(--green)}
#arch .ar-dot{background:var(--green);box-shadow:0 0 8px rgba(14,166,101,.55)}
#arch .ar-pill{color:var(--forest);box-shadow:0 6px 16px -8px rgba(34,48,41,.35)}
#arch .ar-console{background:var(--paper-3)}
#arch .ar-line .tg{color:var(--green)}
/* hub stays dark green - restore its light-on-dark text */
#arch .ar-hub .p{color:#cfe0d4}

/* Max */
.B.light .maxhead .badge{color:var(--green)}
.B.light .mx-top .stat{color:var(--mute)}
.B.light .mx-bubble.max b{color:var(--green)}
.B.light .mx-dots i{background:var(--green)}
.B.light .mx-chip{color:var(--mute)}
.B.light .ag-guards span{color:var(--green)}
.B.light .ag-live{color:var(--green)}
.B.light .wf .node .ic{color:var(--green)}
.B.light .wf .arrow.lit{background:var(--green)}
.B.light .wf .arrow.lit::after{border-left-color:var(--green)}
.B.light .wf-note b{color:var(--green)}
.B.light .cfg .route{color:var(--green)}
.B.light .cfg .applied{color:var(--green)}

/* audiences - keep dark photo cards */
.B.light .au{background:var(--forest);border-color:var(--line)}
.B.light .au img{opacity:.82}
.B.light .au:hover img{opacity:.96}
.B.light .au::after{background:linear-gradient(transparent 24%, var(--forest))}
.B.light .au h3{color:#fff}
.B.light .au p{color:rgba(255,255,255,.82)}

/* CTA - light, flows on the page gradient */
.B.light .cta h2{color:var(--forest)}
.B.light .cta h2 em{color:var(--green)}
.B.light .cta p{color:var(--mute)}

/* trusted-by chips need separation on light bg */
.B.light .trust .lg{border:1px solid var(--line)}
.B.light .trust .lg:hover{box-shadow:0 14px 30px -16px rgba(34,48,41,.3)}

/* footer hover handled in footer block above */

/* ===================================================================
   LUXE / FLOW PASS — flowing gradient canvas, softened blocks
   =================================================================== */
/* one continuous, fixed gradient canvas behind the whole page */
.B.light{background:
  radial-gradient(80% 50% at 88% 6%, rgba(163,233,107,.10) 0%, transparent 55%),
  radial-gradient(70% 55% at 6% 38%, rgba(14,166,101,.07) 0%, transparent 55%),
  radial-gradient(90% 60% at 92% 78%, rgba(34,48,41,.05) 0%, transparent 55%),
  linear-gradient(176deg, #fbfbf7 0%, #f3f6ef 30%, #f7f4ef 60%, #eef3ec 100%);
  background-attachment:fixed;background-color:#f7f7f2}

/* sections become transparent so the canvas flows through — no hard slabs */
.B.light .demo{background:transparent}
.B.light .band{border-block:none;padding:70px 0}
.B.light section.block{padding:110px 0}
/* hairline section separators replaced by soft fades */
.B.light .band{position:relative}
.B.light .band::before,.B.light .band::after{content:"";position:absolute;left:12%;right:12%;height:1px;
  background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--forest) 12%,transparent),transparent)}
.B.light .band::before{top:0}.B.light .band::after{bottom:0}

/* THIRD OPTION: from a hairline table to three soft floating cards */
.B.light .choice{gap:18px;border:none;border-radius:0;overflow:visible;background:transparent}
.B.light .ch{border-radius:22px;background:rgba(255,255,255,.72);backdrop-filter:blur(6px);
  border:1px solid rgba(255,255,255,.7);box-shadow:0 24px 60px -42px rgba(34,48,41,.45);
  transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.B.light .ch:hover{transform:translateY(-6px);box-shadow:0 36px 80px -46px rgba(34,48,41,.5)}
.B.light .ch.win{background:linear-gradient(165deg, color-mix(in srgb,var(--forest) 96%,#000) 0%, var(--forest) 100%);border-color:transparent;
  box-shadow:0 30px 70px -38px rgba(34,48,41,.6)}
.B.light .ch.win h3{color:var(--lime)}.B.light .ch.win p{color:rgba(255,255,255,.82)}.B.light .ch.win .tag{color:rgba(255,255,255,.6)}.B.light .ch.win .num{color:rgba(255,255,255,.4)}

/* FEATURE cards: lose the boxy border, gain air + soft lift */
.B.light .fc{border:none;border-radius:22px;background:rgba(255,255,255,.66);backdrop-filter:blur(6px);
  box-shadow:0 20px 54px -42px rgba(34,48,41,.4)}
.B.light .fc:hover{background:rgba(255,255,255,.9);box-shadow:0 30px 70px -44px rgba(34,48,41,.5)}
/* results cards: midnight-forest for contrast */
.B.light .feat .fc{background:var(--forest);box-shadow:0 30px 70px -44px rgba(34,48,41,.6)}
.B.light .feat .fc:hover{background:#1a2620;transform:translateY(-5px);box-shadow:0 40px 90px -46px rgba(34,48,41,.7)}
.B.light .feat .fc h3{color:#fff}
.B.light .feat .fc p{color:rgba(255,255,255,.72)}
.B.light .feat .fc .ic{background:color-mix(in srgb,var(--lime) 18%,transparent);color:var(--lime);border-color:color-mix(in srgb,var(--lime) 32%,transparent)}

/* architecture frame: float it, soften the chrome */
.B.light .archframe{border:none;background:rgba(255,255,255,.6);backdrop-filter:blur(8px);
  box-shadow:0 40px 90px -54px rgba(34,48,41,.5);border-radius:28px}

/* audience cards: taller, rounder, more cinematic, less grid-y */
.B.light .au{border:none;border-radius:24px;box-shadow:0 30px 70px -44px rgba(34,48,41,.5)}

/* scroll cue: Verapath V-wing as a downward arrow */
.B.light .cue .cue-v{display:block;width:34px;color:#fff;opacity:.92;
  animation:cuev 2.2s var(--ease) infinite;filter:drop-shadow(0 2px 8px rgba(0,0,0,.35))}
.B.light .cue .cue-v svg{display:block;width:100%;height:auto}
@keyframes cuev{0%{transform:translateY(0);opacity:.5}50%{transform:translateY(7px);opacity:1}100%{transform:translateY(0);opacity:.5}}
@media(prefers-reduced-motion:reduce){.B.light .cue .cue-v{animation:none;opacity:.9}}

/* TRUSTED BY: light, sits on the page gradient (no band) */
.B.light .trust{border:none;background:transparent;padding:64px 0}
.B.light .trust .lab{color:var(--mute)}
.B.light .trust .lg{background:transparent;border:none;border-radius:0;box-shadow:none;height:46px;padding:0;margin-right:72px}
.B.light .trust .lg:hover{transform:none;box-shadow:none}
.B.light .trust .lg img{height:30px;width:auto;display:block;filter:grayscale(1);opacity:.5;transition:opacity .45s var(--ease)}
.B.light .trust .lg:hover img{opacity:1}
.B.light .trust .marquee{mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}

/* de-block the Max section: let the page gradient flow through */
.B.light .max{background:transparent}

/* ===== CTA / bottom: confident close anchored by an oversized brand mark ===== */
.B.light .cta{text-align:center;padding:clamp(120px,9vw,180px) 0 0;overflow:hidden;background:transparent}
.B.light .cta .halo{display:none}
.B.light .cta .cta-fx{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;display:flex;align-items:center;justify-content:center}
.B.light .cta .cta-mark{width:min(108vw,1320px);color:var(--green);opacity:.06;transform:translateY(10%)}
.B.light .cta .cta-mark svg{width:100%;height:auto;display:block}
.B.light .cta .shell{position:relative;z-index:1;padding-bottom:clamp(130px,10vw,200px)}
.B.light .cta .cta-copy{max-width:54ch;margin:0 auto}
.B.light .cta .eyebrow{color:var(--green);display:block;letter-spacing:.2em}
.B.light .cta h2{margin:1.1rem auto 0;max-width:30ch;text-align:center;line-height:1.04;
  font-size:clamp(2.1rem,1.4rem + 2.4vw,3.6rem);letter-spacing:-.02em}
.B.light .cta p{margin:1.3rem auto 0;text-align:center;max-width:46ch}
.B.light .cta .cta-row{justify-content:center;margin-top:2.4rem}
/* nav Industries dropdown */
.B.light .navlinks .has-drop{position:relative}
.B.light .navlinks .has-drop > .trg{display:inline-flex;align-items:center;gap:.32em;cursor:pointer}
.B.light .navlinks .has-drop > .trg::after{content:"";width:.42em;height:.42em;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-1px);opacity:.7;transition:transform .25s var(--ease)}
.B.light .navlinks .has-drop:hover > .trg::after,.B.light .navlinks .has-drop:focus-within > .trg::after{transform:rotate(225deg) translateY(-1px)}
.B.light .navlinks .drop{position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(10px);background:#fff;border:1px solid var(--line);border-radius:18px;padding:10px;min-width:300px;box-shadow:0 30px 70px -34px rgba(34,48,41,.45);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .25s var(--ease),transform .25s var(--ease),visibility .25s;display:flex;flex-direction:column;gap:2px;z-index:60}
.B.light .navlinks .has-drop:hover .drop,.B.light .navlinks .has-drop:focus-within .drop{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(6px)}
.B.light .navlinks .drop a{display:block;padding:11px 14px;border-radius:12px;color:var(--forest)!important;font-size:.95rem;font-weight:650;line-height:1.2}
.B.light .navlinks .drop a small{display:block;color:var(--mute);font-weight:400;font-size:.8rem;margin-top:2px}
.B.light .navlinks .drop a:hover{background:var(--mint-2)}
.B.light .au{cursor:pointer}
