/* «Кино, сериалы и шоу» (10.10.2026, the owner chose the board's v2). One move: the page is a screen with subtitles.
   The first screen is a colleague's line on Monday, subtitled; every title is a frame whose SHAPE says what it is — a
   film is letterboxed like the cinema, a series or a show carries its channel in the corner like television — and
   whose light is its chapter's. The title page is the same frame grown into a cinema hall. Phone first; the catalogue
   and the title page share this file. Facts live in the collection `watch` (the owner's rule: site collections). */

.wv { --wv-pad: 18px; --wv-dark: #0E0D0C; --wv-on-dark: #F2F0EB; --wv-on-dark2: #CFCBC3; --wv-on-dark3: #A9A59D; --wv-lilac: #B7AEFF; }
/* The hall stays a hall in the dark theme too, a shade lighter than the page so its edge still reads. */
:root.dark .wv { --wv-dark: #191817; }
.wv-in { max-width: 1600px; margin: 0 auto; padding: 0 var(--wv-pad); }
.wv-dark { background: var(--wv-dark); color: var(--wv-on-dark); }
.wv-dark .eyebrow, .wv-dark .mono { color: var(--wv-on-dark3); }
.wv-dark a:hover { color: var(--wv-lilac); }
.wv h2, .wv h3 { margin: 0; }

/* ——— Hero: the promise, then — where subtitles live — the line you will hear at work. ——— */
.wv-hero { position: relative; overflow: hidden; background: radial-gradient(90% 60% at 10% 0%, rgba(183, 174, 255, .18), transparent 70%), radial-gradient(60% 50% at 90% 100%, rgba(255, 186, 120, .08), transparent 70%), var(--wv-dark); }
.wv-hero-in { position: relative; padding-top: 32px; padding-bottom: 22px; display: grid; }
.wv-h1 { margin: 14px 0 0; max-width: 13ch; font-size: clamp(42px, 11vw, 92px); font-weight: 500; letter-spacing: -.055em; line-height: .95; text-wrap: balance; }
.wv-h1 b { font-weight: 500; color: var(--wv-lilac); }
.wv-lead { margin: 14px 0 0; max-width: 44ch; font-size: clamp(16px, 2.2vw, 20px); line-height: 1.5; color: var(--wv-on-dark2); }
.wv-line { margin: 44px 0 0; text-align: center; }
.wv-line .mono { display: block; margin-bottom: 12px; font-size: 10px; }
.wv-nl { display: inline; padding: 3px 10px; border-radius: 3px; background: #000; font-size: clamp(24px, 4.2vw, 46px); font-weight: 500; letter-spacing: -.02em; line-height: 1.55; color: #FFFFFF; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.wv-ru { display: block; margin-top: 10px; font-size: clamp(16px, 2vw, 22px); color: var(--wv-on-dark2); }
.wv-scrub { position: relative; height: 3px; margin-top: 26px; border-radius: 2px; background: rgba(242, 240, 235, .14); }
.wv-scrub i { position: absolute; left: 0; top: 0; bottom: 0; width: 38%; border-radius: 2px; background: var(--wv-lilac); transform-origin: left; animation: wv-play 1.6s cubic-bezier(.2, .8, .2, 1) both; }
.wv-scrub i::after { content: ""; position: absolute; right: -6px; top: -4.5px; width: 12px; height: 12px; border-radius: 50%; background: var(--wv-on-dark); }
@keyframes wv-play { from { transform: scaleX(0); } }

/* ——— The choice, in the afisha's language, and one line for whoever starts from zero. ——— */
.wv-pick { padding-top: 28px; }
.wv-pick .say { font-size: clamp(30px, 4.6vw, 64px); }
.wv-pick .bar { margin-top: 18px; }
.wv-chips { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
/* The count is the list's; the classics stand apart below, so the eight are named beside it, not lost. */
.wv-cl { margin-right: 8px; font: 500 12px var(--mono); color: var(--mut); transition: color .2s; }
.wv-cl:hover { color: var(--acc); }
.wv-quiet { scroll-margin-top: 88px; }
.wv-tip { margin: 16px 0 0; max-width: 62ch; font-size: 15px; line-height: 1.45; color: var(--txt2); }
.wv-tip a { color: var(--acc); font-weight: 500; }
.wv-tip a:hover { text-decoration: underline; text-underline-offset: 3px; }
.wv .gally-reset { height: 34px; padding: 0 12px; border-radius: 17px; font-size: 13px; font-weight: 500; color: var(--mut); }
.wv .gally-reset:hover { color: var(--txt); background: rgba(var(--ink), .06); }

/* ——— On air: what the country will be talking about, as seasons on three months, today a line. ——— */
.wv-air { padding-top: 56px; }
.wv-air h2 { margin-top: 12px; font-size: clamp(30px, 3.8vw, 52px); font-weight: 400; letter-spacing: -.045em; line-height: 1.04; }
.wv-air h2 b { font-weight: 500; color: var(--acc); }
.wv-air-note { margin: 12px 0 0; max-width: 46ch; font-size: 15px; line-height: 1.55; color: var(--txt2); }
.wv-scale { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 22px; padding-bottom: 6px; border-bottom: 1px solid rgba(var(--ink), .14); font: 500 10px var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--mut); }
.wv-scale span + span { padding-left: 8px; border-left: 1px solid rgba(var(--ink), .14); }
.wv-rows-wrap { position: relative; }
.wv-row { display: block; padding: 14px 0 12px; border-bottom: 1px solid rgba(var(--ink), .1); }
.wv-rn { display: block; font-size: 19px; letter-spacing: -.02em; line-height: 1.15; transition: color .2s; }
.wv-rn small { display: block; margin-top: 4px; font-size: 13px; letter-spacing: 0; color: var(--mut); }
.wv-rn .wv-rsub { display: none; }
.wv-row:hover .wv-rn { color: var(--acc); }
.wv-onair { display: none; align-items: center; gap: 5px; margin-left: 8px; padding: 2px 7px; border-radius: 999px; background: rgba(214, 48, 49, .1); font: 500 10px var(--mono); letter-spacing: .06em; text-transform: uppercase; color: #B4232A; vertical-align: 3px; }
:root.dark .wv-onair { color: #FF8A8F; background: rgba(255, 107, 117, .14); }
.wv-onair::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #E03131; }
.wv-row.is-live .wv-onair { display: inline-flex; }
.wv-track { position: relative; display: block; height: 8px; margin-top: 10px; border-radius: 4px; background: rgba(var(--ink), .06); }
/* Without the page's script the bars stay away: the words under the name already say when. */
.wv-bar { position: absolute; top: 0; bottom: 0; left: calc(var(--a, 0) * 100%); width: max(8px, calc(var(--w, 0) * 100%)); border-radius: 4px; background: var(--txt); visibility: hidden; }
.wv-rows-wrap.is-placed .wv-bar { visibility: visible; }
.wv-bar.is-open { background: linear-gradient(90deg, var(--txt) 55%, rgba(var(--ink), 0)); }
.wv-bar.is-kids { background: var(--acc); }
.wv-bar b { display: none; }
.wv-now { position: absolute; top: 0; bottom: 0; left: calc(var(--now, 0) * 100%); width: 2px; background: var(--acc); visibility: hidden; }
.wv-rows-wrap.is-placed .wv-now { visibility: visible; }
.wv-now-all { display: none; }
.wv-now-l { margin: 10px 0 0; font: 500 10px var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--acc); }
.wv-air-src { margin: 14px 0 0; font-size: 13px; line-height: 1.5; color: var(--mut); }

/* ——— A chapter: its name and what it explains, then its frames — sideways on a phone, a grid from a tablet. ——— */
.wv-list { padding-top: 8px; }
.wv-ch { max-width: 1600px; margin: 0 auto; padding: 56px var(--wv-pad) 0; }
.wv-ch-row { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.wv-ch-head h2 { font-size: clamp(28px, 3.2vw, 44px); font-weight: 400; letter-spacing: -.045em; line-height: 1.02; }
.wv-ch-row span { flex: none; font: 500 11px var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--mut); }
.wv-ch-line { margin: 8px 0 0; max-width: 34ch; font-size: 14px; line-height: 1.45; color: var(--txt2); }
.wv-ch-line:empty { display: none; }
.wv-cards { display: flex; gap: 12px; margin: 16px calc(var(--wv-pad) * -1) 0; padding: 0 var(--wv-pad) 4px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0 var(--wv-pad); scrollbar-width: none; }
.wv-cards::-webkit-scrollbar { display: none; }
.wv-card { position: relative; flex: none; width: min(300px, 82vw); scroll-snap-align: start; display: flex; flex-direction: column; gap: 10px; }

/* The frame. The chapter sets the light: television violet, home amber, sea slate, town green. */
.g-tv { --g1: #2C2560; --g2: #0F0D1C; --glow: rgba(183, 174, 255, .34); }
.g-home { --g1: #4D2F1A; --g2: #140D08; --glow: rgba(255, 186, 120, .26); }
.g-sea { --g1: #22383F; --g2: #0A1013; --glow: rgba(170, 210, 222, .22); }
.g-town { --g1: #2C3B25; --g2: #0D120B; --glow: rgba(190, 222, 160, .2); }
.wv-f { container-type: inline-size; position: relative; display: block; aspect-ratio: 16 / 10.5; border-radius: 6px; overflow: hidden; color: #F2F0EB; background: radial-gradient(85% 75% at 28% 18%, var(--glow, rgba(183, 174, 255, .3)), transparent 62%), linear-gradient(160deg, var(--g1, #2C2560), var(--g2, #0F0D1C)); transition: transform .35s cubic-bezier(.2, .8, .2, 1), box-shadow .35s; }
a.wv-f:hover { color: #F2F0EB; transform: translateY(-4px); box-shadow: 0 18px 40px -18px rgba(0, 0, 0, .55); }
a.wv-f:focus-visible { outline: 2px solid var(--acc); outline-offset: 3px; }
.wv-k { position: absolute; z-index: 3; top: 14px; left: 16px; right: 104px; font: 500 10px var(--mono); letter-spacing: .1em; text-transform: uppercase; color: rgba(242, 240, 235, .66); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wv-bug { position: absolute; z-index: 3; top: 11px; right: 14px; font-size: 13px; font-weight: 600; letter-spacing: -.01em; color: rgba(255, 255, 255, .6); }
.wv-live { position: absolute; z-index: 3; top: 11px; left: 14px; display: inline-flex; align-items: center; gap: 5px; padding: 2px 8px 2px 7px; border-radius: 999px; background: #E03131; font: 600 10px var(--mono); letter-spacing: .08em; text-transform: uppercase; color: #FFFFFF; }
.wv-live::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: #FFFFFF; }
.wv-live + .wv-k { left: 98px; }
.wv-n { position: absolute; z-index: 2; top: 36px; left: 16px; right: 16px; font-size: clamp(22px, 10cqi, 40px); font-weight: 500; letter-spacing: -.05em; line-height: .95; text-wrap: balance; hyphens: auto; }
.wv-sub { position: absolute; z-index: 2; left: 50%; bottom: 14px; width: 90%; transform: translateX(-50%); text-align: center; }
.wv-sub b { display: inline; padding: 2px 8px; border-radius: 3px; background: #000; font-size: clamp(13px, 5.4cqi, 18px); font-weight: 500; line-height: 1.6; color: #FFFFFF; overflow-wrap: anywhere; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.wv-sub span { display: block; margin-top: 5px; font-size: clamp(11.5px, 4.2cqi, 13.5px); line-height: 1.3; color: rgba(242, 240, 235, .84); }
/* A film is letterboxed: black bars, its credits in the top one, the subtitle above the bottom one. */
.wv-f.film::before, .wv-f.film::after { content: ""; position: absolute; z-index: 1; left: 0; right: 0; height: 12%; background: #000; }
.wv-f.film::before { top: 0; }
.wv-f.film::after { bottom: 0; }
.wv-f.film .wv-k { top: 3.6%; }
.wv-f.film .wv-n { top: 18%; }
.wv-f.film .wv-sub { bottom: 15%; }
.wv-q { margin: 0; font-size: 19px; font-weight: 400; letter-spacing: -.02em; line-height: 1.2; text-wrap: balance; transition: color .2s; }
.wv-q:hover { color: var(--acc); }
.wv-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; min-height: 32px; font-size: 13px; color: var(--mut); }
.wv-meta .on { color: var(--acc); font-weight: 500; }
.wv-meta .x-fav { margin-left: auto; }
.wv-age { display: inline-grid; place-items: center; min-width: 24px; height: 20px; padding: 0 5px; border: 1px solid rgba(var(--ink), .28); border-radius: 999px; font: 500 10px var(--mono); color: var(--txt2); }
.wv-then { display: none; }

/* The country's memory — water, war, the disasters it still talks about: its frames on their own dark band — the chapter that is a cinema. */
.wv-ch[data-gally-group-key="Память страны"] { max-width: none; margin-top: 56px; padding-top: 40px; padding-bottom: 44px; background: var(--wv-dark); color: var(--wv-on-dark); }
.wv-ch[data-gally-group-key="Память страны"] > * { max-width: calc(1600px - 2 * var(--wv-pad)); margin-left: auto; margin-right: auto; }
.wv-ch[data-gally-group-key="Память страны"] .wv-cards { margin-left: calc(var(--wv-pad) * -1); margin-right: calc(var(--wv-pad) * -1); }
.wv-ch[data-gally-group-key="Память страны"] .wv-ch-row span,
.wv-ch[data-gally-group-key="Память страны"] .wv-meta { color: var(--wv-on-dark3); }
.wv-ch[data-gally-group-key="Память страны"] .wv-ch-line { color: var(--wv-on-dark2); }
.wv-ch[data-gally-group-key="Память страны"] .wv-q:hover,
.wv-ch[data-gally-group-key="Память страны"] .wv-meta .on { color: var(--wv-lilac); }
.wv-ch[data-gally-group-key="Память страны"] .wv-age { border-color: rgba(242, 240, 235, .3); color: var(--wv-on-dark2); }
.wv-ch[data-gally-group-key="Память страны"] .x-fav.is-small { background: rgba(242, 240, 235, .08); color: var(--wv-on-dark3); }
.wv-ch[data-gally-group-key="Память страны"] .x-fav.is-small:hover { color: var(--wv-on-dark); }
.wv-ch[data-gally-group-key="Память страны"] .x-fav.is-small[aria-pressed="true"] { color: var(--wv-lilac); background: rgba(183, 174, 255, .16); }
.wv-ch[data-gally-group-key="Память страны"] .wv-card:first-child .wv-then { display: block; padding: 14px 16px; border-radius: 6px; background: rgba(242, 240, 235, .07); font-size: 14px; line-height: 1.4; color: var(--wv-on-dark2); transition: background .2s; }
.wv-then b { display: block; font-size: 17px; font-weight: 500; color: var(--wv-on-dark); transition: color .2s; }
.wv-then:hover { background: rgba(242, 240, 235, .11); }
.wv-then:hover b { color: var(--wv-lilac); }
.wv-then .mono { display: block; margin-bottom: 4px; }

/* ——— Classics everyone quotes but nobody streams now: words only, no frame — nothing to press «play» on. ——— */
.wv-quiet { padding-top: 56px; }
.wv-quiet h2 { font-size: clamp(28px, 3.2vw, 44px); font-weight: 400; letter-spacing: -.045em; line-height: 1.02; }
.wv-quiet-head p { margin: 8px 0 0; max-width: 30ch; font-size: 14px; line-height: 1.45; color: var(--txt2); }
.wv-quiet ol { list-style: none; margin: 16px 0 0; padding: 0; border-top: 1px solid rgba(var(--ink), .12); }
.wv-quiet li { padding: 16px 0; border-bottom: 1px solid rgba(var(--ink), .12); }
.wv-quiet-n { display: block; font-size: 24px; font-weight: 500; letter-spacing: -.035em; line-height: 1.05; transition: color .2s; }
.wv-quiet li a:hover .wv-quiet-n { color: var(--acc); }
.wv-quiet-n small { display: block; margin-top: 6px; font: 500 10px var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--mut); }
.wv-quiet-why { display: block; margin-top: 8px; font-size: 15px; line-height: 1.45; color: var(--txt2); }
.wv-quiet-why b { font-weight: 500; color: var(--txt); }
.wv-quiet-st { display: block; margin-top: 6px; font-size: 13px; line-height: 1.4; color: var(--mut); }

/* ——— How to watch: the price list beside the one habit that teaches the ear. ——— */
.wv-how { padding-top: 56px; }
.wv-how h2 { margin-top: 12px; font-size: clamp(26px, 2.6vw, 34px); font-weight: 400; letter-spacing: -.035em; line-height: 1.1; }
.wv-svcs { list-style: none; margin: 16px 0 0; padding: 0; border-top: 1px solid rgba(var(--ink), .12); }
.wv-svcs a { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; gap: 4px 12px; padding: 14px 0; border-bottom: 1px solid rgba(var(--ink), .12); }
.wv-svc { font-size: 19px; letter-spacing: -.02em; transition: color .2s; }
.wv-svc small { display: block; margin-top: 2px; font-size: 13px; letter-spacing: 0; color: var(--mut); }
.wv-svcs a:hover .wv-svc { color: var(--acc); }
.wv-price { justify-self: end; font-size: 15px; font-weight: 500; white-space: nowrap; }
.wv-price.free { color: var(--acc); }
.wv-cnt { display: none; font: 500 12px var(--mono); color: var(--mut); }
.wv-sbt { margin-top: 20px; padding: 20px; border-radius: 6px; background: var(--wv-dark); color: var(--wv-on-dark); }
.wv-sbt .mono { color: var(--wv-on-dark3); }
.wv-sbt ol { list-style: none; margin: 14px 0 0; padding: 0; counter-reset: s; }
.wv-sbt li { position: relative; padding: 0 0 12px 34px; font-size: 15px; line-height: 1.5; color: var(--wv-on-dark2); counter-increment: s; }
.wv-sbt li::before { content: counter(s); position: absolute; left: 0; top: 0; width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; background: rgba(242, 240, 235, .1); font: 500 11px var(--mono); color: var(--wv-on-dark); }
.wv-sbt li b { font-weight: 500; color: #FFFFFF; }
.wv-k888 { display: inline-block; padding: 1px 6px; border-radius: 3px; background: rgba(255, 255, 255, .12); font: 500 13px var(--mono); color: #FFFFFF; }
.wv-sbt p:not(.mono) { margin: 4px 0 0; padding-top: 14px; border-top: 1px solid rgba(242, 240, 235, .14); font-size: 14px; line-height: 1.5; color: var(--wv-on-dark3); }

/* ——— On the big screen: the film festivals of the afisha, from the festivals' own list, and the film museum. ——— */
.wv-fest { padding-top: 56px; }
.wv-fest h2 { margin-top: 12px; font-size: clamp(26px, 2.6vw, 34px); font-weight: 400; letter-spacing: -.035em; line-height: 1.1; }
.wv-fest-rows { margin-top: 16px; border-top: 1px solid rgba(var(--ink), .12); }
.wv-fest ol { list-style: none; margin: 0; padding: 0; }
.wv-fest li a { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 16px; align-items: baseline; padding: 16px 0; border-bottom: 1px solid rgba(var(--ink), .12); }
.wv-fest-n { font-size: 20px; letter-spacing: -.025em; line-height: 1.15; transition: color .2s; }
.wv-fest-n small { display: block; margin-top: 4px; font-size: 13px; letter-spacing: 0; line-height: 1.4; color: var(--mut); }
.wv-fest li a:hover .wv-fest-n { color: var(--acc); }
.wv-fest-w { display: none; font-size: 15px; color: var(--txt2); }
.wv-fest-d { justify-self: end; font: 500 11px var(--mono); letter-spacing: .06em; text-transform: uppercase; color: var(--acc); white-space: nowrap; }
.wv-none { padding-top: 32px; font-size: 16px; color: var(--txt2); }
.wv-checked { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: baseline; padding: 40px 0 48px; font-size: 13px; line-height: 1.5; color: var(--mut); }

/* ═══ The title's page ═══ */
.wv-top { padding-top: 20px; padding-bottom: 40px; display: grid; grid-template-columns: minmax(0, 1fr); }
.wv-crumbs { display: flex; flex-wrap: wrap; gap: 8px; color: var(--wv-on-dark3); }
.wv-crumbs a { color: var(--wv-on-dark3); }
.wv-head { padding-top: 24px; }
.wv-title { margin: 12px 0 0; font-size: clamp(48px, 9vw, 120px); font-weight: 500; letter-spacing: -.055em; line-height: .9; text-wrap: balance; hyphens: auto; }
.wv-title small { display: block; margin-top: 12px; font-size: clamp(20px, 2.2vw, 30px); font-weight: 300; letter-spacing: -.02em; line-height: 1.15; color: var(--wv-on-dark3); }
.wv-ask { margin: 18px 0 0; max-width: 24ch; font-size: clamp(24px, 3vw, 40px); font-weight: 400; letter-spacing: -.035em; line-height: 1.1; color: var(--wv-lilac); text-wrap: balance; }
.wv-screen { margin-top: 28px; }
.wv-screen .wv-f { aspect-ratio: 16 / 9; }
.wv-screen .wv-f.film::before, .wv-screen .wv-f.film::after { height: 10%; }
.wv-screen .wv-f.film .wv-k { top: 3%; }
.wv-screen .wv-sub { bottom: 14%; }
.wv-screen .wv-f:not(.film) .wv-sub { bottom: 8%; }
.wv-screen .wv-sub b { font-size: clamp(16px, 3.4cqi, 26px); }
.wv-screen .wv-sub span { font-size: clamp(13px, 2.2cqi, 17px); }
.wv-play { position: absolute; z-index: 3; left: 50%; top: 44%; transform: translate(-50%, -50%); display: flex; align-items: center; gap: 12px; padding: 10px 18px 10px 10px; border-radius: 999px; background: #F2F0EB; color: #121211; font-size: 15px; font-weight: 500; white-space: nowrap; transition: background .2s, color .2s; }
.wv-play i { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; background: #121211; }
.wv-play i::before { content: ""; margin-left: 3px; border-left: 10px solid #F2F0EB; border-top: 6px solid transparent; border-bottom: 6px solid transparent; }
a.wv-f:hover .wv-play { background: var(--wv-lilac); }
.wv-screen a.wv-f:hover { transform: none; box-shadow: none; }
.wv-screen iframe { position: absolute; inset: 0; z-index: 4; width: 100%; height: 100%; border: 0; background: #000; }
.wv-cap { margin: 10px 0 0; font-size: 13px; color: var(--wv-on-dark3); }

/* The ticket: what the visitor came for — where, free or not, dated — and what decides the evening. */
.wv-ticket { margin-top: 28px; padding: 22px; border-radius: 6px; background: #F2F0EB; color: #121211; }
.wv-ticket .mono { color: #5F5B55; }
.wv-free { margin: 12px 0 0; font-size: clamp(36px, 4vw, 48px); font-weight: 500; letter-spacing: -.045em; line-height: 1; }
.wv-free small { display: block; margin-top: 8px; font-size: 16px; font-weight: 400; letter-spacing: -.01em; line-height: 1.35; color: #45423D; }
.wv-go { margin-top: 20px; height: 50px; display: flex; align-items: center; justify-content: center; gap: 8px; padding: 0 16px; border-radius: 25px; background: #121211; color: #F2F0EB; font-size: 16px; font-weight: 500; text-align: center; transition: background .2s, color .2s; }
.wv-go:hover, .wv-dark .wv-go:hover { background: #6857E8; color: #FFFFFF; }
.wv-none { margin: 12px 0 0; font-size: 15px; line-height: 1.45; color: #45423D; }
.wv-dl { margin: 22px 0 0; border-top: 1px solid rgba(18, 18, 17, .1); }
.wv-dl div { display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: 14px; padding: 12px 0; border-bottom: 1px solid rgba(18, 18, 17, .1); font-size: 15px; line-height: 1.45; }
.wv-dl dt { color: #5F5B55; }
.wv-dl dd { margin: 0; }
.wv-dl dd small { display: block; margin-top: 2px; font-size: 13px; color: #5F5B55; }
.wv-ticket .wv-age { margin-right: 8px; border-color: rgba(18, 18, 17, .3); color: #121211; vertical-align: 1px; }
.wv-keep { width: 100%; margin-top: 16px; display: flex; align-items: center; justify-content: center; gap: 8px; height: 44px; border-radius: 22px; box-shadow: inset 0 0 0 1px rgba(18, 18, 17, .18); font-size: 15px; font-weight: 500; color: #45423D; transition: color .2s, box-shadow .2s, background .2s; }
.wv-keep svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.wv-keep:hover { color: #6857E8; box-shadow: inset 0 0 0 1px #6857E8; }
.wv-keep .on, .wv-keep[aria-pressed="true"] .off { display: none; }
.wv-keep[aria-pressed="true"] .on { display: inline; }
.wv-keep[aria-pressed="true"] { color: #6857E8; background: rgba(104, 87, 232, .08); box-shadow: inset 0 0 0 1px rgba(104, 87, 232, .4); }
.wv-keep[aria-pressed="true"] svg { fill: currentColor; }

.wv-sec { padding-top: 56px; }
.wv-sec h2 { margin-top: 12px; font-size: clamp(26px, 2.6vw, 34px); font-weight: 400; letter-spacing: -.035em; line-height: 1.1; text-wrap: balance; }
.wv-sec-body { margin-top: 18px; }
.wv-why p { margin: 0; max-width: 62ch; font-size: 17px; line-height: 1.65; color: var(--txt2); }
.wv-why p + p { margin-top: 16px; }
.wv-why p:first-child { max-width: 46ch; font-size: clamp(19px, 1.8vw, 25px); line-height: 1.42; letter-spacing: -.015em; color: var(--txt); }

/* Five words before the film: the title's own word alone and big, the other four under it — none is ever cut. */
.wv-words { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid rgba(var(--ink), .14); }
.wv-words li { padding: 18px 16px 18px 0; border-bottom: 1px solid rgba(var(--ink), .1); }
.wv-words li:nth-child(odd):not(:first-child) { padding-left: 16px; border-left: 1px solid rgba(var(--ink), .1); }
.wv-words li:first-child { grid-column: 1 / -1; padding: 22px 0 24px; border-bottom: 1px solid rgba(var(--ink), .14); }
.wv-words b { display: block; font-size: 22px; font-weight: 500; letter-spacing: -.03em; line-height: 1.1; hyphens: auto; }
.wv-words li:first-child b { font-size: clamp(34px, 5vw, 64px); letter-spacing: -.05em; color: var(--acc); overflow-wrap: anywhere; }
.wv-words span { display: block; margin-top: 8px; font-size: 14px; line-height: 1.45; color: var(--txt2); }
.wv-words li:first-child span { max-width: 30ch; font-size: 16px; }

.wv-learn { list-style: none; margin: 0; padding: 0; counter-reset: l; border-top: 1px solid rgba(var(--ink), .14); }
.wv-learn li { padding: 18px 0; border-bottom: 1px solid rgba(var(--ink), .1); font-size: 17px; line-height: 1.45; counter-increment: l; }
.wv-learn li::before { content: "0" counter(l); display: block; margin-bottom: 10px; font: 500 12px var(--mono); letter-spacing: .08em; color: var(--acc); }

.wv-nums { padding-top: 56px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 0; }
.wv-nums > div { padding-right: 16px; }
.wv-nums > div:nth-child(even) { padding-left: 16px; border-left: 1px solid rgba(var(--ink), .14); }
.wv-nums b { display: block; white-space: nowrap; font-size: clamp(40px, 5.4vw, 76px); font-weight: 300; letter-spacing: -.055em; line-height: .9; }
.wv-nums p { margin: 12px 0 0; max-width: 26ch; font-size: 15px; line-height: 1.45; color: var(--txt2); }
.wv-nums small { display: block; margin-top: 8px; font: 500 11px var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--mut); }

/* After the film: what to say on Monday, set as the film's own subtitles — the page's one bold move. */
.wv-say { margin-top: 64px; }
.wv-say-in { padding-top: 48px; padding-bottom: 56px; text-align: center; }
.wv-say h2 { margin-top: 12px; font-size: clamp(26px, 2.6vw, 34px); font-weight: 400; letter-spacing: -.035em; color: var(--wv-on-dark); }
.wv-lines { list-style: none; margin: 32px 0 0; padding: 0; display: grid; gap: 32px; }
.wv-lines li { max-width: 900px; margin: 0 auto; text-wrap: balance; }
.wv-lines .who { display: block; margin-bottom: 12px; font: 500 11px var(--mono); letter-spacing: .1em; text-transform: uppercase; color: var(--wv-on-dark3); }
.wv-lines b { display: inline; padding: 4px 12px; border-radius: 4px; background: #000; font-size: clamp(20px, 2.6vw, 34px); font-weight: 500; letter-spacing: -.02em; line-height: 1.55; color: #FFFFFF; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.wv-lines .ru { display: block; margin-top: 12px; font-size: clamp(15px, 1.5vw, 19px); line-height: 1.45; color: var(--wv-on-dark2); }

.wv-trip { padding-top: 64px; display: grid; gap: 24px; align-items: center; }
.wv-trip img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 6px; }
.wv-trip h2 { margin-top: 12px; font-size: clamp(34px, 4vw, 56px); font-weight: 500; letter-spacing: -.045em; line-height: 1; }
.wv-trip h2 a:hover { color: var(--acc); }
.wv-trip-what { margin: 16px 0 0; max-width: 44ch; font-size: 17px; line-height: 1.6; color: var(--txt2); }
.wv-facts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
.wv-facts span { padding: 7px 12px; border-radius: 999px; background: var(--s1); font-size: 14px; color: var(--txt2); box-shadow: inset 0 0 0 1px rgba(var(--ink), .08); }
.wv-more { display: inline-block; margin-top: 22px; font-size: 16px; font-weight: 500; color: var(--acc); }
.wv-more:hover { text-decoration: underline; text-underline-offset: 3px; }
.wv-credit { margin: 8px 0 0; font-size: 12px; color: var(--mut); }
/* «О чём» and who made it: the plot in the page's voice, the credits quieter, both after the reason to watch. */
.wv-plot { margin: 24px 0 0; max-width: 62ch; font-size: 16px; line-height: 1.6; color: var(--txt2); }
.wv-plot b { font-weight: 600; color: var(--txt); }
.wv-credits { margin: 12px 0 0; max-width: 62ch; font-size: 14px; line-height: 1.55; color: var(--mut); }
.wv-canon { margin: 16px 0 0; font-size: 15px; line-height: 1.5; color: var(--mut); }
.wv-canon a, .wv-src li a { color: var(--txt2); border-bottom: 1px solid rgba(var(--ink), .25); transition: color .2s, border-color .2s; }
.wv-canon a:hover, .wv-src li a:hover { color: var(--acc); border-color: var(--acc); }

.wv-next { padding-top: 64px; }
.wv-next-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px 16px; }
.wv-next-head h2 { margin-top: 12px; font-size: clamp(26px, 2.6vw, 34px); font-weight: 400; letter-spacing: -.035em; }
.wv-next-head > a { font-size: 16px; font-weight: 500; color: var(--acc); }
.wv-next-head > a:hover { text-decoration: underline; text-underline-offset: 3px; }

.wv-src { margin-top: 64px; padding: 28px 0 56px; border-top: 1px solid rgba(var(--ink), .12); display: grid; gap: 16px; }
.wv-src p:not(.eyebrow) { margin: 10px 0 0; max-width: 34ch; font-size: 14px; line-height: 1.5; color: var(--mut); }
.wv-src ul { list-style: none; margin: 0; padding: 0; font-size: 15px; line-height: 1.5; }
.wv-src li { break-inside: avoid; padding: 0 0 12px; color: var(--mut); }

/* ——— Tablet ——— */
@media (min-width: 768px) {
  .wv { --wv-pad: 32px; }
  .wv-hero-in { padding-top: 56px; padding-bottom: 28px; }
  .wv-line { margin-top: 64px; }
  .wv-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 20px; margin: 24px 0 0; padding: 0; overflow: visible; }
  .wv-card { width: auto; gap: 12px; }
  .wv-k { top: 16px; left: 20px; right: 116px; font-size: 11px; }
  .wv-n { top: 44px; left: 20px; right: 20px; }
  .wv-bug { top: 14px; right: 18px; font-size: 14px; }
  .wv-live { top: 14px; left: 18px; font-size: 11px; }
  .wv-live + .wv-k { left: 118px; }
  .wv-q { font-size: 21px; }
  .wv-meta { font-size: 14px; }
  .wv-ch[data-gally-group-key="Память страны"] .wv-cards { margin-left: 0; margin-right: 0; }
  .wv-quiet li { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: 4px 28px; align-items: baseline; }
  .wv-quiet-st { grid-column: 2; }
  .wv-svcs a { grid-template-columns: minmax(0, 1fr) 180px 80px; }
  .wv-cnt { display: block; justify-self: end; }
  .wv-fest li a { grid-template-columns: minmax(0, 1fr) 140px auto; }
  .wv-fest-w { display: block; }
  .wv-words { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .wv-words li { padding: 22px 20px 0 0; border-bottom: 0; }
  .wv-words li:nth-child(odd):not(:first-child) { padding-left: 0; border-left: 0; }
  .wv-words li:nth-child(n+3) { padding-left: 20px; border-left: 1px solid rgba(var(--ink), .14); }
  .wv-words li:first-child { display: flex; align-items: baseline; gap: 28px; }
  .wv-words li:first-child span { margin: 0; }
  .wv-learn { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-bottom: 0; }
  .wv-learn li { padding: 22px 24px 0 0; border-bottom: 0; }
  .wv-learn li + li { padding-left: 24px; border-left: 1px solid rgba(var(--ink), .14); }
  .wv-nums { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .wv-nums > div { padding: 0 24px 0 0; }
  .wv-nums > div + div { padding-left: 24px; border-left: 1px solid rgba(var(--ink), .14); }
  .wv-trip { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 40px; }
  .wv-src ul { columns: 2; column-gap: 32px; }
}

/* ——— Laptop and up: the board's composition ——— */
@media (min-width: 1100px) {
  .wv { --wv-pad: 40px; }
  .wv-hero-in { min-height: 660px; padding-top: 72px; padding-bottom: 0; grid-template-rows: auto 1fr auto; }
  .wv-h1 { margin-top: 22px; }
  .wv-lead { margin-top: 26px; }
  .wv-line { align-self: end; margin: 0; padding: 64px 0 40px; }
  .wv-line .mono { margin-bottom: 20px; font-size: 12px; }
  .wv-nl { padding: 6px 18px; border-radius: 4px; }
  .wv-ru { margin-top: 16px; }
  .wv-scrub { margin: 0 0 28px; }
  .wv-pick { padding-top: 56px; }
  .wv-pick .bar { margin-top: 28px; }
  .wv-tip { margin-top: 22px; font-size: 17px; }
  .wv-air { padding-top: 104px; }
  .wv-air-head { display: grid; grid-template-columns: minmax(0, 1fr) 400px; gap: 56px; align-items: end; margin-bottom: 40px; }
  .wv-air-head h2 { margin-top: 16px; }
  .wv-air-note { margin: 0; font-size: 16px; }
  .wv-scale { display: block; position: relative; height: 28px; margin: 0 0 0 340px; padding: 0; font-size: 11px; }
  .wv-scale span { position: absolute; top: 0; height: 28px; padding-left: 8px; }
  .wv-scale span + span { border-left: 1px solid rgba(var(--ink), .14); }
  .wv-scale span:nth-child(1) { left: 0; }
  .wv-scale span:nth-child(2) { left: var(--m2, 33.3%); }
  .wv-scale span:nth-child(3) { left: var(--m3, 66.6%); }
  .wv-row { display: grid; grid-template-columns: 340px minmax(0, 1fr); align-items: center; min-height: 92px; padding: 0; }
  .wv-rn { padding-right: 24px; font-size: 26px; font-weight: 400; letter-spacing: -.03em; line-height: 1.1; }
  .wv-rn small { margin-top: 6px; font-size: 14px; }
  .wv-rn .wv-when { display: none; }
  .wv-rn .wv-rsub { display: block; }
  .wv-track { height: 92px; margin: 0; background: none; }
  .wv-bar { top: 54px; bottom: auto; height: 10px; border-radius: 5px; }
  .wv-bar b { display: block; position: absolute; left: 0; bottom: 18px; font-size: 15px; font-weight: 500; white-space: nowrap; color: var(--txt); }
  .wv-bar.is-end b { left: auto; right: 0; }
  .wv-onair { margin-left: 10px; padding: 3px 9px; font-size: 11px; vertical-align: 5px; }
  .wv-now-all { display: block; top: 0; bottom: -30px; left: calc(340px + (100% - 340px) * var(--now, 0)); margin-left: -1px; }
  .wv-now-all::after { content: attr(data-label); position: absolute; bottom: 0; left: 10px; white-space: nowrap; font: 500 11px var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--acc); }
  .wv-now-l { display: none; }
  .wv-air-src { margin: 44px 0 0 340px; font-size: 14px; }
  .wv-track .wv-now { display: none; }

  .wv-ch { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 40px; padding-top: 120px; }
  .wv-ch-head { align-self: start; position: sticky; top: 96px; display: flex; flex-direction: column; }
  .wv-ch-row { display: contents; }
  .wv-ch-row span { order: 3; display: block; margin-top: 14px; }
  .wv-ch-line { margin-top: 16px; max-width: 24ch; font-size: 16px; line-height: 1.5; }
  .wv-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px 20px; margin: 0; }
  .wv-f { aspect-ratio: 16 / 10.5; }
  .wv-n { font-size: clamp(24px, 9.2cqi, 40px); }
  .wv-q { font-size: 22px; }
  /* Home: one big frame first, the rest beside and under it — a different rhythm from the rows above. */
  .wv-ch[data-gally-group-key="Дом и школа"] .wv-card:first-child { grid-column: span 2; grid-row: span 2; }
  .wv-ch[data-gally-group-key="Дом и школа"] .wv-card:first-child .wv-f { aspect-ratio: 16 / 9; }
  .wv-ch[data-gally-group-key="Дом и школа"] .wv-card:first-child .wv-n { font-size: clamp(40px, 8cqi, 64px); }
  .wv-ch[data-gally-group-key="Дом и школа"] .wv-card:first-child .wv-sub b { font-size: 22px; }
  .wv-ch[data-gally-group-key="Дом и школа"] .wv-card:first-child .wv-q { font-size: 28px; }
  .wv-ch[data-gally-group-key="Дом и школа"] .wv-cards { grid-auto-flow: dense; }
  /* The country's memory — water, war, the disasters it still talks about: the first film as wide as the cinema, the rest in a row under it. */
  .wv-ch[data-gally-group-key="Память страны"] { margin-top: 120px; padding: 96px max(var(--wv-pad), calc((100% - 1600px) / 2 + var(--wv-pad))) 104px; }
  .wv-ch[data-gally-group-key="Память страны"] > * { max-width: none; margin: 0; }
  .wv-ch[data-gally-group-key="Память страны"] .wv-card:first-child { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 18px 24px; align-items: end; margin-bottom: 24px; }
  .wv-ch[data-gally-group-key="Память страны"] .wv-card:first-child .wv-f { grid-column: 1 / -1; aspect-ratio: 2.1 / 1; }
  .wv-ch[data-gally-group-key="Память страны"] .wv-card:first-child .wv-f.film::before,
  .wv-ch[data-gally-group-key="Память страны"] .wv-card:first-child .wv-f.film::after { height: 9%; }
  .wv-ch[data-gally-group-key="Память страны"] .wv-card:first-child .wv-f.film .wv-k { top: 2.6%; }
  .wv-ch[data-gally-group-key="Память страны"] .wv-card:first-child .wv-n { top: 15%; left: 40px; font-size: clamp(56px, 9cqi, 104px); }
  .wv-ch[data-gally-group-key="Память страны"] .wv-card:first-child .wv-sub { bottom: 13%; }
  .wv-ch[data-gally-group-key="Память страны"] .wv-card:first-child .wv-sub b { font-size: 26px; }
  .wv-ch[data-gally-group-key="Память страны"] .wv-card:first-child .wv-sub span { font-size: 17px; }
  .wv-ch[data-gally-group-key="Память страны"] .wv-card:first-child .wv-q { grid-column: 1; font-size: 34px; max-width: 26ch; }
  .wv-ch[data-gally-group-key="Память страны"] .wv-card:first-child .wv-meta { grid-column: 1; }
  .wv-ch[data-gally-group-key="Память страны"] .wv-card:first-child .wv-then { grid-column: 2; grid-row: 2 / span 2; align-self: end; padding: 16px 20px; font-size: 15px; }
  .wv-ch[data-gally-group-key="Память страны"] .wv-card:first-child .wv-then b { font-size: 19px; }
  /* Town: two to a row, the names larger. */
  .wv-ch[data-gally-group-key="Город и провинция"] .wv-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wv-ch[data-gally-group-key="Город и провинция"] .wv-n { font-size: clamp(30px, 8cqi, 52px); }

  .wv-quiet { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 40px; padding-top: 120px; }
  .wv-quiet-head p { margin-top: 16px; max-width: 24ch; font-size: 16px; line-height: 1.5; }
  .wv-quiet ol { margin: 0; }
  .wv-quiet li { grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr) 220px; gap: 32px; padding: 24px 0; }
  .wv-quiet-n { font-size: 34px; letter-spacing: -.04em; line-height: 1; }
  .wv-quiet-n small { margin-top: 8px; font-size: 11px; }
  .wv-quiet-why { margin: 0; font-size: 17px; line-height: 1.5; }
  .wv-quiet-st { grid-column: auto; justify-self: end; margin: 0; font-size: 14px; text-align: right; }

  .wv-how { display: grid; grid-template-columns: 300px minmax(0, 1fr) 420px; gap: 40px 48px; padding-top: 120px; align-items: start; }
  .wv-how h2 { margin-top: 16px; }
  .wv-svcs { margin: 0; }
  .wv-svcs a { grid-template-columns: minmax(0, 1fr) 200px 90px; gap: 20px; padding: 20px 0; }
  .wv-svc { font-size: 24px; letter-spacing: -.025em; }
  .wv-svc small { margin-top: 4px; font-size: 14px; }
  .wv-price { justify-self: start; font-size: 16px; }
  .wv-sbt { margin: 0; padding: 28px 28px 30px; }
  .wv-sbt ol { margin-top: 18px; }
  .wv-sbt li { padding: 0 0 16px 40px; font-size: 16px; }
  .wv-sbt li::before { width: 26px; height: 26px; font-size: 12px; }
  .wv-sbt p:not(.mono) { margin-top: 6px; padding-top: 16px; font-size: 15px; }

  .wv-fest { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 40px; padding-top: 104px; }
  .wv-fest h2 { margin-top: 16px; }
  .wv-fest-rows { margin: 0; }
  .wv-fest li a { grid-template-columns: minmax(0, 1fr) 200px 220px; gap: 24px; padding: 20px 0; }
  .wv-fest-n { font-size: 24px; }
  .wv-fest-n small { font-size: 14px; }
  .wv-fest-d { font-size: 12px; }
  .wv-none { padding-top: 32px; font-size: 16px; color: var(--txt2); }
.wv-checked { padding: 64px 0 72px; font-size: 14px; }

  /* The title's page on a laptop: the hall left, the ticket right. */
  .wv-top { grid-template-columns: minmax(0, 1fr) 400px; column-gap: 56px; padding-top: 32px; padding-bottom: 88px; }
  .wv-crumbs { grid-column: 1 / -1; }
  .wv-head { grid-column: 1; padding-top: 36px; }
  .wv-title { margin-top: 16px; }
  .wv-title small { display: inline-block; margin: 0 0 0 22px; vertical-align: .55em; }
  .wv-ask { margin-top: 22px; }
  .wv-screen { grid-column: 1; margin-top: 44px; }
  .wv-screen .wv-f { aspect-ratio: 2.2 / 1; }
  .wv-play { gap: 14px; padding: 14px 24px 14px 16px; font-size: 16px; }
  .wv-play i { width: 36px; height: 36px; }
  .wv-play i::before { border-left-width: 11px; border-top-width: 7px; border-bottom-width: 7px; }
  .wv-cap { margin-top: 12px; font-size: 14px; }
  .wv-ticket { grid-column: 2; grid-row: 2 / span 2; align-self: start; margin-top: 40px; padding: 28px; position: sticky; top: 96px; }
  .wv-sec { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 40px; padding-top: 104px; }
  .wv-sec h2 { margin-top: 14px; }
  .wv-sec-body { margin: 0; }
  .wv-why p { font-size: 18px; }
  .wv-words b { font-size: 28px; letter-spacing: -.035em; }
  .wv-words span { font-size: 15px; }
  .wv-words li:first-child span { font-size: 17px; }
  .wv-learn li { font-size: 18px; }
  .wv-nums { padding-top: 104px; }
  .wv-nums p { margin-top: 16px; font-size: 16px; }
  .wv-say { margin-top: 112px; }
  .wv-say-in { padding-top: 88px; padding-bottom: 96px; }
  .wv-lines { margin-top: 48px; gap: 40px; }
  .wv-trip { padding-top: 112px; gap: 56px; }
  .wv-trip-what { margin-top: 20px; font-size: 18px; }
  .wv-next { padding-top: 112px; }
  .wv-next .wv-cards { margin-top: 28px; }
  .wv-src { grid-template-columns: 300px minmax(0, 1fr); gap: 40px; margin-top: 112px; padding: 32px 0 88px; }
  .wv-src ul { column-gap: 40px; }
}

@media (prefers-reduced-motion: reduce) {
  .wv-scrub i { animation: none; }
  .wv-f, .wv-q, .wv-rn, .wv-svc, .wv-fest-n, .wv-quiet-n, .wv-then, .wv-then b, .wv-play, .wv-go, .wv-keep { transition: none; }
  a.wv-f:hover { transform: none; }
}
