/* Más allá del chat · JTW 2026 · Agentic Engineering
   Un fondo, una tinta, un acento (lima del cartel JTW). */
@font-face{font-family:"DM Sans";src:url(../fonts/dm-sans-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:block}
@font-face{font-family:"DM Sans";src:url(../fonts/dm-sans-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:block}
@font-face{font-family:"DM Sans";src:url(../fonts/dm-sans-latin-700-normal.woff2) format("woff2");font-weight:700;font-display:block}
@font-face{font-family:"Newsreader";src:url(../fonts/newsreader-latin-300-normal.woff2) format("woff2");font-weight:300;font-style:normal;font-display:block}
@font-face{font-family:"Newsreader";src:url(../fonts/newsreader-latin-400-normal.woff2) format("woff2");font-weight:400;font-style:normal;font-display:block}
@font-face{font-family:"Newsreader";src:url(../fonts/newsreader-latin-300-italic.woff2) format("woff2");font-weight:300;font-style:italic;font-display:block}
@font-face{font-family:"Newsreader";src:url(../fonts/newsreader-latin-400-italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:block}

:root{
  --ground:#070D0B;   /* fondo del cartel JTW */
  --ink:#F2EEE2;      /* crema del título del cartel */
  --accent:#BDEB55;   /* lima del bloque JTW del cartel */
  --dim:rgba(242,238,226,.64);
  --faint:rgba(242,238,226,.10);
  --display:"DM Sans",system-ui,sans-serif;
  --text:"Newsreader",Georgia,serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;background:var(--ground);overflow:hidden}
body{color:var(--ink);font-family:var(--text);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}

#viewport{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:var(--ground)}
#stage{position:relative;width:1920px;height:1080px;flex:none;transform-origin:center center;overflow:hidden;background:var(--ground)}

.slide{position:absolute;inset:0;padding:112px 144px 120px;display:none;flex-direction:column;background:var(--ground);color:var(--ink)}
.slide.is-active{display:flex}
.slide.field{background:var(--accent);color:var(--ground)}
.slide.field .src,.slide.field .meta{color:rgba(7,13,11,.72)}
.slide .notes{display:none}

/* Marca: símbolo orbital original (archivo SVG de la marca, sin redibujar) */
.mark{position:absolute;top:64px;right:88px;width:96px;height:96px;opacity:.92}
.slide.field .mark{filter:brightness(0);opacity:.85}
.slide.no-mark .mark{display:none}

/* Tipografía */
.h-xxl{font-family:var(--display);font-weight:700;font-size:208px;line-height:.9;letter-spacing:-.045em}
.h-xl{font-family:var(--display);font-weight:700;font-size:150px;line-height:.94;letter-spacing:-.04em}
.h-l{font-family:var(--display);font-weight:700;font-size:112px;line-height:.98;letter-spacing:-.035em}
.h-m{font-family:var(--display);font-weight:700;font-size:84px;line-height:1.02;letter-spacing:-.03em}
.h-s{font-family:var(--display);font-weight:500;font-size:48px;line-height:1.1;letter-spacing:-.015em}
.lede{font-family:var(--text);font-weight:300;font-size:46px;line-height:1.24;max-width:1500px}
.body{font-family:var(--text);font-weight:300;font-size:36px;line-height:1.3}
.quote{font-family:var(--text);font-style:italic;font-weight:300;font-size:64px;line-height:1.16;letter-spacing:-.01em}
.it{font-style:italic}
.lime{color:var(--accent)}
.slide.field .lime{color:var(--ground)}
.meta{font-family:var(--display);font-weight:500;font-size:26px;line-height:1.3;color:var(--dim);letter-spacing:.005em}
.src{position:absolute;left:144px;bottom:56px;right:420px;font-family:var(--display);font-weight:400;font-size:20px;line-height:1.35;color:var(--dim)}
.tag{display:inline-block;font-family:var(--display);font-weight:500;font-size:24px;line-height:1;padding:12px 18px 13px;background:var(--accent);color:var(--ground);border-radius:4px}
.tag.ghost{background:var(--faint);color:var(--accent)}
.grow{flex:1}
.mt-s{margin-top:28px}.mt-m{margin-top:48px}.mt-l{margin-top:80px}
.w-12{max-width:1240px}.w-14{max-width:1440px}.w-10{max-width:1040px}

/* Portada */
.cover{justify-content:space-between}
.cover .logo-full{width:420px;height:auto}
.cover-orbit{position:absolute;right:-260px;top:120px;width:1240px;height:1240px;opacity:.16;pointer-events:none}
.cover .h-xxl{max-width:1400px}

/* Rejilla de meme (riesgo) */
.risk{display:grid;grid-template-columns:860px 1fr;column-gap:96px;align-items:center;height:100%}
.risk .copy{display:flex;flex-direction:column;justify-content:center}
.risk figure{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;max-height:820px}
.risk figure img{display:block;max-width:100%;max-height:640px;object-fit:contain;border-radius:6px;background:#fff}
.risk figure.tall img{max-height:760px}
.risk figure figcaption{margin-top:22px;font-family:var(--text);font-style:italic;font-weight:300;font-size:28px;line-height:1.3;color:var(--ink);text-align:center;max-width:760px}
.risk .credit{margin-top:10px;font-family:var(--display);font-size:19px;color:var(--dim);text-align:center}
.risk .label{font-family:var(--display);font-weight:500;font-size:28px;color:var(--accent);margin-bottom:28px}

/* Listas editoriales */
.rows{display:flex;flex-direction:column;gap:0}
.rows .row{display:grid;grid-template-columns:380px 1fr;column-gap:56px;padding:22px 0;align-items:baseline}
.rows.tight .row{padding:13px 0}.rows.tight .k{font-size:36px}.rows.tight .v{font-size:30px}
.rows .k{font-family:var(--display);font-weight:700;font-size:44px;letter-spacing:-.02em}
.rows .v{font-family:var(--text);font-weight:300;font-size:36px;line-height:1.28}

.cols{display:grid;gap:72px}
.cols.c2{grid-template-columns:1fr 1fr}
.cols.c3{grid-template-columns:repeat(3,1fr)}
.cols.c4{grid-template-columns:repeat(4,1fr)}
.col .k{font-family:var(--display);font-weight:700;font-size:56px;letter-spacing:-.025em;line-height:1}
.col .v{font-family:var(--text);font-weight:300;font-size:34px;line-height:1.28;margin-top:20px}
.col.on .k{color:var(--accent)}

/* Encargo tachado */
.strike{position:relative;display:inline-block}
.strike .bar{position:absolute;left:-12px;right:-12px;top:52%;height:16px;background:var(--accent);transform-origin:left center}

/* Anatomía */
.anat{display:flex;gap:18px;align-items:stretch;margin-top:72px}
.anat .n{flex:1;background:var(--faint);border-radius:8px;padding:30px 24px 28px;min-height:230px;display:flex;flex-direction:column;justify-content:space-between}
.anat .n b{font-family:var(--display);font-weight:700;font-size:36px;letter-spacing:-.02em}
.anat .n span{font-family:var(--text);font-weight:300;font-size:26px;line-height:1.25;color:var(--dim)}
.anat .n.hi{background:var(--accent);color:var(--ground)}
.anat .n.hi span{color:rgba(7,13,11,.75)}
.anat-mem{margin-top:22px;font-family:var(--text);font-style:italic;font-weight:300;font-size:30px;color:var(--dim)}

/* Escalones de permiso */
.steps{display:flex;align-items:flex-end;gap:24px;margin-top:64px;height:420px}
.steps .s{flex:1;background:var(--faint);border-radius:8px;padding:28px;display:flex;flex-direction:column;justify-content:flex-start}
.steps .s b{font-family:var(--display);font-weight:700;font-size:46px;letter-spacing:-.02em}
.steps .s span{font-family:var(--text);font-weight:300;font-size:28px;line-height:1.25;margin-top:12px;color:var(--dim)}
.steps .s1{height:44%}.steps .s2{height:60%}.steps .s3{height:76%}
.steps .gap{width:40px;flex:none}
.steps .s4{height:100%;background:var(--accent);color:var(--ground)}
.steps .s4 span{color:rgba(7,13,11,.78)}

/* Plantilla de encargo */
.tpl .row{grid-template-columns:400px 1fr}
.tpl .k{color:var(--accent)}

/* Traza (firma 1) */
.trace{position:relative;margin-top:56px;display:flex;flex-direction:column;gap:14px}
.trace .sp{display:grid;grid-template-columns:420px 1fr;align-items:center;column-gap:36px;height:66px}
.trace .lbl{font-family:var(--display);font-weight:500;font-size:27px;line-height:1.15;text-align:right}
.trace .lbl small{display:block;font-weight:400;font-size:20px;color:var(--dim);margin-top:4px}
.trace .lane{position:relative;height:100%}
.trace .bar{position:absolute;top:12px;height:42px;border-radius:4px;background:rgba(242,238,226,.82);transform-origin:left center}
.trace .bar.tool{background:rgba(242,238,226,.5)}
.trace .bar.warn{background:var(--ink)}
.trace .bar.stop{background:var(--accent)}
.trace .bar em{position:absolute;left:calc(100% + 18px);top:6px;white-space:nowrap;font-family:var(--text);font-style:italic;font-weight:300;font-size:26px;color:var(--ink)}
.trace .bar.stop em{color:var(--accent)}
.trace .cursor{position:absolute;top:-16px;bottom:-16px;width:3px;background:var(--accent);left:456px;transform-origin:top}

/* Scoreboard (firma 2) */
.score{display:grid;grid-template-columns:1fr 300px 300px;column-gap:40px;margin-top:40px;align-items:center}
.score .hd{font-family:var(--display);font-weight:500;font-size:28px;color:var(--dim);padding-bottom:18px;text-align:right}
.score .hd:first-child{text-align:left}
.score .lb{font-family:var(--text);font-weight:300;font-size:38px;padding:22px 0}
.score .nm{font-family:var(--display);font-weight:700;font-size:76px;letter-spacing:-.03em;text-align:right;padding:6px 0;font-variant-numeric:tabular-nums}
.score .nm small{font-size:34px;font-weight:500;color:var(--dim);letter-spacing:0}
.score .nm.v2{color:var(--accent)}
.score .nm.bad{color:var(--ink)}
.stamp{position:absolute;top:300px;right:144px;font-family:var(--display);font-weight:700;font-size:26px;color:var(--ground);background:var(--accent);padding:12px 20px;border-radius:4px}

/* Cifra grande */
.big-num{font-family:var(--display);font-weight:700;font-size:340px;line-height:.85;letter-spacing:-.06em;font-variant-numeric:tabular-nums}

/* Agenda */
.timeline{position:relative;margin-top:96px;height:300px}
.timeline .track{position:absolute;left:0;right:0;top:92px;height:6px;background:var(--faint)}
.timeline .fill{position:absolute;left:0;top:92px;height:6px;width:100%;background:var(--accent);transform-origin:left center}
.timeline .ev{position:absolute;top:0}
.timeline .ev b{display:block;font-family:var(--display);font-weight:700;font-size:34px;letter-spacing:-.01em}
.timeline .ev span{display:block;margin-top:70px;font-family:var(--text);font-weight:300;font-size:30px;line-height:1.2;max-width:300px}
.timeline .ev.pause span{font-style:italic;color:var(--dim)}

/* Placeholder demo */
.slot{flex:1;margin-top:48px;border-radius:10px;background:var(--faint);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:24px}
.slot .h-s{max-width:1100px}
.chapters{display:flex;gap:16px;flex-wrap:wrap;justify-content:center;margin-top:8px}
.chapters span{font-family:var(--display);font-weight:500;font-size:26px;padding:12px 20px;border-radius:4px;background:var(--faint)}

/* Brief */
.brief{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:64px}
.brief .b{background:var(--faint);border-radius:8px;padding:36px 34px;min-height:380px}
.brief .b b{font-family:var(--display);font-weight:700;font-size:48px;letter-spacing:-.02em}
.brief .b p{font-family:var(--text);font-weight:300;font-size:32px;line-height:1.3;margin-top:22px}
.brief .b.hi{background:var(--accent);color:var(--ground)}

/* Conversación */
.who{font-family:var(--display);font-weight:500;font-size:28px;color:var(--accent);margin-bottom:20px}
.slide.field .who{color:var(--ground)}

/* Progreso */
#progress{position:fixed;left:0;bottom:0;height:6px;width:100%;background:var(--accent);transform-origin:left center;transform:scaleX(0);z-index:5}
#hint{position:fixed;right:18px;bottom:16px;font:500 13px/1 "DM Sans",sans-serif;color:var(--dim);opacity:0;transition:opacity .4s;z-index:6;pointer-events:none}
body.show-hint #hint{opacity:1}

/* Notas en pantalla (respaldo si el navegador bloquea la ventana de notas) */
#notes-overlay{position:fixed;inset:auto 0 0 0;height:44vh;background:#0d1512;color:var(--ink);z-index:9;display:none;padding:28px 40px;overflow:auto;font-family:var(--display);border-top:4px solid var(--accent)}
#notes-overlay.on{display:block}
#notes-overlay .nh{display:flex;justify-content:space-between;font-size:16px;color:var(--dim);margin-bottom:12px}
#notes-overlay .nb{font-family:var(--text);font-size:24px;line-height:1.4;max-width:1200px}
#notes-overlay .nb p{margin-bottom:12px}
#notes-overlay .nb b{font-family:var(--display);color:var(--accent)}

/* Estados iniciales para animación (solo si hay movimiento) */
.motion [data-a]{opacity:0}

@media (prefers-reduced-motion: reduce){
  .motion [data-a]{opacity:1 !important;transform:none !important}
}

/* ═════════ Rework 2-nov-2026: indicador de sección, stack, escenas de chat ═════════ */

/* Indicador de sección (siempre visible, arriba a la izquierda) */
.secind{position:absolute;top:46px;left:144px;display:flex;align-items:center;gap:18px;font-family:var(--display);font-weight:500;font-size:22px;line-height:1;color:var(--dim);z-index:3;white-space:nowrap}
.secind b{color:var(--ink);font-weight:700}
.secind .chips{display:flex;gap:4px;margin-left:4px}
.secind .chips i{display:block;width:18px;height:10px;border-radius:2px;background:rgba(242,238,226,.12)}
.secind .chips i.on{background:rgba(242,238,226,.6)}
.secind .chips i.new{background:var(--accent)}
.secind .chips i.gap{background:transparent;box-shadow:inset 0 0 0 2px var(--accent)}
.slide.field .secind{color:rgba(7,13,11,.72)}
.slide.field .secind b{color:var(--ground)}
.slide.field .secind .chips i{background:rgba(7,13,11,.16)}
.slide.field .secind .chips i.on,.slide.field .secind .chips i.new{background:var(--ground)}

/* Portadas y cierres de sección */
.sec-cover,.sec-close{justify-content:center}
.sec-cover .part,.sec-close .part{font-family:var(--display);font-weight:700;font-size:44px;letter-spacing:-.01em;color:var(--accent)}
.sec-cover .when,.sec-close .when{font-family:var(--display);font-weight:500;font-size:30px;color:var(--dim);margin-top:14px}
.sec-grid{display:grid;grid-template-columns:1fr 520px;column-gap:96px;align-items:end;height:100%}
.sec-grid .l{display:flex;flex-direction:column;justify-content:center;height:100%}
.sec-list{display:flex;flex-wrap:wrap;gap:12px 14px;margin-top:56px;max-width:1080px}
.sec-list span{font-family:var(--display);font-weight:500;font-size:26px;padding:10px 16px;border-radius:4px;background:var(--faint)}
.sec-close .next{font-family:var(--display);font-weight:500;font-size:34px;margin-top:56px}
.sec-close .next b{color:var(--accent)}

/* Stack de Toño (crece capa por capa) */
.stack{display:flex;flex-direction:column-reverse;gap:8px;width:520px}
.stack .blk{height:62px;border-radius:6px;background:rgba(242,238,226,.16);display:flex;align-items:center;justify-content:space-between;padding:0 22px;font-family:var(--display);font-weight:700;font-size:26px;letter-spacing:-.01em;color:var(--ink)}
.stack .blk small{font-weight:400;font-size:19px;color:var(--dim)}
.stack .blk.new{background:var(--accent);color:var(--ground)}
.stack .blk.new small{color:rgba(7,13,11,.7)}
.stack .blk.ghost{background:transparent;box-shadow:inset 0 0 0 2px rgba(242,238,226,.12)}
.stack .blk.gap{background:transparent;box-shadow:inset 0 0 0 3px var(--accent);color:var(--accent)}
.stack .blk.gap small{color:var(--accent)}
.stack .blk.lit{box-shadow:inset 0 0 0 3px var(--accent)}
.stack-cap{font-family:var(--display);font-weight:500;font-size:22px;color:var(--dim);margin-top:18px;width:520px}
.stack.s10 .blk{height:56px;font-size:24px}

/* Escena de riesgo con chat (estilo de los posts "Los osos de tu IA") */
.risk .copy .h-m{max-width:860px}
.chat{display:flex;flex-direction:column;margin-top:40px;width:860px}
.chat .lbl2{font-family:var(--display);font-weight:500;font-size:21px;color:var(--dim);margin:0 10px 10px}
.chat .lbl2.r{text-align:right}
.bub{font-family:var(--display);font-weight:500;font-size:32px;line-height:1.26;padding:20px 28px 22px;border-radius:28px;max-width:720px;width:fit-content;margin-bottom:22px}
.bub.u{align-self:flex-end;background:#1F2825;color:var(--ink);border-bottom-right-radius:8px}
.bub.t{background:var(--ink);color:var(--ground);border-bottom-left-radius:8px}
.bub.sm{font-size:28px}
.stampx{display:inline-block;align-self:flex-start;font-family:var(--display);font-weight:700;font-size:32px;line-height:1;letter-spacing:.02em;text-transform:uppercase;color:var(--accent);box-shadow:inset 0 0 0 5px var(--accent);border-radius:10px;padding:16px 24px 15px;transform:rotate(-3deg)}
.stampx.xl{font-size:118px;padding:34px 48px 30px;box-shadow:inset 0 0 0 10px var(--accent);border-radius:18px;letter-spacing:-.01em}
.card2{background:rgba(242,238,226,.10);border-radius:12px;padding:20px 26px;font-family:var(--display);font-weight:500;font-size:26px;line-height:1.3}
.card2 .hd2{font-size:19px;color:var(--dim);margin-bottom:8px}
.card2 .mut{color:var(--dim);font-style:normal}
.card2 .del{color:var(--dim);text-decoration:line-through}
.card2 .add{color:var(--accent)}
.row-inline{display:flex;gap:22px;align-items:center}
.gag{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:34px;height:100%}
.gag .card2{font-size:34px;width:520px}

/* Capa (la pieza que aparece y cómo arregla el oso) */
.layer{display:grid;grid-template-columns:1fr 520px;column-gap:96px;height:100%}
.layer .l{display:flex;flex-direction:column;justify-content:center}
.layer .r{display:flex;flex-direction:column;justify-content:flex-end}
.layer .term{font-family:var(--display);font-weight:500;font-size:28px;color:var(--accent);margin-top:18px}
.layer .rows .row{grid-template-columns:250px 1fr;column-gap:36px;padding:14px 0}
.layer .rows .k{font-size:34px}
.layer .rows .v{font-size:30px}
.layer .fix{margin-top:34px}
.layer .fix .lbl2{font-family:var(--display);font-weight:500;font-size:21px;color:var(--dim);margin:0 10px 10px}
.layer .fix .bub{margin-bottom:0;font-size:29px}
.layer .steps{height:330px;margin-top:40px}
.layer .steps .s b{font-size:34px}
.layer .steps .s span{font-size:24px}
.layer .steps .gap{width:20px}
.loop{display:flex;align-items:center;gap:14px;margin-top:40px;flex-wrap:wrap}
.loop span{font-family:var(--display);font-weight:700;font-size:32px;padding:16px 22px;border-radius:6px;background:var(--faint)}
.loop i{font-style:normal;font-family:var(--display);font-size:30px;color:var(--accent)}
.loop span.hi{background:var(--accent);color:var(--ground)}

/* Legal (una sola slide) */
.legal{display:grid;grid-template-columns:1.05fr .95fr;column-gap:80px;margin-top:40px}
.legal .rows.tight .row{grid-template-columns:230px 1fr;column-gap:28px}
.legal .rows.tight .k{font-size:30px}
.legal .rows.tight .v{font-size:26px}
.legal ul{list-style:none;margin-top:18px}
.legal li{font-family:var(--text);font-weight:300;font-size:28px;line-height:1.25;padding:9px 0}
.legal li::before{content:"";display:inline-block;width:12px;height:12px;border-radius:2px;background:var(--accent);margin-right:16px;vertical-align:middle}

/* Pista B compacta */
.agents{display:grid;grid-template-columns:1fr 1fr;column-gap:72px;margin-top:40px}
.agents .row{display:grid;grid-template-columns:400px 1fr;column-gap:28px;padding:11px 0;align-items:baseline}
.agents .k{font-family:var(--display);font-weight:700;font-size:34px;letter-spacing:-.02em}
.agents .v{font-family:var(--text);font-weight:300;font-size:27px}
.routines{display:flex;gap:48px;margin-top:40px;font-family:var(--display);font-size:28px}
.routines b{color:var(--accent);margin-right:12px}

/* Capturas de pipeline/CRM: deben llegar YA difuminadas en el archivo */
.slot .shot{max-width:100%;max-height:100%;object-fit:contain;border-radius:8px}

.motion .stack .blk.new,.motion .stampx.drop{opacity:0}
@media (prefers-reduced-motion: reduce){ .motion .stack .blk.new,.motion .stampx.drop{opacity:1 !important;transform:none !important} }

/* ═════════ Feedback 2 (2-nov-2026): pasos, página web con texto oculto, juego "¿pasa o no pasa?" ═════════ */
/* Pasos [data-step]: ocultos solo si hay movimiento; sin movimiento o al imprimir se ven revelados. */
.motion [data-step].stp:not(.on){opacity:0;transform:scale(1.25) rotate(-3deg)}
[data-step].stp{transition:opacity .35s ease,transform .45s cubic-bezier(.2,1.4,.4,1)}

/* Mini página web blanca (slide 16) */
.webcard{width:820px;background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 22px 60px rgba(0,0,0,.5);margin-bottom:30px;color:#1A1F1D}
.webcard .wbar{display:flex;align-items:center;gap:10px;height:58px;padding:0 20px;background:#E9ECEA;border-bottom:1px solid #D4D8D5}
.webcard .wbar i{width:14px;height:14px;border-radius:50%;background:#C9CECB;display:block}
.webcard .wurl{margin-left:14px;flex:1;height:36px;border-radius:18px;background:#fff;display:flex;align-items:center;padding:0 18px;font-family:var(--display);font-weight:500;font-size:21px;color:#4A524E}
.webcard .wurl:before{content:"";width:12px;height:12px;border:2.5px solid #7A837E;border-radius:3px;margin-right:12px}
.webcard .wpg{padding:30px 36px 32px;font-family:var(--display)}
.webcard .wh{font-weight:700;font-size:34px;letter-spacing:-.01em;color:#111614}
.webcard .wp{font-weight:400;font-size:27px;line-height:1.38;color:#2E3532;margin-top:10px}
.webcard .inj{position:relative;margin-top:10px;font-weight:500;font-size:30px;line-height:1.5;min-height:100px}
/* texto blanco sobre fondo blanco; al revelarlo se "selecciona" como con el mouse */
.webcard .inj .hid{color:#fff;background-image:linear-gradient(#2463EB,#2463EB);background-repeat:no-repeat;background-size:100% 100%;padding:2px 0}
.motion .webcard .inj:not(.on) .hid{background-size:0% 100%}
.motion .webcard .inj .hid{transition:background-size 1.5s cubic-bezier(.6,0,.4,1)}
.webcard .inj .cur{position:absolute;top:0;width:3px;height:40px;background:#111614;left:100%;opacity:0}
.motion .webcard .inj:not(.on) .cur{left:0;opacity:1;animation:blinkc 1s steps(1) infinite}
.motion .webcard .inj.on .cur{transition:left 1.5s cubic-bezier(.6,0,.4,1),opacity .3s 1.5s;left:100%;opacity:0}
@keyframes blinkc{50%{opacity:0}}
.webcard .injtag{display:inline-block;margin-top:16px;font-family:var(--display);font-weight:700;font-size:22px;letter-spacing:.01em;color:var(--ground);background:var(--accent);padding:9px 14px;border-radius:6px}
.motion .webcard .inj:not(.on) .injtag{opacity:0;transform:translateY(8px)}
.motion .webcard .inj .injtag{transition:opacity .35s 1.5s,transform .35s 1.5s}

/* Juego: tres respuestas de Toño, el veredicto entra por pasos */
.game{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-top:56px}
.game .opt{position:relative;background:rgba(242,238,226,.07);border-radius:20px;padding:30px 30px 34px;display:flex;flex-direction:column;min-height:540px}
.game .opt .n{font-family:var(--display);font-weight:700;font-size:30px;color:var(--dim)}
.game .opt .bub{margin-top:22px;font-size:36px;max-width:none}
.game .opt .why{font-family:var(--text);font-style:italic;font-weight:300;font-size:32px;line-height:1.25;color:var(--ink);margin-top:auto}
.game .verdict{position:absolute;right:26px;top:22px;font-family:var(--display);font-weight:700;font-size:38px;letter-spacing:.02em;text-transform:uppercase;border-radius:10px;padding:10px 18px 9px;transform:rotate(-3deg)}
.game .verdict.ok{color:var(--ground);background:var(--accent)}
.game .verdict.ko{color:var(--accent);box-shadow:inset 0 0 0 5px var(--accent)}
.game .opt .why.stp{transform-origin:left bottom}
.motion .game .why[data-step]:not(.on){transform:none}
.ask{font-family:var(--display);font-weight:500;font-size:30px;color:var(--accent);margin-top:26px}
.ask b{color:var(--ink)}
.cases{display:flex;flex-direction:column;gap:18px;margin-top:26px}
.cases div{font-family:var(--display);font-weight:500;font-size:28px;color:var(--dim);border-bottom:2px dashed rgba(242,238,226,.28);padding:0 0 12px}

@media print{
  .motion [data-step]:not(.on){opacity:1 !important;transform:none !important}
  .motion .webcard .inj:not(.on) .hid{background-size:100% 100% !important}
  .motion .webcard .inj:not(.on) .injtag{opacity:1 !important;transform:none !important}
  .motion .webcard .inj .cur{display:none}
  .motion [data-step],.motion [data-step] *{transition:none !important;animation:none !important}
}

/* mano alzada en la slide del teléfono descompuesto */
.slide .risk .copy .lede.hand{color:var(--accent);font-family:var(--display);font-weight:500;font-size:40px;line-height:1.25}

/* Video a pantalla completa (anuncio) · fondo negro para fundirse con el video */
.slide.video-slide{padding:0;background:#040404;align-items:center;justify-content:center}
.video-slide .secind{display:none}
.video-slide .fs-video{display:block;height:100%;width:100%;object-fit:contain;background:#040404}
.video-slide .play-cue{position:absolute;left:50%;bottom:72px;transform:translateX(-50%);font-family:var(--display);font-weight:500;font-size:26px;color:var(--ink);background:rgba(7,13,11,.82);border:1px solid var(--accent);border-radius:999px;padding:14px 30px;display:none;white-space:nowrap}
.video-slide.needs-play .play-cue{display:block}

/* QR final */
.qr-end{position:absolute;right:200px;top:calc(50% - 330px);margin:0;display:flex;flex-direction:column;align-items:center;z-index:2}
.qr-end img{display:block;width:560px;height:560px;border-radius:20px;box-shadow:0 0 0 6px var(--accent),0 24px 64px rgba(0,0,0,.5)}
.qr-end figcaption{margin-top:34px;font-family:var(--display);font-weight:700;font-size:40px;letter-spacing:-.01em;color:var(--ink)}

/* ── Showcase · trabajo real (3-nov-2026) ── */
.shot{display:block;border-radius:12px;border:1px solid rgba(242,238,226,.18);box-shadow:0 18px 48px rgba(0,0,0,.45);background:#000}
.sc-links{display:flex;flex-direction:column;gap:8px;margin-top:36px;font-family:var(--display);font-weight:500;font-size:21px;line-height:1.35;color:var(--dim)}
.sc-links b{color:var(--ink);font-weight:700}
.sc-links a,.sc-fig figcaption a{color:var(--accent);text-decoration:none;border-bottom:1px solid rgba(189,235,85,.45)}
.who{font-family:var(--display);font-weight:500;font-size:28px;line-height:1.35;color:var(--dim)}
.who b{color:var(--accent);font-weight:700}
.sc-open .sec-list{max-width:1000px}
.sc-who{display:flex;flex-direction:column;gap:20px;justify-content:center;height:100%}
.sc-who .card2{font-size:30px}
.sc-who .card2 .hd2{font-size:30px;font-weight:700;color:var(--accent);margin-bottom:6px}
.sc-split{display:grid;grid-template-columns:1fr auto;column-gap:72px;align-items:center;height:100%}
.sc-split .copy{display:flex;flex-direction:column;justify-content:center}
.phones{display:flex;gap:24px;align-items:flex-end}
.phones figure{margin:0;display:flex;flex-direction:column;align-items:center}
.phones img{height:580px;width:auto;border-radius:18px}
.phones figcaption,.sc-vids figcaption,.sc-adv figcaption,.claude-frames figcaption,.sc-fig figcaption{margin-top:14px;font-family:var(--display);font-weight:500;font-size:22px;color:var(--dim);text-align:center}
.sc-vids figcaption b,.sc-adv figcaption b{color:var(--ink)}
.big-n{font-family:var(--display);font-weight:700;font-size:220px;line-height:.82;letter-spacing:-.05em;color:var(--accent)}
.sc-postiz{display:grid;grid-template-columns:760px 1fr;column-gap:64px;align-items:start}
.sc-postiz .lede{font-size:38px;margin-top:18px}
.sc-postiz .rows .row{grid-template-columns:220px 1fr;column-gap:28px}
.sc-fig{margin:0;display:flex;flex-direction:column;align-items:center}
.sc-fig img{width:100%;height:auto}
.sc-punch{margin-top:auto;font-size:52px}
.yt-media{display:flex;flex-direction:column;gap:18px;width:880px}
.yt-media .main{width:880px;height:auto}
.yt-row{display:flex;gap:18px;justify-content:space-between;align-items:flex-start}
.yt-row img{height:196px;width:auto}
.sc-split.yt .rows .row{grid-template-columns:200px 1fr;column-gap:28px}
.sc-vids{display:grid;grid-template-columns:1fr 1fr;gap:48px}
.sc-vids figure{margin:0}
.sc-vids video{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.sc-brief{display:grid;grid-template-columns:720px 1fr;column-gap:56px;align-items:start}
.sc-briefcard{background:rgba(242,238,226,.06);border-left:6px solid var(--accent);border-radius:8px;padding:28px 34px;font-family:var(--display);font-weight:500;font-size:25px;line-height:1.38}
.sc-briefcard p+p{margin-top:14px}
.sc-briefcard .hd2{font-size:20px;color:var(--dim);margin-bottom:4px}
.sc-briefcard .t{color:var(--accent);font-weight:700}
.claude-frames{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.claude-frames figure{margin:0}
.claude-frames figure:first-child{grid-column:1 / -1}
.claude-frames img{width:100%;height:auto}
.claude-frames figure:first-child img{width:70%;margin:0 auto}
.sc-adv{display:grid;grid-template-columns:940px auto;justify-content:start;grid-template-rows:auto auto;gap:24px 40px;align-items:start}
.sc-adv figure:first-child{grid-row:1 / span 2}
.sc-adv figure{margin:0}
.sc-adv img{width:100%;height:auto}
.sc-adv figure:not(:first-child) img{width:auto;height:232px}
.sc-ops .v{font-size:36px}
.sc-ops .k{font-size:60px}
.rows.big .row{padding:30px 0;grid-template-columns:420px 1fr}
.rows.big .k{font-size:58px}
.rows.big .v{font-size:44px}

/* ── Rework 3-nov-2026: Grok Bot, piezas de Claude, gracias a ITESO ── */
.ggrid{grid-template-columns:1fr 1fr 1fr;gap:34px 54px;margin-top:44px}
.ggrid .col .k{font-size:42px;color:var(--accent)}
.ggrid .col .v{font-size:28px;line-height:1.3;margin-top:12px}
.sc-pieces{display:flex;flex-direction:column;gap:18px;width:660px}
.sc-pieces .vid-wrap{width:660px}
.sc-pieces video, .sc-pieces .shot{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;display:block;border-radius:12px;border:1px solid rgba(242,238,226,.18);box-shadow:0 18px 48px rgba(0,0,0,.45);background:#000}
.sc-pieces .piece-row{display:flex;gap:20px;align-items:flex-start}
.sc-pieces .piece-row figure{margin:0;flex:1;display:flex;flex-direction:column;align-items:center}
.sc-pieces .piece-row img{width:100%;height:auto;border-radius:10px;border:1px solid rgba(242,238,226,.18)}
.sc-pieces .piece-row figcaption{margin-top:8px;font-family:var(--display);font-weight:500;font-size:17px;color:var(--dim);text-align:center}
.sc-vids video[data-video]{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:12px}
.yt-media video.main{width:880px;height:auto;aspect-ratio:16/9;object-fit:cover}
.end-stack{display:flex;flex-direction:column;gap:0}
.iteso-thanks{display:flex;align-items:center;gap:26px;max-width:1180px;margin-top:44px}
.iteso-thanks img{width:112px;height:auto;flex:none}
.iteso-thanks p{font-family:var(--text);font-weight:300;font-size:30px;line-height:1.25;color:var(--dim)}
.vid-wrap{position:relative;display:block}
.play-cue2{display:none;position:absolute;left:50%;bottom:18px;transform:translateX(-50%);font-family:var(--display);font-weight:500;font-size:20px;color:var(--ink);background:rgba(7,13,11,.86);border:1px solid var(--accent);border-radius:999px;padding:9px 20px;white-space:nowrap}
.slide.needs-play .play-cue2{display:block}

/* ── Variedad no-video (4-nov-2026) ── */
.ndv{display:grid;grid-template-columns:1fr 1fr 1.65fr;gap:36px;align-items:start}
.ndv figure{margin:0}
.ndv-box{height:556px;display:flex;align-items:center;justify-content:center;background:rgba(242,238,226,.05);border:1px solid rgba(242,238,226,.12);border-radius:12px;padding:14px}
.ndv-box img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;display:block;border-radius:6px}
.ndv figcaption{margin-top:14px;font-family:var(--display);font-weight:500;font-size:21px;line-height:1.3;color:var(--dim);text-align:center}

/* ═════════ Quién les habla (4-nov-2026) ═════════ */
.bio{display:grid;grid-template-columns:640px 1fr;column-gap:96px;align-items:center;height:100%}
.bio-photo{width:640px;height:640px;object-fit:cover;object-position:50% 34%;border-radius:14px;border:1px solid rgba(242,238,226,.16);background:#000}
.bio-txt{align-self:center}
.bio-rows{margin-top:40px}
.bio-rows .row{display:grid;grid-template-columns:236px 1fr;column-gap:32px;padding:14px 0 15px;align-items:baseline;border-top:1px solid rgba(242,238,226,.10)}
.bio-rows .k{font-family:var(--display);font-weight:700;font-size:25px;letter-spacing:-.01em;color:var(--accent);line-height:1.15}
.bio-rows .v{font-family:var(--text);font-weight:300;font-size:26px;line-height:1.3;color:var(--ink)}