/* ==========================================================
   ADRIOCLARO — POPUP APP V900
   ========================================================== */

.adrc-app-popup-overlay{
    position:fixed;
    inset:0;
    z-index:999999;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:24px;
    background:rgba(1,0,37,.72);

    -webkit-backdrop-filter:
        blur(9px);

    backdrop-filter:
        blur(9px);

    opacity:0;
    visibility:hidden;

    transition:
        opacity .28s ease,
        visibility .28s ease;
}

.adrc-app-popup-overlay.open{
    opacity:1;
    visibility:visible;
}

.adrc-app-popup{
    position:relative;
    width:min(860px,100%);
    overflow:hidden;
    display:grid;
    grid-template-columns:.82fr 1.18fr;
    border-radius:24px;

    background:
        linear-gradient(
            135deg,
            #02052f,
            #0b1746
        );

    box-shadow:
        0 35px 90px
        rgba(0,0,0,.40);

    transform:
        translateY(18px)
        scale(.98);

    transition:
        transform .32s
        cubic-bezier(.2,.7,.2,1);
}

.adrc-app-popup-overlay.open
.adrc-app-popup{
    transform:none;
}

.adrc-app-popup-visual{
    position:relative;
    min-height:430px;
    overflow:hidden;

    background:
        radial-gradient(
            circle at 40% 30%,
            rgba(89,112,200,.28),
            transparent 48%
        ),
        #06103a;
}

.adrc-app-popup-phone{
    position:absolute;
    width:215px;
    height:430px;
    left:50%;
    top:53%;

    transform:
        translate(-50%,-50%)
        rotate(-5deg);

    padding:8px;

    border-radius:38px;

    background:
        linear-gradient(
            135deg,
            #aaa,
            #111,
            #ddd,
            #111
        );

    box-shadow:
        0 24px 55px
        rgba(0,0,0,.45);
}

.adrc-app-popup-screen{
    width:100%;
    height:100%;
    overflow:hidden;
    border-radius:31px;

    background:#f4f6f9;
}

.adrc-app-popup-screen-top{
    height:110px;
    display:flex;
    align-items:center;
    justify-content:center;

    background:#07113d;
    color:#fff;

    font-size:15px;
    font-weight:800;
}

.adrc-app-popup-screen-body{
    padding:20px;
    color:#07113d;
}

.adrc-app-popup-screen-body
strong{
    display:block;
    margin-bottom:15px;
    font-size:19px;
}

.adrc-app-popup-screen-card{
    padding:16px;
    margin-bottom:12px;

    border-radius:15px;
    background:#fff;

    box-shadow:
        0 7px 20px
        rgba(1,0,37,.07);
}

.adrc-app-popup-screen-card
span{
    display:block;
    font-size:10px;
    color:#707588;
}

.adrc-app-popup-content{
    padding:48px 46px;
    color:#fff;
}

.adrc-app-popup-badge{
    display:inline-flex;
    align-items:center;
    gap:7px;

    margin-bottom:14px;
    padding:7px 11px;

    border-radius:30px;

    background:
        rgba(255,255,255,.10);

    border:
        1px solid
        rgba(255,255,255,.12);

    font-size:10px;
    font-weight:800;
    letter-spacing:.8px;
}

.adrc-app-popup-content
h2{
    margin:0 0 15px !important;

    color:#fff !important;

    font-size:36px !important;
    line-height:1.08 !important;
}

.adrc-app-popup-content
p{
    margin:0 0 21px;

    color:
        rgba(255,255,255,.78);

    font-size:14px !important;
    line-height:1.65 !important;
}

.adrc-app-popup-free{
    margin-bottom:24px;

    color:#fff;

    font-size:15px;
    font-weight:800;
}

.adrc-app-popup-free
span{
    display:inline-block;

    margin-right:8px;
    padding:5px 9px;

    border-radius:7px;

    background:#fff;
    color:#07113d;

    font-size:10px;
}

.adrc-app-popup-buttons{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
}

.adrc-app-popup-store{
    flex:1;
    min-width:175px;

    padding:13px 16px;

    border:
        1px solid
        rgba(255,255,255,.25);

    border-radius:10px;

    background:#050505;

    color:#fff !important;

    text-decoration:none !important;

    transition:
        transform .2s ease,
        box-shadow .2s ease;
}

.adrc-app-popup-store:hover{
    transform:
        translateY(-2px);

    box-shadow:
        0 12px 26px
        rgba(0,0,0,.25);
}

.adrc-app-popup-store
small{
    display:block;

    color:#fff;

    font-size:8px !important;
    text-transform:uppercase;
}

.adrc-app-popup-store
strong{
    display:block;
    margin-top:2px;

    font-size:16px;
}

.adrc-app-popup-close{
    position:absolute;
    z-index:10;

    top:16px;
    right:16px;

    width:38px;
    height:38px;

    display:grid;
    place-items:center;

    border:1px solid
        rgba(255,255,255,.16);

    border-radius:50%;

    background:
        rgba(255,255,255,.08);

    color:#fff;

    font-size:20px;

    cursor:pointer;
}

.adrc-app-popup-note{
    margin-top:16px;

    color:
        rgba(255,255,255,.50);

    font-size:10px;
}


/* MOBILE */

@media(max-width:700px){

    .adrc-app-popup{
        grid-template-columns:1fr;
    }

    .adrc-app-popup-visual{
        display:none;
    }

    .adrc-app-popup-content{
        padding:
            42px 26px 28px;
    }

    .adrc-app-popup-content
    h2{
        font-size:29px !important;
    }

    .adrc-app-popup-buttons{
        display:grid;
        grid-template-columns:1fr;
    }

    .adrc-app-popup-store{
        min-width:0;
    }
}