.page-template-accesso-experience-store .iubenda-cs-preferences-link,
.page-template-app-lipstick-store .iubenda-cs-preferences-link,
.page-template-app-face-cream-store .iubenda-cs-preferences-link,
.page-template-app-foundation-store .iubenda-cs-preferences-link,
.page-template-app-armocromia-store .iubenda-cs-preferences-link,
.page-template-app-lip-gloss-store .iubenda-cs-preferences-link,
.page-template-beauty-profile .iubenda-cs-preferences-link,
.page-template-accesso-experience-store footer,
.page-template-app-lipstick-store footer,
.page-template-app-face-cream-store footer,
.page-template-app-foundation-store footer,
.page-template-app-armocromia-store footer,
.page-template-app-lip-gloss-store footer,
.page-template-beauty-profile footer,
.page-template-accesso-experience-store #newsletter,
.page-template-app-lipstick-store #newsletter,
.page-template-app-face-cream-store #newsletter,
.page-template-app-foundation-store #newsletter,
.page-template-app-armocromia-store #newsletter,
.page-template-app-lip-gloss-store #newsletter,
.page-template-beauty-profile #newsletter {
    display: none !important;
    opacity: 0 !important;
}

#authentication-store {
    width: 100%;
    min-height: 100vh;
    height: 100%;
}
.page-template-accesso-experience-store header .middle-header ul.middle-menu,
.page-template-accesso-experience-store header .upper-header,
.page-template-accesso-experience-store header .middle-header .icons-header,
.page-template-accesso-experience-store header .middle-header .cart-mobile,
.page-template-accesso-experience-store header .middle-header .menu-mobile,
.page-template-accesso-experience-store .promo-banner {
    display: none !important;
}
.page-template-accesso-experience-store header .middle-header .justify-between {
    justify-content: center;
    padding-bottom: 20px;
    border-bottom: none;
}
#authentication-store .ticket-insert,
#authentication-store .data-after-insert,
#authentication-store .login-store,
#authentication-store .choose-people,
#authentication-store .new-registration,
#authentication-store .new-user-data {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    position: relative;
    padding-top: 110px;
    padding-bottom: 60px;
}
#authentication-store .personal-data {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
    padding-top: 120px;
    padding-bottom: 70px;
}
#authentication-store .data-after-insert,
#authentication-store .login-store,
#authentication-store .choose-people,
#authentication-store .new-registration,
#authentication-store .new-user-data,
#authentication-store .personal-data {
    display: none;
}
#authentication-store h1 {
    font-family: 'editor-extrabold';
    font-size: 50px;
    font-style: normal;
    font-weight: 800;
    line-height: 53px;
    background: linear-gradient(37deg, #C02660 0%, #F9837D 100%, #F9837D 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-bottom: 12px;
}
#authentication-store h2 {
    font-family: 'gantari-bold';
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 2.4px;
    text-transform: uppercase;
    margin-bottom: 40px;
}
#authentication-store .ticket-insert form,
#authentication-store .data-after-insert form,
#authentication-store .login-store form,
#authentication-store .new-registration form,
#authentication-store .new-user-data form {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.authentication .ticket-insert input[type="email"] {
    color: var(--black, #000);
    text-align: center;
    font-family: 'gantari-regular';
    font-size: 30px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    letter-spacing: 12px;
    text-transform: uppercase;
}
body #content .authentication .ticket-insert input#ticket {
    color: #000;
    text-align: center;
    font-family: 'gantari-regular';
    font-size: 30px;
    font-weight: 400;
    line-height: normal;
    letter-spacing: 12px;
    text-transform: uppercase;
}
body #content .authentication input[type="email"],
body #content .authentication input[type="text"],
body #content .authentication select {
    border-radius: 20px;
    border: 1px solid #4C4672;
    background: #FFF;
    box-shadow: 0px 0px 54px 0px rgba(0, 0, 0, 0.10);
    width: 415px;
    height: 53px;
    margin-bottom: 15px;
    text-align: center;
    font-family: 'gantari-regular';
    font-size: 20px;
    line-height: normal;
    color: #000;
    -webkit-appearance:none;
}
body #content .authentication input[type="email"]::placeholder {
    font-family: 'gantari-regular';
    font-size: 20px;
    line-height: normal;
    color: #000;
}
body #content .authentication .personal-data input[type="email"],
body #content .authentication .personal-data input[type="text"],
body #content .authentication .personal-data select {
    text-align: left;
}
body #content .authentication .data-after-insert input[type="email"],
body #content .authentication .data-after-insert input[type="text"],
body #content .authentication .new-user-data input[type="email"],
body #content .authentication .new-user-data input[type="text"],
body #content .authentication .new-user-data select {
    text-align: left;
}
label.wrapper-privacy,
label.wrapper-newsletter {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 6px;
}
label.wrapper-privacy input.privacy,
label.wrapper-newsletter input.newsletter {
    accent-color: #4C4672;
}
label.wrapper-privacy span,
label.wrapper-newsletter span {
    font-family: 'gantari-regular';
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    color: #4C4672;
}
label.wrapper-privacy span a,
label.wrapper-newsletter span a {
    color: #4C4672 !important;
    font-family: 'gantari-bold';
}
.authentication .next-navigation {
    margin-top: 30px;
}
#app-skincare-store .next-navigation,
#app-lipstick-store .next-navigation,
#app-foundation-store .next-navigation,
#app-armocromia-store .next-navigation,
#app-lip-gloss-store .next-navigation {
    position: absolute;
    bottom: 50px;
    left: 0;
    z-index: 1;
}
#app-armocromia-store .next-navigation {
    bottom: unset;
    top: calc(100vh - 110px);
}
.authentication button.back-step,
.main-section .step .back-step,
#beauty-profile button.back-step,
#beauty-profile a.skip {
    color: #4C4672;
    text-align: center;
    font-family: 'gantari-extrabold';
    font-size: 18px;
    font-weight: 900;
    line-height: normal;
    background: none;
    padding: 21px 14px;
    text-transform: uppercase;
}
.main-section .step .back-step {
    padding: 4px;
}
.main-section .step .btn-skip-profile {
    padding: 21px 8px;
    font-family: 'gantari-bold';
    font-size: 15px;
    line-height: normal;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: #fff;
    border-radius: 21px;
    background: rgba(255, 255, 255, 0.16);
    padding: 21px 30px;
    margin-top: 13px;
}
#app-lipstick-store .step .btn-skip-profile,
#app-lip-gloss-store .step .btn-skip-profile {
    color: #4C4672;
}
#beauty-profile a.skip {
    position: absolute;
    right: 100px;
    top: 50%;
    transform: translateY(-50%);
}
.main-section .step.opening .back-step,
.main-section .step.choose-color .back-step {
    color: #fff;
}
.authentication button.btn.next,
.main-section .step .btn.next,
.main-section .step .create-profile,
#beauty-profile button.btn.next {
    border-radius: 46px;
    background: #4C4672;
    color: #fff;
    text-align: center;
    font-family: 'gantari-extrabold';
    font-size: 18px;
    font-weight: 900;
    line-height: normal;
    text-transform: uppercase;
    padding: 21px;
    min-width: 200px;
}
.main-section .step .row-content .new-cta {
    color: #fff;
    text-align: center;
    font-family: gantari-bold;
    font-size: 15px;
    line-height: normal;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    min-width: unset;
    border: none;
    border-radius: 21px;
    padding: 21px 30px;
    background: linear-gradient(68deg, #C02660 23.6%, #F9837D 128.08%, #F9837D 98.08%);
    transition: all 0.5s;
}
.main-section .step.closing .row-content .actions .new-cta {
    background: #4C4672;
}
.main-section .step .row-content .new-cta:disabled {
    opacity: 1;
    background: #D3D3D3;
}
.main-section .step .row-content .new-cta:focus,
.main-section .step .row-content .new-cta:focus-visible {
    outline: none;
    box-shadow: none;
}
.authentication .data-after-insert form label,
.authentication .new-user-data form label {
    display: flex;
    flex-direction: column;
    gap: 3px;
    align-items: flex-start;
    color: #000;
    font-family: 'gantari-regular';
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.authentication .forgotten-ticket p {
    color: #000;
    text-align: center;
    font-family: 'gantari-regular';
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-top: 30px;
    cursor: pointer;
}
.authentication .not-ticket {
    color: #4C4672;
    text-align: center;
    font-family: gantari-bold;
    font-size: 18px;
    font-style: italic;
    font-weight: 700;
    line-height: normal;
    position: absolute;
    bottom: 30px;
    left: 0;
    cursor: pointer;
}
.authentication .choose-people .wrapper-more-people {
    display: flex;
    justify-content: center;
    gap: 15px;
    align-items: center;
}
.authentication .choose-people form label .name-person {
    color: #000;
    font-family: 'gantari-regular';
    font-size: 20px;
    font-weight: 400;
    line-height: normal;
    width: 240px;
    height: 62px;
    padding: 19px;
    border-radius: 20px;
    border: 1px solid #4C4672;
    background: #FFF;
    box-shadow: 0px 0px 54px 0px rgba(0, 0, 0, 0.10);
}
.authentication .choose-people input[type=radio] {
    width: 0;
    height: 0;
    opacity: 0;
    position: absolute;
}
.authentication .choose-people input[type=radio] + div {
    cursor: pointer;
}
.authentication .choose-people input[type="radio"]:hover + div,
.authentication .choose-people input[type="radio"]:checked + div {
    background: #4C4672;
    color: #fff;
    transition: all 0.3s;
}
.authentication .choose-people .exp-per-person {
    display: none;
}
.authentication .choose-people .exp-per-person h4 {
    color: #000;
    text-align: center;
    font-family: 'gantari-bold';
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    margin-top: 30px;
    margin-bottom: 10px;
}
.authentication .already-registered {
    color: #000;
    text-align: left;
    font-family: 'gantari-bold';
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    width: 415px;
    margin-bottom: 20px;
}


/* APP LIPSTICK IN STORE*/

#app-lipstick-store,
#app-skincare-store,
#app-foundation-store,
#app-armocromia-store,
#app-lip-gloss-store {
    width: 100%;
    min-height: 100vh;
    height: 100%;
}
#app-lipstick-store .closing,
#app-skincare-store .closing,
#app-foundation-store .closing,
#app-armocromia-store .closing,
#app-lip-gloss-store .closing {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding-top: 165px;
    padding-bottom: 80px;
    position: relative;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.page-template-app-lipstick-store header .middle-header ul.middle-menu,
.page-template-app-lipstick-store header .upper-header,
.page-template-app-lipstick-store header .middle-header .icons-header,
.page-template-app-lipstick-store header .middle-header .cart-mobile,
.page-template-app-lipstick-store header .middle-header .menu-mobile,
.page-template-app-lipstick-store .promo-banner,
.page-template-app-face-cream-store header .middle-header ul.middle-menu,
.page-template-app-face-cream-store header .upper-header,
.page-template-app-face-cream-store header .middle-header .icons-header,
.page-template-app-face-cream-store header .middle-header .cart-mobile,
.page-template-app-face-cream-store header .middle-header .menu-mobile,
.page-template-app-face-cream-store .promo-banner,
.page-template-app-foundation-store header .middle-header ul.middle-menu,
.page-template-app-foundation-store header .upper-header,
.page-template-app-foundation-store header .middle-header .icons-header,
.page-template-app-foundation-store header .middle-header .cart-mobile,
.page-template-app-foundation-store header .middle-header .menu-mobile,
.page-template-app-foundation-store .promo-banner,
.page-template-beauty-profile header .middle-header ul.middle-menu,
.page-template-beauty-profile header .upper-header,
.page-template-beauty-profile header .middle-header .icons-header,
.page-template-beauty-profile header .middle-header .cart-mobile,
.page-template-beauty-profile header .middle-header .menu-mobile,
.page-template-beauty-profile .promo-banner,
.page-template-app-armocromia-store header .middle-header ul.middle-menu,
.page-template-app-armocromia-store header .upper-header,
.page-template-app-armocromia-store header .middle-header .icons-header,
.page-template-app-armocromia-store header .middle-header .cart-mobile,
.page-template-app-armocromia-store header .middle-header .menu-mobile,
.page-template-app-armocromia-store .promo-banner,
.page-template-app-lip-gloss-store header .middle-header ul.middle-menu,
.page-template-app-lip-gloss-store header .upper-header,
.page-template-app-lip-gloss-store header .middle-header .icons-header,
.page-template-app-lip-gloss-store header .middle-header .cart-mobile,
.page-template-app-lip-gloss-store header .middle-header .menu-mobile,
.page-template-app-lip-gloss-store .promo-banner {
    display: none !important;
}
.page-template-app-lipstick-store header .middle-header .justify-between,
.page-template-app-face-cream-store header .middle-header .justify-between,
.page-template-app-foundation-store header .middle-header .justify-between,
.page-template-beauty-profile header .middle-header .justify-between,
.page-template-app-armocromia-store header .middle-header .justify-between,
.page-template-app-lip-gloss-store header .middle-header .justify-between {
    justify-content: center;
    padding-bottom: 20px;
    padding-top: 36px;
    border-bottom: none;
}
.main-section .step {
    overflow: hidden;
    transition: all 0.3s;
}
.main-section .step.opening {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding-bottom: 80px;
    position: relative;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
#app-lipstick-store .opening {
    background-image: url('../img/bg-app-lipstick.jpg');
}
#app-lipstick-store[data-experience="lip_balm"] .opening {
    background-image: url('../img/bg-app-lip-balm.jpg');
}
#app-lip-gloss-store .opening {
    background-image: url('../img/bg-app-lip-gloss.jpg');
}
#app-skincare-store .opening {
    background-image: url('../img/bg-app-skincare.jpg');
}
#app-foundation-store .opening {
    background-image: url('../img/bg-app-foundation.jpg');
}
#app-armocromia-store .opening {
    padding-bottom: 0;
    background-image: url('../img/bg-app-armocromia.jpg');
}
.main-section .step:not(.opening),
.main-section .step:not(.closing) {
    min-height: 100vh;
    text-align: center;
    position: relative;
}
#app-lipstick-store .step:not(.opening):not(.closing) {
    background: Linear-gradient(180deg, #FFD3D3 0%, #D2B2D9 100%);
}
#app-lipstick-store[data-experience="lip_balm"] .step:not(.opening):not(.closing) {
    background: linear-gradient(180deg, #FFB685 0%, #EC91BA 144.48%);    
}
#app-lip-gloss-store .step:not(.opening):not(.closing) {
    background: linear-gradient(135deg, #FFF886 0%, #F072B6 100%);
}
.step:not(.opening) h1 {
    text-align: center;
    font-family: 'editor-bold';
    font-size: 36px;
    line-height: 53px;
    text-transform: uppercase;
    background: linear-gradient(37deg, #C02660 0%, #F9837D 100%, #F9837D 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-bottom: 0;
}
#app-lipstick-store[data-experience="lip_balm"] .step:not(.opening) h1,
#app-lip-gloss-store .step:not(.opening) h1 {
    color: #4C4672;
    background: transparent;
    -webkit-text-fill-color: #4C4672;
    background-clip: unset;
}
.step:not(.opening) .steps {
    padding-top: 150px;
}
#app-lipstick-store .step.closing {
    background-image: url("../img/bg-app-lipstick-store-closing.jpg");
}
#app-lipstick-store[data-experience="lip_balm"] .step.closing {
    background-image: url("../img/bg-app-lip-balm-store-closing.jpg");
}
#app-lip-gloss-store .step.closing {
    background-image: url("../img/bg-app-lip-gloss-store-closing.jpg");
}
#app-skincare-store .step.closing {
    background-image: url('../img/bg-app-skincare-store-closing.jpg');
}
#app-foundation-store .step.closing {
    background-image: url('../img/bg-app-foundation-store-closing.jpg');
}
#app-armocromia-store .step.closing {
    background-image: url('../img/bg-app-armocromia-store-closing.jpg');
}
#app-lipstick-store .row.navigation,
#app-skincare-store .row.navigation,
#app-foundation-store .row.navigation,
#app-armocromia-store .row.navigation,
#app-lip-gloss-store .row.navigation {
    padding-top: 46px;
    position: absolute;
    top: 0px;
    width: 100%;
    max-width: 1320px;
    z-index: 3;
}
#app-lipstick-store .row.navigation .col-md-5,
#app-skincare-store .row.navigation .col-md-5,
#app-foundation-store .row.navigation .col-md-5,
#app-armocromia-store .row.navigation .col-md-5,
#app-lip-gloss-store .row.navigation .col-md-5 {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
#app-lipstick-store .row.navigation .col-md-5:first-of-type,
#app-skincare-store .row.navigation .col-md-5:first-of-type,
#app-foundation-store .row.navigation .col-md-5:first-of-type,
#app-armocromia-store .row.navigation .col-md-5:first-of-type,
#app-lip-gloss-store .row.navigation .col-md-5:first-of-type {
    justify-content: flex-start;
}
@media screen and (min-width:1200px) and (max-width:1399px) {
    #app-lipstick-store .row.navigation,
    #app-skincare-store .row.navigation,
    #app-foundation-store .row.navigation,
    #app-armocromia-store .row.navigation,
    #app-lip-gloss-store .row.navigation {
        max-width: 1140px;
    }
}
@media screen and (min-width:992px) and (max-width:1199px) {
    #app-lipstick-store .row.navigation,
    #app-skincare-store .row.navigation,
    #app-foundation-store .row.navigation,
    #app-armocromia-store .row.navigation,
    #app-lip-gloss-store .row.navigation {
        max-width: 960px;
    }
}
@media screen and (min-width:768px) and (max-width:991px) {
    #app-lipstick-store .row.navigation,
    #app-skincare-store .row.navigation,
    #app-foundation-store .row.navigation,
    #app-armocromia-store .row.navigation,
    #app-lip-gloss-store .row.navigation {
        max-width: 720px;
    }
}
@media screen and (max-width:767px) {
    #app-lipstick-store .row.navigation,
    #app-skincare-store .row.navigation,
    #app-foundation-store .row.navigation,
    #app-armocromia-store .row.navigation,
    #app-lip-gloss-store .row.navigation {
        max-width: 540px;
    }
}
#app-skincare-store .step.closing h1,
#app-foundation-store .step.closing h1,
#app-armocromia-store .step.closing h1,
#app-lip-gloss-store .step.closing h1 {
    text-align: left;
    font-size: 42px;
    line-height: 123%;
    margin-bottom: 23px;
    max-width: 500px;
    color: #fff;
    background: transparent;
    -webkit-text-fill-color: white;
}
#app-lipstick-store .step.closing h1 {
    text-align: left;
    font-size: 42px;
    line-height: 123%;
    margin-bottom: 23px;
    max-width: 500px;
}
.main-section .step.opening h1 {
    margin: 0 auto;
    margin-bottom: 30px;
    padding-top: 0;
    color: #fff;
    text-align: center;
    font-family: 'editor-bold';
    font-size: 36px;
    font-weight: 700;
    line-height: normal;
    text-transform: uppercase;
}
.main-section .step.choose-color h1 {
    text-align: center;
    font-family: 'editor-bold';
    font-size: 36px;
    line-height: normal;
    color: #fff;
    background: none !important;
    background-clip: unset !important;
    -webkit-text-fill-color: #fff !important;
    margin: 0 auto;
    width: 655px;
}
#app-lipstick-store .step.opening p.description,
#app-skincare-store .step.opening p.description,
#app-foundation-store .step.opening p.description,
#app-armocromia-store .step.opening p.description,
#app-lip-gloss-store .step.opening p.description {
    color: #fff;
    text-align: center;
    font-family: 'gantari-medium';
    font-size: 20px;
    line-height: normal;
    letter-spacing: 2px;
    text-transform: uppercase;
    max-width: 800px;
    margin: 0 auto 9px;
}
.main-section .step.opening p.name-cit {
    color: #fff;
    text-align: center;
    font-family: 'gantari-light';
    font-size: 16px;
    font-style: italic;
    line-height: normal;
    letter-spacing: 1.6px;
    margin-bottom: 0;
}
.main-section .step .steps {
    color:  #530006;
    text-align: center;
    font-family: 'gantari-regular';
    font-size: 13px;
    line-height: normal;
    letter-spacing: 5.2px;
    text-transform: uppercase;
    margin-bottom: 14px;
}
#app-lip-gloss-store .step .steps {
    color: #161336;
}
.main-section .step .navigation .logout {
    color: #575757;
    text-align: right;
    font-family: 'gantari-regular';
    font-size: 17px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    letter-spacing: 0.95px;
}
.main-section .step .navigation .logout a {
    color: #4C4672;
    font-family: 'gantari-bold';
    font-size: 19px;
    font-style: normal;
    font-weight: 700;
}
.main-section .step .navigation.logo-only .back-step,
.main-section .step .navigation.logo-only .logout {
    display: none;
}
.main-section .step p.subtitle {
    color: #4C4672;
    text-align: center;
    font-family: 'gantari-bold';
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 2.4px;
    text-transform: uppercase;
    margin-bottom: 65px;
}
#app-lipstick-store .step p.subtitle,
#app-lip-gloss-store .step p.subtitle {
    color: #530006;
    font-family: 'gantari-regular';
    font-size: 14px;
    line-height: normal;
    letter-spacing: normal;
    text-transform: none;
    margin-bottom: 45px;
}
#app-lip-gloss-store .step.choose-perla p.subtitle {
    margin-bottom: 20px;
}
#app-lipstick-store .choose-texture .wrapper-texture,
#app-lipstick-store .choose-principio-attivo .wrapper-texture,
#app-lip-gloss-store .choose-texture .wrapper-texture,
#app-lip-gloss-store .choose-principio-attivo .wrapper-texture {
    display: flex;
    justify-content: center;
    column-gap: 20px;
    margin-bottom: 75px;
}
#app-lipstick-store .choose-aroma .wrapper-texture,
#app-lipstick-store .customize .wrapper-texture,
#app-lip-gloss-store .choose-aroma .wrapper-texture,
#app-lip-gloss-store .choose-perla .wrapper-texture {
    display: flex;
    justify-content: center;
    align-items: stretch;
    column-gap: 20px;
    margin-bottom: 75px;
}
#app-lip-gloss-store .choose-perla .wrapper-texture {
    flex-wrap: wrap;
    width: 60vw;
    margin: 0 auto 75px;
}
#app-lipstick-store .wrapper-texture label,
#app-lip-gloss-store .wrapper-texture label {
    width: 173px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    gap: 17px;
}
#app-lip-gloss-store .choose-perla .wrapper-texture label {
    width: calc(25% - 20px);
}
#app-lipstick-store .customize .wrapper-texture label {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    gap: 17px;
}
#app-lipstick-store .radio-wrapper,
#app-lip-gloss-store .radio-wrapper {
    padding: 34px;
    min-height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 17px;
    border-radius: 12px;
    border: none;
    transition: all 0.3s;
}
#app-lipstick-store .image-radio,
#app-lip-gloss-store .image-radio {
    width: 105px;
    height: auto;
    aspect-ratio: 1;
    background: #fff;
    border-radius: 100%;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}
