/* ==========================================================
   Design tokens
   Palette: Charcoal (ink), Bone (paper), Cognac (leather), 
            Brass (hardware accent), Slate (secondary text)
   Type: Fraunces (display/stamped headings), Inter (body), 
         IBM Plex Mono (specs, SKU, dimensions - technical feel)
   Signature: product cards rendered as hanging luggage tags
   ========================================================== */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,600;9..144,700&family=Inter:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root {
    --ink: #211f1d;
    --bone: #f1eada;
    --cognac: #a9673b;
    --cognac-dark: #834f2c;
    --brass: #b8935a;
    --slate: #6b6558;
    --line: #ddd2bd;
    --radius-tag: 6px;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

body {
    background: var(--bone);
    color: var(--ink);
    font-family: 'Inter', sans-serif;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, .display {
    font-family: 'Fraunces', serif;
    font-weight: 600;
    letter-spacing: -0.01em;
    color: var(--ink);
}

.mono, .price, .sku {
    font-family: 'IBM Plex Mono', monospace;
}

a { color: inherit; text-decoration: none; }

.container { max-width: 1180px; margin: 0 auto; padding: 0 24px; }

/* ---------- Header ---------- */
.site-header {
    background: var(--ink);
    color: var(--bone);
    border-bottom: 3px solid var(--brass);
}
.header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 24px;
    max-width: 1180px;
    margin: 0 auto;
}
.logo {
    font-family: 'Fraunces', serif;
    font-size: 1.4rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}
.logo span { color: var(--brass); }
.main-nav { display: flex; gap: 28px; }
.main-nav a {
    font-size: 0.82rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--bone);
    opacity: 0.85;
    position: relative;
    padding-bottom: 4px;
}
.main-nav a:hover { opacity: 1; border-bottom: 1px solid var(--brass); }
.header-actions { display: flex; gap: 18px; align-items: center; font-size: 0.85rem; }

/* ---------- Hero: boarding-pass strip ---------- */
.hero {
    background: var(--ink);
    color: var(--bone);
    position: relative;
    overflow: hidden;
}
.boarding-strip {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 24px;
    background: var(--cognac-dark);
    font-family: 'IBM Plex Mono', monospace;
    font-size: 0.72rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--bone);
    border-bottom: 1px dashed rgba(241,234,218,0.4);
}
.hero-inner {
    max-width: 1180px;
    margin: 0 auto;
    padding: 70px 24px 90px;
    display: grid;
    grid-template-columns: 1.1fr 0.9fr;
    gap: 40px;
    align-items: center;
}
.hero-eyebrow {
    font-family: 'IBM Plex Mono', monospace;
    font-size: 0.75rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--brass);
    margin-bottom: 18px;
}
.hero h1 {
    font-size: clamp(2.4rem, 5vw, 4rem);
    line-height: 1.02;
    margin-bottom: 20px;
}
.hero p.sub {
    font-size: 1.05rem;
    color: #cfc7b4;
    max-width: 460px;
    margin-bottom: 32px;
}
.btn-primary {
    display: inline-block;
    background: var(--brass);
    color: var(--ink);
    font-weight: 600;
    padding: 14px 30px;
    border-radius: var(--radius-tag);
    font-size: 0.95rem;
    transition: transform 0.15s ease, background 0.15s ease;
}
.btn-primary:hover { background: #c7a15a; transform: translateY(-1px); }

.hero-tag-visual {
    position: relative;
    display: flex;
    justify-content: center;
}
.hero-tag-visual .tag-card {
    transform: rotate(-6deg);
}

/* ---------- Section heading ---------- */
.section-heading {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin: 64px 0 28px;
}
.section-heading h2 { font-size: 1.9rem; }
.section-heading .stamp {
    font-family: 'IBM Plex Mono', monospace;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--slate);
    border: 1px solid var(--line);
    padding: 5px 10px;
    border-radius: 3px;
}

/* ---------- Product grid: luggage-tag cards ---------- */
.product-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 28px;
    padding-bottom: 80px;
}
@media (max-width: 900px) {
    .product-grid { grid-template-columns: repeat(2, 1fr); }
    .hero-inner { grid-template-columns: 1fr; }
}
@media (max-width: 540px) {
    .product-grid { grid-template-columns: 1fr; }
    .main-nav { display: none; }
}

.tag-card {
    background: #fffdf8;
    border: 1px solid var(--line);
    border-radius: var(--radius-tag);
    padding: 18px 18px 20px;
    position: relative;
    box-shadow: 0 1px 0 rgba(33,31,29,0.03);
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.tag-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 24px -12px rgba(33,31,29,0.25);
}
/* punched hole + string, the signature detail */
.tag-card::before {
    content: "";
    position: absolute;
    top: 14px;
    left: 14px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--bone);
    border: 2px solid var(--slate);
}
.tag-card .tag-image {
    width: 100%;
    aspect-ratio: 1 / 1.1;
    background: var(--bone);
    border-radius: 4px;
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--slate);
    font-family: 'IBM Plex Mono', monospace;
    font-size: 0.75rem;
    overflow: hidden;
}
.tag-card .tag-image img { width: 100%; height: 100%; object-fit: cover; }
.tag-card h3 {
    font-size: 1.05rem;
    margin-bottom: 6px;
}
.tag-card .price {
    font-size: 0.95rem;
    color: var(--cognac-dark);
    font-weight: 500;
}
.tag-card .spec-line {
    font-family: 'IBM Plex Mono', monospace;
    font-size: 0.7rem;
    color: var(--slate);
    margin-top: 8px;
    border-top: 1px dashed var(--line);
    padding-top: 8px;
}

/* ---------- Mega Menu ---------- */
.mega-menu-item { position: relative; }
.mega-menu-dropdown {
    display: none;
    position: absolute;
    top: 100%; left: 0;
    background: #fffdf8;
    border: 1px solid var(--line);
    border-radius: 6px;
    padding: 10px 0;
    min-width: 160px;
    box-shadow: 0 14px 30px -10px rgba(0,0,0,0.25);
    z-index: 40;
}
.mega-menu-item:hover .mega-menu-dropdown { display: block; }
.mega-menu-dropdown a {
    display: block;
    padding: 8px 16px;
    color: var(--ink);
    font-size: 0.82rem;
    text-transform: none;
    letter-spacing: normal;
}
.mega-menu-dropdown a:hover { background: var(--bone); }

/* ---------- Wishlist ---------- */
.wishlist-heart-btn {
    position: absolute;
    top: 12px; left: 12px;
    background: rgba(255,253,248,0.9);
    border: 1px solid var(--line);
    border-radius: 50%;
    width: 30px; height: 30px;
    cursor: pointer;
    color: var(--slate);
    font-size: 0.95rem;
    z-index: 2;
}
.wishlist-heart-btn.is-active { color: var(--cognac); border-color: var(--cognac); }
.detail-wishlist-btn { position: static; }

/* ---------- Color Swatches ---------- */
.color-swatch-row { display: flex; gap: 8px; }
.color-swatch {
    width: 26px; height: 26px;
    border-radius: 50%;
    display: inline-block;
    cursor: pointer;
    border: 2px solid transparent;
}
.color-swatch.active { border-color: var(--cognac); }

/* ---------- Product Tabs ---------- */
.product-tabs { margin-top: 10px; }
.tab-headers { display: flex; gap: 4px; border-bottom: 1px solid var(--line); margin-bottom: 16px; }
.tab-header {
    background: none; border: none;
    padding: 10px 14px;
    font-size: 0.82rem;
    color: var(--slate);
    cursor: pointer;
    border-bottom: 2px solid transparent;
}
.tab-header.active { color: var(--ink); border-bottom-color: var(--cognac); font-weight: 500; }
.tab-panel { display: none; }
.tab-panel.active { display: block; }
.spec-table { width: 100%; border-collapse: collapse; font-size: 0.88rem; }
.spec-table td { padding: 8px 0; border-bottom: 1px solid var(--line); }
.spec-table td:first-child { color: var(--slate); width: 40%; }

/* ---------- Sticky Mobile Add-to-Cart Bar ---------- */
.sticky-add-bar {
    display: none;
    position: fixed;
    bottom: 0; left: 0; right: 0;
    background: #fffdf8;
    border-top: 1px solid var(--line);
    padding: 12px 16px;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    z-index: 80;
    box-shadow: 0 -8px 20px rgba(0,0,0,0.08);
}
.sticky-add-bar.visible { display: flex; }
.sticky-add-info { display: flex; flex-direction: column; font-size: 0.8rem; }
.sticky-add-bar .btn-primary { flex-shrink: 0; padding: 10px 20px; }
@media (min-width: 701px) { .sticky-add-bar { display: none !important; } }

/* ---------- Category Listing: filters + view toggle ---------- */
.listing-layout { display: grid; grid-template-columns: 220px 1fr; gap: 34px; padding-bottom: 80px; }
.listing-sidebar { position: sticky; top: 20px; align-self: start; }
.filter-group { margin-bottom: 20px; }
.view-toggle { display: flex; gap: 6px; }
.view-toggle-btn {
    background: none;
    border: 1px solid var(--line);
    border-radius: 4px;
    padding: 6px 12px;
    font-size: 0.75rem;
    cursor: pointer;
    color: var(--slate);
}
.view-toggle-btn.active { background: var(--ink); color: var(--brass); border-color: var(--ink); }
.product-grid.list-view { grid-template-columns: 1fr; }
.product-grid.list-view .tag-card { display: flex; gap: 20px; align-items: center; }
.product-grid.list-view .tag-card > a { display: flex; gap: 20px; flex: 1; align-items: center; }
.product-grid.list-view .tag-image { width: 100px; height: 100px; flex-shrink: 0; }
.product-grid.list-view .card-actions { flex-direction: column; width: 140px; }
@media (max-width: 800px) {
    .listing-layout { grid-template-columns: 1fr; }
    .listing-sidebar { position: static; }
}

/* ---------- Order Tracking ---------- */
.track-timeline { display: flex; justify-content: space-between; margin: 20px 0; position: relative; }
.track-timeline::before {
    content: "";
    position: absolute;
    top: 6px; left: 0; right: 0;
    height: 2px;
    background: var(--line);
}
.track-stage { position: relative; text-align: center; font-size: 0.72rem; color: var(--slate); flex: 1; }
.track-dot { display: block; width: 14px; height: 14px; border-radius: 50%; background: var(--line); margin: 0 auto 8px; position: relative; z-index: 1; }
.track-stage.done .track-dot { background: var(--cognac); }
.track-stage.done { color: var(--ink); font-weight: 500; }

/* ---------- Static Pages (FAQ / Material Care / Size Guide) ---------- */
.page-content h3 { font-size: 1.05rem; margin: 20px 0 8px; }
.page-content p { color: var(--slate); font-size: 0.9rem; margin-bottom: 6px; }

/* ---------- Newsletter Popup ---------- */
.newsletter-popup {
    display: none;
    position: fixed;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    background: #fffdf8;
    border-radius: 10px;
    padding: 32px;
    max-width: 380px; width: 90vw;
    z-index: 96;
    box-shadow: 0 20px 50px rgba(0,0,0,0.3);
    text-align: center;
}
.newsletter-popup.open { display: block; }
.newsletter-popup h3 { font-family: 'Fraunces', serif; }

