/**
 * @FILE      menu-layouts-refresh.css
 * @ROLE      Final visual pass for public menu presets.
 * @LOAD      After menu-layouts-product.css.
 * @SCOPE     body.public-qm.menu-layout-{preset}
 *
 * This layer keeps the responsive layout rules in the existing files intact.
 * It only sharpens the visual identity of each preset.
 */

/* Shared polish */
.public-qm[class*="menu-layout-"] .qm-menu-tile,
.public-qm[class*="menu-layout-"] .qm-product-card,
.public-qm[class*="menu-layout-"] .qm-menu-hero,
.public-qm[class*="menu-layout-"] .qm-category-hero,
.public-qm[class*="menu-layout-"] .qm-product-page__hero,
.public-qm[class*="menu-layout-"] .qm-product-page__card {
    position: relative;
    isolation: isolate;
}

.public-qm[class*="menu-layout-"] .qm-menu-tile,
.public-qm[class*="menu-layout-"] .qm-product-card,
.public-qm[class*="menu-layout-"] .qm-menu-hero,
.public-qm[class*="menu-layout-"] .qm-category-hero {
    overflow: hidden;
}

.public-qm[class*="menu-layout-"] .qm-menu-chip,
.public-qm[class*="menu-layout-"] .qm-soft-chip,
.public-qm[class*="menu-layout-"] .qm-menu-badge {
    transition:
        color 0.24s ease,
        border-color 0.24s ease,
        background 0.24s ease,
        box-shadow 0.24s ease;
}

