/* ============================================================
   1REA.RU — дизайн-система витрины (Manrope, токены, тёмная тема)
   Источник: 1rea_html/assets/tokens.css + site_агентства/site.css
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');

:root{
  --navy:#0E1B2C; --navy-700:#16263B; --navy-600:#1E3350;
  --blue:#2F6BFF; --blue-600:#1F56E0; --blue-050:#EAF1FF;
  --magenta:#C026D3; --magenta-050:#FBEBFE;
  --bg:#F5F6F9; --bg-2:#EEF0F4; --surface:#FFFFFF; --surface-2:#FAFBFC; --line:#E7EAEF; --line-2:#D8DDE6;
  --ink:#0E1B2C; --ink-2:#3C475A; --ink-3:#5B6472; --ink-4:#8A93A3;
  --green:#18A957; --green-050:#E6F7EE; --amber:#E8920C; --amber-050:#FCF1DD;
  --red:#E0413E; --red-050:#FCEAEA; --violet:#7C5CFF; --violet-050:#EFEBFF; --teal:#0FA3A3;
  --r-xs:8px; --r-sm:10px; --r-md:14px; --r-lg:20px; --r-xl:28px; --r-pill:999px;
  --sh-1:0 1px 2px rgba(14,27,44,.06),0 1px 3px rgba(14,27,44,.04);
  --sh-2:0 2px 4px rgba(14,27,44,.05),0 8px 24px rgba(14,27,44,.07);
  --sh-3:0 12px 40px rgba(14,27,44,.12),0 4px 12px rgba(14,27,44,.06);
  --sh-pop:0 18px 50px rgba(14,27,44,.18);
  --maxw:1200px; --ease:cubic-bezier(.2,.7,.2,1);
  --accent:var(--blue); --accent-600:var(--blue-600); --text:var(--ink); --muted:var(--ink-3);
  --border:var(--line); --radius:var(--r-md); --shadow:var(--sh-1);
  --font:'Manrope',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
}
[data-theme="dark"]{
  --bg:#0A1320; --bg-2:#0E1B2C; --surface:#12203D; --surface-2:#16273E; --line:#233650; --line-2:#2C436A;
  --ink:#EEF3FB; --ink-2:#C2CEDF; --ink-3:#8FA0B8; --ink-4:#66788F;
  --blue-050:#16294B; --green-050:#0E2E20; --amber-050:#33260E; --red-050:#371717;
}

*{ box-sizing:border-box; }
body{ margin:0; font-family:var(--font); color:var(--ink); background:var(--bg); line-height:1.55;
  font-feature-settings:"ss01","cv01"; -webkit-font-smoothing:antialiased; }
h1,h2,h3,h4{ margin:0 0 .4em; font-weight:800; letter-spacing:-.02em; line-height:1.15; }
p{ margin:0; } a{ color:inherit; text-decoration:none; } img{ display:block; max-width:100%; }
button{ font-family:inherit; cursor:pointer; }
::selection{ background:var(--blue); color:#fff; }
.muted{ color:var(--ink-3); }
.wrap,.container{ width:100%; max-width:var(--maxw); margin:0 auto; padding:0 24px; }

/* pills + placeholder */
.pill{ display:inline-flex; align-items:center; gap:6px; height:24px; padding:0 10px; border-radius:var(--r-pill); font-size:12.5px; font-weight:700; }
.pill .dot{ width:6px; height:6px; border-radius:50%; background:currentColor; }
.st-active{ color:var(--green); background:var(--green-050); }
.st-sold{ color:var(--blue); background:var(--blue-050); }
.ph{ position:relative; overflow:hidden; display:grid; place-items:center;
  background:linear-gradient(135deg,rgba(47,107,255,.10),rgba(192,38,211,.06)),
  repeating-linear-gradient(45deg,rgba(14,27,44,.025) 0 14px,transparent 14px 28px),var(--bg-2); }
.ph .ph-cap{ position:absolute; left:10px; bottom:9px; font-size:11px; font-weight:700; color:var(--ink-4); background:rgba(255,255,255,.78); padding:3px 8px; border-radius:var(--r-pill); }

