@font-face {
    font-family: 'hoss_round';
    src: url('../fonts/hoss_round_bold.eot');
    src: url('../fonts/hoss_round_bold.eot?#iefix') format('embedded-opentype'),
         url('../fonts/hoss_round_bold.woff2') format('woff2'),
         url('../fonts/hoss_round_bold.woff') format('woff'),
         url('../fonts/hoss_round_bold.ttf') format('truetype'),
         url('../fonts/hoss_round_bold.svg#hoss_roundbold') format('svg');
    font-weight: 600;
    font-style: normal;
}
@font-face {
    font-family: 'hoss_round';
    src: url('../fonts/hoss_round_light.eot');
    src: url('../fonts/hoss_round_light.eot?#iefix') format('embedded-opentype'),
         url('../fonts/hoss_round_light.woff2') format('woff2'),
         url('../fonts/hoss_round_light.woff') format('woff'),
         url('../fonts/hoss_round_light.ttf') format('truetype'),
         url('../fonts/hoss_round_light.svg#hoss_roundlight') format('svg');
    font-weight: 200;
    font-style: normal;
}
a{text-decoration: none; color: inherit;}


:root{
--bs-emphasis-color-rgb: #09219E;
--bs-border-radius: 0.7rem;
--bs-border-radius-xxl: 4rem;
}


