/* Start:/local/templates/mtmuseum/components/bitrix/news/exhibits/bitrix/news.detail/.default/style.css?17893024483805*/
/* Детальная карточка экспоната.
   База — макет 1920, ниже медиазапросы вниз (1440 / 1280 / 767).
   Все размеры в rem (1rem = 10px), шрифты и цвета — токенами из config.css.

   Текстовая часть карточки — общий блок .article-body
   (assets/css/components/article-body/article-body.css), галерея с попапом — общий блок
   .exhibit-gallery (assets/css/components/gallery/exhibit-gallery.css),
   здесь только шапка и иллюстрация с подписью. */

/* ---------------- Шапка ---------------- */

/* .content уже даёт 10rem под фиксированную шапку, здесь — спейсер 160px из макета */
.exhibit__opener{
    padding-top: 16rem;
}

.exhibit__type{
    display: flex;
    align-items: center;
    min-height: 6rem;
    padding: 2rem 0;
    font-family: var(--ff-bold);
    font-size: var(--fz-23);
    line-height: var(--lh-20);
    letter-spacing: var(--ls-17);
    text-transform: uppercase;
}

/* Правый отступ 16rem — в макете справа от заголовка стоит спейсер 160px */
.exhibit__title{
    padding: 4rem 16rem 0 0;
    font-family: var(--ff-ragular-stencil);
    font-size: var(--fz-117);
    line-height: var(--lh-105);
    letter-spacing: var(--ls--1);
    text-transform: uppercase;
}

.exhibit__dates{
    display: flex;
    align-items: flex-end;
    gap: .3rem;
    padding-top: 2rem;
    font-family: var(--ff-bold);
    font-size: var(--fz-30);
    line-height: var(--lh-30);
    letter-spacing: var(--ls-1);
}

.exhibit__dates-arrow{
    width: 5.5rem;
    height: 2.2rem;
    color: var(--color-red-10);
}

.exhibit__lead{
    font-family: var(--ff-bold);
    font-size: var(--fz-30);
    line-height: var(--lh-30);
    letter-spacing: var(--ls-1);
}

/* ---------------- Иллюстрация с подписью ---------------- */

/* Пропорция задана всему блоку вместе с подписью — как в макете:
   картинка занимает остаток высоты, подпись прижата снизу. */
.exhibit-figure{
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-top: 2.5rem;
}

.exhibit-figure._3-2{
    aspect-ratio: 3 / 2;
}

.exhibit-figure__img{
    flex: 1 0 0;
    min-height: 0;
    overflow: hidden;
}

@media screen and (max-width: 1440px){
    .exhibit__title{
        padding-right: 10rem;
        font-size: var(--fz-90);
        line-height: var(--lh-77);
    }
}

@media screen and (max-width: 1280px){
    .exhibit__opener{
        padding-top: 10rem;
    }

    .exhibit__title{
        padding-right: 6rem;
        font-size: var(--fz-72);
        line-height: var(--lh-60);
    }

    .exhibit__lead{
        font-size: var(--fz-28);
        line-height: var(--lh-26);
    }
}

@media screen and (max-width: 767px){
    .exhibit__opener{
        padding-top: 4rem;
    }

    .exhibit__type{
        min-height: 4rem;
        padding: 1rem 0;
        font-size: var(--fz-15);
    }

    .exhibit__title{
        padding: 2rem 0 0;
        font-size: var(--fz-40);
        line-height: var(--lh-36);
    }

    .exhibit__dates{
        padding-top: 1.5rem;
        font-size: var(--fz-22);
        line-height: var(--lh-20);
    }

    /* Размер стрелки дат — как в карточке списка экспонатов */
    .exhibit__dates-arrow{
        width: 4.2rem;
        height: 1.4rem;
    }

    .exhibit__lead{
        font-size: var(--fz-18);
        line-height: var(--lh-18);
    }

    .exhibit-figure{
        gap: .5rem;
        margin-top: 1.5rem;
    }
}

/* End */


/* Start:/local/templates/mtmuseum/assets/css/vendor/swiper-bundle.min.css?178930244814621*/
/**
 * Swiper 12.2.0
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * https://swiperjs.com
 *
 * Copyright 2014-2026 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: May 27, 2026
 */

