/* HappyPlayTV Premium v4.1 — visual only, keeps original actions and backend */
:root{--hp-ink:#070a19;--hp-cyan:#26c9ff;--hp-violet:#6e36ff;--hp-pink:#fb2eab;--hp-text:#f6f7ff}
#pagos .section-heading h2, #beneficios .section-heading h2{font-size:clamp(1.75rem,3.8vw,3rem);letter-spacing:-.035em;line-height:1.13;max-width:920px;margin-inline:auto}
#pagos .section-heading, #beneficios .section-heading{margin-bottom:24px}
.hp-gradient-text{background:linear-gradient(105deg,#ff53b7,#d953ff 48%,#27cfff);-webkit-background-clip:text;background-clip:text;color:transparent}
#pagos,.hp-trust-section,#beneficios{isolation:isolate}
#pagos{background:radial-gradient(ellipse at 91% 10%,rgba(40,57,145,.18),transparent 56%),radial-gradient(ellipse at 5% 90%,rgba(179,35,128,.09),transparent 55%)}
/* Payment card imagery and spacing, consistent with the approved design */
#pagos .payment-icon-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:15px;align-items:stretch}
#pagos .payment-method-card{grid-column:span 2;min-width:0;display:flex;flex-direction:column;align-items:flex-start;text-align:left;justify-content:flex-start;padding:18px 18px 20px!important;background:linear-gradient(145deg,#0c1734 0%,#071025 64%,#080b1a 100%)!important;border:1px solid rgba(50,119,255,.76)!important;border-radius:20px!important;box-shadow:0 12px 30px rgba(1,4,18,.32),inset 0 1px rgba(255,255,255,.035)!important;position:relative;overflow:hidden;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
#pagos .payment-method-card::before{content:"";position:absolute;inset:auto 10% 0 10%;height:1px;background:linear-gradient(90deg,transparent,#3f69ff66,transparent)}
#pagos .payment-method-card:hover{transform:translateY(-3px);border-color:#ff45ca!important;box-shadow:0 16px 32px rgba(14,17,70,.4),0 0 14px rgba(192,31,221,.09)!important}
#pagos .payment-method-card:nth-child(5n+1){border-color:#b137fa!important}
#pagos .payment-method-card:nth-child(5n+2){border-color:#2675ff!important}
#pagos .payment-method-card:nth-child(5n+4){border-color:#f6ae36!important}
#pagos .payment-method-card:nth-child(5n+5){border-color:#dc34c5!important}
#pagos .payment-method-card:nth-child(n+4):nth-last-child(-n+2){grid-column:span 3;flex-direction:row;align-items:center;gap:14px;flex-wrap:wrap}
#pagos .payment-method-card img{display:block;flex:0 0 auto;width:92px!important;height:92px!important;max-width:100%;object-fit:contain!important;margin:0 0 12px!important;filter:none!important;border-radius:21px}
#pagos .payment-method-card:nth-child(n+4):nth-last-child(-n+2) img{margin:0!important}
#pagos .payment-method-card h3{font-size:clamp(1rem,1.45vw,1.25rem);font-weight:800!important;margin:0 0 5px;line-height:1.27;color:#f7faff;overflow-wrap:anywhere}
#pagos .payment-method-card p{color:#c5cbe0;line-height:1.45;font-size:.9rem;margin:0;overflow-wrap:anywhere}
/* Features use a matching icon set */
#beneficios .feature-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;align-items:stretch}
#beneficios .feature-card{min-width:0;padding:18px!important;border-radius:20px!important;background:linear-gradient(150deg,#0b1733,#061024 76%,#090a1c)!important;border:1px solid rgba(49,103,244,.72)!important;box-shadow:0 12px 24px rgba(2,3,18,.25),inset 0 1px rgba(255,255,255,.025)!important;transition:transform .2s ease,border-color .2s ease}
#beneficios .feature-card:nth-child(3n+1){border-color:#a73edc!important}
#beneficios .feature-card:hover{transform:translateY(-3px);border-color:#43d0fe!important}
#beneficios .feature-card img{width:86px!important;height:86px!important;margin:0 0 12px!important;object-fit:contain!important;border-radius:20px;filter:none!important;display:block}
#beneficios .feature-card h3{color:#f7faff;line-height:1.3;font-size:1.06rem;font-weight:800!important;margin:0 0 7px;overflow-wrap:anywhere}
#beneficios .feature-card p{color:#bac7df;font-size:.87rem;line-height:1.52;margin:0;overflow-wrap:anywhere}
/* Trust feature — prominently visible but not a fictitious payment guarantee */
.hp-trust-v4{padding:26px 0 42px}
.hp-trust-v4 .hp-trust-box{border-radius:25px;background:radial-gradient(ellipse at 10% 6%,rgba(31,87,201,.19),transparent 46%),radial-gradient(ellipse at 94% 92%,rgba(35,35,134,.14),transparent 54%),linear-gradient(117deg,#081126,#060b1d 75%)!important;border:1px solid #278cfe!important;box-shadow:0 18px 40px rgba(0,0,0,.22),inset 0 0 0 1px rgba(60,159,255,.10),0 0 28px rgba(40,113,244,.15)!important;padding:clamp(20px,3.8vw,36px)!important}
.hp-trust-v4 .hp-trust-top{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:clamp(12px,4vw,28px)}
.hp-trust-v4 .hp-trust-top .hp-trust-hero-icon{order:0;display:block;flex:0 0 auto;width:clamp(110px,21vw,188px);height:auto;aspect-ratio:1;object-fit:contain;border-radius:22px;filter:drop-shadow(0 0 18px rgba(45,118,255,.32))}
.hp-trust-v4 .hp-trust-copy{order:1;flex:1;min-width:0}
.hp-trust-v4 .hp-trust-eyebrow{font-size:.72rem;color:#8acfff;letter-spacing:.16em;font-weight:800}
.hp-trust-v4 .hp-trust-copy h2{font-size:clamp(1.6rem,4.2vw,2.75rem);font-weight:900;line-height:1.1;margin:6px 0 10px;background:none;color:#fff;-webkit-text-fill-color:currentColor}
.hp-trust-v4 .hp-trust-copy h2 em{font-style:normal;color:#41d6ff}
.hp-trust-v4 .hp-trust-copy p{font-size:clamp(.94rem,1.8vw,1.17rem);color:#dae5fa;line-height:1.5;margin:0}
.hp-trust-v4 .hp-trust-copy strong{color:#53d7ff}
.hp-trust-v4 .hp-trust-copy small{font-size:.78rem;color:#98accd;line-height:1.4;margin-top:12px}
.hp-trust-v4 .hp-trust-points{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:22px}
.hp-trust-v4 .hp-trust-points>div{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:4px;padding:8px 4px;border-radius:15px;background:rgba(13,24,55,.75);border:1px solid rgba(69,95,174,.18)}
.hp-trust-v4 .hp-trust-points img{width:55px;height:55px;object-fit:contain;filter:none}
.hp-trust-v4 .hp-trust-points strong{font-size:.78rem;color:#ecf6ff;line-height:1.25}
/* Floating controls, always arranged vertically: IA -> wheel -> WhatsApp */
body .ai-launcher,body .hp-wheel-launcher,body .whatsapp-floating{position:fixed!important;left:auto!important;right:14px!important;width:62px!important;height:62px!important;min-width:62px!important;min-height:62px!important;border-radius:50%!important;margin:0!important;padding:0!important;display:grid!important;place-items:center!important;background:#090e27!important;border:0!important;box-shadow:0 9px 22px rgba(0,0,0,.37)!important;transform:none;cursor:pointer;overflow:visible;z-index:1200!important;transition:transform .18s ease,filter .18s ease}
body .ai-launcher{bottom:177px!important}
body .hp-wheel-launcher{bottom:100px!important;max-width:none!important;animation:none!important}
body .whatsapp-floating{bottom:23px!important;min-height:62px!important}
body .ai-launcher:hover,body .hp-wheel-launcher:hover,body .whatsapp-floating:hover{filter:brightness(1.12);transform:translateY(-2px)!important}
body .ai-launcher:focus-visible,body .hp-wheel-launcher:focus-visible,body .whatsapp-floating:focus-visible{outline:3px solid #eaf6ff;outline-offset:3px}
body .ai-launcher .ai-icon{width:100%!important;height:100%!important;border-radius:50%!important;background:transparent url('../img/hp-premium-v5/bot-float.webp') center/contain no-repeat!important;box-shadow:none!important;font-size:0!important;color:transparent!important}
body .hp-wheel-launcher::before{content:"";display:block;width:100%;height:100%;background:url('../img/hp-premium-v5/wheel-float.webp') center/contain no-repeat}
body .hp-wheel-launcher .hp-wheel-launcher-icon{display:none!important}
body .whatsapp-floating::before{content:"";display:block;width:100%;height:100%;background:url('../img/hp-premium-v5/wa-float.webp') center/contain no-repeat}
body .whatsapp-floating .hp-wa-icon,body .whatsapp-floating>img,body .whatsapp-floating>span{display:none!important}
body .ai-greeting{right:88px!important;bottom:181px!important}
/* Lucky Spin visual finish, leaving spin physics and code verification untouched */
#hp-wheel-root .hp-wheel-dialog{background:radial-gradient(ellipse at 50% 5%,#172a63,#0c1333 45%,#080b21 90%);border:1px solid #6579ffb0;border-radius:26px;box-shadow:0 28px 95px #02051cc9,0 0 35px rgba(77,46,221,.29)}
#hp-wheel-root .hp-wheel-before h2{font-size:clamp(1.5rem,5vw,2rem);letter-spacing:-.045em}
#hp-wheel-root .hp-wheel-wheel-area{filter:drop-shadow(0 0 15px rgba(74,65,251,.48))}
#hp-wheel-root .hp-wheel-disc{border:9px solid #ffce59;box-shadow:0 0 0 4px #4430a0,0 0 24px rgba(121,65,255,.52),inset 0 0 11px rgba(255,255,255,.5)}
#hp-wheel-root .hp-wheel-spin{background:linear-gradient(104deg,#d51eac,#742dff 50%,#266ffe);border:1px solid #ad7bff;box-shadow:0 8px 22px rgba(115,45,237,.38);letter-spacing:.02em}
#hp-wheel-root .hp-wheel-after .hp-wheel-after-title{font-size:clamp(1.6rem,6vw,2.2rem);font-weight:900;letter-spacing:-.045em}
#hp-wheel-root .hp-wheel-after .hp-wheel-ticket{background:linear-gradient(120deg,#ffe5ad,#f6ae52 65%,#ffcb67);border:2px solid #fff0cb;box-shadow:0 8px 32px rgba(246,173,67,.26);color:#142045;border-radius:18px}
#hp-wheel-root .hp-wheel-after .hp-wheel-pct{color:#171c42;letter-spacing:-.07em}
#hp-wheel-root .hp-wheel-after .hp-wheel-code-line{border-radius:12px;background:#101b3b;border:1px dashed #6c7ae0;padding:11px}
#hp-wheel-root .hp-wheel-after .hp-wheel-code{color:#ff69bc}
#hp-wheel-root .hp-wheel-after .hp-wheel-instructions{border:1px solid rgba(94,139,255,.3);background:rgba(13,36,74,.8);color:#e8eeff}
#hp-wheel-root .hp-wheel-after .hp-wheel-whatsapp{background:linear-gradient(105deg,#04b75b,#038a47);border:1px solid #23de8c;border-radius:12px}
@media (max-width:1000px){#beneficios .feature-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:720px){#pagos .payment-icon-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}#pagos .payment-method-card,#pagos .payment-method-card:nth-child(n+4):nth-last-child(-n+2){grid-column:auto;display:flex;flex-direction:column;align-items:flex-start;gap:0}#pagos .payment-method-card:last-child:nth-child(odd){grid-column:1/-1;display:flex;flex-direction:row;align-items:center;gap:12px}#pagos .payment-method-card:last-child:nth-child(odd) img{margin:0!important}#beneficios .feature-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}#beneficios .feature-card,#pagos .payment-method-card{padding:13px!important;border-radius:17px!important}#pagos .payment-method-card img,#beneficios .feature-card img{width:80px!important;height:80px!important;margin-bottom:9px!important}#pagos .payment-method-card h3,#beneficios .feature-card h3{font-size:.96rem}#pagos .payment-method-card p,#beneficios .feature-card p{font-size:.78rem;line-height:1.48}.hp-trust-v4 .hp-trust-box{padding:18px!important}.hp-trust-v4 .hp-trust-hero-icon{width:104px!important}.hp-trust-v4 .hp-trust-points{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.hp-trust-v4 .hp-trust-points>div{flex-direction:row;text-align:left;padding:8px 10px}.hp-trust-v4 .hp-trust-points img{width:39px;height:39px}body .ai-launcher,body .hp-wheel-launcher,body .whatsapp-floating{width:55px!important;height:55px!important;min-width:55px!important;min-height:55px!important;right:12px!important}body .ai-launcher{bottom:151px!important}body .hp-wheel-launcher{bottom:84px!important}body .whatsapp-floating{bottom:17px!important}body .ai-greeting{right:76px!important;bottom:152px!important}}
@media (max-width:360px){#pagos .payment-method-card img,#beneficios .feature-card img{width:66px!important;height:66px!important}#pagos .payment-method-card h3,#beneficios .feature-card h3{font-size:.88rem}#pagos .payment-method-card p,#beneficios .feature-card p{font-size:.74rem}.hp-trust-v4 .hp-trust-top{gap:10px}.hp-trust-v4 .hp-trust-hero-icon{width:88px!important}.hp-trust-v4 .hp-trust-copy h2{font-size:1.5rem}}
@media (prefers-reduced-motion:reduce){#pagos .payment-method-card,#beneficios .feature-card,body .ai-launcher,body .hp-wheel-launcher,body .whatsapp-floating{transition:none}}