#app-lip-gloss-store .choose-perla .image-radio {
    width: 95px;
}
#app-lipstick-store p.title-radio,
#app-lip-gloss-store p.title-radio {
    color: #4C4672;
    text-align: center;
    font-family: 'gantari-regular';
    font-size: 22px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    margin-bottom: 0;
}
#app-lipstick-store p.title-radio b,
#app-lip-gloss-store p.title-radio b {
    font-family: 'gantari-extrabold';
}
.main-section .step input[type="radio"] {
    width: 0;
    height: 0;
    opacity: 0;
    position: absolute;
}
#app-lipstick-store input[type="radio"] + div,
#app-lip-gloss-store input[type="radio"] + div {
    cursor: pointer;
}
#app-lipstick-store input[type="radio"]:checked + div {
    background: #DFAFC9;
    box-shadow: 0px 0px 18px 0px rgba(0, 0, 0, 0.20);
}
#app-lipstick-store[data-experience="lip_balm"] input[type="radio"]:checked + div {
    background: linear-gradient(180deg, #FFA060 0%, #E970A7 144.48%);
}
#app-lip-gloss-store input[type="radio"]:checked + div {
    background: linear-gradient(166deg, #FFF886 -34.63%, #F072B6 126.34%);
    box-shadow: 0px 0px 18px 0px rgba(0, 0, 0, 0.25);
    border: none;
}
#app-lipstick-store .citylab-tooltip,
#app-lip-gloss-store .citylab-tooltip {
    vertical-align: bottom;
    margin-top: auto;
}
#app-lipstick-store .tooltip-icon,
#app-lip-gloss-store .tooltip-icon {
    width: 30px;
    height: 30px;
    background: #4C4672;
    line-height: 30px;
    position: unset;
}
#app-lipstick-store .choose-color .container,
#app-lipstick-store .armo-result .container,
#app-foundation-store .choose-color .container,
#app-lip-gloss-store .choose-color .container {
    z-index: 1;
}
#app-lipstick-store .choose-color .bg-image,
#app-lipstick-store .armo-result .bg-image {
    width: 890px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, 0);
    background-image: url('../img/bg-app-lipstick-color.png');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 0;
}
#app-lipstick-store[data-experience="lip_balm"] .choose-color .bg-image {
    width: 100%;
    background-image: url('../img/bg-app-lip-balm-color.jpg');
}
#app-foundation-store .choose-color .bg-image {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    background-image: url('../img/bg-app-foundation-color.jpg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: -1;
}
#app-lip-gloss-store .choose-color .bg-image {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    background-image: url('../img/bg-app-lip-gloss-color.jpg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 0;
}
#app-lipstick-store .choose-color .ellipse,
#app-lipstick-store .armo-result .ellipse {
    width: 555px;
    height: 555px;
    border-radius: 555px;
    opacity: 0.4;
    background: #4C4672;
    mix-blend-mode: multiply;
    filter: blur(100px);
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 0;
}
#app-foundation-store .choose-color .ellipse {
    width: 1137px;
    height: 1137px;
    border-radius: 1137px;
    opacity: 0.3;
    background: #896248;
    mix-blend-mode: multiply;
    filter: blur(100px);
    position: absolute;
    z-index: 0;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
