/* CONTENT */

.content_section {
    position: relative;

    width: 100%;

    padding-block: var(--section-space);
}


/* SECTION SIZES */

.content_section_small {
    padding-block: var(--space-2xl);
}

.content_section_large {
    padding-block: var(--space-4xl);
}


/* SECTION BACKGROUNDS */

.content_section_night {
    background-color: var(--color-noordnacht);
}

.content_section_anthracite {
    background-color: var(--color-antraciet);
}

.content_section_forest {
    background-color: var(--color-diep-bos);
}

.content_section_light {
    background-color: var(--color-mistcreme);
    color: var(--color-noordnacht);
}


/* CONTENT GRID */

.content_grid {
    display: grid;

    gap: var(--space-xl);
}

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

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

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

.content_grid_5 {
    grid-template-columns:
        repeat(5, minmax(0, 1fr));
}

.content_grid_6 {
    grid-template-columns:
        repeat(6, minmax(0, 1fr));
}


/* CONTENT LAYOUT */

.content_layout {
    display: grid;

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

    gap: var(--space-xl);
}

.content_span_12 {
    grid-column: span 12;
}

.content_span_9 {
    grid-column: span 9;
}

.content_span_8 {
    grid-column: span 8;
}

.content_span_7 {
    grid-column: span 7;
}

.content_span_6 {
    grid-column: span 6;
}

.content_span_5 {
    grid-column: span 5;
}

.content_span_4 {
    grid-column: span 4;
}

.content_span_3 {
    grid-column: span 3;
}


/* CONTENT SPLIT */

.content_split {
    display: grid;

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

    align-items: center;

    gap: var(--space-3xl);
}

.content_split_wide_left {
    grid-template-columns:
        minmax(0, 1.4fr)
        minmax(0, 0.6fr);
}

.content_split_wide_right {
    grid-template-columns:
        minmax(0, 0.6fr)
        minmax(0, 1.4fr);
}


/* ALIGNMENT */

.content_align_start {
    align-items: start;
}

.content_align_center {
    align-items: center;
}

.content_align_end {
    align-items: end;
}

.content_text_left {
    text-align: left;
}

.content_text_center {
    text-align: center;
}

.content_text_right {
    text-align: right;
}


/* CATEGORY FEATURE */

.content_category_feature {
    position: relative;

    z-index: 5;

    margin-top: -7rem;

    padding-bottom: var(--space-2xl);
}


/* CATEGORY FEATURE INNER */

.content_category_feature_inner {
    position: relative;

    z-index: 1;
}


/* CATEGORY GRID */

.content_category_grid {
    display: grid;

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

    gap: var(--space-sm);
}


/* CATEGORY CARD */

.content_category_card {
    position: relative;

    min-width: 0;
    min-height: 17rem;

    display: block;

    overflow: hidden;

    background-color: var(--color-antraciet);

    border:
        var(--border-width)
        solid
        var(--border-color-strong);

    border-radius: var(--radius-sm);

    color: var(--color-mistcreme);

    isolation: isolate;

    transition:
        border-color var(--transition-fast),
        transform var(--transition-normal);
}


/* CATEGORY IMAGE */

.content_category_image {
    position: absolute;
    inset: 0;

    z-index: 0;

    width: 100%;
    height: 100%;

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

    transition:
        transform var(--transition-slow);
}


/* CATEGORY OVERLAY */

.content_category_overlay {
    position: absolute;
    inset: 0;

    z-index: 1;

    background:
        linear-gradient(
            180deg,
            rgba(12, 15, 12, 0.06) 0%,
            rgba(12, 15, 12, 0.18) 34%,
            rgba(12, 15, 12, 0.48) 62%,
            rgba(12, 15, 12, 0.92) 100%
        );

    pointer-events: none;
}


/* CATEGORY CONTENT */

.content_category_content {
    position: relative;

    z-index: 2;

    min-height: 17rem;

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

    padding: var(--space-lg);
}


