/* MVS Fresh Kitchen standalone shell — built 2026-08-02T13:15:10Z */
/* Source: scripts/kitchen-standalone-shell.manifest (storefront modules from assets/css/) */

/* --- core/variables.css --- */
/* Design tokens — MVS Foods premium handcrafted system */
:root {
    /* Brand semantic colours (stable names for CMS/markup) */
    --color-primary: #C5A870;
    --color-primary-dark: #A58953;
    --color-secondary: #0A3232;
    --color-secondary-soft: #1E4646;
    --color-brand-teal-950: #031D1C;
    --color-brand-teal-900: #001F1D;
    --color-brand-teal-800: #0A3232;
    --color-brand-teal-700: #073F3A;
    --color-brand-green-600: #155C4D;
    --color-brand-gold-300: #E6CD7A;
    --color-brand-gold-500: #C5A870;
    --color-state-success-soft: #D8C47C;
    --color-state-error-soft: #EFB5A8;
    --color-surface: #FCFAF6;
    --color-surface-muted: #F5F1E6;
    --color-background: #FAF7F0;
    --color-background-alt: #EFEBE0;
    --color-text: #222426;
    --color-text-muted: #5C6266;
    --color-success: #2E7D32;
    --color-warning: #C59000;
    --color-danger: #C62828;
    --color-info: #1976D2;
    --color-border: rgba(10, 50, 50, 0.09);
    --color-overlay: rgba(10, 50, 50, 0.45);

    /* Premium emerald / ivory / gold palette helpers */
    --brand-emerald-deep: #021a17;
    --brand-emerald: #053833;
    --brand-forest: #0a3232;
    --brand-ivory: #fff6df;
    --brand-beige: #ebe0cb;
    --brand-gold: #e4c590;
    --brand-gold-antique: #c5a870;
    --brand-bronze: #a58953;
    --brand-wood: #6b5344;

    /* Glass / frosted surfaces */
    --glass-bg: rgba(255, 248, 230, 0.08);
    --glass-bg-strong: rgba(255, 248, 230, 0.14);
    --glass-bg-dark: rgba(2, 26, 23, 0.72);
    --glass-border: rgba(228, 197, 144, 0.28);
    --glass-border-strong: rgba(228, 197, 144, 0.48);
    --glass-blur: 18px;
    --glass-blur-strong: 28px;

    /* Ambient lighting */
    --ambient-glow-gold: rgba(228, 197, 144, 0.16);
    --ambient-glow-emerald: rgba(5, 56, 51, 0.45);
    --ambient-radial: radial-gradient(ellipse 80% 60% at 50% -10%, rgba(228, 197, 144, 0.14), transparent 55%);
    --ambient-radial-deep: radial-gradient(ellipse 70% 50% at 80% 20%, rgba(21, 92, 77, 0.22), transparent 50%);
    --texture-linen: repeating-linear-gradient(
        0deg,
        transparent,
        transparent 2px,
        rgba(255, 246, 223, 0.015) 2px,
        rgba(255, 246, 223, 0.015) 3px
    );
    --texture-paper: radial-gradient(circle at 20% 30%, rgba(255, 248, 230, 0.04), transparent 40%),
        radial-gradient(circle at 80% 70%, rgba(197, 168, 112, 0.03), transparent 35%);

    --font-family-heading: 'Cormorant Garamond', serif;
    --font-family-display: 'Cormorant Garamond', Georgia, serif;
    --font-family-body: 'Inter', sans-serif;
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;

    --font-size-display: clamp(3rem, 4vw, 5.25rem);
    --font-size-h1: clamp(2.5rem, 3vw, 3.75rem);
    --font-size-h2: clamp(2rem, 2.5vw, 3rem);
    --font-size-h3: clamp(1.75rem, 2vw, 2.25rem);
    --font-size-h4: clamp(1.5rem, 1.75vw, 1.875rem);
    --font-size-h5: clamp(1.25rem, 1.5vw, 1.5rem);
    --font-size-h6: 1.125rem;
    --font-size-subtitle: 1rem;
    --font-size-body-large: 1.125rem;
    --font-size-body-medium: 1rem;
    --font-size-body-small: 0.9375rem;
    --font-size-caption: 0.8125rem;
    --font-size-label: 0.875rem;
    --font-size-badge: 0.75rem;
    --font-size-button: 0.95rem;
    --font-size-navigation: 0.95rem;
    --font-size-footer: 0.875rem;

    --letter-spacing-tight: 0em;
    --letter-spacing-normal: 0em;
    --letter-spacing-wide: 0.04em;

    --line-height-heading: 1.05;
    --line-height-body: 1.7;
    --line-height-caption: 1.4;

    --spacing-xxs: 0.25rem;
    --spacing-xs: 0.5rem;
    --spacing-sm: 0.75rem;
    --spacing-md: 1rem;
    --spacing-lg: 1.5rem;
    --spacing-xl: 2rem;
    --spacing-xxl: 3rem;
    --spacing-xxxl: 4.5rem;

    --radius-small: 0.4rem;
    --radius-medium: 0.75rem;
    --radius-large: 1.1rem;
    --radius-pill: 999px;
    --radius-luxury: 0.95rem;
    --radius-hairline: 0.1rem;
    --radius-none: 0;

    /* Collection/category card media — canonical banner aspect (1600×900 / 1920×1080) */
    --collection-media-ratio: 16 / 9;

    /* Global storefront header chrome */
    --header-top-height: 2.5rem;
    --header-main-height: 5rem;
    --header-main-height-condensed: 4.25rem;
    --header-main-height-mobile: 3.75rem;
    --header-total-height: calc(var(--header-top-height) + var(--header-main-height));
    --header-icon-size: 2.25rem;
    --header-nav-padding-y: 0.25rem;
    --header-inner-gap: clamp(0.75rem, 1.5vw, 1.5rem);
    --header-logo-max-height: 60px;
    --header-logo-max-height-condensed: 52px;
    --header-logo-width: auto;
    --header-logo-height: auto;

    /* Layered premium shadows */
    --shadow-low: 0 2px 14px rgba(2, 26, 23, 0.08);
    --shadow-medium: 0 12px 32px rgba(2, 26, 23, 0.16);
    --shadow-high: 0 22px 56px rgba(2, 26, 23, 0.24);
    --shadow-float: 0 1.2rem 2.8rem rgba(0, 18, 16, 0.28), 0 0 0 1px rgba(228, 197, 144, 0.12);
    --shadow-glow-gold: 0 0 1.6rem rgba(228, 197, 144, 0.18);
    --shadow-inset-highlight: inset 0 1px 0 rgba(255, 248, 230, 0.22);
    --shadow-inset-depth: inset 0 -1px 0 rgba(0, 0, 0, 0.18);
    --shadow-panel: 0 0.85rem 2rem rgba(0, 10, 8, 0.2);
    --shadow-panel-hover: 0 1.2rem 2.4rem rgba(0, 10, 8, 0.28);
    --shadow-button: 0 0.65rem 1.4rem rgba(2, 26, 23, 0.22);
    --shadow-button-hover: 0 1rem 2rem rgba(2, 26, 23, 0.28);
    --shadow-press: 0 0.35rem 0.9rem rgba(2, 26, 23, 0.2);
    --shadow-nav-glow: 0 0 0.6rem rgba(228, 197, 144, 0.35);
    --shadow-focus-gold: 0 0 0 3px rgba(228, 197, 144, 0.18);

    --opacity-strong: 1;
    --opacity-muted: 0.55;
    --opacity-soft: 0.15;

    /*
     * Z-index hierarchy (storefront + shared chrome)
     * ------------------------------------------------
     * 0–5     Local stacking inside a component (media layers, sheens)
     * 100     --z-index-dropdown   Menus, selects
     * 200     --z-index-sticky     Sticky header / condensed nav
     * 850     --z-index-overlay    Drawers, search scrim
     * 900     --z-index-modal      Dialogs
     * 950     --z-index-toast      Toasts above modals
     * 1000    --z-index-tooltip    Tooltips (topmost interactive chrome)
     * Announcement bar uses sticky + 1 when paired with header.
     */
    --z-index-base: 0;
    --z-index-content: 1;
    --z-index-raised: 2;
    --z-index-dropdown: 100;
    --z-index-sticky: 200;
    --z-index-modal: 900;
    --z-index-toast: 950;
    --z-index-overlay: 850;
    --z-index-tooltip: 1000;

    --transition-fast: 140ms cubic-bezier(0.22, 1, 0.36, 1);
    --transition-base: 260ms cubic-bezier(0.22, 1, 0.36, 1);
    --transition-smooth: 420ms cubic-bezier(0.22, 1, 0.36, 1);
    --transition-lift: 360ms cubic-bezier(0.22, 1, 0.36, 1);

    --breakpoint-desktop: 1440px;
    --breakpoint-laptop: 1320px;
    --breakpoint-tablet: 992px;
    --breakpoint-tablet-portrait: 768px;
    --breakpoint-mobile: 576px;
    --breakpoint-small-mobile: 360px;

    --icon-size-sm: 1.25rem;
    --icon-size-md: 1.5rem;
    --icon-size-lg: 2rem;
    --icon-size-xl: 2.5rem;

    --button-height-sm: 2.5rem;
    --button-height-md: 3rem;
    --button-height-lg: 3.5rem;
    --input-height: 3rem;
    --card-padding: 1.35rem;
    --section-spacing: clamp(3.25rem, 6vw, 6.5rem);
    --grid-gap: 1.5rem;

    /* Homepage premium rhythm (compact luxury) */
    --home-space-xs: 0.5rem;
    --home-space-s: 0.75rem;
    --home-space-m: 1.15rem;
    --home-space-l: 1.75rem;
    --home-space-xl: 2.5rem;
    --home-section-y: clamp(1rem, 2.15vw, 2.1rem);
    --home-heading-gap: clamp(0.6rem, 1.15vw, 0.95rem);
    --home-grid-gap: 0.85rem;
    --home-card-pad: 0.9rem 1rem 1.05rem;
    --home-type-h2: clamp(1.65rem, 2.45vw, 2.35rem);
    --home-type-h3: clamp(1.05rem, 1.35vw, 1.28rem);
    --home-type-body: clamp(0.94rem, 1vw, 1.02rem);
    --home-type-lead: clamp(1rem, 1.12vw, 1.06rem);
    --home-heading-max: 18ch;

    /* Editorial / About page rhythm (aligned with homepage luxury density) */
    --editorial-section-y: clamp(2rem, 3.25vw, 3.25rem);
    --editorial-section-y-tight: clamp(1.35rem, 2.25vw, 2rem);
    --editorial-heading-gap: clamp(0.55rem, 1vw, 0.85rem);
    --editorial-block-gap: clamp(0.85rem, 1.75vw, 1.35rem);
    --editorial-card-pad: clamp(0.95rem, 1.75vw, 1.25rem);
    --editorial-grid-gap: clamp(0.75rem, 1.35vw, 1.1rem);
    --editorial-measure: 36rem;
    --editorial-heading-max: 18ch;
    --editorial-type-h1: clamp(2.5rem, 5vw, 4.25rem);
    --editorial-type-h2: clamp(1.75rem, 2.75vw, 2.55rem);
    --editorial-type-h3: clamp(1rem, 1.45vw, 1.2rem);
    --editorial-type-lead: clamp(0.98rem, 1.35vw, 1.08rem);
    --editorial-type-body: clamp(0.94rem, 1.15vw, 1.02rem);
    --editorial-type-caption: 0.72rem;
}

/* --- core/reset.css --- */
/* Reset and normalization */
*, *::before, *::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    text-rendering: optimizeLegibility;
    -webkit-text-size-adjust: 100%;
}

body, h1, h2, h3, h4, h5, h6, p, figure, blockquote, dl, dd, ul, ol, li, hr {
    margin: 0;
}

ul[class], ol[class] {
    padding: 0;
    list-style: none;
}

img, picture, video, canvas, svg {
    display: block;
    max-width: 100%;
}

button, input, select, textarea {
    font: inherit;
}

button {
    background: transparent;
    border: none;
    cursor: pointer;
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

textarea {
    resize: vertical;
}

::selection {
    background: var(--color-primary);
    color: var(--color-surface);
}

/* --- core/typography.css --- */
/* Typography system — Google Fonts loaded from includes/head.php (not via CSS @import)
   to avoid render-blocking stylesheet waterfalls. */

html {
    font-family: var(--font-family-body);
    color: var(--color-text);
    font-size: 100%;
    line-height: var(--line-height-body);
}

body {
    min-height: 100vh;
    background: var(--color-background);
    color: var(--color-text);
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-family-body);
    color: var(--color-secondary);
    letter-spacing: var(--letter-spacing-tight);
    margin: 0 0 var(--spacing-md);
    font-weight: var(--font-weight-semibold);
    text-wrap: balance;
}

h1 { font-size: var(--font-size-h1); line-height: var(--line-height-heading); }
h2 { font-size: var(--font-size-h2); line-height: var(--line-height-heading); }
h3 { font-size: var(--font-size-h3); line-height: 1.12; }
h4 { font-size: var(--font-size-h4); }
h5 { font-size: var(--font-size-h5); }
h6 { font-size: var(--font-size-h6); }

.p-display { font-size: var(--font-size-display); line-height: var(--line-height-heading); letter-spacing: var(--letter-spacing-tight); }
.p-subtitle { font-size: var(--font-size-subtitle); line-height: var(--line-height-body); color: var(--color-text-muted); }
.p-body-large { font-size: var(--font-size-body-large); line-height: var(--line-height-body); }
.p-body-medium { font-size: var(--font-size-body-medium); line-height: var(--line-height-body); }
.p-body-small { font-size: var(--font-size-body-small); line-height: var(--line-height-body); }
.p-caption { font-size: var(--font-size-caption); line-height: var(--line-height-caption); color: var(--color-text-muted); }
.p-label { font-size: var(--font-size-label); font-weight: var(--font-weight-medium); text-transform: uppercase; letter-spacing: var(--letter-spacing-wide); color: var(--color-text-muted); }
.p-button { font-size: var(--font-size-button); font-weight: var(--font-weight-semibold); letter-spacing: var(--letter-spacing-wide); }
.p-navigation { font-size: var(--font-size-navigation); font-weight: var(--font-weight-medium); }
.p-footer { font-size: var(--font-size-footer); color: var(--color-text-muted); }
.p-error { font-size: var(--font-size-error); color: var(--color-danger); }
.p-success { font-size: var(--font-size-success); color: var(--color-success); }

a { color: inherit; text-decoration: none; text-underline-offset: 0.2em; }
button, input, textarea, select { font: inherit; }

.editorial-heading,
.story-heading,
.quote-block,
.quote-block *,
.section-heading h1,
.section-heading h2,
.editorial-hero h1,
.editorial-hero h2,
.about-hero h1,
.about-section h2,
.about-kitchen-table h2,
.about-farewell h2,
.about-cta h2,
.contact-hero h1,
.contact-section h2,
.contact-cta h2,
.home-hero__content h1,
.home-story__content h2,
.home-newsletter__content h2,
.home-cta__content h2,
.shop-hero__content h1,
.catalogue-product-page .catalogue-cover__type h1,
.catalogue-product-page .pantry-spread__copy h2,
.catalogue-product-page .collection-showcase__heading h2,
.catalogue-product-page .final-invitation h2,
.cart-hero h1,
.cart-empty-state h2,
.checkout-hero h1,
.checkout-section__header h2,
.order-confirmation-hero h1,
.tracking-hero h1,
.order-section__heading h2,
.auth-story h1,
.auth-hero__story h1,
.customer-dashboard-hero h1 {
    font-family: var(--font-family-heading);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-heading);
}

/* --- core/base.css --- */
/* Base page styling */
body {
    min-height: 100vh;
    margin: 0;
    background:
        linear-gradient(180deg, rgba(252, 250, 246, 0.92), rgba(250, 247, 240, 0.98) 36rem),
        radial-gradient(circle at top left, rgba(197, 168, 112, 0.08), transparent 24rem),
        var(--color-background);
    color: var(--color-text);
    font-feature-settings: 'liga' 1, 'kern' 1;
}

img, video, picture {
    display: block;
    width: 100%;
    height: auto;
}

button {
    border: 0;
}

main {
    overflow-x: hidden;
}

.container {
    width: min(100%, 120rem);
    margin-inline: auto;
    padding-inline: var(--spacing-lg);
}

.section {
    padding-block: var(--section-spacing);
}

.section-heading {
    max-width: 42rem;
    margin-bottom: clamp(1.75rem, 3vw, 2.75rem);
}

.section-label,
.eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    margin-bottom: var(--spacing-sm);
    font-size: 0.72rem;
    font-weight: var(--font-weight-semibold);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--color-primary-dark);
}

.section-subtitle {
    margin: 0;
    font-size: clamp(1rem, 1.15vw, 1.1rem);
    color: var(--color-text-muted);
    line-height: 1.78;
}

.text-link {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    color: var(--color-secondary);
    font-weight: var(--font-weight-semibold);
    transition: color var(--transition-fast);
}

.text-link:hover,
.text-link:focus-visible {
    color: var(--color-primary-dark);
    text-decoration: underline;
}

.hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-md);
    margin-top: clamp(1.25rem, 2vw, 2rem);
}

.card-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--spacing-lg);
}

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

:focus-visible {
    outline: 2px solid var(--color-primary-dark);
    outline-offset: 3px;
}

::placeholder {
    color: var(--color-text-muted);
    opacity: 1;
}

/* --- core/utilities.css --- */
/* Utility classes */
.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;
}

.text-center { text-align: center; }
.mt-0 { margin-top: 0; }
.mb-0 { margin-bottom: 0; }
.mt-sm { margin-top: var(--spacing-sm); }
.mb-sm { margin-bottom: var(--spacing-sm); }
.u-flex { display: flex; }
.u-grid { display: grid; gap: var(--spacing-lg); }
.u-full-width { width: 100%; }
.u-rounded { border-radius: var(--radius-medium); }
@media (max-width: var(--breakpoint-tablet)) {
    .tablet-hidden { display: none !important; }
}

/* --- core/animations.css --- */
/* Animation library — premium micro-interactions (CSS-first) */
@keyframes fade-in {
    from { opacity: 0; transform: translateY(0.75rem); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes fade-up {
    from { opacity: 0; transform: translateY(1.5rem); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes scale-in {
    from { opacity: 0; transform: scale(0.97); }
    to { opacity: 1; transform: scale(1); }
}

@keyframes glow-pulse {
    0%, 100% { box-shadow: var(--shadow-medium); }
    50% { box-shadow: var(--shadow-medium), var(--shadow-glow-gold); }
}

@keyframes skeleton-loading {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

@keyframes soft-lift {
    from { transform: translateY(0); }
    to { transform: translateY(-0.35rem); }
}

@keyframes trust-float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-0.45rem); }
}

@keyframes trust-pulse {
    0%, 100% { transform: scale(1); }
    25% { transform: scale(1.08); }
    50% { transform: scale(1); }
    75% { transform: scale(1.05); }
}

@keyframes trust-sparkle {
    0%, 100% { opacity: 1; filter: brightness(1); }
    40% { opacity: 0.72; filter: brightness(1.35); }
    60% { opacity: 1; filter: brightness(1.15); }
}

@keyframes trust-rotate {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

@keyframes trust-sway {
    0%, 100% { transform: rotate(-4deg); }
    50% { transform: rotate(4deg); }
}

@keyframes trust-blink-pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.45; transform: scale(0.94); }
}

.animate-fade-in { animation: fade-in var(--transition-smooth) both; }
.animate-fade-up { animation: fade-up var(--transition-smooth) both; }
.animate-scale-in { animation: scale-in var(--transition-smooth) both; }

.skeleton {
    background: linear-gradient(90deg, rgba(255, 246, 223, 0.08) 0%, rgba(228, 197, 144, 0.12) 50%, rgba(255, 246, 223, 0.08) 100%);
    background-size: 200% 100%;
    animation: skeleton-loading 1.5s infinite ease-in-out;
}

/* Scroll reveal enhancement hooks (works with existing .reveal-on-scroll + JS) */
.reveal-on-scroll {
    transition:
        opacity var(--transition-smooth),
        transform var(--transition-smooth),
        filter var(--transition-smooth);
}

.reveal-on-scroll.is-visible {
    filter: none;
}

/* Stagger children when parent is visible */
.reveal-on-scroll.is-visible > *:nth-child(1) { transition-delay: 0ms; }
.reveal-on-scroll.is-visible > *:nth-child(2) { transition-delay: 40ms; }
.reveal-on-scroll.is-visible > *:nth-child(3) { transition-delay: 80ms; }
.reveal-on-scroll.is-visible > *:nth-child(4) { transition-delay: 120ms; }
.reveal-on-scroll.is-visible > *:nth-child(5) { transition-delay: 160ms; }
.reveal-on-scroll.is-visible > *:nth-child(6) { transition-delay: 200ms; }

@media (prefers-reduced-motion: reduce) {
    .animate-fade-in,
    .animate-fade-up,
    .animate-scale-in,
    .skeleton,
    .reveal-on-scroll,
    .reveal-on-scroll.is-visible > *,
    .home-trust__icon,
    #trust-banner .home-trust__item,
    #trust-banner .home-trust__item:hover {
        animation: none !important;
        transition: none !important;
        transform: none !important;
        filter: none !important;
        opacity: 1 !important;
    }
}

