/* Página /eventos — complementa styles.css; solo componentes nuevos */
.tipos{border-top:1px solid #2A2C3C}
.tp-list{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--line)}
.tp{padding:1.6rem 1.4rem 1.8rem 0;border-bottom:1px solid var(--line)}
.tp:nth-child(odd){border-right:1px solid var(--line)}
.tp:nth-child(even){padding-left:1.6rem}
.tp .n{color:var(--acc);display:block;margin-bottom:.8rem}
.tp h3{font-size:clamp(1.25rem,2vw,1.6rem);font-weight:700;letter-spacing:-.015em;line-height:1.2;margin-bottom:.6rem}
.tp p{color:var(--mut);max-width:38ch}
.cs-list{list-style:none;display:grid;gap:clamp(2rem,4vw,3.2rem)}
.cs{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:1.6rem 2.4rem;align-items:center}
.cs:nth-child(even){grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}
.cs:nth-child(even) figure{order:2}
.cs figure{border-radius:var(--r);overflow:hidden;border:1px solid var(--line);background:var(--surf);line-height:0}
.cs img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover}
.cs-t .mono{color:var(--acc);margin-bottom:.6rem}
.cs-t h3{font-size:clamp(1.5rem,2.6vw,2.2rem);font-weight:800;letter-spacing:-.025em;line-height:1.1;margin-bottom:.5rem}
.cs-t .rol{font-weight:500;color:var(--fg);margin-bottom:.7rem}
.cs-t p:not(.mono):not(.rol){color:var(--mut)}
.casos .note{margin-top:2.4rem}
.lnk{color:var(--acc);text-decoration:none;font-weight:500;border-bottom:1px solid currentColor;padding-bottom:2px}
.lnk:hover{opacity:.8}
.st-list{list-style:none;border-top:1px solid var(--line)}
.st{display:grid;grid-template-columns:3.2rem minmax(0,1fr);gap:1rem;padding:1.5rem 0;border-bottom:1px solid var(--line)}
.st .n{color:var(--acc);font-size:1rem;font-weight:500;padding-top:.3rem}
.st h3{font-size:clamp(1.25rem,2vw,1.6rem);font-weight:700;letter-spacing:-.015em;margin-bottom:.5rem}
.st p{color:var(--mut);max-width:60ch}
.st .tag{margin-top:.8rem;color:var(--acc)}
.proc .psub{color:var(--acc);margin-bottom:1rem}
.need{margin-top:2rem;color:var(--fg)}
@media (max-width:820px){
  .tp-list{grid-template-columns:minmax(0,1fr)}
  .tp:nth-child(odd){border-right:0}
  .tp:nth-child(even){padding-left:0}
  .cs,.cs:nth-child(even){grid-template-columns:minmax(0,1fr)}
  .cs:nth-child(even) figure{order:0}
}

/* Hero con video de fondo */
.hero-vid{position:absolute;inset:0;overflow:hidden;background:#000}
.hero-vid img,.hero-vid video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-vid video{opacity:0;transition:opacity .8s}
.hero-vid video.ready{opacity:1}
.hero::after{background:linear-gradient(90deg,rgba(0,0,0,.78) 0%,rgba(0,0,0,.45) 50%,rgba(0,0,0,.15) 100%),linear-gradient(0deg,rgba(0,0,0,.75) 0%,rgba(0,0,0,0) 30%)}
.tipos{border-top:0}

/* Proceso: línea de tiempo con tarjetas */
.proc{overflow:hidden}
.proc-h{margin-bottom:clamp(2.2rem,5vw,3.6rem)}
.proc-h .idx{margin-bottom:1.4rem}
.proc-h .h2{margin-bottom:1.2rem;max-width:16ch}
.pc-list{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.1rem;counter-reset:pc;position:relative}
.pc-list::before{content:"";position:absolute;left:0;right:0;top:3.1rem;height:3px;background:var(--grad);border-radius:3px;opacity:.9}
.pc{position:relative;background:#0B0C12;color:#F3F4FF;border-radius:var(--r);padding:5.2rem 1.5rem 1.7rem;overflow:hidden;transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.pc::before{content:"";position:absolute;inset:0;background:radial-gradient(120% 70% at 0% 0%,rgba(129,98,170,.35),transparent 60%),radial-gradient(90% 60% at 100% 100%,rgba(64,186,235,.22),transparent 65%);pointer-events:none}
.pc:hover{transform:translateY(-6px);box-shadow:0 22px 50px -24px rgba(11,12,18,.7)}
.pc-n{position:absolute;left:1.5rem;top:1.3rem;width:3.6rem;height:3.6rem;border-radius:50%;display:grid;place-items:center;background:#000;color:#66FFCC;border:3px solid transparent;background-clip:padding-box;font-family:var(--mono);font-size:1.05rem;letter-spacing:.04em;z-index:2;box-shadow:0 0 0 3px #66FFCC66}
.pc-b{position:relative;z-index:1}
.pc h3{font-size:clamp(1.25rem,1.8vw,1.55rem);font-weight:800;letter-spacing:-.02em;line-height:1.15;margin-bottom:.7rem}
.pc p{color:#C2C8DA;font-size:.98rem;line-height:1.55}
.pc .tag{margin-top:1.1rem;color:#66FFCC;font-size:.7rem;line-height:1.5}
.need{margin-top:clamp(2rem,4vw,3rem);display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.6rem;padding:1.4rem 1.6rem;border:1px solid var(--line);border-radius:var(--r);background:var(--surf)}
.need>.mono{color:var(--acc)}
.need ul{list-style:none;display:flex;flex-wrap:wrap;gap:.5rem;margin-right:auto}
.need li{padding:.4rem .95rem;border:1px solid var(--line);border-radius:999px;font-weight:500;font-size:.98rem}
@media (max-width:1020px){
  .pc-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pc-list::before{display:none}
}
@media (max-width:640px){
  .pc-list{grid-template-columns:minmax(0,1fr);padding-left:1.6rem}
  .pc-list::before{display:block;left:1.7rem;right:auto;top:1.8rem;bottom:1.8rem;width:3px;height:auto;background:linear-gradient(180deg,#8162AA,#40BAEB,#66FFCC)}
  .pc{padding:1.4rem 1.3rem 1.5rem 3.6rem;margin-left:.4rem}
  .pc-n{left:-1.7rem;top:1rem;width:3rem;height:3rem;font-size:.9rem}
}
@media (prefers-reduced-motion:reduce){.pc,.pc:hover{transition:none;transform:none}}
/* El material de Lexus trae barras negras arriba y abajo: se amplía para llenar el hero */
.hero-vid img,.hero-vid video{transform:scale(1.34)}