/* Gabrielle static — desktop-first, component-grouped responsive CSS */

/* ── Foundations ─────────────────────────────────────────────── */

*,
*::before,
*::after {
    box-sizing: border-box;
}

:root {
    --color-cream: #f1efe6;
    --color-white: #ffffff;
    --color-black: #000000;
    --color-footer-text: #fef5fd;
    --color-overlay: rgba(0, 0, 0, 0.3);
    --color-neon-pink: #dd59c9;
    --color-about-pink: #f3b4ea;
    --color-navy: #052649;
    --color-deep-turquoise: #004151;
    --color-oxblood: #7c2020;
    --color-oxblood-dark: #4a0d0d;
    --header-height: 76px;
    --viewport-content-height: calc(
        100svh - var(--header-height) - var(--wp-admin--admin-bar--height, 0px)
    );
    --page-gutter: 40px;
    --page-max-width: 1440px;
    --pill-radius: 999px;
    --pill-border: 1px solid var(--color-black);
    --pill-padding-y: 8px;
    --pill-padding-x: 12px;
    --pill-gap: 12px;
    --pill-text-size: 14px;
    --pill-line-height: 20px;
    --focus-ring: 2px solid rgba(0, 0, 0, 0.7);
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    min-width: 320px;
    font-family: "Neue Montreal", Arial, sans-serif;
    background: var(--color-white);
    color: var(--color-black);
}

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

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

ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

body.has-nav-open {
    overflow: hidden;
}

/* Tablet: Foundations */
@media (max-width: 1024px) {
    :root {
        --page-gutter: 24px;
        --pill-gap: 6px;
        --pill-padding-x: 8px;
        --pill-text-size: 13px;
    }
}

/* Mobile: Foundations */
@media (max-width: 767px) {
    :root {
        --header-height: 64px;
        --page-gutter: 16px;
    }

    main {
        overflow: clip;
    }
}
/* ── Shared components ─────────────────────────────────────────────── */

.button-pill {
    --button-pill-font-size: 1rem;
    --button-pill-line-height: 1.5;
    --button-pill-padding-y: 16px;
    --button-pill-padding-x: 20px;
    display: inline-block;
    vertical-align: middle;
    border-radius: 999px;
    background: var(--color-white);
    overflow: hidden;
    font-family: "Neue Montreal", Arial, sans-serif;
    font-size: var(--button-pill-font-size);
    font-weight: 500;
    line-height: var(--button-pill-line-height);
    text-transform: uppercase;
    white-space: nowrap;
    color: var(--color-black);
    text-align: center;
    isolation: isolate;
    position: relative;
}

.button-pill--square {
    border-radius: 0;
}

.button-pill--sm {
    --button-pill-font-size: 14px;
    --button-pill-line-height: 20px;
    --button-pill-padding-y: 10px;
    --button-pill-padding-x: 16px;
}

.button-pill__label,
.button-pill__hover {
    display: block;
    white-space: nowrap;
    transition: transform 180ms ease;
}

.button-pill__label {
    position: relative;
    z-index: 1;
    color: var(--color-black);
    padding: var(--button-pill-padding-y) var(--button-pill-padding-x);
}

.button-pill__hover {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-white);
    transform: translateY(100%);
    isolation: isolate;
}

.button-pill__hover::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 155%;
    aspect-ratio: 213 / 96;
    background-image: url("data:image/svg+xml,%3Csvg width='213' height='96' viewBox='0 0 213 96' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cellipse cx='106.5' cy='48' rx='106.5' ry='48' fill='%23DD59C9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    transform: translate(-50%, 0%);
    transition: transform 180ms ease;
    z-index: -1;
}

.button-pill:hover .button-pill__label,
.button-pill:focus-visible .button-pill__label {
    transform: translateY(-140%);
}

.button-pill:hover .button-pill__hover,
.button-pill:focus-visible .button-pill__hover {
    transform: translateY(0);
}

.button-pill:hover .button-pill__hover::before,
.button-pill:focus-visible .button-pill__hover::before {
    transform: translate(-50%, -50%);
}

.button-pill:focus-visible {
    outline: var(--focus-ring);
    outline-offset: 3px;
}

.button-pill--pink {
    background: var(--color-neon-pink);
}

.button-pill--pink .button-pill__label {
    color: var(--color-white);
}

.button-pill--pink .button-pill__hover::before {
    background-image: url("data:image/svg+xml,%3Csvg width='213' height='96' viewBox='0 0 213 96' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cellipse cx='106.5' cy='48' rx='106.5' ry='48' fill='%23000000'/%3E%3C/svg%3E");
}

.section-line {
    display: block;
    width: 100%;
}

.section-line__image {
    width: 100%;
    height: auto;
}

/* Mobile: Shared components */
@media (max-width: 767px) {
    .button-pill {
        --button-pill-font-size: 14px;
        --button-pill-padding-y: 10px;
        --button-pill-padding-x: 16px;
    }

    .button-pill--sm {
        --button-pill-padding-x: 16px;
    }
}
/* ── Header & navigation ─────────────────────────────────────────────── */

.site-shell {
    min-height: 100vh;
    overflow: clip;
}

.site-header {
    position: sticky;
    top: 0;
    z-index: 20;
}

.woocommerce-site-shell > .wp-block-template-part:has(.site-header),
.single-post .site-shell > .wp-block-template-part:has(.site-header) {
    display: contents;
}

body.admin-bar .site-header {
    top: var(--wp-admin--admin-bar--height, 32px);
}

.site-nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    max-width: var(--page-max-width);
    margin: 0 auto;
    padding: 0 var(--page-gutter);
    height: var(--header-height);
}

.site-nav__menus {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    width: 100%;
}

.site-nav__links {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    width: 100%;
}

.nav-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--pill-gap);
    width: 100%;
}

.nav-list-left {
    grid-area: left;
    justify-content: flex-start;
}

.nav-list-right {
    grid-area: right;
    justify-content: flex-end;
}

.site-logo-wrap {
    position: fixed;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    height: var(--header-height);
    display: flex;
    justify-content: center;
    align-items: center;
    width: max-content;
    z-index: 60;
    mix-blend-mode: difference;
    pointer-events: auto;
}

body.admin-bar .site-logo-wrap {
    top: var(--wp-admin--admin-bar--height, 32px);
}

@media screen and (max-width: 600px) {
    body.admin-bar .site-logo-wrap {
        top: var(
            --gabrielle-mobile-admin-bar-offset,
            var(--wp-admin--admin-bar--height, 46px)
        );
    }

    body.admin-bar .site-header {
        top: 0;
    }
}

.site-logo {
    grid-area: logo;
    width: 114px;
    height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    pointer-events: auto;
}

.site-logo img {
    width: 114px;
    height: 52px;
    mix-blend-mode: difference;
}

.nav-menu-toggle {
    display: none;
    align-items: center;
    justify-content: center;
    width: 80px;
    min-height: 40px;
    padding: 8px 12px;
    border: var(--pill-border);
    border-radius: var(--pill-radius);
    background-color: var(--color-neon-pink);
    background-image: url("../images/nav-pill-menu-bg.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    color: var(--color-white);
    cursor: pointer;
    font-family: "Neue Montreal", Arial, sans-serif;
    font-weight: 700;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0;
    text-align: center;
    text-transform: uppercase;
    overflow: hidden;
    transition:
        transform 180ms ease,
        box-shadow 180ms ease;
}

.nav-menu-toggle:focus-visible {
    outline: var(--focus-ring);
    outline-offset: 3px;
}

.nav-menu-toggle__label {
    display: block;
    pointer-events: none;
}

.nav-menu-toggle__label--close {
    display: none;
}

.site-nav__meta {
    display: none;
}

.site-nav__meta-link {
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    text-align: center;
}

.site-nav__meta-link--email {
    text-transform: uppercase;
}

.nav-pill {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    border: var(--pill-border);
    border-radius: var(--pill-radius);
    background: var(--color-white);
    overflow: hidden;
    font-size: var(--pill-text-size);
    font-weight: 700;
    line-height: var(--pill-line-height);
    text-align: center;
    text-transform: uppercase;
    transition:
        background-color 180ms ease,
        color 180ms ease,
        transform 180ms ease;
}

.nav-pill__label,
.nav-pill__hover {
    display: block;
    white-space: nowrap;
    transition: transform 180ms ease;
}

.nav-pill__label {
    padding: var(--pill-padding-y) var(--pill-padding-x);
    color: var(--color-black);
}

.nav-pill__hover {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    font-family: inherit;
    font-size: inherit;
    color: var(--color-white);
    transform: translateY(100%);
}

.nav-pill--gallery .nav-pill__hover {
    background-image: url("../images/nav-pill-gallery-hover.avif");
}

.nav-pill--services .nav-pill__hover {
    background-image: url("../images/nav-pill-services-hover.avif");
}

.nav-pill--about .nav-pill__hover {
    background-image: url("../images/nav-pill-about-hover.avif");
}

.nav-pill--blog .nav-pill__hover {
    background-image: url("../images/nav-pill-blog-hover.png");
}

.nav-pill--contact .nav-pill__hover {
    background-image: url("../images/nav-pill-contact-hover.avif");
}

.nav-pill:hover,
.nav-pill:focus-visible {
    color: var(--color-white);
}

.nav-pill:hover .nav-pill__label,
.nav-pill:focus-visible .nav-pill__label {
    transform: translateY(-100%);
}

.nav-pill:hover .nav-pill__hover,
.nav-pill:focus-visible .nav-pill__hover {
    transform: translateY(0);
}

.nav-pill:focus-visible,
.site-logo:focus-visible {
    outline: var(--focus-ring);
    outline-offset: 3px;
}

.nav-shop-item {
    display: flex;
    justify-content: center;
    align-items: center;
}

.nav-shop-icon {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border: var(--pill-border);
    border-radius: var(--pill-radius);
    background: var(--color-white);
    color: var(--color-black);
    overflow: visible;
    transition:
        background-color 180ms ease,
        color 180ms ease,
        transform 180ms ease;
}

.nav-shop-icon__glyph-window {
    position: relative;
    display: block;
    width: 18px;
    height: 20px;
    overflow: hidden;
}

.nav-shop-icon__glyph {
    position: absolute;
    inset: 0;
    display: block;
    transform: translateY(0);
    transition: transform 180ms ease;
}

.nav-shop-icon__glyph::before {
    content: "";
    position: absolute;
    left: 3px;
    top: 0;
    width: 12px;
    height: 9px;
    border: 2px solid currentColor;
    border-bottom: 0;
    border-radius: 999px 999px 0 0;
}

.nav-shop-icon__glyph::after {
    content: "";
    position: absolute;
    left: 1px;
    right: 1px;
    bottom: 0;
    height: 16px;
    border: 2px solid currentColor;
    border-radius: 2px;
}

.nav-shop-icon__glyph--hover {
    color: var(--color-white);
    transform: translateY(120%);
}

.nav-shop-icon__text {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    overflow: hidden;
    white-space: nowrap;
}

.nav-shop-icon__count {
    position: absolute;
    top: -6px;
    right: -6px;
    z-index: 1;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    border-radius: 999px;
    background: var(--color-neon-pink);
    color: var(--color-white);
    font-size: 10px;
    font-weight: 700;
    line-height: 16px;
    text-align: center;
}

.nav-shop-icon:hover,
.nav-shop-icon:focus-visible {
    background: var(--color-neon-pink);
    color: var(--color-white);
}

.nav-shop-icon:hover .nav-shop-icon__glyph:not(.nav-shop-icon__glyph--hover),
.nav-shop-icon:focus-visible
    .nav-shop-icon__glyph:not(.nav-shop-icon__glyph--hover) {
    transform: translateY(-120%);
}

.nav-shop-icon:hover .nav-shop-icon__glyph--hover,
.nav-shop-icon:focus-visible .nav-shop-icon__glyph--hover {
    transform: translateY(0);
}

.nav-shop-icon:focus-visible {
    outline: var(--focus-ring);
    outline-offset: 3px;
}

body.has-cart-drawer-open {
    overflow: hidden;
}

.cart-drawer {
    position: fixed;
    inset: 0;
    z-index: 1000;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transition:
        opacity 240ms ease,
        visibility 0s linear 240ms;
}

.cart-drawer.is-open {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
    transition:
        opacity 240ms ease,
        visibility 0s linear 0s;
}

.cart-drawer__backdrop {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: rgba(0, 0, 0, 0.38);
    cursor: pointer;
}

.cart-drawer__panel {
    position: absolute;
    top: var(--wp-admin--admin-bar--height, 0px);
    bottom: 0;
    right: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    width: min(470px, 100vw);
    padding: 28px 28px 24px;
    border-left: var(--pill-border);
    background: var(--color-white);
    color: var(--color-black);
    transform: translate3d(100%, 0, 0);
    transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

@media screen and (max-width: 767px) {
    .cart-drawer__panel {
        border: none;
        top: 0;
    }
}

.cart-drawer.is-open .cart-drawer__panel {
    transform: translate3d(0, 0, 0);
}

.cart-drawer__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    padding-bottom: 18px;
    border-bottom: var(--pill-border);
}

.cart-drawer__title {
    margin: 0;
    font-family: "Armany", serif;
    font-size: clamp(4.5rem, 8vw, 6rem);
    font-weight: 500;
    line-height: 0.78;
    letter-spacing: 0;
}

.cart-drawer__close,
.cart-drawer__button,
.cart-drawer__coupon-button {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 9px 18px;
    border: var(--pill-border);
    border-radius: var(--pill-radius);
    background:
        linear-gradient(var(--color-neon-pink), var(--color-neon-pink)) 50%
            100% / 100% 0 no-repeat,
        var(--color-white);
    color: var(--color-black);
    cursor: pointer;
    font-family: "Neue Montreal", Arial, sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    text-transform: uppercase;
    transition:
        background-size 180ms ease,
        border-color 180ms ease,
        color 180ms ease;
}

.cart-drawer__button--primary,
.cart-drawer__coupon-button {
    background:
        linear-gradient(var(--color-neon-pink), var(--color-neon-pink)) 50%
            100% / 100% 0 no-repeat,
        var(--color-black);
    color: var(--color-white);
}

.cart-drawer__close:hover,
.cart-drawer__close:focus-visible,
.cart-drawer__button:hover,
.cart-drawer__button:focus-visible,
.cart-drawer__coupon-button:hover,
.cart-drawer__coupon-button:focus-visible {
    border-color: var(--color-neon-pink);
    background-size: 100% 100%;
    color: var(--color-white);
}

.cart-drawer__close:focus-visible,
.cart-drawer__button:focus-visible,
.cart-drawer__coupon-button:focus-visible,
.cart-drawer__coupon-toggle:focus-visible,
.cart-drawer__remove:focus-visible {
    outline: var(--focus-ring);
    outline-offset: 3px;
}

.cart-drawer__content {
    display: flex;
    min-height: 0;
    flex-direction: column;
    overflow: hidden;
}

.cart-drawer__items {
    margin: 0;
    padding: 22px 0;
    border-bottom: var(--pill-border);
    overflow: auto;
}

.cart-drawer__item {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
    gap: 16px;
    padding: 0;
}

.cart-drawer__item + .cart-drawer__item {
    margin-top: 22px;
    padding-top: 22px;
    border-top: var(--pill-border);
}

.cart-drawer__item-media,
.cart-drawer__item-media a {
    display: block;
}

.cart-drawer__item-image {
    width: 92px;
    height: 92px;
    object-fit: cover;
}

.cart-drawer__item-body {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 16px;
    align-items: start;
}

.cart-drawer__item-copy {
    min-width: 0;
}

.cart-drawer__item-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.cart-drawer__item-title {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.15;
}

.cart-drawer__remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: auto;
    height: auto;
    color: var(--color-black);
    font-size: 20px;
    font-weight: 400;
    line-height: 1;
    opacity: 0;
    pointer-events: none;
    text-decoration: none;
    transition:
        color 160ms ease,
        opacity 160ms ease;
    visibility: hidden;
}

