/* =========================================
   YAXCHÉ V7
   Futurista + organizado + fondo dinámico
========================================= */

:root {
    --yx7-forest: #173F35;
    --yx7-forest-deep: #102E27;
    --yx7-gold: #C89B4A;
    --yx7-beige: #E9DDC5;
    --yx7-cream: #C89B4A;
    --yx7-earth: #75543A;

    --yx7-text: #173F35;
    --yx7-muted: #75543A;
    --yx7-line: rgba(23, 63, 53, .14);
    --yx7-glass: rgba(247, 244, 236, .74);
    --yx7-glass-strong: rgba(236, 247, 242, 0.88);

    --yx7-bg-x: 0px;
    --yx7-bg-y: 0px;
    --yx7-grid-y: 0px;
    --yx7-glow-x: 0px;
    --yx7-glow-y: 0px;
}


/* =========================================
   1. BASE
========================================= */

.yx5-shell {
    background: var(--yx7-cream);
    color: var(--yx7-text);
}

.yx5-shell * {
    box-sizing: border-box;
}

.yx5-main {
    position: relative;
    z-index: 1;
}

.yx5-main > section,
.yx5-main > div {
    position: relative;
    z-index: 1;
}


/* =========================================
   2. FONDO GLOBAL CON IMAGEN YAXCHÉ
========================================= */

.yx5-atmosphere {
    position: fixed;
    inset: 0;
    overflow: hidden;

    background:
        linear-gradient(
            180deg,
            #F7F4EC 0%,
            #E9DDC5 40%,
            #F7F4EC 100%
        );
}


/* IMAGEN GLOBAL DE FONDO */

.yx5-atmosphere::before {
    content: "";
    position: absolute;
    inset: -8%;

    background:
        linear-gradient(
            rgba(23, 63, 53, 0.58),
            rgba(23, 63, 53, 0.58)
        ),
        url('/images/fondo-1.jpg')
        center center / cover no-repeat;

    opacity: 1;

    transform:
        translate3d(
            var(--yx7-bg-x),
            var(--yx7-bg-y),
            0
        )
        scale(1.08);

    will-change: transform;

    filter:
        saturate(1.02)
        contrast(1.03);
}


/* CAPA FUTURISTA */

.yx5-atmosphere::after {

    content: "";

    position: absolute;

    inset: 0;

    background:

        radial-gradient(
            circle at 15% 20%,
            rgba(200, 155, 74, .18),
            transparent 28%
        ),

        radial-gradient(
            circle at 85% 75%,
            rgba(23, 63, 53, .14),
            transparent 30%
        ),

        linear-gradient(
            120deg,
            rgba(23, 63, 53, .04),
            transparent 30%,
            rgba(200, 155, 74, .05) 70%,
            transparent 100%
        );

    pointer-events: none;
}


.yx5-atmo-light,
.yx5-atmo-warm,
.yx5-atmo-dark {

    opacity: 1 !important;

    mix-blend-mode: normal;
}


.yx5-atmo-light {

    background:

        radial-gradient(
            circle at 10% 15%,
            rgba(23, 63, 53, .12),
            transparent 32%
        ),

        radial-gradient(
            circle at 90% 80%,
            rgba(200, 155, 74, .12),
            transparent 32%
        ),

        transparent !important;
}


.yx5-atmo-warm {

    background:

        radial-gradient(
            circle at 88% 18%,
            rgba(200, 155, 74, .14),
            transparent 25%
        ),

        radial-gradient(
            circle at 12% 84%,
            rgba(117, 84, 58, .08),
            transparent 28%
        ),

        transparent !important;
}


.yx5-atmo-dark {

    background:

        radial-gradient(
            circle at 18% 22%,
            rgba(23, 63, 53, .18),
            transparent 25%
        ),

        radial-gradient(
            circle at 82% 76%,
            rgba(200, 155, 74, .10),
            transparent 25%
        ),

        transparent !important;
}


.yx5-orb-one,
.yx5-orb-two,
.yx5-orb-three {
    opacity: .85;
}


.yx5-orb-one {

    background:
        radial-gradient(
            circle,
            rgba(23, 63, 53, .16),
            transparent 72%
        );
}


