/* ==========================================================================
   Personalizaciones propias (cargado DESPUÉS del CSS del tema yogax).
   ========================================================================== */

/* --- Header de escritorio: logo + menú juntos y CENTRADOS en la misma línea --- */
#masthead.header .navigation .row.v-align {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
}
#masthead.header .navigation .logo-wrapper {
    padding: 0 !important;
    margin: 0 70px 0 0 !important;   /* separación entre logo y menú */
    flex: 0 0 auto !important;
    width: auto !important;
}
#masthead.header .navigation .col-md-12 {
    width: auto !important;
    max-width: none !important;
    flex: 0 0 auto !important;
    padding: 0 !important;
}
#masthead.header .navigation .nav-menu.pull-right {
    float: none !important;
    text-align: center !important;
    padding: 0 !important;
    border-right: 0 !important;
    border-left: 0 !important;
}
#masthead.header .navigation .nav-menu > ul {
    display: flex;
    align-items: center;
    margin: 0;
}

/* ==========================================================================
   HERO / SLIDER del inicio (propio, reemplaza a Slider Revolution)
   ========================================================================== */
.dp-hero {
    position: relative;
    width: 100%;
    height: 600px;            /* valor por defecto; la altura real la pone el panel (estilo inline) */
    overflow: hidden;
    background: #e3edf6;            /* color de espera mientras carga la foto */
}
.dp-hero__slides { position: absolute; inset: 0; }
.dp-hero__slide {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center 62%;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 1s ease-in-out;
    z-index: 1;
}
.dp-hero__slide.is-active { opacity: 1; visibility: visible; z-index: 2; }
.dp-hero__inner {
    width: 100%;
    max-width: 1170px;
    margin: 0 auto;
    padding: 0 30px;
    text-align: left;
}
.dp-hero__text {
    font-family: 'Quicksand', 'Source Sans Pro', sans-serif;
    font-weight: 400;
    color: #434e5f;
    font-size: clamp(28px, 4.2vw, 50px);
    line-height: 1.2;
    margin: 0 0 28px;
    max-width: 620px;
}
.dp-hero__btn {
    display: inline-block;
    background: #e2002a;
    color: #fff;
    padding: 13px 34px;
    border-radius: 30px;
    font-weight: 600;
    font-size: 13px;
    letter-spacing: .12em;
    text-transform: uppercase;
    text-decoration: none;
    transition: background .2s ease, transform .2s ease;
}
.dp-hero__btn:hover { background: #b80022; color: #fff; text-decoration: none; transform: translateY(-1px); }

/* Bullets centrados abajo: vacío = inactivo, relleno = activo, hover = rojo */
.dp-hero__bullets {
    position: absolute;
    left: 0; right: 0; bottom: 26px;
    display: flex;
    justify-content: center;
    gap: 14px;
    z-index: 5;
}
.dp-hero__bullet {
    width: 14px; height: 14px;
    padding: 0;
    border-radius: 50%;
    border: 2px solid #434e5f;     /* círculo */
    background: transparent;        /* vacío = inactivo */
    cursor: pointer;
    transition: background .2s ease, border-color .2s ease, transform .2s ease;
}
.dp-hero__bullet.is-active { background: #434e5f; }            /* relleno = activo */
.dp-hero__bullet:hover { background: #e2002a; border-color: #e2002a; transform: scale(1.1); }  /* hover = rojo */

@media (max-width: 767px) {
    .dp-hero { height: 70vh !important; min-height: 380px; }
    .dp-hero__text { font-size: clamp(24px, 7vw, 34px); }
}

/* Visual Composer: mostrar siempre el contenido aunque la animación de fade
   no se dispare (evita páginas "en blanco"). */
.wpb_animate_when_almost_visible { opacity: 1 !important; }

/* Sección de contacto del inicio: columnas a la misma altura para que las
   líneas (border superior/inferior) queden alineadas en las 3 columnas. */
.wpb_row.vc_column-gap-25 {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
}
.wpb_row.vc_column-gap-25 > .wpb_column {
    display: flex;
}
.wpb_row.vc_column-gap-25 > .wpb_column > .vc_column-inner {
    width: 100%;
}

/* Páginas internas (no inicio): cabecera con fondo blanco y menú oscuro legible. */
body.dp-inner #masthead .navigation { background: #fff !important; }
body.dp-inner #masthead .navigation .nav-menu > ul > li > a,
body.dp-inner #masthead .navigation .nav-menu > ul > li > a.current { color: #434e5f !important; }
body.dp-inner #masthead .navigation .nav-menu > ul > li > a:hover { color: #e2002a !important; }