/* =========================================================
   GREEN THRAKI 2.0
   Clean Core Styles
   Consolidated version — duplicate overrides removed
========================================================= */

:root {
    --gt-logo: #1b3126;
    --gt-green: #17352a;
    --gt-green-deep: #10291f;
    --gt-green-soft: #29483b;

    --gt-ivory: #f5f2eb;
    --gt-warm-white: #f7f4ed;
    --gt-stone: #e8e2d8;

    --gt-ink: #17201b;
    --gt-grey: #6b706b;
    --gt-line: rgba(27, 49, 38, 0.15);
    --gt-white: #ffffff;

    --display: "Cormorant Garamond", Georgia, serif;
    --sans: "Manrope", Arial, sans-serif;

    --page-padding: clamp(24px, 4.5vw, 76px);
    --header-height: 82px;
}

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

html {
    scroll-behavior: smooth;
}

body {
    background: var(--gt-ivory);
    color: var(--gt-ink);
    font-family: var(--sans);
    font-size: 16px;
    line-height: 1.6;
    overflow-x: hidden;
}

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

button {
    font: inherit;
}

::selection {
    background: var(--gt-green);
    color: var(--gt-ivory);
}

/* HEADER */

.site-header {
    position: fixed;
    z-index: 1000;
    top: 0;
    left: 0;
    width: 100%;
    height: var(--header-height);
    padding: 0 var(--page-padding);

    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;

    background: rgba(247, 244, 237, 0.96);
    color: var(--gt-logo);
    border-bottom: 1px solid rgba(27, 49, 38, 0.12);

    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);

    transition:
        background 0.35s ease,
        box-shadow 0.35s ease,
        height 0.35s ease;
}

.site-header.scrolled {
    height: 76px;
    background: rgba(247, 244, 237, 0.97);
    box-shadow: 0 8px 35px rgba(16, 41, 31, 0.06);
}

.brand {
    justify-self: start;
    min-width: 230px;
    display: flex;
    align-items: center;
    line-height: 1;
}

.brand-logo {
    display: block;

    width: clamp(175px, 12vw, 220px);
    max-height: 50px;
    height: auto;

    object-fit: contain;
    object-position: left center;
}

.desktop-nav {
    display: flex;
    align-items: center;
    gap: clamp(25px, 2.4vw, 46px);
}

.desktop-nav a {
    position: relative;
    padding: 8px 0;
    color: var(--gt-logo);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.11em;
}

.desktop-nav a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 1px;
    width: 100%;
    height: 1px;
    background: currentColor;
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 0.4s cubic-bezier(.2, .8, .2, 1);
}

.desktop-nav a:hover::after {
    transform: scaleX(1);
    transform-origin: left;
}

.header-actions {
    justify-self: end;
    display: flex;
    align-items: center;
    gap: 28px;
}

.language-switcher {
    display: flex;
    align-items: center;
    gap: 9px;
}

.language-button {
    padding: 0;
    border: 0;
    background: transparent;
    color: rgba(27, 49, 38, 0.48);
    font-family: var(--sans);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.12em;
    opacity: 0.75;
    cursor: pointer;
    transition:
        opacity 0.25s ease,
        color 0.25s ease;
}

.language-button:hover,
.language-button.active {
    color: var(--gt-logo);
    opacity: 1;
}

.language-divider {
    width: 18px;
    height: 1px;
    background: var(--gt-logo);
    opacity: 0.35;
}

.menu-toggle {
    display: none;
    width: 32px;
    height: 32px;
    border: 0;
    background: transparent;
    color: var(--gt-logo);
    cursor: pointer;
}

.menu-toggle span {
    display: block;
    width: 26px;
    height: 1px;
    margin: 7px 0;
    background: currentColor;
}

/* MOBILE MENU */

.mobile-menu {
    position: fixed;
    z-index: 900;
    inset: 0;
    padding:
        calc(var(--header-height) + 60px)
        var(--page-padding)
        35px;

    display: flex;
    flex-direction: column;
    justify-content: space-between;

    background: var(--gt-green-deep);
    color: var(--gt-ivory);

    visibility: hidden;
    opacity: 0;
    transform: translateY(-15px);

    transition:
        opacity 0.4s ease,
        transform 0.4s ease,
        visibility 0.4s;
}

.mobile-menu.active {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
}

.mobile-menu nav {
    display: flex;
    flex-direction: column;
}

.mobile-menu nav a {
    padding: 10px 0;
    font-family: var(--display);
    font-size: clamp(42px, 10vw, 70px);
    line-height: 1.05;
    border-bottom: 1px solid rgba(245, 242, 235, 0.14);
}

.mobile-menu-footer {
    display: flex;
    justify-content: space-between;
    font-size: 9px;
    letter-spacing: 0.12em;
    opacity: 0.55;
}

/* HERO */

.hero {
    position: relative;
    min-height: 100svh;

    padding:
        calc(var(--header-height) + 55px)
        var(--page-padding)
        78px;

    display: grid;
    grid-template-columns: 1fr;
    overflow: hidden;

    background:
        linear-gradient(
            125deg,
            var(--gt-green-deep) 0%,
            var(--gt-green) 48%,
            #23483a 100%
        );

    color: var(--gt-ivory);
}

.hero-background {
    position: absolute;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
}

.hero-orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(1px);
    opacity: 0.58;
}

.hero-orb-one {
    width: min(50vw, 720px);
    aspect-ratio: 1;
    right: -10%;
    top: 4%;
    background:
        radial-gradient(
            circle at 32% 30%,
            rgba(218, 209, 183, 0.33),
            rgba(77, 120, 91, 0.14) 45%,
            rgba(9, 41, 30, 0) 72%
        );
    animation: orbFloatOne 13s ease-in-out infinite alternate;
}

.hero-orb-two {
    width: min(42vw, 620px);
    aspect-ratio: 1;
    left: 31%;
    bottom: -33%;
    background:
        radial-gradient(
            circle,
            rgba(204, 191, 158, 0.14),
            rgba(9, 41, 30, 0) 68%
        );
    animation: orbFloatTwo 17s ease-in-out infinite alternate;
}

@keyframes orbFloatOne {
    from { transform: translate3d(0, 0, 0) scale(1); }
    to { transform: translate3d(-50px, 30px, 0) scale(1.08); }
}

@keyframes orbFloatTwo {
    from { transform: translate3d(0, 0, 0); }
    to { transform: translate3d(70px, -35px, 0); }
}

.hero-grain {
    position: absolute;
    inset: 0;
    opacity: 0.11;
    background-image:
        repeating-radial-gradient(
            circle at 20% 30%,
            rgba(255, 255, 255, 0.14) 0,
            rgba(255, 255, 255, 0.14) 0.5px,
            transparent 0.8px,
            transparent 3px
        );
    mix-blend-mode: soft-light;
}

.hero-index,
.hero-side-note,
.scroll-indicator {
    display: none;
}

.hero-content {
    position: relative;
    z-index: 2;
    grid-column: 1;
    width: min(100%, 1320px);
    margin: auto;
    align-self: center;
}

.hero-eyebrow {
    margin-bottom: clamp(30px, 5vh, 65px);
    color: rgba(245, 242, 235, 0.68);
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 0.2em;
}

.hero-title {
    max-width: 1250px;
    font-family: var(--display);
    font-size: clamp(64px, 8.4vw, 142px);
    font-weight: 400;
    line-height: 0.82;
    letter-spacing: -0.055em;
}

.hero-title span {
    display: block;
}

.hero-title-indent {
    margin-top: 0.11em;
    margin-left: clamp(50px, 11vw, 185px);
    font-style: italic;
    font-weight: 400;
}

.hero-bottom {
    margin-top: clamp(45px, 7vh, 80px);
    margin-left: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 42px;
}

.hero-description {
    max-width: 460px;
    color: rgba(245, 242, 235, 0.72);
    font-size: clamp(13px, 1.05vw, 16px);
    font-weight: 400;
    line-height: 1.8;
}

/* HERO CTA */

.explore-link {
    position: absolute;
    z-index: 4;
    left: 50%;
    bottom: 25px;

    width: 230px;
    height: 48px;
    padding: 0 42px 0 18px;

    display: flex;
    align-items: center;
    justify-content: center;

    overflow: hidden;
    isolation: isolate;

    background:
        linear-gradient(
            180deg,
            #faf7ef 0%,
            #eee8dc 100%
        );

    border: 1px solid rgba(255, 255, 255, 0.78);
    border-radius: 2px;

    color: var(--gt-green);

    font-family: var(--sans);
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 0.13em;
    text-align: center;

    box-shadow:
        0 8px 18px rgba(5, 24, 17, 0.18),
        0 2px 4px rgba(5, 24, 17, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.75);

    transform: translateX(-50%);

    transition:
        color 0.18s ease 0.22s,
        border-color 0.25s ease,
        box-shadow 0.25s ease;
}

.explore-link::before {
    content: "";
    position: absolute;
    z-index: 0;
    inset: 0;
    display: block;

    background:
        linear-gradient(
            90deg,
            #dfe6dc 0%,
            #a5b6a9 35%,
            #587565 68%,
            var(--gt-green) 100%
        );

    transform: scaleX(0);
    transform-origin: left center;

    transition: transform 0.55s cubic-bezier(.22, 1, .36, 1);
    pointer-events: none;
}

.explore-link:hover::before {
    transform: scaleX(1);
}

.explore-link > span:first-child {
    position: relative;
    z-index: 2;
    flex: 1;

    display: flex;
    align-items: center;
    justify-content: center;

    margin: 0;
    padding: 0;

    line-height: 1.1;
    text-align: center;
}

.explore-arrow {
    display: none;
}

.explore-link::after {
    content: "→";

    position: absolute;
    z-index: 3;
    right: 16px;
    top: 50%;

    width: 18px;
    height: 18px;

    display: flex;
    align-items: center;
    justify-content: center;

    color: var(--gt-green);
    font-size: 16px;
    font-weight: 400;
    line-height: 1;

    transform: translateY(-50%);
    pointer-events: none;
}

.explore-link:hover {
    color: var(--gt-white);
    border-color: rgba(245, 242, 235, 0.7);

    box-shadow:
        0 10px 24px rgba(5, 24, 17, 0.22),
        0 3px 6px rgba(5, 24, 17, 0.14),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);

    transform: translateX(-50%);
}

.explore-link:hover::after {
    color: var(--gt-white);
}

/* =========================================================
   02 — OUR STORY
========================================================= */

.story-section {
    position: relative;
    overflow: hidden;

    scroll-margin-top: 76px;

    min-height: calc(100svh - 76px);

    padding:
        clamp(34px, 3vw, 44px)
        var(--page-padding)
        clamp(70px, 7vw, 100px);

    background: var(--gt-ivory);
    color: var(--gt-ink);
}


/* TOP LINE */

.story-topline {
    padding-bottom: 22px;
    margin-bottom: clamp(60px, 6.5vw, 95px);

    display: flex;
    align-items: center;
    justify-content: space-between;

    border-bottom: 1px solid var(--gt-line);
}

.story-number,
.story-label {
    font-family: var(--sans);
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 0.16em;
}

.story-number {
    color: rgba(23, 32, 27, 0.45);
}

.story-label {
    color: var(--gt-green);
}


/* MAIN GRID */

.story-grid {
    display: grid;
    grid-template-columns:
        minmax(0, 1.15fr)
        minmax(320px, 0.72fr);

    gap: clamp(70px, 10vw, 170px);
    align-items: start;
}


/* BIG EDITORIAL TITLE */

.story-heading h2 {
    max-width: 760px;

    font-family: var(--display);
    font-size: clamp(64px, 7.3vw, 118px);
    font-weight: 400;

    line-height: 0.91;
    letter-spacing: -0.05em;
}

.story-heading h2 span {
    display: block;
}

.story-title-accent {
    margin-top: 0.08em;

    color: var(--gt-green);

    font-style: italic;
}


/* RIGHT COPY */

.story-copy {
    max-width: 510px;

    padding-top: 12px;
}

.story-copy p {
    color: var(--gt-grey);

    font-size: clamp(14px, 1.05vw, 16px);
    line-height: 1.9;
}

.story-copy p + p {
    margin-top: 28px;
}


/* OPENING PARAGRAPH */

.story-copy .story-lead {
    margin-bottom: 38px;

    color: #10291f;

    font-family: var(--display);
    font-size: clamp(25px, 2vw, 34px);
    font-weight: 500;
    line-height: 1.3;
    letter-spacing: -0.02em;
}


/* KEY STATEMENT */

.story-emphasis {
    position: relative;

    margin-top: 42px !important;
    margin-bottom: 42px;

    padding:
        28px 0
        28px 28px;

    border-left: 1px solid var(--gt-green);

    color: var(--gt-green) !important;

    font-family: var(--display);
    font-size: clamp(23px, 1.8vw, 30px) !important;
    line-height: 1.35 !important;
}


/* CLOSING */

.story-closing {
    margin-top: 46px !important;

    color: var(--gt-ink) !important;

    font-weight: 600;
}


/* SUBTLE BACKGROUND DETAIL */

.story-section::after {
    content: "";

    position: absolute;
    right: -13vw;
    bottom: -20vw;

    width: 42vw;
    aspect-ratio: 1;

    border: 1px solid rgba(27, 49, 38, 0.07);
    border-radius: 50%;

    pointer-events: none;
}


/* =========================================================
   OUR STORY — TABLET
========================================================= */

@media (max-width: 1050px) {

    .story-grid {
        grid-template-columns: 1fr 0.8fr;
        gap: 65px;
    }

    .story-heading h2 {
        font-size: clamp(58px, 8vw, 90px);
    }

}


/* =========================================================
   OUR STORY — MOBILE
========================================================= */

@media (max-width: 700px) {

    .story-section {
        scroll-margin-top: 68px;

        padding:
            40px
            var(--page-padding)
            78px;
    }

    .story-topline {
        margin-bottom: 55px;
    }

    .story-grid {
        display: block;
    }

    .story-heading h2 {
        max-width: 100%;

        font-size: clamp(54px, 15vw, 76px);
        line-height: 0.93;
    }

    .story-copy {
        max-width: 100%;
        padding-top: 65px;
    }

    .story-lead {
        font-size: 25px !important;
        line-height: 1.32 !important;
    }

    .story-copy p {
        font-size: 14px;
        line-height: 1.85;
    }

    .story-emphasis {
        padding-left: 20px;

        font-size: 23px !important;
    }

    .story-section::after {
        width: 90vw;

        right: -52vw;
        bottom: -25vw;
    }

}/* =========================================================
   03 — BRANDS
========================================================= */

.brands-section {
    position: relative;
    overflow: hidden;

    /* Keeps 03 / BRANDS clear of the fixed header when using #brands. */
    scroll-margin-top: 76px;
    min-height: calc(100svh - 76px);

    padding:
        30px
        var(--page-padding)
        110px;

    background: var(--gt-warm-white);
    color: var(--gt-ink);
}


/* TOP LINE */

.brands-topline {
    padding-bottom: 20px;
    margin-bottom: clamp(54px, 5.5vw, 82px);

    display: flex;
    align-items: center;
    justify-content: space-between;

    border-bottom: 1px solid var(--gt-line);
}

.brands-number,
.brands-label {
    font-family: var(--sans);
    font-size: 10px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.16em;
}

.brands-number {
    color: rgba(23, 32, 27, 0.62);
}

