/* =========================
   RESET & BASE
========================= */
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body{
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color:#111;
  background:
    radial-gradient(1200px 700px at 10% -15%, rgba(0,0,0,0.05), transparent 60%),
    radial-gradient(900px 600px at 90% 0%, rgba(0,0,0,0.04), transparent 55%),
    #ffffff;
}
img{ max-width:100%; display:block; }

/* контейнер — ВОТ чего тебе не хватало */
.container{
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 60px;
}

/* =========================
   HEADER
========================= */
/* =========================
   HEADER (PREMIUM UPGRADE)
========================= */
.header{
  position: fixed;
  top:0; left:0; right:0;
  height: var(--header-h);
  z-index: 3000;

  background:
    linear-gradient(
      180deg,
      rgba(232,204,106,0.92),
      rgba(201,162,39,0.92)
    );

  backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(0,0,0,0.12);
}

.header::after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(
    180deg,
    rgba(255,255,255,0.25),
    transparent 60%
  );
  pointer-events:none;
}


.header-inner{
  display:flex;
  align-items:center;
  justify-content: space-between;
  padding: 22px 0; /* было 18px */
  gap: 22px;
}

/* бренд крупнее */
.logo{
  font-weight: 720;
  letter-spacing: -0.03em;
  font-size: 20px;            /* было без размера */
  line-height: 1;
  display:flex;
  align-items:center;
  gap:10px;
}

/* опционально: маленький подпункт под брендом */
.logo small{
  display:block;
  font-size:12px;
  font-weight:500;
  letter-spacing:-0.01em;
  color:#777;
  margin-top:6px;
}

.nav{
  display:flex;
  align-items:center;
  gap: 18px;
}

.nav a{
  margin: 0;                  /* убираем раздувающий margin */
  text-decoration:none;
  font-size:14px;
  color:#111;
  opacity:.72;
  padding: 10px 10px;
  border-radius: 999px;
  transition: opacity .2s ease, background .2s ease;
}

.nav a:hover{
  opacity:1;
  background: rgba(0,0,0,0.04);
}


.cta{
  padding:10px 18px;
  border-radius:999px;
  background:#111;
  color:#fff;
  border:none;
  cursor:pointer;
  box-shadow: 0 16px 40px rgba(0,0,0,.12);
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.cta:hover{
  background:#000;
  transform: translateY(-1px);
  box-shadow: 0 22px 55px rgba(0,0,0,.16);
}

/* =========================
   HERO
========================= */
.hero{ padding: 70px 0; }
.hero-inner{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  align-items:center;
  gap:60px;
}

.chip{
  display:inline-block;
  padding:8px 14px;
  border-radius:999px;
  font-size:13px;
  margin-bottom:18px;
  background: rgba(255,255,255,.75);
  border: 1px solid rgba(0,0,0,.06);
  backdrop-filter: blur(10px);
}

.hero-text h1{
  font-size:64px;
  font-weight:650;
  line-height:1.05;
  margin-bottom:26px;
  letter-spacing:-0.03em;
}

.hero-sub{
  font-size:19px;
  color:#444;
  max-width: 560px;
  line-height:1.6;
  margin-bottom:36px;
}

.hero-buttons{
  display:flex;
  gap:18px;
  align-items:center;
  flex-wrap:wrap;
}

.primary{
  padding:16px 34px;
  border-radius:999px;
  background:#111;
  color:#fff;
  border:none;
  font-weight:500;
  cursor:pointer;
  box-shadow: 0 16px 40px rgba(0,0,0,.12);
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.primary:hover{
  background:#000;
  transform: translateY(-1px);
  box-shadow: 0 22px 55px rgba(0,0,0,.16);
}

.link-btn{
  font-size:15px;
  color:#111;
  text-decoration:none;
  border-bottom: 1px solid #ddd;
  padding-bottom:2px;
}
.link-btn:hover{ border-color:#111; }

.trust-line{
  display:flex;
  gap:14px;
  margin-top:26px;
  flex-wrap:wrap;
}
/* =========================
   HERO TRUST PILLS (GOLD)
========================= */
.trust-line span{
  padding: 10px 18px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 500;

  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,0.95),
      rgba(250,250,250,0.85)
    );

  border: 1px solid rgba(201,162,39,0.35); /* золото */
  color: #3a3a3a;

  box-shadow:
    0 6px 18px rgba(0,0,0,0.06),
    inset 0 1px 0 rgba(255,255,255,0.9);

  transition:
    transform .25s ease,
    box-shadow .25s ease,
    border-color .25s ease;
}

.trust-line span:hover{
  transform: translateY(-2px);
  border-color: rgba(201,162,39,0.7);
  box-shadow:
    0 12px 32px rgba(0,0,0,0.12),
    inset 0 1px 0 rgba(255,255,255,0.95);
}

.hero-image{
  height:460px;
  border-radius:36px;
  overflow:hidden;
  position:relative;
  background:#eee;
  box-shadow: 0 60px 120px rgba(0,0,0,.14);
}
.hero-photo{
  width:100%;
  height:100%;
  object-fit:cover;
  filter: saturate(.9) contrast(1.05);
  transform: scale(1.02);
}
.hero-image::after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,0.05), rgba(0,0,0,0.00) 45%, rgba(0,0,0,0.07));
  pointer-events:none;
}

/* =========================
   STATS
========================= */
.stats{
  padding: 30px 0;
  border-top: 1px solid rgba(0,0,0,.06);
  border-bottom: 1px solid rgba(0,0,0,.06);
}
.stats-inner{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap:20px;
}
.stat{
  padding: 22px;
  border-radius: 24px;

  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,0.95),
      rgba(248,248,248,0.88)
    );

  border: 1px solid rgba(0,0,0,0.06);
  box-shadow: 0 10px 30px rgba(0,0,0,0.06);

  transition:
    transform .3s ease,
    box-shadow .3s ease,
    border-color .3s ease;
}

.stat:hover{
  transform: translateY(-4px);
  border-color: rgba(201,162,39,0.6); /* золото */
  box-shadow: 0 22px 60px rgba(0,0,0,0.12);
}

.stat-title{
  font-weight: 700;
  letter-spacing: -0.01em;
}

.stat-desc{
  font-size: 14px;
  color: #666;
  line-height: 1.5;
}
.stat::before{
  content:"";
  display:block;
  height:2px;
  width:40px;
  margin-bottom:10px;
  border-radius:999px;
  background: linear-gradient(
    90deg,
    rgba(201,162,39,0.9),
    rgba(232,204,106,0.9)
  );
}

/* =========================
   SECTIONS
========================= */
.section{ padding: 110px 0; }
.section-soft{
  background:
    radial-gradient(900px 500px at 15% 0%, rgba(0,0,0,.04), transparent 60%),
    #fafafa;
  border-top: 1px solid rgba(0,0,0,.06);
}
.section-head{ max-width: 820px; margin-bottom:56px; }
.section h2{
  font-size:36px;
  font-weight:650;
  margin-bottom:16px;
  letter-spacing:-0.02em;
}
.section-desc{
  font-size:18px;
  color:#555;
  line-height:1.6;
}

