@charset "UTF-8";
 @media (max-width: 992px) {
        .about-us-grid,
        .info-grid,
        .news-grid {
          grid-template-columns: 1fr;
        }
      }
      @media (max-width: 768px) {
        .hero-wrapper {
          margin: 20px 15px;
        }
        .hero-section {
          flex-direction: column;
        }
        .hero-left {
          min-height: 50vh;
        }
        .hero-right {
          padding: 40px 30px;
        }
        .form-row {
          grid-template-columns: 1fr;
          gap: 25px;
        }
        .navbar-menu {
          display: none;
          position: absolute;
          top: 75px;
          left: 0;
          width: 100%;
          background-color: var(--color-deep-teal);
          flex-direction: column;
          gap: 0;
          text-align: center;
        }
        .navbar-menu.mobile-open {
          display: flex;
        }
        

        .navbar-menu li {
          width: 100%;
        }
        .navbar-menu li a {
          display: block;
          padding: 20px;
          border-bottom: 1px solid rgba(255, 255, 255, 0.1);
        }
        .btn-donate {
          border-radius: 0;
        }
        .hamburger-menu {
          display: block;
        }
        .hero-text h1 {
          font-size: 2.2em;
        }
      }
      
      
      @media (max-width: 768px) {
  /*
   * STIL NOU PENTRU BULINA PE MOBIL
  */
  .faq-answer ul.creative-red-bullets > li::before {
    content: '▶';
    color: white;
    background: var(--color-blood-red);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    border-radius: 999px; /* Asigură forma de cerc perfect */

    /* --- AICI CONTROLEZI DIMENSIUNILE --- */
    width: 2rem;  /* Dimensiunea cercului (lățime) */
    height: 2rem; /* Dimensiunea cercului (înălțime) */
    font-size: 1.1rem; /* Dimensiunea săgeții din interior */
    
    /* Reintroducem Flexbox pentru o centrare perfectă */
    display: flex;
    justify-content: center;
    align-items: center;

    /* Asigurăm poziționarea corectă la începutul liniei */
    position: absolute;
    left: 0;
    top: 0;
  }

  /*
   * Ajustăm spațiul din stânga pentru a se potrivi cu noua bulină
  */
  .faq-answer ul.creative-red-bullets > li {
    padding-left: 3rem; /* Spațiu = lățimea bulinei (2rem) + 1rem distanță */
  }
}
      
      /* 4. MEDIA QUERY - Facem galeria responsivă pe mobil */

@media (max-width: 768px) {
    .gallery-grid {
        grid-template-columns: 1fr; /* O singură coloană pe mobil */
    }
}
    
    @media (max-width: 768px) {
  /*
   * Facem regula la fel de specifică precum cea de pe desktop,
   * pentru a ne asigura că este aplicată corect.
   * Acum va suprascrie ambele secțiuni.
  */
  .about-us-grid,
  .impact-section .about-us-grid {
    grid-template-columns: 1fr; /* Forțează o singură coloană */
    gap: 40px; /* Spațiu vertical între elemente */
    padding-right: 0; /* Eliminăm spațierea extra de la video */
  }

  /*
   * Regulile pentru reordonare rămân la fel, ele funcționează corect.
  */
  .about-us-section .about-us-content {
    order: 1; /* Textul apare primul */
  }

  .about-us-section .about-us-image {
    order: 2; /* Poza apare a doua */
  }
}

/* =================================================================== */
/*        AJUSTARE TITLURI PE MOBIL (SPATIERE SI FONT)                 */
/* =================================================================== */

@media (max-width: 768px) {
  .about-us-content h2 {
    /* Micșorăm puțin fontul pentru a arăta mai bine pe mobil */
    font-size: 2.2em; 
    
    /* Aici este cheia: reducem spațierea dintre rânduri */
    line-height: 1.2; 
  }
  
  .container h1 {
      line-height: 1.2; 
  }
}


@media (max-width: 768px) {
    
    /* Titlul principal al formularului */
    .form-block-with-line h2 {
        font-size: 1.8em; /* Reducem puțin de la 2.2em pentru a încăpea mai bine */
        line-height: 1.3;
    }

    /* Paragrafele de subtitlu */
    .form-block-with-line .subtitle {
        font-size: 1em; /* Mărim puțin pentru lizibilitate */
    }

    /* Textul de sub bara de progres */
    .progress-text {
        font-size: 1em;
    }

    /* Placeholder-ul din câmpurile de completat */
    .form-group input::placeholder {
        font-size: 1.3em; /* Reducem puțin pentru a nu fi copleșitor */
    }

    /* Textul de la checkbox-uri - ACESTA ESTE CEL MAI IMPORTANT */
    .checkbox-group label {
        font-size: 0.9em; /* Mărim considerabil de la 0.7em pentru a fi lizibil */
    }

    /* Butonul de submit */
    .btn-submit-petition {
        font-size: 1.3em; /* Reducem puțin pentru a se potrivi cu noul design */
    }
}

/* ================================================= */
/*          AJUSTĂRI PENTRU IMAGINI DIN ARTICOLE (MOBIL) */
/* ================================================= */

@media (max-width: 768px) {
    
    /* MODIFICAT: Acum selectăm și imaginile din galerii */
    .full-width-image img,
    .story-image-wrapper img,
    .code-gallery-item img,
    .mini-gallery-grid img {
        /*
         * Anulează înălțimea fixă și lasă imaginea să se redimensioneze natural
         */
        height: auto !important;

        /*
         * Anulează regula object-fit: cover, care taie imaginea
         */
        object-fit: unset !important;
    }
}