:root{
  --ink:#3b2414;--night:#22140b;--wood:#4a2c17;--rust:#a4441e;--clay:#8a3416;--brass:#c9973f;--gold:#f3d37d;
  --teal:#2f7471;--teal2:#3f8f89;--cream:#f6ead0;--parch:#ecdcb5;--sand:#e2c993;--muted:#6d4f36;
  --display:"Barlow Condensed","Arial Narrow",sans-serif;--wood-type:"Barlow Condensed","Arial Narrow",sans-serif;--fancy:"Barlow Condensed","Arial Narrow",sans-serif;
  --cond:"Alfa Slab One",Georgia,serif;--type:"Special Elite","Courier New",monospace;--body:"Lora",Georgia,serif;
  --max:1160px;--paper:url(/img/paper.svg);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--body);font-size:18px;line-height:1.7;color:var(--ink);background:var(--parch) var(--paper)}
img{max-width:100%;height:auto;display:block}
a{color:var(--rust);text-decoration-thickness:1px;text-underline-offset:3px}a:hover{color:var(--teal)}
.wrap{max-width:var(--max);margin:0 auto;padding:0 24px}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;background:#fff;padding:8px 12px;z-index:99}
.rope,.site-header::after,section.band::before,.site-footer::before,.page-hero::after,.ticker::before,.ticker::after{content:"";position:absolute;left:0;right:0;height:14px;background:url(/img/rope.svg) repeat-x;background-size:28px 14px;z-index:3;pointer-events:none}
/* header: dark barn-wood */
.site-header{position:sticky;top:0;z-index:50;background:repeating-linear-gradient(0deg,rgba(0,0,0,.14) 0 2px,transparent 2px 9px),linear-gradient(#4a2c17,#2e1b0e)}
.site-header::after{bottom:-7px}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:74px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--cream)}
.brand img{width:50px;height:50px;filter:drop-shadow(0 2px 0 rgba(0,0,0,.4))}
.brand .wm{display:flex;flex-direction:column;line-height:1}
.brand b{font-family:var(--display);font-weight:800;font-size:25px;line-height:1;letter-spacing:2px;text-transform:uppercase;color:var(--cream)}
.brand small{display:block;font-family:var(--display);font-weight:500;font-size:13px;letter-spacing:6px;text-transform:uppercase;color:var(--gold);margin-top:3px}
.brand em{display:block;font-style:normal;font-family:var(--type);font-size:12px;letter-spacing:1px;color:var(--sand);margin-top:6px;opacity:.8}
.nav{display:flex;gap:2px;list-style:none;margin:0;padding:0}
.nav a{display:block;padding:8px 10px;font-family:var(--cond);text-transform:uppercase;letter-spacing:1px;font-size:13px;color:var(--sand);text-decoration:none;border:2px solid transparent;border-radius:2px}
.nav a:hover{color:var(--gold);border-color:rgba(243,211,125,.35)}
.nav a[aria-current=page]{background:var(--rust);color:var(--cream);border-color:var(--gold);box-shadow:inset 0 0 0 2px var(--rust),inset 0 0 0 3px rgba(243,211,125,.6)}
.menu-btn{display:none;background:none;border:2px solid var(--gold);color:var(--gold);font-family:var(--cond);letter-spacing:2px;text-transform:uppercase;padding:6px 12px;border-radius:2px;cursor:pointer}
@media (max-width:1000px){
  .menu-btn{display:block}
  .nav{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;background:#2e1b0e;padding:14px 16px 20px}
  .nav.open{display:flex}.nav a{font-size:16px;padding:12px}
}
/* hero */
.hero{position:relative;min-height:90vh;display:flex;align-items:center;color:var(--cream);overflow:hidden;background:var(--night)}
.hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center bottom}
.hero::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 40%,rgba(34,20,11,.1),rgba(34,20,11,.55) 80%),linear-gradient(180deg,rgba(34,20,11,.5),transparent 45%,rgba(34,20,11,.35))}
.hero .wrap{position:relative;z-index:2;text-align:center;padding-top:44px;padding-bottom:170px}
.kicker{font-family:var(--type);text-transform:uppercase;letter-spacing:4px;font-size:15px;color:var(--gold);text-shadow:1px 1px 0 rgba(0,0,0,.5)}
.kicker::before,.kicker::after{content:"★";margin:0 12px;color:var(--brass)}
.hero h1{font-family:var(--display);font-weight:800;font-size:clamp(50px,9.4vw,124px);line-height:.92;letter-spacing:.04em;text-transform:uppercase;margin:16px 0 24px;color:#fbf0d4;
  text-shadow:0 4px 18px rgba(0,0,0,.45)}
