:root{
  --primary:#ff9f1c;
  --secondary:#2ec4b6;
  --accent:#0b3d91;
  --dark:#1a1a1a;
  --light:#ffffff;
  --font:'Poppins', Arial, sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:var(--font);background:#f6f6f6;color:var(--dark);line-height:1.6;}
img{max-width:100%;height:auto;display:block;}
a{text-decoration:none;color:var(--light);}
.container{width:90%;max-width:1200px;margin:0 auto;}
.btn{display:inline-block;padding:18px 32px;border-radius:10px;font-weight:600;background:var(--primary);transition:.2s;box-shadow:0 4px 12px rgba(0,0,0,.15);}
.btn:hover{opacity:.9;transform:translateY(-2px);}
.btn-sec{background:var(--secondary);}
section{padding:64px 0;}
h1,h2,h3,h4{line-height:1.2;margin-bottom:16px;font-weight:700;}
p{margin-bottom:12px;}
ul{margin-left:24px;margin-bottom:12px;}
.hero{background:linear-gradient(135deg,var(--secondary) 0%, var(--primary) 100%);color:#fff;position:relative;overflow:hidden;}
.hero .wrap{padding:120px 0 140px;}
.hero h1{font-size:2.6rem;max-width:920px;}
.hero p{font-size:1.15rem;max-width:760px;margin:20px 0 36px;}
.hero .img-hero{position:absolute;right:3%;bottom:-10px;width:360px;opacity:.35;filter:drop-shadow(0 8px 16px rgba(0,0,0,.25));}
.badge{display:inline-block;background:var(--accent);padding:6px 14px;border-radius:999px;font-size:.8rem;margin-bottom:14px;font-weight:600;}

.grid{display:grid;gap:28px;}
.grid-3{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));}
.card{background:#fff;border-radius:18px;padding:24px;box-shadow:0 10px 28px rgba(0,0,0,.08);}
.card.ex{padding:0;overflow:hidden;}
.card.ex img{border-radius:18px;}
.depo{display:flex;gap:18px;align-items:flex-start;}
.depo img{width:64px;height:64px;border-radius:50%;object-fit:cover;}
.countdown{display:flex;gap:10px;justify-content:center;margin:24px 0 0;}
.countdown div{background:#fff;border-radius:12px;padding:12px 16px;text-align:center;min-width:70px;box-shadow:0 4px 12px rgba(0,0,0,.1);color:var(--dark);}
.countdown span{display:block;font-size:1.8rem;font-weight:700;color:var(--accent);}
.hide-countdown .countdown{display:none;}
.garantia{background:#fff;border:3px dashed var(--secondary);border-radius:18px;padding:24px;text-align:center;font-weight:500;}
.seal{width:120px;height:120px;border-radius:50%;border:6px solid var(--secondary);margin:0 auto 12px;display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--secondary);}
.faq-item{margin-bottom:16px;}
.faq-item h4{cursor:pointer;position:relative;padding-right:32px;}
.faq-item p{display:none;margin-top:8px;}
.faq-item.open p{display:block;}
.faq-item h4::after{content:'+';position:absolute;right:0;top:0;font-weight:700;}
.faq-item.open h4::after{content:'-';}
.footer{background:#111;color:#ccc;padding:42px 0;}
.footer a{color:#ccc;}
@media(max-width:768px){
  .hero .img-hero{display:none;}
  .hero h1{font-size:2rem;}
}

.selo-garantia{max-width:180px;margin:0 auto 16px;display:block;}

/* CSS extra */
.grid-hero {display:flex;align-items:center;gap:2rem;flex-wrap:wrap;}
.hero-text {flex:1 1 330px;min-width:310px}
.hero-img  {flex:1 1 400px;text-align:center}
.hero-img img{max-width:100%;height:auto}

.badge{background:#FF7A00;color:#FFF;padding:6px 12px;
        margin-top: 25px;
       border-radius:20px;font-size:.875rem;font-weight:600}
.pulse{animation:pulse 1.6s infinite}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.07)}}

.badge--success{
  background: linear-gradient(135deg,#00C853,#2ECC71); /* verde chamativo */
  color:#fff;
  box-shadow:0 8px 20px rgba(0,0,0,.18);
  letter-spacing:.2px;
}

.badge--contrast{
  background:#111;            /* opção super contrastante */
  color:#fff;
  box-shadow:0 10px 24px rgba(0,0,0,.22);
  border:1px solid rgba(255,255,255,.18);
}

.preco{color:#FF7A00}
.btn.cta{background:#FF7A00;color:#FFF;font-size:1.125rem;padding:12px 28px}
.btn.cta:hover{filter:brightness(1.1)}

.countdown{margin-top:14px;font-size:1rem;font-weight:600;color:#333}
.countdown span{background:#FFE6CC;padding:4px 6px;border-radius:6px}

/* Banner topo “Só hoje: promoção 9,90” */
.promo-top {
    width: 100%;
    background: #ffcc00;          /* amarelo chamativo */
    color: #000;                  /* texto escuro p/ contraste */
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    text-align: center;
    padding: 8px 0;
    position: fixed;              /* sempre visível */
    top: 0;
    left: 0;
    z-index: 9999;                /* acima de tudo */
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    font-size: 1.15rem;          /* maior */
    text-transform: uppercase;   /* CAIXA-ALTA */
    letter-spacing: .5px;        /* espaço entre letras */
}

.hero-text h1,
.hero-text h1 span.preco {
    color: #fff;              /* branco puro */
    text-shadow: 0 1px 3px rgba(0,0,0,.35); /* leve contorno p/ destacar */
}

.hero-text .preco    { color:var(--accent); }

.social-proof { padding: 48px 0; background:#fff; }
.social-proof .sp-banner{ width:100%; border-radius:18px; box-shadow:0 10px 24px rgba(0,0,0,.10); margin-bottom:28px; }

.sp-grid{
  display:grid; gap:22px; grid-template-columns:repeat(auto-fit, minmax(260px,1fr));
}
.sp-item{
  background:#fafafa; border-radius:16px; padding:16px; text-align:center;
  box-shadow:0 6px 16px rgba(0,0,0,.06);
}
.sp-item img{ max-width:280px; margin:0 auto 10px; display:block; }

.sp-deps{
  margin-top:28px; display:grid; gap:18px; grid-template-columns:repeat(auto-fit, minmax(280px,1fr));
}
.dep{
  background:#fff; border:1px solid #eee; border-radius:16px; padding:16px; display:flex; gap:14px;
  box-shadow:0 8px 18px rgba(0,0,0,.05);
}
.dep-avatar{
  width:42px; height:42px; border-radius:50%; background:#0b3d91; color:#fff; display:flex;
  align-items:center; justify-content:center; font-weight:700;
}
.dep-text{ font-weight:500; }
.dep-meta{ color:#666; }

.ps-grid { 
  display:grid; 
  grid-template-columns:repeat(auto-fit, minmax(280px,1fr)); 
  gap:22px; 
}

.ps-card {
  border:1px solid #eee; 
  border-radius:16px; 
  overflow:hidden; 
  background:#fff; 
  box-shadow:0 18px 40px rgba(0,0,0,.06);
}

.ps-shot {
  height: 220px;              /* defina a altura que preferir */
  overflow: hidden;
  background:#000;            /* bordas “sumidas” em telas escuras */
}

.ps-shot img{
  width:100%;
  height:100%;
  object-fit: cover;          /* recorta centralizado para preencher bem */
  object-position: center;    /* dá pra usar "top" se quiser priorizar o topo do print */
  display:block;
}

/* Mostra estrelas/nome em linha */
.ps-head { display:flex; align-items:center; gap:8px; margin-bottom:6px; }
.ps-stars { letter-spacing:2px; }