/* ==========================================================================
   M.Dias Contabilidade — home.css
   ========================================================================== */

/* -----------------------------------------------------------------------
   Hero — clean white, inspired by contabilizei.com.br
----------------------------------------------------------------------- */

#hero {
  margin-top: var(--navbar-h);
  background: var(--white);
  padding: 5.5rem 0 4rem;
  position: relative;
  overflow: hidden;
}

/* Subtle background accent — very light */
#hero::before {
  content:'';
  position:absolute;
  top:0; right:0;
  width:100%; 
  height:100%;
  /* background: linear-gradient(135deg, var(--cream) 0%, #EEF2F8 100%); */
  /* clip-path: polygon(8% 0%, 100% 0%, 100% 100%, 0% 100%); */
  z-index:0;
}

.hero__inner {
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:4rem;
  align-items:center;
  position:relative;
  z-index:1;
}

/* Left side */
.hero__content { max-width:560px; }

.hero__badge {
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.35rem 1rem;
  background:rgba(184,148,80,.1);
  border:1px solid rgba(184,148,80,.25);
  border-radius:var(--radius-pill);
  font-size:.72rem; font-weight:700;
  letter-spacing:.1em; text-transform:uppercase;
  color:var(--gold);
  margin-bottom:1.75rem;
}
.hero__badge i { font-size:10px; }

.hero__title {
  font-family:var(--font-heading);
  font-size: clamp(2rem, 4vw, 3.2rem);
  font-weight:700; color:var(--text-heading);
  line-height:1.15; margin-bottom:1.25rem;
}
.hero__title .accent { color:var(--gold); }

.hero__subtitle {
  font-size: clamp(.95rem, 1.5vw, 1.1rem);
  color:var(--text-body); line-height:1.75;
  margin-bottom:2.5rem; max-width:480px;
}

.hero__actions {
  display:flex; flex-wrap:wrap; gap:.75rem; margin-bottom:3.5rem;
}

.hero__stats {
  display:flex; gap:2.5rem; flex-wrap:wrap;
  padding-top:2rem;
  border-top:1px solid var(--border);
}
.hero__stat          { display:flex; flex-direction:column; }
.hero__stat-number   {
  font-family:var(--font-heading);
  font-size:2rem; font-weight:700;
  color:var(--navy); line-height:1;
}
.hero__stat-label    { font-size:.75rem; color:var(--text-muted); margin-top:.2rem; }

/* Right side — image */
.hero__visual {
  position:relative;
  display:flex; align-items:center; justify-content:center;
}
.hero__img-wrap {
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-lg);
  aspect-ratio: 4/3;
  width: 100%;
  position: relative;
}

.hero__img-wrap::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(28, 41, 81, 0.35); /* ajuste o 0.35 para mais ou menos intensidade */
  border-radius: var(--radius-lg);
}

.hero__img-wrap img { width:100%; height:100%; object-fit:cover; }

/* Small floating card on image */
.hero__float-card {
  position:absolute;
  bottom:-1.5rem; 
  left:-1rem;
  background:var(--white);
  border-radius:var(--radius-md);
  padding:1rem 1.25rem;
  box-shadow:var(--shadow-lg);
  display:flex; align-items:center; gap:.5rem;
  min-width:200px;
}
.hero__float-card-icon {
  width:40px; height:40px; border-radius:50%;
  background:linear-gradient(135deg,var(--navy),var(--navy-mid));
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
  color:var(--white);
}
.hero__float-card-icon i { font-size:17px; }
.hero__float-card p      { font-size:.72rem; color:var(--text-muted); margin-bottom:.15rem; }
.hero__float-card strong { font-size:.9rem; color:var(--text-heading); font-weight:700; }

@media (max-width:900px) {
  #hero { padding:3.5rem 0 3rem; }
  #hero::before { display:none; }
  .hero__inner { grid-template-columns:1fr; gap:2.5rem; }
  .hero__visual { display:none; }
  .hero__content { max-width:100%; }
}
@media (max-width:600px) {
  .hero__stats { gap:1.5rem; }
  .hero__stat-number { font-size:1.6rem; }
}

/* -----------------------------------------------------------------------
   Serviços (home)
----------------------------------------------------------------------- */
#servicos-home { background:var(--cream); }

.services-home__header {
  display:flex; justify-content:space-between; align-items:flex-end;
  margin-bottom:3rem; gap:2rem; flex-wrap:wrap;
}

.services-home__grid {
  display:grid; grid-template-columns:repeat(3,1fr); gap:1.25rem;
}

.service-card {
  background:var(--white); border-radius:var(--radius-lg);
  padding:2rem; border:1.5px solid var(--border);
  transition:border-color var(--transition), box-shadow var(--transition), transform var(--transition);
}
.service-card:hover { border-color:var(--gold); box-shadow:var(--shadow-lg); transform:translateY(-4px); }

