/*
Theme Name: senda
Author:
Author URI:
Theme URI: 
Tags: full-site-editing, block-patterns
Text Domain: senda
Requires at least: 6.4
Requires PHP: 7.4
Tested up to: 6.4
Version: 1.0.6

License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

/* Colors theme */
html:root {
    --wp--preset--color--gradient: linear-gradient(90deg, #0E0E90 0%, #171EA0 51.14%, #334DCF 102.27%);
    --wp--preset--color--gradient-2: linear-gradient(129deg, #4C5EB6 45.95%, #BEB0D4 116.77%);

}
/* Gradients */
html:root {
    --wp--preset--gradient--primary-white: linear-gradient(
            #4C5EB6 49.9%,
            #BEB0D4 50%
    );
    --wp--preset--gradient--white-primary: linear-gradient(
            #4C5EB6 49.9%,
            #BEB0D4 50%
    );
}
/* Duotone */
html:root {
    --wp--preset--duotone--secondary-primary: #334DCF, #FFFFFF;
    --wp--preset--duotone--primary-contrast: #AEB9EF, #FFFFFF;
}
/* Typo */
html:root {
    --wp--preset--font-family--system: "Saans", sans-serif;
    --wp--preset--font-family--serif: "Helvetica Neue", sans-serif;
    --wp--preset--font-family--monospace: "Helvetica Neue", sans-serif;
}

/* Fonts */
@font-face {
    font-display: swap;
    font-family: 'Saans';
    font-style: normal;
    font-weight: 300;
    src: url('./assets/fonts/SaansLight.woff2') format('woff2');
}
@font-face {
    font-display: swap;
    font-family: 'Saans';
    font-style: normal;
    font-weight: 400;
    src: url('./assets/fonts/SaansRegular.woff2') format('woff2');
}
@font-face {
    font-display: swap;
    font-family: 'Saans';
    font-style: normal;
    font-weight: 500;
    src: url('./assets/fonts/SaansMedium.woff2') format('woff2');
}
@font-face {
    font-display: swap;
    font-family: 'Saans';
    font-style: normal;
    font-weight: 600;
    src: url('./assets/fonts/SaansSemiBold.woff2') format('woff2');
}
@font-face {
    font-display: swap;
    font-family: 'Saans';
    font-style: normal;
    font-weight: 700;
    src: url('./assets/fonts/SaansBold.woff2') format('woff2');
}
@font-face {
    font-display: swap;
    font-family: 'Saans';
    font-style: normal;
    font-weight: 800;
    src: url('./assets/fonts/SaansHeavy.woff2') format('woff2');
}


html:root {
    --wp--preset--line-height-display: 1.2;
    --wp--preset--line-height-h1: 1.2;              
    --wp--preset--line-height-h2: 1.2;              
    --wp--preset--line-height-h3: 1.2;              
    --wp--preset--line-height-h4: 1.4;                 
    --wp--preset--line-height-h5: 1.4;                
    --wp--preset--line-height-body: 1.7;             
    --wp--preset--line-height-small: 1.4;          
    --wp--preset--line-height-caption: 1.4;
}
html:root {
    --wp--preset--font-weight-300: 300;
    --wp--preset--font-weight-400: 400;
    --wp--preset--font-weight-500: 500;
    --wp--preset--font-weight-600: 600;
    --wp--preset--font-weight-700: 700;
    --wp--preset--font-weight-800: 800;
}

body * {
    scroll-margin-top: 50px;
  }


html:root :where(.is-layout-flow) > * {
    margin-block-start: 0.5rem;
}
h1,
h2,
h3,
h4,
h5,
.has-serif-font-family{
    font-family: "Saans", sans-serif;
    font-weight: var(--wp--preset--font-weight-400);
}

p, ul, ol{
    margin-top: 0;
    margin-bottom: 16px;
}

body h1,
.has-h-1-font-size, .h1{
    font-size: var(--wp--preset--font-size--h-1);
    line-height: var(--wp--preset--line-height-h1);
    margin-top: 1rem;
}
body h2,
.has-h-2-font-size, .h2{
    font-size: var(--wp--preset--font-size--h-2);
    line-height: var(--wp--preset--line-height-h2);
    margin-top: 2rem;
    margin-bottom: 1rem;
}
body h3,
.has-h-3-font-size, .h3{
    font-size: var(--wp--preset--font-size--h-3);
    line-height: var(--wp--preset--line-height-h3);
    margin-top: 2rem;
    margin-bottom: 1rem;
}
body h4,
.has-h-4-font-size, .h4{
    font-size: var(--wp--preset--font-size--h-4);
    line-height: var(--wp--preset--line-height-h4);
    margin-top: 1.5rem;
    margin-bottom: 1rem;
}
body h5,
.has-h-5-font-size, .h5{
    font-size: var(--wp--preset--font-size--h-5);
    line-height: var(--wp--preset--line-height-h5);
    margin-top: 1.5rem;
    margin-bottom: 0.75rem;
}

body .has-display-font-size{
    font-size: var(--wp--preset--font-size-display);
    line-height: var(--wp--preset--line-height-display);
    margin-bottom: 0.75rem;
}
body .has-small-font-size{
    font-size: var(--wp--preset--font-size--small);
    line-height: var(--wp--preset--line-height-small);
    margin-bottom: 0.75rem;
}
body .has-body-font-size{
    font-size: var(--wp--preset--font-size--body) !important;
    line-height: var(--wp--preset--line-height-body);
    margin-bottom: 0.75rem;
}
body .has-caption-font-size{
    font-size: var(--wp--preset--font-size--caption);
    line-height: var(--wp--preset--line-height-caption);
    margin-bottom: 0.75rem;
}

/* Design */
html:root {
    --wp--custom--layout--wide-size: 1500px;
    --wp--custom--layout--content-size: 1350px;
    --wp--custom--layout--desktop-width: 1100px;
    --wp--custom--layout--content-width: 844px;
    --wp--custom--layout--regular-width: 600px;
    --wp--custom--layout--narrow-width: 548px;
    --wp--custom--layout--picture-width: 414px;
    --padding-horizontal: 128px;
    --padding-horizontal-small: 92px;
    --padding-vertical: 116px;
    --padding-vertical-small: 84px;

}

.b-block * {
    margin-block-start: 0;
    margin-block-end: 0;
}
@media (min-width: 921px) {
    .alignfull {
        margin-left: calc(calc(50% - 8px) - 50vw);
        margin-right: calc(calc(50% - 8px) - 50vw);
        max-width: 100vw;
        width: auto;
    }
}
.has-text-align-center{
    text-align: center;
}
.has-text-align-left{
    text-align: left;
}
.has-text-align-right{
    text-align: right;
}
.privacy-policy main, #legal main{
    margin-top: 184px;
}
/* Spacing */
html:root {
    --wp--preset--spacing--60: 3.75rem;
    --wp--preset--spacing--50: 3.125rem;
    --wp--preset--spacing--40: 2.5rem;
    --wp--preset--spacing--30: 1.875rem;
    --wp--preset--spacing--20: 1.125rem;
    --wp--preset--spacing--13: 0.813rem;
}
/* Light mode */
html::backdrop,
html:root {
    --sans-font:
            -apple-system, BlinkMacSystemFont, "Avenir Next", Avenir,
            "Nimbus Sans L", Roboto, "Noto Sans", "Segoe UI", Arial, Helvetica,
            "Helvetica Neue", sans-serif;
    --mono-font:
            Consolas, Menlo, Monaco, "Andale Mono", "Ubuntu Mono", monospace;
    --standard-border-radius: 24px;
    --bg: var(--wp--preset--color--secondary-30);
    --accent-bg: var(--wp--preset--color--primary-100);
    --text: var(--wp--preset--color--black);
    --text-light: var(--wp--preset--color--primary-100);
    --border: var(--wp--preset--color--primary-150);
    --accent: var(--wp--preset--color--primary-150);
    --code: var(--wp--preset--color--neutral-100);
    --preformatted: var(--wp--preset--color--neutral-100);
    --marked: var(--wp--preset--color--neutral-150);
    --disabled: #efefef;
    --wp--preset--color--base: var(--wp--preset--color--white);
}
/* End light mode */

/* El sitio es 100% diseño claro (colores hardcodeados en todo style.css,
   sin contrapartida oscura real) — declarar color-scheme: dark aquí para
   usuarios con modo oscuro del sistema activado solo servía para que el
   navegador pintara los <input>/<textarea>/<select> sin color de texto
   explícito con su paleta nativa oscura (texto blanco) sobre el fondo
   claro que sí define esta hoja de estilos, dejándolos invisibles
   (bug encontrado en los formularios de empresas/afiliados/prensa).
   Fijamos color-scheme: light explícitamente para que los controles de
   formulario usen siempre la paleta nativa clara, sea cual sea la
   preferencia del sistema del usuario. */
html:root {
    color-scheme: light;
}

/* Styles intended only for the front.*/
html {
    scroll-behavior: smooth;
}
@media screen and (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }
}
body {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    grid-template-columns:
        1fr min(var(--wp--custom--layout--content-size), 90%)
        1fr;
}
img,
video {
    opacity: 1;
    border-radius: 0;
}
article,
dialog,
fieldset {
    border: none;
}
main {
    padding-top: 0;
    grid-column: 2;
    min-height: 60vh;
}
html section {
    margin: 0;
    border: none;
}
html body {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    grid-template-columns:
        minmax(0, 1fr) min(var(--wp--custom--layout--content-size), 90%)
        minmax(0, 1fr);
    color: var(--wp--preset--color--neutral-800);
    overflow-x: hidden;
}


a{
    color: var(--accent);
}
body .wp-block-button__link{
    display: flex;
    align-items: center;
    padding: 10px 16px;
}
body .is-layout-flex{
    align-items: start;
}
body .wp-block-button.is-style-outline .wp-block-button__link{
    border-color: var(--text);
    color: var(--text);
}
.wp-block-button .button-icon-text{
    font-size: 12px;
    line-height: 22px;
}
body .wp-block-button__link img{
    margin-right: 4px;
}
.button.button-secondary{
    background-color: var(--wp--preset--color--white);
    color: var(--wp--preset--color--black);
    border: 2px solid var(--wp--preset--color--black);
    padding: 10px 16px;
}
.button.button-tab{
    color: var(--wp--preset--color--black);
    font-weight: 700;
    border-radius: 10px;
    border: 1px solid var(--wp--preset--color--grey-med);
    background: var(--wp--preset--color--grey-light);
    box-shadow: 0 0 10px 0 rgba(52, 64, 84, 0.10);
}
.button.button-tab:hover,
.button.button-tab.active{
    background-color: var(--wp--preset--color--white);
    border: 1px solid var(--wp--preset--color--grey-med);
}
.button.button-tab img{
    margin-right: 0.5rem;
}
body .wp-block-image.aligncenter{
    display: flex;
    justify-content: center;
}
.wp-block-columns:has(> .wp-block-column:only-child) {
    display: flex;
    justify-content: center;
}
body .wp-block-media-text>.wp-block-media-text__content{
    padding: 0;
}
body .wp-block-media-text>*:nth-child(1){
    padding-right: 3.75rem;
}
body .wp-block-media-text>*:nth-child(2){
    padding-left: 3.75rem;
}
.wp-block-gallery.has-nested-images:not(.is-cropped){
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-template-rows: repeat(3, 1fr);
    gap: 20px;
    aspect-ratio: 3 / 2;
    max-width: 1200px;
    margin: auto;
}
.wp-block-gallery .wp-block-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 20px;
}





/*Footer*/

.footer-general {
    border: 0;
    background-color: #E2DED4;
    color: #635E54;
    grid-column: 1 / -1;
    margin-top: 0;
    padding: var(--padding-vertical, 80px) var(--padding-horizontal, 128px);
    font-family: "Saans", sans-serif;
}
body .footer-general a:where(:not(.wp-element-button)) {
    color: #635E54;
    text-decoration: none;
    transition: color 0.2s ease;
}
body .footer-general a:where(:not(.wp-element-button)):hover {
    color: #334DCF;
}
.inner-footer-general {
    max-width: var(--wp--custom--layout--desktop-width, 1100px);
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-direction: column;
    gap: 48px;
}
.footer-columns {
    display: grid;
    grid-template-columns: 2fr 1.2fr 1.2fr 1.4fr 1.2fr;
    gap: 32px;
    width: 100%;
}
@media only screen and (max-width: 1200px) and (min-width: 921px) {
    .footer-columns {
        grid-template-columns: repeat(3, 1fr);
        gap: 32px;
    }
    .brand-column {
        grid-column: span 3;
        max-width: 100%;
    }
}

.footer-column {
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: flex-start;
    min-width: 0;
}
.brand-column {
    max-width: 320px;
}
.brand-tagline {
    font-size: 14px;
    line-height: 1.5;
    /* #8c8c96 era un gris frío ajeno a la paleta del tema, probablemente
       heredado de un footer oscuro anterior — ahora #635E54, que coincide
       con --color-neutral-700 y con el color de texto base del footer. */
    color: #635E54;
    margin-top: 8px;
}
.social-links {
    display: flex;
    gap: 16px;
    margin-top: 8px;
}
.social-links a {
    font-size: 13px;
    font-weight: 600;
}
.column-title {
    color: #2A2822;
    font-size: 16px;
    font-weight: 700;
    margin: 0 0 8px 0;
    text-transform: none;
    letter-spacing: normal;
}
.footer-links-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.footer-links-list li {
    padding: 0;
    margin: 0;
}
.footer-links-list li a {
    font-size: 15px;
    font-weight: 500;
    white-space: normal;
    word-break: break-word;
}
.footer-recursos-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
}
.footer-group-title {
    font-size: 11px;
    font-weight: 700;
    color: #8c8c96;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-top: 4px;
}
.footer-logo img.dark-logo {
    display: block;
    height: 32px;
    width: auto;
    max-width: 160px;
    filter: none;
    aspect-ratio: auto;
    object-fit: contain;
}
.footer-disclaimer-container {
    border-top: 1px solid #232329;
    padding-top: 32px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.footer-medical-disclaimer {
    font-size: 12px;
    line-height: 1.6;
    /* Mismo motivo que .brand-tagline: #6e6e77 no correspondía a ningún
       token de la paleta y quedaba con poco contraste sobre el fondo
       crema (#E2DED4) del footer. */
    color: #635E54;
    margin: 0;
    text-align: justify;
}
.footer-funding-logos {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin-top: 16px;
    margin-bottom: 8px;
}
.footer-funding-logos img.funding-logos-img {
    display: block;
    width: auto;
    height: 48px;
    max-width: 100%;
    aspect-ratio: auto;
    object-fit: contain;
    opacity: 0.65;
    filter: grayscale(1) brightness(0.3) contrast(1.1);
    transition: all 0.3s ease;
}
.footer-funding-logos img.funding-logos-img:hover {
    opacity: 0.85;
    filter: grayscale(1) brightness(0.2) contrast(1.2);
}
@media (max-width: 768px) {
    .footer-funding-logos img.funding-logos-img {
        max-width: 280px;
    }
}
.footer-copyright-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 13px;
    color: #635E54;
}
.footer-copyright-row .copyright span {
    font-size: 13px;
    color: #635E54;
}
.footer-legal-links {
    display: flex;
    gap: 24px;
}
/* Modal */
.modal {
    position: fixed;
    z-index: 20;
    width: 100vw;
    height: 100vh;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.modal.open {
    visibility: visible;
    opacity: 1;
    transition-delay: 0s;
}
.modal-bg {
    position: absolute;
    z-index: 9;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.8);
}
.modal-container {
    position: relative;
    z-index: 10;
    padding: 64px;
    border-radius: var(--standard-border-radius);
    background-color: var(--wp--preset--color--secondary-30);
    max-width: var(--wp--custom--layout--desktop-width);
    display: flex;
    padding: 100px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    overflow: visible;
}
.modal-close {
    position: absolute;
    right: 0;
    top: -68px;
    outline: none;
    appearance: none;
    color: var(--wp--preset--color--neutral-500);
    background: none;
    border: 0px;
    font-weight: var(--wp--preset--font-weight-300);
    cursor: pointer;
    font-size: 49px;
}
/*Blog*/
/* Antes teñía el fondo de estas páginas (blog, búsqueda, 404, legal...) de
   azul pálido (--secondary-30, #F2F5FC) en vez del blanco global
   (--color-neutral-50). Sin justificación aparente para el tinte y rompía
   la consistencia con el resto del sitio — se quita para que hereden el
   blanco por defecto de body en base.css. */
.paged .main-blog, .search main{
    margin-top: 180px;
    padding-bottom: var(--padding-vertical);
}
/* .single main ya no lleva margin-top propio: es redundante con el
   padding-top:76px que .page-interior .single-post main (header.css)
   aplica globalmente para el topbar fijo — sumados dejaban ~256px de
   hueco muerto entre el topbar y "Volver al blog". */
.blog main, .category main{
    padding-bottom: var(--padding-vertical);
}
.header-blog, .search-header{
    max-width: 1184px;
    margin: 0 auto;
}
.contenedor-post{
    max-width: var(--wp--custom--layout--content-width);
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 36px;
}
.contenedor-post > *{
    margin:0;
    padding: 0;
}

.post-info .wp-block-image{
    margin-bottom: 24px;
    margin-top: 24px;
}

.grid-blog{
    display: grid;
    gap: 12px;
    padding: 40px 0 0 0;
}
.post-categories{
    position: absolute;
    bottom: 0;
    right: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: end;
    padding: 8px;
    gap: 4px;
}
.post-category {
    display: flex;
    height: 32px;
    padding: 8px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 8px;
    background: var(--wp--preset--color--primary-40);
    color: var(--wp--preset--color--primary-100);
    font-weight: var(--wp--preset--font-weight-500);
    text-decoration: none;
}
.post-card{
    border-radius: var(--standard-border-radius);
    background: var(--wp--preset--color--secondary-30);
    padding: 8px 8px 0 8px;
    flex-direction: column;
    align-items: flex-start;
    transition: box-shadow 0.5s ease;
    position: relative;
}

.post-card::before,
.post-card::after{
    content: '';
    z-index: -1;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    border-radius: var(--standard-border-radius);
    box-shadow: 0px 8px 28px 0px #E1DCD4;
    opacity: 1;
    transition: opacity 0.5s ease;
}

.post-card::after{
    box-shadow: 0 12px 42px 0 #C5CEEC;;
    opacity: 0;
}

.post-card:hover::after{
    opacity: 1;
}

.post-card:hover::before{
    opacity: 0;
}


.post-card .post-title h4{
    font-weight: var(--wp--preset--font-weight-500);
}
.post-thumbnail {
    position: relative;
}
.post-thumbnail img {
    display: flex;
    width: 100%;
    height: 290px;
    object-fit: cover;
    border-radius: 16px 16px 0px 0px;
}
.post-content{
    display: flex;
    flex-direction: column;
    padding: 24px 16px;
    gap: 20px;
    text-align: left;
    color: var(--wp--preset--color--neutral-800);
}
.grid-blog a {
    text-decoration: none;
}
.reading-time {
    color: var(--wp--preset--color--neutral-500);
}
.pagination {
    min-width: 280px;
    display: flex;
    column-gap: 8px;
    row-gap: 8px;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    margin-top: 40px;
}
.pagination .page-numbers {
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    color: var(--wp--preset--color--neutral-800);
    font-weight: var(--wp--preset--font-weight-500);
    margin: 0;
    min-width: 42px;
    height: 42px;
    padding: 0 16px;
    border-radius: 12px;
    border: 1px solid var(--wp--preset--color--neutral-200);
    transition: all 0.2s;
    background-color: var(--wp--preset--color--white);
}
.pagination .page-numbers:hover {
    border: 1px solid var(--wp--preset--color--primary-90);
    color: var(--wp--preset--color--primary-90);
}
.pagination .current {
    background-color: var(--wp--preset--color--primary-90);
    color: var(--wp--preset--color--white);
    border-color: var(--wp--preset--color--primary-90);
}
.pagination .prev, .pagination .next {
    font-weight: 600;
}
.blog-titulo{
    margin: 0 auto;
    max-width: var(--wp--custom--layout--desktop-width);
    text-align: center;
}
.contenedor-sin-resultados {
    text-align: center;
}
/*Buscador*/
.search-form{
    display: flex;
    gap: 16px;
    border: solid 1px var(--wp--preset--color--neutral-200);
    background-color: var(--wp--preset--color--neutral-50);
    border-radius: 16px;
    overflow: hidden;
    padding: 10px 16px;
    max-width: 378px;
    flex-grow: 1;
    justify-content: space-between;
    height: 48px;
    align-items: center;

}
.search-submit{
    background-color: transparent;
    width: 32px;
    height: 32px !important;
    min-height: unset;
    padding: 4px !important;
    flex-shrink: 0;
    border-radius: 5px;
    min-width: unset;

}

.search-submit::after{
    content: none;
}

.search-submit:hover{
    background-color: transparent;
}

.search-submit:enabled:active{
    background: none;
}



.search-field{
    background-color: transparent;
    color: var(--wp--preset--color--neutral-700);
    font-size: var(--wp--preset--font-size--body);
    line-height: var(--wp--preset--line-height-body);
    font-weight: var(--wp--preset--font-weight-500);
    border: none;
    border-radius: 0;
    min-height: 28px;
    padding: 0;
}

.search-field::-webkit-search-decoration,
.search-field::-webkit-search-cancel-button,
.search-field::-webkit-search-results-button,
.search-field::-webkit-search-results-decoration {
    display: none;
}
.search-form label {
    padding: 0;
    width: 100%;
}

.search-form__input{
    border: none;
    margin-bottom: 0;
}
.search-submit img{
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
}
.contenedor-buscador {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    margin-bottom: 36px;
    max-width: min(100%, 1184px);
    margin-left: auto;
    width: 100%;
    margin-right: auto;
}
.single .contenedor-buscador {
    margin-bottom: 0;
}
.blog .contenedor-buscador, .category .contenedor-buscador{
    margin-top: 48px;
}
.back-to-blog a{
    text-decoration: none;
    color: var(--wp--preset--color--neutral-800);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    margin: 0;
    font-weight: var(--wp--preset--font-weight-500);
}
.back-to-blog a:hover{
    color: var(--wp--preset--color--primary-100);
}

.back-to-blog a:hover img{
    filter: brightness(0) saturate(100%) invert(24%) sepia(70%) saturate(4123%) hue-rotate(229deg) brightness(85%) contrast(89%);
}


.sin-resultado {
    color: var(--wp--preset--color--neutral-500);
    margin-bottom: 36px;
}
.blog .grid-blog-3-col, .category .grid-blog-3-col, .single .grid-blog-3-col {
    padding-bottom: var(--padding-vertical-small);
}
/*filtro*/
.departamentos-botones, .top-categories{
    display: flex;
    justify-content: center;
    gap: 12px;
    padding: 8px;
    margin-top: 20px;
    list-style-type: none;
    align-items: center;
}
.btn-departamento, .top-categories a{
    border-radius: 16px;
    border: 1px solid var(--wp--preset--color--neutral-200);
    height: 42px;
    padding: 4px 20px;
}
a.btn-departamento, .top-categories a{
    color: var(--wp--preset--color--neutral-600) !important;
    font-size: 16px; /* Por cambiar var(--fontSize-16, 16px);*/
    font-weight: var(--wp--preset--font-weight-500);
    line-height: 24px; /* Por cambiar */
    text-decoration: none;
    align-content: center;
}
.top-categories a {
    max-height: 38px;
    display: block;
}
a.btn-departamento:hover, .top-categories a:hover, .top-categories .active a {
    color: var(--wp--preset--color--neutral-800) !important;
    background-color: var(--wp--preset--color--primary-60);
    border: 1px solid var(--wp--preset--color--primary-60);
}
.top-categories a.close-btn{
    height: 25px;
    padding: 7px;
    display: flex;
    align-items: center;
}
/*Single*/
.contenedor-autor-rrss{
    display: grid;
    justify-content: space-between;
    align-items: flex-start;
    align-self: stretch;
    grid-template-columns: 1fr auto;
    grid-template-rows: 1fr auto;
    row-gap: 36px;
    height: 135px;
}
.post-author{
    display: flex;
    align-items: center;
    gap: 16px;
    color: var(--wp--preset--color--neutral-700);
    font-weight: var(--wp--preset--font-weight-500);
}
.author-role {
    color: var(--wp--preset--color--neutral-500);
}
.post-author img {
    width: 47px;
    height: 47px;
    border-radius: 47px;
    object-fit: cover;
}

.post-featured-image img{
    border-radius: var(--standard-border-radius);
}

/*Compartir RRSS*/
.share-container {
    position: relative;
    display: inline-block;
    text-align: right;
}

.share-toggle {
    padding: 8px;
    border: none;
    cursor: pointer;
    border-radius: 12px;
    font-weight: var(--wp--preset--font-weight-500);
    min-width: 120px;
}

.share-dropdown {
    display: none;
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    background-color: var(--wp--preset--color--secondary-30);
    border-radius: 12px;
    border: 1px solid var(--wp--preset--color--neutral-300);
    list-style: none;
    margin: 0;
    padding: 4px;
    z-index: 99;
    width: 188px;
}

.share-dropdown.visible {
    display: block;
    outline: 4px solid var(--wp--preset--color--secondary-30);
    outline-offset: -5px;
}

.share-dropdown li {
    padding: 12px;
}
.share-dropdown li:hover{
    background-color: var(--wp--preset--color--neutral-200);
}
.share-dropdown button {
    padding: 0;
}
.share-dropdown a,
.share-dropdown button {
    display: flex;
    align-items: center;
    gap: 16px;
    background: none;
    border: none;
    text-decoration: none;
    font-size: var(--wp--preset--font-size--caption);
    color: var(--wp--preset--color--neutral-800);
    font-weight: var(--wp--preset--font-weight-500);
    cursor: pointer;
    width: 100%;
}
/*404*/
.contenido-404{
    text-align: center;
    max-width: var(--wp--custom--layout--content-size);
    margin: 0 auto;
}
.contenedor-error404 {
    margin-top: 200px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: var(--padding-vertical-small);
}
.titulo-404{
    margin-bottom: 0;
}
.contenedor-error404 .contenedor-cta {
    margin-top: 40px;
}
/*Página legal*/
.privacy-policy main, #legal main, .page-id-19 main, .page-id-18 main, .page-id-107 main {
    grid-column: 2;
    width: 100%;
    max-width: var(--wp--custom--layout--content-width);
    margin-right: auto;
    margin-left: auto;
    margin-bottom: var(--padding-vertical-small);
    box-sizing: border-box;
}

