/* Modais legais WebFusion v4.35: cabeçalho só com título e fechar; linha da LGPD no final. */
.lgpd-modal-overlay{
  position:fixed;inset:0;z-index:10900;display:none;align-items:center;justify-content:center;padding:16px;
  background:rgba(10,30,40,.72);
}
.lgpd-modal-overlay.show{display:flex}
.lgpd-modal{
  width:min(680px,100%);max-height:88dvh;display:flex;flex-direction:column;overflow:hidden;
  background:var(--teal-dk,#0F3C47);border:1px solid rgba(201,169,110,.28);border-radius:18px;
  box-shadow:0 28px 80px rgba(0,0,0,.35);
}
.lgpd-modal-header{
  display:flex;justify-content:space-between;align-items:center;gap:16px;
  padding:18px 22px 14px;border-bottom:1px solid rgba(201,169,110,.18);
}
.lgpd-modal-header h2{margin:0;font-family:'Cormorant Garamond',Georgia,serif;color:#fff;font-size:1.6rem;line-height:1.1}
.lgpd-modal-close{
  display:grid;place-items:center;flex:0 0 auto;width:44px;height:44px;border-radius:50%;
  border:1px solid rgba(255,255,255,.28);background:transparent;color:#fff;cursor:pointer;transition:border-color .2s,color .2s;
}
.lgpd-modal-close:hover{border-color:var(--gold,#C9A96E);color:var(--gold-lt,#E8D5B0)}
.lgpd-modal-body{overflow-y:auto;padding:18px 22px 20px;flex:1;scrollbar-width:thin;scrollbar-color:rgba(201,169,110,.4) transparent}
.lgpd-modal-body h3{font-family:'DM Sans',system-ui,sans-serif;font-size:1rem;font-weight:700;color:#E3C893;margin:20px 0 6px;line-height:1.3}
.lgpd-modal-body h3:first-child{margin-top:0}
.lgpd-modal-body p,.lgpd-modal-body li{font-size:1rem;color:rgba(255,255,255,.88);line-height:1.65;margin:0 0 8px}
.lgpd-modal-body ul{padding-left:1.25rem;margin:0 0 .75rem}
.lgpd-modal-body .lgpd-tag{
  display:block;margin:20px 0 0;padding-top:14px;border-top:1px solid rgba(201,169,110,.2);
  font-size:.9375rem;color:rgba(255,255,255,.82);
}
.lgpd-modal-footer{padding:14px 22px;border-top:1px solid rgba(201,169,110,.18)}
.lgpd-modal-footer button{
  width:100%;min-height:48px;padding:10px;background:var(--gold,#C9A96E);color:var(--teal-dk,#0F3C47);border:0;border-radius:999px;
  font:700 1rem/1 'DM Sans',system-ui,sans-serif;cursor:pointer;transition:background .2s;
}
.lgpd-modal-footer button:hover{background:var(--gold-lt,#E8D5B0)}
.lgpd-modal :focus-visible{outline:3px solid var(--gold-lt,#E8D5B0);outline-offset:3px}
.lgpd-link{cursor:pointer}
@media(max-width:620px){
  .lgpd-modal-overlay{padding:10px}
  .lgpd-modal{max-height:92dvh}
  .lgpd-modal-header{padding:14px 16px 12px}
  .lgpd-modal-body{padding:16px}
  .lgpd-modal-footer{padding:12px 16px}
}
  
    /* ──────────────────────────────────────────────────────────────
       Ajuste WebFusion 09/07 · hover unificado + menu mobile compacto
       Objetivo: usar a mesma cor de interação em todo o site e reduzir
       o painel mobile do cabeçalho para um menu mais limpo e funcional.
    ────────────────────────────────────────────────────────────── */
    :root {
      --wf-hover-color: var(--gold);
      --wf-hover-bg: rgba(201,169,110,.13);
      --wf-hover-bg-strong: rgba(201,169,110,.18);
      --wf-hover-border: rgba(201,169,110,.48);
      --wf-hover-shadow: 0 16px 38px rgba(201,169,110,.16);
    }

    /* Mesma cor para links e títulos interativos, do cabeçalho ao rodapé. */
    .nav-links a:hover,
    .nav-links a:focus-visible,
    .mobile-menu-links a:hover,
    .mobile-menu-links a:focus-visible,
    .footer-col ul li a:hover,
    .footer-col ul li button:hover,
    .footer-top-link:hover,
    .footer-credit a:hover,
    .contact-item:hover .contact-item-text strong,
    summary:hover,
    .lgpd-link:hover,
    .legal-link:hover {
      color: var(--wf-hover-color) !important;
    }

    /* Botões comerciais com o mesmo tom de hover. */
    .nav-cta:hover,
    .btn-primary:hover,
    .form-submit:hover,
    .cookie-accept:hover,
    .lgpd-modal-footer button:hover {
      background: var(--wf-hover-color) !important;
      border-color: var(--wf-hover-color) !important;
      color: var(--teal-dk) !important;
    }

    .btn-outline:hover,
    .cookie-decline:hover,
    .gallery-lightbox-back:hover,
    .gallery-lightbox-back:focus-visible,
    .gallery-lightbox-nav:hover,
    .gallery-lightbox-nav:focus-visible,
    .gallery-lightbox-close:hover,
    .gallery-lightbox-close:focus-visible,
    .mobile-close:hover,
    .mobile-close:focus-visible {
      color: var(--wf-hover-color) !important;
      border-color: var(--wf-hover-border) !important;
      background: var(--wf-hover-bg) !important;
    }

    /* Cards e blocos com o mesmo destaque visual no hover. */
    .service-card:hover,
    .result-card:hover,
    .gallery-card:hover,
    .diff-card:hover,
    .process-card:hover,
    .cert-item:hover,
    .platform-block:hover,
    .review-shot:hover,
    details:hover {
      border-color: var(--wf-hover-border) !important;
      box-shadow: var(--wf-hover-shadow) !important;
    }

    .review-shot:hover,
    .instagram-shot:hover,
    .whatsapp-shot:hover {
      background: linear-gradient(180deg, #ffffff 0%, rgba(201,169,110,.10) 100%) !important;
    }

    .service-card:hover .service-overlay {
      background: linear-gradient(to top, rgba(15,60,71,0.92) 0%, rgba(15,60,71,0.20) 55%, transparent 100%) !important;
    }

    .gallery-card:hover .gallery-overlay {
      background: linear-gradient(to top, rgba(15,60,71,0.90) 0%, rgba(15,60,71,0.38) 68%, transparent 100%) !important;
    }

    .social-link:hover {
      background: var(--wf-hover-bg) !important;
      border-color: var(--wf-hover-border) !important;
      color: var(--wf-hover-color) !important;
      box-shadow: 0 10px 26px rgba(201,169,110,.12) !important;
    }

    .top-float:hover,
    .top-float:focus-visible {
      background: var(--wf-hover-color) !important;
      color: var(--teal-dk) !important;
      box-shadow: 0 12px 30px rgba(201,169,110,.24) !important;
    }

    /* Exceção intencional: WhatsApp mantém verde de marca, mas alinhado visualmente. */
    .wa-float:hover,
    .wa-float:focus-visible {
      transform: scale(1.06) !important;
    }

    /* Menu mobile compacto: deixa de ser uma tela inteira pesada e vira painel objetivo. */
    @media (max-width: 768px) {
      .mobile-menu {
        top: calc(var(--demo-h, 0px) + 86px) !important;
        left: 14px !important;
        right: 14px !important;
        bottom: auto !important;
        min-height: unset !important;
        max-height: calc(100dvh - var(--demo-h, 0px) - 106px) !important;
        padding: 12px !important;
        border-radius: 22px !important;
        border: 1px solid rgba(201,169,110,.24) !important;
        background: rgba(250,248,245,.985) !important;
        -webkit-backdrop-filter: blur(14px) !important;
        backdrop-filter: blur(14px) !important;
        box-shadow: 0 18px 52px rgba(15,60,71,.18) !important;
        overflow-y: auto !important;
      }

      .mobile-menu-head {
        width: 100% !important;
        margin: 0 0 8px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 10px !important;
      }

      .mobile-menu-head::before {
        content: none !important;
        display: none !important;
      }
      .mobile-menu-head {
        justify-content: flex-end !important;
        margin-bottom: 4px !important;
      }

      .mobile-menu-brand { display: none !important; }

      .mobile-close {
        width: 44px !important;
        height: 44px !important;
        border-radius: 12px !important;
        font-size: .95rem !important;
        box-shadow: none !important;
        background: rgba(255,255,255,.72) !important;
      }

      .mobile-menu-links {
        width: 100% !important;
        display: grid !important;
        gap: 6px !important;
        margin: 0 !important;
      }

      .mobile-menu-links a {
        min-height: 46px !important;
        padding: 10px 14px !important;
        border-radius: 12px !important;
        font-size: 1rem !important;
        font-weight: 600 !important;
        font-family: 'DM Sans', sans-serif !important;
        line-height: 1.2 !important;
        letter-spacing: 0 !important;
        box-shadow: none !important;
        background: rgba(255,255,255,.78) !important;
        border-color: rgba(201,169,110,.18) !important;
      }

      .mobile-menu-links a::after {
        font-size: 1rem !important;
      }

      .mobile-menu-links a:hover,
      .mobile-menu-links a:focus-visible {
        transform: none !important;
        background: var(--wf-hover-bg) !important;
      }

      .mobile-menu-links a.mobile-menu-cta::after { content: none !important; display: none !important; }
      .mobile-menu-links a.mobile-menu-cta {
        justify-content: center !important;
        background: var(--teal) !important;
        color: #fff !important;
        border-color: var(--teal) !important;
        margin-top: 4px !important;
      }

      .mobile-menu-links a.mobile-menu-cta:hover,
      .mobile-menu-links a.mobile-menu-cta:focus-visible {
        background: var(--wf-hover-color) !important;
        color: var(--teal-dk) !important;
        border-color: var(--wf-hover-color) !important;
      }

      .mobile-menu-note { display: none !important; }
    }

    @media (max-width: 380px) {
      .mobile-menu {
        top: calc(var(--demo-h, 0px) + 80px) !important;
        left: 10px !important;
        right: 10px !important;
        padding: 10px !important;
      }
      .mobile-menu-links a {
        min-height: 44px !important;
        padding: 9px 12px !important;
        font-size: 1rem !important;
      }
    }



    /* ──────────────────────────────────────────────────────────────
       Ajuste WebFusion 09/07 · correção v4.17.1
       Cards com imagem: a cor do hover fica somente na borda/sombra.
       A imagem e o overlay não recebem dourado no hover.
    ────────────────────────────────────────────────────────────── */
    .service-card:hover,
    .result-card:hover,
    .gallery-card:hover,
    .about-imgs-single:hover .about-img-main,
    .faq-img:hover,
    .review-shot:hover,
    .instagram-shot:hover,
    .whatsapp-shot:hover {
      border-color: var(--wf-hover-border) !important;
      box-shadow: var(--wf-hover-shadow) !important;
    }

    .service-card:hover .service-overlay {
      background: linear-gradient(to top, rgba(15,60,71,0.92) 0%, rgba(15,60,71,0.20) 55%, transparent 100%) !important;
    }

    .gallery-card:hover .gallery-overlay {
      background: linear-gradient(to top, rgba(15,60,71,0.90) 0%, rgba(15,60,71,0.38) 68%, transparent 100%) !important;
    }

    .service-card:hover img,
    .result-card:hover img,
    .gallery-card:hover img,
    .about-imgs-single:hover img,
    .faq-img:hover img,
    .review-shot:hover img,
    .instagram-shot:hover img,
    .whatsapp-shot:hover img {
      filter: none !important;
      opacity: 1 !important;
      mix-blend-mode: normal !important;
    }

    .service-card::before,
    .service-card::after,
    .result-card::before,
    .result-card::after,
    .gallery-card::before,
    .gallery-card::after {
      content: none !important;
      display: none !important;
      background: transparent !important;
    }

/* Links de abertura dos modais legais · componente WebFusion v4.29 */
.lgpd-inline-link{
  appearance:none;
  background:none;
  border:0;
  padding:0;
  margin:0;
  color:inherit;
  font:inherit;
  text-decoration:underline;
  text-underline-offset:2px;
  cursor:pointer;
}
.lgpd-inline-link:hover{color:var(--gold-lt,#E8D5B0)}
.lgpd-inline-link:focus-visible{outline:2px solid var(--gold-lt,#E8D5B0);outline-offset:3px;border-radius:3px}
.form-consent .lgpd-inline-link{color:var(--teal,#1B5E6B)}

/* R7 · modais legais permanecem independentes do componente de consentimento. */
body.legal-modal-open{overflow:hidden}