/**
 * Widget "Cómo comprar" — CSS propio y autocontenido, réplica 1:1 de
 * info/como-comprar.php + el bloque .como-comprar-*/.medios-pago-* de
 * style.css del prototipo (comparten layout con Preguntas Frecuentes).
 */
.roger-editor-como-comprar-breadcrumb-wrap { padding-top: 20px; }

.roger-editor-breadcrumb {
    font-size: 13px;
    color: #8d8d8d;
    margin-bottom: 8px;
}
.roger-editor-breadcrumb a { color: #8d8d8d; text-decoration: none; }
.roger-editor-breadcrumb a:hover { color: #6f759c; }
.roger-editor-breadcrumb span { margin: 0 6px; }

.roger-editor-como-comprar {
    padding: 12px 0 4rem;
    font-family: 'Montserrat', sans-serif;
    color: #333333;
}
.roger-editor-como-comprar .roger-editor-como-comprar-wrap { max-width: 800px; }

.roger-editor-como-comprar h1,
.roger-editor-como-comprar h2,
.roger-editor-como-comprar h3 {
    font-family: 'Poppins', sans-serif;
    margin: 0;
}

.roger-editor-como-comprar-cabecera { text-align: center; margin-bottom: 36px; }
.roger-editor-como-comprar-cabecera h1 { font-size: 32px; margin: 10px 0 14px; }
.roger-editor-como-comprar-texto-hero {
    color: #8d8d8d; font-size: 14.5px; line-height: 1.6;
    max-width: 520px; margin: 0 auto;
}

.roger-editor-como-comprar-bloque {
    margin-top: 48px;
    padding-top: 40px;
    border-top: 1px solid #e6e8f0;
}
#como-comprar.roger-editor-como-comprar-bloque {
    margin-top: 0;
    padding-top: 0;
    border-top: none;
}
.roger-editor-como-comprar-subtitulo-pasos { font-size: 24px; margin-bottom: 10px; }
.roger-editor-como-comprar-titulo-pasos { font-size: 16px; color: #333333; margin-bottom: 16px; }

.roger-editor-como-comprar-pasos {
    list-style: decimal;
    padding-left: 20px;
}
.roger-editor-como-comprar-pasos li {
    font-size: 14.5px; line-height: 1.75; color: #8d8d8d;
    margin-bottom: 8px;
}
.roger-editor-como-comprar-pasos li a {
    color: #6f759c;
    font-weight: 600;
    text-decoration: underline;
}

.roger-editor-como-comprar-titulo-medios { font-size: 24px; margin-bottom: 10px; }
.roger-editor-como-comprar-intro-medios {
    font-size: 14.5px; line-height: 1.75; color: #8d8d8d;
    margin-bottom: 16px;
}
.roger-editor-medios-pago-lista {
    list-style: none;
    display: flex; flex-direction: column; gap: 10px;
    margin: 0 0 16px;
    padding: 0;
}
.roger-editor-medios-pago-lista li {
    font-size: 14.5px; color: #333333;
    display: flex; align-items: center; gap: 10px;
}
.roger-editor-medios-pago-lista li span { font-size: 18px; flex-shrink: 0; }
.roger-editor-medios-pago-nota {
    font-size: 13px; color: #8d8d8d; font-style: italic;
}