/* CATEGORY ICON */

.content_category_icon {
    display: block;

    width: 3.5rem;
    height: 3.5rem;

    flex-shrink: 0;

    margin-bottom: auto;

    object-fit: contain;
}


/* CATEGORY TEXT */

.content_category_text {
    width: 100%;

    margin-top: var(--space-xl);
}

.content_category_title {
    margin: 0;

    color: var(--color-mistcreme);

    font-family: var(--font-heading);
    font-size: 1.15rem;
    font-weight: 800;
    line-height: 1.1;

    letter-spacing: 0.04em;

    text-transform: uppercase;
}

.content_category_description {
    max-width: 22rem;

    min-height: calc(3em);

    margin-top: var(--space-sm);

    color: var(--color-mistcreme);

    font-family: var(--font-body);
    font-size: 0.8rem;
    font-weight: 400;
    line-height: 1.5;

    opacity: 0.78;
}


/* CATEGORY LINK */

.content_category_link {
    display: inline-flex;
    align-items: center;

    gap: var(--space-sm);

    margin-top: var(--space-lg);

    color: var(--color-warm-zand);

    font-family: var(--font-body);
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1;

    letter-spacing: 0.04em;
}

.content_category_link img {
    display: block;

    width: 0.9rem;
    height: auto;

    flex-shrink: 0;

    transition:
        transform var(--transition-fast);
}


/* CATEGORY HOVER */

.content_category_card:hover,
.content_category_card:focus-visible {
    border-color: var(--color-warm-zand);
}

.content_category_card:hover
.content_category_image,

.content_category_card:focus-visible
.content_category_image {
    transform: scale(1.04);
}

.content_category_card:hover
.content_category_link img,

.content_category_card:focus-visible
.content_category_link img {
    transform: translateX(0.25rem);
}


/* MEDIA */

.content_media {
    position: relative;

    overflow: hidden;

    border-radius: var(--radius-sm);
}

.content_media img {
    width: 100%;
    height: 100%;

    object-fit: cover;
}


/* COPY */

.content_copy {
    max-width: 42rem;
}

.content_copy_label {
    margin-bottom: var(--space-sm);

    color: var(--color-mosgroen);

    font-family: var(--font-heading);
    font-size: 0.8rem;
    font-weight: 800;
    line-height: 1.2;

    letter-spacing: var(--letter-spacing-nav);

    text-transform: uppercase;
}

.content_copy_title {
    max-width: 18ch;

    color: var(--color-mistcreme);

    font-family: var(--font-heading);
    font-size:
        clamp(
            2rem,
            4vw,
            3.5rem
        );

    font-weight: 800;
    line-height: 1;

    text-transform: uppercase;
}

.content_section_light
.content_copy_title {
    color: var(--color-noordnacht);
}

.content_copy_text {
    margin-top: var(--space-lg);

    color: inherit;

    font-family: var(--font-body);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.65;

    opacity: 0.78;
}

.content_copy_text p + p {
    margin-top: var(--space-md);
}


/* ACTIONS */

.content_actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;

    gap: var(--space-md);

    margin-top: var(--space-xl);
}


/* BUTTON */

.content_button {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: var(--space-sm);

    min-height: 3rem;

    padding-inline: var(--space-lg);

    border:
        var(--border-width)
        solid
        transparent;

    border-radius: var(--radius-sm);

    color: var(--color-mistcreme);

    font-family: var(--font-body);
    font-size: 0.85rem;
    font-weight: 500;
    line-height: 1;

    letter-spacing: var(--letter-spacing-nav);

    transition:
        background-color var(--transition-fast),
        border-color var(--transition-fast),
        color var(--transition-fast);
}

.content_button_primary {
    background-color: var(--color-mosgroen);

    border-color: var(--color-mosgroen);
}

.content_button_regular {
    background-color: transparent;

    border-color: var(--border-color-strong);
}

