/* Vid'Ograf v3 — каждая секция свёрстана по своему кадру из concepts/out:
   hA (первый экран), s2 работы, s3 весь день, s4 как снимаю, s5 MemSHOW, s6 обо мне, s7 контакты; телефон — m1, m2, m3.
   Замеры сняты в кадре 1536 px и переведены в vw: px / 15.36. */
:root{
  --bg:#15130F; --bg2:#221E18; --line:rgba(239,232,220,.16);
  --ink:#EFE8DC; --muted:#A79E90; --accent:#E2B866; --accent-ink:#1A140B;
  --wrap0:min(1444px, calc(100% - 6vw));
  --wrap:calc(100% - 4.7vw);
  --mono:'JetBrains Mono',ui-monospace,monospace;
  --disp:'Unbounded',sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);font-family:'Onest',system-ui,sans-serif;font-size:18px;line-height:1.5;-webkit-font-smoothing:antialiased}
img,video{display:block;max-width:100%}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;text-align:left}
ol,ul{list-style:none}
figure,blockquote{margin:0}
main{overflow-x:clip}
.wrap0{width:var(--wrap0);margin:0 auto}
.wrap{width:var(--wrap);margin:0 auto}
.disp{font-family:var(--disp);font-weight:800;letter-spacing:-.045em;line-height:.9}
.h2w{font-family:var(--disp);font-weight:700;letter-spacing:-.035em;line-height:1.06}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:8px;text-decoration:none;font-weight:600;white-space:nowrap;transition:background .2s,border-color .2s,color .2s}
.btn-main,.hdr-btn{background:var(--accent);color:var(--accent-ink)}
.btn-main:hover,.hdr-btn:hover{background:#ECC77E}
.btn-main{height:3.26vw;min-height:48px;padding:0 2.6vw;font-size:clamp(16px,1.17vw,19px)}
.btn-line{border:1px solid rgba(239,232,220,.55);font-weight:500}
.btn-line:hover{border-color:var(--accent);color:var(--accent)}
.tlink{font-size:clamp(16px,1.17vw,19px);text-decoration:none;border-bottom:1px solid var(--accent);padding-bottom:3px;white-space:nowrap}
.tlink:hover{color:var(--accent)}

.concept-line{display:none}
.concept-pill{position:fixed;right:16px;bottom:16px;z-index:40;padding:7px 14px;border-radius:999px;background:rgba(34,30,24,.88);color:var(--ink);font-size:12px;text-decoration:none;pointer-events:none;transition:opacity .2s;backdrop-filter:blur(4px)}
.concept-pill.is-hidden{opacity:0}

/* шапка */
.hdr{position:relative;height:4.17vw;min-height:58px;display:flex;align-items:center;border-bottom:1px solid var(--line)}
.logo{font-family:var(--disp);font-weight:700;font-size:1.82vw;letter-spacing:-.04em;text-decoration:none;line-height:1}
.nav{display:flex;gap:3.45vw;position:absolute;left:50%;transform:translateX(-52%)}
.nav a{font-size:1.1vw;text-decoration:none}
.nav a:hover{color:var(--accent)}
.hdr-phone{margin-left:auto;font-size:1.1vw;text-decoration:none;font-variant-numeric:tabular-nums}
.hdr-btn{margin-left:1.7vw;height:2.6vw;padding:0 1.6vw;font-size:1.05vw;border-radius:6px}

/* 01 первый экран (hA) */
.hero{padding-bottom:2.6vw}
.mark{font-family:var(--disp);font-weight:800;line-height:.8;letter-spacing:-.035em;white-space:nowrap;margin-top:1.95vw;position:relative;z-index:2;pointer-events:none}
/* Unbounded уже, чем буквы на картинке: scaleX 1.2 при 12.65vw даёт ширину кадра */
.mark span{display:inline-block;margin-left:.13vw;font-size:12.65vw;transform:scaleX(1.2);transform-origin:left top}
.hero-card{position:relative;display:block;width:calc(100% - 4.16vw);margin:.4vw auto 0;height:33.3vw;border-radius:1.45vw;overflow:hidden;background:#000;z-index:1}
.hero-video{width:100%;height:100%;object-fit:cover;object-position:50% 45%}
.play{position:absolute;left:50%;top:50%;width:4.95vw;height:4.95vw;min-width:52px;min-height:52px;transform:translate(-50%,-50%);border-radius:50%;background:rgba(21,19,15,.62);backdrop-filter:blur(6px);transition:transform .25s,background .25s}
.play::after{content:"";position:absolute;left:54%;top:50%;transform:translate(-50%,-50%);border-style:solid;border-width:.72em 0 .72em 1.15em;border-color:transparent transparent transparent var(--ink);font-size:clamp(10px,.85vw,15px)}
.js-play:hover .play{transform:translate(-50%,-50%) scale(1.08);background:rgba(21,19,15,.85)}
.cap{position:absolute;left:1.8vw;bottom:1.5vw;font-size:clamp(13px,.98vw,16px);text-shadow:0 1px 8px rgba(0,0,0,.5)}
.hero-row{display:grid;grid-template-columns:58.65% 1fr;margin-top:2.7vw}
.hero h1{font-size:5.05vw;font-weight:700;line-height:.95;letter-spacing:-.03em;padding-right:2vw;border-right:1px solid var(--line)}
.hero-side{padding-left:3.1vw}
.lead{font-size:clamp(17px,1.3vw,21px);line-height:1.42}
.acts{display:flex;align-items:center;gap:2vw;margin-top:1.3vw}
.hero .btn-main{width:18.9vw;padding:0}
.proof{margin-top:1.2vw;font-size:clamp(13px,.92vw,15px);color:var(--muted)}

.sec{padding:7.8vw 0 0}

/* 02 работы (s2) */
.work-head{display:grid;grid-template-columns:1fr 28.3vw;align-items:start;margin-bottom:1.1vw}
.work-h{font-size:10.6vw;line-height:.82;margin-left:.6vw}
.work-h span{display:inline-block;transform:scaleX(1.26);transform-origin:left top}
.work-side{padding-top:.8vw}
.work-side p{font-size:clamp(15px,1.12vw,18px);line-height:1.42}
.filters{display:flex;gap:2.25vw;margin-top:2.3vw}
.flt{font-size:clamp(15px,1.2vw,19px);padding:6px 0;border-bottom:2px solid transparent;transition:color .2s,border-color .2s}
.flt:hover{color:var(--accent)}
.flt.is-on{border-color:var(--accent)}
.grid{display:grid;gap:1.05vw}
.row-a,.row-b{display:grid;grid-template-columns:62.2fr 32.1fr;grid-template-rows:13.55vw 13.55vw;gap:1.05vw 1vw}
.row-a .card:first-child{grid-row:span 2}
.row-b{grid-template-columns:32.1fr 62.2fr}
.row-b .card:first-child{grid-column:2;grid-row:1/3}
.row-r{display:grid;grid-template-columns:repeat(4,1fr);gap:1.05vw}
.row-c{display:grid;grid-template-columns:1fr 1fr;gap:1.05vw}
.row-c .card{aspect-ratio:16/9}
.card{position:relative;display:block;width:100%;height:100%;border-radius:1.3vw;overflow:hidden;background:var(--bg2)}
.row-r .card{aspect-ratio:9/16}
.card img,.card video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1),opacity .3s}
.card video{opacity:0}
.card.is-preview video{opacity:1}
.card:hover img,.card:hover video{transform:scale(1.03)}
.card .play{width:5.5vw;height:5.5vw}
.row-a .card:not(:first-child) .play,.row-b .card:not(:first-child) .play{width:4.2vw;height:4.2vw}
.card-cap{position:absolute;left:1.6vw;bottom:1.25vw;right:1.6vw;font-family:var(--mono);font-size:clamp(12px,.98vw,15px);letter-spacing:-.01em;text-shadow:0 1px 8px rgba(0,0,0,.6)}
.card::after{content:"";position:absolute;inset:auto 0 0 0;height:30%;background:linear-gradient(transparent,rgba(0,0,0,.35));pointer-events:none}
.card .card-cap,.card .play{z-index:1}