/* --- core/effects.css --- */
/* Premium reusable effects — single source for glass, float, glow, lift.
   Prefer these utilities / composite vars over ad-hoc shadows & blur. */

:root {
    /* Soft glass blur steps (pair with --glass-bg* / --glass-border*) */
    --glass-blur-soft: 10px;
    --effect-glass-bg:
        linear-gradient(180deg, rgba(255, 248, 230, 0.055), rgba(255, 248, 230, 0.014)),
        var(--glass-bg-dark);
    --effect-glass-bg-strong:
        linear-gradient(180deg, rgba(255, 248, 230, 0.08), rgba(255, 248, 230, 0.02)),
        var(--glass-bg-dark);
    --effect-glass-filter: blur(var(--glass-blur-soft)) saturate(1.08);
    --effect-glass-filter-strong: blur(var(--glass-blur)) saturate(1.12);
    --effect-glass-filter-drawer: blur(var(--glass-blur-strong)) saturate(1.1);

    /* Composite shadows (built from --shadow-* tokens) */
    --effect-shadow-panel: var(--shadow-inset-highlight), var(--shadow-panel);
    --effect-shadow-panel-hover: var(--shadow-inset-highlight), var(--shadow-panel-hover), var(--shadow-glow-gold);
    --effect-shadow-float: var(--shadow-float);
    --effect-shadow-button: var(--shadow-inset-highlight), var(--shadow-inset-depth), var(--shadow-button);
    --effect-shadow-button-hover: var(--shadow-inset-highlight), var(--shadow-button-hover), var(--shadow-glow-gold);
    --effect-shadow-press: var(--shadow-inset-depth), var(--shadow-press);
}

/* --- Utility classes (opt-in; do not rename existing BEM) --- */

.effect-glass {
    background: var(--effect-glass-bg);
    border: 1px solid var(--glass-border);
    border-radius: var(--radius-luxury);
    box-shadow: var(--effect-shadow-panel);
    backdrop-filter: var(--effect-glass-filter);
    -webkit-backdrop-filter: var(--effect-glass-filter);
}

.effect-glass-strong {
    background: var(--effect-glass-bg-strong);
    border: 1px solid var(--glass-border-strong);
    border-radius: var(--radius-luxury);
    box-shadow: var(--effect-shadow-float);
    backdrop-filter: var(--effect-glass-filter-strong);
    -webkit-backdrop-filter: var(--effect-glass-filter-strong);
}

.effect-float {
    box-shadow: var(--effect-shadow-float);
}

.effect-glow {
    box-shadow: var(--shadow-glow-gold);
}

.effect-hairline {
    border: 1px solid var(--glass-border);
    box-shadow: var(--shadow-inset-highlight);
}

.effect-lift {
    transition:
        transform var(--transition-lift),
        box-shadow var(--transition-base),
        border-color var(--transition-base);
}

.effect-lift:hover,
.effect-lift:focus-visible {
    transform: translateY(-0.22rem);
    border-color: var(--glass-border-strong);
    box-shadow: var(--effect-shadow-panel-hover);
    outline: none;
}

.effect-panel {
    border-radius: var(--radius-luxury);
    border: 1px solid var(--glass-border);
    background: var(--effect-glass-bg);
    box-shadow: var(--effect-shadow-panel);
}

@media (prefers-reduced-motion: reduce) {
    .effect-lift,
    .effect-lift:hover,
    .effect-lift:focus-visible {
        transition: none;
        transform: none;
    }
}

/* --- layout/container.css --- */
/* Container layout */
.layout-container {
    width: min(100%, 120rem);
    margin-inline: auto;
    padding-inline: var(--spacing-lg);
}

/* --- layout/grid.css --- */
/* Grid utilities */
.grid-2 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--spacing-lg);
}

@media (max-width: var(--breakpoint-tablet)) {
    .grid-2 { grid-template-columns: 1fr; }
}

/* --- layout/header.css --- */
/* Header layout — premium glassmorphism sticky chrome */
:root {
    --navbar-glass-bg: rgba(10, 10, 10, 0.4);
    --navbar-glass-border: rgba(231, 207, 138, 0.2);
    --navbar-glass-edge: rgba(255, 255, 255, 0.05);
    --navbar-gold: rgba(231, 207, 138, 1);
    --navbar-gold-glow: rgba(231, 207, 138, 0.55);
    --navbar-transition: 0.3s ease;
}

.announcement-bar {
    overflow: hidden;
    border-bottom: 1px solid rgba(231, 207, 138, 0.18);
    background: #00120f;
    color: #e7cf8a;
}

.marquee-wrapper {
    display: flex;
    align-items: center;
    min-height: var(--header-top-height);
    overflow: hidden;
}

.marquee-wrapper:hover .marquee-content {
    animation-play-state: paused;
}

.marquee-content {
    display: flex;
    align-items: center;
    gap: 40px;
    width: max-content;
    will-change: transform;
    animation: announcement-marquee 40s linear infinite;
}

.marquee-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex: 0 0 auto;
    font-family: var(--font-family-body, Inter, sans-serif);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    line-height: 1;
    text-transform: uppercase;
    white-space: nowrap;
}

.marquee-item svg {
    width: 0.85rem;
    height: 0.85rem;
    flex-shrink: 0;
    fill: currentColor;
}

@keyframes announcement-marquee {
    from {
        transform: translate3d(0, 0, 0);
    }

    to {
        transform: translate3d(-50%, 0, 0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .marquee-content {
        animation: none;
        flex-wrap: wrap;
        justify-content: center;
        width: 100%;
        gap: 0.75rem 1.5rem;
        padding: 0.35rem 1rem;
    }
}

.site-header {
    position: sticky;
    top: 0;
    z-index: var(--z-index-sticky);
    padding: 0;
    background-color: var(--navbar-glass-bg);
    background-image: linear-gradient(var(--navbar-glass-edge), rgba(0, 0, 0, 0.05));
    border-top: 0;
    border-bottom: 1px solid var(--navbar-glass-border);
    box-shadow:
        rgba(0, 0, 0, 0.1) 0 4px 30px,
        var(--navbar-glass-edge) 0 0 0 1px inset;
    backdrop-filter: blur(20px) saturate(1.5);
    -webkit-backdrop-filter: blur(20px) saturate(1.5);
    transition:
        box-shadow var(--navbar-transition),
        background-color var(--navbar-transition),
        backdrop-filter var(--navbar-transition),
        border-color var(--navbar-transition);
}

.site-header.is-condensed {
    background-color: var(--navbar-glass-bg);
    background-image: linear-gradient(var(--navbar-glass-edge), rgba(0, 0, 0, 0.05));
    border-top: 0;
    border-bottom: 1px solid var(--navbar-glass-border);
    box-shadow:
        rgba(0, 0, 0, 0.1) 0 4px 30px,
        var(--navbar-glass-edge) 0 0 0 1px inset;
    backdrop-filter: blur(20px) saturate(1.5);
    -webkit-backdrop-filter: blur(20px) saturate(1.5);
}

.site-header.is-condensed .header-inner {
    min-height: var(--header-main-height-condensed);
    padding-block: 0;
}

.header-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--header-inner-gap);
    min-height: var(--header-main-height);
    padding-block: 0;
    transition: min-height var(--navbar-transition), padding var(--navbar-transition);
}

.brand-logo {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    transition: transform var(--navbar-transition), opacity var(--navbar-transition);
}

.brand-logo img {
    width: var(--header-logo-width);
    height: var(--header-logo-height);
    max-height: var(--header-logo-max-height);
    object-fit: contain;
    object-position: center;
    transition: max-height var(--navbar-transition), transform var(--navbar-transition);
}

.brand-logo__placeholder {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.3rem;
    width: auto;
    max-height: var(--header-logo-max-height);
    min-height: var(--header-logo-max-height);
    padding: 0.12rem 0.35rem;
    border: 1px dashed rgba(197, 168, 112, 0.42);
    border-radius: var(--radius-small);
    background: linear-gradient(180deg, var(--color-surface) 0%, var(--color-surface-muted) 100%);
    color: var(--color-text-muted);
    text-align: left;
    box-shadow: var(--shadow-low);
}

.brand-logo__placeholder-icon {
    width: 0.85rem;
    height: 0.85rem;
    flex-shrink: 0;
    color: var(--brand-gold-antique);
    opacity: 0.85;
}

.brand-logo__placeholder-copy {
    display: grid;
    gap: 0.05rem;
    min-width: 0;
}

.brand-logo__placeholder-copy strong {
    font-family: var(--font-family-body);
    font-size: 0.52rem;
    font-weight: var(--font-weight-semibold);
    letter-spacing: 0.04em;
    line-height: 1.1;
    color: var(--color-secondary-soft);
    white-space: nowrap;
}

.brand-logo__placeholder-copy small {
    font-family: var(--font-family-body);
    font-size: 0.48rem;
    letter-spacing: 0.03em;
    line-height: 1;
    color: var(--color-text-muted);
    white-space: nowrap;
}

.site-header.is-condensed .brand-logo img {
    max-height: var(--header-logo-max-height-condensed);
    transform: translateY(-1px);
}

.site-header.is-condensed .brand-logo__placeholder {
    max-height: var(--header-logo-max-height-condensed);
    min-height: var(--header-logo-max-height-condensed);
    transform: translateY(-1px);
}

/* Primary header navigation */
.header-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(0.72rem, 1.35vw, 1.22rem);
    min-width: 0;
}

.header-nav a,
.header-nav .nav-link {
    position: relative;
    display: inline-flex;
    align-items: center;
    padding: var(--header-nav-padding-y) 0;
    color: rgba(255, 244, 220, 0.82);
    font-size: 0.85rem;
    font-weight: var(--font-weight-semibold, 600);
    letter-spacing: 0.08em;
    line-height: 1;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    transition:
        color var(--navbar-transition),
        opacity var(--navbar-transition),
        transform var(--navbar-transition);
}

.header-nav a::after,
.header-nav .nav-link::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: 0.1rem;
    width: 0;
    height: 1px;
    background: var(--navbar-gold);
    transform: translateX(-50%);
    transition: width var(--navbar-transition);
}

.header-nav a:hover,
.header-nav a:focus-visible,
.header-nav a.is-active,
.header-nav .nav-link:hover,
.header-nav .nav-link:focus-visible,
.header-nav .nav-link.is-active {
    color: var(--navbar-gold);
    outline: none;
}

.header-nav a:hover::after,
.header-nav a:focus-visible::after,
.header-nav a.is-active::after,
.header-nav .nav-link:hover::after,
.header-nav .nav-link:focus-visible::after,
.header-nav .nav-link.is-active::after {
    width: 100%;
}

.header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.45rem;
}

.header-actions .icon-button,
.header-actions .mobile-header-control,
.header-actions .header-search-form {
    border-radius: 100px;
    transition:
        background var(--navbar-transition),
        border-color var(--navbar-transition),
        color var(--navbar-transition),
        box-shadow var(--navbar-transition),
        transform var(--navbar-transition),
        opacity var(--navbar-transition);
}

.header-actions .icon-button,
.header-actions .mobile-header-control {
    width: var(--header-icon-size);
    height: var(--header-icon-size);
    min-width: var(--header-icon-size);
    border: 1px solid rgba(231, 207, 138, 0.36);
    background: rgba(0, 27, 25, 0.45);
    color: var(--navbar-gold);
}

.header-actions .icon-button:hover,
.header-actions .icon-button:focus-visible,
.header-actions .mobile-header-control:hover,
.header-actions .mobile-header-control:focus-visible {
    transform: translateY(-1px);
    border-color: var(--navbar-gold);
    background: var(--navbar-gold);
    color: #000;
    box-shadow: 0 0 15px var(--navbar-gold-glow);
    outline: none;
}

.header-actions .icon-button svg,
.header-actions .mobile-header-control svg {
    transition: color var(--navbar-transition), fill var(--navbar-transition), stroke var(--navbar-transition);
}

.header-actions .icon-button:hover svg,
.header-actions .icon-button:focus-visible svg,
.header-actions .mobile-header-control:hover svg,
.header-actions .mobile-header-control:focus-visible svg {
    color: #000;
}

.nav-list {
    display: flex;
    gap: var(--spacing-lg);
}

.menu-toggle {
    display: none;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 100px;
    background: rgba(0, 27, 25, 0.45);
    border: 1px solid rgba(231, 207, 138, 0.36);
    color: var(--navbar-gold);
    cursor: pointer;
    transition:
        background var(--navbar-transition),
        border-color var(--navbar-transition),
        color var(--navbar-transition),
        box-shadow var(--navbar-transition),
        transform var(--navbar-transition);
}

.menu-toggle:hover,
.menu-toggle:focus-visible {
    transform: translateY(-1px);
    border-color: var(--navbar-gold);
    background: var(--navbar-gold);
    color: #000;
    box-shadow: 0 0 15px var(--navbar-gold-glow);
    outline: none;
}

.menu-toggle span:not(.visually-hidden) {
    display: block;
    width: 1rem;
    height: 1px;
    margin: 0.25rem auto;
    background: currentColor;
}

@media (max-width: 768px) {
    :root {
        --header-top-height: 2.25rem;
        --header-main-height: var(--header-main-height-mobile);
        --header-main-height-condensed: 3.5rem;
    }
}

@media (max-width: 900px) {
    .header-nav {
        display: none;
    }

    .header-actions .icon-button:not(:first-child):not(.cart-icon-button) {
        display: none;
    }

    .menu-toggle,
    .mobile-header-control {
        display: inline-flex;
    }
}

@media (prefers-reduced-motion: reduce) {
    .site-header,
    .header-inner,
    .header-nav a,
    .header-nav .nav-link,
    .header-actions .icon-button,
    .header-actions .mobile-header-control,
    .menu-toggle {
        transition: none;
    }
}

.account-menu__trigger--profile {
    overflow: hidden;
    padding: 0;
    width: 2.35rem;
    height: 2.35rem;
    border-radius: 999px;
    border: 1px solid rgba(228, 197, 144, 0.4);
    background: rgba(2, 26, 23, 0.85);
}

.account-menu__avatar {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.account-menu__initials {
    display: grid;
    place-items: center;
    width: 100%;
    height: 100%;
    color: #fff6df;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
}

.account-menu__panel--profile {
    width: min(18rem, calc(100vw - 2rem));
}

.account-menu__identity {
    display: grid;
    gap: 0.15rem;
    padding: 0.35rem 0.55rem 0.65rem;
    margin-bottom: 0.35rem;
    border-bottom: 1px solid rgba(228, 197, 144, 0.22);
}

.account-menu__identity strong {
    color: #fff6df;
    font-size: 0.92rem;
}

.account-menu__identity small {
    color: rgba(255, 246, 223, 0.68);
    font-size: 0.75rem;
    word-break: break-word;
}

.account-menu.is-open .account-menu__panel {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* --- layout/navigation.css --- */
/* Navigation layout — glass bar + gold active underline */
.site-nav {
    position: relative;
    border-bottom: 1px solid var(--glass-border, rgba(228, 197, 144, 0.28));
    background: var(--glass-bg-dark, rgba(2, 26, 23, 0.55));
    backdrop-filter: blur(var(--glass-blur, 18px));
    -webkit-backdrop-filter: blur(var(--glass-blur, 18px));
}

.nav-shell {
    overflow-x: auto;
    scrollbar-width: none;
}

.nav-shell::-webkit-scrollbar {
    display: none;
}

.desktop-nav {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: nowrap;
    gap: clamp(0.7rem, 1.2vw, 1.25rem);
    min-width: max-content;
    min-height: 2.65rem;
    padding: 0;
    margin: 0;
    list-style: none;
    white-space: nowrap;
}

.desktop-nav li {
    flex: 0 0 auto;
}

.nav-link {
    position: relative;
    color: var(--color-text);
    font-size: 0.68rem;
    font-weight: var(--font-weight-semibold);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    opacity: 0.78;
    transition:
        color var(--transition-fast),
        opacity var(--transition-fast);
}

.nav-link::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: -0.35rem;
    width: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--color-primary), transparent);
    box-shadow: var(--shadow-nav-glow);
    transform: translateX(-50%);
    transition: width var(--transition-base);
}

.nav-link:hover,
.nav-link:focus-visible {
    color: var(--color-secondary);
    opacity: 1;
    outline: none;
}

.nav-link:hover::after,
.nav-link:focus-visible::after,
.nav-link.is-active::after {
    width: 100%;
}

.nav-link.is-active {
    color: var(--color-secondary);
    opacity: 1;
}

.mobile-drawer,
.search-overlay {
    position: fixed;
    inset: 0;
    z-index: var(--z-index-overlay);
    pointer-events: none;
    opacity: 0;
    visibility: hidden;
    overflow: hidden;
    background: rgba(2, 26, 23, 0.62);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    transition: opacity var(--transition-base), visibility var(--transition-base);
}

.mobile-drawer.is-open,
.search-overlay.is-open {
    pointer-events: auto;
    opacity: 1;
    visibility: visible;
}

.mobile-drawer-panel,
.search-overlay-panel {
    background:
        linear-gradient(180deg, rgba(255, 248, 230, 0.06), transparent 40%),
        var(--glass-bg-dark, rgba(2, 26, 23, 0.92));
    border: 1px solid var(--glass-border);
    box-shadow: var(--shadow-float);
    backdrop-filter: blur(var(--glass-blur-strong, 28px));
    -webkit-backdrop-filter: blur(var(--glass-blur-strong, 28px));
}

.mobile-drawer-panel {
    width: min(22rem, 88vw);
    min-height: 100%;
    padding: 1.2rem;
}

.drawer-head,
.search-overlay-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.drawer-title {
    margin: 0;
    font-family: var(--font-family-display, var(--font-family-heading));
    font-size: 1.45rem;
    color: var(--color-secondary);
}

.drawer-close {
    width: 2.2rem;
    height: 2.2rem;
    border-radius: var(--radius-luxury);
    background: var(--glass-bg);
    border: 1px solid var(--glass-border);
    color: var(--color-secondary);
    cursor: pointer;
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.drawer-close:hover,
.drawer-close:focus-visible {
    border-color: var(--glass-border-strong);
    box-shadow: var(--shadow-glow-gold);
    outline: none;
}

.mobile-nav-list {
    display: grid;
    gap: 0.15rem;
    padding: 1.2rem 0;
    margin: 0;
    list-style: none;
}

.mobile-nav-list a {
    display: block;
    padding: 0.65rem 0;
    border-bottom: 1px solid var(--glass-border);
    color: var(--color-secondary);
    font-weight: var(--font-weight-semibold);
    transition: color var(--transition-fast), padding-left var(--transition-fast);
}

.mobile-nav-list a:hover,
.mobile-nav-list a:focus-visible {
    color: var(--color-primary);
    padding-left: 0.35rem;
    outline: none;
}

.drawer-panel {
    padding: 1rem;
    border: 1px solid var(--glass-border);
    border-radius: var(--radius-luxury);
    background: var(--glass-bg);
}

.drawer-caption,
.search-caption {
    margin: 0;
    color: var(--color-text-muted);
}

.search-overlay {
    display: grid;
    place-items: start center;
    padding: 5rem 1rem;
}

.search-overlay-panel {
    width: min(42rem, 100%);
    padding: 1.25rem;
    border-radius: var(--radius-luxury);
}

.search-form {
    display: flex;
    gap: 0.75rem;
    margin: 1rem 0;
}

.search-input {
    flex: 1 1 auto;
}

@media (max-width: 900px) {
    .desktop-nav {
        display: none;
    }

    .site-nav {
        border-bottom: 0;
        background: transparent;
        backdrop-filter: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .nav-link::after,
    .mobile-nav-list a,
    .drawer-close,
    .header-actions .icon-button {
        transition: none;
    }
}

/* --- layout/shell.css --- */
/* Premium application shell styles */
body {
    background:
        var(--ambient-radial, none),
        var(--texture-paper, none),
        var(--color-background);
    color: var(--color-text);
}

.page-shell {
    position: relative;
    min-height: 100vh;
    overflow-x: hidden;
}

.page-shell:not(.admin-shell-body)::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: var(--z-index-base, 0);
    background:
        var(--ambient-radial-deep, none),
        var(--texture-linen, none);
    opacity: 0.85;
}

/* Do not force position on children — that breaks fixed drawers/overlays/mini-cart. */
.page-shell:not(.admin-shell-body) > .announcement-bar,
.page-shell:not(.admin-shell-body) > .site-header,
.page-shell:not(.admin-shell-body) > main {
    position: relative;
    z-index: var(--z-index-content, 1);
    margin-top: 0;
    padding-top: 0;
}

.page-shell:not(.admin-shell-body) > .site-footer,
.page-shell:not(.admin-shell-body) > footer {
    position: relative;
    z-index: var(--z-index-content, 1);
    margin-top: 32px;
    padding-top: 48px;
}

.announcement-bar {
    position: relative;
    z-index: var(--z-index-sticky);
    overflow: hidden;
    background: #00120f;
    color: #e7cf8a;
}

.site-header {
    position: sticky;
    top: 0;
    z-index: var(--z-index-sticky);
    background-color: rgba(10, 10, 10, 0.4);
    background-image: linear-gradient(rgba(255, 255, 255, 0.05), rgba(0, 0, 0, 0.05));
    border-top: 1px solid rgba(255, 255, 255, 0.05);
    border-bottom: 1px solid rgba(231, 207, 138, 0.2);
    box-shadow:
        rgba(0, 0, 0, 0.1) 0 4px 30px,
        rgba(255, 255, 255, 0.05) 0 0 0 1px inset;
    backdrop-filter: blur(20px) saturate(1.5);
    -webkit-backdrop-filter: blur(20px) saturate(1.5);
    transition: box-shadow 0.3s ease, background-color 0.3s ease, backdrop-filter 0.3s ease, border-color 0.3s ease;
}

.header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: var(--header-main-height);
    gap: var(--header-inner-gap);
    padding-block: 0;
}

