@import"./elements/voucher.css";:root{--img-height: min(672px, 100vw) }.foreword{width:100%;display:flex;padding-top:64px;align-items:center;padding-bottom:80px;box-sizing:border-box;justify-content:center}.foreword .container .content{width:100%;display:flex;align-items:center;gap:var(--size60-13);flex-direction:column}.foreword .container .content .title{display:flex;align-self:flex-start;flex-direction:column}.foreword .container .content .title .cube{z-index:0;height:68px;position:relative;width:min(360px,100%);transform-style:preserve-3d;animation:rotate 6s infinite}.foreword .container .content .title .cube .face{width:100%;height:100%;display:flex;font-weight:700;position:absolute;padding-bottom:8px;align-items:flex-end;box-sizing:border-box;font-size:var(--size30-6);border:solid 2px var(--bg-default);background-color:var(--bg-default)}.foreword .container .content .title .cube .face.left,.foreword .container .content .title .cube .face.right{width:68px}.foreword .container .content .title .cube .face.front{transform:translateZ(34px)}.foreword .container .content .title .cube .face.back{transform:rotateX(180deg) translateZ(34px)}.foreword .container .content .title .cube .face.right{transform:rotateY(90deg) translateZ(34px)}.foreword .container .content .title .cube .face.left{transform:rotateY(-90deg) translateZ(34px)}.foreword .container .content .title .cube .face.top{transform:rotateX(90deg) translateZ(34px)}.foreword .container .content .title .cube .face.botton{transform:rotateX(-90deg) translateZ(34px)}.foreword .container .content .title .text{z-index:1;color:var(--text-primary)}.foreword .container .content .description{width:100%;display:flex;align-self:center;align-items:center;flex-direction:column;justify-content:center}.foreword .container .content .description .image{width:100%;display:flex;justify-content:center;height:var(--img-height);transition:var(--transition);background:url(../img/foreword/celular_1.png) no-repeat center bottom calc((var(--img-height)) * -2);background-size:contain}.foreword .container .content .description .image.active{animation:2s show-img 1s forwards}.foreword .container .content .description .items,.foreword .container .content .description .items .item{width:100%;height:100%;display:flex;box-sizing:border-box}.foreword .container .content .description .items{align-items:center;gap:var(--size60-13);flex-direction:column;color:var(--text-primary)}.foreword .container .content .description .items .item{flex-wrap:wrap;border-radius:var(--size16-3);gap:calc((var(--size20-5)) * 3);background-color:var(--bg-card);padding:var(--size60-13) var(--size60-13) 0}.foreword .container .content .description .items .item :nth-child(1),.foreword .container .content .description .items .item :nth-child(2){width:100%}.foreword .container .content .description .items .item .img{order:1;bottom:0;position:relative;height:min(488px,85vw);background:url(../img/foreword/celular_1.png) no-repeat center bottom calc((var(--img-height)) * -2);background-size:contain}.foreword .container .content .description .items .item .img.right{order:1}.foreword .container .content .description .items .item .img.active{animation:show-img 1s forwards}.foreword .container .content .description .items .item .info{display:flex;text-align:center;gap:var(--size24-5);flex-direction:column;justify-content:center}.foreword .container .content .description .items .item .info h2,.foreword .container .content .description .items .item .info h3,.foreword .container .content .description .items .item .info p{width:100%}.foreword .container .content .description .items .item .info h2{font-size:var(--size32-7-75)}.foreword .container .content .description .items .item .info p{text-align:justify}.foreword .container .content .description .vouchers{width:100%;height:100%;display:flex;flex-wrap:wrap;overflow-x:clip;gap:var(--size60-13);box-sizing:border-box;justify-content:center;margin-top:var(--size60-13)}.foreword .container .content .description .vouchers .voucher{max-width:320px;transition:.3s all;pointer-events:none;transform-style:preserve-3d;box-shadow:0 0 8px var(--bg-default)}.foreword .container .content .description .vouchers .voucher .close{display:none}.foreword .container .content .description .messages{width:100%;height:100%;display:flex;align-items:center;gap:var(--size60-13);box-sizing:border-box;flex-direction:column;justify-content:center;margin-top:var(--size60-13)}.foreword .container .content .description .messages .message{height:100%;display:flex;position:relative;align-items:center;box-sizing:border-box;flex-direction:column;width:min(400px,100%);justify-content:center}.foreword .container .content .description .messages .message .msn,.foreword .container .content .description .messages .message .msn-load,.foreword .container .content .description .messages .message .msn .emojis{border-radius:180px;background-color:var(--bg-card)}.foreword .container .content .description .messages .message .msn,.foreword .container .content .description .messages .message .msn .emojis{display:none}.foreword .container .content .description .messages .message .msn{width:100%;height:100%;position:relative;align-items:center;box-sizing:border-box;justify-content:center;padding:var(--size20-5)}.foreword .container .content .description .messages .message.active .msn{opacity:0;display:flex;animation:1s enable-display 1s forwards}.foreword .container .content .description .messages .message.active .msn p{text-align:justify}.foreword .container .content .description .messages .message .msn-load,.foreword .container .content .description .messages .message .msn .emojis{height:40px;position:absolute}.foreword .container .content .description .messages .message .msn-load{display:none;padding:0 5px;align-items:center;box-sizing:border-box;justify-content:space-around}.foreword .container .content .description .messages .message.active .msn-load{width:80px;display:flex;animation:1s disable-display .5s forwards}.foreword .container .content .description .messages .message .msn-load .ball{width:10px;height:10px;border-radius:50%;transition:.3s all;animation:loading 1s infinite;background-color:var(--bg-paper)}.foreword .container .content .description .messages .message .msn-load :nth-child(2){animation-delay:.33s}.foreword .container .content .description .messages .message .msn-load :nth-child(3){animation-delay:.66s}.foreword .container .content .description .messages .message .msn .emojis{opacity:0;width:60px;bottom:-35%;display:flex;align-items:center;box-sizing:border-box;justify-content:center;border:solid 1px var(--bg-default);left:calc((var(--size20-5)) + 10px)}.foreword .container .content .description .messages .message.active .msn .emojis{animation:.5s enable-emoji 2s forwards}@keyframes rotate{0%{transform:rotateX(0)}20%{transform:rotateX(0)}25%{transform:rotateX(-90deg)}45%{transform:rotateX(-90deg)}50%{transform:rotateX(-180deg)}70%{transform:rotateX(-180deg)}75%{transform:rotateX(-90deg)}95%{transform:rotateX(-90deg)}to{transform:rotateX(0)}}@keyframes show-img{0%{background-position:center bottom calc((var(--img-height)) * -2)}to{background-position:center bottom 0px}}@keyframes remove-img{0%{background-position:center bottom 0px}to{background-position:center bottom calc((var(--img-height)) * -2)}}@keyframes loading{0%{transform:scale(1)}50%{transform:scale(1.5)}to{transform:scale(1)}}@keyframes enable-emoji{0%{opacity:0;transform:scale(0)}25%{opacity:1;transform:scale(0)}50%{transform:scale(1.2)}to{opacity:1;transform:scale(1)}}.primary .foreword .container .content .title .cube .face,.primary .foreword .container .content .description .items .item .info h3{color:var(--primary)}.secondary .foreword .container .content .title .cube .face,.secondary .foreword .container .content .description .items .item .info h3{color:var(--secondary)}.ternary .foreword .container .content .title .cube .face,.ternary .foreword .container .content .description .items .item .info h3{color:var(--ternary)}@media screen and (min-width:500px){.foreword .container .content .description .items .item{padding-top:var(--size60-13)}}@media screen and (min-width:700px){.foreword .container .content .description .items .item{gap:20px}.foreword .container .content .description .items .item .img{order:0}.foreword .container .content .description .items .item :nth-child(1),.foreword .container .content .description .items .item :nth-child(2){width:calc(50% - ((var(--size20-5)) / 2))}.foreword .container .content .description .items .item .info{text-align:left}}