/* =========================================================================
   EDUCAPHAROS · capa de marca sobre pb2.css
   =========================================================================
   Ajusta el core del plugin a la retícula, escalas y espaciados exactos de
   las plantillas que el tema hijo tenía en page-templates/assets/:

     landing-tipo-a.css  (.lb)  → hero split_form   · Tipo A
     landing-tipo-b.css  (.ev)  → hero countdown    · Tipo B
     landing-tipo-c.css  (.cx)  → hero price        · Tipo C
     landing-tipo-d.css  (.mx)  → hero cobrand      · Tipo D

   Los colores (#ffd200 / #111) y la tipografía (Montserrat) ya coinciden
   con el core, así que aquí no se redefinen: solo geometría y escalas.

   Se carga DESPUÉS de pb2.css, así que basta la misma especificidad; solo
   se sube donde el core ya iba reforzado.
   ========================================================================= */

/* ============ BASE ============ */
.pb2-wrap {
    max-width: 1220px;
}

/* Se redeclara aquí a propósito: al cargarse este fichero después de
   pb2.css, la regla .pb2-wrap de arriba pisaría por orden a la
   .pb2-wrap--narrow del core, que tiene la misma especificidad. */
.pb2-wrap--narrow {
    max-width: 660px;
}

.pb2-h2 {
    font-size: clamp(28px, 3vw, 40px);
    letter-spacing: -0.02em;
    margin: 0 0 40px;
}

.pb2 .pb2-btn {
    padding: 16px 32px;
    font-size: 14px;
    transition: all .18s ease;
}

.pb2 .pb2-btn:hover {
    transform: translateY(-1px);
}

/* ============ HERO · Tipo A (60/40 con formulario) ============ */
.pb2-hero--split_form .pb2-hero__grid {
    grid-template-columns: 60% 40%;
    min-height: 640px;
}

.pb2-hero--split_form .pb2-hero__grid>.pb2-hero__copy {
    padding: 80px 60px;
}

/* El tema hijo usaba velo plano, no degradado: el texto sobre foto queda
   con el mismo contraste de arriba abajo. */
.pb2-hero--split_form .pb2-hero__overlay {
    background: rgba(0, 0, 0, .55);
}

.pb2-hero--split_form .pb2-hero__form {
    padding: 70px 60px 70px 55px;
}

/* ============ HERO · variantes centradas (B, C, D) ============ */
.pb2-hero h1 {
    font-size: clamp(34px, 4vw, 56px);
}

.pb2-eyebrow {
    font-size: 14px;
    letter-spacing: .08em;
}

.pb2-sub {
    font-size: clamp(16px, 1.5vw, 19px);
}

.pb2-hero--countdown .pb2-hero__inner {
    max-width: 940px;
    padding: 110px 24px 90px;
}

.pb2-hero--countdown .pb2-sub,
.pb2-hero--cobrand .pb2-sub {
    max-width: 740px;
    margin-left: auto;
    margin-right: auto;
}

/* Tipo C alineaba a la izquierda: título, pills y precio en columna. */
.pb2-hero--price .pb2-hero__inner {
    max-width: 1000px;
    padding: 100px 24px 90px;
    text-align: left;
}

.pb2-hero--price .pb2-sub {
    max-width: 760px;
}

.pb2-hero--price .pb2-pills {
    justify-content: flex-start;
    align-items: center;
    gap: 18px;
    margin-top: 26px;
}

.pb2-hero--cobrand .pb2-hero__inner {
    max-width: 980px;
    padding: 80px 24px 100px;
}

/* Pills / precio */
.pb2-pills span {
    padding: 9px 16px;
    border-color: rgba(255, 255, 255, .35);
}

.pb2-price {
    font-size: 18px;
    padding: 13px 24px;
}

/* Countdown */
.pb2-countdown {
    gap: 14px;
    margin: 32px 0 28px;
}

.pb2-countdown div {
    min-width: 88px;
    padding: 16px 10px 14px;
}

