/*
 * Rapide theme: homepage-specific presentation.
 * Source of truth: design/index.html
 */

.front-page-main {
  position: relative;
  overflow-x: hidden;
}

.front-page-backdrop--primary {
  background:
    radial-gradient(circle at top left, rgba(47, 111, 237, 0.22), transparent 40%),
    radial-gradient(circle at top right, rgba(203, 94, 52, 0.16), transparent 32%);
}

.theme-dark .front-page-backdrop--primary {
  background:
    radial-gradient(circle at top left, rgba(96, 165, 250, 0.12), transparent 40%),
    radial-gradient(circle at top right, rgba(224, 123, 87, 0.1), transparent 32%);
}

.front-page-backdrop--secondary {
  background: linear-gradient(
    to bottom,
    rgba(252, 251, 247, 0.85),
    rgba(252, 251, 247, 0.98) 24%,
    rgba(252, 251, 247, 1) 100%
  );
}

.theme-dark .front-page-backdrop--secondary {
  background: linear-gradient(
    to bottom,
    rgba(2, 6, 23, 0.72),
    rgba(2, 6, 23, 0.96) 24%,
    rgba(2, 6, 23, 1) 100%
  );
}

.hero-section--index {
  padding-top: 0.5rem;
}

.hero-panel {
  position: relative;
  overflow: hidden;
  padding: 1rem;
}

.hero-panel__gradient {
  background: linear-gradient(135deg, rgba(47, 111, 237, 0.08), rgba(203, 94, 52, 0.08));
}

.theme-dark .hero-panel__gradient {
  background: linear-gradient(135deg, rgba(96, 165, 250, 0.1), rgba(224, 123, 87, 0.1));
}

.hero-layout {
  display: grid;
  gap: 1.1rem;
  align-items: start;
}

.hero-layout__main {
  display: grid;
}

.hero-title--index {
  margin: 0;
  max-width: 13.5ch;
  font-family: var(--font-sans);
  font-size: clamp(2.45rem, 5.2vw, 4.15rem);
  font-weight: 800;
  line-height: 0.96;
  letter-spacing: -0.06em;
}

.hero-title--index span {
  display: inline;
  margin-top: 0;
}

.hero-copy--index {
  margin: 0;
}

.hero-search-card {
  display: grid;
  gap: 0.85rem;
}

.hero-search-card form > div[data-search-app] {
  display: grid;
  gap: 0.85rem;
}

.hero-search-card__spacer {
  display: none;
}

.button--hero {
  min-height: 4rem;
  width: 100%;
  padding: 1rem 1.75rem;
  border-radius: 1.4rem;
  font-size: 1rem;
  white-space: nowrap;
}

.hero-search-card__footer {
  align-items: center;
}

.hero-search-card__example {
  margin: 0;
}

.hero-reassurance-grid {
  display: grid;
  gap: 0.75rem;
}

.hero-reassurance-card {
  background: rgba(248, 250, 252, 0.85);
}

.theme-dark .hero-reassurance-card {
  background: rgba(2, 6, 23, 0.55);
}

.hero-layout__side {
  display: grid;
  gap: 1rem;
}

.hero-side-card {
  box-shadow: none;
}

.hero-side-card__image {
  display: block;
}

.hero-side-card__list {
  list-style: none;
  margin: 1rem 0 0;
  padding: 0;
}

.hero-side-card__list li {
  align-items: flex-start;
}

.hero-side-card__footer {
  align-items: center;
}

.hero-facts-grid {
  display: grid;
  gap: 1rem;
}

.hero-fact-card p {
  margin: 0;
}

.stats-grid {
  display: grid;
  gap: 1rem;
}

.stat-value,
.price {
  margin: 0 0 0.5rem;
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 800;
  letter-spacing: -0.05em;
}

.pricing-card--featured {
  background: linear-gradient(180deg, rgba(47, 111, 237, 0.12), rgba(255, 255, 255, 0.9));
}

.theme-dark .pricing-card--featured {
  background: linear-gradient(180deg, rgba(96, 165, 250, 0.18), rgba(15, 23, 42, 0.88));
}

@media (min-width: 640px) {
  .hero-panel {
    padding: 1.25rem;
  }

  .hero-reassurance-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .hero-facts-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .stats-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1280px) {
  .hero-layout {
    grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
  }
}

@media (min-width: 1024px) {
  .hero-panel {
    padding: 1.5rem;
  }

  .stats-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  .hero-title--index {
    max-width: 12ch;
    font-size: clamp(2.2rem, 11vw, 3.45rem);
  }

  .hero-panel {
    padding: 1rem;
  }
}
