/* ft-hidden-guard v1 */
[hidden]{display:none!important;}
:root{
  --space-xs: 6px;
  --space-sm: 14px;
  --space-md: 18px;
  --space-lg: 46px;
  --space-xl: 88px;
  --card-padding-y: 25px;
  --card-padding-x: 25px;
  --card-gap: 20px;
  --card-radius: 10px;
  --card-border-width: 1px;
  --card-min-height: 324px;
  --card-min-col-width: 316px;
  --btn-padding-y: 11px;
  --btn-padding-x: 30px;
  --btn-radius: 13px;
  --btn-gap-from-text: 28px;
  --grid-gap: 33px;
  --lh-heading: 1.30;
  --lh-body: 1.59;
  --ls-heading: 0.030em;

  --bone: #f3ecd9;
  --bone-2: #ece3cc;
  --ink: #1b1a17;
  --ink-2: #3a342c;
  --oxblood: #722f37;
  --oxblood-2: #5a232a;
  --brass: #b08a3e;
  --rule: #1b1a17;
}

*, *::before, *::after { box-sizing: border-box; min-width: 0; }
img, svg, video { max-width: 100%; height: auto; display: block; }
button, input, select, textarea { font: inherit; }
html { scroll-behavior: smooth; }
body { margin: 0; }

body{
  background: var(--bone);
  background-image:
    radial-gradient(rgba(27,26,23,0.045) 1px, transparent 1px),
    radial-gradient(rgba(114,47,55,0.035) 1px, transparent 1px);
  background-size: 6px 6px, 11px 11px;
  background-position: 0 0, 3px 4px;
  color: var(--ink);
  font-family: 'CustomFont', system-ui, sans-serif;
  line-height: var(--lh-body);
  font-size: 17px;
}

.wrap{ max-width: 1080px; margin: 0 auto; padding: 0 var(--space-md); }

/* Headings, letterpress serif feel via heavier weight + tight tracking */
h1, h2, h3 {
  font-family: 'CustomFont', 'Iowan Old Style', 'Palatino Linotype', Palatino, Georgia, serif;
  font-weight: 800;
  color: var(--oxblood);
  line-height: var(--lh-heading);
  letter-spacing: var(--ls-heading);
  margin: 0 0 var(--space-md);
}
h1{ font-size: clamp(40px, 8vw, 104px); }
h2{ font-size: clamp(26px, 3.4vw, 38px); }
h3{ font-size: clamp(20px, 2.2vw, 26px); }

p{ margin: 0 0 var(--space-md); }
a{ color: var(--oxblood); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
a:hover{ color: var(--oxblood-2); }

.eyebrow{
  font-family: 'CustomFont', system-ui, sans-serif;
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--ink-2);
  margin: 0 0 var(--space-sm);
  font-weight: 700;
}

.sc{
  font-variant: small-caps;
  letter-spacing: 0.08em;
  font-weight: 700;
  color: var(--ink);
}

.hairline{
  height: 1px;
  background: var(--rule);
  opacity: 0.55;
  margin: var(--space-md) 0 var(--space-lg);
  position: relative;
}
.hairline::before, .hairline::after{
  content: "";
  position: absolute;
  top: -2.5px; width: 6px; height: 6px;
  background: var(--oxblood);
  transform: rotate(45deg);
}
.hairline::before{ left: 0; }
.hairline::after{ right: 0; }
.hairline--center{ max-width: 480px; margin-left: auto; margin-right: auto; }

.rule{
  height: 1px;
  background: var(--rule);
  opacity: 0.6;
  margin: var(--space-sm) auto 0;
  max-width: 1080px;
}
.rule--footer{ margin: 0 0 var(--space-lg); }

/* Header */
.site-header{ padding-top: var(--space-md); }
.site-header__inner{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
  flex-wrap: wrap;
}
.wordmark{
  font-family: 'CustomFont', 'Iowan Old Style', Palatino, Georgia, serif;
  font-weight: 800;
  color: var(--oxblood);
  text-decoration: none;
  font-size: 22px;
  letter-spacing: 0.04em;
}
.wordmark__amp{
  display: inline-block;
  transform: translateY(1px);
  margin-right: 2px;
  font-style: italic;
  color: var(--brass);
}
.nav{ display: flex; gap: var(--space-lg); flex-wrap: wrap; }
.nav a{
  color: var(--ink);
  text-decoration: none;
  font-size: 12px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  font-weight: 700;
  padding-bottom: 2px;
  border-bottom: 1px solid transparent;
  transition: border-color 200ms ease, color 200ms ease;
}
.nav a:hover, .nav a[aria-current="page"]{ color: var(--oxblood); border-bottom-color: var(--oxblood); }