/* =========================
   FEATURES / PROCESS
========================= */
.features-grid{
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap:28px;
}
.feature{
  padding:28px;
  border-radius:24px;
  background: rgba(255,255,255,.7);
  border: 1px solid rgba(0,0,0,.06);
  backdrop-filter: blur(12px);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.feature:hover{
  transform: translateY(-4px);
  border-color: rgba(0,0,0,.10);
  box-shadow: 0 22px 60px rgba(0,0,0,.10);
}
.feature h3{ font-size:18px; margin-bottom:10px; letter-spacing:-0.01em; }
.feature p{ font-size:15px; color:#666; line-height:1.55; }

.process{ display:grid; gap:16px; }
.step{
  display:grid;
  grid-template-columns: 64px 1fr;
  gap:18px;
  padding:22px 24px;
  border-radius:24px;
  background: rgba(255,255,255,.7);
  border: 1px solid rgba(0,0,0,.06);
  backdrop-filter: blur(12px);
  transition: box-shadow .25s ease, border-color .25s ease, transform .25s ease;
}
.step:hover{
  transform: translateY(-3px);
  border-color: rgba(0,0,0,.10);
  box-shadow: 0 18px 50px rgba(0,0,0,.08);
}
.step-num{ font-size:14px; font-weight:700; opacity:.5; padding-top:4px; }
.step-body h3{ font-size:18px; margin-bottom:8px; }
.step-body p{ font-size:15px; color:#666; line-height:1.55; max-width: 820px; }

.note{
  margin-top:26px;
  max-width:820px;
  color:#666;
  font-size:15px;
  line-height:1.6;
}
.premium-note{
  margin-top:26px;
  padding:16px 20px;
  border-radius:20px;
  background: rgba(255,255,255,.7);
  border: 1px solid rgba(0,0,0,.06);
  backdrop-filter: blur(12px);
  max-width: 900px;
  color:#444;
}

/* =========================
   LISTINGS CARDS
========================= */
.cards-grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:22px;
}
.card{
  border: 1px solid rgba(0,0,0,0.06);
  background: rgba(255,255,255,0.72);
  backdrop-filter: blur(12px);
  border-radius: 28px;
  overflow: hidden;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.card:hover{
  transform: translateY(-4px);
  border-color: rgba(0,0,0,0.10);
  box-shadow: 0 24px 70px rgba(0,0,0,0.10);
}
.card-media{ height: 190px; background:#eee; }
.card-media img{
  width:100%;
  height:100%;
  object-fit: contain;
    background: #eee;
}
.card-media{
  border-bottom: 1px solid rgba(0,0,0,0.06);
}

.card-body{ padding: 18px 18px 20px; }
.card-top{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap:12px;
  margin-bottom:10px;
}
.card-title{ font-weight:650; letter-spacing:-0.01em; }
.badge{
  font-size:12px;
  padding:6px 10px;
  border-radius:999px;
  border: 1px solid rgba(0,0,0,0.08);
  background: rgba(255,255,255,0.75);
}
.card-meta{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  color:#666;
  font-size:13px;
  margin-bottom:14px;
}
.card-meta span{
  padding:6px 10px;
  border: 1px solid rgba(0,0,0,0.06);
  border-radius:999px;
  background: rgba(255,255,255,0.6);
}
.card-kpis{
  display:grid;
  grid-template-columns: repeat(3,1fr);
  gap:10px;
  margin-bottom:14px;
}
.card-kpis div{
  border: 1px solid rgba(0,0,0,0.06);
  border-radius:18px;
  padding:10px;
  background: rgba(255,255,255,0.6);
}
.card-kpis b{ display:block; font-size:14px; }
.card-kpis span{ display:block; font-size:12px; color:#666; margin-top:4px; }
.card-btn{ width:100%; padding: 14px 18px; }

/* mini CTA */
.mini-cta{
  margin-top:24px;
  display:flex;
  gap:16px;
  align-items:center;
  justify-content: space-between;
  padding:18px;
  border-radius:24px;
  border: 1px solid rgba(0,0,0,0.06);
  background: rgba(255,255,255,0.70);
  backdrop-filter: blur(12px);
}
.mini-cta-text{ color:#444; max-width: 760px; }

/* =========================
   TEAM
========================= */
.team-grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:22px;
}
.person{
  border: 1px solid rgba(0,0,0,0.06);
  background: rgba(255,255,255,0.72);
  backdrop-filter: blur(12px);
  border-radius:28px;
  padding:18px;
  display:flex;
  gap:14px;
}
.avatar{
  width:64px; height:64px;
  border-radius:18px;
  overflow:hidden;
  background:#eee;
  flex:0 0 auto;
}
.avatar img{ width:100%; height:100%; object-fit:cover; }
.person-name{ font-weight:650; letter-spacing:-0.01em; }
.person-role{ color:#666; font-size:13px; margin-top:4px; }
.person-desc{ margin-top:10px; color:#555; font-size:14px; line-height:1.55; }

/* =========================
   CONTACTS (BLACK APPLE)
========================= */
.section-dark{
  background:
    radial-gradient(900px 450px at 20% 0%, rgba(255,255,255,0.09), transparent 55%),
    #0f0f10;
  color:#fff;
  border-top: 1px solid rgba(255,255,255,0.06);
}
.section-dark h2{ color:#fff; }
.section-dark .section-desc{ color: rgba(255,255,255,0.72); }

.contact-grid{
  display:grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap:22px;
  margin-top:26px;
}
.contact-card, .form-card{
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(255,255,255,0.06);
  border-radius:28px;
  padding:18px;
}
.contact-title{
  font-weight:650;
  letter-spacing:-0.01em;
  margin-bottom:12px;
}
.contact-lines{ display:grid; gap:8px; }
.contact-link{
  color:#fff;
  text-decoration:none;
  border-bottom: 1px solid rgba(255,255,255,0.25);
  width: fit-content;
}
.contact-link:hover{ border-bottom-color: rgba(255,255,255,0.6); }
.contact-muted{ color: rgba(255,255,255,0.65); font-size:13px; margin-top:6px; }

.contact-actions{
  display:flex;
  gap:10px;
  margin-top:16px;
  flex-wrap:wrap;
}
.section-dark .primary{
  background:#fff;
  color:#111;
  box-shadow: 0 22px 60px rgba(0,0,0,0.35);
}
.section-dark .primary:hover{ background:#f2f2f2; }

/* form fields */
.form-row{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:12px;
  margin-bottom:12px;
}
.field{ display:grid; gap:8px; margin-bottom:12px; }
.field span{ font-size:13px; color: rgba(255,255,255,0.72); }
.field input, .field select, .field textarea{
  width:100%;
  padding:12px 12px;
  border-radius:16px;
  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(0,0,0,0.25);
  color:#fff;
  outline:none;
}
.field input::placeholder, .field textarea::placeholder{ color: rgba(255,255,255,0.45); }
.field input:focus, .field select:focus, .field textarea:focus{
  border-color: rgba(255,255,255,0.28);
}
.form-bottom{
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
  margin-top:6px;
}
.form-note{ font-size:12px; color: rgba(255,255,255,0.65); }
.form-success{
  margin-top:12px;
  font-size:13px;
  color: rgba(255,255,255,0.75);
}

/* footer inside contacts */
.footer{
  margin-top:28px;
  padding-top:18px;
  border-top: 1px solid rgba(255,255,255,0.08);
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap:14px;
  color: rgba(255,255,255,0.70);
}
.footer-links{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
}
.footer-links a{
  color: rgba(255,255,255,0.70);
  text-decoration:none;
  border-bottom: 1px solid rgba(255,255,255,0.18);
}
.footer-links a:hover{
  border-bottom-color: rgba(255,255,255,0.45);
  color:#fff;
}

/* =========================
   REVEAL ANIMATION
========================= */
.reveal{
  opacity:0;
  transform: translateY(16px);
  transition: opacity .6s ease, transform .6s ease;
}
.reveal.is-visible{
  opacity:1;
  transform: translateY(0);
}

/* =========================
   RESPONSIVE
========================= */
@media (max-width: 1024px){
  .container{ padding: 0 20px; }

  .hero-inner{ grid-template-columns: 1fr; gap: 28px; }
  .hero-text h1{ font-size: 42px; }
  .hero-image{ height: 320px; border-radius: 28px; }

  .stats-inner{ grid-template-columns: 1fr; }
  .features-grid, .team-grid, .cards-grid{ grid-template-columns: 1fr; }
  .step{ grid-template-columns: 1fr; }

  .contact-grid{ grid-template-columns: 1fr; }
  .form-row{ grid-template-columns: 1fr; }
  .mini-cta{ flex-direction: column; align-items:flex-start; }
}

@media (max-width: 860px){
  .nav{ display:none; } /* если хочешь — потом сделаем бургер меню */
}
/* =========================
   HEADER ACTIONS (CTA + BURGER)
========================= */
.header-actions{
  display:flex;
  align-items:center;
  gap:12px;
}

/* CTA чуть дороже: компактнее, аккуратнее */
.cta{
  padding: 11px 18px;
  border-radius: 999px;
  background:#111;
  color:#fff;
  border:none;
  cursor:pointer;
  font-weight:600;
  box-shadow: 0 18px 50px rgba(0,0,0,.12);
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.cta:hover{
  background:#000;
  transform: translateY(-1px);
  box-shadow: 0 22px 60px rgba(0,0,0,.16);
}

/* бургер сделаем “тихо премиум” */
.burger{
  width:44px;
  height:44px;
  border-radius:999px;
  border: 1px solid rgba(0,0,0,0.08);
  background: rgba(255,255,255,0.85);
  backdrop-filter: blur(16px);
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  position:relative;
  z-index:2100;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.burger:hover{
  transform: translateY(-1px);
  border-color: rgba(0,0,0,0.12);
  box-shadow: 0 18px 45px rgba(0,0,0,0.10);
}
.burger span{
  position:absolute;
  width:18px;
  height:2px;
  background:#111;
  border-radius:2px;
  opacity:.9;
}
.burger span:nth-child(1){ transform: translateY(-6px); }
.burger span:nth-child(2){ transform: translateY(0); }
.burger span:nth-child(3){ transform: translateY(6px); }

/* =========================
   OVERLAY MENU (PREMIUM)
========================= */
.menu-overlay{
  position:fixed;
  inset:0;
  z-index:999;
  display:flex;
  justify-content:flex-end;
  background: rgba(0,0,0,0.55);
  backdrop-filter: blur(10px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition: opacity .25s ease, visibility .25s ease;
}
.menu-overlay.open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

/* right panel */
.menu-panel{
  width:min(560px, 92vw);
  height:100%;
  padding:22px 22px 18px;
  background:
    radial-gradient(900px 520px at 30% 0%, rgba(255,255,255,0.07), transparent 58%),
    #0f0f10;
  color:#fff;
  border-left: 1px solid rgba(255,255,255,0.10);
  transform: translateX(16px);
  opacity:0;
  transition: transform .25s ease, opacity .25s ease;
  overflow:auto;
}
.menu-overlay.open .menu-panel{
  transform: translateX(0);
  opacity:1;
}

/* close */
.menu-close{
  position:sticky;
  top:0;
  margin-left:auto;
  display:flex;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  border-radius:999px;
  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(255,255,255,0.06);
  color:#fff;
  cursor:pointer;
  font-size:22px;
  line-height:1;
  transition: transform .2s ease, background .2s ease, border-color .2s ease;
}
.menu-close:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,0.10);
  border-color: rgba(255,255,255,0.18);
}

/* top area */
.menu-top{
  margin-top:10px;
  display:grid;
  gap:16px;
  padding-bottom:18px;
  border-bottom: 1px solid rgba(255,255,255,0.10);
}

.menu-tabs{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.tab{
  padding:10px 14px;
  border-radius:999px;
  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(255,255,255,0.06);
  color: rgba(255,255,255,0.82);
  cursor:pointer;
  font-size:13px;
}
.tab.active{
  background: rgba(255,255,255,0.12);
  color:#fff;
  border-color: rgba(255,255,255,0.18);
}

.menu-contact{
  display:grid;
  gap:8px;
}
.menu-phone{
  font-size:30px;
  font-weight:650;
  letter-spacing:-0.02em;
  color:#fff;
  text-decoration:none;
  width:fit-content;
}
.menu-phone:hover{ opacity:.9; }

.menu-status{
  display:flex;
  align-items:center;
  gap:10px;
  color: rgba(255,255,255,0.72);
  font-size:13px;
}
.menu-status .dot{
  width:10px;
  height:10px;
  border-radius:999px;
  background: #36d67b;
  box-shadow: 0 0 0 6px rgba(54,214,123,0.14);
}

.menu-icons{
  display:flex;
  gap:10px;
}
.icon-btn{
  width:44px;
  height:44px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(255,255,255,0.06);
  color:#fff;
  font-size:12px;
  letter-spacing:.02em;
  transition: transform .2s ease, background .2s ease, border-color .2s ease;
}
.icon-btn:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,0.10);
  border-color: rgba(255,255,255,0.18);
}

/* links */
.menu-links{
  padding:18px 2px 10px;
  display:grid;
  gap:10px;
}
.menu-link{
  padding:16px 14px;
  border-radius:18px;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(255,255,255,0.06);
  text-decoration:none;
  color:#fff;
  font-size:16px;
  letter-spacing:-0.01em;
  transition: transform .2s ease, background .2s ease, border-color .2s ease;
}
.menu-link:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,0.10);
  border-color: rgba(255,255,255,0.16);
}
.menu-link.small{
  font-size:14px;
  color: rgba(255,255,255,0.85);
}

.menu-divider{
  height:1px;
  background: rgba(255,255,255,0.10);
  margin: 10px 6px;
}

/* bottom cta */
.menu-bottom{
  margin-top:12px;
  padding-top:14px;
  border-top: 1px solid rgba(255,255,255,0.10);
  display:grid;
  gap:10px;
}
.menu-bottom .primary{
  width:100%;
  background:#fff;
  color:#111;
}
.menu-bottom .primary:hover{ background:#f2f2f2; }
.menu-note{
  font-size:12px;
  color: rgba(255,255,255,0.65);
  line-height:1.5;
}

/* =========================
   RESPONSIVE tweaks for menu
========================= */
@media (max-width: 860px){
  .cta{ display:none; } /* на мобилке оставим только бургер */
}
:root{
  --header-h: 82px; /* подгони если нужно: 76–92 */
}

/* фиксируем высоту шапки */
.header{
  height: var(--header-h);
}
.header-inner{
  height: var(--header-h);
  padding: 0;              /* чтобы высота была ровная */
}

/* чтобы контент не залезал под шапку */
body{
  padding-top: var(--header-h);
}

/* оверлей начинается ПОД шапкой */
.menu-overlay{
  top: var(--header-h);
  height: calc(100vh - var(--header-h));
  inset: unset;
  left: 0;
  right: 0;
  bottom: 0;
  position: fixed;
}

/* панель на всю высоту доступной области */
.menu-panel{
  height: 100%;
  max-height: 100%;
}
/* =========================
   PROCESS (BIGGER + INTERACTIVE)
========================= */
.process{ gap:18px; }

.step{
  padding: 26px 28px;                 /* больше воздуха */
  border-radius: 26px;
  cursor: pointer;
}

.step-num{
  font-size: 15px;                     /* было 14 */
  font-weight: 800;
  opacity: .55;
}

.step-body h3{
  font-size: 22px;                     /* было 18 */
  margin-bottom: 10px;
  letter-spacing: -0.015em;
}

.step-body p{
  font-size: 17px;                     /* было 15 */
  line-height: 1.65;
  color:#555;
  max-width: 920px;
}

/* hover уже есть — усилим чуть эффект */
.step:hover{
  transform: translateY(-4px);
  box-shadow: 0 24px 70px rgba(0,0,0,.10);
  border-color: rgba(201,162,39,0.45);
}

/* =========================
   ACCORDION behavior styles
========================= */
.step-body p{
  max-height: 0;                       /* свернуто по умолчанию */
  overflow: hidden;
  opacity: 0;
  transform: translateY(-6px);
  transition: max-height .35s ease, opacity .25s ease, transform .35s ease;
}

/* открыто */
.step.is-open .step-body p{
  max-height: 220px;                   /* хватает на 2-4 строки */
  opacity: 1;
  transform: translateY(0);
  margin-top: 6px;
}

/* маленькая стрелочка справа */
.step{
  position: relative;
}
.step::after{
  content: "▾";
  position: absolute;
  right: 22px;
  top: 24px;
  font-size: 18px;
  opacity: .45;
  transition: transform .25s ease, opacity .25s ease;
}
.step.is-open::after{
  transform: rotate(180deg);
  opacity: .85;
}

/* active подсветка */
.step.is-open{
  border-color: rgba(201,162,39,0.60);
  box-shadow: 0 24px 70px rgba(0,0,0,.10);
}

/* mobile tweaks */
@media (max-width: 1024px){
  .step-body h3{ font-size: 20px; }
  .step-body p{ font-size: 16px; }
  .step::after{ top: 22px; }
}
/* =========================
   OBJECTS: bigger typography + premium cards
========================= */
.section h2{
  font-size: 44px; /* было 36 */
}

.section-desc{
  font-size: 20px; /* было 18 */
  line-height: 1.7;
}

.features-grid{
  gap: 26px;
}

.feature{
  padding: 34px;           /* больше воздуха */
  border-radius: 28px;
  position: relative;
  overflow: hidden;        /* нужно для перелива */
}

.feature h3{
  font-size: 22px;         /* было 18 */
  margin-bottom: 12px;
  letter-spacing: -0.015em;
}

.feature p{
  font-size: 17px;         /* было 15 */
  line-height: 1.7;
  color:#595959;
}
/* =========================
   GOLD SWEEP + TRACE EFFECT
========================= */

/* перелив */
.feature::before{
  content:"";
  position:absolute;
  inset:-2px;
  background:
    linear-gradient(
      110deg,
      transparent 0%,
      rgba(232,204,106,0.00) 35%,
      rgba(232,204,106,0.22) 46%,
      rgba(201,162,39,0.12) 55%,
      transparent 70%
    );
  transform: translateX(-120%);
  transition: transform .65s ease;
  pointer-events:none;
}

/* “след” — тонкая линия, как будто свет оставил штрих */
.feature::after{
  content:"";
  position:absolute;
  top: 18px;
  left: 22px;
  width: 46px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(201,162,39,0.95), rgba(232,204,106,0.95));
  opacity: 0;
  transform: translateX(-10px);
  transition: opacity .35s ease, transform .35s ease;
  pointer-events:none;
}

/* hover: запускаем перелив и показываем “след” */
.feature:hover::before{
  transform: translateX(120%);
}
.feature:hover::after{
  opacity: 1;
  transform: translateX(0);
}

/* чуть усилим hover */
.feature:hover{
  transform: translateY(-5px);
  border-color: rgba(201,162,39,0.45);
  box-shadow: 0 26px 80px rgba(0,0,0,0.12);
}
/* =========================
   HEADER — PREMIUM APPLE STYLE
========================= */

/* шапка: чуть выше и ровнее */
:root{
  --nav-scale: 1.3;            /* 1) Увеличение шапки x1.3 */
}

.header-inner{
  padding: 0;                  /* высоту держим через --header-h */
  gap: 22px;
}

/* 1) Логотип крупнее */
.logo{
  font-size: calc(20px * var(--nav-scale));
  font-weight: 780;
  letter-spacing: -0.035em;
  color:#111;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  line-height: 1;
  position: relative;
  transform-origin: left center;
  transition: transform .2s ease, filter .2s ease, opacity .2s ease;
}

/* 3) Меню “как у Apple” */
.nav a{
  font-size: calc(14px * var(--nav-scale));
  font-weight: 520;
  letter-spacing: -0.02em;
  color: rgba(17,17,17,0.82);
  text-decoration:none;

  padding: 10px 12px;
  border-radius: 999px;

  transition: transform .18s ease, background .18s ease, color .18s ease, opacity .18s ease;
  transform-origin: center;
}

.nav a:hover{
  background: rgba(0,0,0,0.06);
  color:#111;
  transform: translateY(-1px);
}

.nav a:active{
  transform: translateY(0px) scale(0.98);  /* 2) “приятно нажимается” */
}

/* Кнопка и бургер синхронизируем по “нажатию” */
.cta, .burger{
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.cta:active, .burger:active{
  transform: scale(0.98);
}

/* золотой underline при hover (очень премиально) */
.nav a::after{
  content:"";
  display:block;
  height:2px;
  width:0%;
  margin: 7px auto 0;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(201,162,39,0.95), rgba(232,204,106,0.95));
  transition: width .22s ease;
  opacity: .9;
}
.nav a:hover::after{
  width: 60%;
}

/* =========================
   4) LOGO GLOW (при клике)
========================= */
.logo.is-glow{
  animation: logoGlow 900ms ease-out both;
}

@keyframes logoGlow{
  0%{
    filter: drop-shadow(0 0 0 rgba(232,204,106,0))
            drop-shadow(0 0 0 rgba(201,162,39,0));
    transform: scale(1);
  }
  35%{
    filter: drop-shadow(0 0 18px rgba(232,204,106,0.95))
            drop-shadow(0 0 38px rgba(201,162,39,0.60));
    transform: scale(1.06);
  }
  100%{
    filter: drop-shadow(0 0 0 rgba(232,204,106,0))
            drop-shadow(0 0 0 rgba(201,162,39,0));
    transform: scale(1);
  }
}
/* =========================
   LOGO STRONG GLOW EFFECT
========================= */

.logo{
  position: relative;
  z-index: 1;
}

/* СВЕТОВОЕ КОЛЬЦО */
.logo::before{
  content:"";
  position:absolute;
  inset:-14px -18px; /* размер сияния */
  border-radius: 999px;
  background:
    radial-gradient(
      circle at center,
      rgba(255,230,150,0.85),
      rgba(232,204,106,0.55),
      rgba(201,162,39,0.25),
      transparent 70%
    );
  opacity: 0;
  filter: blur(14px);
  z-index: -1;
  transform: scale(0.85);
  transition: opacity .25s ease, transform .35s ease;
}

/* ВСПЫШКА */
.logo::after{
  content:"";
  position:absolute;
  inset:-6px -10px;
  border-radius: 999px;
  border: 2px solid rgba(255,230,150,0.95);
  opacity: 0;
  z-index: -1;
  filter: blur(1px);
}

/* АКТИВАЦИЯ СИЯНИЯ */
.logo.is-glow::before{
  opacity: 1;
  transform: scale(1.1);
}

.logo.is-glow::after{
  animation: logoRing 650ms ease-out forwards;
}

/* АНИМАЦИЯ ОБОДКА */
@keyframes logoRing{
  0%{
    opacity: 0;
    transform: scale(0.9);
  }
  30%{
    opacity: 1;
  }
  100%{
    opacity: 0;
    transform: scale(1.25);
  }
}
/* =========================
   HEADER: WHITE ↔ GOLD SHIMMER
========================= */
.header{
  position: fixed;
  top:0; left:0; right:0;
  height: var(--header-h);
  z-index: 3000;

  /* перелив белый ↔ золото */
  background: linear-gradient(
    110deg,
    rgba(255,255,255,0.92) 0%,
    rgba(255,255,255,0.82) 18%,
    rgba(232,204,106,0.88) 42%,
    rgba(201,162,39,0.88) 60%,
    rgba(255,255,255,0.84) 82%,
    rgba(255,255,255,0.92) 100%
  );
  background-size: 240% 100%;
  animation: headerShimmer 20s ease-in-out infinite;

  backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(0,0,0,0.10);
}

/* дополнительный “блик” сверху — очень дорого */
.header::after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(180deg, rgba(255,255,255,0.22), transparent 60%);
  pointer-events:none;
}

/* анимация перелива */
@keyframes headerShimmer{
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
/* =========================
   LISTINGS: BIGGER PHOTOS
========================= */
.card-media{
  height: 360px;            /* было ~190 — делаем больше */
}

@media (max-width: 1024px){
  .card-media{
    height: 240px;          /* на планшет/мобилку */
  }
}

.card-media img{
  width:100%;
  height:100%;
  object-fit: cover;
  object-position: center;
}
/* =========================
   WOW TAGS + KPI (Premium micro-interactions)
========================= */

/* общие "премиум переменные" */
:root{
  --gold-1: rgba(201,162,39,.95);
  --gold-2: rgba(232,204,106,.92);
  --tag-bg: rgba(255,255,255,.78);
  --tag-br: rgba(0,0,0,.08);
}

/* --- бейджи (Premium / Business / New) --- */
.badge{
  position: relative;
  overflow: hidden;
  border-radius: 999px;
  padding: 7px 12px;
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.72));
  border: 1px solid rgba(0,0,0,.10);
  box-shadow: 0 10px 22px rgba(0,0,0,.06);
  transform: translateZ(0);
}

.badge::after{
  content:"";
  position:absolute;
  top:-40%;
  left:-60%;
  width:60%;
  height:180%;
  background: linear-gradient(90deg, transparent, rgba(232,204,106,.55), transparent);
  transform: rotate(20deg);
  opacity:0;
}

.card:hover .badge::after{
  animation: shine 900ms ease forwards;
  opacity: 1;
}

/* --- маленькие "пилюли" (55м², 2 комнаты, вид...) --- */
.card-meta span{
  position: relative;
  overflow: hidden;
  border-radius: 999px;
  padding: 8px 12px;
  font-size: 13px;
  color: #2a2a2a;

  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.72));
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 10px 20px rgba(0,0,0,.05);

  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, color .18s ease;
  transform: translateZ(0);
}

.card-meta span::after{
  content:"";
  position:absolute;
  inset:-2px;
  background: radial-gradient(circle at 20% 30%, rgba(232,204,106,.45), transparent 55%);
  opacity:0;
  pointer-events:none;
  transition: opacity .18s ease;
}

.card-meta span:hover{
  transform: translateY(-2px);
  border-color: rgba(201,162,39,.45);
  box-shadow: 0 16px 30px rgba(0,0,0,.08);
  color:#111;
}
.card-meta span:hover::after{ opacity:1; }

/* --- KPI блоки (от 38 млн, 8–11%, 18–36 мес...) --- */
.card-kpis div{
  position: relative;
  overflow: hidden;
  border-radius: 18px;
  padding: 12px 12px;

  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.70));
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 16px 34px rgba(0,0,0,.06);

  transition: transform .20s ease, box-shadow .20s ease, border-color .20s ease;
  transform: translateZ(0);
}

.card-kpis div::before{
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(circle at 18% 20%, rgba(232,204,106,.40), transparent 60%);
  opacity:0;
  transition: opacity .22s ease;
  pointer-events:none;
}

.card-kpis div::after{
  content:"";
  position:absolute;
  top:-40%;
  left:-70%;
  width:70%;
  height:220%;
  background: linear-gradient(90deg, transparent, rgba(232,204,106,.55), transparent);
  transform: rotate(18deg);
  opacity:0;
  pointer-events:none;
}

.card-kpis div:hover{
  transform: translateY(-3px);
  border-color: rgba(201,162,39,.45);
  box-shadow: 0 26px 60px rgba(0,0,0,.10);
}

.card-kpis div:hover::before{ opacity:1; }
.card-kpis div:hover::after{
  opacity:1;
  animation: shine 950ms ease forwards;
}

/* --- плавный "блик" --- */
@keyframes shine{
  0%   { transform: translateX(0) rotate(18deg); }
  100% { transform: translateX(220%) rotate(18deg); }
}

/* --- микро-эффект нажатия (ощущение кнопки) --- */
.card-meta span:active,
.card-kpis div:active{
  transform: translateY(0px) scale(0.98);
}
/* =========================
   WOW: cascade wave + KPI top gold indicator
========================= */

/* 1) Каскадная подсветка "пилюль" при hover на карточку */
.card-meta span{
  /* чтобы анимации были мягкими и стабильными */
  will-change: transform, box-shadow, border-color, filter;
}

/* базовая волна: "подскок + подсветка" */
.card:hover .card-meta span{
  border-color: rgba(201,162,39,.45);
  box-shadow: 0 18px 38px rgba(0,0,0,.08);
  transform: translateY(-2px);
  filter: saturate(1.05);
}

/* каскад задержек (волна) */
.card:hover .card-meta span:nth-child(1){ transition-delay: 0ms;  }
.card:hover .card-meta span:nth-child(2){ transition-delay: 80ms; }
.card:hover .card-meta span:nth-child(3){ transition-delay: 160ms; }
.card:hover .card-meta span:nth-child(4){ transition-delay: 240ms; }
.card:hover .card-meta span:nth-child(5){ transition-delay: 320ms; }
.card:hover .card-meta span:nth-child(6){ transition-delay: 400ms; }

/* чтобы при уходе мыши задержка не "тянулась" обратно */
.card-meta span{
  transition-delay: 0ms;
}

/* чуть более "живой" эффект блика волной */
.card:hover .card-meta span::after{
  opacity: 1;
  transition-delay: inherit;
}

/* 2) KPI: тонкая золотая линия сверху при hover */
.card-kpis div{
  position: relative;
}

/* линия-индикатор */
.card-kpis div::marker{ content:""; } /* безопасно, ни на что не влияет */

.card-kpis div .kpi-topline{ display:none; } /* на всякий случай */

/* делаем линию через ::before2 (используем outline-полоску) */
.card-kpis div::before{
  /* у тебя уже есть ::before (с подсветкой). Мы оставляем его.
     Добавим линию через box-shadow inset при hover */
}

/* именно линия появляется при hover */
.card-kpis div:hover{
  box-shadow:
    0 26px 60px rgba(0,0,0,.10),
    inset 0 2px 0 rgba(232,204,106,.95); /* тонкая золотая линия сверху */
}

/* если хочешь чуть "металлик" по линии */
.card-kpis div:hover{
  border-color: rgba(201,162,39,.50);
}

/* (опционально) волна по KPI тоже каскадом, когда hover на карточку */
.card:hover .card-kpis div{
  transform: translateY(-2px);
  border-color: rgba(201,162,39,.25);
  box-shadow: 0 20px 46px rgba(0,0,0,.08);
}
.card:hover .card-kpis div:nth-child(1){ transition-delay: 60ms; }
.card:hover .card-kpis div:nth-child(2){ transition-delay: 140ms; }
.card:hover .card-kpis div:nth-child(3){ transition-delay: 220ms; }
/* =========================
   Card spacing & typography polish
========================= */
.card-meta{
  gap:12px;
}

.card-kpis{
  gap:12px;
}

.card-kpis b{
  font-size:15px;
}

.card-kpis span{
  font-size:12px;
}
/* =========================
   LISTING: Align CTA buttons to same level
========================= */
.card{
  display: flex;
  flex-direction: column;
}

.card-body{
  display: flex;
  flex-direction: column;
  flex: 1;
}

.card-btn{
  margin-top: auto; /* кнопка всегда внизу карточки */
}
/* =========================
   CTA: Shine beam + premium hover/click
========================= */
.card-btn.primary{
  position: relative;
  overflow: hidden;
  transform: translateZ(0);
}

/* блик-луч */
.card-btn.primary::before{
  content:"";
  position:absolute;
  top:-60%;
  left:-80%;
  width:60%;
  height:220%;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(232,204,106,.55),
    transparent
  );
  transform: rotate(18deg);
  opacity: 0;
}

