:root{
  --red:#D22F25;
  --black:#0a0a0a;
  --smoke:#f9f9f9;
}
*{margin:0;padding:0;box-sizing:border-box}
html{overflow-x:hidden}
html,body{min-height:100%}
body{
  font-family:'Montserrat',system-ui,sans-serif;
  background:var(--black);
  color:var(--smoke);
  width:100%;
  min-height:100vh;
  min-height:100dvh;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  overflow-x:hidden;
  position:relative;
  padding-bottom:3.2rem;
}
/* Fondo cinematográfico B&N: viñeta + foco lateral + grano */
body::before{
  content:"";
  position:fixed;inset:0;
  background:
    radial-gradient(120% 90% at 78% 18%, rgba(255,255,255,.14) 0%, rgba(255,255,255,0) 42%),
    radial-gradient(140% 120% at 50% 120%, rgba(0,0,0,.9) 0%, rgba(0,0,0,0) 55%),
    linear-gradient(180deg,#141414 0%,#0a0a0a 60%,#000 100%);
  z-index:0;
}
/* Grano de película */
body::after{
  content:"";
  position:fixed;inset:-50%;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E");
  opacity:.5;
  z-index:1;
  pointer-events:none;
  animation:grain 8s steps(6) infinite;
}
@keyframes grain{
  0%{transform:translate(0,0)}20%{transform:translate(-4%,3%)}
  40%{transform:translate(3%,-4%)}60%{transform:translate(-3%,2%)}
  80%{transform:translate(2%,3%)}100%{transform:translate(0,0)}
}
.wrap{position:relative;z-index:2;padding:2rem 1.5rem;max-width:820px;width:100%}
.eyebrow{
  font-family:'Montserrat';font-weight:700;letter-spacing:.42em;
  text-transform:uppercase;font-size:.72rem;color:var(--red);
  margin-bottom:1.6rem;
}
.visually-hidden{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
}
.logo{
  display:block;
  width:min(100%,560px);
  height:auto;
  margin:0 auto;
}
.slogan{
  font-family:'Archivo Black',sans-serif;text-transform:uppercase;
  font-size:clamp(.85rem,2.6vw,1.15rem);letter-spacing:.28em;
  margin-top:1.4rem;color:#fff;
}
.slogan .dot{color:var(--red)}
.rule{width:64px;height:4px;background:var(--red);margin:2.2rem auto;border:0}
.soon{
  font-weight:600;font-size:clamp(1rem,3vw,1.35rem);
  color:#e8e8e8;letter-spacing:.02em;
}
.sub{margin-top:.7rem;color:#9a9a9a;font-size:.95rem;font-weight:400;max-width:520px;margin-left:auto;margin-right:auto}
.contact{margin-top:3rem;color:#8a8a8a;font-size:.82rem;letter-spacing:.05em;line-height:1.9}
.contact strong{color:#cfcfcf;font-weight:600}
footer{position:absolute;bottom:1.2rem;left:0;right:0;z-index:2;color:#5a5a5a;font-size:.72rem;letter-spacing:.06em;padding:0 1rem}

@media (max-width:600px){
  .wrap{padding:1.5rem 1.15rem}
  .eyebrow{letter-spacing:.26em;font-size:.64rem;margin-bottom:1.2rem}
  .logo{width:min(100%,340px)}
  .slogan{letter-spacing:.18em;margin-top:1.1rem}
  .rule{margin:1.8rem auto}
  .soon{font-size:clamp(1rem,4.5vw,1.2rem)}
  .contact{margin-top:2.2rem}
}
