/* =====================================================================
 * GVIA - Modernizacion UI (segunda capa sobre _components.css)
 * dvb 25/05/2026
 *
 * 100% CSS aditivo. NO toca HTML. Mejora la presencia visual del sitio
 * con sombras mas profundas, animaciones sutiles, mejor uso de espacio
 * y micro-interacciones.
 *
 * Si rompe algo, comentar el <link> del archivo en las 3 paginas.
 * ===================================================================== */

/* =====================================================================
 * Variables extra para modern UI
 * ===================================================================== */
:root {
    --gv-gradient-hero: linear-gradient(135deg,
        rgba(10, 10, 10, 0.75) 0%,
        rgba(38, 38, 38, 0.55) 50%,
        rgba(190, 39, 45, 0.35) 100%);
    --gv-gradient-overlay-soft: linear-gradient(180deg,
        rgba(255,255,255,0) 0%,
        rgba(255,255,255,0.9) 70%,
        rgba(255,255,255,1) 100%);
    --gv-gradient-red: linear-gradient(135deg, #be272d 0%, #8a1a1f 100%);
    --gv-gradient-red-soft: linear-gradient(135deg, #be272d 0%, #d63f44 100%);
}

/* =====================================================================
 * 1. Body y secciones - mejor ritmo vertical
 * ===================================================================== */
body {
    background-color: var(--gv-color-white);
}

/* Secciones con padding generoso */
section {
    padding: var(--gv-space-16) 0;
    position: relative;
}

@media (min-width: 769px) {
    section {
        padding: var(--gv-space-20) 0;
    }
}

/* Container mas ancho en desktop grande */
@media (min-width: 1400px) {
    .container {
        max-width: 1320px;
    }
}

/* =====================================================================
 * 2. HERO del home - mucho mas dramatico
 * ===================================================================== */
.page-index header.intro {
    min-height: 80vh;
    display: flex;
    align-items: center;
    overflow: hidden;
    position: relative;
}

.page-index header.intro:before {
    background: var(--gv-gradient-hero);
}

.page-index header.intro .intro-text {
    padding: var(--gv-space-12) 0;
    max-width: 900px;
}

.page-index .intro-heading {
    color: var(--gv-color-white);
    margin-bottom: var(--gv-space-6);
    animation: gvHeroIn 0.8s var(--gv-ease) 0.1s backwards;
}

.page-index .intro-lead-in {
    color: rgba(255,255,255,0.92);
    font-size: var(--gv-text-xl);
    line-height: var(--gv-leading-relaxed);
    margin-bottom: var(--gv-space-10);
    animation: gvHeroIn 0.8s var(--gv-ease) 0.3s backwards;
}

.page-index header.intro .btn,
.page-index header.intro a.btn-xl {
    animation: gvHeroIn 0.8s var(--gv-ease) 0.5s backwards;
    background: var(--gv-gradient-red-soft);
    border: none;
    color: var(--gv-color-white);
    box-shadow: 0 8px 24px rgba(190, 39, 45, 0.4);
    padding: var(--gv-space-4) var(--gv-space-10);
    font-size: var(--gv-text-lg);
    font-weight: var(--gv-weight-bold);
    border-radius: var(--gv-radius-md);
    letter-spacing: var(--gv-tracking-wide);
    text-transform: uppercase;
    font-family: var(--gv-font-display);
    transition: var(--gv-transition);
}

.page-index header.intro .btn:hover,
.page-index header.intro a.btn-xl:hover {
    background: var(--gv-gradient-red);
    color: var(--gv-color-white);
    transform: translateY(-3px) scale(1.02);
    box-shadow: 0 16px 40px rgba(190, 39, 45, 0.55);
}

@keyframes gvHeroIn {
    from { opacity: 0; transform: translateY(40px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* Scroll indicator (sutil) */
.page-index header.intro:after {
    content: '';
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    width: 30px;
    height: 50px;
    border: 2px solid rgba(255,255,255,0.6);
    border-radius: 15px;
    z-index: 1;
    pointer-events: none;
}
.page-index header.intro::after {
    background: rgba(255,255,255,0.6);
    width: 4px;
    height: 8px;
    border: none;
    border-radius: 2px;
    bottom: 60px;
    animation: gvScrollDown 2s ease-in-out infinite;
}

@keyframes gvScrollDown {
    0%, 20%   { transform: translate(-50%, 0); opacity: 0.8; }
    100%      { transform: translate(-50%, 18px); opacity: 0; }
}

/* =====================================================================
 * 3. Section headings (h2 + subheading) mas dramaticos
 * ===================================================================== */
.section-heading,
section h2,
section .text-center h2 {
    font-family: var(--gv-font-display);
    font-weight: var(--gv-weight-extrabold);
    letter-spacing: var(--gv-tracking-tighter);
    color: var(--gv-color-text);
    margin-bottom: var(--gv-space-3);
    position: relative;
}

/* Subrayado rojo elegante bajo headings centrados */
section .text-center > h2:after,
section .text-center > .section-heading:after {
    content: '';
    display: block;
    width: 60px;
    height: 4px;
    background: var(--gv-gradient-red-soft);
    margin: var(--gv-space-4) auto var(--gv-space-2);
    border-radius: 2px;
}

.section-subheading,
section .text-center h3 {
    font-size: var(--gv-text-lg);
    font-weight: var(--gv-weight-normal);
    color: var(--gv-color-text-muted);
    font-style: normal;
    max-width: 700px;
    margin: 0 auto var(--gv-space-12);
    line-height: var(--gv-leading-relaxed);
}

/* =====================================================================
 * 4. Cards de propiedad - mas premium
 * ===================================================================== */
.propiedad_box_item {
    background: var(--gv-color-white);
    border-radius: var(--gv-radius-md);
    overflow: hidden;
    border: 1px solid var(--gv-color-gray-200);
    transition: var(--gv-transition);
    box-shadow: var(--gv-shadow);
    position: relative;
}

.propiedad_box_item:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 40px -10px rgba(0,0,0,0.15);
    border-color: var(--gv-color-gray-300);
}

.propiedad_box_item a {
    display: block;
    overflow: hidden;
    background: var(--gv-color-gray-100);
    position: relative;
}

.propiedad_box_imagen {
    width: 100%;
    height: 260px;
    object-fit: cover;
    transition: transform 600ms var(--gv-ease);
    display: block;
}

.propiedad_box_item:hover .propiedad_box_imagen {
    transform: scale(1.08);
}

/* Overlay gradient sutil en la foto - mejora legibilidad si hay badge */
.propiedad_box_item a:after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg,
        rgba(0,0,0,0.15) 0%,
        rgba(0,0,0,0) 30%,
        rgba(0,0,0,0) 70%,
        rgba(0,0,0,0.2) 100%);
    pointer-events: none;
    opacity: 0;
    transition: opacity var(--gv-duration) var(--gv-ease);
}

.propiedad_box_item:hover a:after {
    opacity: 1;
}

.propiedad_box_texto {
    padding: var(--gv-space-5) var(--gv-space-6);
}

.propiedad_box_id {
    display: inline-block;
    font-size: var(--gv-text-xs);
    font-weight: var(--gv-weight-bold);
    color: var(--gv-color-primary);
    text-transform: uppercase;
    letter-spacing: var(--gv-tracking-wider);
    background: var(--gv-color-primary-light);
    padding: 4px 10px;
    border-radius: var(--gv-radius-full);
}

.propiedad_box_colonia {
    display: block;
    font-size: var(--gv-text-base);
    color: var(--gv-color-text);
    margin-top: var(--gv-space-3);
    font-weight: var(--gv-weight-semibold);
    line-height: var(--gv-leading-snug);
}

.propiedad_box_precio {
    display: block;
    font-size: var(--gv-text-2xl);
    font-weight: var(--gv-weight-extrabold);
    color: var(--gv-color-primary);
    margin-top: var(--gv-space-4);
    letter-spacing: var(--gv-tracking-tight);
    line-height: 1;
}

/* Cards modo listado detallado - upgrade */
.thumbnails .mix-inner {
    background: var(--gv-color-white);
    border-radius: var(--gv-radius-md);
    overflow: hidden;
    box-shadow: var(--gv-shadow);
    transition: var(--gv-transition);
    margin-bottom: var(--gv-space-8);
    border: 1px solid var(--gv-color-gray-200);
}

.thumbnails .mix-inner:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 40px -10px rgba(0,0,0,0.15);
    border-color: var(--gv-color-gray-300);
}

.thumbnails img.resize {
    transition: transform 600ms var(--gv-ease);
}

.thumbnails .mix-inner:hover img.resize {
    transform: scale(1.04);
}

/* =====================================================================
 * 5. Filtros de busqueda - mas premium
 * ===================================================================== */
#propiedades_filtro {
    background: var(--gv-color-white);
    padding: var(--gv-space-8) 0;
    margin-bottom: var(--gv-space-8);
    position: relative;
}

@media (min-width: 769px) {
    #propiedades_filtro {
        background: var(--gv-color-white);
        border-bottom: 1px solid var(--gv-color-border);
        box-shadow: var(--gv-shadow-sm);
    }
}

#propiedades_filtro .form-group {
    margin-bottom: var(--gv-space-4);
}

#propiedades_filtro label {
    text-transform: uppercase;
    font-size: var(--gv-text-xs);
    letter-spacing: var(--gv-tracking-wider);
    font-weight: var(--gv-weight-semibold);
    color: var(--gv-color-text-muted);
    margin-bottom: var(--gv-space-2);
}

/* Radio buttons (Venta/Renta) como pills */
#propiedades_filtro .radio-inline {
    display: inline-block;
    margin-right: var(--gv-space-3) !important;
    cursor: pointer;
    padding: var(--gv-space-3) var(--gv-space-6);
    background: var(--gv-color-gray-100);
    border-radius: var(--gv-radius-full);
    transition: var(--gv-transition-fast);
    font-weight: var(--gv-weight-semibold);
    font-size: var(--gv-text-sm);
    border: 2px solid transparent;
}

#propiedades_filtro .radio-inline:hover {
    background: var(--gv-color-gray-200);
}

#propiedades_filtro .radio-inline input[type="radio"]:checked + i,
#propiedades_filtro .icheck.checked {
    background: var(--gv-color-primary) !important;
    border-color: var(--gv-color-primary) !important;
}

/* Select2 modernizado */
.select2-container--default .select2-selection--single {
    border: 1.5px solid var(--gv-color-border) !important;
    border-radius: var(--gv-radius) !important;
    min-height: 44px !important;
    background: var(--gv-color-white) !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 40px !important;
    color: var(--gv-color-text) !important;
    padding-left: var(--gv-space-4) !important;
}

.select2-container--default.select2-container--focus .select2-selection--single {
    border-color: var(--gv-color-primary) !important;
    box-shadow: 0 0 0 3px var(--gv-color-primary-light) !important;
}

