/* RediskaPROD · Noir — премиальный «автомобильный постер»: чёрный графит, серебряная узкая
   типографика, разрядка и тонкие линии; атмосферу разбавляют фиолетовый туман и светлячки,
   акцент — фиолетовый. Шрифты системные (Bahnschrift Condensed, Constantia) — для локального просмотра. */

/* Узкий заголовочный шрифт встроен в сайт: «Rediska Condensed» — сжатый по ширине Roboto Regular
   (Apache License 2.0), кириллица с Ё. Диапазон весов, чтобы браузер не рисовал ложный жирный. */
@font-face {
  font-family: "Rediska Condensed";
  src: url("/assets/fonts/rediska-condensed.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}

:root {
  --ink: #0a0a0b;
  --ink-2: #111114;
  --steel: #1c1c20;
  --line: rgba(255, 255, 255, 0.12);
  --line-2: rgba(255, 255, 255, 0.28);
  --text: #ececee;
  --dim: #8f8c99;
  --accent: #a47bff;
  --accent-bright: #c4a6ff;
  --accent-deep: #6d3cff;
  --condensed: "Rediska Condensed", "Arial Narrow", sans-serif;
  --serif: "Constantia", "Georgia", "Times New Roman", serif;
  --sans: "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--ink);
  color: var(--text);
  font: 300 17px/1.65 var(--sans);
  -webkit-font-smoothing: antialiased;
}

img { display: block; max-width: 100%; }
a { color: inherit; }
:focus-visible { outline: 1px solid var(--accent-bright); outline-offset: 4px; }
::selection { background: rgba(164, 123, 255, 0.45); color: #fff; }

.visually-hidden {
  position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
}

/* ---------- Шапка ---------- */

.bar {
  position: fixed; inset: 0 0 auto 0; z-index: 40;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 18px clamp(20px, 4vw, 56px);
  background: linear-gradient(180deg, rgba(10, 10, 11, 0.85), rgba(10, 10, 11, 0));
}
.bar-brand {
  display: inline-flex; align-items: center; gap: 12px; text-decoration: none;
  font: 500 16px/1 var(--sans); letter-spacing: 0.08em;
}
.bar-brand b { font-weight: 500; color: var(--accent); text-shadow: 0 0 14px rgba(164, 123, 255, 0.6); }
.bar-brand img { width: 30px; height: 30px; filter: grayscale(1) brightness(1.6) drop-shadow(0 0 8px rgba(164, 123, 255, 0.45)); }
.bar-nav { display: flex; gap: clamp(14px, 3vw, 38px); }
.bar-nav a {
  position: relative; text-decoration: none; color: var(--dim);
  font: 500 12px/1 var(--sans); letter-spacing: 0.28em; text-transform: uppercase; padding: 6px 0;
}
.bar-nav a::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--accent);
  box-shadow: 0 0 8px var(--accent);
  transform: scaleX(0); transform-origin: left; transition: transform 0.35s ease;
}
.bar-nav a:hover { color: #fff; }
.bar-nav a:hover::after { transform: scaleX(1); }
.bar-brand span { white-space: nowrap; }
@media (max-width: 640px) { .hide-sm { display: none; } }
@media (max-width: 420px) {
  .bar { gap: 10px; }
  .bar-brand { gap: 8px; font-size: 15px; }
  .bar-brand img { width: 26px; height: 26px; }
  .bar-nav { gap: 14px; }
  .bar-nav a { font-size: 11px; letter-spacing: 0.16em; }
}

/* ---------- Постер ---------- */

.poster {
  position: relative; overflow: hidden; isolation: isolate;
  min-height: 100vh;
  display: grid; grid-template-rows: auto 1fr auto;
  padding: clamp(96px, 13vh, 140px) clamp(20px, 4vw, 56px) clamp(28px, 5vh, 48px);
  background:
    radial-gradient(55% 45% at 50% 42%, rgba(109, 60, 255, 0.20) 0%, rgba(10, 10, 11, 0) 70%),
    radial-gradient(70% 55% at 50% 0%, #1f1b28 0%, rgba(10, 10, 11, 0) 70%),
    radial-gradient(40% 35% at 85% 85%, rgba(164, 123, 255, 0.10) 0%, rgba(10, 10, 11, 0) 70%),
    var(--ink);
}

.ghost-word {
  position: absolute; z-index: -3; left: -2vw; top: 46%;
  font: italic 800 clamp(120px, 24vw, 420px)/0.8 var(--condensed);
  letter-spacing: -0.02em; color: rgba(190, 160, 255, 0.05);
  transform: translateY(-50%) skewX(-8deg);
  white-space: nowrap; user-select: none;
}

/* Фиолетовый туман — две медленно дрейфующие полосы. */
.fog, .fog::before { position: absolute; left: -25%; right: -25%; pointer-events: none; }
.fog {
  z-index: -2; bottom: 12%; height: 50%;
  background:
    radial-gradient(40% 55% at 28% 60%, rgba(140, 95, 255, 0.20), transparent 70%),
    radial-gradient(35% 50% at 72% 45%, rgba(109, 60, 255, 0.18), transparent 70%);
  filter: blur(22px);
  animation: fog-a 36s ease-in-out infinite alternate;
}
.fog::before {
  content: ""; inset: 25% 0 -10% 0;
  background:
    radial-gradient(30% 55% at 60% 55%, rgba(200, 175, 255, 0.10), transparent 70%),
    radial-gradient(28% 45% at 15% 40%, rgba(150, 110, 255, 0.12), transparent 70%);
  animation: fog-b 28s ease-in-out infinite alternate;
}

/* Светлячки: точки box-shadow, каждая повторена ниже на 900px — подъём зациклен без скачка. */
.motes { position: absolute; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; }
.motes::before, .motes::after { content: ""; position: absolute; left: 0; top: 0; border-radius: 50%; }
.motes::before {
  width: 3px; height: 3px;
  box-shadow:
    60px 120px rgba(205, 180, 255, 0.85), 210px 640px rgba(205, 180, 255, 0.55), 340px 300px rgba(205, 180, 255, 0.8),
    480px 820px rgba(205, 180, 255, 0.5), 590px 90px rgba(205, 180, 255, 0.75), 720px 520px rgba(205, 180, 255, 0.55),
    860px 210px rgba(205, 180, 255, 0.85), 990px 760px rgba(205, 180, 255, 0.5), 1120px 380px rgba(205, 180, 255, 0.8),
    1250px 60px rgba(205, 180, 255, 0.55), 1380px 690px rgba(205, 180, 255, 0.75), 1510px 260px rgba(205, 180, 255, 0.55),
    1640px 580px rgba(205, 180, 255, 0.85), 1770px 140px rgba(205, 180, 255, 0.5), 1880px 470px rgba(205, 180, 255, 0.7),
    150px 440px rgba(205, 180, 255, 0.55), 420px 40px rgba(205, 180, 255, 0.7), 650px 880px rgba(205, 180, 255, 0.5),
    900px 460px rgba(205, 180, 255, 0.8), 1180px 860px rgba(205, 180, 255, 0.55), 1450px 520px rgba(205, 180, 255, 0.75),
    1700px 820px rgba(205, 180, 255, 0.5),
    60px 1020px rgba(205, 180, 255, 0.85), 210px 1540px rgba(205, 180, 255, 0.55), 340px 1200px rgba(205, 180, 255, 0.8),
    480px 1720px rgba(205, 180, 255, 0.5), 590px 990px rgba(205, 180, 255, 0.75), 720px 1420px rgba(205, 180, 255, 0.55),
    860px 1110px rgba(205, 180, 255, 0.85), 990px 1660px rgba(205, 180, 255, 0.5), 1120px 1280px rgba(205, 180, 255, 0.8),
    1250px 960px rgba(205, 180, 255, 0.55), 1380px 1590px rgba(205, 180, 255, 0.75), 1510px 1160px rgba(205, 180, 255, 0.55),
    1640px 1480px rgba(205, 180, 255, 0.85), 1770px 1040px rgba(205, 180, 255, 0.5), 1880px 1370px rgba(205, 180, 255, 0.7),
    150px 1340px rgba(205, 180, 255, 0.55), 420px 940px rgba(205, 180, 255, 0.7), 650px 1780px rgba(205, 180, 255, 0.5),
    900px 1360px rgba(205, 180, 255, 0.8), 1180px 1760px rgba(205, 180, 255, 0.55), 1450px 1420px rgba(205, 180, 255, 0.75),
    1700px 1720px rgba(205, 180, 255, 0.5);
  filter: drop-shadow(0 0 4px rgba(170, 130, 255, 0.95));
  animation: rise 60s linear infinite;
}
.motes::after {
  width: 4px; height: 4px;
  box-shadow:
    110px 700px rgba(255, 255, 255, 0.9), 380px 180px rgba(196, 166, 255, 0.95), 640px 560px rgba(255, 214, 120, 0.85),
    940px 90px rgba(196, 166, 255, 0.9), 1210px 620px rgba(255, 255, 255, 0.85), 1490px 330px rgba(196, 166, 255, 0.9),
    1760px 760px rgba(255, 214, 120, 0.8), 820px 830px rgba(196, 166, 255, 0.8), 1600px 60px rgba(255, 255, 255, 0.85),
    260px 420px rgba(196, 166, 255, 0.9),
    110px 1600px rgba(255, 255, 255, 0.9), 380px 1080px rgba(196, 166, 255, 0.95), 640px 1460px rgba(255, 214, 120, 0.85),
    940px 990px rgba(196, 166, 255, 0.9), 1210px 1520px rgba(255, 255, 255, 0.85), 1490px 1230px rgba(196, 166, 255, 0.9),
    1760px 1660px rgba(255, 214, 120, 0.8), 820px 1730px rgba(196, 166, 255, 0.8), 1600px 960px rgba(255, 255, 255, 0.85),
    260px 1320px rgba(196, 166, 255, 0.9);
  filter: drop-shadow(0 0 7px rgba(164, 123, 255, 1));
  animation: rise 40s linear infinite, flicker 3.4s ease-in-out infinite alternate;
}
.motes-soft { opacity: 0.55; }

.poster-top { text-align: center; }

.kicker {
  display: inline-flex; align-items: center; gap: 18px;
  margin: 0;
  font: 400 clamp(11px, 1.2vw, 15px)/1.4 var(--sans);
  letter-spacing: 0.42em; text-transform: uppercase; color: #d6d2e2;
  animation: fade-in 1.4s 0.2s ease both;
}
.kicker::before, .kicker::after {
  content: ""; width: clamp(24px, 6vw, 90px); height: 1px;
  background: linear-gradient(90deg, transparent, var(--accent));
}
.kicker::after { background: linear-gradient(270deg, transparent, var(--accent)); }

.poster-mid {
  position: relative;
  display: grid; align-items: center;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 2.6fr) minmax(0, 0.8fr);
  padding-block: clamp(20px, 4vh, 44px);
}

.stage { grid-column: 2; position: relative; padding-bottom: 12%; animation: fade-up 1.4s 0.35s cubic-bezier(.2, .7, .2, 1) both; }
.spot {
  position: absolute; left: 50%; top: -35%; width: 125%; height: 150%; transform: translateX(-50%); z-index: -1;
  background:
    radial-gradient(40% 50% at 50% 42%, rgba(164, 123, 255, 0.22), rgba(164, 123, 255, 0) 70%),
    radial-gradient(28% 36% at 50% 38%, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0) 70%);
}
.stage-logo {
  position: relative; width: 100%; height: auto;
  filter: drop-shadow(0 0 26px rgba(150, 105, 255, 0.35)) drop-shadow(0 30px 40px rgba(0, 0, 0, 0.8));
  animation: bob 5s ease-in-out infinite alternate;
}
/* Отражение на глянцевом полу. */
.stage-logo.reflection {
  position: absolute; left: 0; top: 100%; margin-top: -12%;
  transform: scaleY(-1); opacity: 0.26; filter: blur(1.5px) saturate(0.7);
  -webkit-mask-image: linear-gradient(to top, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0) 38%);
  mask-image: linear-gradient(to top, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0) 38%);
  animation: none; pointer-events: none;
}
.floor {
  position: absolute; left: -30%; right: -30%; bottom: 9%; height: 1px; z-index: -1;
  background: linear-gradient(90deg, rgba(164, 123, 255, 0), rgba(196, 166, 255, 0.55), rgba(164, 123, 255, 0));
  box-shadow: 0 0 36px 6px rgba(164, 123, 255, 0.12);
}

