/* ДекорГранит v1.5 · Общие контактные элементы шапки и футера.
   Фирменные объёмные зелёно-золотые градиенты. Подключать ко всем страницам.
   Расположение: мессенджеры возле телефона в шапке, dock справа внизу. */

/* 1. Шапка. Мессенджеры компактные, не конкурируют с телефоном. */
.dg-contact-header{
  display:flex;align-items:center;flex:0 0 auto;gap:7px;
  padding-left:12px;border-left:1px solid rgba(224,188,115,.36)
}
.dg-contact-header a{
  display:grid;place-items:center;flex:0 0 auto;width:34px;height:34px;
  background:linear-gradient(140deg,rgba(255,255,255,.15),rgba(255,255,255,.035) 62%,rgba(0,19,12,.16));
  border:1px solid rgba(239,212,154,.32);border-radius:9px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.24),0 5px 12px rgba(0,12,5,.13);
  transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease;
}
.dg-contact-header img{
  display:block;width:27px;height:27px;border-radius:7px;object-fit:cover;
  box-shadow:0 2px 6px rgba(0,10,5,.22);
}
.dg-contact-header a:hover,.dg-contact-header a:focus-visible{
  transform:translateY(-2px);border-color:#e4be76;
  background:linear-gradient(140deg,rgba(241,204,129,.22),rgba(255,255,255,.09));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 7px 18px rgba(0,12,5,.3);
}

