/* GEOCLYSM — «Разрез». Палитра взята из логотипа: базальт и магма. */
:root{
  --basalt:#08080a;
  --rock:#121115;
  --rock-2:#1b1a1f;
  --ash:#9a948c;
  --bone:#efe8dc;
  --accent:#ff5a14;
  --accent-2:#ffb14a;
  --accent-glow:rgba(255,90,20,.55);
  --dark:.62;

  --f-display:"Big Shoulders Display", "Arial Narrow", sans-serif;
  --f-read:"Newsreader", Georgia, serif;
  --f-mono:"IBM Plex Mono", ui-monospace, monospace;
  --display-weight:900;
  --display-track:.02em;

  --gutter:clamp(16px, 4vw, 56px);
  --rail:136px;
}
html[data-accent="ember"]{ --accent:#ffb14a; --accent-2:#ffe0a3; --accent-glow:rgba(255,177,74,.5); }
html[data-accent="ice"]{ --accent:#7fd3ff; --accent-2:#d9f3ff; --accent-glow:rgba(127,211,255,.45); }
html[data-font="b"]{ --f-display:"Fraunces", Georgia, serif; --display-weight:800; --display-track:0; }
html[data-font="c"]{ --f-display:"Space Grotesk", Arial, sans-serif; --f-read:"Inter", Arial, sans-serif; --display-weight:700; --display-track:-.01em; }

*{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:auto; }
body{
  margin:0; background:var(--basalt); color:var(--bone);
  font:18px/1.6 var(--f-read);
  overflow-x:hidden;
}
a{ color:inherit; }
img{ display:block; max-width:100%; }
:focus-visible{ outline:2px solid var(--accent); outline-offset:3px; }

/* переход по ссылке на раздел: не показываем первый экран по дороге */
html[data-jump="1"] body{ opacity:0; }
html[data-jump="0"] body{ opacity:1; transition:opacity .35s ease; }

/* плёночное зерно поверх всего */
.grain{
  position:fixed; inset:-50%; z-index:60; pointer-events:none; opacity:.07;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 1 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  animation:grain 1.2s steps(6) infinite;
}
@keyframes grain{ 0%{transform:translate(0,0)} 20%{transform:translate(-3%,2%)} 40%{transform:translate(2%,-3%)} 60%{transform:translate(-2%,-1%)} 80%{transform:translate(3%,3%)} 100%{transform:translate(0,0)} }

.kicker{ font:500 12px/1 var(--f-mono); letter-spacing:.24em; text-transform:uppercase; color:var(--accent); margin:0 0 20px; }

/* ================= ВЕРХНЯЯ ПЛАНКА ================= */
.bar{
  position:fixed; top:0; left:0; right:0; z-index:40;
  display:flex; justify-content:space-between; align-items:center; gap:16px;
  padding:14px var(--gutter);
  background:linear-gradient(to bottom, rgba(8,8,10,.85), rgba(8,8,10,0));
}
.bar-mark{ display:flex; align-items:center; gap:10px; text-decoration:none;
  font:var(--display-weight) 18px/1 var(--f-display); letter-spacing:.22em; }
.bar-mark img{ width:28px; height:28px; border-radius:50%; }
.bar-nav{ display:flex; gap:22px; font:500 12px/1 var(--f-mono); letter-spacing:.14em; text-transform:uppercase; }
.bar-nav a{ text-decoration:none; color:var(--ash); transition:color .2s; }
.bar-nav a:hover{ color:var(--bone); }
.bar-yt{ color:var(--accent) !important; }
/* кнопка меню: на компьютере не нужна */
.bar-burger{ display:none; width:44px; height:44px; padding:0; cursor:pointer; position:relative;
  background:rgba(8,8,10,.6); border:1px solid rgba(239,232,220,.28); border-radius:8px; }
.bar-burger span{ position:absolute; left:11px; right:11px; height:2px; background:var(--bone); transition:.25s; }
.bar-burger span:nth-child(1){ top:14px; }
.bar-burger span:nth-child(2){ top:21px; }
.bar-burger span:nth-child(3){ top:28px; }
html[data-menu="1"] .bar-burger span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
html[data-menu="1"] .bar-burger span:nth-child(2){ opacity:0; }
html[data-menu="1"] .bar-burger span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* ================= 1. КАМЕНЬ ================= */
.hero{ position:relative; height:100vh; height:100svh; overflow:hidden; background:
  radial-gradient(ellipse 60% 50% at 50% 55%, #1a1310 0%, var(--basalt) 70%); }
.hero-stage{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:clamp(18px, 3.5vh, 40px); padding:90px var(--gutter) 90px; }
.hero-word{
  position:absolute; top:50%; left:0; right:0; text-align:center; transform:translateY(-58%);
  font:var(--display-weight) clamp(90px, 21vw, 360px)/.8 var(--f-display);
  letter-spacing:var(--display-track); color:transparent;
  -webkit-text-stroke:2.2px rgba(255,170,105,.72); white-space:nowrap; user-select:none;
  text-shadow:0 0 34px rgba(255,90,20,.3), 0 0 90px rgba(255,90,20,.18);
}
.stone{
  position:relative; width:min(42vh, 62vw, 520px); aspect-ratio:1;
  --mx:50%; --my:48%; --r:46%;
  animation:heart 2s ease-in-out infinite;     /* пульс: сердце земли */
  will-change:transform;
}
.stone-heat{ animation:heartglow 2s ease-in-out infinite; }
/* волна от удара расходится по породе */
.stone::after{
  content:""; position:absolute; inset:-14%; border-radius:50%; pointer-events:none;
  border:1.5px solid var(--accent); opacity:0;
  animation:heartwave 2s ease-out infinite;
}
/* ---- пульс: сердце земли. Два удара и пауза, как настоящий. ---- */
@keyframes heart{
  0%   { transform:scale(1)     translateY(0); }
  5%   { transform:scale(1.062) translateY(-0.7%); }
  11%  { transform:scale(0.995) translateY(0.2%); }
  17%  { transform:scale(1.105) translateY(-1.2%); }
  26%  { transform:scale(1.005) translateY(0); }
  33%  { transform:scale(1)     translateY(0); }
  100% { transform:scale(1)     translateY(0); }
}
@keyframes heartglow{
  0%   { opacity:.5;  transform:scale(1); }
  5%   { opacity:.84; transform:scale(1.18); }
  11%  { opacity:.58; transform:scale(1.05); }
  17%  { opacity:1;   transform:scale(1.44); }
  30%  { opacity:.5;  transform:scale(1); }
  100% { opacity:.5;  transform:scale(1); }
}
@keyframes heartbright{
  0%   { filter:brightness(1); }
  5%   { filter:brightness(1.14); }
  11%  { filter:brightness(1.03); }
  17%  { filter:brightness(1.3); }
  30%  { filter:brightness(1); }
  100% { filter:brightness(1); }
}
@keyframes heartwave{
  0%   { opacity:0;  transform:scale(.86); }
  17%  { opacity:.45; transform:scale(.95); }
  46%  { opacity:0;  transform:scale(1.28); }
  100% { opacity:0;  transform:scale(1.28); }
}
@keyframes float{ 0%,100%{ transform:translateY(-1.2%) rotate(-1deg);} 50%{ transform:translateY(1.2%) rotate(1deg);} }
.stone-disc{ position:absolute; inset:0;
  -webkit-mask-image:radial-gradient(circle at 50% 50%, #000 52%, transparent 70%);
          mask-image:radial-gradient(circle at 50% 50%, #000 52%, transparent 70%); }
.stone img{ position:absolute; inset:0; width:100%; height:100%; object-fit:contain; user-select:none; }
/* холодный камень — тот же файл, погашенный фильтром при показе */
.stone-cold{ filter:grayscale(1) brightness(.36) contrast(1.3); }
/* горячий камень виден только в пятне фонаря */
.stone-hot{
  -webkit-mask-image:radial-gradient(circle at var(--mx) var(--my), #000 0, #000 calc(var(--r) * .45), transparent var(--r));
          mask-image:radial-gradient(circle at var(--mx) var(--my), #000 0, #000 calc(var(--r) * .45), transparent var(--r));
  filter:saturate(1.15) brightness(1.08);
}
.stone-heat{
  position:absolute; inset:-18%; border-radius:50%; pointer-events:none;
  background:radial-gradient(circle at var(--mx) var(--my), var(--accent-glow), transparent 62%);
  filter:blur(34px); opacity:.6; mix-blend-mode:screen;
}
.hero-copy{ position:relative; z-index:2; text-align:center; }
.hero-title{
  margin:0 auto; max-width:24ch;
  font:var(--display-weight) clamp(32px, 4.6vw, 70px)/.95 var(--f-display); letter-spacing:var(--display-track);
  text-transform:uppercase;
}
.hero-title{ position:relative; color:#6e6862; }

/* ---- буквы загораются под фонарём: холодная буква + её же горячий двойник ---- */
.wd{ display:inline-block; white-space:nowrap; }
.ch{ position:relative; display:inline-block; }
.ch::after{
  content:attr(data-c); position:absolute; left:0; top:0; pointer-events:none;
  opacity:var(--h, 0);
}
.hero-word .ch::after{
  color:rgba(255,186,120,.92); -webkit-text-stroke:1.6px rgba(255,226,186,.95);
  text-shadow:0 0 16px rgba(255,120,30,.95), 0 0 48px rgba(255,90,20,.55), 0 0 110px rgba(255,90,20,.32);
}
.hero-title .ch::after{
  color:var(--bone);
  text-shadow:0 0 20px var(--accent-glow), 0 0 52px rgba(255,90,20,.3);
}
html.no-motion .hero-title{ color:var(--bone); }
html.no-motion .ch::after{ display:none; }
.hero-sub{ margin:14px 0 0; font:italic 400 clamp(17px, 1.6vw, 22px)/1.4 var(--f-read); color:var(--ash); }
.hero-cue{ position:absolute; bottom:22px; left:50%; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:10px;
  font:500 11px/1 var(--f-mono); letter-spacing:.3em; text-transform:uppercase; color:var(--ash); }
.hero-cue i{ width:1px; height:36px; background:linear-gradient(var(--accent), transparent); animation:cue 2s ease-in-out infinite; transform-origin:top; }
@media (max-height: 760px){ .hero-cue{ display:none; } }
@keyframes cue{ 0%{transform:scaleY(0)} 50%{transform:scaleY(1)} 100%{transform:scaleY(0); transform-origin:bottom} }

.fall-video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; z-index:1; pointer-events:none; }
.fall-flash{ position:absolute; inset:0; pointer-events:none; opacity:0;
  background:radial-gradient(circle at 50% 50%, var(--accent-2) 0%, var(--accent) 22%, #4a1204 55%, var(--basalt) 80%); }
.fall-text{ position:absolute; inset:0; display:grid; place-content:center; text-align:center; padding:0 var(--gutter); pointer-events:none; }
.fall-text p{ margin:0; opacity:0; }
.fall-1{ opacity:1; }
.fall-1 .fw{ display:inline-block; opacity:0; transform:translateY(.45em); }
.fall-2{ transform:translateY(.4em); }
.fall-1{ font:var(--display-weight) clamp(40px, 7vw, 110px)/.95 var(--f-display); text-transform:uppercase; letter-spacing:var(--display-track); }
.fall-2{ margin-top:18px !important; font:italic 400 clamp(18px, 1.8vw, 26px)/1.4 var(--f-read); color:var(--accent-2); }

/* ================= ШКАЛА ГЛУБИНЫ ================= */
.gauge{
  position:fixed; z-index:30; left:0; top:0; bottom:0; width:var(--rail);
  pointer-events:none; opacity:0; transition:opacity .5s;
}
.gauge.on{ opacity:1; }
.gauge-rule{
  position:absolute; left:28px; top:90px; bottom:40px; width:14px;
  background:
    repeating-linear-gradient(to bottom, rgba(239,232,220,.35) 0 1px, transparent 1px 12px),
    repeating-linear-gradient(to bottom, rgba(239,232,220,.6) 0 1px, transparent 1px 60px);
  background-size:8px 100%, 14px 100%; background-repeat:repeat-y;
}
.gauge-read{
  position:absolute; left:50px; top:50%; transform:translateY(-50%);
  display:flex; flex-direction:column; gap:6px; white-space:nowrap;
}
.gauge-label{ font:500 10px/1 var(--f-mono); letter-spacing:.28em; text-transform:uppercase; color:var(--ash); }
.gauge-year{ font:var(--display-weight) 44px/.9 var(--f-display); color:var(--accent); text-shadow:0 0 18px var(--accent-glow); }
.gauge-sub, .gauge-layer{ font:400 10px/1.3 var(--f-mono); letter-spacing:.14em; text-transform:uppercase; color:var(--ash); }

/* ================= 3. СПУСК ================= */
.strata{ position:relative; background:var(--basalt); }
.seismo{ position:absolute; z-index:6; left:calc(var(--rail) - 22px); top:0; width:36px; height:100%; overflow:visible; pointer-events:none; }
.seismo path{ fill:none; stroke:var(--accent); stroke-width:1.4; filter:drop-shadow(0 0 5px var(--accent-glow)); }

.era{
  position:relative; z-index:3; padding:70px var(--gutter) 70px calc(var(--rail) + var(--gutter));
  display:flex; align-items:center; gap:22px;
  font:500 12px/1 var(--f-mono); letter-spacing:.3em; text-transform:uppercase; color:var(--ash);
  background:linear-gradient(var(--basalt), var(--rock));
}
.era::before, .era::after{ content:""; flex:1; height:1px; background:linear-gradient(90deg, transparent, rgba(239,232,220,.25), transparent); }
.era b{ font:var(--display-weight) 32px/1 var(--f-display); letter-spacing:.08em; color:var(--bone); }

.stratum{
  position:relative; min-height:88vh; margin-top:-6vw;
  display:grid; align-items:center;
  padding:calc(4vw + 40px) var(--gutter) calc(4vw + 60px) calc(var(--rail) + var(--gutter));
  overflow:hidden; isolation:isolate;
}
.stratum:first-of-type{ margin-top:0; }
.stratum-bg{ position:absolute; inset:-6% 0; z-index:-2; }
/* рваный край: размытая маска вместо обрезки — переход в пласт под ним мягкий */
.stratum{
  /* нижний слой маски заходит под полосу на 4px — без щели на стыке */
  -webkit-mask-size:100% 6vw, 100% calc(100% - 6vw + 4px);  mask-size:100% 6vw, 100% calc(100% - 6vw + 4px);
  -webkit-mask-position:top, bottom;      mask-position:top, bottom;
  -webkit-mask-repeat:no-repeat;          mask-repeat:no-repeat;
  -webkit-mask-composite:source-over;     mask-composite:add;
}
.stratum-bg img{ width:100%; height:100%; object-fit:cover; }
.bg-cover{ display:none; filter:blur(9px) saturate(.9) brightness(.95); transform:scale(1.08); }
/* живой фон занимает пласт целиком. Неподвижного кадра при живом фоне нет:
   он остаётся только как заглушка на те секунды, пока ролик грузится. */
.bg-video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  opacity:0; transition:opacity .8s ease; pointer-events:none; }
.bg-video.on{ opacity:1; }
.stratum-bg .bg-frame{ transition:opacity .8s ease; }
.stratum-bg.live .bg-frame{ opacity:0; }
html[data-bg="cover"] .bg-video, html[data-bg="none"] .bg-video{ display:none; }
html[data-bg="cover"] .bg-frame{ display:none; }
html[data-bg="cover"] .bg-cover{ display:block; }
html[data-bg="none"] .stratum-bg{ display:none; }
html[data-bg="none"] .stratum::before{ background:linear-gradient(180deg, #121115, #0a0a0c), var(--tint); }
.stratum::before{ /* затемнение для читаемости + оттенок силы */
  content:""; position:absolute; inset:0; z-index:-1;
  background:
    linear-gradient(90deg, rgba(8,8,10,calc(var(--dark) + .25)) 0%, rgba(8,8,10,var(--dark)) 45%, rgba(8,8,10,calc(var(--dark) - .25)) 100%),
    linear-gradient(0deg, rgba(8,8,10,.85), transparent 35%),
    var(--tint);
}
.stratum.f-fire { --tint:linear-gradient(180deg, rgba(255,90,20,.10), rgba(120,20,0,.20)); }
.stratum.f-water{ --tint:linear-gradient(180deg, rgba(20,80,110,.14), rgba(0,20,40,.30)); }
.stratum.f-ice  { --tint:linear-gradient(180deg, rgba(170,210,235,.10), rgba(20,40,60,.25)); }
.stratum.f-earth{ --tint:linear-gradient(180deg, rgba(150,110,60,.14), rgba(40,25,10,.28)); }
.stratum.f-air  { --tint:linear-gradient(180deg, rgba(120,140,110,.12), rgba(15,25,20,.30)); }
.stratum-edge{ position:absolute; left:0; top:0; width:100%; height:6vw; z-index:2; pointer-events:none; }
.stratum-edge polyline{ fill:none; stroke:rgba(239,232,220,.22); stroke-width:.12; vector-effect:non-scaling-stroke;
  filter:blur(2.2px); }

.stratum-inner{ position:relative; display:grid; grid-template-columns:minmax(0,1fr); gap:10px; max-width:1180px; width:100%; }
.s-year{
  font:var(--display-weight) clamp(110px, 17vw, 280px)/.8 var(--f-display); letter-spacing:var(--display-track);
  color:transparent; -webkit-text-stroke:1.5px rgba(239,232,220,.55);
  margin:0 0 6px -0.04em; transition:color .6s, -webkit-text-stroke-color .6s;
}
.stratum.is-on .s-year{ color:rgba(239,232,220,.06); -webkit-text-stroke-color:var(--accent); }
.s-meta{ display:flex; flex-wrap:wrap; gap:8px 22px; font:500 12px/1.4 var(--f-mono); letter-spacing:.2em; text-transform:uppercase; color:var(--ash); }
.s-meta .s-n{ color:var(--accent); }
.s-line{
  margin:14px 0 0; max-width:24ch;
  font:italic 400 clamp(28px, 3.6vw, 56px)/1.12 var(--f-read);
  text-wrap:balance;
}
.s-line .w{ display:inline-block; opacity:0; transform:translateY(.4em); }
.s-title{ margin:18px 0 0; max-width:52ch; font:500 15px/1.5 var(--f-mono); letter-spacing:.04em; color:rgba(239,232,220,.72); }
.s-card{
  margin-top:30px; display:block; width:min(440px, 100%); justify-self:start;
  text-decoration:none; border:1px solid rgba(239,232,220,.22); border-radius:4px; overflow:hidden;
  background:rgba(8,8,10,.78);
  transition:border-color .25s, transform .25s, box-shadow .25s;
}
.s-card{ transform-origin:left center; }
.s-card:hover{ border-color:var(--accent); transform:scale(1.06) translateY(-6px);
  box-shadow:0 26px 70px rgba(0,0,0,.65), 0 0 0 1px var(--accent-glow); }
.s-shot{ position:relative; display:block; aspect-ratio:16/9; background:#0c0b0e; }
.s-shot img{ width:100%; height:100%; object-fit:cover; }
.s-play{
  position:absolute; left:50%; top:50%; width:56px; height:56px; transform:translate(-50%,-50%);
  border-radius:50%; background:rgba(8,8,10,.62); border:1px solid rgba(239,232,220,.45);
  transition:background .25s, border-color .25s, transform .25s;
}
.s-play::after{ content:""; position:absolute; left:52%; top:50%; transform:translate(-50%,-50%);
  border-left:15px solid var(--bone); border-top:9px solid transparent; border-bottom:9px solid transparent; }
.s-card:hover .s-play{ background:var(--accent); border-color:var(--accent); transform:translate(-50%,-50%) scale(1.06); }
.s-card:hover .s-play::after{ border-left-color:#150800; }
.s-cardbar{ display:flex; align-items:baseline; justify-content:space-between; gap:14px; padding:14px 16px; }
.s-cardbar b{ font:700 13px/1.2 var(--f-mono); letter-spacing:.12em; text-transform:uppercase; }
.s-cardbar span{ font:400 12px/1.2 var(--f-mono); color:var(--ash); letter-spacing:.08em; white-space:nowrap; }

/* ================= 4. МЕТОД ================= */
.method{ position:relative; z-index:5; padding:140px var(--gutter) 120px calc(var(--rail) + var(--gutter));
  background:linear-gradient(var(--basalt), var(--rock) 40%, var(--basalt)); }
.method-title{ margin:0; max-width:18ch; font:var(--display-weight) clamp(40px, 6vw, 96px)/.92 var(--f-display); text-transform:uppercase; letter-spacing:var(--display-track); }
.method-grid{ margin-top:70px; display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:40px; max-width:1180px; }
.method-grid article{ border-top:1px solid rgba(239,232,220,.18); padding-top:22px; }
.method-n{ font:var(--display-weight) 56px/1 var(--f-display); color:var(--accent); }
.method-grid h3{ margin:14px 0 10px; font:700 22px/1.2 var(--f-display); text-transform:uppercase; letter-spacing:.06em; }
.method-grid p{ margin:0; color:rgba(239,232,220,.78); }
.method-note{ margin-top:80px; max-width:760px; font-size:16px; color:var(--ash); }
.method-note .team{ margin-top:22px; color:rgba(239,232,220,.8); font:400 14px/1.8 var(--f-mono); }
.method-note b{ color:var(--bone); }

/* ================= 5. ЗАПЕЧАТАННЫЕ ПЛАСТЫ ================= */
.sealed{ position:relative; z-index:5; padding:90px var(--gutter) 130px calc(var(--rail) + var(--gutter)); background:var(--basalt); }
.sealed-grid{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:28px; max-width:1180px; }
.slab{
  position:relative; overflow:hidden; padding:48px 40px; min-height:300px; border-radius:6px;
  background:
    radial-gradient(ellipse at 20% 0%, rgba(255,255,255,.04), transparent 60%),
    repeating-linear-gradient(115deg, rgba(255,255,255,.018) 0 2px, transparent 2px 9px),
    linear-gradient(160deg, #1d1b20, #0e0d10);
  border:1px solid rgba(239,232,220,.08);
}
.seam{ position:absolute; left:-10%; right:-10%; top:58%; height:2px; transform:rotate(-7deg);
  background:linear-gradient(90deg, transparent, var(--accent) 30%, var(--accent-2) 50%, var(--accent) 70%, transparent);
  box-shadow:0 0 18px var(--accent-glow); opacity:.35; animation:breathe 4.5s ease-in-out infinite; }
@keyframes breathe{ 0%,100%{opacity:.18} 50%{opacity:.55} }
.slab-state{ margin:0; font:500 11px/1 var(--f-mono); letter-spacing:.3em; text-transform:uppercase; color:var(--accent); }
.slab h3{ margin:14px 0 14px; font:var(--display-weight) clamp(44px, 5vw, 72px)/.9 var(--f-display); text-transform:uppercase; letter-spacing:var(--display-track); }
.slab p:last-child{ position:relative; margin:0; max-width:34ch; color:rgba(239,232,220,.7); font-size:16px; }

/* ================= 6. ЯДРО ================= */
.core{
  position:relative; z-index:5; text-align:center; padding:160px var(--gutter) 60px;
  background:radial-gradient(ellipse 70% 60% at 50% 115%, var(--accent) 0%, #6b1a04 30%, #1c0a05 55%, var(--basalt) 78%);
}
.core-title{ margin:0; font:var(--display-weight) clamp(56px, 10vw, 170px)/.85 var(--f-display); text-transform:uppercase; letter-spacing:var(--display-track); }
.core-mail{ margin:0; font:500 clamp(18px, 2.2vw, 28px)/1.3 var(--f-mono); }
.core-mails{ margin:30px 0 0; display:flex; flex-wrap:wrap; justify-content:center; gap:22px 56px; }
.core-mail-label{ display:block; margin-bottom:8px; font:500 11px/1.4 var(--f-mono); letter-spacing:.16em; text-transform:uppercase; color:rgba(239,232,220,.55); }
.core-mail a{ text-decoration:none; border-bottom:1px solid var(--accent); }
.core-note{ margin:18px auto 0; max-width:52ch; color:rgba(239,232,220,.75); font-size:16px; }
.core-links{ margin-top:44px; display:flex; justify-content:center; gap:14px; flex-wrap:wrap; }
.core-links a{ padding:12px 22px; border:1px solid rgba(239,232,220,.3); border-radius:999px; text-decoration:none;
  font:500 13px/1 var(--f-mono); letter-spacing:.16em; text-transform:uppercase; background:rgba(8,8,10,.35); }
.core-links a:hover{ border-color:var(--bone); }
.core-lang{ margin:60px 0 0; font:400 13px/1.5 var(--f-mono); color:rgba(239,232,220,.75); }
.core-copy{ margin:12px 0 0; font:400 12px/1.5 var(--f-mono); color:rgba(239,232,220,.55); }

/* ================= ПАНЕЛЬ ОСМОТРА ================= */
.tw-btn{ position:fixed; z-index:70; right:16px; bottom:16px; padding:10px 16px; border-radius:999px; cursor:pointer;
  border:1px solid rgba(239,232,220,.3); background:rgba(8,8,10,.8); color:var(--bone);
  font:500 12px/1 var(--f-mono); letter-spacing:.14em; text-transform:uppercase; backdrop-filter:blur(8px); }
.tw{ position:fixed; z-index:70; right:16px; bottom:62px; width:min(320px, calc(100vw - 32px)); padding:18px;
  background:rgba(18,17,21,.96); border:1px solid rgba(239,232,220,.15); border-radius:10px;
  display:grid; gap:14px; font:400 12px/1.3 var(--f-mono); }
.tw[hidden]{ display:none; }
.tw-h{ margin:0; color:var(--accent); letter-spacing:.2em; text-transform:uppercase; }
.tw label{ display:grid; gap:6px; color:var(--ash); }
.tw select, .tw input[type=range]{ width:100%; background:#0c0b0e; color:var(--bone); border:1px solid rgba(239,232,220,.2); border-radius:6px; padding:7px; font:inherit; }
.tw-row{ display:flex !important; align-items:center; gap:8px; }


/* ================= ЛЕВАЯ ШКАЛА: СПИСОК ВЫПУСКОВ ================= */
.rail{
  position:fixed; z-index:35; left:0; top:0; bottom:0; width:var(--rail);
  /* зона наведения чуть шире самой шкалы */
}
.rail-list{
  position:fixed; z-index:36; left:8px; top:50%; transform:translateY(-50%);
  max-height:calc(100vh - 90px); width:300px; padding:10px 8px;
  display:flex; flex-direction:column; gap:1px; overflow:auto; overscroll-behavior:contain;
  background:linear-gradient(100deg, rgba(14,13,17,.97), rgba(14,13,17,.82));
  border:1px solid rgba(255,140,60,.22); border-radius:16px;
  box-shadow:0 30px 90px rgba(0,0,0,.7);
  backdrop-filter:blur(10px);
  opacity:0; visibility:hidden; pointer-events:none;
  transform-origin:left center;
  transform:translateY(-50%) perspective(1100px) rotateY(-24deg) scale(.94);
  transition:opacity .28s ease, transform .34s cubic-bezier(.2,.8,.25,1), visibility .28s;
  scrollbar-width:thin; scrollbar-color:rgba(255,140,60,.45) transparent;
}
html[data-rail="1"] .rail-list{
  opacity:1; visibility:visible; pointer-events:auto;
  transform:translateY(-50%) perspective(1100px) rotateY(-7deg) scale(1);
}
.rail-item{
  display:flex; align-items:baseline; gap:10px; padding:5px 12px;
  border:0; background:none; color:var(--ash); cursor:pointer; text-align:left;
  font:500 11px/1.25 var(--f-mono); letter-spacing:.1em; text-transform:uppercase;
  border-radius:8px; white-space:nowrap;
  transform:translateX(var(--curve, 0px));
  transition:transform .18s ease, color .18s, background .18s;
}
.rail-item b{ min-width:44px; color:rgba(239,232,220,.75); font-weight:700; }
.rail-item span{ overflow:hidden; text-overflow:ellipsis; }
.rail-item:hover, .rail-item:focus-visible{
  color:var(--bone); background:rgba(255,90,20,.14); outline:none;
  transform:translateX(calc(var(--curve, 0px) + 8px)) scale(1.07);
}
.rail-item:hover b, .rail-item[aria-current="true"] b{ color:var(--accent); }
.rail-item[aria-current="true"]{ color:var(--bone); background:rgba(255,90,20,.1); }
.rail-hint{
  position:fixed; z-index:34; left:10px; top:50%; transform:translateY(-50%) rotate(180deg);
  writing-mode:vertical-rl; font:500 10px/1 var(--f-mono); letter-spacing:.34em;
  text-transform:uppercase; color:rgba(239,232,220,.3); pointer-events:none;
  transition:opacity .25s;
}
html[data-rail="1"] .rail-hint{ opacity:0; }
@media (max-width: 1100px){ .rail-hint{ display:none; } }
@media (max-width: 820px){ .rail, .rail-list, .rail-hint{ display:none; } }

/* ================= ТЕЛЕФОН ================= */
@media (max-width: 820px){
  :root{ --rail:0px; }
  body{ font-size:17px; }
  /* меню под кнопкой: без него на телефоне некуда деться, кроме как свайпать */
  .bar-burger{ display:block; }
  .bar-nav{
    position:fixed; left:12px; right:12px; top:68px; z-index:45;
    flex-direction:column; gap:0; padding:6px;
    background:rgba(14,13,17,.97); border:1px solid rgba(239,232,220,.16); border-radius:12px;
    box-shadow:0 24px 60px rgba(0,0,0,.6); backdrop-filter:blur(10px);
    opacity:0; visibility:hidden; transform:translateY(-10px); transition:.22s;
  }
  html[data-menu="1"] .bar-nav{ opacity:1; visibility:visible; transform:none; }
  .bar-nav a{ padding:15px 14px; font-size:13px; letter-spacing:.18em; color:var(--bone);
    border-bottom:1px solid rgba(239,232,220,.08); }
  .bar-nav a:last-child{ border-bottom:0; }
  .stone{ width:min(78vw, 46vh, 420px); }
  .hero-word{ transform:translateY(-90%); }
  .gauge{ left:12px; right:auto; top:auto; bottom:14px; width:auto; }
  /* на узком экране слово за камнем прячем: камень закрывает середину,
     остаются обрубки букв. Фонарь на телефоне работает по заголовку. */
  .hero-word{ display:none; }
  .gauge-rule{ display:none; }
  .gauge-read{ position:static; transform:none; flex-direction:row; align-items:baseline; gap:10px;
    padding:8px 14px; border-radius:999px; background:rgba(8,8,10,.7); border:1px solid rgba(239,232,220,.14); backdrop-filter:blur(8px); }
  .gauge-year{ font-size:24px; }
  .gauge-label, .gauge-sub{ display:none; }
  .seismo{ left:6px; width:18px; }
  .stratum{ min-height:auto; padding:calc(8vw + 70px) var(--gutter) calc(8vw + 60px) calc(var(--gutter) + 14px); }
  .era{ padding-left:calc(var(--gutter) + 14px); }
  .s-year{ font-size:31vw; }
  .s-line{ font-size:clamp(26px, 7.4vw, 36px); }
  .s-card{ margin-top:24px; }
  .method, .sealed{ padding-left:var(--gutter); }
  .method-grid, .sealed-grid{ grid-template-columns:minmax(0,1fr); gap:34px; }
  .slab{ padding:36px 26px; min-height:0; }
}

/* ================= БЕЗ ДВИЖЕНИЯ ================= */
html[data-fall="1"] .stone, html[data-fall="1"] .stone::after, html[data-fall="1"] .stone-heat{
  animation-play-state:paused;
}
html.no-motion .stone, html.no-motion .stone::after, html.no-motion .stone-heat,
html.no-motion .grain, html.no-motion .hero-cue i,
html.no-motion .seam{ animation:none; }
html.no-motion .s-line .w{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){
  .stone, .stone::after, .stone-heat, .grain, .hero-cue i, .seam{ animation:none; }
  .s-line .w{ opacity:1 !important; transform:none !important; }
}
.stone-wrap{ position:relative; will-change:transform; }


/* ================= ПЕРЕХОД В КАТАЛОГ ================= */
.strata-end{ position:relative; z-index:7; padding:70px var(--gutter) 90px calc(var(--rail) + var(--gutter)); background:var(--basalt); }
.all-link{ display:inline-flex; align-items:center; gap:14px; text-decoration:none;
  font:var(--display-weight) clamp(26px, 3.4vw, 46px)/1 var(--f-display); text-transform:uppercase; letter-spacing:var(--display-track);
  border-bottom:1px solid rgba(239,232,220,.3); padding-bottom:10px; transition:color .25s, border-color .25s; }
.all-link i{ font-style:normal; color:var(--accent); transition:transform .25s; }
.all-link:hover{ color:var(--accent); border-color:var(--accent); }
.all-link:hover i{ transform:translateX(8px); }

/* ================= КАТАЛОГ ВЫПУСКОВ ================= */
.cat{ padding:130px var(--gutter) 40px; max-width:1480px; margin:0 auto; }
.cat-title{ margin:0; font:var(--display-weight) clamp(46px, 8vw, 128px)/.88 var(--f-display); text-transform:uppercase; letter-spacing:var(--display-track); }
.cat-sub{ margin:18px 0 0; max-width:60ch; color:var(--ash); }
.cat-tools{ display:flex; flex-wrap:wrap; gap:14px 10px; align-items:center; margin:46px 0 10px; }
.chip{ padding:9px 16px; border-radius:999px; cursor:pointer; background:transparent; color:var(--ash);
  border:1px solid rgba(239,232,220,.22); font:500 12px/1 var(--f-mono); letter-spacing:.14em; text-transform:uppercase; transition:.2s; }
.chip:hover{ color:var(--bone); border-color:rgba(239,232,220,.5); }
.chip[aria-pressed="true"]{ background:var(--accent); border-color:var(--accent); color:#150800; }
.cat-search{ flex:1 1 220px; min-width:200px; padding:10px 14px; border-radius:999px; background:#0e0d11; color:var(--bone);
  border:1px solid rgba(239,232,220,.22); font:400 13px/1 var(--f-mono); }
.cat-count{ font:400 12px/1 var(--f-mono); color:var(--ash); letter-spacing:.14em; text-transform:uppercase; }
.cat-grid{ display:grid; gap:34px 26px; grid-template-columns:repeat(auto-fill, minmax(300px, 1fr)); margin:34px 0 0; padding:0; list-style:none; }
.cat-card{ display:flex; flex-direction:column; text-decoration:none; }
.cat-shot{ position:relative; display:block; aspect-ratio:16/9; overflow:hidden; border-radius:4px; background:#0c0b0e;
  border:1px solid rgba(239,232,220,.12); transition:border-color .25s, transform .25s, box-shadow .25s; }
.cat-shot img{ width:100%; height:100%; object-fit:cover; transition:transform .5s, filter .3s; filter:saturate(.92); }
.cat-card:hover .cat-shot{ border-color:var(--accent); transform:translateY(-3px); box-shadow:0 18px 44px rgba(0,0,0,.55); }
.cat-card:hover .cat-shot img{ transform:scale(1.04); filter:saturate(1.05); }
.cat-dur{ position:absolute; right:8px; bottom:8px; padding:3px 8px; border-radius:3px; background:rgba(8,8,10,.86);
  font:500 11px/1 var(--f-mono); letter-spacing:.06em; }
.cat-meta{ margin:14px 0 0; display:block; font:500 11px/1 var(--f-mono); letter-spacing:.2em; text-transform:uppercase; color:var(--accent); }
.cat-name{ margin:9px 0 0; font:500 16px/1.35 var(--f-read); color:var(--bone); }
.cat-line{ margin:8px 0 0; font:italic 400 15px/1.4 var(--f-read); color:var(--ash); }
.cat-empty{ margin:60px 0; color:var(--ash); font:400 15px/1.5 var(--f-mono); }
@media (max-width: 820px){
  .strata-end{ padding-left:var(--gutter); }
  .cat{ padding-top:96px; }
  .cat-grid{ grid-template-columns:minmax(0,1fr); gap:28px; }
}

/* узкие телефоны (320–360): строка карточки переносится, а не режется */
@media (max-width: 360px){
  .s-cardbar{ flex-wrap:wrap; gap:6px 12px; padding:12px 14px; }
  .s-cardbar b{ font-size:12px; }
}