.cart-drawer__item:hover .cart-drawer__remove,
.cart-drawer__item:focus-within .cart-drawer__remove {
    opacity: 1;
    pointer-events: auto;
    text-decoration: none;
    visibility: visible;
}

.cart-drawer__remove:hover,
.cart-drawer__remove:focus-visible {
    color: var(--color-neon-pink);
    text-decoration: none;
}

.cart-drawer__item-description {
    display: -webkit-box;
    margin: 8px 0 0;
    overflow: hidden;
    color: rgba(0, 0, 0, 0.72);
    font-size: 16px;
    line-height: 1.32;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.cart-drawer__item-meta {
    display: flex;
    min-width: 86px;
    flex-direction: column;
    align-items: flex-end;
    gap: 8px;
    color: rgba(0, 0, 0, 0.72);
    font-size: 15px;
    line-height: 1.25;
    text-align: right;
}

.cart-drawer__item-meta strong,
.cart-drawer__item-meta .amount {
    color: var(--color-black);
    font-weight: 500;
}

.cart-drawer__totals {
    margin-top: auto;
    padding-top: 22px;
}

.cart-drawer__coupon {
    border-top: var(--pill-border);
    border-bottom: var(--pill-border);
}

.cart-drawer__coupon-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    width: 100%;
    min-height: 46px;
    padding: 0 8px 0 0;
    border: 0;
    background: transparent;
    color: var(--color-black);
    cursor: pointer;
    font-family: "Neue Montreal", Arial, sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.2;
    text-align: left;
    text-transform: uppercase;
}

.cart-drawer__coupon-toggle-icon {
    flex: 0 0 auto;
    width: 9px;
    height: 9px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: rotate(45deg) translateY(-2px);
    transition: transform 180ms ease;
}

.cart-drawer__coupon.is-expanded .cart-drawer__coupon-toggle-icon {
    transform: rotate(225deg) translateY(-2px);
}

.cart-drawer__coupon-panel {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition:
        max-height 240ms ease,
        opacity 180ms ease;
}

.cart-drawer__coupon.is-expanded .cart-drawer__coupon-panel {
    max-height: 150px;
    opacity: 1;
}

.cart-drawer__coupon-label {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    overflow: hidden;
    white-space: nowrap;
}

.cart-drawer__coupon-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    padding: 0 0 16px;
}

.cart-drawer__coupon-input {
    min-width: 0;
    min-height: 42px;
    padding: 8px 12px;
    border: var(--pill-border);
    border-radius: 0;
    background: var(--color-white);
    color: var(--color-black);
    font: inherit;
}

.cart-drawer__coupon-message {
    margin: -6px 0 14px;
    color: var(--color-deep-turquoise);
    font-size: 13px;
    line-height: 1.35;
}

.cart-drawer__coupon-message.is-error {
    color: var(--color-oxblood);
}

.cart-drawer__total-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 0 20px;
    font-size: 18px;
    line-height: 1.3;
}

.cart-drawer__total-row strong {
    font-weight: 700;
}

.cart-drawer__actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.cart-drawer__empty {
    display: flex;
    min-height: 320px;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 14px;
}

.cart-drawer__empty-title {
    margin: 0;
    font-family: "Armany", serif;
    font-size: 2.5rem;
    font-weight: 500;
    line-height: 1;
}

.cart-drawer__empty-copy {
    max-width: 28ch;
    margin: 0;
    color: rgba(0, 0, 0, 0.72);
    font-size: 16px;
    line-height: 1.4;
}

.cart-drawer.is-loading .cart-drawer__content {
    cursor: progress;
}

@media (max-width: 767px) {
    .cart-drawer__panel {
        width: 100vw;
        padding: 22px 16px 20px;
    }

    .cart-drawer__title {
        font-size: 4.25rem;
    }

    .cart-drawer__item {
        grid-template-columns: 78px minmax(0, 1fr);
        gap: 12px;
    }

    .cart-drawer__item-image {
        width: 78px;
        height: 78px;
    }

    .cart-drawer__item-body {
        grid-template-columns: minmax(0, 1fr);
    }

    .cart-drawer__item-meta {
        min-width: 0;
        align-items: flex-start;
        text-align: left;
    }

    .cart-drawer__actions,
    .cart-drawer__coupon-row {
        grid-template-columns: 1fr;
    }
}

/* Tablet: Header & navigation */
@media (max-width: 1024px) {
    .site-nav__links {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 88px minmax(0, 1fr);
        align-items: center;
        gap: 8px;
    }

    .nav-list-left {
        grid-column: 1;
        width: auto;
        max-width: 100%;
        justify-content: flex-start;
    }

    .nav-list-right {
        grid-column: 3;
        width: auto;
        max-width: 100%;
        justify-content: flex-end;
    }

    .nav-list {
        flex-wrap: nowrap;
    }

    .site-logo,
    .site-logo img {
        width: 96px;
        height: 44px;
    }
}

/* Mobile: Header & navigation */
@media (max-width: 767px) {
    .site-header {
        z-index: 30;
    }

    .site-nav {
        position: relative;
        justify-content: flex-end;
        max-width: none;
        height: auto;
        min-height: var(--header-height);
        padding: 12px 16px;
    }

    .site-logo-wrap {
        left: 0;
        transform: none;
        justify-content: flex-start;
        padding: 12px 16px;
        height: var(--header-height);
        z-index: 31;
    }

    .site-logo {
        width: 88px;
        height: 40px;
    }

    .site-logo img {
        width: 88px;
        height: 40px;
        object-fit: contain;
    }

    .has-nav-open .site-logo-wrap,
    .has-nav-open .site-logo img {
        mix-blend-mode: normal;
    }

    .nav-menu-toggle {
        display: inline-flex;
        position: relative;
        z-index: 32;
        flex-shrink: 0;
    }

    .site-nav__menus {
        position: fixed;
        inset: 0;
        z-index: 30;
        display: none;
        grid-template-rows: 1fr auto;
        gap: 32px;
        padding: var(--header-height) 16px 24px;
        background-color: var(--color-neon-pink);
        background-image: url("../images/nav-bg.png");
        background-repeat: repeat;
    }

    .site-header.is-nav-open .site-nav__menus {
        display: flex;
        flex-direction: column;
    }

    .site-nav__links {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 8px;
        margin: auto 0;
    }

    .nav-list {
        width: 100%;
        flex-direction: column;
        align-items: center;
        gap: 8px;
    }

    .nav-list-left,
    .nav-list-right {
        width: 100%;
        justify-content: center;
    }

    .nav-list li {
        width: 100%;
    }

    .site-header.is-nav-open .nav-pill {
        display: flex;
        width: 100%;
        min-height: auto;
        border: 0;
        background: transparent;
        text-transform: none;
    }

    .site-header.is-nav-open .nav-pill__label {
        display: block;
        width: 100%;
        padding: 0;
        font-family: "Armany", serif;
        font-size: 44px;
        font-weight: 600;
        line-height: 44px;
        color: var(--color-white);
        white-space: nowrap;
    }

    .site-header.is-nav-open .nav-pill__hover {
        display: none;
    }

    .site-header.is-nav-open .nav-pill:hover .nav-pill__label {
        transform: none;
    }

    .site-header.is-nav-open .nav-menu-toggle {
        width: 36px;
        height: 36px;
        min-height: 36px;
        padding: 8px 12px;
        border: 0;
        border-radius: 50px;
        background: var(--color-white);
        background-image: none;
        box-shadow: none;
        color: var(--color-neon-pink);
        transform: none;
    }

    .site-header.is-nav-open .nav-menu-toggle:hover,
    .site-header.is-nav-open .nav-menu-toggle:focus-visible {
        transform: none;
        box-shadow: none;
    }

    .site-header.is-nav-open .nav-menu-toggle__label--open {
        display: none;
    }

    .site-header.is-nav-open .nav-menu-toggle__label--close {
        display: block;
        position: absolute;
        top: 8px;
        left: 50%;
        font-family: "Neue Montreal", Arial, sans-serif;
        font-weight: 700;
        font-size: 14px;
        line-height: 20px;
        color: var(--color-neon-pink);
        transform: translateX(-50%);
    }

    .site-nav__meta {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 4px;
    }

    .site-nav__meta-link {
        display: block;
        width: 100%;
        color: var(--color-footer-text);
    }

    .site-nav__meta-link:focus-visible {
        outline: 2px solid rgba(255, 255, 255, 0.85);
        outline-offset: 4px;
        border-radius: 6px;
    }
}
/* ── Hero ─────────────────────────────────────────────── */

.hero-section {
    position: relative;
    min-height: calc(
        100vh - var(--header-height) - var(--wp-admin--admin-bar--height, 0px)
    );
    min-height: var(--viewport-content-height);
    overflow: hidden;
    background: var(--color-black);
}

.hero-section__media {
    position: absolute;
    inset: 0;
}

.hero-section__image,
.hero-section__video,
.hero-section__overlay {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.hero-section__image,
.hero-section__video {
    object-fit: cover;
}

.hero-section__overlay {
    background: var(--color-overlay);
}

.hero-section__inner {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: calc(
        100vh - var(--header-height) - var(--wp-admin--admin-bar--height, 0px)
    );
    min-height: var(--viewport-content-height);
    padding: 48px var(--page-gutter);
}

.hero-title {
    display: grid;
    justify-items: center;
    gap: clamp(0.25rem, 1.1vw, 0.75rem);
    width: min(100%, 1240px);
    margin: 0;
    color: var(--color-cream);
    text-align: center;
}

.hero-title__primary {
    display: grid;
    font-family: "Neue Montreal", Arial, sans-serif;
    font-size: clamp(3rem, 5.97vw, 5.375rem);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
    text-transform: uppercase;
    white-space: nowrap;
}

.hero-title__primary-line {
    display: block;
}

.hero-title__secondary-row {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: clamp(0.625rem, 1.1vw, 1.125rem);
    margin-top: -0.35rem;
    margin-left: clamp(2.5rem, 5.5vw, 5.5rem);
}

.hero-title__accent {
    padding-bottom: clamp(0.35rem, 0.85vw, 0.65rem);
    font-family: "Neue Montreal", Arial, sans-serif;
    font-size: clamp(1.25rem, 1.95vw, 1.75rem);
    font-weight: 700;
    line-height: 1;
    text-transform: lowercase;
    white-space: nowrap;
}

.hero-title__secondary {
    font-family: "Armany", serif;
    font-size: clamp(3.75rem, 6.95vw, 6.25rem);
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0;
    white-space: nowrap;
}

/* Tablet: Hero */
@media (max-width: 1024px) {
    .hero-section__inner {
        padding-top: 120px;
        padding-bottom: 120px;
    }
}

/* Mobile: Hero */
@media (max-width: 767px) {
    .hero-section__inner {
        padding: 40px 16px;
    }

    .hero-title {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-rows: auto auto auto;
        justify-items: start;
        align-items: end;
        gap: 0;
        text-align: left;
    }

    .hero-title__primary {
        display: contents;
        font-size: 3rem;
        line-height: 1;
        white-space: normal;
    }

    .hero-title__primary-line {
        grid-column: 1;
        grid-row: 1 / 3;
        align-self: start;
        max-width: 13.25rem;
        font-size: 2.6rem;
        line-height: 1;
        white-space: normal;
    }

    .hero-title__secondary-row {
        display: contents;
        margin-top: 0;
        margin-left: 0;
    }

    .hero-title__accent {
        grid-column: 2;
        grid-row: 2;
        align-self: end;
        width: auto;
        margin: 0 0 2px 10px;
        padding: 0;
        font-size: 1.25rem;
        line-height: 1;
        text-align: left;
    }

    .hero-title__secondary {
        grid-column: 1 / -1;
        grid-row: 3;
        justify-self: end;
        width: 100%;
        margin-top: 6px;
        font-size: 3.4rem;
        line-height: 0.67;
    }
}
/* ── Gallery series ─────────────────────────────────────────────── */

.gallery-series {
    background: var(--color-white);
}

.gallery-series__heading {
    max-width: var(--page-max-width);
    margin: 0 auto;
    min-height: 347px;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 73px 0 24px;
}

.gallery-series__title {
    display: inline-grid;
    justify-items: end;
    margin: 0;
    color: var(--color-neon-pink);
    text-align: right;
}

.gallery-series__title-main {
    font-size: clamp(4rem, 6.95vw, 6.25rem);
    font-weight: 700;
    line-height: 0.9;
    letter-spacing: 0;
    text-transform: uppercase;
    white-space: nowrap;
}

.gallery-series__title-subline {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    gap: 33px;
    margin-top: -2px;
}

.gallery-series__title-kicker {
    padding-bottom: 0.1em;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
    text-transform: uppercase;
}

.gallery-series__title-script {
    font-family: "Armany", serif;
    font-size: clamp(4.4rem, 7.78vw, 7rem);
    font-weight: 500;
    line-height: 0.8;
    letter-spacing: 0;
    white-space: nowrap;
}

.gallery-series__grid {
    display: flex;
    align-items: stretch;
    width: 100%;
    margin: 0;
    overflow: hidden;
    --gallery-panel-duration: 900ms;
    --gallery-panel-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

.gallery-card {
    position: relative;
    flex: 1 1 0;
    height: var(--viewport-content-height);
    overflow: hidden;
    background: var(--color-black);
    will-change: flex-grow, flex-basis;
    transition:
        flex-grow var(--gallery-panel-duration) var(--gallery-panel-ease),
        flex-basis var(--gallery-panel-duration) var(--gallery-panel-ease);
}

.gallery-series__grid:hover .gallery-card {
    flex: 0.82 1 0;
}

.gallery-series__grid:hover .gallery-card:hover {
    flex: 1.76 1 0;
}

.gallery-card:focus-visible {
    outline: var(--focus-ring);
    outline-offset: -3px;
}

.gallery-card::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0) 68%,
        rgba(0, 0, 0, 0.3) 100%
    );
    pointer-events: none;
}

.gallery-card__image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1);
    transform-origin: center center;
    will-change: transform;
    transition: transform var(--gallery-panel-duration)
        var(--gallery-panel-ease);
}

.gallery-card__footer {
    position: absolute;
    left: 40px;
    right: 36px;
    bottom: 34px;
    z-index: 1;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
}

.gallery-card__content {
    flex: 1 1 auto;
    min-width: 0;
    max-width: 428px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;
    gap: 0;
}

.gallery-card__title {
    order: 1;
    margin: 0;
    font-family: "Armany", serif;
    font-size: 2.25rem;
    font-weight: 500;
    line-height: 1;
    letter-spacing: 0;
    color: var(--color-white);
    transition: transform 320ms ease;
}

