/* ==========================================================================
   MEDIUM RARE SHOWROOM: public pages other than the home page
   (retailers, thank-you, 404, privacy notice, terms)
   Loaded after css/site.css (Medium Rare Distribution, unchanged) and
   css/home.css. Only what these pages add lives here.
   ========================================================================== */

body{--terrain-h:760px;--tpos:30% 20%}
body[data-p=retailers]{--tpos:70% 30%}
body[data-p=legal]{--tpos:10% 70%;--terrain-h:620px}

/* ---- Small label above a heading ------------------------------------------ */
.kick{font:600 12px/1.45 var(--text);letter-spacing:.28em;text-transform:uppercase;color:var(--rust)}

/* ---- Page headline: a sentence, so smaller than the one-word .h-page -------- */
.h-pg{font-family:var(--display);font-weight:700;font-stretch:111%;font-size:clamp(38px,5.6vw,92px);line-height:.96;letter-spacing:-.042em;color:var(--oxblood);max-width:13em;text-wrap:balance}

/* ---- Page top --------------------------------------------------------------- */
.pg-hero{padding-block:clamp(28px,5vw,84px) clamp(44px,6vw,96px)}
.pg-hero .kick{margin-bottom:clamp(14px,1.6vw,22px)}
.pg-hero .lead{margin-top:clamp(20px,2.4vw,34px);max-width:36em}

/* three short points in a row */
.trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px clamp(24px,4vw,64px);margin-top:clamp(32px,4vw,56px);padding-top:clamp(22px,2.4vw,32px);border-top:1px solid var(--rule);max-width:1100px}
.trio b{display:block;font-family:var(--display);font-weight:680;font-stretch:110%;font-size:clamp(24px,2.2vw,32px);line-height:1.05;letter-spacing:-.03em;color:var(--oxblood);margin-bottom:8px}
.trio li{font-size:16px;line-height:1.5;color:var(--ink-soft);max-width:22em}

