/* ============================================================
   HIDE /xx/investment — «Folio 1905»
   Продажа дома целиком. Грузится ПОСЛЕ css/styles.css и берёт оттуда токены (--bg, --ink*,
   --line*, --accent*, --ease*, --d*, --display, --sans, --r-lg, --pill), .btn*, .eyebrow,
   .serif, .logo, .foot*, баннер cookie (.cbnr). Всё своё — с префиксом .iv-, чтобы никогда не
   задеть страницы аренды.

   Идея. Страница — меморандум, отпечатанный на тёплой чёрной бумаге. «Органика и анти-сетка»
   взяты не из случайных клякс, а из самого здания: план Noliktavas 5 — клин вокруг двора, его
   длинная сторона идёт под ~57°. Этот угол — единственный «неровный» жест страницы: скос угла у
   ключевых фото-рам (всегда 57°: длина скоса фиксирована, а не в процентах — иначе угол менялся
   бы с пропорциями рамы), срез угла у полосы с цифрами с золотой волосяной линией по срезу,
   ступени тезисов, контур из 120 точек. Правила анти-сетки: элемент ломает сетку только по одной
   оси; текст сетку не покидает — за край уходят только фото, числа и SVG.
   Фотографии — единственный цвет; --accent — волосяная линия, фокус, текущая ячейка матрицы,
   точка на карте, «D» в логотипе. Больше нигде.
   ============================================================ */

.iv{
  /* шкала: 375 → 1440 px, линейно */
  --t-micro: clamp(0.6875rem, 0.6655rem + 0.0939vw, 0.75rem);   /* 11 → 12 */
  --t-small: clamp(0.8125rem, 0.7905rem + 0.0939vw, 0.875rem);  /* 13 → 14 */
  --t-body:  clamp(1rem, 0.978rem + 0.0939vw, 1.0625rem);       /* 16 → 17 */
  --t-lede:  clamp(1.125rem, 1.059rem + 0.2817vw, 1.3125rem);   /* 18 → 21 */
  --t-h3:    clamp(1.25rem, 1.12rem + 0.56vw, 1.625rem);        /* 20 → 26 */
  --t-h2:    clamp(2rem, 1.472rem + 2.254vw, 3.5rem);           /* 32 → 56 */
  --t-num:   clamp(2.5rem, 1.796rem + 3.005vw, 4.5rem);         /* 40 → 72 */
  --t-h1:    clamp(2.25rem, 1.2rem + 3.2vw, 4.1rem);            /* 36 → 66 */

  --ctl: rgba(245,240,232,.42);          /* рамки контролов: 3.6:1 на #0b0a09 (WCAG 1.4.11) */
  --gap: clamp(14px, 1.6vw, 24px);
  --gut: clamp(18px, 3vw, 40px);
  --sec-y: clamp(80px, 10vw, 152px);
  --bev: clamp(28px, 4.5vw, 72px);       /* скос: по горизонтали --bev, по вертикали ×1.54 = 57° */
  --bev-y: calc(var(--bev) * 1.54);
  --top-h: 66px;
  background:var(--bg);
}
/* /ru: у Newsreader и Schibsted Grotesk нет кириллицы — Literata и Golos Text вторыми в стеке
   (генератор грузит их только в URL шрифтов русской страницы). /lv: Literata ПЕРВОЙ, но её файл
   содержит только Ī и ī (text=) — у Newsreader эта буква сломана (см. tools/invest-build.js). */
