@font-face{font-family:"Anton";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/anton-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/barlow-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/barlow-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/barlow-condensed-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:700;font-display:swap;src:url(fonts/barlow-condensed-latin-700-normal.woff2) format("woff2")}

:root{--rojo:#c8102e;--negro:#171717;--blanco:#fafafa;--cond:"Barlow Condensed",sans-serif;--display:"Anton",Impact,sans-serif;--texto:"Barlow",system-ui,sans-serif}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--negro);color:#fff;font-family:var(--texto);font-size:18px;line-height:1.5}
a{color:inherit}
:focus-visible{outline:3px solid #fff;outline-offset:3px}

/* escena: mitad izquierda con foto y mitad derecha negra, separadas a 10º */
.pronto{position:relative;min-height:100vh;overflow:hidden;background:var(--rojo)}
.fondo-i{position:absolute;top:0;bottom:0;left:0;width:60%;background:url(img/04.jpg) center/cover}
.fondo-i::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(200,16,46,.9),rgba(200,16,46,.6))}
.fondo-k{position:absolute;top:0;bottom:0;left:50%;width:60%;background:radial-gradient(ellipse at 70% 30%,#2a2a2a,var(--negro) 70%);border-left:6px solid #fff;transform:skewX(-10deg)}
.wrap{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;align-items:center;min-height:100vh;width:min(1440px,100% - 64px);margin-inline:auto}

/* izquierda */
.izq{position:relative;padding:100px 40px 60px 0}
.logo{position:absolute;top:28px;left:0;display:flex;align-items:center;gap:10px;text-decoration:none;font-family:var(--display);font-size:1.4rem;letter-spacing:.04em}
.logo img{height:44px;width:auto}
.etiqueta{display:inline-block;border:2px solid #fff;padding:6px 20px;border-radius:99px;font-family:var(--cond);font-weight:700;font-size:1.3rem;letter-spacing:.12em;text-transform:uppercase}
h1{margin-top:22px;font-family:var(--display);font-weight:400;font-size:clamp(3rem,7.4vw,6.8rem);line-height:.9;text-transform:uppercase}
h1 span{display:block;color:var(--negro)}
.lead{margin-top:24px;font-family:var(--cond);font-weight:600;font-size:clamp(1.5rem,2.6vw,2.4rem);line-height:1.15;max-width:18ch}
.puntos{display:flex;gap:12px;margin-top:34px}
.puntos i{width:16px;height:16px;border-radius:50%;background:#fff;animation:pulso 1.4s ease-in-out infinite}
.puntos i:nth-child(2){animation-delay:.2s}
.puntos i:nth-child(3){animation-delay:.4s;background:var(--negro)}
@keyframes pulso{0%,80%,100%{transform:scale(.6);opacity:.55}40%{transform:scale(1);opacity:1}}

/* derecha */
.der{padding:60px 0 60px 110px}
h2{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(2.2rem,4.4vw,3.8rem);line-height:.95}
h2 em{font-style:normal;color:var(--rojo)}
.estado{display:inline-block;margin-top:20px;border:2px solid #fff;padding:5px 18px;border-radius:99px;font-family:var(--cond);font-weight:700;font-size:1.15rem;letter-spacing:.04em}
.estado.on{background:#fff;color:var(--rojo)}
table{width:100%;max-width:440px;margin-top:20px;border-collapse:collapse;font-family:var(--cond);font-weight:600;font-size:1.2rem}
td{padding:5px 0;border-bottom:2px solid rgba(255,255,255,.22)}
td:last-child{text-align:right;font-variant-numeric:tabular-nums}
tr.hoy td{color:#ff8a98}
tr.cerrado td:last-child{color:#aaa}
.dir{margin-top:20px;font-size:1.02rem;color:#ddd}
.btns{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:24px}
.btn{font-family:var(--cond);font-weight:700;font-size:1.25rem;letter-spacing:.05em;padding:13px 26px;text-decoration:none;border-radius:99px}
.btn.rojo{background:var(--rojo);color:#fff}
.btn.rojo:hover{background:#fff;color:var(--rojo)}
.btn.linea{border:2px solid #fff}
.btn.linea:hover{background:#fff;color:var(--negro)}
.legal-links{display:flex;gap:20px;flex-wrap:wrap;margin-top:30px;font-size:.95rem}
.legal-links a{color:#bbb}
.legal-links a:hover{color:#fff}
.ig{display:inline-flex;color:var(--rojo);transition:transform .2s ease,color .2s ease}
.ig:hover{color:#ff3b57;transform:scale(1.1)}

/* móvil: arriba la foto, abajo el panel negro; el corte sigue a 10º */
@media(max-width:900px){
  .fondo-i,.fondo-k{display:none}
  .pronto{background:var(--negro)}
  .wrap{grid-template-columns:1fr;min-height:0;width:100%}
  .izq{margin-bottom:calc(-17.6vw);padding:84px 18px calc(17.6vw + 16px);background:linear-gradient(rgba(200,16,46,.85),rgba(200,16,46,.55)),url(img/04.jpg) center/cover var(--rojo);clip-path:polygon(0 0,100% 0,100% calc(100% - 17.6vw + 1px),0 100%)}
  .logo{left:18px;top:18px}
  h1{font-size:clamp(3.2rem,15vw,5.6rem)}
  .lead{font-size:1.6rem}
  .der{padding:calc(17.6vw + 34px) 18px 56px;background:var(--negro);clip-path:polygon(0 17.6vw,100% 0,100% 100%,0 100%)}
  table{max-width:none}
}
@media(prefers-reduced-motion:reduce){.puntos i,.ig{animation:none;transition:none}}