/* Estilos de tipografía para páginas legales */
.privacy-policy main, .page-id-19 main, .page-id-18 main, .page-id-107 main {
    padding: 0 24px;
}
.privacy-policy main h1, .page-id-19 main h1, .page-id-18 main h1, .page-id-107 main h1 {
    font-family: "Saans", sans-serif;
    font-weight: 800;
    font-size: 36px;
    color: #0E0E90;
    margin-top: 48px;
    margin-bottom: 24px;
    line-height: 1.25;
}
.privacy-policy main h2, .page-id-19 main h2, .page-id-18 main h2, .page-id-107 main h2 {
    font-family: "Saans", sans-serif;
    font-weight: 750;
    font-size: 24px;
    color: #0E0E90;
    margin-top: 36px;
    margin-bottom: 16px;
    line-height: 1.3;
}
.privacy-policy main h3, .page-id-19 main h3, .page-id-18 main h3, .page-id-107 main h3 {
    font-family: "Saans", sans-serif;
    font-weight: 700;
    font-size: 20px;
    color: #0E0E90;
    margin-top: 28px;
    margin-bottom: 12px;
    line-height: 1.3;
}
.privacy-policy main p, .page-id-19 main p, .page-id-18 main p, .page-id-107 main p {
    font-family: "Saans", "Saans", sans-serif;
    font-size: 15px;
    line-height: 1.65;
    color: #635E54;
    margin-bottom: 16px;
}
.privacy-policy main li, .page-id-19 main li, .page-id-18 main li, .page-id-107 main li {
    font-family: "Saans", "Saans", sans-serif;
    font-size: 15px;
    line-height: 1.65;
    color: #635E54;
    margin-bottom: 8px;
}
.privacy-policy main ul, .page-id-19 main ul, .page-id-18 main ul, .page-id-107 main ul,
.privacy-policy main ol, .page-id-19 main ol, .page-id-18 main ol, .page-id-107 main ol {
    margin-bottom: 20px;
    padding-left: 24px;
}

/* Responsive */
@media only screen and (max-width: 1200px) {
    html:root {
        --padding-horizontal: 64px;
        --padding-horizontal-small: 48px;
        --padding-vertical: 96px;
        --padding-vertical-small: 64px;
    }
}

@media only screen and (max-width: 920px) {

    html:root{
        --padding-horizontal: 24px;
        --padding-horizontal-small: 12px;
        --padding-vertical: 68px;
        --padding-vertical-small: 40px;
        /*--wp--preset--font-size--body: 17px !important;*/
    }
    .alignfull {
        max-width: none;
    }
    .privacy-policy main, #legal main, .page-id-19 main, .page-id-18 main, .page-id-107 main {
        margin-top: 124px;
    }
    /*Footer*/
    .footer-columns {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 24px 16px !important;
    }
    .brand-column {
        grid-column: span 2 !important;
        margin-bottom: 16px !important;
    }
    .footer-copyright-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }
    /*Menú*/

   

    /*Blog*/
    body {
        overflow-x: hidden;
    }
    .header-blog{
        padding-top: 68px;
    }
    .grid-blog {
        grid-template-columns: 1fr;
        padding: 24px 16px !important;
        gap: 24px;
    }
    .departamentos-botones, .top-categories {
        gap: 8px;
        flex-wrap: wrap;
        padding: 8px 0;
        margin: 20px 16px 40px 16px;
    }
    .top-categories {
        justify-content: center;
    }
    .back-to-blog img {
        max-width: 14px;
    }
    .search-form {
        width: 100%;
    }
    .paged .main-blog, .search main{
        margin-top: 148px;
    }
    .paged .main-blog, .search main, .single main{
        margin-top: 124px;
    }
    .contenedor-error404 {
        margin-top: 168px;
    }
    /*Single*/
    .post-author{
        grid-column: 1 / 3;
    }
    .share-container {
        grid-column: 2 / 3;
    }
    .post-read {
        grid-column: 1 / 2;
        grid-row: 2 / 3;
    }
    .contenedor-autor-rrss {
        height: 126px;
        row-gap: 28px;
        align-items: center;
    }
    .contenedor-post {
        gap: 28px;
    }


}
@media screen and (min-width: 921px) {
    .grid-blog {
        grid-template-columns: repeat(auto-fill, minmax(268px, 1fr));
        grid-auto-rows: 1fr;
        max-width: min(100%, 1184px);
        margin: 0 auto;

    }
    .grid-blog-3-col {
        grid-template-columns: repeat(auto-fill, minmax(292px, 1fr));
    }
}

/** LANDING **/

.header-landing{
    background-color: var(--wp--preset--color--neutral-150);
    border-bottom: none;
   padding: clamp(2rem, 1.277rem + 2.143vw, 2.75rem) 0;
   display: grid;
   grid-template-columns: 1fr min(var(--wp--custom--layout--content-size), 90%) 1fr;
}

.header-landing__inner{
    grid-column: 2;
    margin: 0 auto;
    display: grid;
    width: 100%;
    max-width: min(90vw, var(--wp--style--global--wide-size));
    grid-template-columns: 32px 1fr 32px;
    place-items: center;
}


.header-landing__logo{
    width: clamp(12.5rem, 9.487rem + 8.929vw, 15.625rem);
    height: auto;
    display: block;
}

.page-landing{
    min-height: 772px;
    background-color: var(--wp--preset--color--neutral-150);
    overflow: hidden;
    position: relative;
    grid-column: 1 / -1;
    width: 100%;
    padding: clamp(2.5rem, 0.33rem + 6.429vw, 4.75rem) 5vw;
}

.page-landing__inner{
    padding: 40px 80px;
    background-color: var(--wp--preset--color--secondary-30);
    border-radius: var(--standard-border-radius);
    max-width: 1100px !important;
    margin: 0 auto;
    position: relative;
    z-index: 1;
}

.c-gradient{
    position: absolute;
    top: 0;
    left: 0;
    width: 861px;
    height: 596px;
    background-color: var(--wp--preset--color--primary-70);
    border-radius: 100%;
    z-index: 0;
    top: 100%;
    left: 50%;
    transform: translate(-50%, -50%);
    filter: blur(250px);
    mix-blend-mode: multiply;
}

@media (max-width: 920px) {
    .c-gradient{
        width: 765px;
        height: 531px;
    }

    .page-landing__inner{
        padding: 40px 24px;
    }

    .page-landing__inner .has-global-padding {
        padding-left: 0;
        padding-right: 0;
    }
}


/* Clases de utilidad */
.u_relative{
    position: relative;
}

.b-block .is_prose > *{
    margin-bottom: 16px;
}

/*Central*/
section.block-central{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--padding-vertical) 0;
    background: #334DCF; /* Azul plano del hero de la portada (antes degradado morado gradient-2) */
    color: var(--wp--preset--color--white);
    border: none;
    row-gap: 24px;
    text-align: center;
}
.si-img {
    min-height: 680px;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    width: auto;
}
section.block-central > * {
    max-width: 1100px;
    margin: 0 auto;
}
section.block-central.borde-blanco {
    border-radius: var(--standard-border-radius);
    margin-left: calc( 19px - var(--layout-margin) );
    margin-right: calc( 19px - var(--layout-margin) );
    margin-top: 12px;
    margin-bottom: 12px;
    padding: var(--padding-vertical-small) 0;
    row-gap: 32px;
}

section.block-central.borde-blanco .wpcf7-form{
    max-width: 343px;
}
section.block-central.borde-blanco > * {
    max-width: var(--wp--custom--layout--desktop-width);
}
section.block-central.borde-blanco > p:last-child {
    max-width: var(--wp--custom--layout--narrow-width);
}
.btn-centrar {
    justify-content: center;
}
@media (max-width: 920px) {
    section.block-central {
        padding: var(--padding-vertical) var(--padding-horizontal);
        row-gap: 20px;
    }
    .si-img {
        min-height: 632px;
    }
    section.block-central.borde-blanco {
        margin-left: calc( 12px - var(--layout-margin) );
        margin-right: calc( 12px - var(--layout-margin) );
        padding: var(--padding-vertical-small) var(--padding-horizontal);
        row-gap: 28px;
    }
}
/*Central-texto*/
section.b-central-texto{
    overflow: hidden;
    position: relative;
    background: var(--wp--preset--gradient--bg);
    padding: 164px 24px 116px;
}

.b-central-texto__inner{
    max-width: var(--wp--custom--layout--content-width);
    margin: 0 auto;
    background-color: var(--wp--preset--color--neutral-50);
    border-radius: var(--standard-border-radius);
    padding: 40px;
    position: relative;
    z-index: 1;
}

.is-style-secondary .c-gradient{
    background: var(--wp--preset--color--secondary-60);
}



@media (max-width: 920px) {
    section.b-central-texto{
        padding: 116px 24px var(--padding-vertical);
    }
    .b-central-texto__inner{
        padding: 40px 24px;
    }
}
/*Central texto*/
section.b-central-texto{
    overflow: hidden;
    position: relative;
    background: var(--wp--preset--gradient--bg);
    padding: 164px 24px 116px;
}

.b-central-texto__inner{
    max-width: var(--wp--custom--layout--content-width);
    margin: 0 auto;
    background-color: var(--wp--preset--color--neutral-50);
    border-radius: var(--standard-border-radius);
    padding: 40px;
    position: relative;
    z-index: 1;
}

.is-style-secondary .c-gradient{
    background: var(--wp--preset--color--secondary-60);
}



@media (max-width: 920px) {
    section.b-central-texto{
        padding: 116px 24px var(--padding-vertical);
    }
    .b-central-texto__inner{
        padding: 40px 24px;
    }
    .search-form {
        max-width: 100%;
    }
}

.input-tel{
    margin-top: 10px;
}
input.wpcf7-form-control.wpcf7-submit.has-spinner.input-enviar{
    margin-top: 24px;
}

/****************************************************
 * SENDA CUSTOM ENHANCEMENTS & OVERRIDES
 ****************************************************/

/* Center Gutenberg buttons globally */
.wp-block-buttons {
    justify-content: center !important;
}

/* Stretched button inside pricing cards */
.cuerpo-precios-completos .wp-block-buttons {
    width: 100% !important;
    margin-top: 16px !important;
    margin-bottom: 24px !important;
}
.cuerpo-precios-completos .wp-block-button {
    width: 100% !important;
}
.cuerpo-precios-completos .wp-element-button {
    width: 100% !important;
    justify-content: center !important;
}

/* Force left alignment on all footer column content */
.footer-column {
    align-items: flex-start !important;
    text-align: left !important;
}
.footer-links-list {
    align-items: flex-start !important;
    text-align: left !important;
}
.brand-column {
    text-align: left !important;
}
.footer-general {
    text-align: left !important;
}

/* App download buttons styling */
.app-downloads {
    display: flex;
    gap: 12px;
    margin-top: 20px;
    flex-wrap: nowrap !important;
}
.app-btn {
    display: flex;
    align-items: center;
    background-color: transparent !important;
    color: #2A2822 !important;
    border: 1.5px solid #DAD4C3 !important;
    border-radius: 8px;
    padding: 6px 12px;
    text-decoration: none !important;
    transition: all 0.2s ease;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    min-width: 135px;
    box-sizing: border-box;
}
.app-btn:hover {
    background-color: rgba(51, 77, 207, 0.05) !important;
    border-color: #334DCF !important;
}
.app-btn svg {
    margin-right: 8px;
    flex-shrink: 0;
    color: #2A2822 !important;
}
.app-btn-text {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
    text-align: left;
}
.app-btn-text .app-btn-sub {
    font-size: 12px;  /* legibilidad AA (antes 9px) */
    font-weight: 400;
    color: #635E54 !important;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.app-btn-text .app-btn-main {
    font-size: 13px;
    font-weight: 600;
    color: #2A2822 !important;
}

/* Footer CTA button styling */
.footer-cta-btn {
    background-color: #334DCF !important;
    color: #ffffff !important;
    border: 1px solid #334DCF !important;
    border-radius: 12px !important;
    padding: 0 20px !important;
    height: 40px !important;
    font-family: 'Saans', sans-serif !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    text-decoration: none !important;
    box-shadow: 0 4px 10px rgba(51, 77, 207, 0.15) !important;
    transition: all 0.2s ease !important;
    line-height: 1 !important;
}
.footer-cta-btn:hover {
    background-color: #0E0E90 !important;
    border-color: #0E0E90 !important;
    box-shadow: 0 6px 14px rgba(14, 14, 144, 0.25) !important;
    transform: translateY(-1px) !important;
}

/* Pricing block desktop display: 3 columns */
@media (min-width: 921px) {
    .cuerpo-precios-completos {
        flex-direction: row !important;
        align-items: stretch !important;
        justify-content: center !important;
        width: 100% !important;
    }
    .cuerpo-precios-completos > .card-desglose-precio,
    .cuerpo-precios-completos > .card-desglose-precio-wrap {
        flex: 0 0 calc(33.333% - 16px) !important;
        width: calc(33.333% - 16px) !important;
        min-width: 0 !important;
        margin-bottom: 0 !important;
    }
}

/* Premium styling for "Te llamamos" block (block-central is-dark) */
section.block-central.is-dark {
    max-width: 1000px !important;
    margin: 60px auto !important;
    background: linear-gradient(135deg, #07073B 0%, #0E0E90 50%, #1D267D 100%) !important; /* Premium dark blue background */
    border-radius: 24px !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.25) !important;
    padding: 0 !important;
    overflow: hidden !important;
}

section.block-central.is-dark .inner-hero {
    display: flex !important;
    flex-direction: row !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

section.block-central.is-dark .cta-image-side {
    width: 42% !important;
    min-height: 100% !important;
    position: relative !important;
    overflow: hidden !important;
    flex-shrink: 0 !important;
    background-color: #07073B !important;
}

section.block-central.is-dark .cta-image-side img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
}

section.block-central.is-dark .cta-content-side {
    width: 58% !important;
    padding: 60px 48px !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center;
}

@media (max-width: 768px) {
    section.block-central.is-dark {
        margin: 40px 16px !important;
        max-width: calc(100% - 32px) !important;
    }
    section.block-central.is-dark .inner-hero {
        flex-direction: column !important;
    }
    section.block-central.is-dark .cta-image-side {
        width: 100% !important;
        height: 280px !important;
    }
    section.block-central.is-dark .cta-content-side {
        width: 100% !important;
        padding: 40px 24px !important;
    }
}


/* Styling for native inline form in Te Llamamos block */
section.block-central.is-dark .native-te-llamamos-form {
    max-width: 420px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 16px;
    text-align: left;
}
section.block-central.is-dark .form-fields-row {
    display: flex;
    gap: 16px;
}
section.block-central.is-dark .form-fields-row .form-field-group {
    flex: 1;
}
@media (max-width: 768px) {
    section.block-central.is-dark .form-fields-row {
        flex-direction: column;
        gap: 12px;
    }
}
section.block-central.is-dark .form-field-group {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
section.block-central.is-dark .form-field-group label {
    font-size: 14px;
    font-weight: 600;
    color: #ffffff !important;
}
section.block-central.is-dark .form-field-group input {
    background-color: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    color: #ffffff !important;
    border-radius: 12px !important;
    padding: 14px 18px !important;
    font-size: 15px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    transition: all 0.2s ease;
}
section.block-central.is-dark .form-field-group input:focus {
    border-color: #ffffff !important;
    background-color: rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.15) !important;
    outline: none !important;
}
section.block-central.is-dark .privacy-accept-label {
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;
    font-size: 13px !important;
    color: rgba(255, 255, 255, 0.8) !important;
    margin-top: 8px !important;
    cursor: pointer !important;
}
section.block-central.is-dark .privacy-accept-label a {
    color: #ffffff !important;
    text-decoration: underline !important;
}
section.block-central.is-dark .privacy-accept-label input[type="checkbox"] {
    width: 18px !important;
    height: 18px !important;
    margin-top: 1px !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    border-radius: 4px !important;
    background: rgba(255, 255, 255, 0.04) !important;
    cursor: pointer !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    position: relative !important;
}
section.block-central.is-dark .privacy-accept-label input[type="checkbox"]:checked {
    background-color: #334dcf !important;
    border-color: #334dcf !important;
}
section.block-central.is-dark .privacy-accept-label input[type="checkbox"]:checked::after {
    content: "✓" !important;
    position: absolute !important;
    color: #ffffff !important;
    font-size: 12px !important;
    left: 4px !important;
    top: 0px !important;
    font-weight: bold !important;
}
section.block-central.is-dark .native-submit-btn {
    width: 100% !important;
    background-color: #ffffff !important;
    color: #0E0E90 !important;
    font-weight: 700 !important;
    border: none !important;
    border-radius: 12px !important;
    min-height: 52px !important;
    font-size: 16px !important;
    cursor: pointer !important;
    margin-top: 12px !important;
    display: inline-flex !important;
    justify-content: center !important;
    align-items: center !important;
    transition: all 0.2s ease;
}
section.block-central.is-dark .native-submit-btn:hover {
    background-color: #f1f5f9 !important;
    transform: translateY(-1px);
}
section.block-central.is-dark .native-form-msg {
    padding: 12px;
    border-radius: 8px;
    font-size: 14px;
    margin-top: 8px;
    line-height: 1.4;
}
section.block-central.is-dark .native-form-msg.error {
    background-color: rgba(230, 30, 30, 0.2);
    border: 1px solid rgba(230, 30, 30, 0.4);
    color: #ff9999;
}
section.block-central.is-dark .native-form-msg.success {
    background-color: rgba(39, 174, 96, 0.2);
    border: 1px solid rgba(39, 174, 96, 0.4);
    color: #a3f7bf;
}

section.block-central.is-dark p.has-display-font-size {
    font-size: 32px !important;
    font-weight: 800 !important;
    color: #ffffff !important;
    font-family: "Saans", sans-serif !important;
    margin-bottom: 12px !important;
}

section.block-central.is-dark p.has-h-4-font-size {
    font-size: 16px !important;
    color: rgba(255, 255, 255, 0.7) !important;
    margin-bottom: 32px !important;
}

section.block-central.is-dark .wpcf7-form {
    max-width: 420px !important;
    margin: 0 auto !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
}

section.block-central.is-dark label {
    display: block !important;
    text-align: left !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #ffffff !important;
    margin-bottom: 6px !important;
}

section.block-central.is-dark input[type="text"],
section.block-central.is-dark input[type="tel"],
section.block-central.is-dark input[type="email"] {
    background-color: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    color: #ffffff !important;
    border-radius: 12px !important;
    padding: 14px 18px !important;
    font-size: 15px !important;
    margin-top: 4px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    transition: border-color 0.2s, background-color 0.2s, box-shadow 0.2s !important;
}

section.block-central.is-dark input[type="text"]:focus,
section.block-central.is-dark input[type="tel"]:focus,
section.block-central.is-dark input[type="email"]:focus {
    border-color: #ffffff !important;
    background-color: rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.1) !important;
    outline: none !important;
}

section.block-central.is-dark label.privacy-accept {
    display: flex !important;
    align-items: flex-start !important;
    gap: 12px !important;
    font-size: 13px !important;
    color: rgba(255, 255, 255, 0.8) !important;
    margin-top: 8px !important;
    cursor: pointer !important;
    text-align: left !important;
}

section.block-central.is-dark label.privacy-accept a {
    color: #ffffff !important;
    text-decoration: underline !important;
}

section.block-central.is-dark input[type="checkbox"] {
    width: 20px !important;
    height: 20px !important;
    min-height: unset !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    border-radius: 6px !important;
    background: rgba(255, 255, 255, 0.04) !important;
    cursor: pointer !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    position: relative !important;
    flex-shrink: 0 !important;
    margin-top: 2px !important;
}

section.block-central.is-dark input[type="checkbox"]:checked {
    background-color: var(--wp--preset--color--primary-100) !important;
    border-color: var(--wp--preset--color--primary-100) !important;
}

section.block-central.is-dark input[type="checkbox"]:checked::after {
    content: "✓" !important;
    position: absolute !important;
    color: #ffffff !important;
    font-size: 13px !important;
    left: 4px !important;
    top: 0px !important;
    font-weight: bold !important;
}

section.block-central.is-dark input.wpcf7-submit {
    width: 100% !important;
    background-color: #ffffff !important;
    color: var(--wp--preset--color--primary-100) !important;
    font-weight: 700 !important;
    border: none !important;
    border-radius: 12px !important;
    min-height: 52px !important;
    cursor: pointer !important;
    margin-top: 16px !important;
    display: inline-flex !important;
    justify-content: center !important;
    align-items: center !important;
    transition: background-color 0.2s, transform 0.1s !important;
}

section.block-central.is-dark input.wpcf7-submit:hover {
    background-color: var(--wp--preset--color--primary-30) !important;
    color: var(--wp--preset--color--primary-150) !important;
}

section.block-central.is-dark input.wpcf7-submit::after {
    filter: brightness(0) saturate(100%) invert(31%) sepia(85%) saturate(711%) hue-rotate(224deg) brightness(88%) contrast(98%) !important;
}

section.block-central.is-dark p.has-small-font-size {
    font-size: 11px !important;
    color: rgba(255, 255, 255, 0.45) !important;
    line-height: 1.5 !important;
    margin-top: 24px !important;
    text-align: justify !important;
}

/* El bloque KPI ahora vive exclusivamente en blocks/kpi/styles.css
   (fuente global única). Aquí había una versión con clases muertas
   (.kpi-title/.kpi-desc no existen en el markup real) — eliminada. */

/* Media logos styling */
.block-media-logos {
    background-color: var(--wp--preset--color--neutral-50) !important;
    padding: 36px 24px !important;
    border-bottom: 1px solid var(--wp--preset--color--neutral-100) !important;
}
.inner-media-logos {
    max-width: var(--wp--custom--layout--desktop-width);
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}
.media-title {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--wp--preset--color--neutral-500);
    font-weight: 600;
}
.media-logos-container {
    display: flex;
    justify-content: space-around;
    align-items: center;
    width: 100%;
    gap: 36px;
    flex-wrap: wrap;
}
.media-logos-container .media-logo-item {
    height: 36px;
    display: flex;
    align-items: center;
    color: var(--wp--preset--color--neutral-400);
    transition: color 0.3s ease;
}
.media-logos-container .media-logo-item:hover {
    color: var(--wp--preset--color--neutral-800);
}
.media-logos-container .media-logo-item svg {
    height: 100%;
    width: auto;
}
@media (max-width: 768px) {
    .media-logos-container {
        gap: 20px;
        justify-content: center;
    }
    .media-logos-container .media-logo-item {
        height: 28px;
    }
}

/* ==========================================================================
   Opiniones Profesionales Page
   ========================================================================== */
