/* ============================================================
   CUSTOM RESPONSIVE — Constructora Rivera
   Cargado después de crivera.css para completar y corregir
   el comportamiento responsive de imágenes y contenedores.
   ============================================================ */

/* ── 1. Fallback global ──────────────────────────────────────
   Ninguna imagen sobresale de su contenedor, nunca.          */
img {
    max-width: 100%;
    height: auto;
}

/* ── 2. Project cards (grid isotope) ─────────────────────────
   La imagen llena la card con aspect-ratio fijo,
   sin importar el tamaño original del archivo subido.        */
.project-one__card {
    overflow: hidden;
    position: relative;
}
.project-one__card > img {
    width: 100%;
    height: 280px;
    object-fit: cover;
    object-position: center;
    display: block;
    transition: transform 0.45s ease;
}
.project-one__card:hover > img {
    transform: scale(1.06);
}

/* Destacado (col-lg-8): imagen más alta para mejor presencia  */
.col-lg-8 .project-one__card > img {
    height: 360px;
}

/* ── 3. Project detail — imagen de cabecera ──────────────────*/
.project-details__image {
    overflow: hidden;
    border-radius: 12px;
}
.project-details__image > img {
    width: 100%;
    height: auto;
    max-height: 560px;
    object-fit: cover;
    object-position: center;
    display: block;
}

/* ── 4. Project detail — imagen de características ───────────*/
.project-details__feature__thumb {
    overflow: hidden;
    border-radius: 12px;
}
.project-details__feature__thumb img {
    width: 100%;
    height: 100%;
    min-height: 320px;
    max-height: 480px;
    object-fit: cover;
    object-position: center;
    display: block;
}

/* ── 5. Nosotros — imágenes apiladas ─────────────────────────*/
.about-one__image__item__inner,
.about-one__image__item-two {
    overflow: hidden;
}
.about-one__image__one {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

/* ── 6. Footer — logo responsive ─────────────────────────────
   El atributo width="337" fue eliminado del HTML;
   aquí se controla con CSS para no romper en móvil.          */
.footer-widget__logo img {
    max-width: 220px;
    width: 100%;
    height: auto;
    display: block;
}

/* ── 7. Footer — miniaturas de proyectos recientes ───────────*/
.footer-widget--post__img {
    flex-shrink: 0;
    overflow: hidden;
}
.footer-widget--post__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

/* ── 8. Contact — iframe del mapa ────────────────────────────
   El iframe no tiene width/height nativo;
   el contenedor del template lo envuelve pero
   necesitamos reforzar el 100%.                              */
.contact-four__maps__inner iframe {
    width: 100% !important;
    height: 100%;
    min-height: 340px;
    display: block;
    border: 0;
}

/* Logo dentro del mapa de contacto */
.contact-four__maps__logo img {
    max-width: 177px;
    width: 100%;
    height: auto;
    display: block;
}

/* ── 9. Servicios — imágenes de cards ────────────────────────*/
.service-card__image img,
.service-one__card__image img,
.service-two__card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

/* ── 10. Videos — thumbnail ──────────────────────────────────
   El thumbnail usa padding-top:56.25% (16:9),
   la imagen absoluta ya tiene object-fit;
   esto refuerza por si se aplica fuera del template.        */
.video-thumb__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* ── 11. Admin — miniaturas en tablas ────────────────────────*/
.admin-table td img {
    object-fit: cover;
    display: block;
}

/* ── 11b. Inicio — imagen principal de Testimonios ───────────
   El tema espera una imagen de fondo ~900x593; si el archivo
   subido tiene otra resolución, se recorta para respetar
   siempre ese tamaño/proporción en escritorio.               */
.testimonials-one__thumb {
    width: 900px;
    max-width: 100%;
}
.testimonials-one__thumb img {
    width: 100%;
    height: 593px;
    object-fit: cover;
    object-position: center;
    display: block;
}
@media (max-width: 992px) {
    .testimonials-one__thumb img {
        height: auto;
        aspect-ratio: 900 / 593;
    }
}

/* ── 12. Media queries ───────────────────────────────────────*/
@media (max-width: 991px) {
    .project-one__card > img {
        height: 240px;
    }
    .col-lg-8 .project-one__card > img {
        height: 280px;
    }
    .project-details__feature__thumb img {
        min-height: 260px;
        max-height: 360px;
    }
}

@media (max-width: 767px) {
    .project-one__card > img,
    .col-lg-8 .project-one__card > img {
        height: 220px;
    }
    .project-details__image > img {
        max-height: 280px;
    }
    .project-details__feature__thumb img {
        min-height: 200px;
        max-height: 260px;
    }
    .about-one__image {
        margin-bottom: 30px;
    }
    .contact-four__maps__inner iframe {
        min-height: 260px;
    }
}

@media (max-width: 480px) {
    .project-one__card > img,
    .col-lg-8 .project-one__card > img {
        height: 180px;
    }
    .footer-widget__logo img {
        max-width: 160px;
    }
}

/* ── 13. Slider — ocultar línea SVG decorativa en móvil ─────*/
@media (max-width: 767px) {
    .hero-deco-lines {
        display: none !important;
    }
}

/* ── 14. Cursor personalizado — ocultar en táctil/móvil ──────
   pointer:coarse = pantallas táctiles (móvil y tablet).
   En desktop (pointer:fine = mouse) sigue funcionando normal. */
@media (pointer: coarse) {
    .custom-cursor__cursor,
    .custom-cursor__cursor-two {
        display: none !important;
    }
}

/* ── 15. Detalle de proyecto — Videos y Galería ──────────────
   ".section-space--sm" no existe en crivera.css (clase usada
   pero nunca definida), por eso ambas secciones quedaban sin
   espacio arriba/abajo. Se define aquí junto con un tratamiento
   de tarjeta para que se vean menos apretadas.                */
.section-space--sm {
    padding-top: 64px;
    padding-bottom: 64px;
}
@media (max-width: 767px) {
    .section-space--sm {
        padding-top: 48px;
        padding-bottom: 48px;
    }
}
@media (max-width: 575px) {
    .section-space--sm {
        padding-top: 36px;
        padding-bottom: 36px;
    }
}

.proyecto-videos-carousel .item {
    background: #fff;
    border-radius: 14px;
    padding: 12px;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.06);
}
.proyecto-videos-carousel .owl-stage-outer {
    padding: 4px 2px 10px;
}

.proyecto-gallery .gallery-thumb {
    display: block;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.07);
}
.proyecto-gallery .gallery-thumb img {
    transition: transform 0.35s ease;
}
.proyecto-gallery .gallery-thumb:hover img {
    transform: scale(1.06);
}