:root {
  --ink: #111318;
  --ink-2: #1b1e25;
  --paper: #f2eee4;
  --white: #fffaf0;
  --coral: #ff6247;
  --blue: #67b7ff;
  --lime: #b8e86a;
  --lilac: #a596ff;
  --muted: #6d6d68;
  --line: rgba(17, 19, 24, .18);
  --display: "Bricolage Grotesque", "Arial Black", sans-serif;
  --body: "IBM Plex Sans", Arial, sans-serif;
  --mono: "IBM Plex Mono", monospace;
  --ease-pop: cubic-bezier(.2, 1.55, .35, 1);
  --ease-smooth: cubic-bezier(.22, .8, .24, 1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--ink); }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: var(--body); line-height: 1.5; overflow-x: hidden; }
body.is-asleep { overflow: hidden; }
a { color: inherit; }
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
::selection { color: var(--ink); background: var(--lime); }

.skip-link { position: fixed; left: 14px; top: -80px; z-index: 1000; padding: 12px 18px; color: var(--paper); background: var(--ink); border-radius: 0 0 8px 8px; transition: top .2s; }
.skip-link:focus { top: 0; }

.boot { position: fixed; inset: 0; z-index: 900; display: grid; place-items: center; color: var(--paper); background: var(--ink); overflow: hidden; transition: visibility 0s 1.15s; }
.boot::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 50% 48%, rgba(103,183,255,.12), transparent 34%); }
.boot__field { position: absolute; inset: 0; }
.boot-bar { position: absolute; display: block; height: clamp(18px, 3.4vw, 52px); border-radius: 5px; transform-origin: left; animation: waiting 4s var(--ease-smooth) infinite; }
.boot-bar--1 { width: 28vw; top: 12%; left: -4%; background: var(--coral); }
.boot-bar--2 { width: 19vw; top: 21%; right: 8%; background: var(--blue); animation-delay: -.7s; }
.boot-bar--3 { width: 14vw; bottom: 18%; left: 8%; background: var(--lime); animation-delay: -1.4s; }
.boot-bar--4 { width: 31vw; bottom: 8%; right: -6%; background: var(--lilac); animation-delay: -2.1s; }
.boot-bar--5 { width: 7vw; top: 48%; right: 4%; background: var(--paper); animation-delay: -2.8s; }
@keyframes waiting { 0%, 84%, 100% { transform: scaleX(1) rotate(0); } 88% { transform: scaleX(.92) rotate(-1deg); } 91% { transform: scaleX(1.04) rotate(.7deg); } 94% { transform: scaleX(1); } }
.boot__content { position: relative; width: min(720px, calc(100% - 40px)); text-align: center; }
.mini-mark { width: 66px; height: 45px; margin: 0 auto 28px; display: grid; gap: 5px; align-content: center; }
.mini-mark span { display: block; height: 7px; border-radius: 2px; transform-origin: left; animation: markTwitch 2.8s var(--ease-pop) infinite; }
.mini-mark span:nth-child(1) { width: 100%; background: var(--coral); }
.mini-mark span:nth-child(2) { width: 72%; margin-left: 18%; background: var(--blue); animation-delay: -.35s; }
.mini-mark span:nth-child(3) { width: 48%; margin-left: 4%; background: var(--lime); animation-delay: -.7s; }
@keyframes markTwitch { 0%, 78%, 100% { transform: scaleX(1); } 83% { transform: scaleX(.82); } 88% { transform: scaleX(1.1); } 92% { transform: scaleX(1); } }
.system-label { margin: 0 0 18px; font: 500 11px/1.4 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.boot h1 { margin: 0; font: 700 clamp(52px, 9vw, 126px)/.82 var(--display); letter-spacing: -.065em; }
.boot h1 em { color: var(--coral); font-style: normal; }
.boot__content > p:not(.system-label) { max-width: 520px; margin: 28px auto; color: rgba(242,238,228,.72); font-size: 16px; }
.boot__actions { display: flex; align-items: center; justify-content: center; gap: 20px; }
.wake-button { min-width: 210px; padding: 8px 8px 8px 22px; display: flex; align-items: center; justify-content: space-between; gap: 22px; border: 0; color: var(--ink); background: var(--coral); border-radius: 999px; font-weight: 600; cursor: pointer; transition: transform .2s var(--ease-pop), background .2s; }
.wake-button i { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; color: var(--paper); background: var(--ink); font-style: normal; font-size: 22px; transition: transform .35s var(--ease-pop); }
.wake-button:hover { transform: rotate(-1.5deg) scale(1.035); background: var(--lime); }
.wake-button:hover i { transform: rotate(92deg); }
.quiet-button { padding: 10px 0; border: 0; border-bottom: 1px solid currentColor; color: var(--paper); background: none; cursor: pointer; }
.boot__note { position: absolute; bottom: 20px; left: 24px; margin: 0; font: 10px var(--mono); opacity: .52; text-transform: uppercase; }
.has-entered .boot { visibility: hidden; }
.has-entered .boot__content { animation: bootOut .72s var(--ease-smooth) forwards; }
.has-entered .boot-bar--1, .has-entered .boot-bar--3 { animation: exitLeft .9s var(--ease-smooth) forwards; }
.has-entered .boot-bar--2, .has-entered .boot-bar--4, .has-entered .boot-bar--5 { animation: exitRight .9s var(--ease-smooth) forwards; }
@keyframes bootOut { to { opacity: 0; transform: scale(.92) rotate(-1deg); } }
@keyframes exitLeft { to { transform: translateX(-120vw) scaleX(1.8); } }
@keyframes exitRight { to { transform: translateX(120vw) scaleX(1.8); } }

.site-header { position: fixed; inset: 0 0 auto; z-index: 100; min-height: 70px; display: grid; grid-template-columns: minmax(230px, .8fr) 1.5fr auto; align-items: center; gap: 24px; padding: 10px 20px; color: var(--paper); background: rgba(17,19,24,.94); border-bottom: 1px solid rgba(242,238,228,.15); backdrop-filter: blur(12px); transform: translateY(-105%); transition: transform .6s var(--ease-smooth); }
.has-entered .site-header { transform: translateY(0); transition-delay: .58s; }
.brand { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; width: max-content; }
.brand__mark { width: 38px; display: grid; gap: 4px; }
.brand__mark i { display: block; height: 5px; border-radius: 1px; transform-origin: left; transition: transform .3s var(--ease-pop); }
.brand__mark i:nth-child(1) { width: 100%; background: var(--coral); }
.brand__mark i:nth-child(2) { width: 70%; margin-left: 20%; background: var(--blue); }
.brand__mark i:nth-child(3) { width: 52%; background: var(--lime); }
.brand:hover .brand__mark i:nth-child(1) { transform: scaleX(.7); }
.brand:hover .brand__mark i:nth-child(2) { transform: translateX(-20%) scaleX(1.2); }
.brand:hover .brand__mark i:nth-child(3) { transform: translateX(45%) scaleX(.8); }
.brand__name { font: 700 17px/.9 var(--display); letter-spacing: -.035em; }
.brand__name b { color: var(--blue); font-weight: inherit; }
.chapter-nav { display: flex; justify-content: center; gap: 5px; }
.chapter-nav a { width: min(88px, 7vw); display: grid; grid-template-columns: 1fr; gap: 5px; text-decoration: none; color: rgba(242,238,228,.58); font: 9px var(--mono); text-transform: uppercase; transition: color .2s; }
.chapter-nav i { height: 5px; display: block; background: rgba(242,238,228,.16); border-radius: 1px; transform-origin: left; transition: transform .35s var(--ease-pop), background .25s; }
.chapter-nav a:nth-child(4n+1).is-current i { background: var(--coral); }
.chapter-nav a:nth-child(4n+2).is-current i { background: var(--blue); }
.chapter-nav a:nth-child(4n+3).is-current i { background: var(--lime); }
.chapter-nav a:nth-child(4n).is-current i { background: var(--lilac); }
.chapter-nav a:hover, .chapter-nav a.is-current { color: var(--paper); }
.chapter-nav a:hover i { transform: scaleX(.82) translateX(8%); }
.chapter-nav a.is-current i { transform: scaleX(1); animation: navPop .45s var(--ease-pop); }
@keyframes navPop { 0% { transform: scaleX(.12); } 72% { transform: scaleX(1.08); } 100% { transform: scaleX(1); } }
.header-tools { display: flex; align-items: center; gap: 14px; }
.chapter-readout { font: 10px var(--mono); color: rgba(242,238,228,.55); }
.chapter-readout b { color: var(--paper); }
.sound-toggle { display: flex; align-items: center; gap: 8px; padding: 7px 10px; border: 1px solid rgba(242,238,228,.2); color: var(--paper); background: transparent; border-radius: 999px; cursor: pointer; font: 9px var(--mono); text-transform: uppercase; }
.sound-bars { height: 12px; display: flex; align-items: end; gap: 2px; }
.sound-bars i { width: 2px; height: 40%; background: var(--lime); animation: soundBar .8s ease-in-out infinite alternate; }
.sound-bars i:nth-child(2) { height: 100%; animation-delay: -.3s; }.sound-bars i:nth-child(3) { height: 65%; animation-delay: -.55s; }
@keyframes soundBar { to { height: 100%; } }
.sound-toggle[aria-pressed="true"] .sound-bars i { animation: none; height: 2px; background: var(--coral); }
.header-cta { padding: 10px 14px; color: var(--ink); background: var(--paper); border-radius: 999px; text-decoration: none; font-size: 12px; font-weight: 600; transition: transform .2s var(--ease-pop), background .2s; }
.header-cta:hover { transform: rotate(-1deg) scale(1.025); background: var(--lime); }

.cursor-friend { --x: -100px; --y: -100px; position: fixed; left: 0; top: 0; z-index: 150; width: 24px; height: 24px; transform: translate3d(var(--x), var(--y), 0); pointer-events: none; mix-blend-mode: difference; opacity: 0; transition: opacity .3s; }
.has-entered .cursor-friend { opacity: 1; }
.cursor-friend::before, .cursor-friend i { content: ""; position: absolute; border-radius: 50%; }
.cursor-friend::before { inset: 0; border: 1px solid white; }
.cursor-friend i { width: 5px; height: 5px; left: 10px; top: 10px; background: white; transition: transform .25s var(--ease-pop); }
.cursor-friend.is-curious i { transform: scale(2.6); }

.chapter { position: relative; width: 100%; max-width: 100vw; min-height: 100vh; padding: clamp(110px, 12vw, 180px) clamp(24px, 5vw, 80px); overflow: hidden; }
.hero > *, .section-intro--split > *, .process-board > *, .case > *, .contact-layout > *, .site-header > * { min-width: 0; }
.hero { min-height: 110vh; padding-top: clamp(145px, 16vh, 210px); display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(360px, .78fr); gap: 40px; align-content: center; color: var(--paper); background: var(--ink); }
.hero::before { content: ""; position: absolute; width: 38vw; height: 38vw; right: -18vw; top: 22%; border: 1px solid rgba(103,183,255,.18); border-radius: 50%; box-shadow: 0 0 90px rgba(103,183,255,.08); }
.hero__ticker { position: absolute; top: 70px; left: 0; width: 100%; min-height: 34px; display: flex; align-items: center; gap: 22px; padding: 0 24px; color: var(--ink); background: var(--blue); font: 10px var(--mono); letter-spacing: .08em; white-space: nowrap; overflow: hidden; }
.hero__ticker i { width: 28px; height: 5px; background: var(--ink); animation: tickerWiggle 2.7s var(--ease-pop) infinite; }
.hero__ticker i:nth-of-type(2) { animation-delay: -.7s; }.hero__ticker i:nth-of-type(3) { animation-delay: -1.4s; }.hero__ticker i:nth-of-type(4) { animation-delay: -2.1s; }
@keyframes tickerWiggle { 0%,80%,100% { transform: scaleX(1); } 86% { transform: scaleX(.6) rotate(2deg); } 92% { transform: scaleX(1.2) rotate(-1deg); } }
.hero__copy { position: relative; z-index: 2; align-self: center; }
.live-dot { display: inline-block; width: 7px; height: 7px; margin-right: 7px; background: var(--lime); border-radius: 50%; box-shadow: 0 0 0 0 rgba(184,232,106,.5); animation: livePulse 2s infinite; }
@keyframes livePulse { 70%,100% { box-shadow: 0 0 0 9px rgba(184,232,106,0); } }
.hero h1 { max-width: 980px; margin: 0; font: 750 clamp(58px, 8.35vw, 128px)/.78 var(--display); letter-spacing: -.07em; }
.hero h1 em { position: relative; display: inline-block; color: var(--coral); font-style: normal; animation: titleNudge 5s var(--ease-pop) infinite; }
@keyframes titleNudge { 0%,84%,100% { transform: translate(0) rotate(0); } 88% { transform: translate(7px,-2px) rotate(.7deg); } 92% { transform: translate(-2px,1px) rotate(-.3deg); } }
.hero__lede { max-width: 720px; margin: 34px 0 30px; color: rgba(242,238,228,.78); font-size: clamp(17px, 1.55vw, 23px); line-height: 1.35; }
.hero__actions { display: flex; align-items: center; gap: 22px; }
.action { min-width: 210px; padding: 9px 9px 9px 18px; display: inline-flex; align-items: center; justify-content: space-between; gap: 20px; border-radius: 999px; text-decoration: none; font-size: 13px; font-weight: 600; transition: transform .25s var(--ease-pop); }
.action i { width: 42px; height: 42px; display: grid; place-items: center; color: var(--paper); background: var(--ink); border-radius: 50%; font-style: normal; }
.action--coral { color: var(--ink); background: var(--coral); }
.action:hover { transform: rotate(-1.5deg) scale(1.03); }
.plain-link { color: var(--paper); text-underline-offset: 6px; font-size: 13px; }
.hero-machine { position: relative; min-height: 480px; align-self: center; border: 1px solid rgba(242,238,228,.22); background: #0c0e12; border-radius: 12px; overflow: hidden; box-shadow: 16px 16px 0 rgba(165,150,255,.12); }
.machine-caption { height: 46px; padding: 0 16px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(242,238,228,.18); font: 9px var(--mono); }
.machine-stage { position: relative; min-height: 370px; display: grid; place-items: center; overflow: hidden; }
.machine-word { position: absolute; font: 800 clamp(54px, 6vw, 92px)/.8 var(--display); letter-spacing: -.07em; }
.machine-word--a { left: 8%; top: 16%; color: var(--paper); animation: wordA 5.6s var(--ease-pop) infinite; }
.machine-word--b { right: 7%; top: 42%; color: var(--blue); animation: wordB 5.6s var(--ease-pop) infinite; }
.machine-word--c { left: 18%; bottom: 10%; color: var(--coral); animation: wordC 5.6s var(--ease-pop) infinite; }
.machine-block { position: absolute; display: block; height: 12px; border-radius: 2px; }
.machine-block--1 { width: 38%; top: 12%; right: -3%; background: var(--lime); animation: block1 5.6s var(--ease-pop) infinite; }
.machine-block--2 { width: 24%; left: -5%; top: 47%; background: var(--lilac); animation: block2 5.6s var(--ease-pop) infinite; }
.machine-block--3 { width: 15%; right: 12%; bottom: 7%; background: var(--paper); animation: block3 5.6s var(--ease-pop) infinite; }
@keyframes wordA { 0%,12% { transform: translateX(-130%); } 20%,82% { transform: translateX(0); } 86% { transform: translateX(8px) rotate(1deg); } 91% { transform: translateX(-2px); } 100% { transform: translateX(130%); } }
@keyframes wordB { 0%,22% { transform: translateX(140%); } 32%,82% { transform: translateX(0); } 88% { transform: scaleX(.88); } 92% { transform: scaleX(1.04); } 100% { transform: translateX(-140%); } }
@keyframes wordC { 0%,32% { transform: translateY(160%); } 42%,82% { transform: translateY(0); } 87% { transform: translateY(-5px) rotate(-1deg); } 92% { transform: translateY(1px); } 100% { transform: translateY(-190%); } }
@keyframes block1 { 0%,10% { transform: scaleX(0); } 18%,88% { transform: scaleX(1); } 92%,100% { transform: scaleX(0); } }
@keyframes block2 { 0%,20% { transform: scaleX(0); } 28%,88% { transform: scaleX(1); } 94%,100% { transform: scaleX(0); } }
@keyframes block3 { 0%,38% { transform: scaleX(0); } 46%,88% { transform: scaleX(1); } 96%,100% { transform: scaleX(0); } }
.hero-machine > p { margin: 0; padding: 13px 16px; border-top: 1px solid rgba(242,238,228,.18); color: rgba(242,238,228,.52); font: 9px var(--mono); }
.hero__aside { grid-column: 2; max-width: 470px; margin-left: auto; padding: 18px 0 0 18px; border-left: 8px solid var(--lime); }
.hero__aside span { font: 9px var(--mono); text-transform: uppercase; opacity: .54; }
.hero__aside p { margin: 9px 0 0; font-size: 13px; }
.scroll-note { position: absolute; left: clamp(24px, 5vw, 80px); bottom: 28px; display: flex; align-items: center; gap: 10px; font: 9px var(--mono); opacity: .55; text-transform: uppercase; }
.scroll-note i { width: 34px; height: 5px; background: var(--coral); animation: scrollNudge 1.8s ease-in-out infinite; }
@keyframes scrollNudge { 50% { transform: translateX(9px) scaleX(.7); } }

.chapter-tag { position: absolute; top: 88px; left: 0; right: 0; height: 36px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 18px; padding: 0 clamp(24px,5vw,80px); border-block: 1px solid var(--line); font: 9px var(--mono); text-transform: uppercase; }
.chapter-tag i { display: block; height: 5px; background: var(--ink); transform-origin: left; }
.section-intro { max-width: 1160px; margin-bottom: clamp(55px, 8vw, 105px); }
.section-intro h2 { margin: 0; font: 700 clamp(48px, 7.4vw, 112px)/.84 var(--display); letter-spacing: -.065em; }
.section-intro h2 em { color: var(--coral); font-style: normal; }
.section-intro > p:last-child { max-width: 820px; margin: 32px 0 0; font-size: clamp(17px, 1.7vw, 24px); line-height: 1.4; }
.section-intro--split { max-width: none; display: grid; grid-template-columns: 1.45fr .55fr; gap: 7vw; align-items: end; }
.section-intro--split > p:last-child { margin: 0 0 8px; font-size: 16px; }
.reveal { opacity: 0; transform: translateY(28px); transition: opacity .65s ease, transform .65s var(--ease-smooth); }
.reveal.is-visible { opacity: 1; transform: translateY(0); }

.what { background: var(--paper); }
.what .chapter-tag i { background: var(--coral); }
.service-stack { display: grid; gap: 10px; }
.service-item { --bar:var(--coral); position:relative; }
.service-item--blue { --bar:var(--blue); }.service-item--lime { --bar:var(--lime); }
.service-bar { width:100%; min-height:150px; display:grid; grid-template-columns:62px 1fr minmax(260px,.75fr) 54px; align-items:center; gap:25px; padding:24px 30px; color:var(--ink); background:var(--bar); border:2px solid var(--ink); border-radius:8px; box-shadow:7px 7px 0 var(--ink); text-align:left; cursor:pointer; transform-origin:center; transition:transform .32s var(--ease-pop),box-shadow .32s,border-radius .25s; }
.service-bar:hover, .service-bar:focus-visible { transform:translate(-3px,-4px) rotate(-.35deg); box-shadow:12px 13px 0 var(--ink); outline:none; }
.service-bar__number { font: 500 12px var(--mono); align-self: start; }
.service-bar__title { display:block; }.service-bar__title small { display:block; margin:0 0 5px; font:10px var(--mono); text-transform:uppercase; }.service-bar__title strong { display:block; font:700 clamp(27px,3.2vw,48px)/.95 var(--display); letter-spacing:-.04em; }
.service-bar__summary { font-size:14px; }
.service-bar > i { width: 48px; height: 48px; display: grid; place-items: center; justify-self: end; border-radius: 50%; background: var(--ink); color: var(--paper); font-style: normal; font-size: 22px; transition: transform .36s var(--ease-pop); }
.service-bar:hover > i, .service-bar:focus-visible > i { transform:rotate(94deg) scale(1.08); }
.service-item.is-open .service-bar { border-radius:8px 8px 0 0; box-shadow:none; transform:none; }
.service-item.is-open .service-bar > i { transform:rotate(135deg); }
.service-detail { display:grid; grid-template-rows:0fr; opacity:0; visibility:hidden; transition:grid-template-rows .58s var(--ease-smooth),opacity .28s ease,visibility 0s .58s; }
.service-detail__clip { min-height:0; overflow:hidden; }
.service-detail__content { display:grid; grid-template-columns:1.2fr .8fr .75fr; gap:clamp(28px,4vw,68px); padding:clamp(28px,4vw,58px); background:var(--paper); border:2px solid var(--ink); border-top:0; border-radius:0 0 8px 8px; box-shadow:7px 7px 0 var(--ink); }
.service-item.is-open .service-detail { grid-template-rows:1fr; opacity:1; visibility:visible; transition:grid-template-rows .68s var(--ease-pop),opacity .25s ease .08s,visibility 0s; }
.service-detail .system-label { margin:0 0 14px; }.service-detail h4 { margin:0 0 15px; font:700 clamp(30px,3.4vw,52px)/.92 var(--display); letter-spacing:-.045em; }.service-detail__intro>p:last-child { max-width:620px; margin:0; font-size:15px; }
.service-detail ul { margin:0; padding:0; list-style:none; border-top:1px solid var(--line); }.service-detail li { padding:10px 0; border-bottom:1px solid var(--line); font-size:13px; }
.service-detail aside { align-self:stretch; padding:22px; display:flex; flex-direction:column; justify-content:space-between; gap:35px; color:var(--paper); background:var(--ink); border-left:8px solid var(--bar); }.service-detail aside span { font:9px var(--mono); text-transform:uppercase; opacity:.62; }.service-detail aside strong { font:600 20px/1.15 var(--display); }
.margin-joke { width: max-content; max-width: 100%; margin: 45px 0 0 auto; padding: 10px 14px; color: var(--paper); background: var(--ink); transform: rotate(-1.2deg); font: 10px var(--mono); }

.method { color: var(--paper); background: var(--ink); }
.method .chapter-tag { border-color: rgba(242,238,228,.18); }.method .chapter-tag i { background: var(--blue); }
.method .section-intro h2 em { color: var(--blue); }
.process-board { display: grid; grid-template-columns: 1.35fr .65fr; border: 1px solid rgba(242,238,228,.2); border-radius: 12px; overflow: hidden; }
.process-board__screen { position: relative; height: 540px; min-height: 540px; padding: clamp(30px,5vw,72px); background: radial-gradient(circle at 80% 20%, rgba(103,183,255,.15), transparent 28%), #0c0e12; overflow: hidden; }
.process-board__screen h3 { position: relative; max-width: 760px; margin: 100px 0 20px; font: 700 clamp(42px, 5.2vw, 76px)/.9 var(--display); letter-spacing: -.055em; }
.process-board__screen > p:not(.system-label) { position: relative; max-width: 600px; color: rgba(242,238,228,.72); font-size: 16px; }
.process-board__screen small { position: absolute; left: clamp(30px,5vw,72px); right: 30px; bottom: 30px; padding-top: 14px; border-top: 1px solid rgba(242,238,228,.18); font: 10px var(--mono); color: var(--lime); }
.process-visual { position: absolute; width: 260px; height: 180px; right: 5%; top: 8%; opacity: .5; }
.process-visual span { position: absolute; display: block; height: 12px; border-radius: 2px; animation: processBars 3s var(--ease-pop) infinite; }
.process-visual span:nth-child(1) { width: 80%; top: 20%; background: var(--coral); }.process-visual span:nth-child(2) { width: 55%; top: 44%; right: 0; background: var(--blue); animation-delay: -.6s; }.process-visual span:nth-child(3) { width: 35%; top: 68%; left: 18%; background: var(--lime); animation-delay: -1.2s; }
.process-visual i { position: absolute; width: 110px; height: 110px; right: 14%; top: 16%; border: 1px solid var(--paper); border-radius: 50%; }
@keyframes processBars { 50% { transform: scaleX(.72) translateX(8%) rotate(.8deg); } }
.process-list { margin: 0; padding: 0; list-style: none; display: grid; background: var(--paper); }
.process-list li { min-height: 105px; border-bottom: 1px solid var(--line); }
.process-list li:last-child { border: 0; }
.process-list button { width: 100%; height: 100%; padding: 20px 26px; display: grid; grid-template-columns: 45px 1fr 36px; align-items: center; gap: 15px; color: var(--ink); background: transparent; border: 0; text-align: left; cursor: pointer; transition: background .2s; }
.process-list button span { font: 10px var(--mono); }.process-list button b { font: 650 clamp(24px,2.4vw,36px) var(--display); }
.process-list button i { height: 9px; background: var(--ink); border-radius: 2px; transform-origin: left; transition: transform .35s var(--ease-pop), background .2s; }
.process-list button:hover i { transform: scaleX(.65) translateX(25%); }
.process-list button.is-active { background: var(--blue); }.process-list button.is-active i { background: var(--paper); animation: activeStep .55s var(--ease-pop); }
@keyframes activeStep { from { transform: scaleX(.05); } 70% { transform: scaleX(1.15); } }
.process-board__screen.is-changing h3, .process-board__screen.is-changing > p:not(.system-label), .process-board__screen.is-changing small { animation: swapText .42s var(--ease-pop); }
@keyframes swapText { 0% { opacity: 0; transform: translateX(-14px) scaleX(.88) skewX(-3deg); } 58% { opacity: 1; transform: translateX(3px) scaleX(1.025) skewX(1deg); } 78% { transform: translateX(-1px) scaleX(.99); } 100% { opacity: 1; transform: none; } }
.method-principles { margin-top: 18px; display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; }
.method-principles article { min-height: 230px; padding: 28px; border: 1px solid rgba(242,238,228,.2); border-radius: 9px; }
.method-principles span { display: grid; width: 36px; height: 36px; place-items: center; color: var(--ink); background: var(--lime); border-radius: 50%; font: 11px var(--mono); }
.method-principles h3 { margin: 52px 0 8px; font: 650 28px var(--display); }.method-principles p { margin: 0; color: rgba(242,238,228,.66); font-size: 14px; }

.work { background: var(--lilac); }
.work .chapter-tag i { background: var(--ink); }.work .section-intro h2 em { color: var(--ink); text-decoration: underline; text-decoration-thickness: 7px; text-decoration-color: var(--coral); text-underline-offset: 8px; }
.work-console { position:relative; border: 2px solid var(--ink); border-radius: 12px; background: var(--paper); box-shadow: 12px 12px 0 var(--ink); overflow: hidden; }
.work-console__intro { min-height: 520px; padding: clamp(32px,6vw,85px); position: relative; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; }
.work-console__intro h3 { margin: 0; font: 700 clamp(52px,7vw,104px)/.82 var(--display); letter-spacing: -.065em; }
.work-title { position:relative; z-index:1; width:max-content; max-width:100%; overflow:visible; }
.work-title::before { content:""; position:absolute; z-index:-1; left:-2%; top:41%; width:104%; height:.13em; background:var(--blue); border:2px solid var(--ink); transform:scaleX(0); transform-origin:left center; }
.work-title__line { display:block; width:max-content; max-width:100%; white-space:nowrap; }
.work-word { position:relative; display:inline-block; opacity:0; transform:translateY(.35em) scaleX(.2); transform-origin:left center; will-change:transform,opacity; }
.work-word + .work-word { margin-left:.12em; }
.work-word--appears::after { content:""; position:absolute; z-index:-1; left:-.04em; right:-.04em; bottom:.03em; height:.13em; background:var(--coral); transform:scaleX(0); transform-origin:left center; }
.work-console.is-visible .work-title::before { animation:workTitleBarIn .72s var(--ease-pop) .12s forwards; }
.work-console.is-visible .work-word { animation:workWordIn .62s var(--ease-pop) forwards; }
.work-console.is-visible .work-word--the { animation-delay:.08s; }
.work-console.is-visible .work-word--work { animation-delay:.17s; }
.work-console.is-visible .work-word--appears { animation-delay:.27s; }
.work-console.is-visible .work-word--when { animation-delay:.38s; }
.work-console.is-visible .work-word--asked { animation-delay:.48s; }
.work-console.is-visible .work-word--appears::after { animation:workAccentIn .5s var(--ease-pop) .72s forwards; }
@keyframes workTitleBarIn { 0%{transform:scaleX(0)} 68%{transform:scaleX(1.06)} 84%{transform:scaleX(.985)} 100%{transform:scaleX(1)} }
@keyframes workWordIn { 0%{opacity:0;transform:translateY(.35em) scaleX(.2)} 58%{opacity:1;transform:translateY(-.05em) scaleX(1.08)} 78%{transform:translateY(.02em) scaleX(.98)} 100%{opacity:1;transform:none} }
@keyframes workAccentIn { 0%{transform:scaleX(0)} 72%{transform:scaleX(1.12)} 100%{transform:scaleX(1)} }
.work-console__intro small { margin-top: 18px; color: var(--muted); font: 9px var(--mono); }
.orbit-mark { position: absolute; right: 8%; top: 18%; width: 180px; height: 180px; border: 2px solid var(--ink); border-radius: 50%; animation: orbitBob 4s ease-in-out infinite; }
.orbit-mark span { position: absolute; width: 30px; height: 30px; top: 12px; left: 15px; background: var(--coral); border: 2px solid var(--ink); border-radius: 50%; }.orbit-mark i { position: absolute; width: 90px; height: 12px; right: -25px; bottom: 35px; background: var(--blue); border: 2px solid var(--ink); }.orbit-mark b { position: absolute; left: 63px; top: 47px; font: 500 60px var(--display); }
@keyframes orbitBob { 50% { transform: translateY(-9px) rotate(3deg); } }
.reveal-button { width: 260px; min-width: 260px; margin-top: 35px; padding: 8px 8px 8px 18px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border: 2px solid var(--ink); color: var(--ink); background: var(--coral); border-radius: 999px; font-weight: 600; box-shadow: 5px 5px 0 var(--ink); cursor: pointer; transition: transform .25s var(--ease-pop), box-shadow .25s; }
.reveal-button i { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; color: var(--paper); background: var(--ink); font-size: 22px; font-style: normal; transition: transform .5s var(--ease-pop); }
.reveal-button:hover { transform: translate(-2px,-3px) rotate(-1deg); box-shadow: 8px 9px 0 var(--ink); }
.reveal-button[aria-expanded="true"] i { transform: rotate(135deg); }
.work-files { display: none; border-top: 2px solid var(--ink); }
.work-files.is-open { display: block; }
.case { --case-delay:0s; --panel-delay:.9s; --close-panel-delay:.24s; --close-bar-delay:1.14s; min-height:0; border-bottom:2px solid var(--ink); opacity:0; transform-origin:left center; animation:caseBarDock .68s var(--ease-pop) var(--case-delay) both; will-change:transform,opacity; }
.case:nth-child(2) { --case-delay:.11s; --panel-delay:1.02s; --close-panel-delay:.12s; --close-bar-delay:1.02s; }
.case:nth-child(3) { --case-delay:.22s; --panel-delay:1.14s; --close-panel-delay:0s; --close-bar-delay:.9s; border:0; }
.case__bar { height:42px; padding:0 14px 0 18px; display:flex; align-items:center; gap:18px; overflow:hidden; border-bottom:2px solid var(--ink); background:var(--coral); white-space:nowrap; }
.case--quiet .case__bar { background:var(--blue); }.case--atrium .case__bar { background:var(--lime); }
.case__bar span { font:500 9px var(--mono); }.case__bar strong { overflow:hidden; text-overflow:ellipsis; font:650 13px var(--display); }.case__bar i { width:24px; height:24px; margin-left:auto; display:grid; flex:0 0 auto; place-items:center; border-radius:50%; color:var(--paper); background:var(--ink); font:500 13px var(--display); font-style:normal; animation:caseBarIconOpen .45s var(--ease-pop) calc(var(--case-delay) + .62s) both; }
.case__panel { max-height:0; overflow:hidden; animation:casePanelOpen .78s var(--ease-smooth) var(--panel-delay) both; }
.case__body { min-height:480px; display:grid; grid-template-columns:minmax(300px,.8fr) 1.2fr; transform-origin:top center; animation:caseBodyReveal .62s var(--ease-pop) var(--panel-delay) both; }
.work-console.has-opened .case { animation:none; opacity:1; transform:none; will-change:auto; }
.work-console.has-opened .case__panel { animation:none; max-height:1200px; }
.work-console.has-opened .case__body { animation:none; opacity:1; transform:none; }
.work-console.has-opened .case__bar i { animation:none; transform:rotate(45deg); }
.work-console.is-closing .case { animation-name:caseBarDock; animation-duration:.68s; animation-timing-function:var(--ease-pop); animation-delay:var(--close-bar-delay); animation-direction:reverse; animation-fill-mode:both; }
.work-console.is-closing .case__panel { animation-name:casePanelOpen; animation-duration:.78s; animation-timing-function:var(--ease-smooth); animation-delay:var(--close-panel-delay); animation-direction:reverse; animation-fill-mode:both; }
.work-console.is-closing .case__body { animation-name:caseBodyReveal; animation-duration:.62s; animation-timing-function:var(--ease-pop); animation-delay:var(--close-panel-delay); animation-direction:reverse; animation-fill-mode:both; }
.work-console.is-closing .case__bar i { animation-name:caseBarIconOpen; animation-duration:.45s; animation-timing-function:var(--ease-pop); animation-delay:calc(var(--close-bar-delay) - .45s); animation-direction:reverse; animation-fill-mode:both; }
@keyframes caseBarDock {
  0% { opacity:0; transform:translateX(-7px) scaleX(.025); }
  20% { opacity:1; transform:translateX(0) scaleX(.18); }
  44% { opacity:1; transform:scaleX(.48); }
  76% { opacity:1; transform:scaleX(1.035); }
  90% { transform:scaleX(.985); }
  100% { opacity:1; transform:none; }
}
@keyframes casePanelOpen { 0%{max-height:0} 72%{max-height:780px} 86%{max-height:720px} 100%{max-height:1200px} }
@keyframes caseBodyReveal { 0%{opacity:0;transform:scaleY(.2)} 68%{opacity:1;transform:scaleY(1.025)} 84%{transform:scaleY(.99)} 100%{opacity:1;transform:none} }
@keyframes caseBarIconOpen { 0%{transform:scale(.45) rotate(0)} 55%{transform:scale(1.16) rotate(51deg)} 100%{transform:scale(1) rotate(45deg)} }
.case__visual { position: relative; min-height: 380px; display: grid; place-items: center; overflow: hidden; border-right: 2px solid var(--ink); }
.case__copy { padding: clamp(30px,5vw,70px); align-self: center; }
.case__copy h3 { margin: 0 0 20px; font: 700 clamp(39px,5vw,72px)/.88 var(--display); letter-spacing: -.055em; }
.case__copy > p:not(.system-label) { max-width: 630px; font-size: 16px; }.case__copy ul { display: flex; flex-wrap: wrap; gap: 7px; padding: 0; list-style: none; }.case__copy li, .case__copy > b { padding: 6px 9px; color: var(--paper); background: var(--ink); border-radius: 3px; font: 9px var(--mono); text-transform: uppercase; }.case__copy a { display: inline-block; margin-top: 25px; font-weight: 600; text-underline-offset: 6px; }
.dungeon-visual { color: #f1c46d; background: #090a0d; }.dungeon-visual span { font: 800 130px var(--display); }.dungeon-visual i { position: absolute; width: 65%; height: 3px; background: #f1c46d; opacity: .4; }.dungeon-visual i:nth-of-type(1) { top: 22%; }.dungeon-visual i:nth-of-type(2) { top: 50%; }.dungeon-visual i:nth-of-type(3) { top: 78%; }
.calm-visual { background: var(--blue); }.calm-visual span { width: 190px; height: 190px; background: var(--paper); border-radius: 50%; }.calm-visual i { position: absolute; width: 52%; height: 12px; background: var(--ink); border-radius: 9px; transform: rotate(-9deg); }
.atrium-visual { background: var(--ink); grid-template-columns: 1fr 1fr; gap: 12px; padding: 18%; }.atrium-visual span { height: 90px; background: var(--lime); border: 6px solid var(--paper); }.atrium-visual span:nth-child(2) { background: var(--coral); transform: translateY(20px); }.atrium-visual span:nth-child(3) { background: var(--lilac); }.atrium-visual span:nth-child(4) { background: var(--blue); transform: translateY(20px); }

.offer { background: var(--paper); }.offer .chapter-tag i { background: var(--lime); }.offer .section-intro h2 em { color: #688e2c; }
.scope-grid { display: grid; grid-template-columns: .8fr 1fr .8fr; gap: 12px; align-items: start; }
.scope { --scope: var(--blue); min-height: 520px; padding: 30px; display: flex; flex-direction: column; border: 2px solid var(--ink); border-radius: 9px; background: var(--scope); box-shadow: 7px 7px 0 var(--ink); cursor:pointer; transition: transform .28s var(--ease-pop); }
.scope--small { --scope: var(--blue); }.scope--main { --scope: var(--coral); transform: translateY(-28px); }.scope--large { --scope: var(--lime); }
.scope:hover { transform: translateY(-8px) rotate(-.35deg); }.scope--main:hover { transform: translateY(-36px) rotate(.35deg); }
.scope.is-open:hover { transform:translateY(-4px); }.scope--main.is-open:hover { transform:translateY(-32px); }
.scope > span { font: 10px var(--mono); text-transform: uppercase; }.scope h3 { margin: 80px 0 15px; font: 700 clamp(34px,3.5vw,52px)/.9 var(--display); letter-spacing: -.045em; }.scope p { margin: 0; font-size: 14px; }.scope ul { margin: 35px 0 10px; padding: 0; list-style: none; border-top: 1px solid rgba(17,19,24,.35); }.scope li { padding: 11px 0; border-bottom: 1px solid rgba(17,19,24,.25); font-size: 13px; }
.scope__toggle { width:100%; margin:8px 0 0; padding:12px 0; display:flex; align-items:center; justify-content:space-between; gap:14px; color:var(--ink); background:transparent; border:0; border-bottom:1px solid rgba(17,19,24,.28); text-align:left; font:600 12px var(--display); cursor:pointer; }.scope__toggle i { width:28px; height:28px; display:grid; flex:0 0 auto; place-items:center; color:var(--paper); background:var(--ink); border-radius:50%; font-style:normal; transition:transform .4s var(--ease-pop); }.scope__toggle:hover i,.scope__toggle:focus-visible i { transform:rotate(90deg) scale(1.08); }.scope__toggle:focus-visible { outline:2px solid var(--ink); outline-offset:3px; }
.scope__detail { display:grid; grid-template-rows:0fr; opacity:0; visibility:hidden; transition:grid-template-rows .52s var(--ease-smooth),opacity .25s ease,visibility 0s .52s; }.scope__detail-clip { min-height:0; overflow:hidden; }.scope__detail-content { padding:14px 0 18px; }.scope__detail-content>div { padding:12px; background:rgba(242,238,228,.38); border-bottom:1px solid rgba(17,19,24,.22); }.scope__detail-content>div:first-child { border-radius:5px 5px 0 0; }.scope__detail-content>div:last-child { border:0; border-radius:0 0 5px 5px; }.scope__detail-content span,.scope__detail-content strong { display:block; }.scope__detail-content span { margin-bottom:5px; font:9px var(--mono); text-transform:uppercase; opacity:.62; }.scope__detail-content strong { font:600 13px/1.25 var(--display); }
.scope.is-open .scope__detail { grid-template-rows:1fr; opacity:1; visibility:visible; transition:grid-template-rows .62s var(--ease-pop),opacity .25s ease .08s,visibility 0s; }.scope.is-open .scope__toggle i { transform:rotate(135deg); }
.scope a { margin-top: auto; display: flex; justify-content: space-between; padding-top: 15px; border-top: 2px solid var(--ink); text-decoration: none; font-weight: 600; cursor:pointer; }
.not-static-list { max-width: 900px; margin: 100px auto 0; }.not-static-list > p { text-align: center; }.not-static-list div { display: flex; justify-content: space-between; gap: 25px; padding: 18px 10px; border-top: 1px solid var(--line); font: 600 clamp(19px,2.2vw,30px) var(--display); }.not-static-list div:last-child { border-bottom: 1px solid var(--line); }.not-static-list i { color: var(--coral); font: 10px var(--mono); font-style: normal; }

.contact { min-height: 105vh; color: var(--paper); background: var(--ink); }.contact .chapter-tag { border-color: rgba(242,238,228,.18); }.contact .chapter-tag i { background: var(--coral); }
.contact-bars { position: absolute; right: -3%; top: 19%; width: 34%; display: grid; gap: 15px; opacity: .9; }.contact-bars i { display: block; height: 23px; transform-origin: right; animation: contactBar 4s var(--ease-pop) infinite; }.contact-bars i:nth-child(1) { width: 100%; background: var(--coral); }.contact-bars i:nth-child(2) { width: 72%; margin-left: auto; background: var(--blue); animation-delay: -.5s; }.contact-bars i:nth-child(3) { width: 48%; margin-left: auto; background: var(--lime); animation-delay: -1s; }.contact-bars i:nth-child(4) { width: 27%; margin-left: auto; background: var(--lilac); animation-delay: -1.5s; }
@keyframes contactBar { 50% { transform: scaleX(.82) rotate(.4deg); } }
.contact-layout { position: relative; z-index: 2; display: grid; grid-template-columns: 1fr .8fr; gap: 8vw; align-items: start; }
.contact-copy h2 { margin: 0; font: 750 clamp(58px,8vw,122px)/.78 var(--display); letter-spacing: -.07em; }.contact-copy h2 em { color: var(--coral); font-style: normal; }.contact-copy > p:not(.system-label) { max-width: 650px; margin: 35px 0 22px; color: rgba(242,238,228,.74); font-size: 18px; }.contact-email { display: inline-block; font: 600 clamp(18px,2vw,28px) var(--display); text-underline-offset: 8px; overflow-wrap: anywhere; }.response-note { max-width: 500px; margin-top: 75px; padding: 20px 0 0 20px; border-left: 8px solid var(--blue); }.response-note span, .response-note small { display: block; font: 9px var(--mono); text-transform: uppercase; color: rgba(242,238,228,.52); }.response-note b { display: block; margin: 6px 0 10px; font: 600 21px var(--display); }
.contact-form { margin-top: 170px; border: 1px solid rgba(242,238,228,.25); border-radius: 10px; overflow: hidden; background: #0c0e12; }
.form-field { padding: 22px 24px; border-bottom: 1px solid rgba(242,238,228,.18); }.form-field label { display: flex; gap: 12px; color: rgba(242,238,228,.6); font: 9px var(--mono); text-transform: uppercase; }.form-field label span { color: var(--blue); }.form-field label small { margin-left: auto; font-size: inherit; }.form-field input, .form-field textarea, .form-field select { width: 100%; margin-top: 12px; padding: 6px 0; color: var(--paper); background: transparent; border: 0; outline: 0; border-bottom: 2px solid transparent; font: 500 18px var(--display); resize: vertical; }.form-field input:focus, .form-field textarea:focus, .form-field select:focus { border-bottom-color: var(--coral); }.form-field select option { color: var(--ink); }.send-button { width: calc(100% - 32px); margin: 16px; padding: 9px 9px 9px 18px; display: flex; align-items: center; justify-content: space-between; border: 0; color: var(--ink); background: var(--lime); border-radius: 999px; cursor: pointer; font-weight: 600; }.send-button i { width: 46px; height: 46px; display: grid; place-items: center; color: var(--paper); background: var(--ink); border-radius: 50%; font-style: normal; transition: transform .35s var(--ease-pop); }.send-button:hover i { transform: rotate(45deg) scale(1.06); }.send-button:disabled { opacity: .5; cursor: wait; }.form-status { min-height: 18px; margin: 0 22px 18px; color: var(--blue); font: 10px var(--mono); }

.site-footer { min-height: 250px; padding: 45px clamp(24px,5vw,80px); display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 25px; color: var(--ink); background: var(--coral); border-top: 2px solid var(--ink); }.brand--footer .brand__name b { color: var(--ink); text-decoration: underline; }.site-footer > p { justify-self: end; font: 650 clamp(22px,3vw,40px)/1 var(--display); text-align: right; }.site-footer > div { display: flex; gap: 20px; font-size: 13px; }.site-footer small { justify-self: end; font: 9px var(--mono); text-transform: uppercase; }

@media (max-width: 1100px) {
  .site-header { grid-template-columns: auto 1fr auto; }.chapter-nav { display: none; }.chapter-readout { display: none; }
  .hero { grid-template-columns: 1fr; }.hero-machine { max-width: 760px; width: 100%; }.hero__aside { grid-column: 1; margin-left: 0; }
  .section-intro--split { grid-template-columns: 1fr; }.section-intro--split > p:last-child { max-width: 700px; }
  .service-bar { grid-template-columns: 45px 1fr 48px; }.service-bar__summary { grid-column: 2 / 3; }.service-bar > i { grid-column: 3; grid-row: 1 / span 2; }
  .scope-grid { grid-template-columns: 1fr; }.scope, .scope--main { min-height: 390px; transform: none; }.scope:hover, .scope--main:hover { transform: translateY(-5px); }.scope h3 { margin-top: 45px; }
  .contact-layout { grid-template-columns: 1fr; }.contact-form { margin-top: 20px; max-width: 780px; }
}

@media (max-width: 760px) {
  html, body { width:100%; max-width:100%; overflow-x:clip; }
  .site-header { min-height: 62px; padding: 8px 11px; gap: 8px; }.brand__name { font-size: 14px; }.brand__mark { width: 29px; }.sound-label { display: none; }.sound-toggle { padding: 8px; }.header-cta { padding: 9px 10px; font-size: 10px; }
  .chapter { padding: 110px 18px 85px; }.hero { grid-template-columns:minmax(0,1fr); padding-top: 130px; min-height: auto; }.hero__ticker { top: 62px; }.hero__copy, .hero h1, .hero__lede, .hero-machine, .hero__aside { width:calc(100vw - 36px); max-width:calc(100vw - 36px); }.hero h1 { font-size: clamp(49px,14vw,70px); overflow-wrap:anywhere; }.hero__lede { font-size: 17px; overflow-wrap:anywhere; }.hero__actions { align-items: flex-start; flex-direction: column; }.hero-machine { min-width:0; min-height: 390px; }.machine-stage { min-height: 290px; }.machine-word { font-size: 46px; }.hero__aside { margin-top: 10px; }
  .chapter-tag { top: 74px; padding-inline: 18px; }.section-intro { margin-bottom: 50px; }.section-intro h2 { font-size: clamp(47px,14vw,72px); }.section-intro > p:last-child { font-size: 16px; }
  .service-bar { min-height:220px; grid-template-columns:35px 1fr 40px; gap:12px; padding:20px 16px; box-shadow:4px 5px 0 var(--ink); }.service-bar__title strong { font-size:29px; }.service-bar__summary { grid-column:2 / 3; font-size:13px; }.service-bar > i { width:38px; height:38px; }.service-detail__content { grid-template-columns:1fr; gap:26px; padding:28px 20px; box-shadow:4px 5px 0 var(--ink); }.service-detail aside { min-height:180px; }
  .process-board { grid-template-columns: 1fr; }.process-board__screen { height:500px; min-height:500px; padding: 28px 22px; }.process-board__screen h3 { margin-top: 135px; font-size: 45px; }.process-board__screen small { left: 22px; }.process-visual { right: -10%; }.process-list { grid-template-columns: 1fr 1fr; }.process-list li { min-height: 84px; }.process-list button { grid-template-columns: 30px 1fr; padding: 15px; }.process-list button i { display: none; }.process-list button b { font-size: 21px; }.method-principles { grid-template-columns: 1fr; }.method-principles article { min-height: 190px; }
  .work-console { box-shadow: 6px 7px 0 var(--ink); }.work-console__intro { min-height: 540px; padding: 28px 20px; justify-content: flex-end; }.work-console__intro h3 { font-size: clamp(42px,13.2vw,54px); }.work-title__line { white-space:normal; }.work-word + .work-word { margin-left:.07em; }.orbit-mark { width: 130px; height: 130px; top: 12%; right: 10%; }.case__body { grid-template-columns: 1fr; }.case__visual { min-height: 300px; border-right: 0; border-bottom: 2px solid var(--ink); }.case__copy { padding: 35px 22px; }.case__copy h3 { font-size: 44px; }
  .scope { min-height: 420px; padding: 24px; }.not-static-list { margin-top: 70px; }.not-static-list div { font-size: 19px; }
  .contact-bars { width: 55%; top: 15%; }.contact-copy h2 { font-size: clamp(58px,18vw,88px); }.contact-email { font-size: 17px; }.contact-form { margin-top: 40px; }.form-field { padding: 20px 16px; }.form-field input, .form-field textarea, .form-field select { font-size: 16px; }
  .site-footer { grid-template-columns: 1fr; }.site-footer > p, .site-footer small { justify-self: start; text-align: left; }.site-footer > div { flex-direction: column; gap: 8px; }
  .cursor-friend { display: none; }
}

@media (max-width: 430px) {
  .brand__name { max-width: 93px; }.header-cta span { display: none; }
  .boot__actions { flex-direction: column; }.boot h1 { font-size: 55px; }
  .service-bar { grid-template-columns:30px 1fr 36px; }.service-bar__summary { grid-column:1 / -1; }.service-bar > i { display:grid; grid-column:3; grid-row:1 / span 2; }
  .reveal-button { min-width: 100%; }.process-list { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .cursor-friend { display: none; }
  .work-word { opacity:1 !important; transform:none !important; }
  .work-title::before, .work-word--appears::after { transform:scaleX(1) !important; }
}

html[data-preview] .boot { display: none; }
html[data-preview] body { overflow: auto; }
html[data-preview] .site-header { visibility: visible !important; opacity: 1 !important; transform: none !important; transition: none !important; }
html[data-preview] .reveal { opacity: 1; transform: none; }
html[data-preview] .machine-word, html[data-preview] .machine-block { animation: none !important; transform: none !important; }
html[data-preview]:not([data-preview="home"]):not([data-preview="1"]) .chapter { display:none; }
html[data-preview="what"] #what,
html[data-preview="method"] #method,
html[data-preview="work"] #work,
html[data-preview="offer"] #offer,
html[data-preview="contact"] #contact { display:block; }