#app-lip-gloss-store .choose-color .ellipse {
    width: 718px;
    height: 568px;
    border-radius: 718px;
    background: radial-gradient(50% 50% at 50% 50%, rgba(0, 0, 0, 0.24) 0%, rgba(0, 0, 0, 0.00) 100%);
    position: absolute;
    z-index: 0;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.main-section .closing p.conclusion {
    color: #530006;
    text-align: left;
    font-family: 'gantari-regular';
    font-size: 20px;
    line-height: normal;
    margin-bottom: 72px;
}
.main-section .closing .wrapper-qr-code {
    max-width: 388px;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: absolute;
    right: 100px;
    top: 50%;
    transform: translateY(-50%);
    border-radius: 35px;
    padding: 25px;
    background: #FFDCDC;
    box-shadow: 0px 0px 70px 0px rgba(0, 0, 0, 0.20);
}
#app-armocromia-store .closing .wrapper-qr-code {
    right: 0;
}
.main-section .closing .wrapper-qr-code .icon-whatsapp {
    max-width: 75px;
    margin-top: -63px;
    margin-bottom: 30px;
}
.main-section .closing .wrapper-qr-code .title {
    color: #4C4672;
    text-align: center;
    font-family: 'gantari-bold';
    font-size: 30px;
    font-style: normal;
    font-weight: 800;
    line-height: 24px;
    margin-bottom: 44px;
}
.main-section .closing .wrapper-qr-code .title .pink {
    background: linear-gradient(66deg, #C02660 -6.66%, #F9837D 101.89%, #F9837D 101.89%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.main-section .closing .wrapper-qr-code p {
    color: #4C4672;
    text-align: center;
    font-family: 'gantari-regular';
    font-size: 21px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
}
.main-section .closing .wrapper-qr-code .box-qr {
    border-radius: 21px;
    background: linear-gradient(66deg, #C02660 -6.66%, #F9837D 101.89%, #F9837D 101.89%);
    background-blend-mode: multiply;
    padding: 14px 28px;
    display: flex;
    align-items: center;
    gap: 14px;
}
.main-section .closing .wrapper-qr-code .box-qr p {
    text-align: left;
    color: #fff;
    font-size: 15px;
    line-height: 20px;
    margin-bottom: 0;
}
.main-section .closing .actions {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
#app-skincare-store .details-slide .description,
#app-foundation-store .details-slide .description,
#app-foundation-store .card-text-container .details-card-text .description {
    font-family: 'gantari-medium';
    font-size: 15px;
    line-height: 18px;
    letter-spacing: -0.02em;
    color: #666577;
}
#app-skincare-store .details-slide .title,
#app-foundation-store .details-slide .title,
#app-foundation-store .details-card-text .title {
    font-family: 'gantari-bold';
    font-size: 14px;
    line-height: 17px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #283C70;
    margin-bottom: 10px;
}

/* BEAUTY PROFILE */

#beauty-profile {
    width: 100%;
}
.page-template-beauty-profile header .middle-header ul.middle-menu,
.page-template-beauty-profile header .upper-header,
.page-template-beauty-profile header .middle-header .icons-header,
.page-template-beauty-profile header .middle-header .cart-mobile,
.page-template-beauty-profile header .middle-header .menu-mobile,
.page-template-beauty-profile .promo-banner {
    display: none !important;
}
.page-template-beauty-profile header .middle-header .justify-between {
    justify-content: center;
    padding-bottom: 20px;
    border-bottom: none;
}
#beauty-profile .step {
    height: 100vh;
    padding-top: 210px;
    padding-bottom: 65px;
}
#beauty-profile h1 {
    font-family: 'gantari-regular';
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-bottom: 35px;
}
#authentication-store .personal-data h3 {
    font-family: 'gantari-bold';
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
#beauty-profile label,
#authentication-store .personal-data label {
    color: #000;
    font-family: 'gantari-regular';
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    display: flex;
    align-items: flex-start;
    gap: 10px;
}
#beauty-profile .answers.columns-2 label {
    width: 48%;
}
#beauty-profile .answers.columns-3 label,
#authentication-store .personal-data .answers.columns-3 label,
#authentication-store .personal-data .text.columns-3 label {
    width: 30%;
}
#authentication-store .personal-data .wrapper-step.text.columns-3 label {
    display: flex;
    flex-direction: column;
    gap: 5px;
}
#beauty-profile .text label {
    width: 100%;
    align-items: center;
}
#beauty-profile .answers label input,
#authentication-store .personal-data .answers label input {
    margin-top: 5px;
    accent-color: #4C4672;
}
#authentication-store .personal-data input[type="text"] {
    width: 100% !important;
    margin-bottom: 0 !important;
}
#beauty-profile .wrapper-step .wrapper-question-profile {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 30%;
}
#beauty-profile .wrapper-step .wrapper-question-profile.middle {
    width: 46%;
}
body #content #beauty-profile input[type=text] {
    border-radius: 20px;
    border: 1px solid #4C4672;
    background: #FFF;
    box-shadow: 0px 0px 54px 0px rgba(0, 0, 0, 0.10);
    width: 45%;
    height: 50px;
    font-family: 'gantari-regular';
    font-size: 20px;
    line-height: normal;
    color: #000;
}
#beauty-profile .next-navigation,
#authentication-store .personal-data .next-navigation {
    display: flex;
    justify-content: center;
    position: absolute;
    bottom: 50px;
    left: 0;
}
#beauty-profile .wrapper-step {
    display: flex;
    justify-content: space-between;
    margin-top: 30px;
    column-gap: 3.33%;
    row-gap: 20px;
    flex-wrap: wrap;
}
#authentication-store .personal-data .wrapper-step,
#authentication-store .personal-data .wrapper-step {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
    margin-bottom: 35px;
    column-gap: 3.33%;
    row-gap: 20px;
    flex-wrap: wrap;
}
#beauty-profile .navigation .numbers {
    color: #575757;
    font-size: 19px;
    line-height: normal;
    letter-spacing: 0.95px;
    padding-bottom: 15px;
}
#beauty-profile .navigation .line {
    width: 100%;
    height: 8px;
    background: #d9d9d9;
    margin-bottom: 55px;
}
#beauty-profile .navigation .line .progress {
    width: 0;
    height: 100%;
    background: #4C4672;
    border-radius: 0;
    transition: all 0.3s;
}

