/* Paginas publicas (landing y sin acceso). Los tokens, las fuentes y el modo
   oscuro vienen de app.css; aqui solo la maquetacion. */
body { background: var(--papel); color: var(--tinta); font-family: var(--sans); }
.pub { max-width: 40rem; margin: 0 auto; padding: var(--e6) var(--e4) var(--e6); min-height: 100dvh; display: flex; flex-direction: column; gap: var(--e6); }
.pub__marca { display: flex; align-items: center; gap: var(--e2); font: 600 var(--t-tarjeta)/1 var(--serif); }
.pub__marca svg { color: var(--naranja-texto); }
.pub__kicker { font: 600 var(--t-apoyo)/1 var(--sans); letter-spacing: .06em; text-transform: uppercase; color: var(--naranja-texto); margin-bottom: var(--e3); }
.pub h1 { font: 700 var(--t-pantalla)/1.15 var(--serif); text-wrap: balance; }
.pub__intro { margin-top: var(--e3); font-size: var(--t-lectura); line-height: 1.6; color: var(--gris); max-width: 34rem; }
.pub__acciones { margin-top: var(--e5); display: flex; flex-wrap: wrap; align-items: center; gap: var(--e3) var(--e4); }
.pub__btn { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 var(--e5); border-radius: var(--r-capsula); font: 600 var(--t-interfaz)/1 var(--sans); text-decoration: none; background: var(--naranja-degradado); color: #0f1e3d; box-shadow: var(--naranja-halo); }
.pub__btn:hover { background: var(--tono-pulsado); }
.pub__btn:focus-visible { outline: 2px solid var(--naranja-texto); outline-offset: 3px; }
.pub__btn--outline { background: var(--papel); color: var(--tinta); border: 1px solid var(--borde); box-shadow: none; }
.pub__btn--outline:hover { background: var(--suave); }
.pub__nota { font-size: var(--t-apoyo); color: var(--gris); }
.pub__lista { list-style: none; display: grid; gap: var(--e3); }
.pub__item { display: flex; gap: var(--e3); padding: var(--e4); background: var(--tarjeta); border: 1px solid var(--regla); border-radius: var(--r-tarjeta); box-shadow: var(--sombra-apoyada); }
.pub__item svg { flex: none; color: var(--naranja-texto); margin-top: 2px; }
.pub__item h2 { font: 600 var(--t-interfaz)/1.3 var(--sans); }
.pub__item p { margin-top: var(--e1); font-size: var(--t-interfaz); line-height: 1.5; color: var(--gris); }
.pub__pie { margin-top: auto; padding-top: var(--e4); border-top: 1px solid var(--regla); font-size: var(--t-apoyo); color: var(--gris); }
.pub__aviso { padding: var(--e4); background: var(--nota-fondo); border: 1px solid var(--nota-borde); border-radius: var(--r-tarjeta); line-height: 1.5; }
@media (min-width: 640px) { .pub { padding-top: 64px; } .pub h1 { font-size: 46px; } }