/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
    .squares-3-xs { display: none; }
    .squares-4-xs { display: none; }
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {}

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) {}

main { padding-top: var(--navbar-height); background: var(--bg-color); z-index: 1; }

main :is(header, section) h1 { color: var(--text-color); font-size: 3rem; font-weight: 500; line-height: 1.3; margin-bottom: 1.5rem; }
main :is(header, section) h2 { color: var(--text-color); font-size: 2.8rem; font-weight: 500; line-height: 1.3; margin-bottom: 4rem; }
main :is(header, section) h3 { color: var(--text-color); font-size: 2.3rem; font-weight: 500; line-height: 1.3; margin-bottom: 1.8rem; }
main :is(header, section) h4 { color: var(--text-color); font-size: 1.2rem; font-weight: 500; line-height: 1.6; margin-bottom: 0; }
main :is(header, section) h5 { color: var(--gray); font-size: 1rem; font-weight: 400; line-height: 2; margin-bottom: 2.5rem; text-align: center; }
main :is(header, section) h6 { color: var(--text-color); font-size: 1rem; font-weight: 400; line-height: 2.15; margin-bottom: 1rem; }
main :is(header, section) .text-1 { color: var(--gray); font-size: 1.1rem; font-weight: 400; line-height: 2; margin-bottom: 2rem; }
main :is(header, section) .text-2 { color: var(--gray); font-size: 1rem; font-weight: 400; line-height: 2.15; margin-bottom: 0; }
main :is(header, section) .text-3 { color: var(--gray); font-size: .95rem; font-weight: 400; line-height: 2.15; margin-bottom: 0; }
main :is(header, section) .text-4 { color: var(--gray); font-size: .9rem; font-weight: 400; line-height: 2.15; margin-bottom: 0; }
main :is(header, section) .text-5 { color: var(--text-color); font-size: 1rem; font-weight: 500; line-height: 2.15; margin-bottom: 0; }

main header { position: relative; }
main header#inicio { background: var(--bg-color); background-size: contain; background-repeat: no-repeat; background-position: right center; background-attachment: local; }
main header .container {  }
main header .container .content { padding: 7rem 0; display: flex; flex-direction: row; flex-wrap: wrap; align-content: flex-start; }
main header#inicio .container .content { padding: 10rem 0; }
main header .info { flex: 0 0 55%; margin: 0 auto 0 0; padding-right: 5rem; }
main header#inicio .info { padding-right: 0; margin: 0; }
main header .image { flex: 0 0 45%; }
main header .image :is(img, video) { display: block; text-align: center; margin: 0 auto; object-fit: contain; width: 100%; height: 100%; }

main header .custom-icons { position: absolute; top: 0; right: 0; bottom: 0; width: 45%; padding: 0; }

main header .links { display: flex; flex-wrap: wrap; align-content: center; justify-content: flex-start; align-items: center; gap: 1.2rem; }
main header :is(a.f-btn, a.s-btn) { text-align: center; font-size: .9rem; font-weight: 400; line-height: 2; padding: .8rem 1.2rem; }
main header a.f-btn {  }
main header a.f-btn.desktop {  }
main header a.f-btn.mobile { display: none; }
main header a.s-btn {  }
main header.error h1 { font-size: 5.5rem; margin-bottom: 0; }
main header.error .text-1 { font-size: 1.9rem; }

main header.aboutUs { background: var(--light-blue-1); }
main header.aboutUs .container {  }

main section {  }
main section.bg-color-1 { background: var(--bg-color-1); }
main section .section-container {  }
main section .section-container .content { padding: 6.5rem 0; }

main section#clientes {  }
main section#clientes.sp { background: var(--bg-color-1); }
main section#clientes .section-container {  }
main section#clientes .section-container .content { padding: 2rem 0 4rem 0; }
main section#clientes .heading { width: 55%; margin: 0 auto; }
main section#clientes h3 { text-align: center; margin-bottom: 3rem; }
main section#clientes .text-1 { text-align: center; margin-bottom: 0; }

main section#summary {  }
main section#summary.sp { background: var(--bg-color-1); }
main section#summary .section-container {  }
main section#summary .section-container .content {  }
main section#summary .heading { width: 55%; margin: 0 auto; }
main section#summary h3 { text-align: center; margin-bottom: 3rem; }
main section#summary .text-1 { text-align: center; margin-bottom: 0; }

main section#empresa { background: var(--bg-color-1); }
main section#empresa .section-container {  }
main section#empresa .section-container .content {  }
main section#empresa .heading { display: block; width: 45%; margin: 0 auto; }
main section#empresa h3 { text-align: center; }
main section#empresa .text-1 { text-align: center; }

main section#nosotros {  }
main section#nosotros .section-container {  }
main section#nosotros .section-container .content {  }
main section#nosotros .heading { display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; align-items: stretch; }
main section#nosotros .heading .column { flex: 1 0 0%; }
main section#nosotros .heading .column.image {  }
main section#nosotros .heading .column.image img { width: 100%; height: 100%; display: block; margin: 0; text-align: start; object-fit: cover; padding-right: 5.5rem; }
main section#nosotros .heading .column.info { display: flex; flex-direction: column; flex-wrap: nowrap; align-items: flex-start; justify-content: flex-start; }
main section#nosotros .heading .column.info h3 { width: 80%; margin-right: auto; }
main section#nosotros .heading .column.info .text-1 { flex: 0 0 auto; }
main section#nosotros .heading .column.info a.btn { padding: 0; }
main section#nosotros .heading .column.info a.btn .arrow {  }
main section#nosotros .heading .column.info a.btn .arrow img.head {  }

