/* ============================================================
 * Frugivore desktop catalog / browse pages — 2025 redesign
 * Shared layout for: search, subcategory, category, brand,
 * deals, offer, promos, frugivore-originals, signup-rewards,
 * shop-by-category, pre-order.
 *
 * Scope: each page wraps content in a class like
 *   .searchPage2025, .subcatPage2025, .catPage2025,
 *   .brandPage2025, .dealsPage2025, .offerPage2025,
 *   .promosPage2025, .originalsPage2025, .rewardsPage2025,
 *   .sbcPage2025, .preorderPage2025
 * All of those classes inherit the tokens below.
 * ============================================================ */

.catalog2025 {
    --cat-cream:     var(--rd-cream, #f5f1e8);
    --cat-cream-2:   var(--rd-cream-2, #ece5d2);
    --cat-cream-3:   var(--rd-cream-3, #faf6ec);
    --cat-green:     var(--rd-green, #1f3d2e);
    --cat-green-2:   var(--rd-green-2, #2c5141);
    --cat-green-3:   var(--rd-green-3, #133023);
    --cat-orange:    var(--rd-orange, #f08a3a);
    --cat-orange-2:  var(--rd-orange-2, #e6712b);
    --cat-gold:      var(--rd-gold, #d4a64b);
    --cat-ink:       var(--rd-ink, #1a2521);
    --cat-muted:     var(--rd-muted, #6b7568);
    --cat-card:      #ffffff;
    --cat-border:    var(--rd-border, #e3ddc9);
    --cat-line:      #ece5d3;
    --cat-shadow:    0 6px 24px rgba(20,40,30,.06);
    --cat-shadow-md: 0 12px 32px rgba(20,40,30,.10);
    --cat-shadow-lg: 0 22px 56px rgba(20,40,30,.14);
    --cat-radius-sm: 12px;
    --cat-radius:    20px;
    --cat-radius-lg: 28px;
    --cat-radius-pill: 999px;
    --cat-serif:     var(--rd-serif, "Playfair Display", Georgia, "Times New Roman", serif);
    --cat-sans:      var(--rd-sans, "Inter", system-ui, sans-serif);
    --cat-ease:      cubic-bezier(0.2, 0.8, 0.2, 1);
}

.catalog2025.mainContent,
.catalog2025 main.mainContent {
    background: transparent !important;
    margin-top: 24px !important;
    padding-bottom: 60px;
}
/* page bg fallback — body is already cream from redesign-header.css */

/* container override — slightly wider, comfortable padding */
.catalog2025 .container1440 {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 24px;
}

/* ============================================================
 * Bread crumbs — cream pill row
 * ============================================================ */
.catalog2025 .bread-crumbs-container {
    background: transparent !important;
    padding: 12px 0 6px !important;
    margin: 0 !important;
}
.catalog2025 .bread-crumbs-content {
    color: var(--cat-muted) !important;
    font-family: var(--cat-sans);
    font-size: 12px;
    letter-spacing: 0.02em;
    text-decoration: none;
    padding: 0 4px;
}
.catalog2025 .bread-crumbs-content:first-child { padding-left: 0; }
.catalog2025 .bread-crumbs-content:hover { color: var(--cat-green) !important; }
.catalog2025 .bread-crumbs-content:last-child { color: var(--cat-ink) !important; font-weight: 600; }

/* ============================================================
 * Hero — cream rounded card with serif title
 * ============================================================ */
.cat-hero {
    position: relative;
    background:
        radial-gradient(circle at 92% 8%, rgba(212,166,75,0.18), transparent 45%),
        radial-gradient(circle at 0% 100%, rgba(31,61,46,0.10), transparent 50%),
        linear-gradient(160deg, var(--cat-cream-3) 0%, var(--cat-cream-2) 100%);
    border: 1px solid var(--cat-border);
    border-radius: var(--cat-radius-lg);
    padding: 36px 44px;
    margin: 12px 0 28px;
    box-shadow: var(--cat-shadow);
    overflow: hidden;
}
.cat-hero-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: 0.16em;
    color: var(--cat-orange-2);
    font-weight: 700;
    margin-bottom: 10px;
}
.cat-hero-eyebrow::before { content: "✦"; color: var(--cat-gold); font-size: 12px; }
.cat-hero-title {
    font-family: var(--cat-serif) !important;
    font-style: italic;
    font-weight: 500;
    color: var(--cat-green);
    font-size: 44px;
    line-height: 1.05;
    margin: 0 0 10px;
    letter-spacing: -0.01em;
}
.cat-hero-title strong {
    font-family: var(--cat-sans);
    font-style: normal;
    font-weight: 600;
    color: var(--cat-ink);
}
.cat-hero-subtitle {
    color: var(--cat-muted);
    font-size: 15px;
    font-weight: 500;
    max-width: 640px;
    margin: 0;
}
.cat-hero-decor {
    position: absolute;
    right: -20px; bottom: -30px;
    font-size: 180px;
    line-height: 1;
    opacity: 0.10;
    pointer-events: none;
    user-select: none;
}
.cat-hero-meta {
    display: inline-flex;
    align-items: center;
    gap: 16px;
    margin-top: 14px;
    flex-wrap: wrap;
}
.cat-hero-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(255,255,255,0.7);
    border: 1px solid var(--cat-border);
    border-radius: var(--cat-radius-pill);
    padding: 6px 14px;
    font-size: 12px;
    font-weight: 600;
    color: var(--cat-green);
}
.cat-hero-chip i { color: var(--cat-orange-2); font-size: 11px; }

/* dark variant for premium/originals */
.cat-hero--dark {
    background:
        radial-gradient(circle at 90% 10%, rgba(212,166,75,0.30), transparent 45%),
        radial-gradient(circle at 0% 100%, rgba(53,90,71,0.55), transparent 50%),
        linear-gradient(135deg, var(--cat-green) 0%, var(--cat-green-3) 100%);
    border-color: transparent;
    color: var(--cat-cream);
}
.cat-hero--dark .cat-hero-eyebrow { color: var(--cat-gold); }
.cat-hero--dark .cat-hero-title { color: var(--cat-cream); }
.cat-hero--dark .cat-hero-title strong { color: var(--cat-gold); font-family: var(--cat-serif); font-style: italic; }
.cat-hero--dark .cat-hero-subtitle { color: rgba(245,241,232,0.78); }
.cat-hero--dark .cat-hero-chip { background: rgba(245,241,232,0.10); border-color: rgba(212,166,75,0.35); color: var(--cat-cream); }
.cat-hero--dark .cat-hero-chip i { color: var(--cat-gold); }

/* ============================================================
 * Layout — sticky filter rail + grid
 * ============================================================ */
.catalog2025 .cat-layout {
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr);
    gap: 28px;
    align-items: start;
}
@media (max-width: 991px) {
    .catalog2025 .cat-layout { grid-template-columns: 1fr; }
}
/* No-rail variant — filters live in the generic popup, so the grid is a
   single full-width column. */
.catalog2025 .cat-layout.cat-layout--no-rail {
    grid-template-columns: minmax(0, 1fr);
}

/* ---- Filter rail ---- */

.cat-filter-rail .clear-all-container {
    margin: 0 0 14px;
    padding: 0;
    background: transparent !important;
    border: none !important;
}
.cat-filter-rail .clear-all-container .flexBox.borderFlex.leftBox {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    color: var(--cat-green) !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    display: flex;
    align-items: center;
    gap: 8px;
}
.cat-filter-rail .clear-all-container .flexBox.borderFlex.leftBox::before {
    content: "✦";
    color: var(--cat-gold);
}

.cat-filter-rail .lbl-container {
    margin: 16px 0 8px;
    padding: 0;
}
.cat-filter-rail .lbl-container .filter-lbl {
    font-family: var(--cat-sans);
    font-size: 11px;
    font-weight: 700;
    color: var(--cat-green);
    letter-spacing: 0.10em;
    text-transform: uppercase;
    margin: 0;
}
.cat-filter-rail .sort-conatiner { margin: 4px 0; }
.cat-filter-rail .checkbox-design {
    font-size: 13px !important;
    color: var(--cat-ink) !important;
    font-weight: 500;
    cursor: pointer;
    padding: 4px 0 4px 26px !important;
    position: relative;
    display: block !important;
}
.cat-filter-rail .checkbox-design span {
    position: absolute;
    left: 0; top: 50%;
    transform: translateY(-50%);
    width: 16px; height: 16px;
    border: 1.5px solid var(--cat-border);
    border-radius: 4px;
    background: #fff;
    transition: all 0.18s var(--cat-ease);
}
.cat-filter-rail .checkbox-design input { display: none; }
.cat-filter-rail .checkbox-design input:checked + span {
    background: var(--cat-green);
    border-color: var(--cat-green);
}
.cat-filter-rail .checkbox-design input:checked + span::after {
    content: "";
    position: absolute;
    left: 4px; top: 1px;
    width: 5px; height: 9px;
    border: solid var(--cat-cream);
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}
.cat-filter-rail .checkbox-design:hover span { border-color: var(--cat-green); }
.cat-filter-rail .max-height-200 { max-height: 220px; overflow-y: auto; padding-right: 4px; }

.cat-filter-rail .modalActionBtn.footerMenu.footerFixed {
    position: sticky !important;
    bottom: -70px;
    left: 0;
    margin: 14px -16px -70px;
    padding: 14px 16px;
    background: var(--cat-cream-3) !important;
    border-top: 1px solid var(--cat-border);
    display: flex;
    gap: 8px;
}
.cat-filter-rail .modalActionBtn.footerMenu.footerFixed .applybtn,
.cat-filter-rail .modalActionBtn.footerMenu.footerFixed .btn {
    flex: 1 1 50%;
    width: auto !important;
    border-radius: var(--cat-radius-pill) !important;
    padding: 10px 16px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.cat-filter-rail .modalActionBtn.footerMenu.footerFixed .applybtn {
    background: var(--cat-green) !important;
    border: 1px solid var(--cat-green) !important;
    color: var(--cat-cream) !important;
}
.cat-filter-rail .modalActionBtn.footerMenu.footerFixed #clearall {
    background: #fff !important;
    border: 1px solid var(--cat-border) !important;
    color: var(--cat-ink) !important;
}

/* ============================================================
 * Toolbar — count + sort
 * ============================================================ */
.cat-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 4px 0 18px;
    flex-wrap: wrap;
}
.cat-toolbar-count {
    font-family: var(--cat-serif);
    font-style: italic;
    font-weight: 500;
    font-size: 22px;
    color: var(--cat-ink);
}
.cat-toolbar-count em {
    color: var(--cat-green);
}

/* ============================================================
 * Tab strip (subcategory/offers) — pill row
 * ============================================================ */
.catalog2025 .blogpageTab > .tab,
.catalog2025 .tab {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 18px;
    border: none !important;
    padding: 0 !important;
    background: transparent !important;
}
.catalog2025 .tab .tablinks {
    background: #fff !important;
    color: var(--cat-ink) !important;
    border: 1px solid var(--cat-border) !important;
    border-radius: var(--cat-radius-pill) !important;
    padding: 8px 16px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: 0.02em;
    text-decoration: none !important;
    transition: all 0.2s var(--cat-ease);
    cursor: pointer;
    line-height: 1.2;
    display: inline-block !important;
    width: auto !important;
}
.catalog2025 .tab .tablinks:hover {
    border-color: var(--cat-green) !important;
    color: var(--cat-green) !important;
}
.catalog2025 .tab .tablinks.active {
    background: var(--cat-green) !important;
    border-color: var(--cat-green) !important;
    color: var(--cat-cream) !important;
}

/* ============================================================
 * Product grid — 4 cols desktop / 5 on wide / using shared card
 * ============================================================ */
.catalog2025 .shop-product,
.catalog2025 .search-products-div,
.catalog2025 .more-listing-product,
.catalog2025 .more-products-div {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
    margin: 0 !important;
}
@media (min-width: 1400px) {
    .catalog2025 .shop-product,
    .catalog2025 .search-products-div,
    .catalog2025 .more-listing-product,
    .catalog2025 .more-products-div {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}
@media (max-width: 1199px) {
    .catalog2025 .shop-product,
    .catalog2025 .search-products-div,
    .catalog2025 .more-listing-product,
    .catalog2025 .more-products-div {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}
@media (max-width: 767px) {
    .catalog2025 .shop-product,
    .catalog2025 .search-products-div,
    .catalog2025 .more-listing-product,
    .catalog2025 .more-products-div {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14px;
    }
}

/* Neutralize Bootstrap col-* sizing on direct card children — the parent is a
   CSS grid, so each card must occupy its full grid cell. Bootstrap was adding
   max-width:25% + 15px gutters that distorted the card layout. */
.catalog2025 .shop-product > [class*="col-"],
.catalog2025 .search-products-div > [class*="col-"],
.catalog2025 .more-listing-product > [class*="col-"],
.catalog2025 .more-products-div > [class*="col-"] {
    flex: unset !important;
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin: 0 !important;
    position: static;
}
.catalog2025 .shop-product > .product-card-bottom,
.catalog2025 .search-products-div > .product-card-bottom,
.catalog2025 .more-listing-product > .product-card-bottom,
.catalog2025 .more-products-div > .product-card-bottom {
    margin-bottom: 0 !important;
}
/* Card chrome itself comes from components/product-card.css (site-wide).
   These catalog rules only set up the GRID CELL the card lives in:
   col-* wrapper → a → product-slider-box must all fill the grid cell. */
.catalog2025 .shop-product > [class*="col-"],
.catalog2025 .search-products-div > [class*="col-"],
.catalog2025 .more-listing-product > [class*="col-"],
.catalog2025 .more-products-div > [class*="col-"] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}
.catalog2025 .shop-product > [class*="col-"] > a,
.catalog2025 .search-products-div > [class*="col-"] > a,
.catalog2025 .more-listing-product > [class*="col-"] > a,
.catalog2025 .more-products-div > [class*="col-"] > a {
    display: flex;
    flex: 1;
    width: 100%;
    text-decoration: none;
}
.catalog2025 .shop-product .product-slider-box,
.catalog2025 .search-products-div .product-slider-box,
.catalog2025 .more-listing-product .product-slider-box,
.catalog2025 .more-products-div .product-slider-box {
    width: 100% !important;
    flex: 1;
    margin: 0 !important;
}

/* shared product card — soft cream card */
.catalog2025 .col-md-3,
.catalog2025 .col-md-3.col-lg-3,
.catalog2025 .col-3 {
    flex: unset !important;
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
}
/* Card chrome (.product-slider-box, .product-slider-img, price row, ADD btn,
   stepper) comes from components/product-card.css — keep this file from
   re-defining those so the shared component wins. */

/* ============================================================
 * Page number / loader text
 * ============================================================ */
.catalog2025 #page-number {
    margin: 24px 0 8px;
    font-size: 12px;
    color: var(--cat-muted);
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

/* ============================================================
 * Empty state
 * ============================================================ */
.cat-empty {
    background: var(--cat-cream-3);
    border: 1px dashed var(--cat-border);
    border-radius: var(--cat-radius-lg);
    padding: 64px 24px;
    text-align: center;
    margin: 24px 0;
}
.cat-empty-icon {
    font-size: 72px;
    line-height: 1;
    margin-bottom: 14px;
}
.cat-empty-title {
    font-family: var(--cat-serif);
    font-style: italic;
    font-weight: 500;
    color: var(--cat-green);
    font-size: 28px;
    margin: 0 0 8px;
}
.cat-empty-sub {
    color: var(--cat-muted);
    font-size: 14px;
    max-width: 420px;
    margin: 0 auto 20px;
}
.cat-empty-cta {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--cat-green);
    color: var(--cat-cream) !important;
    border: 1px solid var(--cat-green);
    border-radius: var(--cat-radius-pill);
    padding: 10px 24px;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none !important;
    letter-spacing: 0.04em;
}
.cat-empty-cta:hover {
    background: var(--cat-green-3);
    color: var(--cat-cream) !important;
}

/* ============================================================
 * "Did you mean" — feedback form (search)
 * ============================================================ */
.catalog2025 .did-you-mean-container {
    background: var(--cat-cream-3);
    border: 1px solid var(--cat-border);
    border-radius: var(--cat-radius);
    padding: 22px 24px;
    margin: 32px auto;
    max-width: 640px;
    text-align: center;
    box-shadow: var(--cat-shadow);
}
.catalog2025 .did-you-mean-container p:first-child {
    font-family: var(--cat-serif);
    font-style: italic;
    font-size: 20px;
    color: var(--cat-green);
}
.catalog2025 .did-you-mean-container .btn.btn-pink {
    background: var(--cat-green) !important;
    border-radius: var(--cat-radius-pill) !important;
    padding: 10px 28px !important;
    font-size: 13px !important;
}

/* ============================================================
 * More info text below the grid (category/subcategory)
 * ============================================================ */
.catalog2025 .categoryContent,
.catalog2025 .subCategoryContent {
    background: var(--cat-cream-3);
    border: 1px solid var(--cat-border);
    border-radius: var(--cat-radius);
    padding: 18px 22px;
    margin-top: 24px;
    color: var(--cat-ink);
    font-size: 13px;
    line-height: 1.55;
}

/* ============================================================
 * Banner image (legacy <img>) softened
 * ============================================================ */
.catalog2025 .legacy-banner img {
    border-radius: var(--cat-radius-lg);
    max-width: 100%;
    height: auto;
    box-shadow: var(--cat-shadow);
}

/* ============================================================
 * Offer tiles (deals / offer / promos)
 * ============================================================ */
@media (max-width: 991px) {  }
@media (max-width: 575px) {  }

.cat-offer-tile {
    position: relative;
    background: linear-gradient(135deg, var(--cat-cream-3) 0%, var(--cat-cream-2) 100%);
    border: 1px solid var(--cat-border);
    border-radius: var(--cat-radius-lg);
    overflow: hidden;
    box-shadow: var(--cat-shadow);
    padding: 0;
    transition: transform 0.25s var(--cat-ease), box-shadow 0.25s var(--cat-ease);
}
.cat-offer-tile:hover {
    transform: translateY(-3px);
    box-shadow: var(--cat-shadow-md);
}
.cat-offer-tile img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 0;
}
.cat-offer-badge {
    position: absolute;
    top: 14px; left: 14px;
    background: var(--cat-orange);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.06em;
    padding: 5px 12px;
    border-radius: var(--cat-radius-pill);
    text-transform: uppercase;
    box-shadow: 0 4px 12px rgba(240,138,58,0.35);
}

/* ============================================================
 * Promos — accordion polish
 * ============================================================ */
.promosPage2025 .accordion {
    background: #fff;
    border: 1px solid var(--cat-border);
    border-radius: var(--cat-radius);
    padding: 16px 20px;
    margin: 10px 0;
    cursor: pointer;
    font-size: 15px;
    font-weight: 600;
    color: var(--cat-green);
    width: 100%;
    text-align: left;
    transition: background 0.2s var(--cat-ease);
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-shadow: var(--cat-shadow);
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.promosPage2025 .accordion::before {
    content: "✦";
    color: var(--cat-gold);
    margin-right: 10px;
}
.promosPage2025 .accordion::after {
    content: "\f078";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 11px;
    color: var(--cat-muted);
    margin-left: auto;
    transition: transform 0.2s var(--cat-ease);
}
.promosPage2025 .accordion.active::after { transform: rotate(180deg); }
.promosPage2025 .accordion.active { background: var(--cat-green); color: var(--cat-cream); }
.promosPage2025 .accordion.active::before,
.promosPage2025 .accordion.active::after { color: var(--cat-gold); }

.promosPage2025 .panel {
    background: var(--cat-cream-3);
    border: 1px solid var(--cat-border);
    border-top: none;
    border-radius: 0 0 var(--cat-radius) var(--cat-radius);
    padding: 0 22px;
    overflow: hidden;
    max-height: 0;
    transition: max-height 0.3s var(--cat-ease), padding 0.3s var(--cat-ease);
}
.promosPage2025 .panel.show,
.promosPage2025 .panel[style*="block"] { padding: 18px 22px; max-height: 1200px; }
.promosPage2025 .panel img { border-radius: var(--cat-radius-sm); max-width: 100%; }
.promosPage2025 .panel p { color: var(--cat-ink); font-size: 14px; line-height: 1.55; }

/* ============================================================
 * Shop-by-category — categories grid
 * ============================================================ */
.sbcPage2025 .sbc-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 20px;
    margin-top: 28px;
}
@media (max-width: 991px) { .sbcPage2025 .sbc-grid { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 575px) { .sbcPage2025 .sbc-grid { grid-template-columns: repeat(2, 1fr); } }

.sbcPage2025 .sbc-tile {
    background: var(--cat-card);
    border: 1px solid var(--cat-border);
    border-radius: var(--cat-radius);
    padding: 18px 14px;
    text-align: center;
    transition: transform 0.25s var(--cat-ease), box-shadow 0.25s var(--cat-ease);
    text-decoration: none;
    display: block;
    box-shadow: var(--cat-shadow);
}
.sbcPage2025 .sbc-tile:hover { transform: translateY(-4px); box-shadow: var(--cat-shadow-md); text-decoration: none; }
.sbcPage2025 .sbc-tile-img {
    border-radius: 14px;
    overflow: hidden;
    background: var(--cat-cream-3);
    aspect-ratio: 1 / 1;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.sbcPage2025 .sbc-tile-img img { width: 88%; height: auto; }
.sbcPage2025 .sbc-tile-name {
    font-family: var(--cat-sans);
    font-size: 13px;
    font-weight: 600;
    color: var(--cat-ink);
    margin: 0;
}

/* ============================================================
 * Pre-order — order type choice cards
 * ============================================================ */
.preorderPage2025 .preorder-shell {
    max-width: 880px;
    margin: 0 auto;
}
.preorderPage2025 .preorder-headline {
    text-align: center;
    font-family: var(--cat-serif);
    font-style: italic;
    color: var(--cat-green);
    font-size: 34px;
    margin: 12px 0 6px;
}
.preorderPage2025 .preorder-sub {
    text-align: center;
    color: var(--cat-muted);
    font-size: 14px;
    margin: 0 0 26px;
}
.preorderPage2025 .express-container.express-delivery-box {
    background: #fff !important;
    border: 1px solid var(--cat-border) !important;
    border-radius: var(--cat-radius-lg) !important;
    box-shadow: var(--cat-shadow) !important;
    padding: 0 !important;
    margin: 14px 0 !important;
    overflow: hidden;
    display: block !important;
    transition: transform 0.2s var(--cat-ease), box-shadow 0.2s var(--cat-ease);
}
.preorderPage2025 .express-container.express-delivery-box:hover {
    transform: translateY(-3px);
    box-shadow: var(--cat-shadow-md) !important;
}
.preorderPage2025 .express-container.express-delivery-box > a {
    align-items: stretch !important;
    width: 100% !important;
    display: flex !important;
    text-decoration: none !important;
}
.preorderPage2025 .express-container .order-type p:first-child {
    color: var(--cat-green) !important;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    font-size: 13px;
}
.preorderPage2025 .express-container .order-type p:nth-child(2) {
    font-family: var(--cat-serif);
    font-style: italic;
    color: var(--cat-ink);
    font-size: 22px;
    font-weight: 600;
    margin-top: 4px !important;
}
.preorderPage2025 .express-container .btn {
    background: var(--cat-green) !important;
    color: var(--cat-cream) !important;
    border-radius: 0 !important;
}
.preorderPage2025 .express-container .btn p { font-size: 14px !important; font-weight: 700; letter-spacing: 0.04em; }

/* ============================================================
 * Pre-order cart — main table (reuse existing styles, tighten)
 * ============================================================ */
.preorderCartPage2025 .cartTable .table thead th {
    background: var(--cat-cream-3);
    color: var(--cat-green);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    border: none;
    padding: 12px;
}
.preorderCartPage2025 .cartTable {
    background: #fff;
    border: 1px solid var(--cat-border);
    border-radius: var(--cat-radius);
    box-shadow: var(--cat-shadow);
    overflow: hidden;
}

/* ============================================================
 * Rewards page (signup-rewards)
 * ============================================================ */
.rewardsPage2025 .rewards-hero img,
.rewardsPage2025 .formBox img {
    width: 100%;
    border-radius: var(--cat-radius-lg);
    box-shadow: var(--cat-shadow);
}
.rewardsPage2025 .formBox {
    background: var(--cat-cream-3);
    border: 1px solid var(--cat-border);
    border-radius: var(--cat-radius);
    padding: 28px !important;
    box-shadow: var(--cat-shadow);
    margin-top: 20px;
}
.rewardsPage2025 .formBox p,
.rewardsPage2025 .formBox .paraStyle { color: var(--cat-ink); font-size: 14px; line-height: 1.6; }

/* ============================================================
 * Originals (frugivore-originals) — story telling page
 * ============================================================ */
.originalsPage2025 .cat-hero--dark .cat-hero-title em {
    font-style: italic;
    color: var(--cat-gold);
}
.originalsPage2025 .originals-pillars {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin: 0 0 28px;
}
@media (max-width: 767px) { .originalsPage2025 .originals-pillars { grid-template-columns: 1fr; } }
.originalsPage2025 .originals-pillar {
    background: var(--cat-cream-3);
    border: 1px solid var(--cat-border);
    border-radius: var(--cat-radius);
    padding: 18px 20px;
    box-shadow: var(--cat-shadow);
}
.originalsPage2025 .originals-pillar i {
    color: var(--cat-orange-2);
    font-size: 22px;
    margin-bottom: 8px;
    display: block;
}
.originalsPage2025 .originals-pillar h4 {
    font-family: var(--cat-serif);
    font-style: italic;
    font-size: 18px;
    color: var(--cat-green);
    margin: 0 0 6px;
}
.originalsPage2025 .originals-pillar p {
    color: var(--cat-muted);
    font-size: 13px;
    line-height: 1.55;
    margin: 0;
}

/* ============================================================
 * Banner / hero image (subcategory banner ad inline)
 * ============================================================ */
.catalog2025 a img[data-src] { display: block; }
.catalog2025 section .container1440 + a img,
.catalog2025 .legacy-banner img { border-radius: var(--cat-radius); }

/* fallback: hide raw old "common section header" styles where we replace */
.catalog2025 .cat-hide-legacy { display: none !important; }