/* Provinet — Zonas de difícil acceso y Comparador (mismo lenguaje visual que el túnel de planes):
   blanco limpio, tarjetas de vidrio con borde rojo tenue, tipografía de Inicio (Baloo 2 + Manrope) y acento rojo de marca.
   Se carga después de planes-page.css; los selectores llevan el prefijo de página para ganar en especificidad. */

body[data-page="services"] .zx {
  --zx-red: #e60012; --zx-ink: #151923; --zx-muted: #4d5a70;
  --zx-card: linear-gradient(160deg, #ffffff, rgba(255,255,255,.78));
  --zx-line: rgba(230,0,18,.14);
  --zx-shadow: 0 18px 44px rgba(21,25,35,.08);
  padding-block: clamp(56px, 8vw, 110px);
}
body[data-page="services"] .zx h2 { font: 800 clamp(2rem, 4vw, 3.2rem) / 1.05 'Baloo 2', 'Manrope', sans-serif; letter-spacing: -.01em; color: var(--zx-ink); margin: 0; }
body[data-page="services"] .zx h2 em { font-style: normal; color: var(--zx-red); }
body[data-page="services"] .zx .eyebrow { display: flex; align-items: center; gap: 12px; margin: 0 0 16px; font: 800 .78rem 'Manrope', sans-serif; letter-spacing: .3em; color: #1b2740; }
body[data-page="services"] .zx .eyebrow::before { content: ''; width: 3px; height: 16px; border-radius: 2px; background: var(--zx-red); }

/* ================= Zonas de difícil acceso ================= */
body[data-page="services"] .zx-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
body[data-page="services"] .zx-copy { display: grid; gap: 18px; justify-items: start; }
body[data-page="services"] .zx .nota-zona { margin: 0; max-width: 58ch; color: var(--zx-muted); font-size: 1.05rem; line-height: 1.65; }
body[data-page="services"] .zx-chips { list-style: none; display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; }
body[data-page="services"] .zx-chips li { padding: 8px 16px; border-radius: 999px; background: rgba(230,0,18,.07); border: 1px solid var(--zx-line); color: #7a0009; font: 700 .82rem 'DM Sans', sans-serif; }
body[data-page="services"] .zx .condiciones-zona { margin: 0; color: var(--zx-muted); font-size: .95rem; line-height: 1.6; }
body[data-page="services"] .zx .condiciones-zona a { color: var(--zx-red); font-weight: 700; text-decoration: none; border-bottom: 1px solid rgba(230,0,18,.35); }

body[data-page="services"] .zx .transparencia-plan { width: 100%; max-width: 58ch; margin: 4px 0 0; border: 1px solid var(--zx-line); border-radius: 18px; background: #fff; box-shadow: var(--zx-shadow); overflow: hidden; }
body[data-page="services"] .zx .transparencia-plan summary { display: flex; align-items: center; gap: 10px; padding: 14px 18px; cursor: pointer; color: var(--zx-ink); font: 800 .9rem 'Manrope', sans-serif; list-style: none; }
body[data-page="services"] .zx .transparencia-plan summary::before { color: var(--zx-red); }
body[data-page="services"] .zx .transparencia-body { padding: 4px 20px 18px; color: var(--zx-muted); font-size: .9rem; line-height: 1.6; border: 0; background: transparent; }

body[data-page="services"] .zx-tarifas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
body[data-page="services"] .zx-tarifa { position: relative; display: grid; gap: 8px; padding: 24px 24px 22px; border-radius: 24px; border: 1px solid var(--zx-line); background: var(--zx-card); box-shadow: var(--zx-shadow);
  transition: transform .25s, box-shadow .25s, border-color .25s; }
body[data-page="services"] .zx-tarifa:hover { transform: translateY(-4px); border-color: rgba(230,0,18,.4); box-shadow: 0 22px 50px rgba(230,0,18,.14); }
body[data-page="services"] .zx-tarifa:last-child { grid-column: 1 / -1; }
body[data-page="services"] .zx-speed { font: 800 clamp(2.6rem, 4.4vw, 3.6rem) / .95 'Manrope', sans-serif; letter-spacing: -.05em;
  background: linear-gradient(180deg, #151923 20%, #4a556d 100%); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; }
body[data-page="services"] .zx-speed small { margin-left: 8px; font: 800 .8rem 'Manrope', sans-serif; letter-spacing: .24em; text-transform: uppercase; -webkit-text-fill-color: var(--zx-red); color: var(--zx-red); }
body[data-page="services"] .zx-price { font: 800 1.5rem / 1 'Manrope', sans-serif; color: var(--zx-red); }
body[data-page="services"] .zx-price small { margin-left: 6px; font: 700 .9rem 'DM Sans', sans-serif; color: var(--zx-muted); }

/* ================= Comparador ================= */
body[data-page="services"] .comparador-planes .section-intro { display: grid; gap: 0; margin-bottom: 34px; }
body[data-page="services"] .comparador-planes .section-intro p:not(.eyebrow) { margin: 14px 0 0; max-width: 62ch; color: var(--zx-muted); font-size: 1.05rem; line-height: 1.6; }

body[data-page="services"] .zx .comparador-picker { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-bottom: 28px; }
body[data-page="services"] .zx .comparador-picker > div { padding: 22px 20px 16px; border-radius: 24px; border: 1px solid var(--zx-line); background: var(--zx-card); box-shadow: var(--zx-shadow); }
body[data-page="services"] .zx .comparador-picker h4 { margin: 0 0 12px; padding: 0; border: 0; font: 800 .74rem 'Manrope', sans-serif; letter-spacing: .22em; text-transform: uppercase; color: var(--zx-red); }
body[data-page="services"] .zx .comparador-picker label { display: flex; align-items: center; gap: 12px; margin: 0 -8px; padding: 10px 12px; border-radius: 14px; cursor: pointer;
  color: var(--zx-ink); font: 600 .92rem 'DM Sans', sans-serif; transition: background .2s, color .2s; }
body[data-page="services"] .zx .comparador-picker label:hover { background: rgba(230,0,18,.05); }
body[data-page="services"] .zx .comparador-picker label:has(input:checked) { background: rgba(230,0,18,.09); color: #7a0009; }
body[data-page="services"] .zx .comparador-picker label.is-disabled { opacity: .4; cursor: not-allowed; background: transparent; }
body[data-page="services"] .zx .comparador-picker input[type="checkbox"] { appearance: none; -webkit-appearance: none; flex: none; width: 20px; height: 20px; margin: 0; border-radius: 7px; border: 2px solid rgba(21,25,35,.28); background: #fff; display: grid; place-items: center; cursor: inherit; transition: background .2s, border-color .2s; }
body[data-page="services"] .zx .comparador-picker input[type="checkbox"]:checked { background: var(--zx-red) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7'/%3E%3C/svg%3E") center / 14px no-repeat; border-color: var(--zx-red); }
body[data-page="services"] .zx .comparador-picker input[type="checkbox"]:focus-visible { outline: 2px solid var(--zx-red); outline-offset: 2px; }

body[data-page="services"] .zx .comparador-tabla-wrap { overflow-x: auto; border-radius: 26px; border: 1px solid var(--zx-line); background: #fff; box-shadow: 0 24px 60px rgba(21,25,35,.1); }
body[data-page="services"] .zx .comparador-tabla { width: 100%; min-width: 620px; border-collapse: separate; border-spacing: 0; font: 500 .95rem 'DM Sans', sans-serif; color: var(--zx-ink); }
body[data-page="services"] .zx .comparador-tabla th { width: 190px; padding: 16px 22px; text-align: left; background: #fafafb; color: #6c778c; font: 800 .7rem 'Manrope', sans-serif; letter-spacing: .18em; text-transform: uppercase; border-bottom: 1px solid #eceef2; }
body[data-page="services"] .zx .comparador-tabla td { padding: 16px 22px; background: transparent; border-bottom: 1px solid #eceef2; border-left: 1px solid #f0f1f4; line-height: 1.45; }
body[data-page="services"] .zx .comparador-tabla tr:nth-child(even) td { background: transparent; }
body[data-page="services"] .zx .comparador-tabla tr:last-child th, body[data-page="services"] .zx .comparador-tabla tr:last-child td { border-bottom: 0; }
/* fila de nombres = encabezado del comparador */
body[data-page="services"] .zx .comparador-tabla tr:first-child th, body[data-page="services"] .zx .comparador-tabla tr:first-child td { background: linear-gradient(180deg, rgba(230,0,18,.08), rgba(230,0,18,.03)); border-bottom: 1px solid var(--zx-line); }
body[data-page="services"] .zx .comparador-tabla tr:first-child td { font: 800 1.25rem / 1.15 'Baloo 2', 'Manrope', sans-serif; padding-block: 22px; }
body[data-page="services"] .zx .comparador-tabla tr:first-child td b { font-weight: 800; }
/* fila de precio destacada */
body[data-page="services"] .zx .comparador-tabla tr:nth-child(4) td strong { font: 800 1.7rem / 1 'Manrope', sans-serif; color: var(--zx-red); }
body[data-page="services"] .zx .comparador-vacio { margin-top: 18px; padding: 22px; border-radius: 20px; border: 1.5px dashed rgba(230,0,18,.3); background: rgba(230,0,18,.03); color: var(--zx-muted); text-align: center; font-size: .95rem; }
body[data-page="services"] .zx .comparador-vacio[hidden] { display: none; }

@media (max-width: 980px) {
  body[data-page="services"] .zx-grid { grid-template-columns: 1fr; }
  body[data-page="services"] .zx .comparador-picker { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  body[data-page="services"] .zx-tarifas { grid-template-columns: 1fr; }
  body[data-page="services"] .zx .comparador-tabla th { width: 130px; padding-inline: 14px; }
  body[data-page="services"] .zx .comparador-tabla td { padding-inline: 14px; }
}