/* =====================================================================
   Evil Goods — landing amarela/retrô premium (es-MX, COD)
   Escopo: .evil (não afeta o resto do tema Lumé)
   ===================================================================== */
.evil {
  --y:#F4C400; --y2:#E3A600; --ink:#1c1606; --org:#F2691B;
  --cream:#FFF8E6; --line:#eadfb8; --txt:#33301f; --soft:#6b6650;
  --rad:16px; --sh:0 6px 26px rgba(0,0,0,.10); --sh-sm:0 2px 10px rgba(0,0,0,.07);
  font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  color:var(--txt); line-height:1.55; overflow-x:hidden;
}
.evil * { box-sizing:border-box; }
.evil img { max-width:100%; display:block; }
.evil h1,.evil h2,.evil h3 { color:var(--ink); letter-spacing:-.02em; margin:0 0 .4em; }

.evil-top {
  background:var(--ink); color:var(--y); text-align:center;
  font-weight:800; font-size:13px; letter-spacing:.5px; padding:11px 14px;
}

/* HERO */
.evil-hero {
  display:grid; grid-template-columns:1fr 1fr; gap:30px; align-items:center;
  max-width:1100px; margin:0 auto; padding:34px 18px;
}
.evil-hero__media img { border-radius:var(--rad); box-shadow:var(--sh); width:100%; }
.evil-eyebrow { display:inline-block; background:var(--ink); color:var(--y); font-weight:800;
  font-size:12px; letter-spacing:1px; padding:6px 12px; border-radius:999px; margin-bottom:12px; }
