/* Generated by tools/build_css.py from the static site css/global-d.css. Do not edit. */
:root{
  --wa-bg: var(--wa);
  --wa-fg: #fff;
  --wa-gap: 20px;
}

.wa-float{
  position: fixed;
  right: var(--wa-gap);
  bottom: var(--wa-gap);
  z-index: 60;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 14px 20px 14px 17px;
  border-radius: 999px;
  background: var(--wa-bg);
  color: var(--wa-fg);
  font-family: var(--f-body);
  font-size: .95rem;
  font-weight: 600;
  letter-spacing: .1px;
  text-decoration: none;
  box-shadow: 0 6px 28px rgba(26, 17, 34, .22);
  transition: filter .18s ease;
}

.wa-float i{ font-size: 1.4rem; line-height: 1; }

.wa-float:hover,.wa-float:focus-visible{ filter: brightness(.92); }

.wa-float:focus-visible{
  outline: 3px solid var(--focus);
  outline-offset: 3px;
}

/* Below 640px the label is dropped and the action becomes a round mark,
   so it never covers body copy on a narrow screen. */
@media (max-width: 640px) {
  .wa-float{
    padding: 0;
    width: 56px;
    height: 56px;
    justify-content: center;
    gap: 0;
  }
  .wa-float span{
    position: absolute;
    width: 1px; height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
  }
  .wa-float i{ font-size: 1.65rem; }
}

.desktop-nav .nav-about{ position: relative; }

.desktop-nav .nav-about > summary,.desktop-nav .nav-about > :where(.elementor,.elementor-widget) > summary{
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 9px 14px;
  border-radius: 6px;
  font-size: 13px;
  color: var(--soft);
  cursor: pointer;
  list-style: none;
  user-select: none;
  transition: background .2s ease, color .2s ease;
}

.desktop-nav .nav-about > summary::-webkit-details-marker,.desktop-nav .nav-about > :where(.elementor,.elementor-widget) > summary::-webkit-details-marker{ display: none; }
.desktop-nav .nav-about > summary::marker,.desktop-nav .nav-about > :where(.elementor,.elementor-widget) > summary::marker{ content: ""; }

.desktop-nav .nav-about > summary:hover,.desktop-nav .nav-about > :where(.elementor,.elementor-widget) > summary:hover,.desktop-nav .nav-about[open] > summary,.desktop-nav .nav-about[open] > :where(.elementor,.elementor-widget) > summary{
  background: #fff;
  color: var(--ink);
}

.desktop-nav .nav-about > summary i,.desktop-nav .nav-about > :where(.elementor,.elementor-widget) > summary i{
  font-size: .85em;
  transition: transform .18s ease;
}

.desktop-nav .nav-about[open] > summary i,.desktop-nav .nav-about[open] > :where(.elementor,.elementor-widget) > summary i{ transform: rotate(180deg); }

.desktop-nav .nav-about > summary:focus-visible,.desktop-nav .nav-about > :where(.elementor,.elementor-widget) > summary:focus-visible{
  outline: 3px solid var(--focus);
  outline-offset: 4px;
}

.desktop-nav .nav-about-panel{ display: none; }

.desktop-nav .nav-about[open] .nav-about-panel{
  position: absolute;
  top: calc(100% + 14px);
  left: 50%;
  transform: translateX(-50%);
  z-index: 50;
  display: flex;
  flex-direction: column;
  min-width: 190px;
  padding: 8px;
  border-radius: var(--r-sm);
  background: #fff;
  border: 1px solid var(--line);
  box-shadow: 0 12px 36px rgba(26, 17, 34, .13);
}

.desktop-nav .nav-about-panel a{
  padding: 9px 12px;
  border-radius: 9px;
  white-space: nowrap;
  transition: background-color .15s ease;
}

.desktop-nav .nav-about-panel a:hover,.desktop-nav .nav-about-panel a:focus-visible{ background: var(--paper-soft); }

.status-pill{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 11px 5px 9px;
  border-radius: 999px;
  background: var(--paper-soft);
  border: 1px solid var(--line);
  color: var(--soft);
  font-family: var(--f-body);
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .1px;
  white-space: nowrap;
}