.gallery-card__description {
    order: 2;
    width: min(428px, calc(100vw - 80px));
    margin: 0;
    margin-top: 0;
    font-size: 1.125rem;
    font-weight: 400;
    line-height: 1.4444444444;
    letter-spacing: 0;
    color: var(--color-white);
    max-height: 0;
    opacity: 0;
    transform: translate3d(0, 22px, 0);
    will-change: opacity, transform;
    overflow: hidden;
    transition:
        max-height calc(var(--gallery-panel-duration) * 0.5)
            var(--gallery-panel-ease),
        margin-top calc(var(--gallery-panel-duration) * 0.5)
            var(--gallery-panel-ease),
        opacity calc(var(--gallery-panel-duration) * 0.5)
            var(--gallery-panel-ease),
        transform calc(var(--gallery-panel-duration) * 0.5)
            var(--gallery-panel-ease);
    transition-delay: 0ms;
}

.gallery-card__cta {
    max-height: none;
    margin-top: 0;
    flex: 0 0 auto;
    flex-shrink: 0;
    align-self: flex-end;
    opacity: 0;
    transform: translate3d(100%, 0, 0);
    will-change: opacity, transform;
    transition:
        opacity calc(var(--gallery-panel-duration) * 0.9)
            var(--gallery-panel-ease),
        transform calc(var(--gallery-panel-duration) * 0.9)
            var(--gallery-panel-ease),
        color 180ms ease;
    transition-delay: 80ms;
    pointer-events: none;
}

.gallery-series__grid:hover .gallery-card:hover .gallery-card__image {
    transform: scale(1.05);
}

.gallery-series__grid:hover .gallery-card:hover .gallery-card__description,
.gallery-series__grid:hover .gallery-card:hover .gallery-card__cta {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

.gallery-series__grid:hover .gallery-card:hover .gallery-card__description {
    max-height: 160px;
    margin-top: 16px;
}

.gallery-series__grid:hover .gallery-card:hover .gallery-card__cta {
    pointer-events: auto;
}

/* Narrow desktop: Gallery series */
@media (max-width: 1279px) {
    .gallery-card__footer {
        justify-content: flex-end;
        gap: 16px;
        left: 28px;
        right: 28px;
    }

    .gallery-card__content {
        max-width: none;
    }

    .gallery-card__description {
        width: auto;
        max-width: 100%;
    }

    .gallery-card__cta .button-pill {
        --button-pill-font-size: 0.875rem;
        --button-pill-line-height: 1.2857142857;
        --button-pill-padding-y: 12px;
        --button-pill-padding-x: 16px;
    }
}

/* Tablet: Gallery series */
@media (max-width: 1024px) {
    .gallery-series__heading {
        min-height: 280px;
        padding-top: 64px;
        padding-bottom: 28px;
    }

    .gallery-series__title-subline {
        gap: 24px;
        margin-left: 11vw;
    }

    .gallery-series__grid {
        flex-direction: column;
    }

    .gallery-card,
    .gallery-series__grid:hover .gallery-card,
    .gallery-series__grid:hover .gallery-card:hover {
        flex: none;
        height: 560px;
    }

    .gallery-series__grid:hover .gallery-card:hover .gallery-card__image {
        transform: scale(1);
    }

    .gallery-card__footer {
        flex-direction: column;
        bottom: 28px;
        left: 28px;
        right: 28px;
        align-items: flex-start;
        gap: 18px;
    }

    .gallery-card__content {
        gap: 16px 0;
        max-width: none;
    }

    .gallery-card__title {
        font-size: 2.5rem;
        line-height: 1;
    }

    .gallery-card__description,
    .gallery-card__cta {
        opacity: 1;
        transform: none;
        pointer-events: auto;
        transition: none;
    }

    .gallery-card__description {
        width: 100%;
        max-height: none;
        margin-top: 0;
        font-size: 1rem;
        line-height: 1.4375;
    }

    .gallery-series__grid:hover .gallery-card:hover .gallery-card__description {
        max-height: none;
        margin-top: 0;
    }

    .gallery-card__cta {
        align-self: flex-start;
        width: fit-content;
    }

    .gallery-card__cta .button-pill {
        --button-pill-font-size: 0.9375rem;
        --button-pill-line-height: 1.3333333333;
        --button-pill-padding-y: 12px;
        --button-pill-padding-x: 18px;
    }
}

/* Mobile: Gallery series */
@media (max-width: 767px) {
    .gallery-series__heading {
        min-height: 186px;
        padding: 80px 0 18px;
    }

    .gallery-series__title {
        justify-items: center;
        text-align: center;
    }

    .gallery-series__title-main {
        font-size: 3rem;
    }

    .gallery-series__title-subline {
        align-items: flex-end;
        justify-content: center;
        gap: 18px;
        margin-top: 0;
    }

    .gallery-series__title-kicker {
        font-size: 0.75rem;
        line-height: 1;
        padding-bottom: 4px;
    }

    .gallery-series__title-script {
        font-size: 3.25rem;
        line-height: 0.8;
    }

    .gallery-card,
    .gallery-series__grid:hover .gallery-card,
    .gallery-series__grid:hover .gallery-card:hover {
        height: 400px;
    }

    .gallery-card::after {
        background: linear-gradient(
            180deg,
            rgba(0, 0, 0, 0) 0%,
            rgba(0, 0, 0, 0.3) 100%
        );
    }

    .gallery-card__footer {
        bottom: 16px;
        left: 16px;
        right: 16px;
        gap: 16px;
    }

    .gallery-card__title {
        font-size: 2rem;
    }

    .gallery-card__description {
        width: 100%;
        font-size: 0.875rem;
        line-height: 1.4285714286;
    }

    .gallery-card__cta .button-pill {
        font-size: 0.875rem;
    }

    .gallery-card__cta .button-pill__label,
    .gallery-card__cta .button-pill__hover {
        padding: 10px 16px;
    }
}
/* ── Spotlight ─────────────────────────────────────────────── */

.spotlight-section {
    background: var(--color-white);
}

.spotlight-section__inner {
    max-width: var(--page-max-width);
    margin: 0 auto;
    padding: 200px 40px 143px;
}

.spotlight-section__heading {
    display: grid;
    justify-items: center;
    position: relative;
    z-index: 1;
    margin-bottom: -42px;
    text-align: center;
}

.spotlight-section__eyebrow {
    margin: 0;
    font-family: "Neue Montreal", Arial, sans-serif;
    font-size: 5rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
    text-transform: uppercase;
    color: var(--color-deep-turquoise);
}

.spotlight-section__title {
    margin: 0;
    font-family: "Armany", serif;
    font-size: 5.75rem;
    font-weight: 500;
    line-height: 1;
    letter-spacing: 0;
    color: var(--color-deep-turquoise);
}

.spotlight-section__columns {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    gap: 80px;
}

.spotlight-section__column {
    display: flex;
    flex-direction: column;
    width: 640px;
}

.spotlight-section__column--right {
    padding-top: 267px;
}

.spotlight-card {
    margin: 0;
    transform: translateY(20px) scaleX(0.8);
    transform-origin: center center;
    opacity: 0;
    transition:
        transform 600ms ease,
        opacity 600ms ease;
}

.spotlight-card.is-visible {
    transform: translateY(0) scaleX(1);
    opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
    .spotlight-card {
        transform: none;
        opacity: 1;
        transition: none;
    }
}

.spotlight-card--more-than-a-storm {
    width: 559px;
    margin-left: 52px;
}

.spotlight-card--untitled-figure {
    width: 480px;
    margin-top: 100px;
    margin-left: 95px;
}

.spotlight-card--pink-mischief {
    width: 440px;
    margin-top: 122px;
    margin-left: 115px;
}

.spotlight-card--leave-me {
    width: 640px;
    margin-top: 139px;
}

.spotlight-card--road-of-the-rambler {
    width: 640px;
}

.spotlight-card--land-of-the-sandmen {
    width: 480px;
    margin-top: 222px;
    margin-left: 80px;
}

.spotlight-card--see-you-in-berlin {
    width: 574px;
    margin-top: 202px;
    margin-left: 66px;
}

.spotlight-card--hidden-in-the-honey-sting {
    width: 440px;
    margin-top: 295px;
    margin-left: 200px;
}

.spotlight-card__image {
    width: 100%;
    display: block;
    background: var(--color-white);
}

.spotlight-card__image--cover {
    object-fit: cover;
}

.spotlight-card--more-than-a-storm .spotlight-card__image {
    aspect-ratio: 559 / 431;
}

.spotlight-card--untitled-figure .spotlight-card__image {
    aspect-ratio: 480 / 560;
}

.spotlight-card--pink-mischief .spotlight-card__image {
    aspect-ratio: 440 / 400;
}

.spotlight-card--leave-me .spotlight-card__image {
    aspect-ratio: 640 / 700;
}

.spotlight-card--road-of-the-rambler .spotlight-card__image {
    aspect-ratio: 640 / 760;
}

.spotlight-card--land-of-the-sandmen .spotlight-card__image {
    aspect-ratio: 480 / 500;
}

.spotlight-card--see-you-in-berlin .spotlight-card__image {
    aspect-ratio: 574 / 500;
}

.spotlight-card--hidden-in-the-honey-sting .spotlight-card__image {
    aspect-ratio: 440 / 400;
}

.spotlight-card__caption {
    display: grid;
    justify-items: center;
    gap: 16px;
    padding-top: 24px;
    text-align: center;
}

.spotlight-card__title {
    margin: 0;
    font-family: "Armany", serif;
    font-size: 2rem;
    font-weight: 500;
    line-height: 1;
    letter-spacing: 0;
    color: var(--color-black);
}

.spotlight-card__category {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.4285714286;
    letter-spacing: 0;
    color: var(--color-black);
}

.spotlight-section__cta {
    margin: 66px auto 0;
    text-align: center;
}

/* Tablet: Spotlight */
@media (max-width: 1024px) {
    .spotlight-section__inner {
        padding-right: 24px;
        padding-left: 24px;
    }

    .spotlight-section__heading {
        margin-bottom: 96px;
    }

    .spotlight-section__eyebrow {
        font-size: clamp(4rem, 6vw, 5rem);
    }

    .spotlight-section__title {
        font-size: clamp(4.5rem, 7vw, 5.75rem);
    }

    .spotlight-section__columns {
        flex-direction: column;
        align-items: center;
        gap: 100px;
    }

    .spotlight-section__column,
    .spotlight-card--leave-me,
    .spotlight-card--road-of-the-rambler {
        width: min(100%, 640px);
    }

    .spotlight-section__column--right {
        padding-top: 0;
    }

    .spotlight-card--more-than-a-storm,
    .spotlight-card--untitled-figure,
    .spotlight-card--pink-mischief,
    .spotlight-card--land-of-the-sandmen,
    .spotlight-card--see-you-in-berlin,
    .spotlight-card--hidden-in-the-honey-sting {
        width: min(100%, 574px);
        margin-left: auto;
        margin-right: auto;
    }

    .spotlight-card--untitled-figure,
    .spotlight-card--pink-mischief,
    .spotlight-card--leave-me,
    .spotlight-card--land-of-the-sandmen,
    .spotlight-card--see-you-in-berlin,
    .spotlight-card--hidden-in-the-honey-sting {
        margin-top: 96px;
    }
}

/* Mobile: Spotlight */
@media (max-width: 767px) {
    .spotlight-section__inner {
        padding: 80px 16px 60px;
    }

    .spotlight-section__heading {
        margin-bottom: 100px;
    }

    .spotlight-section__eyebrow {
        font-size: 2rem;
        line-height: 1.5;
    }

    .spotlight-section__title {
        margin-top: 0;
        font-size: 3.75rem;
        line-height: 0.9;
    }

    .spotlight-section__columns {
        flex-direction: column;
        gap: 0;
    }

    .spotlight-section__column {
        display: contents;
    }

    .spotlight-section__column--right {
        padding-top: 0;
    }

    .spotlight-card--more-than-a-storm {
        order: 1;
        width: min(249px, 66.4vw);
        margin: 0 auto 0 0;
    }

    .spotlight-card--untitled-figure {
        order: 2;
        width: min(237px, 63.2vw);
        margin: 48px 0 0 auto;
    }

    .spotlight-card--pink-mischief {
        order: 3;
        width: min(201px, 53.6vw);
        margin: 32px auto 0 0;
    }

    .spotlight-card--land-of-the-sandmen {
        order: 4;
        width: min(201px, 53.6vw);
        margin: 48px 0 0 auto;
    }

    .spotlight-card--see-you-in-berlin {
        order: 5;
        width: min(223px, 59.5vw);
        margin: 32px auto 0 12px;
    }

    .spotlight-card--leave-me {
        order: 6;
        width: min(272px, 72.5vw);
        margin: 52px 0 0 auto;
    }

    .spotlight-card--road-of-the-rambler {
        order: 7;
        width: min(218px, 58.1vw);
        margin: 52px auto 0 0;
    }

    .spotlight-card--hidden-in-the-honey-sting {
        order: 8;
        width: min(265px, 70.7vw);
        margin: 32px 0 0 auto;
    }

    .spotlight-card__caption {
        gap: 8px;
        padding-top: 18px;
    }

    .spotlight-card__title {
        font-size: 1.25rem;
        line-height: 1.6;
    }

    .spotlight-card__category {
        font-size: 0.75rem;
        line-height: 1.5;
    }

    .spotlight-section__cta {
        margin-top: 52px;
    }

    .spotlight-section__cta .button-pill {
        font-size: 0.875rem;
    }

    .spotlight-section__cta .button-pill__label,
    .spotlight-section__cta .button-pill__hover {
        padding: 10px 16px;
    }

    .spotlight-section__eyebrow {
        font-size: clamp(1.625rem, 8.5vw, 2rem);
    }

    .spotlight-section__title {
        font-size: clamp(2.75rem, 16vw, 3.75rem);
    }
}
/* ── Services ─────────────────────────────────────────────── */

.services-section {
    --service-padding-y: 160px;
    --service-card-height: 500px;
    --service-card-gap: 32px;
    --service-text-gap: 32px;
    --service-body-size: 18px;
    --service-body-line-height: 26px;
    background: var(--color-black);
}

.services-section__inner {
    display: flex;
    align-items: flex-start;
    gap: clamp(40px, 6vw, 100px);
    max-width: var(--page-max-width);
    margin: 0 auto;
    padding: 0 var(--page-gutter);
}

.services-intro {
    position: sticky;
    top: 0;
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: var(--service-padding-y) 0;
}

.services-intro__content {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    row-gap: var(--service-text-gap);
    min-height: var(--service-card-height);
}

.services-intro__text {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--service-text-gap);
    width: 100%;
    max-width: 460px;
}

.services-intro__title {
    color: var(--color-neon-pink);
    margin: 0;
    width: max-content;
    font-size: clamp(70px, 10vw, 100px);
}

.services-intro__title-line1 {
    font-family: "Neue Montreal", Arial, sans-serif;
    font-weight: bold;
    line-height: 1;
    letter-spacing: 0;
    text-transform: uppercase;
    margin: 0;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 8px;
}

.services-intro__title-line1 small {
    font-size: 0.2em;
    font-weight: 500;
    margin-bottom: 0.5em;
}

.services-intro__title-line2 {
    display: block;
    font-family: "Armany", serif;
    font-size: 1.12em;
    font-weight: 500;
    line-height: 1;
    margin: 0;
}

.services-intro__description,
.service-card__description {
    margin: 0;
    font-size: var(--service-body-size);
    font-weight: 400;
    line-height: var(--service-body-line-height);
    letter-spacing: 0;
    opacity: 0.7;
}

.services-intro__description {
    color: var(--color-neon-pink);
}

.services-cards {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding-bottom: calc(
        var(--service-padding-y) * 2 - var(--service-card-gap)
    );
}

.service-card-wrapper {
    width: 100%;
    position: sticky;
    top: 0;
    padding: var(--service-padding-y) 0;
    margin-bottom: calc(
        var(--service-padding-y) * -2 + var(--service-card-gap)
    );
}

