/* ==========================================================================
BVB - PAGINAS INTERIORES
Cabecera de pagina, banner, layout a dos columnas, equipo, especialistas
y contacto.
========================================================================== */

/* --------------------------- CABECERA DE PAGINA -------------------------- */
.bvb-page-head { padding-block: clamp(2.25rem, 4vw, 3.75rem) 0; }
.bvb-page-head--inline { padding-block: 0; margin-bottom: clamp(2rem, 4vw, 3.5rem); }
/* El texto arranca pegado al borde del contenedor (alineado con el logo). */
.bvb-page-head .bvb-container { padding-inline: var(--gutter); }
.bvb-page-head__title {
    color: var(--bvb-gold);
    font-weight: var(--fw-regular);
    font-size: clamp(1.9rem, 2.2vw, 3.15rem);
    line-height: 1.32;
    letter-spacing: 0;
    margin: 0;
    max-width: 26ch;
}
/* Icono sobre el titular, en la ficha de area. */
.bvb-page-head__icon {
    display: block;
    color: var(--bvb-gold);
    margin-bottom: clamp(.75rem, 1.3vw, 1.5rem);
}
.bvb-page-head .bvb-label { margin-bottom: .9rem; }
.bvb-banner { line-height: 0; }
.bvb-banner__img {
    width: 100%;
    height: clamp(170px, 24vw, 320px);
    object-fit: cover;
    filter: grayscale(1) contrast(1.06);
}
.bvb-page-body { padding-block: clamp(2.25rem, 4vw, 4rem); }
.bvb-entry__content { max-width: 82ch; }
.bvb-entry__content > *:first-child { margin-top: 0; }
.bvb-entry__content ul, .bvb-entry__content ol { padding-left: 1.25rem; }
.bvb-entry__content img { height: auto; }
.bvb-entry__content--intro { margin-bottom: clamp(2rem, 4vw, 3rem); }
.bvb-entry__thumb { margin: 0 0 2.5rem; }
.bvb-entry__thumb img { width: 100%; }

/* ------------------------- LAYOUT A DOS COLUMNAS ------------------------ */
.bvb-page-split-wrap { padding-block: clamp(2.5rem, 5vw, 5rem); }
.bvb-split {
    display: grid;
    grid-template-columns: 1.4fr 1.0fr;
    gap: clamp(2rem, 4.2vw, 4.2rem);
    align-items: start;
}
.bvb-split__content { min-width: 0; }
.bvb-split__content .bvb-page-head { padding-block: 0; margin-bottom: 2rem; }

/* AJUSTE: La imagen comienza al mismo nivel que el primer párrafo */
.bvb-split__media { 
    margin: 0; 
    padding-top: clamp(4rem, 15vw, 27rem); /* Compensa la altura del header */
}
.bvb-split__media img { width: 100%; height: auto; }

@media (max-width: 960px) {
    .bvb-split { grid-template-columns: minmax(0, 1fr); }
    .bvb-split__media { 
        order: -1; 
        padding-top: 0; /* Reset en móvil */
    }
}





/* ------------------------------- EQUIPO --------------------------------- */
/* Rejilla tipo ladrillo: foto + panel dorado alternando filas, como el diseño. */
.bvb-team-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); }
.bvb-team-card { grid-column: span 2; }
.bvb-team-card__link { display: grid; grid-template-columns: 1fr 1fr; }

.bvb-team-card__media {
    margin: 0;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background-color: var(--bvb-grey-100);
}
.bvb-team-card__media img { 
    width: 100%; 
    height: 100%; 
    object-fit: cover; 
    transition: transform .7s cubic-bezier(.4, 0, .2, 1); 
}
.bvb-team-card:hover .bvb-team-card__media img { 
    transform: scale(1.05); 
}

.bvb-team-card__placeholder {
    display: block;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(135deg, var(--bvb-grey-200) 0%, var(--bvb-grey-300) 100%);
}

/* Panel dorado con transición para el efecto hover */
.bvb-team-card__panel {
    display: flex; /* Corregido: tenía "f lex" */
    flex-direction: column;
    justify-content: center;
    gap: .4rem;
    aspect-ratio: 1 / 1;
    padding: clamp(.75rem, 1.6vw, 1.4rem);
    background-color: var(--bvb-gold);
    color: var(--bvb-white); /* Corregido: tenía "wh ite" */
    transition: filter 0.4s ease, background-color 0.4s ease; 
}