.brand-logo {
    display: inline-flex;
    align-items: center;
    width: min(7.5rem, 100%);
    transition: transform var(--transition-fast);
}

.brand-logo:hover {
    transform: scale(1.02);
}

.brand-logo img {
    width: var(--header-logo-width);
    height: var(--header-logo-height);
    max-height: var(--header-logo-max-height);
    object-fit: contain;
}

.header-actions {
    display: flex;
    align-items: center;
    gap: 0.45rem;
}

.icon-button,
.menu-toggle,
.drawer-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.2rem;
    height: 2.2rem;
    border-radius: 100px;
    border: 1px solid rgba(231, 207, 138, 0.36);
    background: rgba(0, 27, 25, 0.45);
    color: rgba(231, 207, 138, 1);
    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        background 0.3s ease,
        border-color 0.3s ease,
        color 0.3s ease,
        opacity 0.3s ease;
}

.icon-button:hover,
.icon-button:focus-visible,
.menu-toggle:hover,
.menu-toggle:focus-visible,
.drawer-close:hover,
.drawer-close:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(231, 207, 138, 1);
    background: rgba(231, 207, 138, 1);
    color: #000;
    box-shadow: 0 0 15px rgba(231, 207, 138, 0.55);
    outline: none;
}

.menu-toggle {
    gap: 0.2rem;
    padding: 0;
}

.menu-toggle span {
    display: block;
    width: 0.95rem;
    height: 2px;
    background: currentColor;
    border-radius: 999px;
}

.site-nav {
    position: relative;
    z-index: var(--z-index-dropdown);
    background: var(--color-surface);
    border-bottom: 1px solid rgba(7, 44, 44, 0.06);
}

.nav-shell {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    min-height: 2.65rem;
    overflow-x: auto;
    scrollbar-width: none;
}

.nav-shell::-webkit-scrollbar {
    display: none;
}

.desktop-nav {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-start;
    gap: clamp(0.7rem, 1.2vw, 1.25rem);
    min-width: max-content;
    list-style: none;
    padding: 0;
    margin: 0;
}

.desktop-nav li {
    flex: 0 0 auto;
}

.nav-link {
    position: relative;
    display: inline-flex;
    align-items: center;
    padding: 0.35rem 0.1rem;
    font-size: 0.68rem;
    font-weight: var(--font-weight-semibold);
    text-transform: uppercase; /* Editorial luxury look */
    letter-spacing: 0.1em; /* Luxurious tracking */
    color: var(--color-text-muted);
    transition: color var(--transition-fast);
}

.nav-link:hover,
.nav-link:focus-visible,
.nav-link.is-active {
    color: var(--color-secondary);
}

.nav-link.is-active::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -0.2rem;
    width: 100%;
    height: 2px;
    background: var(--color-primary);
    border-radius: 999px;
}

.mobile-drawer,
.search-overlay {
    position: fixed;
    inset: 0;
    z-index: var(--z-index-overlay);
    background: rgba(7, 44, 44, 0.42);
    opacity: 0;
    visibility: hidden;
    overflow: hidden;
    pointer-events: none;
    transition: opacity var(--transition-base), visibility var(--transition-base);
}

.mobile-drawer.is-open,
.search-overlay.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.mobile-drawer {
    display: flex;
    justify-content: flex-end;
}

.mobile-drawer-panel,
.search-overlay-panel {
    width: min(100%, 28rem);
    height: 100%;
    background: var(--color-surface);
    box-shadow: var(--shadow-high);
    padding: var(--spacing-lg);
    transform: translateX(100%);
    transition: transform var(--transition-smooth);
}

.mobile-drawer.is-open .mobile-drawer-panel,
.search-overlay.is-open .search-overlay-panel {
    transform: translateX(0);
}

.drawer-head,
.search-overlay-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--spacing-lg);
}

.drawer-title {
    margin: 0;
    font-family: var(--font-family-heading);
    font-size: 1.35rem;
    color: var(--color-secondary);
}

.mobile-nav-list {
    display: grid;
    gap: var(--spacing-xs);
    margin: 0 0 var(--spacing-lg);
    padding: 0;
    list-style: none;
}

.mobile-nav-list a {
    display: block;
    padding: 0.85rem 0;
    font-weight: var(--font-weight-medium);
    color: var(--color-secondary);
    border-bottom: 1px solid rgba(7, 44, 44, 0.08);
}

.drawer-panel {
    border-top: 1px solid rgba(7, 44, 44, 0.08);
    padding-top: var(--spacing-md);
}

.drawer-caption,
.search-caption {
    margin: 0 0 var(--spacing-sm);
    color: var(--color-text-muted);
}

.search-overlay-panel {
    margin-left: auto;
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
}

.search-form {
    display: grid;
    gap: var(--spacing-sm);
}

.search-input {
    min-height: 3rem;
}

.tag-list {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-xs);
    padding: 0;
    margin: 0;
    list-style: none;
}

.section {
    padding-block: var(--spacing-xxl);
}

.section-heading {
    max-width: 42rem;
    margin-bottom: clamp(1.75rem, 3vw, 2.75rem);
}

.section-label,
.eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    margin-bottom: var(--spacing-sm);
    font-size: 0.72rem;
    font-weight: var(--font-weight-semibold);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--color-primary-dark);
}

.section-subtitle {
    margin: 0;
    font-size: clamp(1rem, 1.15vw, 1.1rem);
    line-height: 1.78;
    color: var(--color-text-muted);
}

.shell-preview {
    padding-block: var(--spacing-xxl);
}

.hero-shell-preview {
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    gap: var(--spacing-xl);
    align-items: center;
}

.hero-shell-copy h1 {
    margin-bottom: var(--spacing-md);
    font-size: clamp(2.35rem, 4vw, 3.4rem);
    max-width: 12ch;
}

.hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-md);
    margin-top: var(--spacing-lg);
}

/* Button/card chrome: owned by components/buttons.css and components/cards.css.
   Keep only disabled + layout helpers here to avoid fighting the premium system. */
.button:disabled {
    opacity: 0.55;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
    filter: none;
}

.button:disabled::before {
    display: none;
}

.premium-card {
    min-height: 100%;
}

.feature-list {
    display: grid;
    gap: 0.6rem;
    padding: 0;
    margin: var(--spacing-md) 0 0;
    list-style: none;
}

.feature-list li {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--color-text-muted);
}

.feature-list li::before {
    content: '•';
    color: var(--color-primary-dark);
    font-size: 1.1rem;
}

.card-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--spacing-lg);
}

.info-card,
.feature-card,
.category-card {
    min-height: 100%;
}

.form-field {
    display: grid;
    gap: 0.45rem;
}

.input,
.select,
.textarea {
    width: 100%;
    min-height: 3rem;
    padding: 0.75rem 0.9rem;
    border: 1px solid rgba(7, 44, 44, 0.12);
    border-radius: 0.9rem;
    background: var(--color-surface);
    color: var(--color-text);
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.input:focus,
.select:focus,
.textarea:focus {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(228, 197, 144, 0.22);
    outline: none;
}

.textarea {
    min-height: 7rem;
    resize: vertical;
}

.checkbox,
.radio,
.switch {
    accent-color: var(--color-primary);
}

.alert {
    display: flex;
    align-items: flex-start;
    gap: 0.8rem;
    padding: var(--spacing-md);
    border-radius: 1rem;
    background: rgba(228, 197, 144, 0.16);
    color: var(--color-secondary);
}

.toast {
    position: fixed;
    right: var(--spacing-lg);
    bottom: var(--spacing-lg);
    max-width: 24rem;
    padding: var(--spacing-md);
    border-radius: 1rem;
    background: var(--color-secondary);
    color: var(--color-surface);
    box-shadow: var(--shadow-medium);
    z-index: var(--z-index-toast);
}

.loader {
    width: 2.85rem;
    height: 2.85rem;
    border: 0.3rem solid rgba(7, 44, 44, 0.12);
    border-top-color: var(--color-primary);
    border-radius: 50%;
    animation: spin 0.9s linear infinite;
}

.skeleton {
    background: linear-gradient(90deg, #eee 0%, #f7f7f7 50%, #eee 100%);
    background-size: 200% 100%;
    animation: skeleton-loading 1.4s infinite ease-in-out;
}

.avatar {
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    overflow: hidden;
    border: 2px solid rgba(228, 197, 144, 0.5);
}

.avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.rating {
    display: flex;
    gap: 0.25rem;
    color: var(--color-primary);
}

.price-pill,
.discount-pill,
.stock-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2rem;
    padding: 0.2rem 0.7rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: var(--font-weight-semibold);
}

.price-pill {
    background: rgba(7, 44, 44, 0.08);
    color: var(--color-secondary);
}

.discount-pill {
    background: rgba(228, 197, 144, 0.24);
    color: var(--color-primary-dark);
}

.stock-pill {
    background: rgba(40, 167, 69, 0.12);
    color: #1f7a3b;
}

.divider {
    height: 1px;
    background: rgba(7, 44, 44, 0.08);
    margin: var(--spacing-lg) 0;
}

.image-responsive,
.image-landscape,
.image-portrait,
.image-square {
    width: 100%;
    height: auto;
    object-fit: cover;
}

.image-landscape {
    aspect-ratio: 16 / 9;
}

.image-portrait {
    aspect-ratio: 4 / 5;
}

.image-square {
    aspect-ratio: 1 / 1;
}

.image-rounded {
    border-radius: 1.25rem;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

@keyframes skeleton-loading {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

@media (max-width: 992px) {
    .hero-shell-preview {
        grid-template-columns: 1fr;
    }

    .card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 768px) {
    .marquee-item {
        font-size: 0.68rem;
    }

    .desktop-nav {
        display: none;
    }

    .site-nav {
        border-bottom: 0;
    }

    .nav-shell {
        min-height: 0;
        padding: 0;
    }

    .header-inner {
        min-height: var(--header-main-height-mobile);
    }

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

    .hero-actions {
        flex-direction: column;
        align-items: flex-start;
    }
}

/* --- components/buttons.css --- */
/* Premium bespoke button component — canonical .button styles */
.button {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-xs);
    min-height: var(--button-height-md);
    padding: 0.78rem 1.65rem;
    overflow: hidden;
    border-radius: var(--radius-luxury);
    border: 1px solid transparent;
    background:
        linear-gradient(180deg, rgba(255, 248, 230, 0.12), transparent 42%),
        linear-gradient(180deg, var(--color-secondary-soft), var(--color-secondary));
    color: var(--brand-ivory);
    box-shadow: var(--effect-shadow-button, var(--shadow-inset-highlight), var(--shadow-inset-depth), var(--shadow-button));
    font-family: var(--font-family-body);
    font-size: var(--font-size-caption);
    font-weight: var(--font-weight-semibold);
    text-transform: uppercase;
    letter-spacing: 0.12em;
    transition:
        transform var(--transition-lift),
        box-shadow var(--transition-base),
        background var(--transition-base),
        border-color var(--transition-base),
        color var(--transition-base),
        filter var(--transition-base);
    cursor: pointer;
    isolation: isolate;
}

.button::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(120deg, transparent 30%, rgba(255, 248, 230, 0.18) 48%, transparent 62%);
    transform: translateX(-120%);
    transition: transform var(--transition-smooth);
    pointer-events: none;
    z-index: var(--z-index-base);
}

.button > * {
    position: relative;
    z-index: var(--z-index-content);
}

.button:hover,
.button:focus-visible {
    transform: translateY(-0.18rem);
    box-shadow: var(--effect-shadow-button-hover, var(--shadow-inset-highlight), var(--shadow-button-hover), var(--shadow-glow-gold));
    filter: brightness(1.04);
    outline: none;
}

.button:hover::before,
.button:focus-visible::before {
    transform: translateX(120%);
}

.button:active {
    transform: translateY(0);
    box-shadow: var(--effect-shadow-press, var(--shadow-inset-depth), var(--shadow-press));
    filter: brightness(0.98);
}

.button-primary {
    background:
        linear-gradient(180deg, rgba(255, 248, 230, 0.14), transparent 40%),
        linear-gradient(180deg, var(--brand-emerald), var(--brand-emerald-deep));
    border-color: var(--glass-border);
    color: var(--brand-ivory);
}

.button-primary:hover,
.button-primary:focus-visible {
    border-color: var(--glass-border-strong);
    background:
        linear-gradient(180deg, rgba(255, 248, 230, 0.18), transparent 40%),
        linear-gradient(180deg, var(--brand-forest), var(--brand-emerald));
}

.button-secondary {
    background:
        linear-gradient(180deg, rgba(255, 248, 230, 0.16), rgba(255, 248, 230, 0.06)),
        var(--glass-bg-strong);
    color: var(--brand-ivory);
    border: 1px solid var(--glass-border);
    backdrop-filter: blur(var(--glass-blur-soft, 10px));
    -webkit-backdrop-filter: blur(var(--glass-blur-soft, 10px));
    box-shadow: var(--shadow-inset-highlight), var(--shadow-low);
}

.button-secondary:hover,
.button-secondary:focus-visible {
    background:
        linear-gradient(180deg, rgba(255, 248, 230, 0.22), rgba(255, 248, 230, 0.08)),
        var(--glass-bg);
    border-color: var(--glass-border-strong);
    color: var(--brand-gold);
}

.icon-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--icon-size-xl);
    height: var(--icon-size-xl);
    border-radius: var(--radius-medium);
    border: 1px solid var(--glass-border);
    background: var(--glass-bg);
    color: var(--brand-ivory);
    backdrop-filter: blur(var(--glass-blur-soft, 10px));
    -webkit-backdrop-filter: blur(var(--glass-blur-soft, 10px));
    box-shadow: var(--shadow-inset-highlight), var(--shadow-low);
    transition: transform var(--transition-fast), background var(--transition-fast), border-color var(--transition-fast), box-shadow var(--transition-fast), color var(--transition-fast);
    cursor: pointer;
}

.icon-button:hover,
.icon-button:focus-visible {
    transform: translateY(-1px);
    background: rgba(228, 197, 144, 0.16);
    color: var(--brand-gold);
    border-color: var(--glass-border-strong);
    box-shadow: var(--shadow-glow-gold), var(--shadow-low);
    outline: none;
}

@media (prefers-reduced-motion: reduce) {
    .button,
    .button::before,
    .icon-button {
        transition: none;
    }

    .button:hover,
    .button:focus-visible,
    .icon-button:hover {
        transform: none;
    }

    .button::before {
        display: none;
    }
}

/* --- components/badge.css --- */
/* Badge component */
.badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.32rem 0.62rem;
    border-radius: var(--radius-small);
    border: 1px solid rgba(197, 168, 112, 0.24);
    background: rgba(197, 168, 112, 0.1);
    color: var(--color-secondary);
    font-size: var(--font-size-badge);
    font-weight: var(--font-weight-semibold);
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

/* --- components/forms.css --- */
/* Premium form component — glass fields + gold focus ring */
.form-field {
    display: grid;
    gap: var(--spacing-xs);
}

.input,
.select,
.textarea {
    width: 100%;
    min-height: var(--input-height);
    padding: var(--spacing-sm) var(--spacing-md);
    border: 1px solid var(--glass-border);
    border-radius: var(--radius-medium);
    background:
        linear-gradient(180deg, rgba(255, 248, 230, 0.06), transparent),
        var(--glass-bg-dark);
    color: var(--brand-ivory);
    box-shadow: var(--shadow-inset-highlight), var(--shadow-inset-depth);
    backdrop-filter: blur(var(--glass-blur-soft, 10px));
    -webkit-backdrop-filter: blur(var(--glass-blur-soft, 10px));
    transition:
        border-color var(--transition-fast),
        box-shadow var(--transition-fast),
        background var(--transition-fast);
    font-family: var(--font-family-body);
    font-size: var(--font-size-body-medium);
}

.input::placeholder,
.textarea::placeholder {
    color: var(--color-text-muted);
    opacity: 0.7;
}

.input:focus,
.select:focus,
.textarea:focus {
    border-color: var(--glass-border-strong);
    box-shadow:
        var(--shadow-focus-gold),
        var(--shadow-inset-highlight),
        var(--shadow-glow-gold);
    outline: none;
    background:
        linear-gradient(180deg, rgba(255, 248, 230, 0.1), transparent),
        var(--glass-bg-dark);
}

.textarea {
    min-height: 7rem;
    resize: vertical;
}

select.input,
.select {
    appearance: none;
    background-image:
        linear-gradient(45deg, transparent 50%, var(--brand-gold) 50%),
        linear-gradient(135deg, var(--brand-gold) 50%, transparent 50%),
        linear-gradient(180deg, rgba(255, 248, 230, 0.06), transparent),
        var(--glass-bg-dark);
    background-position:
        calc(100% - 1.15rem) calc(50% - 0.15rem),
        calc(100% - 0.85rem) calc(50% - 0.15rem),
        0 0,
        0 0;
    background-size: 0.35rem 0.35rem, 0.35rem 0.35rem, 100% 100%, 100% 100%;
    background-repeat: no-repeat;
    padding-right: 2.4rem;
}

/* --- components/drawer.css --- */
/* Drawer component */
.drawer {
    position: fixed;
    top: 0;
    right: 0;
    width: min(100%, 26rem);
    height: 100vh;
    background: var(--color-surface);
}