.opiniones-profesionales-page {
    background-color: var(--wp--preset--color--neutral-50, #fcfbf9);
    padding-bottom: 0;
    font-family: "Saans", sans-serif;
}

.opiniones-hero {
    background: linear-gradient(135deg, #0E0E90 0%, #171EA0 50%, #334DCF 100%);
    color: #ffffff;
    padding: 100px 24px 80px 24px;
    text-align: center;
}

.opiniones-hero-container {
    max-width: 800px;
    margin: 0 auto;
}

.opiniones-title {
    font-size: 48px;
    font-weight: 700;
    margin-bottom: 20px;
    color: #ffffff;
}

.opiniones-subtitle {
    font-size: 20px;
    line-height: 1.6;
    color: #e2e8f0;
    font-weight: 300;
}

.opiniones-grid-section {
    max-width: var(--wp--custom--layout--content-size, 1200px);
    margin: -40px auto 0 auto;
    padding: 0 24px;
}

.opiniones-grid-container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
}

/* Card design matching Senda brand */
.opinion-card {
    background: #ffffff;
    border-radius: 24px;
    padding: 36px;
    box-shadow: 0px 8px 30px rgba(225, 220, 212, 0.4);
    display: flex;
    flex-direction: column;
    gap: 24px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    border: 1px solid #f0ede6;
}

.opinion-card:hover {
    transform: translateY(-4px);
    box-shadow: 0px 12px 40px rgba(225, 220, 212, 0.6);
}

.opinion-header {
    display: flex;
    align-items: center;
    gap: 20px;
}

.opinion-avatar {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
    border: 2px solid #5071E7;
}

.opinion-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.opinion-meta {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.opinion-name {
    font-size: 20px;
    font-weight: 600;
    color: #0c0c0e;
    margin: 0;
}

.opinion-role {
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #5071E7;
}

.opinion-body {
    position: relative;
}

.opinion-text {
    font-size: 16px;
    line-height: 1.7;
    color: #4a5568;
    margin: 0;
    font-weight: 400;
}

/* Make Dra. Clara Serrano or the first item stand out if 5 items */
.opiniones-grid-container > :first-child {
    grid-column: span 2;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 40px;
}

.opiniones-grid-container > :first-child .opinion-header {
    flex-direction: column;
    align-items: center;
    text-align: center;
    flex-shrink: 0;
    width: 220px;
}

.opiniones-grid-container > :first-child .opinion-avatar {
    width: 100px;
    height: 100px;
}

.opiniones-grid-container > :first-child .opinion-body {
    border-left: 1px solid #f0ede6;
    padding-left: 40px;
    flex-grow: 1;
}

/* Responsive styles */
@media (max-width: 991px) {
    .opiniones-grid-container {
        grid-template-columns: 1fr;
    }
    
    .opiniones-grid-container > :first-child {
        grid-column: span 1;
        flex-direction: column;
        align-items: stretch;
        gap: 20px;
    }
    
    .opiniones-grid-container > :first-child .opinion-header {
        flex-direction: row;
        align-items: center;
        text-align: left;
        width: auto;
    }
    
    .opiniones-grid-container > :first-child .opinion-avatar {
        width: 70px;
        height: 70px;
    }
    
    .opiniones-grid-container > :first-child .opinion-body {
        border-left: none;
        padding-left: 0;
    }
}

@media (max-width: 768px) {
    .opiniones-hero {
        padding: 80px 20px 60px 20px;
    }
    .opiniones-title {
        font-size: 32px;
    }
    .opiniones-subtitle {
        font-size: 16px;
    }
    .opinion-card {
        padding: 24px;
    }
}

/* ==========================================================================
   Opiniones/Testimonios Page Custom Styles (Professional vs Patient)
   ========================================================================== */

.opiniones-grid-section {
    max-width: 1200px;
    margin: -40px auto 80px auto;
    padding: 0 24px;
}

/* Ensure the grid displays 3 columns on desktop, matching the homepage slider, but static */
.opiniones-grid-section .testimonios-grid,
.block-cards-slider .testimonios-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 32px !important;
    max-width: 1200px !important;
    margin: 0 auto !important;
}

/* Patient Card Variant */
.testimonio-card-large.card-patient {
    background: #FFFDF9 !important; /* soft warm tint */
    border: 1px solid #F0D8C7 !important; /* secondary-60 border */
    box-shadow: 0px 8px 30px rgba(240, 216, 199, 0.25) !important;
}

.testimonio-card-large.card-patient:hover {
    border-color: #334DCF !important; /* Brand Blue */
    box-shadow: 0px 12px 40px rgba(51, 77, 207, 0.15) !important;
}

.testimonio-card-large.card-patient .author-role {
    color: #334DCF !important; /* Brand Blue */
}

/* Aviso de imagen de archivo bajo la atribución del testimonio.
   Las fotos de los pacientes son de archivo para no exponer la cara de nadie,
   y eso hay que decirlo donde se ve la foto, no en una nota legal al pie.
   Deliberadamente discreto: informa, no compite con el testimonio. */
.author-aviso-imagen {
    display: block;
    margin-top: 3px;
    font-size: 11.5px;
    font-weight: 400;
    line-height: 1.3;
    color: var(--wp--preset--color--neutral-600, #7F786C);
}

.testimonio-card-large.card-patient .card-image-wrapper {
    background-color: #FAF6F0 !important;
}

/* Professional Card Variant */
.testimonio-card-large.card-professional {
    background: #F7F9FE !important; /* soft blue tint */
    border: 1px solid #DBE1F5 !important; /* primary-60 border */
    box-shadow: 0px 8px 30px rgba(219, 225, 245, 0.25) !important;
}

.testimonio-card-large.card-professional:hover {
    border-color: #5071E7 !important; /* primary-90 */
    box-shadow: 0px 12px 40px rgba(80, 113, 231, 0.2) !important;
}

.testimonio-card-large.card-professional .author-role {
    color: #334DCF !important; /* primary-100 */
}

.testimonio-card-large.card-professional .card-image-wrapper {
    background-color: #F0F4FA !important;
}

/* Badges for Patient/Professional indicator */
.testimonial-badge {
    position: absolute;
    bottom: 16px;
    left: 16px;
    z-index: 2;
    padding: 6px 14px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: 100px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
    font-family: 'Saans', sans-serif;
}

.testimonial-badge.badge-paciente {
    background-color: #F4F3F0 !important;
    color: #1D1B16 !important;
    border: 1px solid rgba(29, 27, 22, 0.15) !important;
}

.testimonial-badge.badge-profesional {
    background-color: #EEF2FF !important;
    color: #334DCF !important;
    border: 1px solid rgba(51, 77, 207, 0.2) !important;
}

/* Override responsive behavior for static grid on mobile/tablets */
@media (max-width: 991px) {
    .opiniones-grid-section .testimonios-grid,
    .block-cards-slider .testimonios-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        overflow-x: visible !important;
        scroll-snap-type: none !important;
        padding-bottom: 0 !important;
        display: grid;
    }
    .opiniones-grid-section .testimonio-card-large,
    .block-cards-slider .testimonio-card-large {
        scroll-snap-align: none !important;
        min-height: auto !important;
    }
}

@media (max-width: 767px) {
    .opiniones-grid-section .testimonios-grid,
    .block-cards-slider .testimonios-grid {
        grid-template-columns: 1fr !important;
        gap: 24px !important;
    }
}

/* ==========================================================================
   Footer Legal Links Style
   ========================================================================== */
.footer-legal-links {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.footer-legal-links a {
    color: #4a4a4a !important; /* contraste AA ≥4.5:1 sobre el footer claro #E2DED4 (antes #6e6e77 ~3.6) */
    font-size: 14px !important;  /* legibilidad (antes 13px) */
    font-weight: 500;
    transition: color 0.2s ease;
}

.footer-legal-links a:hover {
    color: #334DCF !important; /* azul de marca (antes #ffffff, invisible sobre fondo claro) */
}

.footer-legal-separator {
    color: #2e2e33;
    font-size: 12px;
    user-select: none;
}

@media (max-width: 768px) {
    .footer-copyright-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }
    
    .footer-legal-links {
        width: 100%;
        justify-content: flex-start;
        gap: 12px;
    }
}

/* ==========================================================================
   Testimonial Tabs Switcher Styles
   ========================================================================== */
.opiniones-tabs-container {
    max-width: 600px;
    margin: 40px auto 20px auto;
    text-align: center;
    padding: 0 24px;
}

.opiniones-tabs-buttons {
    display: inline-flex;
    background: #ffffff;
    padding: 6px;
    border-radius: 100px;
    box-shadow: 0px 4px 15px rgba(225, 220, 212, 0.3);
    border: 1px solid #f0ede6;
}

.testimonial-tab-btn {
    background: transparent;
    border: none;
    outline: none;
    padding: 12px 28px;
    font-size: 15px;
    font-weight: 600;
    color: #5a5a65;
    border-radius: 100px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-family: inherit;
}

.testimonial-tab-btn.active {
    background: #5071E7;
    color: #ffffff;
}

.testimonial-tab-btn:hover:not(.active) {
    color: #5071E7;
    background: #f7f5f0;
}

/* ==========================================================================
   Header CTA mobile vs desktop responsiveness
   ========================================================================== */
.header-btn-mobile-only,
.header-btn-hamburger-mobile-only,
.header-btn-whatsapp-mobile-only {
    display: none !important;
}

@media only screen and (max-width: 1200px) {
    .header-btn-desktop-only {
        display: none !important;
    }
    
    .header-btn-mobile-only {
        display: inline-block !important;
        margin-left: auto;
        padding: 10px 20px !important;
        font-size: 14px !important;
        font-weight: 600 !important;
        border-radius: 100px !important;
        line-height: 1.2 !important;
    }
    
    .header-btn-hamburger-mobile-only {
        display: inline-flex !important;
        background-color: var(--wp--preset--color--primary-100) !important;
        color: #ffffff !important;
        border: 1px solid var(--wp--preset--color--primary-100) !important;
        margin-top: 12px;
        text-align: center;
        justify-content: center;
        align-items: center;
        width: 100%;
        box-sizing: border-box;
    }
    .header-btn-hamburger-mobile-only:hover {
        background-color: var(--wp--preset--color--primary-150) !important;
        border-color: var(--wp--preset--color--primary-150) !important;
        color: #ffffff !important;
    }

    .header-btn-whatsapp-mobile-only {
        display: inline-flex !important;
        background-color: #ffffff !important;
        border: 1px solid #25D366 !important;
        color: var(--wp--preset--color--neutral-800) !important;
        margin-top: 12px;
        text-align: center;
        justify-content: center;
        align-items: center;
        width: 100%;
        box-sizing: border-box;
    }
    .header-btn-whatsapp-mobile-only svg {
        color: #25D366 !important;
        fill: #25D366 !important;
    }
    .header-btn-whatsapp-mobile-only:hover {
        background-color: #f4fcf6 !important;
        border-color: #128C7E !important;
        color: var(--wp--preset--color--neutral-900) !important;
    }
    .header-btn-whatsapp-mobile-only:hover svg {
        color: #128C7E !important;
        fill: #128C7E !important;
    }
    
    /* Ensure the mobile button is hidden if the hamburger menu is open to avoid overlaying */
    .menu-main.open ~ .header-btn-mobile-only,
    .header-general:has(.menu-main.open) .header-btn-mobile-only {
        display: none !important;
    }
}

/* ==========================================================================
   Press Media Logo Marquee (Auto-scrolling logos under hero)
   ========================================================================== */
.media-marquee-container {
    background: transparent;
    padding: 24px 0;
    border-bottom: 1px solid #E2DED4;
    overflow: hidden;
    position: relative;
    width: 100%;
}

.media-marquee-title {
    text-align: center;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #8a8a93;
    margin-bottom: 10px;
    font-family: 'Saans', sans-serif;
}

.media-marquee-wrapper {
    display: flex;
    width: max-content;
}

.media-marquee-scroll {
    display: flex;
    flex-shrink: 0;
    justify-content: space-around;
    align-items: center;
    min-width: 100vw;
    animation: marquee-scroll 25s linear infinite;
}

.media-marquee-container:hover .media-marquee-scroll {
    animation-play-state: paused;
}

.media-logo-item {
    font-family: 'Saans', 'Georgia', serif;
    font-size: 18px;
    font-weight: 700;
    color: #2A2822;
    letter-spacing: -0.02em;
    white-space: nowrap;
    opacity: 0.55;
    transition: opacity 0.3s ease, color 0.3s ease;
    user-select: none;
}

.media-logo-item:hover {
    opacity: 0.95;
    color: #0E0E90;
}

@media (max-width: 768px) {
    .media-marquee-container {
        padding: 12px 0;
    }
    .media-marquee-title {
        margin-bottom: 8px;
    }
    .media-logo-item {
        font-size: 14px;
    }
}

.media-logo-item.el-pais {
    font-family: 'Georgia', serif;
    font-weight: 800;
    letter-spacing: -0.05em;
    text-transform: uppercase;
}

.media-logo-item.el-mundo {
    font-family: 'Times New Roman', serif;
    font-weight: 700;
    letter-spacing: -0.03em;
    text-transform: uppercase;
}

.media-logo-item.expansion {
    font-family: 'Helvetica Neue', Arial, sans-serif;
    font-weight: 900;
    font-style: italic;
    letter-spacing: -0.02em;
    text-transform: uppercase;
}

.media-logo-item.la-vanguardia {
    font-family: 'Didot', 'Times New Roman', serif;
    font-weight: 800;
    letter-spacing: -0.01em;
}

.media-logo-item.rtve {
    font-family: 'Saans', sans-serif;
    font-weight: 800;
    text-transform: lowercase;
    letter-spacing: -0.05em;
}

.media-logo-item.abc {
    font-family: 'Times New Roman', serif;
    font-weight: 900;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    border-bottom: 2px solid currentColor;
    padding-bottom: 2px;
    font-size: 18px;
}

.media-logo-item.la-razon {
    font-family: 'Georgia', 'Times New Roman', serif;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 18px;
}

.media-logo-item.el-espanol {
    font-family: 'Saans', 'Helvetica Neue', sans-serif;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 19px;
}

.media-logo-item.el-diario {
    font-family: 'Saans', 'Helvetica Neue', sans-serif;
    font-weight: 400;
    text-transform: lowercase;
    letter-spacing: -0.02em;
    font-size: 21px;
}

.media-logo-item.el-diario strong {
    font-weight: 800;
}

.media-logo-item.el-debate {
    font-family: 'Georgia', serif;
    font-weight: 700;
    letter-spacing: -0.01em;
    font-size: 20px;
}

.media-logo-item.el-confidencial {
    font-family: 'Times New Roman', Times, serif;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: -0.04em;
    font-size: 18px;
}

.media-logo-item.redaccion-medica {
    font-family: 'Saans', sans-serif;
    font-weight: 700;
    letter-spacing: -0.02em;
    font-size: 19px;
}

.media-logo-item.redaccion-medica span {
    font-weight: 300;
}

.media-logo-item:hover {
    opacity: 1;
    color: #2A2822;
}

@keyframes marquee-scroll {
    0% {
        transform: translateX(0%);
    }
    100% {
        transform: translateX(-100%);
    }
}

/* ==========================================================================
   Letter Avatars styling
   ========================================================================== */
.letter-avatar-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #FAF6F0 !important;
}

.letter-avatar {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    background: linear-gradient(135deg, #334DCF 0%, #0E0E90 100%);
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 40px;
    font-weight: 700;
    font-family: "Saans", "Saans", sans-serif;
    box-shadow: 0px 8px 20px rgba(51, 77, 207, 0.2);
}

/* ==========================================================================
   Error Pages Styles (404, 403, 500)
   ========================================================================== */
.error-page-main {
    position: relative;
    width: 100%;
    min-height: 750px;
    display: flex;
    align-items: center;
    background-size: cover;
    background-repeat: no-repeat;
    box-sizing: border-box;
}

.error-page-inner {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 40px;
    display: flex;
    justify-content: flex-start;
    box-sizing: border-box;
    position: relative;
    z-index: 2;
}

.error-page-404 {
    background-image: url('assets/images/error_404_audience.png');
    background-position: 80% 10%;
}

.error-page-403 {
    background-image: url('assets/images/error_403_audience.png');
    background-position: 60% top;
}

.error-page-500 {
    background-image: url('assets/images/error_500_audience.png');
    background-position: 60% 10%;
}

.error-page-card {
    position: relative;
    background: #ffffff;
    border-radius: 24px;
    padding: 40px;
    max-width: 480px;
    width: 100%;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.12);
    color: #1f2937;
    text-align: left;
    display: flex;
    flex-direction: column;
    gap: 16px;
    z-index: 2;
    border: 1px solid rgba(0, 0, 0, 0.05);
    animation: errorCardFadeInUp 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.error-badge-row {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 4px;
}

.error-code-number {
    font-size: 36px;
    font-weight: 800;
    color: #334DCF;
    font-family: "Saans", sans-serif;
    line-height: 1;
    border-right: 2px solid #e5e7eb;
    padding-right: 12px;
}

.error-badge-text {
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #8a8a93;
    font-family: "Saans", sans-serif;
}

.error-page-card h1 {
    font-size: 28px;
    font-weight: 700;
    color: #0E0E90;
    line-height: 1.25;
    margin: 0;
    font-family: "Saans", sans-serif;
}

.error-page-card p {
    font-size: 15px;
    line-height: 1.6;
    color: #4b5563;
    margin: 0;
}

.error-page-card .conversion-pitch {
    font-size: 15px;
    line-height: 1.6;
    color: #111827;
    font-weight: 500;
    border-left: 3px solid #334DCF;
    padding-left: 16px;
    margin: 8px 0;
}

.error-card-actions {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 8px;
}

.error-card-actions .btn {
    width: 100%;
    text-align: center;
    padding: 14px 24px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 100px;
    transition: all 0.3s ease;
    text-decoration: none;
    box-sizing: border-box;
    display: inline-block;
    font-family: "Saans", sans-serif;
}

.error-card-actions .btn-primary {
    background-color: #334DCF !important;
    border: 1px solid #334DCF !important;
    color: #ffffff !important;
    box-shadow: 0 4px 14px rgba(51, 77, 207, 0.3);
}

.error-card-actions .btn-primary:hover {
    background-color: #0E0E90 !important;
    border-color: #0E0E90 !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(14, 14, 144, 0.45);
}

.error-card-actions .btn-secondary {
    background-color: transparent !important;
    border: 2px solid #0E0E90 !important;
    color: #0E0E90 !important;
}

.error-card-actions .btn-secondary:hover {
    background-color: rgba(14, 14, 144, 0.05) !important;
    transform: translateY(-1px);
}

@keyframes errorCardFadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 768px) {
    .error-page-main {
        min-height: 550px;
        background-position: center;
        padding: 60px 0;
    }
    
    .error-page-inner {
        padding: 0 16px;
        justify-content: center;
    }
    
    .error-page-card {
        padding: 32px 24px;
    }
    
    .error-page-card h1 {
        font-size: 24px;
    }
}

/* ==========================================================================
   Podcast Landing Page Styles
   ========================================================================== */
.podcast-page-main {
    background-color: var(--wp--preset--color--neutral-50, #fcfbf9);
    padding-bottom: 80px;
    font-family: "Saans", "Saans", sans-serif;
}

.podcast-hero {
    background: linear-gradient(rgba(14, 14, 144, 0.8), rgba(24, 30, 130, 0.85)), url('assets/images/podcast-hero-banner.png') no-repeat center center;
    background-size: cover;
    color: #ffffff;
    padding: 240px 24px 120px 24px;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.podcast-hero-container {
    max-width: 900px;
    margin: 0 auto;
    position: relative;
    z-index: 2;
}

.podcast-badge-coming {
    display: inline-block;
    background: rgba(51, 77, 207, 0.15);
    border: 1px solid #334DCF;
    color: #334DCF;
    font-size: 12px;
    font-weight: 700;
    padding: 6px 16px;
    border-radius: 100px;
    margin-bottom: 24px;
    letter-spacing: 0.1em;
}

.podcast-title {
    font-size: 52px;
    font-weight: 800;
    margin-bottom: 20px;
    color: #ffffff;
    font-family: "Saans", sans-serif;
    letter-spacing: -0.01em;
}

.podcast-subtitle {
    font-size: 20px;
    line-height: 1.6;
    color: #cbd5e1;
    font-weight: 300;
    max-width: 700px;
    margin: 0 auto 48px auto;
}

.podcast-features-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-bottom: 56px;
}

.podcast-feature-card {
    background: rgba(255, 255, 255, 0.06);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.12);
    padding: 32px 24px;
    border-radius: 24px;
    text-align: left;
    transition: transform 0.3s ease, background 0.3s ease;
}

.podcast-feature-card:hover {
    transform: translateY(-4px);
    background: rgba(255, 255, 255, 0.1);
}

.podcast-feature-card .feature-icon {
    font-size: 32px;
    margin-bottom: 16px;
}

.podcast-feature-card h3 {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 12px;
    color: #ffffff;
}

.podcast-feature-card p {
    font-size: 14px;
    line-height: 1.5;
    color: #cbd5e1;
    margin: 0;
    font-weight: 300;
}

.podcast-presentation-box {
    max-width: 800px;
    margin: 0 auto;
    background: rgba(255, 255, 255, 0.03);
    border-left: 4px solid #5071E7;
    padding: 24px 32px;
    border-radius: 0 16px 16px 0;
    text-align: left;
}

.podcast-presentation-box p {
    font-size: 16px;
    line-height: 1.7;
    color: #cbd5e1;
    margin: 0;
    font-weight: 300;
}

.podcast-newsletter-section {
    max-width: 800px;
    margin: -40px auto 0 auto;
    padding: 0 24px;
    position: relative;
    z-index: 3;
}

.newsletter-card {
    background: #ffffff;
    border-radius: 32px;
    padding: 60px 48px;
    box-shadow: 0px 12px 40px rgba(225, 220, 212, 0.5);
    border: 1px solid #f0ede6;
    text-align: center;
}

.newsletter-icon-wrapper {
    font-size: 44px;
    margin-bottom: 24px;
    color: #334DCF;
}

.newsletter-title {
    font-size: 32px;
    font-weight: 700;
    margin-bottom: 16px;
    color: #0c0c0e;
}

.newsletter-description {
    font-size: 16px;
    line-height: 1.6;
    color: #5a5a65;
    max-width: 600px;
    margin: 0 auto 36px auto;
    font-weight: 300;
}

.newsletter-form {
    max-width: 550px;
    margin: 0 auto;
}

.form-group-wrapper {
    display: flex;
    gap: 12px;
    margin-bottom: 16px;
}

.newsletter-input {
    flex-grow: 1;
    background: #f7f5f0 !important;
    border: 1px solid #e2decb !important;
    border-radius: 100px !important;
    padding: 14px 24px !important;
    font-size: 15px !important;
    outline: none !important;
    transition: all 0.3s ease !important;
    color: #2A2822 !important;
}

.newsletter-input:focus {
    border-color: #334DCF !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(51, 77, 207, 0.1) !important;
}

.btn-newsletter {
    background-color: #334DCF !important;
    border-color: #334DCF !important;
    color: #ffffff !important;
    padding: 14px 32px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    border-radius: 100px !important;
    cursor: pointer;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 12px rgba(51, 77, 207, 0.3);
}

.btn-newsletter:hover {
    background-color: #0E0E90 !important;
    border-color: #0E0E90 !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(14, 14, 144, 0.5);
}

.newsletter-consent {
    text-align: left;
    max-width: 500px;
    margin: 0 auto;
}

.consent-label {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    cursor: pointer;
    font-size: 13px;
    line-height: 1.4;
    color: #5a5a65;
}

.consent-label input[type="checkbox"] {
    margin-top: 3px;
    flex-shrink: 0;
    accent-color: #334DCF;
}

.newsletter-msg {
    margin-top: 20px;
    font-size: 15px;
    font-weight: 600;
}

.newsletter-msg.success-msg {
    color: #10B981;
}

.newsletter-msg.error-msg {
    color: #EF4444;
}

@media (max-width: 768px) {
    .podcast-title {
        font-size: 40px;
    }
    .podcast-features-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    .newsletter-card {
        padding: 40px 24px;
    }
    .form-group-wrapper {
        flex-direction: column;
    }
    .btn-newsletter {
        width: 100%;
    }
}

/* Custom Alternating Timeline Styles */
.timeline-container {
    position: relative;
    max-width: 1050px;
    margin: 40px auto 0 auto;
    padding: 20px 0;
}
.timeline-line-bg {
    position: absolute;
    left: 50%;
    top: 0;
    bottom: 0;
    width: 2px;
    background-color: var(--wp--preset--color--primary-40);
    transform: translateX(-50%);
    z-index: 1;
}
.timeline-scroll-line {
    position: absolute;
    left: 50%;
    top: 0;
    width: 2px;
    background-color: var(--wp--preset--color--primary-100);
    transform: translateX(-50%);
    transform-origin: top;
    height: 0%;
    z-index: 1;
}
.timeline-item {
    position: relative;
    width: 50%;
    margin-bottom: 60px;
    display: flex;
    box-sizing: border-box;
}
.timeline-item.left {
    left: 0;
    justify-content: flex-end;
    padding-right: 64px;
}
.timeline-item.right {
    left: 50%;
    justify-content: flex-start;
    padding-left: 64px;
}
.timeline-item .paso-contenido {
    max-width: 440px;
}
.timeline-item.left .paso-contenido {
    text-align: right;
}
.timeline-item.right .paso-contenido {
    text-align: left;
}
.timeline-item .paso-icono-center {
    position: absolute;
    width: 52px;
    height: 52px;
    top: 0;
    z-index: 10;
}
.timeline-item.left .paso-icono-center {
    right: -26px;
}
.timeline-item.right .paso-icono-center {
    left: -26px;
}
.timeline-item .paso-icono-center img {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background-color: var(--wp--preset--color--secondary-30) !important;
    padding: 6px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.06);
    display: block;
}
.timeline-tranquilidad {
    position: relative;
    width: 80%;
    margin: 50px auto;
}
@media (max-width: 820px) {
    .timeline-line-bg {
        left: 26px;
        transform: none;
    }
    .timeline-scroll-line {
        left: 26px;
        transform: none;
    }
    .timeline-item {
        width: 100%;
        left: 0 !important;
        padding-left: 58px !important;
        padding-right: 0 !important;
        justify-content: flex-start !important;
        margin-bottom: 40px;
    }
    .timeline-item.left .paso-contenido {
        text-align: left;
    }
    .timeline-item.left .paso-icono-center {
        left: 0px;
        right: auto;
    }
    .timeline-item.right .paso-icono-center {
        left: 0px;
    }
    .timeline-tranquilidad {
        width: 100%;
        margin: 30px 0;
    }
}

