/* ==========================================================================
   UMBRALES INMOBILIARIA
   custom.css

   Proyecto:
   Umbrales Inmobiliaria

   Tema:
   Uncode 2.12.4

   --------------------------------------------------------------------------
   ARQUITECTURA DEL PROYECTO
   --------------------------------------------------------------------------

   Theme Options
       ↓
   design-tokens.css
       (Design System / umb-*)
       ↓
   custom.css
       (Implementación Umbrales / umbrales-*)

   --------------------------------------------------------------------------
   CONVENCIONES
   --------------------------------------------------------------------------

   • No modificar design-tokens.css durante la implementación.
   • Theme Options tiene prioridad sobre CSS.
   • Utilizar componentes nativos de Uncode siempre que sea posible.
   • custom.css contiene únicamente personalizaciones específicas de Umbrales.
   • El prefijo "umb-" está reservado para el Design System.
   • El prefijo "umbrales-" está reservado para la implementación del proyecto.

   --------------------------------------------------------------------------
   ORGANIZACIÓN DEL ARCHIVO
   --------------------------------------------------------------------------

   00. UNCODE OVERRIDES
   01. BUTTONS
   02. HEADER
   03. HERO
   04. SEARCH BAR
   05. MARQUEE
   06. FEATURED PROPERTIES
   07. SPLIT
   08. STATS
   09. NOSOTRAS
   10. BLOG
   11. CTA
   12. FOOTER
   99. RESPONSIVE

========================================================================== */


/* ==========================================================
   00. UNCODE OVERRIDES
========================================================== */

/* Reservado para futuros overrides de Uncode */



/* ==========================================================
   01. BUTTONS
========================================================== */

/* Extensiones específicas del Design System */

.btn.umb-btn-primary,
.btn.umb-btn-outline,
.btn.umb-btn-outline-coral {
    font-size: 11px;
    font-weight: 700;
}

/* Outline Wine */

.btn.umb-btn-outline {
    color: var(--umb-wine);
}

.btn.btn-default.umb-btn-outline {
    color: var(--umb-wine) !important;
}

.btn.umb-btn-outline:hover {
    color: var(--umb-wine);
    border-color: rgba(92,58,74,.4);
}

/* Outline Coral */

.btn.umb-btn-outline-coral {
    color: var(--umb-coral);
}

.btn.btn-default.umb-btn-outline-coral {
    color: var(--umb-coral) !important;
}

.btn.umb-btn-outline-coral:hover {
    color: var(--umb-coral);
    border-color: var(--umb-coral);
}

/* Primary */

.btn.umb-btn-primary:hover {
    background: var(--umb-coral);
    color: #fff;
}

/* ==========================================================
   02. HEADER
========================================================== */

/* Guía: .nav */

.umbrales-nav {

}

/* Guía: .logo */
.umbrales-logo {

}
/* Integración Uncode */
.umbrales-header .row-parent{
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

/* Guía: .navlinks */

.umbrales-navlinks,
.umbrales-navlinks a,
.umbrales-navlinks a:link,
.umbrales-navlinks a:visited {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--umb-wine);
}

.umbrales-navlinks a:hover,
.umbrales-navlinks .current-menu-item > a,
.umbrales-navlinks .current_page_item > a {
    color: var(--umb-coral);
}

/* Guía: .lang */

.umbrales-lang {

}

/* Guía: .navbtn */

.umbrales-navbtn {

}

/* ==========================================================
   03. HERO
========================================================== */

/* Guía: .hero (Paulina) */

.umbrales-hero {

}

/* Guía: .hero-overlay (Paulina) */

.umbrales-hero-overlay {

}

/* Guía: .hero-content (Paulina) */

.umbrales-hero-content{
    max-width:400px;
}

/* Guía: .hero-eyebrow (Paulina)

   Combinar con:
   .umb-eyebrow
*/

.umbrales-hero-eyebrow {

}