.service-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--service-text-gap);
    padding: clamp(24px, 3vw, 48px);
    overflow: hidden;
    width: 100%;
    height: var(--service-card-height);
}

.service-card--art-consultation {
    background: #4a0d0d;
}

.service-card--custom-artworks {
    background: #123524;
}

.service-card--project-collaborations {
    background: #052649;
}

.service-card--complete-fulfilment {
    background: #056174;
}

.service-card__image {
    width: 180px;
    height: 180px;
    object-fit: cover;
    flex-shrink: 0;
}

.service-card__content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: clamp(32px, 5vw, 80px);
    width: 100%;
}

.service-card__title {
    margin: 0;
    font-family: "Armany", serif;
    font-size: 36px;
    font-weight: 500;
    line-height: 36px;
    letter-spacing: 0;
    color: var(--color-white);
}

.service-card__description {
    color: var(--color-white);
}

/* Mobile: Services */
@media (max-width: 767px) {
    .services-section {
        --service-card-gap: 16px;
        padding: 80px 0;
    }

    .services-section__inner {
        flex-direction: column;
        position: relative;
    }

    .services-intro,
    .services-intro__content {
        display: contents;
    }

    .services-intro__text {
        order: 1;
    }

    .services-cards {
        order: 2;
    }

    .services-intro__cta {
        order: 3;
        align-self: center;
    }

    .services-intro {
        width: 100%;
        padding: 0;
        position: static;
    }

    .services-intro__content {
        min-height: auto;
    }

    .services-intro__text {
        gap: 24px;
        margin-bottom: calc(var(--service-padding-y) * -1);
    }

    .services-intro__description,
    .service-card__description {
        font-size: 0.875rem;
        line-height: 1.4285714286;
    }

    .services-cards {
        padding-bottom: calc(
            var(--service-padding-y) - var(--service-card-gap)
        );
    }

    .service-card__image {
        width: 160px;
        height: 160px;
    }

    .service-card__content {
        gap: 32px;
    }

    .service-card__title {
        font-size: 1.5rem;
        line-height: 1.5;
    }
}
/* ── About section (home) ─────────────────────────────────────────────── */

.about-section {
    overflow: hidden;
    background: var(--color-about-pink);
    padding: 200px 0;
}

.about-section__title {
    width: 100%;
    margin: 0 auto -6vw;
    position: relative;
    z-index: 3;
    opacity: 0;
    transform: scaleX(0.7) scaleY(0.7);
    transform-origin: center center;
    transition:
        transform 600ms ease,
        opacity 600ms ease;
}

.about-section__title.is-visible {
    opacity: 1;
    transform: none;
}

.about-section__title img {
    display: block;
    width: 100%;
    height: auto;
}

.about-section__portrait-stack {
    position: relative;
    width: 500px;
    height: 564px;
    margin: 0 auto 48px;
    opacity: 0;
    transform: scaleX(0.7) scaleY(0.7);
    transform-origin: center center;
    transition:
        transform 600ms ease,
        opacity 600ms ease;
}

.about-section__portrait-link {
    display: block;
    width: fit-content;
    margin: 0 auto;
    text-decoration: none;
    position: relative;
}

.about-section__portrait-link:focus-visible {
    outline: 2px solid var(--color-black);
    outline-offset: 10px;
}

.about-section__portrait-link .about-section__portrait-stack,
.about-section__portrait-link .about-section__portrait,
.about-section__portrait-link .about-section__portrait img,
.about-section__portrait-link .about-section__badge {
    cursor: inherit;
}

.about-section__cursor {
    position: fixed;
    top: 0;
    left: 0;
    width: 131px;
    height: 133px;
    pointer-events: none;
    opacity: 0;
    transform: translate3d(-9999px, -9999px, 0);
    transition: opacity 160ms ease;
    z-index: 20;
}

@media (hover: hover) and (pointer: fine) {
    .about-section__portrait-link,
    .about-section__portrait-link .about-section__portrait-stack,
    .about-section__portrait-link .about-section__portrait,
    .about-section__portrait-link .about-section__portrait img,
    .about-section__portrait-link .about-section__badge {
        cursor: none;
    }

    .about-section__portrait-link.is-cursor-active .about-section__cursor {
        opacity: 1;
    }
}

.about-section__portrait-stack.is-visible {
    opacity: 1;
    transform: none;
}

.about-section__portrait {
    position: absolute;
    top: 0;
    width: 340px;
    height: 500px;
    overflow: hidden;
    transition: transform 220ms ease;
}

.about-section__portrait img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.about-section__portrait--front {
    left: 47px;
    z-index: 2;
    transform: translateX(0) rotate(-5deg);
}

.about-section__portrait--back {
    right: 33px;
    z-index: 1;
    transform: translateX(0) rotate(5deg);
}

.about-section__portrait-stack:has(.about-section__portrait--front:hover)
    .about-section__portrait--front,
.about-section__portrait-stack:has(
        .about-section__portrait--front:focus-visible
    )
    .about-section__portrait--front,
.about-section__portrait-stack:has(.about-section__portrait--back:hover)
    .about-section__portrait--front,
.about-section__portrait-stack:has(.about-section__portrait--back:focus-visible)
    .about-section__portrait--front {
    z-index: 1;
    transform: translateX(80px) rotate(5deg);
}

.about-section__portrait-stack:has(.about-section__portrait--front:hover)
    .about-section__portrait--back,
.about-section__portrait-stack:has(
        .about-section__portrait--front:focus-visible
    )
    .about-section__portrait--back,
.about-section__portrait-stack:has(.about-section__portrait--back:hover)
    .about-section__portrait--back,
.about-section__portrait-stack:has(.about-section__portrait--back:focus-visible)
    .about-section__portrait--back {
    z-index: 2;
    transform: translateX(-80px) rotate(-5deg);
}

.about-section__badge {
    position: absolute;
    right: 83px;
    bottom: 106px;
    width: 120px;
    height: 120px;
}

.about-section__copy {
    width: min(100%, 670px);
    margin: 0 auto;
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
    letter-spacing: 0;
    text-align: justify;
    color: var(--color-oxblood-dark);
    opacity: 0.7;
}

.about-section__copy p {
    margin: 0;
}

.about-section__copy p + p {
    margin-top: 26px;
}

@media (prefers-reduced-motion: reduce) {
    .about-section__title {
        transform: none;
        opacity: 1;
        transition: none;
    }

    .about-section__portrait-stack {
        transform: none;
        opacity: 1;
        transition: none;
    }
}

/* Tablet: About section (home) */
@media (max-width: 1024px) {
    .about-section {
        padding: 140px 24px;
    }

    .about-section__title {
        max-width: 780px;
        margin-bottom: -32px;
    }

    .about-section__portrait-stack {
        width: 440px;
        height: 500px;
        margin-bottom: 40px;
    }

    .about-section__portrait {
        width: 300px;
        height: 440px;
    }

    .about-section__portrait--front {
        left: 30px;
    }

    .about-section__portrait--back {
        right: 22px;
    }

    .about-section__badge {
        right: 64px;
        bottom: 88px;
        width: 104px;
        height: 104px;
    }

    .about-section__copy {
        width: min(100%, 620px);
    }
}

/* Mobile: About section (home) */
@media (max-width: 767px) {
    .about-section {
        padding: 80px 16px 63px;
    }

    .about-section__title {
        max-width: 358px;
        margin-bottom: -8px;
    }

    .about-section__portrait-stack {
        width: 286px;
        height: 343px;
        margin-bottom: 50px;
    }

    .about-section__portrait {
        width: 194px;
        height: 286px;
    }

    .about-section__portrait--front {
        left: 25px;
    }

    .about-section__portrait--back {
        right: 19px;
    }

    .about-section__badge {
        right: 74px;
        bottom: 81px;
        width: 68px;
        height: 68px;
    }

    .about-section__copy {
        width: 100%;
        font-size: 0.875rem;
        line-height: 1.4285714286;
    }

    .about-section__copy p + p {
        margin-top: 20px;
    }

    .about-section__cursor {
        display: none;
    }
}
/* ── Media publication ─────────────────────────────────────────────── */

