/* ============================================
   Wazo · single-plan.css
   Página /plan/<slug>/ siguiendo el Figma del cliente.

   Scope: body.wazo-single-plan
   Master grid: .wazo-main.wazo-plan (12-col + subgrid)

   Layout en 8 secciones:
     1. Hero · breadcrumb + título XL + desc + CTA + stats 3-2 + separador
     2. Why rows · 4 filas (reusa .wazo-home__why-rows del home.css)
     3. Desc + Retos · 2-col (desc izq + chips dcha)
     4. Banner azul (.wazo-fcta--message · extensión en simulador.css)
     5. Beneficios + Ámbitos · 2-col chips
     6. Recursos 4-col
     7. 2 Cards (Impacto ✓ + Implementación numerada)
     8. Banner CTA cierre (.wazo-fcta--cta · extensión en simulador.css)
   ============================================ */

/* ---- Master grid root ---- */
.wazo-single-plan .wazo-main.wazo-plan {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    column-gap: var(--wazo-grid-gutter);
}
.wazo-single-plan .wazo-main.wazo-plan > section,
.wazo-single-plan .wazo-main.wazo-plan > footer {
    grid-column: 1 / -1;
}
@media (max-width: 1200px) {
    .wazo-single-plan .wazo-main.wazo-plan {
        grid-template-columns: 1fr;
        padding-inline: 16px;
    }
}
@media (max-width: 639px) {
    .wazo-single-plan .wazo-main.wazo-plan {
        grid-template-columns: repeat(var(--wazo-grid-cols-phone), 1fr);
        column-gap: var(--wazo-grid-gutter-phone);
        padding-inline: 16px;
    }
}

/* Eyebrow override consistente con .wazo-page-sim / .wazo-single-sim */
.wazo-single-plan .wazo-eyebrow {
    font-size: var(--wazo-fs-14);
    font-weight: var(--wazo-font-weight-regular);
    color: var(--wazo-color-text);
    letter-spacing: var(--wazo-ls-display);
    line-height: var(--wazo-lh-none);
    opacity: 0.85;
    text-transform: none;
    margin: 0;
    display: inline-block;
}

/* ============================================
   1 · HERO (estructura idéntica a single-sim hero)
   ============================================ */
.wazo-single-plan__hero {
    position: relative;
    padding-block: var(--wazo-sp-hero-block);
    display: grid;
    grid-template-columns: subgrid;
    column-gap: var(--wazo-grid-gutter);
    row-gap: var(--wazo-sp-hero-rowgap);
}
.wazo-single-plan__hero::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: var(--wazo-grid-margin);
    right: var(--wazo-grid-margin);
    height: 1px;
    background: var(--wazo-color-ui-border);
}

.wazo-single-plan__hero-content {
    grid-column: 2 / span 5;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--wazo-sp-phone-md);
}
.wazo-single-plan__hero-breadcrumb {
    font-size: var(--wazo-fs-12);
    color: rgba(255, 255, 255, 0.55);
    letter-spacing: var(--wazo-ls-display);
    line-height: var(--wazo-lh-none);
    margin: 0;
}
.wazo-single-plan__hero-breadcrumb-link {
    color: inherit;
    text-decoration: none;
    transition: color var(--wazo-cta-duration) var(--wazo-cta-ease);
}
.wazo-single-plan__hero-breadcrumb-link:hover { color: var(--wazo-color-text); }
.wazo-single-plan__hero-breadcrumb-sep {
    margin: 0 4px;
    opacity: 0.6;
}
.wazo-single-plan__hero-title {
    font-family: var(--wazo-font-sans);
    font-weight: var(--wazo-font-weight-medium);
    font-size: var(--wazo-fs-display-xl);
    line-height: var(--wazo-lh-display);
    letter-spacing: var(--wazo-ls-display);
    color: var(--wazo-color-text);
    margin: 0;
    text-wrap: balance;
    overflow-wrap: break-word;
}
.wazo-single-plan__hero-desc {
    font-size: var(--wazo-fs-16);
    line-height: var(--wazo-lh-body);
    letter-spacing: var(--wazo-ls-display);
    color: rgba(255, 255, 255, 0.65);
    max-width: 50ch;
    margin: 0;
}
.wazo-single-plan__hero-cta-row {
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--wazo-sp-phone-sm);
}
.wazo-single-plan .wazo-single-plan__hero-cta {
    display: inline-flex;
    align-items: center;
    gap: var(--wazo-sp-phone-xs);
    height: 39px;
    padding: 0 var(--wazo-sp-phone-sm);
    border-radius: 4px;
    background: linear-gradient(180deg, #00F 0%, #043CDF 34.6%, #1587F7 69.19%, #9DE2EE 104.84%);
    color: var(--wazo-color-text);
    font-size: var(--wazo-fs-14);
    font-weight: var(--wazo-font-weight-medium);
    letter-spacing: var(--wazo-ls-display);
    text-decoration: none;
    border: 0;
    box-shadow: none;
    transition: transform var(--wazo-cta-duration) var(--wazo-cta-ease), filter var(--wazo-cta-duration) var(--wazo-cta-ease);
}
.wazo-single-plan .wazo-single-plan__hero-cta:hover {
    transform: translateY(-1px);
    filter: brightness(1.05);
}
/* Botón secundario · descarga PDF (outline transparente), igual que en cursos/sims */
.wazo-single-plan .wazo-single-plan__hero-cta--secondary {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.30);
}
.wazo-single-plan .wazo-single-plan__hero-cta--secondary:hover {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.50);
    filter: none;
}