.status-pill i{ font-size: .95rem; line-height: 1; }

.times-pending{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 14px;
  padding: 24px;
  border-radius: var(--r-md);
  background: var(--paper-soft);
}

.times-pending p{
  margin: 0;
  max-width: 52ch;
  color: var(--soft);
  font-size: 1rem;
  line-height: 1.55;
}

.times-pending .wa-inline{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 18px;
  border-radius: 999px;
  background: var(--wa);
  color: #fff;
  font-family: var(--f-body);
  font-size: .92rem;
  font-weight: 600;
  letter-spacing: .1px;
  text-decoration: none;
  transition: filter .18s ease;
}

.times-pending .wa-inline:hover,.times-pending .wa-inline:focus-visible{ filter: brightness(.92); }

.times-pending .wa-inline i{ font-size: 1.15rem; line-height: 1; }

/* --------------------------------------------------------------------------
   Reduced motion
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
  .wa-float,.header-cta,.desktop-nav .nav-about > summary,.desktop-nav .nav-about > :where(.elementor,.elementor-widget) > summary,.desktop-nav .nav-about > summary i,.desktop-nav .nav-about > :where(.elementor,.elementor-widget) > summary i,.desktop-nav .nav-about-panel a,.times-pending .wa-inline{ transition: none; }
}

.carousel{margin:0 0 26px}
.carousel-viewport{overflow:hidden;border-radius:18px;background:var(--paper-soft)}
.carousel-track{display:flex;transition:transform .45s cubic-bezier(.2,.75,.2,1)}
.carousel-slide{flex:0 0 100%;min-width:0}
.carousel-slide img{display:block;width:100%;height:clamp(300px,38vw,480px);object-fit:cover}
.carousel-bar{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:16px}
.carousel-caption{margin:0;color:var(--soft);font-size:13px}
.carousel-controls{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.carousel-btn{appearance:none;display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink);cursor:pointer;font-size:17px;transition:background .2s ease,border-color .2s ease}
.carousel-btn:hover{background:var(--paper-soft);border-color:var(--ink)}
.carousel-btn:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.carousel-dots{display:flex;align-items:center;gap:6px;margin:0 4px}
.carousel-dot{appearance:none;width:22px;height:4px;padding:0;border:0;border-radius:2px;background:#DCD5E4;cursor:pointer;transition:background .2s ease}
.carousel-dot[aria-current="true"]{background:var(--ink)}
.carousel-dot:focus-visible{outline:3px solid var(--focus);outline-offset:3px}

@media (max-width:640px){
  .carousel-bar{flex-direction:column;align-items:flex-start;gap:12px}
}

@media (prefers-reduced-motion: reduce){
  .carousel-track{transition:none}
  .carousel-btn,.carousel-dot{transition:none}
}

.dance-gallery,.t-gallery,.m-gallery{max-width:1120px;margin:clamp(110px,12vw,170px) auto;padding:0}

.gallery-head{display:grid;grid-template-columns:1.15fr .65fr;gap:clamp(40px,7vw,90px);align-items:end;margin-bottom:clamp(30px,3.2vw,46px)}
.gallery-head>div:not(:where(.elementor-widget,.elementor,.elementor-text-editor))>i,.gallery-head>div:not(:where(.elementor-widget,.elementor,.elementor-text-editor))> :where(.elementor,.elementor-widget) >i,.gallery-head> :where(.elementor,.elementor-widget) >div:not(:where(.elementor-widget,.elementor,.elementor-text-editor))>i,.gallery-head> :where(.elementor,.elementor-widget) >div:not(:where(.elementor-widget,.elementor,.elementor-text-editor))> :where(.elementor,.elementor-widget) >i{display:block;margin-bottom:16px;font-size:32px;color:var(--quiet)}
.gallery-head h2{max-width:650px;margin:0;font-size:clamp(34px,4vw,51px);line-height:1.2;text-wrap:pretty}
.gallery-head>p,.gallery-head> :where(.elementor,.elementor-widget) >p{max-width:420px;margin:0 0 7px;color:var(--soft);font-size:15px;line-height:1.6}

@media (max-width:1000px){
  .gallery-head{grid-template-columns:1fr;gap:20px;align-items:start}
}
@media (max-width:680px){
  .dance-gallery,.t-gallery,.m-gallery{margin:96px auto}
  .gallery-head h2{font-size:34px}
  .gallery-head>p,.gallery-head> :where(.elementor,.elementor-widget) >p{font-size:14px}
}

.video-facade{position:relative;display:block;width:100%;margin:0;padding:0;border:0;border-radius:18px;overflow:hidden;background:var(--paper-soft);cursor:pointer;aspect-ratio:16/9}
.video-facade.is-portrait{aspect-ratio:9/16}
.video-facade img{display:block;width:100%;height:100%;object-fit:cover}
.video-facade iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

.video-facade::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(26,17,34,0) 40%,rgba(26,17,34,.35) 100%);pointer-events:none;transition:opacity .2s ease}
.video-facade.is-playing::after{display:none}
.video-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:inline-flex;align-items:center;justify-content:center;width:66px;height:66px;border-radius:999px;background:rgba(255,255,255,.94);color:var(--ink);pointer-events:none;transition:background-color .2s ease}
.video-play i{font-size:28px;margin-left:3px;line-height:1}
.video-facade:hover .video-play{background:#fff}
.video-facade:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.video-facade-label{position:absolute;left:16px;right:16px;bottom:14px;color:#fff;font-family:var(--f-body);font-size:13px;font-weight:600;letter-spacing:.1px;text-align:left;pointer-events:none;text-shadow:0 1px 3px rgba(26,17,34,.5)}
.video-facade.is-playing .video-play,.video-facade.is-playing .video-facade-label{display:none}

.video-modal{width:min(92vw,1040px);max-width:none;padding:0;border:0;border-radius:18px;background:#000;overflow:hidden}
.video-modal::backdrop{background:rgba(26,17,34,.72)}
.video-modal-frame{position:relative;width:100%;aspect-ratio:16/9;background:#000}
.video-modal-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video-modal-close{position:absolute;top:10px;right:10px;z-index:2;display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border:0;border-radius:999px;background:rgba(255,255,255,.92);color:var(--ink);cursor:pointer;font-size:19px}
.video-modal-close:hover{background:#fff}
.video-modal-close:focus-visible{outline:3px solid #fff;outline-offset:2px}

@media (max-width:640px){
  .video-play{width:54px;height:54px}
  .video-play i{font-size:23px}
}

@media (prefers-reduced-motion: reduce){
  .video-facade::after,.video-play,.video-modal-close{transition:none}
}

.carousel{--cols-d:1;--cols-t:1;--cols-m:1;--cols:var(--cols-m);--col-gap:12px}
@media (min-width:641px){ .carousel{--cols:var(--cols-t)} }
@media (min-width:901px){ .carousel{--cols:var(--cols-d)} }

.carousel-track{gap:var(--col-gap)}
.carousel-slide{flex:0 0 calc((100% - (var(--cols) - 1) * var(--col-gap)) / var(--cols))}

.carousel[data-view="2"] .carousel-viewport,.carousel[data-view="3"] .carousel-viewport,.carousel[data-view="4"] .carousel-viewport{background:transparent;border-radius:0}
.carousel[data-view="2"] .carousel-slide img,.carousel[data-view="3"] .carousel-slide img,.carousel[data-view="4"] .carousel-slide img{height:clamp(190px,19vw,250px);border-radius:14px}

.carousel[data-view="2"] .carousel-caption,.carousel[data-view="3"] .carousel-caption,.carousel[data-view="4"] .carousel-caption{display:none}
.carousel[data-view="2"] .carousel-bar,.carousel[data-view="3"] .carousel-bar,.carousel[data-view="4"] .carousel-bar{justify-content:flex-end}

.zoom-btn{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in;border-radius:14px;overflow:hidden;position:relative}
.zoom-btn:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.zoom-btn::after{content:"";position:absolute;inset:0;background:rgba(26,17,34,0);transition:background-color .2s ease}
.zoom-btn:hover::after{background:rgba(26,17,34,.12)}

.lightbox{width:min(94vw,1180px);max-width:none;max-height:94vh;padding:0;border:0;border-radius:18px;background:transparent;overflow:visible}
.lightbox::backdrop{background:rgba(26,17,34,.86)}
.lightbox-figure{margin:0;display:flex;flex-direction:column;gap:14px}
.lightbox img{display:block;width:100%;max-height:78vh;object-fit:contain;border-radius:14px;background:#000}
.lightbox figcaption{display:flex;align-items:center;justify-content:space-between;gap:20px;color:#fff;font-family:var(--f-body);font-size:13px}
.lightbox-count{flex:0 0 auto;opacity:.72;font-variant-numeric:tabular-nums}
.lightbox-close,.lightbox-nav{position:absolute;z-index:2;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:0;border-radius:999px;background:rgba(255,255,255,.92);color:var(--ink);cursor:pointer;font-size:19px;transition:background-color .2s ease}
.lightbox-close:hover,.lightbox-nav:hover{background:#fff}
.lightbox-close:focus-visible,.lightbox-nav:focus-visible{outline:3px solid #fff;outline-offset:2px}
.lightbox-close{top:-14px;right:-14px}
.lightbox-nav.is-prev{left:-14px;top:50%;transform:translateY(-50%)}
.lightbox-nav.is-next{right:-14px;top:50%;transform:translateY(-50%)}

@media (max-width:640px){
  .lightbox{width:94vw}
  .lightbox-close{top:8px;right:8px}
  .lightbox-nav.is-prev{left:6px}
  .lightbox-nav.is-next{right:6px}
}

@media (prefers-reduced-motion: reduce){
  .zoom-btn::after,.lightbox-close,.lightbox-nav{transition:none}
}

.carousel-controls[hidden],.carousel-bar[hidden]{display:none}

.m-row .status-pill{grid-column:2 / -1;justify-self:start;margin-top:8px}

.m-trial-action span a,.cta-action > span a,.cta-action > :where(.elementor,.elementor-widget) > span a,.trial-action p a,.t-trial-action span a,.dance-trial-action span a{margin-left:.3em}

/* --------------------------------------------------------------------------
   9. Section heading to its description
   The gap ranged from 8px to 22px depending on which stylesheet set it,and
   the music ladder at 8px sat noticeably tighter than its own neighbours.
   One value now,roughly double the old typical.

   Each section head is named explicitly because the page stylesheets pin
   their paragraphs with `p{margin:0}`,which is class specificity and beats
   a bare `h2 + p`. The heading's own bottom margin is zeroed in the same
   rule so the result is exact: margins collapse in a block container but add
   inside a flex one, and several of these are flex.
   -------------------------------------------------------------------------- */

