/* ─────────────────────────────────────────────────────────────────────────────
   Zignal Sentry · sistema de Resonance (ib-themes), concepto «Corporate», modo oscuro.
   Valores medidos en la demo el 29-sep-2026 (../resonance-medidas/medidas-*.json).
   Desviaciones sólo por AA: verde bajo texto blanco #0F8652 (el suyo, #119D60, da 3.49);
   verde como texto sobre #272727, su verde claro #1BB170.
   ───────────────────────────────────────────────────────────────────────────── */
:root {
  color-scheme: dark;
  --zs-negro: #121212;        /* --color-dark-1 del modo oscuro */
  --zs-negro-2: #181818;      /* --color-dark-2 */
  --zs-negro-3: #272727;      /* --color-dark-3, fondo de la tarjeta de planes */
  --zs-filete: rgba(255, 255, 255, .13);   /* --color-dark-mode-gray-2 */
  --zs-filete-2: rgba(255, 255, 255, .25); /* las líneas de la rejilla de servicios */
  --zs-gris: rgba(255, 255, 255, .7);      /* --color-dark-mode-gray-1 */
  --zs-verde: #119D60;        /* --color-primary-1: acento sobre negro (5.37) */
  --zs-verde-claro: #1BB170;  /* --color-primary-1-a: texto verde sobre #272727 (5.38) */
  --zs-verde-aa: #0F8652;     /* bajo texto blanco (4.61) */
  --zs-verde-aa-2: #0C7444;   /* su estado activo */
  --zs-magenta: #CA346B; --zs-magenta-l: #FFDFEB;
  --zs-ambar: #EAA92B;   --zs-ambar-l: #FFF4E0;
  --zs-turquesa: #19C4C4; --zs-turquesa-l: #D1FFFF;
  --zs-verde-l: #D4F5E7;
  --zs-radio: 12px;           /* --border-radius-default del concepto */
  --zs-sombra: 0 10px 30px rgba(0, 0, 0, .09);
  --zs-contenedor: 1350px;
  --zs-canal: 30px;
  --zs-sec: 140px;            /* --section-padding-y */
  --zs-cab: 85px;             /* --menu-bar-height */
  --zs-f: "Satoshi", "Helvetica Neue", Arial, sans-serif;
}
@media (max-width: 1366px) { :root { --zs-sec: 120px; } }
@media (max-width: 1024px) { :root { --zs-sec: 96px; } }
@media (max-width: 767px)  { :root { --zs-sec: 72px; --zs-canal: 20px; --zs-cab: 72px; } }

.zs-sitio, .zs-sitio * { box-sizing: border-box; }
body { background: var(--zs-negro); }
.zs-sitio {
  background: var(--zs-negro); color: #fff; font-family: var(--zs-f);
  font-size: 18px; font-weight: 400; line-height: 1.67; letter-spacing: normal;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
  overflow-x: clip;
}
/* Los reinicios pesan CERO (:where): cualquier clase de componente les gana. */
:where(.zs-sitio) img { display: block; max-width: 100%; height: auto; }
:where(.zs-sitio) a { color: inherit; text-decoration: none; }
:where(.zs-sitio) :is(h1, h2, h3, p, ul, dl, dd, figure) { margin: 0; padding: 0; }
:where(.zs-sitio) ul { list-style: none; }
:where(.zs-sitio) :is(h1, h2, h3) { font-weight: 500; letter-spacing: -.005em; text-wrap: balance; }
:where(.zs-sitio) button { font-family: inherit; cursor: pointer; }
.zs-sitio :focus-visible { outline: 2px solid var(--zs-verde-claro); outline-offset: 3px; border-radius: 4px; }
.zs-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.zs-contenedor { width: 100%; max-width: var(--zs-contenedor); margin: 0 auto; padding: 0 var(--zs-canal); }
.zs-angosto { max-width: calc(850px + 2 * var(--zs-canal)); }
.zs-centro { text-align: center; }
.zs-ico { width: 1em; height: 1em; flex: none; }

/* ── escala tipográfica medida (1440): 65 · 56 · 42 · 34 · 29 · 24 · 18 ── */
.zs-t-hero { font-size: clamp(40px, 1.8rem + 2.6vw, 65px); line-height: 1.1176; letter-spacing: -.037em; font-weight: 500; }
.zs-t-hdescr { font-size: clamp(22px, 1.05rem + 1.3vw, 34px); line-height: 1.353; letter-spacing: -.0075em; }
.zs-t-s1 { font-size: clamp(36px, 1.133rem + 2.77vw, 56px); line-height: 1.25; letter-spacing: -.017em; font-weight: 500; }
.zs-t-s2 { font-size: clamp(30px, 1.156rem + 1.72vw, 42px); line-height: 1.2; letter-spacing: -.02em; font-weight: 500; }
.zs-t-s3 { font-size: clamp(24px, 1rem + .6vw, 28px); line-height: 1.2; letter-spacing: -.02em; font-weight: 500; }
.zs-t-descr { font-size: clamp(21px, 1.213rem + .7vw, 29px); line-height: 1.448; letter-spacing: -.005em; }
.zs-t-gris { color: var(--zs-gris); }