/* мягкая золотая подсветка */
.card-btn.primary::after{
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(circle at 20% 30%, rgba(232,204,106,.22), transparent 60%);
  opacity:0;
  pointer-events:none;
  transition: opacity .25s ease;
}

/* hover: луч пролетает */
.card:hover .card-btn.primary::before,
.card-btn.primary:hover::before{
  opacity:1;
  animation: btnShine 900ms ease forwards;
}

.card-btn.primary:hover::after{
  opacity:1;
}

/* click: легкий "удар" */
.card-btn.primary:active{
  transform: scale(0.98);
}

/* анимация луча */
@keyframes btnShine{
  0%   { transform: translateX(0) rotate(18deg); }
  100% { transform: translateX(260%) rotate(18deg); }
}
/* =========================
   REVIEWS (PREMIUM)
========================= */
.reviews-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:22px;
  margin-bottom: 28px;
}
.reviews-title h2{ margin-bottom: 10px; }

.reviews-proof{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:10px;
  min-width: 240px;
}
.reviews-rating{
  display:flex;
  align-items:center;
  gap:12px;
  padding:12px 14px;
  border-radius:18px;
  border:1px solid rgba(0,0,0,0.06);
  background: rgba(255,255,255,0.75);
  backdrop-filter: blur(12px);
}
.stars span{ font-size:14px; }
.stars .muted{ opacity:.25; }
.rating-text b{ font-size:18px; }
.rating-text span{ color:#666; font-size:13px; margin-left:6px; }

.reviews-link{
  text-decoration:none;
  color:#111;
  font-size:14px;
  border-bottom: 1px solid rgba(0,0,0,0.18);
  padding-bottom:2px;
  opacity:.8;
}
.reviews-link:hover{ opacity:1; border-bottom-color: rgba(0,0,0,0.35); }

.reviews-wrap{
  position:relative;
  padding: 8px 0;
}

.reviews-track{
  display:flex;
  gap:18px;
  overflow:auto;
  scroll-snap-type: x mandatory;
  padding: 8px 52px 18px;
  -webkit-overflow-scrolling: touch;
}
.reviews-track::-webkit-scrollbar{ height:10px; }
.reviews-track::-webkit-scrollbar-thumb{
  background: rgba(0,0,0,0.10);
  border-radius: 999px;
}

.review-card{
  position:relative;
  flex: 0 0 420px;
  scroll-snap-align: start;
  border-radius:28px;
  border:1px solid rgba(0,0,0,0.06);
  background: rgba(255,255,255,0.72);
  backdrop-filter: blur(12px);
  padding: 18px;
  overflow:hidden;
  box-shadow: 0 18px 60px rgba(0,0,0,0.06);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.review-card:hover{
  transform: translateY(-4px);
  border-color: rgba(0,0,0,0.10);
  box-shadow: 0 26px 80px rgba(0,0,0,0.10);
}

/* золотая линия сверху при ховере */
.review-card::before{
  content:"";
  position:absolute;
  left:18px; right:18px; top:12px;
  height:2px;
  border-radius:999px;
  background: linear-gradient(90deg, rgba(201,162,39,0.0), rgba(201,162,39,0.85), rgba(232,204,106,0.85), rgba(201,162,39,0.0));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .35s ease;
}
.review-card:hover::before{ transform: scaleX(1); }

/* Shine-проход (перелив) */
.review-card::after{
  content:"";
  position:absolute;
  inset:-40px;
  background: linear-gradient(120deg, transparent 35%, rgba(255,255,255,0.55) 50%, transparent 65%);
  transform: translateX(-60%) rotate(10deg);
  opacity:0;
  transition: opacity .2s ease;
  pointer-events:none;
}
.review-card:hover::after{
  opacity:1;
  animation: reviewShine 1.2s ease forwards;
}
@keyframes reviewShine{
  0%{ transform: translateX(-60%) rotate(10deg); }
  100%{ transform: translateX(60%) rotate(10deg); }
}

.review-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom: 8px;
}
.review-quote{
  font-size:44px;
  line-height:1;
  opacity:.18;
  font-weight:700;
  transform: translateY(-2px);
}
.review-badge{
  font-size:12px;
  padding:7px 12px;
  border-radius:999px;
  color:#fff;
  font-weight:650;
  letter-spacing:-0.01em;

  background: linear-gradient(180deg, #ff4d4d, #e60000);
  border: 1px solid rgba(230,0,0,0.35);

  box-shadow:
    0 10px 26px rgba(230,0,0,0.18),
    inset 0 1px 0 rgba(255,255,255,0.35);

  transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
}

.review-card:hover .review-badge{
  transform: translateY(-1px);
  filter: saturate(1.05);
  box-shadow:
    0 14px 34px rgba(230,0,0,0.22),
    inset 0 1px 0 rgba(255,255,255,0.4);
}

.review-h{
  font-size:18px;
  letter-spacing:-0.01em;
  margin: 6px 0 10px;
}
.review-text{
  color:#555;
  line-height:1.6;
  font-size:15px;
  margin-bottom: 14px;
}

.review-chips{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

/* чипы с каскадной волной при наведении на карточку */
.review-chips .chip,
.review-chips .chip-gold{
  border-radius:999px;
  padding:8px 12px;
  font-size:13px;
  border:1px solid rgba(0,0,0,0.08);
  background: rgba(255,255,255,0.70);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
  will-change: transform;
}
.review-chips .chip-gold{
  border-color: rgba(201,162,39,0.35);
  background: linear-gradient(180deg, rgba(255,255,255,0.85), rgba(255,255,255,0.65));
}

.review-card:hover .review-chips span{
  box-shadow: 0 10px 30px rgba(0,0,0,0.06);
  border-color: rgba(201,162,39,0.22);
}
.review-card:hover .review-chips span:nth-child(1){ transform: translateY(-2px); transition-delay: 0ms; }
.review-card:hover .review-chips span:nth-child(2){ transform: translateY(-3px); transition-delay: 40ms; }
.review-card:hover .review-chips span:nth-child(3){ transform: translateY(-4px); transition-delay: 80ms; }
.review-card:hover .review-chips span:nth-child(4){ transform: translateY(-5px); transition-delay: 120ms; }

.reviews-nav{
  position:absolute;
  top: 50%;
  transform: translateY(-50%);
  width:42px;
  height:42px;
  border-radius:999px;
  border:1px solid rgba(0,0,0,0.10);
  background: rgba(255,255,255,0.85);
  backdrop-filter: blur(12px);
  cursor:pointer;
  display:grid;
  place-items:center;
  font-size:22px;
  box-shadow: 0 16px 40px rgba(0,0,0,0.10);
  transition: transform .2s ease, box-shadow .2s ease;
}
.reviews-nav:hover{
  transform: translateY(-50%) scale(1.04);
  box-shadow: 0 22px 55px rgba(0,0,0,0.14);
}
.reviews-nav.prev{ left: 8px; }
.reviews-nav.next{ right: 8px; }

@media (max-width: 1024px){
  .reviews-head{ flex-direction:column; align-items:flex-start; }
  .reviews-proof{ align-items:flex-start; }
  .review-card{ flex-basis: 86vw; }
  .reviews-track{ padding: 8px 18px 18px; }
  .reviews-nav{ display:none; }
}
.review-card{
  position:relative;
  border-radius:28px;
  background: rgba(255,255,255,0.72);
  backdrop-filter: blur(12px);
  padding:18px;
  overflow:hidden;

  /* базовая рамка (чуть заметная) */
  border: 1px solid rgba(201,162,39,0.35);
  box-shadow: 0 18px 60px rgba(0,0,0,0.06);

  transition: transform .25s ease, box-shadow .25s ease;
}

/* “золотая рамка” через градиент + маску (самый красивый способ) */
.review-card::before{
  content:"";
  position:absolute;
  inset:0;
  padding:1px;                 /* толщина рамки */
  border-radius:28px;
  background: linear-gradient(
    135deg,
    rgba(232,204,106,0.9),
    rgba(201,162,39,0.85),
    rgba(255,255,255,0.35),
    rgba(201,162,39,0.85)
  );
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events:none;
  opacity:0.85;
}

/* усиливаем рамку и даём “дорогой” glow при наведении */
.review-card:hover{
  transform: translateY(-4px);
  box-shadow:
    0 26px 80px rgba(0,0,0,0.10),
    0 0 0 1px rgba(232,204,106,0.35),
    0 20px 70px rgba(201,162,39,0.18);
}

/* легкий золотой блик по верхнему краю */
.review-card::after{
  content:"";
  position:absolute;
  left:18px; right:18px; top:12px;
  height:2px;
  border-radius:999px;
  background: linear-gradient(
    90deg,
    rgba(201,162,39,0.0),
    rgba(201,162,39,0.85),
    rgba(232,204,106,0.85),
    rgba(201,162,39,0.0)
  );
  transform: scaleX(0);
  transform-origin:left;
  transition: transform .35s ease;
  pointer-events:none;
}
.review-card:hover::after{ transform: scaleX(1); }
.rating-badge{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 14px;
  border-radius:999px;
  border: 1px solid rgba(201,162,39,.35);
  background: linear-gradient(180deg, #fff, #fffdf6);
  backdrop-filter: blur(10px);
}

.rating-text b{ font-weight: 700; }
.rating-text .muted{ color:#666; font-size:13px; }

.stars{
  position: relative;
  width: 108px;
  height: 20px;
  font-size: 18px;
  letter-spacing: 4px;
  line-height: 20px;
}

/* серые звезды */
.stars::before{
  content: "★★★★★";
  position:absolute;
  inset:0;
  color: rgba(0,0,0,0.2);
}

/* золотая заливка */
.stars-fill{
  position:absolute;
  inset:0;
  width: calc((var(--rating) / 5) * 100%);
  overflow:hidden;
}

.stars-fill::before{
  content:"★★★★★";
  position:absolute;
  inset:0;
  background: linear-gradient(90deg, #c9a227, #f3e08a, #c9a227);
  background-size: 200% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;

  opacity: 0;
  transform: translateY(6px);
}

/* АНИМАЦИЯ */
.rating-badge.is-animate .stars-fill::before{
  animation: starsIn .6s ease-out forwards, goldFlow 1.8s ease-in-out infinite .4s;
}

@keyframes starsIn{
  to{
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes goldFlow{
  0%{ background-position: 0% 50%; }
  100%{ background-position: 200% 50%; }
}
/* === STARS: прилёт + частичная заливка === */
.stars-fly{
  display:flex;
  gap:6px;
  align-items:center;
}

.star{
  position:relative;
  width:18px;
  height:18px;
  display:inline-block;
}

/* серый слой */
.star::before{
  content:"★";
  position:absolute;
  inset:0;
  font-size:18px;
  line-height:18px;
  color: rgba(0,0,0,.22);
}

/* золотая заливка (будет обрезаться по ширине) */
.star::after{
  content:"★";
  position:absolute;
  inset:0;
  font-size:18px;
  line-height:18px;

  background: linear-gradient(90deg,#c9a227,#f3e08a,#c9a227);
  background-size:200% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;

  /* частичная заливка */
  clip-path: inset(0 calc(100% - var(--fill, 0%)) 0 0);

  /* прилёт */
  opacity:0;
  transform: translateY(14px) scale(.8) rotate(-12deg);
}

/* запуск анимации, когда добавим класс */
.rating-badge.is-animate .star::after{
  animation:
    starFly .55s cubic-bezier(.2,.9,.2,1) forwards,
    goldFlow 1.8s ease-in-out infinite .6s;
  animation-delay: calc(var(--i) * 90ms);
}

@keyframes starFly{
  to{ opacity:1; transform: translateY(0) scale(1) rotate(0deg); }
}

@keyframes goldFlow{
  0%{ background-position:0% 50%; }
  100%{ background-position:200% 50%; }
}
/* ===== Team (6 cards) ===== */
.team-head{ margin-bottom: 28px; }

.team-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 18px;
}

.team-card{
  position: relative;
  display:flex;
  gap: 14px;
  padding: 18px;
  border-radius: 18px;
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(0,0,0,0.06);
  box-shadow: 0 14px 40px rgba(0,0,0,0.06);
  overflow:hidden;
  transform: translateY(14px);
  opacity: 0;
  transition: transform .5s ease, opacity .5s ease, box-shadow .35s ease;
}

/* золотой "блик" */
.team-card::before{
  content:"";
  position:absolute;
  inset:-60px;
  background: radial-gradient(circle at 20% 10%,
    rgba(232,204,106,0.30),
    transparent 55%);
  opacity: 0;
  transform: translateY(10px);
  transition: opacity .35s ease, transform .35s ease;
  pointer-events:none;
}

/* тонкая золотая рамка при hover */
.team-card::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius: 18px;
  border: 1px solid rgba(232,204,106,0.0);
  transition: border-color .35s ease;
  pointer-events:none;
}

.team-card:hover{
  transform: translateY(-6px);
  box-shadow: 0 22px 60px rgba(0,0,0,0.10);
}
.team-card:hover::before{ opacity: 1; transform: translateY(0); }
.team-card:hover::after{ border-color: rgba(232,204,106,0.55); }

.team-avatar{
  width: 56px;
  height: 56px;
  border-radius: 16px;
  background: linear-gradient(135deg,
    rgba(201,162,39,0.22),
    rgba(232,204,106,0.12));
  border: 1px solid rgba(0,0,0,0.06);
  display:flex;
  align-items:center;
  justify-content:center;
  flex: 0 0 auto;
}

.team-initials{
  font-weight: 800;
  letter-spacing: .6px;
}

.team-top h3{
  margin: 0;
  font-size: 18px;
  line-height: 1.15;
}
.team-role{
  display:inline-block;
  margin-top: 6px;
  font-size: 13px;
  color: rgba(0,0,0,0.55);
}

.team-info p{
  margin: 10px 0 12px;
  color: rgba(0,0,0,0.70);
  font-size: 14px;
  line-height: 1.45;
}

.team-tags{ display:flex; flex-wrap:wrap; gap:8px; }

/* каскадное появление пилюль при hover */
.team-card:hover .pill{
  transform: translateY(-2px);
  border-color: rgba(232,204,106,0.55);
}
.team-card:hover .pill:nth-child(1){ transition-delay: 0ms; }
.team-card:hover .pill:nth-child(2){ transition-delay: 60ms; }
.team-card:hover .pill:nth-child(3){ transition-delay: 120ms; }

.team-card .pill{
  transition: transform .25s ease, border-color .25s ease;
}

/* reveal animation */
.team-card.is-in{
  opacity: 1;
  transform: translateY(0);
}

.team-reveal{ transition-delay: calc(var(--d) * 80ms); }

/* responsive */
@media (max-width: 980px){
  .team-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px){
  .team-grid{ grid-template-columns: 1fr; }
}
/* ===== TEAM: WOW animations ===== */

/* 1) стартовое состояние (до появления) */
.team-card{
  opacity: 0;
  transform: translateY(18px) scale(.98);
  filter: blur(6px);
}

/* 2) когда показали */
.team-card.is-in{
  opacity: 1;
  transform: translateY(0) scale(1);
  filter: blur(0);
  transition:
    opacity .7s cubic-bezier(.2,.9,.2,1),
    transform .7s cubic-bezier(.2,.9,.2,1),
    filter .7s cubic-bezier(.2,.9,.2,1),
    box-shadow .35s ease;
}

/* 3) золотой shine, который пробегает по карточке */
.team-card::before{
  content:"";
  position:absolute;
  inset:-40px;
  background: linear-gradient(
    120deg,
    transparent 0%,
    rgba(232,204,106,0.0) 35%,
    rgba(232,204,106,0.55) 50%,
    rgba(232,204,106,0.0) 65%,
    transparent 100%
  );
  transform: translateX(-120%) rotate(6deg);
  opacity: 0;
  pointer-events:none;
}

.team-card:hover::before{
  opacity: 1;
  animation: teamShine 1.1s ease forwards;
}

@keyframes teamShine{
  0%{ transform: translateX(-120%) rotate(6deg); }
  100%{ transform: translateX(120%) rotate(6deg); }
}

/* 4) hover: “премиум” подъем */
.team-card:hover{
  transform: translateY(-8px) scale(1.01);
}

/* 5) аватар: pop + glow */
.team-avatar{
  position: relative;
  transition: transform .35s cubic-bezier(.2,.9,.2,1), box-shadow .35s ease;
}

.team-card:hover .team-avatar{
  transform: translateY(-2px) scale(1.06);
  box-shadow: 0 14px 30px rgba(232,204,106,0.25);
}

/* 6) пилюли: каскад (волна) */
.team-tags .pill{
  transform: translateY(6px);
  opacity: .85;
  transition: transform .35s ease, opacity .35s ease, border-color .35s ease;
}

.team-card:hover .team-tags .pill{
  transform: translateY(0);
  opacity: 1;
  border-color: rgba(232,204,106,0.65);
}

.team-card:hover .team-tags .pill:nth-child(1){ transition-delay: 0ms; }
.team-card:hover .team-tags .pill:nth-child(2){ transition-delay: 70ms; }
.team-card:hover .team-tags .pill:nth-child(3){ transition-delay: 140ms; }

/* 7) легкая подсветка заголовка при hover */
.team-card h3{
  transition: letter-spacing .35s ease;
}
.team-card:hover h3{
  letter-spacing: .2px;
}
/* ===== GOLD FRAME FOR TEAM CARDS ===== */

.team-card{
  position: relative;
  background: #fff;
  border-radius: 20px;
  z-index: 1;
}

/* золотая рамка */
.team-card::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:20px;
  padding:1.5px; /* толщина рамки */
  background: linear-gradient(
    135deg,
    #f6e7b2,
    #d4af37,
    #f1e6b8
  );
  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events:none;
  opacity:.9;
  transition: opacity .35s ease, filter .35s ease;
}

/* hover — премиум эффект */
.team-card:hover::after{
  opacity:1;
  filter: drop-shadow(0 0 18px rgba(212,175,55,.35));
}

/* легкий подъем при наведении */
.team-card:hover{
  transform: translateY(-6px);
  transition: transform .35s cubic-bezier(.2,.9,.2,1);
}
.team-avatar{
  width:56px;
  height:56px;
  border-radius:16px;
  overflow:hidden;
  position:relative;
  flex:0 0 56px;
  display:grid;
  place-items:center;
  background: radial-gradient(120% 120% at 20% 10%, rgba(255,255,255,.9), rgba(210,180,80,.18));
  border:1px solid rgba(210,180,80,.35);
}

.team-photo{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.team-initials{
  font-weight:700;
  letter-spacing:.06em;
  color:#111;
  opacity:.9;
  transition:.25s ease;
}

.team-avatar.has-photo .team-initials{
  opacity:0;
  transform:scale(.92);
}

/* Фон с логотипами */
.pattern-bg {
  position: relative;
  background-color: #ffffff;
  background-image: url("av-pattern.jpg");
  background-repeat: repeat;
  background-size: 70px 90px; /* размер логотипов */
  background-position: center;
}
.team-avatar{
  width:56px;
  height:56px;
  border-radius:16px;
  overflow:hidden;
  background:#f4f1e8;
  border:1px solid rgba(191,151,64,.35);
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
}

.team-photo{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* если фото не загрузилось — чтобы не было “битой иконки” */
.team-photo:not([src]), .team-photo[src=""]{ display:none; }
.team-avatar{
  width:56px;
  height:56px;
  border-radius:16px;
  overflow:hidden;
  background: #f4f1e6;
  border: 1px solid rgba(0,0,0,.08);
  flex: 0 0 56px;
}

.team-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
/* аватар без блика */
.team-avatar{
  width:56px;
  height:56px;
  border-radius:16px;
  overflow:hidden;

  background: transparent;          /* убираем светлую подложку */
  border: 1px solid rgba(0,0,0,.10);
  box-shadow: none;                 /* если был блик от тени */

  flex: 0 0 56px;
}

/* фото чуть “собраннее”, без засвета */
.team-avatar img{
  width:100%;
  height:100%;
  object-fit: cover;
  display:block;

  filter: contrast(1.05) saturate(1.02);
}
.team-card{
  box-shadow: none; /* если есть мягкая подсветка вокруг */
}

.team-card:hover{
  box-shadow: 0 14px 38px rgba(0,0,0,.10); /* нормальная тень без “светлого блика” */
}
/* секция во всю ширину экрана (даже если внутри .container) */
.section-dark{
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

/* сам чёрный блок (если это .contacts-wrap или как у тебя называется) */
.section-dark{
  min-height: 100vh;      /* на всю высоту экрана */
  display: flex;
  align-items: center;    /* вертикально по центру */
}

/* чтобы контент не был узким, но и не растягивался бесконечно */
.section-dark .container{
  width: min(1200px, 92vw);
}
.contact-mail{
  color:#fff;
  text-decoration: none;
  opacity:.9;
}
.contact-mail:hover{ opacity:1; text-decoration: underline; }
.form-card { position: relative; overflow: hidden; }

.form-success{
  margin-top: 14px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.92);
  transform: translateY(6px);
  opacity: 0;
  transition: .35s ease;
}
.form-success.is-show{
  opacity: 1;
  transform: translateY(0);
}

/* Canvas салюта поверх формы */
.confetti{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  opacity: 0;
  transition: opacity .2s ease;
}
.confetti.is-on{ opacity: 1; }
.form-card{
  position: relative;
  overflow: hidden; /* салют внутри карточки */
}

.confetti{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 5;
}

.form-success{
  position: relative;
  z-index: 6;
}
/* ===== OFFERS festive premium (на твоих классах) ===== */
#offers.promo{
  position: relative;
  overflow: hidden;
}

/* мягкие золотые точки на фоне */
#offers.promo::before{
  content:"";
  position:absolute; inset:-120px;
  background:
    radial-gradient(18px 18px at 15% 20%, rgba(216,177,88,.16), transparent 60%),
    radial-gradient(14px 14px at 78% 25%, rgba(216,177,88,.12), transparent 60%),
    radial-gradient(20px 20px at 55% 75%, rgba(216,177,88,.10), transparent 60%),
    radial-gradient(10px 10px at 30% 80%, rgba(216,177,88,.14), transparent 60%),
    radial-gradient(8px 8px at 90% 70%, rgba(216,177,88,.10), transparent 60%);
  pointer-events:none;
  opacity:.9;
  animation: promoFloat 10s ease-in-out infinite;
}
@keyframes promoFloat{
  0%,100%{ transform: translate3d(0,0,0); }
  50%{ transform: translate3d(0,-14px,0); }
}

/* карточки */
#offers.promo .feature{
  position: relative;
  border-radius: 22px;
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(216,177,88,.42);
  box-shadow:
    0 14px 40px rgba(0,0,0,.06),
    inset 0 1px 0 rgba(255,255,255,.75);
  overflow: hidden;
  transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}

/* “шимер” при hover */
#offers.promo .feature::before{
  content:"";
  position:absolute; inset:-2px;
  background: linear-gradient(110deg,
    transparent 35%,
    rgba(216,177,88,.18) 48%,
    rgba(255,244,210,.22) 52%,
    transparent 65%);
  transform: translateX(-60%);
  opacity: 0;
  pointer-events:none;
}

#offers.promo .feature:hover{
  transform: translateY(-6px);
  border-color: rgba(216,177,88,.70);
  box-shadow:
    0 18px 55px rgba(0,0,0,.10),
    inset 0 1px 0 rgba(255,255,255,.78);
}
#offers.promo .feature:hover::before{
  opacity: 1;
  animation: promoShine 1.0s ease forwards;
}
@keyframes promoShine{ to{ transform: translateX(60%); } }

/* “бантик” — аккуратно в углу */
#offers.promo .feature::after{
  content:"";
  position:absolute;
  top:16px;
  right:18px;
  width: 38px;
  height: 38px;
  opacity: .85;
  background-size: contain;
  background-repeat:no-repeat;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='72' viewBox='0 0 72 72'%3E%3Cpath fill='none' stroke='%23D8B158' stroke-width='2.6' d='M36 14v44'/%3E%3Cpath fill='none' stroke='%23D8B158' stroke-width='2.6' d='M36 22c-6-10-18-10-20 0s12 14 20 6'/%3E%3Cpath fill='none' stroke='%23D8B158' stroke-width='2.6' d='M36 22c6-10 18-10 20 0s-12 14-20 6'/%3E%3Cpath fill='none' stroke='%23D8B158' stroke-width='2.6' d='M32 28h8'/%3E%3C/svg%3E");
  filter: drop-shadow(0 6px 10px rgba(0,0,0,.10));
  transform: rotate(2deg);
}


#offers.promo .features-grid.is-in .feature:nth-child(1){ transition-delay: 0ms; }
#offers.promo .features-grid.is-in .feature:nth-child(2){ transition-delay: 90ms; }
#offers.promo .features-grid.is-in .feature:nth-child(3){ transition-delay: 180ms; }
#offers.promo .features-grid.is-in .feature:nth-child(4){ transition-delay: 270ms; }
/* DIRECTIONS */
.dir-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-top: 18px;
}

