/* Homepage only: dark "chaos to system" hero and section revamps. Loaded after styles.css. */

/* Nav over the dark hero until the page scrolls (or the mobile menu opens). */
body.home-dark nav:not(.nav-solid):not(:has(.mobile-nav.open)){background:transparent;border-bottom-color:transparent;backdrop-filter:none;box-shadow:none!important}
body.home-dark nav:not(.nav-solid):not(:has(.mobile-nav.open)) .logo-img{filter:brightness(0) invert(1)}
body.home-dark nav:not(.nav-solid):not(:has(.mobile-nav.open)) .nav-links{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.16)}
body.home-dark nav:not(.nav-solid):not(:has(.mobile-nav.open)) .nav-links a{color:rgba(255,255,255,.78)}
body.home-dark nav:not(.nav-solid):not(:has(.mobile-nav.open)) .nav-links a:hover,
body.home-dark nav:not(.nav-solid):not(:has(.mobile-nav.open)) .nav-links a.active{color:#fff;background:rgba(255,255,255,.12);box-shadow:none}
body.home-dark nav:not(.nav-solid):not(:has(.mobile-nav.open)) .hamburger span{background:#fff}

/* Hero stage */
.home-hero{position:relative;min-height:100svh;display:flex;align-items:center;justify-content:center;padding:128px 24px 88px;overflow:hidden;color:#fff;text-align:center;background:radial-gradient(55% 60% at 18% 22%,rgba(0,97,254,.42),transparent 70%),radial-gradient(50% 60% at 88% 85%,rgba(109,90,230,.38),transparent 70%),#05070e}
.home-hero::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(122,167,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(122,167,255,.07) 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:radial-gradient(60% 55% at 50% 45%,#000,transparent 75%);mask-image:radial-gradient(60% 55% at 50% 45%,#000,transparent 75%)}
.home-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,transparent,rgba(122,167,255,.6),transparent)}
.hh-inner{position:relative;z-index:2;max-width:1060px;margin:0 auto}
.hh-inner::before{content:"";position:absolute;inset:-60px -120px;z-index:-1;pointer-events:none;background:radial-gradient(closest-side,rgba(5,7,14,.88) 45%,rgba(5,7,14,0))}
.home-hero .hero-chip{margin-bottom:22px}
.home-hero .chip{background:rgba(0,97,254,.14);color:#a9c6ff;border-color:rgba(122,167,255,.4)}
.home-hero h1{font-size:clamp(2.5rem,6vw,5.2rem);line-height:1.02;letter-spacing:-.045em;color:#fff;max-width:1000px;margin:0 auto 22px}
.home-hero .grad-text{background:linear-gradient(110deg,#5b9bff,#b3a6ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.home-hero .hero-sub{color:rgba(255,255,255,.72);font-size:1.1rem;line-height:1.7;max-width:640px;margin:0 auto 30px}
.hh-actions{display:flex;gap:14px;justify-content:center;align-items:center;flex-wrap:wrap}
.hh-watch{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 20px;border-radius:999px;color:#fff;text-decoration:none;font-weight:600;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.06);transition:background .2s}
.hh-watch:hover{background:rgba(255,255,255,.14)}
.hh-watch svg{width:18px;height:18px}

/* Pipeline (hero and final CTA) */
.hh-pipe{list-style:none;display:flex;justify-content:center;align-items:center;margin:40px auto 0;padding:0}
.hh-pipe li{position:relative;display:flex;align-items:center;gap:10px;padding:12px 18px;border-radius:14px;background:rgba(10,16,34,.9);border:1.5px solid rgba(122,167,255,.45);color:#fff;font-weight:700;font-size:.95rem;white-space:nowrap;opacity:0;transform:translateY(14px) scale(.9);transition:opacity .45s cubic-bezier(.16,1,.3,1),transform .45s cubic-bezier(.16,1,.3,1);transition-delay:calc(var(--i,0) * 120ms)}
.hh-pipe li::before{content:"";width:9px;height:9px;border-radius:50%;flex:none;background:#7aa7ff;box-shadow:0 0 10px #7aa7ff}
.hh-pipe li.is-human{border-color:rgba(255,193,94,.7)}
.hh-pipe li.is-human::before{background:#ffc15e;box-shadow:0 0 10px #ffc15e}
.hh-pipe li.is-done{border-color:rgba(46,229,157,.7)}
.hh-pipe li.is-done::before{background:#2ee59d;box-shadow:0 0 10px #2ee59d}
.hh-pipe li + li{margin-left:44px}
.hh-pipe li + li::after{content:"";position:absolute;right:100%;top:50%;width:44px;height:3px;margin-top:-1.5px;background:linear-gradient(90deg,transparent 0 35%,#fff 50%,transparent 65% 100%) no-repeat,rgba(122,167,255,.35);background-size:40% 100%,100% 100%;background-position:-60% 0,0 0;animation:hh-flow 1.6s linear infinite;animation-delay:calc(var(--i,0) * .25s)}
@keyframes hh-flow{to{background-position:160% 0,0 0}}
.home-hero.is-live .hh-pipe li,.cta-dark.is-live .hh-pipe li{opacity:1;transform:none}

/* Snap light (small, local: never a full-screen flash) */
.hh-burst{position:absolute;left:0;top:0;width:24px;height:24px;margin:-12px 0 0 -12px;border-radius:50%;background:#fff;box-shadow:0 0 40px 18px #4f8cff;opacity:0;transform:scale(0);pointer-events:none;z-index:3}
.hh-burst.go{animation:hh-burst .55s cubic-bezier(.16,1,.3,1)}
@keyframes hh-burst{0%{opacity:0;transform:scale(0)}35%{opacity:1;transform:scale(1.3)}100%{opacity:0;transform:scale(2.2)}}

/* Team chips */
.hh-teams{margin-top:26px;display:flex;flex-direction:column;align-items:center;gap:10px}
.hh-teams-label{font-family:var(--ffm);font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.5)}
.hh-chips{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.hh-chips button{min-height:40px;padding:0 16px;border-radius:999px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.05);color:rgba(255,255,255,.8);font:600 .88rem var(--ffb);cursor:pointer;transition:background .2s,color .2s}
.hh-chips button:hover{background:rgba(255,255,255,.12);color:#fff}
.hh-chips button[aria-pressed="true"]{background:linear-gradient(135deg,#0061fe,#4b3df7);border-color:transparent;color:#fff}
.hh-chips button:focus-visible,.hh-watch:focus-visible{outline:3px solid #7aa7ff;outline-offset:3px}

/* Busywork cards (decorative, positioned by home.js) */
.hh-cards{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.hh-card{position:absolute;left:0;top:0;display:flex;align-items:center;gap:10px;padding:10px 16px;border-radius:14px;background:#fff;color:#0b0e12;font-weight:700;font-size:.92rem;white-space:nowrap;box-shadow:0 14px 34px rgba(0,0,0,.45);will-change:transform,opacity;opacity:0}
.hh-card::after{content:"";width:9px;height:9px;border-radius:50%;background:#ff4d4f}
.hh-card i{width:24px;height:24px;border-radius:7px;flex:none;background:var(--c,#e6efff)}

@media(max-width:760px){
  .home-hero{padding:108px 18px 64px;align-items:flex-start}
  .home-hero h1{font-size:clamp(2.2rem,9.5vw,3rem)}
  .home-hero .hero-sub{font-size:1rem}
  .hh-pipe{display:grid;grid-template-columns:1fr 1fr;gap:10px;max-width:380px}
  .hh-pipe li{justify-content:center;font-size:.85rem;padding:10px 12px;white-space:normal}
  .hh-pipe li + li{margin-left:0}
  .hh-pipe li + li::after{display:none}
  .hh-chips{flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;max-width:100%;padding:2px 4px;scrollbar-width:none}
  .hh-chips::-webkit-scrollbar{display:none}
  .hh-chips button{flex:none}
  .hh-card{font-size:.8rem;padding:8px 12px}
}
@media(prefers-reduced-motion:reduce){
  .hh-pipe li{transition:none}
  .hh-pipe li + li::after{animation:none;background:rgba(122,167,255,.45)}
  .hh-card,.hh-burst{display:none}
}

/* Process: connecting line that draws with scroll (element added by home.js) */
.process-grid .proc-line{position:absolute;left:8%;right:8%;top:-22px;height:3px;border-radius:2px;background:var(--border);overflow:hidden}
.process-grid .proc-line span{display:block;height:100%;width:100%;transform-origin:0 50%;transform:scaleX(var(--p,0));background:linear-gradient(90deg,#0061fe,#8f7bff)}
.process-grid .proc-card{transition:box-shadow .3s,border-color .3s}
.process-grid .proc-card.is-lit{border-color:#b5ccf8;box-shadow:0 18px 50px rgba(0,97,254,.12)}
.process-grid .proc-card.is-lit .proc-n{color:var(--blue)}

/* Pillars */
.pl-ico{display:inline-flex;width:44px;height:44px;border-radius:12px;align-items:center;justify-content:center;background:var(--bluelight);color:var(--blue);margin-bottom:16px}
.pl-ico svg{width:22px;height:22px}
.pillar-map-grid .svc-card{transition:transform .25s,box-shadow .25s,border-color .25s}
.pillar-map-grid .svc-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:var(--border2)}
.pillar-proof{margin-top:40px}

/* Final CTA, dark to mirror the hero */
.cta-band.cta-dark{background:radial-gradient(55% 80% at 15% 20%,rgba(0,97,254,.4),transparent 70%),radial-gradient(50% 80% at 85% 90%,rgba(109,90,230,.35),transparent 70%),#05070e;color:#fff;border:0}
.cta-band.cta-dark h2{color:#fff}
.cta-band.cta-dark p{color:rgba(255,255,255,.72)}
.cta-band.cta-dark .s-label{color:#a9c6ff}
.cta-dark .hh-pipe{margin:0 auto 40px}

@media(max-width:760px){.process-grid .proc-line{display:none}}
@media(prefers-reduced-motion:reduce){.pillar-map-grid .svc-card:hover{transform:none}}

/* Section headings carry themselves on the homepage: no eyebrow labels, a little more presence */
body.home-dark #built-automations .s-label{display:none}
body.home-dark .section .s-head{font-size:clamp(2.1rem,3.9vw,3.2rem);font-weight:800;letter-spacing:-.035em;line-height:1.04}
body.home-dark .section .s-sub{font-size:1.06rem}

/* Trusted by: a compact proof band directly under the hero */
body.home-dark .partner-section{padding:60px 0 72px}
body.home-dark .partner-section .partner-head{max-width:none;margin-bottom:30px}
body.home-dark .partner-section .s-head{font-size:clamp(1.35rem,2vw,1.7rem);font-weight:700;letter-spacing:-.02em;margin-bottom:6px}
body.home-dark .partner-section .partner-head p{font-size:.95rem;margin-top:0}

/* Final CTA: the heading is the closing line */
body.home-dark .cta-band.cta-dark h2{font-size:clamp(2.6rem,5vw,4rem);font-weight:800;letter-spacing:-.04em;max-width:none}
body.home-dark .s-head,body.home-dark .cta-band h2{text-wrap:balance}