.brands-label {
    color: var(--gt-green);
}


/* INTRO */

.brands-intro {
    margin-bottom: clamp(58px, 6vw, 88px);

    display: grid;
    grid-template-columns:
        minmax(0, 1.15fr)
        minmax(280px, 0.65fr);

    gap: clamp(60px, 9vw, 150px);
    align-items: end;
}

.brands-heading h2 {
    max-width: 850px;

    font-family: var(--display);
    font-size: clamp(62px, 7vw, 112px);
    font-weight: 400;
    line-height: 0.9;
    letter-spacing: -0.05em;
}

.brands-heading h2 span {
    display: block;
}

.brands-title-accent {
    margin-top: 0.08em;

    color: var(--gt-green);

    font-style: italic;
}

.brands-intro-copy {
    max-width: 430px;
    padding-bottom: 8px;
}

.brands-intro-copy p {
    color: var(--gt-grey);

    font-size: clamp(14px, 1vw, 16px);
    line-height: 1.85;
}


/* =========================================================
   BRAND CARD
========================================================= */

.brand-card {
    position: relative;
    overflow: hidden;

    min-height: 470px;

    padding:
        clamp(28px, 3vw, 42px)
        clamp(30px, 4vw, 60px)
        clamp(26px, 2.7vw, 38px);

    display: flex;
    flex-direction: column;

    background:
        linear-gradient(
            135deg,
            #0e271d 0%,
            #163528 48%,
            #25493a 100%
        );

    color: var(--gt-ivory);
    border-radius: 2px;
}


/* DECORATIVE BACKGROUND */

.brand-card::before {
    content: "";

    position: absolute;
    right: -8%;
    top: -45%;

    width: min(58vw, 760px);
    aspect-ratio: 1;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(232, 226, 216, 0.14) 0%,
            rgba(232, 226, 216, 0.05) 40%,
            rgba(232, 226, 216, 0) 70%
        );

    pointer-events: none;
}

.brand-card::after {
    content: "";

    position: absolute;
    left: 46%;
    bottom: -70%;

    width: min(48vw, 650px);
    aspect-ratio: 1;

    border: 1px solid rgba(245, 242, 235, 0.08);
    border-radius: 50%;

    pointer-events: none;
}


/* CARD TOP */

.brand-card-top {
    position: relative;
    z-index: 2;

    padding-bottom: 19px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    border-bottom: 1px solid rgba(245, 242, 235, 0.17);
}

.brand-card-index,
.brand-card-status {
    font-family: var(--sans);
    font-size: 9px;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 0.16em;
}

.brand-card-index {
    color: rgba(245, 242, 235, 0.45);
}

.brand-card-status {
    color: rgba(245, 242, 235, 0.72);
}


/* MAIN CONTENT */

.brand-card-content {
    position: relative;
    z-index: 2;

    margin-top: clamp(34px, 3.5vw, 50px);
    margin-bottom: clamp(34px, 3vw, 44px);

    display: grid;
    grid-template-columns:
        minmax(220px, 0.82fr)
        minmax(180px, 0.60fr)
        minmax(310px, 1fr);

    gap: clamp(38px, 5vw, 76px);

    align-items: stretch;
}

.brand-card-identity,
.brand-card-categories,
.brand-card-info {
    min-height: clamp(205px, 15vw, 225px);
}


/* BRAND IDENTITY */

.brand-card-identity {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.jgo-brand-logo {
    display: block;

    width: clamp(215px, 17vw, 270px);
    max-width: 100%;
    height: auto;

    object-fit: contain;
}


/* SMALL SECTION LABEL */

.brand-card-kicker {
    display: block;

    color: rgba(245, 242, 235, 0.52);

    font-family: var(--sans);
    font-size: 8px;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 0.17em;
}


/* CATEGORIES */

.brand-card-categories {
    padding-left: clamp(22px, 2vw, 30px);

    display: flex;
    flex-direction: column;
    justify-content: center;

    border-left: 1px solid rgba(245, 242, 235, 0.14);
}

.brand-card-category-list {
    margin-top: 17px;
    padding: 0;

    list-style: none;
}

.brand-card-category-list li {
    padding: 8px 0;

    color: rgba(245, 242, 235, 0.84);

    font-family: var(--sans);
    font-size: 10px;
    font-weight: 500;
    line-height: 1.45;
    letter-spacing: 0.085em;

    border-bottom: 1px solid rgba(245, 242, 235, 0.09);
}

.brand-card-category-list li:first-child {
    padding-top: 0;
}

.brand-card-category-list li:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}


/* BRAND INFORMATION */

.brand-card-info {
    max-width: 450px;

    display: flex;
    flex-direction: column;
    justify-content: center;
}

.brand-card-info p {
    color: rgba(245, 242, 235, 0.76);

    font-size: clamp(13px, 0.95vw, 15px);
    line-height: 1.82;
}


/* CTA */

.brand-card-actions {
    margin-top: 24px;

    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 14px 22px;
}

.brand-card-actions .brand-card-link {
    margin-top: 0;
}

.brand-card-link {
    width: fit-content;

    margin-top: 24px;
    padding-bottom: 8px;

    display: flex;
    align-items: center;
    gap: 24px;

    color: var(--gt-ivory);

    font-family: var(--sans);
    font-size: 9px;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 0.14em;

    border-bottom: 1px solid rgba(245, 242, 235, 0.4);

    transition:
        gap 0.3s ease,
        border-color 0.3s ease;
}

.brand-card-link:hover {
    gap: 34px;
    border-color: rgba(245, 242, 235, 0.9);
}

.brand-card-link:focus-visible {
    outline: 1px solid var(--gt-ivory);
    outline-offset: 6px;
}

.brand-certifications-link {
    min-height: 38px;
    padding: 0 14px;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;

    border: 1px solid rgba(245, 242, 235, 0.34);
    background: rgba(245, 242, 235, 0.025);
    color: rgba(245, 242, 235, 0.78);

    font-family: var(--sans);
    font-size: 8px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.13em;

    transition:
        background 0.28s ease,
        color 0.28s ease,
        border-color 0.28s ease;
}

.brand-certifications-link:hover {
    background: var(--gt-ivory);
    color: var(--gt-green);
    border-color: var(--gt-ivory);
}

.brand-certifications-link:focus-visible {
    outline: 1px solid var(--gt-ivory);
    outline-offset: 5px;
}


/* CERTIFICATIONS */

.brand-card-certifications {
    position: relative;
    z-index: 2;

    min-height: 104px;
    padding-top: 24px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-top: 1px solid rgba(245, 242, 235, 0.14);
}

.brand-card-certifications-label {
    position: absolute;
    left: 0;
    top: 50%;

    color: rgba(245, 242, 235, 0.58);

    transform: translateY(-50%);
}

.brand-certification-logos {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;

    width: 100%;
    margin: 0 auto;

    gap: clamp(44px, 4vw, 64px);
}

.certification-badge {
    flex: 0 0 auto;

    width: 170px;
    height: 90px;
    padding: 6px 8px;

    display: flex;
    align-items: center;
    justify-content: center;

    background: transparent;
    border: 0;
    border-radius: 0;
}

.certification-badge img {
    display: block;
    width: auto;
    height: auto;
    object-fit: contain;
}

/* Optical sizing: equal visual weight, not identical pixel width. */
.certification-badge-ecocert img {
    width: 132px;
    max-width: none;
    max-height: 58px;
}

.certification-badge-vegan img {
    width: 142px;
    max-width: none;
    max-height: 64px;
}

.certification-badge-usda img {
    width: 152px;
    max-width: none;
    max-height: 62px;
}


/* =========================================================
   BRANDS — TABLET
========================================================= */

@media (max-width: 1050px) {

    .brands-section {
        scroll-margin-top: 76px;
    }

    .brands-intro {
        grid-template-columns: 1fr 0.72fr;
        gap: 60px;
    }

    .brand-card {
        min-height: 470px;
    }

    .brand-card-content {
        grid-template-columns:
            minmax(190px, 0.75fr)
            minmax(150px, 0.58fr)
            minmax(260px, 1fr);

        gap: 30px;
    }

    .brand-card-identity,
    .brand-card-categories,
    .brand-card-info {
        min-height: 205px;
    }

    .jgo-brand-logo {
        width: clamp(195px, 22vw, 245px);
    }

    .brand-card-certifications {
        min-height: 0;
        padding-top: 22px;

        display: block;
    }

    .brand-card-certifications-label {
        position: static;
        transform: none;
    }

    .brand-certification-logos {
        margin-top: 18px;
        justify-content: center;
        gap: 34px;
    }

    .certification-badge {
        width: 148px;
        height: 80px;
    }

    .certification-badge-ecocert img {
        width: 116px;
        max-height: 50px;
    }

    .certification-badge-vegan img {
        width: 124px;
        max-height: 56px;
    }

    .certification-badge-usda img {
        width: 132px;
        max-height: 54px;
    }

}


/* =========================================================
   BRAND CARD — SMALL TABLET
========================================================= */

@media (max-width: 850px) {

    .brands-intro {
        grid-template-columns: 1fr;
        gap: 34px;
        align-items: start;
    }

    .brands-intro-copy {
        max-width: 520px;
        padding-bottom: 0;
    }

    .brand-card-content {
        grid-template-columns:
            minmax(190px, 0.72fr)
            minmax(0, 1fr);

        gap: 34px 48px;
        align-items: start;
    }

    .brand-card-identity {
        grid-column: 1;
        grid-row: 1;

        min-height: 190px;
    }

    .brand-card-categories {
        grid-column: 1;
        grid-row: 2;

        min-height: 0;
        padding-left: 0;
        padding-top: 24px;

        border-left: 0;
        border-top: 1px solid rgba(245, 242, 235, 0.14);
    }

    .brand-card-info {
        grid-column: 2;
        grid-row: 1 / span 2;

        min-height: 0;
        justify-content: flex-start;
        padding-top: 10px;
    }

    .brand-card-certifications {
        display: block;
    }

    .brand-certification-logos {
        margin-top: 18px;
        justify-content: center;
        gap: 28px;
    }

    .certification-badge {
        width: 138px;
        height: 74px;
    }

}


/* =========================================================
   BRANDS — MOBILE
========================================================= */

@media (max-width: 700px) {

    .brands-section {
        scroll-margin-top: 68px;
        min-height: calc(100svh - 68px);

        padding:
            28px
            var(--page-padding)
            96px;
    }

    .brands-topline {
        margin-bottom: 46px;
    }

    .brands-number,
    .brands-label {
        font-size: 9px;
    }

    .brands-intro {
        display: block;
        margin-bottom: 54px;
    }

    .brands-heading h2 {
        font-size: clamp(52px, 14vw, 74px);
        line-height: 0.92;
    }

    .brands-intro-copy {
        max-width: 100%;
        padding-top: 32px;
    }

    .brand-card {
        min-height: 0;

        padding:
            24px
            22px
            28px;
    }

    .brand-card-status {
        max-width: 190px;

        text-align: right;
        line-height: 1.5;
    }

    .brand-card-content {
        margin-top: 38px;
        margin-bottom: 36px;

        display: block;
    }

    .brand-card-identity,
    .brand-card-categories,
    .brand-card-info {
        min-height: 0;
    }

    .brand-card-identity {
        justify-content: flex-start;
    }

    .jgo-brand-logo {
        width: min(225px, 70vw);
    }

    .brand-card-categories {
        margin-top: 36px;
        padding-top: 24px;
        padding-left: 0;

        border-top: 1px solid rgba(245, 242, 235, 0.14);
        border-left: 0;
    }

    .brand-card-category-list {
        margin-top: 15px;
    }

    .brand-card-info {
        max-width: 100%;

        margin-top: 36px;
        padding-top: 0;
    }

    .brand-card-actions {
        margin-top: 24px;
        align-items: flex-start;
    }

    .brand-card-link {
        margin-top: 0;
    }

    .brand-card-certifications {
        padding-top: 22px;

        display: block;
    }

    .brand-certification-logos {
        margin-top: 18px;

        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 14px;

        width: 100%;
        justify-items: center;
    }

    .certification-badge {
        width: 100%;
        min-width: 0;
        height: 76px;
        padding: 6px;
    }

    .certification-badge-ecocert img {
        width: min(104px, 100%);
        max-height: 46px;
    }

    .certification-badge-vegan img {
        width: min(110px, 100%);
        max-height: 52px;
    }

    .certification-badge-usda img {
        width: min(116px, 100%);
        max-height: 50px;
    }

}


/* =========================================================
   BRANDS — NARROW MOBILE
========================================================= */

@media (max-width: 430px) {

    .brand-card-top {
        align-items: flex-start;
        gap: 18px;
    }

    .brand-card-status {
        max-width: 160px;
        font-size: 8px;
    }

    .brand-certification-logos {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .certification-badge {
        height: 64px;
    }

}


/* =========================================================
   04 — PRODUCTS
========================================================= */

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.products-section {
    position: relative;
    overflow: hidden;

    scroll-margin-top: 76px;

    padding:
        30px
        var(--page-padding)
        clamp(110px, 10vw, 160px);

    background: var(--gt-ivory);
    color: var(--gt-ink);
}

.products-topline {
    padding-bottom: 20px;
    margin-bottom: clamp(54px, 5.5vw, 82px);

    display: flex;
    align-items: center;
    justify-content: space-between;

    border-bottom: 1px solid var(--gt-line);
}

.products-number,
.products-label {
    font-family: var(--sans);
    font-size: 10px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.16em;
}

.products-number {
    color: rgba(23, 32, 27, 0.62);
}

.products-label {
    color: var(--gt-green);
}

.products-intro {
    margin-bottom: clamp(54px, 6vw, 88px);

    display: grid;
    grid-template-columns:
        minmax(0, 1.15fr)
        minmax(280px, 0.65fr);

    gap: clamp(60px, 9vw, 150px);
    align-items: end;
}

.products-heading h2 {
    max-width: 850px;

    font-family: var(--display);
    font-size: clamp(62px, 7vw, 112px);
    font-weight: 400;
    line-height: 0.9;
    letter-spacing: -0.05em;
}

.products-heading h2 span {
    display: block;
}

.products-title-accent {
    margin-top: 0.08em;
    color: var(--gt-green);
    font-style: italic;
}

.products-intro-copy {
    max-width: 430px;
    padding-bottom: 8px;
}

.products-intro-copy p {
    color: var(--gt-grey);
    font-size: clamp(14px, 1vw, 16px);
    line-height: 1.85;
}


/* PRODUCT FILTERS */

.products-filters {
    margin-bottom: clamp(42px, 4vw, 62px);
    border-top: 1px solid var(--gt-line);
    border-bottom: 1px solid var(--gt-line);
}

.product-filter-row {
    min-height: 66px;

    display: grid;
    grid-template-columns: minmax(130px, 0.18fr) 1fr;
    gap: clamp(24px, 4vw, 64px);
    align-items: center;
}

.product-filter-row + .product-filter-row {
    border-top: 1px solid rgba(27, 49, 38, 0.09);
}

.product-filter-label {
    color: rgba(23, 32, 27, 0.52);
    font-family: var(--sans);
    font-size: 8px;
    font-weight: 600;
    letter-spacing: 0.17em;
}

.product-filter-options {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px clamp(22px, 2.6vw, 42px);
}

.product-filter-button {
    position: relative;
    padding: 23px 0 21px;

    border: 0;
    background: transparent;

    color: rgba(23, 32, 27, 0.54);
    font-family: var(--sans);
    font-size: 9px;
    font-weight: 600;
    line-height: 1.35;
    letter-spacing: 0.10em;

    cursor: pointer;

    transition:
        color 0.25s ease,
        opacity 0.25s ease;
}

.product-filter-button::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 14px;
    height: 1px;
    background: var(--gt-green);
    transform: scaleX(0);
    transform-origin: right center;
    transition: transform 0.35s cubic-bezier(.2, .8, .2, 1);
}

