/* style.css */
:root{
  --brand:#0d6efd;
  --brand-2:#0b5ed7;
  --accent:#0ea5e9;
  --ink:#0f172a;
  --muted:#64748b;
  --soft:#f8fafc;
  --card:#ffffff;
  --ring:rgba(13,110,253,.25);
}

html,body{height:100%}
body{
  font-size:17px;
  color:var(--ink);
  background:
    radial-gradient(1000px 480px at -12% -10%, rgba(59,130,246,.38) 0%, rgba(59,130,246,.18) 36%, rgba(59,130,246,0) 63%),
    radial-gradient(1200px 560px at 112% -18%, rgba(255,140,66,.40) 0%, rgba(255,140,66,.18) 40%, rgba(255,140,66,0) 66%),
    radial-gradient(880px 420px at 50% 120%, rgba(16,185,129,.26) 0%, rgba(16,185,129,.10) 48%, rgba(16,185,129,0) 72%),
    linear-gradient(180deg, #ffffff 0%, #ffffff 100%);
  background-attachment: fixed, fixed, fixed, fixed;
}

.navbar{
  background:#ffffff;
  border-bottom:1px solid #eef2f7;
}

.brand-mark{
  display:inline-flex; align-items:center; gap:.5rem; text-decoration:none;
  color:var(--ink); font-weight:800; letter-spacing:.3px;
}
.brand-mark i{
  width:36px; height:36px; display:inline-flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, #2563eb, #06b6d4);
  color:#fff; border-radius:10px;
  box-shadow:0 6px 18px rgba(37,99,235,.35);
}

.hero{
  position:relative; overflow:hidden;
  background:
    radial-gradient(1200px 420px at 80% -12%, rgba(255,196,0,.55) 0%, rgba(255,196,0,.18) 44%, rgba(255,196,0,0) 66%),
    radial-gradient(900px 360px at 10% -18%, rgba(14,165,233,.35) 0%, rgba(14,165,233,.12) 40%, rgba(14,165,233,0) 65%);
  filter:saturate(1.08);
}
.hero .wrap{max-width:1100px; margin:0 auto; padding:4rem 1rem 2rem}

.badge-18{
  display:inline-flex; align-items:center; gap:.5rem;
  background:#fff; color:#b42318; border:1px solid #ffb4a8;
  padding:.5rem .75rem; border-radius:999px; font-weight:700;
  box-shadow:0 3px 10px rgba(255,76,48,.15);
}

.headline{font-weight:800; color:var(--ink); letter-spacing:.2px}
.subline{color:#334155; max-width:760px}

.card-soft{
  background:#fff;
  border:1px solid #eef2f7;
  border-radius:18px;
  box-shadow:0 10px 30px rgba(2,8,23,.06);
}

.top-card .rank{
  width:58px; height:58px; border-radius:14px; font-weight:900;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, #ffd257, #ff9f1c);
  color:#1f2937;
  box-shadow:inset 0 0 0 2px rgba(0,0,0,.06), 0 10px 24px rgba(255,159,28,.25);
}
.logo-box img{max-height:42px}
.score{display:flex; align-items:center; gap:.5rem; font-weight:800; color:var(--ink)}
.score .stars{color:#f59e0b; text-shadow:0 1px 0 rgba(0,0,0,.06)}

.btn-brand{
  background:linear-gradient(135deg, var(--brand), #3b82f6);
  color:#fff; border:none; border-radius:12px; padding:.9rem 1.25rem; font-weight:800;
  box-shadow:0 10px 26px rgba(13,110,253,.35);
}
.btn-brand:hover{filter:brightness(1.07)}
.btn-ghost{
  background:#fff; color:var(--ink); border:1px solid #e5e7eb;
  border-radius:12px; padding:.9rem 1.25rem; font-weight:700;
  box-shadow:0 4px 14px rgba(2,8,23,.04);
}

.benefit{
  background:#fff; border:1px solid #e6edfb; border-radius:16px; height:100%;
  box-shadow:0 10px 24px rgba(2,8,23,.05);
}
.benefit i{
  width:48px; height:48px; border-radius:12px; display:inline-flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, #c7d2fe, #a7f3d0);
  color:#0f172a; border:1px solid #bfdbfe;
  box-shadow:0 8px 20px rgba(99,102,241,.25);
}

.table{--bs-table-color:var(--ink)}
.table thead th{border-bottom:1px solid #e5e7eb}
.table td, .table th{border-color:#eef2f7}

.highlight-wrap{
  background:linear-gradient(90deg, #2563eb, #22c55e, #f59e0b);
  padding:2px; border-radius:22px;
  box-shadow:0 10px 28px rgba(37,99,235,.18), 0 6px 20px rgba(245,158,11,.12);
}
.zone-prevention{
  background:#fff; border-radius:20px; padding:1.5rem;
  border:1px solid #e6edfb;
  box-shadow:0 12px 32px rgba(2,8,23,.06);
}
.zone-prevention h3{
  font-weight:800; letter-spacing:.2px; text-transform:uppercase; margin-bottom:.5rem;
}
.zone-prevention p{ color:#334155; margin:0 }
.zone-badges .badge{font-weight:700}

.logos-certif{
  display:flex; gap:24px; flex-wrap:wrap; align-items:center; justify-content:center;
}
.logos-certif img{
  height:34px; opacity:.95; filter:saturate(1.12) contrast(1.06);
  transition:transform .2s ease, filter .2s ease, opacity .2s ease;
}
.logos-certif a:hover img{ transform:translateY(-2px) scale(1.04); filter:saturate(1.25) contrast(1.1); opacity:1 }

.contact{
  background:#fff; border:1px solid #eef2f7; border-radius:18px;
  box-shadow:0 12px 32px rgba(2,8,23,.08);
}
.form-control, .form-select{
  background:#fff; border:1px solid #d0d5dd; color:var(--ink); border-radius:12px;
}
.form-control:focus{border-color:var(--brand); box-shadow:0 0 0 .25rem var(--ring)}

.site-footer{
  background:#ffffff; border-top:1px solid #eef2f7; color:#334155;
}
.site-footer a{color:#0f172a; text-decoration:none}
.site-footer a:hover{color:var(--brand); text-decoration:underline}
.logos img{height:26px; opacity:.95; filter:saturate(1.05)}
.disclaimer{color:#475569; font-size:.95rem}

.modal-white{background:#ffffff; border:1px solid #eef2f7; border-radius:16px}
/* === PREVENTION SECTION (красный градиент с тёмным верхом) === */
.zone-prevention{
  /* тёмный сверху → светлее снизу */
  background:
    radial-gradient(900px 400px at 12% -20%, rgba(255,255,255,.18) 0%, rgba(255,255,255,0) 60%),
    linear-gradient(180deg, #5b0a0a 0%, #b31616 34%, #ffdbdb 100%);
  border-radius:20px;
  padding:1.5rem;
  border:1px solid #f3b1b1;
  box-shadow:0 14px 36px rgba(179, 22, 22, .18), 0 6px 18px rgba(0,0,0,.06);
  color:#1f2937; /* базовый цвет текста */
}

/* заголовок читается на тёмном верху */
.zone-prevention h3{
  color:#ffffff;
  font-weight:800;
  letter-spacing:.2px;
  text-transform:uppercase;
  margin-bottom:.5rem;
  text-shadow:0 1px 0 rgba(0,0,0,.25);
}

/* основной текст — тёмный, хорошо читается на светлой части */
.zone-prevention p{
  color:#1f2937;
  margin:0;
}

/* бейджи чуть контрастнее на красном фоне */
.zone-badges .badge{
  font-weight:700;
  backdrop-filter:saturate(1.1);
}

/* логотипы — немного ярче на красном */
.zone-prevention .logos-certif img{
  height: 70px;
  filter:saturate(1.15) contrast(1.06);
}
/* === Перенос строк в таблице и карточках === */
.table th,
.table td {
  white-space: normal;               /* переопределяем nowrap у Bootstrap */
  word-break: break-word;            /* перенос длинных слов */
  overflow-wrap: anywhere;           /* безопасный перенос в любом месте */
  hyphens: auto;                     /* перенос по слогам (работает для fr) */
}

/* Ссылки и длинные домены */
.table a {
  word-break: break-word;
  overflow-wrap: anywhere;
}

/* Бейджи Bootstrap по умолчанию nowrap — позволим перенос */
.badge { 
  white-space: normal !important;
}

/* Мобильный вид (наша responsive-table) — разрешаем перенос и не даём контенту упираться */
@media (max-width: 767.98px) {
  .responsive-table tbody td {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;                 /* разрешаем перенос блоков внутри ячейки */
    gap: .25rem .75rem;
    min-width: 0;                    /* важно для переносов в flex-контейнере */
  }
  .responsive-table tbody td::before {
    flex: 0 0 44%;
    max-width: 44%;
    white-space: normal;
    word-break: break-word;
    overflow-wrap: anywhere;
  }
  .responsive-table tbody td > * {
    flex: 1 1 0;
    min-width: 0;                    /* чтобы текст внутри тоже переносился */
  }
  .responsive-table img {
    max-width: 100%;
    height: auto;
  }
}
body, p {
  font-size: 16px!important;
}
/* Тёмный футер */
.site-footer.site-footer-dark{
  background:#0a0f1f;                          /* тёмный фон */
  border-top:1px solid rgba(255,255,255,.08);
  color:#cbd5e1;
}
.site-footer.site-footer-dark .disclaimer{ color:#9fb0c6; }
.site-footer.site-footer-dark a{ color:#e2e8f0; text-decoration:none; }
.site-footer.site-footer-dark a:hover{ color:#ffffff; text-decoration:underline; }

/* Логотип бренда */
.footer-brand{ display:inline-flex; align-items:center; gap:.75rem; }
.footer-logo-img{
  height:36px; width:auto; max-width:100%;
  display:block;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.35));
}

/* Партнёрские логотипы на тёмном фоне */
.site-footer.site-footer-dark .logos img{
  height:26px;
  opacity:.95;
  filter:saturate(1.05) contrast(1.05) brightness(1.06);
}

/* Мобильные мелочи */
@media (max-width: 767.98px){
  .site-footer.site-footer-dark .text-md-end{ text-align:left !important; }
}
/* Cookie consent */
.cookie-consent{
  position: fixed;
  left: 16px;
  right: 16px;
  bottom: 16px;
  z-index: 1080;
  display: none;              /* по умолчанию скрыт */
  background: #0a0f1f;        /* тёмный бар для контраста со светлой темой */
  color: #e2e8f0;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px;
  box-shadow: 0 12px 28px rgba(2,8,23,.25);
  padding: .85rem 1rem;
}
.cookie-consent.show{ display: block; }

.cookie-consent .link-light{ color:#cfe1ff; text-decoration:underline; }
.cookie-consent .link-light:hover{ color:#ffffff; }

.cookie-consent.noscript-note{
  position: static; margin: 0; border-radius: 0; box-shadow: none;
}

/* Адаптив */
@media (min-width: 576px){
  .cookie-consent{ left: 24px; right: 24px; }
}
@media (min-width: 992px){
  .cookie-consent{ left: 50%; right: auto; transform: translateX(-50%); width: min(920px, 96vw); }
}