.media-publication-section {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.media-publication-section__feature {
    position: relative;
    padding: 0;
    background: #efefef;
    display: flex;
    overflow: hidden;
}

.media-publication-section__feature-image {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border: 20px solid var(--color-white);
    box-sizing: border-box;
}

.media-publication-section__panel {
    min-height: var(--viewport-content-height);
    padding: 60px;
    background: #052649;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
}

.media-publication-section__heading {
    width: min(100%, 560px);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    margin: 0;
    text-align: center;
    color: var(--color-white);
}

.media-publication-section__eyebrow {
    margin: 0;
    font-family: "Neue Montreal", Arial, sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 16px;
    letter-spacing: 0.8px;
    text-transform: uppercase;
    opacity: 0.5;
}

.media-publication-section__title {
    margin: 0;
    font-family: "Armany", serif;
    font-size: 68px;
    font-weight: 500;
    line-height: 68px;
    letter-spacing: 0;
}

.media-publication-card {
    width: 232px;
}

.media-publication-card__cover {
    width: 232px;
    height: 253px;
    object-fit: cover;
}

.media-publication-card__button {
    position: relative;
    width: 100%;
    min-height: 56px;
    border: 0;
    padding: 16px 20px;
    background: var(--color-white);
    overflow: hidden;
    font-family: "Neue Montreal", Arial, sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    text-transform: uppercase;
    color: var(--color-black);
    cursor: pointer;
    isolation: isolate;
}

.media-publication-card__button::before {
    content: "";
    position: absolute;
    left: -37px;
    right: -38px;
    top: 64px;
    height: 96px;
    background: url("../images/button-ellipse.svg") center/100% 100% no-repeat;
    transition: transform 220ms ease;
    z-index: -1;
}

.media-publication-card__button:hover,
.media-publication-card__button:focus-visible {
    color: var(--color-white);
}

.media-publication-card__button:hover::before,
.media-publication-card__button:focus-visible::before {
    transform: translateY(-62px);
}

.media-publication-card__button:focus-visible {
    outline: var(--focus-ring);
    outline-offset: 3px;
}

.media-publication-section__copy {
    width: 100%;
    margin-top: auto;
    font-size: 12px;
    font-weight: 400;
    line-height: 18px;
    letter-spacing: 0;
    text-align: justify;
    color: #e2f6eb;
    opacity: 0.7;
}

.media-publication-section__copy p {
    margin: 0;
}

.media-publication-section__copy p + p {
    margin-top: 18px;
}

/* Tablet: Media publication */
@media (max-width: 1024px) {
    .media-publication-section {
        grid-template-columns: 1fr;
    }

    .media-publication-section__feature {
        padding: 0;
    }

    .media-publication-section__feature-image {
        height: 100%;
        max-height: none;
    }

    .media-publication-section__panel {
        min-height: 0;
        padding: 48px 24px 56px;
    }
}

/* Mobile: Media publication */
@media (max-width: 767px) {
    .media-publication-section__feature {
        display: none;
    }

    .media-publication-section__panel {
        padding: 61px 16px 62px;
        justify-content: flex-start;
        gap: 40px;
    }

    .media-publication-section__heading {
        gap: 16px;
    }

    .media-publication-section__eyebrow {
        font-size: 1rem;
        line-height: 1;
    }

    .media-publication-section__title {
        font-size: 2.5rem;
        line-height: 1;
    }

    .media-publication-card__cover {
        width: 232px;
        height: 309px;
    }

    .media-publication-card .button-pill {
        width: 232px;
        font-size: 1rem;
    }

    .media-publication-card .button-pill__label,
    .media-publication-card .button-pill__hover {
        padding: 12px 20px;
    }

    .media-publication-section__copy {
        margin-top: auto;
        font-size: 0.75rem;
        line-height: 1.5;
        text-align: center;
    }
}
/* ── Social ─────────────────────────────────────────────── */

.social-section {
    overflow: hidden;
    background: var(--color-oxblood-dark);
    padding: 120px 0;
}

.social-section__headline {
    position: relative;
    width: 100%;
    margin: 0 auto 60px;
    padding: 0;
}

.social-section__title {
    margin: 0;
}

.social-section__title img {
    display: block;
    width: 100%;
    height: auto;
}

.social-section__handle {
    position: absolute;
    left: 50%;
    top: 57%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 44px;
    padding: 10px 12px;
    transform: translate(-50%, -50%);
    background: var(--color-oxblood-dark);
    font-family: "Armany", serif;
    font-size: 2rem;
    font-weight: 500;
    line-height: 1;
    letter-spacing: 0;
    color: var(--color-white);
    white-space: nowrap;
}

.social-section__handle-icon {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
}

.social-section__handle:focus-visible {
    outline: 2px solid rgba(255, 255, 255, 0.9);
    outline-offset: 4px;
}

.social-section__feed {
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    gap: 20px;
    width: 100%;
    margin: 0;
    padding: 0 10px;
}

.social-section__feed-item {
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
}

.social-section__feed-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Tablet: Social */
@media (max-width: 1024px) {
    .social-section {
        padding-right: 24px;
        padding-left: 24px;
    }
}

/* Mobile: Social */
@media (max-width: 767px) {
    .social-section {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 24px;
        padding: 60px 0;
    }

    .social-section__headline {
        display: contents;
        margin-bottom: 0;
    }

    .social-section__title {
        order: 1;
        width: min(364px, calc(100% - 11px));
        margin: 0 auto;
    }

    .social-section__title img {
        width: 100%;
        height: 48px;
        object-fit: contain;
    }

    .social-section__handle {
        order: 3;
        position: static;
        left: auto;
        top: auto;
        bottom: auto;
        gap: 10px;
        padding: 10px;
        transform: none;
        background: var(--color-oxblood-dark);
        font-size: 1.25rem;
        line-height: 2rem;
    }

    .social-section__handle-icon {
        width: 16px;
        height: 16px;
    }

    .social-section__feed {
        order: 2;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 8px;
        width: 100%;
        padding: 0 4px;
    }

    .social-section__feed-item:nth-child(n + 4) {
        display: none;
    }
}
/* ── Footer ─────────────────────────────────────────────── */

.site-footer {
    overflow: hidden;
    background: var(--color-black);
    color: var(--color-footer-text);
}

.site-footer__inner {
    position: relative;
    z-index: 1;
    max-width: var(--page-max-width);
    margin: 0 auto;
    padding: 80px var(--page-gutter) 72px;
}

.site-footer__nav {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 32px;
    max-width: 900px;
    margin: 0 auto;
}

.site-footer__group {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    text-align: center;
}

.site-footer__title {
    margin: 0;
    font-family: "Armany", serif;
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 1.3333333333;
    color: rgba(254, 245, 253, 0.5);
}

.site-footer__menu {
    display: grid;
    gap: 16px;
    width: 100%;
    justify-items: center;
}

.site-footer__link {
    position: relative;
    display: inline-flex;
    align-items: flex-start;
    justify-content: center;
    min-height: 20px;
    overflow: hidden;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.4285714286;
    letter-spacing: 0;
    text-align: center;
    text-transform: uppercase;
    color: var(--color-footer-text);
}

.site-footer__link-text,
.site-footer__link-alt {
    display: block;
    white-space: nowrap;
    transition: transform 180ms ease;
}

.site-footer__link-text {
    transform: translateY(0);
}

.site-footer__link-alt {
    position: absolute;
    inset: 0 auto auto 50%;
    font-style: italic;
    transform: translate(-50%, 140%);
}

.site-footer__link:hover .site-footer__link-text,
.site-footer__link:focus-visible .site-footer__link-text {
    transform: translateY(-140%);
}

.site-footer__link:hover .site-footer__link-alt,
.site-footer__link:focus-visible .site-footer__link-alt {
    transform: translate(-50%, 0);
}

.site-footer__link:focus-visible {
    outline: 2px solid rgba(254, 245, 253, 0.9);
    outline-offset: 4px;
}

.site-footer__legal {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin-top: 88px;
    text-align: center;
}

.site-footer__separator {
    font-size: 0.875rem;
    line-height: 1.4285714286;
    color: var(--color-white);
}

.site-footer__credits {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 4px;
    margin: 8px 0 0;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.4285714286;
    text-align: center;
    text-transform: uppercase;
    color: rgba(254, 245, 253, 0.5);
}

.site-footer__credits .site-footer__link {
    color: inherit;
}

.site-footer__wordmark {
    margin-top: 48px;
    width: 100%;
    pointer-events: none;
}

.site-footer__wordmark img {
    display: block;
    width: 100%;
    height: auto;
}

.site-footer > .site-footer__credit-item {
    display: flex;
    justify-content: center;
    width: 100%;
    box-sizing: border-box;
    margin: 12px 0 0;
    padding: 0 var(--page-gutter) 20px;
    text-align: center;
}

.site-footer__credit-text {
    display: inline-block;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.4285714286;
    letter-spacing: 0;
    text-transform: uppercase;
    color: var(--color-white);
}

.site-footer__credit-link {
    color: inherit;
    text-decoration: none;
}

.site-footer__credit-link:hover,
.site-footer__credit-link:focus-visible {
    text-decoration: underline;
}

/* Tablet: Footer */
@media (max-width: 1024px) {
    .site-footer__nav {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 48px 32px;
        max-width: 560px;
    }
}

/* Mobile: Footer */
@media (max-width: 767px) {
    .site-footer__nav {
        grid-template-columns: 1fr;
        gap: 32px;
        max-width: none;
    }

    .site-footer__group {
        gap: 8px;
    }

    .site-footer__menu {
        gap: 0;
    }

    .site-footer__link {
        align-items: center;
        min-height: 36px;
    }

    .site-footer__link-text,
    .site-footer__link-alt {
        transition: none;
    }

    .site-footer__link-text {
        transform: none;
    }

    .site-footer__link-alt {
        display: none;
    }

    .site-footer__link:hover .site-footer__link-text,
    .site-footer__link:focus-visible .site-footer__link-text {
        transform: none;
    }

    .site-footer__link:hover .site-footer__link-alt,
    .site-footer__link:focus-visible .site-footer__link-alt {
        transform: translate(-50%, 140%);
    }

    .site-footer__inner {
        padding-top: 80px;
        padding-bottom: 56px;
    }

    .site-footer__legal {
        gap: 8px;
        margin-top: 60px;
        max-width: none;
    }

    .site-footer__legal,
    .site-footer__credits {
        max-width: 320px;
        margin-left: auto;
        margin-right: auto;
    }

    .site-footer__wordmark {
        width: min(342px, calc(100% - 32px));
        margin-top: 60px;
        margin-left: auto;
        margin-right: auto;
    }
}
/* ── About page shell ─────────────────────────────────────────────── */

.page-about {
    background: var(--color-black);
}

.page-about .site-shell {
    background: var(--color-black);
}

/* ── Contact page ─────────────────────────────────────────────── */

.page-contact .site-shell {
    margin-top: calc(var(--header-height) * -1);
}

.contact-hero {
    background: var(--color-navy);
    color: var(--color-white);
}

.contact-hero__grid {
    display: flex;
    align-items: flex-start;
    max-width: var(--page-max-width);
    margin: 0 auto;
}

.contact-hero__column {
    flex: 1 1 50%;
    min-width: 0;
}

.contact-hero__column--info {
    display: flex;
    flex-direction: column;
    gap: 100px;
    padding: 140px var(--page-gutter) 60px;
}

.contact-hero__column--form {
    display: flex;
    flex-direction: column;
    gap: 80px;
    padding: 140px 155px 60px 80px;
}

.contact-hero__kicker {
    margin: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    letter-spacing: 0;
    text-transform: uppercase;
    opacity: 0.5;
}

.contact-hero__info-stack {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 100px;
    width: 100%;
}

.contact-hero__email {
    margin: 0;
    max-width: 100%;
    font-family: "Armany", serif;
    font-size: 52px;
    font-weight: 500;
    line-height: 52px;
    letter-spacing: 0;
    word-break: break-word;
}

.contact-hero__email a {
    color: inherit;
}

.contact-hero__email a:hover {
    opacity: 0.9;
}

.contact-hero__figure {
    margin: 0;
}

.contact-hero__portrait {
    width: 240px;
    height: 240px;
    border-radius: 24px;
    object-fit: cover;
}

.contact-hero__social {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 20px;
}

.contact-hero__social-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.contact-hero__social-link:focus-visible {
    outline: 2px solid var(--color-white);
    outline-offset: 4px;
}

.contact-hero__social-link img {
    display: block;
    width: 24px;
    height: 24px;
}

.contact-hero__typeform {
    width: 100%;
    min-height: 800px;
}

.contact-hero__typeform-inner {
    width: 100%;
}

.contact-hero__gravity-form {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
    max-width: 520px;
}

.contact-hero__gravity-form--plugin .gform_wrapper,
.contact-hero__gravity-form--plugin form {
    width: 100%;
}

.contact-hero__gravity-form--plugin .gform_fields,
.contact-hero__gravity-form--plugin .gfield {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.contact-hero__gravity-form--plugin .gform_fields {
    gap: 20px;
}

.contact-hero__field {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0;
}

.contact-hero__label,
.contact-hero__gravity-form--plugin .gfield_label {
    margin: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    letter-spacing: 0;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.7);
}

.contact-hero__input,
.contact-hero__gravity-form--plugin input[type="text"],
.contact-hero__gravity-form--plugin input[type="email"],
.contact-hero__gravity-form--plugin input[type="tel"],
.contact-hero__gravity-form--plugin select,
.contact-hero__gravity-form--plugin textarea {
    width: 100%;
    min-height: 56px;
    border: 1px solid rgba(255, 255, 255, 0.8);
    border-radius: 0;
    background: transparent;
    padding: 14px 16px;
    font: inherit;
    font-size: 18px;
    line-height: 1.3;
    color: var(--color-white);
    box-shadow: none;
    appearance: none;
}

.contact-hero__select,
.contact-hero__gravity-form--plugin select {
    background-image:
        linear-gradient(45deg, transparent 50%, currentColor 50%),
        linear-gradient(135deg, currentColor 50%, transparent 50%);
    background-position:
        calc(100% - 20px) 50%,
        calc(100% - 14px) 50%;
    background-repeat: no-repeat;
    background-size:
        6px 6px,
        6px 6px;
    padding-right: 40px;
}

.contact-hero__select option,
.contact-hero__gravity-form--plugin select option {
    color: var(--color-black);
}

.contact-hero__textarea,
.contact-hero__gravity-form--plugin textarea {
    min-height: 176px;
    resize: vertical;
}

.contact-hero__input:focus,
.contact-hero__gravity-form--plugin input:focus,
.contact-hero__gravity-form--plugin select:focus,
.contact-hero__gravity-form--plugin textarea:focus {
    outline: 2px solid var(--color-white);
    outline-offset: 3px;
}

.contact-hero__field--honeypot,
.contact-hero__gravity-form--plugin .gform_validation_container {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
}

.contact-hero__form-footer,
.contact-hero__gravity-form--plugin .gform_footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
    margin: 8px 0 0;
}

.contact-hero__submit,
.contact-hero__gravity-form--plugin input[type="submit"],
.contact-hero__gravity-form--plugin button[type="submit"] {
    border: 0;
    border-radius: 999px;
    background: var(--color-white);
    padding: 16px 28px;
    font-family: "Neue Montreal", Arial, sans-serif;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5;
    text-transform: uppercase;
    color: var(--color-black);
    cursor: pointer;
    transition:
        background-color 180ms ease,
        color 180ms ease;
}

.contact-hero__submit:hover,
.contact-hero__submit:focus-visible,
.contact-hero__gravity-form--plugin input[type="submit"]:hover,
.contact-hero__gravity-form--plugin input[type="submit"]:focus-visible,
.contact-hero__gravity-form--plugin button[type="submit"]:hover,
.contact-hero__gravity-form--plugin button[type="submit"]:focus-visible {
    background: var(--color-neon-pink);
    color: var(--color-white);
}

.contact-hero__form-message {
    min-height: 24px;
    margin: 0;
    font-size: 14px;
    line-height: 20px;
    color: var(--color-white);
}

/* Tablet: Contact hero */
@media (max-width: 1024px) {
    .contact-hero__column {
        flex: 1 1 50%;
    }

    .contact-hero__column--info {
        padding: 132px var(--page-gutter) 40px;
        gap: 56px;
    }

    .contact-hero__column--form {
        padding: 132px var(--page-gutter) 56px 32px;
        gap: 40px;
    }

    .contact-hero__info-stack {
        gap: 56px;
    }

    .contact-hero__email {
        max-width: 14ch;
        font-size: 32px;
        line-height: 1.3;
    }

    .contact-hero__typeform {
        min-height: 720px;
    }

    .contact-hero__gravity-form {
        max-width: 100%;
    }
}

/* Mobile: Contact hero */
@media (max-width: 767px) {
    .contact-hero__grid {
        flex-direction: column;
    }

    .contact-hero__column {
        flex: 1 1 100%;
        width: 100%;
    }

    .contact-hero__column--info {
        padding: 140px var(--page-gutter) 40px;
        gap: 40px;
    }

    .contact-hero__column--form {
        padding: 40px var(--page-gutter);
        gap: 40px;
    }

    .contact-hero__info-stack {
        gap: 24px;
    }

    .contact-hero__email {
        max-width: 343px;
        font-size: 24px;
        line-height: 52px;
    }

    .contact-hero__figure {
        display: none;
    }

    .contact-hero__portrait {
        width: min(240px, 100%);
        height: auto;
        aspect-ratio: 1;
    }

    .contact-hero__typeform {
        min-height: 800px;
    }

    .contact-hero__input,
    .contact-hero__gravity-form--plugin input[type="text"],
    .contact-hero__gravity-form--plugin input[type="email"],
    .contact-hero__gravity-form--plugin input[type="tel"],
    .contact-hero__gravity-form--plugin select,
    .contact-hero__gravity-form--plugin textarea {
        font-size: 16px;
    }
}

/* ── About hero ─────────────────────────────────────────────── */

.about-hero {
    position: relative;
}

.about-hero__stage {
    padding-top: 4.7vw;
    max-width: var(--page-max-width);
    margin: 0 auto;
    position: relative;
    z-index: 2;
    height: var(--viewport-content-height);
    display: flex;
    justify-content: center;
}

.about-hero__stage picture {
    height: 100%;
}

.about-hero__stage img {
    height: 100%;
    width: 100%;
    object-fit: contain;
    object-position: bottom;
}

.about-hero__bar {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 53px;
    overflow: hidden;
}

@keyframes about-hero-scroll-strip-loop {
    0% {
        transform: translateY(0);
    }

    100% {
        transform: translateY(calc(-100% + 53px));
    }
}

.about-hero__scroll-strip {
    display: block;
    width: 100%;
    height: auto;
    animation: about-hero-scroll-strip-loop 12s linear infinite;
    will-change: transform;
}

/* Mobile: About hero */
@media (max-width: 767px) {
    .about-hero__stage {
        padding-top: 0;
    }

    .about-hero__scroll-strip {
        width: 1440px;
        max-width: none;
        height: auto;
    }
}
/* ── About intro ─────────────────────────────────────────────── */

.about-intro {
    padding: 120px var(--page-gutter);
    display: flex;
    flex-direction: column;
    align-items: center;
    background: var(--color-white);
    text-align: center;
}

.about-intro__content {
    max-width: 898px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 40px;
}

.about-intro__lead {
    margin: 0;
    font-family: "Armany", serif;
    font-size: 32px;
    font-weight: 500;
    line-height: 1.2;
    color: var(--color-black);
}

/* Tablet: About intro */
@media (max-width: 1024px) {
    .about-intro {
        padding-top: 96px;
        padding-bottom: 96px;
    }

    .about-intro__content {
        width: 100%;
        max-width: 720px;
    }

    .about-intro__lead {
        font-size: 28px;
    }
}

/* Mobile: About intro */
@media (max-width: 767px) {
    .about-intro {
        padding: 80px 24px;
    }

    .about-intro__content {
        width: 100%;
        max-width: 327px;
        gap: 40px;
    }

    .about-intro__lead {
        font-size: 24px;
    }
}
/* ── About story ─────────────────────────────────────────────── */

.about-story {
    position: relative;
    width: 100%;
    background: var(--color-about-pink);
    overflow: clip;
}

.about-story__stage {
    position: relative;
    padding-top: 100px;
}

.about-story__sticky {
    position: sticky;
    top: 0;
    z-index: 1;
    width: 100%;
    height: 850px;
    pointer-events: none;
}

.about-story__title {
    position: relative;
    z-index: 2;
    margin: 0 auto -210px;
    width: 706px;
    height: 190px;
    color: var(--color-oxblood);
    pointer-events: none;
}

.about-story__title-line--primary {
    position: absolute;
    top: 0;
    left: calc(50% - 107px);
    display: block;
    font-family: "Neue Montreal", Arial, sans-serif;
    font-size: 100px;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
    transform: translateX(-50%);
}

.about-story__title-amp {
    position: absolute;
    top: 57px;
    left: calc(50% + 316.5px);
    font-family: "Armany", serif;
    font-size: 40px;
    font-weight: 500;
    line-height: 0.8;
    transform: translateX(-50%);
}

.about-story__title-line--secondary {
    position: absolute;
    top: 100px;
    left: 50%;
    display: block;
    margin-top: 0;
    font-family: "Armany", serif;
    font-size: 112px;
    font-weight: 500;
    line-height: 0.8;
    white-space: nowrap;
    transform: translateX(-50%);
}

.about-story__canvas {
    position: absolute;
    top: 185px;
    left: 50%;
    z-index: 1;
    width: 400px;
    height: 500px;
    object-fit: cover;
    transform: translateX(-50%);
    background: rgba(255, 255, 255, 0.14);
}

.about-story__blocks {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 220px 0;
    max-width: var(--page-max-width);
    margin: 0 auto;
    padding: 0 var(--page-gutter) 850px;
}

.about-story__block {
    width: 350px;
    color: var(--color-oxblood-dark);
    opacity: 0;
    transform: scale(0.8);
    will-change: opacity, transform;
}

.about-story__blocks > .about-story__block:nth-child(even) {
    margin-left: auto;
}

.about-story.is-revealed .about-story__block {
    opacity: 1;
    transform: none;
}

@media (prefers-reduced-motion: reduce) {
    .about-story__block {
        opacity: 1;
        transform: none;
        will-change: auto;
    }
}

.about-story__heading {
    margin: 0 0 24px;
    font-family: "Armany", serif;
    font-size: 32px;
    font-weight: 500;
    line-height: 32px;
}

.about-story__copy {
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
}

.about-story__copy p {
    margin: 0 0 18px;
}

.about-story__copy p:last-child {
    margin-bottom: 0;
}

.about-story__gallery {
    margin: 0;
    position: relative;
    z-index: 2;
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    padding: 40px;
    list-style: none;
}

