@font-face {
  font-family: 'Atkinson Hyperlegible';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(font-0.ttf) format('truetype');
}
@font-face {
  font-family: 'Atkinson Hyperlegible';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(font-1.ttf) format('truetype');
}
@font-face {
  font-family: 'Atkinson Hyperlegible';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(font-2.ttf) format('truetype');
}
@font-face {
  font-family: 'Saira Extra Condensed';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(font-3.ttf) format('truetype');
}
@font-face {
  font-family: 'Saira Extra Condensed';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(font-4.ttf) format('truetype');
}
@font-face {
  font-family: 'Saira Extra Condensed';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(font-5.ttf) format('truetype');
}
@font-face {
  font-family: 'Zilla Slab';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(font-6.ttf) format('truetype');
}
@font-face {
  font-family: 'Zilla Slab';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(font-7.ttf) format('truetype');
}


/* Layout: sale-catalog page — a lot-number-led bull lineup is the core, framed by sale-day facts; mobile first, one column, cards widen to two/three columns on larger screens. */
:root{
  --ground:#eceee6;      /* winter pasture, cool limestone */
  --sheet:#f8f8f3;       /* catalog page */
  --ink:#1a2420;         /* spruce black */
  --muted:#56625b;
  --rule:#cdd2c6;
  --brass:#8a5c10;       /* accent: brass ear-tag / copper */
  --brass-ink:#ffffff;
  --sky:#3f6474;         /* EPD bars, links */
  --tag:#e3e7da;
  --good:#2f6b3d;
  --display:"Zilla Slab",Rockwell,"Roboto Slab",Georgia,serif;
  --body:"Atkinson Hyperlegible","Segoe UI",system-ui,-apple-system,sans-serif;
  --data:"Saira Extra Condensed","Arial Narrow","Roboto Condensed",sans-serif-condensed,sans-serif;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --ground:#121815;--sheet:#1a221e;--ink:#e7ebe2;--muted:#a4afa6;--rule:#304038;
  --brass:#d9a441;--brass-ink:#1a1408;--sky:#8fb7c7;--tag:#24302a;--good:#7fc08d;color-scheme:dark}}
:root[data-theme="dark"]{
  --ground:#121815;--sheet:#1a221e;--ink:#e7ebe2;--muted:#a4afa6;--rule:#304038;
  --brass:#d9a441;--brass-ink:#1a1408;--sky:#8fb7c7;--tag:#24302a;--good:#7fc08d;color-scheme:dark}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:76px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{background:var(--ground);color:var(--ink);font:400 1.0625rem/1.55 var(--body);padding-bottom:76px}
@media (min-width:860px){body{padding-bottom:0}}
a{color:var(--sky)}
:focus-visible{outline:3px solid var(--brass);outline-offset:2px}
h1,h2,h3{font-family:var(--display);line-height:1.08;text-wrap:balance;margin:0}
h2{font-size:clamp(1.9rem,6vw,2.6rem);font-weight:700}
h3{font-size:1.3rem;font-weight:700}
p{margin:0}
.wrap{max-width:1120px;margin:0 auto;padding-inline:16px}
@media (min-width:600px){.wrap{padding-inline:28px}}
.eyebrow{font:700 .8rem/1 var(--data);letter-spacing:.14em;text-transform:uppercase;color:var(--brass)}
.lede{color:var(--muted);max-width:60ch}
section{padding-block:56px}
.sec-head{display:grid;gap:10px;margin-bottom:28px}

/* sample notice */
.notice{background:var(--ink);color:var(--ground);font-size:.85rem;text-align:center;padding:8px 16px}
.notice b{color:var(--brass)}

/* header */
header.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:var(--sheet);border-bottom:1px solid var(--rule)}
.top .wrap{display:flex;align-items:center;gap:14px;min-height:62px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);margin-right:auto}
.brand svg{width:40px;height:40px;flex:none}
.brand b{font:700 1.15rem/1 var(--display);display:block}
.brand small{font:600 .72rem/1.2 var(--data);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
nav.main{display:none;gap:22px}
nav.main a{color:var(--ink);text-decoration:none;font-weight:700;font-size:.95rem}
nav.main a:hover{color:var(--brass)}
@media (min-width:860px){nav.main{display:flex}}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 20px;border-radius:6px;font:700 1rem/1 var(--body);text-decoration:none;cursor:pointer;border:2px solid transparent}
.btn-brass{background:var(--brass);color:var(--brass-ink)}
.btn-line{border-color:var(--ink);color:var(--ink);background:transparent}
.btn-sm{min-height:42px;padding:0 14px;font-size:.92rem}
.btn[disabled]{opacity:.55;cursor:not-allowed}

