/* ==========================================================
   Secciones del modelo de negocio v2 (Presencia Digital +
   Crecimiento Comercial). Se carga después de site.css.
   ========================================================== */

/* Hero: ilustración de búsqueda */
.gsearch{padding:26px}
.sbar{display:flex;align-items:center;gap:12px;padding:13px 18px;border-radius:99px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);font-size:16px;color:rgba(255,255,255,.92);margin-bottom:18px}
.sbar i{color:var(--hpa-cyan)}
.res{border-radius:16px;padding:18px 20px;margin-bottom:12px;border:1px solid rgba(255,255,255,.1)}
.res b{display:block;font:700 19px 'Space Grotesk',sans-serif;letter-spacing:-.01em}
.res small{display:block;color:rgba(255,255,255,.62);font-size:14px;margin-top:2px}
.res.on{background:linear-gradient(135deg,rgba(31,63,224,.38),rgba(79,216,255,.1));border-color:rgba(79,216,255,.45);box-shadow:0 0 0 1px rgba(79,216,255,.15),0 14px 40px rgba(31,63,224,.35)}
.res-tag{display:inline-flex;gap:8px;align-items:center;font:600 11.5px 'Space Grotesk',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--hpa-cyan);margin-bottom:10px}
.acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.acts span{display:inline-flex;gap:7px;align-items:center;padding:7px 13px;border-radius:99px;background:rgba(255,255,255,.1);font-size:13.5px}
.res.off{opacity:.55}

/* El problema */
.prob{max-width:820px;margin:0 auto;text-align:center}
.prob h2{margin:0 0 18px}
.prob .lead{margin-bottom:26px}
.qchips{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-bottom:34px}
.qchips span{display:inline-flex;align-items:center;gap:10px;padding:12px 20px;border:1px solid #D5DDF5;border-radius:99px;background:#fff;font-weight:500;box-shadow:0 1px 2px rgba(11,18,48,.04)}
.qchips i{color:var(--hpa-primary)}

/* 4 columnas */
.c4{grid-template-columns:repeat(4,1fr)}
.c4 .card{padding:28px}
@media (max-width:1024px){.c4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:767px){.c4{grid-template-columns:1fr}}

/* Presencia Digital: plan destacado, precios a cotizar, mantenimiento */
.svc.is-featured{border-color:var(--hpa-primary);background:linear-gradient(180deg,#fff 0%,#F3F6FF 100%);box-shadow:0 22px 50px rgba(31,63,224,.16)}
.tagx.hot{color:#fff;background:var(--hpa-primary)}
.svc .price.is-quote{font-size:22px;line-height:1.3;padding:5px 0}
.svc .price small{display:inline}
.combo.maint .badge{background:rgba(31,63,224,.12)}
.maint-price{margin-left:auto;font:700 22px 'Space Grotesk',sans-serif;white-space:nowrap;color:var(--hpa-text)}
.quote-note{text-align:center;color:var(--hpa-muted);font-size:15.5px;margin-top:28px}
.maint + .maint{margin-top:16px}
@media (max-width:767px){.maint-price{margin-left:0}}

/* Secciones oscuras: variantes de tarjetas de servicio y pasos */
.dark .svc .price{color:#fff}
.dark .svc .price small{color:rgba(255,255,255,.62)}
.dark .svc p{color:rgba(255,255,255,.72)}
.dark .svc .lvl{color:var(--hpa-cyan);background:rgba(79,216,255,.1)}
.dark .svc .tagx{color:#6EE7B7;background:rgba(110,231,183,.12)}
.dark .checks i{background:rgba(79,216,255,.12);color:var(--hpa-cyan)}
.dark .checks li{color:rgba(255,255,255,.9)}
.dark .quote-note{color:rgba(255,255,255,.7)}
.dark .step p{color:rgba(255,255,255,.72)}
.dark .step .when{color:var(--hpa-cyan)}
.dark .hpa-step-num .elementor-heading-title{background:linear-gradient(135deg,#7C93FF,#4FD8FF);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.dark .hpa-step-num::after{background:linear-gradient(90deg,rgba(79,216,255,.5),rgba(79,216,255,0))}
.proc-cta{margin-top:48px;text-align:center}
.proc-cta .btn-primary{display:inline-block}

/* Portafolio */
.demo-shot{aspect-ratio:16/9;border-radius:14px;background:linear-gradient(135deg,#1F3FE0,#0E1533);display:grid;place-items:center;color:#fff;font-size:44px;margin-bottom:22px}
.demo .btn-row{margin-top:22px}

/* Foto profesional: encuadre que conserva el rostro */
.photo-img{object-position:50% 14%}

/* Pie: espacio para que el botón flotante no tape los enlaces */
.ftr{padding-bottom:84px}

/* Sobre mí */
.edu{font-size:14.5px;color:var(--hpa-muted);margin:-8px 0 26px}