/* V32 — midnight / electric blue / neon pink. */
:root{--ink:#090714;--electric:#ff2e9a;--acid:#29f2e4;--pink:#29f2e4;--bg:#090714;--text:#29f2e4;--muted:#29f2e4;--burgundy:#ff2e9a;--accent:#ff2e9a}
html,body{background:var(--ink);overflow-x:clip}
main>section{isolation:isolate}
main>.section{--panel:#090714;background:var(--panel)!important;color:var(--pink);padding-top:clamp(5rem,8vw,9rem);padding-bottom:clamp(11rem,17vw,16rem);margin-top:0;border-radius:0!important}
main>#expertises,main>#packages,main>#team{--panel:#29f2e4;color:var(--ink)}
main>#solutions,main>#events,main>#production,main>.process,main>.faq,main>#contact{--panel:#090714}
#solutions :is(h2,.section-index,.lead),#events :is(h2,.section-index),#production :is(h2,.section-index),.faq :is(h2,.section-index){color:var(--pink)!important}
#solutions .service-grid{margin-top:4rem}
#solutions .kinetic-line{display:block!important;position:relative;width:100%;max-width:none;left:auto;margin:0 0 clamp(3rem,6vw,6rem);padding:1.2rem 0!important;overflow:hidden;transform:none!important;border:0!important;border-radius:0;background:var(--pink);box-shadow:0 8px 0 var(--electric);z-index:3}
#solutions .kinetic-line .marquee-track{display:flex;gap:0;width:max-content;max-width:none;animation:nightMarquee 32s linear infinite!important;transform:none;font-size:clamp(1.65rem,4vw,4.2rem);font-weight:900;line-height:1.15;letter-spacing:-.035em;color:var(--ink);white-space:nowrap}
.marquee-group{display:block;flex:none;white-space:nowrap;padding-right:1.2em}
@keyframes nightMarquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.hero{padding-bottom:180px;background:var(--ink);border-radius:0}
.hero h1,.hero .hero-copy,.hero .eyebrow{color:var(--pink)}
.hero-stamp{background:var(--pink);color:var(--ink);box-shadow:12px 14px 0 var(--electric)}
.hero .hero-shade{background:linear-gradient(90deg,#090714eb,#09071470),linear-gradient(0deg,#090714,transparent 70%)}
.header,.header.scrolled{background:#090714f0;color:var(--pink);border-color:#ff2e9a88}
.header .button-small,.header:not(.scrolled) .button,.button,.hero-cta .button,.contact-form .button{background:var(--pink);color:var(--ink);border-color:var(--pink);box-shadow:0 6px 0 var(--electric)}
.button:hover,.contact-form .button:hover{background:var(--pink);color:var(--ink);box-shadow:0 10px 0 var(--electric)}
#solutions .service-grid .service-symbol-card{border:1px solid var(--electric)!important;box-shadow:0 10px 0 #ff2e9a4d!important}
.event-card{background:var(--pink);box-shadow:8px 8px 0 var(--electric)}
.event-card:is(:hover,.is-scroll-active):before{background:var(--ink)}
.event-card:is(:hover,.is-scroll-active) :is(h3,p,span,i){color:var(--pink)!important}
.expertise-card,.production-card{box-shadow:0 8px 0 var(--electric)}
.expertise-bridge{background:var(--ink)}
.expertise-bridge :is(p,h3,a,.bridge-mark){color:var(--pink);border-color:var(--electric)}
#packages .package-card{background:var(--ink);border:1px solid var(--electric);box-shadow:0 9px 0 #ff2e9a33}
#packages .package-card :is(h3,li,p,.price strong,.price small){color:var(--pink)!important}
#packages .package-visual{background:var(--electric);color:var(--pink)}
#packages .package-card .choose{background:var(--pink);border-color:var(--pink);color:var(--ink)}
#packages .package-card.is-reading{background:var(--ink)}
.process .timeline>li{background:var(--ink)!important;border:1px solid var(--electric);box-shadow:0 9px 0 #ff2e9a33}
.process .timeline>li b{background:var(--pink);color:var(--ink)!important}
.people article{border:1px solid var(--electric);box-shadow:0 10px 0 var(--electric)}
.contact-form .contact-service input:checked+span,.contact-form #builder .choice-grid input:checked+span{background:var(--ink)!important;color:var(--pink)!important;border-color:var(--electric)!important}
.contact-form .selected-package{background:var(--pink)}
.contact-form #builder .button{background:var(--pink);color:var(--ink)}
footer{background:var(--ink);position:relative;z-index:20}
/* Crossing light wings: overlap the previous section's padding, not its controls. */
main>.section>.section-lip{display:block;position:absolute;inset:auto 0 100%;height:clamp(130px,15vw,200px);overflow:visible;background:none;box-shadow:none;transform:none;border-radius:0;pointer-events:none;z-index:0;perspective:1100px}
.section-lip .light-wing{position:absolute;bottom:-2px;width:58%;height:100%;background:var(--panel);border-top:3px solid var(--electric);box-shadow:0 -12px 0 #ff2e9a2e;transform-origin:bottom;backface-visibility:visible}
.section-lip .light-wing:first-child{left:0;clip-path:polygon(0 38%,76% 0,100% 70%,100% 100%,0 100%);transform:translateY(var(--wing-y,70px)) rotateX(var(--wing-tilt,65deg))}
.section-lip .light-wing:last-child{right:0;clip-path:polygon(0 66%,24% 0,100% 35%,100% 100%,0 100%);transform:translateY(var(--wing-y,70px)) rotateX(calc(var(--wing-tilt,65deg) * -1))}
main>.section:nth-child(even) .light-wing:first-child{clip-path:ellipse(80% 95% at 25% 100%)}
main>.section:nth-child(even) .light-wing:last-child{clip-path:ellipse(80% 95% at 75% 100%)}
.section-lip:after{content:'';position:absolute;left:5%;right:5%;bottom:0;height:3px;background:var(--electric);box-shadow:0 0 20px var(--electric);transform:scaleX(var(--wing-progress,.1));transform-origin:center}
.section-seam{display:none}
/* One owner for scroll opacity/translation across every viewport size. */
html.flow-enabled body main#main [data-flow]{opacity:var(--flow-opacity,1)!important;transform:none!important;translate:var(--flow-x,0px) var(--flow-y,0px)!important;clip-path:none!important;visibility:visible!important;transition:none!important}
html.flow-enabled body main#main [data-flow='title']{translate:var(--flow-x,0px) 0!important}
.faq .accordions{position:relative;display:grid;gap:20px;align-content:start}
.faq-depth{perspective:1100px;min-width:0}
.faq .accordions .faq-depth>details{background:var(--ink);border:1px solid var(--electric)!important;padding:1.5rem;border-radius:24px;box-shadow:7px 8px 0 #ff2e9a4d;transform-origin:50% 30%;backface-visibility:visible;opacity:1}
html.flow-enabled .faq .accordions .faq-depth>details{opacity:var(--faq-opacity,1)!important;transform:translate3d(0,var(--faq-y,0px),var(--faq-z,0px)) rotateX(var(--faq-rx,0deg)) rotateY(var(--faq-ry,0deg))!important;translate:none!important;transition:none!important;clip-path:none!important}
.faq .accordions :is(summary,p){color:var(--pink)}
.faq .accordions summary:after{color:var(--pink)}
.faq .accordions details[open]{background:var(--pink)}
.faq .accordions details[open] :is(summary,p),.faq .accordions details[open] summary:after{color:var(--ink)}
@media(max-width:900px){
 #solutions .kinetic-line{width:100%;margin-inline:0;padding:.95rem 0!important}
 #solutions .kinetic-line .marquee-track{font-size:clamp(1.5rem,6.8vw,2.6rem)}
 main>.section{padding-bottom:12rem;isolation:auto}
 .scroll-stage,.scroll-stage-pin,.package-scroll-stage,.package-scroll-pin{transform:none!important;perspective:none}
 .faq .accordions{gap:15px}.faq .accordions .faq-depth>details{padding:1.25rem}
}
@media(prefers-reduced-motion:reduce){
 #solutions .kinetic-line .marquee-track{animation:none!important}
 .section-lip .light-wing{transform:none!important}
 html.flow-enabled body main#main [data-flow],html.flow-enabled .faq .accordions .faq-depth>details{opacity:1!important;transform:none!important;translate:none!important}
}
/* The wings extend outside their own section; only the page clips horizontal overflow. */
main>.section{overflow:visible!important}
#expertises .expertise-card :is(p,li,summary),#team .people :is(p,h3),.contact-form .selected-package :is(label,p,select){color:var(--ink)}
#team .people .initials{color:var(--pink)!important;background:var(--ink)}
#team .people .role{color:var(--ink)}
#packages .package-controls :is(span,output){color:var(--ink)}