/* Guía: .hero-h1 (Paulina)

   Combinar con:
   .umb-heading-lg
*/

.umbrales-hero-title h1 span{
    font-weight:700;
    line-height: 1.02 !important; /* se validará otro medio */
     /* color: var(--umb-hero-cream); */
}
.umbrales-hero-title em{
    color:#D4C8C0 !important;
    font-weight:300;
    font-style:italic;
}

.umb-heading-section .heading-text h2{
    font-weight:700;
}

.umb-heading-section h2 em{
    color:#9A6D7C !important;
    font-weight:300;
    font-style:italic;
}
.vc_custom_heading_wrap h2 em{
    color:#9A6D7C !important;
}
/* Hero accent (<em>) */

.umbrales-hero-accent {
    /* font-weight: 300;
    font-style: italic;*/
}

/* Body */

.umbrales-hero-text {

}

/* Contenedor de acciones */

.umbrales-hero-actions {

}

/* Link "Agenda una visita" */

.umbrales-hero-link{
    display:inline-block;
    margin-left:32px;      /* o 28px si aún queda lejos */
    padding-bottom:4px;
    border-bottom:1px solid rgba(242,237,230,.45);
    vertical-align:middle;
}


/* ==========================================================
   04. SEARCH BAR
========================================================== */

/* Guía: .search-bar (Paulina) */

.umbrales-search-bar {

}

/* Guía: .sb-field (Paulina) */

.umbrales-sb-field {

}

/* Guía: .sb-btn (Paulina)

   Combinar con:
   .umb-btn-primary
*/

.umbrales-sb-btn {

}



/* ==========================================================
   05. MARQUEE
========================================================== */

/* Guía: .umb-marquee (Paulina) */

.umbrales-marquee {

}

/* Guía: .umb-marquee-inner (Paulina) */

.umbrales-marquee-inner {

}
.umb-marquee-text p{
    margin: 0;
}
.umbrales-marquee{
    overflow: hidden;
    background: var(--umb-coral);
    padding: 11px 0;
}

.umbrales-marquee-inner{
    white-space: nowrap;
    animation: umb-mq 28s linear infinite;
}

.umbrales-marquee-text{
    display: inline-block;
    margin: 0;
}
.umbrales-marquee-text,
.umbrales-marquee-text p{
    margin: 0;
    display: inline-block;

    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.22em;
    word-spacing: 0.35em;
    text-transform: uppercase;
    color: #fff;
}
.umbrales-marquee-text{
    display: inline-block;
}
.umbrales-marquee-text span{
    display: inline-block;
    margin-right: 48px;
}
.umbrales-marquee .row-parent{
    padding-top: 11px !important;
    padding-bottom: 11px !important;
}
 
/* ==========================================================
   06. FEATURED PROPERTIES
========================================================== */

.umbrales-easybroker-placeholder{
    font-size: 14px;
    color: #7A7A7A;
    font-style: italic;
}
/* Guía: .cards (Paulina) */

.umbrales-cards {

}

/* Guía: .card (Paulina) */

.umbrales-card {

}

/* Guía: .cimg (Paulina) */

.umbrales-card-image {

}

/* Guía: .cbadge (Paulina) */

.umbrales-card-badge {

}

/* Guía: .cname (Paulina) */

.umbrales-card-name {

}
.t-entry .t-entry-title a{
    color: #2A2420;
    transition: color .25s ease;
}

.t-entry .t-entry-title a:hover{
    color: #ee4e65;
}



/* ==========================================================
   07. SPLIT
========================================================== */

/* Guía: .split (Paulina) */

.umbrales-split {

}

/* Guía: .split-photo (Paulina) */

.umbrales-split-photo {

}

/* Guía: .split-list (Paulina) */

.umbrales-split-list {

}

/* Guía: .sitem (Paulina) */

.umbrales-split-item {

}



