/* ============================================================
   Schteine · Bali Estate Advisory — design system
   Светлый минимализм: тёплая бумага, Prata + Inter, пальмовая зелень.
   ============================================================ */

:root{
  --bg:#F4EEE5;
  --surface:#FFFFFF;
  --surface-2:#FBF8F2;
  --ink:#222222;
  --ink-soft:#46514A;
  --muted:#626A63;
  --line:#E7E1D5;
  --line-soft:#EFEADF;
  --accent:#1D5C43;
  --accent-deep:#12402E;
  --accent-soft:#EAF1EC;
  --sand:#ECE6DA;
  --gold:#B9904D;
  --danger:#A64C27;
  --danger-soft:#F8ECE4;
  --good:#1D5C43;
  --radius-lg:22px;
  --radius:16px;
  --radius-sm:10px;
  --shadow-sm:0 1px 2px rgba(23,32,27,.05);
  --shadow-card:0 1px 2px rgba(23,32,27,.04), 0 14px 34px -18px rgba(23,32,27,.22);
  --shadow-pop:0 24px 60px -24px rgba(23,32,27,.35);
  --glass:rgba(255,255,255,.82);
  --glass-strong:rgba(255,255,255,.92);
  --font-display:'Prata', 'Georgia', serif;
  --font-ui:'Inter', -apple-system, 'Segoe UI', sans-serif;
  --ease-out:cubic-bezier(.16,1,.3,1);
  --z-nav:50; --z-bar:40; --z-lightbox:80;
}

[data-theme="dark"]{
  --bg:#0C1410;
  --surface:#131D18;
  --surface-2:#101812;
  --ink:#EBEFEC;
  --ink-soft:#B4BEB7;
  --muted:#828C85;
  --line:#28322C;
  --line-soft:#1D2621;
  --accent:#4BA57C;
  --accent-deep:#8FD9AE;
  --accent-soft:rgba(75,165,124,.16);
  --sand:#1C2620;
  --gold:#CBA96C;
  --danger:#E28A5C;
  --danger-soft:rgba(226,138,92,.15);
  --good:#4BA57C;
  --shadow-sm:0 1px 2px rgba(0,0,0,.4);
  --shadow-card:0 1px 2px rgba(0,0,0,.3), 0 14px 34px -18px rgba(0,0,0,.6);
  --shadow-pop:0 24px 60px -24px rgba(0,0,0,.75);
  --glass:rgba(14,21,17,.82);
  --glass-strong:rgba(19,29,24,.94);
  color-scheme:dark;
}

*{box-sizing:border-box}
[hidden]{display:none !important}
html{scroll-behavior:smooth; overflow-x:hidden}
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto} }
body{
  margin:0; background:var(--bg); color:var(--ink);
  transition:background-color .35s ease, color .35s ease;
  font-family:var(--font-ui); font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
img{max-width:100%; display:block}
a{color:inherit; text-decoration:none}
button{font-family:inherit; cursor:pointer}

/* Видимый фокус для клавиатурной навигации (не мешает клику мышью). */
:focus-visible{outline:2px solid var(--accent); outline-offset:2px; border-radius:4px}
.btnFlow:focus-visible, .btn:focus-visible{outline-offset:3px}
.budgetControl input[type=range]:focus-visible{outline:2px solid var(--accent); outline-offset:4px}
[data-theme="dark"] :focus-visible{outline-color:var(--accent-deep)}
h1,h2,h3{line-height:1.2; margin:0 0 .5em; font-weight:600}
.displayFont, h1.display, h2.display{font-family:var(--font-display); font-weight:400; letter-spacing:-.01em}
.noScroll{overflow:hidden}
.num{font-variant-numeric:tabular-nums}

.wrap{max-width:1200px; margin:0 auto; padding:0 clamp(16px,4vw,32px)}

/* ---------- Reveal-анимации ---------- */
.reveal{opacity:0; transform:translateY(26px); transition:opacity .8s var(--ease-out), transform .8s var(--ease-out); transition-delay:var(--d,0ms)}
.reveal.inView{opacity:1; transform:none}
@media (max-width:720px){
  .reveal{transform:translateY(12px); transition-duration:.4s}
}
@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1; transform:none; transition:none}
  *{animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important}
}

/* ---------- Шапка ---------- */
.topbar{position:sticky; top:0; z-index:var(--z-nav); background:var(--glass); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border-bottom:1px solid transparent; transition:border-color .3s, background .3s}
.scrollProgress{position:fixed; top:0; left:0; z-index:calc(var(--z-nav) + 1); width:0; height:3px; background:var(--accent); pointer-events:none}
body.scrolled .topbar{border-bottom-color:var(--line-soft); background:var(--glass-strong)}
.topbarInner{max-width:1200px; margin:0 auto; padding:14px clamp(16px,4vw,32px); display:flex; align-items:center; gap:24px}
.brand{display:flex; align-items:center; gap:11px; margin-right:auto}
.brandMark{width:46px; height:46px; color:var(--ink); flex:none}
.ensoMask{display:block; width:100%; height:100%; background-color:currentColor;
  -webkit-mask:url("../../photos/brand/logo.png") center/contain no-repeat;
  mask:url("../../photos/brand/logo.png") center/contain no-repeat}
