/* Página inicial: vidro escuro, luz dourada e espaço para o vídeo. */
.landing {
  max-width: 1440px;
  margin-inline: auto;
  padding-inline: clamp(20px, 5vw, 76px);
}

.landing .landing-nav {
  min-height: 92px;
  border-bottom-color: rgba(255, 244, 223, .16);
}

.landing .site-menu-toggle {
  border: 1px solid rgba(255, 244, 223, .2);
  border-radius: 14px;
  background: rgba(10, 22, 35, .5);
}

.landing .hero {
  min-height: min(760px, calc(100svh - 92px));
  grid-template-columns: minmax(0, 1.2fr) minmax(0, .9fr);
  gap: clamp(32px, 5vw, 80px);
  padding-block: clamp(64px, 9vw, 120px);
}

.landing .hero-copy { gap: 24px; }
.landing .hero-kicker {
  padding: 10px 14px;
  border: 1px solid rgba(255, 222, 172, .25);
  border-radius: 999px;
  background: rgba(9, 22, 36, .55);
  color: #ffe4b3;
  letter-spacing: .13em;
}

.landing .hero-copy h1 {
  font-size: clamp(48px, 6.6vw, 96px);
  line-height: 1.04;
  letter-spacing: -.055em;
}

.landing .hero-copy h1 em { color: #ffdb9e; }
.landing .hero-copy p {
  max-width: 470px;
  color: #e1e8ed;
  font-size: clamp(16px, 1.4vw, 19px);
  line-height: 1.75;
}

.landing .hero-actions { flex-wrap: wrap; gap: 12px; }
.landing .hero-actions button {
  min-height: 54px;
  border-radius: 14px;
  padding-inline: 22px;
  transition: background 180ms ease, transform 180ms ease;
}
.landing .hero-primary {
  background: linear-gradient(135deg, #ffe6b9, #f5c67d);
  color: #172130;
}
.landing .hero-actions button:hover { transform: translateY(-2px); }
.landing .hero-link { background: rgba(10, 22, 35, .62); }
.landing .hero-proof { flex-wrap: wrap; row-gap: 14px; font-size: 12px; }
.landing .hero-proof b { color: #ffdb9e; }

.landing .hero-panel {
  max-width: none;
  padding: clamp(22px, 3vw, 36px);
  border: 1px solid rgba(255, 236, 204, .22);
  border-radius: 28px;
  background: linear-gradient(145deg, rgba(255, 230, 185, .07), transparent 55%), rgba(9, 22, 36, .76);
  box-shadow: 0 28px 65px rgba(0, 0, 0, .22), inset 0 1px rgba(255, 255, 255, .08);
}
.landing .feature-head { margin-bottom: 24px; }
.landing .feature-head > span { color: #ffdb9e; letter-spacing: .16em; font-size: 10px; }
.landing .feature-head strong { font-size: clamp(22px, 2.2vw, 30px); line-height: 1.25; }
.landing .feature-grid { gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.landing .feature-grid > div,
.landing .feature-grid .feature-main {
  min-height: 150px;
  padding: 18px;
  border: 1px solid rgba(221, 237, 246, .12);
  border-radius: 16px;
  background: rgba(255, 255, 255, .035);
  grid-column: auto;
}
.landing .feature-grid > div:hover { background: rgba(255, 255, 255, .065); border-color: rgba(255, 219, 158, .35); }
.landing .feature-grid .feature-main { background: rgba(255, 214, 145, .08); border-color: rgba(255, 214, 145, .22); }
.landing .feature-symbol { color: #ffdb9e; font-size: 26px; }
.landing .feature-grid > div > span:last-child { color: #c3d0da; line-height: 1.6; font-size: 12px; }
.landing .panel-status { margin-top: 24px; padding-top: 18px; font-size: 11px; }
.landing .landing-live { background: rgba(9, 22, 36, .58); margin-top: 0; }
.landing .home-functions-divider { padding-top: 56px; }
.landing :is(button, a):focus-visible { outline: 2px solid #ffe0a8; outline-offset: 5px; }

@media (max-width: 980px) {
  .landing .hero { grid-template-columns: 1fr; min-height: auto; padding-block: 56px; gap: 40px; }
  .landing .hero-copy { max-width: 660px; }
  .landing .hero-copy h1 { font-size: clamp(48px, 9vw, 80px); }
  .landing .hero-panel { max-width: 660px; }
}
@media (max-width: 620px) {
  .landing .landing-nav { min-height: 80px; }
  .landing .hero { padding-block: 42px; }
  .landing .hero-actions { align-items: stretch; }
  .landing .hero-actions button { width: 100%; }
  .landing .hero-panel { padding: 20px; border-radius: 22px; }
  .landing .feature-grid > div { min-height: 144px; padding: 14px; }
  .landing .hero-proof span + span { padding-left: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .landing .hero-actions button { transition: none; }
  .landing .hero-actions button:hover { transform: none; }
}

/* O fundo desfocado dá profundidade; os recursos ficam abertos sobre ele. */
.landing .hero-panel {
  border: 0;
  border-left: 1px solid rgba(255, 236, 204, .18);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.landing .feature-grid > div,
.landing .feature-grid .feature-main,
.landing .feature-grid > div:hover {
  border: 0;
  border-top: 1px solid rgba(221, 237, 246, .16);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.landing .landing-live {
  background: rgba(9, 22, 36, .18);
  box-shadow: none;
}
.landing .landing-live .live-card,
.landing .landing-live .daily-event-card {
  background: rgba(9, 22, 36, .12);
  box-shadow: none;
}
@media (max-width: 980px) {
  .landing .hero-panel { border-left: 0; border-top: 1px solid rgba(255, 236, 204, .18); }
}