/* --- pages/v2-storefront.css --- */
/* V2 Luxury storefront modernization. Scoped to customer-facing shells only. */
body.page-shell:not(.admin-shell-body),
body.cart-experience-shell,
body.checkout-experience-shell,
body.order-experience-shell,
body.customer-identity-shell,
body.customer-dashboard-shell {
    --v2-emerald-950: #001b19;
    --v2-emerald-900: #032622;
    --v2-emerald-800: #073a34;
    --v2-teal: #0b4a42;
    --v2-gold: #c9a45c;
    --v2-gold-soft: #e7cf8a;
    --v2-ivory: #fff4dc;
    --v2-ivory-muted: #d8c9a4;
    --v2-border: rgba(231, 207, 138, 0.24);
    --v2-border-strong: rgba(231, 207, 138, 0.42);
    --v2-panel: rgba(0, 27, 25, 0.58);
    --v2-panel-soft: rgba(7, 58, 52, 0.38);
    --v2-shadow: 0 1.35rem 3rem rgba(0, 10, 8, 0.28);
    --color-primary: var(--v2-gold);
    --color-primary-dark: var(--v2-gold-soft);
    --color-secondary: var(--v2-ivory);
    --color-secondary-soft: var(--v2-emerald-800);
    --color-surface: var(--v2-panel);
    --color-surface-muted: var(--v2-panel-soft);
    --color-background: var(--v2-emerald-950);
    --color-background-alt: var(--v2-emerald-900);
    --color-text: var(--v2-ivory);
    --color-text-muted: var(--v2-ivory-muted);
    --color-info: var(--v2-gold);
    --color-border: var(--v2-border);
    --shadow-low: 0 0.6rem 1.5rem rgba(0, 10, 8, 0.18);
    --shadow-medium: var(--v2-shadow);
    --shadow-high: 0 2rem 4.5rem rgba(0, 10, 8, 0.38);
    --radius-small: 0.18rem;
    --radius-medium: 0.32rem;
    --radius-large: 0.45rem;
    --button-height-md: 2.55rem;
    --button-height-lg: 3rem;
    --input-height: 2.75rem;
    --card-padding: 1rem;
    --section-spacing: clamp(2.4rem, 4.8vw, 4.8rem);
    background:
        var(--ambient-radial),
        radial-gradient(ellipse 70% 45% at 12% -5%, rgba(231, 207, 138, 0.14), transparent 42%),
        radial-gradient(ellipse 55% 40% at 92% 18%, rgba(11, 74, 66, 0.5), transparent 48%),
        radial-gradient(ellipse 40% 30% at 50% 100%, rgba(228, 197, 144, 0.06), transparent 55%),
        var(--texture-paper),
        linear-gradient(180deg, var(--v2-emerald-900) 0%, var(--v2-emerald-950) 38%, #001512 100%);
    color: var(--v2-ivory);
}

body.page-shell:not(.admin-shell-body)::before,
body.cart-experience-shell::before,
body.checkout-experience-shell::before,
body.order-experience-shell::before,
body.customer-identity-shell::before,
body.customer-dashboard-shell::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    opacity: 0.22;
    background-image:
        var(--texture-linen),
        linear-gradient(45deg, rgba(231, 207, 138, 0.07) 1px, transparent 1px),
        linear-gradient(-45deg, rgba(231, 207, 138, 0.04) 1px, transparent 1px);
    background-size: auto, 4.5rem 4.5rem, 4.5rem 4.5rem;
    mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.92), transparent 88%);
}

body.page-shell:not(.admin-shell-body),
body.cart-experience-shell,
body.checkout-experience-shell,
body.order-experience-shell,
body.customer-identity-shell,
body.customer-dashboard-shell {
    position: relative;
    isolation: isolate;
}

body.page-shell:not(.admin-shell-body) .layout-container,
body.cart-experience-shell .layout-container,
body.checkout-experience-shell .layout-container,
body.order-experience-shell .layout-container,
body.customer-dashboard-shell .layout-container {
    width: min(100% - 2rem, 72rem);
}

body.page-shell:not(.admin-shell-body) .site-header .layout-container,
body.page-shell:not(.admin-shell-body) .site-nav .layout-container,
body.page-shell:not(.admin-shell-body) .site-footer .layout-container {
    width: min(100% - 2rem, 86rem);
}

body.page-shell:not(.admin-shell-body) .section,
body.cart-experience-shell .section,
body.checkout-experience-shell .section,
body.order-experience-shell .section {
    padding-block: var(--section-spacing);
}

body.page-shell:not(.admin-shell-body) h1,
body.page-shell:not(.admin-shell-body) h2,
body.page-shell:not(.admin-shell-body) h3,
body.cart-experience-shell h1,
body.cart-experience-shell h2,
body.cart-experience-shell h3,
body.checkout-experience-shell h1,
body.checkout-experience-shell h2,
body.checkout-experience-shell h3,
body.order-experience-shell h1,
body.order-experience-shell h2,
body.order-experience-shell h3,
body.customer-identity-shell h1,
body.customer-identity-shell h2,
body.customer-identity-shell h3,
body.customer-dashboard-shell h1,
body.customer-dashboard-shell h2,
body.customer-dashboard-shell h3 {
    color: var(--v2-ivory);
    font-family: var(--font-family-body);
    font-weight: 500;
    letter-spacing: 0;
}

body.page-shell:not(.admin-shell-body) h1,
body.cart-experience-shell h1,
body.checkout-experience-shell h1,
body.order-experience-shell h1,
body.customer-identity-shell h1 {
    font-size: clamp(2.25rem, 4.1vw, 4.3rem);
}

body.page-shell:not(.admin-shell-body) h2,
body.cart-experience-shell h2,
body.checkout-experience-shell h2,
body.order-experience-shell h2,
body.customer-dashboard-shell h2 {
    font-size: clamp(1.75rem, 2.9vw, 2.8rem);
}

body.page-shell:not(.admin-shell-body) :where(.home-hero__content h1, .shop-hero__content h1, .editorial-hero h1, .section-heading h2, .home-story__content h2, .home-newsletter__content h2, .home-cta__content h2),
body.cart-experience-shell :where(.cart-hero h1, .cart-empty-state h2, .cart-recommendations__intro h2),
body.checkout-experience-shell :where(.checkout-hero h1, .checkout-section__header h2),
body.order-experience-shell :where(.order-confirmation-hero h1, .tracking-hero h1, .order-section__heading h2),
body.customer-identity-shell :where(.auth-story h1, .auth-hero__story h1),
body.customer-dashboard-shell :where(.customer-dashboard-hero h1),
body.product-detail-shell :where(.catalogue-cover__type h1, .pantry-spread__copy h2, .collection-showcase__heading h2, .final-invitation h2) {
    font-family: var(--font-family-heading);
    font-weight: 500;
    line-height: 0.98;
    text-wrap: balance;
}

body.page-shell:not(.admin-shell-body) .section-subtitle,
body.page-shell:not(.admin-shell-body) p,
body.cart-experience-shell p,
body.checkout-experience-shell p,
body.order-experience-shell p,
body.customer-identity-shell p,
body.customer-dashboard-shell p {
    color: var(--v2-ivory-muted);
}

body.page-shell:not(.admin-shell-body) .section-label,
body.page-shell:not(.admin-shell-body) .eyebrow,
body.cart-experience-shell .section-label,
body.checkout-experience-shell .section-label,
body.order-experience-shell .section-label,
body.customer-dashboard-shell .section-label {
    color: var(--v2-gold-soft);
    font-size: 0.66rem;
    letter-spacing: 0.16em;
}

body.page-shell:not(.admin-shell-body) .button,
body.cart-experience-shell .button,
body.checkout-experience-shell .button,
body.order-experience-shell .button,
body.customer-identity-shell .button,
body.customer-dashboard-shell .button {
    /* Theme only — structure lives in components/buttons.css */
    min-height: var(--button-height-md);
    padding: var(--spacing-sm) 1.18rem;
    border-radius: var(--radius-hairline);
    border: 1px solid var(--v2-border-strong);
    background:
        linear-gradient(180deg, rgba(231, 207, 138, 0.18), rgba(201, 164, 92, 0.08)),
        rgba(0, 27, 25, 0.78);
    color: var(--v2-gold-soft);
    box-shadow: var(--shadow-inset-highlight);
    font-size: var(--font-size-caption);
    letter-spacing: 0.16em;
}

body.page-shell:not(.admin-shell-body) .button:hover,
body.cart-experience-shell .button:hover,
body.checkout-experience-shell .button:hover,
body.order-experience-shell .button:hover,
body.customer-identity-shell .button:hover,
body.customer-dashboard-shell .button:hover {
    transform: translateY(-0.18rem);
    background:
        linear-gradient(180deg, rgba(231, 207, 138, 0.26), rgba(201, 164, 92, 0.13)),
        rgba(3, 38, 34, 0.92);
    border-color: var(--v2-border-strong);
    box-shadow: var(--effect-shadow-button-hover, var(--shadow-button-hover), var(--shadow-glow-gold));
}

body.page-shell:not(.admin-shell-body) .button-primary,
body.cart-experience-shell .button-primary,
body.checkout-experience-shell .button-primary,
body.order-experience-shell .button-primary,
body.customer-identity-shell .button-primary {
    background:
        linear-gradient(135deg, rgba(231, 207, 138, 0.92), rgba(151, 112, 42, 0.92)),
        var(--v2-gold);
    color: var(--v2-emerald-950);
    border-color: var(--v2-border-strong);
}

body.page-shell:not(.admin-shell-body) .button-secondary,
body.cart-experience-shell .button-secondary,
body.checkout-experience-shell .button-secondary,
body.order-experience-shell .button-secondary,
body.customer-identity-shell .button-secondary {
    background: var(--glass-bg-dark);
    color: var(--v2-gold-soft);
}

body.page-shell:not(.admin-shell-body) .badge,
body.cart-experience-shell .badge,
body.checkout-experience-shell .badge,
body.order-experience-shell .badge,
body.customer-dashboard-shell .badge {
    border: 1px solid var(--v2-border);
    background: rgba(201, 164, 92, 0.1);
    color: var(--v2-gold-soft);
    border-radius: var(--radius-pill);
    font-size: var(--font-size-badge);
    letter-spacing: 0.14em;
}

body.page-shell:not(.admin-shell-body) .card,
body.page-shell:not(.admin-shell-body) .home-hero__card,
body.page-shell:not(.admin-shell-body) .home-story__media,
body.page-shell:not(.admin-shell-body) .home-feature-card,
body.page-shell:not(.admin-shell-body) .home-category-card,
body.page-shell:not(.admin-shell-body) .home-product-card,
body.page-shell:not(.admin-shell-body) .home-recipe-card,
body.page-shell:not(.admin-shell-body) .home-testimonial-card,
body.page-shell:not(.admin-shell-body) .home-faq__item,
body.page-shell:not(.admin-shell-body) .home-newsletter,
body.page-shell:not(.admin-shell-body) .home-cta,
body.page-shell:not(.admin-shell-body) .shop-category-card,
body.page-shell:not(.admin-shell-body) .shop-highlight-card,
body.page-shell:not(.admin-shell-body) .shop-product-card,
body.page-shell:not(.admin-shell-body) .shop-empty-state,
body.page-shell:not(.admin-shell-body) .shop-toolbar,
body.page-shell:not(.admin-shell-body) .shop-filters,
body.cart-experience-shell .cart-list-panel,
body.cart-experience-shell .cart-side-rail > *,
body.checkout-experience-shell .checkout-panel,
body.order-experience-shell .order-panel,
body.customer-dashboard-shell .customer-card,
body.customer-identity-shell .auth-card,
body.customer-identity-shell .auth-heritage-note,
body.customer-identity-shell .customer-state,
body.customer-identity-shell .dashboard-sidebar,
body.customer-identity-shell .profile-card,
body.customer-identity-shell .order-card,
body.customer-identity-shell .address-card,
body.customer-identity-shell .collection-card,
body.customer-identity-shell .dashboard-header,
body.customer-identity-shell .dashboard-card,
body.customer-identity-shell .customer-panel {
    /* Theme surface — glass recipe from effects.css tokens */
    background: var(--effect-glass-bg);
    border: 1px solid var(--v2-border);
    border-radius: var(--radius-luxury);
    box-shadow: var(--effect-shadow-panel);
    /* Prefer solid glass fill over blur on dense card grids (perf) */
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    transition:
        transform var(--transition-lift),
        border-color var(--transition-base),
        box-shadow var(--transition-base);
}

body.page-shell:not(.admin-shell-body) .card:hover,
body.page-shell:not(.admin-shell-body) .home-hero__card:hover,
body.page-shell:not(.admin-shell-body) .home-category-card:hover,
body.page-shell:not(.admin-shell-body) .home-product-card:hover,
body.page-shell:not(.admin-shell-body) .home-recipe-card:hover,
body.page-shell:not(.admin-shell-body) .shop-product-card:hover,
body.page-shell:not(.admin-shell-body) .shop-category-card:hover,
body.cart-experience-shell .cart-item:hover {
    transform: translateY(-0.22rem);
    border-color: var(--v2-border-strong);
    box-shadow: var(--effect-shadow-panel-hover);
}

body.page-shell:not(.admin-shell-body) .card-body {
    gap: var(--spacing-xs);
    padding: var(--spacing-md);
}

body.page-shell:not(.admin-shell-body) .home-hero {
    min-height: clamp(26rem, 58vh, 37rem);
    padding-block: clamp(1.8rem, 4vw, 3.4rem);
    gap: clamp(1.6rem, 3.6vw, 3.6rem);
}

body.page-shell:not(.admin-shell-body) .home-hero__content h1,
body.page-shell:not(.admin-shell-body) .shop-hero__content h1 {
    max-width: 12ch;
    margin-block: 0.55rem 0.7rem;
}

body.page-shell:not(.admin-shell-body) .home-hero__content .section-subtitle,
body.page-shell:not(.admin-shell-body) .shop-hero__content .section-subtitle {
    max-width: 50ch;
    font-size: clamp(0.98rem, 1.08vw, 1.08rem);
    line-height: 1.68;
}

body.page-shell:not(.admin-shell-body) .hero-actions {
    margin-top: 1rem;
    gap: 0.65rem;
}

body.page-shell:not(.admin-shell-body) .home-hero__card,
body.page-shell:not(.admin-shell-body) .shop-hero__media img {
    padding: 0.55rem;
    border: 1px solid var(--v2-border-strong);
    background:
        radial-gradient(circle at 50% 38%, rgba(231, 207, 138, 0.14), transparent 42%),
        rgba(0, 21, 18, 0.82);
}

body.page-shell:not(.admin-shell-body) .home-hero__card img,
body.page-shell:not(.admin-shell-body) .home-story__media img,
body.page-shell:not(.admin-shell-body) .home-category-card img,
body.page-shell:not(.admin-shell-body) .home-product-card img,
body.page-shell:not(.admin-shell-body) .home-recipe-card img,
body.page-shell:not(.admin-shell-body) .shop-hero__media img,
body.page-shell:not(.admin-shell-body) .shop-product-card img,
body.page-shell:not(.admin-shell-body) .shop-empty-state__media img {
    border-radius: var(--radius-small);
    border: 1px solid var(--v2-border);
    background: var(--v2-emerald-900);
    object-fit: cover;
}

body.page-shell:not(.admin-shell-body) .shop-category-card__media img {
    border-radius: 0;
    border: 0;
    background: transparent;
    object-position: center center;
}

body.page-shell:not(.admin-shell-body) .shop-product-card {
    display: flex;
    flex-direction: column;
    min-height: 100%;
}

body.page-shell:not(.admin-shell-body) .shop-product-card img,
body.page-shell:not(.admin-shell-body) .home-product-card img {
    width: calc(100% - 1.1rem);
    margin: 0.55rem auto 0;
    aspect-ratio: 1 / 0.78;
    box-shadow: 0 0 0 1px rgba(231, 207, 138, 0.12);
}

body.page-shell:not(.admin-shell-body) .shop-product-card .card-body,
body.page-shell:not(.admin-shell-body) .home-product-card .card-body {
    flex: 1;
    padding: 0.85rem 0.9rem 1rem;
}

body.page-shell:not(.admin-shell-body) .shop-product-card h3,
body.page-shell:not(.admin-shell-body) .home-product-card h3 {
    font-size: clamp(1.2rem, 1.45vw, 1.55rem);
    margin-bottom: 0.2rem;
}

body.page-shell:not(.admin-shell-body) .shop-product-card__category,
body.page-shell:not(.admin-shell-body) .shop-product-card__weight {
    color: var(--v2-ivory-muted);
    font-size: 0.78rem;
}

body.page-shell:not(.admin-shell-body) .shop-product-card__price,
body.page-shell:not(.admin-shell-body) .home-product-card__price {
    color: var(--v2-gold-soft);
    font-family: var(--font-family-heading);
    font-size: 1.35rem;
}

body.page-shell:not(.admin-shell-body) .home-product-card,
body.page-shell:not(.admin-shell-body) .shop-product-card,
body.product-detail-shell .collection-piece,
body.cart-experience-shell .recommendation-card,
body.checkout-experience-shell .checkout-recommendation-card,
body.order-experience-shell .order-recommendation-card,
body.customer-identity-shell .collection-card,
body.customer-dashboard-shell .collection-card {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(231, 207, 138, 0.26);
    border-radius: var(--radius-medium);
    background:
        linear-gradient(180deg, rgba(255, 244, 220, 0.035), rgba(255, 244, 220, 0.01)),
        rgba(0, 27, 25, 0.68);
    box-shadow: inset 0 0 0 1px rgba(255, 244, 220, 0.025);
    transition: transform var(--transition-smooth), border-color var(--transition-base), box-shadow var(--transition-base), background var(--transition-base);
}

body.page-shell:not(.admin-shell-body) .home-product-card::before,
body.page-shell:not(.admin-shell-body) .shop-product-card::before,
body.product-detail-shell .collection-piece::before,
body.cart-experience-shell .recommendation-card::before,
body.checkout-experience-shell .checkout-recommendation-card::before,
body.order-experience-shell .order-recommendation-card::before,
body.customer-identity-shell .collection-card::before,
body.customer-dashboard-shell .collection-card::before {
    content: "";
    position: absolute;
    inset: 0.55rem;
    pointer-events: none;
    border: 1px solid rgba(231, 207, 138, 0.16);
    opacity: 0.72;
}

body.page-shell:not(.admin-shell-body) .home-product-card:hover,
body.page-shell:not(.admin-shell-body) .shop-product-card:hover,
body.product-detail-shell .collection-piece:hover,
body.cart-experience-shell .recommendation-card:hover,
body.checkout-experience-shell .checkout-recommendation-card:hover,
body.order-experience-shell .order-recommendation-card:hover,
body.customer-identity-shell .collection-card:hover,
body.customer-dashboard-shell .collection-card:hover {
    transform: translateY(-3px);
    border-color: rgba(231, 207, 138, 0.48);
    box-shadow: 0 1.2rem 2.6rem rgba(0, 10, 8, 0.26);
}

body.page-shell:not(.admin-shell-body) .home-product-card img,
body.page-shell:not(.admin-shell-body) .shop-product-card img,
body.product-detail-shell .collection-piece img,
body.cart-experience-shell .recommendation-card img,
body.checkout-experience-shell .checkout-recommendation-card img,
body.order-experience-shell .order-recommendation-card img {
    display: block;
    width: calc(100% - 1.35rem);
    max-width: 15.5rem;
    margin: 0.68rem auto 0;
    padding: 0.42rem;
    aspect-ratio: 1 / 0.82;
    object-fit: contain;
    border: 1px solid rgba(231, 207, 138, 0.32);
    border-radius: var(--radius-small);
    background:
        radial-gradient(circle at 50% 34%, rgba(231, 207, 138, 0.16), transparent 48%),
        linear-gradient(145deg, rgba(3, 58, 52, 0.92), rgba(0, 21, 18, 0.96));
    box-shadow:
        inset 0 0 1.5rem rgba(0, 10, 8, 0.2),
        0 0.7rem 1.4rem rgba(0, 10, 8, 0.18);
    transition: transform var(--transition-smooth), border-color var(--transition-base), filter var(--transition-base);
}

body.page-shell:not(.admin-shell-body) .home-product-card:hover img,
body.page-shell:not(.admin-shell-body) .shop-product-card:hover img,
body.product-detail-shell .collection-piece:hover img,
body.cart-experience-shell .recommendation-card:hover img,
body.checkout-experience-shell .checkout-recommendation-card:hover img,
body.order-experience-shell .order-recommendation-card:hover img {
    transform: translateY(-2px);
    border-color: rgba(231, 207, 138, 0.52);
    filter: saturate(1.05) contrast(1.02);
}

body.customer-identity-shell .collection-card__image,
body.customer-dashboard-shell .collection-card__image {
    width: calc(100% - 1.35rem);
    max-width: 15.5rem;
    min-height: 10.5rem;
    margin: 0.68rem auto 0;
    border: 1px solid rgba(231, 207, 138, 0.32);
    border-radius: var(--radius-small);
    background:
        radial-gradient(circle at 50% 34%, rgba(231, 207, 138, 0.18), transparent 44%),
        linear-gradient(145deg, rgba(3, 58, 52, 0.92), rgba(0, 21, 18, 0.96));
    box-shadow: inset 0 0 1.5rem rgba(0, 10, 8, 0.22);
}

body.customer-identity-shell .collection-card__image::after,
body.customer-dashboard-shell .collection-card__image::after {
    content: "MVS";
    display: grid;
    place-items: center;
    min-height: 10.5rem;
    color: rgba(231, 207, 138, 0.74);
    font-family: var(--font-family-heading);
    font-size: 2rem;
    letter-spacing: 0.12em;
}