main section#servicios {  }
main section#servicios .section-container {  }
main section#servicios .section-container .content {  }
main section#servicios h3 { display: block; width: 30%; margin-left: 0; margin-right: auto; margin-bottom: 2.5rem; }

main section#productos { background: var(--bg-color-3); }
main section#productos .section-container {  }
main section#productos .section-container .content { padding: 10rem 0; }
main section#productos h2 { text-align: center; color: var(--light-text-color); width: 40%; margin-left: auto; margin-right: auto; }

main section#socios {  }
main section#socios .section-container {  }
main section#socios .section-container .content { padding: 6.5rem 0 8rem 0; display: flex; flex-direction: row; justify-content: flex-start; align-items: stretch; flex-wrap: wrap; }
main section#socios h3 {  }
main section#socios .text-1 {  }
main section#socios .column {  }
main section#socios .column.heading { flex: 1 1 35%; width: 35%; padding-right: 3rem; position: relative; box-shadow: 1rem 0 1.5rem .5rem #FFFFFF; z-index: 5; }
main section#socios .column.carousel { flex: 1 1 65%; width: 65%; z-index: 4; }

main section#why {  }
main section#why.aboutUs { background: var(--light-blue-1); }
main section#why .section-container {  }
main section#why .section-container .content { padding: 6.5rem 0 10rem 0; }
main section#why h3 { text-align: center; margin-bottom: 2rem; }
main section#why .text-2 { text-align: center; width: 35%; margin: 0 auto; margin-bottom: 3rem; }
main section#coverage .text-2 { text-align: center; width: 45%; margin: 0 auto; margin-bottom: 3rem; }

main section#contactPage { background: var(--bg-color-1); min-height: calc(100vh - var(--navbar-height)); }
main section#contactPage .section-container {  }
main section#contactPage .section-container .content { padding: 2.5rem 0 10rem 0; }

main section.aboutUs {  }
main section.aboutUs .section-container {  }
main section.aboutUs .section-container .content {  }

main section.badges { background: var(--bg-color-1); }
main section.badges .section-container {  }
main section.badges .section-container .content {  }

main section.demo-cards { background: var(--bg-color-3); color: var(--light-text-color); }
main section.demo-cards .section-container {  }
main section.demo-cards .section-container .content {  }
main section.demo-cards h3 { margin: 0 auto; text-align: center; color: var(--light-text-color); margin-bottom: 2.5rem; }

.bullet-point { margin: 0 .5rem 0 1rem; }
.g-strong { font-weight: 500!important; color: var(--text-color)!important; }
.g-strong.light { font-weight: 500!important; color: var(--light-text-color)!important; }
.bullet-list { list-style-type: disc; }
.bullet-list.lg { list-style-type: none; padding-left: 0; margin-bottom: 0; }
.bullet-list li { padding: .25rem 0; }

.custom-icons { position: relative; }
.custom-icons .bg-img { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 1; width: 100%; height: 100%; }
.custom-icons .bg-img img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; border-radius: 0 0 0 50%; }
.custom-icons .container { width: 100%; height: 100%; position: relative; z-index: 2; display: flex; flex-direction: column; flex-wrap: nowrap; align-items: center; justify-content: center; }
.custom-icons .container .grid { display: grid; grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(3, calc(100% / 3)); gap: 0; height: auto; align-items: stretch; justify-items: stretch; justify-content: center; position: relative; }
.custom-icons .container .grid .icon { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; overflow: hidden; max-width: 120px; }
.custom-icons .container .grid .icon.arrows { align-items: flex-end; }
.custom-icons .container .grid .icon :is(img, svg) { width: 100%; height: auto; object-fit: contain; display: block; }

/****** contact page ******/
.contact-card { background: var(--bg-color); box-shadow: 0px 4px 40px 0px rgba(25, 85, 139, 0.03); padding: 2rem; width: 60%; margin: 0 auto; }
.contact-card h2 { margin-bottom: .8rem; font-size: 2.5rem; }
.contact-card .text-2 { font-size: .95rem; }
.contact-card .text-2 a { color: var(--text-color); text-decoration: none; }
.contact-card .text-2 a:hover { text-decoration: underline; }

.contact-form { display: flex; flex-wrap: wrap; margin: 0; row-gap: .5rem; column-gap: 2rem; padding-top: 2rem; }
.contact-form .form-column { padding: 0; flex: 0 0 auto; width: calc(50% - 1rem); }
.contact-form .form-column.hidden { display: none; }
.contact-form .form-column.full { flex: 0 0 auto; width: 100%; }
.contact-form .form-column :is(input, select, textarea) { display: block; width: 100%; background: var(--bg-color-1); color: var(--text-color); border: 0; padding: .7rem 1rem; outline: none; border-right: .5rem solid transparent; line-height: 1; font-size: .95rem; border-radius: 0; }
.contact-form .form-column :is(input.error, select.error, textarea.error) { outline: 1px solid var(--danger-color); color: var(--danger-color); }
.contact-form .form-column input[type="number"]::-webkit-outer-spin-button, .contact-form .form-column input[type="number"]::-webkit-inner-spin-button { appearance: none; -webkit-appearance: none; }
.contact-form .form-column input::placeholder, .contact-form .form-column select::placeholder, .contact-form .form-column textarea::placeholder, .contact-form .form-column .disabled { color: var(--gray-2); }
.contact-form .form-column input.error::placeholder, .contact-form .form-column select.error::placeholder, .contact-form .form-column textarea.error::placeholder { color: var(--danger-color); }
.contact-form .form-column .error-msg { opacity: 0; transition: 0.2s; color: var(--danger-color); font-size: .75rem; display: inline-block; margin: 0.35rem 0; }
.contact-form .form-column .error-msg.show { opacity: 1; }
.contact-form .form-column button[type="submit"] { margin-top: 2rem; font-size: .95rem; }

