/* Páginas de texto de gettraza.com (privacidad, términos, soporte, invitación).
   Mismos tokens, tipografías, cabecera y pie que la portada (index.html). */
:root {
  --bg:         #ffffff;
  --bg-card:    #f5f5f3;
  --ink:        #111a14;
  --ink-2:      #243020;
  --ink-soft:   #607060;
  --rust:       #1c3a29;
  --rust-light: rgba(28,58,41,0.08);
  --sand:       #4a7c5a;
  --line:       rgba(28,58,41,0.12);
  --line-faint: rgba(28,58,41,0.07);
  --ease-out:   cubic-bezier(0.16,1,0.3,1);
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body {
  font-family:'Barlow', sans-serif;
  background:var(--bg); color:var(--ink);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  min-height:100vh; display:flex; flex-direction:column;
}
::selection { background:var(--rust); color:#fff; }
a { color:var(--rust); }
a:focus-visible, button:focus-visible { outline:2px solid var(--rust); outline-offset:3px; }

/* Idioma: con JavaScript se ve solo el idioma elegido; sin él, la página entera en español
   y el texto inglés debajo, con su ancla (#en). */
html:not([lang="en"]) [data-l="en"], html[lang="en"] [data-l="es"] { display:none !important; }
html.js:not([lang="en"]) [data-block="en"], html.js[lang="en"] [data-block="es"] { display:none; }
html.js .nojs-only { display:none; }

/* ── NAV (igual que la portada, pero en el flujo) ── */
nav.site-nav {
  padding:18px 48px;
  display:flex; justify-content:space-between; align-items:center; gap:16px;
  border-bottom:1px solid var(--line-faint);
}
.logo { display:flex; align-items:center; text-decoration:none; color:var(--ink); }
.logo-letter-wrap { overflow:hidden; width:150px; height:52px; position:relative; flex-shrink:0; }
.logo-letter {
  position:absolute; width:220px; height:220px;
  top:50%; left:50%; transform:translate(-50%, -44%); object-fit:contain;
}
.nav-right { display:flex; align-items:center; gap:18px; }
.nav-link {
  color:var(--rust); text-decoration:none;
  font-family:'JetBrains Mono',monospace; font-size:10px;
  letter-spacing:0.14em; text-transform:uppercase;
  padding:10px 0; border-bottom:1px solid var(--rust);
}
.nav-link:hover { opacity:0.65; }
.lang-toggle { display:flex; align-items:center; border:1px solid var(--line); padding:3px; gap:2px; }
.lang-btn {
  font-family:'JetBrains Mono',monospace;
  font-size:9px; font-weight:600; letter-spacing:0.18em; text-transform:uppercase;
  padding:5px 10px; border:none; background:transparent; cursor:pointer;
  color:var(--ink-soft); transition:background-color 0.2s, color 0.2s;
}
.lang-btn.active { background:var(--rust); color:#fff; }
html:not(.js) .lang-toggle { display:none; }

/* ── DOCUMENTO ── */
main { flex:1; width:100%; }
.doc { max-width:760px; margin:0 auto; padding:72px 28px 96px; }
.eyebrow {
  font-family:'JetBrains Mono',monospace;
  font-size:10px; letter-spacing:0.28em; text-transform:uppercase;
  color:var(--rust); margin-bottom:22px;
  display:inline-flex; align-items:center; gap:12px;
}
.eyebrow::before { content:''; width:22px; height:1px; background:var(--rust); }
.doc h1 {
  font-family:'Fraunces', serif; font-optical-sizing:auto;
  font-size:clamp(40px,5vw,64px); font-weight:600; line-height:1.04; letter-spacing:-0.03em;
  color:var(--ink); margin-bottom:20px;
}
.doc h1 em { font-style:normal; color:var(--rust); }
.dates {
  font-family:'JetBrains Mono',monospace; font-size:10px; line-height:1.9;
  letter-spacing:0.12em; text-transform:uppercase; color:var(--ink-soft);
  margin-bottom:32px;
}
.lead {
  font-size:18px; line-height:1.6; color:var(--ink-2);
  border-left:2px solid var(--rust); padding:4px 0 4px 20px; margin-bottom:40px;
}
.toc {
  background:var(--bg-card); padding:22px 26px; margin-bottom:56px;
}
.toc-title {
  font-family:'JetBrains Mono',monospace; font-size:9px; letter-spacing:0.22em;
  text-transform:uppercase; color:var(--ink-soft); margin-bottom:12px;
}
.toc ol { list-style:none; columns:2; column-gap:28px; }
.toc li { font-size:14px; line-height:1.5; padding:3px 0; break-inside:avoid; }
.toc a { color:var(--ink-2); text-decoration:none; }
.toc a:hover { color:var(--rust); text-decoration:underline; }

.doc h2 {
  font-family:'Fraunces', serif; font-optical-sizing:auto;
  font-size:clamp(24px,2.6vw,30px); font-weight:500; line-height:1.2; letter-spacing:-0.02em;
  color:var(--ink); margin:56px 0 18px; padding-top:28px; border-top:1px solid var(--line);
  scroll-margin-top:24px;
}
.doc h3 {
  font-family:'Barlow Condensed',sans-serif; font-weight:700;
  font-size:18px; letter-spacing:0.06em; text-transform:uppercase;
  color:var(--rust); margin:30px 0 10px;
}
.doc p, .doc li { font-size:16px; line-height:1.7; color:var(--ink-2); overflow-wrap:anywhere; }
.doc p { margin-bottom:14px; }
.doc ul, .doc ol.list { padding-left:22px; margin-bottom:16px; }
.doc ul li, .doc ol.list li { margin-bottom:8px; padding-left:4px; }
.doc ul li::marker { color:var(--sand); }
.doc strong { font-weight:600; color:var(--ink); }
.doc code {
  font-family:'JetBrains Mono',monospace; font-size:0.86em;
  background:var(--bg-card); padding:1px 5px;
}

/* Tablas: en el móvil se desplazan dentro de su caja, nunca la página. */
.table-wrap { overflow-x:auto; margin:8px 0 22px; border:1px solid var(--line); -webkit-overflow-scrolling:touch; }
.doc table { border-collapse:collapse; width:100%; min-width:560px; }
.doc th {
  font-family:'JetBrains Mono',monospace; font-size:9px; font-weight:600;
  letter-spacing:0.16em; text-transform:uppercase; text-align:left;
  color:var(--ink-soft); background:var(--bg-card); padding:12px 14px;
  border-bottom:1px solid var(--line);
}
.doc td {
  font-size:14px; line-height:1.55; color:var(--ink-2); vertical-align:top;
  padding:12px 14px; border-bottom:1px solid var(--line-faint);
}
.doc tr:last-child td { border-bottom:none; }

.jump {
  display:inline-block; margin-bottom:28px;
  font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:0.14em; text-transform:uppercase;
}
.lang-sep { margin:96px 0 0; border:none; border-top:1px solid var(--line); }

/* ── SOPORTE ── */
.contact-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); margin:8px 0 14px; }
.contact {
  background:var(--bg); padding:20px 18px; text-decoration:none; color:var(--ink);
  display:flex; flex-direction:column; gap:8px; transition:background-color 0.2s;
}
.contact:hover { background:var(--rust-light); }
.contact-k {
  font-family:'JetBrains Mono',monospace; font-size:9px; letter-spacing:0.2em;
  text-transform:uppercase; color:var(--ink-soft);
}
.contact-v { font-family:'Barlow Condensed',sans-serif; font-weight:700; font-size:18px; letter-spacing:0.02em; color:var(--rust); word-break:break-word; }
.note {
  font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:0.12em;
  text-transform:uppercase; color:var(--ink-soft); margin-bottom:8px;
}
details.faq { border-top:1px solid var(--line); }
details.faq:last-of-type { border-bottom:1px solid var(--line); }
details.faq summary {
  list-style:none; cursor:pointer; padding:20px 36px 20px 0; position:relative;
  font-family:'Barlow Condensed',sans-serif; font-weight:700; font-size:20px;
  letter-spacing:0.02em; color:var(--ink);
}
details.faq summary::-webkit-details-marker { display:none; }
details.faq summary::after {
  content:'+'; position:absolute; right:4px; top:50%; transform:translateY(-50%);
  font-family:'JetBrains Mono',monospace; font-size:18px; color:var(--rust);
  transition:transform 0.25s var(--ease-out);
}
details.faq[open] summary::after { transform:translateY(-50%) rotate(45deg); }
details.faq summary:hover { color:var(--rust); }
details.faq .faq-body { padding:0 0 18px; }
.doc .path { font-weight:600; color:var(--ink); white-space:nowrap; }

/* ── INVITACIÓN ── */
.invite { max-width:560px; margin:0 auto; padding:96px 28px 120px; }
.invite h1 {
  font-family:'Fraunces', serif; font-optical-sizing:auto;
  font-size:clamp(44px,7vw,68px); font-weight:600; line-height:1.02; letter-spacing:-0.03em;
  margin-bottom:22px;
}
.invite h1 em { font-style:normal; color:var(--rust); }
.invite .sub { font-size:17px; line-height:1.6; color:var(--ink-soft); margin-bottom:36px; max-width:420px; }
.cta-btn {
  width:100%; padding:16px 24px;
  background:var(--ink); border:none; color:var(--bg); text-decoration:none;
  font-family:'Barlow Condensed',sans-serif;
  font-size:14px; font-weight:700; letter-spacing:0.16em; text-transform:uppercase;
  display:flex; align-items:center; justify-content:center; gap:12px;
  position:relative; overflow:hidden; cursor:pointer;
}
.cta-btn::before {
  content:''; position:absolute; inset:0; background:var(--rust);
  transform:translateY(100%); transition:transform 0.32s var(--ease-out); z-index:0;
}
.cta-btn span, .cta-btn svg { position:relative; z-index:1; }
.cta-btn:hover::before { transform:translateY(0); }
.store-note {
  margin:16px 0 0;
  font-family:'JetBrains Mono',monospace; font-size:10px; line-height:1.7;
  letter-spacing:0.12em; text-transform:uppercase; color:var(--ink-soft);
}

/* ── FOOTER (igual que la portada) ── */
footer {
  border-top:1px solid var(--line);
  padding:26px 52px;
  display:flex; justify-content:space-between; align-items:center;
  flex-wrap:wrap; gap:12px;
}
.foot-copy {
  font-family:'JetBrains Mono',monospace; font-size:10px;
  letter-spacing:0.14em; text-transform:uppercase; color:var(--ink-soft);
}
.foot-links {
  display:flex; flex-wrap:wrap; gap:12px 24px;
  font-family:'JetBrains Mono',monospace; font-size:10px;
  letter-spacing:0.14em; text-transform:uppercase;
}
.foot-links a { color:var(--ink-soft); text-decoration:none; transition:color 0.2s; }
.foot-links a:hover, .foot-links a[aria-current="page"] { color:var(--rust); }

@media (max-width:960px) {
  nav.site-nav { padding:16px 24px; }
  footer { padding:22px 28px; flex-direction:column; align-items:flex-start; }
}
@media (max-width:640px) {
  nav.site-nav { padding:12px 16px; }
  .nav-right { gap:12px; }
  .logo-letter-wrap { width:120px; }
  .logo-letter { width:180px; height:180px; }
  .lang-btn { padding:5px 7px; }
  .doc { padding:48px 16px 72px; }
  .invite { padding:64px 16px 88px; }
  .toc ol { columns:1; }
  .contact-grid { grid-template-columns:1fr; }
  footer { padding:22px 16px; }
  .doc .path { white-space:normal; }
}
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { transition-duration:0.01ms !important; animation-duration:0.01ms !important; }
  html { scroll-behavior:auto; }
}