body.page-shell:not(.admin-shell-body) .home-product-card .card-body,
body.page-shell:not(.admin-shell-body) .shop-product-card .card-body,
body.product-detail-shell .collection-piece a,
body.cart-experience-shell .recommendation-card > div,
body.checkout-experience-shell .checkout-recommendation-card,
body.order-experience-shell .order-recommendation-card,
body.customer-identity-shell .collection-card,
body.customer-dashboard-shell .collection-card {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

body.page-shell:not(.admin-shell-body) .home-product-card .card-body,
body.page-shell:not(.admin-shell-body) .shop-product-card .card-body,
body.cart-experience-shell .recommendation-card > div,
body.customer-identity-shell .collection-card,
body.customer-dashboard-shell .collection-card {
    padding: 0.85rem 0.95rem 1rem;
}

body.product-detail-shell .collection-piece a {
    position: relative;
    z-index: 1;
    padding: 0 0.95rem 1rem;
    color: inherit;
}

body.page-shell:not(.admin-shell-body) .home-product-card h3,
body.page-shell:not(.admin-shell-body) .shop-product-card h3,
body.product-detail-shell .collection-piece h3,
body.cart-experience-shell .recommendation-card h3,
body.checkout-experience-shell .checkout-recommendation-card h3,
body.order-experience-shell .order-recommendation-card h3,
body.customer-identity-shell .collection-card h3,
body.customer-dashboard-shell .collection-card h3 {
    margin: 0;
    color: var(--v2-ivory);
    font-family: var(--font-family-heading);
    font-size: clamp(1.22rem, 1.35vw, 1.5rem);
    line-height: var(--line-height-heading);
}

body.page-shell:not(.admin-shell-body) .home-product-card p,
body.page-shell:not(.admin-shell-body) .shop-product-card p,
body.product-detail-shell .collection-piece span,
body.cart-experience-shell .recommendation-card p,
body.checkout-experience-shell .checkout-recommendation-card p,
body.order-experience-shell .order-recommendation-card p,
body.customer-identity-shell .collection-card span,
body.customer-dashboard-shell .collection-card span {
    color: var(--v2-gold-soft);
    font-size: var(--font-size-badge);
    font-weight: 700;
    letter-spacing: var(--letter-spacing-wide);
    text-transform: uppercase;
}

body.page-shell:not(.admin-shell-body) .home-product-card .section-subtitle,
body.page-shell:not(.admin-shell-body) .shop-product-card .section-subtitle,
body.cart-experience-shell .recommendation-card small,
body.checkout-experience-shell .checkout-recommendation-card small,
body.order-experience-shell .order-recommendation-card small {
    color: rgba(216, 201, 164, 0.78);
    font-size: var(--font-size-body-small);
    line-height: 1.58;
}

body.product-detail-shell .collection-piece p,
body.cart-experience-shell .recommendation-card span,
body.checkout-experience-shell .checkout-recommendation-card span,
body.order-experience-shell .order-recommendation-card span,
body.customer-identity-shell .collection-card p,
body.customer-dashboard-shell .collection-card p {
    color: var(--v2-gold-soft);
    font-family: var(--font-family-heading);
    font-size: 1.24rem;
    line-height: 1;
}

body.page-shell:not(.admin-shell-body) .home-page {
    padding-bottom: clamp(1.5rem, 3vw, 2.5rem);
}

body.page-shell:not(.admin-shell-body) .home-page .home-page__sections > .section {
    padding-block: var(--home-section-y);
}

body.page-shell:not(.admin-shell-body) .home-page .home-page__sections > .section + .section::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    width: min(36rem, 72vw);
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(231, 207, 138, 0.42), transparent);
    transform: translateX(-50%);
}

body.page-shell:not(.admin-shell-body) .home-hero {
    min-height: clamp(20rem, 42vh, 28rem);
    padding-block: clamp(1.15rem, 2.4vw, 2.1rem);
    gap: clamp(1.25rem, 3vw, 2.8rem);
}

body.page-shell:not(.admin-shell-body) .home-hero__content h1 {
    max-width: 10.5ch;
    margin-block: 0.45rem 0.6rem;
    font-size: clamp(2.7rem, 4.5vw, 4.75rem);
}

body.page-shell:not(.admin-shell-body) .home-hero__content .section-subtitle {
    max-width: 45ch;
    font-size: clamp(0.96rem, 1vw, 1.06rem);
}

body.page-shell:not(.admin-shell-body) .home-hero__card {
    position: relative;
    width: min(100%, 29rem);
    justify-self: end;
    padding: 0.58rem;
    background:
        radial-gradient(circle at 50% 28%, rgba(231, 207, 138, 0.16), transparent 44%),
        linear-gradient(145deg, rgba(7, 58, 52, 0.94), rgba(0, 21, 18, 0.98));
}

body.page-shell:not(.admin-shell-body) .home-hero__card::after {
    content: "";
    position: absolute;
    inset: 0.92rem;
    pointer-events: none;
    border: 1px solid rgba(231, 207, 138, 0.18);
}

body.page-shell:not(.admin-shell-body) .home-hero__card img {
    aspect-ratio: 1.16 / 0.82;
    max-height: 19.5rem;
    object-fit: contain;
    padding: 0.55rem;
    background: rgba(0, 21, 18, 0.56);
}

body.page-shell:not(.admin-shell-body) .home-hero__card-body {
    padding: 0.85rem 0.4rem 0.24rem;
}

body.page-shell:not(.admin-shell-body) .home-hero__card-body h2 {
    font-size: clamp(1.32rem, 1.7vw, 1.72rem);
}

body.page-shell:not(.admin-shell-body) .scroll-indicator {
    margin-top: 1rem;
    color: var(--v2-gold-soft);
    font-size: var(--font-size-caption);
    letter-spacing: var(--letter-spacing-wide);
    text-transform: uppercase;
}

body.page-shell:not(.admin-shell-body) .home-trust:not(#trust-banner) {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    margin-block: 0;
    padding-block: 0;
    border-color: rgba(231, 207, 138, 0.22);
    background:
        linear-gradient(90deg, rgba(201, 164, 92, 0.04), rgba(11, 74, 66, 0.16), rgba(201, 164, 92, 0.04)),
        rgba(0, 21, 18, 0.36);
}

body.page-shell:not(.admin-shell-body) .home-trust:not(#trust-banner) .home-trust__item {
    padding: clamp(0.7rem, 1.2vw, 1rem) 0.75rem;
    text-align: left;
    border-right-color: rgba(231, 207, 138, 0.16);
}

body.page-shell:not(.admin-shell-body) #trust-banner .home-trust__item {
    text-align: center;
    border-right: 0;
}

body.page-shell:not(.admin-shell-body) .home-trust:not(#trust-banner) .home-trust__icon {
    width: auto;
    height: auto;
    margin-bottom: 0.4rem;
    border: 0;
    background: transparent;
    color: var(--v2-gold-soft);
    font-size: 0.72rem;
}

body.page-shell:not(.admin-shell-body) .home-trust:not(#trust-banner) .home-trust__item h3 {
    color: rgba(255, 244, 220, 0.86);
    font-size: 0.64rem;
    line-height: 1.35;
}

body.page-shell:not(.admin-shell-body) .section-heading {
    max-width: 40rem;
    margin-inline: auto;
    margin-bottom: var(--home-heading-gap);
    text-align: center;
}

body.page-shell:not(.admin-shell-body) .home-page .section-heading h2,
body.page-shell:not(.admin-shell-body) .home-story__content h2 {
    max-width: var(--home-heading-max);
    margin-inline: auto;
    margin-bottom: 0.55rem;
    font-size: var(--home-type-h2);
    line-height: 1.06;
}

body.page-shell:not(.admin-shell-body) .home-page .home-story__content h2 {
    max-width: 14ch;
    margin-inline: 0;
    text-align: left;
}

body.page-shell:not(.admin-shell-body) .section-heading .section-subtitle,
body.page-shell:not(.admin-shell-body) .home-story__content .section-subtitle {
    max-width: 48ch;
    margin-inline: auto;
    font-size: var(--home-type-lead);
    line-height: 1.62;
}

body.page-shell:not(.admin-shell-body) .home-page .home-story__content .section-subtitle {
    margin-inline: 0;
}

body.page-shell:not(.admin-shell-body) .home-story {
    padding-block: var(--home-space-l);
    gap: clamp(1.25rem, 3vw, 2.5rem);
}

body.page-shell:not(.admin-shell-body) .home-story__media {
    overflow: hidden;
    padding: 0.38rem;
}

body.page-shell:not(.admin-shell-body) .home-story__media img,
body.page-shell:not(.admin-shell-body) .home-category-card img {
    background:
        radial-gradient(circle at 50% 32%, rgba(231, 207, 138, 0.12), transparent 48%),
        rgba(0, 21, 18, 0.72);
    border-color: rgba(231, 207, 138, 0.28);
}

body.page-shell:not(.admin-shell-body) .home-story__media img {
    aspect-ratio: 5 / 4;
    height: 100%;
    padding: 0;
    object-position: center;
    transform: scale(1.025);
}

body.page-shell:not(.admin-shell-body) .home-feature-card {
    border-width: 1px 0 0;
    background: transparent;
}

body.page-shell:not(.admin-shell-body) .home-feature-card .card-body {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0.9rem 0.2rem;
    text-align: center;
}

body.page-shell:not(.admin-shell-body) .home-feature-card__icon {
    width: 56px;
    height: 56px;
    background: rgba(231, 207, 138, 0.1);
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.5rem auto;
    transition: background 0.3s ease, color 0.3s ease, transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.3s ease;
    color: #e7cf8a;
    transform: none;
}

body.page-shell:not(.admin-shell-body) .home-feature-card:hover .home-feature-card__icon {
    background: #e7cf8a;
    color: #1a1a1a;
    transform: translateY(-5px) rotate(5deg);
    box-shadow: 0 10px 20px rgba(231, 207, 138, 0.3);
}

body.page-shell:not(.admin-shell-body) .home-feature-card__icon::before {
    content: none;
}

body.page-shell:not(.admin-shell-body) .home-feature-card__icon svg {
    width: 28px;
    height: 28px;
    stroke: currentColor;
    transition: transform 0.3s ease;
}

body.page-shell:not(.admin-shell-body) .home-feature-card:hover .home-feature-card__icon svg {
    transform: scale(1.1);
}

body.page-shell:not(.admin-shell-body) .home-collections__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.9rem;
}

body.page-shell:not(.admin-shell-body) .home-category-card {
    min-height: 100%;
}

body.page-shell:not(.admin-shell-body) .home-category-card .card-body {
    padding: 0.9rem 0.95rem 1rem;
}

body.page-shell:not(.admin-shell-body) .home-category-card h3 {
    font-size: clamp(1.15rem, 1.35vw, 1.42rem);
}

body.page-shell:not(.admin-shell-body) .home-category-card .section-subtitle {
    font-size: var(--font-size-body-small);
    line-height: 1.55;
}

body.page-shell:not(.admin-shell-body) .home-products {
    margin-inline: calc(var(--spacing-md) * -1);
    padding-inline: var(--spacing-md);
    background:
        linear-gradient(90deg, rgba(201, 164, 92, 0.05), rgba(11, 74, 66, 0.18), rgba(201, 164, 92, 0.04)),
        rgba(0, 21, 18, 0.44);
}

body.page-shell:not(.admin-shell-body) .home-products__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.page-shell:not(.admin-shell-body) .home-newsletter,
body.page-shell:not(.admin-shell-body) .home-cta {
    padding: clamp(1.1rem, 2.4vw, 1.8rem);
}

body.page-shell:not(.admin-shell-body) .home-page .sections-row-wrapper {
    display: flex;
    flex-direction: row;
    gap: 2rem;
    width: 100%;
    align-items: stretch;
    margin: 4rem 0 32px;
}

body.page-shell:not(.admin-shell-body) .home-page .sections-row-wrapper > .home-newsletter,
body.page-shell:not(.admin-shell-body) .home-page .sections-row-wrapper > .home-cta {
    flex: 1;
    width: auto;
    height: 100%;
    margin: 0;
    box-sizing: border-box;
    padding: 3rem 2.5rem;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    gap: 2.5rem;
    background: linear-gradient(145deg, rgba(1, 35, 30, 0.7), rgba(0, 21, 18, 0.44));
    border: 1px solid rgba(255, 244, 220, 0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

body.page-shell:not(.admin-shell-body) .home-page .sections-row-wrapper .home-newsletter__form {
    width: 100%;
    max-width: none;
}

body.page-shell:not(.admin-shell-body) .home-page .sections-row-wrapper .hero-actions {
    flex-wrap: wrap;
}

@media (max-width: 767px) {
    body.page-shell:not(.admin-shell-body) .home-page .sections-row-wrapper {
        flex-direction: column;
    }
}

body.page-shell:not(.admin-shell-body) .shop-products-grid,
body.page-shell:not(.admin-shell-body) .home-products__grid,
body.page-shell:not(.admin-shell-body) .home-recipes__grid {
    gap: 0.95rem;
}

body.page-shell:not(.admin-shell-body) .home-trust:not(#trust-banner) {
    margin-block: 0;
    padding-block: 0;
    border-color: rgba(231, 207, 138, 0.22);
}

body.page-shell:not(.admin-shell-body) .home-trust:not(#trust-banner) .home-trust__item {
    padding: clamp(0.7rem, 1.2vw, 1rem) 0.75rem;
    border-right-color: rgba(231, 207, 138, 0.16);
}

body.page-shell:not(.admin-shell-body) .home-trust:not(#trust-banner) .home-trust__icon,
body.page-shell:not(.admin-shell-body) .scroll-indicator__icon {
    background: transparent;
    border: 0;
    color: var(--v2-gold-soft);
}

body.page-shell:not(.admin-shell-body) .editorial-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(18rem, 0.72fr);
    gap: clamp(1.25rem, 3vw, 3rem);
    align-items: center;
    padding-block: clamp(2rem, 4.6vw, 4.5rem);
}

body.page-shell:not(.admin-shell-body) .editorial-hero h1 {
    max-width: 11ch;
}

body.page-shell:not(.admin-shell-body) .editorial-hero .section-subtitle,
body.page-shell:not(.admin-shell-body) .editorial-feature-card p,
body.page-shell:not(.admin-shell-body) .editorial-card p {
    font-size: var(--font-size-body-medium);
    line-height: var(--line-height-body);
    color: var(--color-text-muted);
}

body.page-shell:not(.admin-shell-body) .editorial-feature-card h2,
body.page-shell:not(.admin-shell-body) .editorial-card h2 {
    font-size: var(--font-size-h3);
    line-height: var(--line-height-heading);
    color: var(--color-text);
}

body.page-shell:not(.admin-shell-body) .editorial-feature-card,
body.page-shell:not(.admin-shell-body) .editorial-card,
body.page-shell:not(.admin-shell-body) .editorial-toolbar {
    background:
        linear-gradient(180deg, rgba(255, 244, 220, 0.04), rgba(255, 244, 220, 0.015)),
        rgba(0, 27, 25, 0.64);
    border: 1px solid var(--v2-border);
    border-radius: var(--radius-medium);
}

body.page-shell:not(.admin-shell-body) .editorial-feature-card,
body.page-shell:not(.admin-shell-body) .editorial-card {
    padding: var(--card-padding);
}

body.page-shell:not(.admin-shell-body) .editorial-feature-card span,
body.page-shell:not(.admin-shell-body) .editorial-card span {
    display: inline-flex;
    margin-bottom: var(--spacing-sm);
    color: var(--v2-gold-soft);
    font-size: var(--font-size-badge);
    font-weight: 700;
    letter-spacing: var(--letter-spacing-wide);
    text-transform: uppercase;
}

body.page-shell:not(.admin-shell-body) .editorial-feature-card small,
body.page-shell:not(.admin-shell-body) .editorial-card small {
    display: inline-flex;
    margin-top: var(--spacing-sm);
    color: var(--v2-gold-soft);
}

body.page-shell:not(.admin-shell-body) .editorial-card-grid,
body.page-shell:not(.admin-shell-body) .contact-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--spacing-md);
}

body.page-shell:not(.admin-shell-body) .editorial-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--spacing-sm);
    padding: var(--spacing-sm);
}

body.page-shell:not(.admin-shell-body) .editorial-toolbar > div {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-xs);
}

body.page-shell:not(.admin-shell-body) .contact-form {
    display: grid;
    gap: var(--spacing-sm);
}

body.page-shell:not(.admin-shell-body) .contact-form label {
    display: grid;
    gap: var(--spacing-xxs);
    color: var(--v2-gold-soft);
    font-size: var(--font-size-label);
    letter-spacing: var(--letter-spacing-wide);
    text-transform: uppercase;
}

body.page-shell:not(.admin-shell-body) .contact-map {
    min-height: 15rem;
    background:
        linear-gradient(45deg, rgba(231, 207, 138, 0.08) 1px, transparent 1px),
        linear-gradient(-45deg, rgba(231, 207, 138, 0.05) 1px, transparent 1px),
        rgba(0, 27, 25, 0.64);
    background-size: 2.4rem 2.4rem;
}

body.page-shell:not(.admin-shell-body) .home-trust:not(#trust-banner) .home-trust__item h3 {
    color: rgba(255, 244, 220, 0.86);
    font-size: 0.64rem;
    line-height: 1.35;
}

body.page-shell:not(.admin-shell-body) .home-products,
body.page-shell:not(.admin-shell-body) .home-newsletter,
body.page-shell:not(.admin-shell-body) .home-cta {
    background:
        linear-gradient(90deg, rgba(201, 164, 92, 0.05), rgba(11, 74, 66, 0.18), rgba(201, 164, 92, 0.04)),
        rgba(0, 21, 18, 0.44);
}

body.page-shell:not(.admin-shell-body) .shop-hero {
    padding-block: clamp(1.8rem, 4vw, 3.6rem);
    border-bottom-color: var(--v2-border);
    gap: clamp(1.4rem, 3.5vw, 3.4rem);
}

body.page-shell:not(.admin-shell-body) .shop-hero__content,
body.page-shell:not(.admin-shell-body) .home-hero__content,
body.page-shell:not(.admin-shell-body) .shop-hero__media,
body.page-shell:not(.admin-shell-body) .home-hero__media {
    min-width: 0;
}

body.page-shell:not(.admin-shell-body) .shop-layout {
    grid-template-columns: minmax(13rem, 15rem) minmax(0, 1fr);
    gap: 1rem;
}

body.page-shell:not(.admin-shell-body) .shop-toolbar,
body.page-shell:not(.admin-shell-body) .shop-filters {
    padding: 0.9rem;
}

body.page-shell:not(.admin-shell-body) .input,
body.page-shell:not(.admin-shell-body) .select,
body.page-shell:not(.admin-shell-body) .textarea,
body.page-shell:not(.admin-shell-body) input,
body.page-shell:not(.admin-shell-body) select,
body.page-shell:not(.admin-shell-body) textarea,
body.cart-experience-shell input,
body.checkout-experience-shell input,
body.customer-identity-shell input,
body.customer-dashboard-shell input {
    min-height: var(--input-height);
    background: rgba(0, 21, 18, 0.62);
    border: 1px solid var(--v2-border);
    color: var(--v2-ivory);
    border-radius: var(--radius-small);
}

body.page-shell:not(.admin-shell-body) input:focus,
body.page-shell:not(.admin-shell-body) select:focus,
body.page-shell:not(.admin-shell-body) textarea:focus,
body.cart-experience-shell input:focus,
body.checkout-experience-shell input:focus,
body.customer-identity-shell input:focus {
    border-color: var(--v2-gold-soft);
    box-shadow: 0 0 0 3px rgba(201, 164, 92, 0.14);
    outline: none;
}

body.page-shell:not(.admin-shell-body) ::placeholder,
body.cart-experience-shell ::placeholder,
body.checkout-experience-shell ::placeholder,
body.customer-identity-shell ::placeholder {
    color: rgba(216, 201, 164, 0.72);
}

body.page-shell:not(.admin-shell-body) .breadcrumbs,
body.cart-experience-shell .breadcrumbs,
body.checkout-experience-shell .breadcrumbs,
body.order-experience-shell .breadcrumbs,
body.customer-dashboard-shell .breadcrumbs {
    color: var(--v2-ivory-muted);
}

body.page-shell:not(.admin-shell-body) .breadcrumbs a,
body.cart-experience-shell .breadcrumbs a,
body.checkout-experience-shell .breadcrumbs a,
body.order-experience-shell .breadcrumbs a,
body.customer-dashboard-shell .breadcrumbs a,
body.page-shell:not(.admin-shell-body) .text-link {
    color: var(--v2-gold-soft);
}

body.cart-experience-shell .cart-hero,
body.checkout-experience-shell .checkout-hero,
body.order-experience-shell .order-hero,
body.customer-dashboard-shell .customer-hero {
    padding-block: clamp(1.8rem, 4vw, 3.4rem);
}

body.cart-experience-shell .cart-item,
body.checkout-experience-shell .checkout-step,
body.order-experience-shell .order-timeline,
body.customer-dashboard-shell .customer-panel,
body.customer-identity-shell .customer-field,
body.customer-identity-shell .customer-check,
body.customer-identity-shell .card-actions {
    border-color: var(--v2-border);
    background: rgba(0, 27, 25, 0.5);
}