.wazo-single-plan__hero-stats {
    grid-column: 8 / 12;
    align-self: end;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px 24px;
}
.wazo-single-plan__hero-stat {
    display: flex;
    flex-direction: column;
    gap: var(--wazo-sp-phone-xs);
}
.wazo-single-plan__hero-stat-num {
    font-family: var(--wazo-font-sans);
    font-weight: var(--wazo-font-weight-medium);
    font-size: var(--wazo-fs-display-md);
    line-height: var(--wazo-lh-none);
    letter-spacing: var(--wazo-ls-display);
    color: var(--wazo-color-text);
}
.wazo-single-plan__hero-stat-lbl {
    font-size: var(--wazo-fs-14);
    color: rgba(255, 255, 255, 0.55);
    letter-spacing: var(--wazo-ls-display);
    line-height: var(--wazo-lh-tight);
}
.wazo-single-plan__hero-stat--destacado .wazo-single-plan__hero-stat-num {
    color: var(--wazo-color-accent);
}

@media (max-width: 1200px) {
    .wazo-single-plan__hero { grid-template-columns: 1fr; row-gap: 40px; }
    .wazo-single-plan__hero::after { left: 0; right: 0; }
    .wazo-single-plan__hero-content,
    .wazo-single-plan__hero-stats { grid-column: 1; }
    .wazo-single-plan__hero-stats { align-self: auto; }
    .wazo-single-plan .wazo-single-plan__hero-cta { height: var(--wazo-touch-target); }
}
@media (max-width: 639px) {
    .wazo-single-plan__hero {
        grid-template-columns: subgrid;
        column-gap: var(--wazo-grid-gutter-phone);
        row-gap: var(--wazo-sp-phone-md);
        padding-block: var(--wazo-sp-phone-lg);
    }
    .wazo-single-plan__hero-content,
    .wazo-single-plan__hero-stats { grid-column: 1 / -1; }
    .wazo-single-plan__hero-content { gap: var(--wazo-sp-phone-sm); }
    .wazo-single-plan__hero-stats { grid-template-columns: repeat(2, 1fr); gap: var(--wazo-sp-phone-md) var(--wazo-sp-phone-sm); }
    .wazo-single-plan__hero-desc { max-width: 100%; }
    .wazo-single-plan .wazo-single-plan__hero-cta { height: var(--wazo-touch-target); }
}

/* ============================================
   2 · WHY ROWS · reusa estructura del .wazo-home__why
   pero scope dentro de .wazo-single-plan para sobreescribir el head
   (no hay head en /plan/).
   home.css se carga en is_singular('plan') para que .wazo-home__why-*
   ya tenga sus estilos base.
   ============================================ */
.wazo-single-plan__why {
    /* Padding-block y row-gap consistentes con la sección why del home */
    padding-block: var(--wazo-sp-section-block-divider);
}

/* ============================================
   3 · DESCRIPCIÓN + RETOS (2-col)
   ============================================ */