/* =====================================================================
 * 6. Buscador / form general - mejor presencia
 * ===================================================================== */
.btnFilterShowHide {
    background: var(--gv-gradient-red-soft) !important;
    color: var(--gv-color-white) !important;
    border: none !important;
    border-radius: var(--gv-radius-full) !important;
    padding: var(--gv-space-3) var(--gv-space-8) !important;
    font-weight: var(--gv-weight-semibold) !important;
    box-shadow: var(--gv-shadow-red) !important;
    transition: var(--gv-transition) !important;
}

.btnFilterShowHide:hover {
    transform: translateY(-1px);
    box-shadow: var(--gv-shadow-red-lg) !important;
}

/* =====================================================================
 * 7. Paginacion - mas grande y elegante
 * ===================================================================== */
.pagination {
    margin: var(--gv-space-12) 0;
    gap: var(--gv-space-2);
}

.pagination > li > a,
.pagination > li > span {
    min-width: 44px;
    height: 44px;
    padding: 0 var(--gv-space-4) !important;
    line-height: 40px !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* =====================================================================
 * 8. Servicios / cards genericas - upgrade
 * ===================================================================== */
.service-heading {
    font-family: var(--gv-font-display);
    font-weight: var(--gv-weight-bold);
    color: var(--gv-color-text);
    margin-top: var(--gv-space-6);
    margin-bottom: var(--gv-space-3);
    font-size: var(--gv-text-xl);
}

/* Iconos circulares con estilo moderno */
.fa-stack,
.service-circle,
i.fa-3x,
i.fa-4x {
    color: var(--gv-color-primary);
    transition: var(--gv-transition);
    margin-bottom: var(--gv-space-4);
}

section .text-center i.fa-3x:hover,
section .text-center i.fa-4x:hover {
    transform: scale(1.1);
}

/* =====================================================================
 * 9. Modal - mas premium
 * ===================================================================== */
.modal-content {
    border-radius: var(--gv-radius-lg) !important;
    border: none !important;
    box-shadow: var(--gv-shadow-2xl) !important;
    overflow: hidden;
}

.modal-header {
    border-bottom: 1px solid var(--gv-color-border) !important;
    padding: var(--gv-space-6) !important;
}

.modal-header .modal-title {
    font-weight: var(--gv-weight-bold) !important;
    font-size: var(--gv-text-xl) !important;
}

.modal-body {
    padding: var(--gv-space-6) !important;
}

.modal-footer {
    border-top: 1px solid var(--gv-color-border) !important;
    padding: var(--gv-space-5) var(--gv-space-6) !important;
}

/* =====================================================================
 * 10. Inputs / forms - focus mas marcado
 * ===================================================================== */
.form-control {
    border: 1.5px solid var(--gv-color-border) !important;
    border-radius: var(--gv-radius) !important;
    box-shadow: none !important;
    transition: var(--gv-transition-fast) !important;
    padding: var(--gv-space-3) var(--gv-space-4) !important;
    min-height: 44px !important;
    font-size: var(--gv-text-base) !important;
}

.form-control:focus {
    border-color: var(--gv-color-primary) !important;
    box-shadow: 0 0 0 3px var(--gv-color-primary-light) !important;
}

.input-group-addon {
    background: var(--gv-color-gray-100) !important;
    border: 1.5px solid var(--gv-color-border) !important;
    color: var(--gv-color-text-muted) !important;
    font-weight: var(--gv-weight-semibold) !important;
}

/* =====================================================================
 * 11. Detalle de propiedad - layout y precios
 * ===================================================================== */

/* Precios grandes en detalle */
.page-propiedad h1,
.page-propiedad h2:first-of-type {
    color: var(--gv-color-text);
}

.page-propiedad .precio,
.page-propiedad b[style*="color"],
.page-propiedad .precioPropiedad {
    color: var(--gv-color-primary) !important;
    font-weight: var(--gv-weight-extrabold);
    font-size: var(--gv-text-3xl);
    letter-spacing: var(--gv-tracking-tight);
}

/* Tarjetas de info en detalle */
.page-propiedad .table {
    border: 1px solid var(--gv-color-border);
    border-radius: var(--gv-radius);
    overflow: hidden;
}

.page-propiedad .table > tbody > tr > td,
.page-propiedad .table > tbody > tr > th {
    padding: var(--gv-space-3) var(--gv-space-4);
    border-color: var(--gv-color-gray-100);
}

/* Galeria de fotos */
.page-propiedad .carousel-inner > .item > img {
    width: 100%;
    max-height: 600px;
    object-fit: cover;
    border-radius: var(--gv-radius-md);
}

.page-propiedad .carousel-control {
    background-image: none !important;
    background: rgba(0,0,0,0.4);
    width: 50px;
    height: 50px;
    border-radius: 50%;
    top: 50%;
    transform: translateY(-50%);
    opacity: 0.7;
    transition: var(--gv-transition);
}

.page-propiedad .carousel-control:hover {
    background: var(--gv-color-primary);
    opacity: 1;
}

.page-propiedad .carousel-control.left  { left: 20px; }
.page-propiedad .carousel-control.right { right: 20px; }

/* =====================================================================
 * 12. Footer rediseñado - dvb 25/05/2026
 * ===================================================================== */
.gv-footer {
    background: var(--gv-color-gray-900);
    color: var(--gv-color-gray-300);
    padding: var(--gv-space-16) 0 0;
    margin-top: var(--gv-space-16);
    font-size: var(--gv-text-base);
    line-height: var(--gv-leading-relaxed);
}

.gv-footer-col {
    margin-bottom: var(--gv-space-8);
}

/* Branding */
.gv-footer-brand {
    color: var(--gv-color-white);
    font-size: var(--gv-text-2xl);
    font-weight: var(--gv-weight-extrabold);
    letter-spacing: var(--gv-tracking-tight);
    margin: 0 0 var(--gv-space-3);
}
.gv-footer-brand span {
    color: var(--gv-color-primary);
    font-weight: var(--gv-weight-normal);
    font-size: var(--gv-text-xl);
}
.gv-footer-tagline {
    color: var(--gv-color-gray-400);
    font-size: var(--gv-text-base);
    margin: 0 0 var(--gv-space-5);
    line-height: var(--gv-leading-relaxed);
}

/* Headings */
.gv-footer-heading {
    color: var(--gv-color-white);
    font-size: var(--gv-text-lg);
    font-weight: var(--gv-weight-bold);
    text-transform: uppercase;
    letter-spacing: var(--gv-tracking-wider);
    margin: 0 0 var(--gv-space-5);
    position: relative;
    padding-bottom: var(--gv-space-3);
}
.gv-footer-heading:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 32px;
    height: 3px;
    background: var(--gv-color-primary);
    border-radius: 2px;
}

/* Lista de contacto */
.gv-footer-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.gv-footer-list li {
    display: flex;
    align-items: flex-start;
    gap: var(--gv-space-3);
    padding: var(--gv-space-2) 0;
    color: var(--gv-color-gray-300);
    font-size: var(--gv-text-base);
    line-height: var(--gv-leading-snug);
}
.gv-footer-list li i {
    color: var(--gv-color-primary);
    font-size: var(--gv-text-base);
    width: 20px;
    text-align: center;
    margin-top: 4px;
    flex-shrink: 0;
}
.gv-footer-list li a {
    color: var(--gv-color-gray-300);
    transition: color var(--gv-duration-fast) var(--gv-ease);
    text-decoration: none;
}
.gv-footer-list li a:hover {
    color: var(--gv-color-white);
}

/* Lista de links del footer (col 3) */
.gv-footer-links li {
    padding: var(--gv-space-2) 0;
}
.gv-footer-links li:before {
    content: '›';
    color: var(--gv-color-primary);
    font-weight: var(--gv-weight-bold);
    margin-right: var(--gv-space-2);
    font-size: var(--gv-text-lg);
    line-height: 1;
}

/* Redes sociales */
.gv-footer-social {
    display: flex;
    gap: var(--gv-space-2);
}
.gv-footer-social a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: rgba(255,255,255,0.08);
    color: var(--gv-color-white);
    transition: var(--gv-transition);
    text-decoration: none;
}
.gv-footer-social a:hover {
    background: var(--gv-color-primary);
    transform: translateY(-3px);
    box-shadow: var(--gv-shadow-red);
}
.gv-footer-social a i {
    font-size: var(--gv-text-lg);
}

/* App movil - badges */
.gv-footer-app-text {
    color: var(--gv-color-gray-400);
    font-size: var(--gv-text-sm);
    margin: 0 0 var(--gv-space-5);
    line-height: var(--gv-leading-relaxed);
}
.gv-footer-apps {
    display: flex;
    flex-direction: column;
    gap: var(--gv-space-3);
}
.gv-app-badge {
    display: inline-grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
    align-items: center;
    column-gap: var(--gv-space-3);
    padding: var(--gv-space-3) var(--gv-space-5);
    background: var(--gv-color-black);
    color: var(--gv-color-white);
    border-radius: var(--gv-radius);
    border: 1px solid var(--gv-color-gray-700);
    text-decoration: none !important;
    transition: var(--gv-transition);
    min-width: 180px;
}
.gv-app-badge:hover {
    background: var(--gv-color-gray-800);
    color: var(--gv-color-white);
    border-color: var(--gv-color-primary);
    transform: translateY(-2px);
    box-shadow: var(--gv-shadow-lg);
}
.gv-app-badge i {
    grid-row: 1 / 3;
    font-size: 32px;
    color: var(--gv-color-white);
}
.gv-app-badge .small {
    font-size: var(--gv-text-xs);
    color: var(--gv-color-gray-400);
    line-height: 1;
    grid-column: 2;
    grid-row: 1;
}
.gv-app-badge .big {
    font-size: var(--gv-text-base);
    font-weight: var(--gv-weight-bold);
    color: var(--gv-color-white);
    line-height: 1.2;
    grid-column: 2;
    grid-row: 2;
    margin-top: 2px;
}

/* Barra inferior */
.gv-footer-bottom {
    background: var(--gv-color-black);
    color: var(--gv-color-gray-400);
    padding: var(--gv-space-5) 0;
    font-size: var(--gv-text-sm);
    margin-top: var(--gv-space-8);
}
.gv-footer-bottom a {
    color: var(--gv-color-gray-400);
    transition: color var(--gv-duration-fast) var(--gv-ease);
}
.gv-footer-bottom a:hover {
    color: var(--gv-color-white);
}

@media (max-width: 768px) {
    .gv-footer {
        text-align: center;
    }
    .gv-footer-heading:after {
        left: 50%;
        transform: translateX(-50%);
    }
    .gv-footer-list li,
    .gv-footer-links li {
        justify-content: center;
    }
    .gv-footer-social {
        justify-content: center;
    }
    .gv-footer-apps {
        align-items: center;
    }
    .text-center-xs {
        text-align: center !important;
        margin-bottom: var(--gv-space-2);
    }
}

