/* =========================================================
   OPOSIPLUS MOBILE RESCUE · Negro/Dorado limpio + responsive
   ========================================================= */
:root{
  --opx-black:#050505;
  --opx-black-2:#090909;
  --opx-panel:#111111;
  --opx-panel-2:#171717;
  --opx-gold:#f5c518;
  --opx-gold-2:#d99a00;
  --opx-cream:#fff7df;
  --opx-soft:#d8d0bd;
  --opx-muted:#9e9684;
  --opx-line:rgba(245,197,24,.22);
  --opx-shadow:0 24px 70px rgba(0,0,0,.46);
}

html,body{max-width:100%;overflow-x:hidden!important;background:#050505!important;color:var(--opx-cream)!important;}
body,.opdl-page,.opx-page,main{
  background:
    radial-gradient(circle at 88% 2%, rgba(245,197,24,.12), transparent 34%),
    linear-gradient(180deg,#050505 0%,#080808 58%,#020202 100%)!important;
  background-size:auto!important;
}
body::before,body::after,.opdl-bg-grid,.opx-bg-grid,.bg-grid,.grid-bg{display:none!important;content:none!important;}

/* Nada de verde/teal/neón como color dominante */
.opx-green,.green,.teal,[class*="green"],[class*="teal"]{border-color:var(--opx-line)!important;}

/* Header limpio */
.site-header,.opx-header,header{
  background:rgba(5,5,5,.96)!important;
  border-bottom:1px solid rgba(245,197,24,.14)!important;
  backdrop-filter:blur(18px);
}
.nav-links a,.opx-links a,header nav a{color:rgba(255,247,223,.72)!important;}
.nav-links a:hover,.opx-links a:hover,header nav a:hover{color:var(--opx-gold)!important;}

/* Botones dorados: texto negro sí o sí */
.btn.primary,.opx-btn.primary,a.primary,button.primary,
.opdl-play,.opx-lead-row button,.opx-download-top,.opx-test-top,
#opxSingleDownloadFloat,#opxMobileDownloadBar{
  background:linear-gradient(135deg,#fff2a8 0%,#f5c518 46%,#d99a00 100%)!important;
  color:#050505!important;
  text-shadow:none!important;
  border:1px solid rgba(255,255,255,.18)!important;
  box-shadow:0 18px 48px rgba(245,197,24,.20),0 8px 24px rgba(0,0,0,.34)!important;
  font-weight:1000!important;
}
.btn.primary *,.opx-btn.primary *,a.primary *,button.primary *,
.opdl-play *,.opx-lead-row button *,.opx-download-top *, .opx-test-top *,
#opxSingleDownloadFloat *,#opxMobileDownloadBar *{color:#050505!important;text-shadow:none!important;}

.btn.ghost,.opx-btn.ghost,.opdl-secondary,a.ghost,button.ghost{
  background:rgba(12,12,12,.88)!important;
  color:var(--opx-cream)!important;
  border:1px solid rgba(245,197,24,.34)!important;
  text-shadow:none!important;
}

/* Matar duplicados antiguos del botón flotante */
.opx-floating-download,.opx-download-button,.opx-sticky-download,.download-floating,.floating-download,.brand-download-float{
  display:none!important;
}

#opxMobileDownloadBar{
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:9999;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:54px;
  padding:0 24px;
  border-radius:999px;
  text-decoration:none!important;
  text-transform:uppercase;
  letter-spacing:.05em;
  font-size:.92rem;
}

/* Arreglar bloque “Elige cómo empezar” */
.opx-start-choice{text-align:center!important;max-width:1180px!important;margin-inline:auto!important;}
.opx-start-choice p{margin-inline:auto!important;}
.opx-start-choice .grid2,.opx-start-choice .grid3,.opx-start-choice .cards,.opx-start-choice .opx-grid,.opx-start-choice .feature-grid{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(220px,280px))!important;
  justify-content:center!important;
  gap:18px!important;
}
.opx-start-choice article,.opx-start-choice .card,.opx-start-choice .opx-card{
  text-align:left!important;
}