body.customer-identity-shell .auth-page,
body.customer-identity-shell .dashboard-page {
    width: min(100% - 2rem, 72rem);
    margin-inline: auto;
}

body.customer-identity-shell .auth-experience,
body.customer-identity-shell .auth-hero,
body.customer-identity-shell .dashboard-shell {
    padding-block: clamp(2.2rem, 5vw, 4.8rem);
}

body.customer-identity-shell .auth-card,
body.customer-identity-shell .dashboard-sidebar,
body.customer-identity-shell .dashboard-header,
body.customer-identity-shell .profile-card,
body.customer-identity-shell .order-card,
body.customer-identity-shell .address-card,
body.customer-identity-shell .collection-card {
    border-color: var(--v2-border);
    box-shadow: none;
}

body.customer-identity-shell .dashboard-sidebar a,
body.customer-identity-shell .auth-card__helper a,
body.customer-identity-shell .auth-card__footer a {
    color: var(--v2-gold-soft);
}

body.customer-identity-shell .dashboard-sidebar a.is-active {
    background: rgba(201, 164, 92, 0.13);
    border-color: var(--v2-border-strong);
}

body.customer-identity-shell .customer-field span,
body.customer-identity-shell .profile-card span,
body.customer-identity-shell .address-card span,
body.customer-identity-shell .collection-card span {
    color: var(--v2-gold-soft);
}

body.customer-identity-shell .status-badge {
    border: 1px solid var(--v2-border);
    background: rgba(201, 164, 92, 0.12);
    color: var(--v2-gold-soft);
}

body.customer-identity-shell .collection-card__image {
    background:
        radial-gradient(circle at 50% 42%, rgba(231, 207, 138, 0.2), transparent 48%),
        linear-gradient(145deg, rgba(0, 27, 25, 0.8), rgba(7, 58, 52, 0.5));
    border: 1px solid var(--v2-border);
}

@media (max-width: 900px) {
    body.page-shell:not(.admin-shell-body) .layout-container,
    body.cart-experience-shell .layout-container,
    body.checkout-experience-shell .layout-container,
    body.order-experience-shell .layout-container,
    body.customer-dashboard-shell .layout-container {
        width: min(100% - 1rem, 72rem);
    }

    body.page-shell:not(.admin-shell-body) .site-nav {
        display: none;
    }

    body.page-shell:not(.admin-shell-body) .header-actions .icon-button:not(:first-child) {
        display: none;
    }

    body.page-shell:not(.admin-shell-body) .menu-toggle {
        display: inline-flex;
        flex: 0 0 auto;
    }

    body.page-shell:not(.admin-shell-body) .header-inner {
        gap: 0.75rem;
    }

    body.page-shell:not(.admin-shell-body) .home-hero,
    body.page-shell:not(.admin-shell-body) .shop-hero,
    body.page-shell:not(.admin-shell-body) .home-story,
    body.page-shell:not(.admin-shell-body) .shop-layout,
    body.page-shell:not(.admin-shell-body) .editorial-hero {
        grid-template-columns: 1fr;
    }

    body.page-shell:not(.admin-shell-body) .home-page .home-page__sections > .section {
        padding-block: clamp(0.85rem, 2.5vw, 1.5rem);
    }

    body.page-shell:not(.admin-shell-body) .home-hero {
        min-height: auto;
        gap: clamp(1rem, 3vw, 1.6rem);
        padding-block: clamp(1rem, 3.8vw, 1.9rem);
    }

    body.page-shell:not(.admin-shell-body) .home-hero__content h1 {
        font-size: clamp(2.35rem, 8vw, 3.4rem);
    }

    body.page-shell:not(.admin-shell-body) .home-hero__card {
        justify-self: center;
        width: min(100%, 22rem);
    }

    body.page-shell:not(.admin-shell-body) .home-hero__card img {
        max-height: 12.5rem;
    }

    body.page-shell:not(.admin-shell-body) .home-hero__card-body {
        padding-top: 0.5rem;
    }

    body.page-shell:not(.admin-shell-body) .home-hero__card-body .eyebrow {
        display: none;
    }

    body.page-shell:not(.admin-shell-body) .home-hero__card-body h2 {
        font-size: 1.12rem;
    }

    body.page-shell:not(.admin-shell-body) .scroll-indicator {
        display: none;
    }

    body.page-shell:not(.admin-shell-body) .home-hero__content .section-subtitle,
    body.page-shell:not(.admin-shell-body) .shop-hero__content .section-subtitle {
        max-width: 100%;
        overflow-wrap: anywhere;
    }

    body.page-shell:not(.admin-shell-body) .home-trust:not(#trust-banner),
    body.page-shell:not(.admin-shell-body) .home-collections__grid,
    body.page-shell:not(.admin-shell-body) .home-products__grid,
    body.page-shell:not(.admin-shell-body) .shop-categories__grid,
    body.page-shell:not(.admin-shell-body) .editorial-card-grid,
    body.page-shell:not(.admin-shell-body) .contact-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.page-shell:not(.admin-shell-body) .home-category-card:nth-child(1),
    body.page-shell:not(.admin-shell-body) .home-category-card:nth-child(6),
    body.page-shell:not(.admin-shell-body) .shop-category-card:nth-child(1),
    body.page-shell:not(.admin-shell-body) .shop-category-card:nth-child(4) {
        grid-column: auto;
    }
}

@media (max-width: 640px) {
    body.page-shell:not(.admin-shell-body) .home-page .home-page__sections > .section {
        padding-block: 0.85rem;
    }

    body.page-shell:not(.admin-shell-body) .home-hero__content h1 {
        font-size: clamp(2.05rem, 11vw, 2.85rem);
    }

    body.page-shell:not(.admin-shell-body) .home-hero__content .section-subtitle {
        font-size: var(--font-size-body-small);
    }

    body.page-shell:not(.admin-shell-body) .home-hero__card img {
        max-height: 9.8rem;
    }

    body.page-shell:not(.admin-shell-body) .home-hero__card-body {
        display: none;
    }

    body.page-shell:not(.admin-shell-body) .card-grid,
    body.page-shell:not(.admin-shell-body) .home-products__grid,
    body.page-shell:not(.admin-shell-body) .home-recipes__grid,
    body.page-shell:not(.admin-shell-body) .shop-products-grid,
    body.page-shell:not(.admin-shell-body) .shop-categories__grid,
    body.page-shell:not(.admin-shell-body) .shop-highlights__grid,
    body.page-shell:not(.admin-shell-body) .home-trust:not(#trust-banner) {
        grid-template-columns: 1fr;
    }

    body.page-shell:not(.admin-shell-body) .shop-toolbar,
    body.page-shell:not(.admin-shell-body) .editorial-toolbar,
    body.cart-experience-shell .cart-hero__actions {
        align-items: stretch;
        flex-direction: column;
    }

    body.page-shell:not(.admin-shell-body) .editorial-card-grid,
    body.page-shell:not(.admin-shell-body) .contact-grid {
        grid-template-columns: 1fr;
    }

    body.page-shell:not(.admin-shell-body) .button,
    body.cart-experience-shell .button,
    body.checkout-experience-shell .button,
    body.order-experience-shell .button,
    body.customer-identity-shell .button {
        width: 100%;
    }
}

/* Final typography refinement: serif is reserved for editorial display only. */
body.page-shell:not(.admin-shell-body) :where(
    .site-header,
    .site-nav,
    .site-footer,
    .breadcrumbs,
    .section-label,
    .eyebrow,
    .badge,
    .button,
    .input,
    .textarea,
    .select,
    .card,
    .home-hero__card,
    .home-feature-card,
    .home-category-card,
    .home-product-card,
    .home-recipe-card,
    .home-testimonial-card,
    .home-faq__item,
    .home-newsletter,
    .home-cta,
    .shop-category-card,
    .shop-highlight-card,
    .shop-product-card,
    .shop-toolbar,
    .shop-filters,
    .editorial-feature-card,
    .policy-card,
    .contact-card,
    .search-card
),
body.cart-experience-shell :where(.cart-list-panel, .cart-summary-card, .cart-accordion, .shipping-estimator, .save-later-section, .cart-recommendations, .cart-empty-state),
body.checkout-experience-shell :where(.checkout-panel, .checkout-progress, .checkout-summary, .checkout-address-card),
body.order-experience-shell :where(.order-panel, .order-info-panel, .order-address-card, .order-total-card, .tracking-status-card, .order-item, .milestone-card),
body.customer-identity-shell :where(.auth-card, .auth-heritage-note, .customer-state),
body.customer-dashboard-shell :where(.dashboard-sidebar, .profile-card, .order-card, .address-card, .collection-card, .dashboard-header, .dashboard-card, .customer-panel),
body.product-detail-shell :where(.catalogue-cover__kicker, .catalogue-cover__note, .product-gallery figcaption, .product-gallery__thumb, .product-purchase-panel, .purchase-panel__price, .purchase-panel__price *, .product-specs, .product-specs *, .ingredient-card, .related-product-card, .button, .badge) {
    font-family: var(--font-family-body);
}

body.page-shell:not(.admin-shell-body) :where(.home-product-card h3, .shop-product-card h3, .product-card h3, .home-category-card h3, .shop-category-card h3, .home-recipe-card h3, .editorial-feature-card h2, .contact-card h2, .policy-card h2),
body.cart-experience-shell :where(.cart-summary-card h2, .cart-accordion h2, .save-later-card h3, .recommendation-card h3, .cart-line-item h3),
body.checkout-experience-shell :where(.checkout-panel h2, .checkout-summary h2, .checkout-address-card h3, .checkout-progress strong),
body.order-experience-shell :where(.order-info-panel h2, .order-total-card h2, .tracking-status-card h2, .order-item h3, .order-address-card h3),
body.customer-identity-shell :where(.auth-card h2, .customer-state strong),
body.customer-dashboard-shell :where(.dashboard-sidebar h2, .profile-card h2, .order-card h3, .address-card h3, .collection-card h3, .dashboard-card h2, .customer-panel h2),
body.product-detail-shell :where(.product-purchase-panel h2, .ingredient-card h3, .related-product-card h3, .product-specs h2, .product-specs h3) {
    font-family: var(--font-family-body);
    line-height: 1.22;
}

body.page-shell:not(.admin-shell-body) :where(.home-hero__content h1, .shop-hero__content h1, .editorial-hero h1) {
    max-width: min(100%, 18ch);
    line-height: 0.98;
}

body.product-detail-shell :where(.catalogue-cover__type h1) {
    max-width: min(100%, 11.5ch);
    line-height: 0.86;
}

body.page-shell:not(.admin-shell-body) :where(.section-heading, .editorial-hero > div, .home-story__content, .home-newsletter__content, .home-cta__content),
body.cart-experience-shell :where(.cart-hero__copy, .cart-recommendations__intro),
body.checkout-experience-shell :where(.checkout-hero > div, .checkout-section__header),
body.order-experience-shell :where(.order-confirmation-hero__copy, .tracking-hero > div, .order-section__heading),
body.customer-identity-shell :where(.auth-story__content, .auth-hero__story),
body.customer-dashboard-shell :where(.customer-dashboard-hero) {
    max-width: 56rem;
}

body.product-detail-shell :where(.catalogue-cover__type, .pantry-spread__copy, .collection-showcase__heading, .final-invitation) {
    max-width: 58rem;
}

body.page-shell:not(.admin-shell-body) :where(.home-page .section-heading h2, .home-story__content h2, .home-newsletter__content h2, .home-cta__content h2),
body.cart-experience-shell :where(.cart-recommendations__intro h2, .cart-empty-state h2),
body.checkout-experience-shell :where(.checkout-section__header h2),
body.order-experience-shell :where(.order-section__heading h2) {
    max-width: min(100%, var(--home-heading-max, 18ch));
    line-height: 1.06;
}

body.product-detail-shell :where(.pantry-spread__copy h2, .collection-showcase__heading h2, .final-invitation h2) {
    max-width: min(100%, 20ch);
    line-height: 0.96;
}

body.page-shell:not(.admin-shell-body) :where(.section-subtitle, .editorial-hero p, .home-hero__content .section-subtitle, .home-story__content p, .home-newsletter__content p, .home-cta__content p),
body.cart-experience-shell :where(.cart-hero p:not(.section-label), .cart-recommendations__intro p),
body.checkout-experience-shell :where(.checkout-hero p:not(.section-label), .checkout-section__header p:not(.section-label)),
body.order-experience-shell :where(.order-confirmation-hero__copy > p:not(.section-label), .tracking-hero > div > p:not(.section-label), .order-section__heading p),
body.customer-identity-shell :where(.auth-story__lead, .auth-story__quote p, .auth-hero__story p:not(.section-label)),
body.customer-dashboard-shell :where(.customer-dashboard-hero p) {
    max-width: 62ch;
    line-height: 1.68;
}

body.product-detail-shell :where(.catalogue-cover__type p:not(.section-label), .pantry-spread__copy p:not(.section-label), .final-invitation p:not(.section-label)) {
    max-width: 60ch;
    line-height: 1.68;
}

body.page-shell:not(.admin-shell-body) :where(.section-label, .eyebrow, .badge) {
    margin-bottom: 0.72rem;
}

body.page-shell:not(.admin-shell-body) :where(.section-label + h1, .section-label + h2, .section-label + h3, .eyebrow + h1, .eyebrow + h2),
body.cart-experience-shell .section-label + h1,
body.checkout-experience-shell .section-label + h1,
body.order-experience-shell .section-label + h1,
body.customer-identity-shell .section-label + h1 {
    margin-top: 0;
    margin-bottom: 0.95rem;
}

body.page-shell:not(.admin-shell-body) .drawer-title,
body.page-shell:not(.admin-shell-body) .shop-product-card__price,
body.page-shell:not(.admin-shell-body) .home-product-card__price,
body.page-shell:not(.admin-shell-body) .home-product-card h3,
body.page-shell:not(.admin-shell-body) .shop-product-card h3,
body.product-detail-shell .collection-piece h3,
body.product-detail-shell .collection-piece p,
body.cart-experience-shell .recommendation-card h3,
body.cart-experience-shell .recommendation-card span,
body.checkout-experience-shell .checkout-recommendation-card h3,
body.checkout-experience-shell .checkout-recommendation-card span,
body.order-experience-shell .order-recommendation-card h3,
body.order-experience-shell .order-recommendation-card span,
body.customer-identity-shell .collection-card h3,
body.customer-identity-shell .collection-card span,
body.customer-identity-shell .collection-card p,
body.customer-dashboard-shell .collection-card h3,
body.customer-dashboard-shell .collection-card span,
body.customer-dashboard-shell .collection-card p,
body.cart-experience-shell .cart-line-item h2,
body.cart-experience-shell .cart-summary-card h2,
body.cart-experience-shell .shipping-estimator h2,
body.cart-experience-shell .save-later-section h2,
body.cart-experience-shell .cart-summary-list__total dd,
body.cart-experience-shell .cart-accordion summary,
body.checkout-experience-shell .checkout-gift__card span,
body.order-experience-shell .order-hero-mark span,
body.order-experience-shell .order-hero-mark strong,
body.order-experience-shell .order-total-card dd,
body.order-experience-shell .tracking-status-card strong {
    font-family: var(--font-family-body);
}

body.page-shell:not(.admin-shell-body) .shop-product-card__price,
body.page-shell:not(.admin-shell-body) .home-product-card__price,
body.cart-experience-shell .cart-summary-list__total dd {
    font-weight: var(--font-weight-bold);
    line-height: 1.1;
}

/* Premium hero architecture rebuild: campaign artwork is the background. */
body.page-shell:not(.admin-shell-body) .home-page__sections.shell-preview {
    padding-top: 0;
    padding-bottom: 0;
}

body.page-shell:not(.admin-shell-body) .home-page > .premium-hero {
    position: relative;
    display: grid;
    grid-template-columns: 42% 58%;
    width: 100%;
    max-width: 100%;
    height: clamp(520px, 58vh, 640px);
    min-height: 520px;
    margin: 0;
    padding: 0;
    overflow: hidden;
    border: 0;
    border-radius: 0;
    background: var(--brand-emerald-deep, #021914);
    box-shadow: none;
    transform: none;
    isolation: isolate;
}

body.page-shell:not(.admin-shell-body) .premium-hero__background,
body.page-shell:not(.admin-shell-body) .premium-hero__background img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    min-height: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

body.page-shell:not(.admin-shell-body) .premium-hero__background img {
    object-fit: cover;
    object-position: center center;
    transform: none;
}

body.page-shell:not(.admin-shell-body) .premium-hero__slide {
    position: absolute;
    inset: 0;
    display: grid;
    grid-template-columns: 42% 58%;
    opacity: 0;
    visibility: hidden;
}

body.page-shell:not(.admin-shell-body) .premium-hero__slide:first-child,
body.page-shell:not(.admin-shell-body) .premium-hero__slide.is-active {
    opacity: 1;
    visibility: visible;
}

body.page-shell:not(.admin-shell-body) .premium-hero__overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: block;
    background: linear-gradient(
        90deg,
        rgba(4, 20, 14, 0.82) 0%,
        rgba(4, 20, 14, 0.62) 28%,
        rgba(4, 20, 14, 0.22) 55%,
        rgba(4, 20, 14, 0) 82%
    );
    pointer-events: none;
}

body.page-shell:not(.admin-shell-body) .premium-hero__content {
    position: relative;
    z-index: 3;
    display: grid;
    align-content: center;
    width: min(720px, calc(42vw - 2rem));
    height: 100%;
    margin-left: clamp(1.6rem, 4.8vw, 5rem);
    padding-block: clamp(2rem, 5vh, 4rem);
}

@media (max-width: 1100px) {
    body.page-shell:not(.admin-shell-body) .home-page > .premium-hero {
        grid-template-columns: 45% 55%;
        height: clamp(460px, 54vh, 560px);
        min-height: 460px;
    }

    body.page-shell:not(.admin-shell-body) .premium-hero__slide {
        display: grid;
        grid-template-columns: 45% 55%;
    }

    body.page-shell:not(.admin-shell-body) .premium-hero__content {
        display: grid;
        width: min(36rem, calc(45vw - 2rem));
        margin-left: clamp(1.25rem, 4vw, 4rem);
    }
}

@media (max-width: 640px) {
    body.page-shell:not(.admin-shell-body) .home-page > .premium-hero {
        display: block;
        height: clamp(400px, 56vh, 500px);
        min-height: 400px;
    }

    body.page-shell:not(.admin-shell-body) .premium-hero__slide {
        display: block;
    }

    body.page-shell:not(.admin-shell-body) .premium-hero__content {
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        width: calc(100vw - 2rem);
        height: 100%;
        margin: 0 auto;
        padding: 2.5rem 1rem clamp(3.5rem, 10vh, 5rem);
        text-align: center;
    }

    body.page-shell:not(.admin-shell-body) .premium-hero__overlay {
        display: block;
        background: linear-gradient(
            180deg,
            rgba(4, 20, 14, 0.08) 0%,
            rgba(4, 20, 14, 0.28) 36%,
            rgba(4, 20, 14, 0.86) 100%
        );
    }
}

/* V2.1 header, navigation, and footer refinement */
body.page-shell:not(.admin-shell-body) .announcement-bar {
    position: relative;
    background: #00120f;
    color: #e7cf8a;
    border-bottom: 1px solid rgba(231, 207, 138, 0.18);
}

body.page-shell:not(.admin-shell-body) .marquee-wrapper {
    min-height: var(--header-top-height);
}

body.page-shell:not(.admin-shell-body) .marquee-item {
    color: #e7cf8a;
}

body.page-shell:not(.admin-shell-body) .icon-button svg,
body.page-shell:not(.admin-shell-body) .menu-toggle svg,
body.page-shell:not(.admin-shell-body) .mobile-header-control svg,
body.page-shell:not(.admin-shell-body) .drawer-close svg {
    width: 1rem;
    height: 1rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.55;
    stroke-linecap: round;
    stroke-linejoin: round;
}

body.page-shell:not(.admin-shell-body) .announcement-bar,
body.product-detail-shell .announcement-bar,
body.cart-experience-shell .announcement-bar,
body.checkout-experience-shell .announcement-bar,
body.order-experience-shell .announcement-bar,
body.customer-identity-shell .announcement-bar,
body.customer-dashboard-shell .announcement-bar {
    position: relative;
    z-index: calc(var(--z-index-sticky) + 1);
    background: #00120f;
    color: #e7cf8a;
    border-bottom: 1px solid rgba(231, 207, 138, 0.18);
}

body.page-shell:not(.admin-shell-body) .site-header,
body.product-detail-shell .site-header,
body.cart-experience-shell .site-header,
body.checkout-experience-shell .site-header,
body.order-experience-shell .site-header,
body.customer-identity-shell .site-header,
body.customer-dashboard-shell .site-header {
    position: sticky;
    top: 0;
    z-index: var(--z-index-sticky);
    padding: 0;
    background-color: rgba(10, 10, 10, 0.4);
    background-image: linear-gradient(rgba(255, 255, 255, 0.05), rgba(0, 0, 0, 0.05));
    border-top: 0;
    border-bottom: 1px solid rgba(231, 207, 138, 0.2);
    box-shadow:
        rgba(0, 0, 0, 0.1) 0 4px 30px,
        rgba(255, 255, 255, 0.05) 0 0 0 1px inset;
    backdrop-filter: blur(20px) saturate(1.5);
    -webkit-backdrop-filter: blur(20px) saturate(1.5);
    transition: box-shadow 0.3s ease, background-color 0.3s ease, backdrop-filter 0.3s ease, border-color 0.3s ease;
}

body.page-shell:not(.admin-shell-body) .site-header.is-condensed,
body.product-detail-shell .site-header.is-condensed,
body.cart-experience-shell .site-header.is-condensed,
body.checkout-experience-shell .site-header.is-condensed,
body.order-experience-shell .site-header.is-condensed,
body.customer-identity-shell .site-header.is-condensed,
body.customer-dashboard-shell .site-header.is-condensed {
    background-color: rgba(10, 10, 10, 0.4);
    background-image: linear-gradient(rgba(255, 255, 255, 0.05), rgba(0, 0, 0, 0.05));
    border-top: 0;
    border-bottom: 1px solid rgba(231, 207, 138, 0.2);
    backdrop-filter: blur(20px) saturate(1.5);
    -webkit-backdrop-filter: blur(20px) saturate(1.5);
    box-shadow:
        rgba(0, 0, 0, 0.1) 0 4px 30px,
        rgba(255, 255, 255, 0.05) 0 0 0 1px inset;
}

body.page-shell:not(.admin-shell-body) .site-header::after,
body.product-detail-shell .site-header::after,
body.cart-experience-shell .site-header::after,
body.checkout-experience-shell .site-header::after,
body.order-experience-shell .site-header::after,
body.customer-identity-shell .site-header::after,
body.customer-dashboard-shell .site-header::after {
    content: none;
}

body.page-shell:not(.admin-shell-body) .header-inner,
body.product-detail-shell .header-inner,
body.cart-experience-shell .header-inner,
body.checkout-experience-shell .header-inner,
body.order-experience-shell .header-inner,
body.customer-identity-shell .header-inner,
body.customer-dashboard-shell .header-inner {
    display: grid;
    grid-template-columns: minmax(7.6rem, 0.72fr) minmax(28rem, 1.65fr) minmax(12rem, 0.72fr);
    align-items: center;
    gap: var(--header-inner-gap);
    min-height: var(--header-main-height);
    padding-block: 0;
    transition: min-height var(--transition-smooth);
}

body.page-shell:not(.admin-shell-body) .site-header.is-condensed .header-inner,
body.product-detail-shell .site-header.is-condensed .header-inner,
body.cart-experience-shell .site-header.is-condensed .header-inner,
body.checkout-experience-shell .site-header.is-condensed .header-inner,
body.order-experience-shell .site-header.is-condensed .header-inner,
body.customer-identity-shell .site-header.is-condensed .header-inner,
body.customer-dashboard-shell .site-header.is-condensed .header-inner {
    min-height: var(--header-main-height-condensed);
    padding-block: 0;
}

body.page-shell:not(.admin-shell-body) .brand-logo--header,
body.product-detail-shell .brand-logo--header,
body.cart-experience-shell .brand-logo--header,
body.checkout-experience-shell .brand-logo--header,
body.order-experience-shell .brand-logo--header,
body.customer-identity-shell .brand-logo--header,
body.customer-dashboard-shell .brand-logo--header {
    position: relative;
    width: auto;
    justify-self: start;
    padding: 0;
    border: 0;
    background: transparent;
}

body.page-shell:not(.admin-shell-body) .brand-logo--header::after,
body.product-detail-shell .brand-logo--header::after,
body.cart-experience-shell .brand-logo--header::after,
body.checkout-experience-shell .brand-logo--header::after,
body.order-experience-shell .brand-logo--header::after,
body.customer-identity-shell .brand-logo--header::after,
body.customer-dashboard-shell .brand-logo--header::after {
    content: none;
}

body.page-shell:not(.admin-shell-body) .brand-logo--header img,
body.product-detail-shell .brand-logo--header img,
body.cart-experience-shell .brand-logo--header img,
body.checkout-experience-shell .brand-logo--header img,
body.order-experience-shell .brand-logo--header img,
body.customer-identity-shell .brand-logo--header img,
body.customer-dashboard-shell .brand-logo--header img {
    width: var(--header-logo-width);
    height: var(--header-logo-height);
    max-height: var(--header-logo-max-height);
    object-fit: contain;
    object-position: center;
    filter: none;
    transition: max-height var(--transition-smooth), transform var(--transition-smooth);
}

body.page-shell:not(.admin-shell-body) .site-header.is-condensed .brand-logo--header img,
body.product-detail-shell .site-header.is-condensed .brand-logo--header img,
body.cart-experience-shell .site-header.is-condensed .brand-logo--header img,
body.checkout-experience-shell .site-header.is-condensed .brand-logo--header img,
body.order-experience-shell .site-header.is-condensed .brand-logo--header img,
body.customer-identity-shell .site-header.is-condensed .brand-logo--header img,
body.customer-dashboard-shell .site-header.is-condensed .brand-logo--header img {
    max-height: var(--header-logo-max-height-condensed);
    transform: translateY(-1px);
}

body.page-shell:not(.admin-shell-body) .header-nav,
body.product-detail-shell .header-nav,
body.cart-experience-shell .header-nav,
body.checkout-experience-shell .header-nav,
body.order-experience-shell .header-nav,
body.customer-identity-shell .header-nav,
body.customer-dashboard-shell .header-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(0.72rem, 1.35vw, 1.22rem);
    min-width: 0;
}

