.cfcmp-overlay,
.cfcmp-overlay *{box-sizing:border-box}

.cfcmp-overlay{
    position:fixed;
    inset:0;
    z-index:999999;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:18px;
    background:rgba(16,17,43,.46);
    opacity:0;
    visibility:hidden;
    transition:opacity .22s ease,visibility .22s ease;
    font-family:Inter,"Open Sans",Arial,sans-serif;
}

.cfcmp-overlay.is-open{
    opacity:1;
    visibility:visible;
}

.cfcmp-dialog{
    position:relative;
    width:min(820px,calc(100vw - 36px));
    min-height:430px;
    max-height:calc(100vh - 36px);
    display:grid;
    grid-template-columns:47% 53%;
    background:#fff;
    border-radius:10px;
    box-shadow:0 18px 55px rgba(0,0,0,.18);
    overflow:hidden;
    transform:translateY(10px) scale(.992);
    transition:transform .22s ease;
}

.cfcmp-overlay.is-open .cfcmp-dialog{
    transform:translateY(0) scale(1);
}

.cfcmp-media{
    position:relative;
    min-height:430px;
    background:#0c5f9f;
    overflow:hidden;
}

.cfcmp-media img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
}

.cfcmp-placeholder{
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:14px;
    padding:30px;
    color:#fff;
    background:
      linear-gradient(145deg,rgba(255,255,255,.06),rgba(255,255,255,0)),
      linear-gradient(145deg,#247eb7,#0c5b98 56%,#0b4779);
    font-size:29px;
    line-height:.98;
    font-weight:700;
    letter-spacing:-.7px;
}

.cfcmp-placeholder-mark{
    font-size:76px;
    line-height:1;
    font-weight:300;
}

.cfcmp-content{
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:34px 32px 30px;
    background:#fff;
    color:#17133f;
}

.cfcmp-content h2{
    margin:0 40px 20px 0;
    color:#17133f;
    font-size:40px;
    line-height:1.06;
    letter-spacing:-1px;
    font-weight:650;
}

.cfcmp-intro{
    margin:0 0 20px;
    color:#2a264b;
    font-size:17px;
    line-height:1.52;
    font-weight:400;
}

.cfcmp-body{
    margin:0 0 23px;
    color:#2a264b;
    font-size:17px;
    line-height:1.55;
}

.cfcmp-body p{margin:0}
.cfcmp-body strong{font-weight:700;color:#17133f}

.cfcmp-cta{
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    min-height:54px;
    padding:12px 18px;
    border-radius:3px;
    background:#ff7900;
    color:#fff!important;
    text-decoration:none!important;
    font-size:20px;
    line-height:1.2;
    font-weight:650;
    text-align:center;
    transition:transform .18s ease,filter .18s ease,box-shadow .18s ease;
}

.cfcmp-cta:hover,
.cfcmp-cta:focus{
    color:#fff!important;
    filter:brightness(.97);
    transform:translateY(-1px);
    box-shadow:0 7px 18px rgba(255,121,0,.16);
}

.cfcmp-close{
    position:absolute;
    z-index:4;
    top:14px;
    right:14px;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:28px!important;
    height:28px!important;
    min-width:0!important;
    min-height:0!important;
    border:0!important;
    border-radius:0!important;
    outline:0!important;
    padding:0!important;
    margin:0!important;
    background:transparent!important;
    color:#17133f!important;
    font-family:Arial,sans-serif!important;
    font-size:25px!important;
    line-height:1!important;
    font-weight:300!important;
    cursor:pointer;
    box-shadow:none!important;
    text-shadow:none!important;
    appearance:none!important;
    -webkit-appearance:none!important;
    transition:opacity .18s ease,transform .18s ease;
}

.cfcmp-close:hover,
.cfcmp-close:focus,
.cfcmp-close:active{
    border:0!important;
    border-radius:0!important;
    outline:0!important;
    background:transparent!important;
    color:#17133f!important;
    box-shadow:none!important;
    opacity:.68;
    transform:scale(.96)!important;
}

body.cfcmp-lock{overflow:hidden}

@media (max-width: 767px){
    .cfcmp-overlay{
        align-items:flex-start;
        padding:12px;
        overflow:auto;
    }

    .cfcmp-dialog{
        width:100%;
        max-width:480px;
        min-height:0;
        max-height:none;
        margin:auto 0;
        grid-template-columns:1fr;
        border-radius:9px;
        overflow:hidden;
    }

    .cfcmp-media{
        min-height:0;
        height:230px;
    }

    .cfcmp-content{
        padding:26px 20px 22px;
    }

    .cfcmp-content h2{
        margin:0 0 15px;
        font-size:31px;
        line-height:1.08;
        letter-spacing:-.6px;
    }

    .cfcmp-intro,
    .cfcmp-body{
        font-size:16px;
        line-height:1.52;
    }

    .cfcmp-intro{margin-bottom:16px}
    .cfcmp-body{margin-bottom:19px}

    .cfcmp-cta{
        min-height:52px;
        font-size:18px;
    }

    .cfcmp-close{
        top:10px;
        right:10px;
        width:26px!important;
        height:26px!important;
        font-size:24px!important;
        line-height:1!important;
    }
}

@media (max-width: 420px){
    .cfcmp-overlay{padding:8px}
    .cfcmp-media{height:205px}
    .cfcmp-content{padding:23px 17px 18px}
    .cfcmp-content h2{font-size:29px}
    .cfcmp-intro,.cfcmp-body{font-size:15px}
    .cfcmp-cta{font-size:17px;min-height:50px}
    .cfcmp-placeholder{font-size:24px;gap:10px;padding:20px}
    .cfcmp-placeholder-mark{font-size:62px}
}
