
@font-face {
    font-family: 'TT Hoves';
    src: url('../fonts/TT-Hoves-Light.otf') format('opentype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'TT Hoves';
    src: url('../fonts/TT-Hoves-Medium.otf') format('opentype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'TT Hoves';
    src: url('../fonts/TT-Hoves-Bold.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'TT Norms';
    src: url('../fonts/TTNorms-Regular.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'TT Norms';
    src: url('../fonts/TTNorms-Medium.otf') format('opentype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Outfit';
    src: url('../fonts/Outfit-VariableFont_wght.ttf') format('truetype');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

/* === HEADER & MENÚ === */

/* Botón "Escríbenos" dorado con bordes redondeados */
#header-outer .menu-button > a,
.menu-item.menu-button > a {
    background-color: #967E58 !important;
    color: #ffffff !important;
    border-radius: 25px !important;
    padding: 10px 28px !important;
    font-family: 'TT Hoves', sans-serif !important;
    font-weight: 500 !important;
    font-size: 11px !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    border: none !important;
    transition: all 0.3s ease !important;
    line-height: 1.4 !important;
}
#header-outer .menu-button > a:hover,
.menu-item.menu-button > a:hover {
    background-color: #7d6a4a !important;
    color: #ffffff !important;
}
/* Quitar underline animation del botón */
#header-outer .menu-button > a .menu-title-text {
    background-image: none !important;
}

/* Ocultar búsqueda y hamburguesa en desktop */
@media (min-width: 1000px) {
    #header-outer #search-btn,
    #header-outer .slide-out-widget-area-toggle {
        display: none !important;
    }
}

/* Links del menú — tipografía */
#header-outer .sf-menu > li > a .menu-title-text {
    font-family: 'TT Hoves', sans-serif !important;
    font-weight: 500 !important;
    font-size: 12px !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
}

/* Header transparente — texto blanco */
#header-outer[data-permanent-transparent="1"] .sf-menu > li > a {
    color: #ffffff !important;
}
#header-outer[data-permanent-transparent="1"] .sf-menu > li > a:hover {
    color: #967E58 !important;
}

/* Header fijo al scroll — texto oscuro */
#header-outer.scrolled-down .sf-menu > li > a,
#header-outer.fixed-menu .sf-menu > li > a,
body .fixed-menu #header-outer .sf-menu > li > a {
    color: #333333 !important;
}
#header-outer.scrolled-down .sf-menu > li > a:hover,
#header-outer.fixed-menu .sf-menu > li > a:hover {
    color: #967E58 !important;
}

/* === HOME PAGE === */

/* Fotos oficina - eliminar gaps entre filas */
.office-photos {
    margin-bottom: 0 !important;
}
.office-photos .vc_column-inner {
    padding: 0 !important;
}
.office-photos .wpb_single_image {
    margin-bottom: 0 !important;
}
.office-photos .wpb_single_image img {
    display: block;
    width: 100%;
}

/* Ampersand section */
.ampersand-section .wpb_single_image img {
    display: block;
    width: 100%;
}

/* Team member - nombres uppercase dorado */
body .nectar-team-member .team-member-name,
body .team_member_details .team_member_name,
body .nectar-team-member h4,
body .nectar-team-member h4 a {
    font-family: 'TT Hoves', sans-serif !important;
    font-weight: 500 !important;
    font-size: 12px !important;
    letter-spacing: 1.5px !important;
    text-transform: uppercase !important;
    color: #967E58 !important;
}

/* Team member - cargo */
body .nectar-team-member .team-member-position,
body .team_member_details .team_member_position {
    font-family: 'TT Norms', sans-serif !important;
    font-size: 12px !important;
    color: #999 !important;
}

/* Responsive - hero text */
@media (max-width: 768px) {
    .ampersand-section .vc_column_container:first-child {
        display: none;
    }
}

/* === PÁGINA ÁREAS DE PRÁCTICA === */

/* Card semi-transparente */
.areas-card .vc_column-inner {
    border-radius: 6px;
}

/* Iconos responsive */
@media (max-width: 768px) {
    .areas-card .vc_row-inner .vc_col-sm-6:last-child {
        text-align: left !important;
        margin-top: 15px;
    }
}


/* === FICHA DE EQUIPO (páginas individuales) ===
   Medidas tomadas 1:1 del Adobe XD "WEB DF&C_ABOGADOS" (lienzo 1920):
   banda superior 300px · card 333x829 en x=375.7 y=182 · panel 768x653 en x=737.7 y=328
   tipografías: panel TT Hoves Light/Bold 21px · contacto TT Hoves 18px               */

.dfyc-ficha {
    position: relative;
    background: #ffffff;
    overflow: hidden;
    padding-bottom: 130px;
}

.dfyc-ficha__banda {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 300px;
    background: #203B4D url('https://dfyc.cl/wp-content/uploads/2026/08/banda-torres-ficha.jpg') center top / cover no-repeat;
}