/* card: familiar, balanced and lightly elevated */
.public-qm.menu-layout-card {
    --qm-tile-border: 1px solid color-mix(in srgb, var(--qm-body-color) 10%, var(--qm-border));
    --qm-tile-border-hover: 1px solid color-mix(in srgb, var(--qm-primary) 34%, var(--qm-border));
    --qm-tile-bg: linear-gradient(180deg, color-mix(in srgb, var(--qm-card-bg) 96%, #fff), var(--qm-card-bg));
    --qm-tile-shadow:
        0 1px 2px color-mix(in srgb, var(--qm-body-color) 5%, transparent),
        0 12px 30px -12px color-mix(in srgb, var(--qm-body-color) 18%, transparent);
    --qm-tile-shadow-hover:
        0 8px 18px -8px color-mix(in srgb, var(--qm-primary) 20%, transparent),
        0 20px 42px -14px color-mix(in srgb, var(--qm-body-color) 22%, transparent);
}

.public-qm.menu-layout-card .qm-menu-tile__cover,
.public-qm.menu-layout-card .qm-featured-media {
    border-bottom: 1px solid color-mix(in srgb, var(--qm-body-color) 8%, var(--qm-border));
}

.public-qm.menu-layout-card .qm-menu-badge {
    background: color-mix(in srgb, var(--qm-card-bg) 92%, var(--qm-primary));
}

/* list: compact rows, low elevation and strong reading rhythm */
.public-qm.menu-layout-list {
    --qm-tile-border: 1px solid color-mix(in srgb, var(--qm-body-color) 11%, var(--qm-border));
    --qm-tile-border-hover: 1px solid color-mix(in srgb, var(--qm-primary) 32%, var(--qm-border));
    --qm-tile-bg: var(--qm-card-bg);
    --qm-tile-shadow: 0 3px 12px -6px color-mix(in srgb, var(--qm-body-color) 18%, transparent);
    --qm-tile-shadow-hover:
        0 0 0 1px color-mix(in srgb, var(--qm-primary) 10%, transparent),
        0 9px 24px -10px color-mix(in srgb, var(--qm-body-color) 24%, transparent);
    --qm-hover-lift: -1px;
}

.public-qm.menu-layout-list .qm-menu-modern .qm-product-grid,
.public-qm.menu-layout-list .qm-category-modern .qm-product-grid {
    grid-template-columns: minmax(0, 1fr);
}

.public-qm.menu-layout-list .qm-menu-tile,
.public-qm.menu-layout-list .qm-product-card,
.public-qm.menu-layout-list .qm-welcome-cat-tile {
    border-left: 3px solid color-mix(in srgb, var(--qm-primary) 78%, var(--qm-border)) !important;
}

.public-qm.menu-layout-list .qm-menu-badge {
    border-radius: 0.45rem !important;
    background: transparent !important;
}

@media (min-width: 576px) {
    .public-qm.menu-layout-list .qm-product-card {
        display: grid !important;
        grid-template-columns: minmax(8.5rem, 34%) minmax(0, 1fr);
    }

    .public-qm.menu-layout-list .qm-product-card .qm-featured-media {
        height: 100%;
        min-height: 7.25rem;
        aspect-ratio: auto;
        border-radius: 0.75rem !important;
    }
}

/* minimal: spacing and typography do the work */
.public-qm.menu-layout-minimal {
    --qm-tile-bg: transparent;
    --qm-tile-border: 1px solid color-mix(in srgb, var(--qm-body-color) 13%, var(--qm-border));
    --qm-tile-border-hover: 1px solid color-mix(in srgb, var(--qm-primary) 36%, var(--qm-border));
    --qm-tile-shadow: none;
    --qm-tile-shadow-hover: none;
    --qm-hover-lift: 0px;
    --qm-product-surface-bg: transparent;
}

.public-qm.menu-layout-minimal .qm-menu-tile,
.public-qm.menu-layout-minimal .qm-product-card,
.public-qm.menu-layout-minimal .qm-menu-hero,
.public-qm.menu-layout-minimal .qm-category-hero,
.public-qm.menu-layout-minimal .qm-product-page__hero,
.public-qm.menu-layout-minimal .qm-product-page__card {
    box-shadow: none !important;
    background: transparent !important;
}

.public-qm.menu-layout-minimal .qm-menu-chip,
.public-qm.menu-layout-minimal .qm-soft-chip,
.public-qm.menu-layout-minimal .qm-menu-badge {
    border-color: color-mix(in srgb, var(--qm-body-color) 14%, var(--qm-border)) !important;
    background: transparent !important;
    box-shadow: none !important;
}

.public-qm.menu-layout-minimal .qm-menu-tile__cover,
.public-qm.menu-layout-minimal .qm-featured-media {
    opacity: 0.92;
    filter: saturate(0.84);
}

/* premium: richer depth, a quiet inset highlight and generous surfaces */
.public-qm.menu-layout-premium {
    --qm-radius: 1.3rem;
    --qm-radius-sm: 0.95rem;
    --qm-tile-border: 1px solid color-mix(in srgb, var(--qm-primary) 14%, var(--qm-border));
    --qm-tile-bg:
        radial-gradient(120% 72% at 50% -8%, color-mix(in srgb, var(--qm-card-bg) 84%, #fff), transparent 64%),
        linear-gradient(180deg, color-mix(in srgb, var(--qm-card-bg) 96%, var(--qm-primary)), var(--qm-card-bg));
    --qm-tile-shadow:
        0 1px 0 color-mix(in srgb, #fff 70%, transparent) inset,
        0 18px 44px -18px color-mix(in srgb, var(--qm-body-color) 30%, transparent),
        0 8px 18px -12px color-mix(in srgb, var(--qm-primary) 28%, transparent);
    --qm-tile-shadow-hover:
        0 1px 0 color-mix(in srgb, #fff 78%, transparent) inset,
        0 28px 58px -20px color-mix(in srgb, var(--qm-body-color) 34%, transparent),
        0 14px 28px -16px color-mix(in srgb, var(--qm-primary) 38%, transparent);
    --qm-hover-lift: -6px;
}

.public-qm.menu-layout-premium .qm-menu-tile::before,
.public-qm.menu-layout-premium .qm-product-card::before,
.public-qm.menu-layout-premium .qm-menu-hero::before,
.public-qm.menu-layout-premium .qm-category-hero::before {
    content: "";
    position: absolute;
    inset: 0.42rem;
    z-index: 2;
    border: 1px solid color-mix(in srgb, #fff 48%, transparent);
    border-radius: calc(var(--qm-radius) - 0.35rem);
    pointer-events: none;
}

.public-qm.menu-layout-premium .qm-menu-badge,
.public-qm.menu-layout-premium .qm-soft-chip {
    box-shadow: 0 8px 18px -12px color-mix(in srgb, var(--qm-body-color) 28%, transparent);
}

/* modern: precise geometry, top accent and restrained contrast */
.public-qm.menu-layout-modern {
    --qm-radius: 0.85rem;
    --qm-radius-sm: 0.55rem;
    --qm-tile-bg: linear-gradient(150deg, color-mix(in srgb, var(--qm-card-bg) 96%, var(--qm-primary)), var(--qm-card-bg) 52%);
    --qm-tile-border: 1px solid color-mix(in srgb, var(--qm-body-color) 12%, transparent);
    --qm-tile-border-hover: 1px solid color-mix(in srgb, var(--qm-primary) 46%, transparent);
    --qm-tile-shadow:
        0 0 0 1px color-mix(in srgb, var(--qm-primary) 7%, transparent),
        0 12px 28px -12px color-mix(in srgb, var(--qm-body-color) 28%, transparent);
    --qm-tile-shadow-hover:
        0 0 0 1px color-mix(in srgb, var(--qm-primary) 22%, transparent),
        0 20px 36px -14px color-mix(in srgb, var(--qm-body-color) 34%, transparent);
}

.public-qm.menu-layout-modern .qm-menu-tile::before,
.public-qm.menu-layout-modern .qm-product-card::before,
.public-qm.menu-layout-modern .qm-menu-hero::before,
.public-qm.menu-layout-modern .qm-category-hero::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    z-index: 3;
    height: 3px;
    pointer-events: none;
    background: linear-gradient(90deg, var(--qm-primary), color-mix(in srgb, var(--qm-primary) 36%, var(--qm-secondary)));
}

.public-qm.menu-layout-modern .qm-menu-badge,
.public-qm.menu-layout-modern .qm-soft-chip {
    border-radius: 0.5rem !important;
}

/* glass: translucent layers with edge highlights */
.public-qm.menu-layout-glass {
    --qm-tile-bg: linear-gradient(
        145deg,
        color-mix(in srgb, var(--qm-card-bg) 64%, transparent),
        color-mix(in srgb, var(--qm-card-bg) 84%, #fff)
    );
    --qm-tile-border: 1px solid color-mix(in srgb, #fff 52%, var(--qm-border));
    --qm-tile-border-hover: 1px solid color-mix(in srgb, #fff 70%, var(--qm-primary));
    --qm-tile-backdrop: saturate(165%) blur(18px);
    --qm-tile-shadow:
        0 1px 0 color-mix(in srgb, #fff 64%, transparent) inset,
        0 18px 40px -16px color-mix(in srgb, var(--qm-body-color) 24%, transparent);
    --qm-tile-shadow-hover:
        0 1px 0 color-mix(in srgb, #fff 78%, transparent) inset,
        0 26px 54px -18px color-mix(in srgb, var(--qm-primary) 28%, transparent);
}

.public-qm.menu-layout-glass .qm-menu-tile::before,
.public-qm.menu-layout-glass .qm-product-card::before,
.public-qm.menu-layout-glass .qm-menu-hero::before,
.public-qm.menu-layout-glass .qm-category-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
    background: linear-gradient(135deg, color-mix(in srgb, #fff 38%, transparent), transparent 38%);
}

.public-qm.menu-layout-glass .qm-menu-chip,
.public-qm.menu-layout-glass .qm-soft-chip,
.public-qm.menu-layout-glass .qm-menu-badge {
    backdrop-filter: saturate(155%) blur(12px);
    -webkit-backdrop-filter: saturate(155%) blur(12px);
}

/* bold: heavy edge, compact radius and assertive labels */
.public-qm.menu-layout-bold {
    --qm-radius: 0.8rem;
    --qm-radius-sm: 0.48rem;
    --qm-tile-border: 2px solid color-mix(in srgb, var(--qm-body-color) 16%, var(--qm-border));
    --qm-tile-border-hover: 2px solid color-mix(in srgb, var(--qm-primary) 62%, var(--qm-border));
    --qm-tile-bg: linear-gradient(90deg, var(--qm-primary) 0 7px, var(--qm-card-bg) 7px);
    --qm-tile-shadow:
        0 6px 0 -3px color-mix(in srgb, var(--qm-primary) 38%, transparent),
        0 16px 30px -15px color-mix(in srgb, var(--qm-body-color) 30%, transparent);
    --qm-tile-shadow-hover:
        0 8px 0 -3px color-mix(in srgb, var(--qm-primary) 62%, transparent),
        0 24px 38px -16px color-mix(in srgb, var(--qm-body-color) 36%, transparent);
}

.public-qm.menu-layout-bold .qm-menu-tile__body {
    padding-left: 1.2rem;
}

.public-qm.menu-layout-bold .qm-section-title,
.public-qm.menu-layout-bold .qm-menu-tile__title,
.public-qm.menu-layout-bold .qm-product-page__section-title {
    font-weight: 800;
    letter-spacing: -0.035em;
}

.public-qm.menu-layout-bold .qm-menu-badge,
.public-qm.menu-layout-bold .qm-soft-chip {
    border-radius: 0.42rem !important;
    font-weight: 700;
}

/* soft: rounded pastel panels and diffused shadows */
.public-qm.menu-layout-soft {
    --qm-radius: 1.65rem;
    --qm-radius-sm: 1.15rem;
    --qm-tile-bg: linear-gradient(
        160deg,
        color-mix(in srgb, var(--qm-card-bg) 86%, var(--qm-primary)),
        color-mix(in srgb, var(--qm-card-bg) 97%, #fff)
    );
    --qm-tile-border: 1px solid color-mix(in srgb, var(--qm-primary) 22%, var(--qm-border));
    --qm-tile-border-hover: 1px solid color-mix(in srgb, var(--qm-primary) 42%, var(--qm-border));
    --qm-tile-shadow:
        0 16px 38px -18px color-mix(in srgb, var(--qm-primary) 34%, transparent),
        0 6px 18px -14px color-mix(in srgb, var(--qm-body-color) 20%, transparent);
    --qm-tile-shadow-hover:
        0 24px 48px -18px color-mix(in srgb, var(--qm-primary) 46%, transparent),
        0 10px 22px -16px color-mix(in srgb, var(--qm-body-color) 22%, transparent);
}

.public-qm.menu-layout-soft .qm-menu-chip,
.public-qm.menu-layout-soft .qm-soft-chip,
.public-qm.menu-layout-soft .qm-menu-badge {
    border-radius: 999px !important;
    background: color-mix(in srgb, var(--qm-card-bg) 88%, var(--qm-primary)) !important;
}

.public-qm.menu-layout-soft .qm-menu-tile__cover,
.public-qm.menu-layout-soft .qm-featured-media {
    margin: 0.45rem 0.45rem 0;
    width: auto;
    border-radius: calc(var(--qm-radius) - 0.45rem) !important;
}

/* neon: luminous edges and focused glow */
.public-qm.menu-layout-neon {
    --qm-tile-border: 1px solid color-mix(in srgb, var(--qm-primary) 58%, var(--qm-border));
    --qm-tile-border-hover: 1px solid color-mix(in srgb, var(--qm-primary) 88%, transparent);
    --qm-tile-bg: linear-gradient(
        155deg,
        color-mix(in srgb, var(--qm-card-bg) 86%, var(--qm-primary)),
        color-mix(in srgb, var(--qm-card-bg) 95%, #050914)
    );
    --qm-tile-shadow:
        0 0 0 1px color-mix(in srgb, var(--qm-primary) 18%, transparent),
        0 0 22px color-mix(in srgb, var(--qm-primary) 24%, transparent),
        0 18px 34px -18px color-mix(in srgb, #050914 70%, transparent);
    --qm-tile-shadow-hover:
        0 0 0 1px color-mix(in srgb, var(--qm-primary) 58%, transparent),
        0 0 38px color-mix(in srgb, var(--qm-primary) 46%, transparent),
        0 22px 42px -18px color-mix(in srgb, #050914 82%, transparent);
}

.public-qm.menu-layout-neon .qm-menu-tile::before,
.public-qm.menu-layout-neon .qm-product-card::before,
.public-qm.menu-layout-neon .qm-menu-hero::before,
.public-qm.menu-layout-neon .qm-category-hero::before {
    content: "";
    position: absolute;
    top: 0;
    right: 8%;
    left: 8%;
    z-index: 3;
    height: 1px;
    pointer-events: none;
    background: var(--qm-primary);
    box-shadow: 0 0 16px 3px color-mix(in srgb, var(--qm-primary) 62%, transparent);
}

.public-qm.menu-layout-neon .qm-menu-badge,
.public-qm.menu-layout-neon .qm-soft-chip {
    text-shadow: 0 0 12px color-mix(in srgb, var(--qm-primary) 42%, transparent);
}

/* aurora: layered color movement without changing layout */
.public-qm.menu-layout-aurora {
    --qm-tile-bg: linear-gradient(
        132deg,
        color-mix(in srgb, var(--qm-card-bg) 82%, var(--qm-primary)),
        color-mix(in srgb, var(--qm-card-bg) 92%, var(--qm-secondary)) 52%,
        color-mix(in srgb, var(--qm-card-bg) 96%, #fff)
    );
    --qm-tile-border: 1px solid color-mix(in srgb, var(--qm-primary) 22%, var(--qm-border));
    --qm-tile-border-hover: 1px solid color-mix(in srgb, var(--qm-secondary) 42%, var(--qm-primary));
    --qm-tile-shadow:
        0 18px 40px -18px color-mix(in srgb, var(--qm-primary) 40%, transparent),
        0 12px 30px -18px color-mix(in srgb, var(--qm-secondary) 34%, transparent);
    --qm-tile-shadow-hover:
        0 26px 54px -18px color-mix(in srgb, var(--qm-primary) 50%, transparent),
        0 18px 38px -18px color-mix(in srgb, var(--qm-secondary) 44%, transparent);
}

.public-qm.menu-layout-aurora .qm-menu-tile::before,
.public-qm.menu-layout-aurora .qm-product-card::before,
.public-qm.menu-layout-aurora .qm-menu-hero::before,
.public-qm.menu-layout-aurora .qm-category-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
    background:
        radial-gradient(circle at 12% 0%, color-mix(in srgb, var(--qm-primary) 24%, transparent), transparent 38%),
        radial-gradient(circle at 92% 100%, color-mix(in srgb, var(--qm-secondary) 20%, transparent), transparent 42%);
}

.public-qm.menu-layout-aurora .qm-menu-chip,
.public-qm.menu-layout-aurora .qm-soft-chip,
.public-qm.menu-layout-aurora .qm-menu-badge {
    border-radius: 999px !important;
}

/* nexus: technical grid, clipped corners and precise inner lines */
.public-qm.menu-layout-nexus {
    --qm-radius: 0.42rem;
    --qm-radius-sm: 0.28rem;
    --qm-tile-bg: color-mix(in srgb, var(--qm-card-bg) 92%, var(--qm-primary));
    --qm-tile-border: 1px solid color-mix(in srgb, var(--qm-primary) 34%, var(--qm-border));
    --qm-tile-border-hover: 1px solid color-mix(in srgb, var(--qm-primary) 62%, transparent);
    --qm-tile-shadow:
        0 0 0 1px color-mix(in srgb, var(--qm-primary) 12%, transparent),
        0 16px 32px -18px color-mix(in srgb, var(--qm-body-color) 34%, transparent);
    --qm-tile-shadow-hover:
        0 0 0 1px color-mix(in srgb, var(--qm-primary) 28%, transparent),
        0 20px 38px -16px color-mix(in srgb, var(--qm-primary) 30%, transparent);
}

.public-qm.menu-layout-nexus .qm-menu-tile::before,
.public-qm.menu-layout-nexus .qm-product-card::before,
.public-qm.menu-layout-nexus .qm-menu-hero::before,
.public-qm.menu-layout-nexus .qm-category-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    opacity: 0.62;
    background:
        repeating-linear-gradient(0deg, transparent 0 15px, color-mix(in srgb, var(--qm-primary) 11%, transparent) 15px 16px),
        repeating-linear-gradient(90deg, transparent 0 15px, color-mix(in srgb, var(--qm-primary) 9%, transparent) 15px 16px);
}

.public-qm.menu-layout-nexus .qm-menu-tile > *,
.public-qm.menu-layout-nexus .qm-product-card > *,
.public-qm.menu-layout-nexus .qm-menu-hero > *,
.public-qm.menu-layout-nexus .qm-category-hero > * {
    position: relative;
    z-index: 1;
}

.public-qm.menu-layout-nexus .qm-menu-chip,
.public-qm.menu-layout-nexus .qm-soft-chip,
.public-qm.menu-layout-nexus .qm-menu-badge {
    border-radius: 0.28rem !important;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--qm-primary) 10%, transparent);
}

/* Product detail pages inherit the same design language. */
.public-qm.menu-layout-premium .qm-product-page__hero,
.public-qm.menu-layout-premium .qm-product-page__card {
    box-shadow:
        0 1px 0 color-mix(in srgb, #fff 62%, transparent) inset,
        0 24px 54px -20px color-mix(in srgb, var(--qm-body-color) 32%, transparent) !important;
}

.public-qm.menu-layout-modern .qm-product-page__hero,
.public-qm.menu-layout-modern .qm-product-page__card {
    border-radius: var(--qm-radius-sm) !important;
    border-top: 3px solid var(--qm-primary) !important;
}

.public-qm.menu-layout-glass .qm-product-page__hero,
.public-qm.menu-layout-glass .qm-product-page__card {
    background: linear-gradient(
        145deg,
        color-mix(in srgb, var(--qm-card-bg) 64%, transparent),
        color-mix(in srgb, var(--qm-card-bg) 86%, #fff)
    ) !important;
    backdrop-filter: saturate(165%) blur(18px);
    -webkit-backdrop-filter: saturate(165%) blur(18px);
}

.public-qm.menu-layout-bold .qm-product-page__hero,
.public-qm.menu-layout-bold .qm-product-page__card {
    border-left: 7px solid var(--qm-primary) !important;
}

.public-qm.menu-layout-soft .qm-product-page__hero,
.public-qm.menu-layout-soft .qm-product-page__card {
    border-radius: var(--qm-radius) !important;
}

.public-qm.menu-layout-neon .qm-product-page__hero,
.public-qm.menu-layout-neon .qm-product-page__card {
    box-shadow:
        0 0 0 1px color-mix(in srgb, var(--qm-primary) 22%, transparent),
        0 0 30px color-mix(in srgb, var(--qm-primary) 28%, transparent),
        0 18px 38px -18px color-mix(in srgb, #050914 76%, transparent) !important;
}

.public-qm.menu-layout-aurora .qm-product-page__hero,
.public-qm.menu-layout-aurora .qm-product-page__card {
    background: linear-gradient(
        132deg,
        color-mix(in srgb, var(--qm-card-bg) 84%, var(--qm-primary)),
        color-mix(in srgb, var(--qm-card-bg) 92%, var(--qm-secondary)),
        color-mix(in srgb, var(--qm-card-bg) 97%, #fff)
    ) !important;
}

.public-qm.menu-layout-nexus .qm-product-page__hero,
.public-qm.menu-layout-nexus .qm-product-page__card {
    border-radius: var(--qm-radius) !important;
    background:
        repeating-linear-gradient(0deg, transparent 0 17px, color-mix(in srgb, var(--qm-primary) 8%, transparent) 17px 18px),
        repeating-linear-gradient(90deg, transparent 0 17px, color-mix(in srgb, var(--qm-primary) 7%, transparent) 17px 18px),
        color-mix(in srgb, var(--qm-card-bg) 92%, var(--qm-primary)) !important;
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .public-qm.menu-layout-glass {
        --qm-tile-bg: color-mix(in srgb, var(--qm-card-bg) 92%, var(--qm-primary));
        --qm-tile-backdrop: none;
    }

    .public-qm.menu-layout-glass .qm-menu-chip,
    .public-qm.menu-layout-glass .qm-soft-chip,
    .public-qm.menu-layout-glass .qm-menu-badge,
    .public-qm.menu-layout-glass .qm-product-page__hero,
    .public-qm.menu-layout-glass .qm-product-page__card {
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }
}

@media (max-width: 575.98px) {
    .public-qm.menu-layout-soft .qm-menu-tile__cover {
        margin: 0.35rem 0 0.35rem 0.35rem;
    }

    .public-qm.menu-layout-bold .qm-menu-tile__body {
        padding-left: 0.45rem;
    }

    .public-qm.menu-layout-premium .qm-menu-tile::before,
    .public-qm.menu-layout-premium .qm-product-card::before {
        inset: 0.3rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .public-qm[class*="menu-layout-"] .qm-menu-chip,
    .public-qm[class*="menu-layout-"] .qm-soft-chip,
    .public-qm[class*="menu-layout-"] .qm-menu-badge {
        transition: none;
    }
}

/* ========================================================================== */
/* Preset signatures: layout, rhythm and motif differences                    */
/* ========================================================================== */

/* card: the neutral reference preset */
.public-qm.menu-layout-card .qm-cat-section-head {
    padding: 0.9rem 1rem;
    border: 1px solid color-mix(in srgb, var(--qm-body-color) 8%, var(--qm-border));
    border-radius: var(--qm-radius-sm);
    background: color-mix(in srgb, var(--qm-card-bg) 96%, var(--qm-primary));
}

.public-qm.menu-layout-card .qm-product-page__price-box {
    border-radius: 0.85rem;
}

/* list: one-column directory with thumbnail rows */
.public-qm.menu-layout-list .qm-cat-section-head {
    padding-left: 0.85rem;
    border-left: 3px solid var(--qm-primary);
}

.public-qm.menu-layout-list .qm-menu-tile__body {
    justify-content: center;
}

.public-qm.menu-layout-list .qm-menu-tile__price .qm-price {
    padding: 0.3rem 0.52rem;
    border-radius: 0.42rem;
    background: color-mix(in srgb, var(--qm-primary) 9%, var(--qm-card-bg));
}

.public-qm.menu-layout-list .qm-product-page__card {
    border-left: 3px solid color-mix(in srgb, var(--qm-primary) 68%, var(--qm-border));
}

/* minimal: editorial rows, almost no containers */
.public-qm.menu-layout-minimal .qm-menu-welcome__grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
}

.public-qm.menu-layout-minimal .qm-welcome-cat-tile {
    min-height: 4rem;
    aspect-ratio: auto;
    justify-content: flex-start;
    border: 0;
    border-bottom: 1px solid color-mix(in srgb, var(--qm-body-color) 18%, var(--qm-border));
    border-radius: 0;
    padding: 1rem 0.2rem;
}

.public-qm.menu-layout-minimal .qm-welcome-cat-tile:hover {
    padding-left: 0.75rem;
}

.public-qm.menu-layout-minimal .qm-welcome-cat-tile__pattern {
    display: none;
}

.public-qm.menu-layout-minimal .qm-welcome-cat-tile__name {
    font-size: clamp(1rem, 3vw, 1.2rem);
    font-weight: 560;
    letter-spacing: 0;
    text-align: left;
}

.public-qm.menu-layout-minimal .qm-cat-section-head {
    border-color: color-mix(in srgb, var(--qm-body-color) 20%, var(--qm-border));
}

.public-qm.menu-layout-minimal .qm-menu-tile,
.public-qm.menu-layout-minimal .qm-product-card {
    border: 0 !important;
    border-bottom: 1px solid color-mix(in srgb, var(--qm-body-color) 20%, var(--qm-border)) !important;
    border-radius: 0 !important;
}

.public-qm.menu-layout-minimal .qm-menu-tile__body {
    padding-inline: 0.25rem;
}

.public-qm.menu-layout-minimal .qm-menu-tile__title {
    font-weight: 560;
    letter-spacing: -0.01em;
}

.public-qm.menu-layout-minimal .qm-menu-badge {
    padding-inline: 0;
    border: 0 !important;
    color: var(--qm-muted);
}

.public-qm.menu-layout-minimal .qm-product-page__hero,
.public-qm.menu-layout-minimal .qm-product-page__card {
    border: 0;
    border-bottom: 1px solid color-mix(in srgb, var(--qm-body-color) 20%, var(--qm-border));
    border-radius: 0;
}

/* premium: boutique showcase with framed cards */
.public-qm.menu-layout-premium .qm-menu-welcome__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.public-qm.menu-layout-premium .qm-welcome-cat-tile {
    aspect-ratio: 4 / 3;
}

.public-qm.menu-layout-premium .qm-welcome-cat-tile__name {
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(1.05rem, 3vw, 1.35rem);
    letter-spacing: 0.01em;
}

.public-qm.menu-layout-premium .qm-cat-section-head {
    position: relative;
    padding: 1rem 1.15rem;
    border: 0;
    border-radius: var(--qm-radius);
    background:
        radial-gradient(circle at 0 0, color-mix(in srgb, var(--qm-primary) 15%, transparent), transparent 44%),
        var(--qm-card-bg);
    box-shadow: 0 16px 34px -22px color-mix(in srgb, var(--qm-body-color) 36%, transparent);
}

.public-qm.menu-layout-premium .qm-menu-tile__title,
.public-qm.menu-layout-premium .qm-product-card h3,
.public-qm.menu-layout-premium .qm-product-page__title {
    font-family: Georgia, "Times New Roman", serif;
    letter-spacing: 0;
}

.public-qm.menu-layout-premium .qm-menu-tile__body {
    padding: 1.15rem 1.2rem 1.25rem;
}

.public-qm.menu-layout-premium .qm-menu-tile__price .qm-price {
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.15rem;
}

/* modern: denser asymmetric grid with cut corners */
.public-qm.menu-layout-modern {
    --qm-grid-max: min(100%, 74rem);
    --qm-content-max: min(100%, 74rem);
}

.public-qm.menu-layout-modern .qm-menu-welcome__grid {
    gap: 0.75rem;
}

.public-qm.menu-layout-modern .qm-welcome-cat-tile,
.public-qm.menu-layout-modern .qm-menu-tile,
.public-qm.menu-layout-modern .qm-product-card,
.public-qm.menu-layout-modern .qm-menu-hero,
.public-qm.menu-layout-modern .qm-category-hero {
    clip-path: polygon(0 0, calc(100% - 1rem) 0, 100% 1rem, 100% 100%, 0 100%);
}

.public-qm.menu-layout-modern .qm-cat-section-head {
    padding: 0.75rem 0;
    border-bottom: 2px solid color-mix(in srgb, var(--qm-primary) 42%, var(--qm-border));
}

.public-qm.menu-layout-modern .qm-menu-tile__title,
.public-qm.menu-layout-modern .qm-product-card h3 {
    font-weight: 760;
}

.public-qm.menu-layout-modern .qm-menu-badge {
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 0.62rem;
}

@media (min-width: 992px) {
    .public-qm.menu-layout-modern .qm-menu-modern .qm-product-grid,
    .public-qm.menu-layout-modern .qm-category-modern .qm-product-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 1rem;
    }
}

/* glass: layered floating cards with overlapping content */
.public-qm.menu-layout-glass .qm-menu-welcome__grid {
    gap: clamp(0.9rem, 3vw, 1.4rem);
}

.public-qm.menu-layout-glass .qm-welcome-cat-tile {
    border-radius: 1.7rem;
}

.public-qm.menu-layout-glass .qm-welcome-cat-tile::after {
    content: "";
    position: absolute;
    inset: 0.45rem;
    z-index: 2;
    border: 1px solid color-mix(in srgb, #fff 45%, transparent);
    border-radius: 1.35rem;
    pointer-events: none;
}

.public-qm.menu-layout-glass .qm-cat-section-head {
    padding: 1rem;
    border: 1px solid color-mix(in srgb, #fff 52%, var(--qm-border));
    border-radius: 1.15rem;
    background: color-mix(in srgb, var(--qm-card-bg) 66%, transparent);
    backdrop-filter: saturate(160%) blur(14px);
    -webkit-backdrop-filter: saturate(160%) blur(14px);
}

@media (min-width: 640px) {
    .public-qm.menu-layout-glass .qm-menu-tile__body,
    .public-qm.menu-layout-glass .qm-product-card .card-body {
        position: relative;
        z-index: 3;
        margin: -1.25rem 0.7rem 0.7rem;
        border: 1px solid color-mix(in srgb, #fff 56%, var(--qm-border));
        border-radius: 1rem;
        background: color-mix(in srgb, var(--qm-card-bg) 76%, transparent);
        backdrop-filter: saturate(155%) blur(14px);
        -webkit-backdrop-filter: saturate(155%) blur(14px);
    }
}

/* bold: brutalist blocks with hard offset shadow */
.public-qm.menu-layout-bold .qm-menu-welcome__grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.8rem;
}

.public-qm.menu-layout-bold .qm-welcome-cat-tile {
    min-height: 5rem;
    aspect-ratio: auto;
    justify-content: flex-start;
    border: 2px solid var(--qm-body-color);
    border-left: 0.75rem solid var(--qm-primary);
    border-radius: 0.35rem;
    box-shadow: 0.38rem 0.38rem 0 color-mix(in srgb, var(--qm-primary) 56%, transparent);
}

.public-qm.menu-layout-bold .qm-welcome-cat-tile__name {
    font-size: clamp(1.05rem, 3vw, 1.35rem);
    font-weight: 900;
    letter-spacing: -0.055em;
    text-align: left;
    text-transform: uppercase;
}

.public-qm.menu-layout-bold .qm-menu-tile,
.public-qm.menu-layout-bold .qm-product-card,
.public-qm.menu-layout-bold .qm-category-hero,
.public-qm.menu-layout-bold .qm-product-page__hero,
.public-qm.menu-layout-bold .qm-product-page__card {
    border: 2px solid var(--qm-body-color) !important;
    border-left: 0.5rem solid var(--qm-primary) !important;
    border-radius: 0.35rem !important;
    box-shadow: 0.42rem 0.42rem 0 color-mix(in srgb, var(--qm-primary) 52%, transparent) !important;
}

.public-qm.menu-layout-bold .qm-cat-section-head {
    padding: 0.8rem 0.95rem;
    border: 2px solid var(--qm-body-color);
    border-left: 0.5rem solid var(--qm-primary);
    background: var(--qm-card-bg);
}

.public-qm.menu-layout-bold .qm-menu-tile__price .qm-price {
    padding: 0.28rem 0.48rem;
    border: 2px solid var(--qm-body-color);
    border-radius: 0.25rem;
    background: var(--qm-primary);
    color: #fff;
}

/* soft: inflated pastel bubbles */
.public-qm.menu-layout-soft .qm-menu-welcome__grid {
    gap: clamp(0.9rem, 3vw, 1.35rem);
}

.public-qm.menu-layout-soft .qm-welcome-cat-tile {
    border-radius: 38% 62% 48% 52% / 48% 42% 58% 52%;
}

.public-qm.menu-layout-soft .qm-welcome-cat-tile:nth-child(even) {
    border-radius: 58% 42% 54% 46% / 42% 56% 44% 58%;
}

.public-qm.menu-layout-soft .qm-welcome-cat-tile__pattern {
    background:
        radial-gradient(circle at 24% 20%, color-mix(in srgb, var(--qm-primary) 34%, #fff), transparent 42%),
        radial-gradient(circle at 78% 78%, color-mix(in srgb, var(--qm-secondary) 24%, #fff), transparent 48%);
}

.public-qm.menu-layout-soft .qm-cat-section-head {
    padding: 1rem 1.15rem;
    border: 1px solid color-mix(in srgb, var(--qm-primary) 20%, var(--qm-border));
    border-radius: 1.6rem;
    background: color-mix(in srgb, var(--qm-card-bg) 88%, var(--qm-primary));
}

.public-qm.menu-layout-soft .qm-menu-tile__body {
    padding: 1rem 1.15rem 1.25rem;
}

/* neon: deliberately dark cyber panels */
.public-qm.menu-layout-neon .qm-menu-welcome__grid {
    gap: 0.8rem;
}

.public-qm.menu-layout-neon .qm-welcome-cat-tile,
.public-qm.menu-layout-neon .qm-menu-tile,
.public-qm.menu-layout-neon .qm-product-card,
.public-qm.menu-layout-neon .qm-menu-hero,
.public-qm.menu-layout-neon .qm-category-hero,
.public-qm.menu-layout-neon .qm-product-page__hero,
.public-qm.menu-layout-neon .qm-product-page__card {
    background:
        linear-gradient(145deg, color-mix(in srgb, #07111f 86%, var(--qm-primary)), #07111f) !important;
    color: #e8f4ff;
}

.public-qm.menu-layout-neon .qm-welcome-cat-tile::after,
.public-qm.menu-layout-neon .qm-menu-tile::after,
.public-qm.menu-layout-neon .qm-product-card::after,
.public-qm.menu-layout-neon .qm-category-hero::after {
    content: "";
    position: absolute;
    inset: 0.42rem;
    z-index: 2;
    border: 1px solid color-mix(in srgb, var(--qm-primary) 30%, transparent);
    border-radius: calc(var(--qm-radius-sm) - 0.12rem);
    pointer-events: none;
}

.public-qm.menu-layout-neon .qm-welcome-cat-tile__name,
.public-qm.menu-layout-neon .qm-menu-tile__title,
.public-qm.menu-layout-neon .qm-product-card h3,
.public-qm.menu-layout-neon .qm-category-hero h1,
.public-qm.menu-layout-neon .qm-product-page__title,
.public-qm.menu-layout-neon .qm-product-page__section-title,
.public-qm.menu-layout-neon .qm-product-page__info-value {
    color: #e8f4ff;
}

.public-qm.menu-layout-neon .text-secondary,
.public-qm.menu-layout-neon .qm-menu-tile__desc,
.public-qm.menu-layout-neon .qm-product-page__lede,
.public-qm.menu-layout-neon .qm-product-page__prose {
    color: color-mix(in srgb, #d6eaff 72%, transparent) !important;
}

.public-qm.menu-layout-neon .qm-menu-badge,
.public-qm.menu-layout-neon .qm-soft-chip {
    color: #dff7ff;
}

.public-qm.menu-layout-neon .qm-cat-section-head {
    padding: 0.8rem 0;
    border-bottom: 1px solid color-mix(in srgb, var(--qm-primary) 62%, transparent);
    box-shadow: 0 8px 18px -14px color-mix(in srgb, var(--qm-primary) 78%, transparent);
}

/* aurora: organic gradient tiles with staggered desktop rhythm */
.public-qm.menu-layout-aurora .qm-menu-welcome__grid {
    gap: clamp(0.85rem, 3vw, 1.35rem);
}

.public-qm.menu-layout-aurora .qm-welcome-cat-tile {
    border-radius: 2rem 0.8rem 2rem 0.8rem;
}

.public-qm.menu-layout-aurora .qm-welcome-cat-tile:nth-child(even) {
    border-radius: 0.8rem 2rem 0.8rem 2rem;
}

.public-qm.menu-layout-aurora .qm-cat-section-head {
    padding: 1rem 1.1rem;
    border: 1px solid color-mix(in srgb, var(--qm-primary) 22%, var(--qm-border));
    border-radius: 1.4rem 0.55rem 1.4rem 0.55rem;
    background: linear-gradient(
        125deg,
        color-mix(in srgb, var(--qm-card-bg) 86%, var(--qm-primary)),
        color-mix(in srgb, var(--qm-card-bg) 90%, var(--qm-secondary))
    );
}

.public-qm.menu-layout-aurora .qm-menu-tile,
.public-qm.menu-layout-aurora .qm-product-card,
.public-qm.menu-layout-aurora .qm-category-hero,
.public-qm.menu-layout-aurora .qm-product-page__hero,
.public-qm.menu-layout-aurora .qm-product-page__card {
    border-radius: 1.5rem 0.65rem 1.5rem 0.65rem !important;
}

@media (min-width: 640px) {
    .public-qm.menu-layout-aurora .qm-product-grid > a:nth-child(even) {
        transform: translateY(0.8rem);
    }
}

/* nexus: terminal-like clipped panels and scanline hierarchy */
.public-qm.menu-layout-nexus .qm-menu-welcome__grid {
    gap: 0.65rem;
}

.public-qm.menu-layout-nexus .qm-welcome-cat-tile,
.public-qm.menu-layout-nexus .qm-menu-tile,
.public-qm.menu-layout-nexus .qm-product-card,
.public-qm.menu-layout-nexus .qm-category-hero,
.public-qm.menu-layout-nexus .qm-product-page__hero,
.public-qm.menu-layout-nexus .qm-product-page__card {
    clip-path: polygon(0 0, calc(100% - 0.85rem) 0, 100% 0.85rem, 100% 100%, 0.85rem 100%, 0 calc(100% - 0.85rem));
}

.public-qm.menu-layout-nexus .qm-welcome-cat-tile__name,
.public-qm.menu-layout-nexus .qm-menu-tile__title,
.public-qm.menu-layout-nexus .qm-product-card h3,
.public-qm.menu-layout-nexus .qm-category-hero h1,
.public-qm.menu-layout-nexus .qm-product-page__title {
    font-family: Consolas, "Courier New", monospace;
    letter-spacing: 0.045em;
    text-transform: uppercase;
}

.public-qm.menu-layout-nexus .qm-cat-section-head {
    padding: 0.75rem 0.9rem;
    border: 1px solid color-mix(in srgb, var(--qm-primary) 36%, var(--qm-border));
    background:
        repeating-linear-gradient(0deg, transparent 0 7px, color-mix(in srgb, var(--qm-primary) 7%, transparent) 7px 8px),
        color-mix(in srgb, var(--qm-card-bg) 92%, var(--qm-primary));
    clip-path: polygon(0 0, calc(100% - 0.7rem) 0, 100% 0.7rem, 100% 100%, 0.7rem 100%, 0 calc(100% - 0.7rem));
}

.public-qm.menu-layout-nexus .qm-menu-badge::before {
    content: "[";
}

.public-qm.menu-layout-nexus .qm-menu-badge::after {
    content: "]";
}

@media (min-width: 768px) {
    .public-qm.menu-layout-nexus .qm-menu-welcome__grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .public-qm.menu-layout-minimal .qm-menu-tile__body {
        padding-right: 0.15rem;
    }

    .public-qm.menu-layout-bold .qm-menu-tile,
    .public-qm.menu-layout-bold .qm-product-card,
    .public-qm.menu-layout-bold .qm-category-hero,
    .public-qm.menu-layout-bold .qm-product-page__hero,
    .public-qm.menu-layout-bold .qm-product-page__card {
        box-shadow: 0.25rem 0.25rem 0 color-mix(in srgb, var(--qm-primary) 52%, transparent) !important;
    }

    .public-qm.menu-layout-neon .qm-menu-tile::after,
    .public-qm.menu-layout-neon .qm-product-card::after {
        inset: 0.25rem;
    }

    .public-qm.menu-layout-aurora .qm-product-grid > a:nth-child(even) {
        transform: none;
    }
}