/****** slider ******/
:root { --n-logos: 6; }
@keyframes sliderAnimation {
    0% { transform: translateX(0); }
    100% { transform: translateX(calc(-600% / var(--n-logos))); }
}
.slider { overflow-x: hidden; position: relative; z-index: 4; }
.slider .overlay { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 3; background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 5%, rgba(255,255,255,0) 95%, rgba(255,255,255,1) 100%); }
.sp .slider .overlay { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 3; background: linear-gradient(90deg, rgba(244,250,255,1) 0%, rgba(244,250,255,0) 5%, rgba(244,250,255,0) 95%, rgba(244,250,255,1) 100%); }
.slider .track { display: flex; animation: sliderAnimation 30s linear infinite; position: relative; z-index: 2; }
/* .slider:hover .track { animation-play-state: paused; } */
.slider .track .item { position: relative; flex: 0 0 calc(100% / var(--n-logos)); padding: 0 1.5rem; }
.slider .track .item img { width: 100%; height: auto; display: block; text-align: center; margin: 0 auto; }

.mixed-content-1 { display: flex; flex-direction: row; flex-wrap: wrap; align-content: flex-start; justify-content: space-between; align-items: stretch; }
.mixed-content-1 .heading { flex: 0 1 65%; margin: 0 auto 0 0; padding-bottom: 3.5rem; }
.mixed-content-1 .info { flex: 1 0 50%; padding-bottom: 4.5rem; }
.mixed-content-1 .info .subtitle { margin-bottom: 0; }
.mixed-content-1 .info .text { margin-bottom: 1rem; }
.mixed-content-1 .image { flex: 1 0 50%; overflow: hidden; padding-bottom: 4.5rem; position: relative; }
.mixed-content-1 .image img { display: block; margin: 0 auto; text-align: center; width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; padding-bottom: 4.5rem; position: absolute; }
.mixed-content-1 .image.contain img { object-fit: contain; object-position: 50% 0%; max-height: 65vh; }
.mixed-content-1 .image.f img { padding-left: 4.5rem; }
.mixed-content-1 .image.s img { padding-right: 4.5rem; }
.mixed-content-1 .note { flex: 0 0 55%; margin: 0 auto; }
.mixed-content-1 .graph { flex: 1 0 100%; }
.mixed-content-1 .graph .graph-container { display: block; width: 80%; margin: 0 auto; text-align: center; background: var(--light-blue-1); }
.mixed-content-1 .graph .graph-container img { display: block; width: 100%; height: auto; object-fit: contain; object-position: 50% 50%; padding: 4rem 3rem; margin: 0 auto; }
.mixed-content-1 .columns { gap: 3rem; display: flex; flex-direction: row; flex-wrap: wrap; align-content: flex-start; justify-content: center; align-items: stretch; padding-left: 0; margin-bottom: 0; padding-top: 5rem; }
.mixed-content-1 .columns .column { flex: 1 0 100%; }
.mixed-content-1 .columns.quad .column { flex: 1 0 calc(25% - 3rem); }
.mixed-content-1 .columns .column .title { margin-bottom: 1.5rem; }

.squares-1 { padding-top: 2rem; display: flex; flex-direction: row; flex-wrap: wrap; align-items: stretch; justify-content: space-between; align-content: flex-start; gap: 3rem; }
.squares-1 .square { flex: 1 0 0%; background: var(--bg-color); border: 1px solid var(--stroke-color); box-shadow: 0px 4px 40px 0 rgba(25, 85, 139, 0.03); transition: 0.5s; }
.squares-1 .square:hover { transform: scale(1.01); box-shadow: 0px 4px 40px 0 rgba(25, 85, 139, 0.1); }
.squares-1 .square .square-content { padding: 2.3rem; }
.squares-1 .square h4 { margin-bottom: 1.2rem; }
.squares-1 .square h4 .icon { width: auto; height: 2.4rem; display: inline-block; vertical-align: text-bottom; filter: var(--pri-color-filter); margin-right: .5rem; }
.squares-1 .square .text-2 {  }
.squares-1 .square.f-square {  }
.squares-1 .square.s-square {  }

.squares-2 { padding-top: 5rem; display: flex; flex-direction: row; flex-wrap: wrap; align-content: flex-start; gap: 2.5rem; align-items: stretch; justify-content: space-evenly; }
.squares-2 .square { flex: 1 0 0%; background: var(--pri-color-2); box-shadow: 0px 4px 40px 0px rgba(25, 85, 139, 0.03); transition: 0.4s; }
.squares-2 .square:hover { transform: scale(1.02); box-shadow: 0px 4px 40px 0px rgba(25, 85, 139, 0.35); }
.squares-2 .square .square-content { padding: 1.5rem; text-align: center; }
.squares-2 .square h4 { color: var(--light-text-color); font-size: 2.8rem; font-weight: 500; line-height: 1.3; margin-bottom: 0; text-align: center; }
.squares-2 .square h5 { color: var(--light-text-color); font-size: 1.4rem; font-weight: 400; line-height: 1.6; margin-bottom: .5rem; text-align: center; }
.squares-2 .square .text-3 { color: var(--light-text-color); }