.main-section .step .popup-info-product {
    width: 100vw;
    height: 100vh;
    position: fixed;
    overflow: scroll;
    left: 0;
    top: 0;
    z-index: 3;
    display: none;
    justify-content: center;
    align-items: center;
    background: rgba(15, 25, 115, 0.46);
}
.main-section .step .popup-info-product .wrapper {
    background: #FFFFFF;
    box-shadow: 0px 0px 35px rgba(0, 0, 0, 0.3);
    border-radius: 30px;
    width: 90%;
    max-width: 500px;
    max-height: 90vh;
    overflow-x: hidden;
    overflow-y: scroll;
}
.main-section .step .popup-info-product .heading-popup {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: linear-gradient(262.3deg, #BFA4EA 5.67%, #FA5F8C 96.72%), #FFFFFF;
    padding: 40px 28px 28px;
    border-top-left-radius: 30px;
    border-top-right-radius: 30px;
}
#app-skincare-store .wrapper-card .heading-popup .title,
#app-skincare-store .heading-popup .title,
#app-foundation-store .popup-info-product .heading-popup .title,
#app-lipstick-store .popup-info-product .heading-popup .title,
#app-lip-gloss-store .popup-info-product .heading-popup .title {
    font-family: 'gantari-black';
    font-size: 23px;
    line-height: 25px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #FFFFFF;
    text-align: start;
    margin-bottom: 0;
}
.main-section .step .content-popup {
    padding: 28px 28px 47px;
    font-family: 'gantari-medium';
    font-size: 16px;
    line-height: 19px;
    color: #666577;
    text-align: left;
}
.main-section .step .content-popup p:last-of-type {
    margin-bottom: 0;
}


