:root{
  --red:        #E02B23;
  --red-deep:   #B01C16;
  --red-ink:    #7E120E;
  --yellow:     #F5C900;
  --yellow-lit: #FFDD2E;
  --vinyl:      #E7E052;
  --lime:       #86C81B;
  --lime-lit:   #A8DE2B;
  --ink:        #16150F;
  --ink-soft:   #3A382C;
  --cream:      #FFF7DC;
  --white:      #ffffff;

  --shadow-hard: 0 6px 0 rgba(0,0,0,.28);
  --shadow-soft: 0 18px 40px -18px rgba(0,0,0,.55);

  --wrap: 1180px;
  --pad: clamp(18px, 4vw, 44px);

  --f-display: "Anton", "Arial Narrow", Impact, sans-serif;
  --f-heavy:   "Archivo Black", "Arial Black", sans-serif;
  --f-cond:    "Barlow Condensed", "Arial Narrow", sans-serif;
  --f-body:    "Barlow", system-ui, -apple-system, "Segoe UI", sans-serif;
}

/* reset */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  margin:0;
  font-family:var(--f-body);
  font-size:clamp(16px,1.05vw,17.5px);
  line-height:1.65;
  color:var(--ink);
  background:var(--cream);
  overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; }
button{ font:inherit; color:inherit; }
h1,h2,h3{ margin:0; line-height:.94; }
p{ margin:0 0 1em; }
ul,ol,dl,dd{ margin:0; padding:0; list-style:none; }

/* helpers */
.wrap{ width:min(var(--wrap),100% - (var(--pad)*2)); margin-inline:auto; }
.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}
.skip-link{
  position:absolute; left:-9999px; top:0; z-index:999;
  background:var(--red); color:#fff; padding:12px 20px; font-family:var(--f-cond);
  font-weight:700; text-transform:uppercase; letter-spacing:.08em; text-decoration:none;
}
.skip-link:focus{ left:8px; top:8px; }

:focus-visible{ outline:3px solid var(--ink); outline-offset:3px; }

.tex-corrugated{
  background-image:
    repeating-linear-gradient(90deg,
      rgba(0,0,0,.22) 0 1px,
      rgba(0,0,0,.10) 1px 3px,
      rgba(255,255,255,.16) 6px 9px,
      rgba(255,255,255,.05) 9px 13px,
      rgba(0,0,0,0) 13px 26px);
}

.tex-block{
  background-image:
    repeating-linear-gradient(0deg, rgba(0,0,0,.10) 0 1px, transparent 1px 46px),
    repeating-linear-gradient(90deg, rgba(0,0,0,.08) 0 1px, transparent 1px 96px);
}

.eyebrow{
  font-family:var(--f-cond); font-weight:700; font-size:.95rem;
  text-transform:uppercase; letter-spacing:.22em;
  margin:0 0 .7em;
}
.eyebrow--red{ color:var(--red); }
.eyebrow--yellow{ color:var(--yellow-lit); }

.h2{
  font-family:var(--f-display);
  font-size:clamp(2.6rem,6.4vw,4.6rem);
  text-transform:uppercase; letter-spacing:.005em;
  margin:0 0 .45em;
}
.h2 em{ font-style:normal; color:var(--red); }
.h2--onred{ color:#fff; text-shadow:0 5px 0 var(--red-ink); }
.h2--onred em{ color:var(--yellow-lit); }

.lead{ font-size:1.08rem; max-width:56ch; color:var(--ink-soft); }

[data-reveal]{
  opacity:0; transform:translateY(26px);
  transition:opacity .7s ease, transform .7s cubic-bezier(.2,.7,.3,1);
}
[data-reveal].is-in{ opacity:1; transform:none; }