.dir-card{
  background: rgba(255,255,255,0.88);
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 18px;
  padding: 22px;
  box-shadow: 0 18px 50px rgba(0,0,0,0.06);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  position: relative;
  overflow: hidden;
}

.dir-card::before{
  content:"";
  position:absolute;
  right:-120px; top:-120px;
  width:280px; height:280px;
  background: radial-gradient(circle, rgba(201,163,86,0.22), transparent 60%);
  transform: rotate(25deg);
  pointer-events:none;
}

.dir-card:hover{
  transform: translateY(-4px);
  border-color: rgba(201,163,86,0.45);
  box-shadow: 0 26px 70px rgba(0,0,0,0.10);
}

.dir-badge{
  display:inline-flex;
  font-size: 12px;
  font-weight: 700;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(201,163,86,0.14);
  border: 1px solid rgba(201,163,86,0.35);
  margin-bottom: 10px;
}

.dir-card h3{ margin: 0 0 8px; font-size: 18px; line-height: 1.25; }
.dir-card p{ margin: 0; color: rgba(0,0,0,0.70); line-height: 1.55; }

/* последняя карточка на всю ширину */
.dir-card:last-child{ grid-column: 1 / -1; }

@media (max-width: 860px){
  .dir-grid{ grid-template-columns: 1fr; }
  .dir-card:last-child{ grid-column: auto; }
}
/* MENU: accordion */
.menu-acc{
  width: 100%;
  text-align: left;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  cursor: pointer;
  background: transparent;
  border: 0;
}

