/* Tema Cepex para la tienda (FOSSBilling): misma identidad que www.cepex.com.ve (claro, azul/naranja, Outfit).
   Se carga después de vendor.css y huraga.css; cabecera y pie usan clases cpx-* para no chocar con Bootstrap. */
:root,[data-bs-theme=light]{
  --cpx-bg:#f5f8fe;--cpx-paper:#fff;--cpx-ink:#0b1b46;--cpx-muted:#56628a;--cpx-soft:#2b3866;
  --cpx-blue:#0b3fb5;--cpx-blue-deep:#0a2b80;--cpx-blue-tint:#e6eeff;--cpx-sky:#2aa8ff;
  --cpx-orange:#f5822a;--cpx-orange-hover:#ec741b;--cpx-orange-ink:#c95f0f;--cpx-orange-tint:#fff1e6;
  --cpx-line:#dfe6f5;--cpx-radius:20px;--cpx-wrap:1200px;--cpx-gutter:24px;

  --bs-body-font-family:Outfit,system-ui,-apple-system,sans-serif;
  --bs-body-bg:var(--cpx-bg);--bs-body-color:var(--cpx-ink);--bs-secondary-color:var(--cpx-muted);
  --bs-emphasis-color:var(--cpx-ink);--bs-heading-color:var(--cpx-ink);
  --bs-primary:#0b3fb5;--bs-primary-rgb:11,63,181;
  --bs-primary-text-emphasis:#0a2b80;--bs-primary-bg-subtle:#e6eeff;--bs-primary-border-subtle:#c9d5f0;
  --bs-link-color:#0b3fb5;--bs-link-color-rgb:11,63,181;--bs-link-hover-color:#0a2b80;--bs-link-hover-color-rgb:10,43,128;
  --bs-border-color:#dfe6f5;--bs-border-radius:12px;--bs-border-radius-lg:16px;--bs-border-radius-sm:8px;
  --bs-focus-ring-color:rgba(42,168,255,.35);
  --bs-tertiary-bg:#eef3fd;--bs-secondary-bg:#e9eef9;
}
body{background:var(--cpx-bg);color:var(--cpx-ink);font-family:Outfit,system-ui,sans-serif;font-size:16px;line-height:1.5;overflow-x:hidden}
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6{font-weight:700;letter-spacing:-.02em;color:var(--cpx-ink)}
:focus-visible{outline:3px solid var(--cpx-sky);outline-offset:3px}
svg.cpx-i{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.cpx-wrap{width:min(var(--cpx-wrap),100% - 2*var(--cpx-gutter));margin-inline:auto;position:relative}

/* ===== botones de cabecera/pie (copiados del sitio) ===== */
.cpx-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 20px;border-radius:12px;font-weight:600;font-size:15px;border:0;cursor:pointer;text-decoration:none;white-space:nowrap;transition:transform .15s ease,box-shadow .2s ease,background .2s ease,border-color .2s}
.cpx-btn:active{transform:scale(.97)}
.cpx-btn-ol{border:1.5px solid #c9d5f0;background:#fff;color:var(--cpx-blue)}
.cpx-btn-ol:hover{border-color:var(--cpx-blue);color:var(--cpx-blue)}
.cpx-btn-or{background:var(--cpx-orange);color:#fff;box-shadow:0 10px 24px rgba(245,130,42,.32)}
.cpx-btn-or:hover{background:var(--cpx-orange-hover);color:#fff;box-shadow:0 12px 28px rgba(245,130,42,.42)}

/* ===== barra superior + header ===== */
.cpx-topbar{background:var(--cpx-blue);color:#d8e4ff;font-size:13px}
.cpx-topbar .cpx-wrap{display:flex;justify-content:space-between;gap:16px;padding:9px 0}
.cpx-topbar b{color:#ffc08a;font-weight:600}
.cpx-header{position:sticky;top:0;z-index:1030;background:rgba(245,248,254,.88);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid transparent;transition:border-color .2s,box-shadow .2s}
.cpx-header.scrolled{border-color:var(--cpx-line);box-shadow:0 6px 24px rgba(11,27,70,.06)}
.cpx-nav{display:flex;align-items:center;gap:32px;padding:14px 0}
.cpx-logo img{height:44px;width:auto;display:block}
.cpx-menu{display:flex;gap:4px;font-weight:500;font-size:15px;color:var(--cpx-soft)}
.cpx-item>a{display:flex;align-items:center;gap:6px;padding:10px 12px;border-radius:10px;color:inherit;text-decoration:none}
.cpx-item>a:hover,.cpx-item>a[aria-current]{color:var(--cpx-blue);background:var(--cpx-blue-tint)}
.cpx-sp{flex:1}
.cpx-ctas{display:flex;gap:12px;align-items:center}
.cpx-ctas .dropdown-menu{border:1px solid var(--cpx-line);border-radius:14px;padding:8px;box-shadow:0 24px 50px rgba(11,27,70,.14)}
.cpx-ctas .dropdown-item{border-radius:8px;padding:9px 12px}
.cpx-ctas .dropdown-item:hover{background:var(--cpx-bg);color:var(--cpx-blue)}
.cpx-m-ctas,.cpx-m-client{display:none}
.cpx-burger{display:none;width:46px;height:46px;border-radius:12px;border:1.5px solid var(--cpx-line);background:#fff;align-items:center;justify-content:center;cursor:pointer}
.cpx-burger span,.cpx-burger span:before,.cpx-burger span:after{display:block;width:20px;height:2px;background:var(--cpx-ink);border-radius:2px;position:relative;transition:transform .25s ease,background .2s}
.cpx-burger span:before,.cpx-burger span:after{content:"";position:absolute;left:0}
.cpx-burger span:before{top:-6px}.cpx-burger span:after{top:6px}
.open .cpx-burger span{background:transparent}
.open .cpx-burger span:before{transform:translateY(6px) rotate(45deg)}
.open .cpx-burger span:after{transform:translateY(-6px) rotate(-45deg)}

/* ===== contenido ===== */
.cpx-main{padding-top:36px}
.cpx-main>.container{max-width:var(--cpx-wrap)}
.cpx-public{min-height:60vh;padding-bottom:24px}
.cpx-public .h-100,.cpx-public .h-75{height:auto!important}
.cpx-public .row.h-75{padding:24px 0}
.content-block>h1,.content-block h1.h3,.content-block .h1{font-weight:800;letter-spacing:-.03em}
.breadcrumb{font-size:14px;--bs-breadcrumb-divider-color:var(--cpx-muted)}
.breadcrumb a{color:var(--cpx-muted);text-decoration:none}
.breadcrumb a:hover{color:var(--cpx-blue)}
.breadcrumb-item.active{color:var(--cpx-ink)}

.card{--bs-card-border-color:var(--cpx-line);--bs-card-border-radius:var(--cpx-radius);--bs-card-inner-border-radius:calc(var(--cpx-radius) - 1px);--bs-card-cap-bg:#fff;--bs-card-bg:#fff;box-shadow:0 10px 30px rgba(11,63,181,.05)}
.card-header{border-bottom-color:var(--cpx-line);font-weight:600}
.card-footer{background:#fafcff;border-top-color:var(--cpx-line)}
.list-group{--bs-list-group-border-color:var(--cpx-line);--bs-list-group-action-hover-bg:var(--cpx-bg);--bs-list-group-active-bg:var(--cpx-blue);--bs-list-group-active-border-color:var(--cpx-blue)}

/* botones de Bootstrap con la paleta del sitio: primario naranja, contorno azul */
.btn{border-radius:12px;font-weight:600;padding:.6rem 1.15rem}
.btn-sm{border-radius:9px;padding:.35rem .8rem}
.btn-lg{border-radius:14px}
.btn-primary{--bs-btn-bg:var(--cpx-orange);--bs-btn-border-color:var(--cpx-orange);--bs-btn-hover-bg:var(--cpx-orange-hover);--bs-btn-hover-border-color:var(--cpx-orange-hover);--bs-btn-active-bg:#dd6a14;--bs-btn-active-border-color:#dd6a14;--bs-btn-disabled-bg:var(--cpx-orange);--bs-btn-disabled-border-color:var(--cpx-orange);--bs-btn-color:#fff;--bs-btn-hover-color:#fff;--bs-btn-active-color:#fff;--bs-btn-focus-shadow-rgb:245,130,42;box-shadow:0 8px 20px rgba(245,130,42,.25)}
.btn-outline-primary{--bs-btn-color:var(--cpx-blue);--bs-btn-border-color:#c9d5f0;--bs-btn-bg:#fff;--bs-btn-hover-bg:var(--cpx-blue-tint);--bs-btn-hover-color:var(--cpx-blue);--bs-btn-hover-border-color:var(--cpx-blue);--bs-btn-active-bg:var(--cpx-blue);--bs-btn-active-border-color:var(--cpx-blue);--bs-btn-active-color:#fff;border-width:1.5px}
.btn-secondary{--bs-btn-bg:var(--cpx-blue);--bs-btn-border-color:var(--cpx-blue);--bs-btn-hover-bg:var(--cpx-blue-deep);--bs-btn-hover-border-color:var(--cpx-blue-deep);--bs-btn-color:#fff;--bs-btn-hover-color:#fff}
.btn-dark{--bs-btn-bg:var(--cpx-blue);--bs-btn-border-color:var(--cpx-blue);--bs-btn-hover-bg:var(--cpx-blue-deep);--bs-btn-hover-border-color:var(--cpx-blue-deep);--bs-btn-active-bg:var(--cpx-blue-deep);--bs-btn-color:#fff;--bs-btn-hover-color:#fff}
/* la ficha del plan llega dentro de un <h5>: devolverle peso y tamaño de texto normal */
h5.mb-1:has(ul,p){font-size:1rem;font-weight:400;line-height:1.6;color:var(--cpx-soft);letter-spacing:0}
h5.mb-1:has(ul,p) h1,h5.mb-1:has(ul,p) h2,h5.mb-1:has(ul,p) h3{font-size:1.6rem;font-weight:800;color:var(--cpx-ink);letter-spacing:-.03em;margin-bottom:.5rem}
h5.mb-1:has(ul,p) ul{padding-left:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px 20px;margin-top:12px}
h5.mb-1:has(ul,p) li{display:flex;gap:10px;align-items:flex-start;font-weight:500;color:var(--cpx-ink)}
h5.mb-1:has(ul,p) li:before{content:"✓";flex:none;width:22px;height:22px;border-radius:7px;background:var(--cpx-orange-tint);color:var(--cpx-orange);display:grid;place-items:center;font-size:12px;font-weight:800;margin-top:1px}
.btn-success{--bs-btn-bg:#22c55e;--bs-btn-border-color:#22c55e;--bs-btn-hover-bg:#16a34a;--bs-btn-hover-border-color:#16a34a}
.btn-check:checked+.btn-outline-primary{background:var(--cpx-blue);border-color:var(--cpx-blue);color:#fff}

.form-control,.form-select{border-color:#cfd9ef;border-radius:12px;padding:.6rem .9rem}
.form-control:focus,.form-select:focus{border-color:var(--cpx-sky);box-shadow:0 0 0 4px rgba(42,168,255,.18)}
.form-label{font-weight:500;color:var(--cpx-soft)}
.form-check-input:checked{background-color:var(--cpx-blue);border-color:var(--cpx-blue)}
.input-group>.btn{box-shadow:none}
.cpx-dom-msg{display:none;margin-top:12px;padding:12px 16px;border-radius:12px;font-size:15px;line-height:1.5;max-width:560px}
.cpx-dom-msg.ok{display:block;background:#e8f8ee;color:#14532d;border:1px solid #b7e6c8}
.cpx-dom-msg.no{display:block;background:#fff1e6;color:#8a3d06;border:1px solid #fad3b4}
.cpx-dom-msg a,.card .cpx-dom-msg a[href^="https://wa.me/"]{display:inline;background:none;padding:0;border-radius:0;color:inherit;font-weight:700;text-decoration:underline}
.input-group[style*="max-width: 320px"]{max-width:440px!important}

/* pedido: acordeón de pasos y tarjetas de producto */
.accordion{--bs-accordion-border-color:var(--cpx-line);--bs-accordion-border-radius:var(--cpx-radius);--bs-accordion-inner-border-radius:calc(var(--cpx-radius) - 1px);--bs-accordion-active-bg:var(--cpx-blue-tint);--bs-accordion-active-color:var(--cpx-blue);--bs-accordion-btn-focus-box-shadow:0 0 0 4px rgba(42,168,255,.18);--bs-accordion-bg:#fff}
.accordion-item{box-shadow:0 10px 30px rgba(11,63,181,.04)}
.accordion-button{font-weight:700;font-size:17px}
.accordion-button .badge{background:var(--cpx-orange)!important}
.badge.bg-primary,.badge.text-bg-primary{background:var(--cpx-blue)!important}
.price,.product-price,.card .h2,.card .display-6{color:var(--cpx-blue)}

/* textos legales y "nosotros" (Markdown dentro de una tarjeta) */
.tos .card-body h2,.privacy-policy .card-body h2,.about-us .card-body h2{font-size:1.75rem;font-weight:800;margin-bottom:.75rem}
.tos .card-body h3,.privacy-policy .card-body h3,.about-us .card-body h3{font-size:1.2rem;margin:1.6rem 0 .5rem}
.table{--bs-table-border-color:var(--cpx-line);--bs-table-hover-bg:#f2f6ff}
.table>thead th{color:var(--cpx-muted);font-weight:600;font-size:14px;text-transform:uppercase;letter-spacing:.04em}
.alert{border-radius:14px}
.alert-info{--bs-alert-bg:var(--cpx-blue-tint);--bs-alert-border-color:#c9d5f0;--bs-alert-color:var(--cpx-blue-deep)}
.pagination{--bs-pagination-active-bg:var(--cpx-blue);--bs-pagination-active-border-color:var(--cpx-blue);--bs-pagination-border-color:var(--cpx-line)}
.nav-pills{--bs-nav-pills-link-active-bg:var(--cpx-blue-tint);--bs-nav-pills-link-active-color:var(--cpx-blue)}

/* menú lateral del área de clientes */
.col-3 .nav-link,.col-md-3 .nav-link{color:var(--cpx-soft);border-radius:10px;padding:.6rem .8rem;font-weight:500}
.col-3 .nav-link:hover{background:var(--cpx-blue-tint);color:var(--cpx-blue)}
.col-3 .nav-link.active{background:var(--cpx-blue-tint)}
.col-3 .card{border-radius:var(--cpx-radius)}

/* instrucciones de pago (Pago Móvil / USDT): el enlace de WhatsApp como botón verde */
.invoice-gateway a[href^="https://wa.me/"],.card a[href^="https://wa.me/"]:not(.cpx-wa){display:inline-flex;align-items:center;gap:8px;background:#25d366;color:#fff;padding:10px 18px;border-radius:12px;font-weight:600;text-decoration:none}
.invoice-gateway a[href^="https://wa.me/"]:hover,.card a[href^="https://wa.me/"]:not(.cpx-wa):hover{background:#1ebe5a;color:#fff}

/* ===== pie ===== */
.cpx-footer{margin-top:80px;background:#06112f;color:#b7c4e8;padding:56px 0 28px;font-size:15px}
.cpx-fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:40px}
.cpx-footer .cpx-logo img{height:44px;width:auto}
.cpx-footer p{line-height:1.6;margin-top:16px;max-width:300px;margin-bottom:0}
.cpx-footer h4{color:#fff;font-size:14px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:14px;font-weight:700}
.cpx-footer ul{list-style:none;display:grid;gap:9px;padding:0;margin:0}
.cpx-footer a{color:inherit;text-decoration:none}
.cpx-footer a:hover{color:#fff}
.cpx-ct a,.cpx-ct span{display:flex;align-items:center;gap:10px}
.cpx-ct svg{color:#ffc08a}
.cpx-legal{border-top:1px solid rgba(255,255,255,.1);margin-top:44px;padding-top:22px;display:flex;justify-content:space-between;gap:16px;font-size:14px;color:#8392bd}
.cpx-fwidgets{margin-top:14px;font-size:13px;color:#6576a6}
.cpx-fwidgets>div{justify-content:flex-start!important}
.cpx-fwidgets a{color:#8392bd}
.cpx-wa{position:fixed;right:22px;bottom:22px;z-index:1040;width:58px;height:58px;border-radius:50%;background:#25d366;color:#fff;display:grid;place-items:center;box-shadow:0 14px 30px rgba(37,211,102,.4);transition:transform .2s}
.cpx-wa:hover{transform:scale(1.06);color:#fff}
.cpx-wa svg{width:30px;height:30px;fill:currentColor;stroke:none}
.toast-container{bottom:90px!important}

/* ===== responsive ===== */
@media (max-width:1100px){.cpx-nav{gap:18px}.cpx-item>a{padding:10px 9px}}
@media (max-width:991.98px){
  .cpx-menu,.cpx-ctas{display:none}
  .cpx-burger{display:flex}
  .cpx-nav{justify-content:space-between}
  .open .cpx-menu{display:flex;position:absolute;left:0;right:0;top:100%;flex-direction:column;gap:0;background:#fff;border:1px solid var(--cpx-line);border-radius:18px;padding:10px;box-shadow:0 24px 50px rgba(11,27,70,.16);max-height:calc(100vh - 120px);overflow:auto}
  .cpx-item>a{padding:13px 12px;font-size:17px;font-weight:600;color:var(--cpx-ink)}
  .open .cpx-m-client{display:block;border-top:1px solid var(--cpx-line);margin:6px 0;padding:6px 0}
  .cpx-m-client .nav-link{padding:10px 12px;color:var(--cpx-soft)}
  .open .cpx-m-ctas{display:flex;flex-direction:column;gap:10px;padding:12px}
  .cpx-m-ctas .cpx-btn{width:100%}
  body:has(.cpx-header.open) .cpx-wa{display:none}
  .cpx-fgrid{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  :root{--cpx-gutter:16px;--cpx-radius:18px}
  .cpx-topbar .cpx-wrap span:first-child{display:none}
  .cpx-topbar .cpx-wrap{justify-content:center}
  .cpx-logo img{height:38px}
  .cpx-main{padding-top:20px}
  .cpx-footer{margin-top:56px}
  .cpx-fgrid{grid-template-columns:1fr;gap:28px}
  .cpx-legal{flex-direction:column}
  .cpx-wa{right:16px;bottom:16px;width:54px;height:54px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}