/* melbet.et — design tokens
   Brand: Melbet graphite + Melbet yellow, matched to the live platform.
   Two-tier header (graphite top bar, slanted yellow nav bar), uppercase condensed headings,
   light-grey workspace with white panels, yellow is only ever a surface under dark text. */
:root{
  --black:#1B1B1B;          /* top bar, footer */
  --graphite:#2B2B2B;       /* panels, filter bars */
  --graphite-2:#3A3A3A;     /* secondary buttons, tiles */
  --yellow:#FDB813;         /* Melbet yellow */
  --yellow-hover:#FFC83D;
  --yellow-soft:#FFF3D1;
  --ink:#1D1D1D;
  --muted:#5E6066;
  --paper:#E6E6E6;          /* workspace grey */
  --panel:#EFEFEF;          /* row headers, odds-button grey */
  --card:#FFFFFF;
  --line:#D6D6D6;
  --live:#E0312B;
  --on-black-muted:#A9A9A9;
  --display:"Roboto Condensed","Arial Narrow",sans-serif;
  --text:"Roboto",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --wrap:1200px;
  --measure:70ch;
  --r-sm:4px; --r-md:6px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:110px;background:var(--black)}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1rem/1.6 var(--text)}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:3px}
.prose a,.block-intro a,.issue a,.checklist a,td a,.faq-a a,.note a,.journey-sub a{color:var(--ink);text-decoration-color:var(--yellow);text-decoration-thickness:2px}
a:hover{text-decoration-color:var(--ink)}
:focus-visible{outline:3px solid var(--yellow);outline-offset:2px;border-radius:2px}
.skip{position:absolute;left:-999px;top:0;background:var(--yellow);color:var(--ink);padding:.6rem 1rem;z-index:100;font-weight:700}
.skip:focus{left:1rem}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 1rem}
.ic{width:24px;height:24px;flex:none}
h1,h2,h3{font-family:var(--display);font-weight:700;line-height:1.05;margin:0}
h1,h2{text-transform:uppercase;letter-spacing:.01em}
h2{font-size:clamp(1.5rem,1.1rem + 1.6vw,2.1rem)}
h3{font-size:1.25rem;line-height:1.15}
p{margin:0 0 1rem}
.small{font-size:.9rem;color:var(--muted)}

