/* ═══════════════════════════════════════════════════════════════════════════
   Páginas sueltas (Quiénes somos, Contacto, Privacidad, Términos) en el
   lenguaje de la portada v4 («Noche plata»). Va tras marca.css.
   Una columna de lectura: titular serif, etiquetas en mono, texto en Inter.
   ═══════════════════════════════════════════════════════════════════════════ */
:root{
  --v4-bg:#06080F; --v4-bg-2:#0C1020; --v4-ink:#ECEEF3; --v4-muted:#868B99;
  --v4-line:rgba(236,238,243,.10); --v4-line-2:rgba(236,238,243,.18);
  --v4-gold:#C9A84C; --v4-gold-soft:#E6D3A0;
  --v4-serif:"Instrument Serif", Georgia, serif; --v4-ui:"Inter", system-ui, sans-serif; --v4-mono:"Geist Mono", ui-monospace, monospace;
}
html body{ background:var(--v4-bg) !important; color:var(--v4-ink) !important; font-family:var(--v4-ui) !important; -webkit-font-smoothing:antialiased; overflow-x:clip; }
html body::before, html body::after{ display:none !important; }
html body .container{
  max-width:760px !important; margin:0 auto !important; padding:0 clamp(20px,5vw,40px) 90px !important;
  background:none !important; border:0 !important; box-shadow:none !important; border-radius:0 !important;
}
/* Barra de marca arriba, como el menú de la app */
html body .brand{
  display:flex; align-items:center; height:64px; margin:0 0 56px !important; border-bottom:1px solid var(--v4-line);
  position:relative; text-align:left !important;
}
html body .brand::before{ content:''; position:absolute; left:-100vw; right:-100vw; bottom:-1px; border-bottom:1px solid var(--v4-line); }
html body .nav-logo{ display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--v4-ink) !important; background:none !important; -webkit-text-fill-color:currentColor !important; }
html body .nav-logo .logo-mark{ font-size:0 !important; width:7px; height:7px; border-radius:50%; background:var(--v4-gold); box-shadow:0 0 12px var(--v4-gold); }
html body .nav-logo .logo-text{ font:600 12px/1 var(--v4-ui) !important; letter-spacing:.3em !important; text-transform:uppercase; color:var(--v4-ink) !important; -webkit-text-fill-color:currentColor !important; background:none !important; }

html body h1{
  font:400 clamp(48px,8vw,88px)/.95 var(--v4-serif) !important; letter-spacing:-.02em !important; margin:0 0 16px !important; text-align:left !important;
  color:var(--v4-ink) !important; background:none !important; -webkit-text-fill-color:currentColor !important; text-transform:none !important;
}
html body .subtitle{
  display:flex; align-items:center; gap:12px; margin:0 !important; text-align:left !important;
  font:500 10.5px/1.4 var(--v4-mono) !important; letter-spacing:.16em !important; text-transform:uppercase; color:var(--v4-gold) !important; font-style:normal !important;
}
html body .subtitle::before{ content:''; width:28px; height:1px; background:var(--v4-gold); }
html body .rule{ height:1px !important; width:100% !important; background:var(--v4-line) !important; margin:34px 0 40px !important; border-radius:0 !important; }
html body .updated{ font:500 10.5px/1.4 var(--v4-mono) !important; letter-spacing:.14em; text-transform:uppercase; color:var(--v4-muted) !important; text-align:left !important; }
html body h2{
  font:400 clamp(28px,3.4vw,36px)/1.1 var(--v4-serif) !important; letter-spacing:-.01em !important; color:var(--v4-ink) !important;
  background:none !important; -webkit-text-fill-color:currentColor !important; margin:52px 0 16px !important; padding:0 !important; border:0 !important; text-transform:none !important;
}
html body h3{ font:400 23px/1.2 var(--v4-serif) !important; color:var(--v4-ink) !important; background:none !important; -webkit-text-fill-color:currentColor !important; margin:30px 0 10px !important; text-transform:none !important; letter-spacing:0 !important; }
html body p, html body li{ font:400 16.5px/1.75 var(--v4-ui) !important; color:color-mix(in srgb, var(--v4-ink) 78%, transparent) !important; }
html body ul, html body ol{ padding-left:20px !important; }
html body li{ margin-bottom:10px !important; }
html body li::marker{ color:var(--v4-gold); }
html body strong{ color:var(--v4-ink) !important; font-weight:500 !important; }
html body em{ color:var(--v4-gold-soft) !important; }
html body .container a:not(.nav-logo){ color:var(--v4-ink) !important; text-decoration:none; border-bottom:1px solid var(--v4-gold); transition:color .18s; }
html body .container a:not(.nav-logo):hover{ color:var(--v4-gold) !important; }

html body .verse{
  background:none !important; border:0 !important; border-left:1px solid var(--v4-gold) !important; border-radius:0 !important; box-shadow:none !important;
  padding:4px 0 4px 24px !important; margin:40px 0 !important; text-align:left !important;
  font:italic 400 clamp(23px,2.8vw,30px)/1.35 var(--v4-serif) !important; color:var(--v4-ink) !important;
}
html body .contact-box, html body .responsible, html body .copyright-banner{
  background:none !important; border:1px solid var(--v4-line) !important; border-radius:4px !important; box-shadow:none !important;
  padding:26px 26px !important; margin:34px 0 !important; text-align:left !important;
}
html body .contact-box strong{ display:block; font:500 10.5px/1.4 var(--v4-mono) !important; letter-spacing:.16em; text-transform:uppercase; color:var(--v4-muted) !important; margin-bottom:12px; }
html body .contact-box a{ font:400 clamp(24px,3.4vw,32px)/1.2 var(--v4-serif) !important; border:0 !important; word-break:break-word; }

/* Enlaces del final → pie */
html body .container > .nav-links{
  display:flex !important; flex-wrap:wrap; gap:10px 26px !important; justify-content:flex-start !important;
  margin:70px 0 0 !important; padding:26px 0 0 !important; border-top:1px solid var(--v4-line) !important; background:none !important;
}
html body .container > .nav-links a{ font:400 13.5px/1 var(--v4-ui) !important; color:var(--v4-muted) !important; border:0 !important; }
html body .container > .nav-links a:hover{ color:var(--v4-ink) !important; }
html body .footer-credit{ margin-top:18px !important; font:400 13.5px/1 var(--v4-ui) !important; color:var(--v4-muted) !important; }
html body .footer-credit a{ color:var(--v4-gold) !important; font-weight:600; border:0 !important; }