/* asvo.io — первый экран «машинный зал → ваш шкаф». Всё на экране закреплено, прокрутка ведёт превращение. */
@font-face {
  font-family: "Golos Text";
  src: url("./assets/fonts/GolosText.woff2") format("woff2");
  font-weight: 400 900;
  font-display: swap;
}

:root {
  --paper: #f3f4fa;
  --night: #070826;
  --ink: #1a1954;
  --cream: #eef0ff;
  --blue: #2563ff;
  --teal: #00d5b7;

  --pad-x: 3.125vw;
  --inner: calc(100vw - 2 * var(--pad-x));
  --gap: calc(var(--inner) / 75);
  --col: calc(var(--gap) * 3.75);
  --u: min(calc(var(--inner) / 1800), calc(100vh / 1024 * 1.25));

  --ease-out: cubic-bezier(.215, .61, .355, 1);
  --sans: "Golos Text", "Segoe UI", Arial, sans-serif;
  --fg: var(--ink);
}
html.is-dark { --fg: var(--cream); }

*, *::before, *::after { box-sizing: border-box; }
html { background: var(--paper); color: var(--fg); overflow-x: clip; }
html.is-dark { background: var(--night); }
body {
  margin: 0;
  font: 500 calc(18 * var(--u)) / 1.3 var(--sans);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
::selection { background: var(--blue); color: #fff; }
a { color: inherit; text-decoration: none; }
img { display: block; }
:focus-visible { outline: 2px solid var(--blue); outline-offset: 4px; border-radius: 4px; }

#scene { position: fixed; inset: 0; width: 100%; height: 100%; display: block; }
.spacer { height: var(--story-height, 1415vh); }
.loader { display: none; }
.js .loader {
  position: fixed; inset: 0; z-index: 50; display: grid; place-items: center;
  color: var(--cream); background: radial-gradient(ellipse at 50% 46%, #171b3d, #080b1a 58%);
  transition: opacity .12s ease, visibility .12s;
}
.loader-center { width: min(360px, 70vw); text-align: center; transition: transform .12s var(--ease-out), filter .12s ease; }
.loader-wordmark { display: block; width: 100%; height: auto; overflow: visible; }
.loader-wordmark path {
  vector-effect: non-scaling-stroke; stroke: #bbd6ee; stroke-width: 1;
  stroke-dasharray: 1; stroke-dashoffset: 1; fill-opacity: .04;
  animation: loader-trace 1.4s var(--ease-out) both;
}
.loader-wordmark path:nth-of-type(2n) { animation-delay: .1s; }
.loader-wordmark path:nth-of-type(3n) { animation-delay: .18s; }
@keyframes loader-trace {
  0% { stroke-dashoffset: 1; fill-opacity: .04; }
  65% { stroke-dashoffset: 0; fill-opacity: .1; }
  100% { stroke-dashoffset: 0; fill-opacity: 1; stroke: transparent; }
}
#load-progress { display: block; appearance: none; width: 160px; height: 2px; border: 0; border-radius: 2px; margin: 38px auto 20px; background: #ffffff14; overflow: hidden; }
#load-progress::-webkit-progress-bar { background: #ffffff14; }
#load-progress::-webkit-progress-value { background: linear-gradient(90deg, var(--blue), var(--teal)); transition: width .35s var(--ease-out); }
#load-progress::-moz-progress-bar { background: linear-gradient(90deg, var(--blue), var(--teal)); }
.loader-caption { display: block; font: 400 16px/1.5 var(--sans); color: #b7c0db; }
.is-ready .loader { opacity: 0; visibility: hidden; pointer-events: none; }
.is-ready .loader-center { transform: scale(1.035); filter: blur(3px); }
.js:not(.is-ready) :is(.top, .hero) { visibility: hidden; }
.no-webgl .loader { display: none; }

.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

/* шапка: на тёмном зале светлая, в комнате тёмная */
.top {
  position: fixed; inset: 0 0 auto 0; z-index: 5;
  display: flex; align-items: center; justify-content: space-between;
  padding: calc(22 * var(--u)) var(--pad-x);
  color: var(--fg);
}
.brand img { height: calc(30 * var(--u)); width: auto; }
.logo-dark { display: none; }
html.is-dark .logo-dark { display: block; }
html.is-dark .logo-light { display: none; }
.nav { display: flex; gap: calc(34 * var(--u)); font-size: max(14px, calc(16 * var(--u))); font-weight: 500; }
.nav a { position: relative; padding: .2em 0; opacity: .8; transition: opacity .18s ease; }
.nav a:hover, .nav a:focus-visible { opacity: 1; }
.nav a::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1.5px;
  background: currentColor; transform: scaleX(0); transform-origin: left;
  transition: transform .32s var(--ease-out);
}
.nav a:hover::after, .nav a:focus-visible::after { transform: scaleX(1); }
.nav-write { opacity: 1; }
.nav-write::after { transform: scaleX(1); }

/* заголовки: зал и комната, оба закреплены внизу слева; сцена ставит им --p */
.hero { position: fixed; inset: 0; pointer-events: none; }
.hero .h-hall, .hero .h-room, .hero .h-rack {
  position: absolute; left: var(--pad-x); bottom: calc(52 * var(--u));
  margin: 0; max-width: calc(8 * var(--col));
  font-size: calc(68 * var(--u)); font-weight: 600; line-height: 1; letter-spacing: -.012em;
  color: var(--fg);
}
.hero p .line { display: block; overflow: hidden; padding-bottom: .08em; margin-bottom: -.08em; }
.hero p .line > span { display: block; }
html.js .h-hall .line > span { transform: translateY(112%); }
html.is-ready .h-hall .line > span { animation: rise .9s var(--ease-out) forwards; animation-delay: calc(.5s + var(--i, 0) * .1s - var(--t, 0s)); }
.hero p .line:nth-child(2) > span { --i: 1; }
.hero p .line:nth-child(3) > span { --i: 2; }
@keyframes rise { to { transform: translateY(0); } }
/* уход зала и приход комнаты считает сцена: --out 0..1 и --in 0..1 */
.h-hall { opacity: calc(1 - var(--out, 0)); transform: translateY(calc(var(--out, 0) * -.6em)); }
/* фраза комнаты появляется по времени, когда прокрутка прошла порог (класс show-room ставит сцена), а не по маске от колеса */
.h-room .line > span { transform: translateY(112%); transition: transform .9s var(--ease-out); transition-delay: calc(var(--i, 0) * .1s); }
html.show-room .h-room .line > span { transform: translateY(0); }
.h-room { opacity: calc(var(--in, 0) * (1 - var(--out2, 0))); transform: translateY(calc(var(--out2, 0) * -.6em)); }
.h-rack { opacity: 0; }
.hero .h-rack { max-width: calc(10 * var(--col)); }
.hero .h-room { max-width: calc(12 * var(--col)); }
.h-rack .line > span { transform: translateY(112%); transition:none; }
html.show-rack .h-rack { opacity: 1; }
html.show-rack .h-rack .line > span { transform: none; }
.rack-spec { display: block; font-size: clamp(16px, 1.15vw, 20px); line-height: 1.4; font-weight: 500; letter-spacing: 0; margin-top: 24px; }

.cue {
  position: absolute; right: var(--pad-x); bottom: calc(52 * var(--u)); pointer-events: auto;
  width: calc(52 * var(--u)); height: calc(52 * var(--u)); border-radius: 50%;
  display: grid; place-items: center; color: var(--night); background: var(--cream);
  opacity: 0; transform: translateY(8px);
  transition: transform .3s var(--ease-out);
}
html:not(.is-dark) .cue { color: #fff; background: var(--ink); }
.cue svg { width: 44%; height: 44%; }
html.is-ready .cue { animation: appear .7s var(--ease-out) forwards; animation-delay: calc(1.6s - var(--t, 0s)); }
.cue:hover, .cue:focus-visible { background: var(--blue); color: #fff; transform: translateY(3px); }
@keyframes appear { to { opacity: 1; transform: translateY(0); } }

html.is-seek * { animation-play-state: paused !important; }

@media (max-width: 720px) {
  :root { --pad-x: 5vw; --u: 1px; }
  body { font-size: 16px; }
  .top { padding: 18px var(--pad-x); }
  .brand img { height: 24px; }
  .nav { gap: 18px; font-size: 14px; }
  .nav a:not(.nav-write) { display: none; }
  .hero .h-hall, .hero .h-room, .hero .h-rack { font-size: clamp(28px, 8.6vw, 36px); bottom: 28px; max-width: calc(100vw - 2 * var(--pad-x)); }
  .rack-spec { margin-top: 18px; }
  .cue { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .loader, .loader-center { transition: none !important; }
  .loader-wordmark path { animation: none; stroke: none; fill-opacity: 1; }
  .hero p, .hero p .line > span { transition: none !important; }
  .h-hall .line > span, html.is-ready .h-hall .line > span { animation: none; transform: none; }
  .cue, html.is-ready .cue { animation: none; opacity: 1; transform: none; }
  .nav a::after { transition: none; }
}

/* Полный рассказ доступен и без WebGL или JavaScript. */
.reading-story { display: none; }
html:not(.js), html.no-webgl { --fg: var(--ink); background: var(--paper); }
html:is(:not(.js), .no-webgl) :is(#scene, .hero, .spacer, .rack-detail, body > .ecosystem) { display: none; }
html:is(:not(.js), .no-webgl) .reading-story { display: block; }
html:is(:not(.js), .no-webgl) .top { position: absolute; color: var(--cream); }
html:is(:not(.js), .no-webgl) .logo-dark { display: block; }
html:is(:not(.js), .no-webgl) .logo-light { display: none; }
.reading-frame { position:relative;height:100svh;min-height:700px;overflow:hidden; }
.reading-frame picture,.reading-frame img { position:absolute;inset:0;width:100%;height:100%;object-fit:cover; }
.reading-copy { position:absolute;left:6vw;top:23%;width:37vw;z-index:1; }
.reading-copy h2 { margin:0;font-size:clamp(40px,4vw,68px);font-weight:500;line-height:1.04;letter-spacing:-.045em; }
.reading-copy p { margin:24px 0 0;font-size:clamp(16px,1.3vw,21px);line-height:1.5; }
.reading-copy .reading-note { font-size:14px; }
.reading-frame--hall { color:var(--cream);background:var(--night); }
.reading-frame--hall .reading-copy { top:auto;bottom:6vh; }
.reading-frame--rack .reading-copy { top:auto;bottom:6vh; }
.reading-frame--power { color:#eef6f4;background:#030608; }
.reading-copy .reading-outage { margin:0 0 32px; }
.reading-runtime strong { font-size:64px;font-weight:500;letter-spacing:-.06em; }
.reading-frame--power .reading-note { white-space:nowrap; }
@media(max-width:900px) {
 .reading-frame { min-height:844px; }
 .reading-copy { top:auto;bottom:30px;left:5vw;width:90vw; }
 .reading-copy h2 { font-size:32px; }
 .reading-copy p { margin-top:14px;font-size:15px; }
 .reading-copy .reading-note { font-size:13px; }
 .reading-frame:nth-child(n+3) { height:auto;min-height:100svh;padding-bottom:30px; }
 .reading-frame:nth-child(n+3) picture { position:relative;display:block;aspect-ratio:390/540;height:auto;overflow:hidden; }
 .reading-frame:nth-child(n+3) img { height:auto;object-fit:contain; }
 .reading-frame:nth-child(n+3) .reading-copy { position:relative;inset:auto;width:auto;margin:0 5vw; }
 .reading-runtime strong { font-size:48px; }
 .reading-frame--power .reading-note { letter-spacing:-.04em; }
}

.reading-frame--power .reading-copy>p { font-size:18px; }
.reading-frame--power .reading-copy>.reading-note { font-size:14px;letter-spacing:-.04em; }
.reading-frame--services { height:auto;min-height:1200px;padding:60px 0; }
.reading-frame--services picture { height:100svh; }
.reading-frame--services .reading-copy { position:relative;top:auto; }
.reading-frame--services .reading-copy h2 { font-size:48px;text-wrap:balance; }
#reading-services { font-size:clamp(40px,3vw,48px);white-space:nowrap; }
.reading-frame--services .reading-clinic { margin-top:52px; }
.reading-frame--ai .reading-copy { top:30%; }
.reading-copy .ai-employees { font-size:24px;line-height:1.1; }
@media(max-width:900px) {
 .reading-frame.reading-frame--ai picture { aspect-ratio:390/620; }
 .reading-frame.reading-frame--services { padding-top:0; }
 .reading-frame.reading-frame--services picture { aspect-ratio:390/490;height:auto; }
 .reading-frame--services .reading-copy,.reading-frame--ai .reading-copy { top:auto; }
 .reading-frame--services .reading-copy h2 { font-size:28px; }
 #reading-services { font-size:clamp(17px,5.3vw,40px); }
 .reading-clinic+.service-items { grid-template-rows:repeat(4,auto); }
}

/* Both complete, unadorned lists remain available without animation. */
.service-items { list-style:none;padding:0;margin:32px 0 0;display:grid;gap:10px; }
.service-items li { font-size:24px;line-height:1.25;font-weight:600;color:#1a1954; }
@media(max-width:900px) {
 .service-items { grid-auto-flow:column;grid-template-columns:1fr 1fr;grid-template-rows:repeat(5,auto);gap:10px 18px;margin-top:22px; }
 .service-items li { font-size:clamp(16px,2.7vw,22px);line-height:1.25; }
}
@media(max-width:360px),(max-height:700px) and (max-width:900px) {
 .service-items { gap:8px 14px;margin-top:18px; }
 .service-items li { font-size:16px; }
}

/* Product-led compositions: the equipment owns the right half, text owns the left. */
.rack-detail { position:fixed;inset:0;z-index:4;pointer-events:none;color:var(--ink); }
.story-panel { position:absolute;left:6vw;top:22%;width:38vw;max-width:620px;opacity:0;visibility:hidden; }
.story-panel h2 { margin:0;font-size:clamp(42px,4vw,64px);font-weight:500;line-height:1.04;letter-spacing:-.052em; }
.story-panel p { margin:24px 0 0;font-size:clamp(18px,1.35vw,22px);line-height:1.45;font-weight:400; }
.is-power { color:#eef6f4; }
.power-copy { top:20%;width:40vw; }
.power-outage,.power-result { position:absolute;top:0;left:0; }
.power-outage h2 { font-size:clamp(60px,6vw,96px); }
.power-outage p { font-size:clamp(22px,2vw,32px); }
.power-runtime { margin-top:240px; }
.power-time { display:flex;align-items:center;gap:16px;color:#91e3ce; }
.power-time strong { font-size:clamp(112px,10vw,160px);font-weight:500;line-height:.9;letter-spacing:-.08em; }
.power-time>span:first-child { align-self:flex-start;font-size:22px; }
.power-time>span:last-child { font-size:clamp(24px,2vw,32px);line-height:1.15; }
.power-runtime p { margin-top:24px; }
.power-runtime .power-note { font-size:14px;white-space:nowrap;margin-top:16px;color:#d5e1df; }
.ai-employees b { display:block;font-size:clamp(180px,12.5vw,220px);font-weight:600;letter-spacing:-.07em;line-height:1.1; }
.reading-copy .ai-employees>span { display:block;font-size:34px;white-space:nowrap; }
.reading-frame--ai .reading-copy { top:16%;width:46vw; }
.reading-frame--ai .reading-copy>p { font-size:22px; }
.reading-frame--ai .reading-copy>.ai-external { font-size:16px; }
.final-copy { top:23%;width:39vw; }
.final-copy h2 { max-width:14ch;font-size:clamp(42px,4.1vw,66px); }
.story-contact { pointer-events:auto;display:inline-flex;align-items:center;gap:44px;padding:18px 24px;background:var(--ink);color:white;border-radius:3px;font-size:16px;margin-top:30px; }
.story-contact:hover { background:#2563ff; }
.story-contact span { font-size:21px; }
@media(max-width:900px) {
 .story-panel { left:5vw;top:auto;bottom:5vh;width:90vw;max-width:none; }
 .story-panel h2 { font-size:clamp(30px,7.6vw,54px);line-height:1.03; }
 .story-panel p { font-size:clamp(14px,3.8vw,20px);margin-top:14px; }
 .power-copy { bottom:4vh; }
 .power-outage,.power-result { position:relative; }
 .power-outage { position:absolute;top:0; }
 .power-outage h2 { font-size:52px; }
 .power-outage p { font-size:20px; }
 .power-result p { margin-top:12px; }
 .power-runtime { margin-top:22px; }
 .power-time { gap:10px; }
 .power-time strong { font-size:88px; }
 .power-time>span:first-child { font-size:16px; }
 .power-time>span:last-child { font-size:21px; }
 .power-runtime p { margin-top:14px; }
 .power-runtime .power-note { font-size:14px;margin-top:12px;letter-spacing:-.025em; }
 .power-result p { font-size:18px; }
 .ai-employees b { font-size:100px;display:block; }
 .reading-copy .ai-employees>span { font-size:26px;margin-top:6px;white-space:normal;max-width:22ch;text-wrap:balance; }
 .reading-frame--ai .reading-copy { top:auto;width:auto; }
 .reading-frame--ai .reading-copy>p { font-size:16px; }
 .final-copy { top:calc(96vh - 380px);bottom:auto; }
 .final-copy h2 { max-width:17ch; }
 .story-contact { padding:13px 20px;margin-top:20px;font-size:14px; }
}
@media(max-width:360px),(max-height:700px) and (max-width:900px) {
 .story-panel { bottom:22px; }
 .final-copy { top:calc(100vh - 387px);bottom:auto; }
 .story-panel h2 { font-size:28px; }
 .story-panel p { font-size:13px; }
 .power-runtime { margin-top:16px; }
 .power-time strong { font-size:68px; }
 .power-time>span:last-child { font-size:18px; }
 .power-result p { font-size:18px; }
 .power-runtime .power-note { font-size:14px;letter-spacing:-.05em; }
 .ai-employees b { font-size:88px; }
}

/* The whole roll shares one scroll-driven transform; no item has its own animation. */
.services-copy { top:12%;bottom:6%;width:45vw;max-width:none; }
.credits-headings { display:grid; }
.services-copy h2 { grid-area:1/1;font-size:clamp(40px,3vw,48px);line-height:1.08;letter-spacing:-.045em;white-space:nowrap; }
.credits-window { position:absolute;top:164px;bottom:0;left:0;right:0;overflow:hidden;mask-image:linear-gradient(transparent,#000 24%,#000 76%,transparent); }
.credits-track { position:relative;--pitch:8.6vh;will-change:transform; }
.credits-track ul { list-style:none;padding:0;margin:0; }
.credits-track ul+ul { margin-top:calc(var(--pitch)*1.75); }
.credits-row { display:flex;align-items:center;min-height:var(--pitch);font-size:clamp(40px,3vw,48px);font-weight:600;line-height:1.15;letter-spacing:-.045em; }
@media(max-width:900px) {
 .services-copy { top:44%;bottom:4%;width:90vw; }
 .services-copy h2 { font-size:clamp(20px,5.3vw,40px); }
 .credits-window { top:calc(10.6vw + 26px); }
 .credits-row { font-size:clamp(26px,7.7vw,44px); }
 .credits-window { mask-image:linear-gradient(transparent,#000 17%,#000 80%,transparent); }
}
@media(max-width:360px),(max-height:700px) and (max-width:900px) {
 .services-copy { top:43%;bottom:22px;left:4vw;width:92vw; }
 .services-copy h2 { font-size:17px; }
 .credits-window { top:58px; }
 .credits-row { font-size:24px;letter-spacing:-.04em; }
}

/* All four reels use the same scroll position. */
.ai-copy { top:16%;width:46vw;max-width:none; }
.ai-ending { position:relative; }
.ai-copy .ai-employees { margin:0;font-size:24px;letter-spacing:0;line-height:1.15; }
.ai-up-to { display:block;font-size:24px; }
.odometer { display:flex;height:1em;font-size:clamp(180px,12.5vw,220px);line-height:1;font-weight:600;letter-spacing:-.055em;margin:8px 0 18px; }
.digit-slot { display:block;height:1em;overflow:hidden; }
.digit-reel { display:block;will-change:transform; }
.digit-reel>span { display:block;height:1em;font-size:inherit;line-height:1; }
.employee-label { display:block;font-size:clamp(32px,2.125vw,36px);letter-spacing:-.035em;white-space:nowrap; }
.ai-copy .ai-duties { margin-top:32px;max-width:40ch;font-size:22px;text-wrap:balance; }
.ai-copy .ai-always { margin-top:18px;font-size:22px;text-wrap:balance; }
.ai-copy .ai-external { margin-top:30px;font-size:16px;text-wrap:balance; }
.reading-copy p { text-wrap:balance; }
@media(max-width:900px) {
 .ai-copy { top:auto;bottom:4vh;height:380px;width:90vw; }
 .ai-up-to { font-size:18px; }
 .odometer { font-size:100px;margin:4px 0 10px; }
 .employee-label { font-size:26px;white-space:normal; }
 .employee-label>span { display:block; }
 .ai-copy .ai-duties { font-size:16px;margin-top:20px;max-width:38ch; }
 .ai-copy .ai-always { font-size:16px;margin-top:12px; }
 .ai-copy .ai-external { font-size:16px;margin-top:20px; }
}
@media(max-width:360px),(max-height:700px) and (max-width:900px) {
 .ai-copy { height:365px;bottom:22px; }
 .odometer { font-size:88px; }
 .employee-label { font-size:24px; }
 .ai-copy .ai-duties,.ai-copy .ai-always { font-size:16px;margin-top:14px; }
 .ai-copy .ai-external { margin-top:18px;font-size:16px; }
}

/* New thoughts occupy the same composition, one at a time. */
.internet-outage,.internet-result { position:absolute;inset:0 auto auto 0;width:100%; }
.internet-outage h2 { font-size:clamp(60px,6vw,96px); }
.internet-outage p { font-size:clamp(22px,2vw,32px);text-wrap:balance; }
.internet-result h2 { text-wrap:balance; }
.final-copy { width:47vw;max-width:none; }
.final-copy .final-step { position:absolute;top:0;left:0;width:100%;max-width:none;text-wrap:balance; }
.final-copy { --step:clamp(40px,3.4vw,54px); }
.final-copy .final-step { font-size:var(--step); }
/* The button sits under the last two-line step, which stays on screen */
.final-copy .story-contact { position:absolute;left:0;top:calc(var(--step)*2.1 + 36px);margin-top:0; }
.reading-internet { margin-top:60px; }
.reading-internet h2 { text-wrap:balance; }
.reading-internet h2:last-child { margin-top:32px; }
.reading-copy .reading-final-step { margin-top:64px; }
.reading-frame--pc,.reading-frame--power { height:auto;min-height:1250px; }
.reading-frame--pc picture,.reading-frame--power picture { height:100vh; }
.reading-frame--pc .reading-copy,.reading-frame--power .reading-copy { position:relative;top:auto;padding-top:90px;padding-bottom:90px; }
@media(max-width:900px) {
 .final-copy { width:90vw;--step:clamp(28px,7vw,50px); }
 .internet-outage h2 { font-size:52px; }
 .internet-outage p { font-size:20px; }
 .reading-frame--pc,.reading-frame--power { min-height:0; }
 .reading-frame--pc .reading-copy,.reading-frame--power .reading-copy { padding-top:0;padding-bottom:56px; }
 .reading-copy .reading-final-step { margin-top:48px; }
}
@media(max-width:360px),(max-height:700px) and (max-width:900px) { .final-copy { --step:26px; } }

/* Phone composition: equipment above, copy below, with room for browser chrome. */
@media(max-width:900px) {
 .rack-detail,.hero { height:100dvh; }
 .hero .rack-spec { font-size:16px;color:var(--ink);opacity:1; }
 .services-copy { top:42%;bottom:24px; }
 .services-copy h2 { font-size:28px;white-space:normal;text-wrap:balance;line-height:1.08; }
 .credits-window { top:112px;mask-image:linear-gradient(transparent,#000 10%,#000 88%,transparent); }
 .credits-track { --pitch:72px; }
 .credits-track ul+ul { margin-top:calc(var(--pitch)*.5); }
 .credits-row { font-size:25px;letter-spacing:-.045em; }
 .power-outage h2,.internet-outage h2 { font-size:52px; }
 .power-outage p,.internet-outage p { font-size:20px;line-height:1.3; }
 .final-copy { top:auto;bottom:28px;height:188px;--step:clamp(28px,7vw,40px); }
 .final-copy .final-step { text-wrap:balance; }
 .final-copy .final-step:first-child { font-size:clamp(22px,6.15vw,40px); }
 .final-copy .story-contact { top:auto;bottom:0;min-height:48px; }
 .reading-frame--services .reading-copy h2,#reading-services { font-size:28px;white-space:normal; }
 .reading-copy h2,.reading-copy p,.rack-spec { text-wrap:balance; }
 .reading-frame--rack .reading-copy p { font-size:16px; }
}
@media(min-width:721px) and (max-width:900px) {
 .services-copy h2 { font-size:36px; }
 .credits-row { font-size:30px; }
}

@media(max-width:900px) {
 .final-copy .final-step { top:auto;bottom:84px; }
 .final-copy .final-step:not(:last-of-type) { bottom:24px; }
 .final-copy .final-step:first-child { text-wrap:nowrap; }
}
@media(max-width:900px) {
 .power-runtime>p:not(.power-note) { font-size:14px; }
 .reading-copy .reading-note { font-size:14px;letter-spacing:-.025em; }
}

.request { position:relative;z-index:4;min-height:100vh;padding:82px 6vw 40px;background:var(--paper);color:var(--ink);scroll-margin-top:0; }
.request-copy { width:100%; }
.request h2 { font-size:clamp(44px,3.25vw,52px);font-weight:500;line-height:1.02;letter-spacing:-.055em;margin:0; }
.request-heading>p,.lead-success>p { font-size:20px;font-weight:400;line-height:1.35;max-width:42ch;margin:14px 0 24px;text-wrap:balance; }
.lead-form { display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);column-gap:8vw;align-items:start; }
.lead-questions,.lead-contact { display:grid;gap:20px; }
.request-heading { margin-bottom:32px; }
.request-heading>p { max-width:none; }
.form-row { display:grid;grid-template-columns:1fr 1fr;gap:24px; }
.field { min-width:0; }
.field label,.employee-choices legend { display:block;font-size:16px;font-weight:400;line-height:1.2;margin-bottom:4px; }
.field input,.field textarea { display:block;width:100%;min-height:52px;font:400 18px/1.4 var(--sans);color:var(--ink);border:0;border-bottom:1px solid #b7b9c9;background:transparent;border-radius:0;padding:10px 0; }
.field textarea { resize:none;height:52px;overflow:hidden; }
.field input:focus,.field textarea:focus { outline:0;border-color:var(--ink);box-shadow:0 1px var(--ink); }
.field input[aria-invalid="true"] { border-color:#aa3049; }
.field textarea::placeholder { color:#75758d;opacity:1; }
.employee-choices { margin:0;padding:0;border:0;min-width:0; }
.employee-choices>div { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px; }
.choices-employees>div { grid-template-columns:repeat(4,minmax(0,1fr)); }
.choices-needs>div,.choices-installation>div { grid-template-columns:repeat(2,minmax(0,1fr)); }
.employee-choices label { position:relative;cursor:pointer; }
.employee-choices input { position:absolute;opacity:0; }
.employee-choices span { display:flex;align-items:center;justify-content:center;height:100%;min-height:48px;padding:10px 8px;border:1px solid #b7b9c9;border-radius:3px;font-size:16px;font-weight:400;line-height:1.2;text-align:center; }
.employee-choices input:checked+span { color:var(--paper);background:var(--ink);border-color:var(--ink); }
.employee-choices input:focus-visible+span { outline:2px solid var(--blue);outline-offset:3px; }
.consent { display:flex;align-items:flex-start;gap:12px;font-size:14px;font-weight:400;line-height:1.45; }
.consent input { width:18px;height:18px;accent-color:var(--ink);flex-shrink:0;margin:1px 0 0; }
.consent a,.submit-error a { text-decoration:underline;text-underline-offset:3px; }
.submit-lead { display:flex;justify-content:space-between;align-items:center;gap:48px;min-height:56px;border:0;border-radius:3px;background:var(--ink);color:white;padding:16px 24px;font:500 16px/1.3 var(--sans);cursor:pointer; }
.submit-lead:hover:enabled { background:#303074; }
.submit-lead:disabled { background:var(--ink);color:white;cursor:wait; }
.submit-lead span { font-size:22px;line-height:1; }
.field-error,.submit-error { color:#aa3049;font-size:14px;font-weight:400;line-height:1.4;margin:8px 0 0;text-wrap:balance; }
.contact-details { display:flex;flex-direction:column;gap:8px;margin:24px 0 0;font-size:20px;font-weight:400;line-height:1.4;font-style:normal; }
.contact-details>a:first-child { font-size:28px;letter-spacing:-.035em; }
.contact-details>span { font-size:16px;text-wrap:balance; }
.contact-details a:hover { color:var(--blue); }
.lead-success { min-height:540px;padding-top:60px; }
.lead-success h2 { font-size:clamp(38px,2.65vw,43px);white-space:nowrap; }
.request [hidden] { display:none; }
.rack-detail { opacity:calc(1 - var(--contact-enter,0)); }
.at-contact .cue { visibility:hidden; }
.at-contact .top { background:var(--paper);color:var(--ink); }
.at-footer .top { background:var(--ink);color:white; }
.at-footer .logo-dark { display:block; }
.at-footer .logo-light { display:none; }
.site-footer { position:relative;z-index:4;background:#1a1954;color:white;padding:72px 6vw 32px; }
.footer-logo { display:inline-block;margin-bottom:64px; }
.footer-logo img { width:240px;height:auto; }
.footer-main { display:grid;grid-template-columns:1fr 1.2fr 1fr;gap:60px; }
.footer-main>div { display:flex;flex-direction:column;align-items:flex-start;gap:10px; }
.footer-main h3 { margin:0 0 12px;font-size:20px;font-weight:500; }
.footer-main p,.footer-main a { margin:0;font-size:16px;line-height:1.5;font-weight:400;text-wrap:balance; }
.footer-main .footer-phone { font-size:26px;letter-spacing:-.035em; }
.site-footer a:hover { color:#91e3ce; }
.footer-legal { border-top:1px solid #ffffff33;margin-top:64px;padding-top:24px;font-size:14px;font-weight:400; }
.privacy { background:var(--paper);color:var(--ink);font:400 18px/1.6 var(--sans); }
.privacy main { max-width:880px;margin:auto;padding:80px 32px; }
.privacy h1 { font-size:clamp(36px,4vw,60px);font-weight:500;letter-spacing:-.05em;line-height:1.06;margin:60px 0 32px; }
.privacy h2 { font-size:28px;line-height:1.2;font-weight:500;margin-top:40px; }
.privacy a { text-decoration:underline;text-underline-offset:4px; }
@media(max-width:900px) {
 .request { padding:82px 5vw 52px; }
 .request-copy { width:100%;max-width:none; }
 .request h2 { font-size:clamp(32px,8.7vw,42px); }
 .request-heading>p,.lead-success>p { font-size:18px;max-width:32ch;margin:18px 0 28px; }
 .lead-form { grid-template-columns:1fr;gap:36px; }
 .lead-questions,.lead-contact { gap:24px; }
 .form-row { grid-template-columns:1fr;gap:22px; }
 .field label,.employee-choices legend { font-size:14px; }
 .field input,.field textarea { font-size:16px; }
 .employee-choices span { font-size:14px;padding:10px 4px; }
 .employee-choices>div { grid-template-columns:repeat(2,minmax(0,1fr));gap:8px; }
 .choices-format label:last-child,.choices-payment label:last-child { grid-column:1/-1; }
 .consent { font-size:13px; }
 .field-error,.submit-error { font-size:13px; }
 .submit-lead { width:100%;font-size:16px; }
 .contact-details { position:static;gap:12px;margin:40px 0 0;font-size:18px; }
 .contact-details>a:first-child { font-size:26px; }
 .contact-details>span { font-size:14px; }
 .lead-success { min-height:260px;padding-top:0; }
 .lead-success h2 { font-size:36px;white-space:normal; }
 .site-footer { padding:48px 5vw 28px; }
 .footer-logo { margin-bottom:48px; }
 .footer-logo img { width:200px; }
 .footer-main { grid-template-columns:1fr;gap:36px; }
 .footer-main>div { gap:8px; }
 .footer-main h3 { margin-bottom:8px; }
 .footer-legal { margin-top:40px;font-size:14px; }
 .privacy main { padding:32px 6vw; }
 .privacy { font-size:16px; }
}

@media(max-width:360px),(max-height:700px) and (max-width:900px) {
 .request { padding-top:76px; }
 #request-title { font-size:28px; }
}

@media(max-width:900px) {
 .request { min-height:100svh;padding:72px 5vw 12px; }
 .request-heading { margin-bottom:18px; }
 .request-heading>p { margin:12px 0 0; }
 .lead-form { gap:18px; }
 .lead-questions,.lead-contact,.form-row { gap:12px; }
 .field label,.employee-choices legend { font-size:16px;margin-bottom:4px; }
 .field label { margin-bottom:1px; }
 .consent,.field-error,.submit-error { font-size:14px; }
 .field input,.field textarea { min-height:44px;height:44px;padding:8px 0; }
 .employee-choices>div { gap:6px; }
 .employee-choices span { min-height:44px;padding:5px 4px; }
 .contact-details { display:none; }
}