:root {
    /* Paleta suave — la ajustamos cuando tengamos el logo/colores de marca */
    --color-fondo: #F4F9FF;
    --color-texto: #1E334D;
    --color-primario: #1677D2;
    --color-primario-oscuro: #0C4F90;
    --color-acento: #CFE8FF;
    --color-blanco: #FFFFFF;

     --font-title: 'Helvetica', 'bold';
  --font-body: 'Open Sans', sans-serif;

    --spacing-xs: 4px;
  --spacing-sm: 8px;
  --spacing-md: 16px;
  --spacing-lg: 32px;

    --radio-borde: 0px;         /* esquinas redondeadas = sensación más amable */
    --transicion-suave: 250ms ease-out;
    --espaciado-seccion: 6rem;
}

/* ===========================
   Tipografía
   =========================== */
body {
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.6;
  color: var(--text-main);
  background-color: var(--secondary);
  margin: 0;
  padding: 0;
}

h1, h2, h3 {
  font-family: var(--font-title);
  color: var(--primary);
  margin-bottom: var(--spacing-md);
}

p {
  color: var(--text-light);
  margin-bottom: var(--spacing-md);
}

/* ===========================
   PESTAÑA PROMOCIONES
=========================== */

.promo-flotante{
    position:fixed;
    right:0;
    top:55%;
    transform:translateY(-50%);
    z-index:900;
    animation: promo-entrada .6s ease-out .3s both;
}
.promo-flotante__boton{

    display:flex;
    padding:.9rem 1.2rem;
    align-items:center;
    gap:.7rem;
    padding:1rem 1.2rem;
    border:none;
    border-radius:var(--radio-borde-chico) 0 0 var(--radio-borde-chico);
    background:var(--color-primario);
    color:white;
    cursor:pointer;
    box-shadow:-6px 8px 24px rgba(12,79,144,.28);
    transition:transform .25s ease, background .25s ease, box-shadow .25s ease;
}

.promo-flotante__boton svg{ flex-shrink:0; }

.promo-flotante__boton span{

    text-align:left;

    font-size:.9rem;

    line-height:1.3;

    font-weight:600;

}
.promo-flotante__boton:hover{
    transform:translateX(-8px);
    background:var(--color-primario-oscuro);
    box-shadow:-8px 10px 28px rgba(12,79,144,.34);
}

/* ===== RESPONSIVE: PESTAÑA PROMOCIONES ===== */
@media (max-width: 767px) {
    .promo-flotante__boton {
        padding: 0.6rem 0.85rem;
        gap: 0.4rem;
        max-width: 40vw;
    }
    .promo-flotante__boton span {
        font-size: 0.7rem;
        line-height: 1.2;
    }
    .promo-flotante__boton svg {
        width: 16px;
        height: 16px;
    }
}

@media (max-width: 380px) {
    .promo-flotante__boton span {
        display: none; /* solo ícono en pantallas muy angostas */
    }
    .promo-flotante__boton {
        padding: 0.7rem;
        border-radius: 50%;
    }
}

@keyframes promo-entrada{
    from{ transform:translateY(-50%) translateX(16px); opacity:0; }
    to{ transform:translateY(-50%) translateX(0); opacity:1; }
}
.promo-modal{
    position:fixed;
    inset:0;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:1.5rem;

    background:rgba(14, 30, 51, .55);
    backdrop-filter:blur(6px);

    opacity:0;
    visibility:hidden;

    transition:opacity .3s ease, visibility .3s ease;

    z-index:1000;
}

.promo-modal.activo{
    opacity:1;
    visibility:visible;
}

.promo-modal__contenido{
    width:min(560px,100%);
    max-height:88vh;
    overflow-y:auto;

    padding:clamp(2rem, 5vw, 2.8rem);

    background:var(--color-blanco);
    border-radius:var(--radio-borde);

    box-shadow:0 24px 64px rgba(12,49,90,.22);

    transform:translateY(12px);
    transition:transform .3s ease;
}

.promo-modal.activo .promo-modal__contenido{
    transform:translateY(0);
}

.promo-modal__header{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    margin-bottom:1.25rem;
}

.promo-modal__eyebrow{
    margin:0;
    font-size:.72rem;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:var(--color-primario);
}

.promo-modal h2{
    margin:0 0 1.25rem;
    color:var(--color-primario-oscuro);
    font-size:clamp(1.6rem, 4vw, 2rem);
    line-height:1.25;
}

.promo-modal__intro{
    margin:0 0 1.75rem;
    color:var(--color-texto);
    line-height:1.85;
}

.promo-precios{
    border-top:1px solid var(--color-acento);
}

.promo-precio{
    display:flex;
    align-items:baseline;
    flex-wrap:wrap;
    gap:.4rem 1rem;

    padding:1.15rem 0;

    border-bottom:1px solid var(--color-acento);
}

