/* 2026 home refresh: editorial grid + a constructed 3D paper architecture. */
:root { --home-ink:#0a0a0a; --home-paper:#f5f5f3; --home-indigo:#4f46e5; --home-rule:rgba(10,10,10,.14); }
html { background:var(--home-paper); }
body { background:var(--home-paper); color:var(--home-ink); }

/* The hero is deliberately a stage, not a video wallpaper. */
.hero { min-height:100svh; height:auto; isolation:isolate; background:var(--home-ink); overflow:hidden; padding:clamp(7rem,13vh,10rem) clamp(1.25rem,5vw,5rem) clamp(2rem,5vw,4rem); }
.hero::before { content:""; position:absolute; inset:0; background:repeating-linear-gradient(90deg, transparent 0 calc(25% - 1px), rgba(255,255,255,.09) calc(25% - 1px) 25%); opacity:.5; pointer-events:none; }
.hero::after { opacity:.28; z-index:0; }
.hero-video,.hero-grad { display:none!important; }
.hero-content { position:relative; z-index:3; min-height:calc(100svh - clamp(9rem,18vh,14rem)); max-width:1400px; margin:auto; justify-content:space-between; }
.hero-brand { position:absolute; top:0; left:0; right:auto; width:min(42vw,34rem); display:block; flex:none; text-align:left; pointer-events:none; }
.hero-brand-origin { color:rgba(255,255,255,.58); font-size:clamp(.8rem,1.15vw,1rem); letter-spacing:.35em; }
.hero-brand-name { font-size:clamp(5.8rem,11vw,11.5rem); line-height:.76; letter-spacing:.06em; color:#fff; mix-blend-mode:screen; }
.hero-brand-sub { color:rgba(255,255,255,.5); margin-top:2rem; }
.hero-headline { font-size:clamp(1.65rem,3vw,3rem); letter-spacing:.04em; }
.hero-content > .flex { position:relative; z-index:4; }
.hero .split-char,.hero .fade-up { will-change:transform,opacity; }
.hero-axis { position:absolute; z-index:1; left:50%; top:8%; bottom:0; width:1px; background:linear-gradient(transparent,rgba(255,255,255,.42),transparent); }
.hero-architecture { position:absolute; z-index:2; width:min(48vw,720px); height:min(45vw,650px); right:5vw; top:7rem; perspective:1400px; pointer-events:none; }
.architecture-stage { position:absolute; inset:0; transform-style:preserve-3d; transform:rotateX(62deg) rotateZ(-25deg); animation:structure-orbit 25s cubic-bezier(.45,0,.55,1) infinite alternate; }
.architecture-stage.is-paused,.architecture-stage.is-paused .structure { animation-play-state:paused; }
.structure { position:absolute; width:clamp(92px,16vw,260px); height:clamp(92px,16vw,260px); transform-style:preserve-3d; border:1px solid rgba(255,255,255,.52); background:rgba(79,70,229,.12); }
.structure::before,.structure::after,.structure i,.structure b { content:""; position:absolute; display:block; inset:0; border:inherit; background:inherit; }
.structure::before { transform:translateZ(clamp(32px,5vw,90px)); background:rgba(255,255,255,.8); }
.structure::after { transform:rotateX(90deg) translateZ(clamp(32px,5vw,90px)); transform-origin:center; background:rgba(79,70,229,.78); }
.structure i { transform:rotateY(90deg) translateZ(clamp(32px,5vw,90px)); transform-origin:center; background:rgba(255,255,255,.17); }
.structure b { transform:translateZ(clamp(64px,10vw,180px)); background:transparent; border-color:rgba(255,255,255,.18); }
.structure--one { left:10%; top:15%; transform:translateZ(70px) rotateZ(12deg); animation:fold-one 12s ease-in-out infinite alternate; }
.structure--two { left:39%; top:4%; transform:translateZ(150px) rotateZ(-12deg); animation:fold-two 15s ease-in-out infinite alternate; }
.structure--three { left:59%; top:27%; transform:translateZ(-60px) rotateZ(24deg); animation:fold-three 13s ease-in-out infinite alternate; }
.structure--four { left:25%; top:46%; transform:translateZ(110px) rotateZ(-24deg); animation:fold-four 16s ease-in-out infinite alternate; }
.structure--five { left:52%; top:59%; transform:translateZ(40px) rotateZ(15deg); animation:fold-two 17s ease-in-out infinite alternate-reverse; }
.structure--six { left:2%; top:65%; transform:translateZ(-90px) rotateZ(35deg); animation:fold-one 14s ease-in-out infinite alternate-reverse; }
@keyframes structure-orbit { to { transform:rotateX(57deg) rotateZ(8deg) translate3d(-4%,2%,80px); } }
@keyframes fold-one { to { transform:translate3d(30px,-18px,160px) rotateZ(-21deg) rotateY(20deg); } }
@keyframes fold-two { to { transform:translate3d(-42px,36px,-80px) rotateZ(28deg) rotateX(16deg); } }
@keyframes fold-three { to { transform:translate3d(-24px,-42px,140px) rotateZ(-10deg) rotateY(-20deg); } }
@keyframes fold-four { to { transform:translate3d(36px,18px,80px) rotateZ(12deg) rotateX(-13deg); } }

/* One quiet control governs all non-essential site motion. */
.motion-control { position:fixed; z-index:110; right:1.25rem; bottom:1.25rem; width:3rem; height:3rem; display:grid; place-items:center; border:1px solid rgba(10,10,10,.24); border-radius:50%; background:rgba(245,245,243,.92); color:var(--home-ink); font:500 .55rem/1 'Zen Kaku Gothic New',sans-serif; letter-spacing:.08em; cursor:pointer; backdrop-filter:blur(12px); }
.motion-control:hover { background:var(--home-indigo); color:#fff; border-color:var(--home-indigo); }
body.motion-paused *,body.motion-paused *::before,body.motion-paused *::after { animation-play-state:paused!important; scroll-behavior:auto!important; }

/* Editorial rhythm across the existing eight sections. */
#header { padding-inline:clamp(1.25rem,5vw,5rem); }
#header.scrolled { background:rgba(245,245,243,.94); }
#services, .why-value-section, .flow-section, #about, #contact { border-color:var(--home-rule)!important; }
#services { background:var(--home-paper); position:relative; }
#services::before,.why-value-section::before,.flow-section::before { content:""; position:absolute; left:clamp(1.25rem,5vw,5rem); right:clamp(1.25rem,5vw,5rem); height:1px; background:var(--home-rule); }
.sec-title,.why-value-header h2 { letter-spacing:.015em; }
.sec-label { color:var(--home-indigo); font-weight:500; }
.sec-label::before { content:"/ "; }
.svc-row { border-color:var(--home-rule); }
.svc-row:hover { background:var(--home-ink)!important; }
.why-value-section { background:#e9e9e6; }
.flow-section { background:var(--home-paper); }
.vb { gap:clamp(2rem,8vw,8rem); }
.vb-num { color:var(--home-indigo); opacity:1; font-size:clamp(3.4rem,7vw,6.5rem); }
.vb-points li::before { border-radius:0; transform:rotate(45deg); }
.bi-collage { border-radius:0; box-shadow:none; }
.work-card { border-radius:0; }
.photo-marquee-item { border-radius:0; }
#contact { background:var(--home-ink)!important; }
footer { background:var(--home-ink)!important; }

/* The brand occupies the upper field; the decision point is anchored to the floor. */
.hero-content { display:flex; flex-direction:column; }
.hero-content > .flex { margin-top:auto; padding-top:0; }
.hero-content > .flex > :first-child { max-width:34rem; }
.hero-content > .flex > :last-child { align-self:flex-end; }

/* Services: an index spread, with the rows reading as a single decision system. */
.section-services { padding-top:clamp(6rem,12vw,12rem)!important; padding-bottom:clamp(6rem,11vw,11rem)!important; }
.section-services > div > div:first-child { display:block!important; position:relative; }
.section-services > div > div:first-child::after { content:"01"; position:absolute; right:0; top:0; font:300 clamp(5rem,13vw,12rem)/.7 'Cormorant Garamond',serif; color:rgba(10,10,10,.08); pointer-events:none; }
.section-services .svc-row { min-height:7.4rem; }
.section-services .svc-row h3 { font-family:'Zen Kaku Gothic New',sans-serif; font-weight:300; }
.section-services .svc-detail.open { background:rgba(79,70,229,.045); }

/* Numbers: a dense black ledger rather than an ordinary dark card section. */
.section-numbers { position:relative; background:var(--home-ink)!important; padding-top:clamp(6rem,11vw,10rem)!important; padding-bottom:clamp(6rem,11vw,10rem)!important; }
.section-numbers > div { max-width:76rem!important; }
.section-numbers > div > .grid.grid-cols-3 { margin-inline:auto; max-width:62rem; gap:0!important; border:1px solid rgba(255,255,255,.18); }
.section-numbers > div > .grid.grid-cols-3 > div { padding:clamp(1.25rem,3.2vw,3rem) 1rem; }
.section-numbers > div > .grid.grid-cols-3 > div + div { border-left:1px solid rgba(255,255,255,.18); }
.section-numbers .work-card { padding:clamp(1.5rem,3vw,3rem); border-color:rgba(255,255,255,.22); }
.section-numbers .work-card:first-child { border-top:3px solid var(--home-indigo); }
.section-numbers .work-card:last-child { border-top:3px solid rgba(255,255,255,.6); }

/* Reasons: alternating ash ground and precise, exposed editorial layout. */
.section-why { background:#e5e5e1!important; padding-top:clamp(6rem,11vw,10rem)!important; padding-bottom:clamp(5rem,9vw,9rem)!important; }
.section-why .why-value-header { position:relative; display:block; border-bottom:1px solid var(--home-rule); padding-bottom:2rem; }
.section-why .why-value-header::after { content:"02"; position:absolute; right:0; top:0; font:300 clamp(5rem,13vw,12rem)/.7 'Cormorant Garamond',serif; color:rgba(10,10,10,.1); pointer-events:none; }
.section-why .vb { border-top:1px solid var(--home-rule); padding-top:clamp(2rem,5vw,5rem); }
.section-why .vb-points { border-top:1px solid var(--home-rule); }
.section-why .bi-collage { outline:1px solid rgba(10,10,10,.18); outline-offset:10px; }

/* Flow: a four-part ledger with no decorative cards. */
.section-flow { position:relative; padding-top:clamp(6rem,11vw,10rem)!important; padding-bottom:clamp(5rem,10vw,9rem)!important; }
.section-flow .flow-header { position:relative; display:block; border-bottom:1px solid var(--home-rule); padding-bottom:2rem; }
.section-flow .flow-header::after { content:"03"; position:absolute; right:0; top:0; font:300 clamp(5rem,13vw,12rem)/.7 'Cormorant Garamond',serif; color:rgba(10,10,10,.09); pointer-events:none; }
.section-flow .flow-grid { border-top:0!important; }
.section-flow .flow-grid::before { top:0; left:0; right:0; background:var(--home-indigo); }
.section-flow .flow-step { padding:3.5rem 2rem 1rem!important; border-left:1px solid var(--home-rule); }
.section-flow .flow-step:last-child { border-right:1px solid var(--home-rule); }
.section-flow .flow-node { border-radius:0; width:2.7rem; height:2.7rem; }

/* Founder and FAQ form an open/closed pair: image-led profile, then quiet questions. */
.section-founder { background:#dfe0ed!important; padding-top:clamp(6rem,12vw,12rem)!important; padding-bottom:clamp(5rem,10vw,9rem)!important; }
.section-founder .rounded-lg { border-radius:0!important; outline:1px solid rgba(10,10,10,.18); outline-offset:10px; }
.section-founder .tag { border-radius:0; }
.section-founder table { border-bottom:1px solid var(--home-rule); }
.section-faq { background:var(--home-paper); padding-top:clamp(6rem,11vw,10rem)!important; padding-bottom:clamp(6rem,11vw,10rem)!important; }
.section-faq > div:first-child { position:relative; display:block; border-bottom:1px solid var(--home-rule); padding-bottom:2rem; margin-bottom:clamp(2rem,5vw,5rem); }
.section-faq > div:first-child::after { content:"04"; position:absolute; right:0; top:0; font:300 clamp(5rem,13vw,12rem)/.7 'Cormorant Garamond',serif; color:rgba(10,10,10,.09); pointer-events:none; }
.section-faq details { padding-block:1.65rem!important; }
.section-faq details[open] { padding-inline:1rem; background:#ecece7; }

/* Contact becomes the final field, with a white architectural frame around the form. */
.section-contact { padding-top:clamp(6rem,12vw,12rem)!important; padding-bottom:clamp(6rem,12vw,12rem)!important; }
.section-contact > div { border-top:1px solid rgba(255,255,255,.45); padding-top:clamp(2rem,5vw,5rem); }
.section-contact form { border-left:1px solid rgba(255,255,255,.34); padding-left:clamp(1.25rem,4vw,4rem); }
.section-contact .sec-label::before { color:var(--home-indigo); }

@media (max-width:768px) {
  .hero-content > .flex { padding-top:0; }
  .hero-content > .flex > :last-child { align-self:stretch; }
  .section-services > div > div:first-child::after,.section-why .why-value-header::after,.section-flow .flow-header::after,.section-faq > div:first-child::after { display:none; }
  .section-numbers > div > .grid.grid-cols-3 > div { padding:1.15rem .5rem; }
  .section-numbers > div > .grid.grid-cols-3 > div + div { border-left:1px solid rgba(255,255,255,.18); }
  .section-flow .flow-step { border-left:0; border-right:0!important; padding:1.25rem 0 2rem 0!important; }
  .section-flow .flow-grid::before { left:0; }
  .section-contact form { border-left:0; border-top:1px solid rgba(255,255,255,.34); padding:2rem 0 0; }
}

@media (max-width:768px) { .hero { min-height:790px; padding-top:7.5rem; } .hero-brand { top:0; width:100%; } .hero-brand-name { font-size:clamp(5rem,25vw,8rem); } .hero-architecture { width:100vw; height:92vw; right:-10vw; top:13.5rem; opacity:.78; } .hero-axis { left:20%; } .hero-content { min-height:650px; } .hero-content > .flex { margin-top:auto; } .structure { width:clamp(76px,23vw,130px); height:clamp(76px,23vw,130px); } .motion-control { right:.9rem; bottom:.9rem; } }
@media (prefers-reduced-motion:reduce) { .architecture-stage,.structure,.marquee-track,.photo-marquee-track { animation:none!important; } .hero-brand .split-char,.fade-up { opacity:1!important; transform:none!important; transition:none!important; } }