/* CARD ALIGNMENT OVERRIDE - Simple and Clean Solution */

/* Reset and force equal heights for all card sections */
.home-intro .cards.cards-4,
.kpis,
#ops .grid-3,
.cards.cards-3 {
  display: grid;
  align-items: stretch;
}

/* Set exact heights for each card type */
.home-intro .cards.cards-4 {
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: 100px;
  gap: 16px;
}

.kpis {
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: 90px;
  gap: 12px;
}

#ops .grid-3 {
  grid-template-columns: repeat(3, 1fr);
  grid-auto-rows: 160px;
  gap: 24px;
}

.cards.cards-3 {
  grid-template-columns: repeat(3, 1fr);
  grid-auto-rows: 220px;
  gap: 24px;
}

/* Force all cards to fill their grid cell */
.home-intro .cards.cards-4 .card,
.kpis .kpi,
#ops .card,
.cards.cards-3 .card {
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}

/* Content alignment within cards */
.home-intro .cards.cards-4 .card {
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: 8px;
}

.kpis .kpi {
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: 8px;
}

#ops .card {
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: 1rem;
}

.cards.cards-3 .card {
  justify-content: flex-start;
  align-items: stretch;
  padding: 1.5rem;
}

.cards.cards-3 .card h3 {
  margin: 0 0 1rem;
  text-align: center;
  flex-shrink: 0;
}

.cards.cards-3 .card ul {
  flex: 1;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.cards.cards-3 .card ul li {
  margin: 0.4rem 0;
  line-height: 1.4;
}

/* AGGRESSIVE CARD ALIGNMENT FIX - OVERRIDE ALL ANIMATIONS AND POSITIONING */

/* Disable transforms/animations that could affect card positioning */
.home-intro .cards.cards-4 *,
.kpis *,
#ops .grid-3 *,
.cards.cards-3 * {
  transform: none;
  animation: none;
  transition: none;
  position: relative !important;
  top: 0 !important;
  left: 0 !important;
  right: auto;
  bottom: auto;
  margin-top: 0;
  margin-bottom: 0;
}

/* Force exact positioning and dimensions for all card containers */
.home-intro .cards.cards-4,
.kpis,
#ops .grid-3,
.cards.cards-3 {
  display: grid !important;
  align-items: stretch !important;
  position: relative !important;
  z-index: 10 !important;
  isolation: isolate !important;
}

/* Set exact grid layouts with forced heights */
.home-intro .cards.cards-4 {
  grid-template-columns: repeat(4, 1fr) !important;
  grid-template-rows: minmax(100px, auto) !important;
  gap: 16px !important;
  min-height: 100px;
  align-content: start !important;
}

.kpis {
  grid-template-columns: repeat(4, 1fr) !important;
  grid-template-rows: minmax(90px, auto) !important;
  gap: 12px !important;
  min-height: 90px;
  align-content: start !important;
}

#ops .grid-3 {
  grid-template-columns: repeat(3, 1fr) !important;
  grid-template-rows: minmax(160px, auto) !important;
  gap: 24px !important;
  min-height: 160px;
  align-content: start !important;
}

.cards.cards-3 {
  grid-template-columns: repeat(3, 1fr) !important;
  grid-template-rows: minmax(220px, auto) !important;
  gap: 24px !important;
  min-height: 220px;
  align-content: start !important;
}

/* Force exact card dimensions and positioning */
.home-intro .cards.cards-4 .card,
.kpis .kpi,
#ops .card,
.cards.cards-3 .card {
  height: 100% !important;
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  box-sizing: border-box !important;
  position: relative !important;
  top: 0 !important;
  left: 0 !important;
  transform: none !important;
  animation: none !important;
  transition: none !important;
  margin: 0 !important;
  float: none !important;
  clear: none !important;
  vertical-align: top !important;
}

/* Disable hover effects that might cause positioning issues */
.home-intro .cards.cards-4 .card:hover,
.kpis .kpi:hover,
#ops .card:hover,
.cards.cards-3 .card:hover {
  transform: none !important;
  animation: none !important;
  transition: none !important;
}

/* Force content alignment within cards */
.home-intro .cards.cards-4 .card {
  justify-content: center !important;
  align-items: center !important;
  text-align: center !important;
  padding: 8px !important;
}

.kpis .kpi {
  justify-content: center !important;
  align-items: center !important;
  text-align: center !important;
  padding: 8px !important;
}

#ops .card {
  justify-content: center !important;
  align-items: center !important;
  text-align: center !important;
  padding: 1rem !important;
}

.cards.cards-3 .card {
  justify-content: flex-start !important;
  align-items: stretch !important;
  text-align: left !important;
  padding: 1.5rem !important;
}