.bvb-team-card__name { 
    font-family: var(--font-display); 
    font-size: clamp(.95rem, 1.15vw, 1.3rem); 
    line-height: 1.25; 
    display: inline-block; /* Necesario para que el transform funcione */
    transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94); 
}

/* Nota bajo el nombre: «(Socio Internacional)» */
.bvb-team-card__note {
    display: block;
    margin-top: .25rem;
    font-family: var(--font-display);
    font-style: italic;
    font-size: clamp(.7rem, .78vw, .9rem);
    line-height: 1.3;
    color: rgba(255, 255, 255, .92); /* Corregido: tenía "r gba" */
}

/* =========================================
   EFECTOS DINÁMICOS AL PASAR EL CURSOR (HOVER)
   ========================================= */
.bvb-team-card:hover .bvb-team-card__panel {
    filter: brightness(0.92); /* Oscurece sutilmente el fondo dorado */
}

.bvb-team-card:hover .bvb-team-card__name {
    transform: translateX(12px); /* Desplaza el nombre hacia la derecha */
}

/* Filas alternas invertidas (patrón cada 6 tarjetas / 2 filas). */
.bvb-team-card:nth-child(6n + 4) .bvb-team-card__link,
.bvb-team-card:nth-child(6n + 5) .bvb-team-card__link,
.bvb-team-card:nth-child(6n + 6) .bvb-team-card__link { direction: rtl; }

.bvb-team-card:nth-child(6n + 4) .bvb-team-card__link  > *,
.bvb-team-card:nth-child(6n + 5) .bvb-team-card__link  > *,
.bvb-team-card:nth-child(6n + 6) .bvb-team-card__link  > * { direction: ltr; }





/* ------------------------- GRUPOS POR CATEGORIA ------------------------- */
.bvb-team-group + .bvb-team-group { margin-top: clamp(3rem, 6vw, 6.5rem); }
.bvb-team-group__title {
    margin: 0 0 clamp(1.5rem, 2.6vw, 2.6rem);
    font-family: var(--font-display);
    font-weight: var(--fw-regular);
    font-size: clamp(1.6rem, 2.5vw, 3rem);
    line-height: 1.1;
    color: var(--bvb-gold);
}
@media (max-width: 960px) {
    .bvb-team-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .bvb-team-card { grid-column: span 2; }
}
@media (max-width: 620px) {
    .bvb-team-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* --------------------------- ESPECIALISTAS ------------------------------ */
.bvb-subtitle {
    font-family: var(--font-display);
    font-size: clamp(1.25rem, 2vw, 1.75rem);
    font-weight: var(--fw-regular);
    color: var(--bvb-ink);
    margin: 0 0 1.5rem;
}
.bvb-specialists-section { padding-block: clamp(2rem, 4vw, 3.5rem); }
.bvb-specialists { display: flex; flex-wrap: wrap; }
.bvb-specialist { margin: 0; }
.bvb-specialist__link { display: grid; grid-template-columns: 96px minmax(160px, 1fr); }
.bvb-specialist__media { margin: 0; width: 96px; background-color: var(--bvb-grey-100); }
.bvb-specialist__media img { width: 100%; height: 100%; aspect-ratio: 1 / 1; object-fit: cover; }
.bvb-specialist__panel {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: .2rem;
    padding: 1rem 1.15rem;
    background-color: var(--bvb-grey-100);
    transition: var(--transition);
}
.bvb-specialist__link:hover .bvb-specialist__panel { background-color: var(--bvb-grey-200); }
.bvb-specialist__name { font-family: var(--font-display); font-size: var(--fs-base); color: var(--bvb-ink); }
.bvb-specialist__role { font-family: var(--font-sans); font-size: var(--fs-xs); color: var(--bvb-grey-700); }

/* ------------------------ AREAS DE PRACTICA (rejilla) ------------------- */
/* Rejilla de areas: 4 columnas de ~325 px con 93 px de hueco y 116 px entre
filas sobre 1920, medido en el mockup del listado. */
.bvb-areas-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    column-gap: clamp(1.5rem, 4.84vw, 5.8rem);
    row-gap: clamp(2rem, 6.04vw, 7.25rem);
}
/* Linea dorada bajo cada area (el diseno la lleva). */
.bvb-areas-grid .bvb-practice__link {
    padding-bottom: clamp(1.5rem, 5.78vw, 7rem);
    border-bottom: 1px solid var(--bvb-gold);
}
.bvb-areas-grid .bvb-practice__icon { margin-bottom: clamp(.9rem, 1.6vw, 1.9rem); }
@media (max-width: 1200px) { .bvb-areas-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 900px)  { .bvb-areas-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px)  { .bvb-areas-grid { grid-template-columns: minmax(0, 1fr); } }