@media (max-width:760px){
  body{padding-bottom:0!important;}
  .site-header,.opx-header,header{position:sticky!important;top:0!important;z-index:9990!important;}

  .site-header .wrap,header .wrap,.opx-header .wrap,
  .site-header .container,header .container,.opx-header .container,
  .site-header .inner,header .inner,.opx-header .inner{
    width:100%!important;max-width:100%!important;
    padding:8px 10px!important;
    display:grid!important;
    grid-template-columns:auto 1fr!important;
    align-items:center!important;
    gap:8px!important;
  }

  .brand,.opx-logo,.logo,.footer-brand{min-width:0!important;gap:8px!important;}
  .brand img,.opx-logo img,.logo img{width:38px!important;height:38px!important;object-fit:contain!important;border-radius:10px!important;}
  .brand strong,.brand span,.opx-logo strong,.opx-logo span,.logo strong,.logo span{
    font-size:15px!important;letter-spacing:.12em!important;white-space:nowrap!important;max-width:130px!important;overflow:hidden!important;text-overflow:ellipsis!important;
  }
  .brand em,.brand small,.opx-logo em,.opx-logo small,.logo em,.logo small{display:none!important;}

  .nav-links,.opx-links,header nav:not(.keep-mobile-nav){display:none!important;}
  .header-actions,.opx-actions-top,.top-actions{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:7px!important;
    min-width:0!important;
    width:100%!important;
  }
  .header-actions a,.opx-actions-top a,.top-actions a,.opx-download-top,.opx-test-top{
    min-height:42px!important;
    padding:0 11px!important;
    border-radius:999px!important;
    font-size:11px!important;
    line-height:1.05!important;
    letter-spacing:.04em!important;
    white-space:nowrap!important;
    max-width:132px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .header-actions a:not(.opx-download-top):not(.opx-test-top),
  .opx-actions-top a:not(.opx-download-top):not(.opx-test-top),
  .top-actions a:not(.opx-download-top):not(.opx-test-top){display:none!important;}

  /* Nada de botón flotante en móvil: estaba duplicando y tapando contenido */
  #opxSingleDownloadFloat,#opxMobileDownloadBar{display:none!important;}

  .hero,.opx-hero,.heroSection,.opdl-hero,.compact-hero,
  .heroGrid,.opx-hero-grid,.opdl-content,.split,.grid2,.grid3,.cards,.serviceMatrix,.opx-grid,.feature-grid,.steps,.experience-grid,.post-grid,.opdl-proof,.kpi{
    grid-template-columns:1fr!important;
    max-width:100%!important;
  }

  .hero,.opx-hero,.heroSection,.opdl-hero{padding-top:34px!important;padding-bottom:26px!important;}
  .hero,.section,.cta-band,.article-layout,.opx-section,.opdl-hero,.opdl-story,.opdl-final{
    width:min(100% - 24px,1180px)!important;
    margin-inline:auto!important;
  }

  h1,.hero h1,.opx-hero h1,.heroSection h1,.opdl-copy h1{
    font-size:clamp(3.2rem,18vw,5.25rem)!important;
    line-height:.90!important;
    letter-spacing:-.055em!important;
    max-width:100%!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
  }
  h2{font-size:clamp(2.15rem,12vw,3.9rem)!important;line-height:.95!important;}
  p,.lead,.opx-lead,.opdl-lead{font-size:1.04rem!important;line-height:1.52!important;}

  /* Método PIKI y tarjetas: una debajo de otra, no 4 columnas comprimidas */
  .method-grid,.methodGrid,.piki-grid,.pikiGrid,.piki-method,.piki-cards,.opx-method-grid,.opx-piki-grid,.opdl-method{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:14px!important;
    width:100%!important;
    max-width:100%!important;
  }
  .method-grid > *, .methodGrid > *, .piki-grid > *, .pikiGrid > *, .piki-method > *, .piki-cards > *, .opx-method-grid > *, .opx-piki-grid > *, .opdl-method > *,
  .card,.opx-card,.service,.articleCard,.feature-card,.experience-grid article,.steps article{
    min-width:0!important;
    width:100%!important;
    max-width:100%!important;
    overflow:visible!important;
    white-space:normal!important;
  }
  .method-grid h3,.methodGrid h3,.piki-grid h3,.pikiGrid h3,.piki-method h3,.opx-method-grid h3,.opx-piki-grid h3,
  .card h3,.opx-card h3,.service b,.feature-card h3{
    white-space:normal!important;
    overflow-wrap:break-word!important;
    word-break:normal!important;
  }

  .hero-actions,.cta-actions,.opdl-actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:12px!important;
    width:100%!important;
  }
  .hero-actions a,.cta-actions a,.opdl-actions a,.btn.big{
    width:100%!important;
    min-height:58px!important;
    justify-content:center!important;
  }

  .trust-row{display:flex!important;gap:10px!important;align-items:flex-start!important;justify-content:flex-start!important;overflow-x:auto!important;padding-bottom:8px!important;scroll-snap-type:none!important;}
  .trust-row span{flex:0 0 auto!important;}

  .hero-panel,.opx-hero-card,.opdl-device{margin-top:18px!important;min-height:auto!important;border-radius:28px!important;}
  .opdl-device{width:100%!important;}

  .opx-start-choice .grid2,.opx-start-choice .grid3,.opx-start-choice .cards,.opx-start-choice .opx-grid,.opx-start-choice .feature-grid{
    grid-template-columns:1fr!important;
  }
}

@media (max-width:420px){
  .brand strong,.brand span,.opx-logo strong,.opx-logo span,.logo strong,.logo span{max-width:112px!important;font-size:14px!important;}
  .header-actions a,.opx-download-top,.opx-test-top{font-size:10px!important;padding:0 9px!important;max-width:118px!important;}
}