*{box-sizing:border-box}
body{margin:0;font-family:Inter,Arial,sans-serif;color:#444; background-color: #fafafa;}
.container{width:min(1120px,90%);margin:auto}

.header{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    z-index:10;
}
.header.inter{
    background: #df3737;
}

.nav{
    max-width:1280px;
    margin:auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:18px 0;
}

.logo{
    width:120px;
    height:auto;
}

nav{
    display:flex;
    align-items:center;
    gap:28px;
}

nav a{
    color:#fff;
    text-decoration:none;
    font-size:16px;
    font-weight:500;
    transition:.3s;
}

nav a:hover{
    opacity:.7;
}

.btn{
    background:#ed4b4b;
    color:#fff;
    text-decoration:none;
    padding:12px 32px;
    border-radius:30px;
    font-size:13px;
    font-weight:600;
}

.hero{
    width:100%;
    height:min(65vw,920px);
    overflow:hidden;
}

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



.premios{
    text-align:center;
    padding:58px 0 70px;
}

.premios h1{
    color:#595a59;
    font-size:38px;
    line-height:1.18;
    font-weight:700;
    margin-bottom:48px;
}

.premios-grid{
    width:820px;
    max-width:100%;
    margin:auto;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px 45px;
}

.box-premio{
    position:relative;
    overflow:hidden;
    min-height:270px;
    display:flex;
    justify-content:center;
    align-items:center;
}

.gold{
    background:linear-gradient(180deg,#744a24 20%,#dcc181 100%);
    color:#fff;
}

.box-daily{
    border-radius: 15px;
    clip-path: polygon(0 0, 100% 0, 100% 80%, 5% 100%, 0 100%);
    flex-direction: column;
    justify-content: flex-start;
    padding: 32px 45px;
    text-align: left;
}

.line{
    display:flex;
    gap:14px;
    width:100%;
    margin-bottom:22px;
}

.line svg{
    width:25px;
    height:25px;
    margin-top:2px;
    filter:none;
    fill: #00ce00;
}

.line h2{
    margin:0;
    color:#fff;
    font-size:28px;
    line-height:1.03;
    letter-spacing:-.5px;
}

.line h2 strong{
    color:#f4ca00;
}

.line p{
    margin:8px 0 0;
    font-size:14px;
    line-height:1.25;
    font-weight:600;
}

.box-500{
    border-radius: 15px;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 95% 100%, 0 80%);
    flex-direction:column;
}

.box-500 small{
    font-size:18px;
    font-weight:700;
    color: #ffdb17;
}

.box-500 strong{
    font-size:135px;
    line-height:.9;
    font-weight:900;
    background:linear-gradient(#ffdb17 50%,#a07d4c 100%);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}

.box-500 p{
    margin-top:5px;
    text-align:center;
    font-size:20px;
    line-height:1.15;
    font-weight:700;
}

.destaque{
    min-height:310px;
    background:#fff;
    color:#16c331;
    margin-top:-50px;
    position:relative;
    border:none;
    overflow:hidden;
    clip-path:polygon(0 20%, 95% 0, 100% 0, 100% 100%, 0 100%);
}

/* borda acompanha o mesmo recorte */
.destaque::before{
    content:"";
    position:absolute;
    inset:0;
    background: linear-gradient(180deg,rgba(134, 113, 10, 1) 0%, rgba(255, 215, 0, 1) 50%, rgba(172, 146, 0, 1) 100%);
    clip-path:inherit;
    z-index:0;
    border-radius: 15px;
}

.destaque::after{
    content:"";
    position:absolute;
    inset:7px;
    background:#fff;
    clip-path:inherit;
    z-index:1;
    border-radius: 15px;
}

.destaque > *{
    position:relative;
    z-index:2;
}

.green{
    clip-path:polygon(0 0, 5% 0, 100% 20%, 100% 100%, 0 100%);
}

.green::after{
    background:#fff;
}

.money{
    display:flex;
    align-items:baseline;
    justify-content:center;
    gap: 6px;
}

.money span{
    font-size:45px;
    font-weight:800;
    background: linear-gradient(180deg,rgba(134, 113, 10, 1) 0%, rgba(255, 215, 0, 1) 50%, rgba(172, 146, 0, 1) 100%);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}

.green .money span{
    font-size:65px;
    background: linear-gradient(180deg,#1cba1d 0%, #03e601 50%, #1cba1d 100%);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}

.money strong{
    font-size:145px;
    line-height:.75;
    letter-spacing:-6px;
    font-weight: 900;
    background: linear-gradient(180deg,rgba(134, 113, 10, 1) 0%, rgba(255, 215, 0, 1) 50%, rgba(172, 146, 0, 1) 100%);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}

.money .mil{
    font-size:58px;
    background: linear-gradient(180deg,rgba(134, 113, 10, 1) 0%, rgba(255, 215, 0, 1) 50%, rgba(172, 146, 0, 1) 100%);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    position: relative;
}
.money .mil svg{
    position: absolute;
    top: -30px;
    left: 5px;
    width: 45px;
    height: 45px;
    margin-top: 2px;
    filter: none;
    fill: #00ce00;
}

.green .money strong{
    background: linear-gradient(180deg,#1cba1d 0%, #03e601 50%, #1cba1d 100%);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}

.green .money .mil{
    background: linear-gradient(180deg,#1cba1d 0%, #03e601 50%, #1cba1d 100%);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    margin-left: 10px;
    position: relative;
}
.green .money .mil svg{
    position: absolute;
    top: -30px;
    left: 5px;
    width: 45px;
    height: 45px;
    margin-top: 2px;
    filter: none;
    fill: #c2a11f;
}

.destaque p{
    position:absolute;
    width:100%;
    left:0;
    bottom:60px;
    text-align:center;
    margin:0;
    font-size:46px;
    line-height:1;
    font-weight:700;
    color:#1dbb1d;
}

.green p{
    max-width:90%;
    left:5%;
    font-size:25px;
    color: #c2a11f;
}

.campaign{
    background:url('../images/banner.jpg') top center no-repeat;
    background-size: cover;
    padding: 120px 0;
    color: #ffffff;
}
.campaign h2{color:#f7d52a;font-size:48px; margin: 0;}
.campaign p { font-size: 26px; }
.campaign span { font-size: 26px; }

.chances{
    text-align:center;
    padding:80px 0;
    position:relative;
    overflow:hidden;
}
.chances h2{
    font-size:66px;
    color:#c7a52c;
    background: linear-gradient(180deg,rgba(134, 113, 10, 1) 0%, rgba(255, 215, 0, 1) 50%, rgba(172, 146, 0, 1) 100%);
    background-clip: border-box;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight:400;
    margin-top: 0;
}
.chances p{
    font-size: 28px;
    color: #595a59;
    font-weight: 600;
    margin-top: 100px;
}

.parceiros {
  display: grid;
  grid-template-columns: repeat(2, minmax(150px, 250px));
  justify-content: center;
  align-items: center;
  gap: 60px;
}

.parceiros img {
  width: 100%;
  height: auto;
  object-fit: contain;
}

.decor{ 
    position:absolute;
    max-width:220px;
    top: 0%;
}
.decor.top{
    top: 35%;
}
.left{
    left:-20px;
}
.right{
    right:-20px;
}

.app{
    background:#8a5d18;
    color:white;
    border-radius:25px;
    padding:60px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    position: relative;
    box-shadow: 0px 10px 10px rgba(0,0,0,.3);
}
.app a{
    text-decoration: none;
}
.app div{
    max-width: 450px;
}
.app h2{
    font-size: 36px;
    font-weight: 600;
}
.app p{
    font-size: 26px;
    line-height: 36px;
}
.app div img{
    max-width:160px;
    transform: scale(1);
    transition: all ease-out .3s;
}
.app div a:hover img{
    transform: scale(1.1);
    transition: all ease-out .3s;
}
.app .celular{
    max-height:450px;
    max-width:none;
    position: absolute;
    right: 20%;
    top: 30px;
}

/* Footer */
.footer {
    background: #df3737;
    color: #fff;
    padding: 55px 0 35px;
    margin-top: 70px;
}

.footer-container {
    width: 80%;
    margin: 0 auto;
}

.footer-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
}

.footer-logo {
    width: 130px;
    height: auto;
}

.footer-menu {
    display: flex;
    align-items: center;
    gap: 35px;
}

.footer-menu a,
.footer-social a {
    color: #fff;
    text-decoration: none;
}

.footer-social {
    display: flex;
    gap: 12px;
}

.footer-social a{
    display: inline-block;
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.3);
    color: #fff;
    font-size: 14px;
    margin-left: 15px;
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.footer-social i {
    font-size: 16px;
}

.footer-copy {
    margin: 70px 0 0;
    text-align: center;
    font-size: 10px;
}


@media(max-width:700px){
    nav{
        display:none;
    }
    .premios-grid{
        grid-template-columns:1fr;
    }
    .chances h2{
        font-size:38px;
        margin-top: 0px;
    }
    .app{
        flex-direction:column;
    }
    .box-daily, .box-500{
        clip-path: none;
    }
    .destaque, .green{
        clip-path: none;
        margin-top: 0px;
    }
    .decor, .app .celular{
        display: none;
    }
    .footer-top{
        display: block;
    }
    .footer-menu{
        display: block;
    }
    .footer-menu a{
        display: block;
        margin: 15px 0px;
    }
}

/* Páginas internas */
.page{
    padding:160px 0 80px;
    min-height:650px;
}

.internal-page h1{
    text-align:center;
    color:#595a59;
    font-size:42px;
    margin-bottom:45px;
}

.page-content{
    background:#fff;
    max-width:850px;
    margin:auto;
    padding:45px;
    border-radius:20px;
    box-shadow:0 10px 30px rgba(0,0,0,.08);
}

.page-content h2{
    color:#16c331;
    margin-top:0;
    font-size:28px;
}

.page-content h3{
    color:#595a59;
    margin-top:35px;
}

.page-content p,
.page-content li{
    font-size:17px;
    line-height:1.7;
}

.page-content li{
    margin-bottom:10px;
}

.winner-box{
    margin-top:30px;
    padding:25px;
    border-radius:15px;
    background:#fafafa;
    text-align:center;
}

@media(max-width:768px){
    .page{
        padding:120px 0 50px;
    }
    .page-content{
        padding:25px;
    }
}

/* páginas internas */
.header.internal{background:#18b91f}
.internal-page{padding-top:110px;min-height:100vh;background:#fafafa}
.internal-banner{width:100%;height:260px;overflow:hidden}.internal-banner img{width:100%;height:100%;object-fit:cover}
.internal-content{padding:60px 0}
.internal-content h1{text-align:center;font-size:42px;color:#555;margin:0 0 20px}
.internal-content p.lead,.internal-content>p{text-align:center;font-size:18px;max-width:850px;margin:0 auto 15px;line-height:1.6}
.pdf-box{margin:40px auto;max-width:900px;height:700px;background:#fff;border-radius:10px;overflow:hidden;box-shadow:0 10px 30px #0001}
.pdf-box h3{ padding: 15px; }
.pdf-box iframe{width:100%;height:100%;border:0}
.accordion{max-width:850px;margin:45px auto}.accordion-item{background:#fff;border-radius:18px;margin-bottom:15px;overflow:hidden;box-shadow:0 10px 25px #0001}.accordion button{width:100%;border:0;background:none;padding:25px;text-align:left;font-size:20px;font-weight:700;cursor:pointer;color:#555;display:flex;justify-content:space-between}.accordion-body{display:none;padding:0 25px 25px;line-height:1.6}.accordion-item.active .accordion-body{display:block}.accordion-item.active i{transform:rotate(180deg)}.highlight{text-align:center;color:#18b91f;margin-top:40px}
.prizes-grid,.winners-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:50px}.prize-card,.winner-card{background:#fff;border-radius:24px;padding:30px;text-align:center;box-shadow:0 12px 30px #0001;transition:.3s}.prize-card:hover,.winner-card:hover{transform:translateY(-8px)}
.prize-card img,.winner-card img{height:200px;max-width:100%;object-fit:contain}.prize-card h2,.winner-card h2{color:#555}.prize-card strong,.winner-card strong{display:block;color:#18b91f;font-size:22px}.reveal{animation:fadeUp .8s ease both}@keyframes fadeUp{from{opacity:0;transform:translateY(25px)}to{opacity:1;transform:none}}
@media(max-width:768px){.internal-page{padding-top:90px}.internal-banner{height:160px}.internal-content{padding:35px 0}.internal-content h1{font-size:32px}.prizes-grid,.winners-grid{grid-template-columns:1fr}.pdf-box{height:500px}nav{gap:12px;flex-wrap:wrap}.nav{padding:15px}.logo{width:100px}}


.winner-filter{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:12px;
    margin:45px auto 10px;
}

.winner-filter button{
    border:2px solid #18b91f;
    background:#fff;
    color:#555;
    border-radius:30px;
    padding:12px 24px;
    cursor:pointer;
    font-size:16px;
    font-weight:700;
    transition:.3s;
}

.winner-filter button:hover,
.winner-filter button.active{
    background:#18b91f;
    color:#fff;
}

.winner-item{
    opacity:1;
    transform:scale(1);
    transition:opacity .35s ease, transform .35s ease;
}

.winner-item.hide{
    opacity:0;
    transform:scale(.92);
    pointer-events:none;
    position:absolute;
}

@media(max-width:768px){
    .winner-filter{
        flex-direction:column;
        padding:0 20px;
    }

    .winner-filter button{
        width:100%;
    }
}


/* =========================
   ANIMACOES DO HOTSITE
========================= */

html{
    scroll-behavior:smooth;
}

.hero-animated{
    position:relative;
}

.hero-animated img{
    animation:heroZoom 12s ease-out infinite alternate;
}

@keyframes heroZoom{
    from{transform:scale(1)}
    to{transform:scale(1.06)}
}

.hero-overlay-shapes span{
    position:absolute;
    border-radius:50%;
    background:rgba(255,255,255,.12);
    filter:blur(2px);
    animation:floatShape 8s ease-in-out infinite;
}

.hero-overlay-shapes span:nth-child(1){
    width:180px;height:180px;
    right:12%;
    top:20%;
}

.hero-overlay-shapes span:nth-child(2){
    width:80px;height:80px;
    left:15%;
    top:30%;
    animation-delay:2s;
}

.hero-overlay-shapes span:nth-child(3){
    width:120px;height:120px;
    right:30%;
    bottom:15%;
    animation-delay:4s;
}

@keyframes floatShape{
    0%,100%{transform:translateY(0)}
    50%{transform:translateY(-25px)}
}

.scroll-indicator{
    position:absolute;
    bottom:10px;
    left:50%;
    transform:translateX(-50%);
    color:#fff;
    text-align:center;
    z-index:2;
    animation:indicatorFloat 2s infinite;
}

.scroll-indicator p{
    font-size:12px;
    margin:12px 0 0;
    font-weight:600;
}

.mouse{
    width:28px;
    height:45px;
    border:2px solid #fff;
    border-radius:20px;
    margin:auto;
    position:relative;
}

.mouse span{
    position:absolute;
    width:5px;
    height:10px;
    background:#fff;
    border-radius:10px;
    left:50%;
    top:8px;
    transform:translateX(-50%);
    animation:mouseScroll 1.8s infinite;
}

@keyframes mouseScroll{
    0%{opacity:0;transform:translate(-50%,0)}
    40%{opacity:1}
    100%{opacity:0;transform:translate(-50%,15px)}
}

@keyframes indicatorFloat{
    50%{margin-bottom:8px}
}

/* entrada por scroll */
.animate-item{
    opacity:0;
    transform:translateY(40px);
    transition:opacity .8s ease, transform .8s ease;
}

.animate-item.visible{
    opacity:1;
    transform:none;
}

.delay-1{transition-delay:.15s}
.delay-2{transition-delay:.3s}
.delay-3{transition-delay:.45s}

/* contadores */
.counter{
    display:inline-block;
}

.count-animation{
    animation:numberPulse .7s ease;
}

@keyframes numberPulse{
    50%{transform:scale(1.12)}
}

/* paralax */
.parallax{
    transform:translateY(var(--parallax-offset,0));
    transition:transform .1s linear;
}

/* troca de filtros */
.winner-item{
    transition:opacity .4s ease, transform .4s ease, height .4s ease;
}

/* ===== Sistema de animações por rolagem ===== */
.reveal-scroll{
    opacity:0;
    filter:blur(14px);
    transform:translateY(45px) scale(.97);
    transition:opacity .8s ease, filter .8s ease, transform .8s ease;
    will-change:opacity,transform,filter;
}

.reveal-scroll.visible{
    opacity:1;
    filter:blur(0);
    transform:translateY(0) scale(1);
}

.reveal-scroll.out-view{
    opacity:.35;
    filter:blur(6px);
    transform:translateY(-25px) scale(.98);
}

/* Entrada escalonada dos cards */
.reveal-delay-1{transition-delay:.12s}
.reveal-delay-2{transition-delay:.24s}
.reveal-delay-3{transition-delay:.36s}
.reveal-delay-4{transition-delay:.48s}

/* Hero preservado independente do scroll reveal */
.hero{
    position:relative;
}
.hero img{
    animation:heroZoom 18s ease-in-out infinite alternate;
}
@keyframes heroZoom{
    from{transform:scale(1)}
    to{transform:scale(1.08)}
}

/* Parallax */
.parallax-scroll{
    transition:transform .1s linear;
}

/* Contadores */
[data-counter]{
    display:inline-block;
}

@media(max-width:768px){
    .hero img{animation-duration:24s}
    .reveal-scroll{transform:translateY(25px) scale(.98);filter:blur(8px)}
}

/* Loader trevo */

.page-loader{
    position:fixed;
    inset:0;
    background:#fff;
    z-index:99999;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    transition:opacity .6s ease,visibility .6s ease;
}
.page-loader img{
    width:90px;
    animation:trevoLoad 1.2s ease-in-out infinite;
}
.page-loader span{
    width:80px;
    height:4px;
    margin-top:25px;
    border-radius:20px;
    background:#18b91f;
    animation:loadBar 1s ease infinite;
}
.page-loaded .page-loader{
    opacity:0;
    visibility:hidden;
}
@keyframes trevoLoad{
    0%,100%{transform:scale(.8) rotate(0)}
    50%{transform:scale(1.05) rotate(12deg)}
}
@keyframes loadBar{
    0%{transform:scaleX(.3)}
    50%{transform:scaleX(1)}
    100%{transform:scaleX(.3)}
}