/* Compatibilidad: si el sitio aun usa <footer> sin la clase nueva, mantener estilos basicos.
   dvb 25/05/2026 - selector generico como fallback. */
footer:not(.gv-footer) {
    background: var(--gv-color-gray-900);
    color: var(--gv-color-gray-300);
    padding: var(--gv-space-12) 0 var(--gv-space-6);
    margin-top: var(--gv-space-12);
}
footer:not(.gv-footer) a {
    color: var(--gv-color-gray-300);
}
footer:not(.gv-footer) a:hover {
    color: var(--gv-color-white);
}

/* =====================================================================
 * REDISEÑO PROPIEDADES.PHP - dvb 25/05/2026
 * Hero buscador + sticky bar + chips activos + drawer + cards modernas
 * ===================================================================== */

/* ============ HERO BUSCADOR ============ */
.page-propiedades .gv-search-hero {
    background: linear-gradient(135deg, #0a0a0a 0%, #262626 70%, var(--gv-color-primary-dark) 130%);
    color: var(--gv-color-white);
    /* dvb 26/05/2026 - padding-top extra para que el navbar fixed no tape el contenido */
    padding: calc(var(--gv-space-16) + 80px) 0 var(--gv-space-12);
    text-align: center;
    position: relative;
    overflow: hidden;
    margin-top: 0;
}
@media (max-width: 768px) {
    .page-propiedades .gv-search-hero {
        padding-top: calc(var(--gv-space-10) + 70px);
    }
}
.page-propiedades .gv-search-hero:after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 60% 40% at 50% 0%, rgba(190,39,45,0.15), transparent 70%);
    pointer-events: none;
}
.page-propiedades .gv-search-hero h1 {
    color: var(--gv-color-white);
    font-size: var(--gv-text-4xl);
    font-weight: var(--gv-weight-extrabold);
    letter-spacing: var(--gv-tracking-tighter);
    margin: 0 0 var(--gv-space-3);
    position: relative;
}
.page-propiedades .gv-search-hero .lead {
    color: rgba(255,255,255,0.85);
    font-size: var(--gv-text-lg);
    margin: 0 0 var(--gv-space-8);
    position: relative;
}
.page-propiedades .gv-search-box {
    position: relative;
    max-width: 720px;
    margin: 0 auto;
    z-index: 2;
}
.page-propiedades .gv-search-box input {
    width: 100%;
    padding: var(--gv-space-5) var(--gv-space-6) var(--gv-space-5) var(--gv-space-12);
    font-size: var(--gv-text-lg);
    border: none;
    border-radius: var(--gv-radius-full);
    background: var(--gv-color-white);
    box-shadow: var(--gv-shadow-2xl);
    min-height: 60px;
    color: var(--gv-color-text);
}
.page-propiedades .gv-search-box input:focus {
    outline: 3px solid rgba(190, 39, 45, 0.4);
    outline-offset: 2px;
}
.page-propiedades .gv-search-box i {
    position: absolute;
    left: var(--gv-space-6);
    top: 50%;
    transform: translateY(-50%);
    color: var(--gv-color-primary);
    font-size: var(--gv-text-xl);
    pointer-events: none;
}
.page-propiedades .gv-search-box button {
    position: absolute;
    right: 6px;
    top: 50%;
    transform: translateY(-50%);
    background: var(--gv-color-primary);
    color: var(--gv-color-white);
    border: none;
    border-radius: var(--gv-radius-full);
    padding: var(--gv-space-3) var(--gv-space-8);
    font-weight: var(--gv-weight-bold);
    font-size: var(--gv-text-base);
    cursor: pointer;
    transition: var(--gv-transition);
    height: 48px;
}
.page-propiedades .gv-search-box button:hover {
    background: var(--gv-color-primary-hover);
    transform: translateY(-50%) scale(1.05);
}
@media (max-width: 768px) {
    .page-propiedades .gv-search-hero {
        padding: var(--gv-space-10) 0 var(--gv-space-8);
    }
    .page-propiedades .gv-search-hero h1 {
        font-size: var(--gv-text-3xl);
    }
    .page-propiedades .gv-search-box input {
        font-size: var(--gv-text-base);
        padding-right: var(--gv-space-4);
    }
    .page-propiedades .gv-search-box button {
        position: static;
        transform: none;
        width: 100%;
        margin-top: var(--gv-space-3);
        height: 52px;
    }
}

/* ============ STICKY FILTER BAR ============ */
.page-propiedades .gv-filter-bar {
    background: var(--gv-color-white);
    border-bottom: 1px solid var(--gv-color-border);
    padding: var(--gv-space-4) 0;
    position: sticky;
    /* dvb 26/05/2026 - debajo del navbar fixed para que no quede tapado al scrollear */
    top: 70px;
    z-index: 50;
    box-shadow: var(--gv-shadow-sm);
}
@media (max-width: 768px) {
    .page-propiedades .gv-filter-bar {
        top: 60px;
    }
}
.page-propiedades .gv-filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gv-space-3);
    align-items: center;
}
/* dvb 26/05/2026 - en desktop forzar single line para mantener pills + dropdowns + boton en un solo renglon */
@media (min-width: 992px) {
    .page-propiedades .gv-filter-row {
        flex-wrap: nowrap;
        justify-content: flex-start;
    }
    .page-propiedades .gv-filter-row .gv-filter-select {
        flex: 1;
        min-width: 0;
    }
    .page-propiedades .gv-filter-row .gv-more-filters {
        white-space: nowrap;
        flex-shrink: 0;
    }
}

/* Pills de transaccion (Venta / Renta) */
.gv-pill-group {
    display: inline-flex;
    background: var(--gv-color-gray-100);
    border-radius: var(--gv-radius-full);
    padding: 4px;
    border: 1px solid var(--gv-color-border);
}
.gv-pill-group label {
    cursor: pointer;
    padding: var(--gv-space-2) var(--gv-space-5);
    border-radius: var(--gv-radius-full);
    font-weight: var(--gv-weight-semibold);
    font-size: var(--gv-text-base);
    color: var(--gv-color-text);
    transition: var(--gv-transition-fast);
    margin: 0;
    user-select: none;
    line-height: 1.4;
}
.gv-pill-group label:hover {
    color: var(--gv-color-primary);
}
.gv-pill-group input[type="radio"] {
    display: none;
}
.gv-pill-group input[type="radio"]:checked + label {
    background: var(--gv-color-primary);
    color: var(--gv-color-white);
    box-shadow: var(--gv-shadow-sm);
}

/* Dropdowns inline (Tipo, Zona, Precio) */
.gv-filter-select {
    min-width: 160px;
    height: 48px;
    border-radius: var(--gv-radius-full) !important;
    border: 1.5px solid var(--gv-color-border) !important;
    background: var(--gv-color-white) !important;
    font-weight: var(--gv-weight-medium);
    padding: 0 var(--gv-space-5) !important;
    color: var(--gv-color-text) !important;
    cursor: pointer;
    transition: var(--gv-transition-fast);
    font-size: var(--gv-text-base) !important;
}
.gv-filter-select:hover {
    border-color: var(--gv-color-primary) !important;
}
.gv-filter-select:focus {
    border-color: var(--gv-color-primary) !important;
    outline: none;
    box-shadow: 0 0 0 3px var(--gv-color-primary-light) !important;
}

/* Boton "+ Mas filtros" */
.gv-more-filters {
    height: 48px;
    padding: 0 var(--gv-space-5);
    border-radius: var(--gv-radius-full);
    background: var(--gv-color-white);
    border: 1.5px solid var(--gv-color-primary);
    color: var(--gv-color-primary);
    font-weight: var(--gv-weight-semibold);
    cursor: pointer;
    transition: var(--gv-transition);
    display: inline-flex;
    align-items: center;
    gap: var(--gv-space-2);
    font-size: var(--gv-text-base);
}
.gv-more-filters:hover {
    background: var(--gv-color-primary);
    color: var(--gv-color-white);
    box-shadow: var(--gv-shadow-red);
}
.gv-more-filters .badge {
    background: var(--gv-color-primary);
    color: var(--gv-color-white);
    border-radius: var(--gv-radius-full);
    padding: 2px 8px;
    font-size: var(--gv-text-xs);
    margin-left: var(--gv-space-2);
}
.gv-more-filters:hover .badge {
    background: var(--gv-color-white);
    color: var(--gv-color-primary);
}

/* ============ CHIPS DE FILTROS ACTIVOS ============ */
.gv-active-chips {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gv-space-2);
    align-items: center;
    padding: var(--gv-space-5) 0 var(--gv-space-4);
}
.gv-chip {
    display: inline-flex;
    align-items: center;
    gap: var(--gv-space-2);
    background: var(--gv-color-primary-light);
    color: var(--gv-color-primary-dark);
    border-radius: var(--gv-radius-full);
    padding: var(--gv-space-2) var(--gv-space-4);
    font-size: var(--gv-text-sm);
    font-weight: var(--gv-weight-semibold);
    border: 1px solid rgba(190,39,45,0.2);
}
.gv-chip button {
    background: none;
    border: none;
    color: var(--gv-color-primary);
    cursor: pointer;
    padding: 0;
    font-size: var(--gv-text-base);
    line-height: 1;
    margin-left: var(--gv-space-1);
    transition: transform var(--gv-duration-fast);
}
.gv-chip button:hover {
    transform: scale(1.2);
}
.gv-clear-all {
    background: none;
    border: none;
    color: var(--gv-color-text-muted);
    text-decoration: underline;
    cursor: pointer;
    font-size: var(--gv-text-sm);
    padding: var(--gv-space-2);
}
.gv-clear-all:hover {
    color: var(--gv-color-primary);
}

/* ============ RESULTS BAR (contador + orden + vista) ============ */
.gv-results-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--gv-space-4) 0;
    border-bottom: 1px solid var(--gv-color-border);
    margin-bottom: var(--gv-space-6);
    flex-wrap: wrap;
    gap: var(--gv-space-3);
}
.gv-results-count {
    font-size: var(--gv-text-base);
    color: var(--gv-color-text);
    font-weight: var(--gv-weight-semibold);
}
.gv-results-count b {
    color: var(--gv-color-primary);
}
.gv-results-controls {
    display: flex;
    gap: var(--gv-space-3);
    align-items: center;
}

/* ============ CARDS DE PROPIEDAD - rediseño Airbnb-style ============ */
.gv-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: var(--gv-space-6);
}
@media (min-width: 1200px) {
    .gv-grid {
        grid-template-columns: repeat(4, 1fr);
    }
}

.gv-pro-card {
    background: var(--gv-color-white);
    border-radius: var(--gv-radius-lg);
    overflow: hidden;
    transition: var(--gv-transition);
    display: flex;
    flex-direction: column;
    border: 1px solid var(--gv-color-border);
}
.gv-pro-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--gv-shadow-xl);
    border-color: transparent;
}

