/* ==========================================================================
   APS CONSULTING SpA — Sistema de diseño v2.0
   Base clara, aire, un solo acento. Móvil primero.
   ========================================================================== */

:root{
  --paper:      #FFFFFF;
  --paper-alt:  #F7F7F4;
  --paper-warm: #FBFBF8;

  --ink:        #14181A;
  --ink-2:      #565E62;
  --ink-3:      #8A9095;

  --brand:      #2C392C;   /* verde carbón del logotipo APS */
  --brand-2:    #465B45;
  --brand-soft: #E8ECE7;

  --deep:       #171A17;   /* pie */
  --accent:     #4A7C59;   /* acento: la "L" de A.L.D.O. sobre fondo claro */
  --accent-on-dark:#8FB89A;/* misma familia, sobre banda verde o pie oscuro */

  --rule:       #E6E6E1;
  --rule-2:     #D2D2CB;
  --rule-dark:  rgba(255,255,255,.13);

  --serif: "Source Serif 4", Georgia, "Times New Roman", serif;
  --sans:  "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;

  --pad:  20px;
  --max:  1200px;
  --ease: cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}

body{
  background:var(--paper);color:var(--ink);
  font-family:var(--sans);font-weight:400;font-size:16px;line-height:1.7;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
  font-feature-settings:"kern" 1,"liga" 1;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}

.wrap{width:100%;max-width:var(--max);margin:0 auto;padding:0 var(--pad)}
.wrap-narrow{max-width:820px}

/* ---------- Tipografía ---------- */
.eyebrow{
  display:inline-block;font-size:11px;font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;color:var(--brand);
  padding-bottom:10px;position:relative;
}
.eyebrow::after{content:"";position:absolute;left:0;bottom:0;width:26px;height:2px;background:var(--brand)}

h1,.h1{font-family:var(--serif);font-size:clamp(2.15rem,7vw,4rem);font-weight:400;line-height:1.08;letter-spacing:-.018em}
h2,.h2{font-family:var(--serif);font-size:clamp(1.7rem,5.2vw,2.7rem);font-weight:400;line-height:1.14;letter-spacing:-.015em}
h3,.h3{font-family:var(--serif);font-size:clamp(1.15rem,3.2vw,1.42rem);font-weight:600;line-height:1.28;letter-spacing:-.006em}
h4{font-size:11.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ink)}
em{font-style:normal;color:var(--brand)}

.lead{font-size:clamp(1.04rem,3.4vw,1.2rem);font-weight:400;color:var(--ink-2);line-height:1.72}
.small{font-size:.84rem;color:var(--ink-3);line-height:1.7}
strong{font-weight:600;color:var(--ink)}

/* ---------- Secciones ---------- */
.sec{padding:66px 0}
.sec-lg{padding:82px 0}
.band-alt{background:var(--paper-alt)}
.band-brand{background:var(--brand-soft)}
.sec-head{margin-bottom:34px;max-width:66ch}
.sec-head h2{margin-top:20px}
.sec-head .lead{margin-top:18px}
.rule{height:1px;background:var(--rule);border:0}

/* ---------- Encabezado ---------- */
.site-head{
  position:sticky;top:0;z-index:80;background:rgba(255,255,255,.95);
  backdrop-filter:saturate(180%) blur(14px);border-bottom:1px solid var(--rule);
}
.head-in{display:flex;align-items:center;justify-content:space-between;gap:16px;height:64px}

/* Marca: opción C, apilada con regla */
.wordmark{display:inline-block;line-height:1;text-align:left}
.wordmark .aps{display:block;font-family:var(--serif);font-size:22px;font-weight:600;
  letter-spacing:.10em;color:var(--ink)}
.wordmark .wm-rule{display:block;height:1.5px;background:var(--brand);width:100%;margin:5px 0 4px;
  transition:background .25s var(--ease)}
.wordmark .cons{display:block;font-size:8.5px;font-weight:600;letter-spacing:.32em;
  text-transform:uppercase;color:var(--ink-3);text-align:right}
@media (hover:hover) and (pointer:fine){
  .wordmark:hover .wm-rule{background:var(--ink)}
}

.nav{display:none}
.nav a{font-size:13.5px;font-weight:500;color:var(--ink-2);padding:8px 0;border-bottom:2px solid transparent;transition:.2s}
.nav a:hover,.nav a[aria-current="page"]{color:var(--ink);border-bottom-color:var(--brand)}

.head-tools{display:flex;align-items:center;gap:14px}
.lang{display:flex;align-items:center;gap:5px;font-size:11px;font-weight:600;letter-spacing:.1em}
.lang button{color:var(--ink-3);padding:3px}
.lang button.on{color:var(--brand)}
.lang i{color:var(--rule-2);font-style:normal}

.burger{width:36px;height:36px;display:grid;place-items:center}
.burger span{display:block;width:20px;height:1.5px;background:var(--ink);position:relative}
.burger span::before,.burger span::after{content:"";position:absolute;left:0;width:20px;height:1.5px;background:var(--ink);transition:.25s var(--ease)}
.burger span::before{top:-6px}.burger span::after{top:6px}
.menu-open .burger span{background:transparent}
.menu-open .burger span::before{top:0;transform:rotate(45deg)}
.menu-open .burger span::after{top:0;transform:rotate(-45deg)}

.drawer{
  position:fixed;inset:64px 0 0;z-index:70;background:var(--paper);
  transform:translateX(100%);transition:transform .3s var(--ease);
  overflow-y:auto;padding:16px var(--pad) 70px;
}
.menu-open .drawer{transform:none}
.drawer a{display:block;padding:16px 0;border-bottom:1px solid var(--rule);font-size:16px;font-weight:600}
.drawer .sub{display:block;margin-top:3px;font-size:12.5px;font-weight:400;color:var(--ink-3)}

