/* N2b · Tinta con el tríptico de la opción 1 debajo de las letras. Se carga después de n2.css.
   El tríptico conserva su aspecto de la opción 1: Instrument Serif, hueso y botón ámbar. */
.tri-sala{--display:"Instrument Serif",Georgia,serif;--fg:#EEE4D3;--mute:#A69686;--line-fuerte:#4a3c31;--btn-bg:#D9922E;--btn-fg:#120d09;
  position:relative;height:100svh;min-height:640px;overflow:hidden;background:#000;color:var(--fg)}
.tri-sala .tri{position:absolute;inset:0;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:0 10px}
.tri-sala .panel{position:relative;overflow:hidden;background:#0f0c0a}
.tri-sala .panel video{width:100%;height:100%;object-fit:cover;filter:saturate(.85) contrast(1.06)}
.tri-sala .panel span{position:absolute;left:18px;bottom:16px;font-family:var(--display);font-style:italic;font-size:20px;text-shadow:0 2px 14px #000}
.tri-sala::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.72) 0%,transparent 22%,transparent 46%,rgba(0,0,0,.9) 100%)}
.tri-sala .titulo{position:absolute;left:0;right:0;bottom:7vh;z-index:3;text-align:center;padding:0 24px}
.tri-sala .titulo p{font-family:var(--display);font-style:italic;font-size:22px;color:var(--mute)}
.tri-sala .titulo h2{font-family:var(--display);font-weight:400;font-size:clamp(72px,13vw,210px);line-height:.84;letter-spacing:-.02em;text-transform:none;margin:6px 0 26px}
.tri-sala .titulo .ctas{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.tri-sala .pausa{z-index:4}
/* Las tres pantallas se abren cuando el tríptico entra en pantalla (en la opción 1 lo hacían al cargar) */
.tri-sala.espera .panel{clip-path:inset(50% 0 50% 0)}
.tri-sala.espera .titulo{opacity:0}
.tri-sala.visto .panel{clip-path:inset(50% 0 50% 0);animation:tri-abre 1.4s cubic-bezier(.7,0,.2,1) forwards}
.tri-sala.visto .panel:nth-child(2){animation-delay:.18s}.tri-sala.visto .panel:nth-child(3){animation-delay:.36s}
.tri-sala.visto .titulo{opacity:0;animation:tri-aparece 1s ease .9s forwards}
@keyframes tri-abre{to{clip-path:inset(0 0 0 0)}}
@keyframes tri-aparece{to{opacity:1}}
@media (max-width:820px){.tri-sala .tri{grid-template-columns:1fr;padding:0}.tri-sala .panel:nth-child(n+2){display:none}.tri-sala .titulo h2{font-size:64px}}
/* N2c · el mismo tríptico con la letra y el botón de la opción 2 */
.tri-sala.tinta{--display:"Big Shoulders Display",Impact,sans-serif;--fg:#F2EEE6;--mute:#8f8a82;--line-fuerte:#4a4743;--btn-bg:#F2EEE6;--btn-fg:#000}
.tri-sala.tinta .panel span{font-style:normal;font-weight:800;font-size:22px;text-transform:uppercase;letter-spacing:.04em}
.tri-sala.tinta .titulo p{font-family:var(--body);font-style:normal;font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.tri-sala.tinta .titulo h2{font-weight:900;text-transform:uppercase;letter-spacing:0;font-size:clamp(72px,12vw,190px)}
@media (max-width:820px){.tri-sala.tinta .titulo h2{font-size:64px}}
/* N2c · la firma de abajo entera (sin cortar la parte de arriba de las letras) y pasando sola */
.n2c .firma{line-height:1;text-align:left}
.n2c .firma .pista{display:inline-flex;animation:firma-pasa 18s linear infinite;will-change:transform}
.n2c .firma .pista>span{padding-right:.3em}
.n2c .firma:hover .pista{animation-play-state:paused}
@keyframes firma-pasa{to{transform:translateX(-50%)}}
/* N2c · menos negro entre bloques (Ramón, 04/10): secciones más juntas y «Tu idea en tinta» del alto de sus letras */
.n2c .sec{padding-top:96px}
.n2c .cinta{margin-top:80px}
.n2c .cierre{height:auto;min-height:0;margin-top:96px;place-items:stretch}
.n2c .recorte2{position:relative;inset:auto;width:100%;padding:4vh 0}
.n2c .firma{margin-top:96px}
@media (max-width:820px){.n2c .sec{padding-top:64px}.n2c .cinta{margin-top:56px}.n2c .cierre{height:auto;margin-top:64px}.n2c .recorte2{padding:3vh 0}.n2c .firma{margin-top:64px}}
/* N2c · en la portada, el nombre de cada servicio lleva a su página */
.n2c .s-cab h3 a span{font-size:inherit;color:var(--mute);display:inline-block;transition:transform .25s}
.n2c .s-cab h3 a:hover span{transform:translateX(4px);color:var(--fg)}