/* ============================================================
   SYNAP · el sitio publico — «La Sala de Maquinas»
   Hereda los tokens de marca.css; aqui solo vive lo del sitio.
   El corte de 20 grados de La Hendidura es el motivo que separa
   las secciones: un solo gesto repetido.
   ============================================================ */

.st-body{margin:0;background:var(--canvas);color:var(--tinta);font-family:var(--font-sans);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
.st-wrap{max-width:1140px;margin:0 auto;padding:0 28px}
.st-mono{font-family:var(--font-mono)}
.st-kick{font-family:var(--font-mono);font-size:11px;letter-spacing:.17em;text-transform:uppercase;color:var(--oliva)}
.st-rejilla{background-image:linear-gradient(var(--rejilla) 1px,transparent 1px),linear-gradient(90deg,var(--rejilla) 1px,transparent 1px);background-size:26px 26px}

/* ---- Navegacion ---- */
.st-nav{position:sticky;top:0;z-index:40;background:rgba(247,247,243,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line-soft)}
.st-nav-in{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-block:14px}
.st-brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--tinta)}
.st-brand svg{flex:none;display:block}
.st-brand b{font-weight:700;font-size:19px;letter-spacing:var(--tracking-tight);line-height:1}
.st-brand span{display:block;font-family:var(--font-mono);font-size:7.5px;letter-spacing:.19em;text-transform:uppercase;color:var(--piedra);margin-top:3px}
.st-links{display:flex;align-items:center;gap:26px}
.st-links a{font-family:var(--font-mono);font-size:12px;color:var(--piedra);text-decoration:none}
.st-links a:hover,.st-links a[aria-current]{color:var(--tinta)}
.st-btn{display:inline-block;font-family:var(--font-mono);font-size:12px;background:var(--grafito);color:var(--crema);padding:11px 20px;text-decoration:none;border:1px solid var(--grafito);border-radius:var(--radius-control)}
.st-btn:hover{background:var(--oliva-hondo);border-color:var(--oliva-hondo)}
.st-btn.fantasma{background:transparent;color:var(--tinta);border-color:var(--line)}
.st-btn.fantasma:hover{background:var(--crema-oscura);color:var(--tinta)}
.st-btn.claro{background:var(--crema);color:var(--grafito);border-color:var(--crema)}
.st-nav-burger{display:none;background:none;border:1px solid var(--line);border-radius:var(--radius-control);padding:8px 10px;font-family:var(--font-mono);font-size:11px;cursor:pointer;color:var(--tinta)}

/* ---- Hero ---- */
/* padding-block, no el atajo: .st-hero comparte elemento con .st-wrap y
   el atajo le borraba el margen lateral en movil. */
.st-hero{padding-block:74px 64px}
.st-hero-grid{display:grid;grid-template-columns:1.2fr .9fr;gap:48px;align-items:start}
.st-h1{font-weight:600;font-size:clamp(34px,5.2vw,62px);line-height:1.02;letter-spacing:-.038em;max-width:15ch;text-wrap:balance}
.st-h1 b{font-weight:600;color:var(--oliva)}
.st-lead{font-size:18px;line-height:1.62;color:var(--carbon);max-width:54ch;margin-top:24px}
.st-acciones{display:flex;gap:10px;flex-wrap:wrap;margin-top:30px}

/* panel del hero: el programa produciendose */
.st-panel{border:1px solid var(--line);background:var(--surface);border-radius:var(--radius-card)}
.st-panel-h{display:flex;justify-content:space-between;gap:12px;padding:11px 15px;border-bottom:1px solid var(--line);font-family:var(--font-mono);font-size:10px;letter-spacing:.11em;text-transform:uppercase;color:var(--piedra)}
.st-paso{display:flex;gap:12px;align-items:center;padding:13px 15px;border-bottom:1px solid var(--line-soft)}
.st-paso:last-child{border-bottom:0}
.st-punto{width:9px;height:9px;flex:none;border:1.5px solid var(--oliva);border-radius:50%}
.st-punto.lleno{background:var(--oliva)}
.st-paso b{font-size:14px;font-weight:600;display:block;line-height:1.25}
.st-paso i{font-style:normal;font-family:var(--font-mono);font-size:10px;color:var(--piedra)}
.st-paso .t{margin-left:auto;font-family:var(--font-mono);font-size:11px;color:var(--oliva);font-variant-numeric:tabular-nums}