.dfyc-ficha__wrap {
    position: relative;
    z-index: 2;
    max-width: 1130px;
    margin: 0 auto;
    padding-top: 182px;
    display: flex;
    align-items: flex-start;
    gap: 29px;
}

/* ---- card oscura con el retrato ---- */
.dfyc-ficha__card {
    flex: 0 0 333px;
    width: 333px;
    background: #151F2B;
    padding-bottom: 36px;
}

.dfyc-ficha__foto {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 332 / 457;
    object-fit: cover;
    margin: 0;
}

.dfyc-ficha__id {
    padding: 52px 28px 0;
}

.dfyc-ficha__nombre {
    margin: 0;
    font-family: 'TT Hoves', sans-serif;
    font-weight: 300;
    font-size: 15px;
    line-height: 1.1;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #BFAF9C;
}

.dfyc-ficha__cargo {
    margin: 6px 0 0;
    font-family: 'TT Hoves', sans-serif;
    font-weight: 300;
    font-size: 12px;
    line-height: 1.1;
    letter-spacing: 1px;
    color: #BFAF9C;
    opacity: .75;
}

.dfyc-ficha__contacto {
    margin-top: 132px;
    text-align: center;
    padding: 0 20px;
}

.dfyc-ficha__contacto p {
    margin: 0;
    letter-spacing: 1.5px;
    color: #BFAF9C;
}

.dfyc-ficha__fono {
    font-family: 'TT Hoves', sans-serif;
    font-weight: 700;
    font-size: 18px;
    line-height: 1.35;
}

.dfyc-ficha__mail {
    font-family: 'TT Hoves', sans-serif;
    font-weight: 300;
    font-size: 18px;
    line-height: 1.35;
}

.dfyc-ficha__contacto a,
.dfyc-ficha__contacto a:hover {
    color: #BFAF9C;
    text-decoration: none;
    border: 0;
}

.dfyc-ficha__contacto a:hover {
    color: #967E58;
}

.dfyc-ficha__amp {
    margin: 46px 0 0;
    text-align: center;
    font-family: 'Minion Pro', 'Outfit', Georgia, serif;
    font-weight: 400;
    font-size: 40px;
    line-height: 1;
    color: #BFAF9C;
}

/* ---- panel claro con el contenido ---- */
.dfyc-ficha__panel {
    flex: 1 1 auto;
    min-width: 0;
    margin-top: 146px;
    background: #F5F5F5;
    min-height: 653px;
    padding: 65px 51px 60px;
}

.dfyc-ficha__panel h2 {
    margin: 68px 0 36px;
    font-family: 'TT Hoves', sans-serif;
    font-weight: 700;
    font-size: 21px;
    line-height: 1.2;
    letter-spacing: 0;
    text-transform: none;
    color: #151F2B;
}

.dfyc-ficha__panel h2:first-child {
    margin-top: 0;
}

.dfyc-ficha__panel p {
    margin: 0 0 25px;
    font-family: 'TT Hoves', sans-serif;
    font-weight: 300;
    font-size: 21px;
    line-height: 1.2;
    color: #000000;
}

.dfyc-ficha__panel p:last-child {
    margin-bottom: 0;
}

/* ---- rectángulos decorativos dorados (posiciones exactas del XD) ---- */
.dfyc-ficha__deco {
    position: absolute;
    top: 0;
    left: 50%;
    width: 1130px;
    height: 1100px;
    margin-left: -565px;
    pointer-events: none;
    z-index: 1;
}

.dfyc-ficha__deco span {
    position: absolute;
    display: block;
    border: 0.5px solid #967E58;
}

.dfyc-ficha__deco span:nth-child(1) { left: -571.7px; top: 352.6px; width: 330.6px; height: 172.6px; }
.dfyc-ficha__deco span:nth-child(2) { left: -544.4px; top: 387.3px; width: 348px;   height: 254.8px; }
.dfyc-ficha__deco span:nth-child(3) { left: -297.4px; top: 514.7px; width: 205.7px; height: 111.6px; }
.dfyc-ficha__deco span:nth-child(4) { left: -280.3px; top: 537.2px; width: 216.6px; height: 164.8px; }
.dfyc-ficha__deco span:nth-child(5) { left: 1221.2px; top: 464.9px; width: 296.2px; height: 225.5px; }
.dfyc-ficha__deco span:nth-child(6) { left: 1259.3px; top: 568.4px; width: 281.5px; height: 152.7px; }
.dfyc-ficha__deco span:nth-child(7) { left: 1402.6px; top: 546.9px; width: 476.1px; height: 348.5px; }
.dfyc-ficha__deco span:nth-child(8) { left: 1463.8px; top: 706.9px; width: 452.3px; height: 236.1px; }

/* ---- responsive ---- */
@media (max-width: 1500px) {
    .dfyc-ficha__deco { display: none; }
}

