:root{
  --paper:#f4f2ec;
  --paper-2:#efede6;
  --ink:#121212;
  --muted:#6c685f;
  --line:rgba(18,18,18,.14);
  --line-strong:rgba(18,18,18,.24);
  --red:#ff4a4d;
  --blue:#4665ff;
  --green:#2c9f5a;
  --purple:#8d62ff;
  --black:#111;
  --pad:clamp(18px,2.4vw,42px);
  --sans:Inter,"Helvetica Neue",Arial,"PingFang SC","Microsoft YaHei",sans-serif;
  --display:Inter,"Helvetica Neue",Arial,"PingFang SC","Microsoft YaHei",sans-serif;
  --accent:var(--red);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--paper)}
body{margin:0;font-family:var(--sans);background:var(--paper);color:var(--ink);line-height:1.55;overflow-x:hidden;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}img,video{display:block;max-width:100%}strong{font-weight:700}
::selection{background:var(--ink);color:#fff}
body.menu-open,body.page-leaving{overflow:hidden}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:999;opacity:.018;background-image:radial-gradient(circle at 20% 30%, rgba(0,0,0,.7) 0 1px, transparent 1px),radial-gradient(circle at 80% 70%, rgba(0,0,0,.55) 0 1px, transparent 1px);background-size:18px 18px,22px 22px}

