:root {
    --ink: #005c4e;
    --muted: rgba(0, 92, 78, 0.75);
    --forest: #005c4e;
    --forest-deep: #003830;
    --green: #009a84;
    --mint: #9dd0b6;
    --cream: #fff8f1;
    --paper: #fff8f1;
    --gold: #c19a3d;
    --line: rgba(0, 92, 78, 0.15);
    --shadow: 0 10px 30px rgba(0, 60, 50, 0.15);
    --radius-sm: 8px;
    --radius-md: 16px;
    --radius-lg: 999px;
    --container: 1240px;
    --header-height: 78px;
}

html { font-size: var(--site-base-font-size, 16px); }
body {
    font-family: var(--gx-font, "Inter", sans-serif);
}
h1, h2, h3, h4, h5, h6 {
    font-family: var(--gx-font, "Inter", sans-serif);
}

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; scroll-padding-top: 110px; }
body {
    margin: 0;
    color: var(--ink);
    background: var(--paper);
    font-family: var(--gx-font, "Inter", sans-serif);
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}
body.is-locked { overflow: hidden; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button { color: inherit; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-family: var(--gx-font, "Inter", sans-serif); letter-spacing: -.025em; }
p { line-height: 1.7; }
em { color: var(--green); font-style: normal; }

.container { width: min(calc(100% - 48px), var(--container)); margin-inline: auto; }
.section { padding: 120px 0; }
.mobile-only { display: none !important; }
.sr-only {
    position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.skip-link {
    position: fixed; left: 18px; top: -80px; z-index: 200; padding: 12px 18px;
    border-radius: 999px; color: #fff; background: var(--forest); transition: top .2s ease;
}
.skip-link:focus { top: 18px; }

.eyebrow {
    display: inline-flex; align-items: center; gap: 9px; margin-bottom: 18px;
    color: var(--green); font-size: .76rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase;
}
.eyebrow--light { color: #a8d8c7; }
.text-link {
    display: inline-flex; align-items: center; gap: 10px; color: var(--forest); font-weight: 700;
    border-bottom: 1px solid rgba(10, 63, 53, .28); padding-bottom: 5px;
}
.text-link i { transition: transform .2s ease; }
.text-link:hover i { transform: translateX(4px); }

.button {
    min-height: 52px; display: inline-flex; align-items: center; justify-content: center; gap: 10px;
    border: 1px solid transparent; border-radius: 999px; padding: 0 25px;
    font-size: .92rem; font-weight: 750; cursor: pointer; transition: transform .2s ease, background .2s ease, box-shadow .2s ease;
}
.button:hover { transform: translateY(-2px); }
.button--primary { background: var(--forest); color: #fff; box-shadow: 0 12px 24px rgba(10, 63, 53, .2); }
.button--primary:hover { background: var(--green); box-shadow: 0 16px 30px rgba(10, 63, 53, .25); }
.button--secondary { background: var(--green); color: #fff; }
.button--ghost { background: transparent; color: var(--ink); padding-inline: 6px 18px; }
.button--cream { background: var(--cream); color: var(--forest-deep); }
.button--full { width: 100%; }
.play-icon {
    width: 42px; height: 42px; display: inline-grid; place-items: center; border: 1px solid var(--line); border-radius: 50%; background: #fff;
}
.icon-button {
    width: 44px; height: 44px; display: inline-grid; place-items: center; border: 0; border-radius: 50%;
    background: transparent; cursor: pointer; font-size: 1.3rem; transition: background .2s ease, transform .2s ease;
}
.icon-button:hover { background: var(--cream); transform: translateY(-1px); }

/* Header */
.announcement { position: relative; z-index: 102; background: var(--forest-deep); color: #dcefe7; font-size: .78rem; }
.announcement__inner { height: 32px; display: flex; align-items: center; justify-content: space-between; }
.announcement p { margin: 0; display: flex; align-items: center; gap: 9px; line-height: 1; }
.announcement a { display: flex; align-items: center; gap: 5px; font-weight: 700; }
.announcement__dot { width: 6px; height: 6px; border-radius: 50%; background: #efd068; box-shadow: 0 0 0 5px rgba(239, 208, 104, .12); }
.site-header {
    position: sticky; top: 0; z-index: 100; border-bottom: 1px solid transparent;
    background: rgba(255, 253, 248, .88); backdrop-filter: blur(18px); transition: border-color .2s ease, box-shadow .2s ease;
}
.site-header.is-scrolled { border-color: var(--line); box-shadow: 0 10px 40px rgba(20, 43, 35, .06); }
.nav-shell { min-height: var(--header-height); display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand { flex: 0 0 auto; }
.brand img { width: 158px; height: 55px; object-fit: contain; }
.desktop-nav { display: flex; align-items: center; gap: 36px; margin-left: auto; }
.desktop-nav a { position: relative; font-size: .9rem; font-weight: 650; color: #35433e; }
.desktop-nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -8px; height: 2px; background: var(--green); transition: right .25s ease; }
.desktop-nav a:hover::after { right: 0; }
.nav-actions { display: flex; align-items: center; gap: 3px; margin-left: 24px; }
.cart-button {
    height: 44px; display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--line); border-radius: 999px;
    background: #fff; padding: 0 6px 0 15px; cursor: pointer; font-weight: 700;
}
.cart-button i { font-size: 1.24rem; }
.cart-count { min-width: 30px; height: 30px; display: inline-grid; place-items: center; border-radius: 50%; color: #fff; background: var(--forest); font-size: .75rem; }
.mobile-nav { display: none; }
.search-panel {
    position: absolute; inset: 0; display: flex; align-items: center; background: var(--paper);
    opacity: 0; visibility: hidden; transform: translateY(-10px); transition: .24s ease;
}
.search-panel.is-open { opacity: 1; visibility: visible; transform: translateY(0); }
.search-panel__inner { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 16px; }
.search-panel__inner > i { font-size: 1.45rem; color: var(--green); }
.search-panel input { width: 100%; border: 0; outline: 0; background: transparent; color: var(--ink); font-size: 1.12rem; }
.search-panel input::placeholder { color: #8d9893; }

/* Hero */
.hero {
    position: relative; min-height: calc(100vh - 110px); display: grid; align-items: center; overflow: hidden;
    background:
        radial-gradient(circle at 12% 18%, rgba(221, 239, 229, .9), transparent 30%),
        linear-gradient(135deg, #fbf8ef 0%, #f7f3e7 48%, #f3ecdc 100%);
}
.hero::before {
    content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .18;
    background-image: radial-gradient(rgba(10, 63, 53, .2) .7px, transparent .7px); background-size: 12px 12px;
    mask-image: linear-gradient(to right, #000, transparent 62%);
}
.hero__grid { position: relative; z-index: 2; display: grid; grid-template-columns: 1.03fr .97fr; gap: 80px; align-items: center; padding-block: 78px 104px; }
.hero__copy { max-width: 680px; }
.hero__eyebrow { display: inline-flex; align-items: center; gap: 10px; margin-bottom: 25px; color: var(--forest); font-size: .78rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.pulse-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 7px rgba(13, 120, 104, .1); }
.hero h1 { margin-bottom: 26px; max-width: 720px; font-size: clamp(3.5rem, 6vw, 6.8rem); line-height: .95; font-weight: 650; }
.hero h1 em { display: block; font-weight: 500; }
.hero__lede { max-width: 590px; margin-bottom: 31px; color: #53615c; font-size: 1.08rem; }
.hero__actions { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.hero__proof { margin-top: 45px; display: flex; align-items: center; gap: 16px; }
.hero__proof p { margin: 0; color: var(--muted); font-size: .84rem; line-height: 1.45; }
.hero__proof strong { color: var(--ink); font-weight: 800; }
.avatar-stack { display: flex; padding-left: 8px; }
.avatar-stack span {
    width: 38px; height: 38px; display: grid; place-items: center; margin-left: -8px; border: 3px solid var(--cream); border-radius: 50%;
    color: #fff; background: var(--forest); font-size: .72rem; font-weight: 800;
}
.avatar-stack span:nth-child(2) { background: #b98347; }
.avatar-stack span:nth-child(3) { background: #809650; }
.hero__visual { position: relative; width: min(100%, 560px); justify-self: end; will-change: transform; }
.hero-card { position: relative; height: min(68vh, 650px); min-height: 520px; overflow: hidden; border-radius: 48px 48px 140px 48px; box-shadow: var(--shadow); background: #d8c49d; }
.hero-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s cubic-bezier(.2,.7,.2,1); }
.hero-card:hover img { transform: scale(1.035); }
.hero-card__scrim { position: absolute; inset: 45% 0 0; background: linear-gradient(transparent, rgba(4, 32, 26, .84)); }
.hero-card__caption { position: absolute; left: 32px; right: 32px; bottom: 31px; display: grid; grid-template-columns: 1fr auto; gap: 4px 20px; align-items: end; color: #fff; }
.hero-card__caption span { grid-column: 1; font-size: .72rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #c9e5da; }
.hero-card__caption strong { grid-column: 1; font-family: "Manrope", sans-serif; font-size: 1.55rem; letter-spacing: -.04em; }
.hero-card__caption a { grid-column: 2; grid-row: 1 / 3; width: 54px; height: 54px; display: grid; place-items: center; border-radius: 50%; background: #fff; color: var(--forest); font-size: 1.35rem; }
.floating-note {
    position: absolute; z-index: 3; min-width: 192px; display: flex; align-items: center; gap: 12px; padding: 13px 17px;
    border: 1px solid rgba(255,255,255,.74); border-radius: 18px; background: rgba(255,255,255,.86); box-shadow: 0 18px 40px rgba(20,40,34,.14); backdrop-filter: blur(15px);
}
.floating-note i { width: 38px; height: 38px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 50%; background: var(--mint); color: var(--green); font-size: 1.15rem; }
.floating-note span { color: var(--muted); font-size: .72rem; line-height: 1.35; }
.floating-note strong { display: block; color: var(--ink); font-size: .82rem; }
.floating-note--top { right: -36px; top: 14%; }
.floating-note--bottom { left: -52px; bottom: 18%; }
.hero__orb { position: absolute; border-radius: 50%; filter: blur(1px); opacity: .6; }
.hero__orb--one { width: 300px; height: 300px; right: -130px; top: -100px; border: 1px solid rgba(10,63,53,.15); }
.hero__orb--two { width: 140px; height: 140px; left: 46%; bottom: -70px; background: rgba(213,164,57,.14); }
.hero__scroll { position: absolute; z-index: 3; left: 50%; bottom: 24px; display: flex; align-items: center; gap: 11px; color: #65716c; font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.hero__scroll span { width: 24px; height: 36px; position: relative; border: 1px solid rgba(18,33,29,.3); border-radius: 999px; }
.hero__scroll span::after { content: ""; width: 3px; height: 7px; position: absolute; left: 50%; top: 7px; border-radius: 99px; background: var(--green); transform: translateX(-50%); animation: scrollCue 1.8s infinite; }
@keyframes scrollCue { 0% { opacity: 0; transform: translate(-50%, 0); } 30% { opacity: 1; } 100% { opacity: 0; transform: translate(-50%, 13px); } }

/* Modern editorial hero */
.hero {
    min-height: calc(100svh - 110px);
    background:
        radial-gradient(circle at 17% 24%, rgba(215, 238, 225, .95), transparent 28%),
        radial-gradient(circle at 77% 42%, rgba(230, 200, 123, .17), transparent 30%),
        linear-gradient(128deg, #faf8f0 0%, #f4f3e9 54%, #e9eee5 100%);
}
.hero::before {
    inset: 0; opacity: .33; mask-image: linear-gradient(110deg, #000, transparent 74%);
    background-image:
        linear-gradient(rgba(10, 63, 53, .07) 1px, transparent 1px),
        linear-gradient(90deg, rgba(10, 63, 53, .07) 1px, transparent 1px);
    background-size: 64px 64px;
}
.hero::after {
    content: ""; position: absolute; z-index: 0; width: 420px; height: 420px; right: 13%; top: 17%;
    border: 1px solid rgba(10,63,53,.1); border-radius: 50%; box-shadow: 0 0 0 65px rgba(10,63,53,.025), 0 0 0 130px rgba(10,63,53,.018);
}
.hero__mesh {
    position: absolute; z-index: 0; width: 620px; height: 620px; left: -340px; top: -320px; border-radius: 50%;
    background: radial-gradient(circle at 70% 70%, rgba(13,120,104,.22), rgba(13,120,104,0) 64%); filter: blur(8px);
}
.hero__word {
    position: absolute; z-index: 0; left: -1.2vw; bottom: -5.7vw; color: transparent;
    -webkit-text-stroke: 1px rgba(10,63,53,.07); font-family: "Manrope", sans-serif;
    font-size: 15vw; font-weight: 800; letter-spacing: -.09em; line-height: .8; user-select: none;
}
.hero__grid { grid-template-columns: .9fr 1.1fr; gap: 58px; padding-block: 62px 70px; }
.hero__copy { position: relative; z-index: 2; max-width: 650px; }
.hero__eyebrow { margin-bottom: 29px; }
.hero h1 { margin-bottom: 27px; font-size: clamp(3.7rem, 5.75vw, 6.65rem); line-height: .9; letter-spacing: -.07em; }
.hero h1 span { display: block; }
.hero h1 span:last-child { margin-top: 7px; font-size: .61em; letter-spacing: -.055em; }
.hero h1 em { display: block; color: var(--green); font-weight: 650; }
.hero__lede { max-width: 555px; font-size: 1.02rem; }
.hero__actions { gap: 24px; }
.hero__story-link { display: inline-flex; align-items: center; gap: 12px; }
.hero__story-link small { display: block; color: #84908a; font-size: .62rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.hero__story-link > span:last-child { color: var(--ink); font-size: .78rem; font-weight: 800; line-height: 1.45; }
.hero__metrics { display: flex; align-items: stretch; gap: 25px; margin-top: 43px; padding-top: 25px; border-top: 1px solid var(--line); }
.hero__metrics > div { display: flex; align-items: center; gap: 10px; }
.hero__metrics strong { font-family: "Manrope", sans-serif; font-size: 1.55rem; letter-spacing: -.06em; }
.hero__metrics span { color: #69756f; font-size: .66rem; font-weight: 700; line-height: 1.35; }
.hero__metrics > div + div { padding-left: 24px; border-left: 1px solid var(--line); }
.hero__metrics .hero__metric-note { margin-left: auto; }
.hero__metric-note i { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; color: var(--green); background: var(--mint); }

.hero-showcase {
    --hero-rx: 0deg; --hero-ry: 0deg;
    position: relative; z-index: 2; height: min(68vh, 650px); min-height: 560px;
    display: grid; grid-template-columns: minmax(0, 1.24fr) minmax(185px, .76fr); gap: 14px;
    perspective: 1200px; transform: rotateX(var(--hero-rx)) rotateY(var(--hero-ry));
    transition: transform .24s ease-out; transform-style: preserve-3d;
}
.hero-showcase__side { display: grid; grid-template-rows: 1fr 1fr; gap: 14px; min-width: 0; }
.hero-tile { position: relative; min-width: 0; overflow: hidden; color: #fff; background: #cbbd9f; box-shadow: 0 25px 65px rgba(25,47,39,.13); }
.hero-tile--main { border-radius: 34px 12px 34px 110px; }
.hero-tile--small:first-child { border-radius: 12px 34px 12px 12px; }
.hero-tile--small:last-child { border-radius: 12px 12px 90px 12px; }
.hero-tile img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s cubic-bezier(.2,.75,.2,1), filter .5s ease; }
.hero-tile--main img { object-position: 53% center; }
.hero-tile--small img { filter: saturate(.88); }
.hero-tile:hover img { transform: scale(1.055); filter: saturate(1.05); }
.hero-tile::after { content: ""; position: absolute; inset: 32% 0 0; background: linear-gradient(transparent, rgba(3,28,22,.87)); }
.hero-tile__wash { position: absolute; inset: 0; background: linear-gradient(145deg, rgba(224,239,229,.15), transparent 40%); }
.hero-tile__content { position: absolute; z-index: 3; left: 24px; right: 19px; bottom: 23px; display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 3px 12px; }
.hero-tile__content small { grid-column: 1; color: #bcded2; font-size: .59rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.hero-tile__content strong { grid-column: 1; font-family: "Manrope", sans-serif; font-size: 1.3rem; letter-spacing: -.045em; }
.hero-tile--small .hero-tile__content { left: 15px; right: 13px; bottom: 14px; }
.hero-tile--small .hero-tile__content strong { font-size: .95rem; }
.hero-tile--small .hero-tile__content small { font-size: .5rem; }
.hero-tile__arrow { grid-column: 2; grid-row: 1 / 3; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; color: var(--forest); background: rgba(255,255,255,.94); transition: transform .25s ease; }
.hero-tile--small .hero-tile__arrow { width: 31px; height: 31px; }
.hero-tile:hover .hero-tile__arrow { transform: rotate(8deg) translate(2px,-2px); }
.hero-showcase__seal {
    position: absolute; z-index: 4; left: 53.5%; top: 50%; width: 104px; height: 104px;
    display: grid; place-items: center; align-content: center; gap: 4px; border: 6px solid rgba(247,243,233,.9); border-radius: 50%;
    color: var(--forest); background: #edcd73; box-shadow: 0 18px 42px rgba(28,42,33,.2); transform: translate(-50%,-50%) rotate(-9deg);
}
.hero-showcase__seal i { font-size: 1.25rem; }
.hero-showcase__seal span { text-align: center; font-family: "Manrope"; font-size: .64rem; font-weight: 800; letter-spacing: .08em; line-height: 1.05; text-transform: uppercase; }
.hero-showcase__index { position: absolute; z-index: 5; right: -34px; top: 50%; display: flex; flex-direction: column; align-items: center; gap: 8px; color: var(--forest); font-size: .54rem; font-weight: 800; transform: translateY(-50%); }
.hero-showcase__index b { width: 1px; height: 50px; background: rgba(10,63,53,.3); }
.hero__rail { position: absolute; z-index: 2; left: 18px; top: 50%; display: flex; align-items: center; gap: 12px; color: rgba(10,63,53,.48); font-size: .52rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; transform: translate(-43%,-50%) rotate(-90deg); }
.hero__rail b { width: 58px; height: 1px; background: rgba(10,63,53,.28); }

/* Ticker */
.ticker { overflow: hidden; background: var(--forest); color: #e8f3ed; }
.ticker__track { width: max-content; display: flex; animation: ticker 27s linear infinite; }
.ticker span { display: flex; align-items: center; gap: 28px; padding: 18px 28px; font-size: .77rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.ticker i { color: #e1bd62; font-style: normal; }
@keyframes ticker { to { transform: translateX(-50%); } }

/* Shared section patterns */
.section-heading { display: grid; grid-template-columns: 1.25fr .75fr; gap: 80px; align-items: end; margin-bottom: 55px; }
.section-heading h2, .story h2, .standards h2, .ritual h2, .faq h2, .product-detail h2 {
    margin: 0; font-size: clamp(2.55rem, 4.4vw, 5.1rem); line-height: 1.02; font-weight: 600;
}
.section-heading p { max-width: 430px; margin: 0 0 8px; color: var(--muted); }

/* Products */
.collection { background: var(--paper); }
.filter-row { display: flex; gap: 10px; margin-bottom: 34px; overflow-x: auto; scrollbar-width: none; }
.filter-row::-webkit-scrollbar { display: none; }
.filter-pill { flex: 0 0 auto; min-height: 42px; padding: 0 17px; border: 1px solid var(--line); border-radius: 999px; background: #fff; cursor: pointer; color: #53605b; font-size: .84rem; font-weight: 700; transition: .22s ease; }
.filter-pill span { margin-left: 5px; opacity: .6; }
.filter-pill:hover, .filter-pill.is-active { color: #fff; border-color: var(--forest); background: var(--forest); }
.product-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; }
.product-grid--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.product-card { min-width: 0; border: 1px solid var(--line); border-radius: 24px; overflow: hidden; background: #fff; transition: transform .32s ease, box-shadow .32s ease, opacity .2s ease; }
.product-card:hover { transform: translateY(-7px); box-shadow: 0 24px 50px rgba(25,47,39,.1); }
.product-card[hidden] { display: none; }
.product-card__media { position: relative; display: block; aspect-ratio: 1 / 1.07; overflow: hidden; background: color-mix(in srgb, var(--product-accent) 11%, #f4efe4); }
.product-card__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 64%, rgba(6, 35, 29, .36)); opacity: 0; transition: opacity .3s ease; }
.product-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .55s cubic-bezier(.2,.75,.2,1); }
.product-card:hover .product-card__media img { transform: scale(1.045); }
.product-card:hover .product-card__media::after { opacity: 1; }
.product-card__tag, .product-card__discount { position: absolute; z-index: 2; top: 14px; padding: 7px 10px; border-radius: 999px; font-size: .64rem; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; }
.product-card__tag { left: 14px; background: rgba(255,255,255,.88); backdrop-filter: blur(10px); }
.product-card__discount { right: 14px; background: var(--forest); color: #fff; }
.product-card__view { position: absolute; z-index: 3; left: 18px; right: 18px; bottom: 16px; display: flex; align-items: center; justify-content: space-between; color: #fff; font-size: .78rem; font-weight: 700; opacity: 0; transform: translateY(12px); transition: .28s ease; }
.product-card:hover .product-card__view { opacity: 1; transform: translateY(0); }
.product-card__body { padding: 19px; }
.product-card__meta { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 8px; color: #75807c; font-size: .69rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.product-card h3 { margin: 0 0 18px; font-size: 1.06rem; line-height: 1.3; }
.product-card h3 a:hover { color: var(--green); }
.product-card__buy { display: flex; align-items: center; justify-content: space-between; }
.product-card__buy p { margin: 0; line-height: 1.2; }
.product-card__buy strong { font-size: 1.15rem; }
.product-card__buy s { margin-left: 5px; color: #9aa39f; font-size: .78rem; }
.add-button { width: 42px; height: 42px; display: grid; place-items: center; border: 0; border-radius: 50%; color: #fff; background: var(--green); cursor: pointer; font-size: 1.15rem; transition: transform .2s ease, background .2s ease; }
.add-button:hover { transform: rotate(5deg) scale(1.08); background: var(--forest); }
.add-button.is-added { background: var(--gold); }
.product-empty { padding: 50px; text-align: center; color: var(--muted); border: 1px dashed var(--line); border-radius: var(--radius-md); }

/* Story */
.story { background: var(--cream); }
.story__grid { display: grid; grid-template-columns: 1.07fr .93fr; gap: 90px; align-items: center; }
.story__media { position: relative; }
.story__media::before { content: ""; position: absolute; width: 52%; height: 72%; left: -22px; bottom: -22px; border-radius: 34px; background: #d4e6da; }
.story__media img { position: relative; width: 100%; aspect-ratio: 1.22 / 1; object-fit: cover; border-radius: 36px; box-shadow: var(--shadow); }
.story__stamp { position: absolute; right: -28px; bottom: 38px; width: 122px; height: 122px; display: grid; place-items: center; text-align: center; border-radius: 50%; color: var(--forest); background: #efca68; transform: rotate(8deg); box-shadow: 0 20px 40px rgba(35,42,30,.18); }
.story__stamp span { position: absolute; top: 24px; font-size: .62rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; }
.story__stamp strong { margin-top: 15px; font-size: 1rem; line-height: .92; text-transform: uppercase; }
.story__lead { max-width: 580px; margin: 27px 0 33px; color: var(--muted); font-size: 1.04rem; }
.story-list { border-top: 1px solid var(--line); }
.story-list__item { display: grid; grid-template-columns: 48px 1fr; gap: 17px; padding: 22px 0; border-bottom: 1px solid var(--line); }
.story-list__item > span { color: var(--green); font-size: .72rem; font-weight: 800; }
.story-list__item h3 { margin: 0 0 4px; font-size: 1rem; letter-spacing: -.02em; }
.story-list__item p { margin: 0; color: var(--muted); font-size: .84rem; line-height: 1.55; }
.story__copy .text-link { margin-top: 27px; }

/* Standards */
.standards { position: relative; overflow: hidden; color: #fff; background: var(--forest-deep); }
.standards::before { content: "PURE"; position: absolute; right: -1vw; top: -70px; color: transparent; -webkit-text-stroke: 1px rgba(255,255,255,.05); font-family: "Manrope"; font-size: 25vw; font-weight: 800; line-height: 1; }
.standards__intro { position: relative; z-index: 2; max-width: 760px; margin-bottom: 62px; }
.standards h2 em { color: #e4c46c; }
.standards-grid { position: relative; z-index: 2; display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.standard-card { min-height: 335px; display: flex; flex-direction: column; padding: 28px; border: 1px solid rgba(255,255,255,.12); border-radius: 26px; background: rgba(255,255,255,.04); transition: transform .3s ease, background .3s ease; }
.standard-card:hover { transform: translateY(-7px); background: rgba(255,255,255,.08); }
.standard-card__number { align-self: flex-end; color: rgba(255,255,255,.34); font-size: .7rem; font-weight: 800; }
.standard-card > i { width: 58px; height: 58px; display: grid; place-items: center; margin: 28px 0 auto; border-radius: 50%; background: #d4e9df; color: var(--forest); font-size: 1.55rem; }
.standard-card h3 { margin: 22px 0 9px; font-size: 1.15rem; }
.standard-card p { margin: 0; color: #a9beb7; font-size: .86rem; line-height: 1.62; }

/* Ritual */
.ritual { background: #f1ebdd; }
.ritual__grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 120px; align-items: start; }
.ritual__copy { position: sticky; top: 140px; }
.ritual__copy p { max-width: 470px; margin: 27px 0 31px; color: var(--muted); }
.ritual__steps { display: grid; gap: 18px; }
.ritual-step { min-height: 170px; display: grid; grid-template-columns: 74px 1fr; gap: 23px; align-items: center; padding: 30px; border: 1px solid rgba(10,63,53,.12); border-radius: 28px; background: rgba(255,255,255,.54); }
.ritual-step > span { width: 65px; height: 65px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: var(--green); font-family: "Manrope"; font-size: 1.2rem; font-weight: 800; }
.ritual-step strong { display: block; margin-bottom: 7px; font-family: "Manrope"; font-size: 1.18rem; letter-spacing: -.03em; }
.ritual-step p { margin: 0; color: var(--muted); font-size: .9rem; }

/* Journal */
.journal { background: var(--paper); }
.journal-grid { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 20px; }
.journal-card { overflow: hidden; border: 1px solid var(--line); border-radius: 26px; background: #fff; }
.journal-card__art { height: 250px; position: relative; display: grid; place-items: center; overflow: hidden; color: rgba(255,255,255,.92); }
.journal-card__art::before, .journal-card__art::after { content: ""; position: absolute; border-radius: 50%; border: 1px solid rgba(255,255,255,.22); }
.journal-card__art::before { width: 240px; height: 240px; }
.journal-card__art::after { width: 150px; height: 150px; }
.journal-card__art i { position: relative; z-index: 2; font-size: 4.5rem; }
.journal-card__art span { position: absolute; left: 22px; bottom: 15px; z-index: 2; font-family: "Manrope"; font-size: 3.5rem; font-weight: 800; opacity: .22; }
.journal-card__art--ghee { background: linear-gradient(145deg, #b67b2f, #e0af4b); }
.journal-card__art--honey { background: linear-gradient(145deg, #744826, #b47436); }
.journal-card__art--sugar { background: linear-gradient(145deg, #637b3f, #9cab68); }
.journal-card > div:last-child { padding: 25px; }
.journal-card__meta { display: block; margin-bottom: 12px; color: var(--green); font-size: .68rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.journal-card h3 { min-height: 72px; margin-bottom: 21px; font-size: 1.14rem; line-height: 1.4; }
.journal-card a { display: inline-flex; align-items: center; gap: 7px; font-size: .81rem; font-weight: 800; }

/* FAQ */
.faq { border-top: 1px solid var(--line); background: #f9f6ee; }
.faq__grid { display: grid; grid-template-columns: .72fr 1.28fr; gap: 110px; align-items: start; }
.faq__intro { position: sticky; top: 140px; }
.faq__intro h2 { margin-bottom: 22px; font-size: clamp(2.4rem, 4vw, 4.4rem); }
.faq__intro p { max-width: 370px; color: var(--muted); }
.accordion details, .product-detail__content details { border-bottom: 1px solid var(--line); }
.accordion summary, .product-detail__content summary { min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 20px; cursor: pointer; list-style: none; font-family: "Manrope"; font-size: 1.03rem; font-weight: 700; letter-spacing: -.02em; }
.accordion summary::-webkit-details-marker, .product-detail__content summary::-webkit-details-marker { display: none; }
.accordion summary i, .product-detail__content summary i { flex: 0 0 auto; transition: transform .25s ease; }
.accordion details[open] summary i, .product-detail__content details[open] summary i { transform: rotate(45deg); }
.accordion details p, .product-detail__content details p { max-width: 650px; margin: -3px 0 25px; color: var(--muted); font-size: .9rem; }

/* Closing */
.closing-cta { position: relative; padding: 112px 0; overflow: hidden; color: #fff; text-align: center; background: var(--green); }
.closing-cta__inner { position: relative; z-index: 2; }
.closing-cta h2 { margin-bottom: 15px; font-size: clamp(3rem, 6vw, 6.5rem); line-height: 1; }
.closing-cta p { color: #cbe5dc; margin-bottom: 30px; }
.closing-cta__ring { position: absolute; border: 1px solid rgba(255,255,255,.13); border-radius: 50%; }
.closing-cta__ring--one { width: 520px; height: 520px; left: -200px; top: -260px; }
.closing-cta__ring--two { width: 660px; height: 660px; right: -290px; bottom: -420px; }

/* Footer */
.site-footer { padding: 80px 0 28px; color: #d5e4df; background: #061e19; }
.footer-grid { display: grid; grid-template-columns: 1.3fr .7fr .85fr 1.15fr; gap: 60px; }
.footer-brand img { width: 170px; height: 72px; object-fit: contain; filter: brightness(0) invert(1); opacity: .92; }
.footer-brand p { max-width: 310px; color: #8fa59e; font-size: .85rem; }
.social-links { display: flex; gap: 8px; margin-top: 22px; }
.social-links a { width: 39px; height: 39px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.15); border-radius: 50%; transition: .2s ease; }
.social-links a:hover { color: var(--forest-deep); background: #fff; }
.footer-links { display: flex; flex-direction: column; align-items: flex-start; gap: 11px; }
.footer-links h2 { margin: 7px 0 13px; color: #fff; font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; }
.footer-links a { color: #8fa59e; font-size: .84rem; transition: color .2s ease; }
.footer-links a:hover { color: #fff; }
.footer-note { padding: 25px; border: 1px solid rgba(255,255,255,.12); border-radius: 24px; background: rgba(255,255,255,.04); }
.footer-note h2 { margin-bottom: 22px; color: #fff; font-size: 1.35rem; line-height: 1.35; }
.footer-note .text-link { color: #c8ddd6; border-color: rgba(255,255,255,.25); font-size: .8rem; }
.footer-bottom { display: flex; justify-content: space-between; align-items: center; gap: 30px; margin-top: 64px; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.1); color: #7d938b; font-size: .72rem; }
.footer-bottom p { margin: 0; }
.footer-bottom div { display: flex; gap: 24px; }

/* Cart and toast */
.drawer-backdrop { position: fixed; inset: 0; z-index: 150; background: rgba(4,25,20,.54); opacity: 0; visibility: hidden; backdrop-filter: blur(3px); transition: .28s ease; }
.drawer-backdrop.is-open { opacity: 1; visibility: visible; }
.cart-drawer { position: fixed; z-index: 160; top: 0; right: 0; width: min(450px, 100%); height: 100dvh; display: flex; flex-direction: column; padding: 26px; background: var(--paper); transform: translateX(105%); transition: transform .36s cubic-bezier(.22,.74,.24,1); }
.cart-drawer.is-open { transform: translateX(0); }
.cart-drawer__header { display: flex; align-items: flex-start; justify-content: space-between; padding-bottom: 20px; border-bottom: 1px solid var(--line); }
.cart-drawer__header .eyebrow { margin-bottom: 4px; font-size: .62rem; }
.cart-drawer__header h2 { margin: 0; font-size: 1.65rem; }
.cart-items { flex: 1; overflow-y: auto; padding: 8px 0; }
.cart-item { display: grid; grid-template-columns: 76px 1fr auto; gap: 14px; align-items: center; padding: 16px 0; border-bottom: 1px solid var(--line); }
.cart-item img { width: 76px; height: 86px; object-fit: cover; border-radius: 12px; }
.cart-item h3 { margin: 0 0 5px; font-size: .85rem; letter-spacing: -.02em; }
.cart-item p { margin: 0; color: var(--green); font-size: .84rem; font-weight: 800; }
.cart-item__qty { display: inline-flex; align-items: center; gap: 8px; margin-top: 9px; border: 1px solid var(--line); border-radius: 999px; padding: 3px; }
.cart-item__qty button { width: 24px; height: 24px; border: 0; border-radius: 50%; background: var(--cream); cursor: pointer; }
.cart-item__qty span { min-width: 16px; text-align: center; font-size: .72rem; font-weight: 800; }
.cart-item__remove { border: 0; background: transparent; cursor: pointer; color: #8f9b96; font-size: 1rem; }
.cart-empty { flex: 1; display: grid; place-items: center; align-content: center; text-align: center; padding: 30px; }
.cart-empty > i { margin-bottom: 18px; color: var(--green); font-size: 3.6rem; }
.cart-empty h3 { margin-bottom: 5px; }
.cart-empty p { max-width: 260px; color: var(--muted); font-size: .85rem; }
.cart-summary { padding-top: 18px; border-top: 1px solid var(--line); }
.cart-summary__line { display: flex; justify-content: space-between; margin-bottom: 4px; font-size: 1.05rem; }
.cart-summary p { margin-bottom: 16px; color: var(--muted); font-size: .72rem; }
.toast { position: fixed; z-index: 220; left: 50%; bottom: 24px; padding: 13px 18px; border-radius: 999px; color: #fff; background: var(--forest-deep); box-shadow: 0 15px 35px rgba(5,34,28,.25); font-size: .8rem; font-weight: 700; opacity: 0; visibility: hidden; transform: translate(-50%, 18px); transition: .25s ease; }
.toast.is-visible { opacity: 1; visibility: visible; transform: translate(-50%, 0); }

/* Complete product page */
.product-page--commerce { background: #fffefa; }
.product-commerce-hero { padding: 32px 0 76px; background: radial-gradient(circle at 0 8%, rgba(228,242,234,.9), transparent 25%), linear-gradient(180deg, #fbf8f0, #fffefa); }
.breadcrumbs { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-bottom: 28px; color: #79847f; font-size: .72rem; }
.breadcrumbs i { font-size: .6rem; }
.breadcrumbs a:hover { color: var(--green); }
.product-commerce-hero__grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(430px, .95fr); gap: clamp(48px, 6vw, 86px); align-items: start; }
.product-media { min-width: 0; }
.product-media__stage { position: relative; overflow: hidden; aspect-ratio: 1 / .93; border: 1px solid rgba(18,33,29,.08); border-radius: 34px; background: color-mix(in srgb, var(--product-accent) 11%, #f2eee4); box-shadow: 0 28px 70px rgba(26,46,39,.12); }
.product-media__stage::after { content: ""; position: absolute; inset: auto -15% -33% 24%; height: 50%; border-radius: 50%; background: color-mix(in srgb, var(--product-accent) 16%, transparent); filter: blur(55px); pointer-events: none; }
.product-media__stage > img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s cubic-bezier(.2,.7,.2,1), opacity .22s ease; }
.product-media__stage:hover > img { transform: scale(1.035); }
.product-media__stage > img.is-changing { opacity: .35; }
.product-media__discount { position: absolute; z-index: 3; top: 19px; left: 19px; padding: 8px 11px; border-radius: 999px; color: #fff; background: #f0642e; box-shadow: 0 9px 20px rgba(240,100,46,.22); font-size: .65rem; font-weight: 800; letter-spacing: .05em; }
.product-media__wish { position: absolute; z-index: 3; top: 16px; right: 16px; width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.72); border-radius: 50%; color: var(--forest); background: rgba(255,255,255,.88); backdrop-filter: blur(12px); cursor: pointer; font-size: 1.15rem; box-shadow: 0 8px 22px rgba(23,45,37,.1); }
.product-media__wish.is-saved { color: #fff; background: #d84f50; }
.product-media__zoom { position: absolute; z-index: 2; left: 18px; bottom: 17px; display: inline-flex; align-items: center; gap: 7px; padding: 8px 11px; border-radius: 999px; color: #fff; background: rgba(6,36,29,.67); backdrop-filter: blur(12px); font-size: .63rem; font-weight: 700; }
.product-media__thumbs { display: flex; gap: 11px; margin-top: 13px; padding: 2px 2px 9px; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: thin; scrollbar-color: #a8c6b9 transparent; }
.product-media__thumb { min-width: 0; flex: 0 0 158px; scroll-snap-align: start; display: grid; grid-template-columns: 46px 1fr; align-items: center; gap: 9px; padding: 7px; border: 1px solid var(--line); border-radius: 14px; color: var(--muted); background: rgba(255,255,255,.72); cursor: pointer; text-align: left; font-size: .64rem; font-weight: 700; transition: border-color .2s, transform .2s, background .2s; }
.product-media__thumb:hover { transform: translateY(-2px); }
.product-media__thumb.is-active { border-color: var(--green); color: var(--forest); background: #eef7f1; box-shadow: inset 0 0 0 1px var(--green); }
.product-media__thumb img { width: 46px; height: 46px; object-fit: cover; border-radius: 9px; background: var(--cream); }
.product-buybox { min-width: 0; padding-top: 6px; }
.product-buybox__topline { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.product-buybox__category { padding: 7px 10px; border-radius: 999px; color: #087048; background: #e7f4ec; font-size: .66rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.product-rating { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.product-rating > span, .review-stars, .related-product-rating span { color: #d9a62d; letter-spacing: .05em; }
.product-rating strong { font-size: .74rem; }
.product-rating small { color: #7b8681; font-size: .66rem; }
.product-buybox h1 { margin: 0 0 18px; font-size: clamp(2.6rem, 4vw, 4.5rem); line-height: .98; letter-spacing: -.065em; }
.product-buybox__description { max-width: 610px; margin-bottom: 20px; color: var(--muted); font-size: .94rem; }
.product-buybox__price { display: flex; align-items: center; flex-wrap: wrap; gap: 11px; }
.product-buybox__price strong { font-family: "Manrope"; font-size: 2rem; letter-spacing: -.055em; }
.product-buybox__price s { color: #97a19d; font-size: .92rem; }
.product-buybox__price span { padding: 5px 8px; border-radius: 7px; color: #0c754a; background: #e9f6ed; font-size: .64rem; font-weight: 800; }
.product-buybox__tax { margin: 3px 0 22px; color: #87918d; font-size: .65rem; }
.product-pack { padding: 18px 0 17px; border-top: 1px solid var(--line); }
.product-pack__heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 10px; }
.product-pack__heading span { font-size: .73rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.product-pack__heading small { color: var(--muted); font-size: .64rem; }
.product-pack__option { min-height: 43px; display: inline-flex; align-items: center; gap: 7px; padding: 0 16px; border: 1px solid var(--green); border-radius: 10px; color: var(--forest); background: #ecf6ef; cursor: pointer; font-size: .72rem; font-weight: 800; }
.product-pack__options { display: flex; flex-wrap: wrap; gap: 8px; }
.product-pack__option:not(.is-active) { border-color: var(--line); color: #53635c; background: #fff; }
.product-pack__option small { margin-left: 3px; color: #74827b; font-size: .57rem; font-weight: 700; }
.product-pack__option:hover { border-color: var(--green); transform: translateY(-1px); }
.product-stock { display: flex; align-items: center; gap: 8px; margin-bottom: 13px; font-size: .68rem; font-weight: 700; }
.product-stock > span { width: 7px; height: 7px; border-radius: 50%; }
.product-stock.is-in-stock { color: #0c754a; }
.product-stock.is-in-stock > span { background: #1cad67; box-shadow: 0 0 0 5px rgba(28,173,103,.11); }
.product-stock.is-out-of-stock { color: #b03d34; }
.product-stock.is-out-of-stock > span { background: #d9594d; }
.product-commerce-actions { display: grid; grid-template-columns: 116px minmax(0, 1fr) minmax(120px, .52fr); gap: 10px; }
.quantity-control { display: grid; grid-template-columns: 40px 34px 40px; align-items: center; border: 1px solid var(--line); border-radius: 999px; background: #fff; }
.quantity-control button { height: 40px; border: 0; background: transparent; cursor: pointer; }
.quantity-control span { text-align: center; font-weight: 800; }
.quantity-control--commerce { height: 54px; border-radius: 13px; }
.quantity-control--commerce button { height: 52px; }
.product-add--commerce { width: 100%; border-radius: 13px; color: #fff; background: linear-gradient(135deg, #0c8154, #075e3d); box-shadow: 0 13px 26px rgba(8,109,68,.22); }
.product-buy-now { width: 100%; border-color: #0a7148; border-radius: 13px; color: #086440; background: #eff7f1; }
.product-add--commerce:disabled, .product-buy-now:disabled { opacity: .5; cursor: not-allowed; transform: none; }
.product-delivery { display: grid; grid-template-columns: 38px minmax(110px, 1fr) 112px auto; align-items: center; gap: 10px; margin-top: 17px; padding: 12px; border: 1px solid var(--line); border-radius: 15px; background: rgba(255,255,255,.8); }
.product-delivery__icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; color: var(--green); background: var(--mint); font-size: 1.1rem; }
.product-delivery label strong, .product-delivery label span { display: block; }
.product-delivery label strong { font-size: .7rem; }
.product-delivery label span { margin-top: 2px; color: var(--muted); font-size: .57rem; }
.product-delivery input { width: 100%; height: 39px; padding: 0 10px; border: 1px solid var(--line); border-radius: 9px; outline: 0; background: #fff; font-size: .68rem; }
.product-delivery input:focus { border-color: var(--green); box-shadow: 0 0 0 3px rgba(13,120,104,.08); }
.product-delivery button { height: 39px; padding: 0 12px; border: 0; border-radius: 9px; color: #fff; background: var(--forest); cursor: pointer; font-size: .66rem; font-weight: 800; }
.product-delivery > p { grid-column: 2 / -1; margin: -3px 0 0; color: #087048; font-size: .61rem; line-height: 1.4; }
.product-buybox__assurances { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 16px; }
.product-buybox__assurances > div { min-width: 0; display: grid; grid-template-columns: 32px 1fr; align-items: center; gap: 7px; padding: 9px; border-radius: 12px; background: #f7f6f0; }
.product-buybox__assurances i { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 9px; color: var(--green); background: #fff; }
.product-buybox__assurances span { color: var(--muted); font-size: .54rem; line-height: 1.35; }
.product-buybox__assurances strong { display: block; color: var(--ink); font-size: .6rem; }
.product-buybox__meta { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 17px; padding-top: 15px; border-top: 1px solid var(--line); color: var(--muted); font-size: .61rem; }
.product-buybox__meta strong { color: var(--ink); }
.product-section-nav { position: sticky; z-index: 20; top: calc(var(--header-height) + 35px); border-block: 1px solid var(--line); background: rgba(255,253,248,.9); backdrop-filter: blur(16px); }
.product-section-nav .container { display: flex; justify-content: center; overflow-x: auto; scrollbar-width: none; }
.product-section-nav .container::-webkit-scrollbar { display: none; }
.product-section-nav a { flex: 0 0 auto; padding: 17px 24px; color: #5e6c66; font-size: .68rem; font-weight: 800; }
.product-section-nav a:hover { color: var(--green); background: #eef6f1; }
.product-overview { background: #fffefa; }
.product-overview__grid { display: grid; grid-template-columns: .78fr 1.22fr; gap: clamp(60px, 9vw, 130px); }
.product-overview__heading { position: sticky; top: 175px; align-self: start; }
.product-overview h2, .product-ingredients h2, .product-use h2, .product-faq h2 { margin-bottom: 19px; font-size: clamp(2.7rem, 4.8vw, 5.25rem); line-height: 1; }
.product-overview__heading > p { max-width: 440px; color: var(--muted); font-size: .88rem; }
.product-overview__points { display: grid; }
.product-overview__points article { display: grid; grid-template-columns: 70px 1fr; gap: 27px; padding: 28px 0; border-bottom: 1px solid var(--line); }
.product-overview__points article:first-child { padding-top: 7px; }
.product-overview__points article > span { color: #8bb7a8; font-family: "Manrope"; font-size: 2.2rem; font-weight: 800; letter-spacing: -.07em; }
.product-overview__points article p { margin: 0; color: #35453f; font-family: "Manrope"; font-size: clamp(1.15rem, 2vw, 1.55rem); font-weight: 600; letter-spacing: -.035em; line-height: 1.5; }
.product-comparison { padding-top: 20px; background: #fffefa; }
.product-comparison__shell { overflow: hidden; display: grid; grid-template-columns: minmax(260px, .7fr) minmax(0, 1.3fr); gap: 50px; padding: clamp(28px, 5vw, 55px); border: 1px solid #dfe7e0; border-radius: 30px; background: linear-gradient(145deg, #f2f8f4, #fff); box-shadow: 0 20px 55px rgba(23,51,36,.06); }
.product-comparison__heading h2 { margin-bottom: 15px; font-size: clamp(2.2rem, 4vw, 4rem); line-height: 1; }
.product-comparison__heading p { color: var(--muted); font-size: .75rem; }
.product-comparison__table { min-width: 0; overflow: hidden; border: 1px solid #dfe7e0; border-radius: 18px; background: #fff; }
.product-comparison__row { display: grid; grid-template-columns: .8fr 1fr 1fr; gap: 12px; align-items: center; min-height: 58px; padding: 10px 15px; border-bottom: 1px solid #e8ede9; font-size: .68rem; }
.product-comparison__row:last-child { border-bottom: 0; }
.product-comparison__row > span:first-child { color: #728078; font-weight: 700; }
.product-comparison__row strong { color: #174933; }
.product-comparison__row strong i { margin-right: 6px; color: #11915a; }
.product-comparison__row--head { color: #fff; background: #073d2d; }
.product-comparison__row--head > span:first-child, .product-comparison__row--head strong { color: #fff; }
.product-ingredients { padding-top: 20px; background: #fffefa; }
.product-ingredients__shell { position: relative; overflow: hidden; display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 65px; padding: clamp(42px, 6vw, 76px); border-radius: 34px; color: #fff; background: radial-gradient(circle at 90% 10%, color-mix(in srgb, var(--product-accent) 35%, transparent), transparent 36%), linear-gradient(140deg, #063c30, #072b24); }
.product-ingredients__shell::after { content: "INGREDIENTS"; position: absolute; right: -15px; bottom: -35px; color: rgba(255,255,255,.035); font-family: "Manrope"; font-size: clamp(5rem, 13vw, 10rem); font-weight: 800; letter-spacing: -.08em; pointer-events: none; }
.product-ingredients .eyebrow { color: #a6dbc9; }
.product-ingredients h2 { max-width: 560px; }
.product-ingredients h2 em { color: #f1cf73; }
.product-ingredients__shell > div:first-child > p { max-width: 520px; color: #bbd3ca; font-size: .83rem; }
.ingredient-list { position: relative; z-index: 1; display: flex; align-content: center; align-items: center; flex-wrap: wrap; gap: 10px; }
.ingredient-list span { display: inline-flex; align-items: center; gap: 8px; padding: 12px 15px; border: 1px solid rgba(255,255,255,.13); border-radius: 999px; color: #e4f2ed; background: rgba(255,255,255,.075); backdrop-filter: blur(10px); font-size: .72rem; font-weight: 700; }
.ingredient-list i { color: #9ad1b9; }
.ingredient-note { position: relative; z-index: 1; grid-column: 1 / -1; display: grid; grid-template-columns: 42px 1fr; gap: 12px; align-items: center; padding-top: 25px; border-top: 1px solid rgba(255,255,255,.12); }
.ingredient-note > i { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 13px; color: #072d25; background: #f0cf78; font-size: 1.2rem; }
.ingredient-note p { margin: 0; color: #a9c8bb; font-size: .66rem; }
.ingredient-note strong { display: block; margin-bottom: 2px; color: #fff; font-size: .73rem; }
.product-benefits { background: #f5f3eb; }
.product-section-heading { align-items: end; }
.product-section-heading > p { max-width: 430px; margin: 0; color: var(--muted); font-size: .82rem; }
.product-benefit-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; }
.product-benefit-card { position: relative; min-height: 230px; overflow: hidden; padding: 25px; border: 1px solid #e0e5df; border-radius: 22px; background: rgba(255,255,255,.82); transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease; }
.product-benefit-card:hover { transform: translateY(-5px); border-color: #b8d3c5; box-shadow: 0 18px 40px rgba(27,54,42,.08); }
.product-benefit-card > i { width: 50px; height: 50px; display: grid; place-items: center; margin-bottom: 27px; border-radius: 15px; color: #08734a; background: #e5f2e9; font-size: 1.5rem; }
.product-benefit-card h3 { margin: 0 0 8px; font-size: 1.08rem; }
.product-benefit-card p { margin: 0; color: var(--muted); font-size: .72rem; line-height: 1.6; }
.product-benefit-card__number { position: absolute; top: 22px; right: 22px; color: #c3ccc7; font-family: "Manrope"; font-size: .72rem; font-weight: 800; }
.product-benefit-card--feature { color: #fff; border-color: transparent; background: radial-gradient(circle at 90% 0, rgba(235,194,100,.28), transparent 34%), linear-gradient(145deg, #0b704e, #07563c); }
.product-benefit-card--feature > i { color: #fff; background: rgba(255,255,255,.13); }
.product-benefit-card--feature p { color: #c3dfd3; }
.product-benefit-card--feature .product-benefit-card__number { color: rgba(255,255,255,.45); }
.product-aplus { background: #fffefa; }
.product-aplus__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.product-aplus__image { position: relative; min-width: 0; overflow: hidden; margin: 0; border: 1px solid #e1e6e1; border-radius: 22px; background: #f2f1eb; box-shadow: 0 14px 35px rgba(24,49,37,.06); }
.product-aplus__image--feature { grid-column: 1 / -1; }
.product-aplus__image img { width: 100%; height: 100%; min-height: 300px; object-fit: cover; transition: transform .55s ease; }
.product-aplus__image--feature img { min-height: 390px; }
.product-aplus__image:hover img { transform: scale(1.02); }
.product-aplus__image figcaption { position: absolute; left: 14px; bottom: 14px; max-width: calc(100% - 28px); padding: 8px 11px; border-radius: 999px; color: #fff; background: rgba(5,42,31,.72); backdrop-filter: blur(10px); font-size: .62rem; font-weight: 700; }
.product-use { background: #fffefa; }
.product-use__shell { display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); gap: clamp(60px, 8vw, 110px); align-items: center; }
.product-use__visual { position: relative; overflow: hidden; aspect-ratio: .91 / 1; border-radius: 34px; background: color-mix(in srgb, var(--product-accent) 14%, #ece7d9); box-shadow: var(--shadow); }
.product-use__visual img { width: 100%; height: 100%; object-fit: cover; }
.product-use__visual > span { position: absolute; left: 22px; bottom: 22px; display: inline-flex; align-items: center; gap: 7px; padding: 10px 13px; border-radius: 999px; color: #fff; background: rgba(5,42,32,.75); backdrop-filter: blur(10px); font-size: .66rem; font-weight: 700; }
.product-use__content ol { display: grid; gap: 0; margin: 22px 0 24px; padding: 0; list-style: none; }
.product-use__content li { display: grid; grid-template-columns: 44px 1fr; align-items: center; gap: 15px; padding: 17px 0; border-bottom: 1px solid var(--line); }
.product-use__content li > span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: var(--forest); font-family: "Manrope"; font-size: .72rem; font-weight: 800; }
.product-use__content li p { margin: 0; color: #4d5a55; font-size: .8rem; }
.product-storage { display: grid; grid-template-columns: 48px 1fr; align-items: center; gap: 13px; padding: 15px; border-radius: 15px; background: #edf6f0; }
.product-storage > i { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 13px; color: var(--green); background: #fff; font-size: 1.3rem; }
.product-storage p { margin: 0; color: var(--muted); font-size: .68rem; }
.product-storage strong { display: block; color: var(--ink); font-size: .74rem; }
.product-reviews { background: #f5f3eb; }
.product-reviews__layout { display: grid; grid-template-columns: 270px 1fr; gap: 24px; align-items: start; }
.review-summary { padding: 26px; border: 1px solid #dde4de; border-radius: 22px; background: #fff; }
.review-summary > strong { display: block; font-family: "Manrope"; font-size: 3.6rem; letter-spacing: -.08em; }
.review-summary > p { margin: 5px 0 20px; color: var(--muted); font-size: .65rem; }
.review-stars { font-size: .85rem; }
.review-bar { display: grid; grid-template-columns: 32px 1fr; align-items: center; gap: 8px; margin-top: 8px; }
.review-bar > span { color: var(--muted); font-size: .59rem; }
.review-bar > b { overflow: hidden; height: 5px; border-radius: 999px; background: #e7ebe7; }
.review-bar > b > i { display: block; height: 100%; border-radius: inherit; background: #d8a62e; }
.review-list { display: grid; gap: 13px; }
.review-card { display: grid; grid-template-columns: 46px 1fr; gap: 14px; padding: 22px; border: 1px solid #dde4de; border-radius: 20px; background: #fff; }
.review-card__avatar { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: linear-gradient(145deg, #0c8660, #075039); font-family: "Manrope"; font-weight: 800; }
.review-card__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.review-card__top strong, .review-card__top span { display: block; }
.review-card__top strong { font-size: .8rem; }
.review-card__top span { margin-top: 2px; color: #8a948f; font-size: .58rem; }
.review-card p { margin: 13px 0 0; color: #53605a; font-size: .77rem; }
.review-form-shell { display: grid; grid-template-columns: .72fr 1.28fr; gap: 70px; margin-top: 27px; padding: clamp(28px, 5vw, 52px); border-radius: 26px; color: #fff; background: radial-gradient(circle at 0 100%, rgba(221,162,67,.24), transparent 28%), linear-gradient(135deg, #063c2e, #082a23); }
.review-form-shell h3 { margin-bottom: 10px; font-size: 1.8rem; }
.review-form-shell > div > p { color: #b5cdc2; font-size: .73rem; }
.review-form-shell .eyebrow { color: #a2dbc6; }
.review-form { display: grid; gap: 14px; }
.review-form fieldset { margin: 0; padding: 0; border: 0; }
.review-form legend, .review-form label > span { display: block; margin-bottom: 6px; color: #c9ddd4; font-size: .64rem; font-weight: 700; }
.review-rating-input { display: flex; flex-direction: row-reverse; justify-content: flex-end; }
.review-rating-input input { position: absolute; opacity: 0; pointer-events: none; }
.review-rating-input label { color: #59766a; cursor: pointer; font-size: 1.55rem; transition: color .15s, transform .15s; }
.review-rating-input input:checked ~ label, .review-rating-input label:hover, .review-rating-input label:hover ~ label { color: #e8b63c; transform: translateY(-1px); }
.review-form__fields { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.review-form input, .review-form textarea { width: 100%; padding: 12px 13px; border: 1px solid rgba(255,255,255,.14); border-radius: 11px; outline: 0; color: #fff; background: rgba(255,255,255,.075); resize: vertical; }
.review-form input:focus, .review-form textarea:focus { border-color: #83c4a9; box-shadow: 0 0 0 4px rgba(131,196,169,.1); }
.review-form .button { justify-self: start; color: #063d2d; background: #f1d17a; box-shadow: none; }
.review-form__status { margin: 0; color: #b8e3d1; font-size: .66rem; }
.product-faq { background: #fffefa; }
.product-faq__grid { display: grid; grid-template-columns: .78fr 1.22fr; gap: clamp(60px, 9vw, 130px); }
.product-faq__heading { position: sticky; top: 175px; align-self: start; }
.product-faq__heading > p { max-width: 410px; color: var(--muted); font-size: .8rem; }
.product-faq__list details { border-bottom: 1px solid var(--line); }
.product-faq__list summary { min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 20px; cursor: pointer; list-style: none; font-family: "Manrope"; font-size: 1rem; font-weight: 700; letter-spacing: -.025em; }
.product-faq__list summary::-webkit-details-marker { display: none; }
.product-faq__list summary i { flex: 0 0 auto; transition: transform .25s ease; }
.product-faq__list details[open] summary i { transform: rotate(45deg); }
.product-faq__list details p { max-width: 650px; margin: -3px 0 25px; color: var(--muted); font-size: .78rem; }
.related-products { background: var(--paper); }
.related-products--commerce { padding-top: 105px; }
.related-products__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.related-product-rating { margin: -9px 0 13px; color: var(--muted); font-size: .62rem; }
.not-found { min-height: 70vh; display: grid; place-items: center; align-content: center; text-align: center; padding-block: 80px; }
.not-found h1 { margin-bottom: 10px; font-size: clamp(3rem, 7vw, 6rem); }
.not-found p { color: var(--muted); }

/* Reveal motion */
.js .reveal { opacity: 0; transform: translateY(34px); transition: opacity .78s cubic-bezier(.2,.75,.2,1), transform .78s cubic-bezier(.2,.75,.2,1); transition-delay: var(--delay, 0ms); }
.js .reveal--left { transform: translateX(-42px); }
.js .reveal--scale { transform: scale(.94) translateY(20px); }
.js .reveal.is-visible { opacity: 1; transform: none; }
.js .hero-showcase.reveal.is-visible { transform: rotateX(var(--hero-rx)) rotateY(var(--hero-ry)); }

@media (max-width: 1100px) {
    :root { --container: 980px; }
    .hero__grid { gap: 45px; }
    .hero h1 { font-size: clamp(3.5rem, 5.8vw, 5.4rem); }
    .hero-showcase { grid-template-columns: minmax(0, 1.18fr) minmax(160px, .82fr); min-height: 520px; }
    .hero-showcase__seal { left: 51%; width: 92px; height: 92px; }
    .hero__rail, .hero-showcase__index { display: none; }
    .hero__metric-note { display: none !important; }
    .hero-card { min-height: 480px; }
    .floating-note--top { right: -10px; }
    .floating-note--bottom { left: -22px; }
    .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .standards-grid { grid-template-columns: repeat(2, 1fr); }
    .standard-card { min-height: 290px; }
    .story__grid, .product-hero__grid { gap: 55px; }
    .footer-grid { grid-template-columns: 1.3fr .7fr .9fr; }
    .footer-note { grid-column: 1 / -1; }
}

@media (max-width: 820px) {
    :root { --header-height: 68px; }
    .container { width: min(calc(100% - 32px), var(--container)); }
    .section { padding: 84px 0; }
    .desktop-nav, .desktop-only { display: none !important; }
    .mobile-only { display: inline-grid !important; }
    .announcement__inner { justify-content: center; }
    .announcement a { display: none; }
    .nav-shell { gap: 10px; }
    .brand { position: absolute; left: 50%; transform: translateX(-50%); }
    .brand img { width: 125px; height: 48px; }
    .nav-actions { margin-left: auto; }
    .cart-button { width: 44px; padding: 0; justify-content: center; border: 0; background: transparent; }
    .cart-button__label { display: none; }
    .cart-count { min-width: 17px; height: 17px; position: absolute; margin: -22px 0 0 25px; font-size: .6rem; }
    .mobile-nav { position: absolute; left: 0; right: 0; top: 100%; display: grid; gap: 0; padding: 8px 16px 18px; border-bottom: 1px solid var(--line); background: var(--paper); opacity: 0; visibility: hidden; transform: translateY(-10px); transition: .25s ease; }
    .mobile-nav.is-open { opacity: 1; visibility: visible; transform: translateY(0); }
    .mobile-nav a { display: flex; align-items: center; justify-content: space-between; padding: 16px 4px; border-bottom: 1px solid var(--line); font-family: "Manrope"; font-weight: 700; }
    .hero { min-height: auto; }
    .hero__grid { grid-template-columns: 1fr; padding: 70px 0 85px; }
    .hero__copy { max-width: 720px; }
    .hero h1 { font-size: clamp(3.7rem, 12.5vw, 6.2rem); }
    .hero h1 span:last-child { font-size: .58em; }
    .hero__metrics { max-width: 500px; }
    .hero-showcase { width: min(100%, 690px); height: 620px; justify-self: center; }
    .hero-showcase__seal { left: 61%; }
    .hero__visual { width: min(92%, 560px); justify-self: center; margin-top: 18px; }
    .hero-card { height: 620px; min-height: 0; }
    .hero__scroll { display: none; }
    .section-heading { grid-template-columns: 1fr; gap: 22px; }
    .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .story__grid, .ritual__grid, .faq__grid, .product-detail__grid { grid-template-columns: 1fr; gap: 64px; }
    .story__copy { order: -1; }
    .ritual__copy, .faq__intro, .product-detail__intro { position: static; }
    .journal-grid { grid-template-columns: 1fr 1fr; }
    .journal-card--feature { grid-column: 1 / -1; display: grid; grid-template-columns: 1.1fr .9fr; }
    .journal-card--feature .journal-card__art { height: 100%; min-height: 310px; }
    .footer-grid { grid-template-columns: 1.2fr 1fr; }
    .footer-note { grid-column: auto; }
    .product-hero__grid { grid-template-columns: 1fr; }
    .product-info { max-width: 700px; }
}

@media (max-width: 560px) {
    .container { width: min(calc(100% - 24px), var(--container)); }
    .announcement { font-size: .68rem; }
    .search-toggle { display: none; }
    .hero__grid { padding-top: 54px; gap: 44px; }
    .hero__eyebrow { font-size: .63rem; }
    .hero h1 { font-size: clamp(3.05rem, 15vw, 4.8rem); }
    .hero h1 span:last-child { margin-top: 9px; font-size: .53em; letter-spacing: -.04em; }
    .hero__lede { font-size: .95rem; }
    .hero__actions { align-items: stretch; gap: 9px; }
    .hero__actions .button--primary { width: 100%; }
    .hero__actions .button--ghost { justify-content: flex-start; }
    .hero__story-link { padding: 8px 4px; }
    .hero__metrics { gap: 16px; margin-top: 30px; }
    .hero__metrics > div + div { padding-left: 16px; }
    .hero__metrics strong { font-size: 1.3rem; }
    .hero-showcase { height: auto; min-height: 0; grid-template-columns: 1fr; gap: 10px; }
    .hero-showcase__side { height: 205px; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr; gap: 10px; }
    .hero-tile--main { height: 465px; border-radius: 26px 26px 86px 26px; }
    .hero-tile--small:first-child { border-radius: 20px 8px 20px 20px; }
    .hero-tile--small:last-child { border-radius: 8px 20px 50px 20px; }
    .hero-tile__content { left: 18px; right: 16px; bottom: 19px; }
    .hero-showcase__seal { left: auto; right: 15px; top: 440px; width: 84px; height: 84px; transform: rotate(-9deg); }
    .hero-showcase__seal i { font-size: 1rem; }
    .hero-showcase__seal span { font-size: .55rem; }
    .hero__word { bottom: 5px; font-size: 23vw; }
    .hero__visual { width: 100%; }
    .hero-card { height: 480px; border-radius: 30px 30px 90px 30px; }
    .hero-card__caption { left: 21px; right: 21px; bottom: 21px; }
    .hero-card__caption strong { font-size: 1.22rem; }
    .floating-note { min-width: 165px; padding: 10px 12px; }
    .floating-note--top { top: 9%; right: -7px; }
    .floating-note--bottom { left: -5px; bottom: 23%; }
    .hero__proof { margin-top: 30px; }
    .section { padding: 70px 0; }
    .section-heading h2, .story h2, .standards h2, .ritual h2, .faq h2, .product-detail h2 { font-size: 2.65rem; }
    .section-heading { margin-bottom: 36px; }
    .filter-row { margin-inline: -12px; padding-inline: 12px; }
    .product-grid, .product-grid--three { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .product-card { border-radius: 17px; }
    .product-card__media { aspect-ratio: .94 / 1.07; }
    .product-card__tag { display: none; }
    .product-card__discount { top: 8px; right: 8px; padding: 5px 7px; font-size: .56rem; }
    .product-card__view { display: none; }
    .product-card__body { padding: 12px; }
    .product-card__meta { font-size: .57rem; }
    .product-card h3 { min-height: 36px; margin-bottom: 12px; font-size: .83rem; }
    .product-card__buy strong { font-size: .94rem; }
    .product-card__buy s { display: none; }
    .add-button { width: 36px; height: 36px; }
    .story__grid { gap: 50px; }
    .story__media::before { left: -8px; bottom: -10px; }
    .story__media img { border-radius: 24px; }
    .story__stamp { width: 94px; height: 94px; right: -2px; bottom: 16px; }
    .story__stamp span { top: 17px; font-size: .5rem; }
    .story__stamp strong { font-size: .79rem; }
    .standards-grid { grid-template-columns: 1fr; }
    .standard-card { min-height: 250px; }
    .ritual-step { grid-template-columns: 52px 1fr; padding: 22px; }
    .ritual-step > span { width: 50px; height: 50px; }
    .journal-grid { grid-template-columns: 1fr; }
    .journal-card--feature { grid-column: auto; display: block; }
    .journal-card--feature .journal-card__art { min-height: 0; height: 230px; }
    .journal-card__art { height: 230px; }
    .footer-grid { grid-template-columns: 1fr 1fr; gap: 38px 22px; }
    .footer-brand, .footer-note { grid-column: 1 / -1; }
    .footer-bottom { align-items: flex-start; flex-direction: column; }
    .closing-cta { padding: 85px 0; }
    .closing-cta h2 { font-size: 3.3rem; }
    .product-hero { padding-top: 25px; }
    .breadcrumbs { overflow: hidden; white-space: nowrap; }
    .product-gallery__main { border-radius: 24px; }
    .product-info h1 { font-size: 3rem; }
    .product-purchase { grid-template-columns: 1fr; }
    .quantity-control { width: 130px; }
    .product-promises { grid-template-columns: 1fr; }
    .product-promises > div { grid-template-columns: 38px 1fr; }
    .cart-drawer { padding: 20px; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
    .js .reveal { opacity: 1; transform: none; }
}

/* Screenshot-matched commerce storefront */
.commerce-home {
    color: #14251c;
    background-color: #fbfcf8;
    background-image: url("../images/gawdee-home-vector-backdrop-v1.svg");
    background-repeat: repeat-y;
    background-position: center 120px;
    background-size: 1600px auto;
}

@media (max-width: 700px) {
    .commerce-home {
        background-position: center 90px;
        background-size: 760px auto;
    }
}

/* CMS-managed editorial media */
.journal-card__visual { height: 210px; }
.journal-card__visual::after { z-index: 1; opacity: 1; background: linear-gradient(transparent 48%,rgba(3,35,22,.46)); }
.journal-card__visual > img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.journal-card:hover .journal-card__visual > img { transform: scale(1.045); }
.journal-card__visual > span { color: #fff; background: rgba(4,53,32,.65); backdrop-filter: blur(8px); }
.journal-article__cover { overflow: hidden; margin: 42px 0 -20px; border-radius: 28px; box-shadow: 0 22px 55px rgba(23,51,36,.12); }
.journal-article__cover img { display: block; width: 100%; max-height: 520px; object-fit: cover; }
@media (max-width: 620px) { .journal-article__cover { margin-top: 30px; border-radius: 20px; } }
.commerce-home .container, .commerce-header .container, .commerce-footer .container, .commerce-assurance .container { --container: 1240px; }

.promo-strip { min-height: 38px; display: grid; grid-template-columns: 1fr 1fr; color: #fff; font-size: .78rem; font-weight: 700; }
.promo-strip > div { display: flex; align-items: center; justify-content: center; gap: 7px; padding: 9px 20px; }
.promo-strip__offer { background: linear-gradient(90deg, #ff913d, #e56f25); }
.promo-strip__shipping { background: linear-gradient(90deg, #176f31, #075223); }

.commerce-header { position: sticky; top: 0; z-index: 100; background: rgba(255,255,255,.96); border-bottom: 1px solid #e8ece8; backdrop-filter: blur(18px); transition: box-shadow .2s ease; }
.commerce-header.is-scrolled { box-shadow: 0 10px 30px rgba(15,63,34,.08); }
.commerce-header__main { min-height: 92px; display: grid; grid-template-columns: 210px minmax(320px, 1fr) auto; gap: 34px; align-items: center; }
.commerce-logo img { width: 166px; height: 70px; object-fit: contain; }
.commerce-search { height: 56px; display: grid; grid-template-columns: auto 1fr 54px; align-items: center; gap: 12px; padding-left: 22px; border: 1px solid #dfe5e0; border-radius: 999px; background: #fff; box-shadow: 0 8px 25px rgba(21,66,39,.08); }
.commerce-search > i { color: #869289; font-size: 1.1rem; }
.commerce-search input { width: 100%; border: 0; outline: 0; background: transparent; color: #26352c; font-size: .9rem; }
.commerce-search input::placeholder { color: #909891; }
.commerce-search button { width: 54px; height: 54px; display: grid; place-items: center; border: 0; border-radius: 50%; color: #fff; background: #08732f; cursor: pointer; font-size: 1.35rem; }
.commerce-actions { display: flex; align-items: center; gap: 30px; }
.commerce-action { min-width: 52px; display: grid; place-items: center; gap: 4px; border: 0; background: transparent; cursor: pointer; color: #111b15; font-size: .71rem; font-weight: 700; }
.commerce-action > i, .commerce-action__icon > i { font-size: 1.48rem; }
.commerce-action__icon { position: relative; display: grid; place-items: center; }
.commerce-action__icon b { position: absolute; right: -10px; top: -10px; min-width: 19px; height: 19px; display: grid; place-items: center; padding: 0 4px; border-radius: 99px; color: #fff; background: #08732f; border: 2px solid #fff; font-size: .6rem; }
.commerce-nav-shell { min-height: 60px; display: grid; grid-template-columns: 180px 1fr; gap: 34px; align-items: center; border-top: 1px solid #edf0ed; }
.category-menu-button { height: 42px; display: flex; align-items: center; justify-content: center; gap: 8px; border: 0; border-radius: 999px; color: #fff; background: linear-gradient(135deg, #0a8739, #075b29); box-shadow: 0 8px 18px rgba(5,104,43,.2); cursor: pointer; font-size: .8rem; font-weight: 700; }
.commerce-nav { display: flex; align-items: center; justify-content: space-around; gap: 20px; }
.commerce-nav a { position: relative; padding: 20px 6px; font-size: .79rem; font-weight: 650; }
.commerce-nav a::after { content: ""; position: absolute; left: 6px; right: 100%; bottom: 13px; height: 2px; background: #0b7a35; transition: right .2s ease; }
.commerce-nav a:hover::after { right: 6px; }
.commerce-nav small { margin-left: 4px; padding: 3px 7px; border-radius: 5px; color: #fff; background: #fb5925; font-size: .56rem; }
.commerce-mobile-nav { top: 100%; }

.festival-hero { position: relative; width: min(calc(100% - 48px), 1240px); height: 455px; display: grid; grid-template-columns: .47fr .53fr; align-items: center; margin: 22px auto 0; overflow: hidden; border-radius: 28px; background: linear-gradient(115deg, #fff9ec 0%, #fffdf8 47%, #fff4e6 100%); box-shadow: 0 18px 50px rgba(67,66,40,.09); }
.festival-hero::before { content: ""; position: absolute; inset: 0; opacity: .4; background-image: radial-gradient(#e4bf86 1px, transparent 1px); background-size: 24px 24px; mask-image: linear-gradient(to right, #000, transparent 55%); }
.festival-hero::after { content: ""; position: absolute; right: -70px; bottom: -75px; width: 470px; height: 270px; background: radial-gradient(ellipse at center, rgba(33,128,56,.18), transparent 67%); }
.festival-hero__copy { position: relative; z-index: 4; padding-left: 11.5%; }
.festival-kicker { display: block; margin-bottom: 1px; color: #ff671f; font-size: 2.35rem; font-weight: 800; letter-spacing: -.04em; text-transform: uppercase; }
.festival-hero h1 { margin: 0; font-size: clamp(2.35rem, 3vw, 3.45rem); line-height: 1; color: #123b78; letter-spacing: -.045em; text-transform: uppercase; }
.festival-hero h2 { margin: 18px 0 12px; color: #167039; font-size: 1.25rem; letter-spacing: -.03em; }
.festival-hero__copy > p { max-width: 420px; margin-bottom: 18px; color: #374b3f; font-size: .86rem; }
.festival-features { display: flex; align-items: center; flex-wrap: wrap; gap: 15px; margin-bottom: 24px; }
.festival-features span { display: flex; align-items: center; gap: 5px; color: #1b3b29; font-size: .65rem; font-weight: 700; }
.festival-features i { color: #0b8438; font-size: 1rem; }
.festival-cta { min-height: 50px; display: inline-flex; align-items: center; gap: 18px; padding: 0 26px; border-radius: 999px; color: #fff; background: linear-gradient(135deg, #0c8137, #056129); box-shadow: 0 10px 25px rgba(7,103,43,.22); font-size: .82rem; font-weight: 800; text-transform: uppercase; }
.festival-cta i { font-size: 1.2rem; }
.festival-hero__products { position: relative; z-index: 3; height: 100%; }
.festival-product-collage { position: absolute; width: 110%; height: 100%; right: -6%; bottom: -1px; object-fit: contain; object-position: center bottom; filter: drop-shadow(0 22px 24px rgba(67,47,24,.12)); }
.festival-plinth { position: absolute; z-index: 1; left: 10%; right: 3%; bottom: 16px; height: 96px; border-radius: 50%; background: linear-gradient(180deg, #b48651, #76502f); box-shadow: 0 20px 35px rgba(93,62,30,.24); transform: perspective(500px) rotateX(62deg); }
.festival-product { position: absolute; z-index: 2; overflow: hidden; border: 5px solid rgba(255,255,255,.82); border-radius: 20px 20px 12px 12px; background: #f4ecdc; box-shadow: 0 18px 35px rgba(51,46,28,.16); }
.festival-product img { width: 100%; height: 100%; object-fit: cover; }
.festival-product--ghee { width: 235px; height: 330px; left: 3%; bottom: 47px; transform: rotate(-2deg); }
.festival-product--sugar { width: 205px; height: 295px; left: 37%; bottom: 51px; transform: rotate(1deg); }
.festival-product--mixme { width: 198px; height: 278px; right: 2%; bottom: 50px; transform: rotate(3deg); }
.organic-seal { position: absolute; z-index: 5; right: 24px; top: 23px; width: 105px; height: 105px; display: grid; place-items: center; align-content: center; border: 2px solid #db9f56; outline: 5px double rgba(219,159,86,.45); border-radius: 50%; color: #14351f; background: rgba(255,249,233,.9); text-align: center; transform: rotate(4deg); }
.organic-seal strong { font-size: 1.25rem; line-height: 1; }
.organic-seal span { font-size: .58rem; font-weight: 800; line-height: 1.1; text-transform: uppercase; }
.organic-seal i { margin-top: 3px; color: #0b7f35; }
.festival-hero__birds { position: absolute; z-index: 2; left: 51%; right: 19%; top: 32px; display: flex; justify-content: space-around; color: #d7741f; }
.festival-hero__birds i:nth-child(2) { color: #23863e; transform: translateY(25px) scale(.8); }
.festival-hero__birds i:nth-child(3) { transform: translateY(5px) scale(1.1); }
.festival-hero__ribbon { position: absolute; z-index: 2; width: 270px; height: 58px; border-radius: 50%; transform: rotate(-26deg); filter: blur(.2px); }
.festival-hero__ribbon--top { left: -86px; top: 12px; border-top: 19px solid #ff7b20; border-bottom: 16px solid #fff; box-shadow: 0 17px 0 #14803a; }
.festival-hero__ribbon--bottom { right: -65px; bottom: 8px; border-top: 18px solid #ff7b20; border-bottom: 15px solid #fff; box-shadow: 0 16px 0 #14803a; }

.trust-strip { width: min(calc(100% - 92px), 1180px); min-height: 84px; display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; align-items: center; margin: 0 auto 24px; padding: 0 22px; border-radius: 0 0 14px 14px; background: #fff; box-shadow: 0 12px 35px rgba(21,61,34,.1); }
.trust-strip > div { display: grid; grid-template-columns: 34px 1fr; gap: 10px; align-items: center; padding: 10px 12px; }
.trust-strip i { color: #0a8037; font-size: 1.65rem; }
.trust-strip span { color: #59645d; font-size: .62rem; line-height: 1.35; }
.trust-strip strong { display: block; color: #18241c; font-size: .68rem; }

.commerce-section { width: min(calc(100% - 64px), 1180px); margin: 0 auto; padding: 26px 0 8px; }
.commerce-section__heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; margin-bottom: 17px; }
.commerce-section__heading h2 { margin: 0 0 3px; font-family: var(--gx-font); font-size: 1.45rem; letter-spacing: -.03em; }
.commerce-section__heading h2 span { font-family: "DM Sans"; }
.commerce-section__heading p { margin: 0; color: #647168; font-size: .75rem; line-height: 1.4; }
.commerce-section__heading > a { display: flex; align-items: center; gap: 8px; color: #087432; font-size: .72rem; font-weight: 800; }

.compact-product-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 15px; }
.compact-product-card { min-width: 0; overflow: hidden; border: 1px solid #e0e5e0; border-radius: 15px; background: #fff; transition: transform .25s ease, box-shadow .25s ease; }
.compact-product-card:hover { transform: translateY(-4px); box-shadow: 0 16px 32px rgba(24,66,38,.09); }
.compact-product-card__media { position: relative; display: block; height: 212px; overflow: hidden; background: #f8f7f2; }
.compact-product-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.compact-product-card:hover img { transform: scale(1.035); }
.compact-product-card__badge { position: absolute; z-index: 2; left: 8px; top: 8px; padding: 5px 8px; border-radius: 5px; color: #fff; background: #0a7a34; font-size: .54rem; font-weight: 800; }
.compact-product-card__badge.is-orange { background: #ff6428; }
.compact-product-card__badge.is-blue { background: #1765ae; }
.compact-product-card__body { padding: 11px 10px 10px; }
.compact-product-card h3 { min-height: 34px; margin: 0 0 3px; font-family: "DM Sans"; font-size: .75rem; line-height: 1.3; letter-spacing: -.02em; }
.compact-product-card__weight { display: block; margin-bottom: 8px; color: #778079; font-size: .61rem; }
.compact-product-card__price { display: flex; align-items: center; gap: 7px; margin-bottom: 10px; }
.compact-product-card__price strong { font-size: .83rem; }
.compact-product-card__price s { color: #939b95; font-size: .61rem; }
.compact-product-card__actions { display: grid; grid-template-columns: 1fr 30px; gap: 7px; }
.compact-product-card__actions button:first-child { height: 30px; border: 0; border-radius: 5px; color: #fff; background: #087431; cursor: pointer; font-size: .58rem; font-weight: 800; text-transform: uppercase; }
.compact-product-card__actions button:last-child { display: grid; place-items: center; border: 0; background: transparent; cursor: pointer; font-size: 1.15rem; }
.compact-product-card__actions button:last-child.is-saved { color: #fff; border-radius: 50%; background: #d94f54; }
.commerce-action.is-saved .commerce-action__icon > i { color: #d94f54; }

.category-section { padding-top: 30px; }
.category-grid { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 16px; }
.category-card { min-height: 120px; display: grid; place-items: center; align-content: center; gap: 9px; border: 1px solid #ebe4d9; border-radius: 15px; background: #fffdf9; transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
.category-card:hover { transform: translateY(-4px); border-color: #bdd6c3; box-shadow: 0 12px 25px rgba(29,74,42,.08); }
.category-card__visual { width: 62px; height: 62px; display: grid; place-items: center; overflow: hidden; border: 1px solid #e7e8e3; border-radius: 50%; background: #fff; }
.category-card__visual img { width: 100%; height: 100%; object-fit: cover; }
.category-card__visual i { color: #0b7b34; font-size: 2rem; }
.category-card strong { font-size: .69rem; }

.offer-banner { position: relative; min-height: 136px; display: grid; grid-template-columns: 1.25fr .7fr .75fr; align-items: center; gap: 30px; overflow: hidden; padding: 20px 90px 20px 210px; border: 1px solid #f0e2cc; border-radius: 17px; background: linear-gradient(110deg, #fff9e9, #fffdf8 55%, #eef7e9); }
.offer-banner small { color: #ff5f23; font-size: .65rem; font-weight: 800; text-transform: uppercase; }
.offer-banner h2 { margin: 2px 0 0; color: #087332; font-family: "DM Sans"; font-size: 2rem; letter-spacing: -.05em; }
.offer-banner p { margin: 0; font-size: .82rem; }
.offer-code { display: grid; place-items: center; padding: 10px 20px; border: 1px solid #ff6428; border-radius: 8px; background: rgba(255,255,255,.76); }
.offer-code span { color: #f06429; font-size: .72rem; font-weight: 700; }
.offer-code strong { color: #0a7834; font-size: 1.25rem; }
.offer-valid { display: flex; align-items: center; gap: 12px; font-size: .73rem; font-weight: 700; }
.offer-valid i { color: #1b3d8f; font-size: 2.6rem; }
.offer-banner__flag { position: absolute; left: -25px; top: 0; width: 195px; height: 100%; transform: rotate(-7deg); }
.offer-banner__flag span { display: block; height: 33.333%; }
.offer-banner__flag span:nth-child(1) { background: #ff7f28; }
.offer-banner__flag span:nth-child(2) { background: #fff; }
.offer-banner__flag span:nth-child(3) { background: #118036; }
.offer-skyline { position: absolute; right: 12px; bottom: -5px; color: rgba(13,118,51,.45); font-size: 4.4rem; }
.offer-skyline .ph-hot-air-balloon { position: absolute; right: 0; top: -75px; color: #f4772a; font-size: 2rem; }

.combo-section { padding-top: 17px; }
.combo-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.combo-card { overflow: hidden; border: 1px solid #e1e6e1; border-radius: 15px; background: #fff; }
.combo-card__visual { position: relative; height: 180px; display: flex; justify-content: center; align-items: flex-end; overflow: hidden; background: linear-gradient(#faf8f1, #f2efe5); }
.combo-card__visual::after { content: ""; position: absolute; left: 16%; right: 16%; bottom: 13px; height: 18px; border-radius: 50%; background: rgba(30,64,39,.16); filter: blur(8px); }
.combo-card__visual img { position: relative; z-index: 2; width: 54%; height: 94%; object-fit: cover; border-radius: 10px; margin: 0 -10%; box-shadow: 0 10px 24px rgba(40,54,37,.14); }
.combo-card__visual img:nth-child(2) { height: 84%; transform: rotate(4deg); }
.combo-card__tag { position: absolute; z-index: 4; margin: 8px; padding: 5px 9px; border-radius: 5px; color: #fff; background: #0a7834; font-size: .55rem; font-weight: 800; }
.combo-card:nth-child(2) .combo-card__tag { background: #f26628; }
.combo-card:nth-child(4) .combo-card__tag { background: #1c64a7; }
.combo-card__body { padding: 10px 13px 13px; }
.combo-card__body h3 { min-height: 34px; margin: 0 0 7px; font-family: "DM Sans"; font-size: .72rem; line-height: 1.35; }
.combo-card__body > div { display: flex; align-items: center; gap: 7px; }
.combo-card__body strong { font-size: .88rem; }
.combo-card__body s { color: #949b96; font-size: .62rem; }
.combo-card__body span { margin-left: auto; padding: 4px 7px; border-radius: 999px; color: #087331; background: #e7f4e9; font-size: .58rem; font-weight: 800; text-transform: uppercase; }

.newsletter-section { padding-block: 26px; }
.newsletter-panel { position: relative; min-height: 118px; display: grid; grid-template-columns: 82px 1fr 1.45fr; gap: 20px; align-items: center; overflow: hidden; padding: 18px 120px 18px 25px; border-radius: 18px; color: #fff; background: linear-gradient(100deg, #07572c, #2f7947 58%, #afc977); box-shadow: 0 14px 35px rgba(11,91,44,.18); }
.newsletter-panel__icon { width: 72px; height: 72px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.55); border-radius: 50%; font-size: 2rem; }
.newsletter-panel h2 { margin: 0 0 4px; font-family: "DM Sans"; font-size: 1.2rem; letter-spacing: -.03em; }
.newsletter-panel p { margin: 0; color: #e2f1e6; font-size: .74rem; line-height: 1.45; }
.newsletter-panel form { height: 50px; display: grid; grid-template-columns: 1fr 145px; border-radius: 999px; overflow: hidden; background: #fff; }
.newsletter-panel input { min-width: 0; padding: 0 22px; border: 0; outline: 0; }
.newsletter-panel button { border: 0; color: #fff; background: #087332; cursor: pointer; font-size: .72rem; font-weight: 800; text-transform: uppercase; }
.newsletter-panel__leaf { position: absolute; right: -7px; bottom: -28px; color: rgba(255,255,255,.28); font-size: 7rem; transform: rotate(-15deg); }

.commerce-assurance { border-top: 1px solid #e6ebe7; border-bottom: 1px solid #e6ebe7; background: #fff; }
.commerce-assurance__grid { min-height: 88px; display: grid; grid-template-columns: repeat(5, 1fr); align-items: center; }
.commerce-assurance__grid > div { min-height: 48px; display: grid; grid-template-columns: 36px 1fr; gap: 9px; align-items: center; padding: 0 18px; border-right: 1px solid #e8ece9; }
.commerce-assurance__grid > div:last-child { border: 0; }
.commerce-assurance i { color: #087332; font-size: 1.65rem; }
.commerce-assurance span { color: #5e6961; font-size: .61rem; line-height: 1.3; }
.commerce-assurance strong { display: block; color: #1b261f; font-size: .66rem; }

.commerce-footer { padding: 36px 0 16px; background: #fff; }
.commerce-footer__grid { display: grid; grid-template-columns: 1.35fr repeat(3, .8fr) 1.2fr; gap: 34px; }
.commerce-footer__brand img { width: 145px; height: 60px; object-fit: contain; }
.commerce-footer__brand p { max-width: 220px; color: #566158; font-size: .68rem; line-height: 1.55; }
.commerce-socials { display: flex; gap: 8px; }
.commerce-socials a { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #143520; font-size: .75rem; }
.commerce-footer h2 { margin: 7px 0 12px; font-family: "DM Sans"; font-size: .75rem; letter-spacing: -.01em; }
.commerce-footer__links { display: flex; flex-direction: column; align-items: flex-start; gap: 7px; }
.commerce-footer__links a, .commerce-footer__signup p { color: #59645c; font-size: .64rem; }
.commerce-footer__signup p { line-height: 1.5; }
.footer-mini-form { height: 37px; display: grid; grid-template-columns: 1fr 37px; overflow: hidden; border: 1px solid #dfe4df; border-radius: 999px; }
.footer-mini-form input { min-width: 0; padding: 0 13px; border: 0; outline: 0; font-size: .65rem; }
.footer-mini-form button { border: 0; border-radius: 50%; color: #fff; background: #087332; cursor: pointer; }
.commerce-footer__bottom { min-height: 48px; display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 25px; padding-top: 12px; border-top: 1px solid #e8ebe8; color: #667069; font-size: .6rem; }
.commerce-footer__bottom p { margin: 0; }
.payment-pills { display: flex; gap: 6px; }
.payment-pills span { padding: 3px 8px; border-radius: 4px; background: #f2f3f1; color: #315a89; font-weight: 800; }
.whatsapp-float { position: fixed; z-index: 120; right: 25px; bottom: 25px; width: 58px; height: 58px; display: grid; place-items: center; border: 4px solid #fff; border-radius: 50%; color: #fff; background: #20bf57; box-shadow: 0 10px 25px rgba(17,143,64,.3); font-size: 1.8rem; }

@media (max-width: 1100px) {
    .commerce-header__main { grid-template-columns: 170px minmax(280px, 1fr) auto; gap: 22px; }
    .commerce-actions { gap: 18px; }
    .festival-product--ghee { width: 205px; left: 0; }
    .festival-product--sugar { width: 180px; left: 34%; }
    .festival-product--mixme { width: 175px; }
    .compact-product-grid { grid-template-columns: repeat(3, 1fr); }
    .compact-product-card__media { height: 280px; }
    .category-grid { grid-template-columns: repeat(4, 1fr); }
    .commerce-footer__grid { grid-template-columns: 1.3fr repeat(3, .75fr); }
    .commerce-footer__signup { grid-column: 1 / -1; }
}

@media (max-width: 820px) {
    .promo-strip { grid-template-columns: 1fr; min-height: 34px; font-size: .65rem; text-align: center; }
    .promo-strip__shipping { display: none !important; }
    .commerce-header__main { min-height: 125px; grid-template-columns: 44px 1fr auto; gap: 10px; padding-block: 9px; }
    .commerce-logo { justify-self: center; }
    .commerce-logo img { width: 128px; height: 48px; }
    .commerce-search { grid-column: 1 / -1; grid-row: 2; height: 45px; padding-left: 15px; }
    .commerce-search button { width: 44px; height: 44px; }
    .commerce-actions { gap: 4px; }
    .commerce-action { min-width: 42px; }
    .commerce-nav-shell { display: none; }
    .category-menu-button.mobile-only { display: grid !important; }
    .festival-hero { width: min(calc(100% - 24px), 1240px); height: 720px; grid-template-columns: 1fr; align-items: start; margin-top: 13px; }
    .festival-hero__copy { padding: 48px 30px 0; text-align: center; }
    .festival-hero__copy > p { margin-inline: auto; }
    .festival-features { justify-content: center; }
    .festival-hero__products { position: absolute; left: 0; right: 0; bottom: 0; height: 330px; }
    .festival-product--ghee { width: 180px; height: 250px; left: 8%; bottom: 28px; }
    .festival-product--sugar { width: 155px; height: 225px; left: 36%; bottom: 33px; }
    .festival-product--mixme { width: 150px; height: 215px; right: 6%; bottom: 31px; }
    .organic-seal { width: 82px; height: 82px; top: 15px; right: 14px; }
    .festival-hero__ribbon--bottom { display: none; }
    .trust-strip { width: min(calc(100% - 40px), 1180px); grid-template-columns: repeat(2, 1fr); padding-block: 12px; }
    .trust-strip > div:last-child { grid-column: 1 / -1; justify-self: center; }
    .commerce-section { width: min(calc(100% - 28px), 1180px); }
    .compact-product-grid { grid-template-columns: repeat(2, 1fr); }
    .compact-product-card__media { height: 245px; }
    .offer-banner { grid-template-columns: 1fr 1fr; padding: 26px 35px 26px 120px; }
    .offer-valid { display: none; }
    .combo-grid { grid-template-columns: repeat(2, 1fr); }
    .newsletter-panel { grid-template-columns: 70px 1fr; padding-right: 30px; }
    .newsletter-panel form { grid-column: 1 / -1; }
    .commerce-assurance__grid { grid-template-columns: repeat(2, 1fr); padding-block: 12px; }
    .commerce-assurance__grid > div { border: 0; }
    .commerce-assurance__grid > div:last-child { grid-column: 1 / -1; }
    .commerce-footer__grid { grid-template-columns: repeat(2, 1fr); }
    .commerce-footer__brand, .commerce-footer__signup { grid-column: 1 / -1; }
}

@media (max-width: 560px) {
    .promo-strip__offer { padding-inline: 10px; }
    .promo-strip__offer strong { display: none; }
    .festival-hero { height: 680px; }
    .festival-kicker { font-size: 1.6rem; }
    .festival-hero h1 { font-size: 2.25rem; }
    .festival-hero h2 { margin-top: 12px; font-size: 1rem; }
    .festival-hero__copy { padding: 38px 18px 0; }
    .festival-features { gap: 8px 12px; }
    .festival-product--ghee { width: 150px; height: 220px; left: 2%; }
    .festival-product--sugar { width: 135px; height: 205px; left: 32%; }
    .festival-product--mixme { width: 130px; height: 195px; right: 1%; }
    .organic-seal { display: none; }
    .trust-strip { grid-template-columns: 1fr; }
    .trust-strip > div, .trust-strip > div:last-child { grid-column: auto; justify-self: stretch; }
    .commerce-section__heading { align-items: flex-start; }
    .commerce-section__heading h2 { font-size: 1.2rem; }
    .commerce-section__heading > a { font-size: .62rem; }
    .compact-product-grid { gap: 10px; }
    .compact-product-card__media { height: 185px; }
    .category-grid { grid-template-columns: repeat(4, 1fr); gap: 8px; }
    .category-card { min-height: 100px; }
    .category-card__visual { width: 52px; height: 52px; }
    .category-card strong { font-size: .59rem; }
    .offer-banner { min-height: 190px; grid-template-columns: 1fr; gap: 14px; padding: 24px; text-align: center; }
    .offer-banner__flag { left: -45px; top: -62px; width: 150px; height: 150px; opacity: .14; }
    .offer-banner h2 { font-size: 1.75rem; }
    .offer-code { position: static; justify-self: center; }
    .offer-code strong { font-size: 1rem; }
    .offer-skyline { display: none; }
    .combo-grid { grid-template-columns: 1fr; }
    .combo-card__visual { height: 210px; }
    .newsletter-panel { grid-template-columns: 54px 1fr; padding: 20px; }
    .newsletter-panel__icon { width: 50px; height: 50px; font-size: 1.35rem; }
    .newsletter-panel form { height: auto; grid-template-columns: 1fr; gap: 8px; background: transparent; border-radius: 0; }
    .newsletter-panel input, .newsletter-panel button { height: 44px; border-radius: 999px; }
    .commerce-assurance__grid { grid-template-columns: 1fr; }
    .commerce-assurance__grid > div:last-child { grid-column: auto; }
    .commerce-footer__bottom { flex-direction: column; align-items: flex-start; }
    .whatsapp-float { width: 52px; height: 52px; right: 15px; bottom: 15px; }
}

/* Full-artwork hero carousel */
.hero-slider {
    position: relative;
    width: min(calc(100% - 48px), 1240px);
    aspect-ratio: 8 / 3;
    margin: 22px auto 0;
    overflow: hidden;
    isolation: isolate;
    border: 1px solid rgba(18, 72, 38, .08);
    border-radius: 28px;
    background: #f6f1e5;
    box-shadow: 0 22px 55px rgba(45, 62, 42, .13);
}
.hero-slider:focus-visible { outline: 3px solid rgba(8, 115, 49, .4); outline-offset: 4px; }
.hero-slider__track {
    width: 100%;
    height: 100%;
    display: flex;
    transform: translate3d(0, 0, 0);
    transition: transform .82s cubic-bezier(.2, .72, .2, 1);
    will-change: transform;
}
.hero-slide { position: relative; flex: 0 0 100%; width: 100%; height: 100%; display: block; overflow: hidden; }
.hero-slide picture { width: 100%; height: 100%; display: block; }
.hero-slide img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center; transition: transform 6.5s ease; }
.hero-slide.is-active img { transform: scale(1.018); }
.hero-slide::after { content: ""; position: absolute; inset: 0; pointer-events: none; box-shadow: inset 0 0 0 1px rgba(255,255,255,.35); }
.hero-slider__arrow {
    position: absolute;
    z-index: 5;
    top: 50%;
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255,255,255,.7);
    border-radius: 50%;
    color: #0a6030;
    background: rgba(255,255,255,.88);
    box-shadow: 0 10px 26px rgba(22,54,34,.16);
    backdrop-filter: blur(12px);
    cursor: pointer;
    opacity: 0;
    transform: translateY(-50%) scale(.88);
    transition: opacity .25s ease, transform .25s ease, background .2s ease;
}
.hero-slider:hover .hero-slider__arrow, .hero-slider:focus-within .hero-slider__arrow { opacity: 1; transform: translateY(-50%) scale(1); }
.hero-slider__arrow:hover { color: #fff; background: #087332; }
.hero-slider__arrow i { font-size: 1.25rem; }
.hero-slider__arrow--prev { left: 18px; }
.hero-slider__arrow--next { right: 18px; }
.hero-slider__dots {
    position: absolute;
    z-index: 6;
    left: 50%;
    bottom: 17px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 9px;
    border: 1px solid rgba(255,255,255,.58);
    border-radius: 999px;
    background: rgba(15,55,31,.32);
    backdrop-filter: blur(12px);
    transform: translateX(-50%);
}
.hero-slider__dots button { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 999px; background: rgba(255,255,255,.65); cursor: pointer; transition: width .28s ease, background .28s ease; }
.hero-slider__dots button.is-active { width: 28px; background: #fff; }
.hero-slider__progress { position: absolute; z-index: 7; left: 0; right: 0; bottom: 0; height: 3px; overflow: hidden; background: rgba(255,255,255,.2); }
.hero-slider__progress span { width: 100%; height: 100%; display: block; background: linear-gradient(90deg, #ff7b21, #fff 50%, #087b35); transform: scaleX(0); transform-origin: left center; }
.hero-slider__progress span.is-running { animation: heroSlideProgress 5.5s linear forwards; }
@keyframes heroSlideProgress { to { transform: scaleX(1); } }

@media (max-width: 820px) {
    .hero-slider { width: min(calc(100% - 24px), 1240px); margin-top: 13px; border-radius: 22px; }
    .hero-slider__arrow { width: 40px; height: 40px; opacity: 1; transform: translateY(-50%) scale(1); }
    .hero-slider__arrow--prev { left: 10px; }
    .hero-slider__arrow--next { right: 10px; }
}

@media (max-width: 620px) {
    .hero-slider { width: calc(100% - 16px); aspect-ratio: 8 / 3; margin-top: 9px; border-radius: 13px; background: #fff9ed; box-shadow: 0 11px 28px rgba(45,62,42,.12); }
    .hero-slide img { object-fit: contain; object-position: center; }
    .hero-slide.is-active img { transform: none; }
    .hero-slider__arrow { top: 50%; bottom: auto; width: 29px; height: 29px; opacity: .9; transform: translateY(-50%) scale(1); }
    .hero-slider:hover .hero-slider__arrow, .hero-slider:focus-within .hero-slider__arrow { transform: translateY(-50%) scale(1); }
    .hero-slider__arrow i { font-size: .88rem; }
    .hero-slider__arrow--prev { left: 5px; }
    .hero-slider__arrow--next { right: 5px; }
    .hero-slider__dots { bottom: 6px; gap: 4px; padding: 4px 6px; }
    .hero-slider__dots button { width: 5px; height: 5px; }
    .hero-slider__dots button.is-active { width: 17px; }
    .hero-slider__progress { height: 2px; }
}

/* Reference-inspired modern product detail page */
.product-page--reference { background: #fff; }
.product-page--reference main { background: #fff; }
.product-page--reference .commerce-assurance { display: none; }

.ref-product-page { --ref-green: #00734b; --ref-deep: #075a3d; --ref-line: #e3e7e3; --ref-cream: #fbf8f1; padding-top: 0; color: #17231f; }
.ref-product-container { width: min(calc(100% - 48px), 1180px); }
.ref-breadcrumbs { min-height: 54px; display: flex; align-items: center; flex-wrap: wrap; gap: 9px; color: #7a837e; font-size: .7rem; }
.ref-breadcrumbs a:hover { color: var(--ref-green); }
.ref-breadcrumbs i { font-size: .54rem; }
.ref-product-hero { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(390px, .92fr); gap: 38px; align-items: start; padding: 0 0 16px; }
.ref-gallery { min-width: 0; display: grid; grid-template-columns: 88px minmax(0,1fr); gap: 14px; }
.ref-gallery__thumbs { display: flex; flex-direction: column; gap: 12px; max-height: 480px; overflow: auto; scrollbar-width: none; }
.ref-gallery__thumbs::-webkit-scrollbar { display: none; }
.ref-gallery__thumb { flex: 0 0 80px; width: 80px; height: 80px; overflow: hidden; padding: 4px; border: 1px solid var(--ref-line); border-radius: 12px; background: #fbfaf6; cursor: pointer; transition: border-color .2s, transform .2s, box-shadow .2s; }
.ref-gallery__thumb:hover { transform: translateY(-2px); }
.ref-gallery__thumb.is-active { border-color: var(--ref-green); box-shadow: inset 0 0 0 1px var(--ref-green), 0 7px 18px rgba(0,115,75,.1); }
.ref-gallery__thumb img { width: 100%; height: 100%; object-fit: cover; border-radius: 8px; }
.ref-gallery__stage { position: relative; overflow: hidden; aspect-ratio: 1.07 / 1; border: 1px solid #dce3dd; border-radius: 15px; background: color-mix(in srgb, var(--product-accent) 9%, #f4f0e6); }
.ref-gallery__stage::after { content: ""; position: absolute; inset: auto 10% -20% 10%; height: 28%; border-radius: 50%; background: color-mix(in srgb, var(--product-accent) 24%, transparent); filter: blur(28px); pointer-events: none; }
.ref-gallery__stage > img { width: 100%; height: 100%; object-fit: cover; transition: opacity .2s, transform .55s cubic-bezier(.2,.75,.2,1); }
.ref-gallery__stage:hover > img { transform: scale(1.025); }
.ref-gallery__stage > img.is-changing { opacity: .35; }
.ref-gallery__badge { position: absolute; z-index: 2; left: 15px; top: 15px; padding: 8px 11px; border-radius: 8px; color: #066b43; background: rgba(255,255,255,.93); box-shadow: 0 8px 18px rgba(21,49,35,.09); font-size: .64rem; font-weight: 800; }
.ref-gallery__expand { position: absolute; z-index: 2; right: 14px; top: 14px; width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid rgba(18,54,35,.08); border-radius: 50%; background: rgba(255,255,255,.92); font-size: 1.1rem; }
.ref-buybox { min-width: 0; padding: 4px 0 0; }
.ref-buybox h1 { display: flex; align-items: center; gap: 8px; margin: 0 0 9px; font-family: var(--gx-font); font-size: clamp(1.8rem, 2.6vw, 2.45rem); line-height: 1.14; letter-spacing: -.035em; }
.ref-buybox h1 i { color: #0aa05c; font-size: 1.1rem; }
.ref-rating { width: fit-content; display: flex; align-items: center; gap: 7px; margin-bottom: 13px; font-size: .66rem; }
.ref-rating > span { color: #ffae00; font-size: 1.15rem; letter-spacing: .03em; }
.ref-rating strong { color: #58635d; }
.ref-rating small { color: #7e8883; }
.ref-rating b { padding-left: 10px; border-left: 1px solid #d9dfda; color: #77817c; font-weight: 500; }
.ref-buybox__description { margin: 0 0 13px; color: #5c6661; font-size: .78rem; line-height: 1.6; }
.ref-price { display: flex; align-items: center; gap: 12px; }
.ref-price strong { font-family: "Manrope", sans-serif; font-size: 1.85rem; letter-spacing: -.06em; }
.ref-price s { color: #89928e; font-size: .82rem; }
.ref-price span { color: #087449; font-size: .76rem; font-weight: 800; }
.ref-tax { display: block; margin: 0 0 16px; color: #8a938f; font-size: .62rem; }
.ref-variants { padding-top: 12px; border-top: 1px solid var(--ref-line); }
.ref-variants > strong, .ref-quantity-row > strong { display: block; margin-bottom: 9px; font-size: .72rem; }
.ref-variants > div { display: flex; flex-wrap: wrap; gap: 9px; }
.ref-variants a { min-height: 38px; display: inline-flex; align-items: center; padding: 0 14px; border: 1px solid #dbe0dc; border-radius: 7px; color: #5c6661; background: #fff; font-size: .7rem; font-weight: 650; }
.ref-variants a.is-active { border-color: var(--ref-green); color: var(--ref-green); background: #f0f8f3; box-shadow: inset 0 0 0 1px rgba(0,115,75,.08); }
.ref-quantity-row { display: flex; align-items: center; gap: 12px; margin: 16px 0; }
.ref-quantity-row > strong { margin: 0; }
.ref-quantity { display: grid; grid-template-columns: 32px 36px 32px; height: 38px; border: 1px solid var(--ref-line); border-radius: 7px; background: #fff; }
.ref-quantity button { border: 0; background: transparent; cursor: pointer; }
.ref-quantity span { display: grid; place-items: center; border-inline: 1px solid var(--ref-line); font-size: .72rem; font-weight: 700; }
.ref-stock { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; color: #60806d; font-size: .62rem; font-weight: 700; }
.ref-stock i { width: 7px; height: 7px; border-radius: 50%; background: #19a765; box-shadow: 0 0 0 4px rgba(25,167,101,.1); }
.ref-purchase-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ref-purchase-actions button { min-height: 50px; border: 1px solid var(--ref-green); border-radius: 8px; cursor: pointer; font-size: .88rem; font-weight: 800; }
.ref-add { color: #fff; background: linear-gradient(135deg, #00845a, #006c46); box-shadow: 0 10px 22px rgba(0,112,72,.16); }
.ref-buy-now { color: #066c47; background: #fff; }
.ref-purchase-actions button:disabled { opacity: .55; cursor: not-allowed; }
.ref-wishlist { min-height: 38px; display: inline-flex; align-items: center; gap: 8px; margin-top: 8px; padding: 0 10px; border: 0; color: #67716c; background: transparent; cursor: pointer; font-size: .68rem; }
.ref-wishlist i { font-size: 1.15rem; }
.ref-wishlist.is-saved { color: #c44747; }

.ref-trust-strip { display: grid; grid-template-columns: repeat(4,1fr); margin: 0 0 14px; border: 1px solid var(--ref-line); border-radius: 14px; background: #fff; }
.ref-trust-strip article { min-width: 0; display: flex; align-items: center; gap: 12px; padding: 17px 24px; border-right: 1px solid var(--ref-line); }
.ref-trust-strip article:last-child { border-right: 0; }
.ref-trust-strip i { flex: 0 0 auto; color: var(--ref-green); font-size: 1.8rem; }
.ref-trust-strip strong, .ref-trust-strip span { display: block; }
.ref-trust-strip strong { margin-bottom: 3px; font-size: .7rem; }
.ref-trust-strip span { color: #79827d; font-size: .59rem; }
.ref-purity-row { display: grid; grid-template-columns: .9fr 1.1fr; gap: 14px; margin-bottom: 14px; }
.ref-purity-icons { display: grid; grid-template-columns: repeat(4,1fr); padding: 18px 13px; border-radius: 14px; background: linear-gradient(135deg,#fdf9f1,#fbf7ee); }
.ref-purity-icons article { min-width: 0; display: grid; justify-items: center; text-align: center; }
.ref-purity-icons i { width: 42px; height: 42px; display: grid; place-items: center; margin-bottom: 9px; border-radius: 50%; color: var(--ref-green); background: #eef3e8; font-size: 1.25rem; }
.ref-purity-icons strong { font-size: .62rem; }
.ref-purity-icons span { color: #7b837f; font-size: .54rem; }
.ref-story-card { min-width: 0; position: relative; overflow: hidden; min-height: 142px; display: grid; grid-template-columns: 1fr 1fr; align-items: center; border: 1px solid #eee7d8; border-radius: 14px; background: linear-gradient(100deg,#fffaf1,#f5f0e4); }
.ref-story-card > div { position: relative; z-index: 2; padding: 20px 0 20px 28px; }
.ref-story-card h2 { margin: 0 0 7px; color: #086040; font-family: var(--gx-font); font-size: 1.35rem; line-height: 1.12; letter-spacing: -.025em; }
.ref-story-card p { margin: 0; color: #53635b; font-size: .62rem; line-height: 1.5; }
.ref-story-card img { width: 100%; height: 142px; object-fit: cover; mask-image: linear-gradient(90deg, transparent, #000 28%); }

.ref-product-info { overflow: hidden; margin-bottom: 14px; border: 1px solid var(--ref-line); border-radius: 14px; background: #fff; }
.ref-tabs { display: flex; gap: 7px; overflow-x: auto; padding: 10px 16px 0; scrollbar-width: none; }
.ref-tabs button { flex: 0 0 auto; min-width: 112px; height: 32px; border: 0; border-radius: 7px; color: #52605a; background: #faf8f3; cursor: pointer; font-size: .61rem; font-weight: 800; }
.ref-tabs button.is-active { color: #fff; background: var(--ref-green); }
.ref-product-info__grid { display: grid; grid-template-columns: 1.25fr .72fr .72fr; gap: 26px; align-items: stretch; padding: 12px 18px 16px; }
.ref-tab-panels { color: #4f5d56; font-size: .67rem; }
.ref-tab-panels p { margin: 0 0 10px; line-height: 1.6; }
.ref-tab-panels ul, .ref-tab-panels ol { display: grid; gap: 7px; margin: 0; padding: 0; list-style: none; }
.ref-tab-panels li { display: flex; align-items: flex-start; gap: 8px; }
.ref-tab-panels li i { flex: 0 0 auto; margin-top: 2px; color: var(--ref-green); }
.ref-tab-panels ol { counter-reset: ref-step; }
.ref-tab-panels ol li::before { counter-increment: ref-step; content: counter(ref-step); width: 20px; height: 20px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; color: #fff; background: var(--ref-green); font-size: .54rem; font-weight: 800; }
.ref-nutrition { align-self: stretch; padding: 14px 18px; border: 1px solid #e5ded0; border-radius: 10px; background: #fbf8f1; }
.ref-nutrition > strong { display: block; margin-bottom: 8px; color: #08714a; font-size: .61rem; }
.ref-nutrition > div { display: flex; justify-content: space-between; gap: 12px; padding: 3px 0; font-size: .56rem; }
.ref-nutrition b { font-weight: 500; }
.ref-method-card { position: relative; overflow: hidden; min-height: 174px; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; padding: 10px; border-radius: 10px; color: #17231f; text-align: center; }
.ref-method-card::after { content: ""; position: absolute; inset: 35% 0 0; background: linear-gradient(transparent,rgba(255,252,245,.96) 72%); }
.ref-method-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ref-method-card > i, .ref-method-card > strong, .ref-method-card > span { position: relative; z-index: 2; }
.ref-method-card > i { width: 42px; height: 42px; display: grid; place-items: center; margin: auto; border: 2px solid #fff; border-radius: 50%; color: #fff; background: rgba(0,82,51,.55); font-size: 1.15rem; }
.ref-method-card strong { font-size: .65rem; }
.ref-method-card span { font-size: .54rem; }

.ref-watch { margin-bottom: 14px; }
.ref-watch > header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; padding: 0 10px; }
.ref-watch h2, .ref-why h2, .ref-related h2, .ref-review-summary h2, .ref-faq h2 { margin: 0; color: #075d3d; font-family: var(--gx-font); font-size: 1.05rem; letter-spacing: -.02em; }
.ref-watch header a { color: var(--ref-green); font-size: .58rem; font-weight: 800; }
.ref-watch__grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; }
.ref-watch__grid a { position: relative; overflow: hidden; aspect-ratio: 2.05 / 1; display: block; border-radius: 11px; color: #fff; background: #173b2b; }
.ref-watch__grid a::after { content: ""; position: absolute; inset: 20% 0 0; background: linear-gradient(transparent,rgba(0,22,12,.78)); }
.ref-watch__grid img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.ref-watch__grid a:hover img { transform: scale(1.04); }
.ref-watch__grid span { position: absolute; z-index: 2; left: 13px; right: 13px; bottom: 27px; font-size: .68rem; font-weight: 800; line-height: 1.3; }
.ref-watch__grid small { position: absolute; z-index: 2; left: 13px; bottom: 9px; font-size: .52rem; }

.ref-discovery-row { display: grid; grid-template-columns: .72fr 1.28fr; gap: 14px; margin-bottom: 14px; }
.ref-why, .ref-related { padding: 14px 16px 16px; border: 1px solid var(--ref-line); border-radius: 14px; background: #fff; }
.ref-why h2, .ref-related h2 { margin-bottom: 10px; text-align: center; }
.ref-why > div { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 14px; }
.ref-why article { min-width: 0; display: flex; align-items: center; gap: 8px; }
.ref-why article > i { width: 35px; height: 35px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid #e2e9d7; border-radius: 50%; color: #77a746; background: #f8faef; font-size: 1rem; }
.ref-why article span, .ref-why article strong, .ref-why article small { min-width: 0; display: block; }
.ref-why article strong { font-size: .54rem; }
.ref-why article small { color: #7e8882; font-size: .45rem; line-height: 1.4; }
.ref-related__grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 9px; }
.ref-related__grid article { min-width: 0; position: relative; padding: 7px; border: 1px solid var(--ref-line); border-radius: 10px; background: #fff; }
.ref-related__grid article > a:first-child { display: block; overflow: hidden; aspect-ratio: 1 / .8; border-radius: 8px; background: #f8f6ef; }
.ref-related__grid img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s; }
.ref-related__grid article:hover img { transform: scale(1.03); }
.ref-related__grid article > span { position: absolute; left: 12px; top: 12px; padding: 4px 6px; border-radius: 5px; color: #fff; background: #0b7a4d; font-size: .42rem; font-weight: 800; }
.ref-related__grid h3 { height: 30px; margin: 7px 0 1px; overflow: hidden; font-size: .57rem; line-height: 1.35; letter-spacing: -.02em; }
.ref-related__grid small { color: #7e8882; font-size: .48rem; }
.ref-related__grid p { margin: 5px 0; font-size: .61rem; line-height: 1; }
.ref-related__grid p s { margin-left: 3px; color: #99a19c; font-size: .47rem; }
.ref-related__grid button { width: 100%; min-height: 30px; border: 0; border-radius: 6px; color: #fff; background: var(--ref-green); cursor: pointer; font-size: .53rem; font-weight: 800; }

.ref-reviews-faq { display: grid; grid-template-columns: .65fr 1.28fr .9fr; gap: 0; margin-bottom: 16px; border: 1px solid var(--ref-line); border-radius: 14px; background: #fff; }
.ref-review-summary, .ref-review-cards, .ref-faq { min-width: 0; padding: 17px; }
.ref-review-summary, .ref-review-cards { border-right: 1px solid var(--ref-line); }
.ref-review-summary h2, .ref-faq h2 { margin-bottom: 12px; color: #17231f; font-family: "DM Sans",sans-serif; font-size: .82rem; }
.ref-review-score { display: grid; grid-template-columns: auto 1fr; gap: 0 10px; align-items: center; margin-bottom: 10px; }
.ref-review-score > strong { grid-row: 1 / 3; font-size: 2.8rem; letter-spacing: -.08em; }
.ref-review-score > span { color: #ffb000; font-size: .75rem; }
.ref-review-score > small { color: #7f8983; font-size: .5rem; }
.ref-review-bar { display: grid; grid-template-columns: 28px 1fr 25px; align-items: center; gap: 6px; margin-top: 5px; font-size: .48rem; }
.ref-review-bar b { height: 4px; overflow: hidden; border-radius: 9px; background: #eaedea; }
.ref-review-bar b i { display: block; height: 100%; background: #ffb000; }
.ref-write-review { margin-top: 12px; }
.ref-write-review summary { width: fit-content; padding: 8px 12px; border-radius: 6px; color: #fff; background: var(--ref-green); cursor: pointer; list-style: none; font-size: .55rem; font-weight: 800; }
.ref-write-review summary::-webkit-details-marker { display: none; }
.ref-write-review form { display: grid; gap: 6px; margin-top: 9px; }
.ref-write-review input, .ref-write-review textarea { width: 100%; padding: 8px; border: 1px solid var(--ref-line); border-radius: 6px; font-size: .56rem; resize: vertical; }
.ref-write-review button { min-height: 30px; border: 0; border-radius: 6px; color: #fff; background: var(--ref-green); font-size: .55rem; font-weight: 800; }
.ref-write-review p { margin: 0; font-size: .5rem; }
.ref-review-rating { display: flex; flex-direction: row-reverse; justify-content: flex-end; }
.ref-review-rating input { position: absolute; opacity: 0; }
.ref-review-rating label { color: #cfd5d1; cursor: pointer; font-size: 1rem; }
.ref-review-rating input:checked ~ label, .ref-review-rating label:hover, .ref-review-rating label:hover ~ label { color: #ffb000; }
.ref-review-cards { display: grid; grid-template-columns: repeat(3,1fr); gap: 9px; }
.ref-review-cards article { min-width: 0; padding: 11px; border-radius: 9px; background: #fbfaf6; }
.ref-review-cards article > div { display: flex; align-items: center; gap: 7px; }
.ref-review-cards article > div > span { width: 29px; height: 29px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #0c7650; font-size: .56rem; font-weight: 800; }
.ref-review-cards article p, .ref-review-cards article strong, .ref-review-cards article small { display: block; margin: 0; }
.ref-review-cards article strong { font-size: .54rem; }
.ref-review-cards article small { color: #15945e; font-size: .42rem; }
.ref-review-cards article > b { display: block; margin: 8px 0; color: #ffb000; font-size: .62rem; letter-spacing: .05em; }
.ref-review-cards blockquote { min-height: 67px; margin: 0 0 8px; color: #5d6962; font-size: .5rem; line-height: 1.55; }
.ref-review-cards time { color: #9aa19d; font-size: .42rem; }
.ref-faq details { border-bottom: 1px solid var(--ref-line); }
.ref-faq summary { min-height: 34px; display: flex; align-items: center; justify-content: space-between; gap: 9px; cursor: pointer; list-style: none; font-size: .55rem; font-weight: 700; }
.ref-faq summary::-webkit-details-marker { display: none; }
.ref-faq details p { margin: 0 0 9px; color: #657069; font-size: .5rem; line-height: 1.5; }
.ref-faq details[open] summary i { transform: rotate(180deg); }

.ref-newsletter { overflow: hidden; background: linear-gradient(105deg,#fff8e9,#f8f0dd); }
.ref-newsletter > .container { min-height: 130px; display: grid; grid-template-columns: 1fr 310px; align-items: center; gap: 30px; }
.ref-newsletter h2 { margin: 0 0 5px; color: #075d3d; font-family: var(--gx-font); font-size: 1.3rem; }
.ref-newsletter p { margin: 0 0 10px; font-size: .6rem; }
.ref-newsletter form { width: min(100%,560px); display: grid; grid-template-columns: 1fr 120px; }
.ref-newsletter input { min-width: 0; height: 39px; padding: 0 15px; border: 1px solid #dce3dd; border-radius: 7px 0 0 7px; outline: 0; background: #fff; font-size: .63rem; }
.ref-newsletter button { border: 0; border-radius: 0 7px 7px 0; color: #fff; background: var(--ref-green); font-size: .62rem; font-weight: 800; }
.ref-newsletter img { width: 100%; height: 130px; object-fit: cover; mask-image: linear-gradient(90deg,transparent,#000 35%); }
.product-page--reference .commerce-footer { background: #fff; }
.product-page--reference .commerce-footer__grid { padding-top: 34px; }
.product-page--reference .commerce-footer__bottom { margin-top: 25px; }

@media (max-width: 1000px) {
    .ref-product-hero { grid-template-columns: minmax(0,1fr) minmax(350px,.9fr); gap: 24px; }
    .ref-gallery { grid-template-columns: 72px minmax(0,1fr); }
    .ref-gallery__thumb { width: 66px; height: 66px; flex-basis: 66px; }
    .ref-trust-strip article { padding-inline: 14px; }
    .ref-purity-row, .ref-discovery-row { grid-template-columns: 1fr; }
    .ref-product-info__grid { grid-template-columns: 1fr .72fr; }
    .ref-method-card { grid-column: 1 / -1; min-height: 210px; }
    .ref-reviews-faq { grid-template-columns: .7fr 1.3fr; }
    .ref-review-cards { border-right: 0; }
    .ref-faq { grid-column: 1 / -1; border-top: 1px solid var(--ref-line); }
}

@media (max-width: 760px) {
    .ref-product-container { width: min(calc(100% - 24px), 1180px); }
    .ref-breadcrumbs { min-height: 46px; font-size: .6rem; }
    .ref-product-hero { grid-template-columns: 1fr; gap: 24px; }
    .ref-gallery { grid-template-columns: 1fr; }
    .ref-gallery__stage { grid-row: 1; }
    .ref-gallery__thumbs { grid-row: 2; flex-direction: row; max-height: none; }
    .ref-gallery__thumb { width: 68px; height: 68px; flex-basis: 68px; }
    .ref-buybox h1 { font-size: 2rem; }
    .ref-trust-strip { grid-template-columns: repeat(2,1fr); }
    .ref-trust-strip article:nth-child(2) { border-right: 0; }
    .ref-trust-strip article:nth-child(-n+2) { border-bottom: 1px solid var(--ref-line); }
    .ref-purity-icons { grid-template-columns: repeat(2,1fr); gap: 18px; }
    .ref-story-card { grid-template-columns: 1fr; }
    .ref-story-card > div { padding: 21px; }
    .ref-story-card img { height: 180px; mask-image: linear-gradient(180deg,transparent,#000 20%); }
    .ref-product-info__grid { grid-template-columns: 1fr; gap: 14px; }
    .ref-method-card { grid-column: auto; }
    .ref-tabs { padding-inline: 9px; }
    .ref-tabs button { min-width: 104px; }
    .ref-watch__grid { grid-template-columns: repeat(2,1fr); }
    .ref-related__grid { grid-template-columns: repeat(2,1fr); }
    .ref-reviews-faq { grid-template-columns: 1fr; }
    .ref-review-summary, .ref-review-cards { border-right: 0; border-bottom: 1px solid var(--ref-line); }
    .ref-review-cards { grid-template-columns: 1fr; }
    .ref-review-cards blockquote { min-height: 0; }
    .ref-faq { grid-column: auto; border-top: 0; }
    .ref-newsletter > .container { grid-template-columns: 1fr; padding-block: 25px; }
    .ref-newsletter img { display: none; }
}

@media (max-width: 450px) {
    .ref-gallery__stage { aspect-ratio: 1 / 1; }
    .ref-rating { flex-wrap: wrap; }
    .ref-rating b { width: 100%; padding-left: 0; border-left: 0; }
    .ref-purchase-actions { grid-template-columns: 1fr; }
    .ref-trust-strip article { padding: 13px 10px; }
    .ref-trust-strip i { font-size: 1.45rem; }
    .ref-watch__grid { grid-template-columns: 1fr; }
    .ref-why > div { grid-template-columns: 1fr; }
    .ref-newsletter form { grid-template-columns: 1fr 92px; }
}

@media (prefers-reduced-motion: reduce) {
    .hero-slider__track, .hero-slide img { transition: none; }
    .hero-slider__progress { display: none; }
}

/* Premium Independence Day offer card */
.modern-offer-card {
    position: relative;
    min-height: 190px;
    display: grid;
    grid-template-columns: 1.08fr .9fr .94fr;
    gap: 26px;
    align-items: center;
    overflow: hidden;
    padding: 28px 36px;
    border: 1px solid rgba(7, 77, 39, .12);
    border-radius: 28px;
    background: linear-gradient(112deg, #073d28 0%, #0a5833 37%, #fffaf0 37.15%, #fffdf8 100%);
    box-shadow: 0 18px 45px rgba(22, 65, 38, .13);
}
.modern-offer-card::before {
    content: "";
    position: absolute;
    z-index: 3;
    left: 0;
    right: 0;
    top: 0;
    height: 6px;
    background: linear-gradient(90deg, #ff7b24 0 33.33%, #fff 33.33% 66.66%, #12803b 66.66%);
}
.modern-offer-card::after {
    content: "";
    position: absolute;
    left: -90px;
    bottom: -135px;
    width: 330px;
    height: 330px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 50%;
    box-shadow: 0 0 0 55px rgba(255,255,255,.035), 0 0 0 110px rgba(255,255,255,.025);
}
.modern-offer-card__copy { position: relative; z-index: 4; color: #fff; }
.modern-offer-card__eyebrow { display: inline-flex; align-items: center; gap: 7px; margin-bottom: 8px; color: #ffd7b7; font-size: .68rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.modern-offer-card__eyebrow i { font-size: 1rem; }
.modern-offer-card h2 { display: flex; align-items: baseline; gap: 8px; margin: 0; font-family: "DM Sans", sans-serif; line-height: .9; letter-spacing: -.055em; }
.modern-offer-card h2 span, .modern-offer-card h2 em { font-size: 1.15rem; font-style: normal; font-weight: 750; letter-spacing: -.03em; text-transform: uppercase; }
.modern-offer-card h2 strong { color: #fff; font-size: clamp(3rem, 4.5vw, 4.25rem); }
.modern-offer-card__copy p { margin: 9px 0 0; color: #d9ede0; font-size: .82rem; font-weight: 600; }

.modern-offer-coupon {
    position: relative;
    z-index: 4;
    display: grid;
    gap: 7px;
    justify-items: center;
    padding: 18px 20px;
    border: 1px dashed rgba(10, 104, 53, .42);
    border-radius: 20px;
    background: rgba(255,255,255,.88);
    box-shadow: 0 12px 30px rgba(45,63,43,.08);
    backdrop-filter: blur(12px);
}
.modern-offer-coupon::before, .modern-offer-coupon::after { content: ""; position: absolute; left: -9px; width: 17px; height: 17px; border-radius: 50%; background: #0a4b2e; }
.modern-offer-coupon::before { top: -9px; }
.modern-offer-coupon::after { bottom: -9px; }
.modern-offer-coupon__label { color: #e5662a; font-size: .68rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.modern-offer-coupon button { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 8px 11px 8px 15px; border: 0; border-radius: 11px; color: #0b6838; background: #edf7ef; cursor: pointer; transition: transform .2s ease, background .2s ease; }
.modern-offer-coupon button:hover { transform: translateY(-2px); background: #e2f2e6; }
.modern-offer-coupon button:focus-visible { outline: 3px solid rgba(12, 119, 57, .24); outline-offset: 2px; }
.modern-offer-coupon button strong { font-size: 1.32rem; letter-spacing: .075em; }
.modern-offer-coupon button span { display: inline-flex; align-items: center; gap: 5px; padding: 6px 8px; border-radius: 8px; color: #fff; background: #0b733b; font-size: .61rem; font-weight: 800; white-space: nowrap; }
.modern-offer-coupon button.is-copied span { background: #d86a2f; }
.modern-offer-coupon small { color: #748078; font-size: .58rem; font-weight: 600; }

.modern-offer-validity { position: relative; z-index: 4; display: grid; grid-template-columns: 50px 1fr; gap: 11px 13px; align-items: center; color: #173d28; }
.modern-offer-validity__icon { width: 50px; height: 50px; display: grid; place-items: center; border: 1px solid #cfe2d3; border-radius: 16px; color: #0a743b; background: #eef7ef; font-size: 1.75rem; transform: rotate(-4deg); }
.modern-offer-validity strong { display: block; margin-bottom: 4px; font-size: .78rem; line-height: 1.25; }
.modern-offer-validity div > span { color: #69776e; font-size: .63rem; line-height: 1.4; }
.modern-offer-validity a { grid-column: 2; width: fit-content; display: inline-flex; align-items: center; gap: 7px; color: #0a7139; font-size: .68rem; font-weight: 800; }
.modern-offer-validity a i { transition: transform .2s ease; }
.modern-offer-validity a:hover i { transform: translateX(3px); }
.modern-offer-card__chakra { position: absolute; z-index: 1; right: -38px; top: -46px; width: 148px; height: 148px; display: grid; place-items: center; border: 1px solid rgba(29,61,143,.08); border-radius: 50%; }
.modern-offer-card__chakra span { width: 54px; height: 54px; border: 2px solid rgba(29,61,143,.1); border-radius: 50%; background: repeating-conic-gradient(from 0deg, rgba(29,61,143,.1) 0 2deg, transparent 2deg 15deg); }
.modern-offer-card__ribbon { position: absolute; z-index: 1; right: -55px; bottom: -33px; width: 230px; height: 58px; border-top: 12px solid rgba(255,123,36,.17); border-bottom: 10px solid rgba(18,128,59,.15); border-radius: 50%; transform: rotate(-12deg); }

@media (max-width: 900px) {
    .modern-offer-card { grid-template-columns: 1fr 1fr; background: linear-gradient(128deg, #073d28 0%, #0a5833 48%, #fffaf0 48.15%, #fffdf8 100%); }
    .modern-offer-validity { grid-column: 1 / -1; grid-template-columns: 50px 1fr auto; padding: 13px 16px; border-radius: 17px; background: rgba(255,255,255,.9); }
    .modern-offer-validity a { grid-column: 3; grid-row: 1; }
}

@media (max-width: 620px) {
    .modern-offer-card { grid-template-columns: 1fr; gap: 16px; padding: 27px 18px 20px; border-radius: 22px; background: linear-gradient(180deg, #073d28 0%, #0a5833 38%, #fffaf0 38.15%, #fffdf8 100%); }
    .modern-offer-card__copy { text-align: center; padding-bottom: 2px; }
    .modern-offer-card__eyebrow { justify-content: center; }
    .modern-offer-card h2 { justify-content: center; }
    .modern-offer-card h2 strong { font-size: 3.45rem; }
    .modern-offer-coupon { padding: 16px; }
    .modern-offer-validity { grid-column: auto; grid-template-columns: 46px 1fr; padding: 15px; }
    .modern-offer-validity__icon { width: 46px; height: 46px; }
    .modern-offer-validity a { grid-column: 2; grid-row: auto; }
    .modern-offer-card__chakra { display: none; }
}

/* Indian flag theme refinement */
.modern-offer-card {
    gap: 16px;
    padding: 15px;
    border: 1px solid rgba(25, 66, 125, .12);
    background: linear-gradient(180deg, #f58a35 0 33.333%, #fffdf7 33.333% 66.666%, #118344 66.666% 100%);
    box-shadow: 0 22px 52px rgba(20, 62, 39, .15), inset 0 0 0 1px rgba(255,255,255,.3);
}
.modern-offer-card::before { height: 4px; background: linear-gradient(90deg, #f58a35, #fff 46%, #1d3d8f 50%, #fff 54%, #118344); }
.modern-offer-card::after { left: auto; right: -90px; bottom: -120px; border-color: rgba(255,255,255,.17); box-shadow: 0 0 0 44px rgba(255,255,255,.04), 0 0 0 88px rgba(255,255,255,.025); }
.modern-offer-card__ribbon { inset: 0; width: auto; height: auto; border: 0; border-radius: 0; opacity: .24; background: linear-gradient(105deg, transparent 0 23%, rgba(255,255,255,.72) 23.2% 24%, transparent 24.2% 73%, rgba(255,255,255,.56) 73.2% 74%, transparent 74.2%); transform: none; }

.modern-offer-card__copy {
    min-height: 160px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 23px 26px;
    border: 1px solid rgba(255,255,255,.48);
    border-radius: 22px;
    background: linear-gradient(135deg, rgba(107,46,7,.25), rgba(255,255,255,.13));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.3);
    backdrop-filter: blur(9px);
}
.modern-offer-card__eyebrow { color: #fff8ef; }
.modern-offer-flag { position: relative; width: 32px; height: 20px; flex: 0 0 auto; overflow: hidden; border: 1px solid rgba(255,255,255,.72); border-radius: 4px; background: linear-gradient(180deg, #ff8b32 0 33.333%, #fff 33.333% 66.666%, #12803f 66.666%); box-shadow: 0 4px 10px rgba(76,42,14,.14); }
.modern-offer-flag b { position: absolute; left: 50%; top: 50%; width: 7px; height: 7px; border: 1px solid #1d3d8f; border-radius: 50%; transform: translate(-50%,-50%); }
.modern-offer-flag b::after { content: ""; position: absolute; inset: 1px; border-radius: 50%; background: repeating-conic-gradient(#1d3d8f 0 8deg, transparent 8deg 22deg); }
.modern-offer-card h2 strong { color: #fff; text-shadow: 0 5px 18px rgba(91,37,6,.24); }
.modern-offer-card h2 span, .modern-offer-card h2 em { color: #fff; }
.modern-offer-card__copy p { color: #fff8ed; }

.modern-offer-coupon {
    min-height: 160px;
    align-content: center;
    border: 1px dashed rgba(29,61,143,.38);
    border-radius: 22px;
    background: rgba(255,255,255,.91);
    box-shadow: 0 16px 32px rgba(33,61,45,.1), inset 0 0 0 1px rgba(255,255,255,.72);
}
.modern-offer-coupon::before { background: #f58a35; }
.modern-offer-coupon::after { background: #118344; }
.modern-offer-coupon__label { color: #d86a21; }
.modern-offer-coupon button { border: 1px solid rgba(18,128,63,.12); background: linear-gradient(100deg, #f0f7f1, #fff9ee); }
.modern-offer-coupon button strong { color: #0b6939; }
.modern-offer-coupon button span { background: linear-gradient(135deg, #0b733b, #07572c); }

.modern-offer-validity {
    min-height: 160px;
    padding: 23px 22px;
    border: 1px solid rgba(255,255,255,.34);
    border-radius: 22px;
    color: #fff;
    background: linear-gradient(135deg, rgba(5,75,37,.88), rgba(14,116,59,.78));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.2);
    backdrop-filter: blur(9px);
}
.modern-offer-validity__icon { border-color: rgba(255,255,255,.4); color: #1d3d8f; background: #fff; box-shadow: 0 8px 20px rgba(0,45,22,.16); }
.modern-offer-validity strong { color: #fff; }
.modern-offer-validity div > span { color: #dff0e5; }
.modern-offer-validity a { padding: 7px 11px; border: 1px solid rgba(255,255,255,.3); border-radius: 999px; color: #fff; background: rgba(255,255,255,.12); }
.modern-offer-card__chakra { z-index: 2; left: 50%; right: auto; top: 50%; width: 175px; height: 175px; border-color: rgba(29,61,143,.1); transform: translate(-50%,-50%); }
.modern-offer-card__chakra span { width: 92px; height: 92px; border-color: rgba(29,61,143,.16); background: repeating-conic-gradient(from 0deg, rgba(29,61,143,.12) 0 2deg, transparent 2deg 15deg); }

@media (max-width: 900px) {
    .modern-offer-card { grid-template-columns: 1fr 1fr; background: linear-gradient(180deg, #f58a35 0 35%, #fffdf7 35% 68%, #118344 68% 100%); }
    .modern-offer-validity { min-height: auto; grid-template-columns: 50px 1fr auto; }
}

@media (max-width: 620px) {
    .modern-offer-card { grid-template-columns: 1fr; gap: 12px; padding: 12px; background: linear-gradient(180deg, #f58a35 0 32%, #fffdf7 32% 67%, #118344 67% 100%); }
    .modern-offer-card__copy, .modern-offer-coupon, .modern-offer-validity { min-height: auto; border-radius: 18px; }
    .modern-offer-card__copy { padding: 23px 18px; }
    .modern-offer-coupon { padding: 18px 16px; }
    .modern-offer-validity { grid-template-columns: 46px 1fr; padding: 18px 16px; }
    .modern-offer-card__chakra { display: grid; left: 50%; top: 50%; width: 125px; height: 125px; opacity: .45; }
    .modern-offer-card__chakra span { width: 68px; height: 68px; }
}

/* Contemporary glass campaign treatment */
.modern-offer-card {
    min-height: 224px;
    grid-template-columns: 1.12fr .94fr 1fr;
    gap: 18px;
    padding: 21px;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 32px;
    background:
        radial-gradient(circle at 9% 5%, rgba(255,137,47,.46), transparent 29%),
        radial-gradient(circle at 91% 92%, rgba(24,137,70,.5), transparent 34%),
        linear-gradient(125deg, #061f18 0%, #0a3c2b 54%, #082f28 100%);
    box-shadow: 0 26px 65px rgba(5,43,27,.2), inset 0 1px 0 rgba(255,255,255,.14);
}
.modern-offer-card::before { left: 24px; right: 24px; top: 14px; height: 3px; border-radius: 999px; background: linear-gradient(90deg, #ff8b32 0 32%, rgba(255,255,255,.95) 32% 65%, #1a8a49 65%); box-shadow: 0 0 22px rgba(255,255,255,.13); }
.modern-offer-card::after { right: auto; left: -170px; bottom: -225px; width: 480px; height: 480px; border-color: rgba(255,255,255,.07); box-shadow: 0 0 0 70px rgba(255,255,255,.02), 0 0 0 140px rgba(255,255,255,.012); }
.modern-offer-card__ribbon { left: -150px; right: auto; top: 46%; bottom: auto; width: 570px; height: 150px; opacity: .16; border-radius: 50%; background: transparent; border-top: 24px solid #ff8b32; border-bottom: 21px solid #168449; box-shadow: 0 -21px 0 rgba(255,255,255,.86); transform: rotate(-17deg); filter: blur(.2px); }

.modern-offer-card__copy {
    min-height: 180px;
    padding: 26px 28px;
    border: 1px solid rgba(255,255,255,.15);
    border-radius: 24px;
    background: linear-gradient(145deg, rgba(255,255,255,.105), rgba(255,255,255,.035));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 18px 38px rgba(1,28,17,.14);
    backdrop-filter: blur(16px);
}
.modern-offer-card__eyebrow { width: fit-content; margin-bottom: 13px; padding: 6px 10px 6px 7px; border: 1px solid rgba(255,255,255,.16); border-radius: 999px; color: #fff; background: rgba(255,255,255,.08); letter-spacing: .07em; }
.modern-offer-card h2 { width: fit-content; display: grid; grid-template-columns: auto auto; grid-template-rows: 1fr 1fr; gap: 0 12px; align-items: center; }
.modern-offer-card h2 span { grid-column: 1; grid-row: 1; align-self: end; color: #ffc89e; font-size: .9rem; letter-spacing: .12em; }
.modern-offer-card h2 em { grid-column: 1; grid-row: 2; align-self: start; color: #b8dbc3; font-size: 1.05rem; letter-spacing: .16em; }
.modern-offer-card h2 strong { grid-column: 2; grid-row: 1 / 3; color: #fff; font-size: clamp(4rem, 5.2vw, 5.35rem); line-height: .75; letter-spacing: -.085em; text-shadow: 0 10px 28px rgba(0,25,14,.28); }
.modern-offer-card__copy p { margin-top: 15px; color: rgba(255,255,255,.78); font-size: .72rem; letter-spacing: .03em; }

.modern-offer-coupon {
    min-height: 180px;
    padding: 22px;
    border: 0;
    border-radius: 24px;
    background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(245,247,240,.92));
    box-shadow: 0 22px 45px rgba(0,28,16,.21), inset 0 1px 0 #fff;
    transform: translateY(-3px) rotate(-.35deg);
    transition: transform .28s ease, box-shadow .28s ease;
}
.modern-offer-card:hover .modern-offer-coupon { transform: translateY(-7px) rotate(0); box-shadow: 0 29px 58px rgba(0,28,16,.25), inset 0 1px 0 #fff; }
.modern-offer-coupon::before, .modern-offer-coupon::after { left: -11px; width: 22px; height: 22px; background: #0a3828; box-shadow: inset -5px 0 8px rgba(0,0,0,.12); }
.modern-offer-coupon::before { top: 25%; }
.modern-offer-coupon::after { bottom: 25%; }
.modern-offer-coupon__label { color: #dd6f2c; letter-spacing: .12em; }
.modern-offer-coupon button { padding: 10px 10px 10px 16px; border: 1px solid rgba(8,103,52,.1); border-radius: 14px; background: #edf4ed; }
.modern-offer-coupon button strong { color: #075f32; font-size: 1.44rem; letter-spacing: .095em; }
.modern-offer-coupon button span { min-height: 34px; padding-inline: 10px; background: #082f23; }
.modern-offer-coupon small { margin-top: 2px; color: #89928c; letter-spacing: .04em; }

.modern-offer-validity {
    min-height: 180px;
    grid-template-columns: 52px 1fr;
    align-content: center;
    padding: 26px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 24px;
    color: #fff;
    background: linear-gradient(145deg, rgba(255,255,255,.095), rgba(255,255,255,.028));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 18px 38px rgba(1,28,17,.12);
    backdrop-filter: blur(16px);
}
.modern-offer-validity__icon { width: 52px; height: 52px; border: 1px solid rgba(255,255,255,.2); border-radius: 18px; color: #ff8b32; background: rgba(255,255,255,.1); box-shadow: none; }
.modern-offer-validity strong { position: relative; padding-left: 12px; font-size: .83rem; }
.modern-offer-validity strong::before { content: ""; position: absolute; left: 0; top: .35em; width: 6px; height: 6px; border-radius: 50%; background: #ff8b32; box-shadow: 0 0 0 5px rgba(255,139,50,.12); }
.modern-offer-validity div > span { color: rgba(229,243,234,.72); }
.modern-offer-validity a { margin-top: 4px; padding: 9px 13px; border-color: rgba(255,255,255,.18); color: #082f23; background: #fff; }
.modern-offer-card__chakra { z-index: 2; left: auto; right: -58px; top: 50%; width: 250px; height: 250px; opacity: .25; border: 1px solid rgba(106,145,224,.45); transform: translateY(-50%); }
.modern-offer-card__chakra span { width: 140px; height: 140px; border-color: rgba(120,158,235,.72); background: repeating-conic-gradient(from 0deg, rgba(120,158,235,.65) 0 1.5deg, transparent 1.5deg 15deg); }

@media (max-width: 900px) {
    .modern-offer-card { grid-template-columns: 1fr 1fr; background: radial-gradient(circle at 8% 4%, rgba(255,137,47,.42), transparent 31%), radial-gradient(circle at 94% 94%, rgba(24,137,70,.42), transparent 36%), linear-gradient(130deg, #061f18, #0a3c2b 58%, #082f28); }
    .modern-offer-validity { grid-column: 1 / -1; grid-template-columns: 52px 1fr auto; min-height: auto; }
    .modern-offer-validity a { grid-column: 3; }
    .modern-offer-card__chakra { right: -70px; bottom: -70px; top: auto; transform: none; }
}

@media (max-width: 620px) {
    .modern-offer-card { grid-template-columns: 1fr; gap: 13px; padding: 14px; border-radius: 25px; background: radial-gradient(circle at 2% 2%, rgba(255,137,47,.5), transparent 30%), radial-gradient(circle at 98% 98%, rgba(24,137,70,.48), transparent 34%), linear-gradient(145deg, #061f18, #0a3c2b 58%, #082f28); }
    .modern-offer-card::before { left: 20px; right: 20px; top: 10px; }
    .modern-offer-card__copy, .modern-offer-coupon, .modern-offer-validity { min-height: auto; border-radius: 20px; }
    .modern-offer-card__copy { align-items: center; padding: 26px 18px 22px; }
    .modern-offer-card h2 { justify-content: center; }
    .modern-offer-card h2 strong { font-size: 4.5rem; }
    .modern-offer-coupon { padding: 20px 18px; transform: none; }
    .modern-offer-card:hover .modern-offer-coupon { transform: translateY(-3px); }
    .modern-offer-validity { grid-template-columns: 48px 1fr; padding: 20px 18px; }
    .modern-offer-validity a { grid-column: 2; }
    .modern-offer-card__chakra { display: grid; right: -72px; bottom: -72px; width: 190px; height: 190px; opacity: .2; transform: none; }
    .modern-offer-card__chakra span { width: 105px; height: 105px; }
}

/* Independence Day offer product gallery */
.modern-offer-card { min-height: 286px; grid-template-columns: 1.08fr 1fr .88fr .94fr; gap: 14px; padding: 18px; }
.modern-offer-card__copy, .modern-offer-products, .modern-offer-coupon, .modern-offer-validity { min-height: 248px; }
.modern-offer-card__copy { padding: 28px 24px; }
.modern-offer-products { position: relative; z-index: 4; display: flex; flex-direction: column; overflow: hidden; padding: 16px; border: 1px solid rgba(255,255,255,.15); border-radius: 24px; background: radial-gradient(circle at 50% 115%, rgba(235,198,105,.25), transparent 50%), linear-gradient(145deg, rgba(255,255,255,.12), rgba(255,255,255,.04)); box-shadow: inset 0 1px 0 rgba(255,255,255,.11), 0 18px 38px rgba(1,28,17,.14); backdrop-filter: blur(16px); }
.modern-offer-products::before { content: ""; position: absolute; left: 50%; bottom: 32px; width: 190px; height: 55px; border-radius: 50%; background: rgba(1,24,14,.28); filter: blur(15px); transform: translateX(-50%); }
.modern-offer-products__label { position: relative; z-index: 3; width: fit-content; display: inline-flex; align-items: center; gap: 6px; padding: 6px 9px; border: 1px solid rgba(255,255,255,.15); border-radius: 999px; color: #f2d17b; background: rgba(255,255,255,.075); font-size: .52rem; font-weight: 800; letter-spacing: .055em; text-transform: uppercase; }
.modern-offer-products__stage { position: relative; z-index: 2; flex: 1; display: flex; align-items: center; justify-content: center; padding: 12px 0 4px; }
.modern-offer-products__stage a { position: relative; flex: 0 0 76px; height: 135px; overflow: hidden; border: 2px solid rgba(255,255,255,.68); border-radius: 17px; background: color-mix(in srgb, var(--offer-product-accent) 14%, #fff); box-shadow: 0 13px 27px rgba(0,26,15,.27); transition: transform .3s cubic-bezier(.2,.75,.2,1), z-index .3s; }
.modern-offer-products__stage a:first-child { z-index: 1; transform: translate(16px,7px) rotate(-7deg); }
.modern-offer-products__stage a:nth-child(2) { z-index: 3; flex-basis: 87px; height: 151px; transform: translateY(-3px); }
.modern-offer-products__stage a:nth-child(3) { z-index: 2; transform: translate(-16px,7px) rotate(7deg); }
.modern-offer-products__stage a:hover { z-index: 5; transform: translateY(-9px) rotate(0) scale(1.04); }
.modern-offer-products__stage img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform .4s ease; }
.modern-offer-products__stage a:hover img { transform: scale(1.045); }
.modern-offer-products > p { position: relative; z-index: 3; display: flex; align-items: center; justify-content: center; gap: 7px; margin: 0; color: #d4e5dc; font-size: .53rem; font-weight: 700; }
.modern-offer-products > p .modern-offer-flag { width: 24px; height: 15px; }
.modern-offer-coupon, .modern-offer-validity { padding: 21px 18px; }
.modern-offer-validity { grid-template-columns: 45px 1fr; }
.modern-offer-validity__icon { width: 45px; height: 45px; }

@media (max-width: 1100px) {
    .modern-offer-card { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .modern-offer-card__copy, .modern-offer-products, .modern-offer-coupon, .modern-offer-validity { min-height: 225px; }
    .modern-offer-validity { grid-column: auto; grid-template-columns: 52px 1fr; }
    .modern-offer-validity a { grid-column: 2; grid-row: auto; }
}

@media (max-width: 620px) {
    .modern-offer-card { grid-template-columns: 1fr; }
    .modern-offer-card__copy, .modern-offer-products, .modern-offer-coupon, .modern-offer-validity { min-height: auto; }
    .modern-offer-products { min-height: 260px; order: 2; padding: 16px; border-radius: 20px; }
    .modern-offer-coupon { order: 3; }
    .modern-offer-validity { order: 4; }
    .modern-offer-products__stage a { flex-basis: 82px; height: 142px; }
    .modern-offer-products__stage a:nth-child(2) { flex-basis: 94px; height: 160px; }
}

/* White Independence Day flag theme */
.modern-offer-card {
    border: 1px solid #e2e9e3;
    background:
        radial-gradient(circle at 3% 0, rgba(255,128,38,.13), transparent 27%),
        radial-gradient(circle at 98% 100%, rgba(15,133,67,.12), transparent 29%),
        linear-gradient(135deg, rgba(255,255,255,.99), rgba(249,251,247,.97));
    box-shadow: 0 28px 68px rgba(29,61,42,.13), inset 0 1px 0 #fff;
}
.modern-offer-card::before { left: 20px; right: 20px; top: 13px; height: 5px; background: linear-gradient(90deg, #f47b25 0 32%, #fff 32% 65%, #108042 65%); box-shadow: 0 0 0 1px rgba(28,61,139,.04), 0 5px 16px rgba(47,76,55,.07); }
.modern-offer-card::after { left: -190px; bottom: -275px; border-color: rgba(16,128,66,.075); box-shadow: 0 0 0 70px rgba(16,128,66,.018), 0 0 0 140px rgba(244,123,37,.014); }
.modern-offer-card__ribbon { left: -9%; right: -9%; top: auto; bottom: -62px; width: auto; height: 142px; opacity: .9; border: 0; border-radius: 50%; background: linear-gradient(180deg, #f57e29 0 18%, #fff 18% 43%, #118143 43% 62%, transparent 62%); box-shadow: none; filter: none; transform: rotate(-3deg); }

.modern-offer-card__copy { border-color: #e5e8e2; color: #17372a; background: linear-gradient(145deg, rgba(255,255,255,.97), rgba(255,247,235,.82)); box-shadow: inset 0 1px 0 #fff, 0 15px 34px rgba(50,62,46,.075); }
.modern-offer-card__eyebrow { border-color: #f2d5bd; color: #c75b19; background: #fff5eb; }
.modern-offer-card h2 span { color: #e56d22; }
.modern-offer-card h2 strong { color: #183c80; text-shadow: none; }
.modern-offer-card h2 em { color: #087341; }
.modern-offer-card__copy p { color: #5e7167; }

.modern-offer-products { border-color: #dfe7e0; background: radial-gradient(circle at 50% 112%, rgba(19,130,67,.13), transparent 48%), linear-gradient(145deg, rgba(255,255,255,.98), rgba(245,249,243,.94)); box-shadow: inset 0 4px 0 #f47b25, inset 0 -4px 0 #108042, 0 17px 37px rgba(35,64,44,.085); }
.modern-offer-products::before { background: rgba(19,67,41,.18); }
.modern-offer-products__label { border-color: #f1d8c1; color: #be5b1f; background: #fff5eb; }
.modern-offer-products__stage a { border-color: #fff; box-shadow: 0 13px 27px rgba(19,55,34,.18), 0 0 0 1px rgba(20,95,53,.08); }
.modern-offer-products > p { color: #547065; }

.modern-offer-coupon { border: 1px solid #e2e8e2; background: linear-gradient(145deg, #fff, #fbfcf8); box-shadow: 0 20px 43px rgba(26,57,39,.1), inset 0 1px 0 #fff; }
.modern-offer-coupon::before { background: #f47b25; }
.modern-offer-coupon::after { background: #108042; }
.modern-offer-coupon button { background: linear-gradient(100deg, #f0f8f2, #fff7ed); }

.modern-offer-validity { border-color: #dce8df; color: #18392b; background: linear-gradient(145deg, rgba(242,249,244,.98), rgba(255,255,255,.95)); box-shadow: inset 0 1px 0 #fff, 0 17px 37px rgba(30,64,42,.08); }
.modern-offer-validity__icon { border-color: #d8e3da; color: #183c80; background: #fff; box-shadow: 0 8px 20px rgba(30,61,45,.09); }
.modern-offer-validity strong { color: #18392b; }
.modern-offer-validity div > span { color: #657970; }
.modern-offer-validity a { border-color: #0e7b42; color: #fff; background: linear-gradient(135deg, #108049, #086737); box-shadow: 0 9px 19px rgba(8,111,58,.17); }
.modern-offer-card__chakra { border-color: rgba(29,61,143,.1); opacity: .13; }
.modern-offer-card__chakra span { border-color: rgba(29,61,143,.34); background: repeating-conic-gradient(from 0deg, rgba(29,61,143,.34) 0 1.5deg, transparent 1.5deg 15deg); }

/* Single-image Independence Day campaign banner */
.independence-image-offer {
    position: relative;
    display: block;
    overflow: hidden;
    border: 1px solid rgba(21, 83, 48, .14);
    border-radius: 27px;
    background: #fff;
    box-shadow: 0 24px 60px rgba(16, 67, 39, .14);
    isolation: isolate;
    transition: transform .32s cubic-bezier(.2, .75, .2, 1), box-shadow .32s ease;
}
.independence-image-offer::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    border: 1px solid rgba(255, 255, 255, .58);
    border-radius: inherit;
    pointer-events: none;
}
.independence-image-offer img {
    width: 100%;
    display: block;
    aspect-ratio: 3 / 1;
    object-fit: cover;
    transition: transform .7s cubic-bezier(.2, .75, .2, 1), filter .32s ease;
}
.independence-image-offer:hover { transform: translateY(-5px); box-shadow: 0 31px 72px rgba(16, 67, 39, .2); }
.independence-image-offer:hover img { transform: scale(1.018); filter: saturate(1.04); }
.independence-image-offer:focus-visible { outline: 3px solid #0d7941; outline-offset: 4px; }

@media (max-width: 700px) {
    .independence-image-offer { border-radius: 20px; }
    .independence-image-offer img { aspect-ratio: 4 / 5; }
}

/* Extended modern content sections */
.content-section { position: relative; width: min(calc(100% - 64px), 1180px); margin: 0 auto; padding: 76px 0; }
.content-heading { display: grid; grid-template-columns: 1.15fr .65fr; gap: 56px; align-items: end; margin-bottom: 40px; }
.content-heading > div:first-child { min-width: 0; }
.content-eyebrow { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 13px; color: #0a7940; font-size: .67rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.content-eyebrow::before { content: ""; width: 26px; height: 2px; border-radius: 99px; background: #dd7430; }
.content-heading h2 { margin: 0; color: #11251b; font-family: var(--gx-font); font-size: clamp(2.2rem, 3.8vw, 4.15rem); font-weight: 600; line-height: .98; letter-spacing: -.055em; }
.content-heading h2 em { color: #0c7540; font-style: normal; }
.content-heading > p { max-width: 410px; margin: 0 0 7px; color: #66736b; font-size: .87rem; line-height: 1.7; }
.content-heading--center { grid-template-columns: 1fr; justify-items: center; text-align: center; }
.content-heading--center > p { max-width: 560px; margin: -25px auto 0; }

/* Brand story — editorial bento */
.brand-story-section { width: min(calc(100% - 48px), 1240px); margin-top: 70px; overflow: hidden; padding: 64px; border: 1px solid rgba(16,91,55,.1); border-radius: 42px; background: linear-gradient(145deg, rgba(255,255,255,.96), rgba(242,247,241,.94)); box-shadow: 0 35px 90px rgba(25,62,40,.105); isolation: isolate; }
.brand-story-section::before { content: "OUR STORY"; position: absolute; z-index: -1; right: -25px; top: 16px; color: transparent; -webkit-text-stroke: 1px rgba(11,103,56,.075); font-family: "Manrope", sans-serif; font-size: clamp(5rem, 11vw, 9rem); font-weight: 800; letter-spacing: -.075em; line-height: 1; pointer-events: none; white-space: nowrap; }
.brand-story-section::after { content: ""; position: absolute; z-index: -1; left: -55px; bottom: -95px; width: 260px; height: 260px; border: 1px solid rgba(10,117,64,.1); border-radius: 50%; box-shadow: 0 0 0 35px rgba(10,117,64,.025), 0 0 0 70px rgba(10,117,64,.018); }
.brand-story-glow { position: absolute; z-index: -1; width: 330px; height: 330px; border-radius: 50%; filter: blur(2px); pointer-events: none; }
.brand-story-glow--orange { left: -160px; top: -180px; background: radial-gradient(circle, rgba(239,147,65,.2), transparent 68%); }
.brand-story-glow--green { right: -170px; bottom: -160px; background: radial-gradient(circle, rgba(48,151,92,.2), transparent 68%); }
.brand-story-heading { position: relative; z-index: 2; grid-template-columns: 1.05fr .65fr; gap: 70px; margin-bottom: 45px; }
.brand-story-heading h2 { max-width: 710px; font-family: "Manrope", sans-serif; font-size: clamp(2.1rem, 3.35vw, 3.65rem); font-weight: 720; line-height: 1.06; letter-spacing: -.052em; }
.brand-story-heading h2 em { display: inline-block; margin-top: .13em; font-family: var(--gx-font); font-size: .88em; font-weight: 500; font-style: italic; letter-spacing: -.045em; }
.brand-story-heading__aside { align-self: end; padding: 8px 0 7px 24px; border-left: 1px solid #cedbd2; }
.brand-story-heading__aside p { margin: 0 0 18px; color: #617067; font-size: .82rem; line-height: 1.72; }
.brand-story-heading__aside a { width: fit-content; display: inline-flex; align-items: center; gap: 9px; padding-bottom: 5px; border-bottom: 1px solid rgba(7,111,59,.25); color: #08713d; font-size: .67rem; font-weight: 800; transition: gap .25s ease, color .25s ease; }
.brand-story-heading__aside a:hover { gap: 13px; color: #e1702f; }
.brand-story-grid { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr); gap: 22px; align-items: stretch; }
.brand-story-media { position: relative; min-width: 0; margin: 0; padding-bottom: 77px; }
.brand-story-media__frame { position: relative; height: 100%; min-height: 510px; overflow: hidden; border-radius: 31px 31px 105px 31px; background: #d8cfb5; box-shadow: 0 27px 58px rgba(22,52,35,.16); }
.brand-story-media__frame::after { content: ""; position: absolute; inset: 45% 0 0; background: linear-gradient(transparent, rgba(4,44,27,.48)); pointer-events: none; }
.brand-story-media img { width: 100%; height: 100%; min-height: 510px; display: block; object-fit: cover; transition: transform .75s cubic-bezier(.2,.75,.2,1); }
.brand-story-media:hover img { transform: scale(1.035); }
.brand-story-media__label { position: absolute; z-index: 2; left: 20px; top: 20px; display: inline-flex; align-items: center; gap: 7px; padding: 8px 11px; border: 1px solid rgba(255,255,255,.45); border-radius: 999px; color: #16482f; background: rgba(255,255,255,.84); box-shadow: 0 8px 24px rgba(23,53,36,.1); backdrop-filter: blur(13px); font-size: .59rem; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; }
.brand-story-media__label i { color: #0b8149; font-size: .9rem; }
.brand-story-media__count { position: absolute; z-index: 3; right: 22px; bottom: 21px; min-width: 112px; padding: 14px 16px; border: 1px solid rgba(255,255,255,.26); border-radius: 19px 19px 50px 19px; color: #daeadf; background: rgba(5,55,34,.76); backdrop-filter: blur(14px); font-size: .58rem; font-weight: 700; line-height: 1.3; text-transform: uppercase; letter-spacing: .07em; }
.brand-story-media__count strong { display: block; margin-bottom: 3px; color: #f0cf77; font-family: "Manrope", sans-serif; font-size: 1.8rem; line-height: .9; letter-spacing: -.08em; }
.brand-story-media figcaption { position: absolute; z-index: 5; left: 20px; right: 20px; bottom: 17px; min-height: 78px; display: grid; grid-template-columns: repeat(3, 1fr); align-items: center; overflow: hidden; border: 1px solid rgba(17,95,52,.1); border-radius: 19px; background: rgba(255,255,255,.94); box-shadow: 0 17px 36px rgba(19,55,34,.13); backdrop-filter: blur(15px); }
.brand-story-media figcaption > span { min-width: 0; display: flex; align-items: center; gap: 9px; padding: 15px; color: #6a766f; font-size: .55rem; }
.brand-story-media figcaption > span + span { border-left: 1px solid #e2e9e4; }
.brand-story-media figcaption i { flex: 0 0 31px; width: 31px; height: 31px; display: grid; place-items: center; border-radius: 10px; color: #087345; background: #e8f4ed; font-size: .95rem; }
.brand-story-media figcaption strong { display: block; color: #294036; font-size: .62rem; line-height: 1.35; }
.brand-story-panel { position: relative; overflow: hidden; display: flex; flex-direction: column; padding: 24px; border-radius: 31px; color: #fff; background: radial-gradient(circle at 100% 0, rgba(231,176,74,.22), transparent 31%), linear-gradient(145deg, #073d2c, #075a3b); box-shadow: 0 27px 58px rgba(8,58,37,.18); }
.brand-story-panel::after { content: ""; position: absolute; right: -85px; bottom: -95px; width: 250px; height: 250px; border: 1px solid rgba(255,255,255,.07); border-radius: 50%; box-shadow: 0 0 0 29px rgba(255,255,255,.025), 0 0 0 58px rgba(255,255,255,.018); }
.brand-story-panel__top { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; padding: 2px 3px 18px; border-bottom: 1px solid rgba(255,255,255,.11); color: #bcd4c7; font-size: .59rem; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.brand-story-panel__top i { color: #ebc96e; font-size: 1.2rem; }
.brand-story-points { position: relative; z-index: 2; display: grid; gap: 10px; }
.brand-story-point { position: relative; display: grid; grid-template-columns: 28px 44px 1fr; gap: 11px; align-items: center; min-height: 112px; padding: 16px; border: 1px solid rgba(255,255,255,.1); border-radius: 19px; background: linear-gradient(145deg, rgba(255,255,255,.09), rgba(255,255,255,.03)); backdrop-filter: blur(12px); transition: transform .25s ease, border-color .25s ease, background .25s ease; }
.brand-story-point:hover { transform: translateX(5px); border-color: rgba(235,201,110,.35); background: linear-gradient(145deg, rgba(255,255,255,.13), rgba(255,255,255,.05)); }
.brand-story-point__number { align-self: start; padding-top: 5px; color: rgba(235,201,110,.72); font-family: "Manrope", sans-serif; font-size: .62rem; font-weight: 800; }
.brand-story-point__icon { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 14px; color: #ebca70; background: rgba(255,255,255,.09); font-size: 1.15rem; }
.brand-story-point h3 { margin: 0 0 5px; color: #fff; font-size: .82rem; }
.brand-story-point p { margin: 0; color: #aec6b9; font-size: .64rem; line-height: 1.52; }
.brand-story-panel__note { position: relative; z-index: 2; display: grid; grid-template-columns: 35px 1fr; gap: 10px; align-items: center; margin-top: auto; padding: 18px 4px 1px; }
.brand-story-panel__note i { color: rgba(236,203,112,.58); font-size: 1.45rem; }
.brand-story-panel__note p { margin: 0; color: #d7e5dd; font-family: var(--gx-font); font-size: .72rem; font-style: italic; line-height: 1.5; }

/* Why Gawdee — layered glass bento */
.why-section { isolation: isolate; width: min(calc(100% - 40px), 1280px); overflow: hidden; padding: 22px; border: 1px solid rgba(255,255,255,.1); border-radius: 44px; color: #fff; background: radial-gradient(circle at 8% 3%, rgba(238,166,68,.24), transparent 29%), radial-gradient(circle at 94% 90%, rgba(43,171,103,.24), transparent 31%), linear-gradient(135deg, #041f18 0%, #063d2c 50%, #05291f 100%); box-shadow: 0 42px 95px rgba(4,45,28,.23), inset 0 1px 0 rgba(255,255,255,.08); }
.why-section::before { content: "GAWDEE"; position: absolute; z-index: -2; right: -20px; top: 18px; color: transparent; -webkit-text-stroke: 1px rgba(255,255,255,.055); font-family: "Manrope", sans-serif; font-size: clamp(6rem, 14vw, 11rem); font-weight: 850; letter-spacing: -.085em; line-height: 1; pointer-events: none; }
.why-section::after { content: ""; position: absolute; z-index: -3; inset: 0; opacity: .12; background-image: radial-gradient(rgba(255,255,255,.65) 1px, transparent 1px); background-size: 27px 27px; mask-image: linear-gradient(135deg, #000, transparent 58%); pointer-events: none; }
.why-aurora { position: absolute; z-index: -1; width: 390px; height: 390px; border-radius: 50%; filter: blur(70px); opacity: .3; pointer-events: none; }
.why-aurora--saffron { left: -210px; top: -180px; background: #f29a48; }
.why-aurora--green { right: -210px; bottom: -210px; background: #44b878; }
.why-glass-head { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 42px; align-items: end; margin-bottom: 14px; padding: clamp(31px, 4.6vw, 58px); border: 1px solid rgba(255,255,255,.13); border-radius: 31px; background: linear-gradient(130deg, rgba(255,255,255,.105), rgba(255,255,255,.035)); box-shadow: inset 0 1px 0 rgba(255,255,255,.09); backdrop-filter: blur(24px); }
.why-glass-head__copy { max-width: 760px; }
.why-section .content-eyebrow { margin-bottom: 17px; color: #f1ce75; }
.why-section .content-eyebrow::before { background: linear-gradient(90deg, #f28739, #fff 50%, #41a967); }
.why-glass-head h2 { margin: 0; color: #fff; font-family: var(--gx-font); font-size: clamp(3rem, 5.3vw, 6rem); font-weight: 600; line-height: .9; letter-spacing: -.065em; text-wrap: balance; }
.why-glass-head__copy > p { max-width: 640px; margin: 22px 0 0; color: #bbcec4; font-size: .84rem; line-height: 1.7; }
.why-proof { display: grid; grid-template-columns: repeat(2, 1fr); gap: 9px; }
.why-proof > div { min-width: 145px; min-height: 116px; display: grid; grid-template-columns: auto 1fr; gap: 11px; align-content: center; align-items: center; padding: 18px; border: 1px solid rgba(255,255,255,.13); border-radius: 21px; background: rgba(255,255,255,.07); box-shadow: inset 0 1px 0 rgba(255,255,255,.08); backdrop-filter: blur(15px); }
.why-proof strong, .why-proof i { color: #edcc73; font-family: "Manrope", sans-serif; font-size: 2.15rem; font-weight: 800; line-height: 1; }
.why-proof i { font-size: 1.9rem; }
.why-proof span { color: #d2e1d9; font-size: .57rem; font-weight: 750; line-height: 1.45; text-transform: uppercase; letter-spacing: .07em; }
.why-grid { position: relative; z-index: 2; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.why-card { position: relative; min-height: 220px; display: flex; flex-direction: column; overflow: hidden; padding: 23px; border: 1px solid rgba(255,255,255,.12); border-radius: 25px; color: #fff; background: linear-gradient(145deg, rgba(255,255,255,.1), rgba(255,255,255,.028)); box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 17px 40px rgba(0,19,12,.1); backdrop-filter: blur(20px); transition: transform .3s cubic-bezier(.2,.75,.2,1), background .3s ease, border-color .3s ease, box-shadow .3s ease; }
.why-card:first-child { grid-column: span 2; background: radial-gradient(circle at 92% 5%, rgba(239,190,84,.18), transparent 36%), linear-gradient(145deg, rgba(255,255,255,.13), rgba(255,255,255,.035)); }
.why-card::after { content: ""; position: absolute; right: -48px; bottom: -70px; width: 145px; height: 145px; border: 1px solid rgba(255,255,255,.06); border-radius: 50%; box-shadow: 0 0 0 22px rgba(255,255,255,.018), 0 0 0 44px rgba(255,255,255,.012); transition: transform .45s ease; }
.why-card:hover { z-index: 3; transform: translateY(-7px); border-color: rgba(239,205,113,.4); background: linear-gradient(145deg, rgba(255,255,255,.155), rgba(255,255,255,.05)); box-shadow: inset 0 1px 0 rgba(255,255,255,.13), 0 25px 52px rgba(0,21,13,.2); }
.why-card:hover::after { transform: translate(-10px,-8px) scale(1.05); }
.why-card__top { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; margin-bottom: 27px; }
.why-card__icon { width: 50px; height: 50px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.12); border-radius: 16px; color: #f0cc72; background: rgba(255,255,255,.085); box-shadow: inset 0 1px 0 rgba(255,255,255,.08); font-size: 1.38rem; }
.why-card__number { color: rgba(229,238,233,.26); font-family: "Manrope", sans-serif; font-size: 1.48rem; font-weight: 850; letter-spacing: -.08em; }
.why-card__copy { position: relative; z-index: 1; max-width: 560px; }
.why-card h3 { margin: 0 0 8px; color: #fff; font-size: 1rem; letter-spacing: -.025em; }
.why-card p { margin: 0; color: #afc5b9; font-size: .67rem; line-height: 1.58; }
.why-card__detail { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; padding-top: 20px; color: #d7e6de; font-size: .56rem; font-weight: 800; letter-spacing: .075em; text-transform: uppercase; }
.why-card__detail i { width: 29px; height: 29px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.13); border-radius: 50%; color: #ebc96f; background: rgba(255,255,255,.06); transition: transform .25s, background .25s; }
.why-card:hover .why-card__detail i { background: rgba(255,255,255,.12); transform: translate(2px,-2px); }
.why-glass-foot { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 30px; margin-top: 14px; padding: 18px 20px; border: 1px solid rgba(255,255,255,.12); border-radius: 23px; background: rgba(255,255,255,.065); backdrop-filter: blur(18px); }
.why-glass-foot > div { display: flex; align-items: center; gap: 12px; }
.why-glass-foot > div > span { flex: 0 0 40px; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 13px; color: #062c20; background: #edca70; font-size: 1.05rem; }
.why-glass-foot p { margin: 0; color: #bcd0c5; font-size: .64rem; line-height: 1.55; }
.why-glass-foot p strong { display: block; color: #fff; font-size: .7rem; }
.why-glass-foot > a { flex: 0 0 auto; min-height: 43px; display: inline-flex; align-items: center; gap: 9px; padding: 0 17px; border: 1px solid rgba(255,255,255,.16); border-radius: 13px; color: #073426; background: #fff; box-shadow: 0 10px 23px rgba(0,22,13,.17); font-size: .63rem; font-weight: 800; transition: gap .25s, transform .25s; }
.why-glass-foot > a:hover { gap: 13px; transform: translateY(-2px); }

/* Warm editorial "Why Gawdee" experience */
.why-modern-section { isolation: isolate; width: min(calc(100% - 40px), 1280px); overflow: hidden; padding: 18px; border: 1px solid rgba(64,94,59,.12); border-radius: 44px; color: #173421; background: radial-gradient(circle at 7% 10%, rgba(234,244,217,.72), transparent 22%), radial-gradient(circle at 96% 91%, rgba(244,220,169,.38), transparent 25%), linear-gradient(145deg, #fbfaf5, #f3f0e5); box-shadow: 0 35px 85px rgba(50,67,46,.13); }
.why-modern-section::before { content: "WHY"; position: absolute; z-index: -1; right: -24px; top: 35%; color: transparent; -webkit-text-stroke: 1px rgba(36,91,49,.055); font-family: "Manrope", sans-serif; font-size: clamp(7rem, 19vw, 16rem); font-weight: 850; letter-spacing: -.09em; line-height: .8; pointer-events: none; }
.why-modern-leaf { position: absolute; z-index: 5; color: rgba(60,112,47,.18); font-size: 9rem; line-height: 1; pointer-events: none; filter: drop-shadow(0 12px 18px rgba(43,74,41,.08)); }
.why-modern-leaf--top { right: -29px; top: -18px; transform: rotate(-25deg); }
.why-modern-leaf--bottom { left: -44px; bottom: -30px; transform: rotate(24deg); }
.why-modern-eyebrow { display: inline-flex; align-items: center; gap: 9px; color: #285b2b; font-size: .72rem; font-weight: 750; letter-spacing: .015em; }
.why-modern-eyebrow i { color: #4b8f31; font-size: 1.08rem; }
.why-modern-feature { position: relative; z-index: 2; min-height: 550px; display: grid; grid-template-columns: minmax(330px,.88fr) minmax(0,1.25fr); overflow: hidden; border: 1px solid rgba(70,99,62,.12); border-radius: 34px; background: #fffdf8; box-shadow: 0 21px 52px rgba(47,66,43,.09); }
.why-modern-feature__copy { position: relative; z-index: 2; display: flex; flex-direction: column; justify-content: center; padding: clamp(42px,5vw,70px) clamp(34px,5vw,66px) 152px; background: linear-gradient(90deg, #fffdf8 82%, rgba(255,253,248,.76)); }
.why-modern-feature__copy::after { content: ""; position: absolute; z-index: -1; right: -78px; top: 0; bottom: 0; width: 150px; background: linear-gradient(90deg, #fffdf8, transparent); }
.why-modern-feature h2, .why-modern-intro h2 { margin: 20px 0 16px; color: #123420; font-family: var(--gx-font); font-size: clamp(3.35rem,5.2vw,5.6rem); font-weight: 600; line-height: .92; letter-spacing: -.06em; text-wrap: balance; }
.why-modern-feature__copy > p, .why-modern-intro > p { max-width: 460px; margin: 0; color: #536158; font-size: .84rem; line-height: 1.72; }
.why-modern-pillars { display: grid; grid-template-columns: repeat(3,1fr); margin-top: 37px; }
.why-modern-pillars > span { min-width: 0; display: grid; justify-items: center; gap: 10px; padding: 0 12px; text-align: center; }
.why-modern-pillars > span + span { border-left: 1px dashed #d9d5c9; }
.why-modern-pillars i { width: 57px; height: 57px; display: grid; place-items: center; border: 1px solid #e1dfd1; border-radius: 50%; color: #3d8429; background: linear-gradient(145deg,#fff,#f1f0e5); box-shadow: 0 8px 18px rgba(57,77,50,.1), inset 0 0 0 5px rgba(255,255,255,.7); font-size: 1.6rem; }
.why-modern-pillars strong { color: #334339; font-size: .65rem; line-height: 1.45; }
.why-modern-feature__media { position: relative; min-width: 0; overflow: hidden; background: linear-gradient(135deg,#f8edce,#edf3e0); }
.why-modern-feature__media::after { content: ""; position: absolute; inset: 0; box-shadow: inset 50px 0 65px rgba(255,253,248,.54); pointer-events: none; }
.why-modern-feature__media img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: 55% center; transform: scale(1.04); transition: transform .8s cubic-bezier(.2,.7,.2,1); }
.why-modern-feature:hover .why-modern-feature__media img { transform: scale(1.075); }
.why-modern-feature__seal { position: absolute; z-index: 2; right: 22px; top: 22px; display: inline-flex; align-items: center; gap: 7px; padding: 9px 12px; border: 1px solid rgba(255,255,255,.75); border-radius: 999px; color: #174c2e; background: rgba(255,255,255,.82); box-shadow: 0 9px 23px rgba(40,59,32,.1); backdrop-filter: blur(14px); font-size: .58rem; font-weight: 800; }
.why-modern-feature blockquote { position: absolute; z-index: 4; left: 40%; right: 4%; bottom: 19px; min-height: 64px; display: flex; align-items: center; gap: 17px; margin: 0; padding: 13px 24px; border: 1px solid rgba(255,255,255,.28); border-radius: 21px; color: #fff; background: linear-gradient(90deg,rgba(21,75,34,.98),rgba(62,112,35,.92)); box-shadow: 0 17px 35px rgba(27,65,31,.22); }
.why-modern-feature blockquote > i:first-child { font-size: 2rem; }
.why-modern-feature blockquote > i:last-child { margin-left: auto; color: #a9c681; font-size: 2.35rem; }
.why-modern-feature blockquote p { margin: 0; font-family: var(--gx-font); font-size: .82rem; line-height: 1.45; }
.why-modern-standards { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(235px,.74fr) minmax(0,2.45fr); gap: 25px; margin-top: 16px; padding: clamp(26px,3.6vw,46px); border: 1px solid rgba(67,94,57,.11); border-radius: 34px; background: rgba(255,253,247,.88); box-shadow: 0 20px 48px rgba(56,71,47,.08); backdrop-filter: blur(12px); }
.why-modern-intro { padding: 8px 4px; }
.why-modern-intro h2 { margin-top: 18px; font-size: clamp(2.7rem,4vw,4.5rem); }
.why-modern-intro > p { font-size: .75rem; }
.why-modern-proof { display: grid; gap: 12px; margin-top: 32px; }
.why-modern-proof > div { position: relative; min-height: 96px; display: flex; align-items: center; gap: 16px; overflow: hidden; padding: 18px 19px; border: 1px solid #e5e1d5; border-radius: 19px; color: #23472d; background: linear-gradient(145deg,#fff,#f4f2e8); box-shadow: 0 10px 25px rgba(44,68,45,.08); }
.why-modern-proof > div:first-child { color: #fff; border-color: #214c29; background: linear-gradient(140deg,#173e22,#3d762d); }
.why-modern-proof strong, .why-modern-proof > div > i:first-child { flex: 0 0 auto; font-family: var(--gx-font); font-size: 2.65rem; font-weight: 600; line-height: 1; }
.why-modern-proof > div > i:first-child { font-size: 2rem; }
.why-modern-proof span { font-size: .65rem; font-weight: 750; line-height: 1.5; }
.why-modern-proof > div > i:last-child { position: absolute; right: 12px; bottom: -8px; color: rgba(255,255,255,.17); font-size: 3.6rem; transform: rotate(-18deg); }
.why-modern-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 13px; }
.why-modern-card { position: relative; min-width: 0; min-height: 248px; display: flex; flex-direction: column; align-items: center; overflow: hidden; padding: 23px 16px 17px; border: 1px solid #e4e2d9; border-radius: 20px; text-align: center; background: linear-gradient(155deg,#fff 0%,#fdfcf8 100%); box-shadow: 0 12px 28px rgba(49,68,45,.075); transition: transform .3s cubic-bezier(.2,.75,.2,1), border-color .3s, box-shadow .3s; }
.why-modern-card::after { content: ""; position: absolute; left: 16px; right: 16px; bottom: 47px; height: 1px; background: #ece9e0; }
.why-modern-card:hover { z-index: 3; transform: translateY(-7px); border-color: #b9c9ac; box-shadow: 0 21px 38px rgba(44,75,46,.13); }
.why-modern-card__number { position: absolute; left: 16px; top: 14px; color: #376b3a; font-family: var(--gx-font); font-size: .83rem; }
.why-modern-card__icon { width: 59px; height: 59px; display: grid; place-items: center; margin: 4px 0 15px; border: 1px solid #e3e4d9; border-radius: 50%; color: #4c8c2e; background: linear-gradient(145deg,#f4f3e7,#fff); box-shadow: inset 0 0 0 5px rgba(255,255,255,.75); font-size: 1.52rem; }
.why-modern-card h3 { min-height: 40px; display: grid; place-items: center; margin: 0 0 9px; color: #1d3325; font-size: .74rem; line-height: 1.35; }
.why-modern-card p { margin: 0; color: #667069; font-size: .58rem; line-height: 1.6; }
.why-modern-card__detail { margin-top: auto; padding-top: 23px; color: #41614a; font-size: .53rem; font-weight: 800; }
.why-modern-footer { position: relative; z-index: 2; display: grid; justify-items: center; gap: 15px; padding: 28px 22px 10px; }
.why-modern-footer p { min-height: 55px; display: flex; align-items: center; justify-content: center; gap: 13px; width: min(100%,820px); margin: 0; padding: 11px 20px; border-radius: 17px; color: #34503a; text-align: center; background: linear-gradient(90deg,rgba(229,234,206,.6),rgba(249,244,219,.75),rgba(229,234,206,.6)); font-size: .7rem; }
.why-modern-footer p i { color: #4a8a34; font-size: 1.4rem; }
.why-modern-footer p strong { color: #183d25; }
.why-modern-footer a { min-width: 330px; min-height: 52px; display: inline-flex; align-items: center; justify-content: center; gap: 17px; padding: 0 24px; border: 1px solid rgba(255,255,255,.17); border-radius: 17px; color: #fff; background: linear-gradient(135deg,#143d21,#3f7830); box-shadow: 0 13px 27px rgba(37,76,36,.22), inset 0 1px rgba(255,255,255,.15); font-size: .72rem; font-weight: 750; transition: transform .25s,gap .25s,box-shadow .25s; }
.why-modern-footer a:hover { gap: 23px; transform: translateY(-3px); box-shadow: 0 18px 34px rgba(37,76,36,.29); }

@media (max-width: 1080px) {
    .why-modern-feature { grid-template-columns: .9fr 1.1fr; }
    .why-modern-feature__copy { padding-inline: 34px; }
    .why-modern-feature h2 { font-size: 4rem; }
    .why-modern-standards { grid-template-columns: 1fr; }
    .why-modern-intro { display: grid; grid-template-columns: 1fr auto; gap: 0 28px; align-items: end; }
    .why-modern-intro .why-modern-eyebrow, .why-modern-intro h2, .why-modern-intro > p { grid-column: 1; }
    .why-modern-proof { grid-column: 2; grid-row: 1 / 4; min-width: 280px; margin-top: 0; }
}

@media (max-width: 760px) {
    .why-modern-section { width: calc(100% - 16px); padding: 9px; border-radius: 29px; }
    .why-modern-leaf { font-size: 6.5rem; }
    .why-modern-feature { min-height: 0; grid-template-columns: 1fr; border-radius: 23px; }
    .why-modern-feature__copy { padding: 36px 23px 29px; background: #fffdf8; }
    .why-modern-feature__copy::after { display: none; }
    .why-modern-feature h2 { margin-top: 16px; font-size: 3.15rem; }
    .why-modern-feature__copy > p { font-size: .73rem; }
    .why-modern-pillars { margin-top: 28px; }
    .why-modern-pillars > span { padding-inline: 5px; }
    .why-modern-pillars i { width: 49px; height: 49px; font-size: 1.3rem; }
    .why-modern-pillars strong { font-size: .58rem; }
    .why-modern-feature__media { min-height: 315px; }
    .why-modern-feature__media::after { box-shadow: inset 0 38px 48px rgba(255,253,248,.4); }
    .why-modern-feature blockquote { position: relative; left: auto; right: auto; bottom: auto; margin: -34px 15px 15px; padding: 13px 17px; border-radius: 17px; }
    .why-modern-feature blockquote p { font-size: .68rem; }
    .why-modern-feature blockquote > i:last-child { display: none; }
    .why-modern-standards { gap: 23px; margin-top: 9px; padding: 28px 14px 14px; border-radius: 23px; }
    .why-modern-intro { display: block; padding: 0 6px; }
    .why-modern-intro h2 { font-size: 2.8rem; }
    .why-modern-proof { grid-template-columns: 1fr 1fr; min-width: 0; margin-top: 25px; }
    .why-modern-proof > div { min-height: 93px; align-items: flex-start; flex-direction: column; gap: 7px; padding: 14px; }
    .why-modern-proof strong { font-size: 2rem; }
    .why-modern-proof span br { display: none; }
    .why-modern-grid { grid-template-columns: 1fr 1fr; gap: 9px; }
    .why-modern-card { min-height: 235px; padding: 20px 11px 14px; border-radius: 17px; }
    .why-modern-card__number { left: 12px; top: 11px; }
    .why-modern-card__icon { width: 52px; height: 52px; }
    .why-modern-card h3 { font-size: .67rem; }
    .why-modern-card p { font-size: .53rem; }
    .why-modern-footer { padding: 20px 8px 5px; }
    .why-modern-footer p { align-items: flex-start; padding: 13px; text-align: left; font-size: .61rem; }
    .why-modern-footer a { min-width: 0; width: 100%; }
}

@media (max-width: 430px) {
    .why-modern-grid { grid-template-columns: 1fr; }
    .why-modern-card { min-height: 220px; }
}

/* Rails and controls */
.section-rail-controls { display: flex; justify-content: flex-end; gap: 9px; margin-bottom: 7px; }
.section-rail-controls button { width: 43px; height: 43px; display: grid; place-items: center; border: 1px solid #dce5de; border-radius: 50%; color: #0a6c39; background: #fff; cursor: pointer; transition: color .2s ease, background .2s ease, transform .2s ease; }
.section-rail-controls button:hover { color: #fff; background: #08703b; transform: translateY(-2px); }
.testimonial-rail, .story-rail { display: flex; gap: 16px; overflow-x: auto; padding: 4px 2px 20px; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; }
.testimonial-rail::-webkit-scrollbar, .story-rail::-webkit-scrollbar { display: none; }

/* Testimonials */
.testimonial-section { padding-block: 90px; }
.testimonial-section::before { content: "REVIEWS"; position: absolute; left: 50%; top: 36px; color: transparent; -webkit-text-stroke: 1px rgba(14,99,55,.07); font-family: "Manrope", sans-serif; font-size: clamp(5rem, 10vw, 9rem); font-weight: 800; line-height: 1; transform: translateX(-50%); }
.testimonial-card { flex: 0 0 calc((100% - 32px) / 3); min-width: 340px; min-height: 285px; display: flex; flex-direction: column; padding: 24px; scroll-snap-align: start; border: 1px solid #e3e3dc; border-radius: 25px; background: linear-gradient(145deg, #fff, #fcfaf3); box-shadow: 0 14px 35px rgba(31,54,39,.08); }
.testimonial-card__top { display: grid; grid-template-columns: 48px 1fr auto; gap: 12px; align-items: center; }
.testimonial-avatar { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 16px; color: #fff; background: linear-gradient(145deg, #0a8450, #095b35); font-size: .72rem; font-weight: 800; }
.testimonial-card__top h3 { margin: 0 0 2px; font-size: .9rem; }
.testimonial-card__top p { margin: 0; color: #859088; font-size: .64rem; }
.testimonial-card__top > i { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; color: #0a7d43; background: #dff0e5; font-size: 1.1rem; }
.testimonial-stars { display: flex; align-items: center; gap: 3px; margin: 17px 0 14px; color: #d6a83b; font-size: .8rem; }
.testimonial-stars span { margin-left: 8px; padding: 5px 8px; border-radius: 999px; color: #6a644d; background: #f1ecdc; font-size: .57rem; font-weight: 700; }
.testimonial-card blockquote { margin: 0 0 23px; color: #536057; font-family: var(--gx-font); font-size: .85rem; line-height: 1.65; }
.testimonial-card > a { display: inline-flex; align-items: center; gap: 7px; margin-top: auto; color: #0a6e3a; font-size: .67rem; font-weight: 800; }

/* Customer stories */
.customer-stories-section { isolation: isolate; width: min(calc(100% - 40px),1280px); overflow: hidden; padding: clamp(58px,6vw,84px) 28px 30px; border: 1px solid rgba(59,83,53,.1); border-radius: 44px; background: radial-gradient(circle at 7% 20%,rgba(232,241,215,.88),transparent 25%), radial-gradient(circle at 93% 86%,rgba(242,219,170,.43),transparent 27%), linear-gradient(145deg,#fbfaf4,#f4f1e7); box-shadow: 0 34px 80px rgba(42,63,42,.12); }
.customer-stories-section::before { content: "STORIES"; position: absolute; z-index: -1; left: 50%; top: 20px; color: transparent; -webkit-text-stroke: 1px rgba(27,86,47,.055); font-family: "Manrope",sans-serif; font-size: clamp(6rem,13vw,11rem); font-weight: 850; letter-spacing: -.07em; line-height: .85; transform: translateX(-50%); pointer-events: none; }
.customer-stories-section::after { content: ""; position: absolute; z-index: -2; inset: 0; opacity: .19; background-image: radial-gradient(rgba(58,92,50,.2) .8px,transparent .8px); background-size: 24px 24px; mask-image: linear-gradient(115deg,#000,transparent 34%,transparent 70%,#000); pointer-events: none; }
.customer-stories-leaf { position: absolute; z-index: -1; color: rgba(61,112,44,.14); font-size: 9rem; line-height: 1; pointer-events: none; }
.customer-stories-leaf--left { left: -42px; bottom: 6px; transform: rotate(25deg); }
.customer-stories-leaf--right { right: -32px; top: 45px; transform: rotate(-22deg); }
.customer-stories-head { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 40px; align-items: end; padding: 0 16px; }
.customer-stories-head__copy { max-width: 820px; }
.customer-stories-head .content-eyebrow { margin-bottom: 17px; color: #2e6738; }
.customer-stories-head .content-eyebrow::before { background: linear-gradient(90deg,#ef8b3e,#2f7a3a); }
.customer-stories-head h2 { max-width: 760px; margin: 0; color: #143421; font-family: "Manrope",sans-serif; font-size: clamp(2.25rem,3.8vw,4.15rem); font-weight: 720; line-height: 1.02; letter-spacing: -.055em; text-wrap: balance; }
.customer-stories-head__copy > p { max-width: 650px; margin: 19px 0 0; color: #5f6a62; font-size: .8rem; line-height: 1.7; }
.customer-stories-proof { display: grid; grid-template-columns: repeat(2,minmax(130px,1fr)); gap: 10px; }
.customer-stories-proof > div { min-height: 118px; display: grid; align-content: center; gap: 5px; padding: 17px 18px; border: 1px solid #e2dfd3; border-radius: 21px; color: #244c2e; background: rgba(255,255,255,.72); box-shadow: 0 12px 29px rgba(55,71,48,.08); backdrop-filter: blur(10px); }
.customer-stories-proof > div:first-child { grid-template-columns: auto 1fr; align-items: center; column-gap: 10px; }
.customer-stories-proof > div:first-child > strong { grid-row: 1 / 3; color: #174629; font-family: var(--gx-font); font-size: 2.55rem; font-weight: 600; line-height: 1; }
.customer-stories-proof__stars { color: #d5a83d; font-size: .68rem; letter-spacing: .05em; }
.customer-stories-proof small { color: #788279; font-size: .53rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.customer-stories-proof > div:last-child { grid-template-columns: 39px 1fr; align-items: center; }
.customer-stories-proof > div:last-child > i { grid-row: 1 / 3; width: 39px; height: 39px; display: grid; place-items: center; border-radius: 13px; color: #fff; background: linear-gradient(145deg,#1b7443,#49a35e); box-shadow: 0 8px 18px rgba(33,100,53,.2); font-size: 1.15rem; }
.customer-stories-proof > div:last-child span { display: grid; gap: 4px; }
.customer-stories-proof > div:last-child strong { color: #1b3d27; font-size: .74rem; }
.customer-stories-toolbar { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 24px; margin: 34px 3px 13px; padding: 12px 14px 12px 18px; border: 1px solid rgba(64,94,57,.11); border-radius: 17px; background: rgba(255,255,255,.58); backdrop-filter: blur(10px); }
.customer-stories-toolbar > p { display: flex; align-items: center; gap: 8px; margin: 0; color: #486052; font-size: .66rem; font-weight: 700; }
.customer-stories-toolbar > p i { color: #d26b40; font-size: 1rem; }
.customer-stories-controls { align-items: center; gap: 8px; margin: 0; }
.customer-stories-controls > span { color: #718078; font-size: .55rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.customer-stories-controls button { width: 37px; height: 37px; border-color: #d8ddd3; box-shadow: 0 6px 14px rgba(49,71,49,.07); }
.customer-stories-rail { position: relative; z-index: 2; gap: 15px; margin-inline: -2px; padding: 4px 2px 22px; }
.customer-story-card { position: relative; flex: 0 0 calc((100% - 30px) / 3); min-width: 340px; min-height: 390px; display: flex; flex-direction: column; overflow: hidden; padding: 25px; scroll-snap-align: start; border: 1px solid #e0ded5; border-radius: 27px; background: linear-gradient(152deg,#fff 0%,#fbfaf4 100%); box-shadow: 0 16px 35px rgba(45,64,43,.09); transition: transform .32s cubic-bezier(.2,.75,.2,1),box-shadow .32s,border-color .32s; }
.customer-story-card::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 5px; background: linear-gradient(90deg,#ed8c43,#f2d49c 45%,#2b864a); opacity: .9; }
.customer-story-card::after { content: ""; position: absolute; right: -58px; top: -65px; width: 160px; height: 160px; border-radius: 50%; background: radial-gradient(circle,rgba(220,233,205,.75),rgba(220,233,205,0) 68%); pointer-events: none; }
.customer-story-card:nth-child(2)::before { background: linear-gradient(90deg,#337e48,#bdd39c,#d8aa4c); }
.customer-story-card:nth-child(3)::before { background: linear-gradient(90deg,#df7641,#f4c673,#2d8a4d); }
.customer-story-card:hover { z-index: 3; transform: translateY(-8px); border-color: #becbb6; box-shadow: 0 26px 50px rgba(44,72,45,.15); }
.customer-story-card__number { position: absolute; right: 21px; top: 19px; z-index: 1; color: rgba(42,96,52,.2); font-family: var(--gx-font); font-size: 1rem; font-weight: 600; }
.customer-story-card__top { position: relative; z-index: 2; display: grid; grid-template-columns: 53px 1fr 43px; gap: 12px; align-items: center; padding-right: 27px; }
.customer-story-avatar { width: 53px; height: 53px; display: grid; place-items: center; border: 3px solid #fff; border-radius: 18px; color: #fff; background: linear-gradient(145deg,#0d8250,#075d37); box-shadow: 0 9px 20px rgba(20,91,53,.22); font-size: .68rem; font-weight: 850; letter-spacing: .03em; }
.customer-story-card:nth-child(2) .customer-story-avatar { background: linear-gradient(145deg,#9f742d,#d2a74e); }
.customer-story-card:nth-child(3) .customer-story-avatar { background: linear-gradient(145deg,#ca663e,#e8954d); }
.customer-story-card__top h3 { margin: 0 0 4px; color: #20372a; font-size: .83rem; }
.customer-story-card__top p { display: flex; align-items: center; gap: 5px; margin: 0; color: #718078; font-size: .56rem; }
.customer-story-card__top p i { color: #2b9856; font-size: .72rem; }
.customer-story-quote { width: 43px; height: 43px; display: grid; place-items: center; border: 1px solid #dce6d5; border-radius: 50%; color: #34834a; background: #f0f7ea; font-size: 1.12rem; }
.customer-story-rating { display: flex; align-items: center; gap: 3px; margin: 24px 0 15px; color: #d5a43a; font-size: .78rem; }
.customer-story-rating__stars { color: #d5a43a; font-size: .75rem; letter-spacing: .06em; }
.customer-story-rating span { margin-left: 6px; color: #765e25; font-size: .57rem; font-weight: 850; }
.customer-story-rating .customer-story-rating__stars { margin-left: 0; color: #d5a43a; font-size: .75rem; }
.customer-story-card blockquote { min-height: 112px; margin: 0 0 21px; color: #46564b; font-family: var(--gx-font); font-size: .86rem; line-height: 1.65; }
.customer-story-product { min-height: 79px; display: grid; grid-template-columns: 55px 1fr 38px; gap: 11px; align-items: center; margin-top: auto; padding: 10px; border: 1px solid #e4e3d9; border-radius: 18px; background: linear-gradient(135deg,#f3f3e8,#faf8ee); }
.customer-story-product__image { width: 55px; height: 55px; overflow: hidden; border: 1px solid #e1e2d8; border-radius: 14px; background: #fff; }
.customer-story-product__image img { width: 100%; height: 100%; display: block; object-fit: cover; }
.customer-story-product div { min-width: 0; }
.customer-story-product small, .customer-story-product strong { display: block; }
.customer-story-product small { margin-bottom: 4px; color: #7a847d; font-size: .49rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; }
.customer-story-product strong { overflow: hidden; color: #24462d; font-size: .64rem; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.customer-story-product > a { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px; color: #fff; background: linear-gradient(145deg,#116e40,#318e4c); box-shadow: 0 8px 16px rgba(27,93,51,.18); transition: transform .25s,background .25s; }
.customer-story-product > a:hover { transform: translate(2px,-2px); background: #0b5732; }
.customer-stories-foot { position: relative; z-index: 2; min-height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 2px; padding: 14px 16px 14px 20px; border: 1px solid rgba(255,255,255,.23); border-radius: 21px; color: #d7e7dc; background: linear-gradient(110deg,#123a24,#2d7240); box-shadow: 0 16px 31px rgba(28,74,39,.18); }
.customer-stories-foot > span { display: flex; align-items: center; gap: 10px; font-size: .65rem; line-height: 1.55; }
.customer-stories-foot > span > i { font-size: 1.5rem; }
.customer-stories-foot > span strong { color: #fff; }
.customer-stories-foot > a { flex: 0 0 auto; min-height: 42px; display: inline-flex; align-items: center; gap: 9px; padding: 0 16px; border-radius: 13px; color: #17482c; background: #fff; font-size: .6rem; font-weight: 850; transition: gap .25s,transform .25s; }
.customer-stories-foot > a:hover { gap: 13px; transform: translateY(-2px); }

@media (max-width: 960px) {
    .customer-stories-head { grid-template-columns: 1fr; }
    .customer-stories-proof { width: min(100%,440px); }
    .customer-story-card { flex-basis: calc((100% - 15px) / 2); }
}

@media (max-width: 620px) {
    .customer-stories-section { width: calc(100% - 16px); padding: 47px 10px 12px; border-radius: 29px; }
    .customer-stories-section::before { top: 25px; font-size: 4.5rem; }
    .customer-stories-leaf { font-size: 6rem; }
    .customer-stories-head { gap: 25px; padding: 0 8px; }
    .customer-stories-head h2 { font-size: 2.05rem; line-height: 1.08; }
    .customer-stories-head__copy > p { font-size: .69rem; }
    .customer-stories-proof { grid-template-columns: 1fr 1fr; gap: 7px; }
    .customer-stories-proof > div { min-height: 100px; padding: 13px; border-radius: 17px; }
    .customer-stories-proof > div:first-child > strong { font-size: 2rem; }
    .customer-stories-proof > div:last-child { grid-template-columns: 33px 1fr; }
    .customer-stories-proof > div:last-child > i { width: 33px; height: 33px; }
    .customer-stories-toolbar { margin-top: 22px; padding: 9px 9px 9px 12px; }
    .customer-stories-toolbar > p { font-size: .57rem; }
    .customer-stories-controls > span { display: none; }
    .customer-stories-controls button { width: 34px; height: 34px; }
    .customer-stories-rail { gap: 10px; padding-bottom: 16px; }
    .customer-story-card { flex-basis: 88vw; min-width: 0; min-height: 380px; padding: 21px; border-radius: 22px; }
    .customer-story-card__top { grid-template-columns: 48px 1fr 39px; gap: 10px; padding-right: 20px; }
    .customer-story-avatar { width: 48px; height: 48px; border-radius: 15px; }
    .customer-story-quote { width: 39px; height: 39px; }
    .customer-story-card blockquote { min-height: 102px; font-size: .78rem; }
    .customer-stories-foot { align-items: stretch; flex-direction: column; gap: 13px; padding: 17px; }
    .customer-stories-foot > span { align-items: flex-start; }
    .customer-stories-foot > a { justify-content: center; }
}

/* Colourful product-led customer stories */
.customer-stories-section {
    background:
        radial-gradient(circle at 5% 13%, rgba(255,204,126,.42), transparent 23%),
        radial-gradient(circle at 91% 16%, rgba(119,190,127,.35), transparent 23%),
        radial-gradient(circle at 86% 88%, rgba(239,137,86,.22), transparent 24%),
        linear-gradient(145deg,#fffaf0,#eef8e9 52%,#fff3e9);
}
.customer-stories-head .content-eyebrow { color: #b35d2e; }
.customer-stories-head .content-eyebrow::before { background: linear-gradient(90deg,#e66e32,#efbd47 48%,#248a50); }
.customer-stories-proof > div:first-child {
    color: #fff;
    border-color: rgba(183,116,25,.18);
    background: linear-gradient(145deg,#bb741c,#eba837 62%,#f0c057);
    box-shadow: 0 17px 33px rgba(180,111,26,.22), inset 0 1px rgba(255,255,255,.28);
}
.customer-stories-proof > div:first-child > strong { color: #fff; }
.customer-stories-proof > div:first-child .customer-stories-proof__stars { color: #fff3b0; }
.customer-stories-proof > div:first-child small { color: rgba(255,255,255,.79); }
.customer-stories-proof > div:last-child {
    color: #fff;
    border-color: rgba(22,113,59,.2);
    background: linear-gradient(145deg,#126a3c,#27924e 58%,#53ad63);
    box-shadow: 0 17px 33px rgba(24,104,52,.2), inset 0 1px rgba(255,255,255,.23);
}
.customer-stories-proof > div:last-child > i { color: #14713f; background: #fff; }
.customer-stories-proof > div:last-child strong { color: #fff; }
.customer-stories-proof > div:last-child small { color: rgba(255,255,255,.76); }
.customer-stories-toolbar {
    border-color: rgba(230,138,69,.2);
    background: linear-gradient(90deg,rgba(255,247,229,.9),rgba(237,248,229,.9));
    box-shadow: 0 11px 26px rgba(70,91,52,.08);
}
.customer-stories-toolbar > p i { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 9px; color: #fff; background: linear-gradient(145deg,#e16d3b,#f1a64c); }

.customer-story-card {
    --story-accent: #25824b;
    --story-accent-2: #7dbb67;
    --story-deep: #15482e;
    --story-soft: #edf7e7;
    min-height: 520px;
    padding: 0;
    border-color: color-mix(in srgb,var(--story-accent) 24%,#fff);
    background: linear-gradient(165deg,#fff 0%,var(--story-soft) 100%);
    box-shadow: 0 19px 42px rgba(45,65,43,.13);
}
.customer-story-card--honey { --story-accent: #cb8122; --story-accent-2: #f0b84c; --story-deep: #664213; --story-soft: #fff2cf; }
.customer-story-card--ghee { --story-accent: #69933c; --story-accent-2: #dbb849; --story-deep: #345122; --story-soft: #f2f6d9; }
.customer-story-card--mixme { --story-accent: #df6537; --story-accent-2: #f2a454; --story-deep: #72331f; --story-soft: #fff0e4; }
.customer-story-card--moringa { --story-accent: #23865c; --story-accent-2: #73b96c; --story-deep: #164b38; --story-soft: #e8f6e8; }
.customer-story-card::before { z-index: 5; height: 6px; background: linear-gradient(90deg,var(--story-accent),var(--story-accent-2)); opacity: 1; }
.customer-story-card::after { right: -46px; top: 108px; width: 145px; height: 145px; background: radial-gradient(circle,color-mix(in srgb,var(--story-accent-2) 23%,transparent),transparent 70%); }
.customer-story-card__number { z-index: 6; right: 17px; top: 17px; min-width: 38px; height: 32px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.42); border-radius: 10px; color: #fff; background: rgba(17,48,29,.42); box-shadow: 0 8px 18px rgba(16,47,28,.16); backdrop-filter: blur(9px); font-family: "Manrope",sans-serif; font-size: .61rem; font-weight: 800; letter-spacing: .08em; }
.customer-story-card__visual { position: relative; height: 174px; overflow: hidden; background: var(--story-soft); }
.customer-story-card__visual img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center 59%; filter: saturate(1.08) contrast(1.02); transition: transform .65s cubic-bezier(.2,.75,.2,1),filter .4s; }
.customer-story-card--ghee .customer-story-card__visual img { object-position: center 53%; }
.customer-story-card--mixme .customer-story-card__visual img { object-position: center 60%; }
.customer-story-card--moringa .customer-story-card__visual img { object-position: center 56%; }
.customer-story-card:hover .customer-story-card__visual img { transform: scale(1.055); filter: saturate(1.16) contrast(1.04); }
.customer-story-card__wash { position: absolute; inset: 0; background: linear-gradient(180deg,rgba(13,35,21,.02) 25%,color-mix(in srgb,var(--story-deep) 76%,transparent) 100%); pointer-events: none; }
.customer-story-card__badge { position: absolute; z-index: 3; left: 15px; bottom: 14px; display: inline-flex; align-items: center; gap: 6px; padding: 7px 10px; border: 1px solid rgba(255,255,255,.35); border-radius: 999px; color: #fff; background: color-mix(in srgb,var(--story-deep) 72%,transparent); box-shadow: 0 8px 20px rgba(16,47,28,.16); backdrop-filter: blur(10px); font-size: .53rem; font-weight: 800; letter-spacing: .035em; text-transform: uppercase; }
.customer-story-card__badge i { color: #ffe49b; font-size: .84rem; }
.customer-story-card__body { position: relative; z-index: 2; flex: 1; display: flex; flex-direction: column; padding: 21px; }
.customer-story-card__top { grid-template-columns: 50px 1fr 41px; gap: 11px; padding-right: 0; }
.customer-story-avatar,
.customer-story-card:nth-child(2) .customer-story-avatar,
.customer-story-card:nth-child(3) .customer-story-avatar { width: 50px; height: 50px; border-radius: 16px; background: linear-gradient(145deg,var(--story-accent),var(--story-deep)); box-shadow: 0 10px 22px color-mix(in srgb,var(--story-accent) 28%,transparent); }
.customer-story-card__top p i { color: var(--story-accent); }
.customer-story-quote { width: 41px; height: 41px; border-color: color-mix(in srgb,var(--story-accent) 20%,#fff); color: var(--story-accent); background: rgba(255,255,255,.7); }
.customer-story-rating { margin: 17px 0 13px; }
.customer-story-rating .customer-story-rating__stars { color: var(--story-accent); }
.customer-story-rating span { color: var(--story-deep); }
.customer-story-card blockquote { min-height: 116px; margin: 0 0 16px; padding: 15px; border: 1px solid rgba(255,255,255,.72); border-radius: 16px; color: #3f4e44; background: rgba(255,255,255,.66); box-shadow: inset 0 1px rgba(255,255,255,.85); font-size: .79rem; line-height: 1.58; }
.customer-story-product { min-height: 69px; grid-template-columns: 1fr 40px; gap: 10px; padding: 11px 11px 11px 14px; border-color: color-mix(in srgb,var(--story-accent) 18%,#fff); background: linear-gradient(135deg,rgba(255,255,255,.72),color-mix(in srgb,var(--story-soft) 76%,#fff)); }
.customer-story-product small { color: color-mix(in srgb,var(--story-deep) 65%,#777); }
.customer-story-product strong { color: var(--story-deep); font-size: .69rem; }
.customer-story-product > a { width: 40px; height: 40px; background: linear-gradient(145deg,var(--story-accent),var(--story-deep)); box-shadow: 0 9px 18px color-mix(in srgb,var(--story-accent) 25%,transparent); }
.customer-story-card:hover { border-color: color-mix(in srgb,var(--story-accent) 42%,#fff); box-shadow: 0 29px 55px color-mix(in srgb,var(--story-deep) 18%,transparent); }

@media (max-width: 620px) {
    .customer-stories-section { padding-top: 43px; background: radial-gradient(circle at 4% 7%,rgba(255,201,119,.37),transparent 23%),radial-gradient(circle at 94% 24%,rgba(108,190,124,.31),transparent 23%),linear-gradient(150deg,#fff9ed,#eff8e9 55%,#fff1e8); }
    .customer-story-card { flex-basis: 89vw; min-height: 520px; padding: 0; }
    .customer-story-card__visual { height: 170px; }
    .customer-story-card__body { padding: 19px; }
    .customer-story-card__top { grid-template-columns: 47px 1fr 38px; padding-right: 0; }
    .customer-story-avatar { width: 47px; height: 47px; }
    .customer-story-quote { width: 38px; height: 38px; }
    .customer-story-card blockquote { min-height: 112px; padding: 14px; font-size: .75rem; }
}

/* Reference-matched testimonial carousel */
.testimonial-reference-section {
    width: 100%;
    max-width: none;
    margin: 54px 0 0;
    overflow: hidden;
    padding: 92px 0 96px;
    border-block: 1px solid rgba(143,130,94,.08);
    background:
        radial-gradient(circle at 5% 24%,rgba(228,239,221,.72),transparent 24%),
        radial-gradient(circle at 91% 90%,rgba(249,231,194,.38),transparent 25%),
        linear-gradient(180deg,#fff 0%,#fff 72%,#fffdf9 100%);
}
.testimonial-reference-head { position: relative; z-index: 1; width: min(calc(100% - 40px),950px); margin: 0 auto 42px; text-align: center; }
.testimonial-reference-head__ghost { position: absolute; z-index: -1; left: 50%; top: -56px; color: transparent; -webkit-text-stroke: 1px #e5e8e1; font-family: "Manrope",sans-serif; font-size: clamp(5.8rem,10vw,9.2rem); font-weight: 760; letter-spacing: -.065em; line-height: 1; transform: translateX(-50%); white-space: nowrap; }
.testimonial-reference-head h2 { margin: 0; color: #17291f; font-family: "Manrope",sans-serif; font-size: clamp(2.65rem,4vw,4.2rem); font-weight: 720; line-height: 1.03; letter-spacing: -.05em; text-wrap: balance; }
.testimonial-reference-head h2 span,
.testimonial-reference-head h2 strong { display: block; }
.testimonial-reference-head h2 strong { color: #a1803e; font-weight: 720; }
.testimonial-reference-head p { max-width: 760px; margin: 24px auto 0; color: #5e6e65; font-size: .84rem; line-height: 1.72; text-wrap: balance; }
.testimonial-reference-rail { display: flex; gap: 23px; overflow-x: auto; padding: 20px 24px 42px; scroll-behavior: smooth; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-inline: contain; }
.testimonial-reference-rail::-webkit-scrollbar { display: none; }
.testimonial-reference-card { position: relative; flex: 0 0 400px; min-height: 280px; display: flex; flex-direction: column; padding: 25px 25px 21px; scroll-snap-align: center; border: 1px solid #e9ddcb; border-radius: 24px; background: rgba(255,255,255,.96); box-shadow: 0 13px 24px rgba(37,47,38,.11); transition: transform .28s ease,box-shadow .28s ease,border-color .28s ease; }
.testimonial-reference-card:hover { transform: translateY(-6px); border-color: #d9c7aa; box-shadow: 0 22px 40px rgba(37,47,38,.15); }
.testimonial-reference-card__top { display: grid; grid-template-columns: 58px minmax(0,1fr) 48px; gap: 13px; align-items: center; }
.testimonial-reference-avatar { width: 58px; height: 58px; display: block; object-fit: cover; border: 3px solid #eef0e9; border-radius: 50%; background: #eef2ec; box-shadow: 0 4px 12px rgba(26,57,39,.1); }
.testimonial-reference-avatar--initials { display: grid; place-items: center; color: #fff; border-color: #f0f2ec; background: linear-gradient(145deg,#1d8069,#54a79a); font-size: .71rem; font-weight: 850; }
.testimonial-reference-person { min-width: 0; }
.testimonial-reference-person h3 { margin: 0 0 4px; color: #26392e; font-size: 1.08rem; font-weight: 750; line-height: 1.2; }
.testimonial-reference-person p { margin: 0; color: #7b877f; font-size: .73rem; }
.testimonial-reference-quote { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50%; color: #117d70; background: #b9ded9; font-size: 1.27rem; }
.testimonial-reference-meta { display: flex; align-items: center; gap: 11px; margin: 11px 0 18px; padding-left: 71px; }
.testimonial-reference-stars { color: #d9ad4e; font-size: .76rem; letter-spacing: .08em; white-space: nowrap; }
.testimonial-reference-product { padding: 5px 11px; border-radius: 999px; color: #7d704b; background: #f4efe1; font-size: .58rem; font-weight: 760; white-space: nowrap; }
.testimonial-reference-card blockquote { min-height: 70px; margin: 0 0 19px; color: #5c6962; font-family: "Manrope",sans-serif; font-size: .82rem; font-style: normal; line-height: 1.72; }
.testimonial-reference-card footer { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-top: auto; }
.testimonial-reference-card footer > a:first-child { color: #2c5938; font-size: .69rem; font-weight: 800; }
.testimonial-reference-arrow { flex: 0 0 34px; width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #0c8877; box-shadow: 0 7px 14px rgba(12,136,119,.18); transition: transform .24s ease,background .24s ease; }
.testimonial-reference-arrow:hover { transform: translateX(3px); background: #076e60; }

@media (min-width: 1200px) {
    .testimonial-reference-rail { margin-left: -105px; padding-left: 0; padding-right: 0; }
}

@media (max-width: 700px) {
    .testimonial-reference-section { margin-top: 34px; padding: 67px 0 58px; }
    .testimonial-reference-head { width: calc(100% - 32px); margin-bottom: 28px; }
    .testimonial-reference-head__ghost { top: -31px; font-size: 3.55rem; }
    .testimonial-reference-head h2 { font-size: 2.15rem; line-height: 1.07; }
    .testimonial-reference-head p { margin-top: 17px; font-size: .71rem; line-height: 1.62; }
    .testimonial-reference-rail { gap: 12px; padding: 13px 14px 34px; scroll-padding-inline: 14px; }
    .testimonial-reference-card { flex-basis: calc(100vw - 38px); min-height: 282px; padding: 20px 18px 18px; border-radius: 20px; scroll-snap-align: start; }
    .testimonial-reference-card__top { grid-template-columns: 52px minmax(0,1fr) 42px; gap: 10px; }
    .testimonial-reference-avatar { width: 52px; height: 52px; }
    .testimonial-reference-person h3 { font-size: .92rem; }
    .testimonial-reference-quote { width: 42px; height: 42px; font-size: 1.08rem; }
    .testimonial-reference-meta { gap: 8px; margin: 11px 0 16px; padding-left: 62px; }
    .testimonial-reference-stars { font-size: .66rem; }
    .testimonial-reference-product { padding: 5px 8px; font-size: .51rem; }
    .testimonial-reference-card blockquote { min-height: 78px; font-size: .75rem; line-height: 1.65; }
}

/* Stories */
.stories-section { width: min(calc(100% - 48px), 1240px); padding: 70px 30px; border-radius: 38px; background: linear-gradient(135deg, #f2eee2, #f8f6ef); }
.story-rail { gap: 14px; }
.modern-story-card { position: relative; flex: 0 0 calc((100% - 42px) / 4); min-width: 255px; height: 380px; overflow: hidden; scroll-snap-align: start; border-radius: 25px; background: #163524; box-shadow: 0 19px 42px rgba(34,47,34,.14); }
.modern-story-card > img { width: 100%; height: 100%; object-fit: cover; transition: transform .55s ease; }
.modern-story-card:hover > img { transform: scale(1.055); }
.modern-story-card__wash { position: absolute; inset: 18% 0 0; background: linear-gradient(transparent, rgba(3,28,19,.94)); }
.modern-story-card__content { position: absolute; z-index: 2; left: 20px; right: 20px; bottom: 20px; color: #fff; }
.modern-story-card__content > span { display: inline-block; margin-bottom: 10px; padding: 5px 8px; border-radius: 999px; color: #143722; background: #e8c96c; font-size: .55rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.modern-story-card h3 { margin: 0 0 20px; font-size: 1.02rem; line-height: 1.35; }
.modern-story-card a { display: inline-flex; align-items: center; gap: 6px; color: #d8ece0; font-size: .66rem; font-weight: 700; }

/* Reference-matched blog section */
.blog-reference-section { width: min(calc(100% - 48px),1280px); margin-top: 56px; overflow: visible; padding: 92px 0 88px; }
.blog-reference-head { position: relative; z-index: 2; max-width: 900px; margin: 0 0 48px; }
.blog-reference-head__ghost { position: absolute; z-index: -1; left: -20px; top: -58px; color: transparent; -webkit-text-stroke: 1px #e1e5df; font-family: "Manrope",sans-serif; font-size: clamp(6rem,9vw,8.6rem); font-weight: 720; letter-spacing: -.055em; line-height: 1; pointer-events: none; }
.blog-reference-head h2 { display: flex; align-items: center; gap: 17px; margin: 0; color: #13241a; font-family: "Manrope",sans-serif; font-size: clamp(2.7rem,4.4vw,4.4rem); font-weight: 750; line-height: 1.02; letter-spacing: -.055em; }
.blog-reference-head h2 i { color: #65a91f; filter: drop-shadow(2px 2px 0 #061b0f); font-size: .82em; transform: rotate(4deg); }
.blog-reference-head p { max-width: 760px; margin: 18px 0 0; color: #44544c; font-size: .91rem; line-height: 1.65; }
.blog-reference-decoration { position: absolute; z-index: 1; right: -84px; top: -2px; width: 315px; height: auto; opacity: .72; mix-blend-mode: multiply; pointer-events: none; }
.blog-reference-grid { position: relative; z-index: 2; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 19px; }
.blog-reference-card { position: relative; min-width: 0; height: 400px; overflow: hidden; border-radius: 12px; background: #25422f; box-shadow: 0 16px 34px rgba(31,48,34,.12); isolation: isolate; transition: transform .3s ease,box-shadow .3s ease; }
.blog-reference-card:hover { transform: translateY(-8px); box-shadow: 0 25px 48px rgba(31,48,34,.18); }
.blog-reference-card > img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform .65s cubic-bezier(.2,.75,.2,1),filter .4s ease; }
.blog-reference-card:hover > img { transform: scale(1.055); filter: saturate(1.07); }
.blog-reference-card__accent { position: absolute; z-index: 3; left: 0; top: 0; bottom: 0; width: 8px; background: #78a92d; }
.blog-reference-card:nth-child(2) .blog-reference-card__accent { background: #e8891e; }
.blog-reference-card:nth-child(3) .blog-reference-card__accent { background: #6c8f35; }
.blog-reference-card:nth-child(4) .blog-reference-card__accent { background: #bf8135; }
.blog-reference-card__wash { position: absolute; z-index: 1; inset: 0; background: linear-gradient(180deg,rgba(8,25,15,.01) 15%,rgba(8,25,15,.1) 40%,rgba(5,20,12,.9) 100%); }
.blog-reference-card__content { position: absolute; z-index: 4; left: 17px; right: 15px; bottom: 16px; color: #fff; }
.blog-reference-card__content > span { display: none; }
.blog-reference-card h3 { margin: 0 0 9px; color: #fff; font-size: 1.02rem; font-weight: 780; line-height: 1.34; letter-spacing: -.018em; }
.blog-reference-card p { display: -webkit-box; overflow: hidden; margin: 0 0 11px; color: rgba(255,255,255,.86); font-size: .66rem; line-height: 1.5; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.blog-reference-card a { display: inline-flex; align-items: center; gap: 7px; color: #fff; font-size: .63rem; font-weight: 820; }
.blog-reference-card a i { transition: transform .22s ease; }
.blog-reference-card a:hover i { transform: translateX(4px); }
.blog-reference-more { min-width: 158px; min-height: 48px; width: fit-content; display: inline-flex; align-items: center; justify-content: center; gap: 12px; margin-top: 30px; padding: 0 22px; border-radius: 10px; color: #fff; background: #0b887d; box-shadow: 0 15px 29px rgba(11,136,125,.2); font-size: .74rem; font-weight: 820; transition: transform .25s ease,background .25s ease,box-shadow .25s ease; }
.blog-reference-more:hover { transform: translateY(-3px); background: #076d63; box-shadow: 0 20px 34px rgba(11,136,125,.25); }

@media (max-width: 1000px) {
    .blog-reference-section { width: min(calc(100% - 30px),1280px); }
    .blog-reference-decoration { right: -42px; width: 250px; opacity: .35; }
    .blog-reference-grid { display: flex; gap: 15px; overflow-x: auto; padding: 4px 2px 24px; scroll-snap-type: x mandatory; scrollbar-width: none; }
    .blog-reference-grid::-webkit-scrollbar { display: none; }
    .blog-reference-card { flex: 0 0 285px; scroll-snap-align: start; }
}

@media (max-width: 620px) {
    .blog-reference-section { width: calc(100% - 24px); margin-top: 34px; padding: 68px 0 62px; }
    .blog-reference-head { margin-bottom: 30px; }
    .blog-reference-head__ghost { left: -5px; top: -35px; font-size: 4.3rem; }
    .blog-reference-head h2 { gap: 10px; font-size: 2.25rem; line-height: 1.07; }
    .blog-reference-head p { margin-top: 14px; font-size: .73rem; line-height: 1.58; }
    .blog-reference-decoration { display: none; }
    .blog-reference-grid { gap: 11px; margin-right: -12px; padding-bottom: 21px; }
    .blog-reference-card { flex-basis: 78vw; height: 390px; border-radius: 11px; }
    .blog-reference-card h3 { font-size: .95rem; }
    .blog-reference-more { min-width: 145px; min-height: 46px; margin-top: 20px; }
}

/* Shoppable reels */
.reels-section { padding-block: 90px; }
.reel-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 19px; max-width: 930px; margin: 0 auto; }
.reel-card { overflow: hidden; border: 1px solid #dfe7e0; border-radius: 28px; background: #fff; box-shadow: 0 22px 50px rgba(24,61,40,.12); transition: transform .3s ease, box-shadow .3s ease; }
.reel-card:nth-child(2) { transform: translateY(24px); }
.reel-card:hover { transform: translateY(-7px); box-shadow: 0 30px 65px rgba(24,61,40,.17); }
.reel-card:nth-child(2):hover { transform: translateY(17px); }
.reel-card__media { position: relative; height: 380px; overflow: hidden; background: #ecf0e8; }
.reel-card__media::after { content: ""; position: absolute; inset: 45% 0 0; background: linear-gradient(transparent, rgba(4,34,22,.5)); }
.reel-card__media > img,
.reel-card__media > video { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.reel-card__media > video { position: relative; z-index: 2; background: #102d20; }
.reel-card__placeholder { width: 100%; height: 100%; display: grid!important; place-items: center!important; color: #e5c877!important; background: radial-gradient(circle at 30% 20%,rgba(238,159,55,.28),transparent 35%),linear-gradient(145deg,#0a4934,#0a7046)!important; font-size: 3rem!important; }
.reel-card:hover .reel-card__media > img { transform: scale(1.045); }
.reel-card__media > a { position: absolute; z-index: 3; left: 50%; top: 50%; width: 58px; height: 58px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.7); border-radius: 50%; color: #fff; background: rgba(6,64,37,.55); backdrop-filter: blur(10px); transform: translate(-50%,-50%); font-size: 1.25rem; transition: transform .25s ease, background .25s ease; }
.reel-card__media > a:hover { background: #087341; transform: translate(-50%,-50%) scale(1.09); }
.reel-card__media > span { position: absolute; z-index: 3; left: 15px; top: 15px; padding: 6px 9px; border-radius: 999px; color: #fff; background: rgba(8,50,31,.6); backdrop-filter: blur(8px); font-size: .58rem; font-weight: 800; }
.reel-card__product { min-height: 82px; display: grid; grid-template-columns: 48px 1fr 40px; gap: 10px; align-items: center; padding: 13px; }
.reel-card__product > img { width: 48px; height: 48px; object-fit: cover; border-radius: 13px; background: #f1f2ed; }
.reel-card__product h3 { margin: 0 0 4px; font-size: .76rem; }
.reel-card__product p { margin: 0; color: #0a6d3a; font-size: .72rem; font-weight: 800; }
.reel-card__product p span { margin-left: 4px; color: #8a958e; font-size: .56rem; font-weight: 600; }
.reel-card__product button { width: 40px; height: 40px; display: grid; place-items: center; border: 0; border-radius: 13px; color: #fff; background: #08733e; cursor: pointer; font-size: 1rem; transition: transform .2s ease, background .2s ease; }
.reel-card__product button:hover { transform: translateY(-2px); background: #07572f; }

@media (max-width: 900px) {
    .content-heading { grid-template-columns: 1fr; gap: 18px; align-items: start; }
    .content-heading > p { max-width: 580px; }
    .content-heading--center > p { margin-top: -6px; }
    .brand-story-section { padding: 48px; }
    .brand-story-heading { grid-template-columns: 1fr; gap: 24px; }
    .brand-story-heading__aside { max-width: 680px; padding: 20px 0 0; border-top: 1px solid #cedbd2; border-left: 0; }
    .brand-story-grid { grid-template-columns: 1fr; gap: 18px; }
    .brand-story-media { max-width: none; }
    .brand-story-panel { min-height: 520px; }
    .why-glass-head { grid-template-columns: 1fr; }
    .why-proof { max-width: 390px; }
    .why-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .why-card:first-child { grid-column: span 2; }
    .testimonial-card { flex-basis: calc((100% - 16px) / 2); }
    .modern-story-card { flex-basis: calc((100% - 28px) / 3); }
    .reel-card__media { height: 315px; }
}

@media (max-width: 620px) {
    .content-section { width: calc(100% - 24px); padding: 55px 0; }
    .content-heading { margin-bottom: 28px; }
    .content-heading h2 { font-size: 2.3rem; }
    .content-heading--center { justify-items: start; text-align: left; }
    .content-heading--center > p { margin: 0; }
    .brand-story-section { width: calc(100% - 16px); margin-top: 45px; padding: 38px 14px 16px; border-radius: 29px; }
    .brand-story-section::before { right: -8px; top: 18px; font-size: 4.2rem; }
    .testimonial-section::before { font-size: 4.4rem; }
    .brand-story-heading { margin-bottom: 29px; }
    .brand-story-heading h2 { font-size: 2rem; line-height: 1.08; }
    .brand-story-heading__aside { padding-top: 17px; }
    .brand-story-media { padding-bottom: 88px; }
    .brand-story-media__frame, .brand-story-media img { min-height: 405px; }
    .brand-story-media__frame { border-radius: 23px 23px 72px 23px; }
    .brand-story-media__label { left: 12px; top: 12px; }
    .brand-story-media__count { right: 12px; bottom: 13px; min-width: 94px; padding: 12px; border-radius: 16px 16px 38px 16px; }
    .brand-story-media__count strong { font-size: 1.5rem; }
    .brand-story-media figcaption { left: 7px; right: 7px; bottom: 10px; min-width: 0; min-height: 70px; border-radius: 16px; }
    .brand-story-media figcaption > span { gap: 6px; padding: 10px 7px; }
    .brand-story-media figcaption i { flex-basis: 27px; width: 27px; height: 27px; font-size: .8rem; }
    .brand-story-media figcaption strong { font-size: .52rem; }
    .brand-story-panel { min-height: auto; padding: 18px 13px; border-radius: 24px; }
    .brand-story-point { grid-template-columns: 23px 40px 1fr; gap: 8px; min-height: 105px; padding: 13px 11px; }
    .brand-story-point__icon { width: 40px; height: 40px; border-radius: 12px; }
    .brand-story-point h3 { font-size: .76rem; }
    .brand-story-panel__note { margin-top: 9px; }
    .why-section { width: calc(100% - 16px); padding: 12px; border-radius: 28px; }
    .stories-section { width: calc(100% - 16px); padding: 48px 14px; border-radius: 28px; }
    .why-glass-head { gap: 27px; padding: 28px 18px; border-radius: 22px; }
    .why-glass-head h2 { font-size: 3.05rem; }
    .why-glass-head__copy > p { font-size: .73rem; }
    .why-proof { grid-template-columns: 1fr 1fr; width: 100%; }
    .why-proof > div { min-width: 0; min-height: 98px; grid-template-columns: 1fr; gap: 7px; padding: 14px; }
    .why-proof span br { display: none; }
    .why-grid { grid-template-columns: 1fr; gap: 10px; }
    .why-card, .why-card:first-child { grid-column: auto; min-height: 205px; padding: 19px; border-radius: 21px; }
    .why-card__top { margin-bottom: 22px; }
    .why-card__icon { width: 44px; height: 44px; }
    .why-card h3 { font-size: .9rem; }
    .why-glass-foot { align-items: stretch; flex-direction: column; padding: 16px; }
    .why-glass-foot > a { justify-content: center; }
    .section-rail-controls { justify-content: flex-start; }
    .testimonial-card { flex-basis: 86vw; min-width: 0; min-height: 270px; padding: 20px; }
    .modern-story-card { flex-basis: 80vw; min-width: 0; height: 365px; }
    .reel-grid { grid-template-columns: 1fr; max-width: 380px; }
    .reel-card:nth-child(2), .reel-card:nth-child(2):hover { transform: none; }
    .reel-card__media { height: 410px; }
}

/* Ecommerce platform: checkout, order confirmation, journal and AI assistant */
.checkout-page main, .order-success-page main, .blog-index-page main, .blog-post-page main { background: #f7f8f4; }
.checkout-shell { width: min(calc(100% - 48px), 1180px); margin: 0 auto; padding: 62px 0 100px; }
.checkout-heading { max-width: 690px; margin-bottom: 42px; }
.checkout-heading > a { display: inline-flex; align-items: center; gap: 7px; margin-bottom: 31px; color: #66746c; font-size: .7rem; font-weight: 750; }
.checkout-heading h1 { margin: 8px 0 15px; color: #10251a; font-family: var(--gx-font); font-size: clamp(3rem, 5.7vw, 5.6rem); font-weight: 600; line-height: .92; letter-spacing: -.065em; }
.checkout-heading h1 em { color: #087345; font-style: normal; }
.checkout-heading > p { max-width: 540px; margin: 0; color: #6c7972; font-size: .88rem; line-height: 1.65; }
.checkout-grid { display: grid; grid-template-columns: minmax(0, 1.28fr) minmax(330px, .72fr); gap: 28px; align-items: start; }
.checkout-form { display: grid; gap: 17px; }
.checkout-card { padding: 25px; border: 1px solid #dfe7e1; border-radius: 24px; background: rgba(255,255,255,.9); box-shadow: 0 14px 40px rgba(26,57,40,.055); }
.checkout-card__heading { display: flex; align-items: center; gap: 13px; margin-bottom: 23px; }
.checkout-card__heading > span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 14px; color: #087345; background: #e5f3ea; font-family: "Manrope"; font-size: .72rem; font-weight: 800; }
.checkout-card__heading h2 { margin: 0; font-size: .92rem; }
.checkout-card__heading p { margin: 3px 0 0; color: #8a968f; font-size: .63rem; }
.checkout-coupon { margin: -2px 0 18px; padding: 14px; border: 1px solid #e2e8e3; border-radius: 16px; background: linear-gradient(135deg,#fbf8ee,#f3faf5); }
.checkout-coupon label > span { display: block; margin-bottom: 7px; color: #405047; font-size: .65rem; font-weight: 800; }
.checkout-coupon label > div { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.checkout-coupon input { min-width: 0; padding: 11px 13px; border: 1px solid #d6dfd8; border-radius: 11px; outline: 0; background: #fff; font: 700 .72rem "Manrope"; letter-spacing: .06em; text-transform: uppercase; }
.checkout-coupon input:focus { border-color: #3d8b62; box-shadow: 0 0 0 3px rgba(8,115,69,.08); }
.checkout-coupon button { padding: 0 18px; border: 0; border-radius: 11px; color: #fff; background: #087345; cursor: pointer; font-size: .66rem; font-weight: 800; }
.checkout-coupon small { display: block; margin-top: 7px; color: #7b887f; font-size: .58rem; }
.checkout-coupon small.is-success { color: #087345; font-weight: 700; }
.checkout-payment-offline { grid-column: 1 / -1; display: flex; align-items: center; gap: 11px; padding: 15px; border-radius: 14px; color: #8b3d2b; background: #fff0ec; font-size: .68rem; }
.checkout-payment-offline i { flex: 0 0 auto; color: #b04c34; background: #ffe0d8; }
.checkout-payment-offline strong { display: block; margin-bottom: 2px; }
.checkout-fields { display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; }
.checkout-fields label > span { display: block; margin-bottom: 7px; color: #536158; font-size: .67rem; font-weight: 750; }
.checkout-fields label small { color: #98a19b; font-weight: 500; }
.checkout-fields input { width: 100%; padding: 12px 13px; border: 1px solid #d8e1da; border-radius: 12px; outline: 0; color: #16271e; background: #fff; font: inherit; font-size: .77rem; transition: border-color .2s, box-shadow .2s; }
.checkout-fields input:focus { border-color: #63a881; box-shadow: 0 0 0 4px rgba(8,115,69,.08); }
.checkout-span-2 { grid-column: span 2; }
.payment-options { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.payment-options label { position: relative; cursor: pointer; }
.payment-options input { position: absolute; opacity: 0; }
.payment-options label > span { min-height: 112px; display: grid; grid-template-columns: 39px 1fr; gap: 1px 12px; align-content: center; padding: 16px; border: 1px solid #dbe4dd; border-radius: 16px; background: #fff; transition: border-color .2s, background .2s, transform .2s; }
.payment-options i { grid-row: 1 / 3; width: 39px; height: 39px; display: grid; place-items: center; border-radius: 12px; color: #087345; background: #e8f4ed; font-size: 1.15rem; }
.payment-options strong { align-self: end; font-size: .75rem; }
.payment-options small { align-self: start; color: #87928b; font-size: .58rem; line-height: 1.4; }
.payment-options input:checked + span { border-color: #398b60; background: #f0f8f3; box-shadow: 0 0 0 3px rgba(8,115,69,.07); transform: translateY(-2px); }
.checkout-submit { min-height: 57px; display: flex; align-items: center; justify-content: center; gap: 10px; border: 0; border-radius: 17px; color: #fff; background: linear-gradient(145deg,#0b8652,#075d37); box-shadow: 0 17px 35px rgba(8,103,61,.2); cursor: pointer; font-weight: 800; }
.checkout-submit:disabled { cursor: not-allowed; opacity: .55; }
.checkout-submit.is-loading i { animation: aiSpin 1s linear infinite; }
.checkout-error { padding: 13px 15px; border-radius: 13px; color: #9e362d; background: #ffebe8; font-size: .75rem; }
.checkout-secure-note { display: flex; align-items: center; justify-content: center; gap: 7px; margin: -2px 0 0; color: #7e8b83; font-size: .62rem; }
.checkout-summary { position: sticky; top: 105px; overflow: hidden; border: 1px solid #dae3dc; border-radius: 26px; background: #fff; box-shadow: 0 24px 60px rgba(22,50,35,.1); }
.checkout-summary__top { display: flex; align-items: center; justify-content: space-between; padding: 21px 22px; border-bottom: 1px solid #e8ede9; background: linear-gradient(145deg,#f1f7f3,#fff); }
.checkout-summary__top span { font-family: "Manrope"; font-size: .9rem; font-weight: 800; }
.checkout-summary__top strong { color: #78867e; font-size: .63rem; }
.checkout-summary__items { max-height: 320px; overflow-y: auto; padding: 4px 20px; }
.checkout-summary__items article { display: grid; grid-template-columns: 55px 1fr auto; gap: 11px; align-items: center; padding: 14px 0; border-bottom: 1px solid #eef1ee; }
.checkout-summary__items img { width: 55px; height: 55px; object-fit: cover; border-radius: 13px; background: #f2f3ee; }
.checkout-summary__items h3 { margin: 0 0 3px; font-size: .69rem; }
.checkout-summary__items p { margin: 0; color: #89948d; font-size: .58rem; }
.checkout-summary__items > article > strong { font-size: .68rem; }
.checkout-summary__empty { padding: 46px 20px; text-align: center; }
.checkout-summary__empty i { color: #9caaa1; font-size: 2.2rem; }
.checkout-summary__empty h2 { margin: 10px 0 6px; font-size: .9rem; }
.checkout-summary__empty a { color: #087345; font-size: .67rem; font-weight: 750; }
.checkout-totals { padding: 19px 21px; background: #f8faf8; }
.checkout-totals p { display: flex; align-items: center; justify-content: space-between; margin: 0 0 10px; color: #6f7c74; font-size: .68rem; }
.checkout-totals p strong { color: #203027; }
.checkout-totals [data-checkout-discount-row] strong { color: #087345; }
.checkout-totals__grand { margin-top: 16px!important; padding-top: 16px; border-top: 1px solid #dce4de; color: #1a2d22!important; font-weight: 800; }
.checkout-totals__grand strong { font-family: "Manrope"; font-size: 1.2rem; }
.checkout-totals > small { display: block; color: #087345; font-size: .57rem; text-align: right; }
.checkout-assurance { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; border-top: 1px solid #e3e9e4; background: #e3e9e4; }
.checkout-assurance > div { display: grid; grid-template-columns: 30px 1fr; gap: 8px; align-items: center; padding: 14px; background: #fff; }
.checkout-assurance i { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 9px; color: #087345; background: #e8f4ed; }
.checkout-assurance strong,.checkout-assurance span { display: block; }
.checkout-assurance strong { font-size: .61rem; }.checkout-assurance span { color: #89948d; font-size: .5rem; }

.order-success-shell { min-height: 70vh; display: grid; place-items: center; padding: 70px 24px 100px; background: radial-gradient(circle at 10% 10%,rgba(238,163,72,.13),transparent 28%),radial-gradient(circle at 90% 90%,rgba(43,143,88,.14),transparent 31%),#f8faf7; }
.order-success-card { width: min(100%,790px); padding: 55px; border: 1px solid #dde7df; border-radius: 36px; text-align: center; background: rgba(255,255,255,.92); box-shadow: 0 30px 80px rgba(21,54,35,.1); }
.order-success-icon { width: 72px; height: 72px; display: grid; place-items: center; margin: 0 auto 24px; border-radius: 50%; color: #fff; background: linear-gradient(145deg,#0d8b56,#075e37); box-shadow: 0 13px 30px rgba(8,115,69,.25); font-size: 1.8rem; }
.order-success-card h1 { margin: 10px 0 19px; font-family: var(--gx-font); font-size: clamp(3rem,6vw,5.3rem); line-height: .92; letter-spacing: -.06em; }.order-success-card h1 em { color: #087345; font-style: normal; }
.order-success-card > p { max-width: 590px; margin: 0 auto; color: #66756d; font-size: .85rem; line-height: 1.7; }
.order-success-details { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; margin: 32px 0; overflow: hidden; border: 1px solid #e0e7e2; border-radius: 17px; background: #e0e7e2; }.order-success-details > div { padding: 17px; background: #f8faf8; }.order-success-details span,.order-success-details strong { display: block; }.order-success-details span { margin-bottom: 5px; color: #87938c; font-size: .58rem; text-transform: uppercase; letter-spacing: .08em; }.order-success-details strong { font-size: .73rem; }
.order-success-actions { display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; margin-top: 32px; }

.journal-hero { width: min(calc(100% - 48px),1180px); margin: 0 auto; padding: 95px 0 60px; }.journal-hero h1 { max-width: 850px; margin: 12px 0 22px; color:#10251a;font-family:var(--gx-font);font-size:clamp(3.6rem,7vw,7.3rem);font-weight:600;line-height:.89;letter-spacing:-.075em}.journal-hero h1 em{color:#087345;font-style:normal}.journal-hero>p{max-width:620px;margin:0;color:#68766e;font-size:.95rem;line-height:1.7}
.journal-grid { width:min(calc(100% - 48px),1180px);display:grid;grid-template-columns:repeat(3,1fr);gap:19px;margin:0 auto;padding:0 0 100px}.journal-card{overflow:hidden;border:1px solid #dee6df;border-radius:25px;background:#fff;box-shadow:0 18px 45px rgba(23,50,35,.075);transition:transform .25s}.journal-card:hover{transform:translateY(-6px)}.journal-card__visual{height:180px;position:relative;display:grid;place-items:center;overflow:hidden;color:#e4c56f;background:radial-gradient(circle at 20% 20%,rgba(238,155,63,.28),transparent 30%),radial-gradient(circle at 85% 85%,rgba(77,163,111,.32),transparent 35%),linear-gradient(145deg,#073d2c,#0a6442)}.journal-card__visual:after{content:"";position:absolute;inset:0;opacity:.15;background-image:radial-gradient(#fff 1px,transparent 1px);background-size:22px 22px}.journal-card__visual i{font-size:3rem}.journal-card__visual span{position:absolute;z-index:2;left:15px;top:15px;padding:6px 8px;border:1px solid rgba(255,255,255,.15);border-radius:999px;color:#d8e9df;background:rgba(255,255,255,.08);font-size:.52rem}.journal-card__body{padding:22px}.journal-card__body small{color:#849087;font-size:.58rem}.journal-card h2{margin:9px 0 11px;font-family:var(--gx-font);font-size:1.25rem;line-height:1.25;letter-spacing:-.035em}.journal-card p{display:-webkit-box;overflow:hidden;margin:0 0 22px;color:#68766e;font-size:.7rem;line-height:1.6;-webkit-box-orient:vertical;-webkit-line-clamp:3}.journal-card a{display:inline-flex;align-items:center;gap:7px;color:#087345;font-size:.67rem;font-weight:800}.journal-empty{grid-column:1/-1;padding:80px 20px;text-align:center}.journal-empty i{color:#99aa9f;font-size:3rem}.journal-empty h2{margin:13px 0 7px;font-family:var(--gx-font)}.journal-empty p{color:#78877f}
.journal-article{width:min(calc(100% - 48px),900px);margin:0 auto;padding:85px 0 110px}.journal-article>header{text-align:center}.journal-article>header>a{display:inline-flex;align-items:center;gap:6px;margin-bottom:35px;color:#74827a;font-size:.65rem;font-weight:750}.journal-article h1{margin:12px 0 21px;font-family:var(--gx-font);font-size:clamp(3rem,6.4vw,6.2rem);font-weight:600;line-height:.94;letter-spacing:-.065em}.journal-article>header>p{max-width:680px;margin:0 auto 15px;color:#63726a;font-size:.95rem;line-height:1.65}.journal-article>header>small{color:#8a968f;font-size:.61rem}.journal-article__body{margin-top:55px;padding:48px 58px;border:1px solid #e0e7e2;border-radius:29px;background:#fff;box-shadow:0 22px 55px rgba(23,51,36,.07);font-family:var(--gx-font);color:#37483f;font-size:1rem;line-height:1.85}.journal-article__body h2,.journal-article__body h3{margin:2em 0 .7em;color:#132a1e;font-family:var(--gx-font);line-height:1.15;letter-spacing:-.04em}.journal-article__body h2:first-child{margin-top:0}.journal-article__body li{margin-bottom:.5em}.journal-article__body blockquote{margin:2em 0;padding:19px 22px;border-left:3px solid #0a7948;border-radius:0 15px 15px 0;color:#315644;background:#edf6f0}.journal-article>footer{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:25px;padding:20px 24px;border-radius:17px;color:#e1efe7;background:#073d2c}.journal-article>footer strong{font-family:var(--gx-font)}.journal-article>footer a{display:flex;align-items:center;gap:7px;color:#edcd75;font-size:.68rem;font-weight:800}

.ai-float { position: fixed; z-index: 31; right: 26px; bottom: 97px; width: 68px; height: 68px; display: grid; place-items: center; padding: 6px; border: 1px solid rgba(255,255,255,.24); border-radius: 50%; color: #fff; background: radial-gradient(circle at 25% 18%, rgba(239,181,76,.35), transparent 36%), linear-gradient(145deg, rgba(7,91,60,.98), rgba(3,42,30,.99)); box-shadow: 0 19px 47px rgba(3,49,30,.32), inset 0 1px 0 rgba(255,255,255,.14); backdrop-filter: blur(18px); cursor: pointer; transition: transform .28s cubic-bezier(.2,.75,.2,1), box-shadow .28s, border-color .28s; }
.ai-float::before { content: ""; position: absolute; inset: -7px; border: 1px solid rgba(237,202,110,.3); border-radius: 50%; animation: aiRobotRing 2.7s ease-out infinite; pointer-events: none; }
.ai-float::after { content: "Ask Gawdee AI"; position: absolute; right: 77px; top: 50%; width: max-content; padding: 8px 11px; border: 1px solid rgba(255,255,255,.14); border-radius: 10px; color: #fff; background: rgba(4,47,33,.94); box-shadow: 0 10px 25px rgba(3,38,24,.2); font-size: .55rem; font-weight: 800; opacity: 0; pointer-events: none; transform: translate(7px,-50%); transition: opacity .2s, transform .2s; }
.ai-float:hover { transform: translateY(-5px) scale(1.025); border-color: rgba(238,203,111,.48); box-shadow: 0 27px 59px rgba(3,49,30,.4), inset 0 1px 0 rgba(255,255,255,.17); }
.ai-float:hover::after { opacity: 1; transform: translate(0,-50%); }
.ai-float.is-active { border-color: rgba(239,204,113,.58); transform: rotate(-4deg); }
.ai-float__orb { position: relative; width: 52px; height: 52px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.32); border-radius: 50%; color: #073326; background: linear-gradient(145deg, #f3d47f, #e3b552); box-shadow: 0 8px 18px rgba(0,24,14,.25), inset 0 2px 0 rgba(255,255,255,.48); }
.ai-float__orb img { width: 62px; height: 62px; max-width: none; display: block; object-fit: contain; filter: drop-shadow(0 4px 5px rgba(0,29,17,.18)); transition: transform .28s cubic-bezier(.2,.75,.2,1); }
.ai-float:hover .ai-float__orb img { transform: scale(1.08) rotate(2deg); }
.ai-float__online { position: absolute; z-index: 2; right: 5px; bottom: 6px; width: 13px; height: 13px; border: 3px solid #06432f; border-radius: 50%; background: #71df8f; box-shadow: 0 0 0 3px rgba(113,223,143,.15); }

.ai-chat { position: fixed; z-index: 42; right: 26px; bottom: 177px; width: min(calc(100vw - 30px), 410px); overflow: hidden; padding: 7px; border: 1px solid rgba(255,255,255,.65); border-radius: 30px; background: linear-gradient(145deg, rgba(255,255,255,.92), rgba(239,245,240,.88)); box-shadow: 0 36px 100px rgba(8,47,29,.3), inset 0 1px 0 #fff; backdrop-filter: blur(24px); opacity: 0; pointer-events: none; transform: translateY(18px) scale(.96); transform-origin: bottom right; transition: opacity .24s, transform .3s cubic-bezier(.2,.8,.2,1); }
.ai-chat.is-open { opacity: 1; pointer-events: auto; transform: none; }
.ai-chat > header { display: grid; grid-template-columns: 46px 1fr 35px; gap: 11px; align-items: center; padding: 14px; border-radius: 23px; color: #fff; background: radial-gradient(circle at 0 0, rgba(239,167,68,.3), transparent 43%), radial-gradient(circle at 100% 100%, rgba(80,167,112,.24), transparent 40%), linear-gradient(145deg, #053d2c, #07583a); box-shadow: inset 0 1px 0 rgba(255,255,255,.1); }
.ai-chat__mark { width: 46px; height: 46px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.15); border-radius: 15px; color: #083727; background: linear-gradient(145deg, #f1d17b, #dfb24e); box-shadow: 0 9px 18px rgba(0,29,17,.2); font-size: 1.15rem; }
.ai-chat__mark img { width: 51px; height: 51px; max-width: none; display: block; object-fit: contain; filter: drop-shadow(0 4px 5px rgba(0,26,15,.18)); }
.ai-chat > header strong, .ai-chat > header small { display: block; }
.ai-chat > header strong { font-family: "Manrope", sans-serif; font-size: .82rem; }
.ai-chat > header small { display: flex; align-items: center; gap: 5px; margin-top: 4px; color: #bbd3c6; font-size: .5rem; }
.ai-chat > header small > span { width: 6px; height: 6px; border-radius: 50%; background: #76dc94; box-shadow: 0 0 0 4px rgba(118,220,148,.12); }
.ai-chat > header button { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.1); border-radius: 11px; color: #fff; background: rgba(255,255,255,.075); cursor: pointer; transition: background .2s, transform .2s; }
.ai-chat > header button:hover { background: rgba(255,255,255,.14); transform: rotate(4deg); }
.ai-chat__intro { display: grid; grid-template-columns: 35px 1fr; gap: 10px; align-items: center; margin: 8px 5px 0; padding: 10px 12px; border: 1px solid #dfe8e1; border-radius: 16px; background: rgba(255,255,255,.72); }
.ai-chat__intro > i { width: 35px; height: 35px; display: grid; place-items: center; border-radius: 11px; color: #087348; background: #e5f3e9; }
.ai-chat__intro p { margin: 0; }
.ai-chat__intro strong, .ai-chat__intro span { display: block; }
.ai-chat__intro strong { color: #19372a; font-size: .62rem; }
.ai-chat__intro span { margin-top: 2px; color: #7d8b83; font-size: .5rem; line-height: 1.4; }
.ai-offer-card { position: relative; overflow: hidden; margin: 8px 5px 0; border: 1px solid rgba(230,188,102,.42); border-radius: 19px; background: #fffaf0; box-shadow: 0 11px 27px rgba(83,55,12,.09); }
.ai-offer-card__media { position: relative; height: 119px; display: block; overflow: hidden; background: #fff3de; }
.ai-offer-card__media::after { content: ""; position: absolute; inset: 50% 0 0; background: linear-gradient(transparent, rgba(56,38,6,.14)); pointer-events: none; }
.ai-offer-card__media img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center; transition: transform .45s ease; }
.ai-offer-card:hover .ai-offer-card__media img { transform: scale(1.025); }
.ai-offer-card__media > span { position: absolute; z-index: 2; left: 9px; top: 9px; display: inline-flex; align-items: center; gap: 5px; padding: 6px 8px; border: 1px solid rgba(255,255,255,.65); border-radius: 999px; color: #fff; background: rgba(6,78,45,.84); box-shadow: 0 7px 17px rgba(5,52,31,.16); backdrop-filter: blur(8px); font-size: .46rem; font-weight: 850; letter-spacing: .055em; text-transform: uppercase; }
.ai-offer-card__media > span i { color: #f1cf72; }
.ai-offer-card__body { display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: center; padding: 10px 11px; background: linear-gradient(115deg, #fffaf1, #f3f8ef); }
.ai-offer-card__body small, .ai-offer-card__body > div > strong { display: block; }
.ai-offer-card__body small { margin-bottom: 2px; color: #e46c25; font-size: .46rem; font-weight: 850; letter-spacing: .065em; text-transform: uppercase; }
.ai-offer-card__body > div > strong { color: #073a29; font-family: "Manrope", sans-serif; font-size: .69rem; }
.ai-offer-card__body > div > strong em { color: #6d7b73; font-size: .5rem; font-style: normal; font-weight: 650; }
.ai-offer-card__body > button { min-width: 108px; display: grid; grid-template-columns: 1fr auto; gap: 2px 7px; align-items: center; padding: 8px 9px; border: 1px dashed #da993e; border-radius: 11px; color: #073728; background: rgba(255,255,255,.84); cursor: pointer; transition: border-color .2s, background .2s, transform .2s; }
.ai-offer-card__body > button:hover, .ai-offer-card__body > button.is-copied { border-color: #087647; background: #edf7f0; transform: translateY(-1px); }
.ai-offer-card__body > button > strong { grid-row: 1 / 3; font-size: .59rem; letter-spacing: .04em; }
.ai-offer-card__body > button > span { display: inline-flex; align-items: center; gap: 3px; color: #7e8a83; font-size: .42rem; font-weight: 750; white-space: nowrap; }
.ai-chat__messages { height: 145px; overflow-y: auto; display: flex; flex-direction: column; gap: 9px; padding: 12px 10px 8px; background: transparent; scrollbar-color: #b9cbc0 transparent; scrollbar-width: thin; }
.ai-message { max-width: 87%; padding: 11px 13px; border: 1px solid rgba(213,224,216,.8); border-radius: 16px; color: #3d4e45; background: rgba(255,255,255,.88); box-shadow: 0 6px 17px rgba(20,50,33,.055); font-size: .66rem; line-height: 1.55; white-space: pre-wrap; }
.ai-message--assistant { align-self: flex-start; border-bottom-left-radius: 5px; }
.ai-message--user { align-self: flex-end; border-color: rgba(7,104,63,.2); border-bottom-right-radius: 5px; color: #fff; background: linear-gradient(145deg, #08784b, #075a39); box-shadow: 0 8px 18px rgba(7,91,54,.14); }
.ai-chat__suggestions { display: flex; gap: 6px; overflow-x: auto; padding: 6px 8px 5px; scrollbar-width: none; }
.ai-chat__suggestions::-webkit-scrollbar { display: none; }
.ai-chat__suggestions button { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 5px; padding: 8px 10px; border: 1px solid #dbe5de; border-radius: 999px; color: #4e675a; background: rgba(255,255,255,.78); cursor: pointer; font: inherit; font-size: .53rem; font-weight: 750; transition: border-color .2s, color .2s, transform .2s; }
.ai-chat__suggestions button i { color: #0b7a49; font-size: .74rem; }
.ai-chat__suggestions button:hover { color: #075d3b; border-color: #9fc5ad; transform: translateY(-1px); }
.ai-chat > form { display: grid; grid-template-columns: 1fr 43px; gap: 8px; margin: 2px 5px 0; padding: 5px; border: 1px solid #d7e3da; border-radius: 16px; background: rgba(255,255,255,.9); box-shadow: 0 8px 23px rgba(23,52,36,.06); }
.ai-chat > form input { min-width: 0; padding: 0 10px; border: 0; outline: 0; color: #1d3227; background: transparent; font: inherit; font-size: .67rem; }
.ai-chat > form input::placeholder { color: #929f98; }
.ai-chat > form button { width: 43px; height: 43px; display: grid; place-items: center; border: 0; border-radius: 13px; color: #fff; background: linear-gradient(145deg, #087b4b, #055936); box-shadow: 0 8px 16px rgba(6,102,59,.18); cursor: pointer; transition: transform .2s, box-shadow .2s; }
.ai-chat > form button:hover { transform: translateY(-2px); box-shadow: 0 11px 20px rgba(6,102,59,.24); }
.ai-chat > form.is-loading button { animation: aiSpin 1s linear infinite; }
.ai-chat > p { display: flex; align-items: center; justify-content: center; gap: 5px; margin: 0; padding: 10px 8px 7px; color: #929e97; font-size: .46rem; text-align: center; }
@keyframes aiSpin { to { transform: rotate(360deg); } }
@keyframes aiAura { 0%, 100% { opacity: .55; transform: scale(.94); } 50% { opacity: 1; transform: scale(1.04); } }
@keyframes aiRobotRing { 0% { opacity: .65; transform: scale(.9); } 70%, 100% { opacity: 0; transform: scale(1.18); } }

@media(max-width:900px){.checkout-grid{grid-template-columns:1fr}.checkout-summary{position:static;grid-row:1}.journal-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.checkout-shell{width:calc(100% - 24px);padding:38px 0 70px}.checkout-heading h1{font-size:3.35rem}.checkout-card{padding:18px;border-radius:20px}.checkout-fields,.payment-options{grid-template-columns:1fr}.checkout-span-2{grid-column:auto}.payment-options label>span{min-height:92px}.checkout-assurance{grid-template-columns:1fr}.order-success-card{padding:37px 19px;border-radius:27px}.order-success-details{grid-template-columns:1fr}.journal-hero,.journal-grid,.journal-article{width:calc(100% - 24px)}.journal-hero{padding-top:60px}.journal-hero h1{font-size:3.5rem}.journal-grid{grid-template-columns:1fr;padding-bottom:70px}.journal-article{padding-top:55px}.journal-article h1{font-size:3.3rem}.journal-article__body{padding:28px 20px;font-size:.9rem}.journal-article>footer{align-items:flex-start;flex-direction:column}.ai-float{right:17px;bottom:89px;min-width:0;width:60px;height:60px;display:grid;grid-template-columns:1fr;padding:6px;border-radius:19px}.ai-float__orb{width:46px;height:46px;margin:auto}.ai-float__copy,.ai-float__badge{display:none}.ai-chat{right:10px;bottom:160px;width:calc(100vw - 20px);max-height:calc(100vh - 190px);border-radius:25px}.ai-chat__messages{height:min(215px,28vh)}.whatsapp-float{right:18px!important;bottom:25px!important}}

@media (max-width: 1100px) {
    .product-commerce-hero__grid { grid-template-columns: minmax(0, 1fr) minmax(390px, .88fr); gap: 38px; }
    .product-commerce-actions { grid-template-columns: 112px 1fr; }
    .product-buy-now { grid-column: 1 / -1; }
    .product-delivery { grid-template-columns: 38px 1fr 96px auto; }
    .product-buybox__assurances { grid-template-columns: 1fr; }
    .product-buybox__assurances > div { grid-template-columns: 34px 1fr; }
    .product-benefit-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .related-products__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
    .product-commerce-hero { padding-bottom: 60px; }
    .product-commerce-hero__grid { grid-template-columns: 1fr; gap: 52px; }
    .product-media { width: min(100%, 700px); margin-inline: auto; }
    .product-buybox { width: min(100%, 700px); margin-inline: auto; }
    .product-buybox__assurances { grid-template-columns: repeat(3, 1fr); }
    .product-section-nav .container { justify-content: flex-start; }
    .product-overview__grid, .product-faq__grid { grid-template-columns: 1fr; gap: 45px; }
    .product-comparison__shell { grid-template-columns: 1fr; gap: 28px; }
    .product-overview__heading, .product-faq__heading { position: static; }
    .product-use__shell { grid-template-columns: 1fr; gap: 50px; }
    .product-use__visual { width: min(100%, 640px); aspect-ratio: 1.15 / 1; }
    .product-reviews__layout { grid-template-columns: 230px 1fr; }
    .review-form-shell { grid-template-columns: 1fr; gap: 25px; }
    .related-products__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 680px) {
    .product-commerce-hero { padding: 20px 0 48px; }
    .product-commerce-hero .container { width: min(calc(100% - 24px), var(--container)); }
    .breadcrumbs { margin-bottom: 19px; font-size: .62rem; }
    .breadcrumbs a:nth-of-type(2), .breadcrumbs a:nth-of-type(2) + i { display: none; }
    .product-media__stage { border-radius: 23px; }
    .product-media__zoom { display: none; }
    .product-media__thumbs { gap: 7px; }
    .product-media__thumb { flex-basis: 130px; grid-template-columns: 39px 1fr; gap: 6px; padding: 5px; border-radius: 11px; font-size: .55rem; }
    .product-media__thumb img { width: 39px; height: 39px; border-radius: 7px; }
    .product-buybox h1 { font-size: 2.65rem; }
    .product-buybox__topline { align-items: flex-start; }
    .product-rating small { display: none; }
    .product-commerce-actions { grid-template-columns: 96px 1fr; }
    .quantity-control--commerce { grid-template-columns: 32px 30px 32px; }
    .product-delivery { grid-template-columns: 35px 1fr auto; }
    .product-delivery label { grid-column: 2 / -1; }
    .product-delivery input { grid-column: 1 / 3; }
    .product-delivery > p { grid-column: 1 / -1; }
    .product-buybox__assurances { grid-template-columns: 1fr; }
    .product-section-nav { top: 75px; }
    .product-section-nav a { padding: 14px 16px; }
    .product-overview h2, .product-ingredients h2, .product-use h2, .product-faq h2 { font-size: 2.65rem; }
    .product-overview__points article { grid-template-columns: 43px 1fr; gap: 13px; padding: 21px 0; }
    .product-overview__points article > span { font-size: 1.5rem; }
    .product-overview__points article p { font-size: 1rem; }
    .product-comparison__shell { padding: 24px 16px; border-radius: 23px; }
    .product-comparison__table { overflow-x: auto; }
    .product-comparison__row { min-width: 570px; }
    .product-ingredients__shell { grid-template-columns: 1fr; gap: 24px; padding: 31px 22px; border-radius: 25px; }
    .ingredient-note { grid-column: auto; }
    .product-section-heading { align-items: flex-start; flex-direction: column; }
    .product-benefit-grid { grid-template-columns: 1fr; }
    .product-benefit-card { min-height: 205px; }
    .product-aplus__grid { grid-template-columns: 1fr; }
    .product-aplus__image--feature { grid-column: auto; }
    .product-aplus__image img, .product-aplus__image--feature img { min-height: 240px; }
    .product-use__visual { aspect-ratio: .92 / 1; border-radius: 25px; }
    .product-reviews__layout { grid-template-columns: 1fr; }
    .review-summary { display: grid; grid-template-columns: auto 1fr; column-gap: 15px; align-items: center; }
    .review-summary > strong { grid-row: 1 / 3; }
    .review-summary > p { margin: 0; }
    .review-bar { grid-column: 1 / -1; }
    .review-card { grid-template-columns: 38px 1fr; padding: 17px; }
    .review-card__avatar { width: 38px; height: 38px; }
    .review-card__top { align-items: flex-start; flex-direction: column; gap: 6px; }
    .review-form-shell { padding: 25px 18px; border-radius: 22px; }
    .review-form__fields { grid-template-columns: 1fr; }
    .related-products__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 430px) {
    .product-media__thumb { flex-basis: 92px; grid-template-columns: 1fr; text-align: center; }
    .product-media__thumb img { width: 100%; height: 54px; }
    .product-media__thumb span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .product-commerce-actions { grid-template-columns: 88px 1fr; gap: 8px; }
    .product-add--commerce { padding-inline: 13px; font-size: .78rem; }
    .product-buybox__meta { display: grid; }
    .related-products__grid { gap: 9px; }
}

/* Customer authentication, account and order tracking */
.customer-auth-page main { background: #f4f7f3; }
.customer-auth-shell { min-height: 790px; display: grid; grid-template-columns: minmax(0, 1.06fr) minmax(460px, .94fr); }
.customer-auth-visual { position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; padding: clamp(44px, 6vw, 82px); color: #fff; background: radial-gradient(circle at 8% 10%, rgba(235,162,67,.32), transparent 27%), radial-gradient(circle at 94% 88%, rgba(79,174,119,.29), transparent 30%), linear-gradient(145deg, #052c21, #07533a 62%, #063629); }
.customer-auth-visual::after { content: ""; position: absolute; inset: 0; opacity: .12; background-image: radial-gradient(#fff 1px, transparent 1px); background-size: 27px 27px; mask-image: linear-gradient(145deg, #000, transparent 70%); pointer-events: none; }
.customer-auth-visual > * { position: relative; z-index: 1; }
.customer-auth-visual__label { align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border: 1px solid rgba(255,255,255,.16); border-radius: 999px; color: #d7eadf; background: rgba(255,255,255,.07); font-size: .65rem; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; }
.customer-auth-visual h1 { max-width: 760px; margin: 0 0 27px; font-size: clamp(3.4rem, 6.2vw, 7rem); line-height: .9; letter-spacing: -.078em; }
.customer-auth-visual h1 em { color: #efca6c; }
.customer-auth-visual > div > p { max-width: 620px; margin: 0; color: #bdd2c7; font-size: .93rem; }
.customer-auth-steps { display: flex; flex-wrap: wrap; gap: 9px; }
.customer-auth-steps span { display: inline-flex; align-items: center; gap: 7px; padding: 9px 11px; border-radius: 999px; color: #dcebe4; background: rgba(255,255,255,.08); backdrop-filter: blur(8px); font-size: .61rem; font-weight: 700; }
.customer-auth-steps i { color: #eeca6c; }
.customer-auth-panel { display: grid; place-items: center; padding: clamp(35px, 6vw, 75px); background: linear-gradient(145deg, #fff, #f4f7f4); }
.customer-auth-card { width: min(100%, 520px); }
.customer-auth-back { display: inline-flex; align-items: center; gap: 7px; margin-bottom: 40px; color: #738078; font-size: .67rem; font-weight: 700; }
.customer-auth-card h2 { margin: 0 0 9px; font-size: clamp(2rem, 3.4vw, 3rem); line-height: 1.05; }
.customer-auth-card > p { margin: 0 0 25px; color: var(--muted); font-size: .78rem; }
.customer-auth-alert { display: flex; align-items: flex-start; gap: 9px; margin-bottom: 17px; padding: 12px 14px; border-radius: 12px; color: #9b382e; background: #ffede9; font-size: .69rem; }
.customer-auth-form { display: grid; gap: 15px; }
.customer-auth-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.customer-auth-form label > span { display: block; margin-bottom: 7px; color: #46544d; font-size: .66rem; font-weight: 750; }
.customer-auth-form label > div { position: relative; }
.customer-auth-form label > div > i { position: absolute; z-index: 1; left: 14px; top: 50%; color: #708078; transform: translateY(-50%); }
.customer-auth-form input { width: 100%; height: 48px; padding: 0 43px; border: 1px solid #d8e1da; border-radius: 12px; outline: 0; color: var(--ink); background: #fff; font-size: .76rem; transition: border-color .2s, box-shadow .2s; }
.customer-auth-form input:focus { border-color: #50a278; box-shadow: 0 0 0 4px rgba(8,115,69,.08); }
.customer-auth-form [data-password-toggle] { position: absolute; right: 5px; top: 5px; width: 38px; height: 38px; display: grid; place-items: center; border: 0; border-radius: 9px; color: #6f7f77; background: transparent; cursor: pointer; }
.customer-auth-form .button { width: 100%; min-height: 51px; margin-top: 2px; border-radius: 13px; }
.customer-password-help { margin-top: -7px; color: #88948d; font-size: .58rem; }
.customer-auth-switch { margin: 21px 0 0!important; text-align: center; font-size: .68rem!important; }
.customer-auth-switch a { color: var(--green); font-weight: 800; }
.customer-auth-note { display: grid; grid-template-columns: 39px 1fr; gap: 10px; align-items: center; margin-top: 23px; padding: 12px; border-radius: 13px; background: #edf5ef; }
.customer-auth-note > i { width: 39px; height: 39px; display: grid; place-items: center; border-radius: 11px; color: var(--green); background: #fff; }
.customer-auth-note span { color: var(--muted); font-size: .58rem; }
.customer-auth-note strong { display: block; color: var(--ink); font-size: .64rem; }

.customer-account-page main { background: #f6f7f3; }
.account-hero { position: relative; overflow: hidden; padding: 70px 0 76px; color: #fff; background: radial-gradient(circle at 8% 20%, rgba(234,158,65,.25), transparent 26%), radial-gradient(circle at 92% 80%, rgba(91,180,129,.27), transparent 28%), linear-gradient(135deg, #052f23, #07553a); }
.account-hero::after { content: "MY GAWDEE"; position: absolute; right: -22px; bottom: -42px; color: rgba(255,255,255,.035); font-family: "Manrope"; font-size: clamp(5rem, 13vw, 11rem); font-weight: 800; letter-spacing: -.08em; pointer-events: none; }
.account-hero__inner { position: relative; z-index: 1; display: flex; align-items: end; justify-content: space-between; gap: 50px; }
.account-hero h1 { margin: 0 0 12px; font-size: clamp(3rem, 5.8vw, 6rem); line-height: .92; }
.account-hero h1 em { color: #efcb71; }
.account-hero p { max-width: 590px; margin: 0; color: #bfd3c8; font-size: .86rem; }
.account-hero__identity { min-width: 330px; display: grid; grid-template-columns: 52px 1fr auto; align-items: center; gap: 12px; padding: 14px; border: 1px solid rgba(255,255,255,.13); border-radius: 18px; background: rgba(255,255,255,.075); backdrop-filter: blur(14px); }
.account-hero__identity > span { width: 52px; height: 52px; display: grid; place-items: center; border-radius: 15px; color: #063827; background: #efcc72; font-family: "Manrope"; font-weight: 800; }
.account-hero__identity strong, .account-hero__identity small { display: block; }
.account-hero__identity strong { font-size: .76rem; }
.account-hero__identity small { margin-top: 3px; color: #abc8ba; font-size: .56rem; }
.account-hero__identity a { display: flex; align-items: center; gap: 6px; color: #d5e5dc; font-size: .61rem; font-weight: 700; }
.account-nav { position: sticky; z-index: 25; top: calc(var(--header-height) + 35px); border-bottom: 1px solid #dce4de; background: rgba(255,255,255,.92); backdrop-filter: blur(15px); }
.account-nav .container { display: flex; overflow-x: auto; scrollbar-width: none; }
.account-nav a { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 7px; padding: 17px 22px; color: #65736b; font-size: .66rem; font-weight: 800; }
.account-nav a:hover { color: var(--green); background: #eef6f1; }
.account-shell { padding-top: 65px; }
.account-alert { display: flex; align-items: center; gap: 8px; margin-bottom: 20px; padding: 13px 15px; border-radius: 13px; font-size: .69rem; }
.account-alert--success { color: #087047; background: #e3f3e9; }
.account-alert--error { color: #9c382f; background: #ffebe8; }
.account-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 90px; }
.account-stats article { position: relative; overflow: hidden; padding: 21px; border: 1px solid #e0e6e1; border-radius: 19px; background: #fff; box-shadow: 0 12px 35px rgba(26,51,39,.05); }
.account-stats article > i { width: 43px; height: 43px; display: grid; place-items: center; margin-bottom: 20px; border-radius: 13px; color: #087248; background: #e6f3ea; font-size: 1.25rem; }
.account-stats span, .account-stats small, .account-stats strong { display: block; }
.account-stats span { color: #7f8b84; font-size: .61rem; font-weight: 700; }
.account-stats strong { margin: 5px 0; font-family: "Manrope"; font-size: 1.75rem; letter-spacing: -.06em; }
.account-stats small { color: #929b96; font-size: .55rem; }
.account-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 25px; margin-bottom: 28px; }
.account-section-heading h2 { margin: 0; font-size: clamp(2.5rem, 4.8vw, 4.8rem); line-height: 1; }
.account-order-list { display: grid; gap: 14px; }
.account-order-card { overflow: hidden; border: 1px solid #dde5df; border-radius: 21px; background: #fff; box-shadow: 0 14px 40px rgba(23,49,36,.055); }
.account-order-card__head, .account-order-card__foot { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.account-order-card__head { padding: 18px 20px; border-bottom: 1px solid #e7ece8; background: linear-gradient(145deg, #f8faf8, #fff); }
.account-order-card__head span, .account-order-card__head small { display: block; }
.account-order-card__head span { font-family: "Manrope"; font-size: .78rem; font-weight: 800; }
.account-order-card__head small { margin-top: 3px; color: #87928c; font-size: .57rem; }
.account-status { display: inline-flex; align-items: center; padding: 6px 9px; border-radius: 999px; color: #0b7148; background: #e4f3e9; font-size: .59rem; font-weight: 800; text-transform: capitalize; }
.account-status--pending, .account-status--packed { color: #9a6b19; background: #fff2d4; }
.account-status--shipped { color: #335fa0; background: #e8f0ff; }
.account-status--cancelled, .account-status--refunded { color: #a23b32; background: #ffebe8; }
.account-order-card__body { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; padding: 19px 20px; }
.account-order-card__body > div { padding-right: 15px; border-right: 1px solid #e8ece9; }
.account-order-card__body > div:last-child { border-right: 0; }
.account-order-card__body small, .account-order-card__body strong { display: block; }
.account-order-card__body small { margin-bottom: 5px; color: #8b958f; font-size: .52rem; font-weight: 800; letter-spacing: .08em; }
.account-order-card__body strong { font-size: .7rem; }
.account-order-progress { position: relative; height: 18px; display: flex; align-items: center; justify-content: space-between; margin: 4px 24px 16px; }
.account-order-progress::before, .account-order-progress > span { content: ""; position: absolute; z-index: 0; left: 0; top: 50%; height: 3px; border-radius: 999px; transform: translateY(-50%); }
.account-order-progress::before { right: 0; background: #e3e8e4; }
.account-order-progress > span { background: linear-gradient(90deg, #0d8957, #79b97d); }
.account-order-progress > i { position: relative; z-index: 1; width: 11px; height: 11px; border: 2px solid #fff; border-radius: 50%; background: #cbd4ce; box-shadow: 0 0 0 2px #e1e7e3; }
.account-order-progress > i.is-active { background: #0e8a58; box-shadow: 0 0 0 2px #a8d4ba; }
.account-order-card__foot { padding: 13px 20px; border-top: 1px solid #edf0ed; }
.account-order-card__foot p { margin: 0; color: #718078; font-size: .6rem; }
.account-order-card__foot p i { margin-right: 5px; color: var(--green); }
.account-order-card__foot > div { display: flex; gap: 7px; }
.account-order-card__foot .button { min-height: 38px; padding: 0 14px; font-size: .61rem; }
.account-empty { padding: 70px 25px; border: 1px dashed #cad6ce; border-radius: 25px; text-align: center; background: #fff; }
.account-empty > i { display: block; margin-bottom: 15px; color: #77a98e; font-size: 3rem; }
.account-empty h3, .account-empty h1 { margin-bottom: 8px; }
.account-empty p { max-width: 480px; margin-inline: auto; color: var(--muted); font-size: .75rem; }
.account-profile { padding-top: 115px; }
.account-profile__grid { display: grid; grid-template-columns: 1.25fr .75fr; gap: 17px; align-items: start; }
.account-panel { padding: 24px; border: 1px solid #dde5df; border-radius: 22px; background: #fff; box-shadow: 0 14px 40px rgba(24,50,37,.05); }
.account-panel__head { display: grid; grid-template-columns: 44px 1fr; gap: 12px; align-items: center; margin-bottom: 21px; }
.account-panel__head > i, .order-detail-card__head > i { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 13px; color: var(--green); background: #e6f3ea; font-size: 1.2rem; }
.account-panel__head h3, .order-detail-card__head h2 { margin: 0; font-size: .83rem; }
.account-panel__head p, .order-detail-card__head p { margin: 3px 0 0; color: #89948d; font-size: .58rem; }
.account-form { display: grid; gap: 14px; }
.account-form__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 13px; }
.account-form label > span { display: block; margin-bottom: 6px; color: #536159; font-size: .62rem; font-weight: 750; }
.account-form input { width: 100%; padding: 11px 12px; border: 1px solid #d8e1da; border-radius: 11px; outline: 0; color: var(--ink); background: #fff; font-size: .72rem; }
.account-form input:focus { border-color: #5ca17c; box-shadow: 0 0 0 4px rgba(8,115,69,.07); }
.account-form input:disabled { color: #7d8982; background: #f2f4f2; }
.account-form__wide { grid-column: 1 / -1; }
.account-form > .button { justify-self: start; margin-top: 3px; border-radius: 12px; }
.account-form > small { color: #849087; font-size: .57rem; }
.account-security-note { display: grid; grid-template-columns: 37px 1fr; gap: 10px; align-items: center; margin-top: 8px; padding: 11px; border-radius: 12px; background: #eef5f0; }
.account-security-note > i { width: 37px; height: 37px; display: grid; place-items: center; border-radius: 10px; color: var(--green); background: #fff; }
.account-security-note p { margin: 0; color: var(--muted); font-size: .56rem; }
.account-security-note strong { display: block; color: var(--ink); font-size: .62rem; }

.checkout-account-banner { display: grid; grid-template-columns: 44px 1fr auto; gap: 12px; align-items: center; margin: -14px 0 20px; padding: 13px 15px; border: 1px solid #cfe2d5; border-radius: 16px; background: #eef7f1; }
.checkout-account-banner > span { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 13px; color: #fff; background: #087345; font-size: 1.2rem; }
.checkout-account-banner strong, .checkout-account-banner p { display: block; margin: 0; }
.checkout-account-banner strong { font-size: .72rem; }
.checkout-account-banner p { margin-top: 3px; color: #6e7d75; font-size: .58rem; }
.checkout-account-banner > a { display: flex; align-items: center; gap: 6px; color: #087345; font-size: .64rem; font-weight: 800; }
.checkout-account-banner--guest { border-color: #ead9b5; background: #fff8e9; }
.checkout-account-banner--guest > span { color: #6d4d12; background: #f2cd78; }

.order-detail-shell { min-height: 70vh; padding-top: 55px; }
.order-detail-back { display: inline-flex; align-items: center; gap: 7px; margin-bottom: 35px; color: #6f7c75; font-size: .66rem; font-weight: 750; }
.order-detail-heading { display: flex; align-items: end; justify-content: space-between; gap: 30px; margin-bottom: 30px; }
.order-detail-heading h1 { margin: 0 0 6px; font-size: clamp(2.7rem, 5vw, 5rem); }
.order-detail-heading p { margin: 0; color: var(--muted); font-size: .7rem; }
.order-detail-heading > div:last-child { display: flex; align-items: center; gap: 10px; }
.order-detail-heading .button { min-height: 42px; font-size: .65rem; }
.order-cancelled { display: grid; grid-template-columns: 43px 1fr; gap: 11px; align-items: center; margin-bottom: 17px; padding: 13px; border-radius: 14px; color: #80372f; background: #ffebe8; }
.order-cancelled > i { width: 43px; height: 43px; display: grid; place-items: center; border-radius: 12px; background: #fff; }
.order-cancelled p { margin: 0; font-size: .65rem; }.order-cancelled strong { display: block; }
.order-detail-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr); gap: 18px; align-items: start; }
.order-detail-grid > main, .order-detail-grid > aside { display: grid; gap: 16px; }
.order-detail-grid > aside { position: sticky; top: 115px; }
.order-detail-card { overflow: hidden; padding: 22px; border: 1px solid #dde5df; border-radius: 21px; background: #fff; box-shadow: 0 14px 40px rgba(23,49,36,.05); }
.order-detail-card__head { display: grid; grid-template-columns: 44px 1fr; gap: 12px; align-items: center; margin-bottom: 22px; }
.order-journey__steps { display: grid; }
.order-journey__steps article { position: relative; display: grid; grid-template-columns: 44px 1fr 20px; gap: 13px; align-items: center; min-height: 82px; }
.order-journey__steps article:not(:last-child)::after { content: ""; position: absolute; left: 21px; top: 63px; width: 2px; height: 38px; background: #dfe6e1; }
.order-journey__steps article.is-complete:not(:last-child)::after { background: #77bd96; }
.order-journey__steps article > span { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; color: #8d9a92; background: #edf0ed; }
.order-journey__steps article.is-complete > span { color: #fff; background: #0b7b4d; box-shadow: 0 8px 18px rgba(8,115,69,.2); }
.order-journey__steps article.is-current > span { box-shadow: 0 0 0 5px rgba(11,123,77,.12); }
.order-journey__steps strong, .order-journey__steps p, .order-journey__steps small { display: block; }
.order-journey__steps strong { font-size: .72rem; }.order-journey__steps p { margin: 3px 0 0; color: #849087; font-size: .58rem; }.order-journey__steps small { margin-top: 4px; color: #087345; font-size: .55rem; font-weight: 700; }
.order-journey__steps article > i { color: #b0bbb4; }.order-journey__steps article.is-complete > i { color: #0b8a56; }
.order-event-list { display: grid; }
.order-event-list article { display: grid; grid-template-columns: 10px 1fr auto; gap: 11px; align-items: start; padding: 12px 0; border-bottom: 1px solid #edf0ed; }
.order-event-list article:last-child { border-bottom: 0; }
.order-event-list article > span { width: 8px; height: 8px; margin-top: 4px; border-radius: 50%; background: #0b8755; box-shadow: 0 0 0 4px #e2f2e8; }
.order-event-list strong { display: block; font-size: .67rem; }.order-event-list p { margin: 2px 0 0; color: #829087; font-size: .56rem; }.order-event-list time { color: #8d9891; font-size: .52rem; }
.order-item-list { display: grid; }
.order-item-list article { display: grid; grid-template-columns: 60px 1fr auto 32px; gap: 12px; align-items: center; padding: 13px 0; border-bottom: 1px solid #edf0ed; }
.order-item-list article:last-child { border-bottom: 0; }
.order-item-list img { width: 60px; height: 60px; object-fit: cover; border-radius: 13px; background: #f1f2ed; }
.order-item-list strong, .order-item-list span { display: block; }.order-item-list strong { font-size: .69rem; }.order-item-list span { margin-top: 4px; color: #849087; font-size: .56rem; }.order-item-list b { font-size: .68rem; }.order-item-list a { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 9px; }
.order-summary-card h2 { margin: 0 0 19px; font-size: .87rem; }
.order-summary-card > p { display: flex; justify-content: space-between; margin: 0 0 10px; color: #718078; font-size: .65rem; }
.order-summary-card > p strong { color: var(--ink); }
.order-summary-card__total { margin-top: 16px!important; padding-top: 16px; border-top: 1px solid #dfe6e1; font-weight: 800; }
.order-summary-card__total strong { font-family: "Manrope"; font-size: 1.1rem; }
.order-summary-card > div { display: grid; grid-template-columns: 38px 1fr; gap: 10px; align-items: center; margin-top: 17px; padding: 11px; border-radius: 12px; background: #eef5f0; }
.order-summary-card > div i { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; color: var(--green); background: #fff; }.order-summary-card > div span { color: #7a8780; font-size: .55rem; }.order-summary-card > div strong { display: block; color: var(--ink); font-size: .63rem; }
.order-address-card address { color: #64736b; font-size: .65rem; font-style: normal; line-height: 1.7; }.order-address-card address strong { display: block; margin-bottom: 5px; color: var(--ink); }
.order-help-card { padding: 24px; border-radius: 21px; color: #fff; background: radial-gradient(circle at 100% 0, rgba(235,178,73,.24), transparent 35%), linear-gradient(145deg, #073d2d, #075a3e); }
.order-help-card > i { color: #efcb71; font-size: 1.7rem; }.order-help-card h3 { margin: 13px 0 7px; font-size: .86rem; }.order-help-card p { color: #b9cfc4; font-size: .6rem; }.order-help-card a { display: flex; align-items: center; gap: 6px; color: #efcb71; font-size: .61rem; font-weight: 800; }

@media (max-width: 1050px) {
    .customer-auth-shell { grid-template-columns: 1fr 1fr; }
    .customer-auth-visual { padding: 45px; }
    .account-stats { grid-template-columns: repeat(2, 1fr); }
    .account-profile__grid { grid-template-columns: 1fr; }
    .order-detail-grid { grid-template-columns: 1fr; }
    .order-detail-grid > aside { position: static; grid-template-columns: repeat(2, 1fr); }
    .order-help-card { grid-column: 1 / -1; }
}

@media (max-width: 800px) {
    .customer-auth-shell { grid-template-columns: 1fr; }
    .customer-auth-visual { min-height: 520px; }
    .customer-auth-panel { padding-block: 55px; }
    .account-hero__inner { align-items: flex-start; flex-direction: column; }
    .account-hero__identity { width: min(100%, 460px); min-width: 0; }
    .account-nav { top: 75px; }
    .account-order-card__foot { align-items: flex-start; flex-direction: column; }
    .order-detail-heading { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 620px) {
    .customer-auth-visual { min-height: 460px; padding: 32px 22px; }
    .customer-auth-visual h1 { font-size: 3.5rem; }
    .customer-auth-panel { padding: 42px 18px; }
    .customer-auth-back { margin-bottom: 28px; }
    .customer-auth-form__row { grid-template-columns: 1fr; }
    .account-hero { padding: 50px 0 55px; }
    .account-stats { grid-template-columns: 1fr 1fr; gap: 9px; margin-bottom: 70px; }
    .account-stats article { padding: 15px; }
    .account-stats article > i { margin-bottom: 13px; }
    .account-stats strong { font-size: 1.35rem; }
    .account-section-heading { align-items: flex-start; flex-direction: column; }
    .account-order-card__body { grid-template-columns: 1fr; }
    .account-order-card__body > div { padding: 0 0 10px; border-right: 0; border-bottom: 1px solid #edf0ed; }
    .account-order-card__body > div:last-child { border-bottom: 0; }
    .account-order-card__foot > div { width: 100%; flex-wrap: wrap; }
    .account-form__grid { grid-template-columns: 1fr; }
    .account-form__wide { grid-column: auto; }
    .checkout-account-banner { grid-template-columns: 40px 1fr; }
    .checkout-account-banner > a { grid-column: 2; }
    .order-detail-grid > aside { grid-template-columns: 1fr; }
    .order-help-card { grid-column: auto; }
    .order-detail-card { padding: 17px; }
    .order-item-list article { grid-template-columns: 51px 1fr auto; }
    .order-item-list img { width: 51px; height: 51px; }
    .order-item-list article > a { display: none; }
    .order-event-list article { grid-template-columns: 9px 1fr; }.order-event-list time { grid-column: 2; }
}

/* Complete product catalogue */
.catalog-page main { background: #f5f7f2; }
.catalog-image-hero { padding: 24px 0 50px; background: linear-gradient(180deg, #f8f5ec, #f5f7f2); }
.catalog-image-hero > .container { width: min(calc(100% - 48px), 1240px); }
.catalog-image-hero picture { display: block; overflow: hidden; border: 1px solid rgba(31,73,45,.13); border-radius: 30px; background: #f7f1e3; box-shadow: 0 27px 68px rgba(25,63,39,.15); }
.catalog-image-hero img { width: 100%; display: block; aspect-ratio: 3 / 1; object-fit: cover; }
.catalog-hero { position: relative; isolation: isolate; overflow: hidden; min-height: 540px; display: grid; align-items: center; color: #fff; background: radial-gradient(circle at 14% 15%, rgba(238,170,67,.28), transparent 30%), radial-gradient(circle at 86% 80%, rgba(84,179,117,.3), transparent 29%), linear-gradient(125deg, #042a20 0%, #064a34 58%, #073526 100%); }
.catalog-hero::before { content: ""; position: absolute; z-index: -1; inset: 0; opacity: .13; background-image: radial-gradient(rgba(255,255,255,.65) 1px, transparent 1px); background-size: 28px 28px; mask-image: linear-gradient(90deg, #000, transparent 76%); }
.catalog-hero::after { content: "CATALOGUE"; position: absolute; z-index: -1; left: -22px; bottom: -57px; color: rgba(255,255,255,.035); font-family: "Manrope"; font-size: clamp(6rem, 16vw, 14rem); font-weight: 850; letter-spacing: -.09em; line-height: 1; }
.catalog-hero__inner { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(380px, .92fr); gap: clamp(40px, 7vw, 105px); align-items: center; padding-block: 66px; }
.catalog-hero h1 { max-width: 780px; margin: 18px 0 23px; font-size: clamp(3.8rem, 7vw, 7.25rem); line-height: .87; letter-spacing: -.075em; }
.catalog-hero h1 em { color: #edcb73; }
.catalog-hero p { max-width: 620px; margin: 0; color: #bdd3c7; font-size: .88rem; }
.catalog-hero .eyebrow--light { border-color: rgba(255,255,255,.16); color: #e1ece6; background: rgba(255,255,255,.07); backdrop-filter: blur(8px); }
.catalog-hero__art { position: relative; min-height: 390px; display: grid; place-items: center; }
.catalog-hero__art::before { content: ""; position: absolute; width: min(92%, 490px); aspect-ratio: 1; border: 1px solid rgba(255,255,255,.13); border-radius: 50%; background: radial-gradient(circle, rgba(236,202,113,.17), rgba(255,255,255,.03) 55%, transparent 56%); box-shadow: inset 0 0 0 38px rgba(255,255,255,.018), 0 44px 95px rgba(0,0,0,.2); }
.catalog-hero__art img { position: relative; z-index: 1; width: min(100%, 560px); max-height: 405px; object-fit: contain; filter: drop-shadow(0 32px 34px rgba(0,0,0,.3)); transform: rotate(-1.5deg); }
.catalog-hero__art > span { position: absolute; z-index: 2; right: 0; bottom: 28px; min-width: 128px; padding: 14px 18px; border: 1px solid rgba(255,255,255,.17); border-radius: 17px; color: #d7e9df; background: rgba(4,45,32,.74); box-shadow: 0 17px 35px rgba(0,0,0,.2); backdrop-filter: blur(15px); font-size: .65rem; }
.catalog-hero__art > span strong { display: block; margin-bottom: 2px; color: #efcc73; font-family: "Manrope"; font-size: 1.8rem; line-height: 1; }

.catalog-shell { padding-top: 0; }
.catalog-toolbar { position: sticky; z-index: 24; top: calc(var(--header-height) + 35px); display: grid; grid-template-columns: 1fr minmax(235px, 330px); gap: 18px; align-items: center; margin: -35px 0 36px; padding: 15px; border: 1px solid rgba(207,219,210,.84); border-radius: 22px; background: rgba(255,255,255,.91); box-shadow: 0 18px 55px rgba(22,52,37,.11); backdrop-filter: blur(18px); }
.catalog-filters { display: flex; gap: 7px; overflow-x: auto; scrollbar-width: none; }
.catalog-filters::-webkit-scrollbar { display: none; }
.catalog-filters button { flex: 0 0 auto; min-height: 42px; display: inline-flex; align-items: center; gap: 7px; padding: 0 14px; border: 1px solid transparent; border-radius: 12px; color: #65736b; background: transparent; cursor: pointer; font: inherit; font-size: .65rem; font-weight: 800; transition: color .2s, background .2s, box-shadow .2s, transform .2s; }
.catalog-filters button i { font-size: .98rem; }
.catalog-filters button:hover { color: #075a3b; background: #eef6f0; }
.catalog-filters button.is-active { color: #fff; background: linear-gradient(135deg, #096f48, #06492f); box-shadow: 0 8px 19px rgba(6,84,52,.2); transform: translateY(-1px); }
.catalog-search { position: relative; display: block; }
.catalog-search > i { position: absolute; z-index: 1; left: 14px; top: 50%; color: #718077; font-size: 1rem; transform: translateY(-50%); }
.catalog-search input { width: 100%; height: 44px; padding: 0 42px; border: 1px solid #dbe3dd; border-radius: 13px; outline: 0; color: var(--ink); background: #f7f9f7; font: inherit; font-size: .68rem; transition: background .2s, border-color .2s, box-shadow .2s; }
.catalog-search input:focus { border-color: #6bad88; background: #fff; box-shadow: 0 0 0 4px rgba(8,115,69,.08); }
.catalog-results-head { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 22px; }
.catalog-results-head p { margin: 0; color: #536159; font-size: .7rem; }
.catalog-results-head p strong { margin-right: 3px; color: var(--ink); font-family: "Manrope"; font-size: 1.35rem; }
.catalog-results-head > span { color: #87928b; font-size: .59rem; }
.catalog-product-grid { gap: 18px; }
.catalog-product-card { display: flex; flex-direction: column; border-color: #dfe6e0; box-shadow: 0 9px 30px rgba(25,52,39,.045); }
.catalog-product-card .product-card__media { aspect-ratio: 1 / 1.02; background: linear-gradient(145deg, color-mix(in srgb, var(--product-accent) 10%, #f7f4ec), #f9faf6); }
.catalog-product-card .product-card__media img { object-fit: contain; padding: 12px; }
.catalog-product-card .product-card__body { flex: 1; display: flex; flex-direction: column; }
.catalog-product-card h3 { min-height: 2.7em; margin-bottom: 9px; }
.catalog-product-card__copy { display: -webkit-box; min-height: 3.75em; margin: 0 0 13px; overflow: hidden; color: #718078; font-size: .68rem; line-height: 1.55; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.catalog-product-card__rating { display: flex; align-items: center; gap: 5px; margin: auto 0 15px; color: #78857e; font-size: .61rem; font-weight: 700; }
.catalog-product-card__rating > span { color: #e1a826; letter-spacing: .02em; }
.catalog-product-card__rating > i { color: #d19f2f; font-size: .86rem; }
.catalog-product-card .product-card__buy { padding-top: 14px; border-top: 1px solid #edf1ed; }
.catalog-product-card .add-button { box-shadow: 0 8px 18px rgba(8,115,69,.16); }
.catalog-empty { padding: 75px 25px; border: 1px dashed #c8d5cc; border-radius: 25px; text-align: center; background: #fff; }
.catalog-empty > i { display: block; margin-bottom: 14px; color: #78a98e; font-size: 3rem; }
.catalog-empty h2 { margin: 0 0 7px; font-size: 1.6rem; }
.catalog-empty p { margin: 0; color: var(--muted); font-size: .7rem; }

@media (max-width: 1050px) {
    .catalog-hero__inner { grid-template-columns: 1fr .78fr; }
    .catalog-hero__art { min-height: 330px; }
    .catalog-product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .catalog-toolbar { grid-template-columns: 1fr 260px; }
}

@media (max-width: 800px) {
    .catalog-image-hero { padding: 12px 0 46px; }
    .catalog-image-hero > .container { width: min(calc(100% - 24px), 1240px); }
    .catalog-image-hero picture { border-radius: 23px; }
    .catalog-image-hero img { aspect-ratio: 4 / 5; }
    .catalog-hero { min-height: auto; }
    .catalog-hero__inner { grid-template-columns: 1fr; padding-block: 58px 86px; }
    .catalog-hero__art { min-height: 310px; }
    .catalog-hero__art img { max-height: 330px; }
    .catalog-toolbar { top: 78px; grid-template-columns: 1fr; gap: 10px; }
    .catalog-search { grid-row: 1; }
    .catalog-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
    .catalog-hero__inner { gap: 20px; }
    .catalog-hero h1 { font-size: clamp(3.3rem, 15vw, 5.2rem); }
    .catalog-hero p { font-size: .75rem; }
    .catalog-hero__art { min-height: 250px; }
    .catalog-hero__art img { max-height: 270px; }
    .catalog-hero__art > span { right: 4px; bottom: 8px; }
    .catalog-toolbar { margin-top: -28px; padding: 10px; border-radius: 17px; }
    .catalog-filters button { min-height: 38px; padding-inline: 11px; font-size: .59rem; }
    .catalog-results-head { align-items: flex-start; flex-direction: column; gap: 5px; }
    .catalog-product-grid { gap: 10px; }
    .catalog-product-card__copy { display: none; }
    .catalog-product-card__rating { min-height: 19px; margin-bottom: 10px; font-size: .54rem; }
}

@media (max-width: 620px) {
    .ai-float { right: 17px; bottom: 89px; width: 62px; height: 62px; padding: 5px; border-radius: 50%; }
    .ai-float::after { display: none; }
    .ai-float__orb { width: 50px; height: 50px; border-radius: 50%; }
    .ai-float__orb img { width: 59px; height: 59px; }
    .ai-float__online { right: 3px; bottom: 5px; }
    .ai-chat { right: 10px; bottom: 160px; width: calc(100vw - 20px); max-height: calc(100dvh - 176px); overflow-y: auto; border-radius: 25px; }
    .ai-offer-card__media { height: 88px; }
    .ai-offer-card__body { padding: 9px; }
    .ai-offer-card__body > button { min-width: 103px; }
    .ai-chat__messages { height: 118px; }
}

/* Colourful customer login refresh */
.customer-auth-page main { position: relative; overflow: hidden; padding: 30px 0 72px; background: radial-gradient(circle at 5% 8%,rgba(255,174,86,.22),transparent 24%),radial-gradient(circle at 95% 14%,rgba(71,183,125,.22),transparent 25%),radial-gradient(circle at 71% 96%,rgba(248,210,104,.24),transparent 28%),#f8f7ef; }
.customer-auth-page main::before { content: ""; position: absolute; left: -110px; bottom: 70px; width: 320px; height: 320px; border: 1px solid rgba(23,119,70,.08); border-radius: 50%; box-shadow: 0 0 0 42px rgba(23,119,70,.025),0 0 0 84px rgba(23,119,70,.018); pointer-events: none; }
.customer-auth-shell { position: relative; z-index: 1; width: min(calc(100% - 48px),1360px); min-height: 720px; margin: 0 auto; overflow: hidden; grid-template-columns: minmax(0,1.08fr) minmax(455px,.92fr); border: 1px solid rgba(13,79,48,.1); border-radius: 36px; background: #fff; box-shadow: 0 35px 90px rgba(30,62,40,.16); }
.customer-auth-visual { isolation: isolate; padding: clamp(42px,5vw,70px); background: radial-gradient(circle at 9% 4%,rgba(255,163,67,.46),transparent 29%),radial-gradient(circle at 98% 17%,rgba(111,207,150,.28),transparent 30%),radial-gradient(circle at 78% 96%,rgba(242,193,69,.22),transparent 27%),linear-gradient(145deg,#07362a 0%,#075c3e 58%,#06432f 100%); }
.customer-auth-visual::before { content: ""; position: absolute; z-index: -1; right: -115px; bottom: -140px; width: 390px; height: 390px; border: 1px solid rgba(255,255,255,.09); border-radius: 50%; box-shadow: 0 0 0 43px rgba(255,255,255,.028),0 0 0 86px rgba(255,255,255,.018); pointer-events: none; }
.customer-auth-visual::after { z-index: -1; opacity: .16; background-image: radial-gradient(rgba(255,255,255,.65) .8px,transparent .8px); background-size: 24px 24px; mask-image: linear-gradient(135deg,#000,transparent 66%); }
.customer-auth-visual__label { padding: 9px 13px; border-color: rgba(255,238,192,.3); color: #fff4d4; background: linear-gradient(90deg,rgba(239,145,47,.25),rgba(255,255,255,.08)); box-shadow: inset 0 1px rgba(255,255,255,.12),0 10px 25px rgba(2,37,24,.12); }
.customer-auth-visual__copy { position: relative; z-index: 3; max-width: 650px; }
.customer-auth-visual__copy .eyebrow { color: #bfe6cf; }
.customer-auth-visual h1 { max-width: 650px; margin-bottom: 24px; font-size: clamp(3.5rem,5.3vw,6.4rem); line-height: .91; text-shadow: 0 14px 35px rgba(0,25,16,.2); }
.customer-auth-visual h1 em { color: #ffd06d; background: linear-gradient(90deg,#ffd36f,#ffad64); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.customer-auth-visual > .customer-auth-visual__copy > p { max-width: 590px; color: #c8ddd2; font-size: .86rem; line-height: 1.7; }
.customer-auth-product-collage { position: absolute; z-index: 2; right: 30px; top: 32px; width: 270px; height: 300px; pointer-events: none; }
.customer-auth-product-collage__card { position: absolute; overflow: hidden; width: 138px; height: 174px; margin: 0; border: 1px solid rgba(255,255,255,.42); border-radius: 23px; background: #fff; box-shadow: 0 20px 42px rgba(1,36,22,.24); }
.customer-auth-product-collage__card img { width: 100%; height: 100%; display: block; object-fit: cover; }
.customer-auth-product-collage__card figcaption { position: absolute; left: 9px; right: 9px; bottom: 9px; padding: 7px 8px; border: 1px solid rgba(255,255,255,.35); border-radius: 10px; color: #fff; background: rgba(5,52,33,.68); backdrop-filter: blur(9px); font-size: .52rem; font-weight: 800; text-align: center; }
.customer-auth-product-collage__card--ghee { right: 12px; top: 0; transform: rotate(6deg); }
.customer-auth-product-collage__card--mixme { left: 2px; top: 87px; transform: rotate(-7deg); }
.customer-auth-product-collage__rating { position: absolute; right: 1px; bottom: 6px; min-width: 116px; display: grid; grid-template-columns: auto 1fr; gap: 2px 7px; align-items: center; padding: 10px 12px; border: 1px solid rgba(255,255,255,.28); border-radius: 16px; color: #fff; background: rgba(255,255,255,.14); box-shadow: 0 12px 28px rgba(1,36,22,.18); backdrop-filter: blur(12px); }
.customer-auth-product-collage__rating strong { grid-row: 1 / 3; color: #ffd36f; font-family: "Manrope",sans-serif; font-size: 1.6rem; line-height: 1; }
.customer-auth-product-collage__rating i { color: #ffd36f; font-size: .49rem; font-style: normal; letter-spacing: .04em; }
.customer-auth-product-collage__rating small { color: #d1e7dc; font-size: .46rem; text-transform: uppercase; }
.customer-auth-steps { position: relative; z-index: 3; }
.customer-auth-steps span { border: 1px solid rgba(255,255,255,.1); color: #eef8f2; background: rgba(255,255,255,.1); box-shadow: inset 0 1px rgba(255,255,255,.09); }
.customer-auth-steps span:nth-child(1) i { color: #8fe2af; }
.customer-auth-steps span:nth-child(2) i { color: #ffd16d; }
.customer-auth-steps span:nth-child(3) i { color: #ff9f6a; }
.customer-auth-panel { position: relative; overflow: hidden; padding: clamp(32px,5vw,68px); background: radial-gradient(circle at 100% 0,rgba(255,181,97,.2),transparent 31%),radial-gradient(circle at 5% 94%,rgba(91,191,132,.2),transparent 31%),linear-gradient(145deg,#fffdf9,#f3f8f2); }
.customer-auth-panel::before { content: ""; position: absolute; right: -95px; top: -105px; width: 260px; height: 260px; border-radius: 50%; background: radial-gradient(circle,rgba(255,189,98,.28),transparent 68%); pointer-events: none; }
.customer-auth-card { position: relative; width: min(100%,535px); padding: 38px; overflow: hidden; border: 1px solid rgba(255,255,255,.82); border-radius: 30px; background: rgba(255,255,255,.83); box-shadow: 0 24px 65px rgba(34,68,45,.13),inset 0 1px rgba(255,255,255,.9); backdrop-filter: blur(18px); }
.customer-auth-card::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 5px; background: linear-gradient(90deg,#f28b3a,#f3c65f 48%,#118456); }
.customer-auth-card__brand { display: flex; align-items: center; gap: 11px; margin-bottom: 24px; padding-bottom: 20px; border-bottom: 1px solid #e7ebe5; }
.customer-auth-card__brand > span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 14px; color: #fff; background: linear-gradient(145deg,#ef8f3d,#0c8250); box-shadow: 0 10px 20px rgba(35,112,67,.2); font-size: 1.12rem; }
.customer-auth-card__brand strong,.customer-auth-card__brand small { display: block; }
.customer-auth-card__brand strong { color: #1e3829; font-size: .75rem; }
.customer-auth-card__brand small { margin-top: 3px; color: #859188; font-size: .54rem; text-transform: uppercase; letter-spacing: .07em; }
.customer-auth-back { margin-bottom: 25px; color: #637269; }
.customer-auth-card > .eyebrow { color: #ce6a2d; }
.customer-auth-card > .eyebrow::before { background: linear-gradient(90deg,#ef8b3c,#1a8752); }
.customer-auth-card h2 { color: #173222; font-size: clamp(2.25rem,3.3vw,3.15rem); letter-spacing: -.055em; }
.customer-auth-card > p { color: #6b796f; line-height: 1.65; }
.customer-auth-form { gap: 16px; }
.customer-auth-form label > span { color: #3d5145; }
.customer-auth-form label > div > i { left: 16px; color: #158057; }
.customer-auth-form input { height: 54px; padding-inline: 47px; border-color: #d8e3da; border-radius: 15px; background: rgba(255,255,255,.9); box-shadow: inset 0 1px 2px rgba(31,69,44,.025); }
.customer-auth-form input:hover { border-color: #b9d1c0; }
.customer-auth-form input:focus { border-color: #1e9562; box-shadow: 0 0 0 4px rgba(20,142,88,.1),0 10px 22px rgba(35,91,53,.06); }
.customer-auth-form [data-password-toggle] { right: 7px; top: 8px; color: #5f7568; }
.customer-auth-form [data-password-toggle]:hover { color: #0d8052; background: #edf7f0; }
.customer-auth-card .customer-auth-form .button { min-height: 55px; border: 0; border-radius: 15px; background: linear-gradient(100deg,#075c3f,#0b8757 57%,#16976a); box-shadow: 0 14px 28px rgba(8,113,72,.22); }
.customer-auth-card .customer-auth-form .button:hover { transform: translateY(-2px); box-shadow: 0 19px 34px rgba(8,113,72,.27); }
.customer-auth-switch a { color: #c9672f; }
.customer-auth-note { border: 1px solid #dde9df; border-radius: 16px; background: linear-gradient(90deg,#eef7ef,#fff8e9); }
.customer-auth-note > i { color: #0d8253; box-shadow: 0 7px 15px rgba(32,98,59,.08); }

@media (max-width: 1050px) {
    .customer-auth-shell { grid-template-columns: minmax(0,1fr) minmax(430px,.95fr); }
    .customer-auth-product-collage { opacity: .72; transform: scale(.82); transform-origin: right top; }
}

@media (max-width: 800px) {
    .customer-auth-page main { padding: 18px 0 50px; }
    .customer-auth-shell { width: calc(100% - 28px); grid-template-columns: 1fr; border-radius: 29px; }
    .customer-auth-visual { min-height: 520px; }
    .customer-auth-product-collage { opacity: .8; transform: scale(.78); }
    .customer-auth-panel { padding: 38px 24px 46px; }
}

@media (max-width: 620px) {
    .customer-auth-page main { padding-top: 10px; }
    .customer-auth-shell { width: calc(100% - 16px); border-radius: 24px; }
    .customer-auth-visual { min-height: 430px; padding: 29px 20px; }
    .customer-auth-product-collage { display: none; }
    .customer-auth-visual h1 { font-size: 3.18rem; }
    .customer-auth-visual > .customer-auth-visual__copy > p { font-size: .72rem; }
    .customer-auth-steps { gap: 6px; }
    .customer-auth-steps span { padding: 8px 9px; font-size: .54rem; }
    .customer-auth-panel { padding: 25px 10px 30px; }
    .customer-auth-card { padding: 27px 18px 21px; border-radius: 23px; }
    .customer-auth-card__brand { margin-bottom: 20px; padding-bottom: 16px; }
    .customer-auth-back { margin-bottom: 23px; }
    .customer-auth-card h2 { font-size: 2.12rem; }
    .customer-auth-form input { height: 52px; }
}

/* Unframed Gawdee AI mascot button */
.ai-float { width: 78px; height: 78px; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; backdrop-filter: none; }
.ai-float::before { display: none; }
.ai-float:hover { border-color: transparent; box-shadow: none; }
.ai-float.is-active { border-color: transparent; }
.ai-float__orb { width: 74px; height: 74px; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.ai-float__orb img { width: 76px; height: 76px; filter: drop-shadow(0 9px 10px rgba(0,42,25,.22)); }
.ai-float__online { right: 5px; bottom: 7px; border-color: #fff; }

@media (max-width: 620px) {
    .ai-float { width: 68px; height: 68px; padding: 0; border-radius: 0; background: transparent; box-shadow: none; }
    .ai-float__orb { width: 65px; height: 65px; border-radius: 0; background: transparent; }
    .ai-float__orb img { width: 67px; height: 67px; }
    .ai-float__online { right: 3px; bottom: 5px; }
}

/* Homepage sliding product and testimonial rails */
.commerce-section__actions { display: flex; align-items: center; gap: 18px; }
.commerce-section__actions > a { display: flex; align-items: center; gap: 8px; color: #087432; font-size: .72rem; font-weight: 800; white-space: nowrap; }
.home-slider-controls,
.testimonial-reference-controls .section-rail-controls { margin: 0; }
.home-slider-controls button,
.testimonial-reference-controls button { width: 40px; height: 40px; border-color: rgba(7,104,66,.18); color: #075f3f; background: rgba(255,255,255,.94); box-shadow: 0 8px 20px rgba(17,77,45,.09); }
.home-slider-controls button:hover,
.testimonial-reference-controls button:hover { color: #fff; border-color: #087347; background: #087347; transform: translateY(-2px); }

.home-product-rail,
.home-combo-rail { display: flex; overflow-x: auto; overscroll-behavior-inline: contain; scroll-behavior: smooth; scroll-snap-type: x mandatory; scrollbar-width: none; cursor: grab; touch-action: pan-y; }
.home-product-rail::-webkit-scrollbar,
.home-combo-rail::-webkit-scrollbar,
.testimonial-reference-rail::-webkit-scrollbar { display: none; }
.home-product-rail { gap: 15px; padding: 5px 3px 25px; }
.home-product-rail .compact-product-card { flex: 0 0 calc((100% - 60px) / 5); min-width: 195px; scroll-snap-align: start; scroll-snap-stop: always; }
.home-combo-rail { gap: 18px; padding: 4px 3px 22px; }
.home-combo-rail .combo-card { flex: 0 0 calc((100% - 36px) / 3); min-width: 285px; scroll-snap-align: start; scroll-snap-stop: always; }
.home-product-rail.is-grabbing,
.home-combo-rail.is-grabbing,
.testimonial-reference-rail.is-grabbing { cursor: grabbing; scroll-snap-type: none; user-select: none; }

.testimonial-reference-controls { width: min(calc(100% - 64px), 1180px); display: flex; align-items: center; justify-content: flex-end; gap: 15px; margin: -14px auto 17px; }
.testimonial-reference-controls > span { display: inline-flex; align-items: center; gap: 7px; color: #6c796f; font-size: .64rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.testimonial-reference-controls > span i { color: #0a8054; font-size: 1.05rem; }
.testimonial-reference-rail { cursor: grab; touch-action: pan-y; }

@media (max-width: 1000px) {
    .home-product-rail .compact-product-card { flex-basis: calc((100% - 30px) / 3); min-width: 210px; }
    .home-combo-rail .combo-card { flex-basis: calc((100% - 18px) / 2); min-width: 280px; }
}

@media (max-width: 700px) {
    .commerce-section__heading { align-items: flex-start; }
    .commerce-section__actions { flex-direction: column; align-items: flex-end; gap: 9px; }
    .commerce-section__actions > a { font-size: .62rem; }
    .home-slider-controls button,
    .testimonial-reference-controls button { width: 38px; height: 38px; }
    .home-product-rail { margin-right: calc((100vw - 100%) / -2); padding-right: 24px; }
    .home-product-rail .compact-product-card { flex-basis: min(72vw, 245px); min-width: min(72vw, 245px); }
    .home-combo-rail { margin-right: calc((100vw - 100%) / -2); padding-right: 24px; }
    .home-combo-rail .combo-card { flex-basis: min(82vw, 315px); min-width: min(82vw, 315px); }
    .testimonial-reference-controls { width: calc(100% - 32px); margin-top: -7px; }
}

/* Independence Day launch offer popup */
body.has-offer-popup { overflow: hidden; }
.offer-popup[hidden] { display: none; }
.offer-popup {
    position: fixed;
    z-index: 260;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 22px;
    background: radial-gradient(circle at 50% 42%, rgba(255,255,255,.18), transparent 36%), rgba(3,31,22,.73);
    backdrop-filter: blur(13px) saturate(.88);
    opacity: 0;
    pointer-events: none;
    transition: opacity .28s ease;
}
.offer-popup.is-visible { opacity: 1; pointer-events: auto; }
.offer-popup__dialog {
    position: relative;
    width: min(94vw, 560px);
    overflow: hidden;
    padding: 9px;
    border: 1px solid rgba(255,255,255,.88);
    border-radius: 30px;
    background: rgba(255,255,255,.94);
    box-shadow: 0 38px 110px rgba(0,28,17,.42), 0 0 0 1px rgba(226,153,51,.16);
    transform: translateY(26px) scale(.94);
    transition: transform .38s cubic-bezier(.2,.82,.2,1);
}
.offer-popup.is-visible .offer-popup__dialog { transform: translateY(0) scale(1); }
.offer-popup__flag { position: absolute; z-index: 4; left: 28px; top: 22px; display: flex; gap: 4px; padding: 6px 8px; border: 1px solid rgba(255,255,255,.65); border-radius: 999px; background: rgba(255,255,255,.82); box-shadow: 0 7px 20px rgba(15,48,30,.1); backdrop-filter: blur(10px); }
.offer-popup__flag span { width: 18px; height: 4px; border-radius: 999px; background: #ef7b23; }
.offer-popup__flag span:nth-child(2) { background: #fff; box-shadow: inset 0 0 0 1px #d9dfdb; }
.offer-popup__flag span:nth-child(3) { background: #0b8149; }
.offer-popup__close {
    position: absolute;
    z-index: 5;
    right: 22px;
    top: 20px;
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255,255,255,.76);
    border-radius: 50%;
    color: #123c2a;
    background: rgba(255,255,255,.9);
    box-shadow: 0 10px 24px rgba(9,48,28,.16);
    backdrop-filter: blur(12px);
    cursor: pointer;
    transition: color .2s, background .2s, transform .2s;
}
.offer-popup__close:hover { color: #fff; background: #086b42; transform: rotate(6deg) scale(1.04); }
.offer-popup__close:focus-visible,
.offer-popup__code:focus-visible,
.offer-popup__shop:focus-visible,
.offer-popup__art:focus-visible { outline: 3px solid rgba(239,123,35,.72); outline-offset: 3px; }
.offer-popup__art { display: block; overflow: hidden; border-radius: 22px; background: #fffaf0; }
.offer-popup__art img { width: 100%; max-height: calc(100vh - 170px); display: block; object-fit: contain; }
.offer-popup__actions { display: grid; grid-template-columns: minmax(0,1fr) auto auto; gap: 9px; align-items: center; padding: 11px 5px 3px; }
.offer-popup__copy { min-width: 0; padding-left: 5px; }
.offer-popup__copy > span { display: block; color: #0a6943; font-size: .57rem; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.offer-popup__copy p { margin: 3px 0 0; color: #5e6d64; font-size: .58rem; line-height: 1.35; }
.offer-popup__copy strong { color: #173c2b; }
.offer-popup__code { min-width: 126px; padding: 8px 11px; border: 1px dashed rgba(9,104,64,.35); border-radius: 13px; color: #0a6843; background: #eff8f2; cursor: pointer; }
.offer-popup__code strong { display: block; font-size: .72rem; letter-spacing: .05em; }
.offer-popup__code span { display: flex; justify-content: center; gap: 4px; margin-top: 2px; color: #637268; font-size: .47rem; font-weight: 750; }
.offer-popup__code.is-copied { color: #fff; border-color: #087246; background: #087246; }
.offer-popup__code.is-copied span { color: #fff; }
.offer-popup__shop { min-height: 49px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 0 17px; border-radius: 14px; color: #fff; background: linear-gradient(135deg,#075e3c,#0a834e); box-shadow: 0 10px 25px rgba(7,101,59,.22); font-size: .61rem; font-weight: 850; white-space: nowrap; transition: transform .2s, box-shadow .2s; }
.offer-popup__shop:hover { transform: translateY(-2px); box-shadow: 0 15px 31px rgba(7,101,59,.3); }

@media (max-width: 620px) {
    .offer-popup { padding: 9px; }
    .offer-popup__dialog { width: min(100%, 460px); padding: 7px; border-radius: 23px; }
    .offer-popup__art { border-radius: 17px; }
    .offer-popup__art img { max-height: calc(100vh - 166px); }
    .offer-popup__flag { left: 18px; top: 17px; }
    .offer-popup__flag span { width: 14px; }
    .offer-popup__close { right: 16px; top: 15px; width: 37px; height: 37px; }
    .offer-popup__actions { grid-template-columns: 1fr auto; gap: 7px; }
    .offer-popup__copy { display: none; }
    .offer-popup__code { min-width: 0; }
    .offer-popup__shop { min-height: 47px; padding-inline: 16px; }
}

@media (max-height: 650px) and (orientation: landscape) {
    .offer-popup__dialog { width: min(92vw, 850px); display: grid; grid-template-columns: minmax(0, 1fr) 270px; gap: 7px; }
    .offer-popup__art img { height: calc(100vh - 32px); max-height: none; object-fit: contain; }
    .offer-popup__actions { align-content: center; grid-template-columns: 1fr; padding: 55px 14px 15px 7px; }
    .offer-popup__copy { display: block; }
}

@media (prefers-reduced-motion: reduce) {
    .offer-popup, .offer-popup__dialog { transition: none; }
}