:root{
      --negro:#1c1c1c;
      --gris:#e0e0e0;
      --rojo:#c62828;
      --blanco:#ffffff;
    }
    
    *{
      font-family:'Poppins', sans-serif;
    }
    body{
      background:#000;
      margin:0;
      color:var(--blanco);
      min-height:100vh;
      overflow:hidden; /* Desktop: sin scroll */
    }
    
    /* 📱 Tablets y móviles */
    @media (max-width: 991px){
      body{
        overflow-y: auto;   /* ✅ aparece scroll SOLO si hace falta */
        overflow-x: hidden;
      }
      .container-main{
        align-items: flex-start;
      }
    }
    #bgVideo {
        position: fixed;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        filter: blur(8px) brightness(0.7);
        transform: scale(1.05);
        z-index: -1;
    }
    /* Video fondo */
    .video-bg{
      position:fixed;
      top:0;
      left:0;
      width:100%;
      height:100%;
      z-index:-2;
      overflow:hidden;
    }
    
    .video-bg video{
      width:100%;
      height:100%;
      object-fit:cover;
      filter: blur(6px) brightness(0.8);
      transform: scale(1.05);
    }
    
    /* Overlay oscuro */
    .video-overlay{
      position:fixed;
      inset:0;
      background:linear-gradient(
        rgba(0,0,0,.75),
        rgba(0,0,0,.55)
      );
      z-index:-1;
    }
    
    /* Contenido */
    .container-main{
      min-height:100vh;
      display:flex;
      align-items:center;
    }
    
    .brand img {
        width: 220px;
        height: 220px;
        aspect-ratio: 220 / 80;
    }
    
    .brand h1{
      font-size:42px;
      font-weight:700;
      line-height:1.2;
    }
    
    .brand h1 span{
      color:var(--rojo);
    }
    
    .brand p{
      margin-top:20px;
      color:var(--gris);
    }
    
    .counter-box{
      background:rgba(17,17,17,.9);
      padding:40px;
      border-radius:14px;
      box-shadow:0 20px 40px rgba(0,0,0,.5);
    }
    
    .counter-box h2{
      font-size:28px;
      margin-bottom:20px;
    }
    
    /* =========================
       CONTADOR RESPONSIVE
    ========================= */
    
    /* Desktop (default) */
    .countdown{
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 15px;
    }
    
    /* Tablets y móviles */
    @media (max-width: 768px){
      .countdown{
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
      }
    
      .time span{
        font-size: 28px;
      }
    
      .counter-box{
        padding: 25px;
      }
    }
    
    .time{
      background:#1f1f1f;
      padding:20px;
      text-align:center;
      border-radius:10px;
    }
    
    .time span{
      font-size:36px;
      font-weight:700;
      color:var(--rojo);
    }
    
    .time small{
      display:block;
      margin-top:5px;
      font-size:12px;
      color:var(--gris);
    }
    
    .subscribe p{
      margin:25px 0 15px;
      font-size:14px;
      color:var(--gris);
    }
    
    .subscribe input{
      padding:14px;
    }
    
    .subscribe button{
      background:var(--rojo);
      border:none;
      font-weight:600;
    }
    
    .subscribe button:hover{
      opacity:.9;
    }
    
    /* Móviles pequeños */
    @media (max-width: 380px){
      .time span{
        font-size: 24px;
      }
    }
    /* Responsive ajustes */
    @media(max-width:768px){
      .brand h1{
        font-size:32px;
      }
    }
    
    /* =========================
        FOOTER
    ========================= */
    /* Desktop */
    @media (min-width: 992px){
      .site-footer{
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        z-index: 10;
      }
    
      /* Evita que tape contenido */
      .container-main{
        padding-bottom: 90px;
      }
    }
    
    .site-footer{
      position: relative;
      background: linear-gradient(
        to top,
        rgba(0,0,0,.85),
        rgba(0,0,0,.65)
      );
      backdrop-filter: blur(6px);
      color: #eee;
      font-size: 12px;
      text-align: center;
      padding: 30px 15px;
    }
    .site-footer{
      animation: footerFade .8s ease forwards;
    }
    
    @keyframes footerFade{
      from{ opacity:0; transform:translateY(10px); }
      to{ opacity:1; transform:translateY(0); }
    }
    .footer-inner{
      max-width: 1200px;
      margin: 0 auto;
      text-align: center;
      display: grid;
      gap: 10px;
    }
    
    .footer-brand strong{
      display: block;
      font-size: 16px;
      font-weight: 600;
      letter-spacing: .5px;
    }
    
    .footer-brand span{
      font-size: 13px;
      opacity: .8;
    }
    
    .footer-copy{
      font-size: 13px;
      opacity: .85;
    }
    
    .footer-credit{
      font-size: 13px;
    }
    
    .footer-credit a{
      color: #c9a66b; /* tono madera elegante */
      text-decoration: none;
      font-weight: 500;
      transition: color .3s ease;
    }
    
    .footer-credit a:hover{
      color: #fff;
    }
    
    /* Responsive */
    @media (max-width: 480px){
      .site-footer{
        padding: 25px 12px;
      }
    }
    
    /* =========================
       FOOTER (FIX PC / NORMAL MOBILE)
    ========================= */
    
    .site-footer{
      position: relative;
      width: 100%;
      padding: 14px 0;
      background: rgba(0,0,0,.75);
      color: #aaa;
      font-size: 13px;
      z-index: 50; /* 🔥 CLAVE */
    }
    
    .site-footer a{
      color: #fff;
      text-decoration: none;
      font-weight: 500;
    }
    
    .site-footer a:hover{
      color: var(--rojo);
    }
    
    /* Desktop: footer fijo */
    @media (min-width: 992px){
      .site-footer{
        position: fixed;
        bottom: 0;
        left: 0;
      }
    
      .container-main{
        padding-bottom: 90px; /* evita que tape contenido */
      }
    }