/* ----- RESET ----- */
* {
    margin: 0;
    padding: 0;
    max-width: 100%;
    box-sizing: border-box;
    font-family: 'Montserrat', sans-serif;
}

:root {
    --textColor: #132938;
    --buttomColor: #5c676f;
    --buttonHoverColor: #d44347;
    --backgroundColor: #E6E1DE;
    --backgroundMobileColor: #BBB7B6;
    --movilBackgroundColor: rgb(241, 234, 234);
    --filterIconColor: invert(14%) sepia(15%) saturate(1316%) hue-rotate(165deg);
}

body {
    background-color: white;
    width: auto;
    height: auto;
}

section {
    scroll-margin-top: 80px; /* Ajusta este valor según la altura del header */
}

h1 { font-size: 3.5em;}
h2 { font-size: 2.7em; }
h3 { font-size: 2em; }
p { font-size: 1.25em; }
ul { list-style: none; }
li { font-size: 1.25em; }

/* ----- FUENTES ----- */
.gillsans-italic {
    font-family: 'Raleway', sans-serif;
    font-style: italic;
    color: #d44347;
}

.gillsans-italic_1 {
    font-family: 'Raleway', sans-serif;
    font-style: italic;
    color: white;
}

.gillsans-bold {
    font-family: 'Raleway', sans-serif;
    font-weight: 800; /* Negrita */
    color: var(--textColor);
}

.gillsans-regular {
    font-family: 'Raleway', sans-serif;
    font-weight: 500; /* Regular */
    color: var(--textColor);
}

.kanvas-bold {
    font-family: "Poppins", sans-serif;
    font-weight: 700;
}

.kanvas-bold_1 {
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    color: var(--textColor);
}

strong {
    font-weight: 700;
}

/* ----- BOTONES ----- */
button {
    font-size: 1.25rem;
    font-weight: bold;
    padding: 0.625rem 1.875rem;
    color: white;
    background-color: var(--buttomColor);
    border-radius: 0.9375rem;
}

button:hover {
    background-color: var(--buttonHoverColor)
}

/* ----- HEADER ----- */
header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 50px;
    background: var(--backgroundColor);
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
    position: fixed; /* Cambia de relative a fixed */
    top: 0; /* Fija el header en la parte superior */
    left: 0;
    width: 100%; /* Asegura que ocupe todo el ancho */
    z-index: 1000; /* Asegura que esté por encima de otros elementos */
}

/* Navegación en escritorio */
.nav-links {
    display: flex;
    gap: 20px;
    list-style: none;
}

.nav-links li a {
    text-decoration: none;
    color: var(--textColor);
    font-weight: bold;
    font-size: 15px;
}

/* Menú hamburguesa (oculto en escritorio) */
.menu-toggle {
    display: none;
    flex-direction: column;
    gap: 5px;
    cursor: pointer;
}

.menu-toggle span {
    width: 30px;
    height: 4px;
    background: black;
    border-radius: 5px;
}

.logo img {
    width: 180px;
}

nav {
    display: flex;
    align-items: center;
}

.nav-links li {
    list-style: none;
}
.nav-links a {
    text-decoration: none;
    color: var(--textColor);
    font-weight: 15px;
}

.contacto-btn-header {
    border: 2px solid black;
    padding: 5px 15px;
    border-radius: 20px;
}

h1, h2 {
    text-align: center;
    font-size: 2.5rem;
}

/* Overlay para oscurecer la pantalla */
.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.4); /* Oscurece la pantalla */
    z-index: 999; /* Asegura que esté por encima del contenido */
    display: none; /* Oculto por defecto */
    pointer-events: all;
}

/* Bloquea la interacción con el contenido de la página */
body.blocked {
    pointer-events: none; /* Deshabilita la interacción con todo el contenido */
}

body.blocked .cookie-banner,
body.blocked .cookie-banner * {
    pointer-events: all; /* Permite la interacción con el banner de cookies */
}

/* Pop-up de Cookies */
.cookie-banner {
    position: fixed;
    top: 50%; /* Centra verticalmente */
    left: 49%; /* Centra horizontalmente */
    transform: translate(-50%, -50%); /* Ajusta el centro */
    width: 90%; /* Ajusta el ancho del pop-up */
    max-width: 500px; /* Ancho máximo */
    background-color: rgb(37, 35, 35); /* Fondo oscuro */
    color: #fff;
    padding: 1.5rem;
    text-align: center;
    z-index: 1000; /* Por encima de otros elementos */
    border-radius: 5px; /* Bordes redondeados */
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.5); /* Sombra */
    display: none; /* Oculto por defecto */
}

/* Texto dentro del pop-up */
.cookie-banner p {
    margin: 0 0 1rem 0;
    font-size: 1rem;
    line-height: 1.5;
}

/* Enlace dentro del pop-up */
.cookie-banner a {
    color: #f96234;
    text-decoration: underline;
}

/* Botones dentro del pop-up */
.cookie-btn {
    background-color: #f96234;
    color: #fff;
    border: none;
    padding: 0.5rem 1rem;
    border-radius: 5px;
    cursor: pointer;
    font-size: 1rem;
    margin: 0.5rem;
    transition: background-color 0.3s ease;
}

.cookie-btn:hover {
    background-color: #be5d3c;
}


/* Botón flotante */
.boton-flotante {
    position: fixed;
    bottom: 20px;
    right: 20px;
    background-color: #ff5722; /* Color llamativo */
    padding: 15px;
    border-radius: 10%;
    opacity: 0.8;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.3);
    transition: transform 0.3s ease, background-color 0.3s ease;
    z-index: 1000;
}

.boton-flotante img {
    width: 40px;
    height: 40px;
}

.boton-flotante:hover {
    background-color: #e64a19; /* Color más oscuro en hover */
    transform: scale(1.1);
}


/* ------------------------------ HOME SECTION ------------------------------ */
#home-section {
    display: flex;
    justify-content: center;
    text-align: center;
    padding: 3.75rem; /* 60px */
    background-image: url("media/background/home_fondo.jpg");
    background-repeat: no-repeat;
    background-size: cover; /* Asegura que la imagen de fondo cubra toda la sección */
    background-position: center; /* Centra la imagen de fondo */
    width: 100vw; /* Asegura que la sección ocupe todo el ancho */
    height: 100vh; /* Asegura que la sección ocupe toda la altura de la ventana */
    margin-top: 80px;
}

#home-section .grid-container {
    display: grid;
    gap: 0.625rem; /* 10px */
}

#home-section .title-container {
    margin-bottom: 1.25rem; /* 20px */
    padding-right: 12.5rem; /* 200px */
}
#home-section .title-container h1 {
    font-size: 2.8rem;
    margin-bottom: 0;
}
#home-section .title-container h2 {
    padding-left: 5rem;
}

#home-section .text-container {
    padding-left: 32rem;
    padding-right: 35rem;
    margin-top: 4rem;
    hyphens: auto;
}

#home-section .paragraph-text {
    font-size: 1rem;
    text-align: justify;
    line-height: 1.5;
    color: var(--textColor);
}

#home-section .icon-content {
    display: flex;
    justify-content: center;
    gap: 3.75rem; /* 60px */
    margin-top: 7.5rem; /* 120px */
    padding-right: 20rem; /* 320px */
}

#home-section .icon-content img {
    width: 4.0625rem; /* 65px */
    filter: var(--filterIconColor);
}

#home-section button {
    font-size: 1rem;
    font-weight: bold;
    padding: 0.25rem 0.5rem; /* 4px 8px */
    border: solid transparent;
    background-color: transparent;
    border-radius: 0.25rem;
}

#home-section button:hover {
    border: solid transparent;
    background-color: rgba(162, 160, 160, 0.8);
    font-size: 1rem;
    font-weight: bold;
    padding: 0.25rem 0.5rem; /* 4px 8px */
    border-radius: 0.9375rem; /* 15px */
}

/* ------------------------------ ABOUT_US SECTION ------------------------------ */
#aboutUs-section {
    display: flex;
    justify-content: center;
    align-items: flex-start; /* Alinea el contenido en la parte superior */
    text-align: center;
    padding: 3.75rem; /* 60px */
    background-image: url("media/background/AboutUs_fondo.jpg");
    background-repeat: no-repeat;
    background-size: cover; /* Asegura que la imagen de fondo cubra toda la sección */
    background-position: center; /* Centra la imagen de fondo */
    width: 100vw; /* Asegura que la sección ocupe todo el ancho */
    height: 100vh; /* Asegura que la sección ocupe toda la altura de la ventana */
}

#aboutUs-section .grid-container {
    display: grid;
    gap: 0.625rem; /* 10px */
}

#aboutUs-section .title-container {
    padding-top: 5rem; /* 35px */
    padding-left: 45em; /* 690px */
    color: var(--textColor);
}
#aboutUs-section .title-container h1 {
    font-size: 2.6rem;
}
#aboutUs-section .text-container {
    padding-left: 45rem; /* 720px */
}

#aboutUs-section .paragraph-text {
    font-size: 0.9rem;
    text-align: justify;
    line-height: 1.5;
    margin-bottom: 1.25rem; /* 20px */
    color: var(--textColor);
}

