/* Игры эго — вспышки во тьме ума. Тёмная база, красочные искры. */

:root{
  --bg0:#07060d; --bg1:#0c0a18; --bg2:#120f22;
  --ink:#ece8f2; --ink-soft:#b3acc4; --ink-dim:#7a738f;
  --line:#241f3a;
  --gold:#f0c46a; --gold-soft:#f7dfa6;
  --g1:#f0a82e; --g2:#e2604a; --g3:#9b7fe0; --g4:#2bb89a; --g5:#e25c86; --g6:#4f9be0;
  --serif:'PT Serif',Georgia,'Times New Roman',serif;
  --disp:'Cormorant Garamond','PT Serif',serif;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--serif);
  color:var(--ink);
  background:
    radial-gradient(1100px 760px at 78% -8%, rgba(155,127,224,.12), transparent 60%),
    radial-gradient(900px 680px at 8% 24%, rgba(226,96,74,.08), transparent 55%),
    radial-gradient(1000px 700px at 50% 110%, rgba(79,155,224,.08), transparent 60%),
    linear-gradient(180deg, var(--bg0), var(--bg1) 42%, var(--bg2));
  background-attachment:fixed;
  line-height:1.66;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}

main{position:relative;z-index:1}
section{max-width:780px;margin:0 auto;padding:13vh 26px;position:relative}
.eyebrow{font-family:var(--disp);letter-spacing:.26em;text-transform:uppercase;
  font-size:.82rem;color:var(--gold);opacity:.85;margin-bottom:1rem}
h2{font-family:var(--disp);font-size:clamp(2rem,5.4vw,3.3rem);font-weight:500;line-height:1.1;
  letter-spacing:.005em;margin-bottom:1.1rem}
.lead{font-size:clamp(1.04rem,2.3vw,1.22rem);color:var(--ink-soft);max-width:62ch}
p.body{margin-top:1.1rem;color:var(--ink-soft);max-width:62ch}

.reveal{opacity:0;transform:translateY(28px);transition:opacity 1s ease,transform 1s ease}
.reveal.in{opacity:1;transform:none}

/* ─── HERO ─── */
#hero{min-height:100vh;display:flex;flex-direction:column;justify-content:center;
  align-items:center;text-align:center;padding-top:8vh}
.hero-stage{position:relative;width:100%;max-width:560px;height:300px;margin-bottom:1rem}
.hero-stage canvas{position:absolute;inset:0;width:100%;height:100%}
#hero .word{font-family:var(--disp);font-size:clamp(3.4rem,13vw,7rem);line-height:.96;
  font-weight:600;letter-spacing:.01em;position:relative;z-index:2;
  background:linear-gradient(100deg,#f0a82e,#e25c86 40%,#9b7fe0 70%,#4f9be0);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 34px rgba(226,92,134,.3))}
#hero .sub{margin:1.7rem auto 0;max-width:54ch;color:var(--ink-soft);
  font-style:italic;font-size:clamp(1.02rem,2.4vw,1.2rem);white-space:pre-line;line-height:1.55}
.scrollcue{margin-top:2.8rem;color:var(--ink-dim);font-size:.78rem;letter-spacing:.18em;
  text-transform:uppercase;display:flex;flex-direction:column;align-items:center;gap:.55rem}
.scrollcue .dot{width:6px;height:6px;border-radius:50%;background:var(--gold);
  animation:fall 1.9s ease-in-out infinite}
@keyframes fall{0%{transform:translateY(-6px);opacity:.2}50%{opacity:1}100%{transform:translateY(15px);opacity:.2}}

/* ─── БЛОК 1: ШЕСТЬ ИГР (карточки) ─── */
.games-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:18px;margin:2.8rem 0 1.4rem}
.game-card{position:relative;border:1px solid var(--line);border-radius:16px;
  padding:26px 24px 24px;overflow:hidden;
  background:linear-gradient(165deg,rgba(255,255,255,.045),rgba(255,255,255,.012));
  transition:transform .35s,border-color .35s}
.game-card::before{content:'';position:absolute;inset:0 0 auto 0;height:3px;background:var(--c)}
.game-card::after{content:'';position:absolute;top:-60px;right:-60px;width:150px;height:150px;
  border-radius:50%;background:var(--c);opacity:.13;filter:blur(26px);pointer-events:none}
.game-card:hover{transform:translateY(-4px);border-color:var(--c)}
.gc-num{font-family:var(--disp);font-size:2.4rem;font-weight:600;line-height:1;color:var(--c);
  text-shadow:0 0 22px var(--c)}
.gc-title{font-family:var(--disp);font-size:1.4rem;font-weight:500;margin:.3rem 0 .1rem}
.gc-essence{color:var(--c);font-style:italic;font-size:.96rem;opacity:.92;margin-bottom:.8rem}
.gc-body{color:var(--ink-soft);font-size:.96rem}
.hint{color:var(--ink-dim);font-size:.82rem;font-style:italic;text-align:center;margin-top:1.6rem}