html[lang="ru"]{
  --display:"Newsreader","Literata",Georgia,serif;
  --sans:"Schibsted Grotesk","Golos Text",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
html[lang="lv"]{ --display:"Literata","Newsreader",Georgia,serif; }
@media (prefers-reduced-motion:no-preference){ html:has(body.iv){ scroll-behavior:smooth; } }
html:has(body.iv){ scroll-padding-top:78px; }   /* 66 px шапка + 12 */

.iv-sr{ position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
.iv-skip{ position:fixed; left:12px; top:-60px; z-index:200; background:var(--ink); color:#14110c; padding:10px 16px; border-radius:var(--pill); font-weight:600; font-size:14px; transition:top var(--d-fast) var(--ease); }
.iv-skip:focus{ top:12px; }
.iv :focus-visible{ outline:2px solid var(--accent); outline-offset:3px; }
.iv h1, .iv h2, .iv h3, .iv .eyebrow{ text-wrap:balance; }
.iv p, .iv dd, .iv li{ text-wrap:pretty; }
.iv em{ font-style:italic; }

/* ---------- сетка фолио: 12 именованных колонок + две «полосы под обрез» ---------- */
.iv-grid{
  display:grid; column-gap:var(--gap);
  grid-template-columns:
    [full-start] minmax(var(--gut), 1fr)
    [wide-start] repeat(12, [col] minmax(0, calc((var(--maxw) - 11 * var(--gap)) / 12)))
    [wide-end] minmax(var(--gut), 1fr) [full-end];
}
.iv-grid > *{ grid-column:wide; min-width:0; }
.iv-bleed-r{ grid-column:col 7 / full-end; }
.iv-bleed-l{ grid-column:full-start / col 7; }

/* ---------- рамка-клин: один угол = план дома ---------- */
.iv-frame{
  position:relative; overflow:hidden; isolation:isolate; background:var(--surface-2);
  border-radius:var(--r-lg);
  border-bottom-right-radius:var(--bev) var(--bev-y);
}
.iv-frame--bl{ border-bottom-right-radius:var(--r-lg); border-bottom-left-radius:var(--bev) var(--bev-y); }
@supports (corner-shape: bevel){
  .iv-frame{ corner-bottom-right-shape:bevel; }
  .iv-frame--bl{ corner-bottom-right-shape:round; corner-bottom-left-shape:bevel; }
}
/* Без corner-shape (Safari, Firefox на 10.2026) эллиптический радиус читался бы как другая
   форма — режем тот же 57°-срез clip-path'ом, остальные углы остаются скруглёнными. */
@supports not (corner-shape: bevel){
  .iv-frame{ border-bottom-right-radius:0; clip-path:polygon(0 0, 100% 0, 100% calc(100% - var(--bev-y)), calc(100% - var(--bev)) 100%, 0 100%); }
  .iv-frame--bl{ border-bottom-left-radius:0; border-bottom-right-radius:var(--r-lg); clip-path:polygon(0 0, 100% 0, 100% 100%, var(--bev) 100%, 0 calc(100% - var(--bev-y))); }
}
.iv-bleed-r.iv-frame, .iv-bleed-r > .iv-frame:first-child{ border-top-right-radius:0; }
.iv-frame > img, .iv-frame > video{ width:100%; height:100%; object-fit:cover; display:block; }

/* ---------- числа ---------- */
.iv-num{
  font-family:var(--display); font-weight:300; letter-spacing:-0.03em; line-height:.92;
  font-variant-numeric:lining-nums tabular-nums; font-optical-sizing:auto; color:var(--ink);
}
@supports (text-box: trim-both cap alphabetic){ .iv-num{ text-box:trim-both cap alphabetic; } }
.iv-cur{ font-family:var(--sans); font-weight:400; font-size:.42em; vertical-align:.95em; margin-inline-end:.06em; letter-spacing:0; }
/* единицы — пропорциональные цифры: в табличных у Schibsted точка и запятая шириной в цифру
   («milj .», «тыс .») */
.iv-unit{ font-family:var(--sans); font-weight:400; font-size:.34em; letter-spacing:.01em; margin-inline-start:.12em; color:var(--ink-soft); font-variant-numeric:normal; }
html[lang="ru"] .iv-unit{ font-family:"Golos Text",var(--sans); }
.iv-label{ font:600 var(--t-micro)/1.35 var(--sans); letter-spacing:.14em; text-transform:uppercase; color:var(--ink-soft); }
.iv-fn{ font-size:var(--t-small); color:var(--ink-soft); line-height:1.55; max-width:68ch; }

/* ============ TOP BAR ============ */
.iv-top{ position:fixed; inset:0 0 auto; z-index:50; transition:background var(--d) var(--ease), border-color var(--d) var(--ease); border-bottom:1px solid transparent; }
.iv-top.solid{ background:color-mix(in srgb, var(--bg) 84%, transparent); backdrop-filter:blur(16px) saturate(140%); -webkit-backdrop-filter:blur(16px) saturate(140%); border-bottom-color:var(--line); }
.iv-top-in{ position:relative; max-width:calc(var(--maxw) + 2 * var(--gut)); margin:0 auto; padding:0 var(--gut); height:var(--top-h); display:flex; align-items:center; gap:28px; }
.iv-logo{ display:inline-flex; align-items:baseline; gap:12px; flex:none; }
.iv-logo small{ font-size:11px; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-soft); }
.iv-nav{ display:flex; gap:clamp(14px, 1.8vw, 26px); margin:0 auto; }
.iv-nav a{ font-size:13.5px; font-weight:500; color:var(--ink-soft); padding:6px 0; position:relative; transition:color var(--d-fast) var(--ease); }
.iv-nav a:hover, .iv-nav a.on{ color:var(--ink); }
.iv-nav a::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:var(--accent-line); transform:scaleX(0); transform-origin:0 50%; transition:transform var(--d) var(--ease); }
.iv-nav a.on::after{ transform:scaleX(1); }
.iv-top-r{ display:flex; align-items:center; gap:12px; margin-left:auto; }
.iv-nav + .iv-top-r{ margin-left:0; }
.iv-lang{ display:flex; gap:0; }
.iv-lang a{ font-size:12px; font-weight:700; letter-spacing:.04em; padding:13px 9px; color:var(--ink-soft); transition:color var(--d-fast) var(--ease); }
.iv-lang a.on, .iv-lang a:hover{ color:var(--ink); }
.iv-top-cta{ padding:11px 18px; font-size:13.5px; }
.iv-progress{ position:absolute; left:0; right:0; bottom:-1px; height:1px; background:var(--accent-line); transform-origin:0 50%; transform:scaleX(0); opacity:.8; }

/* ============ HERO ============
   Широкий экран: текст слева (6 колонок), фильм справа под обрез — весь ролик и guide price
   помещаются в первый экран 1440×900. Ролик сделан под показ ~800 px (его подписи ≥40 px из
   1920). Узкий экран: всё в столбец. */
.iv-hero{ position:relative; padding-top:calc(var(--top-h) + clamp(20px, 4vh, 64px)); padding-bottom:0; row-gap:24px; align-items:start; }
.iv-hero-copy{ grid-column:col 1 / col 6; grid-row:1; position:relative; z-index:2; padding-top:clamp(0px, 2vh, 24px); }
.iv-h1{ font-size:var(--t-h1); line-height:1; letter-spacing:-0.026em; font-weight:400; margin-top:20px; max-width:16ch; }
.iv-h1 em{ display:block; font-weight:300; color:var(--ink); }
html[lang="lv"] .iv-h1{ line-height:1.06; }
html[lang="ru"] .iv-h1{ max-width:20ch; }
.iv-hero-side{ margin-top:24px; }
.iv-lede{ font-size:var(--t-lede); line-height:1.5; color:var(--ink-soft); max-width:44ch; }
.iv-cta-row{ display:flex; flex-wrap:wrap; gap:12px; margin-top:24px; }

.iv-film{ grid-column:col 6 / full-end; grid-row:1; align-self:start; margin-top:28px; position:relative; z-index:1; }
/* 16:10 при ролике 16:9, ролик прижат к верху: нижние 10% — поле, и скос режет его, а не кадр.
   То, что видит каждый, кому фильм не играет (reduced motion, Save-Data, фоновая вкладка), — это
   постер (кадр 0 ролика: фасад + адрес + 1905), он в разметке, предзагружен с fetchpriority=high и
   является LCP. Фасад фоном под ним был бы вторым кандидатом в LCP, которого браузер не видит
   заранее: на проде 06.10.2026 Lighthouse то и дело выбирал его и показывал LCP 10 с вместо 2,6. */
.iv-film-frame{ aspect-ratio:16/10; background:#0b0a09; box-shadow:0 40px 120px -40px rgba(0,0,0,.7); outline:1px solid var(--line); outline-offset:-1px; }
.iv-film-frame > video{ object-fit:contain; object-position:50% 0; background:#0b0a09; }
.iv-film-btn{ position:absolute; left:16px; bottom:16px; width:44px; height:44px; border-radius:50%; border:1px solid var(--ctl); background:color-mix(in srgb, var(--bg) 60%, transparent); backdrop-filter:blur(8px); color:var(--ink); display:grid; place-items:center; transition:background var(--d-fast) var(--ease), transform var(--d-fast) var(--ease); }
.iv-film-btn:hover{ background:var(--surface-2); }
.iv-film-btn:active{ transform:scale(.95); }
.iv-film-btn svg{ width:18px; height:18px; grid-area:1/1; }
.iv-film-btn .i-play{ display:none; }
.iv-film-btn.is-paused .i-play{ display:block; }
.iv-film-btn.is-paused .i-pause{ display:none; }
.iv-film figcaption{ margin-top:14px; font-size:var(--t-small); color:var(--ink-soft); display:flex; align-items:center; gap:10px; }
.iv-film figcaption::before{ content:""; width:24px; height:1px; background:var(--accent-line); flex:none; }

/* entrance — только у глазка и кнопок: h1 и лид — это LCP, и затемнять их нельзя (ревью
   06.10.2026: 100 % времени LCP уходило на «render delay» анимации появления). Спрятано только
   при html.js, чтобы робот и человек без JS видели всё сразу. */
@keyframes iv-in{ from{ opacity:0; transform:translateY(16px); } to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion:no-preference){
  html.js .iv-fx{ animation:iv-in .8s var(--ease) both; }
}

.iv-kpis{ grid-column:wide; grid-row:2; display:grid; grid-template-columns:1.35fr repeat(4, minmax(0, 1fr)); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
/* размер числа — от ширины своей ячейки (container query): на 901–1199 px и в длинном
   латышском «€167 tūkst.» цифры иначе наезжали друг на друга */
.iv-kpi{ display:grid; grid-template-rows:auto 1fr; gap:12px; padding:16px 18px 20px; container-type:inline-size; }
.iv-kpi:first-child{ padding-left:0; }
.iv-kpi + .iv-kpi{ border-left:1px solid var(--line); }
.iv-kpi dd{ font-size:min(var(--t-num), 25cqi); align-self:end; white-space:nowrap; }
.iv-kpi--price dd{ font-size:min(clamp(3rem, 1.9rem + 4.6vw, 6.25rem), 36cqi); }

/* ============ SECTIONS ============ */
.iv-sec{ padding-top:var(--sec-y); padding-bottom:0; row-gap:clamp(32px, 5vw, 64px); align-items:start; }
.iv-head{ grid-column:col 1 / col 8; }
.iv-head h2{ font-size:var(--t-h2); line-height:1.02; letter-spacing:-0.022em; font-weight:400; }
.iv-head h2 em{ font-weight:300; }
html[lang="lv"] .iv-head h2{ line-height:1.08; }
.iv-head .eyebrow{ margin-bottom:20px; }
.iv-head-lede{ font-size:var(--t-lede); color:var(--ink-soft); line-height:1.55; margin-top:20px; max-width:52ch; }

/* ---------- THESIS ---------- */
.iv-thesis-ph{ grid-column:col 8 / full-end; grid-row:1 / span 2; aspect-ratio:4/5; }
#thesis .iv-head{ grid-row:1; }
.iv-thesis{ grid-column:col 1 / col 8; grid-row:2; list-style:none; display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); column-gap:var(--gap); row-gap:clamp(36px, 4vw, 56px); }
/* диагональные ступени: правая колонка опущена на «шаг» — это раскладка, не движение, поэтому
   остаются и при prefers-reduced-motion */
.iv-thesis li:nth-child(even){ transform:translateY(var(--step, clamp(40px, 7vw, 110px))); }
.iv-thesis li{ border-top:1px solid var(--line); padding-top:22px; }
.iv-thesis .iv-num{ font-size:var(--t-num); margin-bottom:22px; }
.iv-thesis h3{ font-family:var(--sans); font-size:var(--t-body); font-weight:600; letter-spacing:.01em; }
.iv-thesis p:not(.iv-num){ color:var(--ink-soft); font-size:var(--t-body); line-height:1.6; margin-top:10px; }
@media (min-width:1101px){
  .iv-thesis{ grid-column:wide; grid-row:3; grid-template-columns:repeat(3, minmax(0,1fr)); margin-top:clamp(24px, 4vw, 56px); padding-bottom:calc(var(--step, 96px) * 2); }
  .iv-thesis li:nth-child(even){ transform:none; }
  .iv-thesis li:nth-child(3n+2){ transform:translateY(calc(var(--step, 96px) * 1)); }
  .iv-thesis li:nth-child(3n){ transform:translateY(calc(var(--step, 96px) * 2)); }
  .iv-thesis-ph{ grid-column:col 9 / full-end; grid-row:1 / span 2; }
  #thesis .iv-head{ grid-row:1 / span 2; align-self:center; }
}

/* ---------- ASSET ---------- */
#asset .iv-head{ grid-row:1; }
.iv-facts{ grid-column:col 1 / col 7; grid-row:2; border-top:1px solid var(--line); }
.iv-facts > div{ display:grid; grid-template-columns:minmax(120px, 34%) 1fr; gap:18px; padding:15px 0; border-bottom:1px solid var(--line); }
.iv-facts dt{ font-size:var(--t-small); color:var(--ink-soft); padding-top:2px; }
.iv-facts dd{ font-size:var(--t-body); color:var(--ink); line-height:1.5; }
.iv-dd-n{ display:block; font-size:var(--t-small); color:var(--ink-soft); margin-top:2px; }
.iv-asset-ph{ grid-column:col 8 / full-end; grid-row:2; position:relative; padding-bottom:clamp(60px, 9vw, 140px); }
.iv-ph-street{ aspect-ratio:3/2; }
.iv-ph-stair{ position:absolute; left:calc(-1 * clamp(40px, 7vw, 110px)); bottom:0; width:46%; aspect-ratio:4/3; box-shadow:0 30px 80px -30px rgba(0,0,0,.8); outline:6px solid var(--bg); }

.iv-mix{ grid-column:col 1 / col 8; grid-row:3; margin-top:clamp(24px, 4vw, 64px); }
.iv-dots{ width:100%; height:auto; display:block; overflow:visible; }
.iv-dots circle{ fill:var(--ink); transition:opacity var(--d) var(--ease); }
.iv-dots circle.t-1bed{ fill:var(--ink-soft); }
.iv-dots circle.t-studio{ fill:transparent; stroke:var(--ink); stroke-width:1.4; }
.iv-dots circle.t-2bed{ fill:var(--ink); stroke:var(--accent); stroke-width:3; paint-order:stroke; }
.iv-dots[data-focus] circle{ opacity:.12; }
.iv-dots[data-focus="studio"] circle.t-studio,
.iv-dots[data-focus="1bed"] circle.t-1bed,
.iv-dots[data-focus="2bed"] circle.t-2bed{ opacity:1; }
.iv-dots-note{ margin-top:8px; text-align:right; font-size:var(--t-micro); letter-spacing:.12em; text-transform:uppercase; color:var(--ink-soft); }
@keyframes iv-dot{ from{ opacity:0; transform:scale(.2); } to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion:no-preference){
  html.js .iv-dots:not(.in) circle{ opacity:0; }
  /* backwards, не both: «both» держал opacity:1 после входа и глушил подсветку легенды */
  .iv-dots.in circle{ transform-box:fill-box; transform-origin:center; animation:iv-dot 420ms var(--ease) backwards; animation-delay:calc(var(--i, 0) * 6ms); }
}
.iv-mix-copy{ grid-column:col 9 / wide-end; grid-row:3; align-self:center; }
.iv-mix-copy h3{ font-size:var(--t-h3); line-height:1.15; font-weight:400; }
.iv-mix-copy > p{ color:var(--ink-soft); margin-top:14px; line-height:1.6; }
.iv-legend{ width:100%; border-collapse:collapse; margin-top:22px; }
.iv-legend th, .iv-legend td{ padding:12px 0; border-bottom:1px solid var(--line); text-align:left; font-size:var(--t-small); font-weight:500; }
.iv-legend thead th{ color:var(--ink-soft); font-weight:600; font-size:var(--t-micro); letter-spacing:.12em; text-transform:uppercase; padding-top:0; }
.iv-legend thead th:not(:first-child){ text-align:right; }
.iv-legend td{ text-align:right; color:var(--ink-soft); padding-left:14px; }
.iv-legend tbody th{ color:var(--ink); font-size:var(--t-body); }
.iv-legend .iv-lg{ display:inline-flex; align-items:center; gap:12px; }
.iv-legend tbody td:nth-child(2){ color:var(--ink); font-family:var(--display); font-size:1.5em; font-weight:400; font-variant-numeric:lining-nums; }
.iv-legend tbody tr{ cursor:default; }
.iv-legend .k{ width:14px; height:14px; border-radius:50%; flex:none; display:inline-block; }
.iv-legend .k-st{ border:1.4px solid var(--ink); }
.iv-legend .k-1b{ background:var(--ink-soft); }
.iv-legend .k-2b{ background:var(--ink); box-shadow:0 0 0 2.5px var(--accent); width:16px; height:16px; }

.iv-plan{ grid-column:full-start / col 11; grid-row:4; margin-top:clamp(24px, 5vw, 72px); position:relative; }
.iv-plan img{ width:100%; height:auto; opacity:.86; }
/* подпись — на краю колонок контента, а не на краю экрана */
.iv-plan figcaption{ font-size:var(--t-small); color:var(--ink-soft); margin-top:12px; padding-left:max(calc(var(--gut) + var(--gap)), calc((100vw - var(--maxw)) / 2)); }

/* ---------- NUMBERS: полоса со срезом угла под 57°, по срезу — золотая волосяная линия ---------- */
.iv-band{
  --cx: clamp(56px, 9vw, 140px);
  margin-top:var(--sec-y); padding-top:var(--sec-y); padding-bottom:var(--sec-y);
  background:
    linear-gradient(to top right, transparent calc(50% - .6px), var(--accent-line) 50%, transparent calc(50% + .6px)) 100% 0 / var(--cx) calc(var(--cx) * 1.54) no-repeat,
    var(--surface);
  clip-path:polygon(0 0, calc(100% - var(--cx)) 0, 100% calc(var(--cx) * 1.54), 100% 100%, 0 100%);
}
#numbers .iv-head{ grid-row:1; }
.iv-statement{ grid-column:col 1 / col 7; grid-row:2; }
.iv-tcap{ margin-bottom:14px; }
.iv-scroll{ overflow-x:auto; overscroll-behavior-x:contain; -webkit-overflow-scrolling:touch; }
.iv-scroll:focus-visible{ outline-offset:6px; }
/* пропорциональные цифры: в табличных у Schibsted запятая шириной в цифру («143 , 400»), и
   столбец «Год» не помещался; выравнивание держит text-align:right */
.iv-fin{ width:100%; border-collapse:collapse; font-variant-numeric:lining-nums; }
.iv-fin th, .iv-fin td{ padding:13px 0; border-bottom:1px solid var(--line); font-size:var(--t-body); }
.iv-fin thead th{ font-size:var(--t-micro); font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-soft); text-align:right; padding-top:0; padding-left:20px; }
.iv-fin th[scope="row"]{ text-align:left; font-weight:400; color:var(--ink-soft); padding-right:12px; }
.iv-fin th[scope="row"] a{ text-decoration:underline; text-decoration-color:var(--line-2); text-underline-offset:3px; }
.iv-fin th[scope="row"] a:hover{ text-decoration-color:var(--accent); color:var(--ink); }
.iv-fin td{ text-align:right; padding-left:20px; white-space:nowrap; color:var(--ink); }
.iv-fin td.neg{ color:var(--ink-soft); }
.iv-fin tr.total th, .iv-fin tr.total td{ color:var(--ink); font-weight:600; border-bottom:3px double var(--line-2); padding-top:16px; }
.iv-statement > .iv-fn{ margin-top:14px; }
.iv-ratios{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:0 var(--gap); margin-top:clamp(28px, 4vw, 48px); border-top:1px solid var(--line); }
.iv-ratios > div{ padding:22px 0 20px; border-bottom:1px solid var(--line); display:grid; grid-template-rows:subgrid; grid-row:span 3; gap:12px; }
.iv-ratios dd{ font-size:var(--t-num); }
.iv-ratios .iv-ratio-n{ font-size:var(--t-small); color:var(--ink-soft); }

.iv-calc{ grid-column:col 8 / wide-end; grid-row:2; background:var(--surface-2); border:1px solid var(--line); border-radius:var(--r-lg); border-bottom-right-radius:var(--bev) var(--bev-y); padding:clamp(22px, 2.6vw, 34px) clamp(22px, 2.6vw, 34px) calc(var(--bev-y) * .7 + 12px); }
@supports (corner-shape: bevel){ .iv-calc{ corner-bottom-right-shape:bevel; } }
@supports not (corner-shape: bevel){ .iv-calc{ border-bottom-right-radius:0; clip-path:polygon(0 0, 100% 0, 100% calc(100% - var(--bev-y)), calc(100% - var(--bev)) 100%, 0 100%); } }
.iv-calc h3{ font-size:var(--t-h3); font-weight:400; line-height:1.15; }
.iv-calc-p{ font-size:var(--t-small); color:var(--ink-soft); margin-top:10px; line-height:1.55; }
.iv-range{ display:block; margin-top:22px; }
.iv-range-l{ display:flex; justify-content:space-between; align-items:baseline; gap:12px; font-size:var(--t-small); color:var(--ink-soft); }
.iv-range-l output{ font-family:var(--display); font-size:1.6em; color:var(--ink); font-variant-numeric:lining-nums tabular-nums; }
.iv-range input{ width:100%; height:44px; accent-color:var(--accent); cursor:pointer; background:transparent; }
.iv-calc-out{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); border-top:1px solid var(--line); margin-top:10px; }
.iv-calc-out > div{ padding:14px 0; border-bottom:1px solid var(--line); display:flex; flex-direction:column; justify-content:space-between; gap:6px; }
.iv-calc-out > div:nth-child(odd){ padding-right:12px; }
.iv-calc-out span{ font-size:var(--t-micro); letter-spacing:.08em; text-transform:uppercase; color:var(--ink-soft); font-weight:600; }
.iv-calc-out b{ font-family:var(--display); font-weight:400; font-size:clamp(1.25rem, 1rem + .9vw, 1.75rem); font-variant-numeric:lining-nums; color:var(--ink); }
.iv-calc-out .hl b{ font-size:clamp(2rem, 1.4rem + 2vw, 3rem); }
.iv-calc .iv-tcap{ margin-top:24px; margin-bottom:8px; }
.iv-sens{ width:100%; border-collapse:separate; border-spacing:3px; font-variant-numeric:lining-nums; }
.iv-sens th{ font-size:var(--t-micro); font-weight:600; color:var(--ink-soft); padding:6px 4px; text-align:center; letter-spacing:.04em; }
.iv-sens thead th:first-child{ text-align:left; font-weight:500; letter-spacing:0; }
.iv-sens tbody th{ text-align:left; }
.iv-sens td{ font-size:var(--t-small); text-align:center; padding:9px 4px; border-radius:6px; cursor:pointer; color:var(--ink);
  background:color-mix(in oklab, var(--ink) calc(var(--v, 0) * 20% + 3%), transparent);
  transition:outline-color var(--d-fast) var(--ease); outline:1px solid transparent; outline-offset:-1px; }
.iv-sens td.is-now{ outline:1.5px solid var(--accent); background:color-mix(in oklab, var(--accent) 22%, transparent); }
.iv-calc > .iv-fn{ margin-top:16px; font-size:var(--t-micro); line-height:1.5; }

/* ---------- PLATFORM: две колонки возможностей (это не последовательность — без «ниточки») ---------- */
.iv-plat-side{ grid-column:col 1 / col 5; grid-row:1 / span 2; position:sticky; top:calc(var(--top-h) + 32px); }
.iv-lean{ margin-top:clamp(28px, 4vw, 48px); padding-top:24px; border-top:1px solid var(--line); }
.iv-lean .iv-num{ font-size:var(--t-num); margin-top:18px; }
.iv-lean-l{ font-size:var(--t-body); color:var(--ink); margin-top:14px; max-width:36ch; line-height:1.5; }
.iv-lean ul{ list-style:none; margin-top:16px; }
.iv-lean li{ font-size:var(--t-small); color:var(--ink-soft); padding:10px 0 10px 20px; border-top:1px solid var(--line); position:relative; line-height:1.5; }
.iv-lean li::before{ content:""; position:absolute; left:0; top:18px; width:8px; height:1px; background:var(--accent-line); }
.iv-thread{ grid-column:col 6 / wide-end; grid-row:1; list-style:none; display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); column-gap:var(--gap); row-gap:clamp(28px, 3vw, 40px); }
.iv-thread li{ border-top:1px solid var(--line); padding-top:18px; }
.iv-thread h3{ font-family:var(--display); font-weight:400; font-size:var(--t-h3); line-height:1.15; }
.iv-thread p{ color:var(--ink-soft); margin-top:10px; line-height:1.62; font-size:var(--t-body); }
.iv-plat-fn{ grid-column:col 6 / wide-end; grid-row:2; }

