:root{
    --text-base: 16px;
    --gallery-bg:#f7f5ef;
    --gallery-gold:#c88b2a;
    --gallery-text:#2a2a2a;
    --gallery-serif:"Zen Old Mincho", "Noto Serif", "Noto Serif Armenian", Georgia, "Times New Roman", serif;
    --gallery-sans:"Zen Old Mincho", "Noto Serif", "Noto Serif Armenian", Georgia, "Times New Roman", serif;
    --gallery-meta-size:16px;
    --gallery-meta-line-height:1.5;
    --gallery-meta-weight:800;
    --gallery-meta-font-en:"Noto Serif Armenian", "Noto Serif", Georgia, serif;
    --gallery-meta-font-ru:"Noto Serif", Georgia, serif;
    --gallery-meta-font-hy:"Noto Serif Armenian", Georgia, serif;
    /* Figma 1440: art band 800px tall; scales down fluidly */
    --gallery-hero-band-h: clamp(280px, calc(100vw * 800 / 1440), 800px);
    --gallery-hero-featured-w: min(calc(100vw - 48px), calc(100vw * 520 / 1440));
    /* Half of featured image hangs below art band (Figma); kept inside .gallery-hero to avoid page scroll */
    --gallery-hero-featured-overlap: calc(min(var(--gallery-hero-featured-w), 520px) * 663 / 884 / 2);
}

/* HERO BLOCK */
.gallery-hero{
    position: relative;
    z-index: 2;
    background: var(--gallery-bg);
    overflow: hidden;
}

/* Gallery index only: room for featured image overlap without growing the page */
.gallery-hero:not(.gallery-hero--exhibitions){
    padding-bottom: var(--gallery-hero-featured-overlap);
}

.gallery-hero-inner{
    max-width: 1440px;
    margin: 0 auto;
    padding: 48px 24px 24px;
    text-align: center;
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    overflow-wrap: anywhere;
}

.gallery-hero-title{
    margin: 0;
    font-family: var(--gallery-serif);
    font-size: clamp(24px, 6.5vw + 0.35rem, 86px);
    line-height: 1;
    font-weight: 500;
    color: var(--gallery-gold);
    max-width: 100%;
    overflow-wrap: anywhere;
    word-break: break-word;
}

@media (max-width: 576px){
    .gallery-hero-title{
        font-size: clamp(18px, 3.6vw + 0.7rem, 30px);
        letter-spacing: 0.01em;
    }
}

.gallery-hero-subtitle{
    max-width: 620px;
    margin: 18px auto 0;
    font-size: 16px;
    line-height: 1.7;
    font-weight: 300;
    color: var(--gallery-text);
    overflow-wrap: anywhere;
    word-break: break-word;
    box-sizing: border-box;
}

.gallery-hero-art{
    position: relative;
    width: 100%;
    height: var(--gallery-hero-band-h);
    min-height: var(--gallery-hero-band-h);
    background: var(--gallery-bg);
    overflow: visible;
    z-index: 2;
}

.gallery-hero-art-bg{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 100vw;
    max-width: 100vw;
    height: 100%;
    margin: 0;
    transform: translateX(-50%);
    opacity: .28;
    z-index: 1;
    overflow: hidden;
    display: block;
}

.gallery-hero-art-bg img{
    width: 100%;
    min-width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center center;
    filter: brightness(1.04);
}

/* Exhibitions hero: show background only on upper part (Figma-like) */
.gallery-hero--exhibitions .gallery-hero-art-bg{
    /* only top part has background image */
    bottom: 42%;
}

.gallery-hero--exhibitions .gallery-hero-art-bg img{
    object-fit: cover;
    object-position: top center;
}

.gallery-hero-wave{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(var(--gallery-hero-band-h) * 190 / 430);
    z-index: 2;
}

.gallery-hero-stroke{
    position: absolute;
    top: calc(var(--gallery-hero-band-h) * 80 / 430);
    left: 0;
    width: 100%;
    height: calc(var(--gallery-hero-band-h) * 120 / 430);
    z-index: 3;
    pointer-events: none;
}

.gallery-hero-featured{
    position: absolute;
    left: auto;
    /* Figma: bottom-right of art band; on wide screens align with 1440px content + 70px inset */
    right: max(18px, calc((100vw - 1440px) / 2 + 70px));
    bottom: calc(-1 * var(--gallery-hero-featured-overlap));
    width: var(--gallery-hero-featured-w);
    max-width: 520px;
    height: auto;
    z-index: 15;
    background: transparent;
    border: 0;
    outline: none;
    box-shadow: none;
    pointer-events: auto;
}

.gallery-hero-featured-link{
    display: block;
    width: 100%;
    height: auto;
    line-height: 0;
    text-decoration: none;
    background: transparent;
    border: 0;
    outline: none;
    box-shadow: none;
    overflow: hidden;
    cursor: pointer;
    position: relative;
    z-index: 1;
}