:root{ --head-gap: clamp(24px, 2.4vw, 36px); }

.m-ladder-head h2,.m-standards-copy h2,.m-route-side h2,.standards-copy h2,.timetable-copy h2,.h2-faq-wrap h2,.t-outcomes h2,.section-head h2,.h2-head h2,.ds-section-head h2{ margin-bottom: 0; }

.m-ladder-head h2 + p,.m-standards-copy h2 + p,.m-route-side h2 + p,.standards-copy h2 + p,.timetable-copy h2 + p,.h2-faq-wrap h2 + p,.t-outcomes h2 + p,.section-head h2 + p,.h2-head h2 + p,.ds-section-head h2 + p,.tt-pending-head h2 + p,.gallery-head h2 + p{ margin-top: var(--head-gap); }

.prose h2{ margin-bottom: 14px; }
.prose h2 + p{ margin-top: 0; }

/* --------------------------------------------------------------------------
   10. Mobile menu
   It was a 210px dropdown pinned to the right of the header, and the About
   destinations sat flat in the list, so the menu ran to eleven items. Client
   direction 2026-08-10: full width, with About as an accordion mirroring the
   desktop dropdown.
   -------------------------------------------------------------------------- */

@media (max-width:1000px){
  .mobile-menu nav{
    position:fixed;
    left:0; right:0; top:var(--header-h,72px);
    z-index:70;
    width:auto;
    height:calc(100dvh - var(--header-h,72px));
    display:flex; flex-direction:column;
    overflow-y:auto;
    padding:10px 18px calc(18px + env(safe-area-inset-bottom));
    border-radius:0;
    border-top:1px solid var(--line);
    box-shadow:none;
  }

  /* Older engines without dvh fall back to vh. */
  @supports not (height: 100dvh){
    .mobile-menu nav{ height:calc(100vh - var(--header-h,72px)); }
  }

  .mobile-menu nav > a,.mobile-menu nav > :where(.elementor,.elementor-widget) > a,.mobile-menu .m-about > summary,.mobile-menu .m-about > :where(.elementor,.elementor-widget) > summary,.mobile-menu .m-about-panel a{
    display:flex; align-items:center;
    padding:14px 12px;
    border-radius:8px;
    font-size:15px;
  }

  .mobile-menu .m-about{ border-radius:8px; }
  .mobile-menu .m-about > summary,.mobile-menu .m-about > :where(.elementor,.elementor-widget) > summary{
    width:auto; height:auto; margin-right:0;
    justify-content:space-between;
    cursor:pointer; list-style:none;
    color:var(--ink);
  }
  .mobile-menu .m-about > summary::-webkit-details-marker,.mobile-menu .m-about > :where(.elementor,.elementor-widget) > summary::-webkit-details-marker{ display:none; }
  .mobile-menu .m-about > summary::marker,.mobile-menu .m-about > :where(.elementor,.elementor-widget) > summary::marker{ content:""; }
  .mobile-menu .m-about > summary i,.mobile-menu .m-about > :where(.elementor,.elementor-widget) > summary i{ font-size:14px; transition:transform .18s ease; }
  .mobile-menu .m-about[open] > summary,.mobile-menu .m-about[open] > :where(.elementor,.elementor-widget) > summary{ background:var(--paper-soft); }
  .mobile-menu .m-about[open] > summary i,.mobile-menu .m-about[open] > :where(.elementor,.elementor-widget) > summary i{ transform:rotate(180deg); }

  .mobile-menu .m-about-panel{ display:none; }
  .mobile-menu .m-about[open] .m-about-panel{
    display:flex; flex-direction:column;
    margin:2px 0 6px;
    padding-left:10px;
    border-left:2px solid var(--line);
  }
  .mobile-menu .m-about-panel a{ padding-top:12px; padding-bottom:12px; color:var(--soft); }

  .mobile-menu nav .mobile-cta{
    justify-content:center; gap:9px;
    margin-top:auto; padding:15px 16px;
    border-radius:999px;
    background:var(--wa); color:#fff;
    font-weight:600; box-shadow:none;
  }
  .mobile-menu nav .mobile-cta i{ font-size:19px; }
}