#aboutUs-section .icon-content_1 {
    display: flex;
    justify-content: center;
    gap: 3.75rem; /* 60px */
    margin-top: 0.3125rem; /* 5px */
    padding-left: 44.375rem; /* 710px */
}

#aboutUs-section .icon-content_1 img {
    width: 10rem;
    height: 4rem;
}

#aboutUs-section .icon-content_1 .logo-imandis {
    width: 10rem;
    height: 8rem;
}

#aboutUs-section .icon-content_2 {
    display: flex;
    justify-content: center;
    gap: 3.75rem; /* 60px */
    margin-top: 0.3125rem; /* 5px */
    padding-bottom: 0.625rem; /* 10px */
    padding-left: 44.375rem; /* 710px */
}

#aboutUs-section .icon-content_2 img {
    width: 10rem;
    height: 4rem;
}

#aboutUs-section .icon-content_2 .logo-chicoMonago {
    width: 10rem;
    height: 5.6rem;
}

/* ------------------------------ SERVICE SECTION ------------------------------ */
#service-section {
    display: flex;
    justify-content: center;
    align-items: flex-start; /* Alinea el contenido en la parte superior */
    padding: 3.75rem; /* 60px */
    background-image: url("media/background/servicios_fondo.jpg");
    background-repeat: no-repeat;
    background-size: cover; /* Asegura que la imagen de fondo cubra toda la sección */
    background-position: center; /* Centra la imagen de fondo */
    width: 100vw; /* Asegura que la sección ocupe todo el ancho */
    height: 100vh; /* Asegura que la sección ocupe toda la altura de la ventana */
}

#service-section .grid-container {
    display: grid;
    gap: 0.625rem; /* 10px */
}

#service-section .title-container {
    margin-top: 0;
    color: var(--textColor);
}

#service-section .title-container h1 {
    margin-top: 0;
    font-size: 5rem; /* 80px */
}

#service-section .text-container {
    padding-right: 46.125rem; /* 730px */
    margin-top: 1.75rem; /* 20px */
}

#service-section .paragraph-text {
    font-size: 0.9rem;
    text-align: justify;
    line-height: 1.5;
    margin-bottom: 1.875rem; /* 30px */
    color: var(--textColor);
}

#service-section .icon-content {
    position: relative; /* Contenedor relativo para posicionar el rodillo */
    display: inline-block; /* Ajusta al tamaño del contenido */
    justify-content: center;
    text-align: center;
}

#service-section .rodillo-icon {
    position: absolute; /* Se superpone sobre el logo */
    top: 0.0625rem; /* 1px */
    left: 0.0625rem; /* 1px */
    width: 3.75rem; /* 60px */
    height: auto;
    z-index: 2; /* Asegura que esté por encima */
    transform: rotate(40deg);
    filter: var(--filterIconColor);
    padding-top: 1.875rem; /* 30px */
}

#service-section .icon-content img {
    width: 25rem; /* 400px */
}

#service-section .contacto-btn {
    margin-top: 0.9375rem; /* 15px */
    padding-right: 45.625rem; /* 730px */
    text-align: center;
}

#service-section .service-list .icon {
    padding-right: 1.25rem; /* 20px */
}

#service-section .service-list .icon img {
    width: 1.5625rem; /* 25px */
}

#service-section .service-list .text {
    flex: 1; /* Para que el texto ocupe el espacio restante */
    text-align: justify;
    font-size: 0.9375rem; /* 15px */
    color: var(--textColor);
}

#service-section .service-list {
    padding: 0;
    margin: 0;
    max-width: 100%;
}

#service-section .service-list li {
    list-style: none; /* Oculta el marcador predeterminado */
    display: flex;
    width: 95%;
    margin-bottom: 1.5625rem; /* 25px */
    text-align: left;
    hyphens: auto;
}

#service-section .service-list li span {
    display: inline-block;
    width: 1.5625rem; /* 25px */
    height: 1.5625rem; /* 25px */
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    margin-right: 1.5625rem; /* 25px */
}

#service-section .service-list .brush {
    background-image: url("media/icon/cepillo_full.png");
}

#service-section .service-list .roller {
    background-image: url("media/icon/rodillo_full.png");
}

#service-section .service-list .pencil {
    background-image: url("media/icon/pincel-de-lapiz.png");
}

#service-section .service-list .wall {
    background-image: url("media/icon/bloque-de-ladrillo.png");
}

#service-section .service-list .factory {
    background-image: url("media/icon/industria-alternativa.png");
}

/* ------------------------------ VERTICALJOB SECTION ------------------------------ */
#verticalJob-section {
    display: flex;
    justify-content: center;
    align-items: flex-start; /* Alinea el contenido en la parte superior */
    text-align: center;
    padding: 3.75rem; /* 60px */
    background-image: url("media/background/trabajosVerticales-fondo.jpg");
    background-repeat: no-repeat;
    background-size: cover; /* Asegura que la imagen de fondo cubra toda la sección */
    background-position: center; /* Centra la imagen de fondo */
    width: 100vw; /* Asegura que la sección ocupe todo el ancho */
    height: 100vh; /* Asegura que la sección ocupe toda la altura de la ventana */
}

#verticalJob-section .grid-container {
    display: grid;
    gap: 0.625rem; /* 10px */
}

#verticalJob-section .title-container {
    padding-right: 39.75rem; /* 620px */
    margin-right: 0;
}

#verticalJob-section .title-container h1 {
    margin-top: 0.5rem;
    margin-bottom: 0.4rem; /* 6.4px */
    margin-right: 1.25rem;
    font-size: 3.5rem; /* 56px */
    color: var(--textColor);
}

#verticalJob-section .gillsans-italic {
    font-family: 'Raleway', sans-serif;
    font-style: italic;
    color: var(--textColor);
}

#verticalJob-section .title-container_2 {
    margin-bottom: 2.5rem; /* 40px */
}
#verticalJob-section .title-container_2 h1 {
    margin-top: 0.5rem; /* 8px */
    margin-bottom: 0.5rem; /* 8px */
    font-size: 2.2rem; /* 35.2px */
    text-align: left;
}

#verticalJob-section .title-container_2 h2 {
    margin-top: 0rem;
    font-size: 2rem; /* 32px */
    text-align: left;
}

#verticalJob-section .gillsans-italic_1 {
    margin-right: 3.125rem; /* 50px */
}

#verticalJob-section .text-container {
    padding-top: 0.625rem; /* 10px */
    padding-left: 23.125rem; /* 370px */
}

#verticalJob-section .paragraph-text {
    font-size: 0.9rem; /* 14.4px */
    text-align: justify;
    line-height: 1.5;
    padding-right: 30rem;
    margin-bottom: 1.25rem; /* 20px */
    color: var(--textColor);
}

#verticalJob-section .service-list {
    padding: 0;
    margin: 0;
    max-width: 100%;
}

#verticalJob-section .service-list li {
    list-style: none; /* Oculta el marcador predeterminado */
    display: flex;
    width: 95%;
    margin-bottom: 1.5625rem; /* 25px */
    text-align: left;
}
#verticalJob-section .service-list li span {
    display: inline-block;
    width: 1.5625rem; /* 25px */
    height: 1.5625rem; /* 25px */
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    margin-right: 1.5625rem; /* 25px */
}

#verticalJob-section .service-list .text {
    flex: 1; /* Para que el texto ocupe el espacio restante */
    text-align: justify;
    font-size: 0.9375rem; /* 15px */
    color: var(--textColor);
}

#verticalJob-section .service-list .wall {
    background-image: url("media/icon/construir-alternativa.png");
}

#verticalJob-section .service-list .rift {
    background-image: url("media/icon/casa-grieta-alternativa.png");
}

#verticalJob-section .service-list .umbrella {
    background-image: url("media/icon/paraguas.png");
}

#verticalJob-section .service-list .cube {
    background-image: url("media/icon/llenar.png");
}

#verticalJob-section .service-list .circule {
    background-image: url("media/icon/agujero-de-hombre.png");
}

#verticalJob-section .service-list .hand {
    background-image: url("media/icon/mano-que-sostiene-la-gota.png");
}

/* ------------------------------ WORK AND REFORM SECTION ------------------------------ */
#workAndReform-section {
    display: flex;
    justify-content: center;
    align-items: flex-start; /* Alinea el contenido en la parte superior */
    text-align: center;
    padding: 3.75rem; /* 60px */
    background-image: url("media/background/obrasReformasFondo.jpg");
    background-repeat: no-repeat;
    background-size: cover; /* Asegura que la imagen de fondo cubra toda la sección */
    background-position: center; /* Centra la imagen de fondo */
    width: 100vw; /* Asegura que la sección ocupe todo el ancho */
    height: 100vh; /* Asegura que la sección ocupe toda la altura de la ventana */
    margin-bottom: 2.5rem; /* 40px */
}

#workAndReform-section .grid-container {
    display: grid;
    gap: 0.625rem; /* 10px */
}

#workAndReform-section .icon-content {
    display: flex;
    justify-content: center;
    gap: 3.75rem; /* 60px */
    padding-left: 30.625rem; /* 490px */
}

#workAndReform-section .icon-content img {
    width: 31.25rem; /* 500px */
}

#workAndReform-section .text-container {
    margin-top: 0.625rem; /* 10px */
    margin-bottom: 0.625rem; /* 10px */
    padding-right: 5rem;
    padding-left: 43.75rem; /* 700px */
}