/* Hero */
.hero{ padding: var(--space-xl) 0 var(--space-lg); }
.hero--inner{ padding: var(--space-lg) 0; }
.hero__inner{ text-align: center; }
.hero__title{ margin: 0 auto var(--space-md); max-width: 16ch; }
.hero__title--sm{ font-size: clamp(34px, 5.2vw, 60px); max-width: 24ch; }
.hero__sub{ max-width: 60ch; margin: 0 auto var(--space-md); color: var(--ink-2); font-size: 18px; }
.disclaimer-band{
  display: inline-block;
  margin-top: var(--btn-gap-from-text);
  padding: var(--space-sm) var(--space-md);
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-2);
}

/* Sections */
.section{ padding: var(--space-xl) 0; }
.section--alt{
  background: linear-gradient(180deg, var(--bone-2), var(--bone));
  border-top: 1px solid rgba(27,26,23,0.12);
  border-bottom: 1px solid rgba(27,26,23,0.12);
}
.section-head{ text-align: center; max-width: 720px; margin: 0 auto var(--space-lg); }
.section-head .eyebrow{ display: inline-block; }

/* Plates grid */
.plates{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(var(--card-min-col-width), 1fr));
  gap: var(--grid-gap);
  align-items: stretch;
}
.plate{
  background: var(--bone);
  border: var(--card-border-width) solid var(--ink);
  border-radius: var(--card-radius);
  padding: var(--card-padding-y) var(--card-padding-x);
  min-height: var(--card-min-height);
  display: flex;
  flex-direction: column;
  gap: var(--card-gap);
  position: relative;
  box-shadow: 0 1px 0 var(--ink), 6px 6px 0 -3px rgba(114,47,55,0.18);
  transition: transform 280ms ease, box-shadow 280ms ease;
}
.plate:hover{
  transform: translateY(-3px);
  box-shadow: 0 1px 0 var(--ink), 9px 10px 0 -3px rgba(114,47,55,0.28);
}
.plate__head{ text-align: center; border-bottom: 1px solid rgba(27,26,23,0.25); padding-bottom: var(--space-sm); }
.plate__no{
  display: inline-block;
  font-size: 11px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--brass);
  font-weight: 700;
  margin-bottom: var(--space-xs);
}
.plate__title{ color: var(--oxblood); margin: 0 0 var(--space-xs); }
.plate__caption{
  margin: 0;
  font-size: 12px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-2);
}
.plate__frame{
  border: 1px solid var(--ink);
  border-radius: 6px;
  padding: 8px;
  background: #fff8e8;
  position: relative;
}
.plate__frame::before, .plate__frame::after{
  content: "";
  position: absolute;
  width: 10px; height: 10px;
  border: 1px solid var(--ink);
  background: var(--bone);
}
.plate__frame::before{ top: -6px; left: -6px; }
.plate__frame::after{ bottom: -6px; right: -6px; }
.plate__blurb{ color: var(--ink-2); margin: 0; }
.plate .btn{ align-self: flex-start; margin-top: auto; }

/* Buttons */
.btn{
  display: inline-block;
  padding: var(--btn-padding-y) var(--btn-padding-x);
  border-radius: var(--btn-radius);
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  text-decoration: none;
  cursor: pointer;
  border: 1px solid var(--oxblood);
  transition: background 200ms ease, color 200ms ease, transform 200ms ease;
}
.btn--primary{ background: var(--oxblood); color: var(--bone); }
.btn--primary:hover{ background: var(--oxblood-2); color: #fff; transform: translateY(-1px); }
.btn--ghost{ background: transparent; color: var(--oxblood); }
.btn--ghost:hover{ background: rgba(114,47,55,0.08); }

/* Two-column */
.two-col{
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--grid-gap);
}
@media (min-width: 760px){
  .two-col{ grid-template-columns: 1fr 1fr; gap: var(--space-xl); }
}

