:root {
    --bg: #f4ede1;
    --bg-deep: #1a2232;
    --bg-panel: rgba(255, 251, 244, 0.9);
    --bg-panel-strong: #fffaf2;
    --ink: #192333;
    --ink-soft: #697386;
    --ink-muted: #8d95a2;
    --line: rgba(25, 35, 51, 0.1);
    --gold: #c79542;
    --gold-deep: #8d6324;
    --gold-soft: rgba(199, 149, 66, 0.14);
    --navy: #1d2940;
    --navy-soft: rgba(29, 41, 64, 0.84);
    --danger: #a24f41;
    --shadow-xl: 0 40px 90px rgba(21, 29, 43, 0.14);
    --shadow-lg: 0 24px 54px rgba(21, 29, 43, 0.12);
    --shadow-md: 0 16px 34px rgba(21, 29, 43, 0.08);
    --radius-xl: 38px;
    --radius-lg: 28px;
    --radius-md: 22px;
    --radius-sm: 16px;
    --container: 1560px;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body.storefront-body {
    margin: 0;
    min-height: 100vh;
    color: var(--ink);
    font-family: "Cairo", sans-serif;
    overflow-x: clip;
    background:
        radial-gradient(circle at 18% 14%, rgba(199, 149, 66, 0.12), transparent 24%),
        radial-gradient(circle at 82% 10%, rgba(29, 41, 64, 0.08), transparent 18%),
        linear-gradient(180deg, #faf5ec 0%, #f2e9db 48%, #f8f4ed 100%);
}

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

img {
    max-width: 100%;
    display: block;
}

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

.backdrop-veil,
.backdrop-grid {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: -2;
}

.backdrop-veil {
    background:
        radial-gradient(circle at 24% 24%, rgba(255, 255, 255, 0.58), transparent 22%),
        radial-gradient(circle at 76% 30%, rgba(199, 149, 66, 0.07), transparent 24%);
}

.backdrop-grid {
    z-index: -1;
    opacity: 0.25;
    background-image:
        linear-gradient(rgba(25, 35, 51, 0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(25, 35, 51, 0.045) 1px, transparent 1px);
    background-size: 34px 34px;
    mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.7), transparent 82%);
}

.site-frame {
    width: min(calc(100% - 24px), var(--container));
    margin: 14px auto 40px;
}

.top-ribbon {
    margin-bottom: 14px;
}

.top-ribbon__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.9rem 1.4rem;
    border-radius: 999px;
    color: rgba(255, 248, 238, 0.92);
    background: linear-gradient(90deg, rgba(16, 24, 39, 0.96) 0%, rgba(30, 43, 66, 0.96) 100%);
    box-shadow: var(--shadow-md);
}

.top-ribbon__meta,
.top-ribbon__actions {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.top-ribbon__meta span,
.top-ribbon__actions a {
    font-size: 0.92rem;
    font-weight: 700;
}

.top-ribbon__actions a {
    color: #f3d19a;
}

.site-header {
    position: sticky;
    top: 10px;
    z-index: 40;
    transition: transform 0.25s ease, top 0.25s ease;
}

.site-header__shell {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    padding: 1rem 1.4rem;
    border-radius: 32px;
    border: 1px solid rgba(255, 255, 255, 0.42);
    background:
        linear-gradient(180deg, rgba(255, 252, 247, 0.9) 0%, rgba(246, 239, 226, 0.84) 100%);
    backdrop-filter: blur(18px);
    box-shadow: var(--shadow-lg);
}

.site-header.is-scrolled .site-header__shell {
    box-shadow: 0 22px 44px rgba(21, 29, 43, 0.16);
}

.brand-lockup {
    display: inline-flex;
    align-items: center;
    gap: 1rem;
    min-width: 0;
}

.brand-lockup__seal {
    width: 76px;
    height: 76px;
    display: grid;
    place-items: center;
    border-radius: 24px;
    background:
        radial-gradient(circle at 35% 35%, rgba(255, 255, 255, 0.96), rgba(238, 222, 190, 0.95) 74%);
    box-shadow:
        inset 0 1px 1px rgba(255, 255, 255, 0.8),
        0 16px 34px rgba(199, 149, 66, 0.22);
}

.brand-lockup__seal img {
    width: 54px;
    height: 54px;
    object-fit: contain;
}

.brand-lockup__copy {
    display: grid;
    gap: 0.18rem;
}

.brand-lockup__copy strong,
.display-title,
.section-heading h1,
.section-heading h2,
.page-hero h1,
.auth-panel h1,
.form-panel h1,
.purchase-panel h1,
.success-shell h1,
.empty-state h2,
.product-tile__title,
.product-story__title {
    font-family: "Alexandria", "Cairo", sans-serif;
}

.brand-lockup__copy strong {
    font-size: 1.16rem;
    font-weight: 800;
}

.brand-lockup__copy small {
    font-family: "Cormorant Garamond", serif;
    font-size: 1rem;
    letter-spacing: 0.08em;
    color: var(--gold-deep);
}

.nav-toggle {
    display: none;
    width: 52px;
    height: 52px;
    margin-inline-start: auto;
    padding: 0;
    border: 0;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.72);
    box-shadow: inset 0 0 0 1px rgba(25, 35, 51, 0.08);
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 0.32rem;
    cursor: pointer;
}