.btn {
    --bs-btn-padding-y: 0.75rem;
}
body{font-family: "Montserrat", sans-serif; font-optical-sizing: auto; font-style: normal; color:#1E1E1E; }
section{padding: 80px 0;}
section + seccion{padding: 80px 0 0;}
h2{font-family: 'hoss_round', sans-serif; font-weight: 600; color: #09219E }
p{color: #737373}
.azul{color: #09219E}
.rotate180{transform: rotate(180deg);} 
.bg-gris{background-color: #D9D9D9}

.btn-primary{
    --bs-btn-color: #fff;
    --bs-btn-bg: #09219E;
    --bs-btn-border-color: #09219E;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #081D8C;
    --bs-btn-hover-border-color: #081D8C;
    --bs-btn-focus-shadow-rgb: 49, 132, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #081D8C;
    --bs-btn-active-border-color: #063170;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #09219E;
    --bs-btn-disabled-border-color: #09219E
}

.btn-secondary{
    --bs-btn-color: #fff;
    --bs-btn-bg: #4B71B8;
    --bs-btn-border-color: #4B71B8;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #425E93;
    --bs-btn-hover-border-color: #425E93;
    --bs-btn-focus-shadow-rgb: 49, 132, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #425E93;
    --bs-btn-active-border-color: #063170;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #4B71B8;
    --bs-btn-disabled-border-color: #4B71B8
}


.btn-outline-primary {
    --bs-btn-color: #000;
    --bs-btn-border-color: #D9D9D9;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #09219E;
    --bs-btn-hover-border-color: #09219E;
    --bs-btn-focus-shadow-rgb: 13, 110, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #09219E;
    --bs-btn-active-border-color: #09219E;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #09219E;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: #09219E;
    --bs-gradient: none;
}
.navbar{
    --bs-navbar-active-color: #09219E;
}
.nav-link:focus, .nav-link:hover{color:#09219E;}


.dropdown-menu{border-radius: 0 0 20px 20px; overflow: hidden;position:absolute!important; width: 100%}

.dropdown-item:focus, .dropdown-item:hover {color: #fff; background-color: #F57202;}

.pildora{display: block; font-family: 'hoss_round', sans-serif; font-weight: 600; color: #FFFFFF; border-radius: 50px; text-align: center; padding: 5px;}
.pildora.rosa{background-color: #CE458D}
.pildora.verde{background-color: #30A965}
.pildora.azul_pildora{background-color: #09219E}


#banner.inicio{background-image: url('../img/banner/hero_home.avif'); min-height: calc(100vh - 92px)!important; position: relative;background-size: cover; animation: panLoop 12s ease-in-out infinite alternate;
}

@keyframes panLoop {
  0% {background-position: left center; }
  100% {background-position: right center; }
}


#banner:not(.inicio){ background-size: cover; background-position: center; color: #ffffff; padding: 100px 0; min-height: calc(50vh - 92px); position: relative;}
#banner h2{font-family: 'hoss_round', sans-serif; font-weight: 200; display: inline-block; background-color: #09219E; padding: 60px 60px 60px 160px; border-radius: 0 120px 120px 0; line-height: 50px; position: relative; color: #fff; font-size: 50px; position: absolute; left: 0; top: 0;         min-height: 100px;
        display: flex; align-items:center; }
#banner:not(.inicio) h2{transform: translateY(50%); padding: 40px 60px 40px 160px;     transform: translateY(-50%); top: 50%}
#banner h2 span{font-weight: 600;}
#banner:after{content: '';position: absolute;width: 208px;height: 50px;right: 0;bottom: 0;transform: translateY(-50%);border-radius: 50px 0 0 50px;}
#banner.inicio h2{font-size: calc(1.325rem + .9vw)!important;     align-items: flex-start;
    flex-direction: column;}
#banner.inicio h2:after{content: '';position: absolute;width: 208px;background-color: #CE458D;height: 50px;left: 0;bottom: 0;transform: translateY(50%);border-radius: 0 50px 50px 0; }

#banner.inicio:after{background-color: #C7BE00;}

#banner.somos{background-image: url('../img/banner/hero_somos.avif');}
#banner.somos:after{background-color: #F57202;}

#banner.sustentable{background-image: url('../img/banner/hero_sustentable.avif'); animation: panLoopToBottom 10s ease-in-out infinite alternate;}
#banner.sustentable:after{background-color: #30A965;}

#banner.cadena_valor{background-image: url('../img/banner/hero_cadena_valor.avif');}
#banner.cadena_valor:after{background-color: #6FACA8;}


#banner.equipo{background-image: url('../img/banner/hero_equipo.avif'); animation: panLoopToBottom 10s ease-in-out infinite alternate;}
#banner.equipo:after{background-color: #F57202;}


/*
@keyframes panLoopToBottom {
  0% {background-position: center top; }
  100% {background-position: center bottom; }
}
*/


#banner.clientes{background-image: url('../img/banner/hero_clientes.webp'); animation: panLoopToBottom 10s ease-in-out infinite alternate;}
#banner.clientes:after{background-color: #C7BE00;}


#banner.comunidades{background-image: url('../img/banner/hero_comunidades.avif'); animation: panLoopToBottom 10s ease-in-out infinite alternate;}
#banner.comunidades:after{background-color: #CE458D;}
#comunidades .items > div:first-child{background-color: #D0D5ED; border-radius: 0 90px 90px 0;}


#banner.ambiente{background-image: url('../img/banner/hero_ambiente.avif'); animation: panLoopToBottom 10s ease-in-out infinite alternate;}
#banner.ambiente:after{background-color: #30A965;}

.video-box {position: relative; display: inline-block; }
.play-btn {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 40px; background: rgba(0,0,0,0.5); color: #fff; border: 0; padding: 11px 20px 20px 26px; border-radius: 50%; width: 80px; height: 80px; cursor: pointer; }
.play-btn.hide {display: none; }

.owl-theme .owl-nav [class*='owl-'],
.owl-theme .owl-nav [class*='owl-']:hover {background:transparent;}


/********* SUSTENTABLE *******************/

#estrategia .card{border: 0; position: relative;}
#estrategia .card.h-100 > img{border-radius: 20px; }
#estrategia .card .info{position: absolute;top: 0;left: 0;right: 0;text-align: center;font-family: 'hoss_round', sans-serif;font-weight: 200;color: #fff;opacity: 0;border-radius: 20px;height: 100%;transition: all 1s;display: flex;align-items: center;flex-direction: column;justify-content: center;}
#estrategia .card .info.economico{background-color: rgba(37, 156, 206, 0.9);}
#estrategia .card .info.social{background-color: rgba(231, 57, 57, 0.9);}
#estrategia .card .info.ambiental{background-color: rgba(128, 178, 120, 0.9);}
#estrategia .card:hover .info{opacity: 1;}


/********* CADENA_VALOR *******************/


#cadena_valor hr{background-image: url('../img/cadena_valor.avif');height: 279px;opacity: 1;border: 0;background-size: cover;margin-bottom: 45px;background-position: center;}


/********* equipo *******************/


#equipo hr{background-image: url(../img/equipo/hr_img.webp); height: 240px; opacity: 1; border: 0; background-size: contain; margin-bottom: 45px; background-repeat: no-repeat; }


/********* CLIENTES *******************/

.tarjetas_cliente .card{text-align: center; padding: 20px; border-radius:20px; border: 0; min-height:120px;  }
.tarjetas_cliente .card h2{color:#fff; margin: 0;}
.tarjetas_cliente .card p{color:#fff; margin: 0; line-height: 18px}
.tarjetas_cliente a + img,
.tarjetas_cliente .card + img{width: 100%; border-radius: 20px; margin-top:20px;} 


.tarjetas_cliente div:nth-child(1) .card{background-color: #F57202;}
.tarjetas_cliente div:nth-child(2) .card{background-color: #CE458D;}
.tarjetas_cliente div:nth-child(3) .card{background-color: #30A965;}
.tarjetas_cliente div:nth-child(4) .card{background-color: #006056;}
.tarjetas_cliente a{position: relative; height: 120px; display: inline-block; width: 100%}
.tarjetas_cliente a:after{position: absolute;content: '';width: 20px;height: 20px;right: 10px;bottom: 10px;background-image: url(../img/sustentable/plus.svg);background-size: contain;}



#nuestra_escencia .card{background-color: #F2F2F2; border: 0; padding: 20px; border-radius: 20px}
#nuestra_escencia .card h3{font-family: 'hoss_round', sans-serif; font-weight: 200;}
#nuestra_escencia .card img{ margin: 20px 20px -20px -20px; width: 55%; border-radius: 0 0 0 20px;}


#ennumeros .owl-carousel .item h4{margin: 20px 0; color: #09219E;font-family: 'hoss_round', sans-serif; font-weight: 600;    margin: 15px 0 0;}



#owl_nosotros {overflow: visible !important; position: relative; padding: 0 20px; }
#owl_nosotros::before,
#owl_nosotros::after {content: ''; position: absolute; top: 0; bottom: 0; width: 100px; z-index: 10; }
#owl_nosotros::before {left: 0; background: linear-gradient(to right, rgba(255,255,255,1), rgba(255,255,255,0)); transform: translateX(20px); }
#owl_nosotros::after {right: 0; background: linear-gradient(to left, rgba(255,255,255,1), rgba(255,255,255,0)); transform: translateX(-20px);}



.owl-nav {position: absolute; top: 40%; width: 100%; z-index: 20;}
.owl-prev, .owl-next {width: 40px; height: 40px; font-size: 18px; cursor: pointer; z-index: 200; }

.owl-prev { position: absolute; left: 10px; }
.owl-next { position: absolute; right: 10px; }




@media (max-width: 992px){
    .dropdown-menu{padding-bottom: 0}
    section{padding: 30px 0}


#banner:not(.inicio) {min-height: calc(60vw - 91px)}


    #banner.inicio h2 {font-size: 40px!important; padding: 60px;}    

    #equipo hr {background-size: cover;}
    .bg-gris{background-color: transparent;}
    #banner:after{content: none;}
    #cadena_valor hr{display: none}
    #banner:not(.inicio) h2 { padding: 0 35px;
        font-size: 27px;
        line-height: 38px;
        transform: none; }


#owl_comunidades .pildora{margin-top: -45px; position: absolute; width: 100%; }


#owl_estrategia img[src="img/sustentable/plus.svg"]{width: inherit;}



    .img-hover {position: relative; display: inline-block; overflow: hidden; }
.img-hover img {transition: transform 0.3s ease, opacity 0.3s ease; display: block; }
.img-hover::before {content: ""; position: absolute; inset: 0; background: rgba(255, 255, 255, 0.5); /* oscurece */ opacity: 0; transition: opacity 0.3s ease; z-index: 1; }
.img-hover::after {content: ""; position: absolute; top: 50%; left: 50%; width: 60px; height: 60px; background: url("../img/sustentable/plus.svg") no-repeat center center; background-size: contain; transform: translate(-50%, -50%) scale(0.8); opacity: 0; transition: all 0.3s ease; z-index: 2;filter: brightness(0.5)  }
.img-hover:hover::before {opacity: 1; }
.img-hover:hover::after {opacity: 1; transform: translate(-50%, -50%) scale(1); }
.img-hover:hover img {transform: scale(1.05); }


.dropdown{position: static;} 
.nav-link.dropdown-toggle{text-indent: 9999999999999999%; overflow: hidden; background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-list' viewBox='0 0 16 16'><path fill-rule='evenodd' d='M2.5 12a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5m0-4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5m0-4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5'/></svg>"); width: 40px; height: 40px; background-size: contain;
}



}