/**
 * superblog · Blog for PrestaShop by Idnovate
 *
 * @author    Idnovate <info@idnovate.com>
 * @copyright 2026 Idnovate
 * @license   Commercial license, see LICENSE.md
 *
 * Bloques de diseño del contenido de una entrada. Se escriben en el editor
 * (botón «Bloques») o llegan por el Webservice:
 *
 *   .sb-media (+ --reverse)     texto + imagen en dos columnas
 *   .sb-figure (+ --wide)       imagen con pie de foto
 *   .sb-callout (--tip, --warning, --info)  recuadro
 *   .sb-callout--key            idea clave (recuadro oscuro)
 *   .sb-steps                   pasos numerados
 *   .sb-stats > .sb-stat        cifras clave
 *   .sb-cards > .sb-card        tarjetas con icono (data-sb-icon="shield"…)
 *   .sb-timeline                línea de tiempo (fechas)
 *   .sb-quote                   cita literal con su fuente
 *   .sb-checklist               lista de comprobación
 *   .sb-columns > .sb-column    dos columnas de texto (p. ej. antes / después)
 *   .sb-pullquote               frase destacada
 *   .sb-band                    sección con fondo
 *   .sb-cta                     llamada a la acción (con .sb-button)
 *   .sb-product                 ficha de producto (data-sb-product="ID")
 *   .sb-faq                     preguntas frecuentes desplegables
 *   table.sb-compare            comparativa (.sb-highlight resalta una columna)
 *
 * Usan las variables de superblog.css (--sb-accent, --sb-radius…).
 */
.sb {
  --sb-wide: 66rem;
  --sb-tint: color-mix(in srgb, var(--sb-accent) 9%, var(--sb-surface));
  --sb-tint-strong: color-mix(in srgb, var(--sb-accent) 18%, var(--sb-surface));
  --sb-ink-accent: color-mix(in srgb, var(--sb-accent) 70%, #000);
  --sb-tip: #1f7a4d;
  --sb-warning: #a5530a;
  --sb-info: #2457a6;
  --sb-block-space: 2.25rem;
}

/* El texto y los bloques ocupan todo el ancho de la columna del contenido. */
.sb-post__content { max-width: var(--sb-wide); }

/* ---------- Imagen ---------- */
.sb-figure,
.sb-media__figure { margin: 0; }
.sb-figure { margin: var(--sb-block-space) 0; }
.sb-figure img,
.sb-media__figure img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--sb-radius);
  background: var(--sb-soft);
}
.sb-post__content figcaption {
  margin-top: 0.6rem;
  font-size: 0.875rem;
  line-height: 1.45;
  color: var(--sb-muted);
}
.sb-credit { font-size: 0.75rem; letter-spacing: 0.01em; white-space: nowrap; opacity: 0.85; }
.sb-credit a { color: inherit; }

/* ---------- Texto + imagen ---------- */
.sb-media {
  display: grid;
  gap: 1.25rem 2.5rem;
  align-items: center;
  margin: var(--sb-block-space) 0;
}
.sb-media__body > :first-child { margin-top: 0; }
.sb-media__body > :last-child { margin-bottom: 0; }
@media (min-width: 768px) {
  .sb-media { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); }
  .sb-media--reverse { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); }
  .sb-media--reverse .sb-media__figure { order: 2; }
  .sb-media--text { grid-template-columns: 1fr; }
}