.nav-toggle span {
    width: 20px;
    height: 2px;
    border-radius: 999px;
    background: var(--ink);
    transition: transform 0.25s ease, opacity 0.25s ease;
}

.nav-toggle.is-open span:nth-child(1) {
    transform: translateY(6px) rotate(45deg);
}

.nav-toggle.is-open span:nth-child(2) {
    opacity: 0;
}

.nav-toggle.is-open span:nth-child(3) {
    transform: translateY(-6px) rotate(-45deg);
}

.nav-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    flex: 1 1 auto;
}

.site-nav,
.quick-actions {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    flex-wrap: wrap;
}

.site-nav__link,
.nav-dropdown summary,
.quick-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    min-height: 48px;
    padding: 0.7rem 1rem;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--ink-soft);
    font-size: 0.98rem;
    font-weight: 700;
    cursor: pointer;
    transition: color 0.2s ease, background-color 0.2s ease, transform 0.2s ease;
}

.site-nav__link:hover,
.nav-dropdown summary:hover,
.quick-chip:hover {
    color: var(--ink);
    background: rgba(29, 41, 64, 0.06);
    transform: translateY(-1px);
}

.site-nav__link.is-active,
.nav-dropdown summary.is-active {
    color: var(--ink);
    background: rgba(199, 149, 66, 0.16);
}

.nav-dropdown {
    position: relative;
}

.nav-dropdown summary {
    list-style: none;
}

.nav-dropdown summary::-webkit-details-marker {
    display: none;
}

.nav-dropdown__menu {
    position: absolute;
    top: calc(100% + 0.8rem);
    right: 0;
    min-width: 240px;
    display: grid;
    gap: 0.5rem;
    padding: 0.85rem;
    border-radius: 24px;
    border: 1px solid rgba(25, 35, 51, 0.08);
    background: rgba(255, 250, 244, 0.98);
    box-shadow: var(--shadow-lg);
}

.nav-dropdown__menu a,
.nav-dropdown__menu button {
    width: 100%;
    padding: 0.85rem 1rem;
    border: 0;
    border-radius: 16px;
    background: rgba(25, 35, 51, 0.04);
    text-align: right;
    font-weight: 700;
    transition: background-color 0.2s ease, transform 0.2s ease;
}

.nav-dropdown__menu a:hover,
.nav-dropdown__menu button:hover {
    background: rgba(199, 149, 66, 0.14);
    transform: translateX(-2px);
}

.quick-chip {
    background: rgba(29, 41, 64, 0.05);
    color: var(--ink);
    box-shadow: inset 0 0 0 1px rgba(25, 35, 51, 0.06);
}

.quick-chip--primary {
    background: linear-gradient(135deg, var(--gold) 0%, #ddb36f 100%);
    color: #fffaf1;
    box-shadow: none;
}

.site-main {
    padding: 1.15rem 0 3rem;
}

.page-shell {
    display: grid;
    gap: 1.6rem;
}

.section-block,
.surface-card,
.page-hero,
.home-hero,
.product-story,
.product-tile,
.purchase-panel,
.detail-stage,
.catalog-sidebar,
.catalog-panel,
.cart-item,
.summary-panel,
.form-panel,
.auth-panel,
.promo-panel,
.success-shell,
.empty-state,
.footer-panel,
.site-footer__hero {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.45);
    border-radius: var(--radius-xl);
    background:
        linear-gradient(180deg, rgba(255, 251, 245, 0.94) 0%, rgba(247, 241, 230, 0.88) 100%);
    box-shadow: var(--shadow-xl);
}