.about-story__gallery li {
    flex: 1 0 0px;
    min-width: calc((100% - 72px) / 4);
    height: 400px;
}

.about-story__gallery img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Tablet: About story */
@media (max-width: 1024px) {
    .about-story__stage {
        padding-top: 88px;
    }

    .about-story__sticky {
        position: relative;
        top: auto;
        height: auto;
    }

    .about-story__title {
        width: min(100%, 560px);
        height: 152px;
        margin: 0 auto 56px;
    }

    .about-story__title-line--primary {
        left: calc(50% - 92px);
        font-size: 80px;
    }

    .about-story__title-amp {
        top: 44px;
        left: calc(50% + 247px);
        font-size: 30px;
    }

    .about-story__title-line--secondary {
        top: 80px;
        font-size: 92px;
    }

    .about-story__canvas {
        position: relative;
        top: auto;
        left: auto;
        display: block;
        width: min(100%, 360px);
        height: auto;
        aspect-ratio: 4 / 5;
        margin: 0 auto 72px;
        transform: none;
    }

    .about-story__blocks {
        max-width: 608px;
        padding: 0 24px 88px;
        gap: 88px 0;
    }

    .about-story__block {
        width: 100%;
        max-width: none;
        margin: 0 auto;
        text-align: center;
    }

    .about-story__blocks > .about-story__block:nth-child(odd),
    .about-story__blocks > .about-story__block:nth-child(even) {
        margin-left: auto;
        margin-right: auto;
    }

    .about-story__gallery {
        gap: 16px;
        padding: 24px;
    }

    .about-story__gallery li {
        flex: 1 0 0px;
        min-width: calc((100% - 16px) / 2);
        height: auto;
        aspect-ratio: 163.5 / 220;
    }
}

/* Mobile: About story */
@media (max-width: 767px) {
    .about-story__stage {
        padding-top: 80px;
    }

    .about-story__title {
        width: min(100%, 344px);
        height: 95px;
        margin: 0 auto 60px;
    }

    .about-story__title-line--primary {
        left: calc(50% - 54px);
        font-size: 48px;
    }

    .about-story__title-amp {
        top: 27px;
        left: calc(50% + 117px);
        font-size: 20px;
        line-height: 0.8;
    }

    .about-story__title-line--secondary {
        top: 50px;
        font-size: 56px;
    }

    .about-story__canvas {
        width: min(100%, 264px);
        margin-bottom: 60px;
    }

    .about-story__blocks {
        padding: 0 16px 80px;
        gap: 120px 0;
    }

    .about-story__block {
        max-width: 344px;
    }

    .about-story__heading {
        margin-bottom: 24px;
        text-align: center;
    }

    .about-story__copy {
        text-align: center;
    }

    .about-story__copy p {
        margin-bottom: 26px;
    }

    .about-story__gallery {
        gap: 16px;
        padding: 16px;
    }

    .about-story__gallery li {
        flex: 1 0 0px;
        min-width: calc((100% - 16px) / 2);
        aspect-ratio: 163.5 / 220;
    }
}
/* ── About practice ─────────────────────────────────────────────── */

.about-practice {
    padding: 100px 40px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 60px;
    background: var(--color-oxblood-dark);
    color: var(--color-white);
}

.about-practice__title {
    margin: 0;
    display: inline-flex;
    flex-wrap: nowrap;
    align-items: flex-start;
    justify-content: center;
    gap: 0 10px;
    text-align: left;
    white-space: nowrap;
}

.about-practice__title-line {
    margin-top: 8px;
    font-family: "Neue Montreal", Arial, sans-serif;
    font-size: 80px;
    font-weight: 700;
    line-height: 80px;
    text-transform: uppercase;
    white-space: nowrap;
}

.about-practice__title-suffix {
    display: inline-flex;
    align-items: flex-start;
    gap: 12px;
    font-family: "Armany", serif;
    font-size: 92px;
    font-weight: 500;
    line-height: 92px;
    white-space: nowrap;
}

.about-practice__title-amp {
    display: inline-block;
    font-size: 24px;
    line-height: 92px;
}

.about-practice__artwork {
    position: relative;
    width: 400px;
    height: 500px;
}

.about-practice__cursor {
    position: fixed;
    top: 0;
    left: 0;
    width: 141px;
    height: 142px;
    pointer-events: none;
    opacity: 0;
    transform: translate3d(-9999px, -9999px, 0);
    transition: opacity 160ms ease;
    z-index: 20;
}

.about-practice__image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.about-practice__image.is-active {
    z-index: 1;
}

.about-practice__styles {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.about-practice__style {
    border: 0;
    padding: 0;
    background: none;
    font-family: "Armany", serif;
    font-size: 44px;
    font-weight: 500;
    color: var(--color-white);
    opacity: 0.5;
    cursor: pointer;
    transition: opacity 180ms ease;
}

.about-practice__style.is-active {
    opacity: 1;
}

@media (hover: hover) and (pointer: fine) {
    .about-practice__artwork,
    .about-practice__artwork .about-practice__image {
        cursor: none;
    }

    .about-practice__artwork.is-cursor-active .about-practice__cursor {
        opacity: 1;
    }
}

.about-practice__style:focus-visible {
    outline: var(--focus-ring);
    outline-offset: 4px;
}

.about-practice__divider {
    width: 80px;
    height: 2px;
    flex-shrink: 0;
}

.about-practice__mobile-gallery {
    display: none;
}

.about-practice__mobile-item {
    margin: 0;
}

.about-practice__mobile-image {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 5;
    object-fit: cover;
}

.about-practice__mobile-label {
    margin: 24px 0 0;
    font-family: "Armany", serif;
    font-size: 24px;
    font-weight: 500;
    line-height: 1;
    text-align: center;
}

/* Tablet: About practice */
@media (max-width: 1024px) {
    .about-practice {
        padding: 96px 24px;
    }

    .about-practice__title {
        width: min(100%, 720px);
        margin-bottom: 36px;
        flex-wrap: wrap;
        justify-content: space-between;
        gap: 6px 0;
        text-align: left;
        white-space: normal;
    }

    .about-practice__title-line {
        margin-top: 0;
        flex-basis: 100%;
        font-size: clamp(48px, 6.4vw, 62px);
        line-height: 0.95;
        white-space: normal;
    }

    .about-practice__title-suffix {
        width: 100%;
        justify-content: space-between;
        gap: 24px;
        font-size: clamp(70px, 9vw, 92px);
        line-height: 0.92;
        white-space: normal;
    }

    .about-practice__title-amp {
        font-size: 24px;
        line-height: 1;
        align-self: center;
    }

    .about-practice__mobile-gallery {
        display: grid;
        width: min(100%, 400px);
        margin: 0 auto;
        gap: 60px;
    }

    .about-practice__mobile-item {
        display: grid;
        gap: 24px;
    }

    .about-practice__mobile-label {
        margin-top: 0;
        font-size: 32px;
    }

    .about-practice__artwork,
    .about-practice__styles,
    .about-practice__cursor,
    .about-practice__divider {
        display: none;
    }
}

/* Mobile: About practice */
@media (max-width: 767px) {
    .about-practice {
        padding: 100px 12px;
    }

    .about-practice__title {
        display: inline-flex;
        flex-wrap: wrap;
        align-items: flex-start;
        justify-content: flex-start;
        width: min(100%, 320px);
        margin-bottom: 36px;
        gap: 8px;
        text-align: left;
        white-space: normal;
    }

    .about-practice__title-line {
        flex-basis: 100%;
        font-size: 28px;
        line-height: 1;
        white-space: normal;
    }

    .about-practice__title-suffix {
        flex-wrap: wrap;
        width: auto;
        justify-content: flex-start;
        align-items: baseline;
        gap: 4px 10px;
        font-size: 42px;
        line-height: 0.95;
        white-space: normal;
    }

    .about-practice__title-amp {
        font-size: 18px;
        line-height: 1;
        align-self: flex-start;
    }

    .about-practice__mobile-gallery {
        width: min(100%, 300px);
        gap: 60px;
    }

    .about-practice__mobile-label {
        font-size: 24px;
    }
}
/* ── About media ─────────────────────────────────────────────── */

.about-media {
    background: var(--color-white);
}

.about-media__inner {
    width: 100%;
    max-width: 1920px;
    margin: 0 auto;
    padding: 100px 40px 40px;
    display: flex;
    flex-direction: column;
    gap: 120px;
}

.about-media__title {
    margin: 0;
    font-family: "Armany", serif;
    font-size: 112px;
    font-weight: 500;
    line-height: 1;
    color: var(--color-black);
}

.about-media__list {
    width: 100%;
}

.about-media__article {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
}

.about-media__index {
    margin: 0;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    text-align: justify;
    color: var(--color-black);
}

.about-media__row {
    display: flex;
    gap: 20px;
    align-items: stretch;
}

.about-media__image {
    flex: 1 1 0;
    min-width: 0;
    height: 600px;
    aspect-ratio: 590 / 600;
    object-fit: cover;
}

.about-media__content {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 40px;
}

.about-media__copy {
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    text-align: justify;
    color: var(--color-black);
}

.about-media__copy p {
    margin: 0 0 28px;
}

.about-media__copy p:last-child {
    margin-bottom: 0;
}

.about-media__content > .button-pill {
    align-self: flex-start;
}

/* Tablet: About media */
@media (max-width: 1024px) {
    .about-media__inner {
        padding-right: 24px;
        padding-left: 24px;
        gap: 88px;
    }

    .about-media__title {
        font-size: clamp(68px, 11vw, 96px);
    }

    .about-media__row {
        flex-direction: column;
    }

    .about-media__image,
    .about-media__content {
        width: 100%;
    }

    .about-media__image {
        height: auto;
    }
}

/* Mobile: About media */
@media (max-width: 767px) {
    .about-media__inner {
        padding: 80px 16px;
        gap: 60px;
    }

    .about-media__title {
        font-size: 60px;
        line-height: 1;
    }

    .about-media__row {
        gap: 20px;
    }

    .about-media__image {
        flex: none;
        width: 100%;
        height: auto;
        aspect-ratio: 343 / 360;
    }

    .about-media__content {
        gap: 32px;
        justify-content: flex-start;
    }

    .about-media__copy {
        text-align: justify;
    }

    .about-media__copy p {
        margin-bottom: 0;
    }

    .about-media__copy p + p {
        margin-top: 20px;
    }
}

/* ── About contact ─────────────────────────────────────────────── */

.about-contact {
    max-width: var(--page-max-width);
    margin: 0 auto;
    padding: 100px var(--page-gutter);
    display: flex;
    justify-content: center;
    background: var(--color-black);
}

.about-contact__card {
    position: relative;
    width: min(631px, 100%);
    aspect-ratio: 631 / 700;
}

.about-contact__envelope-top {
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 99.84%;
    height: auto;
    transform: translateX(-50%);
}

.about-contact__panel {
    position: absolute;
    bottom: 15.71%;
    left: 50%;
    z-index: 2;
    display: block;
    width: 95.09%;
    height: 66.29%;
    color: inherit;
    text-decoration: none;
    transform: translate(-50%, 0);
    will-change: transform;
    transition: transform 380ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.about-contact__panel:focus-visible {
    outline: var(--focus-ring);
    outline-offset: 2px;
}

.about-contact__card:hover .about-contact__panel,
.about-contact__card:focus-within .about-contact__panel {
    transform: translate(-50%, -21.12%);
}

.about-contact__panel-media {
    display: block;
    width: 100%;
    height: 100%;
}

.about-contact__envelope-bottom {
    position: absolute;
    bottom: 0;
    left: 50%;
    z-index: 3;
    width: 99.84%;
    height: auto;
    transform: translateX(-50%);
    pointer-events: none;
}

.about-contact__wordmark {
    position: absolute;
    bottom: 13.43%;
    left: 50%;
    z-index: 4;
    width: 78.61%;
    height: auto;
    transform: translateX(-50%);
    pointer-events: none;
}

/* ── Gallery page ─────────────────────────────────────────────── */

.gallery-page-header {
    padding: 80px var(--page-gutter);
}

.gallery-page-header img {
    width: 100%;
}

.gallery-page-footer {
    display: none;
}

@media (max-width: 767px) {
    .gallery-page-header {
        padding: 40px var(--page-gutter);
    }
}

/* ── Collection page ─────────────────────────────────────────────── */
.collection-hero {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 40px;
    padding: 40px var(--page-gutter) 60px;
    text-align: center;
}

.collection-hero__title {
    width: 100%;
    margin: 0;
}

.collection-hero__title img {
    width: 100%;
}

.collection-hero__intro {
    max-width: 670px;
    margin: 0;
    font-size: 1.125rem;
    font-weight: 400;
    line-height: 1.4444444444;
    color: rgba(0, 0, 0, 0.7);
}

.collection-hero__intro p {
    margin: 0 0 1.5em;
}

.collection-hero__intro p:last-child {
    margin-bottom: 0;
}

.collection-hero__intro a {
    color: var(--color-neon-pink);
    font-weight: 700;
}

.collection-grid-section {
    padding: 40px var(--page-gutter) 120px;
}

.collection-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 60px;
    align-items: start;
    max-width: 1920px;
    margin: 0 auto;
}

.collection-card {
    grid-column: span 3;
    display: block;
    min-width: 0;
    color: inherit;
    text-decoration: none;
}

.collection-card:focus-visible {
    outline: 2px solid var(--color-neon-pink);
    outline-offset: 6px;
}

.collection-card--featured {
    grid-column: span 6;
}

.collection-card--placeholder {
    opacity: 0;
    pointer-events: none;
}

.collection-card__media {
    overflow: hidden;
}

.collection-card__media img {
    display: block;
    width: 100%;
    height: auto;
    transform: scale(1);
    transform-origin: center;
    transition: transform 0.45s ease;
}

.collection-card:hover .collection-card__media img {
    transform: scale(1.1);
}

.collection-card__body {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    margin-top: 20px;
    text-align: center;
}

.collection-card__type {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.4285714286;
    text-transform: uppercase;
    color: rgba(0, 0, 0, 0.5);
}

.collection-card__title {
    width: 100%;
    margin: 0;
    font-family: "Armany", serif;
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-black);
}

.collection-card__availability {
    margin: 0;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: rgba(0, 0, 0, 0.5);
}

.collection-more {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 60px;
    padding: 100px var(--page-gutter);
    background: #052649;
    color: var(--color-white);
}

.collection-more__title {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    width: max-content;
    margin: 0;
}

.collection-more__title-main {
    display: block;
    font-family: "Neue Montreal", Arial, sans-serif;
    font-size: 5rem;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    text-transform: uppercase;
}

.collection-more__title-lower {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    width: 100%;
}

.collection-more__from {
    font-family: "Neue Montreal", Arial, sans-serif;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
}

.collection-more__title-script {
    font-family: "Armany", serif;
    font-size: 5.75rem;
    font-weight: 500;
    line-height: 0.8;
}

.collection-more__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 555px));
    gap: 20px;
    justify-content: center;
    width: 100%;
}

.collection-style-card {
    position: relative;
    display: flex;
    align-items: flex-end;
    min-height: 700px;
    overflow: hidden;
    isolation: isolate;
    color: inherit;
    text-decoration: none;
    cursor: pointer;
}

.collection-style-card::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0) 58%,
        rgba(0, 0, 0, 0.3) 100%
    );
    z-index: 1;
}