.content_button_primary:hover,
.content_button_primary:focus-visible,
.content_button_regular:hover,
.content_button_regular:focus-visible {
    background-color: var(--color-veldgoud);

    border-color: var(--color-veldgoud);

    color: var(--color-mistcreme);
}

.content_button_arrow {
    display: block;

    width: 1rem;
    height: auto;

    flex-shrink: 0;

    transition:
        transform var(--transition-fast);
}

.content_button:hover
.content_button_arrow,

.content_button:focus-visible
.content_button_arrow {
    transform: translateX(0.25rem);
}


/* TABLET */

@media (max-width: 64rem) {

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

    .content_category_feature {
        margin-top: -5rem;
    }

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

        gap: var(--space-md);
    }

    .content_split {
        gap: var(--space-2xl);
    }
}


/* MOBILE */

@media (max-width: 48rem) {

    .content_grid_2,
    .content_grid_3,
    .content_grid_4,
    .content_grid_5,
    .content_grid_6 {
        grid-template-columns: 1fr;
    }


    /* LAYOUT */

    .content_layout {
        grid-template-columns: 1fr;
    }

    .content_span_12,
    .content_span_9,
    .content_span_8,
    .content_span_7,
    .content_span_6,
    .content_span_5,
    .content_span_4,
    .content_span_3 {
        grid-column: auto;
    }


    /* SPLIT */

    .content_split,
    .content_split_wide_left,
    .content_split_wide_right {
        grid-template-columns: 1fr;

        gap: var(--space-xl);
    }


    /* CATEGORY */

    .content_category_feature {
        margin-top: -3rem;

        padding-bottom: var(--space-xl);
    }

    .content_category_grid {
        grid-template-columns: 1fr;

        gap: var(--space-md);
    }

    .content_category_card,
    .content_category_content {
        min-height: 15rem;
    }

    .content_category_content {
        padding: var(--space-lg);
    }

    .content_category_icon {
        width: 2.5rem;
        height: 2.5rem;
    }

    .content_category_title {
        font-size: 1.05rem;
    }


    /* COPY */

    .content_copy_title {
        font-size:
            clamp(
                1.8rem,
                9vw,
                2.75rem
            );
    }

    .content_copy_text {
        font-size: 0.95rem;
    }
}

/* ABOUT */

.content_about {
    position: relative;

    width: 100%;

    overflow: hidden;

    background-color: var(--color-noordnacht);

    border-top:
        var(--border-width)
        solid
        var(--border-color);

    border-bottom:
        var(--border-width)
        solid
        var(--border-color);
}


/* ABOUT LAYOUT */

.content_about_inner {
    display: grid;

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

    min-height: 32rem;
}


/* ABOUT COPY */

.content_about_copy {
    display: flex;
    align-items: center;

    padding:
        var(--space-2xl)
        var(--page-padding);
}

.content_about_copy_inner {
    width: min(
        100%,
        calc(
            (var(--content-width) / 2) -
            var(--page-padding)
        )
    );

    margin-left: auto;
}

.content_label {
    display: block;

    margin-bottom: var(--space-sm);

    color: var(--color-warm-zand);

    font-family: var(--font-heading);
    font-size: 0.75rem;
    font-weight: 800;
    line-height: 1.2;

    letter-spacing: var(--letter-spacing-nav);

    text-transform: uppercase;
}

.content_about_title {
    max-width: 18ch;

    color: var(--color-mistcreme);

    font-family: var(--font-heading);
    font-size:
        clamp(
            2rem,
            3.5vw,
            3.25rem
        );

    font-weight: 800;
    line-height: 1;

    text-transform: none;
}

.content_about_text {
    max-width: 38rem;

    margin-top: var(--space-lg);

    color: var(--color-mistcreme);

    font-family: var(--font-body);
    font-size: 0.9rem;
    font-weight: 400;
    line-height: 1.65;

    opacity: 0.74;
}