@media (max-width: 1200px) {
    .dfyc-ficha__wrap {
        max-width: none;
        padding: 182px 40px 0;
    }
    .dfyc-ficha__panel {
        padding: 55px 45px 50px;
    }
    .dfyc-ficha__panel h2,
    .dfyc-ficha__panel p {
        font-size: 19px;
    }
}

@media (max-width: 990px) {
    .dfyc-ficha__wrap {
        display: block;
        padding-top: 150px;
        max-width: 620px;
    }
    .dfyc-ficha__card {
        width: 100%;
        max-width: 333px;
        margin: 0 auto;
    }
    .dfyc-ficha__panel {
        margin-top: 40px;
        min-height: 0;
    }
    .dfyc-ficha__contacto {
        margin-top: 60px;
    }
    .dfyc-ficha__banda {
        height: 240px;
    }
    .dfyc-ficha {
        padding-bottom: 80px;
    }
}

@media (max-width: 690px) {
    .dfyc-ficha__wrap {
        padding: 130px 22px 0;
    }
    .dfyc-ficha__banda {
        height: 200px;
    }
    .dfyc-ficha__panel {
        padding: 40px 28px 36px;
    }
    .dfyc-ficha__panel h2 {
        font-size: 17px;
        margin: 46px 0 24px;
    }
    .dfyc-ficha__panel p {
        font-size: 17px;
        margin-bottom: 20px;
    }
    .dfyc-ficha__id {
        padding: 40px 24px 0;
    }
    .dfyc-ficha__contacto {
        margin-top: 44px;
    }
    .dfyc-ficha__amp {
        margin-top: 32px;
        font-size: 34px;
    }
}

/* --- ajustes de integración con Salient (medidos en navegador contra el XD) --- */

/* La ficha rompe el contenedor de Salient para que la banda de torres quede
   a sangre completa y pase por detrás del header transparente. */
.dfyc-ficha {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

/* El XD no lleva breadcrumbs; además empujaban la ficha 67px hacia abajo y
   dejaban el menú blanco sobre fondo blanco. */
body:has(.dfyc-ficha) .container.main-content > .row > p.yoast {
    display: none !important;
}

/* Sin margen superior de la fila para que la banda arranque en el borde. */
body:has(.dfyc-ficha) .container-wrap {
    padding-top: 0 !important;
}

/* Afinado del ritmo vertical de la card contra las medidas del XD */
.dfyc-ficha__foto {
    aspect-ratio: 333 / 456;
}

.dfyc-ficha__cargo {
    margin-top: 4px;
    opacity: .8;
}

.dfyc-ficha__contacto {
    margin-top: 127px;
}

.dfyc-ficha__fono,
.dfyc-ficha__mail {
    line-height: 1.28;
}

.dfyc-ficha__amp {
    margin-top: 46px;
}

.dfyc-ficha__card {
    padding-bottom: 26px;
}

@media (max-width: 990px) {
    .dfyc-ficha__contacto {
        margin-top: 60px;
    }
}

/* Minion Pro: es la tipografía del ampersand del logo, y la ficha del XD lo repite
   al pie de la card. Sin embeberla, el visitante veía una serif genérica. */
@font-face {
    font-family: 'Minion Pro';
    src: url('../fonts/MinionPro-Regular.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

/* Header sobre la banda de torres: en el XD lleva un velo #203B4D al 65% y
   separadores verticales entre los ítems del menú. Sin el velo, el logo y el
   menú (blancos) quedaban ilegibles sobre el azul claro de la banda.
   Acotado a las fichas para no tocar el header de la portada. */
html body:has(.dfyc-ficha) #header-outer,
html body:has(.dfyc-ficha) #header-outer.transparent,
html body:has(.dfyc-ficha) #header-outer.transparent .container {
    background-color: rgba(32, 59, 77, 0.65) !important;
}

html body:has(.dfyc-ficha) #header-outer.transparent .container {
    background-color: transparent !important;
}

/* El logo blanco viene con opacity:0 desde la configuración de Salient (queda
   invisible en TODO el sitio, no solo aquí). Se fuerza visible en las fichas
   mientras se corrige la opción del tema. */
html body:has(.dfyc-ficha) #header-outer #logo img.dark-version,
html body:has(.dfyc-ficha) #header-outer img.stnd {
    opacity: 1 !important;
}

body:has(.dfyc-ficha) #header-outer.transparent #top nav > ul > li > a {
    color: #ffffff !important;
}

body:has(.dfyc-ficha) #header-outer.transparent #top nav > ul > li:not(.menu-button) {
    border-left: 1px solid rgba(255, 255, 255, 0.22);
}

body:has(.dfyc-ficha) #header-outer.transparent #top nav > ul > li:not(.menu-button) > a {
    padding-left: 26px;
    padding-right: 26px;
}