@media (prefers-reduced-motion: reduce){
  .mobile-menu .m-about > summary i,.mobile-menu .m-about > :where(.elementor,.elementor-widget) > summary i{ transition:none; }
}

body.menu-open{ overflow:hidden; }
body.menu-open .wa-float,body.menu-open .review-fab{ display:none; }

strong{font-weight:600;color:var(--strong-ink,var(--ink))}

.cta-band,.trial,.hero-copy,.dance-hero-bar,.dance-pathway,.dance-trial,.m-hero-bar,.m-trial,.t-hero-bar,.t-trial,.t-level:nth-child(4),.t-level:nth-child(5),.h2-step:nth-child(4),.dept-tile>span,.dept-tile> :where(.elementor,.elementor-widget) >span,.video-facade-label,.lightbox figcaption{ --strong-ink: currentColor; }

h1,h2,h3{line-height:1.2}

.desktop-nav > a[aria-current="page"],.desktop-nav > :where(.elementor,.elementor-widget) > a[aria-current="page"]{
  background: #fff;
  color: var(--ink);
  font-weight: 600;
  box-shadow: 0 1px 2px rgba(26, 17, 34, .06);
}

.desktop-nav .nav-about-panel a[aria-current="page"]{
  background: var(--paper-soft);
  color: var(--ink);
  font-weight: 600;
}

