/* ============ FVÆ — TOKENS ============ */
:root{
  --bg:#F8F8F6;
  --ink:#0A0A0A;
  --meta:#888888;
  --rule:#E5E5E2;
  --s1:8px; --s2:16px; --s3:24px; --s4:32px;
  --s6:48px; --s8:64px; --s12:96px; --s16:128px; --s20:160px; --s24:192px;
  --max:1280px;
  --display:'Archivo',sans-serif;
  --mono:'Space Mono',monospace;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}
body{
  background:var(--bg); color:var(--ink);
  font-family:var(--display); font-weight:300;
  font-size:17px; line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible,input:focus-visible{outline:1px solid var(--ink);outline-offset:3px}
img,svg,video{display:block;width:100%;height:auto}

/* ============ TYPE ============ */
.h-giant{font-size:clamp(52px,10vw,128px);font-weight:500;line-height:0.95;letter-spacing:-0.02em}
.h1{font-size:clamp(44px,7vw,92px);font-weight:500;line-height:0.98;letter-spacing:-0.02em}
.mono{font-family:var(--mono);font-size:12px;letter-spacing:0.15em;text-transform:uppercase}
.mono-s{font-family:var(--mono);font-size:11px;letter-spacing:0.12em;text-transform:uppercase}
.meta{color:var(--meta)}
.body-text{max-width:58ch}

/* ============ GRID ============ */
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--s4)}
.g12{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--s3)}
.hairline{border:none;border-top:1px solid var(--rule)}

/* ============ NAV ============ */
nav{position:fixed;top:0;left:0;right:0;z-index:100;background:rgba(248,248,246,0.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--rule)}
.nav-inner{max-width:var(--max);margin:0 auto;padding:var(--s2) var(--s4);display:flex;justify-content:space-between;align-items:baseline}
.logo{font-weight:600;font-size:14px;letter-spacing:0.08em}
.nav-links{display:flex;gap:var(--s4)}
.nav-links a{transition:color .2s}
.nav-links a:hover{color:var(--meta)}

/* ============ HOME HERO ============ */
.hero{padding:calc(57px + var(--s20)) 0 var(--s24)}
.hero-index{display:flex;justify-content:space-between;margin-bottom:var(--s8)}
.hero-wordmark{margin-bottom:var(--s12)}
.hero-lower{align-items:end}
.hero-mission{grid-column:1/5;align-self:end}
.hero-mission p{font-size:15px;max-width:34ch}
.hero-mission .mono-s{display:block;margin-bottom:var(--s2)}
.hero-visual{grid-column:6/13;position:relative}
.hero-visual .frame{aspect-ratio:16/10;overflow:hidden}
.hero-visual .frame img,.hero-visual .frame video{height:100%;object-fit:cover}
.hero-visual .cap{margin-top:var(--s1);display:flex;justify-content:space-between}

/* ============ SERIES INDEX — staggered rows ============ */
.series-row{align-items:center;display:grid;grid-template-columns:repeat(12,1fr);gap:var(--s3)}
.series-row + .series-row{margin-top:var(--s24)}
.series-row .img{overflow:hidden;border:1px solid transparent;transition:filter .25s,border-color .25s}
.series-row .img img{height:100%;object-fit:cover}
.series-row:hover .img{filter:brightness(1.06);border-color:var(--ink)}
.series-row .txt .code{color:var(--meta);margin-bottom:var(--s2)}
.series-row .txt .name{font-size:clamp(30px,4vw,52px);font-weight:500;line-height:1.0;letter-spacing:-0.01em}
.series-row .txt .desc{color:var(--meta);font-size:15px;margin-top:var(--s2);max-width:32ch}
.row-arrow{font-family:var(--mono);font-size:16px;margin-top:var(--s3);display:inline-block;transition:transform .2s}
.series-row:hover .row-arrow{transform:translateX(8px)}
.row-a .img{grid-column:1/8;aspect-ratio:4/3}
.row-a .txt{grid-column:9/13}
.row-b .txt{grid-column:1/5;order:1}
.row-b .img{grid-column:6/12;aspect-ratio:4/5;order:2}
.row-c .img{grid-column:3/9;aspect-ratio:1/1}
.row-c .txt{grid-column:10/13}

/* ============ ABOUT ============ */
.about{align-items:start}
.about .label{grid-column:1/3}
.about .txt{grid-column:6/12}
.about .txt p{font-size:clamp(19px,2vw,24px);font-weight:300;line-height:1.5}

/* ============ SERIES PAGE ============ */
.crumb{padding:calc(57px + var(--s8)) 0 0}
.series-title{padding:var(--s8) 0 var(--s12)}
.series-title .code{color:var(--meta);margin-bottom:var(--s3)}
.reel-block{align-items:start}
.reel-block .reel{grid-column:2/13;aspect-ratio:16/8;overflow:hidden}
.reel-block .reel img,.reel-block .reel video{height:100%;object-fit:cover}
.reel-block .marg{grid-column:1/2;writing-mode:vertical-rl;transform:rotate(180deg);align-self:end;color:var(--meta)}
.reel-cap{grid-column:2/13;margin-top:var(--s1);display:flex;justify-content:space-between}

.statement{align-items:start;padding:var(--s20) 0}
.statement .label{grid-column:1/3}
.statement .repeat{grid-column:1/5;margin-top:var(--s6);font-size:clamp(28px,3.5vw,46px);font-weight:500;line-height:1.02}
.statement .txt{grid-column:7/13}
.statement .txt p{font-size:clamp(18px,1.8vw,21px);line-height:1.6}

