/* ==========================================================================
   AJUSTES RÁPIDOS — Sualver
   Este fichero se carga DESPUÉS de main.css y manda sobre él.
   Cambia el valor, guarda y recarga la web (Cmd+Shift+R si no ves el cambio).
   Unidades: px = píxeles · ch = "anchura de una letra" (útil para textos).
   ========================================================================== */

:root{
  /* ---- CABECERA ------------------------------------------------------- */
  --logo-h: 54px;          /* altura del logotipo en la cabecera (antes 42px) */
  --logo-h-movil: 40px;    /* altura del logotipo en móvil */
  --nav-h: 80px;           /* altura total de la barra de menú */

  /* ---- TÍTULOS DE TODAS LAS SECCIONES ---------------------------------- */
  --etiqueta-tam: 20px;                      /* etiqueta sobre el título: "POR QUÉ SUALVER", "SECTORES"... (original 11.5px) */
  --etiqueta-tam-movil: 12px;                /* la misma etiqueta en móvil (< 600 px); si no cabe en una línea, bájala */
  --titulo-seccion-tam: clamp(26px, 3.2vw, 44px);  /* título grande de cada sección (mínimo, preferido, máximo) */
  --intro-seccion-tam: 15.5px;               /* párrafo de introducción bajo el título */

  /* ---- "POR QUÉ SUALVER" (frase grande + 6 puntos) --------------------- */
  --frase-ancho: 90ch;                       /* ancho máximo de la frase: más ch = menos líneas */
  --frase-tam: clamp(20px, 1.8vw, 26px);     /* tamaño de letra: mínimo, preferido, máximo */
  --frase-interlineado: 1.35;
  --puntos-sep: 48px;                        /* espacio entre la frase y los 6 puntos */
  --punto-titulo-tam: 16.5px;                /* tamaño del título de cada punto */
  --punto-texto-tam: 14.5px;                 /* tamaño del texto de cada punto */

  /* ---- HERO (portada azul) --------------------------------------------- */
  --hero-parrafo-tam: 17px;                  /* tamaño de los dos párrafos bajo el título */

  /* ---- "TODO LO QUE ENTRA EN UN PROYECTO" (banda azul, 6 columnas) -------- */
  --alcance-titulo-tam: 13px;                /* tamaño de los títulos MECÁNICA, ROBÓTICA... */
  --alcance-item-tam: 15px;                  /* tamaño de cada línea de la lista */
  --alcance-item-sep: 10px;                  /* espacio entre líneas de la lista */
  --alcance-relleno: 28px 22px 30px;         /* espacio interior de cada columna: arriba, lados, abajo */

  /* ---- CITA GRANDE (testimonio destacado, frase de Rosana) --------------- */
  --cita-ancho: 60ch;                        /* ancho máximo de la cita: más ch = menos líneas */
  --cita-tam: clamp(22px, 2.8vw, 34px);      /* tamaño de letra: mínimo, preferido, máximo */

  /* ---- PASE DE FOTOS de "Qué hacemos" ------------------------------------ */
  --pase-segundos: 5;                        /* segundos que se muestra cada foto antes de pasar a la siguiente */
  --pase-fundido: 1s;                        /* duración del fundido entre fotos */

  /* ---- EQUIPO (mosaico de fotos) ---------------------------------------- */
  --mosaico-fila: 210px;                     /* altura de cada fila del mosaico (la foto grande ocupa dos) */
  --mosaico-sep: 12px;                       /* separación entre fotos */

  /* ---- FICHAS DE CASO DE ÉXITO (/proyectos/…) ---------------------------- */
  --ficha-resumen-tam: 17px;                 /* párrafo de resumen bajo el título de la ficha */
  --ficha-cifra-tam: clamp(20px, 2.2vw, 28px); /* tamaño de las cifras destacadas (mínimo, preferido, máximo) */
  --ficha-titulo-tam: 22px;                  /* títulos "El reto", "La solución", "El resultado" */
  --ficha-texto-tam: 15.5px;                 /* texto de los párrafos de la ficha */
  --ficha-texto-ancho: 68ch;                 /* ancho máximo del texto: más ch = líneas más largas */

  /* ---- AYUDAS (lista desplegable) ---------------------------------------- */
  --ayuda-anio-tam: 19px;                    /* tamaño del año */
  --ayuda-titulo-tam: 17px;                  /* tamaño del título de cada ayuda */
  --ayuda-texto-tam: 15.5px;                 /* texto del detalle al desplegar */
  --ayuda-logo-h: 52px;                      /* altura máxima de los logos oficiales (van todos en una línea) */

  /* ---- CINTA DE CLIENTES ------------------------------------------------ */
  --cinta-logo-h: 32px;                      /* altura de los logos dentro de su caja */
  --cinta-velocidad: 60s;                    /* segundos por vuelta completa: más = más lento */
  --cinta-sep: 14px;                         /* separación entre cajas de logos */
}

/* Si quieres que la frase vaya alineada a la izquierda en vez de centrada,
   quita las dos barras de la línea siguiente: */
/* .statement{text-align:left;margin-left:0} */