.brandText{display:flex; flex-direction:column; line-height:1.1}
.brandText b{font-family:var(--font-display); font-weight:400; font-size:15.5px; letter-spacing:.16em; text-transform:uppercase; white-space:nowrap}
.brandText i{font-style:normal; font-size:9px; color:var(--gold); letter-spacing:.24em; text-transform:uppercase; margin-top:3px; white-space:nowrap}
.mainNav{display:flex; gap:4px}
.mainNav a{padding:8px 14px; border-radius:999px; font-size:14.5px; font-weight:500; color:var(--ink-soft); transition:color .2s, background .2s; white-space:nowrap}
.mainNav a:hover{color:var(--ink); background:var(--sand)}
.mainNav a.on{color:var(--ink); background:var(--surface); box-shadow:var(--shadow-sm)}
/* Пункт «Закрытые лоты»: замочек-тизер закрытого раздела. */
.navPrivate{display:inline-flex; align-items:center; gap:6px}
.navLock{width:13px; height:13px; flex:none; opacity:.75}
.topbarActions{display:flex; align-items:center; gap:12px}
.langSwitch{display:flex; background:var(--sand); border-radius:999px; padding:3px}
.langSwitch button{border:0; background:transparent; padding:5px 12px; border-radius:999px; font-size:12.5px; font-weight:600; color:var(--muted); letter-spacing:.04em; transition:color .2s, background .2s, box-shadow .2s}
.langSwitch button.on{background:var(--surface); color:var(--ink); box-shadow:var(--shadow-sm)}
.navBurger{display:none; border:0; background:transparent; color:var(--ink); width:44px; height:44px; border-radius:12px}
.navBurger svg{width:24px; height:24px}
.themeToggle{position:relative; width:64px; height:32px; border:0; background:transparent; padding:0; flex:none; cursor:pointer; -webkit-tap-highlight-color:transparent}
.themeToggleTrack{position:relative; display:block; width:64px; height:32px; padding:4px; border-radius:999px; background:#fff; border:1px solid #E4E4E7; color:#18181B; transition:background .3s, border-color .3s, color .3s}
.themeToggleThumb{position:absolute; left:4px; top:4px; z-index:2; width:24px; height:24px; border-radius:999px; background:#E5E7EB; color:#374151; display:grid; place-items:center; transform:translateX(32px); transition:transform .3s, background .3s, color .3s}
.themeToggleRest{position:absolute; top:4px; width:24px; height:24px; border-radius:999px; display:grid; place-items:center; transition:transform .3s, color .3s, opacity .3s}
.themeToggleRestSun{left:36px; color:#71717A; opacity:0}
.themeToggleRestMoon{left:4px; color:#000; opacity:1}
.themeIcon{width:16px; height:16px; display:block; transform:translateY(-1px)}
.themeIconMoonActive{display:none}
.themeIconSunActive{display:block}
.themeToggle:hover .themeToggleTrack{border-color:color-mix(in srgb, var(--muted) 55%, transparent)}
.themeToggle:active .themeToggleThumb{transform:translateX(32px) scale(.94)}
[data-theme="dark"] .themeToggleTrack{background:#09090B; border-color:#27272A; color:#fff}
[data-theme="dark"] .themeToggleThumb{transform:translateX(0); background:#27272A; color:#fff}
[data-theme="dark"] .themeToggleRestSun{color:#71717A; opacity:1}
[data-theme="dark"] .themeToggleRestMoon{opacity:0}
[data-theme="dark"] .themeIconMoonActive{display:block}
[data-theme="dark"] .themeIconSunActive{display:none}
[data-theme="dark"] .themeToggle:active .themeToggleThumb{transform:translateX(0) scale(.94)}

/* ---------- Кнопки ---------- */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; border:1px solid transparent; border-radius:999px; padding:12px 22px; font-size:14.5px; font-weight:600; letter-spacing:.01em; transition:background .2s, color .2s, border-color .2s, box-shadow .25s, transform .14s ease; cursor:pointer}
.btn svg{width:17px; height:17px}
.btn:active{transform:scale(.97)}
.btnDark{background:var(--ink); color:#fff}
.btnDark:hover{background:#000; box-shadow:0 10px 24px -12px rgba(23,32,27,.5)}
[data-theme="dark"] .btnDark{background:var(--ink); color:#0C1410}
[data-theme="dark"] .btnDark:hover{background:#fff; box-shadow:0 10px 24px -12px rgba(0,0,0,.6)}
.btnAccent{background:var(--accent); color:#fff}
.btnAccent:hover{background:var(--accent-deep)}
.btnGhost{background:transparent; color:var(--ink); border-color:var(--line)}
.btnGhost:hover{border-color:var(--ink); background:var(--surface)}
.btnSm{padding:8px 15px; font-size:13px}
.btnContact{white-space:nowrap}
.linkBtn{border:0; background:none; color:var(--accent); font-size:13.5px; font-weight:600; padding:4px 6px; border-radius:8px}
.linkBtn:hover{background:var(--accent-soft)}

/* Flow-кнопка «Связаться»: обводка → заливка кружком из центра, стрелки уезжают/приезжают. */
.btnFlow{position:relative; display:inline-flex; align-items:center; justify-content:center; gap:4px; overflow:hidden; border-radius:100px; border:1.5px solid color-mix(in srgb, var(--ink) 42%, transparent); background:transparent; padding:12px 26px; font-size:14.5px; font-weight:600; letter-spacing:.01em; color:var(--ink); cursor:pointer; white-space:nowrap; -webkit-tap-highlight-color:transparent; transition:border-color .6s cubic-bezier(.23,1,.32,1), color .6s cubic-bezier(.23,1,.32,1), border-radius .6s cubic-bezier(.23,1,.32,1), transform .2s ease}
.btnFlow:active{transform:scale(.96)}
.btnFlow .flowText{position:relative; z-index:1; transform:translateX(-12px); transition:transform .8s ease}
.btnFlow .flowArrow{position:absolute; width:16px; height:16px; z-index:9; color:var(--ink); transition:left .8s cubic-bezier(.34,1.56,.64,1), right .8s cubic-bezier(.34,1.56,.64,1), color .8s cubic-bezier(.34,1.56,.64,1)}
.btnFlow .flowArrowL{left:-25%}
.btnFlow .flowArrowR{right:16px}
.btnFlow .flowCircle{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:16px; height:16px; background:var(--ink); border-radius:50%; opacity:0; z-index:0; transition:width .8s cubic-bezier(.19,1,.22,1), height .8s cubic-bezier(.19,1,.22,1), opacity .8s cubic-bezier(.19,1,.22,1)}
@media (hover:hover) and (pointer:fine){
  .btnFlow:hover{border-color:transparent; color:var(--bg); border-radius:12px}
  .btnFlow:hover .flowText{transform:translateX(12px)}
  .btnFlow:hover .flowArrow{color:var(--bg)}
  .btnFlow:hover .flowArrowL{left:16px}
  .btnFlow:hover .flowArrowR{right:-25%}
  .btnFlow:hover .flowCircle{width:260px; height:260px; opacity:1}
}
@media (prefers-reduced-motion: reduce){
  .btnFlow, .btnFlow .flowText, .btnFlow .flowArrow, .btnFlow .flowCircle{transition:none}
  .btnFlow:hover .flowText{transform:none}
}

/* ---------- Hero ---------- */
.hero{position:relative; padding:clamp(40px,7vw,84px) 0 clamp(28px,4vw,48px)}
.hero{transition:opacity .16s ease}
.heroGrid{display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); gap:clamp(24px,5vw,64px); align-items:center}
.heroEyebrow{display:inline-flex; align-items:center; gap:8px; font-size:12px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--accent); margin-bottom:18px}
.heroEyebrow::before{content:''; width:26px; height:1.5px; background:var(--accent)}
.heroTitle{font-family:var(--font-display); font-weight:400; font-size:clamp(34px,4.6vw,58px); line-height:1.12; letter-spacing:-.01em; margin:0 0 20px}
.heroText{font-size:clamp(15.5px,1.4vw,17.5px); color:var(--ink-soft); max-width:52ch; margin:0 0 28px}
.heroActions{display:flex; flex-wrap:wrap; gap:12px; margin-bottom:38px}
.heroActionsSecondary{margin-top:-22px}
.heroStats{display:flex; gap:clamp(20px,4vw,48px); border-top:1px solid var(--line); padding-top:24px}
.heroStat b{display:block; font-family:var(--font-display); font-weight:400; font-size:clamp(26px,2.6vw,36px); color:var(--ink)}
.heroStat span{font-size:12.5px; color:var(--muted); letter-spacing:.02em}
.heroMedia{position:relative}
.heroMediaFrame{position:relative; border-radius:var(--radius-lg); overflow:hidden; aspect-ratio:4/4.4; box-shadow:var(--shadow-card)}
.heroMediaFrame img{width:100%; height:100%; object-fit:cover; transform:scale(1.06); animation:heroZoom 14s var(--ease-out) forwards}
@keyframes heroZoom{to{transform:scale(1)}}
.heroCardFloat{position:absolute; left:-28px; bottom:26px; background:rgba(255,255,255,.92); backdrop-filter:blur(10px); border:1px solid var(--line-soft); border-radius:var(--radius); padding:14px 18px; box-shadow:var(--shadow-card); display:flex; gap:18px}
.heroCardFloat div span{display:block; font-size:11px; color:var(--muted); letter-spacing:.06em; text-transform:uppercase}
.heroCardFloat div b{font-size:17px; font-variant-numeric:tabular-nums}

/* ---------- Hero: парящие фигуры + переключатель светлая/тёмная ---------- */
.hero{overflow:hidden}
.hero .wrap{position:relative; z-index:2}
.heroShapes{position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:0}
.heroShape{position:absolute; will-change:transform,opacity; animation:heroShapeIn 1.8s cubic-bezier(.23,.86,.39,.96) both}
.heroShape::before{
  content:''; position:absolute; inset:0; border-radius:999px;
  background:linear-gradient(90deg, var(--shape-color, rgba(29,92,67,.10)), transparent 78%);
  border:1.5px solid var(--shape-border, rgba(29,92,67,.12));
  box-shadow:0 10px 44px -10px var(--shape-glow, transparent);
  filter:blur(.5px);
  transform:rotate(var(--rot,0deg));
  animation:heroFloat var(--dur,12s) ease-in-out infinite;
}
@keyframes heroShapeIn{from{opacity:0; transform:translateY(-120px)} to{opacity:1; transform:translateY(0)}}
@keyframes heroFloat{0%,100%{transform:rotate(var(--rot,0deg)) translateY(0)} 50%{transform:rotate(var(--rot,0deg)) translateY(16px)}}
.heroShape.s1{width:min(600px,58vw); height:130px; left:-8%; top:12%; --rot:12deg; --dur:13s; animation-delay:.15s}
.heroShape.s1::before{animation-delay:.2s; --shape-color:rgba(29,92,67,.13); --shape-border:rgba(29,92,67,.14)}
.heroShape.s2{width:min(480px,46vw); height:116px; right:-5%; top:66%; --rot:-15deg; --dur:15s; animation-delay:.35s}
.heroShape.s2::before{animation-delay:1s; --shape-color:rgba(176,138,71,.13); --shape-border:rgba(176,138,71,.16)}
.heroShape.s3{width:min(300px,34vw); height:80px; left:4%; bottom:6%; --rot:-8deg; --dur:12s; animation-delay:.25s}
.heroShape.s3::before{animation-delay:.6s; --shape-color:rgba(29,92,67,.10); --shape-border:rgba(29,92,67,.11)}
.heroShape.s4{width:min(200px,22vw); height:60px; right:16%; top:8%; --rot:20deg; --dur:11s; animation-delay:.45s}
.heroShape.s4::before{animation-delay:1.3s; --shape-color:rgba(176,138,71,.12); --shape-border:rgba(176,138,71,.14)}
.heroShape.s5{width:min(150px,18vw); height:44px; left:24%; top:4%; --rot:-25deg; --dur:14s; animation-delay:.55s}
.heroShape.s5::before{animation-delay:.9s; --shape-color:rgba(90,120,105,.10); --shape-border:rgba(90,120,105,.12)}

.heroStyleSwitch{position:absolute; top:16px; right:clamp(16px,4vw,32px); z-index:3; display:flex; gap:4px; background:rgba(255,255,255,.72); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border:1px solid var(--line-soft); border-radius:999px; padding:4px; box-shadow:var(--shadow-sm)}
.heroStyleSwitch button{width:34px; height:34px; border:0; border-radius:999px; background:transparent; color:var(--muted); display:grid; place-items:center; cursor:pointer; transition:background .2s, color .2s}
.heroStyleSwitch button svg{width:17px; height:17px}
.heroStyleSwitch button:hover{color:var(--ink)}
.heroStyleSwitch button.on{background:var(--surface); color:var(--ink); box-shadow:var(--shadow-sm)}

/* Тёмная обложка — как в референсе */
[data-theme="dark"] .hero{background:radial-gradient(125% 125% at 50% 0%, #13221b 0%, #0c1510 55%, #070d0a 100%); min-height:86vh; display:flex; align-items:center}
[data-theme="dark"] .hero::after{content:''; position:absolute; inset:0; pointer-events:none; z-index:1; background:linear-gradient(to top, #070d0a, transparent 26%, transparent 72%, rgba(7,13,10,.55))}
[data-theme="dark"] .heroMedia{display:none}
[data-theme="dark"] .heroGrid{grid-template-columns:1fr; max-width:820px; margin:0 auto; text-align:center; align-items:center}
[data-theme="dark"] .heroEyebrow{color:#7fcf9f; display:inline-flex; justify-content:center}
[data-theme="dark"] .heroEyebrow::before{background:#7fcf9f}
[data-theme="dark"] .heroTitle{color:#fff}
[data-theme="dark"] .heroText{color:rgba(255,255,255,.62); margin-left:auto; margin-right:auto}
[data-theme="dark"] .heroActions{justify-content:center}
[data-theme="dark"] .heroStats{justify-content:center; border-top-color:rgba(255,255,255,.14)}
[data-theme="dark"] .heroStat b{color:#fff}
[data-theme="dark"] .heroStat span{color:rgba(255,255,255,.5)}
[data-theme="dark"] .heroActions .btnDark{background:#fff; color:#12201a}
[data-theme="dark"] .heroActions .btnDark:hover{background:#efeee8; box-shadow:0 10px 24px -12px rgba(0,0,0,.5)}
[data-theme="dark"] .heroActions .btnGhost{color:#fff; border-color:rgba(255,255,255,.28)}
[data-theme="dark"] .heroActions .btnGhost:hover{border-color:#fff; background:rgba(255,255,255,.06)}
[data-theme="dark"] .heroStyleSwitch{background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.18)}
[data-theme="dark"] .heroStyleSwitch button{color:rgba(255,255,255,.55)}
[data-theme="dark"] .heroStyleSwitch button:hover{color:#fff}
[data-theme="dark"] .heroStyleSwitch button.on{background:rgba(255,255,255,.16); color:#fff; box-shadow:none}
[data-theme="dark"] .heroShape.s1::before{--shape-color:rgba(52,150,110,.28); --shape-border:rgba(255,255,255,.14); --shape-glow:rgba(52,150,110,.25)}
[data-theme="dark"] .heroShape.s2::before{--shape-color:rgba(210,120,95,.26); --shape-border:rgba(255,255,255,.14); --shape-glow:rgba(210,120,95,.22)}
[data-theme="dark"] .heroShape.s3::before{--shape-color:rgba(120,170,150,.22); --shape-border:rgba(255,255,255,.12); --shape-glow:rgba(120,170,150,.18)}
[data-theme="dark"] .heroShape.s4::before{--shape-color:rgba(206,169,110,.26); --shape-border:rgba(255,255,255,.14); --shape-glow:rgba(206,169,110,.22)}
[data-theme="dark"] .heroShape.s5::before{--shape-color:rgba(96,158,168,.22); --shape-border:rgba(255,255,255,.12); --shape-glow:rgba(96,158,168,.2)}

/* ---------- Панель фильтров ---------- */
.controls{position:sticky; top:66px; z-index:var(--z-bar); margin:8px 0 26px}
.catalogQuickLinks{display:none}
.controlsCard{background:var(--glass); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); border:1px solid var(--line-soft); border-radius:var(--radius-lg); padding:14px 16px; box-shadow:var(--shadow-sm); display:flex; flex-wrap:wrap; align-items:center; gap:10px; transition:padding .2s, gap .2s}
/* Панель при скролле «прилипает» (см. .controls выше) и вместе с шапкой съедает много
   вертикального пространства — как только она реально зафиксирована (не просто в потоке
   страницы наверху), сжимаем её: строка счётчика/сброса не нужна, пока фильтры видны и так,
   и обрезки убираем. Класс body.filtersStuck ставит IntersectionObserver в app.js. */
body.filtersStuck .controlsCard{padding:8px 14px; gap:6px}
body.filtersStuck .controlsCard>.metaLine{display:none}
.modeSwitch{display:flex; background:var(--sand); border-radius:999px; padding:3px}
.modeSwitch button{border:0; background:transparent; padding:8px 16px; border-radius:999px; font-size:13.5px; font-weight:600; color:var(--muted); transition:.2s, transform .14s ease}
.modeSwitch button.on{background:var(--surface); color:var(--ink); box-shadow:var(--shadow-sm)}
.modeSwitch button:active{transform:scale(.97)}
.selectWrap{position:relative}
.selectWrap select{appearance:none; -webkit-appearance:none; border:1px solid var(--line); background:var(--surface); color:var(--ink); border-radius:999px; padding:9px 34px 9px 16px; font-size:13.5px; font-weight:500; font-family:inherit; cursor:pointer; transition:border-color .2s}
.selectWrap select:hover{border-color:var(--muted)}
.selectWrap::after{content:''; position:absolute; right:14px; top:50%; width:8px; height:8px; border-right:1.5px solid var(--muted); border-bottom:1.5px solid var(--muted); transform:translateY(-70%) rotate(45deg); pointer-events:none}
.locationMulti::after{display:none}
.locationFilterTrigger{position:relative; border:1px solid var(--line); background:var(--surface); color:var(--ink); border-radius:999px; padding:9px 34px 9px 16px; font:500 13.5px/1.2 var(--font-ui); cursor:pointer; white-space:nowrap; transition:border-color .2s}
.locationFilterTrigger:hover{border-color:var(--muted)}
.locationFilterTrigger::after{content:''; position:absolute; right:14px; top:50%; width:8px; height:8px; border-right:1.5px solid var(--muted); border-bottom:1.5px solid var(--muted); transform:translateY(-70%) rotate(45deg); transition:transform .18s var(--ease-out)}
.locationMulti.open .locationFilterTrigger::after{transform:translateY(-35%) rotate(225deg)}
.locationFilterPopover{position:absolute; z-index:calc(var(--z-bar) + 1); top:calc(100% + 8px); left:0; min-width:240px; max-width:min(320px,calc(100vw - 32px)); max-height:min(50vh,300px); overflow:auto; padding:8px; background:var(--surface); border:1px solid var(--line-soft); border-radius:var(--radius); box-shadow:var(--shadow-pop); opacity:0; visibility:hidden; pointer-events:none; transform:translateY(-6px); transition:opacity .18s var(--ease-out), transform .18s var(--ease-out), visibility 0s linear .18s}
.locationMulti.open .locationFilterPopover{opacity:1; visibility:visible; pointer-events:auto; transform:none; transition-delay:0s}
.locationFilterReset{width:100%; border:0; border-bottom:1px solid var(--line-soft); background:transparent; color:var(--ink-soft); padding:7px 8px 9px; font:600 12px/1.2 var(--font-ui); text-align:left}
.locationFilterReset:hover{color:var(--ink)}
.locationFilterOptions{display:grid; gap:2px; padding-top:5px}
.locationFilterOptions label{display:flex; align-items:center; gap:9px; padding:7px 8px; border-radius:var(--radius-sm); color:var(--ink); font-size:13px; line-height:1.25; cursor:pointer}
.locationFilterOptions label:hover{background:var(--surface-2)}
.locationFilterOptions input{width:16px; height:16px; margin:0; flex:none; accent-color:var(--accent)}
.budgetControl{display:flex; flex-direction:column; gap:4px; min-width:180px; padding:2px 6px}
.budgetTop{font-size:12px; color:var(--muted); white-space:nowrap}
.budgetTop b{color:var(--ink); font-weight:600; font-variant-numeric:tabular-nums}
.budgetControl input[type=range]{-webkit-appearance:none; appearance:none; width:100%; height:5px; border-radius:99px; background:var(--sand); outline:none; cursor:pointer}
.budgetControl input[type=range]::-webkit-slider-thumb{-webkit-appearance:none; appearance:none; width:18px; height:18px; border-radius:50%; background:var(--accent); border:2px solid var(--surface); box-shadow:var(--shadow-sm); cursor:pointer; transition:transform .15s}
.budgetControl input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.15)}
.budgetControl input[type=range]::-moz-range-thumb{width:18px; height:18px; border-radius:50%; background:var(--accent); border:2px solid var(--surface); cursor:pointer}
.budgetControl input[type=range]::-moz-range-track{height:5px; border-radius:99px; background:var(--sand)}
.budgetInputs{display:flex; align-items:center; gap:6px; font-size:12px; color:var(--muted)}
.budgetInputs input{width:72px; border:1px solid var(--line); background:var(--surface); color:var(--ink); border-radius:999px; padding:5px 10px; font-size:12.5px; font-family:inherit; font-variant-numeric:tabular-nums; transition:border-color .2s}
.budgetInputs input:hover{border-color:var(--muted)}
.budgetInputs input:focus{outline:none; border-color:var(--accent)}
.budgetInputs input::-webkit-outer-spin-button,.budgetInputs input::-webkit-inner-spin-button{-webkit-appearance:none; margin:0}
.budgetInputs input[type=number]{-moz-appearance:textfield; appearance:textfield}
.viewSwitch{display:flex; background:var(--sand); border-radius:999px; padding:3px; margin-left:auto}
.viewSwitch button{border:0; background:transparent; display:flex; align-items:center; gap:7px; padding:8px 15px; border-radius:999px; font-size:13.5px; font-weight:600; color:var(--muted); transition:.2s, transform .14s ease}
.viewSwitch button.on{background:var(--surface); color:var(--ink); box-shadow:var(--shadow-sm)}
.viewSwitch button:active{transform:scale(.97)}
.viewSwitch svg{width:16px; height:16px}
.metaLine{display:flex; align-items:center; gap:10px; width:100%; padding:2px 6px 0; font-size:13px; color:var(--muted)}

/* ---------- Сетка карточек ---------- */
.grid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; margin-bottom:56px}
.card{background:var(--surface); border:1px solid var(--line-soft); border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-sm); transition:transform .35s var(--ease-out), box-shadow .35s var(--ease-out); display:flex; flex-direction:column}
.card:hover{transform:translateY(-4px); box-shadow:var(--shadow-card)}
.card:active{transform:scale(.97); transition-duration:.14s}
.card.reveal{transition:opacity .8s var(--ease-out), transform .8s var(--ease-out); transition-delay:var(--d,0ms)}
.card.reveal.inView{transition:transform .35s var(--ease-out), box-shadow .35s var(--ease-out)}
@media (max-width:720px){.card.reveal{transition-duration:.4s}}
.media{position:relative; aspect-ratio:4/2.9; overflow:hidden; cursor:pointer; background:var(--sand)}
.media img{width:100%; height:100%; object-fit:cover; transition:transform 1.1s var(--ease-out)}
.card:hover .media img{transform:scale(1.045)}
.media.imgMissing, .galleryHero.imgMissing, .thumb.imgMissing, .pinCardMedia.imgMissing, .mini.imgMissing{background:linear-gradient(150deg,#EFEAE0,#E4DDCF)}
.media.imgMissing::before, .galleryHero.imgMissing::before, .pinCardMedia.imgMissing::before{content:''; position:absolute; inset:0; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B9AE97' stroke-width='1.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3c-3.5 3.2-7 5.4-7 9.6C5 16.9 8.1 20 12 20s7-3.1 7-7.4C19 8.4 15.5 6.2 12 3Z'/%3E%3Cpath d='M12 20V9'/%3E%3Cpath d='M12 12c-1.2-.9-2.6-1.3-4-1.2'/%3E%3Cpath d='M12 15c1.2-.9 2.6-1.3 4-1.2'/%3E%3C/svg%3E") center/56px no-repeat}
.badgeRow{position:absolute; top:12px; left:12px; right:12px; display:flex; gap:7px; align-items:flex-start}
.badge{display:inline-flex; align-items:center; gap:6px; background:rgba(255,255,255,.93); backdrop-filter:blur(6px); border-radius:999px; padding:5px 11px; font-size:11.5px; font-weight:600; color:#17201B; letter-spacing:.02em}
.badge .dot{width:7px; height:7px; border-radius:50%; background:var(--accent); flex:none}
.badge.sold .dot{background:var(--danger)}
.badge.reserved .dot{background:var(--gold)}
.badgeScore{margin-left:auto; background:rgba(23,32,27,.82); color:#fff}
.badge.badgeVerified{background:var(--gold); color:#fff}
.badge.badgeVerified .dot{background:#fff}
.chip.chipVerified{background:rgba(185,144,77,.14); color:var(--gold); border:1px solid rgba(185,144,77,.42)}
.badge.badgeGuarantee{background:transparent; color:var(--gold); border:1.5px solid var(--gold)}
.badge.badgeGuarantee .dot{background:var(--gold)}
.chip.chipGuarantee{background:rgba(185,144,77,.14); color:var(--gold); border:1px solid rgba(185,144,77,.42)}
.cardBody{padding:18px 18px 16px; display:flex; flex-direction:column; gap:11px; flex:1}
.cardLoc{font-size:12px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); display:flex; align-items:center; gap:6px}
.cardLoc svg{width:13px; height:13px; color:var(--accent)}
.cardTitleRow{display:flex; align-items:baseline; justify-content:space-between; gap:12px}
.cardTitle{font-family:var(--font-display); font-weight:400; font-size:21px; line-height:1.25; cursor:pointer; transition:color .2s}
.cardTitle:hover{color:var(--accent)}
.cardPrice{font-size:17px; font-weight:600; white-space:nowrap; font-variant-numeric:tabular-nums}
.cardPrice small{font-size:12px; color:var(--muted); font-weight:500; margin-right:3px}
.specRow{display:flex; gap:14px; font-size:13px; color:var(--ink-soft)}
.specRow span{display:inline-flex; align-items:center; gap:6px}
.specRow svg{width:15px; height:15px; color:var(--muted)}
.unitPicker{display:flex; flex-wrap:wrap; gap:6px}
.unitBtn{border:1px solid var(--line); background:var(--surface); border-radius:999px; padding:5px 12px; font-size:12px; font-weight:600; color:var(--ink-soft); transition:.2s; cursor:pointer}
.unitBtn:hover{border-color:var(--accent); color:var(--accent)}
.unitBtn.on{background:var(--accent-soft); border-color:var(--accent); color:var(--accent-deep)}
/* Проданный юнит: кнопка видна, но неактивна — состав проекта читается, кликнуть нельзя. */
.unitBtn.sold{background:var(--surface-2); border-color:var(--line-soft); color:var(--muted); opacity:.75; cursor:default}
.unitBtn.sold:hover{border-color:var(--line-soft); color:var(--muted)}
/* Текущий юнит остаётся видимым, даже если он продан: иначе при фильтре «архив»
   не понять, какой вариант открыт (находка гейта 28.08.2026). */
.unitBtn.sold.on{border-color:var(--muted); color:var(--ink-soft); opacity:.9}
.metricStrip{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border:1px solid var(--line-soft); border-radius:var(--radius); overflow:hidden; background:var(--surface-2)}
.metricStrip>div{min-width:0; padding:9px 10px}
.metricStrip>div+div{border-left:1px solid var(--line-soft)}
.metricStrip span{display:block; min-height:13px; font-size:11px; line-height:1.15; font-weight:700; color:var(--muted); margin-bottom:1px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.metricStrip small{display:block; min-height:11px; font-size:9.5px; line-height:1.15; color:var(--muted); margin-bottom:3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.metricStrip b{font-size:15px; font-variant-numeric:tabular-nums}
.metricStrip .prime b{color:var(--accent-deep)}
.metricStrip .prime{background:var(--accent-soft)}
.cardWhy{font-size:13px; color:var(--ink-soft); line-height:1.5; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
.cardFooter{display:flex; align-items:center; gap:8px; margin-top:auto; padding-top:4px}
.shortlistBtn{display:inline-flex; align-items:center; gap:7px; border:1px solid var(--line); background:var(--surface); border-radius:999px; padding:8px 14px; font-size:13px; font-weight:600; color:var(--ink-soft); transition:.2s; cursor:pointer}
.shortlistBtn svg{width:15px; height:15px}
.shortlistBtn:hover{border-color:var(--accent); color:var(--accent)}
.shortlistBtn.on{background:var(--accent); border-color:var(--accent); color:#fff}
.shortlistBtn:disabled{opacity:.45; cursor:not-allowed}
.shortlistBtn:disabled:hover{border-color:var(--line); color:var(--ink-soft)}
.cardFooter .btnGhost{margin-left:auto}

/* ---------- Карта ---------- */
.mapView{position:relative; border-radius:var(--radius-lg); overflow:hidden; border:1px solid var(--line-soft); box-shadow:var(--shadow-card); margin-bottom:56px; background:var(--sand)}
#mapCanvas{height:min(72vh,640px); width:100%; z-index:1}
.mapHint{position:absolute; z-index:2; left:14px; bottom:14px; background:rgba(255,255,255,.92); backdrop-filter:blur(8px); border-radius:12px; padding:8px 14px; font-size:12.5px; color:var(--ink-soft); box-shadow:var(--shadow-sm); max-width:70%}
.mapTouchHint{position:absolute; z-index:3; left:50%; top:50%; max-width:min(280px,calc(100% - 48px)); transform:translate(-50%,-50%); padding:11px 16px; border-radius:12px; background:rgba(23,32,27,.78); backdrop-filter:blur(8px); color:#fff; font-size:13px; font-weight:600; line-height:1.35; text-align:center; box-shadow:0 8px 24px -10px rgba(23,32,27,.65); pointer-events:none}
.pricePin{background:#17201B; color:#fff; border-radius:999px; padding:5px 11px; font-size:12px; font-weight:700; font-variant-numeric:tabular-nums; box-shadow:0 6px 16px -6px rgba(23,32,27,.5); white-space:nowrap; border:2px solid #fff; transition:transform .2s, background .2s; cursor:pointer}
.pricePin:hover{background:var(--accent); transform:scale(1.06)}
.leaflet-popup-content-wrapper{border-radius:14px; box-shadow:var(--shadow-pop); font-family:var(--font-ui); background:#fff; color:#17201B}
.leaflet-popup-tip{background:#fff}
.leaflet-popup-content{margin:0; width:230px !important}
.pinCard{cursor:pointer}
.pinCardMedia{aspect-ratio:16/9; overflow:hidden; border-radius:14px 14px 0 0; background:#EFEAE0; position:relative}
.pinCardMedia img{width:100%; height:100%; object-fit:cover}
.pinCardBody{padding:10px 14px 12px}
.pinCardBody b{font-size:14.5px; display:block; color:#17201B}
.pinCardBody span{font-size:12px; color:#79837C}
.pinCardBody .pinPrice{color:#17201B; font-weight:700; font-size:13.5px; margin-top:3px; display:block}

/* ---------- Детальная страница ---------- */
#app{transition:opacity .16s ease}
.viewFade{animation:viewIn .5s var(--ease-out)}
@keyframes viewIn{from{opacity:0; transform:translateY(14px)}to{opacity:1; transform:none}}
.backRow{display:flex; align-items:center; gap:10px; margin:6px 0 20px; flex-wrap:wrap}
.backLink{display:inline-flex; align-items:center; gap:8px; font-size:14px; font-weight:600; color:var(--ink-soft); border:0; background:none; padding:8px 12px; border-radius:999px; transition:.2s}
.backLink:hover{background:var(--sand); color:var(--ink)}
.backLink svg{width:16px; height:16px}
.backRow .spacer{flex:1}
.detailGrid{display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); gap:26px; align-items:start; margin-bottom:40px}
.galleryBlock{position:sticky; top:120px}
.galleryHero{position:relative; border-radius:var(--radius-lg); overflow:hidden; aspect-ratio:4/2.9; background:var(--sand); cursor:zoom-in; box-shadow:var(--shadow-card)}
.galleryHero img{width:100%; height:100%; object-fit:cover}
.galleryNav{position:absolute; top:50%; transform:translateY(-50%); width:42px; height:42px; border-radius:50%; border:0; background:rgba(255,255,255,.92); color:var(--ink); display:grid; place-items:center; box-shadow:var(--shadow-sm); transition:.2s; opacity:0}
.galleryHero:hover .galleryNav{opacity:1}
.galleryNav:hover{background:#fff; transform:translateY(-50%) scale(1.06)}
@media (hover:none), (pointer:coarse){.galleryNav{opacity:.85}}
.galleryNav svg{width:18px; height:18px}
.galleryPrev{left:12px}
.galleryNext{right:12px}
.thumbRow{display:grid; grid-template-columns:repeat(6,1fr); gap:8px; margin-top:10px}
.thumb{border-radius:var(--radius-sm); overflow:hidden; aspect-ratio:1; cursor:pointer; opacity:.65; transition:opacity .2s, outline .2s; outline:2px solid transparent; outline-offset:2px; background:var(--sand)}
.thumb img{width:100%; height:100%; object-fit:cover}
.thumb:hover{opacity:1}
.thumb.active{opacity:1; outline-color:var(--accent)}
.thumbRow.hasVideo{grid-template-columns:repeat(7,1fr)}
.thumb.thumbVideo{position:relative}
.thumb.thumbVideo .playBadge{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:#fff; background:rgba(0,0,0,.34)}
.thumb.thumbVideo .playBadge svg{width:20px; height:20px; filter:drop-shadow(0 1px 2px rgba(0,0,0,.55))}
.galleryHero video{width:100%; height:100%; object-fit:cover; background:#000}
.galleryYouTube{position:absolute; inset:0; background:#000}
.galleryYouTube iframe{width:100%; height:100%; border:0; display:block}
.thumb.imgMissing{display:none}
/* Превью видео не прячем, даже если картинки под него не нашлось: за ним стоит
   единственная ссылка на видео-тур, и скрытый блок делает видео недоступным. */
.thumb.thumbVideo.imgMissing{display:block; background:linear-gradient(150deg,#3A4740,#2A332E)}
.detailPanel{background:var(--surface); border:1px solid var(--line-soft); border-radius:var(--radius-lg); padding:26px 26px 24px; box-shadow:var(--shadow-sm)}
.detailPanel .cardLoc{margin-bottom:10px}
.detailTitle{font-family:var(--font-display); font-weight:400; font-size:clamp(26px,3vw,34px); margin:0 0 6px}
.detailPrice{font-size:26px; font-weight:700; font-variant-numeric:tabular-nums; margin-bottom:14px}
.detailPrice small{font-size:14px; color:var(--muted); font-weight:500}
.chips{display:flex; flex-wrap:wrap; gap:7px; margin-bottom:16px}
.chip{display:inline-flex; align-items:center; gap:6px; background:var(--sand); border-radius:999px; padding:6px 12px; font-size:12.5px; font-weight:600; color:var(--ink-soft); transition:transform .14s ease}
.chip.accent{background:var(--accent-soft); color:var(--accent-deep)}
.chip svg{width:13px; height:13px}
.chip:active{transform:scale(.97)}
.roiExplainGrid{display:grid; gap:9px; margin:16px 0}
.roiExplain{border:1px solid var(--line-soft); border-radius:var(--radius); padding:13px 16px; display:grid; grid-template-columns:1fr auto; gap:2px 14px; align-items:center; background:var(--surface-2)}
.roiExplain span{font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--muted)}
.roiExplain b{font-size:21px; grid-row:span 2; font-variant-numeric:tabular-nums; align-self:center}
.roiExplain em{font-style:normal; font-size:12px; color:var(--muted); line-height:1.45}
.roiExplain.checked{background:var(--accent-soft); border-color:transparent}
.roiExplain.checked span, .roiExplain.checked b{color:var(--accent-deep)}
.roiExplain.stress b{color:var(--danger)}
.roiExplain.guaranteed{background:rgba(185,144,77,.1); border-color:rgba(185,144,77,.35)}
.roiExplain.guaranteed span, .roiExplain.guaranteed b{color:var(--gold)}
.detailActions{display:flex; flex-wrap:wrap; gap:9px; margin-top:18px}
.detailUnitSwitch{margin:0 0 18px}
.detailUnitSwitch b{display:block; font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); margin-bottom:8px}

.sectionTitle{font-family:var(--font-display); font-weight:400; font-size:clamp(21px,2.2vw,26px); margin:38px 0 16px}
.factGrid{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px}
.fact{background:var(--surface); border:1px solid var(--line-soft); border-radius:var(--radius); padding:14px 16px}
.fact b{display:block; font-size:16.5px; font-variant-numeric:tabular-nums; margin-bottom:1px}
.fact span{font-size:12px; color:var(--muted)}
.twoCols{display:grid; grid-template-columns:1fr 1fr; gap:12px}
.textBox{background:var(--surface); border:1px solid var(--line-soft); border-radius:var(--radius); padding:17px 19px; font-size:14px; color:var(--ink-soft); line-height:1.65}
.textBox b{color:var(--ink); display:block; margin-bottom:5px; font-size:14px}
.textBox p{margin:.4em 0 0}
.textBox.good{background:var(--accent-soft); border-color:transparent}
.textBox.good b{color:var(--accent-deep)}
.textBox.warn{background:var(--danger-soft); border-color:transparent}
.textBox.warn b{color:var(--danger)}

/* ---------- Экранная подборка: Private Edition ---------- */
.shortlistPresentation{margin:clamp(8px,2vw,22px) 0 36px}
.shortlistBackRow{margin:0 0 12px}
.shortlistEdition{display:grid;grid-template-columns:minmax(0,.9fr) minmax(380px,1.1fr);min-height:500px;overflow:hidden;border-radius:28px;background:#28342D;color:#F4EEE5;box-shadow:0 22px 60px -30px rgba(18,44,32,.58)}
.shortlistEditionCopy{position:relative;z-index:1;display:flex;flex-direction:column;justify-content:space-between;min-width:0;padding:clamp(28px,4vw,52px);background:radial-gradient(circle at 0 100%,rgba(111,121,103,.26),transparent 40%),radial-gradient(circle at 90% 0,rgba(185,144,77,.16),transparent 32%)}
.shortlistEditionBrand{display:flex;align-items:center;justify-content:space-between;gap:14px;color:#F4EEE5;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.shortlistEditionBrand b{padding:5px 9px;border:1px solid rgba(244,238,229,.28);border-radius:999px;color:#CBA96C;font-size:9px;font-weight:700;letter-spacing:.12em}
.shortlistEditionEyebrow{margin:32px 0 12px;color:#CBA96C;font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.shortlistEdition h1{max-width:9.5ch;margin:0;font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(46px,5.1vw,76px);font-weight:500;line-height:.9;letter-spacing:-.055em}
.shortlistEdition h1 em{display:block;color:#CBA96C;font-style:normal}
.shortlistEditionIntro{max-width:34ch;margin:22px 0 0;color:#D6D4CA;font-size:14px;line-height:1.62}
.shortlistEditionBottom{display:flex;align-items:end;justify-content:space-between;gap:22px;margin-top:30px}
.shortlistEditionMeta{display:grid;grid-template-columns:repeat(2,minmax(86px,1fr));gap:12px}
.shortlistEditionMeta span{display:grid;gap:2px;padding-top:9px;border-top:1px solid rgba(244,238,229,.24);color:#C7C9BD;font-size:9px;letter-spacing:.09em;line-height:1.3;text-transform:uppercase}
.shortlistEditionMeta b{color:#CBA96C;font-family:'Cormorant Garamond',Georgia,serif;font-size:27px;font-weight:500;letter-spacing:-.02em;line-height:1}
.shortlistDownloadButton{display:inline-flex;align-items:center;justify-content:center;gap:8px;flex:none;min-height:44px;padding:11px 16px;border:1px solid #CBA96C;border-radius:999px;background:#CBA96C;color:#28342D;font-size:12.5px;font-weight:800;letter-spacing:.02em;transition:transform .16s ease,background .2s,border-color .2s}
.shortlistDownloadButton:hover{border-color:#E0C285;background:#E0C285}
.shortlistDownloadButton:active{transform:scale(.97)}
.shortlistDownloadButton svg{width:16px;height:16px}
.shortlistEditionPhotos{display:grid;grid-template-columns:minmax(0,1fr) minmax(150px,.48fr);gap:10px;padding:26px 26px 26px 0}
.shortlistEditionPhotos figure{min-width:0;margin:0;overflow:hidden}
.shortlistEditionPhotos figure:first-child{border-radius:20px 0 0 20px}
.shortlistEditionPhotos figure:last-child{border-radius:0 20px 20px 0}
.shortlistEditionPhotos img{width:100%;height:100%;object-fit:cover;filter:saturate(.78) contrast(.97)}
.shortlistScreenNote{display:flex;align-items:center;gap:12px;margin:14px 2px 22px;color:var(--muted);font-size:12.5px;line-height:1.45}
.shortlistScreenNote i{display:block;flex:1;height:1px;background:var(--line)}
.shortlistProperties{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.shortlistProperty{display:grid;grid-template-columns:minmax(175px,.86fr) minmax(0,1.14fr);overflow:hidden;border:1px solid rgba(223,215,202,.72);border-radius:22px;background:var(--surface);box-shadow:var(--shadow-sm)}
.shortlistPropertyMedia{position:relative;min-height:100%;overflow:hidden;background:var(--sand)}
.shortlistPropertyImage{width:100%;height:100%;min-height:340px;object-fit:cover;transition:transform .65s var(--ease-out)}
.shortlistProperty:hover .shortlistPropertyImage{transform:scale(1.035)}
.shortlistImageNumber{position:absolute;left:13px;top:13px;padding:5px 8px;border:1px solid rgba(255,255,255,.34);border-radius:999px;background:rgba(20,31,25,.63);backdrop-filter:blur(6px);color:#fff;font-size:9px;font-weight:700;letter-spacing:.12em}
.shortlistPropertyCopy{display:flex;flex-direction:column;min-width:0;padding:22px 22px 18px}
.shortlistPropertyKicker{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px;color:var(--muted);font-size:10px;font-weight:700;letter-spacing:.13em;text-transform:uppercase}
.shortlistPropertyKicker a{color:var(--accent);text-decoration:underline;text-decoration-color:rgba(29,92,67,.3);text-underline-offset:3px}
.shortlistProperty h2{margin:0;color:var(--ink);font-family:var(--font-display);font-size:clamp(22px,2vw,29px);font-weight:400;line-height:1.13;letter-spacing:-.025em}
.shortlistPropertyPrice{margin:7px 0 16px;color:var(--accent);font-family:'Cormorant Garamond',Georgia,serif;font-size:25px;font-weight:500;letter-spacing:-.015em}
.shortlistPropertyFacts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px 14px;margin:0;padding:13px 0;border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft)}
.shortlistPropertyFacts div{min-width:0}
.shortlistPropertyFacts dt{margin:0 0 2px;color:var(--muted);font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.shortlistPropertyFacts dd{margin:0;overflow-wrap:anywhere;color:var(--ink-soft);font-size:12.5px;font-weight:600;line-height:1.3}
.shortlistDeveloper{margin:13px 0 0;color:var(--ink-soft);font-size:12px;line-height:1.4}
.shortlistDeveloper span,.shortlistWhy>span{display:block;margin-bottom:3px;color:var(--muted);font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.shortlistWhy{margin-top:13px}
.shortlistWhy p{display:-webkit-box;overflow:hidden;margin:0;color:var(--ink-soft);font-family:'Cormorant Garamond',Georgia,serif;font-size:16px;line-height:1.26;-webkit-box-orient:vertical;-webkit-line-clamp:3}
.shortlistLinks{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:auto;padding-top:16px}
.shortlistLinks a{display:flex;align-items:center;justify-content:space-between;gap:6px;min-width:0;min-height:35px;padding:7px 10px;border:1px solid var(--line);border-radius:999px;color:var(--ink-soft);font-size:10px;font-weight:700;line-height:1.15;letter-spacing:.01em;transition:border-color .2s,background .2s,color .2s}
.shortlistLinks a:hover{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-deep)}
.shortlistLinks .shortlistMapLink{grid-column:span 2;border-color:rgba(185,144,77,.55);background:linear-gradient(105deg,rgba(185,144,77,.13),rgba(185,144,77,.035));color:var(--accent-deep)}
.shortlistLinks i{display:grid;place-items:center;flex:none;width:18px;height:18px;border-radius:50%;background:var(--accent-soft);color:var(--accent);font-style:normal;font-size:13px;line-height:1}
.shortlistComparison{margin:0 0 56px}
.shortlistComparisonHead{display:flex;align-items:end;justify-content:space-between;gap:18px;margin-bottom:18px}
.shortlistComparisonHead p{margin:0 0 3px;color:var(--accent);font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.shortlistComparisonHead h2{margin:0;font-size:clamp(26px,3vw,35px)}

/* ---------- Сравнение ---------- */
.panel{background:var(--surface); border:1px solid var(--line-soft); border-radius:var(--radius-lg); padding:clamp(18px,3vw,30px); box-shadow:var(--shadow-sm)}
.tableBox{overflow-x:auto; border-radius:var(--radius); border:1px solid var(--line-soft)}
.tableBox table{border-collapse:collapse; width:100%; min-width:640px; font-size:13.5px}
.tableBox th, .tableBox td{padding:11px 14px; text-align:left; vertical-align:top; border-bottom:1px solid var(--line-soft)}
.tableBox tr:last-child th, .tableBox tr:last-child td{border-bottom:0}
.tableBox thead th, .tableBox tr:first-child th{background:var(--surface-2); font-size:12px; letter-spacing:.04em; text-transform:uppercase; color:var(--muted)}
.tableBox tbody th, .tableBox tr th:first-child{font-weight:600; color:var(--ink-soft); white-space:nowrap}
.tableBox td.best{background:var(--accent-soft); font-weight:600; color:var(--accent-deep)}
.tableBox .note{font-size:11.5px; color:var(--muted); font-weight:400; text-transform:none; letter-spacing:0}

/* ---------- Плавающий бар подборки ---------- */
.compareBar{position:fixed; left:50%; transform:translateX(-50%) translateY(0); bottom:18px; z-index:var(--z-bar); background:#17201B; color:#fff; border-radius:999px; padding:9px 10px 9px 20px; display:flex; align-items:center; gap:14px; box-shadow:var(--shadow-pop); transition:transform .45s var(--ease-out), opacity .3s; max-width:calc(100vw - 24px)}
[data-theme="dark"] .compareBar{background:#05100B; border:1px solid var(--line)}
.compareBar.hidden{transform:translateX(-50%) translateY(90px); opacity:0; pointer-events:none}
.compareBar span{font-size:13.5px; font-weight:600; white-space:nowrap}
.compareBar .btn{padding:9px 16px; font-size:13px}
.compareBar .btnPdf{background:#CBA96C; border-color:#CBA96C; color:#17201B}
.compareBar .btnPdf:hover{background:#E0C285; border-color:#E0C285}
.linkLabelShort{display:none}
.compareBar .btnClear{background:transparent; color:rgba(255,255,255,.65); border:0; font-size:13px; font-weight:600; padding:6px 8px}
.compareBar .btnClear:hover{color:#fff}
.shortlistPanel{background:var(--accent-soft); border:1px solid rgba(29,92,67,.2); border-radius:var(--radius-lg); padding:18px 20px; margin-bottom:22px}
.shortlistPanel b{color:var(--accent-deep)}
.shortlistPanel .note{font-size:13px; color:var(--ink-soft); margin:4px 0 10px}
.shortlistPanel input{width:100%; border:1px solid var(--line); background:#fff; border-radius:12px; padding:11px 14px; font-size:13.5px; font-family:inherit; color:var(--ink)}

/* ---------- Memo (print) ---------- */
.memoHeader{display:flex; justify-content:space-between; gap:18px; align-items:flex-start; flex-wrap:wrap}
.memoPrice{font-size:28px; font-weight:700; font-variant-numeric:tabular-nums}
.memoFooter{margin-top:28px; font-size:12px; color:var(--muted); border-top:1px solid var(--line); padding-top:14px}

/* ---------- Формы ---------- */
.formGrid{display:grid; grid-template-columns:1fr 1fr; gap:12px}
.formGrid label, .formField{display:flex; flex-direction:column; gap:6px; font-size:12.5px; font-weight:600; color:var(--ink-soft)}
.formGrid input, .formGrid select, .formField input, .formField select, .formField textarea{border:1px solid var(--line); background:var(--surface); border-radius:12px; padding:10px 13px; font-size:14px; font-family:inherit; color:var(--ink); transition:border-color .2s, box-shadow .2s; width:100%}
.formGrid input:focus, .formField input:focus, .formField select:focus, .formField textarea:focus, .formGrid select:focus{outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(29,92,67,.13)}
.formField textarea{min-height:74px; resize:vertical; line-height:1.5}

/* ---------- Финмодель ---------- */
.pageHead{padding:clamp(34px,5vw,58px) 0 8px}
.pageHead .heroEyebrow{margin-bottom:12px}
.pageHead h1{font-family:var(--font-display); font-weight:400; font-size:clamp(30px,3.6vw,44px); margin:0 0 12px}
.pageHead p{color:var(--ink-soft); max-width:64ch; margin:0}
.financeLayout{display:grid; grid-template-columns:330px minmax(0,1fr); gap:24px; align-items:start; margin:28px 0 60px}
.financeForm{position:sticky; top:96px; min-width:0}
.formGrid label{min-width:0}
.financeForm h3{font-size:14px; margin-bottom:14px}
.financeForm .formGrid{gap:10px}
.formGrid label.fullRow{grid-column:1 / -1}
.inlineFieldRow{display:flex; gap:8px}
.inlineFieldRow select{flex:1; min-width:0}
.inlineFieldRow input{flex:none; width:72px}
.financeResults{display:flex; flex-direction:column; gap:22px}
.forecastCard{background:var(--surface); border:1px solid var(--line-soft); border-radius:var(--radius-lg); padding:clamp(18px,2.5vw,26px); box-shadow:var(--shadow-sm)}
.forecastCard>h2{font-family:var(--font-display); font-weight:400; font-size:21px; margin-bottom:14px}
.forecastCard>p{font-size:13.5px; color:var(--muted); margin:-8px 0 16px}
.payGrid{display:grid; grid-template-columns:repeat(3,1fr); gap:12px}
.payOption{border:1px solid var(--line-soft); border-radius:var(--radius); padding:16px; transition:border-color .2s, box-shadow .2s}
.payOption.active{border-color:var(--accent); box-shadow:0 0 0 1px var(--accent)}
.payTop{display:flex; justify-content:space-between; align-items:center; gap:8px; margin-bottom:8px}
.payTop h3{font-size:14px; margin:0}
.payTop span{font-size:11px; font-weight:700; background:var(--accent-soft); color:var(--accent-deep); border-radius:999px; padding:3px 9px; white-space:nowrap}
.payPrice{font-size:20px; font-weight:700; font-variant-numeric:tabular-nums; margin-bottom:10px}
.payPrice em{font-style:normal; font-size:13px; color:var(--muted); text-decoration:line-through; font-weight:500; margin-left:6px}
.payStripe{display:flex; height:8px; border-radius:99px; overflow:hidden; margin-bottom:10px; background:var(--sand)}
.payStripe i{display:block; height:100%}
.payLegend div{display:flex; align-items:center; gap:7px; font-size:12px; color:var(--ink-soft); padding:2px 0}
.payLegend i{width:9px; height:9px; border-radius:3px; flex:none}
.payLegend b{font-variant-numeric:tabular-nums; min-width:36px}
.forecastHead{display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:6px}
.forecastHead h2{margin:0}
.forecastHeadActions{display:flex; gap:8px; flex-wrap:wrap}
.planHint{margin:0 0 16px}
.payTop{cursor:pointer}
.payOption .payPrice{cursor:pointer}
.payGrid.editing .payOption{cursor:default}
.payEditHead{display:flex; gap:8px; margin-bottom:10px; flex-wrap:wrap; align-items:flex-end}
.payEditHead .planName{flex:1; min-width:130px; border:1px solid var(--line); background:var(--surface); color:var(--ink); border-radius:10px; padding:8px 11px; font-size:14px; font-weight:600; font-family:inherit}
.payEditHead .planDiscount{display:flex; flex-direction:column; gap:4px; font-size:10.5px; letter-spacing:.04em; text-transform:uppercase; color:var(--muted)}
.payEditHead .planDiscount input{width:84px; border:1px solid var(--line); background:var(--surface); color:var(--ink); border-radius:10px; padding:8px 10px; font-size:13.5px; font-family:inherit; font-variant-numeric:tabular-nums}
.payEditRows{display:flex; flex-direction:column; gap:6px; margin:2px 0 8px}
.payEditRow{display:flex; align-items:center; gap:6px}
.payEditRow input{border:1px solid var(--line); background:var(--surface); color:var(--ink); border-radius:9px; padding:7px 9px; font-size:13px; font-family:inherit}
.payEditRow .pPct{width:52px; text-align:right; font-variant-numeric:tabular-nums}
.payEditRow .pctSign{color:var(--muted); font-size:12px; margin-right:2px}
.payEditRow .pNote{flex:1; min-width:60px}
.payEditRow .pDate{width:132px; color:var(--ink-soft)}
.payEditRow input:focus{outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(29,92,67,.13)}
.payEditRow .pDel{flex:none; width:26px; height:26px; border-radius:8px; border:1px solid var(--line); background:var(--surface); color:var(--danger); font-size:16px; line-height:1; cursor:pointer; transition:.2s}
.payEditRow .pDel:hover{background:var(--danger-soft); border-color:var(--danger)}
.payEditFoot{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:6px}
.paySum{font-size:12.5px; font-weight:700; font-variant-numeric:tabular-nums; margin-left:auto}
.paySum.ok{color:var(--accent-deep)}
.paySum.warn{color:var(--danger)}
.selectPlanBtn{padding:6px 12px}
.cashLegend{display:flex; flex-wrap:wrap; gap:16px; font-size:12.5px; color:var(--ink-soft); margin-top:14px}
.cashLegend i{width:11px; height:11px; border-radius:3px; display:inline-block; margin-right:6px; vertical-align:-1px}
.cashLegend i.lineDot{width:9px; height:9px; border-radius:50%}
.returnsTop{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:12px}
.returnsTop>div{background:var(--accent-soft); border-radius:var(--radius); padding:16px 18px}
.returnsTop span{font-size:12px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--accent-deep)}
.returnsTop b{display:block; font-family:var(--font-display); font-weight:400; font-size:30px; color:var(--accent-deep); font-variant-numeric:tabular-nums}
.returnStats{display:grid; grid-template-columns:repeat(auto-fit,minmax(118px,1fr)); gap:10px; margin-bottom:12px}
.roiNote{margin-top:12px; line-height:1.5}
.returnStats>div{border:1px solid var(--line-soft); border-radius:var(--radius); padding:12px 14px}
.returnStats span{font-size:11.5px; color:var(--muted); display:block}
.returnStats b{font-size:17px; font-variant-numeric:tabular-nums}
.basedOn{font-size:12.5px; color:var(--muted); line-height:1.6}
.forecastTable{width:100%; border-collapse:collapse; font-size:13.5px}
.forecastTable th, .forecastTable td{padding:9px 10px; text-align:right; border-bottom:1px solid var(--line-soft); font-variant-numeric:tabular-nums}
.forecastTable th:first-child, .forecastTable td:first-child{text-align:left}
.forecastTable tr:first-child th{font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted)}
.forecastTable tr.section td{background:var(--surface-2); font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); padding:7px 10px}
.forecastTable tr.neg td{color:var(--danger)}
.forecastTable tr.neg td:first-child{color:var(--ink-soft)}
.forecastTable tr.bold td{font-weight:600}
.forecastTable tr.total td{font-weight:700; color:var(--accent-deep); background:var(--accent-soft); border-bottom:0}
.donutWrap{display:flex; align-items:center; gap:26px; flex-wrap:wrap}
.donut{width:190px; height:190px; border-radius:50%; display:grid; place-items:center; position:relative; flex:none}
.donut>div{width:118px; height:118px; background:var(--surface); border-radius:50%; display:grid; place-content:center; text-align:center; box-shadow:var(--shadow-sm)}
.donut span{font-size:11px; color:var(--muted)}
.donut b{font-size:17px; font-variant-numeric:tabular-nums}
.donutLegend{flex:1; min-width:220px}
.donutLegend div{display:flex; align-items:center; gap:9px; font-size:13px; padding:5px 0; border-bottom:1px dashed var(--line-soft)}
.donutLegend div:last-child{border-bottom:0}
.donutLegend i{width:10px; height:10px; border-radius:3px; flex:none}
.donutLegend span{color:var(--ink-soft); flex:1}
.donutLegend b{font-variant-numeric:tabular-nums}
.capChart{display:flex; align-items:flex-end; gap:10px; height:250px; padding-top:10px}
.capCol{flex:1; display:flex; flex-direction:column; align-items:center; gap:7px; min-width:0}
.capBar{width:100%; max-width:52px; border-radius:9px 9px 4px 4px; overflow:hidden; display:flex; flex-direction:column-reverse; background:var(--sand); transition:height .6s var(--ease-out)}
.capBar i.paid{background:var(--ink)}
.capBar i.cap{background:var(--gold)}
.capBar i.rent{background:var(--accent)}
.capCol span{font-size:11px; color:var(--muted)}
.legend{display:flex; flex-wrap:wrap; gap:16px; font-size:12.5px; color:var(--ink-soft); margin-top:14px}
.legend .dot{display:inline-block; width:10px; height:10px; border-radius:3px; margin-right:6px; vertical-align:-1px}
.legend .dot.paid{background:var(--ink)} .legend .dot.cap{background:var(--gold)} .legend .dot.rent{background:var(--accent)}
.scenarioBarRow{display:grid; grid-template-columns:110px 1fr auto; align-items:center; gap:12px; padding:7px 0; font-size:13px}
.scenarioBarRow>div{background:var(--sand); border-radius:99px; height:10px; overflow:hidden}
.scenarioBarRow span{display:block; height:100%; background:var(--accent); border-radius:99px; transition:width .7s var(--ease-out)}
.scenarioBarRow em{font-style:normal; font-variant-numeric:tabular-nums; color:var(--ink-soft); white-space:nowrap}
.svgChart{width:100%; height:auto}
.heatTable{width:100%; border-collapse:collapse; font-size:12.5px}
.heatTable th, .heatTable td{padding:8px 6px; text-align:center; font-variant-numeric:tabular-nums}
.heatTable th{font-size:11px; color:var(--muted); font-weight:600}
.heatTable td{border-radius:8px}
.heat-good{background:var(--accent-soft); color:var(--accent-deep); font-weight:600}
.heat-mid{background:#F4EFE3; color:#8a6d1f}
.heat-low{background:var(--danger-soft); color:var(--danger)}
.note{font-size:12.5px; color:var(--muted)}

/* ---------- Рынки ---------- */
.marketVerdicts{display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin:26px 0 22px}
.verdict{background:var(--surface); border:1px solid var(--line-soft); border-radius:var(--radius); padding:16px 18px}
.verdict.black{background:var(--ink); color:#fff; border-color:var(--ink)}
[data-theme="dark"] .verdict.black{background:#05100B; color:#fff; border-color:var(--line)}
[data-theme="dark"] .verdict.black b{color:#fff}
.verdict span{font-size:11px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--muted); display:block; margin-bottom:5px}
.verdict.black span{color:rgba(255,255,255,.6)}
.verdict b{font-family:var(--font-display); font-weight:400; font-size:21px; display:block; margin-bottom:5px}
.verdict p{font-size:12.5px; color:var(--ink-soft); margin:0; line-height:1.5}
.verdict.black p{color:rgba(255,255,255,.75)}
.marketCards{display:grid; grid-template-columns:repeat(2,1fr); gap:16px; margin-bottom:22px}
.marketCard{background:var(--surface); border:1px solid var(--line-soft); border-radius:var(--radius-lg); padding:22px; transition:transform .3s var(--ease-out), box-shadow .3s}
.marketCard:hover{transform:translateY(-3px); box-shadow:var(--shadow-card)}
.marketCard.featured{border-color:rgba(29,92,67,.32)}
[data-theme="dark"] .marketCard.featured{border-color:rgba(75,165,124,.4)}
.marketCardTop{display:flex; justify-content:space-between; align-items:flex-start; gap:12px; margin-bottom:14px}
.marketCardTop h2{font-family:var(--font-display); font-weight:400; font-size:23px; margin:0; display:inline}
.marketFlag{font-size:20px; margin-right:8px}
.marketCardTop p{font-size:12.5px; color:var(--muted); margin:2px 0 0}
.marketTag{font-size:11px; font-weight:700; background:var(--sand); border-radius:999px; padding:5px 11px; white-space:nowrap; color:var(--ink-soft)}
.marketCard.featured .marketTag{background:var(--accent-soft); color:var(--accent-deep)}
.marketKpis{display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-bottom:14px}
.marketKpis>div{background:var(--surface-2); border:1px solid var(--line-soft); border-radius:var(--radius-sm); padding:10px 12px}
.marketKpis span{font-size:10.5px; letter-spacing:.05em; text-transform:uppercase; color:var(--muted); display:block}
.marketKpis b{font-size:15px; font-variant-numeric:tabular-nums; display:block; margin:1px 0 7px}
.marketMiniBar{height:5px; background:var(--sand); border-radius:99px; overflow:hidden}
.marketMiniBar i{display:block; height:100%; border-radius:99px; background:var(--accent)}
.marketMiniBar i.dark{background:var(--ink)}
.marketMiniBar i.orange{background:var(--gold)}
.marketMiniBar i.green{background:var(--accent)}
.miniScore{display:grid; grid-template-columns:92px 1fr auto; align-items:center; gap:10px; font-size:12.5px; color:var(--ink-soft); padding:4px 0}
.miniScore div{height:7px; background:var(--sand); border-radius:99px; overflow:hidden}
.miniScore i{display:block; height:100%; background:var(--accent); border-radius:99px}
.miniScore b{font-variant-numeric:tabular-nums; font-size:12px}
.marketScores{margin-bottom:14px}
.marketText, .marketRisk{font-size:13px; color:var(--ink-soft); line-height:1.55; margin-top:10px}
.marketText b, .marketRisk b{display:block; font-size:11.5px; letter-spacing:.06em; text-transform:uppercase; margin-bottom:3px; color:var(--ink)}
.marketRisk b{color:var(--danger)}
.marketText p, .marketRisk p{margin:0}
.marketCharts{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:22px}
.marketChartCard{background:var(--surface); border:1px solid var(--line-soft); border-radius:var(--radius-lg); padding:22px}
.marketChartCard h2{font-family:var(--font-display); font-weight:400; font-size:20px; margin-bottom:6px}
.marketChartCard>p{font-size:12.5px; color:var(--muted); margin:0 0 16px; line-height:1.55}
.marketBarRow{display:grid; grid-template-columns:84px 1fr auto; align-items:center; gap:12px; padding:6px 0; font-size:13px}
.marketBarRow>div{background:var(--sand); border-radius:99px; height:10px; overflow:hidden}
.marketBarRow i{display:block; height:100%; background:var(--accent); border-radius:99px; transition:width .7s var(--ease-out)}
.marketBarRow i.entry{background:var(--ink)}
.marketBarRow b{font-variant-numeric:tabular-nums; white-space:nowrap; font-size:12.5px}
.decisionGrid{display:grid; grid-template-columns:1fr 1fr; gap:12px}
.decisionGrid>div{border:1px solid var(--line-soft); border-radius:var(--radius); padding:14px 16px}
.decisionGrid b{display:block; font-size:13.5px; margin-bottom:4px}
.decisionGrid span{font-size:12.5px; color:var(--ink-soft); line-height:1.5}
.pill{border-radius:999px; padding:3px 10px; font-size:12px; font-weight:700}
.pill.scoreGood{background:var(--accent-soft); color:var(--accent-deep)}
.pill.scoreMid{background:#F4EFE3; color:#8a6d1f}
.pill.scoreLow{background:var(--danger-soft); color:var(--danger)}
.marketMatrix{margin-bottom:60px}

/* ---------- Админка ---------- */
.adminLayout{display:grid; grid-template-columns:minmax(0,1fr) 460px; gap:22px; align-items:start; margin:24px 0 60px}
.adminList{display:flex; flex-direction:column; gap:10px}
.adminToolbar{display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-bottom:14px}
.adminToolbar input[type=search]{flex:1; min-width:180px; border:1px solid var(--line); border-radius:999px; padding:10px 16px; font-size:14px; font-family:inherit; background:var(--surface)}
.adminToolbar input[type=search]:focus{outline:none; border-color:var(--accent)}
.adminRow{display:grid; grid-template-columns:56px minmax(0,1fr) auto; gap:14px; align-items:center; background:var(--surface); border:1px solid var(--line-soft); border-radius:var(--radius); padding:10px 14px; cursor:pointer; transition:border-color .2s, box-shadow .2s}
.adminRow:hover{border-color:var(--muted)}
.adminRow.on{border-color:var(--accent); box-shadow:0 0 0 1px var(--accent)}
.adminRow .mini{width:56px; height:44px; border-radius:10px; overflow:hidden; background:var(--sand)}
.adminRow .mini img{width:100%; height:100%; object-fit:cover}
.adminRow .rowMain b{display:block; font-size:14.5px}
.adminRow .rowMain span{font-size:12px; color:var(--muted)}
.adminRow .rowSide{text-align:right; font-size:12.5px; color:var(--ink-soft); font-variant-numeric:tabular-nums}
.adminRow .rowSide .statusTag{display:inline-block; border-radius:999px; padding:2px 9px; font-size:11px; font-weight:700; margin-top:3px}
.statusTag.Available{background:var(--accent-soft); color:var(--accent-deep)}
.statusTag.Reserved{background:#F4EFE3; color:#8a6d1f}
.statusTag.Sold, .statusTag.Archive, .statusTag.Draft{background:var(--sand); color:var(--muted)}
.adminEditor{position:sticky; top:90px; max-height:calc(100vh - 110px); overflow-y:auto}
.adminEditor .panel{padding:22px}
.adminEditor h2{font-size:17px; margin-bottom:4px}
.adminEditor .idLine{font-size:12px; color:var(--muted); margin-bottom:16px}
.fieldGroup{border-top:1px solid var(--line-soft); padding-top:14px; margin-top:14px}
.fieldGroup>b{display:block; font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); margin-bottom:10px}
.fieldGroup .formGrid{margin-bottom:10px}
.adminActions{display:flex; flex-wrap:wrap; gap:9px; margin-top:18px}
.liveScore{background:var(--accent-soft); border-radius:12px; padding:10px 14px; font-size:12.5px; color:var(--accent-deep); margin-bottom:12px; line-height:1.5}
.liveScore b{font-size:17px; font-variant-numeric:tabular-nums; margin:0 2px}
.draftBar{position:sticky; top:66px; z-index:var(--z-bar); background:var(--ink); color:#fff; border-radius:var(--radius); padding:12px 18px; display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin:12px 0; box-shadow:var(--shadow-pop)}
.draftBar span{font-size:13.5px; flex:1; min-width:200px}
.photoHelper{background:var(--surface-2); border:1px dashed var(--line); border-radius:var(--radius); padding:14px 16px; font-size:12.5px; color:var(--ink-soft)}
.photoHelper code{background:var(--sand); border-radius:6px; padding:1px 7px; font-size:12px}
.photoHelper .drop{margin-top:10px; border:1.5px dashed var(--line); border-radius:12px; padding:18px; text-align:center; color:var(--muted); transition:border-color .2s, background .2s}
.photoHelper .drop.over{border-color:var(--accent); background:var(--accent-soft); color:var(--accent-deep)}
.photoRenameList{margin-top:10px; display:flex; flex-direction:column; gap:6px}
.photoRenameList a{display:flex; align-items:center; gap:9px; font-size:12.5px; color:var(--accent-deep); background:var(--accent-soft); border-radius:10px; padding:7px 12px; font-weight:600}
.photoRenameList img{width:34px; height:26px; object-fit:cover; border-radius:6px}

.adminTabs{display:flex; gap:8px; margin:18px 0 4px}
.adminTabs button.on{background:var(--ink); color:#fff; border-color:var(--ink)}
.devTable{display:flex; flex-direction:column; gap:10px; margin-top:14px}
.devRow{display:grid; grid-template-columns:220px 90px 1fr; gap:14px; align-items:start; background:var(--surface); border:1px solid var(--line-soft); border-radius:var(--radius); padding:12px 16px}
.devRow .devName{font-size:14px; font-weight:600; padding-top:9px}
.devRow .devName span{display:block; font-size:11.5px; font-weight:500; color:var(--muted); margin-top:2px}
.devRow input, .devRow textarea{border:1px solid var(--line); background:var(--surface); border-radius:10px; padding:8px 11px; font-size:13.5px; font-family:inherit; color:var(--ink); width:100%}
.devRow textarea{min-height:44px; resize:vertical}
@media (max-width:720px){.devRow{grid-template-columns:1fr}}

/* ---------- Подвал ---------- */
.footer{border-top:1px solid var(--line); margin-top:20px; background:var(--surface-2)}
.footerInner{max-width:1200px; margin:0 auto; padding:34px clamp(16px,4vw,32px); display:flex; justify-content:space-between; gap:28px; flex-wrap:wrap}
.footerBrandTop{display:flex; align-items:center; gap:11px}
.footerBrandTop .brandMark{width:42px; height:42px}
.footerBrand b{font-family:var(--font-display); font-weight:400; font-size:17px; text-transform:uppercase; letter-spacing:.14em}
.footerTagline{display:block; font-family:var(--font-display); font-size:15px; color:var(--ink-soft); margin:14px 0 0}
.footerBrand p{font-size:12.5px; color:var(--muted); max-width:54ch; margin:8px 0 0; line-height:1.6}
.footerLinks{display:flex; flex-direction:column; gap:8px; font-size:14px}
.footerLinks a{color:var(--ink-soft); transition:color .2s}
.footerLinks a:hover{color:var(--accent)}

/* ---------- Лайтбокс ---------- */
#galleryLightbox{position:fixed; inset:0; z-index:var(--z-lightbox); display:none; align-items:center; justify-content:center}
#galleryLightbox.open{display:flex}
.lightboxBackdrop{position:absolute; inset:0; background:rgba(15,20,17,.9); backdrop-filter:blur(6px); animation:fadeIn .3s}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.lightboxImg{position:relative; max-width:min(92vw,1300px); max-height:86vh; border-radius:14px; box-shadow:var(--shadow-pop); animation:viewIn .35s var(--ease-out)}
.lightboxClose{position:absolute; top:20px; right:22px; width:44px; height:44px; border-radius:50%; border:0; background:rgba(255,255,255,.12); color:#fff; display:grid; place-items:center; transition:background .2s}
.lightboxClose:hover{background:rgba(255,255,255,.25)}
.lightboxClose svg{width:20px; height:20px}
.lightboxNav{position:absolute; top:50%; transform:translateY(-50%); width:48px; height:48px; border-radius:50%; border:0; background:rgba(255,255,255,.12); color:#fff; display:grid; place-items:center; transition:background .2s}
.lightboxNav:hover{background:rgba(255,255,255,.25)}
.lightboxNav svg{width:20px; height:20px}
.lightboxPrev{left:22px} .lightboxNext{right:22px}
.lightboxCounter{position:absolute; bottom:22px; left:50%; transform:translateX(-50%); color:rgba(255,255,255,.85); font-size:13px; font-weight:600; letter-spacing:.06em}

/* ---------- Скелетоны ---------- */
.skeletonGrid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px}
.skeletonCard{border-radius:var(--radius-lg); background:var(--surface); border:1px solid var(--line-soft); overflow:hidden}
.skeletonCard::before{content:''; display:block; aspect-ratio:4/2.9; background:linear-gradient(100deg, var(--sand) 40%, #f7f4ee 50%, var(--sand) 60%); background-size:200% 100%; animation:shimmer 1.4s infinite}
.skeletonCard::after{content:''; display:block; height:120px; margin:16px; border-radius:12px; background:linear-gradient(100deg, var(--line-soft) 40%, #f5f2ec 50%, var(--line-soft) 60%); background-size:200% 100%; animation:shimmer 1.4s infinite}
@keyframes shimmer{to{background-position:-200% 0}}

/* ---------- Адаптив ---------- */
@media (max-width: 1024px){
  .grid{grid-template-columns:repeat(2,1fr)}
  .skeletonGrid{grid-template-columns:repeat(2,1fr)}
  .detailGrid{grid-template-columns:1fr}
  .galleryBlock{position:static}
  .factGrid{grid-template-columns:repeat(2,1fr)}
  .financeLayout{grid-template-columns:minmax(0,1fr)}
  .financeForm{position:static}
  .marketVerdicts{grid-template-columns:repeat(2,1fr)}
  .adminLayout{grid-template-columns:1fr}
  .adminEditor{position:static; max-height:none}
  .heroGrid{grid-template-columns:1fr}
  .heroMediaFrame{aspect-ratio:16/9}
  .heroCardFloat{left:14px}
}
/* Промежуток между полной десктопной шапкой и мобильной (720px и ниже, см. блок ниже):
   на ширинах примерно 730–1100px пункту «Особые предложения» и названию бренда физически
   не хватает места в одну строку — переносятся на 2 строки и раздувают шапку на весь сайт
   (каталог/финмодель/рынки используют общую шапку). Не трогаем каталожную сетку/фильтры —
   только шапка переходит на бургер-меню чуть раньше, чем остальной мобильный layout. */
@media (max-width:1140px) and (min-width:721px){
  .navBurger{display:grid; place-items:center}
  .mainNav{position:fixed; inset:64px 12px auto; z-index:var(--z-nav); flex-direction:column; background:var(--surface); border:1px solid var(--line-soft); border-radius:var(--radius-lg); padding:12px; box-shadow:var(--shadow-pop); opacity:0; transform:translateY(-8px); pointer-events:none; transition:opacity .25s, transform .25s}
  body.navOpen .mainNav{opacity:1; transform:none; pointer-events:auto}
  .mainNav a{padding:12px 16px; font-size:15.5px}
  .brandText i{display:none}
  .topbarInner{gap:10px}
}
@media (max-width: 720px){
  .mainNav{position:fixed; inset:64px 12px auto; z-index:var(--z-nav); flex-direction:column; background:var(--surface); border:1px solid var(--line-soft); border-radius:var(--radius-lg); padding:12px; box-shadow:var(--shadow-pop); opacity:0; transform:translateY(-8px); pointer-events:none; transition:opacity .25s, transform .25s}
  body.navOpen .mainNav{opacity:1; transform:none; pointer-events:auto}
  .mainNav a{padding:12px 16px; font-size:15.5px}
  .navBurger{display:grid; place-items:center}
  .btnContact{display:none}
  .brandText i{display:none}
  .topbarInner{gap:10px}
  .topbarActions{gap:6px}
  .brand{min-width:0}
  .brandText{min-width:0}
  .langSwitch button{padding:9px 11px}
  .grid{grid-template-columns:1fr}
  .skeletonGrid{grid-template-columns:1fr}
  /* Каталог: высота обычной мобильной шапки — 75px (46px знак + 14px сверху/снизу + border).
     В compact-состоянии padding шапки становится 8px, а её высота — 61px (44px бургер + border).
     Панель всегда остаётся непосредственно под ней и на одном слое с шапкой. */
  body[data-page="catalog"] .controls{position:sticky; top:75px; z-index:var(--z-nav); margin:8px 0 26px; transition:top .2s ease}
  body[data-page="catalog"].scrolled .controls{top:61px}
  body[data-page="catalog"] .topbarInner{transition:padding .2s ease, gap .2s ease}
  body[data-page="catalog"].scrolled .topbarInner{padding-top:8px; padding-bottom:8px}
  body[data-page="catalog"] .brandMark{transition:width .2s ease, height .2s ease}
  body[data-page="catalog"].scrolled .brandMark{width:42px; height:42px}
  .controlsCard{padding:10px 12px}
  .modeSwitch button{white-space:nowrap; padding:11px 14px}
  .selectWrap select{padding-top:12px; padding-bottom:12px}
  .controlsCard{gap:8px}
  /* Переключатель режима (Смешанный/Инвестиции/Для жизни) виден только в начале списка;
     при скролле каталога сворачивается, чтобы прилипшая панель оставалась в одну строку
     (иконки разделов + Фильтры + вид) — см. .catalogQuickLinks выше, тот же приём в обратную сторону. */
  .modeSwitch{flex:1 1 100%; min-width:0; max-height:52px; opacity:1; visibility:visible; overflow:hidden; transition:max-height .22s ease, opacity .18s ease, margin .22s ease, visibility 0s linear 0s}
  body[data-page="catalog"].scrolled .modeSwitch{max-height:0; opacity:0; visibility:hidden; pointer-events:none; transition:max-height .22s ease, opacity .18s ease, margin .22s ease, visibility 0s linear .22s}
  .modeSwitch button{flex:1; padding-left:8px; padding-right:8px}
  .mobileFiltersTrigger,.viewSwitch{flex:1 1 0; min-width:0; margin-left:0}
  .mobileFiltersTrigger{border:1px solid var(--line); background:var(--surface); color:var(--ink); min-height:44px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; border-radius:999px; padding:10px 14px; font:600 13.5px/1 var(--font-ui); text-align:left; transition:border-color .2s, background .2s}
  .mobileFiltersTrigger:hover{border-color:var(--muted)}
  /* Быстрые разделы есть только в каталоге. В обычном состоянии они не занимают строку;
     при body.scrolled плавно раскрываются между фильтрами и переключателем вида. */
  .catalogQuickLinks{display:flex; flex:0 0 0; min-width:0; gap:3px; overflow:hidden; opacity:0; transform:translateX(-4px); pointer-events:none; transition:flex-basis .2s ease, opacity .18s ease, transform .2s ease}
  body[data-page="catalog"].scrolled .catalogQuickLinks{flex-basis:90px; opacity:1; transform:none; pointer-events:auto}
  .catalogQuickLink{display:grid; place-items:center; flex:0 0 28px; width:28px; min-height:44px; color:var(--ink-soft); border-radius:10px; transition:background-color .2s ease, color .2s ease}
  .catalogQuickLink:hover{background:var(--sand); color:var(--ink)}
  .catalogQuickLink svg{width:17px; height:17px}
  .viewSwitch button span{max-width:64px; overflow:hidden; white-space:nowrap; opacity:1; transition:max-width .2s ease, opacity .18s ease}
  body[data-page="catalog"].scrolled .viewSwitch button span{max-width:0; opacity:0}
  .viewSwitch button{flex:1; justify-content:center}
  .controlsCard>.metaLine{display:none}
  body.mobileFiltersOpen{overflow:hidden}
  .mobileFiltersSheet{position:fixed; inset:0; z-index:calc(var(--z-lightbox) + 2); display:flex; align-items:flex-end; background:rgba(15,20,17,.38); opacity:0; pointer-events:none; transition:opacity .25s ease}
  .mobileFiltersSheet.open{opacity:1; pointer-events:auto}
  .mobileFiltersSheetPanel{width:100%; max-height:min(84dvh,720px); overflow:auto; background:var(--surface); border:1px solid var(--line-soft); border-radius:var(--radius-lg) var(--radius-lg) 0 0; box-shadow:var(--shadow-pop); padding:18px 16px calc(16px + env(safe-area-inset-bottom)); transform:translateY(20px); transition:transform .25s var(--ease-out)}
  .mobileFiltersSheet.open .mobileFiltersSheetPanel{transform:none}
  .mobileFiltersSheetHead,.mobileFiltersActions{display:flex; align-items:center; justify-content:space-between; gap:10px}
  .mobileFiltersSheetHead{margin-bottom:16px}
  .mobileFiltersSheetHead h2{margin:0; font-family:var(--font-display); font-size:22px; font-weight:400}
  .mobileFiltersClose{width:38px; height:38px; border:1px solid var(--line); border-radius:50%; background:var(--surface); color:var(--ink); font-size:0}
  .mobileFiltersClose::before,.mobileFiltersClose::after{content:''; position:absolute; width:14px; height:1.5px; background:currentColor; transform:rotate(45deg)}
  .mobileFiltersClose{position:relative; display:grid; place-items:center}
  .mobileFiltersClose::after{transform:rotate(-45deg)}
  .mobileFiltersContent{display:grid; gap:12px}
  .mobileFiltersContent .selectWrap,.mobileFiltersContent .budgetControl{width:100%}
  .mobileFiltersContent .selectWrap select{width:100%; font-size:14px}
  .mobileFiltersContent .locationFilterTrigger{width:100%; min-height:44px; padding-top:12px; padding-bottom:12px; font-size:14px; text-align:left}
  .mobileFiltersContent .locationFilterPopover{position:static; display:none; width:100%; max-width:none; max-height:min(40vh,300px); margin-top:8px; opacity:1; visibility:visible; pointer-events:auto; transform:none; box-shadow:none}
  .mobileFiltersContent .locationMulti.open .locationFilterPopover{display:block}
  .mobileFiltersContent .budgetControl{padding:8px 4px; gap:8px}
  .mobileFiltersContent .budgetInputs input{width:calc(50% - 12px); min-height:40px; font-size:14px}
  .mobileFiltersActions{margin-top:18px}
  .mobileFiltersActions .btn{flex:1; justify-content:center; min-height:44px}
  @media (prefers-reduced-motion:reduce){
    .mobileFiltersSheet,.mobileFiltersSheetPanel,.mobileFiltersTrigger,.locationFilterTrigger,.locationFilterPopover{transition:none}
  }
  .themeToggle, .themeToggleTrack{width:64px; height:32px}
  .langSwitch button{padding:9px 13px}
  .viewSwitch button{padding:11px 8px}
  .viewSwitch{margin-left:0}
  .twoCols{grid-template-columns:1fr}
  .payGrid{grid-template-columns:1fr}
  .returnsTop{grid-template-columns:1fr}
  .returnStats{grid-template-columns:1fr 1fr}
  .marketCards{grid-template-columns:1fr}
  .marketCharts{grid-template-columns:1fr}
  .marketVerdicts{grid-template-columns:1fr}
  .decisionGrid{grid-template-columns:1fr}
  .thumbRow{grid-template-columns:repeat(6,1fr)}
  .heroStats{flex-wrap:wrap; gap:18px 32px}
  .heroCardFloat{position:static; margin-top:12px; backdrop-filter:none; background:var(--surface)}
  .shortlistEdition{grid-template-columns:1fr;min-height:0}
  .shortlistEditionCopy{min-height:420px}
  .shortlistEditionPhotos{grid-row:1;min-height:280px;padding:18px 18px 0}
  .shortlistEditionPhotos figure:first-child{border-radius:18px 0 0 0}
  .shortlistEditionPhotos figure:last-child{border-radius:0 18px 0 0}
  .shortlistProperties{grid-template-columns:1fr}
  .shortlistProperty{grid-template-columns:minmax(210px,.8fr) minmax(0,1.2fr)}
  .formGrid{grid-template-columns:1fr 1fr}
  #mapCanvas{height:62vh}
  .compareBar{width:calc(100vw - 24px); flex-wrap:wrap; justify-content:center; gap:6px; border-radius:20px; padding:8px 10px}
  .compareBar span{width:100%; text-align:center; font-size:12px}
  .compareBar .btn{padding:8px 11px; font-size:12px}
  .compareBar .btnClear{padding:6px 5px; font-size:12px}
}

@media (max-width:720px) and (prefers-reduced-motion:reduce){
  body[data-page="catalog"] .controls,
  body[data-page="catalog"] .topbarInner,
  body[data-page="catalog"] .brandMark,
  .catalogQuickLinks,
  .catalogQuickLink,
  .modeSwitch,
  .viewSwitch button span{transition:none}
}

@media (max-width:620px){
  .shortlistPresentation{margin-top:4px}
  .shortlistEdition{border-radius:22px}
  .shortlistEditionCopy{min-height:0;padding:27px 22px 23px}
  .shortlistEditionBrand{font-size:9.5px}
  .shortlistEditionBrand b{font-size:8px}
  .shortlistEditionEyebrow{margin:28px 0 10px;font-size:9.5px}
  .shortlistEdition h1{font-size:48px}
  .shortlistEditionIntro{margin-top:17px;font-size:13px}
  .shortlistEditionBottom{align-items:stretch;flex-direction:column;gap:18px}
  .shortlistEditionMeta{max-width:250px}
  .shortlistDownloadButton{width:100%}
  .shortlistEditionPhotos{min-height:160px;gap:6px;padding:12px 12px 0}
  .shortlistEditionPhotos figure:first-child{border-radius:13px 0 0 0}
  .shortlistEditionPhotos figure:last-child{border-radius:0 13px 0 0}
  .shortlistScreenNote{align-items:flex-start;margin:12px 0 18px;font-size:11.5px}
  .shortlistScreenNote i{margin-top:8px}
  .shortlistProperties{gap:15px}
  .shortlistProperty{grid-template-columns:1fr}
  .shortlistPropertyMedia{aspect-ratio:1.25/1;min-height:0}
  .shortlistPropertyImage{min-height:0}
  .shortlistPropertyCopy{padding:19px 17px 16px}
  .shortlistProperty h2{font-size:25px}
  .shortlistPropertyPrice{margin-bottom:14px}
  .shortlistLinks{gap:7px}
  .shortlistLinks a{padding:7px 9px;font-size:9.5px}
  .shortlistComparison{padding:18px 14px;margin-bottom:38px}
  .shortlistComparisonHead{align-items:stretch;flex-direction:column;margin-bottom:14px}
  .shortlistComparisonHead .btn{align-self:flex-start}
}

@media (max-width:400px){
  .brand,.brandText{min-width:0}
  .brandText b{display:block; max-width:calc(100vw - 188px); overflow:hidden; text-overflow:ellipsis; font-size:13px; letter-spacing:.08em}
  body[data-page="catalog"] .viewSwitch button{min-width:0; gap:4px; padding-left:5px; padding-right:5px}
  body[data-page="catalog"] .viewSwitch button span{max-width:36px; overflow:hidden; text-overflow:ellipsis}
  .formGrid input, .formGrid select, .formField input, .formField select, .formField textarea, .gateForm input, .budgetInputs input, .mobileFiltersContent .budgetInputs input{font-size:16px; min-height:44px}
  .compareBar{flex-wrap:wrap; justify-content:center; gap:6px; border-radius:20px; padding:8px 10px}
  .compareBar span{width:100%; text-align:center; font-size:12px}
  .compareBar .btn{padding:8px 11px; font-size:12px}
  .compareBar .btnClear{padding:6px 5px; font-size:12px}
  .linkLabelFull{display:none}
  .linkLabelShort{display:inline}
}

.siteToast{position:fixed; left:50%; bottom:22px; z-index:calc(var(--z-lightbox) + 1); max-width:calc(100vw - 32px); transform:translate(-50%,12px); opacity:0; pointer-events:none; background:var(--ink); color:var(--bg); border:1px solid color-mix(in srgb, var(--bg) 22%, transparent); border-radius:999px; box-shadow:var(--shadow-pop); padding:10px 16px; font-size:13px; font-weight:600; transition:opacity .2s ease, transform .2s ease}
.siteToast.show{opacity:1; transform:translate(-50%,0)}

/* ---------- Печать (investment memo / PDF) ---------- */
@media print{
  .topbar, .footer, .controls, .compareBar, .no-print, .backRow, .detailActions, .galleryNav, .heroActions{display:none !important}
  body{background:#fff; font-size:12px}
  .panel, .card, .fact, .textBox, .roiExplain{box-shadow:none !important; border-color:#ddd !important}
  .wrap{max-width:100%; padding:0}
  /* Гейт печатаем только если пользователь уже разблокирован — иначе кнопка "Скачать PDF" стала бы обходом гейта для кого угодно */
  body.registered .gateBlurRamp, body.registered .gateScrim, body.registered .gateCta{display:none !important}
  body.registered .gateContent{filter:none !important; pointer-events:auto !important; user-select:auto !important}
  body:not(.registered) .gate{display:none !important}
  a[href]::after{content:''}
}

/* ---- soft gate: блюр-спойлер + CTA на контакт ---- */
.gate{position:relative}
@media (max-width:720px){
  .gate{--ctaTop:28%; --scrimTop:20%}
}
.gateContent{pointer-events:none; user-select:none}
body.registered .gateContent{pointer-events:auto; user-select:auto}
.gateBlurRamp{position:absolute; inset:0;
  backdrop-filter:blur(7px); -webkit-backdrop-filter:blur(7px);
  -webkit-mask-image:linear-gradient(to bottom, transparent 0, transparent var(--spoiler0,80px), black var(--spoiler1,200px));
  mask-image:linear-gradient(to bottom, transparent 0, transparent var(--spoiler0,80px), black var(--spoiler1,200px));
  pointer-events:none; transition:opacity .35s ease}
body.registered .gateBlurRamp{opacity:0}
.gateScrim{position:absolute; left:0; right:0; top:var(--scrimTop,58%); bottom:0; background:linear-gradient(to bottom, transparent, var(--bg) 72%); pointer-events:none; transition:opacity .35s ease}
body.registered .gateScrim{opacity:0}
.gateCta{position:absolute; left:50%; top:var(--ctaTop,66%); transform:translate(-50%,-50%); width:min(420px,90%); background:var(--surface); border:1px solid var(--line-soft); border-radius:var(--radius-lg); padding:24px 26px; box-shadow:var(--shadow-pop); text-align:center; transition:opacity .3s ease, visibility .3s}
body.registered .gateCta{opacity:0; visibility:hidden; pointer-events:none}
.gateCta .lockRow{display:flex; align-items:center; justify-content:center; gap:7px; font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--accent); margin-bottom:10px}
.gateCta h3{font-family:var(--font-display); font-weight:400; font-size:19px; margin:0 0 8px}
.gateCta p{font-size:13px; color:var(--ink-soft); margin:0 0 16px}
.gateForm{display:flex; flex-direction:column; gap:9px}
.gateForm input{width:100%; font:inherit; font-size:13.5px; padding:11px 13px; border:1px solid var(--line); border-radius:var(--radius-sm); background:var(--surface-2); color:var(--ink)}
.gateForm input:focus-visible{outline:2px solid var(--accent); outline-offset:1px; border-color:var(--accent)}
.gateForm button{width:100%; margin-top:2px}
.gateMicro{font-size:11px; color:var(--muted); margin:12px 0 0}
.gateHp{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}
@media (prefers-reduced-motion: reduce){ .gateBlurRamp,.gateScrim,.gateCta{transition:none !important} }

/* Напоминание о закрытом разделе в конце каталога */
.privateNudge{max-width:760px; margin:12px auto 56px; padding:0 20px}
.privateNudgeCard{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-lg); box-shadow:var(--shadow-sm); padding:38px 30px; text-align:center}
.privateNudgeEyebrow{color:var(--accent); font-size:12px; letter-spacing:.14em; text-transform:uppercase; margin-bottom:10px}
.privateNudgeCard h2{font-family:'Prata',serif; font-weight:400; font-size:26px; margin:0 0 10px}
.privateNudgeCard p{color:var(--muted); max-width:520px; margin:0 auto 20px; line-height:1.55}
@media (max-width:640px){ .privateNudgeCard{padding:28px 18px} .privateNudgeCard h2{font-size:22px} }