/* ============ GALLERY — specimen rhythm ============ */
.gal-block + .gal-block{margin-top:var(--s16)}
.gal-item{position:relative}
.gal-item .frame{overflow:hidden}
.gal-item .frame img{height:100%;object-fit:cover}
.gal-item .cap{margin-top:var(--s1);display:flex;justify-content:space-between;color:var(--meta)}
.gal-solo .gal-item{grid-column:3/11}
.gal-solo .frame{aspect-ratio:16/10}
.gal-pair .gal-item:first-child{grid-column:1/7}
.gal-pair .gal-item:last-child{grid-column:8/13;margin-top:var(--s16)}
.gal-pair .frame{aspect-ratio:4/5}
.gal-small .gal-item{grid-column:5/10}
.gal-small .frame{aspect-ratio:1/1}

/* ============ ASSETS — catalogue list ============ */
.assets-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:var(--s4)}
.asset-row{
  display:grid;grid-template-columns:72px 1fr 1fr 120px 80px 130px;
  gap:var(--s3);align-items:center;
  padding:var(--s3) 0;border-top:1px solid var(--rule);
  transition:border-color .25s;
}
.asset-row:last-of-type{border-bottom:1px solid var(--rule)}
.asset-row:hover{border-top-color:var(--ink)}
.asset-row .athumb{width:72px;height:72px;overflow:hidden}
.asset-row .athumb img{height:100%;object-fit:cover}
.asset-row .aname{font-size:17px;font-weight:400}
.asset-row .aout{justify-self:end;transition:transform .2s,color .2s;color:var(--meta)}
.asset-row:hover .aout{transform:translateX(6px);color:var(--ink)}

/* ============ NEXT ============ */
.next-series{display:flex;justify-content:flex-end;padding:var(--s20) 0 var(--s12)}
.next-series a{text-align:right;display:block}
.next-series .nlabel{font-family:var(--mono);font-size:12px;letter-spacing:0.15em;color:var(--meta);text-transform:uppercase}
.next-series .nname{font-size:clamp(34px,6vw,72px);font-weight:500;margin-top:var(--s1);transition:transform .2s;display:inline-block;line-height:1}
.next-series a:hover .nname{transform:translateX(12px)}

/* ============ LICENSING / TEXT PAGES ============ */
.text-page{padding:calc(57px + var(--s12)) 0 var(--s20)}
.text-page .g12{align-items:start}
.text-page .label{grid-column:1/3}
.text-page .txt{grid-column:5/11}
.text-page h1{font-size:clamp(34px,5vw,64px);font-weight:500;line-height:1;margin-bottom:var(--s8)}
.text-page .txt p + p{margin-top:var(--s3)}
.text-page .txt h2{font-size:20px;font-weight:500;margin:var(--s6) 0 var(--s2)}

/* ============ FOOTER ============ */
footer{border-top:1px solid var(--rule);padding:var(--s8) 0}
.footer-grid{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:var(--s4);align-items:start}
.footer-links{display:flex;flex-direction:column;gap:6px}
.footer-links a{color:var(--meta);transition:color .2s}
.footer-links a:hover{color:var(--ink)}
.transmissions{display:flex;border-bottom:1px solid var(--ink);max-width:300px}
.transmissions input{flex:1;background:none;border:none;font-family:var(--mono);font-size:12px;letter-spacing:0.1em;padding:8px 0;color:var(--ink)}
.transmissions input::placeholder{color:var(--meta)}
.transmissions button{background:none;border:none;cursor:pointer;font-family:var(--mono);font-size:14px;color:var(--ink);padding:0 4px}
.tx-confirm{font-family:var(--mono);font-size:11px;letter-spacing:0.1em;color:var(--meta);margin-top:8px;min-height:14px}

/* ============ REVEAL ============ */
.reveal{opacity:0;transform:translateY(14px);transition:opacity .7s ease,transform .7s ease}
.reveal.in{opacity:1;transform:none}

/* ============ RESPONSIVE ============ */
@media (max-width:900px){
  .hero{padding:calc(57px + var(--s12)) 0 var(--s16)}
  .hero-mission{grid-column:1/13;margin-bottom:var(--s4)}
  .hero-visual{grid-column:1/13}
  .row-a .img,.row-b .img,.row-c .img{grid-column:1/13}
  .row-a .txt,.row-b .txt,.row-c .txt{grid-column:1/13;margin-top:var(--s3)}
  .row-b .txt{order:2}.row-b .img{order:1}
  .series-row + .series-row{margin-top:var(--s16)}
  .about .label{grid-column:1/13;margin-bottom:var(--s3)}
  .about .txt{grid-column:1/13}
  .reel-block .reel{grid-column:1/13;aspect-ratio:4/5}
  .reel-block .marg{display:none}
  .reel-cap{grid-column:1/13}
  .statement{padding:var(--s12) 0}
  .statement .label,.statement .repeat{grid-column:1/13}
  .statement .txt{grid-column:1/13;margin-top:var(--s4)}
  .gal-solo .gal-item,.gal-small .gal-item{grid-column:1/13}
  .gal-pair .gal-item:first-child{grid-column:1/13}
  .gal-pair .gal-item:last-child{grid-column:1/13;margin-top:var(--s8)}
  .gal-block + .gal-block{margin-top:var(--s8)}
  .asset-row{grid-template-columns:56px 1fr 80px;row-gap:4px}
  .asset-row .athumb{width:56px;height:56px;grid-row:1/3}
  .asset-row .atags{grid-column:2/3;grid-row:2}
  .asset-row .alic{display:none}
  .asset-row .aprice{grid-column:3;grid-row:1;justify-self:end}
  .asset-row .aout{grid-column:3;grid-row:2}
  .text-page .label{grid-column:1/13;margin-bottom:var(--s3)}
  .text-page .txt{grid-column:1/13}
  .footer-grid{grid-template-columns:1fr}
}