:root {
    --green-950: #176b2b;
    --green-900: #218a3b;
    --green-800: #2d9b48;
    --green-700: #43ad5b;
    --green-100: #f3f9f4;
    --mint-100: #f9fcfa;
    --cream: #fbfaf6;
    --ink-950: #121714;
    --ink-900: #1c241f;
    --ink-700: #526059;
    --ink-500: #7b887f;
    --line: rgba(18, 23, 20, 0.08);
    --line-strong: rgba(18, 23, 20, 0.14);
    --white: #ffffff;
    --shadow-sm: 0 16px 36px rgba(17, 36, 23, 0.08);
    --shadow-md: 0 22px 48px rgba(17, 36, 23, 0.12);
    --shadow-lg: 0 28px 72px rgba(17, 36, 23, 0.16);
    --radius-sm: 16px;
    --radius-md: 24px;
    --radius-lg: 32px;
    --radius-pill: 999px;
    --font-body: "Manrope", sans-serif;
    --font-display: "Plus Jakarta Sans", sans-serif;
    --transition: 0.24s ease;
}

/* Managed CPanel advertisements */
.storefront-ad-popup {
    position: fixed;
    inset: 0;
    z-index: 1200;
    display: grid;
    place-items: center;
    padding: 1rem;
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.22s ease, visibility 0.22s ease;
}

.storefront-ad-popup.is-visible {
    visibility: visible;
    opacity: 1;
}

.storefront-ad-popup__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(10, 28, 17, 0.58);
}

.storefront-ad-popup__dialog {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 0.9fr);
    width: min(760px, 100%);
    max-height: min(680px, calc(100vh - 2rem));
    overflow: auto;
    background: var(--white);
    border: 1px solid rgba(255, 255, 255, 0.68);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-lg);
}

.storefront-ad-popup__media,
.storefront-ad-popup__media .storefront-ad__media {
    width: 100%;
    min-height: 260px;
    height: 100%;
    object-fit: cover;
}

.storefront-ad-popup__media {
    background: var(--green-100);
}

.storefront-ad-popup .storefront-ad__content {
    align-self: center;
    padding: clamp(1.5rem, 4vw, 3rem);
}

.storefront-ad-popup__close {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    z-index: 2;
    display: grid;
    place-items: center;
    width: 2.25rem;
    height: 2.25rem;
    border: 0;
    border-radius: 50%;
    color: var(--ink-900);
    background: rgba(255, 255, 255, 0.88);
    box-shadow: 0 6px 16px rgba(17, 36, 23, 0.12);
}

.storefront-ad-popup__close .icon {
    width: 1rem;
    height: 1rem;
    transform: rotate(45deg);
}

.storefront-ad__content h2 {
    margin: 0 0 0.65rem;
    color: var(--green-950);
    font-family: var(--font-display);
    font-size: clamp(1.25rem, 2.4vw, 2rem);
    line-height: 1.15;
}

.storefront-ad__content p {
    margin: 0;
    color: var(--ink-700);
    line-height: 1.65;
}

.storefront-ad__cta {
    margin-top: 1.25rem;
}

.storefront-ad-side {
    position: fixed;
    top: var(--storefront-ad-top, 8rem);
    right: 1rem;
    z-index: 1115;
    width: min(218px, calc(100vw - 2rem));
    max-height: min(390px, calc(100vh - var(--storefront-ad-top, 8rem) - 1rem));
    overflow: hidden;
    isolation: isolate;
    background: var(--white);
    border: 1px solid var(--line-strong);
    border-radius: 14px;
    box-shadow: 0 16px 40px rgba(17, 36, 23, 0.16);
    animation: storefront-ad-side-in 0.24s ease both;
}

.storefront-ad-side.is-dismissed {
    display: none;
}

.storefront-ad-side__close {
    position: absolute;
    top: 0.6rem;
    right: 0.6rem;
    z-index: 2;
    display: grid;
    place-items: center;
    width: 2rem;
    height: 2rem;
    padding: 0;
    appearance: none;
    border: 2px solid var(--white);
    border-radius: 50%;
    color: var(--white);
    background: var(--green-950);
    box-shadow: 0 3px 12px rgba(17, 36, 23, 0.28);
    font-family: Arial, sans-serif;
    font-size: 1.4rem;
    line-height: 1;
    cursor: pointer;
}

.storefront-ad-side__close:hover {
    color: var(--white);
    background: var(--green-800);
}

.storefront-ad-side__media,
.storefront-ad-side__media .storefront-ad__media {
    display: block;
    width: 100%;
    max-height: 180px;
    object-fit: cover;
}

.storefront-ad-side .storefront-ad__content {
    padding: 0.95rem 1rem 1.1rem;
}

.storefront-ad-side .storefront-ad__content h2 {
    padding-right: 1.25rem;
    font-size: 1.02rem;
}

.storefront-ad-side .storefront-ad__content p {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 6;
    font-size: 0.84rem;
    line-height: 1.5;
}

.storefront-ad-side .storefront-ad__cta {
    margin-top: 0.85rem;
    padding: 0.48rem 0.72rem;
    font-size: 0.78rem;
}

.storefront-ad-banner {
    position: relative;
    z-index: 1;
    padding: 0.65rem 0;
}

.storefront-ad-banner.is-dismissed {
    display: none;
}

.storefront-ad-banner__close {
    position: absolute;
    top: 0.85rem;
    right: max(1rem, calc((100vw - 1320px) / 2));
    z-index: 2;
    display: grid;
    place-items: center;
    width: 1.85rem;
    height: 1.85rem;
    padding: 0;
    border: 1px solid rgba(17, 36, 23, 0.12);
    border-radius: 50%;
    color: var(--ink-700);
    background: rgba(255, 255, 255, 0.92);
    font-size: 1.15rem;
    line-height: 1;
    cursor: pointer;
}

.storefront-ad-banner__close:hover {
    color: var(--green-950);
    background: var(--green-100);
}

.storefront-ad-banner__inner {
    display: grid;
    grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
    align-items: center;
    min-height: 116px;
    overflow: hidden;
    background: var(--green-100);
    border: 1px solid rgba(22, 116, 58, 0.16);
    border-radius: var(--radius-sm);
}

.storefront-ad-banner__media,
.storefront-ad-banner__media .storefront-ad__media {
    width: 100%;
    height: 100%;
    min-height: 116px;
    object-fit: cover;
}

.storefront-ad-banner .storefront-ad__content {
    padding: 1rem clamp(1.15rem, 3vw, 2rem);
}

.storefront-ad-banner .storefront-ad__content h2 {
    font-size: clamp(1.05rem, 1.8vw, 1.45rem);
}

.storefront-ad-banner .storefront-ad__content p {
    font-size: 0.9rem;
    line-height: 1.5;
}

@keyframes storefront-ad-side-in {
    from { opacity: 0; transform: translateX(0.75rem); }
    to { opacity: 1; transform: translateX(0); }
}

@media (max-width: 1199.98px) {
    .storefront-ad-side {
        display: none;
    }
}

@media (max-width: 767.98px) {
    .storefront-ad-banner__close {
        top: 0.8rem;
        right: 0.85rem;
    }

    .storefront-ad-popup__dialog,
    .storefront-ad-banner__inner {
        display: block;
    }

    .storefront-ad-popup__media,
    .storefront-ad-popup__media .storefront-ad__media {
        min-height: 180px;
        max-height: 230px;
    }

    .storefront-ad-banner__media,
    .storefront-ad-banner__media .storefront-ad__media {
        min-height: 96px;
        max-height: 150px;
    }
}

body.ad-popup-open {
    overflow: hidden;
}

.storefront-cookie-banner {
    position: fixed;
    right: 1rem;
    bottom: 1rem;
    left: 1rem;
    z-index: 1100;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem;
    max-width: 1080px;
    margin: 0 auto;
    padding: 1rem 1.15rem;
    color: var(--ink-900);
    background: var(--white);
    border: 1px solid var(--line-strong);
    border-radius: 12px;
    box-shadow: 0 16px 42px rgba(17, 36, 23, 0.2);
}

.storefront-cookie-banner[hidden] {
    display: none;
}

.storefront-cookie-banner__copy {
    min-width: 0;
}

.storefront-cookie-banner__copy strong {
    display: block;
    margin-bottom: 0.25rem;
    color: var(--green-950);
    font-family: var(--font-display);
    font-size: 1.05rem;
}

.storefront-cookie-banner__copy p {
    max-width: 700px;
    margin: 0;
    color: var(--ink-700);
    font-size: 0.88rem;
    line-height: 1.5;
}

.storefront-cookie-banner__copy a {
    color: var(--green-800);
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.storefront-cookie-banner__actions {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: flex-end;
    gap: 0.6rem;
}

.storefront-cookie-banner__actions .btn {
    white-space: nowrap;
}

@media (max-width: 767.98px) {
    .storefront-cookie-banner {
        right: 0.75rem;
        bottom: 0.75rem;
        left: 0.75rem;
        display: block;
        padding: 0.95rem;
    }

    .storefront-cookie-banner__actions {
        display: grid;
        grid-template-columns: 1fr;
        margin-top: 0.8rem;
    }

    .storefront-cookie-banner__actions .btn {
        width: 100%;
    }
}

.checkout-loyalty-box {
    margin: 1rem 0 1.25rem;
    padding: 1rem;
    background: var(--mint-100);
    border: 1px solid rgba(22, 116, 58, 0.16);
    border-radius: var(--radius-sm);
}

.checkout-loyalty-box__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.checkout-loyalty-box__header strong,
.checkout-loyalty-box__header span {
    display: block;
}

.checkout-loyalty-box__header span {
    margin-top: 0.2rem;
    color: var(--ink-700);
    font-size: 0.85rem;
}

.checkout-loyalty-box__controls {
    max-width: 260px;
    margin-top: 0.9rem;
}

.checkout-loyalty-box__controls .form-label {
    margin-bottom: 0.35rem;
}

.account-panel__notice {
    padding: 1rem 1.1rem;
    background: var(--mint-100);
    border-left: 3px solid var(--green-700);
}

.account-panel__notice p {
    margin-top: 0.35rem;
    color: var(--ink-700);
}

.account-loyalty-history h4 {
    margin-bottom: 0.75rem;
}

html {
    scroll-behavior: smooth;
    overflow-x: clip;
}

body {
    margin: 0;
    font-family: var(--font-body);
    color: var(--ink-900);
    background:
        radial-gradient(circle at top left, rgba(45, 140, 80, 0.08), transparent 28%),
        linear-gradient(180deg, #fcfcfa 0%, #f7f8f3 100%);
    overflow-x: hidden;
}

.page-home .container {
    max-width: min(1880px, calc(100vw - 1rem));
}

.page-home .hero-layout {
    --bs-gutter-x: 1rem;
}

.page-home .section-shell,
.page-home .hero-assurance,
.page-home .service-strip {
    position: relative;
}

/* Widen only ultra-wide storefront layouts so laptop spacing stays unchanged. */
@media (min-width: 1800px) {
    .page-home .container {
        max-width: min(2140px, calc(100% - 5rem));
        margin-left: auto;
        margin-right: auto;
    }

    .page-shop .container,
    .page-product .container,
    .page-cart .container,
    .page-checkout .container,
    .page-account .container,
    .page-contact .container,
    .page-policy .container {
        max-width: min(1960px, calc(100% - 5rem));
        margin-left: auto;
        margin-right: auto;
    }
}

@media (max-width: 991.98px) {
    .page-home .container {
        max-width: calc(100vw - 0.8rem);
    }

    .page-home .hero-layout {
        --bs-gutter-x: 0.8rem;
    }
}

@media (max-width: 575.98px) {
    .page-home .container {
        max-width: calc(100vw - 0.45rem);
    }
}

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

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

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

:focus-visible {
    outline: 3px solid rgba(22, 116, 58, 0.24);
    outline-offset: 3px;
}

.skip-link {
    position: absolute;
    left: -9999px;
    top: auto;
    z-index: 1200;
    padding: 0.875rem 1rem;
    border-radius: var(--radius-pill);
    background: var(--green-900);
    color: var(--white);
}

.skip-link:focus {
    left: 1rem;
    top: 1rem;
}

.icon {
    width: 1rem;
    height: 1rem;
    flex: 0 0 auto;
    fill: currentColor;
}

.eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.55rem 0.9rem;
    border-radius: var(--radius-pill);
    background: rgba(45, 140, 80, 0.1);
    color: var(--green-800);
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.eyebrow-light {
    background: rgba(255, 255, 255, 0.16);
    color: rgba(255, 255, 255, 0.95);
}

.badge-soft {
    display: inline-flex;
    align-items: center;
    padding: 0.45rem 0.8rem;
    border: 1px solid rgba(17, 89, 43, 0.12);
    border-radius: var(--radius-pill);
    background: rgba(255, 255, 255, 0.76);
    color: var(--green-900);
    font-size: 0.73rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.badge-soft--light {
    border-color: rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.18);
    color: var(--white);
}

.section-shell {
    padding: 5rem 0;
}

.section-soft {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.72), rgba(239, 246, 239, 0.88));
}

.section-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    margin-bottom: 2rem;
}

.section-title {
    max-width: 13ch;
    margin: 1rem 0 0;
    font-family: var(--font-display);
    font-size: clamp(2rem, 4vw, 3.1rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -0.04em;
}

.section-title--wide {
    max-width: 15ch;
}

.section-link {
    color: var(--green-800);
    font-weight: 800;
    white-space: nowrap;
}

.section-link:hover {
    color: var(--green-900);
}

.btn {
    border-radius: var(--radius-pill);
    font-weight: 700;
    transition: transform var(--transition), box-shadow var(--transition), background-color var(--transition), color var(--transition), border-color var(--transition);
}

.btn:hover {
    transform: translateY(-1px);
}

.btn-brand {
    border: 0;
    color: var(--white);
    background: linear-gradient(135deg, var(--green-900), var(--green-700));
    box-shadow: 0 16px 32px rgba(17, 89, 43, 0.2);
}

.btn-brand:hover,
.btn-brand:focus-visible {
    color: var(--white);
}

.btn-outline-brand {
    border: 1px solid rgba(17, 89, 43, 0.14);
    color: var(--ink-900);
    background: rgba(255, 255, 255, 0.88);
}

.btn-outline-brand:hover,
.btn-outline-brand:focus-visible {
    border-color: rgba(17, 89, 43, 0.3);
    color: var(--ink-900);
}

.btn-light-solid {
    border: 0;
    color: var(--green-900);
    background: var(--white);
}

.btn-light-outline {
    border: 1px solid rgba(255, 255, 255, 0.22);
    color: var(--white);
    background: rgba(255, 255, 255, 0.08);
}

.btn-link-clean {
    border: 0;
    padding: 0;
    color: var(--ink-700);
    background: transparent;
    font-weight: 700;
}

.btn-search-submit {
    min-width: 6rem;
}

.contact-panel {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    padding: clamp(1.75rem, 3vw, 2.5rem);
    border-radius: var(--radius-lg);
    color: var(--white);
    background:
        radial-gradient(circle at top right, rgba(255, 255, 255, 0.18), transparent 28%),
        linear-gradient(160deg, var(--green-950), #0e5d2a 58%, #2d8c50 100%);
    box-shadow: var(--shadow-lg);
    overflow: hidden;
}

.contact-panel::after {
    content: "";
    position: absolute;
    inset: auto -12% -24% auto;
    width: 18rem;
    height: 18rem;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.2), transparent 68%);
    pointer-events: none;
}

.contact-panel h2 {
    margin: 0;
    font-family: var(--font-display);
    font-size: clamp(2rem, 3vw, 2.55rem);
    line-height: 1.02;
    letter-spacing: -0.04em;
}

.contact-panel p {
    max-width: 34rem;
    margin: 0;
    color: rgba(255, 255, 255, 0.82);
}

.contact-detail-grid {
    display: grid;
    gap: 1rem;
}

.contact-detail-card {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 1rem;
    align-items: start;
    padding: 1rem 1.05rem;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: var(--radius-sm);
    background: rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(10px);
}

.contact-detail-card__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.9rem;
    height: 2.9rem;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.14);
    color: var(--white);
}

.contact-detail-card__icon .icon {
    width: 1.1rem;
    height: 1.1rem;
}

.contact-detail-card span {
    display: block;
    margin-bottom: 0.25rem;
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.contact-detail-card a,
.contact-detail-card strong,
.contact-detail-card address {
    margin: 0;
    color: var(--white);
    font-size: 1rem;
    font-style: normal;
    font-weight: 700;
    line-height: 1.55;
}

.contact-panel__notes {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.contact-form-card {
    display: flex;
    flex-direction: column;
    gap: 1.75rem;
    padding: clamp(1.5rem, 2.5vw, 2.25rem);
}

.contact-form-card__header {
    display: flex;
    flex-wrap: wrap;
    align-items: start;
    justify-content: space-between;
    gap: 1rem;
}

.contact-form-card__header h2 {
    margin: 0.9rem 0 0.55rem;
}

.contact-form-card__header p {
    max-width: 42rem;
    margin: 0;
    color: var(--ink-700);
}

.contact-inline-link {
    color: var(--green-800);
    font-size: 0.94rem;
    font-weight: 800;
}

.contact-form .form-control,
.contact-form .form-select {
    min-height: 3.5rem;
}

.contact-form textarea.form-control {
    min-height: 9rem;
    resize: vertical;
}

.contact-form__footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding-top: 1rem;
}

.contact-form__footer p {
    max-width: 32rem;
    color: var(--ink-700);
    font-size: 0.95rem;
}

.captcha-shell {
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
    padding: 1rem 1.1rem;
    border: 1px solid var(--line-strong);
    border-radius: var(--radius-sm);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(245, 251, 247, 0.96));
}

.captcha-shell__header {
    display: flex;
    flex-wrap: wrap;
    align-items: start;
    justify-content: space-between;
    gap: 0.9rem;
}

.captcha-shell__header strong {
    display: block;
    margin-bottom: 0.2rem;
    font-size: 1rem;
}

.captcha-shell__header p {
    margin: 0;
    color: var(--ink-700);
    font-size: 0.92rem;
}

.captcha-shell__question {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 3.25rem;
    padding: 0.85rem 1rem;
    border: 1px dashed rgba(17, 89, 43, 0.24);
    border-radius: 1.1rem;
    background: rgba(17, 89, 43, 0.05);
    color: var(--green-900);
    font-family: var(--font-display);
    font-size: 1.1rem;
    font-weight: 800;
    letter-spacing: -0.02em;
}

.captcha-honeypot {
    position: absolute !important;
    left: -9999px !important;
    width: 1px;
    height: 1px;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
}

.site-header {
    position: sticky;
    top: 0;
    z-index: 1100;
    backdrop-filter: blur(16px);
}

.topbar {
    background: rgba(11, 51, 28, 0.96);
    color: rgba(255, 255, 255, 0.88);
    font-size: 0.92rem;
}

.topbar__inner,
.topbar__links {
    display: flex;
    align-items: center;
    gap: 1rem;
    justify-content: space-between;
}

.topbar__inner {
    padding: 0.65rem 0;
}

.topbar__inner p,
.topbar__links a {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    margin: 0;
}

.topbar__links {
    flex-wrap: wrap;
    justify-content: flex-end;
}

.header-main {
    border-bottom: 1px solid rgba(255, 255, 255, 0.72);
    background: rgba(250, 251, 247, 0.88);
}

.navbar {
    gap: 1rem;
    padding: 1rem 0;
}

.navbar-brand {
    display: inline-flex;
    align-items: center;
    gap: 1.05rem;
    margin-right: 0;
}

.brand-mark-shell {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 6.6rem;
    height: 5.8rem;
    flex: 0 0 auto;
    background: transparent;
    box-shadow: none;
}

.brand-mark-shell::before {
    content: "";
    position: absolute;
    left: 0.8rem;
    right: 0.8rem;
    bottom: 0.25rem;
    height: 1.2rem;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(17, 89, 43, 0.24) 0%, rgba(17, 89, 43, 0.12) 34%, rgba(17, 89, 43, 0) 74%);
    filter: blur(10px);
    opacity: 0.72;
    transform: translateY(0.28rem);
    pointer-events: none;
}

.brand-mark {
    position: relative;
    z-index: 1;
    width: 6.2rem;
    height: auto;
    transform: translateY(-0.06rem) scale(1.08);
    transform-origin: center;
    filter:
        drop-shadow(0 1px 0 rgba(255, 255, 255, 0.96))
        drop-shadow(0 10px 14px rgba(17, 89, 43, 0.16))
        drop-shadow(0 18px 22px rgba(17, 89, 43, 0.08));
}

.brand-copy {
    display: inline-flex;
    flex-direction: column;
}

.brand-copy strong {
    font-family: var(--font-display);
    font-size: 1.28rem;
    font-weight: 800;
    letter-spacing: -0.04em;
}

.brand-copy small {
    color: var(--ink-700);
    font-size: 0.82rem;
}

.header-search {
    flex: 1 1 auto;
    align-items: center;
    gap: 0.8rem;
    min-height: 4rem;
    padding: 0.6rem 0.8rem;
    border: 1px solid rgba(17, 36, 23, 0.08);
    border-radius: var(--radius-pill);
    background: rgba(255, 255, 255, 0.92);
    box-shadow: var(--shadow-sm);
}

.header-search .icon {
    color: var(--ink-500);
}

.header-search .form-control,
.header-search .form-select {
    border: 0;
    box-shadow: none;
    background: transparent;
}

.header-search .form-select {
    max-width: 11rem;
    color: var(--ink-700);
}

.header-actions,
.header-actions--mobile {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.header-action {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    min-height: 3.25rem;
    padding: 0.75rem 1rem;
    border: 1px solid rgba(17, 36, 23, 0.08);
    border-radius: var(--radius-pill);
    background: rgba(255, 255, 255, 0.86);
    font-weight: 700;
}

.header-action:hover {
    border-color: rgba(17, 89, 43, 0.2);
}

.header-action--cart strong {
    display: inline-grid;
    place-items: center;
    min-width: 1.7rem;
    height: 1.7rem;
    padding: 0 0.35rem;
    border-radius: var(--radius-pill);
    background: var(--green-900);
    color: var(--white);
    font-size: 0.78rem;
}

.primary-nav {
    align-items: center;
    gap: 0.25rem;
}

.primary-nav .nav-link {
    padding: 0.8rem 1rem;
    border-radius: var(--radius-pill);
    color: var(--ink-900);
    font-weight: 700;
}

.primary-nav .nav-link.active,
.primary-nav .nav-link:hover,
.primary-nav .nav-link:focus-visible {
    color: var(--green-900);
    background: rgba(17, 89, 43, 0.08);
}

.mega-menu {
    margin-top: 1rem;
    padding: 1.6rem;
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.98);
}

.mega-menu__grid {
    display: grid;
    grid-template-columns: 1.35fr 1fr 1fr 1.05fr;
    gap: 1.5rem;
}

.mega-menu__intro,
.mega-menu__promo,
.mega-menu__column {
    padding: 1.25rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    background: linear-gradient(180deg, rgba(252, 253, 249, 0.98), rgba(244, 248, 242, 0.9));
}

.mega-menu__intro h3,
.mega-menu__promo h4,
.mega-menu__column h4 {
    margin: 0.9rem 0 0.75rem;
    font-family: var(--font-display);
    font-size: 1.2rem;
    font-weight: 800;
}

.mega-menu__intro p,
.mega-menu__promo p {
    color: var(--ink-700);
}

.mega-menu__links {
    margin: 0;
    padding: 0;
    list-style: none;
}

.mega-menu__links li + li {
    margin-top: 0.8rem;
}

.mega-menu__links a,
.mega-menu__promo a {
    color: var(--ink-900);
    font-weight: 700;
}

.mega-menu__links a:hover,
.mega-menu__promo a:hover {
    color: var(--green-800);
}

.mobile-search {
    margin-bottom: 1rem;
}

.mobile-search .input-group {
    padding: 0.35rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-pill);
    background: var(--white);
}

.hero-section {
    padding: 2rem 0 0;
}

.hero-shell {
    position: relative;
    overflow: hidden;
    padding: clamp(2rem, 5vw, 3.5rem);
    border: 1px solid rgba(255, 255, 255, 0.7);
    border-radius: var(--radius-lg);
    background:
        radial-gradient(circle at top right, rgba(45, 140, 80, 0.18), transparent 28%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.95), rgba(242, 247, 239, 0.88));
    box-shadow: var(--shadow-md);
}

.hero-copy h1 {
    margin: 1rem 0 1rem;
    font-family: var(--font-display);
    font-size: clamp(2.4rem, 5.2vw, 4.5rem);
    font-weight: 800;
    line-height: 0.96;
    letter-spacing: -0.05em;
}

.hero-lead {
    max-width: 56ch;
    margin: 0;
    color: var(--ink-700);
    font-size: 1.08rem;
    line-height: 1.75;
}

.hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.9rem;
    margin-top: 1.75rem;
}

.hero-proof {
    margin-top: 2rem;
}

.proof-card {
    height: 100%;
    padding: 1.25rem 1.35rem;
    border: 1px solid rgba(17, 36, 23, 0.08);
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.7);
}

.proof-card strong {
    display: block;
    font-family: var(--font-display);
    font-size: 1.5rem;
    font-weight: 800;
}

.proof-card span {
    color: var(--ink-700);
}

.hero-stage {
    position: relative;
    min-height: 34rem;
    padding: 2rem;
    border-radius: calc(var(--radius-lg) - 0.3rem);
    background:
        radial-gradient(circle at 18% 22%, rgba(255, 255, 255, 0.9), transparent 26%),
        linear-gradient(160deg, rgba(23, 78, 40, 0.06), rgba(255, 255, 255, 0.9));
    border: 1px solid rgba(17, 36, 23, 0.08);
}

.hero-stage__badge,
.hero-stage__stat {
    position: absolute;
    z-index: 2;
    max-width: 14rem;
    padding: 1rem 1.1rem;
    border: 1px solid rgba(255, 255, 255, 0.6);
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.84);
    box-shadow: var(--shadow-sm);
}

.hero-stage__badge {
    top: 1.5rem;
    left: 1.5rem;
}

.hero-stage__badge strong,
.hero-stage__stat strong {
    display: block;
    margin-top: 0.45rem;
    font-weight: 800;
}

.hero-stage__badge span:last-child,
.hero-stage__stat span {
    color: var(--ink-700);
    font-size: 0.92rem;
}

.hero-stage__visual {
    position: relative;
    min-height: 28rem;
}

.hero-bottle {
    position: absolute;
    bottom: 0;
    display: grid;
    place-items: end center;
    width: 15rem;
    height: 21rem;
    padding-bottom: 2.15rem;
    border-radius: 4.5rem 4.5rem 2.6rem 2.6rem;
    box-shadow: var(--shadow-lg);
    font-family: var(--font-display);
    font-size: 2rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.hero-bottle::before,
.product-bottle::before {
    content: "";
    position: absolute;
    top: -1.6rem;
    left: 50%;
    width: 58%;
    height: 2.3rem;
    border-radius: 1rem 1rem 0.5rem 0.5rem;
    transform: translateX(-50%);
}

.hero-bottle span,
.product-bottle span {
    position: relative;
    z-index: 1;
}

.hero-bottle--primary {
    right: 3rem;
    z-index: 2;
    color: #223126;
    background: linear-gradient(180deg, #fdfcf7, #f5ead4);
}

.hero-bottle--primary::before {
    background: linear-gradient(180deg, #f3f1ea, #dbd4c6);
}

.hero-bottle--secondary {
    left: 2rem;
    width: 12rem;
    height: 18rem;
    color: #f5faf6;
    background: linear-gradient(180deg, #1d7041, #0f4e2a);
}

.hero-bottle--secondary::before {
    background: linear-gradient(180deg, #155b34, #0d4624);
}

.hero-glow {
    position: absolute;
    border-radius: 50%;
    filter: blur(12px);
}

.hero-glow--one {
    top: 5rem;
    right: 0;
    width: 13rem;
    height: 13rem;
    background: rgba(86, 183, 115, 0.24);
}

.hero-glow--two {
    bottom: 1rem;
    left: 0;
    width: 10rem;
    height: 10rem;
    background: rgba(255, 205, 124, 0.26);
}

.hero-stage__stat--left {
    bottom: 2rem;
    left: 1.5rem;
}

.hero-stage__stat--right {
    right: 1.5rem;
    bottom: 3rem;
}

.trust-strip {
    padding-top: 1.25rem;
}

.trust-item {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.35rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.9);
    box-shadow: var(--shadow-sm);
}

.trust-item__icon,
.category-card__icon {
    display: inline-grid;
    place-items: center;
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    color: var(--green-900);
    background: rgba(17, 89, 43, 0.08);
}

.trust-item strong {
    display: block;
    margin-bottom: 0.25rem;
}

.trust-item p {
    margin: 0;
    color: var(--ink-700);
}

.category-card {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1.6rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.9);
    box-shadow: var(--shadow-sm);
    transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition);
}

.category-card:hover {
    transform: translateY(-3px);
    border-color: rgba(17, 89, 43, 0.18);
    box-shadow: var(--shadow-md);
}

.category-card h3 {
    margin: 0;
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 800;
}

.category-card p {
    margin: 0;
    color: var(--ink-700);
    line-height: 1.75;
}

.category-card__link {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    margin-top: auto;
    color: var(--green-800);
    font-weight: 800;
}

.filter-group {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.filter-chip {
    border: 1px solid var(--line-strong);
    border-radius: var(--radius-pill);
    padding: 0.75rem 1rem;
    background: rgba(255, 255, 255, 0.88);
    color: var(--ink-900);
    font-weight: 700;
}

.filter-chip.is-active,
.filter-chip:hover,
.filter-chip:focus-visible {
    border-color: transparent;
    color: var(--white);
    background: linear-gradient(135deg, var(--green-900), var(--green-700));
}

.product-card {
    overflow: hidden;
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm);
    background: rgba(255, 255, 255, 0.94);
}

.product-card__media {
    position: relative;
    min-height: 15rem;
    padding: 1.2rem;
    overflow: hidden;
}

.product-card__media::after {
    content: "";
    position: absolute;
    inset: auto -2rem -3rem auto;
    width: 9rem;
    height: 9rem;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.3);
    filter: blur(8px);
}

.product-card__topline {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
}

.wishlist-button {
    display: inline-grid;
    place-items: center;
    width: 2.6rem;
    height: 2.6rem;
    border: 1px solid rgba(255, 255, 255, 0.68);
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.75);
    color: var(--ink-900);
}