/* ---------- LOCATION ---------- */
#location .iv-head{ grid-row:1; }
.iv-map{ grid-column:full-start / col 7; grid-row:2; position:relative; }
.iv-map svg{ width:100%; max-width:720px; height:auto; display:block; margin-left:auto; overflow:visible; }
.iv-map .rings circle{ fill:none; stroke:var(--line-2); stroke-width:1; }
.iv-map .rings circle:first-child{ stroke:var(--ctl); }
.iv-map .ring-l text{ font:600 10.5px var(--sans); letter-spacing:.14em; fill:var(--ink-soft); text-transform:uppercase; }
.iv-map .pins circle{ fill:var(--ink); }
.iv-map .pins text{ font:500 14px var(--sans); fill:var(--ink); }
.iv-map .home circle:first-child{ fill:none; stroke:var(--accent); stroke-width:1.5; }
.iv-map .home circle:last-child{ fill:var(--accent); }
@keyframes iv-ring{ from{ opacity:0; transform:scale(.6); } to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion:no-preference){
  html.js .iv-map:not(.in) .rings circle{ opacity:0; }
  .iv-map.in .rings circle{ transform-box:view-box; transform-origin:50% 50%; animation:iv-ring .8s var(--ease) both; }
  .iv-map.in .rings circle:nth-child(2){ animation-delay:.12s; }
  .iv-map.in .rings circle:nth-child(3){ animation-delay:.24s; }
  .iv-map.in .rings circle:nth-child(4){ animation-delay:.36s; }
}
.iv-map figcaption{ font-size:var(--t-small); color:var(--ink-soft); margin-top:10px; text-align:right; }
.iv-loc-side{ grid-column:col 8 / wide-end; grid-row:2; }
.iv-near{ border-top:1px solid var(--line); }
.iv-near > div{ display:grid; grid-template-columns:minmax(118px, 36%) 1fr; gap:18px; align-items:baseline; padding:18px 0; border-bottom:1px solid var(--line); }
.iv-near dt{ font-size:clamp(2rem, 1.6rem + 1.4vw, 2.75rem); }
.iv-near dd{ color:var(--ink-soft); line-height:1.5; font-size:var(--t-body); }
.iv-loc-ph{ aspect-ratio:3/2; margin-top:clamp(28px, 4vw, 48px); }

