/* =========================================================
   Astra LF Selo — folha de estilo principal
   Leite & Fontes Advogados Associados — identidade "Selo L|F"
   ========================================================= */

/* ---------- Reset leve / base ---------- */
.lf-page, .lf-page *{ box-sizing:border-box; }
html{ overflow-x:hidden; max-width:100%; }
body{
  background:var(--lf-marfim);
  color:var(--lf-petroleo);
  font-family:var(--lf-font-body);
  overflow-x:hidden; max-width:100%;
}
/* NÃO usar overflow-x:hidden em .ast-container/.site-content: eles são
   MAIS ESTREITOS que a viewport (container do Astra, ~1200px, centrado),
   então "hidden" ali recorta exatamente o "alignfull" que os blocos
   (.lf-full-bleed) tentam fazer — a caixa fica 0..100vw certinha (dá
   pra conferir com getBoundingClientRect), mas a pintura era cortada
   pelo ancestral. overflow-x:hidden no <html>/<body> (acima) já basta
   para não dar scroll horizontal de verdade. */
.lf-wrap{ max-width:1160px; margin:0 auto; padding:0 24px; }

/* A home inteira mora dentro de .lf-page (um bloco core/html). O tema pai
   marca a página como "ast-single-post" e sublinha todo link do
   entry-content — aqui isso nunca é desejado (são botões/menus, não
   texto corrido), então desliga incondicionalmente com !important. */
.lf-page a{ text-decoration:none !important; }

/* Full-bleed: alguns blocos (hero, áreas, sócios, CTA final) precisam
   encostar nas bordas da tela mesmo estando dentro do container do
   Astra (que tem max-width). Larga 100vw e recentra. */
.lf-full-bleed{
  width:100vw; max-width:100vw;
  margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw);
}
.lf-eyebrow{
  font-family:var(--lf-font-title); font-size:13px; letter-spacing:0.22em;
  font-weight:600; text-transform:uppercase; color:var(--lf-pedra);
}
.lf-eyebrow-gold{ color:var(--lf-ouro-claro); }
.lf-eyebrow-dark{ color:var(--lf-ouro-claro); }
.lf-rule-gold{ width:56px; height:1.5px; background:var(--lf-ouro-velho); margin:22px 0 26px; border:0; }
.lf-h2{
  font-family:var(--lf-font-title); font-weight:600; text-transform:uppercase;
  font-size:36px; line-height:1.2; color:var(--lf-petroleo); margin:14px 0 0;
}
.lf-h2-onDark{ color:var(--lf-marfim); }
.lf-lede{ font-size:22px; line-height:1.55; font-weight:500; }
a{ color:inherit; }