.tabs { display: flex; flex-direction: row; flex-wrap: wrap; align-content: flex-start; justify-content: space-between; align-items: stretch; gap: 4rem; }
.tabs.reversed { flex-direction: row-reverse; }
.tabs .column { flex: 1 0 0%; position: relative; }
.tabs .column.info {  }
.tabs .column.image {  }
.tabs .column ul.tablist { display: flex; flex-direction: column; justify-content: flex-start; align-items: stretch; margin-bottom: 0; padding-left: 0; list-style: none; }
.tabs .column ul.tablist li.tab { cursor: pointer; flex: 1 0 100%; color: var(--text-color); transition: 0.4s; border-bottom: 1px solid var(--stroke-color); }
.tabs .column ul.tablist li.tab:hover { background: var(--light-blue-2); }
/* .tabs .column ul.tablist li.tab:first-child { border-top: 1px solid var(--stroke-color); } */
.tabs .column ul.tablist li.tab.active { background: var(--pri-color); color: var(--light-text-color); }
.tabs .column ul.tablist li.tab .tab-content { padding: 1.8rem 1.5rem 1.2rem 1.5rem; }
.tabs .column ul.tablist li.tab.active .tab-content { padding: 1.5rem; }
.tabs .column ul.tablist li.tab .heading { display: flex; align-items: center; }
.tabs .column ul.tablist li.tab .body { display: grid; grid-template-rows: 0fr; transition: 0.2s; }
.tabs .column ul.tablist li.tab.active .body { grid-template-rows: 1fr; }
.tabs .column ul.tablist li.tab .inner-body { transition: 0.4s; overflow: hidden; padding-top: 0rem; }
.tabs .column ul.tablist li.tab h6 { transition: 0.4s; flex: 1 0 0%; font-size: 1.1rem; margin-bottom: .6rem; font-weight: 500; color: var(--text-color); }
.tabs .column ul.tablist li.tab.active h6 { color: var(--light-text-color); }
.tabs .column ul.tablist li.tab :is(.more, .link) { flex: 0 1 35%; color: var(--text-color); transition: 0.4s; text-align: end; margin-bottom: .6rem; }
.tabs .column ul.tablist li.tab.active :is(.more, .link) { color: var(--light-text-color); font-size: .9rem; }
.tabs .column ul.tablist li.tab :is(.more, .link) img { display: inline-block; width: .7rem; height: .7rem; filter: var(--text-color-filter); transition: 0.4s; }
.tabs .column ul.tablist li.tab:not(.active) .link { display: none; }
.tabs .column ul.tablist li.tab.active .more { display: none; }
.tabs .column ul.tablist li.tab.active :is(.more, .link) img { filter: var(--light-text-color-filter); }
.tabs .column ul.tablist li.tab .text-3 { color: var(--text-color); }
.tabs .column ul.tablist li.tab.active .text-3 { color: var(--light-text-color); }
.tabs .column .panel { height: 100%; }
.tabs .column .panel.active {  }
.tabs .column .panel img { max-height: 55vh; width: 100%; height: 100%; display: block; margin: 0 auto; object-fit: cover; object-position: 50% 50%; }
.tabs .column .panel.contain img { object-fit: contain; }

.tabs-2 { padding-top: 1rem; }
.tabs-2 .controls { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: stretch; gap: 1.5rem; align-content: flex-start; padding-bottom: 3rem; }
.tabs-2 .controls button { font-size: .9rem; }
.tabs-2 .tabs-container { display: flex; flex-direction: row; align-items: stretch; flex-wrap: nowrap; justify-content: normal; overflow: hidden; }
.tabs-2 .tab { width: 100%; flex: 1 0 100%; display: block; opacity: 0; transition: .4s; border: 1px solid var(--stroke-color); box-shadow: 0px 4px 40px 0 rgba(var(--darker-pri-color-rgb), .03); order: 2; }
.tabs-2 .tab.active { opacity: 1; order: 1; }
.tabs-2 .tab.hide { opacity: 0; }
.tabs-2 .tab.show { order: 1; }
.tabs-2 .tab .tab-content { position: relative; padding: 3rem 2rem; display: flex; flex-direction: row; flex-wrap: wrap; align-content: stretch; align-items: stretch; height: 100%; gap: 2rem; }
.tabs-2 .tab .tab-content .info { flex: 1 0 calc(55% - 1rem); }
.tabs-2 .tab .tab-content .info .title { margin-bottom: 1rem; font-size: 1.5rem; display: block; width: 50%; margin-right: auto; }
.tabs-2 .tab .tab-content .info a { font-size: .95rem; padding: 1rem; }
.tabs-2 .tab .tab-content .info :is(p, ul) { margin-top: 2rem; }
.tabs-2 .tab .tab-content .image { flex: 1 0 calc(45% - 1rem); }
.tabs-2 .tab .tab-content .image img { display: block; width: 100%; height: 100%; margin: 0 auto; text-align: center; object-fit: cover; object-position: 50% 50%; }


.squares-3 { padding-top: 0; display: flex; flex-direction: row; flex-wrap: wrap; align-items: stretch; justify-content: center; align-content: flex-start; gap: 4rem; }
.squares-3 .square { flex: 0 0 calc(100% / 3 - 4rem); background: var(--bg-color); border: 1px solid var(--stroke-color); box-shadow: 0px 4px 25px 0 rgba(0, 0, 0, 0.05); text-decoration: none; }
.squares-3 .square .square-content { position: relative; height: 100%; padding: 1.5rem; display: flex; flex-direction: column; flex-wrap: nowrap; align-items: flex-start; justify-content: flex-start; }
.squares-3 .square h4 { flex: 0 0 auto; font-size: 1.1rem; margin-bottom: 1.2rem; width: 100%; }
.squares-3 .square h4 .icon { display: inline-block; border: 1px solid var(--dark-stroke-color); padding: .5rem; margin-right: .5rem; vertical-align: middle; }
.squares-3 .square h4 .icon img { width: auto; height: 1.7rem; display: block; margin: 0 auto; text-align: center; }
.squares-3 .square .text-3 { margin-bottom: 1.2rem; flex: 1 0 auto; width: 100%; font-size: .9rem; }
.squares-3 .square button { padding-left: 0; padding-bottom: 0; flex: 0 1 auto; font-size: .9rem; }
.squares-3 .square button .arrow {  }
.squares-3 .square button .arrow img.head {  }
.squares-3 .square:hover button .arrow img.head { transform: translateX(.2rem) scale(1.1); }
.squares-3-xs {  }
.squares-3-xs[aria-expanded="true"] .f { display: none; }
.squares-3-xs[aria-expanded="false"] .s { display: none; }