/* ---- Cifras ---- */
.st-cifras{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.st-cifras div{padding:26px 28px;border-right:1px solid var(--line)}
.st-cifras div:last-child{border-right:0}
.st-cifras b{font-weight:600;font-size:32px;letter-spacing:-.035em;display:block;font-variant-numeric:tabular-nums;line-height:1}
.st-cifras span{font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--piedra);display:block;margin-top:8px}
.st-cifras em{font-style:normal;display:block;font-size:12.5px;color:var(--piedra);margin-top:7px;line-height:1.45}

/* ---- Secciones ---- */
.st-sec{padding:78px 0}
.st-sec-t{font-weight:600;font-size:clamp(26px,3.4vw,40px);line-height:1.08;letter-spacing:-.032em;max-width:20ch;text-wrap:balance}
.st-sec-p{font-size:17px;line-height:1.62;color:var(--carbon);max-width:62ch;margin-top:18px}
.st-oscura{background:var(--grafito);color:var(--crema)}
.st-oscura .st-sec-t{color:var(--crema)}
.st-oscura .st-sec-p{color:rgba(247,247,243,.68)}
.st-oscura .st-kick{color:var(--oliva-luz)}
.st-corte-sup{clip-path:polygon(0 34px,100% 0,100% 100%,0 100%);margin-top:-1px}
.st-corte-inf{clip-path:polygon(0 0,100% 0,100% calc(100% - 34px),0 100%)}

.st-vinetas{list-style:none;margin:26px 0 0;padding:0;display:flex;flex-direction:column;gap:13px;max-width:64ch}
.st-vinetas li{position:relative;padding-left:22px;font-size:16px;line-height:1.55;color:var(--carbon)}
.st-vinetas li::before{content:"";position:absolute;left:0;top:9px;width:8px;height:8px;background:var(--oliva)}
.st-oscura .st-vinetas li{color:rgba(247,247,243,.75)}
.st-oscura .st-vinetas li::before{background:var(--oliva-luz)}
.st-vinetas strong{color:var(--tinta);font-weight:600}
.st-oscura .st-vinetas strong{color:var(--crema)}

/* ---- Las cuatro escenas ---- */
.st-escenas{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--line);background:var(--line);margin-top:36px}
.st-esc{background:var(--surface);padding:30px 30px 34px}
.st-esc .num{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.14em;color:var(--oliva);text-transform:uppercase}
.st-esc h3{font-weight:600;font-size:20px;letter-spacing:-.025em;margin:10px 0 0;line-height:1.2}
.st-esc p{font-size:15px;color:var(--carbon);line-height:1.58;margin-top:10px}

/* ---- Rejilla de capacidades ---- */
.st-caps{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:1px solid var(--line);background:var(--line);margin-top:34px}
.st-cap{background:var(--surface);padding:24px 24px 26px;display:flex;flex-direction:column}
.st-cap h4{font-weight:600;font-size:15.5px;letter-spacing:-.015em}
.st-cap p{font-size:14px;color:var(--carbon);line-height:1.55;margin-top:7px}
/* Desde que plan esta cada cosa. Se calcula de plan_limits, no se escribe a
   mano: la home prometia lo que /precios negaba y no puede repetirse. */
.st-desde{display:block;margin-top:auto;padding-top:11px;border-top:1px solid var(--line);font-family:var(--font-mono);font-size:10.5px;letter-spacing:.04em;text-transform:uppercase;color:var(--oliva-hondo)}
.st-desde.todos{color:var(--piedra)}
section[id]{scroll-margin-top:86px}
/* La misma nota, pero dentro de una vineta. En fondo oscuro el oliva normal
   se pierde (3.4:1): ahi manda el oliva luminoso, como en el resto. */
.st-desde-min{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.04em;text-transform:uppercase;color:var(--oliva-hondo)}
.st-oscura .st-desde-min{color:var(--oliva-luz)}
.st-garantia{margin-top:12px;text-align:center;font-family:var(--font-mono);font-size:10.5px;letter-spacing:.03em;line-height:1.5;color:var(--piedra)}
.st-garantia a{color:var(--oliva-hondo);text-decoration:none;border-bottom:1px solid var(--oliva-soft)}
.st-garantia a:hover{border-bottom-color:var(--oliva-hondo)}

