/* Martín-Lomeña & Associates — estilos compartidos
   Recreación 1:1 del handoff de diseño. El grueso del estilo va inline
   en cada página (es la especificación exacta); aquí solo van las reglas
   que un atributo style inline no puede expresar: base del documento,
   estados :hover y el umbral responsive del menú (780px). */

body { margin:0; background:#faf8f4; color:#211e1a; font-family:'Archivo',sans-serif; }
a { color:#567d68; text-decoration:none; }
a:hover { color:#3e5c4c; }
input, textarea, select { font-family:'Archivo',sans-serif; }

/* --- Navegación: escritorio vs. móvil (umbral < 780px) --- */
.nav-desktop { display:flex; }
.nav-hamburger { display:none; }
.nav-mobile-menu { display:none; }
.nav-mobile-menu.open { display:flex; }

@media (max-width:779px) {
  .nav-desktop { display:none; }
  .nav-hamburger { display:flex; }
}
@media (min-width:780px) {
  /* En escritorio el menú desplegable nunca se muestra, aunque quede abierto */
  .nav-mobile-menu, .nav-mobile-menu.open { display:none; }
}

/* --- Rejillas de tarjetas ---
   Columnas fijas que SIEMPRE llenan la fila, para que nunca queden celdas
   grises vacías (el problema del recuadro gris en pantallas anchas).
   grid-3 = filas de 3 elementos · grid-6 = bloques de 6 (3 columnas). */
.grid-3, .grid-6 { grid-template-columns: 1fr; }              /* móvil: 1 columna */
@media (min-width:640px) { .grid-6 { grid-template-columns: repeat(2, 1fr); } }
@media (min-width:920px) { .grid-3, .grid-6 { grid-template-columns: repeat(3, 1fr); } }

/* --- Hovers (equivalentes a los style-hover del prototipo) --- */
.nav-hamburger:hover { background:#e3eee6; }
.arrow-light:hover { background:#e3eee6; }
.arrow-dark:hover { background:#2d362f; }
.btn-send:hover { background:#3e5c4c; }