.product-filter-button:hover,
.product-filter-button.is-active {
    color: var(--gt-green);
}

.product-filter-button.is-active::after {
    transform: scaleX(1);
    transform-origin: left center;
}

.product-filter-button:focus-visible {
    outline: 1px solid var(--gt-green);
    outline-offset: 5px;
}


/* PRODUCT GRID */

.products-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(28px, 2.8vw, 46px) clamp(18px, 2vw, 34px);
    align-items: stretch;
}

.product-card {
    min-width: 0;
    height: 100%;
    padding: 0;

    display: flex;
    flex-direction: column;
    align-items: stretch;

    border: 0;
    background: transparent;
    color: var(--gt-ink);
    text-align: left;

    cursor: pointer;
}

.product-card-media {
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 5;
    overflow: hidden;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: clamp(24px, 2.6vw, 40px);

    background: #ffffff;
    border: 1px solid rgba(27, 49, 38, 0.09);
}

.product-card-image {
    position: absolute;
    inset: clamp(24px, 2.6vw, 40px);

    width: calc(100% - clamp(48px, 5.2vw, 80px));
    height: calc(100% - clamp(48px, 5.2vw, 80px));

    display: block;
    object-fit: contain;

    transition:
        opacity 0.42s cubic-bezier(.2, .8, .2, 1),
        transform 0.55s cubic-bezier(.2, .8, .2, 1);
}

.product-card-image-front {
    opacity: 1;
}

.product-card-image-back {
    opacity: 0;
}

.product-card-name {
    padding: 18px 2px 0;
    min-height: 5.4em;

    display: block;

    color: var(--gt-ink);
    font-family: var(--sans);
    font-size: clamp(12px, 0.9vw, 14px);
    font-weight: 500;
    line-height: 1.55;
    letter-spacing: -0.01em;
}

.product-card:focus-visible {
    outline: 1px solid var(--gt-green);
    outline-offset: 8px;
}

.product-card:hover .product-card-name {
    color: var(--gt-green);
}

@media (hover: hover) and (pointer: fine) {
    .product-card.has-back:hover .product-card-image-front {
        opacity: 0;
        transform: scale(0.985);
    }

    .product-card.has-back:hover .product-card-image-back {
        opacity: 1;
        transform: scale(1.015);
    }

    .product-card:not(.has-back):hover .product-card-image-front {
        transform: scale(1.025);
    }
}


/* PRODUCT MODAL */

body.product-modal-open {
    overflow: hidden;
}

.product-modal {
    position: fixed;
    z-index: 2000;
    inset: 0;

    display: grid;
    place-items: center;

    visibility: hidden;
    opacity: 0;

    transition:
        opacity 0.3s ease,
        visibility 0.3s ease;
}

.product-modal.is-open {
    visibility: visible;
    opacity: 1;
}

.product-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(10, 25, 19, 0.74);
    backdrop-filter: blur(9px);
    -webkit-backdrop-filter: blur(9px);
}

.product-modal-dialog {
    position: relative;
    z-index: 1;

    width: min(1180px, calc(100vw - 56px));
    height: min(820px, calc(100svh - 56px));
    max-height: none;

    display: grid;
    grid-template-columns: minmax(360px, 0.88fr) minmax(0, 1.12fr);

    overflow: hidden;

    background: var(--gt-warm-white);
    box-shadow: 0 30px 90px rgba(5, 20, 14, 0.28);

    transform: translateY(18px) scale(0.99);
    transition: transform 0.35s cubic-bezier(.2, .8, .2, 1);
}

.product-modal.is-open .product-modal-dialog {
    transform: translateY(0) scale(1);
}

.product-modal-close {
    position: absolute;
    z-index: 3;
    top: 20px;
    right: 22px;

    width: 42px;
    height: 42px;

    display: grid;
    place-items: center;

    border: 1px solid rgba(27, 49, 38, 0.16);
    border-radius: 50%;
    background: rgba(247, 244, 237, 0.86);
    color: var(--gt-green);

    font-size: 26px;
    font-weight: 300;
    line-height: 1;

    cursor: pointer;

    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.product-modal-close:hover {
    background: var(--gt-green);
    color: var(--gt-white);
}

.product-modal-close:focus-visible {
    outline: 2px solid var(--gt-green);
    outline-offset: 4px;
}

.product-modal-media {
    position: relative;
    min-width: 0;
    min-height: 0;
    height: 100%;

    display: flex;
    align-items: center;
    justify-content: center;

    padding:
        clamp(42px, 4vw, 62px)
        clamp(34px, 4vw, 56px)
        74px;

    background: #ffffff;
    border-right: 1px solid rgba(27, 49, 38, 0.10);
}

.product-modal-media img {
    display: block;

    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;

    object-fit: contain;
    object-position: center;
}

.product-modal-image-switcher {
    position: absolute;
    left: 50%;
    bottom: 22px;

    display: flex;
    align-items: center;
    gap: 22px;

    transform: translateX(-50%);
}

.product-modal-image-switcher[hidden] {
    display: none;
}

.product-modal-image-button {
    position: relative;
    padding: 9px 0;

    border: 0;
    background: transparent;

    color: rgba(23, 32, 27, 0.48);
    font-family: var(--sans);
    font-size: 8px;
    font-weight: 600;
    letter-spacing: 0.14em;

    cursor: pointer;
}

.product-modal-image-button::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 3px;
    height: 1px;
    background: var(--gt-green);
    transform: scaleX(0);
    transition: transform 0.25s ease;
}

.product-modal-image-button.is-active {
    color: var(--gt-green);
}

.product-modal-image-button.is-active::after {
    transform: scaleX(1);
}

.product-modal-content {
    min-width: 0;
    min-height: 0;
    height: 100%;

    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;

    padding:
        clamp(48px, 5vw, 70px)
        clamp(40px, 4.5vw, 68px)
        clamp(52px, 5vw, 76px);

    scrollbar-width: thin;
    scrollbar-color: rgba(27, 49, 38, 0.28) transparent;
}

.product-modal-content::-webkit-scrollbar {
    width: 6px;
}

.product-modal-content::-webkit-scrollbar-track {
    background: transparent;
}

.product-modal-content::-webkit-scrollbar-thumb {
    background: rgba(27, 49, 38, 0.22);
    border-radius: 999px;
}

.product-modal-content::-webkit-scrollbar-thumb:hover {
    background: rgba(27, 49, 38, 0.38);
}