/* ---------- INSIDE: «салонная развеска». Скос — только у первой (большой) фотографии:
   на каждой из восьми он читался бы как орнамент, а не как угол плана. ---------- */
.iv-gal{ grid-column:wide; display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); column-gap:var(--gap); row-gap:clamp(28px, 4vw, 56px); align-items:start; }
.iv-gal figure{ margin:0; }
.iv-gal .iv-frame{ aspect-ratio:var(--ar, 4/3); }
.iv-gal figure:not(.g1) .iv-frame{ border-radius:var(--r-lg); corner-shape:round; clip-path:none; }
.iv-gal figcaption{ font-size:var(--t-small); color:var(--ink-soft); margin-top:10px; }
.iv-gal .g1{ grid-column:1 / 8;  --ar:3/2; }
.iv-gal .g2{ grid-column:8 / 13; --ar:5/4; margin-top:clamp(40px, 8vw, 120px); }
.iv-gal .g3{ grid-column:2 / 7;  --ar:3/2; }
.iv-gal .g4{ grid-column:7 / 10; --ar:4/5; margin-top:clamp(20px, 4vw, 64px); }
.iv-gal .g5{ grid-column:10 / 13; --ar:4/5; }
.iv-gal .g6{ grid-column:1 / 6;  --ar:4/3; margin-top:clamp(-40px, -3vw, -20px); }
.iv-gal .g7{ grid-column:6 / 9;  --ar:1/1; margin-top:clamp(30px, 5vw, 80px); }
.iv-gal .g8{ grid-column:9 / 13; --ar:4/3; }