.gv-pro-card .gv-pro-imagen {
    position: relative;
    aspect-ratio: 16 / 11;
    overflow: hidden;
    background: var(--gv-color-gray-100);
    display: block;
}
.gv-pro-card .gv-pro-imagen img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 600ms var(--gv-ease);
}
.gv-pro-card:hover .gv-pro-imagen img {
    transform: scale(1.08);
}
.gv-pro-card .gv-pro-imagen:after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 0%, transparent 50%, rgba(0,0,0,0.65) 100%);
    pointer-events: none;
}

/* Badge transaccion sobre la foto */
.gv-pro-card .gv-pro-badge {
    position: absolute;
    top: var(--gv-space-3);
    left: var(--gv-space-3);
    background: var(--gv-color-primary);
    color: var(--gv-color-white);
    padding: 4px 12px;
    border-radius: var(--gv-radius-full);
    font-size: var(--gv-text-xs);
    font-weight: var(--gv-weight-bold);
    letter-spacing: var(--gv-tracking-wider);
    text-transform: uppercase;
    z-index: 2;
    box-shadow: var(--gv-shadow);
}

/* Precio sobre la foto */
.gv-pro-card .gv-pro-precio-overlay {
    position: absolute;
    bottom: var(--gv-space-3);
    left: var(--gv-space-3);
    right: var(--gv-space-3);
    color: var(--gv-color-white);
    font-size: var(--gv-text-2xl);
    font-weight: var(--gv-weight-extrabold);
    letter-spacing: var(--gv-tracking-tight);
    text-shadow: 0 2px 8px rgba(0,0,0,0.5);
    z-index: 2;
}

/* Body de la card */
.gv-pro-card .gv-pro-body {
    padding: var(--gv-space-4) var(--gv-space-5);
    flex: 1;
    display: flex;
    flex-direction: column;
}
.gv-pro-card .gv-pro-titulo {
    font-size: var(--gv-text-lg);
    font-weight: var(--gv-weight-bold);
    color: var(--gv-color-text);
    margin: 0 0 var(--gv-space-2);
    line-height: var(--gv-leading-snug);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.gv-pro-card .gv-pro-ubicacion {
    font-size: var(--gv-text-sm);
    color: var(--gv-color-text-muted);
    margin: 0 0 var(--gv-space-3);
    display: flex;
    align-items: center;
    gap: var(--gv-space-1);
}
.gv-pro-card .gv-pro-ubicacion i {
    color: var(--gv-color-primary);
}
.gv-pro-card .gv-pro-stats {
    display: flex;
    gap: var(--gv-space-4);
    padding-top: var(--gv-space-3);
    border-top: 1px solid var(--gv-color-border);
    margin-top: auto;
    font-size: var(--gv-text-sm);
    color: var(--gv-color-text-muted);
}
.gv-pro-card .gv-pro-stats span {
    display: inline-flex;
    align-items: center;
    gap: var(--gv-space-1);
}
.gv-pro-card .gv-pro-stats i {
    color: var(--gv-color-primary);
}

/* ============ DRAWER / MODAL DE FILTROS AVANZADOS ============ */
/* dvb 26/05/2026 - z-index muy alto para tapar navbar y todo lo demas */
.gv-drawer-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.55);
    z-index: 99998;
    opacity: 0;
    visibility: hidden;
    transition: opacity var(--gv-duration) var(--gv-ease),
                visibility var(--gv-duration) var(--gv-ease);
}
.gv-drawer-backdrop.gv-open {
    opacity: 1;
    visibility: visible;
}
.gv-drawer {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 480px;
    max-width: 100%;
    background: var(--gv-color-white);
    z-index: 99999;
    transform: translateX(100%);
    transition: transform var(--gv-duration-slow) var(--gv-ease);
    display: flex;
    flex-direction: column;
    box-shadow: var(--gv-shadow-2xl);
}
.gv-drawer.gv-open {
    transform: translateX(0);
}
.gv-drawer-header {
    padding: var(--gv-space-5) var(--gv-space-6);
    border-bottom: 1px solid var(--gv-color-border);
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.gv-drawer-header h3 {
    margin: 0;
    font-size: var(--gv-text-xl);
    font-weight: var(--gv-weight-bold);
}
.gv-drawer-close {
    background: var(--gv-color-gray-100);
    border: none;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    cursor: pointer;
    font-size: var(--gv-text-xl);
    line-height: 1;
    transition: var(--gv-transition-fast);
}
.gv-drawer-close:hover {
    background: var(--gv-color-primary);
    color: var(--gv-color-white);
}
.gv-drawer-body {
    flex: 1;
    overflow-y: auto;
    padding: var(--gv-space-6);
}
.gv-drawer-section {
    margin-bottom: var(--gv-space-6);
}
.gv-drawer-section label {
    display: block;
    font-size: var(--gv-text-sm);
    font-weight: var(--gv-weight-semibold);
    text-transform: uppercase;
    letter-spacing: var(--gv-tracking-wider);
    color: var(--gv-color-text-muted);
    margin-bottom: var(--gv-space-3);
}
.gv-drawer-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--gv-space-3);
}
.gv-drawer-footer {
    padding: var(--gv-space-5) var(--gv-space-6);
    border-top: 1px solid var(--gv-color-border);
    display: flex;
    gap: var(--gv-space-3);
}
.gv-drawer-footer button {
    flex: 1;
    height: 48px;
    border-radius: var(--gv-radius);
    border: none;
    font-weight: var(--gv-weight-semibold);
    cursor: pointer;
    transition: var(--gv-transition);
    font-size: var(--gv-text-base);
}
.gv-drawer-footer .gv-btn-clear {
    background: var(--gv-color-white);
    color: var(--gv-color-text);
    border: 1.5px solid var(--gv-color-border);
}
.gv-drawer-footer .gv-btn-apply {
    background: var(--gv-color-primary);
    color: var(--gv-color-white);
    box-shadow: var(--gv-shadow-red);
}
.gv-drawer-footer .gv-btn-apply:hover {
    background: var(--gv-color-primary-hover);
}

/* ============ BOTTOM BAR MOBILE ============ */
@media (max-width: 768px) {
    .gv-mobile-bottom-bar {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        background: var(--gv-color-white);
        border-top: 1px solid var(--gv-color-border);
        padding: var(--gv-space-3) var(--gv-space-4);
        z-index: 50;
        display: flex;
        gap: var(--gv-space-2);
        box-shadow: 0 -4px 20px rgba(0,0,0,0.08);
    }
    .gv-mobile-bottom-bar button {
        flex: 1;
        height: 44px;
        background: var(--gv-color-primary);
        color: var(--gv-color-white);
        border: none;
        border-radius: var(--gv-radius);
        font-weight: var(--gv-weight-bold);
        font-size: var(--gv-text-sm);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: var(--gv-space-2);
    }
    .page-propiedades {
        padding-bottom: 80px;
    }
    .gv-drawer {
        width: 100%;
    }
    .gv-filter-row {
        gap: var(--gv-space-2);
    }
    .gv-filter-row .gv-filter-select {
        min-width: 120px;
        flex: 1;
    }
}
@media (min-width: 769px) {
    .gv-mobile-bottom-bar { display: none; }
}

/* Ocultar el form viejo - estamos usando el nuevo */
.page-propiedades #propiedades_filtro.gv-legacy {
    display: none;
}

/* =====================================================================
 * REDISEÑO INDEX.PHP (home) - dvb 26/05/2026
 * Hero impactante + buscador + stats + cards + por que GVIA + CTA
 * ===================================================================== */

/* ============ HERO HOME ============ */
/* dvb 26/05/2026 - hero alineado con el padding-top de propiedades.php (mismo navbar fixed) */
.page-index .gv-home-hero {
    position: relative;
    min-height: 75vh;
    display: flex;
    align-items: center;
    background: linear-gradient(rgba(10,10,10,0.55), rgba(10,10,10,0.35) 40%, rgba(190,39,45,0.40)), url(img/web/slider1.jpg) center/cover no-repeat;
    color: var(--gv-color-white);
    overflow: hidden;
    /* mismo padding-top que propiedades.php para consistencia */
    padding: calc(var(--gv-space-16) + 80px) 0 var(--gv-space-16);
    text-align: center;
    margin-top: 0;
}
.page-index .gv-home-hero:after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 70% 50% at 50% 0%, rgba(190,39,45,0.20), transparent 70%);
    pointer-events: none;
}
.page-index .gv-home-hero .container {
    position: relative;
    z-index: 2;
    max-width: 1100px;
}
.page-index .gv-home-hero .gv-hero-tag {
    display: inline-block;
    background: rgba(255,255,255,0.12);
    border: 1px solid rgba(255,255,255,0.2);
    color: var(--gv-color-white);
    padding: 6px 18px;
    border-radius: var(--gv-radius-full);
    font-size: var(--gv-text-sm);
    font-weight: var(--gv-weight-semibold);
    letter-spacing: var(--gv-tracking-wide);
    margin-bottom: var(--gv-space-6);
    backdrop-filter: blur(10px);
}
.page-index .gv-home-hero h1 {
    color: var(--gv-color-white);
    font-size: var(--gv-text-6xl);
    font-weight: var(--gv-weight-extrabold);
    line-height: 1.1;
    letter-spacing: var(--gv-tracking-tighter);
    margin: 0 0 var(--gv-space-5);
    text-shadow: 0 4px 30px rgba(0,0,0,0.4);
}
.page-index .gv-home-hero .gv-hero-sub {
    color: rgba(255,255,255,0.92);
    font-size: var(--gv-text-xl);
    line-height: var(--gv-leading-relaxed);
    margin: 0 auto var(--gv-space-10);
    max-width: 700px;
    text-shadow: 0 1px 10px rgba(0,0,0,0.5);
}

/* Buscador hero (form pequeno con tipo + transaccion + boton) */
.page-index .gv-hero-search {
    background: rgba(255,255,255,0.97);
    border-radius: var(--gv-radius-full);
    padding: 6px;
    display: flex;
    gap: 4px;
    max-width: 720px;
    margin: 0 auto;
    box-shadow: var(--gv-shadow-2xl);
    backdrop-filter: blur(10px);
}
.page-index .gv-hero-search select {
    flex: 1;
    border: none !important;
    background: transparent !important;
    height: 56px;
    padding: 0 var(--gv-space-5) !important;
    font-size: var(--gv-text-base) !important;
    font-weight: var(--gv-weight-semibold);
    color: var(--gv-color-text) !important;
    border-radius: var(--gv-radius-full) !important;
    box-shadow: none !important;
    min-width: 0;
}
.page-index .gv-hero-search select:focus {
    outline: none;
    box-shadow: inset 0 0 0 2px var(--gv-color-primary-light) !important;
}
.page-index .gv-hero-search a.gv-hero-search-btn {
    background: var(--gv-color-primary);
    color: var(--gv-color-white) !important;
    border-radius: var(--gv-radius-full);
    padding: 0 var(--gv-space-8);
    display: inline-flex;
    align-items: center;
    gap: var(--gv-space-2);
    font-weight: var(--gv-weight-bold);
    font-size: var(--gv-text-base);
    text-decoration: none !important;
    transition: var(--gv-transition);
    box-shadow: var(--gv-shadow-red);
    line-height: 56px;
    height: 56px;
}
.page-index .gv-hero-search a.gv-hero-search-btn:hover {
    background: var(--gv-color-primary-hover);
    transform: scale(1.03);
    box-shadow: var(--gv-shadow-red-lg);
}