/* ==========================================================
   08. STATS
========================================================== */
.umbrales-stats .triple-block-padding{
    padding-top:20px;
    padding-bottom:30px;
}
.umbrales-stats .counter-text{
    font-size: 8px;
    font-weight: 600;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #A89488;
   margin-top: -8px;
}

.umbrales-stats .counter-text p{
    margin: 0;
    margin-top: -15px;
}
/* Guía: .stats (Paulina) */

.umbrales-stats {

}

/* Guía: .stat (Paulina) */

.umbrales-stat {

}

/* Guía: .stat-n (Paulina) */

.umbrales-stat-number {

}

/* Guía: .stat-l (Paulina) */

.umbrales-stat-label {

}

/* ==========================================================
   09. NOSOTRAS
========================================================== */

.umbrales-nosotras .text-lead{
    color: var(--umb-coral);
    text-transform: uppercase;
    letter-spacing: .20em;
    font-size: 9px;
    font-weight: 600;
    line-height: 1;
}

.umbrales-nosotras .text-lead p{
    margin: 0;
    font-size: 11px !important;
    line-height: 1.1 !important;
    font-weight: 700;
}

/* Guía: .nosotras (Paulina) */

.umbrales-nosotras {

}

/* Guía: .persona-img (Paulina) */

.umbrales-persona-image {

}

/* Guía: .persona-name (Paulina) */

.umbrales-persona-name {

}



/* ==========================================================
   10. BLOG
========================================================== */


.umbrales-blog .tmb .t-entry p.t-entry-meta .t-entry-category a{
    color: var(--umb-coral);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    text-decoration: none;
}
.umbrales-blog .t-entry-category a:hover{
    color: var(--umb-accent);
}
.umbrales-blog .t-entry-category a:visited{
    color: var(--umb-accent);
}
/* Guía: .ciudad (Paulina) */

.umbrales-blog {

}

/* Guía: .blog-card (Paulina) */

.umbrales-blog-card {

}

/* Guía: .blog-title (Paulina) */

.umbrales-blog-title {

}

/* Enlaces de widgets del blog */
.widget-container a,
.widget-container a:link,
.widget-container a:visited {
    color: var(--umb-coral);
}

.widget-container a:hover {
    color: var(--umb-wine);
}

/* ==========================================================
   11. CTA
========================================================== */

/* Guía: .cta (Paulina) */

.umbrales-cta {

}

/* Guía: .cta-main (Paulina) */

.umbrales-cta-main {

}

/* Guía: .cta-sec (Paulina)

   Combinar con:
   .umb-btn-outline-coral
*/

.umbrales-cta-secondary {

}



/* ==========================================================
   12. FOOTER
========================================================== */
.umbrales-footer,
.umbrales-footer a,
.umbrales-footer a:link,
.umbrales-footer a:visited {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--umb-text-pale);
}

.umbrales-footer a:hover,
.umbrales-footer .current-menu-item > a,
.umbrales-footer .current_page_item > a {
    color: var(--umb-coral);
}
/*
.umbrales-footer .menu-smart a{
    color: var(--umb-text-tertiary);
}*/
/* Guía: footer (Paulina) */

.umbrales-footer {

}

/* Guía: .flinks (Paulina) */

.umbrales-footer-links {

}

/* Guía: .fcopy (Paulina) */

.umbrales-footer-copy {

}

/* ==========================================================
   13. TARJETA DE PROPIEDAD
========================================================== */

.umb-feature{
    display: inline-block;
    font-size: 14px;
    line-height: 1.4;
    color: #777;
    margin-right: .35rem;
}

/* Recámaras */
.umb-feature-bedroom::after{
    content: " rec. \00a0·\00a0";
}

/* Baños */
.umb-feature-bathroom::after{
    content: " baños \00a0·\00a0";
}

/* Construcción */
.umb-feature-size::after{
    content: " m²";
}

.umb-price{
    font-size: var(--umb-fs-h6);
    font-weight: 700;
    color: #7A6A62;
}

