/* assets/css/responsive.css - Stiluri suplimentare pentru responsive design (Actualizat) */

/* Fonturi default sunt ok din style.css, ajustăm doar unde e necesar */

/* Tablete mari și Desktopuri mici */
@media (max-width: 1200px) {
  /* Poate nu sunt necesare ajustări specifice aici dacă layout-ul e fluid */
  nav {
      padding: 0 1rem; /* Reducem padding nav */
  }
}

/* Tablete */
@media (max-width: 992px) {
  :root {
    --section-spacing: 4rem; /* Reducem spațierea între secțiuni */
  }

  h1 { font-size: clamp(2rem, 5vw, 2.8rem); }
  h2 { font-size: clamp(1.6rem, 4vw, 2.2rem); }
  h3 { font-size: clamp(1.2rem, 3vw, 1.5rem); }

  /* Meniu Mobil */
  .burger {
    display: block; /* Afișăm burgerul */
  }

  nav ul {
    position: fixed;
    top: 0;
    right: -100%; /* Inițial ascuns */
    width: 80%; /* Lățime meniu */
    max-width: 320px; /* Lățime maximă */
    height: 100vh;
    background: var(--white); /* Fundal alb solid */
    flex-direction: column;
    align-items: stretch; /* Linkuri pe toată lățimea */
    gap: 0;
    padding: 6rem 0 2rem; /* Padding sus/jos */
    transition: right 0.4s ease; /* Animație slide */
    box-shadow: -5px 0 30px rgba(var(--primary-rgb), 0.15);
    z-index: 1005; /* Sub header/logo/burger */
    overflow-y: auto; /* Scroll dacă e necesar */
  }

  nav ul.open {
    right: 0; /* Afișăm meniul */
  }

  nav ul li {
    width: 100%;
    border-bottom: 1px solid var(--border-light); /* Separator între linkuri */
  }
  nav ul li:last-child {
     border-bottom: none;
  }

  nav ul li a {
    display: block;
    padding: 1rem 1.5rem; /* Padding linkuri meniu mobil */
    border-radius: 0;
    font-size: 1.05rem; /* Mărime font meniu mobil */
    color: var(--primary); /* Culoare text meniu mobil */
    font-weight: 500;
  }
  nav ul li a.active {
     background-color: rgba(var(--accent-rgb), 0.1); /* Fundal ușor accentuat pt activ */
     color: var(--accent);
     font-weight: 600;
  }
  nav ul li a:hover {
     background-color: rgba(var(--primary-rgb), 0.05);
  }

  nav ul li a::after { /* Ascundem linia de sub link în meniul mobil */
    display: none;
  }

  /* Ajustări layout general */
  .container {
    padding: 0 1rem; /* Padding container redus */
  }

  main {
    padding-top: 80px; /* Header puțin mai mic? Sau păstrăm 90px? Presupunem 90px */
  }
  header {
     min-height: 80px; /* Header mai mic pe tabletă */
     height: 80px;
  }
  .brand-logo {
    max-width: 160px !important;
    max-height: 40px !important;
  }

  .hero {
    min-height: 550px; /* Hero mai mic */
  }

  .grid {
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); /* Ajustare grid carduri */
    gap: 1.5rem;
  }

  .approach-container {
     grid-template-columns: 1fr; /* Forțăm o coloană */
  }
  .approach-steps {
     grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); /* Carduri proces una lângă alta */
  }

  .team-members {
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  }

  .footer-columns {
      grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); /* Coloane footer */
      gap: 2rem;
  }
}

/* Telefoane Mobile Mari */
@media (max-width: 767px) {
  body {
      font-size: 0.95rem; /* Reducem fontul de bază pe mobil */
  }
  p { font-size: 1rem; } /* Paragrafe puțin mai mari relativ la bază */

  :root {
    --section-spacing: 3rem;
  }

  h1 { font-size: clamp(1.8rem, 6vw, 2.4rem); }
  h2 { font-size: clamp(1.5rem, 5vw, 2rem); }
  h3 { font-size: clamp(1.1rem, 4vw, 1.4rem); }

  /* Header & Hero */
  header {
     min-height: 70px;
     height: 70px;
  }
  main { padding-top: 70px; }
  .brand-logo {
    max-width: 140px !important;
    max-height: 36px !important;
  }

  .hero {
    min-height: 450px;
    padding-top: 70px; /* Ajustare padding top hero */
  }
  .hero-content { padding: 0 1rem; } /* Padding conținut hero */
  .hero .hero-cta {
     padding: 0.8em 2em;
     font-size: 0.95rem;
  }

  /* Carduri & Grids */
  .grid,
  .avantaje ul,
  .team-members,
  .approach-steps,
  .footer-columns {
    grid-template-columns: 1fr; /* Forțăm o singură coloană */
    gap: 1.5rem; /* Gap standard */
  }
  .avantaje li {
     max-width: none; /* Lățime maximă pe toată coloana */
     min-width: 0;
  }
  .card {
     padding: 1.5rem 1rem; /* Padding carduri */
  }

  /* Formular */
  form {
     padding: 2rem 1rem; /* Padding formular */
  }
  form label { margin-bottom: 1rem; }
  form input[type="text"],
  form input[type="email"],
  form input[type="tel"],
  form textarea { padding: 0.8rem; }
  form button.cta { padding: 0.9rem; font-size: 0.95rem; }

  /* Footer */
  footer { padding: 3rem 1rem 1.5rem; }
  .footer-column { min-width: 0; } /* Eliminăm min-width */
  .footer-logos { gap: 1.5rem; }
  .footer-logo { height: 30px; }
  .footer-copyright { font-size: 0.8rem; }

  /* Page Hero pagini interioare */
  .page-hero {
     height: 25vh;
     min-height: 180px;
     margin-bottom: 2rem;
  }

  /* Chatbot - repoziționare/ajustare mărime dacă e necesar */
  .chatbot-container {
     right: 10px;
     bottom: 10px;
  }
  .chatbot-toggle {
     padding: 8px 14px;
  }
  .chatbot-toggle span { display: none; } /* Ascundem textul pe mobil */
  .chatbot-icon { margin-right: 0; }

  .chatbot-box {
     width: calc(100vw - 20px); /* Lățime aproape completă */
     max-width: 320px;
     height: 70vh; /* Înălțime mai mare */
     max-height: 400px;
     bottom: 60px; /* Spațiu de la buton */
     right: 0; /* Aliniat la margine */
  }

}

/* Telefoane Mobile Mici */
@media (max-width: 480px) {
  body {
     line-height: 1.4; /* Reducem puțin line-height */
  }
  h1 { font-size: 1.6rem; }
  h2 { font-size: 1.4rem; }
  h3 { font-size: 1.1rem; }

  header {
      min-height: 60px;
      height: 60px;
  }
  main { padding-top: 60px; }
  .brand-logo {
    max-width: 120px !important;
    max-height: 32px !important;
  }

  .hero { min-height: 400px; }
  .hero p { font-size: 0.9rem; margin-bottom: 1.5rem; }
  .hero .hero-cta { font-size: 0.9rem; padding: 0.7em 1.8em; }

  .cta { /* Butoane generale */
      font-size: 0.9rem;
      padding: 0.7em 1.5em;
  }

  .card { padding: 1rem; }
  .card h3 { font-size: 1.1rem; }
  .card p { font-size: 0.9rem; }

  .scroll-indicator { bottom: 20px; } /* Indicator scroll mai jos */
  .scroll-arrow { width: 20px; height: 20px; }
  .scroll-text { font-size: 0.75rem; }

  .footer-logos { gap: 1rem; }
  .footer-logo { height: 25px; }
}