@media (max-width: 768px) {
    .page-index .gv-home-hero {
        min-height: 70vh;
        padding: calc(70px + var(--gv-space-10)) 0 var(--gv-space-10);
    }
    .page-index .gv-home-hero h1 {
        font-size: var(--gv-text-4xl);
    }
    .page-index .gv-home-hero .gv-hero-sub {
        font-size: var(--gv-text-base);
    }
    .page-index .gv-hero-search {
        flex-direction: column;
        border-radius: var(--gv-radius-lg);
        padding: var(--gv-space-3);
        gap: var(--gv-space-2);
    }
    .page-index .gv-hero-search select {
        height: 48px;
        border-radius: var(--gv-radius) !important;
        background: var(--gv-color-gray-50) !important;
    }
    .page-index .gv-hero-search a.gv-hero-search-btn {
        height: 52px;
        line-height: 52px;
        justify-content: center;
        border-radius: var(--gv-radius);
    }
}

/* ============ STATS / TRUST ============ */
.page-index .gv-stats {
    background: var(--gv-color-white);
    padding: var(--gv-space-12) 0;
    border-bottom: 1px solid var(--gv-color-border);
}
.page-index .gv-stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: var(--gv-space-6);
    text-align: center;
}
.page-index .gv-stat {
    padding: var(--gv-space-4);
}
.page-index .gv-stat .gv-stat-num {
    font-size: var(--gv-text-5xl);
    font-weight: var(--gv-weight-extrabold);
    color: var(--gv-color-primary);
    line-height: 1;
    letter-spacing: var(--gv-tracking-tighter);
    margin-bottom: var(--gv-space-2);
}
.page-index .gv-stat .gv-stat-lbl {
    font-size: var(--gv-text-base);
    color: var(--gv-color-text-muted);
    text-transform: uppercase;
    letter-spacing: var(--gv-tracking-wider);
    font-weight: var(--gv-weight-semibold);
}

/* ============ CATEGORIAS (4 botones del home) ============ */
.page-index .gv-categorias {
    padding: var(--gv-space-16) 0;
    background: var(--gv-color-gray-50);
}
.page-index .gv-categorias .gv-section-head {
    text-align: center;
    margin-bottom: var(--gv-space-12);
}
.page-index .gv-categorias .gv-section-head h2 {
    font-size: var(--gv-text-4xl);
    font-weight: var(--gv-weight-extrabold);
    color: var(--gv-color-text);
    margin: 0 0 var(--gv-space-3);
    letter-spacing: var(--gv-tracking-tight);
}
.page-index .gv-categorias .gv-section-head p {
    font-size: var(--gv-text-lg);
    color: var(--gv-color-text-muted);
    max-width: 600px;
    margin: 0 auto;
}
.page-index .gv-categorias-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: var(--gv-space-6);
}
.page-index .gv-cat-card {
    background: var(--gv-color-white);
    border-radius: var(--gv-radius-lg);
    overflow: hidden;
    text-decoration: none !important;
    color: inherit !important;
    display: block;
    border: 1px solid var(--gv-color-border);
    transition: var(--gv-transition);
    position: relative;
}
.page-index .gv-cat-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--gv-shadow-xl);
    border-color: transparent;
}
.page-index .gv-cat-card .gv-cat-img {
    position: relative;
    aspect-ratio: 16/10;
    overflow: hidden;
    background: var(--gv-color-gray-100);
}
.page-index .gv-cat-card .gv-cat-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 600ms var(--gv-ease);
}
.page-index .gv-cat-card:hover .gv-cat-img img {
    transform: scale(1.08);
}
.page-index .gv-cat-card .gv-cat-img:after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 30%, rgba(0,0,0,0.7) 100%);
}
.page-index .gv-cat-card .gv-cat-icon {
    position: absolute;
    top: var(--gv-space-4);
    right: var(--gv-space-4);
    width: 54px;
    height: 54px;
    background: rgba(255,255,255,0.95);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--gv-color-primary);
    font-size: var(--gv-text-xl);
    z-index: 2;
    transition: var(--gv-transition);
}
.page-index .gv-cat-card:hover .gv-cat-icon {
    background: var(--gv-color-primary);
    color: var(--gv-color-white);
    transform: rotate(5deg) scale(1.1);
}
.page-index .gv-cat-card .gv-cat-title {
    position: absolute;
    bottom: var(--gv-space-4);
    left: var(--gv-space-5);
    right: var(--gv-space-5);
    color: var(--gv-color-white);
    font-size: var(--gv-text-xl);
    font-weight: var(--gv-weight-bold);
    z-index: 2;
    letter-spacing: var(--gv-tracking-tight);
}
.page-index .gv-cat-card .gv-cat-body {
    padding: var(--gv-space-5);
}
.page-index .gv-cat-card .gv-cat-body p {
    color: var(--gv-color-text-muted);
    font-size: var(--gv-text-base);
    margin: 0;
    line-height: var(--gv-leading-relaxed);
}
.page-index .gv-cat-card .gv-cat-cta {
    display: inline-flex;
    align-items: center;
    gap: var(--gv-space-1);
    margin-top: var(--gv-space-3);
    color: var(--gv-color-primary);
    font-weight: var(--gv-weight-bold);
    font-size: var(--gv-text-sm);
}
.page-index .gv-cat-card:hover .gv-cat-cta {
    gap: var(--gv-space-2);
}

/* ============ POR QUE GVIA (4 features) ============ */
.page-index .gv-porque {
    padding: var(--gv-space-16) 0;
    background: var(--gv-color-white);
}
.page-index .gv-porque .gv-section-head {
    text-align: center;
    margin-bottom: var(--gv-space-12);
}
.page-index .gv-porque .gv-section-head h2 {
    font-size: var(--gv-text-4xl);
    font-weight: var(--gv-weight-extrabold);
    color: var(--gv-color-text);
    margin: 0 0 var(--gv-space-3);
    letter-spacing: var(--gv-tracking-tight);
}
.page-index .gv-porque .gv-section-head p {
    font-size: var(--gv-text-lg);
    color: var(--gv-color-text-muted);
    max-width: 650px;
    margin: 0 auto;
}
.page-index .gv-porque-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: var(--gv-space-8);
}
.page-index .gv-porque-card {
    text-align: center;
    padding: var(--gv-space-6);
    border-radius: var(--gv-radius-lg);
    transition: var(--gv-transition);
}
.page-index .gv-porque-card:hover {
    background: var(--gv-color-gray-50);
    transform: translateY(-4px);
}
.page-index .gv-porque-card .gv-porque-ico {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--gv-color-primary), var(--gv-color-primary-dark));
    color: var(--gv-color-white);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: var(--gv-text-3xl);
    margin: 0 auto var(--gv-space-5);
    box-shadow: var(--gv-shadow-red);
    transition: var(--gv-transition);
}
.page-index .gv-porque-card:hover .gv-porque-ico {
    transform: scale(1.1) rotate(-5deg);
    box-shadow: var(--gv-shadow-red-lg);
}
.page-index .gv-porque-card h3 {
    font-size: var(--gv-text-xl);
    font-weight: var(--gv-weight-bold);
    color: var(--gv-color-text);
    margin: 0 0 var(--gv-space-3);
}
.page-index .gv-porque-card p {
    color: var(--gv-color-text-muted);
    line-height: var(--gv-leading-relaxed);
    font-size: var(--gv-text-base);
    margin: 0 0 var(--gv-space-4);
}
.page-index .gv-porque-card a {
    display: inline-flex;
    align-items: center;
    gap: var(--gv-space-1);
    color: var(--gv-color-primary);
    font-weight: var(--gv-weight-bold);
    font-size: var(--gv-text-sm);
    text-transform: uppercase;
    letter-spacing: var(--gv-tracking-wider);
    transition: var(--gv-transition-fast);
}
.page-index .gv-porque-card a:hover {
    gap: var(--gv-space-2);
}

/* ============ CTA BANNER FINAL ============ */
.page-index .gv-cta-banner {
    background: linear-gradient(135deg, var(--gv-color-gray-900), var(--gv-color-black));
    color: var(--gv-color-white);
    padding: var(--gv-space-16) 0;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.page-index .gv-cta-banner:before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 80% 60% at 50% 100%, rgba(190,39,45,0.30), transparent 70%);
}
.page-index .gv-cta-banner .container {
    position: relative;
    z-index: 1;
}
.page-index .gv-cta-banner h2 {
    color: var(--gv-color-white);
    font-size: var(--gv-text-4xl);
    font-weight: var(--gv-weight-extrabold);
    margin: 0 0 var(--gv-space-5);
    letter-spacing: var(--gv-tracking-tight);
}
.page-index .gv-cta-banner p {
    color: rgba(255,255,255,0.85);
    font-size: var(--gv-text-lg);
    max-width: 700px;
    margin: 0 auto var(--gv-space-8);
    line-height: var(--gv-leading-relaxed);
}
.page-index .gv-cta-banner .gv-cta-btn {
    display: inline-flex;
    align-items: center;
    gap: var(--gv-space-3);
    background: var(--gv-color-primary);
    color: var(--gv-color-white);
    padding: var(--gv-space-5) var(--gv-space-12);
    border-radius: var(--gv-radius-full);
    font-size: var(--gv-text-lg);
    font-weight: var(--gv-weight-bold);
    box-shadow: var(--gv-shadow-red-lg);
    transition: var(--gv-transition);
    text-decoration: none !important;
    letter-spacing: var(--gv-tracking-wide);
}
.page-index .gv-cta-banner .gv-cta-btn:hover {
    background: var(--gv-color-primary-hover);
    transform: translateY(-3px) scale(1.03);
    box-shadow: 0 20px 50px rgba(190,39,45,0.55);
    color: var(--gv-color-white);
}

@media (max-width: 768px) {
    .page-index .gv-stats { padding: var(--gv-space-10) 0; }
    .page-index .gv-stat .gv-stat-num { font-size: var(--gv-text-4xl); }
    .page-index .gv-categorias, .page-index .gv-porque, .page-index .gv-cta-banner { padding: var(--gv-space-12) 0; }
    .page-index .gv-categorias .gv-section-head h2,
    .page-index .gv-porque .gv-section-head h2,
    .page-index .gv-cta-banner h2 { font-size: var(--gv-text-3xl); }
}