.yx5-orb-two {

    background:
        radial-gradient(
            circle,
            rgba(200, 155, 74, .16),
            transparent 72%
        );
}


.yx5-orb-three {

    background:
        radial-gradient(
            circle,
            rgba(117, 84, 58, .10),
            transparent 72%
        );
}


/* GRID FUTURISTA SUTIL */

.yx6-texture {

    inset: 0;

    opacity: .10;

    background-image:

        linear-gradient(
            to right,
            rgba(23, 63, 53, .09) 1px,
            transparent 1px
        ),

        linear-gradient(
            to bottom,
            rgba(23, 63, 53, .06) 1px,
            transparent 1px
        );

    background-size:
        60px 60px;

    transform:
        translateY(
            var(--yx7-grid-y)
        );

    will-change: transform;
}


.yx6-beam {

    inset: -20%;

    background:

        radial-gradient(
            circle at 50% 50%,
            rgba(255, 244, 210, .22),
            transparent 35%
        );

    transform:
        translate3d(
            var(--yx7-glow-x),
            var(--yx7-glow-y),
            0
        );

    will-change: transform;
}


/* =========================================
   3. NAVBAR NUEVO, MÁS ROBUSTO Y FUTURISTA
========================================= */

.yx6-header {

    top: 12px;

    width:
        min(
            1380px,
            calc(100% - 34px)
        );
}


.yx6-header.is-scrolled {

    top: 8px;

    width:
        min(
            1260px,
            calc(100% - 24px)
        );
}


.yx6-topline {

    min-height: 34px;

    padding:
        8px 28px;

    border-radius:
        18px 18px 0 0;

    background:
        linear-gradient(
            90deg,
            var(--yx7-forest-deep),
            var(--yx7-forest)
        );

    color:
        var(--yx7-cream);

    border:
        1px solid
        rgba(200, 155, 74, .18);

    border-bottom:
        none;

    font-size:
        9px;

    font-weight:
        700;

    letter-spacing:
        1.7px;
}


.yx6-topline a {
    color: #F1D39D;
}


.yx6-dock {

    min-height: 90px;

    padding:
        13px 22px;

    background:
        var(--yx7-glass);

    backdrop-filter:
        blur(18px)
        saturate(1.1);

    border:
        1px solid
        rgba(23, 63, 53, .10);

    border-top:
        none;

    border-radius:
        0 0 24px 24px;

    box-shadow:

        0 20px 65px
        rgba(16, 46, 39, .16),

        inset 0 1px 0
        rgba(255,255,255,.45);
}


.yx6-header.is-scrolled .yx6-dock {

    min-height:
        74px;

    border-radius:
        18px;

    border-top:
        1px solid
        rgba(23, 63, 53, .10);

    background:
        rgba(247, 244, 236, .92);
}


.yx6-dock::after {

    content: "";

    position:
        absolute;

    inset:
        1px;

    border-radius:
        inherit;

    pointer-events:
        none;

    background:

        linear-gradient(
            120deg,
            rgba(255,255,255,.30),
            transparent 24%,
            transparent 76%,
            rgba(200,155,74,.08)
        );
}


/* LOGO */

.yx6-brand {
    gap: 14px;
}


.yx6-brand-emblem {

    width: 50px;
    height: 50px;

    font-size: 27px;

    background:

        linear-gradient(
            135deg,
            var(--yx7-forest),
            #285949
        );

    color:
        var(--yx7-gold);

    box-shadow:

        0 10px 30px
        rgba(23,63,53,.18),

        inset 0 0 0 1px
        rgba(255,255,255,.08);
}


.yx6-brand-name strong {

    font-size:
        30px;

    color:
        var(--yx7-forest);
}


.yx6-brand-name small {

    color:
        var(--yx7-earth);

    font-size:
        8px;

    letter-spacing:
        1.3px;
}


/* BLOQUE DE ENLACES MÁS GRUESO */

.yx6-nav {

    gap:
        12px;

    background:
        rgba(255,255,255,.42);
    border:
        1px solid
        rgba(23,63,53,.09);

    border-radius:
        999px;

    padding:
        8px 16px;

    box-shadow:
        inset 0 1px 0
        rgba(255,255,255,.35);
}