/* 03 весь день (s3) */
.day-head{display:grid;grid-template-columns:62.5vw 1fr;align-items:start}
.day .h2w{font-size:4.62vw;margin-left:.9vw;padding-top:.2vw}
.day-note{border-left:1px solid var(--line);padding:2.6vw 0 2.4vw 2.15vw;font-size:clamp(14px,1.1vw,17px);line-height:1.5}
.day-stage{display:grid;grid-template-columns:69.75vw 1fr;gap:1.75vw;align-items:center;margin-top:1.95vw}
.day-screen{position:relative;height:29.75vw;border-radius:1.3vw;overflow:hidden;background:#000}
.day-screen img,.day-screen video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.day-screen video{opacity:0;transition:opacity .4s}
.day-screen.is-playing video{opacity:1}
.rec{position:absolute;top:1.3vw;left:1.4vw;display:flex;align-items:center;gap:.65vw;padding:.35vw .8vw;border-radius:999px;background:rgba(10,8,6,.45);backdrop-filter:blur(4px);font-family:var(--mono);font-size:clamp(12px,1.04vw,16px);text-shadow:0 1px 6px rgba(0,0,0,.5)}
.rec i{width:.8vw;height:.8vw;min-width:9px;min-height:9px;border-radius:50%;background:#E5483B;animation:blink 1.2s steps(2) infinite}
.rec b{font-weight:400}
@keyframes blink{50%{opacity:.15}}
.day-txt{font-size:clamp(18px,1.8vw,28px);line-height:1.37;transition:opacity .3s}
.tl{display:flex;gap:.72vw;margin-top:1.5vw}
.tl li{flex:179}
.tl li:nth-child(2){flex:218}.tl li:nth-child(3){flex:205}.tl li:nth-child(4){flex:206}.tl li:nth-child(5){flex:200}.tl li:nth-child(6){flex:205}.tl li:nth-child(7){flex:191}
.tl button{display:block;width:100%;position:relative}
.tl img{width:100%;height:10.55vw;object-fit:cover;border-radius:.9vw;border:2px solid transparent;transition:border-color .25s,opacity .25s;opacity:.82}
.tl button:hover img{opacity:1}
.tl .is-on img{border-color:var(--accent);opacity:1}
.tl-n{display:inline-block;margin-top:1.15vw;font-weight:600;font-size:clamp(15px,1.43vw,22px);color:var(--accent);margin-right:.9vw}
.tl-t{font-size:clamp(13px,1.17vw,18px)}
.tl-tc{display:block;position:relative;margin-top:1.4vw;padding-top:1.5vw;font-family:var(--mono);font-size:clamp(11px,1.04vw,16px);color:var(--muted)}
.tl-tc::before{content:"";position:absolute;left:0;right:-.72vw;top:0;height:1px;background:rgba(239,232,220,.45)}
.tl li:last-child .tl-tc::before{right:0}
.tl-tc::after{content:"";position:absolute;left:.4vw;top:-.25vw;width:.55vw;height:.55vw;min-width:7px;min-height:7px;border-radius:50%;background:var(--ink)}
.tl .is-on .tl-tc{color:var(--accent)}
.tl .is-on .tl-tc::after{background:var(--accent)}

/* 04 как снимаю (s4) */
.how-h{font-size:3.6vw;margin-left:.4vw}
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:1.56vw;margin-top:.7vw}
.trio figure{position:relative}
.trio-w{position:relative;z-index:2;font-size:10vw;line-height:.86;margin-bottom:-3.3vw;white-space:nowrap}
.trio-w span{display:inline-block;transform:scaleX(1.05);transform-origin:left top}
.trio img{width:100%;aspect-ratio:472/575;object-fit:cover;border-radius:1.3vw}
.trio figcaption{margin-top:1vw;font-size:clamp(15px,1.24vw,19px);line-height:1.47}
.num{display:block;font-family:var(--mono);font-size:clamp(13px,1.17vw,18px);color:var(--accent);margin-bottom:.7vw}
.tip{margin-top:1.3vw;border:1px solid rgba(239,232,220,.3);border-radius:.65vw;padding:1.15vw 1.95vw;font-size:clamp(15px,1.3vw,20px)}
.tip b{font-weight:700;margin-right:.6vw}

/* 05 MemSHOW (s5) */
.show-in{display:grid;grid-template-columns:36.5vw 1fr;gap:1.8vw;align-items:start}
.show-txt{padding-top:5.2vw;padding-left:.8vw}
.mono-l{font-family:var(--mono);font-size:clamp(13px,1.17vw,18px);letter-spacing:.06em;color:var(--muted)}
.show-h{font-size:5.75vw;line-height:.88;letter-spacing:-.06em;margin-top:2.3vw;white-space:nowrap;transform:scaleX(.86);transform-origin:left top}
.show-txt p:not(.mono-l){margin-top:2.6vw;font-size:clamp(16px,1.37vw,21px);line-height:1.52;max-width:31vw}
.show-txt p+p:not(.mono-l){margin-top:2vw}
.show-txt .btn-line{margin-top:2.6vw;width:19.5vw;height:4vw;min-height:48px;font-size:clamp(16px,1.3vw,20px)}
.mosaic{display:grid;grid-template-columns:438fr 418fr;grid-template-rows:27.5vw 15.6vw 16.2vw;gap:.95vw}
.tile{position:relative;display:block;width:100%;height:100%;border-radius:1.3vw;overflow:hidden;background:var(--bg2)}
.tile-big{grid-column:span 2}
.tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.tile:hover img{transform:scale(1.03)}
.tile::after{content:"";position:absolute;inset:auto 0 0 0;height:35%;background:linear-gradient(transparent,rgba(0,0,0,.4))}
.tile-cap{position:absolute;z-index:1;left:1.35vw;bottom:1.3vw;font-family:var(--mono);font-size:clamp(12px,1.04vw,16px);text-shadow:0 1px 8px rgba(0,0,0,.6)}
.tile-cap span{display:block;font-size:clamp(11px,.9vw,14px);color:rgba(239,232,220,.8);margin-bottom:.35vw}
.tile .play{z-index:1}

/* 06 обо мне (s6) */
.about-top{display:grid;grid-template-columns:1fr 38vw;gap:2vw;align-items:start}
.about-h{font-size:12.4vw;line-height:.94;letter-spacing:-.06em;margin-top:2.6vw}
.about-txt p{position:relative;margin-top:1.4vw;padding-top:1.7vw;font-size:clamp(17px,2.02vw,31px);line-height:1.5}
.about-txt p::before{content:"";position:absolute;left:0;top:0;width:3.4vw;height:1px;background:rgba(239,232,220,.5)}
.about-img{width:100%;height:44.4vw;object-fit:cover;border-radius:1.3vw}
.quote{display:flex;gap:2.3vw;margin-top:2.4vw;padding-left:.2vw}
.quote span{font-family:var(--disp);font-weight:800;font-size:7vw;line-height:.75;color:var(--accent);margin-top:.2vw}
.quote p{font-weight:700;font-size:3.4vw;line-height:1.24;letter-spacing:-.02em}
.facts{display:grid;grid-template-columns:1fr 1fr 1fr;margin-top:2.2vw;border-top:1px solid var(--line);padding-top:1.85vw}
.facts li{font-family:var(--mono);font-size:clamp(13px,1.24vw,19px);padding:.5vw 0}
.facts li:nth-child(2){text-align:center;border-left:1px solid var(--line);border-right:1px solid var(--line)}
.facts li:nth-child(3){text-align:right}

/* 07 контакты (s7) */
.contact{padding-top:7.8vw;overflow:hidden}
.final{position:relative;height:41.4vw;border-radius:1.45vw;overflow:hidden;border:1px solid rgba(239,232,220,.3);background:#000}
.final img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 0%;filter:brightness(1.22) contrast(1.04)}
.final::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,8,6,.3),transparent 60%),linear-gradient(transparent 50%,rgba(10,8,6,.45))}
.final-in{position:absolute;z-index:1;left:2vw;bottom:1.6vw}
.final-h{font-size:5.7vw;line-height:1.02;letter-spacing:-.05em}
.final-in p{margin-top:1.4vw;font-size:clamp(16px,1.43vw,22px)}
.btn-big{margin-top:2.2vw;width:25.7vw;height:4.1vw;min-height:52px;font-size:clamp(17px,1.56vw,24px);font-weight:700}
.channels{display:flex;justify-content:space-between;margin-top:3vw;padding-bottom:2.1vw;border-bottom:1px solid var(--line)}
.channels li{display:flex;flex-direction:column}
.channels li:last-child{align-items:flex-end}
.channels span{font-family:var(--mono);font-size:clamp(11px,.92vw,14px);color:var(--muted);letter-spacing:.04em}
.channels a{margin-top:.4vw;font-weight:600;font-size:2.2vw;letter-spacing:-.015em;text-decoration:none;font-variant-numeric:tabular-nums;transition:color .2s}
.channels a:hover{color:var(--accent)}
.ftr{display:flex;justify-content:space-between;margin-top:1.9vw;font-size:clamp(13px,1.1vw,17px)}
.ftr a{text-decoration:none}
.ftr a:hover{color:var(--accent)}
.endmark{height:9.7vw;overflow:hidden;margin-top:1.3vw;font-family:var(--disp);font-weight:800;line-height:.8;letter-spacing:-.035em;white-space:nowrap;color:rgba(239,232,220,.38);pointer-events:none;padding-left:1.6vw}
.endmark span{display:inline-block;font-size:12.65vw;transform:scaleX(1.2);transform-origin:left top}