.content_about_text p + p {
    margin-top: var(--space-md);
}


/* ABOUT VALUES */

.content_about_values {
    display: grid;

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

    gap: var(--space-lg);

    margin-top: var(--space-2xl);
}

.content_about_value {
    min-width: 0;

    display: flex;
    flex-direction: column;

    gap: var(--space-sm);
}

.content_about_value:not(:last-child) {
    padding-right: var(--space-lg);

    border-right:
        var(--border-width)
        solid
        var(--border-color);
}

.content_about_value > img {
    width: 3.5rem;
    height: 3.5rem;

    object-fit: contain;
}

.content_about_value div {
    display: flex;
    flex-direction: column;

    gap: var(--space-xs);
}

.content_about_value_title {
    margin: 0;

    color: var(--color-mistcreme);

    font-family: var(--font-heading);
    font-size: 0.7rem;
    font-weight: 800;
    line-height: 1.3;

    letter-spacing: 0.04em;
}

.content_about_value_text {
    margin: 0;

    color: var(--color-mistcreme);

    font-family: var(--font-body);
    font-size: 0.68rem;
    font-weight: 400;
    line-height: 1.45;

    opacity: 0.62;
}


/* ABOUT BUTTON */

.content_about .content_button {
    margin-top: var(--space-2xl);
}


/* ABOUT VISUAL */

.content_about_visual {
    position: relative;

    min-width: 0;
    min-height: 32rem;

    overflow: hidden;
}

.content_about_visual_inner {
    position: relative;

    z-index: 2;

    width: min(
        100%,
        calc(
            (var(--content-width) / 2) +
            var(--page-padding)
        )
    );

    height: 100%;

    margin-right: auto;
}

.content_about_image {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

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

    filter:
        saturate(0.9)
        contrast(1.04);

    -webkit-mask-image:
        linear-gradient(
            270deg,
            #000 0%,
            #000 28%,
            rgba(0, 0, 0, 0.75) 58%,
            rgba(0, 0, 0, 0.35) 80%,
            transparent 100%
        );

    mask-image:
        linear-gradient(
            270deg,
            #000 0%,
            #000 28%,
            rgba(0, 0, 0, 0.75) 58%,
            rgba(0, 0, 0, 0.35) 80%,
            transparent 100%
        );

    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;

    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
}

.content_about_visual::after {
    content: "";

    position: absolute;
    inset: 0;

    z-index: 1;

    background:
        linear-gradient(
            90deg,
            rgba(12, 15, 12, 0.22) 0%,
            rgba(12, 15, 12, 0.04) 35%,
            rgba(12, 15, 12, 0.08) 100%
        );

    pointer-events: none;
}


/* FIELD NOTE */

.content_fieldnote {
    position: absolute;

    right: -3.5rem;
    bottom: -3.5rem;

    z-index: 2;

    width:
        clamp(
            14rem,
            20vw,
            18rem
        );

    aspect-ratio: 932 / 1375;

    transform: rotate(4deg);
}


/* FIELD NOTE PAPER */

.content_fieldnote_paper {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

    object-fit: fill;

    filter:
        drop-shadow(
            0 1rem 1.8rem
            rgba(0, 0, 0, 0.32)
        );
}


/* FIELD NOTE CLIP */

.content_fieldnote_clip {
    position: absolute;

    top: -1.5rem;
    right: 2.2rem;

    z-index: 3;

    width: 2.6rem;
    height: auto;

    transform: rotate(5.5rem);

    filter:
        drop-shadow(
            0 0.2rem 0.25rem
            rgba(0, 0, 0, 0.28)
        );
}


/* FIELD NOTE CONTENT */

.content_fieldnote_content {
    position: absolute;

    top: 21%;
    left: 13%;
    right: 13%;
    bottom: 18%;

    z-index: 2;

    display: flex;
    flex-direction: column;
}