:root{--swiper-theme-color:#007aff}:host{display:block;margin-left:auto;margin-right:auto;position:relative;z-index:1}.swiper{display:block;list-style:none;margin-left:auto;margin-right:auto;overflow:hidden;padding:0;position:relative;z-index:1}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{box-sizing:initial;display:flex;height:100%;position:relative;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function,initial);width:100%;z-index:1}.swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper{transform:translateZ(0)}.swiper-horizontal{touch-action:pan-y}.swiper-vertical{touch-action:pan-x}.swiper-slide{display:block;flex-shrink:0;height:100%;position:relative;transition-property:transform;width:100%}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{backface-visibility:hidden;transform:translateZ(0)}.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d{perspective:1200px;.swiper-cube-shadow,.swiper-slide{transform-style:preserve-3d}}.swiper-css-mode{>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none;&::-webkit-scrollbar{display:none}}>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}&.swiper-horizontal{>.swiper-wrapper{scroll-snap-type:x mandatory}>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-slides-offset-before);scroll-margin-inline-start:var(--swiper-slides-offset-before)}>.swiper-wrapper>.swiper-slide:last-child{margin-inline-end:var(--swiper-slides-offset-after)}}&.swiper-vertical{>.swiper-wrapper{scroll-snap-type:y mandatory}>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-slides-offset-before);scroll-margin-block-start:var(--swiper-slides-offset-before)}>.swiper-wrapper>.swiper-slide:last-child{margin-block-end:var(--swiper-slides-offset-after)}}&.swiper-free-mode{>.swiper-wrapper{scroll-snap-type:none}>.swiper-wrapper>.swiper-slide{scroll-snap-align:none}}&.swiper-centered{>.swiper-wrapper:before{content:"";flex-shrink:0;order:9999}>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}}&.swiper-centered.swiper-horizontal{>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}>.swiper-wrapper:before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}}&.swiper-centered.swiper-vertical{>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}>.swiper-wrapper:before{height:var(--swiper-centered-offset-after);min-width:1px;width:100%}}}.swiper-3d{.swiper-slide-shadow,.swiper-slide-shadow-bottom,.swiper-slide-shadow-left,.swiper-slide-shadow-right,.swiper-slide-shadow-top{height:100%;left:0;pointer-events:none;position:absolute;top:0;width:100%;z-index:10}.swiper-slide-shadow{background:#00000026}.swiper-slide-shadow-left{background-image:linear-gradient(270deg,#00000080,#0000)}.swiper-slide-shadow-right{background-image:linear-gradient(90deg,#00000080,#0000)}.swiper-slide-shadow-top{background-image:linear-gradient(0deg,#00000080,#0000)}.swiper-slide-shadow-bottom{background-image:linear-gradient(180deg,#00000080,#0000)}}.swiper-lazy-preloader{border:4px solid var(--swiper-preloader-color,var(--swiper-theme-color));border-radius:50%;border-top:4px solid #0000;box-sizing:border-box;height:42px;left:50%;margin-left:-21px;margin-top:-21px;position:absolute;top:50%;transform-origin:50%;width:42px;z-index:10}.swiper-watch-progress .swiper-slide-visible,.swiper:not(.swiper-watch-progress){.swiper-lazy-preloader{animation:swiper-preloader-spin 1s linear infinite}}.swiper-lazy-preloader-white{--swiper-preloader-color:#fff}.swiper-lazy-preloader-black{--swiper-preloader-color:#000}@keyframes swiper-preloader-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.swiper-virtual .swiper-slide{-webkit-backface-visibility:hidden;transform:translateZ(0)}.swiper-virtual.swiper-css-mode{.swiper-wrapper:after{content:"";left:0;pointer-events:none;position:absolute;top:0}}.swiper-virtual.swiper-css-mode.swiper-horizontal{.swiper-wrapper:after{height:1px;width:var(--swiper-virtual-size)}}.swiper-virtual.swiper-css-mode.swiper-vertical{.swiper-wrapper:after{height:var(--swiper-virtual-size);width:1px}}:root{--swiper-navigation-size:44px}.swiper-button-next,.swiper-button-prev{align-items:center;color:var(--swiper-navigation-color,var(--swiper-theme-color));cursor:pointer;display:flex;height:var(--swiper-navigation-size);justify-content:center;position:absolute;width:var(--swiper-navigation-size);z-index:10;&.swiper-button-disabled{cursor:auto;opacity:.35;pointer-events:none}&.swiper-button-hidden{cursor:auto;opacity:0;pointer-events:none}.swiper-navigation-disabled &{display:none!important}::slotted(svg),svg{height:100%;object-fit:contain;transform-origin:center;width:100%;fill:currentColor;pointer-events:none}}.swiper-button-lock{display:none}.swiper-button-next,.swiper-button-prev{margin-top:calc(0px - var(--swiper-navigation-size)/2);top:var(--swiper-navigation-top-offset,50%)}.swiper-button-prev{left:var(--swiper-navigation-sides-offset,4px);right:auto;.swiper-navigation-icon,::slotted(.swiper-navigation-icon){transform:rotate(180deg)}}.swiper-button-next{left:auto;right:var(--swiper-navigation-sides-offset,4px)}.swiper-horizontal{.swiper-button-next,.swiper-button-prev,~.swiper-button-next,~.swiper-button-prev{margin-left:0;margin-top:calc(0px - var(--swiper-navigation-size)/2);top:var(--swiper-navigation-top-offset,50%)}&.swiper-rtl .swiper-button-next,&.swiper-rtl~.swiper-button-next,&~.swiper-button-prev,.swiper-button-prev{left:var(--swiper-navigation-sides-offset,4px);right:auto}&.swiper-rtl .swiper-button-prev,&.swiper-rtl~.swiper-button-prev,&~.swiper-button-next,.swiper-button-next{left:auto;right:var(--swiper-navigation-sides-offset,4px)}&.swiper-rtl .swiper-button-next,&.swiper-rtl~.swiper-button-next,&~.swiper-button-prev,.swiper-button-prev{.swiper-navigation-icon,::slotted(.swiper-navigation-icon){transform:rotate(180deg)}}&.swiper-rtl .swiper-button-prev,&.swiper-rtl~.swiper-button-prev{.swiper-navigation-icon,::slotted(.swiper-navigation-icon){transform:rotate(0deg)}}}.swiper-vertical{.swiper-button-next,.swiper-button-prev,~.swiper-button-next,~.swiper-button-prev{left:var(--swiper-navigation-top-offset,50%);margin-left:calc(0px - var(--swiper-navigation-size)/2);margin-top:0;right:auto}.swiper-button-prev,~.swiper-button-prev{bottom:auto;top:var(--swiper-navigation-sides-offset,4px);.swiper-navigation-icon,::slotted(.swiper-navigation-icon){transform:rotate(-90deg)}}.swiper-button-next,~.swiper-button-next{bottom:var(--swiper-navigation-sides-offset,4px);top:auto;.swiper-navigation-icon,::slotted(.swiper-navigation-icon){transform:rotate(90deg)}}}.swiper-pagination{position:absolute;text-align:center;transform:translateZ(0);transition:opacity .3s;z-index:10;&.swiper-pagination-hidden{opacity:0}&.swiper-pagination-disabled,.swiper-pagination-disabled>&{display:none!important}}.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:var(--swiper-pagination-bottom,8px);left:0;top:var(--swiper-pagination-top,auto);width:100%}.swiper-pagination-bullets-dynamic{font-size:0;overflow:hidden;.swiper-pagination-bullet{position:relative;transform:scale(.33)}.swiper-pagination-bullet-active,.swiper-pagination-bullet-active-main{transform:scale(1)}.swiper-pagination-bullet-active-prev{transform:scale(.66)}.swiper-pagination-bullet-active-prev-prev{transform:scale(.33)}.swiper-pagination-bullet-active-next{transform:scale(.66)}.swiper-pagination-bullet-active-next-next{transform:scale(.33)}}.swiper-pagination-bullet{background:var(--swiper-pagination-bullet-inactive-color,#000);border-radius:var(--swiper-pagination-bullet-border-radius,50%);display:inline-block;height:var(--swiper-pagination-bullet-height,var(--swiper-pagination-bullet-size,8px));opacity:var(--swiper-pagination-bullet-inactive-opacity,.2);width:var(--swiper-pagination-bullet-width,var(--swiper-pagination-bullet-size,8px));button&{appearance:none;border:none;box-shadow:none;margin:0;padding:0}.swiper-pagination-clickable &{cursor:pointer}&:only-child{display:none!important}}.swiper-pagination-bullet-active{background:var(--swiper-pagination-color,var(--swiper-theme-color));opacity:var(--swiper-pagination-bullet-opacity,1)}.swiper-pagination-vertical.swiper-pagination-bullets,.swiper-vertical>.swiper-pagination-bullets{left:var(--swiper-pagination-left,auto);right:var(--swiper-pagination-right,8px);top:50%;transform:translate3d(0,-50%,0);.swiper-pagination-bullet{display:block;margin:var(--swiper-pagination-bullet-vertical-gap,6px) 0}&.swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px;.swiper-pagination-bullet{display:inline-block;transition:transform .2s,top .2s}}}.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-horizontal.swiper-pagination-bullets{.swiper-pagination-bullet{margin:0 var(--swiper-pagination-bullet-horizontal-gap,4px)}&.swiper-pagination-bullets-dynamic{left:50%;transform:translateX(-50%);white-space:nowrap;.swiper-pagination-bullet{transition:transform .2s,left .2s}}}.swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:transform .2s,right .2s}.swiper-pagination-fraction{color:var(--swiper-pagination-fraction-color,inherit)}.swiper-pagination-progressbar{background:var(--swiper-pagination-progressbar-bg-color,#00000040);position:absolute;.swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color,var(--swiper-theme-color));height:100%;left:0;position:absolute;top:0;transform:scale(0);transform-origin:left top;width:100%}.swiper-rtl & .swiper-pagination-progressbar-fill{transform-origin:right top}&.swiper-pagination-horizontal,&.swiper-pagination-vertical.swiper-pagination-progressbar-opposite,.swiper-horizontal>&,.swiper-vertical>&.swiper-pagination-progressbar-opposite{height:var(--swiper-pagination-progressbar-size,4px);left:0;top:0;width:100%}&.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite,&.swiper-pagination-vertical,.swiper-horizontal>&.swiper-pagination-progressbar-opposite,.swiper-vertical>&{height:100%;left:0;top:0;width:var(--swiper-pagination-progressbar-size,4px)}}.swiper-pagination-lock{display:none}.swiper-scrollbar{background:var(--swiper-scrollbar-bg-color,#0000001a);border-radius:var(--swiper-scrollbar-border-radius,10px);position:relative;touch-action:none;&.swiper-scrollbar-disabled,.swiper-scrollbar-disabled>&{display:none!important}&.swiper-scrollbar-horizontal,.swiper-horizontal>&{bottom:var(--swiper-scrollbar-bottom,4px);height:var(--swiper-scrollbar-size,4px);left:var(--swiper-scrollbar-sides-offset,1%);position:absolute;top:var(--swiper-scrollbar-top,auto);width:calc(100% - var(--swiper-scrollbar-sides-offset, 1%)*2);z-index:50}&.swiper-scrollbar-vertical,.swiper-vertical>&{height:calc(100% - var(--swiper-scrollbar-sides-offset, 1%)*2);left:var(--swiper-scrollbar-left,auto);position:absolute;right:var(--swiper-scrollbar-right,4px);top:var(--swiper-scrollbar-sides-offset,1%);width:var(--swiper-scrollbar-size,4px);z-index:50}}.swiper-scrollbar-drag{background:var(--swiper-scrollbar-drag-bg-color,#00000080);border-radius:var(--swiper-scrollbar-border-radius,10px);height:100%;left:0;position:relative;top:0;width:100%}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-scrollbar-lock{display:none}.swiper-zoom-container{align-items:center;display:flex;height:100%;justify-content:center;text-align:center;width:100%;>canvas,>img,>svg{max-height:100%;max-width:100%;object-fit:contain}}.swiper-slide-zoomed{cursor:move;touch-action:none}.swiper .swiper-notification{left:0;opacity:0;pointer-events:none;position:absolute;top:0;z-index:-1000}.swiper-free-mode>.swiper-wrapper{margin:0 auto;transition-timing-function:ease-out}.swiper-grid>.swiper-wrapper{flex-wrap:wrap}.swiper-grid-column>.swiper-wrapper{flex-direction:column;flex-wrap:wrap}.swiper-fade{&.swiper-free-mode{.swiper-slide{transition-timing-function:ease-out}}.swiper-slide{pointer-events:none;transition-property:opacity;.swiper-slide{pointer-events:none}}.swiper-slide-active{pointer-events:auto;& .swiper-slide-active{pointer-events:auto}}}.swiper.swiper-cube{overflow:visible}.swiper-cube{.swiper-slide{backface-visibility:hidden;height:100%;pointer-events:none;transform-origin:0 0;visibility:hidden;width:100%;z-index:1;.swiper-slide{pointer-events:none}}&.swiper-rtl .swiper-slide{transform-origin:100% 0}.swiper-slide-active{&,& .swiper-slide-active{pointer-events:auto}}.swiper-slide-active,.swiper-slide-next,.swiper-slide-prev{pointer-events:auto;visibility:visible}.swiper-cube-shadow{bottom:0;height:100%;left:0;opacity:.6;position:absolute;width:100%;z-index:0;&:before{background:#000;bottom:0;content:"";filter:blur(50px);left:0;position:absolute;right:0;top:0}}}.swiper-cube{.swiper-slide-next+.swiper-slide{pointer-events:auto;visibility:visible}}.swiper-cube{.swiper-slide-shadow-cube.swiper-slide-shadow-bottom,.swiper-slide-shadow-cube.swiper-slide-shadow-left,.swiper-slide-shadow-cube.swiper-slide-shadow-right,.swiper-slide-shadow-cube.swiper-slide-shadow-top{backface-visibility:hidden;z-index:0}}.swiper.swiper-flip{overflow:visible}.swiper-flip{.swiper-slide{backface-visibility:hidden;pointer-events:none;z-index:1;.swiper-slide{pointer-events:none}}.swiper-slide-active{&,& .swiper-slide-active{pointer-events:auto}}}.swiper-flip{.swiper-slide-shadow-flip.swiper-slide-shadow-bottom,.swiper-slide-shadow-flip.swiper-slide-shadow-left,.swiper-slide-shadow-flip.swiper-slide-shadow-right,.swiper-slide-shadow-flip.swiper-slide-shadow-top{backface-visibility:hidden;z-index:0}}.swiper-creative{.swiper-slide{backface-visibility:hidden;overflow:hidden;transition-property:transform,opacity,height}}.swiper.swiper-cards{overflow:visible}.swiper-cards{.swiper-slide{backface-visibility:hidden;overflow:hidden;transform-origin:center bottom}}
/* End */


/* Start:/local/templates/mtmuseum/assets/css/components/gallery/exhibit-gallery.css?17893024486721*/
/* Слайдер фотографий с подписью и попапом на весь экран.
   Общий блок деталок: экспонат (news/exhibits) и экскурсия (news/excursion).
   Разметку см. в шаблонах news.detail, поведение — assets/js/common/exhibit-gallery.js.
   Имя блока осталось от деталки экспоната, где галерея появилась первой.

   База — макет 1920, ниже медиазапросы вниз (1440 / 1280 / 767).
   Стили подключает сам шаблон (addExternalCss), вместе со swiper. */

.exhibit-gallery{
    padding: 3.7rem 0 2.5rem;
}

.exhibit-gallery__viewport{
    overflow: hidden;
}

/* Слайды прижаты по нижнему краю, ширина — по картинке */
.exhibit-gallery__viewport .swiper-wrapper{
    align-items: flex-end;
}

/* Селектор специально вложенный: swiper задаёт .swiper-slide{width:100%} с такой же
   специфичностью, а порядок его подключения относительно этого файла не гарантирован. */
.exhibit-gallery__viewport .exhibit-gallery__slide{
    width: auto;
    flex-shrink: 0;
}

/* Каждое фото вписывается в бокс 89.6 × 77.6rem с сохранением пропорций:
   вертикальное 2:3 даёт 51.7 × 77.6rem, горизонтальное 3:2 — 89.6 × 59.7rem (размеры из макета).

   Ширину считаем от высоты бокса и пропорций файла (--w / --h ставит шаблон), а не от
   загруженной картинки. Слайды автоширинные, и у ещё не загруженного lazy-фото ширина
   была бы нулевой: слайдер считал бы, что слайды кончились, стрелка «вперёд» гасла,
   и фото так и не попадало во вьюпорт — то есть не начинало загружаться.
   aspect-ratio задаём вместе с height: auto — тогда при упоре в max-width высота
   пересчитывается по пропорции и картинка не искажается. */
.exhibit-gallery__slide img{
    /* Фолбэк на случай, если размеры файла неизвестны */
    --w: 3;
    --h: 2;

    display: block;
    width: calc(77.6rem * var(--w) / var(--h));
    max-width: 89.6rem;
    height: auto;
    aspect-ratio: var(--w) / var(--h);
}

.exhibit-gallery__controls{
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: start;
    padding: 1.2rem 0 1.4rem;
    border-bottom: .4rem solid var(--color-black);
}

.exhibit-gallery__arrow{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 8rem;
    height: 8rem;
    border: .4rem solid var(--color-black);
    border-radius: 50%;
    background: var(--color-white);
    color: var(--color-font);
    cursor: pointer;
    transition: var(--transition-main);
}

.exhibit-gallery__arrow._prev .exhibit-gallery__arrow-icon{
    transform: scaleX(-1);
}

.exhibit-gallery__arrow-icon{
    width: 2rem;
    height: 2rem;
}

.exhibit-gallery__arrow.swiper-button-disabled{
    opacity: .4;
    pointer-events: none;
}

/* Слайд открывает фото на весь экран — кнопка, чтобы работали клавиатура и скринридер */
.exhibit-gallery__zoom{
    display: block;
    padding: 0;
    border: none;
    background: none;
    cursor: zoom-in;
}

/* ---------------- Попап с увеличенным фото ---------------- */

.img-popup{
    display: none;
    position: fixed;
    inset: 0;
    z-index: 100;
    align-items: center;
    justify-content: center;
}

.img-popup._open{
    display: flex;
    z-index: 9999;
}

.img-popup__backdrop{
    position: absolute;
    inset: 0;
    background: var(--color-black);
    opacity: .7;
}

/* Отступ слева равен крестику с зазором справа — так фото стоит ровно по центру */
.img-popup__frame{
    position: relative;
    display: inline-flex;
    align-items: flex-start;
    gap: .5rem;
    padding-left: 5.5rem;
}

/* Высота фото из макета, но не выше экрана (в макете сверху и снизу по 5rem).
   Ограничения во vh/vw, а не в процентах: ширина рамки сама зависит от фото,
   и процент считался бы от неизвестной величины — картинка схлопывалась в ноль.
   Размеры не заданы жёстко, поэтому пропорции держатся без object-fit. */
.img-popup__img{
    display: block;
    width: auto;
    height: auto;
    max-height: min(80rem, calc(100vh - 10rem));
    max-width: calc(100vw - 13rem);
}

.img-popup__close{
    flex: 0 0 auto;
    padding: 0;
    border: none;
    background: none;
    color: var(--color-white);
    cursor: pointer;
    transition: var(--transition-main);
}

.img-popup__close-icon{
    display: block;
    width: 5rem;
    height: 6.4rem;
}

@media (hover: hover){
    .img-popup__close:hover{
        color: var(--color-red-10);
    }
}

@media screen and (max-width: 1440px){
    .exhibit-gallery__slide img{
        width: calc(58rem * var(--w) / var(--h));
        max-width: 67rem;
    }
}

@media screen and (max-width: 1280px){
    .exhibit-gallery__slide img{
        width: calc(48rem * var(--w) / var(--h));
        max-width: 56rem;
    }

    .exhibit-gallery__arrow{
        width: 6rem;
        height: 6rem;
    }
}

@media screen and (max-width: 767px){
    .exhibit-gallery__slide img{
        width: calc(40rem * var(--w) / var(--h));
        max-width: 100%;
    }

    .exhibit-gallery__controls{
        gap: .5rem;
        padding-bottom: 1rem;
        border-bottom-width: .2rem;
    }

    .exhibit-gallery__arrow{
        width: 5rem;
        height: 5rem;
        border-width: .2rem;
    }

    /* Крестик мельче, отступ слева по-прежнему равен ему с зазором */
    .img-popup__frame{
        padding-left: 2.9rem;
    }

    .img-popup__img{
        max-height: min(80rem, calc(100vh - 4rem));
        max-width: calc(100vw - 7rem);
    }

    .img-popup__close-icon{
        width: 2.5rem;
        height: 3.2rem;
    }
}

/* End */
/* /local/templates/mtmuseum/components/bitrix/news/exhibits/bitrix/news.detail/.default/style.css?17893024483805 */
/* /local/templates/mtmuseum/assets/css/vendor/swiper-bundle.min.css?178930244814621 */
/* /local/templates/mtmuseum/assets/css/components/gallery/exhibit-gallery.css?17893024486721 */