/* Radio JAZZ — второе обновление: постеры новостей, программа, VU-метры, заставка, внутренние страницы */

/* ---------- Футер: 4 колонки ---------- */
.footer__grid { grid-template-columns: 1.3fr 1fr 1fr 1.1fr; max-width: 900px; }
@media (max-width: 760px) { .footer__grid { grid-template-columns: 1fr 1fr; } }

/* ---------- Курсор-игла над пластинкой ---------- */
.record {
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cpath d='M29 3 L9 23' stroke='%23efe4cf' stroke-width='3' stroke-linecap='round'/%3E%3Cpath d='M29 3 L9 23' stroke='%2315100c' stroke-width='1' stroke-linecap='round' opacity='.4'/%3E%3Crect x='4' y='21' width='8' height='5' rx='1' transform='rotate(-45 8 23.5)' fill='%2315100c' stroke='%23c9a24a'/%3E%3Ccircle cx='3' cy='29' r='1.6' fill='%23c9a24a'/%3E%3C/svg%3E") 3 29, grab;
}
.record.is-dragging { cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cpath d='M29 3 L9 23' stroke='%23c9a24a' stroke-width='3' stroke-linecap='round'/%3E%3Crect x='4' y='21' width='8' height='5' rx='1' transform='rotate(-45 8 23.5)' fill='%2315100c' stroke='%23c9a24a'/%3E%3Ccircle cx='3' cy='29' r='2' fill='%23c4402a'/%3E%3C/svg%3E") 3 29, grabbing; }

/* ---------- Заставка ---------- */
.loader {
  position: fixed; inset: 0; z-index: 200; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 28px;
  background: var(--bg); transition: opacity .6s ease, visibility .6s;
  animation: loaderAuto .6s 3s forwards; /* страховка, если JS не отработал */
}
.loader.is-done { opacity: 0; visibility: hidden; }
.no-intro .loader { display: none; }
@keyframes loaderAuto { to { opacity: 0; visibility: hidden; } }
.loader__deck { position: relative; width: 190px; height: 160px; }
.loader__disc {
  position: absolute; left: 0; top: 0; width: 160px; height: 160px; border-radius: 50%;
  background: radial-gradient(circle, var(--bg) 0 3%, var(--red) 3.5% 30%, #0a0807 31% 33%, transparent 34%), repeating-radial-gradient(circle, #0a0807 0 1.5px, #2c231c 1.5px 3px);
  box-shadow: 0 0 0 2px #6b5640, 0 20px 50px rgba(0, 0, 0, .7);
  animation: spin 1.8s linear infinite;
  display: grid; place-items: center;
}
.loader__disc span { font-family: var(--f-display); font-weight: 700; font-size: 15px; letter-spacing: .12em; color: var(--cream); transform: translateY(-12px); }
.loader__arm { position: absolute; left: 172px; top: 4px; width: 5px; height: 112px; border-radius: 3px; background: linear-gradient(90deg, #b9b09d, #efe7d6, #a59c89); transform-origin: 50% 0; transform: rotate(0deg); animation: armDrop 1s .35s cubic-bezier(.5, 0, .2, 1) forwards; }
.loader__arm::before { content: ''; position: absolute; left: -7px; top: -9px; width: 19px; height: 19px; border-radius: 50%; background: radial-gradient(circle at 35% 35%, #ece4d3, #8f8676); }
.loader__arm::after { content: ''; position: absolute; left: -3px; bottom: -10px; width: 11px; height: 18px; border-radius: 2px; background: #111; }
@keyframes armDrop { to { transform: rotate(24deg); } }
.loader__t { margin: 0; font-family: var(--f-led); font-size: 22px; letter-spacing: .3em; color: var(--led); }
@media (prefers-reduced-motion: reduce) { .loader { display: none; } }

/* ---------- Тост ---------- */
.toast {
  position: fixed; left: 50%; top: 96px; z-index: 120; padding: 12px 22px; background: var(--panel); border: 1px solid var(--led-dim);
  font-family: var(--f-led); font-size: 20px; letter-spacing: .2em; color: var(--led); text-shadow: 0 0 8px rgba(217, 164, 65, .5);
  transform: translate(-50%, -20px); opacity: 0; pointer-events: none; transition: opacity .3s, transform .3s var(--ease);
}
.toast.is-on { opacity: 1; transform: translate(-50%, 0); }

/* ---------- VU-метры ---------- */
.vu-row { display: flex; gap: 16px; margin-top: 24px; }
.vu { flex: 1; max-width: 230px; padding: 7px; background: linear-gradient(180deg, #2a2019, #17110d); border: 1px solid #3a2e22; border-radius: 6px; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06), 0 10px 24px rgba(0, 0, 0, .4); }
.vu svg { display: block; width: 100%; height: auto; border-radius: 3px; }
.vu .needle { transform-origin: 100px 128px; }
.vu__face { transition: filter 1s; filter: brightness(.72) saturate(.8); }
.is-playing .vu__face { filter: none; }
@media (max-width: 560px) { .vu-row { gap: 10px; } }

/* ---------- Программа ---------- */
.schedule { padding-bottom: 88px; }
.sched-nav { display: flex; align-items: center; gap: 10px; }
.sched-note { margin-right: 8px; font-size: 12px; color: var(--muted); }
.sched-btn { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--line-2); background: none; cursor: pointer; transition: border-color .2s, background .2s, color .2s; }
.sched-btn:hover { background: var(--cream); color: var(--ink); border-color: var(--cream); }
.sched-btn svg { width: 18px; height: 18px; }
.sched { overflow-x: auto; scroll-behavior: smooth; scrollbar-width: thin; scrollbar-color: var(--line-2) transparent; padding: 0 max(var(--gutter), calc((100vw - var(--wrap)) / 2)) 18px; }
.sched:focus-visible { outline-offset: -2px; }
.sched__list { position: relative; display: flex; gap: 0; margin: 0; padding: 34px 0 0; list-style: none; width: max-content; }
.sched__hours { position: absolute; left: 0; right: 0; top: 0; height: 24px; display: flex; pointer-events: none; }
.sched__hours span { flex: none; font-family: var(--f-led); font-size: 12px; letter-spacing: .1em; color: var(--muted); border-left: 1px solid var(--line); padding-left: 6px; }
.prog { position: relative; flex: none; display: flex; flex-direction: column; min-height: 168px; padding: 18px 18px 16px; border: 1px solid #3a2e22; border-right: 0; background: var(--bg); overflow: hidden; }
.prog:last-child { border-right: 1px solid #3a2e22; }
.prog__time { font-family: var(--f-led); font-size: 14px; letter-spacing: .08em; color: var(--muted); }
.prog__title { margin: 10px 0 0; font-family: var(--f-display); font-weight: 500; font-size: 22px; line-height: 1.1; text-transform: uppercase; }
.prog__kind { margin-top: auto; padding-top: 14px; font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.prog__fill { position: absolute; left: 0; bottom: 0; height: 3px; background: var(--brass); }
.prog.is-past { opacity: .5; }
.prog.is-now { background: var(--bg-2); border-color: var(--brass); border-right: 1px solid var(--brass); }
.prog.is-now + .prog { border-left-color: var(--brass); }
.prog.is-now .prog__time { color: var(--led); }
.prog__badge { position: absolute; right: 12px; top: 14px; padding: 3px 8px; background: var(--red); font-family: var(--f-led); font-size: 11px; letter-spacing: .15em; color: var(--cream); }
.sched__now { position: absolute; top: 26px; bottom: 0; width: 2px; background: var(--red); pointer-events: none; z-index: 2; }
.sched__now::before { content: ''; position: absolute; left: -4px; top: -4px; width: 10px; height: 10px; border-radius: 50%; background: var(--red); }

/* ---------- Новости: постеры ---------- */
.card--art { padding-top: 0; }
.card__art {
  position: relative; container-type: inline-size; aspect-ratio: 16 / 10; margin: 0 -24px 20px; overflow: hidden;
  border-bottom: 1px solid #3a2e22;
}
.card__art i { position: absolute; display: block; transition: transform .8s var(--ease); }
.poster__w { position: absolute; z-index: 1; font-family: var(--f-display); font-weight: 700; line-height: .92; text-transform: uppercase; transition: transform .8s var(--ease); }
.card__obj { position: absolute; z-index: 2; right: 2%; bottom: -4%; height: 96%; width: auto; max-width: 62%; object-fit: contain; filter: drop-shadow(0 14px 22px rgba(0, 0, 0, .55)); transition: transform .8s var(--ease); }
.card--art:hover .card__obj { transform: rotate(-5deg) translateY(-3%); }
.card--art:hover .card__art i { transform: scale(1.06); }
.card--art:hover .poster__w { transform: translateX(3%); }
.card--art .card__num { font-size: 44px; padding-top: 18px; }

.p-aroma { background: var(--red); }
.p-aroma .s1 { right: -12%; top: -40%; width: 64%; aspect-ratio: 1; border-radius: 50%; background: var(--cream); }
.p-aroma .poster__w { left: 6%; bottom: 9%; font-size: 17cqw; color: var(--cream); }
.p-sixty { background: var(--mustard); }
.p-sixty .s1 { left: 0; right: 0; top: 10%; height: 12%; background: var(--blue); }
.p-sixty .poster__w { left: 5%; bottom: -10%; font-size: 52cqw; color: var(--ink); }
.p-monk { background: var(--ink); }
.p-monk .s1 { left: 0; right: 0; bottom: 0; height: 34%; background: repeating-linear-gradient(90deg, var(--cream) 0 9.2%, var(--ink) 9.2% 10%); }
.p-monk .s1::after { content: ''; position: absolute; inset: 0 0 45% 0; background: repeating-linear-gradient(90deg, transparent 0 6.5%, var(--ink) 6.5% 11.5%, transparent 11.5% 20%); }
.p-monk .poster__w { left: 6%; top: 10%; font-size: 26cqw; color: var(--cream); }
.p-fusion { background: var(--teal); }
.p-fusion .s1 { left: -10%; top: 30%; width: 130%; height: 22%; background: var(--mustard); transform: rotate(-14deg); }
.card--art:hover .p-fusion .s1 { transform: rotate(-14deg) scale(1.06); }
.p-fusion .poster__w { left: 6%; bottom: 9%; font-size: 20cqw; color: var(--cream); }
.p-ray { background: var(--blue); }
.p-ray .s1, .p-ray .s2 { top: 16%; width: 26%; aspect-ratio: 1; border-radius: 50%; background: var(--ink); box-shadow: 0 0 0 1.4cqw var(--ink); }
.p-ray .s1 { left: 38%; }
.p-ray .s2 { left: 69%; }
.p-ray .poster__w { left: 6%; bottom: 8%; font-size: 30cqw; color: var(--mustard); }
.p-ella { background: var(--cream); }
.p-ella .s1 { right: -8%; bottom: -30%; width: 58%; aspect-ratio: 1; border-radius: 50%; background: var(--red); }
.p-ella .poster__w { left: 6%; top: 12%; font-size: 15cqw; color: var(--ink); }
.p-sax { background: var(--brass); }
.p-sax .s1 { right: 8%; top: 14%; width: 44%; aspect-ratio: 1; border-radius: 50%; border: 4cqw solid var(--ink); }
.p-sax .poster__w { left: 6%; bottom: 6%; font-size: 34cqw; color: var(--ink); }
.p-supreme { background: var(--ink); }
.p-supreme .s1 { left: 6%; right: 6%; top: 50%; height: 1.4cqw; background: var(--red); }
.p-supreme .poster__w { left: 6%; top: 11%; font-size: 15cqw; color: var(--cream); }

.news-grid.is-filtered .card--art .card__art { display: block; }
@media (max-width: 600px) { .card--art { min-height: 0; } }

/* ---------- Внутренние страницы: общее ---------- */
.page-hero { position: relative; padding: 72px 0 56px; overflow: hidden; }
.crumbs { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 28px; padding: 0; list-style: none; font-size: 12px; font-weight: 600; letter-spacing: .15em; text-transform: uppercase; color: var(--muted); }
.crumbs li + li::before { content: '/'; margin-right: 8px; color: var(--line-2); }
.crumbs a:hover { color: var(--brass); }
.page-title { margin: 12px 0 0; font-family: var(--f-display); font-weight: 700; font-size: clamp(44px, 8vw, 112px); line-height: .95; text-transform: uppercase; }
.lead { max-width: 52ch; margin: 24px 0 0; font-size: clamp(18px, 1.6vw, 21px); line-height: 1.55; color: #d9cfc0; }

/* ---------- Статья ---------- */
.art-hero { position: relative; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 48px; align-items: end; }
.art-meta { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-top: 28px; font-size: 13px; color: var(--muted); }
.art-meta b { color: var(--brass); font-weight: 700; letter-spacing: .15em; text-transform: uppercase; font-size: 12px; }
.art-cover { position: relative; aspect-ratio: 4 / 5; background: var(--blue); overflow: hidden; container-type: inline-size; }
.art-cover__c { position: absolute; right: -18%; bottom: -14%; width: 78%; aspect-ratio: 1; border-radius: 50%; background: var(--mustard); }
.art-cover__years { position: absolute; left: 8%; top: 7%; z-index: 1; font-family: var(--f-display); font-weight: 700; font-size: 15cqw; line-height: .95; color: var(--cream); }
.art-cover__years span { color: var(--mustard); }
.art-cover img { position: absolute; z-index: 2; right: 4%; bottom: 3%; height: 88%; width: auto; filter: drop-shadow(0 30px 40px rgba(0, 0, 0, .5)); }
.art-body { display: grid; grid-template-columns: 220px minmax(0, 680px); gap: 64px; justify-content: center; padding-top: 40px; padding-bottom: 104px; }
.art-aside { position: sticky; top: 104px; align-self: start; display: grid; gap: 22px; font-size: 14px; color: var(--muted); }
.art-aside dt { font-size: 11px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--brass); }
.art-aside dd { margin: 4px 0 0; color: var(--cream); }
.art-aside dl { margin: 0; display: grid; gap: 18px; }
.prose { font-size: 18px; line-height: 1.7; color: #e4d9c5; }
.prose > p:first-child::first-letter { float: left; margin: 6px 12px 0 0; font-family: var(--f-display); font-weight: 700; font-size: 84px; line-height: .8; color: var(--brass); }
.prose h2 { margin: 56px 0 16px; font-family: var(--f-display); font-weight: 700; font-size: clamp(28px, 3.4vw, 38px); line-height: 1.05; text-transform: uppercase; color: var(--cream); }
.prose p { margin: 0 0 1.1em; }
.prose a { color: var(--brass); border-bottom: 1px solid rgba(201, 162, 74, .4); }
.pull { position: relative; margin: 48px 0; padding: 36px 0 36px 36px; border-left: 4px solid var(--red); font-family: var(--f-display); font-weight: 500; font-size: clamp(26px, 3vw, 36px); line-height: 1.15; text-transform: uppercase; color: var(--cream); }
.listen { margin: 48px 0; padding: 28px; background: var(--panel); border: 1px solid #3a2e22; }
.listen h3 { margin: 6px 0 18px; font-family: var(--f-display); font-weight: 700; font-size: 28px; text-transform: uppercase; }
.listen ol { list-style: none; margin: 0; padding: 0; }
.track { display: flex; align-items: center; gap: 16px; width: 100%; min-height: 56px; padding: 8px 0; border: 0; border-top: 1px solid var(--line); background: none; text-align: left; cursor: pointer; font-family: var(--f-body); }
.track__btn { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--line-2); transition: background .2s, color .2s, border-color .2s; }
.track__btn svg { width: 16px; height: 16px; }
.track__btn .i-pause { display: none; }
.track[aria-pressed="true"] .track__btn { background: var(--brass); color: var(--ink); border-color: var(--brass); }
.track[aria-pressed="true"] .i-play { display: none; }
.track[aria-pressed="true"] .i-pause { display: block; }
.track:hover .track__btn { border-color: var(--cream); }
.track__name { flex: 1; font-size: 16px; }
.track__name small { display: block; font-size: 13px; color: var(--muted); }
.track__dur { font-family: var(--f-led); font-size: 14px; color: var(--muted); }
.source-note { margin-top: 40px; padding-top: 20px; border-top: 1px solid var(--line); font-size: 14px; color: var(--muted); }
.related { padding: 88px 0 104px; border-top: 1px solid var(--line); }
.related-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
@media (max-width: 960px) {
  .art-hero { grid-template-columns: minmax(0, 1fr); }
  .art-cover { max-width: 420px; }
  .art-body { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .art-aside { position: static; }
  .art-aside dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .related-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 560px) { .prose { font-size: 17px; } .listen { padding: 20px 16px; } .pull { padding-left: 22px; } }

/* ---------- Энциклопедия ---------- */
.enc-tools { display: grid; gap: 20px; margin-top: 40px; }
.search { position: relative; max-width: 520px; }
.search input { width: 100%; min-height: 52px; padding: 12px 16px 12px 48px; border: 1px solid var(--line-2); background: var(--panel); color: var(--cream); font: inherit; font-size: 17px; }
.search input:focus { outline: none; border-color: var(--brass); }
.search svg { position: absolute; left: 16px; top: 50%; width: 20px; height: 20px; transform: translateY(-50%); color: var(--muted); }
.abc { display: flex; flex-wrap: wrap; gap: 4px; }
.abc button { min-width: 36px; min-height: 40px; padding: 0 6px; border: 1px solid transparent; background: none; cursor: pointer; font-family: var(--f-display); font-weight: 500; font-size: 18px; color: var(--cream); }
.abc button:hover { border-color: var(--line-2); }
.abc button[aria-pressed="true"] { background: var(--brass); color: var(--ink); }
.abc button:disabled { color: #4a3b2c; cursor: default; border-color: transparent; }
.enc-count { margin: 32px 0 20px; font-family: var(--f-led); font-size: 15px; letter-spacing: .1em; color: var(--led); }
.enc-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; padding-bottom: 104px; }
.mus { position: relative; display: flex; flex-direction: column; border: 1px solid #3a2e22; background: var(--bg); transition: border-color .2s, transform .3s var(--ease); }
a.mus:hover { border-color: var(--brass); transform: translateY(-4px); }
.mus__art { position: relative; aspect-ratio: 1; overflow: hidden; container-type: inline-size; }
.mus__l { position: absolute; left: 7%; bottom: -12%; font-family: var(--f-display); font-weight: 700; font-size: 82cqw; line-height: 1; color: rgba(239, 228, 207, .92); }
.mus__shape { position: absolute; right: -14%; top: -14%; width: 58%; aspect-ratio: 1; border-radius: 50%; }
.mus__inst { position: absolute; right: 7%; bottom: 7%; padding: 4px 8px; background: var(--panel); font-family: var(--f-led); font-size: 12px; letter-spacing: .1em; color: var(--led); text-transform: uppercase; }
.mus__body { display: flex; flex-direction: column; gap: 4px; padding: 16px 18px 18px; flex: 1; }
.mus__name { margin: 0; font-family: var(--f-display); font-weight: 500; font-size: 22px; line-height: 1.1; text-transform: uppercase; }
.mus__years { font-size: 14px; color: var(--muted); font-variant-numeric: tabular-nums; }
.mus__more { margin-top: auto; padding-top: 12px; font-size: 11px; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; color: var(--brass); }
.mus__more--soon { color: #6b5a46; }
.enc-empty { grid-column: 1 / -1; padding: 48px 0; font-size: 18px; color: var(--muted); }
@media (max-width: 1080px) { .enc-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 760px) { .enc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } .mus__name { font-size: 18px; } .mus__body { padding: 12px 12px 14px; } .mus__inst { font-size: 10px; padding: 3px 6px; right: 5%; bottom: 5%; } }

/* ---------- Кейс ---------- */
.case-sec { padding: 88px 0; border-top: 1px solid var(--line); }
.case-grid { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 48px; }
.case-grid h2 { margin: 0; font-family: var(--f-display); font-weight: 700; font-size: clamp(30px, 3.4vw, 44px); line-height: 1; text-transform: uppercase; }
.case-num { display: block; margin-bottom: 12px; font-family: var(--f-led); font-size: 14px; letter-spacing: .15em; color: var(--led); }
.case-text { max-width: 68ch; font-size: 18px; line-height: 1.65; color: #e4d9c5; }
.case-text p { margin: 0 0 1em; }
.problems { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.problems li { padding: 22px; border: 1px solid #3a2e22; background: var(--bg-2); }
.problems b { display: block; margin-bottom: 8px; font-family: var(--f-display); font-weight: 500; font-size: 21px; line-height: 1.15; text-transform: uppercase; color: var(--cream); }
.problems span { font-size: 15px; line-height: 1.5; color: var(--muted); }
.shot { margin: 0; border: 1px solid #3a2e22; background: var(--panel); }
.shot img { width: 100%; height: auto; }
.shot figcaption { padding: 12px 16px; font-size: 13px; color: var(--muted); border-top: 1px solid #3a2e22; }
.shots { display: grid; grid-template-columns: minmax(0, 2.2fr) minmax(0, 1fr); gap: 20px; align-items: start; }
.before-slot { position: relative; }
.before-slot .slot__fallback { padding: 28px; }
.dirs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.dir { padding: 18px; min-height: 150px; display: flex; flex-direction: column; border: 1px solid #3a2e22; }
.dir b { font-family: var(--f-display); font-weight: 500; font-size: 20px; text-transform: uppercase; }
.dir span { margin-top: 8px; font-size: 14px; color: var(--muted); }
.dir em { margin-top: auto; padding-top: 12px; font-style: normal; font-size: 11px; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
.dir--yes { border-color: var(--brass); }
.dir--yes em { color: var(--brass); }
.dir--part em { color: var(--led-dim); }
.dir--no em { color: #6b5a46; }
.palette { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; }
.sw { aspect-ratio: 1 / 1.2; display: flex; flex-direction: column; justify-content: flex-end; padding: 10px; border: 1px solid #3a2e22; font-size: 12px; }
.sw b { font-weight: 600; }
.sw code { font-family: var(--f-led); font-size: 12px; opacity: .85; }
.types { display: grid; gap: 18px; }
.type-row { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 24px; align-items: baseline; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.type-row small { font-size: 12px; color: var(--muted); letter-spacing: .1em; text-transform: uppercase; }
.feat-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 32px; }
.feat-list li { padding: 14px 0; border-bottom: 1px solid var(--line); font-size: 16px; }
.feat-list b { color: var(--brass); font-weight: 600; }
.case-cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
@media (max-width: 960px) {
  .case-grid { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .shots { grid-template-columns: minmax(0, 1fr); }
  .dirs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .palette { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .problems, .feat-list { grid-template-columns: minmax(0, 1fr); }
  .type-row { grid-template-columns: minmax(0, 1fr); gap: 6px; }
}
.before-slot:not(.has-img) { display: none; }

/* Посадка вырезок на постерах новостей */
.p-aroma .poster__w { font-size: 14cqw; }
.p-aroma .card__obj { height: 92%; right: 5%; }
.p-sixty .poster__w { font-size: 40cqw; bottom: -6%; }
.p-sixty .card__obj { height: 80%; right: 3%; bottom: 4%; max-width: 46%; }
.p-monk .poster__w { font-size: 22cqw; }
.p-monk .card__obj { height: 58%; right: 4%; bottom: 14%; max-width: 50%; }
.p-fusion .card__obj { height: auto; width: 66%; max-width: 66%; right: 3%; bottom: auto; top: 10%; }
.p-ray:has(.card__obj) .s1, .p-ray:has(.card__obj) .s2 { display: none; }
.p-ray:has(.card__obj)::before { content: ''; position: absolute; right: -10%; top: -30%; width: 62%; aspect-ratio: 1; border-radius: 50%; background: var(--mustard); }
.p-ray .card__obj { height: auto; width: 74%; max-width: 74%; right: 4%; bottom: auto; top: 14%; }
.p-ella .card__obj { height: 92%; right: 6%; }
.p-sax .card__obj { height: 92%; right: 6%; }
.p-supreme .poster__w { font-size: 13cqw; }
.p-supreme .card__obj { height: 64%; right: 3%; bottom: 4%; max-width: 48%; }
.p-ella .poster__w { font-size: 13cqw; }
.p-ella .card__obj { right: 4%; max-width: 46%; }
.p-supreme .card__obj { height: 56%; }

/* Скриншот старого сайта: длинный, прокручивается внутри окна */
.shot__scroll { max-height: 640px; overflow-y: auto; scrollbar-width: thin; scrollbar-color: var(--line-2) transparent; }
.shot__scroll img { display: block; width: 100%; height: auto; }
@media (max-width: 600px) { .shot__scroll { max-height: 480px; } }