/* ============================================
   Aylemu Baby v3 — Premium Design System
   US/UK Market — Inspired by Maisonette, Hanna Andersson
   Color Psychology: Trust (sage) + Warmth (clay/blush)
   ============================================ */

:root {
    /* Primary Palette - Muted & Sophisticated */
    --sage: #7C9A8E;
    --sage-light: #E8F0EC;
    --sage-dark: #5A7568;
    --clay: #C4A882;
    --clay-light: #F5EDE3;
    --clay-dark: #A08B6E;
    --blush: #D4918E;
    --blush-light: #FCEAE9;
    --blush-dark: #B5706D;

    /* Neutrals */
    --bg: #FDFAF7;
    --bg-alt: #F7F3EE;
    --bg-dark: #1A1612;
    --text: #2C2420;
    --text-mid: #6B5E56;
    --text-light: #7A6E66;
    --border: #E8E2DC;
    --white: #FFFFFF;

    /* Accent for CTA */
    --cta: #B35A42;
    --cta-hover: #9A4A35;
    --cta-light: rgba(196,114,92,0.1);

    /* Effects */
    --shadow-xs: 0 1px 3px rgba(44,36,32,0.04);
    --shadow-sm: 0 2px 8px rgba(44,36,32,0.06);
    --shadow-md: 0 4px 24px rgba(44,36,32,0.08);
    --shadow-lg: 0 12px 48px rgba(44,36,32,0.12);
    --shadow-xl: 0 24px 64px rgba(44,36,32,0.16);

    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --radius-xl: 24px;
    --radius-2xl: 32px;
    --radius-full: 9999px;

    --ease: cubic-bezier(0.4, 0, 0.2, 1);
    --ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
    --duration: 0.35s;

    --font-display: 'Quicksand', 'Nunito', sans-serif;
    --font-body: 'Nunito', -apple-system, sans-serif;
}

/* === RESET === */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
:focus-visible { outline: 2px solid var(--sage-dark); outline-offset: 2px; }
html { scroll-behavior: smooth; scroll-padding-top: 100px; }
body { font-family: var(--font-body); background: var(--bg); color: var(--text); line-height: 1.65; overflow-x: hidden; -webkit-font-smoothing: antialiased; }
html.cart-open,
body.cart-open,
html.wishlist-open,
body.wishlist-open {
    overflow: hidden !important;
    scrollbar-width: none;
}
html.cart-open::-webkit-scrollbar,
body.cart-open::-webkit-scrollbar,
html.wishlist-open::-webkit-scrollbar,
body.wishlist-open::-webkit-scrollbar {
    display: none;
}
a { text-decoration: none; color: inherit; transition: color var(--duration) var(--ease); }
ul { list-style: none; }
button { cursor: pointer; border: none; background: none; font-family: var(--font-body); }
input { font-family: var(--font-body); }
img { max-width: 100%; display: block; }
.container { max-width: 1240px; margin: 0 auto; padding: 0 24px; }
.hidden { display: none !important; }

/* === UTILITY === */
.accent { color: var(--cta); }
.btn {
    display: inline-flex; align-items: center; gap: 8px;
    font-weight: 600; font-size: 0.95rem; border-radius: var(--radius-full);
    padding: 12px 28px; transition: all var(--duration) var(--ease);
    cursor: pointer; border: none; text-decoration: none;
    position: relative; z-index: 2;
}
.btn--primary { background: var(--cta); color: var(--white); box-shadow: 0 4px 16px rgba(196,114,92,0.3); }
.btn--primary:hover { background: var(--cta-hover); transform: translateY(-2px); box-shadow: 0 6px 24px rgba(196,114,92,0.4); }
.btn--ghost { background: transparent; color: var(--text); border: 1.5px solid var(--border); }
.btn--ghost:hover { border-color: var(--cta); color: var(--cta); }
.btn--white { background: var(--white); color: var(--bg-dark); box-shadow: var(--shadow-md); }
.btn--white:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg); }
.btn--lg { padding: 15px 36px; font-size: 1rem; }
.btn--full { width: 100%; justify-content: center; }

/* === REVEAL & SKELETON === */
@keyframes skeleton-loading {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}
.reveal-up { opacity: 1; transform: translateY(0); transition: none; }
.reveal-up.visible { opacity: 1; transform: translateY(0); }

/* === SECTION HEADER === */
.section-head { text-align: center; margin-bottom: 48px; }
.section-head__label {
    display: inline-block; font-size: 0.8rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: 2px; color: #9A4A35;
    margin-bottom: 12px;
}
.section-head__title { font-family: var(--font-display); font-size: 2.8rem; font-weight: 700; line-height: 1.2; }
.section-head__desc { color: var(--text-mid); font-size: 1.05rem; max-width: 520px; margin: 12px auto 0; }

/* Premium homepage flow */
#main-view {
    display: flex;
    flex-direction: column;
}
#hero { order: 1; }
.trust-strip { order: 2; }
#customer-favorites { order: 3; }
#recently-viewed-section { order: 4; }
#milestone-shopping { order: 5; }
#bundles { order: 6; }
#testimonials { order: 7; }
#faq { order: 8; }
.guarantee-banner { order: 9; }
#trending,
#categories,
#budget,
#promo,
#why-us,
#parent-tips,
#photo-reviews,
#insta-feed,
#baby-registry,
#gift-cards,
.trust-badges,
#newsletter {
    display: none !important;
}

/* ============================================
   ANNOUNCEMENT BAR
   ============================================ */
.announcement {
    background: linear-gradient(90deg, #1f2929, #202326);
    color: #ffffff;
    padding: 9px 54px 9px 18px;
    font-size: 0.82rem;
    text-align: center;
    position: relative;
}
.announcement__inner { max-width: 1120px; margin: 0 auto; overflow: hidden; }
.announcement__inner p {
    margin: 0;
    line-height: 1.35;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    width: 100%;
    min-width: 0;
}
.announcement--marquee .announcement__inner p {
    justify-content: flex-start;
    width: max-content;
    min-width: 100%;
    animation: announcementMarquee 22s linear infinite;
    will-change: transform;
}
.announcement--marquee:hover .announcement__inner p {
    animation-play-state: paused;
}
.announcement__marquee-group {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding-right: 24px;
    white-space: nowrap;
    flex: 0 0 auto;
}
.announcement__inner span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    white-space: nowrap;
}
.announcement__inner i { color: #f7c96b; font-size: 0.82rem; font-style: normal; width: 1em; text-align: center; }
html:not(.fa-ready) .announcement__inner .fas { display: none; }
.announcement__inner strong { font-weight: 900; color: #fff; }
@keyframes announcementMarquee {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}
.announcement__close {
    position: absolute; right: 16px; top: 50%; transform: translateY(-50%);
    width: 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center;
    border: 0; background: transparent; color: rgba(255,255,255,0.65);
    font-size: 0.8rem; transition: color var(--duration), background var(--duration);
    border-radius: var(--radius-full); cursor: pointer;
}
.announcement__close:hover { color: var(--white); background: rgba(255,255,255,0.1); }

/* Google's mobile usability check wants a 48px tap target. These controls are
   deliberately small for the compact header, so grow the touch area with an
   overlay instead of the visible box. */
@media (pointer: coarse) {
    .header__action-btn,
    .header__hamburger,
    .announcement__close { position: relative; }
    .header__action-btn::after,
    .header__hamburger::after,
    .announcement__close::after {
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        width: 48px;
        height: 48px;
        transform: translate(-50%, -50%);
    }
}

@media (max-width: 767px) {
    .announcement {
        padding: 7px 38px 7px 10px;
        font-size: 0.68rem;
        line-height: 1.45;
    }
    .announcement__inner {
        overflow: hidden;
        max-width: 100%;
    }
    .announcement__inner p,
    .announcement--marquee .announcement__inner p {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100%;
        transform: none !important;
        animation: none !important;
        gap: 3px 8px;
    }
    .announcement__marquee-group {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        gap: 3px 8px;
        padding-right: 0;
        white-space: normal;
        width: 100%;
    }
    .announcement__marquee-group[aria-hidden="true"] {
        display: none !important;
    }
    .announcement__inner span {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        white-space: normal;
        text-align: center;
        flex: 0 1 auto;
        max-width: 100%;
    }
    .announcement__inner p.announcement--expanded > span {
        display: inline-flex !important;
    }
    .announcement__inner i { font-size: 0.72rem; }
    .announcement__close {
        right: 8px;
        width: 26px;
        height: 26px;
        background: rgba(255,255,255,0.08);
        color: rgba(255,255,255,0.85);
    }
}

/* ============================================
   HEADER
   ============================================ */
.header {
    position: sticky; top: 0; z-index: 100;
    background: rgba(253,250,247,0.92);
    z-index: 1000; padding: 0; background: rgba(255, 255, 255, 0.95);
    border-bottom: 1px solid rgba(232,226,220,0.6);
    transition: box-shadow var(--duration) var(--ease);
}
.header.scrolled { box-shadow: var(--shadow-md); }
.header__container {
    display: flex; align-items: center; justify-content: flex-start; gap: 28px;
    width: 100%; max-width: 1240px; margin: 0 auto; padding: 0 24px; height: 64px;
    box-sizing: border-box; min-width: 0;
}
.header__logo { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; min-width: 0; }
.header__logo-icon { font-size: 1.6rem; }
.header__logo-text { display: flex; flex-direction: column; }
.header__brand { font-family: var(--font-display); font-size: 1.35rem; font-weight: 700; line-height: 1.1; }
.header__tagline { font-size: 0.65rem; color: var(--text-light); text-transform: uppercase; letter-spacing: 1.5px; font-weight: 600; }
.header__nav { flex: 1 1 auto; min-width: 0; margin-right: 0; }
.header__nav-list { display: flex; justify-content: center; gap: clamp(18px, 2.4vw, 32px); }
.header__nav-link {
    font-size: 0.9rem; font-weight: 500; color: var(--text-mid);
    position: relative; padding: 4px 0; white-space: nowrap;
}
.header__nav-link::after {
    content: ''; position: absolute; bottom: -2px; left: 0; width: 0; height: 2px;
    background: var(--cta); transition: width var(--duration) var(--ease);
}
.header__nav-link:hover, .header__nav-link.active { color: var(--text); }
.header__nav-link:hover::after, .header__nav-link.active::after { width: 100%; }
.header__actions { display: flex; align-items: center; gap: 4px; margin-left: 0; flex: 0 0 auto; min-width: 0; }
.header__actions-divider { width: 1px; height: 24px; background: var(--border); margin: 0 4px; }
.notif-wrapper { position: relative; display: flex; }
.loyalty-badge {
    background: linear-gradient(135deg, #FFD700, #FFA500);
    color: #333; font-weight: 800; font-size: 0.75rem;
    padding: 6px 12px; border-radius: var(--radius-full);
    display: flex; align-items: center; gap: 4px; cursor: pointer;
    box-shadow: 0 4px 12px rgba(255,165,0,0.2); transition: all 0.2s ease;
}
.loyalty-badge:hover { transform: scale(1.05); }
.header__action-btn {
    position: relative; width: 38px; height: 38px; border-radius: var(--radius-full);
    display: flex; align-items: center; justify-content: center;
    font-size: 0.95rem; color: var(--text); transition: all var(--duration) var(--ease);
}
.header__action-btn:hover { background: var(--clay-light); }
.header__action-btn.logged-in {
    max-width: 118px;
    gap: 3px;
    background: rgba(196,114,92,0.08);
    color: var(--text);
}
.header__action-btn.logged-in:hover { background: rgba(196,114,92,0.14); }
.header__badge {
    position: absolute; top: -2px; right: -4px; width: 18px; height: 18px;
    background: var(--cta); color: transparent; font-size: 0;
    border-radius: var(--radius-full); display: flex; align-items: center; justify-content: center;
    line-height: 1; border: 2px solid var(--white); overflow: hidden;
}
.header__badge::after {
    content: attr(data-count);
    font-size: 0.65rem; font-weight: 700; color: var(--white); line-height: 1;
}
.header__hamburger { display: none; flex-direction: column; gap: 5px; padding: 8px; }
.header__hamburger span { width: 22px; height: 2px; background: var(--text); transition: all var(--duration); border-radius: 2px; pointer-events: none; }

@media (max-width: 1100px) {
    .header__container { justify-content: space-between; gap: 12px; }
    .header__hamburger { display: flex; z-index: 10000; flex: 0 0 auto; }
    .header__logo { flex: 1 1 auto; min-width: 0; }
    .header__logo-text { min-width: 0; }
    .header__brand { display: block; max-width: 170px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .header__nav {
        display: none;
        position: fixed;
        inset: 0;
        z-index: 9999;
        background: rgba(255,255,255,0.98);
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 72px 24px 32px;
    }
    .header__nav.active { display: flex; }
    body.menu-open { overflow: hidden; }
    .header__nav-list { flex-direction: column; align-items: center; gap: 26px; text-align: center; }
    .header__nav-link { font-size: 1.25rem; font-weight: 800; }
    #mobile-toggle.active span:nth-child(1), .header__hamburger.active span:nth-child(1) { transform: translateY(7.5px) rotate(45deg); }
    #mobile-toggle.active span:nth-child(2), .header__hamburger.active span:nth-child(2) { opacity: 0; }
    #mobile-toggle.active span:nth-child(3), .header__hamburger.active span:nth-child(3) { transform: translateY(-7.5px) rotate(-45deg); }
    .header__actions { flex: 0 0 auto; justify-content: flex-end; }
}

@media (max-width: 980px) {
    .currency-switcher, .lang-switcher, #darkmode-toggle, .header__actions-divider, .loyalty-badge { display: none !important; }
    .header__action-btn { width: 34px; height: 34px; font-size: 0.88rem; }
    #account-btn { width: 34px !important; padding: 0 !important; }
    #account-btn span, #account-btn .desktop-only { display: none !important; }
}

/* ============================================
   PREMIUM SEARCH OVERLAY
   ============================================ */
.search-overlay {
    position: fixed; inset: 0; background: rgba(18, 24, 27, 0.58);
    backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
    z-index: 10000; animation: fadeIn 0.24s var(--ease);
    display: flex; align-items: flex-start; justify-content: center; overflow-y: auto;
    padding: clamp(18px, 8vh, 76px) 18px 28px;
}
.search-overlay.hidden { display: none !important; }
.search-overlay__panel {
    width: min(900px, 100%); background: var(--white); border-radius: 32px;
    box-shadow: 0 28px 90px rgba(0,0,0,0.28); overflow: hidden;
    border: 1px solid rgba(255,255,255,0.82); animation: searchPanelIn 0.24s var(--ease);
}
.search-overlay__header {
    display: flex; align-items: center; justify-content: space-between;
    width: 100%; padding: 22px 24px; position: relative; border-bottom: 1px solid var(--border);
}
.search-overlay__input-wrapper {
    flex: 1; display: flex; align-items: center; gap: 14px;
    min-height: 54px; border: 1.5px solid var(--border); border-radius: 999px;
    padding: 0 18px; background: var(--bg);
    transition: border-color var(--duration), box-shadow var(--duration), background var(--duration);
}
.search-overlay__input-wrapper:focus-within { background: var(--white); border-color: var(--cta); box-shadow: 0 0 0 4px rgba(196,114,92,0.12); }
.search-overlay__input-wrapper i { font-size: 1.15rem; color: var(--cta); }
.search-overlay__input {
    flex: 1; min-width: 0; border: none; font-size: 1.05rem; outline: none; font-weight: 700;
    font-family: var(--font-body); background: transparent; color: var(--text);
}
.search-overlay__input::placeholder { color: var(--text-light); font-weight: 600; opacity: 0.88; }
.search-overlay__close { 
    width: 44px; height: 44px; display: flex; align-items: center; justify-content: center;
    font-size: 1.15rem; color: var(--text-mid); transition: all 0.2s;
    cursor: pointer; margin-left: 12px; border: none; border-radius: var(--radius-full); background: var(--bg-alt);
}
.search-overlay__close i { pointer-events: none; }
.search-overlay__close:hover { transform: scale(1.04); color: var(--cta); background: var(--clay-light); }
.search-overlay__content { width: 100%; padding: 18px 24px 24px; }
.search-overlay__results { margin-top: 18px; max-height: min(56vh, 520px); overflow-y: auto; padding-right: 4px; }
.search-section-head {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    margin-bottom: 12px; color: var(--text); font-weight: 800;
}
.search-section-head span { font-family: var(--font-display); font-size: 1rem; }
.search-section-head button,
.search-view-all {
    border: none; background: var(--clay-light); color: var(--cta); border-radius: var(--radius-full);
    padding: 9px 14px; font-size: 0.82rem; font-weight: 800; cursor: pointer;
}
.search-trending-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.search-trending-card {
    display: flex; flex-direction: column; gap: 8px; text-align: left; border: 1px solid var(--border);
    border-radius: 20px; background: linear-gradient(180deg, var(--white), var(--bg-alt));
    padding: 10px; cursor: pointer; transition: all var(--duration); color: inherit;
}
.search-trending-card:hover { border-color: rgba(196,114,92,0.35); box-shadow: var(--shadow-md); transform: translateY(-2px); }
.search-trending-card__media {
    aspect-ratio: 1 / 0.78; border-radius: 16px; overflow: hidden; background: var(--bg);
    display: flex; align-items: center; justify-content: center; font-size: 1.8rem;
}
.search-trending-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.search-trending-card__name {
    font-size: 0.88rem; font-weight: 800; line-height: 1.25;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.search-trending-card__price { color: var(--cta); font-size: 0.9rem; font-weight: 900; }
.search-results__summary {
    display: inline-flex; align-items: center; gap: 8px; margin: 0 0 12px; color: var(--text-mid);
    font-size: 0.82rem; font-weight: 800; padding: 7px 12px; border-radius: var(--radius-full);
    background: var(--bg-alt);
}
.search-result-item {
    width: 100%; display: flex; align-items: center; gap: 14px; padding: 12px; margin-bottom: 8px;
    border-radius: var(--radius-lg); cursor: pointer; transition: all var(--duration);
    border: 1px solid var(--border); background: rgba(255,255,255,0.74);
    color: inherit; text-align: left; font-family: var(--font-body); text-decoration: none;
}
.search-result-item:hover { background: var(--white); border-color: rgba(196,114,92,0.35); box-shadow: var(--shadow-md); transform: translateY(-2px); }
.search-result-item__media {
    width: 58px; height: 58px; border-radius: 16px; background: var(--bg-alt);
    display: flex; align-items: center; justify-content: center; overflow: hidden; flex-shrink: 0;
    font-size: 1.5rem;
}
.search-result-item__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.search-result-item__body { flex: 1; min-width: 0; }
.search-result-item strong { font-size: 1.05rem; display: block; font-weight: 700; font-family: var(--font-display); margin-bottom: 4px; }
.search-result-item small { color: var(--text-mid); font-size: 0.85rem; font-weight: 500; }
.search-result-item__arrow { color: var(--text-light); font-size: 0.78rem; }
.search-view-all { width: 100%; margin-top: 6px; padding: 12px 16px; background: var(--text); color: var(--white); border-radius: 16px; }
.search-empty {
    min-height: 160px; display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 8px; text-align: center; color: var(--text-light); padding: 28px 18px;
    border: 1px dashed var(--border); border-radius: 22px; background: var(--bg);
}
.search-empty i { font-size: 1.6rem; color: var(--cta); opacity: 0.78; }
.search-empty strong { color: var(--text); font-family: var(--font-display); font-size: 1.1rem; }
.search-empty span { font-size: 0.9rem; max-width: 360px; line-height: 1.5; }
@keyframes searchPanelIn { from { opacity: 0; transform: translateY(-12px) scale(0.98); } to { opacity: 1; transform: translateY(0) scale(1); } }

/* ============================================
   HERO
   ============================================ */
.hero {
    position: relative; min-height: 58vh;
    display: flex; align-items: center; overflow: hidden;
    padding: 64px 0 58px;
}
.hero__bg {
    position: absolute; inset: 0; z-index: 0;
}
.hero__gradient {
    position: absolute; inset: 0;
    background: linear-gradient(135deg, var(--bg) 0%, var(--clay-light) 35%, var(--sage-light) 65%, var(--blush-light) 100%);
}
.hero__ambient {
    position: absolute;
    inset: -12%;
    overflow: hidden;
    opacity: 0.46;
    filter: blur(22px);
    pointer-events: none;
}
.hero__ambient span {
    position: absolute;
    width: 34vw;
    height: 34vw;
    min-width: 260px;
    min-height: 260px;
    border-radius: 999px;
    background: radial-gradient(circle, rgba(196,114,92,0.28), rgba(196,114,92,0));
    animation: heroAmbientDrift 18s ease-in-out infinite alternate;
}
.hero__ambient span:nth-child(1) { left: 2%; top: 18%; }
.hero__ambient span:nth-child(2) {
    right: 4%;
    top: 10%;
    background: radial-gradient(circle, rgba(132,162,141,0.34), rgba(132,162,141,0));
    animation-duration: 22s;
    animation-delay: -5s;
}
.hero__ambient span:nth-child(3) {
    left: 34%;
    bottom: -8%;
    background: radial-gradient(circle, rgba(246,218,204,0.50), rgba(246,218,204,0));
    animation-duration: 26s;
    animation-delay: -9s;
}
@keyframes heroAmbientDrift {
    from { transform: translate3d(-18px, 10px, 0) scale(0.98); }
    to { transform: translate3d(22px, -16px, 0) scale(1.08); }
}
.hero__pattern {
    position: absolute; inset: 0; opacity: 0.03;
    background-image: radial-gradient(circle at 1px 1px, var(--text) 1px, transparent 0);
    background-size: 40px 40px;
}
@media (prefers-reduced-motion: reduce) {
    .hero__ambient span { animation: none; }
}
.hero__container {
    max-width: 1240px; margin: 0 auto; padding: 0 24px;
    display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center;
    position: relative; z-index: 1;
}
.hero__label {
    display: inline-flex; align-items: center; gap: 8px;
    font-size: 0.82rem; font-weight: 600; text-transform: uppercase; letter-spacing: 1.5px;
    color: var(--cta); margin-bottom: 20px;
}
.hero__label-dot { width: 8px; height: 8px; border-radius: var(--radius-full); background: var(--cta); animation: pulse 2s infinite; }
.hero__title { font-family: var(--font-display); font-size: 3.8rem; font-weight: 800; line-height: 1.1; margin-bottom: 20px; color: var(--text); }
.hero__title-accent {
    background: linear-gradient(135deg, var(--cta), var(--blush), var(--sage));
    -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.hero__desc { font-size: 1.1rem; color: var(--text-mid); line-height: 1.8; margin-bottom: 32px; max-width: 480px; }
.hero__actions { display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 40px; position: relative; z-index: 3; }
.hero__trust { display: flex; gap: 24px; flex-wrap: wrap; }
.hero__trust-item { display: flex; align-items: center; gap: 6px; font-size: 0.85rem; font-weight: 600; color: var(--text-mid); }
.hero__trust-item i { color: var(--sage); }

/* Hero Showcase */
.hero__showcase {
    position: relative;
    width: min(100%, 430px);
    margin: 0 auto;
    isolation: isolate;
}
.hero__showcase-main { position: relative; z-index: 2; }
.hero__showcase-card {
    background: rgba(255,255,255,0.9); border-radius: 28px; padding: 18px;
    box-shadow: var(--shadow-xl); max-width: 410px; margin: 0 auto;
    overflow: hidden; transition: transform var(--duration) var(--ease);
    border: 1px solid rgba(255,255,255,0.7);
    backdrop-filter: blur(12px);
}
.hero__showcase-card:hover { transform: translateY(-8px); }
.hero__showcase-card--hydrating:not(.hero__showcase-card--static) .hero__showcase-img:not(:has(img)) {
    background: linear-gradient(90deg, #f1e7dd 25%, #f9f3ed 50%, #f1e7dd 75%);
    background-size: 200% 100%;
    animation: skeleton-loading 1.5s infinite;
}
.hero__showcase-card--hydrating:not(.hero__showcase-card--static) .hero__showcase-info {
    opacity: 0;
}
.hero__showcase-img {
    height: 250px; background: linear-gradient(135deg, var(--clay-light), var(--sage-light));
    border-radius: var(--radius-lg); display: flex; align-items: center; justify-content: center;
    font-size: 6rem; margin-bottom: 14px; overflow: hidden; position: relative;
}
.hero__showcase-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.hero__showcase-info {
    padding: 0 6px 4px;
    display: grid;
    gap: 8px;
    justify-items: center;
    text-align: center;
}
.hero__showcase-tag {
    display: inline-block; background: var(--cta); color: var(--white);
    padding: 4px 12px; border-radius: var(--radius-full); font-size: 0.72rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 8px;
}
.hero__showcase-name {
    font-family: var(--font-display);
    font-size: clamp(1.05rem, 2vw, 1.35rem);
    font-weight: 700;
    line-height: 1.22;
    max-width: 22rem;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.hero__showcase-price {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 4px;
}
.hero__showcase-price-now { font-size: 1.2rem; font-weight: 900; color: var(--cta); }
.hero__showcase-price-old {
    color: var(--text-light);
    text-decoration: line-through;
    font-size: 0.9rem;
    font-weight: 800;
}
.hero__showcase-price-save {
    padding: 3px 8px;
    border-radius: 999px;
    background: rgba(196,114,92,0.12);
    color: var(--cta);
    font-size: 0.66rem;
    font-weight: 900;
    text-transform: uppercase;
}
.hero__showcase-benefits {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px;
    margin: 2px 0 4px;
}
.hero__showcase-benefits span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 9px;
    border-radius: 999px;
    background: rgba(132, 162, 141, 0.12);
    color: var(--text-mid);
    font-size: 0.72rem;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
}
.hero__showcase-benefits i { color: var(--sage); font-size: 0.7rem; }
.hero__showcase-cta {
    border: 0;
    background: var(--sage-dark);
    color: var(--white);
    border-radius: 999px;
    padding: 8px 16px;
    font-size: 0.8rem;
    font-weight: 800;
    cursor: pointer;
    margin-top: 4px;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.hero__showcase-cta:hover { transform: translateY(-1px); box-shadow: var(--shadow-md); }

@media (max-width: 640px) {
    .hero__ambient {
        opacity: 0.28;
        filter: blur(18px);
    }
    .hero__ambient span {
        animation-duration: 28s;
    }
    .hero__showcase-card {
        max-width: 360px;
        padding: 12px;
        border-radius: 24px;
    }
    .hero__showcase-img {
        height: 250px;
        margin-bottom: 10px;
        border-radius: 20px;
        background: #f5ede5;
    }
    .hero__showcase-img img {
        object-fit: cover;
        object-position: center 42%;
        background: #f5ede5;
    }
    .hero__showcase-info {
        gap: 6px;
        padding: 0 4px 2px;
    }
    .hero__showcase-tag {
        margin-bottom: 3px;
        padding: 4px 11px;
        font-size: 0.66rem;
    }
    .hero__showcase-name {
        max-width: 19rem;
        font-size: 1.02rem;
        line-height: 1.18;
        -webkit-line-clamp: 2;
    }
    .hero__showcase-price {
        margin-top: 1px;
    }
    .hero__showcase-price-now { font-size: 1.05rem; }
    .hero__showcase-price-old { font-size: 0.78rem; }
    .hero__showcase-price-save { font-size: 0.6rem; padding: 3px 7px; }
    .hero__showcase-cta {
        padding: 7px 14px;
        font-size: 0.76rem;
        margin-top: 1px;
    }
}

.hero__scroll-indicator {
    display: none;
}
.hero__scroll-mouse {
    width: 24px; height: 38px; border: 2px solid var(--text-light); border-radius: 12px;
    display: flex; justify-content: center; padding-top: 8px;
}
.hero__scroll-wheel {
    width: 3px; height: 8px; background: var(--text-light); border-radius: 3px;
    animation: scrollWheel 2s infinite;
}

/* ============================================
   TRENDING NOW
   ============================================ */
.trending { padding: 50px 0 40px; background: var(--bg); }
.trending__grid {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px;
}
.trending__cta { text-align: center; margin-top: 32px; }

/* ============================================
   CATEGORIES
   ============================================ */
.categories { padding: 30px 0; }
.categories__grid {
    display: flex; gap: 16px; overflow-x: auto; padding-bottom: 16px;
    scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none;
}
.categories__grid::-webkit-scrollbar { display: none; }
.cat-card {
    flex: 0 0 auto; min-width: 100px; scroll-snap-align: start;
    text-align: center; padding: 18px 8px; border-radius: var(--radius-xl);
    cursor: pointer; transition: all var(--duration) var(--ease-bounce);
    border: 2px solid transparent; position: relative;
}
.cat-card:hover, .cat-card.active { transform: translateY(-6px); box-shadow: var(--shadow-lg); background: var(--white); }
.cat-card.active { border-color: var(--cta); }
.cat-card__icon {
    width: 50px; height: 50px; border-radius: var(--radius-lg);
    display: flex; align-items: center; justify-content: center;
    margin: 0 auto 8px; font-size: 1.6rem;
    transition: transform var(--duration) var(--ease-bounce);
}
.cat-card:hover .cat-card__icon { transform: scale(1.15) rotate(5deg); }
.cat-card__name { font-weight: 700; font-size: 0.78rem; margin-bottom: 2px; }
.cat-card__count { font-size: 0.68rem; color: var(--text-light); }

/* ============================================
   PRODUCTS
   ============================================ */
.products { padding: 58px 0; background: var(--bg-alt); }
.products__tabs {
    display: flex; justify-content: center; gap: 8px; margin-bottom: 40px; flex-wrap: wrap;
}
.tab-btn {
    padding: 9px 24px; border-radius: var(--radius-full); font-weight: 600; font-size: 0.88rem;
    color: var(--text-mid); background: var(--white); border: 1.5px solid var(--border);
    transition: all var(--duration) var(--ease);
}
.tab-btn:hover { border-color: var(--cta); color: var(--cta); }
.tab-btn.active {
    background: var(--cta); color: var(--white); border-color: var(--cta);
    box-shadow: 0 4px 16px rgba(196,114,92,0.3);
}
.products__grid {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px;
    min-height: 360px;
}
#all-products-grid { min-height: 520px; }

/* Product Card */
.p-card {
    background: var(--white); border-radius: var(--radius-xl); overflow: hidden;
    border: 1px solid var(--border); transition: all var(--duration) var(--ease-bounce);
    position: relative; cursor: pointer;
    box-shadow: 0 10px 28px rgba(31,41,55,0.05);
}
.p-card:hover { transform: translateY(-6px); box-shadow: 0 18px 44px rgba(31,41,55,0.12); border-color: rgba(196,114,92,0.18); }
.p-card__media {
    position: relative; height: 220px; display: flex; align-items: center; justify-content: center;
    overflow: hidden; background: #f6f1eb;
}
.p-card__media > img {
    position: relative;
    z-index: 1;
    display: block;
}
.p-card__media-bg {
    position: absolute; inset: 0; background: #eef2f3;
    border-radius: var(--radius-lg); z-index: 0;
    transition: transform 0.6s var(--ease);
}
.p-card:hover .p-card__media-bg { transform: scale(1.03); }
.p-card__emoji {
    font-size: 4.5rem; position: relative; z-index: 1;
    transition: transform 0.5s var(--ease-bounce);
    filter: drop-shadow(0 8px 16px rgba(0,0,0,0.1));
}
.p-card:hover .p-card__emoji { transform: scale(1.12) rotate(3deg); }
.p-card__placeholder {
    position: relative;
    z-index: 1;
    width: calc(100% - 32px);
    height: calc(100% - 32px);
    border-radius: 18px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: rgba(255,255,255,0.42);
    border: 1px solid rgba(255,255,255,0.58);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.55), 0 12px 28px rgba(38,50,56,0.08);
    overflow: hidden;
    backdrop-filter: blur(6px);
}
.p-card__placeholder--muted { opacity: 0.65; }
.p-card__placeholder-shine {
    position: absolute;
    inset: 0;
    background: linear-gradient(120deg, transparent 20%, rgba(255,255,255,0.55) 45%, transparent 70%);
    transform: translateX(-100%);
    animation: placeholder-shine 4s ease-in-out infinite;
}
.p-card__placeholder-label {
    position: relative;
    z-index: 1;
    padding: 4px 10px;
    border-radius: 999px;
    background: rgba(255,255,255,0.74);
    color: var(--text-mid);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
@keyframes placeholder-shine {
    0%, 45% { transform: translateX(-100%); }
    70%, 100% { transform: translateX(100%); }
}
.p-card__badge {
    position: absolute; top: 1rem; left: 1rem; z-index: 2;
    background: var(--sage); color: var(--white);
    padding: 4px 10px; font-size: 0.75rem; font-weight: 700;
    border-radius: 20px; letter-spacing: 0.5px;text-transform: uppercase;
}
.p-card__badge--sale {
    background: #d93025; font-weight: bold; box-shadow: 0 2px 4px rgba(217, 48, 37, 0.3);
}
.p-card__badge--sold-out {
    background: #6b7280; color: var(--white); font-weight: 700;
    box-shadow: 0 2px 8px rgba(107,114,128,0.3);
}
.p-card--sold-out { opacity: 0.85; }
.p-card--sold-out:hover { transform: translateY(-4px); }
.p-card__add--disabled {
    background: #9ca3af !important; cursor: pointer; box-shadow: none !important;
}
.p-card__add--disabled:hover { background: #6b7280 !important; transform: scale(1.05); }
.p-card__stock--out {
    color: #6b7280 !important; font-size: 0.72rem; font-weight: 600;
    animation: none !important;
}

.p-card__quick {
    display: none;
}
.p-card__quick-btn {
    width: 44px; height: 44px; border-radius: var(--radius-full);
    background: var(--white); color: var(--text); font-size: 1.1rem;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1); transition: all 0.2s;
}
.p-card__quick-btn:hover { background: var(--cta); color: var(--white); transform: scale(1.1); }
.p-card__body { padding: 14px; display: flex; flex-direction: column; flex: 1; }
/* duplicate removed */
.p-card__cat { font-size: 0.68rem; font-weight: 800; text-transform: uppercase; letter-spacing: 1.8px; color: var(--sage-dark); margin-top: 2px; }
.p-card__name { font-family: var(--font-display); font-size: 1rem; font-weight: 700; margin: 7px 0 6px; line-height: 1.28; color: var(--text); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.p-card__stars { display: flex; align-items: center; gap: 4px; margin-bottom: 12px; }
.p-card__stars i { color: #E8B931; font-size: 0.7rem; }
.p-card__stars span { font-size: 0.78rem; color: var(--text-light); margin-left: 4px; }
.p-card__rating { display: flex; align-items: center; gap: 3px; color: #DDAA2A; font-size: 0.86rem; font-weight: 800; margin-bottom: 10px; }
.p-card__rating span { color: var(--text-light); font-weight: 600; margin-left: 4px; }
.p-card__bottom { display: flex; justify-content: space-between; align-items: center; margin-top: auto; padding-top: 10px; border-top: 1px solid var(--border-light); }
.p-card__price { font-family: var(--font-display); font-size: 1.15rem; font-weight: 700; color: var(--text); }
.p-card__old-price { font-size: 0.9rem; color: var(--text-light); text-decoration: line-through; margin-left: 6px; }
.p-card__cart-btn {
    background: var(--cta); color: var(--white); border-radius: var(--radius-md); box-shadow: 0 2px 8px rgba(0,0,0,0.05); padding: 8px 24px; font-weight: 700; font-size: 0.85rem; width: 100%; margin-top: 12px; transition: all 0.2s ease;
}
.p-card__cart-btn:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(200, 107, 76, 0.4); }
.p-card__bottom > div:first-child { width: 100%; text-align: center; }
.p-card__price-row {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: end; margin-top: auto; padding-top: 10px;
}
.p-card__price-wrapper {
    display: flex; flex-direction: column; align-items: flex-start; gap: 2px;
}
.p-card__add {
    min-width: 58px; height: 38px; padding: 0 14px; border-radius: var(--radius-full); border: none;
    background: var(--cta); color: var(--white); font-size: 0.82rem; font-weight: 800;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer; transition: all 0.2s ease;
    gap: 7px; flex-shrink: 0; box-shadow: 0 7px 16px rgba(200, 107, 76, 0.22);
}
.p-card__add:hover { transform: translateY(-1px); box-shadow: 0 10px 20px rgba(200, 107, 76, 0.34); background: #b85a3c; }
.p-card__add--options { min-width: 104px; }
.p-card__add--notify { background: #4B5563; }

/* ============================================
   PROMO BANNER
   ============================================ */
.promo { padding: 24px 0; }
.promo__card {
    background: linear-gradient(135deg, #3D2E23 0%, #2A2018 60%, #1E1610 100%);
    border-radius: 28px; padding: 22px 30px;
    position: relative; overflow: hidden; min-height: auto;
    box-shadow: 0 18px 50px rgba(45,32,24,0.12);
}
.promo__card::before {
    content: ''; position: absolute; width: 240px; height: 240px;
    border-radius: var(--radius-full);
    background: radial-gradient(circle, rgba(196,114,92,0.15), transparent);
    right: -70px; top: -100px;
}
.promo__left {
    position: relative; z-index: 1; display: grid;
    grid-template-columns: auto minmax(240px, 1fr) auto auto;
    gap: 16px; align-items: center;
}
.promo__badge {
    display: inline-block; background: rgba(255,255,255,0.1); color: var(--clay);
    padding: 6px 13px; border-radius: var(--radius-full);
    font-size: 0.68rem; font-weight: 800; text-transform: uppercase; letter-spacing: 1px;
    border: 1px solid rgba(196,168,130,0.2); white-space: nowrap;
}
.promo__title { color: var(--white); font-family: var(--font-display); font-size: 1.22rem; font-weight: 700; line-height: 1.2; margin-bottom: 0; }
.promo__discount {
    background: linear-gradient(135deg, var(--clay), var(--cta));
    -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
    font-size: 1.38rem;
    white-space: nowrap;
}
.promo__text { color: rgba(255,255,255,0.64); margin-bottom: 0; font-size: 0.8rem; max-width: 220px; }
.promo__timer { display: flex; align-items: center; gap: 7px; margin-bottom: 0; }
.promo__time-block {
    text-align: center; background: rgba(255,255,255,0.08);
    padding: 7px 11px; border-radius: 14px;
    border: 1px solid rgba(255,255,255,0.06);
}
.promo__time-block span { display: block; color: var(--white); font-size: 1.05rem; font-weight: 800; font-family: var(--font-display); }
.promo__time-block small { font-size: 0.6rem; color: rgba(255,255,255,0.4); text-transform: uppercase; letter-spacing: 1px; }
.promo__time-sep { color: rgba(255,255,255,0.3); font-size: 1rem; font-weight: 800; display: flex; align-items: center; }
.promo__left .btn { padding: 12px 22px; font-size: 0.88rem; white-space: nowrap; }
.promo__right { display: none; }
.promo__visual { font-size: 3.1rem; animation: float 4s ease-in-out infinite; position: relative; z-index: 1; }

/* ============================================
   STORY
   ============================================ */
.story { padding: 60px 0; }
.story__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; }
.story__visual { position: relative; height: 500px; }
.story__img-card {
    position: absolute; border-radius: var(--radius-xl); display: flex; align-items: center; justify-content: center;
    box-shadow: var(--shadow-lg);
}
.story__img-card--1 {
    width: 280px; height: 320px; top: 0; left: 0; font-size: 5rem;
    background: linear-gradient(135deg, var(--sage-light), var(--clay-light));
}
.story__img-card--2 {
    width: 180px; height: 200px; bottom: 40px; right: 20px; font-size: 4rem;
    background: linear-gradient(135deg, var(--blush-light), var(--clay-light));
}
.story__img-card--3 {
    width: 120px; height: 120px; top: 60px; right: 60px; font-size: 3rem;
    background: linear-gradient(135deg, var(--clay-light), var(--sage-light));
}
.story__stats-float {
    position: absolute; bottom: 0; left: 40px;
    background: var(--white); border-radius: var(--radius-xl); padding: 20px 24px;
    box-shadow: var(--shadow-xl); display: flex; gap: 24px;
}
.story__stat { text-align: center; }
.story__stat strong { display: block; font-size: 1.2rem; font-weight: 800; color: var(--cta); font-family: var(--font-display); }
.story__stat span { font-size: 0.72rem; color: var(--text-light); }
.story__content .section-head__label { text-align: left; }
.story__content .section-head__title { text-align: left; font-size: 2.4rem; margin-bottom: 20px; }
.story__text { color: var(--text-mid); margin-bottom: 16px; line-height: 1.8; }
.story__features { display: flex; flex-direction: column; gap: 18px; margin-top: 28px; }
.story__feature { display: flex; gap: 14px; align-items: flex-start; }
.story__feature-icon {
    width: 44px; height: 44px; border-radius: var(--radius-md); flex-shrink: 0;
    background: var(--cta-light); color: var(--cta);
    display: flex; align-items: center; justify-content: center; font-size: 1rem;
}
.story__feature strong { font-size: 0.95rem; display: block; margin-bottom: 2px; }
.story__feature p { font-size: 0.85rem; color: var(--text-light); margin: 0; }

/* ============================================
   TRUST STRIP
   ============================================ */
.trust-strip { padding: 18px 0; background: var(--white); border-bottom: 1px solid rgba(141,163,153,0.12); }
.trust-strip__grid {
    display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px;
    align-items: stretch;
}
.trust-strip__grid--compact { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.trust-strip__item {
    display: flex; align-items: center; gap: 12px;
    min-height: 70px; padding: 13px 15px; border-radius: 18px;
    background: linear-gradient(135deg, rgba(232,240,236,0.74), rgba(255,255,255,0.92));
    border: 1px solid rgba(124,154,142,0.12);
    box-shadow: 0 12px 30px rgba(92,72,58,0.04);
    transition: all var(--duration) var(--ease-bounce);
}
.trust-strip__item:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); border-color: rgba(196,114,92,0.18); }
.trust-strip__icon {
    width: 36px; height: 36px; border-radius: 12px; flex-shrink: 0;
    background: var(--sage-light); color: var(--sage);
    display: flex; align-items: center; justify-content: center; font-size: 1rem;
    transition: all var(--duration);
}
.trust-strip__item:hover .trust-strip__icon { background: var(--cta); color: var(--white); }
.trust-strip__item strong { font-size: 0.82rem; line-height: 1.2; display: block; color: var(--text); }
.trust-strip__item p { font-size: 0.72rem; line-height: 1.3; color: var(--text-light); margin: 3px 0 0; }

/* ============================================
   TESTIMONIALS
   ============================================ */
.testimonials { padding: 60px 0; }
.testimonials__track {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;
    margin-bottom: 32px;
}
.testimonials__empty {
    grid-column: 1 / -1;
    min-height: 180px;
    border: 1px dashed var(--border);
    border-radius: var(--radius-xl);
    background: rgba(255,255,255,0.72);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-align: center;
    color: var(--text-mid);
    padding: 28px;
}
.testimonials__empty i {
    width: 48px; height: 48px; border-radius: var(--radius-full);
    display: flex; align-items: center; justify-content: center;
    background: var(--blush-light); color: var(--cta);
}
.testimonials__empty strong { color: var(--text); font-family: var(--font-display); font-size: 1rem; }
.testimonials__empty span { font-size: 0.86rem; }
.t-card {
    background: var(--white); border-radius: var(--radius-xl); padding: 32px;
    border: 1px solid var(--border); transition: all var(--duration) var(--ease-bounce);
    position: relative;
}
.t-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-lg); border-color: transparent; }
.t-card__quote { position: absolute; top: 20px; right: 24px; font-size: 2.5rem; color: var(--border); font-family: var(--font-display); line-height: 1; }
.t-card__stars { display: flex; gap: 3px; margin-bottom: 16px; }
.t-card__stars i { color: #E8B931; font-size: 0.85rem; }
.t-card__text { color: var(--text-mid); font-size: 0.95rem; line-height: 1.75; margin-bottom: 20px; }
.t-card__author { display: flex; align-items: center; gap: 12px; }
.t-card__avatar {
    width: 44px; height: 44px; border-radius: var(--radius-full);
    background: linear-gradient(135deg, var(--sage-light), var(--blush-light));
    display: flex; align-items: center; justify-content: center;
    font-weight: 700; font-size: 0.82rem; color: var(--cta);
}
.t-card__name { font-weight: 700; font-size: 0.9rem; }
.t-card__role { font-size: 0.78rem; color: var(--text-light); }
.testimonials__nav { display: flex; align-items: center; justify-content: center; gap: 16px; }
.testimonials__arrow {
    width: 40px; height: 40px; border-radius: var(--radius-full);
    border: 1.5px solid var(--border); display: flex; align-items: center; justify-content: center;
    font-size: 0.85rem; color: var(--text-mid); transition: all var(--duration);
}
.testimonials__arrow:hover { border-color: var(--cta); color: var(--cta); background: var(--cta-light); }
.testimonials__dots { display: flex; gap: 6px; }
.testimonials__dot {
    width: 8px; height: 8px; border-radius: var(--radius-full);
    background: var(--border); transition: all var(--duration);
}
.testimonials__dot.active { background: var(--cta); width: 24px; }

/* ============================================
   NEWSLETTER
   ============================================ */
.newsletter { padding: 80px 0; }
.newsletter__card {
    background: linear-gradient(135deg, var(--sage-light), var(--clay-light), var(--blush-light));
    border-radius: var(--radius-2xl); padding: 50px; display: flex;
    align-items: center; justify-content: space-between; gap: 40px;
}
.newsletter__emoji { font-size: 2rem; margin-bottom: 8px; display: block; }
.newsletter__card h2 { font-family: var(--font-display); font-size: 1.6rem; margin-bottom: 6px; }
.newsletter__card p { color: var(--text-mid); font-size: 0.9rem; }
.newsletter__form { display: flex; gap: 10px; min-width: 420px; }
.newsletter__form input {
    flex: 1; padding: 14px 20px; border: 1.5px solid var(--border); border-radius: var(--radius-full);
    font-size: 0.92rem; background: var(--white); outline: none;
    transition: border-color var(--duration);
}
.newsletter__form input:focus { border-color: var(--cta); }

/* ============================================
   FOOTER
   ============================================ */
.footer {
    position: relative; overflow: hidden; background: radial-gradient(circle at 12% 0%, rgba(196,149,106,0.22), transparent 34%), linear-gradient(135deg, #151d20 0%, #101619 100%);
    color: var(--white); padding-top: 68px;
}
.footer::before {
    content: ''; position: absolute; inset: 0; pointer-events: none;
    background: linear-gradient(90deg, rgba(255,255,255,0.04), transparent 34%, rgba(255,255,255,0.025));
}
.footer .container { position: relative; z-index: 1; }
.footer__top { display: grid; grid-template-columns: minmax(240px, 1.45fr) repeat(3, minmax(150px, 1fr)); gap: 42px; padding-bottom: 34px; }
.footer__logo { font-family: var(--font-display); font-size: 1.45rem; font-weight: 800; display: flex; align-items: center; gap: 10px; margin-bottom: 14px; color: #fff; }
.footer__logo-mark {
    width: 42px; height: 42px; border-radius: 16px; display: inline-flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, #f4c27b, #c4725c); color: #101619; box-shadow: 0 12px 28px rgba(196,114,92,0.28);
}
.footer__brand p { color: rgba(255,255,255,0.68); font-size: 0.92rem; line-height: 1.8; margin-bottom: 16px; max-width: 360px; }
.footer__mini-badges { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.footer__mini-badges span {
    display: inline-flex; align-items: center; gap: 6px; padding: 7px 10px; border-radius: var(--radius-full);
    background: rgba(255,255,255,0.08); color: rgba(255,255,255,0.82); border: 1px solid rgba(255,255,255,0.08);
    font-size: 0.72rem; font-weight: 800;
}
.footer__mini-badges i { color: #f4c27b; }
.footer__social { display: flex; gap: 10px; }
.footer__social a {
    width: 44px; height: 44px; border-radius: 16px;
    background: rgba(255,255,255,0.08); display: flex; align-items: center; justify-content: center;
    color: rgba(255,255,255,0.92); font-size: 1rem; border: 1px solid rgba(255,255,255,0.08);
    transition: all var(--duration); box-shadow: 0 10px 24px rgba(0,0,0,0.12);
}
.footer__social a:hover { background: linear-gradient(135deg, var(--cta), #f4c27b); color: #fff; transform: translateY(-3px); }
.footer__col h4 { display: flex; align-items: center; gap: 8px; color: #fff; font-size: 0.94rem; font-weight: 800; margin-bottom: 16px; }
.footer__col h4 i { color: #f4c27b; font-size: 0.9rem; }
.footer__col a { display: flex; align-items: center; gap: 8px; color: rgba(255,255,255,0.62); font-size: 0.9rem; margin-bottom: 11px; transition: all var(--duration); }
.footer__col a > i { width: 16px; color: #f4c27b; font-size: 0.78rem; opacity: 0.9; flex: 0 0 auto; }
.footer__col a:hover { color: var(--white); padding-left: 4px; }
.footer__bottom {
    border-top: 1px solid rgba(255,255,255,0.1); padding: 20px 0 24px;
    display: flex; justify-content: space-between; align-items: center;
    color: rgba(255,255,255,0.5); font-size: 0.82rem;
}
.footer__payments { display: flex; gap: 8px; font-size: 1.55rem; color: rgba(255,255,255,0.5); }
.footer__payments i { transition: color var(--duration), transform var(--duration); }
.footer__payments i:hover { color: #f4c27b; transform: translateY(-2px); }

/* ============================================
   CART SIDEBAR
   ============================================ */
.overlay {
    position: fixed; inset: 0; background: rgba(44,36,32,0.5);
    z-index: 2000; opacity: 0;
    pointer-events: none; transition: opacity var(--duration);
}
.overlay.active { opacity: 1; pointer-events: all; }
.wishlist-sidebar {
    position: fixed; top: 0; bottom: 0; right: -440px; width: 420px; max-width: 100%;
    background: var(--white); z-index: 2001; display: flex; flex-direction: column;
    transition: right 0.4s var(--ease); box-shadow: -8px 0 40px rgba(0,0,0,0.1);
}
.wishlist-sidebar.active { right: 0; }
.cart {
    position: fixed; top: 0; bottom: 0; right: -440px; width: 420px; max-width: 100%;
    background: var(--white); z-index: 2001; display: flex; flex-direction: column;
    transition: right 0.4s var(--ease); box-shadow: -8px 0 40px rgba(0,0,0,0.1);
    overflow: hidden;
    scrollbar-width: none;
}
.cart::-webkit-scrollbar { display: none; }
.cart.active { right: 0; }
.cart__head {
    display: flex; justify-content: space-between; align-items: center;
    padding: 20px 24px; border-bottom: 1px solid var(--border);
}
.cart__head h3 { font-family: var(--font-display); font-size: 1.15rem; display: flex; align-items: center; gap: 8px; }
.cart__head button { font-size: 1.1rem; color: var(--text-light); padding: 6px; transition: color var(--duration); }
.cart__head button:hover { color: var(--text); }
.cart__body { flex: 1 1 auto; overflow-y: auto; padding: 12px 24px; min-height: 0; }
.cart__body,
.cart__foot {
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.cart__body::-webkit-scrollbar,
.cart__foot::-webkit-scrollbar {
    display: none;
}
.cart__empty { text-align: center; padding: 60px 0; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 300px; }
.cart__empty-icon { font-size: 3.5rem; display: block; margin-bottom: 16px; opacity: 0.5; }
.cart__empty p { font-weight: 700; color: var(--text); font-size: 1.1rem; margin-bottom: 4px; }
.cart__empty small { color: var(--text-light); font-size: 0.85rem; display: block; margin-bottom: 20px; }
.cart__empty .btn { margin-top: 8px; }
.cart-item {
    display: flex; gap: 14px; padding: 10px 0;
    border-bottom: 1px solid var(--border);
    animation: fadeInUp 0.3s var(--ease);
    /* prevent inner content overflow */
    min-width: 0; overflow: hidden; box-sizing: border-box;
}
.cart-item__img {
    width: 70px; height: 70px; border-radius: var(--radius-md); flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    font-size: 2rem;
}
.cart-item__info { flex: 1; }
.cart-item__name { font-weight: 600; font-size: 0.9rem; margin-bottom: 3px; }
.cart-item__price { color: var(--cta); font-weight: 700; font-size: 0.88rem; }
.cart-item__actions { 
    display: inline-flex; align-items: center; 
    border: 1px solid var(--border); border-radius: var(--radius-md); 
    background: var(--bg); margin-top: 8px; height: 28px;
}
.cart-item__qty-btn {
    width: 28px; height: 100%; border: none; background: transparent;
    display: flex; align-items: center; justify-content: center;
    font-size: 0.8rem; font-weight: 600; color: var(--text-mid); 
    cursor: pointer; transition: background var(--duration), color var(--duration);
}
.cart-item__qty-btn:hover:not(:disabled) { background: var(--bg-alt); color: var(--text); }
.cart-item__qty { 
    font-weight: 600; min-width: 30px; text-align: center; 
    font-size: 0.85rem; border-left: 1px solid var(--border); border-right: 1px solid var(--border);
    display: flex; align-items: center; justify-content: center; height: 100%;
}
.cart-item__remove { color: var(--text-light); font-size: 0.8rem; padding: 6px; transition: color var(--duration); align-self: start; margin-left: auto; cursor: pointer; }
.cart-item__remove:hover { color: #dc3545; }

.cart-item--bundle {
    flex-direction: column;
    gap: 0;
    padding: 12px;
    margin-bottom: 8px;
    border: 1px solid #eadfce;
    border-radius: 14px;
    background: linear-gradient(180deg, #fffdfa 0%, #fff 100%);
    border-bottom: 1px solid #eadfce;
    box-shadow: 0 2px 10px rgba(44, 36, 32, 0.04);
}
.cart-bundle__top {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    min-width: 0;
}
.cart-bundle__thumb {
    width: 56px;
    height: 56px;
    min-width: 56px;
    border-radius: 12px;
    overflow: hidden;
    background: linear-gradient(135deg, #f5ede3, #e8f0ec);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.cart-bundle__thumb-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.cart-bundle__thumb-icon {
    font-size: 1.45rem;
    line-height: 1;
}
.cart-bundle__thumb-collage {
    width: 100%;
    height: 100%;
    display: grid;
    gap: 1px;
    background: #eadfce;
}
.cart-bundle__thumb-collage--2 { grid-template-columns: 1fr 1fr; }
.cart-bundle__thumb-collage--3,
.cart-bundle__thumb-collage--4 { grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; }
.cart-bundle__thumb-cell {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f5ede3;
    overflow: hidden;
    min-width: 0;
    min-height: 0;
}
.cart-bundle__thumb-cell img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.cart-bundle__thumb-emoji {
    font-size: 0.72rem;
    line-height: 1;
}
.cart-bundle__body {
    flex: 1;
    min-width: 0;
}
.cart-bundle__meta {
    display: flex;
    align-items: center;
    gap: 5px;
    flex-wrap: wrap;
    margin-bottom: 4px;
}
.cart-bundle__badge {
    background: #c4725c;
    color: #fff;
    font-size: 0.58rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    padding: 2px 7px;
    border-radius: 999px;
}
.cart-bundle__save-pill {
    background: #ecfdf5;
    color: #047857;
    font-size: 0.58rem;
    font-weight: 800;
    padding: 2px 7px;
    border-radius: 999px;
}
.cart-bundle__gift-pill {
    background: #fdf2f8;
    color: #be185d;
    font-size: 0.58rem;
    font-weight: 700;
    padding: 2px 7px;
    border-radius: 999px;
}
.cart-bundle__name {
    font-size: 0.88rem;
    font-weight: 700;
    color: var(--text);
    line-height: 1.25;
    margin-bottom: 4px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.cart-bundle__includes {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 2px;
}
.cart-bundle__includes li {
    font-size: 0.68rem;
    color: var(--text-mid);
    line-height: 1.35;
    padding-left: 12px;
    position: relative;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.cart-bundle__includes li::before {
    content: '✓';
    position: absolute;
    left: 0;
    color: #7c9a8e;
    font-size: 0.62rem;
    font-weight: 800;
}
.cart-bundle__more {
    color: var(--text-light) !important;
    font-style: italic;
}
.cart-bundle__more::before { content: none !important; }
.cart-bundle__note {
    margin-top: 4px;
    font-size: 0.68rem;
    color: #be185d;
    font-style: italic;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.cart-bundle__remove {
    margin-left: 0;
    flex-shrink: 0;
    padding: 4px;
}
.cart-bundle__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #f0ebe4;
}
.cart-bundle__pricing {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    min-width: 0;
}
.cart-bundle__price {
    font-size: 0.95rem;
    font-weight: 800;
    color: var(--text);
}
.cart-bundle__was {
    font-size: 0.72rem;
    text-decoration: line-through;
    color: var(--text-light);
}
.cart-bundle__save {
    font-size: 0.66rem;
    background: #ecfdf5;
    color: #047857;
    padding: 2px 7px;
    border-radius: 999px;
    font-weight: 700;
}
.cart-bundle__qty {
    margin-top: 0;
    flex-shrink: 0;
}

/* Cart Footer — sticky checkout panel */
.cart__foot {
    flex-shrink: 0;
    max-height: 44vh;
    overflow-y: auto;
    padding: 9px 18px calc(10px + env(safe-area-inset-bottom));
    border-top: 1px solid rgba(44,36,32,0.08);
    background: rgba(255,255,255,0.98);
    box-shadow: 0 -14px 34px rgba(44,36,32,0.1);
}
.cart__bundle-alert {
    background: #def7ec;
    color: #03543f;
    border-radius: 10px;
    padding: 8px 10px;
    margin-bottom: 8px;
    font-size: 0.74rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 6px;
}
.cart__summary { margin-bottom: 6px; }
.cart__summary-row {
    display: flex; justify-content: space-between; align-items: center;
    font-size: 0.8rem; color: var(--text-mid); padding: 2px 0;
}
.cart__summary-total {
    font-size: 0.94rem; font-weight: 900; color: var(--text);
    padding-top: 7px; margin-top: 4px; border-top: 1px solid var(--border);
}
.cart__summary-total span:last-child { color: var(--cta); font-family: var(--font-display); font-size: 1.16rem; }
.cart__pay-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 2px 0 10px;
}
.cart__pay-head span {
    color: var(--text);
    font-size: 0.9rem;
    font-weight: 800;
}
.cart__pay-head strong {
    color: var(--cta);
    font-family: var(--font-display);
    font-size: 1.42rem;
    line-height: 1;
}
.cart__more-details {
    margin-top: 8px;
    border-top: 1px solid rgba(44,36,32,0.08);
    padding-top: 6px;
}
.cart__more-details > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    list-style: none;
    cursor: pointer;
    color: var(--text-muted);
    font-size: 0.72rem;
    font-weight: 800;
    padding: 3px 0 1px;
}
.cart__more-details > summary::-webkit-details-marker { display: none; }
.cart__more-details > summary span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.cart__more-details > summary .fa-chevron-down {
    transition: transform 0.2s ease;
}
.cart__more-details[open] > summary {
    margin-bottom: 8px;
    color: var(--text-mid);
}
.cart__more-details[open] > summary .fa-chevron-down {
    transform: rotate(180deg);
}
.cart__footer-options {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 6px;
    align-items: start;
    margin-bottom: 6px;
    padding-top: 2px;
}
.cart__promo-details { min-width: 0; margin: 0; }
.cart__promo-details summary {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 0.74rem;
    color: var(--text-mid);
    cursor: pointer;
    font-weight: 700;
    padding: 5px 0;
    list-style: none;
}
.cart__promo-details summary::-webkit-details-marker { display: none; }
.cart__promo-details[open] summary { margin-bottom: 4px; }
.cart__promo-details .promo-form { display: flex; gap: 6px; }
.cart__promo-details .promo-form__input {
    min-width: 0;
    flex: 1;
    padding: 7px 10px;
    border: 1px solid var(--border);
    border-radius: 10px;
    font-size: 0.78rem;
    outline: none;
}
.cart__promo-details .promo-form__input:focus { border-color: var(--cta); }
.cart__promo-details .promo-form__btn {
    padding: 7px 11px;
    background: var(--sage);
    color: var(--white);
    border-radius: 10px;
    font-size: 0.74rem;
    font-weight: 800;
}
.cart__promo-details .promo-form__btn:hover { background: var(--sage-dark); }
.cart__giftwrap-inline {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 28px;
    width: fit-content;
    max-width: 100%;
    padding: 4px 10px;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: #fff;
    font-size: 0.68rem;
    color: var(--text-mid);
    cursor: pointer;
    white-space: nowrap;
    justify-self: end;
    flex-shrink: 0;
}
.cart__giftwrap-inline input { width: 14px; height: 14px; flex-shrink: 0; accent-color: var(--cta); }
.cart__giftwrap-inline span { display: inline-flex; align-items: center; gap: 4px; min-width: 0; }
.cart__giftwrap-inline strong { color: var(--sage-dark); font-size: 0.68rem; flex-shrink: 0; }
.cart__gift-message-area {
    display: none;
    margin: 6px 0 8px;
}
.cart__gift-message-area.visible { display: block; }
.cart__gift-textarea {
    width: 100%;
    padding: 8px 10px;
    border: 1px solid #e6c5ba;
    border-radius: 10px;
    font-size: 0.78rem;
    resize: none;
    font-family: inherit;
    background: #fff;
    color: var(--text);
    line-height: 1.35;
}
.cart__gift-textarea:focus {
    outline: none;
    border-color: #C4725C;
    box-shadow: 0 0 0 3px rgba(196,114,92,0.12);
}
.cart__gift-hide-prices {
    display: flex; align-items: center; gap: 6px;
    font-size: 0.72rem; color: var(--text-mid);
    margin-top: 6px; cursor: pointer;
}
.cart__gift-hide-prices input { accent-color: var(--cta); width: 14px; height: 14px; }
.cart__assurance-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    font-size: 0.68rem;
    color: var(--text-muted);
    margin-bottom: 6px;
    padding-top: 1px;
}
.cart__assurance-row strong { color: var(--text-mid); }
.cart__assurance-row span:last-child { color: #059669; font-weight: 800; white-space: nowrap; }
.cart__checkout-btn {
    font-size: 0.92rem !important;
    padding: 12px 18px !important;
    font-weight: 800 !important;
    letter-spacing: 0.2px;
    margin-bottom: 6px !important;
    box-shadow: 0 10px 24px rgba(196,114,92,0.22);
}
.cart__express-row {
    display: flex;
    gap: 7px;
    margin-bottom: 4px;
}
.cart__express-row .btn--express {
    min-height: 34px;
    padding: 7px 10px;
    font-size: 0.76rem;
    border-radius: 10px;
}
.cart__pay-note {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    font-size: 0.64rem;
    color: var(--text-muted);
    padding-top: 1px;
}
.cart__pay-note span:last-child {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
}
.cart__delivery-inline {
    font-size: 0.78rem; color: var(--text-mid); padding: 4px 0 10px;
}
.cart__delivery-inline strong { color: var(--sage-dark); }
.cart__trust-line {
    display: flex; justify-content: space-between; align-items: center;
    margin-top: 8px; padding-top: 8px;
}
.cart__trust-line > span:first-child { font-size: 0.7rem; color: var(--text-light); }
.cart__trust-payments { display: flex; gap: 6px; font-size: 1.1rem; color: var(--text-light); }

/* Keep old classes for backward compat (JS references) */
.cart__subtotal, .cart__total { display: flex; justify-content: space-between; margin-bottom: 8px; }
.cart__total { font-size: 1.1rem; font-weight: 700; margin-bottom: 16px; }
.cart__total span:last-child { color: var(--cta); font-family: var(--font-display); font-size: 1.3rem; }
.cart__secure { text-align: center; font-size: 0.75rem; color: var(--text-light); margin-top: 10px; }

/* ============================================
   MODAL
   ============================================ */
.modal {
    position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(0.92);
    background: var(--white); border-radius: var(--radius-2xl); z-index: 2002;
    max-width: 820px; width: 92%; opacity: 0; pointer-events: none;
    transition: all 0.3s var(--ease-spring);
    box-shadow: 0 20px 60px rgba(0,0,0,0.15); max-height: 90vh; overflow-y: auto;
}
.modal.active { opacity: 1; pointer-events: all; transform: translate(-50%, -50%) scale(1); }
.modal__close {
    position: absolute; top: 16px; right: 16px; z-index: 5;
    width: 40px; height: 40px; border-radius: var(--radius-full);
    background: var(--white); box-shadow: var(--shadow-md);
    display: flex; align-items: center; justify-content: center;
    transition: all var(--duration);
}
.modal__close:hover { background: var(--cta); color: var(--white); }
.modal__grid { display: grid; grid-template-columns: 1fr 1fr; }
.modal__media {
    display: flex; align-items: center; justify-content: center; min-height: 400px;
}
.modal__emoji { font-size: 7rem; filter: drop-shadow(0 12px 24px rgba(0,0,0,0.1)); }
.modal__details { padding: 36px; }
.modal__cat { font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 1.5px; color: var(--sage); }
.modal__name { font-family: var(--font-display); font-size: 1.6rem; font-weight: 700; margin: 8px 0 10px; }
.modal__rating { display: flex; align-items: center; gap: 4px; margin-bottom: 14px; }
.modal__rating i { color: #E8B931; font-size: 0.82rem; }
.modal__rating span { font-size: 0.82rem; color: var(--text-light); margin-left: 6px; }
.modal__desc { color: var(--text-mid); font-size: 0.9rem; line-height: 1.7; margin-bottom: 18px; }
.modal__price-wrap { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; flex-wrap: wrap; }
.modal__price { font-size: 1.6rem; font-weight: 700; color: var(--cta); font-family: var(--font-display); }
.modal__old-price { font-size: 1rem; color: var(--text-light); text-decoration: line-through; }
.modal__save { background: #E8F5E9; color: #2E7D32; padding: 3px 10px; border-radius: var(--radius-full); font-size: 0.75rem; font-weight: 700; }
.modal__badges { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.modal__badges span { background: var(--sage-light); color: var(--sage-dark); padding: 5px 12px; border-radius: var(--radius-full); font-size: 0.78rem; font-weight: 600; display: flex; align-items: center; gap: 4px; }
.modal__row { display: flex; gap: 12px; align-items: center; }
.qty-selector { display: flex; align-items: center; border: 1.5px solid var(--border); border-radius: var(--radius-full); overflow: hidden; }
.qty-selector button { width: 40px; height: 44px; font-size: 1.1rem; font-weight: 700; transition: background var(--duration); }
.qty-selector button:hover { background: var(--bg-alt); }
.qty-selector span { min-width: 32px; text-align: center; font-weight: 700; font-size: 1rem; }

/* ============================================
   TOAST & SCROLL-TOP
   ============================================ */
.toast {
    position: fixed; right: 22px; bottom: 28px; transform: translateY(22px) scale(0.96);
    min-width: 280px; max-width: min(380px, calc(100vw - 32px));
    background: rgba(255, 255, 255, 0.92); color: var(--text); padding: 13px 16px 13px 13px;
    border-radius: 22px; display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; align-items: center; gap: 12px;
    font-weight: 700; font-size: 0.92rem; z-index: 99999;
    box-shadow: 0 18px 45px rgba(55, 43, 37, 0.16), inset 0 1px 0 rgba(255,255,255,0.85);
    border: 1px solid rgba(232, 220, 209, 0.88);
    backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
    transition: opacity 0.28s ease, transform 0.34s var(--ease-bounce); opacity: 0;
    pointer-events: none;
}
.toast.active { transform: translateY(0) scale(1); opacity: 1; }
.toast i {
    width: 42px; height: 42px; border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--sage-light); color: var(--sage-dark); font-size: 1rem;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.75);
}
.toast--cart i { background: var(--clay-light); color: var(--cta); }
.toast--wishlist i { background: #fff1f2; color: #e11d48; }
.toast--error i { background: #fee2e2; color: #dc2626; }
.toast__title { display: block; line-height: 1.2; }
.toast__detail {
    display: block; margin-top: 3px; color: var(--text-mid); font-size: 0.76rem; font-weight: 650;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.toast__action {
    border: none; border-radius: 999px; background: var(--text); color: var(--white);
    padding: 8px 11px; font-size: 0.74rem; font-weight: 900; cursor: pointer;
}
body.dark-mode .toast { background: rgba(30,30,46,0.95); color: #fff; border-color: rgba(255,255,255,0.1); }
body.dark-mode .toast__detail { color: rgba(255,255,255,0.72); }
@media (max-width: 640px) {
    .toast {
        left: 14px; right: 14px; bottom: 18px;
        min-width: 0; max-width: none;
    }
    .toast__action { padding: 7px 10px; }
}
.scroll-top {
    position: fixed; bottom: 30px; right: 30px; width: 44px; height: 44px;
    border-radius: var(--radius-full); background: var(--white); color: var(--text);
    display: flex; align-items: center; justify-content: center;
    font-size: 0.9rem; z-index: 99; box-shadow: var(--shadow-lg); border: 1px solid var(--border);
    opacity: 0; pointer-events: none; transform: translateY(10px);
    transition: all var(--duration) var(--ease-bounce);
}
.scroll-top.visible { opacity: 1; pointer-events: all; transform: translateY(0); }
.scroll-top:hover { background: var(--cta); color: var(--white); border-color: transparent; transform: translateY(-3px); }

/* ============================================
   QUICK-VIEW POPUP
   ============================================ */
.quickview-overlay {
    position: fixed; inset: 0; background: rgba(0,0,0,0.5);
    z-index: 1099;
    transition: opacity 0.3s ease;
}
.quickview-overlay.hidden { display: none; }
.quickview-popup {
    position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);
    background: var(--white); border-radius: var(--radius-2xl);
    width: 90%; max-width: 680px; max-height: 85vh; overflow-y: auto;
    z-index: 1100; box-shadow: var(--shadow-xl);
    animation: popIn 0.3s var(--ease-bounce);
}
.quickview-popup.hidden { display: none; }
@keyframes popIn { from { transform: translate(-50%, -50%) scale(0.9); opacity: 0; } to { transform: translate(-50%, -50%) scale(1); opacity: 1; } }
.quickview-popup__close {
    position: absolute; top: 14px; right: 14px;
    background: rgba(0,0,0,0.06); border: none; border-radius: var(--radius-full);
    width: 36px; height: 36px; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    font-size: 1rem; z-index: 2; color: var(--text-mid);
    transition: all 0.2s ease;
}
.quickview-popup__close:hover { background: rgba(0,0,0,0.12); }
.quickview-popup__body {
    display: grid; grid-template-columns: 1fr 1fr; gap: 0;
}
.quickview-popup__image {
    background: linear-gradient(135deg, var(--sage-light), var(--blush-light));
    display: flex; align-items: center; justify-content: center;
    font-size: 5rem; min-height: 320px;
    border-radius: var(--radius-2xl) 0 0 var(--radius-2xl);
}
.quickview-popup__info {
    padding: 32px; display: flex; flex-direction: column; justify-content: center;
}
.quickview-popup__cat {
    font-size: 0.7rem; font-weight: 700; text-transform: uppercase;
    letter-spacing: 1px; color: var(--sage-dark); margin-bottom: 6px;
}
.quickview-popup__name {
    font-family: var(--font-display); font-size: 1.3rem; font-weight: 700;
    color: var(--text); margin-bottom: 8px;
}
.quickview-popup__rating {
    color: var(--clay); font-size: 0.85rem; margin-bottom: 10px;
}
.quickview-popup__price {
    font-size: 1.4rem; font-weight: 800; color: var(--cta);
    font-family: var(--font-display); margin-bottom: 12px;
}
.quickview-popup__price del { color: var(--text-light); font-size: 0.9rem; font-weight: 400; margin-left: 8px; }
.quickview-popup__desc {
    font-size: 0.85rem; color: var(--text-mid); line-height: 1.6; margin-bottom: 20px;
}
.quickview-popup__actions { display: flex; gap: 10px; }
.quickview-popup__actions .btn { font-size: 0.85rem; padding: 10px 18px; }

/* ============================================
   AGE GROUP LABELS (Müşteri Talebi: Yaş bilgisi)
   ============================================ */
.p-card__trust {
    display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-bottom: 8px;
}
.p-card__trust span {
    display: inline-flex; align-items: center; gap: 5px;
    min-width: 0; max-width: 100%;
    color: var(--text-mid); background: rgba(141,163,153,0.12);
    border: 1px solid rgba(141,163,153,0.16);
    border-radius: var(--radius-full); padding: 4px 8px;
    font-size: 0.66rem; font-weight: 800; white-space: nowrap;
}
.p-card__trust i { color: var(--sage); font-size: 0.62rem; }

.p-card__tags { display: none; }

.p-card__swatches {
    display: flex; align-items: center; gap: 6px;
    min-height: 18px; margin: -2px 0 8px;
}
.p-card__swatch {
    width: 16px; height: 16px; border-radius: 50%;
    background: var(--swatch);
    border: 2px solid var(--white);
    box-shadow: 0 0 0 1px rgba(31,41,55,0.16), 0 2px 5px rgba(31,41,55,0.12);
    transition: box-shadow 0.2s, transform 0.2s;
}
.p-card__swatch--default {
    box-shadow: 0 0 0 1.5px var(--white), 0 0 0 2.5px var(--cta);
    z-index: 1;
}

/* ============================================
   STOCK WARNING (Müşteri Talebi: Stok bilgisi)
   ============================================ */
.p-card__stock {
    display: inline-flex; align-items: center; gap: 4px;
    font-size: 0.7rem; font-weight: 700; color: #D84315;
    margin-top: 6px;
}
.p-card__stock i { animation: pulse 1.5s infinite; }

/* ============================================
   SHOP BY BUDGET — Inspired by Carter's "Deals for You"
   ============================================ */
.budget { padding: 40px 0; }
.budget__grid {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px;
}
.budget__tile {
    background: linear-gradient(145deg, var(--sage-light), #f0ede8);
    border-radius: var(--radius-xl); padding: 30px 24px;
    text-align: center; cursor: pointer; position: relative;
    transition: all var(--duration) var(--ease-bounce); overflow: hidden;
    border: 1px solid transparent;
}
.budget__tile:hover {
    transform: translateY(-8px); box-shadow: var(--shadow-lg);
    border-color: var(--sage);
}
.budget__tile--gift {
    background: linear-gradient(145deg, var(--blush-light), #f8e8e2);
}
.budget__tile--gift:hover { border-color: var(--cta); }
.budget__icon { font-size: 2.5rem; margin-bottom: 14px; }
.budget__label {
    font-family: var(--font-display); font-size: 1.3rem; font-weight: 700;
    color: var(--text); margin-bottom: 6px;
}
.budget__desc { font-size: 0.82rem; color: var(--text-mid); margin-bottom: 16px; }
.budget__cta {
    font-size: 0.78rem; font-weight: 700; color: var(--cta);
    display: inline-flex; align-items: center; gap: 6px;
    transition: gap 0.2s ease;
}
.budget__tile:hover .budget__cta { gap: 10px; }

/* ============================================
   WHY MINIDREAM — Inspired by Babylist "Why Shop with Babylist?"
   ============================================ */
.why-us { padding: 50px 0; background: linear-gradient(180deg, #f8f5f2, var(--white)); }
.why-us__grid {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px;
}
.why-us__card {
    background: var(--white); border-radius: var(--radius-xl);
    padding: 36px 28px; text-align: center;
    border: 1px solid var(--border);
    transition: all var(--duration) var(--ease-bounce);
    position: relative; overflow: hidden;
}
.why-us__card::before {
    content: ''; position: absolute; top: 0; left: 0; right: 0; height: 4px;
    background: linear-gradient(90deg, var(--sage), var(--cta));
    opacity: 0; transition: opacity 0.3s ease;
}
.why-us__card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.why-us__card:hover::before { opacity: 1; }
.why-us__icon {
    width: 64px; height: 64px; border-radius: var(--radius-full);
    background: var(--sage-light); display: flex; align-items: center;
    justify-content: center; font-size: 1.4rem; color: var(--sage-dark);
    margin: 0 auto 20px;
}
.why-us__card h3 {
    font-family: var(--font-display); font-size: 1.2rem; font-weight: 700;
    color: var(--text); margin-bottom: 12px;
}
.why-us__card p {
    font-size: 0.88rem; color: var(--text-mid); line-height: 1.7; margin-bottom: 18px;
}
.why-us__badge {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 0.75rem; font-weight: 700; color: #2E7D32;
    background: #E8F5E9; padding: 6px 14px; border-radius: var(--radius-full);
}

/* ============================================
   UGC GALLERY — Inspired by Carter's "Mini Moments, Big Style"
   ============================================ */
.ugc { padding: 50px 0; background: var(--white); }
.ugc__grid {
    display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; margin-bottom: 30px;
}
.ugc__card {
    position: relative; border-radius: var(--radius-lg); overflow: hidden;
    aspect-ratio: 1; cursor: pointer; 
}
.ugc__img {
    width: 100%; height: 100%;
    background: linear-gradient(135deg, var(--sage-light), var(--blush-light));
    display: flex; align-items: center; justify-content: center;
    font-size: 2.4rem; transition: transform 0.4s ease;
}
.ugc__card:hover .ugc__img { transform: scale(1.1); }
.ugc__overlay {
    position: absolute; bottom: 0; left: 0; right: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.7), transparent);
    padding: 40px 14px 14px; color: var(--white);
    opacity: 0; transition: opacity 0.3s ease;
    display: flex; flex-direction: column;
}
.ugc__card:hover .ugc__overlay { opacity: 1; }
.ugc__overlay strong { font-size: 0.82rem; }
.ugc__overlay span { font-size: 0.72rem; opacity: 0.8; }
.ugc__overlay small { font-size: 0.68rem; font-style: italic; margin-top: 2px; opacity: 0.9; }
.ugc__cta { text-align: center; }

/* ============================================
   PARENT TIPS — Inspired by Carter's "Crib Notes" blog
   ============================================ */
.parent-tips { padding: 80px 0; background: #f8f5f2; }
.tips__grid {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px;
}
.tips__card {
    background: var(--white); border-radius: var(--radius-xl);
    overflow: hidden; transition: all var(--duration) var(--ease-bounce);
    border: 1px solid var(--border); cursor: pointer;
}
.tips__card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.tips__img {
    height: 160px;
    background: linear-gradient(135deg, var(--sage-light), var(--clay-light));
    display: flex; align-items: center; justify-content: center;
    font-size: 3rem;
}
.tips__body { padding: 24px; }
.tips__tag {
    display: inline-block; padding: 4px 12px; border-radius: var(--radius-full);
    font-size: 0.7rem; font-weight: 700; text-transform: uppercase;
    background: var(--sage-light); color: var(--sage-dark); margin-bottom: 10px;
}
.tips__title {
    font-family: var(--font-display); font-size: 1.1rem; font-weight: 700;
    color: var(--text); margin-bottom: 10px; line-height: 1.4;
}
.tips__excerpt { font-size: 0.85rem; color: var(--text-mid); line-height: 1.7; margin-bottom: 14px; }
.tips__meta { font-size: 0.75rem; color: var(--text-light); display: flex; align-items: center; gap: 6px; }

/* ============================================
   CART ENHANCEMENTS — Delivery Estimate, Duties, BNPL
   ============================================ */
.cart__delivery-estimate {
    display: flex; align-items: center; gap: 8px;
    padding: 10px 14px; margin-bottom: 14px;
    background: #E3F2FD; border-radius: var(--radius-md);
    font-size: 0.82rem; color: #1565C0;
}
.cart__delivery-estimate i { color: #1565C0; }
.cart__duties {
    display: flex; justify-content: space-between; margin-bottom: 8px;
    font-size: 0.85rem; color: #2E7D32; font-weight: 600;
}
.cart__bnpl {
    text-align: center; margin-top: 12px; padding: 10px;
    background: #F3E5F5; border-radius: var(--radius-md);
    font-size: 0.78rem; color: #7B1FA2;
}
.cart__bnpl strong { font-weight: 800; }

/* ============================================
   ALL PRODUCTS PAGE VIEW
   ============================================ */
.all-products-page { padding-top: 20px; padding-bottom: 24px; min-height: auto; background: var(--bg-cream); }
.all-products-page .pdp__breadcrumb { margin-bottom: 8px; }
.all-products-page__header {
    display: flex; align-items: flex-end; justify-content: space-between;
    margin-bottom: 12px; gap: 8px;
}
.all-products-page__header .section-head { margin-bottom: 0 !important; }
.all-products-page__header .section-head__title { font-size: 1.75rem; margin-bottom: 0; line-height: 1.15; }
.all-products-page__header .section-head__desc { margin-top: 2px; font-size: 0.88rem; line-height: 1.35; }
.all-products-page__title {
    font-family: var(--font-display); font-size: 1.75rem; font-weight: 700;
    color: var(--text); margin-bottom: 0; line-height: 1.15;
}
.all-products-page__subtitle {
    font-size: 0.88rem; color: var(--text-mid); line-height: 1.35;
}
.all-products-page__count {
    font-size: 0.85rem; color: var(--text-light);
    white-space: nowrap; font-weight: 600;
}
.all-products-page__filters {
    display: flex; align-items: center; justify-content: space-between;
    gap: 12px; margin-bottom: 20px; flex-wrap: wrap;
    background: var(--white); padding: 10px 16px; border-radius: var(--radius-xl);
    border: 1px solid var(--border);
}
.all-products-page__filters--simple {
    padding: 0;
    margin-bottom: 8px;
    gap: 0 !important;
    background: transparent;
    border: 0;
    box-shadow: none;
}
.all-products-page__filters--simple > div:not(.all-products-page__filter-note) {
    display: none !important;
}
.all-products-page__filter-note {
    display: flex; flex-direction: row; align-items: center; gap: 6px;
    color: var(--text);
}
.all-products-page__filter-note span {
    color: var(--text-mid);
    font-size: 0.88rem;
    font-weight: 700;
    letter-spacing: -0.01em;
}
.all-products-page__filter-note small {
    color: var(--text-mid); font-size: 0.78rem;
}
.all-products-page__tabs {
    display: flex; gap: 6px; flex-wrap: nowrap; overflow-x: auto;
    scrollbar-width: none; -webkit-overflow-scrolling: touch;
    padding-bottom: 2px; max-width: 100%;
}
.all-products-page__tabs::-webkit-scrollbar { display: none; }
.all-products-page__tabs .tab-btn {
    padding: 8px 16px; border-radius: var(--radius-full);
    background: transparent; border: 1.5px solid var(--border);
    font-size: 0.8rem; font-weight: 600; cursor: pointer;
    color: var(--text-mid); transition: all 0.2s ease;
    font-family: var(--font-body); white-space: nowrap; flex-shrink: 0;
}
.all-products-page__tabs .tab-btn:hover { border-color: var(--sage); color: var(--sage-dark); }
.all-products-page__tabs .tab-btn.active {
    background: var(--sage); color: var(--white); border-color: var(--sage);
}
.all-products-page__age-filters {
    display: flex; gap: 6px; flex-wrap: nowrap; overflow-x: auto;
    scrollbar-width: none; -webkit-overflow-scrolling: touch;
    padding-bottom: 2px; max-width: 100%;
}
.all-products-page__age-filters::-webkit-scrollbar { display: none; }
.all-products-extra-filters {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
    width: 100%;
}
.products-mobile-filter-actions { display: none; }
.products-filter-sheet.hidden { display: none; }
.products-filter-sheet {
    position: fixed;
    inset: 0;
    z-index: 10060;
}
.products-filter-sheet__overlay {
    position: absolute;
    inset: 0;
    background: rgba(28,20,17,0.42);
    backdrop-filter: blur(6px);
}
.products-filter-sheet__panel {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    max-height: 86dvh;
    overflow: auto;
    background: var(--white);
    border-radius: 26px 26px 0 0;
    padding: 18px;
    box-shadow: 0 -22px 70px rgba(31,41,55,0.18);
}
.products-filter-sheet__head,
.products-filter-sheet__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.products-filter-sheet__head {
    padding-bottom: 14px;
    border-bottom: 1px solid var(--border);
}
.products-filter-sheet__head strong {
    font-family: var(--font-display);
    font-size: 1.08rem;
}
.products-filter-sheet__head button {
    width: 36px;
    height: 36px;
    border-radius: 999px;
    background: var(--bg-alt);
    color: var(--text-mid);
}
.products-filter-sheet__body {
    display: grid;
    gap: 12px;
    padding: 16px 0;
}
.products-filter-sheet__body label {
    display: grid;
    gap: 7px;
    color: var(--text);
    font-weight: 800;
    font-size: 0.8rem;
}
.products-filter-sheet__body select {
    width: 100%;
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 12px 13px;
    background: var(--bg-alt);
    color: var(--text);
    font-family: var(--font-body);
    font-size: 0.92rem;
}
.products-filter-sheet__foot {
    position: sticky;
    bottom: -18px;
    padding: 12px 0 4px;
    background: linear-gradient(180deg, rgba(255,255,255,0.72), var(--white) 35%);
}
.products-filter-sheet__foot .btn { flex: 1; justify-content: center; }

/* Products Page Search Bar */
.products-search-bar {
    position: relative; display: flex; align-items: center;
}
.products-search-bar__icon {
    position: absolute; left: 14px; color: var(--text-light);
    font-size: 0.82rem; pointer-events: none;
}
.products-search-bar__input {
    padding: 10px 16px 10px 38px; border: 1.5px solid var(--border);
    border-radius: var(--radius-full); font-size: 0.85rem;
    background: var(--white); color: var(--text); width: 220px;
    font-family: var(--font-body); outline: none;
    transition: all 0.3s ease;
}
.products-search-bar__input:focus {
    border-color: var(--sage); box-shadow: 0 0 0 3px rgba(124,154,142,0.15);
    width: 280px;
}
.products-search-bar__input::placeholder {
    color: var(--text-light); font-size: 0.82rem;
}

/* Search Active Indicator */
.search-active {
    display: flex; align-items: center; gap: 10px;
    padding: 10px 18px; margin-bottom: 16px;
    background: var(--sage-light); border-radius: var(--radius-md);
    font-size: 0.85rem; color: var(--sage-dark); font-weight: 500;
    animation: fadeInUp 0.3s var(--ease);
}
.search-active.hidden { display: none; }
.search-active i { color: var(--sage); }
.search-active__term { font-weight: 700; color: var(--text); }
.search-active__clear {
    margin-left: auto; background: none; border: 1.5px solid var(--sage);
    color: var(--sage-dark); padding: 4px 12px; border-radius: var(--radius-full);
    font-size: 0.75rem; font-weight: 600; cursor: pointer;
    transition: all 0.2s ease; display: inline-flex; align-items: center; gap: 4px;
}
.search-active__clear:hover {
    background: var(--sage); color: var(--white);
}

/* ============================================
   BUNDLES — Curated Gift Sets
   ============================================ */
.bundles { padding: 58px 0; background: linear-gradient(180deg, var(--white), #f8f5f2); }
.bundles__grid {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px;
}
.bundle-card {
    background: var(--white); border-radius: var(--radius-xl);
    overflow: hidden; border: 1px solid var(--border);
    transition: all var(--duration) var(--ease-bounce);
    position: relative; display: flex; flex-direction: column; height: 100%;
}
.bundle-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.bundle-card__save {
    position: absolute; top: 16px; right: 16px;
    background: #B91C1C; color: var(--white); padding: 4px 12px;
    border-radius: var(--radius-full); font-size: 0.72rem; font-weight: 800;
    z-index: 2;
}
.bundle-card__preview {
    height: 160px; display: flex; align-items: center; justify-content: center;
    gap: 16px; font-size: 2.8rem;
    background: linear-gradient(135deg, var(--sage-light), var(--blush-light));
    padding: 20px;
}
.bundle-card__preview--photos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 16px; }
.bundle-card__media-item {
    min-width: 0; height: 60px; border-radius: 16px; background: rgba(255,255,255,0.78);
    display: flex; align-items: center; justify-content: center; overflow: hidden;
    box-shadow: 0 6px 18px rgba(31,41,55,0.06); font-size: 1.6rem;
}
.bundle-card__media-item img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bundle-card__emoji {
    width: 64px; height: 64px; border-radius: var(--radius-lg);
    background: rgba(255,255,255,0.8); display: flex; align-items: center;
    justify-content: center; font-size: 2rem;
    transition: transform 0.3s ease;
}
.bundle-card:hover .bundle-card__emoji { transform: scale(1.1); }
.bundle-card__body { padding: 24px; display: flex; flex-direction: column; flex: 1; }
.bundle-card__name {
    font-family: var(--font-display); font-size: 1.15rem; font-weight: 700;
    color: var(--text); margin-bottom: 8px;
}
.bundle-card__meta { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.bundle-card__meta span {
    display: inline-flex; align-items: center; gap: 5px; padding: 4px 9px;
    border-radius: var(--radius-full); background: var(--bg-alt); color: var(--text-mid);
    font-size: 0.68rem; font-weight: 800;
}
.bundle-card__items {
    font-size: 0.82rem; color: var(--text-mid); line-height: 1.8;
    margin-bottom: 16px; list-style: none; padding: 0; flex: 1;
}
.bundle-card__items li { display: flex; gap: 8px; align-items: flex-start; }
.bundle-card__items li::before { content: '\2713'; color: var(--sage); font-weight: 800; flex: 0 0 auto; }
.bundle-card__pricing {
    display: flex; align-items: center; gap: 10px; margin-bottom: 16px;
    margin-top: auto;
}
.bundle-card__price {
    font-size: 1.3rem; font-weight: 800; color: var(--cta);
    font-family: var(--font-display);
}
.bundle-card__old-price {
    font-size: 0.9rem; color: var(--text-light);
    text-decoration: line-through;
}
.bundle-card .btn { width: 100%; justify-content: center; }
.bundle-card__actions { display: grid; grid-template-columns: 1fr 48px; gap: 8px; }
.bundle-card__actions .btn--ghost { padding-inline: 0; border: 1.5px solid var(--border); }
.bundle-empty {
    grid-column: 1/-1; text-align: center; padding: 44px 24px; border: 1px solid var(--border);
    border-radius: var(--radius-xl); background: var(--white); box-shadow: var(--shadow-sm);
}
.bundle-empty__icon {
    width: 64px; height: 64px; border-radius: 22px; margin: 0 auto 14px;
    display: flex; align-items: center; justify-content: center; background: var(--clay-light);
    color: var(--cta); font-size: 1.5rem;
}
.bundle-empty h3 { font-family: var(--font-display); font-size: 1.25rem; margin-bottom: 6px; }
.bundle-empty p { color: var(--text-mid); max-width: 460px; margin: 0 auto 18px; font-size: 0.92rem; }

/* View All Products */
.products__view-all {
    text-align: center; margin-top: 36px;
}
.btn--outline {
    background: transparent; border: 2px solid var(--sage);
    color: var(--sage-dark); padding: 12px 32px; border-radius: var(--radius-full);
    font-weight: 700; cursor: pointer; font-size: 0.9rem;
    font-family: var(--font-body);
    transition: all 0.3s ease; display: inline-flex; align-items: center; gap: 8px;
}
.btn--outline:hover {
    background: var(--sage); color: var(--white); border-color: var(--sage);
    transform: translateY(-2px); box-shadow: var(--shadow-md);
}

/* ============================================
   AGE FILTER BUTTONS
   ============================================ */
.products__toolbar {
    display: flex; flex-wrap: wrap; justify-content: space-between;
    align-items: center; gap: 14px; margin-bottom: 24px;
}
.products__age-filters { display: flex; gap: 6px; }
.age-filter {
    padding: 6px 16px; border-radius: var(--radius-full); border: 1px solid var(--border);
    background: var(--white); font-size: 0.78rem; font-weight: 600; cursor: pointer;
    transition: all var(--duration) var(--ease); color: var(--text-mid);
    white-space: nowrap; flex-shrink: 0;
}
.age-filter.active, .age-filter:hover {
    background: var(--sage); color: var(--white); border-color: var(--sage);
}

/* Product card clickable */
.p-card { cursor: pointer; transition: transform var(--duration) var(--ease); }
.p-card:hover { transform: translateY(-6px); }

/* ============================================
   PRODUCT DETAIL PAGE (replaces modal)
   Inspired by: Maisonette, Lalo, Monica+Andy
   ============================================ */
.pdp { padding: 80px 0 60px; animation: fadeInUp 0.4s var(--ease); }
.pdp.hidden { display: none; }
.pdp__loading {
    min-height: 52vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    text-align: center;
    color: var(--text-mid);
}
.pdp__loading[hidden] { display: none !important; }
.pdp__loading-spinner {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    border: 3px solid rgba(124,154,142,0.2);
    border-top-color: var(--sage);
    animation: spin 0.8s linear infinite;
}
.pdp__loading strong {
    color: var(--text);
    font-size: 0.95rem;
}
.pdp__loading span {
    font-size: 0.82rem;
}
.pdp--loading .pdp__breadcrumb,
.pdp--loading .pdp__grid,
.pdp--loading .pdp__tabs,
.pdp--loading .pdp__tab-content,
.pdp--loading .pdp__related,
.pdp--loading .pdp__fbt {
    display: none !important;
}
@keyframes spin { to { transform: rotate(360deg); } }

.pdp__breadcrumb {
    display: flex; align-items: center; gap: 8px; margin-bottom: 30px;
    font-size: 0.82rem; color: var(--text-light);
}
.pdp__breadcrumb a { color: var(--text-mid); transition: color 0.2s; text-decoration: none; }
.pdp__breadcrumb a:hover { color: var(--cta); }
.pdp__breadcrumb i { font-size: 0.55rem; color: var(--text-light); }
.pdp__breadcrumb span { color: var(--text); font-weight: 600; }

.pdp__grid {
    display: grid; grid-template-columns: 1fr 1fr; gap: 60px;
    margin-bottom: 60px;
}

/* PDP LEFT — Image */
.pdp__media { position: sticky; top: 120px; }
.pdp__image-main {
    width: 100%;
    aspect-ratio: 1 / 1;
    max-height: min(560px, calc(100vh - 190px));
    border-radius: var(--radius-xl);
    display: flex; align-items: center; justify-content: center;
    overflow: hidden;
    background: linear-gradient(135deg, #fbf7f0, #f4eee6);
    position: relative;
}
.pdp__hero-counter {
    position: absolute;
    right: 12px;
    bottom: 12px;
    z-index: 4;
    padding: 5px 10px;
    border-radius: 999px;
    background: rgba(26, 22, 18, 0.62);
    color: rgba(255, 255, 255, 0.94);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    pointer-events: none;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}
.pdp__main-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 24px;
}
.pdp__image-main .pdp__main-video,
video.pdp__main-video {
    position: absolute;
    inset: 0;
    width: 100% !important;
    height: 100% !important;
    max-width: none;
    max-height: none;
    display: block;
    object-fit: cover;
    object-position: center;
    background: linear-gradient(135deg, #fbf7f0, #f4eee6);
    border-radius: inherit;
}
.pdp__image-main--video {
    cursor: default;
    overflow: hidden;
}
.pdp__main-video--lightbox {
    position: static;
    width: min(94vw, 1100px);
    max-height: 78vh;
    max-width: 100%;
    height: auto !important;
    object-fit: contain;
    background: #111;
    border-radius: 18px;
}
.pdp__thumbnail-frame {
    position: relative;
    width: 100%;
    max-width: 100%;
    margin-top: 10px;
}
.pdp__thumbnail-frame[hidden] {
    display: none !important;
}
.pdp__thumbnail-frame::before,
.pdp__thumbnail-frame::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 8px;
    z-index: 2;
    width: 42px;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.18s ease;
}
.pdp__thumbnail-frame::before {
    left: 0;
    background: linear-gradient(90deg, var(--cream) 20%, rgba(255,255,255,0));
}
.pdp__thumbnail-frame::after {
    right: 0;
    background: linear-gradient(270deg, var(--cream) 20%, rgba(255,255,255,0));
}
.pdp__thumbnail-frame--scrollable:not(.pdp__thumbnail-frame--at-start)::before,
.pdp__thumbnail-frame--scrollable:not(.pdp__thumbnail-frame--at-end)::after {
    opacity: 1;
}
.pdp__thumbnails {
    display: flex;
    gap: 8px;
    width: 100%;
    max-width: 100%;
    padding: 2px 38px 8px;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x proximity;
}
.pdp__thumbnails::-webkit-scrollbar { display: none; }
.pdp__thumbnails[hidden] { display: none !important; }
.pdp__thumb-nav {
    position: absolute;
    top: calc(50% - 4px);
    z-index: 3;
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    padding: 0;
    border: 1px solid rgba(92,72,58,0.12);
    border-radius: 999px;
    background: rgba(255,255,255,0.92);
    color: var(--text);
    box-shadow: 0 8px 20px rgba(92,72,58,0.12);
    cursor: pointer;
    font-size: 0.78rem;
    line-height: 1;
    transform: translateY(-50%);
    transition: opacity 0.18s ease, transform 0.18s ease, background 0.18s ease;
}
.pdp__thumb-nav:hover {
    background: var(--white);
    transform: translateY(-50%) scale(1.04);
}
.pdp__thumb-nav--prev { left: 5px; }
.pdp__thumb-nav--next { right: 5px; }
.pdp__thumbnail-frame--at-start .pdp__thumb-nav--prev,
.pdp__thumbnail-frame--at-end .pdp__thumb-nav--next,
.pdp__thumbnail-frame:not(.pdp__thumbnail-frame--scrollable) .pdp__thumb-nav {
    opacity: 0;
    pointer-events: none;
}
.pdp-thumb {
    flex: 0 0 68px;
    width: 68px;
    aspect-ratio: 1;
    min-width: 0;
    border: 1.5px solid var(--border);
    border-radius: 12px;
    overflow: hidden;
    padding: 0;
    background: var(--white);
    cursor: pointer;
    scroll-snap-align: start;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
.pdp-thumb:hover {
    border-color: var(--sage);
    transform: translateY(-1px);
}
.pdp-thumb--active {
    border-color: var(--cta);
    box-shadow: 0 0 0 2px rgba(196, 114, 92, 0.18);
}
.pdp-thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.pdp-thumb__video {
    position: relative;
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    background: #1a1612;
}
.pdp-thumb__video img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.pdp-thumb__video-play {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    color: #fff;
    background: rgba(26, 22, 18, 0.34);
    font-size: 0.95rem;
}
.pdp__quick-facts {
    margin-top: 14px;
    padding: 14px;
    border: 1px solid rgba(124,154,142,0.18);
    border-radius: 18px;
    background: rgba(255,255,255,0.78);
    box-shadow: 0 14px 34px rgba(92,72,58,0.06);
}
.pdp__quick-facts-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}
.pdp__quick-facts-head strong {
    color: var(--text);
    font-size: 0.88rem;
}
.pdp__quick-facts-head span {
    color: var(--text-muted);
    font-size: 0.68rem;
    font-weight: 700;
}
.pdp__quick-facts-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}
.pdp__quick-fact {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 9px;
    align-items: start;
    padding: 9px;
    border-radius: 13px;
    background: linear-gradient(135deg, rgba(232,240,236,0.56), rgba(250,246,241,0.72));
}
.pdp__quick-fact i {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--sage-light);
    color: var(--sage-dark);
    font-size: 0.75rem;
}
.pdp__quick-fact strong {
    display: block;
    color: var(--text);
    font-size: 0.72rem;
    line-height: 1.2;
}
.pdp__quick-fact span {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    color: var(--text-mid);
    font-size: 0.7rem;
    line-height: 1.32;
}
.pdp__emoji { font-size: 10rem; filter: drop-shadow(0 20px 40px rgba(0,0,0,0.08)); }
.pdp__placeholder {
    position: absolute;
    inset: 18px;
    border-radius: 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    background: rgba(255,255,255,0.44);
    border: 1px solid rgba(255,255,255,0.62);
    overflow: hidden;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.65), 0 18px 44px rgba(38,50,56,0.1);
    backdrop-filter: blur(8px);
}
.pdp__placeholder .pdp__emoji {
    position: relative;
    z-index: 1;
}
.pdp__placeholder-shine {
    position: absolute;
    inset: 0;
    background: linear-gradient(120deg, transparent 20%, rgba(255,255,255,0.55) 45%, transparent 70%);
    transform: translateX(-100%);
    animation: placeholder-shine 4s ease-in-out infinite;
}
.pdp__placeholder-label {
    position: relative;
    z-index: 1;
    padding: 6px 14px;
    border-radius: 999px;
    background: rgba(255,255,255,0.78);
    color: var(--text-mid);
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

/* PDP RIGHT — Info Panel */
.pdp__info { padding-top: 6px; }
.pdp__header { margin-bottom: 10px; }
.pdp__cat {
    display: inline-flex;
    font-size: 0.62rem; font-weight: 850; color: var(--cta);
    text-transform: uppercase; letter-spacing: 0.14em; margin-bottom: 5px;
}
.pdp__name {
    font-family: var(--font-display);
    font-size: clamp(1.18rem, 1.7vw, 1.42rem);
    font-weight: 800;
    color: var(--text);
    line-height: 1.18;
    margin-bottom: 9px;
    letter-spacing: -0.015em;
    max-width: 36rem;
}
.pdp__rating-row {
    display: flex; align-items: center; gap: 7px; margin-bottom: 10px;
}
.pdp__rating-row .fa-star, .pdp__rating-row .fa-star-half-alt { color: #E8B931; font-size: 0.85rem; }
.pdp__rating-row .far.fa-star { color: #E0D8D0; font-size: 0.85rem; }
.pdp__review-count { font-size: 0.8rem; color: var(--text-mid); }

.pdp__price-section {
    display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
    margin-bottom: 12px; padding-bottom: 12px; border-bottom: 1px solid var(--border);
}
.pdp__price { font-size: clamp(1.45rem, 2.2vw, 1.75rem); font-weight: 850; color: var(--text); letter-spacing: -0.02em; }
.pdp__old-price { font-size: 0.98rem; color: var(--text-light); text-decoration: line-through; }
.pdp__save {
    padding: 4px 10px; border-radius: var(--radius-full);
    background: #E8F5E9; color: #2E7D32; font-size: 0.72rem; font-weight: 800;
}
.pdp__save.hidden { display: none; }

/* PDP Meta Tags */
.pdp__meta { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.pdp__meta-tag {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 5px 10px; border-radius: var(--radius-full);
    font-size: 0.72rem; font-weight: 750;
    max-width: 100%;
}
.pdp__meta-tag--age { background: var(--sage-light); color: var(--sage-dark); }
.pdp__meta-tag--material { background: var(--clay-light); color: var(--clay-dark); }
.pdp__meta-tag--cert { background: #E8F5E9; color: #2E7D32; }

/* Stock warning */
.pdp__stock {
    display: flex; align-items: center; gap: 6px;
    font-size: 0.85rem; font-weight: 700; color: #D84315;
    margin-bottom: 14px; padding: 10px 16px;
    background: #FFF3E0; border-radius: var(--radius-md);
}
.pdp__stock i { animation: pulse 1.5s infinite; }
.pdp__stock.hidden { display: none; }

/* Social proof */
.pdp__social-proof {
    display: flex; align-items: center; gap: 6px;
    font-size: 0.78rem; color: var(--text-mid);
    margin-bottom: 12px; padding: 7px 10px;
    background: #F5F5F5; border-radius: var(--radius-md);
}
.pdp__social-proof i { color: var(--sage); }
.pdp__price-alert {
    background: var(--white); border: 1px solid var(--border);
    color: var(--text-mid); cursor: pointer; font-size: 0.72rem;
    border-radius: 999px; padding: 6px 10px; font-weight: 750;
    white-space: nowrap; transition: all 0.2s ease;
}
.pdp__price-alert:hover { border-color: var(--cta); color: var(--cta); transform: translateY(-1px); }
#pdp-fav-count {
    font-size: 0.74rem !important;
    margin-bottom: 12px !important;
    padding: 0 !important;
    border-radius: 0 !important;
}
.pdp__activity {
    display: block;
    margin: 0 0 12px;
}
.pdp__activity[hidden] { display: none !important; }
.pdp__activity-card {
    display: grid;
    gap: 10px;
    padding: 12px 13px;
    border-radius: 16px;
    border: 1px solid rgba(232,220,209,0.86);
    background:
        linear-gradient(135deg, rgba(255,255,255,0.96), rgba(250,247,243,0.86));
    box-shadow: 0 10px 24px rgba(92,72,58,0.06), inset 0 1px 0 rgba(255,255,255,0.85);
}
.pdp__activity-head {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}
.pdp__activity-signal {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(124,154,142,0.25);
    background: linear-gradient(135deg, var(--sage-light), rgba(255,255,255,0.92));
    color: var(--sage-dark);
    box-shadow: 0 6px 16px rgba(92,72,58,0.08);
    font-size: 0.78rem;
}
.pdp__activity-copy {
    min-width: 0;
}
.pdp__activity-copy strong {
    display: block;
    color: var(--text);
    font-family: var(--font-display);
    font-size: 0.88rem;
    line-height: 1.15;
}
.pdp__activity-copy small {
    display: block;
    margin-top: 2px;
    color: var(--text-muted);
    font-size: 0.68rem;
    font-weight: 700;
}
.pdp__activity-chips {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
}
.pdp__activity-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 30px;
    padding: 6px 10px;
    border-radius: 12px;
    background: rgba(255,255,255,0.82);
    border: 1px solid rgba(232,220,209,0.95);
    color: var(--text-mid);
    font-size: 0.72rem;
    font-weight: 800;
    box-shadow: 0 8px 22px rgba(92,72,58,0.06);
    white-space: nowrap;
}
.pdp__activity-chip i {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.66rem;
}
.pdp__activity-chip--favorite {
    border-color: rgba(251,207,232,0.95);
    background: linear-gradient(135deg, rgba(253,242,248,0.92), rgba(255,241,242,0.88));
    color: #9f1239;
}
.pdp__activity-chip--favorite i { background: #fff1f2; color: #e11d48; }
.pdp__activity-chip--purchase {
    border-color: rgba(196,114,92,0.24);
    background: linear-gradient(135deg, rgba(245,237,227,0.9), rgba(255,247,237,0.88));
    color: var(--cta);
}
.pdp__activity-chip--purchase i { background: var(--clay-light); color: var(--cta); }
.pdp__activity-chip--views {
    border-color: rgba(124,154,142,0.28);
    background: linear-gradient(135deg, rgba(232,240,236,0.92), rgba(255,255,255,0.86));
    color: var(--sage-dark);
}
.pdp__activity-chip--views i { background: var(--sage-light); color: var(--sage-dark); }
@media (max-width: 640px) {
    .pdp__activity-card { padding: 11px; }
    .pdp__activity-chip { width: 100%; justify-content: center; }
}

.pdp__variant-panel {
    display: grid;
    gap: 10px;
    margin: 8px 0 10px;
    padding: 11px;
    border: 1px solid var(--border);
    border-radius: 13px;
    background: rgba(255,255,255,0.74);
}
.pdp__variant-panel-title {
    font-size: 0.64rem;
    font-weight: 850;
    color: var(--text-mid);
    text-transform: uppercase;
    letter-spacing: 0.12em;
}
.pdp__variant-group {
    display: grid;
    gap: 6px;
}
.pdp__variant-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    font-size: 0.74rem;
    font-weight: 800;
    color: var(--text);
}
.pdp__variant-name {
    color: var(--text);
}
.pdp__variant-selected {
    color: var(--text-mid);
    font-size: 0.68rem;
    font-weight: 700;
}
.pdp__variant-selected strong {
    color: var(--cta);
    font-weight: 850;
}
.pdp__variant-options {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}
.pdp__option-pill {
    min-width: 76px;
    min-height: 36px;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-content: center;
    gap: 1px;
    text-align: left;
    border: 1.5px solid var(--border);
    background: var(--white);
    color: var(--text);
    border-radius: 11px;
    padding: 6px 10px;
    font-size: 0.76rem;
    font-weight: 800;
    cursor: pointer;
    box-shadow: 0 6px 16px rgba(31,41,55,0.04);
    transition: border-color 0.2s, background 0.2s, color 0.2s, box-shadow 0.2s;
}
.pdp__option-pill:hover {
    border-color: rgba(196,114,92,0.42);
    box-shadow: 0 8px 20px rgba(31,41,55,0.07);
}
.pdp__option-pill.active {
    border-color: var(--cta);
    background: rgba(196,114,92,0.07);
    color: var(--cta);
    box-shadow: 0 0 0 2px rgba(196,114,92,0.12);
}
.pdp__option-pill span {
    display: block;
    line-height: 1.1;
}
.pdp__option-pill small {
    font-size: 0.63rem;
    color: var(--sage-dark);
    font-weight: 850;
}
.pdp__option-pill em {
    font-style: normal;
    font-size: 0.59rem;
    color: var(--text-light);
    font-weight: 750;
}
.pdp__color-swatch {
    position: relative;
    min-height: 34px;
    border-radius: 999px;
    border: 1.5px solid var(--border);
    background: var(--white);
    color: var(--text);
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 5px 10px 5px 6px;
    font-size: 0.72rem;
    font-weight: 800;
    cursor: pointer;
    box-shadow: 0 6px 16px rgba(31,41,55,0.04);
    transition: transform 0.2s, border-color 0.2s, box-shadow 0.2s, background 0.2s;
}
.pdp__color-swatch::before {
    content: '';
    width: 23px;
    height: 23px;
    border-radius: 50%;
    background: var(--swatch);
    border: 1px solid rgba(31,41,55,0.12);
    box-shadow: inset 0 1px 4px rgba(0,0,0,0.12);
}
.pdp__color-swatch span {
    display: inline-block;
    line-height: 1;
}
.pdp__color-swatch.active {
    border-color: var(--cta);
    background: rgba(196,114,92,0.06);
    color: var(--cta);
    box-shadow: 0 0 0 2px rgba(196,114,92,0.12), 0 8px 20px rgba(31,41,55,0.06);
}
.pdp__color-swatch:hover {
    transform: translateY(-1px);
}

/* Actions row */
.pdp__actions {
    display: flex; gap: 12px; align-items: center;
    margin-bottom: 10px;
}
.pdp__secondary-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin: 0 0 16px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--border);
}
.pdp__buy-now {
    margin: 0 0 10px;
    border-color: rgba(196,114,92,0.34);
    color: var(--cta);
    background: rgba(196,114,92,0.06);
    font-weight: 850;
}
.pdp__buy-now:hover {
    background: rgba(196,114,92,0.11);
    border-color: var(--cta);
}
.pdp__secondary-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 0;
    background: transparent;
    color: var(--text-mid);
    font-size: 0.72rem;
    font-weight: 750;
    cursor: pointer;
    padding: 6px 8px;
    border-radius: 999px;
}
.pdp__secondary-link:hover {
    color: var(--cta);
    background: var(--bg-cream);
}
.pdp__wishlist-btn {
    width: 52px; height: 52px; border-radius: var(--radius-md);
    border: 1.5px solid var(--border); background: var(--white);
    display: flex; align-items: center; justify-content: center;
    font-size: 1.1rem; color: var(--text-light); cursor: pointer;
    transition: all var(--duration) var(--ease-bounce); flex-shrink: 0;
}
.pdp__wishlist-btn:hover, .pdp__wishlist-btn.active { border-color: #E53935; color: #E53935; }
.pdp__wishlist-btn.active {
    background: #fff1f2;
    box-shadow: 0 10px 24px rgba(225, 29, 72, 0.14);
}
.pdp__buyer-card {
    display: grid; gap: 9px; margin: 0 0 10px;
    padding: 13px; border-radius: 15px;
    background: var(--white);
    border: 1px solid var(--border);
    box-shadow: 0 10px 26px rgba(92,72,58,0.05);
}
.pdp__buyer-card-item {
    display: grid; grid-template-columns: 30px 1fr; gap: 10px; align-items: start;
}
.pdp__buyer-card-item i {
    width: 30px; height: 30px; border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--sage-light); color: var(--sage-dark);
    font-size: 0.8rem;
}
.pdp__buyer-card-item strong {
    display: block; font-size: 0.82rem; color: var(--text); margin-bottom: 1px;
}
.pdp__buyer-card-item span {
    display: block; font-size: 0.74rem; color: var(--text-mid); line-height: 1.35;
}
.pdp__utility-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 12px;
}
.pdp__utility-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 32px;
    padding: 7px 10px;
    border-radius: 999px;
    border: 1px solid var(--border);
    background: var(--white);
    color: var(--text-mid);
    font-size: 0.74rem;
    font-weight: 800;
    cursor: pointer;
    transition: border-color 0.2s, background 0.2s, color 0.2s;
}
.pdp__utility-btn:hover {
    border-color: var(--sage);
    background: var(--sage-light);
    color: var(--sage-dark);
}
.pdp__utility-btn i { color: var(--sage-dark); font-size: 0.78rem; }
.pdp__size-guide-wrap { margin: 0 0 14px; }

/* Tabs */
.pdp__tabs {
    display: flex;
    gap: 6px;
    border-bottom: 1px solid var(--border);
    margin-bottom: 18px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    scroll-snap-type: x proximity;
}
.pdp__tabs::-webkit-scrollbar { display: none; }
.pdp__tab {
    flex: 0 0 auto;
    scroll-snap-align: start;
    padding: 10px 12px;
    font-size: 0.82rem;
    font-weight: 800;
    color: var(--text-light);
    cursor: pointer;
    border: none;
    background: transparent;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    white-space: nowrap;
    transition: all 0.2s ease;
}
.pdp__tab:hover { color: var(--text); }
.pdp__tab.active { color: var(--cta); border-bottom-color: var(--cta); }

/* Tab content */
.pdp__tab-content { animation: fadeInUp 0.3s var(--ease); min-height: 150px; }

.pdp__desc { font-size: 0.95rem; line-height: 1.8; color: var(--text-mid); margin-bottom: 20px; }
.pdp__features { list-style: none; padding: 0; margin: 0; }
.pdp__features li {
    padding: 10px 0; border-bottom: 1px solid rgba(0,0,0,0.05);
    font-size: 0.9rem; color: var(--text-mid); display: flex; align-items: center; gap: 10px;
}
.pdp__features li i { color: var(--sage); font-size: 0.75rem; }
.pdp__details-inline {
    margin-top: 18px;
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: 16px;
    background: var(--bg-cream);
}
.pdp__details-inline h4 {
    margin: 0 0 8px;
    font-size: 0.86rem;
    color: var(--text);
    font-weight: 850;
}

.pdp__specs-table { width: 100%; border-collapse: collapse; }
.pdp__specs-table tr { border-bottom: 1px solid var(--border); }
.pdp__specs-table td { padding: 12px 0; font-size: 0.88rem; }
.pdp__specs-table td:first-child { color: var(--text-light); width: 40%; }
.pdp__specs-table td:last-child { color: var(--text); font-weight: 500; }

/* Safety tab */
.pdp__safety-badges {
    display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 24px;
}
.pdp__safety-badge {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 10px 18px; border-radius: var(--radius-md);
    background: #E8F5E9; color: #2E7D32; font-size: 0.85rem; font-weight: 700;
}
.pdp__safety-info h4 {
    font-size: 1rem; color: var(--text); margin-bottom: 12px;
    display: flex; align-items: center; gap: 8px;
}
.pdp__safety-info h4 i { color: #2E7D32; }
.pdp__safety-info ul { list-style: none; padding: 0; }
.pdp__safety-info li {
    padding: 8px 0; font-size: 0.88rem; color: var(--text-mid);
    padding-left: 20px; position: relative;
}
.pdp__safety-info li::before {
    content: '✓'; position: absolute; left: 0; color: #2E7D32; font-weight: 700;
}

/* Reviews tab */
.pdp__reviews-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
}
.pdp__reviews-summary {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    margin-bottom: 0;
    padding: 14px;
    background: var(--sage-light);
    border: 1px solid rgba(124,154,142,0.18);
    border-radius: 16px;
}
.pdp__reviews-score,
.pdp__reviews-big {
    width: 58px;
    height: 58px;
    border-radius: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--white);
    border: 1px solid rgba(124,154,142,0.2);
    font-size: 1.85rem;
    font-weight: 900;
    color: var(--text);
    line-height: 1;
}
.pdp__reviews-copy { min-width: 0; }
.pdp__reviews-stars { display: flex; gap: 2px; margin-bottom: 3px; }
.pdp__reviews-summary .fa-star,
.pdp__reviews-summary .fa-star-half-alt { color: #E8B931; font-size: 0.78rem; }
.pdp__reviews-summary .far.fa-star { color: #D9D0C7; font-size: 0.78rem; }
.pdp__reviews-summary strong { display: block; font-size: 0.84rem; color: var(--text); }
.pdp__reviews-summary span,
.pdp__reviews-summary small { display: block; color: var(--text-mid); font-size: 0.74rem; line-height: 1.35; }
.pdp__write-review {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 40px;
    padding: 9px 14px;
    border-radius: 999px;
    border: 1px solid var(--border);
    background: var(--white);
    color: var(--text);
    font-size: 0.82rem;
    font-weight: 850;
    box-shadow: 0 8px 22px rgba(31,41,55,0.04);
}
.pdp__write-review:hover {
    border-color: var(--cta);
    color: var(--cta);
    background: rgba(196,114,92,0.06);
}

.pdp__review {
    padding: 14px 0; border-bottom: 1px solid var(--border);
}
.pdp__review:last-child { border-bottom: none; }
.pdp__review-header { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; }
.pdp__review-avatar {
    width: 40px; height: 40px; border-radius: var(--radius-full);
    background: linear-gradient(135deg, var(--sage-light), var(--blush-light));
    display: flex; align-items: center; justify-content: center;
    font-size: 0.78rem; font-weight: 700; color: var(--cta); flex-shrink: 0;
}
.pdp__review-info strong { font-size: 0.9rem; display: block; margin-bottom: 2px; }
.pdp__review-verified {
    display: inline-flex; align-items: center; gap: 3px;
    font-size: 0.7rem; font-weight: 600; color: #2E7D32;
    background: #E8F5E9; padding: 2px 8px; border-radius: var(--radius-full);
}
.pdp__review-meta { font-size: 0.75rem; color: var(--text-light); margin-top: 2px; }
.pdp__review-stars { display: flex; gap: 2px; margin-bottom: 6px; }
.pdp__review-stars i { color: #E8B931; font-size: 0.7rem; }
.pdp__review-text { font-size: 0.9rem; color: var(--text-mid); line-height: 1.7; }
.pdp__no-reviews { color: var(--text-light); font-size: 0.88rem; padding: 20px 0; }

/* Related Products */
.pdp__related { padding-top: 40px; border-top: 1px solid var(--border); }
.pdp__related-title {
    font-family: var(--font-display); font-size: 1.6rem; font-weight: 700;
    color: var(--text); margin-bottom: 24px;
}
.pdp__related-grid {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 240px)); gap: 18px;
}
.p-card--mini .p-card__body { padding: 12px; }
.p-card--mini .p-card__media { height: 190px; }
.p-card--mini .p-card__name { font-size: 0.88rem; }

.mini-product-media {
    background: var(--bg-alt);
    border: 1px solid var(--border);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.mini-product-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.mini-product-media img + .mini-product-media__fallback { display: none; }
.mini-product-media__fallback {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.45rem;
}

/* Sticky Mobile CTA */
.pdp__sticky-cta {
    position: fixed; bottom: 0; left: 0; right: 0; z-index: 100;
    background: var(--white); border-top: 1px solid var(--border);
    box-shadow: 0 -4px 20px rgba(0,0,0,0.08);
    transform: translateY(100%); transition: transform 0.3s var(--ease);
    display: none;
}
.pdp__sticky-cta.visible { transform: translateY(0); }
.pdp__sticky-cta.hidden { display: none; }
.pdp__sticky-inner {
    max-width: 1200px; margin: 0 auto; padding: 12px 24px;
    display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
.pdp__sticky-name { font-weight: 700; font-size: 0.9rem; }
.pdp__sticky-price { font-weight: 800; color: var(--cta); font-size: 1rem; }

.btn--sm { padding: 6px 14px; font-size: 0.78rem; }

/* ============================================
   WISHLIST
   ============================================ */
.p-card__wishlist {
    position: absolute; top: 14px; right: 14px; z-index: 4;
    width: 36px; height: 36px; border-radius: var(--radius-full);
    background: var(--white); display: flex; align-items: center; justify-content: center;
    font-size: 0.9rem; color: var(--text-light); cursor: pointer;
    transition: all var(--duration) var(--ease-bounce);
    box-shadow: var(--shadow-sm); border: none;
}
.p-card__wishlist:hover { color: #E53935; transform: scale(1.12); }
.p-card__wishlist.active { color: #E53935; }
.p-card__wishlist.active i { font-weight: 900; }

.wishlist-sidebar .cart__body { padding: 16px 20px 22px; }
.wishlist-drawer__empty { text-align: center; padding: 34px 10px 22px; }
.wishlist-drawer__empty-icon { width: 64px; height: 64px; border-radius: 22px; margin: 0 auto 14px; display: flex; align-items: center; justify-content: center; background: var(--blush-light); color: var(--cta); font-size: 1.6rem; }
.wishlist-drawer__empty h3 { font-family: var(--font-display); font-size: 1.2rem; margin-bottom: 6px; color: var(--text); }
.wishlist-drawer__empty p { color: var(--text-mid); font-size: 0.86rem; line-height: 1.5; max-width: 280px; margin: 0 auto 16px; }
.wishlist-drawer__actions { display: flex; justify-content: center; gap: 8px; flex-wrap: wrap; }
.wishlist-drawer__actions .btn { padding: 9px 16px; font-size: 0.82rem; }
.wishlist-drawer__section { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--border); }
.wishlist-drawer__section-title { font-size: 0.72rem; font-weight: 900; text-transform: uppercase; letter-spacing: 1.4px; color: var(--text-light); margin-bottom: 10px; }
.wishlist-drawer__summary { padding: 13px 14px; border: 1px solid var(--border); border-radius: 18px; background: linear-gradient(135deg, rgba(252,234,233,0.55), rgba(232,240,236,0.65)); margin-bottom: 12px; box-shadow: 0 10px 28px rgba(31,41,55,0.05); }
.wishlist-drawer__summary small { display: block; color: var(--cta); font-size: 0.66rem; font-weight: 900; text-transform: uppercase; letter-spacing: 0.12em; margin-bottom: 4px; }
.wishlist-drawer__summary strong { display: block; font-family: var(--font-display); font-size: 0.98rem; color: var(--text); }
.wishlist-drawer__summary span { color: var(--text-mid); font-size: 0.76rem; line-height: 1.4; }
.wishlist-drawer__item,
.wishlist-drawer__suggestion { position: relative; display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 12px; align-items: center; padding: 12px; border: 1px solid var(--border); border-radius: 18px; background: var(--white); margin-bottom: 10px; box-shadow: 0 10px 26px rgba(31,41,55,0.05); }
.wishlist-drawer__media { width: 76px; height: 76px; border-radius: 16px; background: var(--bg-alt); flex: 0 0 auto; display: flex; align-items: center; justify-content: center; overflow: hidden; font-size: 1.7rem; }
.wishlist-drawer__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.wishlist-drawer__info { flex: 1; min-width: 0; }
.wishlist-drawer__info strong { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 0.83rem; line-height: 1.22; color: var(--text); padding-right: 62px; }
.wishlist-drawer__info span { display: block; margin-top: 4px; color: var(--cta); font-weight: 800; font-size: 0.8rem; }
.wishlist-drawer__meta { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 5px; padding-right: 72px; }
.wishlist-drawer__meta span {
    margin: 0; display: inline-flex; align-items: center; gap: 4px;
    padding: 0; border-radius: 0; background: transparent;
    color: var(--text-light); font-size: 0.64rem; font-weight: 850;
}
.wishlist-drawer__meta .wishlist-drawer__meta-low { background: transparent; color: #b45309; }
.wishlist-drawer__meta span:nth-child(2) { color: var(--cta); }
.wishlist-drawer__meta span:nth-child(3) { color: #b45309; }
.wishlist-drawer__urgency-row { display: flex; flex-wrap: wrap; gap: 5px; margin: 0 0 6px; padding-right: 76px; }
.wishlist-drawer__urgency {
    display: inline-flex; align-items: center; gap: 4px; padding: 4px 7px;
    border-radius: 999px; font-size: 0.58rem; font-weight: 950; line-height: 1;
}
.wishlist-drawer__urgency--sale { background: #fbe8e2; color: var(--cta); border: 1px solid rgba(196,114,92,0.18); }
.wishlist-drawer__urgency--timer { background: #fff7ed; color: #b45309; border: 1px solid rgba(180,83,9,0.12); }
.wishlist-drawer__price-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 5px 0 9px; }
.wishlist-drawer__price-stack { display: flex; align-items: baseline; gap: 7px; flex-wrap: wrap; }
.wishlist-drawer__price-stack del { color: var(--text-light); font-size: 0.72rem; font-weight: 800; }
.wishlist-drawer__price-stack span { margin: 0; color: var(--cta); font-weight: 950; font-size: 0.9rem; }
.wishlist-drawer__link { color: #5F544D; font-size: 0.72rem; font-weight: 900; text-decoration: underline; text-underline-offset: 2px; white-space: nowrap; }
.wishlist-drawer__suggestion-save {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    min-height: 34px; padding: 0 11px; border-radius: 999px;
    background: rgba(251,232,226,0.72); color: var(--cta);
    border: 1px solid rgba(196,114,92,0.16);
    font-weight: 900; font-size: 0.7rem; white-space: nowrap;
}
.wishlist-drawer__suggestion-save:hover { background: var(--cta); color: var(--white); transform: translateY(-1px); }
.wishlist-drawer__section--compact { margin-top: 16px; }
.wishlist-drawer__suggestion--mini { grid-template-columns: 58px minmax(0, 1fr) auto; padding: 10px; border-radius: 17px; }
.wishlist-drawer__suggestion--mini .wishlist-drawer__media { width: 58px; height: 58px; border-radius: 14px; }
.wishlist-drawer__suggestion--mini .wishlist-drawer__info strong { font-size: 0.8rem; }
.wishlist-drawer__item { grid-template-columns: 92px minmax(0, 1fr); align-items: center; padding: 12px; border-radius: 20px; gap: 12px; }
.wishlist-drawer__item .wishlist-drawer__media { width: 92px; height: 104px; border-radius: 18px; }
.wishlist-drawer__remove {
    position: absolute; top: 10px; right: 10px; width: 32px; height: 32px; padding: 0;
    border-radius: 999px; background: #ffe4e6; border: 1px solid #fecdd3;
    color: #e11d48; display: flex; align-items: center; justify-content: center;
    box-shadow: 0 4px 12px rgba(225, 29, 72, 0.12); z-index: 2; font-size: 0.82rem;
}
.wishlist-drawer__remove i { color: #e11d48; }
.wishlist-drawer__remove:hover { background: #fecdd3; border-color: #fda4af; transform: scale(1.04); }
.wishlist-drawer__remove:hover i { color: #be123c; }
.wishlist-drawer__remove:active { transform: scale(0.94); background: #fda4af; }
body.dark-mode .wishlist-drawer__remove {
    background: rgba(190, 18, 60, 0.18);
    border-color: rgba(251, 113, 133, 0.35);
    box-shadow: none;
}
body.dark-mode .wishlist-drawer__remove i { color: #fb7185; }
body.dark-mode .wishlist-drawer__remove:hover { background: rgba(190, 18, 60, 0.32); }
body.dark-mode .wishlist-drawer__remove:hover i { color: #fda4af; }
.wishlist-drawer__add { width: 100%; justify-content: center; min-height: 36px; border-radius: 999px; }
.wishlist-item {
    display: flex; gap: 14px; padding: 14px 0;
    border-bottom: 1px solid var(--border);
    animation: fadeInUp 0.3s var(--ease);
}
.wishlist-item__img {
    width: 60px; height: 60px; border-radius: var(--radius-md); flex-shrink: 0;
    display: flex; align-items: center; justify-content: center; font-size: 1.8rem;
}
.wishlist-item__info { flex: 1; }
.wishlist-item__name { font-weight: 600; font-size: 0.88rem; margin-bottom: 3px; }
.wishlist-item__price { color: var(--cta); font-weight: 700; font-size: 0.85rem; margin-bottom: 6px; }
.wishlist-item__remove { color: var(--text-light); font-size: 0.78rem; padding: 4px; align-self: start; margin-left: auto; cursor: pointer; border: none; background: none; }
.wishlist-item__remove:hover { color: #dc3545; }
.wishlist__empty { text-align: center; padding: 60px 0; }
.wishlist__empty-icon { font-size: 3rem; display: block; margin-bottom: 12px; opacity: 0.4; }
.wishlist__empty p { font-weight: 600; color: var(--text-mid); }
.wishlist__empty small { color: var(--text-light); }

/* ============================================
   CART SHIPPING PROGRESS
   ============================================ */
.cart__shipping { margin-bottom: 7px; padding: 7px 10px; background: var(--sage-light); border-radius: 13px; }
.cart__shipping-bar { width: 100%; height: 4px; background: rgba(124,154,142,0.2); border-radius: var(--radius-full); overflow: hidden; margin-bottom: 5px; }
.cart__shipping-fill { height: 100%; background: linear-gradient(90deg, var(--sage), var(--sage-dark)); border-radius: var(--radius-full); transition: width 0.6s var(--ease); }
.cart__shipping p { font-size: 0.68rem; color: var(--sage-dark); font-weight: 700; margin: 0; text-align: center; }
.cart__shipping.free { background: #E8F5E9; }
.cart__shipping.free p { color: #2E7D32; }
.cart__shipping.free .cart__shipping-fill { background: #4CAF50; }
.cart__kargo { display: flex; justify-content: space-between; margin-bottom: 8px; font-size: 0.9rem; color: var(--text-mid); }
.cart__payment-icons { display: flex; justify-content: center; gap: 10px; margin-top: 10px; font-size: 1.4rem; color: var(--text-light); }

/* ============================================
   LIVE CHAT BUTTON
   ============================================ */
.whatsapp-btn {
    position: fixed; bottom: 90px; right: 30px; z-index: 98;
    width: 56px; height: 56px; border-radius: var(--radius-full);
    background: #25D366; color: var(--white);
    display: flex; align-items: center; justify-content: center;
    font-size: 1.6rem; box-shadow: 0 4px 20px rgba(37,211,102,0.4);
    transition: all var(--duration) var(--ease-bounce);
    animation: float 3s ease-in-out infinite;
}
.whatsapp-btn:hover { transform: scale(1.1) translateY(-4px); box-shadow: 0 8px 30px rgba(37,211,102,0.5); color: var(--white); }
.whatsapp-btn__tooltip {
    position: absolute; bottom: 100%; right: 0; margin-bottom: 10px;
    background: var(--white); color: var(--text); padding: 8px 16px;
    border-radius: var(--radius-md); font-size: 0.78rem; font-weight: 600;
    white-space: nowrap; box-shadow: var(--shadow-lg);
    opacity: 0; transform: translateY(4px); pointer-events: none;
    transition: all var(--duration) var(--ease);
}
.whatsapp-btn:hover .whatsapp-btn__tooltip { opacity: 1; transform: translateY(0); }

/* ============================================
   KEYFRAMES
   ============================================ */
@keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }
@keyframes pulse { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: 0.5; transform: scale(0.8); } }
@keyframes scrollWheel { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(12px); } }
@keyframes slideDown { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: translateY(0); } }
@keyframes fadeInUp { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* ============================================
   RESPONSIVE
   ============================================ */
@media (max-width: 1024px) {
    .announcement { padding-right: 48px; padding-left: 14px; font-size: 0.76rem; }
    .header__container { gap: 14px; padding: 0 18px; }
    .header__brand { font-size: 1.1rem; }
    .header__tagline { font-size: 0.56rem; letter-spacing: 1.1px; }
    .header__nav-list { gap: 22px; }
    .header__action-btn { width: 34px; height: 34px; }
    .header__actions { gap: 2px; }
    .header__actions-divider { margin: 0 2px; }
    .hero__container { grid-template-columns: 1fr; text-align: center; }
    .hero__desc { margin: 0 auto 32px; }
    .hero__actions { justify-content: center; }
    .hero__trust { justify-content: center; }
    .hero { padding-bottom: 42px; }
    .hero__showcase { margin-top: 24px; }
    .hero__showcase-info { justify-items: center; }
    .categories__grid { grid-template-columns: repeat(3, 1fr); }
    .products__grid { grid-template-columns: repeat(3, 1fr); }
    .story__grid { grid-template-columns: 1fr; }
    .story__visual { height: 400px; margin-bottom: 20px; }
    .trust-strip__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .trust-strip__grid--compact { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .trust-strip__item { padding: 14px; min-height: 78px; gap: 10px; }
    .trust-strip__icon { width: 38px; height: 38px; border-radius: 12px; }
    .promo__card { padding: 20px 22px; }
    .promo__left { grid-template-columns: auto minmax(190px, 1fr) auto auto; gap: 12px; }
    .promo__title { font-size: 1.05rem; }
    .promo__discount { font-size: 1.2rem; }
    .promo__text { font-size: 0.74rem; max-width: 180px; }
    .promo__left .btn { padding: 10px 16px; font-size: 0.8rem; }
    .promo__time-block { padding: 6px 9px; }
    .promo__time-block span { font-size: 0.95rem; }
    .promo__timer { justify-content: center; }
    .newsletter__card { flex-direction: column; text-align: center; }
    .newsletter__form { min-width: auto; width: 100%; }
    .footer__top { grid-template-columns: repeat(2, 1fr); }
    .footer__trust-badges { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pdp__grid { gap: 40px; }
    .pdp__thumbnails { gap: 8px; }
    .pdp-thumb { flex-basis: 64px; width: 64px; }
    .pdp__related-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 900px) {
    .header__tagline { display: none; }
    .header__logo-icon { font-size: 1.35rem; }
    .header__brand { font-size: 1rem; }
    .header__nav-list { gap: 16px; }
    .currency-switcher, .lang-switcher { display: none !important; }
}


@media (max-width: 768px) {
    /* === HAMBURGER MENU — Full screen overlay === */
    .header__nav {
        display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100vh;
        background: var(--white); z-index: 9999; flex-direction: column;
        justify-content: center; align-items: center;
        padding: 60px 0;
    }
    .header__nav.active { display: flex; }
    .header__nav-list { flex-direction: column; gap: 28px; text-align: center; }
    .header__nav-link { font-size: 1.3rem; font-weight: 600; }
    .header__hamburger { display: flex; z-index: 10000; }

    /* === HEADER — Compact mobile === */
    .header__container { padding: 0 12px; gap: 10px; height: 52px; }
    .header__logo-text { max-width: 110px; }
    .header__brand { font-size: 0.95rem; }
    .header__tagline { font-size: 0.5rem; letter-spacing: 1px; }
    .header__actions { gap: 0; }
    .header__action-btn { width: 34px; height: 34px; font-size: 0.85rem; }
    .currency-switcher, .lang-switcher, #darkmode-toggle, .desktop-only, .loyalty-badge { display: none !important; }
    .search-overlay { padding: 10px; align-items: flex-start; }
    .search-overlay__panel { border-radius: 22px; }
    .search-overlay__header { padding: 14px; }
    .search-overlay__input-wrapper { min-height: 48px; padding: 0 14px; gap: 10px; }
    .search-overlay__input { font-size: 0.92rem; }
    .search-overlay__close { width: 40px; height: 40px; margin-left: 8px; }
    .search-overlay__content { padding: 14px; }
    .search-overlay__results { max-height: 64vh; }
    .search-section-head { align-items: flex-start; }
    .search-section-head span { font-size: 0.95rem; }
    .search-section-head button { padding: 8px 11px; font-size: 0.76rem; white-space: nowrap; }
    .search-trending-grid { grid-template-columns: 1fr; gap: 8px; }
    .search-trending-card { flex-direction: row; align-items: center; padding: 8px; border-radius: 16px; }
    .search-trending-card__media { width: 58px; height: 58px; aspect-ratio: auto; border-radius: 14px; flex-shrink: 0; }
    .search-trending-card__name { flex: 1; font-size: 0.86rem; }
    .search-trending-card__price { font-size: 0.86rem; }
    .search-result-item { padding: 10px; gap: 10px; }
    .search-result-item__media { width: 50px; height: 50px; border-radius: 14px; }

    /* === HERO === */
    .hero__title { font-size: 2.2rem; }
    .hero { min-height: auto; padding: 70px 0 40px; }
    .hero__container { grid-template-columns: 1fr; text-align: center; gap: 20px; }
    .hero__desc { margin: 0 auto 24px; font-size: 0.88rem; }
    .hero__actions { justify-content: center; flex-wrap: wrap; gap: 10px; }
    .hero__trust { justify-content: center; }
    .hero__showcase { margin-top: 20px; max-width: 360px; }
    .hero__showcase-card { max-width: 280px; margin: 0 auto; }
    .hero__showcase-img { height: 180px; font-size: 4rem; }
    .hero__showcase-benefits span { font-size: 0.66rem; padding: 5px 7px; }
    .hero__scroll-indicator { display: none; }
    .section-head__title { font-size: 1.8rem; }
    .pdp__thumbnails {
        display: flex;
        gap: 8px;
        scroll-snap-type: x proximity;
    }
    .pdp-thumb {
        flex: 0 0 clamp(58px, 18vw, 72px);
        scroll-snap-align: start;
    }

    /* === GRIDS === */
    .trending__grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
    .categories__grid { grid-template-columns: repeat(3, 1fr); gap: 10px; }
    .cat-card { padding: 16px 8px; }
    .cat-card__icon { width: 44px; height: 44px; font-size: 1.3rem; }
    .cat-card__name { font-size: 0.72rem; }
    #customer-favorites .products__grid {
        display: flex;
        gap: 14px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding: 2px 16px 18px;
        margin: 0 -16px;
    }
    #customer-favorites .p-card {
        flex: 0 0 min(78vw, 286px);
        scroll-snap-align: start;
    }
    .products__grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
    .products__toolbar { flex-direction: column; align-items: flex-start; }

    /* === PRODUCT CARDS — Compact mobile === */
    #customer-favorites .p-card__media { height: 216px; }
    .p-card__media { height: 154px; }
    .p-card__emoji { font-size: 2.8rem; }
    .p-card__body { padding: 10px 12px 12px; }
    .p-card__name { font-size: 0.8rem; line-height: 1.24; margin: 5px 0 5px; -webkit-line-clamp: 2; }
    .p-card__cat { font-size: 0.58rem; letter-spacing: 1.5px; margin-bottom: 1px; }
    .p-card__trust { gap: 4px; margin-bottom: 5px; }
    .p-card__trust span { font-size: 0.54rem; padding: 3px 6px; }
    .p-card__swatches { gap: 5px; min-height: 16px; margin-bottom: 6px; }
    .p-card__swatch { width: 14px; height: 14px; }
    .p-card__price { font-size: 0.95rem; }
    .p-card__old-price { font-size: 0.72rem; }
    .p-card__price-row { grid-template-columns: 1fr; align-items: stretch; gap: 8px; padding-top: 8px; }
    .p-card__price-wrapper { min-height: 38px; }
    .p-card__add { width: 100%; min-width: 0; height: 34px; padding: 0 10px; font-size: 0.76rem; }
    .p-card__add--options { min-width: 0; }
    .p-card__stock { font-size: 0.6rem; margin-top: 4px; }
    .p-card__bnpl { font-size: 0.6rem; }
    .p-card__viewers { font-size: 0.62rem; padding: 3px 8px; }
    .p-card__rating { font-size: 0.78rem; }
    .p-card__stars { font-size: 0.78rem; margin-bottom: 6px; }

    /* === CART & WISHLIST SIDEBARS — Full width mobile === */
    .cart { width: 100%; right: -100%; }
    .cart.active { right: 0; }
    .cart__head { padding: 16px 20px; }
    .cart__body { padding: 10px 20px; }
    .cart__foot {
        max-height: 44vh;
        padding: 8px 16px calc(10px + env(safe-area-inset-bottom));
        border-radius: 20px 20px 0 0;
    }
    .cart__shipping { padding: 7px 10px; margin-bottom: 7px; }
    .cart__shipping p { font-size: 0.66rem; }
    .cart__summary-row { font-size: 0.76rem; padding: 2px 0; }
    .cart__summary-total span:last-child { font-size: 1.12rem; }
    .cart__footer-options { grid-template-columns: 1fr; gap: 8px; }
    .cart__giftwrap-inline { justify-self: start; font-size: 0.66rem; padding: 4px 9px; }
    .cart__assurance-row { font-size: 0.66rem; margin-bottom: 6px; }
    .cart__checkout-btn { padding: 11px 16px !important; font-size: 0.9rem !important; }
    .cart__express-row .btn--express { min-height: 33px; padding: 6px 9px; font-size: 0.74rem; }
    .cart__pay-note { font-size: 0.62rem; }
    .wishlist-sidebar { width: 100% !important; right: -100% !important; }
    .wishlist-sidebar.active { right: 0 !important; }
    .notif-sidebar {
        top: 68px !important; right: -100% !important; width: calc(100% - 18px) !important;
        max-height: min(520px, calc(100vh - 86px)); border-radius: 22px 0 0 22px;
    }
    .notif-sidebar.active { right: 0 !important; }
    .notif-sidebar .cart__body { max-height: min(410px, calc(100vh - 170px)); }

    /* === TESTIMONIALS, FOOTER === */
    .testimonials__track { grid-template-columns: 1fr; }
    .footer { padding-top: 46px; }
    .footer__top { grid-template-columns: 1fr; gap: 28px; }
    .footer__brand { text-align: center; }
    .footer__logo, .footer__social, .footer__mini-badges { justify-content: center; }
    .footer__brand p { margin-left: auto; margin-right: auto; }
    .footer__col { text-align: center; }
    .footer__col h4 { justify-content: center; }
    .footer__col a { margin-left: auto; margin-right: auto; }
    .footer__trust-badges { grid-template-columns: 1fr 1fr; gap: 8px; }
    .footer__bottom { flex-direction: column; gap: 12px; text-align: center; padding-bottom: 86px; }
    .promo__card { padding: 24px 18px; grid-template-columns: 1fr; text-align: center; border-radius: 24px; }
    .promo__left { grid-template-columns: 1fr; gap: 12px; justify-items: center; }
    .promo__title { font-size: 1.2rem; }
    .promo__discount { font-size: 1.55rem; }
    .promo__timer { justify-content: center; }
    .promo__right { display: none; }

    /* === SECTIONS — Responsive grids === */
    .budget__grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
    .why-us__grid { grid-template-columns: 1fr; }
    .ugc__grid { grid-template-columns: repeat(3, 1fr); }
    .tips__grid { grid-template-columns: 1fr; }
    .trust-strip__grid,
    .trust-strip__grid--compact { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .trust-strip { padding: 18px 0; }
    .trust-strip__item { min-height: 74px; padding: 12px; }
    .bundles__grid { grid-template-columns: 1fr; }
    .newsletter__card { flex-direction: column; text-align: center; }
    .newsletter__form { min-width: auto; width: 100%; }

    /* === PDP responsive === */
    .pdp { padding: 70px 0 110px; }
    .pdp__grid { grid-template-columns: 1fr; gap: 20px; }
    .pdp__media { position: static; }
    .pdp__image-main { aspect-ratio: 1 / 1; max-height: min(430px, 58vh); }
    .pdp__quick-facts { display: none; }
    .pdp__emoji { font-size: 5rem; }
    .pdp__name { font-size: 1.5rem; }
    .pdp__price { font-size: 1.5rem; }
    .pdp__related-grid { grid-template-columns: repeat(2, 1fr); }
    .pdp__sticky-cta { display: block; }

    /* Breadcrumb: truncate long product names */
    .pdp__breadcrumb { flex-wrap: nowrap; overflow: hidden; max-width: 100%; gap: 4px; }
    .pdp__breadcrumb span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 50vw; }

    /* Tabs: horizontal scroll for 6 tabs */
    .pdp__tabs { overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; flex-wrap: nowrap; }
    .pdp__tabs::-webkit-scrollbar { display: none; }
    .pdp__tab { white-space: nowrap; flex-shrink: 0; padding: 10px 14px; font-size: 0.8rem; }

    /* Social proof row - prevent overflow */
    #pdp-social-proof { font-size: 0.72rem; }

    /* Share section - allow scroll on very small */
    .pdp__share { flex-wrap: wrap; gap: 7px; }

    /* Trust strip - keep 3 columns but more compact */
    #pdp-trust-strip { gap: 6px; padding: 8px; }

    /* Promises - 2 col already, compact */
    .pdp__promises { padding: 10px; }
    .pdp__promise { font-size: 0.75rem; gap: 5px; }

    /* === ALL PRODUCTS PAGE === */
    .all-products-page { padding-top: 10px; padding-bottom: 16px; }
    .all-products-page .pdp__breadcrumb { margin-bottom: 6px; font-size: 0.76rem; }
    .all-products-page__header { flex-direction: column; align-items: flex-start; gap: 4px; margin-bottom: 8px; }
    .all-products-page__title,
    .all-products-page__header .section-head__title { font-size: 1.22rem; }
    .all-products-page__subtitle,
    .all-products-page__header .section-head__desc { font-size: 0.76rem; margin-top: 2px; }
    .all-products-page__filters {
        flex-direction: column; align-items: stretch; gap: 8px; margin-bottom: 12px; padding: 10px 12px;
    }
    .all-products-page__tabs { gap: 6px; }
    .all-products-page__tabs .tab-btn { padding: 6px 12px; font-size: 0.72rem; }
    .all-products-page__age-filters { gap: 6px; }
    .all-products-page__sort { width: 100%; }
    .products-search-bar { width: 100%; }
    .products-search-bar__input { width: 100% !important; }
    .search-active { flex-wrap: wrap; font-size: 0.78rem; padding: 8px 12px; }

    /* === QUICKVIEW & MODAL === */
    .quickview-popup__body { grid-template-columns: 1fr; }
    .quickview-popup__image { min-height: 200px; font-size: 3.5rem; border-radius: var(--radius-2xl) var(--radius-2xl) 0 0; }
    .modal__grid { grid-template-columns: 1fr; }
    .modal { width: 96%; max-height: 85vh; }
    .modal__media { min-height: 250px; }

    /* === STORY === */
    .story__grid { grid-template-columns: 1fr; }
    .story__visual { height: 300px; margin-bottom: 20px; }
}

@media (max-width: 480px) {
    .hero__title { font-size: 1.8rem; }
    .hero__actions .btn { font-size: 0.82rem; padding: 12px 20px; }
    .products__grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
    .categories__grid { grid-template-columns: repeat(2, 1fr); }
    .trust-strip__grid { grid-template-columns: 1fr; }
    .products__tabs { gap: 4px; }
    .tab-btn { padding: 6px 12px; font-size: 0.75rem; }
    .newsletter__form { flex-direction: column; }
    .newsletter__form .btn { width: 100%; justify-content: center; }
    .pdp { padding: 65px 0 100px; }
    .pdp__image-main { max-height: min(360px, 56vh); aspect-ratio: 1 / 1; }
    .pdp__related-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
    .pdp__actions { flex-direction: column; gap: 10px; }
    .pdp__actions .btn--full { width: 100%; }
    .pdp__wishlist-btn { width: 100%; border-radius: var(--radius-md); height: 48px; }
    .pdp__tab { padding: 8px 12px; font-size: 0.73rem; }
    .pdp__reviews-head { grid-template-columns: 1fr; gap: 10px; }
    .pdp__write-review { width: 100%; }
    .pdp__reviews-summary { padding: 12px; }
    .pdp__reviews-score,
    .pdp__reviews-big { width: 52px; height: 52px; font-size: 1.65rem; }
    .pdp__name { font-size: 1.3rem; line-height: 1.3; }
    .pdp__price { font-size: 1.35rem; }
    .pdp__sticky-inner { padding: 10px 16px; gap: 10px; }
    .pdp__sticky-name { max-width: 45vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 0.8rem; }
    .pdp__sticky-price { font-size: 0.9rem; }
    #pdp-trust-strip { flex-direction: row; justify-content: space-around; }
    /* Hide "Home >" on tiny screens, keep Category > Product */
    .pdp__breadcrumb > a:first-child,
    .pdp__breadcrumb > a:first-child + i { display: none; }
    .age-filter { padding: 5px 10px; font-size: 0.68rem; }

    /* Product cards */
    .p-card__media { height: 150px; }
    #customer-favorites .p-card__media { height: 210px; }
    .p-card__emoji { font-size: 3rem; }
    .p-card__body { padding: 8px 10px 10px; }
    .p-card__name { font-size: 0.8rem; }
    .p-card__price { font-size: 0.92rem; }
    .p-card__trust span { font-size: 0.52rem; padding: 3px 5px; }
    .p-card__swatch { width: 13px; height: 13px; }
    .p-card__price-row { grid-template-columns: 1fr; align-items: stretch; gap: 8px; padding-top: 8px; }
    .p-card__price-wrapper { min-height: 38px; }
    .p-card__add { width: 100%; height: 36px; min-width: 0; padding: 0 10px; font-size: 0.76rem; }
    .p-card__add--options { min-width: 0; }
    .p-card__viewers { font-size: 0.55rem; padding: 2px 6px; }
    .p-card__badge { font-size: 0.62rem; padding: 3px 8px; top: 0.6rem; left: 0.6rem; }

    /* Sections */
    .budget__grid { grid-template-columns: 1fr 1fr; gap: 10px; }
    .ugc__grid { grid-template-columns: repeat(2, 1fr); }
    .trust-strip__grid,
    .trust-strip__grid--compact { grid-template-columns: 1fr 1fr; gap: 10px; }
    .trust-strip__item { align-items: flex-start; }
    .trust-strip__item strong { font-size: 0.76rem; }
    .trust-strip__item p { font-size: 0.66rem; }
    .bundles__grid { grid-template-columns: 1fr; }
    .section-head__title { font-size: 1.5rem; }

    /* All Products Page */
    .all-products-page__title,
    .all-products-page__header .section-head__title { font-size: 1.12rem; }
    .all-products-page__tabs .tab-btn { padding: 5px 10px; font-size: 0.68rem; }
    .all-products-page__header > div:last-child { width: 100%; }
}

/* ============================================
   FAQ ACCORDION
   ============================================ */
.faq { padding: 58px 0; background: var(--white); }
.faq__list { max-width: 720px; margin: 0 auto; }
.faq__item {
    border-bottom: 1px solid var(--border); overflow: hidden;
}
.faq__question {
    width: 100%; display: flex; justify-content: space-between; align-items: center;
    padding: 18px 0; background: none; border: none; cursor: pointer;
    font-family: var(--font-display); font-size: 1rem; font-weight: 600;
    color: var(--text); text-align: left; gap: 12px;
    transition: color 0.2s ease;
}
.faq__question:hover { color: var(--cta); }
.faq__question i {
    font-size: 0.75rem; color: var(--text-light);
    transition: transform 0.3s ease;
}
.faq__item.active .faq__question i { transform: rotate(180deg); }
.faq__answer {
    max-height: 0; overflow: hidden;
    transition: max-height 0.4s ease, padding 0.3s ease;
}
.faq__item.active .faq__answer {
    max-height: 200px; padding-bottom: 18px;
}
.faq__answer p {
    font-size: 0.88rem; color: var(--text-mid); line-height: 1.7;
}

/* ============================================
   LIVE SALES NOTIFICATION
   ============================================ */
.live-sale {
    position: fixed; bottom: 24px; left: 24px; z-index: 900;
    background: var(--white); border-radius: var(--radius-xl);
    padding: 14px 18px; display: flex; align-items: center; gap: 12px;
    box-shadow: 0 8px 30px rgba(0,0,0,0.12);
    border: 1px solid var(--border);
    animation: slideInLeft 0.5s var(--ease-bounce);
    max-width: 340px;
}
.live-sale.hidden { display: none; }
@keyframes slideInLeft {
    from { transform: translateX(-120%); opacity: 0; }
    to { transform: translateX(0); opacity: 1; }
}
.live-sale__avatar {
    width: 42px; height: 42px; border-radius: var(--radius-full);
    background: var(--sage-light); display: flex; align-items: center;
    justify-content: center; font-size: 1.2rem; flex-shrink: 0;
    font-weight: 700; color: var(--sage-dark);
}
.live-sale__info { flex: 1; }
.live-sale__text { font-size: 0.78rem; color: var(--text); font-weight: 500; margin: 0 0 2px; line-height: 1.4; }
.live-sale__text strong { color: var(--cta); }
.live-sale__time { font-size: 0.65rem; color: var(--text-light); }
.live-sale__verified { font-size: 0.65rem; color: #2E7D32; font-weight: 600; white-space: nowrap; }

/* ============================================
   UPSELL POPUP
   ============================================ */
.upsell-overlay {
    position: fixed; inset: 0; background: rgba(0,0,0,0.4);
    z-index: 1099;
}
.upsell-overlay.hidden { display: none; }
.upsell-popup {
    position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);
    background: var(--white); border-radius: var(--radius-2xl);
    width: 90%; max-width: 520px; padding: 28px; z-index: 1100;
    box-shadow: 0 20px 60px rgba(0,0,0,0.2);
    animation: popIn 0.4s var(--ease-bounce);
}
.upsell-popup.hidden { display: none; }
.upsell-popup__close {
    position: absolute; top: 12px; right: 12px;
    background: rgba(0,0,0,0.06); border: none; border-radius: var(--radius-full);
    width: 32px; height: 32px; cursor: pointer; display: flex;
    align-items: center; justify-content: center; font-size: 0.85rem;
    color: var(--text-mid);
}
.upsell-popup__title {
    font-family: var(--font-display); font-size: 1.2rem; font-weight: 700;
    color: var(--text); margin-bottom: 4px;
}
.upsell-popup__subtitle { font-size: 0.82rem; color: var(--text-mid); margin-bottom: 16px; }
.upsell-popup__items { display: flex; gap: 12px; margin-bottom: 16px; overflow-x: auto; }
.upsell-item {
    flex: 0 0 140px; background: var(--bg-cream); border-radius: var(--radius-lg);
    padding: 12px; text-align: center; cursor: pointer;
    border: 2px solid transparent; transition: all 0.2s ease;
}
.upsell-item:hover { border-color: var(--sage); }
.upsell-item__emoji { font-size: 2rem; margin-bottom: 6px; }
.upsell-item__name { font-size: 0.72rem; font-weight: 600; color: var(--text); margin-bottom: 4px; }
.upsell-item__price { font-size: 0.85rem; font-weight: 800; color: var(--cta); margin-bottom: 6px; }
.upsell-item__add {
    font-size: 0.65rem; padding: 4px 10px; border-radius: var(--radius-full);
    border: none; background: var(--cta); color: var(--white); cursor: pointer;
    font-weight: 600;
}
.upsell-popup__skip { font-size: 0.78rem; width: 100%; text-align: center; }

/* ============================================
   MOBILE BOTTOM NAV
   ============================================ */
.mobile-nav {
    display: none; position: fixed; bottom: 0; left: 0; right: 0;
    background: var(--white); z-index: 999;
    border-top: 1px solid var(--border);
    padding: 4px 0 env(safe-area-inset-bottom, 4px);
    box-shadow: 0 -2px 12px rgba(0,0,0,0.06);
}
@media (max-width: 768px) {
    .mobile-nav { display: none; }
    body { padding-bottom: 0; }
}
.mobile-nav__item {
    display: flex; flex-direction: column; align-items: center; gap: 1px;
    background: none; border: none; cursor: pointer;
    color: var(--text-light); font-size: 0.55rem; font-weight: 600;
    padding: 4px 10px; position: relative; transition: color 0.2s ease;
    font-family: var(--font-body);
}
.mobile-nav__item i { font-size: 0.95rem; }
.mobile-nav__item.active { color: var(--cta); }
.mobile-nav__badge {
    position: absolute; top: -2px; right: 2px;
    background: var(--cta); color: var(--white);
    font-size: 0.45rem; font-weight: 800;
    width: 14px; height: 14px; border-radius: var(--radius-full);
    display: flex; align-items: center; justify-content: center;
}
.mobile-nav__badge.hidden { display: none; }

/* ============================================
   SORT DROPDOWN (Products Page)
   ============================================ */
.all-products-page__sort {
    padding: 8px 14px; border-radius: var(--radius-full);
    border: 1.5px solid var(--border); background: var(--white);
    font-size: 0.8rem; font-weight: 600; color: var(--text-mid);
    cursor: pointer; font-family: var(--font-body);
    appearance: none; -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23999'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 12px center;
    padding-right: 30px;
}

/* ============================================
   PEOPLE VIEWING BADGE (product cards)
   ============================================ */
.p-card__viewers {
    position: absolute; bottom: 8px; left: 8px;
    background: rgba(0,0,0,0.65); color: var(--white);
    font-size: 0.62rem; font-weight: 600; padding: 3px 8px;
    border-radius: var(--radius-full); display: flex;
    align-items: center; gap: 4px;
    z-index: 2;
}
.p-card__viewers i { font-size: 0.55rem; color: #4CAF50; }

/* ============================================
   SKELETON LOADING
   ============================================ */
.skeleton {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer 1.5s infinite;
    border-radius: var(--radius-lg);
}
@keyframes shimmer { from { background-position: 200% 0; } to { background-position: -200% 0; } }
.skeleton-card { height: 220px; border-radius: var(--radius-xl); }

/* ============================================
   FREQUENTLY BOUGHT TOGETHER (PDP)
   ============================================ */
.pdp__fbt { margin-top: 40px; padding-top: 30px; border-top: 1px solid var(--border); }
.pdp__fbt-title {
    font-family: var(--font-display); font-size: 1.2rem; font-weight: 700;
    color: var(--text); margin-bottom: 20px; display: flex; align-items: center; gap: 8px;
}
.pdp__fbt-title i { color: var(--sage); }
.pdp__fbt-grid { display: flex; gap: 12px; align-items: center; margin-bottom: 16px; flex-wrap: wrap; }
.pdp__fbt-item {
    flex: 0 0 120px; text-align: center; background: var(--bg-cream);
    border-radius: var(--radius-lg); padding: 14px 10px;
    border: 2px solid transparent; transition: border-color 0.2s ease; cursor: pointer;
}
.pdp__fbt-item:hover { border-color: var(--sage); }
.pdp__fbt-item__emoji { font-size: 2rem; margin-bottom: 6px; }
.pdp__fbt-item__name { font-size: 0.68rem; font-weight: 600; color: var(--text); margin-bottom: 4px; line-height: 1.3; }
.pdp__fbt-item__price { font-size: 0.82rem; font-weight: 800; color: var(--cta); }
.pdp__fbt-plus { font-size: 1.2rem; color: var(--text-light); font-weight: 700; }
.pdp__fbt-total {
    display: flex; align-items: center; justify-content: space-between;
    background: var(--bg-cream); padding: 14px 20px; border-radius: var(--radius-lg);
}
.pdp__fbt-total span { font-size: 0.9rem; color: var(--text-mid); }
.pdp__fbt-total strong { font-size: 1.1rem; color: var(--cta); }

/* ============================================
   SIZE GUIDE BUTTON & POPUP
   ============================================ */
.pdp__size-guide-btn {
    background: none; border: 1px dashed var(--border); border-radius: var(--radius-lg);
    padding: 10px 16px; cursor: pointer; font-size: 0.82rem; font-weight: 600;
    color: var(--text-mid); display: flex; align-items: center; gap: 6px;
    transition: all 0.2s ease; width: 100%; justify-content: center;
    font-family: var(--font-body); margin-top: 10px;
}
.pdp__size-guide-btn:hover { border-color: var(--sage); color: var(--sage-dark); background: var(--sage-light); }
.sizeguide-overlay {
    position: fixed; inset: 0; background: rgba(0,0,0,0.4);
    z-index: 1099;
}
.sizeguide-overlay.hidden { display: none; }
.sizeguide-popup {
    position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);
    background: var(--white); border-radius: var(--radius-2xl);
    width: 90%; max-width: 500px; padding: 28px; z-index: 1100;
    box-shadow: 0 16px 48px rgba(0,0,0,0.15);
}
.sizeguide-popup.hidden { display: none; }
.sizeguide-popup__close {
    position: absolute; top: 12px; right: 12px;
    background: rgba(0,0,0,0.06); border: none; border-radius: var(--radius-full);
    width: 32px; height: 32px; cursor: pointer; display: flex;
    align-items: center; justify-content: center; font-size: 0.85rem; color: var(--text-mid);
}
.sizeguide-popup__title {
    font-family: var(--font-display); font-size: 1.2rem; font-weight: 700;
    color: var(--text); margin-bottom: 4px; display: flex; align-items: center; gap: 8px;
}
.sizeguide-popup__title i { color: var(--sage); }
.sizeguide-popup__subtitle { font-size: 0.82rem; color: var(--text-mid); margin-bottom: 16px; }
.sizeguide-popup__table { width: 100%; border-collapse: collapse; margin-bottom: 14px; }
.sizeguide-popup__table th {
    background: var(--sage); color: var(--white); padding: 10px 12px;
    font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.5px; font-weight: 700;
}
.sizeguide-popup__table td {
    padding: 10px 12px; font-size: 0.82rem; border-bottom: 1px solid var(--border);
    color: var(--text);
}
.sizeguide-popup__table tr:hover td { background: var(--bg-cream); }
.sizeguide-popup__tip {
    font-size: 0.78rem; color: var(--sage-dark); background: var(--sage-light);
    padding: 10px 14px; border-radius: var(--radius-md); display: flex; align-items: center; gap: 8px;
}
.sizeguide-popup__tip i { color: var(--clay); }

/* ============================================
   PHOTO REVIEWS GALLERY
   ============================================ */
.photo-reviews { padding: 50px 0; background: var(--bg-cream); }
.photo-reviews__grid {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px;
}
.photo-review-card {
    background: var(--white); border-radius: var(--radius-xl); overflow: hidden;
    border: 1px solid var(--border); transition: all 0.3s ease;
}
.photo-review-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.photo-review-card__img {
    height: 160px; display: flex; align-items: center; justify-content: center;
    font-size: 3.5rem; position: relative; overflow: hidden;
}
.photo-review-card__body { padding: 14px 16px; }
.photo-review-card__stars { color: #F59E0B; font-size: 0.75rem; margin-bottom: 6px; }
.photo-review-card__text {
    font-size: 0.78rem; color: var(--text-mid); line-height: 1.5;
    margin-bottom: 8px; display: -webkit-box; -webkit-line-clamp: 3;
    -webkit-box-orient: vertical; overflow: hidden; line-clamp: 3;
}
.photo-review-card__author {
    display: flex; align-items: center; gap: 8px;
}
.photo-review-card__avatar {
    width: 28px; height: 28px; border-radius: var(--radius-full);
    background: var(--sage-light); display: flex; align-items: center;
    justify-content: center; font-size: 0.6rem; font-weight: 700; color: var(--sage-dark);
}
.photo-review-card__name { font-size: 0.7rem; font-weight: 600; color: var(--text); }
.photo-review-card__loc { font-size: 0.6rem; color: var(--text-light); }

/* ============================================
   PARALLAX SECTIONS
   ============================================ */
.parallax-bg {
    background-attachment: fixed; background-size: cover; background-position: center;
}

/* ============================================
   STICKY HEADER
   ============================================ */
.header.sticky {
    position: fixed; top: 0; left: 0; right: 0; z-index: 1000;
    padding: 8px 0; box-shadow: 0 2px 16px rgba(0,0,0,0.08);
    background: rgba(255,255,255,0.97);
    transition: padding 0.3s ease, box-shadow 0.3s ease;
}
.header.sticky .header__logo { font-size: 1.3rem; }

/* ============================================
   CURRENCY SWITCHER
   ============================================ */
.currency-switcher { position: relative; }
.currency-switcher__btn {
    display: flex; align-items: center; gap: 4px;
    background: none; border: 1px solid var(--border); border-radius: var(--radius-full);
    padding: 5px 10px; cursor: pointer; font-size: 0.72rem; font-weight: 600;
    color: var(--text-mid); font-family: var(--font-body);
    transition: all 0.2s ease;
}
.currency-switcher__btn:hover { border-color: var(--sage); }
.currency-switcher__dropdown {
    position: absolute; top: 100%; right: 0; margin-top: 6px;
    background: var(--white); border-radius: var(--radius-md);
    box-shadow: 0 8px 24px rgba(0,0,0,0.12); border: 1px solid var(--border);
    overflow: hidden; z-index: 1200; min-width: 120px;
}
.currency-switcher__dropdown.hidden { display: none; }
.currency-switcher__dropdown button {
    display: block; width: 100%; text-align: left; padding: 10px 14px;
    border: none; background: none; cursor: pointer; font-size: 0.78rem;
    font-family: var(--font-body); color: var(--text); transition: background 0.15s ease;
}
.currency-switcher__dropdown button:hover { background: var(--bg-cream); }

/* ============================================
   EXIT-INTENT POPUP
   ============================================ */
.exit-popup-overlay {
    position: fixed; inset: 0; background: rgba(0,0,0,0.5);
    z-index: 1199;
}
.exit-popup-overlay.hidden { display: none; }
.exit-popup {
    position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);
    background: var(--white); border-radius: var(--radius-2xl);
    width: 90%; max-width: 400px; padding: 32px; z-index: 1200;
    text-align: center; box-shadow: 0 20px 60px rgba(0,0,0,0.2);
    animation: popIn 0.4s var(--ease-bounce);
}
.exit-popup.hidden { display: none; }
@keyframes popIn { from { transform: translate(-50%, -50%) scale(0.8); opacity: 0; } to { transform: translate(-50%, -50%) scale(1); opacity: 1; } }
.exit-popup__close {
    position: absolute; top: 12px; right: 12px;
    background: rgba(0,0,0,0.06); border: none; border-radius: var(--radius-full);
    width: 32px; height: 32px; cursor: pointer; display: flex;
    align-items: center; justify-content: center; color: var(--text-mid);
}
.exit-popup__emoji { font-size: 3rem; margin-bottom: 12px; }
.exit-popup__title { font-family: var(--font-display); font-size: 1.3rem; font-weight: 700; margin-bottom: 8px; }
.exit-popup__text { font-size: 0.88rem; color: var(--text-mid); margin-bottom: 16px; }
.exit-popup__code {
    display: flex; align-items: center; justify-content: center; gap: 10px;
    background: var(--bg-cream); padding: 12px 20px; border-radius: var(--radius-lg);
    margin-bottom: 16px; border: 2px dashed var(--clay);
}
.exit-popup__code span { font-size: 1.3rem; font-weight: 800; color: var(--cta); letter-spacing: 3px; }
.exit-popup__code button {
    border: none; background: var(--sage); color: var(--white); padding: 5px 12px;
    border-radius: var(--radius-full); font-size: 0.72rem; font-weight: 600; cursor: pointer;
    display: flex; align-items: center; gap: 4px;
}

/* ============================================
   EMAIL CAPTURE POPUP
   ============================================ */
.email-popup-overlay {
    position: fixed; inset: 0; background: rgba(0,0,0,0.5);
    z-index: 1199;
}
.email-popup-overlay.hidden { display: none; }
.email-popup {
    position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);
    background: var(--white); border-radius: var(--radius-2xl);
    width: 90%; max-width: 420px; padding: 32px; z-index: 1200;
    text-align: center; box-shadow: 0 20px 60px rgba(0,0,0,0.2);
    animation: popIn 0.4s var(--ease-bounce);
}
.email-popup.hidden { display: none; }
.email-popup__close {
    position: absolute; top: 12px; right: 12px;
    background: rgba(0,0,0,0.06); border: none; border-radius: var(--radius-full);
    width: 32px; height: 32px; cursor: pointer; display: flex;
    align-items: center; justify-content: center; color: var(--text-mid);
}
.email-popup__visual { font-size: 2.5rem; margin-bottom: 10px; }
.email-popup__title { font-family: var(--font-display); font-size: 1.3rem; font-weight: 700; margin-bottom: 6px; }
.email-popup__text { font-size: 0.85rem; color: var(--text-mid); margin-bottom: 16px; line-height: 1.5; }
.email-popup__form { display: flex; flex-direction: column; gap: 10px; margin-bottom: 10px; }
.email-popup__form input {
    padding: 12px 16px; border-radius: var(--radius-lg); border: 1.5px solid var(--border);
    font-size: 0.88rem; font-family: var(--font-body); text-align: center;
}
.email-popup__form input:focus { border-color: var(--sage); outline: none; }
.email-popup__privacy { font-size: 0.68rem; color: var(--text-light); }

/* ============================================
   COOKIE CONSENT BANNER
   ============================================ */
.cookie-banner {
    position: fixed; bottom: 0; left: 0; right: 0; z-index: 998;
    background: var(--bg-dark); color: var(--white);
    padding: 14px 20px; animation: slideUp 0.5s var(--ease-bounce);
}
.cookie-banner.hidden { display: none; }
.cookie-banner__inner {
    max-width: 1200px; margin: 0 auto;
    display: flex; align-items: center; justify-content: space-between; gap: 16px;
    flex-wrap: wrap;
}
.cookie-banner__inner p { font-size: 0.78rem; color: rgba(255,255,255,0.8); margin: 0; flex: 1; }
.cookie-banner__inner a { color: var(--clay); text-decoration: underline; }
.cookie-banner__actions { display: flex; gap: 8px; }

/* ============================================
   STOCK URGENCY PULSE
   ============================================ */
.p-card__stock { animation: urgencyPulse 2s ease-in-out infinite; }
@keyframes urgencyPulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.6; transform: scale(1.02); }
}

/* ============================================
   INSTAGRAM FEED
   ============================================ */
.insta-feed { padding: 50px 0; }
.insta-feed__grid {
    display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; margin-bottom: 20px;
}
.insta-card {
    aspect-ratio: 1; border-radius: var(--radius-lg); overflow: hidden;
    cursor: pointer; position: relative; display: flex;
    align-items: center; justify-content: center; font-size: 2.5rem;
    transition: transform 0.3s ease;
}
.insta-card:hover { transform: scale(1.05); }
.insta-card::after {
    content: '\f16d'; font-family: 'Font Awesome 6 Brands'; font-weight: 400;
    position: absolute; inset: 0; display: flex; align-items: center;
    justify-content: center; background: rgba(0,0,0,0.4); color: white;
    font-size: 1.5rem; opacity: 0; transition: opacity 0.3s ease;
}
.insta-card:hover::after { opacity: 1; }
.insta-feed__follow {
    display: flex; align-items: center; gap: 8px; margin: 0 auto;
}

/* ============================================
   COUNTDOWN DEAL BANNER
   ============================================ */
.countdown-deal { padding: 28px 0; background: var(--bg-cream); }
.countdown-deal__inner {
    background: linear-gradient(135deg, rgba(24, 24, 27, 0.95) 0%, rgba(39, 39, 42, 0.98) 100%);
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.15), inset 0 1px 1px rgba(255, 255, 255, 0.1);
    border-radius: 28px; padding: 26px 34px;
    display: flex; align-items: center; justify-content: space-between;
    gap: 24px; flex-wrap: wrap; position: relative; overflow: hidden;
}
.countdown-deal__inner::before {
    content: ''; position: absolute; top: -50%; left: -50%; width: 200%; height: 200%;
    background: radial-gradient(circle, rgba(255,215,0,0.05) 0%, transparent 60%);
    pointer-events: none;
}
.countdown-deal__label {
    display: inline-block; background: rgba(255, 215, 0, 0.15); color: #FFD700;
    padding: 6px 14px; border-radius: var(--radius-full); border: 1px solid rgba(255,215,0,0.3);
    font-size: 0.75rem; font-weight: 800; text-transform: uppercase; letter-spacing: 1.5px;
}
.countdown-deal__text { position: relative; z-index: 1; }
.countdown-deal__text h3 { color: var(--white); font-family: var(--font-display); font-size: 1.45rem; margin-top: 10px; font-weight: 800; letter-spacing: -0.5px; }
.countdown-deal__text p { color: rgba(255,255,255,0.62); margin-top: 6px; font-size: 0.86rem; }
.countdown-deal__timer { display: flex; align-items: center; gap: 10px; position: relative; z-index: 1; }
.countdown-deal__block {
    text-align: center; background: rgba(0, 0, 0, 0.3); padding: 10px 16px;
    border-radius: var(--radius-lg); border: 1px solid rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(8px); min-width: 64px;
}
.countdown-deal__block span { display: block; color: var(--white); font-size: 1.45rem; font-weight: 800; font-family: var(--font-display); line-height: 1; margin-bottom: 4px; }
.countdown-deal__block small { font-size: 0.6rem; color: rgba(255,255,255,0.5); text-transform: uppercase; letter-spacing: 1px; }
.countdown-deal__sep { color: rgba(255,255,255,0.4); font-size: 1.3rem; font-weight: 800; }

/* ============================================
   GIFT WRAP TOGGLE
   ============================================ */
.cart__gift-wrap { padding: 10px 0; border-bottom: 1px solid var(--border); }
.gift-wrap-toggle {
    display: flex; align-items: center; gap: 8px; cursor: pointer;
    font-size: 0.82rem; color: var(--text-mid);
}
.gift-wrap-toggle input { accent-color: var(--sage); width: 16px; height: 16px; }
.gift-wrap-toggle__label { flex: 1; font-weight: 500; }
.gift-wrap-toggle__price { font-weight: 700; color: var(--cta); font-size: 0.78rem; }

/* (Compare feature removed — not relevant for baby products) */

/* ============================================
   WISHLIST SHARE BTN
   ============================================ */
.wishlist-share-btn {
    background: none; border: 1px solid var(--border); border-radius: var(--radius-full);
    width: 32px; height: 32px; cursor: pointer; display: flex;
    align-items: center; justify-content: center; color: var(--text-mid);
    transition: all 0.2s ease; font-size: 0.8rem;
}
.wishlist-share-btn:hover { background: var(--sage-light); color: var(--sage-dark); border-color: var(--sage); }

/* ============================================
   ACCESSIBILITY
   ============================================ */
*:focus-visible {
    outline: 2px solid var(--sage); outline-offset: 2px; border-radius: 4px;
}
.sr-only {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

/* ============================================
   DARK MODE (Unified & Comprehensive)
   ============================================ */
body.dark-mode {
    --bg: #0f0f1a; --bg-alt: #16162a; --bg-cream: #16162a; --bg-dark: #0a0a14;
    --white: #1a1a2e; --text: #e8e8f0; --text-mid: #b0b0cc;
    --text-light: #8080a0; --border: #2a2a4a; --border-light: #2a2a4a;
    --clay-light: #2a2a4a; --sage-light: #1a2e22; --blush-light: #2e1a22;
}
/* Header & Nav */
body.dark-mode .header { background: rgba(15,15,26,0.97); border-bottom-color: #2a2a4a; }
body.dark-mode .header.sticky { background: rgba(15,15,26,0.98); }
body.dark-mode .header__brand { color: #e8e8f0; }
body.dark-mode .header__tagline { color: #8080a0; }
body.dark-mode .header__nav-link { color: #b0b0cc; }
body.dark-mode .header__nav-link:hover,
body.dark-mode .header__nav-link.active { color: #ffffff; }
body.dark-mode .header__action-btn { color: #d0d0e0; }
body.dark-mode .header__action-btn:hover { background: rgba(255,255,255,0.08); }
body.dark-mode .header__hamburger span { background: #e8e8f0; }
/* Announcement */
body.dark-mode .announcement { background: linear-gradient(90deg, #1a1a30, #16162a); color: #ffffff !important; }
body.dark-mode .announcement p, body.dark-mode .announcement strong { color: #ffffff !important; }
body.dark-mode .announcement strong { color: #FFD700 !important; }
/* Hero */
body.dark-mode .hero { background: linear-gradient(135deg, #0f0f1a 0%, #1a1a2e 50%, #16162a 100%); }
body.dark-mode .hero__bg { opacity: 0.3; }
body.dark-mode .hero__title { color: #e8e8f0; }
body.dark-mode .hero__title-accent { color: var(--cta); }
body.dark-mode .hero__desc { color: #b0b0cc; }
body.dark-mode .hero__trust-item { color: #b0b0cc; }
body.dark-mode .hero__showcase-card { background: #1e1e32; border-color: #2a2a4a; }
body.dark-mode .hero__label { background: rgba(255,255,255,0.06); color: #b0b0cc; }
/* Section Heads */
body.dark-mode .section-head__title { color: #e8e8f0; }
body.dark-mode .section-head__desc { color: #b0b0cc; }
body.dark-mode .section-head__label { color: var(--cta); }
/* Product Cards */
body.dark-mode .p-card { background: #1e1e32; border-color: #2a2a4a; }
body.dark-mode .p-card:hover { box-shadow: 0 8px 32px rgba(0,0,0,0.4); }
body.dark-mode .p-card__name { color: #e8e8f0; }
body.dark-mode .p-card__cat { color: #8080a0; }
/* PDP */
body.dark-mode .pdp__name { color: #e8e8f0; }
body.dark-mode .pdp__cat { color: #8080a0; }
body.dark-mode .pdp__installment { background: #2a2a40; color: #FFB74D; }
body.dark-mode .pdp__badges .pdp__badge { opacity: 0.9; }
body.dark-mode .pdp__delivery-date { background: #1a2e1a; color: #81C784; }
body.dark-mode .pdp__promises { background: #1e1e32 !important; border-color: #2a2a4a !important; }
body.dark-mode .pdp__promise { color: #b0b0cc; }
body.dark-mode .pdp__inbox { background: #1e1e32; }
body.dark-mode .pdp__tab { color: #b0b0cc; border-color: #2a2a4a; }
body.dark-mode .pdp__tab.active { color: #e8e8f0; border-color: var(--cta); }
body.dark-mode .pdp__image-main { background: #16162a; }
body.dark-mode .pdp__main-video:not(.pdp__main-video--lightbox) { background: #16162a; }
body.dark-mode .pdp__quick-facts { background: #1e1e32; border-color: #2a2a4a; }
body.dark-mode .pdp__quick-fact { background: #1a1a2e; }
/* Tabs & Descriptions */
body.dark-mode .pdp__tab-content { color: #b0b0cc; }
body.dark-mode .pdp__fbt { border-top-color: #2a2a4a; }
body.dark-mode .pdp__fbt-item { background: #1e1e32; }
body.dark-mode .pdp__fbt-total { background: #1e1e32; }
body.dark-mode .pdp__related-title { color: #e8e8f0; }
/* Cart & Wishlist */
body.dark-mode .cart, body.dark-mode .wishlist-sidebar { background: #1a1a2e; }
body.dark-mode .cart__head { border-bottom-color: #2a2a4a; }
body.dark-mode .cart__head h3 { color: #e8e8f0; }
body.dark-mode .cart-item { border-bottom-color: #2a2a4a; }
body.dark-mode .cart-item--bundle {
    background: linear-gradient(180deg, #1a1a2e 0%, #151525 100%);
    border-color: #3a3040;
}
body.dark-mode .cart-bundle__foot { border-top-color: #2a2a4a; }
body.dark-mode .cart-bundle__name { color: #e8e8f0; }
body.dark-mode .cart-bundle__includes li { color: #b0b0cc; }
body.dark-mode .cart-item__name { color: #e8e8f0; }
body.dark-mode .cart__summary { border-top-color: #2a2a4a; }
body.dark-mode .cart__summary-row { color: #b0b0cc; }
body.dark-mode .cart__summary-total { color: #e8e8f0; }
body.dark-mode .cart__trust-line { color: #8080a0; }
body.dark-mode .cart__bundle-alert { background: #1a2e1a !important; color: #81C784 !important; }
/* Footer */
body.dark-mode .footer { background: #0a0a14; color: #b0b0cc; }
body.dark-mode .footer h4 { color: #e8e8f0; }
body.dark-mode .footer a { color: #8080a0; }
body.dark-mode .footer a:hover { color: #e8e8f0; }
body.dark-mode .footer__bottom { border-top-color: #2a2a4a; }
/* Modals & Popups */
body.dark-mode .exit-popup, body.dark-mode .email-popup,
body.dark-mode .sizeguide-popup, body.dark-mode .social-login,
body.dark-mode .account-modal { background: #1a1a2e; }
body.dark-mode .quickview-popup { background: #1a1a2e; }
body.dark-mode .upsell-popup { background: #1a1a2e; }
body.dark-mode .upsell-item { background: #1e1e32; }
/* Notification center */
body.dark-mode .notif-center { background: #1a1a2e; border-color: #2a2a4a; }
body.dark-mode .notif-center__head { border-bottom-color: #2a2a4a; }
body.dark-mode .notif-item { border-bottom-color: #2a2a4a; }
body.dark-mode .notif-sidebar__head,
body.dark-mode .notif-sidebar__body { background: #1a1a2e; border-color: #2a2a4a; }
body.dark-mode .notif-sidebar__body .notif-item,
body.dark-mode .notif-sidebar__body .notif-item.unread { background: #1e1e32; border-color: #2a2a4a; }
body.dark-mode .notif-sidebar__body .notif-item__text strong { color: #e8e8f0; }
body.dark-mode .notif-sidebar__body .notif-item__dismiss { background: #151522; border-color: #2a2a4a; }
/* Search */
body.dark-mode .search-overlay { background: rgba(10,10,20,0.7); }
body.dark-mode .search-overlay__panel { background: #151522; border-color: #2a2a4a; }
body.dark-mode .search-overlay__header { border-bottom-color: #2a2a4a; }
body.dark-mode .search-overlay__input-wrapper { background: #1e1e32; border-color: #2a2a4a; }
body.dark-mode .search-overlay__input { color: #e8e8f0; }
body.dark-mode .search-overlay__popular button { background: #1e1e32; color: #b0b0cc; border-color: #2a2a4a; }
body.dark-mode .search-empty, body.dark-mode .search-result-item, body.dark-mode .search-trending-card { background: #1e1e32; border-color: #2a2a4a; }
body.dark-mode .search-result-item { color: #e8e8f0; }
body.dark-mode .search-result-item:hover { background: #1e1e32; }
body.dark-mode .search-section-head, body.dark-mode .search-trending-card { color: #e8e8f0; }
/* Inputs & Forms */
body.dark-mode input, body.dark-mode textarea, body.dark-mode select { background: #1e1e32; color: #e8e8f0; border-color: #2a2a4a; }
body.dark-mode input::placeholder, body.dark-mode textarea::placeholder { color: #6b6b82; }
/* Cookie */
body.dark-mode .cookie-banner { background: rgba(15,15,26,0.97); }
/* Story highlights */
body.dark-mode .story-item__inner { background: #1e1e32; border-color: #2a2a4a; }
/* Photo reviews */
body.dark-mode .photo-review-card { background: #1e1e32; border-color: #2a2a4a; }
/* Countdown deal */
body.dark-mode .countdown-deal { background: #0f0f1a; }
/* Order history & Chat */
body.dark-mode .order-history { background: #1a1a2e; }
body.dark-mode .order-history__item { border-color: #2a2a40; }
body.dark-mode .giftcard-modal { background: #1a1a2e; }
body.dark-mode .live-chat { background: #1a1a2e; }
body.dark-mode .live-chat__body { background: #16162a; }
body.dark-mode .chat-msg--bot span { background: #2a2a40; color: #e4e4ef; }
body.dark-mode .social-proof-toast { background: #1a1a2e; border-color: #2a2a40; }
body.dark-mode .ai-reco__card { background: #1e1e32; border-color: #2a2a40; }
body.dark-mode .satisfaction-banner { background: linear-gradient(135deg, #1a2e1a, #16162a) !important; }
/* Sections */
body.dark-mode .trending { background: #12121f; }
body.dark-mode .products { background: #0f0f1a; }
body.dark-mode .photo-reviews { background: #16162a; }
body.dark-mode .parent-tips { background: #0f0f1a; }
body.dark-mode .tips__card { background: #1e1e32; }
body.dark-mode .tips__body { color: #b0b0cc; }
body.dark-mode .ugc-section { background: #16162a; }
body.dark-mode .all-products-page { background: #0f0f1a; }
body.dark-mode .all-products-page__title { color: #e8e8f0; }
body.dark-mode .age-filter { background: #1e1e32; color: #b0b0cc; border-color: #2a2a4a; }
body.dark-mode .age-filter.active { background: var(--cta); color: #fff; }
/* Trust badges */
body.dark-mode .trust-badge { color: #b0b0cc; }
body.dark-mode .trust-badge i { background: #1e1e32; color: var(--sage); }
body.dark-mode .us-trust-bar { background: #1a1a2e; border-color: #2a2a4a; }
/* DarkMode Icon toggle */
body.dark-mode #darkmode-toggle .fa-moon::before { content: '\f185'; }
/* Pagination */
body.dark-mode .pagination__btn { background: var(--bg-alt); color: var(--text); border-color: var(--border); }
body.dark-mode .pagination__btn.active { background: var(--cta); color: var(--white); border-color: var(--cta); }
body.dark-mode .pagination__btn:disabled { background: var(--bg); opacity: 0.5; color: var(--text-light); }
body.dark-mode .pagination__dots { color: var(--text-light); }


/* ============================================
   NOTIFICATION CENTER
   ============================================ */
.notif-center {
    position: absolute; top: 100%; right: 0; margin-top: 8px; z-index: 1100;
    background: var(--white); border-radius: var(--radius-xl);
    width: 340px; max-height: 420px;
    overflow-y: auto; overflow-x: hidden;
    box-shadow: 0 12px 40px rgba(0,0,0,0.15); border: 1px solid var(--border);
    contain: layout;
    transform-origin: top right;
    animation: notifSlideIn 0.25s ease-out;
}
.notif-center::-webkit-scrollbar { width: 4px; }
.notif-center::-webkit-scrollbar-thumb { background: var(--border); border-radius: 4px; }
@keyframes notifSlideIn {
    from { opacity: 0; transform: scale(0.95) translateY(-8px); }
    to { opacity: 1; transform: scale(1) translateY(0); }
}
.notif-center.hidden { display: none; }
.notif-center__head {
    display: flex; align-items: center; justify-content: space-between;
    padding: 14px 16px; border-bottom: 1px solid var(--border);
    position: sticky; top: 0; background: var(--white); z-index: 2;
}
.notif-center__head h4 { font-size: 0.88rem; font-weight: 700; display: flex; align-items: center; gap: 6px; margin: 0; }
.notif-center__head button {
    background: none; border: 1px solid var(--border); color: var(--text-light);
    font-size: 0.68rem; cursor: pointer; font-family: var(--font-body);
    padding: 4px 10px; border-radius: var(--radius-full); font-weight: 600;
    transition: all 0.15s ease;
}
.notif-center__head button:hover { background: #fee2e2; color: #dc2626; border-color: #fca5a5; }
.notif-center__list { padding: 4px 0; }
.notif-item {
    display: flex; align-items: center; gap: 10px; padding: 10px 12px; margin: 2px 8px;
    border-radius: var(--radius-lg);
    transition: background 0.15s ease, opacity 0.3s ease, transform 0.3s ease, max-height 0.3s ease;
    cursor: pointer; position: relative;
    border-bottom: none;
}
.notif-item:hover { background: var(--bg-cream); }
.notif-item--removing {
    opacity: 0; transform: translateX(40px); max-height: 0 !important;
    padding-top: 0 !important; padding-bottom: 0 !important; margin-top: 0 !important; margin-bottom: 0 !important;
    overflow: hidden;
}
.notif-item__icon {
    width: 36px; height: 36px; min-width: 36px; border-radius: var(--radius-full);
    display: flex; align-items: center; justify-content: center; font-size: 1rem; flex-shrink: 0;
}
.notif-item__body { flex: 1; min-width: 0; }
.notif-item__text { font-size: 0.78rem; color: var(--text); line-height: 1.4; white-space: normal; word-break: break-word; }
.notif-item__time { font-size: 0.65rem; color: var(--text-light); margin-top: 2px; }
.notif-item__dismiss {
    width: 24px; height: 24px; min-width: 24px; border-radius: var(--radius-full);
    border: none; background: var(--bg-alt); cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    color: var(--text-mid); font-size: 0.75rem; flex-shrink: 0;
    transition: all 0.15s ease; opacity: 1; /* Always visible for mobile */
}
.notif-item:hover .notif-item__dismiss { opacity: 1; }
.notif-item__dismiss:hover {
    background: #fee2e2; color: #dc2626;
}
.notif-empty {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    padding: 32px 20px; gap: 8px; color: var(--text-light);
}
.notif-empty i { font-size: 1.5rem; opacity: 0.4; }
.notif-empty span { font-size: 0.82rem; }
.notif-sidebar {
    top: 76px; bottom: auto; right: -410px; width: 390px; max-width: calc(100% - 24px);
    max-height: min(620px, calc(100vh - 100px)); border-radius: 28px 0 0 28px;
    overflow: hidden; box-shadow: -18px 22px 70px rgba(31,41,55,0.2);
    border: 1px solid rgba(255,255,255,0.8);
}
.notif-sidebar.active { right: 0; }
.notif-sidebar__head {
    padding: 14px 16px 12px !important;
    background: linear-gradient(135deg, var(--white), var(--bg-alt));
    border-bottom: 1px solid var(--border);
}
.notif-sidebar__title { display: flex; flex-direction: column; gap: 4px; }
.notif-sidebar__eyebrow {
    color: var(--cta); font-size: 0.58rem; font-weight: 900;
    text-transform: uppercase; letter-spacing: 0.12em;
}
.notif-sidebar .cart__head h3 {
    font-size: 0.92rem; margin: 0; display: flex; align-items: center; gap: 7px;
}
.notif-sidebar .cart__head h3 span {
    min-width: 18px; height: 18px; padding: 0 5px; border-radius: var(--radius-full);
    background: var(--cta); color: var(--white); font-size: 0.58rem;
    display: inline-flex; align-items: center; justify-content: center;
}
.notif-sidebar__actions { display: flex; align-items: center; gap: 8px; }
.notif-mark-read {
    width: 32px; height: 32px; padding: 0;
    border: 1px solid rgba(196,114,92,0.18); background: rgba(251,232,226,0.68); color: var(--cta);
    border-radius: var(--radius-full); font-size: 0.78rem;
    display: inline-flex; align-items: center; justify-content: center;
    font-weight: 900; cursor: pointer;
}
.notif-mark-read:hover { background: var(--cta); color: var(--white); transform: translateY(-1px); }
.notif-sidebar__body {
    flex: 0 1 auto; max-height: 500px; min-height: 0;
    padding: 14px 16px 18px !important; background: linear-gradient(180deg, var(--bg), var(--white));
}
.notif-sidebar__body .notif-item {
    display: grid; grid-template-columns: 42px minmax(0, 1fr) auto auto; align-items: flex-start;
    gap: 11px; padding: 13px; margin: 0 0 10px;
    border: 1px solid var(--border); border-radius: 18px;
    background: rgba(255,255,255,0.92); box-shadow: 0 8px 24px rgba(31,41,55,0.06);
}
.notif-sidebar__body .notif-item.unread {
    border-color: rgba(196,114,92,0.28);
    background: linear-gradient(135deg, var(--white), rgba(250,239,235,0.82));
}
.notif-sidebar__body .notif-item__icon {
    width: 42px; height: 42px; min-width: 42px;
    background: var(--clay-light); color: var(--cta);
    box-shadow: inset 0 0 0 1px rgba(196,114,92,0.12);
}
.notif-sidebar__body .notif-item__meta {
    display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 5px;
}
.notif-sidebar__body .notif-item__meta span {
    color: var(--cta); font-size: 0.66rem; font-weight: 900; text-transform: uppercase; letter-spacing: 0.08em;
}
.notif-sidebar__body .notif-item__meta small { color: var(--text-light); font-size: 0.68rem; white-space: nowrap; }
.notif-sidebar__body .notif-item__text strong {
    display: block; color: var(--text); font-size: 0.9rem; line-height: 1.25; margin-bottom: 4px;
}
.notif-sidebar__body .notif-item__text p {
    margin: 0; color: var(--text-mid); font-size: 0.8rem; line-height: 1.42;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.notif-item__dot {
    width: 8px; height: 8px; border-radius: var(--radius-full);
    background: var(--cta); margin-top: 6px; box-shadow: 0 0 0 4px rgba(196,114,92,0.13);
}
.notif-sidebar__body .notif-item__dismiss { opacity: 0.75; background: var(--white); border: 1px solid var(--border); }
.notif-empty--compact {
    min-height: 190px; padding: 20px 14px; border: 1px dashed var(--border);
    border-radius: 18px; background: linear-gradient(135deg, var(--bg), var(--bg-alt));
    text-align: center;
}
.notif-empty__icon {
    width: 48px; height: 48px; border-radius: 17px; background: var(--clay-light);
    display: flex; align-items: center; justify-content: center; color: var(--cta); margin-bottom: 4px;
}
.notif-empty__icon i { opacity: 1; font-size: 1.05rem; }
.notif-empty--compact strong { color: var(--text); font-family: var(--font-display); font-size: 0.96rem; }
.notif-empty--compact span { max-width: 260px; line-height: 1.45; color: var(--text-mid); margin-bottom: 6px; font-size: 0.78rem; }
.notif-example-card {
    width: min(310px, 100%); display: grid; grid-template-columns: 34px 1fr; gap: 9px;
    text-align: left; padding: 10px; margin: 4px 0 8px;
    border: 1px solid var(--border); border-radius: 16px;
    background: rgba(255,255,255,0.72);
}
.notif-example-card__icon {
    width: 34px; height: 34px; border-radius: 12px; display: flex; align-items: center; justify-content: center;
    background: var(--clay-light); color: var(--cta);
}
.notif-example-card small { color: var(--cta); font-size: 0.58rem; font-weight: 900; text-transform: uppercase; letter-spacing: 0.08em; }
.notif-example-card strong { display: block; font-family: var(--font-body); font-size: 0.78rem; margin: 1px 0 2px; }
.notif-example-card p { margin: 0; color: var(--text-mid); font-size: 0.72rem; line-height: 1.35; }

/* ============================================
   SOCIAL LOGIN POPUP
   ============================================ */
.social-login-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.5); z-index: 1199; }
.social-login-overlay.hidden { display: none; }
.social-login {
    position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);
    background: var(--white); border-radius: var(--radius-2xl);
    width: 90%; max-width: 380px; padding: 32px; z-index: 1200;
    text-align: center; box-shadow: 0 20px 60px rgba(0,0,0,0.2);
    animation: popIn 0.4s var(--ease-bounce);
}
.social-login.hidden { display: none; }
.social-login__close { position: absolute; top: 12px; right: 12px; background: rgba(0,0,0,0.06); border: none; border-radius: var(--radius-full); width: 32px; height: 32px; cursor: pointer; display: flex; align-items: center; justify-content: center; color: var(--text-mid); }
.social-login__title { font-family: var(--font-display); font-size: 1.2rem; font-weight: 700; margin-bottom: 6px; }
.social-login__text { font-size: 0.82rem; color: var(--text-mid); margin-bottom: 20px; }
.social-login__buttons { display: flex; flex-direction: column; gap: 10px; margin-bottom: 14px; }
.social-login__btn {
    display: flex; align-items: center; justify-content: center; gap: 10px;
    padding: 12px; border-radius: var(--radius-lg); border: none; cursor: pointer;
    font-size: 0.85rem; font-weight: 600; font-family: var(--font-body); transition: transform 0.15s ease;
}
.social-login__btn:hover { transform: scale(1.02); }
.social-login__btn--google { background: #fff; border: 1.5px solid #ddd; color: #333; }
.social-login__btn--fb { background: #1877F2; color: white; }
.social-login__btn--apple { background: #000; color: white; }
.social-login__privacy { font-size: 0.68rem; color: var(--text-light); }
.social-login__privacy a { color: var(--sage); }

/* ============================================
   RECENTLY VIEWED
   ============================================ */
.recently-viewed { padding: 30px 0 36px; background: var(--white); }
.recently-viewed__head {
    display: flex; align-items: end; justify-content: space-between; gap: 16px;
    margin-bottom: 14px;
}
.recently-viewed__title {
    font-family: var(--font-display); font-size: clamp(1.25rem, 4vw, 1.8rem);
    line-height: 1.1; margin: 4px 0 0; color: var(--text);
}
.recently-viewed__clear {
    color: var(--text-mid); background: transparent; border: 1px solid var(--border);
    border-radius: var(--radius-full); padding: 7px 12px; font-size: 0.72rem; font-weight: 800;
}
.recently-viewed--no-history .recently-viewed__clear { display: none; }
.recently-viewed__grid {
    display: flex; gap: 12px; overflow-x: auto; padding: 2px 2px 10px;
    scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch;
}
.recently-viewed__grid::-webkit-scrollbar { height: 4px; }
.recently-viewed__grid::-webkit-scrollbar-thumb { background: var(--sage); border-radius: 4px; }
.rv-card {
    flex: 0 0 min(300px, 82vw); scroll-snap-align: start; cursor: pointer;
    background: var(--white); border-radius: var(--radius-lg);
    border: 1px solid var(--border); overflow: hidden; transition: all 0.2s ease;
    display: grid; grid-template-columns: 92px minmax(0, 1fr) auto; align-items: center;
    padding: 10px; gap: 10px; box-shadow: 0 10px 24px rgba(31,41,55,0.05);
}
.rv-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.rv-card__img { width: 92px; height: 82px; display: flex; align-items: center; justify-content: center; font-size: 2rem; border-radius: 16px; overflow: hidden; }
.rv-card__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.rv-card__img img + .mini-product-media__fallback { display: none; }
.rv-card__body { min-width: 0; }
.rv-card__eyebrow { font-size: 0.6rem; font-weight: 800; color: var(--sage); text-transform: uppercase; letter-spacing: 0.08em; margin-bottom: 3px; }
.rv-card__name { font-size: 0.82rem; font-weight: 800; color: var(--text); line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.rv-card__price { font-size: 0.9rem; font-weight: 900; color: var(--cta); margin-top: 5px; }
.rv-card__cta {
    align-self: end; border: 0; background: var(--cta-light); color: var(--cta);
    border-radius: var(--radius-full); padding: 8px 11px; font-size: 0.72rem; font-weight: 900;
}

/* ============================================
   LANGUAGE SWITCHER
   ============================================ */
.lang-switcher { position: relative; }
.lang-switcher__btn {
    display: flex; align-items: center; gap: 4px;
    background: none; border: 1px solid var(--border); border-radius: var(--radius-full);
    padding: 5px 10px; cursor: pointer; font-size: 0.72rem; font-weight: 600;
    color: var(--text-mid); font-family: var(--font-body); transition: all 0.2s ease;
}
.lang-switcher__btn:hover { border-color: var(--sage); }
.lang-switcher__dropdown {
    position: absolute; top: 100%; right: 0; margin-top: 6px;
    background: var(--white); border-radius: var(--radius-md);
    box-shadow: 0 8px 24px rgba(0,0,0,0.12); border: 1px solid var(--border);
    overflow: hidden; z-index: 1201; min-width: 130px;
}
.lang-switcher__dropdown.hidden { display: none; }
.lang-switcher__dropdown button {
    display: block; width: 100%; text-align: left; padding: 10px 14px;
    border: none; background: none; cursor: pointer; font-size: 0.78rem;
    font-family: var(--font-body); color: var(--text); transition: background 0.15s ease;
}
.lang-switcher__dropdown button:hover { background: var(--bg-cream); }

/* ============================================
   PAGE TRANSITIONS
   ============================================ */
.page-transition {
    position: fixed; inset: 0; z-index: 9999; pointer-events: none;
    background: var(--sage); transform: scaleX(0); transform-origin: left;
}
.page-transition.active { animation: pageWipe 0.5s ease-in-out; }
@keyframes pageWipe {
    0% { transform: scaleX(0); transform-origin: left; }
    50% { transform: scaleX(1); transform-origin: left; }
    50.1% { transform-origin: right; }
    100% { transform: scaleX(0); transform-origin: right; }
}

/* ============================================
   PRODUCT ZOOM ON HOVER
   ============================================ */
.pdp__image-main { overflow: hidden; position: relative; cursor: zoom-in; }
.pdp__image-main:hover .pdp__emoji { transform: scale(1.8); transition: transform 0.4s ease; }

/* ============================================
   REWARDS POINTS
   ============================================ */
.rewards-bar {
    display: flex; align-items: center; gap: 8px; padding: 10px 14px;
    background: linear-gradient(135deg, #FFD700, #FFA500); border-radius: var(--radius-lg);
    margin-bottom: 12px; color: #333; font-size: 0.78rem; font-weight: 600;
}
.rewards-bar i { font-size: 1rem; }
.rewards-bar__points { font-weight: 800; font-size: 0.88rem; }

/* ============================================
   SPLASH LOADING SCREEN
   ============================================ */
.splash-screen {
    position: fixed; inset: 0; z-index: 99999;
    background: linear-gradient(135deg, #E8F0EC 0%, #F5EDE3 50%, #FCEAE9 100%);
    display: flex; align-items: center; justify-content: center;
    transition: opacity 0.5s ease, visibility 0.5s ease;
}
.splash-screen.hidden { opacity: 0; visibility: hidden; }
.splash-screen__inner { text-align: center; }
.splash-screen__logo { font-size: 3.5rem; margin-bottom: 12px; animation: splashPulse 1.5s ease-in-out infinite; }
.splash-screen__title { font-family: var(--font-display); font-size: 1.8rem; font-weight: 800; color: var(--sage-dark); margin-bottom: 20px; }
.splash-screen__bar { width: 180px; height: 4px; background: rgba(0,0,0,0.08); border-radius: 4px; overflow: hidden; margin: 0 auto; }
.splash-screen__fill { width: 0; height: 100%; background: linear-gradient(90deg, var(--sage), var(--clay)); border-radius: 4px; animation: splashLoad 1.5s ease-in-out forwards; }
@keyframes splashPulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.15); } }
@keyframes splashLoad { to { width: 100%; } }

/* ============================================
   STORY HIGHLIGHTS
   ============================================ */
.story-highlights { padding: 16px 0 0; }
.story-highlights__scroll {
    display: flex; gap: 16px; overflow-x: auto; padding: 8px 0 12px;
    scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch;
}
.story-highlights__scroll::-webkit-scrollbar { display: none; }
.story-item {
    flex: 0 0 auto; text-align: center; cursor: pointer; scroll-snap-align: start;
}
.story-item__ring {
    width: 68px; height: 68px; border-radius: 50%;
    background: linear-gradient(135deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888);
    padding: 3px; margin-bottom: 6px;
}
.story-item__inner {
    width: 100%; height: 100%; border-radius: 50%;
    background: var(--white); display: flex; align-items: center;
    justify-content: center; font-size: 1.6rem; border: 2px solid var(--white);
}
.story-item__name { font-size: 0.62rem; font-weight: 600; color: var(--text-mid); max-width: 72px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.story-item:hover .story-item__ring { transform: scale(1.08); transition: transform 0.2s ease; }

/* ============================================
   PROMO CODE FORM
   ============================================ */
.cart__promo { padding: 10px 0; border-bottom: 1px solid var(--border); }
.promo-form { display: flex; gap: 6px; }
.promo-form__input {
    flex: 1; padding: 8px 12px; border: 1.5px solid var(--border); border-radius: var(--radius-md);
    font-size: 0.78rem; font-family: var(--font-body); text-transform: uppercase;
}
.promo-form__input:focus { border-color: var(--sage); outline: none; }
.promo-form__btn {
    padding: 8px 14px; background: var(--sage); color: var(--white); border: none;
    border-radius: var(--radius-md); font-size: 0.72rem; font-weight: 700;
    cursor: pointer; font-family: var(--font-body); white-space: nowrap;
}
.promo-result { padding: 6px 0; font-size: 0.75rem; font-weight: 600; }
.promo-result.hidden { display: none; }
.promo-result.success { color: #22c55e; }
.promo-result.error { color: #ef4444; }

/* ============================================
   SHIPPING CALCULATOR
   ============================================ */
.cart__ship-calc { padding: 8px 0; }
.cart__ship-calc details { font-size: 0.78rem; }
.cart__ship-calc summary {
    cursor: pointer; font-weight: 600; color: var(--text-mid);
    display: flex; align-items: center; gap: 6px;
}
.cart__ship-calc select {
    width: 100%; margin-top: 8px; padding: 8px 10px; border: 1.5px solid var(--border);
    border-radius: var(--radius-md); font-size: 0.78rem; font-family: var(--font-body);
    background: var(--white);
}
.ship-estimate { margin-top: 6px; font-size: 0.75rem; color: var(--text-mid); font-weight: 500; }

/* ============================================
   SKELETON SHIMMER
   ============================================ */
.skeleton-card {
    background: var(--bg-cream); border-radius: var(--radius-xl);
    overflow: hidden; position: relative;
}
.skeleton-card__img { height: 160px; background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%); background-size: 200% 100%; animation: shimmer 1.5s infinite; }
.skeleton-card__body { padding: 14px; }
.skeleton-card__line { height: 12px; border-radius: 6px; background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%); background-size: 200% 100%; animation: shimmer 1.5s infinite; margin-bottom: 8px; }
.skeleton-card__line--short { width: 60%; }
@keyframes shimmer { to { background-position: -200% 0; } }

/* ============================================
   Q&A TAB STYLES
   ============================================ */
.qa-section { padding: 8px 0; }
.qa-section__heading { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 10px; padding: 6px 12px; border-radius: var(--radius-full); background: var(--sage-light); color: var(--sage-dark); font-size: 0.76rem; font-weight: 800; }
.qa-item { padding: 12px 0; border-bottom: 1px solid var(--border); }
.qa-item--answered { padding: 14px; margin-bottom: 10px; border: 1px solid rgba(124,154,142,0.22); border-radius: 14px; background: linear-gradient(135deg, rgba(232,240,236,0.72), rgba(255,255,255,0.92)); }
.qa-item--loading { color: var(--text-light); }
.qa-item__question { font-weight: 700; font-size: 0.85rem; color: var(--text); margin-bottom: 6px; display: flex; gap: 6px; }
.qa-item__answer { font-size: 0.8rem; color: var(--text-mid); line-height: 1.5; padding-left: 22px; }
.qa-form { display: flex; gap: 8px; margin-top: 12px; }
.qa-form input { flex: 1; padding: 8px 12px; border: 1.5px solid var(--border); border-radius: var(--radius-md); font-size: 0.78rem; font-family: var(--font-body); }
.qa-form button { padding: 8px 14px; background: var(--sage); color: var(--white); border: none; border-radius: var(--radius-md); font-size: 0.72rem; font-weight: 700; cursor: pointer; }

/* ============================================
   MOBILE RESPONSIVE POLISH R6
   ============================================ */
@media (max-width: 768px) {
    .currency-switcher, .lang-switcher { display: none; }
    .story-highlights__scroll { gap: 12px; padding-left: 4px; }
    .story-item__ring { width: 56px; height: 56px; }
    .story-item__inner { font-size: 1.2rem; }
    .story-item__name { font-size: 0.55rem; }
    .insta-feed__grid { grid-template-columns: repeat(3, 1fr); }
    .countdown-deal__inner { flex-direction: column; text-align: center; padding: 20px; }
    .notif-center { position: fixed; width: 90%; right: 5%; left: 5%; top: 70px; z-index: 10001; }
}

/* ============================================
   TRUST BADGES
   ============================================ */
.trust-badges { padding: 30px 0 10px; }
.trust-badges__grid {
    display: flex; justify-content: center; gap: 24px; flex-wrap: wrap;
}
.trust-badge {
    display: flex; flex-direction: column; align-items: center; gap: 6px;
    font-size: 0.7rem; font-weight: 600; color: var(--text-mid); text-align: center;
}
.trust-badge i {
    width: 42px; height: 42px; border-radius: 50%;
    background: var(--sage-light); color: var(--sage-dark);
    display: flex; align-items: center; justify-content: center; font-size: 1rem;
}

/* ============================================
   ABANDONED CART POPUP
   ============================================ */
.abandon-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.5); z-index: 1199; }
.abandon-overlay.hidden { display: none; }
.abandon-popup {
    position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);
    background: var(--white); border-radius: var(--radius-2xl);
    width: 90%; max-width: 380px; padding: 32px; z-index: 1200;
    text-align: center; box-shadow: 0 20px 60px rgba(0,0,0,0.2);
    animation: popIn 0.4s var(--ease-bounce);
}
.abandon-popup.hidden { display: none; }
.abandon-popup__close { position: absolute; top: 12px; right: 12px; background: rgba(0,0,0,0.06); border: none; border-radius: var(--radius-full); width: 32px; height: 32px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.abandon-popup__emoji { font-size: 3rem; margin-bottom: 12px; }
.abandon-popup__title { font-family: var(--font-display); font-size: 1.2rem; font-weight: 700; margin-bottom: 6px; }
.abandon-popup__text { font-size: 0.85rem; color: var(--text-mid); margin-bottom: 16px; }

/* ============================================
   HEATMAP DEBUG OVERLAY
   ============================================ */
.heatmap-canvas {
    position: fixed; inset: 0; z-index: 9998; pointer-events: none; opacity: 0.4;
}
.heatmap-canvas.hidden { display: none; }

/* ============================================
   SCROLL DEPTH INDICATOR
   ============================================ */
.scroll-depth {
    position: fixed; top: 0; left: 0; right: 0; height: 3px;
    z-index: 1001; background: transparent;
}
.scroll-depth__fill {
    height: 100%; width: 0; background: linear-gradient(90deg, var(--sage), var(--clay));
    transition: width 0.1s linear;
}

/* ============================================
   RIPPLE MICRO-INTERACTION (disabled — clean clicks)
   ============================================ */
.btn { position: relative; overflow: hidden; }
.ripple { display: none; }

/* ============================================
   BNPL BADGE ON PRODUCT CARDS
   ============================================ */
.p-card__bnpl {
    font-size: 0.62rem; color: var(--text-light); margin-top: 2px;
}
.p-card__bnpl strong { color: var(--sage-dark); }
.p-card__bnpl .bnpl-brand { font-weight: 700; color: #FFB3C7; font-size: 0.6rem; }

/* ============================================
   SEARCH POPULAR TAGS
   ============================================ */
.search-overlay__popular { margin-top: 16px; }
.search-overlay__label { font-size: 0.85rem; color: var(--text-light); font-weight: 600; margin-bottom: 12px; display: block; text-transform: uppercase; letter-spacing: 1px; }
.search-overlay__tags { display: flex; flex-wrap: wrap; gap: 10px; }
.search-overlay__tags button {
    background: var(--white); border: 1px solid var(--border); color: var(--text-mid);
    padding: 8px 16px; border-radius: var(--radius-full); font-size: 0.85rem;
    font-weight: 500; cursor: pointer; transition: all var(--duration);
}
.search-overlay__tags button:hover { border-color: var(--cta); color: var(--cta); transform: translateY(-2px); box-shadow: var(--shadow-sm); }

/* ============================================
   PDP DELIVERY PROMISE BADGES
   ============================================ */
.pdp__promises { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 12px 0; }
.pdp__promise {
    display: flex; align-items: center; gap: 8px; padding: 8px 12px;
    background: var(--bg-cream); border-radius: var(--radius-md); font-size: 0.72rem;
    font-weight: 600; color: var(--text-mid);
}
.pdp__promise i { color: var(--sage); font-size: 0.85rem; }

/* ============================================
   SATISFACTION GUARANTEE BANNER
   ============================================ */
.guarantee-banner { padding: 34px 0 54px; }
.guarantee-banner__inner {
    display: flex; align-items: center; gap: 20px; padding: 24px 32px;
    background: linear-gradient(135deg, #E8F0EC, #F5EDE3);
    border-radius: var(--radius-2xl); border: 1px solid rgba(0,0,0,0.04);
}
.guarantee-banner__icon { font-size: 2.5rem; flex-shrink: 0; }
.guarantee-banner__text h3 {
    font-family: var(--font-display); font-size: 1rem; font-weight: 700;
    margin-bottom: 4px; color: var(--sage-dark);
}
.guarantee-banner__text p { font-size: 0.82rem; color: var(--text-mid); line-height: 1.5; }
.guarantee-banner__cta { margin-top: 12px; }

/* ============================================
   WHATSAPP FLOATING BUTTON
   ============================================ */
.whatsapp-btn {
    position: fixed; bottom: 90px; right: 20px; z-index: 999;
    width: 50px; height: 50px; border-radius: 50%;
    background: #25D366; color: white; display: flex;
    align-items: center; justify-content: center; font-size: 1.4rem;
    box-shadow: 0 4px 15px rgba(37,211,102,0.4); text-decoration: none;
    transition: transform 0.2s ease; animation: whatsappPulse 2s infinite;
}
.whatsapp-btn:hover { transform: scale(1.1); }
.whatsapp-btn:hover .whatsapp-btn__tooltip { opacity: 1; visibility: visible; transform: translateY(0); }
.whatsapp-btn__tooltip {
    position: absolute; right: 58px; top: 50%; transform: translateY(-50%) translateX(5px);
    background: var(--text); color: white; padding: 6px 12px; border-radius: var(--radius-md);
    font-size: 0.7rem; font-weight: 600; white-space: nowrap; pointer-events: none;
    opacity: 0; visibility: hidden; transition: all 0.2s ease;
}
@keyframes whatsappPulse { 0%, 100% { box-shadow: 0 4px 15px rgba(37,211,102,0.4); } 50% { box-shadow: 0 4px 25px rgba(37,211,102,0.6); } }

/* ============================================
   FULLSCREEN LIGHTBOX
   ============================================ */
.lightbox {
    position: fixed; inset: 0; z-index: 10000;
    background: rgba(26, 22, 18, 0.9);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    display: flex; align-items: center;
    justify-content: center; cursor: pointer;
    padding: 56px 16px 24px;
}
.lightbox.hidden { display: none; }
.lightbox__close {
    position: absolute; top: 16px; right: 16px; background: rgba(255,255,255,0.1);
    border: none; border-radius: 50%; width: 40px; height: 40px; cursor: pointer;
    color: white; font-size: 1.2rem; display: flex; align-items: center; justify-content: center;
    z-index: 3;
}
.lightbox__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 44px;
    height: 44px;
    border: none;
    border-radius: 999px;
    background: rgba(255,255,255,0.12);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 3;
    font-size: 1rem;
}
.lightbox__nav:hover { background: rgba(255,255,255,0.2); }
.lightbox__nav--prev { left: 12px; }
.lightbox__nav--next { right: 12px; }
.lightbox__counter {
    position: absolute;
    top: 18px;
    left: 50%;
    transform: translateX(-50%);
    color: rgba(255,255,255,0.88);
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    z-index: 3;
}
.lightbox__content { font-size: 8rem; cursor: default; max-width: min(94vw, 1100px); max-height: 88vh; touch-action: none; }
.lightbox__stage {
    display: flex;
    align-items: center;
    justify-content: center;
    width: min(94vw, 1100px);
    max-height: 88vh;
    overflow: hidden;
}
.lightbox__image {
    display: block;
    max-width: min(94vw, 1100px);
    max-height: 88vh;
    width: auto;
    height: auto;
    object-fit: contain;
    border-radius: 18px;
    box-shadow: 0 24px 80px rgba(0,0,0,0.38);
    transform-origin: center center;
    transition: transform 0.12s ease-out;
    will-change: transform;
}
.lightbox__image.is-zoomed {
    cursor: grab;
}
@media (max-width: 768px) {
    .lightbox { padding: 52px 8px 16px; }
    .lightbox__nav { width: 40px; height: 40px; }
    .lightbox__nav--prev { left: 6px; }
    .lightbox__nav--next { right: 6px; }
}

/* ============================================
   PAGINATION
   ============================================ */
.pagination { display: flex; justify-content: center; align-items: center; gap: 8px; margin-top: 32px; padding-bottom: 20px; }
.pagination__btn {
    padding: 8px 14px; border-radius: 8px; border: 1px solid var(--border);
    background: var(--white); color: var(--text); cursor: pointer;
    font-size: 0.85rem; font-weight: 500; min-width: 38px; display: flex; align-items: center; justify-content: center;
    transition: all 0.2s ease;
}
.pagination__btn:hover:not(:disabled) { border-color: var(--cta); color: var(--cta); }
.pagination__btn.active { background: var(--cta); color: var(--white); border-color: var(--cta); font-weight: 700; }
.pagination__btn:disabled { background: var(--bg-cream); color: var(--text-light); cursor: default; opacity: 0.6; }
.pagination__dots { padding: 0 4px; color: var(--text-light); }

/* ============================================
   HERO TYPING EFFECT
   ============================================ */
.hero__typing-cursor {
    display: inline-block; width: 3px; height: 0.9em; background: var(--sage);
    margin-left: 2px; animation: blink 0.7s step-end infinite;
    vertical-align: baseline;
}
@keyframes blink { 0%, 100% { opacity: 1; } 50% { opacity: 0; } }

/* ============================================
   CART BADGE BOUNCE
   ============================================ */
@keyframes badgeBounce {
    0% { transform: scale(1); }
    30% { transform: scale(1.5); }
    50% { transform: scale(0.9); }
    70% { transform: scale(1.2); }
    100% { transform: scale(1); }
}
.header__badge.bounce { animation: badgeBounce 0.5s ease; }

/* ============================================
   BACK TO TOP WITH PROGRESS
   ============================================ */
#scroll-top { position: relative; }
.scroll-top-pct {
    position: absolute; top: -8px; right: -8px;
    font-size: 0.5rem; font-weight: 800; color: var(--sage);
    background: var(--white); border-radius: 50%; width: 18px; height: 18px;
    display: flex; align-items: center; justify-content: center;
    border: 1.5px solid var(--sage);
}

/* ============================================
   COOKIE CONSENT BANNER
   ============================================ */
.cookie-banner {
    position: fixed; bottom: 0; left: 0; right: 0; z-index: 9999;
    background: rgba(30,30,30,0.95); color: white;
    padding: 14px 20px; animation: slideFromBottom 0.4s ease;
}
.cookie-banner.hidden { display: none; }
.cookie-banner__inner {
    max-width: 1100px; margin: 0 auto; display: flex;
    align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap;
}
.cookie-banner__inner span { font-size: 0.78rem; }
.cookie-banner__actions { display: flex; gap: 8px; }
.cookie-banner__decline {
    background: none; border: 1px solid rgba(255,255,255,0.3); color: white;
    padding: 6px 14px; border-radius: var(--radius-md); font-size: 0.72rem;
    cursor: pointer; font-family: var(--font-body);
}
.btn--sm { padding: 6px 16px; font-size: 0.72rem; }
.cookie-banner .btn { background: var(--cta); color: #fff !important; }
.cookie-banner .btn:hover { background: var(--cta-hover); }
@keyframes slideFromBottom { from { transform: translateY(100%); } to { transform: translateY(0); } }

/* ============================================
   AGE WIZARD POPUP
   ============================================ */
.wizard-overlay { position: fixed; inset: 0; background: rgba(31,41,55,0.34); backdrop-filter: blur(4px); z-index: 1199; animation: wizardOverlayIn 0.16s ease-out; }
.wizard-overlay.hidden { display: none; }
.wizard-popup {
    position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);
    background: linear-gradient(180deg, #fff, #fbf8f5); border-radius: 28px;
    width: min(92vw, 420px); padding: 30px; z-index: 1200;
    text-align: center; box-shadow: 0 26px 70px rgba(92,72,58,0.22);
    border: 1px solid rgba(196,149,106,0.16);
    animation: wizardSoftIn 0.18s ease-out;
}
.wizard-popup.hidden { display: none; }
.wizard-popup__close {
    position: absolute; top: 14px; right: 14px; background: rgba(124,154,142,0.12);
    border: none; border-radius: var(--radius-full); width: 36px; height: 36px;
    cursor: pointer; display: flex; align-items: center; justify-content: center; color: var(--text-mid);
}
.wizard-popup__emoji {
    width: 58px; height: 58px; border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--sage-light); font-size: 1.75rem; margin-bottom: 14px;
}
.wizard-popup__title { font-family: var(--font-display); font-size: 1.45rem; font-weight: 800; margin-bottom: 8px; color: var(--text); }
.wizard-popup__text { font-size: 0.88rem; color: var(--text-mid); margin: 0 auto 20px; max-width: 310px; line-height: 1.55; }
.wizard-popup__ages { display: grid; grid-template-columns: 1fr; gap: 10px; }
.wizard-age-btn {
    padding: 12px 14px; border: 1.5px solid var(--border); border-radius: 16px;
    background: rgba(255,255,255,0.74); cursor: pointer; font-size: 0.9rem; font-weight: 700;
    font-family: var(--font-body); color: var(--text); transition: all 0.2s ease;
    display: grid; grid-template-columns: 42px 1fr; gap: 12px; text-align: left; align-items: center;
}
.wizard-age-btn:hover { border-color: var(--sage); background: var(--sage-light); color: var(--sage-dark); transform: translateY(-1px); }
.wizard-age-btn__icon {
    width: 42px; height: 42px; border-radius: 14px; display: inline-flex; align-items: center; justify-content: center;
    background: var(--white); box-shadow: 0 8px 18px rgba(92,72,58,0.07); font-size: 1.25rem;
}
.wizard-age-btn__text strong { display: block; font-size: 0.92rem; }
.wizard-age-btn__text small { display: block; color: var(--text-mid); font-weight: 600; margin-top: 2px; font-size: 0.74rem; }

@keyframes wizardOverlayIn {
    from { opacity: 0; }
    to { opacity: 1; }
}
@keyframes wizardSoftIn {
    from { opacity: 0; transform: translate(-50%, calc(-50% + 12px)) scale(0.985); }
    to { opacity: 1; transform: translate(-50%, -50%) scale(1); }
}

@media (max-width: 640px) {
    .wizard-overlay { background: rgba(31,41,55,0.26); backdrop-filter: blur(3px); }
    .wizard-popup {
        top: 52%;
        left: 14px;
        right: 14px;
        bottom: auto;
        width: auto;
        max-height: min(82dvh, 560px);
        overflow-y: auto;
        transform: translateY(-50%);
        border-radius: 24px;
        padding: 22px 16px 18px;
        text-align: left;
        animation: wizardMobileIn 0.2s ease-out;
    }
    .wizard-popup__emoji {
        width: 44px;
        height: 44px;
        margin-bottom: 10px;
        font-size: 1.28rem;
    }
    .wizard-popup__title { font-size: 1.2rem; margin-right: 42px; }
    .wizard-popup__text { margin: 0 0 16px; max-width: none; font-size: 0.82rem; }
    .wizard-popup__close { top: 12px; right: 12px; }
}
@keyframes wizardMobileIn {
    from { opacity: 0; transform: translateY(calc(-50% + 16px)); }
    to { opacity: 1; transform: translateY(-50%); }
}

/* ============================================
   SAFETY CERTIFICATE MODAL
   ============================================ */
.cert-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.5); z-index: 1199; }
.cert-overlay.hidden { display: none; }
.cert-modal {
    position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);
    background: var(--white); border-radius: var(--radius-2xl);
    width: 90%; max-width: 420px; padding: 28px; z-index: 1200;
    box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: popIn 0.4s var(--ease-bounce);
}
.cert-modal.hidden { display: none; }
.cert-modal__close { position: absolute; top: 12px; right: 12px; background: rgba(0,0,0,0.06); border: none; border-radius: var(--radius-full); width: 32px; height: 32px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.cert-modal__title { font-family: var(--font-display); font-size: 1.1rem; font-weight: 700; display: flex; align-items: center; gap: 8px; margin-bottom: 16px; }
.cert-modal__title i { color: var(--sage); }
.cert-modal__item { display: flex; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--border); }
.cert-modal__icon { width: 40px; height: 40px; border-radius: var(--radius-full); background: var(--sage-light); display: flex; align-items: center; justify-content: center; color: var(--sage-dark); font-size: 0.9rem; flex-shrink: 0; }
.cert-modal__info h4 { font-size: 0.82rem; font-weight: 700; margin-bottom: 2px; }
.cert-modal__info p { font-size: 0.72rem; color: var(--text-mid); line-height: 1.4; }
.cert-modal__footer { margin-top: 16px; padding: 10px 14px; background: var(--sage-light); border-radius: var(--radius-md); font-size: 0.75rem; font-weight: 600; color: var(--sage-dark); display: flex; align-items: center; gap: 6px; }

/* ============================================
   RATING BREAKDOWN BARS
   ============================================ */
.rating-breakdown { margin-bottom: 16px; }
.rating-bar { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
.rating-bar__label { font-size: 0.7rem; font-weight: 600; color: var(--text-mid); width: 30px; }
.rating-bar__track { flex: 1; height: 8px; background: var(--border); border-radius: 4px; overflow: hidden; }
.rating-bar__fill { height: 100%; background: #FFB800; border-radius: 4px; transition: width 0.6s ease; }
.rating-bar__count { font-size: 0.65rem; color: var(--text-light); width: 25px; text-align: right; }

/* ============================================
   BACK-IN-STOCK SIGNUP
   ============================================ */
.back-in-stock { margin-top: 12px; padding: 12px 14px; background: var(--bg-cream); border-radius: var(--radius-md); }
.back-in-stock__label { font-size: 0.72rem; font-weight: 600; color: var(--text-mid); margin-bottom: 6px; }
.back-in-stock__form { display: flex; gap: 6px; }
.back-in-stock__form input { flex: 1; padding: 6px 10px; border: 1px solid var(--border); border-radius: var(--radius-md); font-size: 0.72rem; font-family: var(--font-body); }
.back-in-stock__form button { padding: 6px 12px; background: var(--sage); color: white; border: none; border-radius: var(--radius-md); font-size: 0.68rem; font-weight: 700; cursor: pointer; }

/* ============================================
   PDP DELIVERY DATE ESTIMATE
   ============================================ */
.pdp__delivery-date {
    display: flex; align-items: center; gap: 10px; padding: 10px 14px;
    background: linear-gradient(135deg, #E8F5E9, #F1F8E9); border-radius: var(--radius-md);
    font-size: 0.78rem; font-weight: 600; color: #2E7D32; margin: 8px 0;
    border: 1px solid rgba(46,125,50,0.15);
}
.pdp__delivery-date i { font-size: 0.9rem; }
.pdp__delivery-date strong { color: #1B5E20; }

/* ============================================
   WHAT'S IN THE BOX
   ============================================ */
.pdp__inbox {
    margin: 14px 0 24px;
    padding: 18px;
    background: linear-gradient(135deg, rgba(232,240,236,0.72), rgba(245,237,227,0.62));
    border: 1px solid rgba(124,154,142,0.18);
    border-radius: 18px;
    box-shadow: 0 12px 34px rgba(92,72,58,0.06);
}
.pdp__inbox-title {
    font-size: 0.94rem; font-weight: 800; color: var(--text);
    display: flex; align-items: center; gap: 8px; margin-bottom: 12px;
}
.pdp__inbox-title i {
    width: 30px; height: 30px; border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--sage); color: var(--white);
}
.pdp__inbox-list {
    list-style: none; padding: 0; margin: 0;
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 12px;
}
.pdp__inbox-list li {
    font-size: 0.82rem; color: var(--text-mid);
    padding: 9px 10px; display: grid; grid-template-columns: 22px 1fr; align-items: center; gap: 8px;
    background: rgba(255,255,255,0.62); border: 1px solid rgba(255,255,255,0.74);
    border-radius: 12px; line-height: 1.35;
}
.pdp__inbox-list li::before {
    content: '\2713'; width: 22px; height: 22px; border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
    background: rgba(124,154,142,0.16); color: var(--sage-dark);
    font-weight: 900; font-size: 0.72rem;
}

/* ============================================
   GUEST CHECKOUT BUTTON
   ============================================ */
.btn--outline { background: none; border: 1.5px solid var(--border); color: var(--text-mid); }
.btn--outline:hover { border-color: var(--sage); color: var(--sage-dark); }
.cart__guest-btn { margin-top: 6px; font-size: 0.78rem; }

/* ============================================
   ORDER CONFIRMATION MODAL
   ============================================ */
.order-confirm-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.6); z-index: 10001; }
.order-confirm-overlay.hidden { display: none; }
.order-confirm {
    position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);
    background: var(--white); border-radius: var(--radius-2xl);
    width: 90%; max-width: 460px; padding: 36px; z-index: 10002;
    text-align: center; box-shadow: 0 24px 80px rgba(0,0,0,0.25);
    animation: popIn 0.5s var(--ease-bounce);
}
.order-confirm.hidden { display: none; }
.order-confirm__icon { font-size: 3.5rem; margin-bottom: 12px; }
.order-confirm__title { font-family: var(--font-display); font-size: 1.5rem; font-weight: 800; color: var(--sage-dark); margin-bottom: 4px; }
.order-confirm__text { font-size: 0.88rem; color: var(--text-mid); margin-bottom: 16px; }
.order-confirm__details { text-align: left; padding: 12px 16px; background: var(--bg-cream); border-radius: var(--radius-md); margin-bottom: 20px; font-size: 0.78rem; }
.order-confirm__details div { display: flex; justify-content: space-between; padding: 4px 0; }
.order-confirm__details strong { color: var(--sage-dark); }

/* ORDER TRACKING TIMELINE */
.order-confirm__track { display: flex; align-items: center; justify-content: center; gap: 0; margin-bottom: 20px; }
.track-step { display: flex; flex-direction: column; align-items: center; gap: 4px; font-size: 0.65rem; color: var(--text-light); font-weight: 600; }
.track-step i { font-size: 1.1rem; }
.track-step.active { color: var(--sage); }
.track-step.active i { color: var(--sage); }
.track-line { width: 30px; height: 2px; background: var(--border); margin: 0 2px; margin-bottom: 18px; }

/* ============================================
   REFERRAL PROGRAM POPUP
   ============================================ */
.referral-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.5); z-index: 1199; }
.referral-overlay.hidden { display: none; }
.referral-popup {
    position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);
    background: var(--white); border-radius: var(--radius-2xl);
    width: 90%; max-width: 380px; padding: 32px; z-index: 1200;
    text-align: center; box-shadow: 0 20px 60px rgba(0,0,0,0.2);
    animation: popIn 0.4s var(--ease-bounce);
}
.referral-popup.hidden { display: none; }
.referral-popup__close { position: absolute; top: 12px; right: 12px; background: rgba(0,0,0,0.06); border: none; border-radius: var(--radius-full); width: 32px; height: 32px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.referral-popup__emoji { font-size: 3rem; margin-bottom: 8px; }
.referral-popup__title { font-family: var(--font-display); font-size: 1.2rem; font-weight: 700; margin-bottom: 4px; }
.referral-popup__text { font-size: 0.82rem; color: var(--text-mid); margin-bottom: 16px; line-height: 1.5; }
.referral-popup__code {
    display: flex; align-items: center; justify-content: center; gap: 8px;
    background: var(--bg-cream); padding: 10px 16px; border-radius: var(--radius-md);
    border: 2px dashed var(--sage); margin-bottom: 16px;
}
.referral-popup__code span { font-size: 0.88rem; font-weight: 800; color: var(--sage-dark); letter-spacing: 1px; }
.referral-popup__code button { background: var(--sage); color: white; border: none; border-radius: var(--radius-md); padding: 6px 10px; cursor: pointer; }
.referral-popup__share { display: flex; justify-content: center; gap: 10px; }
.referral-popup__share button {
    width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--border);
    background: none; cursor: pointer; font-size: 1rem; color: var(--text-mid);
    transition: all 0.2s ease;
}
.referral-popup__share button:hover { background: var(--sage-light); color: var(--sage-dark); border-color: var(--sage); }

/* ============================================
   BIRTHDAY DISCOUNT POPUP
   ============================================ */
.birthday-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.5); z-index: 1199; }
.birthday-overlay.hidden { display: none; }
.birthday-popup {
    position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);
    background: var(--white); border-radius: var(--radius-2xl);
    width: 90%; max-width: 360px; padding: 32px; z-index: 1200;
    text-align: center; box-shadow: 0 20px 60px rgba(0,0,0,0.2);
    animation: popIn 0.4s var(--ease-bounce);
}
.birthday-popup.hidden { display: none; }
.birthday-popup__close { position: absolute; top: 12px; right: 12px; background: rgba(0,0,0,0.06); border: none; border-radius: var(--radius-full); width: 32px; height: 32px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.birthday-popup__emoji { font-size: 3rem; margin-bottom: 8px; }
.birthday-popup__title { font-family: var(--font-display); font-size: 1.2rem; font-weight: 700; margin-bottom: 4px; }
.birthday-popup__text { font-size: 0.82rem; color: var(--text-mid); margin-bottom: 16px; }
.birthday-popup__form { display: flex; flex-direction: column; gap: 10px; }
.birthday-popup__form input[type="date"] {
    padding: 10px 14px; border: 1.5px solid var(--border); border-radius: var(--radius-md);
    font-size: 0.88rem; font-family: var(--font-body); text-align: center;
}

/* ============================================
   RETURN POLICY MODAL
   ============================================ */
.return-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.5); z-index: 1199; }
.return-overlay.hidden { display: none; }
.return-modal {
    position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);
    background: var(--white); border-radius: var(--radius-2xl);
    width: 90%; max-width: 420px; padding: 28px; z-index: 1200;
    box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: popIn 0.4s var(--ease-bounce);
}
.return-modal.hidden { display: none; }
.return-modal__close { position: absolute; top: 12px; right: 12px; background: rgba(0,0,0,0.06); border: none; border-radius: var(--radius-full); width: 32px; height: 32px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.return-modal__title { font-family: var(--font-display); font-size: 1.1rem; font-weight: 700; display: flex; align-items: center; gap: 8px; margin-bottom: 16px; }
.return-modal__title i { color: var(--sage); }
.return-modal__steps { display: flex; flex-direction: column; gap: 12px; margin-bottom: 16px; }
.return-step { display: flex; gap: 12px; align-items: flex-start; }
.return-step__num {
    width: 28px; height: 28px; border-radius: 50%; background: var(--sage);
    color: white; display: flex; align-items: center; justify-content: center;
    font-size: 0.72rem; font-weight: 800; flex-shrink: 0;
}
.return-step h4 { font-size: 0.82rem; font-weight: 700; margin-bottom: 2px; }
.return-step p { font-size: 0.72rem; color: var(--text-mid); line-height: 1.4; }
.return-modal__note {
    padding: 10px 14px; background: #FFF8E1; border-radius: var(--radius-md);
    font-size: 0.72rem; color: #795548; display: flex; align-items: center; gap: 6px;
}

/* ============================================
   LIVE CHAT WIDGET
   ============================================ */
.live-chat {
    position: fixed; bottom: 90px; left: 20px; z-index: 9998;
    width: 340px; max-height: 460px; background: var(--white);
    border-radius: var(--radius-2xl); box-shadow: 0 16px 60px rgba(0,0,0,0.2);
    display: flex; flex-direction: column; overflow: hidden;
    animation: popIn 0.3s var(--ease-bounce);
}
.live-chat.hidden { display: none; }
.live-chat__head {
    background: linear-gradient(135deg, #2E7D32, #43A047); color: white;
    padding: 14px 16px; display: flex; align-items: center; justify-content: space-between;
}
.live-chat__head-info { display: flex; align-items: center; gap: 10px; }
.live-chat__head-info strong { font-size: 0.82rem; }
.live-chat__avatar { width: 36px; height: 36px; border-radius: 50%; background: rgba(255,255,255,0.2); display: flex; align-items: center; justify-content: center; font-size: 1.2rem; }
.live-chat__status { color: #A5D6A7; font-size: 0.65rem; }
.live-chat__head button { background: none; border: none; color: white; cursor: pointer; font-size: 1rem; }
.live-chat__body {
    flex: 1; padding: 14px; overflow-y: auto; min-height: 180px; max-height: 220px;
    display: flex; flex-direction: column; gap: 10px; background: #f5f5f5;
}
.chat-msg { max-width: 85%; }
.chat-msg span {
    display: inline-block; padding: 8px 12px; border-radius: 14px;
    font-size: 0.78rem; line-height: 1.4;
}
.chat-msg--bot { align-self: flex-start; }
.chat-msg--bot span { background: var(--white); color: var(--text); border-bottom-left-radius: 4px; }
.chat-msg--user { align-self: flex-end; }
.chat-msg--user span { background: #2E7D32; color: white; border-bottom-right-radius: 4px; }
.live-chat__quick {
    display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 14px;
    background: #f5f5f5; border-top: 1px solid var(--border);
}
.live-chat__quick button {
    padding: 5px 10px; border-radius: var(--radius-full); border: 1px solid var(--border);
    background: var(--white); font-size: 0.65rem; cursor: pointer; font-family: var(--font-body);
    color: var(--text-mid); transition: all 0.15s ease;
}
.live-chat__quick button:hover { border-color: #2E7D32; color: #2E7D32; }
.live-chat__input {
    display: flex; gap: 6px; padding: 10px 14px; border-top: 1px solid var(--border); background: var(--white);
}
.live-chat__input input {
    flex: 1; padding: 8px 12px; border: 1px solid var(--border); border-radius: var(--radius-full);
    font-size: 0.78rem; font-family: var(--font-body); outline: none;
}
.live-chat__input input:focus { border-color: #2E7D32; }
.live-chat__input button {
    width: 36px; height: 36px; border-radius: 50%; border: none;
    background: #2E7D32; color: white; cursor: pointer; display: flex;
    align-items: center; justify-content: center; font-size: 0.8rem;
}

/* CHAT TRIGGER BUTTON */
.live-chat-trigger {
    position: fixed; bottom: 24px; left: 20px; z-index: 9997;
    width: 52px; height: 52px; border-radius: 50%; border: none;
    background: linear-gradient(135deg, #2E7D32, #43A047); color: white;
    cursor: pointer; box-shadow: 0 4px 20px rgba(46,125,50,0.4);
    display: flex; align-items: center; justify-content: center;
    font-size: 1.3rem; transition: all 0.2s ease;
}
.live-chat-trigger:hover { transform: scale(1.1); }
.live-chat-trigger__badge {
    position: absolute; top: -2px; right: -2px; width: 18px; height: 18px;
    border-radius: 50%; background: var(--cta); color: white; font-size: 0.6rem;
    font-weight: 800; display: flex; align-items: center; justify-content: center;
}
@media (max-width: 768px) {
    .live-chat { width: calc(100% - 20px); left: 10px; right: 10px; bottom: 80px; }
    .live-chat-trigger { bottom: 80px; left: 16px; }
}

/* ============================================
   GIFT CARD MODAL
   ============================================ */
.giftcard-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.5); z-index: 1199; }
.giftcard-overlay.hidden { display: none; }
.giftcard-modal {
    position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);
    background: var(--white); border-radius: var(--radius-2xl);
    width: 90%; max-width: 400px; padding: 32px; z-index: 1200;
    text-align: center; box-shadow: 0 20px 60px rgba(0,0,0,0.2);
    animation: popIn 0.4s var(--ease-bounce);
}
.giftcard-modal.hidden { display: none; }
.giftcard-modal__close { position: absolute; top: 12px; right: 12px; background: rgba(0,0,0,0.06); border: none; border-radius: var(--radius-full); width: 32px; height: 32px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.giftcard-modal__emoji { font-size: 3rem; margin-bottom: 8px; }
.giftcard-modal__title { font-family: var(--font-display); font-size: 1.2rem; font-weight: 700; margin-bottom: 4px; }
.giftcard-modal__text { font-size: 0.82rem; color: var(--text-mid); margin-bottom: 16px; }
.giftcard-modal__amounts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 14px; }
.giftcard-amt {
    padding: 12px; border: 2px solid var(--border); border-radius: var(--radius-md);
    background: none; cursor: pointer; font-size: 0.88rem; font-weight: 800;
    font-family: var(--font-body); color: var(--text); transition: all 0.2s ease;
}
.giftcard-amt:hover, .giftcard-amt.active { border-color: var(--sage); background: var(--sage-light); color: var(--sage-dark); }
.giftcard-modal__recipient, .giftcard-modal__msg {
    width: 100%; padding: 10px 14px; border: 1.5px solid var(--border); border-radius: var(--radius-md);
    font-size: 0.82rem; font-family: var(--font-body); margin-bottom: 10px; resize: none;
    box-sizing: border-box;
}
.giftcard-modal__recipient:focus, .giftcard-modal__msg:focus { border-color: var(--sage); outline: none; }

/* ============================================
   Q&A ASK MODAL
   ============================================ */
.qa-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.5); z-index: 1199; }
.qa-overlay.hidden { display: none; }
.qa-modal {
    position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);
    background: var(--white); border-radius: var(--radius-2xl);
    width: 90%; max-width: 420px; padding: 28px; z-index: 1200;
    box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: popIn 0.4s var(--ease-bounce);
}
.qa-modal.hidden { display: none; }
.qa-modal__close { position: absolute; top: 12px; right: 12px; background: rgba(0,0,0,0.06); border: none; border-radius: var(--radius-full); width: 32px; height: 32px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.qa-modal__title { font-family: var(--font-display); font-size: 1.1rem; font-weight: 700; display: flex; align-items: center; gap: 8px; margin-bottom: 14px; }
.qa-modal__title i { color: var(--sage); }
.qa-modal__input {
    width: 100%; padding: 12px 14px; border: 1.5px solid var(--border); border-radius: var(--radius-md);
    font-size: 0.82rem; font-family: var(--font-body); margin-bottom: 12px; resize: none; box-sizing: border-box;
}
.qa-modal__input:focus { border-color: var(--sage); outline: none; }

/* ============================================
   RECENTLY SEARCHED
   ============================================ */
.search-recent { margin-top: 12px; padding: 0 24px; }
.search-recent__title { font-size: 0.72rem; font-weight: 700; color: var(--text-light); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 6px; }
.search-recent__item {
    display: flex; align-items: center; gap: 8px; padding: 8px 0;
    border-bottom: 1px solid var(--border); cursor: pointer; font-size: 0.82rem;
    color: var(--text); transition: color 0.15s ease;
}
.search-recent__item:hover { color: var(--sage-dark); }
.search-recent__item i { color: var(--text-light); font-size: 0.7rem; }
.search-recent__clear {
    display: inline-block; margin-top: 6px; font-size: 0.68rem; color: var(--cta);
    cursor: pointer; font-weight: 600;
}

/* ============================================
   PROFESSIONAL POLISH
   ============================================ */

/* Product Card Image Zoom on Hover */
.p-card__img-wrap img { transition: transform 0.5s var(--ease); }
.p-card:hover .p-card__img-wrap img { transform: scale(1.06); }

/* Stagger animation for product cards */
.p-card { animation: cardFadeUp 0.5s ease both; }
.p-card:nth-child(1) { animation-delay: 0.05s; }
.p-card:nth-child(2) { animation-delay: 0.1s; }
.p-card:nth-child(3) { animation-delay: 0.15s; }
.p-card:nth-child(4) { animation-delay: 0.2s; }
.p-card:nth-child(5) { animation-delay: 0.25s; }
.p-card:nth-child(6) { animation-delay: 0.3s; }
.p-card:nth-child(7) { animation-delay: 0.35s; }
.p-card:nth-child(8) { animation-delay: 0.4s; }
@keyframes cardFadeUp {
    from { opacity: 0; transform: translateY(24px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Skeleton loading shimmer for images */
.p-card__img-wrap { position: relative; overflow: hidden; }
.p-card__img-wrap::before {
    content: ''; position: absolute; inset: 0; z-index: 1;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.4), transparent);
    animation: shimmer 1.5s infinite; opacity: 0;
    pointer-events: none;
}
.p-card__img-wrap img[loading="lazy"]:not([complete])::before { opacity: 1; }
@keyframes shimmer { from { transform: translateX(-100%); } to { transform: translateX(100%); } }

/* Focus-visible accessibility */
*:focus-visible {
    outline: 2px solid var(--sage);
    outline-offset: 2px;
    border-radius: 4px;
}
button:focus:not(:focus-visible), a:focus:not(:focus-visible) { outline: none; }

/* Custom global scrollbar */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(124,154,142,0.3); border-radius: 8px; }
::-webkit-scrollbar-thumb:hover { background: rgba(124,154,142,0.5); }

/* Selection color */
::selection { background: var(--sage-light); color: var(--sage-dark); }
::-moz-selection { background: var(--sage-light); color: var(--sage-dark); }

/* Smooth scroll snap for category strip */
.categories__grid { scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; }
.cat-card { scroll-snap-align: start; }

/* Better text rendering */
h1, h2, h3, h4, h5, h6 { text-rendering: optimizeLegibility; }

/* Reduced motion preference */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* Toast improvements */
.toast { }

/* Image loading state */
img { transition: opacity 0.3s ease; }
img[loading="lazy"] { opacity: 1; }
img[loading="lazy"].is-loading { opacity: 0; }

/* Hero parallax hint */
.hero { overflow: hidden; }

/* Satisfaction banner pulse */
.satisfaction-banner { position: relative; overflow: hidden; }
.satisfaction-banner::after {
    content: ''; position: absolute; top: 0; left: -100%;
    width: 50%; height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.1), transparent);
    animation: bannerShine 4s infinite;
}
@keyframes bannerShine { 0%, 100% { left: -100%; } 50% { left: 100%; } }

/* Cart item hover state */
.cart-item:hover { background: var(--bg-cream); }
.cart-item { transition: background 0.2s ease; }

/* Footer links hover underline */
.footer__col a { position: relative; display: block; width: fit-content; margin-bottom: 10px; }
.footer__col a::after {
    content: ''; position: absolute; bottom: -1px; left: 0;
    width: 0; height: 1.5px; background: var(--sage);
    transition: width 0.25s ease;
}
.footer__col a:hover::after { width: 100%; }

/* Trust badges pulse on view */
.pdp__promise { transition: transform 0.2s ease; }
.pdp__promise:hover { transform: translateY(-2px); }

/* Price highlight animation */
.p-card__price { transition: color 0.2s ease; }
.p-card:hover .p-card__price { color: var(--sage-dark); }

/* Better disabled state */
button:disabled {
    opacity: 0.5; cursor: not-allowed;
    filter: grayscale(0.3);
}

/* Print styles */
@media print {
    .header, .footer, .mobile-nav, .cookie-banner,
    .whatsapp-float, .scroll-top, .live-chat-trigger,
    .cart, .wishlist-sidebar, .overlay { display: none !important; }
    body { background: white !important; }
    .section-head { page-break-after: avoid; }
}

/* ============================================
   INSTALLMENT PAYMENT INFO
   ============================================ */
.pdp__installment {
    display: flex; align-items: center; gap: 8px;
    padding: 7px 10px; background: #FFF7EC; border-radius: 12px;
    font-size: 0.72rem; color: #A65320; margin: 0 0 8px;
    border: 1px solid rgba(230,81,0,0.08);
}
.pdp__installment img { height: 16px; width: auto; }
.pdp__installment strong { font-weight: 800; }

/* ============================================
   PRODUCT BADGES
   ============================================ */
.pdp__badges { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.pdp__badge {
    display: inline-flex; align-items: center; gap: 4px;
    padding: 4px 9px; border-radius: var(--radius-full);
    font-size: 0.64rem; font-weight: 750; letter-spacing: 0.3px;
}
.pdp__badge--eco { background: #E8F5E9; color: #2E7D32; }
.pdp__badge--award { background: #FFF8E1; color: #F57F17; }
.pdp__badge--doctor { background: #E3F2FD; color: #1565C0; }
.pdp__badge--new { background: #FCE4EC; color: #C62828; }
.pdp__badge--bestseller { background: var(--sage-light); color: var(--sage-dark); }

/* ============================================
   STOCK COUNTER PULSE
   ============================================ */
.pdp__stock { animation: stockPulse 2s ease-in-out infinite; }
@keyframes stockPulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(211,47,47,0.2); }
    50% { box-shadow: 0 0 0 8px rgba(211,47,47,0); }
}

/* ============================================
   ORDER HISTORY MODAL
   ============================================ */
.order-history-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.5); z-index: 1199; }
.order-history-overlay.hidden { display: none; }
.order-history {
    position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);
    background: var(--white); border-radius: var(--radius-2xl);
    width: 90%; max-width: 480px; max-height: 80vh; padding: 28px; z-index: 1200;
    box-shadow: 0 20px 60px rgba(0,0,0,0.2); overflow-y: auto;
    animation: popIn 0.4s var(--ease-bounce);
}
.order-history.hidden { display: none; }
.order-history__close { position: absolute; top: 12px; right: 12px; background: rgba(0,0,0,0.06); border: none; border-radius: var(--radius-full); width: 32px; height: 32px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.order-history__title { font-family: var(--font-display); font-size: 1.1rem; font-weight: 700; display: flex; align-items: center; gap: 8px; margin-bottom: 16px; }
.order-history__title i { color: var(--sage); }
.order-history__item {
    border: 1px solid var(--border); border-radius: var(--radius-lg);
    padding: 14px; margin-bottom: 10px; transition: box-shadow 0.2s ease;
}
.order-history__item:hover { box-shadow: var(--shadow-md); }
.order-history__empty { font-size: 0.9rem; line-height: 1.6; color: var(--text-mid); margin: 0; }
.order-history__empty a { color: var(--sage-dark); font-weight: 700; text-decoration: underline; }
.order-history__item-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.order-history__id { font-weight: 800; font-size: 0.82rem; color: var(--text); }
.order-history__status { font-size: 0.65rem; font-weight: 700; padding: 3px 8px; border-radius: var(--radius-full); display: inline-flex; align-items: center; gap: 4px; }
.order-history__status--delivered { background: #E8F5E9; color: #2E7D32; }
.order-history__status--shipped { background: #E3F2FD; color: #1565C0; }
.order-history__status--processing { background: #FFF8E1; color: #F57F17; }
.order-history__item-body { display: flex; justify-content: space-between; align-items: center; font-size: 0.82rem; margin-bottom: 8px; }
.order-history__item-foot { display: flex; justify-content: space-between; align-items: center; }
.order-history__item-foot small { color: var(--text-light); font-size: 0.7rem; }

/* ============================================
   PHOTO REVIEW LIGHTBOX
   ============================================ */
.photo-review-lightbox {
    position: fixed; inset: 0; z-index: 9999; background: rgba(0,0,0,0.9);
    display: flex; align-items: center; justify-content: center; cursor: pointer;
}
.photo-review-lightbox.hidden { display: none; }
.photo-review-lightbox img { max-width: 90%; max-height: 85vh; border-radius: var(--radius-lg); object-fit: contain; }
.photo-review-lightbox button {
    position: absolute; top: 20px; right: 20px; background: rgba(255,255,255,0.15);
    border: none; color: white; font-size: 1.2rem; width: 40px; height: 40px;
    border-radius: 50%; cursor: pointer; display: flex; align-items: center; justify-content: center;
}
.photo-review-lightbox button:hover { background: rgba(255,255,255,0.3); }

/* Photo reviews in PDP tab */
.review-photo-grid { display: flex; gap: 8px; margin-top: 8px; flex-wrap: wrap; }
.review-photo {
    width: 60px; height: 60px; border-radius: var(--radius-md); object-fit: cover;
    cursor: pointer; border: 2px solid transparent; transition: all 0.2s ease;
}
.review-photo:hover { border-color: var(--sage); transform: scale(1.08); }

/* ============================================
   SOCIAL PROOF LIVE TOAST
   ============================================ */
.social-proof-toast {
    position: fixed; bottom: 90px; left: 20px; z-index: 900;
    background: var(--white); border-radius: var(--radius-xl);
    box-shadow: 0 8px 32px rgba(0,0,0,0.12); border: 1px solid var(--border);
    padding: 12px 16px; display: flex; align-items: center; gap: 10px;
    max-width: 320px; cursor: pointer;
    opacity: 0; transform: translateY(30px) scale(0.95); pointer-events: none;
    transition: all 0.5s var(--ease-bounce);
}
.social-proof-toast.visible {
    opacity: 1; transform: translateY(0) scale(1); pointer-events: auto;
}
.social-proof-toast__avatar {
    width: 36px; height: 36px; border-radius: 50%;
    background: var(--sage-light); display: flex; align-items: center;
    justify-content: center; font-size: 0.9rem; flex-shrink: 0; overflow: hidden;
}
.social-proof-toast__avatar img {
    width: 100%; height: 100%; object-fit: cover; display: block;
}
.social-proof-toast__body { flex: 1; }
.social-proof-toast__name { font-size: 0.75rem; font-weight: 700; color: var(--text); }
.social-proof-toast__action { font-size: 0.68rem; color: var(--text-mid); }
.social-proof-toast__time { font-size: 0.6rem; color: var(--text-light); }
.social-proof-toast__verified { font-size: 0.6rem; color: #2E7D32; font-weight: 600; }
@keyframes socialProofIn {
    from { opacity: 0; transform: translateY(30px) scale(0.95); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}
@media (max-width: 768px) {
    .social-proof-toast { bottom: 80px; left: 10px; right: 10px; max-width: none; }
}

/* ============================================
   AI RECOMMENDATION CAROUSEL
   ============================================ */
.ai-reco {
    margin-top: 18px;
    padding: 14px 0 4px;
    max-width: 100%;
    overflow: hidden;
}
.ai-reco__title {
    font-size: 0.78rem; font-weight: 800; margin-bottom: 10px;
    display: flex; align-items: center; gap: 6px; color: var(--text);
    letter-spacing: 0.01em;
}
.ai-reco__title i { color: var(--sage); }
.ai-reco__list {
    display: grid;
    gap: 8px;
}
.ai-reco__card {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    cursor: pointer;
    border-radius: 16px;
    border: 1px solid var(--border);
    padding: 8px;
    text-align: left;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
    background: var(--white); box-sizing: border-box;
}
.ai-reco__card:hover { box-shadow: 0 8px 22px rgba(92,72,58,0.08); border-color: rgba(126,158,143,0.55); background: var(--bg-cream); }
.ai-reco__media { width: 58px; height: 58px; border-radius: 13px; }
.ai-reco__body { min-width: 0; }
.ai-reco__name { font-size: 0.76rem; font-weight: 750; color: var(--text); line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ai-reco__price { font-size: 0.8rem; font-weight: 850; color: var(--sage-dark); margin-top: 4px; }

/* ============================================
   360° VIEWER INDICATOR
   ============================================ */
.pdp__360-indicator {
    position: absolute; bottom: 12px; left: 50%; transform: translateX(-50%);
    background: rgba(0,0,0,0.6); color: white; font-size: 0.65rem;
    font-weight: 700; padding: 4px 12px; border-radius: var(--radius-full);
    display: flex; align-items: center; gap: 4px; pointer-events: none;
}
.pdp__360-indicator i { animation: spin360 3s linear infinite; }
@keyframes spin360 { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

/* (Dark Mode block 2 removed — unified in main block above) */

/* ============================================
   EXIT INTENT POPUP
   ============================================ */
.exit-intent-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.6); z-index: 1299; }
.exit-intent-overlay.hidden { display: none; }
.exit-intent {
    position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);
    background: var(--white); border-radius: var(--radius-2xl);
    width: 90%; max-width: 420px; padding: 32px; z-index: 1300;
    box-shadow: 0 20px 60px rgba(0,0,0,0.25); text-align: center;
    animation: popIn 0.5s var(--ease-bounce);
}
.exit-intent.hidden { display: none; }
.exit-intent__close { position: absolute; top: 12px; right: 12px; background: rgba(0,0,0,0.06); border: none; border-radius: 50%; width: 32px; height: 32px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.exit-intent__emoji { font-size: 3rem; margin-bottom: 8px; }
.exit-intent__title { font-family: var(--font-display); font-size: 1.3rem; font-weight: 800; margin-bottom: 6px; }
.exit-intent__text { font-size: 0.85rem; color: var(--text-mid); margin-bottom: 16px; }
.exit-intent__text strong { color: var(--cta); font-size: 1.1rem; }
.exit-intent__form { display: flex; gap: 8px; margin-bottom: 10px; }
.exit-intent__form input {
    flex: 1; padding: 10px 14px; border: 2px solid var(--border);
    border-radius: var(--radius-md); font-size: 0.82rem; font-family: inherit;
    transition: border-color 0.2s;
}
.exit-intent__form input:focus { border-color: var(--sage); outline: none; }
.exit-intent__note { font-size: 0.65rem; color: var(--text-light); }

/* ============================================
   COUNTDOWN TIMER BANNER
   ============================================ */
.countdown-banner {
    position: fixed; bottom: 0; left: 0; right: 0; z-index: 800;
    background: linear-gradient(135deg, #1a1a2e, #2d1b4e);
    color: white; padding: 10px 0;
    box-shadow: 0 -4px 20px rgba(0,0,0,0.2);
}
.countdown-banner__inner {
    max-width: 1240px; margin: 0 auto; padding: 0 24px;
    display: flex; align-items: center; justify-content: center; gap: 20px; flex-wrap: wrap;
}
.countdown-banner__text { font-size: 0.82rem; display: flex; align-items: center; gap: 6px; }
.countdown-banner__text i { color: #FF6B35; }
.countdown-banner__timer { display: flex; align-items: center; gap: 4px; }
.countdown-unit { text-align: center; }
.countdown-unit span {
    display: block; font-size: 1.3rem; font-weight: 800;
    background: rgba(255,255,255,0.12); padding: 4px 10px; border-radius: var(--radius-md);
    min-width: 42px; font-variant-numeric: tabular-nums;
}
.countdown-unit small { font-size: 0.55rem; text-transform: uppercase; letter-spacing: 1px; opacity: 0.7; margin-top: 2px; display: block; }
.countdown-sep { font-size: 1.2rem; font-weight: 800; margin: 0 2px; opacity: 0.6; }
@media (max-width: 768px) {
    .countdown-banner__inner { gap: 10px; }
    .countdown-unit span { font-size: 1rem; padding: 3px 8px; min-width: 34px; }
}

/* ============================================
   SATISFACTION SURVEY
   ============================================ */
.survey-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.5); z-index: 1199; }
.survey-overlay.hidden { display: none; }
.survey {
    position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);
    background: var(--white); border-radius: var(--radius-2xl);
    width: 90%; max-width: 380px; padding: 28px; z-index: 1200;
    box-shadow: 0 20px 60px rgba(0,0,0,0.2); text-align: center;
    animation: popIn 0.4s var(--ease-bounce);
}
.survey.hidden { display: none; }
.survey__close { position: absolute; top: 12px; right: 12px; background: rgba(0,0,0,0.06); border: none; border-radius: 50%; width: 32px; height: 32px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.survey__emoji { font-size: 2.5rem; margin-bottom: 6px; }
.survey__title { font-family: var(--font-display); font-size: 1.1rem; font-weight: 700; margin-bottom: 4px; }
.survey__text { font-size: 0.78rem; color: var(--text-mid); margin-bottom: 14px; }
.survey__stars { display: flex; justify-content: center; gap: 6px; margin-bottom: 14px; }
.survey__stars button {
    background: none; border: none; font-size: 1.6rem; cursor: pointer;
    transition: transform 0.15s ease; opacity: 0.4;
}
.survey__stars button:hover, .survey__stars button.active { opacity: 1; transform: scale(1.25); }
.survey__comment {
    width: 100%; padding: 10px; border: 2px solid var(--border);
    border-radius: var(--radius-md); font-family: inherit; font-size: 0.78rem;
    resize: none; margin-bottom: 12px;
}
.survey__comment:focus { border-color: var(--sage); outline: none; }

/* ============================================
   FLY-TO-CART ANIMATION
   ============================================ */
.fly-cart-item {
    position: fixed; z-index: 9999; pointer-events: none;
    width: 40px; height: 40px; border-radius: 50%;
    background: var(--sage-light); display: flex; align-items: center;
    justify-content: center; font-size: 1.2rem;
    opacity: 0; transition: none;
}
.fly-cart-item.flying {
    animation: flyToCart 0.7s var(--ease) forwards;
}
@keyframes flyToCart {
    0% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.8; transform: scale(0.6) translateY(-80px); }
    100% { opacity: 0; transform: scale(0.2) translate(300px, -200px); }
}

/* ============================================
   PRICE DROP ALERT
   ============================================ */
.pdp__price-alert {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 6px 14px; border: 1.5px dashed var(--sage);
    border-radius: var(--radius-full); background: transparent;
    font-size: 0.72rem; font-weight: 600; color: var(--sage-dark);
    cursor: pointer; transition: all 0.2s ease; margin-top: 8px;
}
.pdp__price-alert:hover { background: var(--sage-light); border-style: solid; }
.pdp__price-alert.active { background: var(--sage-light); border-color: var(--sage-dark); border-style: solid; }
.pdp__price-alert.active i { color: var(--cta); }

/* ============================================
   BLOG / PARENTING TIPS
   ============================================ */
.blog-tips { padding: 60px 0; }
.blog-tips__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.blog-card {
    background: var(--white); border-radius: var(--radius-xl);
    padding: 24px; border: 1px solid var(--border);
    transition: all 0.3s ease; cursor: pointer;
}
.blog-card:hover { box-shadow: var(--shadow-lg); transform: translateY(-4px); }
.blog-card__emoji { font-size: 2.2rem; margin-bottom: 10px; }
.blog-card__tag {
    display: inline-block; padding: 3px 10px; border-radius: var(--radius-full);
    background: var(--sage-light); color: var(--sage-dark);
    font-size: 0.62rem; font-weight: 700; letter-spacing: 0.3px; margin-bottom: 10px;
}
.blog-card__title { font-family: var(--font-display); font-size: 0.95rem; font-weight: 700; margin-bottom: 8px; line-height: 1.3; }
.blog-card__excerpt { font-size: 0.75rem; color: var(--text-mid); line-height: 1.5; margin-bottom: 12px; }
.blog-card__foot {
    display: flex; justify-content: space-between; align-items: center;
    font-size: 0.7rem; color: var(--text-light);
}
.blog-card__foot a { color: var(--sage-dark); font-weight: 700; }
.blog-card__foot a:hover { color: var(--cta); }
@media (max-width: 768px) {
    .blog-tips__grid { grid-template-columns: 1fr; gap: 16px; }
}

/* ============================================
   LOYALTY POINTS DISPLAY
   ============================================ */
.loyalty-badge {
    display: inline-flex; align-items: center; gap: 4px;
    padding: 3px 10px; border-radius: var(--radius-full);
    background: linear-gradient(135deg, #FFD700, #FFA000);
    color: #5D4037; font-size: 0.6rem; font-weight: 800;
    letter-spacing: 0.3px; position: relative; overflow: hidden;
}
.loyalty-badge::after {
    content: ''; position: absolute; top: 0; left: -100%; width: 50%; height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent);
    animation: loyaltyShine 3s infinite;
}
@keyframes loyaltyShine { 0%, 100% { left: -100%; } 50% { left: 100%; } }

/* Dark mode additions */
body.dark-mode .exit-intent { background: #1a1a2e; }
body.dark-mode .survey { background: #1a1a2e; }
body.dark-mode .blog-card { background: #1e1e32; border-color: #2a2a40; }
body.dark-mode .blog-card__tag { background: #2a2a40; }
body.dark-mode .countdown-banner { background: linear-gradient(135deg, #0f0f1a, #1a0a2e); }

/* Mobile: hide countdown on small screens to avoid overlay conflict */
@media (max-width: 480px) {
    .countdown-banner { position: relative; bottom: auto; }
}

/* Cookie banner above countdown timer */
.cookie-banner { z-index: 900 !important; position: relative; }

/* Countdown banner close button */
.countdown-banner__close {
    background: none; border: none; color: rgba(255,255,255,0.7);
    font-size: 1rem; cursor: pointer; padding: 4px 8px;
    transition: color 0.2s, transform 0.2s; margin-left: 8px;
}
.countdown-banner__close:hover { color: #fff; transform: scale(1.2); }
.countdown-banner.hidden { display: none; }

/* Language dropdown wider for more items */
.lang-switcher__dropdown { min-width: 150px; max-height: 300px; overflow-y: auto; }
.lang-switcher__dropdown button { white-space: nowrap; }

/* ============================================
   LAYOUT CONFLICT FIXES (Cart / Compare / Flash Sale)
   ============================================ */

/* Cart and wishlist sidebars must be above everything including flash banner */
.cart { z-index: 2001 !important; }
#cart-overlay, #notif-overlay { z-index: 2000 !important; }
.wishlist-sidebar { z-index: 2001 !important; }
#wishlist-overlay { z-index: 2000 !important; }

/* Flash sale countdown banner — keep z-index below cart */
.countdown-banner { z-index: 900 !important; }

/* Cart sidebar content — add bottom padding so checkout button isn't hidden behind flash sale */
.cart { padding-bottom: 0; }
.cart__footer { padding-bottom: 16px; }

/* Sales popup — position above the flash sale banner */
.sales-popup {
    bottom: 80px !important;
    left: 20px !important;
    z-index: 1050 !important;
}

@media (max-width: 768px) {
    .sales-popup { bottom: 110px !important; left: 10px !important; right: 10px !important; }
}

/* ============================================
   CUSTOMER ACCOUNT MODAL
   ============================================ */
.account-modal-overlay {
    position: fixed; inset: 0; background: rgba(0,0,0,0.4); z-index: 10000;
    backdrop-filter: blur(2px); transition: opacity 0.3s ease;
}
.account-modal-overlay.hidden { display: none; }
.account-modal {
    position: fixed; top: 0; right: -480px; width: 460px; max-width: 100%; height: 100%;
    background: var(--white); z-index: 10001; display: flex; flex-direction: column;
    transition: right 0.4s var(--ease); box-shadow: -8px 0 40px rgba(0,0,0,0.1);
}
.account-modal.active { right: 0; }
.account-modal__head {
    display: flex; justify-content: space-between; align-items: center;
    padding: 20px 24px; border-bottom: 1px solid var(--border);
}
.account-modal__head h3 { font-family: var(--font-display); font-size: 1.15rem; display: flex; align-items: center; gap: 8px; }
.account-modal__head button { font-size: 1.1rem; color: var(--text-light); padding: 6px; transition: color var(--duration); }
.account-modal__body { flex: 1; overflow-y: auto; padding: 24px; }
.account-modal__tabs { display: flex; gap: 0; margin-bottom: 24px; }
.account-modal__tab {
    flex: 1; padding: 12px; text-align: center; font-weight: 600; font-size: 0.9rem;
    border-bottom: 2px solid var(--border); cursor: pointer; color: var(--text-light);
    transition: all var(--duration);
}
.account-modal__tab.active { border-color: var(--cta); color: var(--cta); }
.account-modal .form-group { margin-bottom: 16px; }
.account-modal .form-group label { display: block; font-size: 0.82rem; font-weight: 600; margin-bottom: 6px; color: var(--text-mid); }
.account-modal .form-group input {
    width: 100%; padding: 12px 16px; border: 1.5px solid var(--border);
    border-radius: var(--radius-md); font-size: 0.92rem; outline: none;
    transition: border-color var(--duration);
}
.account-modal .form-group input:focus { border-color: var(--cta); }
.account-modal .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.account-modal .form-group select {
    width: 100%; padding: 12px 16px; border: 1.5px solid var(--border);
    border-radius: var(--radius-md); font-size: 0.92rem; outline: none;
    background: var(--white); transition: border-color var(--duration);
}
.account-modal .divider { text-align: center; color: var(--text-light); font-size: 0.82rem; margin: 20px 0; position: relative; }
.account-modal .divider::before, .account-modal .divider::after {
    content: ''; position: absolute; top: 50%; width: 40%; height: 1px; background: var(--border);
}
.account-modal .divider::before { left: 0; }
.account-modal .divider::after { right: 0; }

/* Account Dashboard */
.account-dashboard__welcome { margin-bottom: 24px; }
.account-dashboard__welcome h3 { font-family: var(--font-display); font-size: 1.3rem; }
.account-dashboard__welcome p { color: var(--text-mid); font-size: 0.9rem; }
.account-dashboard__stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 24px; }
.account-dashboard__stat {
    text-align: center; padding: 16px; background: var(--bg-alt);
    border-radius: var(--radius-lg);
}
.account-dashboard__stat strong { display: block; font-size: 1.3rem; color: var(--cta); font-family: var(--font-display); }
.account-dashboard__stat span { font-size: 0.75rem; color: var(--text-light); }
.account-dashboard__menu a {
    display: flex; align-items: center; gap: 12px; padding: 14px 16px;
    border-radius: var(--radius-md); transition: background var(--duration);
    font-weight: 500; font-size: 0.92rem;
}
.account-dashboard__menu a:hover { background: var(--bg-alt); }
.account-dashboard__menu a i { width: 20px; color: var(--cta); }

/* Referral Section */
.referral-section { padding: 60px 0; background: var(--bg-alt); }
.referral-card {
    background: linear-gradient(135deg, var(--sage-light), var(--clay-light));
    border-radius: var(--radius-2xl); padding: 48px; text-align: center;
    max-width: 700px; margin: 0 auto;
}
.referral-card__emoji { font-size: 3rem; margin-bottom: 16px; }
.referral-card h2 { font-family: var(--font-display); font-size: 1.8rem; margin-bottom: 8px; }
.referral-card p { color: var(--text-mid); font-size: 0.95rem; margin-bottom: 24px; }
.referral-card__code {
    display: inline-flex; align-items: center; gap: 12px;
    background: var(--white); padding: 14px 24px; border-radius: var(--radius-full);
    box-shadow: var(--shadow-md); margin-bottom: 16px;
}
.referral-card__code span { font-family: var(--font-display); font-size: 1.3rem; font-weight: 700; color: var(--cta); letter-spacing: 2px; }
.referral-card__code button { background: var(--cta); color: var(--white); padding: 8px 16px; border-radius: var(--radius-full); font-size: 0.82rem; font-weight: 600; transition: background var(--duration); }
.referral-card__code button:hover { background: var(--cta-hover); }
.referral-card__benefits { display: flex; justify-content: center; gap: 32px; margin-top: 20px; }
.referral-card__benefit { text-align: center; }
.referral-card__benefit strong { display: block; font-size: 1.1rem; color: var(--cta); }
.referral-card__benefit span { font-size: 0.82rem; color: var(--text-mid); }

/* Blog Section */
.blog-section { padding: 60px 0; }
.blog-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.blog-card {
    background: var(--white); border-radius: var(--radius-xl); overflow: hidden;
    border: 1px solid var(--border); transition: all var(--duration) var(--ease-bounce);
}
.blog-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-xl); border-color: transparent; }
.blog-card__img {
    height: 180px; display: flex; align-items: center; justify-content: center;
    font-size: 4rem; background: linear-gradient(135deg, var(--sage-light), var(--clay-light));
}
.blog-card__body { padding: 20px; }
.blog-card__tag {
    display: inline-block; background: var(--cta-light); color: var(--cta);
    padding: 4px 12px; border-radius: var(--radius-full);
    font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px;
    margin-bottom: 8px;
}
.blog-card__title { font-family: var(--font-display); font-size: 1.1rem; font-weight: 700; margin-bottom: 8px; line-height: 1.3; }
.blog-card__excerpt { color: var(--text-mid); font-size: 0.88rem; line-height: 1.6; margin-bottom: 12px; }
.blog-card__meta { display: flex; justify-content: space-between; align-items: center; }
.blog-card__date { font-size: 0.78rem; color: var(--text-light); }
.blog-card__read { font-size: 0.82rem; font-weight: 600; color: var(--cta); transition: color var(--duration); }
.blog-card__read:hover { color: var(--cta-hover); }

/* Wishlist Heart */
.p-card__wishlist {
    position: absolute; top: 14px; right: 14px; z-index: 4;
    width: 36px; height: 36px; border-radius: var(--radius-full);
    background: rgba(255,255,255,0.9); display: flex; align-items: center; justify-content: center;
    font-size: 0.9rem; color: var(--text-light); transition: all var(--duration);
    box-shadow: var(--shadow-sm); backdrop-filter: blur(4px);
}
.p-card__wishlist:hover { color: #e74c3c; transform: scale(1.1); }
.p-card__wishlist.active { color: #e74c3c; }
.p-card__wishlist.active i { font-weight: 900; }

/* Trust Badges (US-focused) */
.us-trust-bar { padding: 20px 0; background: var(--white); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.us-trust-bar__inner {
    max-width: 1240px; margin: 0 auto; padding: 0 24px;
    display: flex; justify-content: space-between; align-items: center;
}
.us-trust-bar__item { display: flex; align-items: center; gap: 8px; font-size: 0.82rem; font-weight: 600; color: var(--text-mid); }
.us-trust-bar__item i { font-size: 1.1rem; }
.us-trust-bar__item .fa-shield-alt { color: #27ae60; }
.us-trust-bar__item .fa-truck { color: #3498db; }
.us-trust-bar__item .fa-undo { color: #e67e22; }
.us-trust-bar__item .fa-headset { color: #9b59b6; }
.us-trust-bar__item .fa-lock { color: #2ecc71; }

/* Gift Finder Bubble */
.gift-finder-bubble {
    position: fixed; bottom: 76px; right: 24px; z-index: 1001;
    display: flex; align-items: center; gap: 9px;
    background: linear-gradient(135deg, #fffaf4, #ffffff);
    color: var(--text);
    border: 1px solid rgba(196,149,106,0.34);
    padding: 8px 13px 8px 9px;
    border-radius: 999px;
    box-shadow: 0 14px 34px rgba(47,41,38,0.12);
    cursor: pointer;
    transition: all var(--duration) var(--ease);
}
.gift-finder-bubble:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 42px rgba(47,41,38,0.16);
    border-color: rgba(123,81,71,0.34);
}
.gift-finder-bubble__icon {
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: linear-gradient(135deg, #7b5147, #c4725c);
    color: white;
    font-size: 0.94rem;
    flex: 0 0 auto;
}
.gift-finder-bubble__copy {
    display: flex;
    flex-direction: column;
    line-height: 1.05;
}
.gift-finder-bubble__text {
    font-size: 0.78rem;
    font-weight: 900;
    color: var(--text);
}
.gift-finder-bubble__copy small {
    margin-top: 3px;
    color: var(--text-light);
    font-size: 0.66rem;
    font-weight: 700;
}

/* Live Chat Bubble */
.chat-bubble {
    position: fixed; bottom: 10px; right: 22px; z-index: 1001;
    width: 56px; height: 56px; border-radius: var(--radius-full);
    background: linear-gradient(135deg, var(--cta), var(--blush));
    color: var(--white); display: flex; align-items: center; justify-content: center;
    font-size: 1.28rem; box-shadow: 0 10px 26px rgba(196,114,92,0.28);
    cursor: pointer; transition: all var(--duration) var(--ease);
}
.chat-bubble:hover { transform: translateY(-2px); box-shadow: 0 14px 34px rgba(196,114,92,0.36); }
@keyframes chatPulse {
    0%, 100% { box-shadow: 0 6px 24px rgba(196,114,92,0.4); }
    50% { box-shadow: 0 6px 24px rgba(196,114,92,0.6), 0 0 0 8px rgba(196,114,92,0.1); }
}
.chat-bubble__badge {
    position: absolute; top: -2px; right: -2px;
    width: 16px; height: 16px; background: #27ae60; border-radius: var(--radius-full);
    border: 2px solid var(--white);
    display: none;
    align-items: center;
    justify-content: center;
    font-size: 0.62rem;
    font-weight: 800;
}

/* Chat Panel (Persistent Messenger) */
.aylemu-chat-panel {
    position: fixed;
    bottom: 88px;
    right: 22px;
    width: min(360px, calc(100vw - 32px));
    height: min(430px, calc(100dvh - 126px));
    background: linear-gradient(180deg, #fff, #fffaf6);
    border-radius: 24px;
    z-index: 1050;
    box-shadow: 0 24px 70px rgba(48,36,28,0.20), 0 0 0 1px rgba(255,255,255,0.65) inset;
    border: 1px solid rgba(196,149,106,0.24);
    display: none;
    flex-direction: column;
    overflow: hidden;
    animation: chatPanelIn 0.18s ease-out;
}
.aylemu-chat-panel__header {
    background: linear-gradient(135deg, #3a2d29, #7b5147 58%, #c4725c);
    color: white;
    padding: 13px 14px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-shrink: 0;
}
.aylemu-chat-panel__header-info { display: flex; align-items: center; gap: 10px; min-width: 0; }
.aylemu-chat-panel__tools { display: flex; align-items: center; gap: 6px; }
.aylemu-chat-panel__avatar {
    width: 36px; height: 36px; background: rgba(255,255,255,0.22);
    border-radius: 50%; display: flex; align-items: center;
    justify-content: center; font-size: 1.1rem; flex-shrink: 0;
    box-shadow: 0 0 0 4px rgba(255,255,255,0.08);
}
.aylemu-chat-panel__name { font-weight: 800; font-size: 0.9rem; }
.aylemu-chat-panel__status { font-size: 0.68rem; opacity: 0.86; }
.aylemu-chat-panel--handoff .aylemu-chat-panel__status::after {
    content: ' · Support notified';
    font-weight: 800;
}
.aylemu-chat-panel__close {
    width: 32px;
    height: 32px;
    border-radius: 999px;
    background: rgba(255,255,255,0.12);
    border: 1px solid rgba(255,255,255,0.16);
    color: white;
    font-size: 0.9rem;
    cursor: pointer;
}
.aylemu-chat-panel__body {
    flex: 1;
    overflow-y: auto;
    padding: 14px;
    background: linear-gradient(180deg, #faf8f6, #fff);
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.aylemu-chat-panel__footer {
    padding: 12px;
    border-top: 1px solid #eee;
    display: flex;
    gap: 8px;
    background: #fff;
    flex-shrink: 0;
}
.aylemu-chat-panel__input {
    flex: 1;
    padding: 10px 14px;
    border: 1.5px solid var(--border);
    border-radius: 24px;
    outline: none;
    font-size: 0.88rem;
    font-family: var(--font-body);
}
.aylemu-chat-panel__input:focus { border-color: var(--cta); }
.aylemu-chat-panel__send {
    width: 42px; height: 42px; border-radius: 50%;
    background: var(--cta); color: white; border: none;
    cursor: pointer; display: flex; align-items: center;
    justify-content: center; font-size: 0.9rem; flex-shrink: 0;
    transition: background 0.2s;
}
.aylemu-chat-panel__send:hover { background: var(--cta-hover); }
.aylemu-chat-panel__send:disabled,
.aylemu-chat-panel__send.is-sending {
    opacity: 0.68;
    cursor: wait;
}
.aylemu-chat-panel__send.is-sending i {
    animation: chatSendSpin 0.8s linear infinite;
}
@keyframes chatSendSpin {
    to { transform: rotate(360deg); }
}

.chat-msg { display: flex; flex-direction: column; max-width: 85%; }
.chat-msg--admin { align-self: flex-start; }
.chat-msg--bot { align-self: flex-start; }
.chat-msg--system { align-self: center; max-width: 94%; }
.chat-msg--customer { align-self: flex-end; }
.chat-msg__bubble {
    padding: 10px 13px; border-radius: 16px; font-size: 0.86rem; line-height: 1.42;
    word-wrap: break-word;
}
.chat-msg--admin .chat-msg__bubble { background: var(--bg-alt); color: var(--text); border-bottom-left-radius: 4px; }
.chat-msg--bot .chat-msg__bubble { background: #fff; color: var(--text); border: 1px solid rgba(196,149,106,0.24); border-bottom-left-radius: 4px; box-shadow: 0 8px 22px rgba(47,41,38,0.05); }
.chat-msg--system .chat-msg__bubble { background: rgba(123,81,71,0.08); color: var(--text-light); border-radius: 999px; font-size: 0.76rem; padding: 7px 12px; }
.chat-msg--customer .chat-msg__bubble { background: var(--cta); color: white; border-bottom-right-radius: 4px; }
.chat-msg__time { font-size: 0.68rem; color: var(--text-light); margin-top: 4px; }
.chat-msg--customer .chat-msg__time { text-align: right; }

.chat-live-notice {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 11px 12px;
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(132,162,141,0.18), rgba(255,255,255,0.94));
    border: 1px solid rgba(132,162,141,0.28);
    color: var(--text);
    box-shadow: 0 10px 24px rgba(47,41,38,0.05);
}
.chat-live-notice i {
    width: 34px;
    height: 34px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--sage);
    color: white;
    flex: 0 0 auto;
}
.chat-live-notice strong {
    display: block;
    font-size: 0.84rem;
    font-weight: 900;
}
.chat-live-notice span {
    display: block;
    margin-top: 2px;
    font-size: 0.72rem;
    color: var(--text-light);
    font-weight: 700;
}

.chat-welcome {
    background: linear-gradient(180deg, #fff, #fffaf6);
    border: 1px solid rgba(196,149,106,0.22);
    border-radius: 20px;
    padding: 14px;
    box-shadow: 0 14px 34px rgba(47,41,38,0.06);
}
.chat-welcome__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--cta);
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-bottom: 6px;
}
.chat-welcome__eyebrow span {
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: #22c55e;
    box-shadow: 0 0 0 4px rgba(34,197,94,0.12);
}
.chat-welcome strong {
    display: block;
    color: var(--text);
    font-size: 0.88rem;
    line-height: 1.38;
}
.chat-welcome__sub {
    display: block;
    margin-top: 5px;
    color: var(--text-light);
    font-size: 0.74rem;
    line-height: 1.35;
}
.chat-support-note {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-top: 9px;
    padding: 8px 10px;
    border-radius: 12px;
    background: rgba(123,81,71,0.07);
    color: var(--text);
    font-size: 0.74rem;
    font-weight: 700;
}
.chat-support-note i { color: var(--cta); }
.chat-quick-actions {
    display: flex;
    gap: 7px;
    flex-wrap: wrap;
    margin-top: 11px;
}
.chat-quick-actions button {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 1px solid rgba(123,81,71,0.16);
    background: rgba(251,247,243,0.92);
    color: var(--text);
    border-radius: 999px;
    padding: 7px 10px;
    font-size: 0.73rem;
    font-weight: 700;
    cursor: pointer;
}
.chat-quick-actions button i {
    color: var(--cta);
    font-size: 0.72rem;
}
.chat-quick-actions button:hover {
    border-color: rgba(123,81,71,0.35);
    background: #fff;
}
.chat-handoff-help {
    margin-top: 9px;
    color: var(--text-light);
    font-size: 0.72rem;
}
.chat-handoff-help summary {
    cursor: pointer;
    font-weight: 800;
    color: var(--text);
}
.chat-handoff-help p {
    margin: 6px 0 0;
    line-height: 1.35;
}
.chat-survey {
    width: 100%;
    border: 1px solid rgba(196,149,106,0.24);
    background: linear-gradient(180deg, #fff, #fffaf5);
    border-radius: 20px;
    padding: 14px;
    box-shadow: 0 14px 34px rgba(47,41,38,0.06);
}
.chat-survey__eyebrow {
    color: var(--cta);
    font-size: 0.66rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-bottom: 5px;
}
.chat-survey strong {
    display: block;
    color: var(--text);
    font-size: 0.9rem;
    margin-bottom: 3px;
}
.chat-survey span {
    display: block;
    color: var(--text-light);
    font-size: 0.75rem;
    margin-bottom: 10px;
}
.chat-survey__ratings {
    display: flex;
    gap: 7px;
    margin-bottom: 10px;
}
.chat-survey__ratings button {
    width: 36px;
    height: 36px;
    border-radius: 999px;
    border: 1px solid rgba(123,81,71,0.18);
    background: rgba(251,247,243,0.9);
    color: #d6a042;
    font-weight: 800;
    cursor: pointer;
}
.chat-survey__ratings button.is-selected {
    background: linear-gradient(135deg, #7b5147, #c4725c);
    color: white;
    border-color: var(--cta);
    box-shadow: 0 8px 18px rgba(123,81,71,0.18);
}
.chat-survey__comment {
    width: 100%;
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 9px 10px;
    resize: none;
    font-family: var(--font-body);
    font-size: 0.8rem;
    outline: none;
}
.chat-survey__comment:focus { border-color: var(--cta); }
.chat-survey__submit {
    width: 100%;
    margin-top: 8px;
    border: 0;
    border-radius: 999px;
    background: var(--cta);
    color: white;
    padding: 9px 12px;
    font-size: 0.78rem;
    font-weight: 800;
    cursor: pointer;
}
.chat-typing .chat-msg__bubble {
    display: inline-flex;
    gap: 4px;
    align-items: center;
}
.chat-typing span {
    width: 5px;
    height: 5px;
    border-radius: 999px;
    background: var(--text-light);
    animation: chatTyping 1s infinite ease-in-out;
}
.chat-typing span:nth-child(2) { animation-delay: 0.12s; }
.chat-typing span:nth-child(3) { animation-delay: 0.24s; }
@keyframes chatTyping {
    0%, 80%, 100% { opacity: 0.35; transform: translateY(0); }
    40% { opacity: 1; transform: translateY(-2px); }
}

/* End Chat Button */
.aylemu-chat-panel__end-btn {
    padding: 6px 9px; border-radius: 999px; height: 32px;
    background: rgba(255,255,255,0.1); color: rgba(255,255,255,0.9); border: 1px solid rgba(255,255,255,0.16);
    cursor: pointer; display: flex; align-items: center; gap: 5px;
    justify-content: center; font-size: 0.72rem; font-weight: 700;
    flex-shrink: 0; transition: all 0.2s; white-space: nowrap;
}
.aylemu-chat-panel__end-btn:hover { background: rgba(255,255,255,0.16); }

@media (max-width: 768px) {
    .aylemu-chat-panel { bottom: 78px; right: 10px; left: 10px; width: auto; height: min(440px, calc(100dvh - 126px)); border-radius: 22px; }
    .chat-bubble { right: 16px; bottom: 10px; width: 54px; height: 54px; }
}

@keyframes chatPanelIn {
    from { opacity: 0; transform: translateY(8px) scale(0.98); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

/* Cookie Banner Open Adjustments */
body.cookie-banner-open .chat-bubble { bottom: 86px; }
body.cookie-banner-open .gift-finder-bubble { bottom: 152px; }

/* Modern ecommerce cookie consent */
.cookie-banner {
    position: fixed !important;
    left: 50% !important;
    right: auto !important;
    bottom: 18px !important;
    transform: translateX(-50%) !important;
    z-index: 2400 !important;
    width: min(920px, calc(100vw - 32px)) !important;
    padding: 0 !important;
    background: transparent !important;
    color: var(--text) !important;
    animation: cookieSlideUp 0.28s ease !important;
}
.cookie-banner.hidden { display: none !important; }
.cookie-banner__inner {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 14px !important;
    align-items: center !important;
    max-width: none !important;
    padding: 14px !important;
    border-radius: 24px !important;
    background: rgba(255, 250, 246, 0.96) !important;
    border: 1px solid rgba(44,36,32,0.1) !important;
    box-shadow: 0 18px 56px rgba(44,36,32,0.18) !important;
    backdrop-filter: blur(18px) !important;
}
.cookie-banner__copy strong {
    display: block;
    color: var(--text);
    font-weight: 900;
    font-size: 0.86rem;
    margin-bottom: 2px;
}
.cookie-banner__copy p,
.cookie-banner__inner p {
    margin: 0 !important;
    color: var(--text-mid) !important;
    font-size: 0.78rem !important;
    line-height: 1.45 !important;
}
.cookie-banner__copy a,
.cookie-banner__inner a {
    color: var(--cta) !important;
    font-weight: 800;
    text-decoration: underline;
}
.cookie-banner__actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr auto !important;
    gap: 8px !important;
    align-items: center !important;
    min-width: 360px;
}
.cookie-banner__btn {
    min-height: 38px;
    border-radius: 999px;
    padding: 8px 16px;
    font-family: var(--font-body);
    font-size: 0.78rem;
    font-weight: 900;
    white-space: nowrap;
    border: 1px solid rgba(196,114,92,0.35);
}
.cookie-banner__btn--primary,
.cookie-banner__btn--secondary {
    background: var(--cta);
    color: #fff;
    box-shadow: 0 8px 22px rgba(196,114,92,0.22);
}
.cookie-banner__btn--secondary {
    background: #fff;
    color: var(--cta);
}
.cookie-banner__btn--link {
    background: transparent;
    color: var(--text-mid);
    border-color: transparent;
    padding-inline: 8px;
}
.cookie-banner__prefs {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
    gap: 8px;
    padding-top: 10px;
    border-top: 1px solid rgba(44,36,32,0.08);
}
.cookie-banner__prefs.hidden { display: none !important; }
.cookie-banner__prefs label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 9px 10px;
    border-radius: 16px;
    background: #fff;
    border: 1px solid rgba(44,36,32,0.08);
}
.cookie-banner__prefs small {
    display: block;
    color: var(--text-light);
    font-size: 0.66rem;
}
.cookie-banner__prefs input { accent-color: var(--cta); width: 16px; height: 16px; }
@keyframes cookieSlideUp {
    from { opacity: 0; transform: translateX(-50%) translateY(10px); }
    to { opacity: 1; transform: translateX(-50%) translateY(0); }
}

@media (max-width: 768px) {
    .cookie-banner {
        left: 12px !important;
        right: 12px !important;
        bottom: 12px !important;
        transform: none !important;
        width: auto !important;
        max-width: none !important;
    }
    .cookie-banner__inner {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 9px !important;
        padding: 12px !important;
        border-radius: 22px !important;
    }
    .cookie-banner__copy p,
    .cookie-banner__inner p {
        font-size: 0.72rem !important;
        line-height: 1.42 !important;
        padding-right: 0 !important;
        max-width: 100% !important;
    }
    .cookie-banner__actions {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 8px !important;
        min-width: 0 !important;
        width: 100% !important;
    }
    .cookie-banner__btn {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 34px !important;
        padding: 8px 10px !important;
        font-size: 0.72rem !important;
        justify-content: center !important;
        white-space: nowrap !important;
    }
    .cookie-banner__btn--link { grid-column: 1 / -1; min-height: 28px !important; padding: 4px 8px !important; }
    .cookie-banner__prefs { grid-template-columns: 1fr !important; gap: 7px !important; }
    body.cookie-banner-open .chat-bubble {
        display: none !important;
    }
    body.cookie-banner-open .gift-finder-bubble {
        display: none !important;
    }
}

@media (max-width: 380px) {
    .cookie-banner {
        left: 10px !important;
        right: 10px !important;
        bottom: 10px !important;
        border-radius: 18px !important;
    }
    .cookie-banner__inner { padding: 10px !important; }
    .cookie-banner__copy p,
    .cookie-banner__inner p {
        font-size: 0.68rem !important;
        line-height: 1.35 !important;
    }
    .cookie-banner__actions {
        grid-template-columns: 1fr !important;
        gap: 7px !important;
    }
    .cookie-banner .btn {
        min-height: 34px !important;
        font-size: 0.7rem !important;
    }
}

/* Product Variant Selector */
.variant-selector { margin: 12px 0; }
.variant-selector__label { font-size: 0.82rem; font-weight: 600; color: var(--text-mid); margin-bottom: 8px; }
.variant-selector__options { display: flex; gap: 8px; flex-wrap: wrap; }
.variant-option {
    padding: 8px 16px; border: 1.5px solid var(--border); border-radius: var(--radius-full);
    font-size: 0.85rem; font-weight: 500; cursor: pointer; transition: all var(--duration);
}
.variant-option:hover { border-color: var(--cta); color: var(--cta); }
.variant-option.active { background: var(--cta); color: var(--white); border-color: var(--cta); }
.variant-color {
    width: 32px; height: 32px; border-radius: var(--radius-full);
    border: 2px solid var(--border); cursor: pointer; transition: all var(--duration);
}
.variant-color:hover { transform: scale(1.15); }
.variant-color.active { border-color: var(--cta); box-shadow: 0 0 0 3px var(--cta-light); }

@media (max-width: 768px) {
    .account-modal { width: 100%; right: -100%; }
    .blog-grid { grid-template-columns: 1fr; }
    .referral-card__benefits { flex-direction: column; gap: 12px; }
    .us-trust-bar__inner { flex-wrap: nowrap; gap: 8px; justify-content: flex-start; }
    .chat-bubble { bottom: 10px; width: 52px; height: 52px; font-size: 1.3rem; }
    .gift-finder-bubble { bottom: 76px; right: 16px; left: auto; }
    body.cookie-banner-open .chat-bubble { bottom: 86px; }
    body.cookie-banner-open .gift-finder-bubble { bottom: 152px; }
}

/* ============================================
   MILESTONE SHOPPING
   ============================================ */
.milestone-section {
    padding: 64px 0;
    background:
        radial-gradient(circle at 12% 18%, rgba(196,114,92,0.12), transparent 30%),
        radial-gradient(circle at 88% 12%, rgba(140,161,137,0.16), transparent 28%),
        linear-gradient(180deg, #f8f3ec 0%, #f5f0e8 100%);
}
.milestone__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    align-items: stretch;
}
.milestone__card {
    min-height: 250px;
    background: rgba(255,255,255,0.86);
    border-radius: 28px;
    padding: 24px 20px 22px;
    cursor: pointer;
    transition: transform 0.28s var(--ease), box-shadow 0.28s var(--ease), border-color 0.28s var(--ease);
    border: 1px solid rgba(93,78,66,0.12);
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 16px 44px rgba(93,78,66,0.07);
}
.milestone__card::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(145deg, rgba(255,255,255,0.75), rgba(248,243,236,0.1));
    pointer-events: none;
}
.milestone__card::after {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; height: 5px;
    background: linear-gradient(90deg, var(--sage), var(--clay));
    transform: scaleX(0);
    transition: transform 0.28s ease;
    transform-origin: left;
}
.milestone__card > * { position: relative; z-index: 1; }
.milestone__card:hover {
    transform: translateY(-8px);
    box-shadow: 0 24px 60px rgba(93,78,66,0.14);
    border-color: rgba(196,114,92,0.34);
}
.milestone__card:hover::after { transform: scaleX(1); }
.milestone__icon {
    width: 56px;
    height: 56px;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
    color: var(--cta);
    background: linear-gradient(145deg, #fff7ed, #eef5ee);
    box-shadow: inset 0 0 0 1px rgba(196,114,92,0.14), 0 10px 24px rgba(196,114,92,0.12);
    font-size: 1.28rem;
}
.milestone__age {
    width: fit-content;
    margin-bottom: 10px;
    padding: 5px 10px;
    border-radius: var(--radius-full);
    background: rgba(140,161,137,0.13);
    color: var(--sage-dark);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.milestone__card h3 {
    font-family: var(--font-display);
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--text);
    margin-bottom: 8px;
    line-height: 1.25;
}
.milestone__card p {
    font-size: 0.8rem;
    color: var(--text-mid);
    line-height: 1.55;
    margin-bottom: 18px;
}
.milestone__cta {
    margin-top: auto;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 0.78rem;
    font-weight: 800;
    color: var(--cta);
    transition: gap 0.2s ease, color 0.2s ease;
}
.milestone__card:hover .milestone__cta { gap: 10px; color: var(--clay-dark); }

@media (max-width: 1100px) { .milestone__grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 700px) {
    .milestone-section { padding: 64px 0; }
    .milestone__grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
    .milestone__card { min-height: 220px; padding: 20px 16px; border-radius: 22px; }
    .milestone__icon { width: 48px; height: 48px; border-radius: 17px; margin-bottom: 12px; }
}
@media (max-width: 430px) { .milestone__grid { grid-template-columns: 1fr; } }

/* ============================================
   BABY REGISTRY SECTION
   ============================================ */
.registry-section { padding: 80px 0; }
.registry__inner {
    display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center;
}
.registry__badge {
    display: inline-flex; align-items: center; gap: 6px;
    background: rgba(196,114,92,0.1); color: var(--cta);
    padding: 6px 14px; border-radius: var(--radius-full);
    font-size: 0.75rem; font-weight: 700; text-transform: uppercase;
    letter-spacing: 1px; margin-bottom: 16px;
}
.registry__title {
    font-family: var(--font-display); font-size: 2.2rem; font-weight: 800;
    line-height: 1.2; margin-bottom: 16px; color: var(--text);
}
.registry__desc { font-size: 1rem; color: var(--text-mid); line-height: 1.7; margin-bottom: 24px; }
.registry__perks { list-style: none; margin-bottom: 28px; }
.registry__perks li {
    display: flex; align-items: center; gap: 10px;
    font-size: 0.9rem; color: var(--text); padding: 6px 0;
}
.registry__perks li i { color: #22c55e; font-size: 0.85rem; }
.registry__visual { display: flex; justify-content: center; }
.registry__mockup {
    background: var(--white); border: 1.5px solid var(--border);
    border-radius: var(--radius-xl); padding: 20px; width: 100%;
    max-width: 380px; box-shadow: var(--shadow-lg);
}
.registry__mockup-head {
    display: flex; align-items: center; gap: 10px;
    font-family: var(--font-display); font-weight: 700; font-size: 0.95rem;
    padding-bottom: 14px; border-bottom: 1px solid var(--border); margin-bottom: 12px;
    color: var(--text);
}
.registry__mockup-head span { font-size: 1.3rem; }
.registry__mockup-item {
    display: flex; align-items: center; gap: 12px;
    padding: 10px 0; border-bottom: 1px solid var(--border);
}
.registry__mockup-item span { font-size: 1.5rem; }
.registry__mockup-media {
    width: 34px; height: 34px; flex: 0 0 34px;
    border-radius: 10px; background: var(--bg-alt);
    display: inline-flex; align-items: center; justify-content: center;
    overflow: hidden;
}
.registry__mockup-media img {
    width: 100%; height: 100%; object-fit: cover; display: block;
}
.registry__mockup-item div { flex: 1; }
.registry__mockup-item strong { display: block; font-size: 0.82rem; color: var(--text); }
.registry__mockup-item small { font-size: 0.72rem; color: var(--text-light); }
.registry__mockup-progress { padding-top: 14px; color: var(--text-mid); }

@media (max-width: 768px) {
    .registry__inner { grid-template-columns: 1fr; gap: 32px; }
    .registry__title { font-size: 1.6rem; }
}

/* ============================================
   GIFT CARD SECTION
   ============================================ */
.giftcard-section { padding: 80px 0; background: var(--bg-alt); }
.giftcard__grid {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px;
    max-width: 700px; margin: 0 auto;
}
.giftcard__card {
    background: var(--white); border: 1.5px solid var(--border);
    border-radius: var(--radius-xl); padding: 32px 16px;
    text-align: center; cursor: pointer; transition: all 0.3s var(--ease-bounce);
    position: relative;
}
.giftcard__card:hover {
    transform: translateY(-6px); box-shadow: var(--shadow-lg);
    border-color: var(--cta);
}
.giftcard__card--popular { border-color: var(--cta); border-width: 2px; }
.giftcard__badge {
    position: absolute; top: -10px; left: 50%; transform: translateX(-50%);
    background: var(--cta); color: var(--white); padding: 3px 12px;
    border-radius: var(--radius-full); font-size: 0.62rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.5px; white-space: nowrap;
}
.giftcard__amount {
    font-family: var(--font-display); font-size: 2rem; font-weight: 800;
    color: var(--text); margin-bottom: 4px;
}
.giftcard__label { font-size: 0.78rem; color: var(--text-light); font-weight: 600; }
.giftcard__note {
    text-align: center; font-size: 0.82rem; color: var(--text-mid);
    margin-top: 24px;
}
@media (max-width: 600px) { .giftcard__grid { grid-template-columns: repeat(2, 1fr); } }

/* Dark Mode support for new sections */
body.dark-mode .milestone-section {
    background:
        radial-gradient(circle at 12% 18%, rgba(196,114,92,0.14), transparent 30%),
        radial-gradient(circle at 88% 12%, rgba(140,161,137,0.16), transparent 28%),
        #16162a;
}
body.dark-mode .milestone__card { background: rgba(30,30,50,0.9); border-color: #2a2a4a; }
body.dark-mode .milestone__card h3 { color: #e8e8f0; }
body.dark-mode .milestone__card p { color: #b0b0cc; }
body.dark-mode .milestone__age { background: rgba(140,161,137,0.18); color: #cfe0cb; }
body.dark-mode .milestone__icon { background: linear-gradient(145deg, rgba(196,114,92,0.18), rgba(140,161,137,0.16)); }
body.dark-mode .milestone__card:hover { border-color: var(--sage); }
body.dark-mode .registry-section { background: #0f0f1a; }
body.dark-mode .registry__title { color: #e8e8f0; }
body.dark-mode .registry__desc { color: #b0b0cc; }
body.dark-mode .registry__perks li { color: #b0b0cc; }
body.dark-mode .registry__mockup { background: #1e1e32; border-color: #2a2a4a; }
body.dark-mode .registry__mockup-head { color: #e8e8f0; border-bottom-color: #2a2a4a; }
body.dark-mode .registry__mockup-item { border-bottom-color: #2a2a4a; }
body.dark-mode .registry__mockup-item strong { color: #e8e8f0; }
body.dark-mode .giftcard-section { background: #16162a; }
body.dark-mode .giftcard__card { background: #1e1e32; border-color: #2a2a4a; }
body.dark-mode .giftcard__amount { color: #e8e8f0; }
body.dark-mode .giftcard__card:hover { border-color: var(--cta); }

/* --- EXPRESS CHECKOUT (Cart & Checkout) --- */
.cart__express-checkout {
    display: flex; gap: 10px; margin-bottom: 12px;
}
.btn--express {
    flex: 1; display: flex; align-items: center; justify-content: center; gap: 8px;
    padding: 12px; border-radius: 8px; font-weight: 700; font-size: 1.05rem;
    border: none; cursor: pointer; transition: transform 0.2s, box-shadow 0.2s;
}
.btn--express:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.1); }
.btn--apple { background: #000; color: #fff; }
.btn--google { background: #fff; color: #3c4043; border: 1px solid #dadce0; box-shadow: 0 1px 2px rgba(0,0,0,0.05); }
.btn--google:hover { background: #f8f9fa; }
.cart__separator {
    display: flex; align-items: center; text-align: center; margin: 16px 0; color: var(--text-light); font-size: 0.8rem; font-weight: 600;
}
.cart__separator::before, .cart__separator::after { content: ''; flex: 1; border-bottom: 1px solid var(--border); }
.cart__separator span { padding: 0 10px; }
body.dark-mode .btn--google { background: #333; color: #eee; border-color: #444; }

/* Mobile ecommerce header: menu, logo, search, wishlist, account, cart */
@media (max-width: 768px) {
    .header { padding: 0 !important; min-height: 0 !important; }
    .header__container {
        display: grid !important;
        grid-template-columns: 42px minmax(0, 1fr) auto !important;
        align-items: center !important;
        gap: 8px !important;
        height: 52px !important;
        padding: 0 14px !important;
    }
    .header__hamburger {
        width: 42px !important;
        height: 42px !important;
        padding: 10px !important;
        align-items: center !important;
        justify-content: center !important;
    }
    .header__hamburger span {
        width: 24px !important;
        height: 2.5px !important;
    }
    .header__logo {
        justify-self: start !important;
        gap: 8px !important;
        min-width: 0 !important;
    }
    .header__logo-icon { font-size: 1.35rem !important; }
    .header__logo-text { max-width: 160px !important; }
    .header__brand {
        font-size: 1.08rem !important;
        max-width: 150px !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }
    .header__tagline { display: none !important; }
    .header__actions {
        justify-self: end !important;
        display: flex !important;
        align-items: center !important;
        gap: 0 !important;
    }
    .notif-wrapper { display: flex !important; order: 4; }
    #search-toggle { order: 1; }
    #wishlist-btn { order: 2; }
    #account-btn { order: 3; }
    #cart-toggle { order: 5; }
    .header__action-btn {
        width: 32px !important;
        height: 34px !important;
        font-size: 0.92rem !important;
        border-radius: 12px !important;
    }
    #cart-toggle { font-size: 0.95rem !important; }
    #notif-btn { font-size: 0.86rem !important; }
    .header__action-btn:hover { background: transparent !important; }
    .header__badge {
        width: 15px !important;
        height: 15px !important;
        top: -4px !important;
        right: -4px !important;
        border-width: 2px !important;
    }
    .header__badge::after {
        font-size: 0.56rem !important;
    }
}

@media (max-width: 380px) {
    .header__container {
        grid-template-columns: 38px minmax(0, 1fr) auto !important;
        gap: 5px !important;
        padding: 0 10px !important;
    }
    .header__logo-icon { font-size: 1.22rem !important; }
    .header__brand { font-size: 0.98rem !important; max-width: 118px !important; }
    .header__action-btn {
        width: 31px !important;
        height: 31px !important;
        font-size: 0.84rem !important;
    }
    .header__actions { gap: 0 !important; }
}

/* --- NEWSLETTER POPUP --- */
.newsletter-overlay {
    position: fixed; top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0,0,0,0.5); backdrop-filter: blur(4px);
    z-index: 9998; opacity: 1; transition: opacity 0.4s;
}
.newsletter-overlay.hidden { display: none !important; opacity: 0; pointer-events: none; }
.newsletter-modal {
    position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(1);
    background: var(--white); width: 90%; max-width: 480px; border-radius: 20px;
    z-index: 9999; box-shadow: 0 20px 60px rgba(0,0,0,0.2);
    opacity: 1; transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    overflow: hidden; text-align: center;
}
.newsletter-modal.hidden { display: none !important; opacity: 0; transform: translate(-50%, -40%) scale(0.9); pointer-events: none; }
.newsletter-modal__close {
    position: absolute; top: 16px; right: 16px; background: rgba(0,0,0,0.05);
    border: none; width: 32px; height: 32px; border-radius: 50%; color: var(--text-mid);
    cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background 0.2s;
}
.newsletter-modal__close:hover { background: rgba(0,0,0,0.1); color: var(--text); }
.newsletter-modal__content { padding: 40px 30px; background: linear-gradient(180deg, #fef9f7 0%, var(--white) 100%); }
.newsletter-modal__emoji { font-size: 3rem; margin-bottom: 16px; animation: float 3s ease-in-out infinite; display: inline-block; }
.newsletter-modal__title { font-family: var(--font-display); font-size: 1.6rem; color: var(--text); margin-bottom: 12px; }
.newsletter-modal__desc { color: var(--text-mid); font-size: 0.95rem; margin-bottom: 24px; line-height: 1.5; }
.newsletter-modal__form { display: flex; flex-direction: column; gap: 12px; }
.newsletter-modal__form input {
    padding: 14px 16px; border: 1.5px solid var(--border); border-radius: 10px;
    font-size: 0.95rem; font-family: var(--font-body); transition: border-color 0.2s;
}
.newsletter-modal__form input:focus { outline: none; border-color: var(--cta); }
.newsletter-modal__form button { padding: 14px; border-radius: 10px; font-weight: 700; font-size: 1rem; }
.newsletter-modal__terms { font-size: 0.75rem; color: var(--text-light); margin-top: 16px; }
body.dark-mode .newsletter-modal { background: #1a1a2e; }
body.dark-mode .newsletter-modal__content { background: linear-gradient(180deg, #222238 0%, #1a1a2e 100%); }

/* ============================================
   EXIT INTENT POPUP & FBT & UPSALES
   ============================================ */
.exit-intent-overlay {
    position: fixed; inset: 0; background: rgba(0,0,0,0.6); backdrop-filter: blur(4px);
    z-index: 10000; transition: all 0.3s ease;
}
.exit-intent-overlay.hidden { display: none !important; opacity: 0; pointer-events: none; }
.exit-intent-modal {
    position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);
    width: 90%; max-width: 440px; background: var(--white); border-radius: 24px;
    z-index: 10001; text-align: center; overflow: hidden;
    box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25);
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.exit-intent-modal.hidden { display: none !important; opacity: 0; transform: translate(-50%, -40%) scale(0.9); pointer-events: none; }
.exit-intent-modal__close {
    position: absolute; top: 16px; right: 16px; width: 32px; height: 32px; border-radius: 50%;
    background: transparent; border: none; font-size: 1.2rem; color: var(--text-light);
    cursor: pointer; display: flex; align-items: center; justify-content: center; transition: all 0.2s;
}
.exit-intent-modal__close:hover { background: rgba(0,0,0,0.1); color: var(--text); }
.exit-intent-modal__content { padding: 40px 30px; background: linear-gradient(180deg, #fff0f0 0%, var(--white) 100%); }
.exit-intent-modal__emoji { font-size: 4rem; margin-bottom: 16px; animation: float 3s ease-in-out infinite; display: inline-block; }
.exit-intent-modal__title { font-family: var(--font-display); font-size: 1.8rem; color: #d32f2f; margin-bottom: 12px; line-height: 1.2; }
.exit-intent-modal__desc { color: var(--text-mid); font-size: 1rem; margin-bottom: 24px; line-height: 1.5; }
.exit-intent-modal__code { background: #ffebee; border: 2px dashed #ffcdd2; color: #c62828; padding: 12px; font-size: 1.2rem; border-radius: 8px; margin-bottom: 24px; }
body.dark-mode .exit-intent-modal { background: #1a1a2e; }
body.dark-mode .exit-intent-modal__content { background: linear-gradient(180deg, #3a1c1c 0%, #1a1a2e 100%); }
body.dark-mode .exit-intent-modal__code { background: #2a1111; border-color: #5c2020; color: #ff5252; }

/* FBT (Frequently Bought Together) */
.pdp__fbt { margin-top: 30px; padding: 24px; border: 1px solid var(--border); border-radius: var(--radius-xl); background: var(--white); box-shadow: 0 14px 40px rgba(92,72,58,0.06); }
.pdp__fbt-title { font-family: var(--font-display); font-size: 1.2rem; margin-bottom: 16px; font-weight: 700; }
.pdp__fbt-items { display: grid; gap: 12px; margin-bottom: 18px; }
.pdp__fbt-item {
    display: grid;
    grid-template-columns: 18px 64px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: 18px;
    background: var(--bg-cream);
    cursor: pointer;
}
.pdp__fbt-item:hover { border-color: rgba(196,114,92,0.35); box-shadow: 0 10px 28px rgba(92,72,58,0.08); }
.pdp__fbt-item input { width: 18px; height: 18px; accent-color: var(--cta); cursor: pointer; }
.pdp__fbt-media { width: 64px; height: 64px; border-radius: 16px; flex: 0 0 auto; }
.pdp__fbt-info { min-width: 0; display: grid; gap: 2px; }
.pdp__fbt-kicker { font-size: 0.66rem; color: var(--cta); text-transform: uppercase; letter-spacing: 0.08em; font-weight: 800; }
.pdp__fbt-name { font-size: 0.88rem; font-weight: 700; color: var(--text); line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.pdp__fbt-price { font-size: 0.82rem; color: var(--text-mid); font-weight: 700; }
.pdp__fbt-total { font-weight: 800; font-size: 1rem; color: var(--cta); margin-bottom: 12px; display: block; }
body.dark-mode .pdp__fbt { background: #1a1a2e; border-color: #2a2a40; }

/* Tiered Volume Table */
.pdp__volume {
    margin-bottom: 14px;
    display: grid;
    gap: 7px;
}
.pdp__volume-title {
    font-size: 0.72rem;
    font-weight: 850;
    color: var(--text-mid);
    text-transform: uppercase;
    letter-spacing: 0.08em;
}
.pdp__volume-options {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}
.pdp__volume-tier {
    display: grid;
    gap: 4px;
    align-content: center;
    min-height: 74px;
    padding: 10px;
    border: 1.5px solid var(--border);
    border-radius: 14px;
    cursor: pointer;
    transition: border-color 0.2s, box-shadow 0.2s, background 0.2s;
    background: var(--white);
}
.pdp__volume-tier:hover { border-color: rgba(196,114,92,0.45); box-shadow: 0 8px 22px rgba(92,72,58,0.06); }
.pdp__volume-tier.selected { border-color: var(--cta); background: rgba(209,141,119,0.05); }
.pdp__volume-qty { font-weight: 800; font-size: 0.82rem; line-height: 1.2; color: var(--text); }
.pdp__volume-price { font-weight: 850; color: var(--cta); display: grid; gap: 2px; align-items: start; font-size: 0.9rem; line-height: 1.15; }
.pdp__volume-badge { font-size: 0.62rem; background: #e8f5e9; color: #2e7d32; padding: 2px 5px; border-radius: 6px; margin-top: 2px; font-weight: 800; width: fit-content; }
body.dark-mode .pdp__volume-tier { background: #16162a; border-color: #2a2a40; }
body.dark-mode .pdp__volume-tier.selected { background: rgba(209,141,119,0.1); border-color: var(--cta); }
body.dark-mode .pdp__volume-badge { background: #1b3320; color: #81c784; }

/* ============================================
   SOCIAL SHARE BUTTONS
   ============================================ */
.pdp__share-btn {
    width: 32px; height: 32px; border: none; border-radius: 50%; color: white;
    cursor: pointer; display: flex; align-items: center; justify-content: center;
    font-size: 0.85rem; transition: all 0.2s; box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}
.pdp__share-btn:hover { transform: scale(1.15); box-shadow: 0 4px 10px rgba(0,0,0,0.25); }

/* ============================================
   SAVE FOR LATER (Cart)
   ============================================ */
.cart__saved-item {
    display: flex; align-items: center; gap: 10px; padding: 10px 20px;
    border-bottom: 1px solid var(--border); font-size: 0.82rem;
}
.cart__saved-item__img { width: 40px; height: 40px; border-radius: 6px; display: flex; align-items: center; justify-content: center; font-size: 1.2rem; }
.cart__saved-item__info { flex: 1; }
.cart__saved-item__name { font-weight: 600; font-size: 0.82rem; }
.cart__saved-item__price { color: var(--cta); font-weight: 700; font-size: 0.8rem; }
.cart__saved-item__actions { display: flex; gap: 6px; }
.cart__saved-item__actions button {
    padding: 4px 10px; border: none; border-radius: 6px; font-size: 0.72rem;
    cursor: pointer; font-weight: 600; transition: all 0.2s;
}
.cart__saved-item__move { background: var(--cta); color: white; }
.cart__saved-item__move:hover { background: var(--cta-hover); }
.cart__saved-item__delete { background: #fee2e2; color: #dc2626; }
.cart__saved-item__delete:hover { background: #fecaca; }

.cart-item__save-btn {
    background: none; border: none; color: var(--text-light); cursor: pointer;
    font-size: 0.7rem; padding: 2px 0; transition: color 0.2s;
}
.cart-item__save-btn:hover { color: var(--cta); }

/* ============================================
   CART RECOMMENDATIONS
   ============================================ */
.cart__reco-items { display: flex; gap: 8px; padding: 6px 16px 10px; overflow-x: auto; }
.cart__reco-card {
    min-width: 90px; max-width: 90px; background: var(--white); border: 1px solid var(--border);
    border-radius: 10px; padding: 8px; text-align: center; cursor: pointer; transition: all 0.2s; flex-shrink: 0;
}
.cart__reco-card:hover { border-color: var(--cta); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.cart__reco-card__emoji { font-size: 1.2rem; margin-bottom: 4px; }
.cart__reco-card__name { font-size: 0.65rem; font-weight: 600; line-height: 1.2; margin-bottom: 3px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cart__reco-card__price { font-size: 0.7rem; font-weight: 800; color: var(--cta); margin-bottom: 4px; }
.cart__reco-card__add { width: 100%; padding: 3px 0; border: none; background: var(--cta); color: white; border-radius: 5px; font-size: 0.62rem; font-weight: 700; cursor: pointer; transition: all 0.2s; }
.cart__reco-card__add:hover { background: var(--cta-hover); }
body.dark-mode .cart__reco-card { background: #16162a; border-color: #2a2a40; }

/* ============================================
   FOOTER TRUST BADGES
   ============================================ */
.footer__trust-badges {
    display: grid; grid-template-columns: repeat(5, minmax(130px, 1fr)); gap: 10px;
    padding: 18px 0; margin-top: 4px; border-top: 1px solid rgba(255,255,255,0.1);
}
.footer__trust-badge {
    display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px;
    padding: 10px 12px; border-radius: 16px; background: rgba(255,255,255,0.065);
    border: 1px solid rgba(255,255,255,0.08); font-size: 0.8rem;
    color: rgba(255,255,255,0.78); font-weight: 800; text-align: center;
}
.footer__trust-badge i { font-size: 1rem; color: #9ee6b5; }

/* Registry modal + wishlist CTA */
.registry-modal { position: fixed; inset: 0; z-index: 10050; display: grid; place-items: center; padding: 18px; }
.registry-modal__overlay { position: absolute; inset: 0; background: rgba(28, 20, 17, 0.48); backdrop-filter: blur(8px); }
.registry-modal__panel {
    position: relative;
    width: min(560px, 100%);
    max-height: min(86vh, 760px);
    overflow: auto;
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 28px;
    padding: 26px;
    box-shadow: 0 28px 90px rgba(38, 25, 20, 0.24);
}
.registry-modal__close {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 36px;
    height: 36px;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: var(--bg);
    color: var(--text);
    font-size: 1.35rem;
    cursor: pointer;
}
.registry-modal__eyebrow {
    color: var(--cta);
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-bottom: 8px;
}
.registry-modal h3 { font-size: 1.55rem; line-height: 1.1; margin: 0 42px 8px 0; color: var(--text); }
.registry-modal__copy { color: var(--text-mid); margin: 0 0 18px; }
.registry-modal__error { background: #fff1f2; border: 1px solid #fecdd3; color: #9f1239; border-radius: 14px; padding: 10px 12px; font-weight: 700; font-size: 0.86rem; }
.registry-modal__form, .registry-modal__code { display: grid; gap: 12px; }
.registry-modal__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.registry-modal input, .registry-modal textarea {
    width: 100%;
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 12px 13px;
    font: inherit;
    background: var(--white);
}
.registry-modal textarea { min-height: 84px; resize: vertical; }
.registry-modal__divider { display: flex; align-items: center; gap: 10px; color: var(--text-light); font-size: 0.8rem; font-weight: 800; margin: 14px 0; }
.registry-modal__divider::before, .registry-modal__divider::after { content: ""; height: 1px; background: var(--border); flex: 1; }
.registry-modal__code { grid-template-columns: 1fr auto; }
.wishlist-drawer__registry-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
@media (max-width: 540px) {
    .registry-modal { align-items: end; padding: 0; }
    .registry-modal__panel { width: 100%; max-height: 88vh; border-radius: 24px 24px 0 0; padding: 22px; }
    .registry-modal__grid, .registry-modal__code { grid-template-columns: 1fr; }
    .wishlist-drawer__registry-actions .btn { width: 100%; }
    .wishlist-drawer__item { grid-template-columns: 82px minmax(0, 1fr); padding: 10px; gap: 10px; }
    .wishlist-drawer__item .wishlist-drawer__media { width: 82px; height: 92px; border-radius: 16px; }
    .wishlist-drawer__info strong,
    .wishlist-drawer__meta,
    .wishlist-drawer__urgency-row { padding-right: 54px; }
    .wishlist-drawer__meta span { font-size: 0.6rem; }
    .wishlist-drawer__urgency { padding: 4px 7px; font-size: 0.6rem; }
    .wishlist-drawer__urgency-row { gap: 5px; margin-bottom: 6px; }
    .wishlist-drawer__info strong { font-size: 0.82rem; }
    .wishlist-drawer__add { min-height: 36px; }
}

/* ============================================
   LOW STOCK URGENCY BADGE
   ============================================ */
.pdp__low-stock {
    display: flex; align-items: center; gap: 8px; padding: 10px 14px;
    background: #fff7ed; border: 1px solid #fed7aa; border-radius: 10px;
    margin-bottom: 12px; font-size: 0.85rem; color: #c2410c; font-weight: 600;
    animation: urgencyPulse 2s ease-in-out infinite;
}
.pdp__low-stock i { color: #ea580c; }
@keyframes urgencyPulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}
body.dark-mode .pdp__low-stock { background: #2a1a0a; border-color: #5c3a1a; color: #fb923c; }

/* ============================================
   SPIN THE WHEEL
   ============================================ */
.spin-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.7); backdrop-filter: blur(4px); z-index: 10000; display: flex; align-items: center; justify-content: center; }
.spin-overlay.hidden { display: none !important; }
.spin-modal {
    background: var(--white); border-radius: 24px; width: 90%; max-width: 400px;
    text-align: center; padding: 40px 30px; position: relative;
    box-shadow: 0 25px 50px rgba(0,0,0,0.3);
}
.spin-modal__close { position: absolute; top: 14px; right: 14px; background: none; border: none; font-size: 1.3rem; color: var(--text-light); cursor: pointer; }
.spin-modal__wheel {
    width: 260px; height: 260px; border-radius: 50%; margin: 0 auto 24px;
    position: relative; border: 6px solid var(--cta);
    transition: transform 4s cubic-bezier(0.17, 0.67, 0.12, 0.99);
    background: conic-gradient(
        #FF6B6B 0deg 60deg, #4ECDC4 60deg 120deg, #FFE66D 120deg 180deg,
        #95E1D3 180deg 240deg, #F38181 240deg 300deg, #AA96DA 300deg 360deg
    );
}
.spin-modal__pointer {
    position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
    width: 40px; height: 40px; background: var(--white); border-radius: 50%;
    box-shadow: 0 2px 10px rgba(0,0,0,0.2); display: flex; align-items: center;
    justify-content: center; font-size: 1rem; z-index: 2;
}
.spin-modal__arrow {
    position: absolute; top: -16px; left: 50%; transform: translateX(-50%);
    width: 0; height: 0; border-left: 12px solid transparent;
    border-right: 12px solid transparent; border-top: 20px solid var(--cta); z-index: 3;
}
.spin-modal__title { font-family: var(--font-display); font-size: 1.6rem; margin-bottom: 8px; }
.spin-modal__desc { color: var(--text-mid); font-size: 0.9rem; margin-bottom: 20px; }
.spin-modal__form { display: flex; gap: 8px; margin-bottom: 16px; }
.spin-modal__form input { flex: 1; padding: 12px 16px; border: 1.5px solid var(--border); border-radius: 10px; font-size: 0.9rem; }
.spin-modal__form button { padding: 12px 20px; background: var(--cta); color: white; border: none; border-radius: 10px; font-weight: 700; cursor: pointer; white-space: nowrap; }
.spin-modal__result { font-size: 1.3rem; font-weight: 800; color: var(--cta); display: none; padding: 20px; background: #fdf2f8; border-radius: 12px; }
body.dark-mode .spin-modal { background: #1a1a2e; }
body.dark-mode .spin-modal__result { background: #2a1a2e; }

/* ============================================
   RESPONSIVE HARDENING
   Prevent wide content from forcing mobile overflow.
   ============================================ */
html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

img,
video,
iframe {
    max-width: 100%;
}

.container {
    max-width: min(1200px, 100%);
}

#product-detail-view,
#product-detail-view * {
    box-sizing: border-box;
}

.pdp__grid,
.pdp__media,
.pdp__info,
.pdp__image-main,
.pdp__tabs,
.pdp__tab-content,
.pdp__related,
.pdp__related-grid,
.pdp__fbt {
    min-width: 0;
    max-width: 100%;
}

.pdp__media,
.pdp__info {
    width: 100%;
}

.pdp__image-main {
    position: relative;
}

.pdp__image-main img {
    max-width: 100%;
}

.pdp__price-section,
.pdp__rating-row,
.pdp__meta,
.pdp__badges,
.pdp__actions,
.pdp__share,
.pdp__promises,
.pdp__delivery-date,
.pdp__inbox,
.pdp__volume,
#pdp-trust-strip,
#pdp-fav-count {
    min-width: 0;
    max-width: 100%;
}

.pdp__name,
.pdp__review-count,
.pdp__desc,
.pdp__review-text,
.pdp__inbox-list,
.pdp__promise span,
.pdp__delivery-date span {
    overflow-wrap: anywhere;
}

@media (max-width: 768px) {
    .pdp {
        padding: 48px 0 96px;
    }

    .pdp .container {
        padding-left: 16px;
        padding-right: 16px;
    }

    .pdp__breadcrumb {
        margin-bottom: 16px;
    }

    .pdp__grid {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 18px;
        margin-bottom: 36px;
        width: 100%;
    }

    .pdp__media {
        position: static;
        overflow: hidden;
    }

    .pdp__image-main {
        width: 100% !important;
        height: auto !important;
        aspect-ratio: 1 / 1 !important;
        max-height: min(430px, 58vh);
        border-radius: 18px;
    }

    .pdp__image-main img {
        border-radius: 18px !important;
    }

    .pdp__name {
        font-size: clamp(1.16rem, 4.8vw, 1.34rem);
    }

    .pdp__price-section {
        flex-wrap: wrap;
        gap: 8px;
    }

    .pdp__actions {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr) auto;
        align-items: center;
    }

    .pdp__actions .btn--full {
        width: 100%;
        min-width: 0;
    }

    .pdp__tabs {
        width: 100%;
        overflow-x: auto;
    }

    .pdp__tab-content {
        width: 100%;
    }

    .pdp__specs-table {
        table-layout: fixed;
    }

    .pdp__specs-table td {
        overflow-wrap: anywhere;
    }

    .pdp__related-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }

    .pdp__volume-options {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 6px;
    }

    .pdp__volume-tier {
        min-height: 68px;
        padding: 8px;
    }
}

@media (max-width: 480px) {
    .pdp {
        padding-top: 40px;
    }

    .pdp .container {
        padding-left: 14px;
        padding-right: 14px;
    }

    .pdp__image-main {
        max-height: 230px !important;
        border-radius: 16px;
    }

    .pdp__actions {
        grid-template-columns: 1fr;
    }

    .pdp__actions .qty-selector,
    .pdp__actions .pdp__wishlist-btn {
        width: 100%;
    }

    .pdp__actions .qty-selector {
        justify-content: space-between;
    }

    .pdp__promises {
        grid-template-columns: 1fr;
    }

    #pdp-trust-strip {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 6px !important;
    }

    #pdp-trust-strip > div {
        min-width: 0;
    }

    .pdp__sticky-inner {
        max-width: 100%;
    }
}

/* ============================================
   PDP IMAGE GALLERY THUMBNAILS
   ============================================ */
#pdp-thumbnails::-webkit-scrollbar { display: none; }
.pdp-thumb { flex-shrink: 0; transition: border-color 0.2s, transform 0.15s; }
.pdp-thumb:hover { transform: translateY(-1px); }
.pdp-thumb--active { border-color: var(--cta) !important; }

/* ============================================
   PDP MOBILE — Extra fine-tuning
   ============================================ */
@media (max-width: 768px) {
    /* Image container: constrain height */
    .pdp__image-main {
        aspect-ratio: 1 / 1 !important;
        max-height: min(430px, 58vh);
    }
    /* Info panel: no top gap */
    .pdp__info { padding-top: 0; }
    /* Rating row smaller */
    .pdp__rating-row { margin-bottom: 12px; }
    /* Price section */
    .pdp__price-section { padding-bottom: 14px; margin-bottom: 14px; }
    /* Meta tags compact */
    .pdp__meta-tag { font-size: 0.72rem; padding: 4px 10px; }
    /* Inline social proof / price alert row */
    .pdp__social-proof { font-size: 0.72rem; }
    /* FBT section */
    .pdp__fbt { padding: 18px; }
    .pdp__fbt-item { grid-template-columns: 18px 56px minmax(0, 1fr); padding: 10px; }
    .pdp__fbt-media { width: 56px; height: 56px; border-radius: 14px; }
    /* Related section */
    .pdp__related { padding-top: 28px; }
    .pdp__related-title { font-size: 1.2rem; margin-bottom: 16px; }
}

@media (max-width: 480px) {
    /* Very small screens */
    .pdp__image-main { max-height: min(340px, 54vh) !important; }
    .pdp__grid { gap: 16px; }
    .pdp__name { font-size: 1.12rem !important; line-height: 1.17; }
    .pdp__price { font-size: 1.25rem !important; }
    .pdp__old-price { font-size: 0.9rem; }
    .pdp__save { font-size: 0.7rem; }
    /* Qty selector compact */
    .qty-selector button { width: 36px; height: 40px; font-size: 1rem; }
    .qty-selector span { min-width: 28px; font-size: 0.95rem; }
    /* Add to cart button */
    #pdp-add-cart { font-size: 0.9rem; padding: 12px 16px; }
    /* Wishlist button full width */
    .pdp__wishlist-btn { height: 44px; }
    /* Share row */
    .pdp__share { gap: 6px; }
    .pdp__share-btn { width: 30px; height: 30px; font-size: 0.75rem; }
    /* Installment text */
    .pdp__installment { font-size: 0.68rem; padding: 6px 8px; }
    .pdp__volume-qty { font-size: 0.74rem; }
    .pdp__volume-price { font-size: 0.8rem; }
    .pdp__volume-badge { font-size: 0.56rem; }
    /* Promises */
    .pdp__promises { grid-template-columns: 1fr 1fr; gap: 6px; padding: 8px; }
    .pdp__promise { font-size: 0.7rem; }
    .pdp__inbox-list { grid-template-columns: 1fr; }
    /* Sticky CTA */
    .pdp__sticky-inner { padding: 8px 14px; }
    #pdp-sticky-add { padding: 10px 18px; font-size: 0.85rem; }
}

/* ============================================
   PREMIUM HOMEPAGE FINAL OVERRIDES
   ============================================ */
.premium-home-section,
#customer-favorites,
#milestone-shopping,
#bundles,
#testimonials,
#faq {
    scroll-margin-top: 96px;
}

#main-view > section:not(#hero):not(.trust-strip):not(#customer-favorites):not(#recently-viewed-section):not(#milestone-shopping):not(#bundles):not(#testimonials):not(#faq):not(.guarantee-banner) {
    display: none !important;
}

.products__view-all,
.trending__cta {
    margin-top: 26px;
}

.guarantee-banner__inner {
    align-items: center;
}

#all-products-grid.products__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-bottom: 0;
    align-items: start;
}

#all-products-view .p-card__body {
    flex: 0 1 auto;
}

#all-products-view .p-card__price-row {
    margin-top: 8px;
}

@media (max-width: 1180px) {
    #all-products-grid.products__grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 1024px) {
    .hero { padding-bottom: 56px; }
    .trust-strip__grid--compact { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .products__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 768px) {
    .section-head { margin-bottom: 28px; }
    .section-head__desc { font-size: 0.92rem; max-width: 34rem; }
    .hero { min-height: auto; padding: 20px 0 18px; }
    .hero__container { display: flex; flex-direction: column; gap: 18px; }
    .hero__showcase { order: -1; margin-top: 0; margin-bottom: 4px; }
    .hero__content { order: 2; }
    .hero__label { margin-bottom: 14px; font-size: 0.72rem; letter-spacing: 1.4px; }
    .hero__desc { font-size: 0.98rem; line-height: 1.65; margin-bottom: 22px; }
    .hero__actions { margin-bottom: 24px; }
    .hero__showcase-card { padding: 12px; max-width: 360px; }
    .hero__showcase-img { height: 238px; margin-bottom: 10px; }
    .hero__showcase-img img { object-fit: cover; object-position: center 42%; background: #f5ede5; }
    .hero__showcase-info { gap: 5px; }
    .hero__showcase-tag { margin-bottom: 4px; }
    .hero__showcase-name { -webkit-line-clamp: 2; font-size: 1.05rem; }
    .hero__showcase-benefits { display: none; }
    .hero__showcase-cta { padding: 7px 14px; }
    .trust-strip { padding: 12px 0; }
    .trust-strip__grid,
    .trust-strip__grid--compact { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .products,
    .bundles,
    .faq,
    .milestone-section,
    .testimonials { padding: 44px 0; }
    #testimonials .testimonials__track {
        display: flex;
        gap: 12px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding: 2px 2px 12px;
    }
    #testimonials .t-card {
        flex: 0 0 82vw;
        scroll-snap-align: start;
    }
    #testimonials .testimonials__nav { display: none; }
    .recently-viewed { padding: 24px 0 30px; }
    .guarantee-banner { padding: 30px 0 44px; }
    .gift-finder-bubble { bottom: 78px; right: 16px; }
    .gift-finder-bubble__text { display: inline; }
    .chat-bubble { bottom: 10px; }
}

@media (max-width: 768px) {
    .us-trust-bar {
        padding: 8px 0;
        background: #fff;
    }
    .us-trust-bar__inner {
        padding: 0 14px;
        justify-content: flex-start;
        gap: 8px;
        overflow-x: auto;
        scroll-snap-type: x proximity;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }
    .us-trust-bar__inner::-webkit-scrollbar { display: none; }
    .us-trust-bar__item {
        flex: 0 0 auto;
        scroll-snap-align: start;
        min-height: 34px;
        padding: 7px 10px;
        border: 1px solid var(--border);
        border-radius: 999px;
        background: var(--bg-alt);
        font-size: 0.72rem;
        white-space: nowrap;
        box-shadow: 0 4px 12px rgba(31,41,55,0.035);
    }
    .us-trust-bar__item i { font-size: 0.95rem; }
}

@media (max-width: 480px) {
    .hero { padding: 26px 0 12px; }
    .hero__title { font-size: 2rem; }
    .hero__actions { display: grid; grid-template-columns: 1fr; }
    .hero__actions .btn { width: 100%; justify-content: center; }
    .hero__trust { gap: 12px; justify-content: center; }
    .hero__trust-item { font-size: 0.76rem; }
    .hero__showcase { margin-top: 8px; }
    .hero__showcase-card { padding: 10px; }
    .hero__showcase-img { height: 238px; }
    .trust-strip__grid,
    .trust-strip__grid--compact { grid-template-columns: 1fr 1fr; }
    .trust-strip__item { min-height: 66px; padding: 10px; }
    .trust-strip__icon { width: 32px; height: 32px; }
    .trust-strip__item strong { font-size: 0.72rem; }
    .trust-strip__item p { font-size: 0.62rem; }
    .guarantee-banner__inner { align-items: flex-start; }
    #customer-favorites .p-card {
        flex-basis: min(82vw, 286px);
    }
    #customer-favorites .p-card__media {
        height: 210px;
    }
    .gift-finder-bubble {
        right: 16px;
        left: auto;
        bottom: 74px;
        padding: 7px 11px 7px 8px;
    }
    .gift-finder-bubble__icon { width: 30px; height: 30px; font-size: 0.82rem; }
    .gift-finder-bubble__text { display: inline; font-size: 0.72rem; }
    .gift-finder-bubble__copy small { display: none; }
}

@media (max-width: 768px) {
    .footer {
        padding-top: 34px;
        background: radial-gradient(circle at 50% 0%, rgba(196,149,106,0.20), transparent 32%), linear-gradient(180deg, #172023 0%, #0f1517 100%);
    }
    .footer__top {
        grid-template-columns: 1fr !important;
        gap: 18px;
        padding-bottom: 20px;
    }
    .footer__brand {
        text-align: center;
        max-width: 360px;
        margin: 0 auto;
    }
    .footer__logo {
        justify-content: center;
        margin-bottom: 10px;
        font-size: 1.25rem;
    }
    .footer__logo-mark {
        width: 36px;
        height: 36px;
        border-radius: 14px;
    }
    .footer__brand p {
        margin: 0 auto 12px;
        font-size: 0.84rem;
        line-height: 1.65;
        max-width: 310px;
    }
    .footer__mini-badges {
        justify-content: center;
        margin-bottom: 14px;
        gap: 6px;
    }
    .footer__mini-badges span {
        padding: 6px 9px;
        font-size: 0.66rem;
    }
    .footer__social {
        justify-content: center;
        gap: 8px;
    }
    .footer__social a {
        width: 38px;
        height: 38px;
        border-radius: 14px;
    }
    .footer__col {
        text-align: left !important;
        padding: 14px;
        border: 1px solid rgba(255,255,255,0.08);
        border-radius: 18px;
        background: rgba(255,255,255,0.045);
    }
    .footer__col h4 {
        justify-content: flex-start !important;
        margin-bottom: 12px;
        font-size: 0.86rem;
    }
    .footer__col a {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        width: calc(50% - 5px);
        margin: 0 0 9px !important;
        color: rgba(255,255,255,0.70);
        font-size: 0.78rem;
        line-height: 1.35;
        vertical-align: top;
    }
    .footer__col a > i {
        width: 15px;
        font-size: 0.72rem;
        color: #f4c27b;
    }
    .footer__col a::after { display: none; }
    .footer__trust-badges { display: none !important; }
    .footer__bottom {
        padding: 16px 0 82px;
        gap: 10px;
        font-size: 0.72rem;
    }
    .footer__payments {
        justify-content: center;
        font-size: 1.25rem;
    }
}

@media (max-width: 768px) {
    #all-products-view {
        background: linear-gradient(180deg, #fffaf7 0%, var(--bg-cream) 100%);
        padding-top: 8px;
    }
    #all-products-view .container { padding-top: 0; }
    #all-products-view .pdp__breadcrumb { margin-bottom: 4px; }
    #all-products-view .all-products-page__header {
        margin-bottom: 4px;
        gap: 2px;
    }
    #all-products-view .all-products-page__title,
    #all-products-view .section-head__title {
        font-size: 1.18rem;
        line-height: 1.12;
    }
    #all-products-view .all-products-page__subtitle,
    #all-products-view .section-head__desc {
        font-size: 0.74rem;
        line-height: 1.3;
    }
    #all-products-view .all-products-page__filters {
        position: sticky;
        top: 62px;
        z-index: 30;
        margin: 0 -12px 16px;
        padding: 12px;
        background: rgba(255,250,247,0.94);
        border: 1px solid rgba(234,223,216,0.85);
        border-radius: 0 0 22px 22px;
        box-shadow: 0 12px 28px rgba(31,41,55,0.06);
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
    }
    #all-products-view .all-products-page__filters:not(.all-products-page__filters--simple) {
        display: none !important;
    }
    #all-products-view .products-mobile-filter-actions {
        position: sticky;
        top: 62px;
        z-index: 31;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 8px;
        margin: 0 0 14px;
        padding: 8px;
        background: rgba(255,250,247,0.94);
        border: 1px solid rgba(234,223,216,0.85);
        border-radius: 18px;
        box-shadow: 0 10px 24px rgba(31,41,55,0.06);
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
    }
    #all-products-view .products-mobile-filter-actions.hidden {
        display: none !important;
    }
    .products-mobile-filter-btn {
        height: 40px;
        border-radius: 999px;
        border: 1px solid var(--border);
        background: var(--white);
        color: var(--text);
        font-weight: 850;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
        box-shadow: 0 6px 16px rgba(31,41,55,0.04);
    }
    .products-mobile-filter-btn span {
        min-width: 18px;
        height: 18px;
        border-radius: 999px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        background: var(--cta);
        color: var(--white);
        font-size: 0.68rem;
    }
    #all-products-view .all-products-page__filters--simple {
        position: static;
        margin: 0 0 8px;
        padding: 0;
        background: transparent;
        border: 0;
        border-radius: 0;
        box-shadow: none;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }
    #all-products-view .all-products-page__filters--simple .all-products-page__filter-note {
        margin: 0;
        padding: 0;
    }
    #all-products-view .all-products-page__filters--simple .all-products-page__filter-note span {
        font-size: 0.74rem;
        font-weight: 600;
        color: var(--text-light);
    }
    #all-products-view .all-products-page__filters--simple > div:not(.all-products-page__filter-note) {
        display: none !important;
    }
    #all-products-view .all-products-page__filters--simple .all-products-page__count {
        display: none;
    }
    #all-products-grid.products__grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px;
    }
    #all-products-view .p-card {
        display: flex;
        flex-direction: column;
        border-radius: 20px;
        overflow: hidden;
        background: rgba(255,255,255,0.96);
        box-shadow: 0 8px 22px rgba(31,41,55,0.055);
    }
    #all-products-view .p-card:hover { transform: none; }
    #all-products-view .p-card__media {
        height: auto;
        min-height: 0;
        aspect-ratio: 1 / 1.06;
        border-radius: 0;
    }
    #all-products-view .p-card__media-bg { border-radius: 0; }
    #all-products-view .p-card__media > img,
    #all-products-view .p-card__media img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    #all-products-view .p-card__badge {
        top: 8px !important;
        left: 8px !important;
        padding: 3px 9px;
        font-size: 0.58rem;
        border-radius: 999px;
        letter-spacing: 0.02em;
    }
    #all-products-view .p-card__wishlist {
        top: 9px !important;
        right: 9px !important;
        width: 30px !important;
        height: 30px !important;
        min-width: 30px !important;
        font-size: 0.72rem !important;
        border-radius: 999px !important;
        box-shadow: 0 5px 14px rgba(31,41,55,0.12) !important;
    }
    #all-products-view .p-card__wishlist i {
        font-size: 0.84rem !important;
    }
    #all-products-view .p-card__body {
        min-width: 0;
        padding: 8px 9px 10px;
        justify-content: flex-start;
    }
    #all-products-view .p-card__trust { display: none; }
    #all-products-view .p-card__cat {
        font-size: 0.52rem;
        letter-spacing: 1.15px;
        margin: 0 0 2px;
    }
    #all-products-view .p-card__name {
        font-size: 0.74rem;
        line-height: 1.2;
        margin: 3px 0 4px;
        -webkit-line-clamp: 2;
    }
    #all-products-view .p-card__rating,
    #all-products-view .p-card__stars {
        font-size: 0.66rem;
        gap: 2px;
        margin-bottom: 4px;
    }
    #all-products-view .p-card__stars i { font-size: 0.58rem; }
    #all-products-view .p-card__stars span,
    #all-products-view .p-card__rating span {
        font-size: 0.62rem;
        margin-left: 2px;
    }
    #all-products-view .p-card__swatches {
        min-height: 14px;
        gap: 4px;
        margin-bottom: 5px;
    }
    #all-products-view .p-card__swatch {
        width: 12px;
        height: 12px;
        border-width: 1px;
    }
    #all-products-view .p-card__swatch--default {
        box-shadow: 0 0 0 1px var(--white), 0 0 0 2px var(--cta);
    }
    #all-products-view .p-card__price-row {
        grid-template-columns: 1fr;
        align-items: stretch;
        gap: 0;
        padding-top: 3px;
        margin-top: 6px;
    }
    #all-products-view .p-card__price-wrapper { min-height: 30px; }
    #all-products-view .p-card__old-price {
        display: block;
        margin: 0 0 1px;
        font-size: 0.66rem;
    }
    #all-products-view .p-card__price { font-size: 0.86rem; }
    #all-products-view .p-card__add {
        display: none;
    }
    #all-products-view .p-card__stock,
    #all-products-view .p-card__bnpl {
        display: none;
    }
    #all-products-view .p-card__viewers { display: none; }
}

@media (max-width: 380px) {
    #all-products-grid.products__grid { gap: 8px; }
    #all-products-view .p-card__body { padding: 8px; }
    #all-products-view .p-card__name { font-size: 0.7rem; }
    #all-products-view .p-card__price { font-size: 0.82rem; }
}

@media (max-width: 768px) {
    body.cookie-banner-open .chat-bubble {
        display: none !important;
    }
    body.cookie-banner-open .gift-finder-bubble {
        display: none !important;
    }
}

/* ===== Bundle PDP ===== */
#bundle-detail-view.pdp,
#bundle-detail-view:not(.hidden) {
    padding-top: 24px;
    padding-bottom: 0;
}
#bundle-detail-view .container {
    max-width: min(1180px, 100%);
}
#bundle-detail-view:not(.hidden) #bundle-detail-content {
    padding-bottom: 0;
}
body:has(#bundle-detail-view:not(.hidden)) .us-trust-bar {
    display: none;
}
body:has(#bundle-detail-view:not(.hidden)) .chat-bubble {
    bottom: calc(158px + env(safe-area-inset-bottom, 0px));
    right: 16px;
    z-index: 210;
}
body:has(#bundle-detail-view:not(.hidden)) .gift-finder-bubble {
    bottom: calc(224px + env(safe-area-inset-bottom, 0px));
    right: 16px;
    left: auto;
    z-index: 210;
    max-width: calc(100vw - 88px);
}
body:has(#bundle-detail-view:not(.hidden)) .gift-finder-bubble__copy small {
    display: none;
}
/* ===== Bundle PDP — conversion retail layout ===== */
.bundle-pdp { padding-bottom: 28px; }
.bundle-pdp__top {
    display: grid;
    gap: 24px;
    margin-bottom: 40px;
    align-items: start;
}
@media (min-width: 900px) {
    .bundle-pdp__top {
        grid-template-columns: minmax(0, 1.12fr) minmax(320px, 0.88fr);
        gap: 40px;
        margin-bottom: 56px;
        align-items: start;
    }
}
.bundle-pdp__gallery { display: grid; gap: 10px; height: auto; }
.bundle-pdp__stage {
    position: relative;
    aspect-ratio: 1;
    background: #f3efe9;
    border: 1px solid var(--border);
    overflow: hidden;
}
.bundle-pdp__stage-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bundle-pdp__stage--mosaic {
    aspect-ratio: 1;
    min-height: 0;
    height: auto;
    padding: 12px;
    background: linear-gradient(165deg, #f7f2eb 0%, #ebe4da 100%);
}
.bundle-pdp__mosaic {
    display: grid;
    gap: 10px;
    height: 100%;
    min-height: 0;
}
.bundle-pdp__mosaic--1 { grid-template-columns: 1fr; }
.bundle-pdp__mosaic--2 { grid-template-columns: 1fr 1fr; }
.bundle-pdp__mosaic--3 {
    grid-template-columns: 1.2fr 1fr;
    grid-template-rows: 1fr 1fr;
}
.bundle-pdp__mosaic--3 .bundle-pdp__mosaic-card:first-child { grid-row: 1 / -1; }
.bundle-pdp__mosaic--4 { grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; }
.bundle-pdp__mosaic-card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 16px 12px;
    background: #fff;
    border: 1px solid rgba(44, 36, 32, 0.08);
    box-shadow: 0 8px 24px rgba(44, 36, 32, 0.06);
    text-align: center;
    min-height: 0;
    cursor: default;
}
.bundle-pdp__mosaic-card[role="button"] { cursor: pointer; }
.bundle-pdp__mosaic-card[role="button"]:hover { border-color: rgba(44, 36, 32, 0.28); }
.bundle-pdp__mosaic-num {
    position: absolute;
    top: 10px;
    left: 10px;
    width: 24px;
    height: 24px;
    display: grid;
    place-items: center;
    background: var(--text);
    color: #fff;
    font-size: 0.7rem;
    font-weight: 700;
}
.bundle-pdp__mosaic-emoji {
    width: clamp(64px, 18%, 110px);
    height: clamp(64px, 18%, 110px);
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: linear-gradient(145deg, #f3efe9, #e7ddd2);
    font-size: clamp(2rem, 4.5vw, 3.2rem);
    line-height: 1;
    flex-shrink: 0;
}
.bundle-pdp__mosaic-name {
    font-size: 0.86rem;
    font-weight: 650;
    line-height: 1.35;
    color: var(--text);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    max-width: 18ch;
}
.bundle-pdp__thumbs {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(72px, 1fr));
    gap: 8px;
}
.bundle-pdp__thumb {
    aspect-ratio: 1;
    padding: 0;
    border: 1px solid var(--border);
    background: #fff;
    cursor: pointer;
    overflow: hidden;
}
.bundle-pdp__thumb.is-active,
.bundle-pdp__thumb:hover { border-color: var(--text); }
.bundle-pdp__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bundle-pdp__save-badge {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 2;
    padding: 7px 11px;
    background: #1f7a4c;
    color: #fff;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.bundle-pdp__buy { display: flex; flex-direction: column; min-width: 0; }
.bundle-pdp__buy-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
}
.bundle-pdp__eyebrow {
    margin: 0;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--text-light);
}
.bundle-pdp__deal {
    padding: 5px 9px;
    background: #e8f5ee;
    color: #1f7a4c;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.bundle-pdp__title {
    margin: 0 0 10px;
    font-family: var(--font-display);
    font-size: clamp(1.85rem, 3vw, 2.45rem);
    font-weight: 700;
    line-height: 1.12;
    color: var(--text);
    letter-spacing: -0.02em;
}
.bundle-pdp__reviews {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 8px;
    margin: 0 0 12px;
    font-size: 0.88rem;
    color: var(--text-mid);
}
.bundle-pdp__reviews a { color: var(--text-mid); text-decoration: underline; text-underline-offset: 2px; }
.bundle-pdp__reviews--soft { color: var(--sage-dark); font-weight: 650; }
.bundle-pdp__reviews--soft i { margin-right: 4px; }
.bundle-pdp__stars { color: #c47a2c; letter-spacing: 1px; }
.bundle-pdp__desc {
    margin: 0 0 18px;
    color: var(--text-mid);
    font-size: 0.98rem;
    line-height: 1.55;
}
.bundle-pdp__price-block {
    margin-bottom: 14px;
    padding: 14px 0;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
}
.bundle-pdp__price-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 10px;
}
.bundle-pdp__price-now {
    font-size: 2rem;
    font-weight: 800;
    color: var(--text);
    letter-spacing: -0.03em;
    line-height: 1;
}
.bundle-pdp__price-was {
    font-size: 1.05rem;
    color: var(--text-light);
    text-decoration: line-through;
}
.bundle-pdp__price-pill {
    padding: 4px 8px;
    background: #e8f5ee;
    color: #1f7a4c;
    font-size: 0.78rem;
    font-weight: 800;
}
.bundle-pdp__save-line {
    margin: 8px 0 0;
    font-size: 0.9rem;
    font-weight: 650;
    color: #1f7a4c;
}
.bundle-pdp__bnpl {
    margin: 8px 0 0;
    font-size: 0.86rem;
    color: var(--text-mid);
}
.bundle-pdp__value-card {
    display: grid;
    gap: 8px;
    margin-bottom: 14px;
    padding: 12px 14px;
    background: #faf8f5;
    border: 1px solid var(--border);
}
.bundle-pdp__value-card > div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    font-size: 0.88rem;
    color: var(--text-mid);
}
.bundle-pdp__value-card strong { color: var(--text); font-weight: 700; }
.bundle-pdp__value-card-save { padding-top: 8px; border-top: 1px dashed var(--border); }
.bundle-pdp__value-card-save,
.bundle-pdp__value-card-save strong { color: #1f7a4c; }
.bundle-pdp__stock {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
    font-size: 0.88rem;
    font-weight: 650;
    color: #1f7a4c;
}
.bundle-pdp__stock i { font-size: 0.95rem; }
.bundle-pdp__cta {
    width: 100%;
    border: 0;
    border-radius: 6px;
    padding: 16px 20px;
    background: var(--cta);
    color: #fff;
    font: inherit;
    font-size: 1.05rem;
    font-weight: 800;
    letter-spacing: 0.01em;
    cursor: pointer;
    transition: background 0.2s var(--ease), transform 0.15s var(--ease);
}
.bundle-pdp__cta:hover { background: var(--cta-hover); transform: translateY(-1px); }
.bundle-pdp__cta--secondary {
    margin-top: 20px;
    max-width: 420px;
}
.bundle-pdp__ship {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 10px 0 0;
    font-size: 0.84rem;
    color: var(--text-mid);
}
.bundle-pdp__trust {
    list-style: none;
    margin: 16px 0 0;
    padding: 14px 0 0;
    border-top: 1px solid var(--border);
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}
.bundle-pdp__trust li {
    display: grid;
    gap: 6px;
    justify-items: center;
    text-align: center;
    font-size: 0.72rem;
    font-weight: 650;
    color: var(--text-mid);
    line-height: 1.3;
}
.bundle-pdp__trust i { font-size: 1rem; color: var(--sage-dark); }
.bundle-pdp__bullets {
    list-style: none;
    margin: 16px 0 0;
    padding: 0;
    display: grid;
    gap: 8px;
}
.bundle-pdp__bullets li {
    display: grid;
    grid-template-columns: 18px 1fr;
    gap: 8px;
    align-items: start;
    font-size: 0.9rem;
    line-height: 1.4;
    color: var(--text-mid);
}
.bundle-pdp__bullets i { color: #1f7a4c; font-size: 0.72rem; margin-top: 4px; }
.bundle-pdp__section { margin-bottom: 44px; max-width: 960px; }
.bundle-pdp__section-head { margin-bottom: 18px; }
.bundle-pdp__section-head h2,
.bundle-pdp__section-title {
    margin: 0 0 6px;
    font-family: var(--font-display);
    font-size: 1.45rem;
    font-weight: 700;
    color: var(--text);
}
.bundle-pdp__section-head p { margin: 0; font-size: 0.9rem; color: var(--text-light); }
.bundle-pdp__items { display: grid; gap: 12px; }
@media (min-width: 720px) {
    .bundle-pdp__items { grid-template-columns: 1fr 1fr; gap: 14px; }
}
.bundle-pdp__item {
    display: grid;
    grid-template-columns: 96px 1fr auto;
    gap: 12px;
    align-items: center;
    padding: 12px;
    background: #fff;
    border: 1px solid var(--border);
}
.bundle-pdp__item--link { cursor: pointer; transition: border-color 0.2s var(--ease), box-shadow 0.2s var(--ease); }
.bundle-pdp__item--link:hover {
    border-color: rgba(44, 36, 32, 0.35);
    box-shadow: 0 6px 18px rgba(44, 36, 32, 0.06);
}
.bundle-pdp__item-media {
    position: relative;
    width: 96px;
    height: 96px;
    overflow: hidden;
    background: #f3efe9;
    display: flex;
    align-items: center;
    justify-content: center;
}
.bundle-pdp__item-media img { width: 100%; height: 100%; object-fit: cover; }
.bundle-pdp__item-fallback { font-size: 1.8rem; }
.bundle-pdp__item-num {
    position: absolute;
    top: 6px;
    left: 6px;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    background: rgba(44, 36, 32, 0.8);
    color: #fff;
    font-size: 0.68rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.bundle-pdp__item-meta {
    margin: 0 0 4px;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #1f7a4c;
}
.bundle-pdp__item-name {
    margin: 0 0 6px;
    font-size: 0.94rem;
    font-weight: 650;
    color: var(--text);
    line-height: 1.3;
}
.bundle-pdp__item-go {
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--text);
    text-decoration: underline;
    text-underline-offset: 2px;
}
.bundle-pdp__item-retail { font-size: 0.95rem; font-weight: 700; color: var(--text); }
.bundle-pdp__note { margin: 12px 0 0; font-size: 0.84rem; color: var(--text-light); }

/* What's Inside — compact on mobile, proportional to buy box */
#bundle-whats-inside { margin-bottom: 32px; }
#bundle-whats-inside .bundle-pdp__section-head { margin-bottom: 12px; }
#bundle-whats-inside .bundle-pdp__section-head h2 { font-size: 1.15rem; margin-bottom: 4px; }
#bundle-whats-inside .bundle-pdp__section-head p { font-size: 0.82rem; }
#bundle-whats-inside .bundle-pdp__items { gap: 8px; }
#bundle-whats-inside .bundle-pdp__item {
    grid-template-columns: 72px 1fr auto;
    gap: 10px;
    padding: 10px;
}
#bundle-whats-inside .bundle-pdp__item-media { width: 72px; height: 72px; }
#bundle-whats-inside .bundle-pdp__item-fallback { font-size: 1.35rem; }
#bundle-whats-inside .bundle-pdp__item-meta { font-size: 0.62rem; margin-bottom: 2px; }
#bundle-whats-inside .bundle-pdp__item-name { font-size: 0.84rem; margin-bottom: 4px; line-height: 1.25; }
#bundle-whats-inside .bundle-pdp__item-go { font-size: 0.72rem; }
#bundle-whats-inside .bundle-pdp__item-retail { font-size: 0.88rem; align-self: center; }
#bundle-whats-inside .bundle-pdp__note { margin-top: 8px; font-size: 0.78rem; }
#bundle-whats-inside .bundle-pdp__cta--secondary {
    margin-top: 14px;
    max-width: none;
    padding: 11px 16px;
    font-size: 0.9rem;
    font-weight: 750;
}
@media (min-width: 720px) {
    #bundle-whats-inside .bundle-pdp__section-head h2 { font-size: 1.28rem; }
    #bundle-whats-inside .bundle-pdp__items { gap: 10px; }
    #bundle-whats-inside .bundle-pdp__item {
        grid-template-columns: 80px 1fr auto;
        padding: 11px;
    }
    #bundle-whats-inside .bundle-pdp__item-media { width: 80px; height: 80px; }
    #bundle-whats-inside .bundle-pdp__cta--secondary {
        max-width: 360px;
        padding: 12px 18px;
        font-size: 0.94rem;
    }
}

.bundle-pdp__gift {
    margin: 0 0 12px;
    padding: 10px 12px;
    background: #faf8f5;
    border: 1px solid var(--border);
}
.bundle-pdp__gift-toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    font-size: 0.88rem;
    font-weight: 650;
    cursor: pointer;
}
.bundle-pdp__gift-toggle input { width: 16px; height: 16px; accent-color: var(--cta); }
.bundle-pdp__gift-panel {
    margin-top: 10px;
}
.bundle-pdp__gift-panel[hidden] {
    display: none;
}
.bundle-pdp__gift-note {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid var(--border);
    border-radius: 6px;
    padding: 10px 12px;
    font: inherit;
    font-size: 0.88rem;
    background: #fff;
    resize: vertical;
    min-height: 64px;
}
.bundle-pdp__faq-list { border-top: 1px solid var(--border); }
.bundle-pdp__faq-item { border-bottom: 1px solid var(--border); }
.bundle-pdp__faq-item summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 15px 0;
    font-size: 0.98rem;
    font-weight: 650;
}
.bundle-pdp__faq-item summary::-webkit-details-marker { display: none; }
.bundle-pdp__faq-item summary i {
    font-size: 0.7rem;
    color: var(--text-light);
    transition: transform 0.2s var(--ease);
}
.bundle-pdp__faq-item[open] summary i { transform: rotate(180deg); }
.bundle-pdp__faq-item p {
    margin: 0 0 15px;
    padding-right: 24px;
    font-size: 0.92rem;
    line-height: 1.55;
    color: var(--text-mid);
}
.bundle-pdp__sticky {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 40;
    padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
    background: rgba(255,255,255,0.97);
    border-top: 1px solid var(--border);
    transform: translateY(110%);
    opacity: 0;
    pointer-events: none;
    transition: transform 0.28s var(--ease), opacity 0.28s var(--ease);
}
.bundle-pdp__sticky--visible {
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto;
}
.bundle-pdp__sticky-inner {
    max-width: min(980px, 100%);
    margin: 0 auto;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 12px;
    align-items: center;
}
.bundle-pdp__sticky-price { font-size: 1.15rem; font-weight: 800; color: var(--text); }
.bundle-pdp__sticky-save { font-size: 0.78rem; font-weight: 800; color: #1f7a4c; }
.bundle-pdp__sticky-cta {
    width: 100%;
    border: 0;
    border-radius: 6px;
    padding: 14px 16px;
    background: var(--cta);
    color: #fff;
    font: inherit;
    font-size: 0.95rem;
    font-weight: 800;
    cursor: pointer;
}
.bundle-pdp__sticky-cta:hover { background: var(--cta-hover); }
@media (max-width: 899px) {
    .bundle-pdp__stage--mosaic { min-height: 300px; }
    .bundle-pdp__mosaic { min-height: 272px; }
    .bundle-pdp__mosaic-emoji { width: 56px; height: 56px; font-size: 1.9rem; }
    .bundle-pdp__trust { grid-template-columns: 1fr; justify-items: start; }
    .bundle-pdp__trust li { grid-template-columns: 20px 1fr; justify-items: start; text-align: left; align-items: center; }
}