#workAndReform-section .paragraph-text {
    font-size: 0.9rem;
    text-align: justify;
    line-height: 1.6;
    color: var(--textColor);
}

#workAndReform-section .title-container {
    margin-top: 2.5rem; /* 40px */
    margin-bottom: 4rem; /* 50px */
    padding-left: 38.125rem; /* 610px */
    align-items: center;
}

#workAndReform-section .title-container h1 {
    margin-top: 0rem;
    margin-bottom: 0rem;
    font-size: 2.5rem;
}

#workAndReform-section .list-container {
    padding-left: 43.75rem; /* 700px */
}

#workAndReform-section .service-list {
    justify-content: center;
    padding: 0;
    margin: 0;
    max-width: 100%;
}

#workAndReform-section .service-list li {
    list-style: none; /* Oculta el marcador predeterminado */
    display: flex;
    width: 95%;
    margin-bottom: 1.25rem; /* 20px */
    text-align: left;
}

#workAndReform-section .service-list li span {
    display: inline-block;
    width: 1.2625rem; /* 25px */
    height: 1.2625rem; /* 25px */
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    margin-right: 1.5625rem; /* 25px */
}

#workAndReform-section .service-list .text {
    flex: 1; /* Para que el texto ocupe el espacio restante */
    text-align: justify;
    font-size: 0.9375rem; /* 15px */
    color: var(--textColor);
}

#workAndReform-section .service-list .house {
    background-image: url("media/icon/hogar.png");
}

#workAndReform-section .service-list .door {
    background-image: url("media/icon/puerta-cerrada\ \(1\).png");
}

#workAndReform-section .service-list .tools {
    background-image: url("media/icon/herramientas.png");
}

#workAndReform-section .service-list .plumber {
    background-image: url("media/icon/usuario-fontanero.png");
}

#workAndReform-section .service-list .squere {
    background-image: url("media/icon/piso-alto.png");
}

#workAndReform-section .service-list .bathroom {
    background-image: url("media/icon/bano.png");
}

/* ------------------------------ ELECTRICITY SECTION ------------------------------ */
#electricity-section{
    display: flex;
    justify-content: center;
    align-items: flex-start; /* Alinea el contenido en la parte superior */
    text-align: center;
    padding: 60px;
    padding-top: 30px;
    background-image: url("media/background/electricidadFondo.jpg");
    background-repeat: no-repeat;
    background-size: cover; /* Asegura que la imagen de fondo cubra toda la sección */
    background-position: center; /* Centra la imagen de fondo */
    width: 100vw; /* Asegura que la sección ocupe todo el ancho */
    height: 100vh; /* Asegura que la sección ocupe toda la altura de la ventana */
}

#electricity-section .grid-container {
    display: grid;
    gap: 0px;
}

#electricity-section .icon-content {
    display: flex;
    justify-content: center;
    padding-left: 290px;
}

#electricity-section .icon-content img {
    width: 60px;
    transform: rotate(40deg);
    filter: var(--filterIconColor);
    padding-top: 20px;
}

#electricity-section .title-container {
    margin-bottom: 25px;
    padding-left: 620px;
    align-items: center;
}

#electricity-section .title-container h1 {
    margin-top: 0rem;
    margin-bottom: 0rem;
    font-size: 2.5rem;
}

#electricity-section .gillsans-italic {
    color: var(--textColor);
}

#electricity-section .gillsans-regular {
    color: gray;
}

#electricity-section .text-container {
    padding-top: 0px;
    padding-left: 800px;
}

#electricity-section .paragraph-text {
    font-size: 1rem;
    text-align: justify;
    line-height: 1.6;
    margin-bottom: 110px;
    color: var(--textColor);
}

#electricity-section .service-list {
    justify-content: center;
    margin: 0;
}

#electricity-section .service-list li {
    list-style: none; /* Oculta el marcador predeterminado */
    display: flex;
    margin-bottom: 25px;
    text-align: left;
}
#electricity-section .service-list li span {
    display: inline-block;
    width: 25px;
    height: 25px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    margin-right: 25px; /* Espacio entre icono y texto */
}

#electricity-section .service-list .text {
    flex: 1; /* Para que el texto ocupe el espacio restante */
    text-align: justify;
    font-size: 14px;
    color: var(--textColor);
}

#electricity-section .service-list .wire {
    background-image: url("media/icon/cable-de-enchufe.png");
    transform: rotate(40deg);
}

#electricity-section .service-list .led {
    background-image: url("media/icon/brillo-bajo.png");
}

#electricity-section .service-list .electricity-pole {
    background-image: url("media/icon/poste-de-electricidad.png");
}

#electricity-section .service-list .thunder {
    background-image: url("media/icon/tornillo\ \(1\).png");
}

#electricity-section .service-list .shield {
    background-image: url("media/icon/blindaje.png");
}


/* ------------------------------ FOOTER ------------------------------ */
footer {
    background-color: #eae5e0; /* Color de fondo */
    padding: 30px 0;
    font-family: Arial, sans-serif;
    padding-top: 2rem; /* Opcional: agrega un padding superior al footer */

}

.footer-container {
    display: flex;
    justify-content: space-around;
    align-items: start;
    max-width: 1000px;
    margin: auto;
    color: var(--textColor);

}

.footer-section {
    flex: 1;
    padding: 10px;
}

.footer-section h3 {
    font-size: 12px;
    font-weight: bold;
    margin-bottom: 10px;
    color: var(--textColor);
}

.footer-section ul {
    list-style: none;
    padding: 0;
}

.footer-section ul li {
    margin-bottom: 5px;
}

.footer-section ul li a {
    text-decoration: none;
    color: var(--textColor);
    font-size: 0.7rem;
}

.footer-section.logo {
    text-align: left;
}

.footer-section.logo  p{
    font-size: 0.7rem;
}
.footer-section.logo img {
    width: 150px;
    margin-bottom: 10px;
}






@media(min-width:1620px){

    /* ------------------------------ HOME SECTION ------------------------------ */
    #home-section .title-container {
        margin-bottom: 1.25rem;
        padding-right: 18.5rem;
    }
    #home-section .title-container h1 {
        font-size: 4rem;
    }
    #home-section .title-container h2 {
        padding-left: 5rem;
        font-size: 4rem;
    }
    #home-section .text-container {
        padding-left: 40rem;
        padding-right: 44rem;
        margin-top: 4rem;
        hyphens: auto;
    }
    #home-section .paragraph-text {
        font-size: 1.5rem;
    }

    /* ------------------------------ ABOUT_US SECTION ------------------------------ */
    #aboutUs-section .title-container {
        padding-top: 6rem;
        padding-left: 55rem;
    }
    #aboutUs-section .title-container h1 {
        font-size: 3.5rem;
    }
    #aboutUs-section .text-container {
        padding-left: 58rem;
        margin-bottom: 3rem;
    }
    #aboutUs-section .paragraph-text {
        font-size: 1.2rem;
    }
    #aboutUs-section .icon-content_1 {
        padding-left: 58rem; /* 710px */
    }
    #aboutUs-section .icon-content_2 {
        padding-left: 58rem; /* 710px */
    }


    /* ------------------------------ SERVICE SECTION ------------------------------ */
    #service-section .text-container {
        padding-right: 60rem; /* 730px */
    }
    #service-section .paragraph-text {
        font-size: 1.3rem;
        margin-bottom: 5rem;
    }
    #service-section .service-list .icon img {
        width: 1.5rem; /* 25px */
    }
    #service-section .service-list li {
        max-width: 90%;
        margin-bottom: 2.3rem;
    }
    #service-section .service-list .text {
        font-size: 1rem; /* 15px */
    }
    #service-section .contacto-btn {
        padding-right: 65.625rem;
    }

    /* ------------------------------ VERTICALJOB SECTION ------------------------------ */
    #verticalJob-section .title-container {
        padding-right: 50rem; /* 620px */
        padding-top: 2.5rem;
    }
    #verticalJob-section .title-container h1 {
        font-size: 5rem;
    }
    #verticalJob-section .title-container_2 h1 {
        font-size: 3.2rem;
    }
    #verticalJob-section .title-container_2 h2 {
        margin-top: 0rem;
        font-size: 3rem;
        margin-bottom: 5rem;
    }
    #verticalJob-section .text-container {
        padding-left: 30rem;
    }
    #verticalJob-section .paragraph-text {
        font-size: 1.2rem; /* 14.4px */
        padding-right: 35rem;
    }
    #verticalJob-section .service-list li span {
        width: 1.5rem;
        height: 1.5rem;
    }
    #verticalJob-section .service-list .text {
        font-size: 1.2rem; /* 15px */
    }

    /* ------------------------------ WORK AND REFORM SECTION ------------------------------ */
    #workAndReform-section .text-container {
        padding-right: 5.5rem;
        padding-left: 55rem; /* 700px */
    }
    #workAndReform-section .paragraph-text {
        font-size: 1.4rem;
    }
    #workAndReform-section .title-container {
        padding-left: 43rem; /* 610px */
        margin-top: 5rem;
        margin-bottom: 5rem;
    }
    #workAndReform-section .title-container h1 {
        font-size: 2.6rem;
    }
    #workAndReform-section .list-container {
        padding-left: 55rem; /* 700px */
    }
    #workAndReform-section .service-list li span {
        width: 1.25rem; /* 25px */
        height: 1.25rem; /* 25px */
    }
    #workAndReform-section .service-list .text {
        font-size: 1.3rem; /* 15px */
    }
    /* ------------------------------ ELECTRICITY SECTION ------------------------------ */
    #electricity-section .icon-content img {
        width: 80px;
    }
    #electricity-section .title-container {
        margin-bottom: 25px;
        padding-left: 820px;
    }
    #electricity-section .title-container h1 {
        margin-top: 0rem;
        margin-bottom: 0rem;
        font-size: 3.5rem;
    }
    #electricity-section .text-container {
        padding-left: 1020px;
    }
    #electricity-section .paragraph-text {
        margin-top: 20px;
        margin-bottom: 180px;
        font-size: 1.2rem;
    }
    #electricity-section .service-list li span {
        width: 25px;
        height: 25px;
    }
    #electricity-section .service-list .text {
        font-size: 20px;
    }
}

