:root { --paper:#f4f4f1; --ink:#090909; --muted:#ededeb; --mono:'DM Mono',monospace; --sans:'DM Sans',Arial,sans-serif; --serif:'Playfair Display',Georgia,serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:var(--sans); overflow-x:hidden; }
a { color:inherit; text-decoration:none; }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

.site-header { position:fixed; inset:0 0 auto; z-index:20; display:flex; align-items:flex-start; justify-content:space-between; height:5rem; padding:1.2rem 2.55vw 0; pointer-events:none; }
.site-header::before { content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(to bottom,rgba(244,244,241,.92),rgba(244,244,241,0)); }
.brand-logo,.desktop-nav,.menu-toggle,.mobile-menu { pointer-events:auto; }
.brand-logo { display:block; width:10rem; height:2.35rem; overflow:hidden; }
.brand-logo img,.footer-logo img { display:block; width:100%; height:100%; object-fit:contain; object-position:left center; }
.desktop-nav { display:flex; align-items:center; gap:1.65rem; font-size:clamp(1.45rem,2.45vw,2.7rem); line-height:.9; letter-spacing:-.075em; }
.desktop-nav a { transition:opacity .2s ease; }.desktop-nav a:hover { opacity:.45; }
.search-mark { position:relative; display:block; width:1.15rem; height:1.15rem; margin-left:-.65rem; border:1.5px solid var(--ink); border-radius:50%; }
.search-mark::after { content:''; position:absolute; width:.68rem; height:1.5px; right:-.47rem; bottom:-.24rem; background:var(--ink); transform:rotate(-48deg); transform-origin:left center; }
.menu-toggle,.mobile-menu { display:none; }

.opening { position:relative; min-height:calc(100svh - 5rem); background:var(--paper); overflow:hidden; }
.opening-logo { position:absolute; top:1.25rem; left:2.4vw; width:min(31vw,25rem); height:17rem; object-fit:contain; object-position:left top; }
.loading-dot { position:absolute; top:50%; left:50%; width:1.25rem; height:1.25rem; border-radius:50%; background:#606060; transform:translate(-50%,-50%); animation:heartbeat 1.7s ease-in-out infinite; }
@keyframes heartbeat { 0%,100% { transform:translate(-50%,-50%) scale(1); } 50% { transform:translate(-50%,-50%) scale(.76); } }
.section-strip { display:flex; align-items:center; min-height:5.2rem; padding:1rem 2.55vw; background:var(--muted); }
.section-strip p { margin:0; font-size:clamp(2rem,3.4vw,3.8rem); letter-spacing:-.055em; line-height:.9; word-spacing:.08em; }

.work { background:var(--paper); }
.case { background:var(--paper); }
.case-media { position:relative; height:72svh; min-height:31rem; overflow:hidden; isolation:isolate; }
.case-caption { display:flex; align-items:center; justify-content:space-between; gap:1.5rem; min-height:5.2rem; padding:.9rem 2.55vw; background:var(--paper); font-family:var(--mono); font-size:clamp(.7rem,1.15vw,1rem); text-transform:uppercase; }
.case-name { font-family:var(--sans); font-size:clamp(1.7rem,3vw,3.5rem); font-weight:500; letter-spacing:-.075em; text-transform:none; }
.case-discipline { text-align:right; }
.case-link:hover .case-media > * { transform:scale(1.035); }
.case-media > * { transition:transform .75s cubic-bezier(.2,.8,.2,1); }

.case-morrow .case-media { background:#d0ccc3; }
.case-morrow img { display:block; width:100%; height:100%; object-fit:cover; filter:grayscale(1) contrast(1.2); }
.case-morrow .case-media::after { content:''; position:absolute; inset:0; z-index:1; background:linear-gradient(120deg,rgba(0,0,0,.18),rgba(255,255,255,.03) 55%,rgba(255,255,255,.25)); mix-blend-mode:overlay; }
.morrow-title { position:absolute; z-index:2; top:11%; left:4.2%; color:#fff; font-size:clamp(4rem,11vw,12rem); font-weight:600; letter-spacing:-.11em; line-height:.7; }

.case-lumen .case-media { display:grid; place-items:center; background:#21275a; color:#f9ca67; }
.case-lumen .case-media::before { content:''; position:absolute; inset:7%; border:1px solid rgba(249,202,103,.58); border-radius:50%; transform:scaleX(.62); }
.case-lumen strong { position:relative; z-index:3; font-family:var(--serif); font-size:clamp(6rem,14vw,18rem); font-weight:500; letter-spacing:-.1em; }
.case-lumen p { position:absolute; z-index:3; right:9%; bottom:11%; margin:0; text-align:right; font-family:var(--mono); font-size:clamp(.75rem,1.35vw,1.15rem); line-height:1.25; text-transform:uppercase; }
.lumen-orbit { position:absolute; border:1px solid rgba(249,202,103,.8); border-radius:50%; }.orbit-a { width:45vw; height:45vw; left:-13vw; top:-22vw; }.orbit-b { width:27vw; height:27vw; right:-4vw; bottom:-12vw; }
.lumen-star { position:absolute; z-index:3; font-size:clamp(2.4rem,5vw,6rem); }.star-a { top:15%; left:15%; }.star-b { right:14%; bottom:18%; }

.case-form .case-media { background:#e45843; color:#0d0d0d; }
.case-form p { position:absolute; z-index:2; top:11%; left:8%; margin:0; font-family:var(--mono); font-size:clamp(.8rem,1.35vw,1.2rem); line-height:1.2; text-transform:uppercase; }
.case-form strong { position:absolute; z-index:2; left:4%; bottom:6%; font-size:clamp(8rem,23vw,29rem); font-weight:600; line-height:.62; letter-spacing:-.145em; }
.form-bar { position:absolute; display:block; width:130%; height:2px; left:-15%; background:var(--ink); transform:rotate(-31deg); }.bar-one { top:22%; }.bar-two { top:42%; }.bar-three { top:62%; }.bar-four { top:82%; }

.case-orbit .case-media { background:#101010; color:#f5f5f2; }
.case-orbit strong { position:absolute; z-index:1; top:7%; left:27%; font-family:var(--serif); font-size:clamp(21rem,54vw,58rem); font-weight:500; line-height:.77; }
.orbit-ring { position:absolute; z-index:2; top:13%; left:15%; width:70%; aspect-ratio:1; border:1px solid #f5f5f2; border-radius:50%; transform:scaleX(.46); }
.orbit-dot { position:absolute; z-index:3; top:49%; left:50%; width:4.5%; aspect-ratio:1; border-radius:50%; background:#f5f5f2; }
.orbit-label { position:absolute; z-index:3; left:8%; bottom:9%; font-family:var(--mono); font-size:clamp(.8rem,1.35vw,1.2rem); line-height:1.2; text-transform:uppercase; }

.case-rabbit .case-media { display:flex; align-items:center; justify-content:center; background:#e5e5df; }
.case-rabbit .case-media::before { content:''; position:absolute; width:82%; height:1px; background:var(--ink); }
.case-rabbit img { position:relative; z-index:2; width:min(30vw,31rem); height:auto; border-radius:21%; box-shadow:0 0 0 1px rgba(0,0,0,.18); }
.case-rabbit p { position:absolute; z-index:3; right:6%; bottom:11%; margin:0; font-family:var(--serif); font-size:clamp(2.5rem,5vw,6rem); letter-spacing:-.075em; }

.home-wheel { position:fixed; z-index:19; right:2.25vw; bottom:1.6rem; display:block; width:10rem; height:10rem; opacity:0; pointer-events:none; transition:opacity .3s ease; }
.home-wheel.is-visible { opacity:1; pointer-events:auto; }.home-wheel:hover svg { transform:rotate(32deg); }
.home-wheel svg { display:block; width:100%; height:100%; overflow:visible; transition:transform .45s ease; }.home-wheel text { font-family:var(--sans); font-size:16px; letter-spacing:1px; }.home-wheel circle { fill:var(--ink); }

.info { padding:13vw 5.2vw 14vw; background:#111; color:#f4f4f1; }
.info-statement { max-width:65rem; margin:0; font-size:clamp(3.1rem,7vw,9rem); letter-spacing:-.09em; line-height:.87; }
.info-columns { display:grid; grid-template-columns:1fr 1fr; gap:12vw; max-width:70rem; margin:8vw 0 0 auto; font-size:clamp(1rem,1.55vw,1.7rem); line-height:1.2; letter-spacing:-.04em; }.info-columns p { margin:0; }.info-columns ul { margin:0; padding:0; list-style:none; font-family:var(--mono); font-size:clamp(.72rem,1vw,.95rem); text-transform:uppercase; }.info-columns li + li { margin-top:.42rem; }

.contact { padding:2.3rem 2.55vw 0; background:var(--paper); }.contact > p { margin:0; font-family:var(--mono); font-size:.72rem; text-transform:uppercase; }.contact-link { display:inline-block; margin:9vw 0 12vw; font-size:clamp(5rem,15vw,19rem); line-height:.74; letter-spacing:-.105em; }.contact-link em { font-family:var(--serif); font-weight:500; }.contact-link span { display:inline-block; margin-left:.16em; font-family:var(--sans); font-size:.36em; vertical-align:top; transition:transform .3s ease; }.contact-link:hover span { transform:translate(.18em,-.18em); }
.site-footer { display:grid; grid-template-columns:2fr 1.15fr 1fr 1fr; gap:1rem; align-items:start; padding:1.2rem 0 1.5rem; border-top:1px solid var(--ink); font-family:var(--mono); font-size:.63rem; text-transform:uppercase; }.site-footer a:not(.footer-logo):hover { opacity:.45; }.footer-logo { display:block; width:10rem; height:2.5rem; overflow:hidden; }.site-footer p { margin:0; text-align:right; }

@media (max-width:720px) {
  .site-header { height:4rem; padding:1rem 1.1rem 0; }.brand-logo { width:8rem; height:2rem; }.desktop-nav { display:none; }.menu-toggle { display:grid; gap:5px; margin-top:.25rem; padding:.35rem 0 .35rem .8rem; border:0; background:none; }.menu-toggle span:not(.sr-only) { display:block; width:25px; height:1px; background:var(--ink); transition:transform .25s ease; }.menu-toggle[aria-expanded='true'] span:first-child { transform:translateY(3px) rotate(45deg); }.menu-toggle[aria-expanded='true'] span:nth-child(2) { transform:translateY(-3px) rotate(-45deg); }.mobile-menu { position:absolute; top:4rem; right:0; left:0; display:none; padding:1rem 1.1rem 1.4rem; background:var(--paper); border-top:1px solid rgba(0,0,0,.15); border-bottom:1px solid rgba(0,0,0,.15); font-size:2rem; letter-spacing:-.07em; }.mobile-menu:not([hidden]) { display:grid; gap:.55rem; }
  .opening { min-height:calc(100svh - 4rem); }.opening-logo { top:1.1rem; left:1.1rem; width:17rem; height:10rem; }.loading-dot { width:1rem; height:1rem; }.section-strip { min-height:4.6rem; padding:1rem 1.1rem; }.section-strip p { font-size:2rem; }
  .case-media { height:65svh; min-height:26rem; }.case-caption { min-height:4.5rem; padding:.75rem 1.1rem; }.case-name { font-size:1.65rem; }.case-discipline { display:none; }.case-lumen strong { font-size:7rem; }.lumen-orbit { width:90vw; height:90vw; }.case-form strong { font-size:10rem; }.case-orbit strong { font-size:25rem; left:12%; }.case-rabbit img { width:60vw; }.case-rabbit p { font-size:2.5rem; right:7%; }.home-wheel { right:1rem; bottom:1rem; width:6rem; height:6rem; }.home-wheel text { font-size:23px; }.info { padding:5rem 1.1rem 6rem; }.info-statement { font-size:clamp(3rem,13vw,5rem); }.info-columns { display:block; margin:3.5rem 0 0; }.info-columns ul { margin-top:4rem; }.contact { padding:1.4rem 1.1rem 0; }.contact-link { margin:5rem 0 7rem; font-size:clamp(4rem,18vw,7rem); }.site-footer { grid-template-columns:1fr 1fr; gap:1.8rem .8rem; font-size:.52rem; }.footer-logo { grid-column:span 2; width:9rem; height:2.3rem; }.site-footer p { text-align:left; }
}
