/*@import(href="https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Outfit:wght@300;400;500;600;700&display=swap" rel="stylesheet") */

*{margin:0;padding:0;box-sizing:border-box;}

:root{
  --red:#c8382a;
  --red-bright:#e84035;
  --gold:#f0c050;
  --cream:#f0ede8;
  --bg:#0d0d0d;
  --card-bg:rgba(20,20,20,.97);
  --border:rgba(240,237,232,.1);
  --muted:rgba(240,237,232,.35);
  --dimmer:rgba(240,237,232,.25);
}

html{
  scroll-behavior:smooth;
}



.atulizacao-ao-w{
  background:var(--bg);
  color:var(--cream);
  font-family:'Outfit',sans-serif;
  min-height:100vh;
  overflow-x:hidden;
  overflow-y:auto;
  z-index: 999999;
  width: 100%;
  
}

/* ── CANVAS ── */
.atulizacao-ao-w #canvas{
  position:fixed;top:0;left:0;
  width:100%;height:100%;
  z-index:0;pointer-events:none;
}

/* ── ORBS ── */
.atulizacao-ao-w .orb{position:fixed;border-radius:50%;filter:blur(120px);pointer-events:none;z-index:0;}
.atulizacao-ao-w .orb1{width:min(500px,80vw);height:min(500px,80vw);background:rgba(200,56,42,.12);top:-150px;right:-100px;}
.atulizacao-ao-w .orb2{width:min(400px,70vw);height:min(400px,70vw);background:rgba(212,160,48,.07);bottom:-100px;left:-100px;}

/* ── PAGE LAYOUT ── */
.atulizacao-ao-w .page{
  position:relative;
  z-index:10;
  min-height:100vh;
  display:flex;
  flex-direction:column;
  align-items:center;
  padding:40px 16px 60px;
  gap:32px;
}

/* ── MODAL CARD ── */
.atulizacao-ao-w .modal-wrap{
  width:100%;
  max-width:600px;
  background:var(--card-bg);
  border:1px solid var(--border);
  border-radius:28px;
  padding:clamp(28px,5vw,48px) clamp(20px,5vw,44px) clamp(28px,5vw,40px);
  text-align:center;
  backdrop-filter:blur(24px);
  box-shadow:0 32px 80px rgba(0,0,0,.6);
}

/* ── BADGE ── */
.atulizacao-ao-w .badge{
  display:inline-flex;align-items:center;gap:6px;
  padding:5px 14px;border-radius:99px;
  font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  background:rgba(200,56,42,.15);color:#e84035;
  border:1px solid rgba(200,56,42,.25);
  margin-bottom:20px;
}
.atulizacao-ao-w .badge-dot{
  width:6px;height:6px;border-radius:50%;
  background:#e84035;
  animation:blink 1.2s infinite;
}
@keyframes blink{0%,100%{opacity:1;}50%{opacity:.3;}}

