/* Páginas legales de la landing (Términos y Privacidad). Misma base visual
   que /agencia: fondo negro, Inter local, rojo de marca como acento.
   Escala: títulos 44 / secciones 22 / cuerpo 16.5, ritmo vertical en
   múltiplos de 8. */
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url(/agencia/fonts/inter-400.woff2) format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url(/agencia/fonts/inter-500.woff2) format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url(/agencia/fonts/inter-600.woff2) format('woff2')}
:root{--bg:#0a0a0a;--fg:#f2f2f2;--muted:rgba(245,245,245,.72);--dim:rgba(245,245,245,.5);--line:rgba(245,245,245,.1);--panel:rgba(245,245,245,.03);--rojo:#EB3617}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:96px}
html,body{margin:0;background:var(--bg);color:var(--fg);font-family:Inter,"Inter Placeholder",sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body{font-size:16.5px;line-height:1.65}
a{color:var(--fg);text-decoration:none;text-underline-offset:3px}
main a,.vxl-contacto a{text-decoration:underline;text-decoration-color:rgba(235,54,23,.6)}
main a:hover,.vxl-contacto a:hover{text-decoration-color:var(--rojo)}

/* Barra superior: misma altura y aire que el nav de la landing */
.vxl-top{position:sticky;top:0;z-index:5;height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(24px,4vw,64px);background:rgba(10,10,10,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.vxl-top .vxl-logo{display:flex;align-items:center;height:100%}
.vxl-top img{height:34px;width:auto;display:block}
.vxl-back{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 16px;border:1px solid var(--line);border-radius:999px;font-size:13.5px;font-weight:500;color:var(--muted);transition:color .15s,border-color .15s,background .15s}
.vxl-back:hover{color:var(--fg);border-color:rgba(245,245,245,.28);background:var(--panel)}
.vxl-back svg{width:14px;height:14px}
.vxl-right{display:flex;align-items:center;gap:10px}
/* Selector de idioma: píldora segmentada, misma altura que el botón de volver */
.vxl-lang{display:inline-flex;align-items:center;height:38px;padding:3px;border:1px solid var(--line);border-radius:999px;background:var(--panel)}
.vxl-lang button{appearance:none;border:0;background:transparent;color:var(--dim);font:inherit;font-size:12.5px;font-weight:600;letter-spacing:.06em;height:100%;padding:0 12px;border-radius:999px;cursor:pointer;transition:color .15s,background .15s}
.vxl-lang button:hover{color:var(--fg)}
.vxl-lang button[aria-pressed="true"]{color:var(--fg);background:rgba(245,245,245,.1)}
/* Un solo HTML con las tres versiones: se muestra solo la del idioma activo */
.vxl-doc,.vxl-l{display:none}
html[data-lang="en"] .vxl-doc[data-lang="en"],html[data-lang="es"] .vxl-doc[data-lang="es"],html[data-lang="de"] .vxl-doc[data-lang="de"]{display:block}
html[data-lang="en"] .vxl-l[data-lang="en"],html[data-lang="es"] .vxl-l[data-lang="es"],html[data-lang="de"] .vxl-l[data-lang="de"]{display:inline}

/* Cuerpo */
.vxl-wrap{max-width:720px;margin:0 auto;padding:88px 24px 112px}
.vxl-eyebrow{color:var(--rojo);font-size:12px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;margin:0 0 16px}
h1{font-size:clamp(34px,4vw,48px);font-weight:500;line-height:1.08;letter-spacing:-.015em;margin:0 0 14px;hyphens:auto;overflow-wrap:anywhere}
h1 .vxl-acento{color:var(--rojo)}
.vxl-fecha{color:var(--dim);font-size:14px;margin:0 0 40px}
.vxl-intro{font-size:18px;line-height:1.6;color:var(--muted);margin:0 0 40px;padding-bottom:40px;border-bottom:1px solid var(--line)}

/* Índice */
.vxl-nav{margin:0 0 56px;padding:24px 28px;border:1px solid var(--line);border-radius:16px;background:var(--panel)}
.vxl-nav p{margin:0 0 12px;color:var(--fg);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.vxl-nav ol{margin:0;padding:0;list-style:none;columns:2;column-gap:32px;font-size:14.5px;counter-reset:idx}
.vxl-nav li{margin:0 0 6px;break-inside:avoid;counter-increment:idx;display:flex;gap:10px}
.vxl-nav li::before{content:counter(idx,decimal-leading-zero);color:var(--rojo);font-weight:500;font-variant-numeric:tabular-nums;min-width:22px}
.vxl-nav a{color:var(--muted)}
.vxl-nav a:hover{color:var(--fg)}

/* Secciones */
h2{display:flex;align-items:baseline;gap:14px;font-size:22px;font-weight:500;line-height:1.25;letter-spacing:-.01em;margin:56px 0 14px}
h2 span{color:var(--rojo);font-size:13px;font-weight:600;letter-spacing:.08em;font-variant-numeric:tabular-nums;flex:none}
p,li{color:var(--muted)}
p{margin:0 0 16px}
ul{margin:0 0 16px;padding-left:22px}
li{margin:0 0 8px}
li::marker{color:var(--rojo)}
strong{color:var(--fg);font-weight:500}

/* Tablas */
table{width:100%;border-collapse:collapse;margin:8px 0 24px;font-size:15px;line-height:1.5}
th,td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:top;color:var(--muted)}
th{color:var(--fg);font-weight:500;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase}
td:first-child{color:var(--fg);width:38%}

/* Contacto y pie */
.vxl-contacto{margin-top:8px;padding:24px 28px;border:1px solid var(--line);border-radius:16px;background:var(--panel)}
.vxl-contacto p{margin:0 0 6px}
.vxl-contacto p:last-child{margin:0}
.vxl-foot{max-width:720px;margin:0 auto;padding:0 24px 56px;display:flex;gap:24px;flex-wrap:wrap;align-items:center;font-size:13.5px;color:var(--dim);border-top:1px solid var(--line);padding-top:24px}
.vxl-foot a{color:var(--dim)}
.vxl-foot a:hover{color:var(--fg)}

@media (max-width:640px){
  body{font-size:16px}
  .vxl-top{height:64px}
  .vxl-top img{height:28px}
  .vxl-back{height:34px;padding:0 12px;font-size:13px}
  .vxl-back .vxl-l{display:none!important}
  .vxl-lang{height:34px}
  .vxl-lang button{font-size:12px;padding:0 10px}
  .vxl-right{gap:8px}
  .vxl-wrap{padding:56px 20px 80px}
  h1{font-size:30px}
  .vxl-intro{font-size:17px}
  .vxl-nav{padding:20px}
  .vxl-nav ol{columns:1}
  h2{margin-top:44px}
  td:first-child{width:42%}
  th,td{padding:10px}
  .vxl-foot{padding:20px 20px 40px;gap:16px}
}