.wazo-single-plan__dr {
    padding-block: var(--wazo-sp-section-block);
    display: grid;
    grid-template-columns: subgrid;
    column-gap: var(--wazo-grid-gutter);
    row-gap: var(--wazo-sp-section-rowgap-compact);
}
.wazo-single-plan__dr-col {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--wazo-sp-phone-sm);
}
.wazo-single-plan__dr-col--desc { grid-column: 2 / span 5; }
.wazo-single-plan__dr-col--retos { grid-column: 7 / span 5; }

.wazo-single-plan__dr-title {
    font-family: var(--wazo-font-sans);
    font-weight: var(--wazo-font-weight-medium);
    font-size: var(--wazo-fs-display-lg);
    line-height: var(--wazo-lh-display);
    letter-spacing: var(--wazo-ls-display);
    color: var(--wazo-color-text);
    margin: 0;
    text-wrap: balance;
    max-width: none;
}
.wazo-single-plan__dr-texto {
    font-size: var(--wazo-fs-16);
    line-height: var(--wazo-lh-body);
    letter-spacing: var(--wazo-ls-display);
    color: rgba(255, 255, 255, 0.70);
    max-width: 100%;
}
.wazo-single-plan__dr-texto p { margin: 0 0 var(--wazo-sp-phone-sm); line-height: var(--wazo-lh-body); }
.wazo-single-plan__dr-texto p:last-child { margin-bottom: 0; }
.wazo-single-plan__dr-chips {
    display: flex;
    flex-wrap: wrap;
    gap: var(--wazo-sp-phone-xs);
    margin-top: var(--wazo-sp-phone-xs);
}

/* Ambos lados (desc y retos) usan el mismo h2 de sección · display-lg,
   igual que los títulos de cursos/simuladores (canon de sección). */
.wazo-single-plan__dr-col--desc .wazo-single-plan__dr-title {
    font-size: var(--wazo-fs-display-lg);
    line-height: var(--wazo-lh-display);
}

@media (max-width: 1200px) {
    .wazo-single-plan__dr { grid-template-columns: 1fr; row-gap: 40px; }
    .wazo-single-plan__dr-col--desc,
    .wazo-single-plan__dr-col--retos { grid-column: 1; }
    /* font-size no hace falta override · ya escala via clamp() */
}
@media (max-width: 639px) {
    .wazo-single-plan__dr {
        grid-template-columns: subgrid;
        column-gap: var(--wazo-grid-gutter-phone);
        row-gap: var(--wazo-sp-phone-md);
        padding-block: var(--wazo-sp-phone-lg);
    }
    .wazo-single-plan__dr-col--desc,
    .wazo-single-plan__dr-col--retos { grid-column: 1 / -1; }
    .wazo-single-plan__dr-col { gap: var(--wazo-sp-phone-sm); }
    /* Sin override de font-size · display-lg ya escala vía clamp (30→44px). */
}

/* ============================================
   Chip estilo plan (compartido por desc-retos + beneficios-ambitos)
   Border azul translúcido · ligeramente más opaco que el chip del
   single-sim (mismo tono accent).
   ============================================ */
.wazo-single-plan__chip {
    display: inline-flex;
    align-items: center;
    /* min-height (no fijo) + padding vertical → crece si el texto envuelve a 2
       líneas. radius 16px = pill en 1 línea (mitad de 32px) y rounded-rect
       limpio en 2 líneas (en vez del stadium estirado). lh-tight para que las
       2 líneas respiren. */
    min-height: 32px;
    padding: 6px var(--wazo-sp-phone-sm);
    border-radius: 16px;
    background: rgba(0, 161, 255, 0.06);
    border: 1px solid rgba(0, 161, 255, 0.40);
    color: var(--wazo-color-text);
    font-size: var(--wazo-fs-14);
    font-weight: var(--wazo-font-weight-regular);
    line-height: var(--wazo-lh-tight);
    letter-spacing: var(--wazo-ls-display);
    transition: background var(--wazo-cta-duration) var(--wazo-cta-ease),
                border-color var(--wazo-cta-duration) var(--wazo-cta-ease);
}
/* Sin hover. Columna izquierda (ba 1ª col · rs --left) · fondo sutil + borde
   neutro; la derecha (y los chips de dr) mantienen el azul de la regla base. */