.content_fieldnote_label {
    color: var(--color-veldgoud);

    font-family: var(--font-heading);
    font-size: 0.6rem;
    font-weight: 800;
    line-height: 1;

    letter-spacing: var(--letter-spacing-nav);

    text-transform: uppercase;
}

.content_fieldnote_text {
    margin-block: auto;

    color: var(--color-noordnacht);

    font-family: Georgia, "Times New Roman", serif;
    font-size:
        clamp(
            1rem,
            1.4vw,
            1.3rem
        );

    font-weight: 600;
    line-height: 1.45;
}

.content_fieldnote_source {
    color: var(--color-noordnacht);

    font-family: var(--font-body);
    font-size: 0.62rem;
    font-weight: 400;
    line-height: 1.3;

    opacity: 0.58;
}


/* ABOUT TABLET */

@media (max-width: 64rem) {

    .content_about_inner {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(0, 0.9fr);
    }

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

    .content_about_value:nth-child(2) {
        border-right: 0;
    }

    .content_about_value {
        padding-bottom: var(--space-md);
    }

    .content_fieldnote {
        right: var(--space-xl);

        width:
            clamp(
                13rem,
                24vw,
                16rem
            );
    }
}


/* ABOUT MOBILE */

@media (max-width: 48rem) {

    .content_about_inner {
        grid-template-columns: 1fr;
    }

    .content_about_copy {
        padding:
            var(--space-3xl)
            var(--page-padding);
    }

    .content_about_copy_inner {
        width: 100%;

        margin: 0;
    }

    .content_about_values {
        display: grid;

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

        gap:
            var(--space-xl)
            var(--space-lg);
    }

    .content_about_value {
        min-width: 0;

        padding: 0;

        border-right: 0;
    }

    .content_about_value:not(:last-child) {
        padding-right: 0;

        border-right: 0;
    }

    .content_about_visual {
        min-height: 30rem;
    }

    .content_about_image {
        object-position: center;

        -webkit-mask-image:
            linear-gradient(
                180deg,
                #000 0%,
                #000 28%,
                rgba(0, 0, 0, 0.8) 68%,
                rgba(0, 0, 0, 0.35) 90%,
                transparent 100%
            );

        mask-image:
            linear-gradient(
                180deg,
                #000 0%,
                #000 28%,
                rgba(0, 0, 0, 0.8) 68%,
                rgba(0, 0, 0, 0.35) 90%,
                transparent 100%
            );
    }

    .content_fieldnote {
        right: var(--space-lg);
        bottom: -1rem;

        width: min(52vw, 15rem);
    }
}


/* ABOUT SMALL MOBILE */

@media (max-width: 30rem) {

    .content_about_visual {
        min-height: 27rem;
    }

    .content_fieldnote {
        right: var(--space-md);

        width: min(58vw, 14rem);
    }
}

/* STORYTELLER */

.content_storyteller {
    position: relative;

    width: 100%;

    overflow: hidden;

    background-color: var(--color-noordnacht);

    border-top:
        var(--border-width)
        solid
        var(--border-color);

    border-bottom:
        var(--border-width)
        solid
        var(--border-color);
}


/* STORYTELLER LAYOUT */

.content_storyteller_inner {
    display: grid;

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

    min-height: 24rem;
}


/* STORYTELLER VISUAL */

.content_storyteller_visual {
    position: relative;

    min-width: 0;
    min-height: 24rem;

    overflow: hidden;
}

.content_storyteller_image {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

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

    filter:
        saturate(0.9)
        contrast(1.05);

    transition:
        transform var(--transition-slow);
}


/* STORYTELLER OVERLAY */

.content_storyteller_overlay {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            90deg,
            rgba(12, 15, 12, 0.05) 0%,
            rgba(12, 15, 12, 0.12) 55%,
            rgba(12, 15, 12, 0.82) 100%
        );

    pointer-events: none;
}


/* STORYTELLER COPY */

.content_storyteller_copy {
    display: flex;
    align-items: center;

    padding:
        var(--space-3xl)
        var(--page-padding);
}

