/* The shared look of the public pages: condensed racing headline font, the
   italic brand, orange accent. The home page carries its own full design;
   this file lifts the other pages to match without rewriting them. */
@import url("https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,600;0,800;1,800&display=swap");
:root{--head:"Barlow Condensed",Impact,"Arial Narrow",system-ui,sans-serif}
body{background-color:#0e0f12}
header{background:rgba(14,15,18,.9);backdrop-filter:blur(8px)}
.brand{font-family:var(--head)!important;font-weight:800!important;font-style:italic;font-size:24px!important;letter-spacing:.03em;text-transform:uppercase;line-height:1}
.brand span{color:#f26522}
.brand small{font-family:system-ui,sans-serif;font-style:normal;font-weight:500;font-size:11px;letter-spacing:.14em;color:#9aa3b0}
h1{font-family:var(--head);font-weight:800;font-style:italic;text-transform:uppercase;letter-spacing:.02em;font-size:38px!important;line-height:1}
h1 em,h1 i{color:#f26522;font-style:italic}
.card h2,.step h2,.pms h2,h2.cat{font-family:var(--head);text-transform:uppercase;letter-spacing:.04em;font-size:22px!important;font-weight:800}
button:not(.ghost):not(.bag):not(.x):not(.rm):not(.it-rm),.submit,.cta{font-family:var(--head);text-transform:uppercase;letter-spacing:.06em;font-weight:800;font-size:18px}
.line .q button,.pkg button,.ec-btns button,.chip button,.pms-book,#ec-send,.rq-st{font-size:14px;letter-spacing:.03em}

/* ── photo banner at the top of an inner page ── */
.page-hero{position:relative;margin:-26px calc(50% - 50vw) 26px;padding:58px 20px 54px;overflow:hidden;
  background:#000 var(--img) center 35%/cover no-repeat;clip-path:polygon(0 0,100% 0,100% calc(100% - 26px),0 100%)}
.page-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,11,14,.92) 0%,rgba(10,11,14,.72) 55%,rgba(10,11,14,.35) 100%)}
.page-hero>*{position:relative;max-width:var(--pw,680px);margin-left:auto;margin-right:auto}
.page-hero h1{font-size:clamp(38px,6vw,64px)!important;margin:0 0 8px;color:#fff;
  -webkit-text-stroke:1.5px rgba(0,0,0,.65);paint-order:stroke fill;
  text-shadow:0 0 3px #000,0 0 10px rgba(0,0,0,.9),3px 3px 0 rgba(0,0,0,.7),0 8px 30px rgba(0,0,0,.8)}
.page-hero h1 i{color:#f26522;font-style:italic}
.page-hero .lede{color:#fff;font-size:16px;margin:0;max-width:640px;text-shadow:0 0 3px #000,1px 1px 0 #000,0 2px 12px rgba(0,0,0,.95)}
.page-hero .kicker{font-family:var(--head);font-weight:600;letter-spacing:.22em;font-size:13px;color:#f26522;text-transform:uppercase;margin:0 0 10px;text-shadow:0 0 4px #000,1px 1px 0 #000}
@media (max-width:640px){ .page-hero{padding:40px 16px 40px;clip-path:polygon(0 0,100% 0,100% calc(100% - 14px),0 100%)} }
/* the request / wholesale pages already have a hero block: give it the photo */
.hero.photo{background:linear-gradient(180deg,rgba(14,15,18,.72),rgba(14,15,18,.9)),var(--img) center 40%/cover no-repeat!important}
.hero.photo h1{font-size:clamp(36px,6vw,58px)!important;-webkit-text-stroke:1.5px rgba(0,0,0,.65);paint-order:stroke fill;text-shadow:0 0 3px #000,3px 3px 0 rgba(0,0,0,.7),0 8px 30px rgba(0,0,0,.8)}
.hero.photo p{color:#fff;text-shadow:0 0 3px #000,1px 1px 0 #000}

/* ── brand logos in the header: the two house marks, big enough to read ── */
.brand-logos{display:inline-flex;align-items:center;gap:12px;text-decoration:none;color:inherit;flex-wrap:wrap}
.brand-logos img{height:64px;width:auto;display:block;background:#fff;border-radius:10px;padding:4px 8px;box-shadow:0 2px 10px rgba(0,0,0,.35)}
.brand-logos small{display:block;width:100%;font-family:system-ui,sans-serif;font-size:11px;letter-spacing:.14em;color:#9aa3b0;text-transform:uppercase}
@media (max-width:640px){.brand-logos img{height:48px}.brand-logos{gap:8px}}
/* merch brands strip */
.merch-brands{display:flex;gap:18px;flex-wrap:wrap;align-items:center;justify-content:center;margin:14px 0 4px}
.merch-brands img{height:96px;width:auto;border-radius:12px;background:#fff;padding:6px 10px}
.merch-brands img.dark{background:#000}
@media (max-width:640px){.merch-brands img{height:70px}}

/* footer logos on the inner pages */
.foot-logos{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-bottom:14px}
.foot-logos img{height:90px;width:auto;background:#fff;border-radius:12px;padding:6px 12px}
@media (max-width:640px){.foot-logos img{height:64px}}

.brand-logos a,.hero-logos a,.own-logos a,.foot-logos a{display:inline-flex;line-height:0;text-decoration:none}