.wazo-single-plan__ba-col:nth-of-type(1) .wazo-single-plan__chip,
.wazo-single-plan__rs-col--left .wazo-single-plan__chip {
    background: var(--wazo-color-white-3);
    border-color: var(--wazo-color-ui-border);
}

/* ============================================
   5 · BENEFICIOS + ÁMBITOS (2-col chips)
   ============================================ */
.wazo-single-plan__ba {
    padding-block: var(--wazo-sp-section-block);
    display: grid;
    grid-template-columns: subgrid;
    column-gap: var(--wazo-grid-gutter);
    row-gap: var(--wazo-sp-section-rowgap);
}
.wazo-single-plan__ba-col {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--wazo-sp-phone-sm);
}
.wazo-single-plan__ba-col:nth-of-type(1) { grid-column: 2 / span 5; }
.wazo-single-plan__ba-col:nth-of-type(2) { grid-column: 7 / span 5; }
.wazo-single-plan__ba-title {
    font-family: var(--wazo-font-sans);
    font-weight: var(--wazo-font-weight-medium);
    font-size: var(--wazo-fs-display-lg);
    line-height: var(--wazo-lh-display);
    letter-spacing: var(--wazo-ls-display);
    color: var(--wazo-color-text);
    margin: 0;
    text-wrap: balance;
    max-width: none;
}
.wazo-single-plan__ba-chips {
    display: flex;
    flex-wrap: wrap;
    gap: var(--wazo-sp-phone-xs);
    margin-top: var(--wazo-sp-phone-xs);
}

@media (max-width: 1200px) {
    .wazo-single-plan__ba { grid-template-columns: 1fr; row-gap: 40px; }
    .wazo-single-plan__ba-col:nth-of-type(1),
    .wazo-single-plan__ba-col:nth-of-type(2) { grid-column: 1; }
}
@media (max-width: 639px) {
    .wazo-single-plan__ba {
        grid-template-columns: subgrid;
        column-gap: var(--wazo-grid-gutter-phone);
        row-gap: var(--wazo-sp-phone-md);
        padding-block: var(--wazo-sp-phone-lg);
    }
    .wazo-single-plan__ba-col:nth-of-type(1),
    .wazo-single-plan__ba-col:nth-of-type(2) { grid-column: 1 / -1; }
    .wazo-single-plan__ba-col { gap: var(--wazo-sp-phone-sm); }
}

/* ============================================
   6 · RECURSOS 4-col
   ============================================ */
.wazo-single-plan__recursos {
    padding-block: var(--wazo-sp-section-block);
    display: grid;
    grid-template-columns: subgrid;
    column-gap: var(--wazo-grid-gutter);
    row-gap: var(--wazo-sp-section-rowgap);
}
.wazo-single-plan__recursos-title {
    grid-column: 2 / span 7;
    font-family: var(--wazo-font-sans);
    font-weight: var(--wazo-font-weight-medium);
    font-size: var(--wazo-fs-display-lg);
    line-height: var(--wazo-lh-display);
    letter-spacing: var(--wazo-ls-display);
    color: var(--wazo-color-text);
    margin: 0;
    text-wrap: balance;
}
.wazo-single-plan__recursos-grid {
    grid-column: 2 / 12;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--wazo-grid-gutter);
}
.wazo-single-plan__recurso-col {
    display: flex;
    flex-direction: column;
    gap: var(--wazo-sp-phone-xs);
}
.wazo-single-plan__recurso-num {
    font-size: var(--wazo-fs-12);
    font-weight: var(--wazo-font-weight-regular);
    color: rgba(255, 255, 255, 0.55);
    letter-spacing: var(--wazo-ls-display);
    line-height: var(--wazo-lh-none);
}
.wazo-single-plan__recurso-title {
    font-family: var(--wazo-font-sans);
    font-weight: var(--wazo-font-weight-medium);
    font-size: var(--wazo-fs-16);
    line-height: var(--wazo-lh-display);
    letter-spacing: var(--wazo-ls-display);
    color: var(--wazo-color-text);
    margin: 0 0 var(--wazo-sp-phone-xs);
    padding-bottom: var(--wazo-sp-phone-xs);
    border-bottom: 1px solid var(--wazo-color-ui-border);
}

