/* ══════════════════════════════════════════════════════════
   OR Contabilidade — v2 visual theme
   Overrides styles.css without touching it.
   Loaded after styles.css in index.html.
   ══════════════════════════════════════════════════════════ */

/* ── 0. Text rendering — crisp on dark backgrounds ─────── */
body,
nav.nav,
.hero,
.stats-band,
#testimonials,
#contact,
footer.site-footer {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* Prevent blurry text from GPU compositing on animated sections */
section.reveal {
  will-change: auto !important;
  transform: none !important;
  backface-visibility: initial !important;
}
section.reveal.is-visible {
  will-change: auto !important;
}

/* ── 1. Design tokens ──────────────────────────────────── */
:root {
  --g:      #1C4B42;   /* dark green */
  --g-d:    #133730;   /* darker */
  --lime:   #B4E717;   /* lime accent */
  --lime-h: #C8FF1A;   /* lime hover */
}

/* Force pill buttons and rounded cards globally */
:root {
  --r-btn:  999px !important;
  --r-card: 16px  !important;
}

/* ── 2. Nav — dark green ───────────────────────────────── */
nav.nav {
  background: var(--g);
  box-shadow: 0 1px 0 rgba(0,0,0,0.18);
}
nav.nav .nav-logo          { color: #fff; }
nav.nav .nav-logo small    { color: rgba(255,255,255,0.45); }
nav.nav .nav-links a       { color: rgba(255,255,255,0.72); }
nav.nav .nav-links a::after { background: rgba(255,255,255,0.4); }
nav.nav .nav-links a:hover  { opacity: 1; color: #fff; }
nav.nav .lang-switch        { border-color: rgba(255,255,255,0.22); }
nav.nav .lang-switch button { color: rgba(255,255,255,0.8); }
nav.nav .lang-switch button + button { border-left-color: rgba(255,255,255,0.22); }
nav.nav .lang-switch button.active   { background: rgba(255,255,255,0.14); color: #fff; }
nav.nav .nav-toggle  { border-color: rgba(255,255,255,0.28); color: #fff; }
nav.nav .nav-hours   { border-color: rgba(255,255,255,0.18); color: rgba(255,255,255,0.55); }
nav.nav .nav-hours.is-open .nav-hours-days,
nav.nav .nav-hours.is-open .nav-hours-time { color: rgba(255,255,255,0.88); }
nav.nav .nav-wa-pill { background: rgba(255,255,255,0.12); color: #fff; }
nav.nav .nav-wa-pill:hover { filter: brightness(1.15); }

/* Mobile open menu — keep dark */
.nav .nav-links.is-open {
  background: var(--g);
  border-bottom-color: rgba(255,255,255,0.08);
  box-shadow: 0 12px 32px rgba(0,0,0,0.24);
}
.nav-links.is-open > li > a {
  color: rgba(255,255,255,0.82);
  border-bottom-color: rgba(255,255,255,0.07);
}
.nav-links.is-open .has-dropdown.is-open > a { background: rgba(255,255,255,0.08); color: #fff; }
.nav-links.is-open .nav-dropdown {
  background: #17403A;
  border-color: rgba(255,255,255,0.08);
}
.nav-links.is-open .nav-dropdown-head { color: var(--lime); }
.nav-links.is-open .nav-dropdown-link {
  color: rgba(255,255,255,0.78);
  border-bottom-color: rgba(255,255,255,0.05);
}
.nav-links.is-open .lang-switch-mobile .lang-switch { border-color: rgba(255,255,255,0.22); }
.nav-links.is-open .lang-switch-mobile .lang-switch button { color: rgba(255,255,255,0.8); }
.nav-links.is-open .lang-switch-mobile .lang-switch button.active { background: rgba(255,255,255,0.14); color: #fff; }

/* ── 3. Langs strip ────────────────────────────────────── */
.langs-strip {
  background: var(--lime);
  display: flex;
  align-items: stretch;
}
.langs-strip-item {
  flex: 1;
  text-align: center;
  padding: 13px 16px;
  font-family: var(--font-sans);
  font-size: 12px;
  font-weight: 700;
  color: var(--g);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border-right: 1px solid rgba(28,75,66,0.14);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.langs-strip-item:last-child { border-right: none; }
@media (max-width: 560px) {
  .langs-strip { flex-direction: column; }
  .langs-strip-item { border-right: none; border-bottom: 1px solid rgba(28,75,66,0.14); }
  .langs-strip-item:last-child { border-bottom: none; }
}

/* ── 4. Hero — dark green ──────────────────────────────── */
.hero {
  background: var(--g);
  margin-top: 0;
}
.hero h1              { color: #fff; }
.hero h1 .hl          { color: var(--lime); }
.hero h1 .hl::after   { background: var(--lime); }
.hero-eyebrow         { color: rgba(255,255,255,0.5); }
.hero-eyebrow .rule   { opacity: 0.3; }
.hero-side .sub       { color: rgba(255,255,255,0.68); }

/* Hero buttons on dark bg */
.hero .btn.solid {
  background: var(--lime);
  color: var(--g);
  border-color: transparent;
  box-shadow: none;
}
.hero .btn.solid:hover      { background: var(--lime-h); }
.hero .btn.solid::before    { display: none; }
.hero .btn.accent {
  color: rgba(255,255,255,0.78);
  border-color: rgba(255,255,255,0.28);
  background: transparent;
}
.hero .btn.accent:hover {
  background: rgba(255,255,255,0.08);
  color: #fff;
  border-color: rgba(255,255,255,0.5);
  box-shadow: none;
}

/* Hero stats row */
.hero-stats-row {
  border-top: 1px solid rgba(255,255,255,0.1);
  margin-top: 64px;
  padding-top: 40px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}
.hero-stat-item { padding: 0 32px; border-right: 1px solid rgba(255,255,255,0.1); }
.hero-stat-item:first-child { padding-left: 0; }
.hero-stat-item:last-child  { border-right: none; }
.hero-stat-item .stat-n {
  font-family: var(--font-serif);
  font-size: 38px;
  font-weight: 500;
  color: #fff;
  line-height: 1;
  letter-spacing: -0.02em;
}
.hero-stat-item .stat-l {
  font-family: var(--font-sans);
  font-size: 12px;
  color: rgba(255,255,255,0.42);
  margin-top: 6px;
  letter-spacing: 0.04em;
}
@media (max-width: 768px) {
  .hero-stats-row { grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 40px; }
  .hero-stat-item { border-right: none; padding: 0; }
}

/* ── 5. Services — list rows ───────────────────────────── */
.services-grid {
  display: flex !important;
  flex-direction: column !important;
  border-top: 1px solid var(--line) !important;
  border-left: none !important;
}
.service-card {
  display: grid !important;
  grid-template-columns: 72px 1fr 48px !important;
  grid-template-rows: auto auto !important;
  column-gap: 28px !important;
  align-items: center !important;
  padding: 28px 0 !important;
  border-bottom: 1px solid var(--line) !important;
  border-right: none !important;
  background: transparent !important;
  min-height: auto !important;
  border-radius: 0 !important;
  gap: 0 28px !important;
}
.service-card:hover {
  background: rgba(28,75,66,0.03) !important;
  transform: none !important;
  box-shadow: none !important;
  border-color: var(--line) !important;
  z-index: auto !important;
}

/* Grid placement for children */
.service-card .num {
  grid-column: 1;
  grid-row: 1 / 3;
  align-self: center;
}
.service-card h3 {
  grid-column: 2 !important;
  grid-row: 1 !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
  margin: 0 !important;
  align-self: end;
  line-height: 1.25 !important;
}
.service-card p {
  grid-column: 2 !important;
  grid-row: 2 !important;
  font-size: 13px !important;
  margin: 5px 0 0 !important;
  align-self: start;
  line-height: 1.62 !important;
}
.service-card .arrow {
  grid-column: 3 !important;
  grid-row: 1 / 3 !important;
  align-self: center;
  justify-self: center;
  margin-top: 0 !important;
  font-size: 16px !important;
  width: 36px;
  height: 36px;
  border-radius: 50% !important;
  border: 1px solid var(--line) !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  transition: background 0.2s, border-color 0.2s, color 0.2s;
  color: var(--ink-soft);
}
.service-card:hover .arrow {
  background: var(--g) !important;
  border-color: var(--g) !important;
  color: #fff !important;
  transform: none !important;
}
/* IRS card button */
.service-card .service-card-irs-btn {
  grid-column: 3 !important;
  grid-row: 1 / 3 !important;
  align-self: center;
  font-size: 10px !important;
  letter-spacing: 0.1em !important;
  white-space: nowrap;
}
@media (max-width: 560px) {
  .service-card { grid-template-columns: 48px 1fr !important; }
  .service-card .arrow,
  .service-card .service-card-irs-btn { display: none !important; }
}

/* ── 6. Stats band — dark horizontal ───────────────────── */
.stats-band    { background: var(--g) !important; padding: 0 !important; }
.stats-inner   {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  max-width: 100% !important;
  padding: 0 !important;
  gap: 0 !important;
}
.stat-card {
  background: transparent !important;
  border-radius: 0 !important;
  border-right: 1px solid rgba(255,255,255,0.07) !important;
  border-bottom: none !important;
  box-shadow: none !important;
  padding: 52px 32px !important;
  text-align: center !important;
}
.stat-card:last-child { border-right: none !important; }
.stat-card:hover      { transform: none !important; box-shadow: none !important; }
.stat-icon  { display: none !important; }
.stat-num   { font-size: 52px !important; color: var(--lime) !important; font-family: var(--font-serif) !important; letter-spacing: -0.02em !important; }
.stat-label { font-size: 13px !important; color: rgba(255,255,255,0.44) !important; text-transform: none !important; letter-spacing: 0.02em !important; }
@media (max-width: 680px) {
  .stats-inner { grid-template-columns: repeat(2, 1fr) !important; }
  .stat-card { padding: 36px 20px !important; border-right: 1px solid rgba(255,255,255,0.07) !important; border-bottom: 1px solid rgba(255,255,255,0.07) !important; }
  .stat-card:nth-child(2n) { border-right: none !important; }
  .stat-card:nth-last-child(-n+2) { border-bottom: none !important; }
}

/* ── 7. Approach — light bg, remove dark ──────────────── */
#approach.dark {
  background: var(--paper-warm) !important;
  color: var(--ink) !important;
}
#approach .section-head .num       { color: var(--ink-soft) !important; }
#approach .section-head h2         { color: var(--ink) !important; }
#approach .section-rule            { background: var(--line) !important; }
#approach .approach-item h3        { color: var(--ink) !important; }
#approach .approach-item p         { color: var(--ink-soft) !important; opacity: 1 !important; }
#approach .approach-item .num      { color: var(--ink-mute) !important; opacity: 1 !important; }

/* ── 8. Photo strip — hidden ───────────────────────────── */
.photo-strip { display: none !important; }

/* ── 9. About — revert to single column (no photo) ──── */
.about-photo-wrap {
  display: block;
}
.about-photo { display: none !important; }

/* ── 10. QuoteBand on light bg ─────────────────────────── */
#quote-band.dark {
  background: var(--paper-warm) !important;
  color: var(--ink) !important;
}
#quote-band .section-rule { background: var(--line) !important; }

/* ── 11. Testimonials — dark green ────────────────────── */
#testimonials.warm {
  background: var(--g) !important;
  color: rgba(255,255,255,0.88) !important;
}
#testimonials .tst-headline           { color: #fff; }
#testimonials .tst-accent             { color: var(--lime); }
#testimonials .tst-google-badge       { background: rgba(255,255,255,0.08); border-color: rgba(255,255,255,0.12); }
#testimonials .tst-google-label       { color: rgba(255,255,255,0.45); }
#testimonials .tst-google-rating      { color: #fff; }
#testimonials .tst-google-stars-row .stars svg path { fill: #FBBF24; stroke: #FBBF24; }
#testimonials .num.eyebrow            { color: rgba(255,255,255,0.5); }
#testimonials .tst-card {
  background: #fff !important;
  border-color: transparent !important;
  color: var(--ink);
}
#testimonials .tst-card-body          { color: var(--ink) !important; }
#testimonials .tst-card-name          { color: var(--ink) !important; }
#testimonials .tst-card-city          { color: var(--ink-soft) !important; }
#testimonials .tst-quote-mark         { color: var(--lime); opacity: 0.5; }
#testimonials .tst-nav-btn            { background: rgba(255,255,255,0.1); border-color: rgba(255,255,255,0.18); color: #fff; }
#testimonials .tst-nav-btn:hover      { background: var(--lime); border-color: var(--lime); color: var(--g); }
#testimonials .tst-dot                { background: rgba(255,255,255,0.18); }
#testimonials .tst-dot.active         { background: var(--lime); transform: scale(1.3); }
#testimonials .review-form-wrap       { border-top-color: rgba(255,255,255,0.1) !important; }
#testimonials .review-input           { border-bottom-color: rgba(255,255,255,0.28) !important; color: #fff !important; }
#testimonials .review-input::placeholder { color: rgba(255,255,255,0.38) !important; }
#testimonials .review-form-stars-label { color: rgba(255,255,255,0.5); }
#testimonials .hint                   { color: rgba(255,255,255,0.38) !important; }
#testimonials .btn.solid              { background: var(--lime) !important; color: var(--g) !important; border-color: transparent !important; box-shadow: none !important; }
#testimonials .btn.solid:hover        { background: var(--lime-h) !important; }

/* Reviews marquee on dark bg */
#testimonials .reviews-marquee .review-card { background: rgba(255,255,255,0.05) !important; border-color: rgba(255,255,255,0.08) !important; }
#testimonials .review-body            { color: #fff !important; }
#testimonials .review-by              { color: rgba(255,255,255,0.45) !important; }
#testimonials .review-name            { color: rgba(255,255,255,0.88) !important; }
#testimonials .reviews-summary        { border-bottom-color: rgba(255,255,255,0.1) !important; }
#testimonials .reviews-summary-avg    { color: #fff; }
#testimonials .reviews-summary-count  { color: rgba(255,255,255,0.45); }
#testimonials .reviews-nav            { background: rgba(255,255,255,0.08) !important; border-color: rgba(255,255,255,0.12) !important; color: #fff !important; }
#testimonials .reviews-nav:hover      { background: var(--lime) !important; color: var(--g) !important; }
#testimonials .reviews-summary-source { border-color: rgba(255,255,255,0.18) !important; color: rgba(255,255,255,0.55) !important; }

/* ── 12. Contact — dark green ──────────────────────────── */
#contact {
  background: var(--g) !important;
  color: rgba(255,255,255,0.88) !important;
}
#contact .section-head .num     { color: rgba(255,255,255,0.5) !important; }
#contact .section-head h2       { color: #fff !important; }
#contact .section-rule          { background: rgba(255,255,255,0.1) !important; }
#contact .contact-form label    { color: rgba(255,255,255,0.52) !important; }
#contact .contact-form input,
#contact .contact-form select,
#contact .contact-form textarea {
  border-bottom-color: rgba(255,255,255,0.26) !important;
  color: #fff !important;
  background: transparent !important;
}
#contact .contact-form input::placeholder,
#contact .contact-form textarea::placeholder { color: rgba(255,255,255,0.35) !important; }
#contact .contact-form select option { background: var(--g); }
#contact .contact-form .submit-row .hint { color: rgba(255,255,255,0.38) !important; }
#contact .btn.solid { background: var(--lime) !important; color: var(--g) !important; border-color: transparent !important; box-shadow: none !important; }
#contact .btn.solid:hover { background: var(--lime-h) !important; }
#contact .btn.solid:disabled { background: rgba(180,231,23,0.4) !important; }
#contact .contact-card {
  background: rgba(255,255,255,0.06) !important;
  border-color: rgba(255,255,255,0.1) !important;
}
#contact .contact-card .head     { color: rgba(255,255,255,0.42) !important; }
#contact .contact-card .line     { color: rgba(255,255,255,0.88) !important; }
#contact .contact-card a.line    { color: rgba(255,255,255,0.88) !important; }
#contact .contact-card a.line:hover { border-bottom-color: rgba(255,255,255,0.4) !important; }
#contact .contact-card hr        { border-top-color: rgba(255,255,255,0.1) !important; }
#contact .contact-row-head       { color: rgba(255,255,255,0.42) !important; }
#contact .contact-row-meta       { color: rgba(255,255,255,0.38) !important; }
#contact .contact-row-meta a     { color: rgba(255,255,255,0.38) !important; }
#contact .contact-row-meta a:hover { border-bottom-color: rgba(255,255,255,0.4) !important; }
#contact .about-body             { color: rgba(255,255,255,0.7) !important; }
#contact .map-card               { border-color: rgba(255,255,255,0.1) !important; }
#contact .map-open-link { border-color: rgba(255,255,255,0.18) !important; color: rgba(255,255,255,0.65) !important; background: rgba(255,255,255,0.06) !important; }
#contact .map-open-link:hover    { background: var(--lime) !important; border-color: var(--lime) !important; color: var(--g) !important; }
#contact .contact-sent-mark      { color: var(--lime) !important; }

/* Autofill fix on dark bg */
#contact .contact-form input:-webkit-autofill,
#contact .contact-form input:-webkit-autofill:hover,
#contact .contact-form input:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1000px var(--g) inset !important;
  -webkit-text-fill-color: #fff !important;
}

/* ── 13. Footer ─────────────────────────────────────────── */
footer.site-footer    { background: #071310 !important; }
footer.site-footer .footer-mark { color: rgba(255,255,255,0.85); }
footer.site-footer .footer-tag  { color: rgba(255,255,255,0.35); }

/* ── 14. Global accent overrides ────────────────────────── */
/* Any remaining green accent (#16A34A) → our green */
.btn.solid {
  background: linear-gradient(135deg, var(--g) 0%, var(--g-d) 100%);
  box-shadow: 0 4px 14px rgba(28,75,66,0.3);
}
.btn.solid:hover { box-shadow: 0 6px 20px rgba(28,75,66,0.35); }
.btn.accent { color: var(--g); border-color: var(--g); }
.btn.accent:hover { background: var(--g); box-shadow: 0 4px 14px rgba(28,75,66,0.2); }

/* Nav dropdown accent */
nav.nav .nav-dropdown-link:hover { color: var(--lime); border-bottom-color: rgba(180,231,23,0.3); }

/* Focus ring */
:focus-visible { outline: 2px solid var(--lime); outline-offset: 3px; }

/* ── 15. Section transitions on dark → keep text readable ── */
section.dark { background: var(--g); }

/* ── 16. Booking Modal — keep on dark ───────────────────── */
/* No changes needed; modal renders on a neutral paper bg already */