/* hero */
.hero{background:var(--sheet);border-bottom:1px solid var(--rule);padding-block:36px 44px}
.hero .wrap{display:grid;gap:28px}
@media (min-width:860px){.hero .wrap{grid-template-columns:1.25fr .9fr;align-items:center}}
.hero .num{font:800 clamp(5.5rem,26vw,10rem)/.82 var(--data);color:var(--brass);letter-spacing:-.01em;display:block}
.hero h1{font-size:clamp(2.2rem,8vw,3.6rem);font-weight:700;margin-top:6px}
.hero .lede{margin-top:14px;font-size:1.1rem}
.hero .ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.ticket{background:var(--ground);border:1px solid var(--rule);border-radius:10px;padding:20px;display:grid;gap:16px}
.ticket .row{display:flex;justify-content:space-between;gap:12px;border-bottom:1px dashed var(--rule);padding-bottom:12px}
.ticket .row:last-child{border:0;padding:0}
.ticket dt{font:600 .8rem/1.2 var(--data);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.ticket dd{margin:0;font-weight:700;text-align:right}
.count{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;text-align:center}
.count div{background:var(--sheet);border-radius:6px;padding:10px 4px}
.count b{display:block;font:800 2.2rem/1 var(--data);font-variant-numeric:tabular-nums}
.count span{font:600 .72rem/1 var(--data);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.example{font-size:.8rem;color:var(--muted);font-style:italic}

/* lineup */
.tools{display:grid;gap:12px;margin-bottom:22px}
.chips{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}
.chip{flex:none;min-height:44px;padding:0 16px;border-radius:999px;border:1.5px solid var(--rule);background:var(--sheet);color:var(--ink);font:700 .95rem/1 var(--body);cursor:pointer}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--ground);border-color:var(--ink)}
.sortrow{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:.95rem;color:var(--muted)}
select,input,textarea{font:inherit;color:var(--ink);background:var(--sheet);border:1.5px solid var(--rule);border-radius:6px;min-height:46px;padding:8px 12px;width:100%}
.sortrow select{width:auto}
.lots{display:grid;gap:16px}
@media (min-width:640px){.lots{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1000px){.lots{grid-template-columns:repeat(3,minmax(0,1fr))}}
.lot{background:var(--sheet);border:1px solid var(--rule);border-radius:10px;padding:18px;display:grid;gap:14px;align-content:start;min-width:0}
.lot-head{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;align-items:end}
.lot-no{grid-row:span 2;font:800 3.6rem/.8 var(--data);color:var(--brass);font-variant-numeric:tabular-nums}
.lot-no small{display:block;font:700 .7rem/1 var(--data);letter-spacing:.16em;color:var(--muted);margin-bottom:6px}
.lot h3{font-size:1.15rem}
.lot .reg{font-size:.85rem;color:var(--muted)}
.ped{font-size:.95rem;display:grid;grid-template-columns:auto 1fr;gap:2px 12px;margin:0}
.ped dt{color:var(--muted)}
.ped dd{margin:0;min-width:0}
.tags{display:flex;flex-wrap:wrap;gap:6px}
.tag{background:var(--tag);font:700 .78rem/1 var(--data);letter-spacing:.08em;text-transform:uppercase;padding:6px 9px;border-radius:4px}
.epd{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.epd th{font:600 .74rem/1 var(--data);letter-spacing:.08em;color:var(--muted);text-align:center;padding:0 0 4px}
.epd td{font:700 1.15rem/1 var(--data);text-align:center;padding:6px 0;border-top:1px solid var(--rule)}
.epd td.hi{color:var(--good)}
.epdwrap{overflow-x:auto}
.actuals{display:flex;gap:4px 16px;flex-wrap:wrap;font-size:.9rem;color:var(--muted)}
.actuals b{color:var(--ink);font-variant-numeric:tabular-nums}
.lot .btn{width:100%}
.empty{padding:28px;text-align:center;background:var(--sheet);border:1px dashed var(--rule);border-radius:10px}
details.epdhelp{margin-top:20px;background:var(--sheet);border:1px solid var(--rule);border-radius:10px;padding:4px 18px}
details.epdhelp summary{cursor:pointer;font-weight:700;min-height:48px;display:flex;align-items:center}
.glossary{display:grid;gap:10px;padding-bottom:16px;margin:0}
.glossary div{display:grid;grid-template-columns:4.5rem 1fr;gap:10px}
.glossary dt{font:800 1.05rem/1.3 var(--data);color:var(--brass)}
.glossary dd{margin:0;font-size:.95rem}

/* guarantee */
.band{background:var(--sheet);border-block:1px solid var(--rule)}
.promises{display:grid;gap:0;margin:0}
@media (min-width:760px){.promises{grid-template-columns:1fr 1fr;column-gap:40px}}
.promises div{padding:18px 0;border-top:1px solid var(--rule);display:grid;gap:6px}
.promises dt{font:700 1.15rem/1.2 var(--display)}
.promises dd{margin:0;color:var(--muted)}

/* sale day */
.split{display:grid;gap:32px}
@media (min-width:860px){.split{grid-template-columns:1fr 1fr}}
.order{list-style:none;margin:0;padding:0;display:grid;gap:0}
.order li{display:grid;grid-template-columns:6.2rem 1fr;gap:14px;padding:14px 0;border-top:1px solid var(--rule)}
.order time{font:800 1.4rem/1.1 var(--data);color:var(--brass);font-variant-numeric:tabular-nums}
.order b{display:block}
.order span{color:var(--muted);font-size:.95rem}
.ways{display:grid;gap:12px}
.way{background:var(--sheet);border:1px solid var(--rule);border-radius:10px;padding:16px;display:grid;gap:6px}
.way h3{font-size:1.1rem}
.way p{color:var(--muted);font-size:.95rem}

/* program */
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:24px}
.stats div{border-top:3px solid var(--brass);padding-top:10px}
.stats b{display:block;font:800 clamp(2rem,9vw,3rem)/1 var(--data);font-variant-numeric:tabular-nums}
.stats span{font-size:.85rem;color:var(--muted)}
.story{display:grid;gap:14px;max-width:62ch}

/* visit */
.mapph{border:1px solid var(--rule);border-radius:10px;overflow:hidden;background:var(--sheet)}
.mapph svg{display:block;width:100%;height:auto}
.addr{display:grid;gap:12px}
.addr p{color:var(--muted)}

/* faq */
.faq{display:grid;gap:10px;max-width:780px}
.faq details{background:var(--sheet);border:1px solid var(--rule);border-radius:10px;padding:2px 18px}
.faq summary{cursor:pointer;font-weight:700;min-height:52px;display:flex;align-items:center}
.faq details p{padding-bottom:16px;color:var(--muted)}

/* contact */
.contact{background:var(--ink);color:var(--ground)}
.contact .eyebrow{color:var(--brass)}
.contact .lede{color:color-mix(in srgb,var(--ground) 75%,transparent)}
.phone{font:800 clamp(2.6rem,12vw,4.2rem)/1 var(--data);letter-spacing:.01em;font-variant-numeric:tabular-nums;user-select:all}
.phonebox{display:grid;gap:12px;align-content:start}
.phonebox .btns{display:flex;gap:10px;flex-wrap:wrap}
.contact .btn-line{border-color:var(--ground);color:var(--ground)}
.contact small{color:color-mix(in srgb,var(--ground) 70%,transparent)}
form.req{background:var(--sheet);color:var(--ink);border-radius:12px;padding:20px;display:grid;gap:14px}
form.req label{display:grid;gap:6px;font-weight:700;font-size:.95rem}
.two{display:grid;gap:14px}
@media (min-width:520px){.two{grid-template-columns:1fr 1fr}}
.sent{background:var(--tag);border-radius:8px;padding:12px 14px;font-weight:700}

footer{padding-block:28px;font-size:.88rem;color:var(--muted)}
footer .wrap{display:grid;gap:6px}

/* mobile call bar */
.callbar{position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--sheet);border-top:1px solid var(--rule);padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (min-width:860px){.callbar{display:none}}

body{margin:0}html{color-scheme:light}main{position:relative;isolation:isolate}main>section{position:relative;z-index:1;background:transparent}.watermarks{position:absolute;inset:0;z-index:0;pointer-events:none;background:url('jbw-logo.png') 24px 50px/280px 94px repeat;opacity:.028}
.hero .wrap{grid-template-columns:1fr 1fr;gap:36px;align-items:center}.hero h1{font-size:clamp(2.25rem,4.5vw,3.2rem);margin-top:12px;line-height:1.1}.hero h1 span{color:var(--brass)}.hero .lede{font-size:1.06rem}.hero .ctas{gap:10px}.hero .ctas .btn{padding:0 16px;font-size:.95rem}
.ranch-photo{margin:0;border:1px solid var(--rule);border-radius:10px;overflow:hidden;background:var(--sheet)}.ranch-photo img{display:block;width:100%;height:350px;object-fit:cover}.ranch-photo figcaption{padding:8px 12px;font-size:.72rem;color:var(--muted)}
.hero .sale-board{display:block;margin-top:30px}.ticket{grid-template-columns:1fr 1fr;gap:12px 26px;margin:0;background:var(--sheet)}.ticket .row{display:grid;grid-template-columns:70px 1fr;align-items:baseline;border-bottom:0;padding:0}.ticket dd{text-align:left}.board-label{grid-column:1/-1;color:var(--brass);font:700 .95rem var(--data);text-transform:uppercase;letter-spacing:.08em}.ticket .example{grid-column:1/-1}
.contact{background:var(--ink)}.contact .eyebrow{color:#e5b352}.ranch-map{padding:28px;background:var(--sheet);border-left:4px solid var(--brass)}.ranch-map p{margin-top:12px;color:var(--muted)}.jbw-credit{width:160px;height:auto}.notice b{color:#e5b352}nav.main{gap:16px}.chips{flex-wrap:wrap;overflow:visible}.epdhelp summary,.faq summary{gap:12px}.faq summary::after{content:'+';margin-left:auto;font-size:1.3rem}.faq details[open] summary::after{content:'−'}
@media(max-width:900px){nav.main{display:none}.lots{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.hero .wrap{grid-template-columns:1fr;gap:24px}.hero h1{font-size:2.6rem}.hero .ctas{display:grid;grid-template-columns:1fr 1fr}.hero .ctas .btn{padding:8px;font-size:.86rem;line-height:1.25}.ranch-photo img{height:260px}.ticket{grid-template-columns:1fr}.ticket .row{grid-template-columns:66px 1fr}.lots{grid-template-columns:1fr}.hero{padding-top:26px}.hero .lede{font-size:1rem}.brand b{font-size:1.05rem}.brand svg{width:34px;height:34px}.top .wrap{gap:8px}.notice{font-size:.74rem}.chip{padding:0 12px}.phone{font-size:3.4rem}.callbar .btn{font-size:.94rem}}

main>section::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background:url("jbw-logo.png") 18px 35px/260px 87px repeat;opacity:.06}main .watermarks{display:none}