/* Ensure text content doesn't break alignment */
.home-intro .cards.cards-4 .card h3,
.home-intro .cards.cards-4 .card p,
.kpis .kpi .value,
.kpis .kpi .label,
#ops .card h3,
#ops .card p,
.cards.cards-3 .card h3,
.cards.cards-3 .card ul,
.cards.cards-3 .card ul li {
  position: static !important;
  transform: none !important;
  animation: none !important;
  transition: none !important;
  float: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Override any background canvas positioning that might interfere */
.bg-canvas {
  z-index: -10 !important;
  pointer-events: none !important;
}

/* Ensure sections don't have conflicting positioning */
.section {
  position: relative !important;
  z-index: 1 !important;
}

/* Force container alignment */
.container {
  position: relative !important;
  z-index: 2 !important;
}

/* Disable any CSS Grid auto-placement that might cause issues */
.home-intro .cards.cards-4 .card:nth-child(1) {
  grid-column: 1;
  grid-row: 1;
}

.home-intro .cards.cards-4 .card:nth-child(2) {
  grid-column: 2;
  grid-row: 1;
}

.home-intro .cards.cards-4 .card:nth-child(3) {
  grid-column: 3;
  grid-row: 1;
}

.home-intro .cards.cards-4 .card:nth-child(4) {
  grid-column: 4;
  grid-row: 1;
}

.kpis .kpi:nth-child(1) {
  grid-column: 1;
  grid-row: 1;
}

.kpis .kpi:nth-child(2) {
  grid-column: 2;
  grid-row: 1;
}

.kpis .kpi:nth-child(3) {
  grid-column: 3;
  grid-row: 1;
}

.kpis .kpi:nth-child(4) {
  grid-column: 4;
  grid-row: 1;
}

#ops .card:nth-child(1) {
  grid-column: 1;
  grid-row: 1;
}

#ops .card:nth-child(2) {
  grid-column: 2;
  grid-row: 1;
}

#ops .card:nth-child(3) {
  grid-column: 3;
  grid-row: 1;
}

.cards.cards-3 .card:nth-child(1) {
  grid-column: 1;
  grid-row: 1;
}

.cards.cards-3 .card:nth-child(2) {
  grid-column: 2;
  grid-row: 1;
}

.cards.cards-3 .card:nth-child(3) {
  grid-column: 3;
  grid-row: 1;
}

/* Responsive overrides with explicit positioning */
@media (max-width: 900px) {
  .home-intro .cards.cards-4 {
    grid-template-columns: repeat(2, 1fr) !important;
    grid-template-rows: repeat(2, 100px) !important;
    height: 220px !important;
  }

  .kpis {
    grid-template-columns: repeat(2, 1fr) !important;
    grid-template-rows: repeat(2, 90px) !important;
    height: 200px !important;
  }

  .cards.cards-3,
  #ops .grid-3 {
    grid-template-columns: 1fr !important;
    grid-template-rows: repeat(3, 220px) !important;
    height: auto !important;
  }

  /* Mobile grid positioning */
  .home-intro .cards.cards-4 .card:nth-child(1) {
    grid-column: 1;
    grid-row: 1;
  }

  .home-intro .cards.cards-4 .card:nth-child(2) {
    grid-column: 2;
    grid-row: 1;
  }

  .home-intro .cards.cards-4 .card:nth-child(3) {
    grid-column: 1;
    grid-row: 2;
  }

  .home-intro .cards.cards-4 .card:nth-child(4) {
    grid-column: 2;
    grid-row: 2;
  }

  .home-intro .cards.cards-4,
  .kpis,
  #ops .grid-3,
  .cards.cards-3 {
    height: auto !important;
    grid-template-rows: initial !important;
    grid-auto-rows: initial !important;
    align-content: stretch !important;
  }

  .home-intro .cards.cards-4 .card,
  .kpis .kpi,
  #ops .card,
  .cards.cards-3 .card {
    height: auto !important;
  }
}

@media (max-width: 640px) {
  .home-intro .cards.cards-4 {
    grid-template-columns: 1fr !important;
    grid-template-rows: repeat(4, 100px) !important;
    height: 420px !important;
  }

  .kpis {
    grid-template-columns: 1fr !important;
    grid-template-rows: repeat(4, 90px) !important;
    height: 380px !important;
  }

  /* Single column positioning */
  .home-intro .cards.cards-4 .card:nth-child(1) {
    grid-column: 1;
    grid-row: 1;
  }

  .home-intro .cards.cards-4 .card:nth-child(2) {
    grid-column: 1;
    grid-row: 2;
  }

  .home-intro .cards.cards-4 .card:nth-child(3) {
    grid-column: 1;
    grid-row: 3;
  }

  .home-intro .cards.cards-4 .card:nth-child(4) {
    grid-column: 1;
    grid-row: 4;
  }

  /* Ensure single-column stacks are fluid */
  .home-intro .cards.cards-4,
  .kpis {
    grid-template-rows: none !important;
  }
}