:root {
  --paper: #f6f2ea;
  --ink: #0b0b0b;
  --signal: #ff2d18;
  --muted: #7a756e;
  --rule: rgba(11,11,11,.22);
  --pad: clamp(18px, 3.2vw, 52px);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: 'Instrument Sans', Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }
::selection { background: var(--signal); color: var(--paper); }

.mono { font-family: 'DM Mono', monospace; text-transform: uppercase; letter-spacing: .05em; font-size: 10px; }
em { font-family: 'Libre Caslon Display', Georgia, serif; font-weight: 400; }

.site-header {
  position: fixed; inset: 0 0 auto 0; z-index: 30;
  min-height: 62px; padding: 14px var(--pad);
  display: grid; grid-template-columns: 1fr 1fr auto; align-items: center; gap: 24px;
  background: color-mix(in srgb, var(--paper) 92%, transparent);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--rule);
}
.brand { display:flex; align-items:center; line-height:1; }
.brand img { display:block; width:88px; height:auto; }
.header-note { margin: 0; font-family:'DM Mono', monospace; text-transform: uppercase; font-size: 9px; letter-spacing:.06em; }
.nav { display:flex; gap: 19px; font-family:'DM Mono', monospace; text-transform:uppercase; font-size:9px; letter-spacing:.04em; }
.nav a { position: relative; }
.nav a::after { content:""; position:absolute; left:0; right:100%; bottom:-4px; height:2px; background:var(--signal); transition:right .22s ease; }
.nav a:hover::after { right:0; }

.hero { min-height:100svh; position:relative; display:flex; align-items:flex-end; padding:105px var(--pad) 34px; border-bottom:1px solid var(--rule); overflow:hidden; }
.hero-meta { position:absolute; top:86px; left:var(--pad); right:var(--pad); display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--ink); padding-top:8px; }
.hero-main { width:100%; position:relative; z-index:2; }
.hero-kicker { margin:0 0 9px; font-size:clamp(13px,1.2vw,17px); text-transform:uppercase; letter-spacing:-.01em; }
.hero-logo-wrap { margin:0 0 26px; width:100%; display:flex; align-items:center; justify-content:flex-start; }
.hero-logo { display:block; width:min(72vw, 1180px); height:auto; object-fit:contain; }
.hero-grid { display:grid; grid-template-columns:1.05fr .95fr; gap:40px; align-items:end; border-top:1px solid var(--ink); padding-top:18px; }
.hero-statement { margin:0; font-size:clamp(40px,6.3vw,94px); line-height:.84; letter-spacing:-.065em; font-weight:600; }
.hero-statement em { color:var(--signal); font-size:1.12em; }
.hero-copy { justify-self:end; max-width:480px; font-size:clamp(19px,2vw,30px); line-height:1.08; letter-spacing:-.035em; }
.hero-copy p { margin:0 0 26px; }
.underlink { display:inline-block; border-bottom:2px solid var(--signal); padding-bottom:3px; font-size:14px; }
.scroll-note { position:absolute; right:var(--pad); bottom:9px; }

.scribble { position:absolute; fill:none; stroke:var(--signal); stroke-width:7; stroke-linecap:round; stroke-linejoin:round; pointer-events:none; }
.scribble-hero { width:min(58vw,900px); top:12%; right:-4%; opacity:.98; transform:rotate(-3deg); }

.culture-strip { background:var(--signal); color:var(--paper); overflow:hidden; border-bottom:1px solid var(--ink); padding:10px 0 9px; }
.ticker { display:flex; width:max-content; animation:ticker 26s linear infinite; font-family:'DM Mono', monospace; font-size:11px; letter-spacing:.05em; white-space:nowrap; }
.ticker span { padding-right:36px; }
@keyframes ticker { to { transform:translateX(-50%); } }

.editorial-grid { display:grid; grid-template-columns:130px minmax(0,1.12fr) minmax(300px,.72fr); gap:clamp(26px,5vw,90px); padding:120px var(--pad); border-bottom:1px solid var(--rule); }
.issue { padding-top:9px; border-top:1px solid var(--ink); line-height:1.55; }
.section-label { margin:0 0 24px; color:var(--muted); }
.intro-title h2 { margin:0; font-size:clamp(54px,7vw,116px); line-height:.88; letter-spacing:-.07em; font-weight:600; }
.intro-title h2 em { color:var(--signal); }
.intro-copy { align-self:end; font-size:clamp(18px,1.55vw,24px); line-height:1.35; letter-spacing:-.025em; max-width:650px; }
.intro-copy p:first-child { font-size:1.12em; }

.chapter { position:relative; padding:22px var(--pad) 110px; border-bottom:1px solid var(--rule); overflow:hidden; }
.chapter-top { display:grid; grid-template-columns:110px 1fr auto; padding-bottom:18px; border-bottom:1px solid currentColor; }
.chapter-layout { display:grid; grid-template-columns:1.16fr .84fr; gap:70px; align-items:end; padding-top:45px; }
.chapter h2 { margin:0; font-size:clamp(104px,17vw,260px); line-height:.72; letter-spacing:-.105em; font-weight:650; }
.accent { color:var(--signal); }
.chapter-copy { max-width:670px; justify-self:end; }
.chapter-copy .lead { margin:0 0 22px; font-size:clamp(30px,3vw,49px); line-height:1; letter-spacing:-.05em; }
.chapter-copy > p:not(.lead) { margin:0; font-size:18px; line-height:1.45; }
.service-list { margin-top:46px; display:flex; flex-wrap:wrap; gap:8px; }
.service-list span { border:1px solid currentColor; padding:7px 10px 6px; border-radius:999px; }
.chapter-scribble { width:390px; right:4vw; bottom:-20px; opacity:.9; }
.inverse { background:var(--ink); color:var(--paper); }
.inverse .accent { color:var(--signal); }
.side-word { position:absolute; right:-15px; top:52%; transform:rotate(90deg) translateX(50%); transform-origin:right top; font-family:'Libre Caslon Display', serif; font-style:italic; color:var(--signal); font-size:18px; letter-spacing:.02em; }

