/* Banners animados · movimiento tipográfico y geométrico, sin brillos ni degradados.
   Un solo acento naranja por banner. Con «reducir movimiento» quedan estáticos. */
.bn{position:relative;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);min-height:280px;background:var(--card);border:1px solid var(--line);border-radius:18px;overflow:hidden;isolation:isolate}
.bn-text{position:relative;z-index:2;padding:clamp(22px,4vw,44px);display:flex;flex-direction:column;justify-content:center;gap:12px}
.bn-kicker{text-transform:uppercase;letter-spacing:.16em;font-size:11px;font-weight:800;color:var(--muted);display:flex;align-items:center;gap:8px}
.bn-kicker::before{content:"";width:18px;height:2px;background:var(--accent)}
.bn-title{font-size:clamp(26px,3.6vw,44px);line-height:1.02;letter-spacing:-.04em;font-weight:800;margin:0;text-wrap:balance}
.bn-body{color:var(--muted);max-width:46ch;margin:0;font-size:15px}
.bn-cta{align-self:flex-start;margin-top:6px}
.bn-art{position:relative;min-height:220px;border-left:1px solid var(--line)}
.bn-art svg{position:absolute;inset:0;width:100%;height:100%}
.bn.full{grid-template-columns:1fr}
.bn.full .bn-art{position:absolute;inset:0;border:0;z-index:0}
@media (max-width:760px){.bn{grid-template-columns:1fr}.bn-art{border-left:0;border-top:1px solid var(--line);min-height:180px}}

/* 1 · Líneas de construcción */
.bn-lineas .ln{fill:none;stroke:var(--ink);stroke-width:1.2;stroke-dasharray:var(--len);stroke-dashoffset:var(--len);animation:bn-draw 1.6s cubic-bezier(.6,.05,.25,1) forwards;animation-delay:var(--d)}
.bn-lineas .ln.thin{stroke:var(--line);stroke-width:1}
.bn-lineas .mark{fill:var(--accent);opacity:0;animation:bn-fade .4s ease forwards;animation-delay:2.3s}
.bn-lineas .lbl{font:600 9px var(--font);letter-spacing:.12em;fill:var(--muted);opacity:0;animation:bn-fade .5s ease forwards;animation-delay:var(--d)}
@keyframes bn-draw{to{stroke-dashoffset:0}}
@keyframes bn-fade{to{opacity:1}}

/* 2 · Retícula */
.bn-reticula .cells{position:absolute;inset:18px;display:grid;grid-template-columns:repeat(var(--cols),1fr);grid-template-rows:repeat(var(--rows),1fr);gap:4px}
.bn-reticula .cell{border:1px solid var(--line);border-radius:2px;opacity:0;animation:bn-cell .5s ease forwards;animation-delay:calc(var(--i) * 28ms)}
.bn-reticula .cell.f{background:var(--ink);border-color:var(--ink)}
.bn-reticula .cell.a{background:var(--accent);border-color:var(--accent);transition:background .5s,border-color .5s}
@keyframes bn-cell{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}

/* 3 · Tipos (palabra que rota) */
.bn-tipos .stage{position:absolute;inset:0;display:grid;place-items:center;padding:20px}
.bn-tipos .word-box{position:relative;height:1.1em;overflow:hidden;font-size:1em;font-weight:800;letter-spacing:-.05em;line-height:1.05;text-align:center}
.bn-tipos .sizer{visibility:hidden;display:block;white-space:nowrap}
.bn-tipos .word{position:absolute;left:0;right:0;top:0;white-space:nowrap;transform:translateY(105%);opacity:0;transition:transform .7s cubic-bezier(.7,0,.2,1),opacity .35s ease}
.bn-tipos .word.in{transform:translateY(0);opacity:1;transition-delay:.12s}
.bn-tipos .word.out{transform:translateY(-105%)}
.bn-tipos .wrapw{display:flex;flex-direction:column;align-items:center;font-size:clamp(40px,7vw,86px)}
.bn-tipos .rule{display:block;height:3px;width:0;background:var(--accent);margin-top:.14em;transition:width .9s cubic-bezier(.2,.7,.2,1) .25s}
.bn-tipos .rule.on{width:1.6em}

/* 4 · Marquesina */
.bn-marquesina .rows{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;gap:2px;overflow:hidden;opacity:.9}
.bn-marquesina .track{display:flex;width:max-content;gap:.5em;font-size:clamp(44px,7vw,96px);font-weight:800;letter-spacing:-.04em;line-height:1;white-space:nowrap;color:transparent;-webkit-text-stroke:1px var(--line);animation:bn-marq var(--dur,60s) linear infinite}
.bn-marquesina .track.rev{animation-direction:reverse}
.bn-marquesina .track span.a{-webkit-text-stroke:1px var(--accent)}
@keyframes bn-marq{to{transform:translateX(-50%)}}
.bn.full.bn-marquesina .bn-text{background:linear-gradient(90deg,var(--card) 45%,transparent)}

/* 5 · Contador */
.bn-contador .nums{position:absolute;inset:0;display:grid;grid-template-columns:1fr;align-content:center;padding:20px clamp(18px,3vw,34px);gap:4px}
.bn-contador .num{display:grid;grid-template-columns:3.4ch 1fr;align-items:baseline;gap:.4em;font-size:clamp(30px,3.8vw,50px);border-top:1px solid var(--line);padding:10px 0 6px;opacity:0;animation:rise .6s ease forwards;animation-delay:calc(var(--i) * 140ms)}
.bn-contador .num b{font-size:1em;letter-spacing:-.05em;line-height:1;font-variant-numeric:tabular-nums;white-space:nowrap}
.bn-contador .num:first-child{border-top:2px solid var(--accent)}
.bn-contador .num span{font-size:14px;color:var(--muted)}
@media (max-width:760px){.bn-contador .nums{position:relative}}

/* Carrusel */
.bn-carousel{position:relative}
.bn-carousel .slide{display:none}
.bn-carousel .slide.on{display:block;animation:bn-fade .5s ease both}
.bn-dots{display:flex;gap:6px;margin-top:10px;justify-content:flex-end}
.bn-dots button{width:22px;height:4px;border-radius:2px;border:0;background:var(--line);cursor:pointer;padding:0}
.bn-dots button[aria-current=true]{background:var(--ink)}

@media (prefers-reduced-motion:reduce){
  .bn-lineas .ln{stroke-dashoffset:0}.bn-lineas .mark,.bn-lineas .lbl{opacity:1}
  .bn-reticula .cell,.bn-contador .num{opacity:1;transform:none}
  .bn-marquesina .track{animation:none}
}