.callout-1 {
    padding: 100px 0 60px;
}
.callout-1 h1 {
    max-width: 660px;
}
.callout-1.serviLogo {
    padding-top: 325px;
    background-image: url(../img/degradado/logo.png);
    background-repeat: no-repeat;
    background-size: 100% auto;
}
.callout-1.serviPape {
    padding-top: 235px;
    background-image: url(../img/degradado/papeleria.png);
    background-repeat: no-repeat;
    background-size: 100% auto;
}
.callout-1.serviBroc {
    padding-top: 235px;
    background-image: url(../img/degradado/brochure.png);
    background-repeat: no-repeat;
    background-size: 100% auto;
    padding-bottom: 150px;
}
.callout-1.serviRedes {
    padding-top: 290px;
    background-image: url(../img/degradado/redes.png);
    background-repeat: no-repeat;
    background-size: 100% auto;
    padding-bottom: 150px;
}
.callout-1.serviMotion {
    padding-top: 200px;
    background-image: url(../img/degradado/motion.png);
    background-repeat: no-repeat;
    background-size: 100% auto;
}
.callout-1.menosmargin {
    padding-bottom: 0;
    margin-bottom: -150px;
}
.callout-1.menosmargin2 {
    padding-bottom: 0;
    margin-bottom: -50px;
}
.callout-1.separar200 {
    padding-top: 180px;
}
.callout-1 .tit-peque {
    font-size: 20px;
    color: var(--color5);
}
.callout-1 .color-titulo {
    background: linear-gradient(79.79deg, #6600FF 1.71%, #A36FEF 26.13%, #A7F8F7 60.86%, #00FFFE 80.29%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    display: inline-block;
}
.callout-1 h1 {
    font-size: 46px;
    line-height: 1.1;
    max-width: 655px;
}
.callout-1 h1.peque2 {
    max-width: 610px;
}
.callout-1 h3 {
    font-size: 40px;
    line-height: 1.2;
}
.callout-1 p {
    font-size: 18px;
    color: var(--colorBlanco);
}
.callout-1 p.textoC {
    font-size: 16px;
    color: #E2E2E2;
}
.callout-1 .cuadros > div {
    max-width: 25%;
}
.callout-1 .cuadros .item-cuadro {
    background-color: var(--fondoOscuro);
    border: 2px solid var(--color2);
    border-radius: 20px;
    width: 100%;
    padding: 25px;
    transform: rotate(4.31deg);
    height: 244px;
}
.callout-1 .cuadros .item-cuadro.item2 {
    transform: rotate(-6.31deg);
}
.callout-1 .cuadros .item-cuadro span {
    font-size: 16px;
    color: var(--colorBlanco)
}
.callout-1 .cuadros .item-cuadro p {
    font-size: 14px;
    color: var(--color5);
    line-height: 1.2;
}
.callout-1 .tipos-logos .item-logo {
    background-color: var(--fondoOscuro);
    border: 2px solid var(--color2);
    border-radius: 20px;
    width: 290px;
    padding: 40px 25px;
    height: 400px;
    position: relative;
    overflow: hidden;
}
.callout-1 .tipos-logos .item-logo::before {
    content: '';
    position: absolute;
    background: linear-gradient(0deg, #141414 0%, #484848 100%);
    left: 0;
    top: 0;
    width: 100%;
    height: 282px;
    opacity: 0;
    transition: all 0.5s ease;
}
.callout-1 .tipos-logos .item-logo.itemL2::before{
    background: linear-gradient(0deg, #141414 0%, #0A8792 100%);
}
.callout-1 .tipos-logos .item-logo.itemL3::before{
    background: linear-gradient(0deg, #141414 0%, #005523 100%);
}
.callout-1 .tipos-logos .item-logo.itemL4::before{
    background: linear-gradient(0deg, #141414 0%, #674126 100%);
}
.callout-1 .tipos-logos .item-logo:hover::before {
    opacity: 1;
}
.callout-1 .tipos-logos .item-logo > * {
    position: relative;
}
.callout-1 .tipos-logos .item-logo figure {
    height: 100px;
}
.callout-1 .tipos-logos .item-logo p.titu {
    font-size: 22px;
    color: var(--colorBlanco);
}
.callout-1 .tipos-logos .item-logo p {
    font-size: 14px;
    color: var(--color5);
    line-height: 1.2;
}
.callout-1 .tipos-logos .item-logo .final {
    min-height: 52px;
}
.callout-1 .estilos-logos > div {
    background-color: var(--fondoOscuro);
    border-radius: 20px;
    width: 290px;
    height: 274px;
    position: relative;
    overflow: hidden;
}
.callout-1 .estilos-logos.estilos2 > div {
    width: 190px;
    height: 276px;
}
.callout-1 .estilos-logos > .item-estilos {
    padding: 50px 25px;
    border: 2px solid var(--color2);
}
.callout-1 .estilos-logos.estilos2 > .item-estilos {
    padding: 30px 20px;
}
.callout-1 .estilos-logos .item-estilos p {
    font-size: 14px;
    color: var(--color5);
    line-height: 1.2;
    max-width: 250px;
}
.callout-1 .estilos-logos .item-estilos p.titu {
    font-size: 16px;
    color: var(--colorBlanco);
}
.callout-1 .estilos-logos .item-estilos .final {
    min-height: 84px;
}
.callout-1 .swiper-logos .swiper-wrapper{
    transition-timing-function: linear;
}
.callout-1 .swiper-logos {
    position: relative;
}
.callout-1 .swiper-logos::before {
    content: '';
    position: absolute;
    height: 101%;
    width: 23%;
    top: 0;
    left: 0;
    z-index: 2;
    background: url(../img/iconos/degradado.png) no-repeat;
    background-size: 100% 100%;
}
.callout-1 .swiper-logos::after {
    content: '';
    position: absolute;
    height: 101%;
    width: 23%;
    top: 0;
    right: 0;
    background: url(../img/iconos/degradado2.png) no-repeat;
    background-size: 100% 100%;
    z-index: 1;
}
.callout-1 .cuadroD {
    background: url(../img/iconos/fondo-degradado.png) no-repeat;
    background-size: 100% 100%;
    width: 100%;
    height: 470px;
    border-radius: 30px;
    overflow: hidden;
}
.callout-1 .cuadroD p {
    font-size: 16px;
    color: var(--colorBlanco);
}
.callout-1 .flex-papeleria .item-papeleria {
    background-color: var(--fondoOscuro);
    border: 2px solid var(--color2);
    border-radius: 20px;
    width: 390px;
    padding: 20px;
}
.callout-1 .flex-papeleria .item-papeleria.papeleria2  {
    width: 590px;
}
.callout-1 .flex-papeleria .item-papeleria .detalle {
    max-width: 380px;
    margin: 0 auto;
}
.callout-1 .flex-papeleria .item-papeleria.papeleria2 .detalle {
    max-width: 266px;
}
.callout-1 .flex-papeleria .item-papeleria p.titu {
    font-size: 16px;
    color: var(--colorBlanco);
}
.callout-1 .flex-papeleria .item-papeleria .final p {
    font-size: 14px;
    color: var(--color5);
    line-height: 1.2;
    min-height: 80px;
}
.callout-1 .flex-papeleria .item-papeleria figure {
    border-radius: 20px;
    overflow: hidden;
}
.callout-1 .flex-brochure {
    max-width: 788px;
}
.callout-1 .flex-brochure .item-brochure {
    background-color: var(--fondoOscuro);
    border: 2px solid var(--color2);
    border-radius: 20px;
    width: 335px;
    padding: 25px;
    height: 261px;
}
.callout-1 .flex-brochure.brochure2 .item-brochure {
    width: 100%;
}
.callout-1 .flex-brochure .item-brochure p {
    font-size: 14px;
    color: var(--color5);
    line-height: 1.2;
    max-width: 280px;
}
.callout-1 .flex-brochure.brochure2 .item-brochure p {
    max-width: 506px;
}
.callout-1 .flex-brochure .item-brochure p.titu {
    font-size: 16px;
    color: var(--colorBlanco);
}
.callout-1 .brochure-flotante {
    height: 850px;
}
.callout-1 .brochure-flotante .cuadrosF {
    width: 300px;
    height: 166px;
    background-color: var(--fondoOscuro);
    border: 2px solid var(--color2);
    border-radius: 20px;
    position: absolute;
    padding: 25px;
    animation: flotar 3s ease-in-out infinite;
}
.callout-1 .brochure-flotante .cuadrosF p {
    font-size: 14px;
    color: var(--color5);
    line-height: 1.2;
}
.callout-1 .brochure-flotante .cuadrosF p.titu {
    font-size: 16px;
    color: var(--colorBlanco);
}
.callout-1 .brochure-flotante .cuadrosF.uno {
    top: 8%;
    left: 15%;
    animation-delay: 0s;
}
.callout-1 .brochure-flotante .cuadrosF.dos {
    top: 38%;
    left: 0;
    animation-delay: .2s;
}
.callout-1 .brochure-flotante .cuadrosF.tres {
    top: 65%;
    left: 7%;
    animation-delay: .4s;
}
.callout-1 .brochure-flotante .cuadrosF.cuatro {
    top: 8%;
    right: 15%;
    animation-delay: .6s;
}
.callout-1 .brochure-flotante .cuadrosF.cinco {
    top: 38%;
    right: 0;
    animation-delay: .8s;
}
.callout-1 .brochure-flotante .cuadrosF.seis {
    top: 65%;
    right: 7%;
    animation-delay: 1s;
}
.callout-1 .flex-redes .item-redes {
    background-color: var(--fondoOscuro);
    border: 2px solid var(--color2);
    border-radius: 20px;
    width: 290px;
    padding: 20px;
}
.callout-1 .flex-redes .item-redes figure {
    border-radius: 20px;
    overflow: hidden;
}
.callout-1 .flex-redes .item-redes .detalle {
    padding: 25px 0 0;
}
.callout-1 .flex-redes .item-redes p {
    font-size: 14px;
    color: var(--color5);
    line-height: 1.2;
}
.callout-1 .flex-redes .item-redes p.titu {
    font-size: 16px;
    color: var(--colorBlanco);
    padding-bottom: 10px;
}
.callout-1 .flex-redes .item-redes .final {
    min-height: 65px;
}
.callout-1 .animacionG {
    border: 2px solid var(--color2);
    border-radius: 20px;
}
.callout-1 p.contenido {
    color: #E2E2E2;
    font-size: 16px;
}
.callout-1 .flex-motion {
    max-width: 1320px;
    margin: 0 auto;
}
.callout-1 .flex-motion .item-motion {
    background-color: var(--fondoOscuro);
    border: 2px solid var(--color2);
    border-radius: 20px;
    width: 285px;
    padding: 25px;
    height: 219px;
}
.callout-1 .flex-motion .item-motion span {
    font-size: 16px;
    color: var(--colorBlanco)
}
.callout-1 .flex-motion .item-motion .final {
    min-height: 35px;
}
.callout-1 .flex-motion .item-motion p {
    font-size: 14px;
    color: var(--color5);
    line-height: 1.2;
}
.callout-1 .flex-proceso {
    max-width: 1365px;
    margin: 0 auto;
}
.callout-1 .flex-proceso button,
.callout-1 .accordion-flush .accordion-item .accordion-button.collapsed,
.callout-1 .accordion-flush .accordion-item .accordion-button.collapsed:focus {
    font-size: 22px;
    color: var(--colorTexto);
    padding: 25px;
    width: 518px;
    border-radius: 20px;
    background: transparent;
    box-shadow: none;
    border: 0;
}
.callout-1 .accordion-button::after {
    display: none;
}
.callout-1 .flex-proceso button.active,
.callout-1 .accordion-flush .accordion-item .accordion-button,
.callout-1 .accordion-flush .accordion-item .accordion-button:focus {
    color: #00FFFE;
    background-color: var(--fondoOscuro);
    border: 0;
    box-shadow: none;
    border-radius: 20px;
}
.callout-1 .accordion-flush .accordion-item .accordion-button,
.callout-1 .accordion-flush .accordion-item .accordion-button:focus,
.callout-1 .accordion-flush .accordion-item .accordion-button.collapsed,
.callout-1 .accordion-flush .accordion-item .accordion-button.collapsed:focus {
    width: 100%;
    font-size: 18px;
}
.callout-1 .flex-proceso button span,
.callout-1 .accordion-flush .accordion-item .accordion-button span {
    font-size: 32px;
    line-height: 1;
    background: linear-gradient(180deg, #9A9AA6 0%, #141414 76.49%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
    margin-right: 20px;
}
.callout-1 .accordion-flush .accordion-item .accordion-button span,
.callout-1 .accordion-flush .accordion-item .accordion-button:focus span {
    font-size: 30px;
}
.callout-1 .flex-proceso p {
    color: var(--colorTexto);
    font-size: 16px;
    max-width: 417px;
    margin-top: 15px;
}
.callout-1 .flex-interfaz .item-interfaz {
    background-color: var(--fondoOscuro);
    border: 2px solid var(--color2);
    border-radius: 20px;
    width: 389px;
    height: 636px;
    padding: 20px;
}
.callout-1 .flex-interfaz .item-interfaz figure {
    border-radius: 20px;
    overflow: hidden;
}
.callout-1 .flex-interfaz .item-interfaz.faz2 {
    height: 310px;
}
.callout-1 .flex-interfaz .item-interfaz.faz3 {
    width: 795px;
    height: 310px;
}
.callout-1 .flex-interfaz .item-interfaz p {
    font-size: 14px;
    color: var(--color5);
    line-height: 1.2;
}
.callout-1 .flex-interfaz .item-interfaz p.titu {
    font-size: 16px;
    color: var(--colorBlanco);
    padding-bottom: 10px;
}
.callout-1 .flex-interfaz .item-interfaz .final {
    min-height: 50px;
}
.callout-1 .flex-interfaz .item-interfaz.faz2 p {
    max-width: 400px;
}
.callout-1 .flex-interfaz .item-interfaz.faz3 p {
    max-width: 255px;
}
.callout-1 .item-carrousel figure {
    height: 286px;
    border-radius: 20px;
    overflow: hidden;
}
.callout-1 .item-carrousel img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    border-radius: 20px;
}
.callout-1 .textoT {
    max-width: 571px;
    margin: 0 auto;
}
.callout-1 .textoT .contenido {
    max-width: 512px;
}
@media (min-width: 1626px) {
    .callout-1 .tipos-logos .item-logo {
        width: 384px;
        padding: 40px 50px;
        height: 460px;
    }
    .callout-1 .estilos-logos > div {
        width: 384px;
        height: 362px;
    }
    .callout-1 .estilos-logos.estilos2 > div {
        width: 249px;
        height: 362px;
    }
    .callout-1 .estilos-logos > .item-estilos {
        padding: 50px 35px;
    }
    .callout-1 .flex-papeleria .item-papeleria {
        width: 519px;
    }
    .callout-1 .flex-papeleria .item-papeleria.papeleria2 {
        width: 788px;
    }
    .callout-1 .flex-papeleria .item-papeleria.papeleria2 figure {
        width: 364px;
    }
    .callout-1 .flex-brochure .item-brochure {
        width: 384px;
    }
    .callout-1 .flex-redes .item-redes {
        width: 384px;
    }
    .callout-1 .flex-redes .item-redes .detalle {
        padding: 25px 15px 0;
    }
    .callout-1 .flex-motion .item-motion {
        width: 315px;
    }
    .callout-1 .flex-interfaz .item-interfaz {
        width: 519px;
        height: 753px;
    }
    .callout-1 .flex-interfaz .item-interfaz.faz2 {
        height: 367px;
    }
    .callout-1 .flex-interfaz .item-interfaz.faz3 {
        width: 1057px;
        height: 367px;
    }
    .callout-1 .item-carrousel figure {
        height: 386px;
    }
}
@media screen and (max-width: 980px){
    .callout-1 {
        padding: 50px 0;
    }
    .callout-1 .tit-peque,
    .callout-1 p,
    .callout-1 p.contenido {
        font-size: 14px;
    }
    .callout-1 h1,
    .callout-1 h3 {
        font-size: 30px;
    }
    .boton2 {
        font-size: 14px;
    }
    .callout-1 .cuadros > div {
        max-width: 350px;
    }
    .callout-1 .cuadros .item-cuadro {
        transform: rotate(2.4deg);
    }
    .callout-1 .cuadros .item-cuadro.item2 {
        transform: rotate(-2.4deg);
    }
    .callout-1.menosmargin,
    .callout-1.menosmargin2 {
        margin-bottom: 0;
    }
    .callout-1.serviLogo {
        background-image: url(../img/degradado/logom.png);
    }
    .callout-1.serviPape {
        background-image: url(../img/degradado/papeleriam.png);
    }
    .callout-1.serviBroc {
        background-image: url(../img/degradado/brochurem.png);
        background-position-y: bottom;
    }
    .callout-1.serviRedes {
        background-image: url(../img/degradado/redesm.png);
    }
    .callout-1.serviRedes.interfaz {
        background-image: url(../img/degradado/interfazm.png);
        background-position-y: 70px;
    }
    .callout-1.serviMotion {
        background-image: url(../img/degradado/interfazm.png);
        background-position-y: 70px;
    }
    .callout-1.serviLogo,
    .callout-1.serviPape,
    .callout-1.serviRedes,
    .callout-1.serviBroc,
    .callout-1.serviMotion {
        padding-top: 100px;
    }
    .callout-1.serviRedes {
        padding-bottom: 50px;
    }
    .callout-1.serviBroc {
        padding-bottom: 200px;
    }
    .callout-1.contenido-callout {
        margin-top: -100px;
    }
    .boton2:hover span i,
    .boton2:focus span i {
        opacity: 0;
        max-width: 0;
        margin-left: 0;
    }
    .callout-1 .tipos-logos .item-logo,
    .callout-1 .estilos-logos > div,
    .callout-1 .estilos-logos.estilos2 > div,
    .callout-1 .flex-redes .item-redes,
    .callout-1 .flex-brochure .item-brochure,
    .callout-1 .flex-brochure.brochure2 .item-brochure,
    .callout-1 .flex-interfaz .item-interfaz,
    .callout-1 .flex-interfaz .item-interfaz.faz3,
    .callout-1 .flex-motion .item-motion {
        max-width: 350px;
        width: 100%;
        margin: 0 auto;
    }
    .callout-1 .flex-interfaz .item-interfaz,
    .callout-1 .flex-interfaz .item-interfaz.faz2,
    .callout-1 .flex-interfaz .item-interfaz.faz3,
    .callout-1 .flex-motion .item-motion {
        height: auto;
    }
    .callout-1 .flex-motion .item-motion .final {
        min-height: auto;
    }
    .callout-1 .flex-interfaz .item-interfaz .detalle {
        padding-top: 20px;
    }
    .callout-1 .tipos-logos .item-logo::before {
        opacity: 1;
    }
    .callout-1.separar200 {
        padding-top: 50px;
    }
    .callout-1 .estilos-logos > div figure {
        height: 100%
    }
    .callout-1 .estilos-logos > div img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
        border-radius: 20px;
    }
    .callout-1 .item-carrousel figure {
        height: 193px;
    }
    .callout-1 span.final {
        font-size: 16px;
        max-width: 250px;
    }
    .callout-1 .btn-proy {
        margin-top: 50px;
        max-width: 100%;
    }
    .callout-1 .cuadroD {
        background-image: url(../img/iconos/fondo-degradado-m.png);
    }
    .callout-1 .cuadroD h3,
    .callout-1 .cuadroD p {
        max-width: 260px;
    }
    .callout-1 .cuadroD h3.cuadro2,
    .callout-1 .cuadroD p.cuadro2 {
        max-width: 275px;
    }
    .callout-1 .medio {
        max-width: 230px;
        margin: 0 auto;
    }
    .callout-1 .brochure-flotante {
        height: auto;
    }
    .callout-1 .brochure-flotante .cuadrosF {
        position: relative;
        animation: none;
        max-width: 350px;
        width: 100%;
        margin: 0 auto;
    }
    .callout-1 .brochure-flotante .cuadrosF.uno,
    .callout-1 .brochure-flotante .cuadrosF.dos,
    .callout-1 .brochure-flotante .cuadrosF.tres {
        top: initial;
        left: initial;
    }
    .callout-1 .brochure-flotante .cuadrosF.cuatro,
    .callout-1 .brochure-flotante .cuadrosF.cinco,
    .callout-1 .brochure-flotante .cuadrosF.seis {
        top: initial;
        right: initial;
    }
    .callout-1 .cuadro-gif {
        margin: 30px auto;
        max-width: 350px;
        height: 400px;
    }
    .callout-1 .cuadro-gif img {
        width: 100%
    }
    .callout-1 .accordion-item {
        background-color: transparent;
        border: 0;
    }
    .callout-1 .accordion-flush .accordion-item .accordion-button,
    .callout-1 .accordion-flush .accordion-item .accordion-button.collapsed {
        font-size: 18px;
    }
    .callout-1 .accordion-flush .accordion-item .accordion-button span,
    .callout-1 .accordion-flush .accordion-item .accordion-button.collapsed span {
        font-size: 30px;
    }
    .callout-1 .accordion-body p {
        color: var(--colorTexto);
        padding-top: 10px;
    }
    .callout-1 .flex-papeleria .item-papeleria.papeleria2 .detalle {
        max-width: 100%;
    }
}