/* Aftermark Brass: green baize and brass. */
:root { --baize: #143426; --bdeep: #0C2218; --blift: #1D4633; --brass: #C9A04C; --bhi: #E8CB7E; --blo: #8A6A2A; --bink: #6B5220; --cream: #F1E8D2; --paper: #F5EEDC; --ink: #17140F; --ink2: #4A4034; --manila: #E6D6AE; --stamp: #A8215A; --fe: "Alegreya SC", "Copperplate", "Copperplate Gothic Bold", "Copperplate Gothic", "Engravers MT", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif; --fl: "Alegreya SC", "Copperplate", "Copperplate Gothic Light", "Copperplate Gothic", "Engravers MT", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif; --ft: "Alegreya", "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif; --fh: "Segoe Print", "Bradley Hand", "Noteworthy", "Ink Free", cursive; --wrap: 1200px; --gut: clamp(16px, 4.2vw, 56px); --felt: url("felt.svg"); --mottle: url("mottle.svg"); --fibre: url("fibre.svg"); --loop: url("loop.svg"); --inked: url("inked.svg"); --stock: var(--fibre), linear-gradient(174deg, #F2E6C5, var(--manila) 57%, #DAC690); }

*, *::before, *::after { box-sizing: border-box; }
html { scroll-padding-top: 88px; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--bdeep); color: var(--cream); font: 400 1.0625rem/1.6 var(--ft); font-variant-numeric: oldstyle-nums proportional-nums; overflow-x: clip; }
img, svg { display: block; max-width: 100%; }
h1, h2, h3, h4 { margin: 0; font-weight: 400; text-wrap: balance; }
p { margin: 0 0 1em; }
a { color: inherit; text-decoration-line: underline; text-decoration-thickness: 1px; text-underline-offset: .22em; text-decoration-color: var(--brass); }
a:hover { text-decoration-thickness: 2px; }
::selection { background: var(--bhi); color: var(--ink); }
:focus-visible { outline: 2px solid var(--bhi); outline-offset: 3px; }
em { font-style: italic; }