/* ---- Telefono del bloque de la red ---- */
.st-duo{display:grid;grid-template-columns:1.1fr .9fr;gap:44px;align-items:center}
.st-tel{width:250px;border-radius:32px;padding:9px;background:var(--grafito);box-shadow:0 24px 50px rgba(16,18,17,.22);margin:0 auto}
.st-tel-pantalla{border-radius:25px;overflow:hidden;background:var(--canvas);height:470px;display:flex;flex-direction:column}
.st-tel-top{background:var(--grafito);color:var(--crema);padding:26px 16px 12px}
.st-tel-top b{font-weight:700;font-size:15px}
.st-tel-top span{display:block;font-family:var(--font-mono);font-size:8px;letter-spacing:.14em;color:rgba(247,247,243,.55);margin-top:3px}
.st-tel-cuerpo{padding:14px;flex:1}
.st-tarjeta{border:1px solid var(--line);background:var(--surface);padding:12px;margin-bottom:9px;border-radius:var(--radius-control)}
.st-tarjeta b{font-size:12.5px;display:block;line-height:1.3;font-weight:600}
.st-tarjeta i{font-style:normal;font-family:var(--font-mono);font-size:8.5px;color:var(--piedra)}
.st-tel-bar{display:flex;border-top:1px solid var(--line);background:var(--surface)}
.st-tel-bar div{flex:1;text-align:center;padding:9px 2px;font-family:var(--font-mono);font-size:7.5px;color:var(--piedra);letter-spacing:.05em;text-transform:uppercase}
.st-tel-bar div.on{color:var(--oliva)}

/* ---- Confianza ---- */
.st-confianza{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--line);margin-top:32px}
.st-confianza div{padding:22px 22px;border-right:1px solid var(--line)}
.st-confianza div:last-child{border-right:0}
.st-confianza b{font-family:var(--font-mono);font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--oliva);display:block;margin-bottom:8px}
.st-confianza p{font-size:14px;color:var(--carbon);line-height:1.5}

