:root {
    --spice-primary: #526747;
    --spice-accent: #C6A56B;
    --spice-bg: #FBF8F0;
    --spice-surface: #FFFFFF;
    --spice-text: #293526;
    --spice-muted: #73796B;
    --spice-border: #E8E2D5;
    --spice-shadow: 0 8px 30px rgba(42, 51, 33, 0.08);
    --spice-transition: 0.3s ease;
}

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

html {
    scroll-behavior: smooth;
    scroll-padding-top: 100px;
}

body {
    font-family: 'Quicksand', sans-serif;
    font-size: 15px;
    font-weight: 400;
    background: var(--spice-bg);
    color: var(--spice-text);
}

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

button {
    font: inherit;
}

.spice-header {
    position: sticky;
    top: 0;
    z-index: 9999;
    width: 100%;
    background: var(--spice-surface);
    border-bottom: 1px solid var(--spice-border);
    box-shadow: var(--spice-shadow);
    transition: background var(--spice-transition),
                border-color var(--spice-transition);
}

.spice-container {
    width: min(100% - 64px, 1400px);
    margin: 0 auto;
}

.spice-header-inner {
    min-height: 88px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
}

/* LOGO */
.spice-logo {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.spice-logo-icon {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--spice-primary);
    color: #FFFFFF;
    border-radius: 50% 50% 8px 50%;
    font-size: 21px;
    transition: transform var(--spice-transition);
}

.spice-logo:hover .spice-logo-icon {
    transform: rotate(-8deg);
}

.spice-logo-text {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.spice-logo-text strong {
    font-size: 20px;
    font-weight: 700;
    letter-spacing: -0.5px;
    white-space: nowrap;
}

.spice-logo-text small {
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 2px;
    color: var(--spice-muted);
    white-space: nowrap;
}

/* NAVIGATION */
.spice-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(18px, 2.3vw, 34px);
}

.spice-nav a {
    position: relative;
    padding: 12px 0;
    font-size: 15px;
    font-weight: 600;
    white-space: nowrap;
    color: var(--spice-text);
    transition: color var(--spice-transition);
}

.spice-nav-dropdown {
    position: relative;
}

.spice-nav-dropdown-heading {
    display: flex;
    align-items: center;
}

.spice-nav-dropdown-trigger {
    display: block;
}

.spice-nav-dropdown-toggle {
    padding: 12px 4px;
    border: 0;
    background: transparent;
    color: var(--spice-text);
    font-size: 11px;
    cursor: pointer;
    transition: color var(--spice-transition), transform var(--spice-transition);
}

.spice-nav-dropdown-toggle:hover {
    color: var(--spice-primary);
}

.spice-nav-dropdown-menu {
    position: absolute;
    top: 100%;
    left: -18px;
    z-index: 10;
    min-width: 160px;
    padding: 8px;
    display: flex;
    flex-direction: column;
    background: var(--spice-surface);
    border: 1px solid var(--spice-border);
    border-radius: 4px;
    box-shadow: var(--spice-shadow);
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transform: translateY(6px);
    transition: all var(--spice-transition);
}

.spice-nav-dropdown:hover .spice-nav-dropdown-menu,
.spice-nav-dropdown:focus-within .spice-nav-dropdown-menu,
.spice-nav-dropdown.is-submenu-open .spice-nav-dropdown-menu {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}

.spice-nav-dropdown-menu a {
    padding: 10px 12px;
    border-radius: 3px;
}

.spice-nav-dropdown-menu a:hover {
    background: var(--spice-bg);
}

.spice-nav a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 4px;
    width: 0;
    height: 2px;
    background: var(--spice-accent);
    transition: width var(--spice-transition);
}

.spice-nav a:hover,
.spice-nav a.active {
    color: var(--spice-primary);
}

.spice-nav a:hover::after,
.spice-nav a.active::after {
    width: 100%;
}

/* ACTIONS */
.spice-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

.spice-icon-btn {
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--spice-border);
    border-radius: 50%;
    background: transparent;
    color: var(--spice-text);
    font-size: 16px;
    cursor: pointer;
    transition: all var(--spice-transition);
}

.spice-icon-btn:hover {
    background: var(--spice-primary);
    color: #FFFFFF;
    border-color: var(--spice-primary);
}

.spice-cta {
    min-height: 46px;
    padding: 0 19px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 1px solid var(--spice-primary);
    border-radius: 4px;
    background: var(--spice-primary);
    color: #FFFFFF;
    font-size: 14px;
    font-weight: 700;
    white-space: nowrap;
    transition: all var(--spice-transition);
}

.spice-cta:hover {
    background: transparent;
    color: var(--spice-primary);
}

.spice-menu-btn {
    display: none;
}

/* TABLET */
@media (max-width: 1100px) {
    .spice-container {
        width: calc(100% - 40px);
    }

    .spice-header-inner {
        gap: 16px;
    }

    .spice-nav {
        gap: 16px;
    }

    .spice-logo-text strong {
        font-size: 17px;
    }

    .spice-cta {
        padding: 0 13px;
    }

    .spice-actions {
        gap: 7px;
    }
}

/* MOBILE NAVIGATION */
@media (max-width: 900px) {
    .spice-container {
        width: calc(100% - 32px);
    }

    .spice-header-inner {
        min-height: 76px;
        gap: 10px;
    }

    .spice-logo {
        gap: 8px;
    }

    .spice-logo-icon {
        width: 40px;
        height: 40px;
        font-size: 18px;
    }

    .spice-logo-text strong {
        font-size: 16px;
    }

    .spice-logo-text small {
        font-size: 8px;
        letter-spacing: 1.4px;
    }

    .spice-nav {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        padding: 10px 24px 20px;
        background: var(--spice-surface);
        border-bottom: 1px solid var(--spice-border);
        box-shadow: var(--spice-shadow);
        visibility: hidden;
        opacity: 0;
        pointer-events: none;
        transform: translateY(-8px);
        transition: all var(--spice-transition);
    }

    .spice-nav.is-open {
        visibility: visible;
        opacity: 1;
        pointer-events: auto;
        transform: translateY(0);
    }

    .spice-nav a {
        padding: 14px 0;
        border-bottom: 1px solid var(--spice-border);
    }

    .spice-nav-dropdown-menu {
        position: static;
        min-width: 0;
        padding: 0 0 4px 16px;
        display: none;
        border: 0;
        border-radius: 0;
        box-shadow: none;
        visibility: hidden;
        opacity: 1;
        pointer-events: auto;
        transform: none;
        transition: none;
    }

    .spice-nav-dropdown.is-submenu-open .spice-nav-dropdown-menu {
        display: flex;
        visibility: visible;
    }

    .spice-nav-dropdown-heading {
        width: 100%;
        border-bottom: 1px solid var(--spice-border);
    }

    .spice-nav .spice-nav-dropdown-trigger {
        flex: 1;
        border-bottom: 0;
    }

    .spice-nav-dropdown-toggle {
        padding: 14px 12px;
        font-size: 12px;
    }

    .spice-nav-dropdown-menu a {
        padding: 11px 12px;
        border-bottom: 1px solid var(--spice-border);
    }

    .spice-nav-dropdown-menu a:last-child {
        border-bottom: 0;
    }

    .spice-nav-dropdown-menu a:hover {
        background: transparent;
    }

    .spice-nav a::after {
        display: none;
    }

    .spice-actions {
        margin-left: auto;
    }

    .spice-menu-btn {
        display: inline-flex;
    }
}

/* SMALL MOBILE */
@media (max-width: 520px) {
    .spice-container {
        width: calc(100% - 24px);
    }

    .spice-header-inner {
        min-height: 70px;
    }

    .spice-logo-icon {
        width: 35px;
        height: 35px;
        font-size: 15px;
    }

    .spice-logo-text strong {
        font-size: 14px;
    }

    .spice-logo-text small {
        font-size: 7px;
        letter-spacing: 1px;
    }

    .spice-actions {
        gap: 5px;
    }

    .spice-icon-btn {
        width: 34px;
        height: 34px;
        font-size: 13px;
    }

    .spice-cta {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
    }
}

/* ================= PREMIUM SPICE FOOTER ================= */

.spice-footer {
    --footer-bg: #263426;
    --footer-surface: #30402F;
    --footer-heading: #F7F3E9;
    --footer-text: #C7CEBE;
    --footer-accent: #C6A56B;
    --footer-border: rgba(255, 255, 255, 0.12);

    position: relative;
    overflow: hidden;
    background: var(--footer-bg);
    color: var(--footer-text);
    font-family: 'Quicksand', sans-serif;
    font-size: 15px;
    font-weight: 400;
}

.spice-footer::before {
    content: "";
    position: absolute;
    top: -110px;
    right: -100px;
    width: 320px;
    height: 320px;
    border: 1px solid rgba(198, 165, 107, 0.12);
    border-radius: 50%;
    pointer-events: none;
}

.spice-footer::after {
    content: "";
    position: absolute;
    top: -65px;
    right: -55px;
    width: 230px;
    height: 230px;
    border: 1px solid rgba(198, 165, 107, 0.09);
    border-radius: 50%;
    pointer-events: none;
}

.spice-footer-container {
    width: min(100% - 64px, 1400px);
    margin: 0 auto;
}

.spice-footer-top {
    position: relative;
    z-index: 1;
    padding: 76px 0 65px;
}

.spice-footer-top .spice-footer-container {
    display: grid;
    grid-template-columns: 1.5fr 0.8fr 1fr 1.2fr;
    gap: 50px;
}

/* BRAND */

.spice-footer-logo {
    display: inline-flex;
    align-items: center;
    gap: 13px;
    margin-bottom: 25px;
    color: var(--footer-heading);
}

.spice-footer-logo-icon {
    width: 51px;
    height: 51px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: var(--footer-accent);
    color: #263426;
    border-radius: 50% 50% 8px 50%;
    font-size: 22px;
}

.spice-footer-logo-text {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.spice-footer-logo-text strong {
    font-size: 20px;
    font-weight: 700;
    letter-spacing: -0.5px;
    white-space: nowrap;
}

.spice-footer-logo-text small {
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 1.5px;
    color: var(--footer-accent);
}

.spice-footer-description {
    max-width: 340px;
    margin-bottom: 25px;
    color: var(--footer-text);
    font-size: 15px;
    line-height: 1.9;
}

/* SOCIAL ICONS */

.spice-footer-socials {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.spice-footer-socials a {
    width: 39px;
    height: 39px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--footer-border);
    border-radius: 50%;
    color: var(--footer-heading);
    font-size: 14px;
    transition: all 0.3s ease;
}

.spice-footer-socials a:hover {
    background: var(--footer-accent);
    border-color: var(--footer-accent);
    color: #263426;
    transform: translateY(-4px);
}

/* FOOTER COLUMNS */

.spice-footer-column h3 {
    margin: 7px 0 15px;
    color: var(--footer-heading);
    font-size: 17px;
    font-weight: 700;
}

.spice-footer-heading-line {
    display: block;
    width: 37px;
    height: 2px;
    margin-bottom: 23px;
    background: var(--footer-accent);
}

.spice-footer-column ul {
    display: flex;
    flex-direction: column;
    gap: 15px;
    padding: 0;
    margin: 0;
    list-style: none;
}

.spice-footer-column ul a {
    display: inline-block;
    color: var(--footer-text);
    font-size: 14px;
    line-height: 1.6;
    transition: color 0.3s ease, transform 0.3s ease;
}

.spice-footer-column ul a:hover {
    color: var(--footer-accent);
    transform: translateX(5px);
}

/* CONTACT */

.spice-footer-contact-intro {
    margin-bottom: 20px;
    color: var(--footer-text);
    font-size: 14px;
    line-height: 1.8;
}

.spice-footer-contact-item {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 15px;
    color: var(--footer-text);
    font-size: 14px;
    overflow-wrap: anywhere;
    transition: color 0.3s ease;
}

.spice-footer-contact-item:hover {
    color: var(--footer-accent);
}

.spice-footer-contact-icon {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border: 1px solid var(--footer-border);
    border-radius: 50%;
    color: var(--footer-accent);
}

.spice-footer-contact-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-top: 10px;
    padding: 13px 17px;
    border: 1px solid var(--footer-accent);
    border-radius: 3px;
    color: var(--footer-accent);
    font-size: 13px;
    font-weight: 700;
    transition: all 0.3s ease;
}

.spice-footer-contact-cta:hover {
    background: var(--footer-accent);
    color: #263426;
}

.spice-footer-contact-cta i {
    transition: transform 0.3s ease;
}

.spice-footer-contact-cta:hover i {
    transform: translateX(4px);
}

/* BOTTOM BAR */

.spice-footer-bottom {
    position: relative;
    z-index: 1;
    border-top: 1px solid var(--footer-border);
}

.spice-footer-bottom-inner {
    min-height: 78px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.spice-footer-bottom-inner p {
    margin: 0;
    color: var(--footer-text);
    font-size: 12px;
    line-height: 1.7;
}

.spice-footer-bottom-links {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    font-size: 12px;
}

.spice-footer-bottom-links a {
    color: var(--footer-text);
    transition: color 0.3s ease;
}

.spice-footer-bottom-links a:hover {
    color: var(--footer-accent);
}

.spice-footer-divider {
    color: var(--footer-accent);
}

.spice-footer-back-top {
    width: 39px;
    height: 39px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border: 1px solid var(--footer-border);
    border-radius: 50%;
    color: var(--footer-accent);
    transition: all 0.3s ease;
}

.spice-footer-back-top:hover {
    background: var(--footer-accent);
    color: #263426;
    transform: translateY(-3px);
}

/* TABLET */

@media (max-width: 1100px) {
    .spice-footer-container {
        width: calc(100% - 48px);
    }

    .spice-footer-top .spice-footer-container {
        grid-template-columns: 1.2fr 1fr;
        gap: 45px 55px;
    }

    .spice-footer-description {
        max-width: 400px;
    }
}

/* MOBILE */

@media (max-width: 600px) {
    .spice-footer-container {
        width: calc(100% - 36px);
    }

    .spice-footer-top {
        padding: 52px 0 42px;
    }

    .spice-footer-top .spice-footer-container {
        grid-template-columns: 1fr;
        gap: 35px;
    }

    .spice-footer-logo-text strong {
        font-size: 18px;
    }

    .spice-footer-description {
        max-width: 100%;
    }

    .spice-footer-column h3 {
        margin-top: 0;
    }

    .spice-footer-bottom-inner {
        min-height: auto;
        padding: 23px 0;
        display: grid;
        grid-template-columns: 1fr auto;
        gap: 16px;
    }

    .spice-footer-bottom-links {
        grid-column: 1;
        grid-row: 2;
        gap: 8px;
    }

    .spice-footer-back-top {
        grid-column: 2;
        grid-row: 1 / span 2;
        align-self: center;
    }
}

@media (prefers-reduced-motion: reduce) {
    .spice-footer *,
    .spice-footer *::before,
    .spice-footer *::after {
        transition-duration: 0.01ms !important;
    }
}


/* ========================================
   SPICE LUXE — EDITORIAL HERO
======================================== */

.spice-luxe-hero {
    --luxe-gold: #D5B77A;
    --luxe-cream: #F8F2E5;
    --luxe-green: #263528;

    position: relative;
    isolation: isolate;
    width: 100%;
    min-height: 720px;
    height: min(820px, calc(100svh - 88px));
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #1A241B;
    color: var(--luxe-cream);
    font-family: 'Quicksand', sans-serif;
}

.spice-luxe-background,
.spice-luxe-shade,
.spice-luxe-grain {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.spice-luxe-background {
    z-index: -3;
    overflow: hidden;
}

.spice-luxe-bg-image {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center 52%;
    animation: spiceLuxeBackgroundEnter 1.8s ease both,
               spiceLuxeSlowZoom 24s ease-in-out infinite alternate;
}

.spice-luxe-shade {
    z-index: -2;
    background:
        linear-gradient(
            90deg,
            rgba(15, 24, 16, 0.78) 0%,
            rgba(18, 27, 18, 0.66) 48%,
            rgba(15, 24, 16, 0.78) 100%
        ),
        linear-gradient(
            0deg,
            rgba(12, 19, 13, 0.60) 0%,
            transparent 25%,
            transparent 70%,
            rgba(12, 19, 13, 0.30) 100%
        );
}

.spice-luxe-grain {
    z-index: -1;
    opacity: 0.12;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.24'/%3E%3C/svg%3E");
}

/* FRAME */

.spice-luxe-frame {
    position: absolute;
    inset: 25px;
    border: 1px solid rgba(213, 183, 122, 0.42);
    pointer-events: none;
}

.spice-luxe-corner {
    position: absolute;
    width: 27px;
    height: 27px;
    border-color: var(--luxe-gold);
    border-style: solid;
}

.spice-luxe-corner-tl {
    top: -1px;
    left: -1px;
    border-width: 2px 0 0 2px;
}

.spice-luxe-corner-tr {
    top: -1px;
    right: -1px;
    border-width: 2px 2px 0 0;
}

.spice-luxe-corner-bl {
    bottom: -1px;
    left: -1px;
    border-width: 0 0 2px 2px;
}

.spice-luxe-corner-br {
    bottom: -1px;
    right: -1px;
    border-width: 0 2px 2px 0;
}

/* MAIN CONTENT */

.spice-luxe-content {
    position: relative;
    z-index: 2;
    width: min(100% - 80px, 1000px);
    margin: 0 auto;
    padding: 50px 0 75px;
    text-align: center;
}

.spice-luxe-overline {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 17px;
    margin-bottom: 30px;
    color: var(--luxe-gold);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 4px;
    line-height: 1.8;
}

.spice-luxe-line {
    display: inline-block;
    width: 43px;
    height: 1px;
    background: var(--luxe-gold);
}

.spice-luxe-emblem {
    width: 54px;
    height: 54px;
    margin: 0 auto 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(213, 183, 122, 0.65);
    border-radius: 50%;
    color: var(--luxe-gold);
    font-size: 21px;
}

.spice-luxe-title {
    max-width: 900px;
    margin: 0 auto;
    color: var(--luxe-cream);
    font-family: 'Quicksand', sans-serif;
    font-size: clamp(49px, 6.1vw, 83px);
    font-weight: 700;
    letter-spacing: -3px;
    line-height: 1.12;
}

.spice-luxe-title span {
    display: block;
    margin-top: 10px;
    color: var(--luxe-gold);
    font-weight: 500;
}

.spice-luxe-description {
    max-width: 580px;
    margin: 27px auto 0;
    color: rgba(248, 242, 229, 0.88);
    font-size: 15px;
    font-weight: 400;
    line-height: 2;
}

/* BUTTONS */

.spice-luxe-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 32px;
    margin-top: 36px;
}

.spice-luxe-button {
    min-height: 54px;
    padding: 0 23px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 17px;
    background: var(--luxe-gold);
    border: 1px solid var(--luxe-gold);
    color: var(--luxe-green);
    font-size: 13px;
    font-weight: 700;
    transition: background 0.3s ease,
                color 0.3s ease,
                transform 0.3s ease;
}

.spice-luxe-button i {
    transition: transform 0.3s ease;
}

.spice-luxe-button:hover {
    background: transparent;
    color: var(--luxe-cream);
    transform: translateY(-3px);
}

.spice-luxe-button:hover i {
    transform: translateX(5px);
}

.spice-luxe-text-link {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: var(--luxe-cream);
    font-size: 12px;
    font-weight: 600;
    transition: color 0.3s ease;
}

.spice-luxe-text-link span {
    color: var(--luxe-gold);
    transition: transform 0.3s ease;
}

.spice-luxe-text-link:hover {
    color: var(--luxe-gold);
}

.spice-luxe-text-link:hover span {
    transform: translate(3px, -3px);
}

/* SIGNATURE LINE */

.spice-luxe-signature {
    margin-top: 51px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 17px;
    color: rgba(248, 242, 229, 0.75);
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 2px;
}

.spice-luxe-signature-line {
    width: 35px;
    height: 1px;
    background: rgba(213, 183, 122, 0.65);
}

.spice-luxe-signature-star {
    color: var(--luxe-gold);
    font-size: 13px;
}

/* SIDE LABEL */

.spice-luxe-side-note {
    position: absolute;
    top: 50%;
    right: 45px;
    display: flex;
    align-items: center;
    gap: 15px;
    color: rgba(248, 242, 229, 0.72);
    font-size: 8px;
    font-weight: 600;
    letter-spacing: 2px;
    writing-mode: vertical-rl;
    transform: translateY(-50%);
}

.spice-luxe-side-line {
    width: 1px;
    height: 50px;
    background: var(--luxe-gold);
}

/* SCROLL INDICATOR */

.spice-luxe-scroll {
    position: absolute;
    left: 44px;
    bottom: 35px;
    display: flex;
    align-items: center;
    gap: 13px;
    color: rgba(248, 242, 229, 0.75);
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 2px;
}

.spice-luxe-scroll-track {
    width: 45px;
    height: 1px;
    overflow: hidden;
    background: rgba(248, 242, 229, 0.35);
}

.spice-luxe-scroll-track span {
    width: 50%;
    height: 1px;
    display: block;
    background: var(--luxe-gold);
    animation: spiceLuxeScrollLine 1.8s ease-in-out infinite;
}

.spice-luxe-bottom-label {
    position: absolute;
    right: 44px;
    bottom: 35px;
    color: rgba(248, 242, 229, 0.65);
    font-size: 8px;
    font-weight: 600;
    letter-spacing: 2px;
}

/* ENTRANCE ANIMATIONS */

.spice-luxe-reveal {
    opacity: 0;
    transform: translateY(25px);
    animation: spiceLuxeReveal 0.85s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.spice-luxe-overline {
    animation-delay: 0.15s;
}

.spice-luxe-emblem {
    animation-delay: 0.3s;
}

.spice-luxe-title {
    animation-delay: 0.45s;
}

.spice-luxe-description {
    animation-delay: 0.6s;
}

.spice-luxe-actions {
    animation-delay: 0.75s;
}

.spice-luxe-signature {
    animation-delay: 0.9s;
}

@keyframes spiceLuxeReveal {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes spiceLuxeBackgroundEnter {
    from {
        opacity: 0.3;
        transform: scale(1.08);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes spiceLuxeSlowZoom {
    from {
        transform: scale(1);
    }
    to {
        transform: scale(1.07);
    }
}

@keyframes spiceLuxeScrollLine {
    0% {
        transform: translateX(-100%);
    }
    100% {
        transform: translateX(200%);
    }
}

/* TABLET */

@media (max-width: 1024px) {
    .spice-luxe-hero {
        min-height: 680px;
        height: auto;
    }

    .spice-luxe-content {
        width: calc(100% - 100px);
        padding: 95px 0 100px;
    }

    .spice-luxe-title {
        font-size: clamp(45px, 6.5vw, 68px);
    }

    .spice-luxe-side-note {
        right: 25px;
    }

    .spice-luxe-scroll {
        left: 30px;
    }

    .spice-luxe-bottom-label {
        right: 30px;
    }
}

/* MOBILE */

@media (max-width: 767px) {
    .spice-luxe-hero {
        min-height: 690px;
        height: auto;
    }

    .spice-luxe-bg-image {
        object-position: center;
    }

    .spice-luxe-shade {
        background: rgba(16, 25, 17, 0.76);
    }

    .spice-luxe-frame {
        inset: 12px;
    }

    .spice-luxe-corner {
        width: 18px;
        height: 18px;
    }

    .spice-luxe-content {
        width: calc(100% - 46px);
        padding: 75px 0 95px;
    }

    .spice-luxe-overline {
        gap: 9px;
        margin-bottom: 25px;
        font-size: 8px;
        letter-spacing: 1.8px;
    }

    .spice-luxe-line {
        width: 22px;
    }

    .spice-luxe-emblem {
        width: 45px;
        height: 45px;
        margin-bottom: 22px;
        font-size: 18px;
    }

    .spice-luxe-title {
        font-size: clamp(37px, 9vw, 58px);
        letter-spacing: -1.6px;
        line-height: 1.18;
    }

    .spice-luxe-title span {
        margin-top: 7px;
    }

    .spice-luxe-description {
        margin-top: 23px;
        font-size: 14px;
        line-height: 1.9;
    }

    .spice-luxe-actions {
        flex-direction: column;
        gap: 23px;
        margin-top: 29px;
    }

    .spice-luxe-button {
        min-height: 51px;
        padding: 0 19px;
    }

    .spice-luxe-signature {
        flex-wrap: wrap;
        gap: 10px;
        margin-top: 38px;
        font-size: 8px;
        letter-spacing: 1px;
    }

    .spice-luxe-signature-line {
        width: 20px;
    }

    .spice-luxe-side-note {
        display: none;
    }

    .spice-luxe-scroll {
        left: 23px;
        bottom: 23px;
        gap: 8px;
        font-size: 7px;
    }

    .spice-luxe-bottom-label {
        right: 23px;
        bottom: 23px;
        max-width: 45%;
        font-size: 7px;
        line-height: 1.6;
        letter-spacing: 1px;
        text-align: right;
    }
}

@media (max-width: 380px) {
    .spice-luxe-content {
        width: calc(100% - 36px);
    }

    .spice-luxe-title {
        font-size: 34px;
    }

    .spice-luxe-overline {
        letter-spacing: 1px;
    }

    .spice-luxe-bottom-label {
        max-width: 42%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .spice-luxe-hero *,
    .spice-luxe-hero *::before,
    .spice-luxe-hero *::after {
        animation: none !important;
        opacity: 1;
        transform: none;
        transition: none !important;
    }
}


/* ==========================================
   SIGNATURE COLLECTION - NEW DESIGN
========================================== */

.spice-collection-v2,
.spice-collection-v2 * {
    box-sizing: border-box;
}

.spice-collection-v2 {
    --scv2-bg: var(--spice-bg);
    --scv2-card: var(--spice-surface);
    --scv2-text: var(--spice-text);
    --scv2-muted: var(--spice-muted);
    --scv2-accent: var(--spice-accent);
    --scv2-border: var(--spice-border);

    width: 100%;
    position: relative;
    overflow: clip;
    padding: 100px 0 38px;
    background: var(--scv2-bg);
    color: var(--scv2-text);
    font-family: "Quicksand", sans-serif;
}

.spice-collection-v2 img {
    display: block;
    width: 100%;
    max-width: 100%;
}

.spice-collection-v2 a {
    color: inherit;
    text-decoration: none;
}

.spice-collection-v2__container {
    width: min(100% - 80px, 1240px);
    margin-inline: auto;
}

/* INTRO */

.spice-collection-v2__intro {
    width: 100%;
    max-width: 760px;
    margin: 0 auto 54px;
    text-align: center;
}

.spice-collection-v2__eyebrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-bottom: 22px;
    color: var(--scv2-accent);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 3px;
    line-height: 1.5;
}

.spice-collection-v2__line {
    display: inline-block;
    width: 34px;
    height: 1px;
    background: var(--scv2-accent);
}

.spice-collection-v2__intro h2 {
    margin: 0 auto 20px;
    max-width: 760px;
    color: var(--scv2-text);
    font-family: "Quicksand", sans-serif;
    font-size: clamp(34px, 4.2vw, 56px);
    font-weight: 700;
    line-height: 1.16;
    letter-spacing: -1.5px;
    overflow-wrap: break-word;
}

.spice-collection-v2__intro h2 span {
    display: block;
    color: var(--scv2-accent);
}

.spice-collection-v2__intro p {
    width: 100%;
    max-width: 590px;
    margin: 0 auto;
    color: var(--scv2-muted);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.9;
}

.spice-collection-v2 a.spice-collection-v2__main-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    min-height: 48px;
    margin-top: 26px;
    padding: 12px 22px;
    border: 1px solid var(--scv2-text);
    color: var(--scv2-text);
    font-size: 14px;
    font-weight: 700;
    transition: background 0.3s ease, color 0.3s ease,
                border-color 0.3s ease;
}

.spice-collection-v2__main-link span {
    font-size: 19px;
    line-height: 1;
}

.spice-collection-v2__main-link:hover {
    background: var(--scv2-text);
    border-color: var(--scv2-text);
    color: var(--scv2-card);
}

/* GRID */

.spice-collection-v2__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: stretch;
    gap: 26px;
    width: 100%;
}

.spice-collection-v2__card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    height: 100%;
    background: var(--scv2-card);
    border: 1px solid var(--scv2-border);
    transition: border-color 0.35s ease,
                box-shadow 0.35s ease,
                transform 0.35s ease;
}

.spice-collection-v2__card:hover {
    transform: translateY(-5px);
    border-color: var(--scv2-accent);
    box-shadow: 0 16px 38px rgba(38, 34, 20, 0.08);
}

/* IMAGE */

.spice-collection-v2__image {
    display: block;
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: #e6dfd1;
}

.spice-collection-v2__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 0.65s cubic-bezier(0.2, 0.65, 0.3, 1);
}

.spice-collection-v2__card:hover
.spice-collection-v2__image img {
    transform: scale(1.055);
}

.spice-collection-v2__number {
    position: absolute;
    top: 16px;
    left: 16px;
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(255, 255, 255, 0.75);
    border-radius: 50%;
    background: rgba(35, 34, 26, 0.42);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    backdrop-filter: blur(6px);
}

.spice-collection-v2__image-arrow {
    position: absolute;
    right: 16px;
    bottom: 16px;
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: var(--scv2-card);
    color: var(--scv2-text);
    font-size: 21px;
    transition: background 0.3s ease, color 0.3s ease;
}

.spice-collection-v2__card:hover
.spice-collection-v2__image-arrow {
    background: var(--scv2-accent);
    color: var(--scv2-card);
}

/* CARD CONTENT */

.spice-collection-v2__details {
    display: flex;
    flex: 1;
    flex-direction: column;
    align-items: flex-start;
    padding: 27px 25px 26px;
    text-align: left;
}

.spice-collection-v2__category {
    display: block;
    margin-bottom: 12px;
    color: var(--scv2-accent);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.7px;
    line-height: 1.6;
}

.spice-collection-v2__details h3 {
    width: 100%;
    margin: 0 0 12px;
    color: var(--scv2-text);
    font-family: "Quicksand", sans-serif;
    font-size: clamp(22px, 2vw, 27px);
    font-weight: 700;
    line-height: 1.35;
    overflow-wrap: break-word;
}

.spice-collection-v2__details p {
    width: 100%;
    margin: 0 0 24px;
    color: var(--scv2-muted);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.8;
}

.spice-collection-v2 a.spice-collection-v2__text-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-top: auto;
    padding-top: 15px;
    border-top: 1px solid var(--scv2-border);
    width: 100%;
    color: var(--scv2-text);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.6;
    transition: color 0.3s ease;
}

.spice-collection-v2__text-link span {
    display: inline-block;
    font-size: 19px;
    transition: transform 0.3s ease;
}

.spice-collection-v2__text-link:hover {
    color: var(--scv2-accent);
}

.spice-collection-v2__text-link:hover span {
    transform: translateX(5px);
}

/* BOTTOM NOTE */

.spice-collection-v2__footer {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    width: 100%;
    margin-top: 55px;
    color: var(--scv2-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
    line-height: 1.8;
    text-align: center;
}

.spice-collection-v2__footer-line {
    width: 70px;
    height: 1px;
    flex: 0 0 70px;
    background: var(--scv2-accent);
}

/* ENTRANCE ANIMATIONS */

.spice-collection-v2 .reveal-left,
.spice-collection-v2 .reveal-up {
    transition: opacity 0.8s ease, transform 0.8s ease;
}

.spice-collection-v2.has-reveal-observer .reveal-left,
.spice-collection-v2.has-reveal-observer .reveal-up {
    opacity: 0;
}

.spice-collection-v2 .reveal-left {
    transform: none;
}

.spice-collection-v2 .reveal-up {
    transform: none;
}

.spice-collection-v2.has-reveal-observer .reveal-left {
    transform: translateX(-28px);
}

.spice-collection-v2.has-reveal-observer .reveal-up {
    transform: translateY(35px);
}

.spice-collection-v2.has-reveal-observer .reveal-left.is-visible,
.spice-collection-v2.has-reveal-observer .reveal-up.is-visible {
    opacity: 1;
    transform: translate(0, 0);
}

.spice-collection-v2__grid .spice-collection-v2__card:nth-child(2) {
    transition-delay: 0.12s;
}

.spice-collection-v2__grid .spice-collection-v2__card:nth-child(3) {
    transition-delay: 0.24s;
}

@media (prefers-reduced-motion: reduce) {
    .spice-collection-v2 *,
    .spice-collection-v2 *::before,
    .spice-collection-v2 *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }

    .spice-collection-v2 .reveal-left,
    .spice-collection-v2 .reveal-up {
        opacity: 1;
        transform: none;
    }

    .spice-collection-v2.has-reveal-observer .reveal-left,
    .spice-collection-v2.has-reveal-observer .reveal-up {
        opacity: 1;
    }
}


/* ==========================================
   FARM TO FLAVOUR - PREMIUM STORY SECTION
========================================== */

.spice-journey,
.spice-journey * {
    box-sizing: border-box;
}

.spice-journey {
    --sj-bg: #eee8dc;
    --sj-text: #292c22;
    --sj-muted: #68695d;
    --sj-accent: #9c8050;
    --sj-border: rgba(54, 53, 39, 0.18);

    position: relative;
    width: 100%;
    overflow: clip;
    padding: 105px 0 32px;
    background: var(--sj-bg);
    color: var(--sj-text);
    font-family: "Quicksand", sans-serif;
}

.spice-journey__container {
    display: grid;
    grid-template-columns: minmax(0, 1.02fr) minmax(0, 0.98fr);
    align-items: center;
    gap: clamp(40px, 7vw, 95px);
    width: min(100% - 80px, 1240px);
    margin-inline: auto;
}

/* IMAGE PANEL */

.spice-journey__visual {
    position: relative;
    min-width: 0;
    min-height: 600px;
    background: #d9d0bf;
}

.spice-journey__visual > img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 0.8s ease;
}

.spice-journey__visual:hover > img {
    transform: scale(1.035);
}

.spice-journey__image-caption {
    position: absolute;
    right: 22px;
    bottom: 22px;
    left: 22px;
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 21px;
    background: rgba(248, 245, 237, 0.95);
    color: #292c22;
}

.spice-journey__caption-mark {
    display: grid;
    flex: 0 0 43px;
    width: 43px;
    height: 43px;
    place-items: center;
    border: 1px solid rgba(156, 128, 80, 0.55);
    border-radius: 50%;
    color: #9c8050;
    font-size: 24px;
}

.spice-journey__image-caption > div {
    min-width: 0;
}

.spice-journey__image-caption > div > span {
    display: block;
    margin-bottom: 5px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.spice-journey__image-caption p {
    margin: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.6;
}

.spice-journey__image-index {
    position: absolute;
    top: 20px;
    left: 20px;
    padding: 10px 13px;
    background: rgba(30, 31, 24, 0.68);
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.7px;
}

/* TEXT CONTENT */

.spice-journey__content {
    min-width: 0;
    width: 100%;
}

.spice-journey__eyebrow {
    display: inline-block;
    margin-bottom: 22px;
    color: var(--sj-accent);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2.4px;
    line-height: 1.7;
}

.spice-journey__content h2 {
    max-width: 550px;
    margin: 0 0 22px;
    color: var(--sj-text);
    font-family: "Quicksand", sans-serif;
    font-size: clamp(36px, 4vw, 54px);
    font-weight: 700;
    line-height: 1.17;
    letter-spacing: -1.2px;
    overflow-wrap: break-word;
}

.spice-journey__content h2 em {
    display: block;
    color: var(--sj-accent);
    font-style: normal;
}

.spice-journey__description {
    max-width: 520px;
    margin: 0 0 30px;
    color: var(--sj-muted);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.9;
}

/* PROCESS STEPS */

.spice-journey__steps {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin: 0 0 28px;
    border-top: 1px solid var(--sj-border);
}

.spice-journey__step {
    display: grid;
    grid-template-columns: 43px minmax(0, 1fr);
    align-items: start;
    gap: 17px;
    padding: 21px 0;
    border-bottom: 1px solid var(--sj-border);
}

.spice-journey__step-number {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border: 1px solid var(--sj-border);
    border-radius: 50%;
    color: var(--sj-accent);
    font-size: 12px;
    font-weight: 700;
}

.spice-journey__step > div {
    min-width: 0;
}

.spice-journey__step h3 {
    margin: 2px 0 7px;
    color: var(--sj-text);
    font-family: "Quicksand", sans-serif;
    font-size: 19px;
    font-weight: 700;
    line-height: 1.4;
}

.spice-journey__step p {
    margin: 0;
    color: var(--sj-muted);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.75;
}

/* BUTTON */

.spice-journey__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 22px;
    min-height: 50px;
    padding: 13px 23px;
    background: var(--sj-text);
    border: 1px solid var(--sj-text);
    color: #fff !important;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.5;
    transition: background 0.3s ease, color 0.3s ease;
}

.spice-journey__button span {
    font-size: 19px;
    line-height: 1;
}

.spice-journey__button:hover {
    background: transparent;
    color: var(--sj-text) !important;
}

/* BOTTOM LABEL */

.spice-journey__bottom-mark {
    width: min(100% - 80px, 1240px);
    margin: 65px auto 0;
    padding-top: 22px;
    border-top: 1px solid var(--sj-border);
    color: var(--sj-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2.5px;
    line-height: 1.8;
    text-align: center;
}

/* ENTRANCE ANIMATION */

.spice-journey .journey-reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.85s ease, transform 0.85s ease;
}

.spice-journey .journey-reveal.journey-visible {
    opacity: 1;
    transform: translateY(0);
}

.spice-journey__content.journey-reveal {
    transition-delay: 0.15s;
}

/* TABLET */

@media (max-width: 992px) {
    .spice-journey {
        padding-top: 80px;
    }

    .spice-journey__container {
        grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
        gap: 32px;
        width: calc(100% - 48px);
    }

    .spice-journey__visual {
        min-height: 560px;
    }

    .spice-journey__content h2 {
        font-size: clamp(32px, 4.2vw, 43px);
        letter-spacing: -0.6px;
    }

    .spice-journey__image-caption {
        right: 14px;
        bottom: 14px;
        left: 14px;
        gap: 10px;
        padding: 15px;
    }

    .spice-journey__caption-mark {
        flex-basis: 36px;
        width: 36px;
        height: 36px;
    }

    .spice-journey__step {
        gap: 12px;
    }

    .spice-journey__bottom-mark {
        width: calc(100% - 48px);
    }
}

/* MOBILE / SMALL TABLET */

@media (max-width: 768px) {
    .spice-journey {
        padding: 65px 0 25px;
    }

    .spice-journey__container {
        grid-template-columns: minmax(0, 1fr);
        gap: 36px;
        width: calc(100% - 36px);
    }

    .spice-journey__visual {
        min-height: 0;
        aspect-ratio: 4 / 4.2;
    }

    .spice-journey__content h2 {
        max-width: 600px;
        font-size: clamp(34px, 7vw, 46px);
        line-height: 1.2;
    }

    .spice-journey__description {
        max-width: 100%;
        font-size: 16px;
    }

    .spice-journey__step h3 {
        font-size: 18px;
    }

    .spice-journey__step p {
        font-size: 16px;
    }

    .spice-journey__bottom-mark {
        width: calc(100% - 36px);
        margin-top: 42px;
    }
}

/* SMALL MOBILE */

@media (max-width: 480px) {
    .spice-journey {
        padding-top: 50px;
    }

    .spice-journey__container {
        width: calc(100% - 28px);
        gap: 30px;
    }

    .spice-journey__visual {
        aspect-ratio: 4 / 4.5;
    }

    .spice-journey__image-caption {
        right: 10px;
        bottom: 10px;
        left: 10px;
        padding: 13px;
    }

    .spice-journey__image-caption > div > span {
        font-size: 10px;
        letter-spacing: 1px;
    }

    .spice-journey__image-caption p {
        font-size: 13px;
    }

    .spice-journey__image-index {
        top: 12px;
        left: 12px;
        font-size: 9px;
    }

    .spice-journey__eyebrow {
        font-size: 10px;
        letter-spacing: 1.7px;
    }

    .spice-journey__content h2 {
        font-size: 34px;
    }

    .spice-journey__step {
        grid-template-columns: 36px minmax(0, 1fr);
        gap: 12px;
        padding: 18px 0;
    }

    .spice-journey__step-number {
        width: 34px;
        height: 34px;
    }

    .spice-journey__step h3 {
        font-size: 17px;
    }

    .spice-journey__button {
        width: 100%;
    }

    .spice-journey__bottom-mark {
        width: calc(100% - 28px);
        font-size: 9px;
        letter-spacing: 1.5px;
    }
}

/* ACCESSIBILITY */

@media (prefers-reduced-motion: reduce) {
    .spice-journey *,
    .spice-journey *::before,
    .spice-journey *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
    }

    .spice-journey .journey-reveal {
        opacity: 1;
        transform: none;
    }
}


/* =====================================
   PREMIUM SPICE EXPERIENCE
===================================== */

.spice-experience {
    --se-bg: var(--spice-bg);
    --se-card: var(--spice-surface);
    --se-text: var(--spice-text);
    --se-muted: var(--spice-muted);
    --se-accent: var(--spice-accent);
    --se-border: var(--spice-border);

    position: relative;
    width: 100%;
    padding: 100px 24px 75px;
    overflow: hidden;
    background: var(--se-bg);
    color: var(--se-text);
    font-family: "Quicksand", sans-serif;
}

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

.spice-experience__container {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

.spice-experience__header {
    max-width: 740px;
    margin: 0 auto 58px;
    text-align: center;
}

.spice-experience__tag {
    display: inline-block;
    margin-bottom: 18px;
    color: var(--se-accent);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 3px;
}

.spice-experience__header h2 {
    margin: 0 0 18px;
    color: var(--se-text);
    font-size: clamp(32px, 4vw, 52px);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -1.2px;
}

.spice-experience__header h2 span {
    color: var(--se-accent);
}

.spice-experience__header p {
    max-width: 620px;
    margin: 0 auto;
    color: var(--se-muted);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.9;
}

.spice-experience__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.spice-experience__card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 300px;
    padding: 30px 24px 27px;
    overflow: hidden;
    background: var(--se-card);
    border: 1px solid var(--se-border);
    border-radius: 3px;
    transition:
        transform 0.35s ease,
        border-color 0.35s ease,
        box-shadow 0.35s ease;
}

.spice-experience__card:hover {
    transform: translateY(-7px);
    border-color: var(--se-accent);
    box-shadow: 0 18px 38px rgba(43, 37, 22, 0.08);
}

.spice-experience__number {
    position: absolute;
    top: 20px;
    right: 22px;
    color: var(--se-accent);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
}

.spice-experience__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    margin-bottom: 30px;
    color: var(--se-accent);
    background: var(--se-card);
    border: 1px solid var(--se-border);
    border-radius: 50%;
    font-size: 22px;
    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease;
}

.spice-experience__card:hover .spice-experience__icon {
    color: var(--se-card);
    background: var(--se-accent);
    transform: rotate(-7deg);
}

.spice-experience__card h3 {
    margin: 0 0 13px;
    color: var(--se-text);
    font-size: 19px;
    font-weight: 700;
    line-height: 1.45;
}

.spice-experience__card p {
    margin: 0 0 24px;
    color: var(--se-muted);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.85;
}

.spice-experience__line {
    display: block;
    width: 42px;
    height: 2px;
    margin-top: auto;
    background: var(--se-accent);
    transition: width 0.35s ease;
}

.spice-experience__card:hover .spice-experience__line {
    width: 75px;
}

.spice-experience__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    margin-top: 35px;
    padding-top: 26px;
    border-top: 1px solid var(--se-border);
}

.spice-experience__footer > span {
    color: var(--se-muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
}

.spice-experience__link {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: var(--se-text);
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
    transition: color 0.3s ease;
}

.spice-experience__link i {
    color: var(--se-accent);
    transition: transform 0.3s ease;
}

.spice-experience__link:hover {
    color: var(--se-accent);
}

.spice-experience__link:hover i {
    transform: translateX(5px);
}

/* Entrance animation */

.spice-experience .spice-reveal {
    opacity: 0;
    transform: translateY(28px);
    transition:
        opacity 0.7s ease,
        transform 0.7s ease;
}

.spice-experience .spice-reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.spice-experience__grid .spice-experience__card:nth-child(2) {
    transition-delay: 0.1s;
}

.spice-experience__grid .spice-experience__card:nth-child(3) {
    transition-delay: 0.2s;
}

.spice-experience__grid .spice-experience__card:nth-child(4) {
    transition-delay: 0.3s;
}

/* Tablet */

@media (max-width: 992px) {
    .spice-experience {
        padding: 80px 22px 60px;
    }

    .spice-experience__card {
        min-height: 275px;
    }
}

@media (max-width: 900px) {
    .spice-experience__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px;
    }
}

/* Mobile */

@media (max-width: 768px) {
    .spice-experience {
        padding: 65px 20px 50px;
    }

    .spice-experience__header {
        margin-bottom: 38px;
    }

    .spice-experience__header h2 {
        font-size: 36px;
    }

    .spice-experience__footer {
        align-items: flex-start;
        flex-direction: column;
        gap: 18px;
    }
}

@media (max-width: 480px) {
    .spice-experience {
        padding: 52px 16px 40px;
    }

    .spice-experience__tag {
        font-size: 10px;
        letter-spacing: 2px;
    }

    .spice-experience__header h2 {
        font-size: 30px;
        letter-spacing: -0.5px;
    }

    .spice-experience__header p,
    .spice-experience__card p {
        font-size: 16px;
    }

    .spice-experience__grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .spice-experience__card {
        min-height: 250px;
        padding: 26px 22px;
    }

    .spice-experience__icon {
        margin-bottom: 24px;
    }

    .spice-experience__footer > span {
        font-size: 10px;
        letter-spacing: 1.5px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .spice-experience *,
    .spice-experience *::before,
    .spice-experience *::after {
        animation: none !important;
        transition: none !important;
    }

    .spice-experience .spice-reveal {
        opacity: 1;
        transform: none;
    }
}


/* ==========================================
   HERITAGE SIGNATURE SPICE BLENDS
========================================== */

.heritage-blends {
    --hb-bg: var(--spice-bg);
    --hb-paper: var(--spice-surface);
    --hb-text: var(--spice-text);
    --hb-muted: var(--spice-muted);
    --hb-gold: var(--spice-accent);
    --hb-border: var(--spice-border);

    position: relative;
    width: 100%;
    padding: 85px 24px 35px;
    overflow: hidden;
    background: var(--hb-bg);
    color: var(--hb-text);
    font-family: "Quicksand", sans-serif;
}

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

.heritage-blends__container {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

.heritage-blends__top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    padding-bottom: 20px;
    margin-bottom: 35px;
    border-bottom: 1px solid var(--hb-border);
}

.heritage-blends__eyebrow,
.heritage-blends__edition {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2.2px;
}

.heritage-blends__eyebrow {
    color: var(--hb-gold);
}

.heritage-blends__edition {
    color: var(--hb-muted);
    text-align: right;
}

.heritage-blends__main {
    display: grid;
    grid-template-columns: minmax(0, 1.04fr) minmax(0, 0.96fr);
    align-items: stretch;
    gap: 75px;
}

/* Image composition */

.heritage-blends__visual {
    position: relative;
    min-width: 0;
    min-height: 570px;
    overflow: hidden;
    background: var(--hb-paper);
}

.heritage-blends__visual::after {
    position: absolute;
    inset: 45% 0 0;
    content: "";
    pointer-events: none;
    background: linear-gradient(
        to bottom,
        transparent,
        rgba(26, 21, 15, 0.8)
    );
}

.heritage-blends__visual > img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 570px;
    object-fit: cover;
    object-position: center;
    transition: transform 1.2s ease;
}

.heritage-blends__visual:hover > img {
    transform: scale(1.045);
}

.heritage-blends__image-label {
    position: absolute;
    z-index: 2;
    right: 30px;
    bottom: 32px;
    left: 30px;
    display: flex;
    flex-direction: column;
    gap: 9px;
    color: #fffaf0;
}

.heritage-blends__image-label span {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2.5px;
}

.heritage-blends__image-label strong {
    font-size: clamp(23px, 2.6vw, 34px);
    font-weight: 700;
    line-height: 1.3;
}

.heritage-blends__seal {
    position: absolute;
    z-index: 3;
    top: 22px;
    right: 22px;
    display: flex;
    width: 88px;
    height: 88px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    color: #fff8e9;
    background: rgba(45, 39, 27, 0.78);
    border: 1px solid rgba(224, 202, 150, 0.8);
    border-radius: 50%;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.heritage-blends__seal-star {
    color: #d3b77b;
    font-size: 21px;
}

/* Content */

.heritage-blends__content {
    display: flex;
    min-width: 0;
    flex-direction: column;
    justify-content: center;
    padding: 20px 0;
}

.heritage-blends__number {
    margin-bottom: 24px;
    color: var(--hb-gold);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2.5px;
}

.heritage-blends__content h2 {
    margin: 0;
    color: var(--hb-text);
    font-size: clamp(35px, 4vw, 53px);
    font-weight: 700;
    line-height: 1.18;
    letter-spacing: -1.5px;
}

.heritage-blends__content h2 em {
    display: block;
    margin-top: 8px;
    color: var(--hb-gold);
    font-weight: 500;
    font-style: italic;
}

.heritage-blends__divider {
    display: flex;
    align-items: center;
    gap: 13px;
    width: 145px;
    margin: 27px 0;
    color: var(--hb-gold);
}

.heritage-blends__divider span {
    height: 1px;
    flex: 1;
    background: var(--hb-border);
}

.heritage-blends__divider i {
    font-size: 16px;
    font-style: normal;
}

.heritage-blends__description {
    margin: 0 0 28px;
    color: var(--hb-muted);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.95;
}

.heritage-blends__notes {
    display: flex;
    flex-direction: column;
    margin-bottom: 28px;
    border-top: 1px solid var(--hb-border);
}

.heritage-blends__notes > div {
    padding: 17px 0;
    border-bottom: 1px solid var(--hb-border);
}

.heritage-blends__note-label {
    display: block;
    margin-bottom: 7px;
    color: var(--hb-gold);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
}

.heritage-blends__notes p {
    margin: 0;
    color: var(--hb-text);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.7;
}

.heritage-blends__button {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    align-self: flex-start;
    min-height: 54px;
    padding: 0 21px;
    color: var(--spice-surface);
    background: var(--spice-primary);
    border: 1px solid var(--spice-primary);
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    transition:
        color 0.3s ease,
        background 0.3s ease,
        border-color 0.3s ease;
}

.heritage-blends__button span {
    color: var(--spice-surface);
    font-size: 19px;
    transition: transform 0.3s ease;
}

.heritage-blends__button:hover {
    color: var(--hb-text);
    background: transparent;
    border-color: var(--hb-gold);
}

.heritage-blends__button:hover span {
    transform: translate(3px, -3px);
}

.heritage-blends__footnote {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 20px;
    margin-top: 27px;
    color: var(--hb-muted);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

/* Bottom heritage strip */

.heritage-blends__bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-top: 60px;
    padding-top: 22px;
    border-top: 1px solid var(--hb-border);
}

.heritage-blends__bottom > span {
    color: var(--hb-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.6px;
}

.heritage-blends__bottom .heritage-blends__bottom-symbol {
    color: var(--hb-gold);
    font-size: 19px;
}

/* Reveal animation */

.heritage-blends .hb-reveal {
    opacity: 0;
    transform: translateY(24px);
    transition:
        opacity 0.8s ease,
        transform 0.8s ease;
}

.heritage-blends .hb-reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* Tablet */

@media (max-width: 992px) {
    .heritage-blends {
        padding: 70px 22px 30px;
    }

    .heritage-blends__main {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 35px;
    }

    .heritage-blends__visual,
    .heritage-blends__visual > img {
        min-height: 520px;
    }

    .heritage-blends__content h2 {
        font-size: 37px;
        letter-spacing: -0.8px;
    }

    .heritage-blends__bottom {
        margin-top: 42px;
    }
}

/* Mobile */

@media (max-width: 768px) {
    .heritage-blends {
        padding: 55px 20px 25px;
    }

    .heritage-blends__top {
        align-items: flex-start;
        flex-direction: column;
        gap: 10px;
        margin-bottom: 25px;
    }

    .heritage-blends__edition {
        text-align: left;
    }

    .heritage-blends__main {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .heritage-blends__visual,
    .heritage-blends__visual > img {
        min-height: 440px;
    }

    .heritage-blends__content {
        padding: 10px 0;
    }

    .heritage-blends__content h2 {
        font-size: clamp(34px, 7vw, 45px);
    }

    .heritage-blends__bottom {
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
        margin-top: 35px;
    }
}

@media (max-width: 480px) {
    .heritage-blends {
        padding: 45px 16px 22px;
    }

    .heritage-blends__eyebrow,
    .heritage-blends__edition {
        font-size: 10px;
        letter-spacing: 1.6px;
    }

    .heritage-blends__visual,
    .heritage-blends__visual > img {
        min-height: 360px;
    }

    .heritage-blends__seal {
        top: 15px;
        right: 15px;
        width: 73px;
        height: 73px;
    }

    .heritage-blends__image-label {
        right: 20px;
        bottom: 22px;
        left: 20px;
    }

    .heritage-blends__content h2 {
        font-size: 32px;
    }

    .heritage-blends__description,
    .heritage-blends__notes p {
        font-size: 16px;
    }

    .heritage-blends__footnote {
        gap: 12px;
        font-size: 9px;
    }

    .heritage-blends__bottom > span {
        font-size: 9px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .heritage-blends *,
    .heritage-blends *::before,
    .heritage-blends *::after {
        animation: none !important;
        transition: none !important;
    }

    .heritage-blends .hb-reveal {
        opacity: 1;
        transform: none;
    }
}


/* ==========================================
   SPICE RITUALS - HERITAGE EDITORIAL
   Image on RIGHT / Content on LEFT
========================================== */

.spice-rituals {
    --sr-bg: var(--spice-bg);
    --sr-text: var(--spice-text);
    --sr-muted: var(--spice-muted);
    --sr-accent: var(--spice-accent);
    --sr-border: var(--spice-border);
    --sr-panel: var(--spice-surface);

    position: relative;
    width: 100%;
    padding: 85px 24px 30px;
    overflow: hidden;
    background: var(--sr-bg);
    color: var(--sr-text);
    font-family: "Quicksand", sans-serif;
}

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

.spice-rituals__container {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

/* Top editorial line */

.spice-rituals__intro {
    display: flex;
    align-items: center;
    gap: 18px;
    margin-bottom: 38px;
}

.spice-rituals__eyebrow,
.spice-rituals__intro-text {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
}

.spice-rituals__eyebrow {
    color: var(--sr-accent);
}

.spice-rituals__intro-line {
    width: 65px;
    height: 1px;
    background: var(--sr-border);
}

.spice-rituals__intro-text {
    color: var(--sr-muted);
}

/* Main split layout */

.spice-rituals__layout {
    display: grid;
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
    align-items: center;
    gap: 75px;
}

/* Left content */

.spice-rituals__content {
    position: relative;
    z-index: 2;
    padding: 25px 0;
}

.spice-rituals__index {
    display: block;
    margin-bottom: 25px;
    color: var(--sr-accent);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
}

.spice-rituals__content h2 {
    margin: 0 0 24px;
    color: var(--sr-text);
    font-size: clamp(38px, 4.1vw, 56px);
    font-weight: 700;
    line-height: 1.16;
    letter-spacing: -1.5px;
}

.spice-rituals__content h2 span {
    display: block;
    margin-top: 7px;
    color: var(--sr-accent);
    font-weight: 500;
    font-style: italic;
}

.spice-rituals__description {
    max-width: 490px;
    margin: 0 0 25px;
    color: var(--sr-muted);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.95;
}

/* Quote */

.spice-rituals__quote {
    position: relative;
    margin: 0 0 27px;
    padding: 20px 0 20px 22px;
    color: var(--sr-text);
    border-left: 2px solid var(--sr-accent);
    font-size: 17px;
    font-weight: 500;
    font-style: italic;
    line-height: 1.8;
}

.spice-rituals__quote-mark {
    display: block;
    height: 27px;
    color: var(--sr-accent);
    font-size: 42px;
    font-weight: 700;
    font-style: normal;
    line-height: 1;
}

/* Signature */

.spice-rituals__signature {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 28px;
}

.spice-rituals__signature-icon {
    display: flex;
    width: 45px;
    height: 45px;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: var(--sr-accent);
    background: var(--sr-panel);
    border: 1px solid var(--sr-border);
    border-radius: 50%;
    font-size: 22px;
}

.spice-rituals__signature strong,
.spice-rituals__signature div > span {
    display: block;
}

.spice-rituals__signature strong {
    margin-bottom: 5px;
    color: var(--sr-text);
    font-size: 14px;
    font-weight: 700;
}

.spice-rituals__signature div > span {
    color: var(--sr-muted);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.7px;
}

/* CTA */

.spice-rituals__button {
    display: inline-flex;
    min-height: 54px;
    align-items: center;
    justify-content: space-between;
    gap: 35px;
    padding: 0 21px;
    color: var(--spice-surface);
    background: var(--spice-primary);
    border: 1px solid var(--spice-primary);
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    transition:
        color 0.3s ease,
        background 0.3s ease,
        border-color 0.3s ease;
}

.spice-rituals__button span {
    color: var(--spice-surface);
    font-size: 19px;
    transition: transform 0.3s ease;
}

.spice-rituals__button:hover {
    color: var(--sr-text);
    background: transparent;
    border-color: var(--sr-accent);
}

.spice-rituals__button:hover span {
    transform: translate(3px, -3px);
}

/* Right image composition */

.spice-rituals__visual {
    position: relative;
    min-width: 0;
    padding: 0 24px 28px 0;
}

.spice-rituals__image-frame {
    position: relative;
    height: 570px;
    overflow: hidden;
    background: var(--sr-panel);
}

.spice-rituals__image-frame::after {
    position: absolute;
    inset: 55% 0 0;
    content: "";
    pointer-events: none;
    background: linear-gradient(
        to bottom,
        transparent,
        rgba(24, 19, 12, 0.42)
    );
}

.spice-rituals__image-frame img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 1s ease;
}

.spice-rituals__visual:hover .spice-rituals__image-frame img {
    transform: scale(1.04);
}

.spice-rituals__image-caption {
    position: absolute;
    z-index: 2;
    right: 44px;
    bottom: 49px;
    left: 22px;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 15px;
    color: #fffaf0;
}

.spice-rituals__image-caption span {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.spice-rituals__image-caption span:last-child {
    text-align: right;
}

.spice-rituals__visual::before {
    position: absolute;
    z-index: 0;
    right: 0;
    bottom: 0;
    width: 75%;
    height: 70%;
    content: "";
    border-right: 1px solid var(--sr-accent);
    border-bottom: 1px solid var(--sr-accent);
    pointer-events: none;
}

.spice-rituals__vertical-label {
    position: absolute;
    top: 0;
    right: 0;
    color: var(--sr-accent);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 2px;
    writing-mode: vertical-rl;
    transform: translateX(13px);
}

/* Bottom strip */

.spice-rituals__bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-top: 55px;
    padding-top: 22px;
    border-top: 1px solid var(--sr-border);
}

.spice-rituals__bottom > span {
    color: var(--sr-muted);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.6px;
}

.spice-rituals__bottom .spice-rituals__ornament {
    color: var(--sr-accent);
    font-size: 19px;
}

/* Entrance animation */

.spice-rituals .sr-reveal {
    opacity: 0;
    transform: translateY(25px);
    transition:
        opacity 0.8s ease,
        transform 0.8s ease;
}

.spice-rituals .sr-reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.spice-rituals__visual.sr-reveal {
    transition-delay: 0.15s;
}

/* Tablet */

@media (max-width: 992px) {
    .spice-rituals {
        padding: 70px 22px 25px;
    }

    .spice-rituals__layout {
        gap: 35px;
    }

    .spice-rituals__content h2 {
        font-size: 38px;
        letter-spacing: -0.7px;
    }

    .spice-rituals__image-frame {
        height: 500px;
    }

    .spice-rituals__image-caption {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

    .spice-rituals__image-caption span:last-child {
        text-align: left;
    }
}

/* Mobile */

@media (max-width: 768px) {
    .spice-rituals {
        padding: 55px 20px 25px;
    }

    .spice-rituals__intro {
        flex-wrap: wrap;
        gap: 12px;
        margin-bottom: 28px;
    }

    .spice-rituals__layout {
        grid-template-columns: 1fr;
        gap: 35px;
    }

    .spice-rituals__content {
        padding: 0;
    }

    .spice-rituals__content h2 {
        font-size: clamp(36px, 7vw, 46px);
    }

    .spice-rituals__visual {
        padding: 0 16px 18px 0;
    }

    .spice-rituals__image-frame {
        height: 440px;
    }

    .spice-rituals__image-caption {
        right: 30px;
        bottom: 36px;
        left: 17px;
    }

    .spice-rituals__vertical-label {
        transform: translateX(9px);
        font-size: 8px;
    }

    .spice-rituals__bottom {
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
        margin-top: 35px;
    }
}

@media (max-width: 480px) {
    .spice-rituals {
        padding: 45px 16px 20px;
    }

    .spice-rituals__eyebrow,
    .spice-rituals__intro-text {
        font-size: 9px;
        letter-spacing: 1.3px;
    }

    .spice-rituals__content h2 {
        font-size: 33px;
    }

    .spice-rituals__description {
        font-size: 16px;
    }

    .spice-rituals__quote {
        padding-left: 16px;
        font-size: 16px;
    }

    .spice-rituals__image-frame {
        height: 360px;
    }

    .spice-rituals__image-caption span {
        font-size: 8px;
        letter-spacing: 1px;
    }

    .spice-rituals__bottom > span {
        font-size: 8px;
        letter-spacing: 1.2px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .spice-rituals *,
    .spice-rituals *::before,
    .spice-rituals *::after {
        animation: none !important;
        transition: none !important;
    }

    .spice-rituals .sr-reveal {
        opacity: 1;
        transform: none;
    }
}

/* Consistent typography for the page's main section headings. */
.spice-collection-v2__intro h2,
.spice-journey__content h2,
.spice-experience__header h2,
.heritage-blends__content h2,
.spice-rituals__content h2 {
    font-family: "Quicksand", sans-serif;
    font-size: clamp(32px, 4vw, 56px);
    font-weight: 700;
    line-height: 1.18;
    letter-spacing: -1px;
}

.spice-collection-v2__intro h2 span,
.spice-journey__content h2 em,
.spice-experience__header h2 span,
.heritage-blends__content h2 em,
.spice-rituals__content h2 span {
    display: block;
    margin-top: 0;
    font-weight: 600;
    font-style: normal;
}


/* ======================================
   SPICE ORIGIN — EDITORIAL GALLERY
====================================== */

.spice-origin {
    --so-bg: #F8F5EF;
    --so-text: #29251F;
    --so-muted: #777064;
    --so-accent: #A58B6C;
    --so-line: rgba(91, 73, 51, 0.22);

    padding: 100px 6% 35px;
    background: var(--so-bg);
    color: var(--so-text);
    overflow: hidden;
}

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

.spice-origin__container {
    max-width: 1360px;
    width: 100%;
    margin: 0 auto;
}

/* HEADER */

.spice-origin__header {
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    align-items: end;
    gap: 50px;
    margin-bottom: 55px;
    animation: soFadeUp 0.8s ease both;
}

.spice-origin__tag {
    display: inline-block;
    margin-bottom: 22px;
    color: var(--so-accent);
    font-family: "Quicksand", sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2.5px;
    line-height: 1.6;
}

.spice-origin__header h2 {
    max-width: 760px;
    margin: 0;
    color: var(--so-text);
    font-family: "Quicksand", sans-serif;
    font-size: clamp(34px, 4.2vw, 56px);
    font-weight: 700;
    line-height: 1.16;
    letter-spacing: -1.5px;
    overflow-wrap: break-word;
}

.spice-origin__header h2 span {
    display: block;
    color: var(--so-accent);
    font: inherit;
}

.spice-origin__intro {
    max-width: 410px;
    margin: 0 0 7px auto;
    color: var(--so-muted);
    font-family: "Quicksand", sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.9;
}

/* ASYMMETRIC GALLERY */

.spice-origin__gallery {
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    align-items: stretch;
    gap: 24px;
}

.spice-origin__main-image {
    position: relative;
    min-width: 0;
    min-height: 600px;
    overflow: hidden;
    background: #E3D6C4;
    animation: soImageIn 1s ease 0.15s both;
}

.spice-origin__main-image img,
.spice-origin__side-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.9s ease;
}

.spice-origin__main-image:hover img,
.spice-origin__side-image:hover img {
    transform: scale(1.045);
}

.spice-origin__main-image::after {
    position: absolute;
    inset: 40% 0 0;
    content: "";
    background: linear-gradient(
        to bottom,
        transparent,
        rgba(24, 19, 13, 0.72)
    );
    pointer-events: none;
}

.spice-origin__image-overlay {
    position: absolute;
    z-index: 1;
    right: 35px;
    bottom: 35px;
    left: 35px;
    color: #fff;
}

.spice-origin__image-overlay span {
    display: block;
    margin-bottom: 12px;
    color: #E7C7A9;
    font-family: "Quicksand", sans-serif;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
}

.spice-origin__image-overlay h3 {
    max-width: 400px;
    margin: 0;
    font-family: "Quicksand", sans-serif;
    font-size: clamp(23px, 2.5vw, 34px);
    font-weight: 700;
    line-height: 1.35;
}

/* RIGHT COLUMN */

.spice-origin__side {
    display: flex;
    min-width: 0;
    flex-direction: column;
    animation: soFadeUp 0.9s ease 0.3s both;
}

.spice-origin__side-image {
    height: 285px;
    min-height: 0;
    overflow: hidden;
    background: #E3D6C4;
}

.spice-origin__story {
    display: flex;
    flex: 1;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding: 34px 30px;
    border: 1px solid var(--so-line);
    border-top: 0;
}

.spice-origin__story-number {
    margin-bottom: 17px;
    color: var(--so-accent);
    font-family: "Quicksand", sans-serif;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
}

.spice-origin__story h3 {
    max-width: 390px;
    margin: 0 0 16px;
    color: var(--so-text);
    font-family: "Quicksand", sans-serif;
    font-size: clamp(21px, 2vw, 27px);
    font-weight: 700;
    line-height: 1.45;
}

.spice-origin__story p {
    max-width: 430px;
    margin: 0;
    color: var(--so-muted);
    font-family: "Quicksand", sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.9;
}

.spice-origin__link {
    display: inline-flex;
    align-items: center;
    gap: 25px;
    margin-top: 25px;
    padding-bottom: 7px;
    border-bottom: 1px solid var(--so-accent);
    color: var(--so-text);
    font-family: "Quicksand", sans-serif;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    transition: color 0.3s ease;
}

.spice-origin__link span {
    font-size: 18px;
    transition: transform 0.3s ease;
}

.spice-origin__link:hover {
    color: var(--so-accent);
}

.spice-origin__link:hover span {
    transform: translate(3px, -3px);
}

/* FOOTER */

.spice-origin__footer {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid var(--so-line);
}

.spice-origin__footer-mark {
    display: flex;
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--so-accent);
    color: var(--so-accent);
    font-family: "Quicksand", sans-serif;
    font-size: 17px;
    font-weight: 700;
}

.spice-origin__footer p {
    flex: 1;
    margin: 0;
    color: var(--so-muted);
    font-family: "Quicksand", sans-serif;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.7;
}

.spice-origin__footer-index {
    color: var(--so-muted);
    font-family: "Quicksand", sans-serif;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

/* ANIMATIONS */

@keyframes soFadeUp {
    from {
        opacity: 0;
        transform: translateY(24px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes soImageIn {
    from {
        opacity: 0;
        clip-path: inset(0 0 12% 0);
        transform: translateY(22px);
    }

    to {
        opacity: 1;
        clip-path: inset(0 0 0 0);
        transform: translateY(0);
    }
}

/* TABLET */

@media (max-width: 992px) {
    .spice-origin {
        padding: 75px 5% 30px;
    }

    .spice-origin__header {
        gap: 30px;
        margin-bottom: 40px;
    }

    .spice-origin__gallery {
        grid-template-columns: 1fr 0.9fr;
        gap: 18px;
    }

    .spice-origin__main-image {
        min-height: 520px;
    }

    .spice-origin__side-image {
        height: 235px;
    }

    .spice-origin__story {
        padding: 25px 20px;
    }

    .spice-origin__header h2 {
        font-size: clamp(34px, 4.2vw, 42px);
        letter-spacing: -1.5px;
    }
}

/* MOBILE */

@media (max-width: 768px) {
    .spice-origin {
        padding: 60px 6% 25px;
    }

    .spice-origin__header {
        grid-template-columns: 1fr;
        gap: 18px;
        margin-bottom: 32px;
    }

    .spice-origin__intro {
        max-width: 520px;
        margin: 0;
    }

    .spice-origin__gallery {
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .spice-origin__main-image {
        min-height: 480px;
    }

    .spice-origin__side-image {
        height: 300px;
    }

    .spice-origin__story {
        padding: 30px 24px;
        border-top: 0;
    }

    .spice-origin__story h3 {
        font-size: 25px;
    }
}

@media (max-width: 480px) {
    .spice-origin {
        padding: 48px 20px 22px;
    }

    .spice-origin__tag {
        font-size: 10px;
        letter-spacing: 1.8px;
    }

    .spice-origin__header h2 {
        font-size: 34px;
        letter-spacing: -1.5px;
    }

    .spice-origin__intro {
        font-size: 15px;
    }

    .spice-origin__main-image {
        min-height: 390px;
    }

    .spice-origin__image-overlay {
        right: 20px;
        bottom: 22px;
        left: 20px;
    }

    .spice-origin__image-overlay h3 {
        font-size: 24px;
    }

    .spice-origin__side-image {
        height: 230px;
    }

    .spice-origin__story {
        padding: 25px 18px;
    }

    .spice-origin__story h3 {
        font-size: 22px;
    }

    .spice-origin__footer {
        flex-wrap: wrap;
        gap: 12px;
    }

    .spice-origin__footer p {
        flex-basis: calc(100% - 50px);
    }

    .spice-origin__footer-index {
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .spice-origin__header,
    .spice-origin__main-image,
    .spice-origin__side {
        animation: none;
    }

    .spice-origin__main-image img,
    .spice-origin__side-image img,
    .spice-origin__link,
    .spice-origin__link span {
        transition: none;
    }
}

/* SPICE OFFERS */

.spice-offers {
    --so-bg: #f8f5ef;
    --so-text: #302a23;
    --so-muted: #81776b;
    --so-accent: #b99a78;
    --so-line: rgba(72, 57, 43, 0.17);

    padding: 100px 6%;
    background: var(--so-bg);
    color: var(--so-text);
    font-family: "Quicksand", sans-serif;
    overflow: hidden;
}

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

.so-container {
    max-width: 1440px;
    width: 100%;
    margin: 0 auto;
}

/* Heading — same style treatment */

.so-header {
    max-width: 850px;
    margin: 0 auto 55px;
    text-align: center;
}

.so-tag {
    display: inline-block;
    margin-bottom: 24px;
    color: var(--so-accent);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 3px;
}

.so-header h2 {
    margin: 0 auto 20px;
    max-width: 760px;
    color: var(--so-text);
    font-family: "Quicksand", sans-serif;
    font-size: clamp(34px, 4.2vw, 56px);
    font-weight: 700;
    line-height: 1.16;
    letter-spacing: -1.5px;
    overflow-wrap: break-word;
}

.so-header p {
    max-width: 570px;
    margin: 0 auto;
    color: var(--so-muted);
    font-size: 13px;
    font-weight: 400;
    line-height: 1.9;
}

/* Offer layout */

.so-offer-layout {
    display: grid;
    grid-template-columns: 1.45fr 0.85fr;
    gap: 24px;
    align-items: stretch;
}

.so-main-offer {
    position: relative;
    display: grid;
    grid-template-columns: 0.95fr 1.05fr;
    min-height: 490px;
    overflow: hidden;
    background: #e9dfd0;
}

.so-main-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding: 45px;
}

.so-offer-label {
    margin-bottom: 22px;
    color: #78624c;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
}

.so-main-content h3 {
    margin: 0 0 18px;
    color: #302a23;
    font-family: "Quicksand", sans-serif;
    font-size: clamp(30px, 3.2vw, 44px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -1px;
}

.so-main-content p {
    margin: 0 0 28px;
    color: #6f6255;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.9;
}

.so-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 14px 20px;
    background: #4b4932;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    text-decoration: none;
    transition: background 0.3s ease, gap 0.3s ease;
}

.so-button:hover {
    gap: 20px;
      background: #e9dfd0;
    color: #4b4932;
}

.so-main-image {
    position: relative;
    min-height: 100%;
    overflow: hidden;
}

.so-main-image img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 490px;
    object-fit: cover;
    transition: transform 0.7s ease;
}

.so-main-offer:hover .so-main-image img {
    transform: scale(1.05);
}

.so-image-stamp {
    position: absolute;
    right: 20px;
    bottom: 20px;
    display: grid;
    width: 90px;
    height: 90px;
    place-content: center;
    border: 1px solid rgba(255, 255, 255, 0.8);
    border-radius: 50%;
    background: rgba(48, 42, 35, 0.7);
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    line-height: 1.6;
    letter-spacing: 1px;
    text-align: center;
}

/* Side offers */

.so-side-offers {
    display: grid;
    grid-template-rows: 1fr 1fr;
    gap: 24px;
}

.so-deal {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 230px;
    padding: 25px 28px;
    transition: transform 0.3s ease;
}

.so-deal:hover {
    transform: translateY(-4px);
}

.so-deal-dark {
    background: #eee7dc;
    color: #f8f5ef;
}

.so-deal-light {
    background: #eee7dc;
    color: #302a23;
}

.so-deal-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.so-deal-top span {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.3px;
}

.so-deal-top i {
    font-size: 13px;
    color: var(--so-accent);
}

.so-deal-content h3 {
    margin: 22px 0 10px;
    font-family: "Quicksand", sans-serif;
    font-size: clamp(24px, 2.2vw, 32px);
    font-weight: 700;
    line-height: 1.18;
    letter-spacing: -0.6px;
}

.so-deal-content p {
    margin: 0 0 17px;
    color: inherit;
    opacity: 0.75;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.8;
}

.so-deal-content a {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 5px;
    border-bottom: 1px solid var(--so-accent);
    color: inherit;
    font-size: 11px;
    font-weight: 700;
    text-decoration: none;
}

.so-deal-content a span {
    color: var(--so-accent);
    transition: transform 0.3s ease;
}

.so-deal-content a:hover span {
    transform: translate(3px, -3px);
}

/* Footer */

.so-footer {
    display: flex;
    align-items: center;
    gap: 22px;
    margin-top: 35px;
}

.so-footer span {
    color: var(--so-muted);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.so-footer-line {
    flex: 1;
    height: 1px;
    background: var(--so-line);
}

/* Entrance animation */

@keyframes soReveal {
    from {
        opacity: 0;
        transform: translateY(25px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.so-header,
.so-main-offer,
.so-deal,
.so-footer {
    animation: soReveal 0.8s ease both;
}

.so-main-offer {
    animation-delay: 0.1s;
}

.so-deal:nth-child(2) {
    animation-delay: 0.2s;
}

/* Responsive */

@media (max-width: 1100px) {
    .spice-offers {
        padding: 85px 4%;
    }

    .so-offer-layout {
        grid-template-columns: 1fr;
    }

    .so-main-offer {
        min-height: 420px;
    }

    .so-main-image img {
        min-height: 420px;
    }

    .so-side-offers {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto;
    }

    .so-deal {
        min-height: 260px;
    }
}

@media (max-width: 768px) {
    .spice-offers {
        padding: 70px 5%;
    }

    .so-header {
        margin-bottom: 38px;
    }

    .so-header h2 {
        letter-spacing: -1px;
    }

    .so-main-offer {
        grid-template-columns: 1fr 1fr;
        min-height: 360px;
    }

    .so-main-content {
        padding: 28px;
    }

    .so-main-image img {
        min-height: 360px;
    }

    .so-side-offers {
        gap: 16px;
    }

    .so-deal {
        min-height: 245px;
        padding: 22px;
    }
}

@media (max-width: 480px) {
    .spice-offers {
        padding: 55px 20px;
    }

    .so-tag {
        margin-bottom: 18px;
        font-size: 9px;
        letter-spacing: 2px;
    }

    .so-header h2 {
        font-size: clamp(32px, 9vw, 40px);
    }

    .so-header p {
        font-size: 12px;
    }

    .so-main-offer {
        grid-template-columns: 1fr;
    }

    .so-main-content {
        padding: 30px 25px;
    }

    .so-main-content h3 {
        font-size: 34px;
    }

    .so-main-image {
        height: 250px;
    }

    .so-main-image img {
        height: 250px;
        min-height: 250px;
    }

    .so-image-stamp {
        width: 72px;
        height: 72px;
        font-size: 8px;
    }

    .so-side-offers {
        grid-template-columns: 1fr;
    }

    .so-deal {
        min-height: 230px;
        padding: 24px;
    }

    .so-footer {
        flex-wrap: wrap;
        gap: 12px;
    }

    .so-footer-line {
        min-width: 35px;
    }

    .so-footer span {
        font-size: 8px;
        letter-spacing: 1px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .so-header,
    .so-main-offer,
    .so-deal,
    .so-footer {
        animation: none;
    }

    .so-main-image img,
    .so-deal,
    .so-button {
        transition: none;
    }
}



/* KITCHEN STORY */

.spice-kitchen-story {
    --sks-bg: #FBF8F0;
    --sks-text: #293526;
    --sks-muted: #73796B;
    --sks-accent: #C6A56B;
    --sks-border: #E8E2D5;

    padding: 100px 6%;
    background: var(--sks-bg);
    color: var(--sks-text);
    font-family: "Quicksand", sans-serif;
    overflow: hidden;
}

.spice-kitchen-story * {
    box-sizing: border-box;
}

.sks-container {
    max-width: 1400px;
    margin: 0 auto;
}

.sks-vertical-label {
    display: flex;
    align-items: center;
    gap: 18px;
    margin-bottom: 45px;
    color: var(--sks-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
}

.sks-label-line {
    width: 65px;
    height: 1px;
    background: var(--sks-accent);
}

.sks-main {
    display: grid;
    grid-template-columns: 0.9fr 1.1fr;
    align-items: center;
    gap: 8%;
}

.sks-copy {
    padding: 15px 0;
}

.sks-tag {
    display: inline-block;
    margin-bottom: 24px;
    color: var(--sks-accent);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
}

.sks-copy h2 {
    margin: 0 0 24px;
    max-width: 760px;
    color: var(--sks-text);
    font-family: "Quicksand", sans-serif;
    font-size: clamp(34px, 4.2vw, 56px);
    font-weight: 700;
    line-height: 1.16;
    letter-spacing: -1.5px;
    overflow-wrap: break-word;
}

.sks-copy h2 span {
    color: var(--sks-accent);
}

.sks-description {
    max-width: 450px;
    margin: 0 0 28px;
    color: var(--sks-muted);
    font-size: 14px;
    font-weight: 400;
    line-height: 1.9;
}

.sks-button {
    display: inline-flex;
    align-items: center;
    gap: 25px;
    padding: 15px 20px;
    border: 1px solid var(--sks-accent);
    color: var(--sks-text);
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    transition: background 0.3s ease, color 0.3s ease;
}

.sks-button span {
    color: var(--sks-accent);
    font-size: 18px;
    transition: transform 0.3s ease;
}

.sks-button:hover {
    background: var(--sks-text);
    color: var(--sks-bg);
}

.sks-button:hover span {
    transform: translate(3px, -3px);
}

.sks-quote {
    display: flex;
    gap: 14px;
    margin-top: 45px;
    padding-top: 22px;
    border-top: 1px solid var(--sks-border);
}

.sks-quote-mark {
    color: var(--sks-accent);
    font-family: Georgia, serif;
    font-size: 42px;
    line-height: 1;
}

.sks-quote p {
    max-width: 340px;
    margin: 0;
    color: var(--sks-muted);
    font-size: 13px;
    font-weight: 400;
    font-style: italic;
    line-height: 1.8;
}

/* Editorial image composition */

.sks-visual {
    position: relative;
    min-height: 590px;
    padding: 0 55px 55px 0;
}

.sks-image-main {
    width: 82%;
    height: 510px;
    margin-left: auto;
    overflow: hidden;
}

.sks-image-main img,
.sks-image-detail img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.7s ease;
}

.sks-visual:hover .sks-image-main img,
.sks-visual:hover .sks-image-detail img {
    transform: scale(1.035);
}

.sks-image-detail {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 43%;
    height: 245px;
    padding: 9px;
    background: var(--sks-bg);
}

.sks-image-detail img {
    height: 165px;
}

.sks-detail-caption {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 10px 4px 0;
}

.sks-detail-caption span:first-child {
    color: var(--sks-accent);
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 1px;
}

.sks-detail-caption span:last-child {
    color: var(--sks-text);
    font-size: 12px;
    font-weight: 700;
}

.sks-round-stamp {
    position: absolute;
    top: 25px;
    left: 3%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 7px;
    width: 112px;
    height: 112px;
    border: 1px solid var(--sks-accent);
    border-radius: 50%;
    background: var(--sks-bg);
    color: var(--sks-text);
    text-align: center;
    transform: rotate(-10deg);
}

.sks-round-stamp span:first-child,
.sks-round-stamp span:last-child {
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 1px;
}

.sks-stamp-symbol {
    color: var(--sks-accent);
    font-size: 23px;
}

/* Footer */

.sks-footer {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    margin-top: 55px;
    padding-top: 20px;
    border-top: 1px solid var(--sks-border);
}

.sks-footer span {
    color: var(--sks-muted);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

/* Entrance animation */

@keyframes sksEnter {
    from {
        opacity: 0;
        transform: translateY(25px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.sks-copy,
.sks-visual {
    animation: sksEnter 0.8s ease both;
}

.sks-visual {
    animation-delay: 0.15s;
}

/* Responsive */

@media (max-width: 992px) {
    .spice-kitchen-story {
        padding: 80px 5%;
    }

    .sks-main {
        grid-template-columns: 1fr 1fr;
        gap: 5%;
    }

    .sks-visual {
        min-height: 480px;
        padding: 0 30px 45px 0;
    }

    .sks-image-main {
        height: 420px;
        width: 88%;
    }

    .sks-image-detail {
        width: 48%;
        height: 205px;
    }

    .sks-image-detail img {
        height: 130px;
    }

    .sks-round-stamp {
        width: 90px;
        height: 90px;
    }
}

@media (max-width: 768px) {
    .spice-kitchen-story {
        padding: 65px 5%;
    }

    .sks-main {
        grid-template-columns: 1fr;
        gap: 35px;
    }

    .sks-copy {
        padding: 0;
    }

    .sks-visual {
        width: 100%;
        min-height: 480px;
        padding-right: 35px;
    }

    .sks-image-main {
        width: 86%;
        height: 430px;
    }

    .sks-image-detail {
        width: 42%;
    }

    .sks-footer {
        margin-top: 40px;
    }
}

@media (max-width: 480px) {
    .spice-kitchen-story {
        padding: 50px 20px;
    }

    .sks-vertical-label {
        margin-bottom: 30px;
        font-size: 9px;
    }

    .sks-copy h2 {
        font-size: clamp(34px, 9vw, 42px);
    }

    .sks-description {
        font-size: 13px;
    }

    .sks-quote {
        margin-top: 32px;
    }

    .sks-visual {
        min-height: 360px;
        padding: 0 22px 40px 0;
    }

    .sks-image-main {
        height: 330px;
        width: 88%;
    }

    .sks-image-detail {
        width: 47%;
        height: 165px;
        padding: 6px;
    }

    .sks-image-detail img {
        height: 100px;
    }

    .sks-detail-caption {
        padding-top: 7px;
    }

    .sks-detail-caption span:first-child {
        font-size: 7px;
    }

    .sks-detail-caption span:last-child {
        font-size: 10px;
    }

    .sks-round-stamp {
        top: 15px;
        left: 0;
        width: 76px;
        height: 76px;
        gap: 5px;
    }

    .sks-round-stamp span:first-child,
    .sks-round-stamp span:last-child {
        font-size: 6px;
    }

    .sks-stamp-symbol {
        font-size: 17px;
    }

    .sks-footer {
        flex-direction: column;
        gap: 12px;
    }

    .sks-footer span {
        font-size: 8px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .sks-copy,
    .sks-visual {
        animation: none;
    }

    .sks-image-main img,
    .sks-image-detail img,
    .sks-button,
    .sks-button span {
        transition: none;
    }
}


/* =========================================
   FINAL SPICE SECTION
========================================= */

.spice-reserve {
    --sr-bg: #FBF8F0;
    --sr-text: #293526;
    --sr-muted: #73796B;
    --sr-accent: #C6A56B;
    --sr-border: #E8E2D5;
    --sr-surface: #FFFFFF;

    position: relative;
    overflow: hidden;
    padding: 100px 6%;
    background: var(--sr-bg);
    color: var(--sr-text);
    font-family: "Quicksand", sans-serif;
}

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

.sr-container {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
}

/* Topline */

.sr-topline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--sr-border);
}

.sr-tag,
.sr-number {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
}

.sr-tag {
    color: var(--sr-accent);
}

.sr-number {
    color: var(--sr-muted);
}

/* Main layout */

.sr-main {
    display: grid;
    grid-template-columns: 1fr 0.9fr;
    align-items: center;
    gap: 9%;
    padding: 65px 0;
}

/* Left content */

.sr-left {
    animation: srReveal 0.8s ease both;
}

.sr-symbol {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 43px;
    height: 43px;
    margin-bottom: 25px;
    border: 1px solid var(--sr-accent);
    border-radius: 50%;
    color: var(--sr-accent);
    font-size: 22px;
}

.sr-left h2 {
    margin: 0 0 22px;
    max-width: 760px;
    color: var(--sr-text);
    font-family: "Quicksand", sans-serif;
    font-size: clamp(34px, 4.2vw, 56px);
    font-weight: 700;
    line-height: 1.16;
    letter-spacing: -1.5px;
    overflow-wrap: break-word;
}

.sr-left h2 span {
    color: var(--sr-accent);
}

.sr-description {
    max-width: 450px;
    margin: 0 0 35px;
    color: var(--sr-muted);
    font-size: 14px;
    font-weight: 400;
    line-height: 1.9;
}

/* Form */

.sr-form {
    max-width: 500px;
}

.sr-form label {
    display: block;
    margin-bottom: 12px;
    color: var(--sr-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.sr-input-wrap {
    display: flex;
    align-items: stretch;
    gap: 8px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--sr-accent);
}

.sr-input-wrap input {
    flex: 1;
    width: 100%;
    min-width: 0;
    padding: 13px 0;
    border: none;
    outline: none;
    background: transparent;
    color: var(--sr-text);
    font-family: "Quicksand", sans-serif;
    font-size: 13px;
    font-weight: 400;
}

.sr-input-wrap input::placeholder {
    color: var(--sr-muted);
    opacity: 0.8;
}

.sr-input-wrap button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    padding: 12px 16px;
    border: 1px solid var(--sr-accent);
    background: var(--sr-text);
    color: var(--sr-bg);
    font-family: "Quicksand", sans-serif;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.3s ease, color 0.3s ease;
}

.sr-input-wrap button:hover {
    background: var(--sr-accent);
    color: #293526;
}

.sr-arrow {
    font-size: 17px;
}

.sr-note {
    margin: 13px 0 0;
    color: var(--sr-muted);
    font-size: 11px;
    font-weight: 400;
    line-height: 1.8;
}

/* Right visual */

.sr-right {
    position: relative;
    padding: 0 25px 35px 0;
    animation: srReveal 0.9s ease both;
    animation-delay: 0.15s;
}

.sr-image-wrap {
    width: 100%;
    height: 470px;
    overflow: hidden;
}

.sr-image-wrap img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.8s ease;
}

.sr-right:hover .sr-image-wrap img {
    transform: scale(1.04);
}

.sr-image-note {
    position: absolute;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    gap: 18px;
    width: 85%;
    padding: 23px;
    border: 1px solid var(--sr-border);
    background: var(--sr-bg);
}

.sr-note-index {
    color: var(--sr-accent);
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
}

.sr-note-title {
    color: var(--sr-text);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.2px;
}

.sr-image-note p {
    margin: 7px 0 0;
    color: var(--sr-muted);
    font-size: 12px;
    font-weight: 400;
    line-height: 1.7;
}

.sr-decoration {
    position: absolute;
    top: 20px;
    right: -8px;
    color: var(--sr-accent);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 2px;
    writing-mode: vertical-rl;
}

/* Bottom line */

.sr-bottom {
    display: flex;
    align-items: center;
    gap: 20px;
    padding-top: 22px;
    border-top: 1px solid var(--sr-border);
}

.sr-bottom span {
    color: var(--sr-muted);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.sr-bottom-line {
    flex: 1;
    height: 1px;
    background: var(--sr-border);
}

/* Animation */

@keyframes srReveal {
    from {
        opacity: 0;
        transform: translateY(22px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Responsive */

@media (max-width: 992px) {
    .spice-reserve {
        padding: 80px 5%;
    }

    .sr-main {
        grid-template-columns: 1fr 0.9fr;
        gap: 5%;
    }

    .sr-image-wrap {
        height: 390px;
    }

    .sr-image-note {
        width: 92%;
        padding: 17px;
    }
}

@media (max-width: 768px) {
    .spice-reserve {
        padding: 65px 5%;
    }

    .sr-main {
        grid-template-columns: 1fr;
        gap: 45px;
        padding: 45px 0;
    }

    .sr-description,
    .sr-form {
        max-width: 100%;
    }

    .sr-right {
        max-width: 580px;
        width: 100%;
    }

    .sr-image-wrap {
        height: 420px;
    }
}

@media (max-width: 480px) {
    .spice-reserve {
        padding: 50px 20px;
    }

    .sr-topline {
        align-items: flex-start;
        flex-direction: column;
        gap: 10px;
    }

    .sr-tag,
    .sr-number {
        font-size: 9px;
        letter-spacing: 1.4px;
    }

    .sr-main {
        gap: 35px;
        padding: 35px 0;
    }

    .sr-left h2 {
        font-size: clamp(34px, 9vw, 42px);
    }

    .sr-description {
        font-size: 13px;
    }

    .sr-input-wrap {
        flex-wrap: wrap;
    }

    .sr-input-wrap input {
        flex-basis: 100%;
    }

    .sr-input-wrap button {
        width: 100%;
        justify-content: space-between;
    }

    .sr-right {
        padding-right: 15px;
        padding-bottom: 45px;
    }

    .sr-image-wrap {
        height: 320px;
    }

    .sr-image-note {
        width: 94%;
        gap: 12px;
        padding: 14px;
    }

    .sr-note-title {
        font-size: 9px;
    }

    .sr-image-note p {
        font-size: 11px;
    }

    .sr-decoration {
        right: -5px;
        font-size: 7px;
    }

    .sr-bottom {
        flex-wrap: wrap;
        gap: 12px;
    }

    .sr-bottom span {
        font-size: 8px;
        letter-spacing: 1px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .sr-left,
    .sr-right {
        animation: none;
    }

    .sr-image-wrap img,
    .sr-input-wrap button {
        transition: none;
    }
}

/* Keep the homepage heading above its four-card row. */
.spice-experience--cards .spice-experience__container {
    display: block;
}

/* Keep descriptive text consistent throughout the homepage. */
body.spice-homepage p,
body.spice-products-page p,
body.spice-homepage blockquote {
    font-size: 16px;
}

/* =====================================
   PRODUCTS PAGE PREMIUM BANNER
===================================== */

.spice-products-banner {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 430px;
    padding: 80px 6%;
    overflow: hidden;
    isolation: isolate;
    background-image: url("../images/pexels-umberto-dez-6691815-34942955.jpg");
    background-position: center 48%;
    background-repeat: no-repeat;
    background-size: cover;
    text-align: center;
    color: #fff;
}

.spice-products-banner__overlay {
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(
        90deg,
        rgba(0, 0, 0, 0.78),
        rgba(24, 20, 15, 0.48),
        rgba(24, 20, 15, 0.72)
    );
}

.spice-products-banner__content {
    width: 100%;
    max-width: 850px;
    margin: 0 auto;
    animation: productsBannerReveal 0.9s ease both;
}

.spice-products-banner__tag {
    display: inline-block;
    margin-bottom: 22px;
    color: #DDB699;
    font-family: "Quicksand", sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 3px;
    line-height: 1.6;
}

.spice-products-banner__content h1 {
    margin: 0 auto 20px;
    max-width: 760px;
    color: #fff;
    font-family: "Quicksand", sans-serif;
    font-size: clamp(34px, 4.2vw, 56px);
    font-weight: 700;
    line-height: 1.16;
    letter-spacing: -1.5px;
    overflow-wrap: break-word;
}

.spice-products-banner__content h1 span {
    display: block;
    color: #DDB699;
    font: inherit;
}

.spice-products-banner__content p {
    max-width: 650px;
    margin: 0 auto;
    color: rgba(255, 255, 255, 0.88);
    font-family: "Quicksand", sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.9;
}

@keyframes productsBannerReveal {
    from {
        opacity: 0;
        transform: translateY(22px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* TABLET */

@media (max-width: 992px) {
    .spice-products-banner {
        min-height: 390px;
        padding: 70px 5%;
    }
}

/* MOBILE */

@media (max-width: 768px) {
    .spice-products-banner {
        min-height: 360px;
        padding: 65px 6%;
        background-position: center;
    }

    .spice-products-banner__tag {
        margin-bottom: 18px;
        font-size: 11px;
        letter-spacing: 2.5px;
    }

    .spice-products-banner__content p {
        font-size: 15px;
        line-height: 1.8;
    }
}

@media (max-width: 480px) {
    .spice-products-banner {
        min-height: 340px;
        padding: 55px 22px;
    }

    .spice-products-banner__content h1 {
        font-size: 34px;
        line-height: 1.16;
        letter-spacing: -1.5px;
    }

    .spice-products-banner__content p {
        font-size: 14px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .spice-products-banner__content {
        animation: none;
    }
}



/* =========================================
   PRODUCTS BY CATEGORY
========================================= */

.spice-category {
    --sct-bg: #F8F5EF;
    --sct-text: #29251F;
    --sct-muted: #777067;
    --sct-accent: #DDB699;
    --sct-border: rgba(125, 104, 78, 0.25);

    padding: 100px 6%;
    background: var(--sct-bg);
    color: var(--sct-text);
    overflow: hidden;
}

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

.spice-category__container {
    max-width: 1320px;
    margin: 0 auto;
}

/* HEADER */

.spice-category__header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 40px;
    margin-bottom: 48px;
}

.spice-category__heading {
    max-width: 650px;
}

.spice-category__tag {
    display: inline-block;
    margin-bottom: 18px;
    color: #9B7955;
    font-family: "Quicksand", sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2.5px;
    line-height: 1.6;
}

.spice-category__heading h2 {
    margin: 0 auto 20px;
    max-width: 760px;
    color: var(--sct-text);
    font-family: "Quicksand", sans-serif;
    font-size: clamp(34px, 4.2vw, 56px);
    font-weight: 700;
    line-height: 1.16;
    letter-spacing: -1.5px;
    overflow-wrap: break-word;
}

.spice-category__heading h2 span {
    color: #A58B6C;
}

.spice-category__intro {
    max-width: 390px;
    margin: 0 0 22px;
    color: var(--sct-muted);
    font-family: "Quicksand", sans-serif;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

/* EDITORIAL CATEGORY ROW */

.spice-category__list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 26px;
}

.spice-category__item {
    display: block;
    min-width: 0;
    color: inherit;
    text-decoration: none;
}

.spice-category__image {
    position: relative;
    height: 380px;
    overflow: hidden;
    background: #E8DFD1;
}

.spice-category__image::after {
    content: "";
    position: absolute;
    inset: 35% 0 0;
    background: linear-gradient(
        to bottom,
        transparent,
        rgba(20, 17, 13, 0.52)
    );
    pointer-events: none;
}

.spice-category__image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.7s ease;
}

.spice-category__item:hover .spice-category__image img {
    transform: scale(1.055);
}

.spice-category__number {
    position: absolute;
    z-index: 1;
    top: 20px;
    left: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border: 1px solid rgba(255, 255, 255, 0.7);
    border-radius: 50%;
    color: #fff;
    font-family: "Quicksand", sans-serif;
    font-size: 12px;
    font-weight: 700;
}

.spice-category__arrow {
    position: absolute;
    z-index: 1;
    right: 20px;
    bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border: 1px solid rgba(255, 255, 255, 0.7);
    border-radius: 50%;
    color: #fff;
    font-size: 21px;
    transition:
        background 0.3s ease,
        color 0.3s ease,
        border-color 0.3s ease;
}

.spice-category__item:hover .spice-category__arrow {
    border-color: var(--sct-accent);
    background: var(--sct-accent);
    color: #29251F;
}

/* CATEGORY DETAILS */

.spice-category__info {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 22px 0 24px;
    border-bottom: 1px solid var(--sct-border);
}

.spice-category__info h3 {
    margin: 0 0 8px;
    color: var(--sct-text);
    font-family: "Quicksand", sans-serif;
    font-size: 21px;
    font-weight: 700;
    line-height: 1.4;
}

.spice-category__info p {
    margin: 0;
    color: var(--sct-muted);
    font-family: "Quicksand", sans-serif;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.8;
}

/* FOOTER DETAIL */

.spice-category__footer {
    display: flex;
    align-items: center;
    gap: 18px;
    margin-top: 34px;
    color: var(--sct-muted);
    font-family: "Quicksand", sans-serif;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
}

.spice-category__footer-line {
    flex: 1;
    height: 1px;
    background: var(--sct-border);
}

/* TABLET */

@media (max-width: 992px) {
    .spice-category {
        padding: 80px 5%;
    }

    .spice-category__header {
        align-items: flex-start;
        gap: 25px;
    }

    .spice-category__intro {
        max-width: 310px;
    }

    .spice-category__list {
        gap: 18px;
    }

    .spice-category__image {
        height: 300px;
    }

    .spice-category__info h3 {
        font-size: 18px;
    }
}

/* MOBILE */

@media (max-width: 768px) {
    .spice-category {
        padding: 65px 6%;
    }

    .spice-category__header {
        display: block;
        margin-bottom: 30px;
    }

    .spice-category__heading h2 {
        font-size: clamp(34px, 6vw, 44px);
        letter-spacing: -1.5px;
    }

    .spice-category__intro {
        max-width: 520px;
        margin-bottom: 0;
    }

    .spice-category__list {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .spice-category__image {
        height: clamp(280px, 70vw, 440px);
    }

    .spice-category__info {
        padding: 18px 0 20px;
    }

    .spice-category__footer {
        gap: 12px;
        font-size: 9px;
        letter-spacing: 1.3px;
    }
}

@media (max-width: 480px) {
    .spice-category {
        padding: 50px 20px;
    }

    .spice-category__heading h2 {
        font-size: 34px;
        letter-spacing: -1.5px;
    }

    .spice-category__tag {
        font-size: 10px;
        letter-spacing: 2px;
    }

    .spice-category__image {
        height: 310px;
    }

    .spice-category__info h3 {
        font-size: 19px;
    }

    .spice-category__footer {
        flex-wrap: wrap;
        line-height: 1.8;
    }
}

@media (prefers-reduced-motion: reduce) {
    .spice-category__image img,
    .spice-category__arrow {
        transition: none;
    }
}

/* PREMIUM SPICE EXPERIENCE */

.spice-experience {
    --sex-bg: #F8F5EF;
    --sex-text: #29251F;
    --sex-muted: #777067;
    --sex-accent: #DDB699;
    --sex-border: rgba(41, 37, 31, 0.12);

    position: relative;
    overflow: hidden;
    padding: 110px 24px;
    background: var(--sex-bg);
    color: var(--sex-text);
    font-family: "Quicksand", sans-serif;
}

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

.spice-experience__container {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 0.92fr;
    align-items: center;
    gap: clamp(45px, 7vw, 100px);
}

/* IMAGES */

.spice-experience__visual {
    position: relative;
    min-width: 0;
    min-height: 570px;
}

.spice-experience__image-main {
    position: absolute;
    inset: 0 45px 35px 35px;
    overflow: hidden;
    border-radius: 180px 180px 8px 8px;
}

.spice-experience__image-main img,
.spice-experience__image-small img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform 1s cubic-bezier(.2, .7, .2, 1);
}

.spice-experience__visual:hover .spice-experience__image-main img {
    transform: scale(1.045);
}

.spice-experience__image-small {
    position: absolute;
    width: 43%;
    height: 235px;
    right: 0;
    bottom: 0;
    padding: 8px;
    background: var(--sex-bg);
    border: 1px solid var(--sex-border);
    border-radius: 4px;
    overflow: hidden;
}

.spice-experience__image-small img {
    border-radius: 2px;
}

.spice-experience__stamp {
    position: absolute;
    top: 55px;
    left: 0;
    width: 105px;
    height: 105px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    background: var(--sex-accent);
    color: #29251F;
    border-radius: 50%;
    transform: rotate(-10deg);
    box-shadow: 0 12px 35px rgba(41, 37, 31, 0.12);
}

.spice-experience__stamp span {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
}

.spice-experience__stamp i {
    font-size: 21px;
}

.spice-experience__vertical-text {
    position: absolute;
    top: 180px;
    right: 5px;
    writing-mode: vertical-rl;
    color: var(--sex-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 3px;
}

/* CONTENT */

.spice-experience__content {
    min-width: 0;
}

.spice-experience__tag {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 22px;
    color: #8C6D53;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2.5px;
}

.spice-experience__tag span {
    width: 27px;
    height: 1px;
    background: var(--sex-accent);
}

.spice-experience__content h2 {
    margin: 0 auto 20px;
    max-width: 760px;
    color: var(--sex-text);
    font-family: "Quicksand", sans-serif;
    font-size: clamp(34px, 4.2vw, 56px);
    font-weight: 700;
    line-height: 1.16;
    letter-spacing: -1.5px;
    overflow-wrap: break-word;
}

.spice-experience__content h2 span {
    display: block;
    color: #A98566;
}

.spice-experience__description {
    max-width: 490px;
    margin: 0 0 32px;
    color: var(--sex-muted);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

/* FEATURES */

.spice-experience__features {
    display: flex;
    flex-direction: column;
    margin-bottom: 32px;
}

.spice-experience__feature {
    display: flex;
    align-items: center;
    gap: 17px;
    padding: 17px 0;
    border-bottom: 1px solid var(--sex-border);
    transition: padding-left 0.35s ease;
}

.spice-experience__feature:first-child {
    border-top: 1px solid var(--sex-border);
}

.spice-experience__feature:hover {
    padding-left: 8px;
}

.spice-experience__icon {
    flex: 0 0 47px;
    width: 47px;
    height: 47px;
    display: grid;
    place-items: center;
    background: rgba(221, 182, 153, 0.22);
    color: #8C6D53;
    border-radius: 50%;
    font-size: 17px;
    transition: background 0.3s ease, color 0.3s ease,
                transform 0.3s ease;
}

.spice-experience__feature:hover .spice-experience__icon {
    background: var(--sex-accent);
    color: #29251F;
    transform: rotate(-8deg);
}

.spice-experience__feature h3 {
    margin: 0 0 5px;
    color: var(--sex-text);
    font-size: 15px;
    font-weight: 700;
}

.spice-experience__feature p {
    margin: 0;
    color: var(--sex-muted);
    font-size: 12px;
    font-weight: 400;
    line-height: 1.7;
}

/* BUTTON */

.spice-experience__button {
    width: fit-content;
    max-width: 100%;
    min-height: 54px;
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    padding: 7px 8px 7px 23px;
    background: var(--sex-text);
    color: #FFFFFF;
    border: 1px solid var(--sex-text);
    border-radius: 3px;
    text-decoration: none;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.4px;
    transition: background 0.3s ease, color 0.3s ease,
                transform 0.3s ease;
}

.spice-experience__button > span {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    background: var(--sex-accent);
    color: #29251F;
    border-radius: 2px;
    transition: transform 0.3s ease;
}

.spice-experience__button:hover {
    background: var(--sex-accent);
    color: #29251F;
    border-color: var(--sex-accent);
    transform: translateY(-3px);
}

.spice-experience__button:hover > span {
    transform: translateX(3px);
}

/* ENTRANCE ANIMATIONS */

@keyframes sexVisualReveal {
    from {
        opacity: 0;
        transform: translateX(-35px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes sexContentReveal {
    from {
        opacity: 0;
        transform: translateX(30px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.spice-experience--reveal .spice-experience__visual,
.spice-experience--reveal .spice-experience__content {
    animation: none;
    opacity: 0;
}

.spice-experience--reveal.is-visible .spice-experience__visual {
    animation: sexVisualReveal 0.9s ease both;
}

.spice-experience--reveal.is-visible .spice-experience__content {
    animation: sexContentReveal 0.9s ease 0.15s both;
}

/* RESPONSIVE */

@media (max-width: 992px) {
    .spice-experience {
        padding: 85px 24px;
    }

    .spice-experience__container {
        grid-template-columns: 1fr 1fr;
        gap: 40px;
    }

    .spice-experience__visual {
        min-height: 490px;
    }

    .spice-experience__image-small {
        height: 190px;
    }

    .spice-experience__content h2 {
        font-size: clamp(32px, 4vw, 44px);
        letter-spacing: -1px;
    }

    .spice-experience__description {
        font-size: 14px;
    }
}

@media (max-width: 768px) {
    .spice-experience {
        padding: 70px 22px;
    }

    .spice-experience__container {
        grid-template-columns: 1fr;
        gap: 45px;
    }

    .spice-experience__visual {
        width: 100%;
        max-width: 560px;
        min-height: 500px;
        margin: 0 auto;
    }

    .spice-experience__image-main {
        inset: 0 40px 30px 25px;
    }

    .spice-experience__content h2 {
        max-width: 100%;
        font-size: clamp(34px, 7vw, 48px);
    }

    .spice-experience__content {
        max-width: 600px;
    }
}

@media (max-width: 480px) {
    .spice-experience {
        padding: 55px 18px;
    }

    .spice-experience__visual {
        min-height: 380px;
    }

    .spice-experience__image-main {
        inset: 0 30px 25px 18px;
        border-radius: 130px 130px 5px 5px;
    }

    .spice-experience__image-small {
        width: 45%;
        height: 145px;
        padding: 5px;
    }

    .spice-experience__stamp {
        top: 35px;
        width: 78px;
        height: 78px;
    }

    .spice-experience__stamp span {
        font-size: 8px;
        letter-spacing: 1.5px;
    }

    .spice-experience__stamp i {
        font-size: 16px;
    }

    .spice-experience__vertical-text {
        top: 125px;
        font-size: 8px;
        letter-spacing: 2px;
    }

    .spice-experience__tag {
        font-size: 10px;
        letter-spacing: 1.8px;
    }

    .spice-experience__content h2 {
        font-size: 34px;
        line-height: 1.2;
    }

    .spice-experience__description {
        font-size: 13px;
        line-height: 1.8;
    }

    .spice-experience__feature {
        gap: 12px;
        padding: 15px 0;
    }

    .spice-experience__icon {
        flex-basis: 42px;
        width: 42px;
        height: 42px;
    }

    .spice-experience__feature h3 {
        font-size: 14px;
    }

    .spice-experience__feature p {
        font-size: 11px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .spice-experience *,
    .spice-experience *::before,
    .spice-experience *::after {
        animation: none !important;
        transition: none !important;
    }
}



/* =========================================
   SPICE HOUSE - PREMIUM EDITORIAL SECTION
========================================= */

.spice-house {
    --sh-bg: #F8F5EF;
    --sh-text: #29251F;
    --sh-muted: #777067;
    --sh-accent: #DDB699;
    --sh-border: rgba(41, 37, 31, 0.15);

    position: relative;
    overflow: hidden;
    padding: 100px 24px 35px;
    background: var(--sh-bg);
    color: var(--sh-text);
    font-family: "Quicksand", sans-serif;
}

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

.spice-house__container {
    width: 100%;
    max-width: 1260px;
    margin: 0 auto;
}

/* HEADER */

.spice-house__header {
    max-width: 850px;
    margin: 0 auto 65px;
    text-align: center;
}

.spice-house__eyebrow {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    margin-bottom: 23px;
    color: #957458;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 3px;
}

.spice-house__line {
    width: 32px;
    height: 1px;
    background: var(--sh-accent);
}

.spice-house__header h2 {
    margin: 0 auto 20px;
    max-width: 760px;
    color: var(--sh-text);
    font-family: "Quicksand", sans-serif;
    font-size: clamp(34px, 4.2vw, 56px);
    font-weight: 700;
    line-height: 1.16;
    letter-spacing: -1.5px;
    overflow-wrap: break-word;
}

.spice-house__header h2 span {
    display: block;
    color: #A98566;
}

.spice-house__header p {
    max-width: 570px;
    margin: 0 auto;
    color: var(--sh-muted);
    font-size: 14px;
    font-weight: 400;
    line-height: 1.9;
}

/* MAIN SHOWCASE */

.spice-house__showcase {
    display: grid;
    grid-template-columns: 45px minmax(0, 1.1fr) minmax(0, 0.9fr);
    align-items: stretch;
    gap: 30px;
}

/* SIDE NOTE */

.spice-house__side-note {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 19px;
    color: var(--sh-muted);
}

.spice-house__side-note > span:first-child {
    color: var(--sh-text);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1px;
}

.spice-house__side-line {
    width: 1px;
    height: 90px;
    background: var(--sh-accent);
}

.spice-house__side-note > span:last-child {
    writing-mode: vertical-rl;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 2.5px;
}

/* IMAGE */

.spice-house__main-image {
    position: relative;
    min-width: 0;
    min-height: 540px;
    overflow: hidden;
    background: #6E5945;
}

.spice-house__main-image > img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform 1.2s cubic-bezier(.2, .7, .2, 1);
}

.spice-house__main-image:hover > img {
    transform: scale(1.045);
}

.spice-house__image-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(20, 17, 13, 0.02) 25%,
        rgba(20, 17, 13, 0.76) 100%
    );
}

.spice-house__image-caption {
    position: absolute;
    right: 30px;
    bottom: 35px;
    left: 35px;
    color: #FFFFFF;
}

.spice-house__image-caption > span {
    display: inline-block;
    margin-bottom: 15px;
    color: #E6C7A8;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2.5px;
}

.spice-house__image-caption h3 {
    margin: 0;
    color: #FFFFFF;
    font-family: "Quicksand", sans-serif;
    font-size: clamp(28px, 3vw, 40px);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.7px;
}

.spice-house__image-number {
    position: absolute;
    top: 22px;
    right: 22px;
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border: 1px solid rgba(255, 255, 255, 0.6);
    border-radius: 50%;
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 600;
}

/* DETAIL CONTENT */

.spice-house__detail {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    padding: 20px 0 20px 18px;
}

.spice-house__detail-tag {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 24px;
    color: #957458;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.6px;
}

.spice-house__detail-tag i {
    font-size: 15px;
    color: #A98566;
}

.spice-house__detail > h3 {
    margin: 0 0 18px;
    color: var(--sh-text);
    font-size: clamp(27px, 2.7vw, 37px);
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: -0.8px;
}

.spice-house__detail > h3 span {
    display: block;
    color: #A98566;
}

.spice-house__detail > p {
    max-width: 460px;
    margin: 0 0 28px;
    color: var(--sh-muted);
    font-size: 13px;
    font-weight: 400;
    line-height: 1.95;
}

/* NUMBERED DETAILS */

.spice-house__stat {
    border-top: 1px solid var(--sh-border);
}

.spice-house__stat-item {
    display: flex;
    align-items: flex-start;
    gap: 17px;
    padding: 19px 0;
    border-bottom: 1px solid var(--sh-border);
    transition: padding-left 0.3s ease;
}

.spice-house__stat-item:hover {
    padding-left: 7px;
}

.spice-house__stat-number {
    flex: 0 0 34px;
    padding-top: 2px;
    color: #A98566;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
}

.spice-house__stat-item h4 {
    margin: 0 0 6px;
    color: var(--sh-text);
    font-size: 14px;
    font-weight: 700;
}

.spice-house__stat-item p {
    margin: 0;
    color: var(--sh-muted);
    font-size: 12px;
    font-weight: 400;
    line-height: 1.7;
}

/* LINK */

.spice-house__link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    width: 100%;
    max-width: 310px;
    margin-top: 28px;
    padding: 0 0 13px;
    border-bottom: 1px solid var(--sh-accent);
    color: var(--sh-text);
    text-decoration: none;
    font-size: 12px;
    font-weight: 700;
    transition: color 0.3s ease;
}

.spice-house__link-icon {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    background: var(--sh-accent);
    color: #29251F;
    transition: transform 0.3s ease;
}

.spice-house__link:hover {
    color: #A98566;
}

.spice-house__link:hover .spice-house__link-icon {
    transform: translate(3px, -3px);
}

/* FOOTER STRIP */

.spice-house__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-top: 75px;
    padding-top: 22px;
    border-top: 1px solid var(--sh-border);
    color: var(--sh-muted);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 2px;
}

.spice-house__footer-mark {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border: 1px solid var(--sh-border);
    border-radius: 50%;
    color: #A98566;
    font-size: 14px;
}

/* ENTRANCE ANIMATION */

.spice-house--reveal .spice-house__header,
.spice-house--reveal .spice-house__side-note,
.spice-house--reveal .spice-house__main-image,
.spice-house--reveal .spice-house__detail,
.spice-house--reveal .spice-house__footer {
    opacity: 0;
}

.spice-house--reveal .spice-house__header {
    transform: translateY(28px);
}

.spice-house--reveal .spice-house__side-note {
    transform: translateX(-15px);
}

.spice-house--reveal .spice-house__main-image {
    transform: translateY(35px);
}

.spice-house--reveal .spice-house__detail {
    transform: translateX(30px);
}

.spice-house--reveal .spice-house__footer {
    transform: translateY(15px);
}

.spice-house--reveal.is-visible .spice-house__header {
    animation: shFadeUp 0.8s ease forwards;
}

.spice-house--reveal.is-visible .spice-house__side-note {
    animation: shFadeIn 0.7s ease 0.1s forwards;
}

.spice-house--reveal.is-visible .spice-house__main-image {
    animation: shImageReveal 0.9s ease 0.15s forwards;
}

.spice-house--reveal.is-visible .spice-house__detail {
    animation: shSlideRight 0.85s ease 0.25s forwards;
}

.spice-house--reveal.is-visible .spice-house__footer {
    animation: shFadeUp 0.7s ease 0.4s forwards;
}

@keyframes shFadeUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes shFadeIn {
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes shImageReveal {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes shSlideRight {
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

/* RESPONSIVE */

@media (max-width: 992px) {
    .spice-house {
        padding: 80px 22px 30px;
    }

    .spice-house__header {
        margin-bottom: 48px;
    }

    .spice-house__showcase {
        grid-template-columns: 30px minmax(0, 1fr) minmax(0, 0.95fr);
        gap: 20px;
    }

    .spice-house__main-image {
        min-height: 490px;
    }

    .spice-house__detail {
        padding-left: 5px;
    }

    .spice-house__detail > h3 {
        font-size: 29px;
    }

    .spice-house__image-caption {
        right: 20px;
        bottom: 25px;
        left: 22px;
    }

    .spice-house__image-caption h3 {
        font-size: 29px;
    }

    .spice-house__footer {
        margin-top: 55px;
    }
}

@media (max-width: 768px) {
    .spice-house {
        padding: 70px 22px 25px;
    }

    .spice-house__header {
        margin-bottom: 38px;
    }

    .spice-house__header h2 {
        font-size: clamp(34px, 6.5vw, 46px);
    }

    .spice-house__showcase {
        grid-template-columns: 25px minmax(0, 1fr);
        gap: 17px;
    }

    .spice-house__main-image {
        min-height: 470px;
    }

    .spice-house__detail {
        grid-column: 2;
        padding: 25px 0 0;
    }

    .spice-house__detail > h3 {
        font-size: 34px;
    }

    .spice-house__detail > p {
        max-width: 100%;
    }

    .spice-house__footer {
        margin-top: 45px;
    }
}

@media (max-width: 480px) {
    .spice-house {
        padding: 55px 17px 22px;
    }

    .spice-house__eyebrow {
        gap: 9px;
        font-size: 9px;
        letter-spacing: 2px;
    }

    .spice-house__line {
        width: 22px;
    }

    .spice-house__header h2 {
        font-size: 34px;
        letter-spacing: -1px;
    }

    .spice-house__header p {
        font-size: 12px;
    }

    .spice-house__showcase {
        grid-template-columns: 18px minmax(0, 1fr);
        gap: 12px;
    }

    .spice-house__side-note {
        gap: 14px;
    }

    .spice-house__side-note > span:last-child {
        font-size: 8px;
        letter-spacing: 1.5px;
    }

    .spice-house__side-line {
        height: 65px;
    }

    .spice-house__main-image {
        min-height: 390px;
    }

    .spice-house__image-caption {
        right: 15px;
        bottom: 20px;
        left: 17px;
    }

    .spice-house__image-caption > span {
        font-size: 8px;
        letter-spacing: 1.5px;
    }

    .spice-house__image-caption h3 {
        font-size: 26px;
    }

    .spice-house__image-number {
        top: 14px;
        right: 14px;
        width: 36px;
        height: 36px;
    }

    .spice-house__detail-tag {
        font-size: 9px;
        letter-spacing: 1px;
    }

    .spice-house__detail > h3 {
        font-size: 30px;
    }

    .spice-house__stat-item {
        gap: 10px;
        padding: 16px 0;
    }

    .spice-house__stat-number {
        flex-basis: 28px;
    }

    .spice-house__stat-item h4 {
        font-size: 13px;
    }

    .spice-house__stat-item p {
        font-size: 11px;
    }

    .spice-house__footer {
        flex-wrap: wrap;
        justify-content: center;
        gap: 12px;
        margin-top: 38px;
        font-size: 8px;
        letter-spacing: 1px;
        text-align: center;
    }

    .spice-house__footer-mark {
        width: 28px;
        height: 28px;
    }
}

/* REDUCED MOTION ACCESSIBILITY */

@media (prefers-reduced-motion: reduce) {
    .spice-house *,
    .spice-house *::before,
    .spice-house *::after {
        animation: none !important;
        transition: none !important;
    }

    .spice-house--reveal .spice-house__header,
    .spice-house--reveal .spice-house__side-note,
    .spice-house--reveal .spice-house__main-image,
    .spice-house--reveal .spice-house__detail,
    .spice-house--reveal .spice-house__footer {
        opacity: 1;
        transform: none;
    }
}

/* =========================================
   SPICE EDITORIAL SHOWCASE
   LIGHT MODE: #EEE8DC
========================================= */

.spice-editorial {
    --se-bg: #EEE8DC;
    --se-panel: #F8F4EC;
    --se-text: #302820;
    --se-muted: #71675C;
    --se-accent: #A77853;
    --se-border: rgba(91, 68, 48, 0.18);

    position: relative;
    width: 100%;
    overflow: hidden;
    padding: 90px 0 0;
    background: var(--se-bg);
    color: var(--se-text);
    font-family: "Quicksand", sans-serif;
}

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

/* CONTAINER */

.spice-editorial__container {
    width: min(1240px, calc(100% - 80px));
    margin: 0 auto;
}

/* TOP LINE */

.spice-editorial__top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    padding-bottom: 24px;
    border-bottom: 1px solid var(--se-border);
}

.spice-editorial__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: var(--se-accent);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
}

.spice-editorial__eyebrow span {
    width: 8px;
    height: 8px;
    flex-shrink: 0;
    border-radius: 50%;
    background: var(--se-accent);
}

.spice-editorial__index {
    color: var(--se-muted);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 1.5px;
}

/* MAIN LAYOUT */

.spice-editorial__main {
    display: grid;
    grid-template-columns: 0.88fr 1.12fr;
    align-items: center;
    gap: clamp(45px, 7vw, 100px);
    padding: 72px 0 85px;
}

/* LEFT CONTENT */

.spice-editorial__content {
    position: relative;
    z-index: 2;
    max-width: 510px;
}

.spice-editorial__kicker {
    margin: 0 0 20px;
    color: var(--se-accent);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1.4px;
    text-transform: uppercase;
}

.spice-editorial__content h2 {
    max-width: 520px;
    margin: 0 0 24px;
    color: var(--se-text);
    font-family: "Quicksand", sans-serif;
    font-size: clamp(34px, 4.2vw, 56px);
    font-weight: 700;
    line-height: 1.16;
    letter-spacing: -1.5px;
    overflow-wrap: break-word;
}

.spice-editorial__content h2 span {
    color: var(--se-accent);
}

.spice-editorial__description {
    max-width: 410px;
    margin: 0;
    color: var(--se-muted);
    font-size: 14px;
    font-weight: 400;
    line-height: 1.95;
}

/* BUTTON */

.spice-editorial__actions {
    display: flex;
    margin-top: 32px;
}

.spice-editorial__button {
    display: inline-flex;
    min-height: 54px;
    align-items: center;
    justify-content: center;
    gap: 22px;
    padding: 0 23px;
    background: #302820;
    color: #EEE8DC;
    border: 1px solid #302820;
    border-radius: 2px;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    transition:
        background 0.3s ease,
        color 0.3s ease,
        border-color 0.3s ease,
        transform 0.3s ease;
}

.spice-editorial__button i {
    font-size: 13px;
    transition: transform 0.3s ease;
}

.spice-editorial__button:hover {
    background: var(--se-accent);
    border-color: var(--se-accent);
    color: #fff;
    transform: translateY(-3px);
}

.spice-editorial__button:hover i {
    transform: translate(3px, -3px);
}

/* SIGNATURE LINE */

.spice-editorial__signature {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-top: 42px;
    color: var(--se-muted);
    font-size: 12px;
    font-weight: 500;
}

.spice-editorial__signature-line {
    width: 36px;
    height: 1px;
    flex-shrink: 0;
    background: var(--se-accent);
}

/* RIGHT IMAGE */

.spice-editorial__visual {
    position: relative;
    min-width: 0;
    padding: 0 0 65px;
}

.spice-editorial__image {
    position: relative;
    width: 100%;
    height: 470px;
    overflow: hidden;
    background: #D5C7B4;
}

.spice-editorial__image::after {
    position: absolute;
    inset: 45% 0 0;
    background: linear-gradient(
        to bottom,
        transparent,
        rgba(25, 20, 15, 0.68)
    );
    content: "";
    pointer-events: none;
}

.spice-editorial__image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 0.8s ease;
}

.spice-editorial__image:hover img {
    transform: scale(1.045);
}

/* IMAGE LABEL */

.spice-editorial__image-label {
    position: absolute;
    z-index: 1;
    right: 24px;
    bottom: 22px;
    left: 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.spice-editorial__image-label i {
    display: grid;
    width: 34px;
    height: 34px;
    flex-shrink: 0;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.7);
    border-radius: 50%;
}

/* OVERLAPPING DETAIL PANEL */

.spice-editorial__detail {
    position: absolute;
    right: -20px;
    bottom: 0;
    z-index: 2;
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) 28px;
    align-items: start;
    gap: 16px;
    width: min(420px, 92%);
    padding: 27px 25px;
    background: var(--se-panel);
    border: 1px solid var(--se-border);
    box-shadow: 0 18px 45px rgba(70, 50, 30, 0.10);
}

.spice-editorial__detail-icon {
    display: grid;
    width: 44px;
    height: 44px;
    flex-shrink: 0;
    place-items: center;
    background: #E9D9C7;
    color: #76543B;
    font-size: 18px;
}

.spice-editorial__detail-copy > span {
    display: block;
    margin: 2px 0 10px;
    color: var(--se-accent);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.1px;
}

.spice-editorial__detail-copy h3 {
    margin: 0 0 9px;
    color: var(--se-text);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.4;
}

.spice-editorial__detail-copy p {
    margin: 0;
    color: var(--se-muted);
    font-size: 12px;
    font-weight: 400;
    line-height: 1.8;
}

.spice-editorial__detail-number {
    padding-top: 2px;
    color: var(--se-accent);
    font-size: 12px;
    font-weight: 700;
}

/* VERTICAL LABEL */

.spice-editorial__vertical-text {
    position: absolute;
    top: 50%;
    right: -48px;
    color: var(--se-muted);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.7px;
    white-space: nowrap;
    transform: translateY(-50%) rotate(90deg);
    transform-origin: center;
}

/* BOTTOM QUALITY STRIP */

.spice-editorial__footer {
    display: grid;
    grid-template-columns: 1.15fr 1fr 1fr 1fr;
    align-items: center;
    gap: 28px;
    padding: 30px 0;
    border-top: 1px solid var(--se-border);
}

.spice-editorial__footer-intro > span {
    color: var(--se-accent);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.spice-editorial__footer-intro p {
    margin: 8px 0 0;
    color: var(--se-text);
    font-size: 15px;
    font-weight: 700;
    line-height: 1.5;
}

.spice-editorial__quality {
    display: flex;
    align-items: center;
    gap: 13px;
    min-width: 0;
}

.spice-editorial__quality > i {
    display: grid;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    place-items: center;
    border: 1px solid var(--se-border);
    color: var(--se-accent);
    font-size: 15px;
}

.spice-editorial__quality h4 {
    margin: 0 0 5px;
    color: var(--se-text);
    font-size: 12px;
    font-weight: 700;
}

.spice-editorial__quality p {
    margin: 0;
    color: var(--se-muted);
    font-size: 10px;
    font-weight: 400;
    line-height: 1.6;
}

/* ENTRANCE ANIMATIONS */

.spice-editorial [data-se-animate] {
    opacity: 0;
    transform: translateY(24px);
    transition:
        opacity 0.75s ease,
        transform 0.75s ease;
}

.spice-editorial.se-visible [data-se-animate] {
    opacity: 1;
    transform: translateY(0);
}

.spice-editorial.se-visible [data-se-animate="visual"] {
    transition-delay: 0.15s;
}

.spice-editorial.se-visible [data-se-animate="detail"] {
    transition-delay: 0.3s;
}

@media (prefers-reduced-motion: reduce) {
    .spice-editorial *,
    .spice-editorial *::before,
    .spice-editorial *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
    }

    .spice-editorial [data-se-animate] {
        opacity: 1;
        transform: none;
    }
}

/* =========================================
   TABLET: MAX 992px
========================================= */

@media (max-width: 992px) {
    .spice-editorial {
        padding-top: 65px;
    }

    .spice-editorial__container {
        width: calc(100% - 48px);
    }

    .spice-editorial__main {
        grid-template-columns: 0.9fr 1.1fr;
        gap: 35px;
        padding: 55px 0 65px;
    }

    .spice-editorial__content h2 {
        font-size: clamp(34px, 4.4vw, 44px);
        letter-spacing: -1px;
    }

    .spice-editorial__image {
        height: 410px;
    }

    .spice-editorial__detail {
        right: -8px;
        grid-template-columns: 36px minmax(0, 1fr) 20px;
        gap: 12px;
        padding: 20px 17px;
    }

    .spice-editorial__detail-icon {
        width: 36px;
        height: 36px;
    }

    .spice-editorial__vertical-text {
        display: none;
    }

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

/* =========================================
   MOBILE: MAX 768px
========================================= */

@media (max-width: 768px) {
    .spice-editorial {
        padding-top: 48px;
    }

    .spice-editorial__container {
        width: calc(100% - 36px);
    }

    .spice-editorial__top {
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
        padding-bottom: 20px;
    }

    .spice-editorial__eyebrow {
        font-size: 10px;
        letter-spacing: 1.5px;
    }

    .spice-editorial__index {
        font-size: 9px;
    }

    .spice-editorial__main {
        grid-template-columns: minmax(0, 1fr);
        gap: 38px;
        padding: 43px 0 45px;
    }

    .spice-editorial__content {
        max-width: 100%;
    }

    .spice-editorial__content h2 {
        max-width: 520px;
        margin-bottom: 18px;
        font-size: clamp(36px, 9vw, 50px);
        line-height: 1.13;
        letter-spacing: -1px;
    }

    .spice-editorial__description {
        font-size: 13px;
        line-height: 1.9;
    }

    .spice-editorial__actions {
        margin-top: 25px;
    }

    .spice-editorial__signature {
        margin-top: 28px;
    }

    .spice-editorial__visual {
        width: calc(100% - 8px);
        margin-right: 8px;
        padding-bottom: 62px;
    }

    .spice-editorial__image {
        height: clamp(300px, 90vw, 440px);
    }

    .spice-editorial__detail {
        right: -8px;
        width: min(400px, 94%);
        padding: 20px 16px;
    }

    .spice-editorial__detail-copy h3 {
        font-size: 16px;
    }

    .spice-editorial__detail-copy p {
        font-size: 11px;
    }

    .spice-editorial__footer {
        grid-template-columns: minmax(0, 1fr);
        gap: 0;
        padding: 24px 0;
    }

    .spice-editorial__footer-intro {
        padding-bottom: 20px;
    }

    .spice-editorial__quality {
        padding: 17px 0;
        border-top: 1px solid var(--se-border);
    }
}

/* =========================================
   SMALL MOBILE: MAX 480px
========================================= */

@media (max-width: 480px) {
    .spice-editorial__container {
        width: calc(100% - 28px);
    }

    .spice-editorial__content h2 {
        font-size: 35px;
    }

    .spice-editorial__button {
        width: 100%;
        gap: 15px;
        padding: 0 15px;
        font-size: 11px;
    }

    .spice-editorial__detail {
        grid-template-columns: 32px minmax(0, 1fr) 18px;
        gap: 10px;
        padding: 17px 12px;
    }

    .spice-editorial__detail-icon {
        width: 32px;
        height: 32px;
        font-size: 14px;
    }

    .spice-editorial__detail-copy > span {
        font-size: 8px;
        letter-spacing: 0.7px;
    }

    .spice-editorial__detail-copy h3 {
        font-size: 14px;
    }

    .spice-editorial__detail-number {
        font-size: 10px;
    }

    .spice-editorial__image-label {
        right: 15px;
        bottom: 15px;
        left: 15px;
        font-size: 8px;
    }
}


/* ==========================================
   CONDIMENT SHOWCASE
   Professional editorial grid
========================================== */

.condiment-showcase {
    --cs-bg: #EEE8DC;
    --cs-card-bg: #F7F2E9;
    --cs-text: #302820;
    --cs-muted: #71675C;
    --cs-accent: #A77853;
    --cs-border: rgba(91, 68, 48, 0.18);

    width: 100%;
    position: relative;
    overflow: hidden;
    padding: 100px 0 35px;
    background: var(--cs-bg);
    color: var(--cs-text);
    font-family: "Quicksand", sans-serif;
}

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

.condiment-showcase__container {
    width: min(1240px, calc(100% - 80px));
    margin: 0 auto;
}

/* HEADER */

.condiment-showcase__header {
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    align-items: end;
    gap: 65px;
    margin-bottom: 48px;
}

.condiment-showcase__tag {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 23px;
    color: var(--cs-accent);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
}

.condiment-showcase__tag-line {
    width: 30px;
    height: 1px;
    background: var(--cs-accent);
}

.condiment-showcase__heading h2 {
    margin: 0;
    color: var(--cs-text);
    font-family: "Quicksand", sans-serif;
    font-size: clamp(34px, 4.2vw, 56px);
    font-weight: 700;
    line-height: 1.16;
    letter-spacing: -1.5px;
    overflow-wrap: break-word;
}

.condiment-showcase__heading h2 span {
    color: var(--cs-accent);
}

.condiment-showcase__intro {
    padding-bottom: 5px;
}

.condiment-showcase__intro p {
    margin: 0 0 22px;
    color: var(--cs-muted);
    font-size: 13px;
    font-weight: 400;
    line-height: 1.95;
}

.condiment-showcase__text-link {
    display: inline-flex;
    align-items: center;
    gap: 13px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--cs-accent);
    color: var(--cs-text);
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    transition: color 0.3s ease;
}

.condiment-showcase__text-link i {
    color: var(--cs-accent);
    transition: transform 0.3s ease;
}

.condiment-showcase__text-link:hover {
    color: var(--cs-accent);
}

.condiment-showcase__text-link:hover i {
    transform: translate(3px, -3px);
}

/* ASYMMETRIC GRID */

.condiment-showcase__grid {
    display: grid;
    grid-template-columns: 1.08fr 0.92fr;
    grid-template-rows: repeat(2, minmax(240px, 1fr));
    gap: 22px;
}

/* CATEGORY CARDS */

.condiment-showcase__card {
    position: relative;
    display: block;
    min-width: 0;
    min-height: 250px;
    overflow: hidden;
    background: #CFC0AC;
    color: #fff;
    text-decoration: none;
    isolation: isolate;
}

.condiment-showcase__card--featured {
    grid-row: 1 / 3;
    min-height: 540px;
}

.condiment-showcase__card img {
    position: absolute;
    z-index: -2;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 0.8s cubic-bezier(0.2, 0.65, 0.3, 1);
}

.condiment-showcase__card:hover img {
    transform: scale(1.055);
}

/* IMAGE OVERLAY */

.condiment-showcase__card::after {
    position: absolute;
    z-index: -1;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(20, 16, 12, 0.06) 0%,
        rgba(20, 16, 12, 0.15) 36%,
        rgba(20, 16, 12, 0.83) 100%
    );
    content: "";
    transition: background 0.4s ease;
}

.condiment-showcase__card:hover::after {
    background: linear-gradient(
        180deg,
        rgba(20, 16, 12, 0.08) 0%,
        rgba(20, 16, 12, 0.24) 30%,
        rgba(20, 16, 12, 0.9) 100%
    );
}

/* CARD NUMBER */

.condiment-showcase__number {
    position: absolute;
    top: 22px;
    left: 24px;
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.65);
    border-radius: 50%;
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    backdrop-filter: blur(5px);
}

/* CARD CONTENT */

.condiment-showcase__card-content {
    position: absolute;
    right: 30px;
    bottom: 30px;
    left: 30px;
    padding-right: 42px;
}

.condiment-showcase__card-label {
    display: block;
    margin-bottom: 12px;
    color: #E8C9AB;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.8px;
}

.condiment-showcase__card-content h3 {
    margin: 0 0 10px;
    color: #fff;
    font-family: "Quicksand", sans-serif;
    font-size: clamp(22px, 2.5vw, 31px);
    font-weight: 700;
    line-height: 1.25;
}

.condiment-showcase__card-content p {
    max-width: 380px;
    margin: 0;
    color: rgba(255, 255, 255, 0.86);
    font-size: 12px;
    font-weight: 400;
    line-height: 1.8;
}

.condiment-showcase__card--featured .condiment-showcase__card-content {
    right: 38px;
    bottom: 38px;
    left: 38px;
}

.condiment-showcase__card--featured .condiment-showcase__card-content h3 {
    font-size: clamp(29px, 3vw, 40px);
}

/* ROUND ARROW */

.condiment-showcase__arrow {
    position: absolute;
    right: 0;
    bottom: 3px;
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.65);
    border-radius: 50%;
    color: #fff;
    font-size: 13px;
    transition:
        background 0.3s ease,
        color 0.3s ease,
        border-color 0.3s ease,
        transform 0.3s ease;
}

.condiment-showcase__card:hover .condiment-showcase__arrow {
    background: #DDB699;
    border-color: #DDB699;
    color: #302820;
    transform: rotate(45deg);
}

/* BOTTOM LABEL */

.condiment-showcase__bottom {
    display: flex;
    align-items: center;
    gap: 24px;
    padding-top: 28px;
}

.condiment-showcase__bottom span {
    flex-shrink: 0;
    color: var(--cs-muted);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.condiment-showcase__bottom-line {
    width: 100%;
    height: 1px;
    background: var(--cs-border);
}

/* ENTRANCE ANIMATION */

.condiment-showcase [data-condiment-reveal] {
    opacity: 0;
    transform: translateY(28px);
    transition:
        opacity 0.75s ease,
        transform 0.75s cubic-bezier(0.2, 0.65, 0.3, 1);
}

.condiment-showcase.condiment-is-visible [data-condiment-reveal] {
    opacity: 1;
    transform: translateY(0);
}

.condiment-showcase.condiment-is-visible
.condiment-showcase__card:nth-child(1) {
    transition-delay: 0.12s;
}

.condiment-showcase.condiment-is-visible
.condiment-showcase__card:nth-child(2) {
    transition-delay: 0.24s;
}

.condiment-showcase.condiment-is-visible
.condiment-showcase__card:nth-child(3) {
    transition-delay: 0.36s;
}

.condiment-showcase.condiment-is-visible
.condiment-showcase__bottom {
    transition-delay: 0.42s;
}

@media (prefers-reduced-motion: reduce) {
    .condiment-showcase *,
    .condiment-showcase *::before,
    .condiment-showcase *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
    }

    .condiment-showcase [data-condiment-reveal] {
        opacity: 1;
        transform: none;
    }
}

/* TABLET */

@media (max-width: 992px) {
    .condiment-showcase {
        padding-top: 75px;
    }

    .condiment-showcase__container {
        width: calc(100% - 48px);
    }

    .condiment-showcase__header {
        gap: 35px;
        margin-bottom: 38px;
    }

    .condiment-showcase__heading h2 {
        font-size: clamp(34px, 4.5vw, 46px);
    }

    .condiment-showcase__grid {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: repeat(2, minmax(230px, 1fr));
        gap: 16px;
    }

    .condiment-showcase__card--featured {
        min-height: 490px;
    }

    .condiment-showcase__card-content {
        right: 20px;
        bottom: 24px;
        left: 20px;
        padding-right: 38px;
    }

    .condiment-showcase__card--featured .condiment-showcase__card-content {
        right: 22px;
        bottom: 25px;
        left: 22px;
    }

    .condiment-showcase__card-content h3 {
        font-size: 22px;
    }

    .condiment-showcase__card--featured .condiment-showcase__card-content h3 {
        font-size: 29px;
    }

    .condiment-showcase__card-content p {
        font-size: 11px;
    }

    .condiment-showcase__arrow {
        width: 34px;
        height: 34px;
        font-size: 11px;
    }

    .condiment-showcase__bottom {
        gap: 15px;
    }

    .condiment-showcase__bottom span {
        font-size: 8px;
        letter-spacing: 1px;
    }
}

/* MOBILE */

@media (max-width: 768px) {
    .condiment-showcase {
        padding: 58px 0 25px;
    }

    .condiment-showcase__container {
        width: calc(100% - 36px);
    }

    .condiment-showcase__header {
        grid-template-columns: 1fr;
        gap: 22px;
        margin-bottom: 30px;
    }

    .condiment-showcase__tag {
        margin-bottom: 18px;
        font-size: 10px;
        letter-spacing: 1.5px;
    }

    .condiment-showcase__heading h2 {
        font-size: clamp(34px, 8vw, 46px);
        line-height: 1.18;
        letter-spacing: -1px;
    }

    .condiment-showcase__intro p {
        margin-bottom: 16px;
        font-size: 13px;
    }

    .condiment-showcase__grid {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
        gap: 15px;
    }

    .condiment-showcase__card,
    .condiment-showcase__card--featured {
        grid-row: auto;
        min-height: 330px;
    }

    .condiment-showcase__card--featured {
        min-height: 410px;
    }

    .condiment-showcase__card-content {
        right: 23px;
        bottom: 25px;
        left: 23px;
    }

    .condiment-showcase__card--featured .condiment-showcase__card-content {
        right: 23px;
        bottom: 27px;
        left: 23px;
    }

    .condiment-showcase__card-content h3 {
        font-size: 26px;
    }

    .condiment-showcase__card--featured .condiment-showcase__card-content h3 {
        font-size: 32px;
    }

    .condiment-showcase__card-content p {
        font-size: 12px;
    }

    .condiment-showcase__bottom {
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
        padding-top: 24px;
    }

    .condiment-showcase__bottom-line {
        width: 50px;
    }
}

/* SMALL MOBILE */

@media (max-width: 480px) {
    .condiment-showcase__container {
        width: calc(100% - 28px);
    }

    .condiment-showcase__heading h2 {
        font-size: 34px;
    }

    .condiment-showcase__card,
    .condiment-showcase__card--featured {
        min-height: 340px;
    }

    .condiment-showcase__card--featured {
        min-height: 390px;
    }

    .condiment-showcase__number {
        top: 17px;
        left: 17px;
        width: 33px;
        height: 33px;
        font-size: 10px;
    }

    .condiment-showcase__card-content,
    .condiment-showcase__card--featured .condiment-showcase__card-content {
        right: 18px;
        bottom: 21px;
        left: 18px;
        padding-right: 36px;
    }

    .condiment-showcase__card-content h3 {
        font-size: 23px;
    }

    .condiment-showcase__card--featured .condiment-showcase__card-content h3 {
        font-size: 28px;
    }

    .condiment-showcase__card-label {
        font-size: 8px;
        letter-spacing: 1.3px;
    }

    .condiment-showcase__arrow {
        width: 32px;
        height: 32px;
    }

    .condiment-showcase__bottom span {
        font-size: 8px;
    }
}

/* PRODUCTS FINAL CTA - BACKGROUND ZOOM */

.spice-zoom-cta {
    --szc-accent: #DDB699;
    --szc-text: #EEE8DC;

    position: relative;
    isolation: isolate;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 650px;
    padding: 100px 24px 85px;
    overflow: hidden;
    background: #191B16;
    color: var(--szc-text);
    font-family: "Quicksand", sans-serif;
    text-align: center;
}

.spice-zoom-cta__bg {
    position: absolute;
    z-index: -3;
    inset: 0;
    background-image: url("../images/pexels-ax-markazi-babaiyan-108384970-9575086.jpg");
    background-position: center;
    background-size: cover;
    transform: scale(1.02);
    animation: szcBackgroundZoom 16s ease-in-out infinite alternate;
    will-change: transform;
}

.spice-zoom-cta__overlay {
    position: absolute;
    z-index: -2;
    inset: 0;
    background:
        linear-gradient(
            90deg,
            rgba(20, 22, 17, 0.76),
            rgba(20, 22, 17, 0.56),
            rgba(20, 22, 17, 0.76)
        ),
        linear-gradient(
            0deg,
            rgba(20, 22, 17, 0.78),
            transparent 40%,
            rgba(20, 22, 17, 0.30)
        );
}

.spice-zoom-cta__content {
    width: 100%;
    max-width: 850px;
    margin: auto;
    animation: szcContentReveal 1s ease both;
}

.spice-zoom-cta__tag {
    display: inline-block;
    margin-bottom: 24px;
    color: var(--szc-accent);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 3px;
}

.spice-zoom-cta__content h2 {
    max-width: 850px;
    margin: 0 auto 24px;
    color: var(--szc-text);
    font-family: "Quicksand", sans-serif;
    font-size: clamp(38px, 5.5vw, 72px);
    font-weight: 700;
    line-height: 1.14;
    letter-spacing: -1.8px;
    overflow-wrap: break-word;
}

.spice-zoom-cta__content h2 span {
    display: block;
    color: var(--szc-accent);
}

.spice-zoom-cta__content p {
    max-width: 550px;
    margin: 0 auto 32px;
    color: rgba(238, 232, 220, 0.90);
    font-size: 14px;
    font-weight: 400;
    line-height: 1.9;
}

.spice-zoom-cta__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 22px;
    min-height: 56px;
    padding: 9px 10px 9px 25px;
    border: 1px solid var(--szc-accent);
    border-radius: 50px;
    background: var(--szc-accent);
    color: #25271F;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease;
}

.spice-zoom-cta__button span {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #25271F;
    color: var(--szc-accent);
    font-size: 20px;
    transition: transform 0.3s ease;
}

.spice-zoom-cta__button:hover {
    background: transparent;
    color: var(--szc-text);
    transform: translateY(-3px);
}

.spice-zoom-cta__button:hover span {
    transform: rotate(45deg);
}

.spice-zoom-cta__bottom {
    position: absolute;
    right: 24px;
    bottom: 0;
    left: 24px;
    padding: 22px 10px;
    border-top: 1px solid rgba(238, 232, 220, 0.30);
    color: rgba(238, 232, 220, 0.85);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
    line-height: 1.8;
}

/* Background zoom animation */

@keyframes szcBackgroundZoom {
    from {
        transform: scale(1.02);
    }

    to {
        transform: scale(1.18);
    }
}

/* Content entrance */

@keyframes szcContentReveal {
    from {
        opacity: 0;
        transform: translateY(28px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Tablet */

@media (max-width: 768px) {
    .spice-zoom-cta {
        min-height: 570px;
        padding: 85px 22px 90px;
    }

    .spice-zoom-cta__content h2 {
        font-size: clamp(38px, 7vw, 56px);
        letter-spacing: -1px;
    }

    .spice-zoom-cta__content p {
        max-width: 480px;
        font-size: 13px;
    }

    .spice-zoom-cta__bottom {
        right: 18px;
        left: 18px;
        font-size: 9px;
        letter-spacing: 1.2px;
    }
}

/* Mobile */

@media (max-width: 480px) {
    .spice-zoom-cta {
        min-height: 530px;
        padding: 75px 18px 95px;
    }

    .spice-zoom-cta__bg {
        background-position: 48% center;
    }

    .spice-zoom-cta__tag {
        margin-bottom: 20px;
        font-size: 9px;
        letter-spacing: 2px;
    }

    .spice-zoom-cta__content h2 {
        font-size: 38px;
        line-height: 1.18;
    }

    .spice-zoom-cta__content p {
        margin-bottom: 27px;
        font-size: 12px;
        line-height: 1.8;
    }

    .spice-zoom-cta__button {
        gap: 13px;
        min-height: 50px;
        padding-left: 19px;
        font-size: 12px;
    }

    .spice-zoom-cta__button span {
        width: 32px;
        height: 32px;
    }

    .spice-zoom-cta__bottom {
        right: 12px;
        left: 12px;
        padding: 18px 5px;
        font-size: 8px;
        letter-spacing: 1px;
    }
}

/* Accessibility */

@media (prefers-reduced-motion: reduce) {
    .spice-zoom-cta__bg,
    .spice-zoom-cta__content {
        animation: none;
    }

    .spice-zoom-cta__button,
    .spice-zoom-cta__button span {
        transition: none;
    }
}


/* =========================================
   RECIPE MOOD SECTION
========================================= */

.recipe-mood-section {
    --rms-bg: #EEE8DC;
    --rms-panel: #F8F4EC;
    --rms-text: #302820;
    --rms-muted: #71675C;
    --rms-accent: #DDB699;
    --rms-border: rgba(48, 40, 32, 0.17);

    padding: 105px 24px;
    background: var(--rms-bg);
    color: var(--rms-text);
    font-family: "Quicksand", sans-serif;
    overflow: hidden;
}

.rms-container {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

/* Header */

.rms-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 40px;
    margin-bottom: 48px;
}

.rms-heading-wrap {
    flex: 1 1 60%;
    min-width: 0;
}

.rms-eyebrow {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 22px;
    color: var(--rms-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2.5px;
}

.rms-eyebrow-line {
    width: 32px;
    height: 1px;
    background: var(--rms-accent);
}

.rms-heading-wrap h2 {
    margin: 0;
    color: var(--rms-text);
    font-family: "Quicksand", sans-serif;
    font-size: clamp(36px, 4.3vw, 58px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -1.5px;
    overflow-wrap: break-word;
}

.rms-heading-wrap h2 span {
    display: block;
    color: #A77853;
}

.rms-intro {
    flex: 0 1 320px;
    margin: 0 0 6px;
    color: var(--rms-muted);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.9;
}

/* Main Layout */

.rms-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
    gap: 24px;
    align-items: stretch;
}

/* Featured Image */

.rms-featured {
    position: relative;
    isolation: isolate;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 590px;
    padding: 30px;
    overflow: hidden;
    background: #33261D;
    color: #EEE8DC;
    text-decoration: none;
}

.rms-featured-image,
.rms-featured-shade {
    position: absolute;
    z-index: -2;
    inset: 0;
    width: 100%;
    height: 100%;
}

.rms-featured-image {
    object-fit: cover;
    transition: transform 1s cubic-bezier(0.2, 0.7, 0.2, 1);
}

.rms-featured:hover .rms-featured-image {
    transform: scale(1.07);
}

.rms-featured-shade {
    z-index: -1;
    background:
        linear-gradient(
            180deg,
            rgba(25, 20, 16, 0.43) 0%,
            rgba(25, 20, 16, 0.02) 35%,
            rgba(25, 20, 16, 0.86) 100%
        );
}

.rms-featured-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
}

.rms-featured-label {
    padding: 10px 13px;
    border: 1px solid rgba(238, 232, 220, 0.45);
    color: #EEE8DC;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.8px;
}

.rms-featured-number {
    color: rgba(238, 232, 220, 0.8);
    font-size: 12px;
    letter-spacing: 1px;
}

.rms-featured-content {
    max-width: 490px;
    margin-top: 110px;
}

.rms-recipe-type {
    display: block;
    margin-bottom: 15px;
    color: var(--rms-accent);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 2px;
}

.rms-featured-content h3 {
    margin: 0 0 17px;
    color: #FFFFFF;
    font-size: clamp(32px, 3.5vw, 46px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -1px;
}

.rms-featured-content h3 span {
    display: block;
    color: var(--rms-accent);
}

.rms-featured-content p {
    max-width: 390px;
    margin: 0 0 25px;
    color: rgba(255, 255, 255, 0.85);
    font-size: 12px;
    line-height: 1.9;
}

.rms-explore-link {
    display: inline-flex;
    align-items: center;
    gap: 20px;
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 700;
}

.rms-arrow {
    display: grid;
    place-items: center;
    width: 35px;
    height: 35px;
    border: 1px solid rgba(238, 232, 220, 0.6);
    border-radius: 50%;
    transition:
        color 0.3s ease,
        background 0.3s ease,
        transform 0.3s ease;
}

.rms-featured:hover .rms-arrow {
    background: var(--rms-accent);
    color: #302820;
    transform: rotate(45deg);
}

/* Category Panel */

.rms-category-panel {
    display: flex;
    flex-direction: column;
    padding: 28px 30px 22px;
    border: 1px solid var(--rms-border);
    background: var(--rms-panel);
}

.rms-panel-heading {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    padding-bottom: 23px;
    border-bottom: 1px solid var(--rms-border);
    color: var(--rms-muted);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.6px;
}

.rms-panel-count {
    font-size: 8px;
    letter-spacing: 1px;
}

.rms-category-item {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) 35px;
    align-items: center;
    gap: 12px;
    min-height: 95px;
    padding: 18px 0;
    border-bottom: 1px solid var(--rms-border);
    color: var(--rms-text);
    text-decoration: none;
    transition: padding 0.3s ease, background 0.3s ease;
}

.rms-category-item:hover {
    padding-right: 10px;
    padding-left: 10px;
    background: rgba(221, 182, 153, 0.15);
}

.rms-category-index {
    align-self: start;
    padding-top: 4px;
    color: #A77853;
    font-size: 10px;
    font-weight: 700;
}

.rms-category-copy {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 0;
}

.rms-category-copy strong {
    color: var(--rms-text);
    font-size: 16px;
    font-weight: 700;
    line-height: 1.4;
}

.rms-category-copy small {
    color: var(--rms-muted);
    font-size: 14px;
    font-weight: 400;
    line-height: 1.6;
}

.rms-category-arrow {
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    border: 1px solid var(--rms-border);
    border-radius: 50%;
    font-size: 16px;
    transition:
        color 0.3s ease,
        background 0.3s ease,
        transform 0.3s ease;
}

.rms-category-item:hover .rms-category-arrow {
    border-color: var(--rms-accent);
    background: var(--rms-accent);
    color: #302820;
    transform: rotate(45deg);
}

/* Bottom Panel Note */

.rms-panel-note {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-top: auto;
    padding-top: 24px;
}

.rms-note-mark {
    display: grid;
    flex: 0 0 36px;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(221, 182, 153, 0.35);
    color: #795638;
    font-size: 19px;
}

.rms-panel-note p {
    margin: 0;
    color: var(--rms-muted);
    font-size: 15px;
    line-height: 1.7;
}

.rms-panel-note strong {
    color: var(--rms-text);
}

/* Bottom Strip */

.rms-bottom-strip {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    margin-top: 28px;
    color: var(--rms-muted);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 2px;
}

.rms-strip-line {
    width: 60px;
    height: 1px;
    background: var(--rms-accent);
}

/* Entrance Animation */

.rms-animate {
    opacity: 0;
    transform: translateY(24px);
    transition:
        opacity 0.75s ease,
        transform 0.75s ease;
}

.rms-animate.rms-visible {
    opacity: 1;
    transform: translateY(0);
}

/* Tablet */

@media (max-width: 992px) {
    .recipe-mood-section {
        padding: 80px 22px;
    }

    .rms-header {
        gap: 25px;
    }

    .rms-layout {
        grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr);
        gap: 16px;
    }

    .rms-featured {
        min-height: 540px;
        padding: 22px;
    }

    .rms-category-panel {
        padding: 22px 20px;
    }

    .rms-category-copy strong {
        font-size: 14px;
    }

    .rms-category-item {
        grid-template-columns: 25px minmax(0, 1fr) 30px;
        gap: 8px;
    }
}

/* Mobile */

@media (max-width: 767px) {
    .recipe-mood-section {
        padding: 65px 18px;
    }

    .rms-header {
        display: block;
        margin-bottom: 30px;
    }

    .rms-heading-wrap h2 {
        font-size: clamp(36px, 8vw, 48px);
        letter-spacing: -1px;
    }

    .rms-intro {
        max-width: 480px;
        margin-top: 20px;
        font-size: 12px;
    }

    .rms-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .rms-featured {
        min-height: 530px;
        padding: 23px;
    }

    .rms-featured-content h3 {
        font-size: 38px;
    }

    .rms-category-panel {
        padding: 24px 22px;
    }

    .rms-category-item {
        min-height: 88px;
        grid-template-columns: 30px minmax(0, 1fr) 35px;
        gap: 10px;
    }

    .rms-category-copy strong {
        font-size: 15px;
    }

    .rms-bottom-strip {
        flex-wrap: wrap;
        gap: 10px;
        font-size: 8px;
        letter-spacing: 1px;
    }

    .rms-strip-line {
        width: 25px;
    }
}

/* Small Mobile */

@media (max-width: 380px) {
    .recipe-mood-section {
        padding-right: 14px;
        padding-left: 14px;
    }

    .rms-featured {
        min-height: 480px;
        padding: 18px;
    }

    .rms-featured-content h3 {
        font-size: 32px;
    }

    .rms-featured-label {
        font-size: 8px;
        letter-spacing: 1px;
    }

    .rms-category-panel {
        padding: 20px 15px;
    }

    .rms-panel-heading {
        font-size: 8px;
        letter-spacing: 1px;
    }
}

/* Reduced Motion */

@media (prefers-reduced-motion: reduce) {
    .recipe-mood-section *,
    .recipe-mood-section *::before,
    .recipe-mood-section *::after {
        animation: none !important;
        transition: none !important;
    }
}


@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@400;500;600;700&display=swap');

.recipe-week-section {
    --rw-bg: #EEE8DC;
    --rw-card: #F8F4EC;
    --rw-text: #302820;
    --rw-muted: #71675C;
    --rw-accent: #DDB699;
    --rw-border: rgba(48, 40, 32, 0.16);

    position: relative;
    width: 100%;
    padding: 100px 24px 75px;
    background: var(--rw-bg);
    color: var(--rw-text);
    font-family: 'Quicksand', sans-serif;
    overflow: hidden;
}

.recipe-week-section *,
.recipe-week-section *::before,
.recipe-week-section *::after {
    box-sizing: border-box;
}

.recipe-week-container {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

/* Heading */
.recipe-week-heading {
    max-width: 680px;
    margin: 0 auto 55px;
    text-align: center;
    opacity: 0;
    transform: translateY(25px);
    transition: opacity .8s ease, transform .8s ease;
}

.recipe-week-section.rw-visible .recipe-week-heading {
    opacity: 1;
    transform: translateY(0);
}

.recipe-week-eyebrow {
    display: inline-block;
    margin-bottom: 18px;
    color: var(--rw-muted);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 3px;
}

.recipe-week-heading h2 {
     margin: 0;
    color: var(--rms-text);
    font-family: "Quicksand", sans-serif;
    font-size: clamp(36px, 4.3vw, 58px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -1.5px;
    overflow-wrap: break-word;
}

.recipe-week-heading h2 em {
    color: #A77853;
    font-weight: 700;
    font-style: normal;
}

.recipe-week-heading p {
    max-width: 510px;
    margin: 0 auto;
    color: var(--rw-muted);
    font-size: 14px;
    font-weight: 400;
    line-height: 1.9;
}

/* Main Feature */
.recipe-week-feature {
    display: grid;
    grid-template-columns: 1.05fr .95fr;
    min-height: 540px;
    background: var(--rw-card);
    border: 1px solid var(--rw-border);
    opacity: 0;
    transform: translateY(35px);
    transition: opacity .9s ease .15s, transform .9s ease .15s;
}

.recipe-week-section.rw-visible .recipe-week-feature {
    opacity: 1;
    transform: translateY(0);
}

/* Image */
.recipe-week-image {
    position: relative;
    min-height: 540px;
    overflow: hidden;
    background: #D3C2AE;
}

.recipe-week-image img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 540px;
    object-fit: cover;
    transition: transform 1.1s cubic-bezier(.2, .65, .3, 1);
}

.recipe-week-feature:hover .recipe-week-image img {
    transform: scale(1.045);
}

.recipe-week-image::after {
    position: absolute;
    inset: 45% 0 0;
    content: "";
    background: linear-gradient(
        to bottom,
        transparent,
        rgba(20, 16, 12, .65)
    );
    pointer-events: none;
}

.recipe-week-image-label {
    position: absolute;
    z-index: 2;
    top: 25px;
    left: 25px;
    padding: 12px 16px;
    background: var(--rw-accent);
    color: #302820;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.recipe-week-image-bottom {
    position: absolute;
    z-index: 2;
    right: 25px;
    bottom: 25px;
    left: 25px;
    display: flex;
    align-items: center;
    gap: 16px;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.7px;
}

.recipe-week-image-line {
    flex: 1;
    height: 1px;
    background: rgba(255, 255, 255, .65);
}

/* Content */
.recipe-week-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 48px clamp(28px, 4vw, 58px);
}

.recipe-week-topline {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 27px;
    color: var(--rw-muted);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.6px;
}

.recipe-week-dot {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #A77853;
}

.recipe-week-content h3 {
    margin: 0 0 22px;
    color: var(--rw-text);
    font-size: clamp(29px, 3.3vw, 43px);
    font-weight: 600;
    line-height: 1.22;
    letter-spacing: -1.2px;
}

.recipe-week-content h3 span {
    display: block;
    color: #A77853;
}

.recipe-week-description {
    margin: 0 0 30px;
    color: var(--rw-muted);
    font-size: 13px;
    font-weight: 400;
    line-height: 2;
}

.recipe-week-meta {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    padding: 22px 0;
    border-top: 1px solid var(--rw-border);
    border-bottom: 1px solid var(--rw-border);
}

.recipe-week-meta > div {
    display: flex;
    flex-direction: column;
    gap: 9px;
}

.recipe-week-meta-label {
    color: var(--rw-muted);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .7px;
}

.recipe-week-meta strong {
    color: var(--rw-text);
    font-size: 13px;
    font-weight: 700;
}

.recipe-week-spices {
    margin-top: 24px;
}

.recipe-week-spices-title {
    display: block;
    margin-bottom: 13px;
    color: var(--rw-muted);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.6px;
}

.recipe-week-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.recipe-week-tags span {
    padding: 9px 12px;
    border: 1px solid var(--rw-border);
    color: var(--rw-text);
    font-size: 10px;
    font-weight: 600;
}

/* Button */
.recipe-week-button {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    width: 100%;
    max-width: 270px;
    min-height: 54px;
    margin-top: 30px;
    padding: 7px 8px 7px 19px;
    background: var(--rw-text);
    color: #F8F4EC;
    text-decoration: none;
    font-size: 12px;
    font-weight: 700;
    transition: background .3s ease, color .3s ease;
}

.recipe-week-button:hover {
    background: #A77853;
    color: #fff;
}

.recipe-week-button-icon {
    display: grid;
    place-items: center;
    width: 39px;
    height: 39px;
    flex-shrink: 0;
    background: var(--rw-accent);
    color: #302820;
   
}


.recipe-week-footer {
    display: flex;
    justify-content: space-between;
    gap: 15px;
    margin-top: 32px;
    padding-top: 17px;
    border-top: 1px solid var(--rw-border);
    color: var(--rw-muted);
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 1.1px;
}

.recipe-week-footer-mark {
    white-space: nowrap;
}

/* Bottom Statement */
.recipe-week-bottom {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-top: 28px;
    opacity: 0;
    transform: translateY(15px);
    transition: opacity .7s ease .35s, transform .7s ease .35s;
}

.recipe-week-section.rw-visible .recipe-week-bottom {
    opacity: 1;
    transform: translateY(0);
}

.recipe-week-bottom-number {
    color: #A77853;
    font-size: 11px;
    font-weight: 700;
}

.recipe-week-bottom p {
    margin: 0;
    color: var(--rw-muted);
    font-size: 12px;
    font-weight: 600;
}

.recipe-week-bottom-line {
    flex: 1;
    height: 1px;
    background: var(--rw-border);
}

/* Tablet */
@media (max-width: 992px) {
    .recipe-week-section {
        padding: 80px 22px 60px;
    }

    .recipe-week-feature {
        grid-template-columns: 1fr 1fr;
    }

    .recipe-week-image,
    .recipe-week-image img {
        min-height: 500px;
    }

    .recipe-week-content {
        padding: 35px 27px;
    }

    .recipe-week-content h3 {
        font-size: 32px;
    }

    .recipe-week-meta {
        gap: 8px;
    }
}

/* Mobile */
@media (max-width: 767px) {
    .recipe-week-section {
        padding: 65px 18px 45px;
    }

    .recipe-week-heading {
        margin-bottom: 35px;
    }

    .recipe-week-heading h2 {
        font-size: 35px;
        letter-spacing: -1px;
    }

    .recipe-week-heading p {
        font-size: 13px;
    }

    .recipe-week-feature {
        grid-template-columns: 1fr;
    }

    .recipe-week-image,
    .recipe-week-image img {
        height: 360px;
        min-height: 360px;
    }

    .recipe-week-image-label {
        top: 18px;
        left: 18px;
    }

    .recipe-week-image-bottom {
        right: 18px;
        bottom: 18px;
        left: 18px;
    }

    .recipe-week-content {
        padding: 32px 22px;
    }

    .recipe-week-topline {
        margin-bottom: 21px;
        font-size: 8px;
    }

    .recipe-week-content h3 {
        font-size: 34px;
    }

    .recipe-week-description {
        font-size: 13px;
    }

    .recipe-week-meta {
        gap: 10px;
    }

    .recipe-week-meta-label {
        font-size: 8px;
    }

    .recipe-week-meta strong {
        font-size: 12px;
    }

    .recipe-week-tags span {
        font-size: 9px;
    }

    .recipe-week-button {
        max-width: 100%;
    }

    .recipe-week-bottom {
        gap: 12px;
    }

    .recipe-week-bottom p {
        font-size: 10px;
    }
}

@media (max-width: 380px) {
    .recipe-week-section {
        padding-right: 14px;
        padding-left: 14px;
    }

    .recipe-week-content {
        padding: 28px 17px;
    }

    .recipe-week-meta {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .recipe-week-meta > div {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }

    .recipe-week-heading h2 {
        font-size: 30px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .recipe-week-section *,
    .recipe-week-section *::before,
    .recipe-week-section *::after {
        animation: none !important;
        transition: none !important;
    }

    .recipe-week-heading,
    .recipe-week-feature,
    .recipe-week-bottom {
        opacity: 1;
        transform: none;
    }
}

.all-recipes-section {
    --ar-bg: #EEE8DC;
    --ar-surface: #F8F4EC;
    --ar-text: #302820;
    --ar-muted: #71675C;
    --ar-accent: #DDB699;
    --ar-border: rgba(48, 40, 32, .17);

    width: 100%;
    padding: 95px 24px 80px;
    background: var(--ar-bg);
    color: var(--ar-text);
    font-family: 'Quicksand', sans-serif;
    overflow: hidden;
}

.all-recipes-section *,
.all-recipes-section *::before,
.all-recipes-section *::after {
    box-sizing: border-box;
}

.all-recipes-container {
    max-width: 1240px;
    width: 100%;
    margin: 0 auto;
}

/* Heading — consistent Quicksand style */
.all-recipes-heading {
    max-width: 680px;
    margin: 0 auto 45px;
    text-align: center;
}

.all-recipes-eyebrow {
    display: inline-block;
    margin-bottom: 18px;
    color: var(--ar-muted);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 3px;
}

.all-recipes-heading h2 {
       margin: 0;
    color: var(--rms-text);
    font-family: "Quicksand", sans-serif;
    font-size: clamp(36px, 4.3vw, 58px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -1.5px;
    overflow-wrap: break-word;
}

.all-recipes-heading h2 span {
    color: #A77853;
    font-weight: 700;
    font-style: normal;
}

.all-recipes-heading p {
    max-width: 520px;
    margin: 0 auto;
    color: var(--ar-muted);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.9;
}

/* Filter Navigation */
.all-recipes-filters {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 40px;
}

.all-recipes-filter {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 43px;
    padding: 10px 18px;
    border: 1px solid var(--ar-border);
    border-radius: 0;
    background: transparent;
    color: var(--ar-muted);
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background .25s ease, color .25s ease, border-color .25s ease;
}

.all-recipes-filter span {
    font-size: 9px;
    opacity: .7;
}

.all-recipes-filter:hover,
.all-recipes-filter.active {
    border-color: var(--ar-text);
    background: var(--ar-text);
    color: var(--ar-surface);
}

/* Recipe Grid */
.all-recipes-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    column-gap: 25px;
    row-gap: 43px;
}

.all-recipe-item {
    min-width: 0;
    opacity: 1;
    transform: translateY(0);
    transition: opacity .25s ease, transform .25s ease;
}

.all-recipe-item.is-hidden {
    display: none;
}

/* Image */
.all-recipe-image {
    position: relative;
    display: block;
    height: 275px;
    overflow: hidden;
    background: #D4C6B4;
    text-decoration: none;
}

.all-recipe-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .7s cubic-bezier(.2, .65, .3, 1);
}

.all-recipe-item:hover .all-recipe-image img {
    transform: scale(1.06);
}

.all-recipe-number {
    position: absolute;
    top: 15px;
    left: 15px;
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    background: var(--ar-surface);
    color: var(--ar-text);
    font-size: 10px;
    font-weight: 700;
}

.all-recipe-arrow {
    position: absolute;
    right: 15px;
    bottom: 15px;
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    background: var(--ar-accent);
    color: var(--ar-text);
    transform: translateY(8px);
    opacity: 0;
    transition: transform .3s ease, opacity .3s ease;
}

.all-recipe-item:hover .all-recipe-arrow,
.all-recipe-item:focus-within .all-recipe-arrow {
    transform: translateY(0);
    opacity: 1;
}

/* Recipe Information */
.all-recipe-info {
    padding-top: 21px;
}

.all-recipe-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 13px;
    color: var(--ar-muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
}

.all-recipe-info h3 {
    margin: 0 0 11px;
    font-family: 'Quicksand', sans-serif;
    font-size: 20px;
    font-weight: 600;
    line-height: 1.45;
}

.all-recipe-info h3 a {
    color: var(--ar-text);
    text-decoration: none;
    transition: color .25s ease;
}

.all-recipe-info h3 a:hover {
    color: #A77853;
}

.all-recipe-info p {
    min-height: 48px;
    margin: 0;
    color: var(--ar-muted);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

.all-recipe-bottom {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 22px;
    padding-top: 15px;
    border-top: 1px solid var(--ar-border);
    color: var(--ar-muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .8px;
}

.all-recipe-line {
    flex: 1;
    height: 1px;
    background: var(--ar-border);
}

.all-recipe-bottom a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    color: var(--ar-text);
    text-decoration: none;
    letter-spacing: 0;
    transition: color .25s ease;
}

.all-recipe-bottom a:hover {
    color: #A77853;
}

.all-recipe-bottom a i {
    transition: transform .25s ease;
}

.all-recipe-bottom a:hover i {
    transform: translateX(4px);
}

/* Footer */
.all-recipes-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    margin-top: 65px;
    padding-top: 25px;
    border-top: 1px solid var(--ar-border);
}

.all-recipes-footer-index {
    color: var(--ar-muted);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.6px;
}

.all-recipes-footer-copy p {
    margin: 9px 0 0;
    color: var(--ar-text);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.7;
}

.all-recipes-view-all {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    min-height: 52px;
    padding: 0 17px;
    border: 1px solid var(--ar-text);
    color: var(--ar-text);
    font-size: 11px;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
    transition: background .3s ease, color .3s ease;
}

.all-recipes-view-all:hover {
    background: var(--ar-text);
    color: var(--ar-surface);
}

.all-recipes-view-all i {
    transition: transform .25s ease;
}

.all-recipes-view-all:hover i {
    transform: translateX(4px);
}

/* Tablet */
@media (max-width: 992px) {
    .all-recipes-section {
        padding: 75px 22px 65px;
    }

    .all-recipes-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 35px 22px;
    }

    .all-recipe-image {
        height: 260px;
    }

    .all-recipes-footer {
        margin-top: 50px;
    }
}

/* Mobile */
@media (max-width: 767px) {
    .all-recipes-section {
        padding: 60px 18px 50px;
    }

    .all-recipes-heading {
        margin-bottom: 32px;
    }

    .all-recipes-heading h2 {
        font-size: 35px;
        font-weight: 600;
        letter-spacing: -1px;
    }

    .all-recipes-heading h2 span {
        font-weight: 600;
    }

    .all-recipes-heading p {
        font-size: 13px;
    }

    .all-recipes-filters {
        justify-content: flex-start;
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 8px;
        margin-bottom: 27px;
        scrollbar-width: thin;
    }

    .all-recipes-filter {
        flex-shrink: 0;
        padding: 10px 14px;
        font-size: 10px;
    }

    .all-recipes-grid {
        grid-template-columns: 1fr;
        row-gap: 35px;
    }

    .all-recipe-image {
        height: clamp(230px, 68vw, 360px);
    }

    .all-recipe-arrow {
        opacity: 1;
        transform: none;
    }

    .all-recipe-info {
        padding-top: 17px;
    }

    .all-recipe-info h3 {
        font-size: 20px;
    }

    .all-recipe-info p {
        min-height: 0;
    }

    .all-recipes-footer {
        align-items: flex-start;
        flex-direction: column;
        gap: 22px;
        margin-top: 42px;
    }

    .all-recipes-view-all {
        width: 100%;
    }
}

@media (max-width: 380px) {
    .all-recipes-section {
        padding-right: 14px;
        padding-left: 14px;
    }

    .all-recipes-heading h2 {
        font-size: 30px;
    }

    .all-recipe-meta {
        font-size: 8px;
    }

    .all-recipe-info h3 {
        font-size: 18px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .all-recipes-section *,
    .all-recipes-section *::before,
    .all-recipes-section *::after {
        transition: none !important;
        animation: none !important;
    }
}


.spice-pairing-section {
    --spg-bg: #EEE8DC;
    --spg-panel: #F8F4EC;
    --spg-text: #302820;
    --spg-muted: #71675C;
    --spg-accent: #DDB699;
    --spg-border: rgba(48, 40, 32, .17);

    width: 100%;
    padding: 95px 24px 75px;
    background: var(--spg-bg);
    color: var(--spg-text);
    font-family: 'Quicksand', sans-serif;
    overflow: hidden;
}

.spice-pairing-section *,
.spice-pairing-section *::before,
.spice-pairing-section *::after {
    box-sizing: border-box;
}

.spice-pairing-container {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

/* Heading */
.spice-pairing-heading {
    max-width: 700px;
    margin: 0 auto 50px;
    text-align: center;
}

.spice-pairing-eyebrow {
    display: inline-block;
    margin-bottom: 18px;
    color: var(--spg-muted);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 3px;
}

.spice-pairing-heading h2 {
      margin: 0;
    color: var(--rms-text);
    font-family: "Quicksand", sans-serif;
    font-size: clamp(36px, 4.3vw, 58px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -1.5px;
    overflow-wrap: break-word;

}

.spice-pairing-heading h2 span {
    color: #A77853;
    font-weight: 700;
    font-style: normal;
}

.spice-pairing-heading p {
    max-width: 540px;
    margin: 0 auto;
    color: var(--spg-muted);
    font-size: 16+x;
    font-weight: 400;
    line-height: 1.9;
}

/* Main Layout */
.spice-pairing-layout {
    display: grid;
    grid-template-columns: .78fr 1.55fr;
    border: 1px solid var(--spg-border);
}

/* Intro Panel */
.spice-pairing-intro {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 38px 32px;
    background: var(--spg-panel);
    overflow: hidden;
}

.spice-pairing-index {
    color: var(--spg-muted);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.8px;
}

.spice-pairing-decor {
    display: grid;
    place-items: center;
    width: 78px;
    height: 78px;
    margin: 58px 0 30px;
    border: 1px solid var(--spg-border);
    border-radius: 50%;
    color: #A77853;
    font-size: 27px;
}

.spice-pairing-intro h3 {
    margin: 0 0 17px;
    color: var(--spg-text);
    font-size: clamp(26px, 2.5vw, 36px);
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: -1px;
}

.spice-pairing-intro h3 em {
    display: block;
    color: #A77853;
    font-style: normal;
    font-weight: 600;
}

.spice-pairing-intro > p {
    margin: 0;
    color: var(--spg-muted);
    font-size: 15px;
    font-weight: 400;
    line-height: 2;
}

.spice-pairing-shop {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    width: 100%;
    min-height: 49px;
    margin-top: 30px;
    padding: 0 14px;
    border: 1px solid var(--spg-text);
    color: var(--spg-text);
    font-size: 11px;
    font-weight: 700;
    text-decoration: none;
    transition: background .25s ease, color .25s ease;
}

.spice-pairing-shop:hover {
    background: var(--spg-text);
    color: var(--spg-panel);
}

.spice-pairing-shop i {
    transition: transform .25s ease;
}

.spice-pairing-shop:hover i {
    transform: translate(3px, -3px);
}

.spice-pairing-side-note {
    margin-top: auto;
    padding-top: 48px;
    color: var(--spg-muted);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.3px;
    line-height: 1.8;
}

/* Pairing List */
.spice-pairing-list {
    min-width: 0;
    padding: 0 28px;
    background: var(--spg-bg);
}

.spice-pairing-list-head {
    display: grid;
    grid-template-columns: .95fr 1.3fr .9fr;
    gap: 15px;
    align-items: center;
    min-height: 65px;
    border-bottom: 1px solid var(--spg-border);
    color: var(--spg-muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
}

.spice-pairing-row {
    display: grid;
    grid-template-columns: .95fr 1.3fr .9fr;
    gap: 15px;
    align-items: center;
    min-height: 98px;
    border-bottom: 1px solid var(--spg-border);
    transition: padding .25s ease, background .25s ease;
}

.spice-pairing-row:last-child {
    border-bottom: 0;
}

.spice-pairing-row:hover {
    padding-right: 8px;
    padding-left: 8px;
    background: var(--spg-panel);
}

.spice-pairing-dish {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.spice-pairing-row-number {
    padding-top: 4px;
    color: #A77853;
    font-size: 12px;
    font-weight: 700;
}

.spice-pairing-dish h4 {
    margin: 0;
    color: var(--spg-text);
    font-family: 'Quicksand', sans-serif;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.6;
}

.spice-pairing-spices {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 6px;
}

.spice-pairing-spices span {
    padding: 7px 8px;
    border: 1px solid var(--spg-border);
    color: var(--spg-muted);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
}

.spice-pairing-flavour {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    color: var(--spg-text);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.6;
}

.spice-pairing-flavour i {
    flex-shrink: 0;
    color: #A77853;
    font-size: 12px;
    opacity: 0;
    transform: translate(-4px, 4px);
    transition: opacity .25s ease, transform .25s ease;
}

.spice-pairing-row:hover .spice-pairing-flavour i {
    opacity: 1;
    transform: translate(0, 0);
}

/* Bottom Note */
.spice-pairing-bottom {
    display: flex;
    align-items: center;
    gap: 18px;
    margin-top: 27px;
}

.spice-pairing-bottom > span:first-child {
    color: var(--spg-muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.2px;
}

.spice-pairing-bottom-line {
    flex: 1;
    height: 1px;
    background: var(--spg-border);
}

.spice-pairing-bottom p {
    margin: 0;
    color: var(--spg-text);
    font-size: 13px;
    font-weight: 600;
}

/* Tablet */
@media (max-width: 992px) {
    .spice-pairing-section {
        padding: 75px 22px 60px;
    }

    .spice-pairing-layout {
        grid-template-columns: 1fr;
    }

    .spice-pairing-intro {
        padding: 30px;
    }

    .spice-pairing-decor {
        width: 62px;
        height: 62px;
        margin: 30px 0 20px;
        font-size: 23px;
    }

    .spice-pairing-intro h3 em {
        display: inline;
    }

    .spice-pairing-intro > p {
        max-width: 540px;
    }

    .spice-pairing-shop {
        max-width: 260px;
    }

    .spice-pairing-side-note {
        padding-top: 25px;
    }

    .spice-pairing-list {
        padding: 0 24px;
    }
}

/* Mobile */
@media (max-width: 767px) {
    .spice-pairing-section {
        padding: 60px 18px 48px;
    }

    .spice-pairing-heading {
        margin-bottom: 32px;
    }

    .spice-pairing-heading h2 {
        font-size: 35px;
        font-weight: 600;
        letter-spacing: -1px;
    }

    .spice-pairing-heading h2 span {
        font-weight: 600;
    }

    .spice-pairing-heading p {
        font-size: 13px;
    }

    .spice-pairing-intro {
        padding: 25px 22px;
    }

    .spice-pairing-decor {
        margin: 27px 0 20px;
    }

    .spice-pairing-intro h3 {
        font-size: 30px;
    }

    .spice-pairing-list {
        padding: 0 17px;
    }

    .spice-pairing-list-head {
        display: none;
    }

    .spice-pairing-row {
        grid-template-columns: 1fr;
        gap: 13px;
        padding: 20px 0;
    }

    .spice-pairing-row:hover {
        padding: 20px 8px;
    }

    .spice-pairing-dish {
        align-items: center;
    }

    .spice-pairing-dish h4 {
        font-size: 14px;
    }

    .spice-pairing-spices {
        padding-left: 25px;
    }

    .spice-pairing-flavour {
        padding-left: 25px;
        font-size: 11px;
    }

    .spice-pairing-flavour i {
        opacity: 1;
        transform: none;
    }

    .spice-pairing-bottom {
        align-items: flex-start;
        flex-wrap: wrap;
        gap: 12px;
    }

    .spice-pairing-bottom-line {
        align-self: center;
        min-width: 25px;
    }

    .spice-pairing-bottom p {
        font-size: 10px;
    }
}

@media (max-width: 380px) {
    .spice-pairing-section {
        padding-right: 14px;
        padding-left: 14px;
    }

    .spice-pairing-heading h2 {
        font-size: 30px;
    }

    .spice-pairing-list {
        padding: 0 12px;
    }

    .spice-pairing-spices span {
        font-size: 8px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .spice-pairing-section *,
    .spice-pairing-section *::before,
    .spice-pairing-section *::after {
        transition: none !important;
        animation: none !important;
    }
}


.cooking-secrets-section {
    --cs-bg: #EEE8DC;
    --cs-panel: #F8F4EC;
    --cs-text: #302820;
    --cs-muted: #71675C;
    --cs-accent: #DDB699;
    --cs-border: rgba(48, 40, 32, .17);

    width: 100%;
    padding: 95px 24px 75px;
    background: var(--cs-bg);
    color: var(--cs-text);
    font-family: 'Quicksand', sans-serif;
    overflow: hidden;
}

.cooking-secrets-section *,
.cooking-secrets-section *::before,
.cooking-secrets-section *::after {
    box-sizing: border-box;
}

.cooking-secrets-container {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

/* Heading */
.cooking-secrets-heading {
    max-width: 700px;
    margin: 0 auto 50px;
    text-align: center;
}

.cooking-secrets-eyebrow {
    display: inline-block;
    margin-bottom: 18px;
    color: var(--cs-muted);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 3px;
}

.cooking-secrets-heading h2 {
    margin: 0;
    color: var(--rms-text);
    font-family: "Quicksand", sans-serif;
    font-size: clamp(36px, 4.3vw, 58px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -1.5px;
    overflow-wrap: break-word;
}


.cooking-secrets-heading h2 span {
    color: #A77853;
    font-weight: 700;
    font-style: normal;
}

.cooking-secrets-heading > p {
    max-width: 540px;
    margin: 0 auto;
    color: var(--cs-muted);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.9;
}

/* Main Layout */
.cooking-secrets-layout {
    display: grid;
    grid-template-columns: .92fr 1.08fr;
    border: 1px solid var(--cs-border);
}

/* Featured Tip */
.cooking-secret-feature {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 530px;
    padding: 30px 34px 24px;
    background: var(--cs-text);
    color: var(--cs-panel);
}

.cooking-secret-feature-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    color: var(--cs-accent);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.8px;
}

.cooking-secret-feature-top i {
    font-size: 22px;
}

.cooking-secret-feature-content {
    padding: 40px 0;
}

.cooking-secret-category {
    display: inline-block;
    margin-bottom: 14px;
    color: #A77853;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.7px;
}

.cooking-secret-feature h3 {
    max-width: 400px;
    margin: 0 0 20px;
    color: var(--cs-panel);
    font-size: clamp(29px, 3vw, 42px);
    font-weight: 600;
    line-height: 1.23;
    letter-spacing: -1px;
}

.cooking-secret-feature h3 em {
    display: block;
    color: var(--cs-accent);
    font-style: normal;
    font-weight: 600;
}

.cooking-secret-feature-content > p {
    margin: 0;
    color: rgba(248, 244, 236, .77);
    font-size: 16px;
    font-weight: 400;
    line-height: 2;
}

.cooking-secret-rule {
    width: 100%;
    height: 1px;
    margin: 25px 0 22px;
    background: rgba(248, 244, 236, .2);
}

.cooking-secret-tip-label {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
    color: var(--cs-accent);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.cooking-secret-rule-text {
    max-width: 400px;
}

.cooking-secret-feature-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    padding-top: 18px;
    border-top: 1px solid rgba(248, 244, 236, .2);
    color: rgba(248, 244, 236, .7);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.3px;
}

/* Tips List */
.cooking-secrets-list {
    display: flex;
    flex-direction: column;
    padding: 0 28px;
    background: var(--cs-panel);
}

.cooking-secret-item {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) 42px;
    align-items: start;
    gap: 16px;
    flex: 1;
    padding: 29px 0;
    border-bottom: 1px solid var(--cs-border);
    transition: padding .25s ease;
}

.cooking-secret-item:last-child {
    border-bottom: 0;
}

.cooking-secret-item:hover {
    padding-right: 7px;
    padding-left: 7px;
}

.cooking-secret-number {
    padding-top: 3px;
    color: #A77853;
    font-size: 10px;
    font-weight: 700;
}

.cooking-secret-item-content {
    min-width: 0;
}

.cooking-secret-item-content .cooking-secret-category {
    margin-bottom: 9px;
}

.cooking-secret-item h3 {
    margin: 0 0 10px;
    color: var(--cs-text);
    font-size: 18px;
    font-weight: 600;
    line-height: 1.45;
}

.cooking-secret-item p {
    margin: 0 0 13px;
    color: var(--cs-muted);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.9;
}

.cooking-secret-read {
    color: var(--cs-muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
}

.cooking-secret-item-icon {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border: 1px solid var(--cs-border);
    color: #A77853;
    font-size: 16px;
    transition: background .25s ease, color .25s ease;
}

.cooking-secret-item:hover .cooking-secret-item-icon {
    background: var(--cs-accent);
    color: var(--cs-text);
}

/* Bottom Strip */
.cooking-secrets-bottom {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-top: 28px;
}

.cooking-secrets-bottom-mark {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    flex-shrink: 0;
    background: var(--cs-accent);
    color: var(--cs-text);
    font-size: 15px;
    font-weight: 700;
}

.cooking-secrets-bottom > p {
    margin: 0;
    color: var(--cs-text);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.7;
}

.cooking-secrets-bottom-line {
    flex: 1;
    height: 1px;
    background: var(--cs-border);
}

.cooking-secrets-bottom > a {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
    color: var(--cs-muted);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1px;
    text-decoration: none;
    transition: color .25s ease;
}

.cooking-secrets-bottom > a:hover {
    color: #A77853;
}

.cooking-secrets-bottom > a i {
    transition: transform .25s ease;
}

.cooking-secrets-bottom > a:hover i {
    transform: translateX(4px);
}

/* Tablet */
@media (max-width: 992px) {
    .cooking-secrets-section {
        padding: 75px 22px 60px;
    }

    .cooking-secrets-layout {
        grid-template-columns: 1fr;
    }

    .cooking-secret-feature {
        min-height: 0;
        padding: 30px;
    }

    .cooking-secret-feature-content {
        padding: 35px 0;
    }

    .cooking-secret-feature h3 em {
        display: inline;
    }

    .cooking-secrets-list {
        padding: 0 28px;
    }

    .cooking-secret-item {
        min-height: 0;
    }
}

/* Mobile */
@media (max-width: 767px) {
    .cooking-secrets-section {
        padding: 60px 18px 48px;
    }

    .cooking-secrets-heading {
        margin-bottom: 32px;
    }

    .cooking-secrets-heading h2 {
        font-size: 35px;
        font-weight: 600;
        letter-spacing: -1px;
    }

    .cooking-secrets-heading h2 span {
        font-weight: 600;
    }

    .cooking-secrets-heading > p {
        font-size: 13px;
    }

    .cooking-secret-feature {
        padding: 25px 22px;
    }

    .cooking-secret-feature-content {
        padding: 32px 0;
    }

    .cooking-secret-feature h3 {
        font-size: 32px;
    }

    .cooking-secret-feature-content > p {
        font-size: 12px;
    }

    .cooking-secrets-list {
        padding: 0 18px;
    }

    .cooking-secret-item {
        grid-template-columns: 22px minmax(0, 1fr) 36px;
        gap: 11px;
        padding: 23px 0;
    }

    .cooking-secret-item:hover {
        padding-right: 0;
        padding-left: 0;
    }

    .cooking-secret-item h3 {
        font-size: 16px;
    }

    .cooking-secret-item-icon {
        width: 36px;
        height: 36px;
        font-size: 14px;
    }

    .cooking-secrets-bottom {
        flex-wrap: wrap;
        gap: 13px;
    }

    .cooking-secrets-bottom > p {
        flex: 1;
        min-width: 160px;
        font-size: 11px;
    }

    .cooking-secrets-bottom-line {
        display: none;
    }

    .cooking-secrets-bottom > a {
        width: 100%;
        justify-content: space-between;
        padding-top: 15px;
        border-top: 1px solid var(--cs-border);
    }
}

@media (max-width: 380px) {
    .cooking-secrets-section {
        padding-right: 14px;
        padding-left: 14px;
    }

    .cooking-secrets-heading h2 {
        font-size: 30px;
    }

    .cooking-secret-feature h3 {
        font-size: 28px;
    }

    .cooking-secrets-list {
        padding: 0 13px;
    }

    .cooking-secret-item {
        grid-template-columns: 20px minmax(0, 1fr) 32px;
        gap: 8px;
    }

    .cooking-secret-item-icon {
        width: 32px;
        height: 32px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .cooking-secrets-section *,
    .cooking-secrets-section *::before,
    .cooking-secrets-section *::after {
        transition: none !important;
        animation: none !important;
    }
}

@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@400;500;600;700&display=swap');
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css');

.recipe-last-section {
    --rls-bg: #EEE8DC;
    --rls-surface: #F8F4EC;
    --rls-text: #302820;
    --rls-muted: #71675C;
    --rls-accent: #DDB699;
    --rls-border: rgba(48, 40, 32, 0.16);

    position: relative;
    width: 100%;
    overflow: hidden;
    padding: 100px 6%;
    background: var(--rls-bg);
    color: var(--rls-text);
    font-family: 'Quicksand', sans-serif;
}

.recipe-last-section *,
.recipe-last-section *::before,
.recipe-last-section *::after {
    box-sizing: border-box;
}

.recipe-last-section .rls-inner {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    align-items: center;
    gap: 65px;
}

/* LEFT CONTENT */

.recipe-last-section .rls-content {
    min-width: 0;
    animation: rlsEnterLeft 0.9s ease both;
}

.recipe-last-section .rls-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 13px;
    margin-bottom: 27px;
    color: var(--rls-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
}

.recipe-last-section .rls-eyebrow-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid var(--rls-border);
    border-radius: 50%;
    color: var(--rls-text);
    font-size: 11px;
    letter-spacing: 0;
}

.recipe-last-section .rls-heading {
    margin: 0;
    color: var(--rms-text);
    font-family: "Quicksand", sans-serif;
    font-size: clamp(36px, 4.3vw, 58px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -1.5px;
    overflow-wrap: break-word;
}

.recipe-last-section .rls-heading > span {
    display: block;
    font-weight: 700;
    font-style: normal;
}

.recipe-last-section .rls-heading .rls-highlight {
    color: #A77853;
}

.recipe-last-section .rls-description {
    max-width: 475px;
    margin: 25px 0 28px;
    color: var(--rls-muted);
    font-size: 13px;
    font-weight: 400;
    line-height: 1.95;
}

/* BUTTON */

.recipe-last-section .rls-actions {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
}

.recipe-last-section .rls-primary-btn {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    min-height: 55px;
    padding: 0 22px;
    border: 1px solid var(--rls-text);
    background: var(--rls-text);
    color: var(--rls-bg);
    text-decoration: none;
    font-size: 12px;
    font-weight: 700;
    transition:
        background 0.3s ease,
        color 0.3s ease,
        border-color 0.3s ease,
        transform 0.3s ease;
}

.recipe-last-section .rls-primary-btn i {
    font-size: 13px;
    transition: transform 0.3s ease;
}

.recipe-last-section .rls-primary-btn:hover {
    background: transparent;
    color: var(--rls-text);
    border-color: var(--rls-text);
    transform: translateY(-3px);
}

.recipe-last-section .rls-primary-btn:hover i {
    transform: translate(3px, -3px);
}

.recipe-last-section .rls-action-note {
    color: var(--rls-muted);
    font-size: 11px;
    font-weight: 500;
}

.recipe-last-section .rls-divider {
    width: 100%;
    max-width: 450px;
    height: 1px;
    margin: 35px 0 22px;
    background: var(--rls-border);
}

.recipe-last-section .rls-footer-note {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    color: var(--rls-muted);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.recipe-last-section .rls-footer-line {
    width: 22px;
    height: 1px;
    background: var(--rls-accent);
}

/* RIGHT VISUAL */

.recipe-last-section .rls-visual {
    position: relative;
    width: 100%;
    max-width: 510px;
    aspect-ratio: 1 / 1;
    justify-self: end;
    display: flex;
    align-items: center;
    justify-content: center;
    isolation: isolate;
    animation: rlsEnterRight 1s ease both;
}

.recipe-last-section .rls-visual::before {
    content: "";
    position: absolute;
    width: 72%;
    height: 72%;
    border-radius: 50%;
    background:
        radial-gradient(
            circle,
            rgba(221, 182, 153, 0.4) 0%,
            rgba(221, 182, 153, 0.12) 45%,
            transparent 72%
        );
    z-index: -2;
}

.recipe-last-section .rls-visual-ring {
    position: absolute;
    border: 1px solid var(--rls-border);
    border-radius: 50%;
    pointer-events: none;
}

.recipe-last-section .rls-ring-one {
    width: 76%;
    height: 76%;
    animation: rlsRotate 35s linear infinite;
}

.recipe-last-section .rls-ring-two {
    width: 94%;
    height: 94%;
    border-style: dashed;
    opacity: 0.65;
    animation: rlsRotateReverse 55s linear infinite;
}

/* Rotating orbits */

.recipe-last-section .rls-orbit {
    position: absolute;
    border: 1px solid rgba(167, 120, 83, 0.4);
    border-radius: 50%;
    pointer-events: none;
}

.recipe-last-section .rls-orbit-one {
    width: 85%;
    height: 47%;
    transform: rotate(-38deg);
    animation: rlsOrbitPulse 6s ease-in-out infinite;
}

.recipe-last-section .rls-orbit-two {
    width: 85%;
    height: 47%;
    transform: rotate(38deg);
    animation: rlsOrbitPulse 6s ease-in-out infinite reverse;
}

.recipe-last-section .rls-orbit-dot {
    position: absolute;
    top: 50%;
    left: -5px;
    width: 10px;
    height: 10px;
    border: 2px solid var(--rls-bg);
    border-radius: 50%;
    background: #A77853;
    box-shadow: 0 0 0 4px rgba(167, 120, 83, 0.15);
}

/* Central emblem */

.recipe-last-section .rls-spice-core {
    position: relative;
    z-index: 2;
    width: 49%;
    aspect-ratio: 1 / 1;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(167, 120, 83, 0.55);
    border-radius: 50%;
    background: var(--rls-surface);
    box-shadow:
        0 20px 55px rgba(48, 40, 32, 0.10),
        inset 0 0 0 8px var(--rls-surface),
        inset 0 0 0 9px var(--rls-border);
    animation: rlsCoreFloat 5s ease-in-out infinite;
}

.recipe-last-section .rls-core-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 12px;
    text-align: center;
}

.recipe-last-section .rls-core-inner i {
    color: #A77853;
    font-size: clamp(27px, 3vw, 42px);
}

.recipe-last-section .rls-core-inner > span {
    color: var(--rls-muted);
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 2px;
}

.recipe-last-section .rls-core-inner strong {
    color: var(--rls-text);
    font-size: clamp(12px, 1.5vw, 17px);
    font-weight: 700;
    line-height: 1.5;
}

/* Floating information labels */

.recipe-last-section .rls-spice-label {
    position: absolute;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 13px 15px;
    border: 1px solid var(--rls-border);
    background: var(--rls-surface);
    box-shadow: 0 12px 35px rgba(48, 40, 32, 0.07);
    animation: rlsLabelFloat 5s ease-in-out infinite;
}

.recipe-last-section .rls-label-top {
    top: 13%;
    right: -1%;
}

.recipe-last-section .rls-label-bottom {
    bottom: 13%;
    left: -2%;
    animation-delay: -2.5s;
}

.recipe-last-section .rls-label-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 37px;
    height: 37px;
    background: rgba(221, 182, 153, 0.35);
    color: #8D6040;
    font-size: 14px;
}

.recipe-last-section .rls-spice-label > span:last-child {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.recipe-last-section .rls-spice-label small {
    color: var(--rls-muted);
    font-size: 7px;
    font-weight: 700;
    letter-spacing: 1px;
}

.recipe-last-section .rls-spice-label strong {
    color: var(--rls-text);
    font-size: 11px;
    font-weight: 700;
}

.recipe-last-section .rls-floating-mark {
    position: absolute;
    color: var(--rls-muted);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 2px;
}

.recipe-last-section .rls-mark-one {
    top: 6%;
    left: 10%;
}

.recipe-last-section .rls-mark-two {
    right: 4%;
    bottom: 5%;
    font-size: 8px;
}

/* ANIMATIONS */

@keyframes rlsEnterLeft {
    from {
        opacity: 0;
        transform: translateX(-35px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes rlsEnterRight {
    from {
        opacity: 0;
        transform: translateX(35px) scale(0.96);
    }
    to {
        opacity: 1;
        transform: translateX(0) scale(1);
    }
}

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

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

@keyframes rlsOrbitPulse {
    0%, 100% { opacity: 0.55; }
    50% { opacity: 1; }
}

@keyframes rlsCoreFloat {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-9px); }
}

@keyframes rlsLabelFloat {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-7px); }
}

/* TABLET */

@media (max-width: 992px) {
    .recipe-last-section {
        padding: 80px 5%;
    }

    .recipe-last-section .rls-inner {
        grid-template-columns: 1fr 0.9fr;
        gap: 30px;
    }

    .recipe-last-section .rls-heading {
        font-size: clamp(34px, 4.5vw, 46px);
        letter-spacing: -1.2px;
    }

    .recipe-last-section .rls-spice-label {
        gap: 8px;
        padding: 10px;
    }

    .recipe-last-section .rls-label-icon {
        width: 31px;
        height: 31px;
    }
}

/* MOBILE */

@media (max-width: 767px) {
    .recipe-last-section {
        padding: 70px 22px;
    }

    .recipe-last-section .rls-inner {
        grid-template-columns: 1fr;
        gap: 42px;
    }

    .recipe-last-section .rls-heading {
        font-size: 38px;
        line-height: 1.2;
        letter-spacing: -1.2px;
    }

    .recipe-last-section .rls-description {
        margin: 20px 0 24px;
        font-size: 13px;
    }

    .recipe-last-section .rls-visual {
        width: 100%;
        max-width: 440px;
        justify-self: center;
    }

    .recipe-last-section .rls-label-top {
        right: 0;
    }

    .recipe-last-section .rls-label-bottom {
        left: 0;
    }

    .recipe-last-section .rls-spice-label {
        padding: 10px;
    }

    .recipe-last-section .rls-spice-label small {
        font-size: 6px;
    }

    .recipe-last-section .rls-spice-label strong {
        font-size: 10px;
    }

    .recipe-last-section .rls-footer-note {
        gap: 9px;
        font-size: 8px;
    }

    .recipe-last-section .rls-footer-line {
        width: 14px;
    }
}

/* SMALL MOBILE */

@media (max-width: 380px) {
    .recipe-last-section {
        padding: 60px 17px;
    }

    .recipe-last-section .rls-heading {
        font-size: 31px;
        letter-spacing: -0.8px;
    }

    .recipe-last-section .rls-visual {
        width: 100%;
    }

    .recipe-last-section .rls-spice-label {
        gap: 6px;
        padding: 8px;
    }

    .recipe-last-section .rls-label-icon {
        width: 27px;
        height: 27px;
        font-size: 11px;
    }

    .recipe-last-section .rls-spice-label strong {
        font-size: 9px;
    }

    .recipe-last-section .rls-core-inner > span {
        font-size: 7px;
        letter-spacing: 1px;
    }

    .recipe-last-section .rls-core-inner strong {
        font-size: 11px;
    }
}

/* REDUCED MOTION */

@media (prefers-reduced-motion: reduce) {
    .recipe-last-section .rls-content,
    .recipe-last-section .rls-visual,
    .recipe-last-section .rls-ring-one,
    .recipe-last-section .rls-ring-two,
    .recipe-last-section .rls-orbit,
    .recipe-last-section .rls-spice-core,
    .recipe-last-section .rls-spice-label {
        animation: none !important;
    }

    .recipe-last-section .rls-primary-btn,
    .recipe-last-section .rls-primary-btn i {
        transition: none;
    }
}


/* =====================================
   RECIPES PAGE PREMIUM BANNER
===================================== */

.spice-recipes-banner {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 430px;
    padding: 80px 6%;
    overflow: hidden;
    isolation: isolate;
    background-image: url("../images/pexels-change-c-c-974768353-32149287.jpg");
    background-position: center 48%;
    background-repeat: no-repeat;
    background-size: cover;
    text-align: center;
    color: #fff;
}

.spice-recipes-banner__overlay {
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(
        90deg,
        rgba(0, 0, 0, 0.78),
        rgba(24, 20, 15, 0.48),
        rgba(24, 20, 15, 0.72)
    );
}

.spice-recipes-banner__content {
    width: 100%;
    max-width: 850px;
    margin: 0 auto;
    animation: recipesBannerReveal 0.9s ease both;
}

.spice-recipes-banner__content h1 {
    margin: 0 auto 20px;
    max-width: 760px;
    color: #fff;
    font-family: "Quicksand", sans-serif;
    font-size: clamp(34px, 4.2vw, 56px);
    font-weight: 700;
    font-style: normal;
    line-height: 1.16;
    letter-spacing: -1.5px;
    overflow-wrap: break-word;
}

.spice-recipes-banner__content p {
    max-width: 650px;
    margin: 0 auto;
    color: rgba(255, 255, 255, 0.88);
    font-family: "Quicksand", sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.9;
}

@keyframes recipesBannerReveal {
    from {
        opacity: 0;
        transform: translateY(22px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* TABLET */

@media (max-width: 992px) {
    .spice-recipes-banner {
        min-height: 390px;
        padding: 70px 5%;
    }
}

/* MOBILE */

@media (max-width: 768px) {
    .spice-recipes-banner {
        min-height: 360px;
        padding: 65px 6%;
        background-position: center;
    }

    .spice-recipes-banner__content p {
        font-size: 15px;
        line-height: 1.8;
    }
}

@media (max-width: 480px) {
    .spice-recipes-banner {
        min-height: 340px;
        padding: 55px 22px;
    }

    .spice-recipes-banner__content h1 {
        font-size: 34px;
        line-height: 1.16;
        letter-spacing: -1.5px;
    }

    .spice-recipes-banner__content p {
        font-size: 14px;
    }
}

/* REDUCED MOTION */

@media (prefers-reduced-motion: reduce) {
    .spice-recipes-banner__content {
        animation: none;
    }
}

/* =====================================
   CONTACT PAGE PREMIUM BANNER
===================================== */

.spice-contact-banner {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 430px;
    padding: 80px 6%;
    overflow: hidden;
    isolation: isolate;
    background-image: url("../images/pexels-cristian-rojas-7601407.jpg");
    background-position: center 48%;
    background-repeat: no-repeat;
    background-size: cover;
    text-align: center;
    color: #fff;
}

.spice-contact-banner__overlay {
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(
        90deg,
        rgba(0, 0, 0, 0.78),
        rgba(24, 20, 15, 0.48),
        rgba(24, 20, 15, 0.72)
    );
}

.spice-contact-banner__content {
    width: 100%;
    max-width: 850px;
    margin: 0 auto;
    animation: contactBannerReveal 0.9s ease both;
}

.spice-contact-banner__content h1 {
    margin: 0 auto 20px;
    max-width: 760px;
    color: #fff;
    font-family: "Quicksand", sans-serif;
    font-size: clamp(34px, 4.2vw, 56px);
    font-weight: 700;
    font-style: normal;
    line-height: 1.16;
    letter-spacing: -1.5px;
    overflow-wrap: break-word;
}

.spice-contact-banner__content p {
    max-width: 650px;
    margin: 0 auto;
    color: rgba(255, 255, 255, 0.88);
    font-family: "Quicksand", sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.9;
}

@keyframes contactBannerReveal {
    from {
        opacity: 0;
        transform: translateY(22px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* TABLET */

@media (max-width: 992px) {
    .spice-contact-banner {
        min-height: 390px;
        padding: 70px 5%;
    }
}

/* MOBILE */

@media (max-width: 768px) {
    .spice-contact-banner {
        min-height: 360px;
        padding: 65px 6%;
        background-position: center;
    }

    .spice-contact-banner__content p {
        font-size: 15px;
        line-height: 1.8;
    }
}

@media (max-width: 480px) {
    .spice-contact-banner {
        min-height: 340px;
        padding: 55px 22px;
    }

    .spice-contact-banner__content h1 {
        font-size: 34px;
        line-height: 1.16;
        letter-spacing: -1.5px;
    }

    .spice-contact-banner__content p {
        font-size: 14px;
    }
}

/* REDUCED MOTION */

@media (prefers-reduced-motion: reduce) {
    .spice-contact-banner__content {
        animation: none;
    }
}


/* =====================================
   ABOUT US PAGE PREMIUM BANNER
===================================== */

.spice-about-banner {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 430px;
    padding: 80px 6%;
    overflow: hidden;
    isolation: isolate;
    background-image: url("../images/pexels-doraklimova-7835702.jpg");
    background-position: center 48%;
    background-repeat: no-repeat;
    background-size: cover;
    text-align: center;
    color: #fff;
}

.spice-about-banner__overlay {
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(
        90deg,
        rgba(0, 0, 0, 0.78),
        rgba(24, 20, 15, 0.48),
        rgba(24, 20, 15, 0.72)
    );
}

.spice-about-banner__content {
    width: 100%;
    max-width: 850px;
    margin: 0 auto;
    animation: aboutBannerReveal 0.9s ease both;
}

.spice-about-banner__content h1 {
    margin: 0 auto 20px;
    max-width: 760px;
    color: #fff;
    font-family: "Quicksand", sans-serif;
    font-size: clamp(34px, 4.2vw, 56px);
    font-weight: 700;
    font-style: normal;
    line-height: 1.16;
    letter-spacing: -1.5px;
    overflow-wrap: break-word;
}

.spice-about-banner__content p {
    max-width: 650px;
    margin: 0 auto;
    color: rgba(255, 255, 255, 0.88);
    font-family: "Quicksand", sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.9;
}

@keyframes aboutBannerReveal {
    from {
        opacity: 0;
        transform: translateY(22px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* TABLET */

@media (max-width: 992px) {
    .spice-about-banner {
        min-height: 390px;
        padding: 70px 5%;
    }
}

/* MOBILE */

@media (max-width: 768px) {
    .spice-about-banner {
        min-height: 360px;
        padding: 65px 6%;
        background-position: center;
    }

    .spice-about-banner__content p {
        font-size: 15px;
        line-height: 1.8;
    }
}

@media (max-width: 480px) {
    .spice-about-banner {
        min-height: 340px;
        padding: 55px 22px;
    }

    .spice-about-banner__content h1 {
        font-size: 34px;
        line-height: 1.16;
        letter-spacing: -1.5px;
    }

    .spice-about-banner__content p {
        font-size: 14px;
    }
}

/* REDUCED MOTION */

@media (prefers-reduced-motion: reduce) {
    .spice-about-banner__content {
        animation: none;
    }
}


/* =====================================
   CONTACT INFORMATION SECTION
===================================== */

.spice-contact-info {
    --sci-bg: #EEE8DC;
    --sci-card: #F8F4EC;
    --sci-text: #302820;
    --sci-muted: #71675C;
    --sci-accent: #DDB699;
    --sci-border: rgba(48, 40, 32, 0.15);

    padding: 95px 6%;
    background: var(--sci-bg);
    color: var(--sci-text);
    font-family: "Quicksand", sans-serif;
}

.spice-contact-info *,
.spice-contact-info *::before,
.spice-contact-info *::after {
    box-sizing: border-box;
}

.sci-container {
    max-width: 1200px;
    margin: 0 auto;
}

.sci-heading {
    max-width: 650px;
    margin-bottom: 48px;
    animation: sciReveal 0.8s ease both;
}

.sci-eyebrow {
    display: block;
    margin-bottom: 16px;
    color: var(--sci-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2.5px;
}

.sci-heading h2 {
     margin: 0;
    color: var(--rms-text);
    font-family: "Quicksand", sans-serif;
    font-size: clamp(36px, 4.3vw, 58px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -1.5px;
    overflow-wrap: break-word;
}

.sci-heading h2 span {
    color: #A77853;
    font-weight: 700;
}

.sci-heading > p {
    max-width: 540px;
    margin: 0;
    color: var(--sci-muted);
    font-size: 16px;
    line-height: 1.9;
}

.sci-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border-top: 1px solid var(--sci-border);
    border-bottom: 1px solid var(--sci-border);
}

.sci-item {
    position: relative;
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: flex-start;
    padding: 34px 30px 32px;
    background: transparent;
    color: var(--sci-text);
    text-decoration: none;
    transition: background 0.35s ease, transform 0.35s ease;
}

.sci-item + .sci-item {
    border-left: 1px solid var(--sci-border);
}

.sci-item:hover {
    background: var(--sci-card);
    transform: translateY(-4px);
}

.sci-icon {
    display: flex;
    width: 54px;
    height: 54px;
    align-items: center;
    justify-content: center;
    margin-bottom: 27px;
    border: 1px solid var(--sci-border);
    border-radius: 50%;
    color: #8D6040;
    font-size: 19px;
    transition: background 0.3s ease, color 0.3s ease;
}

.sci-item:hover .sci-icon {
    background: var(--sci-accent);
    color: var(--sci-text);
}

.sci-number {
    margin-bottom: 12px;
    color: var(--sci-muted);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1.8px;
}

.sci-item h3 {
    margin: 0 0 10px;
    color: var(--sci-text);
    font-size: 21px;
    font-weight: 600;
}

.sci-item > p {
    min-height: 52px;
    margin: 0 0 22px;
    color: var(--sci-muted);
    font-size: 16px;
    line-height: 1.8;
}

.sci-link {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin-top: auto;
    color: var(--sci-text);
    font-size: 13px;
    font-weight: 700;
    overflow-wrap: anywhere;
}

.sci-link i {
    color: #A77853;
    transition: transform 0.3s ease;
}

.sci-item:hover .sci-link i {
    transform: translateX(4px);
}

.sci-static-link {
    margin-top: auto;
}

@keyframes sciReveal {
    from {
        opacity: 0;
        transform: translateY(22px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* TABLET */

@media (max-width: 992px) {
    .spice-contact-info {
        padding: 75px 5%;
    }

    .sci-item {
        padding: 28px 20px;
    }

    .sci-item h3 {
        font-size: 19px;
    }
}

/* MOBILE */

@media (max-width: 767px) {
    .spice-contact-info {
        padding: 65px 22px;
    }

    .sci-heading {
        margin-bottom: 32px;
    }

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

    .sci-item {
        padding: 27px 5px;
    }

    .sci-item + .sci-item {
        border-left: 0;
        border-top: 1px solid var(--sci-border);
    }

    .sci-icon {
        margin-bottom: 19px;
    }

    .sci-item > p {
        min-height: 0;
        margin-bottom: 18px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .sci-heading {
        animation: none;
    }

    .sci-item,
    .sci-icon,
    .sci-link i {
        transition: none;
    }
}

/* =====================================
   CONTACT FORM + MESSAGE PANEL
===================================== */

.spice-message-section {
    --sms-bg: #F8F4EC;
    --sms-text: #302820;
    --sms-muted: #71675C;
    --sms-accent: #DDB699;
    --sms-border: rgba(48, 40, 32, 0.18);

    padding: 95px 6%;
    background: var(--sms-bg);
    color: var(--sms-text);
    font-family: "Quicksand", sans-serif;
}

.spice-message-section *,
.spice-message-section *::before,
.spice-message-section *::after {
    box-sizing: border-box;
}

.sms-container {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr);
    max-width: 1200px;
    margin: 0 auto;
    border: 1px solid var(--sms-border);
}

.sms-form-area {
    min-width: 0;
    padding: 45px;
    background: var(--sms-bg);
}

.sms-eyebrow {
    display: block;
    margin-bottom: 15px;
    color: var(--sms-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
}

.sms-form-area h2 {
    margin: 0 0 13px;
    color: var(--sms-text);
    font-size: clamp(31px, 3.5vw, 43px);
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: -1.2px; margin: 0;
    color: var(--rms-text);
    font-family: "Quicksand", sans-serif;
    font-size: clamp(36px, 4.3vw, 58px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -1.5px;
    overflow-wrap: break-word;
}

.sms-form-area h2 span {
    color: #A77853;
    font-weight: 700;
}

.sms-intro {
    margin: 0 0 32px;
    color: var(--sms-muted);
    font-size: 16px;
    line-height: 1.8;
}

.sms-form {
    display: flex;
    flex-direction: column;
    gap: 21px;
}

.sms-field-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.sms-field {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 9px;
}

.sms-field label {
    color: var(--sms-text);
    font-size: 12px;
    font-weight: 700;
}

.sms-field input,
.sms-field select,
.sms-field textarea {
    width: 100%;
    min-width: 0;
    padding: 14px 15px;
    border: 1px solid var(--sms-border);
    border-radius: 0;
    outline: none;
    background: transparent;
    color: var(--sms-text);
    font-family: "Quicksand", sans-serif;
    font-size: 12px;
    font-weight: 500;
    transition: border-color 0.25s ease, box-shadow 0.25s ease;
}

.sms-field input,
.sms-field select {
    min-height: 49px;
}

.sms-field textarea {
    min-height: 130px;
    resize: vertical;
}

.sms-field input::placeholder,
.sms-field textarea::placeholder {
    color: var(--sms-muted);
    opacity: 0.8;
}

.sms-field select option {
    color: #302820;
    background: #F8F4EC;
}

.sms-field input:focus,
.sms-field select:focus,
.sms-field textarea:focus {
    border-color: #A77853;
    box-shadow: 0 0 0 3px rgba(167, 120, 83, 0.10);
}

.sms-error {
    min-height: 0;
    color: #C62828;
    font-size: 11px;
    font-weight: 600;
}

.sms-submit {
    display: inline-flex;
    width: fit-content;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    gap: 24px;
    padding: 0 22px;
    border: 1px solid var(--sms-text);
    background: var(--sms-text);
    color: var(--sms-bg);
    cursor: pointer;
    font-family: "Quicksand", sans-serif;
    font-size: 12px;
    font-weight: 700;
    transition: background 0.3s ease, color 0.3s ease;
}

.sms-submit i {
    transition: transform 0.3s ease;
}

.sms-submit:hover {
    background: transparent;
    color: var(--sms-text);
}

.sms-submit:hover i {
    transform: translateX(4px);
}

.sms-status {
    min-height: 0;
    margin: 0;
    color: var(--sms-muted);
    font-size: 12px;
    line-height: 1.7;
}

.sms-status.is-error {
    color: #C62828;
}

/* RIGHT PANEL */

.sms-side-panel {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 45px 35px;
    overflow: hidden;
    background: #302820;
    color: #EEE8DC;
}

.sms-panel-index {
    color: #DDB699;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
}

.sms-panel-decoration {
    display: flex;
    width: 72px;
    height: 72px;
    align-items: center;
    justify-content: center;
    margin: 42px 0 27px;
    border: 1px solid rgba(221, 182, 153, 0.55);
    border-radius: 50%;
    color: #DDB699;
    font-size: 25px;
    animation: smsIconFloat 4s ease-in-out infinite;
}

.sms-side-panel h3 {
    max-width: 330px;
    margin: 0 0 17px;
    color: #EEE8DC;
    font-size: clamp(25px, 2.7vw, 34px);
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: -0.5px;
}

.sms-side-panel > p {
    margin: 0;
    color: rgba(238, 232, 220, 0.75);
    font-size: 16px;
    line-height: 1.95;
}

.sms-panel-rule {
    width: 100%;
    height: 1px;
    margin: 30px 0 25px;
    background: rgba(238, 232, 220, 0.2);
}

.sms-panel-point {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 17px;
    color: rgba(238, 232, 220, 0.88);
    font-size: 14px;
    line-height: 1.7;
}

.sms-panel-point i {
    margin-top: 3px;
    color: #DDB699;
    font-size: 16px;
}

.sms-panel-bottom {
    margin-top: auto;
    padding-top: 25px;
    color: #DDB699;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.6px;
}

@keyframes smsIconFloat {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-6px);
    }
}

/* TABLET */

@media (max-width: 992px) {
    .spice-message-section {
        padding: 75px 5%;
    }

    .sms-container {
        grid-template-columns: minmax(0, 1fr) minmax(250px, 0.8fr);
    }

    .sms-form-area {
        padding: 32px;
    }

    .sms-side-panel {
        padding: 35px 25px;
    }

    .sms-field-row {
        grid-template-columns: 1fr;
    }
}

/* MOBILE */

@media (max-width: 767px) {
    .spice-message-section {
        padding: 65px 22px;
    }

    .sms-container {
        grid-template-columns: 1fr;
    }

    .sms-form-area {
        padding: 28px 20px;
    }

    .sms-form-area h2 {
        font-size: 34px;
    }

    .sms-field-row {
        grid-template-columns: 1fr;
    }

    .sms-side-panel {
        min-height: 430px;
        padding: 32px 25px;
    }

    .sms-panel-decoration {
        margin-top: 30px;
    }
}

@media (max-width: 380px) {
    .spice-message-section {
        padding-right: 15px;
        padding-left: 15px;
    }

    .sms-form-area {
        padding: 25px 16px;
    }

    .sms-side-panel {
        padding: 28px 20px;
    }

    .sms-form-area h2 {
        font-size: 30px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .sms-panel-decoration {
        animation: none;
    }

    .sms-field input,
    .sms-field select,
    .sms-field textarea,
    .sms-submit,
    .sms-submit i {
        transition: none;
    }
}


/* =====================================
   CONTACT PAGE MAP SECTION
===================================== */

.spice-contact-map {
    --scm-bg: #EEE8DC;
    --scm-panel: #F8F4EC;
    --scm-text: #302820;
    --scm-muted: #71675C;
    --scm-accent: #DDB699;
    --scm-border: rgba(48, 40, 32, 0.16);

    padding: 90px 6%;
    background: var(--scm-bg);
    color: var(--scm-text);
    font-family: "Quicksand", sans-serif;
}

.spice-contact-map *,
.spice-contact-map *::before,
.spice-contact-map *::after {
    box-sizing: border-box;
}

.scm-container {
    max-width: 1200px;
    margin: 0 auto;
}

.scm-heading {
    max-width: 630px;
    margin-bottom: 38px;
}

.scm-eyebrow {
    display: block;
    margin-bottom: 14px;
    color: var(--scm-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2.5px;
}

.scm-heading h2 {
    margin: 0 0 15px;
    color: var(--scm-text);
    font-size: clamp(33px, 4vw, 47px);
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: -1.3px; margin: 0;
    color: var(--rms-text);
    font-family: "Quicksand", sans-serif;
    font-size: clamp(36px, 4.3vw, 58px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -1.5px;
    overflow-wrap: break-word;
}

.scm-heading h2 span {
    color: #A77853;
    font-weight: 700;
}

.scm-heading > p {
    margin: 0;
    color: var(--scm-muted);
    font-size: 16px;
    line-height: 1.9;
}

.scm-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.65fr);
    border: 1px solid var(--scm-border);
    background: var(--scm-panel);
}

/* MAP */

.scm-map-wrap {
    position: relative;
    min-width: 0;
    min-height: 480px;
    overflow: hidden;
    background: #DED7CA;
}

.scm-map-wrap iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    min-height: 480px;
    border: 0;
    filter: saturate(0.8);
}

.scm-map-link {
    position: absolute;
    right: 20px;
    bottom: 20px;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 14px 17px;
    background: var(--scm-panel);
    color: var(--scm-text);
    text-decoration: none;
    font-size: 11px;
    font-weight: 700;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.12);
    transition: background 0.3s ease, color 0.3s ease;
}

.scm-map-link:hover {
    background: var(--scm-accent);
}

.scm-map-link i {
    color: #A77853;
}

/* DETAILS PANEL */

.scm-details {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 38px 30px;
}

.scm-detail-number {
    color: var(--scm-muted);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.8px;
}

.scm-location-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    margin: 30px 0 22px;
    border: 1px solid var(--scm-border);
    border-radius: 50%;
    color: #A77853;
    font-size: 21px;
    transition: background 0.3s ease, transform 0.3s ease;
}

.scm-details:hover .scm-location-icon {
    background: var(--scm-accent);
    transform: translateY(-3px);
}

.scm-details h3 {
    margin: 0 0 14px;
    color: var(--scm-text);
    font-size: clamp(23px, 2.5vw, 30px);
    font-weight: 700;
    line-height: 1.35;
}

.scm-location-description {
    margin: 0;
    color: var(--scm-muted);
    font-size: 16px;
    line-height: 1.9;
}

.scm-detail-divider {
    width: 100%;
    height: 1px;
    margin: 26px 0;
    background: var(--scm-border);
}

.scm-address-row {
    display: flex;
    align-items: flex-start;
    gap: 13px;
    margin-bottom: 22px;
}

.scm-address-row > i {
    width: 17px;
    margin-top: 3px;
    color: #A77853;
    font-size: 14px;
}

.scm-address-row div {
    min-width: 0;
}

.scm-address-row span {
    display: block;
    margin-bottom: 6px;
    color: var(--scm-muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.scm-address-row p {
    margin: 0;
    color: var(--scm-text);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.7;
    overflow-wrap: anywhere;
}

.scm-contact-btn {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    width: 100%;
    min-height: 50px;
    margin-top: auto;
    padding: 0 17px;
    background: var(--scm-text);
    color: var(--scm-panel);
    text-decoration: none;
    font-size: 11px;
    font-weight: 700;
    transition: background 0.3s ease, color 0.3s ease;
}

.scm-contact-btn:hover {
    background: var(--scm-accent);
    color: var(--scm-text);
}

.scm-contact-btn i {
    transition: transform 0.3s ease;
}

.scm-contact-btn:hover i {
    transform: translateX(4px);
}

.scm-note {
    margin-top: 22px;
    color: var(--scm-muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

/* TABLET */

@media (max-width: 992px) {
    .spice-contact-map {
        padding: 75px 5%;
    }

    .scm-layout {
        grid-template-columns: minmax(0, 1fr) minmax(250px, 0.75fr);
    }

    .scm-map-wrap,
    .scm-map-wrap iframe {
        min-height: 500px;
    }

    .scm-details {
        padding: 30px 22px;
    }
}

/* MOBILE */

@media (max-width: 767px) {
    .spice-contact-map {
        padding: 65px 22px;
    }

    .scm-heading {
        margin-bottom: 28px;
    }

    .scm-layout {
        grid-template-columns: 1fr;
    }

    .scm-map-wrap {
        min-height: 350px;
    }

    .scm-map-wrap iframe {
        min-height: 350px;
    }

    .scm-details {
        min-height: 450px;
        padding: 30px 24px;
    }

    .scm-details h3 {
        font-size: 27px;
    }
}

@media (max-width: 380px) {
    .spice-contact-map {
        padding-right: 15px;
        padding-left: 15px;
    }

    .scm-map-wrap,
    .scm-map-wrap iframe {
        min-height: 300px;
    }

    .scm-details {
        padding: 25px 18px;
    }

    .scm-map-link {
        right: 10px;
        bottom: 10px;
        padding: 12px;
        font-size: 10px;
    }
}


@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@400;500;600;700&display=swap');

.spice-story-section {
    width: 100%;
    padding: 100px 6%;
    background: #EEE8DC;
    color: #302820;
    font-family: 'Quicksand', sans-serif;
    overflow: hidden;
    box-sizing: border-box;
}

.spice-story-section *,
.spice-story-section *::before,
.spice-story-section *::after {
    box-sizing: border-box;
}

.spice-story-container {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 0.95fr 1.05fr;
    align-items: center;
    gap: 85px;
}

/* Image Side */

.spice-story-visual {
    position: relative;
    min-width: 0;
    padding: 0 0 35px 30px;
    opacity: 0;
    animation: spiceStoryImageEnter 1s ease-out 0.15s forwards;
}

.spice-story-image {
    width: 100%;
    height: 550px;
    overflow: hidden;
    position: relative;
    background: #D8C9B4;
}

.spice-story-image::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(25, 27, 22, 0.02) 45%,
        rgba(25, 27, 22, 0.35) 100%
    );
    pointer-events: none;
}

.spice-story-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform 1s ease;
}

.spice-story-visual:hover .spice-story-image img {
    transform: scale(1.045);
}

.spice-story-image-label {
    position: absolute;
    left: 0;
    bottom: 12px;
    display: flex;
    align-items: center;
    gap: 12px;
    color: #71675C;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2.5px;
}

.spice-story-label-line {
    width: 40px;
    height: 1px;
    background: #A77853;
}

.spice-story-stamp {
    position: absolute;
    right: -28px;
    bottom: 75px;
    width: 142px;
    height: 142px;
    border: 1px solid rgba(167, 120, 83, 0.7);
    background: #EEE8DC;
    color: #302820;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 7px;
    transform: rotate(5deg);
}

.spice-story-stamp span {
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 1.3px;
    text-align: center;
}

.spice-story-stamp strong {
    color: #A77853;
    font-size: 25px;
    font-weight: 700;
    letter-spacing: 2px;
}

/* Content Side */

.spice-story-content {
    min-width: 0;
    opacity: 0;
    animation: spiceStoryContentEnter 0.9s ease-out 0.35s forwards;
}

.spice-story-eyebrow {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-bottom: 25px;
    color: #A77853;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 3px;
}

.spice-story-eyebrow-line {
    display: inline-block;
    width: 35px;
    height: 1px;
    background: #A77853;
}

.spice-story-content h2 {
    margin: 0 0 25px;
    color: #302820;
    font-size: clamp(34px, 3.7vw, 51px);
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: -1.5px;
}

.spice-story-content h2 span {
    display: block;
    color: #A77853;
}

.spice-story-intro {
    max-width: 510px;
    margin: 0 0 17px;
    color: #302820;
    font-size: 17px;
    font-weight: 600;
    line-height: 1.9;
}

.spice-story-description {
    max-width: 530px;
    margin: 0;
    color: #71675C;
    font-size: 16px;
    font-weight: 400;
    line-height: 2.1;
}

.spice-story-divider {
    width: 100%;
    height: 1px;
    margin: 30px 0 25px;
    background: rgba(113, 103, 92, 0.25);
}

.spice-story-values {
    display: flex;
    flex-direction: column;
    gap: 22px;
}

.spice-story-value {
    display: flex;
    align-items: flex-start;
    gap: 20px;
}

.spice-story-value-number {
    flex-shrink: 0;
    width: 37px;
    height: 37px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(167, 120, 83, 0.55);
    color: #A77853;
    font-size: 11px;
    font-weight: 700;
}

.spice-story-value h3 {
    margin: 0 0 7px;
    color: #302820;
    font-size: 15px;
    font-weight: 700;
}

.spice-story-value p {
    margin: 0;
    color: #71675C;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.8;
}

.spice-story-button {
    display: inline-flex;
    align-items: center;
    gap: 22px;
    margin-top: 35px;
    padding: 0;
    color: #302820;
    text-decoration: none;
    font-family: 'Quicksand', sans-serif;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.6px;
    transition: color 0.3s ease;
}

.spice-story-button-icon {
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #A77853;
    border-radius: 50%;
    color: #A77853;
    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease;
}

.spice-story-button:hover {
    color: #A77853;
}

.spice-story-button:hover .spice-story-button-icon {
    background: #A77853;
    color: #EEE8DC;
    transform: translateX(5px);
}

/* Entrance Animations */

@keyframes spiceStoryImageEnter {
    from {
        opacity: 0;
        transform: translateX(-35px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes spiceStoryContentEnter {
    from {
        opacity: 0;
        transform: translateX(35px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

/* Tablet */

@media (max-width: 992px) {
    .spice-story-section {
        padding: 75px 5%;
    }

    .spice-story-container {
        grid-template-columns: 0.9fr 1.1fr;
        gap: 45px;
    }

    .spice-story-image {
        height: 480px;
    }

    .spice-story-stamp {
        right: -15px;
        width: 120px;
        height: 120px;
    }

    .spice-story-content h2 {
        font-size: 37px;
    }

    .spice-story-intro {
        font-size: 15px;
    }

    .spice-story-description {
        font-size: 12px;
    }
}

/* Mobile */

@media (max-width: 767px) {
    .spice-story-section {
        padding: 60px 6%;
    }

    .spice-story-container {
        grid-template-columns: 1fr;
        gap: 45px;
    }

    .spice-story-visual {
        padding: 0 15px 28px 0;
    }

    .spice-story-image {
        height: 420px;
    }

    .spice-story-stamp {
        right: -5px;
        bottom: 55px;
        width: 112px;
        height: 112px;
    }

    .spice-story-stamp strong {
        font-size: 21px;
    }

    .spice-story-content h2 {
        font-size: clamp(34px, 8vw, 43px);
    }

    .spice-story-intro {
        font-size: 15px;
    }

    .spice-story-divider {
        margin: 25px 0;
    }

    .spice-story-button {
        margin-top: 30px;
    }
}

/* Small Mobile */

@media (max-width: 480px) {
    .spice-story-section {
        padding: 48px 5%;
    }

    .spice-story-container {
        gap: 35px;
    }

    .spice-story-image {
        height: 340px;
    }

    .spice-story-stamp {
        width: 95px;
        height: 95px;
        bottom: 48px;
    }

    .spice-story-stamp span {
        font-size: 7px;
    }

    .spice-story-stamp strong {
        font-size: 18px;
    }

    .spice-story-content h2 {
        font-size: 33px;
        letter-spacing: -0.8px;
    }

    .spice-story-eyebrow {
        margin-bottom: 20px;
    }

    .spice-story-value {
        gap: 13px;
    }

    .spice-story-value-number {
        width: 33px;
        height: 33px;
    }
}

/* Accessibility */

@media (prefers-reduced-motion: reduce) {
    .spice-story-visual,
    .spice-story-content {
        animation: none;
        opacity: 1;
        transform: none;
    }

    .spice-story-image img,
    .spice-story-button-icon {
        transition: none;
    }
}


.spice-mission-section {
    width: 100%;
    padding: 100px 6%;
    background: #191B16;
    color: #EEE8DC;
    font-family: 'Quicksand', sans-serif;
    overflow: hidden;
    box-sizing: border-box;
}

.spice-mission-section *,
.spice-mission-section *::before,
.spice-mission-section *::after {
    box-sizing: border-box;
}

.spice-mission-container {
    max-width: 1240px;
    width: 100%;
    margin: 0 auto;
}

/* Heading */

.spice-mission-heading {
    max-width: 690px;
    margin-bottom: 55px;
    opacity: 0;
    animation: spiceMissionFadeUp 0.85s ease-out 0.1s forwards;
}

.spice-mission-eyebrow {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 22px;
    color: #DDB699;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 3px;
}

.spice-mission-eyebrow span {
    width: 34px;
    height: 1px;
    background: #DDB699;
}

.spice-mission-heading h2 {
    margin: 0 0 20px;
    color: #EEE8DC;
    font-size: clamp(34px, 4vw, 51px);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -1.3px;
}

.spice-mission-heading h2 span {
    color: #DDB699;
}

.spice-mission-heading > p {
    max-width: 560px;
    margin: 0;
    color: #B7AA9B;
    font-size: 16px;
    font-weight: 400;
    line-height: 2;
}

/* Main Layout */

.spice-mission-layout {
    display: grid;
    grid-template-columns: 0.9fr 1.1fr;
    gap: 25px;
    align-items: stretch;
}

/* Mission Panel */

.spice-mission-main {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 480px;
    padding: 35px;
    background: #292B24;
    border: 1px solid rgba(221, 182, 153, 0.2);
    overflow: hidden;
    opacity: 0;
    animation: spiceMissionFadeUp 0.9s ease-out 0.3s forwards;
}

.spice-mission-main-top {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
}

.spice-mission-index {
    color: #DDB699;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 2px;
}

.spice-mission-icon {
    width: 46px;
    height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(221, 182, 153, 0.45);
    border-radius: 50%;
    color: #DDB699;
    font-size: 17px;
}

.spice-mission-main-content {
    position: relative;
    z-index: 1;
    margin-top: 70px;
}

.spice-mission-main-content h3 {
    max-width: 390px;
    margin: 0 0 20px;
    color: #EEE8DC;
    font-size: clamp(26px, 2.6vw, 35px);
    font-weight: 700;
    line-height: 1.35;
}

.spice-mission-main-content > p {
    max-width: 390px;
    margin: 0;
    color: #B7AA9B;
    font-size: 16px;
    font-weight: 400;
    line-height: 2;
}

.spice-mission-bottom-line {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 38px;
    color: #DDB699;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 2px;
}

.spice-mission-bottom-line span:first-child {
    width: 35px;
    height: 1px;
    background: #DDB699;
}

.spice-mission-watermark {
    position: absolute;
    right: -5px;
    bottom: -62px;
    color: rgba(221, 182, 153, 0.045);
    font-size: 240px;
    font-weight: 700;
    line-height: 1;
    pointer-events: none;
}

/* Values Grid */

.spice-mission-values {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-top: 1px solid rgba(238, 232, 220, 0.18);
    border-left: 1px solid rgba(238, 232, 220, 0.18);
}

.spice-mission-value {
    min-width: 0;
    padding: 28px 25px;
    border-right: 1px solid rgba(238, 232, 220, 0.18);
    border-bottom: 1px solid rgba(238, 232, 220, 0.18);
    opacity: 0;
    animation: spiceMissionFadeUp 0.7s ease-out forwards;
}

.spice-mission-value:nth-child(1) {
    animation-delay: 0.4s;
}

.spice-mission-value:nth-child(2) {
    animation-delay: 0.52s;
}

.spice-mission-value:nth-child(3) {
    animation-delay: 0.64s;
}

.spice-mission-value:nth-child(4) {
    animation-delay: 0.76s;
}

.spice-mission-value-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 38px;
}

.spice-mission-value-number {
    color: #DDB699;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1px;
}

.spice-mission-value-top i {
    color: #DDB699;
    font-size: 19px;
    transition: transform 0.3s ease;
}

.spice-mission-value:hover .spice-mission-value-top i {
    transform: translateY(-4px);
}

.spice-mission-value h3 {
    margin: 0 0 12px;
    color: #EEE8DC;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.5;
}

.spice-mission-value p {
    margin: 0;
    color: #B7AA9B;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.9;
}

/* Entrance Animation */

@keyframes spiceMissionFadeUp {
    from {
        opacity: 0;
        transform: translateY(28px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Tablet */

@media (max-width: 992px) {
    .spice-mission-section {
        padding: 75px 5%;
    }

    .spice-mission-layout {
        grid-template-columns: 1fr;
        gap: 25px;
    }

    .spice-mission-main {
        min-height: 390px;
    }

    .spice-mission-main-content {
        margin-top: 55px;
    }

    .spice-mission-heading {
        margin-bottom: 40px;
    }

    .spice-mission-value {
        padding: 28px;
    }

    .spice-mission-value-top {
        margin-bottom: 28px;
    }
}

/* Mobile */

@media (max-width: 767px) {
    .spice-mission-section {
        padding: 60px 6%;
    }

    .spice-mission-heading h2 {
        font-size: 36px;
    }

    .spice-mission-heading > p {
        font-size: 13px;
    }

    .spice-mission-main {
        min-height: 400px;
        padding: 27px;
    }

    .spice-mission-main-content h3 {
        font-size: 29px;
    }

    .spice-mission-values {
        grid-template-columns: 1fr;
    }

    .spice-mission-value {
        padding: 25px;
    }

    .spice-mission-value-top {
        margin-bottom: 22px;
    }

    .spice-mission-value h3 {
        font-size: 16px;
    }

    .spice-mission-watermark {
        font-size: 190px;
        bottom: -45px;
    }
}

/* Small Mobile */

@media (max-width: 480px) {
    .spice-mission-section {
        padding: 48px 5%;
    }

    .spice-mission-heading h2 {
        font-size: 31px;
        letter-spacing: -0.7px;
    }

    .spice-mission-main {
        min-height: 420px;
        padding: 23px;
    }

    .spice-mission-main-content {
        margin-top: 50px;
    }

    .spice-mission-main-content h3 {
        font-size: 26px;
    }

    .spice-mission-main-content > p {
        font-size: 12px;
    }

    .spice-mission-value {
        padding: 22px;
    }
}

/* Accessibility */

@media (prefers-reduced-motion: reduce) {
    .spice-mission-heading,
    .spice-mission-main,
    .spice-mission-value {
        animation: none;
        opacity: 1;
        transform: none;
    }

    .spice-mission-value-top i {
        transition: none;
    }
}

.spice-journey-section {
    width: 100%;
    padding: 100px 6%;
    background: #EEE8DC;
    color: #302820;
    font-family: 'Quicksand', sans-serif;
    overflow: hidden;
    box-sizing: border-box;
}

.spice-journey-section *,
.spice-journey-section *::before,
.spice-journey-section *::after {
    box-sizing: border-box;
}

.spice-journey-container {
    max-width: 1240px;
    width: 100%;
    margin: 0 auto;
}

/* Heading */

.spice-journey-heading {
    display: grid;
    grid-template-columns: 1fr 0.7fr;
    align-items: end;
    gap: 50px;
    margin-bottom: 42px;
    opacity: 0;
    animation: spiceJourneyFadeUp 0.8s ease-out 0.1s forwards;
}

.spice-journey-eyebrow {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
    color: #A77853;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2.5px;
}

.spice-journey-eyebrow > span {
    width: 32px;
    height: 1px;
    background: #A77853;
}

.spice-journey-heading h2 {
    margin: 0;
    color: #302820;
    font-size: clamp(36px, 4vw, 52px);
    font-weight: 700;
    line-height: 1.18;
    letter-spacing: -1.3px;
}

.spice-journey-heading h2 span {
    color: #A77853;
}

.spice-journey-heading > p {
    max-width: 430px;
    margin: 0 0 5px auto;
    color: #71675C;
    font-size: 16px;
    font-weight: 400;
    line-height: 2;
}

/* Featured Image */

.spice-journey-visual {
    position: relative;
    height: 400px;
    margin-bottom: 0;
    overflow: hidden;
    background: #D8C9B4;
    opacity: 0;
    animation: spiceJourneyImageEnter 1s ease-out 0.25s forwards;
}

.spice-journey-visual img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center 52%;
    transition: transform 1.2s ease;
}

.spice-journey-visual:hover img {
    transform: scale(1.035);
}

.spice-journey-visual-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        90deg,
        rgba(25, 27, 22, 0.48),
        rgba(25, 27, 22, 0.08) 75%
    );
    pointer-events: none;
}

.spice-journey-image-caption {
    position: absolute;
    left: 35px;
    bottom: 30px;
    display: flex;
    align-items: center;
    gap: 12px;
    color: #EEE8DC;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 1.8px;
}

.spice-journey-caption-line {
    width: 32px;
    height: 1px;
    background: #DDB699;
}

.spice-journey-image-number {
    position: absolute;
    top: 30px;
    right: 30px;
    padding: 12px 15px;
    border: 1px solid rgba(238, 232, 220, 0.55);
    color: #EEE8DC;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.4px;
}

/* Process Steps */

.spice-journey-process {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border-left: 1px solid rgba(113, 103, 92, 0.25);
    border-bottom: 1px solid rgba(113, 103, 92, 0.25);
}

.spice-journey-step {
    min-width: 0;
    padding: 30px 24px 32px;
    border-right: 1px solid rgba(113, 103, 92, 0.25);
    opacity: 0;
    animation: spiceJourneyFadeUp 0.7s ease-out forwards;
}

.spice-journey-step:nth-child(1) {
    animation-delay: 0.4s;
}

.spice-journey-step:nth-child(2) {
    animation-delay: 0.52s;
}

.spice-journey-step:nth-child(3) {
    animation-delay: 0.64s;
}

.spice-journey-step:nth-child(4) {
    animation-delay: 0.76s;
}

.spice-journey-step-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.spice-journey-step-number {
    color: #A77853;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1px;
}

.spice-journey-step-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 43px;
    height: 43px;
    border: 1px solid rgba(167, 120, 83, 0.4);
    border-radius: 50%;
    color: #A77853;
    font-size: 16px;
    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease;
}

.spice-journey-step:hover .spice-journey-step-icon {
    background: #A77853;
    color: #EEE8DC;
    transform: translateY(-3px);
}

.spice-journey-step-line {
    width: 100%;
    height: 1px;
    margin: 25px 0 22px;
    background: rgba(113, 103, 92, 0.25);
}

.spice-journey-step-line span {
    display: block;
    width: 30px;
    height: 1px;
    background: #A77853;
    transition: width 0.35s ease;
}

.spice-journey-step:hover .spice-journey-step-line span {
    width: 65px;
}

.spice-journey-step h3 {
    margin: 0 0 12px;
    color: #302820;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.5;
}

.spice-journey-step p {
    margin: 0;
    color: #71675C;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

/* Footer */

.spice-journey-footer {
    display: flex;
    align-items: center;
    gap: 18px;
    padding-top: 27px;
    opacity: 0;
    animation: spiceJourneyFadeUp 0.8s ease-out 0.85s forwards;
}

.spice-journey-footer-mark {
    flex-shrink: 0;
    width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(167, 120, 83, 0.45);
    border-radius: 50%;
    color: #A77853;
    font-size: 14px;
}

.spice-journey-footer > p {
    flex: 1;
    margin: 0;
    color: #71675C;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.8;
}

.spice-journey-link {
    display: inline-flex;
    align-items: center;
    gap: 13px;
    color: #302820;
    text-decoration: none;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1px;
    transition: color 0.3s ease;
}

.spice-journey-link i {
    color: #A77853;
    transition: transform 0.3s ease;
}

.spice-journey-link:hover {
    color: #A77853;
}

.spice-journey-link:hover i {
    transform: translateX(4px);
}

/* Entrance Animations */

@keyframes spiceJourneyFadeUp {
    from {
        opacity: 0;
        transform: translateY(25px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes spiceJourneyImageEnter {
    from {
        opacity: 0;
        transform: translateY(20px);
        clip-path: inset(8% 0 8% 0);
    }

    to {
        opacity: 1;
        transform: translateY(0);
        clip-path: inset(0 0 0 0);
    }
}

/* Tablet */

@media (max-width: 992px) {
    .spice-journey-section {
        padding: 75px 5%;
    }

    .spice-journey-heading {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .spice-journey-heading > p {
        margin: 0;
    }

    .spice-journey-visual {
        height: 340px;
    }

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

    .spice-journey-step {
        padding: 28px;
        border-bottom: 1px solid rgba(113, 103, 92, 0.25);
    }

    .spice-journey-step:nth-child(3),
    .spice-journey-step:nth-child(4) {
        border-bottom: none;
    }
}

/* Mobile */

@media (max-width: 767px) {
    .spice-journey-section {
        padding: 60px 6%;
    }

    .spice-journey-heading {
        margin-bottom: 30px;
    }

    .spice-journey-heading h2 {
        font-size: 37px;
    }

    .spice-journey-visual {
        height: 290px;
    }

    .spice-journey-image-caption {
        left: 20px;
        bottom: 20px;
        right: 15px;
        font-size: 8px;
        letter-spacing: 1px;
    }

    .spice-journey-image-number {
        top: 18px;
        right: 18px;
        padding: 10px;
        font-size: 8px;
    }

    .spice-journey-step {
        padding: 22px 18px;
    }

    .spice-journey-step h3 {
        font-size: 15px;
    }

    .spice-journey-footer {
        flex-wrap: wrap;
        gap: 14px;
    }

    .spice-journey-footer > p {
        flex-basis: calc(100% - 55px);
    }

    .spice-journey-link {
        margin-left: 52px;
    }
}

/* Small Mobile */

@media (max-width: 480px) {
    .spice-journey-section {
        padding: 48px 5%;
    }

    .spice-journey-heading h2 {
        font-size: 32px;
        letter-spacing: -0.7px;
    }

    .spice-journey-heading > p {
        font-size: 12px;
    }

    .spice-journey-visual {
        height: 250px;
    }

    .spice-journey-process {
        grid-template-columns: 1fr;
    }

    .spice-journey-step,
    .spice-journey-step:nth-child(3) {
        border-bottom: 1px solid rgba(113, 103, 92, 0.25);
    }

    .spice-journey-step:last-child {
        border-bottom: none;
    }

    .spice-journey-step {
        padding: 23px 20px;
    }

    .spice-journey-step-top {
        margin-bottom: 0;
    }

    .spice-journey-step-line {
        margin: 18px 0;
    }
}

/* Accessibility */

@media (prefers-reduced-motion: reduce) {
    .spice-journey-heading,
    .spice-journey-visual,
    .spice-journey-step,
    .spice-journey-footer {
        animation: none;
        opacity: 1;
        transform: none;
        clip-path: none;
    }

    .spice-journey-visual img,
    .spice-journey-step-icon,
    .spice-journey-step-line span,
    .spice-journey-link i {
        transition: none;
    }
}


.spice-difference-section {
    width: 100%;
    padding: 100px 6%;
    background: #EEE8DC;
    color: #302820;
    font-family: 'Quicksand', sans-serif;
    overflow: hidden;
    box-sizing: border-box;
}

.spice-difference-section *,
.spice-difference-section *::before,
.spice-difference-section *::after {
    box-sizing: border-box;
}

.spice-difference-container {
    max-width: 1240px;
    width: 100%;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 0.92fr;
    gap: 85px;
    align-items: start;
}

/* Left Editorial */

.spice-difference-left {
    min-width: 0;
    opacity: 0;
    animation: spiceDifferenceLeftEnter 0.9s ease-out 0.1s forwards;
}

.spice-difference-eyebrow {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 25px;
    color: #A77853;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 2px;
    line-height: 1.8;
}

.spice-difference-eyebrow > span {
    flex-shrink: 0;
    width: 32px;
    height: 1px;
    background: #A77853;
}

.spice-difference-left h2 {
    margin: 0 0 24px;
    color: #302820;
    font-size: clamp(37px, 4.1vw, 53px);
    font-weight: 700;
    line-height: 1.18;
    letter-spacing: -1.5px;
}

.spice-difference-left h2 span {
    display: block;
    margin-top: 8px;
    color: #A77853;
}

.spice-difference-intro {
    max-width: 480px;
    margin: 0;
    color: #71675C;
    font-size: 16px;
    font-weight: 400;
    line-height: 2.1;
}

.spice-difference-button {
    display: inline-flex;
    align-items: center;
    gap: 20px;
    margin-top: 28px;
    color: #302820;
    text-decoration: none;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.3px;
    transition: color 0.3s ease;
}

.spice-difference-button i {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #A77853;
    border-radius: 50%;
    color: #A77853;
    transition:
        color 0.3s ease,
        background 0.3s ease,
        transform 0.3s ease;
}

.spice-difference-button:hover {
    color: #A77853;
}

.spice-difference-button:hover i {
    background: #A77853;
    color: #EEE8DC;
    transform: translateX(4px);
}

/* Image */

.spice-difference-image-wrap {
    position: relative;
    width: 100%;
    height: 420px;
    margin-top: 40px;
    overflow: hidden;
    background: #D8C9B4;
}

.spice-difference-image-wrap img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform 1s ease;
}

.spice-difference-image-wrap:hover img {
    transform: scale(1.04);
}

.spice-difference-image-caption {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 20px;
    background: linear-gradient(
        transparent,
        rgba(25, 27, 22, 0.8)
    );
    color: #EEE8DC;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1.2px;
}

/* Right Features */

.spice-difference-right {
    min-width: 0;
    padding-top: 8px;
    opacity: 0;
    animation: spiceDifferenceRightEnter 0.9s ease-out 0.25s forwards;
}

.spice-difference-side-heading {
    display: flex;
    align-items: center;
    gap: 18px;
    margin-bottom: 14px;
    color: #A77853;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
}

.spice-difference-side-line {
    flex: 1;
    height: 1px;
    background: rgba(113, 103, 92, 0.28);
}

.spice-difference-feature {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) 42px;
    align-items: start;
    gap: 18px;
    padding: 27px 0;
    border-bottom: 1px solid rgba(113, 103, 92, 0.25);
    opacity: 0;
    animation: spiceDifferenceFeatureEnter 0.7s ease-out forwards;
}

.spice-difference-feature:nth-of-type(2) {
    animation-delay: 0.35s;
}

.spice-difference-feature:nth-of-type(3) {
    animation-delay: 0.48s;
}

.spice-difference-feature:nth-of-type(4) {
    animation-delay: 0.61s;
}

.spice-difference-feature:nth-of-type(5) {
    animation-delay: 0.74s;
}

.spice-difference-feature-number {
    padding-top: 3px;
    color: #A77853;
    font-size: 10px;
    font-weight: 700;
}

.spice-difference-feature-content h3 {
    margin: 0 0 9px;
    color: #302820;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.5;
    transition: color 0.3s ease;
}

.spice-difference-feature-content p {
    margin: 0;
    color: #71675C;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

.spice-difference-feature-icon {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(167, 120, 83, 0.4);
    border-radius: 50%;
    color: #A77853;
    font-size: 14px;
    transition:
        color 0.3s ease,
        background 0.3s ease,
        transform 0.3s ease;
}

.spice-difference-feature:hover .spice-difference-feature-content h3 {
    color: #A77853;
}

.spice-difference-feature:hover .spice-difference-feature-icon {
    color: #EEE8DC;
    background: #A77853;
    transform: translateY(-3px);
}

/* Quote */

.spice-difference-note {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin-top: 28px;
    padding: 23px;
    background: rgba(167, 120, 83, 0.08);
    border-left: 2px solid #A77853;
}

.spice-difference-note > i {
    flex-shrink: 0;
    padding-top: 3px;
    color: #A77853;
    font-size: 16px;
}

.spice-difference-note p {
    margin: 0;
    color: #71675C;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.9;
}

/* Entrance Animations */

@keyframes spiceDifferenceLeftEnter {
    from {
        opacity: 0;
        transform: translateX(-28px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes spiceDifferenceRightEnter {
    from {
        opacity: 0;
        transform: translateX(28px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes spiceDifferenceFeatureEnter {
    from {
        opacity: 0;
        transform: translateY(18px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Tablet */

@media (max-width: 992px) {
    .spice-difference-section {
        padding: 75px 5%;
    }

    .spice-difference-container {
        grid-template-columns: 1fr 1fr;
        gap: 35px;
    }

    .spice-difference-left h2 {
        font-size: 38px;
    }

    .spice-difference-image-wrap {
        height: 300px;
    }

    .spice-difference-feature {
        grid-template-columns: 23px minmax(0, 1fr) 36px;
        gap: 12px;
        padding: 23px 0;
    }

    .spice-difference-feature-icon {
        width: 35px;
        height: 35px;
        font-size: 12px;
    }

    .spice-difference-feature-content h3 {
        font-size: 14px;
    }

    .spice-difference-feature-content p {
        font-size: 11px;
    }
}

/* Mobile */

@media (max-width: 767px) {
    .spice-difference-section {
        padding: 60px 6%;
    }

    .spice-difference-container {
        grid-template-columns: 1fr;
        gap: 45px;
    }

    .spice-difference-left h2 {
        font-size: clamp(35px, 8vw, 45px);
    }

    .spice-difference-image-wrap {
        height: 320px;
        margin-top: 30px;
    }

    .spice-difference-right {
        padding-top: 0;
    }

    .spice-difference-feature {
        grid-template-columns: 28px minmax(0, 1fr) 40px;
        gap: 16px;
        padding: 24px 0;
    }

    .spice-difference-feature-content h3 {
        font-size: 16px;
    }

    .spice-difference-feature-content p {
        font-size: 12px;
    }
}

/* Small Mobile */

@media (max-width: 480px) {
    .spice-difference-section {
        padding: 48px 5%;
    }

    .spice-difference-left h2 {
        font-size: 33px;
        letter-spacing: -0.8px;
    }

    .spice-difference-intro {
        font-size: 12px;
    }

    .spice-difference-image-wrap {
        height: 260px;
    }

    .spice-difference-image-caption {
        padding: 14px;
        font-size: 7px;
        letter-spacing: 0.7px;
    }

    .spice-difference-feature {
        grid-template-columns: 23px minmax(0, 1fr) 34px;
        gap: 11px;
    }

    .spice-difference-feature-icon {
        width: 33px;
        height: 33px;
    }

    .spice-difference-feature-content h3 {
        font-size: 14px;
    }

    .spice-difference-feature-content p {
        font-size: 11px;
    }

    .spice-difference-note {
        padding: 18px;
    }
}

/* Accessibility */

@media (prefers-reduced-motion: reduce) {
    .spice-difference-left,
    .spice-difference-right,
    .spice-difference-feature {
        animation: none;
        opacity: 1;
        transform: none;
    }

    .spice-difference-image-wrap img,
    .spice-difference-button i,
    .spice-difference-feature-icon {
        transition: none;
    }
}

/* =====================================
   SPICE PROMISE - EDITORIAL SHOWCASE
===================================== */

.spice-promise-section {
    width: 100%;
    padding: 100px 24px 90px;
    background: #EEE8DC;
    color: #302820;
    font-family: 'Quicksand', sans-serif;
    overflow: hidden;
}

.spice-promise-container {
    max-width: 1240px;
    width: 100%;
    margin: 0 auto;
}

.spice-promise-eyebrow {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 25px;
    color: #A77853;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2.5px;
}

.spice-promise-eyebrow > span {
    width: 30px;
    height: 1px;
    background: #A77853;
}

.spice-promise-heading-row {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 50px;
    margin-bottom: 55px;
}

.spice-promise-heading-row h2 {
     margin: 0;
    color: var(--rms-text);
    font-family: "Quicksand", sans-serif;
    font-size: clamp(36px, 4.3vw, 58px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -1.5px;
    overflow-wrap: break-word;
}

.spice-promise-heading-row h2 em {
    color: #A77853;
    font-weight: 700;
    font-style: normal;
}

.spice-promise-heading-row > p {
    max-width: 380px;
    margin: 0 0 6px;
    color: #71675C;
    font-size: 16px;
    line-height: 1.95;
}

/* SHOWCASE */

.spice-promise-showcase {
    display: grid;
    grid-template-columns: 1.12fr 0.88fr;
    gap: 22px;
    min-height: 580px;
}

.spice-promise-feature {
    position: relative;
    min-width: 0;
    overflow: hidden;
    background: #D8C8B4;
}

.spice-promise-feature img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.8s ease;
}

.spice-promise-feature:hover img {
    transform: scale(1.05);
}

.spice-promise-feature-large {
    min-height: 580px;
}

.spice-promise-feature-large::after,
.spice-promise-feature-small::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(25, 27, 22, 0.02) 20%,
        rgba(25, 27, 22, 0.78) 100%
    );
    pointer-events: none;
}

.spice-promise-feature-overlay {
    position: absolute;
    z-index: 1;
    left: 35px;
    right: 30px;
    bottom: 38px;
    color: #fff;
}

.spice-promise-feature-overlay > span,
.spice-promise-small-overlay > span {
    display: block;
    margin-bottom: 15px;
    font-size: 10px;
    letter-spacing: 2px;
    font-weight: 700;
    color: #E4C5A8;
}

.spice-promise-feature-overlay h3 {
    max-width: 450px;
    margin: 0;
    font-size: clamp(32px, 4vw, 48px);
    line-height: 1.13;
    letter-spacing: -1px;
    font-weight: 600;
}

/* RIGHT COLUMN */

.spice-promise-side {
    display: grid;
    grid-template-rows: 0.8fr 1.2fr;
    gap: 22px;
    min-width: 0;
}

.spice-promise-statement {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 32px 35px;
    background: #DCD0BE;
}

.spice-promise-quote {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin-bottom: 18px;
    border: 1px solid rgba(167, 120, 83, 0.45);
    border-radius: 50%;
    color: #A77853;
    font-size: 14px;
}

.spice-promise-statement p {
    max-width: 370px;
    margin: 0 0 22px;
    color: #302820;
    font-size: clamp(19px, 2.1vw, 27px);
    line-height: 1.55;
    font-weight: 500;
}

.spice-promise-caption {
    color: #A77853;
    font-size: 10px;
    letter-spacing: 2px;
    font-weight: 700;
}

.spice-promise-feature-small {
    min-height: 0;
}

.spice-promise-small-overlay {
    position: absolute;
    z-index: 1;
    left: 28px;
    right: 25px;
    bottom: 27px;
    color: #fff;
}

.spice-promise-small-overlay > span {
    margin-bottom: 10px;
    font-size: 9px;
}

.spice-promise-small-overlay h3 {
    max-width: 330px;
    margin: 0;
    font-size: clamp(21px, 2.4vw, 29px);
    line-height: 1.35;
    font-weight: 600;
}

/* BOTTOM VALUE STRIP */

.spice-promise-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 25px;
    margin-top: 35px;
    padding-top: 28px;
    border-top: 1px solid rgba(48, 40, 32, 0.2);
}

.spice-promise-bottom-title {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #71675C;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.4px;
}

.spice-promise-bottom-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #A77853;
}

.spice-promise-values {
    display: flex;
    flex-wrap: wrap;
    gap: 14px 22px;
}

.spice-promise-values span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #302820;
    font-size: 11px;
    font-weight: 600;
}

.spice-promise-values i {
    color: #A77853;
    font-size: 10px;
}

.spice-promise-cta {
    display: inline-flex;
    align-items: center;
    gap: 18px;
    padding: 14px 18px;
    background: #302820;
    color: #EEE8DC;
    text-decoration: none;
    font-size: 11px;
    font-weight: 700;
    transition: background 0.3s ease, gap 0.3s ease;
}

.spice-promise-cta i {
    font-size: 12px;
    transition: transform 0.3s ease;
}

.spice-promise-cta:hover {
    gap: 23px;
    background: #A77853;
    color: #fff;
}

.spice-promise-cta:hover i {
    transform: translateX(3px);
}

/* ENTRANCE ANIMATIONS */

@keyframes spicePromiseFadeUp {
    from {
        opacity: 0;
        transform: translateY(28px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.spice-promise-eyebrow,
.spice-promise-heading-row h2,
.spice-promise-heading-row > p,
.spice-promise-feature-large,
.spice-promise-statement,
.spice-promise-feature-small,
.spice-promise-bottom {
    animation: spicePromiseFadeUp 0.8s ease both;
}

.spice-promise-heading-row > p {
    animation-delay: 0.12s;
}

.spice-promise-feature-large {
    animation-delay: 0.15s;
}

.spice-promise-statement {
    animation-delay: 0.25s;
}

.spice-promise-feature-small {
    animation-delay: 0.35s;
}

.spice-promise-bottom {
    animation-delay: 0.45s;
}

/* TABLET */

@media (max-width: 1024px) {
    .spice-promise-section {
        padding: 80px 24px 70px;
    }

    .spice-promise-heading-row {
        gap: 30px;
    }

    .spice-promise-showcase {
        min-height: 500px;
        gap: 16px;
    }

    .spice-promise-feature-large {
        min-height: 500px;
    }

    .spice-promise-side {
        gap: 16px;
    }

    .spice-promise-statement {
        padding: 25px;
    }

    .spice-promise-feature-overlay {
        left: 25px;
        bottom: 28px;
    }

    .spice-promise-bottom {
        align-items: flex-start;
    }

    .spice-promise-bottom-title {
        width: 100%;
    }
}

/* MOBILE */

@media (max-width: 767px) {
    .spice-promise-section {
        padding: 65px 20px 55px;
    }

    .spice-promise-heading-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
        margin-bottom: 35px;
    }

    .spice-promise-heading-row h2 {
        font-size: clamp(36px, 8.5vw, 49px);
        letter-spacing: -1px;
    }

    .spice-promise-heading-row > p {
        max-width: 100%;
        font-size: 13px;
    }

    .spice-promise-showcase {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .spice-promise-feature-large {
        min-height: 430px;
    }

    .spice-promise-feature-large img {
        height: 430px;
    }

    .spice-promise-side {
        grid-template-rows: auto 290px;
        gap: 16px;
    }

    .spice-promise-statement {
        min-height: 235px;
        padding: 28px;
    }

    .spice-promise-statement p {
        font-size: 23px;
    }

    .spice-promise-feature-small img {
        min-height: 290px;
    }

    .spice-promise-bottom {
        flex-direction: column;
        align-items: flex-start;
        gap: 22px;
        margin-top: 28px;
    }

    .spice-promise-values {
        display: grid;
        grid-template-columns: 1fr 1fr;
        width: 100%;
        gap: 18px 12px;
    }
}

/* SMALL MOBILE */

@media (max-width: 480px) {
    .spice-promise-section {
        padding: 50px 16px 45px;
    }

    .spice-promise-eyebrow {
        font-size: 10px;
        letter-spacing: 1.8px;
    }

    .spice-promise-heading-row h2 {
        font-size: 34px;
    }

    .spice-promise-feature-large,
    .spice-promise-feature-large img {
        min-height: 360px;
        height: 360px;
    }

    .spice-promise-feature-overlay {
        left: 20px;
        right: 20px;
        bottom: 24px;
    }

    .spice-promise-feature-overlay h3 {
        font-size: 33px;
    }

    .spice-promise-statement {
        padding: 24px;
    }

    .spice-promise-small-overlay {
        left: 20px;
        right: 20px;
    }

    .spice-promise-values span {
        font-size: 10px;
    }

    .spice-promise-cta {
        justify-content: space-between;
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .spice-promise-section *,
    .spice-promise-section *::before,
    .spice-promise-section *::after {
        animation: none !important;
        transition: none !important;
    }
}


/* =========================================
   SPICE VIDEO HERO BANNER
========================================= */

.spice-video-hero {
    position: relative;
    width: 100%;
    min-height: 760px;
    display: flex;
    align-items: center;
    overflow: hidden;
    isolation: isolate;
    background: #302820;
    color: #ffffff;
    font-family: 'Quicksand', sans-serif;
}

/* Background Video */

.spice-video-hero .spice-hero-video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    z-index: -3;
    animation: spiceVideoReveal 1.4s ease both;
}

/* Dark Overlay */

.spice-video-hero .spice-hero-overlay {
    position: absolute;
    inset: 0;
    z-index: -2;
    background:
        linear-gradient(
            90deg,
            rgba(25, 27, 22, 0.94) 0%,
            rgba(25, 27, 22, 0.82) 38%,
            rgba(25, 27, 22, 0.46) 70%,
            rgba(25, 27, 22, 0.30) 100%
        );
}

/* Decorative Elements */

.spice-video-hero .spice-hero-line {
    position: absolute;
    width: 1px;
    height: 100%;
    top: 0;
    background: rgba(221, 182, 153, 0.16);
    pointer-events: none;
}

.spice-video-hero .spice-hero-line-one {
    left: 8%;
}

.spice-video-hero .spice-hero-line-two {
    right: 13%;
}

/* Main Container */

.spice-video-hero .spice-hero-container {
    position: relative;
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    padding: 110px 9% 120px;
    display: flex;
    align-items: center;
    min-height: 760px;
}

/* Content */

.spice-video-hero .spice-hero-content {
    position: relative;
    width: 760px;
    max-width: 80%;
    z-index: 2;
    animation: spiceContentReveal 1s ease 0.2s both;
}

/* Eyebrow */

.spice-video-hero .spice-hero-eyebrow {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 28px;
    color: #DDB699;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 3px;
    text-transform: uppercase;
}

.spice-video-hero .spice-hero-eyebrow-line {
    display: inline-block;
    width: 42px;
    height: 1px;
    background: #DDB699;
}

/* Heading */

.spice-video-hero h1 {
    margin: 0 0 25px;
    max-width: 780px;
    color: #ffffff;
    font-family: 'Quicksand', sans-serif;
    font-size: clamp(44px, 5.4vw, 76px);
    font-weight: 700;
    line-height: 1.13;
    letter-spacing: -1.8px;
    text-transform: none;
}

.spice-video-hero h1 span {
    display: block;
    color: #DDB699;
    font-weight: 700;
}

/* Paragraph */

.spice-video-hero .spice-hero-content > p {
    max-width: 570px;
    margin: 0;
    color: rgba(255, 255, 255, 0.82);
    font-family: 'Quicksand', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.9;
}

/* Buttons */

.spice-video-hero .spice-hero-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 30px;
    margin-top: 36px;
}

.spice-video-hero .spice-hero-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 25px;
    min-height: 58px;
    padding: 0 25px;
    background: #DDB699;
    border: 1px solid #DDB699;
    color: #302820;
    text-decoration: none;
    font-size: 13px;
    font-weight: 700;
    transition:
        background 0.35s ease,
        color 0.35s ease,
        border-color 0.35s ease;
}

.spice-video-hero .spice-hero-btn i {
    font-size: 13px;
    transition: transform 0.35s ease;
}

.spice-video-hero .spice-hero-btn:hover {
    background: transparent;
    color: #ffffff;
    border-color: #ffffff;
}

.spice-video-hero .spice-hero-btn:hover i {
    transform: translateX(5px);
}

.spice-video-hero .spice-hero-text-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #ffffff;
    text-decoration: none;
    font-size: 13px;
    font-weight: 600;
    transition: color 0.3s ease;
}

.spice-video-hero .spice-hero-text-link i {
    color: #DDB699;
    font-size: 12px;
    transition: transform 0.3s ease;
}

.spice-video-hero .spice-hero-text-link:hover {
    color: #DDB699;
}

.spice-video-hero .spice-hero-text-link:hover i {
    transform: translate(3px, -3px);
}

/* Bottom Information */

.spice-video-hero .spice-hero-bottom-info {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 24px;
    margin-top: 76px;
    padding-top: 24px;
    border-top: 1px solid rgba(255, 255, 255, 0.25);
}

.spice-video-hero .spice-hero-info-item {
    display: flex;
    align-items: center;
    gap: 10px;
    color: rgba(255, 255, 255, 0.86);
    font-size: 11px;
    font-weight: 500;
}

.spice-video-hero .spice-hero-info-number {
    color: #DDB699;
    font-size: 11px;
    font-weight: 700;
}

.spice-video-hero .spice-hero-info-divider {
    width: 1px;
    height: 22px;
    background: rgba(255, 255, 255, 0.3);
}

/* Side Label */

.spice-video-hero .spice-hero-side-label {
    position: absolute;
    right: 5%;
    top: 50%;
    transform: translateY(-50%);
    writing-mode: vertical-rl;
    color: rgba(255, 255, 255, 0.7);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 4px;
}

/* Scroll Indicator */

.spice-video-hero .spice-hero-scroll {
    position: absolute;
    bottom: 30px;
    left: 50%;
    display: flex;
    align-items: center;
    gap: 14px;
    transform: translateX(-50%);
    color: rgba(255, 255, 255, 0.7);
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 2px;
}

.spice-video-hero .spice-hero-scroll-line {
    display: block;
    width: 42px;
    height: 1px;
    background: #DDB699;
    transform-origin: left;
    animation: spiceScrollLine 2s ease-in-out infinite;
}

/* Animations */

@keyframes spiceContentReveal {
    from {
        opacity: 0;
        transform: translateY(35px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes spiceVideoReveal {
    from {
        opacity: 0;
        transform: scale(1.06);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes spiceScrollLine {
    0%, 100% {
        transform: scaleX(0.45);
        opacity: 0.5;
    }
    50% {
        transform: scaleX(1);
        opacity: 1;
    }
}

/* Large Devices */

@media (max-width: 1200px) {
    .spice-video-hero,
    .spice-video-hero .spice-hero-container {
        min-height: 700px;
    }

    .spice-video-hero .spice-hero-container {
        padding: 100px 7% 110px;
    }

    .spice-video-hero .spice-hero-content {
        max-width: 85%;
    }

    .spice-video-hero .spice-hero-bottom-info {
        gap: 17px;
        margin-top: 60px;
    }
}

/* Tablet */

@media (max-width: 1024px) {
    .spice-video-hero,
    .spice-video-hero .spice-hero-container {
        min-height: 680px;
    }

    .spice-video-hero .spice-hero-container {
        padding: 90px 6% 100px;
    }

    .spice-video-hero h1 {
        font-size: clamp(42px, 6.2vw, 64px);
        letter-spacing: -1px;
    }

    .spice-video-hero .spice-hero-content {
        max-width: 90%;
    }

    .spice-video-hero .spice-hero-side-label {
        right: 3%;
    }

    .spice-video-hero .spice-hero-bottom-info {
        gap: 14px;
    }
}

/* Mobile */

@media (max-width: 767px) {
    .spice-video-hero,
    .spice-video-hero .spice-hero-container {
        min-height: 720px;
    }

    .spice-video-hero .spice-hero-container {
        padding: 90px 24px 100px;
    }

    .spice-video-hero .spice-hero-overlay {
        background: rgba(25, 27, 22, 0.78);
    }

    .spice-video-hero .spice-hero-line-one {
        left: 12px;
    }

    .spice-video-hero .spice-hero-line-two,
    .spice-video-hero .spice-hero-side-label {
        display: none;
    }

    .spice-video-hero .spice-hero-content {
        width: 100%;
        max-width: 100%;
    }

    .spice-video-hero .spice-hero-eyebrow {
        gap: 10px;
        margin-bottom: 22px;
        font-size: 10px;
        letter-spacing: 2px;
    }

    .spice-video-hero .spice-hero-eyebrow-line {
        width: 28px;
    }

    .spice-video-hero h1 {
        margin-bottom: 22px;
        font-size: clamp(38px, 9vw, 54px);
        line-height: 1.16;
        letter-spacing: -0.8px;
    }

    .spice-video-hero .spice-hero-content > p {
        font-size: 16px;
        line-height: 1.8;
    }

    .spice-video-hero .spice-hero-actions {
        align-items: flex-start;
        flex-direction: column;
        gap: 22px;
        margin-top: 30px;
    }

    .spice-video-hero .spice-hero-btn {
        min-height: 54px;
        gap: 18px;
        padding: 0 20px;
    }

    .spice-video-hero .spice-hero-bottom-info {
        align-items: flex-start;
        flex-direction: column;
        gap: 14px;
        margin-top: 45px;
        padding-top: 20px;
    }

    .spice-video-hero .spice-hero-info-divider {
        display: none;
    }

    .spice-video-hero .spice-hero-scroll {
        bottom: 22px;
        font-size: 8px;
        letter-spacing: 1.5px;
    }
}

/* Small Mobile */

@media (max-width: 480px) {
    .spice-video-hero,
    .spice-video-hero .spice-hero-container {
        min-height: 750px;
    }

    .spice-video-hero .spice-hero-container {
        padding: 75px 20px 90px;
    }

    .spice-video-hero h1 {
        font-size: 38px;
    }

    .spice-video-hero .spice-hero-content > p {
        font-size: 16px;
    }

    .spice-video-hero .spice-hero-bottom-info {
        margin-top: 35px;
    }
}

/* Reduced Motion */

@media (prefers-reduced-motion: reduce) {
    .spice-video-hero *,
    .spice-video-hero *::before,
    .spice-video-hero *::after {
        animation: none !important;
        transition: none !important;
    }
}/* ==========================================
   SPICE COLLECTION - EDITORIAL GRID
========================================== */

.spice-collection-section {
    width: 100%;
    padding: 110px 0;
    background: #EEE8DC;
    color: #302820;
    font-family: 'Quicksand', sans-serif;
    overflow: hidden;
}

.spice-collection-wrap {
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 7%;
}

/* Heading */

.spice-collection-label {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 25px;
    color: #A77853;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2.5px;
}

.spice-collection-label-line {
    width: 35px;
    height: 1px;
    background: #A77853;
}

.spice-collection-heading-row {
    display: grid;
    grid-template-columns: 1.1fr 0.65fr;
    align-items: end;
    gap: 60px;
    margin-bottom: 55px;
}

.spice-collection-heading h2 {
    max-width: 650px;
    margin: 0;
    color: #302820;
    font-family: 'Quicksand', sans-serif;
    font-size: clamp(38px, 4.5vw, 62px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -1.5px;
}

.spice-collection-heading h2 span {
    display: block;
    color: #A77853;
    font-weight: 700;
}

.spice-collection-heading-row > p {
    max-width: 410px;
    margin: 0 0 5px auto;
    color: #71675C;
    font-family: 'Quicksand', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.9;
}

/* Editorial Grid */

.spice-collection-grid {
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    gap: 22px;
}

.spice-collection-item {
    position: relative;
    display: block;
    min-width: 0;
    height: 390px;
    overflow: hidden;
    background: #302820;
    color: #ffffff;
    text-decoration: none;
    isolation: isolate;
}

.spice-collection-item.spice-collection-large {
    height: 400px;
}

.spice-collection-item.spice-collection-small {
    height: 400px;
}

.spice-collection-item img {
    position: absolute;
    inset: 0;
    z-index: -2;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.8s cubic-bezier(0.2, 0.7, 0.2, 1);
}

.spice-collection-item:hover img {
    transform: scale(1.08);
}

/* Image Shade */

.spice-collection-image-shade {
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(
        180deg,
        rgba(20, 18, 14, 0.10) 0%,
        rgba(20, 18, 14, 0.08) 30%,
        rgba(20, 18, 14, 0.82) 100%
    );
    transition: background 0.4s ease;
}

.spice-collection-item:hover .spice-collection-image-shade {
    background: linear-gradient(
        180deg,
        rgba(20, 18, 14, 0.18) 0%,
        rgba(20, 18, 14, 0.15) 25%,
        rgba(20, 18, 14, 0.90) 100%
    );
}

/* Index */

.spice-collection-index {
    position: absolute;
    top: 25px;
    left: 26px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 2px;
}

/* Item Content */

.spice-collection-item-content {
    position: absolute;
    right: 30px;
    bottom: 30px;
    left: 30px;
}

.spice-collection-kicker {
    display: block;
    margin-bottom: 12px;
    color: #DDB699;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
}

.spice-collection-item h3 {
    margin: 0 0 20px;
    color: #ffffff;
    font-family: 'Quicksand', sans-serif;
    font-size: clamp(26px, 3vw, 38px);
    font-weight: 700;
    line-height: 1.2;
}

.spice-collection-explore {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 7px;
    border-bottom: 1px solid rgba(221, 182, 153, 0.65);
    color: #ffffff;
    font-size: 12px;
    font-weight: 600;
}

.spice-collection-explore i {
    color: #DDB699;
    transition: transform 0.35s ease;
}

.spice-collection-item:hover .spice-collection-explore i {
    transform: translateX(6px);
}

/* Footer */

.spice-collection-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    margin-top: 35px;
    padding-top: 24px;
    border-top: 1px solid rgba(48, 40, 32, 0.2);
}

.spice-collection-footer > span {
    color: #71675C;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.8px;
}

.spice-collection-all {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: #302820;
    text-decoration: none;
    font-size: 12px;
    font-weight: 700;
}

.spice-collection-all i {
    color: #A77853;
    transition: transform 0.3s ease;
}

.spice-collection-all:hover i {
    transform: translate(3px, -3px);
}

/* Scroll Entrance Animation */

.spice-collection-section .spice-reveal {
    opacity: 0;
    transform: translateY(35px);
    transition:
        opacity 0.8s ease,
        transform 0.8s cubic-bezier(0.2, 0.7, 0.2, 1);
}

.spice-collection-section .spice-reveal.spice-visible {
    opacity: 1;
    transform: translateY(0);
}

.spice-collection-grid .spice-collection-item:nth-child(2) {
    transition-delay: 0.12s;
}

.spice-collection-grid .spice-collection-item:nth-child(3) {
    transition-delay: 0.08s;
}

.spice-collection-grid .spice-collection-item:nth-child(4) {
    transition-delay: 0.16s;
}

/* Tablet */

@media (max-width: 1024px) {
    .spice-collection-section {
        padding: 85px 0;
    }

    .spice-collection-wrap {
        padding: 0 5%;
    }

    .spice-collection-heading-row {
        grid-template-columns: 1fr 0.8fr;
        gap: 35px;
    }

    .spice-collection-grid {
        gap: 16px;
    }

    .spice-collection-item,
    .spice-collection-item.spice-collection-small {
        height: 340px;
    }

    .spice-collection-item.spice-collection-large {
        height: 390px;
    }

    .spice-collection-item-content {
        right: 22px;
        bottom: 24px;
        left: 22px;
    }
}

/* Mobile */

@media (max-width: 767px) {
    .spice-collection-section {
        padding: 70px 0;
    }

    .spice-collection-wrap {
        padding: 0 22px;
    }

    .spice-collection-heading-row {
        grid-template-columns: 1fr;
        gap: 20px;
        margin-bottom: 35px;
    }

    .spice-collection-heading h2 {
        font-size: clamp(35px, 8vw, 46px);
        letter-spacing: -0.8px;
    }

    .spice-collection-heading-row > p {
        max-width: 100%;
        margin: 0;
        font-size: 16px;
        line-height: 1.8;
    }

    .spice-collection-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .spice-collection-item,
    .spice-collection-item.spice-collection-large,
    .spice-collection-item.spice-collection-small {
        height: 350px;
    }

    .spice-collection-item-content {
        right: 24px;
        bottom: 25px;
        left: 24px;
    }

    .spice-collection-item h3 {
        font-size: 31px;
    }

    .spice-collection-footer {
        align-items: flex-start;
        flex-direction: column;
        gap: 20px;
    }

    .spice-collection-footer > span {
        line-height: 1.8;
    }
}

/* Small Mobile */

@media (max-width: 480px) {
    .spice-collection-section {
        padding: 60px 0;
    }

    .spice-collection-wrap {
        padding: 0 18px;
    }

    .spice-collection-item,
    .spice-collection-item.spice-collection-large,
    .spice-collection-item.spice-collection-small {
        height: 310px;
    }

    .spice-collection-index {
        top: 20px;
        left: 20px;
    }

    .spice-collection-item-content {
        right: 20px;
        bottom: 22px;
        left: 20px;
    }

    .spice-collection-item h3 {
        font-size: 28px;
    }
}

/* Reduced Motion */

@media (prefers-reduced-motion: reduce) {
    .spice-collection-section .spice-reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .spice-collection-item img {
        transition: none;
    }
}


/* ======================================
   CONDIMENTS STORE - DISCOVERY SECTION
====================================== */

.condiment-discovery {
    width: 100%;
    padding: 110px 0;
    background: #EEE8DC;
    color: #302820;
    font-family: 'Quicksand', sans-serif;
    overflow: hidden;
}

.condiment-discovery-wrap {
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 7%;
}

/* Top Layout */

.condiment-discovery-top {
    display: grid;
    grid-template-columns: 1.1fr 0.65fr;
    align-items: end;
    gap: 70px;
    margin-bottom: 55px;
}

.condiment-eyebrow {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
    color: #A77853;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2.5px;
}

.condiment-eyebrow-line {
    display: block;
    width: 35px;
    height: 1px;
    background: #A77853;
}

.condiment-discovery-intro h2 {
    max-width: 650px;
    margin: 0;
    color: #302820;
    font-family: 'Quicksand', sans-serif;
    font-size: clamp(38px, 4.5vw, 62px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -1.4px;
}

.condiment-discovery-intro h2 span {
    display: block;
    color: #A77853;
    font-weight: 700;
}

.condiment-discovery-description p {
    margin: 0 0 24px;
    color: #71675C;
    font-family: 'Quicksand', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.9;
}

.condiment-discovery-link {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 9px;
    border-bottom: 1px solid #A77853;
    color: #302820;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    transition: color 0.3s ease;
}

.condiment-discovery-link i {
    color: #A77853;
    transition: transform 0.3s ease;
}

.condiment-discovery-link:hover {
    color: #A77853;
}

.condiment-discovery-link:hover i {
    transform: translate(3px, -3px);
}

/* Product Rows */

.condiment-discovery-list {
    border-top: 1px solid rgba(48, 40, 32, 0.2);
}

.condiment-discovery-row {
    display: grid;
    grid-template-columns: 55px 145px minmax(0, 1fr) 120px;
    align-items: center;
    gap: 28px;
    min-height: 190px;
    padding: 23px 10px;
    border-bottom: 1px solid rgba(48, 40, 32, 0.2);
    color: #302820;
    text-decoration: none;
    transition:
        background 0.35s ease,
        padding 0.35s ease;
}

.condiment-discovery-row:hover {
    padding-right: 22px;
    padding-left: 22px;
    background: rgba(167, 120, 83, 0.07);
}

.condiment-row-number {
    align-self: start;
    padding-top: 9px;
    color: #A77853;
    font-size: 12px;
    font-weight: 700;
}

.condiment-row-image {
    position: relative;
    width: 145px;
    height: 140px;
    overflow: hidden;
    background: #D7C9B6;
}

.condiment-row-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform 0.65s ease;
}

.condiment-discovery-row:hover .condiment-row-image img {
    transform: scale(1.08);
}

.condiment-row-content {
    min-width: 0;
}

.condiment-row-label {
    display: block;
    margin-bottom: 10px;
    color: #A77853;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.8px;
}

.condiment-row-content h3 {
    margin: 0 0 10px;
    color: #302820;
    font-family: 'Quicksand', sans-serif;
    font-size: clamp(22px, 2.3vw, 30px);
    font-weight: 700;
    line-height: 1.3;
}

.condiment-row-content p {
    margin: 0;
    color: #71675C;
    font-family: 'Quicksand', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.7;
}

.condiment-row-action {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    color: #71675C;
    font-size: 11px;
    font-weight: 700;
}

.condiment-row-arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border: 1px solid rgba(167, 120, 83, 0.5);
    border-radius: 50%;
    color: #A77853;
    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease;
}

.condiment-discovery-row:hover .condiment-row-arrow {
    background: #A77853;
    color: #ffffff;
    transform: rotate(45deg);
}

/* Bottom Note */

.condiment-discovery-bottom {
    display: flex;
    align-items: center;
    gap: 25px;
    margin-top: 35px;
}

.condiment-discovery-bottom > span:first-child {
    color: #71675C;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.8px;
    line-height: 1.8;
}

.condiment-bottom-decoration {
    display: block;
    width: 60px;
    height: 1px;
    background: #A77853;
}

/* Entrance Animation */

.condiment-discovery .reveal-condiment {
    opacity: 0;
    transform: translateY(30px);
    transition:
        opacity 0.8s ease,
        transform 0.8s cubic-bezier(0.2, 0.7, 0.2, 1);
}

.condiment-discovery .reveal-condiment.condiment-visible {
    opacity: 1;
    transform: translateY(0);
}

.condiment-discovery-row:nth-child(2) {
    transition-delay: 0.1s;
}

.condiment-discovery-row:nth-child(3) {
    transition-delay: 0.18s;
}

.condiment-discovery-row:nth-child(4) {
    transition-delay: 0.26s;
}

/* Tablet */

@media (max-width: 1024px) {
    .condiment-discovery {
        padding: 85px 0;
    }

    .condiment-discovery-wrap {
        padding: 0 5%;
    }

    .condiment-discovery-top {
        gap: 35px;
    }

    .condiment-discovery-row {
        grid-template-columns: 35px 120px minmax(0, 1fr) 45px;
        gap: 20px;
        min-height: 165px;
    }

    .condiment-row-image {
        width: 120px;
        height: 120px;
    }

    .condiment-row-action > span:first-child {
        display: none;
    }
}

/* Mobile */

@media (max-width: 767px) {
    .condiment-discovery {
        padding: 70px 0;
    }

    .condiment-discovery-wrap {
        padding: 0 22px;
    }

    .condiment-discovery-top {
        grid-template-columns: 1fr;
        gap: 22px;
        margin-bottom: 35px;
    }

    .condiment-discovery-intro h2 {
        font-size: clamp(35px, 8vw, 46px);
        letter-spacing: -0.7px;
    }

    .condiment-discovery-description p {
        font-size: 16px;
    }

    .condiment-discovery-row {
        grid-template-columns: 28px 95px minmax(0, 1fr);
        gap: 14px;
        min-height: 145px;
        padding: 20px 0;
    }

    .condiment-discovery-row:hover {
        padding-right: 5px;
        padding-left: 5px;
    }

    .condiment-row-image {
        width: 95px;
        height: 105px;
    }

    .condiment-row-number {
        font-size: 11px;
    }

    .condiment-row-label {
        font-size: 9px;
        line-height: 1.6;
        letter-spacing: 1px;
    }

    .condiment-row-content h3 {
        font-size: 20px;
        line-height: 1.35;
    }

    .condiment-row-content p {
        font-size: 16px;
        line-height: 1.6;
    }

    .condiment-row-action {
        display: none;
    }

    .condiment-discovery-bottom {
        flex-wrap: wrap;
        gap: 15px;
    }
}

/* Small Mobile */

@media (max-width: 480px) {
    .condiment-discovery {
        padding: 60px 0;
    }

    .condiment-discovery-wrap {
        padding: 0 17px;
    }

    .condiment-discovery-row {
        grid-template-columns: 24px 78px minmax(0, 1fr);
        gap: 11px;
        min-height: 130px;
    }

    .condiment-row-image {
        width: 78px;
        height: 92px;
    }

    .condiment-row-content h3 {
        font-size: 18px;
    }

    .condiment-row-content p {
        font-size: 16px;
    }

    .condiment-discovery-bottom > span:first-child {
        font-size: 9px;
        letter-spacing: 1px;
    }
}

/* Accessibility */

@media (prefers-reduced-motion: reduce) {
    .condiment-discovery .reveal-condiment {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .condiment-discovery-row,
    .condiment-row-image img,
    .condiment-row-arrow {
        transition: none;
    }
}

/* ==========================================
   CONDIMENTS STORE - ART OF PAIRING
========================================== */

.condiment-pairing-section {
    width: 100%;
    padding: 110px 0;
    background: #F7F3EC;
    color: #302820;
    font-family: 'Quicksand', sans-serif;
    overflow: hidden;
}

.condiment-pairing-wrap {
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 7%;
    display: grid;
    grid-template-columns: 0.9fr 1.1fr;
    gap: 100px;
    align-items: start;
}

/* Editorial Side */

.condiment-pairing-editorial {
    position: sticky;
    top: 100px;
    padding: 35px 0 0;
}

.pairing-eyebrow {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 28px;
    color: #A77853;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2.4px;
}

.pairing-eyebrow > span {
    display: inline-block;
    width: 34px;
    height: 1px;
    background: #A77853;
}

.condiment-pairing-editorial h2 {
    margin: 0 0 25px;
    color: #302820;
    font-family: 'Quicksand', sans-serif;
    font-size: clamp(38px, 4.3vw, 60px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -1.4px;
}

.condiment-pairing-editorial h2 span {
    display: block;
    color: #A77853;
    font-weight: 700;
}

.pairing-intro {
    max-width: 430px;
    margin: 0;
    color: #71675C;
    font-family: 'Quicksand', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.95;
}

.pairing-main-link {
    display: inline-flex;
    align-items: center;
    gap: 20px;
    margin-top: 32px;
    padding: 17px 22px;
    background: #302820;
    border: 1px solid #302820;
    color: #ffffff;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    transition:
        background 0.3s ease,
        color 0.3s ease;
}

.pairing-main-link i {
    color: #DDB699;
    transition: transform 0.3s ease;
}

.pairing-main-link:hover {
    background: transparent;
    color: #302820;
}

.pairing-main-link:hover i {
    transform: translateX(5px);
}

.pairing-editorial-note {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 90px;
    padding-top: 20px;
    border-top: 1px solid rgba(48, 40, 32, 0.2);
}

.pairing-note-number {
    color: #A77853;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.pairing-editorial-note > span:last-child {
    color: #71675C;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.7px;
}

/* Guide Side */

.condiment-pairing-guide {
    width: 100%;
    min-width: 0;
}

.pairing-guide-heading {
    padding: 0 0 25px;
    border-bottom: 1px solid rgba(48, 40, 32, 0.2);
}

.pairing-guide-heading > span {
    color: #A77853;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
}

.pairing-guide-heading p {
    margin: 10px 0 0;
    color: #71675C;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.7;
}

/* Pairing Items */

.pairing-guide-item {
    position: relative;
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) 54px;
    align-items: center;
    gap: 18px;
    min-height: 135px;
    padding: 25px 0;
    border-bottom: 1px solid rgba(48, 40, 32, 0.2);
    color: #302820;
    text-decoration: none;
    transition: padding 0.35s ease;
}

.pairing-guide-item::before {
    position: absolute;
    content: "";
    inset: 0 -18px;
    background: rgba(167, 120, 83, 0.07);
    opacity: 0;
    transition: opacity 0.35s ease;
    pointer-events: none;
}

.pairing-guide-item:hover {
    padding-right: 10px;
    padding-left: 10px;
}

.pairing-guide-item:hover::before {
    opacity: 1;
}

.pairing-guide-number,
.pairing-guide-copy,
.pairing-guide-symbol {
    position: relative;
    z-index: 1;
}

.pairing-guide-number {
    align-self: start;
    padding-top: 5px;
    color: #A77853;
    font-size: 11px;
    font-weight: 700;
}

.pairing-guide-copy h3 {
    margin: 0 0 9px;
    color: #302820;
    font-family: 'Quicksand', sans-serif;
    font-size: clamp(20px, 2vw, 26px);
    font-weight: 700;
    line-height: 1.3;
}

.pairing-guide-copy p {
    margin: 0;
    color: #71675C;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.7;
}

.pairing-guide-symbol {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border: 1px solid rgba(167, 120, 83, 0.35);
    border-radius: 50%;
    color: #A77853;
    font-size: 18px;
    transition:
        background 0.35s ease,
        color 0.35s ease,
        transform 0.35s ease;
}

.pairing-guide-item:hover .pairing-guide-symbol {
    background: #A77853;
    color: #ffffff;
    transform: rotate(-8deg);
}

/* Guide Footer */

.pairing-guide-footer {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-top: 30px;
}

.pairing-guide-footer > span:first-child {
    color: #71675C;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.5px;
    line-height: 1.8;
}

.pairing-footer-line {
    display: block;
    width: 40px;
    height: 1px;
    flex-shrink: 0;
    background: #A77853;
}

/* Entrance Animation */

.condiment-pairing-section .pairing-reveal {
    opacity: 0;
    transform: translateY(28px);
    transition:
        opacity 0.75s ease,
        transform 0.75s cubic-bezier(0.2, 0.7, 0.2, 1);
}

.condiment-pairing-section .pairing-reveal.pairing-visible {
    opacity: 1;
    transform: translateY(0);
}

.condiment-pairing-section
.pairing-guide-item:nth-of-type(2) {
    transition-delay: 0.08s;
}

.condiment-pairing-section
.pairing-guide-item:nth-of-type(3) {
    transition-delay: 0.16s;
}

.condiment-pairing-section
.pairing-guide-item:nth-of-type(4) {
    transition-delay: 0.24s;
}

.condiment-pairing-section
.pairing-guide-item:nth-of-type(5) {
    transition-delay: 0.32s;
}

/* Tablet */

@media (max-width: 1024px) {
    .condiment-pairing-section {
        padding: 85px 0;
    }

    .condiment-pairing-wrap {
        padding: 0 5%;
        grid-template-columns: 0.85fr 1.15fr;
        gap: 45px;
    }

    .condiment-pairing-editorial {
        top: 60px;
    }

    .condiment-pairing-editorial h2 {
        font-size: clamp(35px, 4vw, 48px);
    }

    .pairing-guide-item {
        grid-template-columns: 30px minmax(0, 1fr) 45px;
        gap: 13px;
        min-height: 125px;
    }

    .pairing-guide-symbol {
        width: 44px;
        height: 44px;
        font-size: 16px;
    }
}

/* Mobile */

@media (max-width: 767px) {
    .condiment-pairing-section {
        padding: 70px 0;
    }

    .condiment-pairing-wrap {
        grid-template-columns: 1fr;
        gap: 55px;
        padding: 0 22px;
    }

    .condiment-pairing-editorial {
        position: relative;
        top: auto;
        padding-top: 0;
    }

    .condiment-pairing-editorial h2 {
        font-size: clamp(36px, 8vw, 48px);
        letter-spacing: -0.8px;
    }

    .pairing-intro {
        max-width: 100%;
        font-size: 16px;
    }

    .pairing-editorial-note {
        margin-top: 40px;
    }

    .pairing-guide-item {
        grid-template-columns: 28px minmax(0, 1fr) 45px;
        min-height: 125px;
        gap: 14px;
    }

    .pairing-guide-copy h3 {
        font-size: 21px;
    }

    .pairing-guide-copy p {
        font-size: 16px;
    }

    .pairing-guide-symbol {
        width: 42px;
        height: 42px;
    }
}

/* Small Mobile */

@media (max-width: 480px) {
    .condiment-pairing-section {
        padding: 60px 0;
    }

    .condiment-pairing-wrap {
        padding: 0 18px;
        gap: 45px;
    }

    .pairing-eyebrow {
        font-size: 10px;
        letter-spacing: 1.8px;
    }

    .condiment-pairing-editorial h2 {
        font-size: 36px;
    }

    .pairing-guide-item {
        grid-template-columns: 22px minmax(0, 1fr) 38px;
        gap: 10px;
        min-height: 120px;
        padding: 20px 0;
    }

    .pairing-guide-copy h3 {
        font-size: 19px;
    }

    .pairing-guide-copy p {
        font-size: 16px;
    }

    .pairing-guide-symbol {
        width: 37px;
        height: 37px;
        font-size: 14px;
    }
}

/* Accessibility */

@media (prefers-reduced-motion: reduce) {
    .condiment-pairing-section .pairing-reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .pairing-guide-item,
    .pairing-guide-symbol,
    .pairing-main-link {
        transition: none;
    }
}

/* ==========================================
   CONDIMENTS STORE — FLAVOUR LAB
   Image-free premium editorial design
========================================== */

.condiment-flavour-lab {
    --cfl-bg: #191B16;
    --cfl-panel: #23251E;
    --cfl-text: #F3EBDD;
    --cfl-muted: #B4AA9B;
    --cfl-accent: #DDB699;

    width: 100%;
    padding: 100px 6%;
    overflow: hidden;
    background: var(--cfl-bg);
    color: var(--cfl-text);
    font-family: 'Quicksand', sans-serif;
    box-sizing: border-box;
}

.condiment-flavour-lab *,
.condiment-flavour-lab *::before,
.condiment-flavour-lab *::after {
    box-sizing: border-box;
}

.cfl-container {
    max-width: 1320px;
    width: 100%;
    margin: 0 auto;
}

/* Topline */

.cfl-topline,
.cfl-bottomline {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
}

.cfl-topline {
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(243, 235, 221, 0.2);
    color: var(--cfl-muted);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
}

.cfl-top-index {
    text-align: right;
}

/* Hero Heading */

.cfl-hero {
    display: grid;
    grid-template-columns: 1.25fr 0.75fr;
    align-items: end;
    gap: 60px;
    padding: 60px 0 65px;
}

.cfl-eyebrow {
    display: inline-block;
    margin-bottom: 22px;
    color: var(--cfl-accent);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 3px;
}

.cfl-heading h2 {
     max-width: 520px;
    margin: 0 0 24px;
    color: var(--se-text);
    font-family: "Quicksand", sans-serif;
    font-size: clamp(34px, 4.2vw, 56px);
    font-weight: 700;
    line-height: 1.16;
    letter-spacing: -1.5px;
    overflow-wrap: break-word;
}

.cfl-heading h2 > span:first-of-type {
    color: var(--cfl-accent);
}

.cfl-dot {
    color: #B8C38C;
}

.cfl-intro {
    max-width: 390px;
    padding-bottom: 5px;
}

.cfl-intro-mark {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    margin-bottom: 20px;
    border: 1px solid rgba(221, 182, 153, 0.65);
    border-radius: 50%;
    color: var(--cfl-accent);
    font-size: 20px;
    font-weight: 700;
}

.cfl-intro p {
    margin: 0 0 24px;
    color: var(--cfl-muted);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.9;
}

.cfl-explore-link {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    padding-bottom: 9px;
    border-bottom: 1px solid var(--cfl-accent);
    color: var(--cfl-text);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.3px;
    text-decoration: none;
    transition: color 0.3s ease;
}

.cfl-explore-link i {
    color: var(--cfl-accent);
    transition: transform 0.3s ease;
}

.cfl-explore-link:hover {
    color: var(--cfl-accent);
}

.cfl-explore-link:hover i {
    transform: translate(3px, -3px);
}

/* Flavour Stage */

.cfl-flavour-stage {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    align-items: stretch;
}

.cfl-flavour {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 20px;
    overflow: hidden;
    background: var(--cfl-panel);
    color: var(--cfl-text);
    text-decoration: none;
    transition:
        background 0.35s ease,
        transform 0.35s ease;
}

.cfl-flavour:hover {
    background: #2B2D24;
    transform: translateY(-5px);
}

.cfl-flavour-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    color: var(--cfl-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.2px;
}

.cfl-flavour-top i {
    color: var(--cfl-accent);
    transition: transform 0.3s ease;
}

.cfl-flavour:hover .cfl-flavour-top i {
    transform: translate(3px, -3px);
}

/* Abstract Artwork — No Images */

.cfl-art {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 240px;
    margin: 18px 0 23px;
    overflow: hidden;
    isolation: isolate;
}

.cfl-art-sauce {
    background: #453126;
    color: #E4B28C;
}

.cfl-art-dressing {
    background: #30392A;
    color: #C5D0A0;
}

.cfl-art-chutney {
    background: #413328;
    color: #DDB699;
}

.cfl-orbit {
    position: absolute;
    z-index: -1;
    display: block;
    width: 175px;
    height: 175px;
    border: 1px solid currentColor;
    border-radius: 50%;
    opacity: 0.45;
    transition: transform 0.65s ease;
}

.cfl-orbit-one {
    transform: rotate(-30deg) scaleX(0.65);
}

.cfl-orbit-two {
    transform: rotate(45deg) scaleX(0.65);
}

.cfl-flavour:hover .cfl-orbit-one {
    transform: rotate(10deg) scaleX(0.8);
}

.cfl-flavour:hover .cfl-orbit-two {
    transform: rotate(75deg) scaleX(0.8);
}

.cfl-art-core {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 92px;
    height: 92px;
    border: 1px solid currentColor;
    border-radius: 50%;
    font-size: 34px;
    transition: transform 0.45s ease;
}

.cfl-flavour:hover .cfl-art-core {
    transform: scale(1.08) rotate(-8deg);
}

.cfl-art-word {
    position: absolute;
    right: 13px;
    bottom: 12px;
    color: currentColor;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 3px;
    opacity: 0.8;
}

/* Card Content */

.cfl-category {
    display: inline-block;
    margin-bottom: 15px;
    color: var(--cfl-accent);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.8px;
}

.cfl-flavour-bottom h3 {
    margin: 0 0 12px;
    color: var(--cfl-text);
    font-family: 'Quicksand', sans-serif;
    font-size: clamp(23px, 2.5vw, 34px);
    font-weight: 700;
    line-height: 1.18;
}

.cfl-flavour-bottom p {
    margin: 0;
    color: var(--cfl-muted);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.7;
}

/* Footer */

.cfl-bottomline {
    margin-top: 28px;
    padding-top: 20px;
    border-top: 1px solid rgba(243, 235, 221, 0.2);
    color: var(--cfl-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.7px;
}

.cfl-bottom-note {
    display: inline-flex;
    align-items: center;
    gap: 9px;
}

.cfl-bottom-note i {
    color: #B8C38C;
    font-size: 7px;
}

/* Scroll Animation */

.cfl-reveal {
    opacity: 0;
    transform: translateY(22px);
    transition:
        opacity 0.7s ease,
        transform 0.7s ease;
}

.cfl-reveal.cfl-visible {
    opacity: 1;
    transform: translateY(0);
}

.cfl-flavour:nth-child(2) {
    transition-delay: 0.12s;
}

.cfl-flavour:nth-child(3) {
    transition-delay: 0.24s;
}

/* Tablet */

@media (max-width: 1024px) {
    .condiment-flavour-lab {
        padding: 80px 4%;
    }

    .cfl-hero {
        gap: 35px;
        padding: 50px 0;
    }

    .cfl-flavour-stage {
        gap: 12px;
    }

    .cfl-flavour {
        padding: 15px;
    }

    .cfl-art {
        min-height: 200px;
    }

    .cfl-art-core {
        width: 78px;
        height: 78px;
        font-size: 29px;
    }

    .cfl-orbit {
        width: 145px;
        height: 145px;
    }
}

/* Mobile */

@media (max-width: 767px) {
    .condiment-flavour-lab {
        padding: 60px 20px;
    }

    .cfl-topline,
    .cfl-bottomline {
        align-items: flex-start;
        gap: 14px;
        font-size: 9px;
        letter-spacing: 1px;
    }

    .cfl-top-index,
    .cfl-bottom-note {
        text-align: right;
    }

    .cfl-hero {
        grid-template-columns: 1fr;
        gap: 28px;
        padding: 42px 0;
    }

    .cfl-eyebrow {
        margin-bottom: 18px;
        font-size: 10px;
        letter-spacing: 2px;
    }

    .cfl-heading h2 {
        font-size: clamp(49px, 12vw, 72px);
        letter-spacing: -2px;
    }

    .cfl-intro {
        max-width: 100%;
    }

    .cfl-intro-mark {
        width: 38px;
        height: 38px;
        margin-bottom: 15px;
    }

    .cfl-intro p {
        margin-bottom: 20px;
        font-size: 16px;
    }

    .cfl-flavour-stage {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .cfl-flavour {
        padding: 18px;
    }

    .cfl-art {
        min-height: 220px;
        margin: 18px 0 22px;
    }

    .cfl-flavour-bottom h3 {
        font-size: 31px;
    }

    .cfl-bottomline {
        flex-direction: column;
        margin-top: 22px;
    }
}

/* Reduced Motion */

@media (prefers-reduced-motion: reduce) {
    .cfl-reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .cfl-flavour,
    .cfl-art-core,
    .cfl-orbit,
    .cfl-explore-link i {
        transition: none;
    }
}

/* ==========================================
   CONDIMENTS STORE — FOOD STORY
========================================== */

.condiment-story-section {
    width: 100%;
    padding: 100px 6%;
    overflow: hidden;
    background: #F7F3EC;
    color: #302820;
    font-family: 'Quicksand', sans-serif;
    box-sizing: border-box;
}

.condiment-story-section *,
.condiment-story-section *::before,
.condiment-story-section *::after {
    box-sizing: border-box;
}

.cstory-container {
    width: 100%;
    max-width: 1300px;
    margin: 0 auto;
}

/* Heading */

.cstory-heading {
    margin-bottom: 50px;
}

.cstory-kicker {
    display: inline-block;
    margin-bottom: 20px;
    color: #A77853;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2.5px;
}

.cstory-heading h2 {
     max-width: 650px;
    margin: 0;
    color: #302820;
    font-family: 'Quicksand', sans-serif;
    font-size: clamp(38px, 4.5vw, 62px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -1.5px;
}

.cstory-heading h2 span {
    color: #A77853;
}

/* Main Layout */

.cstory-layout {
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    align-items: center;
    gap: 0;
}

/* Main Image */

.cstory-main-image {
    position: relative;
    min-width: 0;
    height: 576px;
    overflow: hidden;
    background: #D8C9B8;
}

.cstory-main-image > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.8s ease;
}

.cstory-main-image:hover > img {
    transform: scale(1.04);
}

.cstory-image-caption {
    position: absolute;
    right: 24px;
    bottom: 24px;
    width: 200px;
    left: 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 17px 20px;
    background: rgba(25, 27, 22, 0.78);
    color: #FFFFFF;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
    backdrop-filter: blur(8px);
}

.cstory-image-caption i {
    color: #DDB699;
}

.cstory-image-badge {
    position: absolute;
    top: 25px;
    left: 25px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 105px;
    height: 105px;
    border-radius: 50%;
    background: #DDB699;
    color: #302820;
    transform: rotate(-10deg);
}

.cstory-badge-small {
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 1px;
}

.cstory-badge-large {
    margin-top: 5px;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 1px;
}

/* Content Panel */

.cstory-content {
    position: relative;
    z-index: 2;
    margin-left: -45px;
    padding: 55px 45px;
    background: #EEE8DC;
}

.cstory-number {
    display: block;
    margin-bottom: 25px;
    color: #A77853;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
}

.cstory-content h3 {
    margin: 0 0 24px;
    color: #302820;
    font-family: 'Quicksand', sans-serif;
    font-size: clamp(34px, 4vw, 50px);
    font-weight: 700;
    line-height: 1.13;
    letter-spacing: -1px;
}

.cstory-content > p {
    margin: 0 0 18px;
    color: #71675C;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.9;
}

.cstory-button {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    margin-top: 12px;
    padding: 17px 20px;
    background: #302820;
    color: #FFFFFF;
    text-decoration: none;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
    transition: background 0.3s ease;
}

.cstory-button i {
    color: #DDB699;
    transition: transform 0.3s ease;
}

.cstory-button:hover {
    background: #A77853;
}

.cstory-button:hover i {
    transform: translateX(4px);
}

.cstory-signature {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 35px;
    color: #71675C;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.cstory-signature-line {
    width: 30px;
    height: 1px;
    background: #A77853;
}

/* Bottom Highlights */

.cstory-highlights {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 25px;
    margin-top: 75px;
}

.cstory-highlight {
    min-width: 0;
}

.cstory-highlight-image {
    position: relative;
    height: 230px;
    overflow: hidden;
    background: #E2D7C8;
}

.cstory-highlight-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.cstory-highlight:hover .cstory-highlight-image img {
    transform: scale(1.06);
}

.cstory-highlight-number {
    position: absolute;
    right: 14px;
    bottom: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    background: #EEE8DC;
    color: #302820;
    font-size: 12px;
    font-weight: 700;
}

.cstory-highlight-text {
    padding-top: 20px;
}

.cstory-highlight-text h4 {
    margin: 0 0 8px;
    color: #302820;
    font-family: 'Quicksand', sans-serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.4;
}

.cstory-highlight-text p {
    margin: 0;
    color: #71675C;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.8;
}

/* Reveal Animation */

.cstory-reveal {
    opacity: 0;
    transform: translateY(24px);
    transition:
        opacity 0.7s ease,
        transform 0.7s ease;
}

.cstory-reveal.cstory-visible {
    opacity: 1;
    transform: translateY(0);
}

.cstory-highlight:nth-child(2) {
    transition-delay: 0.12s;
}

.cstory-highlight:nth-child(3) {
    transition-delay: 0.24s;
}

/* Tablet */

@media (max-width: 1024px) {
    .condiment-story-section {
        padding: 80px 4%;
    }

    .cstory-layout {
        grid-template-columns: 1fr 0.9fr;
    }

    .cstory-main-image {
        height: 480px;
    }

    .cstory-content {
        margin-left: -25px;
        padding: 35px 28px;
    }

    .cstory-content h3 {
        font-size: 38px;
    }

    .cstory-highlights {
        gap: 18px;
        margin-top: 55px;
    }

    .cstory-highlight-image {
        height: 190px;
    }

    .cstory-highlight-text h4 {
        font-size: 18px;
    }
}

/* Mobile */

@media (max-width: 767px) {
    .condiment-story-section {
        padding: 65px 20px;
    }

    .cstory-heading {
        margin-bottom: 30px;
    }

    .cstory-kicker {
        margin-bottom: 16px;
        font-size: 10px;
        letter-spacing: 1.8px;
    }

    .cstory-heading h2 {
        font-size: clamp(36px, 9vw, 48px);
        letter-spacing: -1px;
    }

    .cstory-layout {
        grid-template-columns: 1fr;
    }

    .cstory-main-image {
        height: 360px;
    }

    .cstory-image-badge {
        top: 17px;
        left: 17px;
        width: 85px;
        height: 85px;
    }

    .cstory-badge-small {
        font-size: 7px;
    }

    .cstory-badge-large {
        font-size: 12px;
    }

    .cstory-image-caption {
        right: 14px;
        bottom: 14px;
        left: 14px;
        padding: 14px;
        font-size: 9px;
    }

    .cstory-content {
        margin: 0;
        padding: 35px 24px;
    }

    .cstory-number {
        margin-bottom: 18px;
    }

    .cstory-content h3 {
        margin-bottom: 18px;
        font-size: 36px;
    }

    .cstory-content > p {
        font-size: 16px;
        line-height: 1.8;
    }

    .cstory-button {
        width: 100%;
        gap: 12px;
        padding: 17px 15px;
        font-size: 9px;
    }

    .cstory-signature {
        margin-top: 28px;
    }

    .cstory-highlights {
        grid-template-columns: 1fr;
        gap: 32px;
        margin-top: 45px;
    }

    .cstory-highlight-image {
        height: 260px;
    }

    .cstory-highlight-text {
        padding-top: 15px;
    }

    .cstory-highlight-text h4 {
        font-size: 21px;
    }
}

/* Small Mobile */

@media (max-width: 380px) {
    .condiment-story-section {
        padding-right: 15px;
        padding-left: 15px;
    }

    .cstory-main-image {
        height: 300px;
    }

    .cstory-content {
        padding: 28px 18px;
    }

    .cstory-content h3 {
        font-size: 32px;
    }

    .cstory-highlight-image {
        height: 220px;
    }
}

/* Accessibility */

@media (prefers-reduced-motion: reduce) {
    .cstory-reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .cstory-main-image img,
    .cstory-highlight-image img,
    .cstory-button,
    .cstory-button i {
        transition: none;
    }
}


/* ==========================================
   CONDIMENTS STORE — THE PERFECT MATCH
========================================== */

.condiment-match-section {
    width: 100%;
    padding: 100px 6%;
    overflow: hidden;
    background: #EEE8DC;
    color: #302820;
    font-family: 'Quicksand', sans-serif;
    box-sizing: border-box;
}

.condiment-match-section *,
.condiment-match-section *::before,
.condiment-match-section *::after {
    box-sizing: border-box;
}

.cmatch-container {
    max-width: 1300px;
    width: 100%;
    margin: 0 auto;
}

/* Header */

.cmatch-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 45px;
    margin-bottom: 40px;
}

.cmatch-eyebrow {
    display: inline-block;
    margin-bottom: 20px;
    color: #A77853;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2.4px;
}

.cmatch-header h2 {
      max-width: 650px;
    margin: 0;
    color: #302820;
    font-family: 'Quicksand', sans-serif;
    font-size: clamp(38px, 4.5vw, 62px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -1.5px;
}

.cmatch-header h2 span {
    color: #A77853;
    font-weight: 700;
}

.cmatch-header > p {
    max-width: 360px;
    margin: 0 0 7px;
    color: #71675C;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.9;
}

/* Featured Image */

.cmatch-feature {
    position: relative;
    display: flex;
    align-items: flex-end;
    min-height: 430px;
    overflow: hidden;
    background: #413328;
    color: #FFFFFF;
    text-decoration: none;
}

.cmatch-feature > img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.8s ease;
}

.cmatch-feature:hover > img {
    transform: scale(1.045);
}

.cmatch-feature-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        90deg,
        rgba(25, 27, 22, 0.83) 0%,
        rgba(25, 27, 22, 0.4) 48%,
        rgba(25, 27, 22, 0.05) 100%
    );
}

.cmatch-feature-content {
    position: relative;
    z-index: 1;
    max-width: 570px;
    padding: 50px;
}

.cmatch-tag {
    display: inline-block;
    margin-bottom: 20px;
    color: #E7C4A5;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
}

.cmatch-feature-content h3 {
    margin: 0 0 17px;
    color: #FFFFFF;
    font-family: 'Quicksand', sans-serif;
    font-size: clamp(42px, 5vw, 64px);
    font-weight: 700;
    line-height: 1.05;
    letter-spacing: -1.5px;
}

.cmatch-feature-content p {
    margin: 0;
    color: #F1E8DD;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.8;
}

.cmatch-feature-arrow {
    position: absolute;
    right: 30px;
    bottom: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    border: 1px solid rgba(255, 255, 255, 0.7);
    border-radius: 50%;
    color: #FFFFFF;
    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease;
}

.cmatch-feature:hover .cmatch-feature-arrow {
    background: #DDB699;
    border-color: #DDB699;
    color: #302820;
    transform: rotate(45deg);
}

/* Three Pairing Images */

.cmatch-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 25px;
    margin-top: 42px;
}

.cmatch-card {
    min-width: 0;
    color: #302820;
    text-decoration: none;
}

.cmatch-card-image {
    position: relative;
    height: 265px;
    overflow: hidden;
    background: #D9CABA;
}

.cmatch-card-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.65s ease;
}

.cmatch-card:hover .cmatch-card-image img {
    transform: scale(1.07);
}

.cmatch-card-index {
    position: absolute;
    top: 15px;
    left: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    background: #EEE8DC;
    color: #302820;
    font-size: 12px;
    font-weight: 700;
}

.cmatch-card-arrow {
    position: absolute;
    right: 15px;
    bottom: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    background: #A77853;
    color: #FFFFFF;
    transition:
        background 0.3s ease,
        transform 0.3s ease;
}

.cmatch-card:hover .cmatch-card-arrow {
    background: #302820;
    transform: rotate(45deg);
}

.cmatch-card-info {
    padding: 21px 0 0;
}

.cmatch-card-info > span {
    display: inline-block;
    margin-bottom: 12px;
    color: #A77853;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.6px;
}

.cmatch-card-info h3 {
    margin: 0 0 9px;
    color: #302820;
    font-family: 'Quicksand', sans-serif;
    font-size: 22px;
    font-weight: 700;
    line-height: 1.4;
}

.cmatch-card-info p {
    margin: 0;
    color: #71675C;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.8;
}

/* Footer */

.cmatch-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    margin-top: 50px;
    padding-top: 22px;
    border-top: 1px solid rgba(48, 40, 32, 0.2);
}

.cmatch-footer > span {
    color: #71675C;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.7px;
}

.cmatch-footer a {
    display: inline-flex;
    align-items: center;
    gap: 13px;
    color: #302820;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
    text-decoration: none;
}

.cmatch-footer a i {
    color: #A77853;
    transition: transform 0.3s ease;
}

.cmatch-footer a:hover i {
    transform: translateX(5px);
}

/* Animation */

.cmatch-reveal {
    opacity: 0;
    transform: translateY(24px);
    transition:
        opacity 0.7s ease,
        transform 0.7s ease;
}

.cmatch-reveal.cmatch-visible {
    opacity: 1;
    transform: translateY(0);
}

.cmatch-card:nth-child(2) {
    transition-delay: 0.12s;
}

.cmatch-card:nth-child(3) {
    transition-delay: 0.24s;
}

/* Tablet */

@media (max-width: 1024px) {
    .condiment-match-section {
        padding: 80px 4%;
    }

    .cmatch-header {
        gap: 25px;
    }

    .cmatch-feature {
        min-height: 380px;
    }

    .cmatch-feature-content {
        padding: 35px;
    }

    .cmatch-grid {
        gap: 16px;
    }

    .cmatch-card-image {
        height: 220px;
    }

    .cmatch-card-info h3 {
        font-size: 19px;
    }
}

/* Mobile */

@media (max-width: 767px) {
    .condiment-match-section {
        padding: 60px 20px;
    }

    .cmatch-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 18px;
        margin-bottom: 30px;
    }

    .cmatch-eyebrow {
        margin-bottom: 16px;
        font-size: 10px;
    }

    .cmatch-header h2 {
        font-size: clamp(36px, 9vw, 48px);
        letter-spacing: -1px;
    }

    .cmatch-header > p {
        max-width: 100%;
        font-size: 16px;
    }

    .cmatch-feature {
        min-height: 400px;
    }

    .cmatch-feature-overlay {
        background: linear-gradient(
            0deg,
            rgba(25, 27, 22, 0.9) 0%,
            rgba(25, 27, 22, 0.3) 75%,
            rgba(25, 27, 22, 0.08) 100%
        );
    }

    .cmatch-feature-content {
        padding: 28px 22px;
    }

    .cmatch-feature-content h3 {
        font-size: 43px;
    }

    .cmatch-feature-arrow {
        top: 18px;
        right: 18px;
        bottom: auto;
        width: 44px;
        height: 44px;
    }

    .cmatch-grid {
        grid-template-columns: 1fr;
        gap: 32px;
        margin-top: 32px;
    }

    .cmatch-card-image {
        height: 270px;
    }

    .cmatch-card-info {
        padding-top: 17px;
    }

    .cmatch-card-info h3 {
        font-size: 22px;
    }

    .cmatch-footer {
        flex-direction: column;
        align-items: flex-start;
        gap: 17px;
        margin-top: 35px;
    }
}

/* Small Mobile */

@media (max-width: 380px) {
    .condiment-match-section {
        padding-right: 15px;
        padding-left: 15px;
    }

    .cmatch-feature {
        min-height: 350px;
    }

    .cmatch-feature-content {
        padding: 22px 18px;
    }

    .cmatch-feature-content h3 {
        font-size: 37px;
    }

    .cmatch-card-image {
        height: 225px;
    }
}

/* Reduced Motion */

@media (prefers-reduced-motion: reduce) {
    .cmatch-reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .cmatch-feature img,
    .cmatch-card-image img,
    .cmatch-card-arrow,
    .cmatch-feature-arrow {
        transition: none;
    }
}

/* ==========================================
   CONDIMENTS STORE — FLAVOUR JOURNAL
   Editorial / Magazine Style
========================================== */

.condiment-journal-section {
    width: 100%;
    padding: 95px 6%;
    overflow: hidden;
    background: #F7F3EC;
    color: #302820;
    font-family: 'Quicksand', sans-serif;
    box-sizing: border-box;
}

.condiment-journal-section *,
.condiment-journal-section *::before,
.condiment-journal-section *::after {
    box-sizing: border-box;
}

.cjournal-container {
    width: 100%;
    max-width: 1260px;
    margin: 0 auto;
}

/* Masthead */

.cjournal-masthead {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    padding-bottom: 15px;
    border-bottom: 1px solid #CFC3B4;
    color: #71675C;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
}

/* Editorial Title */

.cjournal-title {
    position: relative;
    padding: 40px 0 48px;
}

.cjournal-title-index {
    display: inline-block;
    margin-bottom: 18px;
    color: #A77853;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
}

.cjournal-title h2 {
    max-width: 520px;
    margin: 0 0 24px;
    color: var(--se-text);
    font-family: "Quicksand", sans-serif;
    font-size: clamp(34px, 4.2vw, 56px);
    font-weight: 700;
    line-height: 1.16;
    letter-spacing: -1.5px;
    overflow-wrap: break-word;
}

.cjournal-title h2 em {
    color: #A77853;
    font-weight: 700;
    font-style: normal;
}

/* Feature Layout */

.cjournal-feature {
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    align-items: stretch;
    gap: 0;
}

/* Large Image */

.cjournal-photo {
    position: relative;
    min-width: 0;
    min-height: 470px;
    overflow: hidden;
    background: #D8C8B5;
}

.cjournal-photo img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 470px;
    object-fit: cover;
    transition: transform 0.7s ease;
}

.cjournal-photo:hover img {
    transform: scale(1.035);
}

.cjournal-photo-label {
    position: absolute;
    right: 18px;
    bottom: 18px;
    width:230px;
    left: 18px;
    padding: 15px 18px;
    background: rgba(25, 27, 22, 0.76);
    color: #FFFFFF;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 2px;
}

/* Story */

.cjournal-story {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding: 45px;
    background: #EEE8DC;
}

.cjournal-story-number {
    margin-bottom: 25px;
    color: #A77853;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
}

.cjournal-story h3 {
    margin: 0 0 23px;
    color: #302820;
    font-family: 'Quicksand', sans-serif;
    font-size: clamp(27px, 3vw, 39px);
    font-weight: 700;
    line-height: 1.3;
}

.cjournal-story p {
    margin: 0 0 17px;
    color: #71675C;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.9;
}

.cjournal-read-link {
    display: inline-flex;
    align-items: center;
    gap: 18px;
    margin-top: 13px;
    padding-bottom: 10px;
    border-bottom: 1px solid #A77853;
    color: #302820;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
    text-decoration: none;
}

.cjournal-read-link span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 31px;
    height: 31px;
    border-radius: 50%;
    background: #A77853;
    color: #FFFFFF;
    transition: transform 0.3s ease;
}

.cjournal-read-link:hover span {
    transform: rotate(45deg);
}

/* Bottom Editorial Notes */

.cjournal-notes {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 30px;
    margin-top: 42px;
    padding-top: 27px;
    border-top: 1px solid #CFC3B4;
}

.cjournal-note {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    min-width: 0;
}

.cjournal-note-number {
    flex-shrink: 0;
    color: #A77853;
    font-size: 13px;
    font-weight: 700;
}

.cjournal-note h4 {
    margin: 0 0 8px;
    color: #302820;
    font-family: 'Quicksand', sans-serif;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.5;
}

.cjournal-note p {
    margin: 0;
    color: #71675C;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.75;
}

/* Reveal Animation */

.cjournal-reveal {
    opacity: 0;
    transform: translateY(22px);
    transition:
        opacity 0.7s ease,
        transform 0.7s ease;
}

.cjournal-reveal.cjournal-visible {
    opacity: 1;
    transform: translateY(0);
}

/* Tablet */

@media (max-width: 1024px) {
    .condiment-journal-section {
        padding: 75px 4%;
    }

    .cjournal-feature {
        grid-template-columns: 1fr 0.9fr;
    }

    .cjournal-photo,
    .cjournal-photo img {
        min-height: 420px;
    }

    .cjournal-story {
        padding: 30px;
    }

    .cjournal-story h3 {
        font-size: 30px;
    }

    .cjournal-notes {
        gap: 20px;
    }
}

/* Mobile */

@media (max-width: 767px) {
    .condiment-journal-section {
        padding: 60px 20px;
    }

    .cjournal-masthead {
        font-size: 9px;
        letter-spacing: 1px;
    }

    .cjournal-title {
        padding: 32px 0;
    }

    .cjournal-title h2 {
        font-size: clamp(46px, 12vw, 64px);
        letter-spacing: -1.5px;
    }

    .cjournal-feature {
        grid-template-columns: 1fr;
    }

    .cjournal-photo,
    .cjournal-photo img {
        min-height: 330px;
        height: 330px;
    }

    .cjournal-story {
        padding: 30px 23px;
    }

    .cjournal-story-number {
        margin-bottom: 19px;
    }

    .cjournal-story h3 {
        margin-bottom: 18px;
        font-size: 32px;
    }

    .cjournal-story p {
        font-size: 16px;
    }

    .cjournal-notes {
        grid-template-columns: 1fr;
        gap: 22px;
        margin-top: 32px;
        padding-top: 25px;
    }

    .cjournal-note h4 {
        font-size: 18px;
    }
}

/* Small Mobile */

@media (max-width: 380px) {
    .condiment-journal-section {
        padding-right: 15px;
        padding-left: 15px;
    }

    .cjournal-photo,
    .cjournal-photo img {
        min-height: 280px;
        height: 280px;
    }

    .cjournal-story {
        padding: 25px 18px;
    }

    .cjournal-story h3 {
        font-size: 29px;
    }
}

/* Reduced Motion */

@media (prefers-reduced-motion: reduce) {
    .cjournal-reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .cjournal-photo img,
    .cjournal-read-link span {
        transition: none;
    }
}

@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@400;500;600;700&display=swap');

.condiment-atelier-section {
    --atelier-bg: #F7F3EC;
    --atelier-text: #302820;
    --atelier-muted: #776D61;
    --atelier-accent: #A77853;
    --atelier-line: rgba(48, 40, 32, 0.18);
    --atelier-panel: #E9DFD1;

    position: relative;
    width: 100%;
    padding: 100px 5.5%;
    background: var(--atelier-bg);
    color: var(--atelier-text);
    font-family: 'Quicksand', sans-serif;
    overflow: hidden;
}

.condiment-atelier-section *,
.condiment-atelier-section *::before,
.condiment-atelier-section *::after {
    box-sizing: border-box;
}

.atelier-shell {
    max-width: 1400px;
    margin: 0 auto;
}

/* Topline */

.atelier-topline {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    padding-bottom: 23px;
    border-bottom: 1px solid var(--atelier-line);
}

.atelier-eyebrow,
.atelier-index {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
}

.atelier-eyebrow {
    display: flex;
    align-items: center;
    gap: 12px;
}

.atelier-eyebrow-line {
    width: 28px;
    height: 1px;
    background: var(--atelier-accent);
}

.atelier-index {
    color: var(--atelier-muted);
}

/* Main Layout */

.atelier-layout {
    display: grid;
    grid-template-columns: 0.9fr 1.1fr;
    align-items: center;
    gap: clamp(45px, 8vw, 120px);
    padding: 65px 0 75px;
}

/* Left Content */

.atelier-intro {
    position: relative;
    z-index: 2;
    opacity: 0;
    transform: translateY(28px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}

.atelier-intro.atelier-revealed {
    opacity: 1;
    transform: translateY(0);
}

.atelier-kicker {
    margin: 0 0 22px;
    color: var(--atelier-accent);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2.5px;
}

.atelier-intro h2 {
      max-width: 650px;
    margin: 0;
    color: #302820;
    font-family: 'Quicksand', sans-serif;
    font-size: clamp(38px, 4.5vw, 62px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -1.5px;
}

.atelier-intro h2 span:not(.atelier-period) {
    color: var(--atelier-accent);
    font-weight: 700;
}

.atelier-period {
    color: var(--atelier-accent);
}

.atelier-description {
    max-width: 400px;
    margin: 28px 0 30px;
    color: var(--atelier-muted);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.95;
}

/* Discover Link */

.atelier-discover-link {
    display: inline-flex;
    align-items: center;
    gap: 20px;
    color: var(--atelier-text);
    text-decoration: none;
    font-size: 12px;
    font-weight: 700;
    transition: color 0.3s ease;
}

.atelier-link-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 43px;
    height: 43px;
    border: 1px solid var(--atelier-line);
    border-radius: 50%;
    font-size: 12px;
    transition: background 0.35s ease,
                color 0.35s ease,
                transform 0.35s ease;
}

.atelier-discover-link:hover {
    color: var(--atelier-accent);
}

.atelier-discover-link:hover .atelier-link-icon {
    background: var(--atelier-accent);
    border-color: var(--atelier-accent);
    color: #fff;
    transform: rotate(45deg);
}

/* Signature */

.atelier-signature {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-top: 65px;
    color: var(--atelier-muted);
    font-size: 10px;
    font-weight: 600;
}

.atelier-signature-number {
    color: var(--atelier-accent);
    font-size: 12px;
    font-weight: 700;
}

.atelier-signature-line {
    width: 35px;
    height: 1px;
    background: var(--atelier-line);
}

/* Image Composition */

.atelier-visual {
    position: relative;
    min-width: 0;
    min-height: 580px;
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.9s ease 0.15s,
                transform 0.9s ease 0.15s;
}

.atelier-visual.atelier-revealed {
    opacity: 1;
    transform: translateY(0);
}

.atelier-image-main {
    position: absolute;
    top: 0;
    right: 7%;
    width: 77%;
    height: 475px;
    overflow: hidden;
    background: var(--atelier-panel);
}

.atelier-image-main img,
.atelier-image-small img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.8s cubic-bezier(.2, .7, .2, 1);
}

.atelier-image-main:hover img,
.atelier-image-small:hover img {
    transform: scale(1.045);
}

.atelier-image-shade {
    position: absolute;
    inset: 45% 0 0;
    background: linear-gradient(
        to bottom,
        transparent,
        rgba(20, 17, 13, 0.55)
    );
    pointer-events: none;
}

.atelier-image-caption {
    position: absolute;
    right: 24px;
    bottom: 23px;
    left: 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
}

.atelier-image-caption i {
    font-size: 15px;
}

/* Smaller Overlapping Image */

.atelier-image-small {
    position: absolute;
    left: 0;
    bottom: 34px;
    width: 43%;
    height: 245px;
    overflow: hidden;
    border: 8px solid var(--atelier-bg);
    background: var(--atelier-panel);
}

/* Circular Stamp */

.atelier-stamp {
    position: absolute;
    top: 28px;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 105px;
    height: 105px;
    border-radius: 50%;
    background: var(--atelier-panel);
    color: var(--atelier-accent);
}

.atelier-stamp svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    animation: atelierRotate 24s linear infinite;
}

.atelier-stamp text {
    fill: currentColor;
    font-family: 'Quicksand', sans-serif;
    font-size: 8.7px;
    font-weight: 700;
    letter-spacing: 1.3px;
}

.atelier-stamp > i {
    font-size: 25px;
}

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

/* Floating Note */

.atelier-product-note {
    position: absolute;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    gap: 13px;
    max-width: 300px;
    padding: 18px 22px;
    background: var(--atelier-panel);
}

.atelier-note-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    width: 38px;
    height: 38px;
    border: 1px solid var(--atelier-line);
    border-radius: 50%;
    color: var(--atelier-accent);
}

.atelier-product-note div {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.atelier-product-note strong {
    font-size: 11px;
    font-weight: 700;
}

.atelier-product-note div > span {
    color: var(--atelier-muted);
    font-size: 10px;
    line-height: 1.6;
}

/* Bottom Strip */

.atelier-bottom-strip {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    padding-top: 22px;
    border-top: 1px solid var(--atelier-line);
    color: var(--atelier-muted);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.6px;
}

.atelier-strip-symbol {
    color: var(--atelier-accent);
    font-size: 15px;
}

/* Responsive */

@media (min-width: 1500px) {
    .condiment-atelier-section {
        padding-right: 7%;
        padding-left: 7%;
    }
}

@media (max-width: 1024px) {
    .condiment-atelier-section {
        padding: 80px 5%;
    }

    .atelier-layout {
        gap: 35px;
        padding: 55px 0 65px;
    }

    .atelier-intro h2 {
        font-size: clamp(44px, 6vw, 62px);
        letter-spacing: -2px;
    }

    .atelier-visual {
        min-height: 500px;
    }

    .atelier-image-main {
        height: 400px;
    }

    .atelier-image-small {
        height: 200px;
    }

    .atelier-product-note {
        max-width: 260px;
        padding: 14px;
    }

    .atelier-bottom-strip {
        letter-spacing: 1px;
    }
}

@media (max-width: 767px) {
    .condiment-atelier-section {
        padding: 65px 22px;
    }

    .atelier-topline {
        padding-bottom: 18px;
    }

    .atelier-eyebrow,
    .atelier-index {
        font-size: 8px;
        letter-spacing: 1.2px;
    }

    .atelier-eyebrow {
        gap: 8px;
    }

    .atelier-eyebrow-line {
        width: 19px;
    }

    .atelier-layout {
        grid-template-columns: 1fr;
        gap: 40px;
        padding: 42px 0 45px;
    }

    .atelier-intro h2 {
        font-size: clamp(47px, 11vw, 68px);
        line-height: 1.04;
        letter-spacing: -2px;
    }

    .atelier-kicker {
        margin-bottom: 17px;
        font-size: 10px;
    }

    .atelier-description {
        max-width: 440px;
        margin: 23px 0;
        font-size: 14px;
        line-height: 1.85;
    }

    .atelier-signature {
        margin-top: 35px;
    }

    .atelier-visual {
        min-height: 450px;
    }

    .atelier-image-main {
        right: 0;
        width: 82%;
        height: 355px;
    }

    .atelier-image-small {
        bottom: 24px;
        width: 43%;
        height: 170px;
        border-width: 6px;
    }

    .atelier-stamp {
        top: 18px;
        left: 0;
        width: 78px;
        height: 78px;
    }

    .atelier-stamp > i {
        font-size: 19px;
    }

    .atelier-stamp text {
        font-size: 9px;
    }

    .atelier-product-note {
        right: 0;
        bottom: 0;
        max-width: 245px;
        gap: 9px;
        padding: 12px;
    }

    .atelier-note-icon {
        width: 31px;
        height: 31px;
        font-size: 12px;
    }

    .atelier-product-note strong {
        font-size: 10px;
    }

    .atelier-product-note div > span {
        font-size: 8px;
    }

    .atelier-bottom-strip {
        justify-content: center;
        flex-wrap: wrap;
        gap: 12px;
        text-align: center;
        font-size: 8px;
    }
}

@media (max-width: 380px) {
    .condiment-atelier-section {
        padding-right: 16px;
        padding-left: 16px;
    }

    .atelier-visual {
        min-height: 395px;
    }

    .atelier-image-main {
        height: 315px;
    }

    .atelier-image-small {
        height: 145px;
    }

    .atelier-product-note {
        max-width: 220px;
    }

    .atelier-index {
        font-size: 7px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .condiment-atelier-section *,
    .condiment-atelier-section *::before,
    .condiment-atelier-section *::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}

/* FLAVOUR COLLECTION */

.condiment-collection-section {
    --collection-bg: #EEE8DC;
    --collection-text: #302820;
    --collection-muted: #776D61;
    --collection-accent: #A77853;
    --collection-line: rgba(48, 40, 32, 0.2);
    --collection-card-bg: #E5DACA;

    width: 100%;
    padding: 100px 5.5%;
    overflow: hidden;
    background: var(--collection-bg);
    color: var(--collection-text);
    font-family: 'Quicksand', sans-serif;
}

.condiment-collection-section *,
.condiment-collection-section *::before,
.condiment-collection-section *::after {
    box-sizing: border-box;
}

.collection-shell {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
}

/* Heading */

.collection-heading-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 30px;
}

.collection-eyebrow {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 22px;
    color: var(--collection-accent);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2.5px;
}

.collection-eyebrow span {
    width: 27px;
    height: 1px;
    background: var(--collection-accent);
}

.collection-heading-row h2 {
     max-width: 650px;
    margin: 0;
    color: #302820;
    font-family: 'Quicksand', sans-serif;
    font-size: clamp(38px, 4.5vw, 62px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -1.5px;
}

.collection-heading-row h2 em {
    color: var(--collection-accent);
    font-weight: 700;
    font-style: normal;
}

.collection-view-link {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    flex-shrink: 0;
    padding-bottom: 9px;
    color: var(--collection-text);
    text-decoration: none;
    font-size: 14px;
    font-weight: 700;
    border-bottom: 1px solid var(--collection-line);
    transition: color 0.3s ease, border-color 0.3s ease;
}

.collection-view-link i {
    font-size: 11px;
    transition: transform 0.3s ease;
}

.collection-view-link:hover {
    color: var(--collection-accent);
    border-color: var(--collection-accent);
}

.collection-view-link:hover i {
    transform: translate(3px, -3px);
}

.collection-intro {
    max-width: 490px;
    margin: 22px 0 48px;
    color: var(--collection-muted);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.9;
}

/* Product Grid */

.collection-products {
    display: grid;
    grid-template-columns: 1.15fr 1fr 1fr;
    align-items: start;
    gap: 25px;
}

.collection-product {
    display: block;
    min-width: 0;
    color: inherit;
    text-decoration: none;
}

.collection-product-visual {
    position: relative;
    height: 390px;
    overflow: hidden;
    background: var(--collection-card-bg);
}

.collection-product-featured .collection-product-visual {
    height: 390px;
}

.collection-product-visual img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.75s cubic-bezier(.2, .7, .2, 1);
}

.collection-product:hover .collection-product-visual img {
    transform: scale(1.06);
}

/* Overlay */

.collection-product-visual::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(22, 19, 15, 0.18) 0%,
        transparent 35%,
        transparent 55%,
        rgba(22, 19, 15, 0.45) 100%
    );
    pointer-events: none;
}

.collection-product-number {
    position: absolute;
    z-index: 1;
    top: 18px;
    left: 19px;
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1px;
}

.collection-product-arrow {
    position: absolute;
    z-index: 2;
    top: 15px;
    right: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    border: 1px solid rgba(255, 255, 255, 0.75);
    border-radius: 50%;
    color: #fff;
    font-size: 12px;
    transition: background 0.3s ease,
                color 0.3s ease,
                transform 0.3s ease;
}

.collection-product:hover .collection-product-arrow {
    transform: rotate(45deg);
    background: #fff;
    color: #302820;
}

.collection-product-label {
    position: absolute;
    z-index: 1;
    bottom: 20px;
    left: 19px;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.8px;
}

/* Product Info */

.collection-product-info {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    padding: 20px 0 22px;
    border-bottom: 1px solid var(--collection-line);
}

.collection-product-info h3 {
    margin: 0 0 8px;
    font-size: 19px;
    font-weight: 700;
    line-height: 1.4;
}

.collection-product-info p {
    margin: 0;
    color: var(--collection-muted);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.7;
}

.collection-product-count {
    padding-top: 5px;
    color: var(--collection-accent);
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 1px;
    white-space: nowrap;
}

/* Footer */

.collection-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    margin-top: 35px;
    color: var(--collection-muted);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.6px;
}

.collection-footer-mark {
    display: flex;
    align-items: center;
    gap: 10px;
}

.collection-footer-mark i {
    color: var(--collection-accent);
    font-size: 13px;
}

/* Tablet */

@media (max-width: 1024px) {
    .condiment-collection-section {
        padding: 80px 5%;
    }

    .collection-products {
        gap: 18px;
    }

    .collection-product-visual {
        height: 330px;
    }

    .collection-product-featured .collection-product-visual {
        height: 375px;
    }

    .collection-product-info {
        flex-direction: column;
        gap: 8px;
    }

    .collection-product-info h3 {
        font-size: 17px;
    }
}

/* Mobile */

@media (max-width: 767px) {
    .condiment-collection-section {
        padding: 65px 22px;
    }

    .collection-heading-row {
        align-items: flex-start;
        flex-direction: column;
        gap: 22px;
    }

    .collection-eyebrow {
        margin-bottom: 17px;
        font-size: 9px;
    }

    .collection-heading-row h2 {
        font-size: clamp(36px, 9vw, 50px);
        letter-spacing: -1.5px;
    }

    .collection-view-link {
        padding-bottom: 7px;
    }

    .collection-intro {
        margin: 19px 0 32px;
        font-size: 13px;
    }

    .collection-products {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .collection-product-visual,
    .collection-product-featured .collection-product-visual {
        height: clamp(300px, 95vw, 440px);
    }

    .collection-product-info {
        flex-direction: row;
        align-items: flex-start;
        padding: 17px 0 19px;
    }

    .collection-product-info h3 {
        font-size: 18px;
    }

    .collection-product-info p {
        font-size: 12px;
    }

    .collection-footer {
        flex-wrap: wrap;
        margin-top: 28px;
        font-size: 8px;
        line-height: 1.8;
    }
}

@media (max-width: 380px) {
    .condiment-collection-section {
        padding-right: 16px;
        padding-left: 16px;
    }

    .collection-product-info {
        gap: 8px;
    }

    .collection-product-info h3 {
        font-size: 16px;
    }

    .collection-product-count {
        font-size: 7px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .condiment-collection-section *,
    .condiment-collection-section *::before,
    .condiment-collection-section *::after {
        transition-duration: 0.01ms !important;
    }
}


/* FROM THE PANTRY */

.condiment-pantry-section {
    --pantry-bg: #24261F;
    --pantry-text: #F5EFE5;
    --pantry-muted: #BDB3A5;
    --pantry-accent: #DDB699;
    --pantry-line: rgba(245, 239, 229, 0.2);
    --pantry-panel: #303128;

    width: 100%;
    padding: 100px 5.5% 35px;
    background: var(--pantry-bg);
    color: var(--pantry-text);
    font-family: 'Quicksand', sans-serif;
    overflow: hidden;
}

.condiment-pantry-section *,
.condiment-pantry-section *::before,
.condiment-pantry-section *::after {
    box-sizing: border-box;
}

.pantry-shell {
    max-width: 1400px;
    width: 100%;
    margin: 0 auto;
}

/* Heading */

.pantry-heading {
    display: grid;
    grid-template-columns: 1fr 0.7fr;
    align-items: end;
    gap: 50px;
    padding-bottom: 48px;
}

.pantry-eyebrow {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 23px;
    color: var(--pantry-accent);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
}

.pantry-eyebrow-line {
    width: 28px;
    height: 1px;
    background: var(--pantry-accent);
}

.pantry-heading-main h2 {
     max-width: 650px;
    margin: 0;
    color: var(--pantry-accent);
    font-family: 'Quicksand', sans-serif;
    font-size: clamp(38px, 4.5vw, 62px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -1.5px;
}

.pantry-heading-main h2 em {
    color: var(--pantry-accent);
    font-weight: 700;
    font-style: normal;
}

.pantry-heading-side {
    max-width: 340px;
    justify-self: end;
    padding-bottom: 5px;
}

.pantry-heading-index {
    display: inline-block;
    margin-bottom: 16px;
    color: var(--pantry-accent);
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 1.8px;
}

.pantry-heading-side p {
    margin: 0;
    color: var(--pantry-muted);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.9;
}

/* Gallery Layout */

.pantry-gallery {
    display: grid;
    grid-template-columns: 1.15fr 0.85fr 1fr;
    grid-template-rows: 270px 230px;
    gap: 17px;
}

.pantry-item {
    position: relative;
    min-width: 0;
    min-height: 0;
    margin: 0;
    overflow: hidden;
    background: var(--pantry-panel);
}

.pantry-item-large {
    grid-column: 1;
    grid-row: 1 / 3;
}

.pantry-item-tall {
    grid-column: 2;
    grid-row: 1;
}

.pantry-item-wide {
    grid-column: 2 / 4;
    grid-row: 2;
}

.pantry-item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.8s cubic-bezier(.2, .7, .2, 1);
}

.pantry-item:hover img {
    transform: scale(1.055);
}

/* Image Captions */

.pantry-item::after {
    content: "";
    position: absolute;
    inset: 45% 0 0;
    background: linear-gradient(
        to bottom,
        transparent,
        rgba(17, 17, 13, 0.7)
    );
    pointer-events: none;
}

.pantry-caption {
    position: absolute;
    z-index: 1;
    right: 18px;
    bottom: 18px;
    left: 18px;
    display: grid;
    grid-template-columns: 28px 1fr;
    align-items: center;
    gap: 7px 10px;
    color: #fff;
}

.pantry-caption-number {
    grid-column: 1;
    grid-row: 1 / 3;
    align-self: start;
    color: var(--pantry-accent);
    font-size: 16px;
    font-weight: 700;
}

.pantry-caption-title {
    grid-column: 2;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.4;
}

.pantry-caption-detail {
    grid-column: 2;
    color: rgba(255, 255, 255, 0.8);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 1.4px;
    line-height: 1.6;
}

/* Central Text Panel */

.pantry-note {
    grid-column: 3;
    grid-row: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 25px 28px;
    background: var(--pantry-panel);
}

.pantry-note-mark {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 39px;
    height: 39px;
    margin-bottom: 23px;
    border: 1px solid var(--pantry-line);
    border-radius: 50%;
    color: var(--pantry-accent);
    font-size: 14px;
}

.pantry-note-small {
    color: var(--pantry-accent);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1.7px;
}

.pantry-note p {
    margin: 15px 0 20px;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.55;
}

.pantry-note-bottom {
    padding-top: 14px;
    border-top: 1px solid var(--pantry-line);
    color: var(--pantry-muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.1px;
    line-height: 1.8;
}

/* Bottom Line */

.pantry-bottom-line {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding-top: 26px;
}

.pantry-bottom-line > span {
    color: var(--pantry-muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.5px;
    white-space: nowrap;
}

.pantry-bottom-rule {
    flex: 1;
    height: 1px;
    background: var(--pantry-line);
}

.pantry-bottom-right {
    display: flex;
    align-items: center;
    gap: 10px;
}

.pantry-bottom-right i {
    color: var(--pantry-accent);
    font-size: 12px;
}

/* Tablet */

@media (max-width: 1024px) {
    .condiment-pantry-section {
        padding: 80px 5% 30px;
    }

    .pantry-heading {
        gap: 30px;
        padding-bottom: 38px;
    }

    .pantry-heading-main h2 {
        font-size: clamp(54px, 7.5vw, 75px);
        letter-spacing: -2.5px;
    }

    .pantry-gallery {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 330px 250px 220px;
        gap: 14px;
    }

    .pantry-item-large {
        grid-column: 1;
        grid-row: 1 / 3;
    }

    .pantry-item-tall {
        grid-column: 2;
        grid-row: 1;
    }

    .pantry-note {
        grid-column: 2;
        grid-row: 2;
        padding: 22px;
    }

    .pantry-item-wide {
        grid-column: 1 / 3;
        grid-row: 3;
    }

    .pantry-note p {
        font-size: 19px;
    }
}

/* Mobile */

@media (max-width: 767px) {
    .condiment-pantry-section {
        padding: 65px 22px 28px;
    }

    .pantry-heading {
        grid-template-columns: 1fr;
        gap: 25px;
        padding-bottom: 32px;
    }

    .pantry-eyebrow {
        margin-bottom: 18px;
        font-size: 9px;
    }

    .pantry-heading-main h2 {
        font-size: clamp(55px, 12vw, 76px);
        letter-spacing: -2.5px;
    }

    .pantry-heading-side {
        max-width: 430px;
        justify-self: start;
    }

    .pantry-heading-side p {
        font-size: 12px;
    }

    .pantry-gallery {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 320px 210px 245px;
        gap: 10px;
    }

    .pantry-item-large {
        grid-column: 1 / 3;
        grid-row: 1;
    }

    .pantry-item-tall {
        grid-column: 1;
        grid-row: 2;
    }

    .pantry-note {
        grid-column: 2;
        grid-row: 2;
        padding: 16px;
    }

    .pantry-item-wide {
        grid-column: 1 / 3;
        grid-row: 3;
    }

    .pantry-caption {
        right: 12px;
        bottom: 13px;
        left: 12px;
        grid-template-columns: 20px 1fr;
        gap: 6px;
    }

    .pantry-caption-title {
        font-size: 12px;
    }

    .pantry-caption-detail {
        font-size: 6px;
        letter-spacing: 0.8px;
    }

    .pantry-note-mark {
        width: 30px;
        height: 30px;
        margin-bottom: 14px;
        font-size: 11px;
    }

    .pantry-note-small {
        font-size: 7px;
        letter-spacing: 1px;
    }

    .pantry-note p {
        margin: 10px 0 13px;
        font-size: clamp(13px, 3.6vw, 17px);
        line-height: 1.5;
    }

    .pantry-note-bottom {
        padding-top: 10px;
        font-size: 6px;
        letter-spacing: 0.5px;
    }

    .pantry-bottom-line {
        flex-wrap: wrap;
        gap: 12px;
        padding-top: 22px;
    }

    .pantry-bottom-line > span {
        font-size: 7px;
        letter-spacing: 1px;
    }

    .pantry-bottom-rule {
        display: none;
    }

    .pantry-bottom-right {
        width: 100%;
    }
}

@media (max-width: 380px) {
    .condiment-pantry-section {
        padding-right: 16px;
        padding-left: 16px;
    }

    .pantry-gallery {
        grid-template-rows: 280px 195px 215px;
        gap: 8px;
    }

    .pantry-note {
        padding: 12px;
    }

    .pantry-note p {
        font-size: 13px;
    }

    .pantry-caption-title {
        font-size: 10px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .condiment-pantry-section *,
    .condiment-pantry-section *::before,
    .condiment-pantry-section *::after {
        transition-duration: 0.01ms !important;
    }
}









.spice-logo {
display: inline-flex;
align-items: center;
flex-shrink: 0;
width: 245px;
height: 82px;
overflow: visible;
}

.spice-logo-image {
display: block;
width: 100%;
height: 100%;
object-fit: contain;
object-position: left center;
transform: scale(1.5);
transform-origin: left center;
}

/* Tablet */
@media (max-width: 1024px) {
.spice-logo {
width: 215px;
height: 74px;
}

.spice-logo-image {
    transform: scale(1.2);
}

}

/* Mobile */
@media (max-width: 767px) {
.spice-logo {
width: 185px;
height: 65px;
}

.spice-logo-image {
    transform: scale(1.15);
}

}

@media (max-width: 380px) {
.spice-logo {
width: 160px;
height: 58px;
}
}