/* AU test site: USA game-day proportions + AU brand accents; cache v44 */
@import url("../assets/css/game-day-au.css");

:root{
  /* Keep USA dark shell for proportion; brand navy as primary accent */
  --ticker-bg:#FFC72C;
  --ticker-fg:#002b66;
  --brand:#002b66;
  --brand-mid:#003a85;
  --sky:#5eb8ff;
  --mint:#7dffb3;
}
/* Brand accent swaps (where USA uses electric/blue) */
.eyebrow{color:var(--sky)!important}
.story-collage-copy .eyebrow{color:var(--mint)!important}
.nav a.active{color:var(--sky)!important}
.btn-navy,.btn-primary,
a.btn-navy,a.btn-primary,
.btn.btn-navy,.btn.btn-primary,
a.btn.btn-navy,a.btn.btn-primary{
  background:var(--brand)!important;
  color:#fff!important;
  box-shadow:0 10px 30px rgba(0,43,102,.35)!important;
}
.btn-navy:hover,.btn-primary:hover,
a.btn-navy:hover,a.btn-primary:hover,
.btn.btn-navy:hover,.btn.btn-primary:hover,
a.btn.btn-navy:hover,a.btn.btn-primary:hover,
.btn-navy:focus,.btn-primary:focus,
a.btn-navy:focus,a.btn-primary:focus,
.btn.btn-navy:focus,.btn.btn-primary:focus,
a.btn.btn-navy:focus,a.btn.btn-primary:focus,
.btn-navy:focus-visible,.btn-primary:focus-visible,
a.btn-navy:focus-visible,a.btn-primary:focus-visible{
  background:var(--brand-mid)!important;
  color:#fff!important;
}
a{color:var(--sky)}
a:hover{color:#fff}
.marquee{background:var(--brand)!important}
.product-card .price,.price-lg{color:var(--sky)!important}
.section-cream .eyebrow{color:var(--brand)!important}
.section-cream .btn-primary,
.section-cream .btn-navy,
.section-cream a.btn-primary,
.section-cream a.btn-navy,
.section-cream a.btn.btn-primary,
.section-cream a.btn.btn-navy{
  background:var(--brand)!important;
  color:#fff!important;
}
.section-cream .btn-primary:hover,
.section-cream .btn-navy:hover,
.section-cream a.btn-primary:hover,
.section-cream a.btn-navy:hover,
.section-cream .btn-primary:focus,
.section-cream .btn-navy:focus{
  background:var(--brand-mid)!important;
  color:#fff!important;
}


/* TEST chrome */
.test-banner{background:#ffd200;color:#111;text-align:center;padding:.55rem 1rem;font-weight:800;font-size:.88rem;letter-spacing:.02em;position:sticky;top:0;z-index:80}
.test-banner a{color:#002b66;text-decoration:underline}
.announcement{background:#001a3d;color:#fff;font-size:.85rem;text-align:center;padding:.45rem 1rem;border-bottom:1px solid rgba(255,255,255,.1)}

/* Hero placeholder (replaces video) matching USA hero proportions */
.hero-video.hero-placeholder-au{
  min-height:min(72vh,640px);
  display:grid;align-items:stretch;justify-items:stretch;
  background:#000;
}
.hero-placeholder-au .hero-frame{
  position:relative;z-index:2;
  width:100%;
  height:100%;
  min-height:min(72vh,640px);
  border:0;
  border-radius:0;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:.6rem;text-align:center;padding:2rem;color:#fff;
  background:rgba(255,255,255,.03);
  box-shadow:inset 0 0 0 3px dashed rgba(255,255,255,.28);
}
.hero-placeholder-au .hero-frame strong{
  font-family:var(--display);font-size:clamp(1.8rem,5vw,3.2rem);letter-spacing:.04em;font-weight:400;text-transform:uppercase;
}
.hero-placeholder-au .hero-frame span{color:rgba(255,255,255,.75);max-width:34rem;font-size:1rem}
.hero-placeholder-au .ph-label{
  position:absolute;top:1rem;left:1rem;z-index:3;
  background:#ffd200;color:#111;font-weight:800;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;
  padding:.35rem .7rem;border-radius:999px;
}

/* Find Your Colours + licence logos */
.fyc-block{text-align:center;padding:3.4rem 0 2.2rem}
.fyc-block h2{margin:0 0 .25rem}
.fyc-block .lead{margin:0 auto 1.2rem}
.fyc-search{display:flex;gap:.5rem;max-width:420px;margin:0 auto}
.fyc-search input{
  flex:1;border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:.85rem 1.1rem;
  font-size:1rem;background:rgba(0,0,0,.25);color:#fff;
}
.fyc-search button{
  border:0;background:var(--brand);color:#fff;border-radius:999px;padding:.85rem 1.2rem;
  font-weight:800;cursor:pointer;font-family:var(--condensed);text-transform:uppercase;letter-spacing:.04em;
}

/* Party packs: never crop */
.product-card .thumb img[src*="party-pack"],
.pdp-media img[src*="party-pack"],
.party-card .thumb img{
  object-fit:contain!important;max-height:none;width:100%;height:100%;
}
.party-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.1rem;margin-top:1.2rem}
.party-card{background:linear-gradient(180deg,#151f3d,#0d1430);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.party-card .thumb{aspect-ratio:1;background:radial-gradient(circle at 50% 40%,#243056,#0b1022 70%);display:grid;place-items:center;padding:1rem}
.party-card .thumb img{width:100%;height:100%;object-fit:contain}
.party-card .body{padding:1rem 1rem 1.2rem}
.party-card h3{margin:0 0 .35rem;font-family:var(--condensed);font-size:1.1rem}
.party-card .price{font-family:var(--display);font-size:1.7rem;color:var(--sky)}


/* Navy savings band (compact) */
.savings-navy{
  position:relative;border-radius:var(--radius);overflow:hidden;color:#fff;
  border:1px solid rgba(255,255,255,.14);box-shadow:var(--shadow);background:#002b66;
}
.savings-navy .fans{
  position:relative;min-height:120px;
  background:#001a3d center 30%/cover no-repeat;
}
.savings-navy .fans::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(to bottom,rgba(0,43,102,.25) 0%,rgba(0,43,102,.7) 55%,#002b66 100%);
}
.savings-navy .fans-inner{position:relative;z-index:1;padding:1.25rem 1.1rem .7rem;text-align:center}
.savings-navy h2{
  margin:0;font-family:var(--display);font-size:clamp(1.55rem,3.6vw,2.4rem);
  letter-spacing:.04em;font-weight:400;font-style:italic;line-height:.95;color:#fff;text-transform:uppercase;
}
.savings-navy h2 .sky{color:var(--sky)}
.savings-navy .sub{margin:.35rem auto 0;max-width:34rem;color:rgba(255,255,255,.92);font-size:.92rem;line-height:1.35}
.savings-navy .band{background:#002b66;padding:.75rem 1rem 1rem}
.savings-navy .tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.55rem;margin:0 0 .8rem}
.savings-navy .tile{
  border:1.5px solid rgba(126,200,255,.55);border-radius:9px;padding:.55rem .35rem;text-align:center;
}
.savings-navy .qty{font-family:var(--display);font-size:1.35rem;line-height:1}
.savings-navy .pct{font-weight:800;margin-top:.2rem;color:var(--sky);font-size:.9rem}
.savings-navy .lbl{font-size:.68rem;opacity:.9;margin-top:.1rem}
.savings-navy .cta-wrap{text-align:center}
.savings-navy .btn-pill{
  display:inline-flex;align-items:center;background:#fff;color:#111!important;
  padding:.5rem 1rem;border-radius:999px;font-weight:800;font-size:.8rem;
  font-family:var(--condensed);text-transform:uppercase;letter-spacing:.04em;
}
.savings-navy .btn-pill:hover{background:var(--sky);color:#001a3d!important}
@media(max-width:720px){
  .savings-navy .fans{min-height:72px}
  .savings-navy .fans-inner{padding:.85rem .7rem .45rem}
  .savings-navy h2{font-size:clamp(1.25rem,6.5vw,1.7rem)}
  .savings-navy .sub{font-size:.78rem;margin-top:.25rem;max-width:28rem;line-height:1.3}
  .savings-navy .band{padding:.55rem .55rem .7rem}
  .savings-navy .tiles{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:.28rem!important;
    margin:0 0 .55rem;
  }
  .savings-navy .tile{padding:.35rem .15rem;border-radius:7px;border-width:1px}
  .savings-navy .qty{font-size:1.05rem}
  .savings-navy .pct{font-size:.68rem;margin-top:.12rem}
  .savings-navy .lbl{font-size:.52rem;margin-top:.05rem}
  .savings-navy .btn-pill{padding:.4rem .75rem;font-size:.7rem}
}
/* Collage aspect for AU 4-panel */
.story-collage .collage-frame img.au-fans{
  aspect-ratio:2089/753;
  object-fit:cover;
}

/* Content prose on dark */
.prose{max-width:760px;margin:0 auto;line-height:1.65;color:var(--muted)}
.prose h2,.prose h3{color:#fff}
.prose a{color:var(--sky)}
.prose img{max-width:100%;border-radius:12px;margin:1rem 0}
.demo-note{background:rgba(255,180,0,.15);border:1px solid rgba(255,180,0,.35);border-radius:12px;padding:1rem 1.1rem;margin:1rem 0;color:#ffd89a}
.blog-list{display:grid;gap:1.1rem}
.blog-item{display:grid;grid-template-columns:180px 1fr;gap:1rem;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:rgba(255,255,255,.04);color:#fff}
.blog-item .thumb{aspect-ratio:1;background:#0b1022}
.blog-item .thumb img{width:100%;height:100%;object-fit:cover}
.blog-item .body{padding:1rem 1rem 1rem 0}
.blog-item h2{margin:0 0 .4rem;font-size:1.35rem}
.blog-item .date{font-size:.82rem;color:var(--muted)}
@media(max-width:700px){
  .blog-item{grid-template-columns:1fr}
  .blog-item .body{padding:0 1rem 1rem}
  .party-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:520px){
}

@media(max-width:720px){.site-header .nav.open{display:flex!important;flex-direction:column;align-items:flex-start;width:100%;padding:.5rem 0 0}}

.party-card .thumb{aspect-ratio:1;padding:1.25rem}
.party-grid{max-width:900px}
@media(min-width:901px){
  .party-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.1rem}
}
/* Match USA section padding rhythm after collage */
.story-collage + .section-dark.fyc-block{padding-top:1.4rem}
.fyc-block{padding-top:1.4rem;padding-bottom:2.6rem}

/* Live hero image (Graeme) */
.hero-video.hero-image .hero-poster{
  object-fit:cover;
  object-position:center 28%;
}
@media(max-width:720px){
  .hero-video.hero-image .hero-poster{
    object-position:center 22%;
  }
  .hero-content h1{max-width:12ch}
  .hero-content{padding:3.2rem 0 2.2rem}
}
.hero-overlay{
  background:
    linear-gradient(180deg,rgba(5,7,13,.28) 0%,rgba(5,7,13,.22) 40%,rgba(5,7,13,.78) 78%,rgba(5,7,13,.95) 100%),
    linear-gradient(90deg,rgba(0,26,61,.72) 0%,rgba(0,43,102,.25) 55%,rgba(0,0,0,.15) 100%) !important;
}

/* ticker vars */
.marquee{background:var(--ticker-bg)!important;color:var(--ticker-fg)!important}
.marquee-track{color:var(--ticker-fg)!important}

/* 10: licence logos one row on phone */
@media(max-width:720px){
}


/* 12: wide hero - image shapes the band; text overlays with gradient for readability */
.hero-video.hero-wide{
  position:relative!important;
  min-height:0!important;
  aspect-ratio:2048/768;
  max-height:none;
  display:grid!important;
  align-items:end!important;
  overflow:hidden;
  background:#000;
}
.hero-video.hero-wide picture,
.hero-video.hero-wide .hero-poster{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  display:block!important;
}
.hero-video.hero-wide .hero-poster{
  object-fit:cover!important;
  object-position:center center!important;
  aspect-ratio:auto!important;
}
.hero-video.hero-wide .hero-overlay{
  display:block!important;
  position:absolute!important;
  inset:0!important;
  z-index:1;
  background:linear-gradient(to top,rgba(5,15,40,.88) 0%,rgba(5,15,40,.35) 38%,transparent 62%)!important;
}
.hero-video.hero-wide .hero-content{
  position:relative!important;
  z-index:2;
  padding:2.2rem 0 1.8rem!important;
}
.hero-video.hero-wide .hero-content .eyebrow,
.hero-video.hero-wide .hero-content .lead{
  display:block!important;
}
.hero-video.hero-wide .hero-content h1{
  position:static!important;
  width:auto!important;
  height:auto!important;
  overflow:visible!important;
  clip:auto!important;
  max-width:14ch;
  font-size:clamp(2.4rem,6vw,4.6rem);
  color:#fff;
}
@media(max-width:720px){
  .hero-video.hero-wide{
    aspect-ratio:auto;
    min-height:min(68vh,520px)!important;
  }
  .hero-video.hero-wide .hero-poster{object-position:center 28%!important}
  .hero-video.hero-wide .hero-content{padding:2rem 0 1.4rem!important}
  .hero-video.hero-wide .hero-content h1{font-size:clamp(2rem,9vw,2.8rem);max-width:100%}
  .hero-video.hero-wide .hero-content .lead{font-size:.95rem;max-width:28rem}
}

/* 14: Aussie gold ticker */
.marquee{
  background:var(--ticker-bg)!important;
  color:var(--ticker-fg)!important;
  border-top:1px solid rgba(0,43,102,.18)!important;
  border-bottom:1px solid rgba(0,43,102,.18)!important;
}
.marquee-track,.marquee-track span{color:var(--ticker-fg)!important}
.marquee-track span::after{color:var(--ticker-fg)!important;opacity:.85}

/* brands wall no white box */
.brands-band .brands-wall img{width:100%;height:auto;min-height:80px;object-fit:contain;opacity:1!important;visibility:visible!important}


/* Hero photo only — full uncropped image at every width */
.hero-video.hero-wide.hero-photo-only{
  position:relative!important;
  display:block!important;
  width:100%!important;
  min-height:0!important;
  height:auto!important;
  max-height:none!important;
  aspect-ratio:auto!important;
  overflow:visible!important;
  background:#000!important;
  align-items:unset!important;
  padding:0!important;
  margin:0!important;
}
.hero-video.hero-wide.hero-photo-only .hero-link{
  display:block!important;
  position:static!important;
  inset:auto!important;
  width:100%!important;
  height:auto!important;
  line-height:0;
}
.hero-video.hero-wide.hero-photo-only picture,
.hero-video.hero-wide.hero-photo-only .hero-poster{
  position:static!important;
  inset:auto!important;
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  height:auto!important;
  min-height:0!important;
  aspect-ratio:auto!important;
  object-fit:contain!important;
  object-position:center center!important;
  background:#000;
}
.hero-video.hero-wide.hero-photo-only .hero-overlay,
.hero-video.hero-wide.hero-photo-only .hero-content{display:none!important}
/* Override USA base absolute/cover hero rules */
.hero-video.hero-photo-only,
main > section.hero-video.hero-photo-only{
  min-height:0!important;
  height:auto!important;
  display:block!important;
}
.hero-video.hero-photo-only .hero-poster,
.hero-image.hero-photo-only .hero-poster{
  position:static!important;
  inset:auto!important;
  width:100%!important;
  height:auto!important;
  object-fit:contain!important;
  aspect-ratio:auto!important;
}
@media(max-width:720px){
  .hero-video.hero-wide.hero-photo-only,
  .hero-video.hero-wide.hero-photo-only .hero-poster{
    min-height:0!important;
    aspect-ratio:auto!important;
    object-fit:contain!important;
  }
}

/* 5-panel fans strip — always one row (desktop/tablet/phone) */
.story-collage .fans-5panel{background:#fff}
.story-collage .fans-panel-grid{
  display:grid!important;
  grid-template-columns:repeat(5, minmax(0, 1fr))!important;
  gap:8px;
  background:#fff;
  width:100%;
}
.story-collage .fans-panel-grid img{
  width:100% !important;
  max-width:100% !important;
  height:auto !important;
  min-width:0 !important;
  aspect-ratio:640 / 1000 !important;
  object-fit:cover !important;
  object-position:center center !important;
  display:block !important;
  grid-column:auto !important;
  grid-row:auto !important;
}
@media (max-width:720px){
  .story-collage .fans-panel-grid{
    grid-template-columns:repeat(5, minmax(0, 1fr))!important;
    gap:4px!important;
  }
  .story-collage .fans-panel-grid img,
  .story-collage .fans-panel-grid img:nth-child(1),
  .story-collage .fans-panel-grid img:nth-child(2),
  .story-collage .fans-panel-grid img:nth-child(3),
  .story-collage .fans-panel-grid img:nth-child(4),
  .story-collage .fans-panel-grid img:nth-child(5){
    grid-column:auto !important;
    grid-row:auto !important;
  }
}
/* Licence logo row — A4 portrait tiles (6) */
.licence-row{
  display:flex;
  flex-wrap:nowrap;
  justify-content:center;
  align-items:stretch;
  gap:0.65rem;
  margin:1.35rem auto 0;
  max-width:760px;
  width:100%;
  padding:0 0.5rem;
}
.licence-row a{
  flex:0 0 auto;
  width:100px;
  max-width:110px;
  aspect-ratio:1 / 1.414;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0.55rem 0.4rem;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(0,0,0,.28);
  box-sizing:border-box;
  text-decoration:none;
  min-width:0;
  overflow:hidden;
}
.licence-row a:hover{border-color:rgba(255,255,255,.38);background:rgba(0,0,0,.4)}
.licence-row img{
  width:88%;
  height:88%;
  max-width:100%;
  max-height:100%;
  object-fit:contain;
  object-position:center;
  display:block;
  filter:none;
}
/* RWC portrait tile fills the A4 box */
.licence-row a.licence-cover{
  padding:0;
}
.licence-row a.licence-cover img{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:12px;
}
@media(max-width:720px){
  .licence-row{
    gap:0.28rem;
    margin-top:1rem;
    padding:0 0.2rem;
    max-width:100%;
  }
  .licence-row a{
    flex:1 1 0;
    width:auto;
    max-width:none;
    min-width:0;
    aspect-ratio:1 / 1.414;
    padding:0.28rem 0.18rem;
    border-radius:9px;
  }
  .licence-row img{width:90%;height:90%}
  .licence-row a.licence-cover{padding:0}
  .licence-row a.licence-cover img{border-radius:9px}
}

/* Brands wall — full content width, no white box */
.brands-band{background:var(--cream)!important;color:var(--ink);padding:1.6rem 0 1.2rem!important}
.brands-band .container{max-width:1100px}
.brands-band .eyebrow{color:var(--brand)!important;margin:0 0 .35rem;text-align:center}

.brands-band .brands-wall{
  margin:0 auto;
  max-width:100%;
  width:100%;
  background:transparent!important;
  border:none!important;
  border-radius:0!important;
  padding:0!important;
  box-shadow:none!important;
}
.brands-band .brands-wall img{
  width:100%!important;
  height:auto!important;
  max-width:100%;
  display:block;
  margin:0 auto;
  object-fit:contain;
}
@media(max-width:720px){
  .brands-band{padding:1.1rem 0 .85rem!important}
  
  .brands-band .eyebrow{margin-bottom:.2rem}
}


/* AU home logo cards — compact Pick your colors */
.fyc-block{
  text-align:center;
  padding:1rem 0 0.85rem !important;
}
.fyc-block h2{margin:0 0 .25rem}
.fyc-block .lead{margin:0 auto .55rem !important; max-width:34rem; font-size:.9rem}
.fyc-search{margin:0 auto .7rem}
.home-shop-grid--logos{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:0.28rem; /* ~half of prior 0.55rem */
  text-align:left;
  margin:0 auto;
  max-width:1000px;
  width:100%;
}
.home-shop-tile--logo{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  text-decoration:none;
  color:#fff;
  background:#001a3d;
  border:1px solid rgba(255,255,255,.14);
  border-radius:10px;
  overflow:hidden;
  transition:transform .18s, box-shadow .18s;
  min-width:0;
  width:100%;
  max-width:none;          /* fill cell so gap: is the visual gap */
  justify-self:stretch;
}
.home-shop-tile--logo:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 24px rgba(0,0,0,.32);
  color:#fff;
}
.home-shop-mark{
  aspect-ratio:auto;
  height:150px; /* room for ~35% larger logos */
  background:#fbf8f4;
  display:grid;
  place-items:center;
  padding:0.28rem; /* less pad so logo fills */
  box-sizing:border-box;
}
.home-shop-mark img{
  width:92%;
  height:92%;
  max-width:135px; /* ~35% over prior 100px */
  max-height:135px;
  object-fit:contain;
  display:block;
}
.home-shop-tile--logo .home-shop-body{
  padding:0.4rem 0.45rem 0.48rem;
  display:flex;
  flex-direction:column;
  gap:0.08rem;
  background:#002b66;
}
.home-shop-tile--logo .home-shop-body h3{
  margin:0;
  font-family:var(--condensed), system-ui, sans-serif;
  font-size:0.68rem;
  letter-spacing:.03em;
  line-height:1.1;
  text-transform:uppercase;
  color:#fff;
}
.home-shop-tile--logo .home-shop-label{
  margin:0;
  font-size:.52rem;
  color:rgba(255,255,255,.72);
  letter-spacing:.04em;
  text-transform:uppercase;
  line-height:1.15;
}
@media (max-width:720px){
  .fyc-block{/* padding set by v27b equal gaps */}
  .fyc-block h2{margin:0 0 .25rem}
  .fyc-block .lead{margin-bottom:.4rem !important; font-size:.82rem}
  .fyc-search{margin-bottom:.55rem}
  .home-shop-grid--logos{
    grid-template-columns:repeat(6,minmax(0,1fr)) !important; /* ONE row of 6 */
    gap:0.2rem !important; /* ~half of prior 0.4rem */
    max-width:100%;
  }
  .home-shop-tile--logo{
    max-width:none;
    border-radius:8px;
  }
  .home-shop-mark{
    height:92px !important; /* taller for larger logos */
    padding:0.18rem !important;
  }
  .home-shop-mark img{
    width:94% !important;
    height:94% !important;
    max-width:86px !important; /* ~35% over prior 64px */
    max-height:86px !important;
  }
  .home-shop-tile--logo .home-shop-body{padding:0.28rem 0.25rem 0.32rem !important}
  .home-shop-tile--logo .home-shop-body h3{font-size:.5rem !important; letter-spacing:.02em}
  .home-shop-tile--logo .home-shop-label{font-size:.4rem !important}
}
/* Tighten vertical gaps between home sections */
.story-collage{padding:2.2rem 0 0.85rem !important}
.story-collage + .section-dark,
.story-collage + .section-dark.fyc-block{padding-top:0.85rem !important}
.fyc-block + .section-dark{/* v27 equal gaps handled below */}
main > section.section-dark{padding-top:1.5rem; padding-bottom:1.6rem}
main > section.section-cream{padding-top:1.6rem; padding-bottom:1.5rem}
.savings-navy{margin:0.6rem 0 !important}
.brands-band{padding:1.2rem 0 0.9rem !important}
@media(max-width:720px){
  .story-collage{padding:1.4rem 0 0.6rem !important}
  .story-collage + .section-dark.fyc-block,
  .fyc-block{/* v28: padding from equal-gap rules */}
  .fyc-block + .section-dark{/* v27 equal gaps */}
  .fyc-block .lead{margin-bottom:.55rem !important; font-size:.9rem}
  .fyc-search{margin-bottom:.65rem}
  main > section.section-dark{padding-top:1.1rem; padding-bottom:1.15rem}
  .brands-band{padding:0.9rem 0 0.7rem !important}
}

/* Readable white text on every navy filled button */
.btn-primary,.btn-navy,
a.btn-primary,a.btn-navy,
button.btn-primary,button.btn-navy,
.section-cream .btn-primary,
.section-cream .btn-navy,
.section-cream a.btn-primary,
.section-cream a.btn-navy,
.story-collage .btn-navy,
.story-collage a.btn-navy,
.nav a.btn.btn-primary,
header .btn-primary,
footer .btn-primary,
footer .btn-navy{
  color:#fff !important;
}
.btn-primary:hover,.btn-navy:hover,
.btn-primary:focus,.btn-navy:focus,
.btn-primary:focus-visible,.btn-navy:focus-visible,
a.btn-primary:hover,a.btn-navy:hover,
a.btn-primary:focus,a.btn-navy:focus,
.section-cream a.btn-primary:hover,
.section-cream a.btn-navy:hover,
.section-cream a.btn-primary:focus,
.section-cream a.btn-navy:focus,
.nav a.btn.btn-primary:hover,
.nav a.btn.btn-primary:focus{
  color:#fff !important;
}
/* Any link that is a filled navy/brand button-looking control */
a.btn[class*="btn-primary"],
a.btn[class*="btn-navy"]{
  color:#fff !important;
}

/* Section h2 size lock (match Brands heading) */
html body main h2,
html body main section h2,
html body .story-collage-copy h2,
html body .fyc-block h2,
html body .brands-band h2,
html body .savings-navy h2,
html body .section-cream h2,
html body .section-dark h2,
html body .prose h2{
  font-size: clamp(1.35rem, 3.2vw, 2.1rem) !important;
  line-height: 1.05 !important;
}
@media (max-width:720px){
  html body main h2,
  html body main section h2,
  html body .story-collage-copy h2,
  html body .fyc-block h2,
  html body .brands-band h2,
  html body .savings-navy h2,
  html body .section-cream h2,
  html body .section-dark h2,
  html body .prose h2{
    font-size: 1.35rem !important;
    line-height: 1.05 !important;
  }
}

/* FINAL: Ready/Brands/all section h2 identical */
html body main section.section-cream.angled h2,
html body main section.brands-band h2,
html body main section h2,
html body main h2{
  font-size: clamp(1.35rem, 3.2vw, 2.1rem) !important;
  line-height: 1.05 !important;
}
@media (max-width: 768px){
  html body main section.section-cream.angled h2,
  html body main section.brands-band h2,
  html body main section h2,
  html body main h2{
    font-size: 1.35rem !important;
    line-height: 1.05 !important;
  }
}

/* Brands heading + Partners eyebrow centred */
.brands-band .container{
  text-align:center !important;
}
.brands-band .eyebrow,
.brands-band h2{
  text-align:center !important;
  margin-left:auto !important;
  margin-right:auto !important;
  display:block !important;
  width:100% !important;
  max-width:100% !important;
}
.brands-band .eyebrow{
  color:var(--brand)!important;
  margin-top:0;
  margin-bottom:.35rem;
}
.brands-band h2{
  color:var(--ink)!important;
  margin-top:0;
  margin-bottom:.85rem;
}

/* Story copy card — match Party Packs card chrome */
.story-collage-copy{
  width:100%;
  max-width:920px;
  margin:0 auto;
  box-sizing:border-box;
  text-align:center;
  background:linear-gradient(180deg,#151f3d,#0d1430);
  border:1px solid rgba(255,255,255,.14);
  border-radius:var(--radius,16px);
  box-shadow:0 18px 50px rgba(0,0,0,.35);
  padding:1.6rem 1.4rem 1.5rem;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.story-collage-copy .eyebrow{margin-bottom:.45rem}
.story-collage-copy h2{margin:0 0 .7rem}
.story-collage-copy p{margin:0 auto .55rem; max-width:40rem}
.story-collage-copy .story-collage-cta{margin:.95rem 0 0 !important}


@media (max-width:720px){
  .story-collage-copy{
    padding:1.15rem 1rem 1.2rem;
    border-radius:14px;
  }
  .story-collage{padding-bottom:0.75rem !important}
  .story-collage + .section-dark.fyc-block,
  .story-collage + .fyc-block{
    padding-top:0.75rem !important;
  }
}

/* Story card → Find Your Colours gap (~35% tighter than prior) */
.story-collage{padding-bottom:0.85rem !important}
.story-collage + .section-dark.fyc-block,
.story-collage + .fyc-block{padding-top:0.85rem !important; margin-top:0 !important}
@media (max-width:720px){
  .story-collage{padding-bottom:0.65rem !important}
  .story-collage + .section-dark.fyc-block,
  .story-collage + .fyc-block{padding-top:0.65rem !important}
}

/* Header v26 — desktop centred nav; phone collapsed hamburger */
@media (min-width:721px){
  .site-header .header-inner{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    flex-wrap:nowrap !important;
    gap:0 !important;
  }
  .site-header .menu-toggle{display:none !important}
  .site-header .logo{flex:0 0 auto !important}
  .site-header .nav{
    display:flex !important;
    flex:1 1 auto !important;
    align-items:center !important;
    justify-content:center !important;
    flex-wrap:nowrap !important;
    gap:39px !important;
    min-width:0;
  }
  .site-header .nav a{
    flex:0 0 auto !important;
    width:auto !important;
    text-align:center;
    white-space:nowrap;
    font-size:.78rem;
    padding:0.15rem 0;
  }
  .site-header .nav a.btn.btn-primary.nav-shop,
  .site-header .nav a.nav-shop{
    display:inline-flex !important;
    align-items:center;
    justify-content:center;
    background:var(--brand)!important;
    color:#fff!important;
    border:0!important;
    border-radius:999px;
    box-shadow:none!important;
    padding:0.35rem 0.7rem!important;
    margin:0;
    min-height:0!important;
    height:auto!important;
    font-size:.78rem!important;
    font-family:var(--condensed)!important;
    font-weight:600!important;
    letter-spacing:.04em!important;
    text-transform:uppercase!important;
    line-height:1.1!important;
    transform:none!important;
  }
  .site-header .nav a.nav-shop:hover,
  .site-header .nav a.nav-shop:focus,
  .site-header .nav a.nav-shop.active{
    background:var(--brand-mid)!important;
    color:#fff!important;
    transform:none!important;
  }
}
@media (min-width:721px) and (max-width:1100px){
  .site-header .nav{gap:32px !important}
  .site-header .nav a,
  .site-header .nav a.nav-shop{font-size:.7rem!important}
}
@media (max-width:720px){
  .site-header .header-inner{
    display:flex !important;
    flex-wrap:wrap !important; /* logo+toggle one row; open nav wraps below */
    align-items:center !important;
    justify-content:space-between !important;
    gap:0.75rem !important;
  }
  .site-header .logo{
    flex:0 0 auto !important;
    order:1 !important;
  }
  .site-header .menu-toggle{
    display:block !important;
    margin-left:auto !important;
    order:2 !important;
  }
  .site-header .nav{
    display:none !important; /* collapsed until hamburger */
    order:3 !important;
    flex:0 0 100% !important;
    width:100% !important;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
    gap:0.35rem !important;
    padding:0.6rem 0 0.4rem !important;
  }
  .site-header .nav.open{
    display:flex !important;
  }
  .site-header .nav a,
  .site-header .nav a.nav-shop{
    flex:0 0 auto !important;
    text-align:left !important;
    justify-content:flex-start !important;
    font-size:.92rem !important;
    padding:0.55rem 0.2rem !important;
    white-space:normal !important;
  }
  .site-header .nav a.nav-shop{
    text-align:center !important;
    justify-content:center !important;
    padding:0.55rem 0.8rem !important;
    background:var(--brand)!important;
    color:#fff!important;
    border-radius:999px;
  }
}

/* ===== v27: yellow ticker — USA red-strip spacing, inset to content width ===== */
.marquee{
  background:var(--ticker-bg)!important;
  color:var(--ticker-fg)!important;
  /* inset to content width like USA collage/container */
  width:min(100% - 2.5rem, var(--max, 1180px)) !important;
  max-width:var(--max, 1180px) !important;
  margin-left:auto !important;
  margin-right:auto !important;
  /* navy bands above & below (body/main navy shows through) */
  margin-top:1rem !important;      /* ~16px desktop */
  margin-bottom:1rem !important;
  /* match USA track proportions; drop skew so inset bands stay even */
  transform:none !important;
  border-top:1px solid rgba(0,43,102,.18)!important;
  border-bottom:1px solid rgba(0,43,102,.18)!important;
  overflow:hidden;
  position:relative;
  z-index:3;
  border-radius:0;
}
.marquee-track{
  display:flex !important;
  gap:2.5rem !important;                 /* USA desktop item gap */
  width:max-content;
  padding:.85rem 0 !important;           /* USA desktop track pad */
  animation:marquee 28s linear infinite;
  font-family:var(--display) !important;
  font-size:clamp(1.2rem,2.5vw,1.7rem) !important;
  letter-spacing:.06em !important;
  text-transform:uppercase;
  white-space:nowrap;
  color:var(--ticker-fg)!important;
}
.marquee-track span{
  display:inline-flex !important;
  align-items:center;
  gap:2.5rem !important;                 /* USA: gap before • */
  color:var(--ticker-fg)!important;
}
.marquee-track span::after{
  content:"•";
  opacity:.85;
  color:var(--ticker-fg)!important;
}
/* story collage: don't double-up huge pad above photos; ticker margin handles band */
.story-collage{
  padding-top:0.85rem !important;
}
@media (max-width:768px){
  .marquee{
    width:min(100% - 2rem, var(--max, 1180px)) !important;
    margin-top:12px !important;          /* USA v43/v46 navy gap */
    margin-bottom:12px !important;
    transform:none !important;
  }
  .marquee-track{
    padding:.38rem 0 !important;         /* USA phone thin ticker */
    font-size:clamp(.82rem,3.1vw,1rem) !important;
    gap:1.35rem !important;
  }
  .marquee-track span{gap:1.35rem !important}
  .story-collage{
    padding-top:0 !important;
    margin-top:0 !important;
  }
}


/* v27 equal gaps removed — see v28 */

/* ===== v28: larger partner logos + ~37% tighter equal gaps from FYC down ===== */
/* Brands wall: denser rebuilt asset; less heading→logo gap; fill width */
html body main section.brands-band .brands-wall{
  margin:0.35rem auto 0 !important;
  padding:0 !important;
  max-width:100% !important;
  width:100% !important;
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
}
html body main section.brands-band .brands-wall img{
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  display:block !important;
  margin:0 auto !important;
  object-fit:contain !important;
}
html body main section.brands-band .container{
  max-width:min(1180px, 100%) !important;
  padding-left:1rem !important;
  padding-right:1rem !important;
}
html body main section.brands-band .eyebrow{
  margin:0 0 0.15rem !important;
}
html body main section.brands-band h2{
  margin:0 0 0.35rem !important;
}

/* Equal inter-section gaps: was 42/33 → cut ~37% → 26 desktop / 21 phone */
html body main > section.section-dark.fyc-block,
html body main > section.fyc-block,
html body main > section.fyc-block + section.section-dark,
html body main > section.fyc-block ~ section.section-dark,
html body main > section.fyc-block ~ section.section-cream,
html body main > section.fyc-block ~ section.brands-band,
html body main > section.fyc-block ~ section.section-cream.angled,
html body main > section.fyc-block ~ section.angled{
  padding-top:11px !important;
  padding-bottom:11px !important;
  margin-top:0 !important;
  margin-bottom:0 !important;
}
html body main > section.fyc-block ~ section.brands-band{
  padding-top:15px !important; /* +4 so Why→Partners matches ref */
  padding-bottom:11px !important;
}
/* Tighten heading→content inside sections from FYC down */
html body main > section.fyc-block ~ section .eyebrow,
html body main > section.fyc-block .eyebrow,
html body main > section.brands-band .eyebrow,
html body main > section.section-cream.angled .eyebrow{
  margin-top:0 !important;
  margin-bottom:0.2rem !important;
}
html body main > section.fyc-block ~ section h2,
html body main > section.fyc-block h2,
html body main > section.brands-band h2,
html body main > section.section-cream.angled h2{
  margin-top:0 !important;
  margin-bottom:0.35rem !important;
}
html body main > section.fyc-block ~ section .lead,
html body main > section.section-cream.angled .lead,
html body main > section.fyc-block .lead{
  margin-top:0 !important;
  margin-bottom:0.55rem !important;
}
/* Ready CTA: less space above Shop button */
html body main > section.section-cream.angled p[style*="margin-top"],
html body main > section.angled p[style*="margin-top"]{
  margin-top:0.65rem !important;
}
html body main > section.fyc-block ~ section .savings-navy{margin:0 !important}

@media (max-width:720px){
  html body main > section.section-dark.fyc-block,
  html body main > section.fyc-block,
  html body main > section.fyc-block + section.section-dark,
  html body main > section.fyc-block ~ section.section-dark,
  html body main > section.fyc-block ~ section.section-cream,
  html body main > section.fyc-block ~ section.brands-band,
  html body main > section.fyc-block ~ section.section-cream.angled,
  html body main > section.fyc-block ~ section.angled,
  html body main section.fyc-block{
    padding-top:8px !important;
    padding-bottom:8px !important;
  }
  html body main section.brands-band .brands-wall{
    margin-top:0.25rem !important;
  }
  html body main section.brands-band h2{
    margin-bottom:0.25rem !important;
  }
  html body main > section.section-cream.angled p[style*="margin-top"],
  html body main > section.angled p[style*="margin-top"]{
    margin-top:0.5rem !important;
  }
}

@media (max-width:720px){
  html body main > section.section-dark.fyc-block,
  html body main > section.fyc-block,
  html body main > section.fyc-block + section.section-dark,
  html body main > section.fyc-block ~ section.section-dark,
  html body main > section.fyc-block ~ section.section-cream,
  html body main > section.fyc-block ~ section.brands-band,
  html body main > section.fyc-block ~ section.section-cream.angled,
  html body main > section.fyc-block ~ section.angled,
  html body main section.fyc-block{
    padding-top:8px !important;
    padding-bottom:8px !important;
  }
  html body main > section.fyc-block ~ section.brands-band{
    padding-top:12px !important;
    padding-bottom:8px !important;
  }
} /* close orphaned v28 phone media */

/* v28 phone: equal ~20px gaps (≈39% under v27's 33) + 3-row brands */
@media (max-width:720px){
  html body main > section.section-dark.fyc-block,
  html body main > section.fyc-block,
  html body main > section.fyc-block + section.section-dark,
  html body main > section.fyc-block ~ section.section-dark,
  html body main > section.fyc-block ~ section.section-cream,
  html body main > section.fyc-block ~ section.brands-band,
  html body main > section.fyc-block ~ section.section-cream.angled,
  html body main > section.fyc-block ~ section.angled,
  html body main section.fyc-block{
    padding-top:8px !important;
    padding-bottom:8px !important;
  }
  html body main > section.fyc-block ~ section.brands-band{
    padding-top:12px !important;
    padding-bottom:8px !important;
  }
  html body main section.fyc-block .home-shop-grid--logos{
    margin-bottom:0 !important;
  }
  html body main section.brands-band .brands-wall,
  html body main section.brands-band .brands-wall picture,
  html body main section.brands-band .brands-wall img{
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    display:block !important;
    margin-top:0.2rem !important;
  }
}

/* ===== v28 FINAL gap lock ===== */
html body main > section.fyc-block,
html body main > section.section-dark.fyc-block,
html body main section.fyc-block{
  padding-top:11px !important;
  padding-bottom:11px !important;
}
html body main > section.fyc-block ~ section{
  padding-top:11px !important;
  padding-bottom:11px !important;
}
html body main > section.fyc-block ~ section.brands-band{
  padding-top:15px !important;
  padding-bottom:11px !important;
}
@media (max-width:720px){
  html body main > section.fyc-block,
  html body main > section.section-dark.fyc-block,
  html body main section.fyc-block,
  html body main > section.fyc-block ~ section{
    padding-top:8px !important;
    padding-bottom:8px !important;
  }
  html body main > section.fyc-block ~ section.brands-band{
    padding-top:12px !important;
    padding-bottom:8px !important;
  }
}


/* v29: header-shop-pill desktop hide */
html body .site-header .header-shop-pill{
  display:none !important;
}
@media (min-width:721px){
  html body .site-header .header-shop-pill{
    display:none !important;
  }
}

/* ===== v29 PHONE ONLY — desktop stays exactly as v28 ===== */

/* Header shop pill: hidden on desktop */
.header-shop-pill{display:none !important}

@media (max-width:720px){
  /* Reorder home: FYC before story (swap vs desktop/v28). Equal 21px gaps kept. */
  main#main{
    display:flex !important;
    flex-direction:column !important;
  }
  main#main > .hero-video,
  main#main > .hero-image{order:10 !important}
  main#main > .marquee{order:20 !important}
  main#main > .fyc-block{order:30 !important}
  main#main > .story-collage{order:40 !important}
  main#main > .fyc-block ~ section{order:50 !important}

  html body main > section.fyc-block,
  html body main > section.story-collage,
  html body main > section.fyc-block ~ section{
    padding-top:8px !important;
    padding-bottom:8px !important;
    margin-top:0 !important;
    margin-bottom:0 !important;
  }
  html body main .story-collage + .section-dark.fyc-block,
  html body main .story-collage + .fyc-block,
  html body main .fyc-block + .story-collage{
    padding-top:8px !important;
    margin-top:0 !important;
  }

  /* Match section text to Bring Your Team Colours story box */
  html body main .fyc-block .eyebrow,
  html body main section.section-dark > .container > .eyebrow{
    font-size:6.5px !important; /* v33c */
    margin-bottom:0.45rem !important;
    letter-spacing:.14em !important;
  }
  html body main .fyc-block .eyebrow{color:var(--mint, #7dffb3) !important}
  html body main .fyc-block h2,
  html body main section.section-dark > .container > h2{
    font-size:1.35rem !important;
    line-height:1.05 !important;
    margin:0 0 0.5rem !important;
  }
  html body main .fyc-block .lead,
  html body main section.section-dark > .container > .lead{
    font-size:0.84rem !important;
    line-height:1.4 !important;
    margin:0 auto 0.55rem !important;
    max-width:40rem;
  }

  /* Shorter licence cards, tighter logos */
  html body main .home-shop-grid--logos{gap:0.18rem !important}
  html body main .home-shop-tile--logo .home-shop-mark{
    height:58px !important;
    padding:0.12rem !important;
  }
  html body main .home-shop-tile--logo .home-shop-mark img{
    width:96% !important;
    height:96% !important;
    max-width:72px !important;
    max-height:52px !important;
    object-fit:contain !important;
  }
  html body main .home-shop-tile--logo .home-shop-body{
    padding:0.2rem 0.18rem 0.22rem !important;
  }
  html body main .home-shop-tile--logo .home-shop-body h3{
    font-size:0.46rem !important;
    line-height:1.05 !important;
  }
  html body main .home-shop-tile--logo .home-shop-body .home-shop-label{
    font-size:0.36rem !important;
    line-height:1.1 !important;
  }

  /* Yellow SHOP pill left of hamburger — one header line, no overlap */
  .site-header .header-inner{
    display:flex !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    gap:0.45rem !important;
  }
  .site-header .logo{
    flex:0 1 auto !important;
    min-width:0 !important;
    order:1 !important;
  }
  .site-header .logo img{
    max-height:28px !important;
    width:auto !important;
  }
  /* v30: shop pill = same size as hamburger; icon only */
  html body .site-header .header-shop-pill{
    display:inline-flex !important;
    order:2 !important;
    align-items:center !important;
    justify-content:center !important;
    gap:0 !important;
    margin-left:auto !important;
    flex:0 0 auto !important;
    box-sizing:border-box !important;
    width:36px !important;   /* match .menu-toggle */
    height:36px !important;
    min-width:36px !important;
    min-height:36px !important;
    max-width:36px !important;
    padding:0 !important;
    background:#FFC72C !important;
    color:#002b66 !important;
    text-decoration:none !important;
    border-radius:999px !important;
    box-shadow:none !important;
    border:0 !important;
    line-height:1 !important;
  }
  html body .site-header .header-shop-pill .header-shop-icon{
    display:block !important;
    width:16px !important;
    height:16px !important;
    flex:0 0 auto !important;
    color:#002b66 !important;
  }
  html body .site-header .header-shop-pill .header-shop-label{
    display:none !important; /* icon only */
  }
  .site-header .menu-toggle{
    display:inline-flex !important;
    order:3 !important;
    margin-left:0 !important;
    flex:0 0 auto !important;
    width:36px !important;
    height:36px !important;
    align-items:center !important;
    justify-content:center !important;
  }
  .site-header .nav{
    order:4 !important;
    flex-basis:100% !important;
  }
}

/* v30: label always hidden on phone; pill locked to 36px */
  .header-shop-pill{padding:0.32rem !important; width:32px !important; height:32px !important}


/* ===== v31: USA-matched phone SHOP pill (yellow/navy), desktop hidden ===== */
html body .site-header .header-shop-pill,
html body .site-header a.header-shop-pill,
html body .site-header a.btn-shop-mobile{
  display:none !important;
}
@media (min-width:721px){
  html body .site-header .header-shop-pill,
  html body .site-header a.btn-shop-mobile{
    display:none !important;
  }
}

@media (max-width:720px){
  /* Match USA .btn-shop-mobile at 390px: h18, pad 0 .5rem, Oswald 800, .08em, radius 999, ~10px gap */
  html body .site-header .header-inner{
    display:flex !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    gap:0 !important;
  }
  html body .site-header .logo{
    flex:0 1 auto !important;
    min-width:0 !important;
    order:1 !important;
  }
  html body .site-header .logo img{
    max-height:28px !important;
    width:auto !important;
  }
  html body .site-header a.header-shop-pill,
  html body .site-header a.btn-shop-mobile.header-shop-pill,
  html body .site-header .header-shop-pill{
    display:inline-flex !important;
    order:2 !important;
    align-items:center !important;
    justify-content:center !important;
    margin:0 10px 0 auto !important; /* USA: ~10px clear gap before hamburger */
    flex:0 0 auto !important;
    align-self:center !important;
    box-sizing:border-box !important;
    height:18px !important;
    min-height:18px !important;
    max-height:18px !important;
    width:auto !important;
    min-width:0 !important;
    max-width:none !important;
    padding:0 0.5rem !important; /* USA */
    background:#FFC72C !important;
    color:#002b66 !important;
    text-decoration:none !important;
    border:0 !important;
    border-radius:999px !important;
    box-shadow:0 1px 3px rgba(0,43,102,.18) !important; /* navy-tinted like USA red shadow */
    font-family:var(--condensed), Oswald, system-ui, sans-serif !important;
    font-size:0.55rem !important; /* ~8.8px */
    font-weight:800 !important;
    letter-spacing:.08em !important;
    line-height:1 !important;
    text-transform:uppercase !important;
    white-space:nowrap !important;
    transform:none !important;
  }
  html body .site-header a.header-shop-pill:hover,
  html body .site-header a.header-shop-pill:focus{
    background:#FFC72C !important;
    color:#002b66 !important;
    box-shadow:0 1px 4px rgba(0,43,102,.22) !important;
    transform:none !important;
  }
  /* no icon */
  html body .site-header .header-shop-pill .header-shop-icon,
  html body .site-header .header-shop-pill .header-shop-label{
    display:none !important;
  }
  html body .site-header .menu-toggle{
    display:inline-flex !important;
    order:3 !important;
    margin:0 !important;
    flex:0 0 auto !important;
    width:36px !important;
    height:36px !important;
    align-items:center !important;
    justify-content:center !important;
  }
  html body .site-header .nav{
    order:4 !important;
    flex-basis:100% !important;
  }
}
@media (max-width:430px){
  html body .site-header a.header-shop-pill{
    padding:0 0.42rem !important; /* USA narrow tweak */
  }
}
@media (max-width:360px){
  html body .site-header a.header-shop-pill{
    height:16px !important;
    min-height:16px !important;
    font-size:0.5rem !important;
    padding:0 0.38rem !important;
  }
}

/* ===== v32: phone type + spacing = USA 390px computed (desktop unchanged) ===== */
@media (max-width:720px){
  /* Container gutters — USA 12px */
  html body .container,
  html body main .container,
  html body .header-inner.container,
  html body .site-header .container{
    width:min(100% - 24px, var(--max, 1180px)) !important;
    padding-left:0 !important;
    padding-right:0 !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
  html body .site-header .header-inner{
    padding-top:0.65rem !important;  /* ~10.4px USA */
    padding-bottom:0.65rem !important;
  }

  /* Eyebrows — USA 9px / 700 / ~0.08em / mb 8px */
  html body main .eyebrow,
  html body .story-collage-copy .eyebrow,
  html body .fyc-block .eyebrow,
  html body section .eyebrow{
    font-family:var(--condensed), Oswald, system-ui, sans-serif !important;
    font-size:9px !important;
    font-weight:700 !important;
    letter-spacing:0.08em !important;
    text-transform:uppercase !important;
    margin-top:0 !important;
    margin-bottom:8px !important;
    line-height:1.2 !important;
  }

  /* Section / story h2 — USA 18px / lh 20.7 / mb 8 / mt 0 */
  html body main h2,
  html body main section h2,
  html body .story-collage-copy h2,
  html body .fyc-block h2,
  html body .savings-navy h2,
  html body .brands-band h2,
  html body section.section-cream h2,
  html body section.section-dark h2{
    font-family:var(--display), "Bebas Neue", sans-serif !important;
    font-size:18px !important;
    line-height:20.7px !important;
    font-weight:700 !important;
    margin-top:0 !important;
    margin-bottom:8px !important;
  }

  /* Body / lead — USA 12px / lh 16.2 / mb ~6.4–8 */
  html body main .lead,
  html body .fyc-block .lead,
  html body .story-collage-copy p:not(.eyebrow):not(.story-collage-cta),
  html body section.section-dark > .container > p.lead,
  html body section.section-cream > .container > p.lead{
    font-size:12px !important;
    line-height:16.2px !important;
    margin-top:0 !important;
    margin-bottom:8px !important;
  }
  html body main .lead{margin-bottom:6.4px !important}

  /* Story box internal rhythm — USA 8px gaps; button mt via cta */
  html body .story-collage-copy{
    padding:1rem 0.85rem 1rem !important;
  }
  html body .story-collage-copy .story-collage-cta{
    margin:8px 0 0 !important;
  }
  html body .story-collage-copy .btn,
  html body .story-collage-copy a.btn{
    font-size:11px !important;
    padding:5px 12px !important;
    border-radius:999px !important;
    font-weight:700 !important;
    letter-spacing:0.06em !important;
    min-height:0 !important;
    line-height:1.2 !important;
  }

  /* Generic navy/primary buttons (not header shop pill) */
  html body main .btn-primary,
  html body main .btn-navy,
  html body main a.btn-primary,
  html body main a.btn-navy,
  html body main .btn.btn-outline,
  html body main a.btn.btn-outline,
  html body footer .btn,
  html body .party-card .btn{
    font-size:11px !important;
    padding:5px 12px !important;
    font-weight:700 !important;
    letter-spacing:0.06em !important;
    border-radius:999px !important;
    min-height:0 !important;
    line-height:1.2 !important;
  }

  /* Feature cards — USA h3 11 / p 10 */
  html body .feature h3,
  html body .features h3{
    font-size:11px !important;
    margin:0 0 2px !important;
    line-height:1.2 !important;
  }
  html body .feature p,
  html body .features p{
    font-size:10px !important;
    line-height:13px !important;
    margin:0 !important;
  }

  /* Licence / shop logo card titles — USA 11px (undo AU over-shrink) */
  html body .home-shop-tile--logo .home-shop-body h3,
  html body .home-shop-body h3{
    font-size:11px !important;
    letter-spacing:0.03em !important;
    line-height:1.15 !important;
    margin:0 !important;
  }
  html body .home-shop-tile--logo .home-shop-label,
  html body .home-shop-label{
    font-size:11px !important;
    letter-spacing:0.04em !important;
    line-height:1.15 !important;
    margin:0 !important;
  }
  /* Give licence cards a bit more room for USA-size type */
  html body .home-shop-tile--logo .home-shop-mark{
    height:64px !important;
    padding:0.2rem !important;
  }
  html body .home-shop-tile--logo .home-shop-mark img{
    max-width:56px !important;
    max-height:56px !important;
    width:90% !important;
    height:90% !important;
  }
  html body .home-shop-tile--logo .home-shop-body{
    padding:0.35rem 0.3rem 0.4rem !important;
  }

  /* Party cards */
  html body .party-card h3{
    font-size:12px !important;
    margin:0 0 4px !important;
  }
  html body .party-card .price{
    font-size:12px !important;
  }

  /* Savings band */
  html body .savings-navy h2{
    font-size:18px !important;
    line-height:20.7px !important;
    margin-bottom:8px !important;
  }
  html body .savings-navy .sub,
  html body .savings-navy p{
    font-size:12px !important;
    line-height:16.2px !important;
  }
  html body .savings-navy .tile .qty{font-size:14px !important}
  html body .savings-navy .tile .pct{font-size:11px !important}
  html body .savings-navy .tile .lbl{font-size:9px !important}
  html body .savings-navy .btn-pill{
    font-size:11px !important;
    padding:5px 12px !important;
  }

  /* Footer — USA ~10px */
  html body footer,
  html body .site-footer,
  html body footer p,
  html body .site-footer p,
  html body footer li,
  html body footer a,
  html body .site-footer a{
    font-size:10px !important;
    line-height:13.5px !important;
  }
  html body footer h3,
  html body .site-footer h3{
    font-size:12px !important;
    margin-bottom:6px !important;
  }

  /* Ticker already matches USA — keep */
  /* FYC search — tighten toward USA control scale */
  html body .fyc-search input,
  html body .fyc-search button{
    font-size:12px !important;
    padding:6px 10px !important;
    min-height:0 !important;
  }

  /* Keep yellow SHOP pill USA-matched (do not override v31 pill) */
}

/* v32b: licence type + CTA gap + gutters */
@media (max-width:720px){
  html body main .container,
  html body .container{
    box-sizing:border-box !important;
    width:min(100%, var(--max, 1180px)) !important;
    max-width:100% !important;
    padding-left:12px !important;
    padding-right:12px !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
  html body main .home-shop-grid--logos .home-shop-tile--logo .home-shop-body h3,
  html body main .fyc-block .home-shop-tile--logo .home-shop-body h3,
  html body main .home-shop-tile--logo h3{
    font-size:11px !important;
    letter-spacing:0.03em !important;
    line-height:1.15 !important;
    margin:0 !important;
  }
  html body main .home-shop-grid--logos .home-shop-tile--logo .home-shop-label,
  html body main .fyc-block .home-shop-tile--logo .home-shop-label,
  html body main .home-shop-label{
    font-size:11px !important;
    letter-spacing:0.04em !important;
    margin:0 !important;
  }
  html body main .story-collage-copy .story-collage-cta{
    margin:8px 0 0 !important;
  }
  html body main .story-collage-copy > p:not(.eyebrow):not(.story-collage-cta),
  html body main .story-collage-copy .story-collage-text > p:not(.eyebrow):not(.story-collage-cta){
    margin-bottom:8px !important;
  }
}

@media (max-width:720px){
  /* USA story: 8px total from body text to button */
  html body main .story-collage-copy > p:not(.eyebrow):not(.story-collage-cta),
  html body main .story-collage-copy .story-collage-text > p:not(.eyebrow):not(.story-collage-cta){
    margin-bottom:0 !important;
  }
  html body main .story-collage-copy .story-collage-cta{
    margin-top:8px !important;
  }
}

/* ===== v33: phone shop + category listings use v32/USA home type scale (desktop unchanged) ===== */
@media (max-width:720px){
  /* Page hero / shop headings */
  html body .page-hero h1,
  html body main .page-hero h1,
  html body main h1{
    font-family:var(--display), "Bebas Neue", sans-serif !important;
    font-size:18px !important;
    line-height:20.7px !important;
    font-weight:700 !important;
    margin:0 0 8px !important;
    letter-spacing:.02em !important;
  }
  html body .page-hero{
    padding:1.1rem 0 0.85rem !important;
  }
  html body .page-hero .lead,
  html body .page-hero p.lead,
  html body main .page-hero .lead{
    font-size:12px !important;
    line-height:16.2px !important;
    margin:0 0 8px !important;
  }
  html body .breadcrumb,
  html body .breadcrumb a,
  html body .page-hero .breadcrumb{
    font-size:10px !important;
    line-height:13.5px !important;
  }

  /* Filter / host pills */
  html body .host-pills .pill,
  html body a.pill,
  html body .pill{
    font-size:9px !important;
    font-weight:700 !important;
    letter-spacing:0.06em !important;
    padding:4px 10px !important;
    line-height:1.2 !important;
  }

  /* Product grid cards */
  html body .product-card h3,
  html body .product-card h3 a{
    font-family:var(--condensed), Oswald, system-ui, sans-serif !important;
    font-size:11px !important;
    line-height:1.25 !important;
    letter-spacing:0.03em !important;
    margin:0 !important;
    color:#fff !important;
  }
  html body .product-card .meta{
    font-size:10px !important;
    line-height:13px !important;
  }
  html body .product-card .price,
  html body .product-grid .price{
    font-family:var(--display), "Bebas Neue", sans-serif !important;
    font-size:14px !important;
    line-height:1.1 !important;
    letter-spacing:0.03em !important;
    color:var(--sky, #5eb8ff) !important;
  }
  html body .product-card .body{
    padding:0.55rem 0.5rem 0.65rem !important;
    gap:0.2rem !important;
  }
  html body .product-card .body .btn,
  html body .product-card a.btn{
    font-size:11px !important;
    padding:5px 12px !important;
    border-radius:999px !important;
    font-weight:700 !important;
    letter-spacing:0.06em !important;
    min-height:0 !important;
    line-height:1.2 !important;
  }

  /* Category / savings blurbs on shop-adjacent dark sections */
  html body .section-dark .lead,
  html body main .section-dark > .container > p{
    font-size:12px !important;
    line-height:16.2px !important;
  }
  html body .section-dark h2{
    font-size:18px !important;
    line-height:20.7px !important;
    margin-bottom:8px !important;
  }

  /* Product detail (if opened from shop) — keep scale consistent */
  html body .price-lg{
    font-size:18px !important;
    margin:0.25rem 0 0.65rem !important;
  }
}

/* ===== v33b: phone headings ~27% smaller, uniform; eyebrows scaled; shop matches ===== */
@media (max-width:720px){
  html body main h2,
  html body main section h2,
  html body .story-collage-copy h2,
  html body .fyc-block h2,
  html body .savings-navy h2,
  html body .brands-band h2,
  html body section.section-cream h2,
  html body section.section-dark h2,
  html body .page-hero h1,
  html body main .page-hero h1,
  html body main h1{
    font-size:13px !important;          /* was 18px (~28% smaller) */
    line-height:15px !important;
    font-weight:700 !important;
    margin-top:0 !important;
    margin-bottom:6px !important;
  }

  html body main .eyebrow,
  html body .story-collage-copy .eyebrow,
  html body .fyc-block .eyebrow,
  html body section .eyebrow,
  html body .page-hero .eyebrow{
    font-size:6.5px !important;         /* was 9px, same ~28% cut */
    font-weight:700 !important;
    letter-spacing:0.08em !important;
    margin-bottom:6px !important;
    line-height:1.2 !important;
  }
}

/* ===== v33c FINAL: every phone h2/h1 + eyebrow uniform smaller size ===== */
@media (max-width:720px){
  html body main h1,
  html body main h2,
  html body main section h1,
  html body main section h2,
  html body main .page-hero h1,
  html body main .story-collage-copy h2,
  html body main .fyc-block h2,
  html body main .savings-navy h2,
  html body main .brands-band h2,
  html body main section.section-cream h2,
  html body main section.section-cream.angled h2,
  html body main section.section-dark h2,
  html body main section.section-dark > .container > h2,
  html body main .home-story-fyc-pair h2,
  html body .brands-band h2,
  html body .fyc-block h2{
    font-size:13px !important;
    line-height:15px !important;
    margin-top:0 !important;
    margin-bottom:6px !important;
  }
  html body main .eyebrow,
  html body main section .eyebrow,
  html body main .fyc-block .eyebrow,
  html body main .brands-band .eyebrow,
  html body main .story-collage-copy .eyebrow,
  html body main section.section-cream .eyebrow,
  html body main section.section-dark .eyebrow,
  html body .brands-band .eyebrow,
  html body .fyc-block .eyebrow{
    font-size:6.5px !important;
    letter-spacing:0.08em !important;
    margin-bottom:6px !important;
    line-height:1.2 !important;
  }
}

/* absolute final eyebrow lock */
@media (max-width:720px){
  html body .eyebrow,
  html body main .eyebrow,
  html body p.eyebrow,
  html body main p.eyebrow,
  html body section p.eyebrow{
    font-size:6.5px !important;
    letter-spacing:0.08em !important;
    margin-bottom:6px !important;
  }
}

/* ===== v33d: Ready eyebrow beat game-day .65rem; product thumbs fill; licence labels fit ===== */
@media (max-width:720px){
  /* Beat game-day-au .section-cream.angled .eyebrow {font-size:.65rem} (0,3,0) */
  html body main > section.section-cream.angled .eyebrow,
  html body main > section.section-cream .eyebrow,
  html body main section.section-cream.angled > .container > .eyebrow,
  html body main section.section-cream > .container > .eyebrow,
  html body main section.section-cream.angled p.eyebrow,
  html body main section.section-cream p.eyebrow{
    font-size:6.5px !important;
    letter-spacing:0.08em !important;
    margin-bottom:6px !important;
    line-height:1.2 !important;
  }

  /* Product / party card images: fill card width, 6-8px pad, height follows image (no empty band) */
  html body .product-card .thumb,
  html body .party-card .thumb,
  html body main .product-card .thumb,
  html body main .party-card .thumb,
  html body .product-grid .product-card .thumb,
  html body .party-grid .party-card .thumb{
    aspect-ratio:auto !important;
    height:auto !important;
    min-height:0 !important;
    padding:7px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    box-sizing:border-box !important;
  }
  html body .product-card .thumb img,
  html body .party-card .thumb img,
  html body main .product-card .thumb img,
  html body main .party-card .thumb img,
  html body .product-grid .product-card .thumb img,
  html body .party-grid .party-card .thumb img,
  html body .product-card .thumb img[src*="party-pack"],
  html body .party-card .thumb img[src*="party-pack"]{
    width:100% !important;
    max-width:100% !important;
    height:auto !important;
    max-height:none !important;
    object-fit:contain !important;
    display:block !important;
  }

  /* Licence cards: Oswald title + Inter sub-label at phone small-label sizes; fit 1-2 lines */
  html body main .home-shop-grid--logos .home-shop-tile--logo .home-shop-body h3,
  html body main .fyc-block .home-shop-tile--logo .home-shop-body h3,
  html body main .home-shop-tile--logo h3,
  html body .home-shop-tile--logo .home-shop-body h3{
    font-family:var(--condensed), Oswald, system-ui, sans-serif !important;
    font-size:8px !important;
    font-weight:700 !important;
    letter-spacing:0.04em !important;
    line-height:1.15 !important;
    text-transform:uppercase !important;
    margin:0 0 2px !important;
    overflow:visible !important;
    white-space:normal !important;
    word-break:normal !important;
    hyphens:none !important;
    max-height:none !important;
  }
  html body main .home-shop-grid--logos .home-shop-tile--logo .home-shop-label,
  html body main .fyc-block .home-shop-tile--logo .home-shop-label,
  html body main .home-shop-label,
  html body .home-shop-tile--logo .home-shop-label{
    font-family:var(--sans, Inter), Inter, system-ui, sans-serif !important;
    font-size:7px !important;
    font-weight:600 !important;
    letter-spacing:0.02em !important;
    line-height:1.2 !important;
    text-transform:none !important;
    margin:0 !important;
    overflow:visible !important;
    white-space:normal !important;
    max-height:none !important;
  }
  html body main .home-shop-tile--logo .home-shop-body,
  html body .home-shop-tile--logo .home-shop-body{
    overflow:visible !important;
    padding:0.28rem 0.2rem 0.32rem !important;
    min-height:0 !important;
  }
  html body main .home-shop-tile--logo,
  html body .home-shop-tile--logo{
    overflow:visible !important;
    height:auto !important;
  }
}

/* ===== v34/v35: equal 21px phone section gaps + shop titles; v35 moves photos into story box ===== */
@media (max-width:720px){
  /* --- Equal 21px BOX gaps between every adjacent main child (phone only) --- */
  html body main#main,
  html body main{
    display:flex !important;
    flex-direction:column !important;
    gap:21px !important;
    row-gap:21px !important;
  }
  html body main > section,
  html body main > section.section-dark,
  html body main > section.section-cream,
  html body main > section.section-dark.fyc-block,
  html body main > section.fyc-block,
  html body main > section.story-collage,
  html body main > section.story-collage.section-dark,
  html body main > section.brands-band,
  html body main > section.section-cream.brands-band,
  html body main > section.section-cream.angled,
  html body main > section.angled,
  html body main > section.page-hero,
  html body main > section.hero-video,
  html body main > section.hero-video.hero-image,
  html body main > section.hero-video.hero-image.hero-wide,
  html body main section.fyc-block,
  html body main > .marquee,
  html body main > div.marquee,
  html body main > .marquee + section,
  html body main > div.marquee + section,
  html body main > section.fyc-block ~ section,
  html body main > section.fyc-block ~ section.brands-band,
  html body main > section.fyc-block ~ section.section-dark,
  html body main > section.fyc-block ~ section.section-cream,
  html body main > section.fyc-block ~ section.section-cream.angled{
    margin-top:0 !important;
    margin-bottom:0 !important;
    /* vertical section padding zeroed so it cannot add to the 21px flex gap */
    padding-top:0 !important;
    padding-bottom:0 !important;
  }
  /* Consistent internal inset via container only (does not affect section-to-section box gap) */
  html body main > section > .container,
  html body main > section.section-dark > .container,
  html body main > section.section-cream > .container,
  html body main > section.fyc-block > .container,
  html body main > section.story-collage > .container,
  html body main > section.brands-band > .container,
  html body main > section.page-hero > .container{
    padding-top:10px !important;
    padding-bottom:10px !important;
  }
  /* Hero: image fills section — no container inset needed */
  html body main > section.hero-video > .container,
  html body main > section.hero-video.hero-image{
    padding-top:0 !important;
    padding-bottom:0 !important;
  }
  /* Footer sits outside main — match the same 21px box gap */
  html body main{
    margin-bottom:0 !important;
  }
  html body .site-footer,
  html body footer.site-footer,
  html body footer{
    margin-top:21px !important;
    padding-top:10px !important;
  }

  /* --- v35: photo strip inside navy story box (undo v34 white inset box) --- */
  html body main .story-collage .story-collage-copy,
  html body .story-collage .story-collage-copy{
    gap:0.85rem !important;
    align-items:stretch !important; /* photos full width of inner content */
  }
  html body main .story-collage .story-collage-copy .story-collage-text,
  html body .story-collage .story-collage-copy .story-collage-text{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    width:100% !important;
    text-align:center !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    padding:0 !important;
    margin:0 !important;
  }
  /* Restore earlier strip styling: no white outer box, no 6px inset, no rounded outer photos */
  html body main .story-collage .collage-frame.fans-5panel,
  html body .story-collage .collage-frame.fans-5panel,
  html body .story-collage-copy .collage-frame.fans-5panel{
    padding:0 !important;
    margin:0 !important;
    width:100% !important;
    max-width:none !important;
    box-sizing:border-box !important;
    overflow:hidden !important;
    background:transparent !important;
    border:0 !important;
    border-radius:8px !important; /* soft clip only; no separate white chrome */
    box-shadow:none !important;
  }
  html body main .story-collage .fans-panel-grid,
  html body .story-collage .fans-panel-grid,
  html body .story-collage-copy .fans-panel-grid{
    gap:4px !important; /* pre-v34 phone gap */
    padding:0 !important;
    margin:0 !important;
    width:100% !important;
    background:transparent !important;
    overflow:hidden !important;
    border-radius:0 !important;
  }
  html body main .story-collage .fans-panel-grid img,
  html body .story-collage .fans-panel-grid img,
  html body .story-collage-copy .fans-panel-grid img,
  html body main .story-collage .fans-panel-grid img:first-child,
  html body .story-collage .fans-panel-grid img:first-child,
  html body main .story-collage .fans-panel-grid img:last-child,
  html body .story-collage .fans-panel-grid img:last-child{
    border-radius:0 !important;
    display:block !important;
    width:100% !important;
    height:auto !important;
  }

  /* --- Shop / category product titles: USA licence card style --- */
  html body .product-card h3,
  html body .product-card h3.product-card-title,
  html body .product-card .product-name,
  html body main .product-card h3,
  html body main .product-card .product-name{
    font-family:var(--condensed), Oswald, system-ui, sans-serif !important;
    font-size:11px !important;
    font-weight:700 !important;
    line-height:13px !important;
    letter-spacing:0.03em !important;
    text-transform:uppercase !important;
    color:#fff !important;
    margin:0 0 2px !important;
  }
  html body .section-cream .product-card h3,
  html body .section-cream .product-card .product-name{
    color:var(--ink, #0b1022) !important;
  }
  html body .product-card .meta,
  html body .product-card .meta.product-sub,
  html body main .product-card .meta{
    font-family:var(--condensed), Oswald, system-ui, sans-serif !important;
    font-size:11px !important;
    font-weight:400 !important;
    line-height:13px !important;
    letter-spacing:0.04em !important;
    text-transform:uppercase !important;
    color:rgb(169, 179, 199) !important;
    margin:0 0 4px !important;
  }
  html body .sr-only{
    position:absolute !important;
    width:1px !important;
    height:1px !important;
    padding:0 !important;
    margin:-1px !important;
    overflow:hidden !important;
    clip:rect(0,0,0,0) !important;
    white-space:nowrap !important;
    border:0 !important;
  }
}

/* ===== v35: desktop — keep prior look (photos above navy text card) despite shared markup ===== */
@media (min-width:721px){
  html body .story-collage .story-collage-copy,
  html body main .story-collage .story-collage-copy{
    width:100% !important;
    max-width:none !important;
    margin:0 auto !important;
    padding:0 !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    border-radius:0 !important;
    gap:1.75rem !important; /* was story-collage-inner gap between figure + copy */
    align-items:center !important;
  }
  html body .story-collage .story-collage-text,
  html body main .story-collage .story-collage-text{
    width:100% !important;
    max-width:920px !important;
    margin:0 auto !important;
    box-sizing:border-box !important;
    text-align:center !important;
    background:linear-gradient(180deg,#151f3d,#0d1430) !important;
    border:1px solid rgba(255,255,255,.14) !important;
    border-radius:var(--radius,16px) !important;
    box-shadow:0 18px 50px rgba(0,0,0,.35) !important;
    padding:1.6rem 1.4rem 1.5rem !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
  }
  /* Restore earlier desktop strip chrome (white frame, not the phone-in-box look) */
  html body .story-collage .collage-frame.fans-5panel,
  html body main .story-collage .collage-frame.fans-5panel{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    background:#fff !important;
    border:1px solid rgba(255,255,255,.14) !important;
    border-radius:var(--radius,16px) !important;
    box-shadow:0 18px 50px rgba(0,0,0,.4) !important;
    overflow:hidden !important;
  }
  html body .story-collage .fans-panel-grid,
  html body main .story-collage .fans-panel-grid{
    gap:8px !important;
    background:#fff !important;
    border-radius:0 !important;
  }
  html body .story-collage .fans-panel-grid img,
  html body main .story-collage .fans-panel-grid img{
    border-radius:0 !important;
  }
}

/* ===== v36: Find Your Colours in navy story-style box; 21px under yellow stripe (phone) ===== */
@media (max-width:720px){
  /* Section itself is just a flex slot — no extra pad that would inflate the stripe gap */
  html body main > section.section-dark.fyc-block,
  html body main > section.fyc-block,
  html body main section.fyc-block{
    padding-top:0 !important;
    padding-bottom:0 !important;
    margin-top:0 !important;
    margin-bottom:0 !important;
    background:transparent !important; /* page shell shows around the inset navy box */
  }
  /* Same chrome as .story-collage-copy navy card */
  html body main > section.fyc-block > .container,
  html body main section.fyc-block > .container,
  html body main .fyc-block > .container{
    box-sizing:border-box !important;
    width:auto !important;
    max-width:100% !important;
    margin-left:12px !important;
    margin-right:12px !important;
    padding:1.15rem 1rem 1.2rem !important; /* match phone story-collage-copy */
    background:linear-gradient(180deg,#151f3d,#0d1430) !important;
    border:1px solid rgba(255,255,255,.14) !important;
    border-radius:14px !important;
    box-shadow:0 18px 50px rgba(0,0,0,.35) !important;
    text-align:center !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
  }
  /* White / mint type on navy */
  html body main .fyc-block .eyebrow,
  html body main section.fyc-block .eyebrow{
    color:var(--mint, #7dffb3) !important;
  }
  html body main .fyc-block h2,
  html body main section.fyc-block h2{
    color:#fff !important;
  }
  html body main .fyc-block .lead,
  html body main section.fyc-block .lead{
    color:rgba(255,255,255,.88) !important;
  }
  /* Search + licence grid stay inside the box width */
  html body main .fyc-block .fyc-search,
  html body main .fyc-block .home-shop-grid--logos{
    width:100% !important;
    max-width:100% !important;
  }
  html body main .fyc-block .home-shop-grid--logos{
    margin-top:0.75rem !important;
    margin-bottom:0 !important;
  }
  /* Keep yellow stripe → FYC box at the standard 21px flex gap (no leftover section/container offset) */
  html body main > .marquee,
  html body main > div.marquee{
    margin-top:0 !important;
    margin-bottom:0 !important;
  }
}

@media (max-width:720px){
  /* v36b: kill residual 8px above FYC navy box so stripe→box is exactly 21px */
  html body main > section.fyc-block,
  html body main > section.section-dark.fyc-block,
  html body main section.section-dark.fyc-block,
  html body main section.fyc-block{
    padding:0 !important;
    margin:0 !important;
    border:0 !important;
  }
  html body main > section.fyc-block > .container,
  html body main section.fyc-block > .container{
    margin-top:0 !important;
    margin-bottom:0 !important;
  }
}

@media (max-width:720px){
  /* v36c: beat .story-collage + .fyc-block {padding-top:8px} (DOM sibling still matches despite flex reorder) */
  html body main .story-collage + .section-dark.fyc-block,
  html body main .story-collage + .fyc-block,
  html body main .fyc-block + .story-collage,
  html body main .fyc-block + .story-collage.section-dark,
  html body main > section.story-collage + section.fyc-block,
  html body main > section.story-collage + section.section-dark.fyc-block{
    padding-top:0 !important;
    padding-bottom:0 !important;
    margin-top:0 !important;
  }
}

/* ===== v37: Why navy box after FYC; clean phone menu; desktop shop type from phone ===== */

/* --- Phone: Why FANBRUSH after FYC, same navy box as FYC/story --- */
@media (max-width:720px){
  html body main#main > section.why-block,
  html body main > section.why-block{
    order:35 !important; /* after FYC(30), before story(40) */
    padding:0 !important;
    margin:0 !important;
    background:transparent !important;
  }
  html body main > section.why-block > .container,
  html body main section.why-block > .container{
    box-sizing:border-box !important;
    width:auto !important;
    max-width:100% !important;
    margin-left:12px !important;
    margin-right:12px !important;
    margin-top:0 !important;
    margin-bottom:0 !important;
    padding:1.15rem 1rem 1.2rem !important;
    background:linear-gradient(180deg,#151f3d,#0d1430) !important;
    border:1px solid rgba(255,255,255,.14) !important;
    border-radius:14px !important;
    box-shadow:0 18px 50px rgba(0,0,0,.35) !important;
    text-align:center !important;
  }
  html body main .why-block .eyebrow{color:var(--mint,#7dffb3) !important}
  html body main .why-block h2{color:#fff !important}
  html body main .why-block .feature h3{color:#fff !important}
  html body main .why-block .feature p{color:rgba(255,255,255,.82) !important}
  html body main .why-block .features{
    margin:0.75rem 0 0 !important;
    gap:0.55rem !important;
  }
  html body main .why-block .feature{
    background:rgba(0,0,0,.22) !important;
    border:1px solid rgba(255,255,255,.10) !important;
    border-radius:10px !important;
    padding:0.7rem 0.65rem !important;
  }

  /* --- Phone menu: clean full-width navy panel; logo stays in header row only --- */
  html body .site-header{
    background:#070b1a !important;
    z-index:50 !important;
  }
  html body .site-header .header-inner{
    display:flex !important;
    flex-wrap:wrap !important;
    align-items:center !important;
    gap:0.45rem !important;
    position:relative !important;
  }
  html body .site-header .logo{
    order:1 !important;
    flex:0 0 auto !important;
    min-width:auto !important;
    max-width:calc(100% - 100px) !important;
    width:auto !important;
    position:relative !important;
    z-index:3 !important;
    align-self:center !important;
  }
  html body .site-header .logo img{
    display:block !important;
    height:28px !important;
    width:auto !important;
    max-width:150px !important;
    min-width:90px !important;
  }
  html body .site-header .header-shop-pill,
  html body .site-header a.btn-shop-mobile{
    order:2 !important;
    position:relative !important;
    z-index:3 !important;
  }
  html body .site-header .menu-toggle{
    order:3 !important;
    position:relative !important;
    z-index:3 !important;
    margin-left:0 !important;
  }
  html body .site-header .nav{
    display:none !important;
  }
  html body .site-header .nav.open{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
    order:4 !important;
    flex:1 0 100% !important;
    flex-basis:100% !important;
    width:100vw !important;
    max-width:100vw !important;
    margin-left:calc(50% - 50vw) !important;
    margin-right:calc(50% - 50vw) !important;
    margin-top:0.45rem !important;
    margin-bottom:0 !important;
    box-sizing:border-box !important;
    gap:0 !important;
    padding:0.25rem 0 0.85rem !important;
    background:#0d1430 !important;
    border:0 !important;
    border-top:1px solid rgba(255,255,255,.12) !important;
    border-radius:0 !important;
    box-shadow:none !important;
    position:relative !important;
    z-index:2 !important;
    overflow:hidden !important;
  }
  html body .site-header .nav.open > a{
    display:block !important;
    width:100% !important;
    box-sizing:border-box !important;
    color:#fff !important;
    font-family:var(--condensed), Oswald, system-ui, sans-serif !important;
    font-size:14px !important;
    font-weight:600 !important;
    letter-spacing:0.06em !important;
    text-transform:uppercase !important;
    text-decoration:none !important;
    padding:0.85rem 1rem !important;
    margin:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    line-height:1.2 !important;
  }
  html body .site-header .nav.open > a + a{
    border-top:1px solid rgba(255,255,255,.08) !important;
  }
  html body .site-header .nav.open > a.nav-shop,
  html body .site-header .nav.open > a.btn.btn-primary.nav-shop{
    order:0 !important;
    width:auto !important;
    align-self:stretch !important;
    margin:0.65rem 0.85rem 0.5rem !important;
    padding:0.7rem 1rem !important;
    border-radius:999px !important;
    border:0 !important;
    border-top:0 !important;
    background:#002b66 !important;
    color:#fff !important;
    text-align:center !important;
    justify-content:center !important;
    display:flex !important;
    font-size:13px !important;
    font-weight:700 !important;
  }
  html body .site-header .nav.open > a.nav-shop + a{
    border-top:0 !important;
  }
}

/* --- Desktop: Why navy box + even section gaps; shop type from phone scaled --- */
@media (min-width:721px){
  html body main#main,
  html body main{
    display:flex !important;
    flex-direction:column !important;
    gap:28px !important;
    row-gap:28px !important;
  }
  html body main > section,
  html body main > .marquee,
  html body main > div.marquee{
    margin-top:0 !important;
    margin-bottom:0 !important;
  }
  /* Why box — same chrome as story text card / FYC */
  html body main > section.why-block{
    padding-top:0 !important;
    padding-bottom:0 !important;
    background:transparent !important;
  }
  html body main > section.why-block > .container{
    box-sizing:border-box !important;
    max-width:920px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding:1.6rem 1.4rem 1.5rem !important;
    background:linear-gradient(180deg,#151f3d,#0d1430) !important;
    border:1px solid rgba(255,255,255,.14) !important;
    border-radius:var(--radius,16px) !important;
    box-shadow:0 18px 50px rgba(0,0,0,.35) !important;
    text-align:center !important;
  }
  html body main .why-block .eyebrow{color:var(--mint,#7dffb3) !important}
  html body main .why-block h2{color:#fff !important}
  html body main .why-block .feature h3{color:#fff !important}
  html body main .why-block .feature p{color:rgba(255,255,255,.82) !important}
  html body main .why-block .feature{
    background:rgba(0,0,0,.22) !important;
    border:1px solid rgba(255,255,255,.10) !important;
    border-radius:12px !important;
  }

  /* Desktop shop: phone type system scaled (~1.5–1.6×) */
  html body .page-hero h1,
  html body main .page-hero h1,
  html body.shop .page-hero h1,
  html body main h1{
    font-family:var(--display), "Bebas Neue", sans-serif !important;
    font-size:28px !important;          /* phone 13 → ~2.15× */
    line-height:32px !important;
    font-weight:700 !important;
    letter-spacing:0.02em !important;
    text-transform:uppercase !important;
  }
  html body .page-hero .lead,
  html body main .page-hero .lead,
  html body main .lead{
    font-family:Inter, system-ui, sans-serif !important;
    font-size:16px !important;          /* phone 12 → ~1.33× */
    line-height:22px !important;
    font-weight:400 !important;
    color:rgb(169,179,199) !important;
  }
  html body .product-card h3,
  html body .product-card h3.product-card-title,
  html body .product-card .product-name,
  html body main .product-card h3,
  html body main .product-card .product-name{
    font-family:var(--condensed), Oswald, system-ui, sans-serif !important;
    font-size:16px !important;          /* phone 11 → ~1.45× */
    font-weight:700 !important;
    line-height:19px !important;
    letter-spacing:0.03em !important;
    text-transform:uppercase !important;
    color:#fff !important;
    margin:0 0 4px !important;
  }
  html body .section-cream .product-card h3,
  html body .section-cream .product-card .product-name{
    color:var(--ink,#0b1022) !important;
  }
  html body .product-card .meta,
  html body .product-card .meta.product-sub,
  html body main .product-card .meta{
    font-family:var(--condensed), Oswald, system-ui, sans-serif !important;
    font-size:14px !important;          /* phone 11 → ~1.27× */
    font-weight:400 !important;
    line-height:17px !important;
    letter-spacing:0.04em !important;
    text-transform:uppercase !important;
    color:rgb(169,179,199) !important;
    margin:0 0 6px !important;
  }
  html body .product-card .price,
  html body .product-grid .price,
  html body main .product-card .price{
    font-family:var(--display), "Bebas Neue", sans-serif !important;
    font-size:22px !important;          /* phone 14 → ~1.57× */
    line-height:1.1 !important;
    font-weight:400 !important;
  }
}

/* ===== v38: Bulk Savings directly after FYC (before Why); even gaps ===== */
@media (max-width:720px){
  html body main#main > section.bulk-block,
  html body main > section.bulk-block{
    order:32 !important; /* FYC 30 → Bulk 32 → Why 35 → story 40 */
    padding:0 !important;
    margin:0 !important;
  }
  /* inner container: no extra vertical padding beyond standard so gap stays 21 */
  html body main > section.bulk-block > .container{
    padding-top:0 !important;
    padding-bottom:0 !important;
  }
  html body main > section.bulk-block .eyebrow{
    margin-top:0 !important;
    margin-bottom:6px !important;
  }
  html body main > section.bulk-block .savings-navy{
    margin:0 !important;
  }
}
@media (min-width:721px){
  html body main > section.bulk-block{
    padding-top:0 !important;
    padding-bottom:0 !important;
    margin:0 !important;
  }
  html body main > section.bulk-block > .container{
    padding-top:0 !important;
    padding-bottom:0 !important;
  }
  html body main > section.bulk-block .eyebrow{
    margin-top:0 !important;
    margin-bottom:8px !important;
  }
  html body main > section.bulk-block .savings-navy{
    margin:0 !important;
  }
}

/* ===== v39: phone partner logo grid + compact Why feature cards ===== */

/* Desktop defaults: sprite on, grid off */
html body main section.brands-band ul.brands-grid{
  display:none !important;
}
html body main section.brands-band picture.brands-wall-sprite,
html body main section.brands-band .brands-wall-sprite{
  display:block !important;
}

@media (max-width:720px){
  /* Hide sprite (beat earlier .brands-wall picture {display:block}) */
  html body main section.brands-band .brands-wall picture.brands-wall-sprite,
  html body main section.brands-band .brands-wall picture.brands-wall-sprite img,
  html body main section.brands-band picture.brands-wall-sprite,
  html body main section.brands-band .brands-wall-sprite{
    display:none !important;
    height:0 !important;
    width:0 !important;
    max-height:0 !important;
    overflow:hidden !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
  }

  html body main section.brands-band ul.brands-grid,
  html body main section.brands-band .brands-grid{
    display:grid !important;
    list-style:none !important;
    margin:0.25rem 0 0 !important;
    padding:0 !important;
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
    grid-template-columns:repeat(6, minmax(0, 1fr)) !important;
    gap:4px !important;
    align-items:stretch !important;
  }
  html body main section.brands-band .brands-grid .brands-tile,
  html body main section.brands-band li.brands-tile{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    box-sizing:border-box !important;
    margin:0 !important;
    padding:3px !important;
    width:auto !important;
    min-width:0 !important;
    aspect-ratio:auto !important;
    min-height:34px !important;
    height:34px !important;
    max-height:34px !important;
    background:transparent !important;
    border:none !important;
    border-radius:0 !important;
    box-shadow:none !important;
    overflow:hidden !important;
  }
  html body main section.brands-band .brands-tile img,
  html body main section.brands-band .brands-grid img{
    display:block !important;
    width:100% !important;
    height:100% !important;
    max-width:100% !important;
    max-height:100% !important;
    object-fit:contain !important;
    object-position:center !important;
    margin:0 !important;
    padding:0 !important;
    filter:none !important;
    opacity:1 !important;
    min-height:0 !important;
  }
  html body main section.brands-band .eyebrow,
  html body main section.brands-band h2{
    text-align:center !important;
  }
  html body main section.brands-band{
    padding-top:0 !important;
    padding-bottom:0 !important;
  }
  html body main section.brands-band > .container{
    padding-left:12px !important;
    padding-right:12px !important;
  }

  /* Why feature cards — compact equal 2x2 */
  html body main .why-block .features,
  html body main section.why-block .features{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:8px !important;
    margin:0.5rem 0 0 !important;
    align-items:stretch !important;
  }
  html body main .why-block .feature,
  html body main section.why-block .feature{
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    box-sizing:border-box !important;
    min-height:0 !important;
    height:auto !important;
    padding:10px !important;
    border-radius:10px !important;
    overflow:visible !important; /* don't clip icons */
  }
  html body main .why-block .feature::before,
  html body main section.why-block .feature::before{
    width:3px !important; /* thinner accent so it doesn't eat icon space */
  }
  html body main .why-block .feature img,
  html body main section.why-block .feature img{
    width:22px !important;
    height:22px !important;
    max-width:22px !important;
    max-height:22px !important;
    margin:0 0 6px 10px !important; /* clear the left accent bar */
    padding:1px !important;
    object-fit:contain !important;
    object-position:center !important;
    filter:none !important;
    display:block !important;
    flex:0 0 auto !important;
    overflow:visible !important;
    box-sizing:content-box !important;
  }
  html body main .why-block .feature,
  html body main section.why-block .feature{
    padding:10px 10px 10px 8px !important;
    overflow:visible !important;
  }
  html body main .why-block .feature::before,
  html body main section.why-block .feature::before{
    width:3px !important;
    z-index:0 !important;
  }
  html body main .why-block .feature h3,
  html body main section.why-block .feature h3{
    font-family:Oswald, "Bebas Neue", sans-serif !important;
    font-size:11px !important;
    line-height:1.2 !important;
    letter-spacing:0.04em !important;
    text-transform:uppercase !important;
    margin:0 0 3px 4px !important;
    font-weight:600 !important;
  }
  html body main .why-block .feature p,
  html body main section.why-block .feature p{
    font-family:Inter, system-ui, sans-serif !important;
    font-size:12px !important;
    line-height:1.35 !important;
    margin:0 0 0 4px !important;
  }
}

@media (min-width:721px){
  html body main .why-block .feature img[src$=".svg"],
  html body .feature img[src$=".svg"]{
    filter:none !important;
    height:36px !important;
    width:36px !important;
    margin-left:4px !important;
  }
}

/* ===== v39 forms ===== */
html body .site-form{
  display:grid; gap:0.85rem; max-width:560px; margin:0;
}
html body .site-form .form-row{display:grid; gap:0.35rem}
html body .site-form .form-row.two{
  grid-template-columns:1fr 1fr; gap:0.75rem;
}
@media (max-width:560px){
  html body .site-form .form-row.two{grid-template-columns:1fr}
}
html body .site-form label{
  font-family:Inter,system-ui,sans-serif; font-size:0.85rem; font-weight:600; color:inherit;
}
html body .site-form label .req{color:#ff6b6b; margin-left:0.15rem}
html body .site-form input[type="text"],
html body .site-form input[type="email"],
html body .site-form input[type="tel"],
html body .site-form input[type="file"],
html body .site-form input[type="search"],
html body .site-form select,
html body .site-form textarea{
  width:100%; box-sizing:border-box; border-radius:10px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(0,0,0,.25); color:#fff;
  padding:0.7rem 0.85rem; font:inherit; font-size:0.95rem;
}
html body .section-cream .site-form input,
html body .section-cream .site-form select,
html body .section-cream .site-form textarea{
  background:#fff; color:#111; border-color:rgba(15,23,48,.18);
}
html body .site-form textarea{min-height:140px; resize:vertical}
html body .site-form .form-note{font-size:0.8rem; opacity:.8; margin:0}
html body .site-form .hp{position:absolute; left:-10000px; top:auto; width:1px; height:1px; overflow:hidden}
html body .site-form .btn{justify-self:start; margin-top:0.25rem}
html body .contact-layout{
  display:grid; gap:1.5rem; grid-template-columns:1.2fr 0.8fr; align-items:start;
}
@media (max-width:800px){
  html body .contact-layout{grid-template-columns:1fr}
}
html body .contact-aside h2{margin:0 0 0.5rem; font-size:1.1rem}
html body .contact-aside p{margin:0 0 0.75rem; line-height:1.45}
html body .search-results{display:grid; gap:0.65rem; margin-top:1rem}
html body .search-result{
  display:flex; justify-content:space-between; gap:1rem; align-items:center;
  padding:0.75rem 0.9rem; border-radius:10px;
  border:1px solid rgba(255,255,255,.12); background:rgba(0,0,0,.2);
  text-decoration:none; color:inherit;
}
html body .search-result:hover{border-color:rgba(255,255,255,.28)}
html body .search-result .price{font-weight:700; white-space:nowrap}
html body .shopify-flag{
  border:1px solid rgba(255,214,90,.35); background:rgba(255,214,90,.08);
  border-radius:10px; padding:0.85rem 1rem; margin:0 0 1rem;
}

/* ===== v40: phone partner tiles 6-col compact (~52x34, 4px gap) ===== */

/* ===== v41: compact Why cards + partner logos on cream (no tiles) ===== */
@media (max-width:720px){
  /* Why / Built for game day — much tighter 2x2 */
  html body main .why-block .features,
  html body main section.why-block .features{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:8px !important;
    margin:0.4rem 0 0 !important;
    align-items:start !important;
  }
  html body main .why-block .feature,
  html body main section.why-block .feature{
    display:grid !important;
    grid-template-columns:16px 1fr !important;
    grid-template-rows:auto auto !important;
    column-gap:6px !important;
    row-gap:3px !important;
    align-items:center !important;
    box-sizing:border-box !important;
    min-height:0 !important;
    height:auto !important;
    padding:8px 8px 8px 10px !important;
    border-radius:8px !important;
    overflow:visible !important;
  }
  html body main .why-block .feature::before,
  html body main section.why-block .feature::before{
    width:3px !important;
    z-index:0 !important;
  }
  html body main .why-block .feature img,
  html body main section.why-block .feature img{
    grid-column:1 !important;
    grid-row:1 !important;
    width:16px !important;
    height:16px !important;
    max-width:16px !important;
    max-height:16px !important;
    margin:0 !important;
    padding:0 !important;
    object-fit:contain !important;
    filter:none !important;
    display:block !important;
  }
  html body main .why-block .feature h3,
  html body main section.why-block .feature h3{
    grid-column:2 !important;
    grid-row:1 !important;
    font-family:Oswald, "Bebas Neue", sans-serif !important;
    font-size:10px !important;
    line-height:1.15 !important;
    letter-spacing:0.04em !important;
    text-transform:uppercase !important;
    margin:0 !important;
    font-weight:600 !important;
    align-self:center !important;
  }
  html body main .why-block .feature p,
  html body main section.why-block .feature p{
    grid-column:1 / -1 !important;
    grid-row:2 !important;
    font-family:Inter, system-ui, sans-serif !important;
    font-size:10.5px !important;
    line-height:1.35 !important;
    margin:0 !important;
  }
  /* Slightly less chrome padding on Why navy box */
  html body main > section.why-block > .container,
  html body main section.why-block > .container{
    padding:0.85rem 0.85rem 0.9rem !important;
  }
}

/* ===== v42: compact Find Your Colours box (phone) ===== */
@media (max-width:720px){
  /* Drop duplicate mint eyebrow; keep the white heading only */
  html body main .fyc-block .eyebrow,
  html body main section.fyc-block .eyebrow{
    display:none !important;
  }
  html body main .fyc-block h2,
  html body main section.fyc-block h2{
    margin:0 0 0.25rem !important;
    font-size:0.95rem !important;
    line-height:1.15 !important;
  }
  html body main .fyc-block .lead,
  html body main section.fyc-block .lead{
    margin:0 auto 0.3rem !important;
    max-width:100% !important;
    font-size:0.78rem !important;
    line-height:1.3 !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }
  /* Tighter navy box chrome */
  html body main > section.fyc-block > .container,
  html body main section.fyc-block > .container,
  html body main .fyc-block > .container{
    padding:0.55rem 0.65rem 0.6rem !important;
  }
  /* Search ~40px tall */
  html body main .fyc-block .fyc-search,
  html body main section.fyc-block .fyc-search{
    display:flex !important;
    gap:0.35rem !important;
    margin:0 auto 0.35rem !important;
    width:100% !important;
    max-width:100% !important;
    align-items:stretch !important;
  }
  html body main .fyc-block .fyc-search input,
  html body main section.fyc-block .fyc-search input{
    height:40px !important;
    min-height:40px !important;
    max-height:40px !important;
    padding:0 0.75rem !important;
    font-size:0.82rem !important;
    border-radius:999px !important;
    box-sizing:border-box !important;
  }
  html body main .fyc-block .fyc-search button,
  html body main section.fyc-block .fyc-search button{
    height:40px !important;
    min-height:40px !important;
    max-height:40px !important;
    padding:0 0.9rem !important;
    font-size:0.72rem !important;
    letter-spacing:0.04em !important;
    border-radius:999px !important;
    box-sizing:border-box !important;
    white-space:nowrap !important;
  }
  /* League tiles ~half height; keep 6 in one row */
  html body main .fyc-block .home-shop-grid--logos,
  html body main section.fyc-block .home-shop-grid--logos{
    grid-template-columns:repeat(6, minmax(0, 1fr)) !important;
    gap:0.18rem !important;
    margin-top:0.2rem !important;
    margin-bottom:0 !important;
  }
  html body main .fyc-block .home-shop-tile--logo,
  html body main section.fyc-block .home-shop-tile--logo{
    border-radius:7px !important;
  }
  html body main .fyc-block .home-shop-mark,
  html body main section.fyc-block .home-shop-mark{
    height:40px !important; /* ~half of 92px */
    padding:0.12rem !important;
  }
  html body main .fyc-block .home-shop-mark img,
  html body main section.fyc-block .home-shop-mark img{
    width:90% !important;
    height:90% !important;
    max-width:36px !important;
    max-height:36px !important;
  }
  html body main .fyc-block .home-shop-tile--logo .home-shop-body,
  html body main section.fyc-block .home-shop-tile--logo .home-shop-body{
    padding:0.18rem 0.12rem 0.2rem !important;
    gap:0 !important;
  }
  html body main .fyc-block .home-shop-tile--logo .home-shop-body h3,
  html body main section.fyc-block .home-shop-tile--logo .home-shop-body h3{
    font-size:0.42rem !important;
    letter-spacing:0.02em !important;
    line-height:1.1 !important;
  }
  html body main .fyc-block .home-shop-tile--logo .home-shop-label,
  html body main section.fyc-block .home-shop-tile--logo .home-shop-label{
    font-size:0.34rem !important;
    line-height:1.1 !important;
  }
}

/* ===== v43: Party Packs in navy feature box; level View Pack buttons ===== */

/* Level View Pack buttons when titles wrap unevenly */
html body main .party-packs-block .party-grid,
html body .party-packs-block .party-grid{
  align-items:stretch !important;
}
html body main .party-packs-block .party-card,
html body .party-packs-block .party-card{
  display:flex !important;
  flex-direction:column !important;
  height:100% !important;
}
html body main .party-packs-block .party-card .body,
html body .party-packs-block .party-card .body{
  display:flex !important;
  flex-direction:column !important;
  flex:1 1 auto !important;
  gap:0.35rem !important;
}
html body main .party-packs-block .party-card .body h3,
html body .party-packs-block .party-card .body h3{
  min-height:2.4em !important; /* room for 2 lines so titles align */
  line-height:1.2 !important;
  margin:0 !important;
}
html body main .party-packs-block .party-card .body .price,
html body .party-packs-block .party-card .body .price{
  margin:0 !important;
}
html body main .party-packs-block .party-card .body .btn,
html body .party-packs-block .party-card .body a.btn{
  margin-top:auto !important;
  align-self:flex-start !important;
}

/* Desktop: navy rounded bordered box like FYC/Why */
@media (min-width:721px){
  html body main > section.party-packs-block,
  html body main section.party-packs-block{
    padding-top:0 !important;
    padding-bottom:0 !important;
    margin:0 !important;
    background:transparent !important;
  }
  html body main > section.party-packs-block > .container,
  html body main section.party-packs-block > .container{
    box-sizing:border-box !important;
    max-width:920px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding:1.6rem 1.4rem 1.5rem !important;
    background:linear-gradient(180deg,#151f3d,#0d1430) !important;
    border:1px solid rgba(255,255,255,.14) !important;
    border-radius:var(--radius,16px) !important;
    box-shadow:0 18px 50px rgba(0,0,0,.35) !important;
    text-align:center !important;
  }
  html body main .party-packs-block .eyebrow{color:var(--mint,#7dffb3) !important}
  html body main .party-packs-block h2{color:#fff !important; margin:0 0 0.35rem !important}
  html body main .party-packs-block .lead{
    color:rgba(255,255,255,.88) !important;
    margin:0 auto 0.85rem !important;
    max-width:40rem !important;
  }
  html body main .party-packs-block .party-grid{
    margin:0.85rem auto 0 !important;
    max-width:720px !important;
    width:100% !important;
    gap:1rem !important;
  }
}

/* Phone: same navy box; keep 21px flex gap on section shell */
@media (max-width:720px){
  html body main > section.party-packs-block,
  html body main section.party-packs-block{
    padding:0 !important;
    margin:0 !important;
    background:transparent !important;
  }
  html body main > section.party-packs-block > .container,
  html body main section.party-packs-block > .container{
    box-sizing:border-box !important;
    width:auto !important;
    max-width:100% !important;
    margin-left:12px !important;
    margin-right:12px !important;
    margin-top:0 !important;
    margin-bottom:0 !important;
    padding:0.85rem 0.85rem 0.95rem !important;
    background:linear-gradient(180deg,#151f3d,#0d1430) !important;
    border:1px solid rgba(255,255,255,.14) !important;
    border-radius:14px !important;
    box-shadow:0 18px 50px rgba(0,0,0,.35) !important;
    text-align:center !important;
  }
  html body main .party-packs-block .eyebrow{color:var(--mint,#7dffb3) !important; margin:0 0 0.2rem !important}
  html body main .party-packs-block h2{color:#fff !important; margin:0 0 0.3rem !important}
  html body main .party-packs-block .lead{
    color:rgba(255,255,255,.88) !important;
    margin:0 auto 0.55rem !important;
    font-size:0.82rem !important;
    line-height:1.35 !important;
  }
  html body main .party-packs-block .party-grid{
    margin:0.55rem 0 0 !important;
    gap:0.65rem !important;
    width:100% !important;
  }
  html body main .party-packs-block .party-card .body h3{
    min-height:2.6em !important;
    font-size:0.78rem !important;
  }
}

/* ===== v44: desktop home balance — shared navy feature boxes ===== */
@media (min-width:721px){
  /* Shared feature-box tokens */
  html body main{
    gap:28px !important;
    row-gap:28px !important;
  }

  /* --- Find Your Colours: same navy box as Why / Party Packs --- */
  html body main > section.fyc-block,
  html body main section.fyc-block{
    padding:0 !important;
    margin:0 !important;
    background:transparent !important;
  }
  html body main > section.fyc-block > .container,
  html body main section.fyc-block > .container{
    box-sizing:border-box !important;
    width:100% !important;
    max-width:920px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding:1.6rem 1.4rem 1.5rem !important;
    background:linear-gradient(180deg,#151f3d,#0d1430) !important;
    border:1px solid rgba(255,255,255,.14) !important;
    border-radius:var(--radius,16px) !important;
    box-shadow:0 18px 50px rgba(0,0,0,.35) !important;
    text-align:center !important;
  }
  /* No duplicate eyebrow+heading */
  html body main .fyc-block .eyebrow{
    display:none !important;
  }
  html body main .fyc-block h2{
    color:#fff !important;
    margin:0 0 0.35rem !important;
    font-size:1.65rem !important;
    line-height:1.15 !important;
  }
  html body main .fyc-block .lead{
    color:rgba(255,255,255,.88) !important;
    margin:0 auto 0.75rem !important;
    max-width:34rem !important;
    font-size:0.95rem !important;
  }
  html body main .fyc-block .fyc-search{
    margin:0 auto 0.85rem !important;
    max-width:420px !important;
  }
  html body main .fyc-block .home-shop-grid--logos{
    margin:0 auto !important;
    max-width:100% !important;
  }
  /* Tone league tiles so FYC box is not oversized vs neighbours */
  html body main .fyc-block .home-shop-mark{
    height:88px !important;
    padding:0.35rem !important;
  }
  html body main .fyc-block .home-shop-mark img{
    max-width:78px !important;
    max-height:78px !important;
  }

  /* --- Bulk Savings: wrap in same navy box --- */
  html body main > section.bulk-block,
  html body main section.bulk-block{
    padding:0 !important;
    margin:0 !important;
    background:transparent !important;
  }
  html body main > section.bulk-block > .container,
  html body main section.bulk-block > .container{
    box-sizing:border-box !important;
    width:100% !important;
    max-width:920px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding:1.6rem 1.4rem 1.5rem !important;
    background:linear-gradient(180deg,#151f3d,#0d1430) !important;
    border:1px solid rgba(255,255,255,.14) !important;
    border-radius:var(--radius,16px) !important;
    box-shadow:0 18px 50px rgba(0,0,0,.35) !important;
    text-align:center !important;
  }
  html body main .bulk-block .eyebrow{
    color:var(--mint,#7dffb3) !important;
    margin:0 0 0.55rem !important;
  }
  html body main .bulk-block .savings-navy{
    margin:0 !important;
    max-width:100% !important;
    border-radius:12px !important;
    overflow:hidden !important;
  }
  html body main .bulk-block .savings-navy .fans{
    min-height:140px !important;
  }
  html body main .bulk-block .savings-navy h2{
    color:#fff !important;
    font-size:1.65rem !important;
    line-height:1.15 !important;
    margin:0 0 0.35rem !important;
  }

  /* --- Why / Party Packs: lock shared heading scale --- */
  html body main .why-block h2,
  html body main .party-packs-block h2,
  html body main .story-collage-text h2,
  html body main .section-cream.angled h2{
    font-size:1.65rem !important;
    line-height:1.15 !important;
    margin:0 0 0.35rem !important;
  }
  html body main .why-block .eyebrow,
  html body main .party-packs-block .eyebrow,
  html body main .story-collage-text .eyebrow,
  html body main .section-cream.angled .eyebrow,
  html body main .bulk-block .eyebrow{
    font-size:0.72rem !important;
    letter-spacing:0.08em !important;
  }
  html body main .why-block > .container,
  html body main .party-packs-block > .container{
    max-width:920px !important;
    padding:1.6rem 1.4rem 1.5rem !important;
  }

  /* --- About text card: already boxed; keep 920 --- */
  html body main .story-collage .story-collage-text{
    max-width:920px !important;
    padding:1.6rem 1.4rem 1.5rem !important;
  }
  html body main > section.story-collage{
    padding:0 !important;
    margin:0 !important;
  }

  /* --- Ready CTA: navy box on cream --- */
  html body main > section.section-cream.angled,
  html body main section.section-cream.angled{
    padding:0 !important;
    margin:0 !important;
    background:var(--cream,#f3f0e5) !important;
  }
  html body main > section.section-cream.angled > .container,
  html body main section.section-cream.angled > .container{
    box-sizing:border-box !important;
    width:100% !important;
    max-width:920px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding:1.6rem 1.4rem 1.5rem !important;
    background:linear-gradient(180deg,#151f3d,#0d1430) !important;
    border:1px solid rgba(255,255,255,.14) !important;
    border-radius:var(--radius,16px) !important;
    box-shadow:0 18px 50px rgba(0,0,0,.35) !important;
    text-align:center !important;
  }
  html body main .section-cream.angled .eyebrow{color:var(--mint,#7dffb3) !important}
  html body main .section-cream.angled h2{color:#fff !important}
  html body main .section-cream.angled .lead{color:rgba(255,255,255,.88) !important; margin:0 auto 0.75rem !important}

  /* --- Partners (beige): keep cream; align content width to 920 --- */
  html body main > section.brands-band,
  html body main section.brands-band{
    padding:0 !important;
    margin:0 !important;
    background:var(--cream,#f3f0e5) !important;
  }
  html body main > section.brands-band > .container,
  html body main section.brands-band > .container{
    box-sizing:border-box !important;
    max-width:920px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding:1.2rem 0.5rem 1.1rem !important;
    background:transparent !important;
    border:none !important;
    box-shadow:none !important;
  }
  html body main .brands-band h2{
    font-size:1.65rem !important;
    line-height:1.15 !important;
    margin:0 0 0.45rem !important;
    color:var(--ink,#0b1022) !important;
  }
  html body main .brands-band .eyebrow{
    color:var(--brand,#002b66) !important;
    font-size:0.72rem !important;
  }

  /* Why feature cards: keep level, comfortable desktop density */
  html body main .why-block .features{
    display:grid !important;
    grid-template-columns:repeat(4, minmax(0,1fr)) !important;
    gap:0.75rem !important;
    margin-top:0.85rem !important;
    align-items:stretch !important;
  }
  html body main .why-block .feature{
    display:flex !important;
    flex-direction:column !important;
    height:100% !important;
    padding:0.9rem 0.85rem !important;
    text-align:left !important;
  }
  html body main .why-block .feature img{
    width:28px !important;
    height:28px !important;
    margin:0 0 0.45rem 2px !important;
  }
  html body main .why-block .feature h3{
    font-size:0.85rem !important;
    margin:0 0 0.25rem !important;
  }
  html body main .why-block .feature p{
    font-size:0.8rem !important;
    line-height:1.35 !important;
    margin:0 !important;
  }
}

/* ===== v45: photo strip navy box; partners grid on beige; Ready on dark ===== */

/* --- Desktop: 5-photo strip in shared navy feature box --- */
@media (min-width:721px){
  html body main > section.story-collage,
  html body main section.story-collage{
    padding:0 !important;
    margin:0 !important;
    background:transparent !important;
  }
  html body main .story-collage .story-collage-inner,
  html body main .story-collage .container.story-collage-inner{
    max-width:100% !important;
    width:100% !important;
    margin:0 auto !important;
    padding:0 !important;
  }
  /* Wrapper stays transparent; two stacked navy boxes with 28px gap */
  html body main .story-collage .story-collage-copy{
    width:100% !important;
    max-width:none !important;
    margin:0 auto !important;
    padding:0 !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    border-radius:0 !important;
    gap:28px !important;
    row-gap:28px !important;
    align-items:center !important;
    display:flex !important;
    flex-direction:column !important;
  }
  /* Photo strip = shared navy feature box */
  html body main .story-collage .collage-frame.fans-5panel,
  html body .story-collage .collage-frame.fans-5panel{
    box-sizing:border-box !important;
    width:100% !important;
    max-width:920px !important;
    margin:0 auto !important;
    padding:1.6rem 1.4rem 1.5rem !important;
    background:linear-gradient(180deg,#151f3d,#0d1430) !important;
    border:1px solid rgba(255,255,255,.14) !important;
    border-radius:var(--radius,16px) !important;
    box-shadow:0 18px 50px rgba(0,0,0,.35) !important;
    overflow:hidden !important;
  }
  html body main .story-collage .fans-panel-grid,
  html body .story-collage .fans-panel-grid{
    display:grid !important;
    grid-template-columns:repeat(5, minmax(0, 1fr)) !important;
    gap:8px !important;
    padding:0 !important;
    margin:0 !important;
    width:100% !important;
    background:transparent !important;
    border-radius:0 !important;
  }
  html body main .story-collage .fans-panel-grid img,
  html body .story-collage .fans-panel-grid img{
    border-radius:10px !important;
    display:block !important;
    width:100% !important;
    height:auto !important;
    object-fit:cover !important;
  }
  /* About text card keeps shared navy chrome */
  html body main .story-collage .story-collage-text{
    width:100% !important;
    max-width:920px !important;
    margin:0 auto !important;
    box-sizing:border-box !important;
    padding:1.6rem 1.4rem 1.5rem !important;
    background:linear-gradient(180deg,#151f3d,#0d1430) !important;
    border:1px solid rgba(255,255,255,.14) !important;
    border-radius:var(--radius,16px) !important;
    box-shadow:0 18px 50px rgba(0,0,0,.35) !important;
  }

  /* --- Partners: individual logos on beige (like phone), hide broken sprite --- */
  html body main section.brands-band picture.brands-wall-sprite,
  html body main section.brands-band .brands-wall-sprite,
  html body main section.brands-band .brands-wall picture.brands-wall-sprite,
  html body main section.brands-band .brands-wall picture.brands-wall-sprite img{
    display:none !important;
    height:0 !important;
    width:0 !important;
    max-height:0 !important;
    overflow:hidden !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
  }
  html body main section.brands-band ul.brands-grid,
  html body main section.brands-band .brands-grid{
    display:grid !important;
    list-style:none !important;
    margin:0.45rem auto 0 !important;
    padding:0 !important;
    width:100% !important;
    max-width:920px !important;
    box-sizing:border-box !important;
    grid-template-columns:repeat(9, minmax(0, 1fr)) !important; /* 9x2 for 18 logos */
    gap:10px 12px !important;
    align-items:center !important;
    justify-items:center !important;
  }
  html body main section.brands-band .brands-grid .brands-tile,
  html body main section.brands-band li.brands-tile{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    box-sizing:border-box !important;
    margin:0 !important;
    padding:4px !important;
    width:100% !important;
    min-width:0 !important;
    height:52px !important;
    max-height:52px !important;
    background:transparent !important;
    border:none !important;
    border-radius:0 !important;
    box-shadow:none !important;
    overflow:hidden !important;
  }
  html body main section.brands-band .brands-tile img,
  html body main section.brands-band .brands-grid img{
    display:block !important;
    width:auto !important;
    height:100% !important;
    max-width:100% !important;
    max-height:44px !important;
    object-fit:contain !important;
    object-position:center !important;
    margin:0 auto !important;
    opacity:1 !important;
    visibility:visible !important;
    filter:none !important;
  }
  html body main > section.brands-band,
  html body main section.brands-band{
    padding:0 !important;
    margin:0 !important;
    background:var(--cream,#f3f0e5) !important;
  }
  html body main > section.brands-band > .container,
  html body main section.brands-band > .container{
    box-sizing:border-box !important;
    max-width:920px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding:1.2rem 0.5rem 1.15rem !important;
    background:transparent !important;
    border:none !important;
    box-shadow:none !important;
  }

  /* --- Ready CTA: navy box on dark page bg (no beige band) --- */
  html body main > section.section-cream.angled,
  html body main section.section-cream.angled{
    padding:0 !important;
    margin:0 !important;
    background:transparent !important; /* dark page shell shows through */
  }
  html body main > section.section-cream.angled > .container,
  html body main section.section-cream.angled > .container{
    box-sizing:border-box !important;
    width:100% !important;
    max-width:920px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding:1.6rem 1.4rem 1.5rem !important;
    background:linear-gradient(180deg,#151f3d,#0d1430) !important;
    border:1px solid rgba(255,255,255,.14) !important;
    border-radius:var(--radius,16px) !important;
    box-shadow:0 18px 50px rgba(0,0,0,.35) !important;
    text-align:center !important;
  }
  html body main .section-cream.angled .eyebrow{color:var(--mint,#7dffb3) !important}
  html body main .section-cream.angled h2{color:#fff !important; font-size:1.65rem !important; line-height:1.15 !important}
  html body main .section-cream.angled .lead{color:rgba(255,255,255,.88) !important; margin:0 auto 0.75rem !important}
}

/* --- Phone: photo strip in navy box (same chrome as story card); keep approved layouts --- */
@media (max-width:720px){
  html body main .story-collage .story-collage-copy{
    /* already navy feature card on phone; keep approved pad/radius */
    gap:0.75rem !important;
  }
  html body main .story-collage .collage-frame.fans-5panel,
  html body .story-collage .collage-frame.fans-5panel{
    padding:0 !important;
    margin:0 !important;
    width:100% !important;
    max-width:100% !important;
    background:transparent !important; /* sits inside navy story-collage-copy */
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    overflow:hidden !important;
  }
  html body main .story-collage .fans-panel-grid,
  html body .story-collage .fans-panel-grid{
    gap:4px !important;
    background:transparent !important;
    padding:0 !important;
  }
  html body main .story-collage .fans-panel-grid img,
  html body .story-collage .fans-panel-grid img,
  html body .story-collage-copy .fans-panel-grid img,
  html body main .story-collage .fans-panel-grid img:first-child,
  html body main .story-collage .fans-panel-grid img:last-child,
  html body .story-collage .fans-panel-grid img:first-child,
  html body .story-collage .fans-panel-grid img:last-child{
    border-radius:6px !important;
  }
  /* Ready: no beige band on phone either — match navy-on-dark */
  html body main > section.section-cream.angled,
  html body main section.section-cream.angled{
    padding:0 !important;
    margin:0 !important;
    background:transparent !important;
  }
  html body main > section.section-cream.angled > .container,
  html body main section.section-cream.angled > .container{
    box-sizing:border-box !important;
    width:auto !important;
    max-width:100% !important;
    margin-left:12px !important;
    margin-right:12px !important;
    padding:1.15rem 1rem 1.2rem !important;
    background:linear-gradient(180deg,#151f3d,#0d1430) !important;
    border:1px solid rgba(255,255,255,.14) !important;
    border-radius:14px !important;
    box-shadow:0 18px 50px rgba(0,0,0,.35) !important;
    text-align:center !important;
  }
  html body main .section-cream.angled .eyebrow{color:var(--mint,#7dffb3) !important}
  html body main .section-cream.angled h2{color:#fff !important}
  html body main .section-cream.angled .lead{color:rgba(255,255,255,.88) !important}
}

/* ===== v46: phone About above FYC (match desktop); kill photo white bars ===== */
@media (max-width:720px){
  /* Desktop-matching home order: hero → marquee → About/story → FYC → Bulk → Why → rest */
  html body main#main > .hero-video,
  html body main#main > .hero-image,
  main#main > .hero-video,
  main#main > .hero-image{order:10 !important}
  html body main#main > .marquee,
  main#main > .marquee{order:20 !important}
  html body main#main > .story-collage,
  main#main > .story-collage{order:25 !important} /* above FYC */
  html body main#main > .fyc-block,
  main#main > .fyc-block{order:30 !important}
  html body main#main > .bulk-block,
  main#main > .bulk-block{order:32 !important}
  html body main#main > .why-block,
  main#main > .why-block{order:35 !important}
  html body main#main > .party-packs-block,
  html body main#main > .brands-band,
  html body main#main > .section-cream.angled,
  main#main > .fyc-block ~ section{order:50 !important}
  /* story itself must win over the ~section rule */
  html body main#main > .story-collage{order:25 !important}

  html body main#main{
    gap:21px !important;
    row-gap:21px !important;
  }

  /* Photo strip: navy only — no white frame/bars */
  html body main .story-collage .collage-frame.fans-5panel,
  html body .story-collage .collage-frame.fans-5panel,
  html body .story-collage-copy .collage-frame.fans-5panel{
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    padding:0 !important;
    margin:0 !important;
  }
  html body main .story-collage .fans-panel-grid,
  html body .story-collage .fans-panel-grid,
  html body .story-collage-copy .fans-panel-grid{
    background:transparent !important;
    gap:4px !important;
    padding:0 !important;
  }
  html body main .story-collage .fans-panel-grid img,
  html body .story-collage .fans-panel-grid img,
  html body .story-collage-copy .fans-panel-grid img,
  html body main .story-collage .fans-panel-grid img:first-child,
  html body main .story-collage .fans-panel-grid img:last-child,
  html body .story-collage .fans-panel-grid img:first-child,
  html body .story-collage .fans-panel-grid img:last-child{
    border-radius:6px !important;
    background:transparent !important;
    object-fit:cover !important;
    object-position:center center !important;
    /* cover any residual fringe inside the cell */
    transform:none !important;
  }
}

/* ===== v47: Bulk Savings overall size matches FYC (phone + desktop) ===== */

/* --- Desktop: shrink whole Bulk navy box toward FYC proportion --- */
@media (min-width:721px){
  html body main > section.bulk-block,
  html body main section.bulk-block{
    padding:0 !important;
    margin:0 !important;
    background:transparent !important;
  }
  /* Same outer chrome as FYC */
  html body main > section.bulk-block > .container,
  html body main section.bulk-block > .container{
    box-sizing:border-box !important;
    width:100% !important;
    max-width:920px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding:1.35rem 1.25rem 1.25rem !important; /* closer to FYC pad while content stays compact */
    background:linear-gradient(180deg,#151f3d,#0d1430) !important;
    border:1px solid rgba(255,255,255,.14) !important;
    border-radius:var(--radius,16px) !important;
    box-shadow:0 18px 50px rgba(0,0,0,.35) !important;
    text-align:center !important;
  }
  /* Match FYC: no duplicate eyebrow */
  html body main .bulk-block .eyebrow{
    display:none !important;
  }
  /* Inner savings card: flush, no double-chrome */
  html body main .bulk-block .savings-navy{
    margin:0 !important;
    max-width:100% !important;
    border:0 !important;
    border-radius:12px !important;
    box-shadow:none !important;
    overflow:hidden !important;
    background:transparent !important;
  }
  html body main .bulk-block .savings-navy .fans{
    min-height:112px !important;
    max-height:120px !important;
  }
  html body main .bulk-block .savings-navy .fans-inner{
    padding:0.85rem 0.9rem 0.45rem !important;
  }
  html body main .bulk-block .savings-navy h2{
    color:#fff !important;
    font-size:1.65rem !important; /* match FYC */
    line-height:1.15 !important;
    margin:0 0 0.2rem !important;
  }
  html body main .bulk-block .savings-navy .sub{
    margin:0.2rem auto 0 !important;
    max-width:34rem !important;
    font-size:0.88rem !important;
    line-height:1.3 !important;
  }
  html body main .bulk-block .savings-navy .band{
    padding:0.55rem 0.7rem 0.6rem !important;
    background:transparent !important;
  }
  html body main .bulk-block .savings-navy .tiles{
    gap:0.4rem !important;
    margin:0 0 0.55rem !important;
  }
  html body main .bulk-block .savings-navy .tile{
    padding:0.48rem 0.28rem !important;
    border-radius:8px !important;
    border-width:1px !important;
  }
  html body main .bulk-block .savings-navy .qty{
    font-size:1.1rem !important;
    line-height:1 !important;
  }
  html body main .bulk-block .savings-navy .pct{
    font-size:0.78rem !important;
    margin-top:0.12rem !important;
  }
  html body main .bulk-block .savings-navy .lbl{
    font-size:0.6rem !important;
    margin-top:0.05rem !important;
  }
  html body main .bulk-block .savings-navy .btn-pill{
    padding:0.4rem 0.9rem !important;
    font-size:0.78rem !important;
  }
}

/* --- Phone: Bulk outer navy box matches FYC size/proportion --- */
@media (max-width:720px){
  html body main > section.bulk-block,
  html body main section.bulk-block{
    padding:0 !important;
    margin:0 !important;
    background:transparent !important;
  }
  /* Same inset navy chrome as FYC container */
  html body main > section.bulk-block > .container,
  html body main section.bulk-block > .container,
  html body main .bulk-block > .container{
    box-sizing:border-box !important;
    width:auto !important;
    max-width:100% !important;
    margin-left:12px !important;
    margin-right:12px !important;
    padding:0.55rem 0.65rem 0.6rem !important; /* match compact FYC pad */
    background:linear-gradient(180deg,#151f3d,#0d1430) !important;
    border:1px solid rgba(255,255,255,.14) !important;
    border-radius:14px !important;
    box-shadow:0 18px 50px rgba(0,0,0,.35) !important;
    text-align:center !important;
  }
  html body main .bulk-block .eyebrow{
    display:none !important;
  }
  html body main .bulk-block .savings-navy{
    margin:0 !important;
    max-width:100% !important;
    border:0 !important;
    border-radius:10px !important;
    box-shadow:none !important;
    overflow:hidden !important;
    background:transparent !important;
  }
  html body main .bulk-block .savings-navy .fans{
    min-height:52px !important;
    max-height:58px !important;
  }
  html body main .bulk-block .savings-navy .fans-inner{
    padding:0.4rem 0.45rem 0.25rem !important;
  }
  html body main .bulk-block .savings-navy h2{
    font-size:13px !important; /* match phone FYC h2 */
    line-height:1.15 !important;
    margin:0 !important;
  }
  html body main .bulk-block .savings-navy .sub{
    font-size:11px !important;
    line-height:1.25 !important;
    margin:0.15rem auto 0 !important;
    max-width:100% !important;
  }
  html body main .bulk-block .savings-navy .band{
    padding:0.35rem 0.25rem 0.35rem !important;
    background:transparent !important;
  }
  html body main .bulk-block .savings-navy .tiles{
    display:grid !important;
    grid-template-columns:repeat(4, minmax(0,1fr)) !important;
    gap:3px !important;
    margin:0 0 0.35rem !important;
  }
  html body main .bulk-block .savings-navy .tile{
    padding:0.28rem 0.1rem !important;
    border-radius:6px !important;
    border-width:1px !important;
  }
  html body main .bulk-block .savings-navy .qty{font-size:0.85rem !important; line-height:1 !important}
  html body main .bulk-block .savings-navy .pct{font-size:0.58rem !important; margin-top:0.08rem !important}
  html body main .bulk-block .savings-navy .lbl{font-size:0.45rem !important; margin-top:0 !important}
  html body main .bulk-block .savings-navy .btn-pill{
    padding:0.28rem 0.6rem !important;
    font-size:0.62rem !important;
  }
}

/* ===== v48: footer payment badges (all methods, colour) ===== */
html body .footer-meta{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:0.75rem 1rem !important;
}
html body ul.footer-pay{
  list-style:none !important;
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:6px !important;
  margin:0 !important;
  padding:0 !important;
}
html body ul.footer-pay li{
  margin:0 !important;
  padding:0 !important;
  line-height:0 !important;
}
html body ul.footer-pay img{
  display:block !important;
  height:24px !important;
  width:auto !important;
  filter:none !important;
  opacity:1 !important;
}
@media (max-width:720px){
  html body .footer-meta{
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:0.65rem !important;
  }
  html body ul.footer-pay{
    justify-content:flex-start !important;
    gap:5px !important;
    max-width:100% !important;
  }
  html body ul.footer-pay img{
    height:22px !important;
  }
}

/* ===== v49: Why (Built for Game Day) before Bulk Savings — phone + desktop ===== */
/* Desktop follows DOM (already swapped in index.html). Phone flex order: */
@media (max-width:720px){
  html body main#main > section.fyc-block,
  html body main#main > .fyc-block,
  main#main > section.fyc-block,
  main#main > .fyc-block{order:30 !important}
  html body main#main > section.why-block,
  html body main > section.why-block,
  html body main#main > .why-block,
  main#main > .why-block{order:32 !important} /* after FYC, before Bulk */
  html body main#main > section.bulk-block,
  html body main > section.bulk-block,
  html body main#main > .bulk-block,
  main#main > .bulk-block{order:35 !important} /* after Why */
  html body main#main > section.party-packs-block,
  html body main#main > .party-packs-block,
  main#main > .party-packs-block{order:50 !important}
}
/* Keep even gaps */
@media (min-width:721px){
  html body main#main{gap:28px !important; row-gap:28px !important}
}
@media (max-width:720px){
  html body main#main{gap:21px !important; row-gap:21px !important}
}

/* ===== v50: photo strip + About copy = ONE navy box (phone + desktop) ===== */

/* Desktop: single shared feature box wrapping photos + text */
@media (min-width:721px){
  html body main > section.story-collage,
  html body main section.story-collage{
    padding:0 !important;
    margin:0 !important;
    background:transparent !important;
  }
  html body main .story-collage .story-collage-inner,
  html body main .story-collage .container.story-collage-inner{
    max-width:100% !important;
    width:100% !important;
    margin:0 auto !important;
    padding:0 !important;
  }
  /* ONE navy box */
  html body main .story-collage .story-collage-copy,
  html body .story-collage .story-collage-copy{
    box-sizing:border-box !important;
    width:100% !important;
    max-width:920px !important;
    margin:0 auto !important;
    padding:1.6rem 1.4rem 1.5rem !important;
    background:linear-gradient(180deg,#151f3d,#0d1430) !important;
    border:1px solid rgba(255,255,255,.14) !important;
    border-radius:var(--radius,16px) !important;
    box-shadow:0 18px 50px rgba(0,0,0,.35) !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:0.85rem !important; /* tight internal gap; no separate dark band */
    row-gap:0.85rem !important;
  }
  /* Strip: no second box chrome */
  html body main .story-collage .collage-frame.fans-5panel,
  html body .story-collage .collage-frame.fans-5panel{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    background:transparent !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    overflow:hidden !important;
  }
  html body main .story-collage .fans-panel-grid,
  html body .story-collage .fans-panel-grid{
    gap:8px !important;
    background:transparent !important;
    padding:0 !important;
    margin:0 !important;
  }
  html body main .story-collage .fans-panel-grid img,
  html body .story-collage .fans-panel-grid img{
    border-radius:10px !important;
  }
  /* Text: no second box chrome */
  html body main .story-collage .story-collage-text,
  html body .story-collage .story-collage-text{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    background:transparent !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    text-align:center !important;
  }
  html body main{gap:28px !important; row-gap:28px !important}
}

/* Phone: already one navy copy card — keep combined, no gap/band between photos and text */
@media (max-width:720px){
  html body main .story-collage .story-collage-copy,
  html body .story-collage .story-collage-copy{
    gap:0.65rem !important;
    row-gap:0.65rem !important;
  }
  html body main .story-collage .collage-frame.fans-5panel,
  html body .story-collage .collage-frame.fans-5panel,
  html body main .story-collage .story-collage-text,
  html body .story-collage .story-collage-text{
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    padding:0 !important;
    margin:0 !important;
  }
  html body main{gap:21px !important; row-gap:21px !important}
}

/* ===== v51: hero left cricketer face paint green-yellow-green ===== */

/* ===== v52: hero left cricketer thin green-yellow-green cheek lines ===== */

/* ===== v53: Graeme hero image — full frame, all five players visible ===== */
html body main > section.hero-video.hero-wide.hero-photo-only .hero-poster,
html body .hero-video.hero-wide.hero-photo-only .hero-poster{
  object-fit:contain !important;
  object-position:center center !important;
  width:100% !important;
  height:auto !important;
  max-height:none !important;
}

/* ===== v54: Rugby World Cup 2027 promo feature (high on home) ===== */
html body main > section.rwc-promo-block,
html body main section.rwc-promo-block{
  padding:0 !important;
  margin:0 !important;
  background:transparent !important;
}

/* Desktop navy feature box */
@media (min-width:721px){
  html body main > section.rwc-promo-block > .container,
  html body main section.rwc-promo-block > .container{
    box-sizing:border-box !important;
    width:100% !important;
    max-width:920px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding:1.6rem 1.4rem 1.5rem !important;
    background:linear-gradient(180deg,#151f3d,#0d1430) !important;
    border:1px solid rgba(255,255,255,.14) !important;
    border-radius:var(--radius,16px) !important;
    box-shadow:0 18px 50px rgba(0,0,0,.35) !important;
    text-align:center !important;
  }
  html body main .rwc-promo-block .eyebrow{
    color:var(--mint,#7dffb3) !important;
    font-size:0.72rem !important;
    letter-spacing:0.08em !important;
    margin:0 0 0.45rem !important;
  }
  html body main .rwc-promo-block h2{
    color:#fff !important;
    font-size:1.65rem !important;
    line-height:1.15 !important;
    margin:0.35rem 0 0.45rem !important;
  }
  html body main .rwc-promo-block .lead{
    color:rgba(255,255,255,.88) !important;
    margin:0 auto 0.9rem !important;
    max-width:38rem !important;
    font-size:0.95rem !important;
  }
  html body main .rwc-promo-block .rwc-promo-grid{
    display:grid !important;
    grid-template-columns:1.05fr 1fr !important;
    gap:0.85rem !important;
    align-items:stretch !important;
    margin:0 auto 0.85rem !important;
  }
  html body main{gap:28px !important; row-gap:28px !important}
}

/* Phone: compact navy inset box */
@media (max-width:720px){
  html body main > section.rwc-promo-block > .container,
  html body main section.rwc-promo-block > .container{
    box-sizing:border-box !important;
    width:auto !important;
    max-width:100% !important;
    margin-left:12px !important;
    margin-right:12px !important;
    padding:0.85rem 0.75rem 0.9rem !important;
    background:linear-gradient(180deg,#151f3d,#0d1430) !important;
    border:1px solid rgba(255,255,255,.14) !important;
    border-radius:14px !important;
    box-shadow:0 18px 50px rgba(0,0,0,.35) !important;
    text-align:center !important;
  }
  html body main .rwc-promo-block .eyebrow{
    color:var(--mint,#7dffb3) !important;
    font-size:6.5px !important;
    letter-spacing:.14em !important;
    margin:0 0 0.3rem !important;
  }
  html body main .rwc-promo-block h2{
    color:#fff !important;
    font-size:1.15rem !important;
    line-height:1.15 !important;
    margin:0.25rem 0 0.35rem !important;
  }
  html body main .rwc-promo-block .lead{
    color:rgba(255,255,255,.88) !important;
    margin:0 auto 0.55rem !important;
    font-size:0.78rem !important;
    line-height:1.3 !important;
  }
  html body main .rwc-promo-block .rwc-promo-grid{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:0.4rem !important;
    margin:0 0 0.5rem !important;
  }
  html body main .rwc-promo-block .rwc-promo-shot figcaption{
    font-size:0.55rem !important;
  }
  /* Place high: after marquee, before About/story */
  html body main#main > section.rwc-promo-block,
  main#main > .rwc-promo-block{order:22 !important}
  html body main{gap:21px !important; row-gap:21px !important}
}

/* Shared promo bits */
html body main .rwc-promo-block .rwc-badge{
  display:inline-block !important;
  margin:0 0 0.15rem !important;
  padding:0.22rem 0.65rem !important;
  border-radius:999px !important;
  background:rgba(255,199,44,.18) !important;
  border:1px solid rgba(255,199,44,.55) !important;
  color:#ffd86a !important;
  font-size:0.68rem !important;
  font-weight:700 !important;
  letter-spacing:0.06em !important;
  text-transform:uppercase !important;
}
html body main .rwc-promo-block .rwc-promo-shot{
  margin:0 !important;
  padding:0.55rem !important;
  background:rgba(255,255,255,.04) !important;
  border:1px solid rgba(255,255,255,.10) !important;
  border-radius:12px !important;
  overflow:hidden !important;
}
html body main .rwc-promo-block .rwc-promo-shot img{
  display:block !important;
  width:100% !important;
  height:auto !important;
  border-radius:8px !important;
  background:#fff !important;
}
html body main .rwc-promo-block .rwc-promo-shot figcaption{
  margin:0.4rem 0 0 !important;
  color:rgba(255,255,255,.72) !important;
  font-size:0.72rem !important;
}
html body main .rwc-promo-block .rwc-retailers{
  margin:0 !important;
}
html body main .rwc-promo-block .rwc-retailers a{
  color:#9fd4ff !important;
  text-decoration:underline !important;
  text-underline-offset:2px !important;
  font-size:0.88rem !important;
}
@media (max-width:720px){
  html body main .rwc-promo-block .rwc-badge{
    font-size:0.58rem !important;
    padding:0.15rem 0.5rem !important;
  }
  html body main .rwc-promo-block .rwc-promo-shot{
    padding:0.3rem !important;
    border-radius:8px !important;
  }
  html body main .rwc-promo-block .rwc-retailers a{
    font-size:0.72rem !important;
  }
}

/* ===== v55: RWC promo family banner (full width in navy box, no crop) ===== */
html body main .rwc-promo-block .rwc-promo-banner{
  margin:0 0 0.85rem !important;
  padding:0 !important;
  width:100% !important;
  max-width:100% !important;
  line-height:0 !important;
  overflow:hidden !important;
  border-radius:12px !important;
  background:transparent !important;
  border:0 !important;
}
html body main .rwc-promo-block .rwc-promo-banner img{
  display:block !important;
  width:100% !important;
  height:auto !important;
  max-width:100% !important;
  object-fit:contain !important;
  object-position:center center !important;
  border-radius:12px !important;
}
/* Desktop: bleed banner to top/side edges of navy box so it reads full-width */
@media (min-width:721px){
  html body main .rwc-promo-block > .container{
    /* keep shared pad, but banner cancels top/side pad */
    padding-top:0 !important;
    overflow:hidden !important; /* clip banner to box radius */
  }
  html body main .rwc-promo-block .rwc-promo-banner{
    width:calc(100% + 2.8rem) !important; /* 1.4rem * 2 */
    max-width:none !important;
    margin-left:-1.4rem !important;
    margin-right:-1.4rem !important;
    margin-top:0 !important;
    margin-bottom:1rem !important;
    border-radius:0 !important;
  }
  html body main .rwc-promo-block .rwc-promo-banner img{
    border-radius:0 !important; /* top corners come from container overflow+radius */
    width:100% !important;
    height:auto !important;
    object-fit:contain !important;
  }
  html body main .rwc-promo-block .eyebrow{
    margin-top:0.15rem !important;
  }
}
@media (max-width:720px){
  html body main .rwc-promo-block > .container{
    padding-top:0 !important;
    overflow:hidden !important;
  }
  html body main .rwc-promo-block .rwc-promo-banner{
    width:calc(100% + 1.5rem) !important; /* 0.75rem * 2 */
    max-width:none !important;
    margin-left:-0.75rem !important;
    margin-right:-0.75rem !important;
    margin-bottom:0.55rem !important;
    border-radius:0 !important;
  }
  html body main .rwc-promo-block .rwc-promo-banner img{
    border-radius:0 !important;
    object-fit:contain !important;
  }
  /* keep rest compact */
  html body main .rwc-promo-block .rwc-promo-grid{
    gap:0.35rem !important;
  }
}

/* ===== v56: RWC promo without product image cards ===== */
html body main .rwc-promo-block .rwc-promo-grid,
html body main .rwc-promo-block .rwc-promo-shot{display:none !important}
@media (min-width:721px){
  html body main .rwc-promo-block > .container{
    padding-bottom:1.25rem !important;
  }
  html body main .rwc-promo-block .lead{
    margin-bottom:0.75rem !important;
  }
}
@media (max-width:720px){
  html body main .rwc-promo-block > .container{
    padding-bottom:0.75rem !important;
  }
  html body main .rwc-promo-block .lead{
    margin-bottom:0.45rem !important;
  }
}

/* ===== v57: RWC promo own navy box, directly under Bring Your Team Colours ===== */
html body main > section.rwc-promo-block,
html body main section.rwc-promo-block{
  padding:0 !important;
  margin:0 !important;
  background:transparent !important;
}
@media (min-width:721px){
  html body main > section.rwc-promo-block > .container,
  html body main section.rwc-promo-block > .container{
    box-sizing:border-box !important;
    width:100% !important;
    max-width:920px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding:0 1.4rem 1.25rem !important; /* top 0 for banner bleed; sides/bottom shared */
    padding-top:0 !important;
    background:linear-gradient(180deg,#151f3d,#0d1430) !important;
    border:1px solid rgba(255,255,255,.14) !important;
    border-radius:var(--radius,16px) !important;
    box-shadow:0 18px 50px rgba(0,0,0,.35) !important;
    text-align:center !important;
    overflow:hidden !important;
  }
  html body main{gap:28px !important; row-gap:28px !important}
}
@media (max-width:720px){
  html body main > section.rwc-promo-block > .container,
  html body main section.rwc-promo-block > .container{
    box-sizing:border-box !important;
    width:auto !important;
    max-width:100% !important;
    margin-left:12px !important;
    margin-right:12px !important;
    padding:0 0.75rem 0.75rem !important;
    padding-top:0 !important;
    background:linear-gradient(180deg,#151f3d,#0d1430) !important;
    border:1px solid rgba(255,255,255,.14) !important;
    border-radius:14px !important;
    box-shadow:0 18px 50px rgba(0,0,0,.35) !important;
    text-align:center !important;
    overflow:hidden !important;
  }
  /* After About/story (25), before FYC (30) */
  html body main#main > section.rwc-promo-block,
  html body main#main > .rwc-promo-block,
  main#main > section.rwc-promo-block,
  main#main > .rwc-promo-block{order:27 !important}
  html body main{gap:21px !important; row-gap:21px !important}
}

/* ===== v58: ONE shared section gap across the whole site ===== */
:root{
  --section-gap-desktop:28px;
  --section-gap-phone:21px;
}

/* Desktop: main owns the only gap between sections */
@media (min-width:721px){
  html body main#main,
  html body main{
    display:flex !important;
    flex-direction:column !important;
    gap:var(--section-gap-desktop) !important;
    row-gap:var(--section-gap-desktop) !important;
  }
  html body main#main > section,
  html body main > section,
  html body main#main > .marquee,
  html body main > .marquee,
  html body main > section.section-dark,
  html body main > section.section-cream,
  html body main > section.page-hero,
  html body main > section.hero-video,
  html body main > section.story-collage,
  html body main > section.fyc-block,
  html body main > section.rwc-promo-block,
  html body main > section.why-block,
  html body main > section.bulk-block,
  html body main > section.party-packs-block,
  html body main > section.brands-band,
  html body main > section.angled{
    margin-top:0 !important;
    margin-bottom:0 !important;
    padding-top:0 !important;
    padding-bottom:0 !important;
  }
  /* Footer follows the same rhythm after main */
  html body main + .site-footer,
  html body .site-footer,
  html body footer.site-footer{
    margin-top:var(--section-gap-desktop) !important;
  }
}

/* Phone */
@media (max-width:720px){
  html body main#main,
  html body main{
    display:flex !important;
    flex-direction:column !important;
    gap:var(--section-gap-phone) !important;
    row-gap:var(--section-gap-phone) !important;
  }
  html body main#main > section,
  html body main > section,
  html body main#main > .marquee,
  html body main > .marquee,
  html body main > section.section-dark,
  html body main > section.section-cream,
  html body main > section.page-hero,
  html body main > section.hero-video,
  html body main > section.story-collage,
  html body main > section.fyc-block,
  html body main > section.rwc-promo-block,
  html body main > section.why-block,
  html body main > section.bulk-block,
  html body main > section.party-packs-block,
  html body main > section.brands-band,
  html body main > section.angled{
    margin-top:0 !important;
    margin-bottom:0 !important;
    padding-top:0 !important;
    padding-bottom:0 !important;
  }
  html body main + .site-footer,
  html body .site-footer,
  html body footer.site-footer{
    margin-top:var(--section-gap-phone) !important;
  }
}

/* Page hero / content sections: keep readable inset via container, not section pad */
html body main > section.page-hero > .container,
html body main > section.section-dark > .container,
html body main > section.section-cream > .container{
  /* do not invent huge pad; existing container rules stand */
}

/* v58b: feature-box sections hug their navy cards so main gap is the only spacer */
html body main > section.story-collage > .container,
html body main > section.story-collage > .story-collage-inner,
html body main .story-collage .container.story-collage-inner{
  padding-top:0 !important;
  padding-bottom:0 !important;
  margin-top:0 !important;
  margin-bottom:0 !important;
}
@media (max-width:720px){
  html body main > section.story-collage > .container,
  html body main > section.story-collage > .story-collage-inner,
  html body main .story-collage .container.story-collage-inner{
    padding-left:12px !important;
    padding-right:12px !important;
    padding-top:0 !important;
    padding-bottom:0 !important;
  }
}

/* ===== v59: RWC promo back under hero/marquee (v54-v56 placement) ===== */
@media (max-width:720px){
  /* After marquee(20), before About/story(25) */
  html body main#main > section.rwc-promo-block,
  html body main > section.rwc-promo-block,
  main#main > section.rwc-promo-block,
  main#main > .rwc-promo-block{order:22 !important}
}

/* ===== v60: shrink outline pill buttons (~20-25%), keep phone tappable ===== */
/* Base desktop outline pills were ~.95rem / .95rem 1.4rem / 2px → ~50px tall */
html body .btn.btn-outline,
html body a.btn.btn-outline,
html body main .btn.btn-outline,
html body main a.btn.btn-outline,
html body .party-card .btn.btn-outline,
html body .party-card a.btn.btn-outline,
html body main .party-packs-block .party-card .btn,
html body main .party-packs-block .party-card a.btn{
  font-size:0.78rem !important;          /* ~18% under 0.95rem */
  padding:0.78rem 1.1rem !important;     /* ~18-22% under 0.95/1.4 */
  line-height:1 !important;
  border-width:1.5px !important;         /* was 2px */
  border-style:solid !important;
  border-radius:999px !important;
  min-height:40px !important;
  box-sizing:border-box !important;
}

@media (max-width:720px){
  /* Keep outline pills readable and tappable (~40px+) */
  html body .btn.btn-outline,
  html body a.btn.btn-outline,
  html body main .btn.btn-outline,
  html body main a.btn.btn-outline,
  html body .party-card .btn.btn-outline,
  html body .party-card a.btn.btn-outline,
  html body main .party-packs-block .party-card .btn,
  html body main .party-packs-block .party-card a.btn,
  html body main .party-packs-block .party-card .body .btn,
  html body main .party-packs-block .party-card .body a.btn{
    font-size:0.72rem !important;
    padding:0.55rem 0.9rem !important;
    line-height:1.1 !important;
    border-width:1.5px !important;
    min-height:40px !important;
    box-sizing:border-box !important;
  }
}

/* ===== v61: image banners for Why + Bulk ===== */
html body main section.banner-block > .container.banner-box{
  box-sizing:border-box !important;max-width:920px !important;margin:0 auto !important;
  padding:0 !important;background:transparent !important;border:0 !important;box-shadow:none !important;
  border-radius:var(--radius,16px) !important;overflow:hidden !important;line-height:0 !important;}
html body main section.banner-block .banner-link{display:block !important;line-height:0 !important}
html body main section.banner-block .banner-img{display:block !important;width:100% !important;height:auto !important;object-fit:contain !important;border-radius:var(--radius,16px) !important}
@media (max-width:720px){
  html body main section.banner-block > .container.banner-box{width:auto !important;margin:0 12px !important;border-radius:14px !important}
  html body main section.banner-block .banner-img{border-radius:14px !important}
}

/* ===== v63: Christmas ad, first after hero ===== */
html body main section.banner-block.xmas-block > .container.xmas-box{max-width:520px !important}
@media (max-width:720px){ html body main#main > section.xmas-block{order:21 !important} }

/* ===== v64: Christmas ad full 920 width; home Party Packs removed ===== */
html body main section.banner-block.xmas-block > .container.xmas-box{max-width:920px !important}

/* ===== v65: Christmas ad inside navy box like RWC ===== */
html body main section.banner-block.xmas-block > .container.xmas-box{
  max-width:920px !important;background:linear-gradient(#151f3d,#0d1430) !important;
  border:1px solid rgba(255,255,255,.14) !important;border-radius:16px !important;
  box-shadow:0 18px 50px rgba(0,0,0,.35) !important;padding:1.6rem 1.4rem 1.5rem !important;line-height:0 !important}
html body main section.xmas-block .banner-link{max-width:520px !important;margin:0 auto !important;border-radius:12px !important;overflow:hidden !important}
html body main section.xmas-block .banner-img{border-radius:12px !important}
@media (max-width:720px){
  html body main section.banner-block.xmas-block > .container.xmas-box{border-radius:14px !important;padding:12px !important}
  html body main section.xmas-block .banner-link{max-width:none !important;border-radius:10px !important}
  html body main section.xmas-block .banner-img{border-radius:10px !important}
}

/* ===== v69: stocking filler ad fills navy box inner width ===== */
html body main section.xmas-block .banner-link{max-width:none !important;width:100% !important}
html body main section.banner-block.xmas-block > .container.xmas-box{padding:1.4rem !important}
@media (max-width:720px){ html body main section.banner-block.xmas-block > .container.xmas-box{padding:12px !important} }

/* ===== v71: sticky checkout bar + cart page ===== */
.fb-cartbar{position:fixed;left:12px;right:12px;bottom:12px;z-index:999;max-width:560px;margin:0 auto;display:flex;align-items:center;gap:10px;justify-content:space-between;background:linear-gradient(#151f3d,#0d1430);border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:8px 8px 8px 18px;box-shadow:0 12px 32px rgba(0,0,0,.45)}
.fb-cartbar[hidden],.fb-cartbar:empty{display:none}
.fb-cartlink{color:#fff;font-weight:700;text-decoration:none;font-size:.95rem}
.fb-checkout{background:#ffc72c;color:#0d1430;border:0;border-radius:999px;font-weight:800;padding:12px 22px;font-size:1rem;cursor:pointer;text-transform:uppercase;letter-spacing:.03em}
body.has-cartbar{padding-bottom:84px}
.buy-now{margin-left:.5rem}
.fb-cart-list{list-style:none;padding:0;margin:0 0 1rem}
.fb-cart-list li{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.12)}
.fb-cart-name{flex:1}
.fb-cart-qty{display:flex;align-items:center;gap:10px}
.fb-cart-qty button{width:34px;height:34px;border-radius:50%;border:1px solid rgba(255,255,255,.3);background:transparent;color:#fff;font-size:1.1rem;cursor:pointer}
.fb-cart-price{min-width:70px;text-align:right;font-weight:700}

/* ===== v72: FYC first after hero; partners grid + reviews CTA (fanbrushusa.com style) ===== */
@media (max-width:720px){
  html body main#main > section.fyc-block{order:21 !important}
  html body main#main > section.xmas-block{order:22 !important}
  html body main#main > section.rwc-promo-block{order:23 !important}
  html body main#main > section.brands-band{order:40 !important}
  html body main#main > section.section-cream.angled.reviews-cta{order:45 !important}
}
html body main section.brands-band .brands-grid{display:grid !important}
/* v73 US-style partners + reviews */
html body main section.partners-us{background:#f3efe7;color:#0b0f1a;padding:2.4rem 1rem 2.6rem;margin:0;clip-path:none;border:0}
.partners-us .pt-wrap{max-width:1100px;margin:0 auto;text-align:center}
.partners-us .pt-eyebrow{font-family:var(--font-display,'Bebas Neue',Oswald,sans-serif);letter-spacing:.14em;text-transform:uppercase;color:#0b2a5b;font-size:.85rem;font-weight:700;margin:0 0 .3rem}
html body main .partners-us h2.pt-title{font-family:var(--font-display,'Bebas Neue',Oswald,sans-serif);text-transform:uppercase;color:#0b0f1a;font-size:clamp(1.7rem,3.6vw,2.6rem);line-height:1;margin:0 0 1.5rem}
.partners-us .pt-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(7,1fr);gap:16px}
.partners-us .pt-tile{background:#fff;border-radius:14px;box-shadow:0 4px 14px rgba(0,0,0,.08);aspect-ratio:105/75;display:flex;align-items:center;justify-content:center;padding:14px}
.partners-us .pt-tile img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
html body main section.reviews-us{background:transparent;padding:2rem 1rem;margin:0;clip-path:none}
.reviews-us .rv-card{position:relative;overflow:hidden;max-width:950px;margin:0 auto;background:#f8f6f1;border-radius:16px;display:flex;align-items:center;gap:2rem;padding:1.6rem 2rem 1.6rem 2.6rem;box-shadow:0 6px 20px rgba(0,0,0,.3)}
.reviews-us .rv-flag{position:absolute;left:0;top:0;bottom:0;width:12px;background:linear-gradient(#d71a33 0 33.3%,#fff 33.3% 66.6%,#0b2a5b 66.6%)}
.reviews-us .rv-stars{color:#f5b301;font-size:2.1rem;letter-spacing:.08em;white-space:nowrap;line-height:1}
.reviews-us .rv-text{flex:1;text-align:left}
.reviews-us .rv-eyebrow{color:#d71a33;font-family:var(--font-display,'Bebas Neue',Oswald,sans-serif);letter-spacing:.14em;text-transform:uppercase;font-size:.85rem;font-weight:700;margin:0 0 .15rem}
html body main .reviews-us h2.rv-title{color:#0b1f45;font-family:var(--font-display,'Bebas Neue',Oswald,sans-serif);text-transform:uppercase;font-size:clamp(1.5rem,2.6vw,2rem);line-height:1.05;margin:0 0 .35rem;text-align:left}
.reviews-us .rv-line{color:#33405a;margin:0;font-size:1rem}
.reviews-us .rv-btn{background:#d71a33;color:#fff;border-radius:999px;padding:.85rem 1.6rem;font-family:var(--font-display,'Bebas Neue',Oswald,sans-serif);text-transform:uppercase;letter-spacing:.06em;font-weight:700;text-decoration:none;white-space:nowrap}
.reviews-us .rv-btn:hover{background:#b3132a}
@media(max-width:720px){
 .partners-us .pt-grid{grid-template-columns:repeat(4,1fr);gap:10px}
 .partners-us .pt-tile{padding:8px;border-radius:10px}
 .reviews-us .rv-card{flex-direction:column;text-align:center;gap:.8rem;padding:1.4rem 1.2rem 1.4rem 1.8rem}
 .reviews-us .rv-text,html body main .reviews-us h2.rv-title{text-align:center}
 .reviews-us .rv-stars{font-size:1.8rem}
}
html body main section.partners-us h2.pt-title,html body main section.reviews-us h2.rv-title{font-size:clamp(1.5rem,3.6vw,2.6rem)!important}
html body main section.reviews-us h2.rv-title{font-size:clamp(1.5rem,2.6vw,2rem)!important}
html body main section.partners-us{padding-top:2.4rem!important}
/* v74 partners: exact US match */
#fb-partners.partners-us{display:block!important;background:#f3efe7!important;padding:40px 16px 44px!important;margin:0!important;min-height:0!important;height:auto!important;overflow:visible!important}
#fb-partners .pt-wrap{max-width:900px!important;margin:0 auto!important;padding:0!important;text-align:center!important}
#fb-partners .pt-eyebrow{font-size:12px!important;letter-spacing:.16em!important;color:#0b2a5b!important;margin:0 0 6px!important}
#fb-partners h2.pt-title{font-family:var(--font-display,'Bebas Neue',Oswald,sans-serif)!important;font-size:40px!important;line-height:1!important;color:#0b0f1a!important;margin:0 0 22px!important;text-transform:uppercase!important}
#fb-partners .pt-grid{display:flex!important;flex-wrap:wrap!important;justify-content:center!important;gap:14px!important;max-width:calc(7*105px + 6*14px)!important;margin:0 auto!important;padding:0!important;list-style:none!important}
#fb-partners .pt-tile{flex:0 0 105px!important;width:105px!important;height:75px!important;aspect-ratio:auto!important;box-sizing:border-box!important;padding:12px 14px!important;margin:0!important;background:#fff!important;border-radius:12px!important;box-shadow:0 2px 10px rgba(0,0,0,.07)!important;display:flex!important;align-items:center!important;justify-content:center!important;overflow:hidden!important}
#fb-partners .pt-tile img{display:block!important;width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;object-fit:contain!important;margin:0!important;border-radius:0!important;background:transparent!important}
@media (max-width:720px){
#fb-partners.partners-us{padding:28px 12px 32px!important}
#fb-partners h2.pt-title{font-size:26px!important;margin-bottom:16px!important}
#fb-partners .pt-grid{gap:10px!important;max-width:calc(4*76px + 3*10px)!important}
#fb-partners .pt-tile{flex-basis:76px!important;width:76px!important;height:56px!important;padding:8px 10px!important;border-radius:10px!important}
}
/* v74 cart bar: clear button, slim on phone */
.fb-cartbar .fb-cartx{background:transparent;border:0;color:inherit;font-size:22px;line-height:1;padding:4px 8px;cursor:pointer;opacity:.8}
body.has-cartbar{padding-bottom:96px!important}
@media (max-width:720px){
.fb-cartbar{left:8px!important;right:8px!important;bottom:8px!important;height:56px!important;min-height:0!important;padding:6px 8px 6px 14px!important;gap:6px!important;font-size:14px!important;box-sizing:border-box!important}
.fb-cartbar .fb-checkout{padding:8px 14px!important;font-size:13px!important;min-height:0!important}
body.has-cartbar{padding-bottom:76px!important}
}
/* v74b bulletproof phone partners (Safari) */
@media (max-width:720px){
#fb-partners .pt-wrap{width:100%!important;box-sizing:border-box!important}
#fb-partners h2.pt-title{font-size:clamp(22px,6.5vw,34px)!important;line-height:1.05!important;white-space:normal!important;height:auto!important;max-height:none!important;overflow:visible!important}
#fb-partners .pt-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:8px!important;width:100%!important;max-width:360px!important;box-sizing:border-box!important}
#fb-partners .pt-tile{width:auto!important;height:auto!important;flex:none!important;aspect-ratio:1/1!important;min-width:0!important;padding:0!important;overflow:hidden!important;position:relative!important;display:block!important}
#fb-partners .pt-tile img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:100%!important;padding:8px!important;box-sizing:border-box!important;object-fit:contain!important}
#fb-reviews.reviews-us{padding:20px 12px!important}
#fb-reviews .rv-card{display:flex!important;flex-direction:column!important;align-items:center!important;height:auto!important;min-height:0!important;gap:10px!important;padding:20px 16px 20px 24px!important;box-sizing:border-box!important;width:100%!important}
#fb-reviews .rv-text{width:100%!important;flex:none!important}
#fb-reviews h2.rv-title{font-size:clamp(22px,6.5vw,30px)!important;line-height:1.05!important}
}

/* v75 phone: partners + reviews match CTA box sizes */
@media (max-width:640px){
html body main section#fb-partners{padding:18px 12px 19px!important}
html body main section#fb-partners .pt-eyebrow{font-size:6.5px!important;line-height:7.8px!important;margin:0 0 6px!important}
html body main section#fb-partners h2.pt-title{font-size:13px!important;line-height:15px!important;margin:0 0 10px!important}
html body main section#fb-partners .pt-grid{display:grid!important;grid-template-columns:repeat(5,56px)!important;gap:6px!important;justify-content:center!important;width:auto!important;margin:0 auto!important;padding:0!important;max-width:none!important}
html body main section#fb-partners .pt-tile{width:56px!important;height:56px!important;min-width:0!important;padding:5px!important;box-sizing:border-box!important;aspect-ratio:auto!important;flex:none!important}
html body main section#fb-partners .pt-tile img{padding:5px!important}
html body main section#fb-reviews .rv-card{padding:18.4px 16px 19.2px!important}
html body main section#fb-reviews .rv-stars{font-size:20px!important;line-height:20px!important}
html body main section#fb-reviews .rv-eyebrow{font-size:6.5px!important;line-height:7.8px!important;margin:0 0 6px!important}
html body main section#fb-reviews h2.rv-title{font-size:13px!important;line-height:15px!important;margin:0 0 6px!important}
html body main section#fb-reviews .rv-line{font-size:12px!important;line-height:16.2px!important;margin:0 0 8px!important}
html body main section#fb-reviews .rv-btn{font-size:11px!important;line-height:13.2px!important;padding:5px 12px!important}
}

.home-shop-tile--soon,.home-shop-tile--soon:hover,.home-shop-tile--soon:focus{cursor:default!important;transform:none!important;box-shadow:none!important;}

@media (max-width:720px){html body main section#fb-reviews.reviews-us{padding-top:0!important;padding-bottom:0!important;}}
/* v80 phone: partners grid 4 per row, no overflow */
@media (max-width:640px){
html body main section#fb-partners{overflow:hidden!important;box-sizing:border-box!important;max-width:100%!important}
html body main section#fb-partners .pt-wrap{max-width:100%!important}
html body main section#fb-partners h2.pt-title{white-space:nowrap!important}
html body main section#fb-partners .pt-grid{display:grid!important;grid-template-columns:repeat(4,64px)!important;gap:8px!important;justify-content:center!important;width:100%!important;max-width:100%!important;margin:0 auto!important;padding:0!important;box-sizing:border-box!important}
html body main section#fb-partners .pt-tile{width:64px!important;height:64px!important;min-width:0!important;max-width:64px!important;padding:0!important;margin:0!important;box-sizing:border-box!important;aspect-ratio:1/1!important;flex:none!important;position:relative!important;overflow:hidden!important}
html body main section#fb-partners .pt-tile img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;padding:7px!important;box-sizing:border-box!important;object-fit:contain!important}
}