.promo-section {
    height: 100vh;
}

.hero-image {
    clip-path: polygon(45% 0, 100% 0%, 100% 100%, 0 100%);
}

.text-azul{
    color: #4bbce8;
}

.align-justify{
    text-align: justify;
}

.form-check{
    margin-bottom: .25rem !important;
}

.form-check label{
    font-size: 1.1em !important;
}

.form-check-input {
    width: 1.3em !important;
    height: 1.3em !important;
    margin-right: 1em !important;
}

.top-50{
    top: 77% !important;
}

#contacto-section .titulo-secciones{
font-size: 1.786em;
color: #1f1106;
padding-bottom: 0.600em;
position: relative;
border-bottom: 1px solid #dadada;
margin-bottom: 0.7em;
}
#contacto-section .titulo-secciones::after{
    content: ' ';
    width: 4.560em;
    border-bottom: 2px solid transparent;
    display: block;
    border-color: #4bbce8;
    position: absolute;
    bottom: -1px;
}

#contacto-section .form-check {
    margin-bottom: 1.25rem !important;
}


#backToTop {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 1000;
    display: none; /* Oculto por defecto */
    background-color: #4bbce8;
    color: white;
    padding: 10px;
    cursor: pointer;
    transition: background-color 0.3s;
}

#backToTop:hover {
    background-color: #0056b3;
}

.logo-gray{
    filter: grayscale(1);
}

#contacto-section .btn-outline-light:hover .logo-gray, #contacto-section .btn-check:checked+.btn .logo-gray, #contacto-section .btn.active .logo-gray, #contacto-section .btn.show .logo-gray, #contacto-section .btn:first-child:active .logo-gray, #contacto-section :not(.btn-check)+.btn:active .logo-gray {
    filter: grayscale(0) !important;
}

#contacto-section .btn-outline-light:hover, #contacto-section .btn-check:checked+.btn, #contacto-section .btn.active, #contacto-section .btn.show, #contacto-section .btn:first-child:active, #contacto-section :not(.btn-check)+.btn:active{
    background-color: #4bbce8 !important;
}
/*#contacto-section{
    background-image: url('https://www.gonzalezgimenez.com.py/storage/marcas/marca-banner269-1-1729263305.png');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    https://www.gonzalezgimenez.com.py/storage/marcas/marca-banner269-1-1729090298.png*/
    /*https://www.gonzalezgimenez.com.py/storage/marcas/marca-banner269-1-1729092846.png
}*/

.miniaturas{
    contain: content;
    overflow-x: auto;
}

.btn-azul{
    background-color: #4bbce8;
    color: white;
}
.btn-azul:hover, .btn-azul:focus{
    background-color: white !important;
    color: #4bbce8 !important;
    border: 1px solid #4bbce8 !important;
}

.btn-azul:active{
    color: #fff !important;
    border: 1px solid #4bbce8 !important;
}

.card-body .btn-azul{
    max-height: 38px;
    align-self: end;
} 

.btn-verde{
    background-color: #28a745;
    color: white;
    display: flex;
    justify-content: center;
    align-content: center;
}
.btn-verde:hover, .btn-verde:active, .btn-verde:focus{
    background-color: white;
    color: #28a745;
    border: 1px solid #28a745;
}

.btn-outline-verde{
    border: 1px solid #55BE28;
    color: #55BE28;
}

.btn-outline-verde:hover, .btn-outline-verde:active, .btn-outline-verde:focus{
    border: 1px solid #55BE28;
    color: #fff;
    background-color: #55BE28;
}


.tag-izquierdo{
    position: relative;
    top: 10px;
    left: 10px;
    max-width: 60px;
    width: 60px;
}

#searchInput {
    padding-right: 30px;
  }
  
  #clearSearch {
    right: 10px; /* Posiciona la X dentro del input */
  }

.promo-text {
    color: #55BE28;
    padding: 50px;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.sidebar {
    position: relative;
    top: 0;
    margin-bottom: 20px;
}
.hero-image {
    width: 100%;
    height: auto;
}
/* Opcional: ajustar altura máxima del aside para que tenga scroll si es necesario */
@media (min-width: 992px) {
    .sidebar {
        max-height: 100%;
        position: sticky;
        top: 100px;
    }
}

@media (max-width: 992px) {
    .img-principal {
        display: none !important;
    }
    .botones-cta {
        display: flex;
        justify-content: center;
        align-items: center;
    }
}