/* ---------- RIGA: список 2×2 в стиле списка расстояний ---------- */
.iv-riga{ grid-column:wide; display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); column-gap:calc(var(--gap) * 3); }
.iv-riga > div{ display:grid; grid-template-columns:minmax(150px, 38%) 1fr; gap:18px; align-items:baseline; padding:20px 0; border-top:1px solid var(--line); }
.iv-riga dt{ font-size:clamp(2rem, 1.6rem + 1.4vw, 2.75rem); }
.iv-riga dd{ color:var(--ink-soft); line-height:1.55; font-size:var(--t-body); }
.iv-riga-fn{ grid-column:wide; margin-top:-12px; }
.iv-riga-fn:empty{ display:none; }

/* ---------- PROCESS: крупные цифры, как в тезисах, без соединительной линии ---------- */
.iv-steps{ grid-column:wide; list-style:none; display:grid; grid-template-columns:repeat(6, minmax(0,1fr)); gap:var(--gap); counter-reset:st; }
.iv-steps li{ counter-increment:st; border-top:1px solid var(--line); padding-top:18px; }
.iv-steps li::before{ content:counter(st, decimal-leading-zero); display:block; font:300 var(--t-num)/.92 var(--display); letter-spacing:-.03em; color:var(--ink); font-variant-numeric:lining-nums; }
.iv-steps h3{ font-family:var(--sans); font-size:var(--t-body); font-weight:600; margin-top:18px; }
.iv-steps p{ font-size:var(--t-small); color:var(--ink-soft); margin-top:8px; line-height:1.55; }