.desktop-nav .nav-about:has(a[aria-current="page"]) > summary,.desktop-nav .nav-about:has(a[aria-current="page"]) > :where(.elementor,.elementor-widget) > summary{
  background: #fff;
  color: var(--ink);
  font-weight: 600;
  box-shadow: 0 1px 2px rgba(26, 17, 34, .06);
}

.mobile-menu .m-about:has(a[aria-current="page"]) > summary,.mobile-menu .m-about:has(a[aria-current="page"]) > :where(.elementor,.elementor-widget) > summary{
  background: #f7f6f8;
  font-weight: 600;
}

.header-cta{
  background: #F7F6F8 !important;
  color: var(--ink) !important;
  padding: 14px 18px;
  border-radius: 9px;
  box-shadow: none;
  transition: background-color .2s ease, box-shadow .2s ease;
}

.header-cta:hover,.header-cta:focus-visible{
  background: #fff !important;
  box-shadow: 0 1px 2px rgba(26, 17, 34, .06);
}

.dept-film{
  max-width: 780px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: clamp(28px, 4vw, 52px);
  align-items: center;
}

.dept-film-copy h2{
  margin: 6px 0 0;
  font-size: clamp(26px, 2.6vw, 34px);
  line-height: 1.2;
  text-wrap: pretty;
}

