/* Estilos compartidos de las páginas públicas (consultora, programa y términos).
   El diseño de cada sección está en el propio HTML; aquí van solo pestañas, foco y ajustes para celular. */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
img, svg { max-width: 100%; }
[hidden] { display: none !important; }

.tab { font: inherit; cursor: pointer; border-radius: 999px; padding: 12px 20px; font-size: 15px; font-weight: 600; min-height: 44px; transition: background-color .15s, color .15s, border-color .15s; }
.tab-mod { border: 1px solid #cbd5e1; background: #FFFFFF; color: #0f172a; }
.tab-mod[aria-pressed="true"] { border-color: #0b1220; background: #0b1220; color: #FFFFFF; font-weight: 700; }
.tab-ia { border: 1px solid #475569; background: transparent; color: #FFFFFF; }
.tab-ia[aria-pressed="true"] { border-color: #2dd4bf; background: #2dd4bf; color: #0b1220; font-weight: 700; }
.tab-area { border: 1px solid #cbd5e1; background: #FFFFFF; color: #0f172a; }
.tab-area[aria-pressed="true"] { border-color: #054537; background: #054537; color: #FFFFFF; font-weight: 700; }
.tab:focus-visible { outline: 2px solid #2dd4bf; outline-offset: 2px; }

/* Celular: títulos más pequeños y menos aire */
@media (max-width: 700px) {
  h1 { font-size: 38px !important; letter-spacing: -1px !important; }
  h2 { font-size: 30px !important; }
  section > div[style*="padding: 96px"], section[style*="padding: 96px"] { padding-top: 64px !important; padding-bottom: 64px !important; }
  header nav { gap: 14px !important; font-size: 14px !important; }
}