/* ==========================================
   Link "Ver detalles"
   ========================================== */

.umb-link-arrow{
    display: inline-flex;
    align-items: center;
    gap: .35rem;

    padding: 0;
    margin: 0;

    background: transparent;
    border: none;

    color: var(--umb-color-coral);
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;

    text-decoration: underline;
    text-underline-offset: .18em;
    text-decoration-thickness: 1px;

    transition: color .25s ease;
}

/* Separador antes del botón */

.t-entry-readmore{
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #e6e1dc;
}

.umb-link-arrow:hover{
    color: var(--umb-color-vino-oscuro);
    text-decoration: underline;
}

/* ==========================================
   Badge sobre la imagen
   ========================================== */

.umb-property-card .t-entry-visual {
    position: relative;
}

.umb-property-card .t-entry-cf-umb_operation_label {
    position: absolute;
    top: 16px;
    left: 16px;
    z-index: 20;
}

/* ==========================================
   Ficha de PROPIEDAD
   ========================================== */
.umb-features-list {
    list-style: none;
    margin: 0;
    padding: 0;
    columns: 2;
    column-gap: 40px;
}

.umb-features-list li {
    list-style: none;
    break-inside: avoid;
    position: relative;
    padding-left: 22px;
    margin-bottom: 10px;

    font-size:17px;
    line-height:1.8;
}

.umb-features-list li::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 0;
    color: var(--umb-primary);
    font-weight:700;
}

.umb-map{
    position:relative;
}

.umb-map-location{

    position:absolute;

    top:20px;
    left:20px;

    z-index:100;

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

    color:#fff;

    padding:14px 18px;

    border-radius:6px;

    max-width:340px;

    font-size:15px;

    line-height:1.5;
}

.umb-map-location strong{

    display:block;

    margin-bottom:4px;

    font-size:13px;

    font-weight:600;

    text-transform:uppercase;

    letter-spacing:.05em;

}

.umb-property-price .data-field-value{
    color: #ee4e65 !important;
    font-size: 29px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
}

.umb-property-meta .data-field-label{
    font-size:13px;
    color:#A89488;
    font-weight:500;
    line-height:1.2;
    margin-bottom:2px;
}

.umb-property-meta .data-field-value{
    font-size:16px;
    color:var(--umb-text);
    font-weight:600;
    line-height:1.2;
}

.umb-property-summary .data-field-label{
    font-size:13px;
    font-weight:600;
    color:#6F6A66;
}


.umb-property-summary .data-field-value{
    font-weight:700;
}

.umb-property-summary{
    background:#F9F6F1;
    border-radius:8px;
    padding:28px 32px;
}

.umb-agent-name .data-field-value{
    font-size:18px;
    font-weight:700;
}

.umb-agent-phone .data-field-value{
    font-size:18px;
    font-weight:400;
}

/* ==========================================================
   99. RESPONSIVE
========================================================== */

/* Breakpoints y ajustes responsive */

@media (max-width: 767px) {

    .umb-features-list {
        columns: 1;
    }

}

@media (max-width: 768px) {
    .t-entry-text {
        text-align: left !important;
    }
}

/* ==========================================================================
   UMBRALES
   Fix responsive para Custom Fields (Uncode 2.12.4)
   El componente Icon, Label and Value no respeta correctamente
   las columnas móviles, por lo que se fuerza un grid de 2 columnas.
   ========================================================================== */

@media (max-width: 767px) {

    .umb-property-summary .data-fields{
        grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    }

}

@media (min-width: 768px) {
    /* Forzamos a la fila a comportarse como un contenedor Flexible */
    .fila-cinco-columnas {
        display: flex !important;
        flex-wrap: wrap !important;
    }
    
    /* Redimensionamos las columnas internas al 20% exacto */
    .fila-cinco-columnas > .vc_column_container {
        flex: 0 0 20% !important;
        max-width: 20% !important;
        width: 20% !important;
    }
}