/* превью на странице чуть контрастнее исходников, как на кадрах концепта; в плеере видео без правок */
.hero-video,.card img,.card video,.day-screen img,.day-screen video,.tl img,.trio img,.tile img,.about-img{filter:contrast(1.14) saturate(1.08) brightness(.98)}

.mbar{display:none}

/* плеер */
.player{margin:auto;padding:0;border:0;background:transparent;width:min(1280px,92vw);max-height:92vh;overflow:visible}
.player::backdrop{background:rgba(8,6,4,.94)}
.player video{width:100%;max-height:82vh;border-radius:8px;background:#000}
.player.is-v{width:min(460px,92vw)}
.player-t{margin-top:12px;color:var(--muted);font-size:15px}
.player-x{position:absolute;right:-8px;top:-52px;width:44px;height:44px;font-size:34px;line-height:1;color:var(--ink);text-align:center}

/* отфильтрованная сетка: горизонтальные по два, рилсы по четыре */
.grid.is-f .row-c .card{aspect-ratio:16/9}

@media (max-width:1100px){
  .nav{gap:2.4vw}
}

/* телефон: m1 первый экран, m2 работы, m3 контакты */
@media (max-width:820px){
  :root{--wrap0:calc(100% - 32px);--wrap:calc(100% - 32px)}
  body{font-size:16px;padding-bottom:76px}
  br{display:none}
  .concept-line{display:block;text-align:center;font-size:12px;line-height:1;padding:8px 16px;color:var(--muted);border-bottom:1px solid var(--line);width:calc(100% - 32px);margin:0 auto}
  .concept-pill{display:none}
  .hdr{height:64px;border:0}
  .logo,.nav{display:none}
  .hdr-phone{display:block;margin-left:0;padding:12px 0;font-size:17px}
  .hdr-btn{margin-left:auto;height:44px;padding:0 18px;font-size:16px;border-radius:8px}
  .hero{padding-bottom:8px}
  .mark{margin-top:6px}
  .mark span{margin-left:0;font-size:calc((100vw - 32px) / 7.42)}
  .hero-card{width:calc(100% - 20px);height:auto;aspect-ratio:977/560;margin-top:6px;border-radius:16px}
  .play{min-width:56px;min-height:56px}
  .cap{left:14px;bottom:12px;font-size:13px}
  .hero-row{display:block;margin-top:22px}
  .hero h1{font-size:clamp(30px,9.1vw,38px);line-height:1.05;border:0;padding:0}
  .hero-side{padding:0;margin-top:12px}
  .lead{font-size:16px;line-height:1.45}
  .acts{flex-direction:column;align-items:center;gap:6px;margin-top:20px}
  .hero .btn-main{width:100%;height:52px;font-size:17px}
  .tlink{padding:12px 0 3px;font-size:16px}
  .proof{display:none}
  .sec{padding-top:64px}
  .work-head{display:block;margin-bottom:16px}
  .work-h{font-size:calc((100vw - 32px) / 5.6);margin-left:0}
  .work-h span{transform:scaleX(1.2)}
  .work-side{padding-top:10px}
  .work-side p{font-size:14px}
  .filters{gap:8px;margin:14px -16px 0;padding:0 16px;overflow-x:auto;scrollbar-width:none}
  .filters::-webkit-scrollbar{display:none}
  .flt{flex:none;height:44px;padding:0 20px;border:1px solid rgba(239,232,220,.3);border-radius:999px;font-size:15px}
  .flt.is-on{border-color:var(--accent);color:var(--accent)}
  .grid{gap:10px}
  .row-a,.row-b{grid-template-columns:1fr 1fr;grid-template-rows:auto;gap:10px}
  .row-a .card:first-child,.row-b .card:first-child{grid-column:1/-1;grid-row:auto;aspect-ratio:16/9.4}
  .row-a .card:not(:first-child),.row-b .card:not(:first-child){grid-column:1/-1;aspect-ratio:16/9.4}
  .row-r{grid-template-columns:1fr 1fr;gap:10px}
  .row-c{grid-template-columns:1fr;gap:10px}
  .card{border-radius:14px}
  .card .play,.row-a .card:not(:first-child) .play,.row-b .card:not(:first-child) .play{width:56px;height:56px}
  .card-cap{left:12px;bottom:10px;right:12px;font-family:'Onest',sans-serif;font-size:13px}
  .day-head{display:block}
  .day .h2w{font-size:clamp(26px,7.6vw,32px);margin:0}
  .day-note{border:0;padding:12px 0 0;font-size:14px}
  .day-stage{display:block;margin-top:20px}
  .day-screen{height:auto;aspect-ratio:16/10;border-radius:14px}
  .rec{top:12px;left:12px;gap:6px;font-size:12px}
  .day-txt{margin-top:14px;font-size:17px;min-height:3em}
  .tl{margin:18px -16px 0;padding:0 16px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:16px;gap:10px;scrollbar-width:none}
  .tl::-webkit-scrollbar{display:none}
  .tl li,.tl li:nth-child(n){flex:0 0 132px;scroll-snap-align:start}
  .tl img{height:84px;border-radius:10px}
  .tl-n{margin-top:10px;font-size:15px;margin-right:6px}
  .tl-t{font-size:14px}
  .tl-tc{margin-top:10px;padding-top:12px;font-size:12px}
  .tl-tc::before{right:-10px}
  .tl-tc::after{top:-3px;left:4px}
  .how-h{font-size:clamp(24px,7vw,30px);margin:0}
  .trio{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:80%;gap:12px;margin:24px -16px 0;padding:0 16px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:16px;scrollbar-width:none}
  .trio::-webkit-scrollbar{display:none}
  .trio figure{scroll-snap-align:start}
  .trio-w{font-size:19vw;margin-bottom:-6vw}
  .trio img{border-radius:14px}
  .trio figcaption{margin-top:14px;font-size:15px}
  .num{margin-bottom:8px}
  .tip{margin-top:24px;padding:14px 16px;font-size:15px;border-radius:10px}
  .show-in{display:block}
  .show-txt{padding:0}
  .show-h{font-size:clamp(40px,12.6vw,56px);margin-top:14px}
  .show-h br{display:inline}
  .show-txt p:not(.mono-l){max-width:none;margin-top:18px;font-size:16px}
  .show-txt p+p:not(.mono-l){margin-top:12px}
  .show-txt .btn-line{width:100%;height:52px;margin-top:22px}
  .mosaic{margin-top:28px;grid-template-columns:1fr 1fr;grid-template-rows:auto;gap:10px}
  .tile-big{aspect-ratio:16/10}
  .tile:not(.tile-big){aspect-ratio:1/1}
  .tile{border-radius:14px}
  .tile-cap{left:12px;bottom:10px;font-size:12px}
  .about-top{display:flex;flex-direction:column-reverse;gap:24px}
  .about-h{font-size:calc((100vw - 32px) / 5.3);margin:0}
  .about-txt p{margin-top:20px;padding-top:16px;font-size:16px}
  .about-txt p::before{width:40px}
  .about-img{height:auto;aspect-ratio:4/3;border-radius:14px}
  .quote{gap:12px;margin-top:32px}
  .quote span{font-size:56px}
  .quote p{font-size:clamp(20px,6vw,26px)}
  .facts{grid-template-columns:1fr;margin-top:24px;padding-top:6px}
  .facts li,.facts li:nth-child(n){text-align:left;border:0;border-bottom:1px solid var(--line);padding:12px 0;font-size:14px}
  .contact{padding-top:64px}
  .final{height:auto;aspect-ratio:977/1300;border-radius:16px}
  .final img{height:52%;object-position:40% 35%}
  .final::after{background:linear-gradient(transparent 36%,#0d0b08 52%)}
  .final-in{left:16px;right:16px;bottom:16px}
  .final-h{font-size:calc((100vw - 64px) / 6.9);line-height:.95}
  .final-in p{margin-top:12px;font-size:15px}
  .btn-big{width:100%;height:52px;margin-top:18px;font-size:17px}
  .channels{flex-direction:column;margin-top:16px;padding:0;border:0}
  .channels li,.channels li:last-child{flex-direction:row;align-items:center;border-bottom:1px solid var(--line);min-height:56px}
  .channels li:first-child{border-top:1px solid var(--line)}
  .channels span{flex:0 0 38%;font-size:12px}
  .channels a{margin:0;padding:12px 0;font-weight:400;font-size:19px}
  .ftr{flex-direction:column;gap:4px;margin-top:16px;font-size:14px}
  .ftr a{padding:8px 0}
  .endmark{height:calc((100vw - 32px) / 7.42 * .78);margin-top:16px;padding:0 16px}
  .endmark span{font-size:calc((100vw - 32px) / 7.42)}
  .mbar{display:block;position:fixed;left:0;right:0;bottom:0;z-index:30;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:rgba(21,19,15,.94);backdrop-filter:blur(8px);border-top:1px solid var(--line);transform:translateY(110%);transition:transform .25s}
  .mbar.is-on{transform:none}
  .mbar .btn{width:100%;height:52px}
  .player-x{right:0;top:-50px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .rec i{animation:none}
  .card img,.card video,.tile img{transition:none}
}