@import url("https://fonts.googleapis.com/css2?family=Onest:wght@400;500;600;700;800&family=Golos+Text:wght@400;500;600;700&display=swap");:root{--green-50:#ecf6f1;--green-100:#d2ebe0;--green-200:#a6d6c2;--green-300:#6fba9d;--green-400:#3e9c79;--green-500:#1f7e5c;--green-600:#166b4d;--green-700:#105540;--green-800:#0c4333;--green-900:#083026;--amber-400:#f2a94e;--amber-500:#e8973a;--amber-600:#cc7e26;--terra-400:#d97a57;--terra-500:#c85c3c;--terra-600:#a8472c;--white:#fff;--stone-bg:#faf8f5;--stone-50:#f4f1ec;--stone-100:#ece7df;--stone-200:#ded7cc;--stone-300:#c3b9ab;--stone-400:#9c9182;--stone-500:#756b5e;--stone-600:#574f44;--stone-700:#3d372e;--stone-800:#292419;--stone-900:#1a160f;--success:#1f7e5c;--success-bg:#ecf6f1;--rating:#e8973a;--rating-bg:#fcf1e2;--danger:#d14343;--danger-bg:#fbecec;--info:#2e6fb7;--info-bg:#e9f1fa;--fg-1:#1f1a12;--fg-2:#6b6253;--fg-3:#9c9182;--fg-on-primary:#fff;--fg-on-dark:#f4f1ec;--fg-link:#166b4d;--surface:#fff;--surface-sunk:#faf8f5;--surface-raised:#fff;--surface-dark:#0c4333;--border:#e7e0d6;--border-strong:#dad2c5;--border-focus:#1f7e5c;--r-xs:6px;--r-sm:8px;--r-md:12px;--r-lg:16px;--r-xl:20px;--r-2xl:28px;--r-pill:999px;--shadow-xs:0 1px 2px rgba(41,36,25,.06);--shadow-sm:0 1px 2px rgba(41,36,25,.05),0 1px 1px rgba(41,36,25,.04);--shadow-card:0 2px 8px rgba(41,36,25,.06),0 1px 2px rgba(41,36,25,.04);--shadow-md:0 8px 24px rgba(41,36,25,.1);--shadow-lg:0 16px 48px rgba(41,36,25,.14);--shadow-focus:0 0 0 4px rgba(31,126,92,.16);--container:1200px;--gutter:24px;--sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:20px;--sp-6:24px;--sp-8:32px;--sp-10:40px;--sp-12:48px;--sp-16:64px;--sp-20:80px;--sp-24:96px;--font-display:"Onest",system-ui,-apple-system,"Segoe UI",sans-serif;--font-text:"Golos Text",system-ui,-apple-system,"Segoe UI",sans-serif;--ease-out:cubic-bezier(0.22,0.61,0.36,1);--ease-in-out:cubic-bezier(0.45,0,0.2,1);--dur-fast:120ms;--dur:200ms;--dur-slow:320ms}.display{font-size:clamp(40px,5vw,56px);line-height:1.04}.display,.h1{font-family:var(--font-display);font-weight:800;letter-spacing:-.02em;color:var(--fg-1)}.h1{font-size:40px;line-height:1.1}.h2{font-size:32px;line-height:1.15;letter-spacing:-.015em}.h2,.h3{font-family:var(--font-display);font-weight:700;color:var(--fg-1)}.h3{font-size:24px;line-height:1.25;letter-spacing:-.01em}.h4{font-family:var(--font-text);font-weight:600;font-size:20px;line-height:1.3;letter-spacing:-.005em;color:var(--fg-1)}.body-lg{font-size:18px;line-height:1.55}.body,.body-lg{font-family:var(--font-text);font-weight:400;color:var(--fg-1)}.body{font-size:16px;line-height:1.5}.body-sm{font-weight:400;font-size:14px;line-height:1.45}.body-sm,.caption{font-family:var(--font-text);color:var(--fg-2)}.caption{font-weight:500;font-size:13px;line-height:1.4}.overline{font-family:var(--font-text);font-weight:600;font-size:12px;line-height:1.3;letter-spacing:.06em;text-transform:uppercase;color:var(--fg-2)}.num-lg{font-family:var(--font-display);font-weight:700;font-feature-settings:"tnum" 1;font-size:32px;line-height:1;letter-spacing:-.02em;color:var(--fg-1)}*{box-sizing:border-box}body{font-family:var(--font-text);color:var(--fg-1);background:var(--stone-bg);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}a{color:var(--fg-link);text-decoration:none}*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }
/*! tailwindcss v3.4.19 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.relative{position:relative}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.grid{display:grid}.hidden{display:none}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.overline{text-decoration-line:overline}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}
/* Portal UI components (ex-index.html inline styles) */
.container { max-width: var(--container); margin: 0 auto; padding: 0 24px; }
@media (max-width: 640px) { .container { padding: 0 16px; } }
.section { padding-top: 64px; padding-bottom: 64px; }
.muted { display:inline-flex; align-items:center; gap:5px; font-family:var(--font-text); font-size:13.5px; color:var(--fg-2); }
.muted svg { color: var(--fg-3); }
.ic svg { display:block; }
.star-fill svg { color: var(--amber-500); fill: var(--amber-500); }
.star-empty svg { color: var(--stone-300); fill: none; }
.verified-ic svg { color: var(--green-500); }

.hdr { position: sticky; top: 0; z-index: 80; background: rgba(255,255,255,.96); border-bottom: 1px solid var(--border); }
.hdr-inner { display:flex; align-items:center; gap:30px; height:68px; }
.hdr-desktop { display:flex; align-items:center; flex:1; gap:8px; margin-right:auto; min-width:0; }
.brand { display:flex; align-items:center; gap:10px; cursor:pointer; flex:none; }
.brand-mark { width:38px; height:38px; border-radius:11px; background:var(--green-500); display:flex; align-items:center; justify-content:center; flex:none; }
.brand-mark svg { width:24px; height:24px; }
.brand-word { font-family:var(--font-display); font-weight:800; font-size:23px; letter-spacing:-.02em; color:var(--fg-1); }
.hdr-nav { display:flex; gap:4px; margin-right:auto; }
.hdr-link { font-family:var(--font-text); font-weight:500; font-size:15px; color:var(--fg-2); padding:8px 12px; border-radius:8px; cursor:pointer; transition:background var(--dur), color var(--dur); white-space:nowrap; }
.hdr-link-short { display:none; }
.hdr-link:hover { background:var(--stone-50); color:var(--fg-1); }
.hdr-link.is-active { color:var(--green-700); font-weight:600; }
.hdr-actions { display:flex; align-items:center; gap:16px; }
.hdr-city { display:flex; align-items:center; gap:5px; font-family:var(--font-text); font-size:14px; color:var(--fg-2); cursor:pointer; }
.hdr-city svg { color: var(--green-600); }

.hdr-burger { display:none; align-items:center; justify-content:center; width:42px; height:42px; border:1px solid var(--border); border-radius:var(--r-md); background:#fff; color:var(--fg-1); cursor:pointer; margin-left:auto; flex:none; }
.hdr-burger svg { color:var(--fg-1); }
.hdr-drawer { display:none; }
.hdr-overlay { display:none; position:fixed; inset:0; background:rgba(26,22,15,.35); z-index:60; }
.hdr-overlay.is-open { display:block; }
body.menu-open { overflow:hidden; }

.btn { font-family:var(--font-text); font-weight:600; border:1px solid transparent; border-radius:var(--r-md); cursor:pointer; display:inline-flex; align-items:center; justify-content:center; gap:8px; white-space:nowrap; transition:background var(--dur) var(--ease-out), box-shadow var(--dur), border-color var(--dur); }
.btn-sm { height:38px; padding:0 15px; font-size:14px; }
.btn-md { height:46px; padding:0 20px; font-size:15px; }
.btn-lg { height:54px; padding:0 26px; font-size:16px; }
.btn-full { width:100%; }
.btn-primary { background:var(--green-500); color:#fff; }
.btn-primary:hover { background:var(--green-600); }
.btn-primary:active { background:var(--green-700); }
.btn-secondary { background:#fff; color:var(--fg-1); border-color:var(--border-strong); }
.btn-secondary:hover { background:var(--stone-50); }
.btn-ghost { background:transparent; color:var(--green-600); }
.btn-ghost:hover { background:var(--green-50); }
.btn-amber { background:var(--amber-500); color:#fff; }
.btn-amber:hover { background:var(--amber-600); }

.badge { font-family:var(--font-text); font-weight:600; font-size:12.5px; padding:5px 11px; border-radius:var(--r-pill); display:inline-flex; align-items:center; gap:5px; line-height:1; }
.badge-verified { background:var(--success-bg); color:var(--green-700); }
.badge-top { background:var(--rating-bg); color:var(--amber-600); }
.badge-info { background:var(--info-bg); color:var(--info); }
.badge-neutral { background:var(--stone-100); color:var(--stone-700); }
.rating { display:inline-flex; align-items:center; gap:5px; font-family:var(--font-display); font-weight:700; color:var(--fg-1); }
.rating small { font-family:var(--font-text); font-weight:500; color:var(--fg-3); }
.rating-md { font-size:16px; } .rating-sm { font-size:14px; } .rating-sm small { font-size:12.5px; }
.stars { display:inline-flex; gap:2px; }
.photo { position:relative; overflow:hidden; background:var(--stone-200); }
.photo-grain { position:absolute; inset:0; background:
    repeating-linear-gradient(135deg, rgba(255,255,255,.05) 0 14px, transparent 14px 28px),
    radial-gradient(130% 90% at 72% 8%, rgba(255,255,255,.20), transparent 58%),
    linear-gradient(0deg, rgba(26,22,15,.18), transparent 45%); }
.photo-mark { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,.34); }
.photo-mark svg { width:40px; height:40px; }

.hero { background:
    radial-gradient(80% 120% at 88% -10%, rgba(31,126,92,.10), transparent 60%),
    linear-gradient(180deg, #FFFFFF 0%, var(--stone-bg) 100%);
    padding:46px 0 54px; border-bottom:1px solid var(--border); }
.hero-inner { display:grid; grid-template-columns:1.12fr .88fr; gap:46px; align-items:stretch; }
.hero-right { display:flex; min-height:0; }
.hero-eyebrow { display:inline-flex; align-items:center; gap:7px; font-family:var(--font-text); font-weight:600; font-size:13px; color:var(--green-700); background:var(--green-50); padding:7px 13px; border-radius:var(--r-pill); }
.hero-eyebrow svg { color:var(--green-600); }
.hero-title { font-family:var(--font-display); font-weight:800; font-size:clamp(34px, 4.2vw, 46px); line-height:1.1; letter-spacing:-.025em; color:var(--fg-1); margin:18px 0 16px; text-wrap:balance; }
.hero-sub { font-family:var(--font-text); font-size:18px; line-height:1.55; color:var(--fg-2); max-width:520px; margin:0 0 26px; }
.hero-search { background:#fff; border:1px solid var(--border); border-radius:var(--r-xl); box-shadow:var(--shadow-md); padding:14px; }
.hero-tabs { display:flex; gap:4px; margin-bottom:12px; }
.hero-tab { font-family:var(--font-text); font-weight:600; font-size:14px; color:var(--fg-2); background:transparent; border:none; padding:8px 14px; border-radius:var(--r-pill); cursor:pointer; }
.hero-tab.is-on { background:var(--green-50); color:var(--green-700); }
.hero-search-row { display:flex; gap:10px; }
.hero-field { display:flex; align-items:center; gap:9px; height:54px; padding:0 14px; border:1px solid var(--border-strong); border-radius:var(--r-md); background:#fff; }
.hero-field svg { color:var(--fg-3); }
.hero-field input { border:none; outline:none; font-family:var(--font-text); font-size:15px; color:var(--fg-1); width:150px; background:transparent; }
.hero-field-grow { flex:1; } .hero-field-grow input { width:100%; }
.hero-chips { display:flex; gap:8px; margin-top:12px; flex-wrap:wrap; }
.hero-chip { font-family:var(--font-text); font-size:13px; color:var(--fg-2); background:var(--stone-50); border:1px solid var(--border); padding:7px 12px; border-radius:var(--r-pill); cursor:pointer; transition:border-color var(--dur), color var(--dur); }
.hero-chip:hover { border-color:var(--green-300); color:var(--green-700); }
.hero-photo { height:100%; min-height:100%; width:100%; border-radius:var(--r-2xl); flex:1; }
.hero-photo-card { position:absolute; left:16px; bottom:16px; right:16px; background:rgba(255,255,255,.95); backdrop-filter:blur(6px); border-radius:var(--r-lg); padding:12px 14px; display:flex; align-items:center; gap:12px; box-shadow:var(--shadow-md); }
.hero-photo-card .badge { margin-left:auto; flex:none; }
.hpc-logo { width:42px; height:42px; border-radius:10px; background:var(--green-700); color:#fff; font-family:var(--font-display); font-weight:800; display:flex; align-items:center; justify-content:center; font-size:16px; flex:none; }
.hpc-main { flex:1; } .hpc-name { font-family:var(--font-text); font-weight:600; font-size:14px; display:flex; align-items:center; gap:5px; margin-bottom:3px; }

.stats { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; padding-top:36px; padding-bottom:8px; }
.stat-n { font-family:var(--font-display); font-weight:800; font-size:34px; color:var(--green-600); letter-spacing:-.02em; font-feature-settings:'tnum' 1; }
.stat-l { font-family:var(--font-text); font-size:14px; color:var(--fg-2); margin-top:4px; }

.section-head { display:flex; justify-content:space-between; align-items:flex-end; gap:20px; margin-bottom:26px; }
.band { background:var(--stone-50); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }

.ccard-list { display:flex; flex-direction:column; gap:14px; }
.ccard { display:flex; gap:16px; background:#fff; border:1px solid var(--border); border-radius:var(--r-lg); padding:16px; cursor:pointer; transition:box-shadow var(--dur), transform var(--dur), border-color var(--dur); }
.ccard:hover { box-shadow:var(--shadow-md); transform:translateY(-2px); border-color:transparent; }
.ccard-logo { width:64px; height:64px; border-radius:var(--r-md); color:#fff; font-family:var(--font-display); font-weight:800; font-size:24px; display:flex; align-items:center; justify-content:center; flex:none; }
.ccard-main { flex:1; min-width:0; }
.ccard-top { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.ccard-name { font-family:var(--font-display); font-weight:700; font-size:18px; color:var(--fg-1); }
.ccard-meta { display:flex; align-items:center; gap:16px; margin:8px 0 11px; flex-wrap:wrap; }
.ccard-badges { display:flex; gap:8px; flex-wrap:wrap; }
.ccard-right { display:flex; flex-direction:column; align-items:flex-end; justify-content:space-between; flex:none; gap:8px; }
.ccard-from { font-family:var(--font-text); font-size:12px; color:var(--fg-3); }
.ccard-price { font-family:var(--font-display); font-weight:800; font-size:20px; color:var(--fg-1); letter-spacing:-.02em; white-space:nowrap; }

.pcard-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.pcard-grid-auto { display:grid; grid-template-columns:repeat(auto-fill, minmax(280px,1fr)); gap:20px; }
.pcard { background:#fff; border:1px solid var(--border); border-radius:var(--r-lg); overflow:hidden; cursor:pointer; transition:box-shadow var(--dur), transform var(--dur); }
.pcard:hover { box-shadow:var(--shadow-md); transform:translateY(-2px); }
.pcard-tag { position:absolute; top:12px; left:12px; z-index:2; font-family:var(--font-text); font-weight:600; font-size:12px; padding:5px 10px; border-radius:var(--r-pill); background:rgba(255,255,255,.95); color:var(--amber-600); }
.pcard-heart { position:absolute; top:10px; right:10px; z-index:2; width:34px; height:34px; border-radius:50%; background:rgba(255,255,255,.92); display:flex; align-items:center; justify-content:center; color:var(--stone-600); }
.pcard-body { padding:14px 16px 16px; }
.pcard-price { font-family:var(--font-display); font-weight:800; font-size:22px; letter-spacing:-.02em; color:var(--fg-1); }
.pcard-name { font-family:var(--font-text); font-weight:600; font-size:14.5px; color:var(--fg-1); margin:5px 0 11px; }
.pcard-specs { display:flex; gap:14px; }
.pcard-specs span { display:inline-flex; align-items:center; gap:5px; font-family:var(--font-text); font-size:13px; color:var(--fg-2); }
.pcard-specs svg { color:var(--fg-3); }

.how-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.how-card { background:#fff; border:1px solid var(--border); border-radius:var(--r-lg); padding:22px; position:relative; }
.how-ic { width:48px; height:48px; border-radius:var(--r-md); background:var(--green-50); color:var(--green-600); display:flex; align-items:center; justify-content:center; }
.how-num { position:absolute; top:20px; right:22px; font-family:var(--font-display); font-weight:800; font-size:22px; color:var(--stone-200); }
.how-h { font-family:var(--font-display); font-weight:700; font-size:18px; margin:16px 0 6px; color:var(--fg-1); }
.how-t { font-family:var(--font-text); font-size:14px; color:var(--fg-2); line-height:1.5; margin:0; }

.cta-band { position:relative; overflow:hidden; background:
    radial-gradient(90% 160% at 90% 0%, rgba(232,151,58,.22), transparent 55%),
    linear-gradient(120deg, var(--green-700), var(--green-800));
    border-radius:var(--r-2xl); padding:40px 44px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.cta-text h2 { margin:0 0 6px; }
.cta-text p { font-family:var(--font-text); font-size:16px; color:var(--green-100); margin:0; max-width:480px; }

.catalog { padding:28px 24px 64px; }
.crumbs { display:flex; align-items:center; gap:7px; font-family:var(--font-text); font-size:13px; color:var(--fg-3); margin-bottom:16px; }
.crumbs a { color:var(--fg-2); cursor:pointer; } .crumbs svg { color:var(--stone-300); }
.cat-title { font-family:var(--font-display); font-weight:800; font-size:clamp(26px, 5vw, 32px); letter-spacing:-.02em; margin:0 0 6px; color:var(--fg-1); }
.cat-sub { font-family:var(--font-text); font-size:15px; color:var(--fg-2); margin:0 0 26px; }
.cat-body { display:grid; grid-template-columns:272px 1fr; gap:28px; align-items:start; }
.filters { background:#fff; border:1px solid var(--border); border-radius:var(--r-lg); padding:20px; position:sticky; top:84px; }
.filters-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:4px; }
.filters-head h3 { font-family:var(--font-display); font-weight:700; font-size:18px; margin:0; color:var(--fg-1); }
.filters-reset { font-family:var(--font-text); font-size:13px; color:var(--green-600); cursor:pointer; }
.fgroup { padding:16px 0; border-bottom:1px solid var(--border); }
.fgroup-h { font-family:var(--font-text); font-weight:600; font-size:12px; color:var(--fg-2); margin-bottom:10px; text-transform:uppercase; letter-spacing:.04em; }
.fcheck { display:flex; align-items:center; gap:9px; padding:6px 0; cursor:pointer; }
.fbox { width:20px; height:20px; border-radius:6px; border:1.5px solid var(--border-strong); display:flex; align-items:center; justify-content:center; color:#fff; flex:none; transition:background var(--dur), border-color var(--dur); }
.fbox.on { background:var(--green-500); border-color:var(--green-500); }
.fcheck-l { font-family:var(--font-text); font-size:14px; color:var(--fg-1); flex:1; }
.fcheck-c { font-family:var(--font-text); font-size:12px; color:var(--fg-3); }
.frange { display:flex; gap:10px; }
.frange-field { display:flex; align-items:center; gap:6px; border:1px solid var(--border-strong); border-radius:var(--r-sm); padding:0 10px; height:42px; flex:1; }
.frange-field span { font-family:var(--font-text); font-size:13px; color:var(--fg-3); }
.frange-field input { border:none; outline:none; width:100%; font-family:var(--font-text); font-size:14px; color:var(--fg-1); background:transparent; }
.filters .btn { margin-top:18px; }
.cat-toolbar { display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; }
.cat-count { font-family:var(--font-text); font-weight:600; font-size:15px; color:var(--fg-1); }
.cat-sort { display:flex; gap:6px; }
.sort-btn { font-family:var(--font-text); font-size:13.5px; color:var(--fg-2); background:#fff; border:1px solid var(--border); padding:8px 13px; border-radius:var(--r-pill); cursor:pointer; transition:background var(--dur), border-color var(--dur), color var(--dur); }
.sort-btn.on { background:var(--green-50); border-color:var(--green-300); color:var(--green-700); font-weight:600; }
.empty { text-align:center; padding:48px; color:var(--fg-3); }
.empty svg { color:var(--stone-300); } .empty p { font-family:var(--font-text); max-width:340px; margin:12px auto 0; line-height:1.5; }

.profile { padding:24px 24px 64px; }
.gallery { display:grid; grid-template-columns:1.6fr 1fr; gap:14px; margin-bottom:28px; height:360px; }
.gal-main { height:100%; }
.gal-side { display:grid; grid-template-rows:1fr 1fr; gap:14px; }
.gal-side .photo { height:100%; }
.gal-more { position:absolute; inset:0; background:rgba(26,22,15,.45); display:flex; align-items:center; justify-content:center; color:#fff; font-family:var(--font-text); font-weight:600; font-size:16px; }
.profile-body { display:grid; grid-template-columns:1fr 340px; gap:32px; align-items:start; }
.profile-head { display:flex; gap:16px; align-items:center; }
.profile-logo { width:72px; height:72px; border-radius:var(--r-lg); color:#fff; font-family:var(--font-display); font-weight:800; font-size:26px; display:flex; align-items:center; justify-content:center; flex:none; }
.profile-name { font-family:var(--font-display); font-weight:800; font-size:clamp(22px, 5.5vw, 28px); letter-spacing:-.02em; color:var(--fg-1); display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.profile-meta { display:flex; align-items:center; gap:18px; margin-top:8px; flex-wrap:wrap; }
.profile-badges { display:flex; gap:8px; flex-wrap:wrap; margin:22px 0; }
.profile-about { font-family:var(--font-text); font-size:16px; line-height:1.6; color:var(--fg-1); max-width:640px; margin:0 0 24px; }
.facts { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; max-width:560px; }
.fact { display:flex; gap:12px; align-items:center; background:var(--stone-50); border-radius:var(--r-md); padding:14px 16px; }
.fact-ic { width:42px; height:42px; border-radius:10px; background:#fff; color:var(--green-600); display:flex; align-items:center; justify-content:center; flex:none; box-shadow:var(--shadow-xs); }
.fact-v { font-family:var(--font-display); font-weight:700; font-size:18px; color:var(--fg-1); }
.fact-l { font-family:var(--font-text); font-size:13px; color:var(--fg-2); }
.profile-sec { margin:34px 0 16px; }
.mats { display:flex; gap:10px; flex-wrap:wrap; }
.mat { display:inline-flex; align-items:center; gap:6px; font-family:var(--font-text); font-size:14px; color:var(--fg-1); background:#fff; border:1px solid var(--border); padding:9px 14px; border-radius:var(--r-pill); }
.mat svg { color:var(--green-600); }
.pcard-grid-3 { grid-template-columns:repeat(3,1fr); }
.reviews { display:flex; flex-direction:column; gap:14px; }
.review { background:#fff; border:1px solid var(--border); border-radius:var(--r-lg); padding:18px 20px; }
.review-top { display:flex; align-items:center; gap:12px; margin-bottom:10px; }
.review-ava { width:40px; height:40px; border-radius:50%; background:var(--green-100); color:var(--green-700); font-family:var(--font-display); font-weight:700; display:flex; align-items:center; justify-content:center; flex:none; }
.review-author { font-family:var(--font-text); font-weight:600; font-size:15px; color:var(--fg-1); }
.review-date { font-family:var(--font-text); font-size:13px; color:var(--fg-3); }
.review-stars { margin-left:auto; }
.review-text { font-family:var(--font-text); font-size:15px; line-height:1.55; color:var(--fg-1); margin:0; }
.profile-aside { position:sticky; top:84px; display:flex; flex-direction:column; gap:14px; }
.lead { background:#fff; border:1px solid var(--border); border-radius:var(--r-xl); box-shadow:var(--shadow-card); padding:22px; }
.lead-price { font-family:var(--font-display); font-weight:800; font-size:26px; letter-spacing:-.02em; color:var(--fg-1); }
.lead-cap { font-family:var(--font-text); font-size:13px; color:var(--fg-2); margin-top:2px; }
.lead-form { display:flex; flex-direction:column; gap:10px; margin-top:18px; }
.lead-field { display:flex; align-items:center; gap:10px; height:50px; border:1px solid var(--border-strong); border-radius:var(--r-md); padding:0 14px; }
.lead-field svg { color:var(--fg-3); }
.lead-field input { border:none; outline:none; width:100%; font-family:var(--font-text); font-size:15px; color:var(--fg-1); background:transparent; }
.lead-note { font-family:var(--font-text); font-size:11.5px; color:var(--fg-3); line-height:1.4; margin:12px 0 0; }
.lead-trust { display:flex; align-items:center; gap:7px; font-family:var(--font-text); font-size:13px; color:var(--green-700); margin-top:14px; padding-top:14px; border-top:1px solid var(--border); }
.lead-trust svg { color:var(--green-600); }
.lead-call { display:flex; align-items:center; gap:12px; background:var(--green-50); border-radius:var(--r-lg); padding:16px 18px; }
.lead-call svg { color:var(--green-600); }
.lead-call-l { font-family:var(--font-text); font-size:12px; color:var(--fg-2); }
.lead-call-n { font-family:var(--font-display); font-weight:700; font-size:18px; color:var(--fg-1); }

.placeholder { padding:96px 24px; text-align:center; }
.placeholder .ph-ic { width:72px; height:72px; border-radius:20px; background:var(--green-50); color:var(--green-600); display:inline-flex; align-items:center; justify-content:center; margin-bottom:22px; }
.placeholder h2 { font-family:var(--font-display); font-weight:800; font-size:30px; color:var(--fg-1); margin:0 0 10px; }
.placeholder p { font-family:var(--font-text); font-size:16px; color:var(--fg-2); max-width:420px; margin:0 auto 24px; line-height:1.55; }

.ftr { background:var(--green-900); color:var(--green-100); margin-top:24px; }
.ftr-inner { display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:32px; padding-top:56px; padding-bottom:36px; }
.ftr-tag { font-family:var(--font-text); font-size:14px; line-height:1.55; color:var(--green-200); max-width:300px; margin:16px 0 18px; }
.ftr-social { display:flex; gap:10px; }
.ftr-soc { width:38px; height:38px; border-radius:10px; background:rgba(255,255,255,.08); display:flex; align-items:center; justify-content:center; color:var(--green-100); cursor:pointer; transition:background var(--dur); }
.ftr-soc:hover { background:rgba(255,255,255,.16); }
.ftr-col h4 { font-family:var(--font-display); font-weight:700; font-size:15px; color:#fff; margin:0 0 14px; }
.ftr-col a { display:block; font-family:var(--font-text); font-size:14px; color:var(--green-200); padding:5px 0; cursor:pointer; transition:color var(--dur); }
.ftr-col a:hover { color:#fff; }
.ftr-bottom { display:flex; justify-content:space-between; padding-top:20px; padding-bottom:24px; border-top:1px solid rgba(255,255,255,.1); font-family:var(--font-text); font-size:12.5px; color:var(--green-300); }

@media (max-width: 980px) {
  .hero-inner { grid-template-columns: 1fr; gap: 28px; }
  .hero-right { order: -1; }
  .hero-photo { height: 300px; min-height: 300px; flex: none; }
  .hero-search-row { flex-direction: column; }
  .hero-search-row .btn { width: 100%; }
  .hero-field, .hero-field-grow { width: 100%; }
  .hero-field input { width: 100%; }
  .stats { grid-template-columns: 1fr 1fr; gap: 18px; }
  .how-grid { grid-template-columns: 1fr 1fr; }
  .pcard-grid, .pcard-grid-3 { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
  .ccard { flex-direction: column; }
  .ccard-right { align-items: flex-start; width: 100%; flex-direction: row; flex-wrap: wrap; justify-content: space-between; }
  .gallery { height: auto; grid-template-columns: 1fr; }
  .gal-main { min-height: 220px; height: 220px; }
  .gal-side { grid-template-columns: 1fr 1fr; grid-template-rows: none; height: 140px; }
  .cat-toolbar { flex-wrap: wrap; gap: 12px; }
  .cta-band { flex-direction: column; align-items: flex-start; padding: 28px 24px; }
  .cta-band .btn { width: 100%; }
  .ftr-inner { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 1280px) {
  .hdr-inner { justify-content: space-between; gap: 12px; }
  .hdr-desktop { display: none !important; }
  .hdr-burger { display: flex; }
  .hdr-drawer {
    display: none;
    flex-direction: column;
    position: fixed;
    top: 68px;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 70;
    background: #fff;
    transform: translateX(100%);
    transition: transform var(--dur) var(--ease-out);
  }
  .hdr-drawer.is-open {
    display: flex;
    transform: translateX(0);
  }
  .hdr-drawer-nav {
    flex: 1;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 16px 24px;
    border-top: 1px solid var(--border);
  }
  .hdr-drawer-nav .hdr-link { padding: 14px 16px; font-size: 16px; border-radius: var(--r-md); }
  .hdr-drawer-nav .hdr-link-full { display: inline; }
  .hdr-drawer-nav .hdr-link-short { display: none; }
  .hdr-drawer-foot {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 16px 24px 24px;
    border-top: 1px solid var(--border);
    background: #fff;
    box-shadow: 0 -8px 24px rgba(26, 22, 15, 0.06);
  }
  .hdr-drawer-foot .hdr-city {
    justify-content: center;
    padding: 10px;
    background: var(--stone-50);
    border-radius: var(--r-md);
  }
  .hdr-drawer-foot .btn { width: 100%; }
}

@media (max-width: 640px) {
  .stats { grid-template-columns: 1fr; }
  .how-grid { grid-template-columns: 1fr; }
  .ftr-inner { grid-template-columns: 1fr; }
  .ftr-bottom { flex-direction: column; gap: 8px; text-align: center; }
  .section-head { flex-direction: column; align-items: flex-start; gap: 12px; }
  .section-head .btn { align-self: stretch; }
  .cat-toolbar { flex-direction: column; align-items: flex-start; }
  .cat-sort { flex-wrap: wrap; width: 100%; }
  .sort-btn { flex: 1 1 auto; min-width: 0; }
  .gal-main { min-height: 260px; height: 260px; }
  .gal-side { grid-template-columns: 1fr; height: auto; }
  .gal-side .photo { min-height: 120px; height: 120px; }
}

@media (prefers-reduced-motion: reduce) { * { transition:none !important; } }

/* ============================================================
   КРОВ UI-кит — стили дополнительных страниц
   (карточка проекта, ипотека, смета, журнал, статья, сравнение, о проекте)
   ============================================================ */

/* ---- Карточка проекта дома ---- */
.pd { padding: 24px 24px 64px; }
.pd-title { font-family:var(--font-display); font-weight:800; font-size:clamp(24px, 5.5vw, 30px); letter-spacing:-.02em; color:var(--fg-1); margin:0 0 6px; }
.pd-sub { font-family:var(--font-text); font-size:15px; color:var(--fg-2); margin:0 0 22px; }
.pd-facts { grid-template-columns:repeat(3,1fr); max-width:none; }
.pd-row { display:flex; align-items:center; gap:9px; font-family:var(--font-text); font-size:14px; color:var(--fg-1); margin-top:10px; }
.pd-row svg { color:var(--green-600); }
.pd .lead-form { margin-top:16px; }

.includes { display:grid; grid-template-columns:1fr 1fr; gap:10px 24px; }
.inc { display:flex; align-items:flex-start; gap:10px; font-family:var(--font-text); font-size:14.5px; color:var(--fg-1); line-height:1.45; }
.inc-ic { width:22px; height:22px; border-radius:50%; background:var(--success-bg); color:var(--green-600); display:flex; align-items:center; justify-content:center; flex:none; margin-top:1px; }

.planning { display:grid; grid-template-columns:1.3fr 1fr; gap:24px; align-items:start; }
.plan-img { height:300px; background:var(--stone-100); }
.plan-watermark { position:absolute; inset:0; display:flex; flex-direction:column; gap:8px; align-items:center; justify-content:center; color:rgba(255,255,255,.55); font-family:var(--font-text); font-size:14px; font-weight:600; }
.rooms { display:flex; flex-direction:column; }
.room { display:flex; align-items:baseline; gap:8px; padding:11px 0; border-bottom:1px solid var(--border); font-family:var(--font-text); font-size:15px; }
.room-name { color:var(--fg-1); } .room-dots { flex:1; border-bottom:1px dotted var(--stone-300); transform:translateY(-4px); }
.room-area { color:var(--fg-2); font-weight:600; font-feature-settings:'tnum' 1; }
.room-total { border-bottom:none; } .room-total .room-name { font-weight:700; } .room-total .room-area { color:var(--green-700); }

.breakdown { background:#fff; border:1px solid var(--border); border-radius:var(--r-lg); padding:22px; }
.bd-bar { display:flex; height:16px; border-radius:var(--r-pill); overflow:hidden; margin-bottom:18px; }
.bd-bar span { height:100%; }
.bd-legend { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.bd-item { display:flex; align-items:center; gap:8px; }
.bd-dot { width:12px; height:12px; border-radius:4px; flex:none; }
.bd-label { font-family:var(--font-text); font-size:13.5px; color:var(--fg-2); flex:1; }
.bd-pct { font-family:var(--font-display); font-weight:700; font-size:15px; color:var(--fg-1); }

/* ---- Калькуляторы (ипотека / смета) ---- */
.mort { padding: 28px 24px 64px; }
.mort-grid { display:grid; grid-template-columns:1fr 360px; gap:28px; align-items:start; }
.mc-card { background:#fff; border:1px solid var(--border); border-radius:var(--r-xl); padding:26px; }
.mc-slider { margin-bottom:26px; }
.mc-slider-top { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:12px; font-family:var(--font-text); }
.mc-slider-top span { font-size:14px; color:var(--fg-2); }
.mc-slider-top b { font-family:var(--font-display); font-weight:700; font-size:19px; color:var(--fg-1); letter-spacing:-.01em; }
.mc-card input[type=range], .mort input[type=range] { -webkit-appearance:none; appearance:none; width:100%; height:6px; border-radius:var(--r-pill); background:var(--stone-200); outline:none; cursor:pointer; }
.mc-card input[type=range]::-webkit-slider-thumb, .mort input[type=range]::-webkit-slider-thumb { -webkit-appearance:none; appearance:none; width:24px; height:24px; border-radius:50%; background:#fff; border:5px solid var(--green-500); box-shadow:var(--shadow-sm); cursor:pointer; }
.mc-card input[type=range]::-moz-range-thumb, .mort input[type=range]::-moz-range-thumb { width:22px; height:22px; border-radius:50%; background:#fff; border:5px solid var(--green-500); cursor:pointer; }
.mc-down-abs { margin-top:-16px; margin-bottom:22px; font-family:var(--font-text); font-size:13px; color:var(--fg-3); }
.mc-prog { margin-top:4px; }
.mc-prog-list { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
.mc-prog-btn { display:flex; flex-direction:column; align-items:flex-start; gap:2px; padding:13px 16px; border:1.5px solid var(--border-strong); border-radius:var(--r-md); background:#fff; cursor:pointer; transition:border-color var(--dur), background var(--dur); }
.mc-prog-btn.on { border-color:var(--green-500); background:var(--green-50); }
.mc-prog-rate { font-family:var(--font-display); font-weight:800; font-size:20px; color:var(--green-700); }
.mc-prog-name { font-family:var(--font-text); font-size:13px; color:var(--fg-2); }

.mc-result { position:sticky; top:84px; background:var(--surface-dark); color:#fff; border-radius:var(--r-xl); padding:26px; box-shadow:var(--shadow-md); }
.mc-res-label { font-family:var(--font-text); font-size:14px; color:var(--green-200); }
.mc-res-main { font-family:var(--font-display); font-weight:800; font-size:38px; letter-spacing:-.02em; margin:6px 0 2px; }
.mc-res-sub { font-family:var(--font-text); font-size:14px; color:var(--green-200); margin-bottom:18px; }
.mc-res-rows { border-top:1px solid rgba(255,255,255,.14); padding-top:8px; margin:14px 0 20px; }
.mc-res-row { display:flex; justify-content:space-between; gap:12px; padding:8px 0; font-family:var(--font-text); font-size:14px; color:var(--green-100); }
.mc-res-row b { color:#fff; font-weight:700; font-feature-settings:'tnum' 1; }
.mc-result .btn-primary { background:var(--amber-500); }
.mc-result .btn-primary:hover { background:var(--amber-600); }
.mc-result .lead-trust { color:var(--green-100); border-top-color:rgba(255,255,255,.14); justify-content:center; }
.mc-result .lead-trust svg { color:var(--amber-400); }
.mc-result .lead-note { color:var(--green-200); text-align:center; }

/* Программы ипотеки */
.prog-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.prog-card { background:#fff; border:1px solid var(--border); border-radius:var(--r-lg); padding:20px; }
.prog-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.prog-logo { width:44px; height:44px; border-radius:11px; color:#fff; font-family:var(--font-display); font-weight:800; font-size:15px; display:flex; align-items:center; justify-content:center; }
.prog-name { font-family:var(--font-display); font-weight:700; font-size:17px; color:var(--fg-1); margin:0 0 6px; }
.prog-note { font-family:var(--font-text); font-size:13.5px; color:var(--fg-2); line-height:1.45; margin:0 0 14px; min-height:38px; }
.prog-meta { display:flex; flex-direction:column; gap:7px; padding-top:14px; border-top:1px solid var(--border); }
.prog-meta span { display:flex; align-items:center; gap:7px; font-family:var(--font-text); font-size:13.5px; color:var(--fg-1); }
.prog-meta svg { color:var(--green-600); }

.req-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; align-items:start; }
.req { background:#fff; border:1px solid var(--border); border-radius:var(--r-md); overflow:hidden; transition:border-color var(--dur), box-shadow var(--dur); }
.req.is-open { border-color:var(--green-300); box-shadow:var(--shadow-xs); }
.req-head { display:flex; align-items:center; gap:12px; width:100%; padding:16px 18px; border:none; background:transparent; cursor:pointer; text-align:left; font-family:var(--font-text); font-size:15px; color:var(--fg-1); }
.req-head:hover { background:var(--stone-50); }
.req-title { flex:1; line-height:1.35; }
.req-chev { display:flex; color:var(--fg-3); flex:none; transition:transform var(--dur) var(--ease-out); }
.req.is-open .req-chev { transform:rotate(180deg); color:var(--green-600); }
.req-ic { width:30px; height:30px; border-radius:8px; background:var(--success-bg); color:var(--green-600); display:flex; align-items:center; justify-content:center; flex:none; }
.req-detail { padding:0 18px 16px 60px; }
.req-detail p { margin:0; font-family:var(--font-text); font-size:14px; line-height:1.5; color:var(--fg-2); }

/* ---- Калькулятор сметы ---- */
.est-title-row { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:8px; }
.est-ai-badge { display:inline-flex; align-items:center; gap:7px; font-family:var(--font-text); font-weight:600; font-size:13px; color:var(--green-700); background:linear-gradient(135deg, var(--green-50), var(--rating-bg)); border:1px solid var(--green-200); padding:8px 14px; border-radius:var(--r-pill); flex:none; white-space:nowrap; }
.est-ai-badge svg { color:var(--amber-500); }
.est-group { margin-bottom:24px; }
.est-slider { margin-bottom:20px; }

.est-inputs { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:22px; }
.est-input { display:inline-flex; align-items:center; gap:8px; font-family:var(--font-text); font-weight:600; font-size:14px; padding:10px 16px; border-radius:var(--r-pill); border:1.5px solid var(--border-strong); background:#fff; color:var(--fg-2); cursor:pointer; transition:border-color var(--dur), background var(--dur), color var(--dur); }
.est-input.on { border-color:var(--green-500); background:var(--green-50); color:var(--green-700); }
.est-input-soon { font-size:11px; font-weight:600; color:var(--amber-600); background:var(--rating-bg); padding:2px 7px; border-radius:var(--r-pill); margin-left:4px; }

.est-alt { text-align:center; padding:32px 20px; background:var(--stone-50); border-radius:var(--r-lg); border:1px dashed var(--border-strong); }
.est-alt svg { color:var(--green-600); margin-bottom:12px; }
.est-alt p { font-family:var(--font-text); font-size:15px; line-height:1.55; color:var(--fg-2); max-width:420px; margin:0 auto 18px; }
.est-alt-back { font-family:var(--font-text); font-weight:600; font-size:14px; color:var(--green-600); background:transparent; border:none; cursor:pointer; text-decoration:underline; }

.tier { display:flex; flex-direction:column; gap:10px; }
.tier-btn { display:flex; flex-direction:column; align-items:flex-start; gap:3px; padding:14px 18px; border:1.5px solid var(--border-strong); border-radius:var(--r-md); background:#fff; cursor:pointer; text-align:left; transition:border-color var(--dur), background var(--dur); width:100%; }
.tier-btn.on { border-color:var(--green-500); background:var(--green-50); }
.tier-btn b { font-family:var(--font-display); font-weight:700; font-size:16px; color:var(--fg-1); }
.tier-btn small { font-family:var(--font-text); font-size:13px; color:var(--fg-2); line-height:1.4; }

.est-recalc { display:flex; align-items:center; justify-content:center; gap:8px; font-family:var(--font-text); font-size:14px; font-weight:600; color:var(--green-700); background:var(--green-50); border-radius:var(--r-md); padding:14px 18px; margin-top:8px; }
.est-recalc svg { color:var(--green-600); }

.est-result { position:sticky; top:84px; background:#fff; border:1px solid var(--border); border-radius:var(--r-xl); padding:24px; box-shadow:var(--shadow-card); min-height:320px; }
.est-empty { text-align:center; padding:40px 16px; }
.est-empty-ic { display:inline-flex; width:64px; height:64px; border-radius:18px; background:var(--stone-50); color:var(--stone-400); align-items:center; justify-content:center; margin-bottom:16px; }
.est-empty h3 { font-family:var(--font-display); font-weight:700; font-size:20px; color:var(--fg-1); margin:0 0 8px; }
.est-empty p { font-family:var(--font-text); font-size:14px; line-height:1.55; color:var(--fg-2); margin:0; max-width:280px; margin-inline:auto; }

.est-done { display:flex; flex-direction:column; gap:20px; }
.est-total-card { background:var(--surface-dark); color:#fff; border-radius:var(--r-lg); padding:20px 22px; }
.est-total-l { display:flex; align-items:center; gap:7px; font-family:var(--font-text); font-size:13px; color:var(--green-200); margin-bottom:8px; }
.est-total-l svg { color:var(--amber-400); }
.est-total-v { font-family:var(--font-display); font-weight:800; font-size:34px; letter-spacing:-.02em; line-height:1.1; }
.est-total-range { font-family:var(--font-text); font-size:13px; color:var(--green-200); margin-top:6px; line-height:1.45; }

.donut-wrap { display:flex; flex-direction:column; align-items:center; gap:14px; }
.donut { display:block; }
.donut-num { font-family:var(--font-display); font-weight:800; font-size:26px; fill:var(--fg-1); }
.donut-cap { font-family:var(--font-text); font-size:12px; fill:var(--fg-3); }
.donut-legend { display:flex; flex-direction:column; gap:8px; width:100%; }
.donut-legend span { display:flex; align-items:center; gap:8px; font-family:var(--font-text); font-size:13px; color:var(--fg-2); }
.donut-legend i { width:10px; height:10px; border-radius:3px; flex:none; display:inline-block; }

.est-stages { display:flex; flex-direction:column; gap:12px; }
.est-stage { display:flex; gap:12px; align-items:flex-start; }
.est-stage-ic { width:36px; height:36px; border-radius:10px; background:var(--green-50); color:var(--green-600); display:flex; align-items:center; justify-content:center; flex:none; }
.est-stage-main { flex:1; min-width:0; }
.est-stage-top { display:flex; justify-content:space-between; align-items:baseline; gap:10px; margin-bottom:6px; }
.est-stage-name { font-family:var(--font-text); font-weight:600; font-size:14px; color:var(--fg-1); }
.est-stage-top b { font-family:var(--font-display); font-weight:700; font-size:15px; color:var(--fg-1); font-feature-settings:'tnum' 1; white-space:nowrap; }
.est-stage-bar { height:6px; background:var(--stone-100); border-radius:var(--r-pill); overflow:hidden; margin-bottom:4px; }
.est-stage-bar span { display:block; height:100%; background:var(--green-500); border-radius:var(--r-pill); }
.est-stage-split { font-family:var(--font-text); font-size:12px; color:var(--fg-3); }

.est-actions { display:flex; gap:10px; }
.est-act { flex:1; display:inline-flex; align-items:center; justify-content:center; gap:7px; font-family:var(--font-text); font-weight:600; font-size:13.5px; color:var(--fg-2); background:#fff; border:1px solid var(--border-strong); border-radius:var(--r-md); padding:11px 14px; cursor:pointer; transition:background var(--dur), border-color var(--dur); }
.est-act:hover { background:var(--stone-50); border-color:var(--green-300); color:var(--green-700); }

.est-skeleton { padding:8px 0; }
.est-skel-head { display:flex; gap:14px; align-items:flex-start; margin-bottom:22px; }
.est-skel-spin { width:40px; height:40px; border-radius:12px; background:var(--green-50); color:var(--green-600); display:flex; align-items:center; justify-content:center; flex:none; animation:pulse 1.2s ease-in-out infinite; }
.est-skel-steps { display:flex; flex-direction:column; gap:8px; flex:1; }
.est-skel-step { display:flex; align-items:center; gap:10px; font-family:var(--font-text); font-size:13.5px; color:var(--fg-3); transition:color var(--dur); }
.est-skel-step.done { color:var(--green-700); }
.est-skel-step.active { color:var(--fg-1); font-weight:600; }
.est-skel-dot { width:14px; height:14px; border-radius:50%; border:2px solid var(--stone-300); flex:none; }
.skel-rows { display:flex; flex-direction:column; gap:12px; }
.skel-row { display:flex; align-items:center; gap:12px; }
.skel-bar { height:12px; background:linear-gradient(90deg, var(--stone-100) 25%, var(--stone-200) 50%, var(--stone-100) 75%); background-size:200% 100%; animation:shimmer 1.4s ease-in-out infinite; border-radius:var(--r-pill); flex:1; }
.skel-pill { width:72px; height:12px; background:var(--stone-100); border-radius:var(--r-pill); flex:none; }

.spin { animation:spin 1s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }
@keyframes shimmer { 0% { background-position:200% 0; } 100% { background-position:-200% 0; } }
@keyframes pulse { 0%, 100% { opacity:1; } 50% { opacity:.5; } }

.seg { display:flex; gap:8px; flex-wrap:wrap; }
.seg-btn { font-family:var(--font-text); font-weight:600; font-size:14px; padding:10px 16px; border-radius:var(--r-pill); border:1.5px solid var(--border-strong); background:#fff; color:var(--fg-2); cursor:pointer; transition:border-color var(--dur), background var(--dur), color var(--dur); }
.seg-btn.on { border-color:var(--green-500); background:var(--green-50); color:var(--green-700); }
.pkg-list { display:flex; flex-direction:column; gap:10px; }
.pkg { display:flex; align-items:center; gap:13px; padding:15px 18px; border:1.5px solid var(--border-strong); border-radius:var(--r-md); background:#fff; cursor:pointer; text-align:left; transition:border-color var(--dur), background var(--dur); }
.pkg.on { border-color:var(--green-500); background:var(--green-50); }
.pkg-radio { width:20px; height:20px; border-radius:50%; border:2px solid var(--border-strong); flex:none; position:relative; }
.pkg-radio.on { border-color:var(--green-500); }
.pkg-radio.on::after { content:""; position:absolute; inset:3px; border-radius:50%; background:var(--green-500); }
.pkg-main { display:flex; flex-direction:column; gap:2px; }
.pkg-main b { font-family:var(--font-text); font-weight:600; font-size:15px; color:var(--fg-1); }
.pkg-main small { font-family:var(--font-text); font-size:13px; color:var(--fg-2); }
.addon-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.addon { display:flex; align-items:center; gap:11px; padding:13px 15px; border:1.5px solid var(--border-strong); border-radius:var(--r-md); background:#fff; cursor:pointer; transition:border-color var(--dur), background var(--dur); }
.addon.on { border-color:var(--green-500); background:var(--green-50); }
.addon-name { font-family:var(--font-text); font-size:14px; color:var(--fg-1); flex:1; }
.addon-price { font-family:var(--font-text); font-size:13px; color:var(--fg-2); font-weight:600; }

/* ---- Журнал ---- */
.journal { padding: 28px 24px 64px; }
.jcats { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:26px; }
.jcat { font-family:var(--font-text); font-size:14px; font-weight:500; padding:8px 15px; border-radius:var(--r-pill); border:1px solid var(--border); background:#fff; color:var(--fg-2); cursor:pointer; transition:all var(--dur); }
.jcat.on { background:var(--green-600); border-color:var(--green-600); color:#fff; font-weight:600; }
.jfeatured { display:grid; grid-template-columns:1.3fr 1fr; gap:0; background:#fff; border:1px solid var(--border); border-radius:var(--r-lg); overflow:hidden; cursor:pointer; margin-bottom:30px; transition:box-shadow var(--dur); }
.jfeatured:hover { box-shadow:var(--shadow-md); }
.jfeat-img { height:100%; min-height:280px; }
.jfeat-body { padding:32px 34px; display:flex; flex-direction:column; justify-content:center; }
.jtag { display:inline-block; font-family:var(--font-text); font-weight:600; font-size:12px; color:var(--green-700); background:var(--green-50); padding:5px 11px; border-radius:var(--r-pill); width:fit-content; margin-bottom:14px; }
.jfeat-title { font-family:var(--font-display); font-weight:800; font-size:28px; line-height:1.15; letter-spacing:-.02em; color:var(--fg-1); margin:0 0 12px; }
.jfeat-ex { font-family:var(--font-text); font-size:16px; line-height:1.55; color:var(--fg-2); margin:0 0 18px; }
.jmeta { display:flex; align-items:center; gap:7px; font-family:var(--font-text); font-size:13.5px; color:var(--fg-3); }
.jmeta svg { color:var(--fg-3); }
.jdot { margin:0 3px; }
.jgrid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.jcard { background:#fff; border:1px solid var(--border); border-radius:var(--r-lg); overflow:hidden; cursor:pointer; transition:box-shadow var(--dur), transform var(--dur); }
.jcard:hover { box-shadow:var(--shadow-md); transform:translateY(-2px); }
.jcard-body { padding:18px 20px 20px; }
.jcard-title { font-family:var(--font-display); font-weight:700; font-size:18px; line-height:1.25; color:var(--fg-1); margin:10px 0 12px; }

.jload-more { display:flex; flex-direction:column; align-items:center; gap:10px; margin-top:32px; padding-top:8px; }
.jload-hint { font-family:var(--font-text); font-size:13px; color:var(--fg-3); }

/* ---- Статья ---- */
.article { padding: 28px 24px 64px; max-width:880px; }
.art-main { max-width:720px; }
.art-head { margin-bottom:20px; }
.art-title { font-family:var(--font-display); font-weight:800; font-size:clamp(26px, 6vw, 38px); line-height:1.12; letter-spacing:-.025em; color:var(--fg-1); margin:6px 0 14px; text-wrap:balance; }
.art-hero {
  width:100%; aspect-ratio:16/9; max-height:320px;
  margin-bottom:28px;
  border:1px solid var(--border);
  box-shadow:var(--shadow-xs);
  overflow:hidden;
}
.art-hero .photo-grain { opacity:0.85; }
.art-hero .photo-mark { opacity:0.22; }
.art-hero .photo-mark svg { width:52px; height:52px; }
.art-body { max-width:none; }
.art-lead { font-family:var(--font-text); font-size:20px; line-height:1.55; color:var(--fg-1); font-weight:500; margin:0 0 24px; }
.art-p { font-family:var(--font-text); font-size:17px; line-height:1.7; color:var(--stone-700); margin:0 0 20px; }
.art-callout { display:flex; gap:14px; background:var(--green-50); border-radius:var(--r-lg); padding:20px 22px; margin:28px 0; }
.art-callout svg { color:var(--green-600); flex:none; margin-top:2px; }
.art-callout p { font-family:var(--font-text); font-size:16px; line-height:1.55; color:var(--green-900); margin:0; }

/* ---- Сравнение ---- */
.compare { padding: 28px 24px 64px; }
.cmp-wrap { overflow-x:auto; border:1px solid var(--border); border-radius:var(--r-lg); background:#fff; }
.cmp-table { width:100%; border-collapse:collapse; min-width:760px; }
.cmp-corner { width:200px; }
.cmp-head { padding:22px 18px 18px; text-align:center; vertical-align:top; border-left:1px solid var(--border); border-bottom:1px solid var(--border); }
.cmp-logo { width:48px; height:48px; border-radius:12px; color:#fff; font-family:var(--font-display); font-weight:800; font-size:17px; display:inline-flex; align-items:center; justify-content:center; margin-bottom:10px; }
.cmp-name { display:flex; align-items:center; justify-content:center; gap:5px; font-family:var(--font-display); font-weight:700; font-size:15px; color:var(--fg-1); margin-bottom:8px; }
.cmp-label { padding:14px 18px; font-family:var(--font-text); font-size:14px; color:var(--fg-2); border-bottom:1px solid var(--border); background:var(--stone-50); white-space:nowrap; }
.cmp-cell { padding:14px 18px; text-align:center; border-left:1px solid var(--border); border-bottom:1px solid var(--border); font-family:var(--font-text); font-size:14px; color:var(--fg-1); }
.cmp-cell b { font-weight:700; }
.cmp-price { color:var(--green-700); }
.cmp-region, .cmp-mats { font-size:13px; color:var(--fg-2); }
.cmp-yes { display:inline-flex; width:28px; height:28px; border-radius:50%; background:var(--success-bg); color:var(--green-600); align-items:center; justify-content:center; }
.cmp-no { display:inline-flex; width:28px; height:28px; border-radius:50%; background:var(--stone-100); color:var(--stone-400); align-items:center; justify-content:center; }
.cmp-table tbody tr:last-child .cmp-cell, .cmp-table tbody tr:last-child .cmp-label { border-bottom:none; }

.cmp-cards { display:none; flex-direction:column; gap:16px; }
.cmp-card { background:#fff; border:1px solid var(--border); border-radius:var(--r-lg); padding:20px; }
.cmp-card-head { display:flex; align-items:center; gap:14px; margin-bottom:16px; padding-bottom:16px; border-bottom:1px solid var(--border); }
.cmp-card-logo { width:48px; height:48px; border-radius:12px; color:#fff; font-family:var(--font-display); font-weight:800; font-size:17px; display:flex; align-items:center; justify-content:center; flex:none; }
.cmp-card-name { font-family:var(--font-display); font-weight:700; font-size:17px; color:var(--fg-1); display:flex; align-items:center; gap:5px; margin-bottom:4px; }
.cmp-card-rows { display:flex; flex-direction:column; gap:10px; margin-bottom:16px; }
.cmp-card-row { display:flex; justify-content:space-between; align-items:center; gap:12px; font-family:var(--font-text); font-size:14px; }
.cmp-card-row span:first-child { color:var(--fg-2); }
.cmp-card-row span:last-child { color:var(--fg-1); text-align:right; }

/* ---- О проекте / Как проверяем ---- */
.about-hero { background:
    radial-gradient(70% 130% at 85% -20%, rgba(31,126,92,.12), transparent 60%),
    linear-gradient(180deg, #fff, var(--stone-bg)); padding:56px 0; border-bottom:1px solid var(--border); }
.about-title { font-family:var(--font-display); font-weight:800; font-size:clamp(28px, 7vw, 46px); line-height:1.08; letter-spacing:-.025em; color:var(--fg-1); margin:18px 0 16px; }
.about-sub { font-family:var(--font-text); font-size:18px; line-height:1.55; color:var(--fg-2); max-width:660px; margin:0; }
.about-criteria { display:grid; grid-template-columns:1fr 1.1fr; gap:48px; align-items:center; }
.about-crit-left h2 { margin:0 0 12px; }
.about-crit-sub { font-family:var(--font-text); font-size:16px; line-height:1.55; color:var(--fg-2); margin:0 0 24px; max-width:380px; }
.about-crit-list { display:flex; flex-direction:column; gap:12px; }
.crit { display:flex; align-items:center; gap:13px; background:#fff; border:1px solid var(--border); border-radius:var(--r-md); padding:16px 18px; font-family:var(--font-text); font-size:15.5px; color:var(--fg-1); }
.crit-ic { width:30px; height:30px; border-radius:8px; background:var(--success-bg); color:var(--green-600); display:flex; align-items:center; justify-content:center; flex:none; }

/* ---- Адаптив ---- */
@media (max-width: 980px) {
  .mort-grid, .est-grid, .planning, .about-criteria, .jfeatured, .profile-body { grid-template-columns:1fr; }
  .mc-result, .est-result, .profile-aside, .filters { position:static; }
  .prog-grid, .jgrid, .bd-legend, .pd-facts, .includes, .req-grid { grid-template-columns:1fr 1fr; }
  .cat-body { grid-template-columns:1fr; }
  .est-title-row { flex-direction:column; align-items:flex-start; }
  .cmp-wrap { display:none; }
  .cmp-cards { display:flex; }
}

@media (max-width: 640px) {
  .jgrid { grid-template-columns:1fr; }
  .includes, .req-grid, .bd-legend, .prog-grid { grid-template-columns:1fr; }
}