/* ULTRA AGGRESSIVE GRID FORCING FOR HERO SECTION */

/* Kill any flex on the grid container */
.hero-section .container > div {
  display: grid !important;
  flex-direction: unset !important;
  flex-wrap: unset !important;
}

/* Force 2-column grid with exact proportions */
.hero-section .container > div[class*="grid"] {
  display: grid !important;
  grid-template-columns: 66.666% 33.333% !important;
  grid-template-rows: auto !important;
  gap: 2rem !important;
  width: 100% !important;
  max-width: 100% !important;
}

/* Force stacked cards to display vertically */
.hero-section .space-y-6 {
  display: flex !important;
  flex-direction: column !important;
  gap: 1.5rem !important;
}

.hero-section .space-y-6 > * {
  margin-top: 0 !important;
  width: 100% !important;
}

.hero-section .space-y-6 > * + * {
  margin-top: 0 !important;
}

/* Ensure stacked cards don't go inline */
.hero-section .space-y-6 .hero-stacked-card {
  display: flex !important;
  flex-direction: row !important;
  width: 100% !important;
  margin-bottom: 1.5rem !important;
}

.hero-section .space-y-6 .hero-stacked-card:last-child {
  margin-bottom: 0 !important;
}

/* Mobile responsive */
@media (max-width: 767px) {
  .hero-section .container > div[class*="grid"] {
    grid-template-columns: 1fr !important;
  }
}