/* Web pública de Eventfy.
 *
 * Mismo lenguaje visual que el formulario de autorización (authzweb): quien
 * llega aquí desde un recibo o desde un correo nuestro, y después abre su
 * enlace de autorización, tiene que reconocer que es el mismo sitio. En un
 * producto donde el cliente ya está decidiendo si fiarse, esa continuidad no
 * es decoración.
 *
 * Sin tipografías externas ni scripts de terceros: una empresa de seguridad no
 * puede pedirle al navegador de un cliente que cargue cosas de otros dominios.
 */

:root{
  --ground:#F4F6F5; --panel:#FFFFFF; --ink:#171B1A; --ink-2:#4A5250; --ink-3:#79837F;
  --rule:#DFE4E2; --rule-2:#C9D1CE;
  --accent:#0E5C56; --accent-soft:#E4EFEC; --accent-ink:#0A4642;
  --ok:#1C6F45; --stop:#9B2C2C; --warn:#96600B; --warn-soft:#FAF0DC;
}
@media (prefers-color-scheme: dark){
  :root{
    --ground:#101413; --panel:#171C1B; --ink:#E8EDEB; --ink-2:#A9B3B0; --ink-3:#7C8783;
    --rule:#293130; --rule-2:#3A4442;
    --accent:#5FC4B8; --accent-soft:#16302E; --accent-ink:#8AD9CF;
    --ok:#6BC48F; --stop:#E08585; --warn:#D9A441; --warn-soft:#2B2213;
  }
}
*{box-sizing:border-box}
html{color-scheme:light dark}
body{
  margin:0; background:var(--ground); color:var(--ink);
  font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  font-size:16px; line-height:1.6; padding:26px 20px 80px;
}
.wrap{max-width:720px; margin:0 auto; display:flex; flex-direction:column; gap:30px}

.barra{display:flex; align-items:baseline; gap:12px; flex-wrap:wrap}
.marca{font-weight:700; letter-spacing:.14em; font-size:14px; color:var(--accent-ink)}
.marca a{color:inherit; text-decoration:none}
.sub{font-size:13px; color:var(--ink-3)}
.langbar{margin-left:auto; display:flex}
.langbar button{
  font:inherit; font-size:12px; font-weight:600; letter-spacing:.06em;
  background:var(--panel); color:var(--ink-3); border:1px solid var(--rule-2);
  padding:5px 12px; cursor:pointer;
}
.langbar button:first-child{border-radius:4px 0 0 4px}
.langbar button:last-child{border-radius:0 4px 4px 0; border-left:none}
.langbar button[aria-pressed="true"]{background:var(--accent); color:#fff; border-color:var(--accent)}

h1{font-size:31px; line-height:1.15; margin:0; letter-spacing:-.015em; text-wrap:balance}
h2{font-size:13px; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
   color:var(--accent-ink); margin:0 0 4px}
h3{font-size:17px; margin:0 0 6px}
p{margin:0 0 14px; max-width:64ch}
p:last-child{margin-bottom:0}
a{color:var(--accent-ink)}
.lede{font-size:18px; color:var(--ink-2); max-width:56ch}

section{display:flex; flex-direction:column; gap:10px}
.panel{background:var(--panel); border:1px solid var(--rule); border-radius:8px; padding:22px}
.aviso{background:var(--warn-soft); border:1px solid var(--rule); border-left:3px solid var(--warn);
       border-radius:6px; padding:16px 18px}

ul.lista{margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:11px}
ul.lista li{display:grid; grid-template-columns:24px 1fr; gap:10px; align-items:start}
ul.lista .mk{font-weight:700; font-size:14px; line-height:1.65; font-variant-numeric:tabular-nums}
.si .mk{color:var(--ok)} .no .mk{color:var(--stop)} .pt .mk{color:var(--accent)}

dl.datos{margin:0; display:grid; grid-template-columns:auto 1fr; gap:7px 20px; font-size:15px}
dl.datos dt{color:var(--ink-3)}
dl.datos dd{margin:0}
code,.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:.92em}
.dato{background:var(--accent-soft); border-radius:4px; padding:2px 7px}

footer.pie{border-top:1px solid var(--rule); padding-top:18px; font-size:13.5px; color:var(--ink-3);
           display:flex; flex-direction:column; gap:8px}
footer.pie nav{display:flex; gap:16px; flex-wrap:wrap}
@media (max-width:560px){ body{padding:20px 16px 60px} h1{font-size:26px} }