/* Lists dentro de las cols · estilo iaf */
.wazo-single-plan__recurso-col .wazo-curso__iaf-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: var(--wazo-sp-phone-xs);
}
.wazo-single-plan__recurso-col .wazo-curso__iaf-list li {
    display: flex;
    align-items: flex-start;
    gap: var(--wazo-sp-phone-xs);
    color: rgba(255, 255, 255, 0.85);
    font-size: var(--wazo-fs-14);
    line-height: var(--wazo-lh-tight);
    letter-spacing: var(--wazo-ls-display);
}
.wazo-single-plan__recurso-col .wazo-curso__iaf-check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    color: var(--wazo-color-accent);
    font-size: var(--wazo-fs-14);
    font-weight: var(--wazo-font-weight-medium);
    flex-shrink: 0;
    line-height: var(--wazo-lh-none);
}

@media (max-width: 1200px) {
    .wazo-single-plan__recursos { grid-template-columns: 1fr; row-gap: 40px; }
    .wazo-single-plan__recursos-title,
    .wazo-single-plan__recursos-grid { grid-column: 1; }
    .wazo-single-plan__recursos-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--wazo-grid-gutter); }
}
@media (max-width: 639px) {
    .wazo-single-plan__recursos {
        grid-template-columns: subgrid;
        column-gap: var(--wazo-grid-gutter-phone);
        row-gap: var(--wazo-sp-phone-md);
        padding-block: var(--wazo-sp-phone-lg);
    }
    .wazo-single-plan__recursos-title,
    .wazo-single-plan__recursos-grid { grid-column: 1 / -1; }
    .wazo-single-plan__recursos-grid { grid-template-columns: 1fr; gap: var(--wazo-sp-phone-md); }
}

/* ============================================
   7 · 2 CARDS (Impacto + Implementación)
   ============================================ */
.wazo-single-plan__cards {
    padding-block: var(--wazo-sp-section-block);
    display: grid;
    grid-template-columns: subgrid;
    column-gap: var(--wazo-grid-gutter);
}
.wazo-single-plan__cards-grid {
    grid-column: 2 / 12;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--wazo-grid-gutter);
}
.wazo-single-plan__card {
    background: var(--wazo-color-bg);
    border: 1px solid #00A1FF;
    border-radius: 16px;
    padding: 32px;
    display: flex;
    flex-direction: column;
    gap: var(--wazo-sp-phone-md);
}
.wazo-single-plan__card-title {
    font-family: var(--wazo-font-sans);
    font-weight: var(--wazo-font-weight-medium);
    font-size: var(--wazo-fs-16);
    line-height: var(--wazo-lh-display);
    letter-spacing: var(--wazo-ls-display);
    color: var(--wazo-color-text);
    margin: 0;
}
.wazo-single-plan__card .wazo-curso__iaf-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: var(--wazo-sp-phone-sm);
}
.wazo-single-plan__card .wazo-curso__iaf-list li {
    display: flex;
    align-items: flex-start;
    gap: var(--wazo-sp-phone-sm);
    color: rgba(255, 255, 255, 0.85);
    font-size: var(--wazo-fs-16);
    line-height: var(--wazo-lh-tight);
    letter-spacing: var(--wazo-ls-display);
}
.wazo-single-plan__card .wazo-curso__iaf-check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    color: var(--wazo-color-accent);
    font-size: var(--wazo-fs-16);
    font-weight: var(--wazo-font-weight-medium);
    flex-shrink: 0;
    line-height: var(--wazo-lh-none);
    margin-top: 1px;
}
.wazo-single-plan__card .wazo-curso__iaf-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.30);
    color: rgba(255, 255, 255, 0.85);
    font-size: var(--wazo-fs-12);
    font-weight: var(--wazo-font-weight-regular);
    flex-shrink: 0;
    line-height: var(--wazo-lh-none);
    font-variant-numeric: tabular-nums;
    margin-top: 1px;
}

@media (max-width: 1200px) {
    .wazo-single-plan__cards { grid-template-columns: 1fr; }
    .wazo-single-plan__cards-grid { grid-column: 1; grid-template-columns: 1fr; gap: var(--wazo-sp-phone-sm); }
    .wazo-single-plan__card { padding: var(--wazo-sp-phone-md); }
}
@media (max-width: 639px) {
    .wazo-single-plan__cards {
        grid-template-columns: subgrid;
        column-gap: var(--wazo-grid-gutter-phone);
        padding-block: var(--wazo-sp-phone-lg);
    }
    .wazo-single-plan__cards-grid { grid-column: 1 / -1; gap: var(--wazo-sp-phone-sm); }
    .wazo-single-plan__card { padding: var(--wazo-sp-phone-md); gap: var(--wazo-sp-phone-sm); }
    .wazo-single-plan__card-title { font-size: var(--wazo-fs-16); }
}

