/* Estilos personalizados para replicar el diseño de la imagen */
        :root {
            --palomino-blue: #1c2b4c; /* Azul oscuro principal */
            --palomino-yellow: #f19001; /* Amarillo/Dorado para acentos */
            --palomino-teal: #00a896; /* Nuevo color vibrante para tarjetas (verde azulado) */
            /* Definimos alturas base para la transición */
            --header-height-normal: 100px;
            --header-height-shrink: 60px;
            --logo-height-normal: 70px;
            --logo-height-shrink: 45px;
            --caption-offset: 50px; /* Distancia del borde */
            --banner-height-mobile:250px;

            /* Variables para URLs de Imágenes de Fondo (Por Slide y Dispositivo) */
            /* SLIDE 1 */
            --slide1-bg-mobile: url('../images/slider-1-m.jpg');
            --slide1-bg-tablet: url('../images/slider-1-t.jpg');
            --slide1-bg-desktop: url('../images/slider-1.jpg');
            /* SLIDE 2 */
            --slide2-bg-mobile: url('../images/slider-2-m.jpg');
            --slide2-bg-tablet: url('../images/slider-2-t.jpg');
            --slide2-bg-desktop: url('../images/slider-2.jpg');
            /* SLIDE 3 */
            --slide3-bg-mobile: url('../images/slider-3-m.jpg');
            --slide3-bg-tablet: url('../images/slider-3-t.jpg');
            --slide3-bg-desktop: url('../images/slider-3.jpg');
        }
        @media (max-width:767px){
            :root {
                --header-height-normal: 80px;
            }
        }

        body {
            font-family: "Barlow", sans-serif;
            background-color: #f7f7f7; /* Fondo general gris claro */
        }
        a{
            text-decoration: none;
            color: var(--palomino-yellow);
        }
        img{
            max-width: 100%;
            max-height: auto;
        }
        /* --- HEADER PRINCIPAL (Contenedor de top-bar y navbar) --- */
        .main-header {
            background: #000000;
background: linear-gradient(90deg,rgba(0, 0, 0, 1) 20%, rgba(33, 33, 34, 1) 20%);
            position: fixed; /* Lo fijamos para que se quede arriba */
            top: 0;
            width: 100%;
            z-index: 1030; /* Alto z-index para que esté sobre todo */
            padding: 0;
            
            /* Altura inicial y transición */
            height: var(--header-height-normal);
            transition: height 0.3s ease;
        }
        
        /* Contenedor que limita el ancho del contenido del header a 1200px y lo centra */
        .header-content-limit {
            max-width: 1200px;
            margin: 0 auto;
            height: 100%; /* Ocupa la altura completa del main-header */
            display: flex; /* Usamos flex para dividir Logo y Contenido Secundario */
            justify-content: space-between;
            align-items: center;
            padding: 0 15px; /* Pequeño padding lateral para evitar que se pegue al borde */
        }

        /* Aplica padding al cuerpo para evitar que el contenido se oculte bajo el fixed header */
        body {
            padding-top: var(--header-height-normal);
        }

        /* HEADER EN ESTADO ENCOGIDO */
        .header-shrink {
            height: var(--header-height-shrink);
        }
        

        /* BARRA SUPERIOR (HEADER PEQUEÑO) */
        .top-bar {
             font-family: "Barlow", sans-serif;
            /*background-color: var(--palomino-blue);*/
            color: var(--palomino-yellow);
            padding: 5px 0;
            font-size: 1.1rem;
            width: 100%; /* Ocupa todo el ancho de su contenedor */
            /* Control de visibilidad para el shrink */
            opacity: 1;
            font-weight: 500;
            transition: opacity 0.3s ease;
        }

        /* Ocultar la barra superior cuando el header se encoge */
        .header-shrink .top-bar {
            opacity: 0;
            height: 0; /* Asegurar que no ocupa espacio */
            overflow: hidden;
            padding: 0;
        }
        .top-bar a:hover{
            color: #fff;
        }

        /* Contenedor del Top Bar y Navbar, ajustado para apilarse verticalmente */
        .header-secondary-content {
            height: 100%;
            display: flex;
            flex-direction: column; /* Apila Top Bar y Navbar */
            justify-content: space-between;
            width: 100%;
        }

        /* NAVBAR PRINCIPAL (para el menú) */
        .navbar-custom {
            background-color: transparent; /* Fondo transparente ya que el main-header tiene el fondo negro */
            padding-top: 0;
            padding-bottom: 0;
            width: 100%;
            
            /* Altura inicial del menú */
            /*height: calc(var(--header-height-normal) - 35px); */
            height: calc(var(--header-height-normal) 0); 
            display: flex;
            align-items: center;
            
            /* Transición para que suba y se centre en el estado shrink */
            transition: height 0.3s ease;
        }
        
        /* Ajuste de altura cuando el header se encoge: el menú ocupa toda la altura de la banda encogida */
        .header-shrink .navbar-custom {
            height: var(--header-height-shrink);
        }

        /* LOGO - Lo movemos fuera del navbar-brand para un mejor control */
        .header-logo {
            display: flex;
            align-items: center;
            height: 100%;
            padding: 5px 0;
            clip-path: polygon(0 0, 63% 0, 100% 100%, 0% 100%);
            background: #000;
        }
        .header-logo img {
            height: var(--logo-height-normal); /* Altura inicial del logo */
            /*filter: brightness(0) invert(1);*/
            transition: height 0.3s ease;
        }

        /* Reducción del tamaño del logo en el estado encogido */
        .header-shrink .header-logo img {
            height: var(--logo-height-shrink);
        }

        /* NAVBAR BUTTONS & LINKS */
        .navbar-custom .nav-link {
            color: white !important;
            padding: 15px 12px;
            font-weight: 500;
            text-transform: uppercase;
            border-bottom: 3px solid transparent;
            transition: border-bottom 0.3s ease;
        }
        
        /* Ocultar el botón Offcanvas en desktop, solo visible en versiones pequeñas (md o menos) */
        .navbar-toggler-offcanvas {
            border: none;
            color: white;
            background: #212529;
            font-size: 22px;
        }
        
        /* Dropdown en desktop: IMPLEMENTACIÓN SOLO CSS PARA HOVER FIABLE */
        .navbar-custom .dropdown-menu {
            background-color: #111; /* Fondo oscuro para el submenú */
            border: none;
            border-radius: 0;
            padding: 0;
            
            /* -- ESTILOS DE ANIMACIÓN -- */
            display: block; /* Siempre visible para el CSS hover */
            opacity: 0; /* Oculto por defecto */
            visibility: hidden; /* Oculto por defecto */
            transform: translateY(10px); /* Posición inicial: 10px hacia abajo */
            transition: opacity 0.3s ease, transform 0.3s ease, visibility 0s 0.3s;
        }
        
        /* Forzar la apertura del dropdown al hacer hover sobre el nav-item */
        .navbar-custom .nav-item.dropdown:hover .dropdown-menu {
            /* Muestra y anima el menú */
            opacity: 1;
            visibility: visible;
            transform: translateY(0); /* Posición final: se desliza hacia arriba */
            transition: opacity 0.3s ease, transform 0.3s ease; /* Elimina el retraso de visibility */
        }

        /* Desactiva el toggle en desktop para permitir el hover */
        .navbar-custom .dropdown-toggle::after {
            /* Asegura que la flecha de dropdown se muestre correctamente */
            display: inline-block;
            margin-left: 0.255em;
            vertical-align: 0.255em;
            content: "";
            border-top: 0.3em solid;
            border-right: 0.3em solid transparent;
            border-bottom: 0;
            border-left: 0.3em solid transparent;
        }

        .navbar-custom .dropdown-item {
            color: white !important;
            padding: 10px 15px;
            text-transform: uppercase;
            font-size: 0.9rem;
            transition: background-color 0.3s;
        }
        
        .navbar-custom .dropdown-item:hover {
            background-color: var(--palomino-yellow);
            color: var(--palomino-blue) !important;
        }


        /* Estilo para los enlaces dentro del Offcanvas */
        .offcanvas-body .simple-nav-link {
            display: block;
            color: var(--palomino-blue) !important;
            padding: 12px 15px;
            border-bottom: 1px solid #ddd;
            width: 100%;
            text-decoration: none;
            font-weight: 500;
            text-transform: uppercase;
        }

        .offcanvas-body .simple-nav-link:hover {
            color: var(--palomino-teal) !important;
            background-color: #f5f5f5;
        }
        
        /* --- ESTILOS ACORDEÓN EN OFFCANVAS --- */

        /* Estilo para el header del acordeón (misma apariencia que simple-nav-link) */
        .offcanvas-accordion .accordion-button {
            background-color: transparent !important;
            color: var(--palomino-blue) !important;
            padding: 12px 15px;
            border-bottom: 1px solid #ddd;
            width: 100%;
            font-weight: 500;
            text-transform: uppercase;
            box-shadow: none; /* Quitar sombra de Bootstrap */
        }
        
        .offcanvas-accordion .accordion-item {
            border: none;
            border-radius: 0;
        }
        
        .offcanvas-accordion .accordion-collapse {
            border-bottom: 1px solid #ddd;
        }

        /* Estilos para los items dentro del body del acordeón */
        .offcanvas-accordion .accordion-body {
            padding: 0;
            background-color: #f0f0f0;
        }

        .offcanvas-accordion .accordion-body .dropdown-item {
            display: block;
            padding: 8px 15px;
            font-size: 0.9rem;
            color: var(--palomino-blue) !important;
            text-decoration: none;
            text-transform: uppercase;
        }
        
        .offcanvas-accordion .accordion-body .dropdown-item:hover {
            background-color: #e0e0e0;
        }
        
        /* Aseguramos que los nav-link originales no se muestren en Offcanvas */
        .offcanvas-body .nav-link {
            display: none !important; 
        }

        .navbar-custom .nav-link:hover {
            color: var(--palomino-yellow) !important;
            border-bottom: 3px solid var(--palomino-yellow);
        }
        
        /* Estilo para el encabezado Offcanvas */
        .offcanvas-header {
            background-color: var(--palomino-blue);
            color: white;
        }
        
        .offcanvas-header .btn-close {
            filter: invert(1); /* Botón blanco para cerrar */
        }
        .btn-tlf-canvas{
            display: flex;
            margin-top: 30px;
        }
        .tlf-canva{
            font-size: 15px;
            font-weight: 600;
            margin-left: 10px;
        }
        .espacio-alto {
            margin-top: 20px;
            margin-left: 20px;
        }
        /* --- SECCIÓN CARRUSEL/SLIDER --- */
        .hero-carousel {
            margin-bottom: 0 !important; /* Elimina margen inferior por si acaso */
        }

        /* Altura por defecto (Móvil) */
        .carousel-item {
            height: 400px; /* Altura para móvil (400px) */
            background-size: cover;
            background-position: center center;
            background-repeat: no-repeat;
        }

        /* SLIDE 1: Fondos Responsivos (Móvil) */
        .carousel-item.slide-1 { background-image: var(--slide1-bg-mobile); }
        .carousel-item.slide-2 { background-image: var(--slide2-bg-mobile); }
        .carousel-item.slide-3 { background-image: var(--slide3-bg-mobile); }

        /* Tablet (768px y superior) */
        @media (min-width: 768px) {
            .carousel-item {
                height: 500px; /* Altura para tablet (500px) */
            }
            /* Fondos Responsivos (Tablet) */
            .carousel-item.slide-1 { background-image: var(--slide1-bg-tablet); }
            .carousel-item.slide-2 { background-image: var(--slide2-bg-tablet); }
            .carousel-item.slide-3 { background-image: var(--slide3-bg-tablet); }
        }

        /* Desktop (992px y superior) */
        @media (min-width: 992px) {
            .carousel-item {
                height: 600px; /* Altura para PC (600px) */
            }
            /* Fondos Responsivos (Desktop) */
            .carousel-item.slide-1 { background-image: var(--slide1-bg-desktop); }
            .carousel-item.slide-2 { background-image: var(--slide2-bg-desktop); }
            .carousel-item.slide-3 { background-image: var(--slide3-bg-desktop); }
            
            /* AJUSTES ADICIONALES PARA EL HEADER EN DESKTOP */
            
            /* El logo ocupa 25% y el contenido secundario 75% */
            .header-content-limit {
                grid-template-columns: 250px 1fr; /* Dividir Logo y Contenido (Ejemplo 200px vs el resto) */
                display: grid;
                gap: 10px;
            }
            

            /* Contenido Secundario (Top Bar + Menu) */
            .header-secondary-content {
                justify-content: space-between;
            }

            /* Ocultar Top Bar al encoger (solo afecta el padding, la visibilidad es manejada por el .header-shrink) */
            .top-bar {
                align-self: flex-start;
            }
            
            /* El menú principal (navbar-custom) debe estar centrado o en la parte inferior cuando no hay shrink */
            .navbar-custom {
                align-self: flex-end;
            }
            .header-shrink .navbar-custom {
                align-self: center; /* Centrar al encoger */
            }
        }
        
        /* Ocultamos las etiquetas <img> que ya no usamos */
        .carousel-item img {
            display: none;
        }


        /* Overlay para el contenido (título y subtítulo) */
        .carousel-caption-content {
            position: absolute;
            /* Cambios para inferior izquierda con offset */
            left: var(--caption-offset); 
            bottom: var(--caption-offset); 
            right: auto; /* Desactivar derecho */
            
            padding: 0;
            text-align: left; /* Alineación a la izquierda */
            transform: none; 
            width: 100%;
            max-width: 600px; 
            color: white;
            /* Asegura que el contenido quede dentro del límite del contenedor */
            margin-right: var(--caption-offset); 
        }
        
        /* Rectángulo degradado y sólido */
        .caption-background {
            /* Degradado de sólido a transparente */
            background: linear-gradient(to left, 
                        rgba(241, 144, 1, 1) 0%, /* Transparente */
                        rgba(241, 144, 1, 0.9) 50%, /* Empieza el color */
                        rgba(241, 144, 1, 0) 100%); /* Sólido */
            padding: 20px 30px;
            padding-right: 50px; /* Para que el contenido no quede pegado al degradado */
            text-align: right; /* Alineación a la izquierda del contenido */
            /*border-top-right-radius: 8px; /* Un poco de radio en la esquina superior derecha */
            /*box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);*/
        }

        .caption-title {
            font-size: 2.2rem;
            font-weight: 700;
            text-transform: uppercase;
            margin-bottom: 5px;
        }

        .caption-subtitle {
            font-size: 1.1rem;
            font-weight: 300;
            margin-bottom: 0;
        }
        
        /* --- Flechas de navegación (Control de Hover) --- */
        .hero-carousel .carousel-control-prev,
        .hero-carousel .carousel-control-next {
            opacity: 0; /* Oculto por defecto */
            transition: opacity 0.3s ease;
        }

        .hero-carousel:hover .carousel-control-prev,
        .hero-carousel:hover .carousel-control-next {
            opacity: 1; /* Visible al hacer hover en el carrusel */
        }
        
        /* Estilos de botones de carrusel personalizados (opcional) */
        .carousel-control-prev-icon,
        .carousel-control-next-icon {
            background-color: rgba(0, 0, 0, 0.5);
            padding: 20px;
            border-radius: 50%;
        }


        /* TARJETAS DE SERVICIO - CONTENEDOR */
        .service-card {
            position: relative;
            overflow: hidden;
            border-radius: 8px;
            box-shadow: 0 4px 15px rgba(0,0,0,0.1);
            transition: transform 0.3s ease;
            cursor: pointer;
        }

        .service-card:hover {
            transform: none; 
        }

        /* IMAGEN */
        .service-card img {
            width: 100%;
            height: 300px;
            object-fit: cover;
            transition: transform 0.5s ease;
        }

        .service-card:hover img {
            transform: scale(1.05);
        }

        /* OVERLAY - Nuevo diseño */
        .card-overlay {
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            color: white;
            padding: 0; 
            min-height: 100%; 
            display: flex;
            flex-direction: column;
            justify-content: flex-end;
            align-items: flex-start;
            text-align: left;
            transition: all 0.5s ease;
            background: transparent;
        }

        /* GRUPO DE CONTENIDO COMPLETO (Título + Secundario) */
        .card-content-group {
            width: 100%;
            /* Utilizamos 'transform' para mover todo el grupo hacia arriba en el hover */
            transform: translateY(0);
            transition: transform 0.4s ease;
        }

        /* OVERLAY - Estado Hover: Mueve el grupo de contenido hacia arriba */
        .service-card:hover .card-content-group {
            /* Valor basado en la altura de la descripción + botón + título */
            transform: translateY(0); 
            transition: transform 0.6s ease;
        }


        /* CONTENEDOR DEL CONTENIDO QUE SUBE */
        .card-movable-content {
            width: 100%;
            background-color: var(--palomino-teal);
            color: white;
            /* La altura máxima hace que se colapse, pero mantiene el color */
            max-height: 50px; /* Altura inicial solo para el título */
            overflow: hidden;
            transition: max-height 0.4s ease, background-color 0.4s ease;
            display: flex;
            flex-direction: column;
            padding: 0 15px; /* Padding horizontal */
        }
        
        /* ESTADO NORMAL: El bloque de título es la única banda de color visible */
        .service-card:not(:hover) .card-movable-content {
            background-color: rgba(0, 0, 0, 0.5); /* Ligeramente transparente */
            padding-top: 15px;
            padding-bottom: 15px;
        }

        /* CONTENIDO SECUNDARIO - Estado Hover (Visible y expandido) */
        .service-card:hover .card-movable-content {
            max-height: 300px; /* Suficiente altura para mostrar todo el contenido */
            background-color: rgba(0, 0, 0, 0.5);  /* Color sólido al expandir */
            padding-top: 15px;
            padding-bottom: 15px;
        }

        /* TÍTULO DEL SERVICIO */
        .card-title-service {
            margin-bottom: 0;
            font-size: 1.25rem;
            font-weight: 600;
            text-transform: uppercase;
        }

        /* DESCRIPCIÓN (nueva) */
        .card-description {
            font-size: 1rem;
            line-height: 1.4;
            margin-top: 10px;
            margin-bottom: 15px;
            /* Ocultar la descripción y el botón en estado normal usando la transición de max-height */
            opacity: 0;
            transition: opacity 0.2s ease 0.1s; /* Aparece con un pequeño retraso */
        }
        
        /* DESCRIPCIÓN - Estado Hover (Visible) */
        .service-card:hover .card-description {
            opacity: 1;
        }

        /* BOTÓN "Ver más" (nueva) - Se comporta igual que la descripción */
        .btn-ver-mas {
            background-color: rgba(0, 0, 0, 0.5); 
            color: white;
            border: 2px solid var(--palomino-yellow);
            padding: 8px 25px;
            border-radius: 4px;
            font-weight: 600;
            text-transform: uppercase;
            transition: background-color 0.3s ease, color 0.3s ease, opacity 0.2s ease 0.1s;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.4);
            align-self: flex-end; /* Alineado a la derecha como en la imagen */
            margin-top: 5px;
            opacity: 0;
        }

        .service-card:hover .btn-ver-mas {
            opacity: 1;
        }

        .btn-ver-mas:hover {
            background-color: var(--palomino-yellow);
            color: var(--palomino-blue);
            border-color: var(--palomino-yellow);
        }

        /* SECCIONES DE CONTENIDO */
        .content-section {
            padding: 4rem 0;
        }

        .section-title {
            color: var(--palomino-yellow);
            font-size: 1.8rem;
            font-weight: 700;
            text-transform: uppercase;
            margin-bottom: 2.5rem;
            
        }

        /* Fondo gris claro para algunas secciones */
        .bg-light-gray {
            background-color: #ebebeb;
        }
        .bg-light-grisocuro {
            background-color: #212122;
        }
        .bg-fc {
            background-image: url(../images/bg-fc1.webp);
        }
        .bg-cuero {
            background-image: url(../images/bg-cuero.webp);
            background-size: contain;
        }
        .bg-cortinas{
            background-image: url(../images/bg-cuero-2.jpg);
            
        }
