/*==================================================
=            VARIABLES & RESET                     =
==================================================*/
:root{
    /* Palette */
    --clr-primary:#007afe;
    --clr-primary-dark:#0052b8;
    --clr-accent:#ff3c78;
    --clr-bg:#f1f3f7;
    --clr-bg-dark:#e2e5ec;
    --clr-text:#333333;
    --clr-heading:#222222;
    --clr-white:#ffffff;

    /* Gradients */
    --grad-primary:linear-gradient(135deg,#007afe 0%,#00c6ff 100%);
    --grad-accent:linear-gradient(135deg,#ff3c78 0%,#ff6e50 100%);

    /* Shadows (Neomorphism) */
    --shadow-soft:8px 8px 15px rgba(0,0,0,0.08),
                  -8px -8px 15px rgba(255,255,255,0.7);
    --shadow-inset:inset 4px 4px 8px rgba(0,0,0,0.1),
                   inset -4px -4px 8px rgba(255,255,255,0.7);

    /* Transitions */
    --transition-fast:all .25s ease;
    --transition-medium:all .4s cubic-bezier(.25,.8,.25,1);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
    font-family:'Nunito',sans-serif;
    color:var(--clr-text);
    background:var(--clr-bg);
    line-height:1.6;
}

/*==================================================
=            TYPOGRAPHY                            =
==================================================*/
h1,h2,h3,h4,h5,h6{
    font-family:'Oswald',sans-serif;
    color:var(--clr-heading);
    text-shadow:1px 1px 3px rgba(0,0,0,.08);
}
.section .title,
.section .subtitle{
    text-align:center;
    margin-bottom:1.5rem;
}

/*==================================================
=            GLOBAL UTILITIES                      =
==================================================*/
.bg-cover{background-size:cover;background-repeat:no-repeat;}
.gradient-primary{background:var(--grad-primary);}
.gradient-accent{background:var(--grad-accent);}
.shadow-soft{box-shadow:var(--shadow-soft);}
.shadow-inset{box-shadow:var(--shadow-inset);}
.text-white{color:#fff!important;}
.text-accent{color:var(--clr-accent);}
.mt-6{margin-top:6rem!important;}

/*==================================================
=            NAVBAR                                =
==================================================*/
.navbar{
    background:var(--clr-white);
    box-shadow:var(--shadow-soft);
    transition:var(--transition-medium);
}
.navbar-item{font-weight:600;}

.navbar-burger span{background:var(--clr-primary);}

/*==================================================
=            HERO SECTION                          =
==================================================*/
#hero{
    position:relative;
}
#hero .title,
#hero .subtitle{color:var(--clr-white);}
#hero .button{
    background:var(--clr-accent);
    border:none;
}

/*==================================================
=            BUTTONS                               =
==================================================*/
button,
.input[type='submit'],
.btn{
    display:inline-block;
    font-weight:700;
    padding:.75rem 2rem;
    border-radius:8px;
    border:none;
    background:var(--grad-primary);
    color:var(--clr-white);
    cursor:pointer;
    transition:var(--transition-fast);
    box-shadow:var(--shadow-soft);
}
button:hover,
.input[type='submit']:hover,
.btn:hover{
    transform:translateY(-2px);
    box-shadow:0 10px 20px rgba(0,0,0,.15);
}
button:active,
.btn:active{
    transform:translateY(0);
    box-shadow:var(--shadow-inset);
}

/*==================================================
=            FORMS                                 =
==================================================*/
input,textarea{
    border-radius:12px;
    background:var(--clr-bg);
    border:none;
    padding:1rem;
    width:100%;
    box-shadow:var(--shadow-inset);
    transition:var(--transition-fast);
}
input:focus,textarea:focus{outline:none;box-shadow:0 0 0 3px rgba(0,122,254,.35);}
.field:not(:last-child){margin-bottom:1.25rem;}

/*==================================================
=            CARD COMPONENT                        =
==================================================*/
.card{
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
    border-radius:20px;
    background:var(--clr-white);
    box-shadow:var(--shadow-soft);
    transition:var(--transition-medium);
    overflow:hidden;
}
.card:hover{transform:translateY(-4px);}
.card-image.image-container{
    width:100%;
    height:260px;
    overflow:hidden;
}
.card-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    margin:0 auto;
    display:block;
}
.card-content{padding:1.5rem;}

/*==================================================
=            LISTA DE RECURSOS                     =
==================================================*/
#recursos ul{list-style:none;margin:0;padding:0;}
#recursos li{margin:.5rem 0;}
#recursos a{
    color:var(--clr-primary);
    font-weight:600;
    position:relative;
    transition:var(--transition-fast);
}
#recursos a::after{
    content:'→';
    margin-left:.25rem;
    transform:translateX(-4px);
    transition:var(--transition-fast);
}
#recursos a:hover{color:var(--clr-accent);}
#recursos a:hover::after{transform:translateX(2px);}

/*==================================================
=            FOOTER                                =
==================================================*/
footer{
    padding:2rem 1rem;
    background:var(--clr-bg-dark);
    box-shadow:var(--shadow-inset);
    font-size:.9rem;
}
footer a{
    color:var(--clr-primary-dark);
    font-weight:600;
    margin:0 .3rem;
    transition:var(--transition-fast);
}
footer a:hover{color:var(--clr-accent);text-decoration:underline;}

/*==================================================
=            SOCIAL ICON STYLE (TEXT)              =
==================================================*/
footer a[href*="facebook"],
footer a[href*="x.com"],
footer a[href*="instagram"]{position:relative;padding-left:1.3rem;}
footer a[href*="facebook"]::before,
footer a[href*="x.com"]::before,
footer a[href*="instagram"]::before{
    position:absolute;left:0;top:50%;transform:translateY(-50%);
    content:'#'; /* simple glyph placeholder */
    color:var(--clr-accent);
    font-weight:700;
}

/*==================================================
=            SECTION BACKGROUNDS                   =
==================================================*/
section:nth-of-type(even){background:var(--clr-white);}
section:nth-of-type(odd){background:var(--clr-bg);}

/*==================================================
=            ANIMATIONS                            =
==================================================*/
@keyframes fadeUp{
    from{opacity:0;transform:translateY(40px);}
    to{opacity:1;transform:translateY(0);}
}
[data-animate]{opacity:0;transform:translateY(40px);transition:var(--transition-medium);}
[data-animate].active{animation:fadeUp .6s forwards;}

/*==================================================
=            SUCCESS PAGE                          =
==================================================*/
body.success-page{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:100vh;
    background:var(--grad-primary);
    color:var(--clr-white);
}
/*==================================================
=            LEGAL PAGES                           =
==================================================*/
body.privacy-page,
body.terms-page{padding-top:100px;}

/*==================================================
=            COOKIE POPUP                          =
==================================================*/
#cookiePopup{
    font-size:.9rem;
    backdrop-filter:blur(3px);
}

/*==================================================
=            RESPONSIVE                            =
==================================================*/
@media(max-width:768px){
    .navbar-menu{background:var(--clr-white);}
    .card-image.image-container{height:200px;}
}