.section-block::before,
.surface-card::before,
.page-hero::before,
.home-hero::before,
.product-story::before,
.product-tile::before,
.purchase-panel::before,
.detail-stage::before,
.catalog-sidebar::before,
.catalog-panel::before,
.cart-item::before,
.summary-panel::before,
.form-panel::before,
.auth-panel::before,
.promo-panel::before,
.success-shell::before,
.empty-state::before,
.footer-panel::before,
.site-footer__hero::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at top left, rgba(255, 255, 255, 0.48), transparent 28%),
        linear-gradient(135deg, rgba(199, 149, 66, 0.06), transparent 40%);
}

.eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    width: fit-content;
    padding: 0.56rem 0.95rem;
    border-radius: 999px;
    background: rgba(199, 149, 66, 0.14);
    color: var(--gold-deep);
    font-weight: 800;
    font-size: 0.9rem;
}

.display-title {
    margin: 0;
    line-height: 1.08;
    font-size: clamp(2.3rem, 5vw, 5rem);
    font-weight: 800;
}

.section-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1rem;
}

.section-heading h1,
.section-heading h2,
.page-hero h1,
.purchase-panel h1,
.form-panel h1,
.auth-panel h1,
.success-shell h1,
.empty-state h2 {
    margin: 0 0 0.4rem;
    color: var(--ink);
}

.section-heading h1,
.section-heading h2,
.page-hero h1 {
    font-size: clamp(1.6rem, 3vw, 3rem);
}

.section-heading p,
.page-hero p,
.home-hero__body p,
.product-story p,
.summary-panel p,
.form-panel p,
.auth-panel p,
.promo-panel p,
.success-shell p,
.empty-state p,
.purchase-panel p {
    margin: 0;
    color: var(--ink-soft);
    line-height: 1.95;
}

.button-primary,
.button-secondary,
.button-ghost,
.product-actions button,
.product-actions a,
.summary-actions a,
.summary-actions button,
.auth-actions a,
.auth-actions button,
.action-row a,
.action-row button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    min-height: 52px;
    padding: 0.9rem 1.3rem;
    border: 1px solid transparent;
    border-radius: 18px;
    font-weight: 800;
    transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
}

.button-primary,
.product-actions .button-accent,
.summary-actions .button-accent,
.auth-actions .button-accent,
.action-row .button-accent,
.summary-actions button.button-accent {
    background: linear-gradient(135deg, var(--gold) 0%, #ddb36f 100%);
    color: #fffaf1;
    box-shadow: 0 18px 34px rgba(199, 149, 66, 0.18);
}

.button-secondary,
.button-ghost,
.product-actions .button-soft,
.summary-actions .button-soft,
.auth-actions .button-soft,
.action-row .button-soft {
    background: rgba(29, 41, 64, 0.05);
    color: var(--ink);
    border-color: rgba(25, 35, 51, 0.1);
}

.button-primary:hover,
.button-secondary:hover,
.button-ghost:hover,
.product-actions button:hover,
.product-actions a:hover,
.summary-actions a:hover,
.summary-actions button:hover,
.auth-actions a:hover,
.auth-actions button:hover,
.action-row a:hover,
.action-row button:hover {
    transform: translateY(-2px);
    box-shadow: 0 20px 34px rgba(21, 29, 43, 0.12);
}

.button-secondary {
    background: linear-gradient(135deg, rgba(29, 41, 64, 0.95) 0%, rgba(49, 66, 97, 0.95) 100%);
    color: #fff;
}

.metric-row,
.hero-notes,
.pill-row,
.page-hero__meta,
.filters-row,
.spec-row,
.inline-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.metric-pill,
.meta-pill,
.filter-chip,
.stat-card,
.fact-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    min-height: 46px;
    padding: 0.8rem 1rem;
    border-radius: 999px;
    background: rgba(29, 41, 64, 0.05);
    color: var(--ink);
    font-weight: 800;
}

