/*
==============================================================
 CADD PREMIUM ENTRY EXPERIENCE 5D3A2

 Login + manifestation of interest.
 Premium, selective and aspirational without false scarcity.
==============================================================
*/

:root{
    --entry-gold:#d8b46a;
    --entry-gold-light:#f0d79c;
    --entry-navy:#07111e;
    --entry-surface:rgba(8,20,34,.88);
    --entry-border:rgba(216,180,106,.22);
    --entry-text:#edf3f8;
    --entry-muted:rgba(222,231,240,.72);
}


/* ==========================================================
   SHARED CINEMATIC BACKGROUND
========================================================== */

body.cadd-login-page,
body.cadd-interest-page{
    min-height:100vh;
    min-height:100dvh;

    position:relative;

    color:var(--entry-text);

    background:
        var(--entry-navy) !important;
}


body.cadd-login-page::before,
body.cadd-interest-page::before{
    content:"";

    position:fixed;
    inset:0;

    z-index:-2;

    background-repeat:no-repeat;
    background-size:cover;
    background-position:center;

    filter:
        saturate(.78)
        brightness(.74)
        contrast(1.05);
}


body.cadd-login-page::before{
    background-image:
        linear-gradient(
            135deg,
            rgba(4,12,22,.93) 0%,
            rgba(5,16,29,.68) 48%,
            rgba(7,17,30,.90) 100%
        ),
        url("../img/home-atmosphere.webp");
}


body.cadd-interest-page::before{
    background-image:
        linear-gradient(
            135deg,
            rgba(4,12,22,.94) 0%,
            rgba(5,16,29,.72) 50%,
            rgba(7,17,30,.92) 100%
        ),
        url("../img/graduacao-atmosphere.webp");
}


body.cadd-login-page::after,
body.cadd-interest-page::after{
    content:"";

    position:fixed;
    inset:0;

    z-index:-1;

    pointer-events:none;

    background:
        radial-gradient(
            circle at 50% 15%,
            rgba(216,180,106,.10),
            transparent 34%
        ),
        linear-gradient(
            180deg,
            transparent 0%,
            rgba(7,17,30,.34) 65%,
            rgba(7,17,30,.78) 100%
        );
}


/* ==========================================================
   LOGIN
========================================================== */

body.cadd-login-page{
    display:grid;
    place-items:center;

    padding:
        max(24px, env(safe-area-inset-top))
        18px
        max(24px, env(safe-area-inset-bottom));
}


body.cadd-login-page > main.card{
    width:min(100%,520px);

    padding:
        clamp(24px,5vw,42px);

    border:
        1px solid var(--entry-border) !important;

    border-radius:
        24px !important;

    background:
        linear-gradient(
            150deg,
            rgba(13,30,48,.94),
            rgba(6,17,30,.92)
        ) !important;

    backdrop-filter:
        blur(18px)
        saturate(108%);

    -webkit-backdrop-filter:
        blur(18px)
        saturate(108%);

    box-shadow:
        0 36px 100px rgba(0,0,0,.48),
        inset 0 1px 0 rgba(255,255,255,.04);
}


.cadd-login-page .kicker{
    margin-top:22px;

    color:
        var(--entry-gold-light);

    letter-spacing:.15em;
}


.cadd-login-page h1{
    max-width:440px;

    margin:
        10px 0 14px;

    font-size:
        clamp(34px,6vw,54px);

    line-height:.98;

    letter-spacing:-.055em;
}