.yx6-nav-link {

    padding:
        11px 16px;

    border-radius:
        999px;

    color:
        var(--yx7-forest);

    font-size:
        12px;

    font-weight:
        700;

    transition:

        background .25s,

        color .25s,

        transform .25s;
}


.yx6-nav-link::after {
    display: none;
}


.yx6-nav-link:hover,
.yx6-nav-link[aria-current="page"],
.yx6-explore[open] > summary {

    background:
        rgba(23, 63, 53, .08);

    color:
        var(--yx7-forest);

    transform:
        translateY(-1px);
}


.yx6-chevron {
    color:
        var(--yx7-gold);
}


/* MEGAMENÚ MÁS ORDENADO */

.yx6-megamenu {

    width:
        min(
            1080px,
            calc(100vw - 42px)
        );

    border-radius:
        22px;

    background:
        rgba(247, 244, 236, .97);

    backdrop-filter:
        blur(20px);

    border:
        1px solid
        rgba(23, 63, 53, .12);

    box-shadow:
        0 34px 70px
        rgba(16, 46, 39, .22);

    overflow:
        hidden;
}


.yx6-mega-lead {

    background:

        linear-gradient(
            180deg,
            rgba(200, 155, 74, .18),
            rgba(233, 221, 197, .70)
        ),

        var(--yx7-beige);

    padding:
        38px;
}


.yx6-mega-lead h2 {

    color:
        var(--yx7-forest);

    font-size:
        34px;
}


.yx6-mega-lead p {
    color:
        var(--yx7-earth);
}


.yx6-overline {
    color:
        var(--yx7-earth);
}


.yx6-mega-all {

    color:
        var(--yx7-forest);

    border-bottom-color:
        var(--yx7-gold);
}


.yx6-mega-categories {

    padding:
        26px 32px;

    background:
        rgba(255,255,255,.60);
}


.yx6-mega-categories a {

    border-bottom-color:
        rgba(23,63,53,.10);
}


.yx6-mega-categories a strong {

    color:
        var(--yx7-forest);
}


.yx6-mega-categories a span:first-child {

    color:
        var(--yx7-gold);
}


.yx6-mega-feature {

    background:

        linear-gradient(
            rgba(53, 104, 91, 0.116),
            rgba(23, 63, 53, 0.329)
        ),

        url('/images/fondo-1.jpg')
        center / cover no-repeat;
}


/* BOTONES DEL NAVBAR */

.yx6-actions {
    gap: 12px;
}


.yx6-explore-button {

    min-height:
        48px;

    padding:
        5px 5px 5px 18px;

    border-radius:
        999px;

    background:

        linear-gradient(
            135deg,
            var(--yx7-forest),
            #245444
        );

    color:
        var(--yx7-cream);

    box-shadow:
        0 12px 28px
        rgba(23,63,53,.16);
}


.yx6-explore-arrow {

    width: 36px;
    height: 36px;

    background:
        var(--yx7-gold);

    color:
        var(--yx7-forest);
}


.yx6-menu-trigger {

    width: 48px;
    height: 48px;

    border-radius:
        50%;

    border:
        1px solid
        rgba(23,63,53,.18);

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

    backdrop-filter:
        blur(10px);
}


.yx6-menu-trigger:hover {

    background:
        rgba(233, 221, 197, .80);
}


.yx6-trigger-lines span {
    background:
        var(--yx7-forest);
}


/* DRAWER */

.yx6-drawer-backdrop {

    background:
        rgba(10, 28, 23, .68);

    backdrop-filter:
        blur(10px);
}


.yx6-drawer {

    background:

        linear-gradient(
            180deg,
            rgba(23,63,53,.98),
            rgba(16,46,39,.98)
        );

    color:
        var(--yx7-cream);
}


.yx6-drawer-close {

    background:
        var(--yx7-gold);

    color:
        var(--yx7-forest);
}


.yx6-drawer-label,
.yx6-drawer-body nav a small,
.yx6-drawer-footer a {

    color:
        #E8C988;
}


/* =========================================
   4. ORGANIZACIÓN GENERAL DE LA PÁGINA
========================================= */