/* ---------- Recuadros ---------- */
.sb-callout {
  --sb-callout: var(--sb-accent);
  position: relative;
  margin: var(--sb-block-space) 0;
  padding: 1.1rem 1.25rem 1.1rem 1.4rem;
  border-radius: var(--sb-radius);
  background: color-mix(in srgb, var(--sb-callout) 8%, var(--sb-surface));
  box-shadow: inset 4px 0 0 var(--sb-callout);
}
.sb-callout--tip { --sb-callout: var(--sb-tip); }
.sb-callout--warning { --sb-callout: var(--sb-warning); }
.sb-callout--info { --sb-callout: var(--sb-info); }
.sb-callout > :last-child { margin-bottom: 0; }
.sb-callout__title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0 0 0.35rem;
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--sb-callout) 85%, #000);
}
.sb-callout__title::before {
  content: '';
  flex: 0 0 auto;
  width: 1.1rem;
  height: 1.1rem;
  background: currentColor;
  -webkit-mask: var(--sb-callout-icon) center / contain no-repeat;
  mask: var(--sb-callout-icon) center / contain no-repeat;
}
.sb-callout { --sb-callout-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 11v5M12 8h.01'/%3E%3C/svg%3E"); }
.sb-callout--tip { --sb-callout-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18h6M10 21h4M12 3a6 6 0 0 0-3.6 10.8c.6.5 1 1.2 1.1 2h5c.1-.8.5-1.5 1.1-2A6 6 0 0 0 12 3z'/%3E%3C/svg%3E"); }
.sb-callout--key { --sb-callout-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12 3.5 2.6 5.3 5.9.9-4.3 4.1 1 5.8-5.2-2.7-5.2 2.7 1-5.8-4.3-4.1 5.9-.9z'/%3E%3C/svg%3E"); }
.sb-callout--warning { --sb-callout-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3 2 20h20L12 3z'/%3E%3Cpath d='M12 10v4M12 17h.01'/%3E%3C/svg%3E"); }

/* Idea clave: recuadro oscuro, para lo que el lector tiene que llevarse. */
.sb-callout--key {
  padding: 1.3rem 1.5rem;
  border-radius: calc(var(--sb-radius) * 2);
  color: rgba(255, 255, 255, 0.86);
  background: color-mix(in srgb, var(--sb-accent) 22%, #0b1424);
  box-shadow: none;
}
.sb-callout--key .sb-callout__title { color: color-mix(in srgb, var(--sb-accent) 45%, #fff); }
.sb-callout--key :is(strong, b, a) { color: #fff; }

/* ---------- Pasos ---------- */
.sb-steps {
  margin: var(--sb-block-space) 0;
  padding: 0;
  list-style: none;
  counter-reset: sb-step;
}
.sb-steps > li {
  position: relative;
  margin: 0 0 0.65rem;
  padding: 1rem 1.25rem 1rem 4rem;
  border-radius: calc(var(--sb-radius) * 1.5);
  background: var(--sb-tint);
  counter-increment: sb-step;
}
.sb-steps > li::before {
  content: counter(sb-step);
  position: absolute;
  top: 0.9rem;
  left: 1.1rem;
  display: grid;
  place-items: center;
  width: 2.1rem;
  height: 2.1rem;
  border-radius: 50%;
  font-weight: 700;
  font-size: 0.95rem;
  font-variant-numeric: tabular-nums;
  color: #fff;
  background: var(--sb-accent);
}
.sb-steps > li:last-child { margin-bottom: 0; }
.sb-steps > li > .sb-steps__title { display: block; margin-bottom: 0.15rem; }
.sb-steps > li > :last-child { margin-bottom: 0; }

/* ---------- Cifras ---------- */
.sb-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr));
  gap: 0.75rem;
  margin: var(--sb-block-space) 0;
}
.sb-stat {
  padding: 1.25rem 1.35rem 1.15rem;
  border-radius: calc(var(--sb-radius) * 1.5);
  background: var(--sb-tint);
}
.sb-stat p { margin: 0; }
.sb-stat__value {
  font-size: clamp(2rem, 1.4rem + 2vw, 2.9rem);
  font-weight: 800;
  line-height: 1.05;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
  color: var(--sb-ink-accent);
}
.sb-stat__label { margin-top: 0.4rem !important; font-size: 0.9375rem; line-height: 1.4; color: var(--sb-muted); }

/* ---------- Tarjetas con icono ---------- */
.sb-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
  gap: 0.875rem;
  margin: var(--sb-block-space) 0;
}
.sb-card {
  --sb-icon-box: 2.75rem;
  position: relative;
  padding: 1.15rem 1.25rem 1.2rem;
  border: 1px solid color-mix(in srgb, var(--sb-accent) 20%, var(--sb-line));
  border-radius: calc(var(--sb-radius) * 1.5);
  background: var(--sb-surface);
}
.sb-card[data-sb-icon]::before {
  content: '';
  display: block;
  width: var(--sb-icon-box);
  height: var(--sb-icon-box);
  margin-bottom: 0.8rem;
  border-radius: calc(var(--sb-radius) * 1.25);
  background: var(--sb-tint);
}
.sb-card[data-sb-icon]::after {
  content: '';
  position: absolute;
  top: calc(1.15rem + var(--sb-icon-box) * 0.25);
  left: calc(1.25rem + var(--sb-icon-box) * 0.25);
  width: calc(var(--sb-icon-box) * 0.5);
  height: calc(var(--sb-icon-box) * 0.5);
  background: var(--sb-ink-accent);
  -webkit-mask: var(--sb-icon) center / contain no-repeat;
  mask: var(--sb-icon) center / contain no-repeat;
}
.sb-post__content .sb-card > :is(h3, h4) { margin: 0 0 0.3rem; font-size: 1.0625rem; font-weight: 700; line-height: 1.3; }
.sb-post__content .sb-card > p { margin: 0; font-size: 0.9375rem; line-height: 1.55; color: var(--sb-muted); }
/* Sin icono conocido: una marca de verificación. */
.sb-card { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E"); }
/* iconos:inicio (generado por tests/scripts/icons.py) */
.sb-card[data-sb-icon="check"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="shield"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3 4.5 6v5.5c0 4.6 3.2 8.2 7.5 9.5 4.3-1.3 7.5-4.9 7.5-9.5V6z'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="lock"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='10' rx='2'/%3E%3Cpath d='M8 11V8a4 4 0 0 1 8 0v3'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="key"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='15' r='4'/%3E%3Cpath d='m10.8 12.2 8.2-8.2M16 7l3 3M14 9l2 2'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="clock"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="calendar"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='5' width='16' height='16' rx='2'/%3E%3Cpath d='M4 10h16M8 3v4M16 3v4'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="bell"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 16v-5a6 6 0 0 1 12 0v5l1.5 2h-15z'/%3E%3Cpath d='M10 21h4'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="mail"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3.5 6.5 8.5 6.5 8.5-6.5'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="chat"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5h16v11H9l-5 4z'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="chart"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20h16M7 16v-5M12 16V7M17 16V9'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="money"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='6' width='18' height='12' rx='2'/%3E%3Ccircle cx='12' cy='12' r='2.5'/%3E%3Cpath d='M6.5 9.5h.01M17.5 14.5h.01'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="percent"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 5 5 19'/%3E%3Ccircle cx='7' cy='7' r='2.5'/%3E%3Ccircle cx='17' cy='17' r='2.5'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="cart"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1.3'/%3E%3Ccircle cx='17' cy='20' r='1.3'/%3E%3Cpath d='M3 4h2.5l2.2 11h10.6L20.5 8H6.6'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="truck"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h11v10H3zM14 9h4l3 3.5V16h-7'/%3E%3Ccircle cx='7' cy='17.5' r='1.8'/%3E%3Ccircle cx='17' cy='17.5' r='1.8'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="box"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3 20 7.5v9L12 21l-8-4.5v-9z'/%3E%3Cpath d='M4 7.5 12 12l8-4.5M12 12v9'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="return"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 14 4 9l5-5'/%3E%3Cpath d='M4 9h10.5a5.5 5.5 0 0 1 0 11H11'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="globe"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3c2.5 2.6 3.8 5.6 3.8 9s-1.3 6.4-3.8 9c-2.5-2.6-3.8-5.6-3.8-9S9.5 5.6 12 3z'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="settings"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7h10M18 7h2M4 17h4M12 17h8'/%3E%3Ccircle cx='16' cy='7' r='2'/%3E%3Ccircle cx='10' cy='17' r='2'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="user"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4.5 20a7.5 7.5 0 0 1 15 0'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="users"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8' r='3.5'/%3E%3Cpath d='M2.5 20a6.5 6.5 0 0 1 13 0M16 4.6a3.5 3.5 0 0 1 0 6.8M18 14a6.5 6.5 0 0 1 3.5 6'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="document"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h8l4 4v14H6z'/%3E%3Cpath d='M14 3v4h4M9 12h6M9 16h6'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="qr"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='4' width='6' height='6' rx='1'/%3E%3Crect x='14' y='4' width='6' height='6' rx='1'/%3E%3Crect x='4' y='14' width='6' height='6' rx='1'/%3E%3Cpath d='M14 14h2v2h-2zM18 18h2v2h-2zM14 20h2M20 14v2'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="scale"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v16M8 20h8M5 7h14'/%3E%3Cpath d='M5 7 2.5 13a2.5 2.5 0 0 0 5 0zM19 7l-2.5 6a2.5 2.5 0 0 0 5 0z'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="bolt"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 3 5 13.5h6L10 21l8-10.5h-6z'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="sync"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 11a8 8 0 0 0-14.5-4.5L4 8M4 4v4h4'/%3E%3Cpath d='M4 13a8 8 0 0 0 14.5 4.5L20 16M20 20v-4h-4'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="search"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='6.5'/%3E%3Cpath d='m16 16 4.5 4.5'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="tag"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 12.5V4h8.5l8.5 8.5-8 8z'/%3E%3Ccircle cx='8' cy='8.5' r='1.3'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="star"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12 3.5 2.6 5.3 5.9.9-4.3 4.1 1 5.8-5.2-2.7-5.2 2.7 1-5.8-4.3-4.1 5.9-.9z'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="alert"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3 2 20h20L12 3z'/%3E%3Cpath d='M12 10v4M12 17h.01'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="link"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 14a4.5 4.5 0 0 0 6.4 0l3-3a4.5 4.5 0 0 0-6.4-6.4l-1 1'/%3E%3Cpath d='M14 10a4.5 4.5 0 0 0-6.4 0l-3 3a4.5 4.5 0 0 0 6.4 6.4l1-1'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="mobile"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='7' y='3' width='10' height='18' rx='2'/%3E%3Cpath d='M11 18h2'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="print"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 9V3h10v6'/%3E%3Crect x='3' y='9' width='18' height='8' rx='2'/%3E%3Cpath d='M7 14h10v7H7z'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="cloud"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 19a4.5 4.5 0 0 1-.6-9A6 6 0 0 1 18 9.5a4.8 4.8 0 0 1-.5 9.5z'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="database"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cellipse cx='12' cy='5.5' rx='7' ry='2.5'/%3E%3Cpath d='M5 5.5v13c0 1.4 3.1 2.5 7 2.5s7-1.1 7-2.5v-13M5 12c0 1.4 3.1 2.5 7 2.5s7-1.1 7-2.5'/%3E%3C/svg%3E"); }
.sb-card[data-sb-icon="eye"] { --sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 12S6 5.5 12 5.5 21.5 12 21.5 12 18 18.5 12 18.5 2.5 12 2.5 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E"); }
/* iconos:fin */

/* ---------- Línea de tiempo ---------- */
.sb-timeline {
  margin: var(--sb-block-space) 0;
  padding: 0;
  list-style: none;
}
.sb-timeline > li { position: relative; margin: 0; padding: 0 0 1.35rem 2rem; }
.sb-timeline > li:last-child { padding-bottom: 0; }
.sb-timeline > li::before {
  content: '';
  position: absolute;
  top: 0.3rem;
  left: 0;
  box-sizing: border-box;
  width: 0.95rem;
  height: 0.95rem;
  border: 3px solid var(--sb-accent);
  border-radius: 50%;
  background: var(--sb-surface);
}
.sb-timeline > li:not(:last-child)::after {
  content: '';
  position: absolute;
  top: 1.45rem;
  bottom: 0.15rem;
  left: calc(0.475rem - 1px);
  width: 2px;
  background: var(--sb-tint-strong);
}
.sb-post__content .sb-timeline p { margin: 0; }
.sb-post__content .sb-timeline .sb-timeline__date { margin-bottom: 0.2rem; font-weight: 800; font-variant-numeric: tabular-nums; color: var(--sb-ink-accent); }
@media (min-width: 768px) {
  .sb-timeline { display: grid; grid-auto-columns: minmax(0, 1fr); grid-auto-flow: column; gap: 1.5rem; }
  .sb-timeline > li { padding: 1.75rem 0 0; }
  .sb-timeline > li:not(:last-child)::after { top: calc(0.775rem - 1px); right: -1.4rem; bottom: auto; left: 1.25rem; width: auto; height: 2px; }
}

/* ---------- Cita con fuente ---------- */
.sb-quote {
  position: relative;
  margin: var(--sb-block-space) 0;
  padding: 1.5rem 1.6rem 1.35rem 4.25rem;
  border-radius: calc(var(--sb-radius) * 2);
  background: var(--sb-tint);
}
.sb-quote::before {
  content: '\201C';
  position: absolute;
  top: 0.75rem;
  left: 1.25rem;
  font: 700 4rem/1 Georgia, 'Times New Roman', serif;
  color: var(--sb-accent);
}
.sb-post__content .sb-quote blockquote {
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  font-size: clamp(1.0625rem, 1rem + 0.35vw, 1.25rem);
  font-style: normal;
  line-height: 1.55;
  color: inherit;
}
.sb-quote blockquote > :last-child { margin-bottom: 0; }
.sb-post__content .sb-quote figcaption { margin-top: 0.8rem; font-size: 0.875rem; }
.sb-quote figcaption a { color: inherit; text-decoration: underline; }

/* ---------- Lista de comprobación ---------- */
.sb-checklist { margin: 1.5rem 0; padding: 0; list-style: none; }
.sb-checklist > li { position: relative; margin: 0.55rem 0; padding-left: 2rem; }
.sb-checklist > li::before {
  content: '';
  position: absolute;
  top: 0.2em;
  left: 0;
  width: 1.3rem;
  height: 1.3rem;
  border-radius: 50%;
  background: var(--sb-tint-strong) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-opacity='.75' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4 8-9'/%3E%3C/svg%3E") center / 0.8rem no-repeat;
}

/* ---------- Dos columnas de texto ---------- */
.sb-columns { display: grid; gap: 1rem; margin: var(--sb-block-space) 0; }
@media (min-width: 768px) { .sb-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.sb-column {
  padding: 1.25rem 1.35rem;
  border: 1px solid var(--sb-line);
  border-radius: var(--sb-radius);
  background: var(--sb-surface);
}
.sb-column:nth-child(2) { border-color: color-mix(in srgb, var(--sb-accent) 35%, transparent); background: var(--sb-tint); }
.sb-column > :first-child { margin-top: 0; }
.sb-column > :last-child { margin-bottom: 0; }
.sb-column h3 { font-size: 1.1rem; }

/* ---------- Frase destacada ---------- */
.sb-post__content .sb-pullquote {
  margin: var(--sb-block-space) 0;
  padding: 0.25rem 0 0.25rem 1.5rem;
  border-left: 0;
  box-shadow: inset 3px 0 0 var(--sb-accent);
  font-size: clamp(1.25rem, 1.05rem + 0.8vw, 1.6rem);
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: -0.01em;
  text-wrap: balance;
}
.sb-pullquote > :last-child { margin-bottom: 0; }

/* ---------- Sección con fondo ---------- */
.sb-band {
  margin: var(--sb-block-space) 0;
  padding: clamp(1.25rem, 0.8rem + 2vw, 2.25rem);
  border-radius: calc(var(--sb-radius) * 2);
  background: var(--sb-tint);
}
.sb-band > * { max-width: var(--sb-measure); }
.sb-band > :first-child { margin-top: 0; }
.sb-band > :last-child { margin-bottom: 0; }

/* ---------- Llamada a la acción ---------- */
.sb-cta {
  margin: var(--sb-block-space) 0;
  padding: clamp(1.5rem, 1rem + 2vw, 2.4rem) clamp(1.25rem, 0.8rem + 2vw, 2.5rem);
  text-align: center;
  border-radius: calc(var(--sb-radius) * 2);
  color: #fff;
  background: var(--sb-ink-accent);
}
.sb-cta > :last-child { margin-bottom: 0; }
.sb-cta > p { max-width: 42rem; margin-right: auto; margin-left: auto; }
.sb-post__content .sb-cta .sb-cta__note { margin-top: 0.9rem; font-size: 0.8125rem; opacity: 0.8; }
.sb-cta__title { margin: 0 0 0.5rem; font-size: clamp(1.3rem, 1.1rem + 0.8vw, 1.6rem); font-weight: 700; line-height: 1.25; color: inherit; }
.sb-cta a:not(.sb-button) { color: inherit; }
.sb-cta .sb-button { color: var(--sb-ink-accent); background: #fff; }
.sb-cta .sb-button:hover, .sb-cta .sb-button:focus { color: var(--sb-ink-accent); background: rgba(255, 255, 255, 0.9); }

.sb-button {
  display: inline-block;
  padding: 0.75rem 1.4rem;
  border-radius: var(--sb-radius);
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none !important;
  color: #fff;
  background: var(--sb-accent);
  transition: transform 0.15s ease, background-color 0.15s ease;
}
.sb-button:hover, .sb-button:focus { color: #fff; background: var(--sb-ink-accent); }
.sb-button:active { transform: translateY(1px); }

/* ---------- Ficha de producto ---------- */
.sb-product {
  display: flex;
  gap: 1.25rem;
  align-items: center;
  margin: var(--sb-block-space) 0;
  padding: 1rem;
  border: 1px solid var(--sb-line);
  border-radius: calc(var(--sb-radius) * 1.5);
  background: var(--sb-surface);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04), 0 8px 24px rgba(0, 0, 0, 0.05);
}
.sb-product__media { flex: 0 0 8.5rem; }
.sb-product__media img { display: block; width: 100%; height: auto; border-radius: var(--sb-radius); }
.sb-product__body { flex: 1; min-width: 0; }
.sb-post__content .sb-product p { margin: 0; }
.sb-product__name { font-size: 1.1rem; font-weight: 700; line-height: 1.3; }
.sb-product__text { margin-top: 0.3rem !important; font-size: 0.9375rem; line-height: 1.45; color: var(--sb-muted); }
.sb-product__footer { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem 1.25rem; margin-top: 0.85rem; }
.sb-product__price { font-size: 1.15rem; font-weight: 800; font-variant-numeric: tabular-nums; }
@media (max-width: 575px) {
  .sb-product { flex-direction: column; align-items: stretch; }
  .sb-product__media { flex-basis: auto; max-width: 12rem; }
}

/* ---------- Preguntas frecuentes ---------- */
.sb-faq { margin: var(--sb-block-space) 0; border-top: 1px solid var(--sb-line); }
.sb-faq details { border-bottom: 1px solid var(--sb-line); }
.sb-faq summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 0;
  cursor: pointer;
  list-style: none;
}
.sb-faq summary::-webkit-details-marker { display: none; }
.sb-faq summary::after {
  content: '';
  flex: 0 0 auto;
  width: 0.65rem;
  height: 0.65rem;
  margin-right: 0.3rem;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translateY(-25%) rotate(45deg);
  transition: transform 0.2s ease;
  opacity: 0.6;
}
.sb-faq details[open] summary::after { transform: translateY(15%) rotate(-135deg); }
.sb-faq summary > :is(h2, h3, h4) { margin: 0 !important; font-size: 1.0625rem; line-height: 1.4; }
.sb-faq summary:hover > :is(h2, h3, h4), .sb-faq summary:focus-visible > :is(h2, h3, h4) { color: var(--sb-accent); }
.sb-faq details > :not(summary) { margin: 0 0 1rem; color: inherit; }
.sb-faq details > :last-child { margin-bottom: 1.1rem; }

/* ---------- Tablas ---------- */
.sb-table { margin: var(--sb-block-space) 0; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.sb-table > table { margin: 0 !important; }
.sb-post__content table.sb-compare { border: 0; border-collapse: separate; border-spacing: 0; }
.sb-compare th, .sb-compare td { border: 0 !important; border-bottom: 1px solid var(--sb-line) !important; }
.sb-compare thead th { border-bottom: 2px solid currentColor !important; background: none !important; font-size: 0.875rem; }
.sb-compare tbody th { font-weight: 600; background: none !important; }
.sb-compare .sb-highlight { background: var(--sb-tint) !important; }
.sb-compare thead .sb-highlight { color: var(--sb-ink-accent); border-radius: var(--sb-radius) var(--sb-radius) 0 0; border-bottom-color: var(--sb-accent) !important; }

@media (prefers-reduced-motion: reduce) {
  .sb-faq summary::after, .sb-button { transition: none; }
}