.text-warning{
    border-radius: 25px;
    width: 28px;
    text-align: center;
    height: 28px;
    padding-top: 5px;
    background-color: var(--palomino-yellow);
    color: #fff !important;
    margin-right: 5px;
}
.text-warning:hover{
    background-color: #fff;
    color: var(--palomino-yellow) !important;
    transition: 0.3s;
}
/* nosotros*/
/* --- HEADER PRINCIPAL (Contenedor de top-bar y navbar) --- */
  
      
      

        /* --- BANNER DE PÁGINA INTERNA --- */
        .internal-banner {
            height: 300px;
            background-image: url('../images/banner-int.webp'); 
            background-size: cover;
            background-position: center center;
            position: relative;
            display: flex;
            align-items: center; 
            justify-content: center; 
            overflow: hidden;
            margin-bottom: 3rem;
        }

        @media (max-width: 991px) {
             .internal-banner {
                height: var(--banner-height-mobile); 
             }
        }

        .banner-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.4); 
            z-index: 1;
        }

        .banner-content {
            z-index: 2;
            text-align: center;
            color: white;
            position: relative;
            width: 90%;
            max-width: 1200px;
        }

        .banner-title {
            font-size: 3rem;
            font-weight: 700;
            text-transform: uppercase;
            margin-bottom: 0;
        }

        .breadcrumb-container {
            position: absolute;
            bottom: 15px; 
            right: 15px; 
            z-index: 3;
            width: 100%;
            text-align: right; 
            padding-right: 30px; 
        }

        .breadcrumb-custom {
            background: rgba(0, 0, 0, 0.6);
            padding: 5px 15px;
            border-radius: 5px;
            display: inline-flex;
        }

        .breadcrumb-item a {
            color: #ccc;
            text-decoration: none;
            font-size: 0.9rem;
        }

        .breadcrumb-item.active {
            color: var(--palomino-yellow);
            font-weight: 600;
        }

        /* --- CONTENIDO PRINCIPAL --- */
        main.container {
            /* Limitar el ancho del contenido principal */
            max-width: 1200px;
            padding: 0;
        }
        
        /* Bloque principal de texto debajo del banner (centrado) */
        .main-description {
            text-align: center;
            padding: 0 15px;
            margin-bottom: 3rem;
            max-width: 1200px; /* Limitar el ancho del texto central */
            margin-left: auto;
            margin-right: auto;
        }
        
        /* Título del servicio (El que estaba en el primer bloque) */
        .main-description h2 {
            color: var(--palomino-yellow);
            font-weight: 700;
            font-size: 1.8rem;
            margin-bottom: 1.5rem;
        }
        .main-description p{
            font-size: 18px;
        }
        
        /* Contenedor de bloque de contenido (sin bordes, sin sombras) */
        .content-block {
            padding: 0; /* Espaciado vertical uniforme */
            margin-bottom: 50px; /* Eliminar margen entre bloques */
            background-color: white; /* Por defecto, fondo blanco */
            border-radius: 20px;
        }
        
        /* Alternar color de fondo para crear las bandas horizontales */
        .content-block.bg-gray-band {
            background-color: #ebebeb; /* Color gris claro */
        }

        .content-title {
            color: var(--palomino-yellow); /* Color primario para títulos de sección */
            font-weight: 700;
            font-size: 1.4rem;
            margin-bottom: 1rem;
            text-transform: uppercase;
        }
        
        .content-text p {
            line-height: 1.5;
            color: #fff;
            margin-bottom: 1rem;
            font-size: 1rem;
        }

        /* IMAGEN DE BLOQUE */
        .content-image-wrapper {
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 0;
        }
        
        .content-image-wrapper img {
            max-width: 100%;
            height: auto;
            border-radius: 0; /* Sin bordes redondeados */
            box-shadow: none; /* Sin sombra */
            object-fit: cover;
            border-radius: 0 20px 20px 0;
        }
        
        /* Estilos de las listas (usando círculos de Bootstrap/FA) */
        .list-section {
             padding: .5rem 0;
        }
        .list-section ul {
            list-style: none;
            padding-left: 0;
            margin-bottom: 0;
        }
        
        .list-section ul li {
            text-align: left;
            padding: 5px 0;
            color: #333;
            /* Usamos margin para que el texto esté alineado con el texto normal */
            padding-left: 20px; 
            position: relative;
        }
        
        .list-section ul li i.fa-check-circle,
        .list-section ul li i.fa-leaf,
        .list-section ul li i.fa-tools,
        .list-section ul li i.fa-palette,
        .list-section ul li i.fa-handshake {
            color: var(--palomino-yellow);
            position: absolute;
            left: 0;
            top: 10px;
            font-size: 0.9em; /* Ajustar el tamaño del icono */
        }

        /* Estilos para el bloque de contacto/cierre (Footer) */
        .contact-footer {
            background-color: #000000;
            color: white;
            padding: 2rem 15px;
            border-radius: 15px; /* Sin bordes */
            margin-top: 3rem;
            margin-bottom: 50px;
        }
        
        .contact-footer h3 {
            color: var(--palomino-yellow); /* Título en blanco para el contraste */
            font-weight: 600;
            font-size: 1.5rem;
            margin-bottom: 1rem;
        }

        .contact-info-block {
            padding-left: 15px;
        }
        .contact-info-block p {
            margin-bottom: 0.5rem;
            font-size: 1.2rem;
            line-height: 1.5;
        }
        .contact-footer a {
            color: #fff;
            text-decoration: none;
        }
        .contact-footer a:hover {
            text-decoration: underline;
        }
        
        /* Ajuste de color del título de cotización */
        .contact-text h3 {
             color: white;
        }
        
        /* Ajuste de tamaño de fuente para el bloque de cotización */
        .contact-footer .lead {
            font-size: 1rem;
        }