.promo-precio h3{
    flex:1;
    min-width:140px;

    margin:0;

    font-size:1rem;
    font-weight:600;

    color:var(--color-texto);
}

.promo-precio span{
    font-size:1.5rem;
    font-weight:700;

    color:var(--color-primario);

    white-space:nowrap;
}

.promo-precio small{
    color:#6B7B8C;
    font-size:.82rem;
    font-weight:400;
    white-space:nowrap;
}

.promo-modal__nota{
    margin-top:1.75rem;
    padding-top:1.5rem;

    border-top:1px solid var(--color-acento);

    color:#6B7B8C;
    line-height:1.8;
    font-size:.92rem;
}

.promo-modal__cerrar{
    width:36px;
    height:36px;

    display:grid;
    place-items:center;
    flex-shrink:0;

    border:1px solid var(--color-acento);
    background:transparent;

    color:var(--color-primario-oscuro);
    font-size:1.1rem;
    line-height:1;

    cursor:pointer;

    transition:background .2s ease, color .2s ease;
}

.promo-modal__cerrar:hover{
    background:var(--color-fondo);
    color:var(--color-primario);
}

* { box-sizing: border-box; }

body {
    margin: 0;
    background: var(--color-fondo);
    color: var(--color-texto);
    font-family: 'Geist', system-ui, sans-serif; /* tipografía redondeada = más cálida */
    line-height: 1.7; /* interlineado amplio, más fácil de leer con ansiedad */
}

.contenedor {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

h1 {
    margin: 0 0 1rem;
    font-weight: 700;
    letter-spacing: -0.005em;
    line-height: 1.2;
    font-size: clamp(2rem, 3.4vw, 2.75rem);
}

main { display: block; }

a { color: var(--color-primario-oscuro); }

a:focus-visible,
button:focus-visible,
input:focus-visible {
    outline: 3px solid var(--color-primario);
    outline-offset: 3px;
}

.screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* ===== NAVEGACION ===== */
.sitio-header {
    position: sticky;
    top: 0;
    z-index: 20;
    background: rgba(255, 255, 255, 0.96);
    border-bottom: 1px solid #D9E8F7;
    box-shadow: 0 4px 18px rgba(18, 71, 120, 0.06);
    backdrop-filter: blur(12px);
}

.sitio-header__contenido {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 76px;
    gap: 1.5rem;
}

.logo a {
    color: var(--color-primario-oscuro);
    font-size: 1.1rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    text-decoration: none;
}

.custom-logo-link { display: block; line-height: 0; }
.custom-logo { display: block; width: auto; max-width: 200px; max-height: 48px; }

.menu-toggle {
    display: none;
    width: 46px;
    height: 42px;
    padding: 0.65rem;
    border: 1px solid #BCD8F2;
    border-radius: 10px;
    background: var(--color-blanco);
    color: var(--color-primario-oscuro);
}

.menu-toggle__linea {
    display: block;
    width: 100%;
    height: 2px;
    margin: 4px 0;
    border-radius: 999px;
    background: currentColor;
    transition: transform var(--transicion-suave), opacity var(--transicion-suave);
}

.menu-lista {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0;
    margin: 0;
    list-style: none;
}

.menu-lista a {
    position: relative;
    display: block;
    padding: 0.55rem 0.75rem;
    color: var(--color-texto);
    text-decoration: none;
}

.menu-lista a::after{
    content:"";

    position:absolute;
    left:.75rem;
    right:.75rem;
    bottom:.15rem;

    height:2px;

    background:var(--color-primario);

    transform:scaleX(0);
    transform-origin:center;

    transition:transform .25s ease;
}

.menu-lista a:hover{
    color:var(--color-primario-oscuro);
}

.menu-lista .current-menu-item>a::after,
.menu-lista .current_page_item>a::after{

    transform:scaleX(1);

}

@media (max-width: 767px) {
    .sitio-header__contenido { min-height: 68px; }
    .menu-toggle { display: block; }
    .js .nav-principal { display: none; }
    .js .nav-principal.is-open { display: block; }

    .nav-principal {
        position: absolute;
        top: calc(100% - 1px);
        right: 1.5rem;
        left: 1.5rem;
        padding: 0.75rem;
        border: 1px solid #D9E8F7;
        border-radius: 0 0 var(--radio-borde) var(--radio-borde);
        background: var(--color-blanco);
        box-shadow: 0 16px 28px rgba(18, 71, 120, 0.12);
    }

    .menu-lista { display: block; }
    .menu-lista a { padding: 0.8rem 0.9rem; }
    .menu-toggle.is-open .menu-toggle__linea:nth-child(2) { transform: translateY(6px) rotate(45deg); }
    .menu-toggle.is-open .menu-toggle__linea:nth-child(3) { opacity: 0; }
    .menu-toggle.is-open .menu-toggle__linea:nth-child(4) { transform: translateY(-6px) rotate(-45deg); }
}

/* Enlace "saltar al contenido" — invisible hasta que se navega con teclado */
.skip-link {
    position: absolute;
    left: -9999px;
    top: 0;
    background: var(--color-primario);
    color: #fff;
    padding: 1rem;
    z-index: 999;
}
.skip-link:focus {
    left: 1rem;
}

/* Botones */
.btn {
    display: inline-block;
    padding: 0.9rem 2rem;
    border-radius: var(--radio-borde);
    background: var(--color-primario);
    color: #fff;
    text-decoration: none;
    transition: background var(--transicion-suave), transform var(--transicion-suave);
}
.btn:hover {
    background: var(--color-primario-oscuro);
    transform: translateY(-2px); /* movimiento mínimo, nunca rebote */
}

/* ============================================
   REGLA CLAVE DE ACCESIBILIDAD EMOCIONAL:
   Si el sistema operativo del visitante tiene
   activado "reducir movimiento", anulamos TODAS
   las animaciones y transiciones del sitio.
   ============================================ */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
        scroll-behavior: auto !important;
    }
}

