/*
Theme Name: Coaí
Template: generatepress
Description: Tema hijo de GeneratePress para coaipr.org. Los colores y la tipografía se ajustan en Personalizar › GeneratePress; las secciones se editan con GenerateBlocks.
Author: Jomar Cruz
Version: 1.0.0
Text Domain: coai
*/

html { scroll-behavior: smooth; }
body { overflow-x: hidden; }
[id] { scroll-margin-top: 24px; }
:focus-visible { outline: 3px solid var(--naranja); outline-offset: 3px; }

/* Menú móvil: panel que entra desde la derecha y empuja la página (lo arma menu-movil.js con los enlaces del encabezado) */
:root { --coai-panel: min(320px, 85vw); }
#page { transition: transform .35s ease; }
.coai-panel { position: fixed; top: 0; right: 0; bottom: 0; z-index: 1000; width: var(--coai-panel); background: var(--morado); color: var(--blanco); padding: 0 24px 32px; display: flex; flex-direction: column; overflow-y: auto; transform: translateX(100%); transition: transform .35s ease; }
.coai-panel-cerrar, .coai-panel-cerrar:hover, .coai-panel-cerrar:focus { align-self: flex-end; margin-top: 29px; background: none; border: 0; color: var(--blanco); padding: 0; cursor: pointer; }
.coai-panel-cerrar svg { width: 30px; height: 30px; display: block; }
.coai-panel nav { display: flex; flex-direction: column; margin-top: 32px; }
.coai-panel nav a { color: var(--blanco); text-decoration: none; font-size: 20px; line-height: 1.3; font-weight: 500; padding: 14px 0; margin: 0; width: auto; height: auto; }
.coai-panel nav a.coai-panel-boton { width: 100%; height: 54px; border-radius: 27px; margin-top: 24px; padding: 0; font-size: 17px; font-weight: 700; }
.coai-panel-fondo { position: fixed; inset: 0; z-index: 999; background: rgba(0,0,0,.4); opacity: 0; visibility: hidden; transition: opacity .35s ease, visibility .35s ease; }
.coai-menu-abierto, .coai-menu-abierto body { overflow: hidden; }
.coai-menu-abierto #page { transform: translateX(calc(var(--coai-panel) * -1)); }
.coai-menu-abierto .coai-panel { transform: translateX(0); }
.coai-menu-abierto .coai-panel-fondo { opacity: 1; visibility: visible; }
@media (prefers-reduced-motion: reduce) { #page, .coai-panel, .coai-panel-fondo { transition: none; } }