/* ---------- Portada ---------- */
.hero{padding:52px 0 8px;background:var(--paper)}
.hero h1{margin:22px 0 22px;max-width:17ch}
.hero .lead{max-width:58ch}

.cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  font-size:13.5px;font-weight:600;letter-spacing:.02em;
  padding:14px 26px;border-radius:2px;transition:.2s var(--ease);min-height:50px;
}
.btn-solid{background:var(--brand);color:#fff}
.btn-solid:hover{background:var(--brand-2)}
.btn-line{border:1px solid var(--rule-2);color:var(--ink)}
.btn-line:hover{border-color:var(--brand);color:var(--brand)}
.btn-ghost{border:1px solid rgba(255,255,255,.3);color:#fff}
.btn-ghost:hover{border-color:#fff;background:rgba(255,255,255,.08)}
.btn svg{width:17px;height:17px;flex:0 0 17px}

/* Credenciales */
.creds{border-top:1px solid var(--rule);margin-top:52px;padding-top:32px;
  display:grid;grid-template-columns:1fr 1fr;gap:26px 20px}
.cred b{display:block;font-family:var(--serif);font-size:2rem;font-weight:400;color:var(--brand);
  line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.cred span{display:block;margin-top:8px;font-size:11.5px;font-weight:500;letter-spacing:.09em;
  text-transform:uppercase;color:var(--ink-3);line-height:1.5}
/* barra de progreso bajo cada cifra, se llena junto con el conteo */
.cred{position:relative;padding-bottom:14px}
.cred::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:0;
  background:var(--brand);opacity:.28;transition:width 1.6s var(--ease)}
.cred.counted::after{width:100%}

/* ---------- Rejillas ---------- */
.grid{display:grid;gap:1px;background:var(--rule);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}
.cell{background:var(--paper);padding:30px 24px}
.band-alt .cell{background:var(--paper-alt)}
.cell-num{display:block;font-size:11px;font-weight:700;letter-spacing:.16em;color:var(--brand);margin-bottom:16px}
.cell h3{margin-bottom:11px}
.cell p{font-size:.95rem;color:var(--ink-2)}
.cell .more{display:inline-block;margin-top:18px;font-size:12.5px;font-weight:600;color:var(--brand);
  transition:transform .28s var(--ease)}

/* Elevación al pasar el cursor. Solo en dispositivos con puntero real. */
.cell{position:relative;z-index:1;
  transition:transform .32s var(--ease),box-shadow .32s var(--ease),background .28s var(--ease)}
.cell::before{content:"";position:absolute;left:0;top:0;height:2px;width:0;background:var(--brand);
  transition:width .38s var(--ease)}
@media (hover:hover) and (pointer:fine){
  .cell:hover{
    z-index:3;background:var(--paper);
    transform:translateY(-6px) scale(1.014);
    box-shadow:0 18px 42px -18px rgba(20,24,26,.22), 0 2px 8px -4px rgba(20,24,26,.10);
  }
  .cell:hover::before{width:100%}
  .cell:hover h3{color:var(--brand)}
  .cell.link:hover .more{transform:translateX(5px)}
}
.cell h3{transition:color .28s var(--ease)}
@media (prefers-reduced-motion:reduce){
  .cell,.cell::before,.cell h3,.cell .more{transition:none!important}
  .cell:hover{transform:none!important;box-shadow:none!important}
}

/* Fila de estándares: subrayado progresivo */
@media (hover:hover) and (pointer:fine){
  .std-item{transition:background .25s var(--ease)}
  .std-item:hover{background:rgba(44,57,44,.03)}
}

/* ---------- Estándares ---------- */
.std{border-top:1px solid var(--rule)}
.std-item{display:grid;grid-template-columns:1fr;gap:8px;padding:24px 0;border-bottom:1px solid var(--rule)}
.std-tag{font-size:11px;font-weight:700;letter-spacing:.16em;color:var(--brand)}
.std-item h3{font-size:1.1rem}
.std-item p{font-size:.94rem;color:var(--ink-2)}

/* ---------- Cita ---------- */
.pull{border-left:2px solid var(--brand);padding-left:24px;margin:36px 0 0}
.pull p{font-family:var(--serif);font-size:clamp(1.2rem,4.2vw,1.55rem);font-weight:400;line-height:1.48;color:var(--ink)}

/* ---------- Territorios ---------- */
.terr{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}
.terr span{font-size:12.5px;font-weight:500;color:var(--ink-2);
  border:1px solid var(--rule-2);padding:8px 14px;border-radius:2px;background:var(--paper)}

/* ---------- Cierre ---------- */
.cta-band{background:var(--brand);color:#fff;padding:64px 0}
.cta-band h2{color:#fff;margin-top:20px}
.cta-band .lead{color:rgba(255,255,255,.78);max-width:54ch;margin-top:18px}
.cta-band .eyebrow{color:rgba(255,255,255,.85)}
.cta-band .eyebrow::after{background:rgba(255,255,255,.6)}

/* Contacto directo */
.reach{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.reach a{
  display:inline-flex;align-items:center;gap:11px;min-height:52px;
  padding:13px 22px;border:1px solid rgba(255,255,255,.32);border-radius:2px;
  font-size:14px;font-weight:600;color:#fff;transition:.2s var(--ease);
}
.reach a:hover{background:rgba(255,255,255,.1);border-color:#fff}
.reach svg{width:19px;height:19px;flex:0 0 19px;fill:currentColor}
.reach.on-light a{border-color:var(--rule-2);color:var(--ink)}
.reach.on-light a:hover{border-color:var(--brand);color:var(--brand);background:transparent}

/* ---------- Pie ---------- */
.site-foot{background:var(--deep);color:#9AA29A;padding:56px 0 28px;font-size:.92rem}
.foot-grid{display:grid;gap:36px}
.foot h4{color:#fff;margin-bottom:16px;font-size:11px;letter-spacing:.16em}
.foot-links a{display:block;padding:7px 0;color:#B9C0B9;font-size:.92rem}
.foot-links a:hover{color:#fff}
.foot-nap{color:#B9C0B9;line-height:1.9}
.foot-bottom{border-top:1px solid var(--rule-dark);margin-top:38px;padding-top:22px;
  font-size:.78rem;color:#6E766E;display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:space-between}
.foot .wordmark{display:inline-block;margin-bottom:20px}
.foot .wordmark .aps{color:#fff}
.foot .wordmark .cons{color:#7E867E}
.foot .wordmark .wm-rule{background:#5E7A5B}
.ext::after{content:"↗";font-size:.78em;margin-left:6px;opacity:.65}

/* ---------- Aparición ---------- */
.rv{opacity:0;transform:translateY(14px);transition:opacity .65s var(--ease),transform .65s var(--ease)}
.rv.in{opacity:1;transform:none}
.d1{transition-delay:.06s}.d2{transition-delay:.12s}.d3{transition-delay:.18s}
@media (prefers-reduced-motion:reduce){
  .rv{opacity:1!important;transform:none!important;transition:none!important}
  html{scroll-behavior:auto}
}

/* ---------- Idioma: ver bloque de tres idiomas al final ---------- */

/* ---------- Tablet ---------- */
@media (min-width:720px){
  :root{--pad:34px}
  .sec{padding:92px 0}
  .sec-lg{padding:112px 0}
  .hero{padding:80px 0 10px}
  .creds{grid-template-columns:repeat(3,1fr);gap:32px}
  .grid-2{grid-template-columns:1fr 1fr}
  .grid-3{grid-template-columns:1fr 1fr}
  .grid-4{grid-template-columns:1fr 1fr}
  .grid{border-left:1px solid var(--rule);border-right:1px solid var(--rule)}
  .cell{padding:34px 30px}
  .std-item{grid-template-columns:120px 1fr;gap:26px;padding:28px 0}
  .std-tag{padding-top:5px}
  .foot-grid{grid-template-columns:1.5fr 1fr 1fr}
  .cta-band{padding:88px 0}
}

/* ---------- Escritorio ---------- */
@media (min-width:1024px){
  :root{--pad:44px}
  body{font-size:16.5px}
  .head-in{height:78px}
  .nav{display:flex;align-items:center;gap:30px}
  .burger,.drawer{display:none}
  .sec{padding:110px 0}
  .sec-lg{padding:136px 0}
  .hero{padding:104px 0 16px}
  .creds{grid-template-columns:repeat(6,1fr)}
  .grid-3{grid-template-columns:repeat(3,1fr)}
  .grid-4{grid-template-columns:repeat(4,1fr)}
  .foot-grid{grid-template-columns:1.6fr 1fr 1fr 1fr}
  .hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:64px;align-items:start}
  .wordmark .aps{font-size:26px}
}

@media (min-width:1400px){:root{--max:1260px}}

/* ==========================================================================
   Componentes de páginas internas
   ========================================================================== */

/* Cabecera de página interna */
.page-head{padding:44px 0 0;border-bottom:1px solid var(--rule)}
.page-head .crumb{font-size:12px;font-weight:500;color:var(--ink-3);margin-bottom:22px;
  display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.page-head .crumb a:hover{color:var(--brand)}
.page-head .crumb i{font-style:normal;color:var(--rule-2)}
.page-head h1{margin:18px 0 22px;max-width:20ch}
.page-head .lead{max-width:62ch;padding-bottom:48px}

/* Bloques numerados grandes */
.stack{border-top:1px solid var(--rule)}
.stack-item{padding:38px 0;border-bottom:1px solid var(--rule);display:grid;gap:16px}
.stack-n{font-family:var(--serif);font-size:2.6rem;font-weight:400;color:var(--brand);
  line-height:.9;opacity:.32;font-variant-numeric:tabular-nums}
.stack-item h3{font-size:clamp(1.25rem,3.6vw,1.6rem)}
.stack-item .kicker{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--brand);margin-bottom:-6px}
.stack-item p{color:var(--ink-2);max-width:66ch}
.stack-item p+p{margin-top:12px}
.stack-item .aside{border-left:2px solid var(--rule-2);padding-left:18px;font-size:.92rem;color:var(--ink-3)}

/* Etiquetas de convención */
.tags{display:grid;gap:1px;background:var(--rule);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.tag-row{background:var(--paper);padding:20px 22px;display:grid;gap:8px}
.band-alt .tag-row{background:var(--paper-alt)}
.tag-key{display:inline-block;align-self:start;font-size:11px;font-weight:700;letter-spacing:.12em;
  color:var(--brand);border:1px solid var(--brand);padding:4px 10px;border-radius:2px;white-space:nowrap}
.tag-row p{font-size:.94rem;color:var(--ink-2)}

/* Tabla institucional */
.tbl{width:100%;border-collapse:collapse;font-size:.92rem;margin-top:8px}
.tbl th{text-align:left;font-size:11px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  color:var(--ink-3);padding:0 16px 12px 0;border-bottom:1px solid var(--rule-2);vertical-align:bottom}
.tbl td{padding:16px 16px 16px 0;border-bottom:1px solid var(--rule);color:var(--ink-2);vertical-align:top}
.tbl td:first-child{color:var(--ink);font-weight:600;width:34%}
.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}

/* Dos columnas de texto */
.two-col{display:grid;gap:26px}
.two-col p{color:var(--ink-2)}

/* Nota honesta / delimitación */
.frame{border:1px solid var(--rule-2);padding:26px 24px;background:var(--paper)}
.band-alt .frame{background:#fff}
.frame h3{margin-bottom:12px}
.frame p{color:var(--ink-2)}
.frame p+p{margin-top:12px}

/* Referencias */
.refs{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.refs span{font-size:12.5px;color:var(--ink-2);border:1px solid var(--rule-2);padding:7px 13px;border-radius:2px}

@media (min-width:720px){
  .page-head{padding:60px 0 0}
  .stack-item{grid-template-columns:88px 1fr;gap:28px;padding:46px 0}
  .stack-n{font-size:3.2rem;padding-top:4px}
  .tag-row{grid-template-columns:210px 1fr;gap:24px;align-items:start;padding:22px 26px}
  .two-col{grid-template-columns:1fr 1fr;gap:44px}
  .frame{padding:34px 34px}
}
@media (min-width:1024px){
  .page-head{padding:76px 0 0}
  .stack-item{grid-template-columns:110px 1fr;gap:40px;padding:54px 0}
  .stack-n{font-size:3.6rem}
}

/* Regiones: el contenedor no se desvanece; el escalonado ocurre chip a chip */
.terr.rv{opacity:1;transform:none;transition:none}
.terr span{
  opacity:0;transform:translateY(16px) scale(.94);
  transition:opacity .55s var(--ease),transform .55s var(--ease),
             border-color .25s var(--ease),color .25s var(--ease),
             background .25s var(--ease),box-shadow .25s var(--ease);
}
.terr.in span{opacity:1;transform:none}
.terr.in span:nth-child(1){transition-delay:.05s}
.terr.in span:nth-child(2){transition-delay:.14s}
.terr.in span:nth-child(3){transition-delay:.23s}
.terr.in span:nth-child(4){transition-delay:.32s}
.terr.in span:nth-child(5){transition-delay:.41s}
.terr.in span:nth-child(6){transition-delay:.50s}
.terr.in span:nth-child(7){transition-delay:.59s}
.terr.in span:nth-child(8){transition-delay:.68s}
.terr.in span:nth-child(9){transition-delay:.77s}
.terr.in span:nth-child(10){transition-delay:.86s}
.terr.in span:nth-child(11){transition-delay:.95s}
.terr.in span:nth-child(12){transition-delay:1.04s}
@media (hover:hover) and (pointer:fine){
  .terr span:hover{border-color:var(--brand);color:var(--brand);background:var(--brand-soft);
    transform:translateY(-3px);box-shadow:0 8px 20px -12px rgba(20,24,26,.35)}
}
@media (prefers-reduced-motion:reduce){
  .terr span{opacity:1!important;transform:none!important;transition:none!important}
}

/* Cifras: elevación al pasar el cursor, igual que el resto de los bloques */
.cred{transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
@media (hover:hover) and (pointer:fine){
  .cred:hover{transform:translateY(-4px)}
  .cred:hover b{color:var(--brand-2)}
}

/* La "L" de A.L.D.O.: acento de la misma familia cromática, no un segundo color de marca */
.ald-l{color:var(--accent);font-weight:inherit}
.cta-band .ald-l,.site-foot .ald-l,.cell.feat .ald-l,.arch-rail .ald-l{color:var(--accent-on-dark)}

/* Identificación de persona dentro de una celda */
.who{margin-top:18px;font-family:var(--serif);font-size:1.02rem;color:var(--ink);line-height:1.35}
.who span{display:block;margin-top:4px;font-family:var(--sans);font-size:11px;font-weight:600;
  letter-spacing:.10em;text-transform:uppercase;color:var(--ink-3)}
.cell .more.ext{margin-top:12px}

/* Línea de posición: una afirmación breve que sostiene el bloque que la rodea.
   Serif, regla de marca a la izquierda, sin adorno. */
.stance{margin-top:26px;padding-left:18px;border-left:2px solid var(--brand);
  font-family:var(--serif);font-size:1.18rem;line-height:1.45;color:var(--ink);max-width:46ch}
.stance em{font-style:italic;color:var(--brand-2)}
.band-alt .stance,.sec-head .stance{margin-top:22px}
@media (min-width:720px){ .stance{font-size:1.32rem} }
/* Sobre fondo oscuro o de marca */
.cta-band .stance{border-left-color:rgba(255,255,255,.45);color:#fff}
.cta-band .stance em{color:var(--accent-on-dark)}

/* Glosa de la sigla en el pie. Nombre de fantasía, no razón social:
   por eso va bajo la marca y no dentro de la línea de copyright. */
.foot-gloss{margin-top:12px;font-size:10px;font-weight:600;letter-spacing:.22em;
  text-transform:uppercase;color:rgba(255,255,255,.34);line-height:1.6}

/* ==========================================================================
   ACUERDOS DE CONFIDENCIALIDAD  ·  /nda-es  /nda-en  /nda-pt
   Componentes propios de las tres páginas legales. Prefijo nda- para que
   ningún nombre choque con el resto del sistema.
   ========================================================================== */
.nda-ver{display:inline-block;margin-top:18px;padding:6px 14px;border:1px solid var(--rule-2);
  background:var(--paper-alt);color:var(--ink-2);font-size:11px;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase}
.nda-langs{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:20px;
  font-size:12.5px;color:var(--ink-3)}
.nda-langs a{font-weight:600;color:var(--brand);border-bottom:1px solid transparent;
  transition:border-color .2s var(--ease)}
.nda-langs a:hover{border-bottom-color:var(--brand)}
.nda-langs b{font-weight:600;color:var(--ink-3)}

.nda-steps{display:grid;gap:1px;background:var(--rule);border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule);margin-top:36px}
@media (min-width:720px){ .nda-steps{grid-template-columns:repeat(3,1fr)} }
.nda-step{background:var(--paper);padding:24px 22px;transition:transform .3s var(--ease),
  box-shadow .3s var(--ease),background .3s var(--ease)}
.nda-step i{display:block;font-style:normal;font-family:var(--serif);font-size:1.5rem;
  color:var(--brand);line-height:1;margin-bottom:12px}
.nda-step b{display:block;font-size:15px;font-weight:600;margin-bottom:6px}
.nda-step span{display:block;font-size:13.5px;color:var(--ink-2);line-height:1.6}
@media (hover:hover) and (pointer:fine){
  .nda-step:hover{transform:translateY(-4px);box-shadow:0 14px 30px -20px rgba(20,24,26,.4);
    background:var(--paper-warm);position:relative;z-index:1}
}

/* Caja del texto legal: se lee en la página, no detrás de un enlace.
   Es la diferencia entre un clickwrap y un browsewrap. */
.nda-legal{margin-top:38px;border:1px solid var(--rule-2);background:var(--paper)}
.nda-legal-head{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:15px 22px;
  border-bottom:1px solid var(--rule);background:var(--paper-alt)}
.nda-legal-head b{flex:1;font-size:13.5px;font-weight:600;min-width:200px}
.nda-legal-head span{font-size:10.5px;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink-3)}
.nda-scroll{max-height:420px;overflow-y:auto;padding:26px 24px;
  scrollbar-width:thin;scrollbar-color:var(--rule-2) var(--paper)}
.nda-scroll::-webkit-scrollbar{width:9px}
.nda-scroll::-webkit-scrollbar-track{background:var(--paper-alt)}
.nda-scroll::-webkit-scrollbar-thumb{background:var(--rule-2)}
.nda-scroll h3{font-size:13px;font-weight:600;color:var(--brand);margin:22px 0 8px;
  letter-spacing:.01em}
.nda-scroll h3:first-child{margin-top:0}
.nda-scroll p{font-size:13.8px;line-height:1.72;color:var(--ink-2);margin-bottom:10px;
  text-align:justify;hyphens:auto;-webkit-hyphens:auto}
.nda-legal-foot{padding:13px 22px;border-top:1px solid var(--rule);background:var(--paper-alt);
  font-size:11.5px;color:var(--ink-3);text-align:center}

/* Formulario de declaración y aceptación */
.nda-form{margin-top:38px;border:1px solid var(--rule-2);background:var(--paper);padding:30px 26px}
.nda-form h2{font-size:1.3rem;margin-bottom:20px}
.nda-grid{display:grid;grid-template-columns:1fr;gap:18px}
@media (min-width:720px){ .nda-grid{grid-template-columns:1fr 1fr} }
.nda-field{display:flex;flex-direction:column;gap:7px}
.nda-field.full{grid-column:1/-1}
.nda-field label{font-size:10.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-3)}
.nda-field label em{font-style:normal;color:var(--brand)}
.nda-form input[type=text],.nda-form input[type=email]{width:100%;padding:12px 14px;
  border:1px solid var(--rule-2);background:var(--paper);color:var(--ink);font:inherit;
  font-size:15px;border-radius:2px;transition:border-color .2s,box-shadow .2s}
.nda-form input::placeholder{color:var(--ink-3)}
.nda-form input:focus{outline:0;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.nda-form input.bad{border-color:var(--st-sin);box-shadow:0 0 0 3px var(--st-sin-bg)}
.nda-hint{font-size:12px;color:var(--ink-3)}

.nda-check{display:flex;gap:13px;align-items:flex-start;margin-top:20px;padding:15px 17px;
  background:var(--paper-alt);border:1px solid var(--rule);cursor:pointer;
  transition:border-color .2s var(--ease)}
.nda-check:hover{border-color:var(--brand)}
.nda-check.bad{border-color:var(--st-sin)}
.nda-check input{appearance:none;-webkit-appearance:none;width:20px;height:20px;flex:0 0 20px;
  margin-top:2px;border:1.6px solid var(--rule-2);background:var(--paper);cursor:pointer;
  position:relative;border-radius:2px;transition:.2s}
.nda-check input:checked{background:var(--brand);border-color:var(--brand)}
.nda-check input:checked::after{content:"";position:absolute;left:6px;top:2px;width:5px;height:10px;
  border:solid #fff;border-width:0 2.4px 2.4px 0;transform:rotate(45deg)}
.nda-check span{font-size:14px;color:var(--ink-2);line-height:1.6;text-align:justify}

.nda-privacy{margin-top:24px;padding:17px 19px;background:var(--paper-alt);
  border-left:2px solid var(--brand)}
.nda-privacy b{display:block;font-size:10.5px;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;color:var(--brand);margin-bottom:8px}
.nda-privacy p{font-size:12.8px;color:var(--ink-3);line-height:1.7;text-align:justify}
.nda-mono{font-family:ui-monospace,Menlo,Consolas,monospace}

.nda-actions{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-top:26px}
.nda-err{font-size:13.5px;color:var(--st-sin);display:none}
.nda-err.on{display:block}

.nda-done{display:none;margin-top:26px;padding:22px 24px;background:var(--st-hecho-bg);
  border-left:3px solid var(--st-hecho)}
.nda-done.on{display:block}
.nda-done b{display:block;font-size:15.5px;margin-bottom:8px;color:var(--ink)}
.nda-done p{font-size:14px;color:var(--ink-2);line-height:1.65}
.nda-fallback{margin-top:16px}
.nda-fallback textarea{width:100%;height:190px;padding:14px;border:1px solid var(--rule-2);
  background:var(--paper);color:var(--ink-2);font-family:ui-monospace,Menlo,Consolas,monospace;
  font-size:12.3px;line-height:1.6;resize:vertical;border-radius:2px}
.nda-fallback .row{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:10px}
.nda-btn2{padding:9px 18px;border:1px solid var(--rule-2);background:none;color:var(--ink);
  font:inherit;font-size:13px;cursor:pointer;border-radius:2px;transition:.2s var(--ease)}
.nda-btn2:hover{border-color:var(--brand);color:var(--brand)}
.nda-note{margin-top:26px;font-size:12.5px;color:var(--ink-3);line-height:1.7;max-width:70ch}

/* Lema institucional */
.motto{margin-top:16px;font-family:var(--serif);font-size:13.5px;font-style:italic;
  color:var(--ink-3);line-height:1.5;max-width:30ch}
.site-foot .motto{color:rgba(255,255,255,.55)}

/* ---------- Estados de un juicio ---------- */
.states{display:grid;gap:1px;background:var(--rule);border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule);margin-top:30px}
.state{background:var(--paper);padding:24px 22px;position:relative}
.band-alt .state{background:var(--paper-alt)}
.state-k{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.state-dot{width:9px;height:9px;border-radius:50%;flex:0 0 9px;background:var(--brand)}
.state-dot.open{background:transparent;border:2px solid var(--brand)}
.state-dot.watch{background:var(--brand);box-shadow:0 0 0 4px var(--brand-soft)}
.state-name{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--brand)}
.state p{font-size:.94rem;color:var(--ink-2)}
.state .what{margin-top:12px;font-size:.86rem;color:var(--ink-3);border-left:2px solid var(--rule-2);padding-left:14px}

/* ---------- Indicadores ---------- */
.kpi{border-top:1px solid var(--rule)}
.kpi-row{padding:22px 0;border-bottom:1px solid var(--rule);display:grid;gap:8px}
.kpi-row b{font-size:.98rem;font-weight:600;color:var(--ink)}
.kpi-row p{font-size:.93rem;color:var(--ink-2)}
.kpi-row .unit{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--brand)}

/* ---------- Curva de acervo ---------- */
.curve{border:1px solid var(--rule);background:var(--paper);padding:26px 22px;margin-top:30px}
.band-alt .curve{background:#fff}
.curve svg{width:100%;height:auto;display:block;overflow:visible}
.curve figcaption{margin-top:16px;font-size:.86rem;color:var(--ink-3);line-height:1.65}
.curve .cv-line{fill:none;stroke:var(--brand);stroke-width:2;stroke-linecap:round;
  stroke-dasharray:600;stroke-dashoffset:600;transition:stroke-dashoffset 2.4s var(--ease)}
.curve.in .cv-line{stroke-dashoffset:0}
.curve .cv-flat{fill:none;stroke:var(--rule-2);stroke-width:2;stroke-dasharray:4 5}
.curve .cv-axis{stroke:var(--rule-2);stroke-width:1}
.curve .cv-lab{font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.06em;fill:var(--ink-3)}
.curve .cv-lab-b{fill:var(--brand)}
.curve .cv-node{fill:var(--brand);opacity:0;transition:opacity .5s var(--ease)}
.curve.in .cv-node{opacity:1}
.curve.in .cv-node:nth-of-type(1){transition-delay:.8s}
.curve.in .cv-node:nth-of-type(2){transition-delay:1.3s}
.curve.in .cv-node:nth-of-type(3){transition-delay:1.8s}
@media (prefers-reduced-motion:reduce){
  .curve .cv-line{stroke-dashoffset:0!important;transition:none}
  .curve .cv-node{opacity:1!important;transition:none}
}

@media (min-width:720px){
  .states{grid-template-columns:repeat(2,1fr)}
  .kpi-row{grid-template-columns:180px 1fr;gap:24px;align-items:start;padding:24px 0}
  .kpi-row .unit{padding-top:3px}
  .curve{padding:34px 32px}
}
@media (min-width:1024px){
  .states{grid-template-columns:repeat(4,1fr)}
}

/* ==========================================================================
   Codificación cromática de estado epistémico y de confianza
   Verificada con validador: todas las combinaciones superan 4.5:1 de
   contraste de texto sobre su propio tinte y sobre papel. El color nunca
   porta el significado por sí solo: la palabra siempre está presente.
   ========================================================================== */

:root{
  /* Estado de una afirmación (paleta de estado, significado reservado) */
  --st-hecho:      #245F3B;  --st-hecho-bg:  #EAF1EC;
  --st-infer:      #2F5170;  --st-infer-bg:  #E9EEF3;
  --st-espec:      #8A5B12;  --st-espec-bg:  #F5EEE0;
  --st-sin:        #9A3B2A;  --st-sin-bg:    #F5EAE7;
  --st-nv:         #5F6560;  --st-nv-bg:     #EEEFEE;

  /* Rampa ordinal de confianza: un solo tono, cuatro pasos monótonos */
  --cf-1: #2C392C;  /* alta       */
  --cf-2: #496046;  /* media-alta */
  --cf-3: #6E8869;  /* media      */
  --cf-4: #9CB097;  /* baja       */
}

.tag-key{
  display:inline-flex;align-items:center;gap:8px;align-self:start;
  font-size:11px;font-weight:700;letter-spacing:.12em;
  padding:6px 12px 6px 10px;border-radius:2px;white-space:nowrap;
  border:1px solid transparent;border-left-width:3px;
  color:var(--brand);background:var(--brand-soft);border-left-color:var(--brand);
}
.tag-key::before{content:"";width:7px;height:7px;border-radius:50%;
  background:currentColor;flex:0 0 7px}

.tag-hecho{color:var(--st-hecho);background:var(--st-hecho-bg);border-left-color:var(--st-hecho)}
.tag-infer{color:var(--st-infer);background:var(--st-infer-bg);border-left-color:var(--st-infer)}
.tag-espec{color:var(--st-espec);background:var(--st-espec-bg);border-left-color:var(--st-espec)}
.tag-sin  {color:var(--st-sin);  background:var(--st-sin-bg);  border-left-color:var(--st-sin)}
.tag-nv   {color:var(--st-nv);   background:var(--st-nv-bg);   border-left-color:var(--st-nv)}
/* Círculo hueco para lo no verificable: ausencia de evidencia, no falla */
.tag-nv::before{background:transparent;box-shadow:inset 0 0 0 2px currentColor}

/* Fila del listado, con filete izquierdo del mismo estado */
.tag-row{border-left:3px solid transparent;transition:border-left-color .25s var(--ease)}
.tag-row.r-hecho{border-left-color:var(--st-hecho)}
.tag-row.r-infer{border-left-color:var(--st-infer)}
.tag-row.r-espec{border-left-color:var(--st-espec)}
.tag-row.r-sin  {border-left-color:var(--st-sin)}
.tag-row.r-nv   {border-left-color:var(--st-nv)}

/* ---------- Medidor de confianza ---------- */
.meter{display:inline-flex;gap:3px;align-items:center}
.meter i{display:block;width:16px;height:6px;border-radius:1px;background:var(--rule-2)}
.meter.m4 i:nth-child(-n+4){background:var(--cf-1)}
.meter.m3 i:nth-child(-n+3){background:var(--cf-2)}
.meter.m2 i:nth-child(-n+2){background:var(--cf-3)}
.meter.m1 i:nth-child(-n+1){background:var(--cf-4)}
.cf-name{font-weight:600}
.cf-name.c1{color:var(--cf-1)}
.cf-name.c2{color:var(--cf-2)}
.cf-name.c3{color:#5A7455}
.cf-name.c4{color:#6E8869}
.tbl td .meter{margin-top:8px}

@media (min-width:720px){
  .tag-key{padding:7px 14px 7px 11px}
}

/* ---------- Maqueta de documento (estructura del SITREP) ---------- */
.docmock{border:1px solid var(--rule-2);background:var(--paper);margin-top:32px}
.band-alt .docmock{background:#fff}
.docmock-head{padding:18px 22px;border-bottom:1px solid var(--rule);display:flex;
  flex-wrap:wrap;gap:10px 18px;align-items:baseline;justify-content:space-between}
.docmock-head b{font-family:var(--serif);font-size:1.05rem;font-weight:600}
.docmock-head span{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3)}
.docmock-body{padding:6px 22px 22px}
.dm-block{padding:18px 0;border-bottom:1px solid var(--rule)}
.dm-block:last-child{border-bottom:0}
.dm-lab{font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--brand);margin-bottom:8px}
.dm-line{height:8px;border-radius:1px;background:var(--rule);margin:7px 0}
.dm-line.w90{width:90%}.dm-line.w75{width:75%}.dm-line.w60{width:60%}.dm-line.w45{width:45%}
.dm-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:10px}
.dm-note{font-size:.88rem;color:var(--ink-2);margin-top:8px}

/* ---------- Franja de fuentes ---------- */
.srcs{display:grid;gap:1px;background:var(--rule);border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule);margin-top:30px}
.src{background:var(--paper);padding:24px 22px}
.band-alt .src{background:var(--paper-alt)}
.src b{display:block;font-family:var(--serif);font-size:1.12rem;font-weight:600;margin-bottom:8px}
.src p{font-size:.92rem;color:var(--ink-2)}
.src .tick{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--brand);display:block;margin-bottom:12px}

/* ---------- Horario de entrega ---------- */
.sked{display:grid;gap:1px;background:var(--rule);border:1px solid var(--rule);margin-top:30px}
.sk{background:var(--paper);padding:26px 24px}
.band-alt .sk{background:#fff}
.sk-h{font-family:var(--serif);font-size:2rem;font-weight:400;color:var(--brand);line-height:1}
.sk-n{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-3);margin:10px 0 8px}
.sk p{font-size:.93rem;color:var(--ink-2)}

@media (min-width:720px){
  .srcs{grid-template-columns:repeat(3,1fr)}
  .sked{grid-template-columns:1fr 1fr}
  .docmock-body{padding:6px 30px 26px}
  .docmock-head{padding:20px 30px}
}

/* ---------- Elevación uniforme en todos los bloques ---------- */
.src,.sk,.state,.tag-row,.stack-item,.kpi-row,.std-item{
  position:relative;z-index:1;
  transition:transform .32s var(--ease),box-shadow .32s var(--ease),background .28s var(--ease);
}
@media (hover:hover) and (pointer:fine){
  .src:hover,.sk:hover,.state:hover{
    z-index:3;background:var(--paper);
    transform:translateY(-6px) scale(1.014);
    box-shadow:0 18px 42px -18px rgba(20,24,26,.22), 0 2px 8px -4px rgba(20,24,26,.10);
  }
  .band-alt .src:hover,.band-alt .sk:hover,.band-alt .state:hover{background:#fff}
  .src:hover b,.state:hover .state-name{color:var(--brand)}
  .tag-row:hover,.stack-item:hover,.kpi-row:hover,.std-item:hover{
    background:rgba(44,57,44,.028);
  }
  .stack-item:hover .stack-n{opacity:.55;transition:opacity .3s var(--ease)}
}
.stack-n{transition:opacity .3s var(--ease)}
@media (prefers-reduced-motion:reduce){
  .src,.sk,.state,.tag-row,.stack-item,.kpi-row,.std-item{transition:none!important}
  .src:hover,.sk:hover,.state:hover{transform:none!important;box-shadow:none!important}
}

/* ---------- Escalas de fiabilidad y credibilidad ---------- */
.scales{display:grid;gap:26px;margin-top:30px}
.scale{border:1px solid var(--rule)}
.scale-h{padding:16px 20px;border-bottom:1px solid var(--rule);background:var(--paper-alt)}
.band-alt .scale-h{background:#fff}
.scale-h b{display:block;font-family:var(--serif);font-size:1.05rem;font-weight:600}
.scale-h span{display:block;margin-top:4px;font-size:11px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink-3)}
.scale-r{display:grid;grid-template-columns:44px 1fr;gap:14px;padding:12px 20px;
  border-bottom:1px solid var(--rule);align-items:baseline}
.scale-r:last-child{border-bottom:0}
.scale-k{font-weight:700;font-size:.98rem;color:var(--brand);font-variant-numeric:tabular-nums}
.scale-r p{font-size:.9rem;color:var(--ink-2)}
@media (min-width:860px){ .scales{grid-template-columns:1fr 1fr;gap:1px;background:var(--rule)} }

/* ---------- Diagrama de arquitectura por capas ---------- */
.arch{margin-top:34px;border:1px solid var(--rule);background:var(--paper)}
.band-alt .arch{background:#fff}
.arch-grid{display:grid;grid-template-columns:1fr}
.arch-flow{padding:6px 0}
.arch-step{padding:20px 22px;border-bottom:1px solid var(--rule);position:relative}
.arch-step:last-child{border-bottom:0}
.arch-n{font-size:10.5px;font-weight:700;letter-spacing:.18em;color:var(--brand);
  display:block;margin-bottom:7px}
.arch-step b{display:block;font-family:var(--serif);font-size:1.1rem;font-weight:600;margin-bottom:6px}
.arch-step p{font-size:.91rem;color:var(--ink-2)}
.arch-rail{background:var(--brand);color:#fff;padding:26px 22px;display:flex;
  flex-direction:column;justify-content:center}
.arch-rail .lab{font-size:10.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  color:rgba(255,255,255,.75);margin-bottom:10px}
.arch-rail b{display:block;font-family:var(--serif);font-size:1.35rem;font-weight:500;
  color:#fff;margin-bottom:12px;line-height:1.2}
.arch-rail p{font-size:.9rem;color:rgba(255,255,255,.82);line-height:1.7}
.arch-rail .ticks{margin-top:16px;display:flex;flex-direction:column;gap:7px}
.arch-rail .ticks span{font-size:11.5px;color:rgba(255,255,255,.72);
  padding-left:14px;position:relative}
.arch-rail .ticks span::before{content:"";position:absolute;left:0;top:9px;
  width:6px;height:1px;background:rgba(255,255,255,.5)}

@media (min-width:860px){
  .arch-grid{grid-template-columns:1fr 320px}
  .arch-rail{border-left:1px solid var(--rule)}
}

/* ---------- Modalidades ---------- */
.modes{display:grid;gap:1px;background:var(--rule);border:1px solid var(--rule);margin-top:30px}
.mode{background:var(--paper);padding:30px 24px;position:relative;z-index:1;
  transition:transform .32s var(--ease),box-shadow .32s var(--ease),background .28s var(--ease)}
.band-alt .mode{background:#fff}
.mode .lvl{font-size:10.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  color:var(--brand);display:block;margin-bottom:12px}
.mode h3{margin-bottom:10px}
.mode p{font-size:.94rem;color:var(--ink-2)}
.mode .give{margin-top:16px;padding-top:14px;border-top:1px solid var(--rule)}
.mode .give i{display:block;font-style:normal;font-size:10.5px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);margin-bottom:5px}
.mode .give span{font-size:.9rem;color:var(--ink-2)}
@media (hover:hover) and (pointer:fine){
  .mode:hover{z-index:3;transform:translateY(-6px) scale(1.014);
    box-shadow:0 18px 42px -18px rgba(20,24,26,.22), 0 2px 8px -4px rgba(20,24,26,.10)}
  .mode:hover h3{color:var(--brand)}
}
@media (min-width:860px){ .modes{grid-template-columns:repeat(3,1fr)} }

/* ---------- Elevación en el diagrama de arquitectura ---------- */
.arch-step{position:relative;z-index:1;
  transition:transform .32s var(--ease),box-shadow .32s var(--ease),background .28s var(--ease)}
@media (hover:hover) and (pointer:fine){
  .arch-step:hover{z-index:3;background:var(--paper);
    transform:translateY(-5px) scale(1.012);
    box-shadow:0 16px 38px -18px rgba(20,24,26,.22), 0 2px 8px -4px rgba(20,24,26,.10)}
  .band-alt .arch-step:hover{background:#fff}
  .arch-step:hover b{color:var(--brand)}
  .arch-step b{transition:color .28s var(--ease)}
}
@media (prefers-reduced-motion:reduce){
  .arch-step{transition:none!important}
  .arch-step:hover{transform:none!important;box-shadow:none!important}
}

/* ==========================================================================
   Idioma. Este bloque va SIEMPRE al final del archivo y usa prioridad
   explícita: varias reglas de componente fijan display en elementos que
   además llevan data-l, y con igual especificidad ganaba la última escrita,
   dejando los dos idiomas visibles a la vez.
   ========================================================================== */
body.lang-es [data-l="en"],
body.lang-es [data-l="pt"]{display:none!important}
body.lang-en [data-l="es"]:not(.fb-en),
body.lang-en [data-l="pt"]{display:none!important}
body.lang-pt [data-l="es"]:not(.fb-pt),
body.lang-pt [data-l="en"]{display:none!important}

/* ---------- Celda destacada ---------- */
.cell.feat{background:var(--brand);color:#fff}
.band-alt .cell.feat{background:var(--brand)}
.cell.feat h3{color:#fff}
.cell.feat p{color:rgba(255,255,255,.82)}
.cell.feat .cell-num{color:rgba(255,255,255,.78)}
.cell.feat .more{color:#fff}
@media (hover:hover) and (pointer:fine){
  .cell.feat:hover{background:var(--brand)}
  .cell.feat:hover h3{color:#fff}
  .cell.feat::before{background:#fff}
}

/* ==========================================================================
   IDIOMA — este bloque debe permanecer SIEMPRE al final del archivo.
   Los componentes que fijan display sobre elementos con data-l ganarían
   por orden de cascada si estas reglas se declararan antes.
   ========================================================================== */
body.lang-es [data-l="en"],
body.lang-es [data-l="pt"]{display:none!important}
body.lang-en [data-l="es"]:not(.fb-en),
body.lang-en [data-l="pt"]{display:none!important}
body.lang-pt [data-l="es"]:not(.fb-pt),
body.lang-pt [data-l="en"]{display:none!important}