.collection-style-card__image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.collection-style-card__content {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 28px;
    width: 100%;
    margin: 0 40px;
    padding-bottom: 40px;
    transform: translateY(100%);
    transition: transform 380ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.collection-style-card__title {
    position: absolute;
    bottom: 100%;
    inset-inline: 0;
    margin: 0 0 40px;
    font-family: "Armany", serif;
    font-size: 2.25rem;
    font-weight: 500;
    line-height: 1;
    color: var(--color-white);
    transition: margin-bottom 380ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.collection-style-card__description {
    max-width: 475px;
    margin: 0;
    font-size: 1.125rem;
    font-weight: 400;
    line-height: 1.4444444444;
    color: var(--color-white);
}

@media (min-width: 768px) {
    .collection-style-card:hover .collection-style-card__content {
        transform: translateY(0);
    }

    .collection-style-card:hover .collection-style-card__title {
        margin-bottom: 20px;
    }
}

/* Tablet: Collection page */
@media (max-width: 1024px) {
    .collection-hero {
        padding-top: 32px;
    }

    .collection-grid {
        grid-template-columns: repeat(6, minmax(0, 1fr));
        gap: 64px 32px;
    }

    .collection-card {
        grid-column: span 3;
    }

    .collection-card--featured {
        grid-column: span 6;
    }

    .collection-card--placeholder {
        display: none;
    }

    .collection-more {
        gap: 48px;
        padding-top: 88px;
        padding-bottom: 88px;
    }

    .collection-more__title {
        width: min(700px, 100%);
    }

    .collection-more__title-main {
        font-size: 3.75rem;
    }

    .collection-more__from {
        font-size: 1.25rem;
    }

    .collection-more__title-script {
        font-size: 4.5rem;
    }

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

    .collection-style-card {
        min-height: 600px;
    }
}

/* Mobile: Collection page */
@media (max-width: 767px) {
    .collection-hero {
        gap: 24px;
        padding: 24px var(--page-gutter) 40px;
    }

    .collection-hero__intro {
        font-size: 1rem;
        line-height: 1.5;
    }

    .collection-grid-section {
        padding-top: 24px;
        padding-bottom: 80px;
    }

    .collection-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 48px;
    }

    .collection-card {
        grid-column: auto;
    }

    .collection-card--featured {
        grid-column: auto;
    }

    .collection-card--placeholder {
        display: none;
    }

    .collection-card__title {
        font-size: 1.5rem;
        line-height: 1.1666666667;
    }

    .collection-card__availability {
        font-size: 0.875rem;
        line-height: 1.4285714286;
    }

    .collection-more {
        gap: 40px;
        padding: 80px var(--page-gutter);
    }

    .collection-more__title {
        width: 100%;
        gap: 4px;
    }

    .collection-more__title-main {
        font-size: clamp(1.5rem, 7.5vw, 3rem);
    }

    .collection-more__title-lower {
        justify-content: center;
        gap: 18px;
        width: auto;
    }

    .collection-more__from {
        font-size: 0.75rem;
    }

    .collection-more__title-script {
        font-size: clamp(2.5rem, 12vw, 3.25rem);
    }

    .collection-more__grid {
        display: flex;
        flex-direction: column;
        gap: 20px;
    }

    .collection-style-card {
        min-height: auto;
        aspect-ratio: 608.2143 / 767.1171;
    }

    .collection-style-card__content {
        gap: 16px;
        margin: 0;
        padding: 0 16px 16px;
        transform: translateY(0);
        transition: none;
    }

    .collection-style-card__title {
        position: static;
        margin: 0;
        font-size: 1.5rem;
        line-height: 2.25rem;
        transition: none;
    }

    .collection-style-card__description {
        font-size: 1rem;
        line-height: 1.4;
    }
}

/* ── Collection single (artwork detail) ─────────────────────────── */

.artwork-detail {
    width: 100%;
    margin-top: calc(var(--header-height) * -1);
}

.artwork-detail__layout {
    display: flex;
    flex-wrap: wrap;
}

.artwork-detail__content {
    flex: 1 1 400px;
    min-width: min(100%, 400px);
    max-width: 1000px;
    margin: 0 auto;
    padding: 120px 80px;
    background: var(--color-white);
}

.artwork-detail__content > .artwork-detail__block + .artwork-detail__block {
    margin-top: 100px;
}

.artwork-detail__block {
    display: flex;
    flex-direction: column;
    gap: 32px;
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
}

.artwork-detail__text {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.artwork-detail__heading {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    margin: 0;
    font-family: "Armany", serif;
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 2rem;
    color: var(--color-deep-turquoise);
}

.artwork-detail__heading-dot {
    flex-shrink: 0;
    width: 7px;
    height: 31px;
}

.artwork-detail__heading span {
    flex: 1 1 auto;
    min-width: 0;
}

.artwork-detail__copy {
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--color-black);
}

.artwork-detail__copy p {
    margin: 0 0 1rem;
}

.artwork-detail__copy p:last-child {
    margin-bottom: 0;
}

.artwork-detail__lede {
    margin: 0;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--color-black);
}

.artwork-detail__media {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.artwork-detail__media-row {
    display: flex;
    align-items: flex-end;
    gap: 12px;
    width: 100%;
}

.artwork-detail__media-row img {
    display: block;
    min-width: 0;
    height: auto;
}

.artwork-detail__media-row img:only-child {
    flex: 1 1 100%;
    width: 100%;
}

.artwork-detail__media-row img:not(:only-child) {
    flex: 0 1 auto;
    width: auto;
    max-width: 100%;
}

.artwork-detail__content
    :where(.wp-block-embed, .wp-block-video, iframe, video) {
    max-width: 100%;
}

.artwork-detail__content :where(.wp-block-embed iframe, .wp-block-video video) {
    display: block;
    width: 100%;
}

.artwork-detail__content p:has(> img) {
    display: flex;
    align-items: flex-end;
    gap: 12px;
}

.artwork-detail__content p:has(> img) img {
    display: block;
    min-width: 0;
    max-width: 100%;
    height: auto;
}

.artwork-detail__content p:has(> img) img:only-child {
    width: 100%;
}

.artwork-detail__content p:has(> img) img:not(:only-child) {
    flex: 1 1 0;
    width: 50%;
}

.artwork-purchase {
    flex: 0 0 400px;
    width: 400px;
    max-width: 100%;
    background: #f3f3f3;
}

.artwork-purchase__inner {
    --artwork-purchase-bar-offset: 57px;
    position: sticky;
    top: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    height: 100dvh;
    min-height: 100dvh;
    padding: var(--header-height) 32px 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
}

body.admin-bar .artwork-purchase__inner {
    top: var(--wp-admin--admin-bar--height, 32px);
    height: calc(100dvh - var(--wp-admin--admin-bar--height, 32px));
    min-height: calc(100dvh - var(--wp-admin--admin-bar--height, 32px));
}

.artwork-purchase__summary {
    display: flex;
    flex: 1 0 auto;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    width: 100%;
    min-height: auto;
    padding-bottom: var(--artwork-purchase-bar-offset);
    overflow: visible;
}

.artwork-purchase__image {
    width: 100%;
}

.artwork-purchase__image img {
    width: 100%;
    height: auto;
}

.artwork-purchase__info {
    display: flex;
    flex-direction: column;
    gap: 4px;
    width: 100%;
}

.artwork-purchase__category {
    margin: 0;
    font-size: 0.75rem;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: 0;
    text-transform: uppercase;
    color: var(--color-black);
    opacity: 0.5;
}

.artwork-purchase__title {
    margin: 0;
    font-family: "Armany", serif;
    font-size: 1.75rem;
    font-weight: 500;
    line-height: 1;
    color: var(--color-black);
}

.artwork-purchase__price {
    margin: 0;
    font-family: "Armany", serif;
    font-size: 1.25rem;
    font-weight: 500;
    line-height: 1;
    color: var(--color-black);
}

.artwork-purchase__purchase-bar {
    position: sticky;
    bottom: 0;
    z-index: 2;
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: auto;
    column-gap: 10px;
    row-gap: 0;
    align-items: center;
    align-content: center;
    min-height: 57px;
    width: calc(100% + 64px);
    margin: 0 -32px;
    padding-block: 8px;
    padding-inline: 32px;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    background: #f3f3f3;
}

.artwork-purchase__purchase-bar > * {
    margin-block-start: 0;
    margin-block-end: 0;
}

.artwork-purchase__purchase-bar > .artwork-purchase__price {
    grid-column: 1;
    grid-row: 1;
    justify-self: stretch;
}

.artwork-purchase__purchase-bar
    :is(
        .artwork-purchase__specs,
        .variations,
        .reset_variations_alert,
        .woocommerce-variation,
        form.cart input[type="hidden"]
    ) {
    display: none !important;
}

.artwork-purchase__purchase-bar > .artwork-purchase__dynamic-actions,
.artwork-purchase__purchase-bar .artwork-purchase__cta,
.artwork-purchase__purchase-bar .artwork-purchase__cta form.cart,
.artwork-purchase__purchase-bar
    .artwork-purchase__cta
    form.cart
    .single_variation_wrap,
.artwork-purchase__purchase-bar
    .artwork-purchase__cta
    form.cart
    .woocommerce-variation-add-to-cart {
    display: contents;
}

.artwork-purchase__purchase-bar
    .artwork-purchase__cta
    form.cart
    .woocommerce-variation {
    display: none !important;
}

.artwork-purchase__purchase-bar
    .artwork-purchase__cta
    form.cart
    .single_add_to_cart_button {
    grid-row: 1;
    grid-column: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    justify-self: end;
    box-sizing: border-box;
    height: 40px !important;
    min-height: 40px !important;
    padding: 10px 16px !important;
    line-height: 20px !important;
}

.artwork-purchase__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: center;
    margin: 0;
    padding: 0;
    list-style: none;
}

.artwork-purchase__tag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 8px;
    border-radius: 8px;
    background: var(--color-neon-pink);
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.4285714286;
    color: var(--color-white);
    white-space: nowrap;
}

.artwork-purchase__note {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.5;
    text-align: center;
    color: #323232;
}

.artwork-purchase__note p {
    margin: 0 0 0.5em;
}

.artwork-purchase__note p:last-child {
    margin-bottom: 0;
}

.artwork-purchase__note a {
    font-weight: 700;
    color: var(--color-neon-pink);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.artwork-purchase__note a:hover,
.artwork-purchase__note a:focus-visible {
    color: var(--color-deep-turquoise);
}

.artwork-purchase__cta {
    width: max-content;
}

.artwork-purchase__cta.button-pill {
    background: var(--color-black);
}

.artwork-purchase__cta .button-pill__label {
    color: var(--color-white);
}

.artwork-purchase__cta .button-pill__hover {
    color: var(--color-black);
}

.artwork-purchase__cta .button-pill__hover::before {
    background-image: url("data:image/svg+xml,%3Csvg width='213' height='96' viewBox='0 0 213 96' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cellipse cx='106.5' cy='48' rx='106.5' ry='48' fill='%23FFFFFF'/%3E%3C/svg%3E");
}

@media (max-width: 1024px) {
    .artwork-detail__content {
        flex: 1 1 100%;
        padding: 80px var(--page-gutter);
    }

    .artwork-detail__content > .artwork-detail__block + .artwork-detail__block {
        margin-top: 72px;
    }

    .artwork-purchase {
        flex: 1 1 100%;
        width: 100%;
    }

    .artwork-purchase__inner {
        position: static;
        height: auto;
        min-height: 0;
        padding: 80px var(--page-gutter) 60px;
    }

    .artwork-purchase__purchase-bar {
        width: calc(100% + (var(--page-gutter) * 2));
        margin-right: calc(var(--page-gutter) * -1);
        margin-left: calc(var(--page-gutter) * -1);
        margin-bottom: 0;
        padding-right: var(--page-gutter);
        padding-left: var(--page-gutter);
    }
}

@media (max-width: 767px) {
    .artwork-detail__layout {
        flex-direction: column;
    }

    .artwork-purchase {
        order: -1;
    }

    .artwork-purchase__inner {
        gap: 32px;
        padding: 80px var(--page-gutter) 40px;
    }

    .artwork-purchase__purchase-bar {
        margin-bottom: 0;
    }

    .artwork-purchase__title {
        font-size: 1.5rem;
    }

    .artwork-detail__content {
        padding: 40px var(--page-gutter);
    }

    .artwork-detail__content > .artwork-detail__block + .artwork-detail__block {
        margin-top: 40px;
    }

    .artwork-detail__block {
        gap: 32px;
    }

    .artwork-detail__text {
        gap: 16px;
    }

    .artwork-detail__heading {
        font-size: 1.25rem;
        line-height: 2rem;
    }

    .artwork-detail__media-row {
        align-items: flex-end;
    }

    .artwork-detail__media-row img:not(:only-child) {
        flex: 1 1 0;
        width: auto;
        object-fit: cover;
    }

    .artwork-detail__media-row img:not(:only-child):last-child {
        max-width: 240px;
    }
}

/* ── Services page ─────────────────────────────────────────────── */

.services-page-hero {
    display: flex;
    justify-content: center;
    padding: 64px var(--page-gutter) 40px;
}

.services-page-hero__title {
    width: 100%;
    max-width: 1920px;
    margin: 0;
}

.services-page-hero__title img {
    width: 100%;
    height: auto;
}

.page-services .section-line {
    background: var(--color-black);
    padding: 3px 0 10px;
}

.services-page-list {
    display: flex;
    flex-direction: column;
}

.services-page-block {
    padding: var(--page-gutter);
}

.services-page-block--pink {
    background: var(--color-about-pink);
    color: var(--color-black);
}

.services-page-block--white {
    background: var(--color-white);
    color: var(--color-black);
}

.services-page-block--navy {
    background: var(--color-navy);
    color: var(--color-white);
}

.services-page-block--black {
    background: var(--color-black);
    color: var(--color-white);
}

.services-page-block__inner {
    display: flex;
    gap: 60px;
    max-width: 1920px;
    margin: 0 auto;
}

.services-page-block__content {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-self: stretch;
    min-width: 0;
    padding: 40px 0;
}

.services-page-block__text {
    display: flex;
    flex-direction: column;
    gap: 60px;
}

.services-page-block__title {
    margin: 0;
    font-family: "Armany", serif;
    font-size: 3.75rem;
    font-weight: 500;
    line-height: 1;
}

.services-page-block__body {
    display: flex;
    gap: 60px;
    align-items: flex-start;
}

.services-page-block__description {
    flex: 1 1 0;
    min-width: 0;
    margin: 0;
    font-size: 1.25rem;
    line-height: 1.4;
    text-align: justify;
}

.services-page-block__ideal {
    flex: 0 0 160px;
    width: 160px;
}

.services-page-block__ideal-label {
    margin: 0 0 8px;
    font-family: "Armany", serif;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5;
    text-transform: uppercase;
}

.services-page-block__ideal-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.services-page-block__ideal-list li {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 0.875rem;
    line-height: 1.4285714286;
}

.services-page-block__ideal-list img {
    flex: 0 0 auto;
    width: 8px;
    height: auto;
}

.services-page-block__cta {
    width: 200px;
    margin-top: 40px;
}

.services-page-block__media {
    flex: 1 1 0;
    min-width: 0;
    height: 650px;
    overflow: hidden;
}

.services-page-block__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

@media (max-width: 1024px) {
    .services-page-hero {
        padding-top: calc(var(--header-height) + 48px);
    }

    .services-page-block__inner {
        gap: 40px;
    }

    .services-page-block__text {
        gap: 40px;
    }

    .services-page-block__title {
        font-size: 3rem;
    }

    .services-page-block__content {
        padding: 0;
    }

    .services-page-block__body {
        flex-direction: column;
        gap: 40px;
    }

    .services-page-block__ideal {
        width: 160px;
        flex-basis: auto;
    }

    .services-page-block__media {
        height: 480px;
    }
}

@media (max-width: 767px) {
    .services-page-hero {
        padding: 36px var(--page-gutter) 32px;
    }

    .services-page-block {
        padding-block: 40px;
    }

    .services-page-block__inner {
        flex-direction: column;
        gap: 32px;
    }

    .services-page-block__content {
        padding: 0;
        gap: 24px;
        justify-content: flex-start;
    }

    .services-page-block__text {
        gap: 16px;
    }

    .services-page-block__title {
        font-size: 2rem;
    }

    .services-page-block__body {
        flex-direction: column;
        gap: 20px;
    }

    .services-page-block__description {
        font-family: "Neue Montreal", Arial, sans-serif;
        font-size: 1rem;
    }

    .services-page-block__ideal {
        width: 160px;
        flex-basis: auto;
    }

    .services-page-block__media {
        flex: none;
        position: relative;
        order: -1;
        align-self: stretch;
        width: 100%;
        height: auto;
        aspect-ratio: 343 / 322;
    }

    .services-page-block__media img {
        position: absolute;
        inset: 0;
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .services-page-block--media-first .services-page-block__media {
        order: -1;
    }

    .services-page-block__cta {
        --button-pill-font-size: 14px;
        --button-pill-line-height: 20px;
        --button-pill-padding-y: 10px;
        --button-pill-padding-x: 16px;
        width: 118px;
        max-width: none;
        margin-top: 0;
    }
}

/* ── Blogs page ─────────────────────────────────────────────── */

.page-blogs .site-shell {
    margin-top: calc(var(--header-height) * -1);
}

.blogs-hero {
    background: var(--color-about-pink);
}

.blogs-hero__grid {
    display: flex;
    align-items: stretch;
    max-width: var(--page-max-width);
    margin: 0 auto;
}

.blogs-hero__content,
.blogs-hero__media {
    flex: 1 1 50%;
    min-width: 0;
}

.blogs-hero__content {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    gap: 48px;
    min-height: 884px;
    padding: 160px var(--page-gutter) 92px;
}

.blogs-hero__meta {
    margin: 0;
    font-size: 12px;
    font-weight: 500;
    line-height: 18px;
    text-transform: uppercase;
    opacity: 0.7;
}

.blogs-hero__meta span {
    display: inline-block;
    margin-inline: 6px;
    font-size: 10px;
    transform: translateY(-1px);
}

.blogs-hero__copy {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
    width: min(100%, 345px);
    text-align: center;
}

.blogs-hero__title {
    margin: 0;
    font-family: "Armany", serif;
    font-size: 32px;
    font-weight: 600;
    line-height: 32px;
    letter-spacing: 0;
}

.blogs-hero__divider {
    width: 60px;
    border-top: 1px solid currentColor;
    opacity: 0.7;
}

.blogs-hero__description {
    margin: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    opacity: 0.7;
}

.blogs-hero__cta {
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    text-transform: uppercase;
    opacity: 0.75;
}

.blogs-hero__cta:focus-visible {
    outline: var(--focus-ring);
    outline-offset: 4px;
}

.blogs-hero__media {
    padding: 130px 100px 56px 40px;
}

.blogs-hero__media img {
    width: 100%;
    height: 100%;
    min-height: 698px;
    object-fit: cover;
}

.blogs-index {
    background: var(--color-white);
    padding: 120px var(--page-gutter) 124px;
}

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

.blogs-index__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 60px;
    max-width: var(--page-max-width);
    margin: 0 auto;
}

.blog-card {
    display: block;
    min-width: 0;
    color: inherit;
    text-decoration: none;
}

.blog-card:focus-visible {
    outline: 2px solid var(--color-neon-pink);
    outline-offset: 6px;
}

.blog-card__media {
    margin: 0 52px -52px 0;
    aspect-ratio: 1;
    overflow: hidden;
}

.blog-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.blog-card__body {
    position: relative;
    z-index: 1;
    margin-left: 52px;
    padding: 24px;
    border: 1px solid rgba(5, 38, 73, 0.45);
    background: var(--color-white);
    transition:
        background-color 220ms ease,
        border-color 220ms ease;
}

.blog-card__title {
    margin: 0 0 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(5, 38, 73, 0.45);
    font-family: "Neue Montreal", Arial, sans-serif;
    font-size: 20px;
    font-weight: 500;
    line-height: 28px;
    color: var(--color-navy);
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition:
        color 220ms ease,
        border-color 220ms ease;
}

.blog-card__description {
    margin: 0;
    min-height: 60px;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    color: var(--color-navy);
    opacity: 0.7;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: color 220ms ease;
}

.blog-card__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 20px;
    font-size: 12px;
    font-weight: 500;
    line-height: 18px;
    text-transform: uppercase;
    color: var(--color-navy);
    opacity: 0.7;
    transition: color 220ms ease;
}