/* =====================================================================
 * COMPONENTES COMUNES: hero de pagina, form moderno, cards
 * dvb 26/05/2026 - reutilizables en contact.php / ofrece.php / team.php
 * ===================================================================== */

/* Hero compacto (no como home) */
.gv-page-hero {
    background: linear-gradient(135deg, #0a0a0a 0%, #262626 70%, var(--gv-color-primary-dark) 130%);
    color: var(--gv-color-white);
    padding: calc(var(--gv-space-16) + 80px) 0 var(--gv-space-12);
    text-align: center;
    position: relative;
    overflow: hidden;
}
.gv-page-hero:after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 70% 50% at 50% 0%, rgba(190,39,45,0.20), transparent 70%);
    pointer-events: none;
}
.gv-page-hero .container { position: relative; z-index: 1; }
.gv-page-hero .gv-hero-tag {
    display: inline-block;
    background: rgba(255,255,255,0.12);
    border: 1px solid rgba(255,255,255,0.2);
    color: var(--gv-color-white);
    padding: 6px 18px;
    border-radius: var(--gv-radius-full);
    font-size: var(--gv-text-sm);
    font-weight: var(--gv-weight-semibold);
    letter-spacing: var(--gv-tracking-wide);
    margin-bottom: var(--gv-space-5);
}
.gv-page-hero h1 {
    color: var(--gv-color-white);
    font-size: var(--gv-text-5xl);
    font-weight: var(--gv-weight-extrabold);
    line-height: 1.1;
    letter-spacing: var(--gv-tracking-tighter);
    margin: 0 0 var(--gv-space-4);
    text-shadow: 0 4px 30px rgba(0,0,0,0.4);
}
.gv-page-hero p.lead {
    color: rgba(255,255,255,0.92);
    font-size: var(--gv-text-xl);
    max-width: 720px;
    margin: 0 auto;
    text-shadow: 0 1px 10px rgba(0,0,0,0.4);
}
@media (max-width: 768px) {
    .gv-page-hero {
        padding-top: calc(var(--gv-space-10) + 70px);
        padding-bottom: var(--gv-space-10);
    }
    .gv-page-hero h1 { font-size: var(--gv-text-3xl); }
    .gv-page-hero p.lead { font-size: var(--gv-text-base); }
}

/* Form moderno (vertical, sin labels en columnas) */
.gv-form {
    background: var(--gv-color-white);
    border-radius: var(--gv-radius-lg);
    padding: var(--gv-space-8) var(--gv-space-8);
    box-shadow: var(--gv-shadow-lg);
    border: 1px solid var(--gv-color-border);
}
.gv-form .gv-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--gv-space-5);
    margin-bottom: var(--gv-space-5);
}
@media (max-width: 768px) {
    .gv-form { padding: var(--gv-space-6); }
    .gv-form .gv-form-row { grid-template-columns: 1fr; gap: var(--gv-space-4); margin-bottom: var(--gv-space-4); }
}
.gv-form .gv-form-group { margin-bottom: var(--gv-space-5); }
.gv-form label {
    display: block;
    font-size: var(--gv-text-sm);
    font-weight: var(--gv-weight-semibold);
    color: var(--gv-color-text);
    margin-bottom: var(--gv-space-2);
}
.gv-form .form-control,
.gv-form input[type="text"],
.gv-form input[type="email"],
.gv-form input[type="tel"],
.gv-form select,
.gv-form textarea {
    width: 100%;
    border: 1.5px solid var(--gv-color-border) !important;
    border-radius: var(--gv-radius) !important;
    padding: var(--gv-space-3) var(--gv-space-4) !important;
    font-size: var(--gv-text-base) !important;
    min-height: 48px !important;
    background: var(--gv-color-white) !important;
    color: var(--gv-color-text) !important;
    transition: var(--gv-transition-fast);
    box-shadow: none !important;
}
.gv-form .form-control:focus {
    border-color: var(--gv-color-primary) !important;
    box-shadow: 0 0 0 3px var(--gv-color-primary-light) !important;
    outline: none;
}
.gv-form textarea {
    min-height: 120px !important;
    resize: vertical;
}
.gv-form-actions {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: var(--gv-space-5);
    margin-top: var(--gv-space-6);
    padding-top: var(--gv-space-6);
    border-top: 1px solid var(--gv-color-border);
}
@media (max-width: 768px) {
    .gv-form-actions { flex-direction: column; align-items: stretch; gap: var(--gv-space-3); }
}
.gv-form-actions button {
    background: var(--gv-color-primary) !important;
    color: var(--gv-color-white) !important;
    border: none !important;
    padding: var(--gv-space-3) var(--gv-space-10) !important;
    border-radius: var(--gv-radius) !important;
    font-weight: var(--gv-weight-bold) !important;
    font-size: var(--gv-text-base) !important;
    min-height: 52px !important;
    cursor: pointer;
    transition: var(--gv-transition);
    box-shadow: var(--gv-shadow-red) !important;
    display: inline-flex;
    align-items: center;
    gap: var(--gv-space-2);
}
.gv-form-actions button:hover {
    background: var(--gv-color-primary-hover) !important;
    transform: translateY(-2px);
    box-shadow: var(--gv-shadow-red-lg) !important;
}

/* Card de ubicacion/info */
.gv-info-card {
    background: var(--gv-color-white);
    border-radius: var(--gv-radius-lg);
    overflow: hidden;
    box-shadow: var(--gv-shadow-lg);
    border: 1px solid var(--gv-color-border);
    height: 100%;
}
.gv-info-card .gv-info-header {
    background: linear-gradient(135deg, var(--gv-color-primary), var(--gv-color-primary-dark));
    color: var(--gv-color-white);
    padding: var(--gv-space-6);
}
.gv-info-card .gv-info-header h3 {
    margin: 0 0 var(--gv-space-2);
    font-size: var(--gv-text-2xl);
    font-weight: var(--gv-weight-bold);
    color: var(--gv-color-white);
}
.gv-info-card .gv-info-header p {
    margin: 0;
    color: rgba(255,255,255,0.9);
    font-size: var(--gv-text-base);
}
.gv-info-card .gv-info-body {
    padding: var(--gv-space-6);
}
.gv-info-card .gv-info-list { list-style: none; padding: 0; margin: 0; }
.gv-info-card .gv-info-list li {
    display: flex;
    align-items: flex-start;
    gap: var(--gv-space-3);
    padding: var(--gv-space-3) 0;
    border-bottom: 1px solid var(--gv-color-border);
    font-size: var(--gv-text-base);
}
.gv-info-card .gv-info-list li:last-child { border-bottom: none; }
.gv-info-card .gv-info-list li i {
    color: var(--gv-color-primary);
    width: 24px;
    text-align: center;
    flex-shrink: 0;
    margin-top: 4px;
}
.gv-info-card .gv-info-list li a {
    color: var(--gv-color-text);
    transition: color var(--gv-duration-fast);
}
.gv-info-card .gv-info-list li a:hover { color: var(--gv-color-primary); }

/* Pasos / value props (para ofrece.php) */
.gv-steps {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: var(--gv-space-6);
    margin: var(--gv-space-10) 0;
}
.gv-step {
    text-align: center;
    padding: var(--gv-space-6);
}
.gv-step .gv-step-num {
    width: 60px;
    height: 60px;
    background: var(--gv-color-primary);
    color: var(--gv-color-white);
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: var(--gv-text-2xl);
    font-weight: var(--gv-weight-extrabold);
    margin-bottom: var(--gv-space-4);
    box-shadow: var(--gv-shadow-red);
}
.gv-step h4 {
    margin: 0 0 var(--gv-space-2);
    font-size: var(--gv-text-lg);
    font-weight: var(--gv-weight-bold);
    color: var(--gv-color-text);
}
.gv-step p {
    margin: 0;
    color: var(--gv-color-text-muted);
    font-size: var(--gv-text-base);
    line-height: var(--gv-leading-relaxed);
}

/* Sección genérica con fondo claro */
.gv-section { padding: var(--gv-space-16) 0; }
.gv-section.gv-bg-alt { background: var(--gv-color-gray-50); }

/* TEAM: buscador prominente + gerencia cards */
.gv-team-search {
    background: var(--gv-color-white);
    border-radius: var(--gv-radius-lg);
    padding: var(--gv-space-6);
    box-shadow: var(--gv-shadow);
    max-width: 720px;
    margin: 0 auto var(--gv-space-12);
}
.gv-team-search label {
    display: block;
    font-size: var(--gv-text-base);
    font-weight: var(--gv-weight-semibold);
    margin-bottom: var(--gv-space-3);
    color: var(--gv-color-text);
    text-align: center;
}
.gv-team-search select {
    width: 100%;
    border: 1.5px solid var(--gv-color-border) !important;
    border-radius: var(--gv-radius) !important;
    padding: var(--gv-space-3) var(--gv-space-4) !important;
    min-height: 52px !important;
    font-size: var(--gv-text-base) !important;
    background: var(--gv-color-white) !important;
}

.gv-gerencia-card {
    background: var(--gv-color-white);
    border-radius: var(--gv-radius-lg);
    overflow: hidden;
    box-shadow: var(--gv-shadow);
    margin-bottom: var(--gv-space-8);
    border: 1px solid var(--gv-color-border);
    display: grid;
    grid-template-columns: 200px 1fr;
    gap: var(--gv-space-6);
    padding: var(--gv-space-6);
    align-items: start;
}
@media (max-width: 768px) {
    .gv-gerencia-card {
        grid-template-columns: 1fr;
        gap: var(--gv-space-4);
        text-align: center;
    }
}
.gv-gerencia-card .gv-gerente-foto img {
    width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
    border-radius: var(--gv-radius-md);
    border: 3px solid var(--gv-color-primary);
}
.gv-gerencia-card .gv-gerente-info h3 {
    margin: 0 0 var(--gv-space-2);
    font-size: var(--gv-text-xl);
    font-weight: var(--gv-weight-bold);
    color: var(--gv-color-text);
}
.gv-gerencia-card .gv-gerente-badge {
    display: inline-block;
    background: var(--gv-color-primary-light);
    color: var(--gv-color-primary);
    font-size: var(--gv-text-xs);
    font-weight: var(--gv-weight-bold);
    text-transform: uppercase;
    letter-spacing: var(--gv-tracking-wider);
    padding: 4px 10px;
    border-radius: var(--gv-radius-full);
    margin-bottom: var(--gv-space-3);
}
.gv-gerencia-card .gv-gerente-contact {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: var(--gv-space-4);
    margin-top: var(--gv-space-3);
}
.gv-gerencia-card .gv-gerente-contact li {
    display: inline-flex;
    align-items: center;
    gap: var(--gv-space-2);
    color: var(--gv-color-text-muted);
    font-size: var(--gv-text-sm);
}
.gv-gerencia-card .gv-gerente-contact i { color: var(--gv-color-primary); }
.gv-gerencia-card .gv-gerente-contact a { color: var(--gv-color-text); }
.gv-gerencia-card .gv-gerente-contact a:hover { color: var(--gv-color-primary); }

