:root {
  --ink: #0b0c0b;
  --ink-soft: #171916;
  --paper: #e9e9e2;
  --paper-dim: #c2c4ba;
  --line-dark: rgba(233, 233, 226, .18);
  --line-light: rgba(11, 12, 11, .16);
  --acid: #c9f151;
  --muted-dark: #969b91;
  --muted-light: #62685f;
  --sans: 'Avenir Next', 'Gill Sans', 'Century Gothic', sans-serif;
  --mono: 'SFMono-Regular', Consolas, 'Liberation Mono', monospace;
  --ease: cubic-bezier(.22, 1, .36, 1);
  --max: 1440px;
  --pad: clamp(22px, 4vw, 64px);
  --radius: 2px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--ink); }
body { margin: 0; background: var(--ink); color: var(--paper); font-family: var(--sans); font-size: 16px; line-height: 1.55; overflow-x: hidden; -webkit-font-smoothing: antialiased; }
body::before { content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 20; opacity: .035; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E"); }
a { color: inherit; }
.skip-link { position: fixed; left: 16px; top: -80px; z-index: 100; padding: 12px 16px; background: var(--acid); color: var(--ink); text-decoration: none; transition: top .25s ease; }
.skip-link:focus { top: 16px; }
.cursor-glow { position: fixed; left: 0; top: 0; width: 20px; height: 20px; border: 1px solid var(--acid); border-radius: 50%; pointer-events: none; z-index: 30; opacity: 0; transform: translate(-50%, -50%); transition: width .35s var(--ease), height .35s var(--ease), opacity .35s ease; mix-blend-mode: difference; }
body.cursor-ready .cursor-glow { opacity: .7; }
body.cursor-hover .cursor-glow { width: 56px; height: 56px; opacity: 1; }

.site-header { position: fixed; inset: 0 0 auto; z-index: 10; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 30px; padding: 25px var(--pad); color: var(--paper); transition: background .5s ease, padding .5s ease, color .5s ease; }
.site-header.scrolled { padding-top: 16px; padding-bottom: 16px; background: rgba(11, 12, 11, .82); backdrop-filter: blur(18px); border-bottom: 1px solid var(--line-dark); }
.wordmark { display: inline-flex; width: fit-content; align-items: center; gap: 13px; text-decoration: none; font-size: .75rem; font-weight: 700; letter-spacing: .18em; }
.wordmark-mark { position: relative; display: inline-flex; align-items: flex-end; gap: 3px; height: 17px; width: 20px; }
.wordmark-mark i { display: block; width: 4px; background: currentColor; transform-origin: bottom; }
.wordmark-mark i:nth-child(1) { height: 9px; opacity: .7; }.wordmark-mark i:nth-child(2) { height: 15px; }.wordmark-mark i:nth-child(3) { height: 11px; opacity: .8; }
.desktop-nav { display: flex; gap: clamp(20px, 3vw, 48px); font-family: var(--mono); font-size: .66rem; letter-spacing: .08em; text-transform: uppercase; }
.desktop-nav a, .footer-bottom a { text-decoration: none; opacity: .68; transition: opacity .3s ease, color .3s ease; }.desktop-nav a:hover, .footer-bottom a:hover { color: var(--acid); opacity: 1; }
.header-cta { justify-self: end; display: inline-flex; align-items: center; gap: 16px; color: var(--paper); font-family: var(--mono); font-size: .65rem; letter-spacing: .08em; text-transform: uppercase; text-decoration: none; }.header-cta b { color: var(--acid); font-size: 1rem; font-weight: 400; transition: transform .3s var(--ease); }.header-cta:hover b { transform: translate(4px, -4px); }
.menu-toggle, .mobile-menu { display: none; }

.hero { position: relative; min-height: 100svh; display: grid; grid-template-columns: minmax(340px, .85fr) 1.15fr; align-items: center; padding: 120px var(--pad) 70px; overflow: hidden; background: var(--ink); }
.hero-gridline { position: absolute; inset: 0 var(--pad); pointer-events: none; border-inline: 1px solid rgba(233, 233, 226, .08); background: linear-gradient(90deg, transparent 49.95%, rgba(233,233,226,.08) 50%, transparent 50.05%), linear-gradient(0deg, transparent 49.95%, rgba(233,233,226,.08) 50%, transparent 50.05%); }
.hero-copy { position: relative; z-index: 2; max-width: 650px; padding-left: clamp(20px, 7vw, 120px); }
.eyebrow { display: inline-flex; align-items: center; gap: 13px; margin: 0 0 29px; color: var(--acid); font-family: var(--mono); font-size: .62rem; letter-spacing: .12em; text-transform: uppercase; }.eyebrow-line { display: block; width: 28px; height: 1px; background: currentColor; opacity: .8; }
.dark-eyebrow { color: var(--ink); }.dark-eyebrow .eyebrow-line { background: currentColor; }
h1, h2, h3, p { margin-top: 0; }
h1 { max-width: 680px; margin-bottom: 29px; color: var(--paper); font-size: clamp(4.2rem, 8.6vw, 9.6rem); font-weight: 500; letter-spacing: -.085em; line-height: .88; }
h1 em, .display em { color: var(--acid); font-style: normal; }
.hero-intro { max-width: 370px; margin-bottom: 42px; color: var(--muted-dark); font-size: clamp(1rem, 1.3vw, 1.18rem); line-height: 1.55; }
.hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 28px; }.button { display: inline-flex; align-items: center; justify-content: space-between; gap: 40px; min-width: 184px; padding: 15px 17px; border: 1px solid transparent; font-family: var(--mono); font-size: .65rem; letter-spacing: .05em; text-decoration: none; text-transform: uppercase; transition: transform .4s var(--ease), background .4s ease, color .4s ease; }.button b { font-size: 1rem; font-weight: 400; }.button-accent { background: var(--acid); color: var(--ink); }.button-accent:hover { background: #dcff7d; transform: translateY(-4px); }.text-link { color: var(--paper); font-family: var(--mono); font-size: .65rem; letter-spacing: .07em; text-decoration: none; text-transform: uppercase; opacity: .7; transition: opacity .3s ease; }.text-link:hover { opacity: 1; }.text-link span { padding-left: 8px; color: var(--acid); font-size: 1rem; }
.hero-stage { position: relative; min-height: min(70vw, 740px); display: grid; place-items: center; perspective: 1400px; }.stage-label, .stage-note, .stage-scroll { position: absolute; z-index: 2; font-family: var(--mono); font-size: .58rem; letter-spacing: .1em; text-transform: uppercase; }.stage-label { top: 10%; right: 6%; color: var(--muted-dark); }.stage-label span { padding-left: 18px; color: var(--acid); }.stage-note { right: 1%; bottom: 17%; display: flex; align-items: center; gap: 10px; color: var(--muted-dark); transform: rotate(90deg); transform-origin: right; }.stage-scroll { bottom: 3%; left: 45%; display: flex; align-items: center; gap: 14px; color: var(--paper); opacity: .65; }.stage-scroll i { display: block; width: 47px; height: 1px; background: var(--acid); transform-origin: left; animation: scroll-line 2s ease-in-out infinite; }.pulse-dot { display: inline-block; width: 7px; height: 7px; background: var(--acid); border-radius: 50%; box-shadow: 0 0 0 0 rgba(201,241,81,.5); animation: pulse 2s infinite; }
.orbit { position: absolute; width: min(34vw, 470px); aspect-ratio: 1; border: 1px solid rgba(233,233,226,.2); border-radius: 50%; transform: rotateX(67deg) rotateZ(14deg); }.orbit-one { animation: orbit-spin 18s linear infinite; }.orbit-two { width: min(25vw, 340px); transform: rotateX(69deg) rotateZ(-48deg); border-color: rgba(201,241,81,.35); animation: orbit-spin-reverse 14s linear infinite; }
.light-object { position: relative; width: min(23vw, 340px); aspect-ratio: 1; transform-style: preserve-3d; transform: rotateX(10deg) rotateY(-19deg) rotateZ(-13deg); animation: object-drift 9s ease-in-out infinite; transition: transform .8s var(--ease); }.light-object:hover { animation-play-state: paused; }
.object-shadow { position: absolute; left: 5%; bottom: 7%; width: 90%; height: 19%; border-radius: 50%; background: rgba(0,0,0,.6); filter: blur(20px); transform: rotateX(65deg) translateZ(-40px); }.object-ring { position: absolute; inset: 4%; border: 2px solid var(--acid); border-radius: 50%; transform-style: preserve-3d; }.object-ring::after { content: ''; position: absolute; inset: -9px; border: 1px solid rgba(201,241,81,.35); border-radius: 50%; }.object-ring-back { transform: rotateX(67deg) rotateY(12deg) translateZ(-45px) scaleY(.45); border-color: rgba(201,241,81,.45); }.object-ring-front { transform: rotateX(67deg) rotateY(12deg) translateZ(45px) scaleY(.45); box-shadow: 0 0 32px rgba(201,241,81,.12); }.object-core { position: absolute; inset: 24%; background: radial-gradient(circle at 33% 27%, #f4ffbd 0 4%, #d4fa67 14%, #779d30 47%, #1d2c10 72%, #090b08 100%); border-radius: 50%; transform: translateZ(2px); box-shadow: 0 0 50px rgba(201,241,81,.28), inset -23px -17px 40px rgba(0,0,0,.45), inset 12px 8px 20px rgba(255,255,255,.25); }.object-core span { position: absolute; inset: 10%; border: 1px solid rgba(255,255,255,.5); border-radius: 50%; opacity: .35; }.object-mark { position: absolute; bottom: 21%; left: 37%; color: var(--ink); font-family: var(--mono); font-size: .57rem; letter-spacing: .1em; transform: translateZ(50px); }
.hero-footerline { position: absolute; left: var(--pad); right: var(--pad); bottom: 25px; display: grid; grid-template-columns: 1fr 2fr 1fr; color: var(--muted-dark); font-family: var(--mono); font-size: .57rem; letter-spacing: .1em; text-transform: uppercase; }.hero-index { text-align: right; }

.section-light { color: var(--ink); background: var(--paper); }.section-dark { color: var(--paper); background: var(--ink); }.section-accent { color: var(--ink); background: var(--acid); }
.section-meta { display: flex; justify-content: space-between; width: 100%; padding-bottom: 22px; border-bottom: 1px solid var(--line-light); color: var(--muted-light); font-family: var(--mono); font-size: .59rem; letter-spacing: .1em; text-transform: uppercase; }.section-meta-dark { border-color: var(--line-dark); color: var(--muted-dark); }
.manifesto, .fields, .work-section, .approach, .contact-section { position: relative; padding: clamp(90px, 12vw, 190px) var(--pad); }.manifesto-content { max-width: var(--max); margin: clamp(90px, 12vw, 180px) auto 0; }.display { margin: 0; font-size: clamp(3.4rem, 7.2vw, 8.4rem); font-weight: 500; letter-spacing: -.08em; line-height: .9; }.dark-display { color: var(--ink); }.manifesto-bottom { display: grid; grid-template-columns: minmax(260px, 430px) 1fr; align-items: end; gap: 8vw; margin: 90px 0 0 auto; max-width: 880px; }.lead-copy { margin: 0; font-size: clamp(1rem, 1.35vw, 1.25rem); line-height: 1.55; }.manifesto-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; border-top: 1px solid var(--line-light); padding-top: 19px; }.manifesto-stats b { display: block; margin-bottom: 10px; font-size: 2.7rem; font-weight: 500; letter-spacing: -.08em; line-height: 1; }.manifesto-stats span { display: block; color: var(--muted-light); font-family: var(--mono); font-size: .58rem; letter-spacing: .07em; text-transform: uppercase; }
.fields { background: var(--ink-soft); }.fields-intro { max-width: var(--max); margin: clamp(90px, 12vw, 180px) auto 120px; }.fields-intro .display { max-width: 880px; }.field-list { max-width: 1100px; margin: 0 auto; }.field-row { display: grid; grid-template-columns: 70px 1fr 70px; align-items: center; gap: 30px; min-height: 145px; border-top: 1px solid var(--line-dark); transition: padding .5s var(--ease), color .5s ease; }.field-row:last-child { border-bottom: 1px solid var(--line-dark); }.field-row:hover { padding: 0 24px; color: var(--acid); }.field-number { align-self: start; padding-top: 31px; color: var(--muted-dark); font-family: var(--mono); font-size: .62rem; }.field-row h3 { margin: 0 0 7px; font-size: clamp(1.7rem, 2.8vw, 3.1rem); font-weight: 500; letter-spacing: -.07em; line-height: 1; }.field-row p { max-width: 430px; margin: 0; color: var(--muted-dark); font-size: .95rem; }.field-arrow { justify-self: end; font-size: 1.5rem; font-weight: 300; transition: transform .5s var(--ease); }.field-row:hover .field-arrow { transform: translate(6px, -6px); }

.work-section { background: var(--paper); }.work-heading { display: flex; justify-content: space-between; align-items: end; gap: 50px; max-width: var(--max); margin: clamp(80px, 10vw, 150px) auto 70px; }.work-note { max-width: 290px; margin: 0 5% 4px 0; color: var(--muted-light); font-size: .88rem; }.work-grid { display: grid; grid-template-columns: 1.35fr 1fr 1fr; gap: 16px; max-width: var(--max); margin: 0 auto; }.work-card { cursor: pointer; }.work-visual { position: relative; min-height: 460px; overflow: hidden; background: #b7bab1; }.work-card-large .work-visual { min-height: 650px; }.work-visual > * { pointer-events: none; }.visual-coord { position: absolute; z-index: 3; top: 20px; left: 21px; color: rgba(11,12,11,.65); font-family: var(--mono); font-size: .56rem; letter-spacing: .08em; text-transform: uppercase; }.visual-nordlicht { background: #c5c9bd; }.visual-slab { position: absolute; background: #30352e; }.slab-a { inset: 16% 14% 8% 20%; transform: skewY(-16deg) rotate(12deg); background: linear-gradient(110deg, #555e50, #252b25 45%, #171b17); box-shadow: 20px 26px 40px rgba(11,12,11,.25); }.slab-b { width: 45%; height: 80%; right: 5%; top: 15%; background: #e6e6db; transform: skewY(17deg) rotate(-13deg); opacity: .75; }.visual-glow { position: absolute; width: 70%; aspect-ratio: 1; top: 19%; left: 15%; background: radial-gradient(circle, rgba(201,241,81,.7), rgba(201,241,81,.14) 22%, transparent 61%); mix-blend-mode: screen; animation: glow-breathe 5s ease-in-out infinite; }.visual-kiesel { background: #737c70; }.kiesel-sphere { position: absolute; width: 61%; aspect-ratio: 1; top: 19%; left: 22%; border-radius: 50%; background: radial-gradient(circle at 32% 26%, #d8d9c9 0 4%, #9da293 18%, #61685d 53%, #232823 83%); box-shadow: 20px 28px 30px rgba(11,12,11,.25); animation: slow-float 7s ease-in-out infinite; }.kiesel-line { position: absolute; top: 48%; left: -10%; width: 120%; height: 1px; background: var(--acid); transform: rotate(-32deg); }.visual-atelier { background: #1d241e; }.atelier-frame { position: absolute; inset: 15% 16%; border: 1px solid rgba(201,241,81,.7); transform: rotate(17deg); }.atelier-frame::after { content: ''; position: absolute; inset: 13%; border: 1px solid rgba(233,233,226,.4); }.atelier-light { position: absolute; width: 80%; aspect-ratio: 1; left: 10%; top: 11%; border-radius: 50%; background: radial-gradient(circle, rgba(201,241,81,.75), transparent 62%); filter: blur(10px); animation: glow-breathe 6s ease-in-out infinite reverse; }.visual-atelier .visual-coord { color: rgba(233,233,226,.65); }.work-caption { display: flex; justify-content: space-between; align-items: start; gap: 20px; padding: 20px 0 0; }.work-type { display: block; margin-bottom: 9px; color: var(--muted-light); font-family: var(--mono); font-size: .57rem; letter-spacing: .08em; text-transform: uppercase; }.work-caption h3 { margin: 0; font-size: 1.22rem; font-weight: 600; letter-spacing: -.045em; }.circle-arrow { display: grid; place-items: center; width: 37px; height: 37px; border: 1px solid var(--line-light); border-radius: 50%; transition: all .4s var(--ease); }.work-card:hover .circle-arrow { background: var(--acid); border-color: var(--acid); transform: rotate(45deg); }.work-card:hover .work-visual > :not(.visual-coord) { transition: transform .9s var(--ease); }.work-card:hover .slab-a { transform: skewY(-16deg) rotate(12deg) translate(-8px, -9px); }.work-card:hover .kiesel-sphere { transform: translate(8px, -8px) scale(1.03); }

.approach-grid { display: grid; grid-template-columns: minmax(280px, .9fr) 1.1fr; gap: 12vw; max-width: var(--max); margin: clamp(100px, 13vw, 190px) auto 0; }.approach-sticky { align-self: start; position: sticky; top: 120px; }.approach-note { max-width: 300px; margin-top: 50px; color: var(--muted-dark); font-size: .92rem; }.process-list { border-top: 1px solid var(--line-dark); }.process-item { display: grid; grid-template-columns: 50px 1fr 30px; gap: 20px; align-items: start; padding: 32px 0 38px; border-bottom: 1px solid var(--line-dark); }.process-item > span { color: var(--acid); font-family: var(--mono); font-size: .62rem; }.process-item h3 { margin: 0 0 8px; font-size: 1.9rem; font-weight: 500; letter-spacing: -.06em; }.process-item p { max-width: 370px; margin: 0; color: var(--muted-dark); font-size: .9rem; }.process-item > b { color: var(--muted-dark); font-size: 1.1rem; font-weight: 400; transition: color .3s ease, transform .4s var(--ease); }.process-item:hover > b { color: var(--acid); transform: translate(4px, -4px); }

.contact-section { min-height: 80svh; display: flex; flex-direction: column; overflow: hidden; }.contact-content { position: relative; z-index: 1; width: min(100%, var(--max)); margin: auto; padding: 5vw 0; }.contact-copy { max-width: 330px; margin: 55px 0 35px 18%; font-size: 1rem; line-height: 1.5; }.contact-mail { display: inline-flex; align-items: center; gap: 30px; margin-left: 18%; color: var(--ink); font-size: clamp(1.35rem, 3.2vw, 3.8rem); font-weight: 600; letter-spacing: -.08em; text-decoration: none; border-bottom: 2px solid var(--ink); }.contact-mail b { font-size: 1.5rem; font-weight: 400; transition: transform .4s var(--ease); }.contact-mail:hover b { transform: translate(8px, -8px); }.contact-orbit { position: absolute; right: 5%; top: 9%; width: min(42vw, 580px); aspect-ratio: 1; border: 1px solid rgba(11,12,11,.35); border-radius: 50%; transform: rotateX(66deg) rotateZ(-24deg); animation: orbit-spin 25s linear infinite; }.contact-orbit::before, .contact-orbit::after { content: ''; position: absolute; inset: 11%; border: 1px solid rgba(11,12,11,.25); border-radius: 50%; }.contact-orbit::after { inset: 33%; border-color: rgba(11,12,11,.45); }.contact-orbit div { position: absolute; width: 9%; aspect-ratio: 1; border-radius: 50%; background: var(--ink); }.contact-orbit div:nth-child(1) { top: 11%; left: 39%; }.contact-orbit div:nth-child(2) { right: 15%; bottom: 25%; background: var(--paper); border: 1px solid var(--ink); }.contact-orbit span { position: absolute; inset: 46%; width: 8%; height: 8%; background: var(--ink); border-radius: 50%; }
.site-footer { padding: 28px var(--pad) 24px; background: var(--ink); color: var(--paper); font-family: var(--mono); font-size: .58rem; letter-spacing: .08em; text-transform: uppercase; }.footer-top, .footer-bottom { display: grid; grid-template-columns: 1fr 1.2fr 1fr; align-items: center; gap: 20px; }.footer-top { padding-bottom: 55px; border-bottom: 1px solid var(--line-dark); }.footer-top p { margin: 0; color: var(--muted-dark); text-align: center; }.footer-top p a { color: var(--paper); text-decoration: none; border-bottom: 1px solid var(--acid); }.footer-top > span { color: var(--muted-dark); text-align: right; }.footer-bottom { padding-top: 19px; color: var(--muted-dark); }.footer-bottom div { display: flex; justify-content: center; gap: 26px; }.footer-wordmark { color: var(--paper); }

.reveal { opacity: 0; transform: translateY(36px); }.reveal.in { opacity: 1; transform: none; transition: opacity .9s var(--ease), transform .9s var(--ease); }.reveal:nth-child(2) { transition-delay: .08s; }.reveal:nth-child(3) { transition-delay: .16s; }
@keyframes object-drift { 0%,100% { transform: rotateX(10deg) rotateY(-19deg) rotateZ(-13deg) translate3d(0,0,0); } 50% { transform: rotateX(15deg) rotateY(-12deg) rotateZ(-10deg) translate3d(8px,-15px,20px); } }
@keyframes orbit-spin { to { transform: rotateX(67deg) rotateZ(374deg); } } @keyframes orbit-spin-reverse { to { transform: rotateX(69deg) rotateZ(-408deg); } } @keyframes glow-breathe { 0%,100% { opacity: .52; transform: scale(.9); } 50% { opacity: 1; transform: scale(1.1); } } @keyframes slow-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-13px); } } @keyframes pulse { 70% { box-shadow: 0 0 0 9px rgba(201,241,81,0); } 100% { box-shadow: 0 0 0 0 rgba(201,241,81,0); } } @keyframes scroll-line { 0%,100% { transform: scaleX(.4); opacity: .4; } 50% { transform: scaleX(1); opacity: 1; } }