/* ============================================
   4 + 8 · BANNER VARIANTS · reset scope-específico.
   Las variantes .wazo-fcta--message y .wazo-fcta--cta (desktop,
   tablet, phone) viven en footer.css como master global.
   Aquí solo el reset display:block que impide que el subgrid root
   de .wazo-single-plan meta display:grid en el wrapper .wazo-fcta
   (que es full-bleed cols 1 / -1).
   ============================================ */
.wazo-single-plan .wazo-fcta { display: block; }

/* ================================================================
   ════════════════════════════════════════════════════════════════
   SINGLE PLAN · WAZO EDU (scope adicional, exclusivo del slug
   `wazo-edu`). Sólo añade las 3 secciones nuevas que NO existían
   en EDU-Lab. Las secciones compartidas (hero, 2 cards, BA,
   fcta variants) usan las clases base ya definidas arriba.
   ════════════════════════════════════════════════════════════════
   ================================================================ */

/* ============================================
   EDU · 2 · Retos + Soluciones (2-col chips ambos lados)
   Mismo patrón que .wazo-single-plan__ba pero con título más
   pequeño y eyebrow más prominente (sub-título narrativo).
   ============================================ */
.wazo-single-plan__rs {
    padding-block: var(--wazo-sp-section-block);
    display: grid;
    grid-template-columns: subgrid;
    column-gap: var(--wazo-grid-gutter);
    row-gap: var(--wazo-sp-section-rowgap);
}
.wazo-single-plan__rs-col {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--wazo-sp-phone-sm);
}
.wazo-single-plan__rs-col--left  { grid-column: 2 / span 5; }
.wazo-single-plan__rs-col--right { grid-column: 7 / span 5; }

.wazo-single-plan__rs-title {
    font-family: var(--wazo-font-sans);
    font-weight: var(--wazo-font-weight-medium);
    font-size: var(--wazo-fs-display-lg);
    line-height: var(--wazo-lh-display);
    letter-spacing: var(--wazo-ls-display);
    color: var(--wazo-color-text);
    margin: 0;
    text-wrap: balance;
    max-width: none;
}
.wazo-single-plan__rs-chips {
    display: flex;
    flex-wrap: wrap;
    gap: var(--wazo-sp-phone-xs);
    margin-top: var(--wazo-sp-phone-xs);
}

@media (max-width: 1200px) {
    .wazo-single-plan__rs { grid-template-columns: 1fr; row-gap: 40px; }
    .wazo-single-plan__rs-col--left,
    .wazo-single-plan__rs-col--right { grid-column: 1; }
}
@media (max-width: 639px) {
    .wazo-single-plan__rs {
        grid-template-columns: subgrid;
        column-gap: var(--wazo-grid-gutter-phone);
        row-gap: var(--wazo-sp-phone-md);
        padding-block: var(--wazo-sp-phone-lg);
    }
    .wazo-single-plan__rs-col--left,
    .wazo-single-plan__rs-col--right { grid-column: 1 / -1; }
    .wazo-single-plan__rs-col { gap: var(--wazo-sp-phone-sm); }
}

/* ============================================
   EDU · 3 · Adapta WAZO EDU (eyebrow + título XL + 3-col features)
   ============================================ */