.gv-asesores-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: var(--gv-space-4);
    margin-top: var(--gv-space-4);
}
.gv-asesor-card {
    background: var(--gv-color-white);
    border-radius: var(--gv-radius-md);
    padding: var(--gv-space-4);
    text-align: center;
    border: 1px solid var(--gv-color-border);
    transition: var(--gv-transition);
}
.gv-asesor-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--gv-shadow-lg);
    border-color: var(--gv-color-primary);
}
.gv-asesor-card img {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid var(--gv-color-gray-200);
    margin: 0 auto var(--gv-space-3);
    display: block;
}
.gv-asesor-card h4 {
    margin: 0 0 var(--gv-space-2);
    font-size: var(--gv-text-base);
    font-weight: var(--gv-weight-semibold);
    color: var(--gv-color-text);
    line-height: 1.2;
}
.gv-asesor-card .gv-asesor-count {
    font-size: var(--gv-text-xs);
    color: var(--gv-color-primary);
    font-weight: var(--gv-weight-bold);
    text-transform: uppercase;
    letter-spacing: var(--gv-tracking-wider);
}

/* =====================================================================
 * 13. Animaciones reveal on scroll (aplicar via JS o clases)
 * ===================================================================== */
.gv-reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity var(--gv-duration-slow) var(--gv-ease),
                transform var(--gv-duration-slow) var(--gv-ease);
}

.gv-reveal.gv-visible {
    opacity: 1;
    transform: translateY(0);
}

/* =====================================================================
 * 14. Scrollbar custom
 * ===================================================================== */
::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-track {
    background: var(--gv-color-gray-100);
}

::-webkit-scrollbar-thumb {
    background: var(--gv-color-gray-400);
    border-radius: var(--gv-radius-full);
}

::-webkit-scrollbar-thumb:hover {
    background: var(--gv-color-primary);
}

/* =====================================================================
 * NUEVO: Pagina de detalle de propiedad - rediseño completo
 * dvb 25/05/2026
 * ===================================================================== */

.page-propiedad {
    background: var(--gv-color-white);
}

/* Breadcrumb compacto */
.prop-breadcrumb {
    background: var(--gv-color-gray-50);
    padding: var(--gv-space-4) 0;
    font-size: var(--gv-text-sm);
    color: var(--gv-color-text-muted);
    border-bottom: 1px solid var(--gv-color-border);
}
.prop-breadcrumb a {
    color: var(--gv-color-text-muted);
    transition: color var(--gv-duration-fast) var(--gv-ease);
}
.prop-breadcrumb a:hover {
    color: var(--gv-color-primary);
}
.prop-breadcrumb .sep {
    margin: 0 var(--gv-space-2);
    color: var(--gv-color-gray-300);
}

/* Hero compacto de la propiedad */
.prop-hero {
    background: var(--gv-color-white);
    padding: var(--gv-space-8) 0 var(--gv-space-6);
    border-bottom: 1px solid var(--gv-color-border);
}

.prop-hero .prop-tag {
    display: inline-block;
    background: var(--gv-color-primary-light);
    color: var(--gv-color-primary);
    font-size: var(--gv-text-xs);
    font-weight: var(--gv-weight-bold);
    padding: 4px 12px;
    border-radius: var(--gv-radius-full);
    letter-spacing: var(--gv-tracking-wider);
    text-transform: uppercase;
    margin-bottom: var(--gv-space-3);
}

.prop-hero h1 {
    font-size: var(--gv-text-4xl);
    font-weight: var(--gv-weight-extrabold);
    color: var(--gv-color-text);
    letter-spacing: var(--gv-tracking-tight);
    line-height: 1.15;
    margin: 0 0 var(--gv-space-3);
}

@media (min-width: 769px) {
    .prop-hero h1 {
        font-size: var(--gv-text-5xl);
    }
}

.prop-hero .prop-ubicacion {
    font-size: var(--gv-text-lg);
    color: var(--gv-color-text-muted);
    margin-bottom: var(--gv-space-5);
}
.prop-hero .prop-ubicacion i {
    color: var(--gv-color-primary);
    margin-right: var(--gv-space-2);
}

.prop-hero .prop-precio-big {
    font-size: var(--gv-text-4xl);
    font-weight: var(--gv-weight-extrabold);
    color: var(--gv-color-primary);
    letter-spacing: var(--gv-tracking-tight);
    line-height: 1;
}
@media (min-width: 769px) {
    .prop-hero .prop-precio-big {
        font-size: var(--gv-text-5xl);
    }
}

.prop-hero .prop-precio-label {
    display: block;
    font-size: var(--gv-text-xs);
    font-weight: var(--gv-weight-semibold);
    text-transform: uppercase;
    letter-spacing: var(--gv-tracking-wider);
    color: var(--gv-color-text-muted);
    margin-bottom: var(--gv-space-1);
}

/* Stats grid (rec / baños / m2 / cajones) - chips horizontales */
.prop-stats {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gv-space-4);
    margin: var(--gv-space-6) 0;
    padding: var(--gv-space-5) 0;
    border-top: 1px solid var(--gv-color-border);
    border-bottom: 1px solid var(--gv-color-border);
}

.prop-stat {
    display: flex;
    align-items: center;
    gap: var(--gv-space-2);
    padding: 0 var(--gv-space-3);
}
.prop-stat:not(:last-child) {
    border-right: 1px solid var(--gv-color-border);
}
.prop-stat i {
    color: var(--gv-color-primary);
    font-size: var(--gv-text-xl);
}
.prop-stat .num {
    font-size: var(--gv-text-xl);
    font-weight: var(--gv-weight-bold);
    color: var(--gv-color-text);
    line-height: 1;
}
.prop-stat .lbl {
    font-size: var(--gv-text-xs);
    color: var(--gv-color-text-muted);
    text-transform: uppercase;
    letter-spacing: var(--gv-tracking-wider);
    margin-left: var(--gv-space-1);
}

/* Acciones rapidas: compartir / pdf / recomendar - dentro del body */
.prop-actions {
    display: flex;
    gap: var(--gv-space-3);
    flex-wrap: wrap;
    justify-content: flex-start;
}
.prop-action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--gv-space-2);
    padding: var(--gv-space-3) var(--gv-space-5);
    height: 48px;
    border-radius: var(--gv-radius-full);
    background: var(--gv-color-gray-100);
    color: var(--gv-color-text);
    transition: var(--gv-transition-fast);
    border: 1.5px solid var(--gv-color-border);
    font-size: var(--gv-text-base);
    font-weight: var(--gv-weight-semibold);
    text-decoration: none;
}
.prop-action-btn:hover {
    background: var(--gv-color-primary);
    color: var(--gv-color-white);
    border-color: var(--gv-color-primary);
    transform: translateY(-2px);
    box-shadow: var(--gv-shadow-red);
}
.prop-action-btn i {
    font-size: var(--gv-text-lg);
}
.prop-action-btn img {
    width: 22px;
    height: 22px;
}
@media (max-width: 768px) {
    .prop-actions {
        gap: var(--gv-space-2);
    }
    .prop-action-btn {
        padding: var(--gv-space-2) var(--gv-space-3);
        font-size: var(--gv-text-sm);
        height: 42px;
    }
    .prop-action-btn span {
        display: none; /* solo iconos en mobile para ahorrar espacio */
    }
}

/* Galeria inline (dentro de col-md-8, no full-width) */
.prop-gallery-inline {
    background: var(--gv-color-gray-900);
    border-radius: var(--gv-radius-md);
    overflow: hidden;
    margin-bottom: var(--gv-space-8);
    box-shadow: var(--gv-shadow-lg);
}
.prop-gallery-inline .carousel {
    background: var(--gv-color-gray-900);
}
.prop-gallery-inline .carousel-inner > .item {
    text-align: center;
    background: var(--gv-color-gray-900);
}
.prop-gallery-inline .carousel-inner > .item > img {
    max-height: 500px;
    width: auto;
    max-width: 100%;
    margin: 0 auto;
    object-fit: contain;
    cursor: zoom-in;
}
@media (max-width: 768px) {
    .prop-gallery-inline .carousel-inner > .item > img {
        max-height: 320px;
    }
}

.prop-gallery-inline .carousel-control {
    background: rgba(0,0,0,0.5) !important;
    background-image: none !important;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    top: 50%;
    transform: translateY(-50%);
    opacity: 0.85;
    transition: var(--gv-transition);
    bottom: auto;
    text-shadow: none;
}
.prop-gallery-inline .carousel-control:hover {
    background: var(--gv-color-primary) !important;
    opacity: 1;
}
.prop-gallery-inline .carousel-control.left  { left: 15px; }
.prop-gallery-inline .carousel-control.right { right: 15px; }
.prop-gallery-inline .carousel-indicators {
    bottom: 15px;
}
.prop-gallery-inline .carousel-indicators li {
    background: rgba(255,255,255,0.4);
    border-color: transparent;
    width: 8px;
    height: 8px;
    margin: 0 4px;
}
.prop-gallery-inline .carousel-indicators .active {
    background: var(--gv-color-primary);
    width: 24px;
    border-radius: 4px;
}

/* Body de la propiedad - 2 columnas */
.prop-body {
    padding: var(--gv-space-12) 0;
}

.prop-body h2 {
    font-size: var(--gv-text-2xl);
    font-weight: var(--gv-weight-bold);
    color: var(--gv-color-text);
    margin: 0 0 var(--gv-space-5);
    letter-spacing: var(--gv-tracking-tight);
    position: relative;
    padding-bottom: var(--gv-space-3);
}
.prop-body h2:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 40px;
    height: 3px;
    background: var(--gv-color-primary);
    border-radius: 2px;
}

.prop-body .prop-section {
    margin-bottom: var(--gv-space-12);
}

.prop-body .prop-descripcion {
    font-size: var(--gv-text-base);
    line-height: var(--gv-leading-relaxed);
    color: var(--gv-color-text);
}

