/* Precios: apertura y tres tarjetas (Marketing digital, MIA Go, Desarrollo web). Implementa el mockup aprobado 2026-11-06. */
.precios-page { --px-dark:#0f130f; --px-paper:#f6f3eb; --px-lime:#c7f45b; --px-green:#48622e; --px-ink-green:#1c2a15; --px-muted:#4a5545; --px-olive:#6f8456; --px-card:#faf8f2; --px-lime-soft:#eef5d4; --px-badge:#d8f08a;
 --px-pink:#ff3d7f; --px-pink-surface:#fff0f5; --px-pink-box:#ffd6e5; --px-pink-line:rgba(255,61,127,.3); --px-plum:#2b1020; --px-plum-muted:#5b3348; }
.px-shell { width:calc(100% - 96px); max-width:1344px; margin-inline:auto; }
.px-sr { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
/* Apertura */
.px-hero { background:var(--px-dark); color:var(--px-paper); padding:34px 0 32px; }
.px-hero h1 { font:800 clamp(40px,4.4vw,64px)/1.08 Manrope,sans-serif; letter-spacing:-.04em; margin:0 0 8px; }
.px-hero h1 span { color:var(--px-lime); }
.px-intro { font-size:clamp(18px,1.5vw,22px); line-height:1.4; margin:0; max-width:760px; }
/* Servicios */
.px-comparison { background:var(--px-paper); color:var(--px-ink-green); padding:28px 0 56px; scroll-margin-top:100px; }
.px-note { color:var(--px-muted); font-size:15px; line-height:1.5; margin:0 0 26px; }
.px-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0 24px; align-items:stretch; }
.px-card { display:flex; flex-direction:column; min-width:0; box-sizing:border-box; padding:28px 28px 26px; border:1px solid var(--px-olive); border-radius:22px; background:var(--px-card); color:var(--px-ink-green); }
.px-card-head { flex:1 1 auto; }
.px-card h3 { font:700 clamp(24px,2.1vw,30px)/1.2 Manrope,sans-serif; letter-spacing:-.03em; margin:0 0 14px; color:var(--px-ink-green); }
.px-lead { font-size:clamp(17px,1.5vw,21px); line-height:1.4; color:var(--px-muted); margin:0 0 10px; }
.px-channel-line { font-size:16px; line-height:1.5; margin:0 0 10px; color:var(--px-ink-green); }
.px-badge { display:inline-block; margin:0 0 16px; padding:6px 14px; border-radius:999px; background:var(--px-badge); color:var(--px-ink-green); font:700 16px/1.4 'DM Sans',sans-serif; }
.px-price-box { align-self:start; margin:0 0 16px; padding:14px 18px 16px; border-radius:16px; background:var(--px-lime-soft); }
.px-price-label { font:700 14px/1.4 'DM Sans',sans-serif; letter-spacing:.04em; margin:0 0 6px; color:var(--px-ink-green); }
.px-price-line { display:flex; flex-wrap:wrap; align-items:baseline; gap:2px 10px; margin:0; }
.px-amount { font:800 clamp(30px,2.65vw,38px)/1.15 Manrope,sans-serif; letter-spacing:-.04em; color:var(--px-ink-green); }
.px-unit { font:500 clamp(15px,1.15vw,17px)/1.4 'DM Sans',sans-serif; color:var(--px-muted); }
.px-terms { font-size:15px; line-height:1.5; color:var(--px-muted); margin:0; padding-top:14px; border-top:1px solid rgba(72,98,46,.28); }
/* MIA Go: paleta rosa solo en esta tarjeta */
.px-card-go { border-color:var(--px-pink); background:var(--px-pink-surface); color:var(--px-plum); border-width:1.5px; }
.px-card-go h3 { margin:0 0 12px; line-height:0; }
.px-go-logo { display:block; width:262px; max-width:calc(100% + 6px); height:auto; margin:-6px 0 -6px -6px; }
.px-descriptor { font:700 clamp(17px,1.5vw,21px)/1.35 Manrope,sans-serif; letter-spacing:-.01em; color:var(--px-plum); margin:0 0 12px; }
.px-card-go .px-lead { color:var(--px-plum-muted); }
.px-card-go .px-price-box { background:var(--px-pink-box); }
.px-card-go .px-price-label,.px-card-go .px-amount { color:var(--px-plum); }
.px-card-go .px-unit,.px-card-go .px-terms { color:var(--px-plum-muted); }
.px-card-go .px-terms { border-top-color:var(--px-pink-line); }
.px-price-extra { font:700 clamp(16px,1.4vw,20px)/1.4 Manrope,sans-serif; color:var(--px-plum); margin:6px 0 0; }
/* CTA común */
.px-cta-wrap { display:flex; justify-content:center; margin:40px 0 0; }
.px-cta { display:inline-flex; align-items:center; justify-content:center; gap:14px; min-height:56px; padding:14px 34px; border-radius:16px; background:var(--px-lime); color:var(--px-dark); font:700 20px/1.3 Manrope,sans-serif; letter-spacing:-.01em; text-decoration:none; box-sizing:border-box; }
.px-cta svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.px-cta:hover { box-shadow:inset 0 0 0 2px var(--px-dark); }
.px-comparison a:focus-visible { outline:3px solid var(--px-green); outline-offset:4px; }
/* Misma guía horizontal para los tres bloques de precio */
/* Desktop: seis guías compartidas (identidad, descripción, secundaria, inclusión, precio, condiciones) */
@supports (grid-template-rows:subgrid) {
 @media (min-width:1101px) {
  .precios-page #mensualidad .px-card { display:grid; grid-row:span 6; grid-template-rows:subgrid; grid-template-columns:minmax(0,1fr); row-gap:0; }
  .precios-page #mensualidad .px-card-head { display:contents; }
  .precios-page #mensualidad .px-card h3 { grid-row:1; align-self:center; }
  .precios-page #mensualidad .px-card .px-lead,.precios-page #mensualidad .px-card-go .px-descriptor { grid-row:2; }
  .precios-page #mensualidad .px-channel-line,.precios-page #mensualidad .px-features,.precios-page #mensualidad .px-card-go .px-lead { grid-row:3; }
  .precios-page #mensualidad .px-badge { grid-row:4; justify-self:start; align-self:start; }
  .precios-page #mensualidad .px-price-box { grid-row:5; }
  .precios-page #mensualidad .px-terms { grid-row:6; }
 }
}
@media (min-width:701px) and (max-width:1100px) {
 .px-shell { width:calc(100% - 56px); }
 .px-cards { grid-template-columns:1fr; gap:18px; max-width:640px; margin-inline:auto; }
 .px-card { display:flex; grid-row:auto; }
 .px-card-head { flex:0 0 auto; }
 .px-card-head { margin-bottom:6px; }
}
@media (max-width:700px) {
 .px-shell { width:calc(100% - 40px); }
 .px-hero { padding:24px 0 22px; }
 .px-hero h1 { font-size:clamp(34px,10vw,44px); }
 .px-comparison { padding:22px 0 40px; }
 .px-note { font-size:14px; margin-bottom:18px; }
 .px-cards { grid-template-columns:1fr; gap:16px; }
 .px-card { display:flex; grid-row:auto; padding:24px 20px 22px; border-radius:20px; }
 .px-card-head { flex:0 0 auto; margin-bottom:6px; }
 .px-card h3 { font-size:26px; }
 .px-price-box { padding:14px 16px 16px; }
 .px-amount { font-size:34px; }
 .px-terms { font-size:14px; }
 .px-go-logo { width:min(262px,86%); }
 .px-cta-wrap { margin-top:28px; }
 .px-cta { width:100%; max-width:420px; padding-inline:22px; }
}
.precios-page .px-card-web .px-lead { margin-bottom:15px; }
.precios-page .px-card-web .px-features { font-size:15px; line-height:1.5; color:#56614f; margin:0; }