:root{
  --sign:#003271; --sign-deep:#00234F; --sign-mid:#1A5099; --sign-pale:#CCD8EE;
  --steel:#23282A; --steel-2:#2F3537; --steel-3:#3C4345; --steel-dim:#8A9391;
  --ink:#1B1F1E; --ink-soft:#5B625F;
  --paper:#F1F0EB; --card:#FFFFFF;
  --amber:#FEC500; --amber-hot:#FFD64D; --amber-ink:#1A1500;
  --rust:#A33A24; --rust-pale:#F8EAE6; --rust-ink:#6B2418;
  --rule:#C9CEC7; --rule-soft:#E2E4DF;

  --t-2xs:.72rem;  --t-xs:.8125rem; --t-s:.9375rem; --t-m:1.0625rem;
  --t-l:1.3125rem; --t-xl:1.625rem; --t-2xl:2.125rem; --t-3xl:2.75rem;

  --gap:clamp(1rem,4vw,2rem);
  --col-gap:clamp(2rem,4vw,3.25rem);
  --wide:1120px;

  --r-data:3px; --r-ui:10px;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:Overpass,system-ui,sans-serif; font-size:1rem; line-height:1.55;
  overflow-wrap:break-word;
}
h1,h2,h3,h4{line-height:1.1; letter-spacing:-.018em; margin:0; font-weight:800}
p{margin:0}
a{color:var(--sign)}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{
  outline:3px solid var(--sign); outline-offset:3px; border-radius:2px;
}
.offer a:focus-visible,.hero a:focus-visible,.stickybar a:focus-visible,
.vinbox input:focus-visible,.vinbox button:focus-visible{outline-color:var(--amber)}
:where(section){scroll-margin-top:1rem}
.serif{font-family:"Source Serif 4",Georgia,serif}
.shell{max-width:var(--wide); margin-inline:auto; padding-inline:var(--gap)}

