.st-sec{padding:clamp(64px,9vw,120px) 0;border-top:1px solid var(--line)}
.st-sec h2{font-family:"Cormorant Garamond",serif;font-weight:500;font-size:clamp(32px,4vw,52px);line-height:1.05;margin:10px 0 18px;max-width:18ch}
.st-sec p.lede{font-size:clamp(17px,1.5vw,20px);line-height:1.6;max-width:62ch;opacity:.86}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,3vw,40px);margin-top:clamp(28px,4vw,48px)}
.step{border-top:1px solid var(--line);padding-top:18px}
.step .k{font-family:"Space Mono",monospace;font-size:12px;letter-spacing:.16em;text-transform:uppercase;opacity:.7}
.step h3{font-family:"Cormorant Garamond",serif;font-weight:500;font-size:clamp(26px,2.6vw,34px);margin:10px 0 10px}
.step p{line-height:1.6;opacity:.85}
.q{font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:500;font-size:clamp(30px,4.2vw,58px);line-height:1.12;max-width:22ch}
.names{display:flex;flex-wrap:wrap;gap:10px 28px;margin-top:22px;font-family:"Cormorant Garamond",serif;font-size:clamp(20px,2vw,26px);opacity:.9}
.work-g{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,28px);margin-top:clamp(28px,4vw,44px)}
.wk{display:block;color:inherit;text-decoration:none}
.wk img{width:100%;aspect-ratio:4/5;object-fit:cover;display:block;filter:saturate(.9)}
.wk .k{display:block;font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;opacity:.7;margin-top:14px}
.wk .t{display:block;font-family:"Cormorant Garamond",serif;font-size:clamp(24px,2.2vw,30px);margin-top:6px}
.wk .p{display:block;line-height:1.55;opacity:.82;margin-top:8px}
.case{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(20px,4vw,56px);align-items:center;padding:clamp(40px,6vw,80px) 0;border-top:1px solid var(--line)}
.case img{width:100%;aspect-ratio:3/2;object-fit:cover;display:block}
.case h3{font-family:"Cormorant Garamond",serif;font-weight:500;font-size:clamp(30px,3.2vw,44px);margin:8px 0 12px}
.case p{line-height:1.65;opacity:.86;max-width:52ch}
.page-h{padding:clamp(140px,16vw,200px) 0 clamp(20px,3vw,40px)}
.proj .case:nth-child(even) img{order:2}
.clients{columns:3;column-gap:28px;margin-top:22px;font-family:"Cormorant Garamond",serif;font-size:clamp(20px,2vw,26px);line-height:1.5}
.list{margin-top:22px;border-top:1px solid var(--line)}.list div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:24px;padding:18px 0;border-bottom:1px solid var(--line)}.list b{font-family:"Cormorant Garamond",serif;font-weight:500;font-size:clamp(22px,2vw,28px)}.list p{line-height:1.6;opacity:.85}
@media(max-width:800px){.clients{columns:2}.list div{grid-template-columns:1fr;gap:6px}.proj .case:nth-child(even) img{order:0}}
.page-h h1{font-family:"Cormorant Garamond",serif;font-weight:500;font-size:clamp(44px,6vw,84px);line-height:1;max-width:16ch;margin-top:12px}
@media(max-width:800px){.steps,.work-g{grid-template-columns:1fr}.case{grid-template-columns:1fr}}