/* ESPACIADOS MÁS PAREJOS */

.yx5-intro,
.yx5-categories,
.yx5-featured,
.yx5-process,
.yx5-contact {

    padding-top:
        90px;

    padding-bottom:
        90px;
}


/* CONTENEDORES TIPO PANEL */

.yx5-search-section .yx5-container,
.yx5-intro .yx5-container,
.yx5-categories .yx5-container,
.yx5-featured .yx5-container,
.yx5-process .yx5-container,
.yx5-contact .yx5-container {

    position:
        relative;

    padding:
        clamp(
            24px,
            3.5vw,
            42px
        );

    border-radius:
        28px;

    background:
        rgba(247, 244, 236, .56);

    backdrop-filter:
        blur(12px);

    border:
        1px solid
        rgba(23, 63, 53, .09);

    box-shadow:

        0 18px 45px
        rgba(16, 46, 39, .08),

        inset 0 1px 0
        rgba(255,255,255,.36);
}


/* HERO NO VA EN PANEL */

.yx5-hero .yx5-container {

    background:
        transparent !important;

    border:
        none !important;

    box-shadow:
        none !important;

    padding:
        0;
}


/* TÍTULOS MÁS ORGANIZADOS */

.yx5-section-heading,
.yx5-search-heading,
.yx5-process-heading {

    margin-bottom:
        30px;
}


.yx5-intro h2,
.yx5-section-heading h2,
.yx5-process-heading h2,
.yx5-contact h2,
.yx5-about-content h2 {

    color:
        var(--yx7-forest);

    line-height:
        1.18;
}


.yx5-intro h2 em,
.yx5-section-heading h2 em,
.yx5-process-heading h2 em {

    color:
        var(--yx7-earth);
}


/* SEARCH */

.yx5-search-panel {

    border-top:
        4px solid
        var(--yx7-gold);

    border-radius:
        22px;

    background:
        var(--yx7-glass-strong);

    box-shadow:
        0 24px 65px
        rgba(16, 46, 39, .12);
}


.yx5-search-heading h2 {

    color:
        var(--yx7-forest);
}


.yx5-search-aside {

    color:
        var(--yx7-earth);
}


.yx5-search-tabs {

    border-bottom-color:
        rgba(23,63,53,.12);
}


.yx5-search-tab {

    color:
        var(--yx7-earth);
}


.yx5-search-tab.is-active,
.yx5-search-tab:hover {

    color:
        var(--yx7-forest);

    border-bottom-color:
        var(--yx7-gold);
}


.yx5-search-field {

    border-radius:
        16px;

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

    border-color:
        rgba(23,63,53,.09);
}


.yx5-search-submit {

    border-radius:
        16px;

    background:
        var(--yx7-forest);

    color:
        var(--yx7-cream);
}


/* HERO MÁS FUTURISTA */

.yx5-hero {

    background:
        var(--yx7-forest-deep);

    overflow:
        hidden;
}


.yx5-hero-image {

    background:

        linear-gradient(
            rgba(23,63,53,.24),
            rgba(23,63,53,.20)
        ),

        url('/images/fondo-1.jpg')
        center / cover no-repeat;

    opacity:
        .95;
}


.yx5-hero-shade {

    background:

        linear-gradient(
            90deg,
            rgba(16, 46, 39, .86),
            rgba(23, 63, 53, .58) 56%,
            rgba(23, 63, 53, .18) 100%
        );
}


.yx5-hero-copy h1 em,
.yx5-contact h2 em,
.yx5-about-content h2 em {

    color:
        #EBCF97;
}


.yx5-hero-editorial {

    background:
        rgba(247, 244, 236, .10);

    border:
        1px solid
        rgba(255,255,255,.18);

    border-radius:
        20px;
}


/* CATEGORÍAS */

.yx5-categories {

    background:
        transparent;
}


.yx5-category {

    border-radius:
        24px;

    border:
        1px solid
        rgba(255,255,255,.10);

    overflow:
        hidden;

    box-shadow:
        0 16px 45px
        rgba(16, 46, 39, .12);
}