.disclose{
  background:var(--steel); color:var(--steel-dim);
  font-size:var(--t-2xs); font-weight:600; padding:.5rem 0; line-height:1.4;
}
.disclose strong{color:#DDE3E0; font-weight:600}

.brandbar{background:var(--card); border-bottom:1px solid var(--rule)}
.brandbar > div{
  max-width:var(--wide); margin-inline:auto; padding:.8rem var(--gap);
  display:flex; align-items:center; gap:.5rem 1.5rem; flex-wrap:wrap;
}
.brandbar .logo{display:block; height:52px; width:auto}
@media (max-width:600px){.brandbar .logo{height:44px}}

.brandbar nav{margin-left:auto}
.brandbar nav ul{
  display:flex; list-style:none; margin:0; padding:0;
  gap:1.4rem; font-size:var(--t-s); font-weight:600;
}
.brandbar nav a{color:var(--ink-soft); text-decoration:none; white-space:nowrap}
.brandbar nav a:hover{color:var(--sign)}

.navtoggle{display:none}

/* below this width the six topic links no longer fit beside the logo.
   RI needs a higher threshold than the other sites: its nav is 673px wide and
   the logo is a fixed 321px PNG, so they only clear --wide (1120px). */
@media (max-width:1119px){
  .navtoggle{
    display:grid; place-items:center; margin-left:auto;
    width:44px; height:44px; padding:0; cursor:pointer;
    background:none; border:1px solid var(--rule); border-radius:8px; color:var(--sign);
  }
  .navtoggle:hover{border-color:var(--sign)}
  .navtoggle svg{display:block}
  .navtoggle .x{display:none}
  .navtoggle[aria-expanded="true"] .bars{display:none}
  .navtoggle[aria-expanded="true"] .x{display:block}

  .brandbar nav.collapse{display:none; margin-left:0; flex:1 0 100%}
  .brandbar nav.collapse.open{display:block}
  .brandbar nav.collapse ul{flex-direction:column; gap:0; font-size:var(--t-m)}
  .brandbar nav.collapse li + li{border-top:1px solid var(--rule-soft)}
  .brandbar nav.collapse a{display:block; padding:.8rem 0}
}

.hero{background:var(--sign); padding:clamp(1.75rem,4.5vw,2.75rem) 0 clamp(2rem,5vw,3rem)}
.hero-grid{display:grid; gap:clamp(1.5rem,4vw,2.75rem); align-items:start}

.hero-grid > *{min-width:0}
@media (min-width:920px){.hero-grid{grid-template-columns:1.55fr .8fr}}

.hero h1{
  color:#fff; font-weight:900; font-size:clamp(1.85rem,4.4vw,var(--t-3xl));
  max-width:none; text-wrap:balance;
}
.hero .lede{
  color:var(--sign-pale); font-size:var(--t-m); max-width:none;
  margin-top:.9rem; line-height:1.5;
}
.hero .lede b{color:#fff; font-weight:700}

.tiers{background:var(--sign-deep); border-radius:var(--r-ui); padding:1.15rem 1.25rem}
.tiers h2{
  font-size:var(--t-s); font-weight:700; color:#fff;
  display:flex; align-items:baseline; gap:.5rem;
}
.tiers h2 span{
  margin-left:auto; font-size:var(--t-2xs); font-weight:700;
  color:var(--sign-deep); background:var(--sign-pale);
  border-radius:3px; padding:.14rem .5rem;
}
.tiers h2.paid span{background:0; color:#8FA6CF; padding:.14rem 0}
.tiers ul{list-style:none; margin:.7rem 0 0; padding:0; display:grid; gap:.42rem}
.tiers li{
  position:relative; padding-left:1.5rem; font-size:var(--t-s);
  color:#E3EAF6; line-height:1.4;
}
.tiers li::before{
  content:""; position:absolute; left:0; top:.36em; width:13px; height:13px;
}
.tiers .free li::before{
  background:no-repeat center/13px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238FD8B8' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5l5.2 5.2L20 6.5'/%3E%3C/svg%3E");
}
.tiers .locked li{color:#AFBDD8}
.tiers .locked li::before{
  border:1.5px solid #5C77A8; border-radius:50%; width:11px; height:11px; top:.4em;
}
.tiers hr{border:0; border-top:1px solid rgba(255,255,255,.16); margin:1.05rem 0}

.vinbox{
  min-width:0; margin-top:clamp(1.35rem,3.5vw,1.85rem);
  background:var(--steel); border-radius:var(--r-ui);
  padding:clamp(1.1rem,3vw,1.4rem);
  box-shadow:0 16px 32px -22px rgba(0,20,60,.9);
}
.vinbox label{
  display:block; font-size:var(--t-xs); font-weight:700; color:var(--steel-dim);
  margin-bottom:.5rem;
}
.vinrow{display:flex; gap:.5rem; flex-wrap:wrap}
.vinrow input{
  flex:1 1 15rem; min-width:0; border:0; border-radius:var(--r-data);
  padding:.9rem .95rem; background:#fff; color:var(--ink);
  font-family:"Overpass Mono",ui-monospace,monospace; font-size:1.05rem; font-weight:700;
  letter-spacing:.14em; text-transform:uppercase;
}
.vinrow input::placeholder{
  letter-spacing:.02em; color:#9AA29E; font-weight:400; text-transform:none;
  font-family:Overpass,sans-serif;
}
.vinrow button{
  flex:0 0 auto; background:var(--amber); color:var(--amber-ink); border:0;
  border-radius:var(--r-data); padding:.9rem 1.6rem; cursor:pointer;
  font-family:Overpass,sans-serif; font-weight:800; font-size:1rem;
}
.vinrow button:hover{background:var(--amber-hot)}
.vinrow button[disabled]{opacity:.55; cursor:progress}
@media (max-width:520px){.vinrow input,.vinrow button{flex:1 1 100%}}
.vinfoot{
  display:flex; flex-wrap:wrap; gap:.35rem .9rem; align-items:baseline;
  margin-top:.7rem; font-size:var(--t-xs); color:var(--steel-dim);
}
.vinfoot button{
  background:0; border:0; padding:0; cursor:pointer; color:var(--sign-pale);
  font-family:Overpass,sans-serif; font-size:var(--t-xs); font-weight:600;
  text-decoration:underline; text-underline-offset:3px;
}
.vinfoot button:hover{color:#fff}

.results{padding-block:clamp(1.25rem,3.5vw,2rem) clamp(2.5rem,6vw,4rem)}
.results:empty{padding-block:0}

.plate{background:var(--steel); border-radius:var(--r-ui); padding:1.2rem 1.1rem; overflow-x:auto}

.vinbox .plate{background:0; padding:1rem 0 0; margin-top:.75rem; border-top:1px solid var(--steel-3)}
.vinbox .cell{width:26px; height:34px; font-size:.92rem}
.vinbox .strip{gap:10px}
.plate-top{
  display:flex; justify-content:space-between; align-items:center;
  gap:.75rem 1rem; flex-wrap:wrap; margin-bottom:.9rem;
}
.plate-name{color:#fff; font-size:var(--t-m); font-weight:700; letter-spacing:-.01em}
.stamp{
  font-size:var(--t-xs); font-weight:700; padding:.28rem .7rem;
  border-radius:999px; border:1.5px solid; white-space:nowrap;
}
.stamp.ok{border-color:#6F9BE0; color:#9DC0FF}
.stamp.bad{border-color:#D07A63; color:#FFB3A2}
.stamp.partial{border-color:var(--steel-3); color:#B6BDB9}

.strip{display:flex; gap:12px; min-width:max-content}
.seg-cells{display:flex; gap:3px}
.cell{
  width:30px; height:38px; display:grid; place-items:center; border-radius:var(--r-data);
  background:var(--steel-2); color:#fff;
  font-family:"Overpass Mono",monospace; font-weight:700; font-size:1rem;
}
.cell.wild{background:0; box-shadow:0 0 0 1.5px var(--steel-3) inset; color:var(--steel-3)}
.seg[data-k="check"] .cell{background:var(--sign); box-shadow:0 0 0 2px #6F9BE0 inset}
.seg[data-k="check"] .cell.wild{background:0; box-shadow:0 0 0 1.5px var(--steel-3) inset}
.seg[data-k="serial"] .cell{background:var(--steel-2); color:#9AA29E}
.seg.bad .cell{background:#5E2A21; box-shadow:0 0 0 2px #C4644F inset}
.seg-label{
  margin-top:.5rem; font-size:.66rem; font-weight:700; color:var(--sign-pale);
  letter-spacing:.02em;
}
.seg-label span{display:block; font-weight:400; font-size:.63rem; color:var(--steel-dim)}

@media (max-width:680px){
  .plate{overflow-x:visible}
  .strip,.vinbox .strip{min-width:0; flex-wrap:wrap; gap:.85rem 10px}
  .cell,.vinbox .cell{width:26px; height:34px; font-size:.9rem}
}
@media (max-width:360px){
  .cell,.vinbox .cell{width:23px; height:31px; font-size:.82rem}
  .strip,.vinbox .strip{gap:.8rem 7px}
  .seg-cells{gap:2px}
}

.verdict{
  display:flex; flex-wrap:wrap; align-items:center; gap:.5rem 1.35rem;
  margin-top:.9rem; padding:.9rem 1.15rem;
  background:var(--card); border:1px solid var(--rule); border-radius:var(--r-ui);
}
.verdict dl{display:flex; flex-wrap:wrap; gap:.5rem 1.35rem; margin:0; flex:1 1 auto}
.verdict div{display:flex; align-items:baseline; gap:.45rem}
.verdict dt{font-size:var(--t-xs); color:var(--ink-soft); font-weight:600}
.verdict dd{margin:0; font-size:var(--t-s); font-weight:700}
.verdict dd.flag{color:var(--rust)}
.verdict dd.good{color:var(--sign)}
.verdict .jump{
  flex:0 0 auto; font-size:var(--t-s); font-weight:700; color:var(--sign);
  text-underline-offset:3px;
}

.msg{
  margin-top:1rem; padding:.85rem 1.1rem; border-radius:0 var(--r-ui) var(--r-ui) 0;
  font-size:var(--t-s); font-weight:600; line-height:1.5;
}
.msg code{font-family:"Overpass Mono",monospace; font-size:.9em}
.msg.error{background:var(--rust-pale); border-left:5px solid var(--rust); color:var(--rust-ink)}
.msg.warn{background:#FCF3DA; border-left:5px solid #C89A10; color:#5C4708}

.section-head{
  display:flex; align-items:baseline; gap:.8rem; flex-wrap:wrap;
  margin:clamp(1.85rem,4.5vw,2.5rem) 0 .15rem;
  padding-bottom:.5rem; border-bottom:2px solid var(--ink);
}
.section-head h2{font-size:var(--t-l); font-weight:800}
.count{font-size:var(--t-xs); color:var(--ink-soft); font-weight:600; margin-left:auto}

.grid{display:grid; gap:0 2rem; grid-template-columns:1fr; margin:0}
@media (min-width:560px){.grid{grid-template-columns:1fr 1fr}}
@media (min-width:900px){.grid{grid-template-columns:repeat(4,1fr)}}
.field{padding:.9rem 0; border-bottom:1px solid var(--rule)}
.field dt{font-size:var(--t-xs); font-weight:600; color:var(--ink-soft)}
.field dd{margin:.25rem 0 0; font-size:var(--t-m); font-weight:700; line-height:1.3}
.src{
  display:flex; align-items:center; gap:.35rem; margin-top:.3rem;
  font-size:var(--t-2xs); color:var(--ink-soft);
}
.src::before{content:""; width:6px; height:6px; border-radius:1px; background:currentColor}
.src.vpic{color:var(--sign-mid)}

.checklist{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:1fr}
@media (min-width:600px){.checklist{grid-template-columns:1fr 1fr; column-gap:2rem}}
@media (min-width:900px){.checklist{grid-template-columns:repeat(3,1fr)}}
.checklist li{
  position:relative; padding:.62rem 0 .62rem 1.6rem;
  border-bottom:1px solid var(--rule-soft); font-size:var(--t-s);
}
.checklist li::before{
  content:""; position:absolute; left:0; top:.85em; width:13px; height:13px;
  background:no-repeat center/13px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2314543F' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5l5.2 5.2L20 6.5'/%3E%3C/svg%3E");
}
.checklist li b{font-weight:400; color:var(--ink-soft)}

.recalls{margin-top:.9rem; display:grid; gap:.75rem}
.recall{
  background:var(--card); border:1px solid var(--rule);
  border-left:5px solid var(--rust); border-radius:0 var(--r-ui) var(--r-ui) 0;
  padding:1rem 1.15rem;
}
.recall-top{display:flex; align-items:baseline; gap:.7rem; flex-wrap:wrap; margin-bottom:.4rem}
.recall-id{font-family:"Overpass Mono",monospace; font-size:var(--t-xs); color:var(--ink-soft)}
.recall-comp{font-weight:700; font-size:var(--t-m)}
.recall-body{margin:0}
@media (min-width:900px){
  .recall-body{columns:2; column-gap:var(--col-gap)}
}
.recall p{
  font-family:"Source Serif 4",Georgia,serif; font-size:var(--t-s);
  color:var(--ink-soft); line-height:1.55; margin-bottom:.5rem;
}
.recall p:last-child{margin-bottom:0}
.recall p b{font-family:Overpass,sans-serif; font-weight:700; color:var(--ink)}
.morecalls{margin-top:.75rem}
.morecalls > summary{
  cursor:pointer; list-style:none; font-size:var(--t-s); font-weight:700; color:var(--sign);
  padding:.7rem 0; border-top:1px solid var(--rule);
}
.morecalls > summary::-webkit-details-marker{display:none}
.morecalls[open] > summary{color:var(--ink-soft)}
.clean{
  margin-top:.9rem; background:var(--card); border:1px solid var(--rule);
  border-left:5px solid var(--sign); border-radius:0 var(--r-ui) var(--r-ui) 0;
  padding:1rem 1.15rem; font-size:var(--t-s); color:var(--ink-soft);
}
.clean b{color:var(--ink)}

.offer{
  margin-top:clamp(1.5rem,4vw,2.25rem); background:var(--steel);
  border-radius:var(--r-ui); overflow:hidden;
}
.offer-head{padding:clamp(1.35rem,3.5vw,1.9rem) clamp(1.25rem,3.5vw,2rem) 0}
.offer-head h2{color:#fff; font-size:clamp(1.4rem,3.4vw,var(--t-xl)); text-wrap:balance}
.offer-head p{color:#AFBDD8; margin-top:.6rem; font-size:var(--t-s); line-height:1.5}
.ledger{
  display:grid; gap:0; margin-top:clamp(1.25rem,3vw,1.75rem);
  padding:0 clamp(1.25rem,3.5vw,2rem);
}
@media (min-width:860px){.ledger{grid-template-columns:.95fr 1.05fr; gap:0 clamp(1.5rem,3.5vw,2.5rem)}}
.ledger h3{font-size:var(--t-s); font-weight:700; color:#fff; padding-bottom:.55rem}
.ledger ul{list-style:none; margin:0; padding:0}
.ledger li{
  position:relative; padding:.6rem 0 .6rem 1.6rem; font-size:var(--t-s);
  border-top:1px solid var(--steel-3); line-height:1.45;
}
.ledger li::before{content:""; position:absolute; left:0; top:.95em; width:13px; height:13px}
.answered li{color:#C4CCC9}
.answered li::before{
  background:no-repeat center/13px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234E9E7E' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5l5.2 5.2L20 6.5'/%3E%3C/svg%3E");
}
.answered li b{color:#fff; font-weight:600}
.missing{margin-top:1.75rem}
@media (min-width:860px){.missing{margin-top:0}}

.ledger.one{grid-template-columns:1fr}
.ledger.one .missing{margin-top:0}
@media (min-width:860px){
  .ledger.one .missing ul{
    display:grid; grid-template-columns:1fr 1fr; column-gap:var(--col-gap);
  }
}
.missing li{color:#fff; font-weight:600}
.missing li::before{border:1.5px solid #6F7A7D; border-radius:50%; width:11px; height:11px; top:1em}
.missing li span{display:block; font-weight:400; color:#98A2A0; font-size:var(--t-xs); margin-top:.15rem}

.offer-foot{padding:0 clamp(1.25rem,3.5vw,2rem) clamp(1.35rem,3.5vw,2rem)}
.buy{
  margin-top:clamp(1.35rem,3vw,1.75rem);
  padding-top:clamp(1.35rem,3vw,1.75rem);
  border-top:1px solid var(--steel-3);
  display:flex; flex-wrap:wrap; align-items:center; gap:.85rem 1.5rem;
}
.price{font-size:var(--t-xl); font-weight:900; color:#fff; letter-spacing:-.03em; line-height:1}
.price span{display:block; font-size:var(--t-2xs); font-weight:400; color:var(--steel-dim); margin-top:.3rem; letter-spacing:0}
.cta{
  display:inline-block; background:var(--amber); color:var(--amber-ink);
  text-decoration:none; font-weight:800; font-size:1.05rem;
  padding:.9rem 1.7rem; border-radius:var(--r-data);
}
.cta:hover{background:var(--amber-hot)}
.fineprint{
  margin-top:1rem; font-size:var(--t-2xs); color:var(--steel-dim);
  max-width:64ch; line-height:1.55;
}

.buy .fineprint{flex:1 1 22rem; min-width:0; margin-top:0; max-width:56ch}
.offer .fineprint a{color:#AFBDD8}

.promo{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;
  gap:.9rem 1.75rem; margin-top:1.5rem; padding:1.15rem 1.35rem;
  background:var(--sign); border-radius:var(--r-ui);
}
.promo div{flex:1 1 20rem; min-width:0}
.promo strong{display:block; font-weight:700; font-size:var(--t-m); color:#fff}
.promo p{margin-top:.25rem; font-size:var(--t-s); color:#B9C9E6; max-width:54ch; line-height:1.5}
.promo .cta{flex:0 0 auto; padding:.8rem 1.45rem; font-size:var(--t-s)}
.promo.slim{padding:.95rem 1.15rem}
.promo.slim strong{font-size:var(--t-s)}

.stickybar{
  position:fixed; left:0; right:0; bottom:0; z-index:40;
  background:var(--steel); border-top:1px solid var(--steel-3);
  padding:.6rem var(--gap) calc(.6rem + env(safe-area-inset-bottom));
  transform:translateY(110%); transition:transform .22s ease; visibility:hidden;
}
.stickybar[data-show]{transform:none; visibility:visible}
.stickybar > div{
  max-width:var(--wide); margin-inline:auto;
  display:flex; align-items:center; gap:.75rem 1rem;
}
.stickybar p{flex:1 1 auto; min-width:0; font-size:var(--t-s); color:#C4CCC9; line-height:1.3}
.stickybar b{display:block; color:#fff; font-weight:700; font-size:var(--t-m)}
.stickybar .cta{flex:0 0 auto; padding:.7rem 1.25rem; font-size:var(--t-s)}
.stickybar .close{
  flex:0 0 auto; background:0; border:0; cursor:pointer; color:var(--steel-dim);
  font-size:1.2rem; line-height:1; padding:.4rem;
}
.stickybar .close:hover{color:#fff}

@media (max-width:560px){
  .stickybar{padding-top:.5rem; padding-bottom:calc(.5rem + env(safe-area-inset-bottom))}
  .stickybar p span{display:none}
  .stickybar b{font-size:var(--t-s)}
  .stickybar .cta{padding:.65rem 1.1rem}
}
@media (prefers-reduced-motion:reduce){.stickybar{transition:none}}
body[data-sticky]{padding-bottom:5rem}

.loader{
  margin-top:1.25rem; background:var(--steel); border-radius:var(--r-ui);
  padding:clamp(1.35rem,3.5vw,2rem); color:#fff;
}
.loader-vin{font-size:var(--t-xs); color:var(--steel-dim); margin-bottom:.4rem}
.loader-vin b{
  color:var(--sign-pale); font-family:"Overpass Mono",monospace;
  font-weight:600; letter-spacing:.06em;
}
.loader h2{font-size:var(--t-m); font-weight:700}
.loader-track{height:4px; border-radius:2px; background:var(--steel-3); overflow:hidden; margin:1.1rem 0 1.25rem}
.loader-fill{height:100%; width:0; background:var(--amber); transition:width .4s cubic-bezier(.22,.61,.36,1)}
.steps{display:grid}
.step{display:flex; align-items:center; gap:.7rem; padding:.42rem 0}
.step-mark{width:18px; height:18px; flex:none; display:grid; place-items:center}
.step-label{font-size:var(--t-s); font-weight:600; color:#7C848A}
.step[data-state="done"] .step-label{color:#DDE3E0}
.step[data-state="active"] .step-label{color:#fff}
.step[data-state="locked"] .step-label{color:#6B7578}
.step-tag{
  margin-left:auto; font-size:var(--t-2xs); color:#8A9391;
  border:1px solid var(--steel-3); border-radius:999px; padding:.1rem .55rem; white-space:nowrap;
}
.spin{
  width:14px; height:14px; border-radius:50%;
  border:2px solid var(--steel-3); border-top-color:#7C848A; animation:spin .7s linear infinite;
}
.step[data-state="active"] .spin{border-color:#3E5B57; border-top-color:var(--amber)}
@keyframes spin{to{transform:rotate(360deg)}}
.tick{width:15px; height:15px; fill:none; stroke:#6F9BE0; stroke-width:2.8; stroke-linecap:round; stroke-linejoin:round}
.lock{width:14px; height:14px; fill:none; stroke:#6B7578; stroke-width:1.8}
@media (prefers-reduced-motion:reduce){
  .spin{animation-duration:2s}
  .loader-fill{transition:none}
}

section.page{padding-block:clamp(2.25rem,6vw,4rem)}

section.page h2{font-size:clamp(1.55rem,3.4vw,2.4rem); text-wrap:balance}
.band{background:var(--card); border-block:1px solid var(--rule)}

.read{
  margin-top:.9rem; font-size:clamp(var(--t-m),1.6vw,var(--t-l));
  color:var(--ink-soft); line-height:1.5; text-wrap:pretty;
}
.prose{
  margin-top:1.15rem;
  font-family:"Source Serif 4",Georgia,serif; font-size:1.0625rem; line-height:1.68;
}
.prose p{margin-bottom:1.05rem}
.prose p:last-child{margin-bottom:0}
.prose strong{font-family:Overpass,sans-serif; font-weight:700; font-size:.96em}
.prose a{text-underline-offset:3px}
@media (min-width:900px){
  .prose{columns:2; column-gap:var(--col-gap); column-rule:1px solid var(--rule)}
  .closing .prose{column-rule-color:var(--sign-mid)}
}

.locator{display:grid; gap:clamp(1.25rem,4vw,2.5rem); grid-template-columns:1fr; align-items:center; margin-top:1.75rem}
@media (min-width:820px){.locator{grid-template-columns:1.1fr .9fr}}
.locator svg{width:100%; height:auto; display:block}
.spots{list-style:none; margin:0; padding:0}
.spots li{display:flex; gap:.85rem; padding:.85rem 0; border-top:1px solid var(--rule)}
.spots li:last-child{border-bottom:1px solid var(--rule)}
.spots b{
  flex:none; width:1.6rem; height:1.6rem; border-radius:50%; background:var(--sign); color:#fff;
  font-size:.85rem; font-weight:800; display:grid; place-items:center; margin-top:.1rem;
}
.spots b.plain{background:0; color:var(--ink-soft); border:1px solid var(--rule)}
.spots strong{display:block; font-size:var(--t-m); font-weight:700}
.spots p{margin-top:.15rem; font-size:var(--t-s); color:var(--ink-soft); line-height:1.5}

.howsteps{counter-reset:step; list-style:none; margin:1.75rem 0 0; padding:0}
.howsteps li{position:relative; padding:1.2rem 0 1.2rem 3.4rem; border-top:1px solid var(--rule)}
.howsteps li:last-child{border-bottom:1px solid var(--rule)}
.howsteps li::before{
  counter-increment:step; content:counter(step); position:absolute; left:0; top:1.2rem;
  width:2.2rem; height:2.2rem; border-radius:var(--r-data); background:var(--sign); color:#fff;
  font-weight:900; font-size:var(--t-m); display:grid; place-items:center;
}
.howsteps h3{font-size:var(--t-m); font-weight:700}
.howsteps p{margin-top:.3rem; color:var(--ink-soft); font-size:var(--t-s); line-height:1.5}

.rules{display:grid; gap:1rem; margin-top:1.75rem}
@media (min-width:760px){.rules{grid-template-columns:repeat(auto-fit,minmax(15rem,1fr))}}
.rules > div{background:var(--paper); border-left:4px solid var(--sign); padding:1rem 1.15rem; border-radius:0 var(--r-ui) var(--r-ui) 0}
.band .rules > div{background:var(--paper)}
.rules h3{font-size:var(--t-m); font-weight:800}
.rules p{margin-top:.3rem; font-size:var(--t-s); color:var(--ink-soft); line-height:1.55}

.faq{margin-top:1.75rem}
.faq details{border-top:1px solid var(--rule)}
.faq details:last-of-type{border-bottom:1px solid var(--rule)}
.faq summary{
  list-style:none; cursor:pointer; padding:1rem 2.5rem 1rem 0; position:relative;
  font-weight:700; font-size:var(--t-m); line-height:1.35;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:""; position:absolute; right:.5rem; top:1.4rem; width:11px; height:11px;
  border-right:2.5px solid var(--sign); border-bottom:2.5px solid var(--sign);
  transform:rotate(45deg); transition:transform .18s ease;
}
.faq details[open] summary::after{transform:rotate(-135deg)}
.faq p{
  margin:0 0 1.1rem; color:var(--ink-soft);
  font-family:"Source Serif 4",Georgia,serif; font-size:1.0625rem; line-height:1.65;
}
@media (min-width:900px){
  .faq p{columns:2; column-gap:var(--col-gap)}
}
@media (prefers-reduced-motion:reduce){.faq summary::after{transition:none}}

.note{
  background:var(--card); border-left:4px solid var(--sign); border-radius:0 var(--r-ui) var(--r-ui) 0;
  padding:1rem 1.25rem; margin-top:1.5rem;
}
.band .note{background:var(--paper)}
.note p{font-size:var(--t-s); color:var(--ink-soft); line-height:1.55; margin-bottom:.6rem}
.note p:last-child{margin-bottom:0}

@media (min-width:900px){
  .note:has(p + p){columns:2; column-gap:var(--col-gap)}
}
.note strong{font-weight:700; color:var(--ink)}
.note.alert,.band .note.alert{background:var(--rust-pale); border-left-color:var(--rust)}
.note.alert p,.note.alert strong{color:var(--rust-ink)}

.figures{display:grid; gap:1.25rem 2rem; margin-top:1.75rem; grid-template-columns:1fr}
@media (min-width:640px){.figures{grid-template-columns:1fr 1fr}}
.figures > div{border-top:2px solid var(--ink); padding-top:.75rem}
.figures b{
  display:block; font-weight:900; letter-spacing:-.035em;
  font-size:clamp(2rem,5vw,var(--t-3xl)); color:var(--sign); line-height:1;
}
.figures span{display:block; margin-top:.5rem; font-size:var(--t-s); color:var(--ink-soft); line-height:1.5}

.closing{background:var(--sign-deep)}
.closing h2{color:#fff}
.closing .prose{color:var(--sign-pale)}
.closing .prose strong{color:#fff}
.closing .cta{margin-top:1.6rem}

.sitefoot{
  background:var(--steel); color:#9FA8A5; padding:2.5rem 0;
  border-top:1px solid var(--steel-3);
}
.sitefoot p{max-width:82ch; font-size:var(--t-xs); line-height:1.65}
.sitefoot p + p{margin-top:.7rem}
.sitefoot strong{color:#DDE3E0; font-weight:600}
.sitefoot a{color:#AFBDD8}

.hero-slim{padding:clamp(1.25rem,3.5vw,2rem) 0}
.hero-slim h1{
  color:#fff; font-size:clamp(1.3rem,2.8vw,var(--t-xl));
  font-weight:800; max-width:none;
}
.hero-slim .lede{margin-top:.45rem; font-size:var(--t-s); max-width:58ch}
.hero-slim .vinbox{margin-top:1.1rem; max-width:44rem}
.hero-slim .plate{margin-top:1.1rem}

.searching{
  display:flex; flex-wrap:wrap; align-items:baseline; gap:.3rem .7rem; margin-top:.15rem;
}
.searching b{
  font-family:"Overpass Mono",monospace; font-size:clamp(1.1rem,2.6vw,1.45rem);
  font-weight:700; color:#fff; letter-spacing:.1em; word-break:break-all;
}

.brandbar a.home{
  display:flex; align-items:center; gap:.65rem;
  text-decoration:none; color:inherit;
}

.again{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;
  gap:1rem 1.5rem;
}
.again .lede{margin-top:.35rem}
.again > div{min-width:0}
.again > div:first-child{flex:1 1 20rem}
.herocta{
  flex:0 0 auto; display:flex; flex-direction:column; align-items:flex-start; gap:.4rem;
}
.herocta:empty{display:none}
.herocta .cta{padding:.8rem 1.5rem; font-size:1rem}
.herocta span{font-size:var(--t-2xs); color:var(--sign-pale); max-width:30ch; line-height:1.4}
@media (min-width:760px){
  .herocta{align-items:flex-end}
  .herocta span{text-align:right}
}

.startover{margin-top:clamp(1.5rem,4vw,2.25rem); padding-bottom:clamp(2rem,5vw,3rem)}
.startover a{font-size:var(--t-s); font-weight:600; text-underline-offset:3px}
.results + .startover{margin-top:0}

.retry{margin-top:1.25rem}

/* Info pages: About, Contact, Terms, Privacy */
.doc{padding-block:clamp(2rem,5vw,3.5rem) clamp(2.5rem,6vw,4rem); max-width:820px}
.doc h2{font-size:var(--t-l); font-weight:800; margin:2.2rem 0 .7rem}
.doc h2:first-child{margin-top:0}
.doc p,.doc li{font-family:"Source Serif 4",Georgia,serif; font-size:1.0625rem; line-height:1.68}
.doc p{margin-bottom:1rem}
.doc ul{margin:0 0 1rem; padding-left:1.25rem}
.doc li{margin-bottom:.4rem}
.doc a{text-underline-offset:3px}
.doc .updated{font-family:Overpass,sans-serif; font-size:var(--t-xs); color:var(--ink-soft); margin-bottom:1.75rem}
.doc .callout{
  background:var(--card); border:1px solid var(--rule); border-left:5px solid var(--sign);
  border-radius:var(--r-ui); padding:1rem 1.15rem; margin:0 0 1.5rem;
}
.doc .callout p{margin:0}

.cform{display:grid; gap:1rem; margin-top:1.25rem}
.cform label{display:block; font-size:var(--t-xs); font-weight:700; color:var(--ink-soft); margin-bottom:.3rem}
.cform input,.cform textarea{
  width:100%; font:inherit; font-size:var(--t-m); color:var(--ink);
  background:var(--card); border:1.5px solid var(--rule); border-radius:var(--r-ui); padding:.7rem .85rem;
}
.cform textarea{min-height:10rem; resize:vertical}
.cform input:focus-visible,.cform textarea:focus-visible{outline:2px solid var(--sign); outline-offset:1px; border-color:var(--sign)}
.cform button{
  justify-self:start; font:inherit; font-weight:800; font-size:var(--t-m);
  background:var(--amber); color:var(--amber-ink); border:0; border-radius:var(--r-ui);
  padding:.75rem 1.6rem; cursor:pointer;
}
.cform button:hover{background:var(--amber-hot)}
.cform .hp{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}

.footlinks{margin:1.5rem 0}
.footlinks h2{color:#fff; font-size:var(--t-l); font-weight:800; margin-bottom:.8rem}
.footlinks ul{list-style:none; margin:0; padding:0; display:grid; gap:.65rem}
.footlinks a{color:#fff; font-size:var(--t-m); text-decoration:none}
.footlinks a:hover{text-decoration:underline}

@media (min-width:760px){
  .sitefoot .shell{display:grid; grid-template-columns:minmax(0,1fr) auto; column-gap:clamp(2rem,6vw,5rem)}
  .sitefoot .shell > *{grid-column:1}
  .sitefoot .shell > .footlinks{grid-column:2; grid-row:1 / span 6; margin:0; min-width:11rem}
}