/* Scroll suave por defecto (se anula arriba si el usuario lo pidió) */
html {
    scroll-behavior: smooth;
}

/* ===== HERO ===== */

.hero{
    padding:0 0 2rem;
}

.hero__grid{

    min-height:550px;

    display:flex;
    align-items:center;

    padding:4rem;

    border-radius:var(--radio-borde);

    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;

    position:relative;

    overflow:hidden;

    
}
.hero__grid::before{

    content:"";

    position:absolute;
    inset:0;

    background:rgba(0,0,0,.18);

}
.hero__texto{

    position:relative;
    z-index:1;

    max-width:520px;

    padding:2.5rem;

    border-radius:var(--radio-borde);

    background:rgba(255,255,255,.82);

    backdrop-filter:blur(12px);

}
.hero__texto h1{
    font-size:clamp(2.2rem, 4vw, 3rem);
}

.hero__subtitulo{

    margin-bottom:2rem;

    font-size:1.15rem;

    line-height:1.8;

}
@media (max-width:768px){

    .hero__grid{

        min-height:420px;

        padding:2rem;

    }

    .hero__texto{

        max-width:none;

        padding:2rem;

    }

}

/*==================================
POR QUÉ ELEGIR
==================================*/

.porque-elegir-seccion .seccion-titulo{

    margin:0 0 1rem;

    max: width 1000px;;

    color:var(--color-primario-oscuro);

    line-height:1.2;

}

.porque-elegir{

    max-width:760px;

}

.porque-elegir h2{

    margin:0 0 1rem;

    color:var(--color-primario-oscuro);

    line-height:1.2;

}

.porque-elegir-seccion .seccion-intro{

    max-width: 1000px;

    margin:0 0 2rem;

    line-height:1.9;

    color:#556678;

}

/* ===== INTRODUCCIÓN ===== */

.intro-seccion{
    padding: 3rem 0 var(--espaciado-seccion) 0;
}


.intro-grid {
    display: flex;
    flex-direction: column;
    gap: 5rem;
}

/* Cada bloque (texto + imagen) */

.intro-item {
    display: grid;
    grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
    gap: 2rem;
    align-items: start;
}

/* Desktop */

@media (min-width: 768px) {
    .intro-item {
        grid-template-columns: 1fr 1fr;
        gap: 4rem;
    }

    /* Alternar imagen y texto */

    .intro-item:nth-child(even) .intro-item__texto {
        order: 2;
    }

    .intro-item:nth-child(even) .intro-item__imagen {
        order: 1;
    }
}

/* Texto */

.intro-item__texto {
    max-width: 520px;
}

.intro-item__texto h2 {
    margin-top: 0;
    margin-bottom: 1rem;
    color: var(--color-primario-oscuro);
}

.intro-card__texto p:first-child {
    margin-top: 0;
}

.intro-card__texto p:last-child {
    margin-bottom: 0;
}

/* Imagen */

