
:root {
  --ink: #171310;
  --brown: #6e3f1f;
  --brown-2: #8b542e;
  --gold: #d79217;
  --cream: #f7f4ef;
  --card: #fffdfa;
  --line: #ddd1c3;
  --muted: #655e58;
  --dark: #0f0e0d;
  --shadow: 0 12px 28px rgba(59, 40, 24, 0.08);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--cream);
  font-family: Arial, Helvetica, sans-serif;
  line-height: 1.45;
}
a { color: inherit; }
img { display: block; max-width: 100%; }
.container { width: min(1320px, calc(100% - 36px)); margin: 0 auto; }
.site-header {
  height: 64px;
  background: rgba(255,253,250,.98);
  border-bottom: 1px solid #e7dfd5;
  position: sticky;
  top: 0;
  z-index: 20;
}
.header-inner { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand { text-decoration: none; display: inline-flex; align-items: center; gap: 10px; font-weight: 900; letter-spacing: .16em; font-size: 22px; }
.brand img { width: 36px; height: 36px; object-fit: contain; }
.nav { display: flex; align-items: center; gap: 34px; font-size: 14px; font-weight: 700; }
.nav a { text-decoration: none; padding: 22px 0 18px; border-bottom: 2px solid transparent; }
.nav a:hover, .nav a.active { color: var(--brown); border-bottom-color: var(--brown); }
.menu-toggle { display: none; border: 0; background: transparent; font-size: 28px; cursor: pointer; }

.hero-shell { padding: 0 0 18px; border-bottom: 1px solid #e1d9cf; background: #faf7f3; }
.hero {
  display: grid;
  grid-template-columns: 40% 60%;
  min-height: 320px;
  overflow: hidden;
}
.hero-copy {
  padding: 38px 28px 36px 8px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: #fbf9f6;
}
.hero h1 { margin: 0; font-family: Impact, 'Arial Black', Arial, sans-serif; font-weight: 900; letter-spacing: .02em; line-height: .98; font-size: clamp(38px, 4vw, 58px); }
.hero h1 span { color: var(--brown-2); }
.hero-copy p { margin: 18px 0 20px; font-size: 17px; }
.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; padding: 10px 24px; border: 1px solid var(--brown); background: var(--brown); color: #fff; text-decoration: none; font-size: 13px; font-weight: 800; letter-spacing: .02em; text-transform: uppercase; transition: .18s ease; }
.btn:hover { background: #3f2413; transform: translateY(-1px); }
.btn.secondary { background: transparent; color: var(--brown); }
.btn.secondary:hover { background: #f0e7dd; }

.promo-panel {
  background: radial-gradient(circle at 82% 28%, #24201b 0, #11100f 48%, #090909 100%);
  color: #fff;
  display: grid;
  grid-template-columns: 1fr 1.35fr;
  min-width: 0;
  overflow: hidden;
  position: relative;
  border-left: 1px solid #e1d9cf;
}
.promo-panel::after { content:""; position:absolute; right:-120px; bottom:-105px; width:390px; height:210px; border: 2px solid rgba(255,255,255,.16); border-radius:50%; box-shadow: 0 0 0 18px rgba(255,255,255,.055), 0 0 0 36px rgba(255,255,255,.035); transform: rotate(-12deg); pointer-events:none; }
.promo-col { position: relative; z-index: 2; min-width: 0; padding: 28px 24px; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; }
.promo-col + .promo-col { border-left: 1px solid rgba(255,255,255,.25); }
.shipping-message img { width: 62px; max-height: 74px; object-fit: contain; margin-bottom: 12px; }
.shipping-message p { margin: 0; font-size: clamp(18px, 1.55vw, 25px); font-weight: 700; line-height: 1.35; max-width: 290px; }
.shipping-message strong { color: var(--gold); }
.follow-block {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  align-items: center;
  padding: 18px 18px 18px 20px;
}
.follow-copy { display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; }
.follow-copy h2 { margin: 0 0 4px; font-family: Impact, 'Arial Black', Arial, sans-serif; font-size: clamp(28px, 2.2vw, 42px); letter-spacing:.025em; line-height:1; }
.follow-copy h2 span { display:block; color: var(--gold); font-size: 1.2em; margin-top: 4px; }
.follow-copy img { width: 64px; height: 64px; margin: 12px auto; }
.follow-copy .btn { min-width: 150px; }
.follow-logo-wrap { display:flex; align-items:center; justify-content:center; }
.follow-logo-card {
  background: rgba(255,255,255,.98);
  border-radius: 18px;
  padding: 10px;
  box-shadow: 0 14px 30px rgba(0,0,0,.24);
  width: min(255px, 100%);
}
.follow-logo-card img { width: 100%; max-height: 220px; object-fit: contain; border-radius: 10px; }

.mobile-promo { display:none; }
.mobile-promo-inner { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.mobile-promo-item { text-decoration:none; }
.section { padding: 18px 0; }
.section-title { display:flex; align-items:center; gap:24px; justify-content:center; margin: 0 0 16px; font-family:'Arial Black', Arial, sans-serif; font-size: 20px; letter-spacing:.04em; text-transform:uppercase; }
.section-title::before, .section-title::after { content:""; height:1px; background:#bcae9f; flex:1; max-width:330px; }
.products-grid { display:grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.product-card { background: var(--card); border:1px solid #e2d8ce; border-radius: 12px; overflow:hidden; box-shadow: var(--shadow); display:flex; flex-direction:column; min-width:0; }
.product-image { width:100%; aspect-ratio: 1.12/1; object-fit:cover; background:#eee; }
.product-card:nth-child(1) .product-image { object-position: 50% 56%; }
.product-card:nth-child(2) .product-image { object-position: 50% 51%; }
.product-card:nth-child(3) .product-image { object-position: 50% 55%; }
.product-card:nth-child(4) .product-image { object-position: 50% 49%; }
.product-body { padding: 13px 14px 14px; display:flex; flex-direction:column; text-align:center; flex:1; }
.product-name { margin:0; font-size: 16px; line-height:1.2; min-height: 39px; display:flex; justify-content:center; align-items:center; font-weight:700; }
.price { font-size: 21px; margin: 9px 0 11px; }
.card-buttons { display:grid; gap:8px; margin-top:auto; }
.card-buttons .btn { width:100%; }

.comparison { padding-top: 2px; }
.compare-panel { background:#f3eee8; border:1px solid #d6c6b7; border-radius:16px; box-shadow: var(--shadow); overflow:hidden; }
.compare-heading { display:flex; align-items:center; gap:16px; justify-content:center; padding: 12px 18px 0; font-size: 17px; font-weight:900; text-transform:uppercase; letter-spacing:.04em; }
.compare-heading::before, .compare-heading::after { content:""; height:1px; background:#aa9c8e; width:80px; }
.compare-grid { display:grid; grid-template-columns: .95fr 1.05fr 90px 1.05fr .95fr; align-items:center; gap: 14px; padding: 9px 20px 16px; }
.compare-photo { width:100%; height:155px; object-fit:cover; border-radius: 11px; border:1px solid #ddd2c8; }
.compare-copy h3 { margin:0 0 7px; font-size:16px; text-transform:uppercase; }
.compare-copy p { margin:0 0 10px; color:#3e3934; font-size:14px; }
.vs { width:54px; height:54px; border-radius:50%; background:var(--brown-2); color:#fff; display:flex; align-items:center; justify-content:center; margin:auto; font-weight:900; font-size:18px; }

.benefits { padding: 0 0 22px; }
.benefits-row { border:1px solid #e2d9cf; border-radius:14px; background:#fbfaf8; display:grid; grid-template-columns: repeat(4,1fr); overflow:hidden; }
.benefit { display:grid; grid-template-columns: 46px 1fr; align-items:center; gap:10px; padding:16px 20px; }
.benefit + .benefit { border-left:1px solid #e2d9cf; }
.benefit-icon { width:42px; height:42px; display:flex; align-items:center; justify-content:center; color:var(--brown); font-size:29px; }
.benefit strong { display:block; font-size:13px; text-transform:uppercase; margin-bottom:2px; }
.benefit span { display:block; font-size:12px; color:var(--muted); }

.site-footer { border-top:1px solid #ded6cd; background:#eee8e1; padding:22px 0; }
.footer-inner { display:flex; align-items:flex-start; justify-content:space-between; gap:28px; font-size:12px; color:#514b45; }
.footer-inner strong { color:var(--ink); font-size:15px; }
.footer-note { max-width:660px; text-align:right; }

/* Product detail */
.product-page { padding: 34px 0 44px; }
.breadcrumb { font-size:13px; color:var(--muted); margin-bottom:18px; }
.detail-grid { display:grid; grid-template-columns: 1.08fr .92fr; gap:38px; align-items:start; }
.gallery-main { width:100%; aspect-ratio: 4/3; object-fit:cover; border-radius:15px; border:1px solid #ddd1c6; background:#e8e1d9; }
.thumbs { display:grid; grid-template-columns: repeat(5,1fr); gap:9px; margin-top:10px; }
.thumb { width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:8px; border:2px solid transparent; cursor:pointer; }
.thumb.active { border-color:var(--brown); }
.detail-copy h1 { margin:0; font-size:35px; line-height:1.08; }
.detail-price { font-size:28px; margin:12px 0 16px; }
.detail-copy p { color:#423d38; }
.detail-copy ul { padding-left:19px; color:#423d38; }
.detail-copy li { margin-bottom:8px; }
.buy-box { margin:22px 0; display:flex; gap:12px; flex-wrap:wrap; }
.buy-box .btn { min-width:210px; }
.notice { background:#f1e8df; border-left:4px solid var(--brown-2); padding:12px 14px; font-size:13px; color:#4e453e; margin-top:18px; }
.notice a { color: var(--brown); font-weight: 700; text-decoration: underline; }
.related-inline { margin-top: 28px; }
.related-inline h2 { margin: 0 0 14px; font-size: 21px; }
.related-inline p.related-intro { margin: 0 0 14px; color:#5c544d; }
.related-list { display:grid; gap: 12px; }
.mini-card { display:grid; grid-template-columns: 96px 1fr; gap:12px; background:var(--card); border:1px solid #e2d8ce; border-radius:12px; padding:10px; box-shadow: var(--shadow); align-items:center; }
.mini-card img { width:96px; height:96px; object-fit:cover; border-radius:8px; }
.mini-card h3 { margin:0 0 4px; font-size:16px; line-height:1.2; }
.mini-card .mini-price { font-size:20px; margin:0 0 8px; }
.mini-actions { display:flex; gap:8px; flex-wrap:wrap; }
.mini-actions .btn { min-height:36px; padding:8px 14px; font-size:11px; }

.bundle-offer {
  margin: 22px 0 20px;
  padding: 18px;
  background: linear-gradient(135deg, #fffaf2 0%, #f3e7d8 100%);
  border: 1px solid #d7b995;
  border-radius: 14px;
  box-shadow: var(--shadow);
}
.bundle-kicker {
  display: inline-block;
  margin-bottom: 7px;
  color: var(--brown);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.bundle-offer h2,
.bundle-offer h3 { margin: 0 0 8px; line-height: 1.15; }
.bundle-offer h2 { font-size: 21px; }
.bundle-offer h3 { font-size: 17px; }
.bundle-offer p { margin: 0 0 14px; color: #423d38; }
.bundle-bottom {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}
.bundle-price { font-size: 25px; color: var(--ink); }
.free-ship {
  padding: 6px 9px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid #c9a477;
  color: var(--brown);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .04em;
}
.bundle-bottom .btn { margin-left: auto; min-width: 150px; }
.bundle-options { margin: 22px 0 22px; }
.bundle-options > h2 { margin: 0 0 5px; font-size: 21px; }
.bundle-options-intro { margin: 0 0 12px!important; }
.bundle-options-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.bundle-offer.compact { margin: 0; }
.bundle-offer.compact .bundle-bottom .btn { width: 100%; margin-left: 0; margin-top: 3px; }
@media (max-width: 760px) {
  .bundle-options-grid { grid-template-columns: 1fr; }
  .bundle-bottom .btn { margin-left: 0; width: 100%; }
}

.simple-page { padding: 48px 0 70px; max-width: 840px; }
.simple-page h1 { font-size:42px; margin-top:0; }
.simple-page .btn { margin-top:12px; }

@media (max-width: 1050px) {
  .hero { grid-template-columns: 1fr; }
  .hero-copy { padding: 32px 24px; }
  .promo-panel { min-height:260px; }
  .products-grid { grid-template-columns: repeat(2,1fr); }
  .compare-grid { grid-template-columns: 1fr 1fr 70px 1fr 1fr; }
  .benefits-row { grid-template-columns: repeat(2,1fr); }
  .benefit:nth-child(3) { border-left:0; border-top:1px solid #e2d9cf; }
  .benefit:nth-child(4) { border-top:1px solid #e2d9cf; }
}
@media (max-width: 760px) {
  .site-header { height:58px; }
  .brand { font-size:17px; letter-spacing:.11em; }
  .brand img { width:31px; height:31px; }
  .menu-toggle { display:block; }
  .nav { position:absolute; top:58px; left:0; right:0; background:#fffdfa; border-bottom:1px solid #ded5cb; padding: 8px 22px 14px; display:none; flex-direction:column; align-items:stretch; gap:0; }
  .nav.open { display:flex; }
  .nav a { padding:12px 4px; border-bottom:1px solid #eee5dc; }
  .hero-copy { padding: 28px 22px; }
  .hero h1 { font-size:42px; }
  .promo-panel { grid-template-columns: 1fr; }
  .promo-col { padding:22px 15px; }
  .promo-col + .promo-col { border-left:0; border-top:1px solid rgba(255,255,255,.22); }
  .follow-block { grid-template-columns: 1fr; }
  .follow-logo-card { width:min(220px,100%); }
  .section { padding:14px 0; }
  .section-title { font-size:17px; gap:12px; }
  .products-grid { gap:11px; }
  .product-body { padding:10px; }
  .product-name { font-size:13px; min-height:48px; }
  .price { font-size:18px; margin:6px 0 9px; }
  .btn { padding:9px 12px; font-size:11px; min-height:38px; }
  .compare-heading { font-size:14px; }
  .compare-grid { grid-template-columns:1fr 54px 1fr; padding:10px 12px 14px; gap:10px; }
  .compare-photo { height:145px; grid-row:1; }
  .brown-photo { grid-column:1; }
  .black-photo { grid-column:3; }
  .vs { grid-column:2; grid-row:1; width:44px; height:44px; font-size:15px; }
  .brown-copy { grid-column:1; grid-row:2; text-align:center; }
  .black-copy { grid-column:3; grid-row:2; text-align:center; }
  .compare-copy h3 { font-size:13px; }
  .compare-copy p { font-size:12px; min-height:52px; }
  .benefit { padding:12px 10px; grid-template-columns:36px 1fr; }
  .benefit-icon { width:34px; font-size:24px; }
  .benefit strong { font-size:11px; }
  .benefit span { font-size:10px; }
  .footer-inner { flex-direction:column; }
  .footer-note { text-align:left; }
  .detail-grid { grid-template-columns:1fr; gap:24px; }
  .product-page { padding-top:20px; }
  .detail-copy h1 { font-size:29px; }
  .thumbs { grid-template-columns:repeat(4,1fr); }
  .mini-card { grid-template-columns: 86px 1fr; }
  .mini-card img { width:86px; height:86px; }
}
@media (max-width: 430px) {
  .container { width:min(100% - 20px, 1320px); }
  .hero h1 { font-size:36px; }
  .products-grid { grid-template-columns: repeat(2,1fr); }
  .product-image { aspect-ratio:1/1; }
  .benefits-row { grid-template-columns:1fr; }
  .benefit + .benefit, .benefit:nth-child(3), .benefit:nth-child(4) { border-left:0; border-top:1px solid #e2d9cf; }
  .mini-actions { display:grid; grid-template-columns:1fr; }
}


/* Mobile-first homepage optimization: products appear before promotional blocks. */
@media (max-width: 760px) {
  .hero-shell { padding-bottom: 0; }
  .hero {
    display: block;
    min-height: 0;
  }
  .hero-copy {
    padding: 22px 18px 20px;
    min-height: 0;
  }
  .hero h1 {
    font-size: clamp(32px, 10.2vw, 40px);
    line-height: .98;
  }
  .hero-copy p {
    margin: 12px 0 14px;
    font-size: 15px;
  }
  .hero-copy .btn {
    min-height: 38px;
    padding: 9px 16px;
  }

  /* Hide the tall desktop promo panel above the products on phones. */
  .hero .promo-panel { display:none; }

  /* Tighten the products block so real products are visible immediately. */
  #products.section { padding-top: 10px; }
  #products .section-title { margin-bottom: 10px; }
  .products-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
  }
  .product-card { border-radius: 10px; }
  .product-image { aspect-ratio: 1 / .9; }
  .product-body { padding: 8px; }
  .product-name {
    min-height: 44px;
    font-size: 12px;
    line-height: 1.15;
  }
  .price { font-size: 17px; margin: 5px 0 7px; }
  .card-buttons { gap: 6px; }
  .card-buttons .btn { min-height: 35px; padding: 7px 5px; font-size: 10px; }

  /* Compact trust/social strip appears AFTER the product cards. */
  .mobile-promo {
    display:block;
    padding: 2px 0 12px;
  }
  .mobile-promo-inner {
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }
  .mobile-promo-item {
    min-width: 0;
    display:flex;
    align-items:center;
    gap: 9px;
    padding: 10px;
    border-radius: 11px;
    background: #151311;
    color: #fff;
    border: 1px solid #2d2823;
  }
  .mobile-promo-item img {
    width: 38px;
    height: 38px;
    object-fit: contain;
    flex: 0 0 auto;
  }
  .mobile-promo-item strong {
    display:block;
    font-size: 11px;
    line-height:1.15;
    text-transform:uppercase;
  }
  .mobile-promo-item span {
    display:block;
    margin-top: 3px;
    font-size: 9px;
    line-height:1.2;
    color:#ddd3c9;
  }
  .mobile-tiktok strong { color: #fff; }

  .comparison { padding-top: 0; }
}

@media (max-width: 430px) {
  .site-header { height: 54px; }
  .nav { top:54px; }
  .brand { font-size: 16px; }
  .brand img { width: 29px; height:29px; }
  .hero-copy { padding: 18px 12px 18px; }
  .hero h1 { font-size: 34px; }
  .hero-copy p { font-size: 14px; }
  .section-title { font-size: 16px; }
  .mobile-promo-item { padding: 8px; gap: 7px; }
  .mobile-promo-item img { width: 32px; height: 32px; }
  .mobile-promo-item strong { font-size: 10px; }
  .mobile-promo-item span { font-size: 8.5px; }
}


/* Product-specific Square return / QR conversion pages */
.thankyou-section { min-height: 68vh; display:flex; align-items:center; }
.thankyou-card { max-width:760px; text-align:center; padding:64px 24px; }
.thankyou-card h1 { font-size:clamp(40px,7vw,72px); line-height:.95; margin:0 0 18px; }
.thankyou-lead { font-size:20px; margin:0 auto 12px; max-width:620px; }
.thankyou-product { margin:0 0 28px; color:#5b5148; }
.thankyou-actions { display:flex; justify-content:center; gap:12px; flex-wrap:wrap; }
.tiktok-follow { display:inline-flex; align-items:center; gap:8px; }
.tiktok-follow img { width:22px; height:22px; object-fit:contain; }
@media (max-width:560px) {
  .thankyou-card { padding:46px 14px; }
  .thankyou-lead { font-size:17px; }
  .thankyou-actions { display:grid; grid-template-columns:1fr; }
  .thankyou-actions .btn { width:100%; }
}


/* ===== Sept. 3 organizer-family / product-navigation update ===== */
.product-image-link,
.mini-image-link,
.chooser-image-link,
.bundle-image-link { display:block; text-decoration:none; overflow:hidden; }
.product-image-link .product-image,
.mini-image-link img,
.chooser-image-link img,
.bundle-image-link img { transition: transform .18s ease; }
.product-image-link:hover .product-image,
.mini-image-link:hover img,
.chooser-image-link:hover img,
.bundle-image-link:hover img { transform: scale(1.018); }
.product-name a,
.mini-title-link,
.chooser-card h2 a,
.bundle-card h3 a { color:inherit; text-decoration:none; }
.product-name a:hover,
.mini-title-link:hover,
.chooser-card h2 a:hover,
.bundle-card h3 a:hover { text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px; }
.products-grid-three { grid-template-columns: repeat(3, minmax(0,1fr)); }
.product-subtitle { margin: 5px 0 2px; min-height:34px; color:var(--muted); font-size:12px; line-height:1.25; }
.organizer-family-card .product-image { object-position:center; }
.organizer-family-card .price { display:none; }

.organizer-glance { padding-top:2px; }
.organizer-glance-inner { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:18px 22px; border:1px solid #d6c6b7; border-radius:14px; background:#f3eee8; box-shadow:var(--shadow); }
.organizer-glance h2 { margin:3px 0 5px; font-size:22px; }
.organizer-glance p { margin:0; color:#4f4841; max-width:800px; }
.eyebrow { display:inline-block; color:var(--brown); font-size:12px; font-weight:900; letter-spacing:.09em; text-transform:uppercase; }

.chooser-page { padding:34px 0 54px; }
.chooser-hero { text-align:center; max-width:820px; margin:0 auto 24px; }
.chooser-hero h1 { margin:5px 0 10px; font-size:clamp(32px,4vw,48px); line-height:1.02; }
.chooser-hero p { margin:0 auto; color:#4f4841; font-size:17px; }
.chooser-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; align-items:stretch; }
.chooser-card { display:flex; flex-direction:column; background:var(--card); border:1px solid #ded3c8; border-radius:15px; overflow:hidden; box-shadow:var(--shadow); }
.chooser-card img { width:100%; aspect-ratio:1.05/1; object-fit:cover; }
.chooser-card.big-phone img { object-position:center 58%; }
.chooser-card-body { padding:16px; display:flex; flex-direction:column; flex:1; }
.chooser-badge { color:var(--brown); font-size:11px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.chooser-card h2 { margin:5px 0 8px; font-size:22px; line-height:1.05; }
.chooser-fit { margin:0 0 10px; color:#504943; font-weight:700; }
.chooser-card ul { padding-left:18px; margin:0 0 13px; color:#4a443e; font-size:14px; }
.chooser-card li { margin-bottom:6px; }
.chooser-price { margin-top:auto; margin-bottom:10px; font-size:24px; }
.chooser-actions { display:grid; grid-template-columns:1fr; gap:8px; margin-top:auto; }
.preview-note { margin:9px 0 12px; padding:10px 11px; background:#fff4d7; border:1px solid #e4c87f; border-radius:8px; color:#5a441e; font-size:12px; line-height:1.35; }
.preview-note-product { margin-top:20px; font-size:13px; }
.variant-return { margin-bottom:8px; font-size:12px; font-weight:700; color:var(--brown); }
.variant-return a { color:inherit; }
.product-fit-badge { display:inline-block; margin:11px 0 7px; padding:6px 9px; border:1px solid #d4b691; border-radius:999px; background:#fff8ef; color:var(--brown); font-size:11px; font-weight:900; letter-spacing:.045em; }
.gallery-main.portrait-friendly { object-fit:contain; background:#eee8e1; }
.compact-warning { font-size:12px; line-height:1.4; opacity:.94; }

.bundle-upsell { margin-top:26px; }
.bundle-upsell > h2 { margin:0 0 10px; font-size:21px; }
.bundle-cards-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.bundle-card { display:grid; grid-template-columns:155px minmax(0,1fr); gap:14px; padding:11px; border:1px solid #d7b995; border-radius:14px; background:linear-gradient(135deg,#fffaf2 0%,#f3e7d8 100%); box-shadow:var(--shadow); align-items:center; }
.bundle-card + .bundle-card { margin-top:12px; }
.bundle-cards-grid .bundle-card + .bundle-card { margin-top:0; }
.bundle-card img { width:155px; height:132px; object-fit:cover; border-radius:9px; }
.bundle-card-copy h3 { margin:3px 0 5px; font-size:17px; line-height:1.15; }
.bundle-card-copy p { margin:0 0 6px; font-size:13px; color:#514a43; }
.bundle-card .bundle-price { margin:2px 0 8px; font-size:23px; }
.bundle-actions { display:flex; gap:7px; flex-wrap:wrap; }
.bundle-actions .btn { min-height:35px; padding:7px 12px; font-size:10.5px; }
.inline-product-link { color:var(--brown); font-weight:700; }

/* The old text-only bundle components are superseded by .bundle-card. */
.bundle-offer, .bundle-options { }

@media (max-width:1050px) {
  .products-grid-three { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .chooser-grid { grid-template-columns:1fr; max-width:760px; margin:0 auto; }
  .chooser-card { display:grid; grid-template-columns:45% 55%; }
  .chooser-card img { height:100%; min-height:330px; aspect-ratio:auto; }
  .bundle-cards-grid { grid-template-columns:1fr; }
}

@media (max-width:760px) {
  .products-grid.products-grid-three { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .organizer-family-card { grid-column:1/-1; order:-1; }
  .organizer-family-card .product-image { aspect-ratio:1.75/1; }
  .organizer-family-card .product-name { min-height:0; font-size:15px; }
  .organizer-family-card .product-subtitle { min-height:0; font-size:11px; margin:6px 0 9px; }
  .organizer-glance-inner { display:grid; gap:12px; padding:14px; }
  .organizer-glance h2 { font-size:19px; }
  .organizer-glance p { font-size:13px; }
  .chooser-page { padding-top:20px; }
  .chooser-hero { margin-bottom:16px; }
  .chooser-hero h1 { font-size:31px; }
  .chooser-hero p { font-size:14px; }
  .chooser-card { display:flex; }
  .chooser-card img { min-height:0; height:auto; aspect-ratio:1.22/1; }
  .chooser-card-body { padding:13px; }
  .chooser-card h2 { font-size:20px; }
  .bundle-card { grid-template-columns:110px minmax(0,1fr); gap:10px; padding:9px; }
  .bundle-card img { width:110px; height:110px; }
  .bundle-card-copy h3 { font-size:14px; }
  .bundle-card-copy p { font-size:11.5px; }
  .bundle-card .bundle-price { font-size:20px; }
  .bundle-actions { display:grid; grid-template-columns:1fr; }
  .bundle-actions .btn { width:100%; }
}

@media (max-width:430px) {
  .organizer-family-card .product-image { aspect-ratio:1.65/1; }
  .bundle-card { grid-template-columns:92px minmax(0,1fr); }
  .bundle-card img { width:92px; height:104px; }
  .bundle-card-copy h3 { font-size:13px; }
}


/* ===== Sep 3 compact homepage + organizer updates ===== */
.hero-shell.compact-hero .hero.hero-simple {
  display: block;
  min-height: auto;
  background: transparent;
}
.hero-shell.compact-hero .hero-copy {
  padding: 34px 0 18px;
  max-width: 760px;
}
.utility-strip {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin: 0 0 18px;
}
.utility-pill {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  border-radius: 16px;
  background: #fffdfa;
  border: 1px solid #e2d8ce;
  text-decoration: none;
  box-shadow: var(--shadow);
}
.utility-pill img {
  width: 42px;
  height: 42px;
  object-fit: contain;
  flex: 0 0 42px;
}
.utility-pill strong {
  display: block;
  font-size: 15px;
  margin-bottom: 2px;
}
.utility-pill span {
  display: block;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.35;
}
.utility-pill .pill-btn {
  margin-left: auto;
  white-space: nowrap;
  color: #fff;
  background: var(--brown);
  padding: 10px 14px;
  border-radius: 10px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .03em;
}
.home-showcase-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(280px, .9fr);
  grid-template-areas:
    'organizers cupholder'
    'organizers clips';
  gap: 20px;
  align-items: start;
}
.organizer-showcase-card {
  grid-area: organizers;
  overflow: hidden;
}
.home-small-card:nth-of-type(2) { grid-area: cupholder; }
.home-small-card:nth-of-type(3) { grid-area: clips; }
.organizer-showcase-head {
  padding: 18px 18px 0;
  text-align: left;
}
.organizer-kicker {
  display: inline-block;
  margin-bottom: 8px;
  color: var(--brown);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.organizer-showcase-title {
  margin: 0 0 8px;
  font-size: 28px;
  line-height: 1.05;
}
.organizer-showcase-head p {
  margin: 0;
  color: var(--muted);
}
.organizer-options-home {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  padding: 16px 18px 8px;
}
.organizer-home-option {
  text-decoration: none;
  background: #fffdfa;
  border: 1px solid #e2d8ce;
  border-radius: 14px;
  overflow: hidden;
  min-width: 0;
}
.organizer-home-option img {
  width: 100%;
  aspect-ratio: 1 / 1.08;
  object-fit: cover;
  background: #f0ebe4;
}
.organizer-home-option .option-copy {
  padding: 11px 12px 13px;
  text-align: left;
}
.option-kicker {
  color: var(--brown);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-bottom: 5px;
}
.organizer-home-option h4 {
  margin: 0 0 6px;
  font-size: 20px;
  line-height: 1.08;
}
.organizer-home-option span {
  display: block;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.35;
}
.organizer-showcase-actions {
  padding: 0 18px 18px;
}
.organizer-showcase-actions .btn {
  min-width: 240px;
}
.chooser-grid {
  grid-template-columns: repeat(3, 1fr);
}
.product-image-link,
.mini-image-link,
.chooser-image-link,
.bundle-image-link {
  display: block;
}
.compact-warning { font-size: 13px; }

@media (max-width: 1100px) {
  .home-showcase-grid {
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
      'organizers organizers'
      'cupholder clips';
  }
  .chooser-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 760px) {
  .hero-shell.compact-hero .hero-copy {
    padding: 24px 0 12px;
  }
  .utility-strip {
    grid-template-columns: 1fr;
    gap: 10px;
    margin-bottom: 12px;
  }
  .utility-pill {
    align-items: flex-start;
    padding: 12px 13px;
  }
  .utility-pill .pill-btn {
    margin-left: 0;
    margin-top: 10px;
    display: inline-block;
  }
  .home-showcase-grid {
    grid-template-columns: 1fr;
    grid-template-areas:
      'organizers'
      'cupholder'
      'clips';
    gap: 12px;
  }
  .organizer-options-home {
    grid-template-columns: 1fr;
    padding: 12px 12px 4px;
  }
  .organizer-home-option img {
    aspect-ratio: 1 / .92;
  }
  .organizer-home-option h4 {
    font-size: 18px;
  }
  .organizer-showcase-head,
  .organizer-showcase-actions {
    padding-left: 12px;
    padding-right: 12px;
  }
  .organizer-showcase-title {
    font-size: 24px;
  }
  .chooser-grid {
    grid-template-columns: 1fr;
  }
}


/* ===== Sep 3 Rev3: dense above-the-fold desktop homepage ===== */
.top-intro {
  border-bottom: 1px solid #e1d9cf;
  background: #fbf9f6;
}
.top-intro-grid {
  min-height: 150px;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(480px, .85fr);
  gap: 24px;
  align-items: center;
  padding-top: 16px;
  padding-bottom: 16px;
}
.top-intro-copy h1 {
  margin: 0;
  font-family: Impact, 'Arial Black', Arial, sans-serif;
  font-size: clamp(38px, 3.15vw, 54px);
  line-height: .94;
  letter-spacing: .015em;
}
.top-intro-copy h1 span { color: var(--brown-2); }
.intro-bottom {
  display: flex;
  gap: 18px;
  align-items: center;
  margin-top: 14px;
}
.intro-bottom p { margin: 0; font-size: 16px; }
.intro-shop { min-height: 38px; padding: 8px 18px; }
.desktop-quick-links {
  display: grid;
  gap: 9px;
}
.quick-link {
  min-height: 55px;
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 8px 12px;
  border: 1px solid #e1d7cb;
  border-radius: 12px;
  background: #fffdfa;
  text-decoration: none;
}
.quick-link img {
  width: 36px;
  height: 36px;
  object-fit: contain;
  flex: 0 0 36px;
}
.quick-link strong { display: block; font-size: 14px; line-height: 1.15; }
.quick-link span { display: block; font-size: 12px; color: var(--muted); margin-top: 2px; }
.quick-link b {
  margin-left: auto;
  padding: 7px 11px;
  background: var(--brown);
  color: #fff;
  border-radius: 8px;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .03em;
}
.core-products-section { padding-top: 12px; }
.compact-product-title { margin-bottom: 12px; }
.core-products-grid {
  display: grid;
  grid-template-columns: 1.24fr .88fr .88fr;
  gap: 16px;
  align-items: stretch;
}
.core-card { min-height: 0; }
.core-image-link {
  height: 255px;
  background: #eee8e0;
  overflow: hidden;
}
.core-product-image {
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  object-fit: cover;
}
.core-body { padding: 11px 12px 12px; }
.core-body .product-name { min-height: 38px; }
.core-body .price { margin: 5px 0 8px; font-size: 19px; }
.core-body .btn { min-height: 36px; padding: 7px 10px; font-size: 11px; }
.organizer-family-visual {
  height: 255px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
  padding: 7px;
  background: #f1ece5;
}
.organizer-visual-item {
  position: relative;
  min-width: 0;
  overflow: hidden;
  border-radius: 9px;
  background: #fffdfa;
  text-decoration: none;
}
.organizer-visual-item img {
  width: 100%;
  height: calc(100% - 30px);
  object-fit: contain;
  object-position: center;
  background: #f6f1eb;
}
.organizer-visual-item span {
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 5px;
  text-align: center;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: var(--brown);
  background: #fffdfa;
}
.core-kicker {
  color: var(--brown);
  text-transform: uppercase;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .07em;
  margin-bottom: 3px;
}
.core-description {
  margin: 3px 0 9px;
  font-size: 12px;
  line-height: 1.35;
  color: var(--muted);
  text-align: center;
}
.mobile-quick-strip { display: none; }
.compact-glance { padding-top: 8px; }

@media (min-width: 1200px) and (max-height: 950px) {
  .top-intro-grid { min-height: 138px; padding-top: 12px; padding-bottom: 12px; }
  .top-intro-copy h1 { font-size: clamp(36px, 2.9vw, 49px); }
  .intro-bottom { margin-top: 10px; }
  .core-image-link, .organizer-family-visual { height: 230px; }
  .core-products-section { padding-top: 8px; }
  .compact-product-title { margin-bottom: 8px; }
}

@media (max-width: 1050px) {
  .top-intro-grid {
    grid-template-columns: 1fr;
    min-height: auto;
    gap: 12px;
  }
  .desktop-quick-links { grid-template-columns: 1fr 1fr; }
  .core-products-grid { grid-template-columns: 1fr 1fr; }
  .organizer-core-card { grid-column: 1 / -1; }
}

@media (max-width: 760px) {
  .top-intro-grid { padding-top: 18px; padding-bottom: 12px; }
  .top-intro-copy h1 { font-size: 35px; }
  .intro-bottom { align-items: flex-start; flex-direction: column; gap: 10px; }
  .desktop-quick-links { display: none; }
  .core-products-section { padding-top: 6px; }
  .core-products-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .organizer-core-card { grid-column: 1 / -1; }
  .organizer-family-visual { height: 220px; }
  .core-image-link { height: 190px; }
  .core-body .product-name { font-size: 13px; min-height: 45px; }
  .mobile-quick-strip { display: block; padding: 2px 0 12px; }
  .mobile-quick-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .mobile-quick-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid #e1d7cb;
    border-radius: 10px;
    background: #fffdfa;
    text-decoration: none;
  }
  .mobile-quick-item img { width: 30px; height: 30px; object-fit: contain; flex: 0 0 30px; }
  .mobile-quick-item strong { display: block; font-size: 10px; line-height: 1.1; }
  .mobile-quick-item small { display: block; font-size: 9px; color: var(--muted); line-height: 1.2; margin-top: 2px; }
}

@media (max-width: 430px) {
  .top-intro-copy h1 { font-size: 32px; }
  .core-products-grid { grid-template-columns: 1fr; }
  .organizer-core-card { grid-column: auto; }
  .organizer-family-visual { height: 205px; }
  .core-image-link { height: 220px; }
}


/* ===== Final Sep 3 header refinements ===== */
@media (min-width: 1051px) {
  .top-intro-grid {
    grid-template-columns: minmax(0, 1.05fr) 180px minmax(430px, .82fr);
    gap: 18px;
  }
  .top-intro-logo {
    align-self: center;
    justify-self: center;
    width: 164px;
    height: 118px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
  }
  .top-intro-logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
  }
  .shipping-quick strong {
    font-size: 13px;
  }
  .shipping-quick span {
    font-size: 11.5px;
  }
}
@media (max-width: 1050px) {
  .top-intro-logo { display: none; }
}