.product-card__media--green { background: linear-gradient(180deg, #d7f0dc, #eff9f1); }
.product-card__media--sage { background: linear-gradient(180deg, #ecf0d8, #f9faef); }
.product-card__media--navy { background: linear-gradient(180deg, #d7e5ef, #eef6fb); }
.product-card__media--plum { background: linear-gradient(180deg, #ebe0f5, #faf5ff); }
.product-card__media--sand { background: linear-gradient(180deg, #f0e6d8, #fbf8f1); }
.product-card__media--amber { background: linear-gradient(180deg, #f9e8bf, #fff6df); }
.product-card__media--rose { background: linear-gradient(180deg, #f6dbe6, #fff6f9); }
.product-card__media--slate { background: linear-gradient(180deg, #dfe5ea, #f7f9fb); }

.product-card__packshot {
    position: absolute;
    right: 1.1rem;
    bottom: 0.8rem;
    z-index: 1;
}

.product-card__packshot.brand-packshot--bottle {
    width: 7rem;
}

.product-card__packshot.brand-packshot--pouch {
    width: 7.45rem;
}

.product-bottle {
    position: absolute;
    right: 1.3rem;
    bottom: 1rem;
    display: grid;
    place-items: end center;
    width: 8.2rem;
    height: 11.8rem;
    padding-bottom: 1.1rem;
    border-radius: 2.6rem 2.6rem 1.5rem 1.5rem;
    box-shadow: 0 20px 36px rgba(17, 36, 23, 0.16);
    font-family: var(--font-display);
    font-size: 1.16rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.product-bottle--green {
    color: #effaf2;
    background: linear-gradient(180deg, #267846, #12492b);
}

.product-bottle--green::before {
    background: linear-gradient(180deg, #1c5f37, #114628);
}

.product-bottle--sage {
    color: #1b251d;
    background: linear-gradient(180deg, #f8f7ef, #dddccf);
}

.product-bottle--sage::before {
    background: linear-gradient(180deg, #efede2, #d5d3c7);
}

.product-bottle--navy {
    color: #1d2d39;
    background: linear-gradient(180deg, #fffdfa, #efe5d8);
}

.product-bottle--navy::before {
    background: linear-gradient(180deg, #173948, #112a35);
}

.product-bottle--plum {
    color: #251d2d;
    background: linear-gradient(180deg, #f8f3fb, #e0d6ea);
}

.product-bottle--plum::before {
    background: linear-gradient(180deg, #6b4d7f, #563866);
}

.product-bottle--sand {
    color: #3a2e22;
    background: linear-gradient(180deg, #fbf7f0, #eadac8);
}

.product-bottle--sand::before {
    background: linear-gradient(180deg, #f2ecdf, #d6c9b2);
}

.product-bottle--amber {
    color: #352613;
    background: linear-gradient(180deg, #fff9ef, #f3d089);
}

.product-bottle--amber::before {
    background: linear-gradient(180deg, #7f5a1f, #6e4810);
}

.product-bottle--rose {
    color: #462538;
    background: linear-gradient(180deg, #fff7fa, #f1d4e0);
}

.product-bottle--rose::before {
    background: linear-gradient(180deg, #c4a7b4, #af90a0);
}

.product-bottle--slate {
    color: #22303a;
    background: linear-gradient(180deg, #f9fafb, #dbe2e8);
}

.product-bottle--slate::before {
    background: linear-gradient(180deg, #6e7b88, #57636f);
}

.product-card__body {
    padding: 1.5rem;
}

.product-card__eyebrow {
    color: var(--green-800);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.product-rating {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    margin-top: 0.55rem;
    color: var(--ink-700);
    font-size: 0.9rem;
}

.rating-stars {
    display: inline-flex;
    align-items: center;
    gap: 0.15rem;
    color: #e8a329;
}

.product-card__title {
    margin: 0.85rem 0 0.65rem;
    font-family: var(--font-display);
    font-size: 1.32rem;
    font-weight: 800;
    line-height: 1.2;
}

.product-card__copy {
    margin: 0;
    color: var(--ink-700);
    line-height: 1.7;
}

.product-highlights,
.feature-bullet-list {
    margin: 1rem 0 0;
    padding: 0;
    list-style: none;
}

.product-highlights li,
.feature-bullet-list li {
    position: relative;
    padding-left: 1.3rem;
    color: var(--ink-700);
}

.product-highlights li + li,
.feature-bullet-list li + li {
    margin-top: 0.55rem;
}

.product-highlights li::before,
.feature-bullet-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.55rem;
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    background: var(--green-700);
}

.product-card__footer {
    margin-top: 1.25rem;
}

.product-price {
    display: flex;
    align-items: baseline;
    gap: 0.65rem;
}

.product-price strong {
    font-family: var(--font-display);
    font-size: 1.45rem;
    font-weight: 800;
}

.product-price span {
    color: var(--ink-500);
    text-decoration: line-through;
}

.product-card__actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
    margin-top: 1rem;
}

.product-filter-item.is-hidden {
    display: none;
}

.deal-banner {
    overflow: hidden;
    padding: clamp(2rem, 4.5vw, 3rem);
    border-radius: var(--radius-lg);
    background: linear-gradient(140deg, var(--green-950), var(--green-900) 60%, var(--green-700));
    color: var(--white);
    box-shadow: var(--shadow-lg);
}

.deal-banner h2 {
    margin: 1rem 0 0.85rem;
    font-family: var(--font-display);
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 800;
    line-height: 1.02;
    letter-spacing: -0.04em;
}

.deal-banner p {
    max-width: 56ch;
    color: rgba(255, 255, 255, 0.82);
    line-height: 1.8;
}

.deal-stack {
    display: grid;
    gap: 1rem;
}

.deal-card {
    padding: 1.5rem;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.12);
    box-shadow: var(--shadow-sm);
}

.deal-card--light {
    background: rgba(255, 255, 255, 0.92);
    color: var(--ink-900);
}

.deal-card h3,
.deal-card strong {
    display: block;
    margin-top: 0.7rem;
    font-family: var(--font-display);
}

.deal-card p {
    margin: 0.65rem 0 0;
}

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

.brand-chip {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    align-items: center;
    justify-content: center;
    min-height: 8rem;
    padding: 1rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.92);
    text-align: center;
    box-shadow: var(--shadow-sm);
}

.brand-chip strong {
    font-family: var(--font-display);
    font-size: 1.15rem;
    font-weight: 800;
}

.brand-chip span {
    color: var(--ink-700);
    font-size: 0.92rem;
}

.testimonial-card {
    height: 100%;
    padding: 1.6rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.94);
    box-shadow: var(--shadow-sm);
}

.testimonial-card p {
    margin: 1rem 0 1.5rem;
    color: var(--ink-700);
    line-height: 1.8;
}

.testimonial-card__author strong {
    display: block;
}

.testimonial-card__author span {
    color: var(--ink-500);
}

.page-hero {
    padding: 2.5rem 0 1.25rem;
}

.page-hero--compact {
    padding-bottom: 0.5rem;
}

.page-hero__content {
    max-width: 42rem;
}

.page-hero__content h1 {
    margin: 1rem 0 0.75rem;
    font-family: var(--font-display);
    font-size: clamp(1.75rem, 2.5vw, 2.4rem);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.05em;
}

.page-hero__content p {
    margin: 0;
    color: var(--ink-700);
    line-height: 1.75;
}

.breadcrumb {
    margin-bottom: 0;
}

.breadcrumb-item,
.breadcrumb-item a {
    color: var(--ink-500);
}

.breadcrumb-item.active {
    color: var(--ink-900);
}

.filter-panel,
.content-card,
.summary-card,
.auth-card,
.cart-surface,
.account-intro {
    padding: 1.6rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.94);
    box-shadow: var(--shadow-sm);
}

.sticky-xl-top {
    top: 7.5rem;
}

.filter-panel__group + .filter-panel__group,
.filter-panel__group + .filter-panel__promo {
    margin-top: 1.5rem;
}

.policy-content-card {
    padding: clamp(1.5rem, 2vw, 2.25rem);
}

.policy-content {
    color: var(--ink-700);
    line-height: 1.8;
}

.policy-content > *:first-child {
    margin-top: 0;
}

.policy-content > *:last-child {
    margin-bottom: 0;
}

.policy-content h2,
.policy-content h3,
.policy-content h4 {
    margin: 2rem 0 0.9rem;
    color: var(--ink-900);
    font-family: var(--font-display);
    font-weight: 800;
    line-height: 1.15;
}

.policy-content p,
.policy-content ul,
.policy-content ol,
.policy-content table {
    margin: 0 0 1rem;
}

.policy-content a,
.formatted-content a {
    color: var(--green-900);
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 0.14em;
}

.policy-content a:hover,
.policy-content a:focus-visible,
.formatted-content a:hover,
.formatted-content a:focus-visible {
    color: var(--green-950);
}

.policy-content ul,
.policy-content ol {
    padding-left: 1.3rem;
}

.policy-content table {
    width: 100%;
    border-collapse: collapse;
}

.policy-content th,
.policy-content td {
    padding: 0.7rem 0.8rem;
    border: 1px solid rgba(25, 44, 32, 0.12);
    text-align: left;
    vertical-align: top;
}

.policy-content th {
    background: rgba(45, 140, 80, 0.08);
    color: var(--ink-900);
    font-weight: 800;
}

.filter-panel__group h2,
.filter-panel__group h3,
.content-card h2,
.summary-card h2,
.form-section__header h2,
.account-intro h2 {
    margin: 0 0 1rem;
    font-family: var(--font-display);
    font-size: 1.35rem;
    font-weight: 800;
}

.filter-link-list,
.footer-links {
    margin: 0;
    padding: 0;
    list-style: none;
}

.filter-link-list li + li,
.footer-links li + li {
    margin-top: 0.75rem;
}

.filter-link-list a,
.footer-links a {
    color: var(--ink-700);
    font-weight: 600;
}

.filter-link-list a.is-active,
.filter-link-list a:hover,
.footer-links a:hover {
    color: var(--green-800);
}

.filter-panel__promo {
    padding: 1.3rem;
    border-radius: var(--radius-md);
    background: linear-gradient(145deg, rgba(17, 89, 43, 0.08), rgba(45, 140, 80, 0.16));
}

.filter-panel__promo strong,
.filter-panel__promo a {
    display: block;
    margin-top: 0.6rem;
    font-weight: 800;
}

.catalog-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.5rem;
    padding: 1rem 1.2rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.86);
}

.catalog-toolbar strong {
    display: block;
    font-family: var(--font-display);
    font-weight: 800;
}

.catalog-toolbar span {
    color: var(--ink-700);
}

.catalog-toolbar__controls {
    min-width: 15rem;
}

.catalog-bottom {
    margin-top: 2rem;
}

.catalog-bottom__card {
    padding: 1.8rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(241, 247, 241, 0.92));
}

.catalog-bottom__card h2 {
    margin: 1rem 0 0.8rem;
    font-family: var(--font-display);
    font-size: 1.8rem;
    font-weight: 800;
}

.catalog-bottom__card p {
    color: var(--ink-700);
}

.catalog-empty {
    display: flex;
    flex-direction: column;
    gap: 0.95rem;
    align-items: flex-start;
    margin-bottom: 1rem;
}

.catalog-empty h2 {
    margin: 0;
    font-family: var(--font-display);
    font-size: clamp(1.6rem, 3vw, 2.1rem);
    font-weight: 800;
}

.catalog-empty p {
    margin: 0;
    color: var(--ink-700);
    line-height: 1.7;
}

.catalog-empty__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.product-gallery {
    display: grid;
    gap: 1rem;
}

.product-gallery__stage {
    min-height: 34rem;
    padding: 1.5rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, 0.94);
    box-shadow: var(--shadow-md);
}

.product-gallery__stage .product-bottle--hero {
    position: relative;
    right: auto;
    bottom: auto;
    width: 14rem;
    height: 21rem;
    margin: 4rem auto 0;
    font-size: 2rem;
}

.product-gallery__packshot {
    display: block;
    margin: 3.3rem auto 0;
}

.product-gallery__packshot.brand-packshot--bottle {
    width: 12.4rem;
}

.product-gallery__packshot.brand-packshot--pouch {
    width: 13rem;
}

.product-gallery__stage--green { background: linear-gradient(180deg, #d7f0dc, #f4fbf6); }
.product-gallery__stage--sage { background: linear-gradient(180deg, #eff2df, #fafbf3); }
.product-gallery__stage--navy { background: linear-gradient(180deg, #d7e5ef, #f1f7fb); }
.product-gallery__stage--plum { background: linear-gradient(180deg, #eee5f7, #fbf8ff); }
.product-gallery__stage--sand { background: linear-gradient(180deg, #f2eadf, #fcfaf5); }
.product-gallery__stage--amber { background: linear-gradient(180deg, #f8e7bf, #fff8e8); }
.product-gallery__stage--rose { background: linear-gradient(180deg, #f5dfeb, #fff8fb); }
.product-gallery__stage--slate { background: linear-gradient(180deg, #e0e7ed, #f9fbfd); }

.product-gallery__thumb {
    display: grid;
    place-items: center;
    min-height: 7rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.88);
    font-weight: 800;
}

.product-gallery__thumb--soft {
    background: linear-gradient(180deg, rgba(248, 249, 247, 0.96), rgba(242, 245, 241, 0.92));
}

.product-gallery__thumb-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(5.6rem, 1fr));
    gap: 0.85rem;
}

.product-gallery__thumb-button {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 5.8rem;
    padding: 0.45rem;
    border: 1px solid rgba(18, 74, 34, 0.12);
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 10px 24px rgba(18, 52, 29, 0.06);
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.product-gallery__thumb-button:hover,
.product-gallery__thumb-button:focus-visible {
    border-color: rgba(15, 107, 34, 0.34);
    box-shadow: 0 14px 26px rgba(18, 52, 29, 0.1);
    transform: translateY(-1px);
    outline: none;
}

.product-gallery__thumb-button.is-active {
    border-color: rgba(15, 107, 34, 0.5);
    box-shadow: 0 0 0 0.18rem rgba(15, 107, 34, 0.1), 0 14px 30px rgba(18, 52, 29, 0.12);
}

.product-gallery__thumb-image {
    width: 100%;
    height: 4.8rem;
    object-fit: contain;
}

.product-summary__eyebrow {
    color: var(--green-800);
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.product-summary h1 {
    margin: 0.75rem 0;
    font-family: var(--font-display);
    font-size: clamp(2rem, 4vw, 3.2rem);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.05em;
}

.product-summary__subid {
    margin-top: -0.15rem;
    color: var(--ink-700);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.product-summary__rating {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.7rem;
    color: var(--ink-700);
}

.product-summary__lead {
    margin: 1rem 0 0;
    color: var(--ink-700);
    line-height: 1.85;
}

.product-summary__price {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.8rem;
    margin-top: 1.5rem;
}

.product-summary__price strong {
    font-family: var(--font-display);
    font-size: 2rem;
    font-weight: 800;
}

.product-summary__price span {
    color: var(--ink-500);
    text-decoration: line-through;
}

.product-summary__price small {
    color: var(--green-800);
    font-weight: 700;
}

.feature-bullet-list--product {
    margin-top: 1.2rem;
}

.product-purchase-box {
    display: flex;
    gap: 1rem;
    margin-top: 1.5rem;
}

.quantity-stepper {
    display: inline-flex;
    align-items: center;
    min-width: 9rem;
    padding: 0.35rem;
    border: 1px solid var(--line-strong);
    border-radius: var(--radius-pill);
    background: rgba(255, 255, 255, 0.94);
}

.quantity-stepper__button {
    display: inline-grid;
    place-items: center;
    width: 2.8rem;
    height: 2.8rem;
    border: 0;
    border-radius: 50%;
    background: rgba(17, 89, 43, 0.08);
    color: var(--green-900);
}

.quantity-stepper__input {
    width: 100%;
    border: 0;
    background: transparent;
    text-align: center;
    font-weight: 800;
    box-shadow: none;
}

.quantity-stepper__input::-webkit-outer-spin-button,
.quantity-stepper__input::-webkit-inner-spin-button {
    margin: 0;
    -webkit-appearance: none;
}

.product-summary__meta {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 1.5rem;
}

.product-summary__details {
    margin-top: 1.5rem;
    padding-top: 1.25rem;
    border-top: 1px solid var(--line);
}

.product-summary__details h2 {
    margin: 0;
    color: var(--ink-900);
    font-family: var(--font-display);
    font-size: 1.15rem;
    font-weight: 800;
}

.product-summary__meta--format {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem 1.25rem;
    margin-top: 0.9rem;
}

.product-summary__meta--format > div {
    min-width: 0;
    padding-bottom: 0.8rem;
    border-bottom: 1px solid var(--line);
}

.product-summary__meta span {
    display: block;
    color: var(--ink-500);
    font-size: 0.86rem;
}

.product-summary__meta strong {
    display: block;
    margin-top: 0.25rem;
}

.combo-bundle {
    margin-top: 1.5rem;
    padding: 1.15rem;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fbfdfb;
}

.combo-bundle__heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.combo-bundle__heading h2 {
    margin: .2rem 0 0;
    font-size: 1.15rem;
}

.combo-bundle__expiry {
    flex: 0 0 auto;
    padding: .35rem .6rem;
    border-radius: 999px;
    color: var(--brand-deep);
    background: #e8f4eb;
    font-size: .78rem;
    font-weight: 700;
}

.combo-bundle__description {
    margin: .8rem 0 0;
    color: var(--muted);
    font-size: .92rem;
}

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

.combo-bundle__item {
    display: flex;
    gap: .7rem;
    min-width: 0;
    padding: .7rem;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: #fff;
}

.combo-bundle__item-media {
    display: grid;
    flex: 0 0 58px;
    place-items: center;
    width: 58px;
    height: 58px;
    overflow: hidden;
    border-radius: 8px;
    background: #f1f6f1;
}

.combo-bundle__item-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.combo-bundle__item-media span {
    color: var(--brand);
}

.combo-bundle__item-copy {
    min-width: 0;
}

.combo-bundle__item-copy a {
    display: block;
    overflow: hidden;
    color: var(--ink);
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.combo-bundle__item-copy small,
.combo-bundle__item-copy p {
    display: block;
    margin: .18rem 0 0;
    color: var(--muted);
    font-size: .78rem;
}

.combo-bundle__item-copy p {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.combo-bundle__item-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem .7rem;
    align-items: center;
    margin-top: .35rem;
    color: var(--muted);
    font-size: .75rem;
}

.combo-bundle__item-qty {
    display: inline-block;
    color: var(--brand-deep);
    font-size: .75rem;
    font-weight: 700;
}

@media (max-width: 575.98px) {
    .combo-bundle__heading {
        display: block;
    }

    .combo-bundle__expiry {
        display: inline-block;
        margin-top: .7rem;
    }

    .combo-bundle__items {
        grid-template-columns: 1fr;
    }
}

.product-subscription-box {
    margin-top: 1.5rem;
    padding: 1.25rem;
    border: 1px solid rgba(17, 89, 43, 0.18);
    border-radius: var(--radius-md);
    background: #f5fbf7;
}

.product-subscription-box__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.product-subscription-box__header h2 {
    margin: 0.35rem 0;
    font-size: 1.2rem;
}

.product-subscription-box__header p {
    margin: 0;
    color: var(--ink-700);
    font-size: 0.9rem;
}

.product-subscription-box__header > strong {
    color: var(--green-900);
    white-space: nowrap;
}

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

.subscription-card {
    padding: 1.15rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    background: #fff;
}

.subscription-card__body {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.subscription-card h4 {
    margin: 0.35rem 0;
    font-size: 1.15rem;
}

.subscription-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem 1rem;
    color: var(--ink-700);
    font-size: 0.88rem;
}

.subscription-card__side {
    display: grid;
    justify-items: end;
    gap: 0.75rem;
}

.subscription-card__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.5rem;
}

.subscription-card__notice {
    margin-top: 1rem;
    padding-top: 0.85rem;
    border-top: 1px solid var(--line);
    color: var(--ink-700);
    font-size: 0.88rem;
}

@media (max-width: 640px) {
    .product-subscription-box__header,
    .subscription-card__body {
        display: grid;
    }

    .subscription-card__side {
        justify-items: start;
    }

    .subscription-card__actions {
        justify-content: flex-start;
    }
}

.storefront-accordion .accordion-item {
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    overflow: hidden;
}

.storefront-accordion .accordion-item + .accordion-item {
    margin-top: 0.75rem;
}

.storefront-accordion .accordion-button {
    font-weight: 800;
    box-shadow: none;
}

.storefront-accordion .accordion-button:not(.collapsed) {
    color: var(--green-900);
    background: rgba(17, 89, 43, 0.06);
}

.product-faq-list {
    display: grid;
    gap: 0.9rem;
}

.product-faq-item {
    padding: 1rem 1.05rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    background: rgba(248, 250, 252, 0.85);
}

.product-faq-item__question {
    margin: 0 0 0.45rem;
    color: var(--green-900);
    font-size: 1rem;
    font-weight: 800;
}

.product-faq-item__answer {
    color: var(--ink-700);
    line-height: 1.7;
}

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

.cart-line {
    display: grid;
    grid-template-columns: 12rem 1fr;
    gap: 1.25rem;
    align-items: center;
    padding: 1rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.86);
}

.cart-line__media {
    min-height: 11rem;
    border-radius: calc(var(--radius-md) - 0.25rem);
}

.cart-line__media .product-bottle {
    right: 50%;
    bottom: 0.75rem;
    width: 7rem;
    height: 10rem;
    transform: translateX(50%);
}

.cart-line__packshot {
    position: absolute;
    left: 50%;
    bottom: 0.75rem;
    z-index: 1;
    transform: translateX(-50%);
}

.cart-line__packshot.brand-packshot--bottle {
    width: 5.8rem;
}

.cart-line__packshot.brand-packshot--pouch {
    width: 6.3rem;
}

.cart-line__top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.cart-line__top h2 {
    margin: 0.45rem 0 0.25rem;
    font-family: var(--font-display);
    font-size: 1.35rem;
    font-weight: 800;
}

.cart-line__top p {
    margin: 0;
    color: var(--ink-700);
}

.cart-line__bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 1.25rem;
}

.cart-line__price {
    text-align: right;
}

.cart-line__price span {
    display: block;
    color: var(--ink-500);
}

.cart-line__price strong {
    display: block;
    font-family: var(--font-display);
    font-size: 1.35rem;
    font-weight: 800;
}

.summary-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.9rem 0;
    border-bottom: 1px solid var(--line);
}

.summary-row--total {
    font-family: var(--font-display);
    font-size: 1.2rem;
    font-weight: 800;
}

.summary-card__field,
.summary-product-list {
    margin: 1.25rem 0;
}

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

.summary-product {
    display: grid;
    grid-template-columns: 4.5rem 1fr auto;
    gap: 1rem;
    align-items: center;
}

.summary-product__visual {
    min-height: 4.5rem;
    padding: 0.35rem;
    border-radius: var(--radius-sm);
}

.summary-product__visual .product-bottle {
    right: 0.5rem;
    bottom: 0.4rem;
    width: 2.8rem;
    height: 4rem;
    padding-bottom: 0.35rem;
    font-size: 0.55rem;
}

.summary-product__packshot {
    position: absolute;
    left: 50%;
    bottom: 0.35rem;
    z-index: 1;
    transform: translateX(-50%);
}

.summary-product__packshot.brand-packshot--bottle {
    width: 2.55rem;
}

.summary-product__packshot.brand-packshot--pouch {
    width: 2.9rem;
}

.checkout-steps {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1.5rem;
}

.checkout-steps span {
    padding: 0.65rem 0.95rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-pill);
    color: var(--ink-500);
    font-weight: 700;
    background: rgba(255, 255, 255, 0.82);
}

.checkout-steps .is-active {
    color: var(--green-900);
    border-color: rgba(17, 89, 43, 0.18);
    background: rgba(17, 89, 43, 0.08);
}

.checkout-form {
    display: grid;
    gap: 1rem;
}

.form-section {
    padding: 1.6rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.94);
    box-shadow: var(--shadow-sm);
}

.form-section__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.form-section__header a {
    color: var(--green-800);
    font-weight: 700;
}

.form-label {
    margin-bottom: 0.45rem;
    font-weight: 700;
}

.form-control,
.form-select {
    min-height: 3.25rem;
    border-color: rgba(17, 36, 23, 0.1);
    border-radius: 1rem;
    padding: 0.85rem 1rem;
    box-shadow: none;
}

.form-control:focus,
.form-select:focus {
    border-color: rgba(17, 89, 43, 0.22);
    box-shadow: 0 0 0 0.24rem rgba(17, 89, 43, 0.08);
}

.checkout-option-list {
    display: grid;
    gap: 0.9rem;
}

.checkout-option {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 0.9rem;
    align-items: center;
    padding: 1rem 1rem 1rem 1.1rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.86);
    cursor: pointer;
}

.checkout-option strong {
    display: block;
}

.checkout-option span {
    color: var(--ink-700);
}

.account-intro {
    color: var(--white);
    background: linear-gradient(145deg, var(--green-950), var(--green-900) 65%, var(--green-700));
    box-shadow: var(--shadow-lg);
}

.account-intro h2 {
    margin: 1rem 0 0.85rem;
    font-size: 2rem;
}

.account-intro p {
    color: rgba(255, 255, 255, 0.82);
    line-height: 1.8;
}

.feature-bullet-list--light li {
    color: rgba(255, 255, 255, 0.88);
}

.feature-bullet-list--light li::before {
    background: rgba(255, 255, 255, 0.84);
}

.auth-tabs {
    gap: 0.75rem;
    margin-bottom: 1.4rem;
}

.auth-tabs .nav-link {
    padding: 0.85rem 1.15rem;
    border-radius: var(--radius-pill);
    color: var(--ink-700);
    font-weight: 800;
}

.auth-tabs .nav-link.active {
    color: var(--white);
    background: linear-gradient(135deg, var(--green-900), var(--green-700));
}

.auth-form__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin: 1rem 0 1.2rem;
}

.auth-form__meta a {
    color: var(--green-800);
    font-weight: 700;
}

.newsletter-form {
    display: grid;
    gap: 0.85rem;
}

.newsletter-form .form-control {
    border: 0;
}

.newsletter-feedback {
    min-height: 1.5rem;
    color: rgba(255, 255, 255, 0.82);
    font-size: 0.92rem;
}

.newsletter-feedback.is-success {
    color: rgba(241, 255, 242, 0.96);
}

.newsletter-feedback.is-danger {
    color: #ffe2b8;
}

.site-footer {
    padding: 2rem 0 0;
    background: linear-gradient(180deg, #0a5b18 0%, #074411 100%);
    color: rgba(255, 255, 255, 0.94);
}

.footer-signup {
    display: grid;
    grid-template-columns: minmax(10rem, 0.85fr) minmax(18rem, 1.75fr);
    gap: 1rem;
    align-items: center;
    padding: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: var(--radius-sm);
    background: rgba(255, 255, 255, 0.08);
}

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

.footer-brand__mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3.35rem;
    height: 3.35rem;
    border-radius: 50%;
    color: var(--green-900);
    background: #ffffff;
    font-family: var(--font-display);
    font-weight: 900;
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.16);
}

.footer-brand__name {
    color: #ffffff;
    font-family: var(--font-display);
    font-size: 1.05rem;
    font-weight: 800;
    line-height: 1.1;
}

.footer-signup__form {
    grid-template-columns: auto minmax(12rem, 1fr) auto;
    align-items: center;
    gap: 0.75rem;
}

.footer-signup__label {
    margin: 0;
    color: #ffffff;
    font-size: 0.95rem;
    font-weight: 800;
    white-space: nowrap;
}

.footer-signup .form-control {
    min-height: 2.7rem;
    border: 0;
    border-radius: var(--radius-pill);
}

.footer-signup .btn {
    min-height: 2.7rem;
    padding-inline: 1.15rem;
    color: var(--green-900);
    background: #ffffff;
    box-shadow: none;
}

.footer-signup .newsletter-feedback {
    grid-column: 2 / -1;
    min-height: 1rem;
}

.footer-notices {
    display: grid;
    gap: 0.5rem;
    margin-top: 0.85rem;
}

.footer-notices p {
    margin: 0;
    padding: 0.8rem 0.95rem;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 0.65rem;
    background: rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.9);
    font-size: 0.9rem;
    line-height: 1.55;
}

.footer-notices strong {
    color: #ffffff;
}

.footer-main {
    padding: 0.95rem 0 1.35rem;
    border-bottom: 0;
}

.footer-layout {
    display: grid;
    grid-template-columns: 1fr 1fr 1.35fr 1.1fr 1.55fr;
    gap: 0;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: var(--radius-sm);
    background: rgba(255, 255, 255, 0.07);
    overflow: hidden;
}

.site-footer h3 {
    display: block;
    margin: 0;
    padding: 0.72rem 0.9rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.14);
    font-family: var(--font-body);
    font-size: 0.95rem;
    font-weight: 800;
    color: #ffffff;
    background: rgba(255, 255, 255, 0.08);
}

.footer-column {
    height: 100%;
    min-width: 0;
    border-right: 1px solid rgba(255, 255, 255, 0.14);
}

.footer-column:last-child {
    border-right: 0;
}

.site-footer .footer-links {
    margin: 0;
    padding: 0.85rem 0.9rem 1rem;
}

.site-footer .footer-links li + li {
    margin-top: 0.48rem;
}

.site-footer .footer-links a {
    color: rgba(255, 255, 255, 0.9);
    font-size: 0.92rem;
    font-weight: 500;
    line-height: 1.45;
    transition: color var(--transition), transform var(--transition);
}

.site-footer .footer-links a:hover,
.site-footer .footer-links a:focus-visible {
    color: #ffffff;
    transform: translateX(2px);
}

.site-footer .footer-links a::before {
    display: none;
}

.footer-contact-link::before {
    display: none !important;
}

.footer-contact-list {
    padding-bottom: 0.65rem;
}

.footer-contact-list strong {
    color: #ffffff;
    font-weight: 800;
}

.footer-address-line {
    display: block;
    color: rgba(255, 255, 255, 0.88);
    font-size: 0.92rem;
    line-height: 1.5;
}

.footer-social-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.68rem;
    margin: 0 0.9rem 1rem;
    padding: 0.72rem;
    border-radius: 0.65rem;
    background: rgba(255, 255, 255, 0.12);
}

.footer-social-row > span {
    color: #ffffff;
    font-size: 0.9rem;
    font-weight: 800;
}

.footer-socials {
    display: flex;
    flex-wrap: wrap;
    gap: 0.48rem;
    margin: 0;
}

.footer-social {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.1rem;
    height: 2.1rem;
    border-radius: 50%;
    color: var(--green-900);
    background: #ffffff;
    transition: background-color var(--transition), transform var(--transition);
}

.footer-social:hover,
.footer-social:focus-visible {
    color: var(--green-900);
    background: rgba(255, 255, 255, 0.86);
    transform: translateY(-1px);
}

.footer-social .icon {
    width: 1rem;
    height: 1rem;
}

.footer-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.95rem 0;
    color: #3f493f;
    font-size: 0.92rem;
}

.footer-bottom-shell {
    margin-top: 0;
    background: #ffffff;
    box-shadow: inset 0 1px 0 rgba(10, 91, 24, 0.08);
}

.footer-payments {
    display: flex;
    align-items: center;
    gap: 0.85rem;
}

.footer-payment-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.footer-payment-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.32rem;
    min-height: 1.85rem;
    padding: 0.2rem 0.68rem;
    border: 1px solid #d8ddd6;
    border-radius: 0.45rem;
    color: #1f2821;
    background: #ffffff;
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.01em;
    box-shadow: 0 2px 6px rgba(17, 36, 23, 0.05);
}

.footer-payment-badge--visa {
    color: #1434cb;
    border-color: rgba(20, 52, 203, 0.18);
    background: linear-gradient(180deg, #ffffff 0%, #eef3ff 100%);
    font-style: italic;
    letter-spacing: 0.03em;
}

.footer-payment-badge--mastercard {
    color: #1f1f1f;
    border-color: rgba(235, 0, 27, 0.14);
    background: linear-gradient(180deg, #ffffff 0%, #fff7f1 100%);
}

.footer-payment-badge--mastercard::before {
    content: "";
    width: 1.15rem;
    height: 1.15rem;
    border-radius: 50%;
    flex: 0 0 auto;
    background:
        radial-gradient(circle at 34% 50%, #eb001b 0 37%, transparent 38%),
        radial-gradient(circle at 66% 50%, #f79e1b 0 37%, transparent 38%),
        linear-gradient(90deg, transparent 40%, rgba(255, 95, 0, 0.82) 40% 60%, transparent 60%);
}

.footer-payment-badge--amex {
    color: #0077a6;
    border-color: rgba(0, 119, 166, 0.2);
    background: linear-gradient(180deg, #ffffff 0%, #e8f8ff 100%);
}

.footer-payment-badge--paypal {
    border-color: rgba(0, 48, 135, 0.16);
    background: linear-gradient(180deg, #ffffff 0%, #eef5ff 100%);
    background-image:
        linear-gradient(90deg, #003087 0 46%, #009cde 46% 100%),
        linear-gradient(180deg, #ffffff 0%, #eef5ff 100%);
    background-clip: text, border-box;
    -webkit-background-clip: text, border-box;
    color: transparent;
    -webkit-text-fill-color: transparent;
}

.footer-payment-badge--applepay {
    color: #111111;
    border-color: rgba(17, 17, 17, 0.14);
    background: linear-gradient(180deg, #ffffff 0%, #f1f2f4 100%);
}

.footer-payment-badge--visa,
.footer-payment-badge--amex,
.footer-payment-badge--paypal,
.footer-payment-badge--applepay {
    font-weight: 900;
}

.toast {
    border-radius: 1rem;
    background: rgba(13, 67, 32, 0.96);
    color: var(--white);
    box-shadow: var(--shadow-md);
}

@media (max-width: 1399.98px) {
    .mega-menu__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

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

@media (max-width: 1199.98px) {
    .site-header {
        position: static;
    }

    .navbar-collapse {
        padding-top: 1rem;
    }

    .header-actions--mobile {
        margin-top: 1rem;
        justify-content: flex-start;
    }

    .primary-nav {
        align-items: stretch;
        margin-top: 1rem;
    }

    .mega-menu {
        padding: 0;
        border: 0;
        box-shadow: none !important;
        background: transparent;
    }

    .mega-menu__grid {
        grid-template-columns: 1fr;
    }

    .hero-stage {
        min-height: 30rem;
    }
}

@media (max-width: 991.98px) {
    .section-shell {
        padding: 4rem 0;
    }

    .section-heading,
    .catalog-toolbar,
    .product-purchase-box,
    .auth-form__meta,
    .footer-bottom {
        flex-direction: column;
        align-items: flex-start;
    }

    .hero-stage {
        min-height: auto;
    }

    .hero-stage__badge,
    .hero-stage__stat {
        position: static;
        max-width: none;
        margin-bottom: 1rem;
    }

    .hero-stage__visual {
        min-height: 20rem;
    }

    .hero-bottle--primary {
        right: 2rem;
        width: 11.5rem;
        height: 16rem;
        font-size: 1.45rem;
    }

    .hero-bottle--secondary {
        left: 0.75rem;
        width: 9.5rem;
        height: 14rem;
        font-size: 1.2rem;
    }

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

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

    .footer-column:nth-child(2n) {
        border-right: 0;
    }

    .footer-column {
        border-bottom: 1px solid rgba(255, 255, 255, 0.14);
    }

    .footer-column:last-child {
        border-bottom: 0;
    }

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

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

    .product-gallery__stage {
        min-height: 28rem;
    }
}

@media (max-width: 767.98px) {
    .section-title {
        max-width: 100%;
    }

    .navbar {
        padding: 0.9rem 0;
    }

    .brand-mark {
        width: 3.6rem;
    }

    .brand-copy strong {
        font-size: 1.1rem;
    }

    .hero-shell,
    .newsletter-card,
    .deal-banner {
        padding: 1.6rem;
    }

    .hero-actions,
    .product-card__actions {
        grid-template-columns: 1fr;
    }

    .hero-actions .btn,
    .product-card__actions .btn,
    .newsletter-form .btn,
    .summary-card .btn,
    .checkout-form .btn {
        width: 100%;
    }

    .hero-proof .col-sm-4,
    .brand-strip-grid,
    .newsletter-card {
        grid-template-columns: 1fr;
    }

    .product-card__actions {
        display: grid;
    }

    .catalog-toolbar__controls,
    .newsletter-form {
        width: 100%;
    }

    .footer-signup {
        grid-template-columns: 1fr;
    }

    .footer-signup__form {
        grid-template-columns: 1fr;
    }

    .footer-signup__label,
    .footer-signup .newsletter-feedback {
        grid-column: auto;
    }

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

    .footer-column,
    .footer-column:nth-child(2n) {
        border-right: 0;
    }

    .summary-product {
        grid-template-columns: 1fr;
        justify-items: start;
    }

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

@media (max-width: 575.98px) {
    .section-shell {
        padding: 3.4rem 0;
    }

    .header-search {
        display: none !important;
    }

    .hero-copy h1,
    .page-hero__content h1,
    .product-summary h1,
    .newsletter-card h2 {
        font-size: 2rem;
    }

    .hero-stage__visual {
        min-height: 17rem;
    }

    .hero-bottle--primary {
        right: 1rem;
        width: 8.7rem;
        height: 12.6rem;
        font-size: 1.05rem;
    }

    .hero-bottle--secondary {
        left: 0;
        width: 7.2rem;
        height: 10.8rem;
        font-size: 0.92rem;
    }

    .checkout-option {
        grid-template-columns: auto 1fr;
    }

    .checkout-option > strong:last-child {
        grid-column: 2;
    }

    .product-gallery__stage {
        min-height: 22rem;
        padding: 1.2rem;
    }

    .product-gallery__image {
        max-height: 18rem;
        margin-top: 2rem;
    }

    .product-gallery__thumb-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 0.7rem;
    }

    .product-gallery__thumb-button {
        min-height: 5rem;
        padding: 0.35rem;
    }

    .product-gallery__thumb-image {
        height: 4rem;
    }
}

/* Reference-inspired retail theme refinements */
.site-header {
    backdrop-filter: none;
    box-shadow: 0 10px 26px rgba(17, 36, 23, 0.05);
}

.topbar {
    background: #0f6b22;
    font-size: 0.88rem;
}

.topbar__inner {
    min-height: 2.2rem;
    padding: 0.45rem 0;
}

.topbar__links {
    gap: 1.35rem;
}

.topbar__contact {
    font-weight: 700;
    color: var(--white);
}

.topbar__contact .icon {
    width: 1.18rem;
    height: 1.18rem;
    margin-right: 0.12rem;
    color: var(--white);
    fill: currentColor;
    filter: drop-shadow(0 2px 6px rgba(6, 34, 15, 0.22));
}

.topbar__contact--phone .icon {
    width: 1.22rem;
    height: 1.22rem;
    margin-right: 0.18rem;
    color: var(--white);
    fill: none;
    stroke: currentColor;
    stroke-width: 1.85;
    filter: drop-shadow(0 1px 4px rgba(6, 34, 15, 0.18));
}

.topbar__contact:hover .icon,
.topbar__contact:focus-visible .icon {
    transform: scale(1.04);
}

.topbar__links a:last-child .icon {
    width: 0.8rem;
    height: 0.8rem;
}

.product-card__image-wrap {
    position: absolute;
    inset: 3.5rem 1.4rem 1.1rem;
    z-index: 1;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.product-card__image {
    max-height: 100%;
    width: auto;
    object-fit: contain;
    filter: drop-shadow(0 16px 28px rgba(17, 36, 23, 0.18));
}

.product-rating--placeholder {
    min-height: 1.4rem;
    color: var(--green-800);
    font-size: 0.82rem;
    font-weight: 700;
}

.product-gallery__image {
    display: block;
    width: 100%;
    max-width: min(100%, 22rem);
    max-height: 24rem;
    margin: 3.5rem auto 0;
    object-fit: contain;
    filter: drop-shadow(0 22px 34px rgba(17, 36, 23, 0.18));
}

.product-gallery__video video {
    width: 100%;
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    background: #09160d;
    box-shadow: var(--shadow-sm);
}

.product-summary__rating--placeholder {
    margin-top: 0.25rem;
    color: var(--green-800);
    font-size: 0.92rem;
    font-weight: 700;
}

.formatted-content {
    color: var(--ink-900);
    line-height: 1.75;
}

.formatted-content p {
    margin: 0 0 0.8rem;
}

.formatted-content span[style*="font-size"] {
    line-height: inherit;
}

.formatted-content ul,
.formatted-content ol {
    margin: 0 0 0.9rem;
    padding-left: 1.25rem;
}

.formatted-content li + li {
    margin-top: 0.35rem;
}

.formatted-content p:last-child,
.formatted-content ul:last-child,
.formatted-content ol:last-child {
    margin-bottom: 0;
}

.supplement-facts-card {
    max-width: 420px;
    margin: 0 auto;
    padding: 0.9rem;
    border: 1px solid rgba(15, 23, 42, 0.1);
    border-radius: 1.1rem;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    box-shadow: 0 18px 34px rgba(15, 23, 42, 0.08);
}

.supplement-facts-card__image {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 5;
    object-fit: contain;
    border-radius: 0.8rem;
    background: #ffffff;
}

.auth-google {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--line);
}

.auth-google__label {
    margin: 0 0 0.85rem;
    color: var(--ink-700);
    font-size: 0.9rem;
    font-weight: 700;
}

.account-dashboard h2 {
    margin: 0.95rem 0 0.75rem;
    font-family: var(--font-display);
    font-size: clamp(1.7rem, 3vw, 2.4rem);
    font-weight: 800;
    letter-spacing: -0.04em;
}

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

.account-stat {
    padding: 1rem 1.05rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    background: rgba(247, 250, 246, 0.94);
}

.account-stat span {
    display: block;
    color: var(--ink-500);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.account-stat strong {
    display: block;
    margin-top: 0.45rem;
    color: var(--ink-900);
    font-size: 1rem;
    font-weight: 800;
}

.account-dashboard__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.85rem;
    margin-top: 1.5rem;
}

.header-main {
    border-bottom: 1px solid rgba(18, 23, 20, 0.06);
    background: rgba(255, 255, 255, 0.98);
}

.navbar {
    gap: 1.25rem;
    padding: 1.05rem 0;
}

.brand-mark {
    width: 4.85rem;
}

.brand-copy strong {
    font-size: 1.78rem;
    color: var(--green-900);
}

.brand-copy small {
    font-size: 0.92rem;
    color: #313a34;
}

.header-search {
    gap: 0;
    min-height: 3.75rem;
    padding: 0;
    border: 1px solid rgba(18, 23, 20, 0.1);
    border-radius: 0.95rem;
    background: var(--white);
    box-shadow: none;
}

.header-search .form-control,
.header-search .form-select {
    min-height: 3.7rem;
    padding: 0 1.15rem;
}

.header-search .form-control {
    border-right: 1px solid rgba(18, 23, 20, 0.08);
    border-radius: 0.95rem 0 0 0.95rem;
}

.header-search .form-select {
    max-width: 12.25rem;
    border-left: 0;
    border-right: 1px solid rgba(18, 23, 20, 0.08);
    border-radius: 0;
    color: #444f48;
}

.btn-search-submit {
    min-width: 3.75rem;
    height: 3.75rem;
    border-radius: 0 0.9rem 0.9rem 0;
    box-shadow: none;
}

.btn-search-submit .icon {
    width: 1.15rem;
    height: 1.15rem;
    color: #ffffff;
}

.header-actions {
    gap: 1rem;
}

.header-action {
    gap: 0.8rem;
    min-height: 3.25rem;
    padding: 0;
    border: 0;
    background: transparent;
}

.header-action .icon {
    width: 1.7rem;
    height: 1.7rem;
}

.header-action__stack {
    display: flex;
    flex-direction: column;
    line-height: 1.15;
}

.header-action__stack small {
    color: var(--ink-500);
    font-size: 0.85rem;
}

.header-action__stack strong {
    color: var(--ink-900);
    font-size: 1rem;
}

.header-action--cart {
    position: relative;
    padding-right: 0.4rem;
}

.header-action--cart strong {
    position: absolute;
    top: -0.15rem;
    left: 1rem;
    min-width: 1.45rem;
    height: 1.45rem;
    font-size: 0.72rem;
}

.header-catalog {
    border-top: 1px solid rgba(18, 23, 20, 0.05);
    border-bottom: 1px solid rgba(18, 23, 20, 0.07);
    background: #ffffff;
}

.header-catalog__inner {
    display: grid;
    grid-template-columns: 14.4rem minmax(0, 1fr);
    align-items: center;
    gap: 1.1rem;
    min-height: 4.35rem;
}

.catalog-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.7rem;
    min-height: 3.05rem;
    padding: 0.38rem 0.72rem 0.38rem 0.56rem;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 0.82rem;
    background: #2f9848;
    color: var(--white);
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.16),
        0 12px 24px rgba(12, 92, 35, 0.18);
    transition: transform var(--transition), box-shadow var(--transition), background-color var(--transition);
}

.catalog-button:hover,
.catalog-button:focus-visible {
    color: var(--white);
    transform: translateY(-1px);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.2),
        0 15px 28px rgba(12, 92, 35, 0.23);
}

.catalog-button__icon {
    display: grid;
    place-items: center;
    width: 2.08rem;
    height: 2.08rem;
    flex: 0 0 auto;
    border-radius: 0.62rem;
    background: rgba(255, 255, 255, 0.14);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16);
}

.catalog-button .icon {
    width: 1.08rem;
    height: 1.08rem;
}

.catalog-button__chevron {
    width: 0.82rem !important;
    height: 0.82rem !important;
    opacity: 0.82;
}

.catalog-links {
    display: flex;
    align-items: center;
    gap: 0.15rem;
    margin: 0;
    padding: 0;
    list-style: none;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.catalog-links::-webkit-scrollbar {
    display: none;
}

.catalog-links li,
.primary-nav li,
.footer-links li,
.filter-link-list li {
    list-style: none;
}

.catalog-links a {
    display: inline-flex;
    align-items: center;
    min-height: 2.55rem;
    padding: 0 0.72rem;
    border-radius: 999px;
    color: #1d241f;
    font-size: 0.95rem;
    font-weight: 700;
    white-space: nowrap;
}

.catalog-links a.active,
.catalog-links a:hover {
    color: var(--green-900);
}

.catalog-links__accent,
.primary-nav .nav-link--accent {
    color: #f48a15 !important;
}

.hero-section {
    padding-top: 0;
    padding-bottom: 0.8rem;
}

.hero-shell {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    padding: 3rem 2.4rem 2.8rem;
    border: 1px solid rgba(103, 135, 46, 0.24);
    border-top: 0;
    border-radius: 0 0 1.55rem 1.55rem;
    background: linear-gradient(135deg, #77b72c 0%, #5d9b1d 24%, #4b8917 58%, #77b632 100%);
    box-shadow: 0 26px 54px rgba(42, 71, 16, 0.16);
}

.hero-shell > .row,
.hero-copy,
.hero-stage {
    position: relative;
    z-index: 3;
}

.hero-scene {
    position: absolute;
    pointer-events: none;
}

.hero-scene--top {
    inset: 0 0 auto;
    height: 3rem;
    z-index: 0;
    background: linear-gradient(180deg, rgba(33, 74, 10, 0.9), rgba(33, 74, 10, 0.45));
}

.hero-scene--burst {
    top: 0.25rem;
    right: -3rem;
    width: min(40rem, 62%);
    height: calc(100% - 4rem);
    z-index: 0;
    opacity: 0.82;
    background:
        radial-gradient(circle at 42% 38%, rgba(236, 255, 170, 0.56) 0, rgba(205, 236, 106, 0.3) 18%, transparent 46%),
        repeating-conic-gradient(
            from -4deg at 42% 38%,
            rgba(255, 255, 255, 0.16) 0deg 7deg,
            rgba(255, 255, 255, 0) 7deg 13deg
        );
}

.hero-scene--curve {
    left: -6%;
    right: -4%;
    bottom: 4.9rem;
    height: 7.2rem;
    z-index: 1;
    background: #fef8ef;
    border-radius: 0 0 54% 54% / 0 0 100% 100%;
    box-shadow: 0 -4px 0 rgba(255, 255, 255, 0.84);
    transform: rotate(2.6deg);
    transform-origin: center;
}

.hero-scene--base {
    inset: auto 0 0;
    height: 6.8rem;
    z-index: 0;
    background: linear-gradient(180deg, #ffb92d 0%, #ef881a 56%, #de6612 100%);
}

.hero-brandlockup {
    display: inline-flex;
    align-items: center;
    gap: 0.95rem;
    margin-bottom: 1rem;
}

.hero-brandlockup__mark {
    position: relative;
    display: inline-block;
    width: 3rem;
    height: 2.6rem;
    flex-shrink: 0;
}

.hero-brandlockup__mark span {
    position: absolute;
    display: block;
    border-radius: 60% 0 60% 0;
    background: linear-gradient(160deg, #ecffce, #addf62);
    box-shadow: 0 10px 18px rgba(53, 92, 19, 0.18);
}

.hero-brandlockup__mark span:nth-child(1) {
    left: 0.15rem;
    bottom: 0.2rem;
    width: 1.1rem;
    height: 1.9rem;
    transform: rotate(-24deg);
}

.hero-brandlockup__mark span:nth-child(2) {
    left: 1rem;
    top: 0.05rem;
    width: 1.1rem;
    height: 1.65rem;
    transform: rotate(14deg);
}

.hero-brandlockup__mark span:nth-child(3) {
    right: 0;
    bottom: 0.22rem;
    width: 1rem;
    height: 1.55rem;
    transform: rotate(30deg);
}

.hero-brandlockup strong,
.hero-brandlockup span {
    display: block;
}

.hero-brandlockup strong {
    color: #ffffff;
    font-family: var(--font-display);
    font-size: 1.4rem;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.03em;
}

.hero-brandlockup div > span {
    margin-top: 0.2rem;
    color: rgba(246, 252, 232, 0.84);
    font-size: 0.88rem;
    font-weight: 600;
}

.hero-kicker {
    display: inline-flex;
    align-items: center;
    padding: 0.4rem 0.82rem;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    background: rgba(16, 61, 8, 0.22);
    color: #f4f8d4;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    line-height: 1.1;
    backdrop-filter: blur(10px);
}

.hero-copy h1 {
    margin: 1rem 0 0.95rem;
    color: #ffffff;
    font-size: clamp(3rem, 5vw, 4.85rem);
    line-height: 1;
    text-shadow: 0 12px 26px rgba(35, 70, 12, 0.18);
}

.hero-copy h1 span {
    display: block;
    color: #f7ffd5;
}

.hero-lead {
    max-width: 31rem;
    color: rgba(250, 252, 239, 0.9);
    font-size: 1.02rem;
    line-height: 1.65;
}

.hero-benefits {
    margin-top: 1.75rem;
}

.hero-point {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-height: 4rem;
    padding: 0.82rem 0.92rem;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
}

.hero-point .icon {
    width: 1.45rem;
    height: 1.45rem;
    color: #e9ffd3;
}

.hero-point strong {
    display: block;
    color: #ffffff;
    font-size: 0.96rem;
    font-weight: 800;
}

.hero-point span {
    color: rgba(247, 251, 236, 0.78);
    font-size: 0.84rem;
}

.btn-hero {
    min-height: 3.5rem;
    padding: 0 1.5rem;
    border-radius: 0.75rem;
    border: 0;
    background: linear-gradient(180deg, #ffffff 0%, #f1f8df 100%);
    color: #256122;
    box-shadow: 0 18px 32px rgba(42, 71, 16, 0.2);
}

.btn-hero:hover,
.btn-hero:focus {
    color: #1f511d;
    background: linear-gradient(180deg, #ffffff 0%, #ebf7d2 100%);
}

.hero-link {
    display: inline-flex;
    align-items: center;
    color: #ffffff;
    font-size: 0.96rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.hero-link:hover,
.hero-link:focus {
    color: #f7ffd5;
}

.hero-stage {
    min-height: 31rem;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.hero-stage--retail .hero-stage__visual {
    position: relative;
    min-height: 31rem;
    border-radius: 1.75rem;
}

.hero-stage__burst,
.hero-stage__mist,
.hero-stage__capsule,
.hero-stage__bowl {
    position: absolute;
}

.hero-stage__burst {
    top: 2.2rem;
    right: 15%;
    width: 18rem;
    height: 18rem;
    z-index: 0;
    border-radius: 50%;
    background:
        radial-gradient(circle at center, rgba(243, 255, 183, 0.54) 0, rgba(198, 226, 83, 0.22) 34%, transparent 66%),
        radial-gradient(circle at center, rgba(255, 255, 255, 0.18) 0 18%, transparent 18% 100%);
    box-shadow: 0 0 90px rgba(218, 250, 126, 0.24);
}

.hero-stage__mist {
    z-index: 0;
    border-radius: 50%;
    filter: blur(10px);
}

.hero-stage__mist--one {
    left: 20%;
    top: 8rem;
    width: 8rem;
    height: 8rem;
    background: rgba(218, 247, 143, 0.18);
}

.hero-stage__mist--two {
    right: 6%;
    bottom: 7rem;
    width: 6rem;
    height: 6rem;
    background: rgba(255, 232, 147, 0.24);
}

.hero-stage__bowl {
    right: 22%;
    top: 5rem;
    width: 12rem;
    height: 7.4rem;
    z-index: 1;
    border-radius: 48% 48% 42% 42% / 35% 35% 65% 65%;
    background: linear-gradient(180deg, #fff8ec 0%, #f2dfb7 58%, #d7b57a 100%);
    box-shadow: 0 18px 36px rgba(89, 70, 22, 0.18);
    transform: rotate(-8deg);
}

.hero-stage__bowl::before {
    content: "";
    position: absolute;
    inset: -0.5rem 0.95rem auto;
    height: 1.6rem;
    border-radius: 999px;
    background: linear-gradient(180deg, #fffdf6, #eadfc7);
    box-shadow: inset 0 -4px 8px rgba(173, 141, 83, 0.18);
}

.hero-stage__capsule {
    right: 12%;
    top: 3.9rem;
    width: 4.9rem;
    height: 1.8rem;
    z-index: 2;
    border-radius: 999px;
    background: linear-gradient(90deg, #f9f0de 0 50%, #dfc8a6 50% 100%);
    box-shadow: 0 10px 18px rgba(100, 79, 31, 0.18);
    transform: rotate(33deg);
}

.hero-stage__base {
    position: absolute;
    right: 4.2rem;
    bottom: 1.25rem;
    width: 20rem;
    height: 2.45rem;
    border-radius: 999px 999px 1rem 1rem;
    background: linear-gradient(180deg, #c9985d, #8b5d2f);
    box-shadow: 0 18px 28px rgba(90, 58, 18, 0.2);
}

.hero-stage--retail .hero-bottle {
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    color: #222c26;
}

.hero-bottle__label {
    text-align: center;
}

.hero-bottle__label strong {
    display: block;
    font-size: 0.95rem;
    line-height: 1.15;
    letter-spacing: -0.02em;
}

.hero-bottle__label small {
    display: block;
    margin-top: 0.6rem;
    color: rgba(35, 43, 38, 0.78);
    font-size: 0.82rem;
    font-weight: 700;
}

.hero-bottle--omega {
    left: 6%;
    bottom: 2.4rem;
    width: 8.7rem;
    height: 18rem;
    color: #eef6ef;
    background: linear-gradient(180deg, #196b38, #0d4724);
}

.hero-bottle--omega::before {
    background: linear-gradient(180deg, #155c31, #0c3d1f);
}

.hero-bottle--omega .hero-bottle__label small {
    color: rgba(239, 246, 239, 0.72);
}

.hero-bottle--d3 {
    left: 31%;
    bottom: 1.6rem;
    width: 12.5rem;
    height: 23rem;
    background: linear-gradient(180deg, #ffffff, #f3e7cd);
}

.hero-bottle--d3::before {
    background: linear-gradient(180deg, #f0eee6, #d9d4c9);
}

.hero-bottle--d3 .hero-bottle__label strong {
    font-size: 1.05rem;
}

.hero-bottle--multi {
    left: 58%;
    bottom: 2rem;
    width: 9rem;
    height: 18.6rem;
    background: linear-gradient(180deg, #96510d, #c3832a 42%, #f1ddbf);
}

.hero-bottle--multi::before {
    background: linear-gradient(180deg, #221f1b, #0f0d0b);
}

.hero-bottle--immune {
    right: 2%;
    bottom: 2.2rem;
    width: 8rem;
    height: 16.9rem;
    color: #f0ede7;
    background: linear-gradient(180deg, #2d221d, #140f0c);
}

.hero-bottle--immune::before {
    background: linear-gradient(180deg, #2a2420, #090807);
}

.hero-bottle--immune .hero-bottle__label small {
    color: rgba(240, 237, 231, 0.7);
}

.hero-leaf,
.hero-fruit {
    position: absolute;
    z-index: 1;
}

.hero-leaf {
    width: 2.2rem;
    height: 4.4rem;
    border-radius: 50% 0 50% 0;
    background: linear-gradient(160deg, #6da73d, #95c85f);
    transform: rotate(32deg);
    box-shadow: 0 14px 26px rgba(91, 136, 41, 0.18);
}

.hero-leaf--one {
    left: 18%;
    top: 4.2rem;
}

.hero-leaf--two {
    left: 49%;
    top: 5.8rem;
    transform: rotate(-25deg);
}

.hero-leaf--three {
    right: 9%;
    top: 7rem;
}

.hero-fruit--orange {
    right: 8.6rem;
    bottom: 1.55rem;
    width: 6rem;
    height: 6rem;
    border-radius: 50%;
    background:
        radial-gradient(circle at center, rgba(255, 220, 110, 0.95) 0, rgba(255, 196, 66, 0.95) 40%, rgba(255, 145, 20, 0.98) 100%);
    border: 0.5rem solid rgba(255, 233, 190, 0.9);
    box-shadow: 0 10px 20px rgba(199, 131, 42, 0.2);
}

.hero-fruit--berry {
    right: 0.8rem;
    bottom: 1.5rem;
    width: 5.2rem;
    height: 3rem;
    background:
        radial-gradient(circle at 18% 50%, #204d72 0 0.65rem, transparent 0.7rem),
        radial-gradient(circle at 44% 65%, #2b6a97 0 0.6rem, transparent 0.65rem),
        radial-gradient(circle at 68% 42%, #87213e 0 0.65rem, transparent 0.7rem),
        radial-gradient(circle at 88% 58%, #bc2f5a 0 0.7rem, transparent 0.75rem);
}

.hero-fruit--leaf {
    right: 0.2rem;
    bottom: 2.55rem;
    width: 3.4rem;
    height: 2rem;
    border-radius: 60% 0 60% 0;
    background: linear-gradient(160deg, #6fba4a, #2f7f29);
    transform: rotate(-18deg);
}

.hero-assurance {
    position: relative;
    z-index: 4;
    margin-top: -1.55rem;
    padding: 0 0 1.4rem;
}

.hero-assurance__bar {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    padding: 1rem 1.3rem;
    border: 1px solid rgba(174, 190, 142, 0.28);
    border-radius: 1.15rem;
    background: rgba(255, 252, 245, 0.96);
    box-shadow: 0 18px 40px rgba(53, 72, 18, 0.1);
}

.hero-assurance__item {
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

.hero-assurance__item .icon {
    width: 1.5rem;
    height: 1.5rem;
    color: #78a741;
}

.hero-assurance__item strong {
    display: block;
    color: #213026;
    font-size: 0.95rem;
    font-weight: 800;
}

.hero-assurance__item span {
    color: var(--ink-700);
    font-size: 0.9rem;
}

.section-shell--categories {
    padding-top: 2rem;
    padding-bottom: 2.2rem;
}

.section-heading--catalog {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
}

.section-heading--catalog .section-title {
    grid-column: 2;
    max-width: none;
    margin: 0;
    font-size: clamp(1.9rem, 2.8vw, 2.45rem);
    text-align: center;
}

.section-heading--catalog .section-link {
    grid-column: 3;
    justify-self: end;
    font-size: 0.95rem;
}

.category-card--compact {
    position: relative;
    align-items: center;
    justify-content: center;
    min-height: 9rem;
    gap: 0.85rem;
    padding: 1.1rem 0.85rem;
    border-radius: 1rem;
    box-shadow: none;
    text-align: center;
}

.category-card--compact .category-card__icon {
    width: 4rem;
    height: 4rem;
    background: linear-gradient(180deg, #f7faf4, #eef4ea);
}

.category-card--compact .icon {
    width: 1.9rem;
    height: 1.9rem;
}

.category-card--compact h3 {
    font-size: 0.94rem;
    line-height: 1.3;
}

.service-strip {
    padding-bottom: 3rem;
}

.service-card {
    display: flex;
    align-items: center;
    gap: 1rem;
    min-height: 5.2rem;
    padding: 1.25rem 1.4rem;
    border: 1px solid rgba(18, 23, 20, 0.06);
    border-radius: 1.1rem;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 248, 244, 0.94));
    box-shadow: 0 10px 22px rgba(17, 36, 23, 0.04);
}

.service-card__icon {
    display: inline-grid;
    place-items: center;
    width: 3.25rem;
    height: 3.25rem;
    border-radius: 50%;
    background: #f5f7f2;
    color: #1d241f;
}

.service-card__icon .icon {
    width: 1.4rem;
    height: 1.4rem;
}

.service-card strong {
    display: block;
    font-size: 1.04rem;
    font-weight: 800;
}

.service-card p {
    margin: 0.2rem 0 0;
    color: var(--ink-700);
    line-height: 1.5;
}

.product-card,
.testimonial-card,
.brand-chip {
    box-shadow: 0 14px 30px rgba(17, 36, 23, 0.05);
}

.product-card__media {
    min-height: 13.8rem;
}

.deal-banner {
    border-radius: 1.6rem;
}

@media (max-width: 1199.98px) {
    .header-actions--mobile {
        gap: 1rem;
    }

    .header-action {
        padding: 0.3rem 0;
    }

    .hero-shell {
        border-top: 1px solid rgba(161, 189, 129, 0.26);
        border-radius: 1.4rem;
    }

    .hero-scene--burst {
        width: 66%;
        right: -2rem;
    }
}

@media (max-width: 991.98px) {
    .hero-shell {
        padding: 2rem 1.8rem 2.35rem;
    }

    .hero-scene--curve {
        bottom: 4.2rem;
    }

    .hero-scene--base {
        height: 5.8rem;
    }

    .hero-brandlockup {
        margin-bottom: 0.85rem;
    }

    .hero-stage {
        min-height: 26rem;
    }

    .hero-stage--retail .hero-stage__visual {
        min-height: 25.6rem;
        margin-top: 0.5rem;
    }

    .hero-stage__burst {
        right: 18%;
        width: 15rem;
        height: 15rem;
    }

    .hero-stage__bowl {
        right: 21%;
        width: 10rem;
        height: 6.2rem;
    }

    .hero-stage__capsule {
        right: 12%;
        top: 4.2rem;
    }

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

    .section-heading--catalog {
        grid-template-columns: 1fr;
        justify-items: center;
        gap: 0.9rem;
    }

    .section-heading--catalog .section-title,
    .section-heading--catalog .section-link {
        grid-column: auto;
        justify-self: center;
    }
}

@media (max-width: 767.98px) {
    .brand-copy strong {
        font-size: 1.35rem;
    }

    .brand-copy small {
        font-size: 0.8rem;
    }

    .brand-mark-shell {
        width: 5.75rem;
        height: 5rem;
    }

    .brand-mark {
        width: 5.35rem;
    }

    .hero-brandlockup {
        gap: 0.75rem;
    }

    .hero-brandlockup strong {
        font-size: 1.18rem;
    }

    .hero-brandlockup div > span {
        font-size: 0.8rem;
    }

    .hero-kicker {
        font-size: 0.72rem;
        letter-spacing: 0.13em;
    }

    .hero-copy h1 {
        font-size: 2.95rem;
    }

    .hero-benefits {
        margin-top: 1.2rem;
    }

    .hero-point {
        min-height: auto;
    }

    .hero-stage--retail .hero-stage__visual {
        min-height: 20.5rem;
    }

    .hero-stage__burst {
        right: 22%;
        top: 2.8rem;
        width: 11rem;
        height: 11rem;
    }

    .hero-stage__bowl {
        right: 24%;
        top: 4.8rem;
        width: 7.5rem;
        height: 4.75rem;
    }

    .hero-stage__capsule {
        right: 16%;
        top: 4rem;
        width: 3.6rem;
        height: 1.3rem;
    }

    .hero-stage__base {
        right: 3rem;
        width: 14rem;
        height: 1.8rem;
    }

    .hero-bottle--omega {
        left: 4%;
        width: 6.6rem;
        height: 13.5rem;
    }

    .hero-bottle--d3 {
        left: 28%;
        width: 9rem;
        height: 17rem;
    }

    .hero-bottle--multi {
        left: 57%;
        width: 6.8rem;
        height: 13.8rem;
    }

    .hero-bottle--immune {
        right: 1%;
        width: 6rem;
        height: 12.8rem;
    }

    .hero-bottle__label strong {
        font-size: 0.72rem;
    }

    .hero-bottle__label small {
        margin-top: 0.35rem;
        font-size: 0.64rem;
    }

    .hero-fruit--orange {
        right: 5rem;
        width: 4rem;
        height: 4rem;
    }

    .hero-fruit--berry {
        width: 4rem;
        height: 2.5rem;
    }

    .category-card--compact {
        min-height: 8.6rem;
    }

    .service-card {
        min-height: auto;
    }
}

@media (max-width: 575.98px) {
    .navbar {
        gap: 0.7rem;
    }

    .brand-mark {
        width: 4.95rem;
    }

    .brand-mark-shell {
        width: 5.35rem;
        height: 4.6rem;
    }

    .hero-shell {
        padding: 1.35rem 1.1rem 1.9rem;
    }

    .hero-scene--top {
        height: 2.35rem;
    }

    .hero-scene--curve {
        bottom: 3rem;
        height: 4.35rem;
    }

    .hero-scene--base {
        height: 4.3rem;
    }

    .hero-brandlockup {
        margin-bottom: 0.75rem;
    }

    .hero-brandlockup__mark {
        width: 2.5rem;
        height: 2.1rem;
    }

    .hero-copy h1 {
        font-size: 2.45rem;
    }

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

    .hero-stage--retail .hero-stage__visual {
        min-height: 16.8rem;
    }

    .hero-stage__burst {
        right: 24%;
        top: 3.1rem;
        width: 8.8rem;
        height: 8.8rem;
    }

    .hero-stage__bowl {
        right: 25%;
        top: 4.6rem;
        width: 5.8rem;
        height: 3.8rem;
    }

    .hero-stage__capsule {
        right: 15%;
        top: 4rem;
        width: 2.95rem;
        height: 1.05rem;
    }

    .hero-stage__base {
        right: 1.6rem;
        width: 10.2rem;
        bottom: 0.6rem;
    }

    .hero-bottle--omega {
        left: 1%;
        bottom: 1.2rem;
        width: 5rem;
        height: 10rem;
    }

    .hero-bottle--d3 {
        left: 25%;
        bottom: 0.8rem;
        width: 6.9rem;
        height: 12.8rem;
    }

    .hero-bottle--multi {
        left: 57%;
        bottom: 1rem;
        width: 5.1rem;
        height: 10.2rem;
    }

    .hero-bottle--immune {
        right: 0;
        bottom: 1.1rem;
        width: 4.6rem;
        height: 9.4rem;
    }

    .hero-fruit--orange {
        right: 3rem;
        bottom: 0.7rem;
        width: 3rem;
        height: 3rem;
        border-width: 0.28rem;
    }

    .hero-fruit--berry,
    .hero-fruit--leaf,
    .hero-leaf--three,
    .hero-stage__mist {
        display: none;
    }

    .hero-leaf--one,
    .hero-leaf--two {
        width: 1.4rem;
        height: 2.8rem;
    }

    .section-heading--catalog .section-title {
        font-size: 2rem;
    }
}

/* Final logo emphasis override */
.navbar-brand {
    position: relative;
    z-index: 2;
    gap: 0.95rem;
}

.brand-mark-shell {
    width: 8rem;
    height: 4.65rem;
    margin-top: -0.45rem;
    margin-bottom: -0.7rem;
    overflow: visible;
}

.brand-mark-shell::before {
    left: 1rem;
    right: 1rem;
    bottom: 0.15rem;
    height: 1rem;
    opacity: 0.64;
}

.brand-mark {
    width: 8.05rem;
    transform: translateY(-0.12rem) scale(1.01);
    filter:
        drop-shadow(0 1px 0 rgba(255, 255, 255, 0.94))
        drop-shadow(0 8px 10px rgba(17, 89, 43, 0.18))
        drop-shadow(0 16px 20px rgba(17, 89, 43, 0.1));
}

@media (max-width: 767.98px) {
    .brand-mark-shell {
        width: 6.45rem;
        height: 4.1rem;
        margin-top: -0.2rem;
        margin-bottom: -0.35rem;
    }

    .brand-mark {
        width: 6.55rem;
    }
}

@media (max-width: 575.98px) {
    .brand-mark-shell {
        width: 5.85rem;
        height: 3.9rem;
        margin-top: -0.1rem;
        margin-bottom: -0.2rem;
    }

    .brand-mark {
        width: 5.95rem;
    }
}

/* Footer clarity and final surface polish */
.footer-brand {
    align-items: center;
    gap: 1.1rem;
}

.footer-mark {
    width: 4.45rem;
    flex: 0 0 auto;
    transform: translateZ(0);
    backface-visibility: hidden;
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
    filter:
        contrast(1.06)
        saturate(1.04)
        drop-shadow(0 1px 0 rgba(255, 255, 255, 0.1))
        drop-shadow(0 10px 18px rgba(0, 0, 0, 0.2));
}

.footer-brand p {
    max-width: 24rem;
    line-height: 1.72;
}

.footer-links a {
    transition: color var(--transition), opacity var(--transition);
}

.footer-links a:hover,
.footer-links a:focus-visible {
    color: rgba(255, 255, 255, 0.92);
}

.hero-copy h1,
.section-title,
.newsletter-card h2,
.deal-banner h2,
.page-hero__content h1 {
    text-wrap: balance;
}

.category-card,
.product-card,
.service-card,
.deal-card,
.brand-chip,
.testimonial-card,
.filter-panel,
.content-card,
.summary-card,
.auth-card,
.cart-surface,
.account-intro,
.newsletter-card {
    transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition), background-color var(--transition);
}

.product-card,
.category-card,
.brand-chip,
.testimonial-card,
.service-card,
.filter-panel,
.content-card,
.summary-card,
.auth-card,
.cart-surface,
.account-intro,
.newsletter-card {
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.72),
        0 14px 30px rgba(17, 36, 23, 0.05);
}

.product-card:hover,
.category-card:hover,
.brand-chip:hover,
.testimonial-card:hover,
.service-card:hover {
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.76),
        0 18px 38px rgba(17, 36, 23, 0.08);
}

@media (max-width: 575.98px) {
    .footer-brand {
        align-items: flex-start;
    }

    .footer-mark {
        width: 4.05rem;
    }

    .account-dashboard__grid {
        grid-template-columns: 1fr;
    }
}

/* Premium ayurvedic hero carousel */
.hero-carousel {
    position: relative;
    overflow: visible;
}

.hero-carousel .carousel-inner,
.hero-carousel .carousel-item {
    border-radius: 0 0 1.55rem 1.55rem;
}

.hero-shell--banner-slide {
    height: clamp(25rem, 31vw, 28rem);
    min-height: 0;
    padding: clamp(1.4rem, 2vw, 2rem) clamp(1.3rem, 2.7vw, 3rem) 2.85rem;
    border: 0;
    border-radius: 0 0 1.55rem 1.55rem;
    background-color: #3f8616;
    background-image:
        linear-gradient(90deg, rgba(8, 50, 18, 0.9) 0%, rgba(12, 76, 20, 0.78) 25%, rgba(20, 98, 25, 0.32) 50%, rgba(17, 76, 17, 0.05) 74%),
        linear-gradient(180deg, rgba(18, 65, 12, 0.92) 0, rgba(18, 65, 12, 0.34) 3.4rem, rgba(18, 65, 12, 0) 8.5rem),
        var(--hero-banner);
    background-position: center, top center, center right;
    background-size: cover, 100% 100%, cover;
    background-repeat: no-repeat;
    box-shadow: 0 26px 54px rgba(42, 71, 16, 0.16);
}

.hero-shell--banner-slide::before {
    content: "";
    position: absolute;
    inset: auto -2% 0;
    height: 22%;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0), rgba(254, 241, 217, 0.58) 52%, rgba(238, 121, 18, 0.42));
}

.hero-shell__scrim {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background:
        radial-gradient(circle at 36% 8%, rgba(255, 255, 216, 0.22), transparent 30%),
        linear-gradient(90deg, rgba(0, 0, 0, 0.14), transparent 42%);
}

.hero-shell__layout {
    position: relative;
    z-index: 2;
    min-height: calc(100% - 1rem);
}

.hero-copy--banner {
    max-width: 37rem;
    text-shadow: 0 12px 28px rgba(15, 52, 13, 0.2);
}

.hero-shell__layout > .col-lg-5 {
    width: 53%;
}

.hero-shell__layout > .col-lg-7 {
    width: 47%;
}

.hero-brand-scene {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    min-height: 100%;
    height: 100%;
    overflow: visible;
}

.hero-brand-scene__artwork {
    display: block;
    width: min(100%, 46rem);
    max-width: 100%;
    height: auto;
    margin-left: auto;
    filter: drop-shadow(0 30px 44px rgba(12, 34, 12, 0.2));
}

.hero-brand-scene__mist {
    position: absolute;
    border-radius: 999px;
    filter: blur(10px);
    opacity: 0.82;
}

.hero-brand-scene__mist--one {
    right: 9%;
    bottom: 4.5rem;
    width: 15rem;
    height: 5.5rem;
    background: radial-gradient(circle, rgba(255, 249, 204, 0.42), rgba(255, 249, 204, 0));
}

.hero-brand-scene__mist--two {
    right: 21%;
    bottom: 12rem;
    width: 10rem;
    height: 10rem;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.28), rgba(255, 255, 255, 0));
}

.hero-brand-scene__pack {
    position: absolute;
    pointer-events: none;
}

.hero-brand-scene__pack--1 {
    right: 2rem;
    bottom: 1.2rem;
    width: clamp(8.8rem, 17vw, 11.8rem);
    z-index: 3;
    transform: rotate(-2deg);
}

.hero-brand-scene__pack--2 {
    right: 11.4rem;
    bottom: 2rem;
    width: clamp(7.1rem, 13vw, 9.2rem);
    z-index: 2;
    transform: rotate(5deg);
}

.hero-brand-scene__pack--3 {
    right: 18.4rem;
    bottom: 1.1rem;
    width: clamp(8.6rem, 14vw, 10.6rem);
    z-index: 1;
    transform: rotate(-7deg);
}

.hero-copy--banner .hero-brandlockup {
    display: flex;
    width: fit-content;
    margin-bottom: 0.72rem;
}

.hero-copy--banner .hero-brandlockup strong {
    color: #ffffff;
    font-size: clamp(1.25rem, 1.8vw, 1.65rem);
}

.hero-copy--banner .hero-brandlockup div > span {
    color: rgba(255, 255, 255, 0.86);
}

.hero-copy--banner .hero-kicker {
    padding: 0.34rem 0.78rem;
    border-color: rgba(255, 255, 255, 0.2);
    background: rgba(16, 61, 8, 0.36);
    color: #f5ffd5;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

.hero-copy--banner h1 {
    max-width: 15ch;
    margin: 0.76rem 0 0.66rem;
    color: #ffffff;
    font-size: clamp(2.35rem, 3.55vw, 3.45rem);
    line-height: 0.96;
    letter-spacing: -0.04em;
}

.hero-copy--banner h1 span {
    color: #f7ffd9;
}

.hero-copy--banner .hero-lead {
    max-width: 31rem;
    margin-bottom: 0;
    color: rgba(255, 255, 255, 0.9);
    font-size: 0.96rem;
    line-height: 1.58;
}

.hero-keywords {
    display: none;
    flex-wrap: wrap;
    gap: 0.55rem;
    max-width: 37rem;
    margin-top: 0.82rem;
}

.hero-keyword {
    display: inline-flex;
    align-items: center;
    gap: 0.42rem;
    min-height: 2.15rem;
    padding: 0.38rem 0.66rem;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 999px;
    color: rgba(255, 255, 255, 0.9);
    background: rgba(10, 54, 13, 0.28);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(12px);
    font-size: 0.76rem;
    font-weight: 700;
    line-height: 1.15;
}

.hero-keyword .icon {
    width: 1rem;
    height: 1rem;
    color: #eaffbf;
}

.hero-copy--banner .hero-actions {
    margin-top: 1rem;
    align-items: center;
}

.hero-copy--banner .btn-hero {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.74rem;
    min-height: 3.05rem;
    padding: 0.34rem 0.42rem 0.34rem 1.18rem;
    border: 1px solid rgba(255, 255, 255, 0.82);
    border-radius: 999px;
    color: var(--green-900);
    background:
        linear-gradient(180deg, #ffffff 0%, #f4f9e6 100%);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.95),
        0 14px 30px rgba(19, 58, 18, 0.22);
    letter-spacing: 0;
    white-space: nowrap;
}

.hero-copy--banner .btn-hero:hover,
.hero-copy--banner .btn-hero:focus-visible {
    color: var(--green-950);
    background: linear-gradient(180deg, #ffffff 0%, #eff8dc 100%);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.96),
        0 18px 34px rgba(19, 58, 18, 0.27);
}

.hero-copy--banner .btn-hero .icon {
    display: grid;
    place-items: center;
    width: 2.05rem;
    height: 2.05rem;
    padding: 0.52rem;
    border-radius: 50%;
    color: #ffffff;
    background: linear-gradient(135deg, var(--green-900), var(--green-700));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.22),
        0 8px 16px rgba(13, 79, 33, 0.24);
    transition: transform var(--transition), box-shadow var(--transition);
}

.hero-copy--banner .btn-hero:hover .icon,
.hero-copy--banner .btn-hero:focus-visible .icon {
    transform: translateX(0.12rem);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.24),
        0 10px 18px rgba(13, 79, 33, 0.3);
}

.hero-copy--banner .hero-link {
    color: rgba(255, 255, 255, 0.92);
}

.hero-slide-spacer {
    min-height: 23rem;
}

.hero-carousel__footer {
    position: absolute;
    left: clamp(1.1rem, 2.2vw, 2rem);
    right: clamp(1.1rem, 2.2vw, 2rem);
    bottom: 0.38rem;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    pointer-events: none;
}

.hero-carousel__indicators {
    position: static;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.52rem;
    margin: 0;
    pointer-events: auto;
}

.hero-carousel__indicators [data-bs-target] {
    display: grid;
    place-items: center;
    width: 3rem;
    height: 3rem;
    margin: 0;
    border: 0.18rem solid rgba(255, 255, 255, 0.86);
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 12px 24px rgba(18, 45, 18, 0.18);
    color: var(--green-900);
    opacity: 0.82;
    text-indent: 0;
    transition: transform var(--transition), opacity var(--transition), box-shadow var(--transition), background-color var(--transition);
}

.hero-carousel__indicators [data-bs-target]::before,
.hero-carousel__indicators [data-bs-target]::after {
    display: none;
}

.hero-carousel__indicators [data-bs-target] .icon {
    width: 1.35rem;
    height: 1.35rem;
}

.hero-carousel__indicators [data-bs-target].active {
    background: #ffffff;
    color: var(--green-900);
    opacity: 1;
    transform: translateY(-0.1rem) scale(1.05);
    box-shadow: 0 14px 28px rgba(18, 45, 18, 0.24), 0 0 0 0.22rem rgba(255, 255, 255, 0.24);
}

.hero-carousel__controls {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    pointer-events: auto;
}

.hero-carousel__control {
    position: static;
    display: grid;
    place-items: center;
    width: 2.68rem;
    height: 2.68rem;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 50%;
    color: #ffffff;
    background: rgba(9, 58, 14, 0.3);
    opacity: 1;
    backdrop-filter: blur(12px);
    transition: transform var(--transition), background-color var(--transition), border-color var(--transition);
}

.hero-carousel__control:hover,
.hero-carousel__control:focus-visible {
    border-color: rgba(255, 255, 255, 0.34);
    background: rgba(9, 58, 14, 0.5);
    transform: translateY(-1px);
}

.hero-carousel__arrow {
    display: block;
    margin-top: -0.08rem;
    font-size: 2.1rem;
    font-weight: 300;
    line-height: 1;
}

.hero-assurance__bar {
    gap: 0.8rem;
}

.hero-assurance__item {
    min-width: 0;
}

.hero-assurance__item .icon {
    flex: 0 0 auto;
}

.hero-assurance__item strong,
.hero-assurance__item span {
    overflow: hidden;
    text-overflow: ellipsis;
}

.category-card--compact {
    min-height: 7.85rem;
    gap: 0.62rem;
    padding: 0.92rem 0.68rem;
}

.category-card--compact .category-card__icon {
    width: 3.45rem;
    height: 3.45rem;
}

.category-card--compact .icon {
    width: 1.55rem;
    height: 1.55rem;
}

.category-card--compact h3 {
    max-width: 100%;
    font-size: 0.82rem;
    line-height: 1.16;
    text-wrap: balance;
}

@media (min-width: 1200px) {
    .category-card--compact h3 {
        font-size: 0.78rem;
        white-space: nowrap;
    }
}

@media (max-width: 1199.98px) {
    .hero-shell--banner-slide {
        border-radius: 1.4rem;
    }

    .hero-carousel .carousel-inner,
    .hero-carousel .carousel-item {
        border-radius: 1.4rem;
    }
}

@media (max-width: 991.98px) {
    .hero-shell--banner-slide {
        min-height: 31rem;
        padding: 2rem 1.55rem 5.15rem;
        background-position: center, top center, 68% center;
        background-image:
            linear-gradient(90deg, rgba(8, 50, 18, 0.92) 0%, rgba(12, 76, 20, 0.78) 42%, rgba(20, 98, 25, 0.3) 100%),
            linear-gradient(180deg, rgba(18, 65, 12, 0.88) 0, rgba(18, 65, 12, 0.26) 4rem, rgba(18, 65, 12, 0) 9rem),
            var(--hero-banner);
    }

    .hero-shell__layout {
        min-height: auto;
    }

    .hero-shell__layout .col-lg-7 {
        display: none;
    }

    .hero-copy--banner h1 {
        max-width: 11.5ch;
        font-size: clamp(2.45rem, 8vw, 3.6rem);
    }
}

@media (max-width: 767.98px) {
    .hero-shell--banner-slide {
        min-height: 34rem;
        padding: 1.65rem 1.15rem 5.05rem;
        background-position: center, top center, 61% center;
    }

    .hero-copy--banner .hero-brandlockup {
        gap: 0.65rem;
    }

    .hero-keywords {
        gap: 0.45rem;
    }

    .hero-keyword {
        min-height: 2.1rem;
        padding: 0.4rem 0.62rem;
        font-size: 0.76rem;
    }
}

@media (max-width: 575.98px) {
    .hero-section {
        padding-inline: 0.55rem;
    }

    .hero-shell--banner-slide {
        height: 34.5rem;
        min-height: 0;
        padding: 1.2rem 1rem 4.8rem;
        background-position: center, top center, 57% center;
        border-radius: 1.15rem;
    }

    .hero-carousel .carousel-inner,
    .hero-carousel .carousel-item {
        border-radius: 1.15rem;
    }

    .hero-copy--banner .hero-kicker {
        font-size: 0.68rem;
        letter-spacing: 0.12em;
    }

    .hero-copy--banner .hero-brandlockup {
        margin-bottom: 0.55rem;
    }

    .hero-copy--banner .hero-brandlockup div > span,
    .hero-copy--banner .hero-keywords,
    .hero-copy--banner .hero-link {
        display: none;
    }

    .hero-copy--banner h1 {
        max-width: 11ch;
        margin-top: 0.72rem;
        font-size: clamp(2.1rem, 10.4vw, 2.72rem);
    }

    .hero-copy--banner .hero-lead {
        max-width: 17.5rem;
        font-size: 0.9rem;
        line-height: 1.54;
    }

    .hero-copy--banner .hero-actions {
        align-items: stretch;
        gap: 0;
        margin-top: 0.82rem;
    }

    .hero-copy--banner .hero-actions .btn {
        justify-content: center;
        width: auto;
        min-width: 10.8rem;
        min-height: 2.8rem;
        padding-inline: 1rem;
        white-space: nowrap;
    }

    .hero-carousel__footer {
        left: 0.95rem;
        right: 0.95rem;
        bottom: 0.9rem;
        align-items: flex-end;
    }

    .hero-carousel__indicators {
        gap: 0.46rem;
    }

    .hero-carousel__indicators [data-bs-target] {
        width: 2.7rem;
        height: 2.7rem;
    }

    .hero-carousel__indicators [data-bs-target] .icon {
        width: 1.1rem;
        height: 1.1rem;
    }

    .hero-carousel__control {
        width: 2.45rem;
        height: 2.45rem;
    }
}

/* Storefront professional polish pass */
:root {
    --surface: rgba(255, 255, 255, 0.92);
    --surface-solid: #ffffff;
    --surface-soft: #f7faf3;
    --green-ring: rgba(17, 89, 43, 0.16);
    --shadow-card: 0 18px 42px rgba(17, 36, 23, 0.08);
    --shadow-card-hover: 0 22px 54px rgba(17, 36, 23, 0.12);
}

body {
    background:
        radial-gradient(circle at 8% 0%, rgba(45, 140, 80, 0.08), transparent 23rem),
        linear-gradient(180deg, #fcfdf9 0%, #f6f9f1 48%, #fbfaf6 100%);
    overflow-x: clip;
    overflow-y: visible;
}

.site-header {
    box-shadow: 0 10px 30px rgba(17, 36, 23, 0.06);
}

.header-main {
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(18px);
}

.header-search {
    background: #ffffff;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.9),
        0 12px 28px rgba(17, 36, 23, 0.06);
    transition: border-color var(--transition), box-shadow var(--transition), transform var(--transition);
}

.header-search:focus-within {
    border-color: rgba(17, 89, 43, 0.24);
    box-shadow:
        0 0 0 0.24rem rgba(17, 89, 43, 0.08),
        0 16px 34px rgba(17, 36, 23, 0.08);
}

.header-action,
.catalog-links a {
    border-radius: 0.82rem;
}

.catalog-links a {
    position: relative;
    padding-inline: 0.78rem;
}

.catalog-links a.active {
    background: rgba(17, 89, 43, 0.08);
}

.catalog-links a.active::after,
.catalog-links a:hover::after {
    content: "";
    position: absolute;
    left: 0.82rem;
    right: 0.82rem;
    bottom: 0.24rem;
    height: 0.12rem;
    border-radius: 999px;
    background: currentColor;
    opacity: 0.42;
}

.section-shell {
    padding: clamp(3.6rem, 6vw, 4.65rem) 0;
}

.section-heading {
    margin-bottom: clamp(1.45rem, 3vw, 2rem);
}

.section-title {
    max-width: 24ch;
    font-size: clamp(1.85rem, 3.25vw, 2.65rem);
    line-height: 1.02;
    letter-spacing: -0.035em;
}

.section-title--wide {
    max-width: 28ch;
}

.section-link {
    display: inline-flex;
    align-items: center;
    min-height: 2.35rem;
    padding: 0 0.85rem;
    border-radius: 999px;
    background: rgba(17, 89, 43, 0.07);
    transition: color var(--transition), background-color var(--transition), transform var(--transition);
}

.section-link:hover,
.section-link:focus-visible {
    background: rgba(17, 89, 43, 0.11);
    transform: translateY(-1px);
}

.section-soft {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.82), rgba(240, 248, 239, 0.92));
}

.category-card--compact,
.service-card,
.product-card,
.brand-chip,
.testimonial-card {
    border: 1px solid rgba(18, 23, 20, 0.07);
    background: var(--surface);
    box-shadow: var(--shadow-card);
}

.category-card--compact {
    overflow: hidden;
}

.category-card--compact::after {
    content: "";
    position: absolute;
    inset: auto 12% 0;
    height: 0.18rem;
    border-radius: 999px 999px 0 0;
    background: linear-gradient(90deg, transparent, rgba(17, 89, 43, 0.34), transparent);
    opacity: 0;
    transition: opacity var(--transition);
}

.category-card--compact:hover,
.category-card--compact:focus-visible {
    border-color: rgba(17, 89, 43, 0.13);
    transform: translateY(-0.18rem);
    box-shadow: var(--shadow-card-hover);
}

.category-card--compact:hover::after,
.category-card--compact:focus-visible::after {
    opacity: 1;
}

.category-card--compact .category-card__icon,
.service-card__icon {
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.92),
        0 10px 22px rgba(17, 89, 43, 0.08);
}

.category-card--compact h3 {
    color: #1e2a22;
    font-weight: 850;
}

.service-strip {
    padding-bottom: clamp(2.3rem, 4vw, 3.3rem);
}

.service-card {
    border-radius: 1.05rem;
}

.service-card strong {
    letter-spacing: -0.01em;
}

.product-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    border-radius: 1.15rem;
}

.product-card__media {
    min-height: 12.9rem;
    border-radius: 1.15rem 1.15rem 0 0;
}

.product-card__topline {
    align-items: center;
}

.badge-soft {
    min-height: 2rem;
    padding: 0.38rem 0.68rem;
    letter-spacing: 0.06em;
}

.wishlist-button {
    border: 1px solid rgba(17, 89, 43, 0.1);
    background: rgba(255, 255, 255, 0.86);
    box-shadow: 0 10px 20px rgba(17, 36, 23, 0.07);
}

.product-card__body {
    padding: 1.25rem;
}

.product-card__meta,
.product-rating,
.product-price {
    align-items: center;
}

.product-card__title {
    min-height: 2.65rem;
    margin: 0.72rem 0 0.48rem;
    font-size: 1.12rem;
    line-height: 1.18;
    letter-spacing: -0.02em;
}

.product-card__copy {
    display: -webkit-box;
    min-height: 3.15rem;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-height: 1.58;
}

.product-highlights {
    min-height: 3.05rem;
    margin-top: 0.85rem;
}

.product-card__footer {
    padding-top: 1rem;
    border-top: 1px solid rgba(18, 23, 20, 0.06);
}

.product-card__actions {
    gap: 0.58rem;
}

.product-card__actions .btn {
    min-height: 2.68rem;
    padding-inline: 0.75rem;
    font-size: 0.88rem;
    white-space: nowrap;
}

.btn-brand {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0)),
        linear-gradient(135deg, var(--green-900), var(--green-700));
}

.btn-outline-brand {
    background: rgba(255, 255, 255, 0.94);
    box-shadow: inset 0 0 0 1px rgba(17, 89, 43, 0.04);
}

.deal-banner,
.newsletter-card {
    border: 1px solid rgba(255, 255, 255, 0.13);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        0 24px 56px rgba(17, 36, 23, 0.14);
}

.deal-card {
    border: 1px solid rgba(255, 255, 255, 0.14);
}

.brand-chip {
    min-height: 7rem;
    justify-content: center;
    border-radius: 1rem;
}

.brand-chip strong {
    letter-spacing: -0.02em;
}

.testimonial-card {
    border-radius: 1rem;
}

.testimonial-card p {
    line-height: 1.65;
}

.newsletter-form .form-control {
    min-height: 3.25rem;
    border-radius: 0.9rem;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

.site-footer {
    background:
        linear-gradient(180deg, #102819 0%, #0a1c11 100%);
}

.footer-notice {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    max-width: 70rem;
    margin: 0 auto 0.8rem;
    padding: 0.58rem 0.9rem;
    border: 1px solid rgba(255, 204, 92, 0.18);
    border-radius: 0.95rem;
    background: linear-gradient(180deg, rgba(255, 242, 198, 0.08) 0%, rgba(255, 212, 94, 0.05) 100%);
    color: #fff1c4;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
    text-align: center;
}

.footer-notice span {
    color: rgba(255, 247, 229, 0.94);
    font-size: 0.84rem;
    line-height: 1.46;
}

.footer-main {
    padding-top: 0.25rem;
}

.site-footer h3 {
    font-size: 0.95rem;
    letter-spacing: 0.02em;
}

.footer-group summary {
    margin-bottom: 0.9rem;
    color: rgba(255, 255, 255, 0.96);
    font-size: 0.95rem;
    letter-spacing: 0.02em;
}

.footer-links li + li {
    margin-top: 0.58rem;
}

.footer-links {
    margin: 0;
    padding: 0;
}

.footer-links a {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.92rem;
    line-height: 1.5;
}

.visual-story-section {
    position: relative;
    overflow: hidden;
    padding-top: clamp(3.1rem, 5vw, 4.4rem);
    background:
        linear-gradient(180deg, rgba(251, 250, 246, 0), rgba(240, 248, 239, 0.72) 46%, rgba(251, 250, 246, 0));
}

.visual-story-section::before,
.visual-story-section::after {
    content: "";
    position: absolute;
    pointer-events: none;
    opacity: 0.55;
}

.visual-story-section::before {
    right: max(1rem, calc((100vw - 1140px) / 2));
    top: 2.2rem;
    width: 13rem;
    height: 13rem;
    border: 1px solid rgba(17, 89, 43, 0.1);
    border-radius: 42% 58% 52% 48%;
    background:
        linear-gradient(135deg, rgba(17, 89, 43, 0.08), rgba(255, 255, 255, 0)),
        repeating-linear-gradient(135deg, rgba(17, 89, 43, 0.07) 0 1px, transparent 1px 12px);
}

.visual-story-section::after {
    left: max(1rem, calc((100vw - 1140px) / 2));
    bottom: 2.4rem;
    width: 10rem;
    height: 6rem;
    border-radius: 50% 0 50% 0;
    background: linear-gradient(135deg, rgba(128, 176, 67, 0.14), rgba(244, 163, 28, 0.08));
    transform: rotate(-8deg);
}

.visual-story-card {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(18, 23, 20, 0.07);
    border-radius: 1.35rem;
    background: rgba(255, 255, 255, 0.94);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.72),
        0 20px 46px rgba(17, 36, 23, 0.08);
    transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition);
}

.visual-story-card:hover {
    transform: translateY(-0.22rem);
    border-color: rgba(17, 89, 43, 0.14);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.74),
        0 26px 62px rgba(17, 36, 23, 0.13);
}

.visual-story-card__media {
    position: relative;
    overflow: hidden;
    aspect-ratio: 4 / 3;
    background: #eef5e7;
}

.visual-story-card__media::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0) 48%, rgba(7, 34, 15, 0.38) 100%);
    pointer-events: none;
}

.visual-story-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.01);
    transition: transform 0.45s ease;
}

.visual-story-card:hover .visual-story-card__media img {
    transform: scale(1.045);
}

.visual-story-card__pack {
    position: absolute;
    right: 1rem;
    bottom: 1rem;
    z-index: 2;
    pointer-events: none;
}

.visual-story-card__packshot.brand-packshot--bottle {
    width: 5.7rem;
}

.visual-story-card__packshot.brand-packshot--pouch {
    width: 6.35rem;
}

.visual-story-card__badge {
    position: absolute;
    left: 1rem;
    bottom: 1rem;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    min-height: 2.25rem;
    padding: 0 0.78rem;
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: 999px;
    color: #ffffff;
    background: rgba(9, 48, 19, 0.5);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14);
    backdrop-filter: blur(12px);
    font-size: 0.78rem;
    font-weight: 850;
    white-space: nowrap;
}

.visual-story-card__badge .icon {
    width: 0.95rem;
    height: 0.95rem;
}

.visual-story-card__body {
    display: grid;
    gap: 0.75rem;
    padding: 1.25rem;
}

.brand-packshot {
    --pack-base: #1f6b40;
    --pack-shadow: rgba(11, 28, 16, 0.22);
    --pack-glow: rgba(255, 244, 186, 0.52);
    position: relative;
    display: inline-block;
    filter: drop-shadow(0 16px 28px var(--pack-shadow));
}

.brand-packshot--rendered {
    line-height: 0;
}

.brand-packshot__image {
    display: block;
    width: 100%;
    height: auto;
}

.brand-packshot__glow {
    position: absolute;
    left: 50%;
    bottom: 0.4rem;
    width: 78%;
    height: 18%;
    border-radius: 999px;
    background: radial-gradient(circle, var(--pack-glow), rgba(255, 255, 255, 0));
    transform: translateX(-50%);
    filter: blur(8px);
    opacity: 0.75;
}

.brand-packshot__shell {
    position: relative;
    display: block;
}

.brand-packshot__label {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    display: block;
    width: 76%;
    max-width: 76%;
    height: auto;
    object-fit: contain;
    background: #fffef9;
    box-shadow:
        inset 0 0 0 1px rgba(120, 102, 76, 0.14),
        0 10px 18px rgba(17, 36, 23, 0.12);
}

.brand-packshot--bottle {
    width: 8.8rem;
}

.brand-packshot--bottle .brand-packshot__cap {
    position: absolute;
    top: 0;
    left: 50%;
    z-index: 3;
    width: 60%;
    height: 15%;
    border-radius: 1rem 1rem 0.65rem 0.65rem;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.14), rgba(255, 255, 255, 0)),
        linear-gradient(180deg, color-mix(in srgb, var(--pack-base) 92%, #0d2114), color-mix(in srgb, var(--pack-base) 66%, #06110a));
    transform: translateX(-50%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

.brand-packshot--bottle .brand-packshot__shell {
    aspect-ratio: 0.62;
    width: 100%;
    margin-top: 0.7rem;
    border-radius: 2.2rem 2.2rem 1.35rem 1.35rem;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0) 24%),
        linear-gradient(180deg, color-mix(in srgb, var(--pack-base) 90%, white 12%), color-mix(in srgb, var(--pack-base) 58%, #132719) 64%, color-mix(in srgb, var(--pack-base) 74%, #0c1c10));
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.08),
        inset 10px 0 20px rgba(255, 255, 255, 0.06),
        inset -14px 0 18px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.brand-packshot--bottle .brand-packshot__shell::after {
    content: "";
    position: absolute;
    inset: 12% auto 12% 10%;
    width: 20%;
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0));
    opacity: 0.38;
}

.brand-packshot--bottle .brand-packshot__label {
    top: 18%;
    border-radius: 0.9rem;
    padding: 0.12rem;
}

.brand-packshot--pouch {
    width: 8.9rem;
}

.brand-packshot--pouch .brand-packshot__shell {
    aspect-ratio: 0.8;
    width: 100%;
    border-radius: 1.2rem 1.2rem 1rem 1rem;
    padding: 0.35rem;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.72)),
        linear-gradient(180deg, color-mix(in srgb, var(--pack-base) 32%, white 68%), color-mix(in srgb, var(--pack-base) 24%, white 76%));
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.7),
        inset 0 -14px 28px rgba(0, 0, 0, 0.07);
    overflow: hidden;
}

.brand-packshot--pouch .brand-packshot__shell::before {
    content: "";
    position: absolute;
    left: 11%;
    right: 11%;
    top: 0.45rem;
    height: 0.24rem;
    border-radius: 999px;
    background: rgba(77, 98, 84, 0.22);
}

.brand-packshot--pouch .brand-packshot__label {
    top: 3%;
    width: 90%;
    max-width: 90%;
    border-radius: 0.8rem;
}

.brand-packshot--emerald {
    --pack-base: #185d37;
    --pack-glow: rgba(203, 255, 166, 0.48);
}

.brand-packshot--forest {
    --pack-base: #0f4a2a;
    --pack-glow: rgba(191, 248, 170, 0.46);
}

.brand-packshot--amber {
    --pack-base: #9a5a16;
    --pack-glow: rgba(255, 219, 149, 0.54);
}

.brand-packshot--ivory {
    --pack-base: #e0dccf;
    --pack-shadow: rgba(36, 34, 28, 0.18);
    --pack-glow: rgba(255, 251, 230, 0.58);
}

.brand-packshot--rose {
    --pack-base: #d7c0cf;
    --pack-glow: rgba(255, 217, 231, 0.46);
}

.brand-packshot--sage {
    --pack-base: #6c8d4b;
    --pack-glow: rgba(219, 245, 183, 0.46);
}

.brand-packshot--slate {
    --pack-base: #64717f;
    --pack-glow: rgba(215, 228, 245, 0.42);
}

.visual-story-card__stat {
    display: inline-flex;
    align-items: center;
    gap: 0.58rem;
    width: fit-content;
    min-height: 2.35rem;
    padding: 0.34rem 0.72rem 0.34rem 0.42rem;
    border: 1px solid rgba(17, 89, 43, 0.1);
    border-radius: 999px;
    background: rgba(17, 89, 43, 0.06);
}

.visual-story-card__stat strong {
    display: inline-grid;
    place-items: center;
    min-width: 2.2rem;
    height: 1.68rem;
    padding: 0 0.45rem;
    border-radius: 999px;
    color: #ffffff;
    background: linear-gradient(135deg, var(--green-900), var(--green-700));
    font-size: 0.78rem;
    font-weight: 850;
}

.visual-story-card__stat span {
    color: var(--green-900);
    font-size: 0.8rem;
    font-weight: 850;
}

.visual-story-card h3 {
    margin: 0;
    font-family: var(--font-display);
    font-size: 1.22rem;
    font-weight: 850;
    line-height: 1.18;
    letter-spacing: -0.025em;
}

.visual-story-card p {
    margin: 0;
    color: var(--ink-700);
    line-height: 1.62;
}

@media (max-width: 991.98px) {
    .section-heading {
        align-items: flex-start;
    }

    .product-card__title {
        min-height: auto;
    }
}

@media (max-width: 767.98px) {
    .section-shell {
        padding: 3.15rem 0;
    }

    .section-heading {
        gap: 1rem;
    }

    .section-title {
        max-width: 16ch;
    }

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

    .visual-story-card__body {
        padding: 1.1rem;
    }
}

/* Checkout experience polish */
.checkout-shell {
    padding-top: 1.25rem;
}

.checkout-page-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.85rem;
}

.checkout-page-heading h1 {
    margin: 0;
    font-size: clamp(1.45rem, 2.2vw, 2rem);
}

.checkout-page-heading a {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--green-800);
    font-size: 0.86rem;
    font-weight: 800;
}

.page-checkout .page-hero {
    padding: 1.9rem 0 1rem;
}

.checkout-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
}

.checkout-hero h1 {
    max-width: 22ch;
    margin-top: 0.75rem;
    font-size: clamp(2.3rem, 3.45vw, 3.15rem);
}

.checkout-hero p {
    max-width: 58ch;
}

.checkout-hero__trust {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.65rem;
    min-width: min(100%, 19rem);
}

.checkout-hero__trust span,
.checkout-secure-note,
.checkout-summary__assurance span {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    min-height: 2.3rem;
    padding: 0 0.78rem;
    border: 1px solid rgba(17, 89, 43, 0.12);
    border-radius: 999px;
    color: var(--green-900);
    background: rgba(255, 255, 255, 0.78);
    font-size: 0.82rem;
    font-weight: 800;
    white-space: nowrap;
}

.checkout-steps {
    position: relative;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
    margin-bottom: 1rem;
    padding: 0.45rem;
    border: 1px solid rgba(18, 23, 20, 0.07);
    border-radius: 1.2rem;
    background: rgba(255, 255, 255, 0.78);
    box-shadow: 0 14px 32px rgba(17, 36, 23, 0.06);
}

.checkout-steps span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    min-height: 2.95rem;
    padding: 0.55rem 0.7rem;
    border: 1px solid transparent;
    border-radius: 0.9rem;
    color: var(--ink-500);
    background: transparent;
    font-size: 0.9rem;
    font-weight: 850;
}

.checkout-steps span strong {
    display: inline-grid;
    place-items: center;
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    color: inherit;
    background: rgba(18, 23, 20, 0.07);
    font-size: 0.78rem;
}

.checkout-steps .is-active {
    color: var(--green-900);
    border-color: rgba(17, 89, 43, 0.12);
    background: #ffffff;
    box-shadow: 0 10px 22px rgba(17, 36, 23, 0.07);
}

.checkout-steps .is-active strong {
    color: #ffffff;
    background: linear-gradient(135deg, var(--green-900), var(--green-700));
}

.checkout-saved-addresses {
    margin-bottom: 1.15rem;
    padding: 1rem;
    border: 1px solid rgba(18, 23, 20, 0.08);
    border-radius: 1rem;
    background: #f8fbf8;
}

.checkout-saved-addresses__header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.75rem;
}

.checkout-saved-addresses__header strong {
    color: var(--ink-900);
    font-size: 0.95rem;
}

.checkout-saved-addresses__header span {
    color: var(--ink-500);
    font-size: 0.78rem;
}

.checkout-saved-addresses__list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem;
}

.checkout-saved-address-card {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: flex-start;
    gap: 0.72rem;
    min-height: 7rem;
    padding: 0.9rem;
    border: 1px solid #d9e2db;
    border-radius: 0.85rem;
    background: #ffffff;
    box-shadow: 0 5px 16px rgba(17, 36, 23, 0.04);
    cursor: pointer;
    transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease, background 160ms ease;
}

.checkout-saved-address-card:hover {
    border-color: #8fba9a;
    box-shadow: 0 9px 22px rgba(17, 89, 43, 0.09);
    transform: translateY(-1px);
}

.checkout-saved-address-card:focus-within {
    outline: 3px solid rgba(26, 138, 72, 0.16);
    outline-offset: 2px;
}

.checkout-saved-address-card.is-active {
    border-color: #168443;
    background: linear-gradient(145deg, #f5fff7, #edf9f0);
    box-shadow: 0 0 0 1px #168443, 0 10px 24px rgba(17, 89, 43, 0.11);
}

.checkout-saved-address-card .form-check-input {
    appearance: none;
    display: grid;
    place-content: center;
    width: 1.15rem;
    height: 1.15rem;
    margin: 0.08rem 0 0;
    border: 2px solid #9eaaa1;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: none;
}

.checkout-saved-address-card .form-check-input::before {
    width: 0.52rem;
    height: 0.52rem;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: inset 1em 1em #168443;
    content: "";
    transform: scale(0);
    transition: transform 120ms ease-in-out;
}

.checkout-saved-address-card .form-check-input:checked {
    border-color: #168443;
    background: #ffffff;
}

.checkout-saved-address-card .form-check-input:checked::before {
    transform: scale(1);
}

.checkout-saved-address-card > div {
    display: grid;
    gap: 0.22rem;
    min-width: 0;
}

.checkout-saved-address-card > div strong {
    color: #14331f;
    font-size: 0.88rem;
    font-weight: 850;
}

.checkout-saved-address-card > div span {
    color: #5e6d63;
    font-size: 0.78rem;
    line-height: 1.45;
}

.checkout-saved-address-card > div span:first-of-type {
    color: #314b39;
    font-weight: 700;
}

.checkout-saved-address-card--custom {
    border-style: dashed;
    background: #fbfcfb;
}

.checkout-saved-address-card--custom > div strong {
    color: var(--green-900);
}

.checkout-new-address-form {
    margin-top: 1rem;
    padding: 1.15rem;
    border: 1px solid #cfe0d3;
    border-radius: 1rem;
    background: linear-gradient(145deg, #ffffff, #f7fbf8);
    box-shadow: 0 10px 26px rgba(17, 89, 43, 0.07);
}

.checkout-new-address-form[hidden] {
    display: none !important;
}

.checkout-new-address-form__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
    padding-bottom: 0.8rem;
    border-bottom: 1px solid #e0eae2;
}

.checkout-new-address-form__header > div {
    display: grid;
    gap: 0.15rem;
}

.checkout-new-address-form__header strong {
    color: #14331f;
    font-size: 0.95rem;
}

.checkout-new-address-form__header span {
    color: #68766c;
    font-size: 0.78rem;
}

.checkout-new-address-form__badge {
    padding: 0.35rem 0.65rem;
    border-radius: 999px;
    color: #146c35 !important;
    background: #eaf7ed;
    font-size: 0.72rem !important;
    font-weight: 800;
    white-space: nowrap;
}

.checkout-form {
    gap: 1rem;
}

.form-section {
    position: relative;
    overflow: hidden;
    padding: 1.35rem;
    border-color: rgba(18, 23, 20, 0.07);
    border-radius: 1.1rem;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 16px 36px rgba(17, 36, 23, 0.06);
}

.form-section::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 0.22rem;
    background: transparent;
}

.form-section--active::before {
    background: linear-gradient(180deg, var(--green-900), #74bd52);
}

.form-section__header {
    margin-bottom: 1.15rem;
}

.form-section__header span {
    display: block;
    margin-bottom: 0.22rem;
    color: var(--green-800);
    font-size: 0.72rem;
    font-weight: 850;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.form-section__header h2 {
    margin: 0;
    font-family: var(--font-display);
    font-size: 1.18rem;
    font-weight: 850;
    letter-spacing: -0.02em;
}

.form-section__header a {
    display: inline-flex;
    align-items: center;
    min-height: 2.2rem;
    padding: 0 0.78rem;
    border-radius: 999px;
    background: rgba(17, 89, 43, 0.07);
}

.checkout-secure-note {
    margin-left: auto;
    background: rgba(17, 89, 43, 0.07);
}

.checkout-form .form-label {
    color: #2a352e;
    font-size: 0.86rem;
    font-weight: 850;
}

.checkout-form .form-control,
.checkout-form .form-select {
    min-height: 3.18rem;
    border-color: rgba(18, 23, 20, 0.1);
    border-radius: 0.84rem;
    background: rgba(255, 255, 255, 0.96);
    transition: border-color var(--transition), box-shadow var(--transition), background-color var(--transition);
}

.checkout-form .form-control:hover,
.checkout-form .form-select:hover {
    border-color: rgba(17, 89, 43, 0.18);
}

.checkout-option-list {
    gap: 0.75rem;
}

.checkout-option {
    position: relative;
    min-height: 4.4rem;
    padding: 0.95rem 1rem;
    border-color: rgba(18, 23, 20, 0.08);
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.82);
    transition: border-color var(--transition), box-shadow var(--transition), background-color var(--transition), transform var(--transition);
}

.checkout-option:hover,
.checkout-option:focus-within {
    border-color: rgba(17, 89, 43, 0.2);
    background: #ffffff;
    box-shadow: 0 14px 28px rgba(17, 36, 23, 0.06);
}

.checkout-option .form-check-input {
    width: 1.15rem;
    height: 1.15rem;
    margin: 0;
    border-color: rgba(17, 89, 43, 0.36);
}

.checkout-option .form-check-input:checked {
    background-color: var(--green-800);
    border-color: var(--green-800);
}

.checkout-option span {
    display: block;
    margin-top: 0.2rem;
    font-size: 0.9rem;
    line-height: 1.45;
}

.checkout-submit {
    display: grid;
    gap: 0.78rem;
}

.checkout-submit .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.72rem;
    min-height: 3.35rem;
    border-radius: 0.95rem;
    font-weight: 850;
}

.checkout-submit .btn .icon {
    width: 1.05rem;
    height: 1.05rem;
}

.checkout-submit p {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    margin: 0;
    color: var(--ink-700);
    font-size: 0.9rem;
}

.checkout-sidebar {
    position: sticky;
    top: 14rem;
}

.checkout-summary {
    position: relative;
    overflow: hidden;
    max-height: calc(100vh - 15.25rem);
    overflow-y: auto;
    padding: 1.1rem;
    border-radius: 1.18rem;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 251, 245, 0.96));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.85),
        0 22px 52px rgba(17, 36, 23, 0.1);
}

.checkout-summary::-webkit-scrollbar {
    width: 0.45rem;
}

.checkout-summary::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(17, 89, 43, 0.18);
}

.checkout-summary::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 0.28rem;
    background: linear-gradient(90deg, var(--green-900), #8cc84d, #f4a31c);
}

.checkout-summary__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.checkout-summary__header h2 {
    margin: 0.72rem 0 0;
    font-family: var(--font-display);
    font-size: 1.42rem;
    font-weight: 850;
    letter-spacing: -0.03em;
}

.checkout-summary__count {
    display: inline-flex;
    align-items: center;
    min-height: 2rem;
    padding: 0 0.7rem;
    border-radius: 999px;
    color: var(--green-900);
    background: rgba(17, 89, 43, 0.08);
    font-size: 0.82rem;
    font-weight: 850;
    white-space: nowrap;
}

.checkout-summary .summary-product-list {
    margin: 0.9rem 0;
    gap: 0.65rem;
}

.checkout-summary .summary-product {
    grid-template-columns: 3.8rem minmax(0, 1fr) auto;
    gap: 0.72rem;
    padding: 0.58rem;
    border: 1px solid rgba(18, 23, 20, 0.06);
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.72);
}

.checkout-summary .summary-product__visual {
    width: 3.8rem;
    min-height: 3.8rem;
    height: 3.8rem;
    padding: 0.32rem;
    border-radius: 0.8rem;
}

.checkout-summary .summary-product__visual::after {
    width: 2.6rem;
    height: 2.6rem;
    inset: auto -0.8rem -0.9rem auto;
}

.checkout-summary .summary-product__visual .product-bottle {
    right: 0.45rem;
    bottom: 0.35rem;
    width: 2rem;
    height: 2.9rem;
    padding-bottom: 0.24rem;
    border-radius: 0.9rem 0.9rem 0.5rem 0.5rem;
    font-size: 0.46rem;
}

.checkout-summary .summary-product__visual .product-bottle::before {
    top: -0.34rem;
    width: 1.1rem;
    height: 0.42rem;
}

.checkout-summary .summary-product strong {
    line-height: 1.25;
}

.checkout-summary .summary-product span {
    display: block;
    margin-top: 0.12rem;
    color: var(--ink-500);
    font-size: 0.85rem;
}

.checkout-discount {
    display: grid;
    gap: 0.45rem;
    margin: 0.85rem 0 0.45rem;
}

.checkout-discount > span {
    color: #2a352e;
    font-size: 0.86rem;
    font-weight: 850;
}

.checkout-discount div {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 0.55rem;
}

.checkout-discount .form-control {
    min-height: 2.65rem;
    border-radius: 0.84rem;
}

.checkout-discount .btn {
    min-width: 5.4rem;
    border-radius: 0.84rem;
}

.checkout-summary .summary-row {
    padding: 0.55rem 0;
}

.checkout-summary .summary-row--total {
    margin-top: 0.15rem;
    padding-top: 0.78rem;
    border-bottom: 0;
    font-size: 1.35rem;
}

.checkout-summary__assurance {
    display: flex;
    flex-wrap: wrap;
    gap: 0.42rem;
    margin-top: 0.72rem;
    padding-top: 0.72rem;
    border-top: 1px solid rgba(18, 23, 20, 0.08);
}

.checkout-summary__assurance span {
    min-height: 1.85rem;
    padding: 0 0.48rem;
    background: rgba(17, 89, 43, 0.06);
    font-size: 0.72rem;
}

@media (max-width: 991.98px) {
    .checkout-hero {
        align-items: flex-start;
        flex-direction: column;
    }

    .checkout-hero__trust {
        justify-content: flex-start;
    }

    .checkout-sidebar {
        position: static;
    }
}

@media (max-width: 575.98px) {
    .checkout-steps {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 0.38rem;
        padding: 0.35rem;
    }

    .checkout-steps span {
        flex-direction: column;
        gap: 0.28rem;
        min-height: 4rem;
        padding: 0.45rem 0.2rem;
        font-size: 0.74rem;
        text-align: center;
    }

    .form-section {
        padding: 1.1rem;
    }

    .checkout-saved-addresses {
        padding: 0.8rem;
    }

    .checkout-saved-addresses__header {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.2rem;
    }

    .checkout-saved-addresses__list {
        grid-template-columns: 1fr;
    }

    .checkout-saved-address-card {
        min-height: 0;
    }

    .form-section__header {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.65rem;
    }

    .checkout-option {
        grid-template-columns: auto 1fr;
    }

    .checkout-option > strong {
        grid-column: 2;
    }

    .checkout-discount div {
        grid-template-columns: 1fr;
    }
}

/* Image-backed category tiles for the customer-facing homepage. */
.section-shell--categories .section-heading--catalog {
    margin-bottom: 1.45rem;
}

.home-category-grid {
    --bs-gutter-x: 1.1rem;
    --bs-gutter-y: 1.1rem;
}

.category-card--compact {
    isolation: isolate;
    align-items: flex-start;
    justify-content: flex-end;
    min-height: clamp(10rem, 12.2vw, 11.65rem);
    padding: 0.92rem;
    border-color: rgba(18, 23, 20, 0.08);
    border-radius: 1.22rem;
    background: linear-gradient(145deg, #ecf4e8, #dfead9);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.86),
        0 16px 34px rgba(17, 36, 23, 0.08);
    text-align: left;
}

.category-card--compact::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    height: auto;
    border-radius: inherit;
    background:
        linear-gradient(180deg, rgba(8, 26, 13, 0.02) 22%, rgba(7, 29, 14, 0.36) 58%, rgba(5, 21, 10, 0.78) 100%),
        radial-gradient(circle at 82% 12%, rgba(255, 255, 255, 0.34), transparent 34%);
    opacity: 1;
    pointer-events: none;
    transition: background var(--transition), opacity var(--transition);
}

.category-card--compact:hover::after,
.category-card--compact:focus-visible::after {
    opacity: 0.96;
    background:
        linear-gradient(180deg, rgba(8, 26, 13, 0) 18%, rgba(7, 29, 14, 0.3) 54%, rgba(5, 21, 10, 0.82) 100%),
        radial-gradient(circle at 82% 12%, rgba(255, 255, 255, 0.44), transparent 36%);
}

.category-card__photo {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    border-radius: inherit;
}

.category-card__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.01);
    transition: transform 520ms ease, filter var(--transition);
}

.category-card--compact:hover .category-card__photo img,
.category-card--compact:focus-visible .category-card__photo img {
    filter: saturate(1.06) contrast(1.03);
    transform: scale(1.06);
}

.category-card__brand {
    position: absolute;
    right: 0.78rem;
    bottom: 0.72rem;
    z-index: 2;
    pointer-events: none;
}

.category-card__pack.brand-packshot--bottle {
    width: 3.9rem;
}

.category-card__pack.brand-packshot--pouch {
    width: 4.4rem;
}

.category-card--compact .category-card__icon {
    position: relative;
    z-index: 2;
    width: 2.55rem;
    height: 2.55rem;
    margin: 0;
    color: var(--green-900);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(239, 248, 235, 0.9));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.96),
        0 12px 24px rgba(5, 21, 10, 0.17);
    backdrop-filter: blur(10px);
}

.category-card--compact .icon {
    width: 1.28rem;
    height: 1.28rem;
}

.category-card__label {
    position: relative;
    z-index: 2;
    display: block;
    width: 100%;
    max-width: 100%;
    padding-right: 0.25rem;
    margin-top: auto;
}

.category-card--compact h3 {
    max-width: 10.4rem;
    color: #fff;
    font-size: clamp(0.94rem, 0.74vw, 1.02rem);
    font-weight: 850;
    line-height: 1.18;
    letter-spacing: -0.02em;
    text-shadow: 0 2px 14px rgba(0, 0, 0, 0.34);
    white-space: normal;
}

@media (min-width: 1200px) {
    .home-category-grid {
        --bs-gutter-x: 1.45rem;
        --bs-gutter-y: 1.45rem;
    }
}

@media (max-width: 767.98px) {
    .section-shell--categories .section-heading--catalog {
        margin-bottom: 1.1rem;
    }

    .home-category-grid {
        --bs-gutter-x: 0.9rem;
        --bs-gutter-y: 0.9rem;
    }

    .category-card--compact {
        min-height: 10.2rem;
        padding: 0.78rem;
    }

    .category-card--compact h3 {
        max-width: 8.4rem;
        font-size: 0.92rem;
    }
}

/* Mobile storefront cleanup */
.mobile-fold__desktop-heading {
    display: flex;
}

.mobile-fold__summary {
    display: none;
}

.mobile-copy-fold {
    display: none;
}

@media (max-width: 575.98px) {
    .hero-shell--banner-slide {
        height: 29.75rem;
        padding: 1.05rem 0.95rem 4.05rem;
        background-position: center, top center, 63% center;
        background-image:
            linear-gradient(90deg, rgba(7, 38, 14, 0.94) 0%, rgba(11, 63, 18, 0.84) 46%, rgba(18, 92, 22, 0.28) 100%),
            linear-gradient(180deg, rgba(13, 49, 10, 0.76) 0, rgba(13, 49, 10, 0.18) 3.2rem, rgba(13, 49, 10, 0) 7.2rem),
            var(--hero-banner);
    }

    .hero-copy--banner {
        max-width: 16.5rem;
    }

    .hero-copy--banner h1 {
        max-width: 8.2ch;
        margin: 0.58rem 0 0.72rem;
        font-size: clamp(1.92rem, 9.8vw, 2.48rem);
        line-height: 0.94;
    }

    .hero-copy--banner .hero-lead {
        max-width: 15.6rem;
        font-size: 0.84rem;
        line-height: 1.5;
    }

    .hero-copy--banner .hero-actions {
        margin-top: 0.95rem;
    }

    .hero-copy--banner .hero-actions .btn {
        width: 100%;
        min-width: 0;
        min-height: 2.95rem;
    }

    .hero-carousel__footer {
        bottom: 0.72rem;
        justify-content: flex-start;
    }

    .hero-carousel__controls {
        display: none;
    }

    .hero-carousel__indicators {
        gap: 0.38rem;
        padding: 0.18rem 0.48rem;
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.18);
        backdrop-filter: blur(12px);
    }

    .hero-carousel__indicators [data-bs-target] {
        width: 0.72rem;
        height: 0.72rem;
        min-width: 0;
        padding: 0;
        border: 0;
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.42);
        box-shadow: none;
    }

    .hero-carousel__indicators [data-bs-target] .icon {
        display: none;
    }

    .hero-carousel__indicators [data-bs-target].active {
        background: #ffffff;
        transform: none;
    }

    .hero-assurance {
        margin-top: -1rem;
        padding-bottom: 1.15rem;
    }

    .hero-assurance__bar {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.7rem;
        padding: 0.85rem 0.9rem;
    }

    .hero-assurance__item {
        align-items: flex-start;
        gap: 0.58rem;
    }

    .hero-assurance__item .icon {
        width: 1.1rem;
        height: 1.1rem;
        margin-top: 0.16rem;
    }

    .hero-assurance__item strong {
        font-size: 0.82rem;
        line-height: 1.2;
    }

    .hero-assurance__item span {
        display: -webkit-box;
        overflow: hidden;
        font-size: 0.74rem;
        line-height: 1.35;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    .section-shell--categories {
        padding-top: 1.45rem;
        padding-bottom: 1.75rem;
    }

    .section-heading--catalog {
        gap: 0.62rem;
        margin-bottom: 1rem;
    }

    .section-heading--catalog .section-title {
        font-size: 1.9rem;
    }

    .section-heading--catalog .section-link {
        display: inline-flex;
        align-items: center;
        min-height: 2.2rem;
        padding: 0 0.78rem;
        border-radius: 999px;
        background: rgba(17, 89, 43, 0.08);
        font-size: 0.8rem;
    }

    .home-category-grid {
        --bs-gutter-x: 0.72rem;
        --bs-gutter-y: 0.72rem;
    }

    .category-card--compact {
        min-height: 7.6rem;
        padding: 0.68rem;
        border-radius: 0.92rem;
    }

    .category-card--compact .category-card__icon {
        width: 2.15rem;
        height: 2.15rem;
    }

    .category-card--compact .icon {
        width: 1rem;
        height: 1rem;
    }

    .category-card--compact h3 {
        display: -webkit-box;
        max-width: 100%;
        overflow: hidden;
        font-size: 0.8rem;
        line-height: 1.16;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    .service-strip {
        padding-bottom: 2.2rem;
    }

    .service-grid {
        --bs-gutter-x: 0.72rem;
        --bs-gutter-y: 0.72rem;
    }

    .service-card {
        align-items: flex-start;
        min-height: 0;
        padding: 0.95rem 0.88rem;
        gap: 0.68rem;
    }

    .service-card__icon {
        width: 2.25rem;
        height: 2.25rem;
    }

    .service-card__icon .icon {
        width: 1rem;
        height: 1rem;
    }

    .service-card strong {
        display: block;
        font-size: 0.84rem;
        line-height: 1.2;
    }

    .service-card p {
        display: -webkit-box;
        margin-top: 0.18rem;
        overflow: hidden;
        font-size: 0.74rem;
        line-height: 1.36;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    .filter-group {
        flex-wrap: nowrap;
        width: calc(100% + 0.4rem);
        margin-right: -0.4rem;
        overflow-x: auto;
        padding-bottom: 0.2rem;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }

    .filter-group::-webkit-scrollbar {
        display: none;
    }

    .filter-chip {
        flex: 0 0 auto;
        padding: 0.65rem 0.86rem;
        font-size: 0.82rem;
        white-space: nowrap;
    }

    .mobile-snap-grid {
        flex-wrap: nowrap;
        margin: 0;
        overflow-x: auto;
        padding-bottom: 0.25rem;
        scroll-snap-type: x proximity;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }

    .mobile-snap-grid::-webkit-scrollbar {
        display: none;
    }

    .mobile-snap-grid > [class*="col-"] {
        flex: 0 0 84vw;
        width: 84vw;
        max-width: 84vw;
        padding: 0 0.2rem 0 0;
        scroll-snap-align: start;
    }

    .mobile-snap-grid--products > [class*="col-"] {
        flex-basis: 81vw;
        width: 81vw;
        max-width: 81vw;
    }

    .mobile-snap-grid--testimonials > [class*="col-"] {
        flex-basis: 84vw;
        width: 84vw;
        max-width: 84vw;
    }

    .visual-story-card__body {
        padding: 0.95rem 0.95rem 1rem;
    }

    .visual-story-card h3 {
        font-size: 1.1rem;
        line-height: 1.15;
    }

    .visual-story-card__copy {
        display: none;
    }

    .mobile-copy-fold {
        display: block;
        margin-top: 0.25rem;
        padding-top: 0.2rem;
    }

    .mobile-copy-fold summary {
        list-style: none;
        cursor: pointer;
        color: var(--green-800);
        font-size: 0.82rem;
        font-weight: 800;
    }

    .mobile-copy-fold summary::-webkit-details-marker {
        display: none;
    }

    .mobile-copy-fold p {
        margin: 0.58rem 0 0;
        font-size: 0.85rem;
        line-height: 1.5;
    }

    .deal-banner,
    .newsletter-card {
        padding: 1.35rem 1rem;
        border-radius: 1.1rem;
    }

    .deal-banner h2,
    .newsletter-card h2 {
        font-size: 1.72rem;
        line-height: 1.04;
    }

    .deal-banner p,
    .newsletter-card p {
        font-size: 0.92rem;
        line-height: 1.58;
    }

    .deal-card,
    .brand-chip,
    .testimonial-card {
        border-radius: 0.92rem;
    }

    .brand-chip {
        min-height: 5.4rem;
        padding: 0.9rem;
    }

    .testimonial-card {
        padding: 1rem;
    }

    .testimonial-card p {
        display: -webkit-box;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 4;
    }

    .mobile-fold__desktop-heading {
        display: none;
    }

    .mobile-fold {
        border: 1px solid rgba(18, 23, 20, 0.07);
        border-radius: 1rem;
        background: rgba(255, 255, 255, 0.88);
        box-shadow: 0 14px 30px rgba(17, 36, 23, 0.06);
        overflow: hidden;
    }

    .mobile-fold__summary {
        display: grid;
        gap: 0.38rem;
        padding: 1rem 1rem 0.95rem;
        cursor: pointer;
        list-style: none;
    }

    .mobile-fold__summary::-webkit-details-marker {
        display: none;
    }

    .mobile-fold__summary .eyebrow {
        width: max-content;
        margin: 0;
    }

    .mobile-fold__title {
        font-family: var(--font-display);
        font-size: 1.26rem;
        font-weight: 800;
        line-height: 1.08;
        letter-spacing: -0.03em;
    }

    .mobile-fold__hint {
        color: var(--green-800);
        font-size: 0.8rem;
        font-weight: 800;
    }

    .mobile-fold[open] .mobile-fold__summary {
        border-bottom: 1px solid rgba(18, 23, 20, 0.07);
    }

    .mobile-fold__content {
        padding: 0.9rem 0.9rem 1rem;
    }

    .mobile-fold--brands .brand-strip-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.72rem;
    }

    .mobile-fold--products .mobile-fold__content {
        padding-right: 0.7rem;
    }

    .site-footer {
        padding-top: 2rem;
    }

    .footer-main {
        padding-bottom: 1.1rem;
    }

    .site-footer .footer-links a,
    .footer-address-line {
        font-size: 0.88rem;
    }

    .footer-bottom {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.55rem;
        padding: 0.9rem 0;
        font-size: 0.82rem;
        line-height: 1.45;
    }

    .footer-payments {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.55rem;
    }
}

@media (min-width: 576px) {
    details.mobile-fold > .mobile-fold__content {
        display: block !important;
        padding: 0;
    }
}

/* Header refinement: top utility bar, brand alignment, premium search shell */
.topbar {
    background: #2f9347;
    color: rgba(255, 255, 255, 0.92);
    font-size: 0.8rem;
}

.topbar__inner {
    gap: 1.5rem;
    padding: 0.34rem 0;
}

.topbar__promo {
    flex: 0 0 auto;
    font-weight: 700;
    letter-spacing: 0.01em;
    white-space: nowrap;
}

.topbar__promo .icon,
.topbar__contact .icon {
    width: 0.82rem;
    height: 0.82rem;
}

.topbar__links {
    flex: 1 1 auto;
    gap: 1.2rem;
    justify-content: flex-end;
}

.topbar__group {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    min-width: 0;
}

.topbar__group a {
    position: relative;
    padding: 0 0.8rem;
    white-space: nowrap;
}

.topbar__group a:first-child {
    padding-left: 0;
}

.topbar__group a:last-child {
    padding-right: 0;
}

.topbar__group a + a::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 1px;
    height: 0.92rem;
    background: rgba(255, 255, 255, 0.16);
    transform: translateY(-50%);
}

.topbar__contact {
    font-weight: 600;
}

.topbar__group--utility a {
    color: rgba(255, 255, 255, 0.94);
}

.topbar__group .topbar__text {
    position: relative;
    padding: 0 0.8rem;
    white-space: nowrap;
    color: rgba(255, 255, 255, 0.82);
    font-weight: 600;
}

.topbar__group .topbar__text:last-child {
    padding-right: 0;
}

.topbar__group a + .topbar__text::before,
.topbar__group .topbar__text + a::before,
.topbar__group .topbar__text + .topbar__text::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 1px;
    height: 0.92rem;
    background: rgba(255, 255, 255, 0.16);
    transform: translateY(-50%);
}

.header-main {
    position: relative;
    z-index: 2000;
    border-bottom: 1px solid rgba(17, 36, 23, 0.05);
    background: rgba(255, 255, 255, 0.985);
}

.navbar {
    gap: 1.05rem;
    padding: 0.68rem 0 0.66rem;
}

.navbar-brand {
    gap: 1rem;
}

.brand-mark-shell {
    width: 4.95rem;
    height: 4.55rem;
    margin-right: -0.1rem;
}

.brand-mark-shell::before {
    left: 0.65rem;
    right: 0.65rem;
    bottom: 0.32rem;
    height: 1rem;
    background: radial-gradient(circle, rgba(13, 91, 39, 0.26) 0%, rgba(13, 91, 39, 0.1) 42%, rgba(13, 91, 39, 0) 76%);
}

.brand-mark {
    width: 4.65rem;
    transform: translateY(-0.04rem) scale(1.04);
    filter:
        drop-shadow(0 2px 0 rgba(255, 255, 255, 0.95))
        drop-shadow(0 12px 18px rgba(17, 89, 43, 0.14))
        drop-shadow(0 22px 28px rgba(17, 89, 43, 0.07));
}

.brand-copy {
    gap: 0.16rem;
    line-height: 1;
}

.brand-copy__eyebrow {
    color: #6a776f;
    font-size: 0.6rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.brand-copy strong {
    font-size: 1.58rem;
    line-height: 0.94;
    letter-spacing: -0.045em;
}

.brand-copy small {
    font-size: 0.8rem;
    line-height: 1.15;
    color: #455049;
}

.header-search {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 12.5rem 3.9rem;
    align-items: stretch;
    min-height: 4.05rem;
    padding: 0;
    border: 1px solid rgba(18, 23, 20, 0.1);
    border-radius: 1.05rem;
    overflow: hidden;
    background: linear-gradient(180deg, #ffffff 0%, #fbfdfb 100%);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.92),
        0 14px 30px rgba(17, 36, 23, 0.07);
}

.header-search:focus-within {
    border-color: rgba(33, 138, 59, 0.38);
    box-shadow:
        0 0 0 0.25rem rgba(33, 138, 59, 0.1),
        0 16px 34px rgba(17, 36, 23, 0.08);
}

.header-search__field {
    display: flex;
    align-items: center;
    min-width: 0;
    padding: 0 0 0 0.4rem;
}

.header-search__lead {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.8rem;
    color: var(--green-900);
}

.header-search__lead .icon {
    width: 1rem;
    height: 1rem;
}

.header-search__copy {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    width: 100%;
}

.header-search__label {
    color: #6d7771;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.header-search .form-control,
.header-search .form-select {
    min-height: auto;
    border: 0;
    box-shadow: none;
    background: transparent;
}

.header-search .form-control {
    padding: 0.12rem 1.05rem 0 0;
    color: #18221c;
    font-size: 1rem;
    border-right: 1px solid rgba(18, 23, 20, 0.08);
    border-radius: 0;
}

.header-search .form-control::placeholder {
    color: #7d867f;
    opacity: 1;
}

.header-search .form-select {
    max-width: none;
    padding: 0 2.8rem 0 1.15rem;
    color: #39443d;
    font-size: 0.92rem;
    font-weight: 700;
    border-right: 1px solid rgba(18, 23, 20, 0.08);
    border-radius: 0;
    background-position: right 1rem center;
}

.btn-search-submit {
    min-width: 3.9rem;
    height: auto;
    border-radius: 0;
    background: #2f9848;
    box-shadow: none;
}

.btn-search-submit:hover,
.btn-search-submit:focus-visible {
    background: #27863d;
}

.btn-search-submit .icon {
    width: 1.08rem;
    height: 1.08rem;
    color: #ffffff;
}

@media (max-width: 1399.98px) {
    .topbar__links {
        gap: 0.9rem;
    }

    .topbar__group a {
        padding: 0 0.62rem;
    }

    .header-search {
        grid-template-columns: minmax(0, 1fr) 11.3rem 3.6rem;
    }
}

@media (max-width: 1199.98px) {
    .navbar {
        padding: 0.95rem 0;
    }

    .brand-mark-shell {
        width: 5rem;
        height: 4.6rem;
    }

    .brand-mark {
        width: 4.7rem;
    }

    .brand-copy strong {
        font-size: 1.62rem;
    }
}

@media (max-width: 767.98px) {
    .brand-copy__eyebrow {
        font-size: 0.6rem;
        letter-spacing: 0.12em;
    }

    .brand-copy strong {
        font-size: 1.45rem;
    }

    .brand-copy small {
        font-size: 0.82rem;
    }
}

/* Header refinement: action icons + dark commerce nav strip */
.header-actions--desktop {
    gap: 0.72rem;
}

.header-actions--desktop .header-action {
    position: relative;
    align-items: center;
    gap: 0.5rem;
    min-height: auto;
    padding: 0;
    color: #17201a;
    white-space: nowrap;
    transition: transform var(--transition), opacity var(--transition);
}

.header-actions--desktop .header-action:hover,
.header-actions--desktop .header-action:focus-visible {
    color: var(--green-900);
    transform: translateY(-1px);
}

.header-action__icon-shell {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    flex: 0 0 auto;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.header-actions--desktop .header-action .icon {
    width: 1.14rem;
    height: 1.14rem;
    color: var(--green-900);
}

.header-actions--desktop .header-action__stack small {
    color: #778179;
    font-size: 0.58rem;
    font-weight: 700;
    white-space: nowrap;
}

.header-actions--desktop .header-action__stack strong {
    color: #18211b;
    font-size: 0.76rem;
    font-weight: 800;
    white-space: nowrap;
}

.header-actions--desktop .header-action--cart {
    padding-right: 0;
}

.header-actions--desktop .header-action--cart > .header-action__stack strong {
    position: static;
    min-width: auto;
    height: auto;
    padding: 0;
    background: transparent;
    color: #18211b;
    font-size: 0.92rem;
    line-height: 1.15;
}

.header-actions--desktop .header-action--cart .header-action__icon-shell {
    position: relative;
}

.header-actions--desktop .header-action__count {
    position: absolute;
    top: -0.28rem;
    right: -0.12rem;
    display: inline-grid;
    place-items: center;
    min-width: 1.14rem;
    height: 1.14rem;
    padding: 0 0.24rem;
    border: 2px solid #ffffff;
    border-radius: 999px;
    background: var(--green-800);
    color: #ffffff;
    font-size: 0.64rem;
    line-height: 1;
    box-shadow: 0 5px 12px rgba(33, 138, 59, 0.24);
}

.header-account-menu {
    position: relative;
    display: inline-flex;
    align-items: center;
}

/* Keep the hover target connected while the pointer travels into the panel. */
.header-account-menu::after {
    content: "";
    position: absolute;
    top: 100%;
    right: -0.35rem;
    left: -0.35rem;
    height: 0.65rem;
}

.header-account-menu__panel {
    position: absolute;
    top: calc(100% + 0.42rem);
    right: 0;
    z-index: 2100;
    width: min(17rem, calc(100vw - 2rem));
    padding: 1rem;
    border: 1px solid rgba(15, 97, 42, 0.14);
    border-radius: 0.75rem;
    background: #ffffff;
    box-shadow: 0 18px 44px rgba(17, 43, 27, 0.16);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(0.45rem);
    transition: opacity var(--transition), transform var(--transition), visibility var(--transition);
}

.header-account-menu__panel::before {
    content: "";
    position: absolute;
    top: -0.6rem;
    right: 1.35rem;
    width: 1rem;
    height: 1rem;
    border-top: 1px solid rgba(15, 97, 42, 0.14);
    border-left: 1px solid rgba(15, 97, 42, 0.14);
    background: #ffffff;
    transform: rotate(45deg);
}

.header-account-menu:hover .header-account-menu__panel,
.header-account-menu:focus-within .header-account-menu__panel {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}

.header-account-menu__panel-header {
    display: grid;
    gap: 0.12rem;
    padding-bottom: 0.75rem;
    margin-bottom: 0.65rem;
    border-bottom: 1px solid rgba(15, 97, 42, 0.12);
}

.header-account-menu__panel-header small {
    color: #708078;
    font-size: 0.72rem;
    font-weight: 700;
}

.header-account-menu__panel-header strong {
    color: #17201a;
    font-size: 1rem;
    line-height: 1.2;
}

.header-account-menu__links {
    display: grid;
    gap: 0.15rem;
}

.header-account-menu__links a,
.header-account-menu__logout {
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 2.15rem;
    padding: 0.48rem 0.55rem;
    border: 0;
    border-radius: 0.45rem;
    background: transparent;
    color: #1e2b22;
    font: inherit;
    font-size: 0.9rem;
    font-weight: 700;
    text-align: left;
    text-decoration: none;
}

.header-account-menu__links a:hover,
.header-account-menu__links a:focus-visible,
.header-account-menu__logout:hover,
.header-account-menu__logout:focus-visible {
    background: rgba(33, 138, 59, 0.1);
    color: var(--green-900);
    outline: 0;
}

.header-account-menu__logout {
    margin-top: 0.55rem;
    color: #8b2b1f;
    cursor: pointer;
}

.header-catalog {
    position: relative;
    border-top: 0;
    border-bottom: 0;
    background: #288d40;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 10px 24px rgba(10, 61, 28, 0.12);
}

.header-catalog::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 1px;
    background: rgba(255, 255, 255, 0.08);
}

.header-catalog__inner {
    grid-template-columns: 15.2rem minmax(0, 1fr);
    gap: 1rem;
    min-height: 3.35rem;
}

.catalog-button {
    justify-content: flex-start;
    min-height: 2.75rem;
    padding: 0.32rem 0.8rem 0.32rem 0.52rem;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 0.92rem;
    background: #2f9848;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.16),
        inset 0 -1px 0 rgba(0, 0, 0, 0.08);
}

.catalog-button:hover,
.catalog-button:focus-visible {
    transform: none;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.2),
        inset 0 -1px 0 rgba(0, 0, 0, 0.1),
        0 6px 16px rgba(10, 61, 28, 0.16);
}

.catalog-button__icon {
    width: 1.8rem;
    height: 1.8rem;
    border-radius: 0.6rem;
    background: rgba(255, 255, 255, 0.12);
}

.catalog-button__chevron {
    margin-left: auto;
}

.catalog-links {
    gap: 0.2rem;
}

.catalog-links a {
    min-height: 2.5rem;
    padding: 0 0.72rem;
    border-radius: 0.86rem;
    color: rgba(255, 255, 255, 0.92);
    font-size: 0.84rem;
    font-weight: 700;
    transition: background-color var(--transition), color var(--transition), transform var(--transition);
}

.catalog-links a.active,
.catalog-links a:hover,
.catalog-links a:focus-visible {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.13);
}

.catalog-links a.active::after,
.catalog-links a:hover::after {
    display: none;
}

.catalog-links__accent,
.catalog-links a.catalog-links__accent,
.primary-nav .nav-link--accent {
    color: #ffd394 !important;
}

.catalog-links__accent.active,
.catalog-links__accent:hover,
.catalog-links__accent:focus-visible {
    color: #ffffff !important;
    background: rgba(255, 183, 77, 0.16);
}

.header-shortcuts {
    border-bottom: 1px solid rgba(16, 63, 31, 0.08);
    background: #ffffff;
}

.header-shortcuts__grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0;
    position: relative;
    z-index: 5;
}

.header-shortcut-menu {
    position: relative;
}

.header-shortcut {
    display: flex;
    align-items: center;
    gap: 0.82rem;
    min-height: 3.45rem;
    padding: 0.58rem 0.82rem;
    border-right: 1px solid rgba(17, 36, 23, 0.08);
    color: #18211b;
    background: linear-gradient(180deg, #ffffff 0%, #f8fbf7 100%);
    transition: background-color var(--transition), color var(--transition);
}

.header-shortcut:first-child {
    border-left: 1px solid rgba(17, 36, 23, 0.08);
}

.header-shortcut:hover,
.header-shortcut:focus-visible {
    color: var(--green-900);
    background: linear-gradient(180deg, #ffffff 0%, #f1f8f2 100%);
}

.header-shortcut__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3.4rem;
    height: 2.8rem;
    flex: 0 0 auto;
    border-radius: 0.85rem;
    overflow: hidden;
    padding: 0.22rem;
    background: linear-gradient(180deg, #ffffff 0%, #f3f8f3 100%);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.95),
        0 8px 16px rgba(17, 89, 43, 0.06);
}

.header-shortcut__image {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 0.72rem;
    background: linear-gradient(180deg, #ffffff 0%, #f7faf7 100%);
}

.header-shortcut__title {
    display: block;
    font-size: 0.8rem;
    font-weight: 700;
    line-height: 1.18;
}

.header-shortcut-menu__panel {
    position: absolute;
    left: 0;
    top: calc(100% - 0.05rem);
    z-index: 30;
    width: min(68rem, calc(100vw - 2rem));
    padding-top: 0.55rem;
    opacity: 0;
    pointer-events: none;
    transform: translateY(0.5rem);
    transition: opacity var(--transition), transform var(--transition);
}

.header-shortcut-menu[data-panel-align="center"] .header-shortcut-menu__panel {
    left: 50%;
    right: auto;
    transform: translate(-50%, 0.5rem);
}

.header-shortcut-menu[data-panel-align="right"] .header-shortcut-menu__panel {
    left: auto;
    right: 0;
}

.header-shortcut-menu:hover .header-shortcut-menu__panel,
.header-shortcut-menu:focus-within .header-shortcut-menu__panel {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}

.header-shortcut-menu[data-panel-align="center"]:hover .header-shortcut-menu__panel,
.header-shortcut-menu[data-panel-align="center"]:focus-within .header-shortcut-menu__panel {
    transform: translate(-50%, 0);
}

/* Fallback alignment for the 5-column shortcut row when JS alignment is unavailable. */
.header-shortcuts__grid > .header-shortcut-menu:nth-child(3) .header-shortcut-menu__panel {
    left: 50%;
    right: auto;
    transform: translate(-50%, 0.5rem);
}

.header-shortcuts__grid > .header-shortcut-menu:nth-last-child(-n+2) .header-shortcut-menu__panel {
    left: auto;
    right: 0;
}

.header-shortcuts__grid > .header-shortcut-menu:nth-child(3):hover .header-shortcut-menu__panel,
.header-shortcuts__grid > .header-shortcut-menu:nth-child(3):focus-within .header-shortcut-menu__panel {
    transform: translate(-50%, 0);
}

.header-shortcut-menu__panel-inner {
    display: grid;
    grid-template-columns: 1.15fr repeat(2, minmax(0, 1fr));
    gap: 1.15rem;
    padding: 1.2rem 1.18rem;
    border: 1px solid rgba(17, 36, 23, 0.09);
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 26px 54px rgba(17, 36, 23, 0.14);
    backdrop-filter: blur(14px);
}

.header-shortcut-menu__intro,
.header-shortcut-menu__column {
    padding: 0.18rem 0.1rem;
}

.header-shortcut-menu__intro {
    border-right: 1px solid rgba(17, 36, 23, 0.07);
    padding-right: 1rem;
}

.header-shortcut-menu__eyebrow {
    display: inline-flex;
    align-items: center;
    min-height: 1.7rem;
    padding: 0 0.62rem;
    border-radius: 999px;
    background: rgba(33, 138, 59, 0.1);
    color: var(--green-900);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.header-shortcut-menu__intro h3,
.header-shortcut-menu__column h4 {
    margin: 0.72rem 0 0.72rem;
    color: #17211b;
    font-family: var(--font-display);
    font-size: 1rem;
    font-weight: 800;
    letter-spacing: -0.03em;
}

.header-shortcut-menu__intro a {
    color: var(--green-900);
    font-size: 0.88rem;
    font-weight: 800;
}

.header-shortcut-menu__column ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.header-shortcut-menu__column li + li {
    margin-top: 0.34rem;
}

.header-shortcut-menu__column a {
    color: #2c3731;
    font-size: 0.88rem;
    line-height: 1.3;
}

.header-shortcut-menu__column a:hover,
.header-shortcut-menu__column a:focus-visible {
    color: var(--green-900);
}

.header-running-line {
    background: #288d40;
    color: rgba(255, 255, 255, 0.96);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.header-running-line p {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.8rem;
    min-height: 1.85rem;
    margin: 0;
    font-size: 0.8rem;
    font-weight: 700;
    white-space: nowrap;
}

.header-running-line .icon {
    width: 0.95rem;
    height: 0.95rem;
    color: #dff3e2;
}

.header-running-line__divider {
    color: rgba(255, 255, 255, 0.46);
    font-weight: 400;
}

.header-broadcast {
    position: relative;
    z-index: 1;
    height: 2.15rem;
    overflow: hidden;
    background: #288d40;
    color: rgba(255, 255, 255, 0.96);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.header-broadcast__viewport {
    width: 100%;
    height: 2.15rem;
    overflow: hidden;
}

.header-broadcast__track {
    display: inline-flex;
    align-items: center;
    gap: 2.5rem;
    min-width: max-content;
    height: 2.15rem;
    padding-right: 2.5rem;
    animation: header-broadcast-scroll 36s linear infinite;
    will-change: transform;
}

.header-broadcast__message {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    font-size: 0.8rem;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
}

.header-broadcast__message .icon {
    width: 0.95rem;
    height: 0.95rem;
    color: #dff3e2;
    flex: 0 0 auto;
}

.header-broadcast__message a {
    color: #fff;
    text-decoration: underline;
    text-underline-offset: 0.15rem;
}

.holiday-notice {
    display: grid;
    grid-template-columns: 2.35rem minmax(0, 1fr);
    gap: 0.8rem;
    align-items: start;
    border: 1px solid #e5b24c;
    border-left: 0.3rem solid #c47b14;
    border-radius: 0.72rem;
    background: #fff8e7;
    color: #4b3513;
    box-shadow: 0 0.35rem 1rem rgba(107, 70, 12, 0.08);
}

.holiday-notice--checkout {
    margin: 1rem 0 0.35rem;
    padding: 1rem 1.1rem;
}

.holiday-notice--contact {
    margin: 1.2rem 0 1.35rem;
    padding: 0.95rem 1rem;
}

.holiday-notice__icon {
    display: inline-grid;
    place-items: center;
    width: 2.2rem;
    height: 2.2rem;
    border-radius: 50%;
    background: #f3d58d;
    color: #71480b;
}

.holiday-notice__icon .icon {
    width: 1.1rem;
    height: 1.1rem;
}

.holiday-notice strong {
    display: block;
    color: #5b3a0b;
    font-size: 0.95rem;
}

.holiday-notice p {
    margin: 0.2rem 0 0;
    color: inherit;
    line-height: 1.55;
}

.holiday-notice span {
    display: block;
    margin-top: 0.35rem;
    color: #735a2d;
    font-size: 0.82rem;
}

.header-broadcast:hover .header-broadcast__track,
.header-broadcast:focus-within .header-broadcast__track {
    animation-play-state: paused;
}

@keyframes header-broadcast-scroll {
    from { transform: translateX(100%); }
    to { transform: translateX(-100%); }
}

@media (max-width: 575.98px) {
    .header-broadcast,
    .header-broadcast__viewport,
    .header-broadcast__track {
        height: 2rem;
    }

    .header-broadcast__track {
        gap: 1.75rem;
        padding-right: 1.75rem;
        animation-duration: 30s;
    }

    .header-broadcast__message {
        font-size: 0.72rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .header-broadcast__track {
        width: 100%;
        justify-content: center;
        min-width: 100%;
        overflow: hidden;
        animation: none;
        transform: none;
    }
}

@media (max-width: 1399.98px) {
    .header-actions--desktop {
        gap: 0.68rem;
    }

    .header-actions--desktop .header-action__stack strong {
        font-size: 0.86rem;
    }

    .header-actions--desktop .header-action__stack small {
        font-size: 0.68rem;
    }

    .header-catalog__inner {
        grid-template-columns: 14.35rem minmax(0, 1fr);
    }

    .catalog-links a {
        padding: 0 0.72rem;
    }
}

/* Search alignment correction against reference header */
.header-search {
    flex: 1 1 45rem;
    grid-template-columns: minmax(0, 1fr) 10rem 3.3rem;
    min-height: 3rem;
    border-radius: 0.72rem;
    overflow: visible;
    box-shadow: 0 6px 18px rgba(17, 36, 23, 0.05);
}

.header-search .form-control,
.header-search .form-select,
.header-search__field {
    min-height: 3rem;
}

.header-search__field,
.header-search__copy,
.header-search__label,
.header-search__lead {
    display: contents;
}

.header-search .form-control {
    padding: 0 0.95rem;
    border-right: 1px solid rgba(18, 23, 20, 0.08);
    border-radius: 0.72rem 0 0 0.72rem;
    font-size: 0.8rem;
}

.header-search .form-select {
    padding: 0 2.15rem 0 0.72rem;
    border-right: 1px solid rgba(18, 23, 20, 0.08);
    font-size: 0.74rem;
    font-weight: 700;
}

.btn-search-submit {
    min-width: 3rem;
    border-radius: 0 0.72rem 0.72rem 0;
}

.btn-search-submit .icon {
    width: 0.98rem;
    height: 0.98rem;
    color: #ffffff;
}

/* Homepage hero sidebar aligned to reference storefront layout */
.hero-layout {
    --hero-sidebar-gap: 0.85rem;
}

.hero-sidebar {
    display: grid;
    gap: var(--hero-sidebar-gap);
}

.hero-panel {
    padding: 0.92rem 0.95rem 0.82rem;
    border: 1px solid rgba(17, 36, 23, 0.09);
    border-radius: 1rem;
    background: linear-gradient(180deg, #ffffff 0%, #fbfcf9 100%);
    box-shadow: 0 14px 28px rgba(17, 36, 23, 0.05);
}

.hero-panel__header {
    margin-bottom: 0.52rem;
}

.hero-panel__header h2 {
    margin: 0;
    color: #18211b;
    font-size: 1rem;
    font-weight: 800;
    letter-spacing: -0.02em;
}

.hero-panel__search {
    position: relative;
    margin-bottom: 0.65rem;
}

.hero-panel__search .form-control {
    min-height: 2.68rem;
    padding: 0 2.9rem 0 0.95rem;
    border: 1px solid rgba(17, 36, 23, 0.1);
    border-radius: 0.8rem;
    font-size: 0.88rem;
    box-shadow: none;
}

.hero-panel__search .form-control:focus {
    border-color: rgba(17, 89, 43, 0.24);
    box-shadow: 0 0 0 0.2rem rgba(17, 89, 43, 0.07);
}

.hero-panel__search button {
    position: absolute;
    top: 50%;
    right: 0.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: var(--green-900);
    transform: translateY(-50%);
}

.hero-panel__search button .icon {
    width: 0.95rem;
    height: 0.95rem;
}

.hero-panel__links {
    margin: 0;
    padding: 0;
    list-style: none;
}

.hero-panel__links li + li {
    margin-top: 0.08rem;
}

.hero-panel__links a {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.28rem 0;
    color: #243029;
    font-size: 0.92rem;
    line-height: 1.24;
}

.hero-panel__links a:hover,
.hero-panel__links a:focus-visible {
    color: var(--green-900);
}

.hero-panel__links .icon {
    width: 0.68rem;
    height: 0.68rem;
    flex: 0 0 auto;
    margin-top: 0.34rem;
    color: var(--green-800);
    transform: rotate(-90deg);
}

.hero-panel__footer-link {
    display: inline-flex;
    align-items: center;
    margin-top: 0.52rem;
    color: var(--green-900);
    font-size: 0.9rem;
    font-weight: 800;
}

.page-home .hero-section {
    padding-top: 0.38rem;
}

.hero-layout .hero-carousel {
    height: 100%;
}

.hero-layout .hero-carousel .carousel-inner,
.hero-layout .hero-carousel .carousel-item,
.hero-layout .hero-shell--banner-slide {
    height: 100%;
}

@media (min-width: 1200px) {
    .hero-layout {
        align-items: stretch !important;
    }

    .hero-sidebar {
        position: sticky;
        top: 11.25rem;
    }

    .hero-layout .hero-shell--banner-slide {
        min-height: 100%;
    }
}

@media (max-width: 1199.98px) {
    .hero-layout {
        --hero-sidebar-gap: 0.95rem;
    }

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

    .hero-panel {
        height: 100%;
    }
}

.blog-feature-card {
    display: grid;
    gap: 0;
    overflow: hidden;
}

.blog-feature-card__media {
    background: linear-gradient(135deg, rgba(18, 52, 68, 0.12), rgba(169, 120, 64, 0.14));
}

.blog-feature-card__media img {
    width: 100%;
    height: 100%;
    min-height: 280px;
    object-fit: cover;
    display: block;
}

.blog-feature-card__body {
    padding: 1.75rem;
}

.blog-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.85rem;
    margin-bottom: 1rem;
    color: rgba(17, 24, 39, 0.7);
    font-size: 0.92rem;
}

.blog-meta span {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.blog-card {
    height: 100%;
    overflow: hidden;
}

.blog-card__image {
    aspect-ratio: 16 / 10;
    overflow: hidden;
    border-radius: 1.15rem 1.15rem 0 0;
    background: linear-gradient(135deg, rgba(18, 52, 68, 0.12), rgba(169, 120, 64, 0.14));
}

.blog-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.blog-card__body {
    padding: 1.45rem;
}

.blog-card__body h3,
.blog-feature-card__body h2 {
    margin-bottom: 0.85rem;
}

.blog-card__body p,
.blog-feature-card__body p {
    color: rgba(17, 24, 39, 0.78);
}

.blog-article {
    overflow: hidden;
}

.blog-article__cover {
    border-radius: 1.35rem;
    overflow: hidden;
    margin-bottom: 1.75rem;
    background: linear-gradient(135deg, rgba(18, 52, 68, 0.12), rgba(169, 120, 64, 0.14));
}

.blog-article__cover img {
    width: 100%;
    max-height: 520px;
    object-fit: cover;
    display: block;
}

.blog-rich-text {
    color: rgba(17, 24, 39, 0.88);
    line-height: 1.8;
}

.blog-rich-text p,
.blog-rich-text ul,
.blog-rich-text ol {
    margin-bottom: 1rem;
}

.blog-rich-text ul,
.blog-rich-text ol {
    padding-left: 1.3rem;
}

.blog-rich-text a {
    color: var(--brand-700);
    text-decoration: underline;
    text-underline-offset: 0.18em;
}

.blog-rich-text table {
    width: 100%;
    margin: 1.5rem 0;
    border-collapse: collapse;
    overflow: hidden;
    border-radius: 0.9rem;
    background: #fff;
}

.blog-rich-text th,
.blog-rich-text td {
    padding: 0.85rem 1rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    vertical-align: top;
}

.blog-rich-text th {
    background: rgba(18, 52, 68, 0.06);
    font-weight: 700;
}

.blog-back-link {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    margin-bottom: 1rem;
    color: var(--brand-700);
    font-weight: 600;
    text-decoration: none;
}

.blog-back-link:hover,
.blog-back-link:focus-visible {
    color: var(--brand-800);
}

.blog-cta-card {
    margin-top: 2rem;
    padding: 1.5rem;
    border-radius: 1.15rem;
    background: linear-gradient(135deg, rgba(18, 52, 68, 0.08), rgba(169, 120, 64, 0.12));
}

@media (min-width: 992px) {
    .blog-feature-card {
        grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
    }

    .blog-feature-card__body {
        padding: 2rem;
    }
}

@media (max-width: 767.98px) {
    .blog-feature-card__body,
    .blog-card__body {
        padding: 1.2rem;
    }

    .blog-meta {
        gap: 0.65rem;
        font-size: 0.88rem;
    }
}

@media (max-width: 1399.98px) {
    .header-shortcut-menu__panel {
        width: min(58rem, 76vw);
    }
}

@media (max-width: 767.98px) {
    .hero-sidebar {
        grid-template-columns: 1fr;
    }

    .hero-panel {
        padding: 0.95rem 0.9rem 0.88rem;
        border-radius: 0.88rem;
    }

    .hero-panel__header h2 {
        font-size: 0.95rem;
    }

    .hero-panel__links a {
        font-size: 0.88rem;
    }
}
.disease-library-shell {
    display: grid;
    grid-template-columns: minmax(280px, 360px) minmax(0, 1fr);
    gap: 1.5rem;
    align-items: start;
}

.disease-library-sidebar,
.disease-library-viewer-wrap {
    min-width: 0;
}

.disease-library-panel {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(244, 248, 244, 0.98));
    border: 1px solid rgba(23, 94, 58, 0.12);
    border-radius: 1.5rem;
    box-shadow: 0 22px 60px rgba(16, 42, 25, 0.08);
    padding: 1.25rem;
}

.disease-library-sidebar {
    display: grid;
    gap: 1rem;
    position: sticky;
    top: 6rem;
}

.disease-library-search input,
.disease-library-jump select,
.disease-library-toolbar input {
    width: 100%;
    border: 1px solid rgba(23, 94, 58, 0.18);
    border-radius: 999px;
    background: #fff;
    color: #163221;
    min-height: 2.9rem;
    padding: 0.8rem 1rem;
}

.disease-library-search,
.disease-library-jump,
.disease-library-toolbar label {
    display: grid;
    gap: 0.45rem;
}

.disease-library-jump span,
.disease-library-toolbar label span {
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #2e5e44;
}

.disease-library-list-panel {
    padding: 0;
    overflow: hidden;
}

.disease-library-list-head {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    align-items: center;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid rgba(23, 94, 58, 0.1);
}

.disease-library-list-head span {
    color: #5f7368;
    font-size: 0.92rem;
}

.disease-library-list {
    display: grid;
}

.disease-library-item {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.85rem;
    align-items: start;
    text-align: left;
    width: 100%;
    background: transparent;
    border: 0;
    border-bottom: 1px solid rgba(23, 94, 58, 0.08);
    padding: 1rem 1.25rem;
    transition: background 0.2s ease;
}

.disease-library-item:hover,
.disease-library-item.is-active {
    background: rgba(23, 94, 58, 0.08);
}

.disease-library-item.is-active {
    box-shadow: inset 4px 0 0 #1f7a4c;
}

.disease-library-item-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 3rem;
    min-height: 3rem;
    border-radius: 1rem;
    background: linear-gradient(135deg, #d63f3f, #8b1616);
    color: #fff;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.08em;
}

.disease-library-item-copy {
    display: grid;
    gap: 0.25rem;
}

.disease-library-item-copy strong {
    color: #163221;
    font-size: 1rem;
}

.disease-library-item-copy small {
    color: #5f7368;
    line-height: 1.5;
}

.disease-library-empty {
    padding: 1.25rem;
    color: #5f7368;
}

.disease-library-stage {
    display: grid;
    gap: 1rem;
    min-height: 70vh;
}

.disease-library-stage-head {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: start;
}

.disease-library-stage-head h2 {
    margin-bottom: 0.4rem;
}

.disease-library-stage-head p {
    margin: 0;
    color: #567060;
    max-width: 54rem;
}

.disease-library-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    justify-content: flex-end;
}

.viewer-nav-button,
.viewer-link-button {
    border-radius: 999px;
    border: 1px solid rgba(23, 94, 58, 0.16);
    background: #1f7a4c;
    color: #fff;
    font-weight: 700;
    padding: 0.8rem 1.1rem;
    text-decoration: none;
}

.viewer-nav-button[disabled] {
    opacity: 0.55;
    cursor: not-allowed;
}

.viewer-link-button--ghost {
    background: #fff;
    color: #1f7a4c;
}

.disease-library-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: end;
    padding: 1rem;
    border-radius: 1.25rem;
    background: rgba(23, 94, 58, 0.06);
}

.disease-library-toolbar label {
    min-width: 7rem;
}

.disease-library-toolbar-note {
    color: #567060;
    font-size: 0.95rem;
}

.disease-library-book {
    position: relative;
    min-height: 58rem;
    border-radius: 1.5rem;
    overflow: hidden;
    background:
        linear-gradient(90deg, rgba(151, 113, 69, 0.22) 0, rgba(151, 113, 69, 0.08) 5%, rgba(255, 255, 255, 0.95) 14%, rgba(255, 255, 255, 0.95) 86%, rgba(151, 113, 69, 0.08) 95%, rgba(151, 113, 69, 0.2) 100%),
        #f6f1e7;
    border: 1px solid rgba(94, 66, 29, 0.18);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.45), 0 28px 70px rgba(48, 34, 14, 0.14);
}

.disease-library-book iframe {
    display: block;
    width: 100%;
    min-height: 58rem;
    border: 0;
    background: #fff;
}

.disease-library-book img {
    display: block;
    width: 100%;
    min-height: 58rem;
    max-height: 70rem;
    object-fit: contain;
    background: #fff;
}

@media (max-width: 1024px) {
    .disease-library-shell {
        grid-template-columns: 1fr;
    }

    .disease-library-sidebar {
        position: static;
    }
}

@media (max-width: 767px) {
    .disease-library-stage-head {
        flex-direction: column;
    }

    .disease-library-actions {
        justify-content: flex-start;
    }

    .disease-library-book,
    .disease-library-book iframe,
    .disease-library-book img {
        min-height: 35rem;
    }
}

/* Final footer arrangement override */
.site-footer {
    background: #257d39;
}

.site-footer .footer-signup .form-control {
    min-height: 2.7rem;
    border: 0;
    border-radius: var(--radius-pill);
}

.site-footer .footer-signup .btn {
    min-height: 2.7rem;
    color: var(--green-900);
    background: #ffffff;
    box-shadow: none;
}

.site-footer .footer-layout {
    display: grid;
}

.site-footer .footer-links {
    padding: 0.85rem 0.9rem 1rem;
}

.site-footer .footer-socials {
    margin: 0;
}

@media (max-width: 991.98px) {
    .site-footer .footer-layout {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .site-footer .footer-layout,
    .site-footer .footer-signup,
    .site-footer .footer-signup__form {
        grid-template-columns: 1fr;
    }
}

/* Natural footer arrangement refinement */
.site-footer {
    padding-top: 2.25rem;
    background: #257d39;
}

.site-footer .footer-signup {
    grid-template-columns: minmax(13rem, 0.75fr) minmax(18rem, 1fr);
    gap: clamp(1rem, 3vw, 2rem);
    align-items: center;
    margin-bottom: 1rem;
    padding: clamp(1rem, 2vw, 1.25rem);
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 1.15rem;
    background: rgba(255, 255, 255, 0.08);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.site-footer .footer-brand {
    gap: 0.95rem;
}

.footer-brand__logo {
    width: 5.3rem;
    height: auto;
    flex: 0 0 auto;
    filter:
        drop-shadow(0 1px 0 rgba(255, 255, 255, 0.14))
        drop-shadow(0 10px 18px rgba(0, 0, 0, 0.2));
}

.site-footer .footer-brand__name {
    max-width: 12rem;
    color: #ffffff;
    font-size: 1rem;
}

.site-footer .footer-signup__form {
    grid-template-columns: auto minmax(14rem, 1fr) auto;
    gap: 0.75rem;
    align-items: center;
}

.site-footer .footer-signup__label {
    color: rgba(255, 255, 255, 0.94);
    font-size: 0.9rem;
    font-weight: 800;
}

.site-footer .footer-signup .newsletter-feedback {
    grid-column: 2 / -1;
}

.site-footer .footer-notices {
    gap: 0.65rem;
    margin: 0 0 1rem;
}

.site-footer .footer-notices p {
    max-width: 78rem;
    margin: 0 auto;
    padding: 0.68rem 0.9rem;
    border: 1px solid rgba(255, 204, 92, 0.18);
    border-radius: 0.95rem;
    background: linear-gradient(180deg, rgba(255, 242, 198, 0.08) 0%, rgba(255, 212, 94, 0.05) 100%);
    color: rgba(255, 247, 229, 0.94);
    font-size: 0.86rem;
    line-height: 1.55;
    text-align: center;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.site-footer .footer-notices strong {
    color: #fff1c4;
}

.site-footer .footer-main {
    padding: 0.6rem 0 1.5rem;
}

.site-footer .footer-layout {
    grid-template-columns: 0.9fr 0.9fr 1.2fr 1fr 1.45fr;
    gap: clamp(1.25rem, 2vw, 2rem);
    border: 0;
    border-radius: 0;
    background: transparent;
    overflow: visible;
}

.site-footer .footer-column {
    border: 0;
}

.site-footer h3 {
    margin: 0 0 0.78rem;
    padding: 0;
    border: 0;
    background: transparent;
    color: #ffffff;
    font-size: 1rem;
    letter-spacing: 0.02em;
}

.site-footer .footer-links {
    margin: 0;
    padding: 0;
}

.site-footer .footer-links li + li {
    margin-top: 0.5rem;
}

.site-footer .footer-links a {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    color: rgba(255, 255, 255, 0.9);
    font-size: 0.92rem;
    line-height: 1.5;
}

.site-footer .footer-links a::before {
    content: "";
    display: inline-block;
    width: 0.32rem;
    height: 0.32rem;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.7);
}

.site-footer .footer-contact-link::before {
    display: none;
}

.site-footer .footer-contact-list strong,
.site-footer .footer-address-line strong {
    color: #ffffff;
}

.site-footer .footer-contact-list {
    display: grid;
    gap: 0.72rem;
}

.site-footer .footer-contact-list li + li {
    margin-top: 0;
}

.site-footer .footer-contact-item {
    display: grid;
    grid-template-columns: 2.15rem minmax(0, 1fr);
    gap: 0.72rem;
    align-items: start;
}

.site-footer .footer-contact-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.15rem;
    height: 2.15rem;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 0.78rem;
    background: rgba(255, 255, 255, 0.1);
    color: #f7fff8;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.site-footer .footer-contact-icon .icon {
    width: 1rem;
    height: 1rem;
}

.site-footer .footer-contact-detail {
    min-width: 0;
    padding-top: 0.08rem;
    line-height: 1.5;
}

.site-footer .footer-address-stack {
    display: grid;
    gap: 0.2rem;
}

.site-footer .footer-social-row {
    margin: 1rem 0 0;
    padding: 0.76rem 0.85rem;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 0.9rem;
    background: rgba(255, 255, 255, 0.08);
}

.site-footer .footer-social-row > span {
    color: rgba(255, 255, 255, 0.86);
    font-size: 0.88rem;
}

.site-footer .footer-social {
    width: 2.05rem;
    height: 2.05rem;
    color: #ffffff;
    background: rgba(255, 255, 255, 0.14);
}

.site-footer .footer-social--empty {
    opacity: 0.75;
    cursor: default;
}

.site-footer .footer-social:hover,
.site-footer .footer-social:focus-visible {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.24);
}

@media (max-width: 991.98px) {
    .site-footer .footer-layout {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .site-footer .footer-signup,
    .site-footer .footer-signup__form,
    .site-footer .footer-layout {
        grid-template-columns: 1fr;
    }

    .site-footer .footer-signup .newsletter-feedback {
        grid-column: auto;
    }

    .site-footer .footer-notices p {
        text-align: left;
    }
}

/* Footer top polish: logo, newsletter, and disclaimers */
.site-footer .footer-signup {
    position: relative;
    grid-template-columns: minmax(17rem, 0.78fr) minmax(20rem, 1fr);
    gap: clamp(1rem, 2.6vw, 2.4rem);
    margin-bottom: 1.15rem;
    padding: clamp(1rem, 2vw, 1.35rem);
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 1.25rem;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.13), rgba(255, 255, 255, 0.06)),
        rgba(255, 255, 255, 0.07);
}

.site-footer .footer-brand {
    align-self: stretch;
    gap: 1rem;
    padding: 0.9rem 1rem;
    border: 1px solid rgba(17, 89, 43, 0.08);
    border-radius: 1rem;
    background: #ffffff;
    box-shadow: 0 18px 36px rgba(0, 0, 0, 0.16);
}

.site-footer .footer-brand__logo {
    width: 6.2rem;
    max-height: 4rem;
    object-fit: contain;
    filter: none;
}

.site-footer .footer-brand__name {
    max-width: 13rem;
    color: var(--green-900);
    font-size: 1.06rem;
    line-height: 1.18;
}

.site-footer .footer-signup__form {
    gap: 0.78rem;
    padding: 0.95rem;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 1rem;
    background: rgba(7, 28, 17, 0.28);
}

.site-footer .footer-signup__label {
    color: #ffffff;
    font-size: 0.96rem;
}

.site-footer .footer-signup .form-control {
    min-height: 2.95rem;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 0.85rem;
    background: rgba(255, 255, 255, 0.96);
    color: var(--ink-900);
}

.site-footer .footer-signup .btn {
    min-height: 2.95rem;
    border-radius: 0.85rem;
    color: #ffffff;
    background: linear-gradient(135deg, var(--green-900), var(--green-700));
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.16);
}

.site-footer .footer-notices {
    gap: 0.72rem;
    margin-bottom: 1.25rem;
}

.site-footer .footer-notices p {
    max-width: 100%;
    padding: 0.78rem 1rem;
    border: 1px solid rgba(238, 203, 114, 0.58);
    border-radius: 0.9rem;
    background: #fff9e8;
    color: #3b3321;
    font-size: 0.9rem;
    line-height: 1.55;
    text-align: left;
    box-shadow: 0 12px 26px rgba(0, 0, 0, 0.08);
}

.site-footer .footer-notices strong {
    color: #0f4323;
}

@media (max-width: 767.98px) {
    .site-footer .footer-signup {
        grid-template-columns: 1fr;
    }

    .site-footer .footer-brand {
        align-self: auto;
    }

    .site-footer .footer-signup__form {
        grid-template-columns: 1fr;
    }

    .site-footer .footer-signup .newsletter-feedback {
        grid-column: auto;
    }
}

/* Footer newsletter compact option */
.site-footer .footer-signup {
    grid-template-columns: minmax(12rem, 0.62fr) minmax(22rem, 1fr);
    gap: 1rem;
    margin-bottom: 0.9rem;
    padding: 0.72rem;
    border-radius: 1rem;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.11), rgba(255, 255, 255, 0.04)),
        rgba(255, 255, 255, 0.06);
}

.site-footer .footer-brand {
    align-self: center;
    min-height: 4.15rem;
    padding: 0.55rem 0.75rem;
    border: 1px solid rgba(17, 89, 43, 0.08);
    border-radius: 0.85rem;
    background: #ffffff;
    box-shadow: 0 18px 36px rgba(0, 0, 0, 0.16);
}

.site-footer .footer-brand__logo {
    width: 4.9rem;
    max-height: 3.25rem;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    box-sizing: border-box;
}

.site-footer .footer-brand__name {
    max-width: 10rem;
    font-size: 0.96rem;
    color: var(--green-900);
}

.site-footer .footer-signup__form {
    grid-template-columns: auto minmax(14rem, 1fr) auto;
    align-items: center;
    gap: 0.62rem;
    min-height: 4.15rem;
    padding: 0.55rem;
    border-radius: 0.85rem;
    background: rgba(255, 255, 255, 0.08);
}

.site-footer .footer-signup__label {
    padding: 0 0.2rem;
    font-size: 0.88rem;
    white-space: nowrap;
}

.site-footer .footer-signup .form-control {
    min-height: 2.42rem;
    border-radius: 0.7rem;
    font-size: 0.9rem;
}

.site-footer .footer-signup .btn {
    min-height: 2.42rem;
    padding-inline: 1rem;
    border-radius: 0.7rem;
    font-size: 0.9rem;
}

.site-footer .footer-signup .newsletter-feedback {
    grid-column: 2 / -1;
    min-height: 0.8rem;
    margin-top: -0.28rem;
    font-size: 0.78rem;
}

@media (max-width: 991.98px) {
    .site-footer .footer-signup {
        grid-template-columns: 1fr;
    }

    .site-footer .footer-brand {
        align-self: auto;
    }
}

@media (max-width: 767.98px) {
    .site-footer .footer-signup__form {
        grid-template-columns: 1fr;
    }

    .site-footer .footer-brand {
        min-height: auto;
        padding: 0;
        border: 0;
        background: transparent;
        box-shadow: none;
    }

    .site-footer .footer-brand__logo {
        width: 4.65rem;
        max-height: 3rem;
        padding: 0.42rem 0.52rem;
        border: 1px solid rgba(17, 89, 43, 0.08);
        border-radius: 0.82rem;
        background: #ffffff;
        box-shadow: 0 12px 26px rgba(0, 0, 0, 0.16);
        box-sizing: content-box;
    }

    .site-footer .footer-brand__name {
        color: #ffffff;
    }

    .site-footer .footer-signup .newsletter-feedback {
        grid-column: auto;
        margin-top: 0;
    }
}

/* Customer account portal polish */
.page-account {
    background:
        linear-gradient(180deg, rgba(245, 251, 247, 0.92) 0%, rgba(252, 252, 250, 0.96) 34%, #ffffff 100%);
}

.page-account .page-hero {
    padding: clamp(2.2rem, 4vw, 3.2rem) 0 clamp(1.3rem, 2vw, 1.9rem);
    border-bottom: 1px solid rgba(18, 23, 20, 0.08);
    background:
        linear-gradient(135deg, rgba(238, 247, 239, 0.98) 0%, rgba(255, 255, 255, 0.98) 58%, rgba(245, 251, 247, 0.9) 100%);
}

.page-account .page-hero__content {
    max-width: 760px;
}

.page-account .page-hero__content h1 {
    font-size: clamp(1.75rem, 2.5vw, 2.4rem);
    line-height: 1.08;
}

.page-account .section-shell {
    padding-top: clamp(1.4rem, 2.4vw, 2rem);
    padding-bottom: clamp(2.8rem, 5vw, 4.5rem);
}

.account-shell {
    display: grid;
    grid-template-columns: minmax(230px, 280px) minmax(0, 1fr);
    gap: clamp(1rem, 2vw, 1.5rem);
    align-items: start;
}

.account-shell__sidebar {
    position: sticky;
    top: 8.5rem;
    display: grid;
    gap: 0.9rem;
}

.account-shell__content {
    display: grid;
    gap: 1rem;
    min-width: 0;
}

.account-sidebar-card,
.account-menu,
.account-panel {
    border: 1px solid rgba(18, 23, 20, 0.09);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 16px 34px rgba(17, 36, 23, 0.07);
}

.account-sidebar-card {
    overflow: hidden;
    padding: 1.15rem;
    background:
        linear-gradient(135deg, rgba(17, 89, 43, 0.98) 0%, rgba(22, 116, 58, 0.94) 100%);
    color: #ffffff;
}

.account-sidebar-card .eyebrow {
    color: rgba(255, 255, 255, 0.76);
}

.account-sidebar-card h2 {
    margin: 0.35rem 0 0.25rem;
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 800;
    line-height: 1.2;
}

.account-sidebar-card p {
    margin: 0;
    color: rgba(255, 255, 255, 0.82);
    font-size: 0.88rem;
    overflow-wrap: anywhere;
}

.account-sidebar-card__meta {
    display: grid;
    gap: 0.4rem;
    margin-top: 1rem;
    padding-top: 0.9rem;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
}

.account-sidebar-card__meta span {
    display: inline-flex;
    width: fit-content;
    max-width: 100%;
    padding: 0.35rem 0.55rem;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.12);
    color: rgba(255, 255, 255, 0.9);
    font-size: 0.76rem;
    font-weight: 800;
    overflow-wrap: anywhere;
}

.account-menu {
    display: grid;
    gap: 0.25rem;
    padding: 0.45rem;
}

.account-menu__link {
    display: grid;
    gap: 0.1rem;
    padding: 0.7rem 0.78rem;
    border: 1px solid transparent;
    border-radius: 8px;
    color: var(--ink-700);
    text-decoration: none;
    transition: background-color var(--transition), border-color var(--transition), color var(--transition), transform var(--transition);
}

.account-menu__link span {
    color: var(--ink-900);
    font-size: 0.93rem;
    font-weight: 800;
}

.account-menu__link small {
    color: var(--ink-500);
    font-size: 0.76rem;
    font-weight: 700;
}

.account-menu__link:hover,
.account-menu__link:focus-visible,
.account-menu__link.is-active {
    border-color: rgba(22, 116, 58, 0.16);
    background: rgba(238, 247, 239, 0.96);
    color: var(--green-900);
    outline: 0;
}

.account-menu__link:hover {
    transform: translateX(2px);
}

.account-menu__link.is-active span,
.account-menu__link.is-active small {
    color: var(--green-900);
}

.account-sidebar-links .btn {
    justify-content: center;
    min-height: 2.65rem;
    border-radius: 8px;
    font-weight: 800;
}

.account-panel {
    padding: clamp(1.05rem, 1.8vw, 1.45rem);
}

.account-panel + .account-panel {
    margin-top: 0.15rem;
}

.account-panel__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.05rem;
    padding-bottom: 0.9rem;
    border-bottom: 1px solid rgba(18, 23, 20, 0.08);
}

.account-panel__header h3 {
    margin: 0;
    font-family: var(--font-display);
    font-size: clamp(1.15rem, 1.8vw, 1.45rem);
    font-weight: 850;
    line-height: 1.2;
}

.account-panel__header p {
    margin: 0.35rem 0 0;
    color: var(--ink-700);
    font-size: 0.93rem;
    line-height: 1.55;
}

.account-panel__header .btn {
    flex: 0 0 auto;
    min-height: 2.45rem;
    border-radius: 8px;
    white-space: nowrap;
}

.account-panel__header--orders {
    display: grid;
    align-items: stretch;
    min-width: 0;
}

.account-dashboard__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.85rem;
    margin-top: 0;
}

.account-stat {
    position: relative;
    min-height: 7rem;
    padding: 1rem;
    border: 1px solid rgba(18, 23, 20, 0.08);
    border-radius: 8px;
    background:
        linear-gradient(180deg, #ffffff 0%, rgba(245, 251, 247, 0.8) 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.account-stat::before {
    content: "";
    position: absolute;
    inset: 0 auto auto 0;
    width: 100%;
    height: 3px;
    border-radius: 8px 8px 0 0;
    background: linear-gradient(90deg, var(--green-800), rgba(45, 140, 80, 0.28));
}

.account-stat span {
    display: block;
    color: var(--ink-500);
    font-size: 0.72rem;
    font-weight: 850;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.account-stat strong {
    display: block;
    margin-top: 0.6rem;
    color: var(--ink-950);
    font-family: var(--font-display);
    font-size: clamp(1.2rem, 2vw, 1.65rem);
    font-weight: 850;
    line-height: 1.18;
    overflow-wrap: anywhere;
}

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

.account-quick-card {
    display: grid;
    align-content: start;
    gap: 0.42rem;
    min-height: 8.25rem;
    padding: 1rem;
    border: 1px solid rgba(18, 23, 20, 0.08);
    border-radius: 8px;
    background: #ffffff;
    color: var(--ink-700);
    text-decoration: none;
    transition: transform var(--transition), border-color var(--transition), box-shadow var(--transition), background-color var(--transition);
}

.account-quick-card strong {
    color: var(--ink-900);
    font-size: 1rem;
    font-weight: 850;
    line-height: 1.25;
}

.account-quick-card span {
    font-size: 0.86rem;
    line-height: 1.5;
}

.account-quick-card:hover,
.account-quick-card:focus-visible {
    border-color: rgba(22, 116, 58, 0.18);
    background: rgba(245, 251, 247, 0.88);
    box-shadow: 0 14px 30px rgba(17, 36, 23, 0.08);
    color: var(--ink-700);
    outline: 0;
    transform: translateY(-2px);
}

.account-panel__split,
.account-address-book {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    align-items: start;
}

.account-panel .content-card {
    border-radius: 8px;
    box-shadow: none;
}

.account-form .form-label,
.account-search-form .form-label {
    color: var(--ink-700);
    font-size: 0.82rem;
    font-weight: 850;
}

.account-form .form-control,
.account-form .form-select,
.account-search-form .form-control {
    min-height: 2.78rem;
    border-color: rgba(18, 23, 20, 0.12);
    border-radius: 8px;
    background-color: #ffffff;
    color: var(--ink-900);
}

.account-form textarea.form-control {
    min-height: 8rem;
}

.account-form .form-control:focus,
.account-form .form-select:focus,
.account-search-form .form-control:focus {
    border-color: rgba(22, 116, 58, 0.42);
    box-shadow: 0 0 0 0.2rem rgba(22, 116, 58, 0.1);
}

.account-form .input-group-text {
    border-color: rgba(18, 23, 20, 0.12);
    border-radius: 8px 0 0 8px;
    background: rgba(245, 251, 247, 0.92);
    color: var(--green-900);
    font-weight: 850;
}

.account-form__footer {
    display: flex;
    justify-content: flex-end;
    gap: 0.7rem;
    margin-top: 1.15rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(18, 23, 20, 0.08);
}

.account-form__footer--split {
    justify-content: space-between;
}

.account-form__footer .btn,
.account-search-form .btn {
    min-height: 2.6rem;
    border-radius: 8px;
    font-weight: 850;
}

.account-order-list,
.account-ticket-list,
.account-address-book__list {
    display: grid;
    gap: 0.85rem;
}

.account-order-card,
.account-ticket-card,
.account-address-card,
.account-empty-state {
    border: 1px solid rgba(18, 23, 20, 0.08);
    border-radius: 8px;
    background: #ffffff;
}

.account-order-card,
.account-ticket-card,
.account-address-card {
    padding: 1rem;
}

.account-order-card__top,
.account-ticket-card__top,
.account-address-card__top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.account-order-card h4,
.account-address-card h4,
.account-ticket-history h4 {
    margin: 0;
    color: var(--ink-950);
    font-family: var(--font-display);
    font-size: 1rem;
    font-weight: 850;
}

.account-order-card p,
.account-address-card p,
.account-ticket-card p {
    color: var(--ink-700);
    font-size: 0.9rem;
    line-height: 1.55;
}

.account-order-card__badges,
.account-address-card__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.4rem;
}

.account-badge {
    display: inline-flex;
    align-items: center;
    min-height: 1.7rem;
    padding: 0.28rem 0.58rem;
    border: 1px solid rgba(22, 116, 58, 0.16);
    border-radius: 999px;
    background: rgba(238, 247, 239, 0.96);
    color: var(--green-900);
    font-size: 0.73rem;
    font-weight: 850;
    line-height: 1;
    white-space: nowrap;
}

.account-badge--soft {
    border-color: rgba(18, 23, 20, 0.09);
    background: rgba(247, 248, 243, 0.96);
    color: var(--ink-700);
}

.account-badge--paid,
.account-badge--success,
.account-badge--successful,
.account-badge--completed,
.account-badge--delivered,
.account-badge--approved,
.account-badge--refunded {
    border-color: rgba(22, 116, 58, 0.22);
    background: #e7f6eb;
    color: #087443;
}

.account-badge--failed,
.account-badge--declined,
.account-badge--cancelled,
.account-badge--canceled,
.account-badge--rejected,
.account-badge--voided,
.account-badge--chargeback {
    border-color: rgba(180, 35, 24, 0.22);
    background: #feeceb;
    color: #b42318;
}

.account-badge--pending,
.account-badge--unpaid,
.account-badge--partially_paid,
.account-badge--awaiting_payment,
.account-badge--on_hold {
    border-color: rgba(181, 71, 8, 0.22);
    background: #fff3e0;
    color: #b54708;
}

.account-badge--confirmed,
.account-badge--processing,
.account-badge--shipped,
.account-badge--in_transit,
.account-badge--out_for_delivery {
    border-color: rgba(37, 99, 235, 0.2);
    background: #eaf1ff;
    color: #1d4ed8;
}

.account-order-card__meta {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.65rem;
    margin-top: 0.95rem;
}

.account-order-card__meta div {
    padding: 0.72rem;
    border: 1px solid rgba(18, 23, 20, 0.07);
    border-radius: 8px;
    background: rgba(245, 251, 247, 0.72);
}

.account-order-card__meta span {
    display: block;
    color: var(--ink-500);
    font-size: 0.72rem;
    font-weight: 850;
    text-transform: uppercase;
}

.account-order-card__meta strong {
    display: block;
    margin-top: 0.25rem;
    color: var(--ink-950);
    font-size: 0.95rem;
    font-weight: 850;
}

.account-order-card__details {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem 1rem;
    margin-top: 0.9rem;
    color: var(--ink-700);
}

.account-order-card__details p {
    margin: 0;
}

.account-order-card__items {
    margin-top: 0.9rem;
    overflow-x: auto;
    border: 1px solid rgba(18, 23, 20, 0.08);
    border-radius: 8px;
}

.account-order-card__items .table {
    min-width: 620px;
}

.account-order-card__items th {
    color: var(--ink-700);
    font-size: 0.78rem;
    font-weight: 850;
    text-transform: uppercase;
}

/* Order history stays compact until a customer opens one order. */
.account-order-card {
    overflow: hidden;
    padding: 0;
}

.account-order-card > summary {
    list-style: none;
}

.account-order-card > summary::-webkit-details-marker {
    display: none;
}

.account-order-card__summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.1rem;
    cursor: pointer;
    transition: background-color 160ms ease;
}

.account-order-card__summary:hover,
.account-order-card__summary:focus-visible {
    background: rgba(245, 251, 247, 0.8);
}

.account-order-card__summary-main,
.account-order-card__summary-total {
    display: grid;
    gap: 0.18rem;
    min-width: 0;
}

.account-order-card__summary-eyebrow,
.account-order-card__summary-total small {
    color: var(--ink-500);
    font-size: 0.7rem;
    font-weight: 850;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.account-order-card__summary-main strong {
    overflow: hidden;
    color: var(--ink-950);
    font-family: var(--font-display);
    font-size: 1.02rem;
    font-weight: 850;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.account-order-card__summary-main small {
    overflow: hidden;
    color: var(--ink-700);
    font-size: 0.82rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.account-order-card__summary-status {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.35rem;
}

.account-order-card__summary-total {
    min-width: 7rem;
    text-align: right;
}

.account-order-card__summary-total > strong {
    color: var(--green-900);
    font-size: 1.03rem;
    font-weight: 850;
}

.account-order-card__summary-action {
    color: var(--green-700);
    font-size: 0.78rem;
    font-weight: 850;
    white-space: nowrap;
}

.account-order-card__summary-close {
    display: none;
}

.account-order-card[open] .account-order-card__summary-open {
    display: none;
}

.account-order-card[open] .account-order-card__summary-close {
    display: inline;
}

.account-order-card__body {
    padding: 0 1.1rem 1.1rem;
    border-top: 1px solid rgba(18, 23, 20, 0.08);
}

.account-order-card__body .account-order-card__meta {
    margin-top: 1rem;
}

.account-order-card__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.55rem;
    margin-top: 1rem;
    padding-top: 0.9rem;
    border-top: 1px solid rgba(18, 23, 20, 0.08);
}

.account-order-card__actions .btn {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.invoice-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.invoice-toolbar__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
}

.customer-invoice {
    max-width: 900px;
    margin: 0 auto;
    padding: clamp(1.25rem, 3vw, 2.5rem);
    border: 1px solid rgba(18, 23, 20, 0.1);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 18px 45px rgba(18, 23, 20, 0.08);
}

.customer-invoice__header,
.customer-invoice__info,
.customer-invoice__footer {
    display: flex;
    justify-content: space-between;
    gap: 2rem;
}

.customer-invoice__header {
    align-items: flex-start;
    padding-bottom: 1.4rem;
    border-bottom: 1px solid rgba(18, 23, 20, 0.1);
}

.customer-invoice__brand {
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

.customer-invoice__logo-wrap {
    display: grid;
    width: 3.2rem;
    height: 3.2rem;
    place-items: center;
    border: 1px solid rgba(18, 23, 20, 0.08);
    border-radius: 8px;
    background: #ffffff;
}

.customer-invoice__logo-wrap img {
    display: block;
    max-width: 2.7rem;
    max-height: 2.7rem;
    object-fit: contain;
}

.customer-invoice__brand div:last-child,
.customer-invoice__heading,
.customer-invoice__info > div,
.customer-invoice__footer > div {
    display: grid;
    gap: 0.25rem;
}

.customer-invoice__brand strong {
    color: var(--green-900);
    font-family: var(--font-display);
    font-size: 1.08rem;
    font-weight: 850;
}

.customer-invoice__brand span,
.customer-invoice__heading small,
.customer-invoice__info span,
.customer-invoice__footer span {
    color: var(--ink-700);
    font-size: 0.82rem;
}

.customer-invoice__heading {
    text-align: right;
}

.customer-invoice__heading > span {
    color: var(--ink-500);
    font-size: 0.72rem;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.customer-invoice__heading strong {
    color: var(--ink-950);
    font-family: var(--font-display);
    font-size: 1.35rem;
}

.customer-invoice__info {
    padding: 1.35rem 0;
}

.customer-invoice__info > div:last-child {
    min-width: 15rem;
    text-align: right;
}

.customer-invoice__label {
    color: var(--ink-500) !important;
    font-size: 0.72rem !important;
    font-weight: 850;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.customer-invoice__items {
    overflow-x: auto;
    border: 1px solid rgba(18, 23, 20, 0.1);
    border-radius: 8px;
}

.customer-invoice__items table {
    width: 100%;
    min-width: 620px;
    border-collapse: collapse;
}

.customer-invoice__items th,
.customer-invoice__items td {
    padding: 0.75rem 0.85rem;
    border-bottom: 1px solid rgba(18, 23, 20, 0.08);
    color: var(--ink-950);
    font-size: 0.86rem;
    text-align: left;
}

.customer-invoice__items th {
    background: rgba(245, 251, 247, 0.8);
    color: var(--ink-700);
    font-size: 0.72rem;
    font-weight: 850;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.customer-invoice__items tr:last-child td {
    border-bottom: 0;
}

.customer-invoice__footer {
    align-items: flex-start;
    padding-top: 1.35rem;
}

.customer-invoice__footer dl {
    min-width: 17rem;
    margin: 0;
}

.customer-invoice__footer dl div {
    display: flex;
    justify-content: space-between;
    gap: 2rem;
    padding: 0.25rem 0;
    color: var(--ink-700);
    font-size: 0.86rem;
}

.customer-invoice__footer dt,
.customer-invoice__footer dd {
    margin: 0;
}

.customer-invoice__footer dd {
    color: var(--ink-950);
    font-weight: 750;
}

.customer-invoice__footer .customer-invoice__total {
    margin-top: 0.4rem;
    padding-top: 0.65rem;
    border-top: 1px solid rgba(18, 23, 20, 0.14);
    color: var(--green-900);
    font-size: 1rem;
    font-weight: 850;
}

@media print {
    .site-header,
    .site-footer,
    .page-hero,
    .invoice-toolbar {
        display: none !important;
    }

    .section-shell,
    .customer-invoice {
        margin: 0;
        padding: 0;
        border: 0;
        box-shadow: none;
    }
}

.account-search-form {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    min-width: min(100%, 31rem);
}

.account-search-form .form-control {
    min-width: 16rem;
}

.account-order-filters {
    display: grid;
    grid-template-columns: minmax(13rem, 1.8fr) repeat(4, minmax(8rem, 1fr)) repeat(2, minmax(7rem, 0.9fr)) minmax(8rem, 0.9fr) auto auto;
    align-items: end;
    gap: 0.55rem;
    width: 100%;
    min-width: 0;
    margin-top: 1rem;
}

.account-order-filters__search {
    min-width: 0;
}

.account-order-filters__date {
    display: grid;
    gap: 0.25rem;
    min-width: 0;
}

.account-order-filters__dates {
    display: contents;
}

.account-order-filters__date span {
    color: var(--ink-500);
    font-size: 0.7rem;
    font-weight: 850;
    text-transform: uppercase;
}

.account-order-filters .form-control,
.account-order-filters .form-select,
.account-order-filters .btn {
    min-height: 2.7rem;
    min-width: 0;
}

.account-order-filters .form-select {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.account-order-list-summary {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 0.5rem 1rem;
    margin: 1.1rem 0 0.65rem;
    color: var(--ink-500);
    font-size: 0.8rem;
}

.account-order-list-summary span:first-child {
    color: var(--ink-700);
    font-weight: 850;
}

/* Keep the date range visible on laptop-width account pages. */
@media (max-width: 1399.98px) {
    .account-order-filters {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .account-order-filters__search {
        grid-column: span 2;
    }

    .account-order-filters__dates {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.55rem;
        min-width: 0;
    }
}

.account-order-card__summary-note {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem 1rem;
    padding: 0 1.1rem 1rem;
    color: var(--ink-700);
    font-size: 0.8rem;
}

.account-order-card__summary-note span + span {
    padding-left: 1rem;
    border-left: 1px solid rgba(18, 23, 20, 0.12);
}

.account-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    margin-top: 1rem;
    color: var(--ink-700);
    font-size: 0.85rem;
    font-weight: 750;
}

.customer-order-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.customer-order-toolbar__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
}

.customer-order-status-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.customer-order-status-grid article,
.customer-order-card {
    border: 1px solid rgba(18, 23, 20, 0.09);
    border-radius: 8px;
    background: #ffffff;
}

.customer-order-status-grid article {
    display: grid;
    gap: 0.25rem;
    padding: 0.9rem 1rem;
}

.customer-order-status-grid span,
.customer-order-info-grid span,
.customer-order-record span {
    color: var(--ink-500);
    font-size: 0.7rem;
    font-weight: 850;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.customer-order-status-grid strong {
    color: var(--ink-950);
    font-size: 0.95rem;
    font-weight: 850;
}

.customer-order-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(18rem, 0.55fr);
    align-items: start;
    gap: 1rem;
}

.customer-order-main,
.customer-order-side {
    display: grid;
    gap: 1rem;
    min-width: 0;
}

.customer-order-card {
    padding: 1rem;
}

.customer-order-card__header {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.9rem;
}

.customer-order-card__header h2 {
    margin: 0;
    color: var(--ink-950);
    font-family: var(--font-display);
    font-size: 1.05rem;
    font-weight: 850;
}

.customer-order-card__header p {
    margin: 0.25rem 0 0;
    color: var(--ink-700);
    font-size: 0.82rem;
}

.customer-order-info-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.65rem;
}

.customer-order-info-grid > div {
    display: grid;
    gap: 0.22rem;
    padding: 0.7rem;
    border: 1px solid rgba(18, 23, 20, 0.07);
    border-radius: 8px;
    background: rgba(245, 251, 247, 0.7);
}

.customer-order-info-grid strong,
.customer-order-record strong {
    overflow-wrap: anywhere;
    color: var(--ink-950);
    font-size: 0.86rem;
    font-weight: 800;
}

.customer-order-table-wrap {
    overflow-x: auto;
    border: 1px solid rgba(18, 23, 20, 0.08);
    border-radius: 8px;
}

.customer-order-table {
    width: 100%;
    min-width: 720px;
    border-collapse: collapse;
}

.customer-order-table th,
.customer-order-table td {
    padding: 0.7rem;
    border-bottom: 1px solid rgba(18, 23, 20, 0.08);
    color: var(--ink-950);
    font-size: 0.82rem;
    text-align: left;
    vertical-align: top;
}

.customer-order-table th {
    background: rgba(245, 251, 247, 0.78);
    color: var(--ink-700);
    font-size: 0.7rem;
    font-weight: 850;
    text-transform: uppercase;
}

.customer-order-table td small {
    display: block;
    margin-top: 0.2rem;
    color: var(--ink-500);
}

.customer-order-table tr:last-child td {
    border-bottom: 0;
}

.customer-order-record-list {
    display: grid;
    gap: 0.65rem;
}

.customer-order-record {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.7rem;
    padding: 0.8rem;
    border: 1px solid rgba(18, 23, 20, 0.07);
    border-radius: 8px;
    background: rgba(247, 248, 243, 0.55);
}

.customer-order-record > div {
    display: grid;
    gap: 0.2rem;
    min-width: 0;
}

.customer-order-record a {
    color: var(--green-700);
    text-decoration: underline;
    text-underline-offset: 0.15em;
}

.customer-order-shipping-summary {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 0.5rem 1rem;
    margin-bottom: 0.8rem;
    padding: 0.75rem;
    border: 1px solid rgba(22, 116, 58, 0.14);
    border-radius: 8px;
    background: rgba(238, 247, 239, 0.7);
    color: var(--green-900);
    font-size: 0.85rem;
}

.customer-order-muted {
    margin: 0;
    color: var(--ink-700);
    font-size: 0.85rem;
    line-height: 1.55;
}

.customer-order-totals {
    display: grid;
    gap: 0.45rem;
    margin: 0;
}

.customer-order-totals div {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding-bottom: 0.45rem;
    border-bottom: 1px solid rgba(18, 23, 20, 0.08);
    color: var(--ink-700);
    font-size: 0.86rem;
}

.customer-order-totals dt,
.customer-order-totals dd {
    margin: 0;
}

.customer-order-totals dd {
    color: var(--ink-950);
    font-weight: 800;
}

.customer-order-totals__grand {
    padding-top: 0.35rem;
    border-bottom: 0 !important;
    color: var(--green-900) !important;
    font-size: 1rem !important;
    font-weight: 850;
}

.customer-order-address {
    display: grid;
    gap: 0.25rem;
    color: var(--ink-700);
    font-size: 0.86rem;
    font-style: normal;
    line-height: 1.5;
}

.customer-order-card--help {
    display: grid;
    gap: 0.45rem;
    background: rgba(245, 251, 247, 0.78);
}

.customer-order-card--help strong {
    color: var(--green-900);
}

.customer-order-card--help p {
    margin: 0;
    color: var(--ink-700);
    font-size: 0.84rem;
    line-height: 1.5;
}

.account-address-card.is-default {
    border-color: rgba(22, 116, 58, 0.28);
    background: linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(245, 251, 247, 0.92) 100%);
}

.account-address-card__actions .btn {
    min-height: 2.1rem;
    border-radius: 8px;
    font-size: 0.8rem;
    font-weight: 850;
}

.account-ticket-history {
    margin-top: 1.25rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(18, 23, 20, 0.08);
}

.account-ticket-history > h4 {
    margin-bottom: 0.85rem;
}

.account-ticket-history__heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
    margin-bottom: 0.85rem;
}

.account-ticket-history__heading h4 {
    margin-bottom: 0;
}

.account-ticket-card__meta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem 0.9rem;
    margin-top: 0.8rem;
    color: var(--ink-500);
    font-size: 0.76rem;
    font-weight: 750;
}

.account-ticket-card__meta-row span + span {
    position: relative;
    padding-left: 0.9rem;
}

.account-ticket-card__meta-row span + span::before {
    position: absolute;
    top: 50%;
    left: 0;
    width: 0.24rem;
    height: 0.24rem;
    border-radius: 50%;
    background: currentColor;
    content: "";
    transform: translateY(-50%);
}

.account-badge--in_progress {
    border-color: rgba(37, 99, 235, 0.2);
    background: rgba(239, 246, 255, 0.96);
    color: #1d4ed8;
}

.account-badge--waiting_customer {
    border-color: rgba(180, 83, 9, 0.2);
    background: rgba(255, 247, 237, 0.96);
    color: #9a3412;
}

.account-badge--resolved,
.account-badge--closed {
    border-color: rgba(22, 116, 58, 0.18);
    background: rgba(240, 253, 244, 0.96);
    color: #166534;
}

.account-ticket-thread {
    display: grid;
    gap: 0.6rem;
    margin-top: 0.9rem;
}

.account-ticket-message {
    max-width: min(100%, 48rem);
    padding: 0.72rem 0.82rem;
    border: 1px solid rgba(18, 23, 20, 0.08);
    border-radius: 8px;
    color: var(--ink-700);
    font-size: 0.88rem;
    line-height: 1.55;
}

.account-ticket-message--customer {
    justify-self: end;
    border-color: rgba(22, 116, 58, 0.16);
    background: rgba(245, 251, 247, 0.9);
}

.account-ticket-message--team {
    justify-self: start;
    background: #ffffff;
}

.account-ticket-message__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.3rem;
    color: var(--ink-950);
    font-size: 0.75rem;
}

.account-ticket-message__top time {
    color: var(--ink-500);
    font-size: 0.68rem;
    font-weight: 650;
}

.account-ticket-reply {
    display: grid;
    gap: 0.55rem;
    margin-top: 0.85rem;
    padding-top: 0.85rem;
    border-top: 1px solid rgba(18, 23, 20, 0.08);
}

.account-ticket-reply textarea {
    width: 100%;
    min-height: 4rem;
    padding: 0.72rem 0.82rem;
    border: 1px solid rgba(18, 23, 20, 0.14);
    border-radius: 8px;
    color: var(--ink-900);
    resize: vertical;
}

.account-ticket-reply textarea:focus {
    border-color: rgba(22, 116, 58, 0.5);
    outline: 3px solid rgba(22, 116, 58, 0.1);
}

.account-ticket-reply__footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.7rem;
}

.account-ticket-reply__footer .alert {
    margin: 0 auto 0 0;
    padding: 0.42rem 0.65rem;
    font-size: 0.76rem;
}

.account-ticket-closed {
    display: flex;
    align-items: center;
    gap: 0.42rem;
    margin-top: 0.9rem;
    padding-top: 0.85rem;
    border-top: 1px solid rgba(18, 23, 20, 0.08);
    color: var(--ink-500);
    font-size: 0.82rem;
}

.account-ticket-card__notes {
    color: var(--ink-700);
    font-size: 0.9rem;
    line-height: 1.6;
}

.account-empty-state {
    padding: clamp(1.2rem, 2.4vw, 1.8rem);
    border-style: dashed;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(245, 251, 247, 0.72) 100%);
    text-align: center;
}

.account-empty-state h4 {
    margin: 0 0 0.4rem;
    font-family: var(--font-display);
    font-size: 1.05rem;
    font-weight: 850;
}

.account-empty-state p {
    color: var(--ink-700);
    line-height: 1.55;
}

@media (max-width: 1199.98px) {
    .account-dashboard__grid,
    .account-quick-grid,
    .account-order-card__meta {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

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

    .account-order-filters__dates {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.55rem;
        min-width: 0;
    }

    .customer-order-layout {
        grid-template-columns: 1fr;
    }

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

    .account-order-filters__search {
        grid-column: 1 / -1;
    }
}

@media (max-width: 991.98px) {
    .account-shell {
        grid-template-columns: 1fr;
    }

    .account-shell__sidebar {
        position: static;
    }

    .account-menu {
        display: flex;
        gap: 0.45rem;
        overflow-x: auto;
        padding: 0.45rem;
        scrollbar-width: thin;
    }

    .account-menu__link {
        min-width: 9.4rem;
    }

    .account-menu__link:hover {
        transform: translateY(-1px);
    }

    .account-sidebar-links {
        display: none;
    }
}

@media (max-width: 767.98px) {
    .page-account .page-hero {
        padding-top: 1.6rem;
    }

    .account-panel,
    .account-sidebar-card {
        padding: 1rem;
    }

    .account-panel__header,
    .account-order-card__top,
    .account-ticket-card__top,
    .account-address-card__top {
        display: grid;
        gap: 0.75rem;
    }

    .account-panel__header .btn,
    .account-search-form,
    .account-search-form .form-control {
        width: 100%;
        min-width: 0;
    }

    .account-search-form {
        display: grid;
    }

    .account-dashboard__grid,
    .account-quick-grid,
    .account-panel__split,
    .account-address-book,
    .account-order-card__meta {
        grid-template-columns: 1fr;
    }

    .account-stat,
    .account-quick-card {
        min-height: auto;
    }

    .account-address-card__actions,
    .account-order-card__badges,
    .account-order-card__summary-status {
        justify-content: flex-start;
    }

    .account-order-card__summary {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 0.7rem;
    }

    .account-order-card__summary-status {
        grid-column: 1 / -1;
        grid-row: 2;
    }

    .account-order-card__summary-total {
        grid-column: 2;
        grid-row: 1;
    }

    .account-order-card__body {
        padding: 0 0.85rem 0.85rem;
    }

    .invoice-toolbar,
    .customer-invoice__header,
    .customer-invoice__info,
    .customer-invoice__footer {
        display: grid;
        gap: 1rem;
    }

    .invoice-toolbar__actions {
        width: 100%;
    }

    .invoice-toolbar__actions .btn {
        flex: 1 1 10rem;
    }

    .customer-invoice__heading,
    .customer-invoice__info > div:last-child {
        text-align: left;
    }

    .customer-invoice__info > div:last-child,
    .customer-invoice__footer dl {
        min-width: 0;
    }

    .account-order-filters,
    .customer-order-status-grid,
    .customer-order-layout,
    .customer-order-info-grid {
        grid-template-columns: 1fr;
    }

    .account-order-filters__search,
    .account-order-filters .btn,
    .account-order-filters .form-select,
    .account-order-filters__dates,
    .account-order-filters__date {
        width: 100%;
    }

    .customer-order-toolbar {
        display: grid;
        align-items: stretch;
    }

    .customer-order-toolbar__actions {
        width: 100%;
    }

    .customer-order-toolbar__actions .btn {
        flex: 1 1 9rem;
    }

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

    .customer-order-table-wrap {
        overflow: visible;
        border: 0;
    }

    .customer-order-table,
    .customer-order-table tbody,
    .customer-order-table tr,
    .customer-order-table td {
        display: block;
        width: 100%;
    }

    .customer-order-table {
        min-width: 0;
    }

    .customer-order-table thead {
        display: none;
    }

    .customer-order-table tr {
        margin-bottom: 0.7rem;
        padding: 0.2rem 0.85rem;
        border: 1px solid rgba(18, 23, 20, 0.08);
        border-radius: 8px;
        background: rgba(247, 250, 247, 0.72);
    }

    .customer-order-table td,
    .customer-order-table td.text-end {
        display: grid;
        grid-template-columns: minmax(7rem, 0.7fr) minmax(0, 1.3fr);
        gap: 0.75rem;
        align-items: baseline;
        padding: 0.65rem 0;
        border-bottom: 1px solid rgba(18, 23, 20, 0.07);
        text-align: left !important;
    }

    .customer-order-table td::before {
        content: attr(data-label);
        color: var(--ink-500);
        font-size: 0.68rem;
        font-weight: 850;
        letter-spacing: 0.04em;
        text-transform: uppercase;
    }

    .customer-order-table td:last-child {
        border-bottom: 0;
    }

    .account-order-card__summary-note span + span {
        padding-left: 0;
        border-left: 0;
    }

    .account-form__footer,
    .account-form__footer--split {
        display: grid;
        justify-content: stretch;
    }

    .account-form__footer .btn {
        width: 100%;
    }
}

@media (max-width: 600px) {
    .account-order-filters {
        grid-template-columns: 1fr;
    }

    .account-order-filters__search {
        grid-column: auto;
    }

    .account-order-filters .btn {
        width: 100%;
    }

    .account-order-list-summary {
        display: grid;
        gap: 0.25rem;
    }

    .customer-order-toolbar__actions,
    .customer-order-toolbar__actions .btn {
        width: 100%;
    }

    .customer-order-toolbar__actions .btn {
        justify-content: center;
    }

    .customer-order-record {
        grid-template-columns: 1fr;
    }

    .customer-order-table td,
    .customer-order-table td.text-end {
        grid-template-columns: 1fr;
        gap: 0.15rem;
    }
}

/* Signed-in workspace responsive finish */
.page-account,
.page-customer-order,
.page-invoice {
    overflow-x: hidden;
}

.account-shell__content,
.account-panel,
.account-panel__header,
.account-order-card,
.account-ticket-card,
.account-return-request,
.account-subscription-card,
.customer-order-card,
.customer-invoice {
    min-width: 0;
}

.account-panel__header h3,
.account-panel__header p,
.account-order-card__summary-main,
.account-order-card__summary-main strong,
.account-order-card__summary-main small,
.account-ticket-card,
.account-return-request,
.account-subscription-card,
.customer-order-card,
.customer-invoice {
    overflow-wrap: anywhere;
}

.account-order-card__summary-total strong,
.account-order-card__summary-action,
.customer-order-record strong,
.customer-order-info-grid strong,
.customer-invoice__info strong {
    overflow-wrap: anywhere;
}

@media (max-width: 991.98px) {
    .account-shell {
        gap: 0.9rem;
    }

    .account-shell__sidebar {
        position: static;
    }

    .account-menu {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.35rem;
        overflow: visible;
        padding: 0.45rem;
    }

    .account-menu__link {
        min-width: 0;
    }

    .account-menu__link:hover {
        transform: none;
    }

    .account-sidebar-links {
        display: block;
    }

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

    .account-order-card__summary {
        gap: 0.75rem;
    }

    .invoice-toolbar,
    .customer-order-toolbar {
        align-items: stretch;
    }
}

@media (max-width: 767.98px) {
    .page-account .page-hero,
    .page-customer-order .page-hero,
    .page-invoice .page-hero {
        padding-top: 1.45rem;
        padding-bottom: 1.15rem;
    }

    .page-account .page-hero__content h1,
    .page-customer-order .page-hero__content h1,
    .page-invoice .page-hero__content h1 {
        font-size: clamp(1.45rem, 6vw, 1.9rem);
    }

    .account-shell__sidebar {
        gap: 0.7rem;
    }

    .account-sidebar-card,
    .account-panel,
    .customer-order-card,
    .customer-invoice {
        border-radius: 10px;
    }

    .account-panel,
    .customer-order-card {
        padding: 0.9rem;
    }

    .account-panel__header,
    .customer-order-card__header {
        gap: 0.7rem;
        margin-bottom: 0.85rem;
        padding-bottom: 0.75rem;
    }

    .account-panel__header .btn,
    .account-form__footer .btn,
    .invoice-toolbar__actions .btn,
    .customer-order-toolbar__actions .btn {
        width: 100%;
        justify-content: center;
    }

    .account-order-card__summary {
        grid-template-columns: minmax(0, 1fr) auto;
        padding: 0.85rem;
    }

    .account-order-card__summary-total {
        min-width: 5.8rem;
    }

    .account-order-card__summary-note {
        display: grid;
        gap: 0.35rem;
        padding: 0 0.85rem 0.85rem;
    }

    .account-order-card__summary-note span + span {
        padding-left: 0;
        border-left: 0;
    }

    .customer-invoice {
        padding: 0.95rem;
    }

    .customer-invoice__header,
    .customer-invoice__info,
    .customer-invoice__footer {
        gap: 1rem;
    }

    .customer-invoice__brand {
        align-items: flex-start;
    }

    .customer-invoice__heading {
        text-align: left;
    }

    .customer-invoice__items {
        overflow: visible;
        border: 0;
    }

    .customer-invoice__items table,
    .customer-invoice__items tbody,
    .customer-invoice__items tr,
    .customer-invoice__items td {
        display: block;
        width: 100%;
    }

    .customer-invoice__items table {
        min-width: 0;
    }

    .customer-invoice__items thead {
        display: none;
    }

    .customer-invoice__items tr {
        margin-bottom: 0.7rem;
        padding: 0.2rem 0.8rem;
        border: 1px solid rgba(18, 23, 20, 0.08);
        border-radius: 8px;
        background: rgba(247, 250, 247, 0.72);
    }

    .customer-invoice__items td,
    .customer-invoice__items td.text-end {
        display: grid;
        grid-template-columns: minmax(6rem, 0.7fr) minmax(0, 1.3fr);
        gap: 0.65rem;
        padding: 0.6rem 0;
        border-bottom: 1px solid rgba(18, 23, 20, 0.07);
        text-align: left !important;
    }

    .customer-invoice__items td::before {
        content: attr(data-label);
        color: var(--ink-500);
        font-size: 0.67rem;
        font-weight: 850;
        letter-spacing: 0.04em;
        text-transform: uppercase;
    }

    .customer-invoice__items td:last-child {
        border-bottom: 0;
    }

    .customer-invoice__footer dl {
        width: 100%;
    }
}

@media (max-width: 480px) {
    .account-menu {
        grid-template-columns: 1fr;
    }

    .account-dashboard__grid,
    .account-quick-grid {
        grid-template-columns: 1fr;
    }

    .account-order-card__summary {
        grid-template-columns: 1fr;
    }

    .account-order-card__summary-total {
        min-width: 0;
        text-align: left;
    }

    .account-order-card__summary-status {
        justify-content: flex-start;
    }

    .customer-order-status-grid article,
    .customer-order-info-grid > div {
        padding: 0.75rem;
    }

    .customer-invoice__items td,
    .customer-invoice__items td.text-end {
        grid-template-columns: 1fr;
        gap: 0.15rem;
    }
}

/* Professional customer order experience */
.account-order-card--professional { overflow: hidden; border: 1px solid rgba(18, 67, 38, 0.12); border-radius: 14px; background: #fff; box-shadow: 0 10px 28px rgba(20, 55, 33, 0.06); }
.account-order-card--professional .account-order-card__summary { cursor: default; padding: 1.15rem 1.2rem 0.85rem; }
.account-order-card__facts { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 0.75rem; padding: 0.9rem 1.2rem; border-top: 1px solid rgba(18, 23, 20, 0.07); background: #fbfdfb; }
.account-order-card__facts > div { display: grid; gap: 0.2rem; min-width: 0; }
.account-order-card__facts span { color: var(--ink-500); font-size: 0.68rem; font-weight: 850; letter-spacing: 0.05em; text-transform: uppercase; }
.account-order-card__facts strong { overflow-wrap: anywhere; color: var(--ink-900); font-size: 0.84rem; }
.account-order-card--professional .account-order-card__actions { margin: 0; padding: 0.9rem 1.2rem 1.1rem; }
.account-order-card__return-note { margin-left: auto; color: var(--ink-500); font-size: 0.76rem; font-weight: 700; }
.order-progress { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); margin: 0 0 1rem; padding: 1.1rem 1.25rem; border: 1px solid rgba(18, 67, 38, 0.1); border-radius: 12px; background: linear-gradient(135deg, #fff, #f6fbf7); }
.order-progress--compact { margin: 0 1.2rem 0.85rem; padding: 0.75rem 0; border: 0; border-top: 1px solid rgba(18, 23, 20, 0.07); border-radius: 0; background: transparent; }
.order-progress__step { position: relative; display: grid; justify-items: center; gap: 0.42rem; color: var(--ink-500); text-align: center; }
.order-progress__step::before { position: absolute; z-index: 0; top: 0.88rem; right: 50%; width: 100%; height: 2px; content: ''; background: #dfe7e1; transform: translateX(-50%); }
.order-progress__step:first-child::before { display: none; }
.order-progress__step > span { position: relative; z-index: 1; display: grid; width: 1.8rem; height: 1.8rem; place-items: center; border: 2px solid #d8e2db; border-radius: 50%; background: #fff; font-size: 0.72rem; font-weight: 900; }
.order-progress__step strong { font-size: 0.72rem; font-weight: 800; }
.order-progress__step.is-complete { color: var(--green-800); }
.order-progress__step.is-complete::before { background: var(--green-700); }
.order-progress__step.is-complete > span { border-color: var(--green-700); background: var(--green-700); color: #fff; }
.order-progress__step.is-current > span { box-shadow: 0 0 0 4px rgba(26, 128, 63, 0.13); }
.order-progress-alert { margin: 0 0 1rem; padding: 0.85rem 1rem; border: 1px solid #f0b7b7; border-radius: 10px; background: #fff3f3; color: #9d2424; font-weight: 750; }
.account-returns-panel .account-return-request, .account-returns-panel .account-return-order { border-radius: 12px; box-shadow: 0 8px 24px rgba(20, 55, 33, 0.05); }
.account-return-order__locked { margin: 0; padding: 0.85rem 1rem; border-radius: 9px; background: #f6f8f6; color: var(--ink-600); }
@media (max-width: 767.98px) {
    .account-order-card__facts { grid-template-columns: 1fr; }
    .account-order-card__return-note { width: 100%; margin-left: 0; }
    .order-progress { overflow-x: auto; grid-template-columns: repeat(5, minmax(5rem, 1fr)); }
    .order-progress--compact { margin-inline: 0.85rem; }
}

/* Shop subcategory browsing */
.filter-link-list--subcategories a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.filter-link-list--subcategories a span {
    display: inline-grid;
    place-items: center;
    min-width: 1.65rem;
    height: 1.65rem;
    padding: 0 0.45rem;
    border-radius: var(--radius-pill);
    background: rgba(17, 89, 43, 0.08);
    color: var(--green-900);
    font-size: 0.72rem;
    font-weight: 850;
}

.subcategory-strip {
    display: grid;
    gap: 1rem;
    margin: 0 0 1.25rem;
    padding: clamp(1rem, 2vw, 1.25rem);
    border: 1px solid rgba(18, 23, 20, 0.08);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 16px 34px rgba(17, 36, 23, 0.07);
}

.subcategory-strip__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.subcategory-strip__header h2 {
    margin: 0.7rem 0 0;
    font-family: var(--font-display);
    font-size: clamp(1.15rem, 1.8vw, 1.45rem);
    font-weight: 850;
    line-height: 1.2;
}

.subcategory-strip__header > a {
    color: var(--green-800);
    font-size: 0.9rem;
    font-weight: 850;
    white-space: nowrap;
}

.subcategory-chip-grid {
    display: grid;
    gap: 0.85rem;
}

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

.subcategory-chip-group > strong {
    color: var(--ink-700);
    font-size: 0.78rem;
    font-weight: 850;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.subcategory-chip-group > div {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.subcategory-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    min-height: 2.35rem;
    padding: 0.48rem 0.72rem;
    border: 1px solid rgba(17, 89, 43, 0.12);
    border-radius: var(--radius-pill);
    background: rgba(245, 251, 247, 0.88);
    color: var(--ink-900);
    font-size: 0.9rem;
    font-weight: 800;
    line-height: 1.2;
    transition: background-color var(--transition), border-color var(--transition), color var(--transition), transform var(--transition);
}

.subcategory-chip small {
    display: inline-grid;
    place-items: center;
    min-width: 1.45rem;
    height: 1.45rem;
    padding: 0 0.35rem;
    border-radius: var(--radius-pill);
    background: rgba(17, 89, 43, 0.09);
    color: var(--green-900);
    font-size: 0.7rem;
    font-weight: 850;
}

.subcategory-chip:hover,
.subcategory-chip:focus-visible,
.subcategory-chip.is-active {
    border-color: rgba(17, 89, 43, 0.28);
    background: var(--green-900);
    color: var(--white);
    outline: 0;
    transform: translateY(-1px);
}

.subcategory-chip:hover small,
.subcategory-chip:focus-visible small,
.subcategory-chip.is-active small {
    background: rgba(255, 255, 255, 0.18);
    color: var(--white);
}

.product-card__taxonomy,
.product-summary__taxonomy {
    color: var(--green-800);
    font-size: 0.82rem;
    font-weight: 850;
}

.product-card__taxonomy {
    margin-top: -0.25rem;
    margin-bottom: 0.45rem;
}

.product-summary__taxonomy {
    margin: 0.55rem 0 0.35rem;
}

.product-summary__taxonomy a {
    display: inline-flex;
    align-items: center;
    min-height: 2rem;
    padding: 0.35rem 0.65rem;
    border: 1px solid rgba(17, 89, 43, 0.12);
    border-radius: var(--radius-pill);
    background: rgba(245, 251, 247, 0.9);
    color: var(--green-900);
}

@media (max-width: 767.98px) {
    .subcategory-strip__header {
        display: grid;
    }

    .subcategory-strip__header > a {
        width: fit-content;
    }

    .subcategory-chip {
        max-width: 100%;
    }
}
.account-return-history { display: grid; gap: .6rem; margin: 1rem 0 1.25rem; }
.account-return-history h4 { margin: 0 0 .25rem; }
.account-return-request { display: flex; align-items: center; justify-content: space-between; gap: 1rem; border: 1px solid var(--border-color, #e3e9e5); border-radius: 10px; padding: .8rem 1rem; background: #fff; }
.account-return-request > div { display: grid; gap: .2rem; }
.account-return-request span { color: #6d7972; font-size: .85rem; }
.account-return-request__meta { display: flex !important; align-items: center; }
.account-return-order-list { display: grid; gap: 1rem; }
.account-return-order { border: 1px solid var(--border-color, #e3e9e5); border-radius: 12px; padding: 1rem; background: #fff; }
.account-return-order.is-selected { border-color: #287c46; box-shadow: 0 0 0 3px rgba(40, 124, 70, .08); }
.account-return-order__header { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.account-return-order__header h4 { margin: 0; }
.account-return-order__header p { margin: .25rem 0 0; color: #6d7972; font-size: .88rem; }
.account-return-form { display: grid; gap: 1rem; border-top: 1px solid #edf1ee; padding-top: 1rem; }
.account-return-form__fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem; }
.account-return-form label { display: grid; gap: .35rem; font-weight: 600; font-size: .86rem; }
.account-return-items { display: grid; gap: .55rem; }
.account-return-items__label { font-size: .86rem; font-weight: 700; }
.account-return-item { display: grid !important; grid-template-columns: auto 1fr 90px; align-items: center; gap: .75rem !important; padding: .65rem .75rem; border: 1px solid #edf1ee; border-radius: 8px; font-weight: 400 !important; }
.account-return-item > span { display: grid; gap: .15rem; }
.account-return-item small { color: #6d7972; }
.account-return-item input[type="checkbox"] { width: 1rem; height: 1rem; }
.account-return-item .form-control { min-width: 0; }
.account-return-order__locked { color: #6d7972; margin: 0; }
@media (max-width: 700px) {
    .account-return-request, .account-return-order__header { align-items: flex-start; flex-direction: column; }
    .account-return-form__fields { grid-template-columns: 1fr; }
}

/* Order history filters: keep the date range and actions inside the account panel. */
.account-order-filters {
    grid-template-columns: minmax(0, 2fr) repeat(4, minmax(0, 1fr));
    align-items: end;
    overflow: visible;
}

.account-order-filters__dates {
    display: grid !important;
    grid-column: 1 / -1 !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
    min-width: 0;
}

.account-order-filters__date,
.account-order-filters__date .form-control,
.account-order-filters > .form-select,
.account-order-filters > .btn {
    min-width: 0;
    width: 100%;
}

.account-order-filters > .btn {
    justify-self: stretch;
}

@media (max-width: 1199.98px) {
    .account-order-filters {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .account-order-filters__search {
        grid-column: 1 / -1;
    }
}

@media (max-width: 767.98px) {
    .account-order-filters,
    .account-order-filters__dates {
        grid-template-columns: 1fr;
    }

    .account-order-filters__dates {
        grid-column: 1 / -1 !important;
    }
}