/* Mobile spacing & layout optimizations for readability (breathing room) */
@media (max-width: 920px) {
    .b-block, 
    section, 
    .block-hero, 
    .block-propuesta-valor, 
    .block-central-texto, 
    .block-cards-slider, 
    .block-precios-completos,
    .block-faqs {
        padding-top: 48px !important;
        padding-bottom: 48px !important;
    }
    
    /* Center and integrate hero content on mobile as a compact card matching the gender cards */
    .block-hero__info {
        background: #FFFFFF !important;
        border: none !important;
        box-shadow: 0 12px 30px rgba(0, 0, 0, 0.05) !important;
        padding: 24px 20px !important;
        border-radius: 24px !important;
        align-items: center !important;
        text-align: center !important;
        max-width: 100% !important;
        width: calc(100% - 32px) !important;
        margin: 0 auto !important;
        gap: 16px !important;
        box-sizing: border-box !important;
    }
    
    .block-hero__info h1.wp-block-heading {
        font-size: 24px !important;
        line-height: 1.3 !important;
        margin-bottom: 0 !important;
        font-weight: 800;
    }
    
    section.block-hero .wp-block-list {
        display: inline-flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        text-align: left !important;
        margin: 0 auto !important;
        gap: 8px !important;
        padding: 0 !important;
        list-style: none !important;
    }
    
    section.block-hero .wp-block-list li {
        font-size: 14px !important;
        line-height: 1.4 !important;
        padding-left: 23px !important;
        margin-bottom: 0 !important;
        position: relative !important;
    }

    section.block-hero .wp-block-list li::before {
        top: 3px !important;
    }
    
    .block-hero__info .wp-block-buttons {
        justify-content: center !important;
        width: 100% !important;
        margin-top: 8px !important;
    }
    
    .block-hero__info p.wp-block-paragraph,
    .block-hero__info h1.wp-block-heading,
    .block-hero__info ul.wp-block-list li,
    .block-hero__info .hero-cta-subtext {
        color: #2A2822 !important;
    }
    
    .block-hero__info h1.wp-block-heading span {
        color: var(--wp--preset--color--primary-100) !important;
    }
    
    .wp-block-heading, 
    h1, h2, h3 {
        margin-bottom: 18px !important;
        line-height: 1.25 !important;
    }
    
    p.wp-block-paragraph, 
    p {
        margin-bottom: 20px !important;
        line-height: 1.6 !important;
    }
    
    /* Ensure grid items/flex boxes have nice gap spacing on mobile */
    .block-hero__container,
    .inner-hero,
    .inner-faqs,
    .block-propuesta-valor__container,
    .central-grid {
        gap: 24px !important;
    }

    /* Full-bleed real en tablet/móvil: antes esta regla ponía width:100% + margin:0,
       que dejaba los bloques .alignfull al ancho de la COLUMNA de contenido (inseteados
       ~24-45px por lado) en vez del viewport — de ahí que CTAs y secciones "no ocuparan
       el 100%" en tablet. Como html,body ya llevan overflow-x:hidden (base.css), el
       breakout de viewport no genera scroll horizontal. */
    .alignfull {
        width: 100vw !important;
        max-width: 100vw !important;
        margin-left: calc(50% - 50vw) !important;
        margin-right: calc(50% - 50vw) !important;
    }

    /* Force box sizing on cards and elements */
    .card-desglose-precio,
    .persona,
    .timeline-item {
        box-sizing: border-box !important;
        max-width: 100% !important;
    }

    .persona {
        width: 100% !important;
    }

    /* Spacing containers breathing room */
    .inner-hero,
    .inner-destacado-equipo,
    .inner-precios-completos,
    .inner-cards-slider,
    .inner-faqs {
        padding-left: 16px !important;
        padding-right: 16px !important;
        box-sizing: border-box !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    .cuerpo-precios-completos {
        padding: 0 !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    
    .card-desglose-precio {
        padding: 24px 20px !important;
        margin: 0 0 16px 0 !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Headings responsiveness */
    h1, .has-display-font-size {
        font-size: 28px !important;
    }
    h2 {
        font-size: 24px !important;
    }
    h3 {
        font-size: 20px !important;
    }
}

/* ==========================================================================
   Block Texto Form (Talento) Section
   ========================================================================== */
section.block-texto-form {
    background: #FAF6F0;
    padding: 80px 0;
    color: var(--wp--preset--color--neutral-800);
    border-top: 1px solid #FAF6F0;
}
.block-texto-form__inner {
    max-width: var(--wp--style--global--content-size);
    margin: 0 auto;
    display: flex;
    gap: 80px;
    padding: 0 24px;
    align-items: center;
}
.block-texto-form__content {
    flex: 1;
    text-align: left;
}
.block-texto-form__content p.has-small-font-size {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--wp--preset--color--primary-150);
    margin-bottom: 16px;
    font-family: 'Saans', sans-serif;
}
.block-texto-form__content h2.wp-block-heading {
    font-size: clamp(28px, 2.5vw, 42px);
    font-weight: 800;
    line-height: 1.35;
    color: var(--wp--preset--color--neutral-900);
    font-family: 'Saans', sans-serif;
}
.block-texto-form__form {
    flex: 1.1;
    background: #ffffff;
    padding: 48px;
    border-radius: 24px;
    box-shadow: 0px 12px 40px rgba(0, 0, 0, 0.03);
    border: 1px solid var(--wp--preset--color--neutral-200);
}
.block-texto-form__form h2 {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 24px;
    color: var(--wp--preset--color--neutral-900);
    font-family: 'Saans', sans-serif;
}
.block-texto-form__form form {
    display: grid;
    gap: 20px;
}
.block-texto-form__form .two-col {
    display: flex;
    gap: 20px;
}
.block-texto-form__form .two-col label {
    flex: 1;
    display: flex;
    flex-direction: column;
    text-align: left;
    font-size: 14px;
    font-weight: 600;
    color: var(--wp--preset--color--neutral-800);
}
.block-texto-form__form input[type="text"],
.block-texto-form__form input[type="email"],
.block-texto-form__form input[type="tel"],
.block-texto-form__form select {
    margin-top: 8px;
    padding: 14px 18px;
    font-size: 15px;
    border-radius: 12px;
    border: 1px solid var(--wp--preset--color--neutral-300);
    background: #ffffff;
    width: 100%;
    color: var(--wp--preset--color--neutral-900);
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}
.block-texto-form__form input:focus,
.block-texto-form__form select:focus {
    border-color: var(--wp--preset--color--primary-150);
    box-shadow: 0 0 0 3px rgba(14, 14, 144, 0.08);
}
.block-texto-form__form .wpcf7-form-control-wrap {
    display: block;
    width: 100%;
}
.block-texto-form__form .privacy-accept {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    font-size: 14px;
    font-weight: 500;
    color: var(--wp--preset--color--neutral-700);
    cursor: pointer;
    text-align: left;
    margin-top: 10px;
}
.block-texto-form__form .privacy-accept input {
    margin-top: 3px;
    flex-shrink: 0;
}
.block-texto-form__form .privacy-accept a {
    color: var(--wp--preset--color--primary-150);
    text-decoration: underline;
}
.block-texto-form__form .privacy-text {
    font-size: 11px;
    line-height: 1.5;
    color: var(--wp--preset--color--neutral-600);
    text-align: left;
    margin-top: 8px;
}
.block-texto-form__form .wpcf7-submit {
    background: var(--wp--preset--color--primary-150);
    color: #ffffff;
    font-family: 'Saans', sans-serif;
    font-weight: 700;
    font-size: 16px;
    padding: 14px 28px;
    border-radius: 12px;
    border: none;
    cursor: pointer;
    box-shadow: 0 4px 14px rgba(14, 14, 144, 0.2);
    transition: background 0.3s ease, transform 0.2s ease, box-shadow 0.3s ease;
    width: 100%;
    margin-top: 16px;
}
.block-texto-form__form .wpcf7-submit:hover {
    background: #0b0b70;
    box-shadow: 0 6px 20px rgba(14, 14, 144, 0.3);
    transform: translateY(-1px);
}
@media (max-width: 920px) {
    section.block-texto-form {
        padding: 60px 0;
    }
    .block-texto-form__inner {
        flex-direction: column;
        gap: 48px;
    }
    .block-texto-form__content {
        max-width: 100%;
        text-align: center;
    }
    .block-texto-form__form {
        width: 100%;
        padding: 32px 24px;
    }
    .block-texto-form__form .two-col {
        flex-direction: column;
        gap: 16px;
    }
}

/* ==========================================================================
   WhatsApp Floating & CTA Styles
   ========================================================================== */
.senda-whatsapp-float {
    position: fixed;
    bottom: 24px;
    right: 24px;
    width: 56px;
    height: 56px;
    background-color: #25D366;
    color: #ffffff !important;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 6px 20px rgba(37, 211, 102, 0.4);
    z-index: 9999;
    transition: transform 0.3s ease, background-color 0.3s ease, box-shadow 0.3s ease;
    text-decoration: none !important;
}

.senda-whatsapp-float:hover {
    transform: scale(1.1);
    background-color: #128C7E;
    box-shadow: 0 8px 24px rgba(18, 140, 126, 0.5);
}

.senda-whatsapp-float svg {
    width: 28px;
    height: 28px;
}

.senda-whatsapp-tooltip {
    position: absolute;
    right: 70px;
    background-color: #2A2822;
    color: #ffffff;
    padding: 8px 14px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease;
    transform: translateX(10px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    pointer-events: none;
}

.senda-whatsapp-float:hover .senda-whatsapp-tooltip {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
}

.senda-whatsapp-tooltip::after {
    content: '';
    position: absolute;
    top: 50%;
    right: -5px;
    transform: translateY(-50%);
    border-width: 5px 0 5px 5px;
    border-style: solid;
    border-color: transparent transparent transparent #2A2822;
}

@media (max-width: 767px) {
    .senda-whatsapp-float {
        bottom: 16px;
        right: 16px;
        width: 48px;
        height: 48px;
    }
    .senda-whatsapp-float svg {
        width: 24px;
        height: 24px;
    }
    .senda-whatsapp-tooltip {
        display: none;
    }
}

/* Hide floating WhatsApp button when the hamburger menu is open */
body.menu-open .senda-whatsapp-float {
    display: none !important;
}

@media only screen and (max-width: 1200px) {
    .senda-whatsapp-float {
        right: 20px !important;
        left: auto !important;
        z-index: 99999 !important;
    }
}

/* WhatsApp Button Styles */
.wp-block-button.is-style-whatsapp .wp-block-button__link {
    background-color: #25D366 !important;
    border: 1px solid #25D366 !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: background-color 0.3s ease, border-color 0.3s ease, transform 0.2s ease;
}

.wp-block-button.is-style-whatsapp .wp-block-button__link:hover {
    background-color: #128C7E !important;
    border-color: #128C7E !important;
    transform: translateY(-2px);
}

.wp-block-button.is-style-whatsapp-outline .wp-block-button__link {
    background-color: transparent !important;
    border: 2px solid #25D366 !important;
    color: #25D366 !important;
    font-weight: 600 !important;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: background-color 0.3s ease, color 0.3s ease, transform 0.2s ease;
}

.wp-block-button.is-style-whatsapp-outline .wp-block-button__link:hover {
    background-color: #25D366 !important;
    color: #ffffff !important;
    transform: translateY(-2px);
}

.hero-gender-cards-container {
    padding: 0 24px 20px 24px;
    background: transparent;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    border-bottom: none;
    box-sizing: border-box;
    margin: -90px auto 0 auto !important; /* Reduced overlap, centered horizontally */
    position: relative;
    z-index: 10;
}

.hero-gender-cards-inner {
    display: flex;
    gap: 24px;
    max-width: 820px;
    width: 100%;
    margin: 0 auto;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
}

.gender-card {
    display: flex;
    flex-direction: column;
    background: #FFFFFF;
    border-radius: 24px;
    overflow: visible;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.06);
    width: 100%;
    max-width: 330px;
    text-decoration: none;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s ease;
    margin-top: 20px; /* Reduced margin to allocate space for head pop-out */
    box-sizing: border-box;
    padding: 8px; /* Tighter white frame padding around nested image box */
}

.gender-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 25px 50px rgba(14, 14, 144, 0.12);
}

.gender-card-image-box {
    height: 160px; /* Taller card height to reduce landscape empty space */
    border-radius: 16px; /* Fully rounded nested color background */
    position: relative;
    overflow: visible; /* Allow head to pop out at the top */
    width: 100%;
}

.gender-card-img {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: auto;
    object-fit: contain;
    pointer-events: none;
    z-index: 2;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.card-men .gender-card-img {
    height: 118%; /* Pop out head */
    bottom: -2px;
}

.card-women .gender-card-img {
    height: 125%; /* Pop out head */
    bottom: -2px;
}

.gender-card:hover .gender-card-img {
    transform: translateX(-50%) scale(1.05); /* Zoom inside the cropped box on hover */
}

.gender-card-text-box {
    padding: 12px 6px 4px 6px; /* Slightly adjusted padding for compact size */
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: transparent;
    border-top: none; /* Removed top line for cleaner look */
    box-sizing: border-box;
}

.gender-card-title {
    font-size: 18px;
    font-weight: 600;
    color: #2A2822;
    font-family: 'Saans', sans-serif;
}

.gender-card-arrow {
    color: #2A2822; /* Matches title text for a cleaner unified look */
    display: flex;
    align-items: center;
    transition: transform 0.2s ease;
}

.gender-card:hover .gender-card-arrow {
    transform: translateX(4px);
}

.card-men {
    order: 2; /* Place men's card second */
}

.card-women {
    order: 1; /* Place women's card first */
}

/* Portada 2 custom white container with rounded top corners for gender selection cards */
.page-template-page-portada-2 .hero-gender-cards-container {
    background: #ffffff !important; /* Solid white background to eliminate gray sides and blend with the media block */
    padding: 0 24px !important;
    margin-top: 0 !important; /* Aligned exactly at the bottom of the blue hero */
    display: flex;
    justify-content: center;
    position: relative;
    z-index: 10;
    width: 100%;
    box-sizing: border-box;
    overflow: visible !important;
}

.page-template-page-portada-2 .hero-gender-cards-inner {
    background: #ffffff !important;
    border-radius: 40px 40px 0 0 !important;
    padding: 0 16px 12px 16px !important; /* No top padding so cards can sit directly on the top edge and overflow */
    max-width: 820px;
    width: 100%;
    display: flex;
    gap: 16px !important; /* Tighter gap */
    justify-content: center;
    box-sizing: border-box;
    box-shadow: 0 -15px 35px rgba(0, 0, 0, 0.04) !important;
    overflow: visible !important;
}

.page-template-page-portada-2 .gender-card {
    /* El objetivo es que el azul del hero termine justo donde termina el
       ÁREA DE COLOR de la tarjeta (la foto + su fondo rosa/crema), no donde
       termina la tarjeta blanca completa (que incluye la franja de texto
       "Senda para..." + flecha por debajo — esa franja blanca se solapa con
       el fondo cálido de la siguiente sección y no necesita alinearse).
       -182px es el valor calibrado para eso a 330px de ancho de tarjeta
       (tope en desktop): padding-top 22px + altura de image-box 160px. */
    margin-top: -182px !important;
}

@media (max-width: 920px) {
    .page-template-page-portada-2 .hero-gender-cards-container {
        margin-top: -60px !important;
        padding: 0 16px !important;
    }
    .page-template-page-portada-2 .hero-gender-cards-inner {
        padding: 8px 12px 8px 12px !important; /* Tighter padding on mobile */
        gap: 12px !important;
        border-radius: 24px 24px 0 0 !important;
    }
    .page-template-page-portada-2 .gender-card {
        margin-top: 20px !important; /* Reset overlap on mobile since cards stack vertically */
    }
}

/* Force media marquee to stretch full screen and have a white background on portada 2 */
.page-template-page-portada-2 .media-marquee-container {
    background-color: #ffffff !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
}

@media (max-width: 920px) {
    .hero-gender-cards-container {
        margin-top: -45px; /* Less overlap on mobile to protect layout */
        padding-bottom: 24px;
    }
    .hero-gender-cards-inner {
        flex-direction: column;
        align-items: center;
        gap: 16px; /* Tighter gap between cards on mobile */
    }
    .gender-card {
        width: 100%;
        max-width: 320px;
    }
}

/* Ensure sticky navigation menu always displays above overlapping elements on scroll */
.header-general {
    z-index: 1000 !important;
}

/****************************************************
 * PORTADA 2 (HOMEPAGE VARIANT 2) STYLES
 ****************************************************/

/* Header overrides on Portada 2 load (transparent background, centered logo, top space) */
/* padding-top/padding-bottom quitados: esta regla (specificity 1,1,0) le
   ganaba a la sección "GLOBAL CLEAN HEADER STYLES (Modern Drawer Menu for
   all pages)" de más abajo (#site-header, specificity 1,0,0), que es la que
   ya usan de forma consistente senda-para-hombres y senda-para-mujeres
   (padding-top/bottom: 0). Por eso el logo+hamburguesa de portada quedaba
   32px más abajo que en esas landings. El resto de propiedades de aquí
   coinciden con el bloque global, así que se dejan tal cual. */
.page-template-page-portada-2 #site-header {
    position: absolute !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    margin-top: 0 !important;
    width: 100% !important;
    left: 0 !important;
    right: 0 !important;
    display: block !important;
    z-index: 1000 !important;
}
.page-template-page-portada-2 #site-header .inner-header-general {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    border-radius: 24px !important;
    width: 100% !important;
    /* min(1100px,90%): --container-desktop, la misma referencia que usa el
       hero de debajo — antes 1300px dejaba el logo y el icono de
       hamburguesa mucho más separados de lo que el hero de esta misma
       página sugería. */
    max-width: min(1100px, 90%) !important;
    margin: 0 auto !important;
    height: 78px !important;
    padding: 0 24px !important;
    display: flex !important;
    justify-content: space-between !important; /* Logo left, toggle right */
    align-items: center !important;
    position: relative !important;
}
.page-template-page-portada-2 #site-header .logo-header {
    margin: 0 !important;
    position: relative !important;
    transform: none !important;
    z-index: 100 !important;
    width: clamp(7.938rem, 6.277rem + 4.911vw, 10.438rem);
    align-self: center !important;
}
.page-template-page-portada-2 #site-header .menu-toggle {
    position: relative !important;
    transform: none !important;
    z-index: 10002 !important;
    display: flex !important; /* Force visibility on desktop */
    align-self: center !important;
}

/* Enforce 12px rounded buttons across the homepage to match hero format */
.page-template-page-portada-2 .btn,
.page-template-page-portada-2 .btn-primary,
.page-template-page-portada-2 .footer-cta-btn,
.page-template-page-portada-2 #site-header .header-btn {
    border-radius: 12px !important;
}

body:not(.page-template-te-llamamos) #site-header .header-btn-mobile-only {
    position: absolute !important;
    right: 64px !important; /* Spaced left of the menu-toggle */
    top: 50% !important;
    transform: translateY(-50%) !important;
    margin: 0 !important;
}
body:not(.page-template-te-llamamos) #site-header .menu-main nav,
body:not(.page-template-te-llamamos) #site-header .contenedor-cta {
    display: none !important;
}
.page-template-page-portada-2 #site-header .logo-header img {
    filter: brightness(0) invert(1) !important; /* Force white logo */
}
.page-template-page-portada-2 #site-header .menu-toggle .hamburger {
    background: #ffffff !important; /* Force white hamburger toggle */
}
body.menu-open:not(.page-template-te-llamamos) #site-header .menu-toggle .hamburger {
    background: #0E0E90 !important; /* Dark blue X when menu is open */
}

/* Hide main site header completely on interior pages on desktop to use the mega menu as base */
@media (min-width: 1201px) {
    body:not(.page-template-page-portada-2):not(.page-template-te-llamamos):not(.page-template-page-comenzar-el-programa):not(.page-template-page-senda-para-mujeres):not(.page-template-page-senda-para-hombres) #site-header {
        display: none !important;
    }
    
    /* Desktop Drawer Menu for Portada 2 */
    body:not(.page-template-te-llamamos) #site-header .menu-main.open {
        background-color: #FAF6F0 !important;
        display: flex !important;
        flex-direction: column !important;
        position: fixed !important;
        top: 0 !important;
        right: 0 !important; 
        left: auto !important;
        bottom: 0 !important;
        width: 400px !important;
        max-width: 100vw !important;
        z-index: 9999 !important;
        padding: 80px 32px 40px 32px !important; /* increased top padding to leave room for the X */
        overflow-y: auto !important;
        box-shadow: -8px 0 32px rgba(0,0,0,0.15) !important;
        animation: slideInRight 0.35s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    }
    
    /* Position the X inside the drawer on desktop */
    body.menu-open:not(.page-template-te-llamamos) #site-header .menu-toggle {
        position: fixed !important;
        top: 40px !important;
        right: 32px !important;
    }
    
    @keyframes slideInRight {
        from { transform: translateX(100%); }
        to { transform: translateX(0); }
    }
    
    body:not(.page-template-te-llamamos) #site-header .menu-main.open nav,
    body:not(.page-template-te-llamamos) #site-header .menu-main.open .contenedor-cta {
        display: block !important;
    }
    
    /* Hide the standalone Empezar button inside the drawer */
    body:not(.page-template-te-llamamos) #site-header .menu-main.open .contenedor-cta a.header-btn-desktop-only {
        display: none !important;
    }
    
    body:not(.page-template-te-llamamos) #site-header .menu-main.open .contenedor-cta {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
        margin-top: auto !important;
        padding-top: 32px !important;
    }

    /* El sticky menu secundario es la base (top bar) para páginas interiores. Lo hacemos absolute para que no empuje el contenido. */
    .portada2-sticky-menu:not(.is-sticky) {
        position: absolute !important;
        width: 100% !important;
        left: 0 !important;
        top: 0 !important;
    }

    /* Ocultar el sticky menu secundario por defecto en desktop SOLO en portada y en las landings de hombres/mujeres */
    .page-template-page-portada-2 .portada2-sticky-menu:not(.is-sticky),
    .page-template-page-senda-para-mujeres .portada2-sticky-menu:not(.is-sticky),
    .page-template-page-senda-para-hombres .portada2-sticky-menu:not(.is-sticky) {
        display: none !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }
}


.portada2-hero {
    background: #334DCF !important; /* Solid signature Senda Blue */
    padding: 140px 24px 220px 24px !important; /* Added space above 'Tu clínica', increased bottom padding to create air above overflowing cards */
    color: #ffffff;
    text-align: center;
    display: flex;
    flex-direction: column !important;
    justify-content: center;
    align-items: center;
    position: relative !important;
    overflow: hidden !important;
    z-index: 1;
}
.portada2-hero::before {
    display: none !important; /* Remove spotlight glow gradient to match flat reference */
}
.portada2-hero-inner {
    /* min(960px, 90vw): mismo ratio que el header-general (grid-template-columns:
       1fr min(content-size, 90%) 1fr), para que el hero nunca quede más ancho
       que la topbar en pantallas de portátil. */
    max-width: min(960px, 90vw);
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px; /* Tighter gap */
    position: relative !important;
    z-index: 2 !important;
}
.portada2-hero-tag {
    font-size: 11px; /* Slightly smaller tag */
    font-weight: 700;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: #e2ded4 !important; /* Brand sand color */
    margin-bottom: 4px;
    font-family: 'Saans', sans-serif !important; /* Saans font to match reference */
}
.portada2-hero-heading {
    font-size: clamp(30px, 3.8vw, 44px) !important; /* Compact size for fold optimization */
    font-weight: 500 !important; /* Regular/Medium weight matching reference */
    line-height: 1.15 !important;
    color: #ffffff !important; /* White text for contrast */
    margin: 0 !important;
    font-family: 'Saans', sans-serif !important; /* Saans font matching reference */
    max-width: 100% !important; /* Allow phrases to stay on a single line */
    text-align: center;
}
.portada2-hero-heading strong {
    font-weight: 800 !important; /* Bold highlight for specified words */
}
@media (max-width: 768px) {
    .portada2-hero-heading {
        max-width: 100% !important;
    }
}
.portada2-hero-subtext {
    font-size: clamp(14px, 1.6vw, 16px) !important; /* Compact subtext */
    line-height: 1.55 !important;
    font-family: 'Saans', sans-serif !important; /* Saans font matching reference */
    color: #e2ded4 !important; /* Warm sand light text */
    max-width: 100%;
    margin: 4px 0 8px 0 !important; /* Tighter margins */
}

/* Hero Trust badges styling */
.portada2-hero-trust {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 24px; /* Reduced gap */
    margin: 8px 0 20px 0; /* Reduced margins */
    flex-wrap: wrap;
    width: 100%;
}
.portada2-hero-trust .trust-item {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13.5px;
    font-weight: 600;
    color: #e2ded4; /* Warm sand light text */
}
.portada2-hero-trust .trust-icon {
    width: 16px;
    height: 16px;
    color: #FFC043; /* Senda Gold */
    flex-shrink: 0;
}

@media (max-width: 768px) {
    .portada2-hero-trust {
        flex-direction: column;
        gap: 12px;
        align-items: flex-start;
        max-width: 290px;
        margin: 12px auto 16px auto;
    }
}

.portada2-hero-ctas-row {
    display: flex;
    flex-direction: row;
    align-items: center !important; /* Centered alignment for perfect bottom alignment */
    justify-content: center;
    gap: 24px;
    margin-top: 16px;
    width: 100%;
}
.portada2-hero-primary-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.portada2-hero-ctas-row .hero-secondary-link {
    margin-top: 0 !important;
}
@media (max-width: 768px) {
    .portada2-hero-ctas-row {
        flex-direction: column;
        align-items: center;
        gap: 16px;
        margin-top: 8px;
    }
    .portada2-hero-ctas-row .hero-secondary-link {
        margin-top: 0 !important;
    }
}
.portada2-hero-ctas {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 4px; /* Reduced margin */
}
.portada2-hero .btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 54px !important; /* Explicit height to align perfectly at the bottom */
    padding: 0 36px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    border-radius: 12px !important; /* Rounded rectangle matching reference roundness */
    cursor: pointer;
    transition: all 0.3s ease !important;
    text-decoration: none !important;
    font-family: 'Saans', sans-serif !important;
    box-shadow: none !important; /* Flat look as in mockup */
    box-sizing: border-box !important;
}
.portada2-hero .btn-primary {
    background-color: #0E0E90 !important; /* Brand dark blue — acción principal, sólida */
    border: none !important;
    color: #ffffff !important;
}
.portada2-hero .btn-primary:hover {
    background-color: #080854 !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
}
.portada2-hero .hero-secondary-link {
    background-color: #ffffff !important; /* Acción secundaria, outline */
    border: none !important;
    color: #334DCF !important; /* Senda Blue */
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
}
.portada2-hero .hero-secondary-link:hover {
    background-color: #f0f2ff !important;
    color: #1e36ab !important;
    transform: translateY(-1px) !important;
}
.portada2-hero .btn::after,
.portada2-hero .hero-secondary-link::after {
    content: none !important;
}
.portada2-hero-cta-subtext {
    font-size: 12px !important; /* Slightly smaller subtext */
    color: rgba(255, 255, 255, 0.7) !important;
    margin-top: 4px !important; /* Reduced margin */
    font-weight: 500 !important;
    display: inline-block;
}
.portada2-hero-secondary-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 0 !important;
}
.portada2-hero-secondary-subtext {
    font-size: 12px !important;
    color: rgba(255, 255, 255, 0.6) !important;
    margin-top: 4px !important;
    font-weight: 500 !important;
    text-align: center !important;
    display: inline-block;
}
@media (max-width: 768px) {
    .portada2-hero-secondary-wrapper {
        margin-top: 0 !important;
    }
}

/* Sub-navigation Menu (Standard white layout on load) */
.portada2-sticky-menu {
    background: #ffffff;
    border-bottom: 1px solid #E2DED4;
    position: relative;
    z-index: 999;
    padding: 12px 24px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04);
    transition: all 0.3s ease;
}
.portada2-sticky-menu-inner {
    max-width: var(--wp--custom--layout--desktop-width);
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    box-sizing: border-box;
    position: relative !important; /* Allow mega menus to position relative to this container */
}
.sticky-menu-logo {
    width: 120px;
}
.sticky-menu-logo img {
    width: 100%;
    height: auto;
    display: block;
    aspect-ratio: auto; /* base.css aplica 16/9 a img sin width/height attrs — override aquí */
    object-fit: unset;
}
.sticky-menu-links {
    display: flex;
    list-style: none;
    gap: 8px; /* Reduced from 32px to compensate for the a tag padding */
    margin: 0;
    padding: 0;
}
.sticky-menu-links a {
    text-decoration: none;
    font-size: 15px;
    font-weight: 600;
    color: var(--wp--preset--color--neutral-800);
    transition: color 0.2s ease;
    display: inline-flex;
    align-items: center;
    padding: 12px 12px; /* Expands the hit area by 12px vertically and 12px horizontally */
}
.sticky-menu-links a:hover {
    color: var(--wp--preset--color--primary-100);
}
.sticky-menu-ctas {
    display: flex;
    gap: 12px;
    align-items: center;
}
.sticky-menu-ctas .sticky-btn,
#site-header .contenedor-cta a.header-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 40px !important;
    padding: 0 20px !important;
    font-size: 14px !important;
    font-family: 'Saans', sans-serif !important;
    font-weight: 700 !important;
    border-radius: 12px !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
    box-sizing: border-box !important;
    gap: 6px !important;
    line-height: 1 !important;
    margin: 0 !important;
}
.sticky-menu-ctas .sticky-btn svg,
.sticky-menu-ctas .sticky-btn .btn-icon,
#site-header .contenedor-cta a.header-btn svg,
#site-header .contenedor-cta a.header-btn .btn-icon {
    margin: 0 !important;
    flex-shrink: 0 !important;
}
.sticky-menu-ctas .btn-primary {
    background-color: var(--wp--preset--color--primary-100) !important;
    border: 1.5px solid var(--wp--preset--color--primary-100) !important;
    color: #ffffff !important;
}
.sticky-menu-ctas .btn-primary:hover {
    background-color: var(--wp--preset--color--primary-150) !important;
    border-color: var(--wp--preset--color--primary-150) !important;
    color: #ffffff !important;
}
.sticky-menu-ctas .btn-secondary {
    background-color: transparent !important;
    border: 1.5px solid var(--wp--preset--color--neutral-300) !important;
    color: var(--wp--preset--color--neutral-800) !important;
}
.sticky-menu-ctas .btn-secondary:hover {
    border-color: var(--wp--preset--color--neutral-500) !important;
    background-color: #faf9f6 !important;
    color: var(--wp--preset--color--neutral-900) !important;
}
/* Dropdown Menus in Sticky Sub-header Menu */
.portada2-sticky-menu .has-dropdown {
    position: relative !important;
}
.portada2-sticky-menu .dropdown-menu {
    display: block !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    position: absolute !important;
    top: calc(100% + 8px) !important;
    left: 50% !important;
    transform: translate(-50%, 8px) !important;
    background: #ffffff !important;
    box-shadow: 0 15px 40px rgba(14, 14, 144, 0.08) !important;
    border: 1px solid #E2DED4 !important;
    border-radius: 16px !important;
    padding: 10px 8px !important;
    min-width: 220px !important;
    list-style: none !important;
    z-index: 1000 !important;
    margin: 0 !important;
    transition: opacity 0.25s cubic-bezier(0.16, 1, 0.3, 1), transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.25s !important;
}
.portada2-sticky-menu .dropdown-menu::before {
    content: '' !important;
    position: absolute !important;
    top: -12px !important;
    left: 0 !important;
    right: 0 !important;
    height: 12px !important;
    background: transparent !important;
}
.portada2-sticky-menu .dropdown-menu li {
    padding: 0 !important;
    margin: 0 0 2px 0 !important;
    display: block !important;
}
.portada2-sticky-menu .dropdown-menu li:last-child {
    margin-bottom: 0 !important;
}
.portada2-sticky-menu .dropdown-menu a {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 10px 14px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: var(--wp--preset--color--neutral-800) !important;
    border-radius: 10px !important;
    text-decoration: none !important;
    transition: background-color 0.2s ease, color 0.2s ease !important;
    white-space: nowrap !important;
    text-align: left !important;
}
.portada2-sticky-menu .dropdown-menu a::after {
    content: '→' !important;
    opacity: 0 !important;
    transform: translateX(-4px) !important;
    transition: opacity 0.2s ease, transform 0.2s ease !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    color: var(--wp--preset--color--primary-100) !important;
    margin-left: 8px !important;
}
.portada2-sticky-menu .dropdown-menu a:hover::after {
    opacity: 1 !important;
    transform: translateX(0) !important;
}
.portada2-sticky-menu .dropdown-menu a:hover {
    background-color: #F5F3EF !important;
    color: var(--wp--preset--color--primary-100) !important;
}
.portada2-sticky-menu .has-dropdown:hover .dropdown-menu {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translate(-50%, 0) !important;
}
.portada2-sticky-menu .dropdown-chevron {
    transition: transform 0.2s ease !important;
}
.portada2-sticky-menu .has-dropdown:hover .dropdown-chevron {
    transform: rotate(180deg) !important;
}