.yx5-category::after {

    background:

        linear-gradient(
            180deg,
            rgba(23,63,53,.18),
            rgba(23,63,53,.06) 35%,
            rgba(16,46,39,.94)
        );
}


.yx5-category-content > span {

    color:
        #F0D8A8;
}


.yx5-category-arrow {

    border-color:
        rgba(255,255,255,.60);

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

    backdrop-filter:
        blur(8px);
}


.yx5-category:hover
.yx5-category-arrow {

    background:
        var(--yx7-gold);

    color:
        var(--yx7-forest);
}


/* BANDA */

.yx5-brand-break {

    background:

        linear-gradient(
            90deg,
            rgba(23,63,53,.92),
            rgba(36,92,77,.90)
        );

    border-top:
        1px solid
        rgba(200,155,74,.20);

    border-bottom:
        1px solid
        rgba(200,155,74,.20);
}


/* FEATURED */

.yx5-featured {

    background:
        transparent;
}


.yx5-featured-filter {

    border-radius:
        999px;

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

    border-color:
        rgba(23,63,53,.10);

    color:
        var(--yx7-forest);
}


.yx5-featured-filter.is-active,
.yx5-featured-filter:hover {

    background:
        var(--yx7-forest);

    color:
        var(--yx7-cream);
}


.yx5-carousel-controls button {

    border-radius:
        50%;

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

    border-color:
        rgba(23,63,53,.12);
}


.yx5-property-card {

    border-radius:
        24px;

    overflow:
        hidden;

    border-color:
        rgba(23,63,53,.10);

    background:
        rgba(247, 244, 236, .92);

    box-shadow:
        0 18px 45px
        rgba(16, 46, 39, .08);
}


.yx5-property-image {

    background:
        #E8E1D2;
}


.yx5-property-badge {

    border-radius:
        999px;

    background:
        var(--yx7-forest);

    color:
        var(--yx7-cream);
}


.yx5-property-arrow {

    background:
        var(--yx7-gold);

    color:
        var(--yx7-forest);
}


.yx5-property-footer strong {

    color:
        var(--yx7-forest);
}


/* ABOUT */

.yx5-about {

    background:
        rgba(23, 63, 53, .92);

    border-top:
        1px solid
        rgba(200,155,74,.18);

    border-bottom:
        1px solid
        rgba(200,155,74,.18);
}


.yx5-about-photo-caption span {

    color:
        #EBCF97;
}


/* PROCESS */

.yx5-process {

    background:
        transparent;
}


.yx5-process-grid {

    gap:
        16px;
}


.yx5-process-item {

    border:
        1px solid
        rgba(23,63,53,.10)
        !important;

    border-radius:
        22px;

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

    backdrop-filter:
        blur(10px);

    box-shadow:
        0 14px 40px
        rgba(16, 46, 39, .06);
}


.yx5-process-symbol {

    border-color:
        rgba(23,63,53,.12);

    background:
        rgba(255,255,255,.40);
}


/* CONTACT */

.yx5-contact {

    background:
        transparent;
}


.yx5-contact-grid {

    align-items:
        stretch;
}


.yx5-contact-grid > div:first-child,
.yx5-contact-panel {

    border-radius:
        24px;
}


.yx5-contact-grid > div:first-child {

    background:

        linear-gradient(
            135deg,
            rgba(23,63,53,.96),
            rgba(36,92,77,.90)
        );

    padding:
        clamp(
            24px,
            3vw,
            40px
        );

    color:
        var(--yx7-cream);

    border:
        1px solid
        rgba(200,155,74,.16);
}


.yx5-contact-panel {

    background:
        rgba(247, 244, 236, .90);

    border:
        1px solid
        rgba(23,63,53,.10);

    color:
        var(--yx7-forest);

    box-shadow:
        0 16px 40px
        rgba(16, 46, 39, .08);
}


.yx5-contact-panel > span {

    color:
        var(--yx7-earth);
}


.yx5-contact-panel a {

    color:
        var(--yx7-forest);

    border-bottom-color:
        var(--yx7-gold);
}


.yx5-contact-panel small {

    color:
        var(--yx7-earth);
}


/* FOOTER */

.yx5-footer {

    background:
        rgba(16, 46, 39, .97);
}


/* BOTÓN VOLVER ARRIBA */

