/* Fundamentos de Diseño · 507 · presentación maestra v6
   Lenguaje visual: tipografía y ritmo de ARCO (Butler + Raleway, eyebrows, hairlines) · paleta de Hábita.
   Escenario fijo de 1600 × 900: nada hace scroll. */
:root{
  --crema:#FBFBF9; --greige:#E9E9E4; --carbon:#17181A; --bosque:#1F3A5F; --noche:#14203A;
  --salvia:#2F6BFF; --durazno:#FFE3C2; --rosa:#FFD9E0; --salviaclaro:#D8F0E6;
  --rule:rgba(23,24,26,.14); --rule2:rgba(23,24,26,.35); --soft:rgba(23,24,26,.62);
  --serif:Butler,"Iowan Old Style",Georgia,serif;
  --sans:Raleway,"Helvetica Neue",Arial,sans-serif;
  --out:cubic-bezier(.23,1,.32,1);
}
:root[data-theme="dark"], :root:not([data-theme="light"]){ }
*{box-sizing:border-box; margin:0}
html,body{height:100%}
body{background:var(--noche); color:var(--carbon); font-family:var(--sans); font-weight:300; overflow:hidden; -webkit-font-smoothing:antialiased}
button{font-family:inherit}

/* ───── escenario 16:9 ───── */
#slide{position:absolute; left:50%; top:50%; width:1600px; height:900px; background:var(--crema); transform-origin:center center; overflow:hidden}
.s{position:absolute; inset:0; display:none; background:var(--crema); overflow:hidden}
.s.on{display:block}
.s.alt{background:var(--greige)}
.s.dark{background:var(--noche); color:var(--crema)}
.frame{position:absolute; inset:0; padding:76px 88px 70px; display:grid; grid-template-columns:repeat(12,1fr); column-gap:24px; grid-template-rows:auto 1fr auto}
.top{grid-column:1/-1; grid-row:1; display:flex; justify-content:space-between; align-items:baseline; padding-bottom:16px; border-bottom:1px solid var(--rule)}
.body{grid-column:1/-1; grid-row:2; display:grid; grid-template-columns:repeat(12,1fr); column-gap:24px; align-content:center; padding:34px 0; min-height:0}
.body.topalign{align-content:start}
.body.cal{padding:20px 0 0; align-content:start}
.foot{grid-column:1/-1; grid-row:3; display:flex; justify-content:flex-end; align-items:baseline; padding-top:14px; border-top:1px solid var(--rule)}
.dark .top,.dark .foot{border-color:rgba(239,232,218,.22)}

/* ───── movimiento ───── */
@media (prefers-reduced-motion: no-preference){
  .s.on{animation:entra 480ms var(--out)}
  @keyframes entra{from{opacity:0} to{opacity:1}}
  .s.on .top{animation:up 520ms var(--out) both}
  .s.on .foot{animation:fadein 700ms 260ms both}
  .s.on .body > *, .s.on .layer > *, .s.on .txt > *{animation:up 620ms var(--out) both}
  .s.on .body > :nth-child(1), .s.on .txt > :nth-child(1){animation-delay:60ms}  .s.on .body > :nth-child(2), .s.on .txt > :nth-child(2){animation-delay:130ms}
  .s.on .body > :nth-child(3), .s.on .txt > :nth-child(3){animation-delay:200ms} .s.on .body > :nth-child(4), .s.on .txt > :nth-child(4){animation-delay:270ms}
  .s.on .body > :nth-child(5), .s.on .txt > :nth-child(5){animation-delay:340ms} .s.on .body > :nth-child(6){animation-delay:410ms}
  .s.on .body > :nth-child(7){animation-delay:480ms} .s.on .body > :nth-child(8){animation-delay:550ms}
  .s.on .body > :nth-child(n+9){animation-delay:620ms}
  .s.on .layer > :nth-child(1){animation-delay:120ms} .s.on .layer > :nth-child(2){animation-delay:220ms}
  .s.on .layer > :nth-child(3){animation-delay:320ms} .s.on .layer > :nth-child(4){animation-delay:420ms}
  .s.on img.ph, .s.on img.full, .s.on .foto img{animation:ken 1600ms var(--out) both}
  .s.on .fotos .foto:nth-child(2) img{animation-delay:120ms}
  .s.on .panel{animation:up 700ms 200ms var(--out) both}
  .s.on .idea > *{animation:up 640ms var(--out) both} .s.on .idea > :nth-child(2){animation-delay:120ms} .s.on .idea > :nth-child(3){animation-delay:240ms}
  .s.on .hook > *{animation:up 640ms var(--out) both} .s.on .hook > :nth-child(2){animation-delay:140ms} .s.on .hook > :nth-child(3){animation-delay:280ms}
  @keyframes up{from{opacity:0; transform:translateY(18px)} to{opacity:1; transform:none}}
  @keyframes fadein{from{opacity:0} to{opacity:1}}
  @keyframes ken{from{opacity:0; transform:scale(1.04)} to{opacity:1; transform:scale(1)}}
  .b{transition:opacity 320ms ease-out, transform 420ms var(--out)}
  .strip > div, .blk .cell, .glos > div, .fechas .colf > div{animation:up 560ms var(--out) both}
  .blk .cell:nth-child(n+6){animation-delay:80ms} .blk .cell:nth-child(n+11){animation-delay:160ms} .blk .cell:nth-child(n+16){animation-delay:240ms}
  .glos > div:nth-child(n+5){animation-delay:70ms} .glos > div:nth-child(n+9){animation-delay:140ms} .glos > div:nth-child(n+13){animation-delay:210ms} .glos > div:nth-child(n+17){animation-delay:280ms} .glos > div:nth-child(n+21){animation-delay:350ms}
}
body.noanim *{animation:none !important; transition:none !important}
body.todo .b{opacity:1; transform:none}
.b{opacity:0; transform:translateY(10px)}
.b.in{opacity:1; transform:none}
.s.all .b{opacity:1; transform:none; transition:none}

/* ───── tipografía · lenguaje ACRE ───── */
.eb{font:600 15px/1.3 var(--sans); letter-spacing:.32em; text-transform:uppercase; color:var(--salvia)}
.eb.dim{color:var(--soft); letter-spacing:.24em; font-weight:500}
.dark .eb.dim{color:rgba(239,232,218,.6)}
.eb.c{text-align:center}
.hero{font:200 132px/.98 var(--serif); letter-spacing:-.02em; color:var(--bosque); text-wrap:balance}
.hero .s2{color:var(--salvia)}
.t1{font:200 92px/1 var(--serif); letter-spacing:-.015em; color:var(--bosque); text-wrap:balance}
.t2{font:300 60px/1.08 var(--serif); letter-spacing:-.012em; color:var(--bosque); text-wrap:balance}
.t3{font:300 42px/1.15 var(--serif); letter-spacing:-.01em; color:var(--bosque)}
.q{font:italic 300 66px/1.15 var(--serif); letter-spacing:-.01em; color:var(--bosque); text-wrap:balance}
.lede{font:300 31px/1.42 var(--serif); color:var(--carbon)}
.h{font:500 27px/1.25 var(--sans); color:var(--bosque)}
.p{font:300 23px/1.55 var(--sans); color:var(--carbon)}
.sm{font:300 19px/1.5 var(--sans); color:var(--carbon)}
.p b,.sm b{font-weight:500; color:var(--bosque)}
.dark .hero,.dark .t1,.dark .t2,.dark .t3,.dark .q,.dark .h{color:var(--crema)}
.dark .lede,.dark .p,.dark .sm{color:rgba(239,232,218,.82)} .dark .p b,.dark .sm b{color:var(--crema)}
.pg{font:300 20px/1 var(--serif); color:var(--soft)} .dark .pg{color:rgba(239,232,218,.6)}
.num{font:300 46px/1 var(--serif); color:var(--salvia); display:block; margin-bottom:12px}
.big{font:200 110px/1 var(--serif); letter-spacing:-.02em; color:var(--bosque)}
.big.sv{color:var(--salvia)}
.dots::before{content:"· "} .dots::after{content:" ·"}

