:root {
  color-scheme: dark;
  --black: #050304; --black-soft: #0d090b; --panel: #100b0e;
  --paper: #fffafb; --muted: #b7acb1; --faint: #a29299;
  --line: rgba(255,245,248,.12); --line-strong: rgba(255,245,248,.22);
  --wine-light: #f25272; --wine: #5f061f; --wine-mid: #97122f;
  --wine-glow: rgba(214,32,72,.18);
  --page: clamp(20px,5vw,80px); --content: min(1320px,calc(100% - var(--page)*2));
  --mono: 'DM Mono',monospace; --sans: 'Manrope',sans-serif;
  --entry-duration: 1450ms; --haze-density: .48;
  --entry-scene-size: min(112vw,930px,calc(112svh - 180px));
  --entry-logo-brightness: 1;
  --entry-logo-hue: 0deg;
  --logo-optical-shift: clamp(8px,.8vw,12px);
}
* { box-sizing: border-box; }
html { background: var(--black); scroll-behavior: smooth; scroll-padding-top: 100px; }
body { margin:0; min-width: 280px; background:var(--black); color:var(--paper); font: 16px/1.7 var(--sans); overflow-x:clip; }
[hidden] { display:none !important; }
a { color:inherit; text-underline-offset:4px; }
button,input,select,textarea { font:inherit; }
button,a,input,select,textarea { -webkit-tap-highlight-color:transparent; }
button { cursor:pointer; }
button:disabled { cursor:default; opacity:.45; }
:focus-visible { outline:2px solid #ff8fa5; outline-offset:5px; }
::selection { background:#a71a3d; color:white; }
h1,h2,h3,p { margin-top:0; }
img { max-width:100%; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.skip-link { position:fixed; top:12px; left:12px; z-index:100; padding:10px 16px; background:white; color:#16030a; transform:translateY(-160%); }
.skip-link:focus { transform:none; }
#webgl { position:fixed; z-index:0; inset:0; width:100%; height:100%; pointer-events:none; filter:brightness(1) hue-rotate(0deg); transition:filter var(--entry-duration) ease; }
.background-logo { position:fixed; z-index:0; pointer-events:none; }
.background-logo img { display:block; width:100%; height:auto; }
.background-logo-active body[data-entry-phase="site"] .hero-logo-fallback { opacity:0; }
.webgl-ready:not(.motion-reduced) .background-logo { visibility:hidden; }
.entry-moon-stage,.entry-gate { position:fixed; inset:0; overflow:hidden; pointer-events:none; opacity:1; transition:opacity var(--entry-duration) ease; }
.entry-moon-stage { z-index:60; background:#010101; }
.entry-moon-image { position:absolute; top:46%; left:50%; width:var(--entry-scene-size); aspect-ratio:1; background:url('/brand/ad-digital-eclipse-poster.gif') center/contain no-repeat; filter:brightness(.34) saturate(.58); transform:translate(calc(-50% + var(--entry-scene-x,0px)),calc(-50% + var(--entry-scene-y,0px))); clip-path:inset(0 0 7.5% 0); }
/* The bottom strip is outside the display frame at the user's request.
   Both animated and still states use the same framing; the AD logo is separate.
   The silent 24-second, 60-fps video has precomputed blended intermediate frames.
   Keep the poster until playback succeeds; intro-media.mjs owns pause/resume. */
.entry-moon-video { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; opacity:0; pointer-events:none; }
.entry-moon-video.is-ready { opacity:1; }
.motion-reduced .entry-moon-video { visibility:hidden; }
@media (prefers-reduced-motion:reduce) {
  .entry-moon-video { visibility:hidden; }
}
.entry-moon-stage::after { position:absolute; inset:0; content:''; background:linear-gradient(180deg,rgba(0,0,0,.12),transparent 50%,rgba(0,0,0,.42)); }
.entry-gate { z-index:61; background:rgba(2,1,2,.12); }
.entry-beam { position:absolute; top:-12%; left:50%; width:min(100vw,950px); height:95%; transform:translateX(-50%); background:linear-gradient(180deg,rgba(255,241,245,.2),rgba(181,30,57,.095) 50%,transparent 90%); clip-path:polygon(44% 0,56% 0,93% 100%,7% 100%); filter:blur(18px); opacity:.65; }
.entry-haze { position:absolute; bottom:-12%; left:-12%; width:124%; height:55%; opacity:var(--haze-density); filter:blur(24px); mix-blend-mode:screen; animation:haze-rise 18s ease-in-out infinite alternate; }
.entry-haze::before,.entry-haze::after { position:absolute; inset:0; content:''; background:radial-gradient(ellipse 36% 38% at 23% 80%,rgba(183,38,64,.45),transparent 75%),radial-gradient(ellipse 36% 38% at 77% 80%,rgba(183,38,64,.45),transparent 75%); }
.entry-haze::after { opacity:.6; transform:scale(1.1); animation:haze-drift 21s ease-in-out infinite alternate; }
.entry-mark-fallback { position:absolute; top:46%; left:50%; width:calc(var(--entry-scene-size) * .72); transform:translate(calc(-50% + var(--entry-scene-x,0px)),calc(-50% + var(--entry-scene-y,0px))); }
.entry-mark-fallback img,.hero-logo-fallback img { display:block; width:100%; height:auto; filter:drop-shadow(0 16px 24px rgba(131,7,35,.24)); }
.entry-mark-fallback img { filter:brightness(var(--entry-logo-brightness)) hue-rotate(var(--entry-logo-hue)) drop-shadow(0 16px 24px rgba(131,7,35,.24)); }
.webgl-ready:not(.motion-reduced) .entry-mark-fallback,.webgl-ready:not(.motion-reduced) .hero-logo-fallback { opacity:0; }
.entry-controls { position:fixed; z-index:63; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; padding:24px 20px max(24px,env(safe-area-inset-bottom)); pointer-events:none; text-align:center; }
.entry-controls > * { pointer-events:auto; }
.entry-controls h2 { font-size:12px; font-family:var(--mono); font-weight:400; letter-spacing:2px; color:#c9bac0; margin-bottom:12px; text-transform:uppercase; }
.entry-controls .entry-actions { display:flex; align-items:center; gap:14px; }
.text-button { min-height:44px; padding:7px 0; border:0; background:none; color:var(--muted); font-size:14px; text-decoration:underline; text-underline-offset:5px; }
.text-button:hover { color:#fff; }
body.intro-active { overflow:hidden; }
/* Keep the approved face palette above the colored beam/haze, below controls. */
body.intro-active #webgl { z-index:62; }
body.intro-active:not(.intro-opening) #webgl { filter:brightness(var(--entry-logo-brightness)) hue-rotate(var(--entry-logo-hue)); transition:none; }
/* Physical materials already contain the reference palette; filtering
   the finished lighting again would crush the edge highlights and shadows. */
.physical-logo-ready #webgl,.physical-logo-ready body.intro-active:not(.intro-opening) #webgl { filter:none; }
body.intro-active main,body.intro-active .site-header,body.intro-active footer { opacity:0; }
body.intro-opening main,body.intro-opening .site-header,body.intro-opening footer { opacity:1; }
.entry-gate.is-opening,.entry-moon-stage.is-opening { opacity:0; }
.entry-controls.is-opening { opacity:0; transition:opacity .35s; pointer-events:none; }
.entry-controls.is-opening > * { pointer-events:none; }
main,.site-header,footer { transition:opacity var(--entry-duration) ease; }
@keyframes haze-rise { from { transform:translate(-2%,7%) scale(1); } to { transform:translate(2%,-8%) scale(1.09); } }
@keyframes haze-drift { from { transform:translate(-3%,4%); } to { transform:translate(4%,-5%); } }
.backdrop { position:fixed; z-index:1; inset:0; pointer-events:none; background:radial-gradient(ellipse at 65% 8%,rgba(108,9,35,.065),transparent 58%); }
.grid-layer,.scanlight,.progress-spine { display:none; }
.site-header { position:fixed; z-index:30; top:0; left:0; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:24px; width:100%; min-height:84px; padding:0 var(--page); border-bottom:1px solid var(--line); background:rgba(5,3,4,.91); transition:background .3s,border-color .3s,opacity var(--entry-duration) ease; }
.site-header.is-scrolled { background:rgba(5,3,4,.97); }
.wordmark { display:flex; width:max-content; max-width:100%; align-items:center; min-height:52px; }
.wordmark img { width:154px; height:auto; }
.main-nav { display:flex; gap:clamp(16px,2vw,28px); }
.main-nav a { min-height:44px; display:flex; align-items:center; color:var(--muted); font:14px var(--mono); text-decoration:none; position:relative; white-space:nowrap; }
.main-nav a.is-active,.main-nav a:hover { color:white; }
.main-nav a.is-active::after { position:absolute; content:''; bottom:0; width:100%; height:1px; background:var(--wine-light); }
.header-cta { justify-self:end; padding:8px 0 8px 18px; border-left:1px solid var(--wine-light); font:14px var(--mono); text-decoration:none; white-space:nowrap; }
.menu-toggle { display:none; place-items:center; width:44px; height:44px; padding:12px; border:1px solid var(--line-strong); background:transparent; color:white; }
.menu-toggle span,.menu-toggle::before,.menu-toggle::after { content:''; width:18px; height:1px; background:currentColor; }
.mobile-menu { position:fixed; z-index:29; top:76px; left:0; right:0; max-height:calc(100vh - 76px); max-height:calc(100dvh - 76px); overflow-y:auto; overscroll-behavior:contain; padding:16px var(--page) max(24px,env(safe-area-inset-bottom)); background:#0d080b; border-bottom:1px solid var(--line); display:none; }
.mobile-menu.is-open { display:grid; }
.mobile-menu a { display:flex; justify-content:space-between; min-height:50px; align-items:center; font-size:16px; border-bottom:1px solid var(--line); text-decoration:none; }
.mobile-menu a::after { content:'↗'; color:var(--wine-light); }
main,footer { position:relative; z-index:2; }
.hero { padding:120px var(--page) 32px; position:relative; }
.hero-inner { width:100%; max-width:1320px; margin:auto; min-height:calc(100svh - 152px); display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:24px clamp(32px,6vw,100px); align-content:center; }
.hero-copy { grid-column:1; grid-row:1/span 2; align-self:center; padding:32px 0; }
.eyebrow,.section-kicker { display:flex; align-items:center; gap:12px; color:var(--wine-light); font:12px/1.6 var(--mono); letter-spacing:.6px; text-transform:uppercase; margin-bottom:20px; }
.eyebrow::before,.section-kicker::before { content:''; display:block; flex:0 0 24px; height:1px; background:currentColor; }
h1 { max-width:11.5ch; font-size:clamp(48px,5.3vw,80px); font-weight:800; line-height:1.06; letter-spacing:-.05em; margin-bottom:26px; text-wrap:balance; }
.hero-copy > p:not(.eyebrow) { color:var(--muted); max-width:480px; font-size:18px; line-height:1.8; margin-bottom:30px; }
.button-row { display:flex; flex-wrap:wrap; gap:12px; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:12px 20px; border:1px solid var(--line-strong); background:transparent; color:white; font:14px/1.5 var(--mono); text-decoration:none; transition:background .2s,border-color .2s,transform .2s; text-align:center; }
.button:hover { border-color:#b9aab0; transform:translateY(-2px); }
.button.primary { background:#cb2346; border-color:#cb2346; }
.button.primary:hover { background:#b91b3d; border-color:#b91b3d; }
/* Echo the reference logo's bright-red to deep-wine faces, without a white shine. */
#entry-enter { min-height:48px; padding:12px 24px; color:#fff; background:linear-gradient(135deg,#e0000d 0%,#990517 55%,#520815 100%); border:1px solid #cf2334; border-radius:3px; box-shadow:0 4px 0 #430812,0 10px 22px rgba(0,0,0,.3); text-shadow:0 1px 1px rgba(0,0,0,.25); transition:transform .2s,box-shadow .2s,border-color .2s; }
#entry-enter:hover { background:linear-gradient(135deg,#d0000d 0%,#8c0415 55%,#480712 100%); border-color:#e13a48; box-shadow:0 6px 0 #430812,0 12px 24px rgba(0,0,0,.35); transform:translateY(-2px); }
#entry-enter:active { background:linear-gradient(135deg,#bc000c 0%,#790413 55%,#40060f 100%); transform:translateY(2px); box-shadow:0 2px 0 #430812,0 5px 14px rgba(0,0,0,.3); }
#entry-enter:focus-visible { outline:2px solid #e18b90; outline-offset:6px; }
@media (prefers-reduced-motion:reduce) {
  #entry-enter { transition:none; }
  #entry-enter:hover,#entry-enter:active { transform:none; }
}
.button.secondary:hover { background:rgba(255,255,255,.04); }
.hero-visual { position:relative; grid-column:2; grid-row:1; height:clamp(240px,24vw,320px); pointer-events:none; }
.hero-field { position:absolute; inset:0; overflow:hidden; }
.field-glow { position:absolute; inset:-25% 2% -10%; background:linear-gradient(180deg,rgba(232,135,158,.07),rgba(165,21,54,.065) 55%,transparent); clip-path:polygon(45% 0,55% 0,98% 100%,2% 100%); filter:blur(18px); }
.field-sweep { position:absolute; bottom:7%; left:15%; right:15%; height:1px; background:linear-gradient(90deg,transparent,rgba(193,42,79,.28),transparent); }
.hero-logo-fallback { position:absolute; width:min(100%,405px); left:calc(50% - var(--logo-optical-shift)); top:50%; transform:translate(-50%,-50%); }
.hero-brief { grid-column:2; grid-row:2; width:100%; border:1px solid var(--line); background:rgba(12,8,10,.86); }
.brief-topline,.brief-footer { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px 16px; padding:14px 22px; font:13px/1.6 var(--mono); color:var(--muted); }
.brief-topline { border-bottom:1px solid var(--line); }
.brief-live { color:var(--wine-light); }
.hero-brief h2 { padding:0 20px; margin:20px 0; font-size:clamp(22px,2.1vw,28px); letter-spacing:-.04em; line-height:1.3; }
.brief-list { list-style:none; padding:0 20px; margin:0; }
.brief-list a { display:grid; grid-template-columns:24px 1fr 12px; gap:2px 10px; align-items:center; padding:12px 0; border-top:1px solid var(--line); text-decoration:none; }
.brief-list span { grid-row:1/span 2; color:var(--wine-light); font:12px var(--mono); }
.brief-list strong { font-size:15px; font-weight:600; }
.brief-list small { grid-column:2; color:var(--muted); font-size:13px; }
.brief-list b { grid-column:3; grid-row:1/span 2; color:var(--wine-light); }
.brief-footer { border-top:1px solid var(--line); margin-top:8px; }
.brief-footer a { text-decoration:none; color:white; min-height:32px; display:flex; align-items:center; }
.hero-signals { list-style:none; padding:0; margin:24px 0 0; display:flex; flex-wrap:wrap; gap:16px; color:var(--muted); font:12px var(--mono); }
.hero-signals li::before { content:'·'; color:var(--wine-light); margin-right:8px; }
.hero-foot { grid-column:1/-1; display:flex; flex-wrap:wrap; gap:12px; justify-content:space-between; margin-top:22px; padding-top:20px; border-top:1px solid var(--line); }
.hero-foot p { margin:0; color:var(--faint); font:12px/1.6 var(--mono); }
.section { width:var(--content); margin:0 auto; padding:clamp(76px,8vw,118px) 0; }
.section-head { display:grid; grid-template-columns:minmax(150px,.55fr) minmax(0,1.45fr); gap:40px; margin-bottom:42px; }
.section-heading { margin:0; font-size:clamp(36px,4.2vw,62px); line-height:1.12; font-weight:800; letter-spacing:-.04em; text-wrap:balance; }
.section-description { max-width:600px; margin:22px 0 0; color:var(--muted); font-size:17px; line-height:1.8; }
.service-grid,.principle-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(16px,2vw,28px); }
.service-card,.principle-card { padding:28px; border:1px solid var(--line); background:linear-gradient(135deg,#100b0e,#090608); color:inherit; text-align:left; }
.service-card { display:flex; flex-direction:column; align-items:flex-start; gap:22px; min-height:330px; padding:clamp(24px,2.4vw,34px); border-top-color:rgba(242,82,114,.38); transition:border-color .2s,background .2s; }
.service-card:hover,.service-card:focus-visible { border-color:rgba(233,65,104,.5); background:#160b11; }
.service-number,.principle-index { color:var(--faint); font:13px/1.7 var(--mono); }
.service-card h3,.principle-card h3 { margin:0; font-size:28px; line-height:1.2; letter-spacing:-.04em; }
.service-card p,.principle-card p { color:var(--muted); font-size:16px; line-height:1.75; margin-bottom:0; }
.service-link { display:flex; align-items:center; justify-content:space-between; gap:16px; width:100%; margin-top:auto; padding-top:20px; border-top:1px solid var(--line); color:var(--wine-light); font:14px/1.5 var(--mono); }
.service-link::after { content:'↗'; }
.principle-card { background:transparent; border:0; border-top:1px solid var(--line); padding:24px 12px 0 0; }
.principle-card h3 { margin:18px 0; font-size:25px; }
.studio-note { display:grid; grid-template-columns:.55fr 1.45fr; gap:40px; padding:30px 0 0; margin-top:45px; border-top:1px solid var(--line); }
.studio-note p { color:var(--muted); margin:0; max-width:660px; }
.studio-note strong { color:var(--paper); }
.process-list { border-top:1px solid var(--line); }
.process-item { display:grid; grid-template-columns:54px .7fr 1.3fr; align-items:start; gap:24px; padding:28px 0; border-bottom:1px solid var(--line); }
.process-index { color:var(--wine-light); font:14px var(--mono); padding-top:5px; }
.process-item h3 { font-size:26px; line-height:1.3; margin:0; letter-spacing:-.04em; }
.process-item p { margin:0; color:var(--muted); font-size:16px; }
.process-item p strong { color:#eee5e9; display:block; font-weight:500; margin-top:8px; }
.process-note,.case-note { color:var(--muted); font-size:14px; margin:20px 0 0; }
.demo-shell { border:1px solid var(--line-strong); background:#0c090b; }
.demo-tabs { display:flex; gap:0; padding:0 20px; border-bottom:1px solid var(--line); background:#110b0f; }
.demo-tabs button { padding:18px 16px; min-height:56px; border:0; border-bottom:2px solid transparent; background:none; color:var(--muted); font-size:14px; }
.demo-tabs button[aria-selected=true] { border-bottom-color:var(--wine-light); color:white; background:rgba(242,82,114,.065); }
.demo-tabs button:hover { color:white; }
.demo-content { padding:clamp(20px,3vw,38px); }
.demo-heading { display:flex; justify-content:space-between; gap:20px; align-items:flex-start; margin-bottom:24px; }
.demo-heading h3 { margin:8px 0 0; font-size:28px; line-height:1.3; letter-spacing:-.04em; }
.demo-label { color:var(--wine-light); font:13px/1.6 var(--mono); }
.demo-metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:24px; }
.demo-metrics > div { padding:20px; border:1px solid var(--line); background:linear-gradient(140deg,#191017,#100b0e); font-size:14px; color:var(--muted); }
.demo-metrics strong { display:block; color:white; font-size:30px; line-height:1.15; font-weight:600; margin-bottom:8px; font-variant-numeric:tabular-nums; }
.demo-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin:18px 0; }
.demo-toolbar label { font-size:14px; color:var(--muted); }
.demo-select,.demo-input { background:#140d11; border:1px solid var(--line-strong); color:var(--paper); min-height:44px; padding:8px 12px; max-width:100%; border-radius:0; }
.demo-list { list-style:none; margin:0; padding:0; }
.demo-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:16px; align-items:center; border-top:1px solid var(--line); padding:18px 0; }
.demo-row strong { display:block; font-size:15px; font-weight:500; overflow-wrap:anywhere; }
.demo-row small { font:13px/1.7 var(--mono); color:var(--faint); }
.demo-row select { font-size:14px; max-width:150px; }
.demo-footer { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px; margin-top:24px; padding-top:18px; border-top:1px solid var(--line); }
.demo-disclaimer { color:var(--muted); font-size:13px; margin:14px 0 0; }
.demo-total { font-size:24px; color:var(--paper); }
.demo-feedback { color:var(--muted); font-size:14px; min-height:24px; margin:12px 0 0; }
.demo-input[type=number] { width:80px; }
.demo-ticket { width:100%; min-width:0; min-height:44px; text-align:left; color:inherit; background:none; border:0; padding:4px 0; }
.demo-ticket:hover strong { color:var(--wine-light); }
.demo-detail { background:#150c11; padding:18px; margin-top:16px; border-left:2px solid var(--wine-light); font-size:15px; }
.demo-form { display:grid; grid-template-columns:1fr auto auto; gap:12px; margin-top:22px; }
.demo-form input { min-width:0; }
.faq-list { border-top:1px solid var(--line); }
.faq-list details { border-bottom:1px solid var(--line); }
.faq-list summary { position:relative; cursor:pointer; padding:24px 36px 24px 0; font-size:18px; font-weight:600; list-style:none; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary::after { position:absolute; right:0; content:'+'; color:var(--wine-light); }
.faq-list details[open] summary::after { content:'−'; }
.faq-list details p { max-width:800px; color:var(--muted); padding-right:32px; margin:0 0 24px; }
.contact-card { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(24px,4vw,60px); padding:clamp(24px,4vw,56px); border:1px solid var(--line); border-top-color:rgba(242,82,114,.38); background:linear-gradient(120deg,#160d13,#090608); }
.contact-main h2 { font-size:clamp(40px,4.6vw,64px); line-height:1.06; letter-spacing:-.055em; }
.contact-main p { color:var(--muted); }
.contact-links { display:grid; gap:0; margin-top:30px; }
.contact-link { padding:18px 0; border-bottom:1px solid var(--line); text-decoration:none; overflow-wrap:anywhere; }
.contact-link span { display:block; color:var(--faint); font:12px/1.7 var(--mono); margin-bottom:6px; }
.form-title { font-size:24px; letter-spacing:-.04em; margin-bottom:8px; }
.form-intro { font-size:15px; color:var(--muted); }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.field { display:grid; gap:8px; min-width:0; }
.field.full { grid-column:1/-1; }
.field label { color:#d5c7ce; font-size:14px; }
.field input,.field select,.field textarea { min-width:0; width:100%; border:1px solid var(--line-strong); border-radius:0; background:#0b0709; color:white; padding:12px; min-height:48px; font-size:16px; line-height:1.5; }
.field textarea { min-height:130px; resize:vertical; }
.field input:focus,.field select:focus,.field textarea:focus { border-color:var(--wine-light); }
.field input,.field select,.field textarea,.demo-input,.demo-select { border-color:#75616a; }
.form-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:24px; }
.form-actions .button { flex:1 1 100%; }
.form-actions .text-button { margin-left:auto; }
.form-feedback { flex-basis:100%; min-height:24px; margin:4px 0 0; color:#dfc7d0; font-size:14px; }
.form-privacy { flex-basis:100%; color:var(--muted); font-size:13px; margin:0; }
.message-preview { flex-basis:100%; margin-top:6px; }
.message-preview summary { color:var(--muted); cursor:pointer; font-size:14px; }
.message-preview textarea { width:100%; min-height:160px; margin-top:12px; background:#0b0709; color:white; border:1px solid var(--line); padding:12px; resize:vertical; font:14px/1.6 var(--sans); }
.site-footer { width:var(--content); margin:auto; display:flex; flex-wrap:wrap; align-items:center; gap:20px; justify-content:space-between; border-top:1px solid var(--line); padding:26px 0; font-size:14px; color:var(--muted); }
.footer-tools { display:flex; gap:20px; flex-wrap:wrap; }
.site-footer a { display:inline-flex; align-items:center; min-height:44px; text-decoration:none; }
.site-footer a:hover { color:var(--paper); text-decoration:underline; }
.service-dialog { width:min(600px,calc(100% - 32px)); max-height:85svh; padding:0; border:1px solid var(--line-strong); background:#11090e; color:white; }
.service-dialog::backdrop { background:rgba(0,0,0,.78); }
.dialog-head { display:flex; align-items:center; justify-content:space-between; gap:20px; border-bottom:1px solid var(--line); padding:16px 24px; }
.dialog-head p { margin:0; color:var(--muted); font:14px var(--mono); }
.dialog-close { min-height:44px; padding:8px 12px; border:1px solid var(--line); background:none; color:white; font-size:14px; }
.dialog-content { padding:28px; }
.dialog-content h2 { font-size:34px; line-height:1.2; letter-spacing:-.04em; }
.dialog-content p,.dialog-list { color:var(--muted); }
.dialog-list { padding-left:20px; margin-bottom:28px; }
.dialog-list li { padding:7px 0; }
[data-reveal] { opacity:1; transform:none; }
.js-reveal [data-reveal]:not(.is-visible) { opacity:0; transform:translateY(16px); }
.js-reveal [data-reveal] { transition:opacity .5s ease,transform .55s ease; }
.motion-reduced *, .motion-reduced *::before, .motion-reduced *::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
.page-hidden *, .page-hidden *::before, .page-hidden *::after { animation-play-state:paused !important; }
.privacy-page { max-width:820px; padding:140px 24px 70px; margin:auto; }
.privacy-header { grid-template-columns:1fr auto; }
.privacy-header > a:last-child { display:inline-flex; align-items:center; min-height:44px; font:14px var(--mono); }
.privacy-page h1 { font-size:clamp(38px,6vw,60px); max-width:none; }
.privacy-page h2 { margin-top:36px; font-size:24px; }
.privacy-page p { color:var(--muted); }
@media (max-width:1060px) {
  .site-header { grid-template-columns:1fr auto; min-height:76px; }
  .main-nav,.header-cta { display:none; } .menu-toggle { display:grid; }
  .hero-inner { gap:24px 32px; } h1 { font-size:clamp(44px,5.8vw,66px); }
}
@media (max-width:760px) {
  :root { --page:20px; --haze-density:.21; --entry-duration:1600ms; }
  html { scroll-padding-top:96px; }
  .entry-beam { width:145vw; opacity:.55; }
  .entry-haze { height:47%; bottom:-14%; }
  .entry-controls { padding-bottom:max(20px,env(safe-area-inset-bottom)); }
  .entry-controls h2 { font-size:12px; margin-bottom:6px; }
  .wordmark img { width:134px; }
  .hero { padding:112px var(--page) 24px; }
  .hero-inner { grid-template-columns:minmax(0,1fr); min-height:0; gap:24px; }
  .hero-copy { grid-column:1; grid-row:1; padding:0; }
  h1 { font-size:clamp(36px,10.8vw,62px); max-width:13ch; }
  .hero-copy > p:not(.eyebrow) { font-size:16px; }
  .hero-visual { grid-column:1; grid-row:2; height:240px; }
  .hero-logo-fallback { width:min(94%,370px); }
  .hero-brief { grid-column:1; grid-row:3; }
  .hero-foot { grid-row:4; margin-top:0; }
  .button-row .button { flex:1 1 190px; min-height:52px; }
  .section { padding:64px 0; }
  .section-head,.studio-note { grid-template-columns:1fr; gap:16px; }
  .section-head { margin-bottom:28px; }
  .section-kicker { margin-bottom:0; }
  .section-heading { font-size:clamp(34px,8.8vw,45px); }
  .section-description { font-size:16px; margin-top:18px; }
  .service-grid,.principle-grid { grid-template-columns:1fr; }
  .service-card { min-height:240px; padding:24px; }
  .principle-card { padding:22px 0; }
  .principle-card h3 { margin:12px 0; }
  .studio-note { margin-top:24px; padding-top:24px; }
  .process-item { grid-template-columns:36px 1fr; gap:10px 14px; padding:24px 0; }
  .process-item p { grid-column:2; }
  .process-item h3 { font-size:24px; }
  .demo-tabs { padding:0 8px; }
  .demo-tabs button { padding:14px 9px; flex:1; font-size:13px; line-height:1.5; }
  .demo-heading { flex-wrap:wrap; gap:6px; }
  .demo-heading h3 { font-size:25px; }
  .demo-metrics { gap:8px; }
  .demo-metrics > div { padding:14px 8px; font-size:13px; overflow-wrap:anywhere; }
  .demo-metrics strong { font-size:26px; }
  .demo-row { grid-template-columns:minmax(0,1fr); gap:10px; }
  .demo-row select { max-width:100%; width:100%; }
  .demo-form { grid-template-columns:1fr; }
  .demo-footer { align-items:flex-start; }
  .demo-footer .button { width:100%; }
  .faq-list summary { font-size:17px; padding:20px 28px 20px 0; }
  .faq-list details p { padding-right:8px; }
  .contact-card { grid-template-columns:1fr; padding:24px 20px; gap:36px; }
  .contact-main h2 { font-size:clamp(34px,10vw,42px); }
  .form-grid { grid-template-columns:1fr; }
  .form-actions .button { width:100%; }
  .form-actions .text-button { width:100%; margin-left:0; text-align:left; }
  .site-footer { flex-direction:column; align-items:flex-start; }
}
@media (max-height:550px) and (orientation:landscape) {
  .entry-controls { align-items:flex-end; text-align:right; padding-right:24px; }
  .entry-controls h2 { display:none; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
}