.intro-item__imagen img {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    border-radius: var(--radio-borde);
    overflow:hidden;
    box-shadow:0 12px 35px rgba(0,0,0,.08);
}
/* ===== TESTIMONIOS ===== */
.testimonios-seccion { padding: var(--espaciado-seccion) 0; background: var(--color-blanco); }
.testimonios-titulo { text-align: center; max-width: 700px; margin: 0 auto 3rem; font-weight: 600; }
.testimonios-grid { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
@media (min-width: 768px) { .testimonios-grid { grid-template-columns: repeat(2, 1fr); } }
.testimonio-card { background: var(--color-fondo); border-left: 4px solid var(--color-primario); padding: 1.5rem; border-radius: var(--radio-borde); margin: 0; }
.testimonio-card__texto { font-style: italic; margin-bottom: 1rem; }
.testimonio-card__autor cite { font-style: normal; font-weight: 600; display: block; }
.testimonio-card__ciudad { font-size: 0.9rem; color: var(--color-primario-oscuro); }

/* ===== Fade-in sutil al hacer scroll =====
   Corto (500ms), sin rebote, y la regla prefers-reduced-motion
   que ya está arriba en este archivo lo anula por completo
   si el usuario tiene activado "reducir movimiento". */
.fade-in-al-scroll {
    opacity: 0;
    transform: translateY(12px);
    transition: opacity 500ms ease-out, transform 500ms ease-out;
}
.fade-in-al-scroll.visible {
    opacity: 1;
    transform: translateY(0);
}

/* ===== HERO DE PÁGINAS INTERNAS ===== */

/*==================================================
HERO DE PÁGINAS INTERNAS
==================================================*/

.pagina-header{

    position:relative;

    overflow:hidden;

    max-width:1090px;

    margin:0 auto 0rem;

    padding:4rem 5rem;

    background:#F4EFE7;

}

/* Mismas formas suaves y redondas del hero de portada (ahí son la
   sombra sobre la foto; aquí, sin foto, se quedan como decoración) */
.pagina-header::before{

    content:"";

    position:absolute;

    left:42%;

    top:15%;

    bottom:15%;

    width:1px;

    background:rgba(58,116,207,.15);

}
.pagina-header::after{

    content:"";

    position:absolute;

    top:50%;

    right:6%;

    transform:translateY(-50%);

    width:260px;

    height:320px;

    background:rgba(58,116,207,.10);

}
.pagina-header::before{ top:-70px; right:-70px; width:220px; height:220px; }
.pagina-header::after{ bottom:-90px; left:-60px; width:260px; height:260px; background: rgba(255,255,255,.06); }

.pagina-header__card{

    position:relative;

    z-index:2;

    width:min(560px,100%);

    padding:3.5rem;

    background:white;

    box-shadow:0 16px 45px rgba(18,71,120,.08);

}

.pagina-header h1{

    margin-bottom:1.5rem;

    color:var(--color-primario-oscuro);

    text-align:left;

    font-size:clamp(2.2rem,4vw,3.3rem);

    line-height:1.15;

}

.pagina-header__intro{

    color:#4F6073;

    text-align:left;

    line-height:1.9;

    font-size:1.05rem;

}

/* Corrige el contraste de subtítulos/etiquetas dentro del hero oscuro
   (antes se veían casi invisibles, porque heredaban el mismo azul del fondo) */
.pagina-header .seccion-subtitulo,
.pagina-header .seccion-intro{
    color: rgba(255,255,255,.92);
}

@media (max-width:900px){

    .pagina-header{

        padding:2rem;

    }

    .pagina-header__card{

        width:100%;

        padding:2rem;

    }

    .pagina-header::before,
    .pagina-header::after{

        display:none;

    }

}

/* ===== GRID DE TERAPIAS =====
   Mismo patrón de tarjeta que Cursos / Publicaciones / Blog:
   imagen arriba, contenido abajo, en un grid responsivo. */

.enfoques-terapeuticos { margin-bottom: 3rem; }
.terapias-lista {
    padding: clamp(1.5rem, 4vw, 2rem) 0 var(--espaciado-seccion);
    background: var(--color-fondo);
}

.terapias-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 2rem;
}

.terapia-card {
    flex: 0 1 calc((100% - 4rem) / 3);
    max-width: 300px;
}

.terapia-card {
    display: flex;
    flex-direction: column;
    background: var(--color-blanco);
    border-radius: var(--radio-borde);
    overflow: hidden;
    box-shadow: 0 10px 28px rgba(18, 71, 120, 0.06);
}

.terapia-card__imagen {
    width: 100%;
    aspect-ratio: 4 / 3;
    overflow: hidden;
}

.terapia-card__imagen img,
.terapia-card__imagen-placeholder {
    display: block;
    width: 100% !important;
    height: 100% !important;
    max-width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
}

