/* Retenot: tema del sitio. Azul marino de noche, como el hero de la home.
   Se carga después de los estilos de cada página y pisa sus colores. */
:root:root:root{
  color-scheme:dark;
  --paper:#0A1426; --surface:#111D36; --tint:#162440; --ink:#EEF1F8; --muted:#A3ADC4; --line:#24324F; --rule:#17233D;
  --sello:#9DB2FF; --sello-soft:#1A2650; --kraft:#C9A276; --kraft-deep:#A87E51; --kraft-ink:#1E1409; --kraft-pale:#1D1913; --kraft-track:#2E2820;
  --colegio:#BBA0EE; --colegio-soft:#2A2145; --iva:#DDB27A; --iva-soft:#2E2418; --arba:#62C6B8;
  --ok:#5CC793; --ok-soft:#12291F; --warn:#E6B566; --warn-line:#C99A45;
  --band:#070E1C; --band-ink:#E5E9F1; --band-muted:#9BA5BA; --band-line:#26314A;
}
html,body{background:var(--paper)}
::selection{background:#3B4F9A;color:#fff}

/* encabezado flotante, de vidrio */
.top{background:transparent!important;border-bottom:0!important;backdrop-filter:none!important;padding-inline:16px}
.top .wrap{margin-top:12px;max-width:1180px;background:rgba(10,20,38,.74);-webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);border:1px solid rgba(201,212,255,.14);border-radius:16px;padding:10px 12px 10px 18px;box-shadow:0 18px 40px -24px rgba(3,8,20,.9)}
.top .brand,.top .brand .logo{color:#F3F5FB}
.top .nav a{color:#B8C2DC}
.top .nav a:hover{color:#fff}
.top .nav a.cta{background:#89A1FC;color:#0A1426;border-radius:10px;padding:9px 16px;font-weight:700;text-decoration:none}
.top .nav a.cta:hover{background:#9DB2FF;color:#0A1426}
@media (max-width:720px){.top .nav a:not(.cta){display:none}.top .wrap{flex-wrap:nowrap}}

/* etiquetas sobre los títulos: sin mayúsculas forzadas */
.eyebrow{text-transform:none;letter-spacing:0;font-size:.95rem;font-weight:600;color:var(--sello)}

/* botones */
.btn{border-radius:12px}
.btn.solid{background:#89A1FC;border-color:#89A1FC;color:#0A1426;box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 10px 30px -12px rgba(137,161,252,.8)}
.btn.solid:hover{background:#9DB2FF}
:where(.btn):not(.solid){background:rgba(255,255,255,.06);color:#EEF1F8;border-color:rgba(201,212,255,.24)}
.btn:focus-visible,.nav a:focus-visible{outline:2px solid #fff;outline-offset:3px}

/* links y foco */
a{color:var(--sello)}
footer .wrap{border-top-color:var(--line)}

/* colores de estado que antes solo se activaban con el modo oscuro del sistema */
:root:root:root{--st-ok:#5CC793;--st-ok-bg:#12291F;--st-warn:#E8B465;--st-warn-dot:#E0A84A;--st-warn-bg:#33240C;--st-bad:#F59A90;--st-bad-bg:#3A1714}
:root .app{--c-sellos_caba:#5CC793;--c-sellos_pba:#8AA2FF;--c-aportes_caba:#F07AA8;--c-aportes_pba:#8AA2FF;--c-iva:#B59CFF}

/* etiquetas chicas: en minúscula, sin espaciado de mayúsculas */
.k,.tag-dark,.band .k,.lf-ans .k,.lf-body>.k{text-transform:none!important;letter-spacing:.01em!important}
.tag-dark{font-size:.85rem}
.band .k{font-size:.92rem;font-weight:600}

/* bloque de contacto: azul profundo con brillo, como el hero */
.contact{background:radial-gradient(120% 140% at 0% 0%,#26408F 0%,#172A63 42%,#0F1D3E 100%)!important;border:1px solid rgba(201,212,255,.18);box-shadow:0 40px 120px -50px rgba(91,124,240,.75)}
.contact h2{color:#fff}
.btn.ghost{color:#fff;border-color:rgba(255,255,255,.55)}

/* encabezado de las páginas internas: el mismo brillo azul del cielo de la home */
main>section:first-of-type:not(.hz){position:relative;isolation:isolate}
main>section:first-of-type:not(.hz)::before{content:"";position:absolute;left:0;right:0;top:-110px;bottom:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(1.2px 1.2px at 12% 18%,rgba(255,255,255,.55),transparent),radial-gradient(1px 1px at 27% 42%,rgba(255,255,255,.35),transparent),
    radial-gradient(1.2px 1.2px at 46% 12%,rgba(255,255,255,.45),transparent),radial-gradient(1px 1px at 63% 30%,rgba(255,255,255,.35),transparent),
    radial-gradient(1.2px 1.2px at 78% 14%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 91% 38%,rgba(255,255,255,.3),transparent),
    radial-gradient(1px 1px at 6% 52%,rgba(255,255,255,.3),transparent),radial-gradient(1px 1px at 86% 60%,rgba(255,255,255,.25),transparent),
    radial-gradient(80% 85% at 50% 0%,rgba(72,102,220,.42) 0%,rgba(44,66,160,.16) 48%,rgba(10,20,38,0) 78%);
  -webkit-mask-image:linear-gradient(#000 60%,transparent);mask-image:linear-gradient(#000 60%,transparent)}

/* tablas de las guías: encabezados en minúscula */
.lf-tab th,table th{text-transform:none!important;letter-spacing:.01em!important}

/* pie: Buenos Aires de noche, con jacarandás */
footer{position:relative;padding-top:calc(max(252px,22.9vw) - 6px)!important;background:url("img/pie-buenos-aires.webp") 50% 0/max(1100px,100%) auto no-repeat}
footer .wrap{border-top:0!important}

/* ---- detalles de interacción ---- */
:root{--ease-out:cubic-bezier(.23,1,.32,1)}
a,button,summary,.btn,.hz-btn{touch-action:manipulation}

/* etiquetas chicas en mayúsculas forzadas: en minúscula, sin el espaciado de mayúsculas */
.eyebrow,th,.screen .k,.lf-tab th,.lf-body>.k,.lf-ans .k,.tldr .k,.pcard .cat,.matrix .q,.qres .d small,.vt td::before,
.tot-card .lbl,.tag-dark,.side .who,.shot-side .who,.org b,.mini-tot small,.k,.esc th,.envelope .who,.env-card .k,.ccard .badge{
  text-transform:none!important;letter-spacing:.01em!important}

/* botones: respuesta inmediata al apretar */
.btn,.hz-btn,.nav a.cta{transition:transform 160ms var(--ease-out),background-color 150ms ease,border-color 150ms ease,filter 150ms ease}
.btn:active,.hz-btn:active,.nav a.cta:active{transform:scale(.97)}

/* hover solo con mouse: en el celular un toque no deja la tarjeta "prendida" */
@media (hover:none){
  .btn:hover{filter:none}
  .guide:hover,.g-card:hover{border-color:var(--line)}
  .app-t tbody tr:hover{background:transparent}
}
.guide,.g-card{transition:border-color 150ms ease}

@media (prefers-reduced-motion:reduce){
  .btn,.hz-btn,.nav a.cta,.guide,.g-card{transition:none}
  .btn:active,.hz-btn:active,.nav a.cta:active{transform:none}
}
/* montos: el signo y el número nunca se separan */
td.mono,td .mono,td.num,.v,.amt{white-space:nowrap}