/* 2. Футерный плавающий dock: обособлен от разметки остального контента. */
.dg-contact-dock{
  position:fixed;z-index:68;right:max(20px,env(safe-area-inset-right));
  bottom:calc(20px + env(safe-area-inset-bottom));
  display:flex;align-items:center;gap:5px;padding:8px 9px;
  border:1px solid rgba(239,211,152,.68);border-radius:17px;
  background:linear-gradient(133deg,rgba(24,83,59,.97) 0%,rgba(10,59,42,.97) 35%,rgba(3,35,26,.98) 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25),inset 0 -1px 0 rgba(0,15,8,.3),0 12px 40px rgba(3,27,20,.30);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
}
.dg-contact-dock::before{
  content:"";position:absolute;top:1px;left:14px;right:14px;height:1px;
  background:linear-gradient(90deg,transparent,rgba(247,221,163,.54),transparent);
  pointer-events:none;
}
.dg-contact-dock>a{
  position:relative;display:flex;align-items:center;justify-content:center;flex:0 0 auto;
  width:42px;height:42px;min-width:42px;border:1px solid transparent;
  border-radius:10px;
  transition:transform .2s ease,box-shadow .2s ease,background .2s ease;
}
.dg-contact-dock>a:hover,.dg-contact-dock>a:focus-visible{
  transform:translateY(-3px);background:rgba(244,212,142,.12);
  box-shadow:0 5px 13px rgba(0,15,9,.2);
}
.dg-contact-dock img{
  display:block;width:35px;height:35px;object-fit:cover;border-radius:8px;
  box-shadow:0 3px 7px rgba(0,15,8,.24);
}
.dg-contact-dock .dg-contact-dock-up{
  color:#113b28;background:linear-gradient(125deg,#f6e6bd 0%,#e8c784 35%,#bf8d3d 100%);
  border-color:#f6dca5;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.68),inset 0 -2px 0 rgba(99,66,19,.18),0 4px 13px rgba(0,15,9,.24);
}
.dg-contact-dock .dg-contact-dock-up:hover,
.dg-contact-dock .dg-contact-dock-up:focus-visible{
  background:linear-gradient(125deg,#fff1cf 0%,#f2d795 38%,#c59643 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85),0 6px 19px rgba(0,15,9,.3);
}
.dg-contact-dock-separator{
  width:1px;height:28px;flex:0 0 1px;background:linear-gradient(180deg,transparent,rgba(232,196,122,.7),transparent);
  margin:0 2px;
}

/* На средних настольных экранах изначально скрыт телефон; показываем
   телефон и мессенджеры в свёрнутой шапке с гамбургером. */
@media (min-width:1021px) and (max-width:1290px){
  .dg-header .dg-nav{
    display:none;position:absolute;top:100%;left:0;right:0;z-index:70;
    flex-direction:column;align-items:stretch;gap:0;
    background:#062c21;padding:9px 26px 24px;
    border-top:1px solid rgba(226,184,110,.38);box-shadow:0 17px 30px rgba(0,0,0,.25);
  }
  .dg-header .dg-nav.is-open{display:flex}
  .dg-header .dg-nav>a{font-size:13px;padding:12px;border-bottom:1px solid #ffffff15}
  .dg-header .dg-nav>a::after{display:none}
  .dg-header .dg-mobile-only{display:block!important}
  .dg-header .dg-header-actions{margin-left:auto}
  .dg-header .dg-header-phone{display:grid}
  .dg-header .dg-menu-toggle{
    display:grid;gap:5px;place-content:center;width:44px;height:44px;
    background:linear-gradient(135deg,#13543d,#073525);border:1px solid #ddb96e65;border-radius:5px;
  }
  .dg-header .dg-menu-toggle span{height:2px;width:22px;background:#e6d0a0;display:block;border-radius:3px}
}
@media (min-width:701px) and (max-width:1020px){
  .dg-header .dg-header-phone{display:grid}
}
/* На телефонах короткие ссылки рядом с меню; телефон доступен в меню и нижней CTA-панели. */
@media (max-width:700px){
  .dg-contact-header{padding-left:0;border-left:0;gap:6px}
  .dg-contact-header a{width:33px;height:33px;border-radius:8px}
  .dg-contact-header img{width:27px;height:27px;border-radius:6px}
  .dg-header .dg-header-actions{gap:8px}
  .dg-header .dg-header-phone{display:none}
}
@media (max-width:540px){
  /* Не закрываем постоянную нижнюю панель «Позвонить / Рассчитать». */
  body{padding-bottom:calc(70px + env(safe-area-inset-bottom))}
  .dg-contact-dock{right:10px;bottom:calc(78px + env(safe-area-inset-bottom));padding:6px;gap:4px;border-radius:14px}
  .dg-contact-dock>a{width:39px;height:39px;min-width:39px;border-radius:9px}
  .dg-contact-dock img{width:32px;height:32px;border-radius:7px}
  .dg-contact-dock-separator{height:25px;margin:0 1px}
}
@media (max-width:370px){
  .dg-header .dg-header-inner{gap:7px}
  .dg-header .dg-logo,.dg-header .dg-logo img{width:106px}
  .dg-header .dg-header-actions{gap:5px}
  .dg-contact-header{gap:4px}
  .dg-contact-header a{width:30px;height:30px;border-radius:7px}
  .dg-contact-header img{width:25px;height:25px;border-radius:5px}
  .dg-header .dg-menu-toggle{width:39px;height:39px}
}
@media (prefers-reduced-motion:reduce){
  .dg-contact-dock a,.dg-contact-header a{transition:none}
}

/* Не перекрывать подпись «Реальный объект» в первом экране на больших мониторах. */
@media (min-width:781px){
  .dg-fullbleed-photo-credit{right:245px}
}
/* На смартфоне контакты всегда доступны в шапке; плавающий блок
   плавно появляется после первого экрана и скрывается при заполнении формы.
   Без JavaScript панель остаётся видимой. */
@media (max-width:540px){
  html.dg-contact-js .dg-contact-dock:not(.dg-contact-dock-is-visible){
    opacity:0;visibility:hidden;pointer-events:none;transform:translateY(12px)
  }
  .dg-contact-dock{transition:opacity .22s ease,visibility .22s,transform .22s ease}
}
@media (prefers-reduced-motion:reduce){
  .dg-contact-dock{transition:none}
}