@media (min-width: 1550px) and (max-width: 1619px) {

    /* ------------------------------ ABOUT_US SECTION ------------------------------ */
    #aboutUs-section .title-container {
        padding-top: 6rem;
    }
    #aboutUs-section .text-container {
        padding-left: 47rem;
    }
    #aboutUs-section .paragraph-text {
        font-size: 0.9rem;
    }
    #aboutUs-section .icon-content_1 {
        padding-left: 44rem; /* 710px */
    }
    #aboutUs-section .icon-content_1 img {
        width: 7rem;
        height: 3rem;
    }
    #aboutUs-section .icon-content_1 .logo-imandis {
        width: 7rem;
        height: 5rem;
    }
    #aboutUs-section .icon-content_2 {
        padding-left: 44rem; /* 710px */
    }
    #aboutUs-section .icon-content_2 img {
        width: 7rem;
        height: 3rem;
    }
    #aboutUs-section .icon-content_2 .logo-chicoMonago {
        width: 7rem;
        height: 4rem;
    }


    /* ------------------------------ VERTICALJOB SECTION ------------------------------ */
    #verticalJob-section .title-container {
        padding-right: 41rem; /* 620px */
        padding-top: 3rem;
    }

    /* ------------------------------ WORK AND REFORM SECTION ------------------------------ */
    #workAndReform-section .text-container {
        padding-right: 3.5rem;
        padding-left: 42rem; /* 700px */
    }
    #workAndReform-section .paragraph-text {
        font-size: 1.1rem;
        margin-bottom: 4rem;
    }
    #workAndReform-section .title-container {
        padding-left: 37rem; /* 610px */
        margin-bottom: 6rem;
    }
    #workAndReform-section .title-container h1 {
        font-size: 2.2rem;
    }
    #workAndReform-section .list-container {
        padding-left: 45rem; /* 700px */
    }
    #workAndReform-section .service-list li span {
        width: 1.25rem; /* 25px */
        height: 1.25rem; /* 25px */
    }
    #workAndReform-section .service-list .text {
        font-size: 1rem; /* 15px */
    }
    /* ------------------------------ ELECTRICITY SECTION ------------------------------ */
    #electricity-section .paragraph-text {
        font-size: 1.1rem;
        margin-bottom: 10rem;
    }
    #electricity-section .service-list li span {
        width: 25px;
        height: 25px;
    }
    #electricity-section .service-list .text {
        font-size: 15px;
    }
}

@media(max-width:1420px){

    /* ------------------------------ HOME SECTION ------------------------------ */
    #home-section .text-container {
        padding-left: 29rem;
        padding-right: 32rem;
        margin-top: 4rem;
        hyphens: auto;
    }

    /* ------------------------------ ABOUT_US SECTION ------------------------------ */
    #aboutUs-section .title-container {
        padding-top: 6rem;
    }
    #aboutUs-section .text-container {
        padding-left: 44rem;
    }
    #aboutUs-section .paragraph-text {
        font-size: 0.9rem;
    }
    #aboutUs-section .icon-content_1 {
        padding-left: 44rem; /* 710px */
    }
    #aboutUs-section .icon-content_1 img {
        width: 7rem;
        height: 3rem;
    }
    #aboutUs-section .icon-content_1 .logo-imandis {
        width: 7rem;
        height: 5rem;
    }
    #aboutUs-section .icon-content_2 {
        padding-left: 44rem; /* 710px */
    }
    #aboutUs-section .icon-content_2 img {
        width: 7rem;
        height: 3rem;
    }
    #aboutUs-section .icon-content_2 .logo-chicoMonago {
        width: 7rem;
        height: 4rem;
    }

    /* ------------------------------ SERVICE SECTION ------------------------------ */
    #service-section .text-container {
        padding-right: 44rem; /* 730px */
    }
    #service-section .paragraph-text {
        font-size: 0.9rem;
    }
    #service-section .service-list .icon img {
        width: 1.5rem; /* 25px */
    }
    #service-section .service-list .text {
        font-size: 0.85rem; /* 15px */
    }

    /* ------------------------------ VERTICALJOB SECTION ------------------------------ */
    #verticalJob-section .title-container {
        padding-right: 36rem; /* 620px */
        padding-top: 2.5rem;
    }
    #verticalJob-section .text-container {
        padding-left: 22rem;
    }
    #verticalJob-section .paragraph-text {
        font-size: 0.9rem; /* 14.4px */
        padding-right: 25rem;
    }
    #verticalJob-section .service-list li span {
        width: 1.5rem;
        height: 1.5rem;
    }
    #verticalJob-section .service-list .text {
        font-size: 0.85rem; /* 15px */
    }

    /* ------------------------------ WORK AND REFORM SECTION ------------------------------ */
    #workAndReform-section .text-container {
        padding-right: 3.5rem;
        padding-left: 40rem; /* 700px */
    }
    #workAndReform-section .paragraph-text {
        font-size: 0.9rem;
    }
    #workAndReform-section .title-container {
        padding-left: 37rem; /* 610px */
        margin-bottom: 4rem;
    }
    #workAndReform-section .title-container h1 {
        font-size: 2rem;
    }
    #workAndReform-section .list-container {
        padding-left: 40rem; /* 700px */
    }
    #workAndReform-section .service-list li span {
        width: 1.25rem; /* 25px */
        height: 1.25rem; /* 25px */
    }
    #workAndReform-section .service-list .text {
        font-size: 0.75rem; /* 15px */
    }
    /* ------------------------------ ELECTRICITY SECTION ------------------------------ */
    #electricity-section .text-container {
        padding-left: 720px;
    }
    #electricity-section .paragraph-text {
        font-size: 1rem;
    }
    #electricity-section .service-list li span {
        width: 25px;
        height: 25px;
    }
    #electricity-section .service-list .text {
        font-size: 15px;
    }
}

@media(max-width:1280px){

    /* ------------------------------ HOME SECTION ------------------------------ */
    #home-section .text-container {
        padding-left: 24rem;
        padding-right: 27rem;
        margin-top: 4rem;
        hyphens: auto;
    }
    #home-section .paragraph-text {
        font-size: 1rem;
        text-align: justify;
        line-height: 1.5;
        color: var(--textColor);
    }

    /* ------------------------------ ABOUT_US SECTION ------------------------------ */
    #aboutUs-section .title-container {
        padding-top: 6rem;
    }
    #aboutUs-section .text-container {
        padding-left: 38rem;
    }
    #aboutUs-section .paragraph-text {
        font-size: 0.8rem;
    }
    #aboutUs-section .icon-content_1 {
        padding-left: 35rem; /* 710px */
    }
    #aboutUs-section .icon-content_1 img {
        width: 5rem;
        height: 2rem;
    }
    #aboutUs-section .icon-content_1 .logo-imandis {
        width: 5rem;
        height: 4rem;
    }
    #aboutUs-section .icon-content_2 {
        margin-top: 2.5rem; /* 5px */
        padding-left: 35rem; /* 710px */
    }
    #aboutUs-section .icon-content_2 img {
        width: 5rem;
        height: 2rem;
    }
    #aboutUs-section .icon-content_2 .logo-chicoMonago {
        width: 5rem;
        height: 3rem;
    }

    /* ------------------------------ SERVICE SECTION ------------------------------ */
    #service-section .text-container {
        padding-right: 40rem; /* 730px */
    }
    #service-section .paragraph-text {
        font-size: 0.8rem;
    }
    #service-section .service-list .icon img {
        width: 1.25rem; /* 25px */
    }
    #service-section .service-list .text {
        font-size: 0.8rem; /* 15px */
    }

    /* ------------------------------ VERTICALJOB SECTION ------------------------------ */
    #verticalJob-section .title-container {
        padding-right: 33rem; /* 620px */
        padding-top: 2.5rem;
    }
    #verticalJob-section .text-container {
        padding-left: 20rem; /* 370px */
    }
    #verticalJob-section .paragraph-text {
        font-size: 0.8rem; /* 14.4px */
        padding-right: 23rem;
    }
    #verticalJob-section .service-list li span {
        width: 1.25rem;
        height: 1.25rem;
    }
    #verticalJob-section .service-list .text {
        font-size: 0.8rem; /* 15px */
    }

    /* ------------------------------ WORK AND REFORM SECTION ------------------------------ */
    #workAndReform-section .text-container {
        padding-right: 2.5rem;
        padding-left: 37rem; /* 700px */
    }
    #workAndReform-section .paragraph-text {
        font-size: 0.8rem;
    }
    #workAndReform-section .title-container {
        padding-left: 35.125rem; /* 610px */
    }
    #workAndReform-section .title-container h1 {
        font-size: 2rem;
    }
    #workAndReform-section .list-container {
        padding-left: 37rem; /* 700px */
    }
    #workAndReform-section .service-list li span {
        width: 1.25rem; /* 25px */
        height: 1.25rem; /* 25px */
    }
    #workAndReform-section .service-list .text {
        font-size: 0.8rem; /* 15px */
    }
    /* ------------------------------ ELECTRICITY SECTION ------------------------------ */
    #electricity-section .text-container {
        padding-left: 670px;
    }
    #electricity-section .paragraph-text {
        font-size: 0.9rem;
    }
    #electricity-section .service-list li span {
        width: 20px;
        height: 20px;
    }
    #electricity-section .service-list .text {
        font-size: 13px;
    }
}