.gallery-hero-featured img{
    width: 100%;
    height: auto;
    display: block;
    border: 0;
    outline: none;
    background: transparent;
    box-shadow: 0 16px 30px rgba(0,0,0,.12);
    vertical-align: top;
    transform-origin: center center;
    transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* GALLERY LIST */
.gallery-page{
    position: relative;
    z-index: 1;
    background: var(--gallery-bg);
    margin-top: -40px;
    padding: 0 0 110px 0;
}

.gallery-page-inner{
    max-width: 1700px;
    margin: 0 auto;
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    overflow-wrap: anywhere;
    /*padding: 150px 110px 0;*/
}

.gallery-page-head{
    display: block;
}

.gallery-page-section-title{
    margin: 0 0 22px;
    font-family: var(--gallery-serif);
    color: var(--gallery-gold);
    font-size: clamp(26px, 3.5vw + 0.75rem, 48px);
    font-weight: 500;
    letter-spacing: .04em;
    text-transform: uppercase;
    line-height: 1;
    max-width: 100%;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.gallery-page-toptexts{
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 88px;
    row-gap: 20px;
}

.gallery-page-toptext{
    font-size: 16px;
    line-height: 1.75;
    font-weight: 300;
    color: var(--gallery-text);
    max-width: 520px;
    min-width: 0;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.gallery-page-grid{
    margin-top: 54px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 60px;
    row-gap: 64px;
    align-items: start;
}

.gallery-page-card{
    display: block;
    width: 100%;
    min-width: 0;
}

.gallery-page-card:nth-child(odd){
    grid-column: 1;
}

.gallery-page-card:nth-child(even){
    grid-column: 2;
}

.gallery-page-card-link{
    display: block;
    text-decoration: none;
}

.gallery-page-image{
    width: 100%;
    overflow: hidden;
    border: 0;
    background: transparent;
    aspect-ratio: 4 / 3;
}

.gallery-page-image img{
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center;
}

.gallery-page-meta{
    margin-top: 12px;
}

.gallery-page-item-title{
    font-family: var(--gallery-serif);
    color: var(--gallery-gold);
    font-size: 18px;
    line-height: 1.15;
    font-weight: 500;
    letter-spacing: .04em;
    text-transform: uppercase;
    max-width: 100%;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.gallery-page-item-desc{
    margin-top: 6px;
    font-size: 16px;
    line-height: 1.7;
    font-weight: 300;
    color: var(--gallery-text);
    max-width: 520px;
}
.gallery-bottom-feature{
    position: relative;
    background: #E8D5AC;
    padding: 88px 0 80px;
    overflow: hidden;
}

.gallery-bottom-feature::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 90px;
    background: #f7f5ef;
    clip-path: polygon(
        0 0,
        0 72%,
        10% 28%,
        22% 6%,
        34% 4%,
        46% 12%,
        58% 34%,
        68% 66%,
        78% 68%,
        88% 62%,
        96% 26%,
        100% 0
    );
    z-index: 1;
}

.gallery-bottom-feature-inner{
    position: relative;
    z-index: 2;
}
.gallery-bottom-feature::after{
    content:"";
    position:absolute;
    bottom:0;
    left:0;
    width:100%;
    height:26px;
    background:#f7f5ef;
    clip-path: polygon(0 100%, 0 24%, 10% 12%, 24% 22%, 38% 8%, 52% 20%, 66% 10%, 80% 20%, 92% 12%, 100% 0, 100% 100%);
}

.gallery-bottom-feature-inner{
    max-width:1700px;
    margin:0 auto;
    padding:0 110px;
    display:grid;
    grid-template-columns: 0.9fr 1.1fr;
    gap:54px;
    align-items:start;
    position:relative;
    z-index:2;
}

.gallery-bottom-feature-content{
    padding-top:72px;
}

.gallery-bottom-feature-title{
    margin:0 0 24px;
    font-family:var(--gallery-serif);
    color:#9f2f34;
    font-size:38px;
    line-height:1;
    font-weight:500;
    text-transform:uppercase;
    max-width:100%;
    overflow-wrap:anywhere;
    word-break:break-word;
}

.gallery-bottom-feature-list{
    margin:0;
    padding-left:20px;
}

.gallery-bottom-feature-list li{
    margin:0 0 18px;
    font-size: 16px;
    line-height:1.95;
    font-weight:300;
    color:#2a2a2a;
}

.gallery-bottom-feature-list li p{
    margin:0;
}

.gallery-bottom-feature-media{
    position:relative;
}

.gallery-bottom-feature-image{
    width:100%;
    display:block;
    object-fit:cover;
    object-position:center;
}

.gallery-bottom-feature-arrow{
    position:absolute;
    right:-18px;
    top:50%;
    transform:translateY(-50%);
    width:48px;
    height:48px;
    border-radius:999px;
    background:#ffffff;
    color:var(--gallery-gold);
    display:flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
    font-size:24px;
    box-shadow:0 8px 22px rgba(0,0,0,.08);
}

/* =========================
   ARTWORK SHOW HERO (static_pages.gallery.show_hero)
   ========================= */

.artwork-show-hero{
    position: relative;
    background: var(--gallery-bg);
    overflow: hidden;
    padding: 0;
}

.artwork-show-hero__top{
    position: relative;
    z-index: 3;
    padding: 54px 0 26px;
}

.artwork-show-hero__inner{
    position: relative;
    z-index: 3;
    max-width: 1240px;
    margin: 0 auto;
    padding: 0 20px;
    text-align: center;
    box-sizing: border-box;
    min-width: 0;
    overflow-wrap: anywhere;
}

.artwork-show-hero__title{
    margin: 0;
    font-family: var(--gallery-serif);
    color: var(--gallery-gold);
    font-size: clamp(44px, 6vw, 86px);
    font-weight: 500;
    line-height: 1.02;
    max-width: 100%;
    overflow-wrap: anywhere;
}

.artwork-show-hero__subtitle{
    margin-top: 14px;
    font-size: 16px;
    line-height: 1.75;
    font-weight: 300;
    color: var(--gallery-text);
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
    overflow-wrap: anywhere;
}

.artwork-show-hero__visual{
    position: relative;
    height: var(--gallery-hero-band-h);
    background: var(--gallery-bg);
    overflow: hidden; /* keep hero clean: don't let artwork overlap */
}

/* Keep consistent distance between hero and artwork (Figma-like) */
.artwork-show-hero + .artwork,
.collection-hero-fixed + .artwork{
    position: relative;
    z-index: 4;
    margin-top: -70px;
    /*padding-top: 0;*/
}

.artwork-show-hero__bg{
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center;
    opacity: .35;
    filter: brightness(1.03);
    z-index: 1;
}

.artwork-show-hero__wave{
    position: absolute;
    top: -1px;
    left: 0;
    width: 100%;
    height: calc(var(--gallery-hero-band-h) * 190 / 430);
    z-index: 2;
    pointer-events: none;
}

.artwork-show-hero__stroke{
    position: absolute;
    left: 0;
    top: calc(var(--gallery-hero-band-h) * 78 / 430);
    z-index: 3;
    width: 100%;
    height: calc(var(--gallery-hero-band-h) * 120 / 430);
    pointer-events: none;
}

@media (max-width:1200px){
    :root{
        --gallery-hero-band-h: clamp(260px, calc(100vw * 560 / 1440), 560px);
        --gallery-hero-featured-w: min(calc(100vw - 40px), calc(100vw * 520 / 1440));
    }

    .artwork-show-hero__top{
        padding-top: 44px;
    }

    .artwork-show-hero + .artwork,
    .collection-hero-fixed + .artwork{
        margin-top: -54px;
    }
}

@media (max-width:1024px) and (min-width:769px){
    :root{
        --gallery-hero-featured-w: min(calc(100vw - 56px), 400px);
    }

    .gallery-hero:not(.gallery-hero--exhibitions) .gallery-hero-featured{
        max-width: 400px;
        right: max(18px, calc((100vw - 1440px) / 2 + 56px));
    }
}

@media (max-width:768px){
    :root{
        --gallery-hero-featured-w: min(78vw, 280px);
        --gallery-hero-featured-overlap: calc(min(var(--gallery-hero-featured-w), 280px) * 663 / 884 * 0.28);
        --gallery-hero-band-h: max(
            clamp(185px, 50vw, 235px),
            calc(min(var(--gallery-hero-featured-w), 280px) * 663 / 884 * 0.62)
        );
    }

    .artwork-show-hero__top{
        padding: 34px 0 18px;
    }

    .artwork-show-hero__title{
        font-size: clamp(34px, 9vw, 54px);
    }

    .artwork-show-hero + .artwork,
    .collection-hero-fixed + .artwork{
        margin-top: -40px;
    }
}

@media (max-width:1200px){
    .gallery-bottom-feature-inner{
        padding:0 70px;
        grid-template-columns:1fr;
    }

    .gallery-bottom-feature-content{
        padding-top:40px;
    }

    .gallery-bottom-feature-arrow{
        right:18px;
    }
}

@media (max-width:768px){
    .gallery-bottom-feature{
        padding:60px 0 56px;
    }

    .gallery-bottom-feature-inner{
        padding:0 18px;
        gap:28px;
    }

    .gallery-bottom-feature-title{
        font-size:28px;
    }

    .gallery-bottom-feature-list li{
        font-size: 16px;
        line-height:1.8;
    }

    .gallery-bottom-feature-arrow{
        width:42px;
        height:42px;
        font-size:20px;
        right:12px;
    }
}

@media (max-width:1200px){
    .gallery-page{
        margin-top: -20px;
    }

    .gallery-page-inner{
        padding: 110px 70px 0;
    }

    .gallery-page-grid{
        grid-template-columns: 1fr;
        row-gap: 46px;
        column-gap: 0;
    }

    .gallery-page-card:nth-child(odd),
    .gallery-page-card:nth-child(even){
        grid-column: auto;
    }

}

@media (max-width:768px){
    .gallery-hero:not(.gallery-hero--exhibitions) .gallery-hero-inner{
        position: relative;
        z-index: 1;
        padding: 34px 16px 14px;
    }

    .gallery-hero:not(.gallery-hero--exhibitions) .gallery-hero-subtitle{
        font-size: 16px;
        max-width: 92%;
    }

    .gallery-hero:not(.gallery-hero--exhibitions) .gallery-hero-art{
        position: relative;
        z-index: 2;
        height: var(--gallery-hero-band-h);
        min-height: var(--gallery-hero-band-h);
        margin-top: 6px;
        padding: 0;
        box-sizing: border-box;
        overflow: visible;
        isolation: isolate;
    }

    .gallery-hero:not(.gallery-hero--exhibitions) .gallery-hero-art-bg{
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        max-width: 100%;
        height: 100%;
        min-height: 100%;
        margin: 0;
        transform: none;
        z-index: 1;
        overflow: hidden;
    }

    .gallery-hero:not(.gallery-hero--exhibitions) .gallery-hero-art-bg img{
        object-fit: cover;
        object-position: center center;
    }

    .gallery-hero:not(.gallery-hero--exhibitions) .gallery-hero-wave,
    .gallery-hero:not(.gallery-hero--exhibitions) .gallery-hero-stroke{
        left: 0;
        width: 100%;
        pointer-events: none;
    }

    .gallery-hero:not(.gallery-hero--exhibitions) .gallery-hero-wave{
        top: 0;
        z-index: 2;
        height: calc(var(--gallery-hero-band-h) * 190 / 430);
    }

    .gallery-hero:not(.gallery-hero--exhibitions) .gallery-hero-stroke{
        top: calc(var(--gallery-hero-band-h) * 80 / 430);
        z-index: 3;
        height: calc(var(--gallery-hero-band-h) * 120 / 430);
    }

    .gallery-hero:not(.gallery-hero--exhibitions) .gallery-hero-featured{
        left: 50%;
        right: auto;
        bottom: calc(-1 * var(--gallery-hero-featured-overlap));
        width: var(--gallery-hero-featured-w);
        max-width: 280px;
        margin: 0;
        transform: translateX(-50%);
        z-index: 10;
    }

    .gallery-hero:not(.gallery-hero--exhibitions) .gallery-hero-featured-link{
        position: relative;
        z-index: 1;
    }

    .gallery-hero:not(.gallery-hero--exhibitions) .gallery-hero-featured img{
        box-shadow: 0 10px 22px rgba(0,0,0,.12);
    }

    .gallery-index{
        z-index: 0;
        margin-top: calc(-1 * var(--gallery-hero-featured-overlap));
        padding-top: calc(var(--gallery-hero-featured-overlap) + 36px);
    }

    .gallery-page{
        margin-top: 0;
        padding: 0 0 74px;
    }

    .gallery-page-inner{
        padding: 76px 18px 0;
    }

    .gallery-page-toptexts{
        grid-template-columns: 1fr;
        row-gap: 16px;
    }

    .gallery-page-grid{
        grid-template-columns: 1fr;
        gap: 34px;
        margin-top: 34px;
    }
}

@media (max-width:576px){
    :root{
        --gallery-hero-featured-w: min(84vw, 260px);
        --gallery-hero-featured-overlap: calc(min(var(--gallery-hero-featured-w), 260px) * 663 / 884 * 0.26);
        --gallery-hero-band-h: max(
            clamp(170px, 46vw, 215px),
            calc(min(var(--gallery-hero-featured-w), 260px) * 663 / 884 * 0.58)
        );
    }

    .gallery-hero:not(.gallery-hero--exhibitions) .gallery-hero-inner{
        padding: 28px 14px 10px;
    }

    .gallery-hero:not(.gallery-hero--exhibitions) .gallery-hero-featured{
        max-width: 260px;
    }

    .gallery-index{
        margin-top: calc(-1 * var(--gallery-hero-featured-overlap));
        padding-top: calc(var(--gallery-hero-featured-overlap) + 28px);
    }
}

@media (max-width:390px){
    :root{
        --gallery-hero-featured-w: min(90vw, 236px);
        --gallery-hero-featured-overlap: calc(min(var(--gallery-hero-featured-w), 236px) * 663 / 884 * 0.24);
        --gallery-hero-band-h: max(
            clamp(158px, 44vw, 200px),
            calc(min(var(--gallery-hero-featured-w), 236px) * 663 / 884 * 0.55)
        );
    }

    .gallery-hero:not(.gallery-hero--exhibitions) .gallery-hero-featured{
        max-width: 236px;
    }

    .gallery-index{
        margin-top: calc(-1 * var(--gallery-hero-featured-overlap));
        padding-top: calc(var(--gallery-hero-featured-overlap) + 22px);
    }
}

/* GALLERY INDEX: stacked section previews + bottom sections slider */
.gallery-index{
    position: relative;
    z-index: 1;
    background: #f7f5ef;
    margin-top: calc(-1 * var(--gallery-hero-featured-overlap));
    padding: calc(var(--gallery-hero-featured-overlap) + clamp(48px, 6vw, 64px)) 0 40px 0;
}

/* Wider than home .gallery-inner (1700px): lets grid columns grow so contain previews match Figma height */
.gallery-index .gallery-inner{
    max-width: none !important;
}

/* Home .gallery-section-card-image adds border + tint; strip on gallery index */
.gallery-index .gallery-section-card-image{
    border: 0;
    outline: none;
    box-shadow: none;
    background: transparent;
}

/* Artwork photos: full color, no wash/opacity (hero decorative bg uses .gallery-hero-art-bg / .artwork-show-hero__bg only) */
.gallery-index .gallery-section-card-image img,
.gallery-index-slider-image img,
.gallery-page-image img,
.gallery-masonry-image img,
.gallery-hero-featured img,
.artwork-hero-image img,
.artwork-hero-image .js-zoomable-image,
.artwork-detail-gallery__frame img,
.artwork-detail-gallery__cell .js-zoomable-image,
.related-card img{
    opacity: 1;
    filter: none;
}

.gallery-index-tail .gallery-masonry-image{
    border: 0;
    background: transparent;
}

.gallery-index-slider{
    position: relative;
    z-index: 1;
    background: #f7f5ef;
    padding: 0 0 110px 0;
}

.gallery-index-slider-inner{
    max-width: none;
    margin: 0 auto;
    padding: 18px 110px 0;
}

.gallery-index-slider-wrap{
    position: relative;
    min-width: 0;
}

.gallery-index-slider-track{
    display: grid;
    grid-auto-flow: column;
    /* Desktop: show ~4 cards per viewport (Figma), still scrolls if more sections exist */
    grid-auto-columns: calc((100% - (18px * 3)) / 4);
    gap: 18px;
    overflow-x: auto;
    padding: 10px 6px 12px;
    scroll-snap-type: x mandatory;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    justify-content: safe center;
    align-items: stretch;
}

.gallery-index-slider-track.is-overflowing{
    justify-content: start;
}

.gallery-index-slider-track::-webkit-scrollbar{
    height: 8px;
}

.gallery-index-slider-track::-webkit-scrollbar-thumb{
    background: rgba(0,0,0,.14);
    border-radius: 10px;
}

.gallery-index-slider-card{
    scroll-snap-align: start;
    min-width: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.gallery-index-slider-card-link{
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    min-height: 0;
    height: 100%;
    text-decoration: none;
    color: inherit;
}

.gallery-index-slider-image{
    flex: 0 0 auto;
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 3;
    min-height: 0;
    overflow: hidden;
    border: 0;
    outline: none;
    box-shadow: none;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    background: transparent;
}

.gallery-index-slider-image img{
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    object-position: center;
    display: block;
    border: 0;
    outline: none;
    box-shadow: none;
}

.gallery-index-slider-meta{
    margin-top: auto;
    padding-top: 12px;
    text-align: center;
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

.gallery-index-slider-section-title{
    font-family: var(--gallery-serif);
    color: var(--gallery-gold);
    font-size: 18px;
    line-height: 1.15;
    font-weight: 500;
    letter-spacing: .06em;
    text-transform: uppercase;
    max-width: 100%;
    overflow-wrap: anywhere;
    word-break: break-word;
    text-align: center;
}

.gallery-index-slider-section-desc{
    margin-top: 8px;
    font-size: 16px;
    line-height: 1.7;
    font-weight: 300;
    color: var(--gallery-text);
    max-width: 100%;
    text-align: center;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.gallery-index-slider-arrow{
    position: absolute;
    top: 42%;
    transform: translateY(-50%);
    width: 44px;
    height: 44px;
    border-radius: 999px;
    border: 1px solid rgba(0,0,0,.12);
    background: rgba(255,255,255,.85);
    cursor: pointer;
    z-index: 3;
    box-shadow: 0 12px 22px rgba(0,0,0,.08);
}

.gallery-index-slider-arrow--left{ left: 10px; }
.gallery-index-slider-arrow--right{ right: 10px; }

.gallery-index-slider-arrow::before{
    content: '';
    position: absolute;
    inset: 0;
    margin: auto;
    width: 10px;
    height: 10px;
    border: 2px solid rgba(0,0,0,.55);
    border-top: 0;
    border-right: 0;
    transform: rotate(45deg);
    left: 18px;
}

.gallery-index-slider-arrow--right::before{
    transform: rotate(-135deg);
    left: 14px;
}

@media (max-width:1200px){
    .gallery-index-slider-inner{
        padding: 18px 70px 0;
    }

    .gallery-index-slider-track{
        grid-auto-columns: calc((100% - (18px * 2)) / 3);
    }

    .gallery-index-slider-arrow{
        top: 40%;
    }
}

@media (max-width:768px){
    .gallery-index-slider{
        padding: 0 0 74px;
    }

    .gallery-index-slider-inner{
        padding: 14px 18px 0;
    }

    .gallery-index-slider-track{
        grid-auto-columns: calc((100% - 18px) / 2);
    }

    .gallery-index-slider-arrow{
        display: none;
    }
}

/* GALLERY INDEX MATRIX: same image height per row, column width from aspect; JS scales --gallery-row-h (min-width 1025px) */
.gallery-index-matrix{
    display: flex;
    flex-direction: column;
    gap: 36px;
    width: 100%;
    min-width: 0;
}

.gallery-index-row{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 28px;
    align-items: flex-start;
    justify-content: space-between;
    width: 100%;
    min-width: 0;
}

/* Figma rows 1 & 7 (2-up): narrower band, images centered (height from JS, no width stretch) */
@media (min-width: 1025px){
    .gallery-index-row--duo{
        box-sizing: border-box;
        width: 100%;
        max-width: min(1180px, 78%);
        margin-left: auto;
        margin-right: auto;
        justify-content: center;
        gap: clamp(32px, 3vw, 52px);
    }
}

.gallery-index-matrix .gallery-section-card,
.gallery-index-row .gallery-section-card{
    flex: 0 0 auto !important;
    min-width: 0;
    max-width: 100%;
    display: table !important;
    width: auto !important;
    height: auto;
    margin: 0 !important;
    border-collapse: separate;
    border-spacing: 0;
}

.gallery-index-row .gallery-section-card-image{
    flex: 0 0 auto;
    width: fit-content !important;
    max-width: 100%;
    height: var(--gallery-row-h, 400px) !important;
    aspect-ratio: auto !important;
    display: block;
    line-height: 0;
    overflow: hidden;
    position: relative;
    box-sizing: content-box;
    background: transparent;
    border: 0;
    outline: none;
    box-shadow: none;
    text-decoration: none;
    color: inherit;
}

.gallery-index-row .gallery-section-card-image img{
    height: var(--gallery-row-h, 400px) !important;
    width: auto !important;
    max-width: none !important;
    display: block;
    object-fit: contain;
    object-position: center;
    margin: 0;
    border: 0;
    outline: none;
    box-shadow: none;
    vertical-align: top;
    transform-origin: center center;
    transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    will-change: transform;
}

@media (hover: hover) and (pointer: fine){
    .gallery-index-row .gallery-section-card-image:hover img,
    .gallery-index-row .gallery-section-card-image:focus-visible img{
        transform: scale(1.1);
    }

    .gallery-hero-featured-link:hover img,
    .gallery-hero-featured-link:focus-visible img{
        transform: scale(1.06);
    }
}

@media (max-width: 768px){
    .gallery-hero-featured-link:hover img,
    .gallery-hero-featured-link:focus-visible img{
        transform: none;
    }
}

.gallery-index-row .gallery-section-card-meta{
    display: table-caption;
    caption-side: bottom;
    margin-top: 12px;
    flex: none;
    min-width: 0;
    max-width: 100%;
    width: 100%;
    box-sizing: border-box;
    text-align: center;
}

.gallery-index-row .gallery-more-btn{
    display: inline-block;
    margin-top: 8px;
    width: auto;
    height: auto;
    min-width: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #b77b2b;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.2;
    font-family: inherit;
}

/* Card text under images: table-caption can collapse line-height in some browsers; RichEditor wraps <p> */
.gallery-index .gallery-section-card-meta{
    line-height: 1.65;
}

.gallery-index .gallery-section-card-title{
    display: block;
    line-height: 1.35;
    overflow-wrap: break-word;
    word-break: normal;
}

.gallery-index .gallery-more-btn{
    white-space: nowrap;
    overflow-wrap: normal;
    word-break: keep-all;
}

.gallery-index .gallery-section-card-desc{
    margin-top: 6px;
    font-family: var(--gallery-serif);
    font-size: 16px;
    line-height: 1.5;
    font-weight: 300;
    color: #2a2a2a;
    overflow-wrap: break-word;
    word-break: normal;
}

.gallery-index .gallery-section-card-desc:has(.gallery-section-card-desc-line){
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.gallery-index .gallery-section-card-desc-line{
    margin: 0;
    padding: 0;
    font-size: var(--gallery-meta-size);
    line-height: var(--gallery-meta-line-height);
    font-family: var(--gallery-meta-font-en);
    font-weight: var(--gallery-meta-weight);
    font-synthesis: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

.gallery-index .gallery-section-card-desc-line :is(p, div, span, li, h1, h2, h3, h4, h5, h6, strong, b, em, i){
    margin: 0;
    padding: 0;
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
    font-style: inherit;
    letter-spacing: inherit;
    color: inherit;
}

html[lang="ru"] .gallery-index .gallery-section-card-desc-line,
html[lang="ru"] .gallery-index .gallery-section-card-desc-line :is(p, div, span, li, h1, h2, h3, h4, h5, h6, strong, b, em, i){
    font-family: var(--gallery-meta-font-ru);
    font-weight: 900;
}

html[lang="hy"] .gallery-index .gallery-section-card-desc-line,
html[lang="am"] .gallery-index .gallery-section-card-desc-line,
html[lang="hy"] .gallery-index .gallery-section-card-desc-line :is(p, div, span, li, h1, h2, h3, h4, h5, h6, strong, b, em, i),
html[lang="am"] .gallery-index .gallery-section-card-desc-line :is(p, div, span, li, h1, h2, h3, h4, h5, h6, strong, b, em, i){
    font-family: var(--gallery-meta-font-hy);
}

@media (max-width: 1024px){
    .gallery-index-matrix{
        gap: 26px;
    }

    .gallery-index-row{
        flex-direction: column;
        align-items: stretch;
        gap: 22px;
    }

    .gallery-index-row--duo{
        max-width: none;
        margin-left: 0;
        margin-right: 0;
        justify-content: flex-start;
    }

    .gallery-index-row .gallery-section-card{
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        flex: 0 1 auto;
        width: 100% !important;
        max-width: 100% !important;
    }

    .gallery-index-row .gallery-section-card-meta,
    .gallery-index .gallery-section-card-meta{
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        flex: none !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin-top: 12px !important;
        padding: 0 10px !important;
        box-sizing: border-box !important;
        text-align: center !important;
        overflow: visible !important;
    }

    .gallery-index .gallery-section-card-title,
    .gallery-index-row .gallery-section-card-title{
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow-wrap: break-word !important;
        word-break: normal !important;
        hyphens: auto;
    }

    .gallery-index .gallery-section-card-desc,
    .gallery-index-row .gallery-section-card-desc{
        width: 100% !important;
        max-width: 100% !important;
        max-height: none !important;
        overflow: visible !important;
        overflow-wrap: break-word !important;
        word-break: normal !important;
    }

    .gallery-index-row .gallery-more-btn,
    .gallery-index .gallery-more-btn{
        display: inline-block !important;
        white-space: nowrap !important;
        overflow-wrap: normal !important;
        word-break: keep-all !important;
        max-width: 100% !important;
    }

    .gallery-index-row .gallery-section-card-image{
        width: 100% !important;
        height: auto !important;
        max-width: 100%;
    }

    .gallery-index-row .gallery-section-card-image img{
        height: auto !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    @media (hover: hover) and (pointer: fine){
        .gallery-index-row .gallery-section-card-image:hover img,
        .gallery-index-row .gallery-section-card-image:focus-visible img{
            transform: scale(1.06);
        }
    }
}

@media (max-width: 576px){
    .gallery-index-matrix{
        gap: 26px;
    }

    .gallery-index-row{
        gap: 18px;
    }
}

@media (prefers-reduced-motion: reduce){
    .gallery-index-row .gallery-section-card-image img,
    .gallery-hero-featured img{
        transition: none;
    }

    .gallery-index-row .gallery-section-card-image:hover img,
    .gallery-index-row .gallery-section-card-image:focus-visible img,
    .gallery-hero-featured-link:hover img,
    .gallery-hero-featured-link:focus-visible img{
        transform: none;
    }
}

/* GALLERY INDEX: extra sections after slider (masonry-ish, like figma "GALLERY" grid) */
.gallery-index-tail{
    position: relative;
    z-index: 1;
    background: #f7f5ef;
    padding: 0 0 110px 0;
}

.gallery-index-tail-inner{
    max-width: none;
    margin: 0 auto;
    padding: 0 110px 0;
}

.gallery-masonry{
    margin-top: 34px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 60px;
    row-gap: 64px;
    align-items: start;
}

.gallery-masonry-card{
    display: block;
    width: 100%;
    min-width: 0;
}

.gallery-masonry-card:nth-child(odd){ grid-column: 1; }
.gallery-masonry-card:nth-child(even){ grid-column: 2; }

.gallery-masonry-card-link{
    display: block;
    text-decoration: none;
    color: inherit;
}

.gallery-masonry-image{
    width: 100%;
    overflow: hidden;
    border: 0;
    background: transparent;
    aspect-ratio: 4 / 3;
}

.gallery-masonry-image img{
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
    object-position: center;
}

.gallery-masonry-meta{
    margin-top: 12px;
}

.gallery-masonry-title{
    font-family: var(--gallery-serif);
    color: var(--gallery-gold);
    font-size: 18px;
    line-height: 1.15;
    font-weight: 500;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.gallery-masonry-desc{
    margin-top: 6px;
    font-size: 16px;
    line-height: 1.7;
    font-weight: 300;
    color: var(--gallery-text);
    max-width: 520px;
}

@media (max-width:1200px){
    .gallery-index-tail-inner{
        padding: 0 70px 0;
    }

    .gallery-masonry{
        grid-template-columns: 1fr;
        column-gap: 0;
        row-gap: 46px;
    }

    .gallery-masonry-card:nth-child(odd),
    .gallery-masonry-card:nth-child(even){
        grid-column: auto;
    }

}

@media (max-width:768px){
    .gallery-index-tail{
        padding: 0 0 74px;
    }

    .gallery-index-tail-inner{
        padding: 0 18px 0;
    }

    .gallery-masonry{
        margin-top: 34px;
        grid-template-columns: 1fr;
        gap: 34px;
    }
}

/* =========================
   ARTWORK (gallery.show)
   ========================= */

.artwork{
    background: var(--gallery-bg);
    padding: 44px 0 90px;
    min-width: 0;
}

.artwork-inner{
    max-width: 1700px;
    margin: 0 auto;
    padding: 0 110px;
    box-sizing: border-box;
    min-width: 0;
    overflow-wrap: anywhere;
}

.artwork-hero{
    display: grid;
    grid-template-columns: 1.25fr 1fr; /* image left, text right (like Figma) */
    gap: 54px;
    align-items: start;
    min-width: 0;
}

.artwork-hero-left{ grid-column: 2; }
.artwork-hero-right{ grid-column: 1; }

.artwork-hero-left,
.artwork-hero-right{
    min-width: 0;
}

.artwork-hero-left{
    overflow-wrap: anywhere;
    max-width: 100%;
}

.artwork-hero-right{
    overflow-wrap: anywhere;
    max-width: 100%;
}

.artwork-title{
    margin: 0;
    font-family: var(--gallery-serif);
    color: var(--gallery-gold);
    font-size: clamp(34px, 4vw, 56px);
    font-weight: 500;
    letter-spacing: .04em;
    text-transform: uppercase;
    line-height: 1;
    max-width: 100%;
    overflow-wrap: anywhere;
}

.artwork-lead{
    margin-top: 18px;
    font-size: 16px;
    line-height: 1.8;
    font-weight: 300;
    color: var(--gallery-text);
    max-width: 560px;
    overflow-wrap: anywhere;
}

.artwork-meta.artwork-lead{
    font-size: 16px;
}

.artwork-meta__row + .artwork-meta__row{
    margin-top: 8px;
}

.artwork-hero-image{
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    border: 0;
    background: transparent;
    aspect-ratio: auto;
    min-width: 0;
    box-sizing: border-box;
}

.artwork-hero-image img,
.artwork-hero-image .js-zoomable-image{
    width: 100%;
    max-width: 100%;
    height: auto;
    display: block;
    object-fit: contain;
    object-position: center;
    box-sizing: border-box;
}

/* Detail images under main image (gallery.show) — 3 per view + arrow */
.artwork-detail-gallery{
    --detail-gallery-gap: 17px;
    --detail-gallery-arrow-gap: 5px;
    --detail-gallery-cell-width: 200px;
    --detail-gallery-per-page: 3;
    --detail-gallery-thumb-h: 130px;
    margin-top: 60px;
    padding-top: 0;
    display: flex;
    align-items: center;
    gap: var(--detail-gallery-arrow-gap);
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
    box-sizing: border-box;
}

.artwork-detail-gallery__viewport{
    flex: 1 1 auto;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    line-height: 0;
    box-sizing: border-box;
    isolation: isolate;
}

.artwork-detail-gallery__track{
    display: flex;
    align-items: stretch;
    gap: var(--detail-gallery-gap);
    transition: transform 0.4s ease;
    will-change: transform;
}

.artwork-detail-gallery__cell{
    flex: 0 0 auto;
    width: auto;
    height: var(--detail-gallery-thumb-h);
    position: relative;
    overflow: hidden;
    border: 0;
    outline: none;
    box-shadow: none;
    background: transparent;
    box-sizing: border-box;
    line-height: 0;
}

.artwork-detail-gallery__frame{
    position: absolute;
    inset: 0;
    display: block;
    overflow: hidden;
    line-height: 0;
    box-sizing: border-box;
}

.artwork-detail-gallery__frame img,
.artwork-detail-gallery__cell .js-zoomable-image{
    display: block;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    object-fit: cover;
    object-position: center center;
    cursor: zoom-in;
    box-sizing: border-box;
    border: 0;
    outline: none;
}

.artwork-detail-gallery__prev,
.artwork-detail-gallery__next{
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    height: auto;
    padding: 0;
    margin: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.artwork-detail-gallery__prev img,
.artwork-detail-gallery__next img{
    display: block;
    width: auto;
    height: 17px;
    object-fit: contain;
}

.artwork-detail-gallery__prev:hover:not(:disabled){
    transform: translateX(-2px);
}

.artwork-detail-gallery__next:hover:not(:disabled){
    transform: translateX(2px);
}

.artwork-detail-gallery__prev:disabled,
.artwork-detail-gallery__next:disabled{
    opacity: 0.35;
    cursor: default;
}

@media (max-width: 900px){
    .artwork-detail-gallery{
        --detail-gallery-per-page: 2;
        --detail-gallery-cell-width: 180px;
        --detail-gallery-thumb-h: 120px;
    }
}

@media (max-width: 520px){
    .artwork-detail-gallery{
        --detail-gallery-per-page: 1;
        --detail-gallery-cell-width: 9999px;
    }
}

/* Mobile: full thumbnails without crop (desktop keeps equal-height cover row) */
@media (max-width: 768px){
    .artwork-detail-gallery__track{
        align-items: flex-start;
    }

    .artwork-detail-gallery__cell{
        height: auto;
        overflow: visible;
        line-height: normal;
    }

    .artwork-detail-gallery__frame{
        position: relative;
        inset: auto;
        height: auto;
        overflow: visible;
    }

    .artwork-detail-gallery__frame img,
    .artwork-detail-gallery__cell .js-zoomable-image{
        width: 100%;
        height: auto;
        max-height: none;
        object-fit: contain;
        object-position: center center;
    }
}

.artwork-thumbs{
    margin-top: 22px;
    display: grid;
    /* Figma-like: 1 normal, 2 wider, 3 normal */
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

/* 3 text columns below main image (gallery.show) */
.artwork-show-columns{
    margin-top: 22px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    border-left: 1px solid rgba(200,139,42,.35);
    min-width: 0;
    overflow-wrap: anywhere;
}

.artwork-show-column{
    padding: 0 18px;
    font-size: 16px;
    line-height: 1.8;
    font-weight: 300;
    color: var(--gallery-text);
    min-width: 0;
    box-sizing: border-box;
    overflow-wrap: anywhere;
}

.artwork-show-column + .artwork-show-column{
    border-left: 1px solid rgba(200,139,42,.35);
}

.artwork-thumb{
    overflow: hidden;
    border: 0;
    background: transparent;
    aspect-ratio: auto;
}

.artwork-thumbs .artwork-thumb:nth-child(1){
    grid-column: 1;
}

.artwork-thumbs .artwork-thumb:nth-child(2){
    grid-column: 2 / span 2;
    aspect-ratio: auto;
}

.artwork-thumbs .artwork-thumb:nth-child(3){
    grid-column: 4;
}

.artwork-thumb img{
    width: 100%;
    height: auto;
    display: block;
    object-fit: contain;
    object-position: center;
}

/* =========================
   Image zoom modal (gallery.show)
   ========================= */
.is-zoom-open{
    overflow: hidden;
}

.zoom-modal{
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: max(16px, env(safe-area-inset-top, 0px))
        max(16px, env(safe-area-inset-right, 0px))
        max(16px, env(safe-area-inset-bottom, 0px))
        max(16px, env(safe-area-inset-left, 0px));
    box-sizing: border-box;
}

.zoom-modal__backdrop{
    position: absolute;
    inset: 0;
    background: rgba(12, 10, 8, .78);
    backdrop-filter: blur(4px);
}

.zoom-modal__panel{
    position: relative;
    z-index: 2;
    flex: 0 1 auto;
    width: min(96vw, 1600px);
    height: min(90vh, 1200px);
    max-width: 96vw;
    max-height: 90vh;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    pointer-events: none;
}

.zoom-modal__img{
    display: block;
    width: 100%;
    height: 100%;
    max-width: min(96vw, 1600px);
    max-height: 90vh;
    object-fit: contain;
    object-position: center;
    background: transparent;
    pointer-events: auto;
}

.zoom-modal__close,
.zoom-modal__nav{
    position: fixed;
    z-index: 4;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, .28);
    background: rgba(247, 245, 239, .96);
    color: #1c1c1c;
    line-height: 0;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    margin: 0;
    box-shadow:
        0 10px 28px rgba(0, 0, 0, .32),
        inset 0 1px 0 rgba(255, 255, 255, .75);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    transition:
        background-color .2s ease,
        color .2s ease,
        border-color .2s ease,
        box-shadow .2s ease,
        transform .2s ease;
}

.zoom-modal__close:hover,
.zoom-modal__nav:hover{
    background: #fff;
    color: #c88b2a;
    border-color: rgba(200, 139, 42, .45);
    box-shadow:
        0 12px 32px rgba(0, 0, 0, .36),
        inset 0 1px 0 rgba(255, 255, 255, .9);
}

.zoom-modal__close:active,
.zoom-modal__nav:active{
    transform: scale(.94);
}

.zoom-modal__close:focus-visible,
.zoom-modal__nav:focus-visible{
    outline: 2px solid rgba(200, 139, 42, .85);
    outline-offset: 3px;
}

.zoom-modal__icon{
    display: block;
    flex: 0 0 auto;
    pointer-events: none;
}

.zoom-modal__icon--close{
    width: 18px;
    height: 18px;
}

.zoom-modal__icon--arrow{
    width: 20px;
    height: 20px;
}

.zoom-modal__close{
    top: max(20px, env(safe-area-inset-top, 0px));
    right: max(20px, env(safe-area-inset-right, 0px));
}

.zoom-modal__nav{
    top: 50%;
    transform: translateY(-50%);
}

.zoom-modal__nav:hover{
    transform: translateY(-50%) scale(1.05);
}

.zoom-modal__nav:active{
    transform: translateY(-50%) scale(.94);
}

.zoom-modal__nav--prev{
    left: max(20px, env(safe-area-inset-left, 0px));
}

.zoom-modal__nav--next{
    right: max(20px, env(safe-area-inset-right, 0px));
}

@media (max-width: 520px){
    .zoom-modal__close,
    .zoom-modal__nav{
        width: 44px;
        height: 44px;
    }

    .zoom-modal__icon--close{
        width: 16px;
        height: 16px;
    }

    .zoom-modal__icon--arrow{
        width: 18px;
        height: 18px;
    }

    .zoom-modal__close{
        top: max(14px, env(safe-area-inset-top, 0px));
        right: max(14px, env(safe-area-inset-right, 0px));
    }

    .zoom-modal__nav--prev{
        left: max(10px, env(safe-area-inset-left, 0px));
    }

    .zoom-modal__nav--next{
        right: max(10px, env(safe-area-inset-right, 0px));
    }
}

.artwork-body{
    margin-top: 34px;
    /*border: 1px solid rgba(20,20,20,.12);*/
    /*background: rgba(255,255,255,.35);*/
    padding: 22px;
}

.artwork-body-text{
    font-size: 16px;
    line-height: 1.8;
    font-weight: 300;
    color: var(--gallery-text);
    overflow-wrap: anywhere;
    max-width: 100%;
    /* Show as one continuous text block (no columns/dividers) */
    column-count: 1;
    column-gap: 0;
    column-rule: none;
}

.artwork-body-text p{
    margin: 0 0 14px;
}

.artwork-body-text img,
.artwork-lead img,
.artwork-show-column img{
    max-width: 100%;
    height: auto;
    display: block;
    box-sizing: border-box;
}

.related{
    position: relative;
    background: #E8D5AC;
    overflow: hidden;

    /* full-bleed background inside centered layout */
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    margin-top: 54px; /* space above "From the same line" */
    padding: 72px 0 72px;
}

.related::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 90px;
    background: var(--gallery-bg);
    clip-path: polygon(
        0 0,
        0 72%,
        10% 28%,
        22% 6%,
        34% 4%,
        46% 12%,
        58% 34%,
        68% 66%,
        78% 68%,
        88% 62%,
        96% 26%,
        100% 0
    );
    z-index: 1;
}

.related::after{
    content:"";
    position:absolute;
    bottom:0;
    left:0;
    width:100%;
    height:26px;
    background: var(--gallery-bg);
    clip-path: polygon(0 100%, 0 24%, 10% 12%, 24% 22%, 38% 8%, 52% 20%, 66% 10%, 80% 20%, 92% 12%, 100% 0, 100% 100%);
    z-index: 1;
}

.related-head,
.related-grid{
    position: relative;
    z-index: 2;
    max-width: 1700px;
    margin: 0 auto;
    padding: 0 110px;
    min-width: 0;
    overflow-wrap: anywhere;
}

.related-title{
    margin: 0 0 18px;
    font-family: var(--gallery-serif);
    color: var(--gallery-gold);
    font-size: 28px;
    font-weight: 500;
    letter-spacing: .04em;
    text-transform: uppercase;
    line-height: 1.1;
    max-width: 100%;
    overflow-wrap: anywhere;
}

.related-grid{
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.related-link{
    display: block;
    text-decoration: none;
    color: inherit;
}

.related-image{
    overflow: hidden;
    border: 0;
    background: transparent;
    aspect-ratio: auto;
}

.related-image img{
    width: 100%;
    height: auto;
    display: block;
    object-fit: contain; /* show full image (no crop) */
    object-position: center;
}

.related-meta{
    margin-top: 10px;
}

.related-item-title{
    font-family: var(--gallery-serif);
    color: var(--gallery-gold);
    font-size: 16px;
    font-weight: 500;
    letter-spacing: .06em;
    text-transform: uppercase;
    line-height: 1.2;
    max-width: 100%;
    overflow-wrap: anywhere;
}

/* "From the same line": равные карточки, зона картинки 4:3 + contain (как gallery index), подписи в одну линию снизу */
.related.related--same-line .related-card{
    display: flex;
    flex-direction: column;
    min-height: 0;
    height: 100%;
}

.related.related--same-line .related-link{
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    min-width: 0;
    min-height: 0;
    height: 100%;
}

.related.related--same-line .related-image{
    flex: 0 0 auto;
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 3;
    min-height: 0;
    overflow: hidden;
    border: 0;
    outline: none;
    box-shadow: none;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    background: transparent;
}

.related.related--same-line .related-image img{
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    object-position: center;
    display: block;
    border: 0;
    outline: none;
    box-shadow: none;
}

.related.related--same-line .related-meta{
    margin-top: auto;
    padding-top: 10px;
    text-align: center;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    flex-shrink: 0;
}

.related.related--same-line .related-item-title{
    text-align: center;
}

.related.related--same-line:not(.related--exhibitions) .related-grid{
    align-items: stretch;
}

.related.related--exhibitions.related--same-line .related-grid--scroll{
    align-items: stretch;
}

.related.related--exhibitions.related--same-line .related-card{
    display: flex;
    flex-direction: column;
    min-height: 0;
    height: auto;
    align-self: stretch;
}

@media (max-width:1200px){
    .artwork-inner{ padding: 0 70px; }
    .related-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .artwork-body-text{ column-count: 1; column-gap: 0; column-rule: none; }

    .related-head,
    .related-grid{
        padding: 0 70px;
    }

    .artwork-show-columns{
        grid-template-columns: 1fr;
        border-left: 0;
    }

    .artwork-show-column{
        padding: 0;
    }

    .artwork-show-column + .artwork-show-column{
        border-left: 0;
        border-top: 1px solid rgba(200,139,42,.25);
        margin-top: 14px;
        padding-top: 14px;
    }
}

@media (max-width:768px){
    .artwork-inner{ padding: 0 18px; }
    .artwork{ padding: 26px 0 64px; }
    .artwork-thumbs{ grid-template-columns: 1fr; }
    .related-grid{ grid-template-columns: 1fr; }
    .artwork-body-text{ column-count: 1; column-gap: 0; column-rule: none; }

    .related{
        margin-top: 34px;
        padding: 56px 0 56px;
    }

    .related-head,
    .related-grid{
        padding: 0 18px;
    }
}

@media (max-width: 380px){
    .artwork-inner{
        padding-left: max(10px, env(safe-area-inset-left, 0px));
        padding-right: max(10px, env(safe-area-inset-right, 0px));
    }
}

@media (max-width: 280px){
    .artwork-inner{
        padding-left: max(6px, env(safe-area-inset-left, 0px));
        padding-right: max(6px, env(safe-area-inset-right, 0px));
    }
}

/* Stack artwork hero only on very small screens */
@media (max-width:480px){
    .artwork-hero{
        grid-template-columns: 1fr;
    }
    .artwork-hero-right{
        grid-column: 1;
        grid-row: 1;
    }
    .artwork-hero-left{
        grid-column: 1;
        grid-row: 2;
    }
}