/* ---------- FAQ ---------- */
#faq .iv-head{ grid-column:col 1 / col 5; position:sticky; top:calc(var(--top-h) + 32px); }
.iv-faq{ grid-column:col 6 / wide-end; grid-row:1; border-top:1px solid var(--line); }
.iv-faq details{ border-bottom:1px solid var(--line); }
.iv-faq summary{ list-style:none; cursor:pointer; padding:22px 44px 22px 0; position:relative; font-family:var(--display); font-size:clamp(1.15rem, 1rem + .6vw, 1.45rem); line-height:1.3; }
.iv-faq summary::-webkit-details-marker{ display:none; }
.iv-faq summary::after{ content:""; position:absolute; right:6px; top:50%; width:14px; height:14px; margin-top:-7px;
  background:linear-gradient(var(--ink-soft), var(--ink-soft)) 50% 50%/14px 1px no-repeat, linear-gradient(var(--ink-soft), var(--ink-soft)) 50% 50%/1px 14px no-repeat;
  transition:transform var(--d) var(--ease); }
.iv-faq details[open] summary::after{ transform:rotate(45deg); }
.iv-a{ color:var(--ink-soft); line-height:1.65; padding:0 44px 24px 0; max-width:64ch; }
@supports (interpolate-size: allow-keywords){
  .iv{ interpolate-size:allow-keywords; }
  .iv-faq details::details-content{ block-size:0; overflow:clip; transition:block-size var(--d) var(--ease), content-visibility var(--d) allow-discrete; }
  .iv-faq details[open]::details-content{ block-size:auto; }
}

/* ---------- CONTACT ---------- */
.iv-contact{ --pull:clamp(120px, 14vw, 220px); margin-top:var(--sec-y); padding-bottom:calc(var(--pull) + clamp(48px, 6vw, 96px)); }
.iv-contact-ph{ grid-column:full-start / full-end; grid-row:1; margin:0; height:clamp(320px, 56vw, 640px); position:relative; overflow:hidden; }
.iv-contact-ph img{ width:100%; height:100%; object-fit:cover; object-position:50% 40%; }
.iv-contact-ph::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(11,10,9,.15) 0%, rgba(11,10,9,.45) 60%, var(--bg) 100%); }
.iv-contact-panel{ grid-column:col 6 / wide-end; grid-row:1; align-self:end; margin-bottom:calc(-1 * var(--pull)); z-index:1; background:var(--surface); border:1px solid var(--line); padding:clamp(26px, 3.4vw, 48px) clamp(26px, 3.4vw, 48px) calc(var(--bev-y) * .6 + 16px); }
.iv-contact-panel h2{ font-size:var(--t-h2); line-height:1.04; font-weight:400; margin-top:16px; }
.iv-contact-p{ color:var(--ink-soft); font-size:var(--t-lede); line-height:1.55; margin-top:18px; max-width:46ch; }
.iv-mail{ margin-top:24px; display:flex; flex-wrap:wrap; align-items:center; gap:10px 16px; font-size:var(--t-body); }
.iv-mail a{ text-decoration:underline; text-decoration-color:var(--line-2); text-underline-offset:4px; }
.iv-mail a:hover{ text-decoration-color:var(--accent); }
.iv-copy{ background:transparent; border:1px solid var(--ctl); border-radius:var(--pill); padding:8px 16px; min-height:44px; font-size:13px; font-weight:600; color:var(--ink-soft); transition:color var(--d-fast) var(--ease), border-color var(--d-fast) var(--ease); }
.iv-copy:hover, .iv-copy.ok{ color:var(--ink); border-color:var(--ink); }
.iv-contact-panel .iv-fn{ margin-top:18px; }

/* ---------- FOOTER: на той же сетке, что и контент, — левый край совпадает ---------- */
.iv-foot{ border-top:1px solid var(--line); padding:56px 0 60px; }
.iv-foot .foot{ grid-column:wide; }
.iv-disclaimer{ grid-column:wide; font-size:13px; color:var(--ink-soft); line-height:1.6; max-width:96ch; margin-top:32px; padding-top:20px; border-top:1px solid var(--line); }

/* ---------- мобильная плашка ---------- */
.iv-bar{ display:none; }

/* ---------- форма «Register interest»: нативный <dialog> ----------
   Та же бумага, что у панели контакта; единственный «неровный» жест — скос 57° в правом верхнем углу
   с золотой линией, как у полосы с цифрами. На телефоне — лист снизу на всю ширину. */
.iv-dlg{ width:min(560px, calc(100vw - 32px)); max-height:calc(100dvh - 32px); padding:0; margin:auto; border:1px solid var(--line-2);
  background:var(--surface); color:var(--ink); overflow:auto; overscroll-behavior:contain; border-radius:0;
  clip-path:polygon(0 0, calc(100% - var(--bev)) 0, 100% var(--bev-y), 100% 100%, 0 100%); }
.iv-dlg::backdrop{ background:rgba(6,5,4,.72); backdrop-filter:blur(6px); }
@media (prefers-reduced-motion:no-preference){
  .iv-dlg[open]{ animation:iv-dlg-in var(--d) var(--ease); }
  @keyframes iv-dlg-in{ from{ opacity:0; transform:translateY(18px); } to{ opacity:1; transform:none; } }
}
/* золотая линия по срезу: от (100% − bev, 0) вниз-вправо под 57°, длина bev × √(1 + 1.54²) ≈ 1.836 */
.iv-dlg::before{ content:""; position:absolute; top:0; left:calc(100% - var(--bev)); width:calc(var(--bev) * 1.836); height:2px;
  background:var(--accent-line); transform-origin:0 0; transform:rotate(57deg) translateY(-1px); pointer-events:none; }
html.iv-dlg-on{ overflow:hidden; }
.iv-dlg-x{ position:absolute; top:12px; right:calc(var(--bev) * .55 + 8px); width:44px; height:44px; display:grid; place-items:center;
  background:transparent; border:0; border-radius:50%; color:var(--ink-soft); z-index:1; }
.iv-dlg-x svg{ width:22px; height:22px; }
.iv-dlg-x:hover{ color:var(--ink); background:var(--ink-ghost); }
.iv-form, .iv-form-ok{ padding:clamp(24px, 3.6vw, 40px); display:flex; flex-direction:column; gap:15px; }
.iv-form[hidden], .iv-form-ok[hidden]{ display:none; }
.iv-form h2, .iv-form-ok h2{ font-size:clamp(1.9rem, 1.5rem + 1.6vw, 2.6rem); line-height:1.05; font-weight:400; margin:-4px 0 0; padding-right:calc(var(--bev) * .6); }
.iv-form-p{ color:var(--ink-soft); font-size:var(--t-body); line-height:1.55; margin:-6px 0 4px; }
.iv-fld{ display:flex; flex-direction:column; gap:7px; margin:0; padding:0; border:0; min-width:0; }
.iv-fld > label, .iv-fld > legend{ font-size:var(--t-small); font-weight:600; color:var(--ink); padding:0; }
.iv-opt{ font-weight:400; color:var(--ink-soft); }
.iv-opt[hidden]{ display:none; }
.iv-fld input[type="text"], .iv-fld input[type="tel"], .iv-fld input[type="email"]{
  width:100%; min-height:48px; padding:11px 16px; font:inherit; font-size:16px; color:var(--ink);
  background:var(--bg); border:1px solid var(--ctl); border-radius:12px; transition:border-color var(--d-fast) var(--ease); }