.blog-card:hover .blog-card__body,
.blog-card:focus-within .blog-card__body {
    background-color: var(--color-navy);
    border-color: transparent;
}

.blog-card:hover .blog-card__title,
.blog-card:focus-within .blog-card__title {
    color: var(--color-white);
    border-bottom-color: transparent;
}

.blog-card:hover .blog-card__description,
.blog-card:focus-within .blog-card__description {
    color: var(--color-white);
}

.blog-card:hover .blog-card__meta,
.blog-card:focus-within .blog-card__meta {
    color: var(--color-white);
}

@media (max-width: 1024px) {
    .blogs-hero__content {
        min-height: 720px;
        padding: 132px var(--page-gutter) 72px;
        gap: 40px;
    }

    .blogs-hero__media {
        padding: 132px var(--page-gutter) 48px 0;
    }

    .blogs-hero__media img {
        min-height: 540px;
    }

    .blogs-index {
        padding-block: 96px;
    }

    .blogs-index__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 48px 32px;
    }

    .blog-card__media {
        margin-right: 40px;
        margin-bottom: -40px;
    }

    .blog-card__body {
        margin-left: 40px;
    }
}

@media (max-width: 767px) {
    .blogs-hero__grid {
        flex-direction: column;
    }

    .blogs-hero__content,
    .blogs-hero__media {
        flex: 1 1 100%;
        width: 100%;
    }

    .blogs-hero__content {
        min-height: 0;
        justify-content: flex-start;
        padding: 80px var(--page-gutter) 40px;
        gap: 32px;
    }

    .blogs-hero__copy {
        width: 100%;
        max-width: 343px;
        gap: 24px;
    }

    .blogs-hero__title {
        font-size: 32px;
        line-height: 32px;
    }

    .blogs-hero__media {
        display: none;
    }

    .blogs-hero__media img {
        min-height: 0;
    }

    .blogs-index {
        padding: 60px var(--page-gutter);
    }

    .blogs-index__grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .blog-card__media {
        margin-right: 32px;
        margin-bottom: -52px;
        aspect-ratio: 361 / 360;
    }

    .blog-card__body {
        margin-left: 32px;
        padding: 24px;
    }

    .blog-card__title {
        font-size: 20px;
        line-height: 28px;
    }

    .blog-card__description {
        min-height: 62px;
    }
}

/* ── Single blog page ─────────────────────────────────────────────── */

.page-single .site-shell {
    margin-top: calc(var(--header-height) * -1);
}

.single-hero {
    padding: 20px 0 60px;
    background: var(--color-white);
}

.single-hero__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 52px;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 40px;
}

.single-hero__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin: 0;
    font-size: 12px;
    font-weight: 500;
    line-height: 18px;
    text-align: center;
    text-transform: uppercase;
    opacity: 0.7;
}

.single-hero__title {
    max-width: 1200px;
    margin: 0;
    font-family: "Armany", serif;
    font-size: 60px;
    font-weight: 600;
    line-height: 60px;
    text-align: center;
    text-wrap: balance;
}

.single-hero__media {
    width: 100%;
    max-width: 1200px;
    margin: 0;
    aspect-ratio: 2 / 1;
    overflow: hidden;
}

.single-hero__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.single-article {
    padding: 40px 0 120px;
}

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

.single-article__layout {
    display: grid;
    grid-template-columns: minmax(0, 200px) minmax(0, 880px) minmax(0, 200px);
    max-width: 1280px;
    margin: 0 auto;
}

.single-article__main {
    min-width: 0;
    padding: 0 40px;
}

.single-article__content {
    display: block;
}

.single-article__content h2,
.single-article__content h3,
.single-article__content h4,
.single-article__content h5 {
    margin: 0;
    font-family: "Neue Montreal", Arial, sans-serif;
    font-weight: 500;
    color: var(--color-black);
    letter-spacing: -0.4px;
}

.single-article__content h2 {
    font-size: 40px;
    line-height: 48px;
}

.single-article__content h3 {
    font-size: 32px;
    line-height: 32px;
}

.single-article__content h4 {
    font-size: 24px;
    line-height: 24px;
}

.single-article__content h5 {
    font-size: 20px;
    line-height: 20px;
}

.single-article__content p,
.single-article__content li,
.single-article__content th,
.single-article__content td {
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    color: var(--color-black);
}

.single-article__content p {
    margin: 0;
}

.single-article__content h2,
.single-article__content h3,
.single-article__content h4,
.single-article__content h5 {
    margin-bottom: 16px;
}

.single-article__content h2:not(:first-child),
.single-article__content h3,
.single-article__content h4,
.single-article__content h5 {
    margin-top: 40px;
}

.single-article__content p + p,
.single-article__content p + ul,
.single-article__content p + ol,
.single-article__content ul + figure,
.single-article__content ol + figure {
    margin-top: 16px;
}

.single-article__content p + p {
    margin-top: 1.5em;
}

.single-article__content p + ul,
.single-article__content p + ol,
.single-article__content ul + figure,
.single-article__content ol + figure {
    margin-top: 16px;
}

.single-article__content ul,
.single-article__content ol {
    margin: 0;
    padding-left: 24px;
    list-style-position: outside;
}

.single-article__content ul {
    list-style-type: disc;
}

.single-article__content ol {
    list-style-type: decimal;
}

.single-article__content figure {
    width: 100%;
    margin: 0;
    overflow: hidden;
}

.single-article__content img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.single-article__content h3 + * + * + figure {
    aspect-ratio: 800 / 533;
}

.single-article__content h4 + * + figure {
    position: relative;
    aspect-ratio: 67 / 40;
}

.single-article__content h4 + * + figure::before {
    content: "";
    position: absolute;
    inset: 50% auto auto 50%;
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.52);
    transform: translate(-50%, -50%);
}

.single-article__content h4 + * + figure::after {
    content: "";
    position: absolute;
    inset: 50% auto auto 50%;
    border-top: 11px solid transparent;
    border-bottom: 11px solid transparent;
    border-left: 18px solid var(--color-white);
    transform: translate(-34%, -50%);
}

.single-article__table-wrap {
    display: block;
    max-width: 100%;
    min-width: 0;
    width: 100%;
    margin-top: 40px;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
}

.single-article__content table {
    width: 100%;
    min-width: 800px;
    margin-top: 0;
    border-collapse: collapse;
    table-layout: fixed;
}

.single-article__content th,
.single-article__content td {
    min-width: 0;
    padding: 10px 24px 10px 0;
    text-align: left;
    vertical-align: top;
    border-bottom: 1px solid var(--color-black);
}

.single-article__content th:last-child,
.single-article__content td:last-child {
    padding-right: 0;
}

.single-author {
    display: flex;
    gap: 14px;
    align-items: center;
    width: 100%;
    min-height: 120px;
    margin-top: 40px;
    padding: 20px 0;
    border-top: 1px solid var(--color-black);
    border-bottom: 1px solid var(--color-black);
}

.single-author__avatar {
    flex: 0 0 80px;
    width: 80px;
    height: 80px;
    margin: 0;
    overflow: hidden;
    border-radius: 16px;
}

.single-author__avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.single-author__info {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
    min-width: 0;
}

.single-author__eyebrow,
.single-author__role {
    margin: 0;
    color: var(--color-black);
}

.single-author__eyebrow {
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
}

.single-author__row {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
}

.single-author__name {
    margin: 0;
    flex: 1 1 auto;
    min-width: 0;
    font-size: 18px;
    font-weight: 700;
    line-height: 26px;
}

.single-author__social {
    display: inline-flex;
    flex: 0 0 20px;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    padding: 4px;
    margin-left: auto;
    background: var(--color-neon-pink);
    transition: transform 180ms ease;
}

.single-author__social:hover,
.single-author__social:focus-visible {
    transform: translateY(-1px);
}

.single-author__social:focus-visible {
    outline: var(--focus-ring);
    outline-offset: 4px;
}

.single-author__role {
    font-size: 14px;
    font-weight: 500;
    line-height: 21px;
    letter-spacing: -0.14px;
}

@media (max-width: 1024px) {
    .single-hero {
        padding-top: 20px;
        padding-bottom: 48px;
    }

    .single-hero__inner {
        gap: 40px;
        padding: 0 var(--page-gutter);
    }

    .single-hero__title {
        font-size: 44px;
        line-height: 44px;
    }

    .single-article {
        padding-bottom: 80px;
    }

    .single-article__layout {
        grid-template-columns: 1fr;
        max-width: 880px;
        padding: 0 var(--page-gutter);
    }

    .single-article__gutter {
        display: none;
    }

    .single-article__main {
        padding: 0;
    }

    .single-article__content {
        display: block;
    }

    .single-author {
        margin-top: 40px;
    }
}

@media (max-width: 767px) {
    .single-hero {
        padding-top: 80px;
        padding-bottom: 40px;
    }

    .single-hero__inner {
        gap: 32px;
        padding: 0 16px;
    }

    .single-hero__meta {
        gap: 10px;
    }

    .single-hero__title {
        font-size: 32px;
        line-height: 32px;
        max-width: 311px;
    }

    .single-hero__media {
        aspect-ratio: 343 / 220;
    }

    .single-article {
        padding: 40px 0;
    }

    .single-article__content {
        display: block;
    }

    .single-article__content h2 {
        font-size: 32px;
        line-height: 32px;
    }

    .single-article__content h3 {
        font-size: 26px;
        line-height: 26px;
    }

    .single-article__content h4 {
        font-size: 20px;
        line-height: 20px;
        letter-spacing: -0.2px;
    }

    .single-article__content h5 {
        font-size: 18px;
        line-height: 18px;
        letter-spacing: -0.2px;
    }

    .single-article__content p,
    .single-article__content li,
    .single-article__content th,
    .single-article__content td {
        font-size: 16px;
        line-height: 24px;
    }

    .single-article__content ul,
    .single-article__content ol {
        padding-left: 24px;
    }

    .single-article__content h4 + * + figure::before {
        width: 40px;
        height: 40px;
    }

    .single-article__content h4 + * + figure::after {
        border-top-width: 7px;
        border-bottom-width: 7px;
        border-left-width: 11px;
    }

    .single-article__content th,
    .single-article__content td {
        padding-right: 24px;
    }

    .single-author {
        gap: 14px;
        align-items: center;
        min-height: 120px;
        margin-top: 40px;
        padding: 20px 0;
    }

    .single-author__avatar {
        flex-basis: 80px;
        width: 80px;
        height: 80px;
    }

    .single-author__name {
        font-size: 18px;
        line-height: 26px;
    }

    .single-author__role {
        line-height: 21px;
    }
}