/* site.css · Branding Creators Latam · usa SOLO los tokens de tokens.css (sin hex sueltos, sin sombras, sin degradados, sin rebotes) */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--cabecera) + 24px)}
body{margin:0;font-family:var(--fuente);font-size:var(--web-cuerpo);line-height:var(--lh-cuerpo);color:var(--texto);background:var(--fondo);-webkit-font-smoothing:antialiased}
img,video,svg{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3,h4{margin:0;font-weight:var(--bold)}
p{margin:0 0 var(--s-16)}
code,kbd,pre{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.88em}
.salto{position:absolute;left:-999px;top:8px;background:var(--acento);color:var(--sobre-acento);padding:8px 16px;border-radius:var(--r-campo);z-index:200}
.salto:focus{left:8px}
:focus-visible{outline:var(--foco-ancho) solid var(--acento);outline-offset:2px;border-radius:4px}

/* ---- cabecera ---- */
.cab{position:sticky;top:0;z-index:100;height:var(--cabecera);background:color-mix(in srgb,var(--fondo) 92%,transparent);backdrop-filter:saturate(180%) blur(16px);border-bottom:var(--borde-ancho) solid var(--borde)}
.cab-in{height:100%;max-width:1360px;margin:auto;padding:0 var(--s-24);display:flex;align-items:center;gap:var(--s-24)}
.cab-logo{display:flex;align-items:center;gap:var(--s-12);text-decoration:none;flex:none}
.cab-logo span{font-size:var(--t-15);color:var(--texto-2);border-left:var(--borde-ancho) solid var(--borde);padding-left:var(--s-12);line-height:1.2}
.logo-oscuro{display:none}[data-theme="dark"] .logo-claro{display:none}[data-theme="dark"] .logo-oscuro{display:block}
.cab-nav{flex:1;min-width:0}
.cab-nav ul{list-style:none;margin:0;padding:0;display:flex;gap:var(--s-4);align-items:center}
.cab-nav>ul>li{position:relative}
.cab-nav>ul>li>a{display:flex;align-items:center;gap:6px;padding:8px 12px;border-radius:var(--r-pill);font-size:var(--t-15);text-decoration:none;color:var(--texto-2);transition:color var(--dur-micro) var(--mov-micro),background var(--dur-micro) var(--mov-micro)}
.cab-nav>ul>li>a:hover{color:var(--texto);background:var(--superficie)}
.cab-nav a[aria-current="page"]{color:var(--texto);background:var(--superficie)}
.chev{width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform var(--dur-micro) var(--mov-micro)}
.has-menu.abierto .chev{transform:rotate(-135deg) translateY(-1px)}
.menu{position:absolute;left:0;top:calc(100% + 8px);min-width:320px;background:var(--elevado);border:var(--borde-ancho) solid var(--borde);border-radius:var(--r-tarjeta);padding:var(--s-8);opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity var(--dur-fundido) var(--mov-micro),transform var(--dur-fundido) var(--mov-micro),visibility 0s linear var(--dur-fundido)}
.has-menu:hover .menu,.has-menu.abierto .menu,.has-menu:focus-within .menu{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.menu a{display:block;padding:10px 14px;border-radius:var(--r-campo);text-decoration:none}
.menu a:hover,.menu a[aria-current="page"]{background:var(--superficie)}
.menu b{display:block;font-size:var(--t-15)}.menu span{display:block;font-size:var(--t-12);color:var(--texto-2);margin-top:2px}
.cab-acc{display:flex;align-items:center;gap:var(--s-8);flex:none}
.ico-btn{width:var(--tocable);height:var(--tocable);border:0;background:transparent;color:var(--texto-2);border-radius:var(--r-pill);display:grid;place-items:center;cursor:pointer;transition:background var(--dur-micro) var(--mov-micro),color var(--dur-micro) var(--mov-micro)}
.ico-btn:hover{background:var(--superficie);color:var(--texto)}
.menu-btn{display:none}
.cajon{position:fixed;inset:var(--cabecera) 0 0 0;z-index:99;background:var(--fondo);overflow:auto;padding:var(--s-24)}
.cajon-in{display:flex;flex-direction:column;gap:var(--s-4);max-width:520px;margin:auto}
.cajon a.m1{font-size:var(--t-24);font-weight:var(--bold);text-decoration:none;padding:var(--s-12) 0;border-top:var(--borde-ancho) solid var(--borde);letter-spacing:var(--trk-24)}
.cajon a.m2{font-size:var(--t-17);color:var(--texto-2);text-decoration:none;padding:6px 0 6px var(--s-16)}
.cajon .btn{margin-top:var(--s-24)}
@media (max-width:1100px){.cab-nav,.cab-dl{display:none}.menu-btn{display:grid}.cab-acc{margin-left:auto}}

/* ---- buscador ---- */
.buscar{position:fixed;inset:0;z-index:300;background:color-mix(in srgb,var(--tinta) 40%,transparent);display:grid;justify-items:center;align-items:start;padding:12vh var(--s-16) 0}
.buscar[hidden],.cajon[hidden],.lightbox[hidden]{display:none}
.buscar-caja{width:min(640px,100%);background:var(--elevado);border:var(--borde-ancho) solid var(--borde);border-radius:var(--r-tarjeta);overflow:hidden}
.buscar-caja input{width:100%;border:0;border-bottom:var(--borde-ancho) solid var(--borde);background:transparent;color:var(--texto);font:inherit;font-size:var(--t-19);padding:var(--s-16) var(--s-24);outline:none}
#buscar-res{list-style:none;margin:0;padding:var(--s-8);max-height:50vh;overflow:auto}
#buscar-res a{display:block;padding:10px var(--s-16);border-radius:var(--r-campo);text-decoration:none}
#buscar-res a b{display:block}#buscar-res a span{display:block;font-size:var(--t-12);color:var(--texto-2)}
#buscar-res a:hover,#buscar-res a.sel{background:var(--acento-suave)}
.buscar-pie{display:flex;gap:var(--s-16);margin:0;padding:var(--s-12) var(--s-24);border-top:var(--borde-ancho) solid var(--borde);font-size:var(--t-12);color:var(--texto-2)}
kbd{border:var(--borde-ancho) solid var(--borde);border-radius:4px;padding:0 5px;margin-right:4px;background:var(--superficie);color:var(--texto-2)}

/* ---- disposición ---- */
main{min-height:70vh}
main.con-toc{max-width:1360px;margin:auto;padding:0 var(--s-24);display:grid;grid-template-columns:220px minmax(0,1fr);gap:var(--s-48)}
.toc{position:sticky;top:calc(var(--cabecera) + 32px);align-self:start;padding:var(--s-32) 0;display:flex;flex-direction:column;gap:2px;max-height:calc(100vh - var(--cabecera) - 48px);overflow:auto}
.toc b{font-size:var(--t-12);letter-spacing:var(--trk-eyebrow);text-transform:uppercase;color:var(--texto-2);margin-bottom:var(--s-8)}
.toc a{font-size:var(--t-15);color:var(--texto-2);text-decoration:none;padding:5px 0 5px 14px;border-left:1.5px solid var(--borde);transition:color var(--dur-micro) var(--mov-micro),border-color var(--dur-micro) var(--mov-micro)}
.toc a:hover{color:var(--texto)}.toc a.on{color:var(--texto);border-left-color:var(--acento)}
@media (max-width:1100px){main.con-toc{display:block;padding:0 var(--s-24)}.toc{display:none}}
.contenido{min-width:0}
.wrap{max-width:var(--contenedor);margin-inline:auto;padding-inline:var(--margen-web)}
.con-toc .wrap{padding-inline:0;max-width:none}
.sec{padding:var(--s-64) 0;border-top:var(--borde-ancho) solid var(--borde)}
.sec:first-child,.hero+.sec{border-top:0}
.sec-head{max-width:46em;margin-bottom:var(--s-32)}
.sec-head h2,.h2{font-size:var(--web-h2);letter-spacing:var(--web-h2-trk);line-height:var(--lh-titular)}
h3,.h3{font-size:var(--web-h3);letter-spacing:var(--web-h3-trk);line-height:var(--lh-titulo-24)}
.eyebrow{display:flex;align-items:center;gap:var(--s-8);font-size:var(--web-eyebrow);letter-spacing:var(--trk-eyebrow);text-transform:uppercase;color:var(--texto-2);margin-bottom:var(--s-16);font-weight:var(--bold)}
.lede{font-size:var(--web-bajada);letter-spacing:var(--web-bajada-trk);line-height:var(--lh-bajada);color:var(--texto-2);max-width:var(--medida-bajada);margin-top:var(--s-16)}
.muted{color:var(--texto-2)}.small{font-size:var(--t-15)}.tiny{font-size:var(--t-12)}
/* interruptor que se enciende al llegar a cada sección (la idea de la marca, en la propia página) */
.sw{display:inline-block;width:10px;height:18px;border:1.5px solid var(--control-apagado);border-radius:var(--r-pill);position:relative;flex:none;transition:border-color var(--dur-estado) var(--mov-estado),background var(--dur-estado) var(--mov-estado)}
.sw b{position:absolute;left:1.5px;right:1.5px;bottom:1.5px;height:5px;border-radius:var(--r-pill);background:var(--control-apagado);transition:transform var(--dur-estado) var(--mov-estado),background var(--dur-estado) var(--mov-estado)}
.is-lit .sw,.sw.on{border-color:var(--acento)}.is-lit .sw b,.sw.on b{background:var(--acento);transform:translateY(-7px)}

/* ---- portada de página ---- */
.hero{padding:var(--s-80) 0 var(--s-48)}
.hero h1{font-size:var(--web-h1);letter-spacing:var(--web-h1-trk);line-height:var(--lh-titular);max-width:14em}
.hero .lede{max-width:34em}
.hero-acc{display:flex;flex-wrap:wrap;gap:var(--s-12);margin-top:var(--s-32)}

/* ---- botones ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s-8);min-height:var(--tocable);padding:0 var(--s-24);border-radius:var(--r-pill);border:var(--borde-encendido) solid var(--texto);background:transparent;color:var(--texto);font:inherit;font-size:var(--t-15);font-weight:var(--bold);text-decoration:none;cursor:pointer;transition:background var(--dur-micro) var(--mov-micro),color var(--dur-micro) var(--mov-micro),border-color var(--dur-micro) var(--mov-micro)}
.btn:hover{background:var(--texto);color:var(--fondo)}
.btn-primary{background:var(--acento);border-color:var(--acento);color:var(--sobre-acento)}
.btn-primary:hover{background:var(--acento);border-color:var(--acento);color:var(--sobre-acento);opacity:.9}
.btn-ghost{border-color:var(--borde);color:var(--texto-2)}
.btn-sm{min-height:36px;padding:0 var(--s-16)}
.btn-dl::before{content:"";width:14px;height:14px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12m0 0-5-5m5 5 5-5M4 21h16'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12m0 0-5-5m5 5 5-5M4 21h16'/%3E%3C/svg%3E") center/contain no-repeat}
.acciones{display:flex;flex-wrap:wrap;gap:var(--s-8);margin-top:var(--s-16)}

/* ---- rejillas y tarjetas ---- */
.grid{display:grid;gap:var(--medianil)}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}.g3{grid-template-columns:repeat(3,minmax(0,1fr))}.g4{grid-template-columns:repeat(4,minmax(0,1fr))}.g6{grid-template-columns:repeat(6,minmax(0,1fr))}
.auto{grid-template-columns:repeat(auto-fill,minmax(var(--min,240px),1fr))}
@media (max-width:900px){.g3,.g4{grid-template-columns:repeat(2,minmax(0,1fr))}.g6{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:620px){.g2,.g3,.g4{grid-template-columns:minmax(0,1fr)}.g6{grid-template-columns:repeat(2,minmax(0,1fr))}}
.card{background:var(--superficie);border-radius:var(--r-tarjeta);padding:var(--s-24);display:flex;flex-direction:column;gap:var(--s-8);text-decoration:none;min-width:0}
.card.line{background:transparent;border:var(--borde-ancho) solid var(--borde)}
a.card{transition:background var(--dur-micro) var(--mov-micro),border-color var(--dur-micro) var(--mov-micro)}a.card:hover{background:var(--acento-suave)}
.card h3{font-size:var(--t-19);letter-spacing:var(--trk-19)}.card p{margin:0;color:var(--texto-2);font-size:var(--t-15)}
.card .n{font-size:var(--t-12);color:var(--texto-2);letter-spacing:var(--trk-eyebrow);text-transform:uppercase;font-weight:var(--bold)}
.panel{background:var(--superficie);border-radius:var(--r-tarjeta);padding:var(--s-32)}
.tag{display:inline-block;font-size:var(--t-12);padding:2px 10px;border-radius:var(--r-pill);border:var(--borde-ancho) solid var(--borde);color:var(--texto-2)}
.tag.on{background:var(--acento-suave);border-color:var(--acento);color:var(--acento-texto)}

/* ---- figuras y capturas ---- */
.fig{margin:0;min-width:0}
.fig figcaption{font-size:var(--t-15);color:var(--texto-2);margin-top:var(--s-8)}
.fig figcaption b{color:var(--texto)}
.shot{display:block;width:100%;height:auto;border-radius:var(--r-captura);border:var(--borde-ancho) solid var(--borde);background:var(--superficie)}
[data-zoom]{cursor:zoom-in}
.ratio{position:relative;width:100%;background:var(--superficie);border-radius:var(--r-captura);overflow:hidden;border:var(--borde-ancho) solid var(--borde)}
.ratio>*{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border:0}
.r-16x9{aspect-ratio:16/9}.r-9x16{aspect-ratio:9/16}.r-4x5{aspect-ratio:4/5}.r-1x1{aspect-ratio:1/1}.r-191{aspect-ratio:1.91/1}
.contain>*{object-fit:contain}
/* marco escalado: muestra una plantilla HTML real (data-w / data-h = tamaño original) */
.scaled{position:relative;width:100%;overflow:hidden;border-radius:var(--r-captura);border:var(--borde-ancho) solid var(--borde);background:var(--superficie)}
.scaled iframe{position:absolute;left:0;top:0;border:0;transform-origin:0 0;background:var(--blanco);pointer-events:none}
.scaled.live iframe{pointer-events:auto}

/* ---- bien / mal ---- */
.pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--medianil)}
@media (max-width:700px){.pair{grid-template-columns:minmax(0,1fr)}}
.do,.dont{display:flex;flex-direction:column;gap:var(--s-8);min-width:0}
.do>.badge,.dont>.badge{display:flex;align-items:center;gap:var(--s-8);font-size:var(--t-15);font-weight:var(--bold)}
.badge::before{content:"";width:22px;height:22px;border-radius:var(--r-pill);flex:none;background:var(--texto) center/14px no-repeat}
.do .badge::before{background-color:var(--acento);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E")}
.dont .badge::before{background-color:var(--texto);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.4' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E")}
[data-theme="dark"] .dont .badge::before{background-color:var(--papel);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3.4' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E")}
.do>p,.dont>p{margin:0;font-size:var(--t-15);color:var(--texto-2)}
.dont .shot,.dont .ratio,.dont .scaled{border-color:var(--texto-3)}
.note{border-left:1.5px solid var(--acento);padding:var(--s-4) 0 var(--s-4) var(--s-16);color:var(--texto-2);margin:var(--s-16) 0}

/* ---- colores y valores que se copian ---- */
.swatch{display:flex;flex-direction:column;border:var(--borde-ancho) solid var(--borde);border-radius:var(--r-tarjeta);overflow:hidden;background:var(--elevado);text-align:left;font:inherit;color:inherit;cursor:pointer;padding:0;min-width:0}
.swatch i{display:block;height:var(--alto,96px);background:var(--c);border-bottom:var(--borde-ancho) solid var(--borde)}
.swatch span{display:block;padding:var(--s-12) var(--s-16)}
.swatch b{display:block;font-size:var(--t-15)}.swatch em{display:block;font-style:normal;font-size:var(--t-12);color:var(--texto-2);font-variant-numeric:tabular-nums}
.swatch:hover{border-color:var(--texto-2)}
.copy{font:inherit;font-family:ui-monospace,Menlo,monospace;font-size:.88em;background:var(--superficie);border:var(--borde-ancho) solid var(--borde);border-radius:6px;padding:1px 8px;color:var(--texto);cursor:pointer}
.copy:hover{border-color:var(--acento)}
.code{position:relative;background:var(--superficie);border-radius:var(--r-captura);padding:var(--s-16) var(--s-16);overflow:auto;border:var(--borde-ancho) solid var(--borde);font-size:var(--t-15)}
.code pre{margin:0;white-space:pre}
.code .copy-all{position:absolute;right:10px;top:10px}

/* ---- pestañas ---- */
.tabs{display:flex;gap:var(--s-4);border-bottom:var(--borde-ancho) solid var(--borde);margin-bottom:var(--s-32);overflow:auto}
.tabs button{font:inherit;font-size:var(--t-15);background:transparent;border:0;border-bottom:2px solid transparent;color:var(--texto-2);padding:var(--s-12) var(--s-16);cursor:pointer;margin-bottom:-1px;white-space:nowrap;transition:color var(--dur-micro) var(--mov-micro),border-color var(--dur-micro) var(--mov-micro)}
.tabs button:hover{color:var(--texto)}.tabs button[aria-selected="true"]{color:var(--texto);border-bottom-color:var(--acento);font-weight:var(--bold)}
.tabpanel[hidden]{display:none}

/* ---- carrusel ---- */
.carousel{position:relative}
.car-track{display:flex;gap:var(--s-16);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:2px}
.car-track::-webkit-scrollbar{display:none}
.car-track>*{flex:0 0 var(--w,min(360px,78%));scroll-snap-align:start;min-width:0}
.car-bar{display:flex;align-items:center;gap:var(--s-16);margin-top:var(--s-16)}
.car-dots{display:flex;gap:6px;flex:1}.car-dots i{width:6px;height:6px;border-radius:var(--r-pill);background:var(--borde);transition:background var(--dur-micro) var(--mov-micro),width var(--dur-estado) var(--mov-estado)}
.car-dots i.on{background:var(--acento);width:18px}
.car-btn{width:40px;height:40px;border-radius:var(--r-pill);border:var(--borde-ancho) solid var(--borde);background:var(--elevado);color:var(--texto);font-size:var(--t-19);cursor:pointer}
.car-btn:hover{border-color:var(--texto)}

/* ---- escenario de animación ---- */
.stage{position:relative;background:var(--elevado);border:var(--borde-ancho) solid var(--borde);border-radius:var(--r-tarjeta);overflow:hidden;display:grid;place-items:center;min-height:var(--alto,220px)}
.stage-bar{position:absolute;left:12px;right:12px;bottom:10px;display:flex;align-items:center;gap:var(--s-8);font-size:var(--t-12);color:var(--texto-2);z-index:2}
.stage-bar .btn{min-height:28px;padding:0 12px;font-size:var(--t-12)}
.stage-bar span{margin-left:auto;font-variant-numeric:tabular-nums}
.stage.dark{background:var(--tinta);color:var(--papel);border-color:var(--tinta)}
.tira{display:flex;gap:var(--s-8);overflow-x:auto;padding-bottom:var(--s-8)}
.tira figure{margin:0;flex:0 0 auto;width:var(--fw,160px)}
.tira figcaption{font-size:var(--t-12);color:var(--texto-2);font-variant-numeric:tabular-nums;margin-top:4px}
.tira img{width:100%;border-radius:8px;border:var(--borde-ancho) solid var(--borde)}

/* ---- referencias ---- */
.ref{display:flex;flex-direction:column;gap:var(--s-8);min-width:0}
.ref img{width:100%;height:auto;border-radius:var(--r-captura);border:var(--borde-ancho) solid var(--borde);background:var(--superficie)}
.ref .ref-credit{font-size:var(--t-12);color:var(--texto-2);line-height:1.35}
.ref .ref-credit a{color:var(--texto-2)}.ref .ref-credit a:hover{color:var(--acento-texto)}
.ref .ref-take{font-size:var(--t-15)}
.filtros{display:flex;flex-wrap:wrap;gap:var(--s-8);margin-bottom:var(--s-24)}
.filtros button{font:inherit;font-size:var(--t-15);border:var(--borde-ancho) solid var(--borde);background:transparent;color:var(--texto-2);border-radius:var(--r-pill);padding:6px 16px;cursor:pointer}
.filtros button[aria-pressed="true"]{background:var(--texto);border-color:var(--texto);color:var(--fondo)}

/* ---- tablas ---- */
.tabla{width:100%;border-collapse:collapse;font-size:var(--t-15)}
.tabla th{text-align:left;font-size:var(--t-12);letter-spacing:var(--trk-eyebrow);text-transform:uppercase;color:var(--texto-2);padding:var(--s-8) var(--s-12);border-bottom:var(--borde-ancho) solid var(--texto)}
.tabla td{padding:var(--s-12);border-bottom:var(--borde-ancho) solid var(--borde);vertical-align:top}

/* ---- formulario ---- */
.campo{display:flex;flex-direction:column;gap:6px;margin-bottom:var(--s-16)}
.campo label{font-size:var(--t-15);font-weight:var(--bold)}
.campo input{font:inherit;font-size:var(--t-17);min-height:var(--boton-alto);padding:0 var(--s-16);border:var(--borde-ancho) solid var(--borde-control);border-radius:var(--r-campo);background:var(--elevado);color:var(--texto)}
.campo input:focus{outline:var(--foco-ancho) solid var(--acento);outline-offset:1px;border-color:var(--acento)}
.campo .err{font-size:var(--t-15);color:var(--error)}

/* ---- video ---- */
video.player{width:100%;border-radius:var(--r-captura);background:var(--tinta);border:var(--borde-ancho) solid var(--borde)}

/* ---- toast y lightbox ---- */
.toast{position:fixed;left:50%;bottom:32px;transform:translate(-50%,16px);background:var(--texto);color:var(--fondo);font-size:var(--t-15);padding:10px 20px;border-radius:var(--r-pill);opacity:0;pointer-events:none;transition:opacity var(--dur-fundido) var(--mov-micro),transform var(--dur-entrada) var(--mov-entrada);z-index:400}
.toast.on{opacity:1;transform:translate(-50%,0)}
.lightbox{position:fixed;inset:0;z-index:350;background:color-mix(in srgb,var(--tinta) 92%,transparent);display:grid;place-items:center;padding:var(--s-32)}
.lightbox img{max-width:min(1400px,92vw);max-height:80vh;border-radius:var(--r-captura);object-fit:contain}
.lightbox p{position:absolute;bottom:24px;left:0;right:0;text-align:center;margin:0;color:var(--papel);font-size:var(--t-15)}
.lightbox button{position:absolute;background:transparent;border:0;color:var(--papel);font-size:40px;cursor:pointer;width:56px;height:56px}
.lb-x{top:16px;right:16px}.lb-prev{left:12px;top:50%}.lb-next{right:12px;top:50%}

/* ---- pie ---- */
.pie{border-top:var(--borde-ancho) solid var(--borde);margin-top:var(--s-96);padding:var(--s-48) 0 var(--s-64)}
.pie-in{max-width:1360px;margin:auto;padding:0 var(--s-24);display:grid;grid-template-columns:1fr auto;gap:var(--s-24) var(--s-48)}
.pie-marca p{margin:var(--s-12) 0 0;color:var(--texto-2);font-size:var(--t-15)}
.pie-nav{display:flex;flex-wrap:wrap;gap:var(--s-8) var(--s-24);align-content:start;justify-content:flex-end}
.pie-nav a{font-size:var(--t-15);color:var(--texto-2);text-decoration:none}.pie-nav a:hover{color:var(--texto)}
.pie-copia{grid-column:1/-1;margin:0;font-size:var(--t-12);color:var(--texto-2)}
@media (max-width:700px){.pie-in{grid-template-columns:1fr}.pie-nav{justify-content:flex-start}}

/* ---- aparecer al bajar (solo opacidad) ---- */
.reveal{opacity:0;transition:opacity var(--dur-entrada) var(--mov-entrada)}.reveal.vis{opacity:1}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1}html{scroll-behavior:auto}}

/* ---- extras ---- */
details.mas{border-top:var(--borde-ancho) solid var(--borde);padding:var(--s-16) 0}
details.mas summary{cursor:pointer;font-weight:var(--bold);font-size:var(--t-15);list-style:none;display:flex;align-items:center;gap:var(--s-8)}
details.mas summary::-webkit-details-marker{display:none}
details.mas summary::before{content:"+";display:inline-grid;place-items:center;width:20px;height:20px;border:var(--borde-ancho) solid var(--borde);border-radius:var(--r-pill);font-weight:var(--regular);color:var(--texto-2);transition:transform var(--dur-estado) var(--mov-estado)}
details.mas[open] summary::before{content:"–"}
details.mas>div{padding-top:var(--s-16)}
.tabla-scroll{overflow-x:auto}
.kv{display:grid;grid-template-columns:max-content 1fr;gap:var(--s-8) var(--s-24);font-size:var(--t-15);margin:0}
.kv dt{color:var(--texto-2)}.kv dd{margin:0}
.row{display:flex;flex-wrap:wrap;gap:var(--s-16);align-items:center}
.center{text-align:center}.mt-0{margin-top:0}.mt-24{margin-top:var(--s-24)}.mt-48{margin-top:var(--s-48)}
.sticky-fig{position:sticky;top:calc(var(--cabecera) + 24px);align-self:start}
.split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--s-48);align-items:center}
@media (max-width:900px){.split{grid-template-columns:minmax(0,1fr)}}
.big-num{font-size:var(--web-cifra);letter-spacing:var(--web-cifra-trk);line-height:var(--lh-cifra);font-weight:var(--bold);font-variant-numeric:tabular-nums}
.on-dark{background:var(--tinta);color:var(--papel);border-radius:var(--r-tarjeta);padding:var(--s-32)}

/* cabecera en pantallas medianas y celular: el botón Descargar no compite con el menú */
@media (max-width:1100px){.cab .cab-dl{display:none!important}.cab-in{gap:var(--s-12);padding:0 var(--s-16)}.cab-logo span{display:none}}