/* Rifinha do Bem — FAQ + CTA cinematograficos */
section.section:has(.faq){
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 15% 20%,rgba(222,178,54,.10),transparent 25%),
    radial-gradient(circle at 85% 75%,rgba(222,178,54,.08),transparent 24%),
    linear-gradient(180deg,#043321 0%,#032719 100%)!important;
  color:#fff;
  border-top:1px solid rgba(226,181,50,.28);
  border-bottom:1px solid rgba(226,181,50,.28);
}
section.section:has(.faq) .wrap{position:relative;z-index:1}
section.section:has(.faq) .eyebrow{color:#e6b939!important;letter-spacing:.16em}

/* Fallback direto para navegadores que não estilizam bem o pai via :has */
.faq{
  max-width:900px!important;
  margin:30px auto 0!important;
  padding:24px!important;
  border-radius:26px!important;
  background:
    radial-gradient(circle at 10% 10%,rgba(230,184,57,.10),transparent 24%),
    linear-gradient(160deg,#063b28,#02291b)!important;
  border:1px solid rgba(224,179,59,.42)!important;
  box-shadow:0 20px 50px rgba(0,0,0,.18)!important;
}
.faq details{
  background:linear-gradient(145deg,rgba(5,60,40,.96),rgba(2,42,28,.98))!important;
  border:1px solid rgba(224,179,59,.48)!important;
  border-radius:18px!important;
  padding:19px 20px!important;
  margin:12px 0!important;
  box-shadow:0 10px 24px rgba(0,0,0,.16)!important;
}
.faq summary{
  color:#fff!important;
  cursor:pointer!important;
  font-weight:800!important;
  list-style:none!important;
  position:relative!important;
  padding-left:32px!important;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{
  content:"+";
  position:absolute;
  left:0;top:50%;transform:translateY(-50%);
  width:22px;height:22px;border-radius:50%;
  display:grid;place-items:center;
  color:#f3c84e;
  border:1px solid rgba(243,200,78,.72);
  font-size:16px;line-height:1;
}
.faq details[open] summary::before{content:"−"}
.faq p{color:#cfdfd5!important;line-height:1.65!important;margin:14px 0 2px 32px!important}

.cta{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% -10%,rgba(228,184,57,.22),transparent 32%),
    linear-gradient(180deg,#063a27 0%,#02291b 100%)!important;
  border-top:1px solid rgba(230,184,54,.42);
  padding:82px 20px!important;
}
.cta::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 0%,rgba(230,184,54,.05) 50%,transparent 100%);pointer-events:none}
.cta .wrap{position:relative;z-index:1}
.cta h2{font-size:clamp(36px,4vw,54px)!important;letter-spacing:-.045em;text-shadow:0 8px 26px rgba(0,0,0,.25)}
.cta h2::after{content:"";display:block;width:90px;height:2px;margin:18px auto 0;background:linear-gradient(90deg,transparent,#e4b839,transparent)}
.cta p{font-size:17px;color:#d4e4da!important}
.cta .primary{margin-top:18px;background:linear-gradient(135deg,#0e8b44,#14ad57)!important;border:1px solid rgba(245,202,80,.85)!important;box-shadow:0 0 0 2px rgba(236,185,48,.10),0 14px 32px rgba(0,0,0,.24),0 0 28px rgba(224,179,59,.10)!important;border-radius:16px!important;padding:18px 30px!important;min-width:260px}
.cta .primary:hover{transform:translateY(-2px);box-shadow:0 0 0 2px rgba(236,185,48,.16),0 18px 38px rgba(0,0,0,.28),0 0 34px rgba(224,179,59,.16)!important}

/* Trevo oficial de 4 folhas no cabecalho */
.clover{
  font-size:0!important;
  width:38px!important;
  height:38px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 38px!important;
}
.clover::before{
  content:"🍀"!important;
  display:block!important;
  font-size:34px!important;
  line-height:1!important;
}

@media(max-width:800px){
  section.section:has(.faq){padding:48px 16px!important}
  .faq{padding:14px!important;border-radius:20px!important;margin-top:22px!important}
  .faq details{padding:17px 16px!important;margin:10px 0!important}
  .faq summary{font-size:15px!important;padding-left:30px!important}
  .faq p{font-size:14px!important;margin-left:30px!important}
  .cta{padding:58px 16px!important}
  .cta h2{font-size:32px!important}
  .cta .primary{width:100%;max-width:360px;min-width:0}
  .clover{width:36px!important;height:36px!important;flex-basis:36px!important}
  .clover::before{font-size:32px!important}
}