/* ---- Cierre ---- */
.st-cierre{background:var(--grafito);color:var(--crema);padding:74px 0}
.st-cierre .st-h1{color:var(--crema);max-width:18ch}
.st-cierre .st-lead{color:rgba(247,247,243,.7)}
.st-form{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:28px;max-width:560px}
.st-form .ancho{grid-column:1/-1}
.st-campo label{display:block;font-family:var(--font-mono);font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;color:rgba(247,247,243,.6);margin-bottom:6px}
.st-campo input,.st-campo select,.st-campo textarea{
  width:100%;padding:11px 13px;background:rgba(247,247,243,.06);border:1px solid rgba(247,247,243,.2);
  border-radius:var(--radius-control);color:var(--crema);font-family:var(--font-sans);font-size:15px;
}
.st-campo input:focus,.st-campo select:focus,.st-campo textarea:focus{outline:none;border-color:var(--oliva-luz);box-shadow:0 0 0 3px rgba(147,172,124,.18)}
.st-campo select option{background:var(--grafito);color:var(--crema)}
.st-error{color:#E9A38C;font-size:12.5px;margin-top:5px;font-family:var(--font-mono)}
.st-ok{border:1px solid var(--oliva-luz);background:rgba(147,172,124,.12);padding:18px 20px;border-radius:var(--radius-card);margin-top:24px;max-width:560px}
.st-ok b{color:var(--crema);display:block;margin-bottom:5px}
.st-ok p{color:rgba(247,247,243,.72);font-size:14.5px}
.st-miel{position:absolute;left:-9999px}

/* ---- Pie ---- */
.st-pie{border-top:1px solid var(--line);padding:40px 0 56px;background:var(--canvas)}
.st-pie-in{display:flex;justify-content:space-between;gap:26px;flex-wrap:wrap;align-items:flex-start}
.st-pie a{color:var(--piedra);text-decoration:none;font-family:var(--font-mono);font-size:12px;display:block;margin-bottom:7px}
.st-pie a:hover{color:var(--tinta)}
.st-pie small{font-family:var(--font-mono);font-size:11px;color:var(--piedra);line-height:1.7}

/* ---- Precios ---- */
.st-escalera{display:flex;align-items:flex-end;justify-content:space-between;gap:8px;border:1px solid var(--line);background:var(--surface);padding:24px 26px;margin-top:34px;overflow-x:auto}
.st-esca{text-align:center;min-width:82px;flex:1}
.st-esca b{display:block;font-weight:600;font-size:27px;color:var(--oliva);letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.st-esca span{font-family:var(--font-mono);font-size:9px;color:var(--piedra);letter-spacing:.07em;display:block;margin-top:4px;text-transform:uppercase}
.st-esca-flecha{color:var(--line);align-self:center;font-size:15px}
.st-grupo{margin-top:46px}
.st-grupo-h{display:flex;align-items:baseline;gap:14px;margin-bottom:20px}
.st-grupo-h h2{font-weight:600;font-size:23px;letter-spacing:-.028em}
.st-grupo-h span{flex:1;height:1px;background:var(--line)}
.st-grupo-h em{font-style:normal;font-family:var(--font-mono);font-size:11px;color:var(--piedra)}
.st-planes{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:1px solid var(--line);background:var(--line)}
.st-plan{background:var(--surface);padding:26px 24px 28px;display:flex;flex-direction:column}
.st-plan.destaca{background:var(--oliva-soft)}
.st-plan h3{font-weight:600;font-size:19px;letter-spacing:-.02em}
.st-plan .modo{font-family:var(--font-mono);font-size:10px;color:var(--piedra);letter-spacing:.08em;text-transform:uppercase;margin-top:4px;display:block}
.st-precio{margin-top:16px;font-weight:600;font-size:30px;letter-spacing:-.035em;font-variant-numeric:tabular-nums;line-height:1.05}
.st-precio small{font-weight:400;font-size:13px;color:var(--piedra);letter-spacing:0}
.st-precio-nota{font-family:var(--font-mono);font-size:10.5px;color:var(--piedra);margin-top:6px}
.st-pp{margin-top:14px;font-family:var(--font-mono);font-size:11px;background:var(--oliva-soft);color:var(--oliva-hondo);padding:7px 11px;border-radius:var(--radius-control);display:inline-block}
.st-plan.destaca .st-pp{background:var(--surface)}
.st-plan ul{list-style:none;margin:18px 0 20px;padding:0;display:flex;flex-direction:column;gap:8px}
.st-plan li{font-size:14px;color:var(--carbon);padding-left:17px;position:relative;line-height:1.45}
.st-plan li::before{content:"";position:absolute;left:0;top:8px;width:6px;height:6px;background:var(--oliva)}
.st-plan .abajo{margin-top:auto}
.st-addons{border:1px solid var(--line);background:var(--surface);margin-top:34px}
.st-addon{display:flex;justify-content:space-between;gap:18px;padding:16px 22px;border-bottom:1px solid var(--line-soft);flex-wrap:wrap}
.st-addon:last-child{border-bottom:0}
.st-addon b{font-weight:600;font-size:15px}
.st-addon p{font-size:14px;color:var(--carbon);margin-top:3px;max-width:62ch}
.st-addon .val{font-family:var(--font-mono);font-size:14px;color:var(--oliva-hondo);white-space:nowrap;font-variant-numeric:tabular-nums}
.st-faq{margin-top:44px;border-top:1px solid var(--line)}
.st-faq details{border-bottom:1px solid var(--line)}
.st-faq summary{padding:18px 0;font-weight:600;font-size:16.5px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:14px}
.st-faq summary::-webkit-details-marker{display:none}
.st-faq summary::after{content:"+";font-family:var(--font-mono);color:var(--oliva);font-weight:400}
.st-faq details[open] summary::after{content:"−"}
.st-faq p{padding:0 0 20px;color:var(--carbon);font-size:15.5px;max-width:74ch;line-height:1.6}

/* ---- Aviso de vista previa ---- */
.st-previa{background:#B04A2F;color:#fff;text-align:center;padding:7px 16px;font-family:var(--font-mono);font-size:11px;letter-spacing:.08em}

@media (max-width:940px){
  .st-hero-grid,.st-duo{grid-template-columns:1fr;gap:34px}
  .st-escenas,.st-caps,.st-planes{grid-template-columns:1fr}
  .st-cifras,.st-confianza{grid-template-columns:1fr}
  .st-cifras div,.st-confianza div{border-right:0;border-bottom:1px solid var(--line)}
  .st-links{display:none}
  .st-links.abierto{display:flex;position:absolute;top:100%;left:0;right:0;background:var(--surface);flex-direction:column;align-items:flex-start;gap:0;padding:8px 28px 16px;border-bottom:1px solid var(--line)}
  .st-links.abierto a{padding:11px 0;font-size:14px}
  .st-nav-burger{display:block}
  .st-nav-in{position:relative}
  .st-form{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ---- El reproductor: lo que hay que enseñar del modo audio ---- */
.st-repro{background:var(--grafito);color:var(--crema);display:flex;flex-direction:column;height:100%}
.st-repro-top{display:flex;align-items:center;justify-content:space-between;padding:24px 16px 8px;font-family:var(--font-mono);font-size:8px;letter-spacing:.14em;color:rgba(247,247,243,.5)}
.st-repro-vuelta{font-size:16px;color:rgba(247,247,243,.7)}
.st-repro-vel{border:1px solid rgba(247,247,243,.25);border-radius:99px;padding:2px 7px;font-size:8.5px}
.st-repro-caratula{margin:12px 20px 0;height:132px;display:grid;place-items:center;background:linear-gradient(150deg,#232922,#101211);border:1px solid rgba(247,247,243,.1)}
.st-repro-info{padding:16px 20px 0;text-align:center}
.st-repro-info b{display:block;font-size:14px;font-weight:600;line-height:1.25}
.st-repro-info span{display:block;font-family:var(--font-mono);font-size:8.5px;color:rgba(247,247,243,.5);margin-top:5px;letter-spacing:.06em}
.st-repro-barra{margin:14px 20px 0;height:3px;background:rgba(247,247,243,.16);position:relative}
.st-repro-barra span{position:absolute;inset:0 auto 0 0;background:var(--oliva-luz);display:block}
.st-repro-barra::after{content:"";position:absolute;top:50%;left:38%;width:9px;height:9px;border-radius:50%;background:var(--oliva-luz);transform:translate(-50%,-50%)}
.st-repro-tiempos{display:flex;justify-content:space-between;padding:6px 20px 0;font-family:var(--font-mono);font-size:8.5px;color:rgba(247,247,243,.45)}
.st-repro-ctrl{display:flex;align-items:center;justify-content:center;gap:14px;padding:14px 20px 4px}
.st-repro-ctrl .ct{font-size:12px;color:rgba(247,247,243,.72);font-family:var(--font-mono)}
.st-repro-ctrl .grande{width:42px;height:42px;border-radius:50%;background:var(--oliva-luz);color:var(--grafito);display:grid;place-items:center;font-size:14px}
.st-repro-cola{margin:12px 12px 0;flex:1;overflow:hidden}
.st-repro-cola div{display:flex;align-items:center;gap:9px;padding:8px 8px;font-size:10.5px;color:rgba(247,247,243,.55);border-radius:var(--radius-control)}
.st-repro-cola div.on{background:rgba(147,172,124,.16);color:var(--crema)}
.st-repro-cola span{font-family:var(--font-mono);font-size:9px;color:var(--oliva-luz);width:10px}
.st-repro-cola em{font-style:normal;margin-left:auto;font-family:var(--font-mono);font-size:8.5px;color:rgba(247,247,243,.4)}
.st-repro-pie{padding:8px 16px 14px;text-align:center;font-family:var(--font-mono);font-size:8px;letter-spacing:.1em;color:var(--oliva-luz)}

/* ---- El caso del Campo: el teléfono como prueba de profundidad ---- */
.st-caso{background:var(--canvas);display:flex;flex-direction:column;height:100%}
.st-caso-top{background:var(--grafito);color:var(--crema);padding:22px 15px 12px}
.st-caso-top b{font-size:13px;font-weight:600;display:block}
.st-caso-top span{display:block;font-family:var(--font-mono);font-size:8px;letter-spacing:.12em;color:rgba(247,247,243,.5);margin-top:4px}
.st-caso-cuerpo{padding:12px;flex:1;overflow:hidden}
.st-caso-bloque{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-control);padding:11px;margin-bottom:9px}
.st-caso-bloque .et{font-family:var(--font-mono);font-size:7.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--oliva);display:block;margin-bottom:5px}
.st-caso-bloque b{font-size:12px;display:block;line-height:1.3;font-weight:600}
.st-caso-bloque p{font-size:10.5px;color:var(--carbon);line-height:1.45;margin-top:5px}
.st-caso-bloque.reporte{border-left:2px solid var(--oliva)}
.st-caso-bloque.profe{background:var(--oliva-soft);border-color:var(--oliva)}
.st-caso-bloque.profe p{color:var(--oliva-hondo)}
.st-caso-firma{font-family:var(--font-mono);font-size:7.5px;color:var(--piedra);margin-top:6px;display:block}
.st-caso-racha{display:flex;align-items:center;gap:7px;padding:9px 11px;background:var(--grafito);color:var(--crema);border-radius:var(--radius-control);margin-top:2px}
.st-caso-racha b{font-size:11px}
.st-caso-racha span{font-family:var(--font-mono);font-size:8px;color:var(--oliva-luz);margin-left:auto}

/* ---- La matriz comparativa: qué trae y qué no cada plan ---- */
.st-comparativa{margin-top:22px;border:1px solid var(--line);background:var(--surface);overflow-x:auto}
.st-tabla{width:100%;border-collapse:collapse;font-size:14px;min-width:760px}
.st-tabla th,.st-tabla td{padding:13px 14px;text-align:center;border-bottom:1px solid var(--line-soft)}
.st-tabla thead th{
  position:sticky;top:0;background:var(--crema-oscura);z-index:2;
  font-family:var(--font-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--tinta);font-weight:400;border-bottom:1px solid var(--line);
}
.st-tabla thead th small{display:block;font-family:var(--font-sans);font-size:12px;letter-spacing:0;text-transform:none;color:var(--piedra);margin-top:3px;font-variant-numeric:tabular-nums}
.st-tabla th:first-child,.st-tabla td:first-child{
  text-align:left;position:sticky;left:0;background:var(--surface);z-index:1;min-width:230px;
  border-right:1px solid var(--line-soft);
}
.st-tabla thead th:first-child{background:var(--crema-oscura);z-index:3}
.st-tabla td:first-child{color:var(--tinta)}
.st-tabla td:first-child em{display:block;font-style:normal;font-size:12px;color:var(--piedra);margin-top:2px;line-height:1.4}
.st-tabla .grupo td{
  background:var(--canvas);font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--oliva);text-align:left;padding:11px 14px;
}
.st-tabla .grupo td:first-child{background:var(--canvas)}
.st-tabla .destacada td{background:var(--oliva-soft);font-weight:600}
.st-tabla .destacada td:first-child{background:var(--oliva-soft)}
.st-si{color:var(--oliva);font-size:15px}
.st-no{color:#B9BCB6;font-size:15px}   /* visible, pero sin gritar */
.st-val{font-variant-numeric:tabular-nums;font-size:13.5px}
.st-nota-tabla{font-family:var(--font-mono);font-size:11px;color:var(--piedra);margin-top:12px}
@media (max-width:940px){
  .st-comparativa{border-left:0;border-right:0}
  .st-tabla th:first-child,.st-tabla td:first-child{min-width:180px}
}

/* ---- Páginas legales: texto largo, ancho de lectura ---- */
.legal-cuerpo{max-width:68ch;font-size:16.5px;line-height:1.7;color:var(--carbon)}
.legal-cuerpo h2{font-weight:600;font-size:21px;letter-spacing:var(--tracking-snug);color:var(--tinta);margin:34px 0 10px}
.legal-cuerpo h3{font-weight:600;font-size:17px;color:var(--tinta);margin:24px 0 8px}
.legal-cuerpo p{margin:0 0 14px}
.legal-cuerpo ul,.legal-cuerpo ol{margin:0 0 16px;padding-left:20px}
.legal-cuerpo li{margin-bottom:7px}
.legal-cuerpo a{color:var(--oliva-hondo)}
.legal-cuerpo strong{color:var(--tinta);font-weight:600}
.legal-cuerpo table{width:100%;border-collapse:collapse;margin:0 0 18px;font-size:15px}
.legal-cuerpo th,.legal-cuerpo td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line-soft)}
.legal-cuerpo th{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--piedra);font-weight:400}


/* ---- banda de trayectoria: nota al pie, no muro de clientes ---- */
.st-trayecto{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 0;margin-bottom:34px}
.st-trayecto b{display:block;font-size:15px;font-weight:600;letter-spacing:-.01em;margin-bottom:4px}
.st-trayecto p{margin:0;font-size:14px;line-height:1.55;color:var(--piedra);max-width:74ch}

/* ---- bloque de caso con cita ---- */
.st-cita{margin:26px 0 0;padding:26px 28px;border:1px solid var(--line);border-radius:3px;background:rgba(90,107,71,.045)}
.st-cita blockquote{margin:0}
.st-cita blockquote p{margin:0;font-size:18px;line-height:1.6;text-indent:-.4em}
.st-cita blockquote p::before{content:"\00AB"}
.st-cita blockquote p::after{content:"\00BB"}
.st-cita figcaption{display:flex;align-items:center;gap:14px;margin-top:20px;flex-wrap:wrap}
.st-cita-logo{height:40px;width:auto;flex:none}
.st-cita-quien b{display:block;font-size:15px;font-weight:600}
.st-cita-quien em{display:block;font-style:normal;font-family:var(--font-mono);font-size:12px;color:var(--piedra);margin-top:2px}
.st-cita-quien em + em{margin-top:1px}
.st-oscura .st-cita{background:rgba(147,172,124,.08);border-color:rgba(247,247,243,.16)}

/* ---- pie del ejemplo ilustrativo ---- */
.st-caso-ilustrativo{font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--piedra);text-align:center;padding:10px 0 0}

/* ---- precios: banda de categoria y salida discreta ---- */
.st-banda{max-width:76ch;margin:0 0 26px;font-size:16.5px;line-height:1.6}
.st-para-quien{font-size:13.5px;line-height:1.5;color:var(--piedra);min-width:150px}
.st-no-se{text-align:center;margin:34px 0 0}
.st-no-se a{font-family:var(--font-mono);font-size:13px;color:var(--piedra);text-decoration:underline;text-underline-offset:3px}
.st-no-se a:hover{color:var(--tinta)}


/* ---- selector de moneda de la lista ---- */
.st-moneda-fila{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:14px}
.st-moneda-fila .st-precio-nota{margin:0;flex:1 1 320px}
.st-moneda{display:flex;border:1px solid var(--line);border-radius:3px;overflow:hidden;flex:none}
.st-moneda a{padding:7px 15px;font-family:var(--font-mono);font-size:12px;letter-spacing:.08em;color:var(--piedra);text-decoration:none;border-right:1px solid var(--line)}
.st-moneda a:last-child{border-right:0}
.st-moneda a.on{background:var(--grafito);color:#F7F7F3}
.st-moneda a:not(.on):hover{color:var(--tinta)}

/* Selector de idioma (bloque 3 del bilingue, 28-ago-2026).
   Mono y en versalitas: es un dato, no una accion. El activo va en oliva y
   no se puede pulsar — un boton que no lleva a ninguna parte confunde. */
.st-idiomas{display:flex;align-items:center;gap:2px;font-family:var(--font-mono);font-size:11px;letter-spacing:.08em}
.st-idiomas a,.st-idiomas span{padding:4px 6px;border-radius:3px;line-height:1;text-decoration:none}
.st-idiomas a{color:var(--piedra)}
.st-idiomas a:hover,.st-idiomas a:focus-visible{color:var(--grafito);background:rgba(16,18,17,.06)}
.st-idiomas span.on{color:var(--oliva-hondo);font-weight:500}
@media (max-width:720px){.st-idiomas{font-size:10px}}

/* Avisos de los documentos legales (bloque 3 del bilingue). */
.legal-aviso{background:var(--arena,#F1EFE6);border-left:3px solid var(--oliva-hondo);padding:12px 16px;margin:0 0 26px;font-size:14px;border-radius:0 3px 3px 0;max-width:70ch}
.legal-prevalencia{margin-top:34px;padding-top:16px;border-top:1px solid var(--line);font-size:13px;color:var(--piedra);max-width:70ch}

/* Recomendado (2-sep-2026): la voz del destacado que ya existia mudo. */
.st-reco{display:inline-block;font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#fff;background:var(--oliva);padding:4px 10px;border-radius:999px;margin-bottom:10px;align-self:flex-start}