.filter-chip {
    border: 1px solid transparent;
}

.filter-chip.is-active {
    background: var(--navy);
    color: #fff;
}

.home-hero {
    padding: 1.8rem;
}

.home-hero__grid {
    display: grid;
    gap: 1.4rem;
}

.hero-masthead {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 1rem 1.5rem;
}

.hero-masthead__copy {
    display: grid;
    gap: 1rem;
    max-width: 980px;
}

.hero-masthead__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: end;
    gap: 0.8rem;
}

.hero-intro {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.7rem;
}

.hero-tag {
    display: inline-flex;
    align-items: center;
    padding: 0.55rem 0.95rem;
    border-radius: 999px;
    background: rgba(199, 149, 66, 0.16);
    color: var(--ink);
    font-weight: 800;
}

.home-hero__lead {
    max-width: 60ch;
    font-size: 1.06rem;
}

.hero-stageboard {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.9fr) minmax(240px, 0.74fr);
    grid-template-rows: minmax(250px, 1fr) minmax(220px, 0.9fr);
    gap: 1rem;
    min-height: 600px;
}

.showcase-card {
    position: relative;
    overflow: hidden;
    border-radius: 34px;
    border: 1px solid rgba(255, 255, 255, 0.42);
    background:
        linear-gradient(180deg, rgba(255, 251, 245, 0.94) 0%, rgba(247, 241, 230, 0.88) 100%);
    box-shadow: var(--shadow-lg);
}

.showcase-card--feature {
    grid-column: 1 / span 2;
    grid-row: 1 / span 2;
    min-height: 600px;
    background: #101722;
}

.showcase-card--quote,
.showcase-card--detail {
    min-height: 240px;
}

.showcase-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.45s ease;
}

.showcase-card:hover img {
    transform: scale(1.05);
}

.showcase-card--feature::after,
.showcase-card--detail::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(10, 16, 28, 0.04) 0%, rgba(10, 16, 28, 0.62) 100%);
    pointer-events: none;
}

.showcase-card__overlay,
.showcase-card__note {
    position: absolute;
    inset: auto 1rem 1rem 1rem;
    display: grid;
    gap: 0.35rem;
    padding: 1rem 1.1rem;
    border-radius: 24px;
    color: #fff;
    background: rgba(15, 23, 38, 0.54);
    backdrop-filter: blur(16px);
    z-index: 1;
}

.showcase-card__eyebrow {
    display: inline-flex;
    width: fit-content;
    padding: 0.46rem 0.8rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.16);
    color: rgba(255, 248, 236, 0.96);
    font-size: 0.86rem;
    font-weight: 800;
}

.showcase-card__overlay p,
.showcase-card__note span {
    color: rgba(255, 248, 236, 0.82);
    margin: 0;
    line-height: 1.8;
}

.showcase-card__overlay strong,
.showcase-card__note strong {
    display: block;
    font-size: 1.08rem;
}

.showcase-card--quote {
    display: grid;
    align-content: space-between;
    gap: 1rem;
    padding: 1.35rem;
    background:
        linear-gradient(135deg, rgba(17, 25, 40, 0.96) 0%, rgba(36, 48, 74, 0.96) 100%);
    color: rgba(255, 249, 238, 0.94);
}

.showcase-card--quote h2 {
    margin: 0;
    font-size: clamp(1.55rem, 2vw, 2.25rem);
    line-height: 1.28;
    font-family: "Alexandria", "Cairo", sans-serif;
    color: inherit;
}

