.merch-page{
  width:min(1320px, calc(100% - 32px));
  margin:24px auto 48px;
  display:grid;
  gap:18px;
}
.card{
  position:relative;
  overflow:hidden;
}
.eyebrow{
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#57dcff;
  font-weight:800;
}
.merch-hero{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:18px;
  padding:28px;
  align-items:center;
}
.merch-hero-copy h1{
  font-size:clamp(44px, 6vw, 84px);
  line-height:.95;
  letter-spacing:-.04em;
  margin:10px 0 14px;
}
.hero-copy{
  max-width:760px;
  font-size:21px;
  line-height:1.65;
  color:#e7eefc;
  margin:0 0 18px;
}
.hero-pills,.hero-actions,.stat-row{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}
.hero-pill,.stat-pill{
  border-radius:18px;
  padding:14px 18px;
  border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
  font-size:14px;
  font-weight:800;
  letter-spacing:.08em;
}
.hero-pill-blue,.stat-blue{ border-color:rgba(77,163,255,.5); color:#8ec8ff; }
.hero-pill-green,.stat-green{ border-color:rgba(137,255,122,.45); color:#bbff98; }
.hero-pill-orange,.stat-orange{ border-color:rgba(255,169,77,.45); color:#ffc889; }
.cta{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:190px; height:50px; padding:0 22px;
  border-radius:999px; text-decoration:none;
  font-weight:900; letter-spacing:.04em; text-transform:uppercase;
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.cta:hover{ transform:translateY(-1px); }
.cta-warm{
  color:#fff5e6;
  border:1px solid rgba(255,154,47,.65);
  background:linear-gradient(180deg, rgba(255,154,47,.22), rgba(255,154,47,.08));
  box-shadow:0 0 0 1px rgba(255,154,47,.12) inset, 0 10px 28px rgba(255,154,47,.16);
}
.cta-cool{
  color:#eff9ff;
  border:1px solid rgba(77,163,255,.65);
  background:linear-gradient(180deg, rgba(77,163,255,.18), rgba(77,163,255,.06));
  box-shadow:0 0 0 1px rgba(77,163,255,.12) inset, 0 10px 28px rgba(77,163,255,.12);
}
.merch-hero-art{
  padding:16px;
  min-height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:
    radial-gradient(480px 280px at 50% 35%, rgba(255,154,47,.12), transparent 65%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01));
}
.merch-hero-art img{ width:100%; max-width:540px; display:block; border-radius:22px; }
.glow-orange{ box-shadow:0 0 0 1px rgba(255,154,47,.12) inset, 0 18px 60px rgba(0,0,0,.55), 0 0 30px rgba(255,154,47,.08); }
.stat-row{ justify-content:center; }
.stat-pill{
  min-width:170px; text-align:center;
  display:flex; flex-direction:column; gap:2px;
}
.stat-pill strong{ font-size:30px; color:#fff; line-height:1; }
.stat-pill span{ font-size:11px; color:#dbe6fb; letter-spacing:.12em; }
.product-types,
.merch-cta{ padding:24px; }
.section-head h2{
  margin:6px 0 8px;
  font-size:clamp(32px, 4vw, 54px);
  line-height:1;
  letter-spacing:-.03em;
}
.section-head p{ margin:0; color:#c8d3e8; font-size:18px; }
.section-head.center{ text-align:center; }
.type-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:18px;
}
.type-card{
  border-radius:22px; padding:22px;
  border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015));
}
.type-card h3{ margin:0 0 8px; font-size:26px; }
.type-card p{ margin:0; color:#d6e0f4; font-size:17px; line-height:1.6; }
.type-orange{ border-color:rgba(255,169,77,.32); background:linear-gradient(180deg, rgba(255,169,77,.08), rgba(255,169,77,.02)); }
.type-blue{ border-color:rgba(77,163,255,.32); background:linear-gradient(180deg, rgba(77,163,255,.08), rgba(77,163,255,.02)); }
.type-green{ border-color:rgba(137,255,122,.32); background:linear-gradient(180deg, rgba(137,255,122,.08), rgba(137,255,122,.02)); }
.featured-drop{ display:grid; gap:18px; }
.design-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:18px;
}
.design-card{
  padding:14px;
  display:grid; gap:14px;
  transition:transform .16s ease, box-shadow .16s ease;
}
.design-card:hover{ transform:translateY(-3px); box-shadow:0 22px 60px rgba(0,0,0,.55), 0 0 24px rgba(255,255,255,.05); }
.design-frame{
  border-radius:20px; overflow:hidden;
  background:#000;
  aspect-ratio: 1 / 1.18;
  display:flex; align-items:center; justify-content:center;
}
.design-frame img{ width:100%; height:100%; object-fit:cover; display:block; }
.design-meta h3{ margin:0 0 6px; font-size:28px; }
.design-meta p{ margin:0; color:#cdd8eb; font-size:16px; line-height:1.55; }
.merch-cta{
  display:flex; align-items:center; justify-content:space-between; gap:18px;
}
.merch-cta p{ max-width:760px; }
@media (max-width: 1080px){
  .merch-hero{ grid-template-columns:1fr; }
  .type-grid{ grid-template-columns:1fr; }
  .design-grid{ grid-template-columns:repeat(2,1fr); }
  .merch-cta{ flex-direction:column; align-items:flex-start; }
}
@media (max-width: 720px){
  .merch-page{ width:min(100% - 20px, 1320px); margin:14px auto 34px; }
  .merch-hero, .product-types, .merch-cta{ padding:18px; }
  .hero-copy{ font-size:18px; }
  .design-grid{ grid-template-columns:1fr; }
  .hero-actions .cta{ width:100%; }
  .stat-row{ justify-content:stretch; }
  .stat-pill{ flex:1 1 100%; }
}

/* === BuddiBods identity polish: About-style coloured bubbles === */
.hero-pill,
.stat-pill{
  background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.02));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 10px 26px rgba(0,0,0,.16);
}
.hero-pill-blue,.stat-blue{
  border-color: rgba(77,163,255,.45);
  color:#c7e4ff;
  background: linear-gradient(180deg, rgba(77,163,255,.13), rgba(77,163,255,.03));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 0 22px rgba(77,163,255,.10);
}
.hero-pill-green,.stat-green{
  border-color: rgba(137,255,122,.42);
  color:#dcffbf;
  background: linear-gradient(180deg, rgba(137,255,122,.13), rgba(137,255,122,.03));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 0 22px rgba(137,255,122,.09);
}
.hero-pill-orange,.stat-orange{
  border-color: rgba(255,169,77,.42);
  color:#ffe1be;
  background: linear-gradient(180deg, rgba(255,169,77,.13), rgba(255,169,77,.03));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 0 22px rgba(255,169,77,.09);
}
.stat-pill strong{ color:#f8fbff; }
.stat-pill span{ color:rgba(255,255,255,.78); }
.type-card{
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 12px 28px rgba(0,0,0,.14);
}
.type-orange{
  border-color: rgba(255,169,77,.34);
  background: linear-gradient(180deg, rgba(255,169,77,.10), rgba(255,169,77,.025));
}
.type-blue{
  border-color: rgba(77,163,255,.34);
  background: linear-gradient(180deg, rgba(77,163,255,.10), rgba(77,163,255,.025));
}
.type-green{
  border-color: rgba(137,255,122,.34);
  background: linear-gradient(180deg, rgba(137,255,122,.10), rgba(137,255,122,.025));
}


/* === Pass 23: merch spacing + heading/font polish === */
.merch-hero-copy h1,
.section-head h2,
.design-meta h3,
.type-card h3,
.merch-cta h2{
  font-family: var(--font-display);
}

.merch-hero-copy .hero-pills{
  margin-top: 26px;
  gap: 14px;
  row-gap: 14px;
}

.merch-hero-copy .hero-actions{
  margin-top: 18px;
  gap: 16px;
  row-gap: 16px;
  align-items: center;
}

.hero-pill{
  padding: 12px 18px;
}

.cta{
  min-width: 208px;
  padding: 0 24px;
}

@media (max-width: 720px){
  .merch-hero-copy .hero-pills{
    gap: 12px;
    row-gap: 12px;
  }

  .merch-hero-copy .hero-actions{
    margin-top: 14px;
    gap: 12px;
    row-gap: 12px;
  }
}