/* ---- full tilt ---- */
.ideas-g{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(16px,2.6vw,32px);margin-top:clamp(28px,4vw,48px)}
.idea{display:block;color:inherit;text-decoration:none;border-top:1px solid var(--line);padding:22px 0 8px;transition:opacity .3s}
.idea:hover{opacity:.75}
.idea .n{font-family:"Anton",sans-serif;font-size:clamp(34px,4vw,52px);line-height:1;color:transparent;-webkit-text-stroke:1px rgba(236,228,214,.35)}
.idea h3{font-family:"Cormorant Garamond",serif;font-weight:500;font-size:clamp(28px,2.8vw,40px);line-height:1.05;margin:12px 0 10px;color:#f3ece0}
.idea p{line-height:1.6;opacity:.82;max-width:46ch}
.idea .go{display:inline-block;margin-top:14px;font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#d9a483}
.essay{padding:clamp(56px,8vw,110px) 0;border-top:1px solid var(--line)}
.essay .n{font-family:"Anton",sans-serif;font-size:clamp(70px,10vw,150px);line-height:.85;color:transparent;-webkit-text-stroke:1px rgba(236,228,214,.28)}
.essay h2{font-family:"Cormorant Garamond",serif;font-weight:500;font-size:clamp(40px,5.4vw,78px);line-height:1;margin:18px 0 14px;max-width:16ch;color:#f3ece0}
.essay .dek{font-family:"Cormorant Garamond",serif;font-style:italic;font-size:clamp(22px,2.2vw,30px);line-height:1.3;max-width:34ch;opacity:.9}
.essay .body{margin-top:clamp(22px,3vw,36px);max-width:62ch}
.essay .body p{font-size:clamp(16px,1.3vw,19px);line-height:1.75;opacity:.86;margin-bottom:1.1em}
.essay .src{font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.08em;opacity:.55;margin-top:10px}
.work-h{padding:clamp(80px,12vw,150px) 0 clamp(30px,5vw,60px);background:#07070a}
.work-h h2{font-family:"Cormorant Garamond",serif;font-weight:500;font-size:clamp(40px,5.4vw,78px);line-height:1;max-width:16ch;color:#f3ece0;margin-top:14px}
.work-h p{margin-top:18px;max-width:52ch;line-height:1.7;opacity:.82}
@media(max-width:800px){.ideas-g{grid-template-columns:1fr}}
@media(max-width:560px){.navlinks a[href="how.html"]{display:none}}

.navlinks a{white-space:nowrap}
@media(max-width:560px){.navlinks{gap:14px!important}.navlinks a{font-size:10px!important;letter-spacing:.14em!important}.nav .nm{font-size:15px}.navlinks a[href="index.html#projects"]{display:none}.reel{display:none}}
.fx-grain{position:fixed;inset:-50%;z-index:90;pointer-events:none;opacity:.07;mix-blend-mode:overlay;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");animation:grain 1.2s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-3%)}60%{transform:translate(-2%,-1%)}80%{transform:translate(3%,3%)}100%{transform:translate(0,0)}}
.fx-vig{position:fixed;inset:0;z-index:89;pointer-events:none;background:radial-gradient(ellipse at center,transparent 55%,rgba(0,0,0,.55) 100%)}
.house-t span{display:block;opacity:0;transform:translateY(24px);filter:blur(8px);animation:rise 1.8s cubic-bezier(.2,.7,.1,1) forwards}
.house-t span:nth-child(2){animation-delay:.7s}
@keyframes rise{to{opacity:1;transform:none;filter:none}}
.manifesto{min-height:100svh;display:flex;align-items:center;background:#07070a;position:relative;padding:clamp(110px,14vh,150px) 0 clamp(60px,10vh,110px)}
.manifesto #mf{font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:400;font-size:clamp(34px,5.4vw,84px);line-height:1.08;max-width:17ch;color:var(--cream)}
.manifesto #mf .w{opacity:.16;transition:opacity .9s ease}
.manifesto #mf .w.on{opacity:1}
.manifesto .sm{font-family:"Inter",sans-serif;font-style:normal;margin-top:clamp(28px,4vh,44px);max-width:52ch;font-size:clamp(16px,1.3vw,18px);line-height:1.7;color:#bdb5a8}
.scene{position:relative;height:130svh}
.scene-in{position:sticky;top:0;height:100svh;overflow:hidden;background:#000}
.scene-img{position:absolute;inset:-6%;width:112%;height:112%;object-fit:cover;transform:scale(var(--z,1.18));filter:brightness(.62) saturate(.82) contrast(1.08);transition:filter 1.6s ease;will-change:transform;clip-path:inset(var(--c,12%) 0 var(--c,12%) 0)}
.scene.lit .scene-img{filter:brightness(.8) saturate(.92) contrast(1.06)}
.scene-sh{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.55) 0%,transparent 28%,transparent 45%,rgba(0,0,0,.88) 100%)}
.scene-n{position:absolute;right:clamp(16px,4vw,56px);top:clamp(80px,12vh,120px);font-family:"Anton",sans-serif;font-size:clamp(120px,22vw,340px);line-height:.8;color:transparent;-webkit-text-stroke:1px rgba(236,228,214,.28);letter-spacing:-.02em;transform:translateY(calc(var(--p,0)*-60px))}
.scene-tx{position:absolute;left:0;right:0;bottom:0;padding:0 clamp(22px,5vw,56px) clamp(56px,12vh,120px);max-width:1180px}
.scene-tx>*{opacity:0;transform:translateY(30px);transition:opacity 1.2s ease,transform 1.2s cubic-bezier(.2,.7,.1,1)}
.scene.lit .scene-tx>*{opacity:1;transform:none}
.scene.lit .scene-tx>*:nth-child(2){transition-delay:.18s}.scene.lit .scene-tx>*:nth-child(3){transition-delay:.36s}
.scene-tx .eyebrow{color:#d9a483}
.scene-tx h3{font-family:"Cormorant Garamond",serif;font-weight:500;font-size:clamp(44px,7vw,112px);line-height:.95;margin:14px 0 18px;max-width:14ch;color:#f3ece0;text-shadow:0 2px 40px rgba(0,0,0,.5)}
.scene-tx p{max-width:50ch;line-height:1.7;font-size:clamp(15px,1.25vw,18px);color:#d6cfc2}
.reel{position:fixed;right:clamp(14px,2vw,28px);top:50%;transform:translateY(-50%);z-index:55;font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.22em;color:#d6cfc2;writing-mode:vertical-rl;opacity:0;transition:opacity .6s}
.reel.on{opacity:.75}
.marq{overflow:hidden;padding:clamp(40px,7vw,90px) 0;background:#07070a;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.marq-t{display:flex;gap:56px;width:max-content;animation:marq 48s linear infinite;font-family:"Cormorant Garamond",serif;font-style:italic;font-size:clamp(36px,5vw,72px);color:#e9e1d3;white-space:nowrap;align-items:center}
.marq-t img{height:.6em;opacity:.8}
@keyframes marq{to{transform:translateX(-50%)}}
.finale{position:relative;min-height:100svh;display:flex;align-items:center;overflow:hidden;background:#000}
.finale img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.55) saturate(.75);animation:house-drift 40s ease-out both}
.finale .wrap{position:relative;z-index:2}
.finale .q{color:#f3ece0;max-width:18ch;font-size:clamp(40px,6vw,96px)}
.lbl{display:block;margin-bottom:clamp(20px,3vh,32px)}
@media (prefers-reduced-motion:reduce){.fx-grain,.marq-t,.finale img{animation:none}.scene{height:auto}.scene-in{position:relative}.scene-img{transform:none;clip-path:none}.scene-tx>*{opacity:1;transform:none}.house-t span{animation:none;opacity:1;transform:none;filter:none}.manifesto #mf .w{opacity:1}}

.method{background:#0b0a08;padding:clamp(80px,12vw,150px) 0;border-top:1px solid var(--line)}
.method h2{font-family:"Cormorant Garamond",serif;font-weight:500;font-size:clamp(40px,5.4vw,78px);line-height:1;color:#f3ece0;margin-top:14px;max-width:16ch}
.method-g{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,3vw,40px);margin-top:clamp(36px,5vw,64px)}
.mcard img{width:100%;aspect-ratio:3/2;object-fit:cover;display:block;filter:sepia(.25) contrast(1.02) brightness(.92)}
.mcard .k{display:block;font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#d9a483;margin-top:18px}
.mcard h3{font-family:"Cormorant Garamond",serif;font-weight:500;font-size:clamp(26px,2.4vw,34px);margin:8px 0 8px;color:#f3ece0}
.mcard p{line-height:1.6;opacity:.82;max-width:34ch}
.twohundred{padding:clamp(70px,10vw,130px) 0;background:#07070a;border-top:1px solid var(--line);text-align:left}
.twohundred p.big{font-family:"Cormorant Garamond",serif;font-style:italic;font-size:clamp(40px,6vw,96px);line-height:1;color:#f3ece0;max-width:16ch}
.twohundred .links{margin-top:28px;display:flex;gap:28px;flex-wrap:wrap}
.twohundred .links a,.quiet a{font-family:"Space Mono",monospace;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:#d9a483;text-decoration:none}
.collab{columns:2;column-gap:40px;margin-top:22px;line-height:2}

@media(max-width:800px){.method-g{grid-template-columns:1fr}.gloss div{grid-template-columns:1fr;gap:6px}.collab{columns:1}}

/* ---- studio: another wing of the house ---- */
.s-hero{position:relative;height:100vh;height:100svh;min-height:520px;overflow:hidden;background:#050403}
.s-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:45% 50%;opacity:0;filter:brightness(.82) contrast(1.06) saturate(.95);animation:house-up 3.2s ease-out .2s forwards,house-drift 40s ease-out .2s both}
.s-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,4,3,.6) 0%,rgba(5,4,3,0) 26%,rgba(5,4,3,.08) 52%,rgba(5,4,3,.9) 100%);pointer-events:none}
.s-hero-tx{position:absolute;left:0;right:0;bottom:clamp(48px,11vh,120px);z-index:3}
.s-hero .eyebrow{color:#d9a483;opacity:0;animation:house-up 1.4s ease-out .8s forwards}
.s-hero h1{font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:400;font-size:clamp(54px,9.4vw,152px);line-height:.94;color:#f4ede2;margin-top:18px;text-shadow:0 2px 40px rgba(0,0,0,.5)}
.s-hero h1 span{display:block;opacity:0;transform:translateY(24px);filter:blur(8px);animation:rise 1.8s cubic-bezier(.2,.7,.1,1) 1.2s forwards}
.s-hero h1 span+span{animation-delay:1.9s}
.mono{font-family:"Space Mono",monospace;font-size:clamp(11px,.9vw,13px);letter-spacing:.06em;line-height:1.75;color:#cfc6b8;max-width:46ch}
/* one taste, many rooms: a single drawing deals itself into three */
.fan{--cw:clamp(220px,28vw,420px);--sp:calc(var(--cw) * 1.06);position:relative;height:300vh;background:#0b0a08;border-top:1px solid var(--line)}
.fan-st{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
.fan-k{position:absolute;top:clamp(84px,13vh,128px);left:0;right:0}
.fan-cs{position:absolute;inset:0}
.fan-c{position:absolute;left:50%;top:42%;width:var(--cw);aspect-ratio:4/3;margin:calc(var(--cw) * -.375) 0 0 calc(var(--cw) * -.5);box-shadow:0 30px 80px rgba(0,0,0,.65);will-change:transform}
.fan-c:nth-child(2){z-index:2}
.fan-c img{width:100%;height:100%;object-fit:cover;display:block;filter:sepia(.18) brightness(.93)}
.fan-tx{position:absolute;left:0;right:0;bottom:clamp(36px,8vh,96px)}
.fan-l{font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:400;font-size:clamp(34px,4.4vw,68px);line-height:1.04;color:#f3ece0;display:flex;flex-wrap:wrap;column-gap:.32em}
.fan-l span{opacity:.14;transition:opacity 1s ease}
.fan-l span.on{opacity:1}
.fan-tx .mono{margin-top:14px}
@media(max-width:760px){.fan{--cw:60vw;--sp:19vw}.fan-l{flex-direction:column}}
.fan:not(.go){height:auto;padding:clamp(90px,12vw,150px) 0}
.fan:not(.go) .fan-st{position:relative;height:auto;overflow:visible}
.fan:not(.go) .fan-k,.fan:not(.go) .fan-tx,.fan:not(.go) .fan-cs{position:relative;inset:auto;top:auto;bottom:auto}
.fan:not(.go) .fan-cs{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:1180px;margin:40px auto;padding:0 clamp(22px,5vw,56px)}
.fan:not(.go) .fan-c{position:relative;left:auto;top:auto;margin:0;width:auto}
.fan:not(.go) .fan-l span{opacity:1}
@media(max-width:760px){.fan:not(.go) .fan-cs{grid-template-columns:1fr}}
/* the walk: scrolling down moves you along the street */
.walk{position:relative;background:#07070a;border-top:1px solid var(--line)}
.walk-st{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
.walk-k{position:absolute;top:clamp(84px,13vh,128px);left:0;right:0}
.walk-tr{position:absolute;left:0;top:0;bottom:0;display:flex;align-items:center;gap:clamp(36px,6vw,110px);padding:clamp(60px,10vh,90px) clamp(22px,6vw,96px) 0;will-change:transform}
.walk-f{flex:none;margin:0}
.walk-f img{display:block;height:min(54vh,52vw);width:auto;filter:brightness(.9) saturate(.9)}
.walk-f figcaption{width:0;min-width:100%;margin-top:14px;font-family:"Space Mono",monospace;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:#d9a483;line-height:1.6}
.walk-f figcaption b{display:block;margin-top:6px;font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:400;font-size:clamp(19px,1.7vw,25px);letter-spacing:0;text-transform:none;line-height:1.2;color:#efe7da}
.walk-t{flex:none;width:min(78vw,16ch);font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:400;font-size:clamp(34px,4.4vw,68px);line-height:1.04;color:#f3ece0}
.walk-t.s{width:min(78vw,24ch);font-size:clamp(24px,2.6vw,38px);line-height:1.2;color:#d8cfc2}
.walk:not(.go) .walk-st{position:relative;height:auto;overflow:visible;padding:clamp(90px,12vw,150px) 0 40px}
.walk:not(.go) .walk-k{position:relative;top:auto}
.walk:not(.go) .walk-tr{position:relative;overflow-x:auto;padding-top:40px;padding-bottom:30px;align-items:flex-end}
.s-after{background:#07070a;padding:0 0 clamp(90px,12vw,150px)}
.s-after .mono{max-width:52ch}
.s-after .quiet{margin-top:24px}
/* company kept */
.co{padding:clamp(110px,16vw,210px) 0;background:#050403;border-top:1px solid var(--line)}
.co-n{list-style:none;margin:clamp(28px,4vw,48px) 0 0;padding:0}
.co-n li{font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:400;font-size:clamp(34px,5.4vw,84px);line-height:1.12;color:#efe7da;opacity:.12;transition:opacity 1.4s ease}
.co.lit .co-n li{opacity:1}
.co.lit .co-n li:nth-child(2){transition-delay:.35s}.co.lit .co-n li:nth-child(3){transition-delay:.7s}.co.lit .co-n li:nth-child(4){transition-delay:1.05s}
.co .mono{margin-top:clamp(28px,4vw,44px)}
.co .team{margin-top:clamp(48px,7vw,90px);font-size:clamp(17px,1.5vw,20px);line-height:1.65;max-width:46ch;color:#bdb5a8}
/* commissions: a cool room, one warm lamp */
.finale.s-fin img{filter:brightness(.62) saturate(.85);object-position:60% 50%}
.finale.s-fin::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(5,4,3,.72) 0%,rgba(5,4,3,.35) 45%,rgba(5,4,3,0) 75%);pointer-events:none}
@media(orientation:portrait){.finale.s-fin::after{background:linear-gradient(180deg,rgba(5,4,3,.2),rgba(5,4,3,.75))}}
.finale.s-fin .q{max-width:14ch}
.finale.s-fin .sm{margin-top:clamp(22px,3vh,32px);max-width:40ch;font-size:clamp(16px,1.3vw,18px);line-height:1.7;color:#d6cfc2}
.finale.s-fin .mono{margin-top:16px;color:#bdb5a8}
/* Wildcat: the last room, walking toward the one lit door */
.wc{position:relative;height:190vh;background:#04070a}
.wc-st{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
.wc img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform-origin:33% 46%;filter:brightness(calc(.7 + var(--p,1) * .2)) saturate(.95)}
.wc.go img{transform:scale(calc(1 + var(--p,0) * .32))}
.wc-st::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(4,7,10,.45),rgba(4,7,10,0) 30%,rgba(4,7,10,.15) 55%,rgba(4,7,10,.88));pointer-events:none}
.wc-tx{position:absolute;right:clamp(22px,6vw,96px);bottom:clamp(48px,11vh,120px);z-index:3;max-width:34ch;opacity:calc(var(--p,1) * 2.6 - .45)}
.wc-tx h2{font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:400;font-size:clamp(64px,10vw,168px);line-height:.9;color:#f4ede2;margin:14px 0 18px;text-shadow:0 2px 40px rgba(0,0,0,.45)}
.wc-tx .eyebrow{color:#d9a483}
.wc-tx .quiet{margin-top:22px}
.wc:not(.go){height:auto}
.wc:not(.go) .wc-st{position:relative}
@media(orientation:portrait){.wc img{object-position:0 50%;transform-origin:8% 56%}.wc-tx{left:clamp(22px,6vw,96px);right:clamp(22px,6vw,96px)}}
@media (prefers-reduced-motion:reduce){.s-hero img,.s-hero .eyebrow{animation:none;opacity:1}.s-hero h1 span{animation:none;opacity:1;transform:none;filter:none}.co-n li{opacity:1;transition:none}.fan-l span{opacity:1}}

/* ---- point of view: three lines, no pictures ---- */
.pov{padding:clamp(80px,11vw,140px) 0;background:#0b0a08;border-top:1px solid var(--line)}
.pov-l{list-style:none;margin:clamp(28px,4vw,48px) 0 0;padding:0;counter-reset:p}
.pov-l li{font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:400;font-size:clamp(28px,3.6vw,54px);line-height:1.12;color:#efe7da;padding:clamp(18px,2.4vw,30px) 0;border-top:1px solid var(--line);max-width:24ch}
.pov-l li::before{counter-increment:p;content:counter(p,upper-roman);display:block;font-family:"Space Mono",monospace;font-style:normal;font-size:11px;letter-spacing:.2em;color:#d9a483;margin-bottom:10px}
/* collaborators: a plain list */
.co-n li{opacity:1;transition:none}
#mf{font-size:clamp(26px,3.3vw,50px);line-height:1.18}

/* ---- candidate page: daylight ---- */
body.day{background:#f1ece3;color:#2a2622}
body.day .nav .nm,body.day .navlinks a{color:#2a2622}
body.day .nav.solid{background:rgba(241,236,227,.94);border-bottom:1px solid rgba(42,38,34,.12)}
body.day .mark{filter:none}
body.day .eyebrow{color:#9a4f2c}
.cv-h{padding:clamp(140px,20vh,220px) 0 clamp(48px,7vw,90px)}
.cv-h h1{font-family:"Cormorant Garamond",serif;font-weight:400;font-size:clamp(52px,8vw,124px);line-height:.96;color:#1d1a17;margin:16px 0 18px}
.cv-l{font-family:"Cormorant Garamond",serif;font-style:italic;font-size:clamp(24px,2.6vw,38px);line-height:1.2;color:#3a342e}
.cv-s{margin-top:18px;max-width:48ch;font-size:clamp(16px,1.3vw,19px);line-height:1.65;color:#4a433c}
.cv-a{margin-top:26px;display:flex;flex-wrap:wrap;gap:22px}
.cv-a a{font-family:"Space Mono",monospace;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:#9a4f2c;text-decoration:none;border-bottom:1px solid rgba(154,79,44,.3)}
.cv-img img{display:block;width:100%;height:clamp(260px,56vh,640px);object-fit:cover;filter:saturate(.9)}
.cv-f{padding:clamp(56px,8vw,100px) 0;border-bottom:1px solid rgba(42,38,34,.14)}
.cv-f dl{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,3vw,44px);margin:0}
.cv-f dt{font-family:"Cormorant Garamond",serif;font-size:clamp(40px,4.6vw,70px);line-height:1;color:#1d1a17}
.cv-f dd{margin:10px 0 0;font-size:15px;line-height:1.55;color:#4a433c;max-width:24ch}
.cv-w,.cv-e{padding:clamp(56px,8vw,100px) 0;border-bottom:1px solid rgba(42,38,34,.14)}
.cv-w ul{list-style:none;margin:28px 0 0;padding:0}
.cv-w li{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:24px;padding:22px 0;border-top:1px solid rgba(42,38,34,.12)}
.cv-w li b{font-family:"Space Mono",monospace;font-weight:400;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#2a2622;line-height:1.6}
.cv-w li span{font-size:clamp(16px,1.25vw,18px);line-height:1.65;color:#3a342e}
.cv-e p{margin-top:18px;max-width:62ch;font-size:clamp(16px,1.25vw,18px);line-height:1.7;color:#3a342e}
body.day .foot{background:#e8e2d7;color:#2a2622;border-top:1px solid rgba(42,38,34,.12)}
body.day .foot a,body.day .foot .fb-nm,body.day .foot .foot-tag,body.day .foot .meta{color:#2a2622}
@media(max-width:800px){.cv-f dl{grid-template-columns:1fr 1fr}.cv-w li{grid-template-columns:1fr;gap:8px}}
/* the studio line, on the first screen */
.house-t span.ln{max-width:30ch;margin:.8em auto 0;font-size:clamp(19px,2vw,30px);line-height:1.32;color:#efe8db;text-shadow:0 2px 24px rgba(0,0,0,.7)}
@media(max-width:560px){.house-t span.ln{font-size:clamp(17px,4.8vw,21px);max-width:26ch}}
.house-t::before{content:"";position:absolute;inset:-14% -10% -18%;background:radial-gradient(ellipse at 50% 55%,rgba(8,7,6,.62) 0%,rgba(8,7,6,.38) 45%,rgba(8,7,6,0) 72%);z-index:-1;pointer-events:none}

/* ---- what we deliver ---- */
.deliver{padding:clamp(80px,11vw,140px) 0;background:#0e0c0a;border-top:1px solid var(--line)}
.deliver h2{font-family:"Cormorant Garamond",serif;font-weight:500;font-size:clamp(36px,4.8vw,70px);line-height:1.02;color:#f3ece0;margin-top:14px;max-width:18ch}
.dl-l{list-style:none;margin:clamp(32px,4vw,52px) 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.4vw,36px)}
.dl-l li{border-top:1px solid rgba(217,164,131,.45);padding-top:16px}
.dl-l b{display:block;font-family:"Space Mono",monospace;font-weight:400;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#d9a483}
.dl-l span{display:block;margin-top:10px;line-height:1.6;color:#d8cfc2;max-width:30ch}
.frame{margin:clamp(48px,7vw,90px) 0 0}
.frame-svg{width:100%;height:auto;display:block;max-width:1060px}
.frame-svg rect.fr-box{fill:none;stroke:#cfc6b8;stroke-opacity:.55;stroke-width:1}
.frame-svg line{stroke:#cfc6b8;stroke-opacity:.22;stroke-width:1}
.frame-svg .fr-ln{fill:none;stroke:#d9a483;stroke-opacity:.7;stroke-width:1;stroke-dasharray:900;stroke-dashoffset:900;transition:stroke-dashoffset 2.4s ease}
.frame.lit .fr-ln{stroke-dashoffset:0}
.frame-svg text{fill:#efe7da;font-family:"Cormorant Garamond",serif}
.frame-svg .fr-t{font-size:22px;font-style:italic}
.frame-svg .fr-s{font-size:19px;opacity:.85}
.frame-svg .fr-k{font-family:"Space Mono",monospace;font-size:12px;letter-spacing:.18em;text-transform:uppercase;fill:#d9a483}
.frame-svg .fr-n{font-family:"Space Mono",monospace;font-size:12px;letter-spacing:.06em;fill:#bdb5a8}
.frame figcaption{margin-top:18px;font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.06em;line-height:1.7;color:#bdb5a8;max-width:62ch}
@media(max-width:900px){.dl-l{grid-template-columns:1fr}}
@media(max-width:560px){.dl-l{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.frame-svg .fr-ln{transition:none;stroke-dashoffset:0}}
@media(max-width:700px){.frame{overflow-x:auto;-webkit-overflow-scrolling:touch;margin-right:calc(-1 * clamp(22px,5vw,56px))}.frame-svg{min-width:680px}.frame figcaption{max-width:calc(100vw - 44px)}}

/* hero: the line is the headline */
.house-t span.ln{max-width:24ch;margin:0 auto;font-size:clamp(24px,2.7vw,42px);line-height:1.25;font-style:italic;font-weight:400;animation-delay:.9s}
@media(max-width:560px){.house-t span.ln{font-size:clamp(20px,6vw,26px);max-width:20ch}}
/* proof, by the second screen */
.proof{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(18px,2.6vw,40px);margin:clamp(40px,5vw,64px) 0 0;border-top:1px solid var(--line);padding-top:clamp(22px,3vw,32px)}
.proof dt{font-family:"Cormorant Garamond",serif;font-size:clamp(34px,3.6vw,56px);line-height:1;color:#f3ece0}
.proof dd{margin:10px 0 0;font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;line-height:1.6;color:#bdb5a8;max-width:22ch}
@media(max-width:800px){.proof{grid-template-columns:1fr 1fr}}
/* polish over cinema: a lighter grain */
.fx-grain{opacity:.35 !important}

/* ---- Emotional Architecture, shown in built work: the drawing develops into the photograph ---- */
.ea{margin-top:clamp(48px,7vw,96px);display:grid;gap:clamp(64px,9vw,130px)}
.ea-s{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:clamp(28px,4vw,64px);align-items:center}
.ea-s.flip .dev{order:2}
.dev{position:relative;margin:0;aspect-ratio:3/2;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.55)}
.dev img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.dev-b{filter:brightness(.92) saturate(.92)}
.dev-s{transition:opacity 2.6s cubic-bezier(.4,0,.2,1) .5s,clip-path 2.6s cubic-bezier(.4,0,.2,1) .5s;clip-path:inset(0 0 0 0)}
.dev.built .dev-s{opacity:0;clip-path:inset(0 0 0 100%)}
.ea-t .k{display:block;font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#d9a483}
.ea-t h3{font-family:"Cormorant Garamond",serif;font-weight:500;font-size:clamp(30px,3vw,46px);line-height:1.05;margin:10px 0 14px;color:#f3ece0}
.ea-t p{line-height:1.7;color:#d8cfc2;max-width:40ch}
.ea-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ea-grid img{width:100%;aspect-ratio:1;object-fit:cover;display:block;filter:brightness(.9) saturate(.9);opacity:0;transform:translateY(14px);transition:opacity 1.2s ease,transform 1.2s ease}
.ea-grid.in img{opacity:1;transform:none}
.ea-grid.in img:nth-child(2){transition-delay:.25s}.ea-grid.in img:nth-child(3){transition-delay:.5s}.ea-grid.in img:nth-child(4){transition-delay:.75s}
@media(max-width:800px){.ea-s{grid-template-columns:1fr}.ea-s.flip .dev{order:0}}
@media (prefers-reduced-motion:reduce){.dev-s{display:none}.ea-grid img{opacity:1;transform:none;transition:none}}

/* deliverable icons: pencil-line, copper */
.dl-l svg{width:52px;height:52px;display:block;margin-bottom:16px;fill:none;stroke:#d9a483;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;opacity:.92}
/* studio fan: drawings that develop into the stores as the cards spread */
.fan-c{overflow:hidden}
.fan-c img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.fan-c .dev-s{transition:opacity 1.6s ease,clip-path 1.6s ease;clip-path:inset(0 0 0 0)}
.fan-c.built .dev-s{opacity:0;clip-path:inset(0 0 0 100%)}
.fan:not(.go) .fan-c{aspect-ratio:4/3;position:relative}
.fan:not(.go) .fan-c .dev-s{display:none}
.ea-t svg{width:52px;height:52px;display:block;margin-bottom:16px;fill:none;stroke:#d9a483;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;opacity:.92}

/* ===== art direction pass: one scale, one rhythm ===== */
/* hero: what we do, set large */
.house-t span.ln{max-width:23ch;font-size:clamp(28px,3.5vw,56px);line-height:1.18;font-weight:400}
@media(max-width:560px){.house-t span.ln{font-size:clamp(23px,6.6vw,30px);max-width:19ch;line-height:1.2}}
/* one heading scale for every section title */
.method h2,.deliver h2,.where h2,.who h2,.co h2{font-family:"Cormorant Garamond",serif;font-weight:500;font-size:clamp(40px,5vw,76px);line-height:1.02;color:#f3ece0;margin-top:14px;max-width:18ch}
/* one section rhythm */
.pov,.method,.deliver,.where,.who,.co{padding:clamp(96px,12vw,160px) 0}
.method .sm,.deliver .sm,.where .sm{max-width:52ch;margin-top:18px;line-height:1.7;color:#d8cfc2}
/* where: an index of places */
.where{background:#0b0a08;border-top:1px solid var(--line)}
.pl{list-style:none;margin:clamp(36px,5vw,60px) 0 0;padding:0;counter-reset:pl}
.pl li{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) minmax(0,2fr);gap:24px;align-items:baseline;padding:20px 0;border-top:1px solid var(--line)}
.pl li:last-child{border-bottom:1px solid var(--line)}
.pl-c{font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#d9a483}
.pl-t{font-family:"Cormorant Garamond",serif;font-size:clamp(24px,2.3vw,34px);line-height:1.1;color:#f3ece0}
.pl-n{font-family:"Cormorant Garamond",serif;font-style:italic;font-size:clamp(18px,1.5vw,22px);line-height:1.4;color:#cfc6b8}
@media(max-width:760px){.pl li{grid-template-columns:1fr;gap:6px}}
/* who: the bio beside the stone */
.who{background:#0e0c0a;border-top:1px solid var(--line)}
.who-g{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(36px,6vw,96px);align-items:center}
.who-b{margin-top:22px;font-family:"Cormorant Garamond",serif;font-size:clamp(20px,1.7vw,26px);line-height:1.5;color:#e7e0d2;max-width:36ch}
.who .mono{margin-top:26px}
.who-f{margin:0}
.who-f img{display:block;width:100%;height:auto;filter:brightness(.9) saturate(.85);box-shadow:0 30px 80px rgba(0,0,0,.55)}
.who-f figcaption{margin-top:12px;font-family:"Space Mono",monospace;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:#bdb5a8}
@media(max-width:800px){.who-g{grid-template-columns:1fr}}
/* collaborators sit as a quieter coda */
.co-n li{font-size:clamp(28px,3.8vw,58px)}
/* who: the story, in his words */
.who-g{align-items:start}
.who-i{margin-top:22px;font-family:"Cormorant Garamond",serif;font-style:italic;font-size:clamp(24px,2.3vw,34px);line-height:1.3;color:#f3ece0;max-width:28ch}
.who-c{margin-top:clamp(34px,4vw,52px);padding-top:20px;border-top:1px solid var(--line)}
.who-n{display:block;font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#d9a483;margin-bottom:12px}
.who-c p{font-family:"Cormorant Garamond",serif;font-size:clamp(19px,1.55vw,23px);line-height:1.6;color:#e7e0d2;max-width:40ch;margin:0 0 .8em}
.who-f{position:sticky;top:clamp(90px,12vh,130px)}
@media(max-width:800px){.who-f{position:static}}

/* hero: a living headline */
.house-t .rot{display:block;font-family:"Space Mono",monospace;font-style:normal;font-size:clamp(11px,.95vw,13px);letter-spacing:.22em;text-transform:uppercase;color:#d9a483;margin:0 auto 1.6em;opacity:0;animation:rise 1.6s cubic-bezier(.2,.7,.1,1) .4s forwards}
.house-t .rot em{font-style:normal;color:#f3ece0;display:inline-block;min-width:9ch;text-align:left;transition:opacity .45s ease,transform .45s ease}
.house-t .rot em.out{opacity:0;transform:translateY(-6px)}
/* who, as a founder's quote */
.who-h{padding:clamp(96px,12vw,160px) 0;background:#0b0a08;border-top:1px solid var(--line)}
.q-f{margin:clamp(22px,3vw,34px) 0 0;max-width:24ch}
.q-f p{font-family:"Cormorant Garamond",serif;font-style:italic;font-size:clamp(34px,4.2vw,64px);line-height:1.1;color:#f3ece0;margin:0}
.q-f footer{margin-top:18px;font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#d9a483}
.who-h .sm{max-width:52ch;margin-top:26px;line-height:1.7;color:#d8cfc2}
/* enquiries: the quiet "say hello" */
.navlinks a.nl-ct{border:1px solid rgba(217,164,131,.55);padding:.55em 1.1em;border-radius:999px;color:#f3ece0}
.navlinks a.nl-ct:hover{background:rgba(217,164,131,.14)}
body.day .navlinks a.nl-ct{color:#2a2622}
.house-t span.rot{font-family:"Space Mono",monospace;font-style:normal;font-weight:400;font-size:clamp(11px,.95vw,13px);line-height:1.6;letter-spacing:.22em;margin:0 auto 1.8em;animation-delay:.4s}
.q-f{max-width:none}
.q-f p{max-width:22ch}

/* taste: touchstones, set as type; one line of Klein blue */
.taste{padding:clamp(96px,12vw,160px) 0;background:#07070a;border-top:1px solid var(--line)}
.taste h2{font-family:"Cormorant Garamond",serif;font-weight:500;font-size:clamp(40px,5vw,76px);line-height:1.02;color:#f3ece0;margin-top:14px}
.taste .sm{max-width:52ch;margin-top:18px;line-height:1.7;color:#d8cfc2}
.ikb{display:block;width:clamp(64px,8vw,120px);height:3px;background:#002fa7;margin:clamp(36px,5vw,56px) 0 clamp(30px,4vw,48px)}
.t-g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:clamp(36px,6vw,96px)}
.t-k{display:block;font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#d9a483;margin-bottom:16px}
.t-r,.t-m{list-style:none;margin:0;padding:0}
.t-r li{font-family:"Cormorant Garamond",serif;font-size:clamp(28px,2.8vw,42px);line-height:1.15;color:#f3ece0;padding:14px 0;border-top:1px solid var(--line)}
.t-r li span{display:block;margin-top:6px;font-family:"Space Mono",monospace;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:#bdb5a8}
.t-m{display:flex;flex-wrap:wrap;column-gap:.6em;row-gap:.15em;font-family:"Cormorant Garamond",serif;font-style:italic;font-size:clamp(26px,2.6vw,40px);line-height:1.3;color:#e7e0d2}
.t-m li:not(:last-child)::after{content:"\00b7";margin-left:.6em;color:#d9a483;font-style:normal}
.t-m li i{font-style:normal}
@media(max-width:800px){.t-g{grid-template-columns:1fr}}
/* the John line: plain words under the hero */
.house-t span.plain{display:block;max-width:44ch;margin:1.6em auto 0;font-family:"Space Mono",monospace;font-style:normal;font-weight:400;font-size:clamp(10.5px,.9vw,12.5px);line-height:1.8;letter-spacing:.14em;text-transform:uppercase;color:#e3d9c9;text-shadow:0 1px 14px rgba(0,0,0,.8);animation-delay:1.6s}
@media(max-width:560px){.house-t span.plain{max-width:32ch;font-size:10px;letter-spacing:.12em}}

/* ===== work, told as cases ===== */
.w-h{padding:clamp(150px,22vh,240px) 0 clamp(60px,8vw,110px);background:#0b0a08}
.w-h h1{font-family:"Cormorant Garamond",serif;font-weight:400;font-size:clamp(52px,7.4vw,120px);line-height:.98;color:#f3ece0;margin-top:16px}
.w-h .sm{max-width:56ch;margin-top:24px;line-height:1.7;color:#d8cfc2}
.cs{border-top:1px solid var(--line);background:#0b0a08}
.cs:nth-child(even){background:#0e0c0a}
.cs-f{margin:0;height:clamp(320px,72vh,760px);overflow:hidden}
.cs-f img{width:100%;height:100%;object-fit:cover;display:block;filter:brightness(.88) saturate(.9);transform:scale(1.04);transition:transform 2.4s cubic-bezier(.2,.7,.1,1)}
.cs.in .cs-f img{transform:none}
.cs-g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.2fr);gap:clamp(28px,5vw,80px);padding-top:clamp(44px,6vw,80px);padding-bottom:clamp(80px,10vw,140px)}
.cs-n{display:block;font-family:"Cormorant Garamond",serif;font-size:clamp(44px,4vw,64px);line-height:1;color:#d9a483}
.cs-m ul{list-style:none;margin:18px 0 0;padding:0}
.cs-m li{font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;line-height:1.7;color:#cfc6b8;padding:8px 0;border-top:1px solid var(--line)}
.cs-m li:first-child{color:#f3ece0}
.cs-t h2{font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:400;font-size:clamp(32px,3.6vw,56px);line-height:1.1;color:#f3ece0;margin-top:12px;max-width:22ch}
.cs-a{margin-top:22px;font-family:"Cormorant Garamond",serif;font-size:clamp(20px,1.7vw,26px);line-height:1.5;color:#e7e0d2;max-width:40ch}
.cs-o{margin-top:16px;font-family:"Cormorant Garamond",serif;font-style:italic;font-size:clamp(19px,1.5vw,23px);color:#d9a483}
.cs-r{margin-top:22px;font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.08em;line-height:1.8;color:#bdb5a8;max-width:62ch}
@media(max-width:800px){.cs-g{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.cs-f img{transform:none;transition:none}}

/* selected work cards */
.wc-g{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.6vw,24px);margin-top:clamp(36px,5vw,60px)}
.wc-c{display:block;text-decoration:none;color:inherit}
.wc-c img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;filter:brightness(.86) saturate(.88);transition:filter .6s ease,transform 1.2s cubic-bezier(.2,.7,.1,1)}
.wc-c:hover img{filter:brightness(1) saturate(1);transform:scale(1.015)}
.wc-k{display:block;margin-top:14px;font-family:"Space Mono",monospace;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:#d9a483;line-height:1.6}
.wc-q{display:block;margin-top:8px;font-family:"Cormorant Garamond",serif;font-style:italic;font-size:clamp(19px,1.55vw,23px);line-height:1.3;color:#efe7da}
@media(max-width:900px){.wc-g{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.wc-g{grid-template-columns:1fr}}
/* the boutique promises */
.pr-l{list-style:none;margin:clamp(48px,6vw,80px) 0 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2vw,32px)}
.pr-l li{border-top:1px solid rgba(0,47,167,.9);padding-top:16px}
.pr-l b{display:block;font-family:"Cormorant Garamond",serif;font-weight:500;font-size:clamp(22px,2vw,30px);color:#f3ece0}
.pr-l span{display:block;margin-top:8px;line-height:1.6;color:#cfc6b8;max-width:28ch}
@media(max-width:900px){.pr-l{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.pr-l{grid-template-columns:1fr}}