.portada2-sticky-menu li.has-dropdown.mega-menu-trigger {
    position: static !important; /* Remove relative positioning from trigger to let mega-menu align with container */
}

/* Mega Menu Layout for Contenidos */
.portada2-sticky-menu .mega-menu {
    width: 960px !important;
    max-width: 95vw !important;
    left: 50% !important;
    transform: translate(-50%, 8px) !important; /* Center on container and start slightly lower */
    padding: 28px !important;
    box-sizing: border-box !important;
}
.portada2-sticky-menu .has-dropdown:hover .mega-menu {
    transform: translate(-50%, 0) !important; /* Center on container */
}

/* Align the last dropdown (Senda Health) to the right of its trigger to prevent right-edge overflow */
.portada2-sticky-menu .sticky-menu-links li:last-child .dropdown-menu-structured {
    left: auto !important;
    right: 0 !important;
    transform: translate(0, 8px) !important;
}
.portada2-sticky-menu .sticky-menu-links li:last-child:hover .dropdown-menu-structured {
    transform: translate(0, 0) !important;
}
.mega-menu-inner {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 28px !important;
}

/* 3 Column Mega Menu Links */
.mega-menu-col {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
}
.mega-menu-col:not(:last-child) {
    border-right: 1px solid #E2DED4 !important;
    padding-right: 28px !important;
}
.mega-menu-col-header {
    font-size: 11px !important;
    font-weight: 750 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    color: var(--wp--preset--color--neutral-500) !important;
    margin-bottom: 8px !important;
    padding-left: 10px !important;
}
.mega-menu-item {
    display: flex !important;
    align-items: flex-start !important;
    gap: 12px !important;
    padding: 10px !important;
    border-radius: 12px !important;
    text-decoration: none !important;
    transition: background-color 0.2s ease !important;
}
.mega-menu-item::after {
    content: none !important; /* Disable hover arrow for mega menu items */
}
.mega-menu-item:hover {
    background-color: #F5F3EF !important;
}
.menu-item-icon {
    width: 36px !important;
    height: 36px !important;
    border-radius: 8px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    color: #ffffff !important;
}
.menu-item-icon svg {
    width: 18px !important;
    height: 18px !important;
}
.blog-icon {
    background-color: var(--wp--preset--color--primary-100) !important;
}
.podcast-icon {
    background-color: #334DCF !important;
}
.newsletter-icon {
    background-color: #27AE60 !important;
}
.menu-item-text {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
    text-align: left !important;
}
.menu-item-title {
    font-size: 14px !important;
    font-weight: 700 !important;
    color: var(--wp--preset--color--neutral-900) !important;
    line-height: 1.2 !important;
}
.menu-item-desc {
    font-size: 12px !important;
    color: var(--wp--preset--color--neutral-600) !important;
    line-height: 1.35 !important;
}

/* Right Column (Latest Articles) */
.mega-menu-right {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
}
.mega-menu-right-header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    color: var(--wp--preset--color--neutral-500) !important;
}
.mega-menu-right-header .see-all-link {
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 12px !important;
    color: var(--wp--preset--color--primary-100) !important;
    display: flex !important;
    align-items: center !important;
    gap: 2px !important;
    padding: 0 !important;
    letter-spacing: normal !important;
}
.mega-menu-right-header .see-all-link:hover {
    color: var(--wp--preset--color--primary-150) !important;
    background: transparent !important;
}
.mega-menu-cards {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 12px !important;
}
.mega-card {
    display: flex !important;
    flex-direction: column !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    border: 1px solid #E2DED4 !important;
    text-decoration: none !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
    background: #ffffff !important;
    padding: 0 !important;
}
.mega-card::after {
    content: none !important; /* Disable hover arrow for mega menu cards */
}
.mega-card:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.06) !important;
}
.mega-card-img-wrapper {
    height: 80px !important;
    background-size: cover !important;
    background-position: center !important;
    width: 100% !important;
    background-color: #334DCF !important;
    background-image: linear-gradient(135deg, #334DCF 0%, #0E0E90 100%) !important; /* Premium Fallback */
}
.mega-card-content {
    padding: 10px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    text-align: left !important;
}
.mega-card-cat {
    font-size: 10px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    color: var(--wp--preset--color--primary-100) !important;
    letter-spacing: 0.05em !important;
}
.mega-card-title {
    font-size: 12px !important;
    font-weight: 700 !important;
    color: var(--wp--preset--color--neutral-800) !important;
    line-height: 1.35 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    height: 32px !important;
}

/* Bulletproof Scroll Sticky Mode (Translucent White Layout, matching standard style) */
.portada2-sticky-menu.is-sticky {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 9999 !important;
    background-color: rgba(255, 255, 255, 0.75) !important; /* Translucent white matching standard Senda style */
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border-bottom: 1px solid #E2DED4 !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08) !important;
    padding: 12px 24px !important;
    animation: slideDown 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

@keyframes slideDown {
    from {
        transform: translateY(-100%);
    }
    to {
        transform: translateY(0);
    }
}

/* Responsive mobile adjustments for Hero & Menu */
@media (max-width: 1200px) {
    .page-template-page-portada-2 #site-header,
    .page-template-page-senda-para-mujeres #site-header,
    .page-template-page-senda-para-hombres #site-header {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        background: #0E0E90 !important;
        backdrop-filter: blur(10px) !important;
        -webkit-backdrop-filter: blur(10px) !important;
        border-bottom: 1px solid #E2DED4 !important;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05) !important;
        padding-top: 10px !important;
        padding-bottom: 10px !important;
        height: 64px !important;
        z-index: 10000 !important;
        margin-top: 0 !important;
        display: block !important;
    }
    /* Disable containing block constraints and styling when mobile menu is open */
    body.menu-open.page-template-page-portada-2 #site-header,
    body.menu-open.page-template-page-senda-para-mujeres #site-header,
    body.menu-open.page-template-page-senda-para-hombres #site-header {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background: transparent !important;
        border-bottom: none !important;
        box-shadow: none !important;
        overflow: visible !important;
    }
    body.menu-open.page-template-page-portada-2 #site-header .inner-header-general,
    body.menu-open.page-template-page-senda-para-mujeres #site-header .inner-header-general,
    body.menu-open.page-template-page-senda-para-hombres #site-header .inner-header-general {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    .page-template-page-portada-2 #site-header .inner-header-general,
    .page-template-page-senda-para-mujeres #site-header .inner-header-general,
    .page-template-page-senda-para-hombres #site-header .inner-header-general {
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
        height: 100% !important;
        padding: 0 16px !important;
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
    }
    .page-template-page-portada-2 #site-header .logo-header,
    .page-template-page-senda-para-mujeres #site-header .logo-header,
    .page-template-page-senda-para-hombres #site-header .logo-header {
        position: static !important;
        transform: none !important;
        width: 100px !important;
        margin: 0 !important;
        z-index: 10001 !important;
    }
    .page-template-page-portada-2 #site-header .logo-header img,
    .page-template-page-senda-para-mujeres #site-header .logo-header img,
    .page-template-page-senda-para-hombres #site-header .logo-header img {
        filter: none !important;
    }
    .page-template-page-portada-2 #site-header .menu-toggle,
    .page-template-page-senda-para-mujeres #site-header .menu-toggle,
    .page-template-page-senda-para-hombres #site-header .menu-toggle {
        display: inline-block !important;
        z-index: 10002 !important;
    }
    .page-template-page-portada-2 #site-header .menu-toggle .hamburger,
    .page-template-page-senda-para-mujeres #site-header .menu-toggle .hamburger,
    .page-template-page-senda-para-hombres #site-header .menu-toggle .hamburger {
        background: #0E0E90 !important; /* Brand Blue */
    }
    body:not(.page-template-te-llamamos) #site-header .menu-main.open,
    .page-template-page-senda-para-mujeres #site-header .menu-main.open,
    .page-template-page-senda-para-hombres #site-header .menu-main.open {
        background-color: #FAF6F0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        z-index: 999 !important;
        padding: 80px 24px 40px 24px !important;
        overflow-y: auto !important;
        box-sizing: border-box !important;
    }
    body:not(.page-template-te-llamamos) #site-header .menu-main.open nav,
    body:not(.page-template-te-llamamos) #site-header .menu-main.open .contenedor-cta,
    .page-template-page-senda-para-mujeres #site-header .menu-main.open nav,
    .page-template-page-senda-para-mujeres #site-header .menu-main.open .contenedor-cta,
    .page-template-page-senda-para-hombres #site-header .menu-main.open nav,
    .page-template-page-senda-para-hombres #site-header .menu-main.open .contenedor-cta {
        display: block !important;
    }
    body:not(.page-template-te-llamamos) #site-header .menu-main.open .contenedor-cta,
    .page-template-page-senda-para-mujeres #site-header .menu-main.open .contenedor-cta,
    .page-template-page-senda-para-hombres #site-header .menu-main.open .contenedor-cta {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
        margin-top: auto !important;
        padding-top: 24px !important;
        padding-bottom: 40px !important;
    }
    .portada2-hero {
        padding: 120px 20px 80px 20px !important; /* Adjusted mobile top/bottom padding */
    }
    .portada2-hero-heading {
        font-size: clamp(26px, 6vw, 36px) !important;
        line-height: 1.25 !important;
    }
    .portada2-hero-subtext {
        font-size: 15px !important;
        margin-bottom: 16px !important;
    }
    .portada2-sticky-menu {
        display: none !important; /* Hide sticky menu entirely on mobile */
    }
} /* Close @media (max-width: 1200px) early so drawer accordion styles apply to desktop too */

/* Portada 2 Custom Accordion Menu (Global for both mobile and desktop drawer) */
.portada2-mobile-nav {
    margin-top: 24px !important;
    width: 100% !important;
}
    .portada2-mobile-menu-list {
        list-style: none !important;
        padding: 0 !important;
        margin: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 8px !important;
        width: 100% !important;
    }
    .portada2-mobile-menu-list .mobile-menu-item {
        border-bottom: 1px solid rgba(226, 222, 212, 0.5) !important;
        padding: 8px 0 !important;
    }
    .portada2-mobile-menu-list .mobile-menu-item:last-child {
        border-bottom: none !important;
    }
    .portada2-mobile-menu-list .mobile-menu-item a,
    .portada2-mobile-menu-list .mobile-menu-item .mobile-menu-trigger {
        font-family: 'Saans', sans-serif !important;
        font-size: 18px !important;
        font-weight: 700 !important;
        color: #2A2822 !important;
        text-decoration: none !important;
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        width: 100% !important;
        background: none !important;
        border: none !important;
        padding: 8px 0 !important;
        text-align: left !important;
        cursor: pointer !important;
        -webkit-appearance: none !important;
        appearance: none !important;
        outline: none !important;
        box-shadow: none !important;
        -webkit-tap-highlight-color: transparent !important;
    }
    
    .portada2-mobile-menu-list .mobile-menu-item .mobile-chevron {
        transition: transform 0.3s ease !important;
        color: #635E54 !important;
    }
    
    /* When accordion is open */
    .portada2-mobile-menu-list .mobile-menu-item.submenu-open .mobile-chevron {
        transform: rotate(180deg) !important;
    }
    
    .portada2-mobile-menu-list .mobile-submenu {
        display: none !important;
        list-style: none !important;
        padding: 4px 0 12px 16px !important;
        margin: 0 !important;
    }
    
    /* Sin scroll propio: un submenú con su barra dentro de un drawer que
       también scrollea deja al usuario sin saber qué está moviendo. El
       submenú se despliega entero y quien scrollea es el drawer. */
    .portada2-mobile-menu-list .mobile-menu-item.submenu-open .mobile-submenu {
        display: block !important;
        max-height: none !important;
        overflow: visible !important;
    }
    
    .portada2-mobile-menu-list .mobile-submenu li {
        padding: 8px 0 !important;
    }
    
    .portada2-mobile-menu-list .mobile-submenu li a {
        font-family: 'Saans', sans-serif !important;
        font-size: 15px !important;
        font-weight: 500 !important;
        color: #635E54 !important;
        padding: 0 !important;
    }
    
    .portada2-mobile-menu-list .mobile-submenu li.submenu-section-header {
        font-family: 'Saans', sans-serif !important;
        font-size: 12px !important;
        font-weight: 800 !important;
        color: #A09B8E !important;
        text-transform: uppercase !important;
        letter-spacing: 1px !important;
        padding-top: 12px !important;
        padding-bottom: 4px !important;
        list-style: none !important;
    }
    
    .portada2-mobile-menu-list .mobile-submenu li.submenu-section-header:first-child {
        padding-top: 4px !important;
    }
    
/* Hide desktop CTA buttons inside hamburger menu on mobile and desktop */
body:not(.page-template-te-llamamos) #site-header .contenedor-cta a.header-btn-desktop-only,
.page-template-page-senda-para-mujeres #site-header .contenedor-cta a.header-btn-desktop-only,
.page-template-page-senda-para-hombres #site-header .contenedor-cta a.header-btn-desktop-only {
    display: none !important;
}

/* Refined Dropdown Menu (Structured/SaaS style) */
.portada2-sticky-menu .dropdown-menu-structured {
    display: block !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    position: absolute !important;
    top: calc(100% + 8px) !important;
    left: 50% !important;
    transform: translate(-50%, 8px) !important;
    background: rgba(255, 255, 255, 0.98) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    box-shadow: 0 20px 50px rgba(14, 14, 144, 0.06), 0 4px 12px rgba(14, 14, 144, 0.02) !important;
    border: 1px solid rgba(226, 222, 212, 0.8) !important;
    border-radius: 20px !important;
    padding: 16px !important;
    width: 320px !important;
    list-style: none !important;
    z-index: 1000 !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    transition: opacity 0.25s cubic-bezier(0.16, 1, 0.3, 1), transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.25s !important;
}

.portada2-sticky-menu .has-dropdown:hover .dropdown-menu-structured {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translate(-50%, 0) !important;
}

.portada2-sticky-menu .dropdown-menu-structured::before {
    content: '' !important;
    position: absolute !important;
    top: -12px !important;
    left: 0 !important;
    right: 0 !important;
    height: 12px !important;
    background: transparent !important;
}

.portada2-sticky-menu .dropdown-menu-structured li {
    padding: 0 !important;
    margin: 0 !important;
    display: block !important;
}

.portada2-sticky-menu .dropdown-menu-structured .structured-item {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    white-space: normal !important;
    gap: 14px !important;
    padding: 10px 12px !important;
    border-radius: 12px !important;
    text-decoration: none !important;
    transition: background-color 0.25s ease, transform 0.2s ease !important;
}
.portada2-sticky-menu .mega-menu a::after,
.portada2-sticky-menu .dropdown-menu-structured .structured-item::after {
    content: none !important;
    display: none !important;
}

.portada2-sticky-menu .dropdown-menu-structured .structured-item:hover {
    background-color: #F8F6F2 !important;
    transform: translateY(-1px) !important;
}

.portada2-sticky-menu .dropdown-menu-structured .structured-icon-box {
    width: 36px !important;
    height: 36px !important;
    border-radius: 10px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    background-color: rgba(14, 14, 144, 0.05) !important;
    color: #0E0E90 !important;
    transition: background-color 0.25s ease, color 0.25s ease !important;
}

.portada2-sticky-menu .dropdown-menu-structured .structured-item:hover .structured-icon-box {
    background-color: #0E0E90 !important;
    color: #ffffff !important;
}

.portada2-sticky-menu .dropdown-menu-structured .structured-icon-box svg {
    width: 18px !important;
    height: 18px !important;
}

.portada2-sticky-menu .dropdown-menu-structured .structured-text {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
    text-align: left !important;
}

.portada2-sticky-menu .dropdown-menu-structured .structured-title {
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #2A2822 !important;
    line-height: 1.2 !important;
    transition: color 0.2s ease !important;
}

.portada2-sticky-menu .dropdown-menu-structured .structured-item:hover .structured-title {
    color: #0E0E90 !important;
}

.portada2-sticky-menu .dropdown-menu-structured .structured-desc {
    font-size: 11.5px !important;
    color: #8C877D !important;
    line-height: 1.35 !important;
}

/* Allow structured items inside mega menus */
.portada2-sticky-menu .mega-menu .structured-item {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    white-space: normal !important;
    gap: 14px !important;
    padding: 10px 12px !important;
    border-radius: 12px !important;
    text-decoration: none !important;
    transition: background-color 0.25s ease, transform 0.2s ease !important;
}
.portada2-sticky-menu .mega-menu .structured-item::after {
    content: none !important;
}
.portada2-sticky-menu .mega-menu .structured-item:hover {
    background-color: #F8F6F2 !important;
    transform: translateY(-1px) !important;
}
.portada2-sticky-menu .mega-menu .structured-icon-box {
    width: 36px !important;
    height: 36px !important;
    border-radius: 10px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    background-color: rgba(14, 14, 144, 0.05) !important;
    color: #0E0E90 !important;
    transition: background-color 0.25s ease, color 0.25s ease !important;
}
.portada2-sticky-menu .mega-menu .structured-item:hover .structured-icon-box {
    background-color: #0E0E90 !important;
    color: #ffffff !important;
}
.portada2-sticky-menu .mega-menu .structured-icon-box svg {
    width: 18px !important;
    height: 18px !important;
}
.portada2-sticky-menu .mega-menu .structured-text {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
    text-align: left !important;
}
.portada2-sticky-menu .mega-menu .structured-title {
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #2A2822 !important;
    line-height: 1.2 !important;
    transition: color 0.2s ease !important;
}
.portada2-sticky-menu .mega-menu .structured-item:hover .structured-title {
    color: #0E0E90 !important;
}
.portada2-sticky-menu .mega-menu .structured-desc {
    font-size: 11.5px !important;
    color: #8C877D !important;
    line-height: 1.35 !important;
}

/* Media Marquee inside Portada 2 Hero overrides */
.portada2-hero .media-marquee-container {
    background: transparent !important;
    border-bottom: none !important;
    margin-top: 60px !important; /* Increased to separate more from the upper elements */
    padding: 0 !important;
}
.portada2-hero .media-marquee-title {
    color: #b0afab !important;
}
.portada2-hero .media-logo-item {
    color: #e2ded4 !important;
    opacity: 0.7 !important;
}
.portada2-hero .media-logo-item:hover {
    opacity: 1 !important;
    color: #ffffff !important;
}

/* 2-Column Wide Dropdown for El Programa */
.portada2-sticky-menu .dropdown-menu-structured.dropdown-menu-2col {
    width: 660px !important;
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px 16px !important;
    padding: 24px !important;
}

@media (max-width: 768px) {
    .portada2-sticky-menu .dropdown-menu-structured.dropdown-menu-2col {
        width: 100% !important;
        grid-template-columns: 1fr !important;
        gap: 4px !important;
        padding: 16px !important;
    }
}

/* ==========================================================================
   LANDING ANCHOR NAV (topbar de anclas de las landings de género)
   No se muestra al cargar (el hero conserva solo el logo + hamburguesa del
   #site-header, igual que la portada). Se revela al salir del hero, vía JS
   que añade .is-visible (ver template-parts/landing-anchor-nav.php).
   ========================================================================== */
.landing-anchor-nav {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9999;
    background: #ffffff;
    border-bottom: 1px solid #E2DED4;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
    transform: translateY(-100%);
    opacity: 0;
    pointer-events: none;
    transition: transform 0.3s ease, opacity 0.3s ease;
}
.landing-anchor-nav.is-visible {
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto;
}
.landing-anchor-nav__inner {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 12px 24px;
}
.landing-anchor-nav__logo {
    display: inline-flex;
    flex-shrink: 0;
}
.landing-anchor-nav__logo img {
    display: block;
    height: 20px;
    width: auto;
}
.landing-anchor-nav__links {
    display: flex;
    align-items: center;
    gap: 28px;
    list-style: none;
    margin: 0;
    padding: 0;
    flex: 1;
    justify-content: center;
}
.landing-anchor-nav__links a {
    font-family: 'Saans', sans-serif;
    font-size: 15px;
    font-weight: 600;
    color: #2A2822;
    text-decoration: none;
    white-space: nowrap;
    transition: color 0.2s ease;
}
.landing-anchor-nav__links a:hover {
    color: #334DCF;
}
.landing-anchor-nav__ctas {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}
/* CTAs compactos: el .btn global trae min-height:54px, que engordaría la
   barra. Doble clase para ganar en especificidad a .btn sin !important. */
.landing-anchor-nav .landing-anchor-nav__cta {
    min-height: 40px;
    min-width: 0;
    padding: 9px 22px;
    font-size: 15px;
}

/* Las anclas no deben quedar bajo la topbar al hacer clic (~64px). */
body.page-template-page-senda-para-mujeres [id],
body.page-template-page-senda-para-hombres [id] {
    scroll-margin-top: 84px;
}

@media (max-width: 900px) {
    .landing-anchor-nav__inner {
        flex-wrap: wrap;
        padding: 10px 16px;
        gap: 10px;
    }
    .landing-anchor-nav__links {
        order: 3;
        width: 100%;
        flex: 1 0 100%;
        justify-content: flex-start;
        gap: 20px;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .landing-anchor-nav__links::-webkit-scrollbar {
        display: none;
    }
}

/* ── Normalizar el tamaño de los títulos de sección de las landings ──────────
   Había muchos tamaños distintos (el de propuesta-valor llegaba a 48px).
   Se unifican todos a un tamaño común, scoped a las 2 landings para no tocar
   la home ni otras páginas que comparten estos bloques. */
body.page-template-page-senda-para-mujeres .colectivo-landing .titulo,
body.page-template-page-senda-para-mujeres .colectivo-landing .senda-block-titulo,
body.page-template-page-senda-para-mujeres .colectivo-landing .farmacos-titulo,
body.page-template-page-senda-para-mujeres .colectivo-landing .colectivo-faq-titulo,
body.page-template-page-senda-para-mujeres .colectivo-landing .preventive-copy h3,
body.page-template-page-senda-para-mujeres #equipo .equipo-titulo,
body.page-template-page-senda-para-hombres .colectivo-landing .titulo,
body.page-template-page-senda-para-hombres .colectivo-landing .senda-block-titulo,
body.page-template-page-senda-para-hombres .colectivo-landing .farmacos-titulo,
body.page-template-page-senda-para-hombres .colectivo-landing .colectivo-faq-titulo,
body.page-template-page-senda-para-hombres .colectivo-landing .preventive-copy h3,
body.page-template-page-senda-para-hombres #equipo .equipo-titulo {
    font-size: clamp(1.5rem, 2.2vw, 2rem) !important;
    line-height: 1.2 !important;
}

/* ── Destacados: de bold (700/800) a semibold (600) en toda la landing ───────
   Cubre el énfasis <strong>/<b> y los <span> de énfasis de los títulos. */
body.page-template-page-senda-para-mujeres .colectivo-landing strong,
body.page-template-page-senda-para-mujeres .colectivo-landing b,
body.page-template-page-senda-para-mujeres .colectivo-landing .titulo span,
body.page-template-page-senda-para-hombres .colectivo-landing strong,
body.page-template-page-senda-para-hombres .colectivo-landing b,
body.page-template-page-senda-para-hombres .colectivo-landing .titulo span {
    font-weight: 600 !important;
}

/* ==========================================================================
   PORTADA — normalización de títulos de bloque + destacados a semibold
   Scoped a .page-template-page-portada-2 para no afectar a otras páginas que
   comparten estos bloques (propuesta-valor, precios, incluye, farmacos...).
   ========================================================================== */
/* Todos los títulos de sección al mismo tamaño (antes 'Tu senda...' llegaba
   a 48px y el resto variaban). */
body.page-template-page-portada-2 main .titulo,
body.page-template-page-portada-2 main .senda-block-titulo,
body.page-template-page-portada-2 main .farmacos-titulo,
body.page-template-page-portada-2 main .actualidad-heading,
body.page-template-page-portada-2 main .colectivo-faq-titulo,
/* #equipo .equipo-titulo lleva font-size !important con especificidad de id
   en su media query móvil; hay que igualar esa especificidad para normalizarlo. */
body.page-template-page-portada-2 #equipo .equipo-titulo {
    font-size: clamp(1.5rem, 2.2vw, 2rem) !important;
    line-height: 1.2 !important;
}

/* Destacados de bold (700/800) a semibold (600): elementos genéricos
   (<strong>/<b>) y los <span> de énfasis de los títulos de bloque. */
body.page-template-page-portada-2 main strong,
body.page-template-page-portada-2 main b,
body.page-template-page-portada-2 main .titulo span,
body.page-template-page-portada-2 main .actualidad-heading strong {
    font-weight: 600 !important;
}

/* ==========================================================================
   LANDING GET HERO (PREMIUM SPLIT LAYOUT WITH ROUNDED IMAGES COLLAGE)
   ========================================================================== */
