#module-agasaasclube-club {
  color:#1e1e1f;
}
#module-agasaasclube-club #wrapper {
  padding-top: 0;
}
.step-icon{
  /*width:120px;*/
  height:auto;
  display:block;
  margin:0 0 1.5rem
}
/* Estilos mínimos e responsivos para a página do clube */
.clube-section{
  /* full-bleed para todos os blocos da página do módulo */
  width:100vw;
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
  /* espaçamento vertical mais generoso conforme o modelo */
  padding:3rem 0rem;
}

#module-agasaasclube-club main,#module-agasaasclube-club #content-wrapper,#module-agasaasclube-club #content{
  background:transparent;
  box-shadow:none;
  border:none
}
/*.clube-section .container{padding:0 clamp(16px,5vw,56px)}*/
#clube-hero .container{
  /* neutraliza o container padrão só dentro da hero */
  max-width:none;
  width:100%;
  margin:0;
  padding-left:clamp(16px,5vw,48px);
  padding-right:clamp(16px,5vw,48px);
}
#clube-hero{
  background:#f5f2ef url('../img/nolita-roastery-store-clube-de-cafe-nolita-intro.jpg') center/cover no-repeat;
  text-align:center;
  /* full width (full-bleed) */
  width:100vw;
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
  /* better vertical rhythm for hero */
  padding: 200px 0;
  color:#fff;
}
#clube-hero h1{
  font-size:2.25rem;
  margin-bottom:1rem;
  color:#fff;
  text-transform: uppercase;
  text-align: center;
}
#clube-hero p{
  font-size:1.5rem;
  margin:.25rem 0;
  color:#fff;
  text-shadow:0 1px 2px rgba(0,0,0,.25);
  line-height: 1.5;
  font-weight: bold;
}
.steps-list{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1.5rem;
  margin-top:2rem
}
.steps-list li{
  background:transparent;
  border:none;
  border-radius:0;
  padding:2rem 0 0;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:.35rem
}
#clube-steps{
  background:#f7f7f7
}
#clube-steps h2 {
  text-align:center;
  font-size:1.75rem;
  margin:0 0 4.5rem;
  font-weight:700;
  letter-spacing:.06em;
  color:#1e1e1f;
  text-transform:uppercase;
  line-height:1.25
}
.steps-list li h3 {
  font-size:1.125rem;
  letter-spacing:.06em;
  font-weight:700;
  margin:.25rem 0 1rem;
  color:#aa844f;
  text-transform:uppercase
}
.steps-list p {
  font-size:1.125rem;
}
.title-accent {
  color:#c7a17a;
  font-weight:600
}
.periodicidades {
  display:flex;
  gap:.75rem;
  justify-content:center;
  margin:2rem 0 2.5rem
}
.periodicidades .periodo {
  border:1px solid #c7a17a;
  background:#fff;
  color:#aa844f;
  padding:.5rem 3rem;
  /*border-radius:999px;*/
  cursor:pointer;
  text-transform:uppercase;
  /*font-weight:600;*/
  letter-spacing:.04em;
  font-size: 1.125rem;
}
.periodicidades .periodo.is-active{
  background:#c7a17a;
  color:#fff
}
.cards {
  display: grid;
  grid-template-columns: repeat(3,minmax(260px,1fr));
  gap: 4rem;
  align-items: stretch
}
.card-plano {
  background:#fff;
  border:1px solid #b4b4b4;
  border-radius:.0;
  overflow:hidden;
  text-align:center
}
.card-plano .thumb-wrapper {
  background:#eee;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:300px
}
.card-plano .plano-thumb {
  /*max-width:70%;*/
  height:auto;
  display:block
}
.card-plano .card-body {
  padding:1.5rem 1rem 1.5rem
}
.card-plano h3 {
  margin:0 0 .25rem;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  font-size: 1.25rem;
}
.card-plano .plano-sub {
  margin:0.75rem 0;
  color:#1e1e1f;
  font-size:1.125rem
}
.card-plano .plano-sub[hidden] {
  display:none
}
.card-plano .sep {
  border:0;
  border-top:1px solid #e5e5e5;
  margin:1rem auto;
  width:80%
}
.card-plano .plano-preco {
  font-weight:700;
  margin:0 0 1rem;
  font-size:1.75rem;
  color:#1e1e1f;
  line-height:1;
  letter-spacing:-.01em;
  font-variant-numeric:tabular-nums
}
.card-plano .plano-preco .moeda {
  font-size:1rem;
  vertical-align:top;
  margin-right:.1rem;
  opacity:.9
}
.card-plano .plano-preco .inteiro {
  font-size:2.25rem;
  line-height:1
}
.card-plano .plano-preco .centavos {
  font-size:.9rem;
  vertical-align:super;
  margin-left:.1rem
}
.card-plano .plano-preco .periodo {
  font-size:.85rem;
  color:#1e1e1f;
  margin-left:.35rem;
  letter-spacing:0
}
.card-plano .plano-description {
  margin:0 0 1rem;
  color:#1e1e1f;
  font-size:1.125rem;
  line-height:1.7;
}
.card-plano .plano-description[hidden] {
  display:none
}
.card-plano .btn-assinar {
  background: #c7a17a;
  color: #fff;
  border: none;
  border-radius: 0;
  padding: .75rem 1rem;
  cursor :pointer;
  width: 80%;
  max-width: 260px;
  text-transform: uppercase;
  letter-spacing: .02em;
  font-weight: 700;
  font-size: 1rem;
}
.card-plano .btn-assinar:hover {
  background:#b68d67
}

