/* ============================================================
 * ReDi Systems Theme Styles
 * ============================================================ */

/* ===== VARIABLES GLOBALES ===== */
:root {
    --wps-primary: #2563eb;
    --wps-primary-rgb: 37, 99, 235;
    --wps-primary-dark: #1d4ed8;
    --wps-primary-light: #dbeafe;
    --wps-font-family: system-ui, -apple-system, sans-serif;
    --wps-transition: all 0.3s ease;
    /* Front-page vars */
    --blue:#1a56db;
    --blue-dark:#1340b0;
    --blue-mid:#2563eb;
    --blue-light:#dbeafe;
    --blue-faint:#f0f5ff;
    --ink:#0f172a;
    --ink2:#334155;
    --muted:#64748b;
    --border:#e2e8f0;
    --white:#ffffff;
    --green:#10b981;
    --green-light:#d1fae5;
    --radius:16px;
    --radius-sm:10px;
    --shadow:0 8px 32px rgba(15,23,42,.08);
}

/* ===== RESET BASE ===== */
html{scroll-behavior:smooth}
body {
    font-family:'Plus Jakarta Sans',system-ui,sans-serif;
    color:var(--ink);
    background:var(--white);
    line-height:1.65;
    overflow-x: hidden;
}

img {
    max-width: 100%;
    height: auto;
}