.plain-list{ list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: var(--space-sm); }
.plain-list li{ padding-left: 0; }
.plain-list--cols{ display: grid; grid-template-columns: 1fr; gap: var(--space-lg); }
@media (min-width: 760px){ .plain-list--cols{ grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* FAQ */
.faq{ max-width: 760px; margin: 0 auto; display: flex; flex-direction: column; gap: var(--space-sm); }
.faq details{
  border-top: 1px solid rgba(27,26,23,0.25);
  padding: var(--space-md) 0;
}
.faq details:last-child{ border-bottom: 1px solid rgba(27,26,23,0.25); }
.faq summary{
  cursor: pointer;
  font-weight: 700;
  color: var(--oxblood);
  font-size: 17px;
  list-style: none;
  display: flex;
  justify-content: space-between;
  gap: var(--space-md);
}
.faq summary::after{ content: "+"; color: var(--brass); font-weight: 700; }
.faq details[open] summary::after{ content: "–"; }
.faq details p{ margin-top: var(--space-sm); color: var(--ink-2); }

/* Prose */
.prose{ max-width: 760px; margin: 0 auto; }
.prose h1{ font-size: clamp(34px, 5vw, 56px); }
.prose h2{ margin-top: var(--space-lg); color: var(--oxblood); }
.prose code{
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  background: rgba(114,47,55,0.08);
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 0.92em;
}
.prose ul.plain-list{ margin-bottom: var(--space-md); }

/* Footer */
.site-footer{ padding: var(--space-xl) 0 var(--space-lg); }
.footer-cols{
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-lg);
  margin-bottom: var(--space-lg);
}
@media (min-width: 760px){
  .footer-cols{ grid-template-columns: 2fr 1fr 1fr; gap: var(--space-xl); }
}
.wordmark--footer{ font-size: 22px; margin: 0 0 var(--space-sm); }
.footer-tag{ color: var(--ink-2); margin: 0 0 var(--space-sm); }
.footer-addr{ font-style: normal; color: var(--ink-2); font-size: 14px; }
.footer-h{ margin: 0 0 var(--space-sm); color: var(--ink); font-size: 12px; }
.footer-list{ list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 6px; }
.footer-list a{ text-decoration: none; color: var(--ink); }
.footer-list a:hover{ color: var(--oxblood); }
.footer-disclaimer{
  font-size: 12px;
  color: var(--ink-2);
  border-top: 1px solid rgba(27,26,23,0.25);
  padding-top: var(--space-md);
  margin-bottom: var(--space-sm);
}
.footer-copy{ font-size: 12px; color: var(--ink-2); margin: 0; letter-spacing: 0.08em; }

/* Age gate */
.age-gate{
  position: fixed; inset: 0;
  background: rgba(27,26,23,0.78);
  z-index: 1000;
  align-items: center; justify-content: center;
  padding: var(--space-md);
}
.age-gate:not([hidden]){ display: flex; }
.age-gate__card{
  background: var(--bone);
  border: 1px solid var(--ink);
  border-radius: var(--card-radius);
  padding: var(--space-lg);
  max-width: 520px;
  width: 100%;
  text-align: center;
  box-shadow: 0 1px 0 var(--ink), 8px 10px 0 -3px rgba(114,47,55,0.4);
}
.age-gate__card h2{ margin-top: 0; }
.age-gate__actions{ display: flex; gap: var(--space-sm); justify-content: center; flex-wrap: wrap; margin-top: var(--btn-gap-from-text); }

/* Cookie banner */
.cookie-banner{
  position: fixed; left: 0; right: 0; bottom: 0;
  background: var(--ink);
  color: var(--bone);
  border-top: 2px solid var(--oxblood);
  z-index: 900;
  padding: var(--space-md) 0;
}
.cookie-banner:not([hidden]){ display: block; }
.cookie-banner__inner{
  display: flex;
  align-items: center;
  gap: var(--space-md);
  flex-wrap: wrap;
  justify-content: space-between;
}
.cookie-banner p{ margin: 0; max-width: 620px; font-size: 14px; }
.cookie-banner a{ color: var(--brass); }
.cookie-banner__actions{ display: flex; gap: var(--space-sm); }
.cookie-banner .btn--primary{ background: var(--oxblood); color: var(--bone); border-color: var(--oxblood); }
.cookie-banner .btn--ghost{ color: var(--bone); border-color: var(--bone); }
.cookie-banner .btn--ghost:hover{ background: rgba(243,236,217,0.1); }

/* Under-18 */
.u18{ background: var(--bone); }
.u18-wrap{ max-width: 640px; margin: 0 auto; padding: var(--space-xl) var(--space-md); text-align: center; }
.u18-wrap h1{ font-size: clamp(32px, 5vw, 52px); }

/* Contact */
.contact-addr{ font-style: normal; color: var(--ink); margin-bottom: var(--space-md); }

/* Reduce motion */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{ animation: none !important; transition: none !important; }
}