.terapia-card__imagen-placeholder {
    display: grid;
    place-items: center;
    background: var(--color-acento);
    color: var(--color-primario-oscuro);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.terapia-card__contenido {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 1.75rem;
}

.terapia-card__contenido h2 {
    margin: 0 0 0.75rem;
    color: var(--color-primario-oscuro);
    font-size: 1.3rem;
    line-height: 1.25;
}

.terapia-card__descripcion {
    flex: 1;
    font-size: 0.98rem;
    line-height: 1.85;
    color: #4A5568;
}

.terapia-card__descripcion > :first-child { margin-top: 0; }
.terapia-card__descripcion > :last-child { margin-bottom: 0; }

.terapia-card__cta {
    margin-top: 1.5rem;
}

.btn--pequeno {
    padding: 0.65rem 1.4rem;
    font-size: 0.9rem;
}

@media (max-width: 450px) {
    .terapias-grid {
        gap: 1.5rem;
    }

    .terapia-card {
        flex: 1 1 100%;
        max-width: 100%;
    }
}
/* ===== CURSOS ===== */
.cursos-lista { padding: 2rem 0 var(--espaciado-seccion); }

.cursos-grid { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
@media (min-width: 640px) { .cursos-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .cursos-grid { grid-template-columns: repeat(3, 1fr); } }

.curso-card {
    background: var(--color-blanco);
    border-radius: var(--radio-borde);
    overflow: hidden;
}
.curso-card__imagen { position: relative; }
.curso-card__imagen img { width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; }
.curso-card__imagen--placeholder {
    aspect-ratio: 4/3;
    background: var(--color-acento);
    display: flex;
    align-items: center;
    justify-content: center;
}
.curso-card__etiqueta {
    position: absolute;
    top: 1rem;
    left: 1rem;
    background: var(--color-primario);
    color: #fff;
    font-size: 0.8rem;
    padding: 0.3rem 0.8rem;
    border-radius: 999px;
}
.curso-card__imagen--placeholder .curso-card__etiqueta { position: static; }
.curso-card__contenido { padding: 1.5rem; }
.curso-card__contenido h2 { color: var(--color-primario-oscuro); margin-top: 0; }
.curso-card__fecha { font-size: 0.9rem; color: var(--color-primario-oscuro); }

/* Estado vacío general (Coming soon) */
.cursos-vacio {
    text-align: center;
    max-width: 500px;
    margin: 3rem auto;
    background: var(--color-blanco);
    padding: 3rem 2rem;
    border-radius: var(--radio-borde);
}
.cursos-vacio h2 { color: var(--color-primario-oscuro); }

/* ===== ATENCIÓN EMPRESARIAL (layout editorial) ===== */
.pagina-header--empresarial {
    background: linear-gradient(135deg, var(--color-primario-oscuro) 0%, var(--color-primario) 100%);
}

.empresarial-seccion {
    padding: clamp(3.5rem, 7vw, 6rem) 0;
    background: var(--color-blanco);
}
.empresarial-seccion--formacion {
    background: var(--color-fondo);
}

/* ---- bloque editorial: texto + imagen, sin caja ni sombra ---- */
.editorial-bloque {
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    gap: clamp(2rem, 5vw, 4rem);
    align-items: center;
    margin-bottom: clamp(4rem, 8vw, 6rem);
}

.editorial-bloque--reversa {
    grid-template-columns: 1fr;
}



.editorial-bloque__texto--ancho {
    max-width: 70ch;
}

.editorial-eyebrow {
    display: block;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--color-primario);
    margin-bottom: .9rem;
}

/* regla vertical: el elemento de firma de esta página */
.editorial-regla {
    display: block;
    width: 42px;
    height: 3px;
    background: var(--color-primario);
    margin-bottom: 1.3rem;
}

.editorial-titulo {
    font-size: clamp(1.9rem, 4vw, 2.6rem);
    line-height: 1.15;
    font-weight: 700;
    color: var(--color-primario-oscuro);
    margin: 0 0 1.25rem;
}

.editorial-parrafo {
    font-size: 1.02rem;
    line-height: 1.85;
    color: var(--color-texto);
    margin: 0 0 1.5rem;
}

.editorial-parrafo--inline strong,
.editorial-parrafo strong {
    color: var(--color-primario-oscuro);
}

.editorial-parrafo--espaciado {
    margin-top: 2.25rem;
    margin-bottom: .5rem;
}

/* lista editorial: sin fondo, sin píldora — solo tipografía y una línea */
.editorial-lista {
    list-style: none;
    margin: 0;
    padding: 0;
    border-top: 1px solid var(--color-acento);
}

.editorial-lista li {
    padding: .75rem 0;
    border-bottom: 1px solid var(--color-acento);
    color: var(--color-texto);
    line-height: 1.5;
}

.editorial-lista li::before {
    content: "— ";
    color: var(--color-primario);
    font-weight: 700;
}

.editorial-lista--dos-columnas {
    column-count: 2;
    column-gap: 2.5rem;
}

.editorial-lista--dos-columnas li {
    break-inside: avoid;
}

.editorial-bloque__imagen img {
    width: 100%;
    display: block;
    object-fit: cover;
    aspect-ratio: 4/5;
    /* sin border-radius, sin shadow: se apoya directo sobre el fondo */
}

.empresarial-cta {
    text-align: center;
    margin-top: 1rem;
}

@media (max-width: 900px) {
    .editorial-bloque {
        grid-template-columns: 1fr;
    }
    .editorial-bloque__texto,
    .editorial-bloque__texto--ancho {
        max-width: none;
    }
    .editorial-lista--dos-columnas {
        column-count: 1;
    }
}

/* ===== INTRODUCCIÓN DE PÁGINA ===== */

.pagina-intro__titulo{
    
    margin:3rem 0 1.5rem;
    font-size:clamp(1.75rem,2vw,2.75rem);
    color:var(--color-primario-oscuro);

    text-align:left;

}


.pagina-intro__texto{

    max-width: 1060px;

    margin: 0 auto;

    text-align: left;

    font-size: 1.1rem;

    line-height: 1.9;

    color: var(--color-texto);

}

.pagina-header__modalidades{

    margin-top:1.75rem;

    padding-top:1rem;

    border-top:1px solid rgba(18,71,120,.10);

}

.pagina-header__modalidades-label{

    display:block;

    margin-bottom:.35rem;

    font-size:.72rem;

    font-weight:700;

    text-transform:uppercase;

    letter-spacing:.12em;

    color:#7A8794;

}

.pagina-header__modalidades-items{

    font-size:.92rem;

    color:var(--color-primario-oscuro);

    font-weight:500;

}

/*==========================
BIOGRAFÍA
==========================*/

.bio-seccion{
    padding: 0rem 0;
}

.bio-card{

    display:grid;
    grid-template-columns:420px 1fr;

    background:#fff;

    box-shadow:0 18px 45px rgba(18,71,120,.08);

    overflow:hidden;

    align-items:stretch;

}

/* FOTO */

.bio-card__foto{

    overflow:hidden;

}

.bio-card__foto img{

    display:block;

    width:100%;
    height:100%;

    object-fit:cover;

}

/* CONTENIDO */

.bio-card__contenido{

    padding:3.5rem;

    display:flex;
    flex-direction:column;
    justify-content:center;

}

.bio-card__eyebrow{

    display:inline-block;

    margin-bottom:1rem;

    font-size:.8rem;

    font-weight:700;

    letter-spacing:.08em;

    text-transform:uppercase;

    color:var(--color-primario);

}

.bio-card__contenido h1{

    margin:0 0 1.5rem;

    color:var(--color-primario-oscuro);

}

.bio-card__contenido p{

    margin-bottom:1.25rem;

    line-height:1.9;

}

/* RESPONSIVE */

@media (max-width:900px){

    .bio-card{

        grid-template-columns:1fr;

    }

    .bio-card__foto{

        height:420px;

    }

    .bio-card__contenido{

        padding:2rem;

    }

}
/* ===== FORMACIÓN ===== */
/* Grados académicos: lista de filas, no tarjetas en grid.
   Con solo 5 ítems y sin año en la mayoría, una lista se lee
   mucho más ligera que un grid de tarjetas con sombra. */

.formacion-seccion{
    padding:2rem 0 var(--espaciado-seccion);
    background:var(--color-fondo);
}
.formacion-lista{
    list-style:none;
    max-width:720px;
    margin:0 auto;
    padding:0;
    display:flex;
    flex-direction:column;
    gap:0.6rem;
}

.formacion-item{
    display:flex;
    align-items:baseline;
    flex-wrap:wrap;
    column-gap:0.75rem;
    row-gap:0.2rem;
    padding:1rem 1.3rem;
    background:#fff;
    border-left:3px solid var(--color-primario);
}

.formacion-item__anio{
    flex-shrink:0;
    font-size:0.85rem;
    font-weight:700;
    color:var(--color-primario);
}

.formacion-item__titulo{
    font-size:1.02rem;
    font-weight:600;
    color:var(--color-primario-oscuro);
}

.formacion-item__institucion{
    color:#69798D;
    font-size:0.92rem;
}
.formacion-item strong{

    font-size:1.05rem;

}

/* ===== Etiqueta base (usada en Formación y en el grid genérico) ===== */
.etiqueta{
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    padding: .65rem 1rem;
    background: white;
    border-radius: 14px;
    border: 1px solid #E4ECF8;
    box-shadow: 0 4px 12px rgba(20,60,120,.05);
    color: var(--color-primario-oscuro);
    font-weight: 500;
    transition: all .25s ease;
}

.etiqueta:hover{
    border-color: var(--color-primario);
    transform: translateY(-2px);
    box-shadow: 0 8px 18px rgba(20,60,120,.10);
}

.etiqueta::before{
    content: "✓";
    display: flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: rgba(58, 116, 207, .12);
    color: var(--color-primario);
    font-size: .75rem;
    font-weight: 700;
    flex-shrink: 0;
}

/* ===== Formación complementaria (etiquetas agrupadas por categoría) ===== */
.etiquetas-formacion { max-width: 700px; margin: 2.5rem auto 0; }
.etiquetas-formacion__grupo { margin-bottom: 1.5rem; }
.etiquetas-formacion__titulo {
    font-size: 0.85rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--color-primario-oscuro);
    margin: 0 0 0.6rem;
}
.etiquetas-formacion__lista { display: flex; flex-wrap: wrap; gap: 0.6rem; }
.etiqueta--reconocimiento { border-left-color: var(--color-acento); }
.etiqueta--afiliacion { border-left-color: var(--color-primario-oscuro); }