.showcase-list {
    display: grid;
    gap: 0.75rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.showcase-list li {
    display: flex;
    align-items: start;
    gap: 0.65rem;
    color: rgba(255, 248, 236, 0.82);
    line-height: 1.8;
}

.showcase-list li::before {
    content: "";
    flex: none;
    width: 10px;
    height: 10px;
    margin-top: 0.55rem;
    border-radius: 50%;
    background: #d9af69;
}

.showcase-card--detail {
    display: grid;
    grid-template-rows: 1fr auto;
    min-height: 290px;
}

.showcase-card--metrics {
    display: grid;
    gap: 0.9rem;
    padding: 1rem;
    align-content: stretch;
    background:
        linear-gradient(180deg, rgba(247, 238, 223, 0.96) 0%, rgba(238, 226, 201, 0.94) 100%);
}

.metric-compact {
    display: grid;
    gap: 0.35rem;
    min-height: 0;
    padding: 1rem 1.05rem;
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(25, 35, 51, 0.07);
    box-shadow: var(--shadow-md);
}

.metric-compact strong {
    color: var(--ink);
    font-size: 1.18rem;
    font-family: "Alexandria", "Cairo", sans-serif;
}

.metric-compact span {
    color: var(--ink-soft);
    line-height: 1.75;
}

.action-row,
.hero-actions,
.product-actions,
.summary-actions,
.auth-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;
}

.hero-stats,
.feature-grid,
.curation-grid,
.product-grid,
.related-grid,
.story-grid,
.catalog-layout,
.cart-layout,
.auth-layout,
.form-layout {
    display: grid;
    gap: 1.2rem;
}

.hero-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.stat-card {
    flex-direction: column;
    align-items: start;
    min-height: 120px;
    padding: 1rem 1.1rem;
    border-radius: 26px;
    box-shadow: var(--shadow-md);
}

.stat-card strong {
    font-size: 1.45rem;
    font-family: "Alexandria", "Cairo", sans-serif;
}

.section-block,
.catalog-panel,
.catalog-sidebar,
.summary-panel,
.form-panel,
.auth-panel,
.promo-panel,
.success-shell,
.empty-state {
    padding: 1.4rem;
}

.section-block--dark,
.promo-panel {
    background:
        linear-gradient(135deg, rgba(17, 25, 40, 0.95) 0%, rgba(36, 48, 74, 0.95) 100%);
    color: rgba(255, 249, 238, 0.92);
}

.section-block--dark::before,
.promo-panel::before {
    background:
        radial-gradient(circle at top left, rgba(199, 149, 66, 0.18), transparent 32%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.06), transparent 48%);
}

.section-block--dark h2,
.section-block--dark h3,
.section-block--dark .section-heading p,
.promo-panel h1,
.promo-panel p,
.promo-panel .summary-line,
.promo-panel .summary-line strong {
    color: inherit;
}

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

.feature-card {
    position: relative;
    display: grid;
    gap: 0.8rem;
    padding: 1.25rem;
    border-radius: 30px;
    background: rgba(255, 255, 255, 0.08);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
}

.feature-index {
    width: 54px;
    height: 54px;
    display: inline-grid;
    place-items: center;
    border-radius: 18px;
    font-family: "Alexandria", "Cairo", sans-serif;
    font-weight: 800;
    color: #f3d19a;
    background: rgba(243, 209, 154, 0.12);
}

.collection-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.collection-card {
    position: relative;
    overflow: hidden;
    min-height: 360px;
    border-radius: 30px;
    box-shadow: var(--shadow-lg);
}

.collection-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.collection-card:hover img {
    transform: scale(1.05);
}

.collection-card__overlay {
    position: absolute;
    inset: auto 0 0 0;
    padding: 1.3rem;
    color: #fff;
    background: linear-gradient(180deg, transparent 0%, rgba(16, 24, 39, 0.84) 100%);
}

.collection-card__overlay h3 {
    margin: 0 0 0.35rem;
    font-size: 1.3rem;
}

.collection-card__overlay p {
    margin: 0;
    line-height: 1.8;
    color: rgba(255, 255, 255, 0.78);
}

.collection-card__link {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    margin-top: 0.85rem;
    color: #f4d6a4;
    font-weight: 800;
}

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

.product-story {
    padding: 1.5rem;
}

.product-story__title {
    margin: 0 0 0.6rem;
    font-size: 1.45rem;
}

.story-points {
    display: grid;
    gap: 0.7rem;
    margin-top: 1rem;
}

.story-points li {
    display: flex;
    align-items: start;
    gap: 0.65rem;
    color: var(--ink-soft);
}

.story-points li::before {
    content: "";
    flex: none;
    width: 10px;
    height: 10px;
    margin-top: 0.55rem;
    border-radius: 50%;
    background: var(--gold);
}