.main-section .swiper.swiper-carousel {
    padding-left: 60px;
    padding-right: 60px;
    padding-top: 27px;
    padding-bottom: 15px;
}
.main-section .swiper.swiper-carousel .swiper-slide {
    display: flex;
    justify-content: center;
    min-height: 440px;
}
#app-skincare-store .swiper.swiper-carousel .swiper-slide {
    visibility: hidden;
}
#app-skincare-store .swiper.swiper-carousel .swiper-slide.swiper-slide-prev,
#app-skincare-store .swiper.swiper-carousel .swiper-slide.swiper-slide-next,
#app-skincare-store .swiper.swiper-carousel .swiper-slide.swiper-slide-active {
    visibility: visible !important;
 }
.main-section .swiper-carousel .swiper-button-next:after {
    content: '';
    width: 36px;
    min-width: 36px;
    height: 27px;
    background-image: url('../img/next-slide-skincare.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}
.main-section .swiper-carousel .swiper-button-prev:after {
    content: '';
    width: 36px;
    min-width: 36px;
    height: 27px;
    background-image: url('../img/prev-slide-skincare.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}
.main-section .swiper.swiper-carousel input[type="radio"] + button {
    cursor: pointer;
}
.main-section .swiper-slide-prev {
    filter: grayscale(1);
    transform: rotate(-7deg) translate(0, 40px) !important;
    transition: all 0.3s;
}
.main-section .swiper-slide-next {
    filter: grayscale(1);
    transform: rotate(7deg) translate(0, 40px) !important;
    transition: all 0.3s;
}
.main-section .choose-supplement .swiper-slide-prev,
.main-section .choose-supplement .swiper-slide-next {
    opacity: 0.6;
}
.main-section .choose-supplement .swiper-slide-prev .box-integratore,
.main-section .choose-supplement .swiper-slide-next .box-integratore {
    background: #DEDEDE;
    transition: all 0.3s;
}
.main-section .choose-supplement .swiper-slide-active .box-integratore {
    background: var(--active-bg);
    box-shadow: 0px 0px 30px 0px rgba(82, 45, 44, 0.30);
}
.main-section .choose-supplement .box-integratore {
    border-radius: 35px;
}
.main-section .swiper-pagination {
    top: 245px;
    height: 30px;
}
.main-section .supplement .swiper-pagination {
    top: 220px;
}
.main-section .swiper-pagination-bullet {
    background: #CAAEEA;
    opacity: 1;
}
.main-section .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: #624583;
    border-radius: 40px;
    width: 32px;
}
.main-section .img-texture {
    position: absolute;
    right: -24px;
}
.main-section .supplement .img-texture {
    position: unset;
    height: 185px;
    border-radius: 30px;
}
@media screen and (max-height: 800px) {
    .main-section .supplement .img-texture {
        height: 165px;
    }
    .main-section .supplement .swiper-pagination {
        top: 200px;
    }
}
.main-section .box-texture_crema {
    background: linear-gradient(180deg, #C1A3E7 0%, #FDB4C9 100%);
    box-shadow: 0px 0px 30.21px rgba(82, 45, 44, 0.3);
    border-radius: 34.9257px;
    padding: 20px;
    max-width: 240px;
    min-width: 240px;
    height: 210px;
    margin: 0 auto;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}
.main-section .box-texture_siero {
    background: linear-gradient(180deg, #F9869A 0%, #E8989D 100%);
    box-shadow: 0px 0px 30.21px rgba(82, 45, 44, 0.3);
    border-radius: 34.9257px;
    padding: 20px;
    max-width: 240px;
    min-width: 240px;
    height: 210px;
    margin: 0 auto;
    position: relative;
    z-index: -1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}
.main-section .box-principio_attivo {
    background: linear-gradient(180deg, #F6D4BC 0%, #DFB495 100%);
    box-shadow: 0px 0px 30.21px rgba(82, 45, 44, 0.3);
    border-radius: 34.9257px;
    padding: 20px;
    max-width: 240px;
    min-width: 240px;
    height: 210px;
    margin: 0 auto;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}
.main-section .box-supplement {
    background: transparent;
    box-shadow: 0px 0px 30.21px rgba(82, 45, 44, 0.3);
    border-radius: 34.9257px;
    max-width: 240px;
    min-width: 240px;
    height: 210px;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
}
.main-section .box-supplement img {
    min-width: 103%;
    position: absolute;
    left: 50%;
    top: 50%;
    height: auto;
    object-fit: cover;
    transform: translate(-50%,-50%);
}
.main-section .box-texture_crema .type,
.main-section .box-texture_siero .type,
.main-section .box-principio_attivo .type,
.main-section .box-card-text .type {
    font-family: 'gantari-bold';
    font-size: 14px;
    line-height: 17px;
    letter-spacing: 0.08em;
    color: #FFFFFF;
    margin-bottom: 15px;
    text-transform: uppercase;
}
.main-section .box-texture_crema .title,
.main-section .box-principio_attivo .title {
    font-size: 34px;
    line-height: 30px;
    text-transform: uppercase;
}
#app-foundation-store .box-principio_attivo .title {
    font-size: 30px;
    line-height: 31px;
}
.main-section .box-texture_siero .title {
    font-size: 31px;
    line-height: 33px;
}
.main-section .box-texture_crema .title,
.main-section .box-texture_siero .title {
    font-family: 'gantari-black';
    background: linear-gradient(262.3deg, #BFA4EA 5.67%, #FA5F8C 96.72%), #FFFFFF;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
    mix-blend-mode: multiply;
    margin-bottom: 14px;
    text-transform: uppercase;
}
.main-section .box-principio_attivo .title {
    font-family: 'gantari-black';
    background: linear-gradient(262.3deg, #E1B698 5.67%, #996D4D 96.72%), #FFFFFF;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
    mix-blend-mode: multiply;
    margin-bottom: 14px;
}
.main-section .box-texture_crema .description,
.main-section .box-texture_siero .description,
.main-section .box-principio_attivo .description {
    font-family: 'gantari-black';
    font-size: 22px;
    line-height: 22px;
    text-transform: uppercase;
    color: #FFFFFF;
    margin-bottom: 15px;
    position: relative;
}
.main-section .box-texture_siero .description {
    font-size: 18px;
    line-height: 21px;
}
#app-skincare-store .swiper-slide-active .details-slide,
#app-foudation-store .swiper-slide-active .details-slide {
    visibility: visible;
}
#app-skincare-store .details-slide,
#app-foudation-store .details-slide {
    visibility: hidden;
    width: 400px;
    margin: 0 auto;
    padding-top: 40px;
    text-align: center;
    position: absolute;
    left: -30%;
}
.main-section .subquestion-container {
    display: flex;
    justify-content: center;
    column-gap: 2%;
    row-gap: 15px;
    margin-bottom: 15px;
    padding-top: 27px;
}

.main-section .subquestion-container input[type="radio"]:checked + div,
.main-section .card-image-container input[type="radio"]:checked + div,
.main-section .card-text-container input[type="radio"]:checked + div {
    box-shadow: 0px 0px 35px rgba(0, 0, 0, 0.3);
    transition: all 0.3s;
    filter: none;
}
.main-section .subquestion-container input[type="radio"].base:not(checked) + div,
.main-section .card-image-container input[type="radio"].base:not(checked) + div,
.main-section .card-text-container input[type="radio"].base:not(checked) + div {
    filter: none;
    box-shadow: none;
}
.main-section .subquestion-container input[type="radio"]:not(checked) + div,
.main-section .card-image-container input[type="radio"]:not(checked) + div,
.main-section .card-text-container input[type="radio"]:not(checked) + div {
    transition: all 0.3s;
    filter: grayscale(1);
}
.main-section .subquestion-container input[type="radio"]:hover + div,
.main-section .card-image-container input[type="radio"]:hover + div,
.main-section .card-text-container input[type="radio"]:hover + div {
    filter: none;
    box-shadow: 0px 0px 35px rgba(0, 0, 0, 0.3);
}
.main-section .icon-subquestion {
    width: 45px;
    min-width: 45px;
    height: 45px;
    background-image: url('../img/leaf.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
#app-skincare-store .wrapper-subquestion,
#app-foundation-store .wrapper-subquestion {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 25px 21px 70px;
    border-radius: 35px;
    text-align: left;
    gap: 15px;
    height: 100%;
    max-width: 240px;
    position: relative;
    cursor: pointer;
}
.main-section .wrapper-subquestion .wrapper-text .title {
    font-family: 'gantari-extrabold';
    font-size: 20px;
    line-height: 22px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #283C70;
    margin-bottom: 5px;
}
.main-section .wrapper-subquestion .wrapper-text .text {
    font-family: 'gantari-medium';
    font-size: 17px;
    line-height: 21px;
    color: #283C70;
}
.main-section .wrapper-subquestion .wrapper-text .text p {
    font-family: 'gantari-medium';
    font-size: 15px;
    line-height: 18px;
    color: #283C70;
    margin-bottom: 8px;
}
.main-section .wrapper-subquestion .wrapper-text .text p:last-of-type {
    font-size: 15px;
    line-height: 18px;
    margin-bottom: 0;
}
.main-section .wrapper-subquestion .more-info,
.main-section .box-card-text .more-info,
.main-section .supplement .more-info {
    width: 30px;
    min-width: 30px;
    height: 30px;
    background: rgba(145, 145, 145, 0.5);
    mix-blend-mode: multiply;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 100%;
    position: absolute;
    bottom: 25px;
}
.main-section .supplement .more-info {
    position: unset;
    margin: 12px auto 0 auto;
}
.main-section .wrapper-subquestion .more-info:hover,
.main-section .box-card-text .more-info:hover,
.main-section .supplement .more-info:hover {
    background: rgba(145,145,145,1);
    transition: all 0.3s;
}


.main-section .card-image-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    column-gap: 2%;
    row-gap: 10px;
    margin-bottom: 15px;
    padding-top: 27px;
}
#app-skincare-store .card-image-container label {
    width: 18.4%;
}
#app-foundation-store .card-image-container label {
    width: 23.4%;
}
#app-skincare-store .wrapper-card .title {
    font-family: 'gantari-extrabold';
    font-size: 18px;
    line-height: 19px;
    letter-spacing: 0.05em;
    color: #283C70;
    text-transform: uppercase;
    margin-bottom: 15px;
}
#app-skincare-store .wrapper-card .info,
#app-foundation-store .wrapper-card .info {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}
#app-skincare-store label:last-of-type .wrapper-card .info,
#app-foundation-store label:last-of-type .wrapper-card .info {
    visibility: hidden;
}
#app-skincare-store .wrapper-card .info-shadow,
#app-foundation-store .wrapper-card .info-shadow {
    width: 30px;
    min-width: 30px;
    height: 30px;
    background: rgba(145, 145, 145, 0.5);
    mix-blend-mode: multiply;
    border-radius: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
#app-skincare-store .wrapper-card .img-info,
#app-foundation-store .wrapper-card .img-info {
    position: absolute;
    bottom: 7px;
}
.main-section .wrapper-card {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: 15px;
    background: linear-gradient(180deg, #C1A3E7 0%, #FDB4C9 100%);
    border-radius: 35px;
    padding: 20px;
    height: 100%;
}
#app-foundation-store .wrapper-card {
    background: linear-gradient(180deg, #F6D4BC 0%, #DFB495 100%);
    cursor: pointer;
}
.main-section .icon-card {
    display: flex;
    justify-content: center;
    max-height: 77px;
}
#app-foundation-store .card-text-container .box-card-text {
    background: linear-gradient(#F6D4BC, #DFB495);
    box-shadow: 0px 0px 30.21px rgba(82, 45, 44, 0.3);
    border-radius: 34.9257px;
    padding: 32px 22px 47px;
    max-width: 256px;
    min-width: 256px;
    height: 230px;
    margin: 0 auto;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    transition: all 0.3s;
    filter: grayscale(10);
    cursor: pointer;
}
#app-foundation-store .card-text-container .box-card-text.color {
    background: linear-gradient(#F6D4BC, #DFB495);
    filter: none;
}
#app-foundation-store .card-text-container .box-card-text .title {
    font-family: 'gantari-black';
    background: linear-gradient(#E1B698, #996D4D), #FFFFFF;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
    mix-blend-mode: multiply;
    margin-bottom: 14px;
    text-transform: uppercase;
    font-size: 42px;
    line-height: 37px;
    transition: all 0.3s;
}
#app-foundation-store .card-text-container {
    display: flex;
    justify-content: center;
    gap: 45px;
    padding-top: 30px;
}
#app-foundation-store .card-text-container .box-card-text .img-card {
    position: absolute;
    right: -50px;
    top: 15px;
    max-width: 155px;
}
#app-foundation-store .card-text-container .details-card-text {
    width: 240px;
    padding-top: 25px;
}
#app-foundation-store .step.choose-color,
#app-lipstick-store .step.choose-color,
#app-lip-gloss-store .step.choose-color {
    display: flex;
    align-items: center;
}
#app-foundation-store .wrapper-card .title {
    font-family: 'gantari-extrabold';
    font-size: 18px;
    line-height: 19px;
    letter-spacing: 0.05em;
    color: #7C563B;
    text-transform: uppercase;
    margin-bottom: 15px;
}
.step-description {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-top: 18px;
    font-family: 'gantari-light';
    font-size: 14px;
    font-weight: 300;
    text-align: center;
    line-height: normal;
    letter-spacing: 1.12px;
    color: #4B4B4B;
}