.content_storyteller_copy_inner {
    width:
        min(
            100%,
            calc(
                (var(--content-width) * 0.6) -
                var(--page-padding)
            )
        );

    margin-right: auto;
}

.content_storyteller_title {
    max-width: 26ch;

    color: var(--color-mistcreme);

    font-family: var(--font-heading);
    font-size:
        clamp(
            2rem,
            3.25vw,
            3.25rem
        );

    font-weight: 800;
    line-height: 1.02;
}

.content_storyteller_text {
    max-width: 44rem;

    margin-top: var(--space-lg);

    color: var(--color-mistcreme);

    font-family: var(--font-body);
    font-size: 0.9rem;
    font-weight: 400;
    line-height: 1.65;

    opacity: 0.74;
}

.content_storyteller_text p + p {
    margin-top: var(--space-md);
}


/* STORYTELLER TABLET */

@media (max-width: 64rem) {

    .content_storyteller_inner {
        grid-template-columns:
            minmax(0, 0.9fr)
            minmax(0, 1.1fr);
    }

    .content_storyteller_copy {
        padding:
            var(--space-2xl)
            var(--page-padding);
    }

}


/* STORYTELLER MOBILE */

@media (max-width: 48rem) {

    .content_storyteller_inner {
        grid-template-columns: 1fr;
    }

    .content_storyteller_visual {
        min-height: 20rem;
    }

    .content_storyteller_overlay {
        background:
            linear-gradient(
                180deg,
                rgba(12, 15, 12, 0.02) 0%,
                rgba(12, 15, 12, 0.18) 55%,
                var(--color-noordnacht) 100%
            );
    }

    .content_storyteller_copy {
        padding:
            var(--space-2xl)
            var(--page-padding)
            var(--space-3xl);
    }

    .content_storyteller_copy_inner {
        width: 100%;

        margin: 0;
    }

    .content_storyteller_title {
        max-width: 18ch;

        font-size:
            clamp(
                1.9rem,
                9vw,
                2.75rem
            );
    }

    .content_storyteller_text {
        font-size: 0.95rem;
    }

    .content_storyteller .content_actions {
        width: 100%;
    }

}


/* STORYTELLER SMALL MOBILE */

@media (max-width: 30rem) {

    .content_storyteller_visual {
        min-height: 18rem;
    }

    .content_storyteller .content_actions {
        display: grid;

        grid-template-columns: 1fr;

        width: 100%;
    }

    .content_storyteller .content_button {
        width: 100%;
    }

}


/* PROMOTIONS */

.content_promotions {
    position: relative;

    width: 100%;

    padding-block: var(--section-space);

    background-color: var(--color-noordnacht);
}


/* PROMOTION GRID */

.content_promotion_grid {
    display: grid;

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

    gap: var(--space-sm);

    align-items: stretch;
}


/* PROMOTION CARD */

.content_promotion_card {
    position: relative;

    min-width: 0;
    min-height: 16rem;

    color: var(--color-mistcreme);

    background-color: var(--color-antraciet);

    border:
        var(--border-width)
        solid
        var(--border-color-strong);

    border-radius: var(--radius-sm);

    isolation: isolate;

    transition:
        border-color var(--transition-fast);
}

.content_promotion_card:hover,
.content_promotion_card:focus-visible {
    border-color: var(--color-warm-zand);
}


/* PARTNER CARD */

.content_promotion_card_partner {
    grid-column: span 2;

    min-height: 16rem;

    overflow: visible;

    background-color: var(--color-diep-bos);
}


/* PARTNER BACKGROUND WRAPPER */

.content_promotion_partner_background_wrap {
    position: absolute;
    inset: 0;

    z-index: 0;

    overflow: hidden;

    border-radius: inherit;
}


/* PARTNER BACKGROUND */

.content_promotion_partner_background {
    width: 100%;
    height: 100%;

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

    transition:
        transform var(--transition-slow);
}