.product-grid {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

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

.related-grid {
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
}

.product-tile {
    display: grid;
    grid-template-rows: auto 1fr;
    padding: 0.9rem;
}

.product-tile__media {
    position: relative;
    overflow: hidden;
    aspect-ratio: 4 / 4.8;
    border-radius: 26px;
    background: linear-gradient(180deg, #fbf3e4 0%, #f2e3c6 100%);
}

.product-tile__media img {
    width: 100%;
    height: 100%;
    padding: 0.85rem;
    object-fit: contain;
    transition: transform 0.35s ease;
}

.product-tile:hover .product-tile__media img {
    transform: scale(1.03);
}

.product-tile__badge {
    position: absolute;
    top: 14px;
    right: 14px;
    min-height: 36px;
    padding: 0.5rem 0.8rem;
    border-radius: 999px;
    background: rgba(255, 250, 244, 0.9);
    color: var(--gold-deep);
    font-weight: 800;
}

.product-tile__copy {
    display: grid;
    gap: 0.9rem;
    padding: 1rem 0.4rem 0.25rem;
}

.product-tile__title {
    margin: 0;
    font-size: 1.18rem;
}

.product-tile__desc {
    color: var(--ink-soft);
    line-height: 1.85;
}

.latest-grid .product-tile {
    min-height: 100%;
}

.latest-grid .product-tile__media {
    aspect-ratio: 1 / 1;
}

.latest-grid .product-tile__copy {
    gap: 0.7rem;
}

.latest-grid .product-tile__desc {
    margin: 0;
    font-size: 0.94rem;
    line-height: 1.7;
}

.spec-list,
.summary-lines,
.fact-list {
    display: grid;
    gap: 0.55rem;
}

.spec-row,
.summary-line,
.fact-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
    color: var(--ink-soft);
}

.summary-line strong,
.fact-row strong,
.spec-row strong {
    color: var(--ink);
}

.product-price {
    display: inline-flex;
    align-items: baseline;
    gap: 0.35rem;
    font-size: 1.5rem;
    font-family: "Alexandria", "Cairo", sans-serif;
    font-weight: 800;
    color: var(--danger);
}

.page-hero {
    padding: 1.4rem 1.6rem;
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1rem;
}

.catalog-layout {
    grid-template-columns: 300px minmax(0, 1fr);
    align-items: start;
}

.catalog-sidebar {
    position: sticky;
    top: 130px;
}

.catalog-links {
    display: grid;
    gap: 0.55rem;
    margin-top: 1rem;
}

.catalog-links a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.85rem 1rem;
    border-radius: 18px;
    background: rgba(29, 41, 64, 0.04);
    font-weight: 800;
    transition: background-color 0.2s ease, transform 0.2s ease;
}

.catalog-links a:hover,
.catalog-links a.is-current {
    background: rgba(199, 149, 66, 0.16);
    transform: translateX(-2px);
}

.pagination-shell {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    flex-wrap: wrap;
}

.pagination-shell a,
.pagination-shell span {
    width: 46px;
    height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    background: rgba(255, 251, 245, 0.85);
    border: 1px solid rgba(25, 35, 51, 0.08);
    font-weight: 800;
}

.pagination-shell a.is-active {
    background: var(--navy);
    color: #fff;
}

.pagination-shell a.is-disabled {
    pointer-events: none;
    opacity: 0.35;
}

.details-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.12fr) 380px;
    gap: 1.2rem;
    align-items: start;
}

.detail-stage {
    padding: 1rem;
    min-height: 620px;
}

