/* Séveron IA · páginas sueltas (aviso legal, privacidad, cookies, gracias y 404) con el estilo de la portada:
   cabecera blanca, pie negro y la misma letra y colores. La portada lleva sus estilos dentro de index.html. */

@font-face { font-family: 'Geist'; font-weight: 100 900; font-display: swap; src: url('/fuentes/geist-latin-wght-normal.woff2') format('woff2-variations'); }

:root {
  --negro: #05080D; --tinta: #031121; --gris: #5B6673; --gris-claro: #9AA3AD; --linea: #E6E9ED; --panel: #FBFBFB; --blanco: #FFFFFF;
  --cian: #00E5DF; --verde: #007C78; --naranja: #F97316;
  --titulo: 'Geist', system-ui, sans-serif; --letra: 'Geist', system-ui, sans-serif;
  --ancho: 72rem; --margen: clamp(1rem, 4vw, 2rem);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { margin: 0; background: var(--blanco); color: var(--tinta); font: 400 1.0625rem/1.6 var(--letra); -webkit-font-smoothing: antialiased; }
img, svg { display: block; max-width: 100%; }
a { color: inherit; }
h1, h2, h3, p { margin: 0; }
h1, h2, h3 { font-family: var(--titulo); letter-spacing: -0.03em; line-height: 1.08; text-wrap: balance; font-weight: 600; }
.envoltura { width: min(var(--ancho), 100% - 2 * var(--margen)); margin-inline: auto; }
.saltar { position: absolute; left: -9999px; top: 0; z-index: 100; padding: 0.6rem 1rem; background: var(--tinta); color: #FFFFFF; }
.saltar:focus { left: 0.5rem; top: 0.5rem; }
.etiqueta-sec { font: 600 0.8rem var(--letra); letter-spacing: 0.14em; text-transform: uppercase; color: var(--gris); }

.boton { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; min-height: 2.75rem; padding: 0 1.2rem; border-radius: 10px; font: 600 0.98rem var(--letra); text-decoration: none; border: 1px solid transparent; cursor: pointer; white-space: nowrap; }
.b-negro, .boton-principal { background: var(--negro); color: var(--blanco); }
.b-blanco { background: var(--blanco); color: var(--negro); }
.boton-secundario { background: var(--blanco); color: var(--tinta); border-color: #CDD3DA; }
.boton-secundario:hover { border-color: var(--tinta); }

/* Cabecera blanca */
.cabecera { position: sticky; top: 0; z-index: 50; background: var(--blanco); border-bottom: 1px solid var(--linea); }
/* La barra de arriba igual que en la portada: alta y ancha, logo grande y menú en el centro (como la de Vapi) */
.cabecera .envoltura { display: flex; align-items: center; gap: 2rem; height: 4.75rem; width: min(80rem, 100% - 2 * var(--margen)); }
.cabecera .envoltura > a { flex: none; }
.cabecera img { height: 38px; width: auto; }
.cabecera nav { display: flex; gap: 2.1rem; margin-inline: auto; font-size: 1rem; font-weight: 500; }
.cabecera nav a { text-decoration: none; }
.cabecera nav a:hover { color: var(--verde); }
.cabecera .acciones { margin-left: auto; display: flex; gap: 0.5rem; }
.cabecera nav + .acciones { margin-left: 0; }
.cabecera .boton { min-height: 2.75rem; font-size: 0.98rem; padding: 0 1.3rem; }
@media (max-width: 56rem) { .cabecera nav { display: none; } .cabecera nav + .acciones { margin-left: auto; } .cabecera .envoltura { height: 4.25rem; } .cabecera img { height: 32px; } .cabecera .boton { min-height: 2.5rem; font-size: 0.92rem; padding: 0 1rem; } }
/* Con el menú visible pero poco sitio (de 900 a 1090 px), todo un poco más junto */
@media (min-width: 56.01rem) and (max-width: 68rem) { .cabecera .envoltura { gap: 1.25rem; } .cabecera nav { gap: 1.3rem; font-size: 0.95rem; } .cabecera img { height: 34px; } }
@media (max-width: 26rem) { .cabecera .envoltura { gap: 0.75rem; } .cabecera img { height: 26px; } .cabecera .boton { font-size: 0.82rem; padding: 0 0.8rem; } }

/* Páginas legales */
.legal-cabecera { background: var(--panel); border-bottom: 1px solid var(--linea); padding: clamp(3rem, 7vw, 5rem) 0 clamp(2.5rem, 5vw, 3.5rem); }
.legal-cabecera h1 { font-size: clamp(2.3rem, 1.6rem + 2.8vw, 3.6rem); }
.legal-cabecera p { margin-top: 0.9rem; color: var(--gris); }
.legal { padding: clamp(2.5rem, 6vw, 4rem) 0 clamp(4rem, 8vw, 6rem); }
.legal-texto { max-width: 44rem; color: #2B3846; }
.legal-texto h2 { font-size: clamp(1.45rem, 1.2rem + 0.9vw, 1.85rem); margin-top: 2.8rem; color: var(--tinta); }
.legal-texto h2:first-child { margin-top: 0; }
.legal-texto h3 { font-size: 1.2rem; margin-top: 2rem; color: var(--tinta); }
.legal-texto p, .legal-texto ul, .legal-texto ol, .legal-texto .tabla, .legal-texto dl { margin-top: 1rem; }
.legal-texto ul, .legal-texto ol { padding-left: 1.25rem; }
.legal-texto li + li { margin-top: 0.4rem; }
.legal-texto a { color: var(--verde); }
.legal-texto .tabla { overflow-x: auto; }
.legal-texto table { border-collapse: collapse; width: 100%; font-size: 0.98rem; }
.legal-texto th, .legal-texto td { text-align: left; vertical-align: top; padding: 0.6rem 0.75rem 0.6rem 0; border-bottom: 1px solid var(--linea); }
.legal-texto th { font-weight: 700; color: var(--tinta); }
.legal-texto dl { display: grid; grid-template-columns: max-content 1fr; gap: 0.5rem 1.5rem; }
.legal-texto dt { font-weight: 700; color: var(--tinta); }
.legal-texto dd { margin: 0; }
@media (max-width: 34rem) { .legal-texto dl { grid-template-columns: 1fr; gap: 0.1rem; } .legal-texto dd + dt { margin-top: 0.6rem; } }

/* Gracias y 404: una sola pantalla centrada sobre la nebulosa en reposo */
.pagina-simple { min-height: calc(100vh - 4rem); min-height: calc(100svh - 4rem); display: grid; place-items: center; padding: 4rem var(--margen); text-align: center; color: var(--blanco);
  background: radial-gradient(45% 55% at 22% 30%, rgba(0, 229, 223, 0.28), transparent 70%), radial-gradient(40% 50% at 80% 65%, rgba(249, 115, 22, 0.18), transparent 70%), var(--negro); }
.pagina-simple-cuerpo { display: grid; justify-items: center; max-width: 38rem; }
.pagina-simple .codigo { font: 700 clamp(4.5rem, 3rem + 7vw, 8rem)/1 var(--titulo); color: var(--naranja); letter-spacing: -0.03em; }
.pagina-simple h1 { font-size: clamp(2.3rem, 1.7rem + 2.6vw, 3.6rem); margin-top: 1rem; }
.pagina-simple p { margin-top: 1rem; color: #C9D0D8; font-size: 1.15rem; }
.pagina-simple-acciones { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.6rem; margin-top: 2rem; }
.pagina-simple .boton-principal { background: var(--blanco); color: var(--negro); }
.pagina-simple .boton-secundario { background: rgba(5, 8, 13, 0.6); color: var(--blanco); border-color: rgba(255, 255, 255, 0.25); }

/* Pie negro */
.pie { background: var(--negro); color: var(--blanco); padding: 3.5rem 0 2rem; }
.pie-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.5rem; padding-bottom: 2.5rem; border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
.pie-cta p { font: 600 clamp(1.5rem, 1.1rem + 1.5vw, 2.2rem) var(--titulo); letter-spacing: -0.02em; }
.pie-cta p span { color: var(--gris-claro); }
.pie-cols { display: grid; gap: 2rem; padding-top: 2.5rem; }
@media (min-width: 48rem) { .pie-cols { grid-template-columns: 1.6fr 1fr 1fr 1fr; } }
.pie img { height: 30px; width: auto; }
.pie-cols p { margin-top: 0.8rem; color: var(--gris-claro); font-size: 0.92rem; max-width: 20rem; }
.pie h4 { margin: 0; font: 600 0.78rem var(--letra); letter-spacing: 0.12em; text-transform: uppercase; color: var(--gris-claro); }
.pie ul { margin: 0.9rem 0 0; padding: 0; list-style: none; display: grid; gap: 0.45rem; font-size: 0.95rem; }
.pie ul a { text-decoration: none; color: #D5DAE0; }
/* «Configurar cookies» del pie: parece un enlace y abre el aviso de cookies (js/cookies.js) */
.enlace-cookies { padding: 0; border: 0; background: none; color: inherit; font: inherit; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.pie-legal { margin-top: 2.5rem; color: #6B7480; font-size: 0.85rem; }