/* Заготовка 03.11.2026 (владелец: «трейлер и постер пока не будем выкладывать… пусть лежит заготовкой отдельной»).
   Подключается только при PROMO_ON = True в tools/build_site.py; токены цвета и отступов — из site.css. */
/* 03.11.2026: первый экран — трейлер проекта (владелец: «первый экран под трейлер… даже с автозапуском»): идёт сам, без звука, по кругу, в раме;
   со звуком — в окне .tr; загадка — второй экран (#zagadka). Постер — в «О проекте» (.poster). Макеты: mockups/promo-20261103/ */
.promo{position:relative;min-height:100vh;min-height:100svh;display:grid;align-items:center;padding:110px var(--gutter) 90px;box-sizing:border-box;
  background:radial-gradient(70% 90% at 68% 45%,rgba(58,27,40,.95) 0%,var(--wall) 55%,var(--night) 100%)}
.promo__in{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,5vw,90px);align-items:center}
.promo__t{margin:0;font-size:clamp(2.4rem,4.3vw,4.4rem);line-height:.98}
.promo__tag{margin:26px 0 0;font-family:var(--display);font-stretch:75%;font-weight:200;font-size:clamp(1.4rem,2.2vw,2rem);line-height:1.15;color:var(--gold-hi)}
.promo__lede{margin:18px 0 0;color:var(--ivory-2);max-width:34ch}
.promo__row{display:flex;flex-wrap:wrap;gap:12px 14px;margin-top:34px}
.promo__row .btn svg{width:9px;height:10px;margin-right:10px}
.promo__screen{--frame-w:clamp(16px,2.2vw,34px)}
.promo__v{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;background:#000}
@media (max-width:760px){.promo{min-height:0;padding:76px var(--gutter) 48px}.promo__in{grid-template-columns:1fr;gap:30px}.promo__screen{order:-1;--frame-w:14px}
  .promo__t{font-size:clamp(2.2rem,11vw,3rem)}.promo__row .btn{flex:1 1 auto;justify-content:center}}
.tr{padding:0;border:0;background:transparent;width:min(1120px,calc(100vw - 2*var(--gutter)));max-width:none;max-height:none;overflow:visible;color:var(--ivory)}
.tr::backdrop{background:rgba(10,5,8,.92)}
.tr .gilt{--frame-w:clamp(12px,1.8vw,28px)}
.tr video{display:block;width:100%;aspect-ratio:16/9;background:#000}
.tr__x{position:absolute;right:0;top:-56px;width:44px;height:44px;border:1px solid var(--gold-lo);border-radius:50%;background:rgba(18,10,14,.8);color:var(--ivory);font-size:24px;line-height:1;cursor:pointer}
.tr__x:hover{border-color:var(--gold)}
.poster{display:block;width:min(100%,330px);margin:48px 0 0}
.poster .gilt{display:block;--frame-w:clamp(14px,1.5vw,22px)}
.poster .gilt__in{display:block}
.poster .gilt__in>img{aspect-ratio:2737/4096}
@media (max-width:900px){.poster{margin:36px 0 8px}}