/* ── LOGO ── */
.atulizacao-ao-w .logo-row{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:16px;}
.atulizacao-ao-w .logo-badge{
  width:48px;height:48px;border-radius:13px;
  background:var(--red);
  display:flex;align-items:center;justify-content:center;
  font-family:'Bebas Neue',sans-serif;font-size:20px;color:#fff;
  flex-shrink:0;
}
.atulizacao-ao-w .logo-name{font-family:'Bebas Neue',sans-serif;font-size:28px;letter-spacing:.06em;color:var(--cream);}
.atulizacao-ao-w .logo-name span{color:#e84035;}

/* ── TITLE ── */
.atulizacao-ao-w .main-title{
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(26px,7vw,44px);
  letter-spacing:.03em;line-height:.95;
  margin-bottom:10px;
  color:var(--cream);
}
.atulizacao-ao-w .main-title span{color:var(--gold);}

.atulizacao-ao-w .sub-text{
  font-size:clamp(13px,3vw,14px);
  color:rgba(240,237,232,.55);
  line-height:1.7;
  max-width:420px;
  margin:0 auto 28px;
}

/* ── COUNTDOWN ── */
.atulizacao-ao-w .countdown-wrap{
  display:flex;
  gap:clamp(6px,2vw,10px);
  justify-content:center;
  margin-bottom:32px;
  flex-wrap:wrap;
}
.atulizacao-ao-w .cd-box{
  background:rgba(240,237,232,.05);
  border:1px solid rgba(240,237,232,.09);
  border-radius:16px;
  padding:clamp(10px,3vw,14px) clamp(12px,4vw,18px);
  min-width:clamp(60px,18vw,76px);
  flex:1;
  max-width:100px;
}
.atulizacao-ao-w .cd-num{
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(30px,8vw,40px);
  letter-spacing:.04em;
  color:var(--gold);
  display:block;line-height:1;
}
.atulizacao-ao-w .cd-label{
  font-size:clamp(9px,2vw,10px);
  font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;
  color:rgba(240,237,232,.35);
  margin-top:4px;display:block;
}
.atulizacao-ao-w .cd-sep{
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(24px,6vw,36px);
  color:rgba(240,237,232,.2);
  align-self:center;padding-bottom:8px;
  flex-shrink:0;
}

/* ── PROGRESSO ── */
.atulizacao-ao-w .progress-wrap{margin-bottom:28px;}
.atulizacao-ao-w .progress-label{
  display:flex;justify-content:space-between;
  font-size:12px;color:rgba(240,237,232,.4);
  margin-bottom:6px;
}
.atulizacao-ao-w .progress-bar-bg{height:6px;background:rgba(240,237,232,.07);border-radius:99px;overflow:hidden;}
.atulizacao-ao-w .progress-bar{
  height:100%;
  background:linear-gradient(90deg,var(--red),var(--gold));
  border-radius:99px;
  transition:width .5s;
  width:0%;
}

/* ── BOTÕES ── */
.atulizacao-ao-w .btns{display:flex;flex-direction:column;gap:10px;}
.atulizacao-ao-w .btn{
  width:100%;padding:14px 20px;border-radius:99px;
  font-family:'Outfit',sans-serif;font-size:clamp(13px,3.5vw,14px);font-weight:600;
  cursor:pointer;border:none;outline:none;
  display:flex;align-items:center;justify-content:center;gap:8px;
  transition:.25s;text-decoration:none;
}
.atulizacao-ao-w .btn-primary{
  background:var(--red);color:#fff;
  font-size:clamp(13px,4vw,15px);padding:16px 20px;
  box-shadow:0 0 32px rgba(200,56,42,.25);
}
.atulizacao-ao-w .btn-primary:hover{background:var(--red-bright);box-shadow:0 0 40px rgba(200,56,42,.4);}
.atulizacao-ao-w .btn-secondary{
  background:rgba(240,237,232,.05);
  border:1px solid rgba(240,237,232,.1);
  color:rgba(240,237,232,.8);
}
.atulizacao-ao-w .btn-secondary:hover{background:rgba(240,237,232,.09);color:var(--cream);}
.atulizacao-ao-w .btn-icon{font-size:16px;flex-shrink:0;}

/* ── FOOTER ── */
.atulizacao-ao-w .footer-text{
  margin-top:22px;font-size:12px;
  color:rgba(240,237,232,.25);
  line-height:1.6;
}
.atulizacao-ao-w .footer-text a{color:rgba(240,237,232,.4);text-decoration:none;}
.atulizacao-ao-w .footer-text a:hover{color:rgba(240,237,232,.7);}

/* ── FEATURES SECTION (extra scroll content) ── */
.atulizacao-ao-w .features-section{
  width:100%;max-width:600px;
}
.atulizacao-ao-w .features-title{
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(20px,5vw,26px);
  letter-spacing:.06em;
  color:var(--cream);
  text-align:center;
  margin-bottom:16px;
}
.atulizacao-ao-w .features-title span{color:var(--gold);}

.atulizacao-ao-w .features-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:12px;
}
.atulizacao-ao-w .feature-card{
  background:rgba(20,20,20,.8);
  border:1px solid var(--border);
  border-radius:18px;
  padding:20px 16px;
  text-align:center;
  backdrop-filter:blur(12px);
  transition:.25s;
}
.atulizacao-ao-w .feature-card:hover{
  border-color:rgba(200,56,42,.3);
  background:rgba(30,20,20,.9);
  transform:translateY(-2px);
}
.atulizacao-ao-w .feature-icon{font-size:28px;margin-bottom:10px;display:block;}
.atulizacao-ao-w .feature-name{
  font-size:13px;font-weight:600;
  color:var(--cream);
  margin-bottom:4px;
}
.atulizacao-ao-w .feature-desc{
  font-size:11px;
  color:var(--muted);
  line-height:1.5;
}

/* ── SOCIALS ── */
.atulizacao-ao-w .social-section{
  width:100%;max-width:600px;text-align:center;
}
.atulizacao-ao-w .social-label{
  font-size:11px;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:var(--dimmer);
  margin-bottom:12px;
  display:block;
}
.atulizacao-ao-w .social-links{
  display:flex;flex-wrap:wrap;justify-content:center;gap:8px;
}
.atulizacao-ao-w .social-link{
  display:inline-flex;align-items:center;gap:6px;
  padding:8px 16px;border-radius:99px;
  background:rgba(240,237,232,.05);
  border:1px solid var(--border);
  color:rgba(240,237,232,.7);
  font-size:12px;font-weight:500;
  text-decoration:none;
  transition:.2s;
}
.atulizacao-ao-w .social-link:hover{
  background:rgba(200,56,42,.12);
  border-color:rgba(200,56,42,.3);
  color:var(--cream);
}

/* ── DIVIDER ── */
.atulizacao-ao-w .divider{
  width:100%;max-width:600px;
  border:none;
  border-top:1px solid var(--border);
}

/* ── RESPONSIVE TWEAKS ── */
@media(max-width:400px){
  .atulizacao-ao-w .cd-sep{display:none;}
  .atulizacao-ao-w .countdown-wrap{gap:8px;}
  .atulizacao-ao-w .cd-box{min-width:60px;}
}

@media(max-width:340px){
  .atulizacao-ao-w .modal-wrap{padding:22px 14px 24px;}
}