/* Home de a:escala (basada en la prueba F). Independiente de las hojas de las pruebas. */

/* ---- desde estilos-b.css ---- */
/* Propuesta B de home — solo afecta a index-b.html */
.home-b .hero{display:grid;grid-template-columns:1fr 1.25fr;gap:56px;align-items:center;padding:86px 22px 96px}
.home-b .hero .mes{color:var(--rojo)}
.home-b .hero h1{font-weight:300;font-size:clamp(40px,5vw,66px);line-height:1.02;letter-spacing:-.02em;margin:18px 0 22px}
.home-b .hero h1 b{font-weight:700}
.home-b .hero .gancho{font-size:18px;font-weight:300;line-height:1.5;margin:0 0 32px;color:#333;max-width:34em}
.home-b .hero-video{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:var(--fill)}
.home-b .hero-video img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.home-b .hero-video:hover img{transform:scale(1.02)}
.home-b .hero-video .play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.home-b .hero-video .play i{width:84px;height:84px;border-radius:50%;background:rgba(255,255,255,.93);
  display:flex;align-items:center;justify-content:center;transition:transform .2s}
.home-b .hero-video .play i::after{content:"";margin-left:5px;border-style:solid;border-width:12px 0 12px 19px;
  border-color:transparent transparent transparent var(--rojo)}
.home-b .hero-video:hover .play i{transform:scale(1.07)}

/* índice */
.home-b .indice{padding:0 22px 96px}
.home-b .indice ol{list-style:none;margin:24px 0 0;padding:0;border-top:1px solid var(--ink)}
.home-b .indice li{border-bottom:1px solid var(--line)}
.home-b .indice li > a,.home-b .indice li > .fila{display:grid;grid-template-columns:64px minmax(0,1fr) 260px 90px;
  gap:24px;align-items:baseline;padding:22px 0;text-decoration:none;color:inherit}
.home-b .indice .n{font-family:var(--mono);font-size:12px;color:var(--mut)}
.home-b .indice .t{font-size:clamp(20px,2.2vw,28px);font-weight:300;letter-spacing:-.01em}
.home-b .indice .t b{font-weight:700;margin-right:.35em}
.home-b .indice .q{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--mut)}
.home-b .indice .e{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;text-align:right}
.home-b .indice a:hover{background:rgba(216,38,28,.05)}
.home-b .indice a:hover .e{color:var(--rojo)}
.home-b .indice a .e::after{content:" →"}
.home-b .indice .espera .t,.home-b .indice .espera .q,.home-b .indice .espera .e{color:#a8a8a8}
.home-b .indice .espera .t b{color:#7d7d7d}
.home-b .nota-indice{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--mut);margin:20px 0 0}

/* cierre */
.home-b .cierre{border-top:1px solid var(--line);padding:72px 22px 96px;text-align:center}
.home-b .cierre .firma{width:min(220px,54vw);margin:0 auto 26px}
.home-b .cierre p{max-width:640px;margin:0 auto 26px;font-size:19px;font-weight:300;line-height:1.55;color:#333}

@media (max-width:900px){
  .home-b .hero{grid-template-columns:1fr;gap:32px;padding:56px 22px 64px}
  .home-b .indice li > a,.home-b .indice li > .fila{grid-template-columns:44px 1fr 80px;gap:14px}
  .home-b .indice .q{display:none}
}

/* ---- desde estilos-e.css ---- */
/* Propuesta E — presentación chica + banner rectángulo al ancho del sitio */
.home-e .presenta{text-align:center;padding-top:56px;padding-bottom:44px}
.home-e .escala{position:relative;height:30px;margin-bottom:44px}
.home-e .escala .marcas{height:14px;
  background:
    repeating-linear-gradient(90deg,#cfcfcf 0 1px,transparent 1px 12px) top/100% 7px no-repeat,
    repeating-linear-gradient(90deg,#a3a3a3 0 1px,transparent 1px 60px) top/100% 14px no-repeat}
.home-e .escala .aguja{position:absolute;top:0;transform:translateX(-50%)}
.home-e .escala .aguja span{display:block;width:2px;height:24px;background:var(--rojo)}
.home-e .presenta .logo{width:min(230px,56vw);margin:0 auto 12px}
.home-e .presenta .bajada{margin:0;font-family:var(--mono);font-size:11px;letter-spacing:.32em;
  text-transform:uppercase;padding-left:.32em}

/* banner rectángulo */
.home-e .rect{position:relative;display:block;aspect-ratio:21/9;overflow:hidden;background:#111;
  color:#fff;text-decoration:none}
.home-e .rect img{width:100%;height:100%;object-fit:cover;object-position:center 15%;transition:transform .6s ease}
.home-e .rect:hover img{transform:scale(1.02)}
.home-e .rect .velo{position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(0,0,0,.74) 0%,rgba(0,0,0,.52) 44%,rgba(0,0,0,0) 80%)}
.home-e .rect .datos{position:absolute;left:48px;bottom:44px;right:40%;display:block}
.home-e .rect .label{display:block;color:rgba(255,255,255,.72);margin-bottom:14px}
.home-e .rect .del-mes{display:inline-block;background:var(--rojo);color:#fff;padding:7px 10px 6px 12px}
.home-e .rect .tit{display:block;font-size:clamp(30px,3.8vw,50px);font-weight:300;line-height:1.04;letter-spacing:-.02em}
.home-e .rect .tit b{font-weight:700;display:block}
.home-e .rect .gan{display:block;margin:16px 0 24px;font-size:16px;font-weight:300;line-height:1.5;color:rgba(255,255,255,.88);max-width:28em}
.home-e .rect .cta{display:inline-block;font-family:var(--mono);font-size:11px;letter-spacing:.28em;text-transform:uppercase;
  border:1px solid rgba(255,255,255,.6);padding:13px 22px;transition:.2s}
.home-e .rect:hover .cta{background:var(--rojo);border-color:var(--rojo)}
.home-e .rect .play{position:absolute;right:9%;top:50%;transform:translateY(-50%)}
.home-e .rect .play i{width:76px;height:76px;border-radius:50%;background:rgba(255,255,255,.93);
  display:flex;align-items:center;justify-content:center;transition:transform .2s}
.home-e .rect .play i::after{content:"";margin-left:5px;border-style:solid;border-width:11px 0 11px 18px;
  border-color:transparent transparent transparent var(--rojo)}
.home-e .rect:hover .play i{transform:scale(1.07)}

.home-e .indice{padding:84px 22px 72px}
.home-e .acerca-e{padding-top:24px;padding-bottom:88px} /* sin línea: la última fila del índice ya separa */
.home-e .acerca-e .label{display:block;margin-bottom:24px}
.home-e .acerca-e .breve p{font-size:21px;font-weight:300;line-height:1.5;margin:0 0 18px;max-width:680px}
.home-e .acerca-e .breve p.remate{font-size:22px;font-weight:700;margin:30px 0 26px}

@media (max-width:900px){
  .home-e .rect{aspect-ratio:auto}
  .home-e .rect img{height:230px}
  .home-e .rect .velo{display:none}
  .home-e .rect .datos{position:static;padding:26px 22px 32px}
  .home-e .rect .play{right:auto;left:50%;top:115px;transform:translate(-50%,-50%)}
  .home-e .rect .play i{width:60px;height:60px}
  .home-e .indice{padding-top:60px}
}

/* ---- desde estilos-f.css ---- */
/* Propuesta F — igual a E, con "hace cosas" subrayado como marcador rojo y link a Acerca de */
.home-f .bajada .subraya{color:inherit;text-decoration:none;
  background:linear-gradient(transparent 58%,rgba(216,38,28,.22) 58%);padding:0 .1em 0 .3em;margin-left:-.2em;
  transition:background-color .2s}
.home-f .bajada .subraya:hover,.home-f .bajada .subraya:focus-visible{background:rgba(216,38,28,.22)}

/* ---- ajustes de la home ---- */
/* "Próximamente" en negro, no en gris */
.home-b .indice .espera .t,.home-b .indice .espera .q,.home-b .indice .espera .e{color:var(--ink)}
.home-b .indice .espera .t b{color:var(--ink)}
.home-b .indice .espera .q{color:var(--mut)}
/* la columna final necesita lugar para "Próximamente" */
.home-b .indice li > a,.home-b .indice li > .fila{grid-template-columns:64px minmax(0,1fr) 260px 140px}
@media (max-width:900px){
  .home-b .indice li > a,.home-b .indice li > .fila{grid-template-columns:40px 1fr auto;gap:14px}
}