.yx5-back-top {

    background:
        var(--yx7-gold);

    color:
        var(--yx7-forest);

    border:
        1px solid
        rgba(23,63,53,.18);
}


/* =========================================
   5. CATÁLOGO Y DETALLE
========================================= */

.yx5-inner .yx5-main {

    padding-top:
        125px;
}


.yx5-inner .page-banner {

    background:

        linear-gradient(
            135deg,
            rgba(23,63,53,.96),
            rgba(36,92,77,.92)
        );
}


.yx5-inner .catalog-section,
.yx5-inner .detail-section {

    background:
        transparent;
}


.yx5-inner .catalog-filters,
.yx5-inner .detail-aside,
.yx5-inner .property-card {

    border-radius:
        22px;

    background:
        rgba(247, 244, 236, .86);

    backdrop-filter:
        blur(10px);

    border:
        1px solid
        rgba(23,63,53,.10);

    box-shadow:
        0 16px 45px
        rgba(16, 46, 39, .06);
}


.yx5-inner .catalog-filters {

    border-top:
        4px solid
        var(--yx7-gold);
}


.yx5-inner .property-info strong,
.yx5-inner .detail-price {

    color:
        var(--yx7-forest);
}


/* =========================================
   6. RESPONSIVE
========================================= */

@media (
    max-width: 1180px
) {

    .yx6-nav {

        gap:
            8px;

        padding-inline:
            10px;
    }


    .yx6-nav-link {

        padding:
            10px 12px;
    }


    .yx6-brand-name strong {

        font-size:
            26px;
    }

}


@media (
    max-width: 1080px
) {

    .yx6-nav {

        display:
            none;
    }


    .yx6-megamenu {

        display:
            none;
    }


    .yx6-dock {

        justify-content:
            space-between;
    }


    .yx5-search-section .yx5-container,
    .yx5-intro .yx5-container,
    .yx5-categories .yx5-container,
    .yx5-featured .yx5-container,
    .yx5-process .yx5-container,
    .yx5-contact .yx5-container {

        padding:
            24px;
    }

}


@media (
    max-width: 760px
) {

    .yx6-header {

        top:
            8px;

        width:
            calc(100% - 18px);
    }


    .yx6-header.is-scrolled {

        width:
            calc(100% - 14px);

        top:
            6px;
    }


    .yx6-topline {

        display:
            none;
    }


    .yx6-dock,
    .yx6-header.is-scrolled .yx6-dock {

        min-height:
            72px;

        padding:
            10px 14px;

        border-radius:
            18px;

        border-top:
            1px solid
            rgba(23,63,53,.10);
    }


    .yx6-brand-emblem {

        width:
            40px;

        height:
            40px;

        font-size:
            22px;
    }


    .yx6-brand-name strong {

        font-size:
            22px;
    }


    .yx6-brand-name small {

        font-size:
            6px;
    }


    .yx6-explore-button {

        display:
            none;
    }


    .yx6-menu-trigger {

        width:
            44px;

        height:
            44px;
    }


    .yx6-drawer {

        width:
            100%;

        padding:
            24px;
    }


    .yx6-drawer-body nav a {

        font-size:
            23px;
    }


    .yx5-inner .yx5-main {

        padding-top:
            86px;
    }


    .yx5-intro,
    .yx5-categories,
    .yx5-featured,
    .yx5-process,
    .yx5-contact {

        padding-top:
            70px;

        padding-bottom:
            70px;
    }

}


@media (
    prefers-reduced-motion: reduce
) {

    .yx5-atmosphere::before,
    .yx6-texture,
    .yx6-beam {

        transform:
            none !important;

        transition:
            none !important;
    }

}


/* ==========================================
   YAXCHÉ — INICIO CON 3 DESTACADAS
========================================== */

.yx9-featured {

    padding:
        110px 0;

    background:
        rgba(247, 244, 236, .28);
}


.yx9-section-heading {

    display:
        flex;

    align-items:
        end;

    justify-content:
        space-between;

    gap:
        35px;

    margin-bottom:
        45px;
}