.menu-acc-ico{
  width: 10px;
  height: 10px;
  border-right: 2px solid rgba(255,255,255,.7);
  border-bottom: 2px solid rgba(255,255,255,.7);
  transform: rotate(45deg);
  transition: transform .2s ease, opacity .2s ease;
  opacity: .85;
}

.menu-acc[aria-expanded="true"] .menu-acc-ico{
  transform: rotate(-135deg);
}

.menu-sub{
  margin: 10px 0 14px;
  padding-left: 10px;
  display: grid;
  gap: 10px;
  border-left: 1px solid rgba(255,255,255,.12);
}

.menu-sublink{
  display: block;
  padding: 12px 14px;
  border-radius: 14px;
  color: rgba(255,255,255,.9);
  text-decoration: none;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
  transition: transform .15s ease, background .15s ease, border-color .15s ease;
}

.menu-sublink:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,.09);
  border-color: rgba(255,255,255,.16);
}
.menu-sub[hidden] { display: none !important; }
.reveal { opacity: 0; transform: translateY(14px); transition: .6s; }
.reveal.is-visible { opacity: 1; transform: translateY(0); }
/* DEBUG: принудительно показать reveal-блоки */
.reveal {
  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
}
.features-grid {
  display: grid !important;
}
.feature {
  display: block !important;
}
/* =========================================
   AV PATTERN BACKGROUND (FINAL / CLEAN)
   Вставь в САМЫЙ КОНЕЦ style.css
   Файл картинки: /site/img/av-pattern.jpg
========================================= */

