/* Menos freno, más cambio · bandadahc.com/menos-freno/
   Landing del webinar del jueves 10 de diciembre de 2026, 12:00.
   Marca de octubre 2026: colores y letra de marca-2026-10.css.
   Esquinas rectas en todo, sin sombras. Se agrupa con filetes y espacio. */

*,*::before,*::after{box-sizing:border-box;border-radius:0}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bm-fondo);color:var(--bm-tinta);font-family:var(--bm-letra);
  font-size:18px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3,p,ul,dl,dd{margin:0;padding:0}
ul{list-style:none}
img{display:block;max-width:100%}
a{color:var(--bm-turquesa-hondo)}
:focus-visible{outline:3px solid var(--bm-turquesa-hondo);outline-offset:3px}

.caja{max-width:var(--bm-contenedor);margin:0 auto;padding-left:var(--bm-margen);padding-right:var(--bm-margen)}

/* ---------- barra ---------- */
.barra{border-bottom:1px solid var(--bm-filete)}
.barra .caja{display:flex;align-items:center;padding-top:22px;padding-bottom:22px}
.barra__logo{display:block;line-height:0}
.barra__logo img{height:28px;width:auto}
.bajada{margin-top:26px;font-size:clamp(19px,.5vw + 15px,24px);line-height:1.45;color:var(--bm-gris)}
.boton{margin-top:clamp(30px,3vw,44px);font-size:18px;padding:21px 40px}

/* ---------- webinar: una sola pantalla, el mensaje sobre el video de la bandada ---------- */
.escena{position:relative;isolation:isolate;display:flex;flex-direction:column;min-height:100vh;min-height:100svh;
  overflow:hidden;background:var(--bm-tinta);color:var(--bm-fondo)}
.escena__video{position:absolute;top:0;left:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:70% 50%}
/* Oscurece el lado del texto y deja a la vista el cielo y las aves. */
.escena::before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;z-index:-1;
  background:linear-gradient(90deg,rgba(21,23,26,.9) 0%,rgba(21,23,26,.78) 38%,rgba(21,23,26,.08) 72%)}
.escena .barra{border-bottom:0}
.portada{flex:1;display:flex;align-items:center;width:100%;padding-top:clamp(24px,3vw,56px);padding-bottom:clamp(40px,5vw,88px)}
.portada__texto{width:min(100%,780px)}
.portada h1{font-weight:800;font-size:clamp(46px,5vw + 16px,118px);line-height:1;letter-spacing:-.04em}
.escena .bajada{color:rgba(251,250,247,.88)}
.cuando{display:flex;flex-wrap:wrap;gap:20px clamp(32px,4vw,72px);
  margin-top:clamp(30px,3vw,46px);padding-top:clamp(22px,2vw,30px);border-top:1px solid rgba(251,250,247,.26)}
.cuando dd{font-weight:800;font-size:clamp(20px,.6vw + 15px,26px);line-height:1.2;letter-spacing:-.02em;margin-top:4px}
.escena .bm-rotulo{color:var(--bm-turquesa)}
.escena .bm-boton--acento:hover{background:var(--bm-fondo);color:var(--bm-tinta);border-color:var(--bm-fondo)}
.escena .pie{border-top:1px solid rgba(251,250,247,.22)}
.escena .pie__fila{color:rgba(251,250,247,.86)}
.escena .pie a{color:inherit}
.escena .pie a:hover{color:var(--bm-turquesa)}

/* ---------- filas: las usa la guía ---------- */
.filas{margin-top:clamp(28px,3vw,48px);border-top:1px solid var(--bm-filete)}
.filas li{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.4fr);gap:8px clamp(24px,4vw,72px);
  padding:clamp(20px,2vw,30px) 0;border-bottom:1px solid var(--bm-filete)}
.filas h3{font-weight:800;font-size:clamp(21px,.6vw + 16px,28px);line-height:1.2;letter-spacing:-.02em}
.filas p{font-size:clamp(18px,.3vw + 15px,21px);line-height:1.5}

/* ---------- pie ---------- */
.pie{border-top:1px solid var(--bm-filete)}
.pie__fila{display:flex;flex-wrap:wrap;gap:8px 32px;padding-top:28px;padding-bottom:28px;font-size:16px;color:var(--bm-gris)}
.pie a{color:var(--bm-gris);text-decoration:none}
.pie a:hover{color:var(--bm-turquesa-hondo);text-decoration:underline}

/* ---------- cookies ---------- */
.cookies{position:fixed;left:0;right:0;bottom:0;z-index:50;background:var(--bm-tinta);color:var(--bm-fondo)}
.cookies[hidden]{display:none}
.cookies__fila{display:flex;align-items:center;gap:16px 28px;flex-wrap:wrap;padding-top:18px;padding-bottom:18px}
.cookies p{flex:1 1 420px;font-size:16px;line-height:1.5}
.cookies a{color:var(--bm-turquesa);font-weight:600}
.cookies__acciones{display:flex;gap:10px;flex-shrink:0}
.cookies__boton{font-family:var(--bm-letra);font-weight:700;font-size:16px;line-height:1;padding:14px 20px;cursor:pointer;
  background:transparent;color:var(--bm-fondo);border:2px solid rgba(251,250,247,.55)}
.cookies__boton:hover{border-color:var(--bm-fondo)}
.cookies__boton--si{background:var(--bm-turquesa);color:var(--bm-tinta);border-color:var(--bm-turquesa)}
.cookies__boton--si:hover{background:var(--bm-fondo);border-color:var(--bm-fondo)}
.tiene-cookies .pie{padding-bottom:120px}

/* ---------- pantallas medianas y celular ---------- */
@media (max-width:960px){
  /* En vertical, el cielo arriba y el mensaje abajo, sobre el fondo oscuro. */
  .escena__video{height:56vh;height:56svh}
  .escena::before{bottom:auto;height:56vh;height:56svh;
    background:linear-gradient(180deg,rgba(21,23,26,.3) 0%,rgba(21,23,26,.05) 34%,var(--bm-tinta) 100%)}
  .portada{align-items:flex-end;padding-top:32vh;padding-top:32svh}
  .filas li{grid-template-columns:1fr}
}
@media (max-width:560px){
  .barra .caja{padding-top:16px;padding-bottom:16px}
  .barra__logo img{height:24px}
  .boton{display:block;width:100%;text-align:center}
  .pie__fila{flex-direction:column;gap:6px}
  .cookies__acciones{width:100%}
  .cookies__boton{flex:1}
  .tiene-cookies .pie{padding-bottom:190px}
}