/* Ajustes da Minha Contabilidade sobre o template Landspire (carregado depois do style.css).
   Cores e medidas do template mantidas. */

/* Pular para o conteúdo (acessibilidade) */
.mc-pular {
  position: absolute; left: 16px; top: -60px; z-index: 100000;
  background: var(--theme-color2); color: #fff; padding: 10px 18px; border-radius: 8px;
}
.mc-pular:focus { top: 16px; color: #fff; }

/* As <img> têm width/height (evita salto de layout); o template só define a largura,
   então a altura volta a ser automática. :where() = especificidade zero, qualquer regra do template vence. */
:where(img) { height: auto; }

/* Logos: a da Minha Contabilidade (491x100) na mesma altura da logo original (154x32) */
.main-header .logo img:not(.site-logo-seasonal),
.sticky-header .logo img:not(.site-logo-seasonal),
.mobile-menu .nav-logo img,
.footer-logo img { width: auto; height: 32px; }

/* >>> CÓDIGO OBRIGATÓRIO DO CHECKLIST GRUPO DPG — sobreposição de data comemorativa na logo (não remover).
   #site-logo = cabeçalho principal; .site-logo = mesma regra na cópia do cabeçalho fixo (o id é único na página). */
#site-logo, #site-logo a, .site-logo, .site-logo a { position:relative; display:inline-flex; align-items:center; }
#site-logo .site-logo-image, .site-logo .site-logo-image { display:block; max-width:100%; height:auto; }
#site-logo .site-logo-seasonal, .site-logo .site-logo-seasonal { position:absolute; width:50px; height:50px; object-fit:contain; top:20%; left:90%; pointer-events:none; }
@media (max-width:700px) {
  #site-logo .site-logo-seasonal, .site-logo .site-logo-seasonal { width:40px; height:40px; top:10%; left:98%; }
}
@media (min-width:701px) and (max-width:1200px) {
  #site-logo .site-logo-seasonal, .site-logo .site-logo-seasonal { width:45px; height:45px; top:20%; left:90%; }
}
/* <<< fim do código obrigatório */
/* Tamanho da logo Minha Contabilidade (491x100) na altura da logo original do template (32 px) */
#site-logo .site-logo-image, .site-logo .site-logo-image { width:157px; }
/* o contêiner da logo é item flex do cabeçalho: não deixa o menu espremer a logo */
.main-header .logo { flex-shrink: 0; }
/* o template limita as imagens do cabeçalho fixo a 40 px de altura; o selo segue o tamanho do checklist */
.sticky-header .logo img.site-logo-seasonal { max-height: none; }

/* Botão de telefone no lugar da busca (mesmo círculo do template) */
.main-header .ui-btn-search a.search-btn { display: inline-flex; align-items: center; justify-content: center; }

/* Evita palavras sozinhas na última linha (complementa o SemViuvas) */
p, h1, h2, h3, h4, h5, h6, li, .text, .about-text { text-wrap: pretty; }

/* Carrossel de serviços e equipe: antes do Swiper iniciar, mesma grade do template (4/3/2/1 colunas) */
.mc-carrossel { overflow: hidden; }
.mc-carrossel:not(.swiper-initialized) .swiper-slide { width: calc((100% - 0px) / 1.15); margin-right: 24px; }
@media (min-width: 576px) { .mc-carrossel:not(.swiper-initialized) .swiper-slide { width: calc((100% - 24px) / 1.6); } }
@media (min-width: 768px) { .mc-carrossel:not(.swiper-initialized) .swiper-slide { width: calc((100% - 24px) / 2); } }
@media (min-width: 992px) { .mc-carrossel:not(.swiper-initialized) .swiper-slide { width: calc((100% - 48px) / 3); } }
@media (min-width: 1200px) { .mc-carrossel:not(.swiper-initialized) .swiper-slide { width: calc((100% - 72px) / 4); } }
.mc-carrossel .swiper-slide { height: auto; }
.mc-carrossel__pontos { display: flex; justify-content: center; gap: 8px; margin-top: 24px; position: static; }
.mc-carrossel__pontos .swiper-pagination-bullet { width: 10px; height: 10px; background: var(--theme-color3); opacity: .3; }
.mc-carrossel__pontos .swiper-pagination-bullet-active { opacity: 1; }
@media (min-width: 1200px) { .mc-carrossel__pontos { display: none; } }
/* no template a linha (.row) tinha margem de -12px; o carrossel ocupa a largura do container */
.service-section .mc-carrossel .service-block-items-2,
.team-section-2 .mc-carrossel .team-block-items2 { margin-bottom: 0; }

/* Formulário de proposta: campos de texto com o mesmo visual do nice-select do template */
.form-column .contact-form h6 label { color: inherit; margin: 0; font: inherit; }
.form-column .contact-form .mc-campo {
  background-color: var(--bg-color); border-radius: 10px; color: var(--headings-color);
  height: 60px; font-size: 16px; font-weight: 400; border: 2px solid transparent; width: 100%; padding: 0 30px;
  outline: none; transition: border-color .2s;
}
.form-column .contact-form .mc-campo::placeholder { color: var(--text-color); }
.form-column .contact-form .mc-campo:focus { border-color: var(--theme-color1); }
.form-column .contact-form .mc-consentimento { margin-bottom: 14px; }
.mc-check { display: flex; align-items: flex-start; gap: 10px; font-size: 14px; line-height: 1.5; color: var(--text-color); cursor: pointer; }
.mc-check input { margin-top: 3px; width: 16px; height: 16px; flex-shrink: 0; accent-color: var(--theme-color3); }
.mc-check a { text-decoration: underline; text-underline-offset: 2px; color: inherit; }
.form-column .contact-form .bottom-box .price-box .price { line-height: 1.2; }
.mc-nota { min-height: 0; margin: 12px 0 0; font-size: 15px; line-height: 1.5; color: var(--headings-color); }
.mc-nota:empty { display: none; }
.mc-nota--ok { color: #198754; }
button.theme-btn-main[disabled] { opacity: .65; cursor: wait; }

/* Campo isca antispam (fora da tela) */
.mc-isca { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* Contato: segunda linha de e-mail virou horário (texto, não link) */
.single-contact-info-box .icon-info .info span.d-block { color: inherit; }

/* Rodapé: endereço como link e assinatura padrão (razão social, CNPJ, CRC e Grupo DPG) */
.footer-section-2 address a { color: inherit; }
.footer-section-2 .mc-assinatura { line-height: 1.8; }
.footer-section-2 .mc-assinatura a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }

/* WhatsApp flutuante: à direita, acima do "voltar ao topo" do template (à esquerda cobria a assinatura do rodapé) */
.mc-wa-float {
  position: fixed; right: 24px; bottom: 96px; z-index: 9999;
  width: 56px; height: 56px; border-radius: 50%;
  display: grid; place-items: center;
  background: #25d366; color: #fff; font-size: 30px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .2);
  transition: transform .2s;
}
.mc-wa-float:hover { color: #fff; transform: scale(1.08); }
@media (max-width: 575px) { .mc-wa-float { right: 16px; bottom: 84px; width: 52px; height: 52px; font-size: 28px; } }

/* Páginas legais */
.mc-texto-legal__data { margin-bottom: 30px; font-size: 15px; }
.mc-texto-legal h2 { font-size: 26px; margin: 40px 0 15px; }
.mc-texto-legal p, .mc-texto-legal li { margin-bottom: 12px; line-height: 1.75; }
.mc-texto-legal ul { padding-left: 20px; list-style: disc; }
.mc-texto-legal a { color: var(--theme-color3); text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 767px) { .mc-texto-legal h2 { font-size: 22px; } }
.mc-404 { font-size: 120px; line-height: 1; font-weight: 600; color: var(--theme-color3); margin-bottom: 10px; }

/* Sem "Title Case" (não se usa em português): desfaz o capitalize do template nos elementos desta página */
.btn-style-one,
.main-menu .navigation > li > a,
.main-menu .navigation > li > ul > li > a,
.mobile-menu .navigation li > a,
.news-block-items-2 .content .link-btn,
.page-breadcrumb li,
.page-breadcrumb li a { text-transform: none; }

/* Pétalas da logo Minha Contabilidade no lugar das plantas e flores do template
   (imagens geradas por scripts/gerar-petalas.cjs) */
.preloader:after,
.preloader-loaded .text-preloader-outer .text-preloading:before { background-image: url(../img/petalas/preloader.webp); }
/* fotos dos serviços: contorno das pétalas no lugar do trevo */
.service-block-items-2 .thumb {
  -webkit-mask-image: url(../img/petalas/mascara.png); mask-image: url(../img/petalas/mascara.png);
  -webkit-mask-size: contain; mask-size: contain;
}
/* foto dos diferenciais: contorno das pétalas no lugar da folha */
.choose-us-image-2 {
  -webkit-mask-image: url(../img/petalas/mascara.png); mask-image: url(../img/petalas/mascara.png);
  -webkit-mask-size: contain; mask-size: contain;
}

/* Celular: links legais do rodapé quebram em linhas (no template ficavam numa linha só, com 60 px de espaço)
   e o fim do rodapé ganha respiro para o WhatsApp e o "voltar ao topo" não cobrirem o texto */
@media (max-width: 991.98px) {
  .footer-area-2 .footer-bottom .footer-bottom-wrapper .footer-menu { flex-wrap: wrap; justify-content: center; gap: 10px 24px; }
}
@media (max-width: 575.98px) {
  .footer-area-2 .footer-bottom { padding-bottom: 150px; }
  .footer-area-2 .footer-bottom .footer-bottom-wrapper { text-align: center; }
}
/* Faixa de funcionários: o valor não quebra linha */
.form-column .contact-form .range-slider2 .d-flex { gap: 12px; }
.form-column .contact-form .range-slider2 .property-output { white-space: nowrap; }

/* ===== Acessibilidade (checklist Grupo DPG) ===== */
/* Foco visível: o template remove o outline de tudo (style.css: ":focus { outline: none !important }") */
:focus-visible { outline: 3px solid var(--theme-color1) !important; outline-offset: 3px; }
.hero-2 :focus-visible, .faq-section-2 :focus-visible, .footer-section-2 :focus-visible,
.mobile-menu :focus-visible { outline-color: #fff !important; }
.mc-campo:focus-visible { outline-offset: 0; }
/* Contraste do texto: #6D827C dava 4,09:1 sobre branco (mínimo AA 4,5:1); #5B6F69 dá 5,35:1 */
:root { --text-color: #5B6F69; }

/* Títulos: a tag segue a hierarquia (h2 > h3) e estas classes reproduzem o visual da tag original do template */
.mc-h { font-family: var(--heading-font-family); color: var(--headings-color); position: relative; margin: 0; letter-spacing: normal; }
.mc-h2 { font-size: var(--h2-font-size); font-weight: var(--h2-font-weight); line-height: var(--line-height-heading); }
.mc-h3 { font-size: var(--h3-font-size); font-weight: var(--h3-font-weight); line-height: var(--line-height-heading); }
.mc-h4 { font-size: var(--h4-font-size); font-weight: var(--h4-font-weight); line-height: var(--line-height-heading-small); }
.mc-h5 { font-size: var(--h5-font-size); font-weight: var(--h5-font-weight); line-height: var(--line-height-heading-small); }
.mc-h6 { font-size: var(--h6-font-size); font-weight: var(--h6-font-weight); line-height: var(--line-height-heading-small); }
@media (max-width: 1399.98px) { .mc-h4 { font-size: 22px; } }
@media (max-width: 1199.98px) { .mc-h3 { font-size: 26px; } }
@media (max-width: 767.98px) { .mc-h3 { font-size: 25px; } }
@media (max-width: 575.98px) { .mc-h3 { font-size: 22px; } .mc-h4 { font-size: 20px; } }
@media (max-width: 469.98px) { .mc-h3 { font-size: 20px; } .mc-h4 { font-size: 19px; } }

/* Segmentos no celular: o template mostra 1 card por vez sem margem lateral (o card encostava nas bordas).
   Recuo igual ao do texto da seção (12 px do container). */
@media (max-width: 575.98px) {
  .project-section-2 .project-slider { padding-left: 12px; padding-right: 12px; }
}

/* Segmentos no celular/tablet (sem hover): o card já fica no estado de hover do template,
   com a caixa de título e tags à vista; senão a seção vira só uma sequência de fotos. */
@media (hover: none), (max-width: 991.98px) {
  .project-block-items-2 img:first-child { transform: none; opacity: 1; filter: none; }
  .project-block-items-2 img:nth-child(2) { opacity: 0; }
  .project-block-items-2 .content { clip-path: inset(0 0 0 0); }
}