/* ===== NAV ===== */
.navbar{backdrop-filter:blur(12px);background:rgba(255,255,255,.95)!important;border-bottom:1px solid var(--border);box-shadow:0 1px 8px rgba(0,48,135,.06);padding:.65rem 0}
.navbar-brand{font-family:var(--wps-font-family);font-size:1.25rem;font-weight:700;color:#0055B7!important;letter-spacing:.015em}
.nav-link{font-size:.88rem;font-weight:500;color:var(--ink2)!important;transition:color .2s;padding:.5rem .85rem}
.nav-link:hover{color:#0055B7!important}
.btn-nav{background:#0055B7;color:#fff!important;padding:.42rem 1.1rem;border-radius:var(--radius-sm);font-weight:500;font-size:.85rem;transition:all .2s;text-decoration:none}
.btn-nav:hover{background:#003d82!important;color:#fff!important}

/* ===== HERO ===== */
.hero{min-height:90vh;display:flex;align-items:center;background:linear-gradient(160deg,rgba(10,25,80,.92) 0%,rgba(20,50,130,.82) 50%,rgba(15,40,110,.78) 100%),url(https://redi-systems.com/wp-content/uploads/2026/06/hero-bg.jpg);background-size:cover;background-position:top center;position:relative;overflow:hidden;padding:6rem 0 4rem}
.hero::before{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");pointer-events:none}
.hero-tag{display:inline-flex;align-items:center;gap:.5rem;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.15);color:rgba(255,255,255,.85);font-size:.78rem;font-weight:500;padding:.35rem .85rem;border-radius:100px;margin-bottom:1.5rem;letter-spacing:.04em;text-transform:uppercase}
.hero-pulse{width:6px;height:6px;border-radius:50%;background:#4ade80;animation:pulse 2s infinite;display:inline-block}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}
.hero h1{font-family:var(--wps-font-family);font-size:clamp(1.9rem,7.5vw,3.6rem);color:#fff;line-height:1.1;letter-spacing:-.03em;margin-bottom:1.25rem}
.hero h1 em{font-style:italic;color:#93c5fd}
.hero-sub{font-size:1.05rem;color:rgba(255,255,255,.7);margin-bottom:2.5rem;line-height:1.7}
.hero-stats{display:flex;gap:2.5rem;margin-top:3rem;padding-top:2rem;border-top:1px solid rgba(255,255,255,.1);flex-wrap:wrap}
.stat-num{font-family:var(--wps-font-family);font-size:2.2rem;color:#fff;line-height:1}
.stat-label{font-size:.78rem;color:rgba(255,255,255,.5);margin-top:.25rem;text-transform:uppercase;letter-spacing:.05em}
.hero-cards{display:flex;flex-direction:column;gap:1rem}
.hcard{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:var(--radius);padding:1.1rem 1.4rem;backdrop-filter:blur(8px);animation:float 6s ease-in-out infinite}
.hcard:nth-child(2){animation-delay:-2s;margin-left:1.5rem}
.hcard:nth-child(3){animation-delay:-4s;margin-left:.75rem}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.hc-label{font-size:.72rem;color:rgba(255,255,255,.5);text-transform:uppercase;letter-spacing:.06em;margin-bottom:.35rem}
.hc-value{font-size:1rem;font-weight:600;color:#fff}
.hc-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:.45rem}
.dot-g{background:#4ade80}.dot-b{background:#60a5fa}.dot-a{background:#fbbf24}

/* ===== BUTTONS HERO ===== */
.btn-hero-primary{background:#fff;color:var(--blue);padding:.8rem 1.8rem;border-radius:var(--radius-sm);font-weight:700;font-size:.95rem;text-decoration:none;transition:all .2s;border:2px solid #fff;display:inline-block}
.btn-hero-primary:hover{background:transparent;color:#fff}
.btn-hero-ghost{background:transparent;color:#fff;padding:.8rem 1.8rem;border-radius:var(--radius-sm);font-weight:500;font-size:.95rem;text-decoration:none;transition:all .2s;border:2px solid rgba(255,255,255,.3);display:inline-block}
.btn-hero-ghost:hover{border-color:#fff;background:rgba(255,255,255,.08);color:#fff}

/* ===== SECTIONS ===== */
section{padding:5rem 0}
.section-tag{display:inline-block;font-size:.73rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--blue);margin-bottom:.6rem}
.section-title{font-family:var(--wps-font-family);font-size:clamp(1.8rem,3.5vw,2.6rem);line-height:1.15;letter-spacing:-.025em;color:var(--ink);margin-bottom:.85rem}
.section-sub{font-size:1rem;color:var(--muted);max-width:540px}
.bg-faint{background:var(--blue-faint)}
.bg-ink{background:var(--ink)}

/* ===== CARDS (Capabilities) ===== */
.cap-card{background:var(--white);border:1px solid var(--border);border-radius:var(--radius);padding:1.75rem;transition:all .25s;height:100%}
.cap-card:hover{border-color:var(--blue);box-shadow:0 8px 32px rgba(26,86,219,.1);transform:translateY(-3px)}
.cap-icon{width:46px;height:46px;border-radius:10px;background:var(--blue-light);display:flex;align-items:center;justify-content:center;margin-bottom:1.1rem;flex-shrink:0}
.cap-icon i{color:var(--blue);font-size:1.15rem}
.cap-title{font-weight:600;font-size:1rem;margin-bottom:.4rem;color:var(--ink)}
.cap-desc{font-size:.875rem;color:var(--muted);line-height:1.6;margin:0}

/* ===== PLANS ===== */
.plan-card{border:1.5px solid var(--border);border-radius:var(--radius);padding:2rem;position:relative;display:flex;flex-direction:column;height:100%;background:var(--white);transition:all .25s}
.plan-card:hover{border-color:var(--blue);box-shadow:0 12px 40px rgba(26,86,219,.1)}
.plan-card.featured{border-color:var(--blue);background:var(--blue-faint)}
.plan-badge{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:var(--blue);color:#fff;font-size:.7rem;font-weight:700;padding:.28rem .9rem;border-radius:100px;text-transform:uppercase;letter-spacing:.06em;white-space:nowrap}
.plan-name{font-family:var(--wps-font-family);font-size:1.5rem;color:var(--ink);margin-bottom:.3rem}
.plan-desc{font-size:.875rem;color:var(--muted);margin-bottom:1.4rem}
.plan-price{font-family:var(--wps-font-family);font-size:2rem;color:var(--blue);margin-bottom:1.4rem}
.plan-price small{font-family:'Plus Jakarta Sans',sans-serif;font-size:.85rem;color:var(--muted);font-weight:400}
.plan-features{list-style:none;margin-bottom:2rem;flex:1;padding:0}
.plan-features li{font-size:.875rem;color:var(--ink2);padding:.4rem 0;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:.55rem}
.plan-features li:last-child{border-bottom:none}
.plan-check{color:var(--blue);flex-shrink:0;font-size:.8rem}
.plan-cta{display:block;text-align:center;background:var(--blue);color:#fff;padding:.75rem;border-radius:var(--radius-sm);font-weight:600;font-size:.9rem;text-decoration:none;transition:all .2s;border:1.5px solid var(--blue)}
.plan-cta:hover{background:var(--blue-dark);border-color:var(--blue-dark);color:#fff}
.plan-card:not(.featured) .plan-cta{background:transparent;color:var(--blue)}
.plan-card:not(.featured) .plan-cta:hover{background:var(--blue);color:#fff}

/* ===== SOLUTIONS ===== */
.sol-card{border:1px solid rgba(255,255,255,.1);border-radius:var(--radius);padding:2rem;transition:all .25s;height:100%}
.sol-card:hover{border-color:rgba(255,255,255,.3);background:rgba(255,255,255,.04)}
.sol-num{font-family:var(--wps-font-family);font-size:2.5rem;color:rgba(255,255,255,.07);line-height:1;margin-bottom:.6rem}
.sol-title{font-weight:600;font-size:1rem;color:#fff;margin-bottom:.45rem}
.sol-desc{font-size:.875rem;color:rgba(255,255,255,.5);line-height:1.65;margin:0}

/* ===== AUDIENCE ===== */
.aud-chip{background:var(--blue-faint);border:1px solid var(--blue-light);border-radius:var(--radius);padding:1.25rem 1rem;text-align:center;transition:all .2s;cursor:default}
.aud-chip:hover{background:var(--blue-light);border-color:var(--blue)}
.aud-icon{font-size:1.5rem;margin-bottom:.6rem;display:block;color:var(--blue)}
.aud-label{font-size:.85rem;font-weight:600;color:var(--ink2);margin:0}

/* ===== PORTFOLIO ===== */
.port-card{border:1px solid var(--border);border-radius:var(--radius);background:var(--white);overflow:hidden;transition:all .25s;height:100%}
.port-card:hover{border-color:var(--blue);box-shadow:var(--shadow)}
.port-badge{display:inline-block;background:var(--blue-light);color:var(--blue);font-size:.72rem;font-weight:700;padding:.25rem .65rem;border-radius:100px;margin-bottom:.75rem}
.port-title{font-weight:600;font-size:1rem;color:var(--ink);margin-bottom:.35rem}
.port-sub{font-size:.85rem;color:var(--muted);margin:0}

/* ===== ABOUT ===== */
.about-num{background:var(--white);border:1px solid var(--border);border-radius:var(--radius);padding:1.4rem}
.about-num-val{font-family:var(--wps-font-family);font-size:2.2rem;color:var(--blue);line-height:1}
.about-num-label{font-size:.75rem;color:var(--muted);margin-top:.3rem;text-transform:uppercase;letter-spacing:.05em}

/* ===== TESTIMONIALS ===== */
.testi-card{background:var(--white);border:1px solid var(--border);border-radius:var(--radius);padding:1.75rem;height:100%}
.testi-text{font-size:.9rem;color:var(--ink2);line-height:1.7;margin-bottom:1rem;font-style:italic}
.testi-name{font-weight:600;font-size:.9rem;color:var(--ink)}
.testi-role{font-size:.8rem;color:var(--muted)}

/* ===== FAQ ===== */
.accordion-item{border:1px solid var(--border)!important;border-radius:var(--radius)!important;overflow:hidden;margin-bottom:.75rem}
.accordion-button{font-weight:600;font-size:.95rem;color:var(--ink);background:var(--white)}
.accordion-button:not(.collapsed){color:var(--blue);background:var(--blue-faint);box-shadow:none}
.accordion-button:focus{box-shadow:none}

/* ===== CURSOS DIGITALES ===== */
.cursos-section{padding:5rem 0;background:var(--blue-faint)}
.curso-card-img{height:120px;object-fit:contain;background:var(--blue-faint)}
.curso-card-placeholder{height:120px;display:flex;align-items:center;justify-content:center;background:var(--blue-faint)}
.curso-body{padding:.4rem .5rem .5rem;text-align:center}
.curso-title{font-size:.8rem;font-weight:600;margin-bottom:2px;color:var(--ink)}
.curso-price{font-size:1.1rem;color:var(--blue)}
.curso-paq-bg{background:linear-gradient(135deg,var(--blue),var(--blue-dark))}
.curso-paq-title{font-size:.85rem;color:#fff}
.curso-paq-price{font-size:1.2rem;color:#fff}

/* ===== CONTACT ===== */
.contact-card{background:var(--white);border:1px solid var(--border);border-radius:var(--radius);padding:2rem}
.contact-icon{width:42px;height:42px;border-radius:10px;background:var(--blue-light);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.contact-icon i{color:var(--blue)}
.form-control,.form-select{border-radius:var(--radius-sm)!important;border-color:var(--border);font-size:.9rem;padding:.65rem .9rem}
.form-control:focus,.form-select:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(26,86,219,.1)}
.btn-brand{background:var(--blue);color:#fff;border-radius:var(--radius-sm);padding:.75rem 1.5rem;font-weight:600;border:none;transition:all .2s}
.btn-brand:hover{background:var(--blue-dark);color:#fff}
.btn-ghost{background:transparent;color:var(--blue);border:1.5px solid var(--blue);border-radius:var(--radius-sm);padding:.75rem 1.5rem;font-weight:600;transition:all .2s;display:inline-block;text-decoration:none}
.btn-ghost:hover{background:var(--blue);color:#fff}

/* ===== CTA FINAL ===== */
.cta-final{background:linear-gradient(135deg,var(--blue-dark),var(--blue));padding:6rem 0;text-align:center}
.cta-final h2{font-family:var(--wps-font-family);font-size:clamp(1.9rem,4vw,2.8rem);color:#fff;margin-bottom:1rem;letter-spacing:-.025em}
.cta-final p{font-size:1rem;color:rgba(255,255,255,.7);margin-bottom:2.5rem}

/* ===== FOOTER ===== */
footer{background:var(--ink);padding:3rem 0}
.footer-logo{font-family:var(--wps-font-family);font-size:1.2rem;color:#fff}
.footer-link{color:rgba(255,255,255,.45);text-decoration:none;font-size:.875rem;transition:color .2s}
.footer-link:hover{color:#fff}
.footer-tagline{font-style:italic;color:rgba(255,255,255,.4)}
.footer-sub{font-size:.8rem;color:rgba(255,255,255,.35);margin-top:.3rem}
.footer-copy{font-size:.8rem;color:rgba(255,255,255,.3)}

/* ===== WHATSAPP FAB ===== */
.wa-fab{position:fixed;bottom:22px;right:22px;z-index:9999;background:#25D366;color:#fff;width:54px;height:54px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px rgba(37,211,102,.4);text-decoration:none;transition:transform .2s,box-shadow .2s;font-size:1.4rem}
.wa-fab:hover{transform:scale(1.1);box-shadow:0 8px 24px rgba(37,211,102,.5);color:#fff}

/* ===== SCROLL TOP ===== */
#scrollTop{position:fixed;bottom:82px;right:22px;z-index:9998;width:44px;height:44px;background:var(--blue);color:#fff;border:none;border-radius:50%;display:none;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 12px rgba(15,23,42,.18);transition:background .2s}
#scrollTop:hover{background:var(--blue-dark)}

/* ===== ANIMATIONS ===== */
.fade-up{opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .6s ease}
.fade-up.visible{opacity:1;transform:none}

/* ===== PILLS ===== */
.pill{display:inline-flex;align-items:center;gap:.4rem;padding:.35rem .75rem;border:1px solid var(--border);border-radius:100px;background:#fff;font-weight:500;color:var(--muted);font-size:.82rem}

/* ===== PLAN IMG ===== */
.plan-img-wrap{width:100%;height:180px;border-radius:var(--radius-sm);overflow:hidden;margin-bottom:1.2rem}
.plan-img{width:100%;height:100%;object-fit:cover;object-position:top center;cursor:pointer}

/* ===== ABOUT SERVICE CHIPS ===== */
.service-chip{font-weight:600;font-size:.9rem}

/* ===== FORMULARIO FRONTEND ===== */
.wps-form-wrapper {
    max-width: 900px;
    margin: 0 auto;
    padding: 2rem 1rem;
}

.wps-form {
    background: #ffffff;
    border-radius: 16px;
    padding: 2.5rem;
    box-shadow: 0 4px 24px rgba(0,0,0,0.08);
}

.wps-section-title {
    color: #1e293b;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.wps-section-title i {
    color: var(--wps-primary);
}

.wps-form .form-control:focus,
.wps-form .form-select:focus {
    border-color: var(--wps-primary);
    box-shadow: 0 0 0 3px rgba(var(--wps-primary-rgb), 0.15);
}

.wps-form .form-control-lg,
.wps-form .form-select-lg {
    border-radius: 10px;
    padding: 0.75rem 1rem;
}

.wps-form .input-group-text {
    border-radius: 10px;
    background: #f1f5f9;
    border-color: #e2e8f0;
}

/* Color picker input */
input[type="color"].form-control-color {
    height: 48px;
    padding: 4px;
    cursor: pointer;
}

.color-hex {
    font-family: 'Courier New', monospace;
    font-size: 0.9rem;
}

/* ===== FORM MESSAGE ===== */
.wps-form-message {
    display: none;
    padding: 1rem 1.5rem;
    border-radius: 12px;
    margin-top: 1.5rem;
    animation: slideDown 0.3s ease-out;
}

.wps-form-message.success {
    display: block;
    background: #dcfce7;
    border: 1px solid #86efac;
    color: #166534;
}

.wps-form-message.error {
    display: block;
    background: #fef2f2;
    border: 1px solid #fca5a5;
    color: #991b1b;
}

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ===== HERO SECTIONS ===== */
.wps-hero {
    position: relative;
}

.wps-hero-card {
    transition: var(--wps-transition);
}

.wps-hero-card:hover {
    transform: translateY(-5px);
}

/* ===== WHATSAPP FLOTANTE ===== */
.wps-whatsapp-float {
    position: fixed;
    bottom: 24px;
    right: 24px;
    width: 60px;
    height: 60px;
    background: #25d366;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    box-shadow: 0 4px 16px rgba(37, 211, 102, 0.4);
    z-index: 9999;
    transition: var(--wps-transition);
    text-decoration: none;
}

.wps-whatsapp-float:hover {
    background: #20bd5a;
    transform: scale(1.1);
    color: #fff;
    box-shadow: 0 6px 24px rgba(37, 211, 102, 0.5);
}

/* Segundo botón flotante (agencia) */
.wps-whatsapp-float-agencia {
    position: fixed;
    bottom: 96px;
    right: 24px;
    width: 60px;
    height: 60px;
    background: var(--wps-primary);
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    box-shadow: 0 4px 16px rgba(var(--wps-primary-rgb), 0.4);
    z-index: 9998;
    transition: var(--wps-transition);
    text-decoration: none;
}

.wps-whatsapp-float-agencia:hover {
    transform: scale(1.1);
    color: #fff;
    box-shadow: 0 6px 24px rgba(var(--wps-primary-rgb), 0.5);
}

@media (max-width: 768px) {
    .wps-whatsapp-float-agencia {
        width: 44px;
        height: 44px;
        font-size: 18px;
        bottom: 80px;
        right: 14px;
    }
}

/* ===== DEMO NOTICE BAR ===== */
.wps-demo-notice {
    position: sticky;
    top: 0;
    z-index: 9998;
    font-size: 0.85rem;
}

.wps-demo-notice .btn-sm {
    font-size: 0.8rem;
}

/* ===== CARDS ===== */
.card {
    border-radius: 12px;
    transition: var(--wps-transition);
}

.card:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 30px rgba(0,0,0,0.1) !important;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 768px) {
    .wps-form {
        padding: 1.5rem;
    }

    .wps-hero {
        min-height: 70vh !important;
    }

    .wps-hero h1 {
        font-size: 2rem !important;
    }

    .wps-form .row > [class*="col-"] {
        margin-bottom: 0.5rem;
    }

    .wps-whatsapp-float {
        width: 50px;
        height: 50px;
        font-size: 22px;
        bottom: 16px;
        right: 16px;
    }
}

/* ===== LOADING SPINNER ===== */
.wps-spinner {
    display: inline-block;
    width: 1.2rem;
    height: 1.2rem;
    border: 2px solid rgba(255,255,255,0.3);
    border-radius: 50%;
    border-top-color: #fff;
    animation: spin 0.6s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

/* ===== ACCESIBILIDAD ===== */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border-width: 0;
}

/* ===== BOTONES PERSONALIZADOS ===== */
.btn {
    border-radius: 10px;
    font-weight: 600;
    transition: var(--wps-transition);
}

.btn-lg {
    padding: 0.75rem 1.75rem;
}

.btn:hover {
    transform: translateY(-1px);
}

/* ===== TABLAS (horarios) ===== */
.table-borderless td {
    padding: 0.5rem 0;
}

/* ============================================================
 * ESTILOS PROMO /paginas-webs — Integrados Mayo 2026
 * ============================================================ */

/* === Variables promocionales === */
:root {
  --azul:#4F8CFF;
  --azul2:#3474E6;
  --azul-suave:#EAF2FF;
  --texto:#0F172A;
  --gris:#64748B;
  --linea:#E2E8F0;
  --fondo:#F8FAFC;
  --verde:#16A34A;
}

/* === Fuentes promocionales === */
.font-display {
  font-family: 'Anton', sans-serif;
  letter-spacing: .3px;
}

/* === Hero promocional === */
.wps-hero {
  min-height: auto;
  display: flex;
  align-items: center;
  background:
    radial-gradient(circle at 15% 15%, rgba(79,140,255,.18), transparent 32%),
    radial-gradient(circle at 90% 20%, rgba(79,140,255,.12), transparent 30%),
    linear-gradient(180deg, #FFFFFF 0%, #F8FAFC 100%);
  position: relative;
  overflow: hidden;
  padding: 80px 0 50px;
}

.wps-hero-title {
  font-family: 'Anton', sans-serif;
  font-size: clamp(3rem, 7vw, 6.8rem);
  line-height: .92;
  margin-top: 18px;
  color: var(--texto);
}
.wps-hero-title span {
  color: var(--azul);
  display: block;
}
.wps-hero-text {
  color: var(--gris);
  font-size: 1.18rem;
  max-width: 680px;
  margin-top: 20px;
  line-height: 1.65;
}
.wps-hero-stats {
  display: flex;
  gap: 2.5rem;
  margin-top: 2.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--linea);
  flex-wrap: wrap;
}
.wps-hero-stats .stat-num {
  font-family: 'Anton', sans-serif;
  font-size: 2.2rem;
  color: var(--azul2);
  line-height: 1;
}
.wps-hero-stats .stat-label {
  font-size: .78rem;
  color: var(--gris);
  margin-top: .25rem;
  text-transform: uppercase;
  letter-spacing: .05em;
}

/* === Badge promocional === */
.badge-promo {
  display: inline-flex;
  padding: .48rem .85rem;
  border-radius: 999px;
  background: var(--azul-suave);
  border: 1px solid rgba(79,140,255,.22);
  color: var(--azul2);
  font-weight: 900;
  font-size: .88rem;
}

/* === Hero card (price card flotante) === */
.wps-hero-card {
  background: #fff;
  border: 1px solid rgba(79,140,255,.25);
  border-radius: 30px;
  padding: 34px;
  box-shadow: 0 24px 60px rgba(79,140,255,.14);
  position: relative;
}

/* === Price label === */
.price-label {
  text-transform: uppercase;
  color: var(--azul2);
  font-weight: 900;
  letter-spacing: .08em;
  font-size: .8rem;
}

/* === Price === */
.price {
  font-family: 'Anton', sans-serif;
  font-size: 5.6rem;
  line-height: 1;
  margin: 12px 0 0;
  color: var(--azul);
}
.price small {
  font-family: 'Inter', sans-serif;
  font-size: 1rem;
  color: var(--gris);
  font-weight: 800;
}

/* === Urgency box === */
.urgency-box {
  background: #FFF7ED;
  border: 1px solid #FED7AA;
  color: #9A3412;
  border-radius: 18px;
  padding: 14px 16px;
  font-weight: 800;
  margin-top: 18px;
  font-size: .85rem;
}

/* === Feature grid === */
.wps-feature-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 12px;
}
.feature-item {
  background: #fff;
  border: 1px solid var(--linea);
  border-radius: 16px;
  padding: 14px 16px;
  font-weight: 800;
  box-shadow: 0 8px 22px rgba(15,23,42,.05);
  font-size: .9rem;
}

/* === Botones promocionales === */
.wps-btn-main {
  background: var(--azul);
  color: #fff;
  border: none;
  border-radius: 16px;
  padding: 15px 22px;
  font-weight: 900;
  box-shadow: 0 16px 35px rgba(79,140,255,.22);
  transition: all .2s;
}
.wps-btn-main:hover {
  background: var(--azul2);
  color: #fff;
  transform: translateY(-2px);
}
.wps-btn-ghost {
  background: #fff;
  border: 1px solid var(--linea);
  border-radius: 16px;
  padding: 15px 22px;
  font-weight: 900;
  color: var(--texto);
  transition: all .2s;
}
.wps-btn-ghost:hover {
  background: var(--fondo);
  border-color: var(--azul);
  color: var(--azul);
}

/* === Sections genéricas === */
.section {
  padding: 80px 0;
}
.section-soft {
  background: var(--fondo);
}

/* === Mini title === */
.mini-title {
  color: var(--azul2);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: .82rem;
  margin-bottom: .6rem;
}

/* === Display title (Anton) === */
.wps-display-title {
  font-family: 'Anton', sans-serif;
  font-size: clamp(2.2rem, 4.5vw, 3.8rem);
  line-height: 1.08;
  letter-spacing: -.01em;
  color: var(--texto);
  margin-bottom: .85rem;
}

/* === Card-simple === */
.card-simple {
  background: #fff;
  border: 1px solid var(--linea);
  border-radius: 24px;
  padding: 28px;
  height: 100%;
  box-shadow: 0 10px 30px rgba(15,23,42,.05);
  transition: all .25s;
}
.card-simple:hover {
  border-color: var(--azul);
  box-shadow: 0 12px 36px rgba(79,140,255,.1);
  transform: translateY(-3px);
}

/* === Card-simple con fondo oscuro === */
.card-simple.bg-dark {
  background: transparent !important;
}
.card-simple.border-light {
  border-color: rgba(255,255,255,.12) !important;
}

/* === Icon cuadradito === */
.icon {
  width: 48px;
  height: 48px;
  border-radius: 16px;
  background: var(--azul-suave);
  color: var(--azul2);
  display: grid;
  place-items: center;
  font-weight: 900;
  font-size: 1.2rem;
}

/* === Step number circular === */
.step-number {
  width: 44px;
  height: 44px;
  border-radius: 999px;
  background: var(--azul);
  color: #fff;
  display: grid;
  place-items: center;
  font-weight: 900;
}

/* === Price card (planes) === */
.wps-price-card {
  background: #fff;
  border: 1px solid var(--linea);
  border-radius: 30px;
  padding: 34px;
  position: relative;
  transition: all .3s;
  height: 100%;
}
.wps-price-card:hover {
  border-color: var(--azul);
  box-shadow: 0 24px 60px rgba(79,140,255,.14);
  transform: translateY(-4px);
}
.wps-price-card.featured {
  border-color: var(--azul);
  box-shadow: 0 24px 60px rgba(79,140,255,.14);
  background: linear-gradient(180deg, #fff, var(--azul-suave));
}
.wps-price-card .price {
  font-size: 3.8rem;
}
.wps-price-card .price-label {
  font-size: .9rem;
}
.wps-price-card .wps-feature-grid {
  gap: 10px;
}
.wps-price-card .feature-item {
  padding: 10px 14px;
  font-size: .85rem;
}
.wps-price-card hr {
  margin: 1rem 0;
  border-color: var(--linea);
}

/* === CTA final === */
.wps-cta-final {
  background:
    radial-gradient(circle at 20% 20%, rgba(255,255,255,.22), transparent 36%),
    linear-gradient(135deg, var(--azul) 0%, var(--azul2) 100%);
  color: #fff;
  border-radius: 34px;
  padding: 48px;
}

/* === Accordion (FAQ) === */
.accordion-item {
  border: 1px solid var(--linea) !important;
  border-radius: 18px !important;
  overflow: hidden;
  margin-bottom: .75rem;
}

/* === WhatsApp flotante promocional === */
.wa-float {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 999;
  background: var(--verde);
  color: #fff;
  text-decoration: none;
  border-radius: 999px;
  padding: 14px 18px;
  font-weight: 900;
  box-shadow: 0 16px 34px rgba(22,163,74,.28);
}
.wa-float:hover {
  color: #fff;
  background: #15803D;
}

/* === Responsive promo === */
@media(max-width:767px){
  .wps-hero {
    padding: 90px 0 20px;
    min-height: 0 !important;
  }
  .wps-hero-title {
    font-size: clamp(2rem, 9vw, 2.6rem);
  }
  .wps-hero-text {
    font-size: .9rem;
    margin-top: 10px;
  }
  .wps-hero-card {
    display: none !important;
  }
  .wps-hero-stats {
    display: none !important;
  }
  .wps-hero .badge-promo {
    font-size: .7rem;
    padding: .25rem .55rem;
  }
  .wps-hero .btn-lg {
    padding: .5rem .9rem;
    font-size: .8rem;
  }
  .wps-hero .d-flex.flex-wrap.gap-2 {
    gap: .4rem !important;
  }
  .wps-feature-grid {
    grid-template-columns: 1fr;
  }
  .price {
    font-size: 3.2rem;
  }
  .wps-price-card {
    padding: 18px;
  }
  .wps-cta-final {
    padding: 24px 16px;
    border-radius: 20px;
  }
  section {
    padding: 30px 0;
  }
  .section {
    padding: 30px 0;
  }
  .wps-display-title {
    font-size: 1.5rem;
  }
  .mini-title {
    font-size: .68rem;
  }
  .card-simple {
    padding: 16px;
    border-radius: 16px;
  }
  .feature-item {
    padding: 8px 12px;
    font-size: .78rem;
  }
  .wps-price-card .feature-item {
    padding: 6px 10px;
    font-size: .75rem;
  }
  .wps-price-card hr {
    margin: .6rem 0;
  }
}

/* ===== UTILIDADES ADICIONALES ===== */
.shadow-sm {
    box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}

.shadow {
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

.shadow-lg {
    box-shadow: 0 8px 30px rgba(0,0,0,0.12);
}

/* ===== BACKDROP BLUR ===== */
.backdrop-blur {
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

/* ===== PADDING UTILITIES (bs5 extend) ===== */
.py-6 {
    padding-top: 4.5rem;
    padding-bottom: 4.5rem;
}

.px-6 {
    padding-left: 4.5rem;
    padding-right: 4.5rem;
}

/* ===== MIN HEIGHT UTILITIES ===== */
.min-vh-80 {
    min-height: 80vh;
}

/* ===== TRANSICIONES ===== */
[data-aos] {
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

/* ===== CARDS ===== */
.card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    border-radius: 1rem !important;
    overflow: hidden;
}

.card:hover:not(:has(a:hover,button:hover)) {
    transform: translateY(-4px);
    box-shadow: 0 12px 40px rgba(0,0,0,0.15) !important;
}

.card .card-img-top {
    transition: transform 0.4s ease;
}

.card:hover .card-img-top {
    transform: scale(1.05);
}

.card .badge.rounded-pill {
    font-weight: 500;
}

/* ===== SECCIÓN TESTIMONIOS ===== */
.bg-white.bg-opacity-10 {
    transition: background 0.3s ease;
}

.bg-white.bg-opacity-10:hover {
    background: rgba(255,255,255,0.18) !important;
}

/* ===== BADGES ===== */
.badge.rounded-pill {
    font-weight: 500;
}

/* ===== OPCACITY ===== */
.opacity-5 {
    opacity: 0.05;
}

.opacity-10 {
    opacity: 0.10;
}

.opacity-20 {
    opacity: 0.20;
}

/* ===== RESPONSIVE ===== */

/* Tablets (≤768px) */
@media (max-width: 768px) {
    .py-6 {
        padding-top: 3rem;
        padding-bottom: 3rem;
    }
    .min-vh-80 {
        min-height: auto;
    }
    .wps-hero {
        min-height: auto !important;
        padding: 4rem 0;
    }
    .display-3 {
        font-size: 2.2rem;
    }
    .display-4 {
        font-size: 1.8rem;
    }
    .display-6 {
        font-size: 1.5rem;
    }
    .card-img-top {
        height: 160px !important;
    }
    .wps-hero .card-flotante {
        position: relative !important;
        bottom: auto !important;
        left: auto !important;
        transform: none !important;
        width: 100% !important;
        margin-top: 0;
    }
}

/* Móviles pequeños (≤576px) */
@media (max-width: 576px) {
    .py-6 {
        padding-top: 2.5rem;
        padding-bottom: 2.5rem;
    }
    .wps-hero {
        padding: 3rem 0;
        min-height: auto !important;
    }
    .display-3 {
        font-size: 1.8rem;
        line-height: 1.2;
    }
    .display-4 {
        font-size: 1.6rem;
    }
    .display-6 {
        font-size: 1.35rem;
    }
    .lead {
        font-size: 0.95rem !important;
    }
    .btn-lg {
        padding: 0.6rem 1.2rem;
        font-size: 0.9rem;
    }
    .badge.fs-6 {
        font-size: 0.8rem !important;
        padding: 0.35rem 0.8rem !important;
    }
    .card-body {
        padding: 1.25rem !important;
    }
    .card-img-top {
        height: 140px !important;
    }
    .card .p-4 {
        padding: 1rem !important;
    }
    .card .p-5 {
        padding: 1.5rem !important;
    }
    /* Hero image floating card */
    .wps-hero .translate-middle-x {
        position: relative !important;
        bottom: auto !important;
        left: auto !important;
        transform: none !important;
        width: 100% !important;
        margin-top: -2rem;
    }
    /* Product cards ecommerce */
    .card .rounded-4 .position-relative[style*="height: 240px"] {
        height: 180px !important;
    }
    /* Sección de horarios */
    .card .row.g-0 .p-5 {
        padding: 1.5rem !important;
    }
    /* Galería */
    .col-6.col-md-4 img {
        height: 140px !important;
    }
    /* Testimonios */
    .bg-opacity-10.backdrop-blur {
        padding: 1.25rem !important;
    }
    /* Categorías visuales */
    .col-6.col-md-3 .rounded-4 {
        height: 120px !important;
    }
    /* WhatsApp flotante */
    .wps-whatsapp-float {
        width: 50px !important;
        height: 50px !important;
        font-size: 1.5rem !important;
        bottom: 20px !important;
        right: 20px !important;
    }
    .wps-whatsapp-float-sec {
        width: 44px !important;
        height: 44px !important;
        font-size: 1.2rem !important;
        bottom: 80px !important;
        right: 20px !important;
    }
    /* Página demos */
    .demos-archive .card-body {
        padding: 1rem !important;
    }
}

/* ===== NAVEGACION PRINCIPAL (Tu Presencia Web) ===== */
.wps-nav-brand {
    font-weight: 800;
    font-size: 1.25rem;
    color: #0F172A;
}
.wps-nav-brand span {
    color: #2F6FED;
}

/* ===== PIE DE PAGINA (Tu Presencia Web) ===== */
.wps-footer {
    background: #0F172A;
    color: rgba(255,255,255,.7);
    padding: 2rem 0;
    margin-top: 3rem;
}
.wps-footer a {
    color: rgba(255,255,255,.7);
    text-decoration: none;
}
.wps-footer a:hover {
    color: #fff;
}

/* Móviles muy pequeños (≤400px) */
@media (max-width: 400px) {
    .wps-hero {
        padding: 2rem 0;
    }
    .display-3 {
        font-size: 1.5rem;
    }
    .d-flex.gap-3 {
        gap: 0.5rem !important;
    }
    .btn-lg {
        padding: 0.5rem 1rem;
        font-size: 0.85rem;
    }
    .row.g-4 {
        --bs-gutter-y: 1rem;
    }
}

/* RESET: eliminar animaciones AOS/fade-up que ya no se usan */
.fade-up { opacity: 1 !important; transform: none !important; }
[data-aos] { opacity: 1 !important; transform: none !important; }
.aos-init, .aos-animate { opacity: 1 !important; transform: none !important; }


/* ============================================================
 * RESPONSIVE ENHANCED
 * ============================================================ */

/* Tablets ≤ 991px */
@media (max-width: 991px) {
    .hero { min-height: auto; padding: 5rem 0 3rem; }
    .hero h1 { font-size: clamp(2rem, 5vw, 2.8rem); }
    .hero-stats { gap: 1.5rem; }
    .hcard { margin-left: 0 !important; }
    section { padding: 3.5rem 0; }
    .section { padding: 3.5rem 0; }
}

/* Tablets ≤ 768px */
@media (max-width: 768px) {
    .hero { min-height: auto; padding: 4.5rem 0 2.5rem; }
    .hero h1 { font-size: clamp(1.85rem, 5.5vw, 2.4rem); }
    .hero-sub { font-size: 0.95rem; }
    .hero-stats { gap: 1.2rem; padding-top: 1.2rem; margin-top: 1.5rem; }
    .stat-num { font-size: 1.6rem; }
    .plan-card { padding: 1.5rem; }
    .plan-price { font-size: 1.6rem; }
    .plan-name { font-size: 1.2rem; }
    .section-title { font-size: clamp(1.4rem, 4vw, 1.8rem); }
    .btn-hero-primary, .btn-hero-ghost { padding: 0.6rem 1.2rem; font-size: 0.85rem; }
    section { padding: 2.5rem 0; }
    .section { padding: 2.5rem 0; }
    .sol-card { padding: 1.25rem; }
    .cap-card { padding: 1.25rem; }
    .testi-card { padding: 1.25rem; }
    .about-num { padding: 1rem; }
    .about-num-val { font-size: 1.6rem; }
    .port-card { padding: 0.75rem; }
    .wps-display-title { font-size: clamp(1.4rem, 4vw, 1.8rem); }
    .wps-price-card { padding: 1.25rem; }
    .wps-price-card .price { font-size: 2.8rem; }
    .wps-cta-final { padding: 1.5rem; }
    .wps-footer-top .row > div { margin-bottom: 1rem; }
}

/* Móviles ≤ 576px */
@media (max-width: 576px) {
    .hero { padding: 3.5rem 0 2rem; }
    .hero h1 { font-size: clamp(1.65rem, 6.5vw, 2rem); line-height: 1.15; margin-bottom: 0.75rem; }
    .hero-sub { font-size: 0.88rem; margin-bottom: 1.5rem; line-height: 1.5; }
    .hero-tag { font-size: 0.68rem; padding: 0.25rem 0.6rem; }
    .hero-stats { flex-direction: row; gap: 1rem; padding-top: 1rem; margin-top: 1.5rem; justify-content: center; }
    .hero-stats > div { flex: 1; text-align: center; min-width: 80px; }
    .stat-num { font-size: 1.4rem; }
    .stat-label { font-size: 0.68rem; }
    .btn-hero-primary, .btn-hero-ghost { padding: 0.5rem 1rem; font-size: 0.82rem; border-width: 1.5px; width: 100%; text-align: center; margin-bottom: 0.4rem; }
    .hero .d-flex.flex-wrap.gap-3 { flex-direction: column; gap: 0 !important; }
    section { padding: 2rem 0; }
    .section { padding: 2rem 0; }
    .section-title { font-size: clamp(1.25rem, 5vw, 1.5rem); margin-bottom: 0.5rem; }
    .section-sub { font-size: 0.85rem; }
    .section-tag { font-size: 0.65rem; }
    
    /* Plan cards */
    .plan-card { padding: 1.25rem; margin-bottom: 0.75rem; }
    .plan-name { font-size: 1.1rem; }
    .plan-price { font-size: 1.4rem; }
    .plan-price small { font-size: 0.75rem; }
    .plan-desc { font-size: 0.8rem; margin-bottom: 0.75rem; }
    .plan-features li { font-size: 0.8rem; padding: 0.3rem 0; }
    .plan-cta { padding: 0.55rem; font-size: 0.82rem; }
    .plan-img-wrap { height: 130px; margin-bottom: 0.75rem; }
    .plan-badge { font-size: 0.6rem; padding: 0.2rem 0.6rem; top: -10px; }
    
    /* Cards generales */
    .cap-card { padding: 1rem; }
    .cap-icon { width: 38px; height: 38px; }
    .cap-icon i { font-size: 0.95rem; }
    .cap-title { font-size: 0.88rem; }
    .cap-desc { font-size: 0.8rem; }
    
    .sol-card { padding: 1rem; }
    .sol-num { font-size: 1.8rem; }
    .sol-title { font-size: 0.88rem; }
    .sol-desc { font-size: 0.8rem; }
    
    .testi-card { padding: 1rem; }
    .testi-text { font-size: 0.82rem; }
    .testi-name { font-size: 0.82rem; }
    .testi-role { font-size: 0.75rem; }
    
    .about-num { padding: 0.75rem; }
    .about-num-val { font-size: 1.4rem; }
    .about-num-label { font-size: 0.65rem; }
    
    .port-card { padding: 0.5rem; }
    .port-badge { font-size: 0.65rem; }
    .port-title { font-size: 0.88rem; }
    
    /* Accordion */
    .accordion-button { font-size: 0.85rem; padding: 0.75rem 1rem; }
    .accordion-body { font-size: 0.82rem; }
    
    /* Promo cards */
    .card-simple { padding: 1rem; }
    .icon { width: 38px; height: 38px; font-size: 1rem; }
    .step-number { width: 34px; height: 34px; font-size: 0.85rem; }
    
    .wps-price-card { padding: 1rem; }
    .wps-price-card .price { font-size: 2.4rem; }
    .wps-price-card .plan-name { font-size: 1rem; }
    .wps-price-card .feature-item { padding: 5px 8px; font-size: 0.72rem; }
    .wps-price-card hr { margin: 0.5rem 0; }
    
    .wps-cta-final { padding: 1.25rem; }
    .wps-cta-final h2 { font-size: clamp(1.2rem, 5vw, 1.5rem); }
    .wps-cta-final p { font-size: 0.85rem; }
    
    .wps-display-title { font-size: clamp(1.2rem, 5vw, 1.5rem); }
    .mini-title { font-size: 0.62rem; }
    
    /* Logo navbar */
    .navbar-brand img.custom-logo, 
    .navbar-brand .custom-logo-link img { max-height: 32px !important; }
    .navbar-brand { font-size: 1rem; }
    
    /* Footer */
    .wps-footer-logo, 
    .wps-fbrand-logo img { max-height: 40px !important; }
    .wps-fbrand-name { font-size: 1rem; }
    .wps-fbrand-desc { font-size: 0.82rem; }
    .wps-fheading { font-size: 0.85rem; }
    .wps-flinks li { font-size: 0.8rem; }
    
    /* Fix: inline hero buttons to full width on tiny */
    .hero .btn-hero-primary,
    .hero .btn-hero-ghost { display: block; width: 100%; margin-bottom: 0.5rem; }
    
    /* Audiencia chips */
    .aud-chip { padding: 0.75rem; }
    .aud-label { font-size: 0.78rem; }
    
    /* CTA final */
    .cta-final { padding: 3rem 0; }
    .cta-final h2 { font-size: clamp(1.2rem, 5vw, 1.5rem); }
}

/* Móviles muy pequeños ≤ 400px */
@media (max-width: 400px) {
    .hero h1 { font-size: clamp(1.5rem, 6.5vw, 1.75rem); }
    .hero-sub { font-size: 0.82rem; }
    .plan-card { padding: 1rem; }
    .plan-price { font-size: 1.2rem; }
    .plan-features li { font-size: 0.75rem; }
    .section-title { font-size: clamp(1.1rem, 5vw, 1.3rem); }
}

/* Navbar: scroll horizontal en mobile */
@media (max-width: 576px) {
    .navbar .container { padding-left: 12px; padding-right: 12px; }
}