@font-face{font-family:Forum;font-weight:400;font-display:swap;src:url(/assets/fonts/forum-cyrillic-400-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Forum;font-weight:400;font-display:swap;src:url(/assets/fonts/forum-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC}
@font-face{font-family:Jost;font-weight:300;font-display:swap;src:url(/assets/fonts/jost-cyrillic-300-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Jost;font-weight:300;font-display:swap;src:url(/assets/fonts/jost-latin-300-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC}
@font-face{font-family:Jost;font-weight:400;font-display:swap;src:url(/assets/fonts/jost-cyrillic-400-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Jost;font-weight:400;font-display:swap;src:url(/assets/fonts/jost-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC}

:root{
  --lagoon:#0c4347;
  --lagoon-deep:#072a2e;
  --sand:#f6ead6;
  --apricot:#f0b98d;
  --gutter:clamp(18px,2.6vw,40px);
  --expo:cubic-bezier(.16,1,.3,1);
}
*,*::before,*::after{box-sizing:border-box}
html{background:var(--lagoon-deep);color:var(--sand);-webkit-text-size-adjust:100%;scrollbar-color:var(--apricot) var(--lagoon-deep);scrollbar-width:thin}
html.lenis{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{margin:0;font:300 clamp(15px,1.15vw,18px)/1.4 Jost,system-ui,sans-serif;overflow-x:hidden}
::selection{background:var(--apricot);color:var(--lagoon-deep)}
:focus-visible{outline:1px solid var(--apricot);outline-offset:4px}
a{color:inherit;text-underline-offset:.25em;text-decoration-thickness:1px}
img{display:block}
p,h1,h2{margin:0;font-weight:inherit}

.film{position:relative}
.hero,.inside{position:relative;height:100vh;height:100svh;overflow:hidden}
.hero__img,.inside__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero__img{object-position:50% 100%}
.hero__veil{position:absolute;inset:0;background:var(--lagoon);opacity:0;pointer-events:none}

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

.bar{position:absolute;z-index:5;inset:0 0 auto;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:calc(var(--gutter)*.8 + env(safe-area-inset-top)) var(--gutter)}
.bar__credit{font-size:.875em;letter-spacing:.02em;text-decoration:none;border-bottom:1px solid transparent;transition:border-color .5s var(--expo)}
.bar__credit:hover{border-color:currentColor}
.lang{display:flex;gap:2px}
.lang button{all:unset;cursor:pointer;min-width:44px;min-height:44px;display:grid;place-items:center;font-size:.875em;letter-spacing:.08em;opacity:.62;transition:opacity .4s var(--expo)}
.lang button:hover,.lang button[aria-pressed="true"]{opacity:1}
.lang button:focus-visible{outline:1px solid var(--apricot);outline-offset:-6px}

.meta{position:absolute;z-index:3;inset:auto 0 0;display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:20px;padding:clamp(40px,7vh,72px) var(--gutter) calc(var(--gutter)*.9 + env(safe-area-inset-bottom));background:linear-gradient(to top,rgba(240,226,203,.92) 0,rgba(240,226,203,.72) 45%,rgba(240,226,203,0) 100%);color:var(--lagoon-deep);font-weight:400;font-size:clamp(15px,1.45vw,23px);letter-spacing:.005em}
.meta__place{text-align:right}
.meta__cue{display:block;width:1px;height:clamp(44px,6.5vh,72px);background:rgba(7,42,46,.24);overflow:hidden}
.meta__cue i{display:block;width:100%;height:100%;background:var(--lagoon-deep);transform:translateY(-100%);animation:cue 2.4s var(--expo) infinite}
@keyframes cue{0%{transform:translateY(-100%)}55%,100%{transform:translateY(100%)}}

.scene{position:absolute;inset:0;z-index:2;width:100%;height:100vh;height:100svh;display:block;pointer-events:none;overflow:hidden}

.inside__scrim{position:absolute;inset:0;background:linear-gradient(to top,rgba(7,42,46,.9) 0,rgba(7,42,46,.62) 30%,rgba(7,42,46,0) 62%)}
.inside__copy{position:absolute;inset:auto 0 0;padding:0 var(--gutter) calc(var(--gutter) + env(safe-area-inset-bottom));display:grid;justify-items:center;gap:clamp(14px,2vh,24px);text-align:center}
.inside__line{font:400 clamp(30px,4.3vw,72px)/1.06 Forum,Georgia,serif;letter-spacing:-.005em;max-width:20ch;text-wrap:balance}
.inside__note{font-size:.875em;color:rgba(246,234,214,.82);max-width:60ch}

/* Сцена с прокруткой: включается скриптом, без него секции просто идут подряд. */
.film.is-motion .inside{position:absolute;inset:0;z-index:3;visibility:hidden}
.film.is-motion .hero{z-index:1}

@media (max-width:640px){
  .hero__img{object-position:52% 100%}
  .meta{grid-template-columns:1fr auto;font-size:clamp(13px,3.7vw,15px);gap:10px;white-space:nowrap}
  .meta__cue{display:none}
  .bar__credit{font-size:13px}
  .inside__line{font-size:clamp(30px,8.6vw,40px)}
}
@media (prefers-reduced-motion:reduce){
  .meta__cue i{animation:none;transform:none}
}