@media (max-width: 900px) { .site-header { grid-template-columns: 1fr auto; }.desktop-nav, .header-cta { display: none; }.menu-toggle { display: flex; flex-direction: column; justify-content: center; gap: 6px; width: 42px; height: 42px; padding: 0; border: 0; background: transparent; cursor: pointer; }.menu-toggle span { display: block; width: 25px; height: 1px; background: currentColor; transition: transform .4s var(--ease); }.menu-toggle[aria-expanded='true'] span:first-child { transform: translateY(3.5px) rotate(45deg); }.menu-toggle[aria-expanded='true'] span:last-child { transform: translateY(-3.5px) rotate(-45deg); }.mobile-menu { position: absolute; top: 78px; left: var(--pad); right: var(--pad); flex-direction: column; padding: 20px; background: rgba(11,12,11,.95); border: 1px solid var(--line-dark); }.mobile-menu.open { display: flex; }.mobile-menu a { padding: 12px 0; border-bottom: 1px solid var(--line-dark); font-family: var(--mono); font-size: .7rem; letter-spacing: .1em; text-decoration: none; text-transform: uppercase; }.hero { grid-template-columns: 1fr; padding-top: 150px; }.hero-copy { padding-left: 0; }.hero-stage { position: absolute; inset: 17% -8% 12% 36%; opacity: .72; }.hero-footerline { grid-template-columns: 1fr 1fr; }.hero-footerline span:nth-child(2) { display: none; }.hero-index { grid-column: 2; }.manifesto-bottom { grid-template-columns: 1fr; max-width: 620px; }.work-grid { grid-template-columns: 1fr 1fr; }.work-card-large { grid-column: span 2; }.work-card-large .work-visual { min-height: 520px; }.approach-grid { grid-template-columns: 1fr; gap: 80px; }.approach-sticky { position: static; }.contact-copy, .contact-mail { margin-left: 0; }.contact-orbit { opacity: .45; right: -15%; top: 18%; } }
@media (max-width: 560px) { body { font-size: 15px; }.site-header { padding-top: 19px; padding-bottom: 19px; }.hero { min-height: 820px; padding-top: 145px; }.hero-gridline { inset-inline: 20px; }.hero h1 { font-size: clamp(4rem, 18vw, 6.5rem); }.hero-intro { max-width: 300px; }.hero-stage { inset: 53% -26% 9% 22%; opacity: .55; }.light-object { width: min(57vw, 270px); }.orbit { width: 75vw; }.orbit-two { width: 55vw; }.stage-label { top: 0; right: 10%; }.stage-note { right: -1%; bottom: 16%; }.stage-scroll { left: 22%; bottom: 3%; }.hero-footerline { left: 22px; right: 22px; }.section-meta { font-size: .54rem; }.manifesto, .fields, .work-section, .approach, .contact-section { padding: 75px 22px; }.manifesto-content, .fields-intro, .work-heading { margin-top: 85px; }.display { font-size: clamp(3.2rem, 16vw, 5.5rem); }.manifesto-bottom { margin-top: 75px; }.manifesto-stats { gap: 10px; }.manifesto-stats b { font-size: 2rem; }.manifesto-stats span { font-size: .5rem; line-height: 1.35; }.fields-intro { margin-bottom: 75px; }.field-row { grid-template-columns: 37px 1fr 25px; gap: 14px; min-height: 145px; }.field-row:hover { padding: 0; }.field-row p { font-size: .84rem; line-height: 1.45; }.work-heading { display: block; margin-bottom: 55px; }.work-note { margin: 40px 0 0; }.work-grid { grid-template-columns: 1fr; gap: 45px; }.work-card-large { grid-column: auto; }.work-visual, .work-card-large .work-visual { min-height: 380px; }.approach-grid { margin-top: 85px; }.process-item { grid-template-columns: 34px 1fr 20px; gap: 12px; }.process-item h3 { font-size: 1.65rem; }.process-item p { font-size: .83rem; }.contact-section { min-height: 680px; }.contact-content { padding: 65px 0; }.contact-copy { margin-top: 45px; max-width: 260px; }.contact-mail { gap: 12px; font-size: clamp(1.15rem, 7vw, 2rem); }.contact-orbit { width: 100vw; right: -26%; top: 28%; }.footer-top, .footer-bottom { grid-template-columns: 1fr; gap: 17px; }.footer-top { padding-bottom: 35px; }.footer-top p, .footer-top > span, .footer-bottom div { text-align: left; justify-content: flex-start; }.footer-bottom { padding-top: 22px; }.footer-bottom div { flex-wrap: wrap; gap: 14px 20px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .001ms !important; }.reveal { opacity: 1; transform: none; }.cursor-glow { display: none; } }

