/* ============================================================
   CORSI-LIVE — Home Page Styles
   ============================================================ */

/* ── Hero Home ────────────────────────────────────────────── */

.hero--home {
  min-height: calc(100vh - var(--navbar-height));
  display: flex;
  align-items: center;
}

.hero--home .container {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-6);
  align-items: center;
  padding-top: var(--space-6);
  padding-bottom: var(--space-6);
}

@media (min-width: 1024px) {
  .hero--home .container {
    grid-template-columns: 1fr 1fr;
  }
}

.hero__visual {
  display: flex;
  justify-content: center;
  align-items: center;
}

.hero__logo-img {
  width: 100%;
  max-width: 380px;
  filter: drop-shadow(0 20px 60px rgba(58, 0, 214, 0.4));
  animation: float 6s ease-in-out infinite;
}

@keyframes float {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(-16px); }
}

/* ── Courses Section ──────────────────────────────────────── */

.courses-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-4);
}

@media (min-width: 768px) {
  .courses-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .courses-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* ── Come funziona ────────────────────────────────────────── */

/* uses .steps-grid from components.css */

/* ── Testimonianze Section ────────────────────────────────── */

.testimonials-section {
  background: linear-gradient(180deg, var(--color-bg-light) 0%, var(--color-bg-white) 100%);
}

/* ── Partners/Trusted ─────────────────────────────────────── */

.trusted-section {
  padding: var(--space-5) 0;
  border-top: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
}

.trusted-section p {
  text-align: center;
  font-size: var(--font-size-sm);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-secondary);
  margin-bottom: var(--space-3);
}