/* ------------------------------ FICHA PERSONA --------------------------- */
/* ------------------------------ FICHA PERSONA --------------------------- */
.bvb-persona { padding-block: clamp(2.25rem, 4vw, 3.75rem) clamp(3rem, 6vw, 5rem); }

.bvb-persona__category {
    margin: 0 0 clamp(1.75rem, 3vw, 3rem);
    font-family: var(--font-display);
    font-weight: var(--fw-regular);
    font-size: clamp(1.8rem, 2.9vw, 3.5rem);
    line-height: 1.1;
    color: var(--bvb-gold);
}

.bvb-persona__grid {
    display: grid;
    grid-template-columns: minmax(0, 390px) minmax(0, 1fr);
    gap: clamp(2rem, 5vw, 5.5rem);
    align-items: start;
}

.bvb-persona__photo { margin: 0; overflow: hidden; }
.bvb-persona__photo img { display: block; width: 100%; height: auto; }

.bvb-persona__name {
    margin: 0;
    padding: clamp(.9rem, 1.4vw, 1.4rem) clamp(1rem, 1.6vw, 1.6rem);
    background-color: var(--bvb-gold);
    color: var(--bvb-white);
    font-family: var(--font-display);
    font-size: clamp(1rem, 1.3vw, 1.5rem);
    line-height: 1.25;
}
.bvb-persona__name::before { content: "\203A\00a0 "; }

.bvb-persona__note {
    display: block;
    margin-top: .25rem;
    font-size: .8em;
    font-style: italic;
    color: rgba(255, 255, 255, .92);
}

.bvb-persona__main { display: flex; flex-direction: column; }

/* --- ENLACES DE CONTACTO --- */
/* --- ENLACES DE CONTACTO --- */
.bvb-persona__links {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: clamp(1.5rem, 3vw, 3rem);
    margin: clamp(2rem, 3.5vw, 3.5rem) 0 0;
    padding: 0;
    list-style: none;
}

.bvb-persona__links li + li {
    border-left: 1px solid var(--bvb-gold);
    padding-left: clamp(1.5rem, 3vw, 3rem);
}

.bvb-persona__links a {
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    font-family: var(--font-sans);
    font-size: var(--fs-base);
    color: var(--bvb-ink);
    text-decoration: none;
    transition: color 0.3s ease;
}
.bvb-persona__links a:hover { color: var(--bvb-gold); }

/* Ícono de LinkedIn más grande */
.bvb-persona__links .bvb-si--linkedin {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px;
    border-radius: 6px;
    background-color: var(--bvb-gold);
    color: var(--bvb-white);
    line-height: 0;
}
.bvb-persona__links .bvb-si--linkedin svg {
    width: 32px;
    height: 32px;
}

/* Ícono de CV más grande */
.bvb-persona__links a svg {
    width: 28px;
    height: 28px;
}

/* Estilo cursivo para el email */
.bvb-persona__email {
    font-style: italic;
    font-family: var(--font-display);
    font-size: clamp(1rem, 1.6vw, 1.25rem);
}





@media (max-width: 900px) {
    .bvb-persona__grid { grid-template-columns: minmax(0, 1fr); }
}

.bvb-single-persona__role {
    margin: 1rem 0 0;
    font-family: var(--font-sans);
    font-size: var(--fs-sm);
    letter-spacing: var(--ls-wide);
    text-transform: uppercase;
    color: var(--bvb-grey-700);
}

.bvb-persona-areas { margin-top: 2.5rem; }
.bvb-tag-list { 
    list-style: none; margin: 0; padding: 0; 
    display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; 
    font-family: var(--font-sans); font-size: var(--fs-sm); 
}
.bvb-tag-list a { color: var(--bvb-ink); }
.bvb-tag-list a:hover { color: var(--bvb-gold); }