/* loader */
.loader,.page-wipe{position:fixed;inset:0;z-index:10000;background:var(--ink);color:#fff;pointer-events:none}
.loader{display:flex;flex-direction:column;justify-content:space-between;padding:20px var(--pad) var(--pad);transition:clip-path .85s cubic-bezier(.76,0,.24,1);clip-path:inset(0)}
body.loaded .loader{clip-path:inset(0 0 100% 0)}
.loader-top{display:flex;justify-content:space-between;gap:20px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;opacity:.75}
.loader-word{font-family:var(--display);font-size:clamp(54px,13vw,180px);line-height:.9;font-weight:700;letter-spacing:-.06em}
.page-wipe{transform:translateY(100%);transition:transform .68s cubic-bezier(.76,0,.24,1)}
body.page-leaving .page-wipe{transform:translateY(0)}

/* cursor */
.cursor{position:fixed;left:0;top:0;z-index:10001;pointer-events:none;border-radius:50%;opacity:0;mix-blend-mode:difference}
.cursor-dot{width:6px;height:6px;margin:-3px;background:#fff}
.cursor-ring{width:48px;height:48px;margin:-24px;border:1px solid #fff;display:grid;place-items:center;transition:width .18s,height .18s,margin .18s,background .18s}
.cursor-ring span{font-size:8px;letter-spacing:.08em;color:#000;opacity:0;text-transform:uppercase;font-weight:700}
.cursor-active .cursor-ring{width:82px;height:82px;margin:-41px;background:#fff}
.cursor-active .cursor-ring span{opacity:1}
@media (pointer:fine){.cursor{opacity:1}}

/* utility */
.caps-label,.module-kicker,.section-kicker{display:inline-block;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:700}
.caps-label--light{color:rgba(255,255,255,.7)}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:24px;padding-bottom:22px;border-bottom:1px solid var(--line)}
.section-head h2{margin:10px 0 0;font-size:clamp(28px,3vw,48px);line-height:1.02;letter-spacing:-.05em;font-weight:700}
.section-head p,.section-head a{margin:0;max-width:560px;font-size:15px;color:var(--muted)}
.section-head--tight{padding-bottom:16px}
[data-reveal]{opacity:0;transform:translateY(24px);transition:opacity .65s ease,transform .8s cubic-bezier(.2,.72,.2,1)}
[data-reveal].is-visible{opacity:1;transform:none}
[data-reveal="hero"]{transform:translateY(38px)}

/* topbar */
.topbar{position:sticky;top:0;z-index:300;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:18px;padding:18px var(--pad);background:rgba(244,242,236,.82);backdrop-filter:blur(14px);border-bottom:1px solid rgba(18,18,18,.08)}
.brand,.year,.menu-button{font-size:11px;letter-spacing:.1em;text-transform:uppercase;font-weight:700}
.year{justify-self:center;color:var(--muted)}
.menu-button{justify-self:end;padding:0}

/* menu */
.menu-panel{position:fixed;inset:0;background:#101010;color:#fff;z-index:400;display:flex;flex-direction:column;padding:18px var(--pad);opacity:0;pointer-events:none;transition:opacity .28s ease}
body.menu-open .menu-panel{opacity:1;pointer-events:auto}
.menu-meta,.menu-bottom{display:flex;justify-content:space-between;gap:20px;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.72);font-weight:700}
.menu-nav{display:flex;flex-direction:column;gap:2px;margin:auto 0}
.menu-nav a{display:grid;grid-template-columns:40px minmax(0,1fr) 290px;gap:20px;align-items:end;padding:12px 0;border-top:1px solid rgba(255,255,255,.15)}
.menu-nav a:last-child{border-bottom:1px solid rgba(255,255,255,.15)}
.menu-nav small{font-size:12px;color:rgba(255,255,255,.5);font-weight:700}
.menu-nav span{font-size:clamp(40px,5vw,72px);line-height:.95;letter-spacing:-.06em;font-weight:700}
.menu-nav b{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.68);font-weight:600;text-align:right}

/* home */
.hero-refined{padding:48px var(--pad) 34px}
.hero-refined__meta,.hero-refined__bottom{display:flex;justify-content:space-between;gap:20px}
.hero-refined__meta{padding-bottom:20px;border-bottom:1px solid var(--line)}
.hero-refined__grid{display:grid;grid-template-columns:1.05fr 1.4fr .9fr;gap:36px;align-items:end;padding:30px 0 42px;min-height:72svh}
.hero-refined__lead p,.hero-refined__side li,.hero-refined__bottom span,.hero-refined__bottom a{font-size:15px;color:var(--muted)}
.hero-refined__lead p{max-width:420px;margin:0}
.hero-refined__title h1{margin:0;font-size:clamp(70px,11vw,170px);line-height:.88;letter-spacing:-.09em;font-weight:700}
.hero-refined__title p{margin:10px 0 0;font-size:14px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.hero-refined__side ul{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.hero-refined__side li{border-top:1px solid var(--line);padding-top:10px}
.hero-refined__side span{display:block;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:4px}
.hero-refined__side b{font-size:15px;line-height:1.4;font-weight:600;color:var(--ink)}
.hero-refined__bottom{padding-top:18px;border-top:1px solid var(--line)}
.hero-refined__bottom a{color:var(--ink);font-weight:600}

.project-list,.statement-block,.cuts-refined,.resume-refined,.detail-gallery-refined,.other-projects-refined{padding:0 var(--pad)}
.project-list{padding-bottom:96px}
.project-row{border-bottom:1px solid var(--line)}
.project-row__link{display:grid;grid-template-columns:110px minmax(0,1.15fr) minmax(300px,.9fr);gap:24px;align-items:center;padding:28px 0}
.project-row__meta span{display:block;font-size:13px;font-weight:700;margin-bottom:10px}
.project-row__meta small{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:700}
.project-row__title{margin-bottom:14px}
.project-row__title h3{margin:0;font-size:clamp(34px,4.1vw,68px);line-height:.94;letter-spacing:-.07em;font-weight:700}
.project-row__title p{margin:8px 0 0;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.project-row__copy p{margin:0 0 16px;font-size:16px;max-width:640px}
.project-row__copy ul{display:flex;flex-wrap:wrap;gap:10px;list-style:none;margin:0;padding:0}
.project-row__copy li{padding:7px 12px;border:1px solid var(--line);border-radius:999px;font-size:12px;color:var(--muted)}
.project-row__media{position:relative;overflow:hidden;background:var(--paper-2);border-radius:18px}
.project-row__media img,.project-row__media video{width:100%;height:100%;object-fit:cover}
.project-row__media video{position:absolute;inset:0;opacity:0;transition:opacity .3s ease}
.project-row__media em{position:absolute;left:16px;bottom:14px;padding:7px 10px;border-radius:999px;background:rgba(255,255,255,.85);font-size:11px;font-style:normal;font-weight:700}
.project-row:hover .project-row__media video{opacity:1}
.media-ratio-landscape{aspect-ratio:1.24/1}
.media-ratio-portrait{aspect-ratio:1.1/1}

.statement-block{padding-top:24px;padding-bottom:96px}
.statement-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;padding-top:28px}
.statement-card{padding:22px;border:1px solid var(--line);border-radius:18px;background:#f8f7f3}
.statement-card span{display:block;font-size:12px;color:var(--muted);margin-bottom:20px;font-weight:700}
.statement-card h3{margin:0 0 10px;font-size:22px;letter-spacing:-.04em}
.statement-card p{margin:0;font-size:15px;color:#4d4a44}

.cuts-refined{padding-top:24px;padding-bottom:96px}
.cuts-grid-refined{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding-top:28px}
.cut-card-refined video{aspect-ratio:1.14/1;object-fit:cover;border-radius:16px;background:#1a1a1a;transition:transform .35s ease,filter .35s ease}
.cut-card-refined:hover video{transform:scale(.985);filter:saturate(1.08)}
.cut-card-refined div{display:flex;justify-content:space-between;gap:10px;padding-top:8px}
.cut-card-refined span{font-size:11px;color:var(--muted);font-weight:700}
.cut-card-refined b{font-size:15px}

.resume-refined{padding-top:24px;padding-bottom:100px}
.resume-link{font-size:14px;font-weight:600;color:var(--ink)}
.resume-refined__grid{display:grid;grid-template-columns:1.1fr 1fr;gap:28px;padding-top:28px}
.resume-refined__profile,.resume-refined__rows{padding:22px;border:1px solid var(--line);border-radius:18px;background:#f8f7f3}
.resume-refined__profile{display:grid;grid-template-columns:120px 1fr;gap:20px;align-items:start}
.resume-refined__profile img{width:120px;aspect-ratio:1/1.2;object-fit:cover;border-radius:14px}
.resume-refined__profile h3{margin:0 0 12px;font-size:24px;letter-spacing:-.04em}
.resume-refined__profile p,.resume-item p{margin:0;color:#4d4a44;font-size:15px}
.resume-refined__rows{display:grid;gap:18px}
.resume-item{padding-top:12px;border-top:1px solid var(--line)}
.resume-item:first-child{padding-top:0;border-top:0}
.resume-item span{display:block;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:6px;font-weight:700}
.resume-item b{display:block;font-size:20px;letter-spacing:-.03em;margin-bottom:4px}

.footer-refined{padding:24px var(--pad) 30px;background:#101010;color:#fff}
.footer-refined__top,.footer-refined__bottom{display:flex;justify-content:space-between;gap:20px}
.footer-refined__main{display:grid;grid-template-columns:1.3fr .9fr;gap:26px;align-items:end;padding:56px 0 70px}
.footer-refined h2{margin:0;font-size:clamp(48px,8vw,108px);line-height:.92;letter-spacing:-.08em;font-weight:700}
.footer-refined__info p{margin:0 0 20px;font-size:18px;color:rgba(255,255,255,.78)}
.footer-refined__info div{display:grid;gap:10px}
.footer-refined__info a,.footer-refined__info span{font-size:15px;color:rgba(255,255,255,.88)}
.footer-refined__bottom{padding-top:16px;border-top:1px solid rgba(255,255,255,.12);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.64)}

/* detail page */
.project-main{padding-bottom:96px}
.detail-topbar{position:sticky}
.detail-hero-refined{padding:38px var(--pad) 0}
.detail-hero-refined__eyebrow{display:flex;justify-content:space-between;gap:20px;padding-bottom:18px;border-bottom:1px solid var(--line)}
.detail-hero-refined__grid{display:grid;grid-template-columns:1.4fr .8fr;gap:32px;align-items:end;padding:24px 0 18px}
.detail-hero-refined__title p{margin:0 0 10px;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);font-weight:700}
.detail-hero-refined__title h1{margin:0;font-size:clamp(48px,6vw,88px);line-height:.95;letter-spacing:-.07em;font-weight:700}
.detail-hero-refined__summary{padding:18px;border:1px solid var(--line);border-radius:18px;background:#f8f7f3}
.detail-hero-refined__summary span{display:block;margin-bottom:8px;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:700}
.detail-hero-refined__summary p{margin:0;font-size:16px;color:#3f3c36}
.detail-hero-refined__meta{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding-top:12px}
.detail-hero-refined__meta div{padding:15px;border:1px solid var(--line);border-radius:16px;background:#f8f7f3}
.detail-hero-refined__meta span{display:block;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:8px;font-weight:700}
.detail-hero-refined__meta b{font-size:15px;line-height:1.4;font-weight:600}

.showcase-grid{display:grid;grid-template-columns:1.55fr .85fr;gap:20px;padding:26px var(--pad) 0}
.showcase-grid__video{background:#111;border-radius:20px;overflow:hidden}
.showcase-grid__video video{width:100%;height:100%;min-height:420px;background:#111}
.showcase-grid__aside{display:block}
.sidebar-panel{height:100%;padding:18px;border:1px solid var(--line);border-radius:20px;background:#f8f7f3}
.sidebar-panel__head{padding-bottom:14px;border-bottom:1px solid var(--line)}
.sidebar-panel__head span{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);font-weight:700}
.sidebar-panel__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;padding-top:16px}
.sidebar-stat{padding:16px;background:#fff;border-radius:16px;border:1px solid rgba(18,18,18,.08);min-height:92px;display:flex;flex-direction:column;justify-content:space-between}
.sidebar-stat strong{font-size:clamp(20px,2.1vw,32px);line-height:1;letter-spacing:-.05em}
.sidebar-stat span{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.sidebar-panel__note{margin:16px 0 0;font-size:14px;color:#4d4a44}

.detail-copy-section{display:grid;grid-template-columns:200px 1fr;gap:20px;padding:70px var(--pad) 0}
.detail-copy-section__body{max-width:980px}
.detail-copy-section__body h2{margin:0 0 18px;font-size:clamp(28px,3.2vw,46px);line-height:1.06;letter-spacing:-.05em;font-weight:700}
.detail-copy-section__body p{margin:0;font-size:18px;line-height:1.8;color:#36332e}

.info-modules{display:grid;grid-template-columns:1fr 1fr;gap:18px;padding:40px var(--pad) 0}
.info-module{padding:22px;border:1px solid var(--line);border-radius:18px;background:#f8f7f3}
.info-module h3{margin:8px 0 14px;font-size:24px;letter-spacing:-.04em}
.info-module p{margin:0;font-size:16px;color:#403d37}
.info-module ol{margin:0;padding-left:18px;display:grid;gap:8px}
.info-module li{font-size:16px;color:#403d37}

.detail-gallery-refined{padding-top:56px}
.detail-gallery-refined__grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding-top:28px}
.gallery-card{margin:0;border-radius:18px;overflow:hidden;background:#eceae4;border:1px solid rgba(18,18,18,.05)}
.gallery-card.wide{grid-column:1/-1}
.gallery-card img,.gallery-card video{width:100%;height:100%;object-fit:cover;background:#111;max-height:72svh}
.gallery-card figcaption{padding:10px 14px;font-size:13px;color:var(--muted);background:#f8f7f3}

.future-audience{display:grid;grid-template-columns:1fr 1fr;gap:18px;padding:56px var(--pad) 0}
.future-audience__card{padding:24px;border-radius:18px;background:#111;color:#fff}
.future-audience__card h3{margin:8px 0 14px;font-size:24px;letter-spacing:-.04em}
.future-audience__card p{margin:0;font-size:16px;line-height:1.75;color:rgba(255,255,255,.82)}

.other-projects-refined{padding-top:56px}
.other-grid-refined{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding-top:24px}
.other-card-refined{display:block;padding:12px;border:1px solid var(--line);border-radius:18px;background:#f8f7f3}
.other-card-refined img{width:100%;aspect-ratio:1.2/1;object-fit:cover;border-radius:12px}
.other-card-refined div{padding:14px 4px 4px}
.other-card-refined span{display:block;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:8px;font-weight:700}
.other-card-refined b{display:block;font-size:24px;letter-spacing:-.04em;margin-bottom:6px}
.other-card-refined p{margin:0;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#55524c}

.detail-footer-refined{background:var(--accent);color:#fff;padding:30px var(--pad);min-height:40svh;display:flex;align-items:flex-end}
.detail-footer-refined>div{display:flex;justify-content:space-between;align-items:end;gap:26px;width:100%;padding-top:16px;border-top:1px solid rgba(255,255,255,.3)}
.detail-footer-refined a{font-size:clamp(34px,5vw,64px);line-height:.94;letter-spacing:-.06em;font-weight:700;text-align:right}

/* responsive */
@media (max-width:1100px){
  .project-row__link,.detail-hero-refined__grid,.showcase-grid,.resume-refined__grid,.footer-refined__main{grid-template-columns:1fr}
  .project-row__media{order:-1;max-width:680px}
  .detail-hero-refined__meta{grid-template-columns:1fr 1fr}
  .detail-copy-section{grid-template-columns:1fr}
  .statement-grid,.future-audience,.info-modules,.other-grid-refined{grid-template-columns:1fr}
  .hero-refined__grid{grid-template-columns:1fr;min-height:auto;padding-bottom:24px}
}

@media (max-width:820px){
  :root{--pad:16px}
  .topbar{grid-template-columns:1fr auto;grid-template-areas:"brand btn" "year year";row-gap:6px}
  .brand{grid-area:brand}.menu-button{grid-area:btn}.year{grid-area:year;justify-self:start}
  .menu-nav a{grid-template-columns:30px 1fr;gap:12px;align-items:start}
  .menu-nav span{font-size:14vw}.menu-nav b{grid-column:2;text-align:left}
  .hero-refined{padding-top:24px}.hero-refined__meta,.hero-refined__bottom,.detail-hero-refined__eyebrow,.footer-refined__top,.footer-refined__bottom,.detail-footer-refined>div{flex-direction:column;align-items:flex-start}
  .hero-refined__title h1{font-size:20vw}.hero-refined__lead p,.hero-refined__side b,.project-row__copy p,.section-head p,.detail-copy-section__body p,.future-audience__card p,.info-module p,.info-module li{font-size:15px}
  .section-head{align-items:start;flex-direction:column}
  .project-row__link{grid-template-columns:1fr;padding:24px 0}
  .project-row__meta{display:flex;justify-content:space-between;align-items:center}
  .project-row__title h3{font-size:17vw;line-height:.88}
  .project-row__media{max-width:none}
  .cuts-grid-refined{grid-template-columns:1fr 1fr}
  .resume-refined__profile{grid-template-columns:90px 1fr}.resume-refined__profile img{width:90px}
  .detail-hero-refined__title h1{font-size:14vw}
  .detail-hero-refined__meta,.sidebar-panel__grid,.detail-gallery-refined__grid{grid-template-columns:1fr}
  .showcase-grid__video video{min-height:auto;aspect-ratio:16/10;object-fit:contain}
  .gallery-card.wide{grid-column:auto}
  .footer-refined h2{font-size:14vw}
  .detail-footer-refined a{font-size:13vw;text-align:left}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  [data-reveal]{opacity:1!important;transform:none!important}
  .loader{display:none}
}