/* ---- Registration: form on the left, notes on the right --------------------- */
.reg{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,.78fr);gap:40px clamp(36px,5vw,96px);align-items:start}
.reg-head{grid-column:1/-1}
.reg-head .lead{margin-top:16px;max-width:34em}
.form .fs-lab{grid-column:1/-1;font-family:var(--display);font-weight:680;font-stretch:110%;font-size:clamp(22px,1.8vw,26px);line-height:1.1;letter-spacing:-.028em;color:var(--oxblood);padding-top:26px;margin-top:14px;border-top:1px solid var(--rule)}
.form .fs-lab:first-of-type{border-top:0;padding-top:0;margin-top:0}
.field select,.field textarea{font:400 18px/1.3 var(--text);color:var(--ink);background:var(--stamp);border:1.5px solid transparent;border-radius:10px;padding:14px 16px;min-height:52px;width:100%;box-shadow:inset 0 0 0 1px var(--rule);transition:border-color 160ms ease,box-shadow 160ms ease}
.field textarea{min-height:120px;line-height:1.45;resize:vertical}
.field textarea::placeholder{color:#82564D}
.field select:focus,.field textarea:focus{outline:none;border-color:var(--oxblood);box-shadow:none}
.who.sm .who-opt span{min-height:42px;padding:0 17px;font-size:15px}
.who{margin:0}
.agree-box{grid-column:1/-1;display:grid;gap:14px;padding-top:26px;margin-top:14px;border-top:1px solid var(--rule)}
.agree{display:flex;gap:12px;align-items:flex-start;font-size:16px;line-height:1.45;cursor:pointer}
.agree input{flex:none;width:20px;height:20px;margin:2px 0 0;accent-color:var(--oxblood);cursor:pointer}
.agree-note{font-size:14.5px;line-height:1.5;color:var(--ink-soft);padding-left:32px;margin-top:-6px;max-width:44em}
.hp{position:absolute;left:-9999px;opacity:0}

.reg-aside{position:sticky;top:24px;display:grid}
.card-ox{background:var(--oxblood);color:var(--paper);border-radius:18px;padding:clamp(22px,2.2vw,30px);margin-bottom:10px}
.card-ox .kick{color:var(--gold)}
.card-ox h3{font-family:var(--display);font-weight:680;font-stretch:110%;font-size:clamp(28px,2.4vw,36px);line-height:1;letter-spacing:-.03em;color:var(--stamp);margin:10px 0 12px}
.card-ox p{font-size:16px;line-height:1.5;color:rgba(238,220,209,.86)}
.card-ox p+p{margin-top:.7em}
.note-sec{padding-block:24px;border-top:1px solid var(--rule)}
.note-sec:first-child{border-top:0}
.card-ox+.note-sec{border-top:0}
.note-sec h3{font-family:var(--display);font-weight:660;font-stretch:108%;font-size:22px;line-height:1.1;letter-spacing:-.025em;margin-bottom:10px}
.note-sec p,.note-sec li{font-size:16px;line-height:1.5;color:var(--ink-soft)}
.note-sec p+p{margin-top:.7em}
.note-sec ol{padding-left:1.3em;list-style:decimal}
.note-sec li+li{margin-top:.6em}
.note-sec li b{color:var(--ink);font-weight:600}

/* ---- Thank-you and 404: the stamp on the left, the words on the right ------- */
.rts .h-pg{max-width:11em}
.rts .kick{margin-bottom:16px}
.rts .trio{margin-top:36px}
.rts-rubber i:empty{display:none}

/* ---- Legal pages: long documents ------------------------------------------- */
.legal>div:first-child{position:sticky;top:28px;align-self:start}
.legal .lead{margin-top:20px}
.legal .meta{margin-top:12px}
.legal .prose{font-size:17px;line-height:1.62}
.legal .prose p,.legal .prose li{max-width:40em;text-wrap:pretty}
.legal .prose>p:first-child,.legal .prose .intro{font-size:clamp(19px,1.5vw,22px);line-height:1.5}
.legal .prose h3{font-family:var(--display);font-weight:660;font-stretch:108%;font-size:19px;line-height:1.2;letter-spacing:-.02em;margin:26px 0 8px}
.legal .prose ul,.legal .prose ol{margin:.7em 0 1em;padding-left:1.25em}
.legal .prose ul{list-style:disc}
.legal .prose ol{list-style:decimal}
.legal .prose li+li{margin-top:.5em}
.legal .prose li::marker{color:var(--oxblood)}
.legal .prose a{color:var(--oxblood);text-decoration:underline;text-decoration-thickness:.075em;text-underline-offset:.18em}
.legal .prose strong{font-weight:650}
.legal .prose hr{border:0;border-top:1px solid var(--rule);margin:34px 0}
.legal .prose hr+h2{margin-top:0}
.legal .prose blockquote{margin:0 0 28px;padding:18px 22px;border-radius:14px;background:var(--stamp);box-shadow:inset 0 0 0 1px var(--rule);max-width:40em}
.legal .prose blockquote p{font-size:16px;color:var(--ink-soft)}
.legal .prose table{width:100%;max-width:40em;border-collapse:collapse;margin:16px 0 20px;font-size:16px;background:var(--stamp);border-radius:12px;overflow:hidden;box-shadow:inset 0 0 0 1px var(--rule)}
.legal .prose th,.legal .prose td{text-align:left;padding:12px 16px;border-bottom:1px solid var(--rule);vertical-align:top}
.legal .prose th{font:600 12px/1.4 var(--text);letter-spacing:.18em;text-transform:uppercase;color:var(--rust)}
.legal .prose tr:last-child td{border-bottom:0}
.legal .prose .eyebrow,.legal .prose .updated{display:none}

/* ---- Narrow screens --------------------------------------------------------- */
@media (max-width:1000px){
  .reg{grid-template-columns:1fr}
  .reg-aside{position:static}
  .legal>div:first-child{position:static}
}
@media (max-width:700px){
  .trio{grid-template-columns:1fr;gap:18px}
  .trio li{max-width:none}
  .who.sm .who-opt span{padding:0 14px}
  .legal .prose table{font-size:15px}
  .legal .prose th,.legal .prose td{padding:10px 12px}
}
