/* Común a las dos páginas (Fumigación CDE y AEGIS) y al blog. Los estilos de
   cada diseño están en cde.css / aegis.css. */

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
img, svg, video { max-width: 100%; }
.icono { flex: 0 0 auto; display: inline-block; vertical-align: middle; }

/* Header fijo en las dos páginas (pedido explícito). --alto-header lo mide
   comun.js; el valor de respaldo es el alto del diseño. */
:root { --alto-header: 75px; }
.sitio-aegis { --alto-header: 67px; }
html { scroll-padding-top: calc(var(--alto-header) + 12px); }
body.sitio-cde, body.sitio-aegis { padding-top: var(--alto-header); }
header.sitio-header { position: fixed; top: 0; left: 0; right: 0; z-index: 40; }
.menu-movil { max-height: calc(100dvh - var(--alto-header)); overflow-y: auto; overscroll-behavior: contain; }
[data-menu-toggle] .icono-cerrar { display: none; }
[data-menu-toggle][aria-expanded="true"] .icono-abrir { display: none; }
[data-menu-toggle][aria-expanded="true"] .icono-cerrar { display: inline-block; }

/* Accesibilidad */
.saltar-al-contenido { position: absolute; left: -9999px; top: 8px; z-index: 100; padding: 12px 18px; border-radius: 999px; background: #0B5FD4; color: #fff; font: 700 14px Montserrat, sans-serif; }
.saltar-al-contenido:focus { left: 12px; }
.solo-lectores { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
a:focus-visible, button:focus-visible, summary:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 2px solid #5A9BF5; outline-offset: 3px;
}
.sitio-aegis a:focus-visible, .sitio-aegis button:focus-visible, .sitio-aegis summary:focus-visible,
.sitio-aegis input:focus-visible, .sitio-aegis select:focus-visible, .sitio-aegis textarea:focus-visible { outline-color: #D4AF37; }
.lista-limpia { list-style: none; margin: 0; padding: 0; }
.enlace-heredado { color: inherit; }
.enlace-heredado:hover { color: inherit; text-decoration: underline; }

/* Dos botones uno al lado del otro: en celular van uno abajo del otro, del
   mismo ancho y centrados (pedido explícito). */
@media (max-width: 640px) {
  .botonera { flex-direction: column; align-items: center; align-self: stretch; width: 100%; }
  .botonera > a, .botonera > button { width: 100%; max-width: 360px; justify-content: center; text-align: center; }
}

/* Entrada de secciones: solo con JS (sin JS todo se ve igual). */
.js [data-reveal] { opacity: 0; transform: translateY(22px); transition: opacity .7s cubic-bezier(.22, .8, .2, 1), transform .7s cubic-bezier(.22, .8, .2, 1); }
.js [data-reveal].es-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .js [data-reveal] { opacity: 1; transform: none; transition: none; }
}

/* Tarjetas enteras clickeables (el link real es el título). */
.enlace-tarjeta { color: inherit; }
.enlace-tarjeta::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.enlace-tarjeta:focus-visible { outline: none; }
.enlace-tarjeta:focus-visible::after { outline: 2px solid #5A9BF5; outline-offset: 2px; }

/* Preguntas frecuentes con <details> (funcionan sin JS y Google las lee) */
details.faq > summary { list-style: none; }
details.faq > summary::-webkit-details-marker { display: none; }
details.faq .faq-icono { transition: transform .25s ease; }
details.faq[open] .faq-icono { transform: rotate(45deg); }

/* Formularios */
.campo-trampa { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.turnstile-slot { display: flex; justify-content: center; min-height: 65px; }  /* alto del widget: sin salto al cargar */
.formulario-error { margin: 0; padding: 11px 14px; border-radius: 12px; background: #FEF3F2; border: 1px solid #FECDCA; color: #B42318; font: 600 13px/1.5 Montserrat, sans-serif; }
.sitio-aegis .formulario-error { background: rgba(180, 35, 24, .14); border-color: rgba(245, 166, 158, .35); color: #F5B1A9; }
.formulario-ayuda { margin: -4px 0 0; font: 500 12px/1.5 Montserrat, sans-serif; color: #5A7296; }
.sitio-aegis .formulario-ayuda { color: #8F8F8F; font-weight: 300; }
[data-enviar][aria-busy="true"] { opacity: .72; cursor: progress; }
[data-enviar][aria-busy="true"] .icono { animation: spinSlow 1s linear infinite; }
.formulario textarea { resize: vertical; min-height: 110px; font-family: inherit; }
.formulario select { appearance: auto; }
/* Los campos nunca se salen de su columna (un <select> toma el ancho de su opción más larga). */
.formulario label { min-width: 0; }
.formulario input, .formulario select, .formulario textarea { width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; }
.campo-invalido { border-color: #D92D20 !important; }

body.modal-abierto { overflow: hidden; }
.modal { animation: aparecer .18s ease both; }
@keyframes aparecer { from { opacity: 0; } to { opacity: 1; } }
@keyframes spinSlow { to { transform: rotate(360deg); } }

.whatsapp-flotante { bottom: max(16px, env(safe-area-inset-bottom)) !important; }

/* Migas de pan */
.migas { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin: 0 0 18px; font: 600 12px Montserrat, sans-serif; color: #7A90B0; }
.migas a { color: #41577A; }
.migas a:hover { color: #0B5FD4; }

@media print {
  header.sitio-header, .whatsapp-flotante, .modal { display: none !important; }
  body { padding-top: 0; }
  .js [data-reveal] { opacity: 1; transform: none; }
}