/* ============================================================
   УВЕДОМЛЕНИЕ О ФАЙЛАХ COOKIE
   Кнопки «Принять» и «Отклонить» оформлены одинаково: закон
   требует, чтобы отказ был не менее заметен, чем согласие.
   Цвета заданы явно, без переменных темы: плашка выводится и на
   тёмных страницах (vision.css), и на светлой карте (base.css).
   ============================================================ */

.cc {
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 90;
  padding: 0 14px 14px;
  opacity: 0;
  transform: translateY(14px);
  transition: opacity .32s ease, transform .32s ease;
}
.cc.is-in { opacity: 1; transform: none; }

.cc__box {
  display: flex;
  align-items: center;
  gap: clamp(16px, 3vw, 34px);
  width: min(1060px, 100%);
  margin: 0 auto;
  padding: 18px 22px;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 16px;
  background: rgba(10, 14, 22, .97);
  box-shadow: 0 18px 50px rgba(0, 0, 0, .5);
  backdrop-filter: blur(20px);
}

.cc__text { flex: 1 1 auto; }
.cc__t { margin: 0 0 6px; color: #f1f4fa; font-size: 15px; font-weight: 700; line-height: 1.3; }
.cc__p { margin: 0; color: #aeb8c8; font-size: 13.5px; line-height: 1.6; }
.cc__now { margin: 8px 0 0; color: #6a7488; font-size: 12.5px; }

.cc__acts { display: flex; flex: none; align-items: center; gap: 10px; }
.cc__btn {
  flex: none;
  min-width: 132px;
  padding: 11px 20px;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 11px;
  background: rgba(255, 255, 255, .06);
  color: #f1f4fa;
  font: inherit;
  font-size: 14px;
  font-weight: 620;
  cursor: pointer;
  transition: border-color .2s ease, background .2s ease;
}
.cc__btn:hover { border-color: rgba(255, 255, 255, .34); background: rgba(255, 255, 255, .11); }
.cc__btn:focus-visible { outline: 2px solid #4ea8ff; outline-offset: 2px; }
.cc__more { flex: none; padding: 0 4px; color: #6ce0ff; font-size: 13.5px; white-space: nowrap; }

@media (max-width: 900px) {
  .cc__box { flex-direction: column; align-items: stretch; gap: 16px; }
  .cc__acts { flex-wrap: wrap; }
  .cc__btn { flex: 1 1 140px; }
  .cc__more { width: 100%; padding: 2px 0 0; text-align: center; }
}