.cadd-login-page > main > p{
    max-width:430px;

    margin-bottom:22px;

    color:
        var(--entry-muted);

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


.cadd-login-page form{
    margin-top:22px;
}


.cadd-login-page label span{
    color:
        rgba(232,239,246,.68);

    font-size:10px;

    letter-spacing:.09em;
}


.cadd-login-page input{
    min-height:52px;

    border:
        1px solid
        rgba(216,180,106,.18) !important;

    border-radius:
        14px !important;

    background:
        rgba(4,14,25,.72) !important;

    transition:
        border-color .18s ease,
        box-shadow .18s ease;
}


.cadd-login-page input:focus{
    outline:none;

    border-color:
        rgba(216,180,106,.65) !important;

    box-shadow:
        0 0 0 3px
        rgba(216,180,106,.09);
}


.cadd-login-page form button[type="submit"]{
    min-height:54px;

    border:
        1px solid
        rgba(246,222,166,.46);

    border-radius:14px;

    background:
        linear-gradient(
            180deg,
            #efd69a,
            #d8b46a 48%,
            #b68a43
        );

    box-shadow:
        inset 0 1px 0
        rgba(255,255,255,.48),
        0 12px 32px
        rgba(177,132,53,.22);

    font-size:14px;
}


/* ==========================================================
   LOGIN INTEREST CTA
========================================================== */

.cadd-login-page .cadd-interest-entry{
    margin-top:30px;

    padding:
        22px 20px 18px;

    border:
        1px solid
        rgba(216,180,106,.13);

    border-radius:18px;

    background:
        linear-gradient(
            145deg,
            rgba(216,180,106,.055),
            rgba(10,26,43,.54)
        );
}


.cadd-login-page .cadd-interest-divider{
    color:
        var(--entry-gold-light);

    font-size:12px;
    font-weight:800;

    letter-spacing:.035em;
}


.cadd-login-page .cadd-interest-entry p{
    color:
        rgba(226,234,242,.78);

    font-size:13px;
}


.cadd-login-page .cadd-interest-button{
    min-height:54px;

    border-color:
        rgba(232,199,128,.48);

    background:
        linear-gradient(
            180deg,
            rgba(216,180,106,.13),
            rgba(216,180,106,.06)
        );

    color:
        #f0d79c;

    box-shadow:
        inset 0 1px 0
        rgba(255,255,255,.035);
}


.cadd-login-page .cadd-interest-entry small{
    line-height:1.5;
}


/* ==========================================================
   INTEREST PAGE
========================================================== */

body.cadd-interest-page{
    padding:
        max(22px, env(safe-area-inset-top))
        18px
        max(38px, env(safe-area-inset-bottom));
}


.cadd-interest-page .interest-shell{
    width:min(100%,920px);

    margin:0 auto;
}


.cadd-interest-page .interest-brand{
    margin-bottom:20px;
}


.cadd-interest-page .interest-back{
    color:
        rgba(239,215,156,.82);
}


.cadd-interest-page .interest-card{
    margin-top:18px;

    padding:
        clamp(24px,5vw,44px);

    border:
        1px solid
        var(--entry-border) !important;

    border-radius:
        24px !important;

    background:
        linear-gradient(
            150deg,
            rgba(13,30,48,.95),
            rgba(6,17,30,.93)
        ) !important;

    backdrop-filter:
        blur(18px)
        saturate(108%);

    -webkit-backdrop-filter:
        blur(18px)
        saturate(108%);

    box-shadow:
        0 34px 90px
        rgba(0,0,0,.44),
        inset 0 1px 0
        rgba(255,255,255,.04);
}


.cadd-interest-page .interest-kicker{
    color:
        var(--entry-gold-light) !important;

    letter-spacing:.15em;
}


.cadd-interest-page .interest-card h1{
    max-width:720px;

    margin:
        10px 0 14px;

    font-size:
        clamp(34px,6vw,58px);

    line-height:1;

    letter-spacing:-.055em;
}


.cadd-interest-page .interest-lead{
    max-width:700px;

    color:
        var(--entry-muted) !important;

    font-size:
        clamp(14px,2vw,16px) !important;

    line-height:1.7 !important;
}


/* ==========================================================
   VALUE PROPOSITION
========================================================== */

.interest-value-grid{
    display:grid;

    grid-template-columns:
        repeat(3,minmax(0,1fr));

    gap:10px;

    margin:
        26px 0 30px;
}


.interest-value{
    min-height:128px;

    padding:16px;

    border:
        1px solid
        rgba(216,180,106,.13);

    border-radius:16px;

    background:
        linear-gradient(
            145deg,
            rgba(216,180,106,.055),
            rgba(9,24,41,.58)
        );
}


.interest-value strong{
    display:block;

    margin-bottom:7px;

    color:
        #f0d79c;

    font-size:13px;
}


.interest-value p{
    margin:0;

    color:
        rgba(220,229,238,.72);

    font-size:12px;
    line-height:1.55;
}


/* ==========================================================
   INTEREST FORM
========================================================== */

.cadd-interest-page .interest-fields{
    display:grid;
    gap:4px;
}


.cadd-interest-page .interest-fields > label:not(.interest-consent){
    margin-top:12px;
}


.cadd-interest-page input,
.cadd-interest-page select{
    min-height:52px;

    border:
        1px solid
        rgba(216,180,106,.18) !important;

    border-radius:
        14px !important;

    background:
        rgba(4,14,25,.74) !important;

    color:#edf3f8 !important;
}


.cadd-interest-page input:focus,
.cadd-interest-page select:focus{
    outline:none;

    border-color:
        rgba(216,180,106,.62) !important;

    box-shadow:
        0 0 0 3px
        rgba(216,180,106,.09);
}


.cadd-interest-page .interest-consent{
    margin-top:18px;

    padding:14px;

    border:
        1px solid
        rgba(216,180,106,.10);

    border-radius:14px;

    background:
        rgba(5,16,28,.46);
}


.cadd-interest-page .interest-button{
    min-height:56px;

    margin-top:22px;

    border:
        1px solid
        rgba(246,222,166,.46) !important;

    border-radius:
        14px !important;

    background:
        linear-gradient(
            180deg,
            #efd69a,
            #d8b46a 48%,
            #b68a43
        ) !important;

    color:#161108 !important;

    font-weight:850;

    box-shadow:
        inset 0 1px 0
        rgba(255,255,255,.48),
        0 12px 32px
        rgba(177,132,53,.22);
}


/* ==========================================================
   SUCCESS
========================================================== */

.interest-success{
    padding:
        26px;

    border:
        1px solid
        rgba(216,180,106,.25);

    border-radius:
        18px;

    background:
        linear-gradient(
            145deg,
            rgba(216,180,106,.085),
            rgba(7,24,40,.74)
        );

    box-shadow:
        inset 0 1px 0
        rgba(255,255,255,.035);
}


.interest-success::before{
    content:"✓";

    display:grid;
    place-items:center;

    width:46px;
    height:46px;

    margin-bottom:18px;

    border:
        1px solid
        rgba(216,180,106,.45);

    border-radius:50%;

    color:
        var(--entry-gold-light);

    font-size:21px;
}


.interest-success strong{
    display:block;

    color:#fff;

    font-size:
        clamp(22px,4vw,30px);

    line-height:1.15;
}


.interest-success p{
    max-width:620px;

    margin:
        12px 0 0;

    color:
        var(--entry-muted);

    line-height:1.65;
}


/* ==========================================================
   DESKTOP
========================================================== */

@media(min-width:780px){

    .cadd-interest-page .interest-fields{
        grid-template-columns:
            repeat(2,minmax(0,1fr));

        column-gap:16px;
    }

    .cadd-interest-page .interest-consent,
    .cadd-interest-page .interest-honeypot,
    .cadd-interest-page .interest-button,
    .cadd-interest-page .interest-status{
        grid-column:1 / -1;
    }

}


/* ==========================================================
   MOBILE
========================================================== */

@media(max-width:719px){

    body.cadd-login-page{
        place-items:start center;
    }

    body.cadd-login-page > main.card{
        border-radius:20px !important;
    }

    .interest-value-grid{
        grid-template-columns:1fr;
    }

    .interest-value{
        min-height:auto;
    }

    .cadd-interest-page .interest-card{
        border-radius:20px !important;
    }

}


/* ==========================================================
   ACCESSIBILITY
========================================================== */

body.cadd-login-page :focus-visible,
body.cadd-interest-page :focus-visible{
    outline:
        2px solid
        rgba(240,215,156,.88) !important;

    outline-offset:3px !important;
}


@media(prefers-reduced-motion:reduce){

    body.cadd-login-page *,
    body.cadd-interest-page *{
        transition:none !important;
        animation:none !important;
    }

}