/* ---------- AI Assistant Chat ---------- */
.ai-chat-shell {
    background: #fffdf8;
    border: 1px solid var(--line);
    border-radius: 8px;
    max-width: 700px;
    display: flex;
    flex-direction: column;
    height: 560px;
}
.ai-chat-log { flex: 1; overflow-y: auto; padding: 20px; display: flex; flex-direction: column; gap: 12px; }
.ai-msg { max-width: 85%; padding: 10px 14px; border-radius: 10px; font-size: 0.88rem; line-height: 1.5; }
.ai-msg-user { align-self: flex-end; background: var(--ink); color: var(--bone); }
.ai-msg-assistant { align-self: flex-start; background: var(--bone); color: var(--ink); }
.ai-chat-input-row { display: flex; gap: 8px; padding: 14px; border-top: 1px solid var(--line); }
.ai-chat-input-row .form-input { flex: 1; }
.ai-action-card {
    margin-top: 10px;
    background: #fffdf8;
    border: 1px solid var(--brass);
    border-radius: 6px;
    padding: 12px 14px;
    font-size: 0.85rem;
}

/* ---------- Compare Table ---------- */
.compare-table-wrap { overflow-x: auto; }
.compare-table { border-collapse: collapse; width: 100%; min-width: 600px; }
.compare-table td { padding: 14px 18px; border-bottom: 1px solid var(--line); text-align: center; vertical-align: top; }
.compare-label { text-align: left !important; color: var(--slate); font-size: 0.82rem; white-space: nowrap; }
.compare-remove-btn { background: none; border: none; color: var(--slate); font-size: 0.75rem; text-decoration: underline; cursor: pointer; margin-top: 6px; }

/* ---------- Instagram Gallery ---------- */
.instagram-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 4px;
}
.instagram-tile { position: relative; aspect-ratio: 1/1; overflow: hidden; display: block; }
.instagram-tile img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s ease; }
.instagram-tile:hover img { transform: scale(1.06); }
.instagram-tile-overlay {
    position: absolute; inset: 0;
    background: rgba(33,31,29,0.35);
    color: var(--bone);
    display: flex; align-items: center; justify-content: center;
    font-size: 1.4rem;
    opacity: 0;
    transition: opacity 0.2s ease;
}
.instagram-tile:hover .instagram-tile-overlay { opacity: 1; }
@media (max-width: 700px) { .instagram-grid { grid-template-columns: repeat(3, 1fr); } }

/* ---------- Video Slider ---------- */
.video-slider-section { padding-bottom: 60px; }
.video-slider-track {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    padding: 0 24px 10px;
    scroll-snap-type: x mandatory;
}
.video-slide-card {
    position: relative;
    flex: 0 0 220px;
    aspect-ratio: 9/16;
    border-radius: 10px;
    overflow: hidden;
    background: var(--ink);
    scroll-snap-align: start;
    display: block;
}
.video-slide-card video { width: 100%; height: 100%; object-fit: cover; cursor: pointer; }
.video-slide-caption {
    position: absolute; bottom: 12px; left: 12px; right: 12px;
    color: var(--bone);
    font-size: 0.82rem;
    text-shadow: 0 2px 6px rgba(0,0,0,0.6);
}
.video-slide-play {
    position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
    width: 40px; height: 40px;
    background: rgba(255,255,255,0.85);
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    color: var(--ink);
    font-size: 0.9rem;
    pointer-events: none;
}