@media(max-width:1144px){

    /* ------------------------------ HOME SECTION ------------------------------ */
    #home-section .text-container {
        padding-left: 21rem;
        padding-right: 25rem;
        margin-top: 4rem;
        hyphens: auto;
    }
    #home-section .paragraph-text {
        font-size: 1rem;
        text-align: justify;
        line-height: 1.5;
        color: var(--textColor);
    }

    /* ------------------------------ ABOUT_US SECTION ------------------------------ */
    #aboutUs-section .title-container {
        padding-left: 37rem;
        padding-top: 6rem;
    }
    #aboutUs-section .text-container {
        padding-left: 37rem;
    }
    #aboutUs-section .paragraph-text {
        font-size: 0.8rem;
    }
    #aboutUs-section .icon-content_1 {
        padding-left: 35rem; /* 710px */
    }

    /* ------------------------------ SERVICE SECTION ------------------------------ */
    #service-section .text-container {
        padding-right: 35rem; /* 730px */
    }

    /* ------------------------------ WORK AND REFORM SECTION ------------------------------ */
    #workAndReform-section .text-container {
        padding-right: 2.5rem;
        padding-left: 30rem; /* 700px */
    }
    #workAndReform-section .paragraph-text {
        font-size: 0.8rem;
    }
    #workAndReform-section .title-container {
        padding-left: 30rem; /* 610px */
    }
    #workAndReform-section .title-container h1 {
        font-size: 1.8rem;
    }
    #workAndReform-section .list-container {
        padding-left: 30rem; /* 700px */
    }
    /* ------------------------------ ELECTRICITY SECTION ------------------------------ */
    #electricity-section .text-container {
        padding-left: 630px;
    }
}

@media(max-width:1060px){

    /* ------------------------------ HOME SECTION ------------------------------ */
    #home-section .text-container {
        padding-left: 18rem;
        padding-right: 20rem;
        margin-top: 4rem;
        hyphens: auto;
    }
    #home-section .paragraph-text {
        font-size: 1rem;
        text-align: justify;
        line-height: 1.5;
        color: var(--textColor);
    }

    /* ------------------------------ ABOUT_US SECTION ------------------------------ */
    #aboutUs-section .title-container {
        padding-top: 6rem;
    }
    #aboutUs-section .text-container {
        padding-left: 32rem;
    }
    #aboutUs-section .paragraph-text {
        font-size: 0.8rem;
    }
    #aboutUs-section .icon-content_1 {
        padding-left: 35rem; /* 710px */
    }
    #aboutUs-section .icon-content_1 img {
        width: 5rem;
        height: 2rem;
    }
    #aboutUs-section .icon-content_1 .logo-imandis {
        width: 5rem;
        height: 4rem;
    }
    #aboutUs-section .icon-content_2 {
        margin-top: 2.5rem; /* 5px */
        padding-left: 35rem; /* 710px */
    }
    #aboutUs-section .icon-content_2 img {
        width: 5rem;
        height: 2rem;
    }
    #aboutUs-section .icon-content_2 .logo-chicoMonago {
        width: 5rem;
        height: 3rem;
    }

    /* ------------------------------ SERVICE SECTION ------------------------------ */
    #service-section .text-container {
        padding-right: 32rem; /* 730px */
    }
    #service-section .paragraph-text {
        font-size: 0.8rem;
    }
    #service-section .service-list .icon img {
        width: 1.25rem; /* 25px */
    }
    #service-section .service-list .text {
        font-size: 0.8rem; /* 15px */
    }
    #service-section .logo-text img {
        width: 1rem; /* 400px */
    }

    /* ------------------------------ VERTICALJOB SECTION ------------------------------ */
    #verticalJob-section .title-container {
        padding-right: 2rem; /* 620px */
        padding-top: 2.5rem;
    }
    #verticalJob-section .gillsans-italic_1 {
        font-family: 'Raleway', sans-serif;
        font-style: italic;
        color: var(--textColor);
    }
    #verticalJob-section .text-container {
        padding-left: 11rem; /* 370px */
    }
    #verticalJob-section .paragraph-text {
        font-size: 0.8rem; /* 14.4px */
        padding-right: 15rem;
    }
    #verticalJob-section .service-list li span {
        width: 1.25rem;
        height: 1.25rem;
    }
    #verticalJob-section .service-list .text {
        font-size: 0.8rem; /* 15px */
    }

    /* ------------------------------ WORK AND REFORM SECTION ------------------------------ */
    #workAndReform-section .text-container {
        padding-right: 2.5rem;
        padding-left: 30rem; /* 700px */
    }
    #workAndReform-section .paragraph-text {
        font-size: 0.8rem;
    }
    #workAndReform-section .title-container {
        padding-left: 27rem; /* 610px */
    }
    #workAndReform-section .title-container h1 {
        font-size: 1.8rem;
    }
    #workAndReform-section .list-container {
        padding-left: 30rem; /* 700px */
    }
    #workAndReform-section .service-list li span {
        width: 1.25rem; /* 25px */
        height: 1.25rem; /* 25px */
    }
    #workAndReform-section .service-list .text {
        font-size: 0.8rem; /* 15px */
    }
    /* ------------------------------ ELECTRICITY SECTION ------------------------------ */
    #electricity-section .title-container {
        padding-left: 520px;
    }
    #electricity-section .title-container h1 {
        font-size: 1.9rem;
    }
    #electricity-section .text-container {
        padding-left: 560px;
    }
    #electricity-section .paragraph-text {
        font-size: 0.9rem;
    }
    #electricity-section .service-list li span {
        width: 20px;
        height: 20px;
    }
    #electricity-section .service-list .text {
        font-size: 11px;
    }
}

/* ----- Mobile ----- */
@media(max-width:980px){

    /* ------------------------------ HOME SECTION ------------------------------ */
    #home-section .text-container {
        padding-left: 18rem;
        padding-right: 20rem;
        margin-top: 4rem;
        hyphens: auto;
    }
    #home-section .paragraph-text {
        font-size: 1rem;
        text-align: justify;
        line-height: 1.5;
        color: var(--textColor);
    }

    /* ------------------------------ ABOUT_US SECTION ------------------------------ */
    #aboutUs-section .title-container {
        padding-top: 6rem;
    }
    #aboutUs-section .text-container {
        padding-left: 32rem;
    }
    #aboutUs-section .paragraph-text {
        font-size: 0.8rem;
        hyphens: auto;
    }
    #aboutUs-section .icon-content_1 {
        padding-left: 35rem; /* 710px */
    }
    #aboutUs-section .icon-content_1 img {
        width: 5rem;
        height: 2rem;
    }
    #aboutUs-section .icon-content_1 .logo-imandis {
        width: 5rem;
        height: 4rem;
    }
    #aboutUs-section .icon-content_2 {
        margin-top: 2.5rem; /* 5px */
        padding-left: 35rem; /* 710px */
    }
    #aboutUs-section .icon-content_2 img {
        width: 5rem;
        height: 2rem;
    }
    #aboutUs-section .icon-content_2 .logo-chicoMonago {
        width: 5rem;
        height: 3rem;
    }

    /* ------------------------------ SERVICE SECTION ------------------------------ */
    #service-section .text-container {
        padding-right: 32rem; /* 730px */
    }
    #service-section .paragraph-text {
        font-size: 0.8rem;
        hyphens: auto;
    }
    #service-section .service-list .icon img {
        width: 1.25rem; /* 25px */
    }
    #service-section .service-list .text {
        font-size: 0.7rem; /* 15px */
    }
    #service-section .logo-text img {
        width: 1rem; /* 400px */
    }

    /* ------------------------------ VERTICALJOB SECTION ------------------------------ */
    #verticalJob-section .title-container {
        padding-right: 2rem; /* 620px */
        padding-top: 2.5rem;
    }
    #verticalJob-section .gillsans-italic_1 {
        font-family: 'Raleway', sans-serif;
        font-style: italic;
        color: var(--textColor);
    }
    #verticalJob-section .text-container {
        padding-left: 11rem; /* 370px */
    }
    #verticalJob-section .paragraph-text {
        font-size: 0.8rem; /* 14.4px */
        padding-right: 15rem;
        hyphens: auto;
    }
    #verticalJob-section .service-list li span {
        width: 1.25rem;
        height: 1.25rem;
    }
    #verticalJob-section .service-list .text {
        font-size: 0.8rem; /* 15px */
    }

    /* ------------------------------ WORK AND REFORM SECTION ------------------------------ */
    #workAndReform-section .text-container {
        padding-right: 2.5rem;
        padding-left: 30rem; /* 700px */
    }
    #workAndReform-section .paragraph-text {
        font-size: 0.8rem;
        hyphens: auto;
    }
    #workAndReform-section .title-container {
        padding-left: 27rem; /* 610px */
    }
    #workAndReform-section .title-container h1 {
        font-size: 1.8rem;
    }
    #workAndReform-section .list-container {
        padding-left: 30rem; /* 700px */
    }
    #workAndReform-section .service-list li span {
        width: 1.25rem; /* 25px */
        height: 1.25rem; /* 25px */
    }
    #workAndReform-section .service-list .text {
        font-size: 0.8rem; /* 15px */
    }
    /* ------------------------------ ELECTRICITY SECTION ------------------------------ */
    #electricity-section .title-container {
        padding-left: 520px;
    }
    #electricity-section .title-container h1 {
        font-size: 1.9rem;
    }
    #electricity-section .text-container {
        padding-left: 520px;
    }
    #electricity-section .paragraph-text {
        font-size: 0.8rem;
        hyphens: auto;
    }
    #electricity-section .service-list li span {
        width: 20px;
        height: 20px;
    }
    #electricity-section .service-list .text {
        font-size: 11px;
    }
}

