:root {
    --Green-Lightest: #8CC3A2FF;
    --Green-Light: #4F9A72FF;
    --Green-Dark: var(--tblr-primary);
    --Green-Darkest: #11402BFF;
    --Red: #B12529FF;
    --White: #FFFFFFFF;
    --Lightest-Gray: #FAF8F0FF;
    --Light-Gray: #F2EED9FF;
    --Meduim-Gray: #D0D0D0FF;
    --Dark-Gray: #00000080;
    --Black: #102317FF;
    --Yellow: #ECB534FF;
    --Transparent: #FFFFFF00;
    --Disabled: #6C757D80;
    --Links: var(--tblr-link-color);
    --Light-Grayish-Blue: #D3DAE3FF;
    --Light-Grayish-Blue-transparent: #D3DAE380;
    --Blue: #0B99FFFF;
    --Light-Green: #70E116FF;
    --Light-Orange: #EDB015FF;
}

/* ============================================================
Forms
============================================================ */
[dir='rtl'] input,
[dir='rtl'] textarea,
[dir='rtl'] select {
    direction: rtl;
}

footer .nav .nav-item .nav-link:hover {
    background-color: unset;
    color: var(--tblr-primary);
}

/* ============================================================
Navbar
============================================================ */
.btn-brand,
.btn-outline-brand:hover,
.btn-outline-brand:focus {
    background-color: var(--Green-Dark);
    border-color: var(--Green-Dark);
    color: var(--White);
}

.btn-brand:hover,
.btn-brand:focus {
    background-color: var(--Green-Darkest);
    border-color: var(--Green-Darkest);
    color: var(--White);
}

.btn-outline-brand {
    background-color: transparent;
    border-color: var(--Green-Dark);
    color: var(--Green-Dark);
}

/* ============================================================
Social Buttons
============================================================ */
.btn-social {
    gap: 0.6rem;
    border-radius: 0.625rem;
    font-weight: 500;
}

.btn-social-magic-link,
.btn-social-google {
    background-color: var(--White);
    border: 1px solid var(--Meduim-Gray);
    color: var(--Black);
}

.btn-social-magic-link:hover,
.btn-social-google:hover {
    background-color: var(--Lightest-Gray);
    color: var(--Black);
}

.btn-social-facebook {
    background-color: var(--Blue);
    border-color: var(--Blue);
    color: var(--White);
}

.btn-social-facebook:hover {
    background-color: var(--Blue);
    color: var(--White);
    opacity: 0.9;
}

/* ============================================================
Form Check (Radio)
============================================================ */
.form-check-input[type='radio']:checked {
    background-color: var(--Green-Dark);
    border-color: var(--Green-Dark);
}

.form-check-input[type='radio']:focus {
    border-color: var(--Green-Dark);
    box-shadow: 0 0 0 0.25rem rgba(8, 114, 59, 0.25);
}

