/* ==================================================
   CARD C COMPONENT - "CRM qui surveillent, KPI qui comptent, progression oubliée"
   ================================================== */

/* ==================== DESKTOP STYLES ==================== */

/* Fine-tune Card C position and spacing */
#the-problem-container .card-c .lg-card {
  padding-left: 2rem; /* move content more to the left */
}

#the-problem-container .card-c-headline {
  gap: 1.25rem; /* slightly tighter spacing between image and text */
  margin-left: -2rem; /* shift headline content more to the left */
}

/* Move just the image container to the left for Card C */
#the-problem-container .card-c-headline .image-container {
  margin-left: -2rem; /* shift image more to the left */
}

/* Shift text container to the left for more space */
#the-problem-container .card-c-headline .text-container {
  margin-left: -2.7rem; /* shift text container more left for more space */
}

#the-problem-container .card-c-headline .plante-image {
  width: 13rem;
  height: 13rem;
  object-fit: contain;
}

/* ==================== NEUTRAL STYLING ==================== */

/* Reinstate frosted backdrop for Card C (neutral style) */
#the-problem-container .card-c .lg-card__backdrop {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  z-index: 0;
  background: rgba(0, 0, 0, 0.04);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  background-clip: padding-box;
}

/* Neutral border/shadow for Card C */
#the-problem-container .card-c .lg-card {
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow:
    0 4px 12px rgba(0, 0, 0, 0.02),
    inset 0 1px 2px rgba(100, 180, 255, 0.04),
    inset 0 -1px 2px rgba(0, 0, 0, 0.01);
}

/* Hide inner ring/glow elements for Card C (neutral style) */
#the-problem-container .card-c .lg-card .lg-card__ring,
#the-problem-container .card-c .lg-card .lg-card__innerband,
#the-problem-container .card-c .lg-card .lg-card__innerfeather {
  display: none !important;
}

/* Disable pulsating animation for Card C */
#the-problem-container .card-c .lg-card.pulsating-illumination {
  animation: none !important;
}

#the-problem-container .card-c .lg-card.pulsating-illumination::after {
  animation: none !important;
  opacity: 0 !important;
}

/* ==================== MOBILE STYLES ==================== */

@media (max-width: 768px) {
  /* Optimized mobile image sizes for better text space */
  #the-problem-container .card-c-headline .plante-image {
    width: 6rem;
    height: 6rem;
  }
  
  /* Special handling for Card C - center content and reduce height */
  #the-problem-container .card-c .lg-card {
    min-height: 200px; /* Reduced height for card C */
    padding: 2rem !important; /* Reset desktop overrides */
    padding-left: 2rem !important;
  }
  
  #the-problem-container .card-c-headline {
    align-items: center;
    justify-content: center;
    text-align: center;
    margin-left: 0 !important; /* Reset desktop margin-left */
    gap: 1.5rem !important; /* Reset desktop gap */
  }
  
  #the-problem-container .card-c-headline .image-container,
  #the-problem-container .card-c-headline .text-container {
    margin-left: 0 !important; /* Reset desktop margins */
  }
  
  #the-problem-container .card-c-headline .text-container h3 span {
    white-space: normal !important; /* Allow wrapping for better readability */
  }
}