.product-modal-brand {
    display: block;
    margin-bottom: 22px;

    color: var(--gt-green);
    font-family: var(--sans);
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.product-modal-content h3 {
    max-width: 650px;

    color: var(--gt-ink);
    font-family: var(--display);
    font-size: clamp(36px, 3.2vw, 54px);
    font-weight: 400;
    line-height: 1.02;
    letter-spacing: -0.035em;
}


.product-modal-code {
    width: fit-content;

    margin-top: 20px;
    padding: 8px 12px;

    display: inline-flex;
    align-items: center;
    gap: 10px;

    background: rgba(27, 49, 38, 0.055);
    border: 1px solid rgba(27, 49, 38, 0.12);

    color: var(--gt-green);
    font-family: var(--sans);
    line-height: 1;
}

.product-modal-code-label {
    color: rgba(23, 53, 42, 0.62);

    font-size: 8px;
    font-weight: 600;
    letter-spacing: 0.12em;
}

.product-modal-code strong {
    color: var(--gt-green);

    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.11em;
}

.product-modal-meta {
    margin-top: 20px;

    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;

    color: var(--gt-grey);
    font-family: var(--sans);
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.product-modal-meta-divider {
    width: 24px;
    height: 1px;
    background: rgba(27, 49, 38, 0.32);
}

.product-modal-rule {
    margin: 34px 0 32px;
    height: 1px;
    background: var(--gt-line);
}

.product-modal-description {
    max-width: 660px;

    color: #555d58;
    font-family: var(--sans);
    font-size: 13px;
    line-height: 1.82;
}

.product-description-paragraph {
    margin: 0;

    color: #555d58;
    font: inherit;
    line-height: inherit;
    white-space: pre-line;
}

.product-description-paragraph + .product-description-paragraph {
    margin-top: 18px;
}

.product-description-heading {
    margin: 34px 0 12px;

    color: var(--gt-ink);
    font-family: var(--sans);
    font-size: 13px;
    font-weight: 700;
    line-height: 1.45;
    letter-spacing: 0.015em;
}

.product-description-heading:first-child {
    margin-top: 0;
}

.product-description-heading + .product-description-paragraph {
    margin-top: 0;
}


.product-modal-actions {
    margin-top: 40px;
    padding-top: 30px;

    display: flex;
    justify-content: center;

    border-top: 1px solid var(--gt-line);
}

.product-quote-button {
    position: relative;

    min-width: 230px;
    height: 50px;
    padding: 0 48px 0 24px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    overflow: hidden;
    isolation: isolate;

    background: var(--gt-green);
    border: 1px solid var(--gt-green);

    color: var(--gt-ivory);
    font-family: var(--sans);
    font-size: 9px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.14em;
    text-align: center;

    transition:
        color 0.28s ease,
        border-color 0.28s ease,
        transform 0.28s ease;
}

.product-quote-button::before {
    content: "";

    position: absolute;
    z-index: -1;
    inset: 0;

    background: var(--gt-ivory);

    transform: scaleX(0);
    transform-origin: left center;

    transition: transform 0.45s cubic-bezier(.22, 1, .36, 1);
}

.product-quote-button::after {
    content: "→";

    position: absolute;
    right: 18px;
    top: 50%;

    font-size: 16px;
    font-weight: 400;
    line-height: 1;

    transform: translateY(-50%);
    transition: transform 0.28s ease;
}

.product-quote-button:hover {
    color: var(--gt-green);
    border-color: rgba(27, 49, 38, 0.65);
}

.product-quote-button:hover::before {
    transform: scaleX(1);
}

.product-quote-button:hover::after {
    transform: translate(4px, -50%);
}

.product-quote-button:focus-visible {
    outline: 2px solid var(--gt-green);
    outline-offset: 4px;
}


/* PRODUCTS — TABLET */

@media (max-width: 1050px) {

    .products-intro {
        grid-template-columns: 1fr 0.72fr;
        gap: 60px;
    }

    .products-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 42px 28px;
    }

    .product-card-media {
        aspect-ratio: 1 / 1.12;
    }

    .product-card-name {
        min-height: 4.9em;
        font-size: 13px;
    }

    .product-modal-dialog {
        width: min(930px, calc(100vw - 40px));
        height: min(780px, calc(100svh - 40px));

        grid-template-columns: minmax(310px, 0.82fr) minmax(0, 1.18fr);
    }

    .product-modal-media {
        min-height: 0;
        height: 100%;

        padding: 46px 34px 68px;
    }

}


/* PRODUCTS — MOBILE */

@media (max-width: 700px) {

    .products-section {
        scroll-margin-top: 68px;

        padding:
            28px
            var(--page-padding)
            96px;
    }

    .products-topline {
        margin-bottom: 46px;
    }

    .products-number,
    .products-label {
        font-size: 9px;
    }

    .products-intro {
        display: block;
        margin-bottom: 44px;
    }

    .products-heading h2 {
        font-size: clamp(52px, 14vw, 74px);
        line-height: 0.92;
    }

    .products-intro-copy {
        max-width: 100%;
        padding-top: 32px;
        padding-bottom: 0;
    }

    .products-filters {
        margin-bottom: 38px;
    }

    .product-filter-row {
        min-height: 0;
        padding: 17px 0 12px;

        display: block;
    }

    .product-filter-label {
        display: block;
        margin-bottom: 8px;
    }

    .product-filter-options {
        margin-right: calc(var(--page-padding) * -1);
        padding-right: var(--page-padding);

        flex-wrap: nowrap;
        gap: 24px;

        overflow-x: auto;
        overscroll-behavior-inline: contain;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

    .product-filter-options::-webkit-scrollbar {
        display: none;
    }

    .product-filter-button {
        flex: 0 0 auto;
        padding: 12px 0 15px;
        white-space: nowrap;
    }

    .product-filter-button::after {
        bottom: 8px;
    }

    .products-grid {
        grid-template-columns: 1fr;
        gap: 42px;
    }

    .product-card-media {
        aspect-ratio: 1 / 1.08;
        padding: 30px;
    }

    .product-card-image {
        inset: 30px;
        width: calc(100% - 60px);
        height: calc(100% - 60px);
    }

    .product-card-name {
        min-height: 0;
        padding-top: 16px;
        font-size: 13px;
    }

    .product-modal {
        place-items: stretch;
    }

    .product-modal-dialog {
        width: 100%;
        height: 100svh;
        max-height: none;

        display: block;
        overflow-y: auto;

        transform: translateY(18px);
    }

    .product-modal.is-open .product-modal-dialog {
        transform: translateY(0);
    }

    .product-modal-close {
        position: fixed;
        top: 16px;
        right: 16px;
    }

    .product-modal-media {
        min-height: 54svh;
        height: 54svh;

        padding: 58px 28px 58px;

        border-right: 0;
        border-bottom: 1px solid rgba(27, 49, 38, 0.10);
    }

    .product-modal-media img {
        width: auto;
        height: auto;
        max-width: 100%;
        max-height: 100%;
    }

    .product-modal-image-switcher {
        bottom: 16px;
    }

    .product-modal-content {
        overflow: visible;

        padding:
            42px
            var(--page-padding)
            72px;
    }

    .product-modal-brand {
        margin-bottom: 18px;
    }

    .product-modal-content h3 {
        font-size: clamp(36px, 11vw, 50px);
        line-height: 1.02;
    }

    .product-modal-meta {
        margin-top: 24px;
    }

    .product-modal-rule {
        margin: 28px 0;
    }

    .product-modal-description {
        font-size: 13px;
        line-height: 1.8;
    }

    .product-description-heading {
        margin-top: 30px;
        margin-bottom: 11px;
        font-size: 13px;
    }


    .product-modal-actions {
        margin-top: 24px;
        padding-top: 26px;
    }

    .product-quote-button {
        width: 100%;
        min-width: 0;
        height: 52px;
    }

}


@media (prefers-reduced-motion: reduce) {
    .product-card-image,
    .product-modal,
    .product-modal-dialog,
    .product-filter-button::after {
        transition: none !important;
    }
}



@media (prefers-reduced-motion: reduce) {
    .product-quote-button,
    .product-quote-button::before,
    .product-quote-button::after {
        transition: none;
    }
}


/* =========================================================
   05 — B2B
========================================================= */

.b2b-section {
    position: relative;
    overflow: hidden;

    scroll-margin-top: 76px;
    min-height: calc(100svh - 76px);

    padding:
        28px
        var(--page-padding)
        clamp(48px, 5vw, 70px);

    background:
        linear-gradient(
            135deg,
            #0e271d 0%,
            #153428 52%,
            #214438 100%
        );

    color: var(--gt-ivory);
}

.b2b-section::before {
    content: "";

    position: absolute;
    right: -14vw;
    top: 14%;

    width: min(48vw, 720px);
    aspect-ratio: 1;

    border: 1px solid rgba(245, 242, 235, 0.07);
    border-radius: 50%;

    pointer-events: none;
}

.b2b-section::after {
    content: "";

    position: absolute;
    left: 33%;
    bottom: -36vw;

    width: min(58vw, 820px);
    aspect-ratio: 1;

    background:
        radial-gradient(
            circle,
            rgba(232, 226, 216, 0.09) 0%,
            rgba(232, 226, 216, 0.025) 43%,
            rgba(232, 226, 216, 0) 70%
        );

    pointer-events: none;
}


/* TOP LINE */

.b2b-topline {
    position: relative;
    z-index: 2;

    padding-bottom: 18px;
    margin-bottom: clamp(38px, 4vw, 54px);

    display: flex;
    align-items: center;
    justify-content: space-between;

    border-bottom: 1px solid rgba(245, 242, 235, 0.16);
}

.b2b-number,
.b2b-label {
    font-family: var(--sans);
    font-size: 10px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.16em;
}

.b2b-number {
    color: rgba(245, 242, 235, 0.48);
}

.b2b-label {
    color: rgba(245, 242, 235, 0.88);
}


/* INTRO */

.b2b-intro {
    position: relative;
    z-index: 2;

    display: grid;
    grid-template-columns:
        minmax(0, 1.14fr)
        minmax(300px, 0.66fr);

    gap: clamp(70px, 9vw, 150px);
    align-items: end;
}

.b2b-heading h2 {
    max-width: 850px;

    font-family: var(--display);
    font-size: clamp(60px, 6.5vw, 104px);
    font-weight: 400;
    line-height: 0.89;
    letter-spacing: -0.05em;
}

.b2b-heading h2 span {
    display: block;
}

.b2b-title-accent {
    margin-top: 0.08em;

    color: #d8d0bf;

    font-style: italic;
}

.b2b-intro-copy {
    max-width: 470px;
    padding-bottom: 8px;
}

.b2b-eyebrow {
    display: block;

    margin-bottom: 18px;

    color: rgba(245, 242, 235, 0.52);

    font-size: 8px;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 0.17em;
}

.b2b-intro-copy p {
    color: rgba(245, 242, 235, 0.72);

    font-size: clamp(14px, 1vw, 16px);
    line-height: 1.9;
}


/* PARTNERSHIP CARDS */

.b2b-partnership-grid {
    position: relative;
    z-index: 2;

    margin-top: clamp(42px, 4.5vw, 60px);

    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    border-top: 1px solid rgba(245, 242, 235, 0.17);
    border-bottom: 1px solid rgba(245, 242, 235, 0.17);
}

.b2b-partnership-card {
    min-height: 220px;
    padding:
        clamp(30px, 2.7vw, 38px)
        clamp(24px, 2.8vw, 42px)
        clamp(30px, 2.7vw, 38px);

    display: flex;
    flex-direction: column;
    justify-content: center;

    border-right: 1px solid rgba(245, 242, 235, 0.14);

    transition:
        background 0.35s ease,
        transform 0.35s ease;
}

.b2b-partnership-card:first-child {
    padding-left: 0;
}

.b2b-partnership-card:last-child {
    padding-right: 0;
    border-right: 0;
}


.b2b-card-content {
    margin-top: 0;
}

.b2b-card-content h3 {
    max-width: 340px;

    font-family: var(--display);
    font-size: clamp(30px, 2.7vw, 42px);
    font-weight: 400;
    line-height: 1.03;
    letter-spacing: -0.025em;
}

.b2b-card-content p {
    max-width: 370px;

    margin-top: 22px;

    color: rgba(245, 242, 235, 0.63);

    font-size: 13px;
    line-height: 1.85;
}

@media (hover: hover) and (pointer: fine) {
    .b2b-partnership-card:hover {
        background: rgba(245, 242, 235, 0.045);
    }
}


/* BOTTOM CTA */

.b2b-bottom {
    position: relative;
    z-index: 2;

    width: min(100%, 1080px);
    margin-top: clamp(34px, 3.8vw, 48px);

    display: grid;
    grid-template-columns:
        minmax(0, 610px)
        minmax(260px, 320px);

    gap: clamp(36px, 4vw, 56px);
    align-items: center;
}

.b2b-bottom-copy {
    max-width: 610px;
}

.b2b-bottom-kicker {
    display: block;

    margin-bottom: 15px;

    color: rgba(245, 242, 235, 0.48);

    font-size: 8px;
    font-weight: 600;
    letter-spacing: 0.17em;
}

.b2b-bottom-copy p {
    max-width: 560px;

    color: rgba(245, 242, 235, 0.73);

    font-family: var(--display);
    font-size: clamp(22px, 1.75vw, 29px);
    font-weight: 400;
    line-height: 1.35;
}

.b2b-cta {
    position: relative;

    justify-self: start;

    width: min(100%, 320px);
    min-height: 54px;
    padding: 0 52px 0 24px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    overflow: hidden;
    isolation: isolate;

    background: var(--gt-ivory);
    border: 1px solid rgba(245, 242, 235, 0.82);

    color: var(--gt-green);

    font-family: var(--sans);
    font-size: 9px;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: 0.13em;
    text-align: center;

    transition:
        color 0.28s ease,
        border-color 0.28s ease;
}

.b2b-cta::before {
    content: "";

    position: absolute;
    z-index: -1;
    inset: 0;

    background: var(--gt-green);

    transform: scaleX(0);
    transform-origin: left center;

    transition: transform 0.5s cubic-bezier(.22, 1, .36, 1);
}

.b2b-cta::after {
    content: "→";

    position: absolute;
    right: 19px;
    top: 50%;

    font-size: 16px;
    font-weight: 400;
    line-height: 1;

    transform: translateY(-50%);

    transition:
        color 0.28s ease,
        transform 0.28s ease;
}

.b2b-cta:hover {
    color: var(--gt-ivory);
    border-color: rgba(245, 242, 235, 0.62);
}

.b2b-cta:hover::before {
    transform: scaleX(1);
}

.b2b-cta:hover::after {
    transform: translate(4px, -50%);
}

.b2b-cta:focus-visible {
    outline: 2px solid var(--gt-ivory);
    outline-offset: 5px;
}


/* =========================================================
   B2B — TABLET
========================================================= */

@media (max-width: 1050px) {

    .b2b-intro {
        grid-template-columns: 1fr 0.72fr;
        gap: 60px;
    }

    .b2b-partnership-card {
        min-height: 220px;
        padding:
            30px
            25px
            34px;
    }

    .b2b-partnership-card:first-child {
        padding-left: 0;
    }

    .b2b-partnership-card:last-child {
        padding-right: 0;
    }

    .b2b-card-content {
        margin-top: 0;
    }

    .b2b-card-content h3 {
        font-size: clamp(28px, 3.3vw, 38px);
    }

    .b2b-bottom {
        width: min(100%, 920px);
        grid-template-columns: minmax(0, 1fr) minmax(240px, 300px);
        gap: 36px;
    }

}


/* =========================================================
   B2B — SMALL TABLET
========================================================= */

@media (max-width: 850px) {

    .b2b-intro {
        grid-template-columns: 1fr;
        gap: 42px;
        align-items: start;
    }

    .b2b-intro-copy {
        max-width: 570px;
        padding-bottom: 0;
    }

    .b2b-partnership-grid {
        grid-template-columns: 1fr;
    }

    .b2b-partnership-card,
    .b2b-partnership-card:first-child,
    .b2b-partnership-card:last-child {
        min-height: 0;
        padding: 30px 0 34px;

        border-right: 0;
        border-bottom: 1px solid rgba(245, 242, 235, 0.14);
    }

    .b2b-partnership-card:last-child {
        border-bottom: 0;
    }

    .b2b-card-content {
        margin-top: 0;
    }

    .b2b-card-content h3,
    .b2b-card-content p {
        max-width: 620px;
    }

    .b2b-bottom {
        grid-template-columns: 1fr;
        gap: 34px;
        align-items: start;
    }

    .b2b-cta {
        justify-self: start;
    }

}


/* =========================================================
   B2B — MOBILE
========================================================= */

@media (max-width: 700px) {

    .b2b-section {
        scroll-margin-top: 68px;

        padding:
            28px
            var(--page-padding)
            76px;
    }

    .b2b-topline {
        margin-bottom: 48px;
    }

    .b2b-number,
    .b2b-label {
        font-size: 9px;
    }

    .b2b-heading h2 {
        font-size: clamp(52px, 14vw, 74px);
        line-height: 0.92;
    }

    .b2b-intro {
        gap: 34px;
    }

    .b2b-eyebrow {
        margin-bottom: 14px;
    }

    .b2b-intro-copy p {
        font-size: 14px;
        line-height: 1.85;
    }

    .b2b-partnership-grid {
        margin-top: 58px;
    }

    .b2b-partnership-card,
    .b2b-partnership-card:first-child,
    .b2b-partnership-card:last-child {
        padding: 26px 0 30px;
    }

    .b2b-card-content {
        margin-top: 0;
    }

    .b2b-card-content h3 {
        font-size: 34px;
    }

    .b2b-card-content p {
        margin-top: 18px;

        font-size: 13px;
        line-height: 1.8;
    }

    .b2b-bottom {
        margin-top: 48px;
    }

    .b2b-bottom-copy p {
        font-size: 25px;
    }

    .b2b-cta {
        width: 100%;
        max-width: none;
        min-height: 54px;

        justify-self: stretch;
    }

}


@media (prefers-reduced-motion: reduce) {
    .b2b-partnership-card,
    .b2b-cta,
    .b2b-cta::before,
    .b2b-cta::after {
        transition: none !important;
    }
}


/* B2B — remove legacy card numbering/arrows completely */
.b2b-card-top,
.b2b-card-index,
.b2b-card-arrow {
    display: none !important;
}


/* =========================================================
   06 — CONTACT
========================================================= */

.contact-section {
    position: relative;

    scroll-margin-top: 76px;
    min-height: calc(100svh - 76px);

    padding:
        24px
        var(--page-padding)
        clamp(44px, 4vw, 64px);

    overflow: hidden;

    background: var(--gt-ivory);
    color: var(--gt-ink);
}

.contact-section::after {
    content: "";

    position: absolute;
    right: -20vw;
    bottom: -28vw;

    width: 54vw;
    aspect-ratio: 1;

    border: 1px solid rgba(27, 49, 38, 0.06);
    border-radius: 50%;

    pointer-events: none;
}

.contact-topline {
    position: relative;
    z-index: 2;

    padding-bottom: 16px;
    margin-bottom: clamp(28px, 3vw, 40px);

    display: flex;
    align-items: center;
    justify-content: space-between;

    border-bottom: 1px solid var(--gt-line);
}

.contact-number,
.contact-label {
    font-family: var(--sans);
    font-size: 10px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.16em;
}

.contact-number {
    color: rgba(23, 32, 27, 0.50);
}

.contact-label {
    color: var(--gt-green);
}

.contact-layout {
    position: relative;
    z-index: 2;

    display: grid;
    grid-template-columns:
        minmax(0, 0.86fr)
        minmax(520px, 1.14fr);

    gap: clamp(70px, 9vw, 150px);
    align-items: start;
}

.contact-intro h2 {
    max-width: 690px;

    font-family: var(--display);
    font-size: clamp(54px, 5.35vw, 86px);
    font-weight: 400;
    line-height: 0.91;
    letter-spacing: -0.05em;
}

.contact-intro h2 span {
    display: block;
}

.contact-title-accent {
    margin-top: 0.08em;

    color: var(--gt-green);

    font-style: italic;
}

.contact-intro-text {
    max-width: 500px;

    margin-top: clamp(22px, 2.3vw, 32px);

    color: var(--gt-grey);

    font-size: clamp(14px, 1vw, 16px);
    line-height: 1.9;
}

.contact-direct {
    margin-top: clamp(26px, 2.6vw, 36px);
    padding-top: 18px;

    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px 34px;

    border-top: 1px solid var(--gt-line);
}

.contact-detail-item {
    min-width: 0;
}

.contact-detail-item + .contact-detail-item {
    margin-top: 0;
    padding-top: 0;

    border-top: 0;
}

.contact-direct-label {
    display: block;

    margin-bottom: 11px;

    color: rgba(23, 32, 27, 0.50);

    font-size: 8px;
    font-weight: 600;
    letter-spacing: 0.17em;
}

.contact-email {
    display: inline-block;

    color: var(--gt-green);

    font-family: var(--sans);
    font-size: clamp(15px, 1.1vw, 18px);
    font-weight: 500;
    line-height: 1.45;
    letter-spacing: 0.005em;

    border-bottom: 1px solid rgba(23, 53, 42, 0.25);

    transition:
        border-color 0.25s ease,
        color 0.25s ease;
}

.contact-email:hover {
    color: var(--gt-logo);
    border-color: var(--gt-logo);
}

.contact-address {
    margin: 0;

    display: flex;
    flex-direction: column;
    gap: 4px;

    color: var(--gt-ink);

    font-family: var(--sans);
    font-size: clamp(14px, 1vw, 17px);
    font-style: normal;
    font-weight: 500;
    line-height: 1.55;
    letter-spacing: 0;
}

.contact-phone-list {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 7px;
}

.contact-phone-list a {
    color: var(--gt-ink);

    font-family: var(--sans);
    font-size: clamp(14px, 1vw, 17px);
    font-weight: 500;
    line-height: 1.45;
    letter-spacing: 0.01em;

    border-bottom: 1px solid rgba(23, 53, 42, 0.18);

    transition:
        color 0.25s ease,
        border-color 0.25s ease;
}

.contact-phone-list a:hover {
    color: var(--gt-green);
    border-color: var(--gt-green);
}


.contact-socials {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.contact-social-link {
    width: fit-content;

    display: inline-flex;
    align-items: center;
    gap: 13px;

    color: var(--gt-ink);

    transition:
        color 0.25s ease,
        transform 0.25s ease;
}

.contact-social-icon {
    flex: 0 0 auto;

    width: 26px;
    height: 26px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(27, 49, 38, 0.18);
    border-radius: 50%;

    color: var(--gt-green);

    transition:
        border-color 0.25s ease,
        background 0.25s ease,
        color 0.25s ease;
}

.contact-social-icon svg {
    width: 14px;
    height: 14px;

    fill: none;
    stroke: currentColor;
    stroke-width: 1.5;
}

.contact-social-icon .social-icon-fill {
    fill: currentColor;
    stroke: none;
}

.contact-social-icon-x svg {
    stroke-width: 1.7;
}

.contact-social-icon-facebook svg {
    fill: currentColor;
    stroke: none;
}

.contact-social-text {
    display: flex;
    align-items: baseline;
    gap: 9px;

    font-family: var(--sans);
    line-height: 1.3;
}

.contact-social-text strong {
    color: var(--gt-ink);

    font-size: 13px;
    font-weight: 600;
}

.contact-social-text span {
    color: rgba(23, 32, 27, 0.58);

    font-size: 12px;
    font-weight: 400;
}

.contact-social-link:hover {
    color: var(--gt-green);
    transform: translateX(3px);
}

.contact-social-link:hover .contact-social-icon {
    background: var(--gt-green);
    border-color: var(--gt-green);
    color: var(--gt-ivory);
}

.contact-social-link:focus-visible {
    outline: 2px solid var(--gt-green);
    outline-offset: 5px;
}


.contact-form-wrap {
    padding:
        clamp(26px, 2.4vw, 36px)
        clamp(28px, 3vw, 44px)
        clamp(28px, 2.8vw, 40px);

    background: var(--gt-warm-white);
    border: 1px solid rgba(27, 49, 38, 0.12);
}

.contact-form {
    width: 100%;
}

.contact-form-row-two {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 28px;
}

.contact-form > .contact-form-row + .contact-form-row,
.contact-form > .contact-form-row + .contact-field,
.contact-form > .contact-field + .contact-field,
.contact-form > .contact-field + .contact-form-footer {
    margin-top: 30px;
}

/* Keep paired fields perfectly aligned within the same row. */
.contact-form-row-two > .contact-field + .contact-field {
    margin-top: 0;
}

.contact-field {
    min-width: 0;
}

.contact-field label {
    display: block;

    margin-bottom: 10px;

    color: rgba(23, 32, 27, 0.56);

    font-family: var(--sans);
    font-size: 8px;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 0.15em;
}

.contact-field input,
.contact-field textarea,
.contact-field select {
    width: 100%;

    border: 0;
    border-bottom: 1px solid rgba(27, 49, 38, 0.22);
    border-radius: 0;

    background: transparent;
    color: var(--gt-ink);

    font-family: var(--sans);
    font-size: 14px;
    line-height: 1.6;

    outline: none;

    transition:
        border-color 0.25s ease,
        background 0.25s ease;
}

.contact-field input,
.contact-field select {
    height: 46px;
}

.contact-field textarea {
    min-height: 105px;

    padding:
        12px 0
        14px;

    resize: vertical;
}

.contact-field input:focus,
.contact-field textarea:focus,
.contact-field select:focus {
    border-color: var(--gt-green);
}

.contact-field input[readonly] {
    color: var(--gt-green);
    cursor: default;
}

.contact-select-wrap {
    position: relative;
}

.contact-select-wrap::after {
    content: "⌄";

    position: absolute;
    right: 2px;
    top: 50%;

    color: var(--gt-green);
    font-size: 15px;

    transform: translateY(-56%);

    pointer-events: none;
}

.contact-field select {
    padding-right: 26px;

    appearance: none;
    -webkit-appearance: none;

    cursor: pointer;
}

.contact-product-field[hidden] {
    display: none;
}

.contact-honeypot {
    position: absolute !important;
    left: -9999px !important;

    width: 1px !important;
    height: 1px !important;

    overflow: hidden !important;
}

.contact-form-footer {
    margin-top: 34px;

    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        auto;

    gap: 32px;
    align-items: center;
}

.contact-privacy-note {
    max-width: 430px;

    color: rgba(23, 32, 27, 0.48);

    font-size: 10px;
    line-height: 1.65;
}

.contact-submit {
    position: relative;

    min-width: 220px;
    height: 52px;
    padding: 0 48px 0 22px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    overflow: hidden;
    isolation: isolate;

    border: 1px solid var(--gt-green);
    border-radius: 0;

    background: var(--gt-green);
    color: var(--gt-ivory);

    font-family: var(--sans);
    font-size: 9px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.13em;

    cursor: pointer;

    transition:
        color 0.28s ease,
        border-color 0.28s ease,
        opacity 0.28s ease;
}

.contact-submit::before {
    content: "";

    position: absolute;
    z-index: -1;
    inset: 0;

    background: var(--gt-ivory);

    transform: scaleX(0);
    transform-origin: left center;

    transition: transform 0.5s cubic-bezier(.22, 1, .36, 1);
}

.contact-submit::after {
    content: "→";

    position: absolute;
    right: 18px;
    top: 50%;

    font-size: 16px;
    font-weight: 400;
    line-height: 1;

    transform: translateY(-50%);

    transition:
        color 0.28s ease,
        transform 0.28s ease;
}

.contact-submit:hover {
    color: var(--gt-green);
}

.contact-submit:hover::before {
    transform: scaleX(1);
}

.contact-submit:hover::after {
    transform: translate(4px, -50%);
}

.contact-submit:focus-visible {
    outline: 2px solid var(--gt-green);
    outline-offset: 4px;
}

.contact-submit:disabled {
    opacity: 0.62;
    cursor: wait;
}

.contact-form-status {
    min-height: 22px;

    margin-top: 22px;

    font-size: 12px;
    line-height: 1.6;
}

.contact-form-status.is-success {
    color: var(--gt-green);
}

.contact-form-status.is-error {
    color: #9a3b32;
}

@media (max-width: 1050px) {

    .contact-layout {
        grid-template-columns:
            minmax(0, 0.76fr)
            minmax(470px, 1.24fr);

        gap: 55px;
    }

    .contact-form-wrap {
        padding: 34px;
    }

}

@media (max-width: 850px) {

    .contact-direct {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .contact-detail-item + .contact-detail-item {
        margin-top: 24px;
        padding-top: 20px;

        border-top: 1px solid rgba(27, 49, 38, 0.10);
    }

    .contact-layout {
        grid-template-columns: 1fr;
        gap: 58px;
    }

    .contact-intro-text,
    .contact-direct {
        max-width: 600px;
    }

    .contact-form-wrap {
        max-width: 720px;
    }

}

@media (max-width: 700px) {

    .contact-section {
        scroll-margin-top: 68px;

        padding:
            28px
            var(--page-padding)
            88px;
    }

    .contact-topline {
        margin-bottom: 48px;
    }

    .contact-number,
    .contact-label {
        font-size: 9px;
    }

    .contact-intro h2 {
        font-size: clamp(52px, 14vw, 74px);
        line-height: 0.93;
    }

    .contact-intro-text {
        margin-top: 32px;

        font-size: 14px;
        line-height: 1.85;
    }

    .contact-direct {
        margin-top: 40px;
    }

    .contact-form-wrap {
        padding:
            28px
            22px
            32px;
    }

    .contact-form-row-two {
        grid-template-columns: 1fr;
        gap: 26px;
    }

    .contact-form > .contact-form-row + .contact-form-row,
    .contact-form > .contact-form-row + .contact-field,
    .contact-form > .contact-field + .contact-field,
    .contact-form > .contact-field + .contact-form-footer {
        margin-top: 26px;
    }

    .contact-form-row-two > .contact-field + .contact-field {
        margin-top: 0;
    }

    .contact-form-footer {
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .contact-submit {
        width: 100%;
        min-width: 0;
    }

}

@media (prefers-reduced-motion: reduce) {
    .contact-submit,
    .contact-submit::before,
    .contact-submit::after,
    .contact-social-link,
    .contact-social-icon {
        transition: none !important;
    }
}


/* =========================================================
   FOOTER
========================================================= */

.site-footer {
    position: relative;

    padding:
        clamp(58px, 6vw, 86px)
        var(--page-padding)
        28px;

    overflow: hidden;

    background: #0b2118;
    color: var(--gt-ivory);
}

.site-footer::before {
    content: "";

    position: absolute;
    right: -18vw;
    top: -32vw;

    width: min(60vw, 820px);
    aspect-ratio: 1;

    border: 1px solid rgba(245, 242, 235, 0.055);
    border-radius: 50%;

    pointer-events: none;
}

.footer-main {
    position: relative;
    z-index: 2;

    display: grid;
    grid-template-columns:
        minmax(300px, 1.7fr)
        minmax(135px, 0.7fr)
        minmax(190px, 0.9fr)
        minmax(135px, 0.65fr);

    gap: clamp(44px, 6vw, 96px);
    align-items: start;
}

.footer-brand-block {
    max-width: 430px;
}

.footer-wordmark {
    width: fit-content;

    display: inline-flex;
    align-items: baseline;
    gap: 8px;

    color: var(--gt-ivory);

    font-family: var(--sans);
    font-size: clamp(25px, 2.3vw, 34px);
    font-weight: 500;
    line-height: 1;
    letter-spacing: 0.055em;
}

.footer-wordmark span:first-child {
    font-weight: 600;
}

.footer-wordmark span:last-child {
    color: rgba(245, 242, 235, 0.72);
    font-weight: 400;
}

.footer-exclusive {
    max-width: 390px;

    margin-top: 18px;

    color: rgba(245, 242, 235, 0.78);

    font-family: var(--sans);
    font-size: 9px;
    font-weight: 600;
    line-height: 1.6;
    letter-spacing: 0.12em;
}

.footer-tagline {
    max-width: 390px;

    margin-top: 10px;

    color: rgba(245, 242, 235, 0.48);

    font-family: var(--sans);
    font-size: 8px;
    font-weight: 600;
    line-height: 1.8;
    letter-spacing: 0.16em;
}

.footer-column {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.footer-column-label {
    margin-bottom: 21px;

    color: rgba(245, 242, 235, 0.40);

    font-family: var(--sans);
    font-size: 8px;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 0.16em;
}

.footer-column a {
    position: relative;

    width: fit-content;

    padding: 4px 0;

    color: rgba(245, 242, 235, 0.76);

    font-family: var(--sans);
    font-size: 11px;
    font-weight: 500;
    line-height: 1.55;
    letter-spacing: 0.035em;

    transition:
        color 0.25s ease,
        transform 0.25s ease;
}

.footer-column a + a {
    margin-top: 5px;
}

.footer-column a::after {
    content: "";

    position: absolute;
    left: 0;
    bottom: 2px;

    width: 100%;
    height: 1px;

    background: rgba(245, 242, 235, 0.55);

    transform: scaleX(0);
    transform-origin: right;

    transition: transform 0.35s cubic-bezier(.2, .8, .2, 1);
}

.footer-column a:hover {
    color: var(--gt-ivory);
}

.footer-column a:hover::after {
    transform: scaleX(1);
    transform-origin: left;
}

.footer-column a:focus-visible,
.footer-wordmark:focus-visible {
    outline: 1px solid var(--gt-ivory);
    outline-offset: 5px;
}

.footer-bottom {
    position: relative;
    z-index: 2;

    margin-top: clamp(52px, 6vw, 78px);
    padding-top: 22px;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;

    border-top: 1px solid rgba(245, 242, 235, 0.12);

    color: rgba(245, 242, 235, 0.40);

    font-family: var(--sans);
    font-size: 9px;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: 0.07em;
}


/* =========================================================
   FOOTER — TABLET
========================================================= */

@media (max-width: 1050px) {

    .footer-main {
        grid-template-columns:
            minmax(280px, 1.5fr)
            repeat(3, minmax(120px, 0.7fr));

        gap: 42px;
    }

}


/* =========================================================
   FOOTER — SMALL TABLET
========================================================= */

@media (max-width: 850px) {

    .footer-main {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(0, 1fr);

        gap: 46px 58px;
    }

    .footer-brand-block {
        grid-column: 1 / -1;
    }

}


/* =========================================================
   FOOTER — MOBILE
========================================================= */

@media (max-width: 700px) {

    .site-footer {
        padding:
            54px
            var(--page-padding)
            24px;
    }

    .footer-main {
        grid-template-columns: 1fr;
        gap: 38px;
    }

    .footer-brand-block {
        grid-column: auto;
    }

    .footer-exclusive {
        max-width: 330px;
        margin-top: 16px;
    }

    .footer-tagline {
        max-width: 330px;
        margin-top: 9px;
    }

    .footer-column-label {
        margin-bottom: 16px;
    }

    .footer-column a {
        font-size: 12px;
    }

    .footer-bottom {
        margin-top: 48px;

        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

}


@media (prefers-reduced-motion: reduce) {
    .footer-column a,
    .footer-column a::after {
        transition: none !important;
    }
}


/* =========================================================
   FINAL RESPONSIVE PASS
   Header · Hero · Tablet portrait · Mobile
========================================================= */

@media (max-width: 900px) {

    :root {
        --header-height: 72px;
    }

    .site-header,
    .site-header.scrolled {
        height: var(--header-height);
    }

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

    .brand {
        min-width: 0;
    }

    .brand-logo {
        width: clamp(150px, 23vw, 175px);
        max-height: 44px;
    }

    .desktop-nav {
        display: none;
    }

    .header-actions {
        gap: 16px;
    }

    .menu-toggle {
        display: block;
        position: relative;
        z-index: 2;
    }

    .menu-toggle span {
        transition:
            transform 0.28s ease,
            opacity 0.28s ease;
        transform-origin: center;
    }

    .menu-toggle[aria-expanded="true"] span:first-child {
        transform: translateY(4px) rotate(45deg);
    }

    .menu-toggle[aria-expanded="true"] span:last-child {
        transform: translateY(-4px) rotate(-45deg);
    }

    .mobile-menu {
        z-index: 950;

        padding:
            calc(var(--header-height) + 36px)
            var(--page-padding)
            30px;
    }

    .mobile-menu nav a {
        font-size: clamp(42px, 8vw, 62px);
    }

    .story-section,
    .brands-section,
    .products-section,
    .b2b-section,
    .contact-section {
        scroll-margin-top: 72px;
    }

}


@media (max-width: 850px) {

    /* Portrait tablets read better with the story in one column. */
    .story-grid {
        display: block;
    }

    .story-heading h2 {
        max-width: 720px;
    }

    .story-copy {
        max-width: 620px;
        padding-top: 54px;
    }

}


@media (max-width: 700px) {

    :root {
        --header-height: 68px;
        --page-padding: 24px;
    }

    .site-header,
    .site-header.scrolled {
        height: var(--header-height);
    }

    .site-header {
        padding-inline: var(--page-padding);
        gap: 12px;
    }

    .brand-logo {
        width: 150px;
        max-height: 40px;
    }

    .header-actions {
        gap: 12px;
    }

    .language-switcher {
        gap: 7px;
    }

    .language-button {
        font-size: 9px;
    }

    .language-divider {
        width: 13px;
    }

    .menu-toggle {
        width: 30px;
        height: 30px;
    }

    .menu-toggle span {
        width: 24px;
    }

    .mobile-menu {
        padding:
            calc(var(--header-height) + 28px)
            var(--page-padding)
            26px;
    }

    .mobile-menu nav a {
        padding: 12px 0;
        font-size: clamp(40px, 12vw, 54px);
        line-height: 1;
    }

    .mobile-menu-footer {
        gap: 8px 18px;
        flex-wrap: wrap;
    }

    .story-section,
    .brands-section,
    .products-section,
    .b2b-section,
    .contact-section {
        scroll-margin-top: 68px;
    }

    /* HERO */
    .hero {
        min-height: 100svh;

        padding:
            calc(var(--header-height) + 44px)
            var(--page-padding)
            46px;

        display: flex;
        align-items: center;
    }

    .hero-content {
        width: 100%;
        margin: 0;
    }

    .hero-eyebrow {
        max-width: 320px;
        margin-bottom: 30px;

        font-size: 8px;
        line-height: 1.75;
        letter-spacing: 0.17em;
    }

    .hero-title {
        max-width: 100%;

        font-size: clamp(50px, 13vw, 58px);
        line-height: 0.91;
        letter-spacing: -0.045em;
    }

    .hero-title-indent {
        margin-top: 0.12em;
        margin-left: 24px;
    }

    .hero-bottom {
        margin-top: 34px;
        gap: 26px;
    }

    .hero-description {
        max-width: 100%;

        font-size: 13px;
        line-height: 1.75;
    }

    .explore-link,
    .explore-link:hover {
        position: relative;
        left: auto;
        bottom: auto;

        width: min(100%, 260px);
        height: 50px;

        margin-top: 0;

        transform: none;
    }

    /* Keep product cards substantial, but avoid excessively tall images. */
    .product-card-media {
        max-height: 520px;
    }

    /* Modal close button stays safely inside phone safe-area. */
    .product-modal-close {
        top: max(14px, env(safe-area-inset-top));
        right: 14px;
    }

    /* Contact information remains readable on narrow screens. */
    .contact-email,
    .contact-address,
    .contact-phone-list a {
        overflow-wrap: anywhere;
    }

}


@media (max-width: 430px) {

    .brand-logo {
        width: 142px;
    }

    .hero {
        padding-top: calc(var(--header-height) + 36px);
        padding-bottom: 38px;
    }

    .hero-title {
        font-size: clamp(48px, 13.2vw, 54px);
        line-height: 0.92;
    }

    .hero-title-indent {
        margin-left: 18px;
    }

    .hero-description {
        font-size: 12.5px;
    }

    .explore-link {
        width: 100%;
        max-width: 260px;
    }

    .mobile-menu nav a {
        font-size: clamp(38px, 11.6vw, 50px);
    }

    .product-modal-content h3 {
        font-size: clamp(34px, 10vw, 44px);
    }

    .contact-email {
        font-size: 14px;
    }

}


/* Keyboard users should always see a clear focus indicator. */
.language-button:focus-visible,
.menu-toggle:focus-visible,
.product-filter-button:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 4px;
}


/* Motion-sensitive users: also disable the decorative hero motion. */
@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    .hero-orb-one,
    .hero-orb-two {
        animation: none !important;
    }

    .menu-toggle span {
        transition: none !important;
    }
}


@media (prefers-reduced-motion: reduce) {
    .brand-certifications-link {
        transition: none !important;
    }
}


/* =========================================================
   LEGAL LINKS
========================================================= */

.contact-privacy-link {
    display: inline-block;
    margin-left: 5px;

    color: var(--gt-green);
    font-weight: 600;

    border-bottom: 1px solid rgba(23, 53, 42, 0.28);

    transition:
        color 0.25s ease,
        border-color 0.25s ease;
}

.contact-privacy-link:hover {
    color: var(--gt-logo);
    border-color: var(--gt-logo);
}

.footer-legal {
    display: flex;
    align-items: center;
    gap: 18px;
    flex-wrap: wrap;
}

.footer-legal a {
    color: rgba(245, 242, 235, 0.58);
    border-bottom: 1px solid rgba(245, 242, 235, 0.18);

    transition:
        color 0.25s ease,
        border-color 0.25s ease;
}

.footer-legal a:hover {
    color: var(--gt-ivory);
    border-color: rgba(245, 242, 235, 0.65);
}


/* =========================================================
   PRIVACY POLICY PAGE
========================================================= */

.privacy-page {
    min-height: 100svh;
    background: var(--gt-ivory);
    color: var(--gt-ink);
}

.privacy-header {
    position: sticky;
    z-index: 100;
    top: 0;

    height: 76px;
    padding: 0 var(--page-padding);

    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;

    background: rgba(247, 244, 237, 0.97);
    border-bottom: 1px solid var(--gt-line);

    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

.privacy-header .brand {
    min-width: 0;
}

.privacy-actions {
    display: flex;
    align-items: center;
    gap: 28px;
}

.privacy-back-link {
    color: var(--gt-green);

    font-size: 9px;
    font-weight: 600;
    letter-spacing: 0.12em;

    border-bottom: 1px solid rgba(23, 53, 42, 0.25);
}

.privacy-main {
    padding:
        clamp(52px, 6vw, 86px)
        var(--page-padding)
        clamp(90px, 9vw, 135px);
}

.privacy-shell {
    width: min(100%, 1180px);
    margin: 0 auto;
}

.privacy-topline {
    padding-bottom: 18px;
    margin-bottom: clamp(48px, 5vw, 72px);

    display: flex;
    justify-content: space-between;
    gap: 24px;

    border-bottom: 1px solid var(--gt-line);

    color: rgba(23, 32, 27, 0.55);

    font-size: 9px;
    font-weight: 600;
    letter-spacing: 0.14em;
}

.privacy-hero {
    display: grid;
    grid-template-columns:
        minmax(0, 1.1fr)
        minmax(280px, 0.58fr);

    gap: clamp(60px, 9vw, 140px);
    align-items: end;

    margin-bottom: clamp(68px, 7vw, 105px);
}

.privacy-hero h1 {
    max-width: 780px;

    font-family: var(--display);
    font-size: clamp(60px, 7vw, 108px);
    font-weight: 400;
    line-height: 0.9;
    letter-spacing: -0.05em;
}

.privacy-hero h1 em {
    display: block;
    margin-top: 0.08em;

    color: var(--gt-green);
    font-style: italic;
    font-weight: 400;
}

.privacy-intro {
    color: var(--gt-grey);

    font-size: 14px;
    line-height: 1.9;
}

.privacy-content {
    display: grid;
    grid-template-columns:
        minmax(180px, 0.34fr)
        minmax(0, 1fr);

    gap: clamp(45px, 7vw, 100px);
}

.privacy-toc {
    position: sticky;
    top: 118px;
    align-self: start;
}

.privacy-toc-label {
    display: block;
    margin-bottom: 16px;

    color: rgba(23, 32, 27, 0.48);

    font-size: 8px;
    font-weight: 600;
    letter-spacing: 0.15em;
}

.privacy-toc a {
    display: block;
    width: fit-content;

    padding: 5px 0;

    color: var(--gt-grey);

    font-size: 11px;
    line-height: 1.5;
}

.privacy-toc a:hover {
    color: var(--gt-green);
}

.privacy-article {
    max-width: 780px;
}

.privacy-section + .privacy-section {
    margin-top: 52px;
    padding-top: 46px;

    border-top: 1px solid var(--gt-line);
}

.privacy-section h2 {
    margin-bottom: 18px;

    color: var(--gt-green);

    font-family: var(--display);
    font-size: clamp(30px, 2.5vw, 42px);
    font-weight: 500;
    line-height: 1.15;
}

.privacy-section p,
.privacy-section li {
    color: var(--gt-grey);

    font-size: 14px;
    line-height: 1.9;
}

.privacy-section p + p {
    margin-top: 16px;
}

.privacy-section ul {
    margin-top: 14px;
    padding-left: 20px;
}

.privacy-section li + li {
    margin-top: 8px;
}

.privacy-section a {
    color: var(--gt-green);
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

.privacy-contact-box {
    margin-top: 24px;
    padding: 24px 26px;

    background: var(--gt-warm-white);
    border: 1px solid var(--gt-line);
}

.privacy-contact-box strong {
    display: block;
    margin-bottom: 8px;

    color: var(--gt-ink);
}

.privacy-lang[hidden] {
    display: none !important;
}

.privacy-footer {
    padding:
        28px
        var(--page-padding);

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;

    background: var(--gt-green-deep);
    color: rgba(245, 242, 235, 0.58);

    font-size: 9px;
    letter-spacing: 0.06em;
}

.privacy-footer a {
    color: var(--gt-ivory);
}

@media (max-width: 850px) {

    .privacy-hero {
        grid-template-columns: 1fr;
        gap: 34px;
    }

    .privacy-content {
        grid-template-columns: 1fr;
        gap: 42px;
    }

    .privacy-toc {
        position: static;
    }

    .privacy-toc nav {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 4px 24px;
    }

}

@media (max-width: 700px) {

    .privacy-header {
        height: 68px;
    }

    .privacy-header .brand-logo {
        width: 145px;
    }

    .privacy-actions {
        gap: 14px;
    }

    .privacy-back-link {
        display: none;
    }

    .privacy-main {
        padding:
            44px
            var(--page-padding)
            78px;
    }

    .privacy-topline {
        margin-bottom: 42px;
    }

    .privacy-hero h1 {
        font-size: clamp(52px, 14vw, 72px);
    }

    .privacy-toc nav {
        grid-template-columns: 1fr;
    }

    .privacy-section + .privacy-section {
        margin-top: 38px;
        padding-top: 34px;
    }

    .privacy-footer {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
    }

}


/* =========================================================
   JUST GREEN ORGANIC — SEO LANDING PAGE
========================================================= */

.jgo-page {
    background: var(--gt-ivory);
    color: var(--gt-ink);
}

.jgo-page-header {
    position: sticky;
    z-index: 1000;
    top: 0;

    height: 76px;
    padding: 0 var(--page-padding);

    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;

    background: rgba(247, 244, 237, 0.97);
    border-bottom: 1px solid var(--gt-line);

    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

.jgo-page-header .brand {
    min-width: 0;
}

.jgo-page-header-actions {
    display: flex;
    align-items: center;
    gap: 28px;
}

.jgo-back-link {
    color: var(--gt-green);

    font-size: 9px;
    font-weight: 600;
    letter-spacing: 0.12em;

    border-bottom: 1px solid rgba(23, 53, 42, 0.22);
}

.jgo-hero {
    min-height: calc(100svh - 76px);

    padding:
        clamp(70px, 8vw, 118px)
        var(--page-padding)
        clamp(80px, 8vw, 120px);

    display: grid;
    grid-template-columns:
        minmax(0, 1.08fr)
        minmax(340px, 0.72fr);

    gap: clamp(70px, 9vw, 150px);
    align-items: center;

    background:
        linear-gradient(
            135deg,
            #0e271d 0%,
            #163528 48%,
            #25493a 100%
        );

    color: var(--gt-ivory);
}

.jgo-hero-copy {
    max-width: 860px;
}

.jgo-hero-eyebrow {
    margin-bottom: clamp(28px, 3vw, 42px);

    color: rgba(245, 242, 235, 0.58);

    font-size: 9px;
    font-weight: 600;
    line-height: 1.6;
    letter-spacing: 0.18em;
}

.jgo-hero h1 {
    font-family: var(--display);
    font-size: clamp(68px, 7.5vw, 122px);
    font-weight: 400;
    line-height: 0.88;
    letter-spacing: -0.055em;
}

.jgo-hero h1 span {
    display: block;
}

.jgo-hero-title-accent {
    margin-top: 0.08em;

    color: #ddd3be;

    font-style: italic;
}

.jgo-hero-lead {
    max-width: 680px;

    margin-top: clamp(40px, 4vw, 58px);

    color: rgba(245, 242, 235, 0.93);

    font-family: var(--display);
    font-size: clamp(24px, 2.1vw, 34px);
    line-height: 1.35;
}

.jgo-hero-text {
    max-width: 620px;

    margin-top: 22px;

    color: rgba(245, 242, 235, 0.66);

    font-size: 14px;
    line-height: 1.9;
}

.jgo-hero-actions {
    margin-top: 38px;

    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.jgo-primary-cta,
.jgo-secondary-cta {
    position: relative;

    min-height: 52px;
    padding: 0 48px 0 22px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(245, 242, 235, 0.75);

    font-size: 9px;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: 0.13em;

    transition:
        background 0.28s ease,
        color 0.28s ease,
        border-color 0.28s ease;
}

.jgo-primary-cta {
    background: var(--gt-ivory);
    color: var(--gt-green);
}

.jgo-secondary-cta {
    background: transparent;
    color: var(--gt-ivory);
}

.jgo-primary-cta::after,
.jgo-secondary-cta::after {
    content: "→";

    position: absolute;
    right: 18px;
    top: 50%;

    font-size: 16px;

    transform: translateY(-50%);
}

.jgo-primary-cta:hover {
    background: transparent;
    color: var(--gt-ivory);
}

.jgo-secondary-cta:hover {
    background: var(--gt-ivory);
    color: var(--gt-green);
}

.jgo-hero-brand {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.jgo-page-logo {
    width: min(100%, 390px);
    height: auto;

    object-fit: contain;
}

.jgo-distributor-note {
    width: min(100%, 420px);

    margin-top: 28px;
    padding-top: 22px;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;

    border-top: 1px solid rgba(245, 242, 235, 0.15);
}

.jgo-distributor-note span {
    max-width: 250px;

    color: rgba(245, 242, 235, 0.52);

    font-size: 8px;
    font-weight: 600;
    line-height: 1.65;
    letter-spacing: 0.14em;
}

.jgo-distributor-note strong {
    color: var(--gt-ivory);

    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.12em;
}

.jgo-overview {
    padding:
        clamp(88px, 9vw, 140px)
        var(--page-padding);

    display: grid;
    grid-template-columns:
        minmax(280px, 0.7fr)
        minmax(0, 1fr);

    gap: clamp(70px, 10vw, 170px);

    background: var(--gt-warm-white);
}

.jgo-overview-heading span,
.jgo-certifications-heading > span {
    display: block;

    margin-bottom: 20px;

    color: rgba(23, 32, 27, 0.42);

    font-size: 9px;
    font-weight: 600;
    letter-spacing: 0.16em;
}

.jgo-overview-heading h2,
.jgo-certifications-heading h2,
.jgo-products-intro h2,
.jgo-b2b-cta h2 {
    font-family: var(--display);
    font-weight: 400;
    letter-spacing: -0.035em;
}

.jgo-overview-heading h2 {
    max-width: 520px;

    color: var(--gt-green);

    font-size: clamp(42px, 4vw, 66px);
    line-height: 1;
}

.jgo-overview-copy {
    max-width: 720px;
}

.jgo-overview-copy p {
    color: var(--gt-grey);

    font-size: 15px;
    line-height: 1.95;
}

.jgo-overview-copy p + p {
    margin-top: 24px;
}

.jgo-certifications-section {
    padding:
        clamp(78px, 8vw, 120px)
        var(--page-padding);

    background: var(--gt-ivory);
}

.jgo-certifications-heading {
    display: grid;
    grid-template-columns: 110px minmax(0, 1fr);
    gap: 34px;

    padding-bottom: 34px;

    border-bottom: 1px solid var(--gt-line);
}

.jgo-small-label {
    margin-bottom: 12px;

    color: rgba(23, 32, 27, 0.48);

    font-size: 8px;
    font-weight: 600;
    letter-spacing: 0.16em;
}

.jgo-certifications-heading h2 {
    color: var(--gt-green);

    font-size: clamp(42px, 4vw, 64px);
    line-height: 1;
}

.jgo-certifications-content {
    margin-top: 44px;

    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        minmax(320px, 0.55fr);

    gap: clamp(60px, 8vw, 130px);
    align-items: center;
}

.jgo-certification-logos {
    display: flex;
    align-items: center;
    gap: clamp(34px, 4vw, 60px);
    flex-wrap: wrap;
}

.jgo-certification-logos img {
    width: auto;
    height: auto;
    max-width: 160px;
    max-height: 74px;

    object-fit: contain;
}

.jgo-certifications-copy {
    max-width: 480px;
}

.jgo-certifications-copy p {
    color: var(--gt-grey);

    font-size: 14px;
    line-height: 1.9;
}

.jgo-document-link {
    width: fit-content;

    margin-top: 26px;
    padding-bottom: 7px;

    display: inline-flex;
    align-items: center;
    gap: 20px;

    color: var(--gt-green);

    font-size: 9px;
    font-weight: 600;
    letter-spacing: 0.13em;

    border-bottom: 1px solid rgba(23, 53, 42, 0.28);
}

.jgo-products-section {
    scroll-margin-top: 76px;

    padding:
        30px
        var(--page-padding)
        clamp(100px, 10vw, 150px);

    background: #f1ede5;
}

.jgo-products-topline {
    padding-bottom: 18px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    border-bottom: 1px solid var(--gt-line);

    color: rgba(23, 32, 27, 0.52);

    font-size: 9px;
    font-weight: 600;
    letter-spacing: 0.15em;
}

.jgo-products-intro {
    padding:
        clamp(56px, 6vw, 88px)
        0;

    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        minmax(280px, 0.56fr);

    gap: clamp(60px, 9vw, 140px);
    align-items: end;
}

.jgo-products-intro h2 {
    color: var(--gt-green);

    font-size: clamp(54px, 6vw, 92px);
    line-height: 0.92;
}

.jgo-products-intro p {
    color: var(--gt-grey);

    font-size: 14px;
    line-height: 1.9;
}

.jgo-category-section + .jgo-category-section {
    margin-top: 88px;
}

.jgo-category-heading {
    margin-bottom: 28px;
    padding-bottom: 16px;

    display: flex;
    align-items: baseline;
    gap: 18px;

    border-bottom: 1px solid var(--gt-line);
}

.jgo-category-index {
    color: rgba(23, 32, 27, 0.38);

    font-size: 9px;
    font-weight: 600;
    letter-spacing: 0.14em;
}

.jgo-category-heading h2 {
    color: var(--gt-ink);

    font-family: var(--display);
    font-size: clamp(28px, 2.6vw, 42px);
    font-weight: 500;
    line-height: 1.1;
}

.jgo-products-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));

    gap: 18px;
}

.jgo-product-card {
    min-width: 0;

    display: block;

    background: var(--gt-warm-white);
    border: 1px solid rgba(27, 49, 38, 0.10);

    transition:
        transform 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease;
}

.jgo-product-image {
    height: clamp(250px, 22vw, 330px);
    padding: 26px;

    display: flex;
    align-items: center;
    justify-content: center;

    background: #ffffff;
}

.jgo-product-image img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;

    object-fit: contain;
}

.jgo-product-card-copy {
    min-height: 108px;

    padding: 20px 20px 22px;

    border-top: 1px solid rgba(27, 49, 38, 0.09);
}

.jgo-product-code {
    display: block;

    margin-bottom: 9px;

    color: rgba(23, 32, 27, 0.46);

    font-size: 8px;
    font-weight: 600;
    letter-spacing: 0.13em;
}

.jgo-product-card h3 {
    color: var(--gt-ink);

    font-size: 12px;
    font-weight: 600;
    line-height: 1.55;
}

@media (hover: hover) and (pointer: fine) {

    .jgo-product-card:hover {
        transform: translateY(-4px);

        border-color: rgba(27, 49, 38, 0.22);

        box-shadow:
            0 18px 42px rgba(16, 41, 31, 0.08);
    }

}

.jgo-b2b-cta {
    padding:
        clamp(82px, 8vw, 120px)
        var(--page-padding);

    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        minmax(260px, 0.38fr);

    gap: clamp(60px, 9vw, 140px);
    align-items: end;

    background: var(--gt-green-deep);
    color: var(--gt-ivory);
}

.jgo-b2b-cta h2 {
    max-width: 700px;

    margin-top: 10px;

    font-size: clamp(48px, 5vw, 78px);
    line-height: 0.95;
}

.jgo-b2b-cta p {
    max-width: 680px;

    margin-top: 24px;

    color: rgba(245, 242, 235, 0.64);

    font-size: 14px;
    line-height: 1.9;
}

.jgo-b2b-cta .jgo-primary-cta {
    justify-self: end;
}

.jgo-page-footer {
    padding:
        30px
        var(--page-padding);

    display: flex;
    justify-content: space-between;
    gap: 40px;

    background: #081b14;
    color: rgba(245, 242, 235, 0.54);

    font-size: 9px;
    line-height: 1.6;
    letter-spacing: 0.08em;
}

.jgo-page-footer > div {
    display: flex;
    align-items: center;
    gap: 18px;
    flex-wrap: wrap;
}

.jgo-page-footer strong {
    color: var(--gt-ivory);

    font-size: 10px;
    letter-spacing: 0.12em;
}

.jgo-page-footer a {
    color: rgba(245, 242, 235, 0.72);
}

@media (max-width: 1050px) {

    .jgo-hero {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(280px, 0.58fr);

        gap: 58px;
    }

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

}

@media (max-width: 850px) {

    .jgo-hero {
        min-height: 0;

        grid-template-columns: 1fr;
        gap: 60px;
    }

    .jgo-hero-brand {
        align-items: flex-start;
    }

    .jgo-page-logo {
        width: min(320px, 70vw);
    }

    .jgo-distributor-note {
        width: min(100%, 520px);
    }

    .jgo-overview,
    .jgo-certifications-content,
    .jgo-products-intro,
    .jgo-b2b-cta {
        grid-template-columns: 1fr;
        gap: 38px;
    }

    .jgo-certifications-heading {
        grid-template-columns: 72px minmax(0, 1fr);
    }

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

    .jgo-b2b-cta .jgo-primary-cta {
        justify-self: start;
    }

}

@media (max-width: 700px) {

    .jgo-page-header {
        height: 68px;
    }

    .jgo-page-header .brand-logo {
        width: 145px;
    }

    .jgo-page-header-actions {
        gap: 14px;
    }

    .jgo-back-link {
        display: none;
    }

    .jgo-hero {
        padding:
            56px
            var(--page-padding)
            72px;
    }

    .jgo-hero h1 {
        font-size: clamp(54px, 14vw, 72px);
        line-height: 0.92;
    }

    .jgo-hero-lead {
        font-size: 25px;
    }

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

    .jgo-primary-cta,
    .jgo-secondary-cta {
        width: 100%;
    }

    .jgo-distributor-note {
        align-items: flex-start;
        flex-direction: column;
    }

    .jgo-overview,
    .jgo-certifications-section,
    .jgo-products-section,
    .jgo-b2b-cta {
        padding-left: var(--page-padding);
        padding-right: var(--page-padding);
    }

    .jgo-certifications-heading {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .jgo-certifications-heading > span {
        margin-bottom: 0;
    }

    .jgo-certification-logos {
        gap: 24px;
    }

    .jgo-certification-logos img {
        max-width: 118px;
        max-height: 58px;
    }

    .jgo-products-section {
        scroll-margin-top: 68px;
    }

    .jgo-products-topline {
        gap: 20px;
    }

    .jgo-products-intro {
        padding:
            46px
            0;
    }

    .jgo-products-intro h2 {
        font-size: clamp(50px, 13vw, 68px);
    }

    .jgo-products-grid {
        grid-template-columns: 1fr;
    }

    .jgo-product-image {
        height: min(440px, 96vw);
    }

    .jgo-product-card-copy {
        min-height: 0;
    }

    .jgo-category-section + .jgo-category-section {
        margin-top: 62px;
    }

    .jgo-page-footer {
        flex-direction: column;
        gap: 18px;
    }

}

@media (prefers-reduced-motion: reduce) {

    .jgo-product-card,
    .jgo-primary-cta,
    .jgo-secondary-cta {
        transition: none !important;
    }

}


/* =========================================================
   QA FIX — BRAND ACTIONS + CERTIFICATIONS + JGO PAGE BALANCE
========================================================= */

.brand-card-actions { gap: 12px; }
.brand-card-actions .brand-card-link,
.brand-card-actions .brand-certifications-link {
    width:auto; min-height:40px; margin-top:0; padding:0 15px;
    display:inline-flex; align-items:center; justify-content:center; gap:12px;
    border:1px solid rgba(245,242,235,.34);
    background:rgba(245,242,235,.025);
    color:rgba(245,242,235,.88);
    font-family:var(--sans); font-size:8px; font-weight:600; line-height:1; letter-spacing:.13em;
    transition:background .28s ease,color .28s ease,border-color .28s ease,transform .28s ease;
}
.brand-card-actions .brand-card-link:hover,
.brand-card-actions .brand-certifications-link:hover {
    gap:12px; background:var(--gt-ivory); color:var(--gt-green); border-color:var(--gt-ivory); transform:translateY(-1px);
}
.brand-card-actions .brand-card-link:focus-visible,
.brand-card-actions .brand-certifications-link:focus-visible { outline:1px solid var(--gt-ivory); outline-offset:5px; }

.brand-card-certifications { min-height:112px; }
.brand-certification-logos { gap:clamp(40px,4vw,62px); }
.certification-badge { width:176px; height:82px; padding:0; }
.certification-badge img {
    width:auto !important; height:auto !important; max-width:158px !important; max-height:66px !important;
    object-fit:contain; opacity:.9; filter:grayscale(1) brightness(0) invert(1);
}
.certification-badge-vegan img { max-width:132px !important; }
.certification-badge-usda img { max-width:174px !important; max-height:64px !important; }

.jgo-page { --jgo-content-pad:max(var(--page-padding),calc((100vw - 1640px)/2)); }
.jgo-page-header { padding-left:var(--jgo-content-pad); padding-right:var(--jgo-content-pad); }
.jgo-hero,.jgo-overview,.jgo-certifications-section,.jgo-products-section,.jgo-b2b-cta,.jgo-page-footer {
    padding-left:var(--jgo-content-pad); padding-right:var(--jgo-content-pad);
}
.jgo-hero {
    min-height:min(850px,calc(100svh - 76px)); padding-top:clamp(74px,7vw,108px); padding-bottom:clamp(74px,7vw,108px);
    grid-template-columns:minmax(0,1fr) minmax(320px,.62fr); gap:clamp(70px,7vw,116px);
}
.jgo-hero-copy { max-width:820px; }
.jgo-hero h1 { font-size:clamp(66px,6.5vw,108px); line-height:.91; }
.jgo-hero-brand { justify-self:center; width:100%; max-width:460px; }
.jgo-page-logo { width:min(100%,360px); }

.jgo-overview {
    padding-top:clamp(76px,6vw,96px); padding-bottom:clamp(76px,6vw,96px);
    grid-template-columns:minmax(390px,.86fr) minmax(0,1fr); gap:clamp(72px,6vw,106px); align-items:start;
}
.jgo-overview-heading h2 { max-width:610px; font-size:clamp(48px,4.2vw,68px); line-height:.98; }
.jgo-overview-copy { max-width:660px; padding-top:5px; }
.jgo-overview-copy p { font-size:14px; line-height:1.85; }

.jgo-certifications-section { padding-top:clamp(72px,5.5vw,90px); padding-bottom:clamp(76px,6vw,96px); }
.jgo-certifications-heading { grid-template-columns:72px minmax(0,1fr); gap:28px; padding-bottom:28px; }
.jgo-certifications-heading h2 { font-size:clamp(46px,4.1vw,66px); }
.jgo-certifications-content { margin-top:32px; grid-template-columns:minmax(0,1fr) minmax(360px,.62fr); gap:clamp(64px,7vw,108px); align-items:center; }
.jgo-certification-logos { flex-wrap:nowrap; gap:clamp(28px,3vw,46px); }
.jgo-certification-logos img { width:auto; max-width:185px; max-height:82px; filter:none; opacity:1; }
.jgo-certification-logos img:nth-child(2) { max-width:145px; }
.jgo-certification-logos img:nth-child(3) { max-width:205px; }
.jgo-certifications-copy { max-width:500px; justify-self:end; }

.jgo-products-section { padding-top:28px; padding-bottom:clamp(90px,8vw,124px); }
.jgo-products-intro { padding-top:clamp(48px,4vw,66px); padding-bottom:clamp(52px,4.5vw,72px); grid-template-columns:minmax(0,1fr) minmax(340px,.55fr); gap:clamp(66px,6vw,104px); }
.jgo-products-intro h2 { font-size:clamp(54px,5.2vw,82px); }
.jgo-products-intro p { max-width:560px; justify-self:end; }
.jgo-category-section + .jgo-category-section { margin-top:72px; }
.jgo-products-grid { gap:16px; }
.jgo-product-image { height:clamp(260px,18vw,310px); padding:24px; }
.jgo-product-card-copy { min-height:104px; padding:18px 18px 20px; }
.jgo-b2b-cta { padding-top:clamp(74px,6vw,98px); padding-bottom:clamp(74px,6vw,98px); }

@media (max-width:1050px) {
  .jgo-page { --jgo-content-pad:max(var(--page-padding),48px); }
  .jgo-hero { min-height:0; }
  .jgo-products-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:850px) {
  .jgo-page { --jgo-content-pad:max(var(--page-padding),34px); }
  .jgo-overview,.jgo-certifications-content,.jgo-products-intro,.jgo-b2b-cta { grid-template-columns:1fr; gap:34px; }
  .jgo-certifications-copy,.jgo-products-intro p { justify-self:start; }
  .jgo-certification-logos { flex-wrap:wrap; }
  .jgo-products-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:700px) {
  .jgo-page { --jgo-content-pad:var(--page-padding); }
  .brand-card-actions .brand-card-link,.brand-card-actions .brand-certifications-link { width:100%; min-height:44px; }
  .brand-card-certifications { min-height:auto; }
  .brand-certification-logos { gap:22px; flex-wrap:wrap; }
  .certification-badge { width:120px; height:66px; }
  .certification-badge img { max-width:112px !important; max-height:52px !important; }
  .certification-badge-usda img { max-width:126px !important; }
  .jgo-hero { padding-top:50px; padding-bottom:66px; }
  .jgo-overview,.jgo-certifications-section,.jgo-b2b-cta { padding-top:64px; padding-bottom:64px; }
  .jgo-products-grid { grid-template-columns:1fr; }
  .jgo-product-image { height:min(410px,96vw); }
}


/* =========================================================
   JGO FINAL LAYOUT — SINGLE PROOF CANVAS + FULL RESPONSIVE QA
========================================================= */

.jgo-page {
    --jgo-content-pad: max(
        var(--page-padding),
        calc((100vw - 1440px) / 2)
    );
}

/* One visual canvas for range + certifications */
.jgo-proof-section {
    min-height: min(760px, calc(100svh - 76px));

    padding:
        clamp(52px, 5vw, 72px)
        var(--jgo-content-pad);

    display: flex;
    flex-direction: column;
    justify-content: center;

    background: var(--gt-warm-white);
}

.jgo-proof-row {
    display: grid;
    grid-template-columns:
        minmax(0, 0.92fr)
        minmax(0, 1.08fr);

    column-gap: clamp(72px, 8vw, 126px);
    align-items: center;
}

.jgo-proof-heading,
.jgo-proof-copy {
    min-width: 0;
}

.jgo-proof-heading {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    column-gap: 26px;
    align-items: start;
}

.jgo-proof-index {
    padding-top: 8px;

    color: rgba(23, 32, 27, 0.42);

    font-size: 8px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.16em;
}

.jgo-proof-heading h2 {
    max-width: 590px;

    color: var(--gt-green);

    font-family: var(--display);
    font-size: clamp(44px, 3.55vw, 62px);
    font-weight: 400;
    line-height: 0.98;
    letter-spacing: -0.035em;
}

.jgo-proof-copy {
    max-width: 610px;
    justify-self: end;
}

.jgo-proof-copy p {
    color: var(--gt-grey);

    font-size: 13.5px;
    line-height: 1.88;
}

.jgo-proof-copy p + p {
    margin-top: 20px;
}

.jgo-proof-rule {
    width: 100%;
    height: 1px;

    margin:
        clamp(42px, 4.5vw, 58px)
        0;

    background: var(--gt-line);
}

.jgo-proof-certifications-row {
    align-items: center;
}

.jgo-proof-certifications-heading {
    grid-template-columns: 72px minmax(0, 1fr);
    row-gap: 24px;
}

.jgo-proof-certifications-heading .jgo-certification-logos {
    grid-column: 2;
}

.jgo-proof-certifications-heading .jgo-small-label {
    margin-bottom: 10px;
}

.jgo-proof-certifications-heading h2 {
    font-size: clamp(42px, 3.35vw, 58px);
}

.jgo-proof-section .jgo-certification-logos {
    display: grid;
    grid-template-columns: repeat(3, minmax(90px, 1fr));
    align-items: center;
    gap: clamp(22px, 2.5vw, 38px);

    width: min(100%, 520px);
}

.jgo-proof-section .jgo-certification-logos img {
    width: auto;
    height: auto;

    max-width: 100%;
    max-height: 68px;

    justify-self: start;
    object-fit: contain;

    filter: none;
    opacity: 1;
}

.jgo-proof-section .jgo-certification-logos img:nth-child(1) {
    max-width: 126px;
}

.jgo-proof-section .jgo-certification-logos img:nth-child(2) {
    max-width: 96px;
}

.jgo-proof-section .jgo-certification-logos img:nth-child(3) {
    max-width: 138px;
}

.jgo-proof-certifications-copy {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.jgo-proof-certifications-copy .jgo-document-link {
    margin-top: 22px;
}

/* Give all principal JGO sections the same visual axis. */
.jgo-page-header,
.jgo-hero,
.jgo-products-section,
.jgo-b2b-cta,
.jgo-page-footer {
    padding-left: var(--jgo-content-pad);
    padding-right: var(--jgo-content-pad);
}

/* Desktop hero polish */
.jgo-hero {
    grid-template-columns:
        minmax(0, 1fr)
        minmax(300px, 0.58fr);

    gap: clamp(64px, 7vw, 112px);
}

.jgo-hero-copy {
    max-width: 760px;
}

.jgo-hero-brand {
    max-width: 420px;
    justify-self: end;
}

.jgo-page-logo {
    width: min(100%, 335px);
}

.jgo-distributor-note {
    width: min(100%, 390px);
}

/* Product section alignment and card proportions */
.jgo-products-intro {
    grid-template-columns:
        minmax(0, 1fr)
        minmax(320px, 0.52fr);

    gap: clamp(62px, 7vw, 110px);
}

.jgo-products-intro p {
    max-width: 520px;
    justify-self: end;
}

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

.jgo-product-image {
    height: clamp(240px, 18vw, 305px);
}

.jgo-product-card-copy {
    min-height: 102px;
}


/* -------- 1280 and below -------- */
@media (max-width: 1280px) {

    .jgo-page {
        --jgo-content-pad: max(var(--page-padding), 48px);
    }

    .jgo-proof-row {
        column-gap: 62px;
    }

    .jgo-proof-heading {
        grid-template-columns: 54px minmax(0, 1fr);
        column-gap: 20px;
    }

    .jgo-proof-certifications-heading {
        grid-template-columns: 54px minmax(0, 1fr);
    }

    .jgo-proof-section .jgo-certification-logos {
        grid-column: 2;
    }

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

}


/* -------- Tablet landscape / compact desktop -------- */
@media (max-width: 1050px) {

    .jgo-page {
        --jgo-content-pad: max(var(--page-padding), 40px);
    }

    .jgo-page-header {
        height: 72px;
    }

    .jgo-hero {
        min-height: 0;

        padding-top: 64px;
        padding-bottom: 72px;

        grid-template-columns:
            minmax(0, 1fr)
            minmax(260px, 0.5fr);

        gap: 48px;
    }

    .jgo-hero h1 {
        font-size: clamp(60px, 7.4vw, 82px);
    }

    .jgo-page-logo {
        width: min(100%, 285px);
    }

    .jgo-proof-section {
        min-height: 0;
        padding-top: 62px;
        padding-bottom: 62px;
    }

    .jgo-proof-row {
        grid-template-columns:
            minmax(0, 0.95fr)
            minmax(0, 1.05fr);

        column-gap: 46px;
    }

    .jgo-proof-heading h2 {
        font-size: clamp(40px, 4.6vw, 52px);
    }

    .jgo-proof-copy p {
        font-size: 13px;
    }

    .jgo-proof-section .jgo-certification-logos {
        gap: 18px;
    }

    .jgo-proof-section .jgo-certification-logos img:nth-child(1) {
        max-width: 112px;
    }

    .jgo-proof-section .jgo-certification-logos img:nth-child(2) {
        max-width: 84px;
    }

    .jgo-proof-section .jgo-certification-logos img:nth-child(3) {
        max-width: 126px;
    }

}


/* -------- Tablet portrait -------- */
@media (max-width: 850px) {

    .jgo-page {
        --jgo-content-pad: max(var(--page-padding), 32px);
    }

    .jgo-page-header-actions {
        gap: 18px;
    }

    .jgo-hero {
        grid-template-columns: 1fr;
        gap: 50px;
    }

    .jgo-hero-brand {
        justify-self: start;
        align-items: flex-start;

        width: min(100%, 430px);
        max-width: none;
    }

    .jgo-page-logo {
        width: min(100%, 280px);
    }

    .jgo-proof-section {
        padding-top: 56px;
        padding-bottom: 60px;
    }

    .jgo-proof-row {
        grid-template-columns: 1fr;
        gap: 28px;
    }

    .jgo-proof-heading {
        grid-template-columns: 52px minmax(0, 1fr);
        column-gap: 18px;
    }

    .jgo-proof-copy {
        width: calc(100% - 70px);
        max-width: 620px;

        margin-left: 70px;

        justify-self: start;
    }

    .jgo-proof-rule {
        margin: 42px 0;
    }

    .jgo-proof-certifications-heading {
        grid-template-columns: 52px minmax(0, 1fr);
    }

    .jgo-proof-section .jgo-certification-logos {
        grid-column: 2;
        width: min(100%, 470px);
    }

    .jgo-proof-certifications-copy {
        margin-left: 70px;
    }

    .jgo-products-intro {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .jgo-products-intro p {
        max-width: 620px;
        justify-self: start;
    }

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

    .jgo-b2b-cta {
        grid-template-columns: 1fr;
        gap: 34px;
    }

    .jgo-b2b-cta .jgo-primary-cta {
        justify-self: start;
    }

}


/* -------- Phones -------- */
@media (max-width: 700px) {

    .jgo-page {
        --jgo-content-pad: 24px;
    }

    .jgo-page-header {
        height: 68px;
    }

    .jgo-page-header .brand-logo {
        width: 142px;
    }

    .jgo-back-link {
        display: none;
    }

    .jgo-hero {
        padding-top: 48px;
        padding-bottom: 58px;
        gap: 42px;
    }

    .jgo-hero-eyebrow {
        margin-bottom: 24px;
    }

    .jgo-hero h1 {
        font-size: clamp(50px, 13.5vw, 68px);
        line-height: 0.93;
    }

    .jgo-hero-lead {
        margin-top: 30px;
        font-size: clamp(23px, 6.3vw, 28px);
    }

    .jgo-hero-text {
        margin-top: 18px;
        font-size: 13px;
        line-height: 1.78;
    }

    .jgo-hero-actions {
        margin-top: 30px;
        align-items: stretch;
        flex-direction: column;
    }

    .jgo-primary-cta,
    .jgo-secondary-cta {
        width: 100%;
        min-height: 50px;
    }

    .jgo-hero-brand {
        width: 100%;
    }

    .jgo-page-logo {
        width: min(78vw, 250px);
    }

    .jgo-distributor-note {
        width: 100%;
        margin-top: 22px;
        padding-top: 18px;

        align-items: flex-start;
        flex-direction: column;

        gap: 10px;
    }

    .jgo-proof-section {
        padding-top: 50px;
        padding-bottom: 54px;
    }

    .jgo-proof-heading,
    .jgo-proof-certifications-heading {
        grid-template-columns: 34px minmax(0, 1fr);
        column-gap: 12px;
    }

    .jgo-proof-index {
        padding-top: 6px;
    }

    .jgo-proof-heading h2 {
        font-size: clamp(38px, 10.6vw, 48px);
        line-height: 0.99;
    }

    .jgo-proof-copy,
    .jgo-proof-certifications-copy {
        width: auto;
        max-width: none;

        margin-left: 46px;
    }

    .jgo-proof-copy p {
        font-size: 12.5px;
        line-height: 1.78;
    }

    .jgo-proof-rule {
        margin: 34px 0;
    }

    .jgo-proof-certifications-heading {
        row-gap: 20px;
    }

    .jgo-proof-section .jgo-certification-logos {
        grid-column: 2;
        grid-template-columns: repeat(3, minmax(0, 1fr));

        width: 100%;
        gap: 14px;
    }

    .jgo-proof-section .jgo-certification-logos img {
        max-height: 48px;
    }

    .jgo-proof-section .jgo-certification-logos img:nth-child(1) {
        max-width: 88px;
    }

    .jgo-proof-section .jgo-certification-logos img:nth-child(2) {
        max-width: 70px;
    }

    .jgo-proof-section .jgo-certification-logos img:nth-child(3) {
        max-width: 96px;
    }

    .jgo-document-link {
        margin-top: 18px;
        font-size: 8px;
        line-height: 1.45;
    }

    .jgo-products-section {
        padding-top: 24px;
        padding-bottom: 74px;
    }

    .jgo-products-intro {
        padding-top: 40px;
        padding-bottom: 42px;
    }

    .jgo-products-intro h2 {
        font-size: clamp(46px, 12vw, 62px);
    }

    .jgo-products-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .jgo-product-image {
        height: min(340px, 82vw);
        padding: 22px;
    }

    .jgo-product-card-copy {
        min-height: 0;
        padding: 17px 18px 19px;
    }

    .jgo-category-section + .jgo-category-section {
        margin-top: 54px;
    }

    .jgo-category-heading {
        margin-bottom: 20px;
    }

    .jgo-b2b-cta {
        padding-top: 62px;
        padding-bottom: 64px;
    }

    .jgo-b2b-cta h2 {
        font-size: clamp(44px, 12vw, 58px);
    }

    .jgo-page-footer {
        padding-top: 26px;
        padding-bottom: 26px;

        flex-direction: column;
        gap: 16px;
    }

}


/* -------- Narrow phones -------- */
@media (max-width: 430px) {

    .jgo-page {
        --jgo-content-pad: 20px;
    }

    .jgo-page-header .brand-logo {
        width: 136px;
    }

    .jgo-page-header-actions {
        gap: 10px;
    }

    .jgo-hero {
        padding-top: 42px;
        padding-bottom: 52px;
    }

    .jgo-hero h1 {
        font-size: clamp(46px, 13.5vw, 58px);
    }

    .jgo-proof-section {
        padding-top: 44px;
        padding-bottom: 48px;
    }

    .jgo-proof-heading,
    .jgo-proof-certifications-heading {
        grid-template-columns: 28px minmax(0, 1fr);
        column-gap: 10px;
    }

    .jgo-proof-copy,
    .jgo-proof-certifications-copy {
        margin-left: 38px;
    }

    .jgo-proof-section .jgo-certification-logos {
        gap: 10px;
    }

    .jgo-proof-section .jgo-certification-logos img:nth-child(1) {
        max-width: 78px;
    }

    .jgo-proof-section .jgo-certification-logos img:nth-child(2) {
        max-width: 62px;
    }

    .jgo-proof-section .jgo-certification-logos img:nth-child(3) {
        max-width: 84px;
    }

    .jgo-products-topline {
        gap: 14px;
        align-items: flex-start;
    }

    .jgo-products-topline span:last-child {
        text-align: right;
    }

    .jgo-product-image {
        height: min(310px, 80vw);
    }

}


/* -------- Short landscape screens -------- */
@media (max-height: 650px) and (min-width: 851px) {

    .jgo-hero {
        min-height: 0;
        padding-top: 52px;
        padding-bottom: 58px;
    }

    .jgo-proof-section {
        min-height: 0;
        padding-top: 50px;
        padding-bottom: 52px;
    }

    .jgo-proof-rule {
        margin: 34px 0;
    }

}


/* Focus visibility on this page */
.jgo-page a:focus-visible,
.jgo-page button:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 4px;
}


/* =========================================================
   PRODUCTION AUDIT — ACCESSIBILITY & POLISH
========================================================= */

/* WCAG AA-friendly normal body copy on the ivory backgrounds. */
.contact-privacy-note,
.privacy-toc-label,
.product-modal-image-button,
.jgo-proof-index,
.jgo-proof-section .jgo-small-label {
    color: rgba(23, 32, 27, 0.64);
}

.jgo-distributor-note span {
    color: rgba(245, 242, 235, 0.64);
}

/* Sticky header must not cover privacy section headings when using the TOC. */
.privacy-section {
    scroll-margin-top: 112px;
}

@media (max-width: 700px) {
    .privacy-section {
        scroll-margin-top: 92px;
    }
}

/* Focus treatment for all keyboard-relevant controls and links. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 4px;
}

/* Keep the hidden mobile drawer out of the accessibility/interaction surface. */
.mobile-menu[aria-hidden="true"] {
    visibility: hidden;
    pointer-events: none;
}

.mobile-menu.active[aria-hidden="false"] {
    visibility: visible;
    pointer-events: auto;
}


/* Modal visibility must become focusable immediately on open and only hide after fade-out. */
.product-modal {
    transition:
        opacity 0.3s ease,
        visibility 0s linear 0.3s;
}

.product-modal.is-open {
    transition:
        opacity 0.3s ease,
        visibility 0s linear 0s;
}


/* Invisible fragment targets let JGO product links land at Products without query URLs. */
.product-deep-link-targets {
    position: absolute;
    inset: 0 auto auto 0;
    width: 1px;
    height: 1px;
    overflow: hidden;
    pointer-events: none;
}

.product-deep-link-target {
    position: absolute;
    top: 0;
    left: 0;
    width: 1px;
    height: 1px;
    scroll-margin-top: 76px;
}

@media (max-width: 900px) {
    .product-deep-link-target {
        scroll-margin-top: 72px;
    }
}

@media (max-width: 700px) {
    .product-deep-link-target {
        scroll-margin-top: 68px;
    }
}


/* =========================================================
   FINAL V2 — content cleanup
========================================================= */

/* Brands intro is intentionally title-only. */
.brands-intro {
    display: block;
}

.brands-heading {
    width: 100%;
}

.brands-heading h2 {
    max-width: 850px;
}

/* JGO products intro is intentionally title-only. */
.jgo-products-intro {
    display: block;
    padding:
        clamp(48px, 5vw, 72px)
        0
        clamp(42px, 4.5vw, 66px);
}

.jgo-products-intro h2 {
    max-width: 820px;
}

@media (max-width: 700px) {
    .jgo-products-intro {
        padding:
            38px
            0
            36px;
    }
}