﻿@charset "UTF-8";
/* ============================================================
   VIPdosug.biz — основной файл стилей
   Кодировка: UTF-8 без BOM
   ============================================================ */

/* ---------- 1. Корневые переменные / дизайн-токены ---------- */
:root{
  /* Цвета */
  --bg:#fff7fb;
  --panel:#ffffff;
  --panel-2:#fff0f7;
  --text:#1a1030;
  --muted:#6f5f85;
  --pink:#ff2e88;
  --violet:#8b2fff;
  --orange:#ff8a00;
  --lime:#00d97e;
  --blue:#00b3ff;
  --yellow:#ffd400;
  --border:#ffd6ec;

  /* Радиусы скругления */
  --radius-sm:10px;
  --radius:14px;
  --radius-lg:20px;
  --radius-pill:999px;
  --radius-round:50%;
  --radius-burger:16px;

  /* Градиенты */
  --gradient-brand:linear-gradient(135deg,var(--pink),var(--violet) 55%,var(--blue));
  --gradient-hot:linear-gradient(135deg,var(--orange),var(--pink));
  --gradient-cool:linear-gradient(135deg,var(--lime),var(--blue));
  --gradient-text:linear-gradient(90deg,var(--pink),var(--violet),var(--blue));
  --gradient-rainbow:linear-gradient(90deg,var(--pink),var(--orange),var(--yellow),var(--lime),var(--blue),var(--violet));
  --gradient-footer:linear-gradient(135deg,var(--violet),var(--pink) 60%,var(--orange));
  --gradient-soft:linear-gradient(135deg,#fff0f7,#efe6ff);
  --gradient-card-badge:linear-gradient(135deg,var(--pink),var(--violet) 60%,var(--blue));

  /* Тени */
  --shadow-xs:0 2px 5px rgba(0,0,0,.05);
  --shadow-sm:0 4px 10px rgba(139,47,255,.10);
  --shadow-md:0 8px 20px rgba(139,47,255,.18);
  --shadow-lg:0 12px 28px rgba(255,46,136,.18);
  --shadow-xl:0 16px 32px rgba(255,46,136,.25);
  --shadow-pink:0 10px 24px rgba(255,46,136,.35);
  --shadow-violet:0 10px 24px rgba(139,47,255,.35);
  --shadow-orange:0 10px 24px rgba(255,138,0,.35);
  --shadow-lime:0 6px 14px rgba(0,217,126,.35);
  --shadow-modal:0 30px 80px rgba(26,16,48,.4);
  --shadow:0 12px 28px rgba(255,46,136,.18);

  /* Тайминги анимаций */
  --ease:cubic-bezier(.2,.8,.2,1);
  --dur:.2s;
  --dur-med:.28s;
  --dur-slow:.35s;

  /* Границы */
  --border-thin:1.5px solid var(--border);
  --border-thick:2px solid var(--border);

  /* Размеры иконок и бейджей */
  --icon-size:20px;
  --price-icon:16px;

  /* Размеры шрифтов карточки */
  --card-city-fs:13px;
  --card-badge-fs:13px;
  --card-params-fs:13px;
  --card-prices-fs:13px;
  --card-meta-fs:13px;

  /* Иконки (SVG в data-URI) */
  --icon-city:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none'><path d='M3 7 L11 4 L21 7 L29 4 L29 25 L21 28 L11 25 L3 28 Z' fill='%23ffffff' opacity='0.28' stroke='%23ffffff' stroke-width='1.4' stroke-linejoin='round'/><path d='M11 4 L11 25' stroke='%23ffffff' stroke-width='1.6' opacity='0.9'/><path d='M21 7 L21 28' stroke='%23ffffff' stroke-width='1.6' opacity='0.9'/><rect x='13' y='14' width='3' height='4' rx='0.6' fill='%23ffffff'/><rect x='17' y='12' width='3' height='6' rx='0.6' fill='%23ffffff'/><rect x='5' y='16' width='3' height='4' rx='0.6' fill='%23ffffff'/><rect x='24' y='15' width='3' height='5' rx='0.6' fill='%23ffffff'/><path d='M16 6 C13 6 11 8.2 11 10.8 C11 14 16 20 16 20 C16 20 21 14 21 10.8 C21 8.2 19 6 16 6 Z' fill='%238b2fff' stroke='%23ffffff' stroke-width='1.6' stroke-linejoin='round'/><circle cx='16' cy='10.8' r='1.8' fill='%23ffffff'/><circle cx='26' cy='9' r='1.6' fill='%23ffd400'/></svg>");

  --icon-metro:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none'><circle cx='16' cy='16' r='12' fill='%23ffffff' opacity='0.28' stroke='%23ffffff' stroke-width='1.6'/><path d='M11 22 L11 11 L16 18 L21 11 L21 22' fill='none' stroke='%23ffffff' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'/><line x1='10' y1='25' x2='22' y2='25' stroke='%238b2fff' stroke-width='2' stroke-linecap='round'/><line x1='12' y1='27.5' x2='20' y2='27.5' stroke='%238b2fff' stroke-width='2' stroke-linecap='round'/><circle cx='25.5' cy='9.5' r='1.6' fill='%23ffd400'/></svg>");

  --icon-raion:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none'><path d='M3 26 C8 24.5 24 24.5 29 26 L29 28 L3 28 Z' fill='%238b2fff' opacity='0.8'/><rect x='6' y='12' width='7' height='13' rx='1' fill='%23ffffff'/><rect x='7.5' y='14' width='1.6' height='1.6' fill='%238b2fff'/><rect x='10' y='14' width='1.6' height='1.6' fill='%238b2fff'/><rect x='7.5' y='17' width='1.6' height='1.6' fill='%238b2fff'/><rect x='10' y='17' width='1.6' height='1.6' fill='%238b2fff'/><rect x='7.5' y='20' width='1.6' height='1.6' fill='%238b2fff'/><rect x='10' y='20' width='1.6' height='1.6' fill='%238b2fff'/><path d='M14 25 L14 15 L19 12 L24 15 L24 25 Z' fill='%23ffffff'/><path d='M14 15 L19 12 L24 15' stroke='%238b2fff' stroke-width='1.4' stroke-linejoin='round' fill='none'/><rect x='17.5' y='20' width='3' height='5' fill='%238b2fff'/><rect x='15.5' y='17' width='2' height='2' fill='%238b2fff'/><rect x='20.5' y='17' width='2' height='2' fill='%238b2fff'/><circle cx='27' cy='17' r='3.4' fill='%23ffffff'/><rect x='26.2' y='19' width='1.6' height='6' fill='%23ffffff'/><path d='M3 25.5 C8 24 24 24 29 25.5' stroke='%23ffffff' stroke-width='1.4' fill='none' opacity='0.9'/><circle cx='27' cy='10' r='1.6' fill='%23ffd400'/></svg>");

  --icon-phone:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'><path d='M6.6 10.8c1.4 2.8 3.8 5.1 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.3.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1C10.3 21 3 13.7 3 4.5c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.2.2 2.4.6 3.6.1.4 0 .8-.2 1l-2.3 2.7z' fill='%23ffffff'/></svg>");

  --icon-search:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none'><circle cx='14' cy='14' r='9' fill='%23ffffff' opacity='0.28' stroke='%23ffffff' stroke-width='2.8'/><line x1='20.5' y1='20.5' x2='27' y2='27' stroke='%23ffffff' stroke-width='3.4' stroke-linecap='round'/><circle cx='10.5' cy='10.5' r='2.2' fill='%238b2fff'/><circle cx='27' cy='8' r='1.6' fill='%23ffd400'/></svg>");

  --icon-pin:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'><path d='M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7z' fill='%23ff2e88'/><circle cx='12' cy='9' r='2.6' fill='%23ffffff'/></svg>");
  --icon-pin-simple:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7z' fill='%23000'/><circle cx='12' cy='9' r='2.6' fill='%23fff'/></svg>");
}

/* ---------- 2. Сброс и базовая типографика ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body,h1,h2,h3,p,ul,dl,dd,figure{margin:0}
ul,ol{padding:0;list-style:none}
img,svg{display:block;max-width:100%}
button,input{font:inherit;color:inherit}
button{background:none;border:none;cursor:pointer}
a{color:inherit;text-decoration:none}
:focus-visible{outline:3px solid var(--violet);outline-offset:2px;border-radius:6px}

body{
  font-family:"Inter","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  font-size:16px;line-height:1.55;color:var(--text);
  background:
    radial-gradient(1200px 600px at 10% -10%,#ffe0f0 0%,transparent 60%),
    radial-gradient(1000px 500px at 110% 10%,#e6dcff 0%,transparent 55%),
    var(--bg);
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
}

/* ---------- 3. Утилитарные классы ---------- */

/* Скрытие элемента только визуально (для скринридеров) */
.visually-hidden{
  position:absolute !important;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;
  clip:rect(0 0 0 0);
  clip-path:inset(50%);
  white-space:nowrap;
  border:0;
}

/* Ссылка «перейти к содержимому» (появляется при фокусе) */
.skip-link{
  position:absolute;top:0;left:0;
  background:var(--violet);color:#fff;padding:.75rem 1rem;
  z-index:9999;border-radius:0 0 10px 0;font-weight:700;
  transform:translateY(-120%);
  transition:transform var(--dur) var(--ease);
}
.skip-link:focus{transform:translateY(0)}

/* ---------- 4. Шапка сайта ---------- */
.site-header{
  position:sticky;top:0;z-index:50;background:var(--panel);
  border-bottom:3px solid transparent;
  border-image:linear-gradient(90deg,var(--pink),var(--violet),var(--blue)) 1;
  box-shadow:var(--shadow);
}
.site-header__inner{
  max-width:1200px;margin:0 auto;
  padding:.875rem 1.25rem;
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
}
.header-left{display:flex;align-items:center;gap:.875rem;min-width:0}

/* Бургер-кнопка */
.burger-wrap{display:flex;align-items:center;cursor:pointer;user-select:none;}
.burger{
  position:relative;width:52px;height:52px;flex-shrink:0;display:grid;place-items:center;
  background:var(--gradient-brand);border-radius:var(--radius-burger);
  box-shadow:
    0 8px 20px rgba(139,47,255,.45),
    0 0 0 3px rgba(255,255,255,.6),
    0 0 0 5px rgba(255,46,136,.15);
  transition:box-shadow var(--dur) var(--ease),transform var(--dur) var(--ease);
  animation:burgerPulse 2.4s ease-in-out infinite;
}
.burger-wrap:hover .burger{
  transform:scale(1.06);
  box-shadow:
    0 12px 28px rgba(255,46,136,.55),
    0 0 0 3px rgba(255,255,255,.8),
    0 0 0 6px rgba(139,47,255,.22);
}
.burger-wrap:active .burger{transform:scale(.97)}

/* Пульсация бургера */
@keyframes burgerPulse{
  0%,100%{
    box-shadow:
      0 8px 20px rgba(139,47,255,.45),
      0 0 0 3px rgba(255,255,255,.6),
      0 0 0 5px rgba(255,46,136,.15);
  }
  50%{
    box-shadow:
      0 12px 26px rgba(255,46,136,.55),
      0 0 0 3px rgba(255,255,255,.85),
      0 0 0 8px rgba(139,47,255,.08);
  }
}

/* Жёлтый бейдж-индикатор на бургере */
.burger::after{
  content:"";position:absolute;top:6px;right:6px;width:10px;height:10px;border-radius:var(--radius-round);
  background:#ffd400;
  box-shadow:0 0 0 2.5px #fff, 0 0 12px rgba(255,212,0,.9);
  animation:badgePulse 1.8s ease-in-out infinite;
}
@keyframes badgePulse{
  0%,100%{transform:scale(1);opacity:1}
  50%{transform:scale(1.15);opacity:.85}
}

/* Полоски бургера */
.burger__lines{position:relative;width:24px;height:18px}
.burger__lines span,
.burger__lines span::before,
.burger__lines span::after{
  position:absolute;left:0;width:24px;height:2.8px;background:#fff;border-radius:3px;
  box-shadow:0 1px 2px rgba(0,0,0,.18);
  transition:transform var(--dur) var(--ease),top var(--dur) var(--ease),width var(--dur) var(--ease);
}
.burger__lines span{top:50%;transform:translateY(-50%)}
.burger__lines span::before{content:"";top:-8px}
.burger__lines span::after{content:"";top:8px}

/* Анимация полосок при наведении */
.burger-wrap:hover .burger__lines span::before{top:-9px;width:22px;transform:translateX(2px)}
.burger-wrap:hover .burger__lines span::after{top:9px;width:22px;transform:translateX(2px)}

/* Логотип и название бренда */
.brand{display:flex;align-items:center;gap:.875rem}
.brand__logo{
  width:56px;height:56px;flex-shrink:0;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'><defs><linearGradient id='lb' x1='0' y1='0' x2='1' y2='1'><stop offset='0' stop-color='%23ff2e88'/><stop offset='0.5' stop-color='%238b2fff'/><stop offset='1' stop-color='%2300b3ff'/></linearGradient><linearGradient id='lv' x1='0' y1='0' x2='0' y2='1'><stop offset='0' stop-color='%23ffffff'/><stop offset='1' stop-color='%23ffe4f0'/></linearGradient><radialGradient id='lg' cx='0.5' cy='0.4' r='0.7'><stop offset='0' stop-color='%23ffffff' stop-opacity='0.35'/><stop offset='1' stop-color='%23ffffff' stop-opacity='0'/></radialGradient></defs><path d='M32 3 L61 32 L32 61 L3 32 Z' fill='url(%23lb)'/><path d='M32 3 L61 32 L32 61 L3 32 Z' fill='url(%23lg)'/><path d='M32 8 L56 32 L32 56 L8 32 Z' fill='none' stroke='%23ffffff' stroke-width='1.2' opacity='0.55'/><path d='M32 12 L52 32 L32 52 L12 32 Z' fill='none' stroke='%23ffffff' stroke-width='0.6' opacity='0.3'/><path d='M18 26 Q14 22 18 18 Q22 15 24 20' fill='none' stroke='%23ffffff' stroke-width='1.6' stroke-linecap='round' opacity='0.85'/><path d='M46 26 Q50 22 46 18 Q42 15 40 20' fill='none' stroke='%23ffffff' stroke-width='1.6' stroke-linecap='round' opacity='0.85'/><path d='M20 24 L32 46 L44 24 L39.5 24 L32 37 L24.5 24 Z' fill='url(%23lv)'/><circle cx='20' cy='18' r='1.9' fill='%23ffffff'/><circle cx='32' cy='15' r='2.3' fill='%23ffffff'/><circle cx='44' cy='18' r='1.9' fill='%23ffffff'/><circle cx='32' cy='50' r='1.6' fill='%23ffffff' opacity='0.9'/></svg>");
  background-repeat:no-repeat;background-position:center;background-size:contain;
  filter:drop-shadow(0 8px 18px rgba(255,46,136,.42));
  transition:transform var(--dur-slow) var(--ease),filter var(--dur-slow) var(--ease);
}
.brand:hover .brand__logo{
  transform:rotate(-4deg) scale(1.05);
  filter:drop-shadow(0 10px 22px rgba(139,47,255,.5));
}
.brand__text{display:flex;flex-direction:column;line-height:1.05}
.brand__name{
  font-size:1.375rem;font-weight:900;letter-spacing:-.02em;
  background:var(--gradient-text);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.brand__tag{
  font-size:.6875rem;font-weight:700;letter-spacing:.125em;
  text-transform:uppercase;color:var(--muted);
}

/* Кнопка «Личный кабинет» */
.account-btn{
  margin-left:auto;flex-shrink:0;display:flex;align-items:center;gap:.625rem;
  padding:.5rem .875rem .5rem .5rem;border-radius:var(--radius);
  background:var(--gradient-soft);
  border:var(--border-thin);color:var(--text);text-decoration:none;
  box-shadow:var(--shadow-sm);
  transition:background var(--dur) var(--ease),border-color var(--dur) var(--ease),
             box-shadow var(--dur) var(--ease),transform var(--dur) var(--ease);
  white-space:nowrap;
}
.account-btn:hover{
  background:var(--gradient-brand);border-color:transparent;color:#fff;
  box-shadow:var(--shadow-pink);transform:translateY(-1px);
}
.account-btn:active{transform:translateY(0) scale(.99)}

.account-btn__icon{
  width:36px;height:36px;flex-shrink:0;display:grid;place-items:center;
  border-radius:var(--radius-round);background:var(--gradient-brand);
  box-shadow:0 4px 10px rgba(139,47,255,.28);
  transition:background var(--dur) var(--ease),box-shadow var(--dur) var(--ease);
  position:relative;
}
.account-btn__icon::before{
  content:"";position:absolute;inset:0;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'><circle cx='12' cy='8' r='4' fill='%23ffffff'/><path d='M4 20 C4 15.5 7.6 13 12 13 C16.4 13 20 15.5 20 20 L20 21 L4 21 Z' fill='%23ffffff'/></svg>");
  background-repeat:no-repeat;background-position:center;background-size:22px 22px;
}
.account-btn:hover .account-btn__icon{
  background:rgba(255,255,255,.25);
  box-shadow:0 4px 12px rgba(0,0,0,.15);
}

.account-btn__text{
  display:flex;flex-direction:column;line-height:1.15;text-align:left;min-width:0;
}
.account-btn__title{font-size:.875rem;font-weight:800;letter-spacing:-.01em;}
.account-btn__sub{
  font-size:.6875rem;font-weight:600;color:var(--muted);
  transition:color var(--dur) var(--ease);
}
.account-btn:hover .account-btn__sub{color:#fff;opacity:.9}

/* ---------- 5. Боковое меню (drawer) ---------- */
.drawer{position:fixed;inset:0;z-index:200;display:none}
.drawer[data-open="true"]{display:block}
.drawer__overlay{
  position:absolute;inset:0;background:rgba(26,16,48,.55);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  animation:fadeIn var(--dur) var(--ease);
}
.drawer__panel{
  position:absolute;top:0;left:0;bottom:0;width:340px;max-width:88vw;
  background:#fff;box-shadow:12px 0 40px rgba(26,16,48,.35);
  display:flex;flex-direction:column;
  animation:slideIn .3s var(--ease);overflow:hidden;
}
.drawer__header{
  padding:1.125rem 1.25rem;background:var(--gradient-brand);color:#fff;
  display:flex;align-items:center;justify-content:space-between;gap:.75rem;
}
.drawer__title{
  font-size:1.0625rem;font-weight:900;display:flex;align-items:center;gap:.625rem;
}
.drawer__title::before{
  content:"";width:20px;height:20px;flex-shrink:0;display:inline-block;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='3' y='5' width='18' height='2.4' rx='1.2' fill='%23fff'/><rect x='3' y='10.8' width='18' height='2.4' rx='1.2' fill='%23fff'/><rect x='3' y='16.6' width='18' height='2.4' rx='1.2' fill='%23fff'/></svg>");
  background-repeat:no-repeat;background-position:center;background-size:contain;
}
.drawer__close{
  width:36px;height:36px;display:grid;place-items:center;
  background:rgba(255,255,255,.22);color:#fff;font-size:1.25rem;font-weight:900;
  border-radius:var(--radius-round);
  transition:background var(--dur) var(--ease),transform var(--dur) var(--ease);
}
.drawer__close:hover{background:rgba(255,255,255,.35);transform:rotate(90deg)}
.drawer__body{padding:.875rem .875rem 1.5rem;overflow-y:auto;flex:1}
.drawer__list{display:flex;flex-direction:column;gap:.375rem}
.drawer__list a{
  display:flex;align-items:center;padding:.75rem .875rem;
  border:var(--border-thin);border-radius:var(--radius);
  font-size:.875rem;font-weight:700;
  transition:background var(--dur) var(--ease),color var(--dur) var(--ease),
             border-color var(--dur) var(--ease),padding-left var(--dur) var(--ease);
}
.drawer__list a::before{
  content:"";width:8px;height:8px;border-radius:var(--radius-round);margin-right:.75rem;flex-shrink:0;
  background:var(--gradient-brand);
  transition:background var(--dur) var(--ease);
}
.drawer__list a:hover{color:#fff;background:var(--gradient-brand);border-color:transparent;padding-left:1.125rem}
.drawer__list a:hover::before{background:#fff}

/* ---------- 6. Панель поиска ---------- */
.search-panel{
  position:sticky;top:76px;z-index:40;
  background:var(--gradient-soft);
  border-bottom:1px solid var(--border);
  border-top:1px solid var(--border);
  box-shadow:var(--shadow-sm);
}
.search-panel__inner{
  max-width:1200px;margin:0 auto;padding:1.125rem 1.25rem;
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1rem;align-items:stretch;
}
.field{display:flex;flex-direction:column;justify-content:flex-end;min-width:0;}
.field label{display:none}

/* Общая база для кнопок-переключателей и кнопки «Поиск» */
.picker-trigger,
.btn-cta{
  display:inline-flex;
  flex-direction:row;
  align-items:center;
  gap:.5rem;
  width:100%;
  padding:.875rem 1rem;
  border-radius:var(--radius);
  font-weight:900;
  font-size:.9375rem;
  color:#fff;
  white-space:nowrap;
  overflow:hidden;
  min-height:calc(.875rem * 2 + 1.25rem);
  transition:box-shadow var(--dur) var(--ease),background var(--dur) var(--ease),transform var(--dur) var(--ease);
}

/* Кнопки выбора города / метро / района */
.picker-trigger{
  justify-content:flex-start;
  background:var(--gradient-brand);
  box-shadow:var(--shadow-violet);
  text-align:left;
}
.picker-trigger:hover{box-shadow:var(--shadow-pink)}
.picker-trigger:active{transform:scale(.99)}

/* Кнопка «Поиск» */
.btn-cta{
  justify-content:center;
  background:var(--gradient-hot);
  box-shadow:var(--shadow-orange);
  text-decoration:none;
}
.btn-cta:hover{background:var(--gradient-brand);box-shadow:var(--shadow-pink)}
.btn-cta__text{display:inline}

.picker-trigger__label{
  flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.picker-trigger__arrow{font-size:.75rem;opacity:.9;flex-shrink:0}

/* Значок-иконка внутри кнопок */
.icon-badge{
  position:relative;width:var(--icon-size);height:var(--icon-size);flex-shrink:0;display:grid;place-items:center;
  background:rgba(255,255,255,.28);border-radius:var(--radius-round);
  box-shadow:
    0 0 0 1.5px rgba(255,255,255,.65),
    0 0 10px rgba(255,255,255,.35);
  transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease),background var(--dur) var(--ease);
}
.icon-badge::before{
  content:"";
  position:absolute;
  inset:0;
  background-repeat:no-repeat;
  background-position:center;
  background-size:var(--icon-size);
}
.picker-trigger:hover .icon-badge,
.btn-cta:hover .icon-badge{
  transform:scale(1.12);
  background:rgba(255,255,255,.4);
  box-shadow:
    0 0 0 2px rgba(255,255,255,.9),
    0 0 16px rgba(255,255,255,.55);
}

/* Назначение иконок по классам */
.icon-badge.icon-city::before{ background-image:var(--icon-city); }
.icon-badge.icon-metro::before{ background-image:var(--icon-metro); }
.icon-badge.icon-raion::before{ background-image:var(--icon-raion); }
.btn-cta .icon-badge::before{ background-image:var(--icon-search); }

/* Иконки в заголовках модальных окон */
#cityModalTitle .icon-badge::before{ background-image:var(--icon-city); }
#metroModalTitle .icon-badge::before{ background-image:var(--icon-metro); }
#raionModalTitle .icon-badge::before{ background-image:var(--icon-raion); }
#phoneModalTitle .icon-badge::before{ background-image:var(--icon-phone); }

/* ---------- 7. Модальные окна ---------- */
dialog.modal{
  width:min(680px,calc(100vw - 2rem));max-height:82vh;padding:0;border:none;
  border-radius:var(--radius-lg);box-shadow:var(--shadow-modal);
  overflow:hidden;background:#fff;color:var(--text);
}
dialog.modal::backdrop{
  background:rgba(26,16,48,.55);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
}
dialog.modal[open]{animation:modalUp var(--dur-med) var(--ease)}

.modal__header{
  padding:.4rem .75rem .4rem .875rem;
  background:var(--gradient-brand);color:#fff;
  display:flex;align-items:center;justify-content:space-between;gap:.5rem;
}
.modal__title{
  font-size:1.0625rem;font-weight:900;line-height:1.15;
  display:flex;align-items:center;gap:.5rem;margin:0;
}
.modal__title .icon-badge{width:22px;height:22px;background:rgba(255,255,255,.28)}
.modal__title .icon-badge::before{background-size:22px 22px}

/* Кнопка закрытия модального окна */
.modal__close{
  width:28px;height:28px;display:grid;place-items:center;
  background:rgba(255,255,255,.22);color:#fff;font-size:1rem;font-weight:900;line-height:1;
  border-radius:var(--radius-round);
  transition:background var(--dur) var(--ease),transform var(--dur) var(--ease);
}
.modal__close:hover{background:rgba(255,255,255,.35);transform:rotate(90deg)}

/* Строка поиска внутри модалки */
.modal__search{padding:.875rem 1.5rem;border-bottom:1px solid var(--border)}
.modal__search input{
  width:100%;padding:.75rem 1rem .75rem 2.625rem;
  border:var(--border-thick);border-radius:var(--radius);
  font-size:.9375rem;font-weight:600;background:#fff;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238b2fff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><circle cx='11' cy='11' r='7'/><line x1='21' y1='21' x2='16.65' y2='16.65'/></svg>");
  background-repeat:no-repeat;background-position:12px center;background-size:20px 20px;
  transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease);
}
.modal__search input:focus{outline:none;border-color:var(--pink);box-shadow:0 0 0 4px rgba(255,46,136,.15)}

.modal__body{padding:1rem 1.5rem 1.5rem;overflow-y:auto;max-height:60vh}
.modal__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:.625rem}
.modal__grid button{
  padding:.75rem .875rem;border:var(--border-thick);background:#fff;
  border-radius:var(--radius);font-size:.875rem;font-weight:700;text-align:left;
  display:flex;align-items:center;gap:.5rem;
  transition:border-color var(--dur) var(--ease),background var(--dur) var(--ease),color var(--dur) var(--ease);
}
.modal__grid button:hover{border-color:var(--pink);background:var(--gradient-soft);color:var(--violet)}
.modal__grid button[aria-selected="true"]{
  background:var(--gradient-brand);color:#fff;border-color:transparent;
  box-shadow:var(--shadow-pink);
}
.modal__grid button::before{
  content:"";width:8px;height:8px;border-radius:var(--radius-round);background:var(--lime);flex-shrink:0;
  box-shadow:0 0 0 3px rgba(0,217,126,.2);
}
.modal__grid button[aria-selected="true"]::before{background:#fff;box-shadow:0 0 0 3px rgba(255,255,255,.35)}
.modal__grid button[hidden]{display:none !important}

/* Сообщение «Ничего не найдено» */
.modal__empty{
  grid-column:1 / -1;padding:2rem .5rem;text-align:center;color:var(--muted);
  font-size:.9375rem;font-weight:600;
  background:var(--gradient-soft);
  border:2px dashed var(--pink);border-radius:var(--radius);
}

/* Футер модалки со счётчиком */
.modal__footer{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  padding:.625rem 1.5rem;
  border-top:1px solid var(--border);
  background:var(--gradient-soft);
}
.modal__counter{
  font-size:.8125rem;
  font-weight:700;
  color:var(--muted);
  letter-spacing:.02em;
}
.modal__counter b{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:34px;
  height:24px;
  padding:0 10px;
  margin-left:.375rem;
  border-radius:var(--radius-pill);
  background:var(--gradient-brand);
  color:#fff;
  font-weight:900;
  font-size:.8125rem;
  box-shadow:var(--shadow-sm);
}

/* Модалка с телефоном */
.modal--phone{width:min(420px,calc(100vw - 2rem))}
.modal__body--phone{padding:1.5rem 1.5rem 1.75rem;text-align:center;max-height:none}
.phone-modal__name{
  font-size:1.125rem;font-weight:900;margin:0 0 1rem;
  background:var(--gradient-text);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.phone-modal__number{
  display:inline-flex;align-items:center;justify-content:center;gap:.625rem;
  padding:.875rem 1.25rem;border-radius:var(--radius-pill);
  background:var(--lime);color:#fff;font-size:1.0625rem;font-weight:900;
  letter-spacing:.02em;text-decoration:none;
  box-shadow:var(--shadow-lime);
  transition:background var(--dur) var(--ease),box-shadow var(--dur) var(--ease),transform var(--dur) var(--ease);
  white-space:nowrap;
}
.phone-modal__number:hover{background:#00c46f;box-shadow:0 12px 28px rgba(0,196,111,.55)}
.phone-modal__number:active{transform:scale(.98)}
.phone-modal__icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:30px;height:30px;border-radius:var(--radius-round);background:rgba(255,255,255,.22);
  border:1.5px solid rgba(255,255,255,.85);flex-shrink:0;
}
.phone-modal__icon::before{
  content:"";width:16px;height:16px;display:block;
  background-image:var(--icon-phone);
  background-repeat:no-repeat;background-position:center;background-size:contain;
}
.phone-modal__hint{margin:1rem 0 0;font-size:.8125rem;font-weight:600;color:var(--muted)}

/* ---------- 8. Контейнер и типографика ---------- */
.container{max-width:1200px;margin:0 auto;padding:1.625rem 1.25rem 4.5rem}
h1{
  font-size:clamp(1.375rem,4vw,1.75rem);font-weight:900;letter-spacing:-.02em;
  margin-bottom:.875rem;background:var(--gradient-text);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
h2{
  font-size:clamp(1.125rem,3vw,1.375rem);font-weight:700;margin:2.25rem 0 1.125rem;
  padding:.375rem 0 .375rem .875rem;border-left:6px solid;
  border-image:linear-gradient(180deg,var(--pink),var(--violet)) 1;
}

/* ---------- 9. Вводный блок секции ---------- */
.section-intro{
  position:relative;
  background:linear-gradient(135deg,#ffffff 0%,#fff8fc 60%,#f7f0ff 100%);
  border:var(--border-thick);border-radius:var(--radius-lg);
  padding:1.5rem 1.75rem 1.625rem;
  box-shadow:0 12px 32px rgba(139,47,255,.12),0 4px 12px rgba(255,46,136,.06);
  overflow:hidden;isolation:isolate;
}
.section-intro::after{
  content:"";position:absolute;top:-80px;right:-80px;width:220px;height:220px;border-radius:var(--radius-round);
  background:radial-gradient(circle,rgba(255,46,136,.18),transparent 70%);
  z-index:0;pointer-events:none;
}
.section-intro__head{
  position:relative;display:flex;align-items:center;gap:.75rem;margin-bottom:1rem;z-index:1;
}
.section-intro__icon{
  position:relative;width:44px;height:44px;flex-shrink:0;display:grid;place-items:center;
  background:var(--gradient-brand);border-radius:var(--radius);
  box-shadow:var(--shadow-violet),0 0 0 3px rgba(255,255,255,.7);
  animation:burgerPulse 2.4s ease-in-out infinite;
}
.section-intro__icon::before{
  content:"";position:absolute;inset:0;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none'><circle cx='16' cy='16' r='12' fill='%23ffffff' opacity='0.28' stroke='%23ffffff' stroke-width='1.8'/><circle cx='16' cy='10.5' r='1.8' fill='%23ffffff'/><rect x='14.6' y='14' width='2.8' height='9' rx='1.4' fill='%23ffffff'/><circle cx='26' cy='8.5' r='1.6' fill='%23ffd400'/></svg>");
  background-repeat:no-repeat;background-position:center;background-size:22px 22px;
}
.section-intro__title{
  font-size:1.125rem;font-weight:900;letter-spacing:-.01em;margin:0;
  background:var(--gradient-text);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.section-intro__body{position:relative;z-index:1;display:flex;flex-direction:column;gap:.75rem;}
.section-intro__body p{color:var(--muted);font-size:.9375rem;line-height:1.65;margin:0;}
.section-intro__body strong{color:var(--violet);font-weight:800;}

/* ---------- 10. Карточки анкет ---------- */
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.25rem;}

.card{
  position:relative;display:grid;grid-template-columns:196px 1fr;grid-template-rows:auto auto auto;
  background:#fff;border:var(--border-thick);border-radius:var(--radius-lg);overflow:hidden;
  box-shadow:var(--shadow-sm);
  transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease);
}
/* Радужная полоска сверху карточки */
.card::before{
  content:"";position:absolute;inset:0 0 auto 0;height:5px;
  background:var(--gradient-rainbow);
  z-index:2;
}
.card:hover{border-color:var(--pink);box-shadow:var(--shadow-xl);}

/* Имя анкеты */
.card__name{
  grid-column:1 / -1;grid-row:1;
  display:flex;align-items:center;justify-content:space-between;gap:.625rem;
  padding:.625rem .875rem;margin:0;font-size:1.0625rem;font-weight:900;line-height:1.15;
  letter-spacing:-.01em;background:#fff;border-bottom:2px solid var(--border);
}
.card__name-link{
  background:var(--gradient-text);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;
}
.card__name-link:hover{filter:brightness(1.1)}

/* Бейдж города */
.card__city{
  display:inline-flex;align-items:center;gap:.25rem;
  padding:.25rem .5rem;border-radius:var(--radius-pill);
  font-size:var(--card-city-fs);font-weight:700;color:var(--violet);
  background:var(--gradient-soft);
  border:1px solid var(--border);flex-shrink:0;white-space:nowrap;text-decoration:none;
  transition:background var(--dur) var(--ease),color var(--dur) var(--ease),transform var(--dur) var(--ease);
}
/* Иконка-булавка через mask (цвет меняется через background-color) */
.card__city::before{
  content:"";width:12px;height:12px;flex-shrink:0;display:inline-block;
  background-color:var(--pink);
  -webkit-mask:var(--icon-pin-simple) center/contain no-repeat;
  mask:var(--icon-pin-simple) center/contain no-repeat;
  transition:background-color var(--dur) var(--ease);
}
.card__city:hover{
  color:#fff;background:var(--gradient-brand);border-color:transparent;transform:translateY(-1px);
}
.card__city:hover::before{background-color:#fff;}

/* Фото анкеты */
.card__photo{
  grid-column:1;grid-row:2;position:relative;display:flex;padding:.75rem 0 .75rem .75rem;background:#fff;
}
.card__photo-link{
  position:relative;display:block;width:180px;height:250px;border-radius:var(--radius);overflow:hidden;
  background:linear-gradient(135deg,#ffe0f0,#e6dcff);
  box-shadow:var(--shadow-md),0 2px 6px rgba(255,46,136,.12);
  transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease);
}
.card__photo-link:hover,
.card__photo-link:focus-visible{
  transform:translateY(-2px);
  box-shadow:0 12px 28px rgba(139,47,255,.25),0 4px 10px rgba(255,46,136,.18);
}
.card__photo-link img{width:180px;height:250px;object-fit:cover;display:block;}

/* Оверлей поверх фото при наведении */
.card__photo-overlay{
  position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:.5rem;
  background:linear-gradient(180deg,rgba(26,16,48,.35) 0%,rgba(26,16,48,.55) 50%,rgba(26,16,48,.35) 100%);
  color:#fff;opacity:0;pointer-events:none;transition:opacity var(--dur) var(--ease);
}
.card__photo-link:hover .card__photo-overlay,
.card__photo-link:focus-visible .card__photo-overlay{opacity:1;}

/* Круглая «глаз»-иконка на оверлее */
.card__photo-eye{
  width:56px;height:56px;flex-shrink:0;display:grid;place-items:center;
  border-radius:var(--radius-round);background:rgba(255,255,255,.18);
  border:2px solid rgba(255,255,255,.65);
  box-shadow:0 0 0 6px rgba(255,255,255,.12),0 8px 22px rgba(0,0,0,.35);
  backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
  transform:scale(.85);transition:transform var(--dur) var(--ease);
}
.card__photo-eye::before{
  content:"";width:26px;height:26px;display:block;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'><path d='M2 12 C5 6.5 8.5 4.5 12 4.5 C15.5 4.5 19 6.5 22 12 C19 17.5 15.5 19.5 12 19.5 C8.5 19.5 5 17.5 2 12 Z' fill='%23ffffff' opacity='0.95'/><circle cx='12' cy='12' r='4.2' fill='%238b2fff'/><circle cx='12' cy='12' r='1.8' fill='%231a1030'/><circle cx='13.2' cy='10.8' r='0.9' fill='%23ffffff' opacity='0.9'/></svg>");
  background-repeat:no-repeat;background-position:center;background-size:contain;
}
.card__photo-link:hover .card__photo-eye{transform:scale(1)}
.card__photo-text{
  font-size:.75rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:#fff;
  text-shadow:0 2px 6px rgba(0,0,0,.5);opacity:0;transform:translateY(6px);
  transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease);
}
.card__photo-link:hover .card__photo-text{opacity:1;transform:translateY(0);}

/* Правая часть карточки с параметрами */
.card__body{
  grid-column:2;grid-row:2;display:flex;flex-direction:column;
  padding:.875rem 1rem .875rem .875rem;min-width:0;
}

/* Бейдж «VIP» / «Новинка» */
.card__badge{
  display:inline-flex;align-items:center;justify-content:center;align-self:flex-start;
  gap:.3rem;margin:0 0 .5rem;padding:.3rem .7rem;border-radius:var(--radius-pill);
  font-size:var(--card-badge-fs);font-weight:900;letter-spacing:.04em;color:#fff;
  background:var(--gradient-card-badge);
  box-shadow:0 4px 12px rgba(255,46,136,.35),0 0 0 1.5px rgba(255,255,255,.65) inset;
  white-space:nowrap;position:relative;overflow:hidden;
}
.card__badge::before{
  content:"";width:6px;height:6px;border-radius:var(--radius-round);background:#ffd400;
  box-shadow:0 0 8px rgba(255,212,0,.9);flex-shrink:0;
}
/* Блик по бейджу */
.card__badge::after{
  content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;
  background:linear-gradient(120deg,transparent,rgba(255,255,255,.55),transparent);
  transform:skewX(-20deg);animation:badgeShine 3.2s ease-in-out infinite;
}
@keyframes badgeShine{
  0%{left:-60%}
  55%{left:120%}
  100%{left:120%}
}

/* Параметры анкеты */
.card__params{
  padding:0 0 .25rem;display:grid;grid-template-columns:1fr;gap:0;
  font-size:var(--card-params-fs);color:var(--muted);border-bottom:1px dashed var(--border);
}
.card__params > div,
.card__prices-row{
  display:flex;justify-content:space-between;align-items:center;line-height:1.25;
}
.card__params dt{font-weight:600}
.card__params dd{margin:0}
.card__params b{color:var(--violet);font-weight:800}

/* Заголовок блока цен */
.card__prices-title{
  display:flex;align-items:center;gap:.375rem;font-size:var(--card-prices-fs);font-weight:900;
  letter-spacing:.02em;color:var(--muted);padding:.125rem 0 .25rem;line-height:1.2;
  border-bottom:1px dashed var(--border);margin-bottom:.125rem;
}
.card__prices-title-icon{
  display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;
  width:var(--price-icon);height:var(--price-icon);
  filter:drop-shadow(0 2px 4px rgba(255,138,0,.35));
  transition:transform var(--dur) var(--ease);
}
.card__prices-title-icon::before{
  content:"";width:var(--price-icon);height:var(--price-icon);display:block;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'><defs><linearGradient id='cg' x1='0' y1='0' x2='1' y2='1'><stop offset='0' stop-color='%23ffd400'/><stop offset='0.5' stop-color='%23ff8a00'/><stop offset='1' stop-color='%23ff2e88'/></linearGradient></defs><circle cx='12' cy='12' r='10' fill='url(%23cg)' stroke='%23ffffff' stroke-width='1.6'/><circle cx='12' cy='12' r='7.2' fill='none' stroke='%23ffffff' stroke-width='0.9' opacity='0.7'/><path d='M10 7.5 L14 7.5 M10 10.5 L14 10.5 M10 7.5 L10 16.5 M11 10.5 C12.8 10.5 13.8 11.1 13.8 12.2 C13.8 13.3 12.8 13.9 11 13.9 L10 13.9 M12.5 13.9 L14.5 16.5' fill='none' stroke='%23ffffff' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-repeat:no-repeat;background-position:center;background-size:contain;
}
.card__prices-title:hover .card__prices-title-icon{transform:rotate(-8deg) scale(1.08);}

.card__prices-title-value{color:var(--pink);font-weight:900;}

/* Блок цен */
.card__prices{
  padding:.25rem 0;background:transparent;border:0;font-size:var(--card-prices-fs);display:grid;gap:0;
}
.card__prices-row span{color:var(--muted);font-weight:600}
.card__prices-row b{color:var(--pink);font-weight:900}

/* Зелёная плашка «Да» */
.card__prices-row b.card__prices-yes{
  color:var(--lime);border:1.5px solid var(--lime);background:rgba(0,217,126,.10);
  border-radius:var(--radius-pill);padding:.05rem .5rem;font-weight:900;line-height:1.2;
  box-shadow:0 0 0 2px rgba(0,217,126,.15);
}

/* Нижняя строка мета-данных */
.card__meta{
  grid-column:1 / -1;grid-row:3;display:flex;flex-direction:column;gap:.125rem;
  padding:.5rem .875rem .625rem;
  background:var(--gradient-soft);
  border-top:2px solid var(--border);font-size:var(--card-meta-fs);color:var(--muted);
  font-weight:600;line-height:1.3;
}
.card__meta-row{display:flex;align-items:baseline;gap:.375rem;min-width:0;}
.card__meta-row span{color:var(--muted);font-weight:600;flex-shrink:0;}
.card__meta-row a{
  color:var(--violet);font-weight:800;text-decoration:none;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;
}
.card__meta-row a:hover{color:var(--pink);text-decoration:underline;}

/* Кнопка «Показать телефон» в карточке */
.card__phone{
  display:inline-flex;align-items:center;justify-content:center;gap:.75rem;
  width:100%;max-width:100%;margin:.25rem 0 0;padding:.5rem .875rem;
  border-radius:var(--radius-pill);font-size:.8125rem;font-weight:800;line-height:1.15;
  text-align:center;color:#fff;background:var(--lime);
  cursor:pointer;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;
  white-space:nowrap;overflow:visible;
  box-shadow:var(--shadow-lime);
  transition:box-shadow var(--dur) var(--ease),background var(--dur) var(--ease),transform var(--dur) var(--ease);
}
.card__phone:hover{background:#00c46f;box-shadow:0 8px 18px rgba(0,196,111,.5);}
.card__phone:active{transform:scale(.98);}
.card__phone.is-revealed{background:#00c46f;box-shadow:0 6px 14px rgba(0,196,111,.45);}

.card__phone-icon{
  display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;
  width:22px;height:22px;border-radius:var(--radius-round);background:rgba(255,255,255,.28);color:#ffffff;
  box-shadow:0 0 0 1.5px rgba(255,255,255,.65),0 0 10px rgba(255,255,255,.35);
  transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease),background var(--dur) var(--ease);
}
.card__phone-icon::before{
  content:"";width:14px;height:14px;display:block;
  background-image:var(--icon-phone);
  background-repeat:no-repeat;background-position:center;background-size:contain;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.25));
  transform-origin:50% 50%;
  animation:phoneRing 1.1s ease-in-out infinite;
}
.card__phone:hover .card__phone-icon{
  transform:scale(1.12);background:rgba(255,255,255,.4);
  box-shadow:0 0 0 2px rgba(255,255,255,.9),0 0 16px rgba(255,255,255,.55);
}

/* Покачивание иконки телефона */
@keyframes phoneRing{
  0%   { transform:rotate(0deg)   translateX(0); }
  15%  { transform:rotate(-12deg) translateX(-1px); }
  30%  { transform:rotate(10deg)  translateX(1px); }
  45%  { transform:rotate(-8deg)  translateX(-1px); }
  60%  { transform:rotate(6deg)   translateX(1px); }
  75%  { transform:rotate(-3deg)  translateX(0); }
  100% { transform:rotate(0deg)   translateX(0); }
}
/* После раскрытия телефона анимация отключается */
.card__phone.is-revealed .card__phone-icon::before{
  animation:none;transform:rotate(0deg);
}

.card__phone-text{
  flex:0 0 auto;min-width:0;white-space:nowrap;overflow:visible;
  text-overflow:clip;font-variant-numeric:tabular-nums;
}

/* ---------- 11. Подвал сайта ---------- */
.site-footer{
  background:var(--gradient-footer);
  color:#fff;text-align:center;padding:2.125rem 1.25rem 1.25rem;
  font-size:.875rem;font-weight:600;
}
.site-footer__brand{
  display:inline-flex;align-items:center;gap:.625rem;
  font-size:1.25rem;font-weight:900;margin-bottom:.625rem;
}
.site-footer__brand-icon{
  width:36px;height:36px;flex-shrink:0;display:block;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'><defs><linearGradient id='fg' x1='0' y1='0' x2='0' y2='1'><stop offset='0' stop-color='%23ffffff'/><stop offset='1' stop-color='%23ffd400'/></linearGradient></defs><path d='M32 3 L61 32 L32 61 L3 32 Z' fill='rgba(255,255,255,.18)' stroke='%23fff' stroke-width='2'/><path d='M32 8 L56 32 L32 56 L8 32 Z' fill='none' stroke='%23fff' stroke-width='0.9' opacity='0.55'/><path d='M18 26 Q14 22 18 18 Q22 15 24 20' fill='none' stroke='%23fff' stroke-width='1.4' stroke-linecap='round' opacity='0.85'/><path d='M46 26 Q50 22 46 18 Q42 15 40 20' fill='none' stroke='%23fff' stroke-width='1.4' stroke-linecap='round' opacity='0.85'/><path d='M20 24 L32 46 L44 24 L39.5 24 L32 37 L24.5 24 Z' fill='url(%23fg)'/><circle cx='20' cy='18' r='1.7' fill='%23fff'/><circle cx='32' cy='15' r='2.1' fill='%23fff'/><circle cx='44' cy='18' r='1.7' fill='%23fff'/></svg>");
  background-repeat:no-repeat;background-position:center;background-size:contain;
}
.site-footer__nav{
  display:flex;justify-content:center;flex-wrap:wrap;gap:.5rem .875rem;
  margin:1.125rem auto 1rem;padding:.875rem 1.125rem;max-width:560px;
  background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.25);
  border-radius:var(--radius-lg);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
}
.site-footer__nav a{
  display:inline-flex;align-items:center;gap:.375rem;
  padding:.5rem .875rem;border-radius:var(--radius-pill);
  font-size:.8125rem;font-weight:700;color:#fff;text-decoration:none;
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);
  transition:background var(--dur) var(--ease),transform var(--dur) var(--ease),border-color var(--dur) var(--ease);
}
.site-footer__nav a:hover{background:rgba(255,255,255,.28);border-color:rgba(255,255,255,.45)}
.site-footer__nav a::before{
  content:"";width:6px;height:6px;border-radius:var(--radius-round);background:#ffd400;flex-shrink:0;
}
.site-footer a{color:#fff;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:2px}
.site-footer a:hover{opacity:.85}
.site-footer p{margin:.375rem 0}
.site-footer__copy{
  margin-top:1rem;padding-top:.875rem;border-top:1px solid rgba(255,255,255,.25);
  font-size:.8125rem;opacity:.9;
}

/* ---------- 12. Общие keyframes ---------- */
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes slideIn{from{transform:translateX(-100%)}to{transform:translateX(0)}}
@keyframes modalUp{from{opacity:0;transform:translateY(24px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}

/* ---------- 13. Пагинация ---------- */
.pagination{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;margin:12px 0}
.page-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--radius-round);border:2px solid #e0e0e0;background:#fff;color:#333;text-decoration:none;font-size:15px;font-weight:500;transition:all .2s ease;box-sizing:border-box;box-shadow:var(--shadow-xs)}
.page-btn:hover{background:#fff;border-color:#ff0000;color:#ff0000;transform:translateY(-2px);box-shadow:0 5px 12px rgba(255,0,0,.2)}
.page-btn.page-current{background:#ff0000;border-color:#ff0000;color:#fff;font-weight:bold;cursor:default;box-shadow:0 5px 12px rgba(255,0,0,.35)}
.page-btn.page-current:hover{transform:none;color:#fff;background:#ff0000;border-color:#ff0000}
.page-btn.disabled{color:#ccc;background:#fafafa;border-color:#eee;cursor:not-allowed;box-shadow:none}
.page-btn.disabled:hover{background:#fafafa;border-color:#eee;color:#ccc;transform:none;box-shadow:none}
.page-btn.page-prev,.page-btn.page-next{font-size:18px;font-weight:bold}
.page-header{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:8px 0;text-align:left}
.page-nav-bottom{display:flex;justify-content:center;align-items:center;padding:8px 0;text-align:center}
.page-title{display:inline-flex;align-items:center;justify-content:flex-start;gap:12px;flex-wrap:wrap}
.page-title h1{margin:0}
.page-description{margin:8px 0 12px;color:#555;text-align:left}
.found-count{display:inline-flex;align-items:center;gap:10px;margin:8px 0;padding:7px 18px;border-radius:50px;background:#fff;border:1px solid #e8e8e8;color:#444;font-size:15px;font-weight:500;box-shadow:var(--shadow-xs);transition:border-color .25s ease,box-shadow .25s ease}
.found-count:hover{border-color:#ffcdcd;box-shadow:0 4px 14px rgba(255,0,0,.12)}
.found-count .found-label{color:#777;letter-spacing:.2px}
.found-count .found-number{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:28px;padding:0 12px;border-radius:50px;background:linear-gradient(135deg,#ff3b3b 0%,#c40000 100%);color:#fff;font-weight:700;font-size:15px;letter-spacing:.3px;box-shadow:0 3px 10px rgba(255,0,0,.28)}
.no-anketa{padding:30px 15px;text-align:left}

/* ---------- 14. Кнопка «Наверх» ---------- */
.to-top{
  position:fixed;
  left:16px;
  bottom:16px;
  z-index:120;
  width:48px;
  height:48px;
  display:none;
  align-items:center;
  justify-content:center;
  border-radius:var(--radius-round);
  background:var(--gradient-brand);
  color:#fff;
  box-shadow:
    0 10px 24px rgba(139,47,255,.45),
    0 0 0 3px rgba(255,255,255,.65),
    0 0 0 5px rgba(255,46,136,.18);
  cursor:pointer;
  opacity:0;
  transform:translateY(12px) scale(.9);
  transition:opacity .25s var(--ease),transform .25s var(--ease),box-shadow .25s var(--ease);
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
}
.to-top.is-visible{
  opacity:1;
  transform:translateY(0) scale(1);
}
.to-top:hover,
.to-top:focus-visible{
  box-shadow:
    0 14px 30px rgba(255,46,136,.55),
    0 0 0 3px rgba(255,255,255,.85),
    0 0 0 7px rgba(139,47,255,.22);
}
.to-top:active{
  transform:translateY(0) scale(.94);
}
.to-top__arrow{
  width:22px;
  height:22px;
  display:block;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'><path d='M12 4 L12 20' stroke='%23ffffff' stroke-width='2.6' stroke-linecap='round'/><path d='M5 11 L12 4 L19 11' stroke='%23ffffff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-repeat:no-repeat;
  background-position:center;
  background-size:contain;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.25));
  transition:transform .25s var(--ease);
}
.to-top:hover .to-top__arrow,
.to-top:focus-visible .to-top__arrow{
  transform:translateY(-2px);
}

/* ---------- 15. Отключение анимаций (reduce-motion) ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
  .card__phone-icon::before{animation:none;transform:none}
  .to-top,
  .to-top__arrow{transition:none}
}

/* ---------- 16. Адаптивность ---------- */

/* Планшеты */
@media (max-width:1024px){
  :root{
    --card-city-fs:12px;
    --card-badge-fs:12px;
    --card-params-fs:12px;
    --card-prices-fs:12px;
    --card-meta-fs:12px;
    --price-icon:15px;
  }

  .search-panel{top:72px}
  .search-panel__inner{padding:.875rem 1rem;gap:.625rem}
  .picker-trigger{padding:.75rem .875rem;font-size:.875rem}
  .btn-cta{padding:.75rem .875rem;font-size:.875rem}

  .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .card{grid-template-columns:196px 1fr}
  .card__photo-link,
  .card__photo-link img{width:180px;height:250px}
}

/* Мобильные */
@media (max-width:640px){
  :root{
    --icon-size:16px;
    --price-icon:13px;
  }

  .site-header__inner{padding:.625rem 1rem;gap:.5rem}
  .brand__logo{width:40px;height:40px}
  .brand__name{font-size:1.0625rem}
  .brand__tag{font-size:.5625rem;letter-spacing:.08em}

  .burger{width:44px;height:44px;border-radius:var(--radius)}
  .burger__lines{width:20px;height:15px}
  .burger__lines span,
  .burger__lines span::before,
  .burger__lines span::after{width:20px;height:2.5px}
  .burger__lines span::before{top:-7px}
  .burger__lines span::after{top:7px}
  .burger::after{top:4px;right:4px;width:9px;height:9px}

  /* Кнопка кабинета превращается в круглую иконку */
  .account-btn{padding:.375rem;gap:0;border-radius:var(--radius-round);margin-left:auto}
  .account-btn__text{display:none}
  .account-btn__icon{width:42px;height:42px;box-shadow:0 6px 16px rgba(139,47,255,.35);}

  .search-panel{top:62px}
  .search-panel__inner{
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:.35rem;padding:.5rem .5rem;
  }

  /* Кнопки поиска в одну строку, компактные */
  .picker-trigger{
    flex-direction:row;align-items:center;justify-content:center;gap:.25rem;
    padding:.5rem .35rem;border-radius:var(--radius-sm);font-size:12px;font-weight:800;
    text-align:center;min-height:44px;box-shadow:0 6px 14px rgba(139,47,255,.28);
  }
  .picker-trigger__arrow{display:none}
  .picker-trigger__label{
    font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%;
  }

  .btn-cta{
    flex-direction:row;align-items:center;justify-content:center;gap:.25rem;
    padding:.5rem .35rem;font-size:12px;text-align:center;min-height:44px;
    border-radius:var(--radius-sm);
    box-shadow:0 6px 14px rgba(255,138,0,.28);
  }
  .btn-cta__text{font-size:12px;line-height:1.1}

  .modal__title .icon-badge{width:16px;height:16px}
  .modal__title .icon-badge::before{background-size:16px 16px}

  .section-intro{padding:1.25rem 1.25rem 1.375rem}
  .section-intro__icon{width:38px;height:38px;border-radius:12px}
  .section-intro__icon::before{background-size:20px 20px}
  .section-intro__title{font-size:1rem}
  .section-intro__body p{font-size:.875rem;line-height:1.6}

  /* Карточки в одну колонку */
  .cards{grid-template-columns:1fr;gap:.875rem}
  .card{grid-template-columns:146px 1fr}
  .card__photo{padding:.5rem 0 .5rem .5rem}
  .card__photo-link,
  .card__photo-link img{width:130px;height:180px;border-radius:12px}
  .card__body{padding:.75rem .875rem .75rem .75rem}
  .card__name{font-size:1rem}
  .card__city{font-size:12px;padding:.2rem .4rem}
  .card__badge{font-size:12px;padding:.25rem .55rem;margin-bottom:.375rem;letter-spacing:.03em;}

  .card__phone{
    font-size:.6875rem;padding:.5rem .625rem;gap:.5rem;min-height:30px;letter-spacing:0;
  }
  .card__phone-icon{width:22px;height:22px}
  .card__phone-icon::before{width:12px;height:12px}

  .card__prices-row b.card__prices-yes{padding:.02rem .4rem;border-width:1.2px}

  .modal__grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
  .site-footer__nav{flex-direction:column;max-width:100%}
  .site-footer__nav a{justify-content:center}

  .modal__header{padding:.35rem .625rem .35rem .75rem;gap:.4rem}
  .modal__title{font-size:.9375rem;line-height:1.1;gap:.375rem}
  .modal__close{width:26px;height:26px;font-size:.9375rem}

  .modal__footer{padding:.5rem 1rem;}
  .modal__counter{font-size:.75rem;}
  .modal__counter b{min-width:28px;height:20px;font-size:.75rem;padding:0 8px;}

  /* Показываем кнопку «Наверх» только на мобильных */
  .to-top{display:flex}
}

/* Маленькие телефоны */
@media (max-width:480px){
  .card__phone{font-size:.625rem;padding:.4rem .5rem;gap:.4rem;min-height:26px;}
  .card__phone-icon{width:20px;height:20px}
  .card__phone-icon::before{width:11px;height:11px}

  .found-count{padding:6px 14px;gap:8px;font-size:14px}
  .found-count .found-number{min-width:34px;height:24px;padding:0 9px;font-size:13px}
}

/* Очень узкие экраны */
@media (max-width:360px){
  :root{
    --icon-size:14px;
    --price-icon:12px;
  }

  .modal__title .icon-badge{width:16px;height:16px}

  .search-panel__inner{gap:.25rem;padding:.5rem .375rem}
  .picker-trigger{font-size:10px;min-height:40px;padding:.4rem .25rem;gap:.2rem}
  .picker-trigger__label{font-size:10px}
  .btn-cta{font-size:10px;min-height:40px;padding:.4rem .25rem;gap:.2rem}
  .btn-cta__text{font-size:10px}

  .card{grid-template-columns:146px 1fr}
  .card__photo-link,
  .card__photo-link img{width:130px;height:180px}
  .card__name{font-size:.9375rem}
  .card__city{font-size:12px}
  .card__badge{font-size:12px;padding:.2rem .45rem}

  .card__prices-row b.card__prices-yes{padding:.02rem .35rem;border-width:1px}

  .card__phone{font-size:.5625rem;padding:.35rem .4rem;gap:.3rem;min-height:24px;}
  .card__phone-icon{width:18px;height:18px}
  .card__phone-icon::before{width:10px;height:10px}

  .to-top{width:44px;height:44px;left:12px;bottom:12px}
  .to-top__arrow{width:20px;height:20px}
}