.detail-stage__frame {
    overflow: hidden;
    min-height: 100%;
    border-radius: 32px;
    background: linear-gradient(180deg, #fbf2e0 0%, #efdfc0 100%);
}

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

.purchase-panel {
    padding: 1.5rem;
    display: grid;
    gap: 1rem;
    position: sticky;
    top: 130px;
}

.price-panel {
    padding: 1rem 1.1rem;
    border-radius: 24px;
    background: linear-gradient(135deg, rgba(22, 31, 49, 0.96) 0%, rgba(37, 51, 78, 0.96) 100%);
    color: #fff;
}

.price-panel__label {
    display: block;
    margin-bottom: 0.35rem;
    color: rgba(255, 255, 255, 0.74);
}

.price-panel__value {
    font-family: "Alexandria", "Cairo", sans-serif;
    font-size: 2rem;
    font-weight: 800;
}

.status-note {
    padding: 0.8rem 1rem;
    border-radius: 18px;
    background: rgba(199, 149, 66, 0.12);
    color: var(--gold-deep);
    font-weight: 800;
}

.cart-layout {
    grid-template-columns: minmax(0, 1.3fr) 360px;
    align-items: start;
}

.cart-list {
    display: grid;
    gap: 1rem;
}

.cart-item {
    display: grid;
    grid-template-columns: 160px minmax(0, 1fr);
    gap: 1rem;
    padding: 1rem;
}

.cart-item__image {
    overflow: hidden;
    border-radius: 24px;
    aspect-ratio: 1 / 1;
    background: linear-gradient(180deg, #faf1dd 0%, #efdebc 100%);
}

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

.cart-item__content {
    display: grid;
    gap: 0.85rem;
}

.cart-item__header,
.summary-total {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 0.9rem;
}

.cart-item__title {
    margin: 0;
    font-size: 1.2rem;
    font-family: "Alexandria", "Cairo", sans-serif;
}

.remove-link {
    color: var(--danger);
    font-weight: 800;
}

.summary-panel {
    position: sticky;
    top: 130px;
}

.summary-total strong {
    font-family: "Alexandria", "Cairo", sans-serif;
    font-size: 1.7rem;
}

.form-layout,
.auth-layout {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
}

.field-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 1rem;
}

.field-group {
    display: grid;
    gap: 0.55rem;
}

.field-group--full {
    grid-column: 1 / -1;
}

.field-group label {
    font-weight: 800;
}

.store-input,
.store-select,
.store-textarea {
    width: 100%;
    min-height: 56px;
    padding: 0.95rem 1rem;
    border: 1px solid rgba(25, 35, 51, 0.12);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.74);
    color: var(--ink);
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

.store-textarea {
    min-height: 170px;
    resize: vertical;
}

.store-input:focus,
.store-select:focus,
.store-textarea:focus {
    outline: none;
    border-color: rgba(199, 149, 66, 0.72);
    box-shadow: 0 0 0 4px rgba(199, 149, 66, 0.14);
    background: rgba(255, 255, 255, 0.9);
}

.helper-text {
    color: var(--ink-muted);
    font-size: 0.94rem;
}

.text-danger {
    color: var(--danger);
}

.text-danger ul {
    margin: 0;
    padding-right: 1.15rem;
}

.auth-panel,
.promo-panel,
.form-panel {
    padding: 1.5rem;
}

.auth-panel__media,
.success-shell__media {
    overflow: hidden;
    border-radius: 28px;
    min-height: 260px;
    background: linear-gradient(135deg, rgba(199, 149, 66, 0.16), rgba(29, 41, 64, 0.14));
    display: grid;
    place-items: center;
}

.auth-panel__media img,
.success-shell__media img {
    max-width: 240px;
    max-height: 240px;
    object-fit: contain;
}

.success-shell {
    max-width: 860px;
    margin: 0 auto;
    padding: 1.6rem;
    text-align: center;
}

.success-shell .summary-lines {
    max-width: 560px;
    margin: 0 auto;
}

.empty-state {
    padding: 2rem;
    text-align: center;
    justify-items: center;
}

.site-footer {
    display: grid;
    gap: 1rem;
    padding-top: 1.2rem;
}

.site-footer__hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.5rem;
    background: linear-gradient(135deg, rgba(15, 24, 39, 0.96) 0%, rgba(33, 47, 73, 0.96) 100%);
    color: rgba(255, 249, 238, 0.92);
}

