/* =========================================================================
   RAPTOR MX 2027 · SISTEMA H1 + I1 ("B sobre A")
   Foto = el mundo (obra/ciudad de madrugada) · Tinta = la voz (cintas, stickers,
   lata-sello, Unbounded). Lienzo 1920×1080. Se carga DESPUÉS de deck.css.
   ========================================================================= */
:root{
  --tinta:#E01B1F; --tinta-2:#B31110; --tinta-sombra:#7F0000; --negro-r:#1D1D1B;
  --chispa:#FF3B2F; --noche:#0C0808; --hueso:#F4EFEA; --acero:#9A9290; --acero-cl:#C9C1BE;
  --ambar:#FFC21A; --mora:#4A2BDB; --mora-glow:#8F7CFF; --mora-noche:#0F0A2E;
  --f-unb:'Unbounded','Saira','Arial Black',sans-serif;
  --f-arc:'Archivo','Helvetica Neue',Arial,sans-serif;
  --f-mono:'Chivo Mono',ui-monospace,Menlo,monospace;
}
:where(.slide).r{background:var(--noche);color:var(--hueso);font-family:var(--f-arc)}
.abs{position:absolute}
.z1{z-index:1}.z2{z-index:2}.z5{z-index:5}.z10{z-index:10}.z20{z-index:20}.z30{z-index:30}.z40{z-index:40}

/* ---------- type ---------- */
.unb{font-family:var(--f-unb);text-transform:uppercase;letter-spacing:-.01em;line-height:1}
.arc{font-family:var(--f-arc)}
.cnd{font-family:var(--f-arc);font-stretch:62%;font-style:italic;font-weight:900;text-transform:uppercase;line-height:1}
.wide{font-family:var(--f-arc);font-stretch:125%;font-weight:700;letter-spacing:.2em;text-transform:uppercase}
.mono{font-family:var(--f-mono)}
.kick{position:absolute;left:96px;top:92px;z-index:10;font-family:var(--f-arc);font-stretch:125%;font-weight:700;font-size:15px;letter-spacing:.2em;text-transform:uppercase;color:var(--chispa)}
.title{position:absolute;left:96px;top:140px;z-index:10;font-family:var(--f-arc);font-stretch:87%;font-weight:800;font-size:56px;line-height:1.08;text-wrap:balance}
.title-u{position:absolute;left:96px;top:136px;z-index:10;font-family:var(--f-unb);font-weight:900;font-size:64px;line-height:1.04;text-transform:uppercase;text-wrap:balance}
.lede{font-family:var(--f-arc);font-size:28px;line-height:1.4;color:rgba(244,239,234,.86)}
.txt{font-family:var(--f-arc);font-size:22px;line-height:1.4;color:rgba(244,239,234,.86)}
.small{font-family:var(--f-arc);font-size:18px;line-height:1.4;color:var(--acero-cl)}
.src{position:absolute;left:96px;bottom:34px;z-index:10;max-width:1000px;font-family:var(--f-mono);font-size:13px;line-height:1.45;color:var(--acero)}
.hdr{font-family:var(--f-mono);font-size:12px;letter-spacing:.12em;color:var(--acero);text-transform:uppercase}
.red{color:var(--chispa)} .ink{color:var(--negro-r)} .amber{color:var(--ambar)} .soft{color:var(--acero-cl)} .mora{color:var(--mora-glow)}
.num{font-variant-numeric:tabular-nums}
.ghost-w{text-shadow:2px 2px 0 rgba(255,255,255,.3)}
.ghost-r{text-shadow:-2px 2px 0 var(--chispa)}
.dbl{text-shadow:8px 8px 0 var(--tinta)}
.tag-geo{display:inline-block;font-family:var(--f-mono);font-size:13px;letter-spacing:.08em;padding:3px 7px;border:1px solid rgba(244,239,234,.4);border-radius:4px;color:var(--acero-cl);vertical-align:middle}

/* ---------- SAMY band (top) ---------- */
.band{position:absolute;left:0;right:0;top:0;height:36px;z-index:70;background:var(--negro-r);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 96px;
  font-family:var(--f-arc);font-stretch:125%;font-weight:700;font-size:12px;letter-spacing:.2em;text-transform:uppercase;view-transition-name:band}