.yx9-section-heading h2 {

    font-family:
        var(
            --yx5-serif,
            Georgia,
            serif
        );

    font-size:
        clamp(
            38px,
            5vw,
            64px
        );

    font-weight:
        400;

    line-height:
        1.2;

    color:
        #173F35;

    margin:
        15px 0;
}


.yx9-section-heading h2 em {

    color:
        #75543A;

    font-weight:
        400;
}


.yx9-section-heading p {

    color:
        #75543A;

    font-size:
        13px;

    line-height:
        1.8;
}


.yx9-all-link {

    flex-shrink:
        0;

    color:
        #173F35;

    border-bottom:
        1px solid
        #C89B4A;

    padding-bottom:
        10px;

    font-size:
        12px;

    font-weight:
        700;
}


.yx9-property-grid {

    display:
        grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        );

    gap:
        24px;
}


.yx9-property {

    min-width:
        0;

    overflow:
        hidden;

    background:
        rgba(247, 244, 236, .94);

    border:
        1px solid
        rgba(23, 63, 53, .12);

    border-radius:
        18px;

    box-shadow:
        0 18px 48px
        rgba(23, 63, 53, .08);

    transition:
        transform .35s ease,
        box-shadow .35s ease;
}


.yx9-property:hover {

    transform:
        translateY(-8px);

    box-shadow:
        0 28px 55px
        rgba(23, 63, 53, .16);
}


.yx9-property > a {

    display:
        block;

    height:
        100%;

    color:
        #173F35;
}


.yx9-property-image {

    position:
        relative;

    height:
        310px;

    overflow:
        hidden;

    background:
        #E9DDC5;
}


.yx9-property-image img {

    display:
        block;

    width:
        100%;

    height:
        100%;

    object-fit:
        cover;

    transition:
        transform .65s ease;
}


.yx9-property:hover img {

    transform:
        scale(1.07);
}


.yx9-placeholder {

    display:
        grid;

    place-items:
        center;

    height:
        100%;

    color:
        #75543A;

    font-size:
        12px;
}


.yx9-property-tag {

    position:
        absolute;

    top:
        18px;

    left:
        18px;

    padding:
        9px 13px;

    border-radius:
        4px;

    background:
        #173F35;

    color:
        #F7F4EC;

    font-size:
        9px;

    font-weight:
        700;

    letter-spacing:
        1.3px;
}


.yx9-property-arrow {

    position:
        absolute;

    right:
        18px;

    bottom:
        18px;

    display:
        grid;

    place-items:
        center;

    width:
        44px;

    height:
        44px;

    border-radius:
        50%;

    background:
        #C89B4A;

    color:
        #173F35;

    font-size:
        21px;
}


.yx9-property-content {

    padding:
        27px;
}


.yx9-property-location {

    font-size:
        10px;

    font-weight:
        700;

    letter-spacing:
        1px;

    color:
        #75543A;
}


.yx9-property-content h3 {

    min-height:
        66px;

    margin:
        12px 0 20px;

    font-family:
        var(
            --yx5-serif,
            Georgia,
            serif
        );

    font-size:
        25px;

    font-weight:
        400;

    line-height:
        1.35;

    color:
        #173F35;
}


.yx9-property-meta {

    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        10px;

    padding-bottom:
        22px;
}


.yx9-property-meta span {

    padding:
        7px 11px;

    border:
        1px solid
        rgba(23, 63, 53, .14);

    border-radius:
        30px;

    color:
        #75543A;

    font-size:
        10px;
}


.yx9-property-bottom {

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    flex-wrap:
        wrap;

    gap:
        12px;

    padding-top:
        20px;

    border-top:
        1px solid
        rgba(23, 63, 53, .13);
}


.yx9-property-bottom strong {

    font-size:
        15px;

    color:
        #173F35;
}


.yx9-property-bottom > span {

    font-size:
        11px;

    font-weight:
        700;
}


.yx9-featured-footer {

    display:
        flex;

    justify-content:
        space-between;

    align-items:
        center;

    flex-wrap:
        wrap;

    gap:
        20px;

    margin-top:
        50px;

    padding:
        26px 0;

    border-top:
        1px solid
        rgba(23, 63, 53, .20);

    border-bottom:
        1px solid
        rgba(23, 63, 53, .20);
}