.footer-kicker {
    display: inline-block;
    margin-bottom: 0.5rem;
    color: #f4d19c;
    font-family: "Cormorant Garamond", serif;
    font-size: 1.15rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.site-footer__hero h2 {
    margin: 0 0 0.5rem;
    font-size: clamp(1.8rem, 3vw, 3rem);
}

.site-footer__hero p {
    max-width: 640px;
    margin: 0;
    color: rgba(255, 249, 238, 0.72);
}

.site-footer__grid {
    display: grid;
    grid-template-columns: 1.15fr 1fr 0.92fr;
    gap: 1rem;
}

.footer-panel {
    padding: 1.35rem;
    background: linear-gradient(180deg, rgba(21, 31, 48, 0.97) 0%, rgba(29, 41, 64, 0.96) 100%);
    color: rgba(255, 249, 238, 0.9);
}

.footer-panel h3 {
    margin: 0 0 0.7rem;
    color: #fff;
    font-size: 1.45rem;
}

.footer-panel p {
    margin: 0;
    line-height: 1.95;
    color: rgba(255, 249, 238, 0.72);
}

.footer-pill-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    margin-top: 1rem;
}

.footer-pill-row span {
    padding: 0.55rem 0.8rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    color: #f4d19c;
    font-weight: 700;
}

.footer-list,
.footer-hours {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 0.7rem;
}

.footer-list li {
    display: flex;
    align-items: center;
    gap: 0.7rem;
}

.footer-list i {
    color: #f4d19c;
}

.footer-list a {
    color: rgba(255, 249, 238, 0.88);
}

.footer-hours li {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    color: rgba(255, 249, 238, 0.84);
}

.site-footer__bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.3rem 0 0.8rem;
    color: var(--ink-soft);
}

.site-footer__bottom a {
    color: var(--gold-deep);
    font-weight: 800;
}

@media (max-width: 1180px) {
    .home-hero__grid,
    .catalog-layout,
    .details-layout,
    .cart-layout,
    .auth-layout,
    .form-layout,
    .site-footer__grid {
        grid-template-columns: 1fr;
    }

    .catalog-sidebar,
    .purchase-panel,
    .summary-panel {
        position: static;
    }

    .collection-grid,
    .feature-grid,
    .story-grid,
    .latest-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .hero-stageboard {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: auto;
        min-height: 0;
    }

    .showcase-card--feature {
        grid-column: 1 / -1;
        grid-row: auto;
        min-height: 460px;
    }
}

@media (max-width: 980px) {
    .site-frame {
        width: min(calc(100% - 20px), var(--container));
        margin-top: 10px;
    }

    .top-ribbon__inner,
    .site-footer__hero,
    .page-hero,
    .section-heading {
        flex-direction: column;
        align-items: start;
    }

    .site-header__shell {
        flex-wrap: wrap;
    }

    .nav-toggle {
        display: inline-flex;
    }

    .nav-panel {
        display: none;
        width: 100%;
        flex-direction: column;
        align-items: stretch;
        padding-top: 0.8rem;
        border-top: 1px solid rgba(25, 35, 51, 0.08);
    }

    .nav-panel.is-open {
        display: flex;
    }

    .site-nav,
    .quick-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .site-nav__link,
    .nav-dropdown summary,
    .quick-chip {
        justify-content: space-between;
    }

    .nav-dropdown {
        width: 100%;
    }

    .nav-dropdown__menu {
        position: static;
        margin-top: 0.6rem;
    }

    .hero-masthead {
        grid-template-columns: 1fr;
        align-items: start;
    }

    .hero-masthead__actions {
        justify-content: start;
    }

    .hero-stats,
    .feature-grid,
    .collection-grid,
    .story-grid,
    .latest-grid,
    .field-grid {
        grid-template-columns: 1fr;
    }

    .hero-stageboard {
        grid-template-columns: 1fr;
    }

    .showcase-card--feature,
    .showcase-card--quote,
    .showcase-card--detail,
    .showcase-card--metrics {
        grid-column: auto;
        grid-row: auto;
    }

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

@media (max-width: 760px) {
    .site-main {
        padding-top: 1rem;
    }

    .brand-lockup__copy small {
        display: none;
    }

    .home-hero {
        padding: 1.1rem;
    }

    .hero-masthead__actions {
        flex-direction: column;
        align-items: stretch;
    }

    .showcase-card--feature {
        min-height: 340px;
    }

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

    .cart-item {
        grid-template-columns: 1fr;
    }

    .product-grid,
    .related-grid {
        grid-template-columns: 1fr;
    }

    .pagination-shell a,
    .pagination-shell span {
        width: 42px;
        height: 42px;
    }
}