.band .pg{font-variant-numeric:tabular-nums}
.band i{position:absolute;left:0;bottom:0;height:3px;background:#fff;transition:width .4s}

/* ---------- surfaces ---------- */
.s-pn{background:radial-gradient(40% 60% at 100% 0%,rgba(224,27,31,.10),transparent),var(--noche)}
.s-pr{background:radial-gradient(120% 100% at 30% 35%,#E01B1F,#B31110 60%,#7F0000)}
.s-pr .kick{color:var(--negro-r)}
.s-mora{background:radial-gradient(70% 90% at 30% 50%,rgba(74,43,219,.28),#0F0A2E 58%,#0C0808 100%)}
/* photo full-bleed (S) */
.ph{position:absolute;inset:0;z-index:0;overflow:hidden}
.ph img{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;max-width:none;filter:saturate(.85) contrast(1.05)}
.ph::after{content:"";position:absolute;inset:0;background:#1A0605;opacity:.18;mix-blend-mode:multiply;pointer-events:none}
.ph.blur img{filter:blur(10px) brightness(.38) saturate(.75);transform:scale(1.06)}
.scrim-l{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(12,8,8,.9) 0,rgba(12,8,8,.62) 32%,transparent 58%)}
.scrim-b{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(0deg,rgba(12,8,8,.9) 0,rgba(12,8,8,.5) 32%,transparent 60%)}
.scrim-t{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(12,8,8,.88) 0,rgba(12,8,8,.45) 36%,transparent 62%)}
/* windows (I1) */
.win{position:absolute;overflow:hidden;z-index:2;view-transition-name:ventana}
.win img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;max-width:none;filter:saturate(.85) contrast(1.05)}
.win::after{content:"";position:absolute;inset:0;background:#1A0605;opacity:.16;mix-blend-mode:multiply;pointer-events:none}
.win.vi{left:0;top:36px;width:760px;height:1044px}
.win.vd{left:1114px;top:36px;width:806px;height:1044px}
.win.va{left:0;top:36px;width:1920px;height:364px}
.rule-vi{position:absolute;left:757px;top:36px;width:6px;height:1044px;background:var(--tinta);z-index:21}
.rule-vd{position:absolute;left:1111px;top:36px;width:6px;height:1044px;background:var(--tinta);z-index:21}
.rule-va{position:absolute;left:0;top:397px;width:1920px;height:6px;background:var(--tinta);z-index:21}
.cap-win{position:absolute;z-index:22;font-family:var(--f-mono);font-size:13px;color:rgba(255,255,255,.78);letter-spacing:.04em}

/* ---------- ink components ---------- */
.ribbon{position:absolute;z-index:4;overflow:hidden;display:flex;align-items:center;white-space:nowrap;box-shadow:0 12px 28px rgba(0,0,0,.35)}
.ribbon .tr{display:flex;flex:none;animation:marq 30s linear infinite}
.ribbon .tr span{flex:none;padding-right:.6em}
.ribbon.rev .tr{animation-direction:reverse;animation-duration:42s}
.ribbon.red{background:var(--tinta);color:#fff}
.ribbon.white{background:#fff;color:var(--tinta)}
@keyframes marq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.calm .ribbon .tr{animation:none}
/* connector stacked phrase ribbons */
.phrase{position:absolute;left:96px;z-index:12;display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.phrase span{display:inline-block;padding:14px 26px 16px;font-family:var(--f-arc);font-stretch:62%;font-style:italic;font-weight:900;font-size:84px;line-height:1;text-transform:uppercase;transform:rotate(-2deg);box-shadow:7px 7px 0 rgba(12,8,8,.6),0 12px 28px rgba(0,0,0,.45)}
.phrase span.r{background:var(--tinta);color:#fff}
.phrase span.w{background:#fff;color:var(--tinta)}
.is-active.fresh .phrase span{animation:a-strip .32s cubic-bezier(.2,1.6,.4,1) both}
.is-active.fresh .phrase span:nth-child(2){animation-delay:.14s}
.is-active.fresh .phrase span:nth-child(3){animation-delay:.28s}
@keyframes a-strip{from{transform:translateX(-110%) rotate(-2deg)}to{transform:rotate(-2deg)}}
/* bridge ribbon (puente) at the foot of I1 slides */
.puente{position:absolute;left:1100px;right:0;top:978px;height:56px;z-index:60;background:var(--tinta);display:flex;align-items:center;padding-left:26px;
  font-family:var(--f-arc);font-stretch:62%;font-style:italic;font-weight:900;font-size:28px;text-transform:uppercase;color:#fff;box-shadow:0 10px 24px rgba(0,0,0,.4)}
.puente.w{background:#fff;color:var(--tinta)}
.is-active.fresh .puente{animation:a-pin .45s 1.1s cubic-bezier(.16,1,.3,1) both}
@keyframes a-pin{from{transform:translateX(100%)}to{transform:none}}
/* stickers */
.stk{position:absolute;z-index:40;font-family:var(--f-arc);font-stretch:62%;font-style:italic;font-weight:900;text-transform:uppercase;line-height:1;white-space:nowrap;padding:8px 22px 10px;border-radius:10px}
.s1{background:var(--tinta);color:#fff;border:4px solid #fff;box-shadow:7px 7px 0 var(--tinta-sombra),0 12px 28px rgba(0,0,0,.45)}
.s2{background:#fff;color:var(--negro-r);border:4px solid #fff;box-shadow:7px 7px 0 var(--tinta),0 12px 28px rgba(0,0,0,.45)}
.s3{background:var(--negro-r);color:#fff;border:4px solid #fff;box-shadow:7px 7px 0 var(--tinta-sombra)}
.pill-r{display:inline-flex;align-items:center;height:34px;padding:0 14px;border-radius:999px;background:var(--tinta);color:#fff;font-family:var(--f-arc);font-stretch:125%;font-weight:700;font-size:13px;letter-spacing:.16em;text-transform:uppercase;white-space:nowrap}
.pill-o{display:inline-flex;align-items:center;height:30px;padding:0 12px;border-radius:999px;border:1.5px solid rgba(244,239,234,.45);color:var(--hueso);font-family:var(--f-arc);font-stretch:125%;font-weight:700;font-size:11px;letter-spacing:.16em;text-transform:uppercase;white-space:nowrap}
/* flat bolt */
.bolt-flat{position:absolute;z-index:15;overflow:visible;pointer-events:none}
.bolt-flat polyline{fill:none;stroke:#fff;stroke-width:8;stroke-linejoin:miter;stroke-miterlimit:8}

/* ---------- cans ---------- */
.lata{position:absolute;z-index:20}
.lata img{height:100%;width:auto;display:block;max-width:none}
.clean img{clip-path:polygon(29% .6%,69% .6%,76.5% 1.1%,77.3% 5%,79.1% 7%,80.9% 9%,82.6% 11%,83.1% 13%,83% 92%,80.7% 94%,75.6% 96%,73% 97.5%,68.9% 98.5%,62.8% 99.2%,36% 99.2%,29.2% 98.5%,24.7% 97.5%,21.9% 96%,17% 94%,15% 92%,14.8% 13%,15.2% 11%,17% 9%,18.8% 7%,20.5% 5%,21.6% 3%,21.9% 1.1%)}
.sello{filter:drop-shadow(6px 0 0 #fff) drop-shadow(-6px 0 0 #fff) drop-shadow(0 6px 0 #fff) drop-shadow(0 -6px 0 #fff) drop-shadow(16px 16px 0 rgba(12,8,8,.85))}
.objeto{filter:contrast(.96) brightness(.94)}
.cshadow{position:absolute;z-index:19;border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.92),rgba(0,0,0,.4) 55%,transparent)}
.refl{opacity:.14;filter:blur(2px);transform:scaleY(-1);transform-origin:50% 0;-webkit-mask:linear-gradient(0deg,#000 0,transparent 60px);mask:linear-gradient(0deg,#000 0,transparent 60px);z-index:18}

/* ---------- KPI / data ---------- */
.kpi{display:flex;flex-direction:column;gap:12px;border-top:2px solid var(--tinta);padding-top:18px}
.kpi .n{font-family:var(--f-unb);font-weight:900;font-size:96px;line-height:.95;letter-spacing:-.02em;font-variant-numeric:tabular-nums;white-space:nowrap}
.kpi .n.l{font-size:120px}.kpi .n.s{font-size:72px}
.kpi .u{color:var(--chispa)}
.kpi .lab{font-family:var(--f-arc);font-size:22px;line-height:1.35;color:rgba(244,239,234,.85);max-width:none}
.s-pr .kpi{border-top-color:var(--negro-r)}
.s-pr .kpi .u{color:var(--negro-r)}
.card{background:#16100F;border:1px solid rgba(244,239,234,.12);border-radius:14px;padding:26px;display:flex;flex-direction:column;gap:10px}
.card-r{background:rgba(12,8,8,.85);border-radius:14px;padding:26px;display:flex;flex-direction:column;gap:10px;box-shadow:0 12px 28px rgba(0,0,0,.35)}
.glass{background:rgba(12,8,8,.5);-webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);border:1px solid rgba(244,239,234,.16);border-radius:14px;padding:24px}
/* table */
.tbl{width:100%;border-collapse:collapse;font-family:var(--f-arc);font-size:21px;line-height:1.3}
.tbl th{font-family:var(--f-mono);font-size:12px;font-weight:400;letter-spacing:.12em;text-transform:uppercase;text-align:left;color:var(--acero);padding:0 14px 12px;border-bottom:1px solid rgba(244,239,234,.3)}
.tbl td{padding:13px 14px;border-bottom:1px solid rgba(244,239,234,.1);vertical-align:middle}
.tbl td.k{font-family:var(--f-arc);font-stretch:87%;font-weight:700;font-size:23px}
.tbl td.n,.tbl th.n{text-align:right;font-family:var(--f-mono);font-variant-numeric:tabular-nums;white-space:nowrap}
.tbl tr.me td{background:rgba(224,27,31,.16)}
.tbl tr.me td:first-child{box-shadow:inset 4px 0 0 var(--tinta)}
/* bars */
.brow{display:grid;align-items:center;gap:20px}
.bar{height:18px;border-radius:2px;background:var(--acero);transform-origin:left center}
.bar.me{background:var(--tinta);height:22px}
.bar.light{background:rgba(244,239,234,.22)}
/* perfiles 3:4 cards */
.pcard{position:absolute;border-radius:14px;overflow:hidden;border:1px solid rgba(244,239,234,.14);background:#140c0b}
.pcard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.85) contrast(1.05)}
.pcard::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(12,8,8,.95) 0,rgba(12,8,8,.5) 38%,transparent 62%)}
.pcard .cap{position:absolute;left:18px;right:18px;bottom:18px;z-index:2;display:flex;flex-direction:column;gap:8px}
.pcard .cap .nm{font-family:var(--f-arc);font-stretch:62%;font-style:italic;font-weight:900;font-size:34px;line-height:.98;text-transform:uppercase}
.pcard .cap .d{font-family:var(--f-mono);font-size:13px;color:var(--acero-cl)}
/* mosaic tiles */
.tile{position:absolute;overflow:hidden;border-radius:12px;background:#140c0b;box-shadow:0 12px 28px rgba(0,0,0,.35)}
.tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.85) contrast(1.05)}
.tile::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(12,8,8,.94) 0,rgba(12,8,8,.45) 46%,transparent 70%)}
.tile .t{position:absolute;left:16px;right:16px;bottom:14px;z-index:2;display:flex;flex-direction:column;gap:6px}
.tile .t .k{font-family:var(--f-arc);font-stretch:125%;font-weight:700;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--chispa)}
.tile .t .n{font-family:var(--f-unb);font-weight:900;font-size:40px;line-height:1}
.tile .t .l{font-family:var(--f-arc);font-size:16px;line-height:1.3;color:rgba(244,239,234,.9)}
.tile .t .s{font-family:var(--f-mono);font-size:13px;color:var(--acero)}

/* ---------- timecard ---------- */
.timecard{position:absolute;border:2px solid rgba(244,239,234,.6);border-radius:8px;background:rgba(12,8,8,.88);display:flex;flex-direction:column;z-index:10}
.timecard .tc-h{display:flex;justify-content:space-between;font-family:var(--f-arc);font-stretch:125%;font-weight:700;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--acero-cl);padding:12px 20px;border-bottom:2px solid rgba(244,239,234,.6)}
.timecard .punches{display:grid}
.timecard .punch{padding:16px 18px;display:flex;flex-direction:column;gap:8px;border-top:1px dashed rgba(244,239,234,.3)}
.timecard .punch:first-child{border-top:none}
.timecard .stamp{font-family:var(--f-unb);font-weight:800;font-size:30px;color:var(--chispa);line-height:1}
.timecard .punch.night{background:var(--tinta)}
.timecard .punch.night .stamp{color:#fff}

/* ---------- mockups ---------- */
.mock{position:absolute;z-index:6;transform-origin:0 0;overflow:hidden}
.mock img{display:block;width:100%;height:100%;object-fit:cover;max-width:none}
.mock.screen{mix-blend-mode:screen;filter:blur(.4px) saturate(1.05)}
.mock.screen::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(255,255,255,.03) 0 2px,transparent 2px 4px);pointer-events:none}
.mock.print{mix-blend-mode:multiply}
.mock-cap{position:absolute;z-index:30;font-family:var(--f-mono);font-size:13px;color:rgba(244,239,234,.8)}
/* app mockup (generic UIs, no third-party logos) */
.appm{position:absolute;z-index:30;width:280px;height:576px;border-radius:44px;padding:10px;background:linear-gradient(145deg,#2b2b2e,#0d0d0f 40%,#1c1c1f);
  box-shadow:0 0 0 2px #3a3a3e,0 0 0 5px #111,0 30px 60px rgba(0,0,0,.6)}
.appm .scr{position:relative;width:100%;height:100%;border-radius:35px;overflow:hidden;background:#101010;color:#fff;font-family:-apple-system,'SF Pro Text','Helvetica Neue',Arial,sans-serif}
.appm .scr::before{content:"";position:absolute;left:50%;top:10px;width:84px;height:24px;margin-left:-42px;border-radius:14px;background:#000;z-index:5}
.app-cap{position:absolute;z-index:31;font-family:var(--f-mono);font-size:12px;color:rgba(244,239,234,.75);text-align:center}

/* ---------- divider number ---------- */
.div-num{position:absolute;z-index:3;font-family:var(--f-unb);font-weight:900;font-size:520px;line-height:.8;color:transparent;-webkit-text-stroke:3px rgba(255,255,255,.6);pointer-events:none}
.dir-tag{display:none}