@media(max-width: 880px) {
    .menu-toggle {
        display: flex;
    }
    section {
        scroll-margin-top: 60px; /* Ajusta este valor según la altura del header */
    }
    .nav-links {
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        background: var(--backgroundColor);
        flex-direction: column;
        gap: 15px;
        padding: 20px;
        box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
        transform: translateY(-100%); /* Oculta el menú fuera de la pantalla */
        opacity: 0; /* Hace el menú invisible */
        transition: transform 0.3s ease, opacity 0.3s ease; /* Agrega una animación suave */
        pointer-events: none;
        z-index: 9999; /* Un valor alto para estar por encima */
    }
    .nav-links.active {
        transform: translateY(0); /* Muestra el menú */
        opacity: 1; /* Hace el menú visible */
        pointer-events: auto;
        z-index: 9999; /* Un valor alto para estar por encima */
    }
    h1 { font-size: 1.8em; }
    h2 { font-size: 1.5em; }
    header {
        padding: 10px 15px;
    }
    .logo img {
        width: 150px;
    }
    .contacto-btn-header {
        padding: 5px 8px;
    }
    .contacto-btn {
        font-size: 0.9em;
    }
    .icon-content {
        flex-wrap: wrap;
    }
    .icon-content img {
        width: 50px;
    }
    body{
        background-color: var(--backgroundColor);
    }

    /* ------------ HOME SECTION ------------ */
    #home-section {
        padding: 15px;
        text-align: center;
        background-image: url("media/movil/home-mv.jpg");
        background-size: contain;
        background-position: center;
        margin-top: 60px;
    }
    #home-section .title-container {
        padding: 20px;
        padding-bottom: 0px;
        margin: 0 auto;
        text-align: left;
    }
    #home-section .title-container h1 {
        font-size: 1.75em;
        padding-top: 2rem;
        margin: 0;
    }
    #home-section .title-container h2 {
        font-size: 1.4em;
        margin: 0;
    }
    #home-section .text-container {
        margin: 30px auto;
        padding: 40px;
        margin-bottom: 0px;
        padding-bottom: 0px;
        margin-top: 0px;
        padding-top: 0px;
        max-width: 40%;
        border-radius: 0.25rem;
    }
    #home-section .paragraph-text {
        font-size: 0.85rem;
        text-align: justify;
        color: white;
    }
    #home-section .icon-content {
        margin: 20px;
        padding-top: 0px;
        padding-left: 100px;
        padding-right: 100px;
        padding-bottom: 200px ;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 10px;
    }
    #home-section .icon-content img {
        width: 40px;
        height: auto;
        filter: invert(1); /* Hace los iconos blancos */
    }

    /* ------------ ABOUTUS SECTION ------------ */
    #aboutUs-section {
        padding: 0.93rem; /* 60px */
        background-image: url("media/movil/aboutUs-mv.jpg");
        background-repeat: no-repeat;
        background-size: contain; /* Asegura que la imagen de fondo cubra toda la sección */
        background-position: center; /* Centra la imagen de fondo */
        margin-bottom: 3rem; /* Agrega un margen inferior para separar la sección del footer */
    }
    #aboutUs-section .title-container {
        padding-left: 0rem; /* 690px */
        padding-top: 5.6rem;
        color: white;
    }
    #aboutUs-section .title-container h1 {
        font-size: 2.3rem;
        margin-bottom: 0;
    }
    #aboutUs-section .text-container {
        max-width: 100%;
        margin: 75px;
        padding: 30px;
        border-radius: 0.25rem;
        background-color: rgba(255, 255, 255, 0.8);
    }
    #aboutUs-section .paragraph-text {
        font-size: 0.9rem;
        text-align: justify;
        line-height: 1.5;
        padding-bottom: 1.25rem; /* 20px */
        color: var(--textColor);
    }
    #aboutUs-section .icon-content_1 {
        margin: 0;
        padding-left: 2rem;
    }
    #aboutUs-section .icon-content_1 img {
        width: 5.3rem;
        height: 3rem;
        padding: 10px;
        max-width: 100%;
        border-radius: 0.25rem;
        background-color: var(--movilBackgroundColor);
    }
    #aboutUs-section .icon-content_1 .logo-imandis {
        width: 5rem;
        height: 4rem;
    }
    #aboutUs-section .icon-content_2 {
        margin-left: 0;
        padding-left: 2rem;

    }
    #aboutUs-section .icon-content_2 img {
        width: 5.5rem;
        height: 3rem;
        padding: 20px;
        max-width: 100%;
        border-radius: 0.25rem;
        background-color: var(--movilBackgroundColor);
    }
    #aboutUs-section .icon-content_2 .logo-chicoMonago {
        width: 5.5rem;
        height: 4.3rem;
    }
    /* ------------ SERVICE SECTION ------------ */
    #service-section {
        padding: 0.93rem; /* 60px */
        background-image: url("media/movil/service-mv.jpg");
        background-repeat: no-repeat;
        background-size: contain; /* Asegura que la imagen de fondo cubra toda la sección */
        background-position: center; /* Centra la imagen de fondo */
        margin-bottom: 3rem; /* Agrega un margen inferior para separar la sección del footer */
    }
    #service-section .title-container {
        margin-top: 0;
        color: var(--textColor);
    }
    #service-section .title-container h1 {
        margin-top: 0;
        margin-bottom: 0.1;
        font-size: 2.3rem; /* 80px */
    }
    #service-section .text-container {
        max-width: 100%;
        margin: 60px;
        margin-bottom: 5px;
        padding: 40px;
        padding-bottom: 10px;
        border-radius: 0.25rem;
        background-color: rgba(255, 255, 255, 0.8);
    }
    #service-section .paragraph-text {
        font-size: 1rem;
        text-align: justify;
        line-height: 1.5;
        padding-bottom: 1.875rem; /* 30px */
        color: var(--textColor);
        hyphens: auto;
    }
    #service-section .icon-content {
        position: relative; /* Contenedor relativo para posicionar el rodillo */
        display: inline-block; /* Ajusta al tamaño del contenido */
        justify-content: center;
        text-align: center;
    }
    #service-section .icon-container .logo-text {
        width: 25rem; /* 400px */
        height: auto; /* Mantiene la proporción */
        transform: translateX(250px);
        z-index: 1; /* Asegura que esté por encima */
    }
    #service-section .rodillo-icon {
        position: absolute; /* Se superpone sobre el logo */
        top: 0.0625rem; /* 1px */
        left: 3.325rem; /* 1px */
        width: 3.1rem; /* 60px */
        height: auto;
        margin-left: 200px;
        z-index: 2; /* Asegura que esté por encima */
        transform: rotate(40deg);
        filter: var(--filterIconColor);
        padding-top: 1.875rem; /* 30px */
    }
    #service-section .contacto-btn {
        margin-top: 0em; /* 15px */
        padding-right: 0;
        margin-right: 0rem; /* 730px */
        text-align: center;
    }
    #service-section .service-list .icon {
        padding-right: 0rem; /* 20px */
    }
    #service-section .service-list .icon img {
        width: 0.5rem; /* 25px */
    }
    #service-section .service-list {
        padding: 0;
        margin: 0;
        max-width: 100%;
    }
    #service-section .service-list li {
        width: 100%;
        margin-bottom: 60px;
        margin-top: 20px;
    }
    #service-section .service-list li span {
        width: 15px;
        height: 15px;
    }
    #service-section .service-list .text {
        font-size: 15px;
        text-align: left;
    }

    /* ------------ VERTICALJOB SECTION ------------ */
    #verticalJob-section {
        padding: 15px;
        height: auto; /* Ajusta la altura automáticamente */
        background-size: cover; /* Asegura que la imagen de fondo cubra toda la sección */
        background-image: url("media/movil/trabajosVerticales-mv.jpg");
        margin-bottom: 3rem; /* Agrega un margen inferior para separar la sección del footer */
    }
    #verticalJob-section .title-container {
        padding-right: 0;
        padding-top: 60px;
        padding-bottom: 20px;
        text-align: center;
    }
    #verticalJob-section .title-container h1 {
        font-size: 3em;
    }
    #verticalJob-section .gillsans-italic_1 {
        padding-right:50px;
        color: white;
    }
    #verticalJob-section .title-container_2 {
        padding-bottom: 20px;
        text-align: center;
    }
    #verticalJob-section .title-container_2 h1 {
        font-size: 42px;
        padding-right: 0;
        text-align: center;
    }
    #verticalJob-section .title-container_2 h2 {
        font-size: 40px;
        padding-right: 0;
        text-align: center;
    }
    #verticalJob-section .text-container {
        margin: 20px;
        padding: 40px;
        max-width: 100%;
        border-radius: 0.25rem;
        background-color: rgba(255, 255, 255, 0.82);
        hyphens: auto;
    }
    #verticalJob-section .paragraph-text {
        padding-right: 0;
        font-size: 1rem;
        text-align: justify;
        line-height: 1.5;
        color: var(--textColor);
    }
    #verticalJob-section .service-list li {
        width: 100%;
        margin-left: 100px;
        margin-bottom: 40px;
        margin-top: 20px;
    }
    #verticalJob-section .service-list li span {
        width: 15px;
        height: 15px;
    }
    #verticalJob-section .service-list .text {
        font-size: 15px;
        text-align: left;
    }

    /* ------------ WORK AND REFORM SECTION ------------ */
    #workAndReform-section {
        padding: 15px;
        height: auto; /* Ajusta la altura automáticamente */
        width: auto;
        background-size: cover; /* Asegura que la imagen de fondo cubra toda la sección */
        background-image: url("media/movil/obrasReformasFondo-mv.jpg");
    }
    #workAndReform-section .title-container {
        text-align: center;
        margin-right: 0px;
        padding: 0px;
    }
    #workAndReform-section .title-container h1 {
        font-size: 1.6em;
        padding: 20px;
        max-width: 100%;
        border-radius: 0.25rem;
        background-color: rgba(255, 255, 255, 0.7);
    }
    #workAndReform-section .paragraph-text {
        font-size: 1rem;
        text-align: justify;
        line-height: 1.5;
        color: var(--textColor);
    }
    #workAndReform-section .text-container {
        padding: 40px;
        max-width: 100%;
        border-radius: 0.25rem;
        background-color: rgba(255, 255, 255, 0.7);
        hyphens: auto;
    }
    #workAndReform-section .background-color {
        margin: 20px;
        background-color: rgba(255, 255, 255, 0.7);
    }
    #workAndReform-section .icon-content {
        margin-left: 0;
        margin-top: 20px;
        padding-left: 0;
        justify-content: center;
        flex-wrap: wrap;
    }
    #workAndReform-section .icon-content img {
        width: 475px; /* Ajusta el tamaño de la imagen */
    }
    #workAndReform-section .service-list li {
        width: 100%;
        margin-bottom: 40px;
        margin-left: 100px;
    }
    #workAndReform-section .list-container{
        padding: 40px;
        max-width: 100%;
        border-radius: 0.25rem;
        background-color: rgba(255, 255, 255, 0.7);
    }
    #workAndReform-section .service-list li span {
        width: 15px;
        height: 15px;
    }
    #workAndReform-section .service-list .text {
        font-size: 15px;
        text-align: left;
    }

    /* ------------ ELECTRICITY SECTION ------------ */
    #electricity-section {
        padding: 15px;
        height: auto; /* Ajusta la altura automáticamente */
        width: auto;
        background-size: cover; /* Asegura que la imagen de fondo cubra toda la sección */
        background-image: url("media/movil/electricidadFondo-mv.jpg");
    }
    #electricity-section .title-container {
        padding-top: 0px;
        padding-bottom: 40px;
        text-align: center;
        margin-right: 0px;
        padding-left: 0px;
    }
    #electricity-section .title-container h1 {
        font-size: 4em;
    }
    #electricity-section .paragraph-text {
        font-size: 1.2rem;
        text-align: justify;
        line-height: 1.5;
        color: var(--textColor);
        hyphens: auto;
    }
    #electricity-section .text-container {
        margin: 20px;
        padding: 40px;
        max-width: 100%;
        border-radius: 0.25rem;
        background-color: rgba(255, 255, 255, 0.8);
    }
    #electricity-section .gillsans-regular {
        color: var(--textColor);
    }
    #electricity-section .icon-content {
        margin-left: 0;
        margin-top: 00px;
        margin-bottom: 0;
        margin-right: 550px;
        padding: 0px;
        justify-content: center;
        flex-wrap: wrap;
    }
    #electricity-section .icon-content img {
        width: 70px; /* Ajusta el tamaño de la imagen */
    }
    #electricity-section .service-list  {
        padding-top: 25px;
    }
    #electricity-section .service-list li {
        width: 100%;
        margin-bottom: 40px;
        margin-left: 100px;
    }
    #electricity-section .service-list li span {
        width: 15px;
        height: 15px;
    }
    #electricity-section .service-list .text {
        font-size: 17px;
        text-align: left;
    }

    /* ------------ FOOTER ------------ */
    .footer-container {
        flex-direction: column;
        text-align: center;
    }
    .footer-section {
        flex: none;
        width: 100%;
        margin-bottom: 20px;
    }
    .footer-section.logo {
        text-align: center;
    }
}