/* mio*/
.contenedor-mc-blanco{
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
    width: 1200px;
    background: #fff;
    margin: 0 auto 40px auto;
    align-items: center;
    gap: 3%;
    border-radius: 10px;
}
.contenedor-mc-blanco .lado-1{
    width: 55%;
}
.contenedor-mc-blanco .lado-2{
    width: 42%;
}
.contenedor-mc-blanco .lado-2 img{
    border-radius: 0 10px 10px 0;
}
.contenido{
    padding: 20px 30px;
}
.contenido h4{
    font-size: 18px;
    font-weight: 600;
}
.contenedor-mc-gris{
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
    width: 1200px;
    background: #e6e6e6;
    margin: 0 auto 40px auto;
    align-items: center;
    gap: 3%;
    border-radius: 10px;
}
.contenedor-mc-gris .lado-1{
    width: 40%;
}
.contenedor-mc-gris .lado-2{
    width: 55%;
}
.contenedor-mc-gris .lado-1 img{
    border-radius: 10px 0 0 10px;
}
.fono{
    font-size: 20px !important;
    margin-bottom: 10px !important;
}
.me-2{
    color: var(--palomino-yellow);
}
/*footer*/
.footer-wrapper { width: 100%; background: #000; color: #fff; padding: 40px 0; }
    .footer-container { max-width: 1200px; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 40px; padding: 0 20px; }
    .footer-column { flex: 1 1 250px; }
    .footer-title { font-size: 20px; font-weight: bold; margin-bottom: 20px; }
    .footer-item { margin-bottom: 12px; display: flex; align-items: center; gap: 10px; }
    .footer-item i { color: #1e90ff; }
    .social-icons { display: flex; gap: 15px; margin-top: 10px; }
    .social-icons a { 
        width: 40px; 
        height: 40px; 
        background: #222; 
        border-radius: 50%; 
        display: flex; 
        justify-content: center; 
        align-items: center; 
        text-decoration: none; 
        color: #fff; 
    }
    .social-icons a:hover {
        background: var(--palomino-yellow);
        transition: 0.2s;
    }
    img.logo { width: 180px;
        margin-top: 10%;
    }
    @media (max-width: 768px) {
      .footer-container { flex-direction: column; align-items: flex-start; }
    }
@media (max-width:1024px){
    main.container{
    width: 94%;
    }
    .contenedor-mc-gris{
    width: 94%;
    }
    .contenedor-mc-blanco{
    width: 94%;
    }
    .banner-title {
        font-size: 2.5rem;
    }
    .header-logo{
        width: 280px;
    }

}
@media (max-width:767px){
    .header-logo {
            width: 200px;
        }
.contenedor-mc-blanco .lado-1 {
    width: 100%;
}
.contenedor-mc-blanco .lado-2 {
    width: 100%;
}
.contenedor-mc-gris .lado-1 {
    width: 100%;
}
.contenedor-mc-gris .lado-2{
    width: 100%;
}
.content-title {
    font-size: 1.2rem;
    margin-bottom: 1rem;
    text-transform: uppercase;
    
}
.banner-title {
        font-size: 2rem;
}
.contact-info-block p {
            margin-bottom: 0.5rem;
            font-size: 0.9rem;
            line-height: 1.5;
        }
.footer-column { flex: 1 1 50px; }
}
.margin-1{
    margin-top: -10px;
}
.espacio-alto a:hover{
color: #000;
}