.hero--gender {
    background: linear-gradient(135deg, #0E0E90 0%, #1c1c73 50%, #0c0c5c 100%) !important;
    padding: 80px 0 !important;
    position: relative;
    overflow: hidden;
    width: 100% !important;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Subtle background accent glow */
.hero--gender::before {
    content: '';
    position: absolute;
    top: -10%;
    right: -10%;
    width: 50%;
    height: 60%;
    background: radial-gradient(circle, rgba(51, 77, 207, 0.25) 0%, transparent 70%);
    z-index: 0;
    pointer-events: none;
}

.hero--gender-container {
    /* min(1100px, 90vw): igual que el ratio de ancho del header-general
       (grid-template-columns: 1fr min(content-size, 90%) 1fr) — así el
       hero nunca queda más ancho que la topbar en pantallas de portátil
       (~1000-1220px), donde 1100px fijo se salía de los 90vw del header. */
    max-width: min(1100px, 90vw);
    width: 100%;
    margin: 0 auto;
    padding: 0 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    z-index: 1;
    box-sizing: border-box;
}

.hero--gender-content {
    flex: 1;
    max-width: 680px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}

.hero--gender-tag {
    font-size: 11px !important;
    font-weight: 700;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: #e2ded4 !important; /* Brand sand color */
    margin-bottom: 12px;
    font-family: 'Saans', 'Saans', sans-serif !important;
}

.hero--gender-heading {
    font-family: 'Saans', sans-serif !important;
    font-size: clamp(30px, 3.8vw, 44px) !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    color: #ffffff !important;
    margin: 0 0 16px 0 !important;
}

.hero--gender-subtext {
    font-size: clamp(14px, 1.6vw, 16px) !important;
    line-height: 1.6 !important;
    color: #f2f5fc !important;
    opacity: 0.95;
    margin: 0 0 24px 0 !important;
}

.hero--gender-trust {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 30px;
    width: 100%;
}

.hero--gender-trust .trust-item {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14.5px;
    font-weight: 600;
    color: #ffffff !important;
}

.hero--gender-trust .trust-icon {
    width: 16px;
    height: 16px;
    color: #FFC043 !important; /* Gold tick check icon */
    flex-shrink: 0;
}

.hero--gender-ctas {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    width: 100%;
}
@media (min-width: 769px) {
    .hero--gender-ctas .hero-btns-row {
        flex-wrap: nowrap !important;
    }
}

.hero--gender-ctas .btn-primary {
    background-color: #FFC043 !important; /* Brand Senda Gold */
    border: 1px solid #FFC043 !important;
    color: #0E0E90 !important; /* Brand Purple */
    padding: 14px 36px !important;
    border-radius: 100px !important;
    font-weight: 700 !important;
    font-size: 16px !important;
    box-shadow: 0 4px 14px rgba(255, 192, 67, 0.3) !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none !important;
    transition: all 0.2s ease-in-out !important;
}

.hero--gender-ctas .btn-primary:hover {
    background-color: #e5ab3b !important;
    border-color: #e5ab3b !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(255, 192, 67, 0.5) !important;
}

.hero--gender-cta-subtext {
    font-size: 12px !important;
    color: #e2ded4 !important;
    opacity: 0.8;
    margin-top: 4px;
    font-weight: 500;
    text-align: left;
}

.hero--gender-secondary-link {
    font-size: 14px !important;
    color: #ffffff !important;
    text-decoration: underline !important;
    font-weight: 600;
    margin-top: 10px;
    display: inline-block;
}

.hero--gender-secondary-link:hover {
    color: #e2ded4 !important;
}

/* Right side collage */
.hero--gender-images {
    flex: 1;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    max-width: 440px;
    width: 100%;
    margin-left: 60px;
    position: relative;
}

.hero--gender-img-box {
    aspect-ratio: 1;
    overflow: hidden;
    border-radius: 50%;
    border: 4px solid rgba(255, 255, 255, 0.2);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.2);
    transition: all 0.3s ease;
    background-color: #f2f5fc;
}

.hero--gender-img-box:hover {
    transform: scale(1.05) translateY(-5px);
    border-color: #FFC043;
}

.hero--gender-img-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Offset positions for organic look */
.hero--gender-img-box:nth-child(even) {
    transform: translateY(30px);
}
.hero--gender-img-box:nth-child(even):hover {
    transform: scale(1.05) translateY(25px);
}

/* Men special card placeholder if only 3 images */
.hero--gender-placeholder {
    aspect-ratio: 1;
    border-radius: 50%;
    border: 4px dashed rgba(255, 255, 255, 0.3);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.05);
    text-align: center;
    padding: 16px;
    box-sizing: border-box;
    color: #ffffff;
    font-family: 'Saans', sans-serif;
}

.hero--gender-placeholder .badge-icon {
    font-size: 24px;
    color: #FFC043;
    margin-bottom: 4px;
}

.hero--gender-placeholder .badge-text {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    line-height: 1.3;
}

/* Responsive adjustments */
@media (max-width: 920px) {
    .hero--gender {
        padding: 60px 0 !important;
    }
    .hero--gender-container {
        flex-direction: column;
        gap: 50px;
        text-align: center;
    }
    .hero--gender-content {
        align-items: center;
        text-align: center;
        max-width: 100%;
    }
    .hero--gender-tag {
        text-align: center;
    }
    .hero--gender-heading {
        text-align: center;
    }
    .hero--gender-subtext {
        text-align: center;
    }
    .hero--gender-trust {
        align-items: center;
    }
    .hero--gender-ctas {
        align-items: center;
    }
    .hero--gender-cta-subtext {
        text-align: center;
    }
    .hero--gender-images {
        margin-left: 0;
        max-width: 320px;
        gap: 16px;
    }
    .hero--gender-img-box:nth-child(even) {
        transform: translateY(15px);
    }
    .hero--gender-img-box:nth-child(even):hover {
        transform: scale(1.05) translateY(10px);
    }
}

/* Modifier for Light/White Hero on Landings */
.hero--gender.hero-white {
    background: #ffffff !important;
    padding: 80px 0 !important;
    border-bottom: 1px solid #E2DED4;
}

.hero--gender.hero-white::before {
    background: radial-gradient(circle, rgba(51, 77, 207, 0.05) 0%, transparent 70%);
}

.hero--gender.hero-white .hero--gender-heading {
    color: #0B0B0B !important; /* Dark black */
}

.hero--gender.hero-white .hero--gender-subtext {
    color: #2A2822 !important; /* Dark subtext */
    opacity: 1;
}

.hero--gender.hero-white .hero--gender-trust {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 24px;
    margin-bottom: 30px;
    justify-content: flex-start;
}

.hero--gender.hero-white .hero--gender-trust .trust-item {
    color: #2A2822 !important;
    display: flex;
    align-items: center;
    gap: 8px;
}

.hero--gender.hero-white .hero--gender-trust .trust-icon {
    color: #334DCF !important; /* Blue tick check icon */
}

.hero--gender.hero-white .hero--gender-cta-subtext {
    color: #8c8c96 !important;
    opacity: 1;
}

.hero--gender.hero-white .hero--gender-secondary-link {
    color: #635E54 !important;
}

.hero--gender.hero-white .hero--gender-secondary-link:hover {
    color: #0E0E90 !important;
}

.hero--gender.hero-white .hero--gender-ctas .btn-primary {
    background-color: #334DCF !important; /* Brand Blue */
    border: 1px solid #334DCF !important;
    color: #ffffff !important;
    box-shadow: 0 4px 14px rgba(51, 77, 207, 0.25) !important;
}

.hero--gender.hero-white .hero--gender-ctas .btn-primary:hover {
    background-color: #0E0E90 !important;
    border-color: #0E0E90 !important;
    box-shadow: 0 6px 20px rgba(14, 14, 144, 0.4) !important;
}

/* Multi-sized Organic Collage styling (White Hero Only) */
.hero--gender.hero-white .hero--gender-images {
    position: relative;
    width: 100%;
    max-width: 480px;
    height: 400px;
    margin-left: 60px;
    display: block; /* Disable grid on desktop */
}

.hero--gender.hero-white .hero--gender-img-box {
    position: absolute;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 !important;
    box-sizing: border-box !important;
    border: none !important;
}

.hero--gender.hero-white .hero--gender-img-box img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 0 !important;
}

.hero--gender.hero-white .hero--gender-placeholder {
    position: absolute;
    border-radius: 24px;
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 16px;
    box-sizing: border-box;
    font-family: 'Saans', sans-serif;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.05);
    border: 2px dashed rgba(14, 14, 144, 0.15) !important;
}

/* Specific Sizes and Positions for the Collage */
.hero--gender.hero-white .hero--gender-images .img-box-1 {
    width: 160px;
    height: 160px;
    top: 10px;
    left: 20px;
    z-index: 2;
}

.hero--gender.hero-white .hero--gender-images .img-box-2 {
    width: 220px;
    height: 220px;
    top: 30px;
    right: 20px;
    z-index: 1;
}

.hero--gender.hero-white .hero--gender-images .img-box-3 {
    width: 190px;
    height: 190px;
    bottom: 20px;
    left: 40px;
    z-index: 3;
}

.hero--gender.hero-white .hero--gender-images .img-box-4 {
    width: 150px;
    height: 150px;
    bottom: 10px;
    right: 50px;
    z-index: 2;
}

/* Hover effects for organic elements */
.hero--gender.hero-white .hero--gender-img-box:hover,
.hero--gender.hero-white .hero--gender-placeholder:hover {
    transform: scale(1.06) translateY(-5px);
    z-index: 10;
}

/* Individual colors for Women */
.page-template-page-senda-para-mujeres .hero--gender-images .img-box-1 {
    background-color: #F8EEF8 !important;
}
.page-template-page-senda-para-mujeres .hero--gender-images .img-box-2 {
    background-color: #FFF3EB !important;
}
.page-template-page-senda-para-mujeres .hero--gender-images .img-box-3 {
    background-color: #FAF6F0 !important;
}
.page-template-page-senda-para-mujeres .hero--gender-images .img-box-4 {
    background-color: #F8EEF8 !important;
}

/* Individual colors for Men */
.page-template-page-senda-para-hombres .hero--gender-images .img-box-1 {
    background-color: #E8F4F8 !important;
}
.page-template-page-senda-para-hombres .hero--gender-images .img-box-2 {
    background-color: #F0F4FC !important;
}
.page-template-page-senda-para-hombres .hero--gender-images .img-box-3 {
    background-color: #FAF6F0 !important;
}
.page-template-page-senda-para-hombres .hero--gender-images .img-box-4 {
    background-color: #E8F4F8 !important;
    border: 2px dashed #334DCF !important;
    color: #0E0E90 !important;
}

/* Menu CTAs load/scroll logic (secondary on load, primary on scroll) */
.portada2-sticky-menu:not(.is-sticky) .sticky-menu-ctas .btn-primary {
    background-color: transparent !important;
    border: 1.5px solid var(--wp--preset--color--neutral-300) !important;
    color: var(--wp--preset--color--neutral-800) !important;
    box-shadow: none !important;
}

.portada2-sticky-menu:not(.is-sticky) .sticky-menu-ctas .btn-primary:hover {
    border-color: var(--wp--preset--color--neutral-500) !important;
    background-color: #faf9f6 !important;
    color: var(--wp--preset--color--neutral-900) !important;
}

.portada2-sticky-menu.is-sticky .sticky-menu-ctas .btn-primary {
    background-color: var(--wp--preset--color--primary-100) !important;
    border: 1.5px solid var(--wp--preset--color--primary-100) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(51, 77, 207, 0.2) !important;
}

.portada2-sticky-menu.is-sticky .sticky-menu-ctas .btn-primary:hover {
    background-color: var(--wp--preset--color--primary-150) !important;
    border-color: var(--wp--preset--color--primary-150) !important;
    color: #ffffff !important;
}

/* Bulletproof Scroll Sticky Mode with rounding on scroll (Floating Pill Mode) */
@media (min-width: 921px) {
    .portada2-sticky-menu.is-sticky {
        position: fixed !important;
        top: 16px !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
        width: 90% !important;
        max-width: 1200px !important;
        border-radius: 24px !important;
        border: 1px solid rgba(226, 222, 212, 0.8) !important;
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08) !important;
        padding: 10px 32px !important;
        background-color: rgba(255, 255, 255, 0.88) !important;
        backdrop-filter: blur(12px) !important;
        -webkit-backdrop-filter: blur(12px) !important;
    }
    /* Admin bar (32px fijo) cubre el floating pill — bajarlo para que el logo sea visible */
    .admin-bar .portada2-sticky-menu.is-sticky {
        top: 40px !important;
    }
}

/* Responsive fixes for the collage on mobile */
@media (max-width: 920px) {
    .hero--gender.hero-white .hero--gender-trust {
        flex-direction: column;
        align-items: center;
        gap: 10px;
    }
    .hero--gender.hero-white .hero--gender-images {
        display: flex !important;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        height: auto !important;
        margin-left: 0 !important;
        gap: 16px !important;
        max-width: 320px !important;
        position: static !important;
    }
    .hero--gender.hero-white .hero--gender-img-box,
    .hero--gender.hero-white .hero--gender-placeholder {
        position: static !important;
        width: 120px !important;
        height: 120px !important;
        transform: none !important;
        padding: 10px !important;
    }
    .hero--gender.hero-white .hero--gender-placeholder .badge-text {
        font-size: 9px !important;
    }
}

/* Landings custom menu absolute position and hero background start from top */
.colectivo-landing .portada2-sticky-menu:not(.is-sticky) {
    position: absolute !important;
    width: 100% !important;
    left: 0 !important;
    top: 0 !important;
    background: transparent !important;
    border-bottom: 1px solid rgba(226, 222, 212, 0.6) !important;
    box-shadow: none !important;
}

.colectivo-landing .hero--gender.hero-white {
    padding-top: 140px !important;
    border-bottom: none !important;
}

/* Unify media marquee with white hero and remove dividers */
.colectivo-landing .media-marquee-container {
    background-color: #ffffff !important;
    border-top: none !important;
}

@media (max-width: 920px) {
    .colectivo-landing .hero--gender.hero-white {
        padding-top: 100px !important;
    }
}

/* Steps Block SVG Icons Styling and Hover States */
.paso-icono {
    width: 48px !important;
    height: 48px !important;
    border-radius: 12px !important;
    background-color: #F4F6FB !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: none !important;
    flex-shrink: 0;
    transition: all 0.3s ease !important;
}
.paso-icono svg {
    color: #334DCF !important;
    stroke: #334DCF !important;
    transition: stroke 0.3s ease, color 0.3s ease !important;
}
.paso-item:hover .paso-icono {
    background-color: #334DCF !important;
}
.paso-item:hover .paso-icono svg {
    color: #ffffff !important;
    stroke: #ffffff !important;
}

/* Media Marquee Mobile Carousel Spacing */
@media (max-width: 768px) {
    .media-marquee-scroll {
        justify-content: flex-start !important;
        animation-duration: 20s !important;
    }
    .media-logo-item {
        margin: 0 44px !important;
        font-size: 16px !important;
        flex-shrink: 0 !important;
    }
}

/* Hero CTAs Mobile Tap Target Optimization */
@media (max-width: 768px) {
    .portada2-hero-primary-wrapper,
    .portada2-hero-secondary-wrapper {
        width: 100% !important;
        max-width: 320px !important;
    }
    .portada2-hero .btn {
        width: 100% !important;
        text-align: center !important;
        box-sizing: border-box !important;
        padding: 16px 20px !important;
    }
    .portada2-hero .hero-secondary-link {
        width: 100% !important;
        box-sizing: border-box !important;
        padding: 16px 20px !important;
    }
}

/* Call Request Form Landing Stack Override */
@media (max-width: 768px) {
    #te-llamamos .inner-hero {
        grid-template-columns: 1fr !important;
        gap: 32px !important;
        text-align: center !important;
        padding: 40px 16px !important;
    }
    #te-llamamos .form-fields-row {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }
    #te-llamamos .cta-content-side {
        text-align: center !important;
    }
    #te-llamamos .privacy-accept-label {
        justify-content: center !important;
    }
}

/* Drawer CTAs styling (Global for both Desktop Drawer and Mobile Drawer) */
body:not(.page-template-te-llamamos) #site-header .menu-main.open .contenedor-cta a,
.page-template-page-senda-para-mujeres #site-header .menu-main.open .contenedor-cta a,
.page-template-page-senda-para-hombres #site-header .menu-main.open .contenedor-cta a {
    border-radius: 12px !important; /* Update to 12px to match Hero format instead of 100px */
    font-weight: 700 !important;
    font-size: 15px !important;
    padding: 14px 24px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: none !important;
    margin: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
    text-decoration: none !important;
}
body:not(.page-template-te-llamamos) #site-header .menu-main.open .contenedor-cta a.btn-primary,
.page-template-page-senda-para-mujeres #site-header .menu-main.open .contenedor-cta a.btn-primary,
.page-template-page-senda-para-hombres #site-header .menu-main.open .contenedor-cta a.btn-primary {
    background-color: #334DCF !important;
    border: 1.5px solid #334DCF !important;
    color: #ffffff !important;
}
body:not(.page-template-te-llamamos) #site-header .menu-main.open .contenedor-cta a.btn-secondary,
.page-template-page-senda-para-mujeres #site-header .menu-main.open .contenedor-cta a.btn-secondary,
.page-template-page-senda-para-hombres #site-header .menu-main.open .contenedor-cta a.btn-secondary {
    background-color: transparent !important;
    border: 1.5px solid #2A2822 !important;
    color: #2A2822 !important;
}
body:not(.page-template-te-llamamos) #site-header .menu-main.open .contenedor-cta a.btn-whatsapp,
.page-template-page-senda-para-mujeres #site-header .menu-main.open .contenedor-cta a.btn-whatsapp,
.page-template-page-senda-para-hombres #site-header .menu-main.open .contenedor-cta a.btn-whatsapp {
    background-color: transparent !important;
    border: 1.5px solid #25D366 !important;
    color: #2A2822 !important;
}
body:not(.page-template-te-llamamos) #site-header .menu-main.open .contenedor-cta a.btn-whatsapp svg,
.page-template-page-senda-para-mujeres #site-header .menu-main.open .contenedor-cta a.btn-whatsapp svg,
.page-template-page-senda-para-hombres #site-header .menu-main.open .contenedor-cta a.btn-whatsapp svg {
    color: #25D366 !important;
    fill: #25D366 !important;
}

@media (max-width: 1200px) {

/* ==========================================================================
   Landings Responsiveness & Layout Overrides
   ========================================================================== */
@media (max-width: 768px) {
    /* Stack 2-column grids into a single column */
    .colectivo-landing .science-grid,
    .colectivo-landing .preventive-grid,
    .colectivo-landing .inner-pasos-con-linea .columnas,
    .colectivo-landing .inner-texto-imagen .columnas,
    .colectivo-landing .inner-hero,
    .colectivo-landing .form-fields-row {
        grid-template-columns: 1fr !important;
        gap: 32px !important;
    }

    /* Normalize side paddings to 20px and eliminate double padding on nested containers */
    .colectivo-landing section,
    .colectivo-landing .b-block {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
    
    .colectivo-landing .inner-cards-slider,
    .colectivo-landing .inner-pasos-con-linea,
    .colectivo-landing .inner-destacado-equipo,
    .colectivo-landing .inner-texto-imagen,
    .colectivo-landing .inner-hero {
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
    }

    /* Center text inside stacked grids/sections */
    .colectivo-landing .preventive-grid,
    .colectivo-landing .inner-pasos-con-linea .columnas,
    .colectivo-landing .inner-texto-imagen .columnas {
        text-align: left !important;
    }
}
}

/* Card hover transitions for unified icons */
.propuesta:hover .paso-icono {
    background-color: #334DCF !important;
    border-color: #334DCF !important;
}
.propuesta:hover .paso-icono svg {
    color: #ffffff !important;
    stroke: #ffffff !important;
}

.guia-respaldada-box:hover .paso-icono {
    background-color: #334DCF !important;
    border-color: #334DCF !important;
}
.guia-respaldada-box:hover .paso-icono svg {
    color: #ffffff !important;
    stroke: #ffffff !important;
}

/* Wrapper de FAQ para landings de colectivo (hombres/mujeres) —
   mismo tratamiento de sección que .block-faqs (título centrado,
   ancho de contenido) para que se presenten igual que las FAQ
   generales de portada. */
.colectivo-faq {
    padding: var(--section-gap) var(--page-margin);
    background-color: var(--color-neutral-100);
}
.inner-colectivo-faq {
    max-width: var(--wp--custom--layout--content-width);
    margin-inline: auto;
}
.colectivo-faq-titulo {
    font-family: var(--font-body) !important;
    font-size: clamp(1.75rem, 3vw, 2.5rem);
    font-weight: var(--weight-regular);
    color: var(--color-neutral-800);
    text-align: center;
    margin: 0 0 var(--space-10);
}
.colectivo-faq-lista {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
}

/* Clean white FAQ cards styling for collectives landings */
.colectivo-faq .faq-panel {
    background-color: #ffffff !important;
    border: 1px solid #E2DED4 !important;
    border-radius: 16px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.02) !important;
    transition: all 0.3s ease !important;
    padding: 16px 24px !important;
    margin-bottom: 12px !important;
}
.colectivo-faq .faq-panel.active {
    border: 1px solid #E2DED4 !important; /* Remove heavy blue border */
}
.colectivo-faq .faq-panel:hover {
    border-color: #DAD4C3 !important;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.04) !important;
}
.colectivo-faq .faq-panel .title-faq p {
    font-family: 'Saans', sans-serif !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #2A2822 !important;
    width: calc(100% - 32px) !important;
}
.colectivo-faq .faq-panel .body-faq p {
    font-family: 'Saans', 'Saans', sans-serif !important;
    font-size: 14.5px !important;
    line-height: 1.6 !important;
    color: #635E54 !important;
    padding: 12px 0 8px 0 !important;
    margin: 0 !important;
}
.colectivo-faq .faq-panel .icon-faq {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23635E54' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
    width: 24px !important;
    height: 24px !important;
    transition: transform 0.3s ease !important;
}
.colectivo-faq .faq-panel.active .icon-faq {
    transform: rotate(180deg) !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23334DCF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
}

/* "Te llamamos" block visual updates */
section.block-central.is-dark {
    background: #334DCF !important; /* solid flat blue */
}
section.block-central.is-dark .cta-image-side {
    background-color: #4C65E4 !important; /* lighter solid blue background */
}
section.block-central.is-dark .native-submit-btn {
    background-color: transparent !important;
    color: #ffffff !important;
    border: 1.5px solid #ffffff !important;
    box-shadow: none !important;
    transition: all 0.2s ease !important;
}
section.block-central.is-dark .native-submit-btn:hover {
    background-color: rgba(255, 255, 255, 0.1) !important;
    color: #ffffff !important;
}
/* Form 3-column input layout on desktop */
@media (min-width: 769px) {
    section.block-central.is-dark .form-fields-row {
        grid-template-columns: repeat(3, 1fr) !important;
    }
}

/* Colectivos links side-by-side section styles */
.block-colectivos-links {
    background-color: #FAF6F0 !important;
    border-top: 1px solid #E2DED4;
}
.colectivos-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
}
.colectivo-link-card {
    position: relative;
    border-radius: 24px;
    height: 380px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
    background-color: #EEE8DD;
    z-index: 1;
}
.colectivo-link-card .card-bg-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    z-index: 1;
    transition: transform 0.5s ease;
}
.colectivo-link-card:hover .card-bg-image {
    transform: scale(1.03);
}
.women-card .card-bg-image {
    background-position: right center;
}
.men-card .card-bg-image {
    background-position: left center;
}
.colectivo-link-card .card-content-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    padding: 28px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
}
.women-card .card-content-overlay {
    justify-content: flex-start;
}
.men-card .card-content-overlay {
    justify-content: flex-end;
}
.colectivo-link-card .card-text-box {
    background-color: #ffffff;
    padding: 24px 28px;
    border-radius: 20px;
    width: 100%;
    max-width: 290px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.men-card .card-text-box {
    background-color: #F0F4FC; /* matching light blue tint */
}
.colectivo-link-card .card-text-box h3 {
    font-family: 'Saans', sans-serif;
    font-size: 18px;
    font-weight: 800;
    color: #2A2822;
    margin: 0;
}
.colectivo-link-card .card-text-box p {
    font-family: 'Saans', 'Saans', sans-serif;
    font-size: 12px;
    line-height: 1.5;
    color: #635E54;
    margin: 0;
}
.colectivo-link-card .btn-colectivo {
    background-color: #334DCF;
    color: #ffffff !important;
    font-family: 'Saans', sans-serif;
    font-size: 12px;
    font-weight: 700;
    padding: 8px 18px;
    border-radius: 100px;
    text-decoration: none !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: fit-content;
    transition: background-color 0.2s;
    margin-top: 4px;
}
.colectivo-link-card .btn-colectivo:hover {
    background-color: #0E0E90;
}
@media (max-width: 920px) {
    .colectivos-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    .colectivo-link-card {
        position: relative !important;
        height: 380px !important;
        min-height: unset !important;
        overflow: hidden !important;
        border-radius: 24px !important;
        display: flex !important;
        flex-direction: row !important;
    }
    .colectivo-link-card .card-bg-image {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        background-size: cover !important;
        z-index: 1 !important;
    }
    .colectivo-link-card .card-content-overlay {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        z-index: 2 !important;
        padding: 20px !important;
        box-sizing: border-box !important;
        display: flex !important;
        align-items: center !important;
        background: transparent !important;
    }
    .women-card .card-content-overlay {
        justify-content: flex-start !important;
    }
    .men-card .card-content-overlay {
        justify-content: flex-end !important;
    }
    .colectivo-link-card .card-text-box {
        background-color: #ffffff !important;
        padding: 20px 24px !important;
        border-radius: 20px !important;
        width: 100% !important;
        max-width: 260px !important;
        box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08) !important;
        box-sizing: border-box !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
    }
    .men-card .card-text-box {
        background-color: #F0F4FC !important;
    }
}

/* Helper rules for visual and layout overrides */
.colectivo-landing h1 span,
.colectivo-landing h2 span,
.colectivo-landing h3 span,
.colectivo-landing h4 span,
.colectivo-landing h5 span,
.colectivo-landing h6 span,
.colectivo-landing .titulo span {
    color: #2A2822 !important;
}

/* Button arrow disables */
.btn-phone::after,
.btn-calc::after,
.btn-arrow::after,
.wp-element-button.btn-phone::after,
.wp-element-button.btn-calc::after,
.wp-element-button.btn-arrow::after {
    content: none !important;
}

.btn-icon {
    width: 16px;
    height: 16px;
    vertical-align: middle;
    display: inline-block;
}
.btn-phone .btn-icon {
    margin-left: 8px !important;
    margin-right: 0 !important;
}
.btn-arrow .btn-icon {
    margin-left: 8px;
}

/* Form 2-column input layout on desktop */
@media (min-width: 769px) {
    section.block-central.is-dark .form-fields-row {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 20px !important;
    }
}

/* Double columns for program features on desktop */
.programa-incluye-acordeones {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 16px !important;
    max-width: 1100px !important;
    margin: 0 auto 56px auto !important;
}
@media (max-width: 768px) {
    .programa-incluye-acordeones {
        grid-template-columns: 1fr !important;
    }
}