/* ---------- Header: graphite top bar + slanted yellow nav bar ---------- */
.site-header{position:sticky;top:0;z-index:50;background:var(--black);color:#fff;box-shadow:0 2px 6px rgba(0,0,0,.25)}
.header-grid{display:grid;grid-template-columns:auto 1fr;grid-template-rows:44px 46px;padding-left:1.25rem}
.wordmark{grid-row:1/3;align-self:center;display:flex;flex-direction:column;align-items:flex-start;gap:.15rem;text-decoration:none;color:#fff;padding-right:2.5rem}
.wordmark-brand{font:italic 800 2.4rem/1 var(--display);letter-spacing:-.01em;text-transform:uppercase;color:#fff}
.wordmark-market{font:500 .72rem/1 var(--text);letter-spacing:.32em;text-transform:uppercase;color:var(--yellow);padding-left:.2rem}
.wordmark img{height:36px;width:auto}
.header-actions{grid-column:2;grid-row:1;justify-self:center;align-self:center;display:flex;justify-content:center;gap:.6rem}
.header-actions .btn{min-height:34px;padding:.4rem 1.1rem;gap:.45rem;font-size:.92rem;border-radius:999px}
.header-actions .ic{width:18px;height:18px}
.primary-nav{grid-column:2;grid-row:2;background:var(--yellow);clip-path:polygon(28px 0,100% 0,100% 100%,0 100%);padding-left:44px}
.primary-nav ul{display:flex;align-items:stretch;height:100%;gap:0;list-style:none;margin:0;padding:0}
.primary-nav a{display:flex;align-items:center;height:100%;padding:0 1rem;color:var(--ink);text-decoration:none;font:700 .98rem/1 var(--text);text-transform:uppercase;letter-spacing:.01em}
.primary-nav a:hover{background:rgba(0,0,0,.08)}
.primary-nav a[aria-current="true"]{box-shadow:inset 0 -3px 0 var(--ink)}

.btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:.55rem 1.3rem;border-radius:var(--r-sm);font:500 1rem/1 var(--text);text-transform:uppercase;letter-spacing:.02em;text-decoration:none;border:0;white-space:nowrap;transition:background-color .15s}
.btn--primary{background:var(--yellow);color:var(--ink)}
.btn--primary:hover{background:var(--yellow-hover)}
.btn--ghost{background:var(--graphite-2);color:#fff}
.btn--ghost:hover{background:#4A4A4A}
.btn--secondary{background:var(--graphite);color:#fff}
.btn--secondary:hover{background:#3d3d3d}
.btn--outline{background:transparent;color:var(--yellow);box-shadow:inset 0 0 0 2px var(--yellow)}
.btn--outline:hover{background:var(--yellow);color:var(--ink)}

.mobile-nav{display:none}
@media (max-width:980px){
  .header-grid{grid-template-columns:auto 1fr auto;grid-template-rows:56px;column-gap:.75rem;padding:0 1rem;border-bottom:4px solid var(--yellow)}
  .wordmark{grid-row:1;padding-right:0}
  .wordmark-brand{font-size:1.9rem}
  .wordmark-market{font-size:.62rem}
  .primary-nav{display:none}
  .header-actions{grid-column:2;grid-row:1}
  .header-actions .btn{padding:.4rem .95rem;font-size:.86rem}
  .mobile-nav{display:block;grid-column:3;align-self:center}
  .mobile-nav summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:.4rem;padding:.5rem .75rem;background:var(--graphite-2);border-radius:var(--r-sm);font-weight:500;text-transform:uppercase;font-size:.9rem}
  .mobile-nav summary::-webkit-details-marker{display:none}
  .mobile-nav[open] summary{background:var(--yellow);color:var(--ink)}
  .mobile-nav-panel{position:absolute;left:0;right:0;top:100%;background:var(--graphite);max-height:calc(100vh - 60px);overflow:auto;padding:.5rem 1rem 6rem}
  .mobile-nav-panel h2{font:700 .85rem/1 var(--text);letter-spacing:.06em;color:var(--yellow);margin:1.1rem 0 .45rem}
  .mobile-nav-panel ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:2px}
  .mobile-nav-panel a{display:block;padding:.7rem .75rem;color:#fff;text-decoration:none;background:var(--graphite-2)}
  .mobile-nav-panel a:hover{background:#4a4a4a}
}
@media (max-width:640px){
  /* Phones: buttons drop to their own centred row under the logo and menu */
  .header-grid{grid-template-columns:1fr auto;grid-template-rows:56px auto}
  .header-actions{grid-column:1/-1;grid-row:2;justify-self:stretch;padding:0 0 .7rem}
  .header-actions .btn{flex:1 1 0;max-width:190px;min-height:38px}
  .mobile-nav{grid-column:2}
  .mobile-nav-panel{max-height:calc(100vh - 110px)}
}
@media (max-width:360px){.header-actions .btn{padding:.4rem .6rem;font-size:.8rem}.header-actions .ic{display:none}}

/* ---------- Home hero: promo banner + top-events tiles ---------- */
.home-hero{background:var(--paper);padding:.75rem 0 0;overflow:hidden}
.home-hero .wrap:first-child{background:radial-gradient(circle at 85% 30%,rgba(253,184,19,.22),transparent 45%),radial-gradient(circle at 10% 110%,rgba(120,60,200,.35),transparent 50%),#0E0E10;color:#fff;border-radius:var(--r-md);padding-top:2.75rem;padding-bottom:2.75rem;width:calc(100% - 2rem);max-width:calc(var(--wrap) - 2rem)}
.home-hero h1{font-size:clamp(2.4rem,1.6rem + 4.5vw,4.6rem);line-height:.95;max-width:14ch}
.home-hero .hero-lead{font-size:1.1rem;color:#E6E6E6;max-width:46ch;margin:1.1rem 0 1.4rem}
.home-hero .cta-row{margin-bottom:0}
@media (min-width:900px){
  .home-hero .wrap:first-child{padding-left:2.75rem;padding-right:2.75rem}
  .hero-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:3rem;align-items:end}
  .hero-grid .hero-lead{margin-top:0}
}
.home-hero nav.wrap{padding-top:.5rem}
.product-map{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,1fr);gap:4px}
.product-map a{display:flex;flex-direction:column;gap:.5rem;padding:1.1rem 1rem 1.3rem;height:100%;text-decoration:none;color:#fff;background:linear-gradient(110deg,#2E2E2E 0%,#3C3C3C 60%,#2A2A2A 100%);border-radius:var(--r-sm);transition:background-color .15s}
.product-map a:hover{background:var(--yellow);color:var(--ink)}
.product-map a:hover .pm-sub{color:#2a2a2a}
.product-map .ic{width:30px;height:30px;color:var(--yellow)}
.product-map a:hover .ic{color:var(--ink)}
.pm-name{font:700 1.3rem/1 var(--display);text-transform:uppercase}
.pm-sub{font-size:.88rem;line-height:1.35;color:var(--on-black-muted)}
@media (max-width:980px){.product-map{grid-template-columns:repeat(3,1fr)}}
@media (max-width:560px){.product-map{grid-template-columns:1fr 1fr}.pm-sub{display:none}.product-map a{padding:.9rem}}

/* ---------- Inner page header ---------- */
.page-head{background:var(--graphite);color:#fff;padding:1rem 0 0}
.breadcrumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:.25rem .5rem;margin:0 0 1.1rem;padding:0;font-size:.88rem;color:var(--on-black-muted)}
.breadcrumbs li+li::before{content:"›";margin-right:.5rem;color:#777}
.breadcrumbs a{color:var(--on-black-muted);text-decoration:none}
.breadcrumbs a:hover{color:#fff;text-decoration:underline}
.page-head h1{font-size:clamp(2rem,1.4rem + 3vw,3.6rem);line-height:.98;max-width:20ch}
.page-head .lead{max-width:62ch;color:#E2E2E2;font-size:1.08rem;margin:.9rem 0 1.4rem}
.page-head .cta-row{margin-bottom:1.5rem}
.silo-rail{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;margin:0;padding:1rem 0 1.25rem;border-top:1px solid var(--graphite-2)}
.silo-rail li{display:flex}
.silo-rail a{display:inline-flex;align-items:center;gap:.45rem;min-height:40px;padding:.45rem .9rem;border:1px solid #474747;border-radius:var(--r-sm);background:var(--graphite-2);color:#E6E6E6;text-decoration:none;font-weight:500;white-space:nowrap;font-size:.92rem;line-height:1.2;transition:background-color .15s,border-color .15s}
.silo-rail a:hover{color:#fff;background:#474747;border-color:#5a5a5a}
.silo-rail a:focus-visible{outline-offset:1px}
.silo-rail a[aria-current="page"]{background:var(--yellow);border-color:var(--yellow);color:var(--ink);font-weight:700}
.silo-rail .ic{width:18px;height:18px}
@media (max-width:640px){
  .silo-rail{flex-wrap:nowrap;overflow-x:auto;margin:0 -1rem;padding:.9rem 1rem 1rem;scroll-padding-inline:1rem;scroll-snap-type:x proximity;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .silo-rail::-webkit-scrollbar{display:none}
  .silo-rail li{flex:none;scroll-snap-align:start}
  .silo-rail a:focus-visible{outline-offset:-3px}
}

/* ---------- Content blocks ---------- */
main.wrap{padding-top:2rem;padding-bottom:2.5rem}
.block{margin:0 0 2rem;background:var(--card);border-radius:var(--r-md);padding:1.5rem 1.5rem 1.6rem}
.block>h2{margin:-1.5rem -1.5rem 1.25rem;padding:.85rem 1.5rem;background:var(--panel);border-radius:var(--r-md) var(--r-md) 0 0;font-size:clamp(1.25rem,1rem + 1vw,1.6rem);max-width:none;border-bottom:1px solid var(--line)}
.prose,.block-intro{max-width:var(--measure)}
.block-intro{color:var(--muted);margin-bottom:1.25rem}
.prose p:last-child{margin-bottom:0}
.prose ul{padding-left:1.2rem}
.worked-example{background:var(--panel);border-left:4px solid var(--yellow);padding:.9rem 1rem;border-radius:0 var(--r-sm) var(--r-sm) 0}
.cta-row{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.25rem}
.home-hero .cta-row,.page-head .cta-row{margin-top:0}
@media (max-width:560px){.block{padding:1.1rem 1rem 1.25rem}.block>h2{margin:-1.1rem -1rem 1rem;padding:.75rem 1rem}}

/* Silo intro on homepage: yellow left rail marks a top-level entity */
.block--silo{border-left:4px solid var(--yellow)}
.block--silo>h2{border-top-left-radius:0}

/* Steps: only used for real sequences */
.steps{list-style:none;margin:0;padding:0;counter-reset:step;display:grid;gap:.5rem;max-width:860px}
.steps>li{counter-increment:step;display:grid;grid-template-columns:2.5rem 1fr;column-gap:1rem;background:var(--panel);border-radius:var(--r-sm);padding:.9rem 1rem}
.steps>li::before{content:counter(step);grid-row:span 2;width:2.5rem;height:2.5rem;display:grid;place-items:center;background:var(--yellow);color:var(--ink);font:700 1.3rem/1 var(--display);border-radius:var(--r-sm)}
.steps h3{font-size:1.15rem;margin:.2rem 0 .2rem}
.steps p{margin:0;color:var(--muted)}
.steps+.prose{margin-top:1.25rem}

/* Entity cards */
.card-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:.6rem}
.card{display:flex;flex-direction:column;gap:.45rem;height:100%;background:var(--panel);border:1px solid transparent;border-radius:var(--r-sm);padding:1rem 1rem 1.1rem;text-decoration:none;color:var(--ink)}
.card p{margin:0;color:var(--muted);font-size:.95rem;line-height:1.5}
.card-ic{width:40px;height:40px;padding:8px;background:var(--graphite);color:var(--yellow);border-radius:var(--r-sm);margin-bottom:.25rem}
.card--link h3{text-transform:uppercase;font-size:1.15rem}
.card--link:hover{border-color:var(--yellow);background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.08)}
.card--link:hover .card-ic{background:var(--yellow);color:var(--ink)}
.card-grid+.prose{margin-top:1.25rem}

/* Journey: entity relationships drawn as a path */
.journey{list-style:none;margin:0 0 .5rem;padding:0;display:flex;flex-wrap:wrap;gap:0}
.journey-node{position:relative;flex:1 1 150px;display:flex;flex-direction:column;gap:.3rem;padding:1rem 1.25rem 1rem 0;min-width:140px}
.journey-node .ic{width:36px;height:36px;padding:7px;background:var(--yellow);color:var(--ink);border-radius:50%;position:relative;z-index:1}
.journey-node::after{content:"";position:absolute;top:calc(1rem + 17px);left:36px;right:0;height:2px;background:var(--graphite-2)}
.journey-node:last-child::after{display:none}
.journey-label{font:700 1.15rem/1.1 var(--display);text-transform:uppercase}
.journey-label a{text-decoration:underline;text-decoration-color:var(--yellow);text-decoration-thickness:3px}
.journey-sub{font-size:.9rem;color:var(--muted)}
@media (max-width:640px){
  .journey{flex-direction:column}
  .journey-node{flex:none;flex-direction:row;flex-wrap:wrap;align-items:center;align-content:flex-start;column-gap:.75rem;padding:0 0 1.1rem}
  .journey-node .journey-sub{flex-basis:100%;padding-left:calc(36px + .75rem);margin-top:-.2rem}
  .journey-node::after{top:36px;bottom:0;left:17px;right:auto;width:2px;height:auto}
}

/* Tables: league-row style */
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card)}
table{border-collapse:collapse;width:100%;min-width:520px;font-size:.95rem}
caption{text-align:left;padding:.75rem 1rem;color:var(--muted)}
th,td{text-align:left;vertical-align:top;padding:.75rem 1rem;border-bottom:1px solid var(--line)}
thead th{background:var(--graphite);color:#fff;font-weight:500;font-size:.85rem;text-transform:uppercase;letter-spacing:.03em;white-space:nowrap}
tbody th{font-weight:500}
tbody tr:nth-child(even)>*{background:#F7F7F7}
tbody tr:hover>*{background:var(--yellow-soft)}
tbody tr:last-child>*{border-bottom:0}
.table-wrap+.prose,.table-wrap+.small{margin-top:1rem}

/* Payment methods */
.tag{display:inline-block;vertical-align:middle;margin-left:.4rem;padding:.15rem .45rem;border-radius:3px;background:var(--yellow);color:var(--ink);font:500 .7rem/1.2 var(--text);text-transform:uppercase;letter-spacing:.03em;white-space:nowrap}
.tag--muted{background:#DCDCDC;color:var(--muted)}
.tag--promo{background:#1E9E4A;color:#fff;text-decoration:none}
.tag--promo:hover{background:#178a3f}
.chip-group{font-size:1.05rem;text-transform:uppercase;margin:1.25rem 0 .6rem}
.chip-group:first-of-type{margin-top:.5rem}
.pm-yes,.pm-no{display:inline-flex;align-items:center;gap:.35rem;font-weight:500}
.pm-yes::before{content:"";width:.6rem;height:.6rem;border-radius:50%;background:#1E9E4A}
.pm-no{color:var(--muted)}
.pm-no::before{content:"";width:.6rem;height:.6rem;border-radius:50%;background:#C4C4C4}
.method-chips{list-style:none;margin:0 0 1rem;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:4px}
.method-chips li{background:var(--panel);border-radius:var(--r-sm);padding:.55rem .75rem;font-size:.92rem;font-weight:500}
.method-chips .tag{margin-left:.3rem}

/* Entity subsections (h3 per sport / game category) */
.topic-list{display:grid;gap:.6rem}
.topic{background:var(--panel);border-radius:var(--r-sm);padding:1rem 1.1rem 1.1rem;scroll-margin-top:120px}
.topic h3{display:flex;align-items:center;gap:.6rem;font-size:1.25rem;text-transform:uppercase;margin-bottom:.5rem}
.topic h3 .ic{width:32px;height:32px;padding:6px;background:var(--graphite);color:var(--yellow);border-radius:var(--r-sm)}
.topic h3 a{text-decoration:underline;text-decoration-color:var(--yellow);text-decoration-thickness:3px;text-underline-offset:4px}
.topic p{max-width:var(--measure);color:#333}
.topic p:last-child{margin-bottom:0}
.topic .method-chips{margin:.25rem 0 0}
.topic .method-chips li{background:#fff}
@media (min-width:900px){.topic-list--2{grid-template-columns:1fr 1fr}}

/* Screenshots: single figure or gallery of app/site screens */
.shot{margin:1.25rem 0 0;display:flex;flex-direction:column;align-items:center;gap:.7rem;max-width:300px;background:var(--panel);border-radius:var(--r-sm);padding:1.1rem 1rem .9rem}
.shot img{width:auto;max-width:100%;height:auto;max-height:440px;filter:drop-shadow(0 6px 14px rgba(0,0,0,.18))}
.shot--screen img{border-radius:var(--r-md)}
.shot--wide{max-width:760px}
.shot--wide img{width:100%;max-height:none}
.shot figcaption{font-size:.88rem;line-height:1.45;color:var(--muted);text-align:center;max-width:36ch}
.shots{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:.6rem;margin-top:1.25rem}
.shots .shot{margin:0;max-width:none}
.shots--wide{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.shots+.prose,.shot+.prose{margin-top:1.25rem}
.topic .shots{margin-top:.25rem}
.topic .shot{background:#fff}
@media (max-width:640px){
  .shot{max-width:none}
  .shots{display:flex;overflow-x:auto;margin-left:-1rem;margin-right:-1rem;padding:0 1rem .25rem;scroll-padding-inline:1rem;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .shots::-webkit-scrollbar{display:none}
  .shots .shot{flex:0 0 72%;scroll-snap-align:start}
  .shots--wide .shot{flex-basis:88%}
  .shot img{max-height:400px}
}

/* Checklist */
.checklist{list-style:none;margin:0;padding:0;display:grid;gap:.55rem;max-width:var(--measure)}
.checklist li{position:relative;padding-left:2rem}
.checklist li::before{content:"";position:absolute;left:0;top:.2rem;width:1.3rem;height:1.3rem;border-radius:var(--r-sm);background:var(--yellow) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231D1D1D' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/70% no-repeat}
.checklist+.prose{margin-top:1rem}

/* Troubleshooting */
.issues{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:.6rem}
.issue{background:var(--panel);border-top:3px solid var(--live);border-radius:var(--r-sm);padding:1rem 1.1rem}
.issue h3{font-size:1.1rem;margin-bottom:.4rem}
.issue p{margin:0;color:var(--muted)}

/* Notes */
.note{max-width:var(--measure);background:var(--yellow-soft);border-left:4px solid var(--yellow);padding:1rem 1.15rem;border-radius:0 var(--r-sm) var(--r-sm) 0;margin:0 0 2rem}
.note--warn{background:#FDECEA;border-left-color:var(--live)}
.note p{margin:0}

/* FAQ: sidebar-accordion style */
.faq{max-width:none}
.faq details{background:var(--panel);border-radius:var(--r-sm);margin-bottom:3px}
.faq summary{cursor:pointer;list-style:none;padding:.9rem 3rem .9rem 1rem;font-weight:500;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:1.1rem;top:50%;width:.55rem;height:.55rem;border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:translateY(-70%) rotate(45deg);transition:transform .15s}
.faq details[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.faq summary:hover{background:#E4E4E4}
.faq details[open] summary{background:var(--graphite);color:#fff;border-radius:var(--r-sm) var(--r-sm) 0 0}
.faq details[open] summary::after{border-color:var(--yellow)}
.faq-a{padding:1rem;color:var(--muted);background:#fff;border:1px solid var(--panel);border-top:0}
.faq-a p{margin:0}

/* Related entities */
.related{border-top:3px solid var(--yellow)}
.related-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.5rem}
.related-grid a{display:flex;gap:.75rem;align-items:flex-start;padding:.85rem 1rem;background:var(--panel);border:1px solid transparent;border-radius:var(--r-sm);text-decoration:none}
.related-grid a:hover{border-color:var(--yellow);background:#fff}
.related-grid .ic{color:var(--ink);margin-top:2px}
.related-grid strong{display:block;font:700 1.1rem/1.1 var(--display);text-transform:uppercase}
.related-grid span{font-size:.88rem;color:var(--muted)}

/* ---------- Footer ---------- */
.site-footer{background:var(--black);color:var(--on-black-muted);padding:2.75rem 0 2rem;font-size:.92rem;border-top:4px solid var(--yellow)}
.footer-map{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:1.75rem 1.25rem;margin-bottom:2.5rem}
.footer-map h2{font:700 1rem/1 var(--text);letter-spacing:.04em;color:#fff;margin-bottom:.8rem}
.footer-map ul{list-style:none;margin:0;padding:0;display:grid;gap:.4rem}
.footer-map a{color:var(--on-black-muted);text-decoration:none}
.footer-map a:hover{color:var(--yellow)}
.footer-legal{background:var(--graphite);border-radius:var(--r-sm);padding:1rem 1.1rem;font-size:.8rem;line-height:1.5;color:#C9C9C9;margin-bottom:6px}
.footer-legal p{margin:0 0 .5rem}
.footer-legal p:last-child{margin:0}
.footer-legal a,.fb-copy a{color:#fff;text-decoration:underline}
.fb-cell{background:var(--graphite);border-radius:var(--r-sm);padding:.9rem 1rem;color:#C9C9C9;text-decoration:none}
a.fb-cell:hover{background:#333}
.fb-center{display:flex;align-items:center;justify-content:center;min-height:80px}
.footer-badges{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:6px}
.age-badge{display:inline-grid;place-items:center;min-width:2.6rem;height:2.6rem;padding:0 .4rem;border:2px solid var(--yellow);color:var(--yellow);border-radius:50%;font:700 1.05rem/1 var(--display)}
.age-badge--lg{width:56px;height:56px;border:5px solid #E0312B;background:#fff;color:#111;font-size:1.35rem;letter-spacing:-.03em}
.bga{flex-direction:column;align-items:center;gap:0;color:#9A9A9A;font:700 1.55rem/1 var(--text);letter-spacing:-.01em}
.bga sup{font-size:.5em}
.bga small{font-weight:400;font-size:.75em}
.bga:hover{color:#fff}
.fb-rg{gap:.6rem;font:700 1rem/1 var(--text);text-transform:uppercase;letter-spacing:.03em;color:#fff}
.fb-rg .ic{color:var(--yellow)}
.footer-bottom{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1fr);gap:6px;margin-bottom:6px}
.fb-copy{font-size:.8rem;line-height:1.5}
.fb-copy p{margin:0 0 .35rem}
.fb-copy p:last-child{margin:0}
.fb-support{display:flex;align-items:center;justify-content:center;gap:.9rem}
.fb-support-ic{width:44px;height:44px;color:#fff;stroke-width:1.5}
.fb-label{display:block;font:700 .9rem/1.2 var(--text);text-transform:uppercase;color:#fff}
.fb-phone{display:block;font-size:1.2rem;color:#C9C9C9;margin-top:.2rem}
.fb-side{display:grid;gap:6px;grid-template-rows:1fr auto}
.fb-row{display:grid;grid-template-columns:1fr auto;gap:6px}
.fb-social{display:flex;align-items:center;justify-content:center;gap:.6rem}
.social-btn{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#E6E6E6;color:var(--graphite)}
.social-btn .ic{width:20px;height:20px}
.social-btn:hover{background:var(--yellow)}
.fb-age{display:grid;place-items:center;font:500 1.25rem/1 var(--text);color:#fff}
.fb-mobile{display:block;text-align:center;font-weight:500;text-transform:uppercase;color:#fff;padding:.6rem 1rem}
.footer-pay{list-style:none;margin:0;padding:.6rem .5rem;display:flex;flex-wrap:wrap;justify-content:center;gap:.4rem;background:#222;border-radius:var(--r-sm)}
.footer-pay a{display:block;padding:.4rem .8rem;border-radius:999px;background:var(--graphite-2);color:#E6E6E6;font-weight:700;font-size:.85rem;text-decoration:none}
.footer-pay a:hover{background:var(--yellow);color:var(--ink)}
@media (max-width:900px){
  .footer-bottom{grid-template-columns:1fr}
  .footer-badges .fb-center{min-height:64px}
}
@media (max-width:560px){
  .footer-badges{grid-template-columns:1fr 1fr}
  .footer-badges .fb-rg{grid-column:span 2}
}

/* ---------- Sticky mobile actions ---------- */
.mobile-actions{display:none}
@media (max-width:980px){
  .mobile-actions{display:flex;justify-content:center;gap:.5rem;position:fixed;left:0;right:0;bottom:0;z-index:40;padding:.6rem .75rem calc(.6rem + env(safe-area-inset-bottom));background:var(--black);border-top:1px solid #333}
  body{padding-bottom:72px}
}

@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
@media print{.site-header,.mobile-actions,.site-footer,.silo-rail{display:none}body{background:#fff}}