.armo-question {
    font-family: 'gantari-medium';
    font-size: 16px;
    line-height: normal;
    text-align: center;
    color: #530006;
    transition: all 0.3s;
}
.armo-question.disabled {
    opacity: 0.5;
}
.btn.skip-armo,
.btn.skip-armo:hover {
    font-family: 'gantari-bold';
    font-size: 15px;
    line-height: normal;
    letter-spacing: 1.2px;
    text-align: center;
    text-transform: uppercase;
    color: #fff;
    border-radius: 21px;
    padding: 21px 30px;
    border: none !important;
    background: transparent !important;
}
.btn.skip-armo:focus,
.btn.skip-armo:focus-visible {
    outline: none;
    box-shadow: none;
}
.armo-skin .row-content,
.armo-eyes .row-content,
.armo-hair .row-content,
.armo-result .row-content {
    background: #fff;
    border-radius: 24px;
    margin-top: 150px;
    padding: 65px 48px 48px 48px;
    box-shadow: 34px 36px 30px 0px rgba(43, 43, 43, 0.05), 15px 16px 22px 0px rgba(43, 43, 43, 0.09), 4px 4px 12px 0px rgba(43, 43, 43, 0.10), 0px 0px 0px 0px rgba(43, 43, 43, 0.10);
}
.armo-result .row-content {
    position: relative;
    z-index: 3;
}
.armo-skin .row-content .steps,
.armo-eyes .row-content .steps,
.armo-hair .row-content .steps,
.armo-result .row-content .steps {
    padding-top: 0 !important;
}
.armo-skin .actions,
.armo-eyes .actions,
.armo-hair .actions,
.armo-result .actions {
    position: unset !important;
    margin-top: 36px;
}
.armo-radio-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
}
.armo-radio-container label {
    flex-grow: 1;
    flex-basis: 0;
    min-width: 0;
}
.armo-radio-container .wrapper-armo-option {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 28px 20px;
    min-height: 100%;
    border-radius: 12px;
    border: 1px solid transparent;
    cursor: pointer;
}
.armo-radio-container input[type="radio"]:checked + div {
    background: #fff !important;
}
.armo-radio-container .wrapper-armo-option img {
    width: 84px;
    height: 84px;
}
.armo-radio-container .wrapper-armo-option .text {
    color: #530006;
    text-align: center;
    font-family: 'gantari-medium';
    font-size: 14px;
    line-height: normal;
    margin-top: 16px;
}
.palette-container {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-template-rows: repeat(2, 1fr);
    grid-column-gap: 18px;
    grid-row-gap: 18px;
    justify-items: center;
    width: fit-content;
    margin: auto;
    margin-bottom: 32px;
}
.palette-container .palette-color {
    width: 100px;
    height: 100px;
    border-radius: 100%;
}
@media screen and (max-width: 991px) {
    .palette-container .palette-color {
        width: 80px;
        height: 80px;
    }
}
#app-lipstick-store .step.armo-result p.subtitle {
    font-family: 'gantari-light';
    font-size: 14px;
    font-style: italic;
    line-height: normal;
    color: #575757;
    text-align: center;
    margin-bottom: 24px;
}
.armo-result .post-palette {
    font-family: 'gantari-bold';
    font-size: 16px;
    line-height: normal;
    color: #530006;
    text-align: center;
    max-width: 550px;
    margin: auto;
}
.color-fullscreen {
    position: fixed;
    top: 0;
    left: 0;
    width: 50px;
    height: 50px;
    z-index: 10;
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    font-family: 'gantari-medium';
    font-size: 14px;
    line-height: normal;
    color: #fff;
    text-align: center;
    pointer-events: none;
    transition: all 1s;
}
.color-fullscreen.show {
    width: 100%;
    height: 100%;
    padding: 125px;
    padding-top: 60px;
    top: 0 !important;
    left: 0 !important;
    pointer-events: all;
    border-radius: 0;
}
.color-fullscreen img {
    width: 117px;
    height: 45px;    
}
.color-fullscreen * {
    opacity: 0;
    visibility: hidden;
}
.color-fullscreen.show * {
    opacity: 1;
    visibility: visible;
}

