*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#05080e;color:#f7f8fb;font-family:Inter,system-ui,-apple-system,"Segoe UI",Arial,sans-serif}a{text-decoration:none;color:inherit}.wrap{max-width:1240px;margin:auto;padding-left:22px;padding-right:22px}
.top{position:sticky;top:0;z-index:30;background:#050910f2;border-bottom:1px solid #1a2636;backdrop-filter:blur(14px)}
.nav{min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:18px}.brand{display:flex;align-items:center;gap:10px;font-weight:900}.brand-badge{width:28px;height:28px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(130deg,#ff9900,#ffd23d);color:#201000;box-shadow:0 0 22px #ffb41e60}.brand-text{font-size:30px;letter-spacing:-1.8px}.brand-text span{color:#ffb51d}.nav nav{display:flex;gap:24px;font-size:14px}.nav nav a:hover{color:#ffb51d}.panel-btn{background:linear-gradient(105deg,#ff9d0b,#ffe043,#ffac00);color:#171005;border-radius:999px;padding:15px 24px;font-weight:900;font-size:14px;box-shadow:0 0 28px #ffae2070;white-space:nowrap;animation:pulse 3s ease-in-out infinite}.panel-btn span{margin-left:8px}@keyframes pulse{50%{box-shadow:0 0 38px #ffc125a8}}
.hero{background:radial-gradient(ellipse at 90% 22%,#8c3f0073,transparent 40%),radial-gradient(ellipse at 8% 30%,#4d210a99,transparent 45%),linear-gradient(#080b10,#07090d)}
.hero-grid{min-height:470px;display:grid;grid-template-columns:1.08fr .92fr;align-items:center;gap:34px;padding-top:46px;padding-bottom:40px}.eyebrow{display:inline-block;border:1px solid #a96c0b;border-radius:30px;color:#ffd04b;padding:9px 14px;font-size:11px;font-weight:900;letter-spacing:.4px}.mini-logos{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}.mini-logos span{font-size:11px;padding:6px 10px;border-radius:30px;background:#101621;border:1px solid #2a3340;color:#ffbf3a}
h1{font-size:clamp(40px,5vw,72px);line-height:1.02;letter-spacing:-3px;margin:18px 0 14px;font-weight:900;max-width:660px}h1 em{font-style:normal;color:#ffba23}.intro>p{max-width:520px;line-height:1.65;color:#e1e5ee;font-size:18px}.actions{display:flex;gap:12px;margin:24px 0 19px;flex-wrap:wrap}.btn{display:inline-flex;justify-content:center;align-items:center;padding:15px 24px;border-radius:12px;font-weight:850;font-size:15px}.btn.large{padding:18px 28px;font-size:18px}.gold{background:linear-gradient(110deg,#ff9308,#ffd034);color:#160d00;box-shadow:0 9px 26px #ff9d0c30}.outline{background:#142033;border:1px solid #3b4c60}.chips{display:flex;gap:8px;flex-wrap:wrap}.chips span{font-size:12px;border:1px solid #28313d;background:#10151e;border-radius:20px;padding:8px 12px}
.visual{min-height:350px;position:relative;display:flex;align-items:center;justify-content:center}.mic-card{width:100%;max-width:500px;background:linear-gradient(140deg,#111b2c,#050b14);border:1px solid #af6a12;border-radius:24px;padding:22px;box-shadow:0 25px 60px #000b,0 0 40px #ff9d0025;transform:perspective(900px) rotateY(-6deg)}.screen-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.screen-head strong{font-size:22px}.screen-head b{font-size:14px;color:#21dfb6}.bars{height:140px;display:flex;align-items:end;justify-content:center;gap:10px}.bars i{width:28px;border-radius:10px 10px 3px 3px;background:linear-gradient(#ffcb2c,#ff9200);box-shadow:0 0 16px #ffac0044;animation:wave 1.4s infinite alternate}.bars i:nth-child(1){height:52%}.bars i:nth-child(2){height:76%;animation-delay:.2s}.bars i:nth-child(3){height:60%;animation-delay:.4s}.bars i:nth-child(4){height:94%;animation-delay:.1s}.bars i:nth-child(5){height:66%;animation-delay:.5s}.bars i:nth-child(6){height:84%;animation-delay:.3s}.bars i:nth-child(7){height:48%;animation-delay:.2s}.bars i:nth-child(8){height:30%;animation-delay:.6s}@keyframes wave{to{transform:scaleY(.72);transform-origin:bottom}}.screen-meta{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}.screen-meta div{background:#101826;border:1px solid #1d2a3a;border-radius:14px;padding:14px}.screen-meta span{display:block;color:#a9b8c8;font-size:12px}.screen-meta strong{display:block;margin-top:7px;font-size:18px}
.features{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin-top:24px;margin-bottom:34px}.features article{background:linear-gradient(#101927,#0a1019);border:1px solid #1b2a3b;border-radius:15px;padding:18px;min-height:100px}.features article div{float:left;margin-right:12px;color:#ffbd26;font-size:30px}.features strong{font-size:14px}.features p{color:#b2c4df;font-size:13px;line-height:1.5;margin:7px 0 0}
.pricing{padding-top:10px;padding-bottom:28px}.section-label{color:#ffbc28;font-size:12px;letter-spacing:2px}.pricing h2{font-size:clamp(32px,4vw,54px);line-height:1.08;letter-spacing:-1.8px;margin:12px 0 8px}.sub{margin:0 0 21px;color:#ccd4e2;font-size:18px}.plans{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.plan{position:relative;background:linear-gradient(160deg,#101927,#070c14);border:1px solid #263244;border-radius:18px;padding:20px 18px;display:flex;flex-direction:column;min-height:370px}.plan.featured{border-color:#ffb61d;box-shadow:0 0 25px #ffab111b}.plan-icon{color:#ffbc1f;font-size:23px}.plan h3{font-size:30px;margin:8px 0 3px}.plan p{font-size:16px;color:#b9c7d9;margin:0 0 16px}.price{font-weight:900;font-size:clamp(26px,2.8vw,40px);letter-spacing:-1.5px}.plan>small{color:#b9c7d9;font-size:16px}.plan ul{list-style:none;padding:0;margin:22px 0;flex:1}.plan li{font-size:14px;line-height:1.55;margin:8px 0}.plan li:before{content:"✓";color:#ffb51d;font-weight:900;margin-right:10px}.plan>a{background:#1e2b40;border:1px solid #304055;border-radius:10px;padding:13px;text-align:center;font-size:18px;font-weight:850}.plan.featured>a{background:linear-gradient(90deg,#ff9509,#ffd131);color:#100b00}.popular{position:absolute;right:12px;top:15px;font-size:11px;color:#ffcf5a;border:1px solid #bd861d;border-radius:20px;padding:6px 10px}
.cta{display:flex;align-items:center;justify-content:space-between;gap:22px;border-radius:18px;padding:20px 22px;margin-top:14px;margin-bottom:22px}.cta-go{border:1px solid #d28a15;background:radial-gradient(ellipse at 0% 80%,#9a440049,transparent 48%),linear-gradient(100deg,#1a0e09,#0d1019);box-shadow:0 0 26px #ff980016}.cta-logo{min-width:190px;font-size:40px;font-weight:950;letter-spacing:-2px}.cta-logo span,.cta-content h2 span{color:#ffb51d}.cta-content h2{font-size:clamp(24px,2.8vw,40px);line-height:1.1;margin:0}.cta-content p{font-size:14px;color:#d4d7dd;margin:8px 0 0}
.cta-pro{display:block;border:1px solid #d28a15;background:radial-gradient(circle at 0% 0%,#4d1f0057,transparent 32%),linear-gradient(120deg,#130b06,#090d14);box-shadow:0 0 26px #ff980016}.cta-logo.alt{font-size:38px;margin-bottom:14px}.pro-grid{display:grid;grid-template-columns:1.3fr .9fr .8fr;gap:20px;align-items:center}.pro-main h2{font-size:clamp(28px,3vw,46px);line-height:1.05;margin:0 0 12px;letter-spacing:-1.5px}.pro-main p,.pro-steps p{font-size:16px;color:#d5deeb;line-height:1.6;margin:0}.pro-main strong,.pro-steps strong{color:#ffbf2f}.pro-steps{background:#0c1420;border:1px solid #223245;border-radius:18px;padding:18px}.pro-steps h3{margin:0 0 10px;font-size:24px;color:#ffbf2f}.pro-action{display:flex;justify-content:center;align-items:center}
footer{text-align:center;border-top:1px solid #ad6910;padding:24px 12px;background:radial-gradient(ellipse at center,#522706,#08090e 65%)}footer>a{font-size:clamp(26px,4vw,49px);font-weight:950;letter-spacing:-1px}footer>a span{color:#ffbf22}footer p{color:#8996a7;font-size:12px}
.whatsapp{position:fixed;right:16px;bottom:16px;z-index:40;display:flex;align-items:center;gap:10px;background:linear-gradient(135deg,#0e6f3f,#1fb466);border:1px solid #62dd9e;border-radius:999px;color:#fff;padding:12px 16px;box-shadow:0 12px 30px rgba(0,0,0,.35)}.wa-icon{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#fff;color:#179a55;font-size:20px;font-weight:900}.wa-text{font-weight:800;line-height:1.05}.wa-text small{font-weight:600;opacity:.95}
@media(max-width:1040px){.nav nav{display:none}.hero-grid,.pro-grid{grid-template-columns:1fr}.plans{grid-template-columns:repeat(2,1fr)}.features{grid-template-columns:repeat(2,1fr)}.cta,.cta-go{flex-wrap:wrap;justify-content:center;text-align:center}}
@media(max-width:620px){.brand-text{font-size:24px}.panel-btn{font-size:11px;padding:12px 14px}.hero-grid{padding-top:32px}.intro>p,.sub,.pro-main p,.pro-steps p{font-size:15px}.plans,.features{grid-template-columns:1fr}.plan h3{font-size:24px}.cta-logo{font-size:30px}.cta-pro,.cta-go{text-align:center}.whatsapp{right:10px;left:10px;justify-content:center}}

/* Logotipos oficiales corregidos — TunerCloud, TunerGo y TunerPro */
.brand-logo{display:block;width:190px;max-height:59px;object-fit:contain;object-position:left center}
.dash-logo{display:block;width:132px;height:55px;object-fit:contain;object-position:left center}
.logo-link{display:flex;flex-direction:column;justify-content:center;align-items:center;flex:0 0 205px;gap:7px;min-width:0}
.cta-image{display:block;width:100%;height:140px;object-fit:contain}
.logo-pro{height:125px}
.pro-brand{margin:0 0 16px;align-items:flex-start;flex:initial}
.pro-brand .logo-pro{width:210px}
.pro-brand strong{color:#ffc02e;font-size:17px;letter-spacing:.05em}
@media(max-width:620px){.brand-logo{width:125px;max-height:50px}.logo-link{flex-basis:170px}.cta-image{height:125px}.pro-brand{align-items:center}}

/* TunerCloud nueva portada interactiva */
html{scroll-behavior:smooth;scroll-padding-top:100px}
body{overflow-x:hidden}
.nav-new{font-size:9px;color:#080a0d;background:linear-gradient(90deg,#ff8a00,#ffcf2f);border-radius:5px;padding:3px 5px;font-weight:900;vertical-align:middle}
.gold-text,.tv-copy h2 span{color:#ffb51c}
.hero{position:relative;isolation:isolate}
.hero:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 75% 20%,rgba(255,133,0,.14),transparent 52%);animation:heroPulse 6s ease-in-out infinite alternate}
@keyframes heroPulse{from{opacity:.45;transform:scale(.96)}to{opacity:1;transform:scale(1.04)}}
.mic-card{transition:transform .35s ease,box-shadow .35s ease;will-change:transform;box-shadow:0 0 40px rgba(255,149,0,.12)}
.mic-card:hover{box-shadow:0 0 75px rgba(255,149,0,.27)}
.bars i{animation:equalize 1s ease-in-out infinite alternate;transform-origin:bottom}
.bars i:nth-child(2n){animation-duration:.67s;animation-delay:-.35s}
.bars i:nth-child(3n){animation-duration:1.35s;animation-delay:-.7s}
@keyframes equalize{from{transform:scaleY(.3)}to{transform:scaleY(1)}}
.marquee{overflow:hidden;background:linear-gradient(90deg,#ff8a00,#ffc32c);color:#100b00;padding:12px 0;font-size:13px;font-weight:900;letter-spacing:1.2px;white-space:nowrap}
.marquee-track{display:inline-block;min-width:max-content;animation:marquee 32s linear infinite}
@keyframes marquee{to{transform:translateX(-50%)}}
.tv-section{position:relative;display:grid;grid-template-columns:1.15fr .85fr;gap:30px;align-items:center;margin-top:48px;margin-bottom:38px;padding:34px!important;border:1px solid #b87911;border-radius:25px;background:radial-gradient(ellipse at 80% 45%,#4b1d03 0%,#131015 46%,#0c111b 100%);box-shadow:0 10px 65px #0008, inset 0 0 40px #ff9c0010}
.tv-badge{display:inline-flex;padding:9px 13px;border-radius:50px;color:#171000;font-weight:900;font-size:12px;letter-spacing:.8px;background:linear-gradient(90deg,#ff8500,#ffdc45);box-shadow:0 0 26px #ff990055;animation:badgePulse 2s infinite alternate}
@keyframes badgePulse{to{box-shadow:0 0 38px #ff9900a0}}
.tv-copy h2{font-size:clamp(32px,4vw,56px);line-height:1.07;margin:17px 0}
.tv-copy>p{color:#cbd1df;max-width:620px;line-height:1.7;font-size:16px}
.tv-points{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin:23px 0}
.tv-points span{color:#f4f5f9;font-size:13px;padding:10px;background:#ffffff09;border:1px solid #ffffff14;border-radius:10px}
.tv-prices{display:flex;flex-wrap:wrap;gap:12px;margin:25px 0}
.tv-prices>div{display:flex;flex-direction:column;min-width:168px;gap:5px;padding:13px 19px;border-radius:13px;background:#090e18;border:1px solid #ffae285c}
.tv-prices strong{font-size:clamp(24px,2.7vw,34px);color:white}
.tv-prices small{color:#ffbc42;font-weight:800;font-size:11px}
.tv-visual{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:400px}
.tv-visual img{position:relative;z-index:1;width:min(100%,420px);border-radius:26px;box-shadow:0 25px 70px #000a;animation:tvFloat 5s ease-in-out infinite}
.tv-halo{position:absolute;width:75%;aspect-ratio:1;border-radius:50%;background:#ff880045;filter:blur(65px);animation:heroPulse 4s infinite alternate}
@keyframes tvFloat{50%{transform:translateY(-13px)}}
.tv-live{position:relative;z-index:2;margin-top:-16px;background:#fa192b;color:white;padding:10px 18px;border-radius:40px;font-size:12px;font-weight:900;box-shadow:0 0 25px #fa192b77;animation:badgePulse 1.5s infinite alternate}
.tv-mini{margin-top:19px;color:#ddd;font-size:12px;font-weight:800}
.tv-mini span{color:#ffab16;padding:0 7px}
.tv-link{background:#241305!important;color:#ffbc3a!important;border:1px solid #ff9d23!important}
.tv-link b{font-size:9px;color:#13100a;background:#ffbc3a;padding:4px 6px;border-radius:4px}
.plan{transition:transform .25s ease,box-shadow .25s ease}
.plan:hover{transform:translateY(-8px);box-shadow:0 18px 45px #ff9d0025}
.btn,.panel-btn,.cta a{transition:transform .2s ease,box-shadow .2s ease}
.btn:hover,.panel-btn:hover{transform:translateY(-3px);box-shadow:0 7px 25px #ffa50044}
.reveal{opacity:0;transform:translateY(32px);transition:opacity .7s ease,transform .7s ease}
.reveal.visible{opacity:1;transform:translateY(0)}
@media(max-width:850px){.tv-section{grid-template-columns:1fr;padding:23px!important}.tv-visual{min-height:300px}.tv-visual img{max-width:280px}.tv-points{grid-template-columns:1fr 1fr}.nav-new{display:none}}
@media(max-width:520px){.tv-points{grid-template-columns:1fr}.tv-prices>div{min-width:calc(50% - 6px);padding:12px}.tv-prices strong{font-size:22px}.tv-section{margin-top:25px}.tv-visual{min-height:260px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;scroll-behavior:auto!important;transition:none!important}.reveal{opacity:1;transform:none}}

/* Banner interactivo DE8A9.ONLINE */
.de8-banner{position:relative;isolation:isolate;display:grid;grid-template-columns:200px minmax(0,1fr) 225px;gap:24px;align-items:center;padding:23px 28px!important;margin-top:34px;margin-bottom:38px;border:1px solid rgba(221,185,108,.73);border-radius:22px;background:radial-gradient(ellipse at 70% 45%,rgba(199,160,70,.12),transparent 60%),linear-gradient(112deg,#071d26,#07121a 55%,#0e1b20);box-shadow:0 12px 44px rgba(0,0,0,.3),inset 0 0 28px rgba(193,149,64,.055);overflow:hidden}
.de8-banner::before{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(105deg,transparent 26%,rgba(255,208,119,.10) 48%,transparent 58%);transform:translateX(-130%);animation:de8Shine 9s ease-in-out infinite}
@keyframes de8Shine{0%,52%{transform:translateX(-130%)}70%,100%{transform:translateX(130%)}}
.de8-brand{display:flex;flex-direction:column;align-items:center;gap:12px}
.de8-brand-frame{width:155px;height:155px;display:grid;place-items:center;background:white;padding:13px;border-radius:17px;box-shadow:0 0 30px rgba(213,177,103,.2);transform:rotate(-2deg);transition:transform .4s ease}
.de8-banner:hover .de8-brand-frame{transform:rotate(0deg) translateY(-4px)}
.de8-brand-frame img{width:100%;height:100%;object-fit:contain}
.de8-tag{font-size:9px;letter-spacing:1px;color:#efd08e;font-weight:900;white-space:nowrap}
.de8-dot{display:inline-block;width:7px;height:7px;margin-right:4px;border-radius:50%;background:#edbf67;box-shadow:0 0 15px #edbf67;animation:de8Blink 1.8s infinite}
@keyframes de8Blink{50%{opacity:.35}}
.de8-overline{font-size:10px;font-weight:900;letter-spacing:1.6px;color:#e8c581}
.de8-main h2{font-size:clamp(25px,2.65vw,39px);letter-spacing:-1px;line-height:1.08;margin:10px 0 11px;color:#fff}
.de8-main h2 s{text-decoration-color:#ca9f55;text-decoration-thickness:2px;color:#d1d4d3;white-space:nowrap}
.de8-main h2 span{color:#e8bc6d}
.de8-main p{font-size:14px;line-height:1.55;color:#c9d6db;margin:0 0 10px}
.de8-main p strong{color:#fff}
.de8-mystery{font-size:15px;color:#e9eff2;font-weight:700;margin:8px 0}
.de8-mystery strong{color:#edc67c}
.de8-disclaimer{display:block;color:#8fa0a9;font-size:10px;line-height:1.5;margin-top:11px}
.de8-cta{display:flex;gap:13px;align-items:center;justify-content:center;padding:15px 16px;min-height:81px;border-radius:14px;border:1px solid #f4cb70;background:linear-gradient(125deg,#cc9a43,#f2cc79);color:#0b1318;font-size:14px;font-weight:800;box-shadow:0 12px 27px #b6852b33;transition:transform .25s ease,box-shadow .25s ease}
.de8-cta:hover{transform:translateY(-5px);box-shadow:0 17px 34px #d9a64d69}
.de8-cta strong{display:block;font-size:17px}.de8-cta small{display:block;font-size:10px;letter-spacing:1px;margin-top:5px}
.de8-cta-icon{display:grid;place-items:center;width:38px;height:38px;flex:0 0 38px;background:#101c23;color:#f4cc7e;border-radius:50%;font-size:25px}
@media(max-width:1020px){.de8-banner{grid-template-columns:150px minmax(0,1fr);gap:22px}.de8-brand-frame{width:135px;height:135px}.de8-cta{grid-column:2;justify-self:start}}
@media(max-width:640px){.de8-banner{grid-template-columns:1fr;padding:21px!important;text-align:center;gap:16px}.de8-brand-frame{width:122px;height:122px}.de8-cta{grid-column:auto;justify-self:stretch}.de8-main h2{font-size:28px}.de8-brand{gap:10px}}
@media(prefers-reduced-motion:reduce){.de8-banner::before,.de8-dot{animation:none!important}}

/* ROKOLA REPUBLICA — seccion comercial responsive */
.rokola-section{position:relative;margin-top:25px;margin-bottom:48px;padding-top:28px!important;padding-bottom:24px!important;border:1px solid #ba8419;border-radius:25px;background:radial-gradient(ellipse at 85% 0%,rgba(245,163,26,.17),transparent 52%),linear-gradient(135deg,#10111b,#090b13);box-shadow:0 24px 70px #0008;overflow:hidden}
.rokola-head{text-align:center;max-width:800px;margin:0 auto 25px}
.rokola-kicker{display:inline-flex;color:#151008;background:linear-gradient(95deg,#ff9f0e,#ffde60);padding:9px 15px;border-radius:100px;font-weight:900;font-size:11px;letter-spacing:1.1px}
.rokola-head h2{font-size:clamp(29px,4.2vw,53px);line-height:1.08;letter-spacing:-1.5px;margin:17px 0 12px}
.rokola-head h2 span{color:#ffc126}
.rokola-head p{font-size:16px;line-height:1.65;color:#dae0ea;margin:0 auto}
.rokola-banner-frame{max-width:1090px;margin:auto;overflow:hidden;border-radius:19px;border:1px solid #987026;box-shadow:0 12px 42px #0009}
.rokola-banner-frame img{display:block;width:100%;height:auto}
.rokola-footer{text-align:center;padding:21px 0 5px}
.rokola-steps{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-bottom:20px}
.rokola-steps span{border:1px solid #b4863666;background:#ffb4220d;border-radius:100px;padding:10px 16px;font-size:13px;font-weight:800}
.rokola-cta{display:inline-flex;align-items:center;justify-content:center;gap:12px;max-width:100%;min-height:56px;padding:16px 27px;color:#171100;background:linear-gradient(100deg,#ff9a00,#ffe05d);border-radius:100px;font-size:14px;font-weight:900;text-align:center;box-shadow:0 8px 28px #ffae2152;transition:transform .2s ease}
.rokola-cta:hover{transform:translateY(-3px)}
.rokola-footer small{display:block;max-width:740px;margin:15px auto 0;color:#aeb8c8;font-size:11px;line-height:1.5}
@media(max-width:660px){.rokola-section{margin-top:18px;padding:22px 14px!important;border-radius:18px}.rokola-head h2{font-size:31px}.rokola-head p{font-size:14px}.rokola-banner-frame{border-radius:12px}.rokola-steps{gap:8px}.rokola-steps span{font-size:11px;padding:8px 10px}.rokola-cta{width:100%;padding:15px 10px;font-size:12px}}