.evil-hero__buy h1 { font-size:clamp(26px,4.2vw,42px); font-weight:900; line-height:1.08; }
.evil-hero__buy h1 span { color:var(--y2); }
.evil-stars { font-size:15px; color:#b8860b; font-weight:700; margin:8px 0 14px; }
.evil-stars b { color:var(--ink); }
.evil-bul { list-style:none; padding:0; margin:0 0 16px; display:grid; gap:9px; }
.evil-bul li { font-size:16px; }
.evil-pricerow { display:flex; align-items:center; gap:12px; margin-bottom:16px; }
.evil-pricerow .now { font-size:34px; font-weight:900; color:var(--ink); }
.evil-pricerow .old { font-size:19px; color:#999; text-decoration:line-through; }
.evil-pricerow .save { background:var(--org); color:#fff; font-weight:800; padding:4px 10px; border-radius:8px; font-size:14px; }

.evil-btn {
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  background:var(--ink); color:var(--y); font-weight:900; letter-spacing:.4px;
  text-decoration:none; border:none; cursor:pointer; border-radius:12px;
  padding:16px 26px; font-size:16px; transition:transform .12s ease, box-shadow .12s ease;
  box-shadow:0 6px 0 var(--y2);
}
.evil-btn:hover { transform:translateY(-2px); }
.evil-btn:active { transform:translateY(2px); box-shadow:0 2px 0 var(--y2); }
.evil-btn--xl { font-size:18px; padding:18px 30px; }
.evil-btn--full { width:100%; }
.evil-mini { font-size:13px; color:var(--soft); margin-top:10px; text-align:center; }

/* PILLS */
.evil-pills { display:flex; flex-wrap:wrap; justify-content:center; gap:10px;
  background:var(--cream); padding:18px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.evil-pills span { background:#fff; border:1px solid var(--line); border-radius:999px;
  padding:8px 14px; font-size:13px; font-weight:700; box-shadow:var(--sh-sm); white-space:nowrap; }

/* OFERTA */
.evil-oferta { max-width:640px; margin:0 auto; padding:40px 18px; text-align:center; }
.evil-step { display:flex; align-items:center; justify-content:center; gap:8px; margin-bottom:16px; }
.evil-step span { width:30px; height:30px; border-radius:50%; display:grid; place-items:center;
  font-weight:800; background:#eee; color:#999; }
.evil-step span.on { background:var(--org); color:#fff; }
.evil-step i { width:46px; height:3px; background:#eee; border-radius:2px; }
.evil-oferta h2 { font-size:clamp(28px,5vw,40px); font-weight:900; }
.evil-oferta h2 span { color:var(--org); }
.evil-oferta__sub { color:var(--soft); margin-bottom:22px; font-weight:600; }

.evil-tiers { display:grid; gap:12px; margin-bottom:18px; text-align:left; }
.evil-tier { position:relative; display:flex; align-items:center; gap:14px;
  background:#fff; border:2px solid var(--line); border-radius:var(--rad);
  padding:18px 18px 18px 16px; cursor:pointer; box-shadow:var(--sh-sm); transition:border-color .15s, box-shadow .15s; }
.evil-tier input { position:absolute; opacity:0; pointer-events:none; }
.evil-tier.is-sel { border-color:var(--org); box-shadow:0 0 0 3px rgba(242,105,27,.15),var(--sh); }
.evil-tier.is-pop { border-color:var(--y2); }
.evil-tier__tag { position:absolute; top:-11px; left:16px; background:var(--org); color:#fff;
  font-size:11px; font-weight:900; letter-spacing:.5px; padding:4px 10px; border-radius:999px; }
.evil-tier__radio { width:24px; height:24px; border-radius:50%; border:2px solid #ccc; flex:0 0 auto; position:relative; }
.evil-tier.is-sel .evil-tier__radio { border-color:var(--org); }
.evil-tier.is-sel .evil-tier__radio::after { content:""; position:absolute; inset:4px; border-radius:50%; background:var(--org); }
.evil-tier__body { flex:1; }
.evil-tier__body strong { display:block; font-size:16px; color:var(--ink); font-weight:900; }
.evil-tier__body small { color:var(--soft); font-size:13px; }
.evil-tier__price { text-align:right; }
.evil-tier__price b { display:block; font-size:21px; font-weight:900; color:var(--ink); }
.evil-tier__price s { font-size:13px; color:#aaa; }

.evil-seals { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-top:24px; }
.evil-seals div { background:var(--cream); border:1px solid var(--line); border-radius:12px; padding:14px 8px; text-align:center; }
.evil-seals span { font-size:24px; }
.evil-seals b { display:block; font-size:12.5px; margin-top:4px; color:var(--ink); }
.evil-seals small { font-size:11px; color:var(--soft); }

/* GALERÍA */
.evil-gal { display:grid; grid-template-columns:1fr 1fr; gap:14px; max-width:1000px; margin:0 auto; padding:10px 18px; }
.evil-gal figure { margin:0; border-radius:var(--rad); overflow:hidden; box-shadow:var(--sh-sm); }
.evil-gal img { width:100%; aspect-ratio:1/1; object-fit:cover; }

/* SHIP / GIF */
.evil-ship { text-align:center; padding:40px 18px; background:var(--cream); }
.evil-ship h2 { font-size:clamp(24px,4vw,34px); font-weight:900; }
.evil-ship p { color:var(--soft); max-width:520px; margin:0 auto 18px; }
.evil-gif { max-width:320px; margin:0 auto; border-radius:var(--rad); box-shadow:var(--sh); }

/* COMPARATIVO */
.evil-cmp { max-width:980px; margin:0 auto; padding:44px 18px; text-align:center; }
.evil-cmp__warn { display:inline-block; background:var(--y); color:var(--ink); font-weight:900;
  font-size:clamp(18px,3.4vw,26px); padding:10px 18px; border-radius:12px; }
.evil-cmp__lead { color:var(--soft); font-weight:700; margin-bottom:22px; }
.evil-cmp__grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.evil-cmp__col { border-radius:var(--rad); padding:22px 18px; text-align:left; }
.evil-cmp__col h3 { text-align:center; font-size:18px; font-weight:900; }
.evil-cmp__col ul { list-style:none; padding:0; margin:14px 0 0; display:grid; gap:10px; }
.evil-cmp__col li { font-size:14.5px; padding-left:4px; }
.evil-cmp__col--bad { background:#fbeaea; border:1px solid #f3c9c9; }
.evil-cmp__col--bad h3 { color:#c0392b; }
.evil-cmp__col--bad li::marker { content:""; }
.evil-cmp__col--good { background:var(--cream); border:2px solid var(--y2); }
.evil-cmp__col--good h3 { color:#1f8b3b; }
.evil-cmp__col--good img { width:130px; margin:10px auto; border-radius:12px; box-shadow:var(--sh-sm); }

/* INGREDIENTES */
.evil-ingr { max-width:1000px; margin:0 auto; padding:44px 18px; text-align:center; }
.evil-ingr h2 { font-size:clamp(24px,4vw,34px); font-weight:900; }
.evil-ingr h2 span { color:var(--y2); }
.evil-ingr__wrap { display:grid; grid-template-columns:1fr 1fr; gap:26px; align-items:center; margin-top:18px; }
.evil-ingr__wrap img { border-radius:var(--rad); box-shadow:var(--sh); }
.evil-ingr__wrap ul { list-style:none; padding:0; margin:0; text-align:left; display:grid; gap:14px; }
.evil-ingr__wrap li b { display:block; color:var(--ink); font-size:16px; }
.evil-ingr__wrap li span { color:var(--soft); font-size:14px; }
.evil-ingr__foot { margin-top:20px; color:var(--soft); font-weight:700; font-size:14px; }

/* UGC */
.evil-ugc { background:var(--cream); padding:44px 18px; text-align:center; }
.evil-ugc h2 { font-size:clamp(22px,4vw,32px); font-weight:900; }
.evil-ugc__grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; max-width:880px; margin:18px auto 26px; }
.evil-ugc__grid img { width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:14px; box-shadow:var(--sh-sm); }
.evil-reviews { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; max-width:980px; margin:0 auto; }
.evil-reviews article { background:#fff; border:1px solid var(--line); border-radius:var(--rad); padding:18px; text-align:left; box-shadow:var(--sh-sm); }
.evil-reviews .s { color:#f5a623; font-size:16px; margin-bottom:6px; }
.evil-reviews p { font-size:14.5px; margin:0 0 10px; }
.evil-reviews small { color:var(--soft); font-weight:700; }

/* DISTRIBUIDOR */
.evil-dist { background:linear-gradient(135deg,var(--y),var(--y2)); text-align:center; padding:36px 18px; }
.evil-dist span { font-size:32px; }
.evil-dist h2 { font-size:clamp(20px,3.6vw,30px); font-weight:900; color:var(--ink); margin:6px 0; }
.evil-dist p { color:#4a3c12; font-weight:600; margin:0; }

/* FAQ */
.evil-faq { max-width:680px; margin:0 auto; padding:44px 18px; }
.evil-faq h2 { text-align:center; font-size:clamp(24px,4vw,32px); font-weight:900; }
.evil-faq details { background:#fff; border:1px solid var(--line); border-radius:12px; padding:4px 16px; margin-bottom:10px; box-shadow:var(--sh-sm); }
.evil-faq summary { cursor:pointer; font-weight:800; color:var(--ink); padding:12px 0; list-style:none; }
.evil-faq summary::-webkit-details-marker { display:none; }
.evil-faq summary::after { content:"+"; float:right; color:var(--org); font-weight:900; }
.evil-faq details[open] summary::after { content:"–"; }
.evil-faq p { color:var(--soft); padding:0 0 14px; margin:0; }

/* FINAL */
.evil-final { background:var(--ink); color:#fff; text-align:center; padding:48px 18px; }
.evil-final h2 { color:var(--y); font-size:clamp(26px,4.4vw,38px); font-weight:900; }
.evil-final p { color:#d8d2bc; margin-bottom:20px; }
.evil-final .evil-btn { background:var(--y); color:var(--ink); box-shadow:0 6px 0 var(--y2); max-width:420px; }
.evil-final small { display:block; margin-top:12px; color:#b8b29c; font-size:13px; }

/* RESPONSIVO */
@media (max-width:760px){
  .evil-hero { grid-template-columns:1fr; gap:18px; padding:22px 16px; }
  .evil-gal { grid-template-columns:1fr 1fr; }
  .evil-ingr__wrap { grid-template-columns:1fr; }
  .evil-reviews { grid-template-columns:1fr; }
  .evil-seals { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:430px){
  .evil-ugc__grid { grid-template-columns:repeat(2,1fr); }
  .evil-cmp__grid { grid-template-columns:1fr; }
}

/* barra de confiança no comparativo */
.evil-cmp__bar { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:16px;
  margin-top:18px; background:var(--ink); color:#fff; border-radius:14px; padding:14px 18px;
  font-size:13px; font-weight:700; }
.evil-cmp__bar b { color:var(--y); }