.manifesto-panel { position:relative; min-height:86svh; padding:110px var(--pad); display:grid; grid-template-columns:1.25fr .75fr; align-items:end; gap:60px; background:var(--signal); color:var(--paper); overflow:hidden; }
.manifesto-copy, .manifesto-side { position:relative; z-index:2; }
.manifesto-copy .section-label { color:rgba(246,242,234,.72); }
.manifesto-copy h2 { margin:0; font-size:clamp(84px,13vw,205px); line-height:.76; letter-spacing:-.09em; font-weight:650; }
.manifesto-copy h2 em { color:var(--ink); }
.manifesto-side { max-width:600px; font-size:clamp(20px,2vw,29px); line-height:1.25; letter-spacing:-.03em; }
.scribble-manifesto { stroke:var(--ink); width:min(45vw,560px); top:2%; right:4%; opacity:.92; }

.contact { position:relative; min-height:90svh; padding:22px var(--pad) 65px; display:flex; flex-direction:column; justify-content:space-between; overflow:hidden; }
.contact-top { display:grid; grid-template-columns:1fr 1fr auto; padding-bottom:18px; border-bottom:1px solid var(--ink); }
.contact-inner { position:relative; z-index:2; padding-top:80px; }
.contact h2 { margin:0; font-size:clamp(86px,14.5vw,225px); line-height:.75; letter-spacing:-.09em; font-weight:650; }
.contact h2 em { color:var(--signal); }
.contact-desc { margin:48px 0 26px; max-width:650px; font-size:clamp(19px,2vw,29px); line-height:1.22; letter-spacing:-.035em; }
.mail-link { display:inline-block; font-size:clamp(22px,3vw,46px); border-bottom:4px solid var(--signal); padding-bottom:5px; letter-spacing:-.04em; }
.contact-scribble { width:min(54vw,780px); right:-9%; bottom:-7%; stroke-width:8; opacity:.96; }

.footer { padding:16px var(--pad) 20px; display:grid; grid-template-columns:1fr 1fr auto; gap:20px; border-top:1px solid var(--rule); }

.reveal { opacity:0; transform:translateY(22px); transition:opacity .72s cubic-bezier(.2,.65,.25,1), transform .72s cubic-bezier(.2,.65,.25,1); }
.reveal.is-visible { opacity:1; transform:none; }

@media (max-width: 950px) {
  .header-note { display:none; }
  .site-header { grid-template-columns:1fr auto; }
  .hero-meta { grid-template-columns:repeat(2,1fr); row-gap:5px; }
  .hero-grid, .chapter-layout, .manifesto-panel { grid-template-columns:1fr; }
  .hero-copy, .chapter-copy { justify-self:start; }
  .editorial-grid { grid-template-columns:70px 1fr; }
  .intro-copy { grid-column:2; }
  .manifesto-panel { align-items:start; }
  .manifesto-side { margin-top:120px; }
}

@media (max-width: 650px) {
  .site-header { min-height:55px; padding-top:12px; padding-bottom:12px; }
  .brand img { width:74px; }
  .nav a:not(:last-child) { display:none; }
  .hero { min-height:94svh; padding-top:90px; }
  .hero-meta { top:70px; }
  .hero-meta span:nth-child(2), .hero-meta span:nth-child(3) { display:none; }
  .hero-meta { grid-template-columns:1fr auto; }
  .hero-logo-wrap { margin-top:72px; margin-bottom:20px; }
  .hero-logo { width:94vw; max-width:none; }
  .hero-grid { gap:28px; }
  .hero-statement { font-size:15vw; }
  .hero-copy { font-size:22px; }
  .scribble-hero { width:95vw; top:18%; right:-32%; stroke-width:8; }
  .scroll-note { display:none; }
  .editorial-grid { grid-template-columns:1fr; padding-top:76px; padding-bottom:76px; gap:35px; }
  .issue { max-width:130px; }
  .intro-copy { grid-column:auto; }
  .intro-title h2 { font-size:15vw; }
  .chapter { padding-bottom:78px; }
  .chapter-top { grid-template-columns:44px 1fr auto; }
  .chapter-top span:last-child { display:none; }
  .chapter-layout { padding-top:38px; gap:45px; }
  .chapter h2 { font-size:27vw; }
  .chapter-copy .lead { font-size:34px; }
  .chapter-copy > p:not(.lead) { font-size:17px; }
  .service-list { margin-top:32px; }
  .service-list span { font-size:8px; }
  .chapter-scribble { width:260px; right:-65px; }
  .side-word { display:none; }
  .manifesto-panel { min-height:auto; padding-top:85px; padding-bottom:85px; gap:40px; }
  .manifesto-copy h2 { font-size:21vw; }
  .manifesto-side { margin-top:75px; font-size:21px; }
  .scribble-manifesto { width:88vw; right:-32%; top:5%; }
  .contact { min-height:82svh; }
  .contact-top { grid-template-columns:1fr auto; }
  .contact-top span:nth-child(2) { display:none; }
  .contact-inner { padding-top:65px; }
  .contact h2 { font-size:21vw; }
  .mail-link { font-size:7vw; border-bottom-width:3px; }
  .contact-scribble { width:105vw; right:-50%; }
  .footer { grid-template-columns:1fr auto; }
  .footer span:nth-child(2) { display:none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  .reveal { opacity:1; transform:none; transition:none; }
  .ticker { animation:none; }
}