.hero h1 span{display:flex;align-items:center;justify-content:center;gap:.55em;font-weight:600;font-size:.27em;letter-spacing:.6em;padding-left:.6em;color:var(--gold);margin-top:.5em;text-shadow:0 2px 8px rgba(0,0,0,.5)}
.hero h1 span::before,.hero h1 span::after{content:"";width:2.3em;height:2px;background:var(--gold);box-shadow:0 1px 3px rgba(0,0,0,.4)}
.hero p.lead{max-width:680px;margin:0 auto 30px;font-size:20px;color:#fbf0d4;text-shadow:0 1px 2px rgba(0,0,0,.6)}
.btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.btn{display:inline-block;font-family:var(--cond);text-transform:uppercase;letter-spacing:1.5px;font-size:15px;padding:14px 26px;border-radius:2px;text-decoration:none;border:2px solid var(--night);transition:transform .15s,background .15s}
.btn:hover{transform:translateY(-2px)}
.btn.primary{background:linear-gradient(#f0cf78,#c9973f);color:var(--night);box-shadow:inset 0 0 0 3px #f0cf78,inset 0 0 0 5px var(--night),4px 4px 0 var(--night)}
.btn.primary:hover{color:var(--night);background:linear-gradient(#f7dc8f,#d6a64d)}
.btn.ghost{color:var(--cream);border-color:var(--gold);background:rgba(34,20,11,.35);box-shadow:inset 0 0 0 3px rgba(34,20,11,.35),inset 0 0 0 4px rgba(243,211,125,.5)}
.btn.ghost:hover{background:rgba(34,20,11,.6);color:var(--gold)}
.btn.dark{background:var(--rust);color:var(--cream);box-shadow:inset 0 0 0 3px var(--rust),inset 0 0 0 4px var(--gold),4px 4px 0 var(--night)}
.btn.dark:hover{background:var(--clay);color:#fff}
/* ribbon banner stamp */
.stamp{display:inline-flex;align-items:center;gap:12px;position:relative;background:var(--rust);color:var(--cream);font-family:var(--cond);letter-spacing:3px;text-transform:uppercase;font-size:15px;padding:10px 34px;margin-bottom:14px;
  clip-path:polygon(0 0,100% 0,calc(100% - 14px) 50%,100% 100%,0 100%,14px 50%);box-shadow:inset 0 0 0 2px var(--gold)}
.stamp::before,.stamp::after{content:"★";color:var(--gold)}
/* page hero: sunburst over clay */
.page-hero{position:relative;background:var(--clay);color:var(--cream);overflow:hidden;padding:92px 0 80px;text-align:center}
.page-hero::before{content:"";position:absolute;inset:0;background:repeating-conic-gradient(from 0deg at 50% 115%,rgba(243,211,125,.16) 0 5deg,transparent 5deg 12deg),var(--paper);opacity:1}
.page-hero::after{bottom:0}
.page-hero .wrap{position:relative}
.page-hero h1{font-family:var(--display);font-weight:800;font-size:clamp(40px,6.6vw,78px);line-height:1;letter-spacing:.04em;text-transform:uppercase;margin:14px 0 14px;color:#fbf0d4;text-shadow:0 4px 16px rgba(0,0,0,.4)}
.page-hero h1::after{content:"✦ ★ ✦";display:block;font-size:18px;letter-spacing:10px;color:var(--gold);text-shadow:none;margin-top:12px}
.page-hero p{max-width:720px;margin:0 auto;color:#f8e3c2;font-size:19px}
.crumbs{font-family:var(--type);font-size:14px;letter-spacing:2px;text-transform:uppercase;color:var(--gold)}
.crumbs a{color:var(--gold);text-decoration:none}
/* sections */
section.band{position:relative;padding:90px 0}
section.band::before{top:-7px}
.band.sand{background:var(--sand) var(--paper)}
.band.dark{background:radial-gradient(ellipse at 50% 0%,#3a2213,#1c1009 75%);color:var(--sand)}
.band.clay{background:var(--teal) var(--paper);color:var(--cream)}
.band.dark h2,.band.clay h2{color:#fbf0d4;text-shadow:0 3px 12px rgba(0,0,0,.35)}
h2{font-family:var(--display);font-weight:800;font-size:clamp(32px,4.4vw,50px);line-height:1.05;letter-spacing:.02em;text-transform:uppercase;margin:0 0 18px;color:var(--clay)}
h3{font-family:var(--cond);font-weight:400;text-transform:uppercase;letter-spacing:1px;font-size:20px;margin:0 0 8px;color:var(--rust)}
.band.dark h3{color:var(--gold)}.band.clay h3{color:var(--gold)}
.eyebrow{font-family:var(--type);text-transform:uppercase;letter-spacing:3px;font-size:14px;color:var(--teal);margin-bottom:8px;display:block}
.eyebrow::before{content:"★ ";color:var(--brass)}.eyebrow::after{content:" ★";color:var(--brass)}
.band.dark .eyebrow,.band.clay .eyebrow{color:var(--gold)}
.center{text-align:center}.narrow{max-width:780px;margin-left:auto;margin-right:auto}
.split{display:grid;grid-template-columns:1.1fr .9fr;gap:60px;align-items:center}
.split.rev{grid-template-columns:.9fr 1.1fr}
@media (max-width:860px){.split,.split.rev{grid-template-columns:1fr;gap:36px}}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:30px}
@media (max-width:860px){.grid3,.grid2{grid-template-columns:1fr}}
/* wanted-poster cards */
.card{position:relative;background:#f7ecd2 var(--paper);border:3px solid var(--ink);border-radius:1px;padding:32px 28px 28px;
  box-shadow:0 0 0 4px #f7ecd2,0 0 0 6px var(--ink),9px 11px 0 4px rgba(59,36,20,.28)}
.card::before,.card::after{content:"";position:absolute;top:10px;width:8px;height:8px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#b7a07a,#3b2414 70%)}
.card::before{left:10px}.card::after{right:10px}
.card p:last-child{margin-bottom:0}
.band.dark .card{background:#2e1b0e;border-color:var(--brass);color:var(--sand);box-shadow:0 0 0 4px #2e1b0e,0 0 0 6px var(--brass),9px 11px 0 4px rgba(0,0,0,.45)}
.band.dark .card::before,.band.dark .card::after{background:radial-gradient(circle at 35% 35%,#f3d37d,#8a5a1f 70%)}
.card .num{font-family:var(--wood-type);font-weight:800;font-size:50px;color:var(--teal);line-height:1}
.figure{border:12px solid #5a3a1c;outline:3px solid var(--brass);outline-offset:-8px;box-shadow:0 0 0 3px var(--night),12px 14px 0 rgba(59,36,20,.35);background:var(--night)}
.figcap{font-family:var(--type);font-size:13px;letter-spacing:1px;text-transform:uppercase;color:var(--muted);margin-top:18px}
.band.dark .figcap{color:#c9a98f}
.pull{font-family:var(--body);font-style:italic;font-size:clamp(22px,2.7vw,30px);line-height:1.3;color:var(--clay);border-left:6px double var(--brass);padding-left:24px;margin:32px 0}
.band.dark .pull{color:var(--gold)}
.ticker{position:relative;background:var(--teal) var(--paper);color:var(--cream);font-family:var(--cond);text-transform:uppercase;letter-spacing:2px;font-size:15px;padding:20px 0;overflow:hidden;white-space:nowrap}
.ticker::before{top:0}.ticker::after{bottom:0}
.ticker .wrap{overflow:hidden;text-overflow:clip}
.ticker span{margin:0 18px}
/* timeline with stars */
.timeline{position:relative;margin:44px 0 0;padding:0;list-style:none}
.timeline::before{content:"";position:absolute;left:14px;top:0;bottom:0;width:10px;background:url(/img/rope.svg) repeat-y;background-size:28px 14px;transform:none;opacity:.9;
  background:repeating-linear-gradient(170deg,#b98a4e 0 5px,#5a3a1c 5px 7px);border-radius:5px}
.timeline li{position:relative;padding:0 0 44px 66px}
.timeline li::before{content:"";position:absolute;left:0;top:0;width:38px;height:38px;background:var(--brass);
  clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);filter:drop-shadow(1px 1px 0 var(--ink))}
.timeline .era{font-family:var(--type);letter-spacing:2px;text-transform:uppercase;font-size:14px;color:var(--teal)}
.timeline h3{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.03em;font-size:30px;line-height:1.1;color:var(--clay)}
.tags{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 0;padding:0;list-style:none}
.tags li{font-family:var(--cond);text-transform:uppercase;letter-spacing:1px;font-size:13px;border:2px solid currentColor;padding:4px 14px;border-radius:30px}
/* HOF: western frame + sheriff star */
.coming{position:relative;text-align:center;border:3px solid var(--brass);outline:1px solid var(--brass);outline-offset:6px;padding:60px 28px;margin:8px;background:radial-gradient(circle at 50% 45%,rgba(201,151,63,.22),transparent 60%)}
.coming::before,.coming::after{content:"★";position:absolute;top:-22px;font-size:30px;color:var(--gold);background:#2a180e;border:1px solid var(--brass);border-radius:50%;width:46px;height:46px;line-height:44px;left:50%;transform:translateX(-50%)}
.coming::after{top:auto;bottom:-24px}
.sheriff{width:min(320px,78vw);aspect-ratio:1;margin:10px auto 6px;background:url(/img/sheriff-star.svg) center/contain no-repeat;display:flex;align-items:center;justify-content:center;filter:drop-shadow(0 10px 18px rgba(0,0,0,.5))}
.coming .year{font-family:var(--wood-type);font-weight:800;font-size:clamp(52px,10vw,84px);line-height:1;letter-spacing:.03em;color:#fbf0d4;text-shadow:0 3px 0 var(--night);margin-top:4px}
.coming .cls{font-family:var(--fancy);font-weight:600;text-transform:uppercase;letter-spacing:.4em;color:var(--gold);font-size:22px}
.slots{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:40px}
.slot{aspect-ratio:3/4;border:2px dashed rgba(243,211,125,.55);outline:1px solid rgba(243,211,125,.2);outline-offset:-10px;border-radius:2px;display:flex;flex-direction:column;gap:12px;align-items:center;justify-content:center;font-family:var(--cond);letter-spacing:2px;text-transform:uppercase;color:rgba(243,211,125,.8);font-size:13px;background:rgba(236,220,181,.05);padding:10px;text-align:center}
.slot::before{content:"★";font-size:44px;line-height:1;color:rgba(201,151,63,.55)}
@media (max-width:700px){.slots{grid-template-columns:repeat(2,1fr)}}
/* forms */
form.mock{display:grid;gap:16px}
label{font-family:var(--cond);text-transform:uppercase;letter-spacing:1.5px;font-size:13px;display:block;margin-bottom:6px}
input,select,textarea{width:100%;font:inherit;font-size:17px;padding:12px 14px;border:2px solid var(--ink);border-radius:2px;background:#fbf4e2;color:var(--ink);box-shadow:inset 2px 2px 0 rgba(59,36,20,.12)}
input:focus,select:focus,textarea:focus{outline:3px solid var(--brass);outline-offset:1px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:16px}@media (max-width:600px){.row2{grid-template-columns:1fr}}
.note{font-family:var(--type);font-size:13px;color:var(--muted)}
.band.dark .note,.band.clay .note{color:#e9dcc0}
.ok{display:none;background:var(--teal);border:2px solid var(--gold);color:#fff;padding:14px 18px;border-radius:2px;font-family:var(--type)}
.band.clay .ok{background:var(--night)}
.ok.show{display:block}
.inline-form{display:flex;gap:10px;max-width:560px;margin:24px auto 0;flex-wrap:wrap}
.inline-form input{flex:1 1 240px}
/* footer */
.site-footer{position:relative;background:repeating-linear-gradient(0deg,rgba(0,0,0,.14) 0 2px,transparent 2px 9px),linear-gradient(#3a2213,#1c1009);color:#d8bfa5;padding:66px 0 30px;font-size:16px}
.site-footer::before{top:-7px}
.site-footer .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px}
@media (max-width:800px){.site-footer .cols{grid-template-columns:1fr}}
.site-footer h4{font-family:var(--cond);font-weight:400;text-transform:uppercase;letter-spacing:2px;color:var(--gold);margin:0 0 12px;font-size:15px}
.site-footer ul{list-style:none;margin:0;padding:0}.site-footer li{margin:6px 0}
.site-footer a{color:var(--sand);text-decoration:none}.site-footer a:hover{color:var(--gold)}
.fine{border-top:1px dashed #6b4a2c;margin-top:40px;padding-top:20px;font-family:var(--type);font-size:13px;color:#a88a74;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px}
@media (max-width:600px){
  .stamp{font-size:12px;letter-spacing:1.5px;padding:9px 28px;gap:8px;white-space:nowrap}
  .brand b{font-size:21px;letter-spacing:1.5px}.brand small{font-size:11px;letter-spacing:4.5px;white-space:nowrap}
  .kicker{font-size:12px;letter-spacing:2px}.kicker::before,.kicker::after{margin:0 6px}
  .hero h1 span{letter-spacing:.35em;padding-left:.35em}.hero h1 span::before,.hero h1 span::after{width:1.4em}
  section.band{padding:72px 0}
}