/* Card clinical team professional styles */
.block-destacado-equipo .equipo,
.block-equipo .equipo {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 16px !important;
}
@media (max-width: 991px) {
    .block-destacado-equipo .equipo,
    .block-equipo .equipo {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 12px !important;
    }
}
@media (max-width: 575px) {
    .block-destacado-equipo .equipo,
    .block-equipo .equipo {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }
}

.block-destacado-equipo .persona,
.block-equipo .persona {
    background: #FFFDF9 !important;
    border: 1px solid #D8D0BE !important;
    border-radius: 20px !important;
    padding: 18px !important;
    display: flex !important;
    flex-direction: column !important;
    box-shadow: 0 4px 20px rgba(0,0,0,0.04) !important;
    transition: all 0.3s ease !important;
    box-sizing: border-box !important;
    cursor: pointer;
    width: 100% !important;
    max-width: none !important;
}
.block-destacado-equipo .persona:hover,
.block-equipo .persona:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 30px rgba(0,0,0,0.06) !important;
}
.block-destacado-equipo .persona-imagen,
.block-equipo .persona-imagen {
    width: 100% !important;
    margin: 0 0 16px 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
}
.block-destacado-equipo .persona-imagen .imagen,
.block-equipo .persona-imagen .imagen {
    border-radius: 12px !important;
    border: none !important;
    box-shadow: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}
.block-destacado-equipo .persona-imagen img,
.block-equipo .persona-imagen img {
    width: 100% !important;
    height: 180px !important;
    object-fit: cover !important;
    border-radius: 12px !important;
}
/* Página Equipo clínico (listado completo): fotos más altas que en los
   mini-bloques "TE ACOMPAÑAMOS" de home/landings. */
body.page-id-22 .persona-imagen img {
    height: 260px !important;
}
.block-destacado-equipo .persona-texto,
.block-equipo .persona-texto {
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    text-align: left !important;
    box-sizing: border-box !important;
    gap: 0 !important;
}
.block-destacado-equipo .persona-cargo,
.block-equipo .persona-cargo {
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #635E54 !important;
    margin: 0 !important;
    font-family: 'Saans', sans-serif !important;
    display: block !important;
    line-height: 1.4 !important;
}
.block-destacado-equipo .titulo-item,
.block-equipo .titulo-item {
    font-size: 19px !important;
    font-weight: 800 !important;
    color: #2A2822 !important;
    margin: 6px 0 0 !important;
    font-family: 'Saans', sans-serif !important;
    line-height: 1.3 !important;
}
.block-destacado-equipo .colegiado-item,
.block-equipo .colegiado-item {
    font-size: 12px !important;
    color: #334DCF !important;
    font-weight: 600 !important;
    margin: 4px 0 12px 0 !important;
    display: block !important;
    font-family: 'Saans', sans-serif !important;
    line-height: 1.4 !important;
}
.block-destacado-equipo .texto-item,
.block-equipo .texto-item {
    font-size: 14px !important;
    line-height: 1.55 !important;
    color: #635E54 !important;
    margin: 0 !important;
    font-family: 'Saans', sans-serif !important;
}
/* Cuando hay dos .texto-item seguidos (p.ej. "Nº de colegiado" + descripción
   en la página equipo-clinico, que no usa .persona-cargo/.colegiado-item),
   separarlos para que no queden pegados. No afecta a las cards de home/landings. */
.block-destacado-equipo .texto-item + .texto-item,
.block-equipo .texto-item + .texto-item {
    margin-top: 8px !important;
}
/* El primer .texto-item de varios es el "Nº de colegiado": pintarlo en azul
   como .colegiado-item. :not(:only-of-type) evita afectar a las cards de
   home/landings, que solo tienen un .texto-item (la descripción). */
.block-destacado-equipo .persona-texto .texto-item:first-of-type:not(:only-of-type),
.block-equipo .persona-texto .texto-item:first-of-type:not(:only-of-type) {
    color: #334DCF !important;
    font-weight: 600 !important;
}

/* Custom secondary and call-request button designs */
.btn-phone,
.native-submit-btn {
    background-color: transparent !important;
    border: 1.5px solid currentColor !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    text-decoration: none !important;
    box-shadow: none !important;
    transition: all 0.2s ease-in-out !important;
}

/* 1. Buttons on clear/light backgrounds (header, hero) */
.btn-secondary.btn-phone,
#site-header .contenedor-cta a.btn-secondary.btn-phone,
.hero--gender-ctas a.btn-secondary.btn-phone {
    color: var(--wp--preset--color--neutral-800) !important;
    border-color: var(--wp--preset--color--neutral-800) !important;
    background: transparent !important;
}
.hero--gender-ctas a.btn-secondary.btn-phone {
    padding: 14px 32px !important;
    border-radius: 100px !important;
    font-weight: 700 !important;
    font-size: 16px !important;
    line-height: inherit !important;
    box-sizing: border-box !important;
}
.btn-secondary.btn-phone:hover,
#site-header .contenedor-cta a.btn-secondary.btn-phone:hover,
.hero--gender-ctas a.btn-secondary.btn-phone:hover {
    color: var(--wp--preset--color--neutral-900) !important;
    border-color: var(--wp--preset--color--neutral-900) !important;
    background-color: rgba(42, 40, 34, 0.05) !important;
}

/* Header sticky sub-navigation buttons order & neutral color logic */
.portada2-sticky-menu:not(.is-sticky) .sticky-menu-ctas .btn-secondary.btn-phone {
    color: var(--wp--preset--color--neutral-800) !important;
    border-color: var(--wp--preset--color--neutral-300) !important;
}
.portada2-sticky-menu:not(.is-sticky) .sticky-menu-ctas .btn-secondary.btn-phone:hover {
    color: var(--wp--preset--color--neutral-900) !important;
    border-color: var(--wp--preset--color--neutral-500) !important;
    background-color: #faf9f6 !important;
}

/* Make top bar Empezar buttons exactly identical to the hero secondary button */
.sticky-menu-ctas .btn-primary,
#site-header .contenedor-cta a.header-btn.btn-primary {
    background-color: #0E0E90 !important;
    color: #ffffff !important;
    border: 1px solid #0E0E90 !important;
    border-radius: 12px !important;
    padding: 10px 24px !important;
    height: auto !important;
    font-family: 'Saans', sans-serif !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    text-decoration: none !important;
    box-shadow: none !important;
    transition: all 0.2s ease !important;
    line-height: 1.2 !important;
}

.sticky-menu-ctas .btn-primary:hover,
#site-header .contenedor-cta a.header-btn.btn-primary:hover {
    background-color: #080854 !important;
    border-color: #080854 !important;
    box-shadow: none !important;
    transform: translateY(-1px) !important;
}

/* Styling for patient image text overlay (Women's page) */
.inner-video {
    position: relative;
}

.image-text-overlay {
    position: absolute;
    top: 50%;
    right: 8%;
    transform: translateY(-50%);
    width: 100%;
    max-width: 440px;
    z-index: 10;
    line-height: normal; /* to reset the section's line-height: 0 */
    text-align: left;
}

.overlay-card {
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    padding: 32px;
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(42, 40, 34, 0.08);
    border: 1px solid rgba(226, 222, 212, 0.6);
}

@media (max-width: 991px) {
    .image-text-overlay {
        position: absolute;
        right: 4%;
        max-width: 380px;
    }
}

@media (max-width: 768px) {
    /* Stack vertically on mobile below the patient image */
    .block-video {
        background-color: #FAF6F0 !important;
        padding-bottom: 40px !important;
    }
    .inner-video {
        display: flex;
        flex-direction: column;
    }
    .image-text-overlay {
        position: static;
        transform: none;
        max-width: 100%;
        width: 100%;
        padding: 24px 20px 0 20px;
        box-sizing: border-box;
    }
    .overlay-card {
        background: transparent;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        padding: 0;
        border-radius: 0;
        box-shadow: none;
        border: none;
    }
}


/* ==========================================================================
   GLOBAL CLEAN HEADER STYLES (Modern Drawer Menu for all pages)
   ========================================================================== */
#site-header { 
    position: absolute !important; 
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    margin: 0 !important;
    border-radius: 0 !important;
    padding-top: 0 !important; 
    padding-bottom: 0 !important;
    z-index: 1000 !important;
}

#site-header .inner-header-general {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    width: 100% !important;
    /* min(1100px,90%): misma referencia (--container-desktop) que usa el
       hero de portada/landings, para no separar el logo del icono de
       hamburguesa más de lo que sugiere el ancho real del contenido. */
    max-width: min(1100px, 90%) !important;
    margin: 0 auto !important;
    padding: 0 24px !important;
    height: 78px !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    border-radius: 24px !important;
}

#site-header .logo-header {
    margin: 0 !important;
    position: relative !important;
    transform: none !important;
    z-index: 100 !important;
    width: clamp(7.938rem, 6.277rem + 4.911vw, 10.438rem);
    align-self: center !important;
}

#site-header .menu-toggle {
    position: relative !important;
    transform: none !important;
    z-index: 10002 !important;
    display: flex !important;
    align-self: center !important;
}

#site-header .menu-main nav,
#site-header .contenedor-cta {
    display: none !important;
}

.page-template-page-portada-2 #site-header .logo-header img,
.page-template-te-llamamos #site-header .logo-header img,
.page-template-page-comenzar-el-programa #site-header .logo-header img {
    filter: brightness(0) invert(1) !important;
}

.page-template-page-portada-2 #site-header .menu-toggle .hamburger,
.page-template-te-llamamos #site-header .menu-toggle .hamburger,
.page-template-page-comenzar-el-programa #site-header .menu-toggle .hamburger {
    background-color: #ffffff !important;
}
body.menu-open #site-header .menu-toggle .hamburger {
    background: #0E0E90 !important;
}

@media (min-width: 1201px) {
    #site-header .menu-main.open {
        background-color: #FAF6F0 !important;
        display: flex !important;
        flex-direction: column !important;
        position: fixed !important;
        top: 0 !important;
        right: 0 !important; 
        left: auto !important;
        bottom: 0 !important;
        width: 400px !important;
        max-width: 100vw !important;
        z-index: 9999 !important;
        padding: 80px 32px 40px 32px !important;
        overflow-y: auto !important;
        box-shadow: -8px 0 32px rgba(0,0,0,0.15) !important;
        animation: slideInRight 0.35s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    }
    body.menu-open #site-header .menu-toggle {
        position: fixed !important;
        top: 40px !important;
        right: 32px !important;
    }
    @keyframes slideInRight {
        from { transform: translateX(100%); }
        to { transform: translateX(0); }
    }
    #site-header .menu-main.open nav,
    #site-header .menu-main.open .contenedor-cta {
        display: block !important;
    }
    #site-header .menu-main.open .contenedor-cta a.header-btn-desktop-only {
        display: none !important;
    }
    #site-header .menu-main.open .contenedor-cta {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
        margin-top: auto !important;
        padding-top: 32px !important;
    }
    
    #site-header .menu-main.open .contenedor-cta a {
        color: #2A2822 !important;
        text-decoration: none !important;
        font-weight: 600 !important;
        font-size: 15px !important;
    }
    #site-header .menu-main.open .contenedor-cta a.btn-primary {
        background-color: #334DCF !important;
        color: #ffffff !important;
        border: 1.5px solid #334DCF !important;
        border-radius: 12px !important;
        padding: 10px 24px !important;
    }
}

/* ACTUALIDAD CARDS (BLOG POSTS) */
.actualidad-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
}
.actualidad-card {
    background: #ffffff;
    border: 1px solid #E2DED4;
    border-radius: 20px;
    padding: 32px;
    box-shadow: 0 10px 30px rgba(42, 40, 34, 0.02);
    display: flex;
    flex-direction: column;
    transition: all 0.3s ease;
    box-sizing: border-box;
}
.actualidad-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 40px rgba(14, 14, 144, 0.05);
    border-color: #C5CDEE;
}
.card-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}
.card-badge {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 4px 10px;
    border-radius: 6px;
}
.badge-blog {
    background-color: #E2DED4;
    color: #635E54;
}
.badge-podcast {
    background-color: #E8F4F8;
    color: #334DCF;
}
.badge-newsletter {
    background-color: #F8EEF8;
    color: #334DCF;
}
.card-date {
    font-size: 12px;
    color: #A09B8E;
    font-weight: 400;
}
.actualidad-card .card-title {
    font-family: 'Saans', sans-serif;
    font-size: 20px;
    font-weight: 700;
    color: #2A2822;
    line-height: 1.3;
    margin: 0 0 12px 0;
    min-height: 52px;
}
.actualidad-card .card-excerpt {
    font-family: 'Saans', sans-serif;
    font-size: 14px;
    color: #635E54;
    line-height: 1.6;
    margin: 0 0 24px 0;
    flex-grow: 1;
}
.card-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px dashed #E2DED4;
    padding-top: 20px;
    margin-top: auto;
}
.card-category {
    font-size: 13px;
    font-weight: 600;
    color: #A09B8E;
}
.card-action-link {
    font-family: 'Saans', sans-serif;
    font-size: 14.5px;
    font-weight: 700;
    color: #334DCF;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: color 0.2s ease;
}
.card-action-link:hover {
    color: #2A2822;
}
.card-action-link svg {
    transition: transform 0.2s ease;
}
.card-action-link:hover svg {
    transform: translateX(4px);
}
@media (max-width: 991px) {
    .actualidad-grid {
        grid-template-columns: 1fr;
        gap: 24px;
        padding: 0 16px;
    }
    .actualidad-card .card-title {
        min-height: auto;
    }
}

/* Fix for spacing between photo and CTA on sobre-nosotros */
body.page-id-21 .block-video {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}
body.page-id-21 .block-video img {
    display: block !important;
    margin-bottom: 0 !important;
}



/* Force left alignment on pricing cards */
.card-desglose-precio,
.card-desglose-precio * {
    text-align: left !important;
}
.card-desglose-precio .card-price,
.card-desglose-precio .block-price {
    display: flex !important;
    flex-direction: column !important; /* Force natural column order */
    align-items: flex-start !important; /* Align to the left */
    justify-content: flex-start !important;
    width: 100% !important;
}
.card-desglose-precio .contenedor-price {
    display: block !important;
    width: 100% !important;
    position: static !important;
    float: none !important;
    margin-right: auto !important;
    margin-left: 0 !important;
    text-align: left !important;
}
.card-desglose-precio .contenedor-price-texto {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    margin-right: auto !important;
    margin-left: 0 !important;
}
.card-desglose-precio .wp-block-buttons {
    display: flex !important;
    justify-content: flex-start !important;
    width: 100% !important;
}

/* Limit testimonios de profesionales to 3 items as requested */
#testimonios-grid-profesionales article:nth-child(n+4) {
    display: none !important;
}

/* Normalization for legal pages (Aviso Legal, Privacidad, Cookies) */
.page-id-19 .site-main,
.page-id-3 .site-main,
.page-id-18 .site-main {
    max-width: 800px !important;
    margin: 0 auto !important;
    padding: 160px 24px 80px 24px !important;
    font-family: 'Saans', sans-serif !important;
    color: #635E54 !important;
    line-height: 1.6 !important;
    font-size: 18px !important;
}

.page-id-19 .site-main h1,
.page-id-3 .site-main h1,
.page-id-18 .site-main h1 {
    color: #1D1B16 !important;
    font-family: 'Saans', sans-serif !important;
    font-size: clamp(34px, 4vw, 48px) !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
    margin-bottom: 40px !important;
    margin-top: 0 !important;
    text-align: left !important;
    text-transform: none !important;
}

.page-id-19 .site-main h2,
.page-id-3 .site-main h2,
.page-id-18 .site-main h2 {
    color: #1D1B16 !important;
    font-family: 'Saans', sans-serif !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    margin-top: 48px !important;
    margin-bottom: 16px !important;
}

.page-id-19 .site-main a,
.page-id-3 .site-main a,
.page-id-18 .site-main a {
    color: #334DCF !important;
    text-decoration: underline !important;
    font-weight: 600 !important;
}

/* Flip buttons y título de "Tu senda hacia..." ahora viven exclusivamente
   en blocks/propuesta-valor/styles.css (fuente global única del componente
   propuesta-valor). Antes había 3 definiciones peleando (aquí, el propio
   bloque, y un wp_head solo-portada en functions.php) — eliminadas las
   otras dos. */

/* =============================================================
   FOOTER: ICO + app buttons en la misma línea
   ============================================================= */
/* Ocultar app-downloads del primer bloque brand */
.brand-column .app-downloads {
    display: none !important;
}

/* Fila ICO + botones app en la misma línea */
.footer-ico-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: nowrap;
}
/* footer-funding-logos tiene width:100% global — anularlo dentro de la fila */
.footer-ico-row .footer-funding-logos {
    width: auto;
    flex-shrink: 0;
    margin: 0;
    justify-content: flex-start;
}

.footer-app-downloads-bottom {
    display: flex;
    gap: 10px;
    flex-wrap: nowrap;
}

@media (max-width: 768px) {
    .footer-ico-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }
    .footer-app-downloads-bottom {
        flex-wrap: wrap;
    }
}

/* =============================================================
   GLOBAL: Cabecera de bloque (eyebrow + título + subtexto)
   Referencia visual: "TRANSPARENCIA, DESDE EL PRINCIPIO" / Planes de precios
   Reutilizable en cualquier sección con este patrón de cabecera.
   ============================================================= */
.senda-block-header {
    text-align: center;
    margin-bottom: var(--space-12);
}
.senda-block-eyebrow {
    display: block;
    color: var(--color-neutral-800);
    font-size: var(--text-small);
    font-weight: var(--weight-bold);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: var(--space-3);
}
.senda-block-titulo {
    font-family: var(--font-body);
    font-size: clamp(1.375rem, 2.5vw, 2rem);
    font-weight: var(--weight-regular);
    color: var(--color-neutral-800);
    line-height: var(--leading-snug);
    margin: var(--space-3) 0 var(--space-3);
}
.senda-block-subtexto {
    font-size: var(--text-body);
    color: var(--color-text-muted);
    max-width: 700px;
    margin-inline: auto;
    line-height: var(--leading-normal);
}
@media (max-width: 768px) {
    .senda-block-header {
        padding: 0 var(--page-margin);
        margin-bottom: var(--space-8);
    }
    .senda-block-titulo {
        font-size: clamp(1.25rem, 5vw, 1.5rem);
    }
}

/* =============================================================
   SENDA PARA MUJERES — hero (alineado a portada-2)
   ============================================================= */
/* Corrige el bug de .alignfull: .hero--gender fuerza width:100% !important,
   que rompe el margin-left/right en 50vw del breakout de ancho completo y
   deja la sección (y por tanto el contenedor centrado dentro) desplazada
   ~80-160px hacia la izquierda respecto al resto de secciones de la página. */
.page-template-page-senda-para-mujeres .hero--gender.hero-white {
    width: auto !important;
    max-width: 100vw !important;
    background: #ffffff !important;
}

/* Botones del hero = botones estándar del sitio (buttons.css), sin el
   pill dorado/azul custom que traía .hero--gender-ctas. */
.page-template-page-senda-para-mujeres .hero--gender-ctas .btn-primary,
.page-template-page-senda-para-mujeres .hero--gender.hero-white .hero--gender-ctas .btn-primary {
    background-color: var(--color-brand) !important;
    border: none !important;
    color: var(--color-primary-40) !important;
    padding: 12px 20px !important;
    border-radius: var(--radius-md) !important;
    font-weight: var(--weight-medium) !important;
    font-size: var(--text-body) !important;
    box-shadow: none !important;
    min-height: 54px !important;
    min-width: 120px !important;
}
.page-template-page-senda-para-mujeres .hero--gender-ctas .btn-primary:hover,
.page-template-page-senda-para-mujeres .hero--gender.hero-white .hero--gender-ctas .btn-primary:hover {
    background-color: var(--color-brand-dark) !important;
    border-color: transparent !important;
    color: var(--color-primary-40) !important;
    transform: none !important;
    box-shadow: none !important;
}
.page-template-page-senda-para-mujeres .hero--gender-ctas a.btn-secondary.btn-phone {
    background-color: var(--color-neutral-50) !important;
    color: var(--color-brand) !important;
    outline: 1px solid var(--color-primary-60) !important;
    outline-offset: -1px !important;
    border: none !important;
    padding: 12px 20px !important;
    border-radius: var(--radius-md) !important;
    font-weight: var(--weight-medium) !important;
    font-size: var(--text-body) !important;
    line-height: 1.2 !important;
    min-height: 54px !important;
    min-width: 120px !important;
    box-sizing: border-box !important;
}
.page-template-page-senda-para-mujeres .hero--gender-ctas a.btn-secondary.btn-phone:hover {
    background-color: var(--color-primary-90) !important;
    color: var(--color-neutral-50) !important;
    outline: none !important;
}

.page-template-page-senda-para-mujeres .hero--gender-tag {
    text-transform: none;
    letter-spacing: normal;
    font-size: 15px;
    font-weight: 400;
    color: #635E54 !important;
}
.page-template-page-senda-para-mujeres .hero--gender-heading {
    font-weight: 400 !important;
}
.page-template-page-senda-para-mujeres .hero--gender-heading strong {
    font-weight: 600 !important; /* semibold: el destacado del titular del hero */
}
.page-template-page-senda-para-mujeres .hero--gender-subtext {
    font-weight: 400;
}

/* Trust badges: fila horizontal de 3 elementos, como la referencia */
.page-template-page-senda-para-mujeres .hero--gender-trust {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 24px;
}

/* CTAs con leyenda propia debajo de cada botón */
.page-template-page-senda-para-mujeres .hero-btns-row {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}
.page-template-page-senda-para-mujeres .hero-cta-item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
}
.page-template-page-senda-para-mujeres .hero-cta-caption {
    font-size: 12px;
    color: #8c8c96;
    font-weight: 500;
}

/* Imagen única con burbuja de chat, sustituye al collage de 4 fotos */
.page-template-page-senda-para-mujeres .hero--gender-images.hero-single-image {
    display: block;
    position: relative;
    width: 100%;
    max-width: 420px;
    height: 460px;
    margin-left: 60px;
    background: linear-gradient(135deg, #E7E1FA 0%, #D9CFF4 100%);
    border-radius: 32px;
    overflow: visible;
}
.page-template-page-senda-para-mujeres .hero-single-photo {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 12%;
    border-radius: 32px;
    display: block;
    box-shadow: 0 20px 45px rgba(14, 14, 144, 0.12);
}
.page-template-page-senda-para-mujeres .hero-chat-bubble {
    position: absolute;
    /* 236px = los -24 de antes + los 260 que pedía bajar. Arriba pisaba la cara
       de la foto nueva; a esta altura cae sobre el cuerpo. */
    top: 236px;
    right: -32px;
    max-width: 230px;
    margin: 0 !important;
}

@media (max-width: 920px) {
    .page-template-page-senda-para-mujeres .hero--gender-trust {
        justify-content: center;
    }
    .page-template-page-senda-para-mujeres .hero-btns-row {
        justify-content: center;
    }
    .page-template-page-senda-para-mujeres .hero-cta-item {
        align-items: center;
    }
    .page-template-page-senda-para-mujeres .hero--gender-images.hero-single-image {
        margin-left: 0;
        max-width: 320px;
        height: 380px;
    }
    .page-template-page-senda-para-mujeres .hero-chat-bubble {
        display: none;
    }
}

/* Imagen única de héroe (hombre) — mismo patrón que mujeres, tono azul */
.page-template-page-senda-para-hombres .hero--gender-images.hero-single-image {
    display: block;
    position: relative;
    width: 100%;
    max-width: 420px;
    height: 460px;
    margin-left: 60px;
    background: linear-gradient(135deg, #DCE7F2 0%, #C7DBEC 100%);
    border-radius: 32px;
    overflow: visible;
}
.page-template-page-senda-para-hombres .hero-single-photo {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 12%;
    border-radius: 32px;
    display: block;
    box-shadow: 0 20px 45px rgba(14, 14, 144, 0.12);
}
.page-template-page-senda-para-hombres .hero-chat-bubble {
    position: absolute;
    top: -24px;
    right: -32px;
    max-width: 230px;
    margin: 0 !important;
}

@media (max-width: 920px) {
    .page-template-page-senda-para-hombres .hero--gender-images.hero-single-image {
        margin-left: 0;
        max-width: 320px;
        height: 380px;
    }
    .page-template-page-senda-para-hombres .hero-chat-bubble {
        display: none;
    }
}

/* =============================================================
   SENDA PARA HOMBRES — hero (alineado a portada-2 / mujeres)
   ============================================================= */
/* Corrige el bug de .alignfull: .hero--gender fuerza width:100% !important,
   que rompe el margin-left/right en 50vw del breakout de ancho completo y
   deja la sección desplazada respecto al resto de secciones de la página. */
.page-template-page-senda-para-hombres .hero--gender.hero-white {
    width: auto !important;
    max-width: 100vw !important;
    background: #ffffff !important;
}

/* Botones del hero = botones estándar del sitio (buttons.css), sin el
   pill dorado/azul custom que traía .hero--gender-ctas. */
.page-template-page-senda-para-hombres .hero--gender-ctas .btn-primary,
.page-template-page-senda-para-hombres .hero--gender.hero-white .hero--gender-ctas .btn-primary {
    background-color: var(--color-brand) !important;
    border: none !important;
    color: var(--color-primary-40) !important;
    padding: 12px 20px !important;
    border-radius: var(--radius-md) !important;
    font-weight: var(--weight-medium) !important;
    font-size: var(--text-body) !important;
    box-shadow: none !important;
    min-height: 54px !important;
    min-width: 120px !important;
}
.page-template-page-senda-para-hombres .hero--gender-ctas .btn-primary:hover,
.page-template-page-senda-para-hombres .hero--gender.hero-white .hero--gender-ctas .btn-primary:hover {
    background-color: var(--color-brand-dark) !important;
    border-color: transparent !important;
    color: var(--color-primary-40) !important;
    transform: none !important;
    box-shadow: none !important;
}
.page-template-page-senda-para-hombres .hero--gender-ctas a.btn-secondary.btn-phone {
    background-color: var(--color-neutral-50) !important;
    color: var(--color-brand) !important;
    outline: 1px solid var(--color-primary-60) !important;
    outline-offset: -1px !important;
    border: none !important;
    padding: 12px 20px !important;
    border-radius: var(--radius-md) !important;
    font-weight: var(--weight-medium) !important;
    font-size: var(--text-body) !important;
    line-height: 1.2 !important;
    min-height: 54px !important;
    min-width: 120px !important;
    box-sizing: border-box !important;
}
.page-template-page-senda-para-hombres .hero--gender-ctas a.btn-secondary.btn-phone:hover {
    background-color: var(--color-primary-90) !important;
    color: var(--color-neutral-50) !important;
    outline: none !important;
}

.page-template-page-senda-para-hombres .hero--gender-tag {
    text-transform: none;
    letter-spacing: normal;
    font-size: 15px;
    font-weight: 400;
    color: #635E54 !important;
}
.page-template-page-senda-para-hombres .hero--gender-heading {
    font-weight: 400 !important;
}
.page-template-page-senda-para-hombres .hero--gender-heading strong {
    font-weight: 600 !important; /* semibold: el destacado del titular del hero */
}
.page-template-page-senda-para-hombres .hero--gender-subtext {
    font-weight: 400;
}

/* Trust badges: fila horizontal de 3 elementos, como la referencia */
.page-template-page-senda-para-hombres .hero--gender-trust {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 24px;
}

/* CTAs con leyenda propia debajo de cada botón */
.page-template-page-senda-para-hombres .hero-btns-row {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}
.page-template-page-senda-para-hombres .hero-cta-item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
}
.page-template-page-senda-para-hombres .hero-cta-caption {
    font-size: 12px;
    color: #8c8c96;
    font-weight: 500;
}

@media (max-width: 920px) {
    .page-template-page-senda-para-hombres .hero--gender-trust {
        justify-content: center;
    }
    .page-template-page-senda-para-hombres .hero-btns-row {
        justify-content: center;
    }
    .page-template-page-senda-para-hombres .hero-cta-item {
        align-items: center;
    }
}

/* =============================================================
   SENDA PARA HOMBRES — Ciencia del metabolismo masculino
   ("Por qué perder peso es diferente en los hombres")
   ============================================================= */
.colectivo-science {
    padding: var(--section-gap) var(--page-margin);
    background-color: var(--color-neutral-50);
}
.inner-colectivo-science {
    max-width: var(--container-desktop);
    margin-inline: auto;
}
.header-colectivo-science.senda-block-header {
    max-width: 700px;
    margin-inline: auto;
    margin-bottom: var(--space-10);
}
.science-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-6);
    margin-bottom: var(--space-10);
}
.science-card {
    background: #ffffff;
    border: 1px solid var(--color-neutral-200);
    border-radius: var(--radius-xl);
    padding: var(--space-6);
}
.science-card h3 {
    font-family: var(--font-body);
    font-size: 1.0625rem;
    font-weight: var(--weight-bold);
    color: var(--color-neutral-800);
    line-height: var(--leading-snug);
    margin: 0 0 var(--space-2);
}
.science-card p {
    font-size: var(--text-body);
    line-height: var(--leading-normal);
    color: var(--color-text-muted);
    margin: 0;
}
.process-diagram {
    background: #F7F9FE;
    border: 1px solid #DBE1F5;
    border-radius: var(--radius-xl);
    padding: var(--space-8);
    text-align: center;
}
.process-diagram h4 {
    font-family: var(--font-body);
    font-size: 1.125rem;
    font-weight: var(--weight-bold);
    color: var(--color-neutral-800);
    margin: 0 0 var(--space-6);
}
.diagram-flow {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-4);
    flex-wrap: wrap;
}
.diagram-step {
    background: #ffffff;
    border: 1px solid #DBE1F5;
    border-radius: var(--radius-md);
    padding: 12px 20px;
    font-size: 0.9375rem;
    font-weight: var(--weight-bold);
    color: var(--color-brand);
}
.diagram-step-final {
    background: var(--color-brand);
    color: #ffffff;
    border-color: var(--color-brand);
}
.diagram-arrow {
    color: var(--color-brand);
    font-size: 1.25rem;
    line-height: 1;
}
@media (max-width: 768px) {
    .science-grid {
        grid-template-columns: 1fr;
    }
    .diagram-flow {
        flex-direction: column;
    }
    .diagram-arrow {
        transform: rotate(90deg);
    }
}