/* 1) базовый фон сайта (оставляем твой дизайн) */
body{
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color:#111;
  background:
    radial-gradient(1200px 700px at 10% -15%, rgba(0,0,0,0.05), transparent 60%),
    radial-gradient(900px 600px at 90% 0%, rgba(0,0,0,0.04), transparent 55%),
    #ffffff;

  position: relative; /* нужно для слоя ::before */
  z-index: 0;
}

/* 2) слой паттерна ПОД всем контентом, но НАД фоном */
body::before{
  content:"";
  position: fixed;
  inset: 0;

  /* ВАЖНО: абсолютный путь, чтобы работало из /css/ тоже */
  background-image: url("/site/img/av-pattern.jpg");
  background-repeat: repeat;
  background-size: 10px 90px;  /* размер “плитки” */
  background-position: 0 0;

  opacity: 0.12;               /* плотность логотипов */
  pointer-events: none;
  z-index: -1;                 /* гарантированно под контентом */
}

/* 3) если шапка/карточки вдруг “просели” по слоям — фикс */
.header,
.section,
.section-dark{
  position: relative;
  z-index: 1;
}
/* Убираем любые отступы сверху */
html, body { margin: 0; padding: 0; }

/* Хедер вплотную к верху */
.header{
  position: fixed;     /* важно */
  top: 0 !important;   /* прибиваем к верху */
  left: 0;
  right: 0;
  margin: 0 !important;
  border-radius: 0 !important;  /* если делал "плавающий" хедер */
}

