/* ===== Hero · propuesta del 14/10/2026: menos botones, la fecha nueva a la vista y sin aviso de scroll =====
   · Un solo botón (Inscríbete ahora / Solicita plazas); el dossier pasa a enlace subrayado a su lado.
   · El vídeo oficial deja la fila: sello redondo con el texto girando, abajo a la derecha del hero.
   · Portada: bajo las fechas, la píldora «Nueva fecha · 2-4 julio», que lleva a la landing de julio.
   · Sin «scroll ↓». style.css no se toca: todo lo nuevo vive aquí. */

/* ---- píldora de la fecha nueva ---- */
.hero__nueva{display:inline-flex;align-items:stretch;margin-top:22px;border-radius:100px;overflow:hidden;color:#fff;
  font-weight:700;font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;line-height:1;
  background:rgba(11,11,13,.55);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.24);box-shadow:0 10px 30px rgba(0,0,0,.35);
  transition:border-color .25s,background-color .25s,transform .3s var(--ease)}
.hero__nueva-tag{display:flex;align-items:center;gap:9px;padding:10px 15px 9px 13px;background:var(--red)}
.hero__nueva-tag::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:#fff;animation:hNuevaPulso 1.8s ease-in-out infinite}
.hero__nueva-txt{display:flex;align-items:center;gap:12px;padding:10px 17px 9px 15px}
.hero__nueva-txt i{font-style:normal;font-size:15px;line-height:.6;transition:transform .3s var(--ease)}
.hero__nueva:hover{border-color:rgba(255,255,255,.6);background:rgba(11,11,13,.78);transform:translateY(-2px)}
.hero__nueva:hover .hero__nueva-txt i{transform:translateX(4px)}
@keyframes hNuevaPulso{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.3;transform:scale(.6)}}

/* ---- un botón + el dossier como enlace ---- */
.hero__acciones{display:flex;align-items:center;justify-content:center;gap:32px;margin-top:30px}
.hero__acciones .btn{padding:16px 36px;font-size:15px;box-shadow:0 14px 34px rgba(227,6,19,.35)}
.hero__dossier{display:inline-flex;align-items:center;gap:10px;padding:7px 0 6px;color:#fff;
  font-weight:700;font-size:13px;letter-spacing:.14em;text-transform:uppercase;line-height:1;
  border-bottom:1.5px solid rgba(255,255,255,.5);text-shadow:0 2px 14px rgba(0,0,0,.5);transition:border-color .25s}
.hero__dossier .ico{width:17px;height:17px;flex:none}
.hero__dossier:hover{border-color:var(--red)}

/* ---- vídeo oficial: sello giratorio en la esquina ---- */
.hero__sello{position:absolute;right:clamp(18px,3.4vw,54px);bottom:clamp(18px,4.2vh,48px);z-index:4;
  width:124px;height:124px;display:grid;place-items:center;color:#fff;transition:opacity .4s var(--ease)}
.intro-on .hero__sello{opacity:0}
.hero__sello-aro{position:absolute;inset:0;width:100%;height:100%;overflow:visible;animation:hSelloGira 18s linear infinite}
/* el texto llena el aro solo con el espaciado (lengthAdjust="spacing"): las letras no se estiran ni se aprietan
   (con "spacingAndGlyphs" se deformaban). Tres repeticiones a 12: el más largo (FR) mide ~255 de los ~300 del aro y el
   más corto (ES) ~210, así que el espaciado extra es poco y parejo; nunca se solapa */
.hero__sello-aro text{font-family:var(--display);font-weight:700;font-size:12px;letter-spacing:0;fill:#fff;
  paint-order:stroke;stroke:rgba(0,0,0,.35);stroke-width:.6px}
.hero__sello-play{position:relative;width:60px;height:60px;border-radius:50%;background:#fff;
  box-shadow:0 12px 32px rgba(0,0,0,.45);transition:transform .3s var(--ease),background-color .3s}
.hero__sello-play::before{content:"";position:absolute;left:50%;top:50%;margin:-9px 0 0 -5px;border-style:solid;
  border-width:9px 0 9px 15px;border-color:transparent transparent transparent var(--red);transition:border-color .3s}
.hero__sello:hover .hero__sello-play{transform:scale(1.08);background:var(--red)}
.hero__sello:hover .hero__sello-play::before{border-left-color:#fff}
.hero__sello:hover .hero__sello-aro{animation-duration:7s}
@keyframes hSelloGira{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){ .hero__sello-aro,.hero__nueva-tag::before{animation:none} }

@media(max-width:600px){
  .hero__nueva{margin-top:18px;font-size:11px;letter-spacing:.13em}
  .hero__nueva-tag{padding:9px 12px 8px 11px;gap:7px}
  .hero__nueva-txt{padding:9px 14px 8px 12px;gap:9px}
  .hero__acciones{flex-direction:column;gap:16px;width:100%;padding:0 9vw;margin-top:24px}
  .hero__acciones .btn{width:100%;text-align:center;padding:16px 26px}
  .hero__sello{width:96px;height:96px;right:12px;bottom:12px}
  .hero__sello-aro text{font-size:12.5px}
  .hero__sello-play{width:46px;height:46px}
  .hero__sello-play::before{margin:-7px 0 0 -4px;border-width:7px 0 7px 12px}
}

/* ---- barra entre 1140 y 1339 px: con el interruptor de fechas a la izquierda, la cápsula de siete secciones no
   cabía (en la portada pisaba «Julio»). Medido en ES/EU/EN/FR: con esto queda ≥ 35 px de aire a cada lado. La landing
   de julio (cinco secciones) lo ajusta a su manera en julio.css, que se carga después. ---- */
@media(min-width:1140px) and (max-width:1339px){
  .nav--solid .fechas a small{display:none}
  .nav--solid .fechas a{padding:9px 11px 8px}
  .nav__menu{margin-left:0}
  .nav__menu a{padding:10px 8px}
  .nav__menu a b{font-size:12px;letter-spacing:.07em}
}