/* BY HOME — звонок, MAX, cookie. Переменные из app.css. */

/* плавающие кнопки */
.fab a, .fab button{ text-decoration:none; font-family:inherit; }
.fab button{ border:none; }
.fab{ position:fixed; right:22px; bottom:22px; z-index:90; display:flex; flex-direction:column; gap:10px; align-items:flex-end; }
.fab-btn{ display:inline-flex; align-items:center; gap:9px; height:50px; padding:0 20px 0 16px; border-radius:999px;
  font-weight:700; font-size:14px; color:#fff; box-shadow:0 10px 30px rgba(20,18,14,.25); transition:.2s; cursor:pointer; }
.fab-btn svg{ width:21px; height:21px; flex-shrink:0; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.fab-call{ background:var(--green-cta,#355d86); } .fab-call:hover{ background:var(--accent-d,#2c4f73); transform:translateY(-2px); }
@media(max-width:880px){
  /* пока cookie-баннер виден (--cookie-h > 0) — плавающие кнопки поднимаются над ним */
  .fab{ bottom:calc(22px + var(--cookie-h,0px)); }
}
@media(max-width:620px){
  .fab{ right:14px; bottom:calc(14px + var(--cookie-h,0px)); gap:8px; }
  .fab-btn{ height:48px; width:48px; padding:0; justify-content:center; }
  .fab-btn span{ display:none; }
}

/* модалка звонка */
.cb{ position:fixed; inset:0; z-index:115; display:grid; place-items:center; padding:20px; }
.cb[hidden]{ display:none; }
.cb-back{ position:absolute; inset:0; background:rgba(20,18,14,.5); backdrop-filter:blur(3px); opacity:0; transition:.25s; }
.cb.on .cb-back{ opacity:1; }
.cb-card{ position:relative; background:#fff; border-radius:18px; width:100%; max-width:400px; padding:30px 28px;
  transform:translateY(14px) scale(.98); opacity:0; transition:.25s; }
.cb.on .cb-card{ transform:none; opacity:1; }
.cb-x{ position:absolute; top:12px; right:12px; width:34px; height:34px; border-radius:50%; color:var(--soft); display:grid; place-items:center; }
.cb-x:hover{ background:var(--panel); color:var(--ink); }
.cb-card h3{ font-size:21px; font-weight:800; margin-bottom:6px; }
.cb-card>p{ font-size:13.5px; color:var(--soft); margin-bottom:18px; line-height:1.5; }
.cb-card input{ width:100%; height:48px; border:1.5px solid var(--line2); border-radius:11px; padding:0 14px; font-size:15px; margin-bottom:10px; transition:.15s; }
.cb-card input:focus{ outline:none; border-color:var(--ink); }
.cb-err{ background:#fdeee6; color:var(--orange-d); font-size:13px; font-weight:600; padding:9px 12px; border-radius:9px; margin-bottom:10px; }
.cb-submit{ width:100%; height:50px; background:var(--ink); color:#fff; border-radius:12px; font-weight:700; font-size:15px; transition:.2s; }
.cb-submit:hover{ background:#000; } .cb-submit:disabled{ opacity:.6; }
.cb-or{ text-align:center; margin-top:12px; font-size:13px; color:var(--soft); } .cb-or a{ color:#7b54d3; font-weight:600; }
.cb-done{ text-align:center; padding:10px 0; }
.cb-check{ width:62px; height:62px; border-radius:50%; background:var(--green); color:#fff; font-size:30px; display:grid; place-items:center; margin:0 auto 16px; }
.cb-done h3{ margin-bottom:8px; } .cb-done p{ color:var(--soft); margin-bottom:20px; }

/* cookie */
.cookie{ position:fixed; left:16px; right:16px; bottom:16px; z-index:95; max-width:760px; margin:0 auto;
  background:var(--ink); color:#fff; border-radius:14px; padding:16px 20px; display:flex; align-items:center; gap:18px;
  box-shadow:0 14px 40px rgba(20,18,14,.3); font-size:13.5px; line-height:1.45; }
.cookie[hidden]{ display:none; }
.cookie a{ color:#fff; text-decoration:underline; }
.cookie button{ flex-shrink:0; background:#fff; color:var(--ink); font-weight:700; font-size:14px; padding:10px 22px; border-radius:999px; }
.cookie button:hover{ background:var(--panel); }
/* На телефоне — одна строка: кнопка столбцом уходила под нижнюю панель браузера. */
@media(max-width:620px){
  .cookie{ left:10px; right:10px; bottom:calc(10px + env(safe-area-inset-bottom, 0px)); padding:10px 12px; gap:10px; font-size:12px; line-height:1.35; }
  .cookie button{ padding:9px 14px; font-size:13px; }
}

/* «Заказать звонок» в шапке/навигации */
.nav-call{ display:inline-flex; align-items:center; gap:7px; font-size:13px; font-weight:600; color:var(--green-cta); white-space:nowrap; }
.nav-call svg{ width:16px; height:16px; }
.nav-call:hover{ color:var(--accent-d); }

/* MAX-ссылка в футере */
.ftr-max{ display:inline-flex; align-items:center; gap:7px; margin-top:14px; background:#7b54d3; color:#fff !important;
  font-weight:600; font-size:13px; padding:9px 16px; border-radius:999px; }
.ftr-max:hover{ background:#6841c4; }
.ftr-max::before{ content:"✉"; }

/* атрибут hidden должен скрывать кнопки (display:inline-flex иначе его перебивает) */
.fab-btn[hidden], .ftr-max[hidden]{ display:none !important; }

/* соцсети в футере */
.ftr-social{ display:flex; gap:9px; margin-top:16px; flex-wrap:wrap; }
.soc{ width:38px; height:38px; border-radius:50%; background:var(--c,#333); color:#fff !important;
  display:grid; place-items:center; font-size:12.5px; font-weight:800; letter-spacing:-.02em; transition:.18s; text-decoration:none; }
.soc:hover{ transform:translateY(-2px); filter:brightness(1.12); }

/* «Связаться»: одна кнопка, по нажатию — три способа */
.fab-menu{display:flex;flex-direction:column;gap:6px;background:#fff;border:1px solid var(--line,#e7e3db);border-radius:14px;
  padding:8px;box-shadow:0 16px 40px rgba(20,18,14,.18);min-width:230px}
.fab-menu[hidden]{display:none}
.fab-item{display:flex;align-items:center;gap:10px;padding:11px 12px;border-radius:10px;font-size:14px;font-weight:600;
  color:var(--ink,#1b1b19);background:none;border:none;cursor:pointer;text-align:left;font-family:inherit}
.fab-item:hover{background:var(--panel,#f3f1ec)}
.fab-item svg{width:19px;height:19px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.fab-item[hidden]{display:none}