/* Grid de caracteristicas con iconos */
.prop-features-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: var(--gv-space-4);
}
.prop-feature {
    background: var(--gv-color-gray-50);
    border-radius: var(--gv-radius-md);
    padding: var(--gv-space-5);
    border: 1px solid var(--gv-color-border);
    transition: var(--gv-transition-fast);
}
.prop-feature:hover {
    border-color: var(--gv-color-primary);
    background: var(--gv-color-white);
    box-shadow: var(--gv-shadow);
}
.prop-feature i {
    color: var(--gv-color-primary);
    font-size: var(--gv-text-2xl);
    margin-bottom: var(--gv-space-3);
    display: block;
}
.prop-feature .num {
    font-size: var(--gv-text-2xl);
    font-weight: var(--gv-weight-bold);
    color: var(--gv-color-text);
    line-height: 1;
    margin-bottom: var(--gv-space-1);
}
.prop-feature .lbl {
    font-size: var(--gv-text-sm);
    color: var(--gv-color-text-muted);
    text-transform: uppercase;
    letter-spacing: var(--gv-tracking-wide);
    font-weight: var(--gv-weight-medium);
}

/* Amenidades / extras - lista en grid (deprecated, ahora va en sidebar) */
.prop-amenities {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: var(--gv-space-3);
}
.prop-amenity {
    display: flex;
    align-items: center;
    gap: var(--gv-space-3);
    padding: var(--gv-space-3);
    background: var(--gv-color-white);
    border-radius: var(--gv-radius);
    border: 1px solid var(--gv-color-border);
}
.prop-amenity i {
    color: var(--gv-color-primary);
    font-size: var(--gv-text-lg);
    flex-shrink: 0;
}

/* Amenidades en sidebar - debajo del card del asesor */
.prop-amenities-card {
    background: var(--gv-color-white);
    border-radius: var(--gv-radius-md);
    box-shadow: var(--gv-shadow);
    padding: var(--gv-space-6);
    border: 1px solid var(--gv-color-border);
    margin-top: var(--gv-space-5);
}
/* dvb 25/05/2026 - h2 del card usa el MISMO estilo que los h2 del body
   (con subrayado rojo) para consistencia tipografica. */
.prop-amenities-card h2 {
    font-size: var(--gv-text-2xl);
    font-weight: var(--gv-weight-bold);
    color: var(--gv-color-text);
    letter-spacing: var(--gv-tracking-tight);
    margin: 0 0 var(--gv-space-5);
    padding-bottom: var(--gv-space-3);
    position: relative;
}
.prop-amenities-card h2:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 40px;
    height: 3px;
    background: var(--gv-color-primary);
    border-radius: 2px;
}
.prop-amenities-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--gv-space-3);
}
.prop-amenities-list li {
    display: flex;
    align-items: center;
    gap: var(--gv-space-3);
    font-size: var(--gv-text-base);
    color: var(--gv-color-text);
    padding: var(--gv-space-2) 0;
    transition: var(--gv-transition-fast);
}
.prop-amenities-list li:hover {
    color: var(--gv-color-primary);
}
.prop-amenities-list li i {
    color: var(--gv-color-primary);
    font-size: var(--gv-text-lg);
    width: 24px;
    text-align: center;
    flex-shrink: 0;
}
@media (max-width: 480px) {
    .prop-amenities-list {
        grid-template-columns: 1fr;
    }
}

/* Sidebar (asesor + contact form)
   dvb 25/05/2026 - sticky al nivel de la galeria del lado izquierdo */
.prop-sidebar {
    position: sticky;
    top: var(--gv-space-4);
}
@media (max-width: 991px) {
    .prop-sidebar {
        position: static;
        margin-top: var(--gv-space-8);
    }
}

.prop-asesor-card {
    background: var(--gv-color-white);
    border-radius: var(--gv-radius-md);
    box-shadow: var(--gv-shadow-lg);
    padding: var(--gv-space-6);
    border: 1px solid var(--gv-color-border);
    margin-bottom: var(--gv-space-6);
}

.prop-asesor-card .asesor-foto {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    object-fit: cover;
    margin: 0 auto var(--gv-space-4);
    display: block;
    border: 3px solid var(--gv-color-primary);
    padding: 3px;
    background: var(--gv-color-white);
}

.prop-asesor-card .asesor-label {
    text-align: center;
    font-size: var(--gv-text-xs);
    font-weight: var(--gv-weight-bold);
    color: var(--gv-color-primary);
    text-transform: uppercase;
    letter-spacing: var(--gv-tracking-wider);
    margin-bottom: var(--gv-space-2);
}

.prop-asesor-card .asesor-nombre {
    text-align: center;
    font-size: var(--gv-text-xl);
    font-weight: var(--gv-weight-bold);
    color: var(--gv-color-text);
    margin: 0 0 var(--gv-space-4);
}

.prop-asesor-card .asesor-contact-list {
    list-style: none;
    padding: 0;
    margin: 0 0 var(--gv-space-5);
    border-top: 1px solid var(--gv-color-border);
}
.prop-asesor-card .asesor-contact-list li {
    padding: var(--gv-space-3) 0;
    border-bottom: 1px solid var(--gv-color-border);
    font-size: var(--gv-text-sm);
}
.prop-asesor-card .asesor-contact-list li a,
.prop-asesor-card .asesor-contact-list li span {
    display: flex;
    align-items: center;
    gap: var(--gv-space-3);
    color: var(--gv-color-text);
    transition: var(--gv-transition-fast);
    word-break: break-all;
}
.prop-asesor-card .asesor-contact-list li a:hover {
    color: var(--gv-color-primary);
}
.prop-asesor-card .asesor-contact-list li i {
    color: var(--gv-color-primary);
    width: 18px;
    text-align: center;
    flex-shrink: 0;
}

.prop-asesor-card .asesor-cta-stack {
    display: flex;
    flex-direction: column;
    gap: var(--gv-space-3);
}
.prop-asesor-card .asesor-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--gv-space-2);
    padding: var(--gv-space-3) var(--gv-space-4);
    border-radius: var(--gv-radius);
    font-weight: var(--gv-weight-semibold);
    transition: var(--gv-transition);
    text-decoration: none;
    font-size: var(--gv-text-base);
    min-height: 48px;
}
.prop-asesor-card .asesor-cta-wa {
    background: #25D366;
    color: var(--gv-color-white);
    box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3);
}
.prop-asesor-card .asesor-cta-wa:hover {
    background: #1da851;
    color: var(--gv-color-white);
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(37, 211, 102, 0.4);
}
.prop-asesor-card .asesor-cta-call {
    background: var(--gv-color-primary);
    color: var(--gv-color-white);
    box-shadow: var(--gv-shadow-red);
}
.prop-asesor-card .asesor-cta-call:hover {
    background: var(--gv-color-primary-hover);
    color: var(--gv-color-white);
    transform: translateY(-2px);
    box-shadow: var(--gv-shadow-red-lg);
}
.prop-asesor-card .asesor-cta-email {
    background: var(--gv-color-white);
    color: var(--gv-color-text);
    border: 1.5px solid var(--gv-color-border);
}
.prop-asesor-card .asesor-cta-email:hover {
    border-color: var(--gv-color-primary);
    color: var(--gv-color-primary);
}

/* Form de contacto rapido en sidebar */
.prop-contact-mini {
    background: var(--gv-color-gray-900);
    color: var(--gv-color-white);
    border-radius: var(--gv-radius-md);
    padding: var(--gv-space-6);
}
.prop-contact-mini h3 {
    color: var(--gv-color-white);
    font-size: var(--gv-text-lg);
    margin: 0 0 var(--gv-space-2);
}
.prop-contact-mini p {
    color: var(--gv-color-gray-300);
    font-size: var(--gv-text-sm);
    margin: 0 0 var(--gv-space-4);
}
.prop-contact-mini .form-control {
    background: rgba(255,255,255,0.08) !important;
    border-color: rgba(255,255,255,0.15) !important;
    color: var(--gv-color-white) !important;
    margin-bottom: var(--gv-space-3);
}
.prop-contact-mini .form-control::placeholder {
    color: rgba(255,255,255,0.5);
}
.prop-contact-mini .form-control:focus {
    background: rgba(255,255,255,0.12) !important;
    border-color: var(--gv-color-primary) !important;
    box-shadow: 0 0 0 3px rgba(190,39,45,0.4) !important;
}

/* CTA sticky en bottom para mobile */
@media (max-width: 991px) {
    .prop-cta-sticky {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        background: var(--gv-color-white);
        border-top: 1px solid var(--gv-color-border);
        padding: var(--gv-space-3) var(--gv-space-4);
        z-index: var(--gv-z-fixed);
        box-shadow: 0 -4px 20px rgba(0,0,0,0.08);
        display: flex;
        gap: var(--gv-space-2);
    }
    .prop-cta-sticky .precio {
        flex: 1;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
    .prop-cta-sticky .precio .num {
        font-size: var(--gv-text-lg);
        font-weight: var(--gv-weight-bold);
        color: var(--gv-color-primary);
        line-height: 1;
    }
    .prop-cta-sticky .precio .lbl {
        font-size: var(--gv-text-xs);
        color: var(--gv-color-text-muted);
        text-transform: uppercase;
    }
    .prop-cta-sticky a.btn-wa {
        background: #25D366;
        color: var(--gv-color-white);
        padding: 0 var(--gv-space-5);
        border-radius: var(--gv-radius);
        font-weight: var(--gv-weight-bold);
        display: inline-flex;
        align-items: center;
        gap: var(--gv-space-2);
        text-decoration: none;
    }
    .page-propiedad {
        padding-bottom: 80px; /* espacio para CTA sticky */
    }
}
@media (min-width: 992px) {
    .prop-cta-sticky { display: none; }
}

/* Form de contacto principal abajo */
#propiedad_contacto {
    background: linear-gradient(135deg, var(--gv-color-gray-50) 0%, var(--gv-color-white) 100%);
    padding: var(--gv-space-16) 0;
}
#propiedad_contacto h1 {
    text-align: center;
    color: var(--gv-color-text);
    font-size: var(--gv-text-3xl);
    font-weight: var(--gv-weight-extrabold);
    margin-bottom: var(--gv-space-8);
    letter-spacing: var(--gv-tracking-tight);
}
#propiedad_contacto h1:after {
    content: '';
    display: block;
    width: 60px;
    height: 4px;
    background: var(--gv-gradient-red-soft);
    margin: var(--gv-space-4) auto 0;
    border-radius: 2px;
}

/* Ocultar el bloque viejo de asesor que ahora es parte del sidebar */
.page-propiedad #propiedad_asesor {
    display: none !important;
}

/* =====================================================================
 * 15. Mobile - ajustes finales
 * ===================================================================== */
@media (max-width: 768px) {
    .page-index header.intro {
        min-height: 70vh;
    }

    .page-index .intro-heading {
        font-size: var(--gv-text-4xl) !important;
    }

    .page-index .intro-lead-in {
        font-size: var(--gv-text-base);
    }

    section {
        padding: var(--gv-space-12) 0;
    }

    .section-heading,
    section h2 {
        font-size: var(--gv-text-3xl) !important;
    }

    .propiedad_box_precio {
        font-size: var(--gv-text-xl);
    }

    /* Scroll indicator oculto en mobile */
    .page-index header.intro:after {
        display: none;
    }
}