:root{
  --ink:#0a0f18;
  --paper:#f5f2ec;
  --blue:#2d52ff;
  --gold:#b49a6a;
  --muted:#6f7783;
  --line:rgba(10,15,24,.16);
  --max:1480px;
  --pad:clamp(24px,5vw,84px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.5}
a{color:inherit;text-decoration:none}
img{display:block;width:100%;height:auto}
a:focus-visible{outline:3px solid var(--blue);outline-offset:5px}
.skip-link{position:absolute;left:-9999px;top:10px;background:#fff;padding:10px 14px;z-index:100}
.skip-link:focus{left:10px}
.site-header{position:sticky;top:0;z-index:50;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:18px var(--pad);background:rgba(245,242,236,.88);backdrop-filter:blur(16px);border-bottom:1px solid transparent;transition:border-color .25s ease}
.site-header.is-scrolled{border-color:var(--line)}
.brand{font-size:.74rem;font-weight:800;letter-spacing:.17em}
nav{display:flex;gap:28px;font-size:.88rem}
.header-cta{justify-self:end;font-size:.88rem;border-bottom:1px solid currentColor;padding-bottom:2px}
main,footer{max-width:var(--max);margin-inline:auto}
section{padding-inline:var(--pad)}
.section-label,.hero-kicker,.case-meta{font-size:.69rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);font-weight:800}
.hero{padding-top:clamp(90px,11vw,170px);padding-bottom:clamp(90px,10vw,155px)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);gap:clamp(50px,9vw,150px);align-items:end;margin-top:clamp(52px,7vw,95px)}
.hero h1{margin:0;font-size:clamp(4.7rem,10.4vw,10.3rem);line-height:.84;letter-spacing:-.075em;font-weight:650;max-width:8.5ch}
.hero h1 em{font-family:Georgia,"Times New Roman",serif;font-weight:400;color:var(--blue)}
.hero-side{padding-bottom:1.2vw}
.hero-side p{font-size:clamp(1.06rem,1.4vw,1.35rem);max-width:34ch;margin:0 0 36px}
.arrow-link{display:inline-flex;gap:14px;align-items:center;font-weight:750;border-bottom:1px solid currentColor;padding-bottom:5px}
.arrow-link span{font-size:1.15em}
.hero-line{height:1px;background:var(--line);margin-top:clamp(70px,9vw,125px)}
.hero-note{margin-top:16px;font-family:Georgia,"Times New Roman",serif;font-size:clamp(1rem,1.35vw,1.25rem);font-style:italic;color:#4e5662}
.ownership{background:var(--ink);color:#f7f3ec;padding-top:clamp(95px,11vw,165px);padding-bottom:clamp(100px,12vw,180px);max-width:none}
.ownership>*{max-width:calc(var(--max) - 2*var(--pad));margin-left:auto;margin-right:auto}
.ownership .section-label{color:#949daa}
.ownership-layout{display:grid;grid-template-columns:1fr 1fr;gap:clamp(50px,9vw,145px);margin-top:70px}
.ownership h2{font-size:clamp(3.7rem,7.7vw,8rem);line-height:.9;letter-spacing:-.06em;margin:0;font-weight:600;max-width:7ch}
.ownership-copy p,.ownership-promise p{font-size:clamp(1.05rem,1.35vw,1.28rem);max-width:42ch}
.ownership-rule{height:1px;background:rgba(255,255,255,.16);margin-top:85px;margin-bottom:85px}
.ownership-promise{display:grid;grid-template-columns:1fr 1fr;gap:clamp(42px,8vw,120px)}
.ownership blockquote{font-family:Georgia,"Times New Roman",serif;font-size:clamp(2.6rem,5.8vw,6rem);line-height:1;letter-spacing:-.035em;margin-top:clamp(110px,13vw,190px);margin-bottom:75px;max-width:15ch;color:#fff}
.ownership-footer{display:grid;grid-template-columns:1fr 1fr;gap:40px;padding-top:24px;border-top:1px solid rgba(255,255,255,.18)}
.ownership-footer p:first-child{color:#d1b579;font-weight:800;font-size:1.08rem}
.ownership-footer p:last-child{justify-self:end;max-width:420px}
.work{padding-top:clamp(105px,12vw,180px);padding-bottom:clamp(100px,12vw,180px)}
.work-intro{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(50px,9vw,140px);align-items:end;margin-top:65px;margin-bottom:clamp(110px,14vw,200px)}
.work-intro h2,.approach h2,.about h2,.one-page h2,.contact h2{margin:0;font-size:clamp(3.8rem,7.2vw,7.7rem);line-height:.9;letter-spacing:-.06em;font-weight:600}
.work-intro p{font-size:clamp(1.05rem,1.35vw,1.26rem);max-width:40ch;margin:0}
.case-study{display:grid;grid-template-columns:.7fr 1.3fr;column-gap:clamp(45px,8vw,120px);row-gap:45px;padding:48px 0 115px;border-top:1px solid var(--line)}
.case-title h3{font-size:clamp(2.7rem,5.3vw,5.7rem);line-height:.92;letter-spacing:-.055em;margin:0 0 12px}
.case-title>p{margin:0;color:var(--blue);font-weight:700}
.case-image{grid-column:1/-1;display:block;margin-top:25px;overflow:hidden;background:#111}
.case-image img{transition:transform .45s ease}
.case-image:hover img{transform:scale(1.006)}
.case-description{grid-column:2;font-size:1.04rem;max-width:760px}
.case-description>p{max-width:58ch}
.case-facts{margin:45px 0 34px;border-top:1px solid var(--line)}
.case-facts>div{display:grid;grid-template-columns:130px 1fr;gap:24px;padding:18px 0;border-bottom:1px solid var(--line)}
.case-facts span{text-transform:uppercase;letter-spacing:.12em;font-size:.68rem;font-weight:800;color:var(--muted)}
.case-facts p{margin:0}
.case-critter{padding-top:70px}
.critter-idea{grid-column:1/-1;background:#e7e0d4;padding:clamp(45px,7vw,105px);margin-top:20px}
.critter-idea p{font-family:Georgia,"Times New Roman",serif;font-size:clamp(2.2rem,4.8vw,5.2rem);line-height:1.02;letter-spacing:-.025em;margin:.1em 0;max-width:16ch}
.critter-idea p:last-child{margin-left:auto;text-align:right}
.critter-idea em{font-weight:400;color:var(--blue)}
.approach{padding-top:clamp(105px,12vw,180px);padding-bottom:clamp(105px,12vw,180px);border-top:1px solid var(--line)}
.approach-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(50px,8vw,125px);margin-top:70px;align-items:end}
.approach-grid>div p:first-child{font-family:Georgia,"Times New Roman",serif;font-size:clamp(1.6rem,2.5vw,2.7rem);margin:0 0 20px}
.approach-grid>div p:last-child{font-size:1.05rem;max-width:38ch}
.process{list-style:none;padding:0;margin:100px 0 0;border-top:1px solid var(--line)}
.process li{display:grid;grid-template-columns:80px 1fr;padding:18px 0;border-bottom:1px solid var(--line);font-size:clamp(1.1rem,1.65vw,1.5rem)}
.process li span{font-size:.7rem;letter-spacing:.12em;color:var(--muted);align-self:center}
.about{background:#ded7ca;padding-top:clamp(105px,12vw,180px);padding-bottom:clamp(105px,12vw,180px);max-width:none}
.about>*{max-width:calc(var(--max) - 2*var(--pad));margin-left:auto;margin-right:auto}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(55px,9vw,145px);margin-top:70px}
.about-copy{font-size:clamp(1.05rem,1.35vw,1.25rem);max-width:48ch}
.about-copy p{margin-top:0;margin-bottom:26px}
.about-signoff{font-family:Georgia,"Times New Roman",serif;font-size:clamp(1.5rem,2.2vw,2.2rem);font-style:italic;margin-top:55px!important}
.one-page{padding-top:clamp(105px,12vw,180px);padding-bottom:clamp(105px,12vw,180px)}
.one-page h2{max-width:10ch;margin-top:65px}
.one-page-copy{display:grid;grid-template-columns:1fr 1fr;gap:clamp(45px,8vw,120px);margin-top:70px;max-width:900px;margin-left:auto}
.one-page-copy p{font-size:1.05rem}
.contact{background:var(--blue);color:white;max-width:none;padding-top:clamp(105px,12vw,180px);padding-bottom:70px}
.contact>*{max-width:calc(var(--max) - 2*var(--pad));margin-left:auto;margin-right:auto}
.contact .section-label{color:#d7dfff}
.contact h2{margin-top:70px;max-width:9ch}
.contact>p{font-size:clamp(1.08rem,1.4vw,1.3rem);margin-top:45px}
.contact-links{display:flex;flex-direction:column;align-items:flex-start;margin-top:70px}
.contact-links a{font-size:clamp(1.8rem,4vw,4.2rem);font-weight:650;letter-spacing:-.045em;border-bottom:1px solid rgba(255,255,255,.5);padding:8px 0}
.contact-links span{font-size:.6em}
.contact-bottom{margin-top:110px;padding-top:22px;border-top:1px solid rgba(255,255,255,.3);font-size:.8rem;letter-spacing:.08em;text-transform:uppercase}
footer{display:grid;grid-template-columns:1fr auto auto;gap:40px;padding:28px var(--pad);font-size:.76rem;letter-spacing:.08em;text-transform:uppercase;border-top:1px solid var(--line)}
@media(max-width:900px){
  .site-header{grid-template-columns:1fr auto}.site-header nav{display:none}
  .hero-grid,.ownership-layout,.ownership-promise,.work-intro,.approach-grid,.about-grid,.one-page-copy{grid-template-columns:1fr}
  .hero-side{max-width:560px}.ownership h2{max-width:none}
  .ownership-footer{grid-template-columns:1fr}.ownership-footer p:last-child{justify-self:start}
  .case-study{grid-template-columns:1fr}.case-description{grid-column:1}.case-image,.critter-idea{grid-column:1}
  .critter-idea p:last-child{margin-left:0;text-align:left;margin-top:1.2em}
}
@media(max-width:560px){
  :root{--pad:20px}
  .site-header{padding:15px 20px}.header-cta{display:none}.brand{font-size:.7rem}
  .hero{padding-top:75px}.hero-grid{margin-top:38px}.hero h1{font-size:clamp(4rem,18vw,5.6rem)}
  .hero-line{margin-top:62px}.ownership,.work,.approach,.about,.one-page,.contact{padding-left:20px;padding-right:20px}
  .ownership blockquote{font-size:clamp(2.35rem,11vw,3.8rem);margin-top:90px}
  .work-intro h2,.approach h2,.about h2,.one-page h2,.contact h2{font-size:clamp(3.2rem,14vw,4.8rem)}
  .case-study{padding-bottom:85px}.case-facts>div{grid-template-columns:1fr;gap:6px}
  .critter-idea{padding:38px 24px}.critter-idea p{font-size:clamp(2rem,10vw,3.3rem)}
  .process{margin-top:65px}.process li{grid-template-columns:54px 1fr}
  .contact-links a{font-size:clamp(1.45rem,7.6vw,2.3rem)}
  footer{grid-template-columns:1fr;gap:8px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* Refinement pass 2 — quieter, more elegant, less landing-page heavy */
:root{
  --ink:#0b1624;
  --paper:#f6f3ed;
  --blue:#92723c;
  --gold:#92723c;
  --muted:#747b84;
  --line:rgba(11,22,36,.14);
}
.site-header{padding-top:20px;padding-bottom:20px;background:rgba(246,243,237,.92)}
.brand{letter-spacing:.2em}
nav{gap:34px;font-size:.84rem}
.header-cta{font-size:.84rem}
.hero{padding-top:clamp(86px,9vw,135px);padding-bottom:clamp(86px,9vw,135px)}
.hero-grid{grid-template-columns:minmax(0,1.22fr) minmax(300px,.78fr);gap:clamp(64px,10vw,165px);margin-top:clamp(44px,6vw,78px)}
.hero h1{font-size:clamp(4.1rem,8.4vw,8.6rem);line-height:.87;letter-spacing:-.07em;max-width:9ch}
.hero h1 em{color:var(--gold)}
.hero-side{padding-bottom:.7vw}
.hero-side p{font-size:clamp(1rem,1.25vw,1.2rem);line-height:1.62;max-width:35ch}
.hero-line{margin-top:clamp(58px,7vw,92px)}
.hero-note{font-size:clamp(.96rem,1.15vw,1.12rem);color:#626974}
.ownership{background:#0b1624;padding-top:clamp(90px,10vw,145px);padding-bottom:clamp(95px,10vw,150px)}
.ownership-layout{margin-top:58px;gap:clamp(58px,9vw,135px)}
.ownership h2{font-size:clamp(3.3rem,6vw,6.2rem);max-width:8ch}
.ownership-copy p,.ownership-promise p{font-size:clamp(1rem,1.18vw,1.15rem);line-height:1.62}
.ownership-rule{margin-top:70px;margin-bottom:70px}
.ownership blockquote{font-size:clamp(2.35rem,4.7vw,4.9rem);max-width:17ch;margin-top:clamp(90px,10vw,145px);margin-bottom:62px}
.ownership-footer p:first-child{color:#d1b578}
.work{padding-top:clamp(95px,10vw,150px);padding-bottom:clamp(95px,10vw,150px)}
.work-intro{margin-top:56px;margin-bottom:clamp(90px,11vw,150px)}
.work-intro h2,.approach h2,.about h2,.one-page h2,.contact h2{font-size:clamp(3.35rem,6vw,6.2rem);line-height:.94}
.work-intro p{font-size:clamp(1rem,1.2vw,1.16rem);line-height:1.62}
.case-study{grid-template-columns:.72fr 1.28fr;column-gap:clamp(52px,8vw,118px);row-gap:38px;padding:42px 0 92px}
.case-title h3{font-size:clamp(2.45rem,4.5vw,4.8rem)}
.case-image{margin-top:14px}
.case-description{font-size:1rem;line-height:1.65}
.case-facts{margin-top:36px}
.case-critter{padding-top:54px}
.critter-idea{background:transparent;padding:clamp(52px,7vw,92px) 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:10px}
.critter-idea p{font-size:clamp(2rem,3.8vw,4.2rem);max-width:17ch}
.critter-idea em{color:var(--gold)}
.approach{padding-top:clamp(95px,10vw,150px);padding-bottom:clamp(95px,10vw,150px)}
.approach-grid{margin-top:58px}
.approach-grid>div p:first-child{font-size:clamp(1.45rem,2vw,2.15rem)}
.process{margin-top:78px}
.process li{padding:15px 0;font-size:clamp(1rem,1.35vw,1.28rem)}
.about{background:#ebe5db;padding-top:clamp(95px,10vw,150px);padding-bottom:clamp(95px,10vw,150px)}
.about-grid{margin-top:58px}
.about-copy{font-size:clamp(1rem,1.2vw,1.15rem);line-height:1.65}
.about-signoff{font-size:clamp(1.35rem,1.8vw,1.85rem)}
.one-page{padding-top:clamp(95px,10vw,150px);padding-bottom:clamp(95px,10vw,150px)}
.one-page h2{margin-top:58px;max-width:11ch}
.one-page-copy{margin-top:58px;max-width:850px}
.contact{background:#0b1624;padding-top:clamp(95px,10vw,150px)}
.contact h2{margin-top:58px;font-size:clamp(3.5rem,6.4vw,6.6rem)}
.contact-links{margin-top:60px}
.contact-links a{font-size:clamp(1.65rem,3.4vw,3.5rem)}
.contact-bottom{margin-top:90px}
@media(max-width:900px){
  .hero-grid{grid-template-columns:1fr;gap:48px}.hero-side{max-width:620px}
  .hero h1{max-width:8.5ch}
}
@media(max-width:560px){
  .hero{padding-top:64px}.hero h1{font-size:clamp(3.65rem,16vw,5.15rem)}
  .hero-grid{gap:38px;margin-top:32px}
  .ownership h2,.work-intro h2,.approach h2,.about h2,.one-page h2,.contact h2{font-size:clamp(2.9rem,12.7vw,4.25rem)}
  .ownership blockquote{font-size:clamp(2.15rem,10vw,3.35rem)}
}

/* Refinement pass 3 — confidence over explanation */
.process{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.process li{
  display:block;
  border-bottom:0;
  padding:18px 16px 20px 0;
  font-size:.98rem;
  letter-spacing:.01em;
}
.process li+li{border-left:1px solid var(--line);padding-left:16px}
.process li span{display:block;margin-bottom:18px;font-size:.64rem}
.contact{padding-bottom:58px}
.contact h2{max-width:10ch}
.contact-links{margin-top:52px;gap:6px}
.contact-links a{font-size:clamp(1.45rem,2.5vw,2.65rem);font-weight:560;letter-spacing:-.025em;padding:5px 0}
.contact-bottom{margin-top:74px}
@media(max-width:900px){
  .process{grid-template-columns:repeat(3,1fr)}
  .process li:nth-child(4){border-left:0}
  .process li:nth-child(n+4){border-top:1px solid var(--line)}
}
@media(max-width:560px){
  .process{grid-template-columns:1fr 1fr}
  .process li:nth-child(odd){border-left:0}
  .process li:nth-child(even){border-left:1px solid var(--line)}
  .process li:nth-child(n+3){border-top:1px solid var(--line)}
  .contact-links a{font-size:clamp(1.28rem,6vw,1.85rem)}
}

/* VVM case study — real homepage proof, supporting rather than dominating */
.case-vvm{
  grid-template-columns:minmax(280px,.78fr) minmax(0,1.22fr);
  column-gap:clamp(48px,7vw,104px);
  align-items:start;
}
.case-vvm .case-meta{grid-column:1;grid-row:1}
.case-vvm .case-title{grid-column:1;grid-row:2}
.case-vvm .case-description{grid-column:1;grid-row:3;max-width:520px}
.case-vvm .case-visual{
  grid-column:2;
  grid-row:1 / span 3;
  margin:0;
  align-self:start;
  max-width:760px;
  justify-self:end;
}
.case-vvm .case-visual a{
  display:block;
  padding:8px;
  border:1px solid var(--line);
  background:#fff;
}
.case-vvm .case-visual img{display:block;width:100%;height:auto}
.case-vvm .case-visual figcaption{
  margin-top:10px;
  font-size:.72rem;
  letter-spacing:.04em;
  color:var(--muted);
}
.case-vvm .case-description>p{margin-top:0;margin-bottom:20px}
@media(max-width:900px){
  .case-vvm{grid-template-columns:1fr}
  .case-vvm .case-meta,.case-vvm .case-title,.case-vvm .case-description,.case-vvm .case-visual{grid-column:1;grid-row:auto;max-width:none;justify-self:stretch}
  .case-vvm .case-visual{margin:8px 0 10px}
}

/* Final polish pass — quiet confidence, tighter rhythm, clearer proof */
.hero{padding-top:clamp(78px,8vw,118px);padding-bottom:clamp(78px,8.5vw,125px)}
.hero-grid{margin-top:clamp(40px,5vw,66px);grid-template-columns:minmax(0,1.16fr) minmax(300px,.84fr);gap:clamp(58px,8vw,130px)}
.hero h1{font-size:clamp(3.9rem,7.7vw,7.75rem);max-width:9.4ch}
.hero-side p{max-width:36ch}
.hero-line{margin-top:clamp(52px,6vw,82px)}
.ownership{padding-top:clamp(82px,8.5vw,128px);padding-bottom:clamp(86px,9vw,136px)}
.ownership-layout{margin-top:50px}
.ownership h2{font-size:clamp(3rem,5.4vw,5.6rem)}
.ownership-rule{margin-top:58px;margin-bottom:58px}
.ownership blockquote{font-size:clamp(2.2rem,4.15vw,4.3rem);margin-top:clamp(74px,8vw,116px);margin-bottom:52px;max-width:18ch}
.ownership-footer{font-size:.98rem}
.work{padding-top:clamp(86px,9vw,136px);padding-bottom:clamp(86px,9vw,136px)}
.work-intro{margin-top:50px;margin-bottom:clamp(78px,9vw,122px)}
.work-intro h2,.approach h2,.about h2,.contact h2{font-size:clamp(3.05rem,5.4vw,5.6rem)}
.case-study{row-gap:30px;padding:38px 0 78px}
.case-title h3{font-size:clamp(2.35rem,4vw,4.25rem)}
.case-vvm{grid-template-columns:minmax(300px,.9fr) minmax(0,1.1fr);column-gap:clamp(48px,6.5vw,96px)}
.case-vvm .case-visual{max-width:640px}
.case-vvm .case-visual a{padding:6px}
.case-vvm .case-visual figcaption{font-size:.68rem}
.case-vvm .case-description{max-width:500px}
.case-facts>div{grid-template-columns:112px 1fr;gap:20px;padding:15px 0}
.case-critter{padding-top:42px}
.critter-idea{padding:clamp(42px,5vw,68px) 0}
.critter-idea p{font-size:clamp(1.85rem,3.2vw,3.55rem);max-width:19ch}
.approach{padding-top:clamp(86px,9vw,136px);padding-bottom:clamp(86px,9vw,136px)}
.approach-grid{margin-top:50px}
.process{margin-top:64px;display:flex;align-items:flex-start;gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.process li{position:relative;flex:1;display:block;padding:20px 24px 20px 0;border:0!important;font-size:.92rem;letter-spacing:0}
.process li+li{padding-left:28px}
.process li+li::before{content:'→';position:absolute;left:0;top:39px;color:var(--muted);font-weight:400}
.process li span{display:block;margin-bottom:10px;font-size:.62rem;letter-spacing:.12em;color:var(--muted)}
.process li strong{font-weight:650}
.about{padding-top:clamp(86px,9vw,136px);padding-bottom:clamp(86px,9vw,136px)}
.about-grid{margin-top:50px}
.about-signoff{margin-top:42px!important}
.contact{padding-top:clamp(86px,9vw,132px);padding-bottom:52px}
.contact h2{margin-top:50px;font-size:clamp(3.1rem,5.2vw,5.35rem);max-width:11ch}
.contact>p{margin-top:34px}
.contact-links{margin-top:48px;gap:2px}
.contact-links a{font-size:clamp(1.35rem,2.15vw,2.2rem)}
.contact-bottom{margin-top:62px}
footer{padding-top:24px;padding-bottom:24px}
@media(max-width:900px){
  .case-vvm{grid-template-columns:1fr}.case-vvm .case-visual{max-width:720px;justify-self:start}
  .process{display:grid;grid-template-columns:repeat(3,1fr)}
  .process li{padding:18px 18px 18px 0}
  .process li+li{padding-left:18px}
  .process li+li::before{display:none}
  .process li:nth-child(3n+2),.process li:nth-child(3n+3){border-left:1px solid var(--line)!important}
  .process li:nth-child(n+4){border-top:1px solid var(--line)!important}
}
@media(max-width:560px){
  .site-header{grid-template-columns:1fr auto;gap:16px}
  .header-cta{display:block;font-size:.72rem;white-space:nowrap}
  .hero{padding-top:54px;padding-bottom:66px}
  .hero h1{font-size:clamp(3.35rem,14.7vw,4.75rem);line-height:.9}
  .hero-side p{font-size:1rem;line-height:1.58}
  .hero-note{font-size:.98rem;line-height:1.45}
  .ownership,.work,.approach,.about,.contact{padding-left:20px;padding-right:20px}
  .ownership blockquote{font-size:clamp(2rem,9.1vw,3.05rem)}
  .work-intro h2,.approach h2,.about h2,.contact h2{font-size:clamp(2.7rem,11.8vw,3.95rem)}
  .case-title h3{font-size:clamp(2.2rem,10vw,3.2rem)}
  .case-vvm .case-visual{margin-top:2px}
  .process{grid-template-columns:1fr 1fr}
  .process li{padding:16px 12px 16px 0}
  .process li+li{padding-left:12px}
  .process li:nth-child(3n+2),.process li:nth-child(3n+3){border-left:0!important}
  .process li:nth-child(even){border-left:1px solid var(--line)!important}
  .process li:nth-child(n+3){border-top:1px solid var(--line)!important}
  .contact h2{font-size:clamp(2.85rem,12vw,4rem)}
  .contact-links a{font-size:clamp(1.15rem,5.4vw,1.55rem)}
}

/* Responsive cascade guard — keep the refined desktop grid from overriding phones */
@media(max-width:620px){
  .hero-grid{grid-template-columns:1fr;gap:34px;margin-top:32px}
  .hero-main,.hero-side{min-width:0}
  .hero-side{max-width:none;padding-bottom:0}
  .hero-side p{max-width:34ch;margin-bottom:28px}
}

/* Executive identity pass — authorship without decoration */
.brand{display:inline-flex;align-items:center;gap:10px;letter-spacing:0}
.brand-hh{font-size:.84rem;font-weight:850;letter-spacing:-.04em}
.brand-rule{width:28px;height:1px;background:var(--gold);display:inline-block}
.brand-studio{font-size:.66rem;font-weight:750;letter-spacing:.18em;white-space:nowrap}
.ownership-chain{display:grid;grid-template-columns:repeat(4,1fr);margin-top:clamp(52px,6vw,84px);border-top:1px solid var(--line)}
.chain-item{position:relative;padding:17px 24px 0 0;min-width:0}
.chain-item::before{content:'';position:absolute;top:-3px;left:0;width:5px;height:5px;border-radius:50%;background:var(--gold)}
.chain-item span{display:block;margin-bottom:7px;font-size:.58rem;letter-spacing:.14em;color:var(--muted)}
.chain-item strong{font-size:.88rem;font-weight:650;letter-spacing:.01em}
.chain-final strong{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-style:italic;font-size:1rem}
.hero-note{margin-top:18px;max-width:64ch}
.case-visual-vvm .visual-frame{position:relative;overflow:hidden;border:1px solid var(--line);background:#fff;padding:6px}
.case-visual-vvm .visual-frame::before{content:'01 · HOMEPAGE';position:absolute;z-index:2;top:16px;left:16px;padding:5px 7px;background:rgba(246,243,237,.92);font-size:.55rem;letter-spacing:.14em;color:var(--ink)}
.case-visual-vvm .visual-frame a{display:block;overflow:hidden;aspect-ratio:1.52/1;padding:0;border:0;background:transparent}
.case-visual-vvm .visual-frame img{width:100%;height:100%;object-fit:cover;object-position:top center}
.case-visual-vvm figcaption{display:flex;justify-content:space-between;gap:18px;margin-top:9px;text-transform:uppercase;letter-spacing:.1em;font-size:.6rem!important}
.case-critter{grid-template-columns:minmax(280px,.82fr) minmax(0,1.18fr);column-gap:clamp(48px,7vw,108px)}
.case-critter .case-meta{grid-column:1}
.case-critter .case-title{grid-column:2}
.case-critter .critter-idea{grid-column:1/-1}
.critter-visual{grid-column:1;margin:4px 0 0;max-width:520px}
.critter-visual img{display:block;width:100%;height:auto}
.critter-visual figcaption{margin-top:10px;font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.case-critter .case-description{grid-column:2;align-self:start;margin-top:4px}
.case-critter .case-title>p{color:#6f5d39}
.about-grid{grid-template-columns:minmax(220px,.8fr) minmax(210px,.58fr) minmax(300px,1fr);gap:clamp(38px,5vw,78px);align-items:start}
.about-portrait{margin:0;max-width:310px}
.about-portrait::before{content:'';display:block;width:56px;height:1px;background:var(--gold);margin-bottom:14px}
.about-portrait img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 22%;filter:grayscale(1) contrast(1.04) brightness(1.03)}
.about-portrait figcaption{margin-top:10px;font-size:.62rem;line-height:1.5;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.about-copy{max-width:42ch}
.process li small{display:block;margin-top:9px;max-width:17ch;font-size:.72rem;line-height:1.45;color:var(--muted);font-weight:450}
.work-intro h2{font-size:clamp(2.9rem,4.8vw,5rem)}
.approach h2,.about h2{font-size:clamp(2.85rem,4.5vw,4.7rem)}
.contact h2{font-size:clamp(3rem,4.9vw,5rem)}
@media(max-width:900px){
  .case-critter{grid-template-columns:1fr}
  .case-critter .case-meta,.case-critter .case-title,.case-critter .critter-idea,.case-critter .case-description,.critter-visual{grid-column:1}
  .critter-visual{max-width:560px;margin:6px 0 18px}
  .about-grid{grid-template-columns:minmax(210px,.7fr) minmax(0,1fr)}
  .about-grid h2{grid-column:1/-1}
}
@media(max-width:620px){
  .brand{gap:7px}.brand-rule{width:20px}.brand-studio{font-size:.58rem;letter-spacing:.14em}
  .ownership-chain{grid-template-columns:1fr 1fr;row-gap:22px;margin-top:46px;border-top:0;border-bottom:1px solid var(--line);padding-bottom:18px}
  .chain-item{border-top:1px solid var(--line);padding-top:13px}
  .chain-item:nth-child(even){padding-left:14px}
  .chain-item:nth-child(even)::before{left:14px}
  .case-visual-vvm .visual-frame::before{top:12px;left:12px}
  .case-visual-vvm figcaption{font-size:.54rem!important}
  .critter-visual{max-width:none;margin-top:2px}
  .about-grid{grid-template-columns:1fr;gap:30px}
  .about-grid h2{grid-column:1}
  .about-portrait{max-width:260px}
  .about-copy{max-width:none}
  .process li small{font-size:.68rem;max-width:15ch}
}

/* Authorship refinement — remove numbering, strengthen the signature system */
.ownership-signature{
  margin-top:clamp(54px,6.5vw,92px);
  padding:18px 0 16px;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.signature-label{
  margin-bottom:18px;
  font-size:.61rem;
  font-weight:800;
  letter-spacing:.17em;
  text-transform:uppercase;
  color:var(--muted);
}
.ownership-signature .ownership-chain{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  margin:0;
  border:0;
}
.ownership-signature .chain-item{
  position:relative;
  display:flex;
  align-items:center;
  min-height:54px;
  padding:0 44px 0 0;
}
.ownership-signature .chain-item::before{display:none}
.ownership-signature .chain-item:not(:last-child)::after{
  content:'→';
  position:absolute;
  right:18px;
  top:50%;
  transform:translateY(-52%);
  color:var(--gold);
  font-family:Georgia,"Times New Roman",serif;
  font-size:1.35rem;
  font-weight:400;
}
.ownership-signature .chain-item strong{
  font-size:clamp(1.12rem,1.5vw,1.42rem);
  font-weight:650;
  letter-spacing:-.025em;
}
.ownership-signature .chain-final strong{
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(1.22rem,1.7vw,1.58rem);
  font-style:italic;
  font-weight:400;
  color:var(--gold);
}

.case-visual-vvm .visual-frame::before{
  content:'HOMEPAGE STUDY';
}
.about-portrait{
  position:relative;
  max-width:310px;
  padding:10px 0 0;
}
.about-portrait::before{
  content:'';
  position:absolute;
  top:-4px;
  left:10%;
  width:80%;
  aspect-ratio:4/5;
  border:1px solid var(--gold);
  border-radius:50%;
  transform:rotate(-2.5deg);
  pointer-events:none;
}
.about-portrait::after{
  content:'';
  position:absolute;
  top:7%;
  left:4%;
  width:42px;
  height:1px;
  background:var(--gold);
}
.about-portrait img{
  width:84%;
  margin:0 auto;
  aspect-ratio:4/5;
  object-fit:cover;
  object-position:50% 22%;
  border-radius:50%;
  clip-path:ellipse(48% 49% at 50% 50%);
  filter:grayscale(1) contrast(1.04) brightness(1.03);
}
.about-portrait figcaption{
  width:84%;
  margin:14px auto 0;
}
.process li span{display:none!important}
.process li{
  padding-top:22px;
}
.section-label,.case-meta{
  letter-spacing:.15em;
}

@media(max-width:620px){
  .ownership-signature{
    margin-top:44px;
    padding:15px 0 12px;
  }
  .signature-label{margin-bottom:12px}
  .ownership-signature .ownership-chain{
    display:flex;
    flex-direction:column;
    gap:0;
  }
  .ownership-signature .chain-item{
    min-height:auto;
    padding:12px 34px 12px 0;
    border-top:1px solid var(--line);
  }
  .ownership-signature .chain-item:first-child{border-top:0}
  .ownership-signature .chain-item:not(:last-child)::after{
    content:'↓';
    right:4px;
    font-size:1.05rem;
  }
  .ownership-signature .chain-item strong{
    font-size:1.08rem;
  }
  .about-portrait{
    max-width:270px;
    margin-left:auto;
    margin-right:auto;
  }
  .about-portrait::after{left:1%}
}

/* Portrait frame correction — make the oval treatment visibly intentional */
.about-portrait::before{
  z-index:2;
  top:4px;
  left:8%;
  width:84%;
  border-color:rgba(146,114,60,.9);
}
.about-portrait img{
  position:relative;
  z-index:1;
}

/* Portrait frame — explicit oval composition */
.about-portrait::before,.about-portrait::after{display:none}
.portrait-frame{
  position:relative;
  width:86%;
  margin:0 auto;
  padding:8px;
  border:1px solid rgba(146,114,60,.9);
  border-radius:50%;
  transform:rotate(-1.5deg);
}
.portrait-frame::after{
  content:'';
  position:absolute;
  top:12%;
  right:-28px;
  width:52px;
  height:1px;
  background:var(--gold);
}
.portrait-frame img{
  display:block;
  width:100%;
  margin:0;
  aspect-ratio:4/5;
  object-fit:cover;
  object-position:50% 22%;
  border-radius:50%;
  clip-path:none;
  transform:rotate(1.5deg);
  filter:grayscale(1) contrast(1.04) brightness(1.03);
}
.about-portrait figcaption{
  width:86%;
  margin:16px auto 0;
}

/* Tight cleanup pass — production-proof portrait + process spacing */
.portrait-frame{
  overflow:hidden;
  border-radius:50%;
}
.portrait-frame img{
  display:block;
  border-radius:50%;
  clip-path:ellipse(50% 50% at 50% 50%);
}
.process li{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:8px;
}
.process li strong{
  display:block;
  line-height:1.2;
}
.process li small{
  display:block;
  margin:0;
  max-width:18ch;
  line-height:1.5;
}
@media(max-width:900px){
  .process li{gap:7px}
}

/* Executive middle-page refinement — stronger choreography without redesign */

/* VVM: make the screenshot feel curated, not simply placed */
.case-vvm{
  position:relative;
}
.case-vvm .case-visual{
  position:relative;
  margin-top:18px;
}
.case-vvm .case-visual::before{
  content:'';
  position:absolute;
  left:-18px;
  top:34px;
  bottom:38px;
  width:1px;
  background:var(--gold);
  opacity:.75;
}
.case-vvm .visual-frame{
  transform:translateX(10px);
}
.case-vvm .case-visual figcaption{
  padding-left:10px;
}

/* Critterfolio: warmer proof, quieter surrounding data */
.case-critter{
  position:relative;
}
.case-critter::before{
  content:'';
  position:absolute;
  inset:118px -24px 58px;
  background:rgba(180,154,106,.055);
  pointer-events:none;
}
.case-critter > *{
  position:relative;
  z-index:1;
}
.critter-visual{
  max-width:560px;
}
.critter-visual img{
  box-shadow:0 20px 48px rgba(11,22,36,.08);
}
.case-critter .case-description{
  padding-top:14px;
}
.case-critter .case-facts{
  margin-top:30px;
}

/* Process: one continuous design path, not six boxes */
.process{
  position:relative;
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:0;
  border:0;
  margin-top:72px;
  padding-top:24px;
}
.process::before{
  content:'';
  position:absolute;
  top:6px;
  left:0;
  right:0;
  height:1px;
  background:var(--line);
}
.process li{
  position:relative;
  min-width:0;
  padding:16px 22px 0 0!important;
  border:0!important;
  gap:8px;
}
.process li+li{
  padding-left:0!important;
}
.process li+li::before{
  display:none!important;
}
.process li::after{
  content:'';
  position:absolute;
  top:-21px;
  left:0;
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--paper);
  border:1px solid var(--gold);
}
.process li:last-child::after{
  background:var(--gold);
}
.process li strong{
  font-size:.95rem;
}
.process li small{
  max-width:19ch;
  color:#6f7783;
}

/* About: pair portrait and story as one deliberate composition */
.about-grid{
  position:relative;
}
.about-copy{
  position:relative;
  padding-left:clamp(24px,2.5vw,38px);
}
.about-copy::before{
  content:'';
  position:absolute;
  left:0;
  top:2px;
  bottom:8px;
  width:1px;
  background:rgba(146,114,60,.55);
}
.about-copy p:nth-child(2){
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(1.08rem,1.3vw,1.28rem);
  line-height:1.55;
}
.about-copy p:nth-child(3){
  font-weight:650;
}

/* Contact: turn the ending into a designed handoff */
.contact{
  position:relative;
  border-top:0;
}
.contact::before{
  content:'';
  position:absolute;
  top:0;
  left:var(--pad);
  width:clamp(86px,12vw,170px);
  height:2px;
  background:var(--gold);
}
.contact::after{
  content:'';
  position:absolute;
  top:0;
  left:calc(var(--pad) + clamp(86px,12vw,170px));
  right:var(--pad);
  height:1px;
  background:rgba(255,255,255,.16);
}

/* Responsive choreography for the executive refinement */
@media(max-width:900px){
  .process{
    grid-template-columns:repeat(3,1fr);
    row-gap:34px;
  }
  .process li:nth-child(n+4){
    padding-top:22px!important;
    border-top:1px solid var(--line)!important;
  }
  .case-critter::before{
    inset:104px 0 52px;
  }
  .about-copy{
    padding-left:24px;
  }
}
@media(max-width:620px){
  .case-vvm .case-visual::before{
    display:none;
  }
  .case-vvm .visual-frame{
    transform:none;
  }
  .case-vvm .case-visual figcaption{
    padding-left:0;
  }
  .case-critter::before{
    inset:96px -8px 42px;
  }
  .process{
    display:grid;
    grid-template-columns:1fr;
    gap:0;
    margin-top:52px;
    padding:0 0 0 28px;
  }
  .process::before{
    top:3px;
    bottom:3px;
    left:7px;
    right:auto;
    width:1px;
    height:auto;
  }
  .process li,
  .process li:nth-child(n+4){
    padding:0 0 26px 0!important;
    border:0!important;
  }
  .process li:last-child{
    padding-bottom:0!important;
  }
  .process li::after{
    top:3px;
    left:-25px;
  }
  .about-copy{
    padding-left:0;
  }
  .about-copy::before{
    display:none;
  }
  .about-copy p:nth-child(2){
    font-size:1.08rem;
  }
}

/* Portfolio architecture comparison — equal authority, different jobs */
.work-intro{
  margin-bottom:clamp(58px,7vw,88px);
}
.work-intro-copy{
  max-width:46ch;
}
.work-intro-copy>p+p{
  margin-top:22px;
}
.work-manifesto{
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(1.55rem,2.4vw,2.45rem)!important;
  line-height:1.18!important;
  letter-spacing:-.025em;
  max-width:18ch!important;
}
.work-manifesto em{
  color:var(--gold);
  font-weight:400;
}
.system-spectrum{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  margin-bottom:clamp(94px,11vw,146px);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.system-principle{
  padding:26px 34px 30px 0;
}
.system-principle+.system-principle{
  padding-left:34px;
  border-left:1px solid var(--line);
}
.system-principle span{
  display:block;
  margin-bottom:16px;
  color:var(--muted);
  font-size:.64rem;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.system-principle strong{
  display:block;
  margin-bottom:12px;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(1.45rem,2.2vw,2.2rem);
  line-height:1.1;
  font-weight:400;
}
.system-principle p{
  margin:0;
  max-width:32ch;
  font-size:.94rem;
  line-height:1.58;
  color:#5f6670;
}
.case-system-depth{
  margin-top:30px;
  padding:20px 0 22px;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.case-system-depth>span{
  display:block;
  margin-bottom:8px;
  color:var(--gold);
  font-size:.64rem;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.case-system-depth p{
  margin:0;
  max-width:60ch;
  line-height:1.62;
}
.case-vvm .case-facts,
.case-critter .case-facts{
  margin-top:28px;
}
.case-critter .critter-visual{
  max-width:640px;
}
.case-critter .case-description{
  max-width:560px;
}
.case-critter .case-title{
  max-width:620px;
}
.case-critter .critter-idea{
  margin-bottom:8px;
}
@media(max-width:900px){
  .system-spectrum{
    grid-template-columns:1fr;
  }
  .system-principle{
    padding:22px 0 24px;
  }
  .system-principle+.system-principle{
    padding-left:0;
    border-left:0;
    border-top:1px solid var(--line);
  }
  .system-principle p{
    max-width:54ch;
  }
}
@media(max-width:620px){
  .work-intro{
    margin-bottom:44px;
  }
  .work-manifesto{
    font-size:clamp(1.4rem,7.2vw,2rem)!important;
  }
  .system-spectrum{
    margin-bottom:78px;
  }
  .system-principle strong{
    font-size:1.45rem;
  }
  .case-system-depth{
    margin-top:24px;
  }
}

/* Final luxury editorial pass — hierarchy, pacing, scale, restraint */
.work-intro{
  align-items:start;
  margin-bottom:clamp(74px,9vw,122px);
}
.work-intro-copy{
  padding-top:6px;
}
.work-intro-copy>p:first-child{
  max-width:36ch;
}
.work-manifesto{
  margin:clamp(38px,4.6vw,62px) 0 0!important;
  max-width:13ch!important;
  font-size:clamp(2rem,3.2vw,3.3rem)!important;
  line-height:1.02!important;
}
.work-manifesto span,
.work-manifesto em{
  display:block;
}
.work-manifesto em{
  margin-top:4px;
}
.work-intro-copy>p:last-child{
  margin-top:clamp(28px,3vw,42px);
  max-width:34ch;
  color:#5f6670;
}

.system-spectrum{
  position:relative;
  align-items:start;
  gap:clamp(26px,3.8vw,56px);
  border:0;
  margin-bottom:clamp(120px,13vw,178px);
}
.system-spectrum::before{
  content:'';
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:1px;
  background:var(--line);
}
.system-principle,
.system-principle+.system-principle{
  position:relative;
  padding:30px 0 0;
  border:0;
}
.system-principle::before{
  content:'';
  position:absolute;
  top:-1px;
  left:0;
  width:42px;
  height:2px;
  background:var(--gold);
}
.system-depth{
  margin-top:26px;
}
.system-scale{
  margin-top:52px;
}
.system-principle span{
  margin-bottom:22px;
}
.system-principle strong{
  margin-bottom:16px;
  font-size:clamp(1.7rem,2.35vw,2.35rem);
}
.system-principle p{
  font-size:.92rem;
  line-height:1.62;
  max-width:30ch;
}

.case-study{
  row-gap:30px;
}
.case-vvm{
  grid-template-columns:minmax(300px,.62fr) minmax(0,1.38fr);
  column-gap:clamp(54px,7.5vw,116px);
  padding-bottom:clamp(118px,12vw,170px);
}
.case-vvm .case-visual{
  max-width:860px;
  margin-top:2px;
}
.case-vvm .visual-frame{
  transform:translateX(14px);
}
.case-vvm .case-description{
  max-width:500px;
}
.case-vvm .case-description>p:first-child,
.case-critter .case-description>p:first-child{
  font-size:1.04rem;
  line-height:1.68;
}
.case-vvm .case-description>p:nth-child(2),
.case-critter .case-description>p:nth-child(2){
  color:#4f5864;
}
.case-system-depth{
  margin-top:34px;
  padding:18px 0 20px;
  border-top:1px solid rgba(11,22,36,.11);
  border-bottom:0;
}
.case-system-depth>span{
  margin-bottom:10px;
  color:var(--muted);
}
.case-system-depth p{
  max-width:54ch;
  color:#68717c;
  font-size:.87rem;
  line-height:1.62;
}
.case-facts{
  margin-top:18px!important;
}
.case-facts>div{
  grid-template-columns:118px 1fr;
  padding:14px 0;
}
.case-facts p{
  font-size:.91rem;
  line-height:1.54;
}

.case-critter{
  grid-template-columns:minmax(320px,.92fr) minmax(0,1.08fr);
  column-gap:clamp(58px,8vw,118px);
  padding-top:clamp(68px,7vw,96px);
}
.case-critter::before{
  inset:clamp(118px,12vw,162px) -18px 36px;
  background:rgba(180,154,106,.045);
}
.case-critter .critter-idea{
  padding:clamp(58px,6vw,82px) 0 clamp(64px,7vw,94px);
  margin-top:4px;
  margin-bottom:18px;
}
.case-critter .critter-idea p{
  font-size:clamp(2.25rem,4vw,4.25rem);
  line-height:1;
  max-width:15.5ch;
}
.case-critter .critter-idea p:last-child{
  max-width:13ch;
}
.case-critter .critter-visual{
  max-width:600px;
  align-self:start;
}
.case-critter .case-description{
  max-width:540px;
  padding-top:4px;
}

.approach-grid{
  align-items:start;
}
.approach-grid>div p:first-child{
  font-size:clamp(2rem,3vw,3.25rem);
  line-height:1.06;
  max-width:13ch;
  margin-bottom:26px;
}
.approach-grid>div p:last-child{
  max-width:34ch;
  color:#555e69;
}
.process{
  margin-top:clamp(88px,9vw,124px);
}

.about-grid{
  grid-template-columns:minmax(220px,.7fr) minmax(260px,.72fr) minmax(330px,1.08fr);
  gap:clamp(42px,5.5vw,88px);
  align-items:start;
}
.about-portrait{
  max-width:350px;
}
.about-copy{
  max-width:46ch;
}
.about-copy>p:first-child{
  margin-bottom:32px;
}
.about-copy p:nth-child(2){
  margin-top:6px;
  margin-bottom:34px;
}
.about-copy p:nth-child(3){
  margin-bottom:34px;
}
.about-signoff{
  margin-top:64px!important;
}

.contact{
  padding-top:clamp(118px,11vw,168px);
}
.contact-grid{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);
  gap:clamp(70px,10vw,150px);
  align-items:end;
  max-width:calc(var(--max) - 2*var(--pad));
  margin:58px auto 0;
}
.contact-grid h2{
  margin:0;
  max-width:8.5ch;
  font-size:clamp(3.7rem,6.5vw,6.8rem);
}
.contact-side{
  padding-bottom:10px;
}
.contact-side>p{
  margin:0;
  max-width:28ch;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(1.35rem,2vw,2rem);
  line-height:1.3;
}
.contact .contact-links{
  margin-top:42px;
}
.contact .contact-links a{
  font-size:clamp(1.35rem,2.3vw,2.4rem);
}
.contact-bottom{
  margin-top:clamp(92px,9vw,132px);
}

@media(max-width:900px){
  .system-spectrum{
    gap:0;
  }
  .system-depth,
  .system-scale{
    margin-top:0;
  }
  .system-principle,
  .system-principle+.system-principle{
    padding:24px 0 28px;
  }
  .system-principle::before{
    top:-1px;
  }
  .system-principle+.system-principle{
    border-top:1px solid var(--line);
  }
  .case-vvm,
  .case-critter{
    grid-template-columns:1fr;
  }
  .case-vvm .case-meta,
  .case-vvm .case-title,
  .case-vvm .case-description,
  .case-vvm .case-visual,
  .case-critter .case-meta,
  .case-critter .case-title,
  .case-critter .critter-idea,
  .case-critter .case-description,
  .case-critter .critter-visual{
    grid-column:1;
  }
  .case-vvm .case-visual{
    grid-row:auto;
    justify-self:stretch;
    max-width:none;
    margin:10px 0 18px;
  }
  .case-vvm .visual-frame{
    transform:none;
  }
  .case-vvm .case-description{
    max-width:640px;
  }
  .case-critter .critter-visual{
    max-width:620px;
    margin-bottom:26px;
  }
  .case-critter .case-description{
    max-width:640px;
  }
  .about-grid{
    grid-template-columns:minmax(230px,.75fr) minmax(0,1fr);
  }
  .about-grid h2{
    grid-column:1/-1;
  }
  .about-portrait{
    max-width:330px;
  }
  .contact-grid{
    grid-template-columns:1fr;
    gap:48px;
    align-items:start;
  }
  .contact-side{
    max-width:620px;
  }
}
@media(max-width:620px){
  .work-manifesto{
    max-width:12ch!important;
    font-size:clamp(1.8rem,9vw,2.55rem)!important;
  }
  .system-spectrum{
    margin-bottom:88px;
  }
  .system-principle{
    padding:22px 0 24px;
  }
  .system-principle strong{
    font-size:1.55rem;
  }
  .case-vvm,
  .case-critter{
    padding-bottom:92px;
  }
  .case-vvm .case-visual{
    margin-top:6px;
  }
  .case-critter .critter-idea{
    padding:44px 0 52px;
  }
  .case-critter .critter-idea p{
    font-size:clamp(2rem,10.4vw,3.2rem);
  }
  .case-system-depth p{
    font-size:.84rem;
  }
  .case-facts>div{
    grid-template-columns:1fr;
    gap:5px;
  }
  .approach-grid>div p:first-child{
    font-size:clamp(1.8rem,8vw,2.45rem);
  }
  .about-grid{
    grid-template-columns:1fr;
    gap:34px;
  }
  .about-grid h2{
    grid-column:1;
  }
  .about-portrait{
    max-width:290px;
  }
  .contact-grid{
    margin-top:48px;
    gap:36px;
  }
  .contact-grid h2{
    font-size:clamp(3rem,13vw,4.35rem);
  }
  .contact-side>p{
    font-size:1.35rem;
  }
}