/* ---------- Admin Panel ---------- */
.admin-body { background: #f4efe2; }
.admin-shell { display: flex; min-height: 100vh; }
.admin-sidebar {
    width: 230px;
    background: var(--ink);
    color: var(--bone);
    padding: 24px 18px;
    flex-shrink: 0;
}
.admin-logo { font-family: 'Fraunces', serif; font-weight: 700; font-size: 1.1rem; margin-bottom: 28px; }
.admin-logo span { color: var(--brass); }
.admin-logo small { display: block; font-family: 'IBM Plex Mono', monospace; font-size: 0.6rem; letter-spacing: 0.1em; opacity: 0.6; margin-top: 2px; }
.admin-nav { display: flex; flex-direction: column; gap: 4px; }
.admin-nav a {
    padding: 9px 10px;
    border-radius: 4px;
    font-size: 0.85rem;
    color: #cfc7b4;
}
.admin-nav a:hover { background: rgba(241,234,218,0.08); color: var(--bone); }
.admin-nav .admin-logout { margin-top: 20px; border-top: 1px solid rgba(241,234,218,0.15); padding-top: 14px; color: #c98f6f; }
.admin-main { flex: 1; padding: 40px 44px; max-width: 900px; }
.admin-login-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; }

.admin-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.admin-card {
    background: #fffdf8;
    border: 1px solid var(--line);
    border-radius: 6px;
    padding: 20px;
    display: block;
}
.admin-card:hover { border-color: var(--cognac); }
.admin-card h3 { font-size: 1rem; margin-bottom: 6px; }
.admin-card p { font-size: 0.82rem; color: var(--slate); }

.admin-list { display: flex; flex-direction: column; gap: 8px; }
.admin-list-row {
    display: flex;
    align-items: center;
    gap: 12px;
    background: #fffdf8;
    border: 1px solid var(--line);
    border-radius: 6px;
    padding: 10px 14px;
    font-size: 0.88rem;
}
.admin-list-row.row-inactive { opacity: 0.5; }
.admin-thumb { width: 44px; height: 44px; border-radius: 4px; overflow: hidden; flex-shrink: 0; background: var(--bone); }
.admin-thumb img { width: 100%; height: 100%; object-fit: cover; }
.admin-btn-icon {
    background: none;
    border: 1px solid var(--line);
    border-radius: 4px;
    width: 30px; height: 30px;
    cursor: pointer;
    font-size: 0.8rem;
    color: var(--ink);
    display: inline-flex; align-items: center; justify-content: center;
}
.admin-btn-icon:hover { border-color: var(--cognac); }
.admin-btn-toggle {
    border: none;
    border-radius: 4px;
    padding: 6px 12px;
    font-size: 0.72rem;
    font-family: 'IBM Plex Mono', monospace;
    text-transform: uppercase;
    cursor: pointer;
    background: #e2d9c4;
    color: var(--slate);
}
.admin-btn-toggle.is-on { background: var(--brass); color: var(--ink); }
@media (max-width: 800px) {
    .admin-shell { flex-direction: column; }
    .admin-sidebar { width: 100%; }
    .admin-main { padding: 24px; }
    .admin-grid { grid-template-columns: 1fr; }
}

/* ---------- 360° Product Spin Viewer ---------- */
.spin-viewer {
    position: relative;
    aspect-ratio: 1/1;
    border-radius: 8px;
    overflow: hidden;
    background: var(--bone);
    cursor: grab;
    touch-action: pan-y;
    box-shadow: 0 20px 40px -20px rgba(33,31,29,0.35), 0 2px 8px rgba(33,31,29,0.12);
}
.spin-viewer.dragging { cursor: grabbing; }
.spin-frame {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    object-fit: cover;
    opacity: 0;
    pointer-events: none;
    user-select: none;
    -webkit-user-drag: none;
}
.spin-frame.active { opacity: 1; }
.spin-viewer-hint {
    position: absolute;
    bottom: 14px; left: 50%;
    transform: translateX(-50%);
    background: rgba(33,31,29,0.75);
    color: var(--bone);
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 0.72rem;
    display: flex; align-items: center; gap: 6px;
    pointer-events: none;
    transition: opacity 0.3s ease;
}
.spin-viewer.interacted .spin-viewer-hint { opacity: 0; }
.spin-icon { display: inline-block; animation: spin-hint-rotate 2s linear infinite; }
@keyframes spin-hint-rotate { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

/* ============================================================
   Luxury Theme Studio — 12 full visual systems
   Each theme changes the actual storefront treatment: surfaces,
   gradients, borders, glow, controls and hero atmosphere.
   Festival palettes below can be layered on top.
   ============================================================ */
body[class*="site-theme-"] {
    --lux-shadow: 0 24px 70px rgba(0,0,0,.12);
    --lux-glow: 0 0 0 rgba(0,0,0,0);
}
body.site-theme-signature { --ink:#181513; --bone:#f4efe5; --cognac:#a9673b; --cognac-dark:#704027; --brass:#c4a267; --line:#ded3c0; }
body.site-theme-midnight_luxe { --ink:#080b10; --bone:#f1eee8; --cognac:#9c7650; --cognac-dark:#513b29; --brass:#d4b77b; --line:#2e343d; background:radial-gradient(circle at 70% -10%,rgba(212,183,123,.10),transparent 35%),#0d1015; color:#eeeae2; }
body.site-theme-aurora { --ink:#080b13; --bone:#f4f5f7; --cognac:#8a63df; --cognac-dark:#5234a0; --brass:#6fe7e0; --line:#30364a; background:#0a0d16; color:#f5f7fb; }
body.site-theme-obsidian_gold { --ink:#070707; --bone:#f4f0e7; --cognac:#9d7636; --cognac-dark:#4d3515; --brass:#e0b95d; --line:#34302a; background:#090909; color:#f3eee4; }
body.site-theme-titanium { --ink:#11161d; --bone:#edf1f4; --cognac:#5b728a; --cognac-dark:#334858; --brass:#9fc5e5; --line:#ccd5dd; }
body.site-theme-royal_noir { --ink:#100a13; --bone:#f5f0f4; --cognac:#9b5b83; --cognac-dark:#54273f; --brass:#d9b36c; --line:#3b2a39; background:#120b15; color:#f4edf3; }
body.site-theme-cyber_chrome { --ink:#05080b; --bone:#eef7fb; --cognac:#1689c7; --cognac-dark:#075078; --brass:#55d9ff; --line:#243b49; background:#060b10; color:#eaf7fb; }
body.site-theme-emerald_noir { --ink:#06100c; --bone:#eff5f1; --cognac:#1f8c67; --cognac-dark:#0e4b38; --brass:#b7d68c; --line:#294239; background:#07110d; color:#eef6f1; }
body.site-theme-desert_luxe { --ink:#1c1510; --bone:#f4eadb; --cognac:#a96d45; --cognac-dark:#68402b; --brass:#d7aa67; --line:#d9c2a7; }
body.site-theme-pearl_luxe { --ink:#20252b; --bone:#f7f7f4; --cognac:#73808c; --cognac-dark:#4b5661; --brass:#b8a37d; --line:#d9dce0; }
body.site-theme-violet_neon { --ink:#090410; --bone:#f7f1fb; --cognac:#9d39db; --cognac-dark:#58127f; --brass:#ff4ed8; --line:#392047; background:#0b0510; color:#f7f0fb; }
body.site-theme-monochrome { --ink:#080808; --bone:#f3f3f1; --cognac:#5b5b5b; --cognac-dark:#2c2c2c; --brass:#d2d2d2; --line:#303030; background:#0b0b0b; color:#f1f1ef; }

body[class*="site-theme-"] .site-header {
    border-bottom:1px solid color-mix(in srgb, var(--brass) 65%, transparent);
    box-shadow:0 14px 40px rgba(0,0,0,.16);
}
body[class*="site-theme-"] .hero { box-shadow:inset 0 -1px rgba(255,255,255,.06); }
body[class*="site-theme-"] .btn-primary,
body[class*="site-theme-"] button.btn-primary {
    border:1px solid color-mix(in srgb, var(--brass) 60%, transparent);
    box-shadow:0 10px 28px rgba(0,0,0,.16), inset 0 1px rgba(255,255,255,.12);
    transition:transform .25s ease,box-shadow .25s ease,filter .25s ease;
}
body[class*="site-theme-"] .btn-primary:hover { transform:translateY(-2px); box-shadow:0 18px 40px rgba(0,0,0,.22),0 0 28px color-mix(in srgb,var(--brass) 18%,transparent); filter:brightness(1.04); }
body[class*="site-theme-"] .product-card,
body[class*="site-theme-"] .tag-card,
body[class*="site-theme-"] .admin-card { box-shadow:var(--lux-shadow); }
body[class*="site-theme-"] .product-card:hover,
body[class*="site-theme-"] .tag-card:hover { transform:translateY(-5px); box-shadow:0 28px 60px rgba(0,0,0,.20); }
body[class*="site-theme-"] .hero::before,
body[class*="site-theme-"] .hero::after { content:"";position:absolute;pointer-events:none;border-radius:50%;filter:blur(2px);opacity:.6; }
body.site-theme-aurora .hero::before { width:520px;height:520px;right:-180px;top:-180px;background:radial-gradient(circle,rgba(111,231,224,.28),transparent 68%); }
body.site-theme-aurora .hero::after { width:420px;height:420px;left:-170px;bottom:-180px;background:radial-gradient(circle,rgba(138,99,223,.25),transparent 68%); }
body.site-theme-cyber_chrome .hero::before { width:650px;height:2px;right:4%;top:28%;background:linear-gradient(90deg,transparent,var(--brass),transparent);box-shadow:0 0 24px var(--brass);transform:rotate(-18deg); }
body.site-theme-violet_neon .hero::before { width:500px;height:500px;right:-150px;top:-190px;background:radial-gradient(circle,rgba(255,78,216,.26),transparent 66%); }
body.site-theme-obsidian_gold .hero::after { width:450px;height:450px;right:-160px;bottom:-230px;background:radial-gradient(circle,rgba(224,185,93,.16),transparent 68%); }
body.site-theme-royal_noir .hero::after { width:500px;height:500px;right:-180px;top:-200px;background:radial-gradient(circle,rgba(155,91,131,.22),transparent 68%); }
body.site-theme-emerald_noir .hero::after { width:500px;height:500px;right:-190px;top:-220px;background:radial-gradient(circle,rgba(31,140,103,.20),transparent 70%); }
body.site-theme-titanium .hero::before { width:100%;height:1px;left:0;top:24%;background:linear-gradient(90deg,transparent,#9fc5e5,transparent);opacity:.45; }
body.site-theme-monochrome .hero::before { width:75%;height:1px;left:12%;top:25%;background:linear-gradient(90deg,transparent,#fff,transparent);opacity:.2; }
body.site-theme-midnight_luxe .hero::after { width:480px;height:480px;right:-180px;bottom:-230px;background:radial-gradient(circle,rgba(212,183,123,.14),transparent 70%); }
body.site-theme-pearl_luxe .hero { background:linear-gradient(135deg,#20262d,#59636d 58%,#252b31); }
body.site-theme-desert_luxe .hero { background:radial-gradient(circle at 80% 20%,rgba(215,170,103,.17),transparent 30%),#1c1510; }
body.site-theme-signature .hero { background:linear-gradient(120deg,#181513,#29211c 58%,#3c2a20); }

/* Festival skins are intentionally cinematic and can be layered over any core theme. */
body.palette-diwali .site-header, body.palette-diwali .hero { background:radial-gradient(circle at 78% 18%,rgba(255,196,75,.18),transparent 25%),linear-gradient(135deg,#170708,#3c0e18 58%,#1a1008); }
body.palette-holi .site-header, body.palette-holi .hero { background:radial-gradient(circle at 18% 30%,rgba(0,216,190,.22),transparent 25%),radial-gradient(circle at 82% 20%,rgba(255,58,160,.22),transparent 25%),#120a15; }
body.palette-wedding .site-header, body.palette-wedding .hero { background:linear-gradient(135deg,#1c1318,#4c2738,#1d1718); }
body.palette-rakhi .site-header, body.palette-rakhi .hero { background:radial-gradient(circle at 75% 25%,rgba(232,185,35,.20),transparent 26%),linear-gradient(135deg,#180506,#551018,#160b07); }
body.palette-navratri .site-header, body.palette-navratri .hero { background:radial-gradient(circle at 20% 20%,rgba(242,165,44,.20),transparent 25%),linear-gradient(135deg,#120512,#5b1235,#1a0b20); }
body.palette-eid .site-header, body.palette-eid .hero { background:radial-gradient(circle at 80% 20%,rgba(212,175,55,.18),transparent 25%),linear-gradient(135deg,#03100c,#0b3c2a,#07130f); }
body.palette-christmas .site-header, body.palette-christmas .hero { background:radial-gradient(circle at 75% 15%,rgba(201,162,39,.16),transparent 25%),linear-gradient(135deg,#06120e,#0e3d2d,#260a10); }
body.palette-patriotic .site-header, body.palette-patriotic .hero { background:linear-gradient(115deg,#19130b,#6e3a12 48%,#0b3922); }
body.palette-summer .site-header, body.palette-summer .hero { background:radial-gradient(circle at 78% 18%,rgba(242,183,5,.20),transparent 26%),linear-gradient(135deg,#06141d,#0c6178,#0a2734); }
body.palette-monsoon .site-header, body.palette-monsoon .hero { background:radial-gradient(circle at 78% 15%,rgba(109,191,174,.17),transparent 26%),linear-gradient(135deg,#061019,#173b55,#0b1e2a); }
body.palette-newyear .site-header, body.palette-newyear .hero { background:radial-gradient(circle at 70% 15%,rgba(220,230,240,.18),transparent 24%),linear-gradient(135deg,#020304,#202a33,#090b0d); }
body.palette-valentines .site-header, body.palette-valentines .hero { background:radial-gradient(circle at 78% 20%,rgba(255,78,134,.20),transparent 25%),linear-gradient(135deg,#100408,#5a0e27,#150a0d); }

/* ============================================================
   Festive Palettes — override the base color tokens (from :root)
   at the body level. Everything below already references these
   same variables (--cognac, --brass, etc), so a palette swap
   re-skins the whole site without touching layout or any other
   CSS rule. Combinable with either motion theme (Classic/3D).
   ============================================================ */

/* Diwali — deep maroon + bright gold, warm festive-lights mood */
body.palette-diwali {
    --cognac: #8c2f39;
    --cognac-dark: #6e1f28;
    --brass: #d4a437;
    --bone: #fbf3e6;
    --line: #e8d3a8;
}
body.palette-diwali .announcement-bar { background: #6e1f28; }
body.palette-diwali .hero, body.palette-diwali .site-header, body.palette-diwali .admin-sidebar { background: #241210; }

/* Holi — playful magenta + teal splash against a clean base, kept tasteful not garish */
body.palette-holi {
    --cognac: #c2185b;
    --cognac-dark: #97123f;
    --brass: #00897b;
    --bone: #fdf7f2;
    --line: #f0c9dd;
}
body.palette-holi .sale-badge, body.palette-holi .product-badge.badge-new { background: #00897b; color: #fff; }

/* Wedding Season — champagne gold + rose blush, soft and elegant */
body.palette-wedding {
    --cognac: #b4778a;
    --cognac-dark: #8f5a6a;
    --brass: #c9a96e;
    --bone: #fdf9f4;
    --line: #ecd9d0;
}
body.palette-wedding .hero, body.palette-wedding .site-header, body.palette-wedding .admin-sidebar { background: #2b2422; }

/* Raksha Bandhan — rakhi red + bright gold thread */
body.palette-rakhi {
    --cognac: #c0392b;
    --cognac-dark: #962c21;
    --brass: #e8b923;
    --bone: #fff8ec;
    --line: #f0d9a0;
}

/* Navratri / Durga Puja — deep magenta-red + marigold gold */
body.palette-navratri {
    --cognac: #a01942;
    --cognac-dark: #7a1332;
    --brass: #f2a52c;
    --bone: #fdf2f5;
    --line: #f0c3d4;
}

/* Eid — traditional emerald green + gold */
body.palette-eid {
    --cognac: #1f6f4a;
    --cognac-dark: #154d33;
    --brass: #d4af37;
    --bone: #f5f9f3;
    --line: #cfe3d3;
}

/* Christmas / New Year — festive red + gold, deep green hero */
body.palette-christmas {
    --cognac: #8b1e2b;
    --cognac-dark: #641621;
    --brass: #c9a227;
    --bone: #f7f3ea;
    --line: #dcd0a8;
}
body.palette-christmas .hero, body.palette-christmas .site-header, body.palette-christmas .admin-sidebar { background: #0f3d2e; }

/* Republic Day / Independence Day — patriotic saffron + green */
body.palette-patriotic {
    --cognac: #d97b1f;
    --cognac-dark: #b25f12;
    --brass: #0b6e35;
    --bone: #fefaf3;
    --line: #cfe8d7;
}

/* Summer Sale — ocean blue + sunny yellow, travel/vacation mood */
body.palette-summer {
    --cognac: #1f7a99;
    --cognac-dark: #145a72;
    --brass: #f2b705;
    --bone: #f4faf9;
    --line: #bfe3ea;
}

/* Monsoon Sale — cool blue-grey + misty teal */
body.palette-monsoon {
    --cognac: #355c7d;
    --cognac-dark: #24405a;
    --brass: #6dbfae;
    --bone: #f2f6f7;
    --line: #cddbe0;
}

/* Small festive marker in the announcement bar so it's obvious which mood is live */
.festive-marker { margin-right: 6px; }

/* ---------- Theme: 3D Premium hero parallax ---------- */
.hero-parallax-layer {
    position: absolute;
    z-index: 0;
    display: none; /* Classic theme: extra layers stay hidden, just the main tag shows */
    transition: transform 0.1s ease-out;
}
body.theme-3d .hero-parallax-layer { display: block; }
body.theme-3d .hero-tag-visual .tag-card:not(.hero-parallax-layer) {
    position: relative;
    z-index: 1;
}

/* ---------- Theme: 3D Premium (opt-in via body.theme-3d, chosen in Admin > Theme) ---------- */
body.theme-3d .tag-card {
    transform-style: preserve-3d;
    transition: transform 0.15s ease-out, box-shadow 0.15s ease-out;
}
body.theme-3d .tag-card.tilt-active {
    transform: perspective(800px) rotateX(var(--tilt-x, 0deg)) rotateY(var(--tilt-y, 0deg)) translateY(-4px) translateZ(0);
    box-shadow: 0 24px 44px -18px rgba(33,31,29,0.4), 0 6px 14px -6px rgba(33,31,29,0.18);
}
@media (prefers-reduced-motion: reduce) {
    body.theme-3d .tag-card { transition: none !important; }
    body.theme-3d .tag-card.tilt-active { transform: none !important; }
}
@media (hover: none) {
    body.theme-3d .tag-card.tilt-active { transform: none; box-shadow: none; }
}

body.theme-3d .btn-primary {
    transform: translateY(0);
    box-shadow: 0 4px 10px -4px rgba(184,147,90,0.5);
    transition: transform 0.12s ease, box-shadow 0.12s ease, background 0.15s ease;
}
body.theme-3d .btn-primary:hover { transform: translateY(-2px); box-shadow: 0 10px 20px -8px rgba(184,147,90,0.55); }
body.theme-3d .btn-primary:active { transform: translateY(0); box-shadow: 0 2px 6px -2px rgba(184,147,90,0.4); }

/* ---------- Cart page ---------- */
.cart-line {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 0;
    border-bottom: 1px solid var(--line);
}
.qty-control {
    display: flex;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: 4px;
}
.qty-btn {
    background: none;
    border: none;
    width: 30px;
    height: 30px;
    cursor: pointer;
    font-size: 1rem;
    color: var(--ink);
}
.qty-value { width: 26px; text-align: center; font-family: 'IBM Plex Mono', monospace; font-size: 0.85rem; }
.cart-remove-btn {
    background: none;
    border: none;
    color: var(--slate);
    cursor: pointer;
    font-size: 0.9rem;
}
.cart-remove-btn:hover { color: var(--cognac); }

/* ---------- Checkout ---------- */
.checkout-narrow { max-width: 620px; padding-top: 50px; padding-bottom: 100px; }
.checkout-steps {
    display: flex;
    gap: 20px;
    margin-bottom: 34px;
    font-family: 'IBM Plex Mono', monospace;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--line);
}
.checkout-steps .step { color: var(--slate); }
.checkout-steps .step.active { color: var(--cognac-dark); font-weight: 600; }
.checkout-steps .step.done { color: var(--ink); }
.form-label {
    display: block;
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--slate);
    margin: 16px 0 6px;
}
.form-input {
    width: 100%;
    padding: 13px 14px;
    border: 1px solid var(--line);
    border-radius: 4px;
    font-family: 'Inter', sans-serif;
    font-size: 0.95rem;
    background: #fffdf8;
    color: var(--ink);
}
.form-input:focus { outline: none; border-color: var(--cognac); }
.checkout-error { color: #a9673b; font-size: 0.85rem; margin-top: 10px; min-height: 1em; }

/* ---------- Sale Banner (reused .sale-badge above also applies standalone) ---------- */

/* ---------- Live Sale Banner ---------- */
.sale-banner {
    background: var(--cognac);
    color: var(--bone);
    border-top: 1px solid var(--cognac-dark);
    border-bottom: 1px solid var(--cognac-dark);
}
.sale-banner-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 26px 24px;
    flex-wrap: wrap;
}
.sale-badge {
    display: inline-block;
    font-family: 'IBM Plex Mono', monospace;
    font-size: 0.7rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    background: var(--ink);
    color: var(--brass);
    padding: 4px 10px;
    border-radius: 3px;
    margin-bottom: 10px;
}
.sale-banner h2 {
    color: var(--bone);
    font-size: 1.6rem;
    margin-bottom: 4px;
}
.sale-banner p {
    color: #f6ecdd;
    font-size: 0.92rem;
}
.sale-banner .btn-primary {
    background: var(--ink);
    color: var(--brass);
    flex-shrink: 0;
}
.sale-banner .btn-primary:hover { background: #3a3733; }

/* ---------- Homepage Banner Carousel ---------- */
.banner-carousel {
    position: relative;
    width: 100%;
    aspect-ratio: 21 / 7;
    max-height: 420px;
    overflow: hidden;
    background: var(--ink);
}
.carousel-track { position: relative; width: 100%; height: 100%; }
.carousel-slide {
    position: absolute; inset: 0;
    opacity: 0;
    transition: opacity 0.5s ease;
    display: block;
}
.carousel-slide.active { opacity: 1; }
.carousel-slide img { width: 100%; height: 100%; object-fit: cover; display: block; }
.carousel-caption {
    position: absolute;
    left: 6%; bottom: 12%;
    color: var(--bone);
    max-width: 420px;
}
.carousel-caption h3 { color: var(--bone); font-size: 1.8rem; margin-bottom: 6px; text-shadow: 0 2px 10px rgba(0,0,0,0.4); }
.carousel-caption p { color: #f1ecdd; font-size: 0.95rem; margin-bottom: 14px; text-shadow: 0 2px 8px rgba(0,0,0,0.4); }
.carousel-dots {
    position: absolute;
    bottom: 16px; left: 50%; transform: translateX(-50%);
    display: flex; gap: 8px;
}
.carousel-dot {
    width: 8px; height: 8px; border-radius: 50%;
    background: rgba(241,234,218,0.4);
    border: none; cursor: pointer;
    transition: background 0.2s ease, width 0.2s ease;
}
.carousel-dot.active { background: var(--brass); width: 22px; border-radius: 4px; }
@media (max-width: 700px) {
    .banner-carousel { aspect-ratio: 4/5; max-height: 460px; }
    .carousel-caption { left: 6%; right: 6%; max-width: none; }
}

/* ---------- Also Available On (marketplace trust band) ---------- */
.marketplace-band {
    background: #e9e0cc;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    padding: 22px 0;
    margin-top: 20px;
}
.marketplace-inner {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
    flex-wrap: wrap;
}
.marketplace-label {
    font-family: 'IBM Plex Mono', monospace;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--slate);
}
.marketplace-logos { display: flex; gap: 26px; align-items: center; flex-wrap: wrap; }
.marketplace-logo-link {
    font-family: 'Fraunces', serif;
    font-weight: 600;
    font-size: 1.05rem;
    color: var(--ink);
    opacity: 0.75;
    transition: opacity 0.15s ease;
}
.marketplace-logo-link:hover { opacity: 1; }
.marketplace-logo-link img { height: 22px; display: block; }

/* ---------- Announcement Bar (scrolling ticker, editable from admin) ---------- */
.announcement-bar {
    background: var(--cognac-dark);
    color: var(--bone);
    overflow: hidden;
    white-space: nowrap;
    padding: 7px 0;
}
.announcement-track {
    display: inline-flex;
    animation: scroll-marquee 26s linear infinite;
}
.announcement-item {
    font-family: 'IBM Plex Mono', monospace;
    font-size: 0.72rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding: 0 40px;
    position: relative;
}
.announcement-item::after {
    content: "·";
    position: absolute;
    right: -4px;
    color: var(--brass);
}
@keyframes scroll-marquee {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}

.lang-switch-wrap { position: relative; }
.lang-switch-wrap:hover .mega-menu-dropdown, .lang-switch-wrap:focus-within .mega-menu-dropdown { display: block; right: 0; left: auto; }
.lang-switch-wrap .lang-active { font-weight: 700; color: var(--cognac); }

/* ---------- Header search + cart icon ---------- */
.search-wrap { position: relative; }
.search-input {
    background: rgba(241,234,218,0.1);
    border: 1px solid rgba(241,234,218,0.25);
    color: var(--bone);
    padding: 8px 12px;
    border-radius: 4px;
    font-size: 0.85rem;
    width: 180px;
}
.search-input::placeholder { color: rgba(241,234,218,0.5); }
.search-input:focus { outline: none; border-color: var(--brass); background: rgba(241,234,218,0.15); }
.search-results {
    display: none;
    position: absolute;
    top: 44px;
    right: 0;
    width: 280px;
    background: #fffdf8;
    border: 1px solid var(--line);
    border-radius: 6px;
    box-shadow: 0 14px 30px -10px rgba(0,0,0,0.3);
    z-index: 50;
    max-height: 320px;
    overflow-y: auto;
}
.search-results.open { display: block; }
.search-result-row { display: flex; align-items: center; gap: 10px; padding: 10px 12px; color: var(--ink); border-bottom: 1px solid var(--line); }
.search-result-row:last-child { border-bottom: none; }
.search-result-row:hover { background: var(--bone); }
.search-result-thumb { width: 40px; height: 40px; background: var(--bone); border-radius: 3px; overflow: hidden; flex-shrink: 0; }
.search-result-thumb img { width: 100%; height: 100%; object-fit: cover; }
.search-empty { padding: 14px; font-size: 0.85rem; color: var(--slate); }

.cart-icon-btn {
    background: none;
    border: none;
    color: var(--bone);
    font-size: 0.85rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 6px;
}
.cart-count-badge {
    background: var(--brass);
    color: var(--ink);
    font-family: 'IBM Plex Mono', monospace;
    font-size: 0.68rem;
    padding: 1px 6px;
    border-radius: 10px;
}

/* ---------- Cart Drawer ---------- */
.drawer-overlay {
    display: none;
    position: fixed; inset: 0;
    background: rgba(33,31,29,0.5);
    z-index: 90;
}
.drawer-overlay.open { display: block; }
.cart-drawer {
    position: fixed;
    top: 0; right: -400px;
    width: 380px; max-width: 90vw;
    height: 100vh;
    background: #fffdf8;
    z-index: 91;
    display: flex;
    flex-direction: column;
    transition: right 0.25s ease;
    box-shadow: -10px 0 30px rgba(0,0,0,0.2);
}
.cart-drawer.open { right: 0; }
.drawer-header {
    display: flex; justify-content: space-between; align-items: center;
    padding: 20px; border-bottom: 1px solid var(--line);
}
.drawer-header h3 { font-size: 1.1rem; }
.drawer-close { background: none; border: none; font-size: 1.1rem; cursor: pointer; color: var(--slate); }
.drawer-items { flex: 1; overflow-y: auto; padding: 10px 20px; }
.drawer-empty { color: var(--slate); font-size: 0.9rem; padding: 30px 0; text-align: center; }
.drawer-line { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.drawer-line-img { width: 56px; height: 56px; background: var(--bone); border-radius: 4px; overflow: hidden; flex-shrink: 0; display:flex; align-items:center; justify-content:center; font-size:0.65rem; color:var(--slate); }
.drawer-line-img img { width: 100%; height: 100%; object-fit: cover; }
.drawer-line-info { flex: 1; }
.drawer-line-name { font-size: 0.85rem; margin-bottom: 3px; }
.drawer-footer { padding: 18px 20px; border-top: 1px solid var(--line); }
.drawer-total-row { display: flex; justify-content: space-between; margin-bottom: 14px; font-weight: 600; }

/* ---------- Quick View Modal ---------- */
.qv-overlay {
    display: none;
    position: fixed; inset: 0;
    background: rgba(33,31,29,0.6);
    z-index: 95;
    align-items: center; justify-content: center;
}
.qv-overlay.open { display: flex; }
.qv-modal {
    background: #fffdf8;
    border-radius: 8px;
    padding: 30px;
    max-width: 420px; width: 90vw;
    position: relative;
    max-height: 85vh;
    overflow-y: auto;
}
.qv-modal .drawer-close { position: absolute; top: 14px; right: 14px; }

/* ---------- Product image hover-swap ---------- */
.tag-image { position: relative; }
.tag-image .hover-img {
    position: absolute; inset: 0;
    opacity: 0;
    transition: opacity 0.2s ease;
}
.tag-card:hover .tag-image .hover-img { opacity: 1; }

/* ---------- Product Badges (Bestseller / Trending / New / Discount) ---------- */
.product-badge {
    position: absolute;
    top: 12px;
    right: 12px;
    font-family: 'IBM Plex Mono', monospace;
    font-size: 0.62rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding: 4px 9px;
    border-radius: 3px;
    z-index: 1;
}
.badge-bestseller { background: var(--brass); color: var(--ink); }
.badge-trending    { background: var(--cognac); color: var(--bone); }
.badge-new         { background: var(--ink); color: var(--brass); }
.badge-discount    { background: #7a2e1f; color: var(--bone); }

.launch-stamp {
    background: var(--cognac);
    color: var(--bone);
    border-color: var(--cognac);
}

.tag-card > a { display: block; }
.compare-checkbox-label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.75rem;
    color: var(--slate);
    margin-top: 10px;
    cursor: pointer;
}
.card-actions {
    display: flex;
    gap: 8px;
    margin-top: 12px;
}
.add-to-cart-btn {
    flex: 1;
    background: var(--ink);
    color: var(--brass);
    border: none;
    padding: 9px 0;
    border-radius: 4px;
    font-size: 0.78rem;
    font-family: 'IBM Plex Mono', monospace;
    letter-spacing: 0.03em;
    cursor: pointer;
    transition: background 0.15s ease;
}
.add-to-cart-btn:hover { background: var(--cognac-dark); }
.quick-view-btn {
    background: none;
    border: 1px solid var(--line);
    border-radius: 4px;
    width: 36px;
    cursor: pointer;
    font-size: 0.9rem;
}
.quick-view-btn:hover { border-color: var(--cognac); }

/* ---------- Footer ---------- */
.site-footer {
    background: var(--ink);
    color: #cfc7b4;
    padding: 50px 24px 24px;
    margin-top: 60px;
}
.footer-inner {
    max-width: 1180px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: 30px;
}
.site-footer h4 {
    font-family: 'Fraunces', serif;
    font-size: 0.95rem;
    color: var(--bone);
    margin-bottom: 14px;
}
.site-footer a { display: block; font-size: 0.85rem; opacity: 0.8; margin-bottom: 8px; }
.footer-bottom {
    max-width: 1180px;
    margin: 40px auto 0;
    padding-top: 20px;
    border-top: 1px solid rgba(241,234,218,0.15);
    font-size: 0.75rem;
    font-family: 'IBM Plex Mono', monospace;
    opacity: 0.6;
}
@media (max-width: 700px) {
    .footer-inner { grid-template-columns: 1fr 1fr; }
}

/* ---------- Phase 3: Hotspots, Zoom, Scale Visualizer, Lookbook ---------- */
.product-image-stage { position: relative; overflow: hidden; }
.product-hotspot {
    position: absolute; transform: translate(-50%,-50%);
    width: 26px; height: 26px; border-radius: 50%;
    background: rgba(184,147,90,0.9); color: var(--ink);
    border: 2px solid #fff; font-weight: 700; cursor: pointer;
    box-shadow: 0 2px 8px rgba(0,0,0,0.3);
    animation: hotspot-pulse 2s ease-in-out infinite;
}
@keyframes hotspot-pulse { 0%,100% { box-shadow: 0 2px 8px rgba(0,0,0,0.3), 0 0 0 0 rgba(184,147,90,0.5); } 50% { box-shadow: 0 2px 8px rgba(0,0,0,0.3), 0 0 0 8px rgba(184,147,90,0); } }
.hotspot-popup {
    position: absolute; transform: translate(-50%, -110%);
    background: #fffdf8; border: 1px solid var(--line); border-radius: 6px;
    padding: 10px 12px; width: 180px; font-size: 0.8rem;
    box-shadow: 0 10px 24px -8px rgba(0,0,0,0.3); z-index: 5;
}
.hotspot-popup strong { display: block; margin-bottom: 4px; font-size: 0.82rem; }
.hotspot-popup p { color: var(--slate); font-size: 0.75rem; }
.zoom-lens {
    display: none; position: absolute; width: 120px; height: 120px;
    border: 2px solid var(--brass); border-radius: 50%;
    transform: translate(-50%, -50%); pointer-events: none;
    background-repeat: no-repeat; box-shadow: 0 6px 20px rgba(0,0,0,0.35); z-index: 4;
}
.zoom-hint { position: absolute; bottom: 10px; right: 10px; background: rgba(33,31,29,0.7); color: var(--bone); font-size: 0.7rem; padding: 4px 10px; border-radius: 12px; }
.scale-visualizer { display: none; align-items: flex-end; gap: 30px; margin-top: 14px; padding: 20px; background: var(--bone); border-radius: 8px; justify-content: center; }
.scale-figure { position: relative; width: 50px; display: flex; align-items: flex-end; justify-content: center; }
.scale-figure::before { content: ''; display: block; width: 100%; height: 100%; border-radius: 8px 8px 0 0; }
.scale-figure-human::before { background: linear-gradient(180deg, #d8cbb8, #b8a68c); border-radius: 20px 20px 0 0; }
.scale-figure-bag { width: 70px; }
.scale-figure-bag::before { background: var(--cognac); border-radius: 6px; }
.scale-label { position: absolute; top: -22px; left: 50%; transform: translateX(-50%); font-size: 0.68rem; color: var(--slate); white-space: nowrap; font-family: 'IBM Plex Mono', monospace; }

.lookbook-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.lookbook-photo { position: relative; border-radius: 10px; overflow: hidden; aspect-ratio: 4/5; }
.lookbook-photo img { width: 100%; height: 100%; object-fit: cover; }
.lookbook-caption { position: absolute; bottom: 14px; left: 14px; color: #fff; font-size: 0.85rem; text-shadow: 0 2px 6px rgba(0,0,0,0.6); }
.shop-pin { position: absolute; transform: translate(-50%,-50%); }
.shop-pin-dot { display: block; width: 18px; height: 18px; background: rgba(255,255,255,0.9); border: 2px solid var(--brass); border-radius: 50%; position: relative; }
.shop-pin-dot::after { content: '+'; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-weight: 700; color: var(--ink); font-size: 0.8rem; }
.shop-pin-card { display: none; position: absolute; bottom: 130%; left: 50%; transform: translateX(-50%); background: #fffdf8; border-radius: 6px; padding: 8px; width: 160px; box-shadow: 0 10px 24px -8px rgba(0,0,0,0.3); }
.shop-pin:hover .shop-pin-card { display: flex; gap: 8px; align-items: center; }
.shop-pin-card img { width: 40px; height: 40px; object-fit: cover; border-radius: 4px; }
.shop-pin-card strong { font-size: 0.78rem; }
@media (max-width: 700px) { .lookbook-grid { grid-template-columns: 1fr; } }


/* Smart shopping advisor */
.advisor-banner{margin:10px auto 54px;max-width:1180px;padding:0 20px;}
.advisor-banner-inner{border:1px solid var(--line);border-radius:16px;padding:34px 38px;display:flex;align-items:center;justify-content:space-between;gap:28px;background:linear-gradient(135deg,rgba(169,103,59,.08),rgba(255,255,255,.02));box-shadow:0 18px 50px rgba(0,0,0,.06);}
.advisor-banner h2{font-size:clamp(1.5rem,3vw,2.3rem);margin:10px 0 8px;}
.advisor-banner p{max-width:680px;color:var(--slate);line-height:1.65;margin:0;}
.advisor-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end;}
.btn-secondary{border:1px solid var(--charcoal);color:var(--charcoal);background:transparent;border-radius:6px;padding:11px 16px;font-size:.82rem;cursor:pointer;}
.hero-product-card{position:relative;text-decoration:none;color:inherit;display:block;overflow:hidden;}
.hero-product-card .tag-image img{width:100%;height:100%;object-fit:cover;display:block;}
.hero-product-main{width:220px;}
@media(max-width:760px){.advisor-banner{padding:0 14px;margin-bottom:36px}.advisor-banner-inner{padding:24px;display:block}.advisor-actions{justify-content:flex-start;margin-top:18px}.hero-product-card{display:none}.hero-product-main{display:block;width:210px;transform:translateX(20px)!important}}

/* ==========================================================
   LUXURY COMMERCE LAYER
   Product pages get a quieter editorial layout: warm ivory paper,
   ink typography, champagne metal accents, generous whitespace.
   ========================================================== */
body.product-page {
    --ink: #151515;
    --bone: #f6f3ed;
    --paper: #fbfaf7;
    --champagne: #b89b63;
    --champagne-dark: #8d7446;
    --slate: #68655f;
    --line: #e3ded4;
    background: var(--paper);
}
body.product-page .announcement-bar {
    background: #111;
    color: #f5f1e9;
    border-bottom: 1px solid #292929;
    font-size: 10px;
    letter-spacing: .16em;
}
body.product-page .site-header {
    background: rgba(251,250,247,.97);
    color: var(--ink);
    border-bottom: 1px solid var(--line);
    position: relative;
    z-index: 50;
}
body.product-page .header-inner {
    max-width: 1320px;
    min-height: 78px;
    padding: 0 28px;
    gap: 28px;
}
body.product-page .logo {
    color: var(--ink);
    font-size: 1.55rem;
    letter-spacing: .11em;
    white-space: nowrap;
}
body.product-page .logo span { color: var(--champagne-dark); }
body.product-page .main-nav { gap: 24px; flex: 1; justify-content: center; }
body.product-page .main-nav a {
    color: #36342f;
    font-size: .72rem;
    letter-spacing: .13em;
    opacity: 1;
}
body.product-page .main-nav a:hover { border-bottom-color: var(--champagne); }
body.product-page .header-actions { gap: 8px; }
body.product-page .header-actions > a:first-of-type { display:none; }
body.product-page .cart-icon-btn,
body.product-page .lang-switch-wrap > button {
    background: transparent;
    border: 0;
    color: #282723;
    padding: 9px 10px;
    font-size: .72rem;
    letter-spacing: .06em;
}
body.product-page .search-wrap { width: min(290px, 24vw); }
body.product-page .search-input {
    width:100%; height:40px; border:1px solid #ded9cf; background:#fff;
    border-radius:2px; padding:0 14px; font-size:.76rem; outline:none;
}
body.product-page .search-input:focus { border-color: var(--champagne-dark); box-shadow: 0 0 0 2px rgba(184,155,99,.12); }
body.product-page .cart-count-badge { background:var(--ink); color:#fff; }

.luxury-product-page { background: var(--paper); }
.luxury-breadcrumb { max-width:1320px; padding-left:28px!important; padding-right:28px!important; }
.luxury-breadcrumb nav { font-size:.68rem!important; letter-spacing:.08em; text-transform:uppercase; color:#858078!important; }
.luxury-breadcrumb nav a { color:#858078!important; }
.luxury-breadcrumb nav span:last-child { color:#3d3a35!important; }
.luxury-product-hero {
    max-width:1320px!important;
    padding-left:28px!important;
    padding-right:28px!important;
    grid-template-columns:minmax(0,1.08fr) minmax(430px,.92fr)!important;
    gap:72px!important;
    align-items:start!important;
}
.luxury-product-hero > div:first-child { position:sticky; top:20px; }
.luxury-product-hero .product-image-stage,
.luxury-product-hero .spin-viewer {
    background:#f0eee9!important;
    border:1px solid #e4e0d8;
    border-radius:2px!important;
    box-shadow:none!important;
}
.luxury-product-hero .product-image-stage img,
.luxury-product-hero .spin-viewer img { object-fit:contain!important; mix-blend-mode:multiply; }
.luxury-product-hero .thumbnail-row { gap:8px!important; margin-top:14px!important; }
.luxury-product-hero .thumbnail-btn {
    width:78px!important; height:78px!important; border-radius:2px!important;
    border:1px solid #d8d2c8!important; background:#f4f2ed!important;
}
.luxury-product-hero .thumbnail-btn.active { border:1px solid #171717!important; }
.luxury-product-hero > div:nth-child(2) { padding-top:6px; }
.luxury-product-hero .hero-eyebrow {
    font-family:'Inter',sans-serif!important;
    font-size:.66rem!important; letter-spacing:.18em; text-transform:uppercase;
    color:#81775f!important; margin:0 0 12px!important;
}
.luxury-product-hero h1 {
    font-family:'Fraunces',serif!important;
    font-size:clamp(2.25rem,4vw,3.7rem)!important;
    line-height:1.03!important; font-weight:500!important; letter-spacing:-.035em!important;
    max-width:600px; margin-bottom:20px!important;
}
.luxury-product-hero .price {
    font-family:'Inter',sans-serif!important; font-size:1.55rem!important; font-weight:600;
    letter-spacing:-.02em; color:#171717!important; margin-bottom:24px!important;
}
.luxury-product-hero .price span { color:#8d8981!important; font-weight:400; }
.luxury-product-hero .color-swatch-row { gap:11px; }
.luxury-product-hero .color-swatch { width:30px; height:30px; border:2px solid #eee!important; box-shadow:0 0 0 1px #c9c4bb; }
.luxury-product-hero .color-swatch.active { box-shadow:0 0 0 1px #171717; border:3px solid #f8f6f1!important; }
.luxury-product-hero .form-label { font-size:.7rem; text-transform:uppercase; letter-spacing:.12em; color:#66615a; margin-bottom:10px; }
.luxury-product-hero ul li { font-size:.86rem!important; color:#4c4943!important; margin-bottom:11px!important; }
.luxury-product-hero ul li > span:first-child { color:var(--champagne-dark)!important; }
.luxury-product-hero .form-input {
    border:1px solid #d8d3ca; background:#fff; border-radius:2px; min-height:46px;
}
.luxury-product-hero .add-to-cart-btn,
.luxury-product-hero .btn-primary {
    background:#151515!important; color:#fff!important; border:1px solid #151515!important;
    border-radius:1px!important; min-height:52px; font-size:.78rem; letter-spacing:.12em;
    text-transform:uppercase; padding:15px 24px!important; box-shadow:none!important;
}
.luxury-product-hero .add-to-cart-btn:hover,
.luxury-product-hero .btn-primary:hover { background:#302f2c!important; transform:none!important; }
.luxury-product-hero .tag-card { background:#fff!important; border:1px solid #e3ded4!important; border-radius:2px!important; box-shadow:none!important; }
.luxury-product-hero > div:nth-child(2) > div[style*="border-top"] {
    border-color:#ded9d0!important; margin-top:6px!important; padding:18px 0!important;
}
.luxury-product-hero .spin-viewer-hint {
    background:rgba(20,20,20,.82); border-radius:1px; letter-spacing:.08em; font-size:.65rem;
}
.luxury-product-hero .zoom-hint { background:rgba(20,20,20,.78)!important; border-radius:1px!important; }

/* Replace the old card-heavy lower page with editorial bands. */
.luxury-product-page > .container:not(.luxury-breadcrumb):not(.luxury-product-hero) {
    max-width:1320px!important;
    padding-left:28px!important; padding-right:28px!important;
}
.luxury-product-page > .container:not(.luxury-breadcrumb):not(.luxury-product-hero) > .tag-card {
    background:transparent!important; border:0!important; border-top:1px solid var(--line)!important;
    border-radius:0!important; padding:34px 0!important; margin-bottom:0!important; box-shadow:none!important;
}
.luxury-product-page > .container:not(.luxury-breadcrumb):not(.luxury-product-hero) > .tag-card h2,
.luxury-product-page .section-heading h2 {
    font-family:'Fraunces',serif; font-weight:500; font-size:1.75rem; letter-spacing:-.02em;
}
.luxury-product-page .spec-table { max-width:680px; }
.luxury-product-page .spec-table td { padding:13px 0; border-bottom:1px solid #e8e3da; }
.luxury-product-page .spec-table td:first-child { text-transform:uppercase; letter-spacing:.08em; font-size:.68rem; }
.luxury-product-page .section-heading { margin:50px 0 22px; }
.luxury-product-page .product-grid { gap:16px; }
.luxury-product-page .product-grid .tag-card { border-radius:2px; box-shadow:none; }
.luxury-product-page .product-grid .tag-card:hover { transform:translateY(-2px); box-shadow:0 12px 25px rgba(20,20,20,.08); }

@media (max-width:1050px) {
    body.product-page .main-nav { display:none; }
    body.product-page .header-inner { justify-content:space-between; }
    body.product-page .search-wrap { width:min(340px,42vw); }
    .luxury-product-hero { grid-template-columns:1fr!important; gap:42px!important; }
    .luxury-product-hero > div:first-child { position:static; }
    .luxury-product-hero > div:first-child .product-image-stage,
    .luxury-product-hero > div:first-child .spin-viewer { max-height:none; }
}
@media (max-width:700px) {
    body.product-page .header-inner { min-height:64px; padding:0 16px; }
    body.product-page .logo { font-size:1.2rem; }
    body.product-page .search-wrap { display:none; }
    body.product-page .header-actions { gap:0; }
    body.product-page .header-actions > div.lang-switch-wrap { display:none; }
    body.product-page .header-actions > a { display:inline-flex!important; }
    .luxury-breadcrumb, .luxury-product-hero,
    .luxury-product-page > .container:not(.luxury-breadcrumb):not(.luxury-product-hero) {
        padding-left:16px!important; padding-right:16px!important;
    }
    .luxury-product-hero h1 { font-size:2.35rem!important; }
    .luxury-product-hero .thumbnail-btn { width:62px!important; height:62px!important; }
    .luxury-product-hero { padding-bottom:50px!important; }
}


/* ============================================================
   PHASE 3 — LUXURY EXPERIENCE / CONVERSION SYSTEM
   ============================================================ */
:root{--lux-gold:#d6b36a;--lux-black:#090a0b;--lux-ink:#111315;--lux-muted:#7d8186;--lux-glass:rgba(255,255,255,.055)}
.site-header{backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);position:sticky;top:0;z-index:80}
.logo{letter-spacing:.14em!important;font-weight:800!important}.logo span{color:var(--brass)!important}
.header-luxe-cta{border:1px solid color-mix(in srgb,var(--brass) 55%,transparent);padding:9px 13px;border-radius:999px!important;background:linear-gradient(135deg,rgba(255,255,255,.06),rgba(214,179,106,.10));box-shadow:inset 0 1px rgba(255,255,255,.12),0 8px 24px rgba(0,0,0,.08)}
.luxury-product-page{background:radial-gradient(circle at 78% 6%,rgba(214,179,106,.08),transparent 26%),linear-gradient(180deg,rgba(255,255,255,.02),transparent 40%)}
.luxury-product-hero{align-items:start!important}.luxury-product-hero>div:first-child{position:sticky;top:96px}.luxury-product-info{padding:30px;border:1px solid color-mix(in srgb,var(--line) 75%,transparent);border-radius:24px;background:linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,.025));box-shadow:0 30px 90px rgba(0,0,0,.10);backdrop-filter:blur(18px)}
.luxury-product-info h1{font-family:'Fraunces',Georgia,serif!important;font-size:clamp(2rem,3.2vw,3.35rem)!important;line-height:1.02;letter-spacing:-.045em}.luxury-product-info .price{font-size:2rem!important;font-weight:750!important;letter-spacing:-.04em}.luxury-product-info .btn-primary{min-height:56px;border-radius:14px;font-size:.95rem;letter-spacing:.02em;box-shadow:0 18px 45px rgba(0,0,0,.18)}
.luxury-utility-row{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 22px}.luxury-utility-row a{font-size:.72rem;text-decoration:none;padding:8px 11px;border:1px solid var(--line);border-radius:999px;color:var(--slate);background:rgba(255,255,255,.035);transition:.2s}.luxury-utility-row a:hover{border-color:var(--brass);color:var(--charcoal);transform:translateY(-1px)}
.luxury-trust-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:18px 0 22px}.luxury-trust-grid>div{padding:12px;border-top:1px solid var(--line);display:grid;gap:3px}.luxury-trust-grid b{font:600 .65rem 'IBM Plex Mono',monospace;color:var(--brass)}.luxury-trust-grid span{font-size:.72rem;color:var(--slate)}
.product-image-stage,.spin-viewer{background:radial-gradient(circle at 50% 38%,rgba(255,255,255,.10),transparent 46%),linear-gradient(145deg,#111315,#292c2f)!important;border:1px solid rgba(255,255,255,.10);box-shadow:0 35px 90px rgba(0,0,0,.18)!important}.thumbnail-btn{border-radius:12px!important;transition:.2s}.thumbnail-btn:hover{transform:translateY(-2px);border-color:var(--brass)!important}
.tag-card{border-radius:20px!important;border:1px solid color-mix(in srgb,var(--line) 78%,transparent)!important;box-shadow:0 18px 55px rgba(0,0,0,.055)}.section-heading h2{font-family:'Fraunces',Georgia,serif;letter-spacing:-.03em}
.sticky-add-bar{z-index:90!important;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);background:rgba(10,11,12,.90)!important;border-top:1px solid rgba(255,255,255,.12)!important;padding:12px max(18px,calc((100vw - 1200px)/2))!important}.sticky-add-info{display:flex;align-items:center;gap:14px}.sticky-add-info small{font:600 9px 'IBM Plex Mono';letter-spacing:.14em;color:var(--brass)}.sticky-add-info strong{color:#fff;font-size:.85rem;max-width:360px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sticky-add-info .mono{color:#fff;font-weight:700}.sticky-add-actions{display:flex;align-items:center;gap:10px}.sticky-pack-link{color:#fff;text-decoration:none;font-size:.76rem;border:1px solid rgba(255,255,255,.18);padding:11px 13px;border-radius:10px}.sticky-add-bar .btn-primary{min-width:170px}
.pack-trip-page{padding:70px 0 110px}.pack-trip-hero{max-width:800px;margin-bottom:30px}.lux-kicker{font:600 10px 'IBM Plex Mono';letter-spacing:.18em;color:var(--brass)}.pack-trip-hero h1{font:600 clamp(3rem,7vw,6.4rem)/.92 'Fraunces',Georgia,serif;letter-spacing:-.06em;margin:10px 0 18px}.pack-trip-hero p{max-width:680px;color:var(--slate);font-size:1.05rem;line-height:1.7}.pack-trip-form{display:grid;grid-template-columns:1.4fr .7fr .8fr 1fr auto;gap:10px;padding:18px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,.025));box-shadow:0 20px 60px rgba(0,0,0,.08)}.pack-trip-form label{font-size:.72rem;color:var(--slate);display:grid;gap:6px}.pack-trip-form .btn-primary{align-self:end;min-height:48px}.pack-trip-result{margin-top:55px}.pack-trip-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:22px}.pack-trip-card{text-decoration:none;color:inherit;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:rgba(255,255,255,.04);transition:.25s;display:block}.pack-trip-card:hover{transform:translateY(-6px);box-shadow:0 25px 65px rgba(0,0,0,.15);border-color:var(--brass)}.pack-trip-card img{width:100%;aspect-ratio:1/1;object-fit:cover;display:block;background:#151617}.pack-trip-card span,.pack-trip-card h3,.pack-trip-card b,.pack-trip-card small{display:block;margin-left:16px;margin-right:16px}.pack-trip-card span{font:600 9px 'IBM Plex Mono';letter-spacing:.12em;color:var(--brass);margin-top:14px}.pack-trip-card h3{font-size:1rem;margin-top:7px}.pack-trip-card b{font-size:1.1rem;margin-top:10px}.pack-trip-card small{color:var(--slate);font-size:.72rem;line-height:1.5;margin-top:8px;margin-bottom:17px}
body.palette-diwali .pack-trip-page:before,body.palette-newyear .pack-trip-page:before{content:'';position:fixed;inset:0;pointer-events:none;background-image:radial-gradient(circle,rgba(214,179,106,.45) 0 1px,transparent 1.5px);background-size:80px 80px;opacity:.08;z-index:-1}
@media(max-width:1000px){.luxury-product-hero{grid-template-columns:1fr!important}.luxury-product-hero>div:first-child{position:relative;top:auto}.pack-trip-form{grid-template-columns:1fr 1fr}.pack-trip-form .btn-primary{grid-column:1/-1}.pack-trip-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.luxury-product-info{padding:20px;border-radius:18px}.luxury-product-info h1{font-size:2.1rem!important}.luxury-trust-grid{grid-template-columns:1fr}.pack-trip-page{padding:42px 0 90px}.pack-trip-form{grid-template-columns:1fr}.pack-trip-form .btn-primary{grid-column:auto}.pack-trip-grid{grid-template-columns:1fr}.sticky-add-bar{padding:10px 12px!important}.sticky-add-info small,.sticky-pack-link{display:none}.sticky-add-info strong{max-width:150px}.sticky-add-bar .btn-primary{min-width:120px}}

/* Luggage Lab — premium brand utility */
.luggage-lab-page{background:linear-gradient(180deg,#0b0b0b 0,#111 42%,#f4f0e8 42%,#f4f0e8 100%);min-height:100vh;color:#f5f1e9;padding-bottom:80px}.lab-hero{padding:92px 24px 76px;max-width:1180px}.lab-eyebrow{letter-spacing:.18em;font-size:.72rem;opacity:.62;margin-bottom:18px}.lab-hero h1{font-family:Georgia,serif;font-weight:500;font-size:clamp(2.5rem,6vw,5.6rem);line-height:.98;max-width:900px;margin:0 0 22px}.lab-hero p{max-width:650px;color:#c8c1b6;font-size:1.05rem}.lab-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;max-width:1180px}.lab-panel,.lab-benefits article{background:#171717;border:1px solid rgba(255,255,255,.1);border-radius:24px;padding:30px;box-shadow:0 24px 70px rgba(0,0,0,.24)}.lab-panel h2{font-family:Georgia,serif;font-size:2rem;font-weight:500;margin:0 0 22px}.lab-panel label{display:block;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:#aaa;margin-bottom:16px}.lab-panel select{display:block;width:100%;margin-top:8px;background:#101010;color:#fff;border:1px solid #3b3b3b;border-radius:12px;padding:14px}.lab-panel .btn-primary{width:100%;margin-top:8px}.lab-note{font-size:.72rem;line-height:1.5;color:#858585;margin-top:16px}.lab-benefits{display:grid;gap:14px}.lab-benefits article{padding:22px}.lab-benefits span{color:#c9a66b;font-size:.7rem;letter-spacing:.1em}.lab-benefits h3{font-family:Georgia,serif;font-size:1.45rem;margin:8px 0}.lab-benefits p{color:#aaa;font-size:.9rem;line-height:1.55;margin:0}.lab-results{color:#171717;padding-top:80px}.lab-results .section-heading span{font-size:.7rem;letter-spacing:.16em;color:#8c7656}.lab-results .section-heading h2{font-family:Georgia,serif;font-weight:500;font-size:2.8rem;margin:8px 0 28px}.lab-products{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.lab-product{background:#fff;border-radius:20px;overflow:hidden;text-decoration:none;color:#171717;box-shadow:0 15px 45px rgba(30,20,10,.08);transition:transform .25s ease,box-shadow .25s ease}.lab-product:hover{transform:translateY(-5px);box-shadow:0 24px 60px rgba(30,20,10,.14)}.lab-product-media{aspect-ratio:1/1;background:#ece7dd;overflow:hidden}.lab-product-media img{width:100%;height:100%;object-fit:cover}.lab-product>div:last-child{padding:20px}.lab-product small{color:#8b806e;text-transform:uppercase;letter-spacing:.1em;font-size:.65rem}.lab-product h3{font-family:Georgia,serif;font-weight:500;font-size:1.2rem;margin:7px 0 10px}.lab-product strong{font-size:1rem}.lab-score{display:block;margin-top:12px;font-size:.7rem;color:#7a6549}.lab-links{color:#171717;display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding-top:50px}.lab-links a{background:#fff;border-radius:18px;padding:20px;text-decoration:none;color:#171717;border:1px solid #e4ddd2}.lab-links b{display:block;font-family:Georgia,serif;font-size:1.05rem}.lab-links span{display:block;font-size:.76rem;color:#81786d;margin-top:5px}.product-lab-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:4px 0 22px}.product-lab-strip a{border:1px solid var(--line);border-radius:12px;padding:12px;text-decoration:none;color:var(--charcoal);background:rgba(255,255,255,.5)}.product-lab-strip span{font-size:1rem;color:var(--cognac-dark);display:block}.product-lab-strip b{display:block;font-size:.78rem;margin-top:5px}.product-lab-strip small{display:block;color:var(--slate);font-size:.68rem;margin-top:3px;line-height:1.3}.nav-lab-link{margin-left:12px}
@media(max-width:800px){.luggage-lab-page{background:linear-gradient(180deg,#0b0b0b 0,#0b0b0b 34%,#f4f0e8 34%)}.lab-hero{padding:60px 18px 50px}.lab-grid,.lab-products{grid-template-columns:1fr}.lab-links{grid-template-columns:1fr 1fr;padding-left:18px;padding-right:18px}.lab-results{padding-left:18px;padding-right:18px}.product-lab-strip{grid-template-columns:1fr}.nav-lab-link{display:none}}

/* Phase 6 — luxury customer pages */
.luxury-page{max-width:1120px;padding:92px 24px 110px}.luxury-eyebrow{font-size:.72rem;letter-spacing:.22em;font-weight:700;opacity:.62;margin-bottom:18px}.luxury-page h1{font-size:clamp(2.5rem,6vw,5rem);line-height:.95;letter-spacing:-.055em;margin:0 0 24px}.luxury-intro{max-width:720px;font-size:1.08rem;line-height:1.75;opacity:.76;margin-bottom:52px}.luxury-sections{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(0,0,0,.12);border:1px solid rgba(0,0,0,.12)}.luxury-sections article{background:var(--surface,#fff);padding:34px;min-height:220px}.luxury-sections h2{font-size:1.1rem;margin:0 0 14px}.luxury-sections p{line-height:1.7;opacity:.72}.luxury-form{max-width:850px;display:grid;gap:22px}.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.luxury-form label{display:grid;gap:8px;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;font-weight:700}.luxury-form input,.luxury-form textarea,.luxury-search input{width:100%;box-sizing:border-box;border:1px solid rgba(0,0,0,.16);background:rgba(255,255,255,.55);padding:15px 16px;border-radius:0;font:inherit;letter-spacing:0;text-transform:none;font-weight:400}.luxury-form textarea{resize:vertical}.luxury-search{display:flex;max-width:850px;margin-bottom:28px}.luxury-search input{flex:1}.form-success,.form-error,.status-card{padding:16px 18px;margin:0 0 24px;border:1px solid rgba(0,0,0,.12)}.form-success{background:rgba(30,120,70,.08)}.form-error{background:rgba(150,40,30,.08)}.status-card{display:grid;gap:8px;max-width:520px}.status-card strong{font-size:1.3rem}.account-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;max-width:700px}.account-grid a{padding:24px;border:1px solid rgba(0,0,0,.14);text-decoration:none;font-weight:700}.btn-secondary{display:inline-block;padding:14px 20px;border:1px solid rgba(0,0,0,.2);text-decoration:none}@media(max-width:760px){.luxury-page{padding-top:62px}.luxury-sections{grid-template-columns:1fr}.form-grid,.account-grid{grid-template-columns:1fr}.luxury-search{display:grid;grid-template-columns:1fr}.luxury-search .btn-primary{width:100%}}


/* Phase 7 — Futuristic Luxury Admin Command Center */
.admin-body{
  --admin-bg:#07090d; --admin-panel:#0d1118; --admin-panel-2:#111722; --admin-line:rgba(255,255,255,.09);
  --admin-text:#f4f7fb; --admin-muted:#8d99aa; --admin-cyan:#58e6ff; --admin-violet:#a88bff; --admin-gold:#d9b36c;
  background:
    radial-gradient(circle at 82% 8%,rgba(88,230,255,.09),transparent 28%),
    radial-gradient(circle at 52% 85%,rgba(168,139,255,.07),transparent 30%),
    #07090d!important; color:var(--admin-text);
  font-family:Inter,system-ui,sans-serif;
}
.admin-shell{min-height:100vh;background:linear-gradient(115deg,rgba(255,255,255,.015),transparent 45%)}
.admin-sidebar{
  width:258px!important; flex:0 0 258px; position:sticky; top:0; height:100vh; box-sizing:border-box; overflow-y:auto;
  padding:24px 14px!important; background:linear-gradient(180deg,#0a0e14,#080a0f 72%,#07090d)!important;
  border-right:1px solid var(--admin-line)!important; box-shadow:18px 0 60px rgba(0,0,0,.24); scrollbar-width:thin;
}
.admin-brand{display:flex;align-items:center;gap:11px;padding:4px 8px 12px}
.admin-logo-mark{width:38px;height:38px;border:1px solid rgba(88,230,255,.35);border-radius:11px;display:grid;place-items:center;font-weight:800;color:#fff;background:linear-gradient(145deg,rgba(88,230,255,.18),rgba(168,139,255,.14));box-shadow:0 0 25px rgba(88,230,255,.12)}
.admin-logo{font-family:Inter,sans-serif!important;font-size:.86rem!important;letter-spacing:.14em;color:#f5f7fa}
.admin-logo span{color:var(--admin-cyan)!important}.admin-logo small{font-family:Inter,sans-serif!important;color:var(--admin-muted);font-size:.51rem;letter-spacing:.2em;margin-top:5px}
.admin-system{margin:4px 8px 18px;padding:8px 10px;border:1px solid var(--admin-line);border-radius:9px;background:rgba(255,255,255,.025);font:600 8px Inter,sans-serif;letter-spacing:.14em;color:#9ca7b7}
.pulse-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#57f0a1;box-shadow:0 0 12px #57f0a1;margin-right:7px}
.admin-nav{gap:5px!important}
.admin-nav a{position:relative;border:1px solid transparent!important;border-radius:10px!important;padding:10px 11px!important;color:#9aa5b5!important;font-size:.72rem!important;letter-spacing:.01em;transition:all .2s ease;overflow:hidden}
.admin-nav a:before{content:'';position:absolute;left:0;top:20%;bottom:20%;width:2px;background:linear-gradient(#58e6ff,#a88bff);opacity:0;box-shadow:0 0 12px #58e6ff}
.admin-nav a:hover{color:#fff!important;background:linear-gradient(90deg,rgba(88,230,255,.08),rgba(168,139,255,.045))!important;border-color:rgba(88,230,255,.13)!important;transform:translateX(2px)}
.admin-nav a:hover:before{opacity:1}
.admin-nav a[href$="/ai-assistant"],.admin-nav a[href$="/analytics"]{background:linear-gradient(90deg,rgba(88,230,255,.09),rgba(168,139,255,.07))!important;color:#dceeff!important;border-color:rgba(88,230,255,.16)!important}
.admin-nav .admin-logout{margin-top:18px!important;border-top:0!important;padding-top:10px!important;color:#ff8f9d!important;background:rgba(255,74,101,.04)!important}
.admin-main{max-width:none!important;flex:1;padding:28px 34px 70px!important;min-width:0;background:radial-gradient(circle at 50% 0,rgba(255,255,255,.025),transparent 35%)}
.admin-topbar{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:30px;padding:14px 16px;border:1px solid var(--admin-line);border-radius:15px;background:rgba(13,17,24,.72);backdrop-filter:blur(18px);box-shadow:0 15px 45px rgba(0,0,0,.18)}
.admin-kicker{display:block;font:700 .58rem Inter,sans-serif;letter-spacing:.2em;color:var(--admin-cyan);text-transform:uppercase;margin-bottom:5px}.admin-topbar strong{font-size:.84rem;font-weight:600;color:#e8edf4}
.admin-top-actions{display:flex;align-items:center;gap:9px}.admin-site-btn,.admin-live-chip{font-size:.67rem;text-decoration:none;padding:9px 12px;border-radius:9px;border:1px solid var(--admin-line);color:#dce5f0;background:rgba(255,255,255,.025)}.admin-site-btn:hover{border-color:rgba(88,230,255,.35);color:#fff}.admin-live-chip{color:#78f0ae}.admin-live-chip i{display:inline-block;width:5px;height:5px;background:#57f0a1;border-radius:50%;box-shadow:0 0 10px #57f0a1;margin-right:5px}
.admin-page-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:10px 0 22px}.admin-page-heading h1{font-size:clamp(2rem,4vw,3.2rem)!important;line-height:1!important;margin:0 0 9px!important;letter-spacing:-.045em;color:#fff}.admin-page-heading p{color:var(--admin-muted);font-size:.84rem;margin:0;max-width:680px}.admin-heading-orb{width:72px;height:72px;border-radius:24px;display:grid;place-items:center;color:var(--admin-cyan);font-size:1.6rem;background:radial-gradient(circle at 35% 30%,rgba(88,230,255,.2),rgba(168,139,255,.06) 50%,transparent 70%);border:1px solid rgba(88,230,255,.14);box-shadow:0 0 45px rgba(88,230,255,.08)}
.admin-quick-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:0 0 24px}.admin-quick-stats>div{padding:17px 18px;border:1px solid var(--admin-line);border-radius:15px;background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.018));box-shadow:inset 0 1px rgba(255,255,255,.03)}.admin-quick-stats span{display:block;color:#6f7c8e;font-size:.56rem;font-weight:700;letter-spacing:.15em}.admin-quick-stats strong{display:block;font-size:1.08rem;margin-top:7px;color:#fff}.admin-quick-stats small{display:block;color:#7f8a9a;font-size:.66rem;margin-top:4px}
.admin-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:13px!important}.admin-card{position:relative!important;min-height:145px;padding:20px!important;border:1px solid var(--admin-line)!important;border-radius:17px!important;background:linear-gradient(145deg,rgba(17,23,34,.92),rgba(10,13,19,.88))!important;box-shadow:0 18px 50px rgba(0,0,0,.18)!important;overflow:hidden;transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease!important}.admin-card:after{content:'';position:absolute;width:110px;height:110px;right:-50px;top:-55px;border-radius:50%;background:radial-gradient(circle,rgba(88,230,255,.11),transparent 65%);pointer-events:none}.admin-card:hover{transform:translateY(-4px)!important;border-color:rgba(88,230,255,.3)!important;box-shadow:0 25px 65px rgba(0,0,0,.3),0 0 35px rgba(88,230,255,.045)!important}.admin-card h3{font-size:.91rem!important;color:#edf2f8!important;margin:0 0 10px!important}.admin-card p{font-size:.72rem!important;line-height:1.65;color:#8490a1!important;margin:0}.admin-card[style]{border-color:rgba(88,230,255,.3)!important;background:linear-gradient(145deg,rgba(88,230,255,.08),rgba(168,139,255,.045))!important}
.admin-list-row{background:linear-gradient(145deg,#10151e,#0c1017)!important;border-color:var(--admin-line)!important;border-radius:12px!important;color:#e8edf4}.admin-thumb{background:#151b25!important;border:1px solid var(--admin-line);border-radius:8px}.admin-btn-icon,.admin-btn-toggle{border-color:var(--admin-line)!important;background:#10151e!important;color:#dbe5f1!important}.admin-btn-icon:hover{border-color:rgba(88,230,255,.35)!important}.admin-btn-toggle.is-on{background:linear-gradient(135deg,#58e6ff,#8c78ff)!important;color:#071018!important}
.admin-main .tag-card,.admin-main .card,.admin-main form,.admin-main table{border-color:var(--admin-line)!important}.admin-main input,.admin-main select,.admin-main textarea{background:#0c1118!important;color:#edf2f8!important;border-color:var(--admin-line)!important}.admin-main input:focus,.admin-main select:focus,.admin-main textarea:focus{border-color:rgba(88,230,255,.5)!important;box-shadow:0 0 0 3px rgba(88,230,255,.07)!important}.admin-main .btn-primary{background:linear-gradient(135deg,#58e6ff,#8e7aff)!important;color:#071018!important;border:0!important;border-radius:10px!important;box-shadow:0 8px 28px rgba(88,230,255,.13)!important}.admin-main .btn-primary:hover{transform:translateY(-1px)!important;filter:brightness(1.05)}
@media(max-width:1100px){.admin-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.admin-sidebar{width:230px!important;flex-basis:230px}.admin-main{padding:24px!important}}
@media(max-width:760px){.admin-shell{display:block}.admin-sidebar{position:relative;height:auto;width:100%!important;min-height:0;max-height:none;flex-basis:auto}.admin-nav{display:grid;grid-template-columns:repeat(2,1fr)}.admin-nav .admin-logout{grid-column:1/-1}.admin-main{padding:18px!important}.admin-topbar{align-items:flex-start}.admin-top-actions{display:none}.admin-grid,.admin-quick-stats{grid-template-columns:1fr!important}.admin-heading-orb{display:none}}

/* ==========================================================
   Customer Appearance System
   Every theme supports Light / Dark / Auto. Auto follows the
   per-theme admin schedule; explicit visitor choice wins.
   ========================================================== */
.appearance-toggle{border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);color:inherit;border-radius:999px;padding:8px 12px;display:inline-flex;gap:6px;align-items:center;cursor:pointer;font:500 .74rem 'IBM Plex Mono',monospace;letter-spacing:.04em;transition:.2s ease;white-space:nowrap}.appearance-toggle:hover{border-color:var(--brass);box-shadow:0 0 22px color-mix(in srgb,var(--brass) 16%,transparent);transform:translateY(-1px)}
body.appearance-light{background:var(--bone);color:var(--ink)}
body.appearance-light h1,body.appearance-light h2,body.appearance-light h3,body.appearance-light .display{color:var(--ink)}
body.appearance-light .site-header{background:linear-gradient(135deg,#171512,#29231c);color:#f8f2e7}
body.appearance-light .product-card,body.appearance-light .tag-card,body.appearance-light .admin-card,body.appearance-light .form-card{background:rgba(255,255,255,.78);border-color:var(--line)}
body.appearance-light .section-dark,body.appearance-light .footer{background:#171512;color:#f8f2e7}
body.appearance-light .appearance-toggle{color:#f8f2e7}
body.appearance-dark{--ink:#f4f1ea;--bone:#0a0c0f;--slate:#a9a6a0;--line:rgba(255,255,255,.12);background:#0a0c0f;color:#f4f1ea}
body.appearance-dark h1,body.appearance-dark h2,body.appearance-dark h3,body.appearance-dark .display{color:#f8f5ef}
body.appearance-dark .site-header{background:linear-gradient(135deg,#050608,#11151a);color:#f8f5ef}
body.appearance-dark .product-card,body.appearance-dark .tag-card,body.appearance-dark .admin-card,body.appearance-dark .form-card{background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018));border-color:rgba(255,255,255,.12);color:#f4f1ea}
body.appearance-dark input,body.appearance-dark select,body.appearance-dark textarea{background:#11151a;color:#f4f1ea;border-color:rgba(255,255,255,.15)}
body.appearance-dark .footer{background:#050608;color:#f4f1ea}
body.appearance-dark .search-results,body.appearance-dark .mega-menu-dropdown{background:#11151a;color:#f4f1ea;border-color:rgba(255,255,255,.14)}
body.appearance-dark .appearance-toggle{color:#f8f5ef;background:rgba(255,255,255,.08)}
/* Theme-specific light-mode tuning so each of the 12 themes remains recognizable. */
body.appearance-light.site-theme-aurora{background:#f1f5f7} body.appearance-light.site-theme-cyber_chrome{background:#edf5f8}
body.appearance-light.site-theme-violet_neon{background:#f8f1fb} body.appearance-light.site-theme-emerald_noir{background:#eef5f1}
body.appearance-light.site-theme-royal_noir{background:#f7f1f5} body.appearance-light.site-theme-desert_luxe{background:#f6eadb}
body.appearance-light.site-theme-titanium{background:#edf1f4} body.appearance-light.site-theme-pearl_luxe{background:#f8f8f5}
@media(max-width:900px){.appearance-toggle span{display:none}.appearance-toggle{padding:8px 10px}.header-actions{gap:10px}}
.market-selector{display:flex;align-items:center;gap:5px;padding:6px 9px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.04);font-size:.78rem}
.market-selector select{border:0;background:transparent;color:inherit;font:inherit;outline:0;cursor:pointer;max-width:105px}
.market-selector option{color:#111;background:#fff}

/* ---------- Comfortrek AI customer layer ---------- */
.ai-concierge-page{max-width:980px}.ai-concierge-hero{padding-bottom:38px}.ai-concierge-hero h1{max-width:760px}.ai-suggestions{display:flex;gap:8px;flex-wrap:wrap;margin-top:22px}.ai-suggestions button{border:1px solid var(--line);background:var(--surface,#fff);padding:9px 13px;border-radius:999px;cursor:pointer;color:inherit;font:inherit;font-size:.78rem}.ai-chat-shell{border:1px solid var(--line);background:var(--surface,#fff);box-shadow:0 18px 50px rgba(0,0,0,.08);padding:18px}.ai-chat-messages{min-height:260px;max-height:520px;overflow:auto;display:flex;flex-direction:column;gap:10px;padding:6px}.ai-bubble{max-width:82%;padding:12px 14px;border-radius:12px;line-height:1.55;font-size:.9rem;white-space:pre-wrap}.ai-bubble-assistant{align-self:flex-start;background:var(--bone);border:1px solid var(--line)}.ai-bubble-user{align-self:flex-end;background:var(--charcoal);color:#fff}.ai-thinking{opacity:.65}.ai-chat-form{display:flex;gap:10px;border-top:1px solid var(--line);padding-top:14px;margin-top:12px}.ai-chat-form input{flex:1;min-width:0;border:1px solid var(--line);background:transparent;padding:14px 15px;font:inherit}.ai-chat-footer{display:flex;justify-content:space-between;gap:12px;margin-top:10px;font-size:.7rem;color:var(--slate)}.ai-chat-footer button{background:none;border:0;text-decoration:underline;cursor:pointer;color:inherit}.ai-product-results{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:14px 6px}.ai-result-label{grid-column:1/-1;font-size:.72rem;text-transform:uppercase;letter-spacing:.12em;color:var(--slate)}.ai-product-mini{display:flex;gap:12px;border:1px solid var(--line);padding:10px;text-decoration:none;color:inherit;align-items:center}.ai-product-mini img{width:72px;height:72px;object-fit:cover;background:var(--bone)}.ai-product-mini span{display:grid;gap:3px}.ai-product-mini small{color:var(--slate)}.ai-product-mini strong{color:var(--cognac-dark)}.ai-review-card{background:linear-gradient(135deg,var(--surface,#fff),rgba(190,150,80,.08))}.ai-review-result{padding:14px;border-top:1px solid var(--line);display:grid;gap:10px}.ai-review-pills{display:flex;flex-wrap:wrap;gap:7px}.ai-review-pill{font-size:.75rem;padding:6px 9px;border:1px solid var(--line);border-radius:999px}.ai-review-pill.pro{background:rgba(50,140,80,.08)}.ai-review-pill.con{background:rgba(170,70,50,.08)}@media(max-width:650px){.ai-chat-form{display:grid}.ai-product-results{grid-template-columns:1fr}.ai-bubble{max-width:94%}}
/* Phase 19 Growth Control Tower */
.eos-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}.eos-layout{display:grid;grid-template-columns:1fr 1fr;gap:14px}.eos-card{padding:16px;border-radius:16px;border:1px solid rgba(125,232,255,.15);background:rgba(255,255,255,.035)}.eos-num{font-size:1.4rem;font-weight:800}.eos-muted{opacity:.72;font-size:.85rem}.eos-table{width:100%;border-collapse:collapse}.eos-table th,.eos-table td{padding:8px;border-bottom:1px solid rgba(255,255,255,.08);text-align:left;font-size:.85rem}@media(max-width:900px){.eos-grid{grid-template-columns:repeat(3,1fr)}.eos-layout{grid-template-columns:1fr}}@media(max-width:560px){.eos-grid{grid-template-columns:1fr 1fr}}