/* VERTIX · Consultoría — solo lo propio de esta página; el resto vive en base.css */

/* Tarjeta del modelo 50/50 en el hero */
.split-card{border-radius:var(--r-xl);padding:clamp(28px,3.6vw,44px)}
.split-label{font:600 15px/1 var(--f-ui);color:var(--ink-2)}
.split-num{font:600 clamp(96px,12vw,160px)/.9 var(--f-display);letter-spacing:-.06em;margin:18px 0 22px}

.split-bar{height:10px;border-radius:var(--r-pill);background:rgba(22,20,15,.08);overflow:hidden;display:flex}
.split-bar span{width:50%;background:linear-gradient(90deg,#f39a6b,var(--accent));border-radius:inherit}
.split-sides{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:22px}
.split-sides b{display:block;font-weight:600;font-size:16px}
.split-sides span{display:block;color:var(--mute);font-size:14.5px;line-height:1.45;margin-top:4px}

/* Problema */
.problem{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,88px);align-items:start}
.compare{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:clamp(40px,5vw,64px)}
.compare .quote{margin-top:28px;font:600 clamp(22px,2.2vw,28px)/1.15 var(--f-display);letter-spacing:-.025em;color:var(--ink)}
.compare-off{background:rgba(255,255,255,.3)}
.compare-off .quote{color:var(--mute)}
.compare-on .quote{color:var(--accent-ink)}

.card .checks{margin-bottom:24px}
.deliver{margin-top:auto!important;padding-top:18px;border-top:1px solid var(--line);font-size:15px!important;color:var(--ink-2)!important;font-weight:500}
.flow{padding:0;margin:0;list-style:none}

.split-note{margin-top:20px;border-radius:var(--r-lg);padding:24px 28px;display:grid;grid-template-columns:auto 1fr;gap:12px 28px;align-items:center}
.split-note-t{font:600 18px/1.3 var(--f-ui)}
.split-note p:last-child{color:var(--mute);font-size:16px}

.redirect{margin-top:auto!important;padding-top:22px;border-top:1px solid var(--line);font-size:15px!important}

@media (max-width:960px){
  .problem,.compare{grid-template-columns:1fr}
  .split-note{grid-template-columns:1fr}
}
@media (max-width:640px){
  .split-sides{grid-template-columns:1fr}
}

.page-hero .h1{font-size:clamp(40px,5vw,68px)}