/* Shared design tokens for the navbar and subsequent sections. */
.website-layout {
    --site-paper: #fcfaf5;
    --site-background: linear-gradient(110deg, #f1f4e8, var(--site-paper) 65%);
    --site-surface: #fffefa;
    --site-soft: #e9efdf;
    --site-gold: #eab642;
    --site-ink: #1b301e;
    --site-text: #53634a;
    --site-line: #dce3d0;
    --site-radius: 1.25rem;
    --site-shadow: 0 12px 32px #243b1710;
    --site-highlight: linear-gradient(transparent 73%, #edbe5080 73%, #edbe5080 88%, transparent 88%);
    --tblr-body-bg: var(--site-paper);
}

.website-layout,
.site-hero,
.site-store,
.site-stores,
.site-offers,
.site-categories {
    background: var(--site-background);
}

/* Illustrated 404 and 500 pages. */
.site-error-content {
    max-inline-size: 64rem;
    margin-inline: auto;
}

.site-error-illustration {
    inline-size: 100%;
    max-inline-size: 24rem;
    block-size: min(55svh, 32rem);
}

[dir='ltr'] .site-error-illustration {
    transform: scaleX(-1);
}

.site-error-code {
    color: var(--site-ink);
    font-size: clamp(4rem, 12vw, 8rem);
}

/* Center short auth forms below the measured header; long forms grow naturally. */
.site-auth {
    min-block-size: calc(100svh - var(--site-navbar-height, 0px));
}

.auth-page .page-body {
    margin-block-end: 0;
}

/* Navbar: shared Tabler controls, desktop navigation and mobile offcanvas. */
.site-navbar,
.site-hero,
.site-store-strip,
.site-store,
.site-stores,
.site-offers,
.site-categories,
.site-offers-grid,
.site-error-content,
.site-coupon-reveal {
    --site-gutter: clamp(1rem, 2.5vw, 2rem);
    --site-content-width: 100rem;
    --tblr-primary: var(--site-ink);
    --tblr-primary-fg: var(--site-surface);
    --tblr-primary-darken: #365635;
    --tblr-body-color: var(--site-ink);
    --tblr-bg-surface: var(--site-surface);
    --tblr-border-color-translucent: var(--site-line);
    --tblr-border-radius: 0.75rem;
    --tblr-secondary: var(--site-text);
    --tblr-secondary-rgb: 83, 99, 74;
    --tblr-tertiary: var(--site-text);
    color: var(--site-ink);
}

.site-navbar {
    background: var(--site-paper);
    transition: top 0.25s ease;
}

.site-navbar.is-hidden {
    top: calc(-1 * var(--site-navbar-height));
}

.site-navbar.is-scrolled {
    box-shadow: var(--site-shadow);
}

.site-navbar .container,
.site-container {
    max-width: var(--site-content-width);
    padding-inline: var(--site-gutter);
}

.site-header {
    display: grid;
    align-items: center;
}

.site-navbar .navbar-brand {
    justify-self: start;
}

.site-header-search,
.site-header-actions {
    grid-area: 1 / 2;
}

.site-header-actions,
.site-navbar-settings {
    justify-self: end;
}

.site-navbar-links {
    grid-area: 2 / 1 / auto / -1;
}

.site-navbar-settings {
    grid-area: 1 / 3;
}

.site-navbar-settings .flag {
    inline-size: 1.75rem;
    block-size: 1.3125rem;
    flex-shrink: 0;
}

.site-navbar .nav-link,
.site-navbar .btn {
    gap: 0.5rem;
}

.site-navbar .nav-link,
.site-navbar .btn,
.site-search .form-control,
.site-hero .btn,
.site-hero .form-control {
    min-block-size: 2.875rem;
    font-size: 1rem;
}

.site-navbar .nav-link {
    display: flex;
    align-items: center;
    padding: 0.5rem;
    color: var(--site-ink);
    font-weight: 500;
    white-space: nowrap;
}

.site-navbar .nav-link:hover {
    color: var(--tblr-primary-darken);
    background: var(--site-soft);
}

.site-navbar .dropdown-menu {
    --tblr-dropdown-link-hover-bg: var(--site-soft);
    --tblr-dropdown-link-active-color: var(--site-ink);
    --tblr-dropdown-link-active-bg: var(--site-soft);
    --tblr-dropdown-header-color: var(--site-text);
    max-block-size: 65dvh;
    max-inline-size: calc(100vw - 2rem);
    overflow-y: auto;
}

.site-navbar .dropdown-item {
    min-inline-size: var(--tblr-dropdown-min-width);
    padding-block: 0.625rem;
    white-space: normal;
}

.site-navbar :is(a, button):focus-visible,
.site-hero :is(a, button):focus-visible {
    outline: 3px solid #a77b20;
    outline-offset: 3px;
}

.site-navbar .btn-icon {
    inline-size: 2.875rem;
}

.site-navbar .btn-ghost-secondary {
    --tblr-btn-color: var(--site-ink);
    --tblr-btn-hover-color: var(--site-ink);
    --tblr-btn-active-color: var(--site-ink);
    --tblr-btn-hover-bg: var(--site-soft);
    --tblr-btn-active-bg: var(--site-soft);
    --tblr-btn-hover-border-color: transparent;
}

.site-account-button.btn-primary {
    min-inline-size: 8.5rem;
}

.site-search {
    border: 1px solid #cfd9c1;
    border-radius: 1rem;
    background: var(--site-surface);
}

.site-search .form-control {
    padding-inline: 3.25rem 0.75rem;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.site-search > .col {
    min-inline-size: 0;
}

.site-search:focus-within {
    border-color: #75985d;
    box-shadow: 0 0 0 4px #92b37822;
}

[dir='ltr'] .site-menu-arrow {
    transform: rotate(180deg);
}

@media (max-width: 1199.98px) {
    .website-layout {
        overflow-x: clip;
    }

    .site-header {
        position: relative;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 0 1rem;
    }

    .site-navbar .navbar-brand {
        max-inline-size: 100%;
    }

    .site-navbar .logo {
        inline-size: clamp(8.5rem, 38vw, 11rem);
        max-inline-size: 100%;
        block-size: 4.75rem;
    }

    .site-header-search {
        position: static;
    }

    .site-navbar .site-header-search-panel {
        inset-inline: var(--site-gutter);
        top: 100%;
        margin: 0.25rem 0 0;
        padding: 0.75rem;
        max-inline-size: none;
        background: var(--site-paper);
        border: 1px solid var(--site-line);
        box-shadow: var(--site-shadow);
    }

    .site-header-search .site-search,
    .site-header-search .site-search:focus-within {
        border-color: var(--site-line);
        background: var(--site-surface);
        box-shadow: none;
    }

    .site-header-search .btn {
        --tblr-btn-color: var(--site-text);
    }

    .site-header-search > .btn[aria-expanded='true'] {
        background: var(--site-soft);
    }

    .site-navbar-menu {
        --tblr-offcanvas-width: min(90vw, 22.5rem);
        background: var(--site-paper);
    }

    .site-navbar-menu .offcanvas-body {
        display: flex;
        flex-direction: column;
        gap: 1.5rem;
    }

    .site-navbar-menu .offcanvas-header {
        padding-inline-end: 0.25rem;
    }

    .site-navbar-menu .offcanvas-body > * {
        flex-shrink: 0;
    }

    .site-navbar,
    .site-navbar-menu .offcanvas-header,
    .site-navbar-links .nav-link {
        border-block-end: 1px solid var(--site-line);
    }

    .site-navbar-links {
        gap: 0.5rem;
    }

    .site-navbar-menu .nav-link {
        white-space: normal;
    }

    .site-navbar-links .nav-link {
        inline-size: 100%;
        min-block-size: 3.5rem;
    }

    .site-navbar-links .nav-link.active {
        background: var(--site-soft);
        box-shadow: inset 0 -3px var(--site-gold);
    }

    .site-navbar-menu .dropdown-toggle::after {
        display: none;
    }

    .site-menu-arrow {
        margin-inline-start: auto;
    }

    .site-navbar-settings {
        margin-block-start: auto;
        gap: 0.75rem;
    }

    .site-navbar .site-preference {
        inline-size: 100%;
        gap: 0.75rem;
        padding: 0.875rem;
        border: 1px solid var(--site-line);
        border-radius: var(--tblr-border-radius);
        background: var(--site-surface);
    }

    .site-preference small {
        font-size: 0.875rem;
        color: var(--site-text);
    }

    .site-offcanvas-account .site-account-button {
        inline-size: 100%;
    }

    .site-navbar-menu .dropdown:not(.site-preference-dropdown) > .dropdown-menu {
        position: static !important;
        transform: none !important;
        min-inline-size: 0;
        max-block-size: 35dvh;
        box-shadow: none;
    }

    .site-preference-dropdown .dropdown-menu {
        inline-size: calc(100% - 1rem);
        min-inline-size: 0;
        max-block-size: 35dvh;
    }

    .site-preference-dropdown .dropdown-item {
        min-block-size: 2.75rem;
    }
}

.site-home .site-header-search .site-search {
    border-color: var(--site-line);
    background: transparent;
}

/* Hero: saved V3 composition, using the shared search and brand tokens. */
.site-hero {
    padding-block: clamp(2rem, 4vw, 3rem);
}

.site-hero-content {
    display: grid;
    grid-template-columns: min(34rem, 50%) minmax(0, 1fr);
    align-items: center;
    gap: calc(clamp(2rem, 4vw, 4rem) + 6.25rem);
}

.site-hero-copy {
    min-inline-size: 0;
    overflow-wrap: anywhere;
}

.site-hero-label {
    padding: 0.3rem 0.8rem;
    border: 1px solid #e9d9ad;
    border-radius: var(--tblr-border-radius-pill);
    background: #faf0d4;
    color: #806424;
    font-size: 0.875rem;
}

.site-hero h1 {
    margin-block: 0.75rem 1.25rem;
    font-size: min(4rem, 10cqi);
    font-weight: 700;
    line-height: 1.3;
}

.site-hero h1 span {
    display: block;
    inline-size: fit-content;
    white-space: nowrap;
}

.site-hero h1 span:last-child {
    background: var(--site-highlight);
}

.site-hero-actions > p {
    margin-block-end: 1.25rem;
    color: var(--site-text);
    font-size: 1.125rem;
    line-height: 1.85;
}

.site-hero-popular {
    color: var(--site-text);
    font-size: 0.875rem;
}

.site-hero-popular .btn {
    min-block-size: 2.75rem;
    border-color: var(--site-line);
    background: var(--site-surface);
    color: var(--site-ink);
    font-size: inherit;
    white-space: normal;
}

.site-hero-guide {
    color: var(--site-ink);
    font-weight: 500;
}

.site-hero-copy,
.site-hero-cta {
    container-type: inline-size;
}

.site-hero-art {
    position: relative;
    min-inline-size: 0;
    inline-size: min(100%, 34rem);
    justify-self: center;
    aspect-ratio: 34 / 31;
    min-block-size: 22rem;
    isolation: isolate;
}

.site-art-arch,
.site-hero-figure {
    position: absolute;
}

.site-art-arch {
    inset: 0.5rem 12% 1rem;
    border-radius: 48% 48% 12% 12%;
    background: linear-gradient(145deg, #dce7cc, #eaf0dc);
    z-index: -1;
}

.site-hero-figure {
    inset: 1.5rem 18% 1rem;
}

.site-hero-figure img {
    filter: drop-shadow(0 6px 6px #34482513);
}

.site-hero-hello {
    position: absolute;
    inset-inline-start: 8%;
    inset-block-start: 0;
    padding: 0.4rem 0.75rem;
    border: 1px solid var(--site-line);
    border-radius: 0.65rem;
    background: var(--site-surface);
    box-shadow: 3px 4px 0 #d8e0c6;
    transform: rotate(4deg);
    font-size: 0.9375rem;
    font-weight: 600;
}

.site-art-star {
    position: absolute;
    inset-inline-end: 0;
    inset-block-start: 26%;
    font-size: 2rem;
}

.site-art-star,
.site-offers-eyebrow {
    color: #a17a26;
}

.site-hero-note {
    position: absolute;
    inline-size: 100%;
    max-inline-size: min(12rem, 44%);
    padding: 0.75rem;
    border: 1px solid var(--site-line);
    border-radius: 0.8rem;
    background: var(--site-surface);
    box-shadow: var(--site-shadow);
    line-height: 1.6;
}

.site-hero-note:first-child {
    inset-inline-end: 0;
    inset-block-start: 55%;
}

.site-hero-note:last-child {
    inset-inline-start: 0;
    inset-block-end: 16%;
}

.site-hero-note small {
    color: var(--site-text);
    font-size: 0.875rem;
}

.site-hero-note:lang(en) {
    max-inline-size: min(12rem, 50%);
    font-size: clamp(0.625rem, 2.8vw, 0.6875rem);
}

.site-hero-note:lang(en) small {
    font-size: inherit;
}

.site-hero-note-icon {
    display: grid;
    place-items: center;
    flex-shrink: 0;
    inline-size: 2rem;
    block-size: 2.3rem;
    border-radius: 0.6rem;
    background: var(--site-soft);
}

.site-hero-note:first-child .site-hero-note-icon {
    background: #fbefcc;
    color: #805d1b;
}

@media (max-width: 1199.98px) {
    .site-hero-cta > a {
        font-size: min(1rem, 3.4cqi);
    }

    .site-hero-note {
        padding: 0.5rem;
        font-size: 0.875rem;
    }

    .site-hero-note:first-child {
        inset-block-start: 50%;
    }

    .site-hero-note:last-child {
        inset-block-end: 24%;
    }

    .site-hero-note-icon {
        inline-size: 1.5rem;
        block-size: 1.875rem;
    }
}

@media (max-width: 959.98px) {
    .site-hero-content {
        grid-template-columns: minmax(0, 1fr);
        gap: 0.5rem;
    }

    .site-hero-copy {
        display: contents;
    }

    .site-hero-heading {
        container-type: inline-size;
        order: -2;
        margin-block-end: 1.5rem;
        text-align: center;
    }

    .site-hero h1 {
        margin-block-end: 0;
    }

    .site-hero h1 span {
        margin-inline: auto;
    }

    .site-hero-actions {
        min-inline-size: 0;
    }

    .site-hero-actions > p {
        display: none;
    }

    .site-hero-art {
        inline-size: min(100%, 30rem);
        order: -1;
    }
}

/* Preserve the navbar and hero's 75% desktop scale; fractional rem values are intentional. */
@media (min-width: 1200px) {
    .site-header-actions.d-flex,
    .site-navbar .site-header-search-panel {
        display: contents !important;
    }

    .site-navbar-menu,
    .site-navbar-menu .offcanvas-body {
        display: contents;
    }

    .site-navbar-links {
        position: relative;
        min-block-size: 2.34375rem;
        gap: 0.375rem;
        margin-block-start: 0.375rem;
        padding-block: 0.375rem;
    }

    .site-navbar-links::before,
    .site-navbar-links::after {
        content: '';
        position: absolute;
        inset-inline: 0;
        block-size: 1px;
        background: var(--site-line);
        /* Extend the lines without widening the page or clipping dropdowns. */
        box-shadow: 0 0 0 100vmax var(--site-line);
        clip-path: inset(0 -100vmax);
        pointer-events: none;
    }

    .site-navbar-links::before {
        inset-block-start: 0;
    }

    .site-navbar-links::after {
        inset-block-end: 0;
    }

    .site-hero-copy {
        padding-inline-start: var(--site-nav-link-padding);
    }

    .site-navbar-links .nav-link.active {
        background: var(--site-soft);
    }

    .site-navbar-links .nav-link.active::before {
        content: '';
        position: absolute;
        inset-inline: 2.25rem 0.75rem;
        inset-block-end: 0.1875rem;
        block-size: 3px;
        border-radius: 50%;
        background: var(--site-gold);
        transform: rotate(-2deg);
        pointer-events: none;
    }

    .site-navbar,
    .site-hero,
    .site-store-strip,
    .site-store,
    .site-stores,
    .site-offers,
    .site-categories {
        --site-gutter: clamp(0.75rem, 2.5vw, 1.5rem);
        --site-content-width: 75rem;
        --site-nav-link-padding: 0.75rem;
        --tblr-border-radius: 0.5625rem;
        font-size: 0.65625rem;
    }

    :is(.site-navbar, .site-hero) .btn {
        --tblr-btn-padding-x: 0.5625rem;
        --tblr-btn-padding-y: 0.28125rem;
        --tblr-btn-line-height: 0.9375rem;
        --tblr-btn-icon-size: 0.9375rem;
    }

    .site-hero .btn-sm {
        --tblr-btn-padding-x: 0.375rem;
        --tblr-btn-padding-y: 0.1875rem;
        --tblr-btn-icon-size: 0.75rem;
    }

    :is(.site-navbar, .site-hero) :is(.ti, .icon) {
        --tblr-icon-size: 0.9375rem;
    }

    .site-navbar .gap-1 {
        gap: 0.1875rem !important;
    }

    :is(.site-navbar, .site-hero) .gap-2 {
        gap: 0.375rem !important;
    }

    .site-hero .mt-3 {
        margin-block-start: 0.75rem !important;
    }

    .site-search.p-1 {
        padding: 0.1875rem !important;
    }

    .site-search .m-1 {
        margin: 0.1875rem !important;
    }

    .site-search .ms-3 {
        margin-inline-start: 0.75rem !important;
    }

    .site-search .input-icon-addon {
        min-inline-size: 1.875rem;
    }

    .site-header {
        grid-template-columns: minmax(20.25rem, 1fr) minmax(0, 26.25rem) minmax(20.25rem, 1fr);
        column-gap: clamp(1.125rem, 2.8vw, 1.875rem);
    }

    .site-navbar .logo {
        inline-size: 9rem;
        block-size: 4.5rem;
    }

    .site-navbar-settings {
        gap: 0.9375rem;
    }

    .site-navbar-settings .flag {
        inline-size: 1.3125rem;
        block-size: 0.984375rem;
    }

    .site-navbar .nav-link,
    .site-navbar .btn {
        gap: 0.375rem;
    }

    .site-navbar .nav-link,
    .site-navbar .btn,
    .site-search .form-control,
    .site-hero .btn,
    .site-hero .form-control {
        min-block-size: 2.15625rem;
        font-size: 0.75rem;
    }

    .site-navbar .nav-link {
        padding: 0.375rem;
    }

    .site-navbar-links .nav-link {
        position: relative;
        padding-inline: var(--site-nav-link-padding);
        border-radius: var(--tblr-border-radius-pill);
    }

    .site-navbar .dropdown-menu {
        --tblr-dropdown-min-width: 8.25rem;
        --tblr-dropdown-padding-y: 0.1875rem;
        --tblr-dropdown-font-size: 0.65625rem;
        --tblr-dropdown-item-padding-x: 0.5625rem;
        --tblr-dropdown-header-padding-x: 0.5625rem;
        --tblr-dropdown-header-padding-y: 0.1875rem;
        max-inline-size: calc(100vw - 1.5rem);
    }

    .site-navbar .dropdown-item {
        gap: 0.375rem;
        padding-block: 0.46875rem;
    }

    .site-navbar .btn-icon {
        inline-size: 2.15625rem;
    }

    .site-account-button.btn-primary {
        min-inline-size: 6.375rem;
    }

    .site-search {
        border-radius: 0.75rem;
    }

    .site-search .form-control {
        padding-block: 0.28125rem;
        line-height: 0.9375rem;
        padding-inline: 2.4375rem 0.5625rem;
    }

    .site-hero {
        padding-block: clamp(1.5rem, 4vw, 2.25rem);
    }

    .site-hero-content {
        grid-template-columns: min(25.5rem, 50%) minmax(0, 1fr);
        gap: calc(clamp(1.5rem, 4vw, 3rem) + 4.6875rem);
    }

    .site-hero-label {
        padding: 0.225rem 0.6rem;
        font-size: 0.65625rem;
    }

    .site-hero h1 {
        margin-block: 0.5625rem 0.9375rem;
        font-size: min(3rem, 10cqi);
    }

    .site-hero-actions > p {
        margin-block-end: 0.9375rem;
        font-size: 0.84375rem;
    }

    .site-hero-popular {
        font-size: 0.65625rem;
    }

    .site-hero-popular .btn {
        min-block-size: 2.0625rem;
    }

    .site-hero-art {
        inline-size: min(100%, 25.5rem);
        min-block-size: 16.5rem;
    }

    .site-art-arch {
        inset: 0.375rem 12% 0.75rem;
    }

    .site-hero-figure {
        inset: 1.125rem 18% 0.75rem;
    }

    .site-hero-hello {
        padding: 0.3rem 0.5625rem;
        border-radius: 0.4875rem;
        font-size: 0.703125rem;
    }

    .site-art-star {
        font-size: 1.5rem;
    }

    .site-hero-note {
        max-inline-size: min(9rem, 44%);
        padding: 0.5625rem;
        border-radius: 0.6rem;
    }

    .site-hero-note small {
        font-size: 0.65625rem;
    }

    .site-hero-note:lang(en) {
        max-inline-size: min(9rem, 50%);
        font-size: clamp(0.46875rem, 2.8vw, 0.515625rem);
    }

    .site-hero-note-icon {
        inline-size: 1.5rem;
        block-size: 1.725rem;
        border-radius: 0.45rem;
    }
}

.site-deals-card .brand-btn {
    min-height: 25px;
    max-height: 25px;
    padding-block: 0;
    padding-inline: 1.25rem;
    font-size: 0.875rem;
    font-weight: bold;
}

/* ============================================================
Footer
============================================================ */
.site-footer-subscribe .form-control {
    height: 100%;
    background-color: var(--White);
    border: 1px solid var(--Light-Gray);
    border-radius: 0;
}

.site-footer-subscribe .form-control:focus {
    background-color: var(--White);
    box-shadow: none;
}

[dir='rtl'] .site-footer-subscribe .form-control::placeholder {
    text-align: right;
}

.site-footer-subscribe .btn {
    border-radius: var(--tblr-border-radius-pill);
    border-start-start-radius: 0;
    border-end-start-radius: 0;
    margin-inline-start: 0;
    width: 3rem;
}

.site-footer-social-item {
    width: 2.25rem;
    height: 2.25rem;
    margin-inline-start: 0.75rem;
    transform-style: preserve-3d;
}

.site-footer-social-item,
.site-footer-social {
    transition: all 0.5s ease-in-out;
}

.site-footer-social-item:hover {
    background-color: var(--White);
    transform: perspective(180px) rotateX(60deg) translateY(2px);
    box-shadow: 0 6px 10px -3px var(--Green-Lightest);
}

.site-footer-social {
    width: inherit;
    height: inherit;
    color: var(--Black);
}

.site-footer-social-item:hover .site-footer-social {
    color: inherit;
    transform: translate3d(0, 0, 15px) perspective(180px) rotateX(-85deg) translateY(2px);
}

/* ============================================================
Store strip and shared marquee
============================================================ */
.site-store-strip {
    border-block: 1px solid var(--site-line);
    background: var(--site-soft);
    font-size: 0.875rem;
}

.site-store-strip-content {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: clamp(1rem, 2.5vw, 2rem);
    padding-block: 1.25rem;
}

.site-store-strip h2 {
    margin: 0;
    color: var(--site-text);
    font-size: 1rem;
    line-height: 1.6;
}

.site-store-strip strong {
    color: var(--site-ink);
    inline-size: fit-content;
    background: var(--site-highlight);
}

.site-store-logo {
    flex: 0 0 7.5rem;
}

.site-store-logo img {
    inline-size: 7.5rem;
    block-size: 2.5rem;
    object-fit: contain;
}

@media (max-width: 767.98px) {
    .site-store-strip-content {
        grid-template-columns: minmax(0, 1fr);
        container-type: inline-size;
        gap: 0.75rem;
        padding-block: 1rem;
    }

    .site-store-strip h2 {
        font-size: min(0.875rem, 4cqi);
        white-space: nowrap;
    }

    .site-store-strip-content > a {
        justify-self: end;
    }

    .site-store-logo {
        flex-basis: 5.5rem;
    }

    .site-store-logo img {
        inline-size: 5.5rem;
        block-size: 2rem;
    }
}

.site-marquee {
    --marquee-gap: 1.5rem;
    container-type: inline-size;
    contain: paint;
    min-inline-size: 0;
    overflow: hidden;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    padding-block: 0.75rem;
    mask-image: linear-gradient(to right, transparent, #000 6%, #000 94%, transparent);
}

.site-marquee-track {
    width: max-content;
    animation: site-marquee-scroll var(--marquee-duration, 40s) linear infinite;
    animation-play-state: var(--marquee-play-state, paused);
}

.site-marquee:is(:hover, :focus-within, :active) .site-marquee-track {
    animation-play-state: paused;
}

.site-marquee-reverse .site-marquee-track {
    animation-direction: reverse;
}

.site-marquee-group {
    flex: 0 0 auto;
    gap: var(--marquee-gap);
    min-width: 100cqw;
    padding-inline-end: var(--marquee-gap);
}

[dir='rtl'] .site-marquee-track {
    animation-name: site-marquee-scroll-rtl;
}

@keyframes site-marquee-scroll {
    to {
        transform: translateX(-50%);
    }
}

@keyframes site-marquee-scroll-rtl {
    to {
        transform: translateX(50%);
    }
}

.site-partners-logo,
.site-deals-logo {
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    background-color: var(--White);
    border: 1px solid var(--Light-Gray);
    border-radius: 50%;
}

.site-partners-logo {
    width: 6rem;
    height: 6rem;
    box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.06);
    transition: box-shadow 0.4s ease;
}

.site-partners-logo:hover {
    box-shadow: 0 0.375rem 0.875rem rgba(0, 0, 0, 0.08);
}

.site-partners-logo img,
.site-deals-logo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

@media (prefers-reduced-motion: reduce) {
    .site-navbar {
        transition: none;
    }

    .site-marquee {
        mask-image: none;
    }

    .site-marquee-track {
        animation: none;
    }

    .site-marquee-group[aria-hidden='true'] {
        display: none;
    }
}

/* Shared coupon and offer cards. */
.site-offers,
.site-categories,
.site-store,
.site-stores {
    font-size: 1rem;
}

.site-offers h2,
.site-categories h2 {
    font-size: clamp(1.5rem, 3vw, 2rem);
}

.site-offers-filters .btn:not(.btn-primary) {
    border-color: var(--site-line);
    color: var(--site-text);
}

.site-offers-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 31rem), 1fr));
    gap: 1rem;
}

.site-offer-card {
    --site-offer-stub: clamp(3.75rem, 20%, 8rem);
    --site-offer-notch: var(--site-offer-stub);
    display: grid;
    grid-template-columns: var(--site-offer-stub) minmax(0, 1fr);
    overflow: visible;
    border: 1px solid var(--site-line);
    border-radius: var(--site-radius);
    background: var(--site-surface);
    box-shadow: var(--site-shadow);
    /* Cut through the card itself so the notches reveal any background. */
    mask-image: radial-gradient(circle at var(--site-offer-notch) top, transparent 0.5rem, #000 calc(0.5rem + 1px)),
        radial-gradient(circle at var(--site-offer-notch) bottom, transparent 0.5rem, #000 calc(0.5rem + 1px));
    mask-composite: intersect;
}

[dir='rtl'] .site-offer-card {
    --site-offer-notch: calc(100% - var(--site-offer-stub));
}

.site-offer-discount {
    position: relative;
    padding: 1.25rem 0.5rem;
    border-inline-end: 2px dashed var(--site-line);
    background: var(--site-soft);
    border-start-start-radius: inherit;
    border-end-start-radius: inherit;
}

.site-offer-discount::before,
.site-offer-discount::after {
    content: '';
    position: absolute;
    inset-inline-end: -0.625rem;
    inline-size: 1.125rem;
    block-size: 1.125rem;
    border: 1px solid var(--site-line);
    border-radius: 50%;
    z-index: 1;
}

.site-offer-discount::before {
    inset-block-start: -0.625rem;
    clip-path: inset(50% 0 0);
}

.site-offer-discount::after {
    inset-block-end: -0.625rem;
    clip-path: inset(0 0 50%);
}

.site-offer-discount strong {
    border-block-end: 0.2rem solid var(--site-gold);
    font-size: clamp(1.5rem, 2.5vw, 2.25rem);
    line-height: 1;
}

.site-offer-card .card-body {
    min-inline-size: 0;
}

.site-offer-label {
    padding: 0.375rem 0.625rem;
    border-radius: 0.75rem;
    background: var(--site-soft);
    color: var(--site-text);
    font-size: 0.75rem;
}

.site-offer-icon {
    inline-size: 2rem;
    block-size: 2rem;
    font-size: 1.5rem;
}

.site-offer-store {
    min-inline-size: 0;
    overflow-wrap: anywhere;
}

.site-offer-favorite {
    color: var(--site-text);
}

.site-offer-favorite[aria-pressed='true'] {
    color: var(--site-gold);
    background: var(--site-soft);
}

.site-offer-summary {
    flex: 1;
    padding-block: 0 0.75rem;
}

.site-offer-summary h3 {
    -webkit-line-clamp: 2;
    font-size: 1.25rem;
    line-height: 1.5;
}

.site-offer-details {
    color: var(--site-text);
}

.site-offer-code {
    min-inline-size: 0;
    max-inline-size: 100%;
    overflow: hidden;
    border: 1px solid var(--site-line);
    border-radius: 0.75rem;
    background: var(--site-soft);
    font-size: 0.875rem;
}

@media (max-width: 575.98px) {
    .site-offer-card {
        --site-offer-stub: 4rem;
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: var(--site-offer-stub) minmax(0, 1fr);
        mask-image: radial-gradient(circle at left var(--site-offer-stub), transparent 0.5rem, #000 calc(0.5rem + 1px)),
            radial-gradient(circle at right var(--site-offer-stub), transparent 0.5rem, #000 calc(0.5rem + 1px));
    }

    .site-offer-discount {
        padding: 0.75rem;
        border-inline-end: 0;
        border-block-end: 2px dashed var(--site-line);
        border-start-end-radius: inherit;
        border-end-start-radius: 0;
    }

    .site-offer-discount::before,
    .site-offer-discount::after {
        inset-block-start: auto;
        inset-block-end: -0.625rem;
        clip-path: none;
    }

    .site-offer-discount::before {
        inset-inline-start: -0.625rem;
        inset-inline-end: auto;
    }

    .site-offer-discount::after {
        inset-inline-end: -0.625rem;
    }

    .site-offer-footer {
        display: contents;
    }

    .site-offer-footer :is(.site-offer-code, .site-offer-link) {
        flex: 1 1 100%;
        order: -1;
    }

    .site-offer-code bdi {
        flex: 1;
        justify-content: center;
    }
}

/* ============================================================
Cashback cards and shared listing headings
============================================================ */
.site-deals-card {
    border-radius: 1rem;
    box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.06);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.site-deals-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 0.75rem 2rem rgba(0, 0, 0, 0.1);
}

.site-deals-card .btn {
    margin-top: auto;
    align-self: center;
}

.site-deals-image {
    position: relative;
    height: 8.5rem;
    flex: 0 0 auto;
    background-color: var(--Light-Gray);
    background-size: cover;
    background-position: center;
    border-radius: var(--tblr-border-radius) var(--tblr-border-radius) 0 0;
    overflow: hidden;
}

.site-deals-badge {
    position: absolute;
    top: 0.875rem;
    inset-inline-start: -2.75rem;
    width: 9rem;
    padding: 0.3125rem 0;
    background-color: var(--Green-Dark);
    color: var(--White);
    font-size: 0.75rem;
    font-weight: 700;
    text-align: center;
    transform: rotate(-45deg);
    box-shadow: 0 0.125rem 0.375rem rgba(0, 0, 0, 0.2);
}

[dir='rtl'] .site-deals-badge {
    transform: rotate(45deg);
}

.site-deals-logo {
    position: relative;
    z-index: 2;
    flex: 0 0 auto;
    width: 3.75rem;
    height: 3.75rem;
    margin: -1.875rem auto 0;
    box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.08);
}

.site-offer-summary h3,
.site-deals-title,
.site-deals-content {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
}

.site-deals-title {
    height: 2.75rem;
    -webkit-line-clamp: 2;
}

.site-deals-content {
    flex: 1 1 auto;
    height: 3.75rem;
    font-size: 0.875rem;
    -webkit-line-clamp: 3;
}

.site-deals-heading h2 {
    font-size: 1.75rem;
    font-weight: 700;
}

.site-deals-view-all {
    color: var(--Black);
    font-weight: 600;
}

.site-deals-view-all:hover {
    color: var(--Green-Dark);
}

/* ============================================================
Coupon Code
============================================================ */
.site-coupon-code {
    padding: 0.75rem 1rem;
    background: var(--site-soft);
    border: 2px dashed var(--site-line);
    border-radius: var(--tblr-border-radius);
}

.site-coupon-reveal .modal-content {
    background: var(--site-surface);
}

/* Category discovery uses the same surface and colors as the offer cards. */
.site-category-card {
    border-color: var(--site-line);
    border-radius: var(--site-radius);
    background: var(--site-surface);
    color: var(--site-ink);
}

.site-category-card:hover,
.site-category-card:focus-visible {
    border-color: var(--tblr-primary-darken);
    background: var(--site-soft);
    color: var(--site-ink);
}

.site-category-icon {
    inline-size: 4rem;
    block-size: 4rem;
    background: var(--site-soft);
}

.site-category-icon .ti {
    --tblr-icon-size: 2rem;
}

/* Store empty states reuse the shared empty component and brand colors. */
.site-store .empty-icon {
    inline-size: fit-content;
    margin-inline: auto;
    padding: 1rem;
    border-radius: var(--site-radius);
    background: var(--site-soft);
    color: var(--site-ink);
}

.site-store .empty-icon .ti {
    --tblr-icon-size: 3rem;
}

/* Store directory: compact horizontal cards and category navigation. */
.site-stores-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 20rem), 1fr));
    gap: 1rem;
}

.site-directory-logo {
    inline-size: 6rem;
    block-size: 4.5rem;
}

.site-store-card:hover,
.site-store-card:focus-visible {
    border-color: var(--site-ink);
    background: var(--site-soft);
}

.site-store-filter {
    border-block: 2px solid transparent;
    border-radius: var(--site-radius);
    color: var(--site-text);
}

.site-store-filter.active {
    border-color: var(--site-ink);
    background: var(--site-soft);
    color: var(--site-ink);
    font-weight: 600;
}

@media (min-width: 992px) {
    .site-stores-sidebar {
        position: sticky;
        inset-block-start: calc(var(--site-navbar-height, 0px) + 1rem);
    }
}