/* ═══════════════════════════════════════════════════════
   GUNRAT — site-banner component
   Подключить в base.html:
   <link rel="stylesheet" href="{{ url_for('static', filename='css/banners.css') }}">
   ═══════════════════════════════════════════════════════ */

.site-banner {
  position: relative;
  display: block;
  width: 100%;
  min-height: 200px;
  border-radius: var(--radius, 12px);
  overflow: hidden;
  text-decoration: none;
  color: #fff;
  cursor: default;
  margin-bottom: 32px;
  border: 1px solid rgba(255,255,255,0.07);
  box-shadow: 0 4px 40px rgba(0,0,0,0.55);
  background: linear-gradient(135deg, #0d0d1a 0%, #111320 50%, #0a1218 100%);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.site-banner:not(.site-banner--nolink) {
  cursor: pointer;
}
.site-banner:not(.site-banner--nolink):hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 56px rgba(0,0,0,0.7);
  text-decoration: none;
  color: #fff;
}

/* Фон */
.site-banner__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  transition: transform 0.45s ease;
}
.site-banner:not(.site-banner--nolink):hover .site-banner__bg {
  transform: scale(1.04);
}

/* Оверлей */
.site-banner__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to bottom,
    rgba(0,0,0,0.18) 0%,
    rgba(0,0,0,0.52) 50%,
    rgba(0,0,0,0.80) 100%
  );
}

/* Контент */
.site-banner__inner {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 44px 32px 40px;
  min-height: 200px;
  gap: 12px;
}

/* Заголовок — золотой */
.site-banner__title {
  font-family: var(--font-title, 'Orbitron', sans-serif);
  font-size: clamp(22px, 4vw, 40px);
  font-weight: 900;
  letter-spacing: 0.02em;
  color: #f5c400;
  text-shadow:
    0 0 28px rgba(245,196,0,0.55),
    0 2px 10px rgba(0,0,0,0.9);
  margin: 0;
  line-height: 1.15;
}

/* Текст */
.site-banner__body {
  font-family: var(--font-body, 'Rajdhani', sans-serif);
  font-size: clamp(13px, 2vw, 17px);
  color: rgba(255,255,255,0.88);
  text-shadow: 0 1px 8px rgba(0,0,0,0.95);
  max-width: 620px;
  line-height: 1.55;
  margin: 0;
}

/* Кнопка */
.site-banner__btn {
  display: inline-block;
  margin-top: 6px;
  padding: 9px 26px;
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.30);
  border-radius: 4px;
  font-family: var(--font-mono, monospace);
  font-size: 13px;
  letter-spacing: 0.08em;
  color: #fff;
  text-transform: uppercase;
  transition: background 0.2s, border-color 0.2s, color 0.2s;
}
.site-banner:hover .site-banner__btn {
  background: rgba(245,196,0,0.18);
  border-color: rgba(245,196,0,0.65);
  color: #f5c400;
}

@media (max-width: 600px) {
  .site-banner__inner {
    padding: 30px 20px 26px;
  }
}

/* ── Позиционные обёртки ── */
.banners-position {
  width: 100%;
}
.banners-position--top    { margin-bottom: 40px; }
.banners-position--middle { margin: 48px 0; }
.banners-position--bottom { margin-top: 48px; margin-bottom: 48px; }

/* Последний баннер в группе без нижнего отступа */
.banners-position .site-banner:last-child {
  margin-bottom: 0;
}