.page-template-app-lipstick-store header,
.page-template-app-face-cream-store header,
.page-template-app-foundation-store header,
.page-template-app-armocromia-store header,
.page-template-app-lip-gloss-store header {
    display: none;
}
.step .navigation .container-logo {
    display: block;
    margin: auto;
}
.step .navigation .container-logo .logo {
    width: 117px;
    height: 45px;
    filter: invert(1);
}
.step.opening .navigation .container-logo .logo,
.step.armo-result .navigation .container-logo .logo,
.step.choose-color .navigation .container-logo .logo {
    filter: none;
}
#app-lipstick-store .closing .actions a {
    display: block;
    width: fit-content;
}

@media screen and (max-height: 799px) {
    .step:not(.opening) .steps {
        padding-top: 130px;
    }
    #app-lipstick-store .step p.subtitle {
        margin-bottom: 35px;
    }
    #app-lipstick-store .choose-texture .radio-wrapper {
        padding: 28px 34px 20px 34px;
    }
    .armo-skin .row-content,
    .armo-eyes .row-content,
    .armo-hair .row-content,
    .armo-result .row-content {
        margin-top: 130px;
    }
    .armo-result .row-content {
        padding-top: 45px;
        padding-bottom: 35px;
    }
    .palette-container .palette-color {
        width: 80px;
        height: 80px;
    }

    .main-section .box-texture_crema {
        height: 190px;
    }
    .main-section .choose-texture-cream .swiper-pagination {
        top: 225px;
    }
    #app-skincare-store .step:not(.opening) h1,
    #app-foundation-store .step:not(.opening) h1 {
        line-height: normal;
    }

    #app-foundation-store .card-text-container .box-card-text {
        max-width: 276px;
        min-width: 276px;
        height: 210px;
    }
    #app-foundation-store .card-text-container .details-card-text {
        width: 270px;
        padding-top: 18px;
    }
    #app-foundation-store .card-text-container .details-card-text .description {
        line-height: 17px;
    }
    #app-skincare-store .wrapper-subquestion,
    #app-foundation-store .wrapper-subquestion {
        padding-bottom: 50px;
    }
    #app-skincare-store .wrapper-subquestion .more-info,
    #app-foundation-store .wrapper-subquestion .more-info {
        bottom: 13px;
    }
    #app-foundation-store .icon-subquestion {
        width: 40px;
        min-width: 40px;
        height: 40px;
    }
}