/* Если есть якорь #top — он НЕ должен иметь высоту */
#top{
  height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Чтобы контент не залезал под fixed-хедер */
:root{ --header-h: 78px; }   /* подгони под свой хедер */
body{ padding-top: var(--header-h); }
/* 1) НЕ двигаем body — иначе могут быть сюрпризы */
body { padding-top: 0 !important; }

/* 2) Шапка всегда строго сверху */
.header { top: 0 !important; }

/* 3) Отступ даём ПЕРВОЙ секции/hero */
.hero { padding-top: calc(var(--header-h) + 30px) !important; }
:root{ --header-h: 82px; }  /* выбери одно значение */

.header{
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: var(--header-h);
  z-index: 3000;
}
/* Убираем влияние transform на предках (частая причина “съехавшего fixed”) */
body, .container, .pattern-bg, .wrapper, .page, .main{
  transform: none !important;
  filter: none !important;
  perspective: none !important;
}
.map-wrap{
  display:grid;
  grid-template-columns: 1fr 1.4fr;
  gap:24px;
  align-items:stretch;
}

.map-info{
  padding:24px;
  border-radius:24px;
  background: rgba(255,255,255,0.9);
  border: 1px solid rgba(0,0,0,0.06);
  box-shadow: 0 16px 40px rgba(0,0,0,0.06);
}