body.page-shell:not(.admin-shell-body) .header-nav .nav-link,
body.product-detail-shell .header-nav .nav-link,
body.cart-experience-shell .header-nav .nav-link,
body.checkout-experience-shell .header-nav .nav-link,
body.order-experience-shell .header-nav .nav-link,
body.customer-identity-shell .header-nav .nav-link,
body.customer-dashboard-shell .header-nav .nav-link,
body.page-shell:not(.admin-shell-body) .header-nav a,
body.product-detail-shell .header-nav a,
body.cart-experience-shell .header-nav a,
body.checkout-experience-shell .header-nav a,
body.order-experience-shell .header-nav a,
body.customer-identity-shell .header-nav a,
body.customer-dashboard-shell .header-nav a {
    position: relative;
    padding: var(--header-nav-padding-y) 0;
    color: rgba(255, 244, 220, 0.82);
    font-family: var(--font-family-body);
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1;
    text-transform: uppercase;
    white-space: nowrap;
    transition: color 0.3s ease, opacity 0.3s ease, transform 0.3s ease;
}

body.page-shell:not(.admin-shell-body) .header-nav .nav-link::after,
body.product-detail-shell .header-nav .nav-link::after,
body.cart-experience-shell .header-nav .nav-link::after,
body.checkout-experience-shell .header-nav .nav-link::after,
body.order-experience-shell .header-nav .nav-link::after,
body.customer-identity-shell .header-nav .nav-link::after,
body.customer-dashboard-shell .header-nav .nav-link::after,
body.page-shell:not(.admin-shell-body) .header-nav a::after,
body.product-detail-shell .header-nav a::after,
body.cart-experience-shell .header-nav a::after,
body.checkout-experience-shell .header-nav a::after,
body.order-experience-shell .header-nav a::after,
body.customer-identity-shell .header-nav a::after,
body.customer-dashboard-shell .header-nav a::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0.12rem;
    width: 0;
    height: 1px;
    background: rgba(231, 207, 138, 1);
    transform: translateX(-50%);
    transition: width 0.3s ease;
}

body.page-shell:not(.admin-shell-body) .header-nav .nav-link:hover,
body.page-shell:not(.admin-shell-body) .header-nav .nav-link:focus-visible,
body.page-shell:not(.admin-shell-body) .header-nav .nav-link.is-active,
body.product-detail-shell .header-nav .nav-link:hover,
body.product-detail-shell .header-nav .nav-link:focus-visible,
body.product-detail-shell .header-nav .nav-link.is-active,
body.cart-experience-shell .header-nav .nav-link:hover,
body.cart-experience-shell .header-nav .nav-link:focus-visible,
body.cart-experience-shell .header-nav .nav-link.is-active,
body.checkout-experience-shell .header-nav .nav-link:hover,
body.checkout-experience-shell .header-nav .nav-link:focus-visible,
body.checkout-experience-shell .header-nav .nav-link.is-active,
body.order-experience-shell .header-nav .nav-link:hover,
body.order-experience-shell .header-nav .nav-link:focus-visible,
body.order-experience-shell .header-nav .nav-link.is-active,
body.customer-identity-shell .header-nav .nav-link:hover,
body.customer-identity-shell .header-nav .nav-link:focus-visible,
body.customer-identity-shell .header-nav .nav-link.is-active,
body.customer-dashboard-shell .header-nav .nav-link:hover,
body.customer-dashboard-shell .header-nav .nav-link:focus-visible,
body.customer-dashboard-shell .header-nav .nav-link.is-active,
body.page-shell:not(.admin-shell-body) .header-nav a:hover,
body.page-shell:not(.admin-shell-body) .header-nav a:focus-visible,
body.page-shell:not(.admin-shell-body) .header-nav a.is-active,
body.product-detail-shell .header-nav a:hover,
body.product-detail-shell .header-nav a:focus-visible,
body.product-detail-shell .header-nav a.is-active,
body.cart-experience-shell .header-nav a:hover,
body.cart-experience-shell .header-nav a:focus-visible,
body.cart-experience-shell .header-nav a.is-active,
body.checkout-experience-shell .header-nav a:hover,
body.checkout-experience-shell .header-nav a:focus-visible,
body.checkout-experience-shell .header-nav a.is-active,
body.order-experience-shell .header-nav a:hover,
body.order-experience-shell .header-nav a:focus-visible,
body.order-experience-shell .header-nav a.is-active,
body.customer-identity-shell .header-nav a:hover,
body.customer-identity-shell .header-nav a:focus-visible,
body.customer-identity-shell .header-nav a.is-active,
body.customer-dashboard-shell .header-nav a:hover,
body.customer-dashboard-shell .header-nav a:focus-visible,
body.customer-dashboard-shell .header-nav a.is-active {
    color: rgba(231, 207, 138, 1);
}

body.page-shell:not(.admin-shell-body) .header-nav .nav-link:hover::after,
body.page-shell:not(.admin-shell-body) .header-nav .nav-link:focus-visible::after,
body.page-shell:not(.admin-shell-body) .header-nav .nav-link.is-active::after,
body.product-detail-shell .header-nav .nav-link:hover::after,
body.product-detail-shell .header-nav .nav-link:focus-visible::after,
body.product-detail-shell .header-nav .nav-link.is-active::after,
body.cart-experience-shell .header-nav .nav-link:hover::after,
body.cart-experience-shell .header-nav .nav-link:focus-visible::after,
body.cart-experience-shell .header-nav .nav-link.is-active::after,
body.checkout-experience-shell .header-nav .nav-link:hover::after,
body.checkout-experience-shell .header-nav .nav-link:focus-visible::after,
body.checkout-experience-shell .header-nav .nav-link.is-active::after,
body.order-experience-shell .header-nav .nav-link:hover::after,
body.order-experience-shell .header-nav .nav-link:focus-visible::after,
body.order-experience-shell .header-nav .nav-link.is-active::after,
body.customer-identity-shell .header-nav .nav-link:hover::after,
body.customer-identity-shell .header-nav .nav-link:focus-visible::after,
body.customer-identity-shell .header-nav .nav-link.is-active::after,
body.customer-dashboard-shell .header-nav .nav-link:hover::after,
body.customer-dashboard-shell .header-nav .nav-link:focus-visible::after,
body.customer-dashboard-shell .header-nav .nav-link.is-active::after,
body.page-shell:not(.admin-shell-body) .header-nav a:hover::after,
body.page-shell:not(.admin-shell-body) .header-nav a:focus-visible::after,
body.page-shell:not(.admin-shell-body) .header-nav a.is-active::after,
body.product-detail-shell .header-nav a:hover::after,
body.product-detail-shell .header-nav a:focus-visible::after,
body.product-detail-shell .header-nav a.is-active::after,
body.cart-experience-shell .header-nav a:hover::after,
body.cart-experience-shell .header-nav a:focus-visible::after,
body.cart-experience-shell .header-nav a.is-active::after,
body.checkout-experience-shell .header-nav a:hover::after,
body.checkout-experience-shell .header-nav a:focus-visible::after,
body.checkout-experience-shell .header-nav a.is-active::after,
body.order-experience-shell .header-nav a:hover::after,
body.order-experience-shell .header-nav a:focus-visible::after,
body.order-experience-shell .header-nav a.is-active::after,
body.customer-identity-shell .header-nav a:hover::after,
body.customer-identity-shell .header-nav a:focus-visible::after,
body.customer-identity-shell .header-nav a.is-active::after,
body.customer-dashboard-shell .header-nav a:hover::after,
body.customer-dashboard-shell .header-nav a:focus-visible::after,
body.customer-dashboard-shell .header-nav a.is-active::after {
    width: 100%;
}

body.page-shell:not(.admin-shell-body) .header-actions,
body.product-detail-shell .header-actions,
body.cart-experience-shell .header-actions,
body.checkout-experience-shell .header-actions,
body.order-experience-shell .header-actions,
body.customer-identity-shell .header-actions,
body.customer-dashboard-shell .header-actions {
    display: flex;
    align-items: center;
    justify-self: end;
    gap: 0.4rem;
}

body.page-shell:not(.admin-shell-body) .icon-button,
body.page-shell:not(.admin-shell-body) .mobile-header-control,
body.page-shell:not(.admin-shell-body) .drawer-close,
body.product-detail-shell .icon-button,
body.product-detail-shell .mobile-header-control,
body.product-detail-shell .drawer-close,
body.cart-experience-shell .icon-button,
body.cart-experience-shell .mobile-header-control,
body.cart-experience-shell .drawer-close,
body.checkout-experience-shell .icon-button,
body.checkout-experience-shell .mobile-header-control,
body.checkout-experience-shell .drawer-close,
body.order-experience-shell .icon-button,
body.order-experience-shell .mobile-header-control,
body.order-experience-shell .drawer-close,
body.customer-identity-shell .icon-button,
body.customer-identity-shell .mobile-header-control,
body.customer-identity-shell .drawer-close,
body.customer-dashboard-shell .icon-button,
body.customer-dashboard-shell .mobile-header-control,
body.customer-dashboard-shell .drawer-close {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--header-icon-size);
    height: var(--header-icon-size);
    min-width: var(--header-icon-size);
    padding: 0;
    border: 1px solid rgba(231, 207, 138, 0.36);
    border-radius: 100px;
    background: rgba(0, 27, 25, 0.45);
    color: rgba(231, 207, 138, 1);
    box-shadow: inset 0 0 0 1px rgba(255, 244, 220, 0.025);
    transition:
        transform 0.3s ease,
        border-color 0.3s ease,
        background 0.3s ease,
        color 0.3s ease,
        box-shadow 0.3s ease,
        opacity 0.3s ease;
}

body.page-shell:not(.admin-shell-body) .icon-button:hover,
body.page-shell:not(.admin-shell-body) .icon-button:focus-visible,
body.page-shell:not(.admin-shell-body) .mobile-header-control:hover,
body.page-shell:not(.admin-shell-body) .mobile-header-control:focus-visible,
body.page-shell:not(.admin-shell-body) .drawer-close:hover,
body.page-shell:not(.admin-shell-body) .drawer-close:focus-visible,
body.product-detail-shell .icon-button:hover,
body.product-detail-shell .icon-button:focus-visible,
body.product-detail-shell .mobile-header-control:hover,
body.product-detail-shell .mobile-header-control:focus-visible,
body.product-detail-shell .drawer-close:hover,
body.product-detail-shell .drawer-close:focus-visible,
body.cart-experience-shell .icon-button:hover,
body.cart-experience-shell .icon-button:focus-visible,
body.cart-experience-shell .mobile-header-control:hover,
body.cart-experience-shell .mobile-header-control:focus-visible,
body.cart-experience-shell .drawer-close:hover,
body.cart-experience-shell .drawer-close:focus-visible,
body.checkout-experience-shell .icon-button:hover,
body.checkout-experience-shell .icon-button:focus-visible,
body.checkout-experience-shell .mobile-header-control:hover,
body.checkout-experience-shell .mobile-header-control:focus-visible,
body.checkout-experience-shell .drawer-close:hover,
body.checkout-experience-shell .drawer-close:focus-visible,
body.order-experience-shell .icon-button:hover,
body.order-experience-shell .icon-button:focus-visible,
body.order-experience-shell .mobile-header-control:hover,
body.order-experience-shell .mobile-header-control:focus-visible,
body.order-experience-shell .drawer-close:hover,
body.order-experience-shell .drawer-close:focus-visible,
body.customer-identity-shell .icon-button:hover,
body.customer-identity-shell .icon-button:focus-visible,
body.customer-identity-shell .mobile-header-control:hover,
body.customer-identity-shell .mobile-header-control:focus-visible,
body.customer-identity-shell .drawer-close:hover,
body.customer-identity-shell .drawer-close:focus-visible,
body.customer-dashboard-shell .icon-button:hover,
body.customer-dashboard-shell .icon-button:focus-visible,
body.customer-dashboard-shell .mobile-header-control:hover,
body.customer-dashboard-shell .mobile-header-control:focus-visible,
body.customer-dashboard-shell .drawer-close:hover,
body.customer-dashboard-shell .drawer-close:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(231, 207, 138, 1);
    background: rgba(231, 207, 138, 1);
    color: #000;
    box-shadow: 0 0 15px rgba(231, 207, 138, 0.55);
}

body.page-shell:not(.admin-shell-body) .header-search-form,
body.product-detail-shell .header-search-form,
body.cart-experience-shell .header-search-form,
body.checkout-experience-shell .header-search-form,
body.order-experience-shell .header-search-form,
body.customer-identity-shell .header-search-form,
body.customer-dashboard-shell .header-search-form {
    position: relative;
    display: flex;
    align-items: center;
    width: 2.28rem;
    height: 2.28rem;
    overflow: hidden;
    border: 1px solid rgba(231, 207, 138, 0.36);
    border-radius: 999px;
    background: rgba(0, 27, 25, 0.52);
    transition: width var(--transition-smooth), border-color var(--transition-base), background var(--transition-base);
}

body.page-shell:not(.admin-shell-body) .header-search-form:focus-within,
body.page-shell:not(.admin-shell-body) .header-search-form:hover,
body.product-detail-shell .header-search-form:focus-within,
body.product-detail-shell .header-search-form:hover,
body.cart-experience-shell .header-search-form:focus-within,
body.cart-experience-shell .header-search-form:hover,
body.checkout-experience-shell .header-search-form:focus-within,
body.checkout-experience-shell .header-search-form:hover,
body.order-experience-shell .header-search-form:focus-within,
body.order-experience-shell .header-search-form:hover,
body.customer-identity-shell .header-search-form:focus-within,
body.customer-identity-shell .header-search-form:hover,
body.customer-dashboard-shell .header-search-form:focus-within,
body.customer-dashboard-shell .header-search-form:hover {
    width: 12.5rem;
    border-color: rgba(231, 207, 138, 0.68);
    background: rgba(0, 27, 25, 0.78);
}

body.page-shell:not(.admin-shell-body) .header-search-submit,
body.product-detail-shell .header-search-submit,
body.cart-experience-shell .header-search-submit,
body.checkout-experience-shell .header-search-submit,
body.order-experience-shell .header-search-submit,
body.customer-identity-shell .header-search-submit,
body.customer-dashboard-shell .header-search-submit {
    flex: 0 0 2.28rem;
    border: 0;
    background: transparent;
    box-shadow: none;
}

body.page-shell:not(.admin-shell-body) .header-search-form input,
body.product-detail-shell .header-search-form input,
body.cart-experience-shell .header-search-form input,
body.checkout-experience-shell .header-search-form input,
body.order-experience-shell .header-search-form input,
body.customer-identity-shell .header-search-form input,
body.customer-dashboard-shell .header-search-form input {
    width: 8.8rem;
    min-width: 0;
    padding: 0 0.8rem 0 0.1rem;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--v2-ivory);
    font-size: var(--font-size-caption);
}