.service-card__icon {
  width:52px; height:52px; border-radius:var(--radius-md);
  background:var(--navy);
  display:flex; align-items:center; justify-content:center;
  margin-bottom:1.5rem; color:var(--white);
  transition:background var(--transition);
}
.service-card:hover .service-card__icon { background:var(--gold); }
.service-card__icon i { font-size:22px; }

.service-card__title { font-size:1.05rem; font-weight:700; color:var(--text-heading); margin-bottom:.6rem; }
.service-card__text  { font-size:.9rem; color:var(--text-body); line-height:1.7; margin-bottom:1.25rem; }

.service-card__link {
  display:inline-flex; align-items:center; gap:.4rem;
  font-size:.78rem; font-weight:700; letter-spacing:.04em;
  text-transform:uppercase; color:var(--gold);
  transition:gap var(--transition);
}
.service-card__link i { font-size:11px; transition:transform var(--transition); }
.service-card:hover .service-card__link     { gap:.65rem; }
.service-card:hover .service-card__link i   { transform:translateX(3px); }

@media (max-width:900px) { .services-home__grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px) {
  .services-home__grid { grid-template-columns:1fr; }
  .services-home__header { flex-direction:column; align-items:flex-start; }
}

/* -----------------------------------------------------------------------
   Sobre (home)
----------------------------------------------------------------------- */
#sobre-home { background:var(--white); }

.about-home__inner {
  display:grid; grid-template-columns:1fr 1fr;
  gap:5rem; align-items:center;
}
.about-home__img-wrap {
  border-radius:var(--radius-lg); overflow:hidden;
  aspect-ratio:4/3; box-shadow:var(--shadow-lg); position:relative;
}
.about-home__img-wrap::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(28, 41, 81, 0.35);
}
.about-home__img-wrap img { width:100%; height:100%; object-fit:cover; }

.about-home__badge {
  position:absolute; bottom:-1.25rem; right:-1.25rem;
  background:var(--navy); color:var(--white);
  padding:1.25rem 1.5rem; border-radius:var(--radius-md);
  text-align:center; box-shadow:var(--shadow-lg);
}
.about-home__badge-number {
  font-family:var(--font-heading);
  font-size:2.2rem; font-weight:700;
  color:var(--gold-light); line-height:1; display:block;
}
.about-home__badge-label {
  font-size:.7rem; color:rgba(255,255,255,.7);
  text-transform:uppercase; letter-spacing:.08em; display:block; margin-top:.3rem;
}

.about-home__text h2 { margin-bottom:1rem; }
.about-home__text p  { color:var(--text-body); line-height:1.75; margin-bottom:1.1rem; }

.about-home__list    { margin:1.5rem 0; display:flex; flex-direction:column; gap:.65rem; }
.about-home__list li {
  display:flex; align-items:flex-start; gap:.65rem;
  font-size:.9rem; color:var(--text-body);
}
.about-home__list li i { color:var(--gold); margin-top:3px; font-size:13px; flex-shrink:0; }

@media (max-width:860px) {
  .about-home__inner { grid-template-columns:1fr; gap:3rem; }
  .about-home__badge { bottom:-.75rem; right:.75rem; }
}

/* -----------------------------------------------------------------------
   Diferenciais (home)
----------------------------------------------------------------------- */
#diferenciais-home { background:var(--cream); }

.diferenciais__grid {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:1.25rem; margin-top:3rem;
}
.diferencial-card {
  background:var(--white); border:1.5px solid var(--border);
  border-radius:var(--radius-lg); padding:2rem;
  transition:box-shadow var(--transition), transform var(--transition);
}
.diferencial-card:hover { box-shadow:var(--shadow-md); transform:translateY(-3px); }

.diferencial-card__icon {
  width:52px; height:52px; border-radius:var(--radius-md);
  background:rgba(28,41,81,.06);
  display:flex; align-items:center; justify-content:center;
  margin-bottom:1.25rem; color:var(--navy);
}
.diferencial-card__icon i { font-size:22px; }

.diferencial-card__title { font-size:1.05rem; margin-bottom:.6rem; }
.diferencial-card__text  { font-size:.875rem; color:var(--text-body); line-height:1.7; }

@media (max-width:860px) { .diferenciais__grid { grid-template-columns:1fr 1fr; } }
@media (max-width:560px) { .diferenciais__grid { grid-template-columns:1fr; } }

/* -----------------------------------------------------------------------
   CTA (home) — cream background, NOT navy, avoids merging with footer
----------------------------------------------------------------------- */
#cta-home {
  background: var(--cream-dark);
  padding: 5rem 0;
  text-align: center;
  border-top: 1px solid var(--border-dark);
}
#cta-home h2 { color:var(--text-heading); margin-bottom:1rem; }
#cta-home p  { color:var(--text-body); margin-bottom:2rem; max-width:500px; margin-left:auto; margin-right:auto; }