/* ── botones: btn-mod de Resonance (esquina 12, peso 500, sin versalitas) ── */
.zs-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  border: 1px solid transparent; border-radius: var(--zs-radio); font-weight: 500; letter-spacing: 0;
  text-transform: none; line-height: 1.1; text-align: center; transition: background-color .27s, color .27s, border-color .27s, transform .27s;
}
.zs-btn--grande { padding: 20px 40px; font-size: 22px; }
.zs-btn--medio { padding: 13px 22px; font-size: 19px; }
.zs-btn--chico { padding: 10px 22px; font-size: 16px; }
.zs-btn--verde { background: var(--zs-verde-aa); color: #fff; }
.zs-btn--verde:hover { background: var(--zs-verde-aa-2); }
.zs-btn--blanco { background: #fff; color: var(--zs-verde-aa); }
.zs-btn--blanco:hover { background: var(--zs-verde-l); }
.zs-btn--borde { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .5); }
.zs-btn--borde:hover { border-color: #fff; }
.zs-btn.zs-hecho { background: var(--zs-negro-3); color: #fff; border-color: var(--zs-filete); }
.zs-enlace { display: inline-flex; align-items: center; gap: 8px; color: var(--zs-verde-claro); font-size: 16px; font-weight: 500; }
.zs-enlace:hover { color: #fff; }
.zs-ico--flecha { font-size: 18px; transition: transform .27s; }
.zs-enlace:hover .zs-ico--flecha { transform: translateX(4px); }

/* colores de los círculos de icono (services-8-icon color-1…4) */
.zs-c-magenta { background: var(--zs-magenta); color: var(--zs-magenta-l); }
.zs-c-ambar { background: var(--zs-ambar); color: var(--zs-ambar-l); }
.zs-c-verde { background: var(--zs-verde); color: var(--zs-verde-l); }
.zs-c-turquesa { background: var(--zs-turquesa); color: var(--zs-turquesa-l); }

/* ── cabecera: 85 px, menú de 20/500, activo en verde con su punto de estado ── */
.zs-cab { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 50; height: var(--zs-cab); background: var(--zs-negro); }
.zs-cab__in { height: 100%; display: flex; align-items: center; gap: 24px; }
.zs-cab__marca { flex: none; margin-right: auto; }
.zs-marca { display: inline-flex; align-items: center; gap: 10px; font-weight: 700; font-size: 22px; letter-spacing: -.02em; line-height: 1; white-space: nowrap; }
.zs-marca__disco { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: var(--zs-verde-aa); color: #fff; font-weight: 900; font-size: 20px; letter-spacing: 0; }
.zs-menu { display: flex; gap: 34px; margin-right: auto; font-size: 20px; font-weight: 500; }
.zs-menu a { position: relative; padding: 6px 0; }
.zs-menu a::before { content: ""; position: absolute; top: calc(50% + 1em); left: 1px; width: 4px; height: 4px; border-radius: 50%; background: var(--zs-verde); transform: scale(0); transition: transform .2s; }
.zs-menu a:hover::before, .zs-menu a.zs-activo::before { transform: scale(1); }
.zs-menu a.zs-activo { color: var(--zs-verde); }
.zs-cab__util { display: flex; align-items: center; gap: 26px; font-size: 18px; font-weight: 500; }
.zs-cab__util > a { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.zs-cab__util .zs-ico { font-size: 20px; color: var(--zs-verde); }
.zs-idioma span { color: var(--zs-gris); }
.zs-hamb { display: none; width: 44px; height: 44px; align-items: center; justify-content: center; border: 1px solid var(--zs-filete); border-radius: var(--zs-radio); background: transparent; color: #fff; font-size: 24px; }
@media (max-width: 1280px) { .zs-cab__tel { display: none !important; } .zs-menu { gap: 26px; font-size: 18px; } }
@media (max-width: 1024px) {
  .zs-menu, .zs-cab .zs-idioma { display: none !important; }   /* sólo la cabecera: el pie y el menú del teléfono conservan el idioma */
  .zs-hamb { display: inline-flex; }
}
@media (max-width: 480px) { .zs-carrito > span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } .zs-marca { font-size: 19px; } .zs-marca__disco { width: 32px; height: 32px; font-size: 18px; } }

/* ── héroe partido: foto de 572×648 con esquina 12 y el texto de 520 a la derecha ── */
.zs-heroe { padding: 100px 0 var(--zs-sec); }
.zs-heroe__grid { display: grid; grid-template-columns: minmax(0, 630fr) minmax(0, 660fr); align-items: center; }
.zs-heroe__media { position: relative; justify-self: end; width: min(572px, 100%); }
.zs-heroe__foto { width: 100%; aspect-ratio: 572 / 648; object-fit: cover; border-radius: var(--zs-radio); }
.zs-chips { position: absolute; left: -58px; bottom: 58px; display: grid; gap: 12px; justify-items: start; }
.zs-chips li {
  display: inline-flex; align-items: center; gap: 12px; height: 42px; padding: 0 17px 0 6px;
  background: var(--zs-negro-3); border: 1px solid var(--zs-filete); border-radius: 30px; color: rgba(255, 255, 255, .8); font-size: 18px; line-height: 1.2; white-space: nowrap;
}
.zs-chip__ico { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; font-size: 16px; }
.zs-heroe__txt { justify-self: end; max-width: 520px; }
.zs-heroe__txt .zs-t-hero { margin-bottom: 40px; }
.zs-heroe__txt .zs-t-hdescr { margin-bottom: 50px; }
.zs-lista { display: grid; gap: 16px; }
.zs-lista li { display: flex; align-items: flex-start; gap: 10px; font-size: 17px; line-height: 1.6; }
.zs-lista__i { display: grid; place-items: center; flex: none; width: 24px; height: 24px; margin-top: .1em; border-radius: 50%; background: var(--zs-verde-l); color: var(--zs-verde-aa); font-size: 14px; }
.zs-lista__i--pleno { background: var(--zs-verde); color: #fff; }
.zs-lista--heroe { margin-top: 50px; }
.zs-lista--heroe li { font-size: 18px; }
@media (max-width: 991px) {
  .zs-heroe { padding-top: 40px; }
  .zs-heroe__grid { grid-template-columns: 1fr; gap: 56px; }
  .zs-heroe__media { justify-self: start; width: 100%; max-width: 572px; }
  .zs-heroe__txt { justify-self: start; max-width: 640px; order: -1; }
  .zs-chips { left: 16px; bottom: 16px; }
}
@media (max-width: 480px) { .zs-chips li { font-size: 15px; height: 38px; } .zs-chips li:nth-child(n+3) { display: none; } .zs-btn--grande { padding: 18px 30px; font-size: 19px; } }

/* ── secciones ── */
.zs-sec { padding: var(--zs-sec) 0; }
.zs-sec--sin-arriba { padding-top: 0; }
.zs-sec__cab { margin-bottom: 80px; }
.zs-sec .zs-t-s1 + .zs-t-descr { margin-top: 40px; }
.zs-datos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 90px; border-top: 1px solid var(--zs-filete); }
.zs-datos > div { padding: 40px 30px 0; text-align: center; }
.zs-datos > div + div { border-left: 1px solid var(--zs-filete); }
.zs-datos dt { font-size: clamp(40px, 1.4rem + 2.2vw, 56px); font-weight: 500; line-height: 1.1; letter-spacing: -.03em; }
.zs-datos dd { margin-top: 10px; color: var(--zs-gris); font-size: 18px; }
@media (max-width: 767px) { .zs-datos { grid-template-columns: 1fr; } .zs-datos > div + div { border-left: 0; border-top: 1px solid var(--zs-filete); } .zs-datos > div { padding: 28px 0; } }

/* ── bandas con foto y velo verde (bg-gradient-primary-alpha-1 / -2) ── */
.zs-banda { position: relative; isolation: isolate; padding: var(--zs-sec) 0; overflow: hidden; }
.zs-banda__foto { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.zs-banda--izq .zs-banda__foto { object-position: 60% 20%; }
.zs-banda--der .zs-banda__foto { object-position: 25% 15%; }
.zs-banda::before { content: ""; position: absolute; inset: 0; z-index: -1; }
.zs-banda--izq::before { background: linear-gradient(90deg, var(--zs-verde-aa) 40%, rgba(15, 134, 82, 0) 87%); }
.zs-banda--der::before { background: linear-gradient(90deg, rgba(15, 134, 82, 0) 13%, var(--zs-verde-aa) 60%); }
.zs-banda--verde::before { background: var(--zs-verde-aa); opacity: .9; }
.zs-banda__txt { max-width: 520px; }
.zs-banda--der .zs-banda__txt { margin-left: auto; }
.zs-banda__txt .zs-t-descr { margin: 40px 0 50px; }
/* AA: donde el texto cae sobre el velo al 90 % (banda verde, tarjeta de contacto y, bajo 1200 px,
   las bandas partidas), la foto se oscurece a la mitad: así el peor píxel claro que asoma no baja
   el blanco de 4.5:1. En Resonance el velo va directo sobre la foto y reprueba. */
.zs-banda--verde .zs-banda__foto, .zs-contacto__fondo { filter: brightness(.5); }
@media (max-width: 1199px) {
  .zs-banda--izq::before, .zs-banda--der::before { background: var(--zs-verde-aa); opacity: .9; }
  .zs-banda--izq .zs-banda__foto, .zs-banda--der .zs-banda__foto { filter: brightness(.5); }
  .zs-banda--der .zs-banda__txt { margin-left: 0; }
}
.zs-pasos { display: grid; gap: 20px; max-width: 630px; margin: 60px auto 0; text-align: left; }
.zs-paso { display: flex; gap: 30px; padding: 30px; background: var(--zs-negro-2); border-radius: var(--zs-radio); box-shadow: var(--zs-sombra); }
.zs-paso__ico { font-size: 48px; line-height: 1; color: #fff; margin-top: 2px; }
.zs-paso__t { font-size: 21px; line-height: 1.2; letter-spacing: -.005em; margin-bottom: 9px; }
.zs-paso__txt { font-size: 18px; line-height: 1.5; color: var(--zs-gris); }
@media (max-width: 480px) { .zs-paso { flex-direction: column; gap: 16px; padding: 24px; } }

/* ── rejilla de servicios (services-8): filetes al 25 %, círculo de 100, título 24/500 ── */
.zs-srvs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 80px; border-top: 1px solid var(--zs-filete-2); }
.zs-srv { display: flex; flex-direction: column; padding: 48px; border-bottom: 1px solid var(--zs-filete-2); transition: background-color .27s; }
.zs-srv:not(:nth-child(3n + 1)) { border-left: 1px solid var(--zs-filete-2); }
.zs-srv:hover { background: var(--zs-negro-2); }
.zs-srv__ico { display: grid; place-items: center; width: 100px; height: 100px; margin-bottom: 42px; border-radius: 50%; font-size: 48px; }
.zs-srv__t { font-size: 24px; line-height: 1.25; margin-bottom: 12px; }
.zs-srv__txt { font-size: 18px; line-height: 1.6; color: var(--zs-gris); margin-bottom: 24px; }
.zs-srv__pie { margin-top: auto; margin-bottom: 20px; font-weight: 500; }
.zs-etiquetas { display: flex; flex-wrap: wrap; gap: 6px; }
.zs-etiquetas li { padding: 7px 13px; border: 1px solid rgba(255, 255, 255, .6); border-radius: 30px; font-size: 16px; line-height: 1.2; }
@media (max-width: 1024px) {
  .zs-srvs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .zs-srv { padding: 40px 32px; }
  .zs-srv:not(:nth-child(3n + 1)) { border-left: 0; }
  .zs-srv:nth-child(2n) { border-left: 1px solid var(--zs-filete-2); }
}
@media (max-width: 640px) {
  .zs-srvs { grid-template-columns: 1fr; }
  .zs-srv:nth-child(2n) { border-left: 0; }
  .zs-srv { padding: 36px var(--zs-canal); }
  .zs-srv__ico { width: 80px; height: 80px; font-size: 38px; margin-bottom: 28px; }
}

/* ── rótulo de sección (la píldora de «View Our Services», con su círculo de color) ── */
.zs-rotulo { display: inline-flex; align-items: center; gap: 10px; margin-bottom: 24px; padding: 5px 16px 5px 5px; background: var(--zs-negro-3); border: 1px solid var(--zs-filete); border-radius: 30px; font-size: 16px; font-weight: 500; line-height: 1.2; color: rgba(255, 255, 255, .85); }
.zs-rotulo__ico { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; font-size: 16px; }

/* ── planes: tarjeta de precios de Resonance en su variante oscura ── */
.zs-planes__cab { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 520px); gap: 60px; align-items: end; margin-bottom: 70px; }
.zs-planes { display: grid; gap: 30px; align-items: stretch; }
.zs-planes--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.zs-planes--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.zs-planes--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 900px; }
.zs-planes--1 { grid-template-columns: minmax(0, 1fr); }
.zs-plan { display: flex; flex-direction: column; padding: 30px; background: var(--zs-negro-3); border: 1px solid var(--zs-filete); border-radius: var(--zs-radio); transition: transform .27s, box-shadow .27s, border-color .27s; }
.zs-plan:hover { transform: translateY(-5px); box-shadow: 0 12px 37px rgba(0, 0, 0, .35); }
.zs-plan.zs-actual { border-color: var(--zs-verde-claro); }
.zs-plan__cab { text-align: center; }
.zs-senal { display: block; height: 40px; width: auto; margin: 6px auto 20px; }
.zs-senal .on { fill: var(--zs-verde-claro); }
.zs-senal .off { fill: rgba(255, 255, 255, .18); }
.zs-plan__ico { display: inline-grid; place-items: center; width: 56px; height: 56px; margin: 0 auto 12px; font-size: 48px; color: var(--zs-verde-claro); }
.zs-plan__t { font-size: 28px; line-height: 1.2; letter-spacing: -.02em; margin-bottom: 25px; }
.zs-precio { display: flex; flex-direction: column; align-items: center; gap: 8px; margin-bottom: 30px; padding-bottom: 30px; border-bottom: 1px solid var(--zs-filete); }
.zs-precio__desde { font-size: 16px; color: var(--zs-gris); }
.zs-precio__num { position: relative; display: inline-block; font-size: 60px; font-weight: 500; line-height: 1; letter-spacing: -.057em; font-variant-numeric: tabular-nums; }
.zs-precio__num sup { position: absolute; top: .8em; left: -.8em; font-size: 20px; font-weight: 400; letter-spacing: 0; line-height: 0; }
.zs-precio__nota { font-size: 16px; color: var(--zs-gris); }
.zs-plan__cuerpo { flex: 1; }
.zs-plan__desc { font-size: 17px; line-height: 1.6; color: var(--zs-gris); }
.zs-plan__inc { margin: 22px 0 14px; font-size: 16px; font-weight: 500; color: #fff; }
.zs-plan__desc:first-child + .zs-plan__inc { margin-top: 22px; }
.zs-plan__cuerpo > .zs-plan__inc:first-child { margin-top: 0; }
.zs-lista--plan { gap: 12px; }
.zs-lista--plan li { font-size: 16px; line-height: 1.5; color: var(--zs-gris); }
.zs-planes--1 .zs-plan { display: grid; grid-template-columns: minmax(0, 280px) minmax(0, 1fr); gap: 0 60px; padding: 40px; }
.zs-planes--1 .zs-plan__cab, .zs-planes--1 .zs-precio { grid-column: 1; }
.zs-planes--1 .zs-plan__cuerpo { grid-column: 2; grid-row: 1 / span 3; }
.zs-planes--1 .zs-plan__acciones { grid-column: 1; }
.zs-planes--1 .zs-lista--plan { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 30px; }
.zs-plan__acciones { display: grid; gap: 16px; justify-items: center; margin-top: 30px; }
.zs-plan__acciones .zs-btn { width: 100%; }
@media (max-width: 1180px) { .zs-planes--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 991px) {
  .zs-planes__cab { grid-template-columns: 1fr; gap: 24px; margin-bottom: 50px; }
  .zs-planes--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .zs-planes--1 .zs-plan { grid-template-columns: 1fr; padding: 30px; }
  .zs-planes--1 .zs-plan__cuerpo { grid-column: 1; grid-row: auto; margin-bottom: 10px; }
}
@media (max-width: 640px) {
  .zs-planes--4, .zs-planes--3, .zs-planes--2 { grid-template-columns: 1fr; }
  .zs-planes--1 .zs-lista--plan { grid-template-columns: 1fr; }
  .zs-plan { padding: 26px 22px; }
  .zs-precio__num { font-size: 52px; }
}

/* ── contacto: tarjeta verde (foto al 10 %) + formulario de campos de 66 ── */
.zs-contacto { display: grid; grid-template-columns: minmax(0, 520px) minmax(0, 1fr); gap: 80px; align-items: start; }
.zs-contacto__tarjeta { position: relative; isolation: isolate; overflow: hidden; display: grid; gap: 40px; padding: 48px; border-radius: var(--zs-radio); background: var(--zs-verde-aa); }
.zs-contacto__fondo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.zs-contacto__tarjeta::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--zs-verde-aa); opacity: .9; }
.zs-ci { position: relative; padding-left: 76px; min-height: 56px; }
.zs-ci__ico { position: absolute; left: 0; top: 2px; display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: var(--zs-verde-l); color: var(--zs-verde-aa); font-size: 24px; }
.zs-ci__t { font-size: 21px; line-height: 1.3; margin-bottom: 7px; }
.zs-ci__txt { font-size: 16px; line-height: 1.47; overflow-wrap: anywhere; }
.zs-ci__a { display: inline-block; margin-top: 11px; font-size: 18px; letter-spacing: .05em; text-decoration: underline !important; text-underline-offset: 4px; }
.zs-form { display: grid; gap: 35px; }
.zs-form__t { margin-top: -10px; margin-bottom: 5px; }
.zs-form__fila { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px; }
.zs-form label { display: grid; gap: 15px; font-size: 22px; font-weight: 500; line-height: 1.3; }
.zs-form label small { font-size: 16px; font-weight: 400; color: var(--zs-gris); }
.zs-form input:not([type=checkbox]), .zs-form select, .zs-form textarea {
  width: 100%; min-width: 0; height: 66px; padding: 0 20px 2px; font: 400 20px/1.3 var(--zs-f); color: #fff;
  background: transparent; border: 1px solid rgba(255, 255, 255, .5); border-radius: var(--zs-radio); transition: border-color .27s;
}
.zs-form textarea { height: auto; min-height: 150px; padding: 16px 20px; resize: vertical; }
.zs-form select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, #fff 50%), linear-gradient(135deg, #fff 50%, transparent 50%); background-position: calc(100% - 26px) 50%, calc(100% - 20px) 50%; background-size: 6px 6px; background-repeat: no-repeat; padding-right: 48px; }
.zs-form select option, .zs-form select optgroup { background: var(--zs-negro-2); color: #fff; }
.zs-form input:hover, .zs-form select:hover, .zs-form textarea:hover { border-color: rgba(255, 255, 255, .75); }
.zs-form input:focus, .zs-form select:focus, .zs-form textarea:focus { border-color: #fff; outline: none; }
.zs-form ::placeholder { color: rgba(255, 255, 255, .55); }
.zs-form__pie { display: flex; align-items: center; justify-content: space-between; gap: 30px; flex-wrap: wrap; }
.zs-acepto { display: flex !important; align-items: flex-start; gap: 12px !important; max-width: 380px; font-size: 14px !important; font-weight: 500 !important; line-height: 1.53 !important; color: var(--zs-gris); }
.zs-acepto input { width: 20px; height: 20px; margin: 0; flex: none; accent-color: var(--zs-verde); }
.zs-acepto a { text-decoration: underline; color: #fff; }
@media (max-width: 1100px) { .zs-contacto { grid-template-columns: 1fr; gap: 56px; } .zs-contacto__tarjeta { max-width: 640px; } }
@media (max-width: 640px) {
  .zs-contacto__tarjeta { padding: 32px 24px; gap: 30px; }
  .zs-form__fila { grid-template-columns: 1fr; }
  .zs-form label { font-size: 19px; }
  .zs-form input:not([type=checkbox]), .zs-form select { height: 58px; font-size: 18px; }
}

/* ── pie: llamada grande a la izquierda, menú de 28 a la derecha ── */
.zs-pie { padding: var(--zs-sec) 0 50px; border-top: 1px solid var(--zs-filete); }
.zs-pie__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 520px); gap: 60px; }
.zs-pie__cta .zs-t-s2 { margin-bottom: 40px; max-width: 560px; }
.zs-pie__dir { max-width: 560px; margin-top: 40px; font-size: 17px; font-style: normal; line-height: 1.6; color: var(--zs-gris); }
.zs-pie__dir a { text-decoration: underline; text-underline-offset: 3px; }
.zs-pie__dir a:hover { color: #fff; }
.zs-pie__menu { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px; }
.zs-pie__menu li + li { margin-top: 10px; }
.zs-pie__menu ul:first-child a { font-size: 28px; line-height: 1.3; }
.zs-pie__menu ul:last-child a { font-size: 20px; line-height: 1.45; color: var(--zs-gris); }
.zs-pie__menu a { background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size .27s; }
.zs-pie__menu a:hover { background-size: 100% 1px; }
.zs-pie__fin { display: flex; justify-content: space-between; gap: 20px; flex-wrap: wrap; margin-top: 90px; font-size: 15px; color: var(--zs-gris); }
@media (max-width: 991px) { .zs-pie__grid { grid-template-columns: 1fr; gap: 50px; } }
@media (max-width: 480px) { .zs-pie__menu { grid-template-columns: 1fr; } .zs-pie__menu ul:first-child a { font-size: 24px; } }

/* ── páginas interiores: cabeza centrada (hs-title-9 + hs-descr) sobre degradado gris ── */
.zs-cabeza { padding: 65px 0 var(--zs-sec); background: linear-gradient(0deg, var(--zs-negro-2) 0, rgba(24, 24, 24, 0) 100%); }
.zs-cabeza .zs-t-hero { margin-bottom: 10px; }
.zs-migas { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 30px; font-size: 16px; color: var(--zs-gris); }
.zs-migas a:hover { color: #fff; }
.zs-sep { color: rgba(255, 255, 255, .5); }

/* pestañas por línea (tpl-minimal-tabs del concepto: píldoras, activa en verde) */
.zs-pestanas-env { position: sticky; top: calc(env(safe-area-inset-top, 0px) + var(--zs-cab)); z-index: 40; background: var(--zs-negro); border-bottom: 1px solid var(--zs-filete); }
.zs-pestanas { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; padding: 18px 0; }
.zs-pestana { padding: 9px 20px; border: 1px solid rgba(255, 255, 255, .3); border-radius: 100px; background: transparent; color: #fff; font-size: 16px; font-weight: 500; line-height: 1.3; transition: background-color .2s, border-color .2s; }
.zs-pestana:hover { border-color: #fff; }
.zs-pestana.zs-activo { background: var(--zs-verde-aa); border-color: var(--zs-verde-aa); }
@media (max-width: 640px) { .zs-pestanas { flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; scrollbar-width: none; margin: 0 calc(-1 * var(--zs-canal)); padding: 14px var(--zs-canal); } .zs-pestana { flex: none; } }

.zs-familia { padding: var(--zs-sec) 0 0; scroll-margin-top: calc(var(--zs-cab) + 80px); }
.zs-familia:last-of-type { padding-bottom: 0; }
.zs-familia ~ .zs-sec--ayuda { margin-top: var(--zs-sec); }   /* el aire de sección también arriba del filete: las tarjetas no se apoyan en él */
.zs-familia__cab { display: grid; grid-template-columns: minmax(0, 520px) minmax(0, 1fr); gap: 70px; align-items: center; margin-bottom: 60px; }
.zs-familia__foto { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--zs-radio); }
.zs-familia__cab .zs-t-s2 { margin-bottom: 20px; }
.zs-familia__desde { margin-top: 24px; font-size: 20px; font-weight: 500; }
@media (max-width: 991px) { .zs-familia__cab { grid-template-columns: 1fr; gap: 36px; } .zs-familia__foto { max-width: 640px; } }

/* tabla de complementarios: filetes del sistema, precio a la derecha */
.zs-tabla-env { overflow-x: auto; }
.zs-tabla { width: 100%; border-collapse: collapse; }
.zs-tabla thead th { padding: 0 20px 18px 0; font-size: 14px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; color: var(--zs-gris); text-align: left; border-bottom: 1px solid var(--zs-filete-2); }
.zs-tabla td, .zs-tabla tbody th { padding: 26px 20px 26px 0; border-bottom: 1px solid var(--zs-filete); vertical-align: middle; text-align: left; }
.zs-tabla tbody th { width: 30%; font-size: 21px; font-weight: 500; line-height: 1.3; }
.zs-tabla tbody th a:hover { color: var(--zs-verde-claro); }
.zs-tabla td { font-size: 16px; line-height: 1.55; color: var(--zs-gris); }
.zs-tabla__precio { width: 170px; font-size: 24px !important; font-weight: 500; line-height: 1.2 !important; color: #fff !important; white-space: nowrap; font-variant-numeric: tabular-nums; }
.zs-tabla__precio small { display: block; margin-top: 4px; font-size: 14px; font-weight: 400; color: var(--zs-gris); }
.zs-tabla__precio .zs-tabla__desde { display: inline; margin: 0 4px 0 0; }
.zs-tabla td:last-child { width: 1%; padding-right: 0; text-align: right; }
@media (max-width: 767px) {
  .zs-tabla, .zs-tabla tbody, .zs-tabla tr, .zs-tabla td, .zs-tabla tbody th { display: block; width: auto !important; }
  .zs-tabla thead { display: none; }
  .zs-tabla tr { padding: 24px 0; border-bottom: 1px solid var(--zs-filete); display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px 16px; }
  .zs-tabla td, .zs-tabla tbody th { padding: 0; border: 0; }
  .zs-tabla tbody th, .zs-tabla td:nth-child(2) { grid-column: 1 / -1; }
  .zs-tabla td:last-child { align-self: end; }
}

/* ── ficha ── */
.zs-ficha { padding: 60px 0 var(--zs-sec); }
.zs-t-nivel { display: block; color: var(--zs-verde-claro); }
.zs-ficha__grid { display: grid; grid-template-columns: minmax(0, 630px) minmax(0, 1fr); gap: 70px; align-items: start; }
.zs-ficha__txt .zs-t-s1 { margin-bottom: 36px; }
.zs-precio--ficha { align-items: flex-start; padding: 0 0 0 .8em; border: 0; margin-bottom: 10px; }
.zs-ficha__iva { font-size: 16px; color: var(--zs-gris); margin-bottom: 30px; }
.zs-ficha__desc { font-size: 20px; line-height: 1.6; margin-bottom: 40px; }
.zs-ficha__acciones { display: flex; align-items: center; gap: 30px; flex-wrap: wrap; }
.zs-ficha__foto { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--zs-radio); }
.zs-ficha__inc { margin-top: 90px; padding-top: 60px; border-top: 1px solid var(--zs-filete); }
.zs-ficha__inc .zs-t-s3 { margin-bottom: 30px; }
.zs-lista--dos { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 50px; }
.zs-lista--dos li { font-size: 18px; }
.zs-sec--hermanos { padding-top: 0; }
.zs-sec--hermanos .zs-t-s2 { margin-bottom: 50px; }
@media (max-width: 991px) { .zs-ficha__grid { grid-template-columns: 1fr; gap: 50px; } .zs-ficha__foto { max-width: 560px; aspect-ratio: 3 / 2; } }
@media (max-width: 640px) { .zs-lista--dos { grid-template-columns: 1fr; } }

.zs-sec--ayuda { border-top: 1px solid var(--zs-filete); }
.zs-sec--ayuda .zs-t-descr { margin-bottom: 40px; }

/* ── preguntas frecuentes (toggle) ── */
.zs-faq { margin-top: 60px; border-top: 1px solid var(--zs-filete); }
.zs-faq__item { border-bottom: 1px solid var(--zs-filete); }
.zs-faq__p { display: flex; justify-content: space-between; align-items: center; gap: 20px; width: 100%; padding: 22px 0; background: none; border: 0; color: #fff; font-size: 20px; font-weight: 500; line-height: 1.4; text-align: left; letter-spacing: -.004em; }
.zs-faq__p .zs-ico { font-size: 22px; color: var(--zs-verde); transition: transform .27s; }
.zs-faq__p[aria-expanded="true"] .zs-ico { transform: rotate(180deg); }
.zs-faq__r { padding: 0 40px 24px 0; font-size: 18px; line-height: 1.625; color: var(--zs-gris); }

/* ── menú móvil ── */
.zs-movil { position: fixed; inset: var(--zs-cab) 0 0; z-index: 60; padding: 40px var(--zs-canal); background: var(--zs-negro); overflow-y: auto; }
.zs-movil nav { display: grid; gap: 18px; margin-bottom: 40px; }
.zs-movil nav a { font-size: 30px; font-weight: 500; letter-spacing: -.02em; }
.zs-movil p { color: var(--zs-gris); font-size: 17px; }

/* ═══════════════════════════════════════════════════════════════════
   Piezas que sólo existen en el sitio (la maqueta no las necesita):
   Satoshi alojada con sus reservas medidas, salto al contenido, menú del
   teléfono accesible, idioma, avisos del formulario, textos legales, 404 y
   las pantallas de WooCommerce en modo oscuro. Mismos tokens de la maqueta.
   ═══════════════════════════════════════════════════════════════════ */

/* Satoshi (Fontshare, ITF FFL 2.0): el archivo oficial ENTERO; la licencia no permite recortarlo. */
@font-face { font-family: 'Satoshi'; src: url('../fonts/Satoshi-Variable.woff2') format('woff2'); font-weight: 300 900; font-style: normal; font-display: swap; }
/* Reservas medidas sobre los textos del documento (ancho medio y métricas verticales), para que el
   texto no salte cuando llega la fuente: Arial en escritorio e iOS; Roboto en Android. Dos caras por
   reserva: la del texto (400) y la de los títulos (500), porque Satoshi 500 es más ancha. */
@font-face { font-family: 'Satoshi Reserva'; src: local('Arial'), local('ArialMT'); font-weight: 300 450; size-adjust: 98.89%; ascent-override: 102.13%; descent-override: 24.27%; line-gap-override: 10.11%; }
@font-face { font-family: 'Satoshi Reserva'; src: local('Arial'), local('ArialMT'); font-weight: 451 900; size-adjust: 101.72%; ascent-override: 99.29%; descent-override: 23.59%; line-gap-override: 9.83%; }
@font-face { font-family: 'Satoshi Reserva R'; src: local('Roboto'), local('Roboto-Regular'); font-weight: 300 450; size-adjust: 98.87%; ascent-override: 102.15%; descent-override: 24.27%; line-gap-override: 10.11%; }
@font-face { font-family: 'Satoshi Reserva R'; src: local('Roboto'), local('Roboto-Regular'); font-weight: 451 900; size-adjust: 101.7%; ascent-override: 99.31%; descent-override: 23.6%; line-gap-override: 9.83%; }
:root { --zs-f: 'Satoshi', 'Satoshi Reserva', 'Satoshi Reserva R', system-ui, -apple-system, 'Segoe UI', sans-serif; }
/* Bricks fija la raíz en 62.5 % y encoge lo que se mide en rem. */
html { font-size: 100%; }
html.zs-sin-scroll { overflow: hidden; }
body { margin: 0; font-family: var(--zs-f); }   /* lo que un plugin pinta fuera de .zs-sitio (el aviso de cookies) hereda la letra */
.zs-nb { white-space: nowrap; }                   /* palabras con guion: zs_nw() */

.zs-saltar { position: absolute; left: 16px; top: -80px; z-index: 100; background: #fff; color: #121212 !important; padding: 12px 18px; border-radius: var(--zs-radio); font-size: 16px; font-weight: 500; }
.zs-saltar:focus { top: 12px; }
main:focus { outline: none; }

/* ── idioma: dos enlaces; el actual, pleno; el otro, en el gris del sistema (pasa AA sobre negro) ── */
.zs-idioma { display: inline-flex; align-items: center; gap: 0; white-space: nowrap; }
.zs-idioma a { color: var(--zs-gris); }
.zs-idioma a[aria-current] { color: #fff; }
.zs-idioma a:hover { color: #fff; }
.zs-idioma > span { color: var(--zs-gris); padding: 0 .35em; }
.zs-cab__util .zs-cab__tel { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }

/* ── menú del teléfono ── */
.zs-movil[hidden] { display: none !important; }
.zs-movil nav a { display: block; padding: 4px 0; }
.zs-movil__idioma { margin-top: 24px; font-size: 18px; }

/* ── formularios ── */
.zs-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.zs-aviso { margin: 0; padding: 14px 18px; border-radius: var(--zs-radio); font-size: 17px; font-weight: 500; line-height: 1.45; }
.zs-aviso--ok { background: rgba(17, 157, 96, .16); border: 1px solid var(--zs-verde); color: #fff; }
.zs-aviso--error { background: rgba(202, 52, 107, .16); border: 1px solid #E0628F; color: #fff; }
.zs-contacto__fondo { filter: brightness(.5); }
.zs-form { scroll-margin-top: calc(var(--zs-cab) + 24px); }
#formulario { scroll-margin-top: calc(var(--zs-cab) + 24px); }

/* ── cabeza de páginas interiores: nota, acciones y el 404 ── */
.zs-cabeza__nota { margin-top: 18px; color: var(--zs-gris); font-size: 16px; text-align: center; }
.zs-cabeza__acciones { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 20px 30px; margin-top: 40px; }
.zs-404__n { margin-bottom: 10px; font-size: clamp(96px, 16vw, 180px); font-weight: 500; line-height: 1; letter-spacing: -.05em; text-align: center; color: var(--zs-verde-claro); }

/* ── textos legales ── */
.zs-legal { display: grid; gap: 14px; font-size: 18px; line-height: 1.7; color: rgba(255, 255, 255, .85); }
.zs-legal > * { margin: 0 !important; }
.zs-legal h2 { margin-top: 30px !important; font-size: clamp(24px, 1rem + .8vw, 28px); font-weight: 500; line-height: 1.25; letter-spacing: -.015em; color: #fff; }
.zs-legal strong { color: #fff; font-weight: 500; }
.zs-legal ul, .zs-legal ol { display: grid; gap: 8px; padding-left: 22px; }
.zs-legal ul { list-style: disc; }
.zs-legal li::marker { color: var(--zs-verde-claro); }
.zs-legal a { color: var(--zs-verde-claro); text-decoration: underline; text-underline-offset: 3px; }
.zs-legal a:hover { color: #fff; }
.zs-legal table { width: 100%; border-collapse: collapse; font-size: 16px; line-height: 1.5; }
.zs-legal th, .zs-legal td { padding: 14px 16px; text-align: left; vertical-align: top; border: 1px solid var(--zs-filete-2); }
.zs-legal thead th { background: var(--zs-negro-2); color: #fff; font-weight: 500; }

/* ═══ WooCommerce (carrito, pago, pedido recibido) en el modo oscuro de Resonance ═══ */
.zs-woo__cuerpo { padding-bottom: var(--zs-sec); }
.zs-woo, .zs-woo .wc-block-components-main, .zs-woo .wc-block-components-sidebar { color: #fff; }
.zs-woo .has-text-align-center { text-align: center; }
.zs-woo a:not(.zs-btn):not(.wc-block-components-button) { color: var(--zs-verde-claro); }
/* un enlace dentro de un renglón no se distingue sólo por el color */
.zs-woo .wc-block-checkout__terms a, .zs-woo .wc-block-components-notice-banner a { text-decoration: underline; text-underline-offset: 2px; }
.zs-woo .wc-block-components-product-name { color: #fff !important; font-size: 20px; font-weight: 500; line-height: 1.3; text-decoration: none; }
.zs-woo .wc-block-components-product-metadata__description { display: none; }
.zs-woo .wc-block-components-product-price, .zs-woo .wc-block-formatted-money-amount, .zs-woo .wc-block-components-totals-item__value { font-variant-numeric: tabular-nums; }

/* títulos */
.zs-woo .wc-block-components-checkout-step__title, .zs-woo .wc-block-components-title, .zs-woo .wc-block-cart__totals-title,
.zs-woo .wc-block-cart-items__header, .zs-woo .wc-block-components-order-summary__button-text { color: #fff; font-weight: 500; letter-spacing: -.01em; }
.zs-woo .wc-block-cart-items__header { font-size: 14px; letter-spacing: .1em; text-transform: uppercase; color: var(--zs-gris); }
.zs-woo .wc-block-components-checkout-step__description, .zs-woo .wc-block-components-address-card, .zs-woo .wc-block-components-totals-footer-item-tax,
.zs-woo .wc-block-components-product-metadata, .zs-woo .wc-block-components-checkout-return-to-cart-button { color: var(--zs-gris); }

/* botones: los de la plantilla (esquina 12, verde de AA, 500) */
.zs-woo .wc-block-components-button:not(.is-link), .zs-woo .wc-block-cart__submit-button, .zs-woo .wc-block-components-checkout-place-order-button,
.zs-woo .wp-block-button__link, .zs-woo .button {
  min-height: 60px; padding: 16px 30px; border: 1px solid transparent; border-radius: var(--zs-radio) !important; background: var(--zs-verde-aa) !important;
  color: #fff !important; font: 500 19px/1.1 var(--zs-f); letter-spacing: 0; text-transform: none; text-decoration: none; box-shadow: none;
}
.zs-woo .wc-block-components-button:not(.is-link):hover, .zs-woo .wc-block-cart__submit-button:hover { background: var(--zs-verde-aa-2) !important; }
.zs-woo .wc-block-components-button:not(.is-link):focus-visible { outline: 2px solid var(--zs-verde-claro); outline-offset: 3px; box-shadow: none; }
.zs-woo .wc-block-components-button.is-link { color: var(--zs-verde-claro); }

/* campos: los de la plantilla (filete blanco al 50 %, esquina 12, texto blanco) */
.zs-woo .wc-block-components-text-input input, .zs-woo .wc-block-components-text-input input:-webkit-autofill,
.zs-woo .wc-blocks-components-select .wc-blocks-components-select__select, .zs-woo .wc-block-components-textarea,
.zs-woo .wc-block-components-combobox .wc-block-components-combobox-control input, .zs-woo input.input-text, .zs-woo select {
  background: transparent !important; color: #fff !important; border: 1px solid rgba(255, 255, 255, .5) !important; border-radius: var(--zs-radio) !important;
  -webkit-text-fill-color: #fff; box-shadow: none !important;
}
.zs-woo .wc-block-components-text-input input:-webkit-autofill { -webkit-box-shadow: 0 0 0 60px var(--zs-negro) inset !important; }
.zs-woo .wc-blocks-components-select .wc-blocks-components-select__select option { background: var(--zs-negro-2); color: #fff; }
/* el contenedor de País y Estado trae fondo blanco de WooCommerce: tapaba la etiqueta y el valor */
.zs-woo .wc-blocks-components-select .wc-blocks-components-select__container { background: transparent !important; border-radius: var(--zs-radio); }
.zs-woo .wc-block-components-address-form .wc-block-components-address-form__country { margin-top: 12px; }   /* el mismo aire que los demás campos */
.zs-woo .wc-block-components-text-input input:focus, .zs-woo .wc-blocks-components-select .wc-blocks-components-select__select:focus,
.zs-woo .wc-block-components-textarea:focus, .zs-woo .wc-block-components-combobox .wc-block-components-combobox-control input:focus {
  border-color: #fff !important; outline: 2px solid var(--zs-verde-claro); outline-offset: 1px;
}
.zs-woo .wc-block-components-text-input label, .zs-woo .wc-blocks-components-select__label, .zs-woo .wc-block-components-combobox .wc-block-components-combobox-control label,
.zs-woo .wc-block-components-textarea + label { color: var(--zs-gris) !important; }
.zs-woo .wc-blocks-components-select__expand, .zs-woo .wc-blocks-components-select svg { fill: #fff; color: #fff; }
.zs-woo .wc-block-components-validation-error p, .zs-woo .wc-block-components-validation-error { color: #F08AAE; }
.zs-woo .wc-block-components-text-input.has-error input, .zs-woo .has-error .wc-blocks-components-select__select { border-color: #F08AAE !important; }

/* casillas y opciones de pago */
.zs-woo .wc-block-components-checkbox .wc-block-components-checkbox__input[type=checkbox] { background: transparent; border: 1px solid rgba(255, 255, 255, .6); border-radius: 4px; }
.zs-woo .wc-block-components-checkbox .wc-block-components-checkbox__input[type=checkbox]:checked { background: var(--zs-verde-aa); border-color: var(--zs-verde-aa); }
.zs-woo .wc-block-components-checkbox .wc-block-components-checkbox__mark { fill: #fff; }
.zs-woo .wc-block-components-radio-control__input { background: transparent !important; border: 1px solid rgba(255, 255, 255, .6) !important; }
.zs-woo .wc-block-components-radio-control__input:checked::before { background: var(--zs-verde-claro) !important; }
.zs-woo .wc-block-components-radio-control__option, .zs-woo .wc-block-components-radio-control-accordion-option { color: #fff; }
.zs-woo .wc-block-checkout__payment-method .wc-block-components-radio-control__option,
.zs-woo .wc-block-checkout__payment-method .wc-block-components-radio-control-accordion-option { border-color: var(--zs-filete) !important; border-radius: var(--zs-radio) !important; }
.zs-woo .wc-block-components-radio-control-accordion-content { color: var(--zs-gris); }

/* cantidad y quitar */
.zs-woo .wc-block-components-quantity-selector { border-radius: var(--zs-radio); }
.zs-woo .wc-block-components-quantity-selector::after { border-color: rgba(255, 255, 255, .5) !important; border-radius: var(--zs-radio) !important; }
.zs-woo .wc-block-components-quantity-selector input, .zs-woo .wc-block-components-quantity-selector button { color: #fff !important; background: transparent !important; }
.zs-woo .wc-block-cart-item__remove-link { color: var(--zs-gris) !important; }

/* resumen: la tarjeta de planes (#272727 con filete blanco al 13 %) */
.zs-woo .wp-block-woocommerce-checkout-order-summary-block, .zs-woo .wc-block-cart__sidebar .wc-block-components-sidebar,
.zs-woo .wc-block-cart__totals-title + * { color: #fff; }
.zs-woo .wp-block-woocommerce-checkout-order-summary-block, .zs-woo .wc-block-cart .wc-block-cart__sidebar > .wc-block-components-sidebar-layout__content,
.zs-woo .wc-block-cart__sidebar { background: var(--zs-negro-3); border: 1px solid var(--zs-filete); border-radius: var(--zs-radio); padding: 24px; }
.zs-woo .wc-block-components-totals-wrapper, .zs-woo .wc-block-components-order-summary-item, .zs-woo .wc-block-cart-items td, .zs-woo .wc-block-cart-items th,
.zs-woo .wc-block-components-panel, .zs-woo .wc-block-components-totals-coupon { border-color: var(--zs-filete) !important; }
.zs-woo table.wc-block-cart-items { border-color: var(--zs-filete) !important; }
.zs-woo .wc-block-components-order-summary-item__quantity { background: var(--zs-negro); color: #fff; border-color: rgba(255, 255, 255, .5); box-shadow: none; }
.zs-woo .wc-block-components-order-summary-item__image > img { border-radius: 8px; }
.zs-woo .wc-block-components-order-summary-item .wc-block-components-product-name { font-size: 16px; }
.zs-woo .wc-block-components-totals-item__label, .zs-woo .wc-block-components-totals-item__value { color: #fff; }
.zs-woo .wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
.zs-woo .wc-block-components-totals-footer-item .wc-block-components-totals-item__value { font-size: 22px; font-weight: 500; }

/* avisos */
.zs-woo .wc-block-components-notice-banner { background: var(--zs-negro-2); color: #fff; border: 1px solid var(--zs-filete-2); border-radius: var(--zs-radio); }
.zs-woo .wc-block-components-notice-banner.is-error { border-color: #E0628F; }
.zs-woo .wc-block-components-notice-banner.is-success { border-color: var(--zs-verde); }
.zs-woo .wc-block-components-notice-banner > svg { fill: #fff; background: transparent; }
.woocommerce-notices-wrapper > * { list-style: none; margin: 0 0 20px; padding: 14px 18px; background: var(--zs-negro-2); color: #fff; border: 1px solid var(--zs-filete-2); border-radius: var(--zs-radio); }

/* carrito vacío */
.zs-woo .wc-block-cart__empty-cart__title { margin-top: 10px; font-size: 32px; font-weight: 500; letter-spacing: -.015em; }
.zs-woo .wp-block-woocommerce-empty-cart-block { padding: 20px 0; }
.zs-woo .wp-block-woocommerce-empty-cart-block .has-text-align-center:not(.wc-block-cart__empty-cart__title) { color: var(--zs-gris); }
.zs-woo .wp-block-woocommerce-empty-cart-block .zs-btn { margin-top: 10px; color: #fff; }
.zs-woo .wc-block-cart__empty-cart__title.with-empty-cart-icon::before { background-color: #fff; opacity: .9; }

/* pedido recibido (marcado clásico) */
.zs-woo .woocommerce-order-overview, .zs-woo .woocommerce-order-details, .zs-woo .woocommerce-customer-details {
  margin: 0 0 24px; padding: 28px; list-style: none; background: var(--zs-negro-3); border: 1px solid var(--zs-filete); border-radius: var(--zs-radio);
}
.zs-woo .woocommerce-order-overview li { margin: 0 0 8px; color: var(--zs-gris); }
.zs-woo .woocommerce-order-overview li strong { display: block; color: #fff; font-weight: 500; }
.zs-woo .woocommerce-order-details__title, .zs-woo .woocommerce-column__title { margin-bottom: 14px; font-size: 24px; font-weight: 500; }
.zs-woo table.shop_table { width: 100%; border-collapse: collapse; }
.zs-woo table.shop_table th, .zs-woo table.shop_table td { padding: 12px 0; border-top: 1px solid var(--zs-filete); text-align: left; }
.zs-woo .woocommerce-thankyou-order-received { font-size: 22px; margin-bottom: 24px; }

@media (max-width: 767px) {
  .zs-legal { font-size: 17px; }
  .zs-woo .wc-block-components-product-name { font-size: 18px; }
}

/* Resumen del pedido en el pago: el nombre del servicio corta sólo entre palabras. En tableta la
   columna lateral queda de ~250 px: el resumen sube arriba, a todo lo ancho, como en el teléfono. */
.zs-woo .wc-block-components-order-summary-item .wc-block-components-product-name { overflow-wrap: break-word !important; word-break: normal !important; hyphens: manual; }
@media (min-width: 768px) and (max-width: 1023px) {
  .zs-woo .wc-block-checkout.wc-block-components-sidebar-layout { flex-direction: column; }
  .zs-woo .wc-block-checkout .wc-block-components-main, .zs-woo .wc-block-checkout .wc-block-components-sidebar { width: 100%; padding-left: 0; padding-right: 0; }
  .zs-woo .wc-block-checkout .wc-block-components-sidebar { order: -1; position: static; margin-bottom: 40px; }
}
/* De 1024 a 1199 el lateral aún no da para el total a la derecha: queda el precio bajo el nombre
   y la cantidad sobre la foto; el total de cada renglón ya suma abajo. */
@media (min-width: 1024px) and (max-width: 1199px) {
  .zs-woo .wc-block-components-order-summary-item__total-price { display: none; }
  .zs-woo .wc-block-components-order-summary-item__description { padding-right: 0; }
}