.yx9-featured-footer > span {

    font-size:
        10px;

    letter-spacing:
        1.6px;

    font-weight:
        700;

    color:
        #75543A;
}


.yx9-featured-footer a {

    display:
        flex;

    align-items:
        center;

    gap:
        25px;

    font-size:
        12px;

    font-weight:
        700;

    color:
        #173F35;
}


.yx9-empty {

    padding:
        65px 25px;

    text-align:
        center;

    background:
        rgba(247, 244, 236, .82);

    border:
        1px solid
        rgba(23, 63, 53, .13);

    border-radius:
        20px;
}


.yx9-empty > span {

    font-size:
        38px;

    color:
        #C89B4A;
}


.yx9-empty h3 {

    font-family:
        var(
            --yx5-serif,
            Georgia,
            serif
        );

    font-size:
        29px;

    font-weight:
        400;

    color:
        #173F35;

    margin:
        15px 0;
}


.yx9-empty p {

    font-size:
        13px;

    color:
        #75543A;

    margin-bottom:
        25px;
}


@media (
    max-width: 950px
) {

    .yx9-property-grid {

        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }

}


@media (
    max-width: 650px
) {

    .yx9-featured {

        padding:
            75px 0;
    }


    .yx9-section-heading {

        flex-direction:
            column;

        align-items:
            flex-start;
    }


    .yx9-property-grid {

        grid-template-columns:
            1fr;
    }


    .yx9-property-image {

        height:
            290px;
    }


    .yx9-property-content h3 {

        min-height:
            0;
    }

}


/* =====================================
   NAVBAR — PÁGINA ACTIVA
===================================== */

.yx6-nav
.yx6-nav-link[aria-current="page"] {

    background:
        #173F35;

    color:
        #F7F4EC;

    border-radius:
        999px;

    box-shadow:
        0 5px 15px
        rgba(23, 63, 53, .15);
}


.yx6-nav
.yx6-nav-link[aria-current="page"]::before {

    content:
        "";

    position:
        absolute;

    bottom:
        4px;

    left:
        50%;

    transform:
        translateX(-50%);

    width:
        5px;

    height:
        5px;

    border-radius:
        50%;

    background:
        #C89B4A;
}


.yx6-drawer-body
nav
a[aria-current="page"] {

    color:
        #E9DDC5;

    padding-left:
        12px;

    border-left:
        3px solid
        #C89B4A;

    background:
        rgba(200, 155, 74, .10);
}


.yx6-drawer-body
nav
a[aria-current="page"]
small,

.yx6-drawer-body
nav
a[aria-current="page"]
span {

    color:
        #C89B4A;
}


/* =========================================
   ESTADO ACTIVO CONFIABLE PARA TODAS LAS PÁGINAS
========================================= */

.yx6-nav
a.yx6-nav-link[aria-current="page"],

.yx6-nav
a.yx6-nav-link.yx6-link-active {

    position:
        relative;

    background:
        #173F35;

    color:
        #F7F4EC;

    border-radius:
        999px;

    box-shadow:
        0 6px 20px
        rgba(23, 63, 53, .20);
}


.yx6-nav
a.yx6-nav-link[aria-current="page"]:hover,

.yx6-nav
a.yx6-nav-link.yx6-link-active:hover {

    background:
        #245C4D;

    color:
        #FFFFFF;
}


.yx6-nav
a.yx6-nav-link[aria-current="page"]::before,

.yx6-nav
a.yx6-nav-link.yx6-link-active::before {

    content:
        "";

    position:
        absolute;

    bottom:
        3px;

    left:
        50%;

    transform:
        translateX(-50%);

    width:
        5px;

    height:
        5px;

    border-radius:
        50%;

    background:
        #C89B4A;
}


.yx6-drawer-body
nav
a[aria-current="page"] {

    color:
        #E9DDC5;

    padding-left:
        12px;

    border-left:
        3px solid
        #C89B4A;

    background:
        rgba(200, 155, 74, .12);
}


.yx6-drawer-body
nav
a[aria-current="page"]
small,

.yx6-drawer-body
nav
a[aria-current="page"]
span {

    color:
        #C89B4A;
}