.dept-film-copy p:last-child:not(:where(.bc-w:not(:last-child)>*)){
  margin: 14px 0 0;
  max-width: 38ch;
  color: var(--ink-soft);
  font-size: 15.5px;
  line-height: 1.65;
}

.dept-film-player{
  width: clamp(230px, 24vw, 290px);
  aspect-ratio: 9 / 16;
  height: auto;
  border-radius: 16px;
  background: #17121a;
  object-fit: cover;
  box-shadow: 0 1px 2px rgba(26, 17, 34, .05), 0 10px 30px rgba(26, 17, 34, .10);
}

@media (max-width: 760px) {
  .dept-film{ grid-template-columns: 1fr; gap: 26px; justify-items: start; }
  .dept-film-player{ width: min(280px, 78%); }
}

.dance-opening.has-film,.m-opening.has-film,.t-opening.has-film{
  grid-template-columns: 1.15fr .85fr;
  gap: clamp(36px, 5vw, 64px);
  align-items: center;
}

.has-film > div:not(:where(.elementor-widget,.elementor,.elementor-text-editor)) > p,.has-film > div:not(:where(.elementor-widget,.elementor,.elementor-text-editor)) > :where(.elementor,.elementor-widget) > p,.has-film > :where(.elementor,.elementor-widget) > div:not(:where(.elementor-widget,.elementor,.elementor-text-editor)) > p,.has-film > :where(.elementor,.elementor-widget) > div:not(:where(.elementor-widget,.elementor,.elementor-text-editor)) > :where(.elementor,.elementor-widget) > p{
  max-width: 52ch;
  margin: 18px 0 0;
  color: var(--soft);
  font-size: 15px;
  line-height: 1.6;
}

.has-film > .dept-film-player,.has-film > :where(.elementor,.elementor-widget) > .dept-film-player{ justify-self: center; }

@media (max-width: 860px) {
  .dance-opening.has-film,.m-opening.has-film,.t-opening.has-film{ grid-template-columns: 1fr; gap: 28px; align-items: start; }
  .has-film > .dept-film-player,.has-film > :where(.elementor,.elementor-widget) > .dept-film-player{ justify-self: start; width: min(260px, 72%); }
}

.gallery-single{
  max-width: 1120px;
  margin: 0 auto;
}

.gallery-single img{
  display: block;
  width: 100%;
  height: auto;
  border-radius: 16px;
}

.gallery-film{
  max-width: 1120px;
  margin: 0 auto;
}

.gallery-film video{
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  border-radius: 16px;
  background: #17121a;
  object-fit: cover;
}