@media(max-width: 720px) {
    .menu-toggle {
        display: flex;
    }
    section {
        scroll-margin-top: 60px; /* Ajusta este valor según la altura del header */
    }
    .nav-links {
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        background: var(--backgroundColor);
        flex-direction: column;
        gap: 15px;
        padding: 20px;
        box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
        transform: translateY(-100%); /* Oculta el menú fuera de la pantalla */
        opacity: 0; /* Hace el menú invisible */
        transition: transform 0.3s ease, opacity 0.3s ease; /* Agrega una animación suave */
        pointer-events: none;
        z-index: 9999; /* Un valor alto para estar por encima */
    }
    .nav-links.active {
        transform: translateY(0); /* Muestra el menú */
        opacity: 1; /* Hace el menú visible */
        pointer-events: auto;
        z-index: 9999; /* Un valor alto para estar por encima */
    }
    h1 { font-size: 1.8em; }
    h2 { font-size: 1.5em; }
    header {
        padding: 10px 15px;
    }
    .logo img {
        width: 150px;
    }
    .contacto-btn-header {
        padding: 5px 8px;
    }
    .contacto-btn {
        font-size: 0.9em;
    }
    .icon-content {
        flex-wrap: wrap;
    }
    .icon-content img {
        width: 50px;
    }

    /* ------------ HOME SECTION ------------ */
    #home-section {
        padding: 15px;
        text-align: center;
        background-image: url("media/movil/home-mv.jpg");
        background-size: cover;
        background-position: center;
        margin-top: 60px;
    }
    #home-section .title-container {
        padding: 20px;
        margin: 0 auto;
        text-align: left;
    }
    #home-section .title-container h1 {
        font-size: 1.75em;
        padding-top: 2rem;
        margin: 0;
    }

    #home-section .title-container h2 {
        font-size: 1.4em;
        margin: 0;
    }
    #home-section .text-container {
        margin: 30px auto;
        padding: 40px;
        max-width: 80%;
        padding-bottom: 0px;
        border-radius: 0.25rem;
    }
    #home-section .paragraph-text {
        font-size: 0.85rem;
        text-align: justify;
        color: white;
    }
    #home-section .icon-content {
        padding-left: 0;
        padding-right: 0;
        padding-bottom: 300px;
        margin: 20px;
        padding-top: 0px;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 10px;
    }
    #home-section .icon-content img {
        width: 40px;
        height: auto;
        filter: invert(1); /* Hace los iconos blancos */
    }

    /* ------------ ABOUTUS SECTION ------------ */
    #aboutUs-section {
        padding: 0.93rem; /* 60px */
        background-image: url("media/movil/aboutUs-mv.jpg");
        background-repeat: no-repeat;
        background-size: cover; /* Asegura que la imagen de fondo cubra toda la sección */
        background-position: center; /* Centra la imagen de fondo */
        margin-bottom: 3rem; /* Agrega un margen inferior para separar la sección del footer */
    }
    #aboutUs-section .title-container {
        padding-left: 0rem; /* 690px */
        padding-top: 6.6rem;
        color: white;
    }
    #aboutUs-section .title-container h1 {
        font-size: 2.3rem;
        margin-bottom: 0;
    }
    #aboutUs-section .text-container {
        max-width: 100%;
        margin: 20px;
        padding: 40px;
        border-radius: 0.25rem;
        background-color: rgba(255, 255, 255, 0.8);
    }
    #aboutUs-section .paragraph-text {
        font-size: 0.7rem;
        text-align: justify;
        padding-bottom: 0px;
        line-height: 1.5;
        color: var(--textColor);
        hyphens: auto;
    }
    #aboutUs-section .icon-content_1 {
        margin: 0;
        padding-left: 0;
    }
    #aboutUs-section .icon-content_1 img {
        width: 5.3rem;
        height: 3rem;
        padding: 10px;
        max-width: 100%;
        border-radius: 0.25rem;
        background-color: var(--movilBackgroundColor);
    }
    #aboutUs-section .icon-content_1 .logo-imandis {
        width: 5rem;
        height: 4rem;
    }
    #aboutUs-section .icon-content_2 {
        margin-left: 0;
        padding-left: 0;
    }
    #aboutUs-section .icon-content_2 img {
        width: 5.5rem;
        height: 3rem;
        padding: 20px;
        max-width: 100%;
        border-radius: 0.25rem;
        background-color: var(--movilBackgroundColor);
    }
    #aboutUs-section .icon-content_2 .logo-chicoMonago {
        width: 5.5rem;
        height: 4.3rem;
    }
    /* ------------ SERVICE SECTION ------------ */
    #service-section {
        padding: 0.93rem; /* 60px */
        background-image: url("media/movil/service-mv.jpg");
        background-repeat: no-repeat;
        background-size: cover; /* Asegura que la imagen de fondo cubra toda la sección */
        background-position: center; /* Centra la imagen de fondo */
        margin-bottom: 0rem; /* Agrega un margen inferior para separar la sección del footer */
    }
    #service-section .title-container {
        margin-top: 0;
        color: var(--textColor);
    }
    #service-section .title-container h1 {
        margin-top: 0;
        margin-bottom: 0.1;
        font-size: 2.3rem; /* 80px */
    }
    #service-section .text-container {
        max-width: 100%;
        margin: 20px;
        margin-bottom: 5px;
        padding: 40px;
        padding-bottom: 10px;
        border-radius: 0.25rem;
        background-color: rgba(255, 255, 255, 0.8);
    }
    #service-section .paragraph-text {
        font-size: 0.9rem;
        text-align: justify;
        line-height: 1.5;
        padding-bottom: 1.875rem; /* 30px */
        color: var(--textColor);
        hyphens: auto;
    }
    #service-section .icon-content {
        position: relative; /* Contenedor relativo para posicionar el rodillo */
        display: inline-block; /* Ajusta al tamaño del contenido */
        justify-content: center;
        text-align: center;
    }
    #service-section .icon-container .logo-text {
        width: 17rem; /* 400px */
        height: auto; /* Mantiene la proporción */
        transform: translateX(50px);
        z-index: 1; /* Asegura que esté por encima */
    }
    #service-section .rodillo-icon {
        position: absolute; /* Se superpone sobre el logo */
        top: 0.0625rem; /* 1px */
        left: 3.325rem; /* 1px */
        margin-left: 0;
        width: 3.1rem; /* 60px */
        height: auto;
        z-index: 2; /* Asegura que esté por encima */
        transform: rotate(40deg);
        filter: var(--filterIconColor);
        padding-top: 1.875rem; /* 30px */
    }
    #service-section .contacto-btn {
        margin-top: 0em; /* 15px */
        margin-right: 0rem; /* 730px */
        text-align: center;
    }
    #service-section .service-list .icon {
        padding-right: 0rem; /* 20px */
    }
    #service-section .service-list .icon img {
        width: 0.5rem; /* 25px */
    }
    #service-section .service-list {
        padding: 0;
        margin: 0;
        max-width: 100%;
    }
    #service-section .service-list li {
        width: 100%;
        margin-bottom: 60px;
        margin-top: 20px;
    }
    #service-section .service-list li span {
        width: 15px;
        height: 15px;
    }
    #service-section .service-list .text {
        font-size: 12px;
        text-align: left;
    }

    /* ------------ VERTICALJOB SECTION ------------ */
    #verticalJob-section {
        padding: 15px;
        height: auto; /* Ajusta la altura automáticamente */
        background-size: cover; /* Asegura que la imagen de fondo cubra toda la sección */
        background-image: url("media/movil/trabajosVerticales-mv.jpg");
    }
    #verticalJob-section .title-container {
        padding-right: 0;
        padding-top: 60px;
        padding-bottom: 20px;
        text-align: center;
    }
    #verticalJob-section .title-container h1 {
        font-size: 2em;
    }
    #verticalJob-section .gillsans-italic_1 {
        padding-right:0px;
        margin-right:0;
        color: var(--textColor);
    }
    #verticalJob-section .title-container_2 {
        padding-bottom: 20px;
        text-align: center;
    }
    #verticalJob-section .title-container_2 h1 {
        font-size: 22px;
        padding-right: 0;
        text-align: center;
    }
    #verticalJob-section .title-container_2 h2 {
        font-size: 20px;
        padding-right: 0;
        text-align: center;
    }
    #verticalJob-section .text-container {
        margin: 20px;
        padding: 40px;
        max-width: 100%;
        border-radius: 0.25rem;
        background-color: rgba(255, 255, 255, 0.8);
    }
    #verticalJob-section .paragraph-text {
        font-size: 0.9rem;
        text-align: justify;
        line-height: 1.5;
        color: var(--textColor);
        hyphens: auto;
    }
    #verticalJob-section .service-list li {
        width: 100%;
        margin-bottom: 40px;
        margin-left: 0;
        margin-top: 20px;
    }
    #verticalJob-section .service-list li span {
        width: 15px;
        height: 15px;
    }
    #verticalJob-section .service-list .text {
        font-size: 12px;
        text-align: left;
    }

    /* ------------ WORK AND REFORM SECTION ------------ */
    #workAndReform-section {
        padding: 15px;
        height: auto; /* Ajusta la altura automáticamente */
        width: auto;
        background-size: cover; /* Asegura que la imagen de fondo cubra toda la sección */
        background-image: url("media/movil/obrasReformasFondo-mv.jpg");
    }
    #workAndReform-section .title-container {
        text-align: center;
        margin-right: 0px;
        padding: 0px;
    }
    #workAndReform-section .title-container h1 {
        font-size: 1.6em;
        padding: 20px;
        max-width: 100%;
        border-radius: 0.25rem;
        background-color: rgba(255, 255, 255, 0.7);
    }
    #workAndReform-section .paragraph-text {
        font-size: 0.9rem;
        text-align: justify;
        line-height: 1.5;
        color: var(--textColor);
        hyphens: auto;
    }
    #workAndReform-section .text-container {
        padding: 40px;
        max-width: 100%;
        border-radius: 0.25rem;
        background-color: rgba(255, 255, 255, 0.7);
    }
    #workAndReform-section .background-color {
        margin: 20px;
        background-color: rgba(255, 255, 255, 0.7);
    }
    #workAndReform-section .icon-content {
        margin-left: 0;
        margin-top: 20px;
        justify-content: center;
        flex-wrap: wrap;
    }
    #workAndReform-section .icon-content img {
        width: 350px; /* Ajusta el tamaño de la imagen */
    }
    #workAndReform-section .service-list li {
        width: 100%;
        margin-left: 0;
        margin-bottom: 40px;
    }
    #workAndReform-section .list-container{
        padding: 40px;
        max-width: 100%;
        border-radius: 0.25rem;
        background-color: rgba(255, 255, 255, 0.7);
    }
    #workAndReform-section .service-list li span {
        width: 15px;
        height: 15px;
    }
    #workAndReform-section .service-list .text {
        font-size: 12px;
        text-align: left;
    }

    /* ------------ ELECTRICITY SECTION ------------ */
    #electricity-section {
        padding: 15px;
        height: auto; /* Ajusta la altura automáticamente */
        width: auto;
        background-size: cover; /* Asegura que la imagen de fondo cubra toda la sección */
        background-image: url("media/movil/electricidadFondo-mv.jpg");
    }
    #electricity-section .title-container {
        padding-top: 0px;
        padding-bottom: 40px;
        text-align: center;
        margin-right: 0px;
        padding-left: 0px;
    }
    #electricity-section .title-container h1 {
        font-size: 1.8em;
    }
    #electricity-section .paragraph-text {
        font-size: 1rem;
        text-align: justify;
        line-height: 1.5;
        color: var(--textColor);
        hyphens: auto;
    }
    #electricity-section .text-container {
        margin: 20px;
        padding: 40px;
        max-width: 100%;
        border-radius: 0.25rem;
        background-color: rgba(255, 255, 255, 0.8);
    }
    #electricity-section .gillsans-regular {
        color: var(--textColor);
    }
    #electricity-section .icon-content {
        margin-left: 0;
        margin-top: 60px;
        margin-bottom: 0;
        margin-right: 200px;
        padding: 0px;
        justify-content: center;
        flex-wrap: wrap;
    }
    #electricity-section .icon-content img {
        width: 50px; /* Ajusta el tamaño de la imagen */
    }
    #electricity-section .service-list  {
        padding-top: 15px;
    }
    #electricity-section .service-list li {
        width: 100%;
        margin-left: 0;
        margin-bottom: 40px;
    }
    #electricity-section .service-list li span {
        width: 15px;
        height: 15px;
    }
    #electricity-section .service-list .text {
        font-size: 13px;
        text-align: left;
    }

    /* ------------ FOOTER ------------ */
    .footer-container {
        flex-direction: column;
        text-align: center;
    }
    .footer-section {
        flex: none;
        width: 100%;
        margin-bottom: 20px;
    }
    .footer-section.logo {
        text-align: center;
    }
}