/* Plano: centralização do título e margens laterais maiores como no mock */
#clube-planos h2 {
  text-align:center;
  font-size:1.75rem;
  margin:0 0 1.25rem;
  font-weight:700;
  /*letter-spacing:.06em;*/
  text-transform:uppercase;
  line-height:1.25;
  padding-bottom: 40px;
}
/*#clube-planos .container {
  padding-left:clamp(24px,12vw,160px);
  padding-right:clamp(24px,12vw,160px)
}*/
.card-plano .btn-assinar[disabled] {
  background:#ccc;
  cursor:not-allowed
}
/*.torra-perfis{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}*/

/* Métodos */
#clube-metodos {
  background:#f7f7f7;
  text-align:center
}
#clube-metodos h2 {
  font-size:1.75rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.06em;
  margin:0 0 .5rem
}
#clube-metodos h2 .accent {
  color:#c7a17a;
  font-weight:700
}
#clube-metodos .metodos-intro {
  color:#1e1e1f;
  font-size:1.25rem;
  line-height:1.65;
  padding:0 1rem
}
#clube-metodos h4 {
  font-size: 1.25rem;
  text-transform: none;
}
#clube-metodos p {
  font-size: 1.125rem;
}
.metodos-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:4.5rem 2rem;
  list-style:none;
  margin:0;padding:0
}
.metodo-item {
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:1rem
}
.metodo-item img{
  width:auto;
  display:block;
  filter:grayscale(100%); 
  margin-bottom: 20px
}
.metodo-label{
  display:block;
  font-size:1.125rem;
  text-transform:uppercase;
  letter-spacing:.06em;
  font-weight:700;
  color:#aa844f
}
.faq details{
  border:1px solid #eee;
  border-radius:.5rem;
  margin:.5rem 0;
  padding:.75rem;
  background:#fff
}

/* FAQ Accordion */
#clube-faq h2{
  text-align:center;
  font-size:1.3rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.055em;
  margin:0 0 2rem
}
.faq-accordion{
  max-width:880px;
  margin:0 auto;
  display:flex;
  flex-direction:column;
  gap:.75rem;
  padding:0 1rem
}
.faq-item{
  background:#fff;
  border:1px solid #e2dfd9;
  border-radius:.5rem;
  overflow:hidden;
  cursor:pointer
}
.faq-q{
  all:unset;
  display:flex;
  justify-content:space-between;
  align-items:center;
  width:100%;
  padding:1rem 1.25rem;
  font-weight:600;
  font-size:.95rem;
  letter-spacing:.02em;
  color:#3a2d21
}
.faq-q .chev{
  width:18px;
  height:18px;
  position:relative
}
/* Chevron (seta) que gira ao abrir */
.faq-q .chev:before{
  content:'';
  position:absolute;
  left:50%;
  top:50%;
  width:10px;
  height:10px;
  border-right:2px solid #aa844f;
  border-bottom:2px solid #aa844f;
  transform:translate(-50%,-60%) rotate(45deg);
  transition:transform .25s
}
.faq-q[aria-expanded="true"] .chev:before{
  transform:translate(-50%,-40%) rotate(225deg)
}
.faq-q:hover{
  background:#f9f7f4
}
.faq-a{
  padding:0 1.25rem 1.25rem;
  font-size:.9rem;
  line-height:1.6;
  color:#4a4a4a;cursor:auto
}
.faq-a p{
  margin:.75rem 0 0
}
.faq-item.is-open{
  border-color:#c7a17a
}
/* Prévia de uma linha para o item fechado */
.faq-preview{
  padding:0 1.25rem 1rem;
  color:#6f6c67;
  font-size:.9rem;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis
}
.faq-item.is-open .faq-preview{
  display:none
}