.wazo-single-plan__adapta {
    padding-block: var(--wazo-sp-section-block);
    display: grid;
    grid-template-columns: subgrid;
    column-gap: var(--wazo-grid-gutter);
    row-gap: var(--wazo-sp-section-rowgap-compact);
}
.wazo-single-plan__adapta-eyebrow {
    grid-column: 2 / span 5;
    margin: 0;
}
.wazo-single-plan__adapta-title {
    grid-column: 2 / span 8;
    font-family: var(--wazo-font-sans);
    font-weight: var(--wazo-font-weight-medium);
    font-size: var(--wazo-fs-display-lg);
    line-height: var(--wazo-lh-display);
    letter-spacing: var(--wazo-ls-display);
    color: var(--wazo-color-text);
    margin: 0;
    text-wrap: balance;
    max-width: none;
}
.wazo-single-plan__adapta-grid {
    grid-column: 2 / 12;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--wazo-grid-gutter);
}
.wazo-single-plan__adapta-item {
    display: flex;
    flex-direction: column;
    gap: var(--wazo-sp-phone-xs);
}
.wazo-single-plan__adapta-item-title {
    font-family: var(--wazo-font-sans);
    font-weight: var(--wazo-font-weight-medium);
    font-size: var(--wazo-fs-16);
    line-height: var(--wazo-lh-display);
    letter-spacing: var(--wazo-ls-display);
    color: var(--wazo-color-text);
    margin: 0;
}
.wazo-single-plan__adapta-item-desc {
    font-size: var(--wazo-fs-14);
    line-height: var(--wazo-lh-body);
    letter-spacing: var(--wazo-ls-display);
    color: rgba(255, 255, 255, 0.65);
    margin: 0;
}

@media (max-width: 1200px) {
    .wazo-single-plan__adapta { grid-template-columns: 1fr; row-gap: 40px; }
    .wazo-single-plan__adapta-eyebrow,
    .wazo-single-plan__adapta-title,
    .wazo-single-plan__adapta-grid { grid-column: 1; }
    .wazo-single-plan__adapta-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--wazo-grid-gutter); }
}
@media (max-width: 639px) {
    .wazo-single-plan__adapta {
        grid-template-columns: subgrid;
        column-gap: var(--wazo-grid-gutter-phone);
        row-gap: var(--wazo-sp-phone-md);
        padding-block: var(--wazo-sp-phone-lg);
    }
    .wazo-single-plan__adapta-eyebrow,
    .wazo-single-plan__adapta-title,
    .wazo-single-plan__adapta-grid { grid-column: 1 / -1; }
    .wazo-single-plan__adapta-grid { grid-template-columns: 1fr; gap: var(--wazo-sp-phone-md); }
}

/* ============================================
   EDU · 5 · ¿Qué es WAZO EDU? (eyebrow + título XL + párrafos)
   ============================================ */
.wazo-single-plan__que {
    padding-block: var(--wazo-sp-section-block);
    display: grid;
    grid-template-columns: subgrid;
    column-gap: var(--wazo-grid-gutter);
    row-gap: clamp(24px, 3vw, 40px);
}
.wazo-single-plan__que-eyebrow {
    grid-column: 2 / span 5;
    margin: 0;
}
.wazo-single-plan__que-title {
    grid-column: 2 / span 8;
    font-family: var(--wazo-font-sans);
    font-weight: var(--wazo-font-weight-medium);
    font-size: var(--wazo-fs-display-lg);
    line-height: var(--wazo-lh-display);
    letter-spacing: var(--wazo-ls-display);
    color: var(--wazo-color-text);
    margin: 0;
    text-wrap: balance;
    max-width: none;
}
.wazo-single-plan__que-texto {
    grid-column: 2 / span 8;
    font-size: var(--wazo-fs-16);
    line-height: var(--wazo-lh-body);
    letter-spacing: var(--wazo-ls-display);
    color: rgba(255, 255, 255, 0.70);
    max-width: 70ch;
}
.wazo-single-plan__que-texto p { margin: 0 0 var(--wazo-sp-phone-sm); line-height: var(--wazo-lh-body); }
.wazo-single-plan__que-texto p:last-child { margin-bottom: 0; }

@media (max-width: 1200px) {
    .wazo-single-plan__que { grid-template-columns: 1fr; row-gap: var(--wazo-sp-phone-md); }
    .wazo-single-plan__que-eyebrow,
    .wazo-single-plan__que-title,
    .wazo-single-plan__que-texto { grid-column: 1; max-width: 100%; }
}
@media (max-width: 639px) {
    .wazo-single-plan__que {
        grid-template-columns: subgrid;
        column-gap: var(--wazo-grid-gutter-phone);
        row-gap: var(--wazo-sp-phone-sm);
        padding-block: var(--wazo-sp-phone-lg);
    }
    .wazo-single-plan__que-eyebrow,
    .wazo-single-plan__que-title,
    .wazo-single-plan__que-texto { grid-column: 1 / -1; }
}

/* ================================================================
 * Fin del bloque single-plan.
 * ================================================================ */