/* ===== Reset & base ===== */
*{box-sizing:border-box;}
html,body{margin:0;padding:0;background:#070d18;}
body{font-family:'Montserrat',sans-serif;-webkit-font-smoothing:antialiased;color:#eef2f8;line-height:1.6;overflow-x:hidden;}
img,video{max-width:100%;}
a{color:inherit;}
::selection{background:#00D4FF;color:#070d18;}

@keyframes glowPulse{0%,100%{opacity:.45}50%{opacity:.9}}
@keyframes floatY{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}

.wrap{max-width:1160px;margin:0 auto;}
.eyebrow{margin:0 0 18px;font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#00D4FF;}
.h2{margin:0 0 56px;font-size:clamp(1.9rem,3.8vw,2.6rem);font-weight:800;letter-spacing:-.02em;line-height:1.15;color:#fff;max-width:720px;}

/* ===== Buttons ===== */
.btn{display:inline-flex;align-items:center;gap:9px;text-decoration:none;font-weight:700;font-size:1rem;padding:16px 30px;border-radius:12px;border:none;cursor:pointer;font-family:inherit;}
.btn-primary{background:#0A84FF;color:#fff;box-shadow:0 0 30px rgba(10,132,255,.4);transition:background .15s;}
.btn-primary:hover{background:#2a95ff;}
.btn-outline{color:#eef2f8;border:1.5px solid rgba(255,255,255,.18);transition:border-color .15s,color .15s;}
.btn-outline:hover{border-color:#00D4FF;color:#00D4FF;}
.btn-sm{font-size:.9rem;padding:11px 24px;}

/* ===== Nav ===== */
.nav{position:fixed;top:0;left:0;right:0;z-index:100;background:rgba(7,13,24,.78);backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.06);}
.nav .wrap{padding:0 28px;height:72px;display:flex;align-items:center;justify-content:space-between;}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;}
.brand img{width:44px;height:44px;object-fit:contain;}
.brand span{font-size:1.2rem;font-weight:800;letter-spacing:-.02em;color:#fff;}
.brand .accent{color:#00D4FF;}
.nav-links{display:flex;align-items:center;gap:28px;}
.nav-link{color:#9aa5ba;text-decoration:none;font-size:.9rem;font-weight:600;}

/* ===== Hero ===== */
.hero{position:relative;padding:168px 28px 110px;background:radial-gradient(1000px 600px at 78% 12%, rgba(0,212,255,.10), transparent 60%), radial-gradient(700px 500px at 8% 85%, rgba(139,94,60,.12), transparent 65%), #070d18;}
.hero .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center;}
.hero-kicker{margin:0 0 22px;display:inline-flex;gap:10px;align-items:center;font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#00D4FF;}
.hero-kicker span{width:26px;height:2px;background:#00D4FF;display:inline-block;}
.hero h1{margin:0;font-size:clamp(2.3rem,4.8vw,3.5rem);font-weight:800;line-height:1.1;letter-spacing:-.025em;color:#fff;}
.hero h1 .grad{background:linear-gradient(90deg,#0A84FF,#00D4FF);-webkit-background-clip:text;background-clip:text;color:transparent;}
.hero-sub{margin:26px 0 0;font-size:1.15rem;color:#9aa5ba;max-width:520px;}
.hero-sub strong{color:#eef2f8;}
.hero-ctas{display:flex;gap:14px;flex-wrap:wrap;margin-top:38px;}
.hero-fine{margin:26px 0 0;font-size:.85rem;color:#5d6778;}
.wa-dot{width:9px;height:9px;border-radius:50%;background:#25D366;display:inline-block;}
.hero-visual{position:relative;}
.hero-glow{position:absolute;inset:-40px;background:radial-gradient(closest-side, rgba(0,212,255,.14), transparent 70%);animation:glowPulse 5s ease-in-out infinite;pointer-events:none;}
.hero-video{position:relative;width:100%;display:block;border-radius:20px;border:1px solid rgba(0,212,255,.22);box-shadow:0 24px 80px rgba(0,0,0,.6);}

/* ===== Problema (secuencia animada) ===== */
.problema{padding:120px 28px;background:#070d18;border-top:1px solid rgba(255,255,255,.05);}
.problema .wrap{max-width:860px;text-align:center;}
.problema h2{margin:0;font-size:clamp(1.9rem,3.8vw,2.6rem);font-weight:800;letter-spacing:-.02em;line-height:1.15;color:#fff;}
.problema-stage{min-height:320px;display:grid;place-items:center;margin-top:20px;}
.frase{margin:0;font-size:1.3rem;font-weight:700;line-height:1.4;color:#c3ccdd;background:#0e1729;border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:20px 34px;opacity:0;transition:opacity .3s ease;max-width:560px;}
.frase.on{opacity:1;}
.punch{margin:0;font-size:clamp(1.7rem,3.4vw,2.4rem);font-weight:800;line-height:1.3;color:#fff;animation:fadeUp .7s ease both;}
.punch .grad{background:linear-gradient(90deg,#0A84FF,#00D4FF);-webkit-background-clip:text;background-clip:text;color:transparent;}
.final-block{display:flex;flex-direction:column;align-items:center;gap:0;width:100%;}
.final-lead{margin:0 0 34px;font-size:1.3rem;font-weight:800;color:#fff;animation:fadeUp .5s ease both;}
.final-lead .accent{color:#00D4FF;}
.final-list{display:flex;flex-direction:column;align-items:center;gap:10px;}
.final-item{display:flex;flex-direction:column;align-items:center;gap:10px;animation:fadeUp .6s ease both;}
.final-item p{margin:0;font-size:1.08rem;font-weight:700;color:#c3ccdd;background:#0e1729;border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:14px 26px;}
.final-item .arrow{color:#00D4FF;font-weight:800;font-size:1.1rem;}
.final-note{margin:38px 0 0;font-size:1.1rem;color:#9aa5ba;max-width:560px;animation:fadeUp .6s ease both;}
.final-note strong{color:#eef2f8;}
.final-cta{margin-top:34px;display:inline-block;animation:fadeUp .6s ease both;}

/* ===== Espejo (cards) ===== */
.espejo{padding:120px 28px;background:#0a1220;border-top:1px solid rgba(255,255,255,.05);}
.cards-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.cards-2{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;}
.card{background:#0e1729;border:1px solid rgba(255,255,255,.07);border-radius:18px;padding:34px 30px;display:flex;flex-direction:column;gap:16px;transition:border-color .15s;}
.card:hover{border-color:rgba(0,212,255,.35);}
.card-dolor{margin:0;font-size:.88rem;color:#8B9EB8;font-style:italic;}
.card-titulo{margin:0;font-size:1.25rem;font-weight:700;line-height:1.3;color:#fff;}
.card-como{margin:0;font-size:.95rem;color:#9aa5ba;flex-grow:1;}

/* ===== Prueba (caso real) ===== */
.prueba{padding:120px 28px;background:#070d18;}
.prueba-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;}
.prueba-copy{display:flex;flex-direction:column;gap:28px;}
.prueba-label{margin:0 0 8px;font-size:.75rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#8B5E3C;}
.prueba-text{margin:0;color:#c3ccdd;font-size:1.02rem;}
.prueba-cierre{margin:0;font-size:1.02rem;color:#00D4FF;font-weight:700;line-height:1.4;}
.metricas{display:flex;gap:18px;flex-wrap:wrap;margin-top:6px;}
.metrica{flex:1;min-width:130px;background:#0e1729;border:1px solid rgba(0,212,255,.18);border-radius:14px;padding:20px 18px;}
.metrica-valor{margin:0;font-size:1.6rem;font-weight:800;letter-spacing:-.02em;background:linear-gradient(90deg,#0A84FF,#00D4FF);-webkit-background-clip:text;background-clip:text;color:transparent;}
.metrica-label{margin:6px 0 0;font-size:.82rem;color:#9aa5ba;font-weight:600;}
.prueba-media{position:relative;}
.prueba-media-inner{position:relative;padding:0 0 46px 46px;}
.prueba-img{width:100%;display:block;border-radius:20px;border:1px solid rgba(0,212,255,.22);box-shadow:0 24px 80px rgba(0,0,0,.6);}
.prueba-video-box{position:absolute;left:0;bottom:0;width:36%;border-radius:24px;border:5px solid #1a2333;overflow:hidden;background:#000;box-shadow:0 20px 60px rgba(0,0,0,.75);}
.prueba-video-box video{width:100%;display:block;}
.video-header-overlay{position:absolute;top:0;left:0;right:0;height:40px;background:#0a101d;z-index:2;display:flex;align-items:center;padding:0 14px;pointer-events:none;border-bottom:1px solid rgba(255,255,255,.08);}
.vho-brand{display:flex;align-items:center;gap:8px;}
.vho-logo{width:20px;height:20px;background:#8B5E3C;color:#fff;border-radius:5px;display:grid;place-items:center;font-size:10px;font-weight:800;}
.vho-text{display:flex;flex-direction:column;}
.vho-title{font-size:.76rem;font-weight:800;color:#fff;line-height:1;}
.vho-sub{font-size:.44rem;color:#8B5E3C;letter-spacing:.08em;margin-top:2px;font-weight:700;}
.otros-casos{margin-top:72px;align-items:start;}
.tag-pill{margin:0 0 10px;display:inline-block;font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#00D4FF;border:1px solid rgba(0,212,255,.3);padding:4px 12px;border-radius:100px;}
.caso-card{background:#0e1729;border:1px solid rgba(255,255,255,.07);border-radius:16px;padding:26px 26px;display:flex;flex-direction:column;}
.caso-card h3{margin:8px 0 8px;font-size:1.12rem;font-weight:700;color:#fff;}
.caso-card p{margin:0;font-size:.92rem;color:#9aa5ba;}
.caso-card .caso-card-cierre{margin-top:auto;padding-top:14px;font-size:.82rem;font-weight:700;color:#00D4FF;letter-spacing:.02em;}
.caso-card-stats{display:flex;gap:12px;margin-top:auto;padding-top:16px;}
.stat-mini{flex:1;background:rgba(0,212,255,.04);border:1px solid rgba(0,212,255,.18);border-radius:12px;padding:12px 10px;text-align:center;}
.stat-num{display:block;font-size:1.4rem;font-weight:800;letter-spacing:-.02em;background:linear-gradient(90deg,#0A84FF,#00D4FF);-webkit-background-clip:text;background-clip:text;color:transparent;line-height:1.1;}
.stat-lbl{display:block;font-size:.76rem;color:#9aa5ba;font-weight:600;margin-top:4px;line-height:1.25;}
.caso-card-video{width:100%;height:190px;border-radius:12px;overflow:hidden;margin-bottom:16px;border:1px solid rgba(0,212,255,.18);background:#000;}
.caso-card-video video{width:100%;height:100%;object-fit:cover;display:block;}

/* ===== FAQ ===== */
.faq{padding:120px 28px;background:#070d18;border-top:1px solid rgba(255,255,255,.05);}
.faq .wrap{max-width:860px;}
.faq-list{display:flex;flex-direction:column;gap:14px;margin-top:20px;}
.faq-item{background:#0e1729;border:1px solid rgba(255,255,255,.07);border-radius:16px;overflow:hidden;transition:border-color .2s,background .2s;}
.faq-item:hover{border-color:rgba(0,212,255,.3);}
.faq-item.active{border-color:rgba(0,212,255,.45);background:#121d33;}
.faq-question{width:100%;background:none;border:none;padding:22px 28px;display:flex;justify-content:space-between;align-items:center;text-align:left;color:#fff;font-family:inherit;font-size:1.08rem;font-weight:700;cursor:pointer;gap:16px;}
.faq-icon{font-size:1.4rem;color:#00D4FF;font-weight:400;transition:transform .25s ease;line-height:1;}
.faq-item.active .faq-icon{transform:rotate(45deg);}
.faq-answer{max-height:0;overflow:hidden;transition:max-height .35s cubic-bezier(0,1,0,1),padding .35s ease;padding:0 28px;}
.faq-item.active .faq-answer{max-height:300px;padding:0 28px 24px;transition:max-height .35s cubic-bezier(1,0,1,0),padding .35s ease;}
.faq-answer p{margin:0;color:#9aa5ba;font-size:.98rem;line-height:1.65;}

/* ===== Oferta (CTA final) ===== */
.oferta{position:relative;padding:140px 28px;background:radial-gradient(900px 500px at 50% 0%, rgba(0,212,255,.12), transparent 65%), #0a1220;border-top:1px solid rgba(255,255,255,.05);text-align:center;}
.oferta-inner{max-width:760px;margin:0 auto;display:flex;flex-direction:column;align-items:center;}
.oferta-logo{width:140px;height:140px;object-fit:contain;margin-bottom:28px;animation:floatY 7s ease-in-out infinite;}
.oferta h2{margin:0 0 18px;font-size:clamp(2rem,4.5vw,3rem);font-weight:800;letter-spacing:-.025em;line-height:1.12;color:#fff;}
.oferta-sub{margin:0 0 42px;font-size:1.15rem;color:#9aa5ba;max-width:560px;}
.oferta-ctas{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;}
.oferta-tag{margin:44px 0 0;font-size:.82rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#00D4FF;}

/* ===== Footer ===== */
.footer{background:#070d18;border-top:1px solid rgba(255,255,255,.06);padding:34px 28px;}
.footer .wrap{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;font-size:.85rem;color:#5d6778;}
.footer-brand{display:flex;align-items:center;gap:10px;}
.footer-brand img{width:26px;height:26px;object-fit:contain;}
.footer-links{display:flex;gap:24px;}
.footer-link{color:#5d6778;text-decoration:none;transition:color .15s;}
.footer-link:hover{color:#00D4FF;}

/* ===== Legal pages (privacidad / términos) ===== */
.legal-header{padding:160px 28px 56px;background:radial-gradient(900px 500px at 50% 0%, rgba(0,212,255,.08), transparent 65%), #070d18;border-bottom:1px solid rgba(255,255,255,.05);}
.legal-header .wrap{max-width:760px;}
.legal-header h1{margin:0 0 14px;font-size:clamp(2rem,4vw,2.8rem);font-weight:800;letter-spacing:-.02em;color:#fff;}
.legal-updated{margin:0;color:#5d6778;font-size:.88rem;}
.legal-body{padding:64px 28px 120px;background:#070d18;}
.legal-body .wrap{max-width:760px;}
.legal-body h2{margin:44px 0 16px;font-size:1.3rem;font-weight:800;color:#fff;letter-spacing:-.01em;}
.legal-body h2:first-of-type{margin-top:0;}
.legal-body p{margin:0 0 16px;color:#c3ccdd;font-size:1rem;line-height:1.75;}
.legal-body ul{margin:0 0 16px;padding-left:22px;color:#c3ccdd;font-size:1rem;line-height:1.75;}
.legal-body li{margin-bottom:8px;}
.legal-body a{color:#00D4FF;text-decoration:underline;}
.legal-body strong{color:#eef2f8;}

/* ===== Diagnostic widget (modal) ===== */
.sq-diag-overlay{position:fixed;inset:0;z-index:99990;display:none;align-items:center;justify-content:center;background:rgba(7,13,24,.78);backdrop-filter:blur(4px);padding:20px;font-family:'Montserrat',sans-serif;}
.sq-diag-overlay.sq-open{display:flex;}
.sq-diag-box{background:#0e1626;border:1px solid rgba(0,212,255,.18);border-radius:20px;max-width:560px;width:100%;max-height:88vh;overflow-y:auto;padding:34px 30px;position:relative;box-shadow:0 30px 90px rgba(0,0,0,.6);}
.sq-diag-close{position:absolute;top:16px;right:18px;background:none;border:none;color:#5d6778;font-size:22px;cursor:pointer;line-height:1;padding:4px;}
.sq-diag-close:hover{color:#fff;}
.sq-diag-eyebrow{color:#00D4FF;font-size:.78rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin:0 0 8px;}
.sq-diag-progress{display:flex;gap:6px;margin:0 0 24px;}
.sq-diag-dot{height:4px;flex:1;border-radius:4px;background:rgba(255,255,255,.12);}
.sq-diag-dot.sq-done{background:#0A84FF;}
.sq-diag-title{color:#fff;font-size:1.25rem;font-weight:800;margin:0 0 6px;line-height:1.3;}
.sq-diag-note{color:#8B5E3C;font-size:.85rem;font-weight:700;margin:0 0 18px;}
.sq-diag-opts{display:flex;flex-direction:column;gap:10px;margin-bottom:22px;}
.sq-diag-opt{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:12px;border:1.5px solid rgba(255,255,255,.12);color:#dfe6f2;cursor:pointer;font-size:.95rem;font-weight:600;transition:border-color .15s,background .15s;background:rgba(255,255,255,.02);}
.sq-diag-opt:hover{border-color:rgba(0,212,255,.4);}
.sq-diag-opt.sq-sel{border-color:#00D4FF;background:rgba(0,212,255,.08);color:#fff;}
.sq-diag-textarea,.sq-diag-input{width:100%;background:rgba(255,255,255,.04);border:1.5px solid rgba(255,255,255,.14);border-radius:12px;color:#fff;font-family:inherit;font-size:.95rem;padding:14px 16px;margin-bottom:12px;box-sizing:border-box;}
.sq-diag-textarea{min-height:90px;resize:vertical;}
.sq-diag-input::placeholder,.sq-diag-textarea::placeholder{color:#5d6778;}
.sq-diag-input:focus,.sq-diag-textarea:focus{outline:none;border-color:#00D4FF;}
.sq-diag-nav{display:flex;justify-content:space-between;align-items:center;margin-top:8px;gap:12px;}
.sq-diag-btn{border:none;border-radius:12px;padding:14px 26px;font-weight:700;font-size:.95rem;cursor:pointer;font-family:inherit;}
.sq-diag-btn-next{background:#0A84FF;color:#fff;box-shadow:0 0 24px rgba(10,132,255,.35);}
.sq-diag-btn-next:disabled{opacity:.35;cursor:not-allowed;box-shadow:none;}
.sq-diag-btn-back{background:none;color:#9aa5ba;padding:14px 10px;}
.sq-diag-btn-back:disabled{visibility:hidden;}
.sq-diag-hint{color:#5d6778;font-size:.78rem;margin:-8px 0 16px;}
.sq-diag-result{text-align:center;}
.sq-diag-score-num{font-size:3rem;font-weight:800;color:#fff;margin:14px 0 2px;}
.sq-diag-score-label{color:#9aa5ba;font-size:.9rem;margin:0 0 22px;}
.sq-diag-flags{text-align:left;background:rgba(255,255,255,.03);border-radius:14px;padding:18px 20px;margin:0 0 22px;font-size:.92rem;color:#dfe6f2;line-height:2;}
.sq-diag-loading{text-align:center;color:#9aa5ba;padding:30px 0;}
.sq-diag-result-copy{color:#dfe6f2;font-size:.92rem;line-height:1.6;margin:0 0 22px;}
.sq-diag-result-copy a{color:#00D4FF;}

/* ===== Loading splash (mientras cargan los videos) ===== */
#bootSplash{position:fixed;inset:0;background:#070d18;z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;transition:opacity .35s ease;}
#bootSplash.hidden{opacity:0;pointer-events:none;}
#bootSplash img{width:72px;height:72px;object-fit:contain;animation:floatY 2.4s ease-in-out infinite;}
#bootSplash span{font-size:.8rem;color:#5d6778;letter-spacing:.08em;text-transform:uppercase;}

/* ===== Scroll reveal ===== */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease;}
.reveal.in{opacity:1;transform:translateY(0);}

/* ===== Mobile ===== */
@media (max-width:900px){
  .hero .wrap{grid-template-columns:1fr;gap:40px;}
  .prueba-grid{grid-template-columns:1fr;}
  .cards-3, .cards-2{grid-template-columns:1fr;}
}
@media (max-width:760px){
  html,body{overflow-x:hidden;}
  .nav-links .nav-link{display:none;}
  .nav-links .btn{display:none;}
  .hero{padding:110px 20px 60px;}
  .prueba-media-inner{padding:0;display:flex;flex-direction:column;gap:16px;}
  .prueba-video-box{position:static;width:70%;margin:0 auto;}
}