.lf-btn{
  display:inline-block; font-family:var(--lf-font-title); font-size:13px;
  font-weight:600; letter-spacing:0.14em; text-transform:uppercase;
  padding:15px 26px; text-decoration:none; border:1.5px solid transparent;
  transition:background .25s ease, color .25s ease, border-color .25s ease;
}
.lf-btn-solid{ background:var(--lf-petroleo); color:var(--lf-marfim); }
.lf-btn-solid:hover{ background:var(--lf-petroleo-escuro); color:var(--lf-marfim); }
.lf-btn-solid-light{ background:var(--lf-marfim); color:var(--lf-petroleo); }
.lf-btn-solid-light:hover{ background:#fff; }
.lf-btn-outline-gold{ border-color:var(--lf-ouro-velho); color:var(--lf-marfim); }
.lf-btn-outline-gold:hover{ background:rgba(179,148,96,.15); }

/* ---------- Header ---------- */
.lf-header{ background:var(--lf-marfim); position:relative; z-index:50; }
.lf-topbar{ background:var(--lf-petroleo-escuro); color:#E8E0D0; height:38px; }
.lf-topbar-inner{ height:100%; display:flex; align-items:center; justify-content:space-between; font-size:14px; }
.lf-topbar-inner a{ color:#E8E0D0; text-decoration:none; }
.lf-nav-row{ border-bottom:1px solid var(--lf-linhas); }
.lf-nav-inner{ min-height:92px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.lf-logo{ display:inline-flex; align-items:center; line-height:0; flex-shrink:0; }
.lf-logo img{ height:52px; width:auto; }
.lf-menu{ list-style:none; display:flex; gap:30px; margin:0; padding:0; flex:1; justify-content:center; }
.lf-menu li{ margin:0; }
.lf-menu a{
  font-family:var(--lf-font-title); font-size:13px; letter-spacing:0.12em;
  font-weight:500; text-transform:uppercase; text-decoration:none; color:var(--lf-petroleo);
  padding-bottom:4px; border-bottom:1.5px solid transparent;
}
.lf-menu li.current-menu-item > a,
.lf-menu a:hover{ border-bottom-color:var(--lf-ouro-velho); }
.lf-nav-cta{ flex-shrink:0; padding:13px 20px; font-size:12px; }
.lf-hamburger{ display:none; background:none; border:0; width:32px; height:24px; flex-direction:column; justify-content:space-between; cursor:pointer; padding:0; flex-shrink:0; }
.lf-hamburger span{ display:block; height:2px; background:var(--lf-petroleo); }
.lf-mobile-menu{ display:none; }

/* ---------- Hero ---------- */
.lf-hero{
  position:relative; overflow:hidden; background:var(--lf-petroleo-escuro);
  background-size:cover; background-position:center;
  min-height:680px; display:flex; align-items:center;
}
.lf-hero-bg{ position:absolute; inset:0; background-size:cover; background-position:center; }
.lf-hero-scrim{
  position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(8,34,32,.92) 0%, rgba(8,34,32,.72) 45%, rgba(8,34,32,.15) 80%);
}
.lf-hero-inner{ position:relative; width:100%; display:flex; align-items:center; justify-content:space-between; gap:40px; padding:80px 0; }
.lf-hero-copy{ max-width:640px; }
.lf-hero-copy .lf-eyebrow{ margin-bottom:0; }
.lf-hero-title{ font-family:var(--lf-font-body) !important; font-size:58px; line-height:1.1; font-weight:600; color:var(--lf-marfim); margin-top:0; }
.lf-hero-sub{ font-size:23px; line-height:1.5; font-weight:500; color:#D9D2C3; margin-top:26px; max-width:560px; }
.lf-hero-ctas{ display:flex; gap:16px; margin-top:38px; flex-wrap:wrap; }
.lf-hero-seal{ width:260px; flex-shrink:0; opacity:.92; }
.lf-hero-seal svg{ width:100%; height:auto; display:block; }

/* animação do selo: as molduras "desenham" e as letras aparecem */
.js .lf-seal-frame{ stroke-dasharray:1100; stroke-dashoffset:1100; animation:lf-draw 1.4s ease forwards; }
.js .lf-seal-frame-inner{ stroke-dasharray:1000; stroke-dashoffset:1000; animation:lf-draw 1.4s ease forwards .15s; }
.js .lf-seal-letters{ opacity:0; animation:lf-fade-in .8s ease forwards .9s; }
@keyframes lf-draw{ to{ stroke-dashoffset:0; } }
@keyframes lf-fade-in{ to{ opacity:1; } }

/* ---------- Fade-up genérico no scroll ---------- */
.js .lf-fade-up{ opacity:0; transform:translateY(24px); transition:opacity .6s ease, transform .6s ease; }
.js .lf-fade-up.is-inview{ opacity:1; transform:translateY(0); }

@media (prefers-reduced-motion: reduce){
  .lf-seal-frame, .lf-seal-frame-inner, .lf-seal-letters, .lf-fade-up{
    animation:none !important; transition:none !important; opacity:1 !important;
    transform:none !important; stroke-dashoffset:0 !important;
  }
}

/* ---------- Seções claras / genéricas ---------- */
.lf-section{ padding:100px 0; }
.lf-section-tight{ padding:80px 0; }

/* Escritório */
.lf-office-grid{ display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center; }
.lf-office-text p{ font-size:22px; line-height:1.55; font-weight:500; margin:0 0 16px; }
.lf-office-text p.lf-muted{ color:var(--lf-pedra); }
.lf-link-arrow{
  display:inline-block; margin-top:24px; font-family:var(--lf-font-title); font-size:13px;
  letter-spacing:0.14em; font-weight:600; text-decoration:none; color:var(--lf-petroleo);
  border-bottom:1.5px solid var(--lf-ouro-velho); padding-bottom:4px;
}
/* 3 sócios em cascata (Alex, Gustavo, Leonardo) — escala com a coluna */
.lf-office-photos{ position:relative; width:100%; max-width:560px; aspect-ratio:1 / 0.8667; }
.lf-office-photos .lf-frame{
  position:absolute; left:0; top:0; width:40%; aspect-ratio:3 / 4; border:1.5px solid var(--lf-ouro-velho);
  transform:translate(-14px,-14px);
}
.lf-office-photos img{ position:absolute; width:40%; height:auto; aspect-ratio:3 / 4; object-fit:cover; object-position:center top; }
.lf-office-photos img.lf-photo-a{ left:0; top:0; }
.lf-office-photos img.lf-photo-b{ left:50%; top:50%; transform:translate(-50%,-50%); box-shadow:0 0 0 10px var(--lf-marfim); }
.lf-office-photos img.lf-photo-c{ right:0; bottom:0; box-shadow:0 0 0 10px var(--lf-marfim); }

/* Áreas */
.lf-areas{ background:var(--lf-petroleo); color:var(--lf-marfim); padding:100px 0 110px; }
.lf-areas-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:20px; flex-wrap:wrap; }
.lf-areas-head .lf-link-arrow{ color:var(--lf-marfim); border-bottom-color:var(--lf-ouro-velho); }
.lf-areas-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; margin-top:50px; }
.lf-area-card{ background:var(--lf-card-dark); border-top:2px solid var(--lf-ouro-velho); padding:36px 32px; min-height:230px; }
.lf-area-card h3{ font-family:var(--lf-font-title); font-size:20px; font-weight:600; margin:0; text-transform:uppercase; color:var(--lf-marfim); }
.lf-area-card p{ font-size:19px; line-height:1.5; color:#D9D2C3; margin:16px 0 0; }
.lf-area-card .lf-link-arrow{ font-size:12px; margin-top:22px; color:var(--lf-ouro-claro); border-bottom-color:var(--lf-ouro-velho); }
.lf-areas-list{ display:grid; grid-template-columns:1fr 1fr; column-gap:56px; margin-top:40px; }
.lf-areas-list-item{
  border-bottom:1px solid #2E5E5A; padding:20px 0; display:flex; align-items:center;
  justify-content:space-between; font-family:var(--lf-font-title); font-size:16px; font-weight:500;
  text-decoration:none; color:var(--lf-marfim); text-transform:uppercase;
}
.lf-areas-list-item span{ color:var(--lf-ouro-claro); font-size:20px; }
.lf-areas-list-item.lf-areas-more{ display:none; }

/* Como trabalhamos */
.lf-steps-head{ text-align:center; }
.lf-steps{ display:grid; grid-template-columns:repeat(4,1fr); margin-top:56px; border-top:1px solid var(--lf-linhas); }
.lf-step{ padding:32px 26px 32px 24px; border-left:1px solid var(--lf-linhas); }
.lf-step:first-child{ border-left:0; padding-left:0; }
.lf-step .lf-num{ font-family:var(--lf-font-title); font-size:30px; font-weight:600; color:var(--lf-petroleo); }
.lf-step h3{ font-family:var(--lf-font-title); font-size:17px; font-weight:600; margin:12px 0 0; text-transform:uppercase; }
.lf-step p{ font-size:19px; line-height:1.5; color:var(--lf-pedra); margin:10px 0 0; }

/* Sócios (home) */
.lf-partners{ background:var(--lf-marfim-escuro); }
.lf-partners-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:32px; margin-top:50px; }
.lf-partner img{ width:100%; height:420px; object-fit:cover; object-position:center 20%; display:block; }
.lf-partner .lf-partner-rule{ border-top:2px solid var(--lf-ouro-velho); padding-top:18px; margin-top:0; }
.lf-partner h3{ font-family:var(--lf-font-title); font-size:16px; font-weight:600; margin:0; text-transform:uppercase; }
.lf-partner .lf-role{ font-size:18px; color:var(--lf-pedra); margin-top:6px; }

/* FAQ — core/details */
.lf-faq{ display:grid; grid-template-columns:360px 1fr; gap:70px; }
.lf-faq-intro p{ font-size:20px; line-height:1.5; color:var(--lf-pedra); margin-top:20px; }
.lf-faq-list{ border-top:1px solid var(--lf-linhas); }
.lf-faq-list details{ border-bottom:1px solid var(--lf-linhas); padding:22px 0; }
.lf-faq-list summary{
  font-size:22px; font-weight:700; cursor:pointer; list-style:none; display:flex;
  justify-content:space-between; align-items:center; gap:16px;
}
.lf-faq-list summary::-webkit-details-marker{ display:none; }
.lf-faq-list summary::after{ content:'+'; color:var(--lf-ouro-velho); font-size:26px; flex-shrink:0; }
.lf-faq-list details[open] summary::after{ content:'−'; }
.lf-faq-list .lf-faq-a{ font-size:19px; line-height:1.55; color:var(--lf-pedra); margin-top:14px; max-width:620px; }

/* CTA final */
.lf-cta-band{ position:relative; overflow:hidden; background:var(--lf-petroleo-escuro); background-size:cover; background-position:center 70%; min-height:340px; display:flex; align-items:center; justify-content:center; }
.lf-cta-band-scrim{ position:absolute; inset:0; background:rgba(8,34,32,.78); }
.lf-cta-band-inner{ position:relative; text-align:center; color:var(--lf-marfim); padding:60px 24px; }
.lf-cta-band-inner p{ font-size:21px; color:#D9D2C3; margin-top:14px; }
.lf-cta-ctas{ display:flex; gap:16px; justify-content:center; margin-top:30px; flex-wrap:wrap; }

/* Artigos — Query Loop. A seção do título ("ARTIGOS / Para entender...")
   e o bloco core/query (os cards) são DUAS seções HTML separadas (uma é
   HTML puro, a outra é o bloco nativo) — por isso cada uma trazia seu
   próprio padding vertical de 100px e a soma virava um vão enorme entre
   o título e os cards. A primeira perde o padding de baixo; a segunda
   fica só com o de baixo (110px, batendo com o rodapé). */
.lf-articles-section{ padding-bottom:0 !important; }
.lf-articles-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:20px; flex-wrap:wrap; }
/* display:flow-root (em vez de block) abre um novo bloco de
   formatação — a margem do último filho (o grid de cards) para de
   "vazar" para fora do bloco e empurrar o rodapé para baixo. */
.wp-block-query.lf-articles{ display:flow-root; padding:0 0 110px; margin-bottom:0 !important; }
body.home #primary, body.home .ast-container, body.home .entry-content{
  padding-bottom:0 !important; margin-bottom:0 !important;
}
.lf-articles .wp-block-post-template{ list-style:none; display:grid !important; grid-template-columns:repeat(3,1fr); gap:26px; margin:46px 0 0; padding:0; }
.lf-articles li.wp-block-post{ border:1px solid var(--lf-linhas); background:#FBF8F2; padding:32px; display:flex; flex-direction:column; min-height:230px; margin:0; }
.lf-articles .lf-article-meta{ font-family:var(--lf-font-title); font-size:11px; letter-spacing:0.16em; color:var(--lf-pedra); text-transform:uppercase; }
.lf-articles .wp-block-post-title{ font-family:var(--lf-font-body) !important; font-size:23px; line-height:1.3; font-weight:700; margin:16px 0 0; flex:1; }
.lf-articles .wp-block-post-title a{ text-decoration:none !important; color:var(--lf-petroleo); }
.lf-article-readmore{
  font-family:var(--lf-font-title); font-size:12px; letter-spacing:0.14em; font-weight:600;
  border-top:1px solid var(--lf-linhas); padding-top:16px; margin-top:18px; text-decoration:none !important; display:block;
}
.lf-articles .wp-block-post-date{ text-transform:uppercase; }
.lf-articles .wp-block-post-date time{ font-family:var(--lf-font-title); }

/* Footer */
.lf-footer{ background:var(--lf-petroleo-escuro); color:#D9D2C3; padding:76px 0 0; }
.lf-footer-top{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:44px; padding-bottom:56px; }
.lf-footer-brand p{ font-size:19px; line-height:1.5; margin-top:20px; max-width:300px; }
.lf-footer-col ul{ list-style:none; margin:16px 0 0; padding:0; font-size:19px; line-height:2; }
.lf-footer-col a{ text-decoration:none; color:#D9D2C3; }
.lf-footer-col a:hover{ color:var(--lf-marfim); }
.lf-footer-bottom{ border-top:1px solid #1F4A47; }
.lf-footer-bottom-inner{ display:flex; justify-content:space-between; padding:20px 24px; font-size:15px; color:#A9B5B2; flex-wrap:wrap; gap:10px; }
.lf-footer-bottom-inner a{ text-decoration:underline; color:#A9B5B2; }

/* WhatsApp flutuante */
.lf-whatsapp-float{
  position:fixed; right:28px; bottom:28px; z-index:200; display:flex; align-items:center; gap:12px;
  text-decoration:none;
}
.lf-whatsapp-label{
  background:var(--lf-marfim); color:var(--lf-petroleo); font-family:var(--lf-font-title);
  font-size:13px; font-weight:600; letter-spacing:.05em; padding:10px 16px;
  box-shadow:0 6px 20px rgba(0,0,0,.25); display:none;
}
.lf-whatsapp-circle{
  width:60px; height:60px; border-radius:50%; background:var(--lf-petroleo);
  box-shadow:0 0 0 2px var(--lf-ouro-velho), 0 8px 24px rgba(0,0,0,.35);
  display:flex; align-items:center; justify-content:center;
}
@media (min-width:1024px){ .lf-whatsapp-label{ display:inline-block; } }

/* =========================================================
   Páginas internas (Quem Somos, Serviços, Contato, Blog, Post)
   ========================================================= */
/* :not(.home) — a Home tem sua própria paleta por seção (clara/escura)
   e não pode herdar a cor única das páginas internas. */
.lf-inner .entry-content, body.single .entry-content, body.page:not(.home) .entry-content{
  font-family:var(--lf-font-body); color:var(--lf-petroleo); font-size:21px; line-height:1.6;
}
.lf-inner .entry-content h1, .lf-inner .entry-content h2, .lf-inner .entry-content h3,
body.single .entry-content h1, body.single .entry-content h2, body.single .entry-content h3,
body.page:not(.home) .entry-content h1, body.page:not(.home) .entry-content h2, body.page:not(.home) .entry-content h3{
  font-family:var(--lf-font-title); font-weight:600; color:var(--lf-petroleo); text-transform:uppercase;
}
.lf-inner .entry-content a, body.single .entry-content a, body.page:not(.home) .entry-content a{
  color:var(--lf-petroleo); text-decoration:underline; text-decoration-color:var(--lf-ouro-velho);
}
body.page, body.single, body.blog, body.archive, body.error404{ background:var(--lf-marfim); }

/* Contact Form 7 */
.wpcf7-form input[type=text], .wpcf7-form input[type=email], .wpcf7-form input[type=tel],
.wpcf7-form textarea, .wpcf7-form select{
  font-family:var(--lf-font-body); font-size:19px; border:1px solid var(--lf-linhas) !important;
  background:#fff; padding:14px 16px; width:100%; border-radius:0;
}
.wpcf7-form input[type=submit]{
  font-family:var(--lf-font-title); font-size:13px; font-weight:600; letter-spacing:.12em;
  text-transform:uppercase; background:var(--lf-petroleo); color:var(--lf-marfim); border:0;
  padding:15px 30px; cursor:pointer;
}
.wpcf7-form input[type=submit]:hover{ background:var(--lf-petroleo-escuro); }
.wpcf7-form label{ font-family:var(--lf-font-title); font-size:13px; letter-spacing:.05em; color:var(--lf-pedra); }

/* Blog archive / single (elementos padrão do Astra dentro do conteúdo) */
.ast-article-post .entry-title, .ast-article-single .entry-title{
  font-family:var(--lf-font-title); text-transform:uppercase; color:var(--lf-petroleo);
}
.ast-author-meta, .posted-on, .ast-terms-link-wrap, .entry-meta{ font-family:var(--lf-font-body); color:var(--lf-pedra); }
.entry-meta a, .posted-by a, .posted-on a, .ast-terms-link-wrap a{ color:var(--lf-pedra) !important; text-decoration:none; }

/* =========================================================
   Reskin dos blocos "lf-*" legados (Contato, Quem Somos,
   Nossos Serviços, Nosso Time). Cada uma dessas páginas já trazia
   um bloco HTML fixo com <style id="lf-..."> próprio (identidade
   antiga: vermelho #ea4a3b, "Crimson Text"). Em vez de reescrever a
   estrutura, envolvemos o conteúdo em ".lfs-legacy" (ver funções em
   header/footer) e sobrepomos aqui com a paleta e tipografia novas.
   Especificidade sozinha não basta: a página também herda a regra
   genérica "página interna" (body.page .entry-content h1/h2/h3/a),
   que tem 3 classes/pseudo-classes de peso e vence qualquer seletor
   ".lfs-legacy .algo" mais curto. Por isso as cores aqui usam
   !important — é a única forma de garantir a paleta nova nesses
   blocos herdados, sem reescrever o HTML de cada página.
   ========================================================= */
.lfs-legacy{ font-family:var(--lf-font-body); }
.lfs-legacy .lf-sec h2, .lfs-legacy .lf-form h3{
  font-family:var(--lf-font-title) !important; color:var(--lf-petroleo) !important; text-transform:uppercase; font-weight:600;
}
.lfs-legacy .lf-rule{ background:var(--lf-ouro-velho) !important; height:1.5px !important; width:56px !important; }
.lfs-legacy .lf-lead, .lfs-legacy .lf-texto, .lfs-legacy .lf-texto p{ font-family:var(--lf-font-body); font-size:21px; color:var(--lf-pedra) !important; }
.lfs-legacy .lf-item{ background:var(--lf-marfim-escuro) !important; border:0 !important; border-top:2px solid var(--lf-ouro-velho) !important; }
.lfs-legacy .lf-item h3{ font-family:var(--lf-font-title) !important; color:var(--lf-petroleo) !important; text-transform:uppercase; }
.lfs-legacy .lf-item p{ font-family:var(--lf-font-body); color:var(--lf-pedra) !important; font-size:19px; }
.lfs-legacy .lf-dado{ background:#fff !important; border:1px solid var(--lf-linhas) !important; border-top:2px solid var(--lf-ouro-velho) !important; }
.lfs-legacy .lf-dado strong{ color:var(--lf-pedra) !important; font-family:var(--lf-font-title); }
.lfs-legacy .lf-dado span, .lfs-legacy .lf-dado a{ color:var(--lf-petroleo) !important; font-family:var(--lf-font-body); font-size:19px; text-decoration:none; }
.lfs-legacy .lf-valor{ border-left:2px solid var(--lf-ouro-velho) !important; }
.lfs-legacy .lf-valor h4{ font-family:var(--lf-font-title) !important; color:var(--lf-petroleo) !important; text-transform:uppercase; font-size:16px; }
.lfs-legacy .lf-valor p{ font-family:var(--lf-font-body); color:var(--lf-pedra) !important; font-size:18px; }
.lfs-legacy .lf-form{ background:var(--lf-marfim-escuro) !important; border:0 !important; }
.lfs-legacy .lf-form p.lf-fsub{ font-family:var(--lf-font-body); color:var(--lf-pedra) !important; }
.lfs-legacy .lf-form input[type=text], .lfs-legacy .lf-form input[type=email],
.lfs-legacy .lf-form input[type=tel], .lfs-legacy .lf-form textarea{
  font-family:var(--lf-font-body); border:1px solid var(--lf-linhas) !important; border-radius:0; font-size:19px;
}
.lfs-legacy .lf-form input[type=submit], .lfs-legacy .lf-btn{
  display:inline-block; font-family:var(--lf-font-title) !important; background:var(--lf-petroleo) !important; color:var(--lf-marfim) !important;
  border:1.5px solid var(--lf-petroleo) !important; border-radius:0; padding:15px 26px !important;
  text-transform:uppercase; letter-spacing:.12em; font-size:13px; text-decoration:none !important;
}
.lfs-legacy .lf-form input[type=submit]:hover, .lfs-legacy .lf-btn:hover{ background:var(--lf-petroleo-escuro) !important; border-color:var(--lf-petroleo-escuro) !important; }
.lfs-legacy .lf-fim{ background:var(--lf-petroleo) !important; }
.lfs-legacy .lf-fim h2{ color:var(--lf-marfim) !important; }
.lfs-legacy .lf-fim p{ font-family:var(--lf-font-body); color:#D9D2C3 !important; }
/* Botão dentro da banda escura (.lf-fim = fundo petróleo): a regra acima
   pinta o botão da MESMA cor do fundo — fica invisível ("VER O TIME" sem
   contorno). Em fundo escuro vira contorno dourado com texto marfim. */
.lfs-legacy .lf-fim .lf-btn{
  background:transparent !important; color:var(--lf-marfim) !important;
  border-color:var(--lf-ouro-velho) !important;
}
.lfs-legacy .lf-fim .lf-btn:hover{ background:rgba(179,148,96,.15) !important; border-color:var(--lf-ouro-velho) !important; }

/* Nosso Time (page 176) — cartão novo */
.lfs-legacy .lf-pessoa{ background:transparent !important; border:0 !important; text-align:left; padding-bottom:0; }
.lfs-legacy .lf-pessoa img{ height:auto; aspect-ratio:3/4; object-position:center 15%; filter:none !important; }
.lfs-legacy .lf-pessoa h3{ font-family:var(--lf-font-title) !important; text-transform:uppercase; color:var(--lf-petroleo) !important; border-top:2px solid var(--lf-ouro-velho) !important; padding-top:18px; margin-top:0; }
.lfs-legacy .lf-pessoa .lf-cargo{ color:var(--lf-pedra) !important; font-family:var(--lf-font-body); font-size:18px; letter-spacing:0; text-transform:none; font-weight:500; }
.lfs-legacy .lf-pessoa p:not(.lf-cargo){ font-family:var(--lf-font-body); font-size:19px; color:var(--lf-pedra) !important; }

/* =========================================================
   Responsivo
   ========================================================= */
@media (max-width:1023px){
  .lf-menu{ display:none; }
  /* item HIGH #1: o botão de menu tem classe .lf-btn, que também é usada
     por HTML legado de outras páginas com "display:inline-block" solto
     (fora de .lfs-legacy) — isso empata/ganha do display:none simples.
     !important + seletor mais específico fecham essa brecha. */
  .lf-header .lf-nav-cta{ display:none !important; }
  .lf-hamburger{ display:flex; }
  .lf-mobile-menu.is-open{
    display:block; background:var(--lf-marfim); border-top:1px solid var(--lf-linhas);
    padding:20px 24px 28px;
  }
  .lf-mobile-menu-list{ list-style:none; margin:0 0 20px; padding:0; }
  .lf-mobile-menu-list li{ border-bottom:1px solid var(--lf-linhas); }
  .lf-mobile-menu-list a{
    display:block; padding:16px 0; font-family:var(--lf-font-title); font-size:14px;
    letter-spacing:.1em; text-transform:uppercase; text-decoration:none; color:var(--lf-petroleo);
  }
  .lf-mobile-cta{ display:block; text-align:center; }

  .lf-hero-inner{ flex-direction:column; align-items:flex-start; padding:56px 0; gap:24px; }
  .lf-hero-title{ font-size:38px; }
  .lf-hero-sub{ font-size:20px; }
  /* seal pequeno ACIMA do texto no mobile (como no SiteCelular.dc.html),
     em vez de escondido — reordenado só por flex, sem mexer no HTML. */
  .lf-hero-seal{
    display:block; order:-1; width:64px; opacity:1; margin-bottom:4px;
  }
  .lf-office-grid, .lf-faq{ grid-template-columns:1fr; gap:40px; }
  .lf-office-photos{ margin:0 auto; }
  .lf-steps{ grid-template-columns:1fr 1fr; }
  .lf-partners-grid{ grid-template-columns:1fr 1fr; }
  .lf-partners-grid .lf-partner:nth-child(3){ grid-column:1 / span 2; max-width:50%; }
  .lf-articles .wp-block-post-template{ grid-template-columns:1fr; }
  .lf-footer-top{ grid-template-columns:1fr 1fr; }
  .lf-section{ padding:64px 0; }
}
@media (max-width:600px){
  .lf-wrap{ padding:0 20px; }
  .lf-topbar-inner{ font-size:12px; }
  .lf-h2{ font-size:28px; }
  .lf-steps{ grid-template-columns:1fr; }
  .lf-footer-top{ grid-template-columns:1fr; }
  .lf-whatsapp-circle{ width:52px; height:52px; }

  /* item HIGH #5: as duas fotos absolutas (260px cada) não cabem numa
     caixa de ~350px — empilha e deixa fluido. */
  .lf-office-photos{ aspect-ratio:auto; max-width:none; display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
  .lf-office-photos .lf-frame{ display:none; }
  .lf-office-photos img[class]{ position:static; width:100%; aspect-ratio:3 / 4; transform:none; box-shadow:none !important; }

  /* item LOW: áreas no mobile = 1 card em destaque + 3 da lista + "+4
     ÁREAS" (como no SiteCelular.dc.html) — não repete as que já
     aparecem, por isso esconde os 2 cards extras E os 2 últimos itens
     da lista, deixando exatamente 1 + 3 visíveis e 4 resumidos. */
  .lf-areas-grid{ grid-template-columns:1fr; }
  .lf-areas-grid .lf-area-card:nth-child(2),
  .lf-areas-grid .lf-area-card:nth-child(3){ display:none; }
  .lf-areas-list{ grid-template-columns:1fr; }
  .lf-areas-list .lf-areas-list-item:nth-child(4):not(.lf-areas-more),
  .lf-areas-list .lf-areas-list-item:nth-child(5):not(.lf-areas-more){ display:none; }
  .lf-areas-list .lf-areas-list-item.lf-areas-more{ display:flex !important; }

  /* item LOW: sócios em carrossel horizontal com scroll-snap */
  .lf-partners-grid{
    display:flex; grid-template-columns:none; overflow-x:auto; scroll-snap-type:x mandatory;
    gap:20px; margin-left:-20px; margin-right:-20px; padding:0 20px 8px;
    -webkit-overflow-scrolling:touch;
  }
  .lf-partners-grid .lf-partner{
    flex:0 0 78%; scroll-snap-align:start; grid-column:auto; max-width:none;
  }
}
/* a lista de áreas só mostra "+N ÁREAS" no mobile — regra base ANTES do
   media query acima, para não vencer o display:flex por ordem no arquivo
   (mesma especificidade: quem vem depois ganha). */

/* =========================================================
   Blindagem contra colisão de nomes
   Algumas páginas internas (Contato, Nosso Time) já trazem HTML
   antigo com classes genéricas ".lf-btn" próprias (herdadas de uma
   configuração anterior). Isso pode empatar em especificidade com
   os componentes globais do header/rodapé/whatsapp e, por ordem no
   documento, vencer. Estas regras garantem que os elementos GLOBAIS
   (aparecem em toda página) sempre apliquem a identidade nova.
   ========================================================= */
.lf-header .lf-nav-cta,
.lf-header .lf-mobile-cta{
  background:var(--lf-petroleo) !important;
  color:var(--lf-marfim) !important;
  border-color:transparent !important;
}
.lf-whatsapp-circle{ background:var(--lf-petroleo) !important; }
.lf-whatsapp-label{ background:var(--lf-marfim) !important; color:var(--lf-petroleo) !important; }

/* =========================================================
   Blog — listagem (home.php, page_for_posts) e post único (single.php)
   ========================================================= */
.lf-blog-head{ padding-bottom:0; }
.lf-blog-grid-section{ padding-top:56px; }
.lf-blog-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:30px;
}
.lf-blog-card{
  /* O tema pai Astra aplica ".ast-article-post{width:33.33%}" (grid de
     blog dele, pensado para um container flex próprio) em todo <article>
     de post — como nosso card já é 1 coluna de UM grid CSS nosso, isso
     encolhia o card para ~1/3 da coluna. Reset explícito aqui. */
  width:100% !important; max-width:none !important; min-width:0; float:none !important;
  padding:0 !important; margin-bottom:0 !important;
  background:#FBF8F2; border:1px solid var(--lf-linhas);
  display:flex; flex-direction:column; overflow:hidden;
}
.lf-blog-card-link{ display:flex; flex-direction:column; height:100%; color:inherit; }
.lf-blog-card-img{ width:100%; aspect-ratio:16/9; overflow:hidden; background:var(--lf-marfim-escuro); }
.lf-blog-card-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.lf-blog-card-body{ padding:26px 28px 30px; display:flex; flex-direction:column; flex:1; }
.lf-blog-card-title{
  font-family:var(--lf-font-body); font-weight:700; font-size:26px; line-height:1.25;
  color:var(--lf-petroleo); margin:14px 0 10px;
}
.lf-blog-card-excerpt{ font-size:17px; line-height:1.55; color:var(--lf-pedra); flex:1; }
.lf-blog-card .lf-article-readmore{
  display:inline-block; margin-top:18px; font-family:var(--lf-font-title); font-size:12px;
  letter-spacing:0.14em; text-transform:uppercase; color:var(--lf-petroleo);
  border-bottom:1.5px solid var(--lf-ouro-velho); padding-bottom:3px; align-self:flex-start;
}

/* Paginação (the_posts_pagination) na identidade petróleo/ouro */
.lf-blog-pagination{ margin-top:56px; }
.lf-blog-pagination .nav-links{
  display:flex; justify-content:center; align-items:center; gap:8px; flex-wrap:wrap;
}
.lf-blog-pagination .page-numbers{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:40px; height:40px; padding:0 10px;
  font-family:var(--lf-font-title); font-size:13px; letter-spacing:0.04em;
  color:var(--lf-petroleo); border:1.5px solid var(--lf-linhas); text-decoration:none !important;
}
.lf-blog-pagination .page-numbers.current{
  background:var(--lf-petroleo); color:var(--lf-marfim) !important; border-color:var(--lf-petroleo);
}
.lf-blog-pagination .page-numbers:not(.current):hover{ border-color:var(--lf-ouro-velho); }
.lf-blog-pagination .page-numbers.dots{ border:0; }

/* Post único — mesmo reset do ".ast-article-post{width:33.33%}" do tema pai */
.lf-single-post{ width:100% !important; max-width:none !important; float:none !important; }
.lf-single-hero{
  width:100%; max-width:1200px; margin:0 auto; aspect-ratio:16/9; overflow:hidden;
  background:var(--lf-marfim-escuro);
}
.lf-single-hero img{ width:100%; height:100%; object-fit:cover; display:block; }
.lf-single-head{ padding:44px 0 8px; }
.lf-single-content{ max-width:760px; font-size:19px; line-height:1.75; color:var(--lf-petroleo); }
.lf-single-content p{ margin:0 0 22px; }
.lf-single-content img{ max-width:100%; height:auto; }
.lf-single-back{ max-width:760px; margin-top:8px; text-align:left; }

@media (max-width:900px){
  .lf-blog-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:600px){
  .lf-blog-grid{ grid-template-columns:1fr; }
  .lf-blog-card-title{ font-size:23px; }
}