/* ==========================================================
   sr-irpf.css — Checkup IRPF
   Template:
   - S-R core
   Função:
   - layout da página curta, direta e escaneável
   - hero compacto
   - grid de cards rápidos
   - CTA principal
   - FAQ curta
   - relacionados compactos

   NÃO colocar aqui:
   - tokens de tema
   - footer
   - hubnav
   - topbar global
   - office box ATD
   ========================================================== */

/* ==========================================================
   1) HERO S-R
   ========================================================== */
.rb-sr-hero {
  padding-top: var(--rb-space-6);
  padding-bottom: var(--rb-space-4);
}

.rb-sr-hero-card {
  display: grid;
  gap: var(--rb-space-3);
  max-width: 820px;
  padding: var(--rb-space-7);
  border: 1px solid var(--rb-border);
  border-radius: var(--rb-radius-xl);
  background:
    radial-gradient(circle at top left, color-mix(in srgb, var(--rb-brand-1) 18%, transparent), transparent 48%),
    var(--rb-surface);
  box-shadow: var(--rb-shadow-md);
}

.rb-sr-hero-card h1 {
  max-width: 18ch;
  margin-bottom: var(--rb-space-2);
}

.rb-sr-hero-card .rb-lead {
  max-width: 64ch;
  margin-bottom: var(--rb-space-2);
}

.rb-sr-hero-card .rb-support {
  max-width: 68ch;
  margin-bottom: 0;
}

/* ==========================================================
   2) CARDS RÁPIDOS
   ========================================================== */
.rb-sr-cards {
  padding-top: var(--rb-space-4);
  padding-bottom: var(--rb-space-4);
}

.rb-sr-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--rb-space-4);
}

.rb-sr-card-grid .card {
  height: 100%;
}

.rb-sr-card-grid .card h2 {
  margin-bottom: var(--rb-space-3);
}

.rb-sr-card-grid .card p:last-child {
  margin-bottom: 0;
}

/* ==========================================================
   3) CTA PRINCIPAL INTERMEDIÁRIO
   ========================================================== */
.rb-sr-cta-section {
  padding-top: var(--rb-space-4);
  padding-bottom: var(--rb-space-4);
}

.rb-sr-cta-section .rb-cta-box {
  max-width: 820px;
}

/* ==========================================================
   4) FAQ CURTA
   ========================================================== */
.rb-sr-faq {
  padding-top: var(--rb-space-4);
  padding-bottom: var(--rb-space-4);
}

.rb-sr-faq .card {
  max-width: 900px;
}

/* ==========================================================
   5) RELACIONADOS COMPACTOS
   ========================================================== */
.rb-sr-related {
  padding-top: var(--rb-space-4);
  padding-bottom: var(--rb-space-4);
}

.rb-sr-related .card {
  max-width: 900px;
}

/* ==========================================================
   6) CTA FINAL
   ========================================================== */
.rb-sr-final-cta {
  padding-top: var(--rb-space-4);
  padding-bottom: var(--rb-space-7);
}

.rb-sr-final-cta .rb-cta-box {
  max-width: 820px;
}

/* ==========================================================
   7) AJUSTES DE RITMO ENTRE BLOCOS
   ========================================================== */
.rb-sr-hero + .rb-sr-cards {
  padding-top: var(--rb-space-5);
}

.rb-sr-cards + .rb-sr-cta-section,
.rb-sr-cta-section + .rb-sr-faq,
.rb-sr-faq + .rb-sr-related,
.rb-sr-related + .rb-sr-final-cta {
  padding-top: var(--rb-space-5);
}

/* ==========================================================
   8) TABLETS
   ========================================================== */
@media (max-width: 980px) {
  .rb-sr-hero-card {
    padding: var(--rb-space-6);
  }

  .rb-sr-card-grid {
    grid-template-columns: 1fr 1fr;
  }
}

/* ==========================================================
   9) MOBILE
   ========================================================== */
@media (max-width: 640px) {
  .rb-sr-hero {
    padding-top: var(--rb-space-5);
  }

  .rb-sr-hero-card {
    padding: var(--rb-space-5);
    gap: var(--rb-space-3);
  }

  .rb-sr-hero-card h1 {
    max-width: none;
  }

  .rb-sr-card-grid {
    grid-template-columns: 1fr;
  }

  .rb-sr-cta-section .rb-cta-box,
  .rb-sr-final-cta .rb-cta-box,
  .rb-sr-faq .card,
  .rb-sr-related .card {
    max-width: 100%;
  }
}