.pb2-countdown span {
    font-size: 34px;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

.pb2-countdown small {
    margin-top: 6px;
    letter-spacing: .08em;
}

/* Co-branding */
.pb2-brands {
    gap: 22px;
    margin-bottom: 30px;
    flex-wrap: wrap;
}

.pb2-brands img {
    height: 48px;
    max-width: 220px;
    object-fit: contain;
}

.pb2-brands span {
    font-size: 32px;
    font-weight: 300;
}

/* ============ BARRA DE LOGOS ============ */
.pb2-logos {
    padding: 38px 0;
}

.pb2-logos .pb2-wrap {
    gap: 44px;
}

.pb2-logos img {
    height: 38px;
    max-width: 180px;
    opacity: .75;
}

/* ============ PROPUESTA DE VALOR ============ */
.pb2-value {
    padding: 80px 0;
}

.pb2-value .pb2-cols3 {
    gap: 30px;
}

.pb2-value .pb2-card {
    padding: 34px 28px;
}

.pb2-value .pb2-card h3 {
    font-size: 18px;
    margin-bottom: 10px;
}

.pb2-card__icon {
    margin-bottom: 18px;
}

.pb2-card__icon svg {
    width: 44px;
    height: 44px;
}

/* ============ PREVIEW / IMAGEN + TEXTO ============ */
.pb2-split {
    gap: 60px;
}

.pb2-split img {
    box-shadow: 0 18px 50px rgba(0, 0, 0, .18);
}

.pb2-sq li {
    padding-left: 26px;
    margin-bottom: 14px;
    font-size: 16px;
    line-height: 1.5;
}

.pb2-sq li::before {
    top: 7px;
}

/* ============ QUÉ APRENDERÁS (Tipo B) ============ */
.pb2-cols2 {
    gap: 18px;
    max-width: 980px;
    margin: 0 auto;
}

.pb2-check {
    padding: 18px 20px;
    line-height: 1.5;
    color: #555;
}

.pb2-check strong {
    color: #111;
}

/* ============ PONENTES / PROFESORES ============ */
.pb2-sec .pb2-cols3:has(.pb2-card--center) {
    gap: 34px;
    max-width: 1060px;
    margin: 0 auto;
}

.pb2-card--center h3 {
    font-size: 20px;
    margin-bottom: 6px;
}

.pb2-card--center .pb2-role {
    font-size: 14px;
    margin-bottom: 10px !important;
}

.pb2-card--center p {
    font-size: 13px;
    line-height: 1.55;
}

.pb2-avatar {
    margin-bottom: 18px;
}

/* ============ AGENDA / TIMELINE ============ */
.pb2-tl {
    gap: 22px;
    padding: 16px 0 16px 30px;
    align-items: baseline;
}

.pb2-tl::before {
    top: 22px;
}

.pb2-tl span {
    min-width: 60px;
    font-size: 15px;
}

.pb2-tl p {
    font-size: 15px;
    color: #333;
}

/* ============ ACORDEONES (FAQ) ============ */
.pb2-acc__q {
    padding: 20px 24px;
}

.pb2-acc__t {
    font-size: 16px;
}

.pb2-acc__a {
    padding: 0 24px 22px;
}

.pb2-acc__a p {
    line-height: 1.7;
}

/* ============ TEMARIO (Tipo C) ============ */
.pb2-temario {
    padding: 80px 0;
}

.pb2-temario .pb2-acc {
    max-width: 900px;
}

.pb2-temario .pb2-acc__item {
    border: 1px solid #eee;
    border-left: 4px solid var(--y);
    border-radius: 0;
    margin-bottom: 14px;
}

.pb2-temario .pb2-acc__q {
    padding: 20px 24px;
    gap: 18px;
}

.pb2-temario .pb2-num {
    min-width: 44px;
    font-size: 26px;
}

.pb2-temario .pb2-acc__t {
    font-size: 17px;
}

.pb2-temario .pb2-acc__a {
    padding: 0 24px 22px 86px;
}

.pb2-temario .pb2-acc__a p {
    color: #555;
    font-size: 14px;
    margin-bottom: 12px;
}

@media (max-width:768px) {
    .pb2-temario .pb2-acc__a {
        padding-left: 24px;
    }
}

/* ============ CERTIFICACIÓN ============ */
.pb2-cert {
    gap: 26px;
    padding: 30px 34px;
}

.pb2-cert img {
    height: 64px;
}

.pb2-cert h3 {
    font-size: 18px;
    margin: 0 0 6px;
}

.pb2-cert p {
    font-size: 14px;
    line-height: 1.55;
    color: #555;
}

/* ============ BANDA FUNDAE ============ */
.pb2-fundae {
    padding: 36px 0;
}

.pb2-fundae p {
    font-size: 16px;
}

/* ============ TESTIMONIOS ============ */
/* Las tarjetas de testimonio del tema hijo no llevaban la línea amarilla
   superior; las de "para quién es" (mismo componente .pb2-card) sí. Se
   distinguen por el contenido, no por una clase propia. */
.pb2-card:has(.pb2-quote) {
    border-top: 0;
    padding: 30px 26px;
}

.pb2-quote {
    font-size: 15px;
    margin-bottom: 20px !important;
}

/* ============ PROGRAMAS (Tipo D) ============ */
/* El tema hijo sacaba la imagen a sangre contra el borde de la tarjeta; el
   core la deja dentro del padding. Se quita el padding de la tarjeta y se
   devuelve a cada hijo que no sea la portada. */
.pb2-programs {
    padding: 80px 0;
}

.pb2-programs .pb2-cols3 {
    gap: 26px;
}

.pb2-programs .pb2-card--plain {
    padding: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.pb2-programs .pb2-card--plain:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 28px rgba(0, 0, 0, .08);
}

.pb2-programs .pb2-cover {
    margin: 0 0 20px;
}

.pb2-programs .pb2-card--plain h3 {
    margin: 0 22px 14px;
    font-size: 18px;
    line-height: 1.3;
}

/* Sin portada, el título es el primer hijo y necesita el aire de arriba. */
.pb2-programs .pb2-card--plain h3:first-child {
    margin-top: 24px;
}

.pb2-programs .pb2-prog__meta {
    margin: 0 22px 18px;
    gap: 14px;
    font-size: 13px;
}

.pb2-programs .pb2-prog__link {
    margin: auto 22px 22px;
    font-size: 14px;
}

/* ============ REQUISITOS DE ACCESO ============ */
.pb2-req .pb2-checks {
    max-width: 720px;
}

.pb2-req .pb2-checks li {
    padding: 14px 6px 14px 34px;
    border-bottom-color: #e5e5e5;
    font-size: 15px;
}

.pb2-req .pb2-checks li::before {
    top: 15px;
}

/* ============ FORMULARIO EN SECCIÓN PROPIA (Tipo B) ============ */
/* Tarjeta con marco amarillo y sin sombra. No afecta ni al hero (que la
   funde con el fondo blanco) ni al CTA final (que la lleva con sombra). */
.pb2-sec .pb2-formcard {
    border: 2px solid var(--y);
    box-shadow: none;
    border-radius: 0;
    padding: 44px 38px 34px;
}

.pb2-sec .pb2-formcard__title {
    font-size: 26px;
    margin-bottom: 24px;
}

/* ============ CTA FINAL ============ */
.pb2-final__t {
    font-size: clamp(26px, 3vw, 40px);
    margin: 0 0 40px;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.pb2-final .pb2-wrap--narrow {
    max-width: 1220px;
}

.pb2-final .pb2-formcard {
    max-width: 640px;
    margin: 0 auto;
    padding: 44px 38px 34px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, .25);
}

.pb2-final .pb2-formcard__title {
    font-size: 24px;
    margin-bottom: 24px;
}

/* ============ FOOTER DE PATROCINADORES (Tipo D) ============ */
/* El core pinta chips blancos; el tema hijo pintaba los logos en blanco
   sobre el fondo oscuro de la banda. */
.pb2-sponsors {
    padding: 50px 0 40px;
}

.pb2-sponsors__l {
    font-size: 12px;
    letter-spacing: .08em;
    color: rgba(255, 255, 255, .6);
    margin: 0 0 18px;
}

.pb2-sponsors .pb2-logos__row {
    gap: 36px;
}

.pb2-sponsors .pb2-logos__row img {
    width: auto;
    height: 34px;
    max-width: 160px;
    background: none;
    border-radius: 0;
    padding: 0;
    filter: brightness(0) invert(1);
    opacity: .85;
}

/* ============ RESPONSIVE ============ */
@media (max-width:1024px) {
    .pb2-hero--split_form .pb2-hero__grid {
        min-height: auto;
    }

    .pb2-hero--split_form .pb2-hero__grid>.pb2-hero__copy {
        padding: 0;
    }

    .pb2-hero--split_form .pb2-hero__lead {
        padding: 60px 30px 0;
    }

    .pb2-hero--split_form .pb2-hero__extra {
        padding: 0 30px 60px;
    }

    .pb2-hero--split_form .pb2-hero__form {
        padding: 50px 30px;
    }

    .pb2-programs .pb2-cols3 {
        grid-template-columns: repeat(2, 1fr);
    }

    .pb2-sec .pb2-cols3:has(.pb2-card--center) {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width:768px) {
    .pb2-hero h1 {
        font-size: 32px;
    }

    .pb2-hero--countdown .pb2-hero__inner {
        padding: 80px 24px 70px;
    }

    .pb2-hero--price .pb2-hero__inner {
        padding: 80px 24px 70px;
    }

    .pb2-hero--cobrand .pb2-hero__inner {
        padding: 60px 24px 70px;
    }

    .pb2-brands img {
        height: 34px;
    }

    .pb2-brands span {
        font-size: 24px;
    }

    .pb2-countdown {
        gap: 8px;
    }

    .pb2-countdown div {
        min-width: 70px;
    }

    .pb2-countdown span {
        font-size: 26px;
    }

    .pb2-sec,
    .pb2-value,
    .pb2-temario,
    .pb2-programs,
    .pb2-split-sec {
        padding: 60px 0;
    }

    .pb2-programs .pb2-cols3,
    .pb2-sec .pb2-cols3:has(.pb2-card--center) {
        grid-template-columns: 1fr;
    }

    .pb2-cert {
        flex-direction: column;
        text-align: center;
    }

    .pb2-sec .pb2-formcard,
    .pb2-final .pb2-formcard {
        padding: 34px 22px 26px;
    }

    .pb2-sponsors .pb2-logos__row {
        gap: 24px;
    }

    .pb2-sponsors .pb2-logos__row img {
        height: 28px;
    }
}