.iv-fld input::placeholder{ color:var(--ink-faint); }
.iv-fld input:hover{ border-color:var(--ink-soft); }
.iv-fld input:focus-visible{ outline:2px solid var(--accent); outline-offset:1px; border-color:transparent; }
.iv-fld input[aria-invalid="true"]{ border-color:#e58b7a; }
.iv-hint{ font-size:var(--t-micro); color:var(--ink-soft); }
.iv-err{ font-size:var(--t-small); color:#f0a596; }
.iv-err:empty{ display:none; }
.iv-chips{ flex-direction:row; flex-wrap:wrap; gap:8px; }
.iv-chips legend{ margin-bottom:9px; }
.iv-chips label{ position:relative; cursor:pointer; }
.iv-chips input{ position:absolute; opacity:0; inset:0; margin:0; cursor:pointer; }
.iv-chips span{ display:inline-flex; align-items:center; min-height:44px; padding:10px 18px; border:1px solid var(--ctl); border-radius:var(--pill);
  font-size:14px; font-weight:600; color:var(--ink-soft); transition:color var(--d-fast) var(--ease), border-color var(--d-fast) var(--ease), background var(--d-fast) var(--ease); }
.iv-chips label:hover span{ color:var(--ink); border-color:var(--ink-soft); }
.iv-chips input:checked + span{ background:var(--ink); color:#14110c; border-color:var(--ink); }
.iv-chips input:focus-visible + span{ outline:2px solid var(--accent); outline-offset:3px; }
.iv-hp{ position:absolute !important; left:-9999px; width:1px; height:1px; overflow:hidden; }
.iv-form-legal{ margin-top:2px; }
.iv-form-legal a{ text-decoration:underline; text-underline-offset:3px; text-decoration-color:var(--line-2); }
.iv-form-fail{ border-left:2px solid #e58b7a; padding:4px 0 4px 14px; font-size:var(--t-small); color:var(--ink); }
.iv-form-fail[hidden]{ display:none; }
.iv-form-fail .iv-mail{ margin-top:8px; font-size:var(--t-small); }
.iv-form-go{ align-self:flex-start; min-width:180px; }
.iv-form-go:disabled{ opacity:.6; cursor:progress; transform:none; }
.iv-form-ok{ outline:none; min-height:280px; justify-content:center; }
.iv-form-ok .btn{ align-self:flex-start; margin-top:8px; }
@media (max-width:560px){
  .iv-dlg{ width:100vw; max-width:100vw; max-height:92dvh; margin:auto 0 0; border-left:0; border-right:0; border-bottom:0; }
  .iv-dlg[open]{ padding-bottom:env(safe-area-inset-bottom); }
  .iv-form-go{ align-self:stretch; }
}

/* ============ scroll-driven motion: видно по умолчанию, анимация — надстройка ============ */
@keyframes iv-rise{ from{ opacity:0; transform:translateY(28px); } to{ opacity:1; transform:none; } }
@keyframes iv-par{ from{ transform:translateY(calc(var(--depth, .6) * 36px)); } to{ transform:translateY(calc(var(--depth, .6) * -36px)); } }
@keyframes iv-prog{ from{ transform:scaleX(0); } to{ transform:scaleX(1); } }
@keyframes iv-out{ to{ transform:scale(.96) translateY(-3vh); opacity:.6; } }
@keyframes iv-fade{ from{ opacity:0; } to{ opacity:1; } }
@media (prefers-reduced-motion:no-preference){
  @supports (animation-timeline: view()){
    /* диапазон в пикселях, а не в процентах: при «entry 4% cover 26%» высокий блок, целиком
       стоящий на экране, оставался на 0.66–0.77 прозрачности (ревью 06.10.2026) */
    html.js .iv-rise{ animation:iv-rise linear both; animation-timeline:view(); animation-range:cover 0px cover 160px; }
    /* у ступеней тезисов уже есть transform — у них анимируется только opacity */
    html.js .iv-thesis li.iv-rise{ animation-name:iv-fade; }
    html.js .iv-par{ animation:iv-par linear both; animation-timeline:view(); animation-range:cover; }
    .iv-film-frame{ animation:iv-out linear both; animation-timeline:view(); animation-range:exit 0% exit 100%; }
    .iv-progress{ animation:iv-prog linear both; animation-timeline:scroll(root block); }
  }
  @supports not (animation-timeline: view()){
    html.js .iv-rise:not(.in){ opacity:0; }
    html.js .iv-rise.in{ transition:opacity var(--d-slow) var(--ease); }
    .iv-progress{ display:none; }
  }
}

/* ---------- зерно: один фиксированный слой, статичный тайл ---------- */
body.iv::after{ content:""; position:fixed; inset:0; z-index:96; pointer-events:none; background:url("/media/invest/grain-128.webp") repeat; opacity:.05; mix-blend-mode:overlay; }

/* ============ RESPONSIVE ============ */
/* таблица pro-forma и калькулятор рядом — только на действительно широком экране: на 901–1199 px
   столбец «Год» и матрица обрезались (ревью 06.10.2026) */
@media (max-width:1200px){
  .iv-statement, .iv-calc{ grid-column:wide; grid-row:auto; }
}
@media (max-width:1100px){
  .iv-nav{ display:none; }
  .iv-hero-copy{ grid-column:wide; }
  .iv-h1{ max-width:18ch; }
  .iv-film{ grid-column:col 1 / full-end; grid-row:2; margin-top:0; }
  .iv-kpis{ grid-row:3; }
}
@media (max-width:900px){
  .iv-grid{ grid-template-columns:[full-start] var(--gut) [wide-start] repeat(6, [col] minmax(0,1fr)) [wide-end] var(--gut) [full-end]; }
  .iv-bleed-r{ grid-column:col 2 / full-end; }
  .iv-bleed-l{ grid-column:full-start / col 6; }
  .iv-head{ grid-column:wide; }
  .iv-kpis{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .iv-kpi{ padding:20px 14px 22px 0; border-top:1px solid var(--line); }
  .iv-kpi + .iv-kpi{ border-left:0; }
  .iv-kpi--price{ grid-column:1 / -1; border-top:0; }
  .iv-kpi:nth-child(2), .iv-kpi:nth-child(4){ border-left:0; padding-left:0; }
  .iv-kpi:nth-child(3), .iv-kpi:nth-child(5){ padding-left:16px; border-left:1px solid var(--line); }

  #thesis .iv-head{ grid-row:1; }
  .iv-thesis-ph{ grid-column:col 2 / full-end; grid-row:2; aspect-ratio:4/5; max-height:80svh; }
  .iv-thesis{ grid-column:wide; grid-row:3; }

  .iv-facts{ grid-column:wide; grid-row:3; }
  .iv-asset-ph{ grid-column:col 2 / full-end; grid-row:2; }
  .iv-ph-stair{ left:calc(-1 * var(--gut)); width:52%; }
  .iv-mix{ grid-column:wide; grid-row:4; }
  .iv-mix-copy{ grid-column:wide; grid-row:5; }
  .iv-plan{ grid-column:full; grid-row:6; }

  .iv-plat-side{ grid-column:wide; grid-row:1; position:static; }
  .iv-thread{ grid-column:wide; grid-row:2; }
  .iv-plat-fn{ grid-column:wide; grid-row:3; }
  .iv-map{ grid-column:full; grid-row:2; }
  .iv-map svg{ margin:0 auto; max-width:560px; }
  .iv-map figcaption{ text-align:center; }
  .iv-loc-side{ grid-column:wide; grid-row:3; }

  .iv-gal{ grid-template-columns:repeat(6, minmax(0,1fr)); }
  .iv-gal .g1{ grid-column:1 / 7; }
  .iv-gal .g2{ grid-column:2 / 7; margin-top:0; }
  .iv-gal .g3{ grid-column:1 / 6; }
  .iv-gal .g4{ grid-column:1 / 4; margin-top:0; }
  .iv-gal .g5{ grid-column:4 / 7; margin-top:clamp(20px, 6vw, 48px); }
  .iv-gal .g6{ grid-column:2 / 7; margin-top:0; }
  .iv-gal .g7{ grid-column:1 / 4; margin-top:0; }
  .iv-gal .g8{ grid-column:4 / 7; margin-top:clamp(20px, 6vw, 48px); }

  .iv-riga{ grid-template-columns:1fr; }
  .iv-steps{ grid-template-columns:repeat(2, minmax(0,1fr)); row-gap:clamp(28px, 4vw, 40px); }

  #faq .iv-head{ grid-column:wide; position:static; }
  .iv-faq{ grid-column:wide; grid-row:2; }

  .iv-contact-panel{ grid-column:wide; grid-row:2; margin-bottom:0; margin-top:calc(-1 * clamp(80px, 22vw, 160px)); }
  .iv-contact{ padding-bottom:var(--sec-y); }
}
@media (max-width:620px){
  .iv-logo small{ display:none; }
}
@media (max-width:560px){
  .iv{ --gut:18px; --gap:12px; }
  .iv-top-cta{ display:none; }   /* от 560 px и ниже её заменяет плашка снизу (.iv-bar) */
  .iv-grid{ grid-template-columns:[full-start] var(--gut) [wide-start] repeat(4, [col] minmax(0,1fr)) [wide-end] var(--gut) [full-end]; }
  .iv-bleed-r, .iv-bleed-l, .iv-film, .iv-thesis-ph, .iv-asset-ph{ grid-column:full; }
  .iv-film-frame, .iv-thesis-ph, .iv-ph-street{ border-top-left-radius:0; border-top-right-radius:0; border-bottom-left-radius:0; }
  .iv-film figcaption{ padding:0 var(--gut); }
  .iv-thesis{ grid-template-columns:1fr; }
  .iv-thesis li:nth-child(even){ transform:none; }

  .iv-ph-stair{ left:var(--gut); }
  .iv-dots circle.t-studio{ stroke-width:3; }
  .iv-facts > div{ grid-template-columns:1fr; gap:4px; }
  .iv-ratios{ grid-template-columns:1fr 1fr; }
  .iv-fin th, .iv-fin td{ font-size:13.5px; }
  .iv-fin td, .iv-fin thead th{ padding-left:6px; }
  .iv-fin thead th{ letter-spacing:.06em; }
  .iv-fin th[scope="row"]{ padding-right:6px; }
  .iv-sens{ border-spacing:2px; }
  .iv-sens td{ font-size:12px; padding:8px 2px; }
  .iv-sens th{ padding:6px 2px; }
  .iv-thread{ grid-template-columns:1fr; }
  .iv-map .pins text{ font-size:24px; }
  .iv-map .ring-l text{ font-size:20px; }
  .iv-gal{ grid-template-columns:repeat(2, minmax(0,1fr)); row-gap:22px; }
  .iv-gal figure{ grid-column:auto !important; margin-top:0 !important; }
  .iv-gal .g1, .iv-gal .g2, .iv-gal .g6{ grid-column:1 / -1 !important; }
  .iv-gal figure:not(.g1):not(.g2):not(.g6) .iv-frame{ aspect-ratio:4/5; }
  .iv-near > div, .iv-riga > div{ grid-template-columns:96px 1fr; }
  .iv-steps{ grid-template-columns:1fr; }
  .iv-contact-ph{ height:300px; }

  /* фокус не должен прятаться под плашкой и баннером (WCAG 2.4.11) */
  html:has(body.iv){ scroll-padding-bottom:calc(78px + var(--cbnr-h, 0px)); }
  /* bottom = высота открытого баннера cookie (consent.js пишет --cbnr-h). Пока баннер открыт,
     плашки нет вовсе: вдвоём они закрывали треть экрана. */
  .iv-bar{ display:flex; position:fixed; left:0; right:0; bottom:var(--cbnr-h, 0px); z-index:60; padding:10px var(--gut) calc(10px + env(safe-area-inset-bottom)); background:color-mix(in srgb, var(--bg) 88%, transparent); backdrop-filter:blur(14px); border-top:1px solid var(--line); transform:translateY(calc(110% + var(--cbnr-h, 0px))); visibility:hidden; transition:transform var(--d) var(--ease), bottom var(--d) var(--ease), visibility 0s linear var(--d); }
  .iv-bar.show{ transform:none; visibility:visible; transition:transform var(--d) var(--ease), bottom var(--d) var(--ease), visibility 0s; }
  body.consent-on .iv-bar{ display:none; }
  .iv-bar .btn{ flex:1; }
}
/* короткое окно (зум 400 %, телефон боком): фиксированные шапка и плашка съедали весь экран */
@media (max-height:500px){
  .iv-top{ position:absolute; }
  .iv-bar{ display:none !important; }
  html:has(body.iv){ scroll-padding-top:12px; }
}

@media (prefers-reduced-motion:reduce){
  .iv *, .iv *::before, .iv *::after{ animation:none !important; transition-duration:0s !important; }
  .iv-faq details::details-content{ transition:none !important; }
}
@media (prefers-reduced-transparency:reduce){ .iv-top.solid{ backdrop-filter:none; background:var(--bg); } body.iv::after{ display:none; } }
@media (forced-colors:active){
  .iv-frame, .iv-calc{ border:1px solid CanvasText; }
  .iv-sens td.is-now{ outline-color:Highlight; }
  body.iv::after{ display:none; }
}
@media print{
  @page{ margin:16mm; }
  body.iv{ background:#fff; color:#111; }
  body.iv::after, .iv-top, .iv-film, .iv-bar, .cbnr, .iv-calc input, .iv-skip{ display:none !important; }
  .iv-band{ clip-path:none; background:#fff; }
  .iv *{ color:#111 !important; }
  .iv-fin, .iv-sens, .iv-kpis{ break-inside:avoid; }
  .iv-rise, .iv-fx{ opacity:1 !important; transform:none !important; animation:none !important; }
  .iv-dots circle, .iv-map .rings circle{ opacity:1 !important; animation:none !important; }
  .iv-dots circle{ fill:#333 !important; stroke:#333 !important; }
  .iv-dots circle.t-studio{ fill:none !important; }
  .iv-map .rings circle{ stroke:#999 !important; }
  .iv-map text, .iv-map .pins circle{ fill:#111 !important; }
  .iv-fin th, .iv-fin td, .iv-facts > div, .iv-ratios > div{ border-color:#ccc !important; }
}