#app-lipstick-store .wrapper-initials,
#app-lip-gloss-store .wrapper-initials {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 12px;
    width: fit-content;
    margin: auto;
}
#app-lipstick-store .wrapper-initials label .img-wrapper,
#app-lip-gloss-store .wrapper-initials label .img-wrapper {
    width: 68px;
    height: 68px;
    border-radius: 34px;
    background: #EEEEEE;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.4s;
}
#app-lipstick-store .wrapper-initials label input[type="radio"]:checked + .img-wrapper,
#app-lip-gloss-store .wrapper-initials label input[type="radio"]:checked + .img-wrapper {
    border: none;
    background: #4C4672;
    box-shadow: none;
}
#app-lipstick-store .wrapper-initials label:not(.none) input[type="radio"]:checked + .img-wrapper img,
#app-lip-gloss-store .wrapper-initials label:not(.none) input[type="radio"]:checked + .img-wrapper img {
    mix-blend-mode: lighten;
    filter: invert(1) saturate(0) brightness(2);
}
#app-lipstick-store .wrapper-initials label.none,
#app-lip-gloss-store .wrapper-initials label.none {
    grid-column-start: 1;
    grid-column-end: 3;
}
#app-lipstick-store .wrapper-initials label.none .img-wrapper,
#app-lip-gloss-store .wrapper-initials label.none .img-wrapper {
    width: 100%;
}

/* ARMOCROMIA IN STORE */
#app-armocromia-store .opening .ellipse-1,
#app-armocromia-store .closing .ellipse-1 {
    width: 600px;
    height: 600px;
    border-radius: 300px;
    opacity: 0.5;
    background: linear-gradient(180deg, #A82FF2 0%, rgba(245, 138, 37, 0.00) 100%, #7061A3 100%);
    filter: blur(50px);
    position: absolute;
    z-index: 0;
    top: -75px;
    right: -125px;
}
#app-armocromia-store .opening .ellipse-2 {
    width: 820px;
    height: 820px;
    border-radius: 410px;
    opacity: 0.5;
    background: linear-gradient(180deg, #A57BFF 0%, rgba(246, 227, 255, 0.46) 100%);    
    filter: blur(100px);
    position: absolute;
    z-index: 0;
    top: -25px;
    right: -90px;
}
#app-armocromia-store .opening .ellipse-3 {
    width: 750px;
    height: 750px;
    border-radius: 400px;
    opacity: 0.5;
    background: linear-gradient(135deg, #44C6E2 2.88%, #0C3190 98.14%);    
    filter: blur(100px);
    position: absolute;
    z-index: 0;
    top: -75px;
    left: -100px;
}
#app-armocromia-store .opening .step-content {
    position: relative;
    z-index: 1;
}
#app-armocromia-store .opening .next-navigation {
    position: unset;
}
#app-armocromia-store .armo-card-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
    margin-top: 48px;
}
#app-armocromia-store .armo-card-container label {
    flex-grow: 1;
    flex-basis: 0;
    min-width: 0;
}
#app-armocromia-store .armo-card-container.subquestion {
    gap: 40px;
}
#app-armocromia-store .armo-card-container.subquestion label {
    flex-grow: unset;
    flex-basis: auto;
}
#app-armocromia-store .armo-card-container .wrapper-armo-option {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-height: 100%;
    border-radius: 12px;
    border: 1px solid transparent;
    cursor: pointer;
    filter: grayscale(10);
    transition: all 0.3s;
}
#app-armocromia-store .armo-card-container .wrapper-armo-option.base,
#app-armocromia-store .armo-card-container .wrapper-armo-option.selected {
    filter: none;
}
#app-armocromia-store .armo-card-container input[type="radio"]:checked + div {
    background: #fff !important;
}
#app-armocromia-store .armo-card-container .wrapper-armo-option img {
    width: 190px;
    height: 250px;
    border-radius: 125px;
    transition: all 0.3s;
}
#app-armocromia-store .armo-card-container .wrapper-armo-option.selected img {
    /* filter: drop-shadow(0px 0px 55px rgba(0, 0, 0, 0.45)); */
    box-shadow: 0px 0px 55px rgba(0, 0, 0, 0.45);
}
#app-armocromia-store .armo-card-container .wrapper-armo-option .text {
    color: #B7B7B7;
    text-align: center;
    font-family: 'gantari-bold';
    font-size: 16px;
    line-height: normal;
    text-transform: uppercase;
    margin-top: 16px;
    transition: all 0.3s;
}
#app-armocromia-store .armo-card-container .wrapper-armo-option.base .text,
#app-armocromia-store .armo-card-container .wrapper-armo-option.selected .text {
    color: #283C70;
}
#app-armocromia-store .closing p.conclusion,
#app-lip-gloss-store .closing p.conclusion {
    color: #fff;
    max-width: 500px;
}
#app-armocromia-store .step.closing img.result {
    position: absolute;
    width: 450px;
    top: 35%;
    right: 0;
    transform: translate(0, -50%);
    z-index: -1;
}
#app-armocromia-store .step.closing .row-content {
    position: relative;
    z-index: 1;
}
/* #app-armocromia-store .step.closing .actions {
    position: relative;
    top: 100px;
} */
#app-armocromia-store .closing .ellipse-1 {
    top: -300px;
    right: -125px;
}
#app-armocromia-store .closing .ellipse-2 {
    top: -200px;
    right: -100px;
}