.squares-4 { padding-top: 0; display: flex; flex-direction: row; flex-wrap: wrap; align-items: stretch; justify-content: center; align-content: flex-start; gap: 4rem; }
.squares-4 .square { --img-size: 45%; flex: 0 0 calc(100% / 3 - 4rem); background: var(--bg-color); box-shadow: 0px 4px 25px 0 rgba(0, 0, 0, 0.05); text-decoration: none; display: flex; flex-wrap: nowrap; flex-direction: column; justify-content: flex-start; align-items: stretch; transition: 0.5s; }
.squares-4 .square:hover { box-shadow: 0px 4px 40px 0 rgba(0, 0, 0, 0.1); }
.squares-4 .square .square-img { position: relative; height: auto; flex: 1 0 auto; overflow: hidden; }
.squares-4 .square .square-img img { display: block; width: 100%; height: 100%; margin: 0 auto; text-align: center; object-fit: cover; object-position: 50% 50%; transition: 0.8s; }
.squares-4 .square:hover .square-img img { transform: scale(1.1); }
.squares-4 .square .square-content { position: relative; height: 100%; flex: 1 1 auto; padding: 1.5rem; display: flex; flex-direction: column; flex-wrap: nowrap; align-items: flex-start; justify-content: flex-start; }
.squares-4 .square h4 { flex: 0 0 auto; font-size: 1.1rem; margin-bottom: 1.2rem; width: 100%; }
.squares-4 .square h4 .icon { display: inline-block; border: 1px solid var(--dark-stroke-color); padding: .5rem; margin-right: .5rem; vertical-align: middle; }
.squares-4 .square h4 .icon img { width: auto; height: 1.7rem; display: block; margin: 0 auto; text-align: center; }
.squares-4 .square .text-3 { margin-bottom: 1.2rem; flex: 0 0 auto; width: 100%; font-size: .9rem; }
.squares-4 .square button { padding-left: 0; padding-bottom: 0; flex: 0 1 auto; font-size: .9rem; border: 0; }
.squares-4 .square button .arrow {  }
.squares-4 .square button .arrow img.head {  }
.squares-4 .square:hover button .arrow img.head { transform: translateX(.2rem) scale(1.1); }
.squares-4-xs {  }
.squares-4-xs[aria-expanded="true"] .f { display: none; }
.squares-4-xs[aria-expanded="false"] .s { display: none; }