.hero-image-frame { position: relative; width: min(45vw, 690px); height: min(69vh, 650px); margin-left: 3vw; overflow: hidden; transform: rotate(1.5deg); box-shadow: 0 36px 90px rgba(0, 0, 0, .32); transition: transform .9s var(--ease); }
.hero-image-frame::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(11,12,11,.18), transparent 45%, rgba(11,12,11,.06)); pointer-events: none; }
.hero-image { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 68% center; filter: saturate(.8) contrast(1.04); transition: transform 1.2s var(--ease), filter 1.2s var(--ease); }
.hero-stage:hover .hero-image-frame { transform: rotate(0deg) translateY(-6px); }
.hero-stage:hover .hero-image { transform: scale(1.035); filter: saturate(.98) contrast(1.04); }
.work-image { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; filter: saturate(.75) contrast(1.03); transition: transform 1.1s var(--ease), filter 1.1s var(--ease); }
.visual-nordlicht .work-image { object-position: 73% center; }.visual-kiesel .work-image { object-position: 55% center; filter: saturate(.65) sepia(.08) contrast(1.06); }.visual-atelier .work-image { object-position: 35% center; filter: saturate(.55) contrast(1.08); }.work-card:hover .work-image { transform: scale(1.04); filter: saturate(.95) contrast(1.05); }
@media (max-width: 560px) { .hero-image-frame { width: min(78vw, 370px); height: min(48svh, 360px); margin-left: 0; transform: rotate(1deg); } .hero-image { object-position: 72% center; } }

/* Floating studio index: the navigation stays present without flattening the page. */
.site-header { inset: 20px var(--pad) auto; padding: 16px 22px; border: 1px solid rgba(223, 230, 215, .15); border-radius: 999px; background: rgba(11, 12, 11, .68); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }
.site-header.scrolled { inset: 12px var(--pad) auto; padding: 16px 22px; border-bottom: 1px solid rgba(223, 230, 215, .15); background: rgba(11, 12, 11, .88); }
@media (max-width: 560px) { .site-header, .site-header.scrolled { inset: 14px 14px auto; padding: 13px 17px; } }