/* --------------------------------- CONTACTO ----------------------------- */
.bvb-contact__grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(2rem, 5vw, 5rem); align-items: start; }
.bvb-contact__title {
    font-family: var(--font-sans);
    font-size: var(--fs-xs);
    font-weight: var(--fw-bold);
    letter-spacing: var(--ls-label);
    text-transform: uppercase;
    color: var(--bvb-ink);
    margin: 0 0 1rem;
    padding-bottom: .65rem;
    border-bottom: 1px solid var(--bvb-grey-300);
}
.bvb-contact__info > .bvb-contact__title:not(:first-child) { margin-top: 2.25rem; }
.bvb-social--contact a { color: var(--bvb-gold); }
.bvb-social--contact a:hover { color: var(--bvb-gold-dark); }
.bvb-form__status {
    margin: 0 0 1.5rem;
    padding: 1rem 1.25rem;
    background-color: var(--bvb-grey-050);
    border-left: 3px solid var(--bvb-gold);
    font-family: var(--font-sans);
    font-size: var(--fs-sm);
    color: var(--bvb-ink);
}
.bvb-form__status--error { border-left-color: #B3261E; }
.bvb-form__status p:last-child { margin-bottom: 0; }
.bvb-form__hint { margin: .4rem 0 0; font-family: var(--font-sans); font-size: var(--fs-xs); color: var(--bvb-grey-700); }
.bvb-form__field--error input,
.bvb-form__field--error textarea { border-color: #B3261E; }
.bvb-form__captcha { display: none !important; }
.bvb-form__submit { margin-top: .5rem; }
.bvb-form__submit .bvb-btn { min-width: 200px; }
@media (max-width: 900px) { .bvb-contact__grid { grid-template-columns: minmax(0, 1fr); } }

/* ------------------------------- ENTRADA -------------------------------- */
.bvb-single__thumb { margin: 0 0 3rem; line-height: 0; }
.bvb-single__thumb img { width: 100%; }
.bvb-post-nav {
    display: flex;
    justify-content: space-between;
    gap: 1.5rem;
    margin-top: 3.5rem;
    padding-top: 1.75rem;
    border-top: 1px solid var(--bvb-grey-200);
    font-family: var(--font-sans);
    font-size: var(--fs-sm);
}
.bvb-post-nav > div { max-width: 46%; }
.bvb-post-nav__next { margin-left: auto; text-align: right; }
.bvb-post-nav a { color: var(--bvb-ink); }
.bvb-post-nav a:hover { color: var(--bvb-gold); }

/* ------------------------------ COMENTARIOS ----------------------------- */
.bvb-comments { padding-block: clamp(2rem, 4vw, 3.5rem); }
.bvb-comments__title { font-size: var(--fs-xl); }
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
    width: 100%;
    padding: .9rem 1rem;
    font-family: var(--font-display);
    border: 1px solid var(--bvb-grey-300);
    background-color: var(--bvb-white);
}
.comment-form input:focus, .comment-form textarea:focus { outline: none; border-color: var(--bvb-gold); }
.comment-form .submit {
    padding: .95rem 1.65rem;
    background-color: var(--bvb-gold);
    border: 1px solid var(--bvb-gold);
    color: var(--bvb-white);
    font-family: var(--font-sans);
    font-size: var(--fs-xs);
    font-weight: var(--fw-bold);
    letter-spacing: var(--ls-label);
    text-transform: uppercase;
    cursor: pointer;
}

/* ==========================================================================
AJUSTES DETALLE DE ÁREA DE PRÁCTICA (single-bvb_area.php)
========================================================================== */

/* 1. Más espacio entre "ÁREAS DE PRÁCTICA" y el título dorado */
.bvb-page-head--inline .bvb-label--muted {
    margin-bottom: 2rem; /* Aumentado de 0.9rem a 2rem */
}

/* 2. Asegurar que imagen y texto comiencen al mismo nivel */
.bvb-split {
    align-items: start; /* Ya está, pero reforzamos */
}

.bvb-split__content .bvb-page-head {
    padding-block: 0;
    margin-bottom: 2.5rem; /* Espacio entre header y contenido */
}

/* 3. Texto justificado en todo el contenido */
.bvb-entry__content {
    text-align: justify;
    text-justify: inter-word;
    hyphens: auto;
}

.bvb-entry__content p {
    text-align: justify;
    margin-bottom: 1.5rem;
    line-height: 1.7;
}

/* Ajuste responsive para móviles */
@media (max-width: 960px) {
    .bvb-page-head--inline .bvb-label--muted {
        margin-bottom: 1.5rem;
    }
    
    .bvb-split__content .bvb-page-head {
        margin-bottom: 2rem;
    }
}