/* ===== Header ===== */
.site-head{ position:sticky; top:0; z-index:50; background:rgba(255,255,255,.82); backdrop-filter:saturate(160%) blur(14px); border-bottom:1px solid var(--line); }
[data-theme="dark"] .site-head{ background:rgba(14,27,44,.82); }
.site-head .row{ display:flex; align-items:center; gap:26px; height:70px; }
.brand{ display:flex; align-items:center; gap:12px; }
.brand .logo{ font-weight:800; font-size:20px; color:var(--navy); letter-spacing:-.02em; display:inline-flex; align-items:center; gap:5px; }
[data-theme="dark"] .brand .logo{ color:#fff; }
.brand .logo .sq{ width:10px; height:10px; border-radius:3px; background:var(--blue); }
.brand .sep{ width:1px; height:22px; background:var(--line-2); }
.brand .agency{ font-weight:800; font-size:17px; letter-spacing:-.01em; }
.brand .agency small{ display:block; font-size:11px; font-weight:600; color:var(--ink-4); letter-spacing:.04em; text-transform:uppercase; }
.nav{ display:flex; gap:4px; margin-left:auto; }
.nav a{ padding:9px 14px; border-radius:var(--r-sm); font-weight:600; font-size:14.5px; color:var(--ink-2); transition:background .15s,color .15s; }
.nav a:hover{ background:var(--bg-2); color:var(--ink); } .nav a.active{ color:var(--blue); }
.head-cta{ display:flex; align-items:center; gap:14px; }
.head-phone{ font-weight:800; font-size:15px; color:var(--ink); white-space:nowrap; }

/* ===== Buttons ===== */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:9px; height:46px; padding:0 22px; border-radius:var(--r-sm); font-weight:700; font-size:15px; transition:transform .12s var(--ease),box-shadow .2s,background .2s; white-space:nowrap; border:none; }
.btn:active{ transform:translateY(1px); }
.btn-primary,.btn--primary{ background:var(--blue); color:#fff; box-shadow:0 8px 20px rgba(47,107,255,.28); }
.btn-primary:hover,.btn--primary:hover{ background:var(--blue-600); }
.btn-dark{ background:var(--navy); color:#fff; } .btn-dark:hover{ background:var(--navy-600); }
.btn-ghost{ background:var(--surface); color:var(--ink); border:1px solid var(--line-2); } .btn-ghost:hover{ border-color:var(--ink-4); }
.btn-sm{ height:38px; padding:0 16px; font-size:14px; }
.btn--lg,.btn-lg{ height:54px; padding:0 28px; font-size:16px; }

/* ===== Property card ===== */
.card-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.pcard{ background:var(--surface); border:1px solid var(--line); border-radius:var(--r-md); overflow:hidden; box-shadow:var(--sh-1); transition:transform .18s var(--ease),box-shadow .25s; display:flex; flex-direction:column; }
.pcard:hover{ transform:translateY(-4px); box-shadow:var(--sh-3); }
.pcard .media{ aspect-ratio:4/3; position:relative; }
.pcard .media .badges{ position:absolute; top:12px; left:12px; display:flex; gap:6px; }
.pcard .media .fav{ position:absolute; top:10px; right:10px; width:34px; height:34px; border-radius:50%; background:rgba(255,255,255,.9); display:grid; place-items:center; color:var(--ink-3); box-shadow:var(--sh-1); border:none; }
.pcard .media .fav:hover,.pcard .media .fav.on{ color:var(--red); }
.pcard .body{ padding:16px 16px 18px; display:flex; flex-direction:column; gap:8px; flex:1; }
.pcard .price{ font-size:21px; font-weight:800; letter-spacing:-.02em; }
.pcard .price small{ font-size:13px; font-weight:700; color:var(--ink-4); }
.pcard .ttl{ font-size:15px; font-weight:700; color:var(--ink); }
.pcard .addr{ font-size:13.5px; color:var(--ink-3); display:flex; gap:6px; align-items:flex-start; line-height:1.35; }
.pcard .meta{ display:flex; gap:14px; margin-top:auto; padding-top:12px; border-top:1px solid var(--line); color:var(--ink-3); font-size:13px; font-weight:600; }
.pcard .meta b{ color:var(--ink); font-weight:700; }

/* ===== Section heads ===== */
.sec{ padding-top:84px; } section[id]{ scroll-margin-top:86px; }
.sec-head{ display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:30px; gap:20px; }
.sec-head .kicker{ color:var(--blue); font-weight:800; font-size:13px; letter-spacing:.08em; text-transform:uppercase; margin-bottom:10px; }
.sec-head h2{ font-size:36px; letter-spacing:-.03em; }
.sec-head p{ color:var(--ink-3); font-size:16px; margin-top:10px; max-width:520px; line-height:1.5; }

/* ===== Footer ===== */
.site-foot{ background:var(--navy); color:#cdd6e4; margin-top:90px; }
.site-foot .wrap{ padding-top:56px; padding-bottom:36px; }
.site-foot .cols{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:36px; }
.site-foot h4{ color:#fff; font-size:14px; letter-spacing:.02em; margin-bottom:16px; }
.site-foot a,.site-foot p{ font-size:14px; line-height:2; color:#9fb0c9; } .site-foot a:hover{ color:#fff; }
.foot-bottom{ border-top:1px solid rgba(255,255,255,.1); margin-top:40px; padding-top:22px; display:flex; justify-content:space-between; align-items:center; font-size:13px; color:#7d8da3; gap:14px; flex-wrap:wrap; }
.powered{ display:inline-flex; align-items:center; gap:7px; opacity:.9; font-weight:700; }

/* ===== Mobile drawer ===== */
.burger{ display:none; width:44px; height:44px; border-radius:var(--r-sm); align-items:center; justify-content:center; color:var(--ink); background:var(--surface); border:1px solid var(--line-2); }
.burger svg{ width:22px; height:22px; }
.m-drawer{ position:fixed; inset:0; z-index:90; display:none; } .m-drawer.show{ display:block; }
.m-drawer .bg{ position:absolute; inset:0; background:rgba(14,27,44,.45); }
.m-drawer .panel{ position:absolute; top:0; right:0; height:100%; width:300px; max-width:86vw; background:var(--surface); box-shadow:var(--sh-pop); transform:translateX(100%); transition:transform .26s var(--ease); display:flex; flex-direction:column; padding:18px; }
.m-drawer.show .panel{ transform:translateX(0); }
.m-drawer a.mlink{ display:flex; align-items:center; padding:14px 12px; border-radius:var(--r-sm); font-weight:700; font-size:16px; color:var(--ink); border-bottom:1px solid var(--line); }

/* forms (lead/search) */
input,select,textarea{ font:inherit; padding:.7em .85em; border:1px solid var(--line-2); border-radius:var(--r-sm); background:var(--surface); color:var(--ink); width:100%; }
input:focus,select:focus,textarea:focus{ outline:none; border-color:var(--blue); box-shadow:0 0 0 3px rgba(47,107,255,.15); }
.alert-ok{ background:var(--green-050); color:var(--green); padding:12px 16px; border-radius:var(--r-sm); margin-bottom:14px; font-weight:700; }
.consent{ font-size:.82rem; color:var(--ink-3); display:flex; gap:8px; align-items:flex-start; }
.consent input{ width:auto; }

@media (max-width:920px){
  .card-grid{ grid-template-columns:1fr 1fr; }
  .nav,.head-cta .head-phone,.head-cta .btn{ display:none; } .burger{ display:flex; }
  .site-head .row{ gap:14px; } .site-foot .cols{ grid-template-columns:1fr 1fr; }
  .sec{ padding-top:60px; } .sec-head h2{ font-size:28px; } .sec-head{ flex-direction:column; align-items:flex-start; }
}
@media (max-width:600px){ .wrap,.container{ padding:0 18px; } .card-grid{ grid-template-columns:1fr; } .site-foot .cols{ grid-template-columns:1fr; gap:24px; } .brand .agency small{ display:none; } }

/* ============================================================
   Legacy-мост: текущие страницы витрины до переверстки (Фаза 2).
   ============================================================ */
.site-header{ background:var(--surface); border-bottom:1px solid var(--line); }
.site-header__inner{ display:flex; align-items:center; justify-content:space-between; height:70px; }
.site-nav{ display:flex; gap:22px; } .site-nav a{ color:var(--ink); font-weight:600; }
.site-main{ padding:40px 0; min-height:60vh; }
.hero{ text-align:center; padding:70px 0 90px; color:#fff; border-radius:0 0 32px 32px;
  background:radial-gradient(1200px 400px at 70% -10%,#20407a,transparent),linear-gradient(160deg,var(--navy),var(--navy-700)); }
.hero h1{ font-size:clamp(2rem,4vw,3.1rem); } .hero__actions{ display:flex; gap:12px; justify-content:center; margin-top:24px; flex-wrap:wrap; }
.cards{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:18px; margin-top:24px; }
.card{ background:var(--surface); border:1px solid var(--line); border-radius:var(--r-md); padding:22px; box-shadow:var(--sh-1); }
.badge{ display:inline-block; background:rgba(255,255,255,.16); color:#fff; border-radius:var(--r-pill); padding:.25em .9em; font-size:.82rem; font-weight:700; }
.site-footer{ border-top:1px solid var(--line); padding:28px 0; color:var(--ink-3); margin-top:40px; background:var(--surface); }
.section{ padding:48px 0; } .grid-cards{ display:grid; grid-template-columns:repeat(auto-fill,minmax(290px,1fr)); gap:22px; }
.searchbar{ background:var(--surface); border-radius:var(--r-md); padding:14px; box-shadow:var(--sh-3); display:flex; gap:10px; flex-wrap:wrap; }
.filters{ display:flex; gap:10px; flex-wrap:wrap; background:var(--surface); border:1px solid var(--line); border-radius:var(--r-md); padding:14px; box-shadow:var(--sh-1); margin-bottom:22px; }
.card-obj{ background:var(--surface); border:1px solid var(--line); border-radius:var(--r-md); overflow:hidden; box-shadow:var(--sh-1); display:flex; flex-direction:column; transition:transform .18s,box-shadow .25s; }
.card-obj:hover{ transform:translateY(-4px); box-shadow:var(--sh-3); }
.card-obj__img{ aspect-ratio:16/10; background-size:cover; background-position:center; position:relative; }
.card-obj__noimg{ display:grid; place-items:center; color:var(--ink-4); background:var(--bg-2); height:100%; }
.card-obj__body{ padding:16px 18px; display:flex; flex-direction:column; gap:6px; flex:1; }
.card-obj__price{ font-size:1.4rem; font-weight:800; color:var(--navy); } .card-obj__title{ font-weight:700; }
.card-obj__meta{ color:var(--ink-3); font-size:.9rem; display:flex; gap:12px; flex-wrap:wrap; margin-top:auto; padding-top:10px; }
.card-obj__addr{ color:var(--ink-3); font-size:.88rem; }
.obj{ display:grid; grid-template-columns:1.7fr 1fr; gap:30px; }
.gallery__main{ aspect-ratio:16/10; background-size:cover; background-position:center; border-radius:var(--r-md); box-shadow:var(--sh-2); }
.gallery__thumbs{ display:flex; gap:10px; margin-top:12px; flex-wrap:wrap; }
.gallery__thumbs img{ width:92px; height:66px; object-fit:cover; border:2px solid transparent; border-radius:8px; cursor:pointer; }
.gallery__thumbs img.active{ border-color:var(--blue); }
.obj__price{ font-size:2rem; font-weight:800; color:var(--navy); }
.obj__specs{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin:22px 0; }
.spec{ background:var(--surface); border:1px solid var(--line); border-radius:var(--r-sm); padding:12px 14px; } .spec b{ display:block; }
.aside-card{ background:var(--surface); border:1px solid var(--line); box-shadow:var(--sh-2); border-radius:var(--r-md); padding:22px; position:sticky; top:90px; }
.lead-form{ display:flex; flex-direction:column; gap:10px; }
.manager{ display:flex; gap:12px; align-items:center; margin-bottom:16px; }
.manager__avatar{ width:48px; height:48px; border-radius:50%; background:var(--blue); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:800; }
.map-placeholder{ aspect-ratio:16/7; border-radius:var(--r-md); background:linear-gradient(135deg,#eef3fb,#e2e9f5); border:1px dashed var(--line); display:flex; align-items:center; justify-content:center; color:var(--ink-3); margin-top:24px; text-align:center; padding:20px; }
.obj-map{ height:360px; border-radius:var(--r-md); margin-top:24px; overflow:hidden; border:1px solid var(--line); }
.map-ext-link{ display:inline-block; margin-top:16px; font-weight:700; color:var(--blue); }
.ymap-pin{ width:22px; height:22px; border-radius:50% 50% 50% 0; background:var(--blue); border:3px solid #fff; box-shadow:0 2px 6px rgba(14,27,44,.35); transform:rotate(-45deg); }
@media (max-width:860px){ .obj{ grid-template-columns:1fr; } .aside-card{ position:static; } }