@media (max-width: 991px){
  .steps-list{
    grid-template-columns:repeat(2,1fr)
  }
  .cards{
    grid-template-columns:1fr
  }
  .torra-perfis{
    grid-template-columns:1fr
  }
  .metodos-grid{
    grid-template-columns:repeat(2,1fr)
  }
}

/* Intro block (segundo bloco) */
#clube-intro{
  background:#fff;
  text-align:center;
  padding:6rem 0
}
/*#clube-intro .container{
  max-width:none;
  width:100%;
  margin:0;
  padding-left:clamp(16px,5vw,56px);
  padding-right:clamp(16px,5vw,56px)
}*/
#clube-intro h2{
  font-size:1.75rem;
  line-height:1.25;
  margin-bottom:30px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.055em;
  color:#1e1e1f
}
#clube-intro p{
  color:#1e1e1f;
  margin:1rem 0 0;
  font-size:1.125rem;
  line-height:1.4
}
#clube-intro .emphasis{
  font-style:italic;
  font-weight:600;
  color:#1e1e1f
}

/* Torra feature (texto + imagem lado a lado) */
#clube-torra-feature {
  background: #aa844f;
  position: relative;
}
#clube-torra-feature:before{
  background: url(/modules/agasaasclube/views/img/nolita-roastery-store-clube-de-cafe-nolita-torrefacao.jpg) no-repeat #aa844f;
  background-position: right;
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 50%;
  height: 100%;
}
.torra-feature-inner{
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:stretch
}
.torra-feature .torra-text{
  background:#aa844f;
  color:#fff;
  padding:120px clamp(16px,5vw,56px) 120px 0
}
.torra-feature .torra-text h2{
  font-weight:700;
  letter-spacing:.06em;
  margin:0 0 1.25rem;
  text-transform:uppercase;
  font-size:1.5rem;
  line-height:1.25;
  color: #fff;
}
.torra-feature .torra-text h3{
  font-size:1.325rem;
  line-height:1.25;
  color: #fff;
  font-style: italic;
  text-transform: none;
  font-weight: 400;
  padding-bottom: 40px
}
.torra-feature .torra-text p{
  margin:.5rem 0;
  font-size:1.125rem;
  line-height:1.4;
  color: white
}
.torra-feature .torra-text .torra-destaque{
  font-weight:700;
  font-style:italic
}
.torra-feature .torra-image{
  position:relative;
  min-height:420px
}
.torra-feature .torra-image img{
  position:absolute;
  inset:0;
  object-fit:cover;
  width:100%;
  height:100%
}

/* Perfis de torra */
#clube-torra{b
  ackground-color: white;
  padding-top: 3rem
}
.perfis-title{
  text-align:center;
  margin:0 0 4.5rem;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  font-size:1.75rem;
  line-height:1.25
}
/*.torra-perfis-section .container{padding-left:clamp(24px,12vw,160px);padding-right:clamp(24px,12vw,160px)}*/
/*.torra-perfis-section .torra-perfis{display:grid;grid-template-columns:repeat(3,1fr);gap:3rem}*/
.torra-perfis-section .torra-perfis h3{
  font-size:1.25rem;
  font-weight:700;
  letter-spacing:.06em;
  margin:0 0 1rem;
  text-transform:uppercase;
  color:#aa844f
}
.torra-perfis-section .torra-perfis p{
  color:#1e1e1f;
  margin:.25rem 0;
  font-size:1.125rem;
  line-height:1.4;
  letter-spacing: normal;
}

@media (max-width: 991px) {
  #clube-torra-feature:before {
    display: none;
  }
}

@media (max-width: 575px){
  .steps-list{
    grid-template-columns:repeat(1,1fr)
  }
  .cards{
    grid-template-columns:1fr
  }
  .torra-perfis{
    grid-template-columns:1fr
  }
  .metodos-grid{
    grid-template-columns:repeat(2,1fr)
  }
}