/* =============================================================
   SENDA PARA HOMBRES — Riesgo cardiovascular y abordaje
   ("La ventana de oportunidad cardiovascular")
   ============================================================= */
.colectivo-preventive {
    padding: var(--section-gap) var(--page-margin);
    background-color: var(--color-neutral-100);
}
.preventive-grid {
    max-width: var(--container-desktop);
    margin-inline: auto;
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    gap: var(--space-10);
    align-items: start;
}
.preventive-eyebrow {
    display: block;
    color: var(--color-neutral-800);
    font-size: var(--text-small);
    font-weight: var(--weight-bold);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: var(--space-3);
}
.preventive-copy h2,
.preventive-copy h3 {
    font-family: var(--font-body);
    font-size: clamp(1.375rem, 2.5vw, 2rem);
    font-weight: var(--weight-regular);
    color: var(--color-neutral-800);
    line-height: var(--leading-snug);
    margin: 0 0 var(--space-4);
}
.preventive-copy p {
    font-size: var(--text-body);
    line-height: var(--leading-normal);
    color: var(--color-text-muted);
    margin: 0 0 var(--space-4);
}
.preventive-copy ul {
    margin: var(--space-4) 0 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}
.preventive-copy ul li {
    font-size: var(--text-body);
    line-height: var(--leading-normal);
    color: var(--color-text-muted);
    padding-left: var(--space-6);
    position: relative;
}
.preventive-copy ul li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0.55em;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--color-brand);
}
.preventive-copy ul li strong {
    color: var(--color-neutral-800);
}

.guia-respaldada-box {
    background: #ffffff;
    border: 1px solid var(--color-neutral-200);
    border-radius: var(--radius-xl);
    padding: var(--space-8);
}
.guia-respaldada-box .paso-icono {
    margin-bottom: var(--space-4);
}
.guia-respaldada-box h4 {
    font-family: var(--font-body);
    font-size: 1.0625rem;
    font-weight: var(--weight-bold);
    color: var(--color-neutral-800);
    margin: 0 0 var(--space-3);
}
.guia-respaldada-box p {
    font-size: var(--text-body);
    line-height: var(--leading-normal);
    color: var(--color-text-muted);
    margin: 0 0 var(--space-4);
}
.guia-respaldada-box p strong {
    color: var(--color-brand);
}
.guia-cita {
    border-top: 1px solid rgba(42, 40, 34, 0.08);
    padding-top: var(--space-4);
    font-size: var(--text-small);
    font-style: italic;
    color: var(--color-text-muted);
    line-height: var(--leading-normal);
}
@media (max-width: 768px) {
    .preventive-grid {
        grid-template-columns: 1fr;
    }
}

/* ==========================================================================
   NORMALIZACIÓN GLOBAL DE PESOS DE ENCABEZADO (petición cliente)
   H1/H2/H3 en Regular (400); el énfasis (strong/b y spans de énfasis de los
   títulos) en Semibold (600). El !important gana a las múltiples reglas de
   peso NO-important dispersas por los bloques; los pocos casos con !important
   de clase (hero) se sobreescriben aparte más abajo.
   ========================================================================== */
h1, h2, h3 {
    font-weight: 400 !important;
}
h1 strong, h1 b, h1 span,
h2 strong, h2 b, h2 span,
h3 strong, h3 b, h3 span {
    font-weight: 600 !important;
}
/* Hero de portada: su peso 500 lleva !important de clase, hay que igualar. */
.portada2-hero-heading {
    font-weight: 400 !important;
}
.portada2-hero-heading strong,
.portada2-hero-heading span {
    font-weight: 600 !important;
}

/* ==========================================================================
   MENÚ MÓVIL/TABLET de portada y landings al estilo de las páginas interiores
   (/prensa/): panel de fondo BLANCO en vez del crema #FAF6F0. El logo y el
   texto ya se muestran en oscuro en móvil (filter:none + colores oscuros).
   ========================================================================== */
@media (max-width: 1200px) {
    body.page-template-page-portada-2 #site-header .menu-main.open,
    body.page-template-page-senda-para-mujeres #site-header .menu-main.open,
    body.page-template-page-senda-para-hombres #site-header .menu-main.open {
        background-color: #ffffff !important;
    }
}

/* ==========================================================================
   HERO de la PORTADA en tablet/móvil (<=1200px)
   Antes se invertía a fondo BLANCO con texto oscuro. Se revierte: el azul de
   marca es el mismo en escritorio y en móvil, que es como debe verse.
   Lo que SÍ hace falta en este breakpoint es que la cabecera se lea sobre ese
   azul: logo en blanco y hamburguesa en blanco mientras el hero está detrás.
   ========================================================================== */
@media (max-width: 1200px) {
    /* El hero conserva el #334DCF global; aquí solo se asegura el contraste
       del texto que aquel bloque había puesto en oscuro. */
    .portada2-hero-tag { color: rgba(255,255,255,.85) !important; }
    .portada2-hero-heading { color: #ffffff !important; }
    .portada2-hero-heading strong { color: #ffffff !important; }
    .portada2-hero-subtext { color: rgba(255,255,255,.92) !important; }
    .portada2-hero-trust .trust-item { color: rgba(255,255,255,.92) !important; }

    /* Secundario de verdad: mismo tamaño y forma que el primario, pero
       contorneado en vez de relleno. Antes tenía border-width:0 y el color de
       borde no pintaba nada: se leía como un enlace suelto, no como un botón.
       Y con fondo blanco heredado + texto blanco, directamente no se veía. */
    .portada2-hero .hero-secondary-link {
        background: transparent !important;
        color: #ffffff !important;
        border: 1.5px solid rgba(255,255,255,.65) !important;
        border-radius: 12px !important;
        font-weight: 600 !important;
    }
    .portada2-hero .hero-secondary-link:hover,
    .portada2-hero .hero-secondary-link:active {
        background: rgba(255,255,255,.14) !important;
        border-color: #ffffff !important;
        color: #ffffff !important;
    }
}

/* ==========================================================================
   AJUSTES TOPBAR + HERO PORTADA/LANDINGS  (feedback usuario, jul 2026)
   ========================================================================== */

/* (1) TABLET (921–1200px): las tarjetas de acceso mujer/hombre dejan de
   solaparse con el texto y los CTAs del hero. El margin-top:-182px está
   calibrado para desktop (>1200) y a este ancho invadía el hero. */
@media (min-width: 921px) and (max-width: 1200px) {
    .page-template-page-portada-2 .gender-card {
        margin-top: 20px !important;
    }
    .page-template-page-portada-2 .portada2-hero {
        padding-bottom: 72px !important; /* al quitar el solape se recorta el hueco inferior */
    }
}

/* (2) TOPBAR de portada y landings SOLO EN MÓVIL (<=1200px): fondo BLANCO, logo
   NEGRO, icono NEGRO (antes el icono salía en azul #0E0E90, o blanco invisible
   sobre el hero blanco del móvil).
   En DESKTOP la portada NO lleva fondo blanco: mantiene su cabecera transparente
   con el logo y el icono en BLANCO sobre el hero azul (reglas previas 3893/3960/
   3963/6683/6689). Por eso este bloque va dentro de @media móvil. */
@media (max-width: 1200px) {
    body.page-template-page-portada-2 #site-header .inner-header-general,
    body.page-template-page-senda-para-mujeres #site-header .inner-header-general,
    body.page-template-page-senda-para-hombres #site-header .inner-header-general {
        background: #ffffff !important;
    }
    /* Logo negro */
    body.page-template-page-portada-2 #site-header .logo-header img,
    body.page-template-page-senda-para-mujeres #site-header .logo-header img,
    body.page-template-page-senda-para-hombres #site-header .logo-header img {
        filter: brightness(0) !important;
    }
    /* Hamburguesa negra: las 3 barras y la X del estado abierto */
    body.page-template-page-portada-2 #site-header .menu-toggle .hamburger,
    body.page-template-page-senda-para-mujeres #site-header .menu-toggle .hamburger,
    body.page-template-page-senda-para-hombres #site-header .menu-toggle .hamburger,
    body.page-template-page-portada-2.menu-open #site-header .menu-toggle .hamburger,
    body.page-template-page-senda-para-mujeres.menu-open #site-header .menu-toggle .hamburger,
    body.page-template-page-senda-para-hombres.menu-open #site-header .menu-toggle .hamburger {
        background: #1D1B16 !important;
    }
}
/* Logo negro del topbar de anclas de las landings (barra blanca, visible en
   desktop al scrollear). */
body.page-template-page-senda-para-mujeres .landing-anchor-nav__logo img,
body.page-template-page-senda-para-hombres .landing-anchor-nav__logo img {
    filter: brightness(0) !important;
}

/* (3) LANDINGS en móvil (<=900px): el topbar sticky de anclas NO aparece;
   solo queda la cabecera (#site-header con logo + hamburguesa). */
@media (max-width: 900px) {
    body.page-template-page-senda-para-mujeres .landing-anchor-nav,
    body.page-template-page-senda-para-hombres .landing-anchor-nav {
        display: none !important;
    }
}

/* ==========================================================================
   FIX cabecera móvil de portada/landings (feedback usuario)
   El #site-header en <=1200px estaba en #0E0E90 (azul), con línea de borde
   inferior y sombra. Se pinta de BLANCO y se quitan borde y sombra (plano).
   La cabecera (logo + hamburguesa) se MANTIENE STICKY (position:fixed de base).
   El único que NO debe salir en móvil es el topbar sticky de anclas
   (.landing-anchor-nav), ya oculto a <=900px arriba.
   ========================================================================== */
@media (max-width: 1200px) {
    /* Cabecera TRANSPARENTE sobre el hero azul y BLANCA al bajar.
       `.is-scrolled-cta` la pone el script del final de header.php a partir de
       80px de scroll; se reaprovecha aquí para no añadir otro listener. */
    body.page-template-page-portada-2 #site-header,
    body.page-template-page-senda-para-mujeres #site-header,
    body.page-template-page-senda-para-hombres #site-header {
        background: transparent !important;
        border-bottom: none !important;
        box-shadow: none !important;
        transition: background-color .22s ease, box-shadow .22s ease !important;
    }

    body.page-template-page-portada-2 #site-header.is-scrolled-cta,
    body.page-template-page-senda-para-mujeres #site-header.is-scrolled-cta,
    body.page-template-page-senda-para-hombres #site-header.is-scrolled-cta {
        background: #ffffff !important;
        box-shadow: 0 1px 4px rgba(0,0,0,.06) !important;
    }

    /* El fondo blanco vive en la píldora interior, no en el <header>: sin
       transparentarla también, el logo blanco quedaba invisible sobre ella. */
    body.page-template-page-portada-2 #site-header:not(.is-scrolled-cta) .inner-header-general,
    body.page-template-page-senda-para-mujeres #site-header:not(.is-scrolled-cta) .inner-header-general,
    body.page-template-page-senda-para-hombres #site-header:not(.is-scrolled-cta) .inner-header-general {
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
    }

    /* Sobre el azul, el logo y la hamburguesa en blanco. Al pasar a fondo
       blanco, oscuros. Sin esto el logo negro desaparece sobre el hero. */
    body.page-template-page-portada-2 #site-header:not(.is-scrolled-cta) .logo-header img,
    body.page-template-page-senda-para-mujeres #site-header:not(.is-scrolled-cta) .logo-header img,
    body.page-template-page-senda-para-hombres #site-header:not(.is-scrolled-cta) .logo-header img {
        filter: brightness(0) invert(1) !important;
    }

    body.page-template-page-portada-2 #site-header:not(.is-scrolled-cta) .menu-toggle .hamburger,
    body.page-template-page-portada-2 #site-header:not(.is-scrolled-cta) .menu-toggle .hamburger::before,
    body.page-template-page-portada-2 #site-header:not(.is-scrolled-cta) .menu-toggle .hamburger::after {
        background-color: #ffffff !important;
    }

    /* Con el menú abierto manda el panel: fondo, logo e icono legibles sobre
       el blanco. La regla de arriba pinta el icono en blanco mientras el hero
       azul está detrás; abierto el panel, ese mismo blanco lo hacía invisible. */
    body.menu-open.page-template-page-portada-2 #site-header,
    body.menu-open.page-template-page-senda-para-mujeres #site-header,
    body.menu-open.page-template-page-senda-para-hombres #site-header {
        background: #ffffff !important;
    }

    body.menu-open.page-template-page-portada-2 #site-header .inner-header-general,
    body.menu-open.page-template-page-senda-para-mujeres #site-header .inner-header-general,
    body.menu-open.page-template-page-senda-para-hombres #site-header .inner-header-general {
        background: #ffffff !important;
    }

    body.menu-open.page-template-page-portada-2 #site-header .logo-header img,
    body.menu-open.page-template-page-senda-para-mujeres #site-header .logo-header img,
    body.menu-open.page-template-page-senda-para-hombres #site-header .logo-header img {
        filter: brightness(0) !important;
    }

    /* La X de cerrar: oscura sobre el panel blanco. */
    body.menu-open.page-template-page-portada-2 #site-header .menu-toggle .hamburger,
    body.menu-open.page-template-page-senda-para-mujeres #site-header .menu-toggle .hamburger,
    body.menu-open.page-template-page-senda-para-hombres #site-header .menu-toggle .hamburger,
    body.menu-open.page-template-page-portada-2 #site-header .menu-toggle .hamburger::before,
    body.menu-open.page-template-page-portada-2 #site-header .menu-toggle .hamburger::after {
        background: #1D1B16 !important;
        background-color: #1D1B16 !important;
    }
}

/* ==========================================================================
   (Request 2) TOPBAR STICKY BLANCO estilo portada en el RESTO DEL SITIO
   (contenidos del programa, utilidades, blog, podcast, corporativo), SOLO móvil.
   El #site-header ya está fuera de flujo (position:absolute en interiores), así
   que pasar a fixed no tapa contenido nuevo; solo lo fija al hacer scroll.
   Excluidos: portada (ya lo tiene), formularios (.senda-forms-body y
   te-llamamos) y landings (mujeres/hombres/linktree/biolab), que llevan su
   propio tratamiento.
   ========================================================================== */
@media (max-width: 1200px) {
    body:not(.senda-forms-body):not(.page-template-page-portada-2):not(.page-template-page-te-llamamos):not(.page-template-page-senda-para-mujeres):not(.page-template-page-senda-para-hombres):not(.page-template-page-linktree):not(.page-template-page-senda-biolab) #site-header {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        background: #ffffff !important;
        border-bottom: none !important;
        box-shadow: none !important;
        z-index: 10000 !important;
    }
    body:not(.senda-forms-body):not(.page-template-page-portada-2):not(.page-template-page-te-llamamos):not(.page-template-page-senda-para-mujeres):not(.page-template-page-senda-para-hombres):not(.page-template-page-linktree):not(.page-template-page-senda-biolab) #site-header .logo-header img {
        filter: brightness(0) !important;
    }
    body:not(.senda-forms-body):not(.page-template-page-portada-2):not(.page-template-page-te-llamamos):not(.page-template-page-senda-para-mujeres):not(.page-template-page-senda-para-hombres):not(.page-template-page-linktree):not(.page-template-page-senda-biolab) #site-header .menu-toggle .hamburger {
        background: #1D1B16 !important;
    }
}

/* ==========================================================================
   MENÚ (drawer) — ACORDEÓN.
   El modo drill-down (entrar en un submenú y ocultar el resto) se retiró: las
   reglas vivían aquí. Ahora cada bloque se despliega en su sitio; los estilos
   del acordeón están más arriba (.mobile-menu-item.submenu-open) y el área de
   scroll con su indicador, en assets/css/header.css.
   ========================================================================== */

/* ==========================================================================
   Título de las páginas de calculadora: negro + destacado semibold (estilo
   global de títulos: base 400, destacado 600, color tinta).
   ========================================================================== */
.calculadora-header h1 {
    color: #1D1B16 !important;
    font-weight: 400 !important;
}
.calculadora-header h1 strong,
.calculadora-header h1 b {
    color: #1D1B16 !important;
    font-weight: 600 !important;
}

/* ==========================================================================
   CABECERA DE PÁGINA GLOBAL — .senda-page-header
   Cabecera unificada para las páginas de contenido (antes cada una tenía sus
   estilos inline en el H1/contenedor). Centrada, título grande base 400 con
   destacado 600, antetítulo y descripción. Cambiar aquí ajusta TODAS a la vez.
   NO se usa en formularios, landings ni portada.
   ========================================================================== */
.senda-page-header {
    background-color: #ffffff;
    border-bottom: 1px solid #E2DED4;
    padding: 48px var(--page-margin, 24px) 80px;
    text-align: center;
}
.senda-page-header .senda-page-header-inner {
    max-width: 800px;
    margin: 0 auto;
}
.senda-page-header .antetitulo,
.senda-page-header .senda-ph-eyebrow {
    display: block;
    color: #2A2822;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 16px;
    font-family: var(--font-body);
}
.senda-page-header h1 {
    color: #1D1B16;
    font-family: var(--font-heading);
    font-size: clamp(34px, 4vw, 48px);
    font-weight: 400;
    line-height: 1.15;
    margin: 0 0 16px;
}
.senda-page-header h1 strong,
.senda-page-header h1 b {
    font-weight: 600;
}
.senda-page-header p {
    font-size: 18px;
    line-height: 1.6;
    color: #635E54;
    max-width: 640px;
    margin: 0 auto;
}

/* ==========================================================================
   UNIFICACIÓN DE CABECERAS DE INTERIOR
   Todas las cabeceras bespoke de las plantillas PHP (prensa, talento, afiliados,
   empresas, newsletter, podcast, blog, calculadoras, FAQ, guía de estilo,
   menopausia) se alinean al MISMO aspecto que .senda-page-header. Editar la
   clase .senda-page-header de arriba ajusta también estas (mismos valores).
   Solo CSS -> reversible. NO afecta a formularios, landings ni portada.
   ========================================================================== */
.faq-hero-section,
.calculadora-header,
.press-hero-section,
.talent-hero-section,
.tech-hero-section,
.newsletter-hero-section,
.podcast-hero-section,
.noticias-hero,
.menopausia-hero,
.gs-header {
    background: #ffffff !important;
    background-image: none !important;
    border-bottom: 1px solid #E2DED4 !important;
    padding: 48px var(--page-margin, 24px) 80px !important;
    text-align: center !important;
    display: block !important;
    min-height: 0 !important;
    color: inherit !important;
}
/* Contenedor interno: una sola columna centrada con ancho de lectura. */
.faq-hero-section > *,
.calculadora-header > *,
.press-hero-section > *,
.talent-hero-section > *,
.tech-hero-section > *,
.newsletter-hero-section > *,
.podcast-hero-section > *,
.noticias-hero > *,
.menopausia-hero > *,
.gs-header > * {
    max-width: 800px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: auto !important;
    float: none !important;
    display: block !important;
    grid-template-columns: 1fr !important;
    text-align: center !important;
}
/* Título. */
.faq-hero-section h1, .calculadora-header h1, .press-hero-section h1,
.talent-hero-section h1, .tech-hero-section h1, .newsletter-hero-section h1,
.podcast-hero-section h1, .noticias-hero h1, .menopausia-hero h1, .gs-header h1 {
    color: #1D1B16 !important;
    font-family: var(--font-heading) !important;
    font-size: clamp(34px, 4vw, 48px) !important;
    font-weight: 400 !important;
    line-height: 1.15 !important;
    margin: 0 auto 16px !important;
    max-width: 800px !important;
}
.faq-hero-section h1 strong, .calculadora-header h1 strong, .press-hero-section h1 strong,
.talent-hero-section h1 strong, .tech-hero-section h1 strong, .newsletter-hero-section h1 strong,
.podcast-hero-section h1 strong, .noticias-hero h1 strong, .menopausia-hero h1 strong, .gs-header h1 strong,
.faq-hero-section h1 b, .press-hero-section h1 b, .tech-hero-section h1 b {
    font-weight: 600 !important;
}
/* Descripción. */
.faq-hero-section p, .calculadora-header p, .press-hero-section p,
.talent-hero-section p, .tech-hero-section p, .newsletter-hero-section p,
.podcast-hero-section p, .noticias-hero p, .menopausia-hero p, .gs-header p {
    font-size: 18px !important;
    line-height: 1.6 !important;
    color: #635E54 !important;
    max-width: 640px !important;
    margin: 0 auto 8px !important;
}
/* Antetítulo (todas las variantes de eyebrow). */
.faq-hero-section .faq-pre-titulo, .calculadora-header .antetitulo,
.press-hero-section .press-hero-tag, .talent-hero-section .talent-hero-tag,
.tech-hero-section .tech-hero-tag, .newsletter-hero-section .newsletter-hero-tag,
.podcast-hero-section .podcast-hero-tag, .noticias-hero .noticias-hero__pre,
.menopausia-hero .hero-tag, .gs-header .gs-hero__eyebrow {
    display: inline-block !important;
    background: none !important;
    color: #2A2822 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    margin: 0 0 16px !important;
    padding: 0 !important;
    border: none !important;
}

/* =====================================================================
   Fichas personales de equipo (.persona--ficha) — equipo-clinico y
   sobre-nosotros (shortcode [senda_equipo]). Diseño "CARD DEFAULT":
   foto (proporción del equipo clínico) / Nombre / Nº col. azul / Cargo.
   ===================================================================== */
.persona--ficha .persona-imagen {
    width: 100% !important;
    margin: 0 0 16px 0 !important;
    line-height: 0 !important;
}
.persona--ficha .persona-imagen .imagen {
    border-radius: 12px !important;
    overflow: hidden !important;
    margin: 0 !important;
}
.persona--ficha .persona-imagen img {
    width: 100% !important;
    height: 260px !important;
    object-fit: cover !important;
    border-radius: 12px !important;
}
.persona--ficha .persona-texto {
    display: flex !important;
    flex-direction: column !important;
    text-align: left !important;
    gap: 0 !important;
    padding: 0 !important;
}
.persona--ficha .titulo-item {
    font-size: 19px !important;
    font-weight: 700 !important;
    color: #1D1B16 !important;
    margin: 0 !important;
    font-family: 'Saans', sans-serif !important;
    line-height: 1.3 !important;
}
.persona--ficha .colegiado-item {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #334DCF !important;
    margin: 4px 0 0 !important;
    display: block !important;
    font-family: 'Saans', sans-serif !important;
    line-height: 1.4 !important;
}
.persona--ficha .persona-rol {
    font-size: 14px !important;
    color: #635E54 !important;
    margin: 8px 0 0 !important;
    display: block !important;
    font-family: 'Saans', sans-serif !important;
    line-height: 1.5 !important;
}
/* Descripción corta visible en la ficha (distinta según página: equipo-clínico /
   sobre-nosotros). Va bajo el cargo, algo más tenue. */
.persona--ficha .texto-item {
    font-size: 14px !important;
    color: #635E54 !important;
    margin: 8px 0 0 !important;
    font-family: 'Saans', sans-serif !important;
    line-height: 1.55 !important;
}
@media (max-width: 600px) {
    .persona--ficha .persona-imagen img { height: 220px !important; }
}

/* ── Tablas de bloque responsive (páginas legales y cualquier contenido) ──
   Antes se cortaban/desbordaban en móvil y tablet. Ahora la tabla scrollea
   horizontalmente dentro de su contenedor y nunca rompe el ancho de página. */
.wp-block-table {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
}
.wp-block-table table {
    width: 100%;
}
@media (max-width: 600px) {
    .wp-block-table table { min-width: 480px; }
    .wp-block-table td, .wp-block-table th { word-break: break-word; }
}