.content_promotion_card_partner:hover
.content_promotion_partner_background,

.content_promotion_card_partner:focus-visible
.content_promotion_partner_background {
    transform: scale(1.04);
}


/* PARTNER OVERLAY */

.content_promotion_partner_overlay {
    position: absolute;
    inset: 0;

    z-index: 1;

    background:
        linear-gradient(
            90deg,
            rgba(12, 15, 12, 0.94) 0%,
            rgba(12, 15, 12, 0.82) 36%,
            rgba(53, 49, 23, 0.52) 62%,
            rgba(12, 15, 12, 0.16) 100%
        );

    pointer-events: none;
}


/* PARTNER CONTENT */

.content_promotion_partner_content {
    position: relative;

    z-index: 2;

    width: 56%;
    min-height: 16rem;

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

    padding: var(--space-xl);
}


/* PRODUCT IMAGE */

.content_promotion_product {
    position: absolute;

    right: 4%;
    bottom: 0;

    z-index: 3;

    width:
        min(
            43%,
            20rem
        );

    max-height: 125%;

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

    transform:
        translateY(-4%)
        scale(1);

    transform-origin: bottom center;

    transition:
        transform var(--transition-slow);

    pointer-events: none;
}

.content_promotion_card_partner:hover
.content_promotion_product,

.content_promotion_card_partner:focus-visible
.content_promotion_product {
    transform:
        translateY(-4%)
        scale(1.07);
}


/* PARTNER BADGE */

.content_promotion_badge {
    position: absolute;

    top: var(--space-md);
    right: var(--space-md);

    z-index: 4;

    padding:
        var(--space-xs)
        var(--space-sm);

    background-color:
        rgba(12, 15, 12, 0.72);

    border:
        var(--border-width)
        solid
        rgba(219, 206, 188, 0.22);

    border-radius: var(--radius-sm);

    color: var(--color-mistcreme);

    font-family: var(--font-body);
    font-size: 0.62rem;
    font-weight: 500;
    line-height: 1;

    letter-spacing: 0.06em;

    text-transform: uppercase;

    backdrop-filter:
        blur(0.5rem);

    -webkit-backdrop-filter:
        blur(0.5rem);
}


/* REGULAR CARD */

.content_promotion_card_regular {
    display: block;

    min-height: 16rem;

    overflow: hidden;
}


/* REGULAR IMAGE */

.content_promotion_image {
    position: absolute;
    inset: 0;

    z-index: 0;

    width: 100%;
    height: 100%;

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

    transition:
        transform var(--transition-slow);
}

.content_promotion_card_regular:hover
.content_promotion_image,

.content_promotion_card_regular:focus-visible
.content_promotion_image {
    transform: scale(1.05);
}


/* REGULAR OVERLAY */

.content_promotion_overlay {
    position: absolute;
    inset: 0;

    z-index: 1;

    background:
        linear-gradient(
            180deg,
            rgba(12, 15, 12, 0.06) 0%,
            rgba(12, 15, 12, 0.22) 38%,
            rgba(12, 15, 12, 0.92) 100%
        );

    pointer-events: none;
}


/* PROMOTION CONTENT */

.content_promotion_content {
    position: relative;

    z-index: 2;

    min-height: 16rem;

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

    padding: var(--space-lg);
}


/* PROMOTION LABEL */

.content_promotion_label {
    display: block;

    margin-bottom: var(--space-sm);

    color: var(--color-warm-zand);

    font-family: var(--font-heading);
    font-size: 0.65rem;
    font-weight: 800;
    line-height: 1;

    letter-spacing: var(--letter-spacing-nav);

    text-transform: uppercase;
}


/* PROMOTION TITLE */

.content_promotion_title {
    max-width: 18ch;

    margin: 0;

    color: var(--color-mistcreme);

    font-family: var(--font-heading);
    font-size:
        clamp(
            1.2rem,
            1.8vw,
            1.65rem
        );

    font-weight: 800;
    line-height: 1.05;
}