/* ===== Grid de etiquetas genérico (reutilizable en todo el sitio:
   "Nos distingue", Modalidades, Áreas de atención, Enfoque terapéutico,
   Cursos y conferencias, Líneas de investigación) ===== */
.grid-etiquetas{

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(260px,1fr));

    gap:1rem;

}
.seccion-subtitulo {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--color-primario-oscuro);
    margin: 2rem 0 0.5rem;
}

/* ===== EN QUÉ TE AYUDO ===== */

.lista-ayuda{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:.9rem 2.5rem;

    margin:2rem 0;
    padding:0;

    list-style:none;
}

.lista-ayuda li{
    position:relative;

    padding:.15rem 0 .15rem 1rem;

    color:var(--color-primario-oscuro);
    font-weight:500;
    line-height:1.5;
}

.lista-ayuda li::before{
    content:"";

    position:absolute;
    left:0;
    top:50%;

    transform:translateY(-50%);

    width:3px;
    height:1.1rem;

    border-radius:999px;

    background:var(--color-primario);
}

@media (max-width:768px){

    .lista-ayuda{
        grid-template-columns:1fr;
        gap:.75rem;
    }

}

/* ===== EXPERIENCIA ===== */
.experiencia-seccion { padding: 2rem 0 var(--espaciado-seccion); background: var(--color-blanco); }
.experiencia-grid { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
@media (min-width: 768px) { .experiencia-grid { grid-template-columns: 1fr 1fr; } }
.experiencia-card { background: var(--color-fondo); border-radius: var(--radio-borde); padding: 1.5rem; }
.experiencia-card h3 { color: var(--color-primario-oscuro); margin-top: 0; margin-bottom: 0.3rem; }
.experiencia-card__periodo { font-size: 0.85rem; color: var(--color-primario); font-weight: 600; margin-top: 0; }

/* ===== PUBLICACIONES ===== */
.publicaciones-seccion { padding: 2rem 0 var(--espaciado-seccion); background: var(--color-blanco); }
.publicaciones-grid { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
@media (min-width: 640px) { .publicaciones-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .publicaciones-grid { grid-template-columns: repeat(3, 1fr); } }
.publicacion-card { background: var(--color-fondo); border-radius: var(--radio-borde); overflow: hidden; display: flex; flex-direction: column; }
.publicacion-card__portada img { width: 100%; aspect-ratio: 3/4; object-fit: cover; display: block; }
.publicacion-card__info { padding: 1.2rem; }
.publicacion-card__info h3 { color: var(--color-primario-oscuro); margin: 0 0 0.3rem; }
.publicacion-card__meta { font-size: 0.85rem; opacity: 0.75; margin-top: 0; }

/* ===== PODCAST ===== */
.podcast-seccion { padding: 2rem 0 var(--espaciado-seccion); }
.podcast-grid { display: grid; grid-template-columns: 1fr; gap: 2rem; }
@media (min-width: 768px) { .podcast-grid { grid-template-columns: 1fr 1fr; } }
.podcast-card { background: var(--color-blanco); border-radius: var(--radio-borde); overflow: hidden; }
.podcast-card__video { aspect-ratio: 16/9; }
.podcast-card__video iframe { width: 100%; height: 100%; display: block; border: 0; }
.podcast-card__info { padding: 1.2rem; }
.podcast-card__info h3 { color: var(--color-primario-oscuro); margin-top: 0; }

/* ===== INVESTIGACIONES ===== */
.investigaciones-seccion { padding: 2rem 0 var(--espaciado-seccion); background: var(--color-blanco); }
.investigaciones-lista { list-style: none; padding: 0; max-width: 750px; margin: 0 auto; }
.investigacion-item { background: var(--color-fondo); border-radius: var(--radio-borde); padding: 1.5rem; margin-bottom: 1rem; }
.investigacion-item h3 { color: var(--color-primario-oscuro); margin: 0 0 0.5rem; }
.investigacion-item__anio { font-weight: 400; opacity: 0.7; font-size: 0.9rem; }

/* ===== BLOG ===== */
.blog-seccion { padding: 2rem 0 var(--espaciado-seccion); }
.blog-grid { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
@media (min-width: 768px) { .blog-grid { grid-template-columns: repeat(3, 1fr); } }
.blog-card { background: var(--color-blanco); border-radius: var(--radio-borde); overflow: hidden; }
.blog-card__imagen img { width: 100%; aspect-ratio: 16/10; object-fit: cover; display: block; }
.blog-card__info { padding: 1.2rem; }
.blog-card__info h3 { margin-top: 0; font-size: 1.05rem; }
.blog-card__info h3 a { color: var(--color-primario-oscuro); text-decoration: none; }
.blog-ver-mas { text-align: center; margin-top: 1rem; }

/* ===== AGENDA TU CITA ===== */
.agenda-seccion { padding: 2rem 0 var(--espaciado-seccion); }
.contenedor--angosto { max-width: 600px; }

.aviso { padding: 1.5rem; border-radius: var(--radio-borde); margin-bottom: 1.5rem; }
.aviso--exito { background: #E3F5E9; border-left: 4px solid #4CAF7D; }
.aviso--error { background: #FBE9E9; border-left: 4px solid #D96C6C; }
.aviso--exito h2 { margin-top: 0; color: #2F6B4E; }

.form-cita { display: flex; flex-direction: column; gap: 1.3rem; background: var(--color-blanco); padding: 2rem; border-radius: var(--radio-borde); box-shadow: 0 12px 32px rgba(18, 71, 120, 0.08); }
.form-cita__campo--trampa { position: absolute; left: -9999px; }
.form-cita__campo { display: flex; flex-direction: column; gap: 0.4rem; }
.form-cita__campo label,
.form-cita__campo legend { font-weight: 600; color: var(--color-primario-oscuro); }
.form-cita__campo input {
    padding: 0.8rem 1rem;
    border: 1px solid var(--color-acento);
    border-radius: var(--radio-borde);
    font-family: inherit;
    font-size: 1rem;
}
.form-cita__campo input:focus {
    outline: 3px solid var(--color-primario);
    outline-offset: 1px;
}
.form-cita__ayuda { font-size: 0.85rem; opacity: 0.75; }
.form-cita__radio { font-weight: 400; display: inline-flex; align-items: center; gap: 0.4rem; margin-right: 1.5rem; color: var(--color-texto); }
.form-cita fieldset { border: none; padding: 0; margin: 0; }
.form-cita button[type="submit"] { align-self: flex-start; border: none; cursor: pointer; font-size: 1rem; }

/* ===== FOOTER ===== */
.sitio-footer { background: var(--color-primario-oscuro); color: #fff; padding: 3.5rem 0 0; margin-top: var(--espaciado-seccion); }
.footer-grid { display: grid; grid-template-columns: 1fr; gap: 2.5rem; padding-bottom: 3rem; }
@media (min-width: 768px) { .footer-grid { grid-template-columns: repeat(3, 1fr); } }

.footer-col h3 { color: #fff; margin-top: 0; margin-bottom: 1rem; font-size: 1rem; text-transform: uppercase; letter-spacing: 0.05em; opacity: 0.85; }

.footer-redes { display: flex; gap: 0.8rem; flex-wrap: wrap; }
.footer-red-icono {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: rgba(255,255,255,0.12);
    color: #fff;
    transition: background var(--transicion-suave);
}
.footer-red-icono:hover { background: rgba(255,255,255,0.25); }

.footer-contacto-lista { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 0.6rem; opacity: 0.9; }
.footer-contacto-lista a { color: #fff; }
.footer-horarios { font-size: 0.9rem; opacity: 0.8; }

.footer-cta { display: flex; flex-direction: column; gap: 1rem; align-items: flex-start; }
.frase-motivante { font-style: italic; opacity: 0.9; margin: 0; }
.footer-cta .btn { background: #fff; color: var(--color-primario-oscuro); }
.footer-cta .btn:hover { background: var(--color-fondo); }

.footer-legal { border-top: 1px solid rgba(255,255,255,0.15); padding: 1.2rem 0; margin-top: 1rem; }
.footer-legal p { text-align: center; font-size: 0.85rem; opacity: 0.75; margin: 0; }

/* ===== ÁREAS DE ATENCIÓN (categorías) ===== */
.ayuda-seccion {
    padding: clamp(1rem, 3vw, 3rem) 0;
    background: var(--color-fondo);
}

.ayuda-grid {
    margin-top: 2.5rem;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 1.5rem;
}

.ayuda-card {
    background: var(--color-blanco);
    border-radius: var(--radio-borde);
    padding: 1.75rem;
    box-shadow: 0 4px 18px rgba(18, 71, 120, .06);
}

.ayuda-card__titulo {
    margin: 0 0 1rem;
    font-size: 1.05rem;
    color: var(--color-primario-oscuro);
    border-bottom: 2px solid var(--color-acento);
    padding-bottom: .6rem;

    
}

.ayuda-card__lista {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: .55rem;
}

.ayuda-card__lista li {
    position: relative;
    padding-left: 1.1rem;
    font-size: .92rem;
    line-height: 1.5;
    color: var(--color-texto);
}

.ayuda-card__lista li::before {
    content: "";
    position: absolute;
    left: 0;
    top: .55em;
    width: 6px;
    height: 6px;
    background: var(--color-primario);
    border-radius: 50%;
}

@media (max-width: 767px) {
    .ayuda-grid { grid-template-columns: 1fr; }
}