/* ───── piezas ───── */
.col{display:flex; flex-direction:column; gap:12px}
.rule{border-top:1px solid var(--rule2); padding-top:16px}
.ph{width:100%; height:100%; object-fit:cover; display:block}
.full{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.layer{position:absolute; inset:0}
.panel{position:absolute; background:var(--crema); padding:40px 52px 44px}
.chip{display:inline-block; font:500 14px/1 var(--sans); letter-spacing:.18em; text-transform:uppercase; padding:9px 14px; border:1px solid var(--rule2); color:var(--bosque); margin:0 8px 8px 0}
.chip.fill{background:var(--bosque); color:var(--crema); border-color:var(--bosque)}
.tint-1{background:var(--durazno)} .tint-2{background:var(--salviaclaro)} .tint-3{background:var(--rosa)}
.tint-4{background:var(--greige)} .tint-5{background:var(--salvia); color:var(--crema)}
.tint-r{background:var(--noche); color:var(--crema)}
.ledger{display:grid; grid-template-columns:repeat(6,1fr); column-gap:24px}
.ledger > div{border-top:1px solid var(--rule2); padding-top:18px}
.rows{display:flex; flex-direction:column}
.rows > div{display:grid; grid-template-columns:3fr 9fr; column-gap:24px; padding:18px 0; border-top:1px solid var(--rule)}
.rows > div:first-child{border-top:1px solid var(--rule2)}
.rows > div.inv{grid-template-columns:2.4fr 8.6fr 1fr; align-items:baseline}
.rows.tight > div{padding:12px 0} .rows.tight .sm{font-size:21px}
.rows.xt > div{padding:9px 0} .rows.xt .sm{font-size:19px} .rows.xt .eb{font-size:13px}
.center{grid-column:1/-1; display:flex; flex-direction:column; align-items:center; text-align:center; gap:24px}
.fig{display:flex; align-items:center; justify-content:center}
.fig svg{height:100%; width:auto; max-width:100%; display:block}
svg text{font-family:var(--sans)}

/* clicable */
.go{cursor:pointer; transition:transform 180ms var(--out), background 180ms ease, box-shadow 180ms ease}
.go:hover{transform:translateY(-3px); box-shadow:0 10px 26px rgba(43,40,35,.14)}
.go:active{transform:scale(.985)}
.go:focus-visible{outline:2px solid var(--salvia); outline-offset:2px}
.rows > div.go:hover{transform:none; box-shadow:none; background:rgba(148,160,130,.14)}
.lnk{color:var(--bosque); border-bottom:1px solid var(--salvia); cursor:pointer}

/* tarjetas de sesión (calendario semana por semana) */
.ses{display:flex; flex-direction:column; gap:8px; padding:0 0 22px; min-height:520px; max-height:560px; overflow:hidden}
.ses .mini{width:100%; height:170px; object-fit:cover; display:block; margin-bottom:10px}
.ses .in{padding:0 26px; display:flex; flex-direction:column; gap:8px; flex:1}
.ses .eb{font-size:13px; letter-spacing:.22em}
.ses .h{font-size:29px; font-family:var(--serif); font-weight:300; line-height:1.12}
.ses .sm{font-size:17px}
.ses .chips{margin-top:auto; padding-top:10px}
.ses .chip{font-size:12px; letter-spacing:.14em; padding:7px 11px; margin:0 6px 6px 0}
.ses.off{background:transparent; border:1px dashed var(--rule2); justify-content:center; align-items:center; text-align:center; padding:26px}

/* calendario por bloque de 5 semanas · semanas en columnas, días en filas */
.blk{grid-column:1/-1; display:grid; grid-template-columns:repeat(5,1fr); grid-template-rows:44px repeat(3,minmax(0,1fr)); gap:10px; height:636px}
.blk.b2{grid-template-columns:64px repeat(5,1fr) 1fr}
.blk .hd{display:flex; justify-content:space-between; align-items:baseline; padding:0 4px 8px; border-bottom:1px solid var(--rule2); height:44px}
.blk .hd .w{font:300 34px/1 var(--serif); color:var(--bosque)}
.blk .hd .d{font:500 12px/1.3 var(--sans); letter-spacing:.14em; text-transform:uppercase; color:var(--soft)}
.blk .hd.tec{flex-direction:column; justify-content:flex-end; align-items:flex-start; border-bottom-color:var(--rule2)}
.blk .cell{position:relative; padding:0 0 12px; display:flex; flex-direction:column; gap:4px; overflow:hidden; min-height:0}
.blk .cell .mini{width:100%; height:62px; object-fit:cover; display:block; flex:none}
.blk .cell .c1{font:500 11px/1 var(--sans); letter-spacing:.16em; text-transform:uppercase; color:var(--soft); display:flex; justify-content:space-between; padding:9px 14px 0; flex:none}
.tint-5 .c1, .tint-r .c1{color:rgba(239,232,218,.75)}
.blk .cell .c2{font:300 20px/1.12 var(--serif); color:var(--bosque); padding:0 14px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; flex:none; max-height:46px}
.tint-5 .c2, .tint-r .c2{color:var(--crema)}
.blk .cell .c3{font:400 12px/1.3 var(--sans); color:var(--soft); margin-top:auto; padding:6px 14px 0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.tint-5 .c3, .tint-r .c3{color:rgba(239,232,218,.75)}
.blk .cell.off{background:rgba(217,209,194,.35); border:1px dashed var(--rule2); justify-content:center; align-items:center; color:var(--soft); padding:12px}
.blk .cell.off .c2{color:var(--soft); font-size:18px; text-align:center; padding:0}
.blk .cell.tall{grid-row:span 3}
.blk .cell.tall .mini{height:auto; flex:1; min-height:0}
.blk .tecol{writing-mode:vertical-rl; transform:rotate(180deg); grid-row:span 3; display:flex; align-items:center; justify-content:center; font:500 12px/1 var(--sans); letter-spacing:.3em; text-transform:uppercase; color:var(--crema); background:var(--noche); padding:14px 0}
.dot{display:inline-block; width:9px; height:9px; border-radius:50%; background:var(--salvia); margin-left:8px; vertical-align:middle}
.dot.ju{background:var(--bosque)} .dot.sy{background:var(--greige); border:1px solid var(--rule2)}
.tint-r .dot.ju, .tint-5 .dot.ju{background:var(--crema)}

/* todas las fechas · 2 columnas × 15 */
.fechas{grid-column:1/-1; display:grid; grid-template-columns:1fr 1fr; column-gap:48px; row-gap:0}
.fechas .colf > div{display:grid; grid-template-columns:44px 116px 1fr 76px; column-gap:14px; align-items:baseline; padding:7px 6px; border-top:1px solid var(--rule); cursor:pointer}
.fechas .colf > div:hover{background:rgba(148,160,130,.14)}
.fechas .colf > div.off{cursor:default; color:var(--soft)} .fechas .colf > div.off:hover{background:transparent}
.fechas .n{font:300 22px/1 var(--serif); color:var(--salvia)}
.fechas .d{font:500 12px/1.3 var(--sans); letter-spacing:.16em; text-transform:uppercase; color:var(--soft)}
.fechas .t{font:300 21px/1.15 var(--serif); color:var(--bosque); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.fechas .w{font:500 11px/1.3 var(--sans); letter-spacing:.14em; text-transform:uppercase; color:var(--soft); text-align:right}

/* glosario · 4 × 6 */
.glos{grid-column:1/-1; display:grid; grid-template-columns:repeat(4,1fr); column-gap:28px; row-gap:18px}
.glos > div{border-top:1px solid var(--rule); padding-top:12px; min-height:92px}
.glos .h{font:300 25px/1.1 var(--serif); color:var(--bosque); margin-bottom:6px}
.glos .sm{font-size:16.5px; line-height:1.4}

/* franja del semestre */
.strip{display:grid; grid-template-columns:repeat(12,1fr); gap:8px}
.strip > div{padding:18px 12px; min-height:112px; display:flex; flex-direction:column; justify-content:space-between}
.strip .w{font:300 34px/1 var(--serif); color:var(--bosque)} .tint-5 .w,.tint-r .w{color:var(--crema)}
.strip .d{font:500 12px/1.3 var(--sans); letter-spacing:.14em; text-transform:uppercase; color:var(--soft)}
.tint-5 .d,.tint-r .d{color:rgba(239,232,218,.75)}

/* ───── láminas de charla ───── */
.ej{position:absolute; inset:0; display:grid; grid-template-columns:7fr 5fr}
.ej .foto{position:relative; overflow:hidden; background:var(--greige)}
.ej .foto img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block}
.foto img.fit{object-fit:contain; padding:56px; background:var(--greige)}
.cred{position:absolute; left:0; right:0; bottom:0; padding:12px 18px 12px; font:400 11.5px/1.35 var(--sans); letter-spacing:.05em; color:rgba(239,232,218,.88); background:linear-gradient(to top, rgba(26,35,26,.72), rgba(26,35,26,0)); text-shadow:0 1px 2px rgba(0,0,0,.4)}
.ej .foto .cred{padding-left:18px; padding-bottom:64px}
.ej .txt{padding:76px 88px 70px 56px; display:flex; flex-direction:column; justify-content:center; gap:16px; background:var(--crema); position:relative}
.ej .txt .eb{font-size:13px}
.ej .txt .t2{font-size:50px}
.ej .txt .a{font:500 14px/1.45 var(--sans); letter-spacing:.18em; text-transform:uppercase; color:var(--bosque)}
.ej .txt .p{font-size:21.5px; line-height:1.52}
.ej .txt .pg{position:absolute; right:88px; bottom:26px}
.ej.sin{grid-template-columns:1fr}
.ej.sin .txt{padding:76px 88px 70px; align-items:flex-start}
.ej.sin .txt .t2{font-size:72px; max-width:18ch}
.ej.sin .txt .p{font-size:26px; max-width:52ch}
.ej.sin .txt .marca{position:absolute; left:88px; top:76px; right:88px; display:flex; justify-content:space-between; padding-bottom:16px; border-bottom:1px solid var(--rule)}

.dos{position:absolute; inset:0; display:grid; grid-template-rows:minmax(0,1fr) 250px}
.dos .fotos{display:grid; grid-template-columns:1fr 1fr; gap:6px; background:var(--crema); min-height:0}
.dos .fotos .foto{position:relative; overflow:hidden; background:var(--greige); min-height:0}
.dos .fotos img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block}
.dos .fotos .sinfoto{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; padding:40px; text-align:center; font:300 26px/1.3 var(--serif); color:var(--bosque)}
.dos .txt{padding:26px 88px 0 88px; display:grid; grid-template-columns:5fr 7fr; column-gap:40px; align-items:start; background:var(--crema); position:relative}
.dos .txt .eb{font-size:13px; margin-bottom:8px}
.dos .txt .t3{font-size:38px; line-height:1.1}
.dos .txt .a{font:500 13px/1.45 var(--sans); letter-spacing:.16em; text-transform:uppercase; color:var(--bosque); margin-top:10px}
.dos .txt .p{font-size:19.5px; line-height:1.5; padding-top:4px}
.dos .txt .pg{position:absolute; right:88px; bottom:26px}

.idea{position:absolute; inset:0; padding:76px 88px 86px; display:flex; flex-direction:column; justify-content:center; gap:22px; background:var(--noche); color:var(--crema)}
.idea .eb{color:var(--salvia)}
.idea .t1{color:var(--crema); font-size:84px; max-width:16ch}
.idea .lede{color:rgba(239,232,218,.85); max-width:46ch}
.idea .pg{position:absolute; right:88px; bottom:26px; color:rgba(239,232,218,.6)}

.hook{position:absolute; inset:0; padding:76px 88px 70px; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; gap:28px}
.hook .q{max-width:22ch}
.hook .pg{position:absolute; right:88px; bottom:26px}

/* ───── navegación fija dentro del escenario (en todas las láminas) ───── */
#nav{position:absolute; left:88px; bottom:26px; z-index:4; display:flex; align-items:center; gap:0; font:500 11.5px/1 var(--sans); letter-spacing:.22em; text-transform:uppercase; color:var(--soft); background:rgba(239,232,218,.92); padding:8px 12px 8px 0; transition:color 200ms ease, background 200ms ease}
#nav a{color:inherit; text-decoration:none; padding:4px 10px; cursor:pointer; border-bottom:1px solid transparent; transition:color 140ms ease, border-color 140ms ease}
#nav a:hover{color:var(--bosque); border-bottom-color:var(--salvia)}
#nav a.on{color:var(--bosque); border-bottom-color:var(--bosque)}
#nav a:active{transform:translateY(1px)}
#nav i{width:1px; height:12px; background:currentColor; opacity:.35; margin:0 2px}
#nav a.volver{display:none; color:var(--salvia)} #nav.hay a.volver{display:inline-block}
#slide.dk #nav{background:rgba(26,35,26,.78); color:rgba(239,232,218,.72)}
#slide.dk #nav a:hover, #slide.dk #nav a.on{color:var(--crema); border-bottom-color:var(--salvia)}

/* ───── índice (menú) dentro del escenario ───── */
#menu{position:absolute; inset:0; background:var(--crema); z-index:8; display:none; padding:60px 88px 60px}
#menu.on{display:block}
#menu .mh{display:flex; justify-content:space-between; align-items:baseline; padding-bottom:16px; border-bottom:1px solid var(--rule)}
#menu h4{font:200 56px/1 var(--serif); letter-spacing:-.015em; color:var(--bosque)}
#menu .mg{display:grid; grid-template-columns:3.2fr 4.4fr 4.4fr; column-gap:40px; padding-top:24px}
#menu h6{font:600 12px/1 var(--sans); letter-spacing:.3em; text-transform:uppercase; color:var(--salvia); margin:0 0 6px; padding-bottom:8px; border-bottom:1px solid var(--rule2)}
.row{appearance:none; width:100%; text-align:left; background:transparent; border:0; border-top:1px solid var(--rule); padding:7px 6px; display:grid; grid-template-columns:34px 92px 1fr 16px; gap:12px; align-items:baseline; cursor:pointer; color:var(--carbon); font-family:var(--sans); transition:background 140ms ease}
.row:first-of-type{border-top:0}
.row:hover{background:rgba(148,160,130,.14)} .row:active{transform:scale(.995)}
.row:focus-visible{outline:2px solid var(--salvia); outline-offset:-2px}
.row .n{font:300 20px/1 var(--serif); color:var(--salvia)}
.row .d{font:500 11px/1.3 var(--sans); letter-spacing:.16em; text-transform:uppercase; color:var(--soft); white-space:nowrap}
.row .t{font:300 20px/1.15 var(--serif); color:var(--bosque); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.row .t small{font:500 10.5px/1 var(--sans); letter-spacing:.14em; text-transform:uppercase; color:var(--soft); margin-left:10px}
.row .dot{margin:0}
.row.big{grid-template-columns:1fr; padding:11px 6px}
.row.big .t{font-size:22px}
#menu .fx, #ficha .fx{position:absolute; right:88px; top:56px; appearance:none; background:transparent; border:1px solid var(--rule2); color:var(--bosque); font:500 12px/1 var(--sans); letter-spacing:.22em; text-transform:uppercase; padding:10px 14px; cursor:pointer}
#menu .fx:active, #ficha .fx:active{transform:scale(.96)}

/* ───── ficha del día (dentro del escenario) ───── */
#scrim{position:absolute; inset:0; background:rgba(26,35,26,.55); display:none; z-index:5}
#ficha{position:absolute; left:88px; right:88px; bottom:0; top:96px; background:var(--crema); z-index:6; display:none; box-shadow:0 -20px 60px rgba(0,0,0,.35); overflow:hidden; grid-template-columns:400px 1fr}
#ficha.on{display:grid} #scrim.on{display:block}
@media (prefers-reduced-motion: no-preference){
  #ficha.on{animation:sube 300ms var(--out)} #scrim.on{animation:fadein 240ms ease-out}
  @keyframes sube{from{opacity:0; transform:translateY(28px)} to{opacity:1; transform:none}}
}
#ficha .fimg{position:relative; background:var(--greige); overflow:hidden}
#ficha .fimg img{width:100%; height:100%; object-fit:cover; display:block}
#ficha .fimg .cred{padding-bottom:14px}
#ficha .fc{padding:46px 56px 40px 52px; display:flex; flex-direction:column; min-height:0}
#ficha .fx{right:40px; top:34px}
#ficha .fh{padding-bottom:18px; border-bottom:1px solid var(--rule2); padding-right:120px}
#ficha .fh .t2{font-size:46px; margin-top:10px}
#ficha .fh .lede{font-size:23px; margin-top:10px; line-height:1.35}
#ficha .fb{display:grid; grid-template-columns:1fr 1fr 1fr; column-gap:32px; row-gap:18px; padding-top:22px; flex:1; min-height:0; overflow:hidden}
#ficha .fb h5{font:600 11px/1 var(--sans); letter-spacing:.3em; text-transform:uppercase; color:var(--salvia); margin-bottom:8px}
#ficha .fb p{font:300 17.5px/1.45 var(--sans); color:var(--carbon)}
#ficha .fb p + h5{margin-top:16px}
#ficha .fb p.ex{font-style:italic; color:var(--soft)}
#ficha .btn{display:inline-block; margin-top:18px; padding:13px 20px; background:var(--bosque); color:var(--crema); font:600 12px/1 var(--sans); letter-spacing:.24em; text-transform:uppercase; cursor:pointer; border:0}
#ficha .btn.off{background:transparent; color:var(--soft); border:1px solid var(--rule2); cursor:default}
#ficha .btn:active{transform:scale(.97)}

/* ───── controles (fuera del escenario) ───── */
#bar{position:fixed; left:0; right:0; bottom:0; height:52px; display:flex; align-items:center; gap:12px; padding:0 16px; z-index:10; font:500 12px/1 var(--sans); letter-spacing:.22em; text-transform:uppercase; color:rgba(239,232,218,.55); transition:opacity 300ms ease}
#bar.hide{opacity:0}
#bar span{white-space:nowrap} #lbl{max-width:360px; overflow:hidden; text-overflow:ellipsis}
#bar button{white-space:nowrap; appearance:none; background:transparent; border:1px solid rgba(239,232,218,.25); color:rgba(239,232,218,.85); font:inherit; letter-spacing:inherit; text-transform:inherit; padding:8px 12px; cursor:pointer; transition:transform 160ms var(--out), background 160ms ease}
#bar button:hover{background:rgba(239,232,218,.08)} #bar button:active{transform:scale(.96)}
#bar button:focus-visible{outline:2px solid var(--salvia); outline-offset:2px}
#prog{flex:1; height:1px; background:rgba(239,232,218,.2); position:relative}
#prog i{position:absolute; left:0; top:-1px; height:3px; background:var(--salvia); transition:width 300ms var(--out)}
#dots{display:flex; gap:4px; align-items:center; max-width:260px; overflow:hidden}
#dots i{width:5px; height:5px; border-radius:50%; background:rgba(239,232,218,.28); display:block; flex:none; transition:width 200ms var(--out), background 200ms ease}
#dots i.on{background:var(--salvia); width:16px; border-radius:3px}
#dots i.b{background:rgba(148,160,130,.55)}

#notas{position:fixed; right:16px; bottom:64px; width:460px; max-height:52vh; overflow:auto; background:var(--crema); color:var(--carbon); padding:18px 20px; font:300 15px/1.5 var(--sans); display:none; z-index:15; box-shadow:0 12px 40px rgba(0,0,0,.4)}
#notas.on{display:block}
#notas b{display:block; font:600 11px/1 var(--sans); letter-spacing:.3em; text-transform:uppercase; color:var(--salvia); margin-bottom:10px}
#ayuda{position:fixed; left:16px; bottom:64px; background:var(--crema); color:var(--carbon); padding:16px 20px; font:300 14px/1.7 var(--sans); display:none; z-index:15; box-shadow:0 12px 40px rgba(0,0,0,.4); width:420px}
#ayuda.on{display:block}
#ayuda b{font-weight:600; color:var(--bosque)}

/* ───── v7 · propósito, por qué, mapa de ejemplos, invitados ───── */
.lista{list-style:none; margin:10px 0 0; padding:0}
.lista li{position:relative; padding:0 0 10px 22px; font:300 20px/1.42 var(--sans); color:var(--carbon)}
.lista li::before{content:""; position:absolute; left:0; top:11px; width:10px; height:1px; background:var(--salvia)}
.porque{font:300 18px/1.45 var(--sans); color:var(--carbon); background:rgba(148,160,130,.16); border-left:2px solid var(--salvia); padding:12px 16px; margin-top:14px; max-width:60ch}
.porque b{font-weight:600; color:var(--bosque)}
.idea .porque{background:rgba(148,160,130,.2); color:rgba(239,232,218,.9)} .idea .porque b{color:var(--crema)}
.ej .txt .porque{font-size:17px; padding:10px 14px; margin-top:12px}
.dos .txt .porque{font-size:16px; padding:8px 12px; margin-top:8px}
.a2{font:500 14px/1.4 var(--sans); letter-spacing:.18em; text-transform:uppercase; color:var(--salvia); margin-top:6px}

.mapa{grid-column:1/-1; display:grid; grid-template-columns:repeat(4,1fr); column-gap:28px; row-gap:20px}
.mapa > div{border-top:1px solid var(--rule2); padding-top:12px}
.mapa .n{font:300 26px/1 var(--serif); color:var(--salvia); display:block; margin-bottom:6px}
.mapa .t{font:300 24px/1.12 var(--serif); color:var(--bosque); margin-bottom:4px}
.mapa .sm{font-size:16.5px; color:var(--soft)}

.invs{grid-column:1/-1; display:grid; grid-template-columns:repeat(6,1fr); column-gap:20px}
.invs > div{cursor:pointer; transition:transform 180ms var(--out)}
.invs > div:hover{transform:translateY(-3px)}
.invs img, .invs .sinfoto2{width:100%; aspect-ratio:1/1; object-fit:cover; display:block; margin-bottom:12px; background:var(--greige)}
.invs .sinfoto2{display:flex; align-items:center; justify-content:center}
.invs .sinfoto2 .eb{font-size:26px; letter-spacing:.1em; color:var(--soft)}
.invs .eb{font-size:11px; letter-spacing:.18em}
.invs .h{font:300 24px/1.1 var(--serif); margin:6px 0 4px}
.invs .sm{font-size:15.5px; color:var(--soft)}
.sinretrato{width:100%; height:100%; background:var(--greige); display:flex; align-items:center; justify-content:center}

/* más movimiento en las láminas de idea y de pregunta */
@media (prefers-reduced-motion: no-preference){
  .s.on .idea .t1{animation:subeGrande 900ms var(--out) both}
  .s.on .idea .eb{animation:cortina 700ms var(--out) both}
  .s.on .idea .lede{animation:up 800ms 260ms var(--out) both}
  .s.on .idea .porque{animation:up 800ms 420ms var(--out) both}
  .s.on .idea::after{content:""; position:absolute; left:88px; bottom:58px; height:1px; width:calc(100% - 176px); background:var(--salvia); transform-origin:left; animation:linea 1100ms 200ms var(--out) both}
  .s.on .hook .q{animation:subeGrande 1000ms var(--out) both}
  .s.on .hook .eb{animation:cortina 700ms var(--out) both}
  .s.on .hook .p{animation:up 800ms 420ms var(--out) both}
  .s.on .hook::before{content:""; position:absolute; left:50%; top:26%; width:1px; height:56px; background:var(--salvia); transform-origin:top; animation:lineaV 900ms 120ms var(--out) both}
  @keyframes subeGrande{from{opacity:0; transform:translateY(30px) scale(.985)} to{opacity:1; transform:none}}
  @keyframes cortina{from{opacity:0; letter-spacing:.6em} to{opacity:1; letter-spacing:.32em}}
  @keyframes linea{from{transform:scaleX(0)} to{transform:scaleX(1)}}
  @keyframes lineaV{from{transform:scaleY(0); opacity:0} to{transform:scaleY(1); opacity:1}}
  .s.on .mapa > div{animation:up 600ms var(--out) both}
  .s.on .mapa > div:nth-child(n+5){animation-delay:100ms} .s.on .mapa > div:nth-child(n+9){animation-delay:200ms}
  .s.on .invs > div{animation:up 620ms var(--out) both}
  .s.on .invs > div:nth-child(2){animation-delay:70ms} .s.on .invs > div:nth-child(3){animation-delay:140ms}
  .s.on .invs > div:nth-child(4){animation-delay:210ms} .s.on .invs > div:nth-child(5){animation-delay:280ms} .s.on .invs > div:nth-child(6){animation-delay:350ms}
  .s.on .lista li{animation:up 560ms var(--out) both}
  .s.on .lista li:nth-child(2){animation-delay:110ms} .s.on .lista li:nth-child(3){animation-delay:220ms} .s.on .lista li:nth-child(4){animation-delay:330ms}
}

/* ───── molde v7 ───── */
.fo{position:relative; overflow:hidden; background:var(--greige)}
.fo img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.fo.sin{display:flex; align-items:center; justify-content:center; border:1px dashed var(--rule2); background:transparent}
.fo .cred{padding:8px 12px; font-size:10.5px}
.rej{grid-column:1/-1; display:grid; grid-template-columns:repeat(4,1fr); column-gap:22px}
.rej .fo{height:250px; margin-bottom:14px}
.rej .h{font:300 25px/1.1 var(--serif); margin-bottom:6px}
.rej .sm{font-size:16px; line-height:1.42}
.pte{grid-column:1/-1; display:grid; grid-template-columns:1fr 1fr; column-gap:48px; row-gap:0}
.pte > div{display:grid; grid-template-columns:54px 1fr; column-gap:14px; padding:12px 0; border-top:1px solid var(--rule); align-items:baseline}
.pte .n{font:300 30px/1 var(--serif); color:var(--salvia)}
.pte .h{font:300 25px/1.1 var(--serif); margin-bottom:3px}
.pte .sm{font-size:16.5px; color:var(--soft)}
/* ejemplo v2: foto 50 %, texto 50 % con tres bloques */
.ej2{grid-template-columns:1fr 1fr}
.ej2 .txt{padding:56px 72px 56px 52px; gap:10px; justify-content:center}
.ej2 .txt .t2{font-size:42px}
.ej2 .txt .a{font-size:12.5px; letter-spacing:.16em}
.ej2 .txt .p{font-size:18px; line-height:1.48}
.ej2 .minis{display:flex; flex-direction:column; gap:8px; margin-top:4px}
.ej2 .mini h5{font:600 10.5px/1 var(--sans); letter-spacing:.28em; text-transform:uppercase; color:var(--salvia); margin-bottom:4px}
.ej2 .mini p{font:300 15.5px/1.42 var(--sans); color:var(--carbon)}
.ej2 .txt .porque{font-size:15px; padding:9px 12px; margin-top:8px}
.ej2.sin .txt{align-items:flex-start}
.c4{grid-column:1/-1; display:grid; grid-template-columns:repeat(4,1fr); column-gap:22px}
.c4 .fo{height:200px; margin-bottom:12px}
.c4 .num{font-size:30px; margin-bottom:6px}
.c4 .h{font:300 26px/1.1 var(--serif); margin-bottom:6px}
.c4 .sm{font-size:15.5px; line-height:1.42}
.c4 .ejr{margin-top:8px; color:var(--soft)} .c4 .ejr b{color:var(--bosque)}
.bl4{grid-column:1/-1; display:grid; grid-template-columns:1fr 1fr; column-gap:40px; row-gap:22px}
.bl4 > div{border-top:1px solid var(--rule2); padding-top:14px}
.bl4 h5{font:600 12px/1 var(--sans); letter-spacing:.3em; text-transform:uppercase; color:var(--salvia); margin-bottom:10px}
.bl4 p{font:300 19px/1.5 var(--sans); color:var(--carbon)} .bl4 p b{font-weight:500; color:var(--bosque)}
.ops{grid-column:1/-1; display:grid; grid-template-columns:repeat(3,1fr); column-gap:30px}
.ops > div{border-top:1px solid var(--rule2); padding-top:14px}
.ops .big{font-size:64px; display:block; margin-bottom:6px; color:var(--salvia)}
.ops .h{font:300 27px/1.1 var(--serif); margin-bottom:8px}
.ops .sm{font-size:16.5px; line-height:1.45}
.ops .et{margin-top:8px; color:var(--soft)} .ops .et b{color:var(--bosque)}
.crit{padding:14px 18px; border-left:2px solid var(--rule2)}
.crit h5{font:600 11px/1 var(--sans); letter-spacing:.3em; text-transform:uppercase; margin-bottom:6px}
.crit p{font:300 italic 17.5px/1.35 var(--serif); color:var(--carbon)} .crit p.sm{font:300 14px/1.4 var(--sans); color:var(--soft); margin-top:5px}
.crit{padding:11px 16px}
.crit.mal{background:rgba(234,217,214,.55)} .crit.mal h5{color:#8a5a52}
.crit.bien{background:rgba(219,227,213,.7)} .crit.bien h5{color:var(--bosque)}
@media (prefers-reduced-motion: no-preference){
  .s.on .rej > div, .s.on .c4 > div, .s.on .ops > div, .s.on .pte > div, .s.on .bl4 > div{animation:up 600ms var(--out) both}
  .s.on .rej > div:nth-child(2), .s.on .c4 > div:nth-child(2), .s.on .ops > div:nth-child(2), .s.on .pte > div:nth-child(2), .s.on .bl4 > div:nth-child(2){animation-delay:90ms}
  .s.on .rej > div:nth-child(3), .s.on .c4 > div:nth-child(3), .s.on .ops > div:nth-child(3), .s.on .pte > div:nth-child(3), .s.on .bl4 > div:nth-child(3){animation-delay:180ms}
  .s.on .rej > div:nth-child(4), .s.on .c4 > div:nth-child(4), .s.on .pte > div:nth-child(4), .s.on .bl4 > div:nth-child(4){animation-delay:270ms}
  .s.on .pte > div:nth-child(5){animation-delay:360ms} .s.on .pte > div:nth-child(6){animation-delay:450ms}
  .s.on .ej2 .minis .mini{animation:up 600ms var(--out) both} .s.on .ej2 .minis .mini:nth-child(2){animation-delay:120ms} .s.on .ej2 .minis .mini:nth-child(3){animation-delay:240ms}
}
.gal{grid-column:1/-1; display:grid; column-gap:20px}
.gal.g3{grid-template-columns:repeat(3,1fr)} .gal.g4{grid-template-columns:repeat(4,1fr)} .gal.g5{grid-template-columns:repeat(5,1fr)}
.gal .fo{height:300px; margin-bottom:12px} .gal.g5 .fo{height:260px}
.gal .h{font:300 22px/1.1 var(--serif); margin-bottom:5px}
.gal .sm{font-size:15px; line-height:1.4}
@media (prefers-reduced-motion: no-preference){ .s.on .gal > div{animation:up 600ms var(--out) both} .s.on .gal > div:nth-child(2){animation-delay:80ms} .s.on .gal > div:nth-child(3){animation-delay:160ms} .s.on .gal > div:nth-child(4){animation-delay:240ms} .s.on .gal > div:nth-child(5){animation-delay:320ms} }

.tarea .p{font-size:16.5px; line-height:1.45}
.tarea .rows.xt > div{padding:7px 0}
.tarea .rows.xt .sm{font-size:15px; line-height:1.4}
.tarea .rows.xt .eb{font-size:11.5px}
.tarea .porque{font-size:14.5px; padding:9px 12px; margin-top:6px}

/* molde v7 · dos casos */
.dos.d2{grid-template-rows:minmax(0,1fr) 318px}
.dos.d2 .txt{padding-top:22px}
.dos.d2 .txt .t3{font-size:34px}
.dos.d2 .txt .p{font-size:17px; line-height:1.45; padding-top:2px}
.dos.d2 .txt .porque{font:400 13.5px/1.4 var(--sans); color:var(--bosque); margin-top:10px; padding:10px 14px; background:rgba(61,74,57,.07); border-left:2px solid var(--salvia)}
.dos.d2 .txt .porque b{font-weight:600; color:var(--carbon)}

/* molde v7 · figura: columna de texto compacta */
.figtxt .t2{font-size:32px !important; line-height:1.12}
.figtxt .p{font-size:15.5px; line-height:1.42; margin-top:10px}
.figtxt .rows.xt .sm, .figtxt .sm{font-size:13px; line-height:1.38}
.figtxt .rows.xt{margin-top:10px; gap:5px}
.figtxt .porque{font-size:13.5px; line-height:1.4; padding:9px 12px; margin-top:10px}

/* canvas · palabras largas */
.rows .sm, .rows.xt .sm, .tarea .sm{overflow-wrap:anywhere}

/* ── v8 · sistema global: color por sesión, fases, etiqueta, separadores, portada ── */
.sbar{position:absolute; left:0; top:0; right:0; height:10px; z-index:5}
.topr{display:flex; align-items:baseline; gap:18px}
.fase{font:600 13px/1 var(--sans); letter-spacing:.3em; text-transform:uppercase; padding:8px 12px 7px; border:1.5px solid; border-radius:2px; position:relative; top:-3px}
.foot{gap:26px}
.seslbl{font:500 13.5px/1 var(--sans); letter-spacing:.2em; text-transform:uppercase; color:var(--soft)} .seslbl b{font-weight:600}
.seslbl.free{position:absolute; right:150px; bottom:29px; z-index:4}
.dark .seslbl, .dk .seslbl{color:rgba(239,232,218,.6)}
.sep{position:absolute; inset:0; padding:76px 88px 86px; display:flex; flex-direction:column; justify-content:center; gap:16px; color:var(--crema)}
.sep .eb{color:rgba(239,232,218,.78)} .sep .hero{color:var(--crema); font-size:190px; line-height:.92; margin:6px 0 10px} .sep .lede{color:rgba(239,232,218,.92); font-size:34px; max-width:34ch}
.sep + .seslbl.free{color:rgba(239,232,218,.75)} .sep + .seslbl.free b{color:var(--crema) !important}
.port{position:absolute; inset:0; display:grid; grid-template-columns:47fr 53fr}
.port .pblk{padding:80px 60px 70px 88px; display:flex; flex-direction:column; justify-content:center; gap:10px; color:var(--crema); position:relative}
.port .pblk .eb{color:rgba(239,232,218,.8)}
.port .pnum{font:200 250px/.85 var(--serif); letter-spacing:-.05em; color:var(--crema); margin:4px 0 10px}
.port .t2{color:var(--crema); font-size:62px; line-height:1.02}
.port .lede{color:rgba(239,232,218,.92); font-size:23px; line-height:1.4; max-width:36ch; margin-top:6px}
.port .chip{border-color:rgba(239,232,218,.55); color:var(--crema)} .port .chip.go{cursor:pointer}
.port .foto{position:relative; overflow:hidden; background:var(--greige)}
.port .foto img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block}
.prox{display:flex; flex-direction:column; gap:20px; padding:36px 44px; align-self:center; border-radius:2px}
.prox .eb{margin-bottom:6px; display:block}
.disc{font:italic 300 22px/1.4 var(--serif); color:var(--bosque); margin-top:10px; border-top:1px solid var(--rule); padding-top:12px} .disc b{font:600 12px/1 var(--sans); letter-spacing:.28em; text-transform:uppercase; font-style:normal; display:block; margin-bottom:6px; color:var(--salvia)}
.chip.dl{background:var(--bosque); color:var(--crema); border-color:var(--bosque); text-decoration:none; margin-top:14px}
/* tamaños mínimos para proyectar (Julio, 19-sep): nada por debajo de 18 px en escenario */
.sm{font-size:20px}
.rows.xt .sm{font-size:20px} .rows.xt .eb{font-size:14px}
.rej .sm{font-size:19px; line-height:1.4} .rej .h{font-size:27px}
.c4 .sm{font-size:18px; line-height:1.4} .c4 .h{font-size:27px}
.gal .sm{font-size:18px} .gal .h{font-size:24px}
.ej2 .txt .p{font-size:21px; line-height:1.48} .ej2 .txt .a{font-size:14px} .ej2 .mini p{font-size:18px; line-height:1.4} .ej2 .mini h5{font-size:12px} .ej2 .txt .porque{font-size:16px}
.dos.d2 .txt .p{font-size:20px} .dos.d2 .txt .porque{font-size:15px}
.figtxt .p{font-size:18px} .figtxt .sm{font-size:16px} .figtxt .porque{font-size:15px}
.ses .sm{font-size:19px} .glos .sm{font-size:18px}
.bl4 p{font-size:19px} .bl4 h5{font-size:13px}
.tarea .sm{font-size:18px} .tarea .p{font-size:20px}
.crit p{font-size:18px} .crit .sm{font-size:16px}

.glos .sm{font-size:17px; line-height:1.38} .glos div{padding:3px 0}

/* v8 · fotos3 · burger · matriz */
.f3{grid-column:1/-1; display:grid; grid-template-columns:repeat(3,1fr); column-gap:22px}
.f3 .fo{height:330px; margin-bottom:12px} .f3 .h{font:300 26px/1.1 var(--serif); margin-bottom:4px} .f3 .sm{font-size:18px; line-height:1.4}
.f3txt{grid-column:1/-1; display:grid; grid-template-columns:1fr 1fr 1fr; column-gap:32px; margin-top:22px; padding-top:18px; border-top:1px solid var(--rule)}
.f3txt .eb{display:block; margin-bottom:8px} .f3txt .p{font-size:20px; line-height:1.45} .f3txt .disc{margin-top:0; border-top:0; padding-top:0}
.burger{display:flex; flex-direction:column; gap:10px}
.burger > div{padding:20px 24px; border-radius:3px} .burger .pan{background:#E9DFC9; border:1px solid var(--rule2)} .burger .carne{background:#3D4A39; color:var(--crema); margin:0 14px}
.burger .carne .eb, .burger .carne .h, .burger .carne .sm{color:var(--crema)} .burger .carne .eb{color:var(--salvia)}
.burger .h{font:300 30px/1.1 var(--serif); margin:6px 0 6px} .burger .sm{font-size:18px; line-height:1.4}
/* v8 · introducción: tres preguntas y cuatro fases */
.tres3{grid-column:1/-1; display:grid; grid-template-columns:repeat(3,1fr); column-gap:30px}
.tres3 .big{font-size:96px; display:block; margin-bottom:8px; color:var(--salvia)} .tres3 .h{font:300 30px/1.15 var(--serif); margin-bottom:12px; color:var(--bosque)} .tres3 .sm{font-size:19px; line-height:1.42}
.fases4{grid-column:1/-1; display:grid; grid-template-columns:repeat(4,1fr); column-gap:22px}
.fases4 > div{padding:22px 22px 24px; border-top:6px solid var(--salvia)} .fases4 > div:nth-child(1){border-color:hsl(18,46%,37%); background:hsl(18,42%,94%)} .fases4 > div:nth-child(2){border-color:hsl(155,46%,37%); background:hsl(155,42%,94%)} .fases4 > div:nth-child(3){border-color:hsl(293,46%,37%); background:hsl(293,42%,94%)} .fases4 > div:nth-child(4){border-color:hsl(70,46%,37%); background:hsl(70,42%,94%)}
.fases4 .h{font:300 30px/1.1 var(--serif); margin:10px 0 8px; color:var(--bosque)} .fases4 .sm{font-size:18px; line-height:1.4}

.rows.xt.dense .sm{font-size:18px; line-height:1.38} .rows.xt.dense > div{padding:7px 0}
.figfila{display:grid; grid-template-columns:repeat(4,1fr); column-gap:26px; margin-top:14px; padding-top:12px; border-top:1px solid var(--rule)}
.figfila .eb{display:block; margin-bottom:6px} .figfila .sm{font-size:17px; line-height:1.38}

/* v9 · un tinte vivo por semana */
.tint-1{background:rgb(239,198,188)}
.tint-2{background:rgb(188,239,212)}
.tint-3{background:rgb(227,188,239)}
.tint-4{background:rgb(236,239,188)}
.tint-5{background:rgb(188,221,239)}
.tint-6{background:rgb(239,188,207)}
.tint-7{background:rgb(192,239,188)}
.tint-8{background:rgb(200,188,239)}
.tint-9{background:rgb(239,214,188)}
.tint-10{background:rgb(188,239,229)}
.tint-11{background:rgb(239,188,234)}
.tint-11{background:var(--salvia); color:var(--crema)}
.tint-11 .c1{color:rgba(239,232,218,.75)} .tint-11 .c2{color:var(--crema)} .tint-11 .c3{color:rgba(239,232,218,.75)}
.tint-11 .dot.ju{background:var(--crema)} .tint-11 .w{color:var(--crema)} .tint-11 .d{color:rgba(239,232,218,.75)}

/* v8 · tabla de calificación */
.calif{display:flex; flex-direction:column}
.calif > div{display:grid; grid-template-columns:6.4fr 1.1fr 1.2fr 1.3fr 1.4fr; column-gap:18px; align-items:baseline; padding:13px 0; border-top:1px solid var(--rule)}
.calif > div > span{font:400 21px/1.3 var(--sans); color:var(--tinta)}
.calif > div > span:nth-child(n+2){text-align:right; font-variant-numeric:tabular-nums}
.calif b{font-weight:600} .calif i{display:block; font-style:normal; font-size:17px; color:var(--soft); margin-top:3px}
.calif .ch{border-top:0; border-bottom:1px solid var(--rule2)} .calif .ch span{font:500 14px/1 var(--sans); letter-spacing:.18em; text-transform:uppercase; color:var(--soft)}
.calif .tot{font-weight:600}
.calif .yo{color:var(--bosque); font-weight:500} .calif .eq{color:var(--soft)}
.calif .cs{border-top:2px solid var(--tinta)} .calif .cs span{font-size:26px; font-weight:600}

.fases4.tres{grid-column:1/13; display:grid; grid-template-columns:repeat(3,1fr); column-gap:26px}

/* v8 · el índice toma el color de cada sesión */
#menu .row{position:relative; padding-left:16px}
#menu .row::before{content:''; position:absolute; left:0; top:50%; transform:translateY(-50%); width:5px; height:26px; border-radius:3px; background:var(--ac, var(--salvia)); opacity:.9}
#menu .row .n{color:var(--ac, var(--salvia)); font-weight:600}
#menu .row:hover{background:color-mix(in srgb, var(--ac, var(--salvia)) 14%, transparent)}
#menu .row:hover .t{color:var(--ac, var(--salvia))}
#menu .row .dot.ju{background:var(--ac, var(--salvia))}
#menu h6{color:var(--tinta); border-bottom:2px solid var(--tinta)}

/* ═══════════ v9 · láminas de siete partes ═══════════ */
.frame .sbar{height:10px}
.v9 .top .eb{font-weight:600}
.pt9{position:absolute; inset:0; overflow:hidden}
.pt9 img{width:100%; height:100%; object-fit:cover; display:block}
.pt9 .velo{position:absolute; inset:0; background:linear-gradient(90deg, rgba(0,0,0,.72) 0%, rgba(0,0,0,.35) 45%, rgba(0,0,0,0) 75%)}
.pt9 .txt{position:absolute; left:96px; bottom:96px; right:560px; color:#fff}
.pt9 .txt .eb{color:#fff; opacity:.9}
.pt9 .txt h1{font:200 108px/.95 var(--serif); letter-spacing:-.02em; margin:14px 0 18px; color:#fff}
.pt9 .txt .num{font:200 190px/1 var(--serif); color:#fff; opacity:.28; position:absolute; right:-380px; bottom:-40px}
.pt9 .txt p{font:400 24px/1.4 var(--sans); color:#fff; max-width:56ch; opacity:.95}
.pt9 .chipbar{position:absolute; left:96px; top:56px; display:flex; gap:10px}
.pt9 .chipbar span{background:rgba(255,255,255,.16); color:#fff; border:1px solid rgba(255,255,255,.45); padding:8px 14px; font:600 13px/1 var(--sans); letter-spacing:.2em; text-transform:uppercase; backdrop-filter:blur(6px)}
.pl9{display:grid; grid-template-columns:7fr 5fr; column-gap:48px; align-items:center; height:640px}
.pl9 .fo{height:640px; position:relative; overflow:hidden; border-radius:6px}
.pl9 .fo img{width:100%; height:100%; object-fit:cover; display:block}
.pl9 .fo .cred{position:absolute; left:0; right:0; bottom:0; padding:8px 14px; font:400 12px/1.3 var(--sans); color:#fff; background:linear-gradient(0deg, rgba(0,0,0,.6), rgba(0,0,0,0))}
.pl9 .tx h2{font:200 46px/1.06 var(--serif); letter-spacing:-.01em; margin:12px 0 18px; color:var(--carbon)}
.pl9 .tx p{font:400 23px/1.5 var(--sans); color:var(--carbon)}
.pl9 .tx .preg{margin-top:20px; padding:16px 18px; border-left:6px solid var(--ac); background:var(--ti); font:500 21px/1.4 var(--sans); color:var(--carbon)}
.fo9{position:absolute; inset:0; overflow:hidden}
.fo9 img{width:100%; height:100%; object-fit:cover; display:block}
.fo9 .band{position:absolute; left:0; right:0; bottom:0; padding:44px 96px 60px; background:linear-gradient(0deg, rgba(0,0,0,.78), rgba(0,0,0,.45) 60%, rgba(0,0,0,0)); color:#fff}
.fo9 .band h2{font:200 48px/1.05 var(--serif); color:#fff; margin:6px 0 10px}
.fo9 .band p{font:400 22px/1.45 var(--sans); color:#fff; max-width:70ch; opacity:.95}
.fo9 .band .eb{color:#fff; opacity:.85}
.fo9 .cred{position:absolute; right:14px; top:14px; padding:6px 10px; font:400 12px/1.3 var(--sans); color:#fff; background:rgba(0,0,0,.45)}
.dos9{display:grid; grid-template-columns:1fr 1fr; column-gap:28px; height:520px}
.dos9 .fo{position:relative; overflow:hidden; border-radius:6px; height:520px}
.dos9 .fo img{width:100%; height:100%; object-fit:cover; display:block}
.dos9 .fo .cap{position:absolute; left:0; right:0; bottom:0; padding:14px 18px; background:rgba(0,0,0,.55); color:#fff; font:500 18px/1.3 var(--sans)}
.dos9 .fo .cred{position:absolute; right:8px; top:8px; padding:4px 8px; font:400 11px/1.2 var(--sans); color:#fff; background:rgba(0,0,0,.45)}
.cap9{margin-top:22px; display:grid; grid-template-columns:5fr 7fr; column-gap:40px; align-items:start}
.cap9 h2{font:200 40px/1.08 var(--serif); color:var(--carbon)}
.cap9 p{font:400 21px/1.5 var(--sans); color:var(--carbon)}
.cu9{display:grid; grid-template-columns:repeat(4,1fr); column-gap:22px}
.cu9 .fo{height:330px; position:relative; overflow:hidden; border-radius:6px}
.cu9 .fo img{width:100%; height:100%; object-fit:cover; display:block}
.cu9 .fo .cred{position:absolute; left:0; right:0; bottom:0; padding:5px 8px; font:400 11px/1.2 var(--sans); color:#fff; background:rgba(0,0,0,.45)}
.cu9 h4{font:600 20px/1.25 var(--sans); margin:14px 0 6px; color:var(--carbon)}
.cu9 p{font:400 17px/1.45 var(--sans); color:var(--soft)}
.id9{position:absolute; inset:0; display:flex; flex-direction:column; justify-content:center; padding:0 140px; color:#fff}
.id9 .eb{color:#fff; opacity:.8}
.id9 h2{font:200 76px/1.02 var(--serif); letter-spacing:-.015em; color:#fff; margin:18px 0 26px; max-width:18ch}
.id9 p{font:400 26px/1.45 var(--sans); color:#fff; max-width:60ch; opacity:.95}
.fin9{position:absolute; inset:0; overflow:hidden}
.fin9 img{width:100%; height:100%; object-fit:cover; display:block}
.fin9 .tag{position:absolute; left:96px; top:110px; background:var(--ac); color:#fff; padding:14px 22px; font:600 15px/1 var(--sans); letter-spacing:.25em; text-transform:uppercase}
.fin9 .band{position:absolute; left:0; right:0; bottom:0; padding:40px 96px 60px; background:linear-gradient(0deg, rgba(0,0,0,.8), rgba(0,0,0,0)); color:#fff}
.fin9 .band h2{font:200 50px/1.05 var(--serif); color:#fff; margin:0 0 10px}
.fin9 .band p{font:400 22px/1.45 var(--sans); color:#fff; max-width:72ch}
.pa9{display:grid; grid-template-columns:5fr 7fr; column-gap:44px; align-items:center; height:640px}
.pa9 .num{font:200 150px/1 var(--serif); color:var(--ac); letter-spacing:-.04em; margin-bottom:6px}
.pa9 h2{font:200 44px/1.08 var(--serif); color:var(--carbon); margin:0 0 16px}
.pa9 p{font:400 22px/1.5 var(--sans); color:var(--carbon)}
.pa9 .por{margin-top:18px; padding:14px 18px; border-left:6px solid var(--ac); background:var(--ti); font:400 20px/1.45 var(--sans); color:var(--carbon)}
.pa9 .por b{font-weight:600; color:var(--ac)}
.pa9 .fo{height:640px; position:relative; overflow:hidden; border-radius:6px; background:#111}
.pa9 .fo img{width:100%; height:100%; object-fit:cover; display:block}
.pa9 .fo img.fit{object-fit:contain; background:#fff}
.pa9 .fo .cred{position:absolute; left:0; right:0; bottom:0; padding:6px 12px; font:400 12px/1.3 var(--sans); color:#fff; background:rgba(0,0,0,.5)}
.re9{display:grid; grid-template-columns:repeat(var(--nc,3),1fr); column-gap:22px; margin-top:26px}
.re9 > div{background:var(--ti); border-top:8px solid var(--ac); padding:22px 22px 26px; min-height:300px}
.re9 .eb{color:var(--ac)}
.re9 h4{font:200 32px/1.1 var(--serif); margin:10px 0 12px; color:var(--carbon)}
.re9 p{font:400 19px/1.45 var(--sans); color:var(--carbon)}
.us9{position:absolute; inset:0; display:grid; grid-template-columns:5fr 7fr; column-gap:60px; align-items:center; padding:0 110px; color:#fff}
.us9 .eb{color:#fff; opacity:.8}
.us9 h2{font:200 64px/1.02 var(--serif); color:#fff; margin:16px 0 22px}
.us9 p{font:400 23px/1.45 var(--sans); color:#fff; opacity:.95}
.us9 ol{list-style:none; counter-reset:u; display:flex; flex-direction:column; gap:16px}
.us9 ol li{counter-increment:u; display:grid; grid-template-columns:64px 1fr; column-gap:16px; align-items:start; font:400 22px/1.4 var(--sans); color:#fff; padding:14px 0; border-top:1px solid rgba(255,255,255,.28)}
.us9 ol li::before{content:counter(u); font:200 44px/1 var(--serif); color:#fff; opacity:.85}
.ta9{margin-top:20px; display:flex; flex-direction:column}
.ta9 > div{display:grid; grid-template-columns:3fr 9fr; column-gap:28px; padding:16px 0; border-top:1px solid var(--rule); align-items:baseline}
.ta9 > div > span:first-child{font:600 20px/1.3 var(--sans); color:var(--ac)}
.ta9 > div > span:last-child{font:400 21px/1.45 var(--sans); color:var(--carbon)}
.po9{display:grid; grid-template-columns:5fr 7fr; column-gap:48px; align-items:center; height:640px}
.po9 .box{background:var(--ti); border-left:10px solid var(--ac); padding:34px 36px}
.po9 .box .eb{color:var(--ac)}
.po9 .box h2{font:200 44px/1.08 var(--serif); margin:10px 0 8px; color:var(--carbon)}
.po9 .box .file{font:600 22px/1.3 var(--sans); color:var(--carbon); word-break:break-all; margin-bottom:6px}
.po9 ul{list-style:none; display:flex; flex-direction:column; gap:12px}
.po9 ul li{display:grid; grid-template-columns:34px 1fr; column-gap:14px; font:400 22px/1.4 var(--sans); color:var(--carbon); padding:12px 0; border-top:1px solid var(--rule)}
.po9 ul li::before{content:'✓'; color:var(--ac); font-weight:700; font-size:24px}
.an9{position:absolute; inset:0; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; padding:0 140px; gap:22px}
.an9 h2{font:200 60px/1.05 var(--serif); color:var(--carbon); max-width:18ch}
.an9 p{font:400 24px/1.45 var(--sans); color:var(--carbon); max-width:60ch}
.an9 a{display:inline-block; background:var(--ac); color:#fff; text-decoration:none; padding:22px 34px; font:600 18px/1 var(--sans); letter-spacing:.2em; text-transform:uppercase; border-radius:4px}
.an9 a:active{transform:scale(.97)}
.frame.deep{background:var(--dp); color:#fff}
.frame.deep .top .eb, .frame.deep .foot .seslbl, .frame.deep .pg{color:#fff; opacity:.85}
.frame.deep .foot .seslbl b{color:#fff !important}
.frame.deep .fase{color:#fff !important; border-color:#fff !important}
.frame.tinted{background:var(--ti)}
.frame.full .top, .frame.full .foot{position:absolute; left:0; right:0; z-index:3}
.frame.full .top{top:0; padding:24px 96px} .frame.full .foot{bottom:0; padding:0 96px 22px}
.frame.full .top .eb, .frame.full .foot .seslbl, .frame.full .pg{color:#fff; text-shadow:0 1px 8px rgba(0,0,0,.5)}
.frame.full .foot .seslbl b{color:#fff !important}
.frame.full .fase{color:#fff !important; border-color:#fff !important}
.frame.full .body{position:static}

.calif.c9 > div{padding:9px 0} .calif.c9 > div > span{font-size:19px} .calif.c9 i{font-size:14.5px; margin-top:2px} .calif.c9 .cs span{font-size:22px}
.frame.v9 .body{align-content:center}

/* v9 · rejilla de invitados más compacta (caben 10 sin desbordar) */
.invs{gap:14px 16px}
.invs > div img, .invs > div .sinfoto2{height:120px}
.invs > div .h{font-size:17px; margin-top:6px}
.invs > div .sm{font-size:13px; line-height:1.3}
.invs > div .eb{font-size:11px}

/* v9 · planos y gráficos que deben verse completos */
.pa9 .fo.fit, .pl9 .fo.fit{background:#fff; border:1px solid var(--rule)}
.pa9 .fo.fit img, .pl9 .fo.fit img, .pa9 .fo img.fit, .pl9 .fo img.fit{object-fit:contain; padding:14px; background:#fff}

/* v9 · calendario simple: una fila por semana, tres columnas de días */
.cal9{grid-column:1/13; display:grid; grid-template-columns:1.25fr 3fr 3fr 3fr; gap:8px; align-content:start}
.cal9 .chd{font:600 13px/1 var(--sans); letter-spacing:.2em; text-transform:uppercase; color:var(--soft); padding:0 0 4px 2px}
.cal9 .csem{display:flex; flex-direction:column; justify-content:center; padding:10px 4px}
.cal9 .csem b{font:200 30px/1 var(--serif); color:var(--carbon)}
.cal9 .csem span{font:400 15px/1.2 var(--sans); color:var(--soft); margin-top:4px}
.cal9 .cell{border-radius:5px; padding:12px 14px; min-height:82px; display:flex; flex-direction:column; justify-content:center; gap:4px; border-left:6px solid var(--ac); cursor:pointer; transition:transform 160ms var(--out)}
.cal9 .cell:hover{transform:translateY(-2px)}
.cal9 .cell:active{transform:scale(.99)}
.cal9 .cell .c1{font:500 13px/1 var(--sans); letter-spacing:.08em; text-transform:uppercase; color:var(--ac)}
.cal9 .cell .c1 b{font-size:16px; font-weight:700}
.cal9 .cell .c2{font:500 20px/1.2 var(--sans); color:var(--carbon)}
.cal9 .cell .c3{font:400 14px/1 var(--sans); color:var(--soft)}
.cal9 .cell .pw{color:var(--ac); font-weight:700}
.cal9 .cell.off{background:transparent; border:1px dashed var(--rule); border-left:1px dashed var(--rule); min-height:82px}
.cal9 .cell.off .c2{font-size:15px; color:var(--soft)}
.cal9 .ctec{grid-column:2/5; display:flex; align-items:center; padding:0 16px; border-radius:5px; background:var(--greige); font:500 17px/1 var(--sans); color:var(--soft)}

/* v9-B · las láminas de actividad se distinguen de la teoría */
.frame.v9 .fase{font-weight:700; letter-spacing:.24em}
.frame.v9 .fase.act{background:var(--ac); color:#fff !important; border-color:var(--ac) !important; padding:7px 14px}
.frame.v9.act .sbar{height:16px}
.frame.v9.act .top .eb{color:var(--ac); font-weight:700}
.pa9 .num{-webkit-text-stroke:0}
.pa9 h2{font-size:46px}
.actnota{grid-column:1/13; margin-top:14px; padding:12px 16px; border-left:6px solid var(--ac); background:var(--ti); font:500 19px/1.35 var(--sans); color:var(--carbon)}

/* v9-B · el semestre de un vistazo */
.vista9{display:flex; flex-direction:column}
.vista9 > div{display:grid; grid-template-columns:1.1fr 1.5fr 2.4fr 6fr; column-gap:22px; align-items:baseline; padding:13px 0; border-top:1px solid var(--rule)}
.vista9 .w{font:200 30px/1 var(--serif); color:var(--ac)}
.vista9 .f{font:400 16px/1 var(--sans); color:var(--soft); text-transform:uppercase; letter-spacing:.1em}
.vista9 .t{font:600 21px/1.2 var(--sans); color:var(--carbon)}
.vista9 .d{font:400 19px/1.35 var(--sans); color:var(--carbon)}
.vista9 .d b{color:var(--ac); font-weight:600}