.carousel { position: relative; }
.carousel .controls { text-align: end; }
.carousel .control { display: inline-block; background: var(--pri-color); padding: .5rem .75rem; margin: 0 .25rem; border: 0; transition: 0.4s; }
.carousel .control:hover { background: var(--dark-pri-color); }
.carousel .control:disabled { background: var(--lighter-pri-color); }
.carousel .control.left {  }
.carousel .control.left img { transform: rotate(180deg); }
.carousel .control:not(:disabled).left:hover img { transform: rotate(180deg) translateX(.1rem) scale(1.02); }
.carousel .control.right {  }
.carousel .control:not(:disabled).right:hover img { transform: translateX(.1rem) scale(1.02); }
.carousel .control img { width: 1rem; height: 1rem; filter: var(--light-text-color-filter); transition: 0.4s; }
.carousel .control:disabled img { filter: var(--light-pri-color-filter); }
.carousel .inner { display: flex; flex-wrap: nowrap; flex-direction: row; align-items: stretch; justify-content: flex-start; overflow-x: auto; gap: 1.7rem; padding: 2rem 1.7rem; transition: 0.2s; }
.carousel .item { position: relative; background: var(--bg-color); flex: 0 0 30%; border: 1px solid var(--stroke-color); padding: 1.2rem; box-shadow: 0px 4px 40px 0px rgba(25, 85, 139, 0.03); max-width: 20rem; transition: 0.5s; }
.carousel .item:hover { transform: scale(1.02); box-shadow: 0px 4px 40px 0px rgba(25, 85, 139, 0.1); }
.carousel .item .img {  }
.carousel .item .img img { width: 4rem; height: 4rem; display: block; margin: 0; padding: .6rem; border: 1px solid var(--stroke-color); margin-bottom: 1.4rem; object-fit: contain; }
.carousel .item .img img.dell { background: #007DB8; }
.carousel .item .img img:is(.couchbase, .seguridata, .tassta) { background: #FFFFFF; }
.carousel .item .img img.panini { background: #1D1D1B; }
.carousel .item h4 { margin-bottom: .7rem; }
.carousel .item .text-3 {  }

.g-cards-1 { display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: center; align-items: stretch; gap: 3.5rem; }
.g-cards-1 .g-card { flex: 0 0 22%; box-shadow: 0px 4px 40px 0px rgba(25, 85, 139, 0.03); border: 1px solid var(--stroke-color); background: var(--bg-color); padding: 1.5rem; position: relative; transition: 0.4s; display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: space-between; align-items: stretch; }
.g-cards-1 .g-card .top { flex: 0 0 auto; }
.g-cards-1 .g-card .bottom { flex: 0 0 auto; }
.g-cards-1 .g-card:hover { transform: scale(1.02); box-shadow: 0px 4px 40px 0px rgba(25, 85, 139, 0.1); }
.g-cards-1 .g-card .icon { width: 4rem; height: 4rem; border: 1px solid var(--stroke-color); display: block; margin: 0 auto; text-align: center; position: relative; margin-bottom: 1rem; }
.g-cards-1 .g-card.tassta .icon { width: 7rem; height: 7rem; }
.g-cards-1 .g-card .icon img { padding: 0; width: 100%; height: 100%; }
.g-cards-1 .g-card:not(.panini, .tassta) .icon img { padding: .5rem; filter: var(--pri-color-filter); }
.g-cards-1 .g-card h6 { text-align: center; }
.g-cards-1 .g-card .text-4 { text-align: center; }
.g-cards-1 .g-card:is(.panini, .tassta) .text-4 { margin-bottom: 1.5rem; }
.g-cards-1 .g-card .link { font-size: .9rem; }

.g-cards-2 { --gap-size: 4rem; position: relative; display: flex; flex-direction: row; flex-wrap: wrap; align-content: flex-start; align-items: stretch; justify-content: space-between; column-gap: var(--gap-size); }
.g-cards-2 .g-card { width: 100%; flex: 0 0 100%; display: grid; grid-template-rows: repeat(2, 1fr); }
.g-cards-2.double .g-card { width: calc(50% - var(--gap-size)); flex: 0 0 calc(50% - var(--gap-size)); }
.g-cards-2.triple .g-card { width: calc((100% / 3) - var(--gap-size)); flex: 0 0 calc((100% / 3) - var(--gap-size)); }
.g-cards-2 .g-card .top { display: flex; flex-direction: column; justify-content: flex-start; align-items: stretch; flex-wrap: nowrap; }
.g-cards-2 .g-card .top .list-icon { position: relative; display: inline-block; width: 1.8rem; height: 1.8rem; background: var(--pri-color); border-radius: 100%; margin-top: 1.8rem; margin-bottom: 1rem; }
.g-cards-2 .g-card .list-icon .inner { position: absolute; display: inline-block; color: var(--light-text-color); font-size: .9rem; line-height: 1; margin-bottom: 0; font-weight: 500; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.g-cards-2 .g-card .top .title { line-height: 1.6; font-weight: 500; margin-bottom: 1rem; }
.g-cards-2 .g-card .bottom {  }
.g-cards-2 .g-card .bottom p {  }

.g-cards-3 { --gap-size: 1.5rem; position: relative; display: flex; flex-direction: row; flex-wrap: wrap; align-content: flex-start; justify-content: flex-start; align-items: stretch; gap: var(--gap-size); }
.g-cards-3 .g-card { flex: 1 1 calc((100% / 3) - var(--gap-size)); border: 1px solid var(--stroke-color); background: var(--bg-color); box-shadow: 0 4px 40px 0 rgba(var(--darker-pri-color-rgb), 0.03); padding: .7rem; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; align-items: center; transition: 0.5s; }
.g-cards-3 .g-card:hover { transform: scale(1.02); box-shadow: 0 4px 40px 0 rgba(var(--darker-pri-color-rgb), 0.1); }
.g-cards-3 .g-card .icon { flex: 0 1 3.4rem; }
.g-cards-3 .g-card .icon img { display: block; width: 100%; height: 100%; padding: .7rem; border: 1px solid var(--dark-stroke-color); }
.g-cards-3 .g-card .title { flex: 1 1 auto; padding-left: 1.5rem; }
.g-cards-3 .g-card .title h6 { margin-bottom: 0; }

.badges-container { display: flex; flex-direction: row; flex-wrap: wrap; align-content: flex-start; justify-content: center; align-items: center; gap: 2rem; }
.badges-container .badge { flex: 0 0 calc(20% - 2rem); }
.badges-container .badge img { display: block; width: 90%; height: auto; text-align: center; margin: 0 auto; object-fit: contain; object-position: 50% 50%; }

.demo-cards-container { --gap-size: 2.5rem; position: relative; display: flex; gap: var(--gap-size); flex-direction: row; flex-wrap: wrap; align-content: flex-start; justify-content: center; align-items: stretch; }
.demo-cards-container .demo-card { flex: 1 0 calc((100% / 3) - var(--gap-size)); background: var(--pri-color); color: var(--light-text-color); padding: 2.5rem; transition: 0.5s; }
.demo-cards-container .demo-card:hover { box-shadow: 0px 4px 40px 0px rgba(0, 0, 0, 0.1); transform: scale(1.008); }
.demo-cards-container .demo-card .title { color: var(--light-text-color); margin-bottom: 1.5rem; }
.demo-cards-container .demo-card .subtitle { color: var(--light-text-color); }
.demo-cards-container .demo-card ul {  }
.demo-cards-container .demo-card ul li { color: var(--light-text-color); }

.team { --gap-size: 2rem; gap: var(--gap-size); display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-content: flex-start; align-items: flex-start; }
.team .member { flex: 0 1 calc((100% / 3) - var(--gap-size)); text-align: center; padding: 1rem; }
.team .member .name {  }
.team .member p {  }
.team .member p a { text-decoration: none; color: inherit; }

.coverage-map { width: 100%; height: 100%; position: relative; }
.coverage-map img { width: 100%; height: 100%; max-height: 80vh; display: block; margin: 0 auto; text-align: center; object-fit: contain; object-position: 50% 50%; }

/* `xxl` applies to x-large devices (large desktops, less than 1400px) */
@media (max-width: 1399.98px) {
    main header .info { flex: 0 0 60%; }
    main header .image { flex: 0 0 40%; }
    main header .custom-icons { width: 40%; }

    main section#empresa .heading { width: 55%; }

    .mixed-content-1 .heading { flex: 0 0 60%; }
    .mixed-content-1 .note { flex: 0 0 55%; }

    .g-cards-2 { --gap-size: 2rem; }
}

/* `xl` applies to large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) {
    main header .info { flex: 0 0 70%; }
    main header .image { flex: 0 0 30%; }
    main header .custom-icons { width: 30%; }

    main section#clientes .heading { width: 65%; }

    main section#summary .heading { width: 65%; }

    main section#empresa .heading { width: 65%; }

    main section#servicios h3 { width: 40%; }

    main section#productos h2 { width: 55%; margin-bottom: 3rem; }

    :root { --n-logos: 4; }
    .slider .track .item { padding: 0 1rem; }

    .mixed-content-1 .heading { flex: 0 0 70%; }
    .mixed-content-1 .note { flex: 0 0 65%; }

    .tabs { gap: 2rem; }
    .tabs .column.info { flex: 1 0 calc(60% - 2rem); }
    .tabs .column.image { flex: 1 0 calc(40% - 2rem); }

    .squares-3 { gap: 2rem; }
    .squares-3 .square { flex: 0 0 calc(100% / 3 - 2rem); }

    .squares-4 { gap: 2rem; }
    .squares-4 .square { flex: 0 0 calc(100% / 3 - 2rem); }

    .g-cards-1 .g-card { flex: 0 0 27%; }
}

/* `lg` applies to medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) {
    main header#inicio .container .content { gap: 1.5rem; }
    main header .info { flex: 1 0 80%; }
    main header .image { flex: 0 0 20%; display: none; }
    main header .custom-icons { width: 100%; position: relative; }

    main section#clientes .heading { width: 80%; }

    main section#summary .heading { width: 80%; }

    main section#empresa .heading { width: 75%; }

    main section#nosotros .heading { flex-wrap: wrap; }
    main section#nosotros .heading .column { flex: 1 0 100%; }
    main section#nosotros .heading .column.image { padding-bottom: 3rem; }
    main section#nosotros .heading .column.image img { margin-bottom: -40%; padding-right: 0; }

    main section#servicios h3 { width: 50%; }

    main section#productos h2 { width: 75%; }

    main section#socios .column.heading { flex: 1 1 45%; width: 45%; padding-right: 1rem; }
    main section#socios .column.carousel { flex: 1 1 55%; width: 55%; }

    main section#why .text-2 { width: 50%; }
    main section#coverage .text-2 { width: 80%; }

    .bullet-list.lg { list-style-type: disc; padding-left: 1.5rem; }

    .custom-icons .bg-img { padding: 0 1rem; }
    .custom-icons .bg-img img { border-radius: 0; }
    .custom-icons .container { padding-top: 2rem; padding-bottom: 2rem; }
    .custom-icons .container .grid { width: 80%; }

    .contact-card { width: 90%; }

    :root { --n-logos: 3; }

    .mixed-content-1 .heading { flex: 0 1 80%; padding-bottom: 3.5rem; }
    .mixed-content-1 .info { flex: 1 0 60%; padding-bottom: 3.5rem; }
    .mixed-content-1 .image { flex: 1 0 40%; padding-bottom: 3.5rem; }
    .mixed-content-1 .image.t { flex: 1 0 100%; }
    .mixed-content-1 .image img { padding-bottom: 3.5rem; position: relative; }
    .mixed-content-1 .image.f img { padding-left: 3.5rem; }
    .mixed-content-1 .image.f.t img { padding-left: 0; max-height: 55vh; }
    .mixed-content-1 .image.s img { padding-right: 3.5rem; }
    .mixed-content-1 .note { flex: 0 0 75%; }
    .mixed-content-1 .graph .graph-container { width: 100%; }
    .mixed-content-1 .graph .graph-container img { padding: 3rem 2rem; }
    .mixed-content-1 .columns.quad .column { flex: 1 0 calc(50% - 3rem); }
    .mixed-content-1 .columns .column .title { margin-bottom: .5rem; }

    .squares-1 { gap: 2rem; }

    .squares-2 { padding-top: 3rem; }
    .squares-2 .square { flex: 1 0 calc(50% - 2rem); }

    /* .tabs .column.info { flex: 1 0 calc(70% - 2rem); }
    .tabs .column.image { flex: 1 0 calc(30% - 2rem); } */

    .tabs-2 .tab .tab-content .info .title { width: 75%; }

    .squares-3 .square { flex: 0 0 calc(100% / 2 - 2rem); }

    .squares-4 .square { flex: 0 0 calc(100% / 2 - 2rem); }

    .carousel .item { flex: 0 0 50%; }

    .g-cards-1 { gap: 2rem; }
    .g-cards-1 .g-card { flex: 0 0 32%; }

    .g-cards-2 { --gap-size: 1rem; }
    .g-cards-2.triple .g-card { width: calc(50% - var(--gap-size)); flex: 0 0 calc(50% - var(--gap-size)); }

    .g-cards-3 .g-card { flex: 1 1 calc((100% / 2) - var(--gap-size)); }

    .badges-container .badge { flex: 0 0 calc((100% / 3) - 2rem); }

    .team { --gap-size: 1rem; }
    .team .member { flex: 1 1 calc((100% / 2) - var(--gap-size)); }
}

/* `md` applies to small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
    main :is(header, section) h1 { font-size: 2.3rem; margin-bottom: 2rem; }
    main :is(header, section) h2 { font-size: 2rem; margin-bottom: 1.6rem; }
    main :is(header, section) p.text-1 { margin-bottom: 2.5rem; }
    main :is(header, section) p.text-2 { font-size: .9rem; }

    main header#inicio { background: var(--bg-color); background-size: 60%; background-repeat: no-repeat; background-position: right top; background-attachment: local; }
    main header#inicio .container .content { padding: 3rem 0; }
    main header .container .content { padding: 30% 0 35% 0; }
    main header .info { flex: 1 0 90%; padding-right: 0; }
    main header .image { flex: 0 0 10%; }
    main header .links { gap: .7rem; }
    main header .links a.f-btn.desktop { display: none; }
    main header .links a.f-btn.mobile { display: inline-block; }

    main section.migracion-de-acervos .section-container .content { padding: 4rem 0; }

    main section#clientes .heading { width: 100%; }

    main section#summary .heading { width: 100%; }

    main section#empresa .heading { width: 98%; }
    main section#empresa .text-1 { font-size: 1rem; }

    main section#servicios .section-container .content { padding-top: 4rem; }
    main section#servicios h3 { width: 75%; }

    main section#productos .section-container .content { padding: 7rem 0; }

    main section#socios .column.heading { flex: 1 1 100%; width: 100%; padding-right: 0; box-shadow: none; }
    main section#socios .column.carousel { flex: 1 1 100%; width: 100%; }
    main section#why .text-2 { width: 80%; }
    main section#coverage .text-2 { width: 100%; }

    .contact-card { width: 100%; }
    .contact-form { column-gap: 1rem; }
    .contact-form .form-column { width: calc(50% - .5rem); }

    :root { --n-logos: 2.5; }
    .slider .track .item { padding: 0 .5rem; }

    .mixed-content-1 .heading { flex: 1 1 90%; padding-bottom: 2.5rem; }
    .mixed-content-1 .info { flex: 1 0 100%; padding-bottom: 2.5rem; }
    .mixed-content-1 .image { flex: 1 0 100%; padding-bottom: 2.5rem; }
    .mixed-content-1 .image.s { order: 4; }
    .mixed-content-1 .image img { padding-bottom: 2.5rem; }
    .mixed-content-1 .image.f img { padding-left: 0; }
    .mixed-content-1 .image.s img { padding-right: 0; }
    .mixed-content-1 .note { flex: 1 0 100%; order: 5; }
    .mixed-content-1 .graph .graph-container img { width: auto; height: 100%; padding: 0; }

    .squares-1 { padding-top: 0; }
    .squares-1 .square { flex: 1 0 100%; }
    .squares-1 .square .square-content { padding: 1.3rem; }
    .squares-1 .square h4 { margin-bottom: 1rem; }
    .squares-1 .square h4 .icon { height: 2.1rem; }

    .squares-2 .square h5 { font-size: 1.5rem; }

    .tabs .column.info { flex: 1 0 100%; }
    .tabs .column.image { display: none; }

    .tabs-2 .controls button { flex: 1; }
    .tabs-2 .tab .tab-content .image { display: none; }

    .squares-3 { gap: 1rem; }
    .squares-3 .square { flex: 0 0 calc(100% / 2 - 1rem); }

    .squares-4 { gap: 1rem; }
    .squares-4 .square { flex: 0 0 calc(100% / 2 - 1rem); }

    .carousel .controls { display: none; }
    .carousel .inner { padding-left: 0; }
    .carousel .item { flex: 0 0 75%; }

    .g-cards-1 { flex-wrap: wrap; }
    .g-cards-1 .g-card { flex: 0 0 100%; }

    .badges-container { gap: 1rem; }
    .badges-container .badge { flex: 0 0 calc((100% / 3) - 1rem); }
    .badges-container .badge img { width: 100%; }

    .demo-cards-container .demo-card { flex: 1 0 calc(100% - var(--gap-size)); padding: 2rem; }
}

/* `sm` applies to x-small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {
    main :is(header, section) h3 { font-size: 1.8rem; }

    main section#empresa .heading { width: 100%; }

    main section#nosotros .heading .column.info h3 { width: 100%; }
    main section#nosotros .heading .column.info .text-1 { text-align: justify; }

    main section#servicios h3 { width: 100%; }

    main section#productos .section-container .content { padding: 5rem 0; }
    main section#productos h2 { width: 80%; }

    .contact-form .form-column.xs-full { width: 100%; }
    
    :root { --n-logos: 2; }
    .slider .track .item { padding: 0.2rem; }

    .mixed-content-1 .columns.quad .column { flex: 1 0 100%; }

    .squares-2 .square { flex: 1 0 100%; }

    .squares-3 { gap: 2rem; }
    .squares-3 .square { flex: 0 0 100%; }
    .square-xs { display: none; }

    .squares-4 { gap: 2rem; }

    .squares-4 .square .square-img { height: auto; flex: 1 1 auto; }
    .squares-4 .square .square-content { height: 100%; flex: 1 0 50%; }
    .squares-4 .square { flex: 0 0 100%; }
    .squares-4 .square-xs { display: none; }

    .tabs-2 .tab .tab-content { padding: 2rem 1rem; }

    .g-cards-2 .g-card { width: 100%; flex: 0 0 100%; display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; }
    .g-cards-2.double .g-card { width: 100%; flex: 1 0 100%; }
    .g-cards-2.triple .g-card { width: 100%; flex: 1 0 100%; }

    .g-cards-3 .g-card { flex: 1 1 calc(100% - var(--gap-size)); }
    .g-cards-3 .g-card .icon img { padding: .5rem; }
    .team { --gap-size: 2rem; }
    .team .member { flex: 1 1 100%; }
}