.defs { position: absolute; width: 0; height: 0; overflow: hidden; }
.vh { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip { position: absolute; left: -999em; z-index: 100; padding: .6em 1em; background: var(--bhi); color: var(--ink); font-family: var(--fe); text-decoration: none; }
.skip:focus { left: 16px; margin-top: 8px; }
.wrap { width: min(100% - 2 * var(--gut), var(--wrap)); margin-inline: auto; }

/* shared type */
.kicker { display: flex; align-items: center; gap: .8em; margin: 0 0 1.1rem; font: 400 .82rem/1.2 var(--fl); letter-spacing: .16em; color: var(--bink); }
.kicker span { padding: .3em .6em .35em; border: 1px solid currentColor; font-family: var(--fe); letter-spacing: .08em; font-variant-caps: normal; }
.kicker::after { content: ""; flex: 0 1 5rem; height: 1px; background: currentColor; opacity: .5; }
.sec-head h2, .honest__title, .shop__text h2, .intake__copy h2 { font: 400 clamp(2rem, 1.2rem + 3.2vw, 3.6rem)/1.02 var(--fe); letter-spacing: .01em; color: var(--ink); }
.sec-head h2 em, .honest__title em, .shop__text h2 em, .intake__copy h2 em { display: block; margin-top: .12em; font: italic 400 .92em/1.05 var(--ft); font-variant-caps: normal; letter-spacing: 0; color: var(--bink); }
.sec-lede { max-width: 38em; margin: 1.2rem 0 0; font-size: 1.12rem; color: var(--ink2); }
.sec-head--light h2 { color: var(--cream); }
.sec-head--light h2 em { color: var(--bhi); }
.sec-head--light .kicker { color: var(--brass); }
.sec-head--light .sec-lede { color: #f1e8d2d1; }

/* buttons */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .6em; min-height: 48px; padding: .7em 1.35em .78em; border: 0; border-radius: 3px; font: 400 .98rem/1 var(--fe); letter-spacing: .09em; text-decoration: none; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease, color .2s ease; }
.btn:hover { transform: translateY(-2px); }
.btn:active { transform: translateY(0); }
.btn--tag { --hole: #10281D; position: relative; z-index: 0; padding-left: 2.5em; color: var(--ink); font-family: var(--ft); font-size: 1.04rem; letter-spacing: .06em; filter: drop-shadow(0 7px 10px #00000073); transform-origin: 1.25em 50%; }
.btn--tag::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--stock); clip-path: polygon(15px 0, 100% 0, 100% 100%, 15px 100%, 0 calc(100% - 15px), 0 15px); }
.btn--tag::after { content: ""; position: absolute; left: .85em; top: 50%; width: 15px; height: 15px; margin-top: -7.5px; }
.btn--tag:hover { transform: rotate(-2deg); }
.btn--ink { color: var(--manila); background: var(--ink); box-shadow: inset 0 0 0 1px #000, inset 0 0 0 4px var(--ink), inset 0 0 0 5px #e6d6ae59; }
.btn--ink:hover { background: #2A241B; }
.btn--ink:focus-visible { outline-color: var(--ink); }

/* header */
.head { position: sticky; top: 0; z-index: 50; background: #0a1d14f0; border-bottom: 1px solid #c9a04c66; box-shadow: 0 1px 0 #00000080; }
@supports (backdrop-filter: blur(4px)) { .head { background: #0a1d14db; backdrop-filter: blur(8px) saturate(1.2); } }
.head__in { display: flex; align-items: center; gap: 1.5rem; width: min(100% - 2 * var(--gut), 1320px); margin-inline: auto; padding: 10px 0; }
.brand { display: flex; align-items: center; gap: .7rem; text-decoration: none; color: var(--cream); }
.brand__mark { width: 40px; height: 40px; filter: drop-shadow(0 2px 3px #00000066); }
.brand__name { font: 400 1.3rem/1 var(--ft); letter-spacing: .01em; white-space: nowrap; }
.brand__name span { font-style: italic; color: var(--bhi); }
.nav { margin-left: auto; }
.nav ul { display: flex; gap: .2rem; margin: 0; padding: 0; list-style: none; }
.nav a { display: block; padding: .6rem .7rem; font: 400 1rem/1 var(--ft); color: #f1e8d2db; text-decoration: none; background: linear-gradient(var(--bhi), var(--bhi)) center bottom / 0 1px no-repeat; transition: background-size .25s ease, color .2s ease; }
.nav a:hover, .nav a:focus-visible { color: var(--bhi); background-size: calc(100% - 1.4rem) 1px; }
.head__cta { --hole: #0B1F15; min-height: 42px; padding: .5em 1.1em .56em 2.3em; font-size: .95rem; }

/* hero */
.hero { position: relative; padding: clamp(40px, 6vw, 88px) 0 0; background: var(--felt), var(--mottle), radial-gradient(120% 90% at 78% 30%, var(--blift), var(--baize) 55%, #102C20 100%); overflow: clip; }
.hero::before { content: ""; position: absolute; inset: 14px; pointer-events: none; border: 1px solid #c9a04c38; outline: 1px solid #c9a04c1a; outline-offset: 5px; }
.hero__in { position: relative; display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); align-items: center; gap: 0 2rem; width: min(100% - 2 * var(--gut), 1320px); margin-inline: auto; }
.hero__copy { position: relative; z-index: 2; padding-bottom: 3.4rem; }
.hero .plate { --ds: 0 3px 5px #0000008c, 0 30px 50px #00000080; margin-bottom: 2rem; padding: clamp(30px, 3.2vw, 46px) clamp(22px, 3.4vw, 54px) clamp(20px, 2.2vw, 30px); text-align: center; }
.plate__top { display: flex; align-items: center; gap: 1em; margin: 0 0 1rem; font: 400 .84rem/1.3 var(--ft); letter-spacing: .2em; }
.plate__top::before, .plate__top::after { content: ""; flex: 1; height: 5px; border-block: 1px solid #2e200680; }
.hero__title { margin: 0 0 1.3rem; color: #2A1D05; text-shadow: 0 1px 0 #fff4cdb3, 0 -1px 0 #5a3f1059; }
.hero__engr { display: block; font: 400 clamp(2.2rem, .9rem + 3.9vw, 4.4rem)/1 var(--ft); letter-spacing: .07em; text-transform: uppercase; }
.hero__ital { display: block; margin-top: .05em; font: italic 400 clamp(2.2rem, 1rem + 3.6vw, 4.2rem)/1.05 var(--ft); color: #47310A; }
.plate__facts { display: flex; margin: 0; padding: 14px 0 0; list-style: none; border-top: 3px double #2e20068c; }
.plate__facts li { flex: 1 1 0; padding: 0 .6rem; text-wrap: balance; font-size: .95rem; font-style: italic; line-height: 1.3; }
.plate__facts li + li { border-left: 1px solid #3c2a0859; }
.plate__facts span { display: block; font: normal 400 .76rem/1.4 var(--ft); letter-spacing: .14em; }
.hero__lede { max-width: 33em; font-size: clamp(1.05rem, 1rem + .3vw, 1.2rem); color: #f1e8d2e0; }
.hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem 2rem; margin-top: 1.6rem; }
.hero__link { font-size: 1.1rem; font-style: italic; text-decoration-color: var(--bhi); }
.hero__link::after { content: " \2192"; font-style: normal; color: var(--bhi); }
.hero__art { position: relative; aspect-ratio: 680 / 640; margin-right: -3vw; }
.horn { width: 100%; height: 100%; overflow: visible; }
.horn__inscription { font: 400 15px var(--ft); letter-spacing: 3px; opacity: .85; }
.horn__glints { opacity: .9; }

.tag { position: absolute; display: flex; flex-direction: column; color: var(--ink); filter: drop-shadow(0 10px 14px #00000059); }
.tag::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--stock); clip-path: polygon(22% 0, 78% 0, 100% 14%, 100% 100%, 0 100%, 0 14%); }
.tag__eyelet { --hole: #0F2A1E; align-self: center; width: 22px; height: 22px; margin: 6px 0 8px; }
.hero__tag { --tw: clamp(148px, 30%, 200px); left: calc(8.8% - var(--tw) / 2); top: calc(64.7% - 17px); width: var(--tw); padding: 0 14px 18px; transform-origin: 50% 17px; transform: rotate(7deg); }
.tag__no { font: 400 .8rem/1.2 var(--ft); letter-spacing: .12em; text-align: center; border-bottom: 1px solid #17140f59; padding-bottom: .35rem; margin-bottom: .45rem; }
.tag__line { font: 400 .86rem/1.45 var(--fh); color: #23324F; }
.tag__line--big { font-size: 1.05rem; }
.tag__stamp { align-self: flex-end; margin-top: .5rem; padding: .2em .5em .25em; border: 2px solid var(--stamp); border-radius: 3px; color: var(--stamp); font: 400 .8rem/1 var(--fe); letter-spacing: .1em; transform: rotate(-8deg); mask-image: var(--inked); }

.tag__eyelet, .card__eyelet, .rail__tag::after, .intake__eyelet, .btn--tag::after { border-radius: 50%; background: radial-gradient(circle closest-side, var(--hole, #143426) 0 46%, #9A7431 50% 62%, #F1D48C 66% 75%, #8A6A2A 79% 89%, transparent 93%); }

/* bench card */
.bench { position: relative; padding: clamp(64px, 8vw, 120px) 0 clamp(64px, 8vw, 110px); background: var(--felt), radial-gradient(70% 55% at 50% 30%, #e8cb7e1a, transparent 70%), var(--bdeep); }
.sec-head--split { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 0 3rem; align-items: end; margin-bottom: 2.6rem; }
.sec-head--split .kicker { grid-column: 1 / -1; }
.sec-head--split .sec-lede { margin: 0; }
.bench .sec-head h2 { color: var(--cream); }
.bench .sec-head h2 em { color: var(--bhi); }
.bench .kicker { color: var(--brass); }
.bench .sec-lede { color: #f1e8d2d6; }

.compare { margin: 0; }
.compare__stage { --split: 50%; position: relative; aspect-ratio: 1000 / 440; border-radius: 22px; background: var(--felt), radial-gradient(60% 70% at 50% 45%, #255A42, var(--baize) 70%, #0E271C); box-shadow: inset 0 0 0 1px #c9a04c59, inset 0 18px 50px #00000080, 0 30px 60px #00000059; overflow: hidden; isolation: isolate; touch-action: pan-y; }
.compare__stage::before { content: ""; position: absolute; inset: 12px; z-index: 0; pointer-events: none; border: 1.5px dashed #e8cb7e38; border-radius: 13px; }
.compare__svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.compare__before { filter: saturate(.9); }
.compare__after { position: absolute; inset: 0; clip-path: inset(0 0 0 var(--split)); }
.compare__after::before { content: ""; position: absolute; inset: 0; background: radial-gradient(50% 60% at 60% 40%, #ffecaa1f, transparent 70%); }
.compare__range { position: absolute; inset: 0; z-index: 4; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: ew-resize; touch-action: pan-y; -webkit-appearance: none; appearance: none; }
.compare__rule { position: absolute; top: 0; bottom: 0; left: var(--split); z-index: 3; width: 0; pointer-events: none; }
.compare__rule::before { content: ""; position: absolute; top: 0; bottom: 0; left: -2px; width: 4px; background: linear-gradient(90deg, #7A5A1E, #F6DD9A 45%, #B08A3C); box-shadow: 0 0 0 1px #140e0473, 0 0 18px #00000066; }
.compare__knob { position: absolute; top: 50%; left: 0; width: 58px; height: 58px; margin: -29px 0 0 -29px; border-radius: 50%; background: url("knob.svg") center / 100% no-repeat, radial-gradient(circle at 35% 30%, #FFF4CC, #E2BE6A 40%, #A67E33 75%, #6E4E17); box-shadow: inset 0 0 0 2px #281c0699, inset 0 0 0 7px #fff0c826, 0 8px 18px #00000080; transition: transform .2s ease; }
.compare__range:hover ~ .compare__rule .compare__knob { transform: scale(1.06); }
.compare__range:focus-visible ~ .compare__rule .compare__knob { outline: 3px solid var(--bhi); outline-offset: 4px; }
.compare__range:focus-visible ~ .compare__rule::before { background: var(--bhi); }
.compare__tab { position: absolute; top: 22px; z-index: 2; margin: 0; padding: .45em .8em .5em; font: 400 .76rem/1 var(--fe); letter-spacing: .16em; border-radius: 2px; pointer-events: none; }
.compare__tab--in { left: 26px; color: var(--manila); background: #0c1610b8; box-shadow: inset 0 0 0 1px #e6d6ae59; }
.compare__tab--out { right: 19%; color: var(--ink); background: var(--bhi); }
.compare__cap { display: flex; flex-wrap: wrap; align-items: baseline; gap: .3rem 1.4rem; justify-content: space-between; margin: 0 6px 1rem; font-size: .95rem; font-style: italic; color: #f1e8d2c7; }
.compare__hint { font: normal 400 .78rem/1.6 var(--fl); letter-spacing: .14em; color: var(--bhi); }

/* what the ratings do to the "came in" drawing */
.bell-bent, .felt-worn, .cork-worn, .verd, .seized, .valve-grime, .dents-1, .dents-2, .grime, .darken, .pits { opacity: 0; }
.compare__before * { transition: opacity .45s ease; }
.v2 { transition: transform .45s cubic-bezier(.3, 1.4, .5, 1); }
.compare[data-dents="1"] .dents-1, .compare[data-dents="2"] .dents-1, .compare[data-dents="2"] .dents-2, .compare[data-dents="2"] .bell-bent { opacity: 1; }
.compare[data-dents="2"] .bell-true { opacity: 0; }
.compare[data-pads="1"] .felt-ok, .compare[data-pads="2"] .felt-ok, .compare[data-pads="1"] .cork-ok, .compare[data-pads="2"] .cork-ok { opacity: 0; }
.compare[data-pads="1"] .felt-worn, .compare[data-pads="1"] .cork-worn { opacity: 1; }
.compare[data-valves="1"] .valve-grime, .compare[data-valves="2"] .valve-grime, .compare[data-valves="2"] .seized { opacity: 1; }
.compare[data-valves="2"] .v2 { transform: translateY(28px); }
.compare[data-finish="1"] .grime { opacity: .6; }
.compare[data-finish="1"] .darken { opacity: .18; }
.compare[data-finish="2"] .grime { opacity: .95; }
.compare[data-finish="2"] .darken { opacity: .42; }
.compare[data-finish="2"] .pits, .compare[data-finish="2"] .verd { opacity: 1; }

/* the card itself */
.card { position: relative; z-index: 2; margin: -34px auto 0; width: min(100%, 1120px); color: var(--ink); filter: drop-shadow(0 24px 40px #00000073); }
.card::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--stock); clip-path: polygon(0 34px, 34px 0, 100% 0, 100% 100%, 0 100%); }
.card__top { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1.6rem; padding: 26px clamp(20px, 3.4vw, 44px) 16px clamp(62px, 6vw, 92px); border-bottom: 2px solid var(--ink); }
.card__eyelet { --hole: #081811; position: absolute; left: 22px; top: 22px; width: 30px; height: 30px; }
.card__title { font: 400 clamp(1.6rem, 1.2rem + 1.4vw, 2.3rem)/1 var(--fe); letter-spacing: .06em; }
.card__meta { display: flex; flex-wrap: wrap; gap: .3rem 1.2rem; margin: 0 0 0 auto; font: 400 1rem/1.4 var(--fh); color: #23324F; }
.card__meta span + span::before { content: "/"; margin-right: 1.2rem; color: var(--blo); font-family: var(--ft); }
.card__body { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); }
.crits { padding: 10px clamp(20px, 3.4vw, 44px) 24px; }
.crits__head, .crit { display: grid; grid-template-columns: minmax(8.5rem, 1.05fr) repeat(3, minmax(0, 1fr)); gap: .5rem 1rem; }
.crits__head { padding: 10px 0 8px; font: 400 .76rem/1.2 var(--fe); letter-spacing: .14em; }
.crits__head span:nth-child(2) { color: #2D5E45; }
.crits__head span:nth-child(3) { color: var(--bink); }
.crits__head span:nth-child(4) { color: var(--stamp); }
.crit { margin: 0; padding: 14px 0; border: 0; border-top: 1px solid #17140f47; min-width: 0; }
.crit__name { float: left; padding: 0; font: 400 1.08rem/1.15 var(--fe); letter-spacing: .05em; }
.crit__how { display: block; margin-top: .3rem; font: italic 400 .86rem/1.35 var(--ft); font-variant-caps: normal; letter-spacing: 0; color: var(--ink2); }
.crit__opts { display: contents; }
.opt { position: relative; display: block; padding: 8px 12px 10px; cursor: pointer; border-radius: 12px; transition: background-color .2s ease; }
.opt:hover { background: #fffaeb80; }
.opt input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
.opt__grade { display: none; }
.opt__text { display: block; font-size: .95rem; line-height: 1.35; color: var(--ink2); transition: color .2s ease; }
.opt input:checked ~ .opt__text { color: var(--ink); }
.opt::after { content: ""; position: absolute; inset: -13px -19px -11px; pointer-events: none; background: var(--loop) center / 100% 100% no-repeat; opacity: 0; transform: rotate(-3deg) scale(.86); transition: opacity .2s ease, transform .35s cubic-bezier(.3, 1.5, .5, 1); }
.opt:has(input:checked)::after { opacity: 1; transform: rotate(-2deg) scale(1); }
.opt:has(input:focus-visible) { outline: 2px dashed var(--ink); outline-offset: 4px; }

.verdict { position: relative; display: flex; flex-direction: column; align-items: flex-start; padding: 26px clamp(20px, 3vw, 40px) 30px; border-left: 2px dashed #17140f59; }
.verdict__label { margin: 0 0 .4rem; font: 400 .78rem/1 var(--fe); letter-spacing: .18em; color: var(--ink2); }
.stamp { display: inline-block; margin: .4rem 0 1rem -4px; padding: .32em .6em .38em; border: 4px double var(--stamp); border-radius: 7px; color: var(--stamp); font: 400 clamp(1.5rem, 1rem + 1.4vw, 2.15rem)/1 var(--fe); letter-spacing: .06em; transform: rotate(-5deg); mask-image: var(--inked); mask-size: 170px; }
.stamp.is-thump { animation: thump .5s cubic-bezier(.2, .9, .3, 1.25); }
@keyframes thump {
  0% { transform: rotate(-9deg) scale(1.7); opacity: 0; }
  55% { transform: rotate(-4deg) scale(.95); opacity: 1; }
  100% { transform: rotate(-5deg) scale(1); opacity: 1; }
}
.card[data-state="play"] .stamp { color: #2D5E45; border-color: #2D5E45; }
.card[data-state="bench"] .stamp { color: #23324F; border-color: #23324F; }
.verdict__why { max-width: 26em; font-size: .98rem; color: var(--ink2); }
.verdict__nums { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; width: 100%; margin: .2rem 0 1.2rem; padding: .9rem 0; border-block: 1px solid #17140f4c; }
.verdict__nums dt { font: 400 .72rem/1.2 var(--fe); letter-spacing: .16em; color: var(--ink2); }
.verdict__nums dd { margin: .3rem 0 0; font: 400 1.18rem/1.2 var(--fe); letter-spacing: .02em; font-variant-numeric: lining-nums; }
.track { display: flex; width: 100%; margin: 0 0 1.4rem; padding: 0; list-style: none; counter-reset: st; }
.track li { position: relative; flex: 1 1 0; padding-top: 26px; font: 400 .68rem/1.2 var(--fe); letter-spacing: .06em; text-align: center; color: var(--ink2); counter-increment: st; }
.track li::before { content: counter(st); position: absolute; top: 0; left: 50%; z-index: 1; width: 20px; height: 20px; margin-left: -10px; border: 1.5px solid var(--ink); border-radius: 50%; background: var(--manila); font: 400 .7rem/17px var(--fe); color: var(--ink); }
.track li::after { content: ""; position: absolute; top: 9.5px; left: 50%; width: 100%; height: 1.5px; background: var(--ink); opacity: .45; }
.track li:last-child::after { content: none; }
.track li.is-done::before { content: "\2713"; background: var(--ink); color: var(--manila); }
.track li.is-next { color: var(--stamp); font-weight: 700; }
.track li.is-next::before { border-color: var(--stamp); background: var(--stamp); color: #fff; box-shadow: 0 0 0 4px #a8215a33; }
.track li.is-skip { color: var(--ink2); text-decoration: line-through; text-decoration-color: var(--stamp); text-decoration-thickness: 1.5px; }
.track li.is-skip::before { border-style: dashed; opacity: .55; }
.verdict__go { margin-top: auto; }

.rules { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; padding: 0 clamp(20px, 3.4vw, 44px); list-style: none; border-top: 2px solid var(--ink); }
.rules li { padding: 14px 16px 18px 0; font-size: .86rem; line-height: 1.4; color: var(--ink2); transition: color .3s ease; }
.rules li + li { padding-left: 16px; border-left: 1px solid #17140f38; }
.rules b { display: block; margin-bottom: .2rem; font: 400 .74rem/1.3 var(--fe); letter-spacing: .12em; color: var(--ink); }
.card[data-state="play"] [data-rule="play"], .card[data-state="bench"] [data-rule="bench"],
.card[data-state="quote"] [data-rule="quote"], .card[data-state="call"] [data-rule="call"] { color: var(--ink); background: linear-gradient(var(--stamp), var(--stamp)) left top / 100% 3px no-repeat; }
.card[data-state="play"] [data-rule="play"] b, .card[data-state="bench"] [data-rule="bench"] b,
.card[data-state="quote"] [data-rule="quote"] b, .card[data-state="call"] [data-rule="call"] b { color: var(--stamp); }

/* rate plate */
.rates { padding: clamp(72px, 9vw, 130px) 0; color: var(--ink); background: var(--fibre), linear-gradient(180deg, var(--paper), #EFE5CC); }
.rates .sec-head { margin-bottom: 2.4rem; }
.plate { --sc: 22px; position: relative; padding: clamp(26px, 4vw, 54px) clamp(18px, 4vw, 58px) clamp(62px, 6vw, 84px); color: var(--ink); background: repeating-linear-gradient(90deg, #ffffff0f 0 1px, transparent 1px 2px, #3c28000d 2px 3px, transparent 3px 5px), radial-gradient(90% 70% at 30% 0%, #fff6d28c, transparent 60%), linear-gradient(160deg, #EBCF86, #C9A04C 42%, #B48C3D 64%, #D4B062); border-radius: 6px; box-shadow: inset 0 2px 0 #fffae1cc, inset 0 -3px 0 #46300859, inset 0 0 0 1px #46300899, inset 0 0 0 12px #fff0c814, inset 0 0 0 13px #4630084c, var(--ds, 0 30px 60px #3c280a4c); text-shadow: 0 1px 0 #fff4cd8c; }
.plate__screw { position: absolute; width: 16px; height: 16px; border-radius: 50%; background: linear-gradient(var(--a, 40deg), transparent 43%, #4E3A12 43% 57%, transparent 57%), radial-gradient(circle at 35% 30%, #FBEAB6, #BE9444 60%, #6E5220); box-shadow: inset 0 0 0 1px #281a0473, 0 1px 0 #fffae199; }
.plate__screw:nth-of-type(1) { top: var(--sc); left: var(--sc); }
.plate__screw:nth-of-type(2) { top: var(--sc); right: var(--sc); --a: 110deg; }
.plate__screw:nth-of-type(3) { bottom: var(--sc); left: var(--sc); --a: 160deg; }
.plate__screw:nth-of-type(4) { bottom: var(--sc); right: var(--sc); --a: 75deg; }
.plate__table { width: 100%; border-collapse: collapse; font-variant-numeric: lining-nums tabular-nums; }
.plate__table caption { padding-bottom: 1.1rem; font: 400 clamp(1.25rem, 1rem + 1vw, 1.7rem)/1.1 var(--fe); letter-spacing: .12em; text-align: center; }
.plate__table caption::after { content: ""; display: block; width: 7rem; height: 5px; margin: .7rem auto 0; border-block: 1px solid #281a048c; }
.plate__table th, .plate__table td { padding: .78rem .6rem; border-bottom: 1px solid #281a0461; box-shadow: 0 1px 0 #fff4cd73; }
.plate__table thead th { font: 400 .74rem/1.2 var(--fe); letter-spacing: .14em; border-bottom: 2px solid #281a0499; }
.plate__table thead th:first-child { text-align: left; }
.plate__table tbody th { font: 400 1rem/1.25 var(--fe); letter-spacing: .06em; text-align: left; }
.plate__table td { font: 400 1.06rem/1.25 var(--ft); text-align: center; }
.plate__table td.plate__all { font-style: italic; }
.plate__table tbody tr { transition: background-color .2s ease; }
.plate__table tbody tr:hover { background: #fff6d247; }
.plate__foot { position: absolute; left: 0; right: 0; bottom: clamp(24px, 3vw, 34px); margin: 0; font: italic 400 .95rem/1.3 var(--ft); text-align: center; }
.worth { position: relative; z-index: 2; width: calc(100% - 2 * clamp(12px, 4vw, 56px)); margin: -30px auto 0; padding: 4px clamp(18px, 3vw, 38px); color: var(--ink); background: var(--fibre), #FBF6E8; box-shadow: 0 1px 0 #0000000d, 0 18px 34px #3c280a2e; transform: rotate(-.4deg); }
.worth h3 { font: 400 1.05rem/1.2 var(--fe); letter-spacing: .12em; }
.worth__list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin: 0 0 1.4rem; }
.worth__list > div { padding: 0 18px; }
.worth__list > div:first-child { padding-left: 0; }
.worth__list > div + div { border-left: 1px solid #17140f33; }
.worth dt { margin-bottom: .5rem; font: italic 400 1.2rem/1.2 var(--ft); color: var(--bink); }
.worth dd { margin: 0 0 .6rem; font-size: .92rem; line-height: 1.45; color: var(--ink2); }
.worth .yes, .worth .no { font: 400 .72rem/1 var(--fe); letter-spacing: .12em; margin-right: .3em; }
.worth .yes { color: #2D5E45; }
.worth .no { color: var(--stamp); }

/* five states */
.states { padding: clamp(72px, 9vw, 130px) 0 clamp(80px, 10vw, 150px); background: var(--felt), var(--mottle), linear-gradient(180deg, var(--baize), #10301F); }
.rail { position: relative; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: clamp(12px, 1.6vw, 22px); margin: 3rem 0 0; padding: 64px 0 0; list-style: none; }
.rail::before { content: ""; position: absolute; top: 0; left: -1.5%; right: -1.5%; height: 12px; border-radius: 6px; background: linear-gradient(180deg, #FFF0C0, #D9B25A 35%, #9C7328 75%, #6E4E17); box-shadow: 0 4px 10px #00000073, inset 0 0 0 1px #281a0466; }
.rail__tag { --drop: 0px; --r: -1.5deg; position: relative; margin-top: var(--drop); padding: 44px 20px 22px; color: var(--ink); background: linear-gradient(135deg, transparent 18px, var(--manila) 18.5px) left top / 51% 100% no-repeat, linear-gradient(225deg, transparent 18px, var(--manila) 18.5px) right top / 51% 100% no-repeat; filter: drop-shadow(0 12px 14px #00000059); transform-origin: 50% calc(-64px - var(--drop)); transform: rotate(var(--r)); transition: transform .6s cubic-bezier(.3, 1.6, .4, 1); }
.rail__tag:nth-child(2) { --drop: 26px; --r: 1.2deg; }
.rail__tag:nth-child(3) { --drop: 8px; --r: -.8deg; }
.rail__tag:nth-child(4) { --drop: 34px; --r: 1.6deg; }
.rail__tag:nth-child(5) { --drop: 14px; --r: -1.2deg; }
.rail__tag:hover { transform: rotate(calc(var(--r) * -1.6)); }
.rail__tag::before { content: ""; position: absolute; left: 50%; bottom: calc(100% - 22px); width: 2px; height: calc(64px + var(--drop) + 10px); margin-left: -1px; background: linear-gradient(90deg, #D9CDAE, #F4ECD6, #BFAF88); }
.rail__tag::after { content: ""; position: absolute; left: 50%; top: 12px; width: 22px; height: 22px; margin-left: -11px; }
.rail__no { position: absolute; top: 40px; right: 16px; font: 400 2.6rem/1 var(--fe); color: #6b522047; }
.rail__tag h3 { margin: 0 0 .7rem; font: 400 1.25rem/1.1 var(--fe); letter-spacing: .06em; }
.rail__tag p { font-size: .94rem; line-height: 1.45; color: var(--ink2); }
.rail__you { padding: .7rem 0 0; border-top: 1px dashed #17140f59; color: var(--ink) !important; }
.rail__you b { display: block; font: 400 .74rem/1.4 var(--fe); letter-spacing: .12em; color: var(--stamp); }
.rail__time { margin: 0; font: 400 .92rem/1.4 var(--fh) !important; color: #23324F !important; }

/* bench book */
.ledger { padding: clamp(72px, 9vw, 130px) 0; color: var(--ink); background: var(--fibre), repeating-linear-gradient(180deg, transparent 0 31px, #506e961f 31px 32px), linear-gradient(90deg, transparent 0 calc(var(--gut) - 14px), #a8215a38 calc(var(--gut) - 14px) calc(var(--gut) - 13px), transparent calc(var(--gut) - 13px)), var(--paper); }
.ledger .sec-head { margin-bottom: 2rem; }
.entry { position: relative; display: grid; grid-template-columns: minmax(150px, 220px) minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "art head head" "art in out" "art sum sum"; gap: 0 clamp(20px, 3vw, 44px); padding: 44px 0; border-top: 4px double #6b52208c; }
.entry--flip { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(150px, 240px); grid-template-areas: "head head art" "in out art" "sum sum art"; }
.entry:last-child { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "head art" "in out" "sum sum"; }
.entry__art { grid-area: art; align-self: center; width: 100%; max-height: 300px; }
.entry__art--wide { max-height: 150px; align-self: end; }
.entry__head { grid-area: head; margin-bottom: 1.2rem; }
.entry__no { margin: 0 0 .3rem; font: 400 .78rem/1 var(--fe); letter-spacing: .18em; color: var(--bink); }
.entry__head h3 { font: italic 400 clamp(1.7rem, 1.2rem + 1.6vw, 2.5rem)/1.05 var(--ft); }
.entry__in { grid-area: in; }
.entry__out { grid-area: out; }
.entry h4 { margin-bottom: .6rem; padding-bottom: .4rem; font: 400 .78rem/1 var(--fe); letter-spacing: .18em; border-bottom: 1px solid #17140f66; }
.entry ul { margin: 0; padding: 0; list-style: none; }
.entry__in li { position: relative; padding: .18rem 0 .18rem 1.4rem; font: 400 1rem/1.6 var(--fh); color: #23324F; }
.entry__in li::before { content: "x"; position: absolute; left: .1rem; top: .05rem; font: 400 1rem/1.6 var(--fh); color: var(--stamp); }
.entry__out li { position: relative; padding: .3rem 0 .3rem 1.6rem; line-height: 1.45; }
.entry__out li::before { content: ""; position: absolute; left: 0; top: .55em; width: .95rem; height: .5rem; border-left: 2.5px solid var(--bink); border-bottom: 2.5px solid var(--bink); transform: rotate(-48deg); }
.entry__sum { grid-area: sum; display: flex; flex-wrap: wrap; margin: 1.6rem 0 0; }
.entry__stamp { position: absolute; right: 0; bottom: 40px; margin: 0; padding: .3em .55em .34em; border: 3px double #2D5E45; border-radius: 6px; color: #2D5E45; font: 400 1.05rem/1 var(--fe); letter-spacing: .1em; transform: rotate(-7deg); mask-image: var(--inked); }
.entry--flip .entry__stamp { right: auto; left: 46%; }
.entry__sum span { padding: .2rem 1.4rem .2rem 0; margin-right: 1.4rem; font: 400 .74rem/1.4 var(--fe); letter-spacing: .14em; color: var(--ink2); border-right: 1px solid #17140f4c; }
.entry__sum span:last-child { border-right: 0; }
.entry__sum b { display: block; margin-top: .15rem; font: 400 1.4rem/1.1 var(--fe); letter-spacing: .02em; color: var(--ink); font-variant-numeric: lining-nums; }

/* honest */
.honest { position: relative; padding: clamp(80px, 10vw, 150px) 0; background: var(--felt), radial-gradient(60% 80% at 15% 0%, #c9a04c29, transparent 70%), #0A1B13; overflow: clip; }
.honest .wrap { position: relative; }
.honest__stamp { position: absolute; right: 0; top: -.4rem; margin: 0; padding: .3em .55em .36em; border: 5px double #D9467F; border-radius: 10px; color: #D9467F; font: 400 clamp(1.6rem, 1rem + 2.4vw, 3.2rem)/1 var(--fe); letter-spacing: .06em; transform: rotate(-9deg); opacity: .9; mask-image: var(--inked); mask-size: 200px; }
.honest__title { position: relative; max-width: 13.5em; color: var(--cream); font-size: clamp(2.2rem, 1.2rem + 4.2vw, 4.8rem); }
.honest__title em { color: var(--bhi); }
.honest__list { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(20px, 3vw, 48px); margin: 3.4rem 0 0; padding: 0; list-style: none; counter-reset: h; }
.honest__list li { counter-increment: h; padding-top: 1.2rem; border-top: 1px solid #c9a04c80; }
.honest__list li::before { content: counter(h, upper-roman) "."; display: block; margin-bottom: .6rem; font: 400 1rem/1 var(--fe); letter-spacing: .1em; color: var(--brass); }
.honest__list h3 { margin-bottom: .6rem; font: 400 1.3rem/1.2 var(--fe); letter-spacing: .04em; color: var(--cream); }
.honest__list p { color: #f1e8d2cc; }

/* workshop */
.shop { padding: clamp(72px, 9vw, 130px) 0; color: var(--ink); background: var(--fibre), var(--cream); }
.shop__grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(28px, 5vw, 80px); align-items: start; }
.shop__text > p { color: var(--ink2); }
.shop__text h2 { margin-bottom: 1.4rem; }
.hours { margin: 1.6rem 0; border-top: 2px solid var(--ink); }
.hours div { display: flex; justify-content: space-between; gap: 1rem; padding: .7rem 0; border-bottom: 1px solid #17140f38; }
.hours dt { font: 400 .92rem/1.4 var(--fe); letter-spacing: .08em; }
.hours dd { margin: 0; font-style: italic; text-align: right; }
.shop__bring { padding: 1rem 1.2rem; background: #c9a04c29; border-left: 3px solid var(--brass); }
.shop__bring b { font: 400 .8rem/1 var(--fe); letter-spacing: .14em; margin-right: .3em; }
.wall { margin: 0; }
.wall__svg { width: 100%; padding: 18px 10px 6px; border-radius: 4px; background: radial-gradient(circle, #3c28108c 0 2.4px, transparent 3px) 0 0 / 22px 22px, linear-gradient(180deg, #DBC9A0, #CDB889); box-shadow: inset 0 0 0 6px #7A5A34, inset 0 0 0 7px #4E3820, 0 24px 44px #3c280a40; }
.wall__nums circle { fill: var(--brass); stroke: var(--ink); stroke-width: 1.5; }
.wall__nums text { fill: var(--ink); font-family: var(--fe); }
.wall .tool { transform-box: fill-box; transform-origin: 50% 0; transition: transform .6s cubic-bezier(.3, 1.6, .4, 1); }
.wall__svg:hover .tool:nth-child(odd) { transform: rotate(1.5deg); }
.wall__svg:hover .tool:nth-child(even) { transform: rotate(-1.5deg); }
.wall__key { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem 2rem; margin: .2rem 0 0; padding: 0; list-style: none; counter-reset: k; }
.wall__key li { position: relative; padding-left: 2.2rem; font-size: .93rem; line-height: 1.45; color: var(--ink2); counter-increment: k; }
.wall__key li::before { content: counter(k); position: absolute; left: 0; top: .05rem; width: 1.55rem; height: 1.55rem; border: 1.5px solid var(--ink); border-radius: 50%; background: var(--brass); font: 400 .8rem/1.4rem var(--fe); text-align: center; color: var(--ink); }
.wall__key b { color: var(--ink); font-weight: 700; }

/* FAQ */
.faq { padding: clamp(72px, 9vw, 130px) 0; color: var(--ink); background: linear-gradient(180deg, #EFE5CC, var(--paper)); border-top: 1px solid #17140f1a; }
.faq__grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(28px, 5vw, 80px); align-items: start; }
.faq .sec-head { position: sticky; top: 110px; }
.faq__list { border-top: 2px solid var(--ink); }
.faq details { border-bottom: 1px solid #17140f40; }
.faq summary, .fold summary { position: relative; display: block; padding: 1.15rem 3rem 1.15rem 0; font: 400 1.12rem/1.3 var(--fe); letter-spacing: .04em; cursor: pointer; list-style: none; }
.faq summary::-webkit-details-marker, .fold summary::-webkit-details-marker { display: none; }
.faq summary::before, .faq summary::after, .fold summary::before, .fold summary::after { content: ""; position: absolute; right: 8px; top: 50%; width: 16px; height: 2px; margin-top: -1px; background: var(--bink); transition: transform .3s ease; }
.faq summary::after, .fold summary::after { transform: rotate(90deg); }
.faq details[open] summary::after, .fold[open] summary::after { transform: rotate(0deg); }
.faq summary:hover { color: var(--bink); }
.faq summary:focus-visible, .fold summary:focus-visible, .book:focus-visible { outline-color: var(--ink); }
.faq details p { max-width: 36em; margin: -.2rem 0 1.3rem; color: var(--ink2); }

/* intake */
.intake { padding: clamp(80px, 10vw, 140px) 0; background: var(--felt), var(--mottle), radial-gradient(80% 90% at 80% 20%, var(--blift), var(--baize) 60%); }
.intake__grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(28px, 5vw, 80px); align-items: center; }
.intake__copy h2 { color: var(--cream); margin-bottom: 1.4rem; }
.intake__copy h2 em { color: var(--bhi); }
.intake__copy .kicker { color: var(--brass); }
.intake__copy p { color: #f1e8d2db; max-width: 30em; }
.intake__direct { margin-top: 1.6rem; font-style: italic; }
.intake__num { font: normal 400 1.02rem/1.6 var(--fe); letter-spacing: .04em; color: var(--bhi); overflow-wrap: anywhere; }
.intake__tag { position: relative; padding: 40px clamp(20px, 3.6vw, 48px) 36px clamp(58px, 7vw, 96px); color: var(--ink); filter: drop-shadow(0 24px 34px #00000073); transform: rotate(-1deg); }
.intake__tag::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--stock); clip-path: polygon(0 12%, 7% 0, 100% 0, 100% 100%, 7% 100%, 0 88%); }
.intake__eyelet { position: absolute; left: clamp(16px, 2.2vw, 30px); top: 50%; width: 30px; height: 30px; margin-top: -15px; }
.intake__title { margin: 0 0 1.2rem; font: 400 1.6rem/1 var(--fe); letter-spacing: .08em; }
.field { margin: 0 0 1.1rem; }
.field label, .days legend { display: block; margin-bottom: .3rem; font: 400 .76rem/1.2 var(--fe); letter-spacing: .16em; color: var(--ink2); }
.field input, .field select, .field textarea { display: block; width: 100%; padding: .45rem .1rem .5rem; border: 0; border-bottom: 1.5px solid var(--ink); border-radius: 0; background: transparent; color: #23324F; font: 400 1.05rem/1.4 var(--fh); }
.field select { font-family: var(--ft); color: var(--ink); cursor: pointer; }
.field textarea { resize: vertical; min-height: 4.4em; background: repeating-linear-gradient(180deg, transparent 0 1.9em, #17140f38 1.9em calc(1.9em + 1px)); }
.field ::placeholder { color: #23324f8c; }
.field input:focus-visible, .field select:focus-visible, .field textarea:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; border-bottom-color: var(--stamp); }
.days { display: flex; flex-wrap: wrap; gap: .5rem; padding: 0; border: 0; }
.days legend { width: 100%; padding: 0; }
.days label { position: relative; cursor: pointer; }
.days input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.days span { display: block; min-width: 3.2rem; padding: .5rem .7rem; border: 1.5px solid var(--ink); border-radius: 999px; font: 400 .86rem/1 var(--fe); letter-spacing: .1em; text-align: center; transition: background-color .2s ease, color .2s ease; }
.days label:hover span { background: #17140f14; }
.days input:checked + span { background: var(--ink); color: var(--manila); }
.days input:focus-visible + span { outline: 2px solid var(--ink); outline-offset: 3px; }
.intake__tag .btn { margin-top: .6rem; }

/* footer */
.foot { padding: 64px 0 28px; color: #f1e8d2d1; background: var(--felt), #07140E; border-top: 1px solid #c9a04c59; }
.foot__grid { display: grid; grid-template-columns: 1.4fr repeat(3, 1fr); gap: 32px; }
.foot__brand img { margin-bottom: .8rem; }
.foot__name { margin: 0 0 .3rem; font: 400 1.3rem/1 var(--fe); letter-spacing: .1em; color: var(--cream); }
.foot__line { font-style: italic; }
.foot__h { margin-bottom: .6rem; font: 400 .78rem/1 var(--fe); letter-spacing: .18em; color: var(--bhi); }
.foot p { font-size: .96rem; overflow-wrap: anywhere; }
.foot__small { margin-top: 2.6rem; padding-top: 1.2rem; border-top: 1px solid #c9a04c33; font-size: .82rem; color: #f1e8d29e; }

/* motion */
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
  .hero .plate, .hero__lede, .hero__actions { animation: rise .9s cubic-bezier(.2, .7, .2, 1) both; }
  .hero__lede { animation-delay: .3s; }
  .hero__actions { animation-delay: .45s; }
  .hero .plate::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; background: linear-gradient(100deg, transparent 38%, #fff9e070 50%, transparent 62%) 100% 0 / 300% 100% no-repeat; animation: sheen 1.6s ease-in-out 1.1s forwards; }
  .horn__draw use { stroke-dasharray: 1 1; stroke-dashoffset: 1; animation: draw 2.6s cubic-bezier(.55, .1, .25, 1) .15s forwards; }
  .horn__fill, .horn__glints, .horn__inscription, .horn__ring { animation: fadein 1.2s ease 1.6s both; }
  .horn__tie { animation: fadein .6s ease 2.1s both; }
  .hero__tag { animation: swing 2.4s cubic-bezier(.3, .6, .3, 1) 2.1s both; }
  .horn__glints path { transform-box: fill-box; transform-origin: center; animation: twinkle 4s ease-in-out 3s infinite; }
  .horn__glints path + path { animation-delay: 5s; }
  .compare .glint path { transform-box: fill-box; transform-origin: center; animation: twinkle 3.6s ease-in-out infinite; }
  .compare .glint path:nth-child(2) { animation-delay: 1.2s; }
  .compare .glint path:nth-child(3) { animation-delay: 2.3s; }
  .track li.is-next::before { animation: pulse 2s ease-in-out infinite; }
  .reveal { opacity: 0; transform: translateY(22px); transition: opacity .8s ease, transform .8s cubic-bezier(.2, .7, .2, 1); }
  .reveal.is-in { opacity: 1; transform: none; }
  .rail__tag.reveal { transform: translateY(-30px) rotate(calc(var(--r) * 4)); }
  .rail__tag.reveal.is-in { transform: rotate(var(--r)); transition: opacity .5s ease, transform 1.4s cubic-bezier(.3, 1.6, .4, 1); }
  .rail__tag.reveal.is-in:hover { transform: rotate(calc(var(--r) * -1.6)); transition-duration: .6s; }
}
@keyframes rise { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: none; } }
@keyframes draw { to { stroke-dashoffset: 0; } }
@keyframes sheen { to { background-position: 0 0; } }
@keyframes fadein { from { opacity: 0; } to { opacity: 1; } }
@keyframes swing {
  0% { opacity: 0; transform: rotate(-24deg); }
  12% { opacity: 1; }
  40% { transform: rotate(16deg); }
  65% { transform: rotate(2deg); }
  85% { transform: rotate(9deg); }
  100% { opacity: 1; transform: rotate(7deg); }
}
@keyframes twinkle { 0%, 70%, 100% { opacity: .15; transform: scale(.4) rotate(0deg); } 82% { opacity: 1; transform: scale(1) rotate(45deg); } }
@keyframes pulse { 0%, 100% { box-shadow: 0 0 0 4px #a8215a38; } 50% { box-shadow: 0 0 0 9px #a8215a00; } }

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

/* responsive */
@media (max-width: 1080px) {
  .nav a { padding-inline: .5rem; }
  .rail { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 90px; }
  .rail__tag { --drop: 0px !important; }
  .card__body { grid-template-columns: 1fr; }
  .verdict { border-left: 0; border-top: 2px dashed #17140f59; }
  .worth__list { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 1.2rem; }
  .worth__list > div:nth-child(3) { padding-left: 0; border-left: 0; }
}
@media (max-width: 900px) {
  .head__in { flex-wrap: wrap; gap: .4rem 1rem; padding-bottom: 0; }
  .nav { order: 3; width: 100%; margin: 0 -4px; overflow-x: auto; scrollbar-width: none; mask-image: linear-gradient(90deg, #000 88%, transparent); }
  .nav::-webkit-scrollbar { display: none; }
  .nav ul { width: max-content; padding-right: 2rem; }
  .head__cta { margin-left: auto; }
  .hero__in { grid-template-columns: minmax(0, 1fr); }
  .hero__copy { padding-bottom: 0; }
  .hero__art { width: min(100%, 560px); margin: 0 -6% 4.4rem auto; }
  .sec-head--split { grid-template-columns: 1fr; }
  .sec-head--split .sec-lede { margin-top: 1.2rem; }
  .shop__grid, .faq__grid, .intake__grid { grid-template-columns: 1fr; }
  .faq .sec-head { position: static; }
  .foot__grid { grid-template-columns: 1fr 1fr; }
  .entry, .entry--flip, .entry:last-child { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "head art" "in out" "sum sum"; }
  .entry__art { max-height: 170px; justify-self: end; width: auto; }
  .honest__list { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  body { font-size: 1rem; }
  .rates, .states, .ledger, .honest, .shop, .faq, .intake { padding-block: 56px; }
  .brand__name { font-size: 1rem; }
  .hero { padding-top: 26px; }
  .hero .plate { --sc: 11px; margin: 0 -4px 1.4rem; padding: 30px 22px 18px; }
  .plate__top { margin-bottom: .8rem; font-size: .72rem; letter-spacing: .14em; gap: .7em; }
  .hero__title { margin-bottom: 1rem; }
  .hero__engr { font-size: clamp(1.9rem, 9.2vw, 2.7rem); letter-spacing: .05em; }
  .hero__ital { font-size: clamp(1.95rem, 9.4vw, 2.7rem); }
  .plate__facts li { padding: 0 .35rem; font-size: .84rem; }
  .plate__facts span { font-size: .7rem; letter-spacing: .06em; }
  .hero__actions { margin-top: 1.2rem; }
  .hero__art { width: 86%; margin: 1.4rem -4% 4.6rem auto; }
  .hero__tag { --tw: 132px; padding: 0 10px 14px; }
  .tag__line { font-size: .78rem; }
  .tag__line--big { font-size: .92rem; }
  .honest__stamp { position: relative; display: inline-block; top: 0; margin-bottom: 1.4rem; }
  .entry__stamp { position: static; justify-self: start; margin-top: 1.2rem; }
  .entry--flip .entry__stamp { left: auto; }
  .brand__mark { width: 34px; height: 34px; }
  .head__cta { min-height: 40px; padding: .45em .9em .5em 2.1em; font-size: .88rem; }
  .compare__stage { margin-inline: calc(var(--gut) * -1); border-radius: 0; }
  .compare__stage::before { inset: 6px; border-radius: 4px; }
  .compare__tab { top: 10px; font-size: .64rem; }
  .compare__tab--in { left: 12px; }
  .compare__tab--out { right: 12px; }
  .compare__knob { width: 46px; height: 46px; margin: -23px 0 0 -23px; }
  .card { margin-top: 20px; }
  .card::before { clip-path: polygon(0 24px, 24px 0, 100% 0, 100% 100%, 0 100%); }
  .card__eyelet { left: 14px; top: 16px; }
  .card__top { padding-left: 56px; }
  .card__meta { margin-left: 0; font-size: .9rem; gap: .2rem .6rem; }
  .card__meta span + span::before { margin-right: .6rem; }
  .crits__head { display: none; }
  .crit { grid-template-columns: 1fr; gap: 6px; }
  .crit__name { margin-bottom: 4px; }
  .opt { display: grid; grid-template-columns: 5.6rem 1fr; align-items: baseline; gap: .6rem; padding: 10px 14px 10px 18px; }
  .opt__grade { display: block; font: 400 .7rem/1.2 var(--fe); letter-spacing: .12em; }
  .opt:nth-child(1) .opt__grade { color: #2D5E45; }
  .opt:nth-child(2) .opt__grade { color: var(--bink); }
  .opt:nth-child(3) .opt__grade { color: var(--stamp); }
  .opt::after { inset: -12px -12px -9px 5.6rem; }
  .rules { grid-template-columns: 1fr 1fr; }
  .rules li:nth-child(3) { padding-left: 0; border-left: 0; }
  .rules li:nth-child(n+3) { border-top: 1px solid #17140f38; }
  .plate { padding-bottom: 100px; }
  .plate__foot { bottom: 42px; padding-inline: 40px; }
  .plate__table thead { display: none; }
  .plate__table, .plate__table tbody, .plate__table tr, .plate__table th, .plate__table td, .plate__table caption { display: block; }
  .plate__table tbody tr { display: grid; grid-template-columns: 1fr 1fr; padding: .6rem 0; border-bottom: 1px solid #281a0461; box-shadow: 0 1px 0 #fff4cd73; }
  .plate__table th, .plate__table td { border: 0; box-shadow: none; padding: .25rem 0; }
  .plate__table tbody th { grid-column: 1 / -1; margin-bottom: .2rem; }
  .plate__table td { text-align: left; }
  .plate__table td[data-i]::before { content: attr(data-i); display: block; font: 400 .66rem/1.3 var(--fe); letter-spacing: .12em; opacity: .8; }
  .plate__table td.plate__all { grid-column: 1 / -1; }
  .worth { transform: none; width: calc(100% - 20px); }
  .worth__list { grid-template-columns: 1fr; }
  .worth__list > div { padding: 0 !important; border-left: 0 !important; }
  .worth__list > div + div { padding-top: 1rem !important; border-top: 1px solid #17140f33; }
  .rail { grid-template-columns: 1fr; row-gap: 22px; margin-top: 2rem; padding: 0 0 0 44px; }
  .rail::before { top: -10px; bottom: -10px; left: 0; right: auto; width: 12px; height: auto; background: linear-gradient(90deg, #FFF0C0, #D9B25A 35%, #9C7328 75%, #6E4E17); }
  .rail__tag, .rail__tag.reveal, .rail__tag.reveal.is-in { transform: rotate(calc(var(--r) * .5)); transform-origin: -30px 50%; padding: 22px 20px 20px 48px; background: linear-gradient(45deg, transparent 16px, var(--manila) 16.5px) left bottom / 100% 51% no-repeat, linear-gradient(135deg, transparent 16px, var(--manila) 16.5px) left top / 100% 51% no-repeat; }
  .rail__tag::before { left: -32px; top: 50%; bottom: auto; width: 54px; height: 2px; margin: -1px 0 0; background: linear-gradient(180deg, #D9CDAE, #F4ECD6, #BFAF88); }
  .rail__tag::after { left: 14px; top: 50%; margin: -11px 0 0; }
  .rail__no { top: 16px; }
  .book { display: flex; gap: 12px; margin: 0 calc(var(--gut) * -1); padding: 4px var(--gut) 16px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: var(--gut); }
  .entry, .entry--flip, .entry:last-child { flex: 0 0 88%; grid-template-columns: 1fr; grid-template-areas: "head" "art" "in" "out" "sum"; padding: 24px 18px 26px; border: 1px solid #6b52204d; background: var(--fibre), #FBF6E8; box-shadow: 0 8px 18px #3c280a24; scroll-snap-align: start; }
  .entry__art { justify-self: start; max-height: 150px; margin-bottom: 1.2rem; }
  .entry__art--wide { width: 100%; max-height: none; }
  .entry__out { margin-top: 1.4rem; }
  .entry__sum { gap: .5rem 1.4rem; }
  .entry__sum span { padding: 0; margin: 0; border: 0; letter-spacing: .1em; }
  .entry__sum b { font-size: 1.12rem; }
  .wall__key { grid-template-columns: 1fr; }
  .foot__grid { grid-template-columns: 1fr; }
  .intake__tag { transform: none; padding-left: 50px; }
  .intake__eyelet { left: 12px; }
}
@media (max-width: 380px) {
  .verdict__nums { grid-template-columns: 1fr; }
  .track li { font-size: .58rem; letter-spacing: 0; }
  .rules { grid-template-columns: 1fr; }
  .rules li { padding-left: 0 !important; border-left: 0 !important; }
  .rules li + li { border-top: 1px solid #17140f38; }
}

/* small caps last: a later font shorthand would reset them */
.skip, .kicker, .sec-head h2, .honest__title, .shop__text h2, .intake__copy h2, .btn, .plate__top, .horn__inscription, .tag__stamp, .plate__facts span, .compare__tab, .compare__hint, .card__title, .crits__head, .crit__name, .verdict__label, .stamp, .verdict__nums dt, .track li, .rules b, .plate__table caption, .plate__table thead th, .plate__table tbody th, .worth h3, .worth .yes, .worth .no, .rail__tag h3, .rail__you b, .entry h4, .entry__stamp, .entry__sum span, .honest__stamp, .honest__list h3, .hours dt, .shop__bring b, .faq summary, .wall summary, .intake__title, .field label, .days legend, .days span, .foot__name, .foot__h, .opt__grade, .plate__table td[data-i]::before { font-variant-caps: small-caps; font-variant-numeric: lining-nums; }
