/* ============================================================
   Fobens — общая тема сайта (электрик-синий tech).
   Была только на главной (home-theme.css, скоуп .page-home), из-за чего
   остальные страницы выглядели иначе — другой фон, шапка и золотые кнопки.
   Вынесено под .page-site и подключается на всех публичных страницах.
   Кабинет клиента и админка сюда НЕ входят — у них своя тема.
   ============================================================ */

.page-site {
  --hb-blue: #2f8bff;
  --hb-blue-2: #1e6bff;
  --hb-bright: #5aa8ff;
  --hb-cyan: #7cd4ff;
  --hb-edge: rgba(90, 160, 255, 0.22);
  --hb-edge-soft: rgba(90, 160, 255, 0.12);
  --hb-panel: rgba(9, 18, 38, 0.62);
  --hb-panel-strong: rgba(8, 16, 34, 0.86);
  --accent: #5aa8ff;
}

body.page-site {
  background:
    radial-gradient(1100px 620px at 20% 4%, rgba(47, 139, 255, 0.20), transparent 60%),
    radial-gradient(900px 560px at 92% 8%, rgba(30, 107, 255, 0.16), transparent 62%),
    radial-gradient(700px 500px at 78% 74%, rgba(90, 168, 255, 0.10), transparent 60%),
    linear-gradient(180deg, #04070f 0%, #050a16 44%, #04070f 100%) !important;
}

body.page-site::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    linear-gradient(rgba(90, 160, 255, 0.045) 1px, transparent 1px) 0 0 / 46px 46px,
    linear-gradient(90deg, rgba(90, 160, 255, 0.045) 1px, transparent 1px) 0 0 / 46px 46px,
    radial-gradient(1.4px 1.4px at 12% 22%, rgba(180, 214, 255, 0.7), transparent 60%),
    radial-gradient(1.2px 1.2px at 68% 16%, rgba(180, 214, 255, 0.55), transparent 60%),
    radial-gradient(1.6px 1.6px at 84% 62%, rgba(180, 214, 255, 0.5), transparent 60%),
    radial-gradient(1.2px 1.2px at 32% 74%, rgba(180, 214, 255, 0.5), transparent 60%),
    radial-gradient(1.3px 1.3px at 50% 40%, rgba(180, 214, 255, 0.4), transparent 60%);
  -webkit-mask-image: radial-gradient(120% 90% at 50% 20%, #000 40%, transparent 92%);
          mask-image: radial-gradient(120% 90% at 50% 20%, #000 40%, transparent 92%);
  opacity: 0.6;
}

.page-site .page-shell { position: relative; z-index: 1; }

.page-site .site-header {
  background: linear-gradient(180deg, rgba(9, 18, 38, 0.86), rgba(7, 14, 30, 0.72));
  border: 1px solid var(--hb-edge-soft);
  box-shadow: 0 18px 50px rgba(2, 8, 22, 0.5), 0 0 0 1px rgba(90, 160, 255, 0.05) inset;
}

.page-site .main-nav a:hover,
.page-site .main-nav a.is-active { color: var(--hb-bright); }

.page-site .brand-name { color: #eaf3ff; }

.page-site .surface,
.page-site .surface-soft,
.page-site .surface-strong {
  background: linear-gradient(180deg, var(--hb-panel), rgba(6, 12, 26, 0.5)) !important;
  border: 1px solid var(--hb-edge-soft) !important;
  box-shadow: 0 30px 80px rgba(2, 8, 22, 0.42), inset 0 1px 0 rgba(120, 180, 255, 0.05) !important;
}

.page-site .eyebrow,
.page-site .meta-label { color: var(--hb-bright) !important; }

.page-site .hero-title-accent {
  background: none !important;
  -webkit-background-clip: border-box !important;
          background-clip: border-box !important;
  -webkit-text-fill-color: #6cc0ff !important;
  color: #6cc0ff !important;
  text-shadow: 0 0 22px rgba(47, 139, 255, 0.35);
}

.page-site .btn-primary {
  background: linear-gradient(135deg, #2f8bff, #1e6bff) !important;
  border: 0 !important; color: #fff !important;
  box-shadow: 0 12px 30px rgba(30, 107, 255, 0.38), inset 0 1px 0 rgba(255, 255, 255, 0.2) !important;
}

.page-site .btn-primary:hover { filter: brightness(1.06); }

.page-site a.text-button,
.page-site .text-button { color: var(--hb-bright) !important; }

.page-site .service-card:hover,
.page-site .document-card:hover { border-color: rgba(124, 212, 255, 0.5) !important; }

.page-site .status-live,
.page-site .status-badge { color: #bfe0ff; }