.map-info p{
  margin-bottom:10px;
  font-size:15px;
  color:#333;
}

.map-info strong{
  font-size:18px;
}

.map-wrap iframe{
  border-radius:24px;
  border: 1px solid rgba(0,0,0,0.06);
}

/* адаптив */
@media (max-width: 860px){
  .map-wrap{
    grid-template-columns: 1fr;
  }
}
/* ===== LOCATION ===== */
#location{
  background: #fafafa;
}

.map-wrap{
  margin-top: 26px;
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 22px;
  align-items: start;
}

.map-info{
  background: rgba(255,255,255,0.85);
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 22px;
  padding: 18px;
  backdrop-filter: blur(10px);
}

.map-wrap iframe{
  border-radius: 22px;
  border: 1px solid rgba(0,0,0,0.08);
  background: #fff;
}

/* mobile */
@media (max-width: 900px){
  .map-wrap{
    grid-template-columns: 1fr;
  }
  .map-wrap iframe{
    height: 360px;
  }
}
/* ===== Map shimmer border ===== */
.map-wrap{
  position: relative;
}

.map-wrap::before{
  content:"";
  position:absolute;
  inset:-2px;
  border-radius: 26px;
  background: linear-gradient(110deg,
    transparent 0%,
    rgba(232,204,106,.0) 35%,
    rgba(232,204,106,.35) 50%,
    rgba(201,162,39,.18) 60%,
    transparent 75%
  );
  transform: translateX(-120%);
  opacity: 0;
  pointer-events:none;
}

.map-wrap:hover::before{
  opacity: 1;
  animation: mapShine 1.1s ease forwards;
}

@keyframes mapShine{
  to{ transform: translateX(120%); }
}