body.page-shell:not(.admin-shell-body) .header-search-form input::placeholder,
body.product-detail-shell .header-search-form input::placeholder,
body.cart-experience-shell .header-search-form input::placeholder,
body.checkout-experience-shell .header-search-form input::placeholder,
body.order-experience-shell .header-search-form input::placeholder,
body.customer-identity-shell .header-search-form input::placeholder,
body.customer-dashboard-shell .header-search-form input::placeholder {
    color: rgba(216, 201, 164, 0.74);
}

body.page-shell:not(.admin-shell-body) .account-menu,
body.product-detail-shell .account-menu,
body.cart-experience-shell .account-menu,
body.checkout-experience-shell .account-menu,
body.order-experience-shell .account-menu,
body.customer-identity-shell .account-menu,
body.customer-dashboard-shell .account-menu {
    position: relative;
}

body.page-shell:not(.admin-shell-body) .account-menu__panel,
body.product-detail-shell .account-menu__panel,
body.cart-experience-shell .account-menu__panel,
body.checkout-experience-shell .account-menu__panel,
body.order-experience-shell .account-menu__panel,
body.customer-identity-shell .account-menu__panel,
body.customer-dashboard-shell .account-menu__panel {
    position: absolute;
    top: calc(100% + 0.65rem);
    right: 0;
    width: 12rem;
    padding: var(--spacing-sm);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-0.35rem);
    border: 1px solid rgba(231, 207, 138, 0.34);
    background:
        linear-gradient(135deg, rgba(231, 207, 138, 0.055), transparent 38%),
        rgba(0, 27, 25, 0.96);
    box-shadow: 0 1.4rem 2.8rem rgba(0, 10, 8, 0.32);
    transition: opacity var(--transition-base), visibility var(--transition-base), transform var(--transition-base);
}

body.page-shell:not(.admin-shell-body) .account-menu:hover .account-menu__panel,
body.page-shell:not(.admin-shell-body) .account-menu:focus-within .account-menu__panel,
body.product-detail-shell .account-menu:hover .account-menu__panel,
body.product-detail-shell .account-menu:focus-within .account-menu__panel,
body.cart-experience-shell .account-menu:hover .account-menu__panel,
body.cart-experience-shell .account-menu:focus-within .account-menu__panel,
body.checkout-experience-shell .account-menu:hover .account-menu__panel,
body.checkout-experience-shell .account-menu:focus-within .account-menu__panel,
body.order-experience-shell .account-menu:hover .account-menu__panel,
body.order-experience-shell .account-menu:focus-within .account-menu__panel,
body.customer-identity-shell .account-menu:hover .account-menu__panel,
body.customer-identity-shell .account-menu:focus-within .account-menu__panel,
body.customer-dashboard-shell .account-menu:hover .account-menu__panel,
body.customer-dashboard-shell .account-menu:focus-within .account-menu__panel {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

body.page-shell:not(.admin-shell-body) .account-menu__panel a,
body.product-detail-shell .account-menu__panel a,
body.cart-experience-shell .account-menu__panel a,
body.checkout-experience-shell .account-menu__panel a,
body.order-experience-shell .account-menu__panel a,
body.customer-identity-shell .account-menu__panel a,
body.customer-dashboard-shell .account-menu__panel a {
    display: block;
    padding: 0.55rem 0.4rem;
    color: var(--v2-ivory-muted);
    font-size: var(--font-size-caption);
    letter-spacing: var(--letter-spacing-wide);
    text-transform: uppercase;
    border-bottom: 1px solid rgba(231, 207, 138, 0.14);
}

body.page-shell:not(.admin-shell-body) .account-menu__panel a:last-child,
body.product-detail-shell .account-menu__panel a:last-child,
body.cart-experience-shell .account-menu__panel a:last-child,
body.checkout-experience-shell .account-menu__panel a:last-child,
body.order-experience-shell .account-menu__panel a:last-child,
body.customer-identity-shell .account-menu__panel a:last-child,
body.customer-dashboard-shell .account-menu__panel a:last-child {
    border-bottom: 0;
}

body.page-shell:not(.admin-shell-body) .account-menu__panel a:hover,
body.product-detail-shell .account-menu__panel a:hover,
body.cart-experience-shell .account-menu__panel a:hover,
body.checkout-experience-shell .account-menu__panel a:hover,
body.order-experience-shell .account-menu__panel a:hover,
body.customer-identity-shell .account-menu__panel a:hover,
body.customer-dashboard-shell .account-menu__panel a:hover {
    color: var(--v2-gold-soft);
}

body.page-shell:not(.admin-shell-body) .cart-icon-badge,
body.product-detail-shell .cart-icon-badge,
body.cart-experience-shell .cart-icon-badge,
body.checkout-experience-shell .cart-icon-badge,
body.order-experience-shell .cart-icon-badge,
body.customer-identity-shell .cart-icon-badge,
body.customer-dashboard-shell .cart-icon-badge {
    position: absolute;
    top: -0.22rem;
    right: -0.18rem;
    display: grid;
    place-items: center;
    min-width: 0.92rem;
    height: 0.92rem;
    padding-inline: 0.18rem;
    border-radius: 999px;
    background: var(--v2-gold-soft);
    color: var(--v2-emerald-950);
    font-size: 0.56rem;
    font-weight: 800;
    line-height: 1;
    box-shadow: 0 0 0 2px rgba(0, 21, 18, 0.95);
}

body.page-shell:not(.admin-shell-body) .cart-icon-badge[hidden],
body.product-detail-shell .cart-icon-badge[hidden],
body.cart-experience-shell .cart-icon-badge[hidden],
body.checkout-experience-shell .cart-icon-badge[hidden],
body.order-experience-shell .cart-icon-badge[hidden],
body.customer-identity-shell .cart-icon-badge[hidden],
body.customer-dashboard-shell .cart-icon-badge[hidden] {
    display: none !important;
}

body.page-shell:not(.admin-shell-body) .mobile-header-control,
body.product-detail-shell .mobile-header-control,
body.cart-experience-shell .mobile-header-control,
body.checkout-experience-shell .mobile-header-control,
body.order-experience-shell .mobile-header-control,
body.customer-identity-shell .mobile-header-control,
body.customer-dashboard-shell .mobile-header-control {
    display: none;
}

body.page-shell:not(.admin-shell-body) .mobile-drawer,
body.page-shell:not(.admin-shell-body) .search-overlay,
body.product-detail-shell .mobile-drawer,
body.product-detail-shell .search-overlay,
body.cart-experience-shell .mobile-drawer,
body.cart-experience-shell .search-overlay,
body.checkout-experience-shell .mobile-drawer,
body.checkout-experience-shell .search-overlay,
body.order-experience-shell .mobile-drawer,
body.order-experience-shell .search-overlay,
body.customer-identity-shell .mobile-drawer,
body.customer-identity-shell .search-overlay,
body.customer-dashboard-shell .mobile-drawer,
body.customer-dashboard-shell .search-overlay {
    background: rgba(0, 10, 8, 0.74);
    backdrop-filter: blur(10px);
}

body.page-shell:not(.admin-shell-body) .mobile-drawer-panel,
body.product-detail-shell .mobile-drawer-panel,
body.cart-experience-shell .mobile-drawer-panel,
body.checkout-experience-shell .mobile-drawer-panel,
body.order-experience-shell .mobile-drawer-panel,
body.customer-identity-shell .mobile-drawer-panel,
body.customer-dashboard-shell .mobile-drawer-panel {
    width: min(25rem, 88vw);
    min-height: 100%;
    padding: clamp(1.1rem, 4vw, 1.6rem);
    background:
        radial-gradient(circle at 20% 0%, rgba(231, 207, 138, 0.16), transparent 16rem),
        linear-gradient(180deg, rgba(255, 248, 230, 0.06), transparent 35%),
        linear-gradient(180deg, var(--v2-emerald-900), var(--v2-emerald-950));
    border-right: 1px solid var(--glass-border-strong, rgba(231, 207, 138, 0.42));
    box-shadow:
        inset 0 1px 0 rgba(255, 248, 230, 0.08),
        1.4rem 0 3.5rem rgba(0, 10, 8, 0.42);
    backdrop-filter: blur(var(--glass-blur-strong, 28px));
    -webkit-backdrop-filter: blur(var(--glass-blur-strong, 28px));
}

body.page-shell:not(.admin-shell-body) .drawer-head,
body.page-shell:not(.admin-shell-body) .search-overlay-head,
body.product-detail-shell .drawer-head,
body.product-detail-shell .search-overlay-head,
body.cart-experience-shell .drawer-head,
body.cart-experience-shell .search-overlay-head,
body.checkout-experience-shell .drawer-head,
body.checkout-experience-shell .search-overlay-head,
body.order-experience-shell .drawer-head,
body.order-experience-shell .search-overlay-head,
body.customer-identity-shell .drawer-head,
body.customer-identity-shell .search-overlay-head,
body.customer-dashboard-shell .drawer-head,
body.customer-dashboard-shell .search-overlay-head {
    padding-bottom: var(--spacing-md);
    border-bottom: 1px solid rgba(231, 207, 138, 0.22);
}

body.page-shell:not(.admin-shell-body) .drawer-title,
body.product-detail-shell .drawer-title,
body.cart-experience-shell .drawer-title,
body.checkout-experience-shell .drawer-title,
body.order-experience-shell .drawer-title,
body.customer-identity-shell .drawer-title,
body.customer-dashboard-shell .drawer-title {
    color: var(--v2-ivory);
    font-size: clamp(1.5rem, 6vw, 2.2rem);
}

body.page-shell:not(.admin-shell-body) .mobile-nav-list,
body.product-detail-shell .mobile-nav-list,
body.cart-experience-shell .mobile-nav-list,
body.checkout-experience-shell .mobile-nav-list,
body.order-experience-shell .mobile-nav-list,
body.customer-identity-shell .mobile-nav-list,
body.customer-dashboard-shell .mobile-nav-list {
    gap: 0;
    padding-block: var(--spacing-md);
}

body.page-shell:not(.admin-shell-body) .mobile-nav-list a,
body.product-detail-shell .mobile-nav-list a,
body.cart-experience-shell .mobile-nav-list a,
body.checkout-experience-shell .mobile-nav-list a,
body.order-experience-shell .mobile-nav-list a,
body.customer-identity-shell .mobile-nav-list a,
body.customer-dashboard-shell .mobile-nav-list a {
    display: flex;
    align-items: baseline;
    gap: var(--spacing-sm);
    padding: 0.72rem 0;
    color: var(--v2-ivory);
    font-family: var(--font-family-heading);
    font-size: clamp(1.18rem, 5vw, 1.55rem);
    font-weight: 500;
    border-bottom: 1px solid rgba(231, 207, 138, 0.16);
}

body.page-shell:not(.admin-shell-body) .mobile-nav-list a span,
body.product-detail-shell .mobile-nav-list a span,
body.cart-experience-shell .mobile-nav-list a span,
body.checkout-experience-shell .mobile-nav-list a span,
body.order-experience-shell .mobile-nav-list a span,
body.customer-identity-shell .mobile-nav-list a span,
body.customer-dashboard-shell .mobile-nav-list a span {
    color: var(--v2-gold-soft);
    font-family: var(--font-family-body);
    font-size: var(--font-size-badge);
    letter-spacing: var(--letter-spacing-wide);
}

body.page-shell:not(.admin-shell-body) .mobile-nav-list a:hover,
body.page-shell:not(.admin-shell-body) .mobile-nav-list a:focus-visible,
body.product-detail-shell .mobile-nav-list a:hover,
body.product-detail-shell .mobile-nav-list a:focus-visible,
body.cart-experience-shell .mobile-nav-list a:hover,
body.cart-experience-shell .mobile-nav-list a:focus-visible,
body.checkout-experience-shell .mobile-nav-list a:hover,
body.checkout-experience-shell .mobile-nav-list a:focus-visible,
body.order-experience-shell .mobile-nav-list a:hover,
body.order-experience-shell .mobile-nav-list a:focus-visible,
body.customer-identity-shell .mobile-nav-list a:hover,
body.customer-identity-shell .mobile-nav-list a:focus-visible,
body.customer-dashboard-shell .mobile-nav-list a:hover,
body.customer-dashboard-shell .mobile-nav-list a:focus-visible {
    color: var(--v2-gold-soft);
}

body.page-shell:not(.admin-shell-body) .drawer-quick-links,
body.product-detail-shell .drawer-quick-links,
body.cart-experience-shell .drawer-quick-links,
body.checkout-experience-shell .drawer-quick-links,
body.order-experience-shell .drawer-quick-links,
body.customer-identity-shell .drawer-quick-links,
body.customer-dashboard-shell .drawer-quick-links {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--spacing-xs);
    margin-bottom: var(--spacing-md);
}

body.page-shell:not(.admin-shell-body) .drawer-quick-links a,
body.product-detail-shell .drawer-quick-links a,
body.cart-experience-shell .drawer-quick-links a,
body.checkout-experience-shell .drawer-quick-links a,
body.order-experience-shell .drawer-quick-links a,
body.customer-identity-shell .drawer-quick-links a,
body.customer-dashboard-shell .drawer-quick-links a {
    padding: 0.58rem 0.35rem;
    color: var(--v2-gold-soft);
    font-size: var(--font-size-caption);
    text-align: center;
    border: 1px solid rgba(231, 207, 138, 0.22);
}

body.page-shell:not(.admin-shell-body) .drawer-panel,
body.product-detail-shell .drawer-panel,
body.cart-experience-shell .drawer-panel,
body.checkout-experience-shell .drawer-panel,
body.order-experience-shell .drawer-panel,
body.customer-identity-shell .drawer-panel,
body.customer-dashboard-shell .drawer-panel {
    border-color: rgba(231, 207, 138, 0.24);
    background: rgba(0, 21, 18, 0.5);
}

body.page-shell:not(.admin-shell-body) .search-overlay,
body.product-detail-shell .search-overlay,
body.cart-experience-shell .search-overlay,
body.checkout-experience-shell .search-overlay,
body.order-experience-shell .search-overlay,
body.customer-identity-shell .search-overlay,
body.customer-dashboard-shell .search-overlay {
    place-items: center;
    padding: var(--spacing-lg);
}

body.page-shell:not(.admin-shell-body) .search-overlay-panel,
body.product-detail-shell .search-overlay-panel,
body.cart-experience-shell .search-overlay-panel,
body.checkout-experience-shell .search-overlay-panel,
body.order-experience-shell .search-overlay-panel,
body.customer-identity-shell .search-overlay-panel,
body.customer-dashboard-shell .search-overlay-panel {
    width: min(43rem, 100%);
    padding: clamp(1rem, 4vw, 1.6rem);
    background:
        radial-gradient(circle at 18% 0%, rgba(231, 207, 138, 0.12), transparent 18rem),
        linear-gradient(180deg, var(--v2-emerald-900), var(--v2-emerald-950));
    border: 1px solid rgba(231, 207, 138, 0.34);
    border-radius: var(--radius-medium);
    box-shadow: 0 2rem 4rem rgba(0, 10, 8, 0.4);
}

body.page-shell:not(.admin-shell-body) .search-form,
body.product-detail-shell .search-form,
body.cart-experience-shell .search-form,
body.checkout-experience-shell .search-form,
body.order-experience-shell .search-form,
body.customer-identity-shell .search-form,
body.customer-dashboard-shell .search-form {
    gap: var(--spacing-sm);
    margin: var(--spacing-md) 0;
}

@media (max-width: 1180px) {
    body.page-shell:not(.admin-shell-body) .header-inner,
    body.product-detail-shell .header-inner,
    body.cart-experience-shell .header-inner,
    body.checkout-experience-shell .header-inner,
    body.order-experience-shell .header-inner,
    body.customer-identity-shell .header-inner,
    body.customer-dashboard-shell .header-inner {
        grid-template-columns: auto 1fr auto;
        min-height: 4.35rem;
    }

    body.page-shell:not(.admin-shell-body) .header-nav,
    body.product-detail-shell .header-nav,
    body.cart-experience-shell .header-nav,
    body.checkout-experience-shell .header-nav,
    body.order-experience-shell .header-nav,
    body.customer-identity-shell .header-nav,
    body.customer-dashboard-shell .header-nav {
        display: none;
    }

    body.page-shell:not(.admin-shell-body) .header-actions,
    body.product-detail-shell .header-actions,
    body.cart-experience-shell .header-actions,
    body.checkout-experience-shell .header-actions,
    body.order-experience-shell .header-actions,
    body.customer-identity-shell .header-actions,
    body.customer-dashboard-shell .header-actions {
        display: none;
    }

    body.page-shell:not(.admin-shell-body) .mobile-header-search,
    body.page-shell:not(.admin-shell-body) .mobile-header-menu,
    body.product-detail-shell .mobile-header-search,
    body.product-detail-shell .mobile-header-menu,
    body.cart-experience-shell .mobile-header-search,
    body.cart-experience-shell .mobile-header-menu,
    body.checkout-experience-shell .mobile-header-search,
    body.checkout-experience-shell .mobile-header-menu,
    body.order-experience-shell .mobile-header-search,
    body.order-experience-shell .mobile-header-menu,
    body.customer-identity-shell .mobile-header-search,
    body.customer-identity-shell .mobile-header-menu,
    body.customer-dashboard-shell .mobile-header-search,
    body.customer-dashboard-shell .mobile-header-menu {
        display: inline-flex;
    }

    body.page-shell:not(.admin-shell-body) .brand-logo--header,
    body.product-detail-shell .brand-logo--header,
    body.cart-experience-shell .brand-logo--header,
    body.checkout-experience-shell .brand-logo--header,
    body.order-experience-shell .brand-logo--header,
    body.customer-identity-shell .brand-logo--header,
    body.customer-dashboard-shell .brand-logo--header {
        justify-self: center;
        padding-right: 0;
    }

    body.page-shell:not(.admin-shell-body) .brand-logo--header::after,
    body.product-detail-shell .brand-logo--header::after,
    body.cart-experience-shell .brand-logo--header::after,
    body.checkout-experience-shell .brand-logo--header::after,
    body.order-experience-shell .brand-logo--header::after,
    body.customer-identity-shell .brand-logo--header::after,
    body.customer-dashboard-shell .brand-logo--header::after {
        left: 10%;
        right: 10%;
    }
}

@media (max-width: 640px) {
    body.page-shell:not(.admin-shell-body) .header-inner,
    body.product-detail-shell .header-inner,
    body.cart-experience-shell .header-inner,
    body.checkout-experience-shell .header-inner,
    body.order-experience-shell .header-inner,
    body.customer-identity-shell .header-inner,
    body.customer-dashboard-shell .header-inner {
        min-height: var(--header-main-height-mobile);
        grid-template-columns: 2.35rem 1fr 2.35rem;
    }

    body.page-shell:not(.admin-shell-body) .brand-logo--header img,
    body.product-detail-shell .brand-logo--header img,
    body.cart-experience-shell .brand-logo--header img,
    body.checkout-experience-shell .brand-logo--header img,
    body.order-experience-shell .brand-logo--header img,
    body.customer-identity-shell .brand-logo--header img,
    body.customer-dashboard-shell .brand-logo--header img {
        width: var(--header-logo-width);
        height: var(--header-logo-height);
        max-height: var(--header-logo-max-height);
    }

    body.page-shell:not(.admin-shell-body) .mobile-header-search,
    body.product-detail-shell .mobile-header-search,
    body.cart-experience-shell .mobile-header-search,
    body.checkout-experience-shell .mobile-header-search,
    body.order-experience-shell .mobile-header-search,
    body.customer-identity-shell .mobile-header-search,
    body.customer-dashboard-shell .mobile-header-search {
        justify-self: start;
    }

    body.page-shell:not(.admin-shell-body) .mobile-header-menu,
    body.product-detail-shell .mobile-header-menu,
    body.cart-experience-shell .mobile-header-menu,
    body.checkout-experience-shell .mobile-header-menu,
    body.order-experience-shell .mobile-header-menu,
    body.customer-identity-shell .mobile-header-menu,
    body.customer-dashboard-shell .mobile-header-menu {
        justify-self: end;
    }

    body.page-shell:not(.admin-shell-body) .search-form,
    body.product-detail-shell .search-form,
    body.cart-experience-shell .search-form,
    body.checkout-experience-shell .search-form,
    body.order-experience-shell .search-form,
    body.customer-identity-shell .search-form,
    body.customer-dashboard-shell .search-form {
        display: grid;
    }
}

