section.baner { padding-bottom: 110px; }
.baner .duble-btn-wrap { margin-bottom: 0; }
.baner-title { max-width: 1180px; font-size: clamp(30px, 3.6vw, 54px); line-height: 1.22; text-wrap: balance; }
.baner-title span { display: block; margin-top: 12px; }
.baner-desc { max-width: 920px; margin: 26px auto 0; font-size: 22px; line-height: 1.65; text-wrap: pretty; }
.big-project h2, .ytb-sec h2 { font-size: clamp(30px, 3.6vw, 48px); line-height: 1.25; text-wrap: balance; }
.big-project-slider .txt { line-height: 1.65; text-wrap: balance; }
.big-project-slider .feature-mods .txt { font-size: 17px; }
.big-project-slider .swiper-pagination { position: relative; margin-top: 20px; line-height: 1; }
.big-project-slider .swiper-pagination-bullet { width: 10px; height: 10px; background: #842c27; }
.big-project .opening-invitation { margin-top: 48px; font-size: clamp(28px, 3.1vw, 42px); line-height: 1.4; text-wrap: balance; }
.big-project p.opening-summary { max-width: 940px; margin: 22px auto; padding: 0 8px; text-wrap: pretty; }
.big-project p.mods-note { max-width: 900px; margin: 24px auto 32px; padding: 0 12px; font-size: 17px; line-height: 1.8; text-wrap: pretty; }
.mods-note strong { color: #7e2723; }

.opening-gallery {
    --gallery-gold: #efbb72;
    --gallery-text: #f5e8d5;
    padding: 88px 0 84px;
    color: var(--gallery-text);
    background: #25080e url('/img/bg-bandles.jpg') center / cover no-repeat;
}
.opening-gallery h2 { max-width: 1080px; margin: 0 auto; padding: 0; color: #fff8ed; font-size: clamp(30px, 3.6vw, 46px); line-height: 1.3; text-wrap: balance; text-shadow: 0 3px 12px #190309; }
.opening-gallery .gallery-intro { max-width: 740px; margin: 20px auto 44px; color: var(--gallery-text); text-align: center; font-size: 19px; line-height: 1.7; text-wrap: pretty; }
.gallery-stage { display: grid; grid-template-columns: minmax(0, 2.1fr) minmax(230px, 1fr); grid-template-areas: 'photo copy' 'thumbs thumbs'; align-items: center; gap: 26px 38px; }
.gallery-main { grid-area: photo; display: block; padding: 5px; border: 1px solid #d5a35e; background: #1a0b10; box-shadow: 0 12px 32px #12020880; }
.gallery-copy { grid-area: copy; }
.gallery-main img { width: 100%; height: auto; aspect-ratio: 800 / 449; object-fit: contain; }
.gallery-copy h3 { margin: 0 0 20px; color: var(--gallery-gold); text-align: left; font-size: 29px; line-height: 1.35; text-wrap: balance; }
.gallery-copy p { margin: 0; font-family: 'Inter', sans-serif; font-size: 17px; line-height: 1.8; text-wrap: pretty; }
.gallery-controls { display: flex; align-items: center; gap: 22px; margin-top: 28px; }
.gallery-arrow { flex: 0 0 40px; width: 40px; height: 48px; padding: 3px; border: 0; background: transparent; cursor: pointer; }
.gallery-arrow img { width: 100%; height: 100%; object-fit: contain; }
.gallery-counter { min-width: 60px; color: var(--gallery-gold); text-align: center; font-family: 'Inter', sans-serif; font-size: 16px; font-variant-numeric: tabular-nums; }
.gallery-fullsize { display: inline-block; margin-top: 18px; color: var(--gallery-gold); font-size: 14px; text-decoration: underline; text-underline-offset: 4px; }
.gallery-thumbs { grid-area: thumbs; min-width: 0; display: flex; gap: 12px; padding: 5px 2px 13px; overflow-x: auto; scrollbar-width: thin; scrollbar-color: #ad793e #331018; }
.gallery-thumb { flex: 0 0 148px; padding: 3px; border: 1px solid #a17650; background: #220d13; opacity: .7; cursor: pointer; transition: opacity .2s ease-out, border-color .2s ease-out; }
.gallery-thumb img { width: 100%; height: auto; aspect-ratio: 800 / 449; object-fit: cover; }
.gallery-thumb:hover, .gallery-thumb[aria-pressed='true'] { border-color: #ffd496; opacity: 1; }
.opening-gallery .btn-control { margin-top: 38px; }

.ytb-wrap { align-items: stretch; }
.ytb-prev { flex: 1; min-width: 0; }
.ytb-prev iframe { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; border: 0; background: #180f12; }
.ytb-items { flex: 0 0 260px; height: 500px; }
button.ytb-item { display: block; width: 100%; padding: 0; border: 2px solid transparent; background: #24151a; text-align: left; cursor: pointer; }
button.ytb-item[aria-pressed='true'] { border-color: #8b2822; }
.ytb-item img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
.ytb-caption { display: block; padding: 9px 10px; color: #fff6e9; font-family: 'Inter', sans-serif; font-size: 13px; line-height: 1.45; }
.video-fallback { margin-top: 14px; font-size: 15px; line-height: 1.5; }
.video-fallback a { color: #7f2821; text-decoration: underline; text-underline-offset: 4px; }
.arrow-left, .arrow-right, button.open-main-menu { border: 0; padding: 0; background: transparent; }
.arrow-left img, .arrow-right img { width: 70px; }
a:focus-visible, button:focus-visible { outline: 3px solid #c58a30; outline-offset: 5px; }
.opening-gallery a:focus-visible, .opening-gallery button:focus-visible { outline-color: #ffe1b3; }
::selection { color: #fff6e8; background: #842c27; }
#gallery-title, #opening-features-title, #videos-title { scroll-margin-top: 120px; }

@media (max-width: 900px) {
    .baner-desc { max-width: 680px; padding: 0 12px; font-size: 18px; }
    .opening-gallery { padding: 64px 0; }
    .gallery-stage { grid-template-columns: minmax(0, 1fr); grid-template-areas: 'photo' 'thumbs' 'copy'; gap: 22px; }
    .gallery-copy { position: relative; display: flex; flex-direction: column; padding: 0 4px; }
    .gallery-copy h3 { margin-bottom: 12px; font-size: 26px; }
    .gallery-controls { order: -1; justify-content: center; margin: 0 0 18px; }
    .ytb-wrap { display: block; }
    .ytb-items { display: flex; width: 100%; height: auto; margin-top: 24px; gap: 14px; padding: 4px 2px 12px; overflow-x: auto; overflow-y: hidden; }
    button.ytb-item { flex: 0 0 210px; margin-bottom: 0; }
}
@media (max-width: 555px) {
    .logo-baner { padding-top: 90px; }
    .baner-title { margin-top: -12px; padding: 0 4px; font-size: 28px; }
    .baner-title span { margin-top: 10px; }
    .baner-desc { margin-top: 24px; font-size: 17px; line-height: 1.7; }
    .baner-desc br { display: none; }
    .duble-btn-wrap { margin-top: 30px; margin-bottom: 28px; }
    .big-project h2 { padding-top: 70px; }
    .big-project .opening-invitation { font-size: 27px; }
    .big-project p.opening-summary { font-size: 18px; line-height: 1.7; }
    .big-project p.mods-note { font-size: 15px; }
    .opening-gallery .gallery-intro { margin-bottom: 30px; padding: 0 6px; font-size: 17px; }
    .gallery-copy p { font-size: 16px; }
    .gallery-thumb { flex-basis: 116px; }
    .opening-gallery .btn.red { max-width: 100%; font-size: 19px; }
}