/* PROMOTION TEXT */

.content_promotion_text {
    max-width: 26rem;

    min-height: 3.5rem;

    margin-top: var(--space-sm);

    color: var(--color-mistcreme);

    font-family: var(--font-body);
    font-size: 0.75rem;
    font-weight: 400;
    line-height: 1.55;

    opacity: 0.72;
}


/* PROMOTION LINK */

.content_promotion_link {
    display: inline-flex;
    align-items: center;

    gap: var(--space-sm);

    margin-top: var(--space-lg);

    color: var(--color-warm-zand);

    font-family: var(--font-body);
    font-size: 0.72rem;
    font-weight: 500;
    line-height: 1;
}

.content_promotion_link img {
    display: block;

    width: 0.9rem;
    height: auto;

    flex-shrink: 0;

    transition:
        transform var(--transition-fast);
}

.content_promotion_card:hover
.content_promotion_link img,

.content_promotion_card:focus-visible
.content_promotion_link img {
    transform: translateX(0.25rem);
}


/* PROMOTIONS TABLET */

@media (max-width: 64rem) {

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

        gap: var(--space-md);
    }

    .content_promotion_card_partner {
        grid-column: 1 / -1;
    }

    .content_promotion_partner_content {
        width: 58%;
    }

    .content_promotion_product {
        width:
            min(
                40%,
                18rem
            );
    }
}


/* PROMOTIONS MOBILE */

@media (max-width: 48rem) {

    .content_promotion_grid {
        grid-template-columns: 1fr;

        gap: var(--space-md);
    }


    /* PARTNER */

    .content_promotion_card_partner {
        grid-column: auto;

        min-height: 21rem;
    }

    .content_promotion_partner_content {
        width: 100%;
        min-height: 21rem;

        padding:
            var(--space-xl)
            42%
            var(--space-xl)
            var(--space-lg);
    }

    .content_promotion_partner_background {
        object-position: center;
    }

    .content_promotion_partner_overlay {
        background:
            linear-gradient(
                90deg,
                rgba(12, 15, 12, 0.94) 0%,
                rgba(12, 15, 12, 0.78) 48%,
                rgba(12, 15, 12, 0.25) 100%
            );
    }

    .content_promotion_product {
        right: -2%;
        bottom: 0;

        width: 48%;

        max-height: 95%;

        transform:
            translateY(-2%)
            scale(1);
    }

    .content_promotion_card_partner:hover
    .content_promotion_product,

    .content_promotion_card_partner:focus-visible
    .content_promotion_product {
        transform:
            translateY(-2%)
            scale(1.06);
    }

    .content_promotion_badge {
        top: var(--space-sm);
        right: var(--space-sm);
    }


    /* REGULAR */

    .content_promotion_card_regular,
    .content_promotion_content {
        min-height: 15rem;
    }
}


/* PROMOTIONS SMALL MOBILE */

@media (max-width: 30rem) {

    .content_promotion_card_partner {
        min-height: 25rem;
    }

    .content_promotion_partner_content {
        min-height: 25rem;

        padding:
            var(--space-xl)
            var(--space-lg)
            11rem;
    }

    .content_promotion_partner_overlay {
        background:
            linear-gradient(
                180deg,
                rgba(12, 15, 12, 0.88) 0%,
                rgba(12, 15, 12, 0.68) 50%,
                rgba(12, 15, 12, 0.20) 100%
            );
    }

    .content_promotion_product {
        right: 50%;
        bottom: -0.5rem;

        width: 65%;

        max-height: 12rem;

        transform:
            translateX(50%)
            scale(1);
    }

    .content_promotion_card_partner:hover
    .content_promotion_product,

    .content_promotion_card_partner:focus-visible
    .content_promotion_product {
        transform:
            translateX(50%)
            scale(1.06);
    }
}