/* Mejoras responsive para móviles y tablet */
html{scroll-behavior:smooth}
img{max-width:100%;height:auto}

@media (max-width: 1024px){
  .topbar{padding:14px 16px !important}
  .navwrap{gap:14px !important}
  .hero{grid-template-columns:1fr !important;gap:22px !important;padding:38px 18px 28px !important}
  .mockup{max-width:640px;margin:0 auto;width:100%}
  .count-card{grid-template-columns:1fr !important}
  .footer-inner{grid-template-columns:1fr 1fr !important}
  .premios-grid{grid-template-columns:repeat(2,1fr) !important}
}

@media (max-width: 768px){
  body.home-page{padding-bottom:94px}
  .topbar{position:sticky;top:0;z-index:90;background:rgba(7,17,31,.96) !important;backdrop-filter:blur(14px)}
  .navwrap{align-items:stretch !important}
  .brand{justify-content:center !important;width:100%}
  .nav-actions{display:grid !important;grid-template-columns:1fr 1fr;gap:10px !important;width:100%}
  .btn-soft,.btn-gold{min-height:50px !important;font-size:15px !important;padding:12px 14px !important}
  .hero h1{font-size:clamp(34px,10vw,52px) !important;line-height:1.02 !important}
  .hero p{font-size:17px !important}
  .eyebrow{font-size:13px !important;line-height:1.35 !important}
  .mini-grid{grid-template-columns:1fr !important;gap:10px !important}
  .mini{padding:14px !important}
  .hero-cta{display:grid !important;grid-template-columns:1fr !important;width:100%}
  .safe-row{display:grid !important;grid-template-columns:1fr !important;gap:8px !important}
  .safe{justify-self:start}
  .prize-card{padding:14px !important;border-radius:24px !important}
  .tagline{padding:14px !important}
  .count-section{padding:0 14px 24px !important}
  .count-card{padding:16px !important;border-radius:22px !important}
  .count-title h2{font-size:30px !important}
  .countdown{grid-template-columns:repeat(2,1fr) !important}
  .timebox{padding:12px 6px !important}
  .timebox strong{font-size:28px !important}
  .section{padding:34px 14px !important}
  .section-title h2{font-size:31px !important;line-height:1.05 !important}
  .consulta-card{grid-template-columns:1fr !important;padding:16px !important;border-radius:22px !important}
  .consulta-card input{font-size:16px !important;min-height:52px !important}
  .consulta-card button{width:100% !important}
  .premios-grid{grid-template-columns:1fr !important}
  .premio-img{height:220px !important}
  .ranking{grid-template-columns:1fr !important}
  .panel{padding:18px !important;border-radius:22px !important}
  .list-item{align-items:flex-start !important;flex-direction:column !important;gap:8px !important}
  .footer{padding:30px 14px 90px !important}
  .footer-inner{grid-template-columns:1fr !important;gap:18px !important}
  .wa{right:16px !important;bottom:86px !important;width:58px !important;height:58px !important;font-size:28px !important}

  .mobile-cta-bar{display:grid !important;grid-template-columns:1fr 1.1fr;gap:10px;position:fixed;left:10px;right:10px;bottom:12px;z-index:95;background:rgba(7,17,31,.96);backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:10px;box-shadow:0 16px 35px rgba(0,0,0,.28)}
  .mobile-cta-bar a{display:flex;align-items:center;justify-content:center;text-align:center;text-decoration:none;border-radius:14px;min-height:48px;padding:10px 12px;font-weight:900;font-size:14px}
  .mobile-cta-bar .cta-soft{background:#1e293b;color:#fff;border:1px solid rgba(255,255,255,.10)}
  .mobile-cta-bar .cta-main{background:linear-gradient(135deg,#ffc938,#ff9f1c);color:#07111f}
}

@media (max-width: 480px){
  .brand span:last-child{font-size:15px !important}
  .brand-logo{width:38px !important;height:38px !important}
  .hero{padding:28px 14px 22px !important}
  .hero h1{font-size:clamp(30px,11vw,44px) !important}
  .hero p{font-size:16px !important}
  .section-title small{font-size:12px !important}
  .section-title h2{font-size:27px !important}
  .count-title h2{font-size:26px !important}
  .timebox strong{font-size:24px !important}
  .premio-body h3{font-size:19px !important}
}

/* Participar / Consultar / Ticket */
@media (max-width: 900px){
  .grid{grid-template-columns:1fr !important}
}
@media (max-width: 768px){
  .wrap{padding:18px 14px !important}
  .top{gap:10px !important;margin-bottom:16px !important}
  .resumen,.formcard,.cardx,.ticket{border-radius:22px !important}
  .resumen-body,.formcard,.cardx{padding:18px !important}
  .resumen-img{height:220px !important}
  .payment-card{padding:16px !important;border-radius:22px !important}
  .payment-step h4{font-size:16px !important}
  .payment-main{grid-template-columns:1fr !important;gap:14px !important}
  .qr-box{max-width:220px;margin:0 auto !important}
  .bank-card{padding:14px !important;border-radius:18px !important}
  .bank-row{flex-direction:column;align-items:flex-start}
  .btn-main,.copy-btn{min-height:50px !important}
  .search{grid-template-columns:1fr !important}
  .search .btn-main{width:100% !important}
  .ticket{align-items:flex-start !important;flex-direction:column !important}
  .ticket .btn{width:100% !important}
  .btns{display:grid !important;grid-template-columns:1fr !important;gap:10px !important}
  .btns .btn,.btns .btn-main{margin:0 !important;width:100% !important}
  .info{grid-template-columns:1fr !important}
  .hero h1,.numero{word-break:break-word}
}

@media (min-width: 769px) {
  .mobile-cta-bar{display:none !important}
}