/* =========================================================
   LITTLE HERO STUDIOS
   MERCH COLLECTION PAGE

   Purpose:
   Shared visual shell for badge-based and audience-based
   merchandise collection views.
========================================================= */


/* =========================================================
   PAGE FOUNDATION
========================================================= */

.merch-collection-page {
    background: #ffffff;
    color: #18232b;
}


/* =========================================================
   COLLECTION HERO
========================================================= */

.merch-collection-hero {
    padding: 5rem 0 4rem;

    background:
        linear-gradient(135deg,
            #ffffff 0%,
            #f6f7f6 55%,
            #eef1f2 100%);

    border-bottom: 1px solid #dde3e6;
}


.merch-collection-back {
    margin-bottom: 2rem;
}


.merch-collection-back a {
    display: inline-flex;

    align-items: center;

    gap: 0.55rem;

    color: #52636d;

    text-decoration: none;

    font-size: 0.82rem;
    font-weight: 800;

    letter-spacing: 0.06em;

    text-transform: uppercase;

    transition:
        color 180ms ease,
        gap 180ms ease;
}


.merch-collection-back a:hover {
    gap: 0.8rem;

    color: #f5a623;
}


/* =========================================================
   HERO LAYOUT
========================================================= */

.merch-collection-hero-layout {

    display: grid;

    grid-template-columns:
        minmax(0, 0.92fr) minmax(460px, 1.08fr);

    align-items: center;

    gap: clamp(2.5rem, 5vw, 5rem);

}


/* =========================================================
   HERO COPY
========================================================= */

.merch-collection-copy {
    max-width: 650px;
}


.merch-collection-eyebrow {
    display: inline-block;

    margin-bottom: 1rem;

    color: #f5a623;

    font-size: 0.76rem;
    font-weight: 900;

    letter-spacing: 0.18em;

    text-transform: uppercase;
}


.merch-collection-copy h1 {
    margin: 0;

    color: #173b55;

    font-size: clamp(3.4rem, 7vw, 6.5rem);
    font-weight: 850;

    line-height: 0.92;

    letter-spacing: -0.055em;
}


.merch-collection-lead {
    margin: 1.5rem 0 0;

    color: #18232b;

    font-size: clamp(1.2rem, 2vw, 1.45rem);
    font-weight: 750;

    line-height: 1.45;
}


.merch-collection-description {
    max-width: 600px;

    margin: 1rem 0 0;

    color: #52636d;

    font-size: 1rem;

    line-height: 1.8;
}


/* =========================================================
   COLLECTION BADGE / VISUAL
========================================================= */
.merch-collection-visual {
    min-height: 470px;

    position: relative;

    overflow: hidden;

    padding: 0;

    border-radius: 20px;

    background: #f4f5f3;

    box-shadow:
        0 24px 55px rgba(23, 59, 85, 0.10);
}


.merch-collection-visual::before {
    content: "";

    position: absolute;

    inset: 0;

    z-index: 2;

    background:
        linear-gradient(135deg,
            rgba(245, 166, 35, 0.04),
            transparent 55%);

    pointer-events: none;
}

.merch-collection-visual img {
    z-index: 1;

    display: block;

    width: 100%;
    height: 100%;

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

    filter: none;

    transition:
        transform 700ms cubic-bezier(0.22, 0.61, 0.36, 1);
}


.merch-collection-visual:hover img {
    transform: scale(1.025);
}

/* =========================================================
   SHARED EDITORIAL SECTION TYPOGRAPHY
========================================================= */

.merch-collection-section-eyebrow {
    display: inline-block;

    margin-bottom: 1rem;

    color: #f5a623;

    font-size: 0.74rem;
    font-weight: 900;

    letter-spacing: 0.18em;

    text-transform: uppercase;
}


/* =========================================================
   EXPLORE BY GARMENT
========================================================= */

.merch-collection-garment-nav {
    padding: 5rem 0 5.5rem;

    background: #ffffff;

    border-top:
        1px solid #e1e6e9;
}


.merch-collection-garment-nav-heading {
    max-width: 760px;

    margin-bottom: 3rem;
}


.merch-collection-garment-nav-heading>span {
    display: inline-block;

    margin-bottom: 0.9rem;

    color: #f5a623;

    font-size: 0.74rem;
    font-weight: 900;

    letter-spacing: 0.18em;

    text-transform: uppercase;
}


.merch-collection-garment-nav-heading h2 {
    margin: 0;

    color: #173b55;

    font-size:
        clamp(2.3rem, 4.5vw, 4rem);

    font-weight: 850;

    line-height: 1;

    letter-spacing: -0.04em;
}


.merch-collection-garment-nav-heading p {
    max-width: 620px;

    margin: 1rem 0 0;

    color: #52636d;

    font-size: 1rem;

    line-height: 1.75;
}


/* =========================================================
   GARMENT NAVIGATION ROW
========================================================= */

.merch-collection-garment-links {
    display: grid;

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

    width: 100%;

    border-top:
        1px solid #d7dfe3;

    border-bottom:
        1px solid #d7dfe3;
}


.merch-collection-garment-links a {
    display: flex;

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

    min-height: 60px;

    padding:
        1rem 0.75rem;

    color: #173b55;

    text-decoration: none;

    font-size: 0.78rem;
    font-weight: 900;

    letter-spacing: 0.08em;

    text-transform: uppercase;

    background: transparent;

    transition:
        color 180ms ease,
        background-color 180ms ease;
}


.merch-collection-garment-links a:hover,
.merch-collection-garment-links a:focus-visible {
    color: #f5a623;

    background:
        rgba(23, 59, 85, 0.025);
}


/* =========================================================
   EXPLORE BY GARMENT — MOBILE
========================================================= */

@media (max-width: 600px) {

    .merch-collection-garment-nav {
        padding:
            4rem 0;
    }


    .merch-collection-garment-nav-heading {
        margin-bottom: 2.25rem;
    }


    .merch-collection-garment-links {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }


    .merch-collection-garment-links a {
        min-height: 58px;

        text-align: center;

        font-size: 0.72rem;
    }


    .merch-collection-garment-links a:nth-child(-n + 2) {
        border-bottom:
            1px solid #d7dfe3;
    }

}

/* =========================================================
   GARMENT NAV — MOBILE
========================================================= */

@media (max-width: 600px) {

    .merch-collection-garment-nav {
        padding: 4rem 0;
    }


    .merch-collection-garment-nav-heading {
        margin-bottom: 2rem;
    }


    .merch-collection-garment-links {
        display: grid;

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

        gap: 0.7rem;
    }


    .merch-collection-garment-links a {
        width: 100%;

        min-height: 52px;

        padding:
            0.75rem 0.8rem;

        text-align: center;

        font-size: 0.72rem;
    }

}

/* =========================================================
   COLLECTION MEANING / EDITORIAL STORY
========================================================= */

.merch-collection-meaning {
    padding: 7rem 0;

    background:
        linear-gradient(135deg,
            #e9e6df 0%,
            #f4f1eb 50%,
            #dedbd3 100%);

    position: relative;

    overflow: hidden;
}


.merch-collection-meaning::before {
    content: "";

    position: absolute;

    inset: 0;

    pointer-events: none;

    opacity: 0.28;

    background-image:
        radial-gradient(circle at 20% 25%,
            rgba(70, 76, 67, 0.14) 0,
            transparent 32%),
        radial-gradient(circle at 80% 70%,
            rgba(120, 108, 88, 0.12) 0,
            transparent 30%);
}


.merch-collection-meaning .container {
    position: relative;

    z-index: 1;
}


.merch-collection-meaning-layout {
    display: grid;

    grid-template-columns:
        minmax(0, 1.05fr) minmax(0, 0.95fr);

    align-items: center;

    gap: clamp(3rem, 7vw, 7rem);
}


.merch-collection-meaning-image-wrap {
    min-height: 460px;

    overflow: hidden;

    border-radius: 20px;

    background:
        linear-gradient(145deg,
            #d6d4cc,
            #ece9e2);

    box-shadow:
        0 24px 55px rgba(24, 35, 43, 0.10);
}


.merch-collection-meaning-image {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    object-position: center;
}


.merch-collection-meaning-copy {
    max-width: 580px;
}


.merch-collection-meaning-copy h2 {
    margin: 0;

    color: #28342f;

    font-size:
        clamp(2.5rem, 5vw, 4.5rem);

    font-weight: 850;

    line-height: 1;

    letter-spacing: -0.045em;
}


.merch-collection-meaning-copy p {
    margin: 1.5rem 0 0;

    color: #59635e;

    font-size: 1.05rem;

    line-height: 1.85;
}


/* =========================================================
   HEART / BADGE STORY
========================================================= */

.merch-collection-heart-story {
    padding: 7rem 0;

    background: #202a27;

    color: #ffffff;
}


.merch-collection-heart-story-layout {
    display: grid;

    grid-template-columns:
        minmax(300px, 0.8fr) minmax(0, 1.2fr);

    align-items: center;

    gap: clamp(3rem, 8vw, 8rem);
}


.merch-collection-heart-badge-wrap {
    display: flex;

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

    min-height: 380px;

    padding: 3rem;

    border: 1px solid rgba(255, 255, 255, 0.12);

    border-radius: 50%;

    background:
        radial-gradient(circle,
            rgba(255, 255, 255, 0.10) 0%,
            rgba(255, 255, 255, 0.03) 58%,
            transparent 72%);
}


.merch-collection-heart-badge {
    display: block;

    width: min(300px, 80%);

    height: auto;

    filter:
        drop-shadow(0 20px 35px rgba(0, 0, 0, 0.28));
}


.merch-collection-heart-copy {
    max-width: 650px;
}


.merch-collection-heart-copy h2 {
    margin: 0;

    color: #ffffff;

    font-size:
        clamp(2.5rem, 5vw, 4.5rem);

    font-weight: 850;

    line-height: 1;

    letter-spacing: -0.045em;
}


.merch-collection-heart-copy p {
    margin: 1.5rem 0 0;

    color: rgba(255, 255, 255, 0.74);

    font-size: 1.05rem;

    line-height: 1.85;
}


/* =========================================================
   SECONDARY COLLECTION EDITORIAL
========================================================= */

.merch-collection-editorial {
    padding: 7rem 0;

    background:
        linear-gradient(135deg,
            #f5f3ee 0%,
            #ffffff 55%,
            #eef0ed 100%);
}


.merch-collection-editorial-layout {
    display: grid;

    grid-template-columns:
        minmax(0, 0.9fr) minmax(0, 1.1fr);

    align-items: center;

    gap: clamp(3rem, 7vw, 7rem);
}


.merch-collection-editorial-copy {
    max-width: 600px;
}


.merch-collection-editorial-copy h2 {
    margin: 0;

    color: #28342f;

    font-size:
        clamp(2.5rem, 5vw, 4.5rem);

    font-weight: 850;

    line-height: 1;

    letter-spacing: -0.045em;
}


.merch-collection-editorial-copy p {
    margin: 1.5rem 0 0;

    color: #59635e;

    font-size: 1.05rem;

    line-height: 1.85;
}


.merch-collection-editorial-image-wrap {
    min-height: 460px;

    overflow: hidden;

    border-radius: 20px;

    background: #e6e8e4;

    box-shadow:
        0 24px 55px rgba(24, 35, 43, 0.10);
}


.merch-collection-editorial-image {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    object-position: center;
}

/* =========================================================
   COLLECTION STORY BRIDGE
   Emotional transition between hero and products
========================================================= */

.merch-collection-bridge {
    position: relative;

    padding:
        clamp(3.5rem, 6vw, 5.5rem) 0;

    overflow: hidden;

    background:
        linear-gradient(180deg,
            #ffffff 0%,
            #faf9f6 50%,
            #f4f2ed 100%);

    border-bottom:
        1px solid rgba(23, 59, 85, 0.08);
}


/* Subtle background texture / glow */
.merch-collection-bridge::before {
    content: "";

    position: absolute;

    width: 420px;
    height: 420px;

    top: 50%;
    left: 50%;

    transform:
        translate(-50%, -50%);

    border-radius: 50%;

    background:
        radial-gradient(circle,
            rgba(245, 166, 35, 0.08) 0%,
            rgba(245, 166, 35, 0.025) 45%,
            transparent 72%);

    pointer-events: none;
}


.merch-collection-bridge-inner {
    position: relative;
    z-index: 1;

    max-width: 820px;

    margin: 0 auto;

    text-align: center;
}


/* Heart divider */
.merch-collection-bridge-mark {
    display: flex;

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

    gap: 1rem;

    margin-bottom: 1.5rem;
}


.merch-collection-bridge-mark span {
    width: clamp(45px, 7vw, 90px);
    height: 1px;

    background:
        rgba(23, 59, 85, 0.20);
}


.merch-collection-bridge-mark i {
    color: #f5a623;

    font-size: 0.9rem;
}


/* Small collection label */
.merch-collection-bridge-eyebrow {
    margin:
        0 0 0.9rem;

    color: #f5a623;

    font-size: 0.74rem;
    font-weight: 900;

    letter-spacing: 0.18em;

    text-transform: uppercase;
}


/* Main bridge statement */
.merch-collection-bridge h2 {
    max-width: 760px;

    margin:
        0 auto;

    color: #173b55;

    font-size:
        clamp(2.2rem, 4.5vw, 4rem);

    font-weight: 850;

    line-height: 1.02;

    letter-spacing: -0.045em;
}


/* Supporting sentence */
.merch-collection-bridge-text {
    max-width: 650px;

    margin:
        1.25rem auto 0;

    color: #52636d;

    font-size:
        clamp(1rem, 1.5vw, 1.1rem);

    line-height: 1.8;
}


/* =========================================================
   PRODUCTS SECTION
========================================================= */

.merch-collection-products {
    padding: 6rem 0 7rem;

    background: #ffffff;
}


.merch-collection-products-heading {
    max-width: 760px;

    margin-bottom: 3rem;
}


.merch-collection-products-heading>span {
    display: inline-block;

    margin-bottom: 0.9rem;

    color: #f5a623;

    font-size: 0.74rem;
    font-weight: 900;

    letter-spacing: 0.18em;

    text-transform: uppercase;
}


.merch-collection-products-heading h2 {
    margin: 0;

    color: #173b55;

    font-size: clamp(2.3rem, 4.5vw, 4rem);
    font-weight: 850;

    line-height: 1;

    letter-spacing: -0.04em;
}


.merch-collection-products-heading p {
    max-width: 620px;

    margin: 1rem 0 0;

    color: #52636d;

    font-size: 1rem;

    line-height: 1.75;
}


/* =========================================================
   COLLECTION GRID
========================================================= */

.merch-collection-products .merch-catalog-grid {
    display: grid;

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

    gap: 2rem;
}


/* =========================================================
   EMPTY STATE
========================================================= */

.merch-collection-empty {
    max-width: 620px;

    margin: 2rem auto 0;

    padding: 3rem;

    text-align: center;

    border: 1px solid #dde3e6;

    border-radius: 16px;

    background: #f7f8f7;
}


.merch-collection-empty i {
    margin-bottom: 1rem;

    color: #f5a623;

    font-size: 2rem;
}


.merch-collection-empty h2 {
    margin: 0;

    color: #173b55;

    font-size: 2rem;
    font-weight: 850;
}


.merch-collection-empty p {
    margin: 1rem 0 0;

    color: #52636d;

    line-height: 1.7;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .merch-collection-hero-layout {
        grid-template-columns: 1fr;

        gap: 3rem;
    }


    .merch-collection-visual {
        min-height: 330px;
    }

    .merch-collection-meaning,
    .merch-collection-heart-story,
    .merch-collection-editorial {
        padding:
            4.5rem 0;
    }


    .merch-collection-meaning-layout,
    .merch-collection-heart-story-layout,
    .merch-collection-editorial-layout {
        gap: 2.5rem;
    }


    .merch-collection-meaning-image-wrap,
    .merch-collection-editorial-image-wrap {
        min-height: 0;

        aspect-ratio: 1 / 1;
    }


    .merch-collection-heart-badge-wrap {
        min-height: 280px;

        padding: 2rem;
    }


    .merch-collection-heart-badge {
        width: min(230px, 78%);
    }


    .merch-collection-meaning-copy h2,
    .merch-collection-heart-copy h2,
    .merch-collection-editorial-copy h2 {
        font-size:
            clamp(2.35rem, 11vw, 3.5rem);
    }

    .merch-collection-products .merch-catalog-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    .merch-collection-hero {
        padding:
            3.5rem 0 3rem;
    }


    .merch-collection-copy h1 {
        font-size:
            clamp(3rem, 15vw, 4.5rem);
    }

    .merch-collection-visual {
        min-height: 0;

        padding: 0;
    }

    .merch-collection-visual img {
        width: 100%;
        height: auto;

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

    /* NEW EDITORIAL MOBILE RULES */

    .merch-collection-meaning,
    .merch-collection-heart-story,
    .merch-collection-editorial {
        padding:
            4.5rem 0;
    }


    .merch-collection-meaning-layout,
    .merch-collection-heart-story-layout,
    .merch-collection-editorial-layout {
        gap: 2.5rem;
    }


    .merch-collection-meaning-image-wrap,
    .merch-collection-editorial-image-wrap {
        min-height: 0;

        aspect-ratio: 1 / 1;
    }


    .merch-collection-heart-badge-wrap {
        min-height: 280px;

        padding: 2rem;
    }


    .merch-collection-heart-badge {
        width: min(230px, 78%);
    }


    .merch-collection-meaning-copy h2,
    .merch-collection-heart-copy h2,
    .merch-collection-editorial-copy h2 {
        font-size:
            clamp(2.35rem, 11vw, 3.5rem);
    }

    .merch-collection-products {
        padding:
            4.5rem 0 5rem;
    }


    .merch-collection-products .merch-catalog-grid {
        grid-template-columns: 1fr;

        gap: 2rem;
    }


    .merch-collection-products-heading {
        margin-bottom: 2rem;
    }

    /* Collection story bridge */
    .merch-collection-bridge {
        padding:
            3.5rem 0;
    }

    .merch-collection-bridge-inner {
        max-width: 100%;
    }

    .merch-collection-bridge h2 {
        font-size:
            clamp(2rem, 10vw, 3rem);

        line-height: 1.05;
    }

    .merch-collection-bridge-text {
        font-size: 0.96rem;

        line-height: 1.7;
    }

    .merch-collection-bridge-mark {
        margin-bottom: 1.25rem;
    }


}





/* =========================================================
   LOVE COLLECTION THEME
========================================================= */

/* Love eyebrow */

.merch-collection-page[data-merch-collection="love"] .merch-collection-eyebrow {

    color: #a72d3a;
}


/* LOVE title */

.merch-collection-page[data-merch-collection="love"] .merch-collection-copy h1 {

    color: #421e24;
}


/* Hero statement */

.merch-collection-page[data-merch-collection="love"] .merch-collection-lead {

    color: #5c2931;
}


/* Supporting paragraph */

.merch-collection-page[data-merch-collection="love"] .merch-collection-description {

    color: #755b5e;
}


/* Back link */

.merch-collection-page[data-merch-collection="love"] .merch-collection-back a {

    color: #755b5e;
}


.merch-collection-page[data-merch-collection="love"] .merch-collection-back a:hover {

    color: #a72d3a;
}


/* =========================================================
   LOVE HERO IMAGE
========================================================= */

.merch-collection-page[data-merch-collection="love"] .merch-collection-visual {

    min-height: 0;

    aspect-ratio: 4 / 3;

    overflow: hidden;

    background: #f2dedc;

    border-radius: 20px;

    box-shadow:
        0 24px 55px rgba(66, 30, 36, 0.16);
}


.merch-collection-page[data-merch-collection="love"] .merch-collection-visual::before {

    background:
        linear-gradient(135deg,
            rgba(167, 45, 58, 0.035),
            transparent 55%);
}


.merch-collection-page[data-merch-collection="love"] .merch-collection-visual img {

    width: 100%;
    height: 100%;

    object-fit: cover;

    object-position: center;

    display: block;
}

/* =========================================================
   LOVE COLLECTION — STORY BRIDGE
========================================================= */

.merch-collection-page[data-merch-collection="love"] .merch-collection-bridge {
    background: #ffffff;

    border-bottom:
        1px solid rgba(66, 30, 36, 0.08);
}

.merch-collection-page[data-merch-collection="love"] .merch-collection-bridge::before {
    background: none;
}

.merch-collection-page[data-merch-collection="love"] .merch-collection-bridge-eyebrow {
    color: #a72d3a;
}

.merch-collection-page[data-merch-collection="love"] .merch-collection-bridge h2 {
    color: #421e24;
}

.merch-collection-page[data-merch-collection="love"] .merch-collection-bridge-text {
    color: #755b5e;
}

.merch-collection-page[data-merch-collection="love"] .merch-collection-bridge-mark span {
    background:
        rgba(66, 30, 36, 0.18);
}

.merch-collection-page[data-merch-collection="love"] .merch-collection-bridge-mark i {
    color: #a72d3a;
}

/* =========================================================
   LOVE COLLECTION — SHARED SECTION ACCENTS
========================================================= */

/* Shop Love eyebrow */
.merch-collection-page[data-merch-collection="love"] .merch-collection-products-heading>span {
    color: #a72d3a;
}


/* Explore By Garment eyebrow */
.merch-collection-page[data-merch-collection="love"] .merch-collection-garment-nav-heading>span {
    color: #a72d3a;
}

/* =========================================================
   LOVE COLLECTION — MEANING SECTION
========================================================= */

/* Keep the Love meaning section clean and white */
.merch-collection-page[data-merch-collection="love"] .merch-collection-meaning {
    background: #ffffff;
}


/* Remove the Resilience-style background texture */
.merch-collection-page[data-merch-collection="love"] .merch-collection-meaning::before {
    background: none;
    opacity: 0;
}


/* Love accent eyebrow */
.merch-collection-page[data-merch-collection="love"] .merch-collection-meaning .merch-collection-section-eyebrow {
    color: #a72d3a;
}


/* Love meaning headline */
.merch-collection-page[data-merch-collection="love"] .merch-collection-meaning-copy h2 {
    color: #421e24;
}


/* Warm supporting copy */
.merch-collection-page[data-merch-collection="love"] .merch-collection-meaning-copy p {
    color: #755b5e;
}


/* Make the approved image fill its frame */
.merch-collection-page[data-merch-collection="love"] .merch-collection-meaning-image-wrap {
    min-height: 0;
    aspect-ratio: 5 / 4;

    background: #ffffff;
}


/* Fill the complete image container */
.merch-collection-page[data-merch-collection="love"] .merch-collection-meaning-image {
    width: 100%;
    height: 100%;

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

/* =========================================================
   LOVE COLLECTION — HEART / BADGE STORY
========================================================= */

.merch-collection-page[data-merch-collection="love"] .merch-collection-heart-story {
    background: #421e24;
    color: #ffffff;
}


/* Love section eyebrow */
.merch-collection-page[data-merch-collection="love"] .merch-collection-heart-story .merch-collection-section-eyebrow {
    color: #d78b8f;
}


/* Love badge circle treatment */
.merch-collection-page[data-merch-collection="love"] .merch-collection-heart-badge-wrap {
    border:
        1px solid rgba(255, 255, 255, 0.12);

    background:
        radial-gradient(circle,
            rgba(167, 45, 58, 0.22) 0%,
            rgba(215, 139, 143, 0.08) 48%,
            transparent 72%);
}


/* Love badge headline */
.merch-collection-page[data-merch-collection="love"] .merch-collection-heart-copy h2 {
    color: #ffffff;
}


/* Love badge supporting text */
.merch-collection-page[data-merch-collection="love"] .merch-collection-heart-copy p {
    color:
        rgba(255, 255, 255, 0.78);
}

/* =========================================================
   LOVE — MOBILE LAYOUT FIX
========================================================= */

@media (max-width: 767px) {

    /* ---------------------------------------------
       LOVE MEANING — STACK INTO ONE COLUMN
    --------------------------------------------- */

    .merch-collection-page[data-merch-collection="love"] .merch-collection-meaning-layout {

        display: grid;

        grid-template-columns: 1fr;

        gap: 2rem;

        width: 100%;

        max-width: 100%;
    }


    .merch-collection-page[data-merch-collection="love"] .merch-collection-meaning-image-wrap {

        width: 100%;

        max-width: 100%;

        min-width: 0;

        min-height: 0;

        aspect-ratio: 5 / 4;

        margin: 0;
    }


    .merch-collection-page[data-merch-collection="love"] .merch-collection-meaning-copy {

        width: 100%;

        max-width: 100%;

        min-width: 0;

        padding: 0;
    }


    .merch-collection-page[data-merch-collection="love"] .merch-collection-meaning-copy h2 {

        width: 100%;

        max-width: 100%;

        margin: 0;

        font-size:
            clamp(2.25rem, 10vw, 3.2rem);

        line-height: 1.02;

        letter-spacing: -0.035em;

        overflow-wrap: normal;

        word-break: normal;
    }


    .merch-collection-page[data-merch-collection="love"] .merch-collection-meaning-copy p {

        width: 100%;

        max-width: 100%;

        font-size: 1rem;

        line-height: 1.75;
    }


    /* ---------------------------------------------
       LOVE HEART — STACK INTO ONE COLUMN
    --------------------------------------------- */

    .merch-collection-page[data-merch-collection="love"] .merch-collection-heart-story-layout {

        display: grid;

        grid-template-columns: 1fr;

        gap: 2rem;

        width: 100%;

        max-width: 100%;
    }


    .merch-collection-page[data-merch-collection="love"] .merch-collection-heart-badge-wrap {

        width: 100%;

        max-width: 100%;

        min-width: 0;

        min-height: 280px;

        margin: 0;

        padding: 2rem;

        box-sizing: border-box;
    }


    .merch-collection-page[data-merch-collection="love"] .merch-collection-heart-copy {

        width: 100%;

        max-width: 100%;

        min-width: 0;

        padding: 0;
    }


    .merch-collection-page[data-merch-collection="love"] .merch-collection-heart-copy h2 {

        width: 100%;

        max-width: 100%;

        margin: 0;

        font-size:
            clamp(2.25rem, 10vw, 3.2rem);

        line-height: 1.02;

        letter-spacing: -0.035em;

        overflow-wrap: normal;

        word-break: normal;
    }


    .merch-collection-page[data-merch-collection="love"] .merch-collection-heart-copy p {

        width: 100%;

        max-width: 100%;

        font-size: 1rem;

        line-height: 1.75;
    }


    /* ---------------------------------------------
       SECTION SPACING
    --------------------------------------------- */

    .merch-collection-page[data-merch-collection="love"] .merch-collection-meaning,

    .merch-collection-page[data-merch-collection="love"] .merch-collection-heart-story {

        padding: 4rem 0;

        overflow-x: hidden;
    }

}





/* =========================================================
   COURAGE COLLECTION — HERO IMAGE
========================================================= */

.merch-collection-page[data-merch-collection="courage"] .merch-collection-visual {
    min-height: 0;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-radius: 20px;
}

.merch-collection-page[data-merch-collection="courage"] .merch-collection-visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

/* =========================================================
   COURAGE COLLECTION — MEANING SECTION
========================================================= */

.merch-collection-page[data-merch-collection="courage"] .merch-collection-meaning {
    background:
        linear-gradient(135deg,
            #fffdf8 0%,
            #fff8e8 52%,
            #f6edd3 100%);
}


/* Remove the generic Resilience texture */
.merch-collection-page[data-merch-collection="courage"] .merch-collection-meaning::before {
    background:
        radial-gradient(circle at 18% 22%,
            rgba(245, 166, 35, 0.08) 0,
            transparent 32%),
        radial-gradient(circle at 82% 72%,
            rgba(212, 164, 47, 0.07) 0,
            transparent 30%);

    opacity: 1;
}


/* Courage eyebrow */
.merch-collection-page[data-merch-collection="courage"] .merch-collection-meaning .merch-collection-section-eyebrow {
    color: #d69210;
}


/* Courage headline */
.merch-collection-page[data-merch-collection="courage"] .merch-collection-meaning-copy h2 {
    color: #173b55;
}


/* Supporting copy */
.merch-collection-page[data-merch-collection="courage"] .merch-collection-meaning-copy p {
    color: #52636d;
}

/* =========================================================
   COURAGE COLLECTION — HEART / BADGE STORY
========================================================= */

.merch-collection-page[data-merch-collection="courage"] .merch-collection-heart-story {
    background:
        radial-gradient(circle at 22% 50%,
            rgba(245, 166, 35, 0.08) 0%,
            transparent 34%),
        linear-gradient(135deg,
            #18191a 0%,
            #232526 52%,
            #111314 100%);

    color: #ffffff;
}


/* Courage eyebrow */
.merch-collection-page[data-merch-collection="courage"] .merch-collection-heart-story .merch-collection-section-eyebrow {
    color: #f5a623;
}


/* Badge glow */
.merch-collection-page[data-merch-collection="courage"] .merch-collection-heart-badge-wrap {
    border:
        1px solid rgba(245, 166, 35, 0.14);

    background:
        radial-gradient(circle,
            rgba(245, 166, 35, 0.10) 0%,
            rgba(245, 166, 35, 0.035) 48%,
            transparent 72%);
}


/* Headline */
.merch-collection-page[data-merch-collection="courage"] .merch-collection-heart-copy h2 {
    color: #ffffff;
}


/* Supporting text */
.merch-collection-page[data-merch-collection="courage"] .merch-collection-heart-copy p {
    color:
        rgba(255, 255, 255, 0.76);
}

/* Courage meaning image frame */
.merch-collection-page[data-merch-collection="courage"] .merch-collection-meaning-image-wrap {
    min-height: 0;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: transparent;
}

.merch-collection-page[data-merch-collection="courage"] .merch-collection-meaning-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

/* =========================================================
   RESILIENCE COLLECTION — HERO IMAGE
========================================================= */

.merch-collection-page[data-merch-collection="resilience"] .merch-collection-visual {
    min-height: 0;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-radius: 20px;
}

.merch-collection-page[data-merch-collection="resilience"] .merch-collection-visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

/* =========================================================
   RESILIENCE — MOBILE LAYOUT FIX
========================================================= */

@media (max-width: 767px) {

    /* ---------------------------------------------
       RESILIENCE MEANING — STACK INTO ONE COLUMN
    --------------------------------------------- */

    .merch-collection-page[data-merch-collection="resilience"] .merch-collection-meaning-layout {

        display: grid;

        grid-template-columns: 1fr;

        gap: 2rem;

        width: 100%;

        max-width: 100%;
    }


    .merch-collection-page[data-merch-collection="resilience"] .merch-collection-meaning-image-wrap {

        width: 100%;

        max-width: 100%;

        min-width: 0;

        min-height: 0;

        margin: 0;
    }


    .merch-collection-page[data-merch-collection="resilience"] .merch-collection-meaning-copy {

        width: 100%;

        max-width: 100%;

        min-width: 0;

        padding: 0;
    }


    .merch-collection-page[data-merch-collection="resilience"] .merch-collection-meaning-copy h2 {

        width: 100%;

        max-width: 100%;

        margin: 0;

        font-size:
            clamp(2.25rem, 10vw, 3.2rem);

        line-height: 1.02;

        letter-spacing: -0.035em;

        overflow-wrap: normal;

        word-break: normal;
    }


    .merch-collection-page[data-merch-collection="resilience"] .merch-collection-meaning-copy p {

        width: 100%;

        max-width: 100%;

        font-size: 1rem;

        line-height: 1.75;
    }


    /* ---------------------------------------------
       RESILIENCE HEART — STACK INTO ONE COLUMN
    --------------------------------------------- */

    .merch-collection-page[data-merch-collection="resilience"] .merch-collection-heart-story-layout {

        display: grid;

        grid-template-columns: 1fr;

        gap: 2rem;

        width: 100%;

        max-width: 100%;
    }


    .merch-collection-page[data-merch-collection="resilience"] .merch-collection-heart-badge-wrap {

        width: 100%;

        max-width: 100%;

        min-width: 0;

        min-height: 280px;

        margin: 0;

        padding: 2rem;

        box-sizing: border-box;
    }


    .merch-collection-page[data-merch-collection="resilience"] .merch-collection-heart-copy {

        width: 100%;

        max-width: 100%;

        min-width: 0;

        padding: 0;
    }


    .merch-collection-page[data-merch-collection="resilience"] .merch-collection-heart-copy h2 {

        width: 100%;

        max-width: 100%;

        margin: 0;

        font-size:
            clamp(2.25rem, 10vw, 3.2rem);

        line-height: 1.02;

        letter-spacing: -0.035em;

        overflow-wrap: normal;

        word-break: normal;
    }


    .merch-collection-page[data-merch-collection="resilience"] .merch-collection-heart-copy p {

        width: 100%;

        max-width: 100%;

        font-size: 1rem;

        line-height: 1.75;
    }


    /* ---------------------------------------------
       SECTION SPACING
    --------------------------------------------- */

    .merch-collection-page[data-merch-collection="resilience"] .merch-collection-meaning,

    .merch-collection-page[data-merch-collection="resilience"] .merch-collection-heart-story {

        padding: 4rem 0;

        overflow-x: hidden;
    }

}



/* =========================================================
   COURAGE COLLECTION — MOBILE MEANING
========================================================= */

@media (max-width: 767px) {

    .merch-collection-page[data-merch-collection="courage"] .merch-collection-meaning-layout {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .merch-collection-page[data-merch-collection="courage"] .merch-collection-meaning-image-wrap {
        width: 100%;
        min-height: 0;
        aspect-ratio: 4 / 3;
    }

    .merch-collection-page[data-merch-collection="courage"] .merch-collection-meaning-copy {
        width: 100%;
        max-width: none;
    }

    .merch-collection-page[data-merch-collection="courage"] .merch-collection-meaning-copy h2 {
        font-size: clamp(2.4rem, 12vw, 3.25rem);
    }
}

/* =========================================================
   HOPE COLLECTION — HERO IMAGE
========================================================= */

.merch-collection-page[data-merch-collection="hope"] .merch-collection-visual {
    min-height: 0;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-radius: 20px;
}

.merch-collection-page[data-merch-collection="hope"] .merch-collection-visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

/* =========================================================
   HOPE COLLECTION THEME
   Soft gold + sunrise ivory
========================================================= */

/* =========================================================
   HOPE — HERO
========================================================= */

.merch-collection-page[data-merch-collection="hope"] .merch-collection-hero {
    background:
        linear-gradient(135deg,
            #fffdf7 0%,
            #fbf7ea 55%,
            #f3efe2 100%);

    border-bottom:
        1px solid rgba(214, 162, 30, 0.14);
}


/* Hope eyebrow */
.merch-collection-page[data-merch-collection="hope"] .merch-collection-eyebrow {
    color: #c58d0d;
}


/* Hope title */
.merch-collection-page[data-merch-collection="hope"] .merch-collection-copy h1 {
    color: #173b55;
}


/* Hero statement */
.merch-collection-page[data-merch-collection="hope"] .merch-collection-lead {
    color: #263843;
}


/* Supporting paragraph */
.merch-collection-page[data-merch-collection="hope"] .merch-collection-description {
    color: #5d6870;
}


/* Back link */
.merch-collection-page[data-merch-collection="hope"] .merch-collection-back a {
    color: #5d6870;
}


.merch-collection-page[data-merch-collection="hope"] .merch-collection-back a:hover {
    color: #c58d0d;
}


/* Give the Hope hero image a warmer shadow */
.merch-collection-page[data-merch-collection="hope"] .merch-collection-visual {
    background: #f5eedc;

    box-shadow:
        0 24px 55px rgba(126, 96, 30, 0.14);
}


/* Very subtle golden light over the image */
.merch-collection-page[data-merch-collection="hope"] .merch-collection-visual::before {
    background:
        linear-gradient(135deg,
            rgba(214, 162, 30, 0.025),
            transparent 55%);
}


/* =========================================================
   HOPE — STORY BRIDGE
========================================================= */

.merch-collection-page[data-merch-collection="hope"] .merch-collection-bridge {
    background:
        linear-gradient(180deg,
            #fffdf8 0%,
            #fbf7ed 52%,
            #f7f2e5 100%);

    border-bottom:
        1px solid rgba(214, 162, 30, 0.12);
}


/* Soft sunrise glow behind bridge copy */
.merch-collection-page[data-merch-collection="hope"] .merch-collection-bridge::before {
    background:
        radial-gradient(circle,
            rgba(214, 162, 30, 0.10) 0%,
            rgba(214, 162, 30, 0.035) 45%,
            transparent 72%);
}


/* HOPE LOOKS FORWARD */
.merch-collection-page[data-merch-collection="hope"] .merch-collection-bridge-eyebrow {
    color: #c58d0d;
}


/* Bridge heart */
.merch-collection-page[data-merch-collection="hope"] .merch-collection-bridge-mark i {
    color: #d6a21e;
}


/* Divider lines beside heart */
.merch-collection-page[data-merch-collection="hope"] .merch-collection-bridge-mark span {
    background:
        rgba(197, 141, 13, 0.24);
}


/* Main bridge headline */
.merch-collection-page[data-merch-collection="hope"] .merch-collection-bridge h2 {
    color: #173b55;
}


/* Bridge supporting text */
.merch-collection-page[data-merch-collection="hope"] .merch-collection-bridge-text {
    color: #5d6870;
}


/* =========================================================
   HOPE — SHARED SECTION ACCENTS
========================================================= */

/* SHOP HOPE */
.merch-collection-page[data-merch-collection="hope"] .merch-collection-products-heading>span {
    color: #c58d0d;
}


/* EXPLORE BY GARMENT */
.merch-collection-page[data-merch-collection="hope"] .merch-collection-garment-nav-heading>span {
    color: #c58d0d;
}


/* Meaning section eyebrow */
.merch-collection-page[data-merch-collection="hope"] .merch-collection-meaning .merch-collection-section-eyebrow {
    color: #c58d0d;
}


/* Heart / badge section eyebrow */
.merch-collection-page[data-merch-collection="hope"] .merch-collection-heart-story .merch-collection-section-eyebrow {
    color: #e0b94f;
}

/* =========================================================
   HOPE COLLECTION — MEANING SECTION
========================================================= */

.merch-collection-page[data-merch-collection="hope"] .merch-collection-meaning {
    background:
        linear-gradient(135deg,
            #fffdf8 0%,
            #fbf7eb 52%,
            #f5eedc 100%);
}


/* Replace the generic earthy texture with soft Hope light */
.merch-collection-page[data-merch-collection="hope"] .merch-collection-meaning::before {
    background:
        radial-gradient(circle at 18% 25%,
            rgba(214, 162, 30, 0.07) 0%,
            transparent 34%),
        radial-gradient(circle at 82% 72%,
            rgba(197, 141, 13, 0.045) 0%,
            transparent 32%);

    opacity: 1;
}


/* Hope meaning eyebrow */
.merch-collection-page[data-merch-collection="hope"] .merch-collection-meaning .merch-collection-section-eyebrow {
    color: #c58d0d;
}


/* Hope meaning headline */
.merch-collection-page[data-merch-collection="hope"] .merch-collection-meaning-copy h2 {
    color: #173b55;
}


/* Hope meaning supporting copy */
.merch-collection-page[data-merch-collection="hope"] .merch-collection-meaning-copy p {
    color: #5d6870;
}


/* Preserve the portrait mountain image */
.merch-collection-page[data-merch-collection="hope"] .merch-collection-meaning-image-wrap {
    min-height: 0;
    aspect-ratio: 4 / 5;

    background: #f5eedc;
}


/* Fill the complete image frame */
.merch-collection-page[data-merch-collection="hope"] .merch-collection-meaning-image {
    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;

    display: block;
}


/* =========================================================
   HOPE COLLECTION — HEART / BADGE STORY
========================================================= */

.merch-collection-page[data-merch-collection="hope"] .merch-collection-heart-story {
    background:
        radial-gradient(circle at 20% 50%,
            rgba(214, 162, 30, 0.12) 0%,
            transparent 34%),
        linear-gradient(135deg,
            #fffaf0 0%,
            #f8edcf 52%,
            #f1dfad 100%);

    color: #173b55;
}


/* THE HOPE HEART */
.merch-collection-page[data-merch-collection="hope"] .merch-collection-heart-story .merch-collection-section-eyebrow {
    color: #b77d00;
}


/* Hope badge circle */
.merch-collection-page[data-merch-collection="hope"] .merch-collection-heart-badge-wrap {
    border:
        1px solid rgba(197, 141, 13, 0.20);

    background:
        radial-gradient(circle,
            rgba(255, 255, 255, 0.70) 0%,
            rgba(214, 162, 30, 0.10) 48%,
            transparent 72%);
}


/* Hope Heart headline */
.merch-collection-page[data-merch-collection="hope"] .merch-collection-heart-copy h2 {
    color: #173b55;
}


/* Hope Heart supporting copy */
.merch-collection-page[data-merch-collection="hope"] .merch-collection-heart-copy p {
    color: #52636d;
}

/* =========================================================
   HOPE — MOBILE LAYOUT FIX
========================================================= */

@media (max-width: 767px) {

    /* ---------------------------------------------
       HOPE MEANING — STACK INTO ONE COLUMN
    --------------------------------------------- */

    .merch-collection-page[data-merch-collection="hope"] .merch-collection-meaning-layout {

        display: grid;

        grid-template-columns: 1fr;

        gap: 2rem;

        width: 100%;

        max-width: 100%;
    }


    .merch-collection-page[data-merch-collection="hope"] .merch-collection-meaning-image-wrap {

        width: 100%;

        max-width: 100%;

        min-width: 0;

        min-height: 0;

        aspect-ratio: 4 / 5;

        margin: 0;
    }


    .merch-collection-page[data-merch-collection="hope"] .merch-collection-meaning-copy {

        width: 100%;

        max-width: 100%;

        min-width: 0;

        padding: 0;
    }


    .merch-collection-page[data-merch-collection="hope"] .merch-collection-meaning-copy h2 {

        width: 100%;

        max-width: 100%;

        margin: 0;

        font-size:
            clamp(2.25rem, 10vw, 3.2rem);

        line-height: 1.02;

        letter-spacing: -0.035em;

        overflow-wrap: normal;

        word-break: normal;
    }


    .merch-collection-page[data-merch-collection="hope"] .merch-collection-meaning-copy p {

        width: 100%;

        max-width: 100%;

        font-size: 1rem;

        line-height: 1.75;
    }


    /* ---------------------------------------------
       HOPE HEART — STACK INTO ONE COLUMN
    --------------------------------------------- */

    .merch-collection-page[data-merch-collection="hope"] .merch-collection-heart-story-layout {

        display: grid;

        grid-template-columns: 1fr;

        gap: 2rem;

        width: 100%;

        max-width: 100%;
    }


    .merch-collection-page[data-merch-collection="hope"] .merch-collection-heart-badge-wrap {

        width: 100%;

        max-width: 100%;

        min-width: 0;

        min-height: 280px;

        margin: 0;

        padding: 2rem;

        box-sizing: border-box;
    }


    .merch-collection-page[data-merch-collection="hope"] .merch-collection-heart-copy {

        width: 100%;

        max-width: 100%;

        min-width: 0;

        padding: 0;
    }


    .merch-collection-page[data-merch-collection="hope"] .merch-collection-heart-copy h2 {

        width: 100%;

        max-width: 100%;

        margin: 0;

        font-size:
            clamp(2.25rem, 10vw, 3.2rem);

        line-height: 1.02;

        letter-spacing: -0.035em;

        overflow-wrap: normal;

        word-break: normal;
    }


    .merch-collection-page[data-merch-collection="hope"] .merch-collection-heart-copy p {

        width: 100%;

        max-width: 100%;

        font-size: 1rem;

        line-height: 1.75;
    }


    /* ---------------------------------------------
       SECTION SPACING
    --------------------------------------------- */

    .merch-collection-page[data-merch-collection="hope"] .merch-collection-meaning,

    .merch-collection-page[data-merch-collection="hope"] .merch-collection-heart-story {

        padding: 4rem 0;

        overflow-x: hidden;
    }

}




/* =========================================================
   COMPASSION COLLECTION THEME
   Soft blush + warm plum
========================================================= */


/* =========================================================
   COMPASSION — HERO
========================================================= */

.merch-collection-page[data-merch-collection="compassion"] .merch-collection-hero {
    background:
        linear-gradient(135deg,
            #fffefe 0%,
            #fdf5f7 55%,
            #f8ebef 100%);

    border-bottom:
        1px solid rgba(190, 87, 126, 0.12);
}


.merch-collection-page[data-merch-collection="compassion"] .merch-collection-eyebrow {
    color: #bd557c;
}


.merch-collection-page[data-merch-collection="compassion"] .merch-collection-copy h1 {
    color: #51283a;
}


.merch-collection-page[data-merch-collection="compassion"] .merch-collection-lead {
    color: #6a354d;
}


.merch-collection-page[data-merch-collection="compassion"] .merch-collection-description {
    color: #755d67;
}


.merch-collection-page[data-merch-collection="compassion"] .merch-collection-back a {
    color: #755d67;
}


.merch-collection-page[data-merch-collection="compassion"] .merch-collection-back a:hover {
    color: #bd557c;
}


/* =========================================================
   COMPASSION — HERO IMAGE
========================================================= */

.merch-collection-page[data-merch-collection="compassion"] .merch-collection-visual {
    min-height: 0;

    aspect-ratio: 4 / 3;

    overflow: hidden;

    background: #f8e9ee;

    border-radius: 20px;

    box-shadow:
        0 24px 55px rgba(81, 40, 58, 0.14);
}


.merch-collection-page[data-merch-collection="compassion"] .merch-collection-visual::before {
    background:
        linear-gradient(135deg,
            rgba(189, 85, 124, 0.035),
            transparent 55%);
}


.merch-collection-page[data-merch-collection="compassion"] .merch-collection-visual img {
    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;

    display: block;
}


/* =========================================================
   COMPASSION — STORY BRIDGE
========================================================= */

.merch-collection-page[data-merch-collection="compassion"] .merch-collection-bridge {
    background: #ffffff;

    border-bottom:
        1px solid rgba(81, 40, 58, 0.08);
}


.merch-collection-page[data-merch-collection="compassion"] .merch-collection-bridge::before {
    background:
        radial-gradient(circle,
            rgba(221, 133, 165, 0.08) 0%,
            rgba(221, 133, 165, 0.025) 46%,
            transparent 72%);
}


.merch-collection-page[data-merch-collection="compassion"] .merch-collection-bridge-eyebrow {
    color: #bd557c;
}


.merch-collection-page[data-merch-collection="compassion"] .merch-collection-bridge h2 {
    color: #51283a;
}


.merch-collection-page[data-merch-collection="compassion"] .merch-collection-bridge-text {
    color: #755d67;
}


.merch-collection-page[data-merch-collection="compassion"] .merch-collection-bridge-mark span {
    background:
        rgba(81, 40, 58, 0.18);
}


.merch-collection-page[data-merch-collection="compassion"] .merch-collection-bridge-mark i {
    color: #d7799c;
}


/* =========================================================
   COMPASSION — PRODUCTS
========================================================= */

.merch-collection-page[data-merch-collection="compassion"] .merch-collection-products-heading>span {
    color: #bd557c;
}


.merch-collection-page[data-merch-collection="compassion"] .merch-collection-products-heading h2 {
    color: #51283a;
}


.merch-collection-page[data-merch-collection="compassion"] .merch-collection-products-heading p {
    color: #755d67;
}


/* =========================================================
   COMPASSION — EXPLORE BY GARMENT
========================================================= */

.merch-collection-page[data-merch-collection="compassion"] .merch-collection-garment-nav-heading>span {
    color: #bd557c;
}


.merch-collection-page[data-merch-collection="compassion"] .merch-collection-garment-nav-heading h2 {
    color: #51283a;
}


.merch-collection-page[data-merch-collection="compassion"] .merch-collection-garment-nav-heading p {
    color: #755d67;
}


.merch-collection-page[data-merch-collection="compassion"] .merch-collection-garment-links a {
    color: #51283a;
}


.merch-collection-page[data-merch-collection="compassion"] .merch-collection-garment-links a:hover,
.merch-collection-page[data-merch-collection="compassion"] .merch-collection-garment-links a:focus-visible {
    color: #bd557c;

    background:
        rgba(189, 85, 124, 0.035);
}


/* =========================================================
   COMPASSION — MEANING
========================================================= */

.merch-collection-page[data-merch-collection="compassion"] .merch-collection-meaning {
    background: #ffffff;
}


.merch-collection-page[data-merch-collection="compassion"] .merch-collection-meaning::before {
    background: none;

    opacity: 0;
}


.merch-collection-page[data-merch-collection="compassion"] .merch-collection-meaning .merch-collection-section-eyebrow {
    color: #bd557c;
}


.merch-collection-page[data-merch-collection="compassion"] .merch-collection-meaning-copy h2 {
    color: #51283a;
}


.merch-collection-page[data-merch-collection="compassion"] .merch-collection-meaning-copy p {
    color: #755d67;
}


.merch-collection-page[data-merch-collection="compassion"] .merch-collection-meaning-image-wrap {
    min-height: 0;

    aspect-ratio: 5 / 4;

    background: #f9edf1;
}


.merch-collection-page[data-merch-collection="compassion"] .merch-collection-meaning-image {
    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;

    display: block;
}


/* =========================================================
   COMPASSION — HEART / BADGE STORY
========================================================= */

.merch-collection-page[data-merch-collection="compassion"] .merch-collection-heart-story {
    background:
        radial-gradient(circle at 20% 50%,
            rgba(215, 121, 156, 0.14) 0%,
            transparent 34%),
        linear-gradient(135deg,
            #452333 0%,
            #5a2c42 52%,
            #371c29 100%);

    color: #ffffff;
}


.merch-collection-page[data-merch-collection="compassion"] .merch-collection-heart-story .merch-collection-section-eyebrow {
    color: #efb4c9;
}


.merch-collection-page[data-merch-collection="compassion"] .merch-collection-heart-badge-wrap {
    border:
        1px solid rgba(255, 255, 255, 0.14);

    background:
        radial-gradient(circle,
            rgba(255, 255, 255, 0.12) 0%,
            rgba(215, 121, 156, 0.10) 48%,
            transparent 72%);
}


.merch-collection-page[data-merch-collection="compassion"] .merch-collection-heart-copy h2 {
    color: #ffffff;
}


.merch-collection-page[data-merch-collection="compassion"] .merch-collection-heart-copy p {
    color:
        rgba(255, 255, 255, 0.78);
}


/* =========================================================
   COMPASSION — MOBILE
========================================================= */

@media (max-width: 600px) {

    .merch-collection-page[data-merch-collection="compassion"] .merch-collection-meaning-layout {
        grid-template-columns: 1fr;

        gap: 2rem;
    }


    .merch-collection-page[data-merch-collection="compassion"] .merch-collection-meaning-image-wrap {
        width: 100%;

        min-height: 0;

        aspect-ratio: 5 / 4;
    }


    .merch-collection-page[data-merch-collection="compassion"] .merch-collection-meaning-copy {
        width: 100%;

        max-width: none;
    }

}

/* =========================================================
   COMPASSION — MOBILE LAYOUT FIX
========================================================= */

@media (max-width: 767px) {

    /* ---------------------------------------------
       COMPASSION MEANING — STACK INTO ONE COLUMN
    --------------------------------------------- */

    .merch-collection-page[data-merch-collection="compassion"] .merch-collection-meaning-layout {

        display: grid;

        grid-template-columns: 1fr;

        gap: 2rem;

        width: 100%;

        max-width: 100%;
    }


    .merch-collection-page[data-merch-collection="compassion"] .merch-collection-meaning-image-wrap {

        width: 100%;

        max-width: 100%;

        min-width: 0;

        min-height: 0;

        aspect-ratio: 5 / 4;

        margin: 0;
    }


    .merch-collection-page[data-merch-collection="compassion"] .merch-collection-meaning-copy {

        width: 100%;

        max-width: 100%;

        min-width: 0;

        padding: 0;
    }


    .merch-collection-page[data-merch-collection="compassion"] .merch-collection-meaning-copy h2 {

        width: 100%;

        max-width: 100%;

        margin: 0;

        font-size:
            clamp(2.25rem, 10vw, 3.2rem);

        line-height: 1.02;

        letter-spacing: -0.035em;

        overflow-wrap: normal;

        word-break: normal;
    }


    .merch-collection-page[data-merch-collection="compassion"] .merch-collection-meaning-copy p {

        width: 100%;

        max-width: 100%;

        font-size: 1rem;

        line-height: 1.75;
    }


    /* ---------------------------------------------
       COMPASSION HEART — STACK INTO ONE COLUMN
    --------------------------------------------- */

    .merch-collection-page[data-merch-collection="compassion"] .merch-collection-heart-story-layout {

        display: grid;

        grid-template-columns: 1fr;

        gap: 2rem;

        width: 100%;

        max-width: 100%;
    }


    .merch-collection-page[data-merch-collection="compassion"] .merch-collection-heart-badge-wrap {

        width: 100%;

        max-width: 100%;

        min-width: 0;

        min-height: 280px;

        margin: 0;

        padding: 2rem;

        box-sizing: border-box;
    }


    .merch-collection-page[data-merch-collection="compassion"] .merch-collection-heart-copy {

        width: 100%;

        max-width: 100%;

        min-width: 0;

        padding: 0;
    }


    .merch-collection-page[data-merch-collection="compassion"] .merch-collection-heart-copy h2 {

        width: 100%;

        max-width: 100%;

        margin: 0;

        font-size:
            clamp(2.25rem, 10vw, 3.2rem);

        line-height: 1.02;

        letter-spacing: -0.035em;

        overflow-wrap: normal;

        word-break: normal;
    }


    .merch-collection-page[data-merch-collection="compassion"] .merch-collection-heart-copy p {

        width: 100%;

        max-width: 100%;

        font-size: 1rem;

        line-height: 1.75;
    }


    /* ---------------------------------------------
       SECTION SPACING
    --------------------------------------------- */

    .merch-collection-page[data-merch-collection="compassion"] .merch-collection-meaning,

    .merch-collection-page[data-merch-collection="compassion"] .merch-collection-heart-story {

        padding: 4rem 0;

        overflow-x: hidden;
    }

}

/* =========================================================
   CALM COLLECTION THEME
   Gold + White Calm Identity
========================================================= */


/* ---------------------------------------------------------
   CALM — HERO COLORS
--------------------------------------------------------- */

body[data-merch-collection="calm"] {
    --calm-gold: #c99a2e;
    --calm-gold-bright: #e1ad32;
    --calm-ink: #344a5e;
    --calm-ink-dark: #263746;
    --calm-soft: #f8f6f0;
    --calm-white: #ffffff;
}


/* Eyebrow — CALM WARRIOR • CALM */

body[data-merch-collection="calm"] .merch-collection-eyebrow {
    color: var(--calm-gold);
    font-size: 0.82rem;
    font-weight: 800;
    letter-spacing: 0.16em;
}


/* Main CALM title */

body[data-merch-collection="calm"] .merch-collection-title {
    color: var(--calm-ink-dark);
    font-size: clamp(3.8rem, 6vw, 5.4rem);
    line-height: 0.95;
    letter-spacing: -0.045em;
}


/* Strength in Stillness */

body[data-merch-collection="calm"] .merch-collection-lead {
    color: var(--calm-ink-dark);
    font-size: clamp(1.25rem, 2vw, 1.55rem);
    font-weight: 750;
    line-height: 1.3;
}


/* Hero paragraph */

body[data-merch-collection="calm"] .merch-collection-description {
    color: var(--calm-ink);
    font-size: 1rem;
    line-height: 1.8;
    max-width: 34rem;
}


/* Back link */

body[data-merch-collection="calm"] .merch-collection-back-link {
    color: var(--calm-ink);
}

body[data-merch-collection="calm"] .merch-collection-back-link:hover {
    color: var(--calm-gold);
}


/* =========================================================
   CALM HERO IMAGE — TRUE 4:3 BANNER
========================================================= */

body[data-merch-collection="calm"] .merch-collection-visual {
    aspect-ratio: 4 / 3;
    min-height: 0;
    height: auto;
    overflow: hidden;
    border-radius: 22px;
    background: transparent;
    box-shadow:
        0 20px 45px rgba(38, 55, 70, 0.14);
}


/* Fill the complete 4:3 container */

body[data-merch-collection="calm"] .merch-collection-visual img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    border-radius: inherit;
}


/* =========================================================
   CALM STORY BRIDGE
========================================================= */

body[data-merch-collection="calm"] .merch-collection-bridge {
    background:
        linear-gradient(180deg,
            #ffffff 0%,
            #fbfaf6 100%);
}


/* Little bridge heart / decorative accent */

body[data-merch-collection="calm"] .merch-collection-bridge::before {
    color: var(--calm-gold);
}


body[data-merch-collection="calm"] .merch-collection-bridge-eyebrow {
    color: var(--calm-gold);
    font-weight: 800;
    letter-spacing: 0.16em;
}


/* Stillness Can Be a Form of Strength */

body[data-merch-collection="calm"] .merch-collection-bridge-title {
    color: var(--calm-ink-dark);
}


/* Bridge paragraph */

body[data-merch-collection="calm"] .merch-collection-bridge-text {
    color: var(--calm-ink);
}


/* =========================================================
   CALM — SHARED SECTION TYPOGRAPHY
========================================================= */

body[data-merch-collection="calm"] .merch-section-eyebrow,
body[data-merch-collection="calm"] .merch-meaning-eyebrow,
body[data-merch-collection="calm"] .merch-heart-eyebrow,
body[data-merch-collection="calm"] .merch-products-eyebrow {
    color: var(--calm-gold);
}


body[data-merch-collection="calm"] .merch-section-title,
body[data-merch-collection="calm"] .merch-meaning-title,
body[data-merch-collection="calm"] .merch-heart-title,
body[data-merch-collection="calm"] .merch-products-title {
    color: var(--calm-ink-dark);
}


/* =========================================================
   CALM — MOBILE
========================================================= */

@media (max-width: 767px) {

    body[data-merch-collection="calm"] .merch-collection-title {
        font-size: clamp(3.2rem, 15vw, 4.3rem);
    }

    body[data-merch-collection="calm"] .merch-collection-lead {
        font-size: 1.2rem;
    }

    body[data-merch-collection="calm"] .merch-collection-description {
        font-size: 0.96rem;
        line-height: 1.7;
    }

    body[data-merch-collection="calm"] .merch-collection-visual {
        width: 100%;
        aspect-ratio: 4 / 3;
        min-height: 0;
    }

}

/* =========================================================
   CALM COLLECTION — MEANING + HEART STORY
   Gold / White / Calm Blue Identity
========================================================= */


/* =========================================================
   CALM — MEANING SECTION
========================================================= */

.merch-collection-page[data-merch-collection="calm"] .merch-collection-meaning {
    background:
        linear-gradient(135deg,
            #fbfaf6 0%,
            #f5f2e9 52%,
            #eef2f4 100%);
}


/* Calm soft atmospheric texture */
.merch-collection-page[data-merch-collection="calm"] .merch-collection-meaning::before {
    opacity: 1;

    background:
        radial-gradient(circle at 18% 22%,
            rgba(201, 154, 46, 0.08) 0%,
            transparent 32%),
        radial-gradient(circle at 82% 70%,
            rgba(52, 74, 94, 0.08) 0%,
            transparent 32%);
}


/* THE MEANING */
.merch-collection-page[data-merch-collection="calm"] .merch-collection-meaning .merch-collection-section-eyebrow {
    color: #c99a2e;

    font-weight: 800;

    letter-spacing: 0.16em;
}


/* Calm Is Choosing Your Response */
.merch-collection-page[data-merch-collection="calm"] .merch-collection-meaning-copy h2 {
    color: #263746;

    font-size:
        clamp(2.8rem, 4.8vw, 4.4rem);

    line-height: 0.98;
}


/* Meaning supporting copy */
.merch-collection-page[data-merch-collection="calm"] .merch-collection-meaning-copy p {
    color: #52636d;

    font-size: 1.05rem;

    line-height: 1.85;
}


/* =========================================================
   CALM — MEANING IMAGE
   Fix white strip / preserve 4:3
========================================================= */

.merch-collection-page[data-merch-collection="calm"] .merch-collection-meaning-image-wrap {
    width: 100%;

    min-height: 0;

    aspect-ratio: 4 / 3;

    overflow: hidden;

    border-radius: 20px;

    background: transparent;

    box-shadow:
        0 24px 55px rgba(38, 55, 70, 0.13);
}


.merch-collection-page[data-merch-collection="calm"] .merch-collection-meaning-image {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    object-position: center center;
}


/* =========================================================
   CALM — HEART / BADGE STORY
========================================================= */

.merch-collection-page[data-merch-collection="calm"] .merch-collection-heart-story {
    background:
        linear-gradient(135deg,
            #263746 0%,
            #1f3242 52%,
            #182b3a 100%);

    color: #ffffff;
}


/* THE CALM HEART */
.merch-collection-page[data-merch-collection="calm"] .merch-collection-heart-story .merch-collection-section-eyebrow {
    color: #e1ad32;

    font-weight: 800;

    letter-spacing: 0.16em;
}


/* Badge circular treatment */
.merch-collection-page[data-merch-collection="calm"] .merch-collection-heart-badge-wrap {
    border:
        1px solid rgba(225, 173, 50, 0.28);

    background:
        radial-gradient(circle,
            rgba(225, 173, 50, 0.15) 0%,
            rgba(255, 255, 255, 0.035) 52%,
            transparent 72%);

    box-shadow:
        inset 0 0 45px rgba(225, 173, 50, 0.035);
}


/* Gold/white badge itself */
.merch-collection-page[data-merch-collection="calm"] .merch-collection-heart-badge {
    width: min(290px, 78%);

    filter:
        drop-shadow(0 20px 34px rgba(0, 0, 0, 0.28));
}


/* A Reminder to Return to Center */
.merch-collection-page[data-merch-collection="calm"] .merch-collection-heart-copy h2 {
    color: #ffffff;

    font-size:
        clamp(2.8rem, 4.8vw, 4.4rem);

    line-height: 0.98;
}


/* Heart supporting copy */
.merch-collection-page[data-merch-collection="calm"] .merch-collection-heart-copy p {
    color:
        rgba(255, 255, 255, 0.78);

    font-size: 1.05rem;

    line-height: 1.85;
}


/* =========================================================
   CALM — MOBILE
========================================================= */

@media (max-width: 767px) {

    .merch-collection-page[data-merch-collection="calm"] .merch-collection-meaning-image-wrap {
        width: 100%;

        min-height: 0;

        aspect-ratio: 4 / 3;
    }


    .merch-collection-page[data-merch-collection="calm"] .merch-collection-meaning-copy h2,
    .merch-collection-page[data-merch-collection="calm"] .merch-collection-heart-copy h2 {
        font-size:
            clamp(2.4rem, 11vw, 3.5rem);
    }


    .merch-collection-page[data-merch-collection="calm"] .merch-collection-heart-badge-wrap {
        min-height: 300px;

        padding: 2rem;
    }

}

/* =========================================================
   CALM — MOBILE RESIZING FIX
========================================================= */

@media (max-width: 767px) {

    /* ---------------------------------------------
       MEANING SECTION — STACK INTO ONE COLUMN
    --------------------------------------------- */

    .merch-collection-page[data-merch-collection="calm"] .merch-collection-meaning-layout {

        display: grid;

        grid-template-columns: 1fr;

        gap: 2rem;

        width: 100%;

        max-width: 100%;

    }


    .merch-collection-page[data-merch-collection="calm"] .merch-collection-meaning-image-wrap {

        width: 100%;

        max-width: 100%;

        min-width: 0;

        min-height: 0;

        aspect-ratio: 4 / 3;

        margin: 0;

    }


    .merch-collection-page[data-merch-collection="calm"] .merch-collection-meaning-image {

        width: 100%;

        height: 100%;

        object-fit: cover;

        object-position: center;

        display: block;

    }


    .merch-collection-page[data-merch-collection="calm"] .merch-collection-meaning-copy {

        width: 100%;

        max-width: 100%;

        min-width: 0;

        padding: 0;

    }


    .merch-collection-page[data-merch-collection="calm"] .merch-collection-meaning-copy h2 {

        width: 100%;

        max-width: 100%;

        margin: 0;

        font-size:
            clamp(2.25rem, 10vw, 3.2rem);

        line-height: 1.02;

        letter-spacing: -0.035em;

        overflow-wrap: normal;

        word-break: normal;

    }


    .merch-collection-page[data-merch-collection="calm"] .merch-collection-meaning-copy p {

        width: 100%;

        max-width: 100%;

        font-size: 1rem;

        line-height: 1.75;

    }


    /* ---------------------------------------------
       CALM HEART — STACK INTO ONE COLUMN
    --------------------------------------------- */

    .merch-collection-page[data-merch-collection="calm"] .merch-collection-heart-story-layout {

        display: grid;

        grid-template-columns: 1fr;

        gap: 2rem;

        width: 100%;

        max-width: 100%;

    }


    .merch-collection-page[data-merch-collection="calm"] .merch-collection-heart-badge-wrap {

        width: 100%;

        max-width: 100%;

        min-width: 0;

        min-height: 280px;

        margin: 0;

        padding: 2rem;

        box-sizing: border-box;

    }


    .merch-collection-page[data-merch-collection="calm"] .merch-collection-heart-copy {

        width: 100%;

        max-width: 100%;

        min-width: 0;

        padding: 0;

    }


    .merch-collection-page[data-merch-collection="calm"] .merch-collection-heart-copy h2 {

        width: 100%;

        max-width: 100%;

        margin: 0;

        font-size:
            clamp(2.25rem, 10vw, 3.2rem);

        line-height: 1.02;

        letter-spacing: -0.035em;

        overflow-wrap: normal;

        word-break: normal;

    }


    .merch-collection-page[data-merch-collection="calm"] .merch-collection-heart-copy p {

        width: 100%;

        max-width: 100%;

        font-size: 1rem;

        line-height: 1.75;

    }


    /* ---------------------------------------------
       SECTION SPACING / OVERFLOW
    --------------------------------------------- */

    .merch-collection-page[data-merch-collection="calm"] .merch-collection-meaning,

    .merch-collection-page[data-merch-collection="calm"] .merch-collection-heart-story {

        padding: 4rem 0;

        overflow-x: hidden;

    }

}