/* Owner's review of 28.09.2026, loaded after every other stylesheet so it wins without !important where it can.
   Photos: every place has its own frame per screen (catalog/models.py EVENT_PHOTOS). Phone: no emoji-like marks,
   one buy button, no empty gaps. Sizes of titles and descriptions are chosen in «Страницы → Главная». */

/* ---------- drawn icons (catalog/templatetags/site_edit.py `icon`) ---------- */
.i{display:inline-block;flex:none;width:1em;height:1em;vertical-align:-.14em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.search-icon .i{width:21px;height:21px;vertical-align:middle}
.search-field .i{width:18px;height:18px;color:var(--muted)}
.filter-toggle .i{width:18px;height:18px}
.manifesto-arrow .i{stroke-width:1.2}
.gold .i{transition:translate 180ms}
.gold:hover .i{translate:3px -3px}
@media(max-width:650px){
  /* The owner asked for none of these decorative marks on a phone. */
  .i-arrow,.circle-arrow,.manifesto-arrow{display:none!important}
}

/* ---------- home carousel: one frame per screen ---------- */
.hero-slide{height:auto}
.hero-slide-frame{position:relative;overflow:hidden;aspect-ratio:3/1;min-height:280px;max-height:calc(100vh - 120px);background:var(--deep)}
.hero-slide-glow{background-image:var(--glow-d)}
.hero-slide[data-d=cut] .hero-slide-glow{display:none}
.hero-slide-poster{position:absolute;inset:0;display:block}
.hero-slide-poster img{display:block;width:100%;height:100%;object-fit:contain}
.hero-slide[data-d=cut] .hero-slide-poster img{object-fit:cover}
.hero-slide-bar{align-items:center}
.hero-slide-meta strong{-webkit-line-clamp:2}
body.ts-title-m .hero-slide-meta strong{font-size:clamp(22px,2.6vw,36px)}
body.ts-title-l .hero-slide-meta strong{font-size:clamp(28px,3.5vw,52px)}
body.ts-title-xl .hero-slide-meta strong{font-size:clamp(32px,4.6vw,70px)}
body.ts-title-m .hero-slide-meta span{font-size:13px}
body.ts-title-l .hero-slide-meta span{font-size:15px}
body.ts-title-xl .hero-slide-meta span{font-size:18px}
@media(max-width:650px){
  .hero-slide-frame{aspect-ratio:4/5;min-height:0;max-height:none}
  .hero-slide .hero-slide-glow{display:block;background-image:var(--glow-m)}
  .hero-slide[data-m=cut] .hero-slide-glow{display:none}
  .hero-slide[data-m=whole] .hero-slide-poster img{object-fit:contain}
  .hero-slide[data-m=cut] .hero-slide-poster img{object-fit:cover}
  /* Name, date and the button sit under the picture on a phone instead of covering its lower part. */
  .hero-slide .hero-slide-bar,.hero-slide[data-tone=light] .hero-slide-bar,.hero-carousel.is-bare .hero-slide-bar{position:static;align-items:stretch;background:var(--deep);padding:16px 18px 46px;gap:14px}
  .hero-slide .hero-slide-meta,.hero-slide[data-tone=light] .hero-slide-meta{text-shadow:none}
  .hero-slide .hero-slide-meta strong,.hero-slide[data-tone=light] .hero-slide-meta strong{color:#fff}
  .hero-slide .hero-slide-meta span,.hero-slide[data-tone=light] .hero-slide-meta span{color:#c9ccd4}
  .hero-carousel,.hero-carousel[data-tone=light]{--hero-ink:#fff;--hero-ink-shadow:#0b0d1373}
  body.ts-title-m .hero-slide-meta strong{font-size:24px}
  body.ts-title-l .hero-slide-meta strong{font-size:30px}
  body.ts-title-xl .hero-slide-meta strong{font-size:36px}
  body.ts-title-m .hero-slide-meta span{font-size:12px}
  body.ts-title-l .hero-slide-meta span{font-size:13px}
  body.ts-title-xl .hero-slide-meta span{font-size:15px}
}

/* ---------- «Ближайшие события» and «Фильтры» on one line ---------- */
.catalog-section>.section-top{display:flex;align-items:flex-end;min-height:0;margin-bottom:22px}
.catalog-section>.section-top h2{margin:0;line-height:48px}
#filters-panel>summary{top:48px;min-height:48px}
.catalog-section.has-eyebrow #filters-panel>summary{top:auto}
@media(max-width:650px){
  .catalog-section>.section-top{min-height:0;margin-bottom:18px}
  .catalog-section>.section-top h2{line-height:44px}
  #filters-panel>summary{top:32px;min-height:44px}
}
@media(max-width:330px){
  .catalog-section>.section-top{padding-right:0;min-height:0;margin-bottom:64px}
  #filters-panel>summary{top:84px}
}

/* ---------- no empty band under the list ---------- */
.load-more{margin:28px auto 8px}
.load-more .i{width:18px;height:18px}
.catalog-end:empty{display:none}
#catalog-status:empty{display:none}
@media(max-width:650px){
  .load-more{margin:22px auto 4px}
  .catalog-end{margin:22px auto 4px}
}

/* ---------- event page ---------- */
.about-title{white-space:normal}
@media(max-width:650px){
  /* A phone gets the picture first, whole and undimmed, and the title under it; buying is the one bar at the bottom. */
  .event-hero{display:flex;flex-direction:column;align-items:stretch;min-height:0;padding-top:0;padding-bottom:26px}
  .event-hero::before,.event-hero::after{content:none}
  .event-hero .event-hero-image{position:relative;inset:auto;order:-1;z-index:0;width:auto;height:auto;margin:0 -18px 20px;border-radius:0;overflow:hidden;background:#0b0d13}
  .event-hero .event-hero-image .event-hero-glow{display:none}
  .event-hero .event-hero-image picture{display:block}
  .event-hero .event-hero-image img,.event-hero .event-hero-image.is-contain img{position:static;display:block;width:100%;height:auto;padding:0;opacity:1;transform:none!important;object-position:center}
  .event-hero .event-hero-image.m-cut img{aspect-ratio:4/5;object-fit:cover}
  .event-hero .event-hero-image.m-whole img{max-height:82vh;object-fit:contain}
  .event-hero h1{margin:10px 0 14px}
  .event-hero-actions .buy-cta{display:none}
  .event-hero-actions{margin-top:12px}
}

/* ---------- plays and artists ---------- */
.tag.gold,.show-tags .tag.gold{background:transparent;box-shadow:none;border-color:var(--gold);color:var(--gold);font-weight:600}
.tag.gold:hover{translate:none}
.show-copy .prose{margin-top:20px}
.artist-video{margin:40px 0 8px;max-width:980px}
.artist-video video,.artist-video iframe{display:block;width:100%;aspect-ratio:16/9;border:0;border-radius:8px;background:#000}
@media(max-width:650px){.artist-video{margin:28px 0 4px}}

/* ---------- sizes chosen by the owner ---------- */
body.ts-text-l .prose{font-size:18px}
body.ts-text-xl .prose{font-size:20px}
body.ts-card-l .event-card h3{font-size:19px}
body.ts-card-xl .event-card h3{font-size:22px}
body.ts-card-l .poster-caption h3{font-size:23px}
body.ts-card-xl .poster-caption h3{font-size:27px}
@media(max-width:650px){
  body.ts-card-l .event-card h3{font-size:16px}
  body.ts-card-xl .event-card h3{font-size:18px}
  body.ts-card-l .poster-caption h3{font-size:17px}
  body.ts-card-xl .poster-caption h3{font-size:20px}
  body.ts-text-l .prose{font-size:17px}
  body.ts-text-xl .prose{font-size:19px}
}

/* A play's page kept its content flush with the screen edge: the section padding wiped the side padding of .wrap. */
.wrap.show-hero,.wrap.show-section{padding-left:48px;padding-right:48px}
@media(max-width:1000px){.wrap.show-hero,.wrap.show-section{padding-left:28px;padding-right:28px}}
@media(max-width:650px){.wrap.show-hero,.wrap.show-section{padding-left:18px;padding-right:18px}}
.show-poster img{display:block;width:100%;height:auto;border-radius:8px}

/* «Добавлено событий: N» is for screen readers only; a failure with its link stays visible. */
#catalog-status:not(:has(a)){position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;margin:0}
