.info-boxes-section {
  background-color: var(--color-light-blue-grey);
  padding: 80px 0;
}
.info-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
}
.info-box {
  background-color: var(--color-white);
  padding: 30px;
  border-radius: var(--border-radius-soft);
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
  text-align: center;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.info-box:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
}

/* ================================================= */
/*          STILURI ACTUALIZATE PENTRU TITLURI       */
/* ================================================= */

.info-box i {
    font-size: 4em; /* Iconiță puțin mai mare */
    margin-bottom: 25px; /* Spațiu mai mare sub iconiță */
    color: var(--color-white); /* Asigurăm că și iconița este albă */
    text-shadow: 2px 2px 10px rgba(0, 0, 0, 0.3); /* Umbră mai pronunțată */
}

.info-box h3 {
    /* 1. Culoare contrastantă */
    color: var(--color-white);
    
    /* 2. Dimensiune și grosime mărite */
    font-size: 2em;
    font-weight: 800;
    
    /* 3. Umbră pentru lizibilitate */
    text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.4);
    
    margin-bottom: 15px; /* Spațiu mai mare sub titlu */
    line-height: 1.3;
}

.info-box a {
  text-decoration: none;
  color: var(--text-dark);
}


/* ================================================= */
/*          STILURI NOI PENTRU CARDURI INFORMATIVE   */
/* ================================================= */
.info-boxes-section {
    padding: 80px 0;
    /* Un fundal subtil pentru a se diferenția */
    background-color: #f9fafb; 
}

.info-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.info-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 40px 30px;
    border-radius: var(--border-radius-large);
    text-decoration: none;
    color: var(--color-white);
    position: relative;
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.info-box:hover {
    transform: translateY(-8px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.15);
}

.info-box i {
    font-size: 3.5em;
    margin-bottom: 20px;
    text-shadow: 2px 2px 10px rgba(0,0,0,0.2);
}
.info-box h3 {
    font-size: 1.8em;
    font-weight: 700;
    margin-bottom: 10px;
}
.info-box p {
    font-size: 1em;
    opacity: 0.9;
}

/* Stiluri individuale pentru fiecare card */
.info-box-faq {
    background: linear-gradient(45deg, var(--color-deep-teal), #2c5364);
}
.info-box-comunitate {
    /* Un gradient de la un teal vibrant la unul mai profund */
    background: linear-gradient(45deg, var(--color-teal-vibrant), #00796b); 
}

/* Cardul "Raportează un Abuz" va fi acum CORAL RED */
.info-box-raporteaza {
    /* Un gradient de la roșu-coral la un portocaliu-roșcat, pentru un sentiment de alertă */
    background: linear-gradient(45deg, var(--color-coral-red), #e64a19);
}