/* -----------------------------------------------------------------------
   Links úteis preview (home)
----------------------------------------------------------------------- */
#links-home { background:var(--white); }

.links-home__grid {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:1.25rem; margin-top:3rem;
}
.link-preview-card {
  display:flex; align-items:center; gap:1rem;
  padding:1.25rem 1.5rem;
  border:1.5px solid var(--border);
  border-radius:var(--radius-md);
  transition:border-color var(--transition), box-shadow var(--transition), transform var(--transition);
}
.link-preview-card:hover { border-color:var(--gold); box-shadow:var(--shadow-md); transform:translateY(-2px); }
.link-preview-card__img  { width:48px; height:48px; border-radius:var(--radius-sm); overflow:hidden; flex-shrink:0; }
.link-preview-card__img img { width:100%; height:100%; object-fit:contain; }
.link-preview-card__title   { font-size:.95rem; font-weight:700; color:var(--text-heading); margin-bottom:.15rem; }
.link-preview-card__url     { font-size:.75rem; color:var(--text-muted); }

@media (max-width:860px) { .links-home__grid { grid-template-columns:1fr 1fr; } }
@media (max-width:560px) { .links-home__grid { grid-template-columns:1fr; } }

/* -----------------------------------------------------------------------
   Contato (home)
----------------------------------------------------------------------- */
#contato-home { background:var(--cream); }

.contato-home__inner {
  display:grid; grid-template-columns:1fr 1.4fr;
  gap:4rem; align-items:start;
}
.contato-home__info-title    { font-size:1.5rem; margin-bottom:.5rem; }
.contato-home__info-subtitle { font-size:.9rem; color:var(--text-body); margin-bottom:2rem; line-height:1.7; }

.contato-info-item {
  display:flex; align-items:flex-start; gap:1rem;
  padding:1rem 0; border-bottom:1px solid var(--border);
}
.contato-info-item:last-of-type { border-bottom:none; }
.contato-info-item__icon {
  width:42px; height:42px; background:rgba(28,41,81,.06);
  border-radius:var(--radius-md);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
  color:var(--navy);
}
.contato-info-item__icon i { font-size:18px; }
.contato-info-item__label {
  font-size:.72rem; font-weight:700; text-transform:uppercase;
  letter-spacing:.07em; color:var(--text-muted); margin-bottom:.15rem;
}
.contato-info-item__value   { font-size:.95rem; color:var(--text-heading); font-weight:600; }
.contato-info-item__value a { color:var(--text-heading); transition:color var(--transition); }
.contato-info-item__value a:hover { color:var(--gold); }

.contato-home__form {
  background:var(--white); border-radius:var(--radius-lg);
  padding:2.5rem; border:1.5px solid var(--border); box-shadow:var(--shadow-md);
}
.form-title { font-size:1.2rem; font-weight:700; color:var(--text-heading); margin-bottom:1.5rem; font-family:var(--font-heading); }

@media (max-width:860px) { .contato-home__inner { grid-template-columns:1fr; gap:2rem; } }

/* -----------------------------------------------------------------------
   FAQ
----------------------------------------------------------------------- */
#faq-home { background:var(--white); }

.faq-home__inner {
  display:grid; grid-template-columns:1fr 1.6fr;
  gap:5rem; align-items:start;
}
.faq-home__lead h2   { margin-bottom:1rem; }
.faq-home__lead p    { color:var(--text-body); line-height:1.75; margin-bottom:2rem; }

.faq-list { display:flex; flex-direction:column; gap:.5rem; }

.faq-item {
  border:1.5px solid var(--border);
  border-radius:var(--radius-md);
  overflow:hidden;
  transition:border-color var(--transition);
}
.faq-item.open { border-color:var(--navy); }

.faq-question {
  width:100%; display:flex; align-items:center;
  justify-content:space-between; gap:1rem;
  padding:1.1rem 1.5rem;
  background:var(--white);
  border:none; text-align:left; cursor:pointer;
  font-family:var(--font-body); font-size:.95rem;
  font-weight:700; color:var(--text-heading);
  transition:background var(--transition), color var(--transition);
}
.faq-item.open .faq-question { background:var(--navy); color:var(--white); }

.faq-question i {
  font-size:13px; flex-shrink:0;
  transition:transform var(--transition);
  color:var(--gold);
}
.faq-item.open .faq-question i { transform:rotate(180deg); color:var(--gold-light); }

.faq-answer {
  max-height:0; overflow:hidden;
  transition:max-height .35s ease, padding var(--transition);
  padding:0 1.5rem;
}
.faq-item.open .faq-answer { max-height:300px; padding:1rem 1.5rem 1.25rem; }
.faq-answer p {
  font-size:.9rem; color:var(--text-body); line-height:1.75;
}

@media (max-width:860px) { .faq-home__inner { grid-template-columns:1fr; gap:2.5rem; } }