.tagline {
  grid-column: 3; justify-self: end; text-align: left; padding-left: 20px;
  animation: fade-in 1.4s 0.7s ease both;
}
.tagline .serif {
  margin: 0 0 18px;
  font: 400 clamp(20px, 2vw, 30px)/1.15 var(--serif); color: #f3f2f7;
}
.tagline .traits {
  margin: 0; font: 400 12px/2 var(--sans); letter-spacing: 0.34em; text-transform: uppercase; color: var(--accent-bright);
}

.poster-bottom {
  display: grid; align-items: end; gap: 24px;
  grid-template-columns: 1fr auto 1fr;
  animation: fade-in 1.4s 0.9s ease both;
}

.spec { max-width: 380px; }
.spec-title {
  display: flex; align-items: center; gap: 18px; margin: 0 0 12px;
  font: 500 12px/1 var(--sans); letter-spacing: 0.3em; text-transform: uppercase;
}
.spec-title::after { content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, var(--accent), transparent); }
.spec ul { display: flex; margin: 0; padding: 12px 0 0; list-style: none; border-top: 1px solid var(--line); }
.spec li { font: 300 14px/1 var(--sans); color: #d6d4de; white-space: nowrap; }
.spec li + li { margin-left: 16px; padding-left: 16px; border-left: 1px solid var(--line-2); }
.spec b { font-weight: 600; color: #fff; }

.play { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; }
.line-btn {
  position: relative; overflow: hidden; isolation: isolate;
  display: inline-flex; align-items: center; gap: 14px;
  padding: 15px 20px; border: 1px solid var(--line-2);
  text-decoration: none; color: #f2f2f4;
  font: 500 11px/1 var(--sans); letter-spacing: 0.26em; text-transform: uppercase;
  transition: color 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease;
}
.line-btn::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(180deg, #b08cff, var(--accent-deep));
  transform: translateY(101%); transition: transform 0.4s cubic-bezier(.2, .7, .2, 1);
}
.line-btn i { font-style: normal; transition: transform 0.35s ease; }
.line-btn:hover { color: #fff; border-color: var(--accent); box-shadow: 0 0 26px rgba(164, 123, 255, 0.45); }
.line-btn:hover::before { transform: translateY(0); }
.line-btn:hover i { transform: translateX(4px); }

.emblem {
  justify-self: end; width: 64px; height: 64px;
  filter: grayscale(1) brightness(1.7) contrast(0.95) drop-shadow(0 0 14px rgba(164, 123, 255, 0.55));
  opacity: 0.92;
}

@media (max-width: 980px) {
  .poster-mid { grid-template-columns: 1fr; gap: 28px; }
  .stage { grid-column: 1; width: min(96%, 680px); justify-self: center; }
  .tagline { grid-column: 1; justify-self: center; text-align: center; padding-left: 0; }
  .poster-bottom { grid-template-columns: 1fr; justify-items: center; text-align: center; }
  .spec-title { justify-content: center; }
  .spec-title::after { display: none; }
  .spec ul { justify-content: center; }
  .emblem { justify-self: center; }
}
@media (max-width: 480px) {
  .kicker { letter-spacing: 0.28em; gap: 10px; }
  .line-btn { width: 100%; justify-content: space-between; }
  .play { width: 100%; }
  .spec li { font-size: 13px; }
  .spec li + li { margin-left: 10px; padding-left: 10px; }
}

@keyframes rise { from { transform: translateY(0); } to { transform: translateY(-900px); } }
@keyframes flicker { from { opacity: 0.45; } to { opacity: 1; } }
@keyframes fog-a { from { transform: translateX(-4%); } to { transform: translateX(4%); } }
@keyframes fog-b { from { transform: translateX(5%); } to { transform: translateX(-5%); } }
@keyframes bob { from { transform: translateY(-5px); } to { transform: translateY(6px); } }
@keyframes sheen { 0%, 20% { background-position: 100% 0; } 60%, 100% { background-position: 0% 0; } }
@keyframes fade-up { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: none; } }
@keyframes fade-in { from { opacity: 0; } to { opacity: 1; } }

/* ---------- Блоки ---------- */

.block {
  position: relative;
  padding: clamp(80px, 12vw, 150px) clamp(20px, 4vw, 56px);
  border-top: 1px solid var(--line);
  max-width: 1400px; margin: 0 auto;
}

.label {
  display: flex; align-items: center; gap: 16px; margin: 0 0 clamp(36px, 6vw, 64px);
  font: 500 12px/1 var(--sans); letter-spacing: 0.34em; text-transform: uppercase; color: var(--dim);
}
.label span { color: var(--accent-bright); }
.label::after { content: ""; width: 80px; height: 1px; background: var(--accent); box-shadow: 0 0 10px rgba(164, 123, 255, 0.7); }

.split { display: grid; gap: clamp(40px, 6vw, 96px); grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); align-items: start; }
@media (max-width: 900px) { .split { grid-template-columns: 1fr; } }

.statement {
  margin: 0; position: sticky; top: 110px;
  font: 400 clamp(34px, 4.6vw, 64px)/1.08 var(--serif); color: #f4f3f8;
}
.statement em { font-style: italic; color: var(--accent-bright); text-shadow: 0 0 30px rgba(164, 123, 255, 0.35); }

.specs { list-style: none; margin: 0; padding: 0; }
.specs li {
  display: grid; grid-template-columns: 64px 1fr; gap: 12px;
  padding: 26px 0; border-top: 1px solid var(--line);
  transition: padding-left 0.35s ease, background-color 0.35s ease;
}
.specs li:last-child { border-bottom: 1px solid var(--line); }
.specs li:hover { padding-left: 10px; background: linear-gradient(90deg, rgba(164, 123, 255, 0.08), transparent 70%); }
.specs .n { font: 500 13px/1.9 var(--sans); letter-spacing: 0.2em; color: var(--accent); }
.specs h3 {
  margin: 0 0 6px; font: 600 clamp(24px, 2.4vw, 32px)/1.1 var(--condensed); font-stretch: 75%;
  letter-spacing: 0.04em; text-transform: uppercase;
}
.specs p { margin: 0; color: var(--dim); font-size: 16px; }

.section-mega {
  margin: 0 0 clamp(36px, 5vw, 60px);
  font: 600 clamp(64px, 12vw, 190px)/0.85 var(--condensed); font-stretch: 75%;
  text-transform: uppercase; letter-spacing: 0.01em;
  background: linear-gradient(100deg, #8d8a98 0%, #e9e6f2 25%, #ffffff 32%, #d9cdf8 45%, #9d93b8 70%, #eeeaf6 90%);
  background-size: 250% 100%;
  -webkit-background-clip: text; background-clip: text; color: transparent;
  animation: sheen 10s ease-in-out infinite;
}

.gal {
  display: grid; gap: 14px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-rows: clamp(200px, 21vw, 300px);
}
.gal .wide { grid-column: span 2; }
.gal figure { margin: 0; position: relative; overflow: hidden; background: var(--steel); transition: box-shadow 0.6s ease; }
.gal img {
  width: 100%; height: 100%; object-fit: cover;
  filter: grayscale(1) contrast(1.12) brightness(0.72);
  transform: scale(1.02);
  transition: filter 0.8s ease, transform 1.2s cubic-bezier(.2, .7, .2, 1);
}
.gal figure::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg, rgba(109, 60, 255, 0) 55%, rgba(60, 30, 140, 0.35) 100%);
  transition: opacity 0.6s ease;
}
.gal figure:hover { box-shadow: 0 0 0 1px rgba(164, 123, 255, 0.6), 0 0 40px rgba(164, 123, 255, 0.25); }
.gal figure:hover::after { opacity: 0; }
.gal figure:hover img { filter: none; transform: scale(1.07); }
.gal figcaption {
  position: absolute; left: 18px; bottom: 16px; right: 18px; z-index: 1;
  display: flex; align-items: center; gap: 14px;
  font: 500 11px/1 var(--sans); letter-spacing: 0.3em; text-transform: uppercase; color: #fff;
}
.gal figcaption::after { content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, rgba(196, 166, 255, 0.7), rgba(255, 255, 255, 0)); }
.hint { margin: 18px 0 0; font: 400 12px/1 var(--sans); letter-spacing: 0.22em; text-transform: uppercase; color: var(--dim); }
@media (max-width: 900px) { .gal { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .gal { grid-template-columns: 1fr; } .gal .wide { grid-column: auto; } }

/* Студия: крупная эмблема в фиолетовом ореоле, частицы на фоне. */
.studio { text-align: center; overflow: hidden; isolation: isolate; }
.studio::before {
  content: ""; position: absolute; left: 50%; top: 32%; width: min(900px, 120%); height: 520px; z-index: -2;
  transform: translate(-50%, -50%);
  background: radial-gradient(50% 50% at 50% 50%, rgba(109, 60, 255, 0.22), rgba(10, 10, 11, 0) 70%);
  pointer-events: none;
}
.studio .label { justify-content: center; }
.studio .label::after { display: none; }
.studio-emblem-wrap { position: relative; width: clamp(160px, 17vw, 240px); margin: 0 auto clamp(20px, 3vw, 34px); }
.studio-emblem-wrap::before {
  content: ""; position: absolute; inset: -18%; z-index: -1; border-radius: 50%;
  background: radial-gradient(circle, rgba(164, 123, 255, 0.35), rgba(164, 123, 255, 0) 65%);
  animation: pulse 5s ease-in-out infinite alternate;
}
.studio-emblem {
  width: 100%; height: auto;
  filter: grayscale(1) brightness(1.75) drop-shadow(0 0 22px rgba(164, 123, 255, 0.55));
  animation: bob 6s ease-in-out infinite alternate;
}
@keyframes pulse { from { opacity: 0.6; transform: scale(0.95); } to { opacity: 1; transform: scale(1.05); } }
.serif-lead { max-width: 760px; margin: 0 auto; font: 400 clamp(20px, 2vw, 28px)/1.4 var(--serif); color: #dcdae4; }

.rows a {
  display: grid; grid-template-columns: 180px minmax(0, 1fr) auto; align-items: center; gap: 20px;
  padding: 26px 0; border-top: 1px solid var(--line); text-decoration: none;
  transition: padding 0.35s ease, background-color 0.35s ease;
}
.rows a:last-child { border-bottom: 1px solid var(--line); }
.rows .k { font: 500 12px/1 var(--sans); letter-spacing: 0.3em; text-transform: uppercase; color: var(--dim); }
.rows .v { font: 600 clamp(22px, 3.2vw, 40px)/1.1 var(--condensed); font-stretch: 75%; letter-spacing: 0.02em; overflow-wrap: anywhere; transition: color 0.35s ease; }
.rows i { font-style: normal; font-size: 22px; color: var(--dim); transition: transform 0.35s ease, color 0.35s ease; }
.rows a:hover { padding-left: 14px; background: linear-gradient(90deg, rgba(164, 123, 255, 0.08), transparent 70%); }
.rows a:hover .v { color: var(--accent-bright); }
.rows a:hover i { transform: translateX(6px); color: var(--accent); }
@media (max-width: 640px) { .rows a { grid-template-columns: 1fr auto; } .rows .k { grid-column: 1 / -1; } }

.foot {
  position: relative;
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 28px;
  padding: 30px clamp(20px, 4vw, 56px) 40px; border-top: 1px solid var(--line);
  font: 400 12px/1.6 var(--sans); letter-spacing: 0.08em; color: var(--dim);
}
.foot::before {
  content: ""; position: absolute; left: 50%; top: -1px; width: min(420px, 70%); height: 1px; transform: translateX(-50%);
  background: linear-gradient(90deg, transparent, var(--accent), transparent);
}
.foot p { margin: 0; }
.foot nav { display: flex; flex-wrap: wrap; gap: 8px 24px; }
.foot a { text-decoration: none; color: #cfcdd8; }
.foot a:hover { color: var(--accent-bright); }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}