/* ─── БЛОК 2: ВИЗУАЛЬНЫЕ СУТРЫ (постеры кино) ─── */
.films-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,288px));
  gap:26px;margin-top:2.8rem;justify-content:center}
.film-card{transition:transform .4s}
.film-card:hover{transform:translateY(-5px)}
.film-poster{position:relative;aspect-ratio:2/3;border-radius:16px;overflow:hidden;
  border:1px solid var(--line);
  background:radial-gradient(120% 90% at 50% 36%,#7a4220 0%,#3a1c2c 52%,#1c0f22 100%);
  box-shadow:0 18px 50px rgba(0,0,0,.5)}
.film-poster .fp-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.film-poster.has-img .fp-scrim,.film-poster.has-img .fp-text{display:none}
.film-poster .fp-art{position:absolute;left:50%;top:30%;transform:translate(-50%,-50%);
  width:62%;height:auto;filter:drop-shadow(0 0 26px rgba(231,192,116,.45))}
.fp-scrim{position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,0) 38%,rgba(8,4,12,.86) 100%)}
.fp-text{position:absolute;left:0;right:0;bottom:0;padding:20px 20px 22px;text-align:center}
.fp-meta{color:var(--gold-soft);font-family:var(--disp);letter-spacing:.06em;
  font-size:.84rem;font-style:italic;margin-bottom:.25rem;opacity:.92}
.fp-title{font-family:var(--disp);font-size:1.7rem;font-weight:600;line-height:1.08;color:#fff}
.fc-note{color:var(--ink-soft);font-size:.92rem;text-align:center;margin-top:1rem;line-height:1.55}

/* ─── ДВЕ ПТИЦЫ ─── */
.birds-stage{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:2.6rem 0 1.6rem}
@media(max-width:600px){.birds-stage{grid-template-columns:1fr}}
.bird-card{border:1px solid var(--line);border-radius:16px;padding:22px;cursor:pointer;
  background:linear-gradient(165deg,rgba(255,255,255,.04),rgba(255,255,255,.01));
  transition:border-color .4s,transform .4s,background .4s}
.bird-card:hover{transform:translateY(-3px)}
.bird-card svg{width:100%;height:110px;display:block;margin-bottom:.6rem}
.bird-card .bt{font-family:var(--disp);font-size:1.5rem;font-weight:500}
.bird-card .bs{color:var(--gold);letter-spacing:.12em;text-transform:uppercase;font-size:.74rem;margin-bottom:.6rem}
.bird-card .bd{color:var(--ink-soft);font-size:.95rem;max-height:0;overflow:hidden;opacity:0;
  transition:max-height .5s,opacity .5s,margin .5s}
.bird-card.open .bd{max-height:320px;opacity:1;margin-top:.5rem}
.bird-small .bw{stroke:#e2604a;fill:#e2604a}
.bird-big .bw{stroke:#2bb89a;fill:#2bb89a}
.bird-card.open.bird-small{border-color:#e2604a}
.bird-card.open.bird-big{border-color:#2bb89a}
.bird-verse{text-align:center;font-family:var(--disp);font-size:clamp(1.15rem,2.8vw,1.5rem);
  font-style:italic;color:var(--gold-soft);max-width:56ch;margin:1.2rem auto 0;line-height:1.5}
.bird-src{text-align:center;color:var(--ink-dim);font-size:.8rem;letter-spacing:.08em;
  text-transform:uppercase;margin-top:.9rem}

/* ─── ВИДЕТЬ ─── */
#see .motto{font-family:var(--disp);font-size:clamp(2rem,6vw,3.4rem);font-weight:600;
  text-align:center;margin:2rem 0 .4rem;
  background:linear-gradient(100deg,#f7dfa6,#e25c86 60%,#9b7fe0);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 26px rgba(226,92,134,.22))}
#see .motto-note{text-align:center;color:var(--gold);letter-spacing:.16em;
  text-transform:uppercase;font-size:.76rem}

/* ─── OUTRO ─── */
.next-title{color:var(--gold);letter-spacing:.16em;text-transform:uppercase;font-size:.78rem;margin-bottom:1.1rem}
.next-list{list-style:none;display:flex;flex-direction:column;gap:.8rem}
.next-list li{color:var(--ink-soft);padding-left:1.5rem;position:relative}
.next-list li::before{content:'✦';position:absolute;left:0;color:var(--g3);font-size:.85rem}

footer{text-align:center;padding:5vh 26px 7vh;position:relative;z-index:1;
  border-top:1px solid var(--line);max-width:680px;margin:0 auto}
footer .om{color:var(--gold);font-size:1.7rem}
a{color:var(--gold-soft)}