/* Complementos do CMS; a revisão visual aprovada permanece em revisao.css. */
.blog-filters a.filter-btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
.publication-grid-unfeatured{margin-top:0}
.publication-without-image.publication-featured,.archive-item.publication-without-image{grid-template-columns:1fr}
.publication-without-image .publication-copy{padding-top:0}
.reading-without-image{grid-template-columns:1fr}
.editorial-empty{padding:32px 0;color:var(--text-mid);line-height:1.75}
.editorial-empty p{margin-bottom:16px}
.editorial-empty a{color:#963b36;text-decoration:underline;text-underline-offset:4px}
.editorial-pagination{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid #d8d6d1;padding-top:24px;margin-top:36px;font-size:.9rem}
.editorial-pagination a,.editorial-pagination .pagination-disabled{padding:10px 0;min-height:44px;display:inline-flex;align-items:center}
.editorial-pagination a{color:#963b36;text-decoration:underline;text-underline-offset:4px}
.pagination-disabled{color:#73736e}
.pagination-current{text-align:center;color:var(--text-mid)}
.preview-notice{display:flex;align-items:center;justify-content:space-between;gap:24px;background:#f4e5df;color:#38231f;border-left:3px solid #ad5b4f;padding:18px 20px;margin-bottom:28px;font-size:.88rem}
.preview-notice strong{font-family:var(--font-body);font-size:.9rem}
.preview-notice p{font-size:.85rem;line-height:1.5;margin:6px 0 0}
.preview-notice a{white-space:nowrap;color:#6e312a;text-decoration:underline;text-underline-offset:4px;padding-block:10px;min-height:44px}
.content-prose{overflow-wrap:anywhere}
.publication-copy h3,.archive-copy h2,.reading-intro h1{overflow-wrap:anywhere}
.content-prose blockquote{border-left:3px solid #bf7667;margin:28px 0;padding:4px 0 4px 24px;font-style:italic}
.content-prose ol{padding-left:24px}
.content-prose a{text-decoration:underline;text-underline-offset:3px}
@media(max-width:768px){.reading-without-image{grid-template-columns:1fr}.reading-without-image .publication-meta{grid-column:1/-1}.preview-notice{align-items:flex-start;flex-direction:column;gap:8px}.editorial-pagination{font-size:.8rem;gap:10px}.editorial-pagination a,.editorial-pagination .pagination-disabled{white-space:nowrap}}

/* Revisão 12/10/2026: contatos reais e coluna de contato no rodapé */
.contact-details p + p { margin-top: 18px; }
.contact-details a { color: #fff; text-decoration: underline; text-decoration-color: rgba(255,255,255,.4); text-underline-offset: 4px; }
.contact-details a:hover { text-decoration-color: var(--coral); }

/* Rodapé escuro (12/10/2026) */
.site-footer { background: #080808; color: rgba(255,255,255,.72); padding: 72px 0 0; border-top: 1px solid rgba(255,255,255,.08); }
.site-footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.25fr; gap: 48px; margin-bottom: 56px; }
.site-footer-brand img { display: block; width: 203px; height: auto; margin-bottom: 20px; }
.site-footer-brand p { font-size: .9rem; line-height: 1.7; color: rgba(255,255,255,.62); max-width: 30ch; margin: 0; }
.site-footer-brand .site-footer-oab { display: inline-flex; align-items: center; gap: 8px; margin-top: 20px; font-size: .75rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: rgba(255,255,255,.72); max-width: none; }
.site-footer-oab svg { width: 16px; height: 16px; color: var(--gold); flex-shrink: 0; }
.site-footer-col h2 { font-family: var(--font-body); font-size: .75rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.7); margin: 0 0 20px; }
.site-footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 12px; margin: 0; padding: 0; }
.site-footer-col a { color: rgba(255,255,255,.72); font-size: .9rem; transition: color 200ms; }
.site-footer-col a:hover { color: #fff; }
.site-footer address { font-style: normal; font-size: .9rem; line-height: 1.6; color: rgba(255,255,255,.72); }
.site-footer-bottom { border-top: 1px solid rgba(255,255,255,.08); padding: 24px 0; display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; font-size: .8125rem; color: rgba(255,255,255,.55); }
.site-footer-bottom p { margin: 0; max-width: none; }
.site-footer-bottom nav { display: flex; gap: 24px; flex-wrap: wrap; }
.site-footer-bottom a { color: rgba(255,255,255,.55); transition: color 200ms; }
.site-footer-bottom a:hover { color: #fff; }
.site-footer a:focus-visible { outline: 2px solid var(--coral); outline-offset: 3px; }
@media (max-width: 900px) { .site-footer-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 580px) {
  .site-footer { padding-top: 56px; }
  .site-footer-grid { grid-template-columns: 1fr; gap: 36px; margin-bottom: 40px; }
  .site-footer-col a { display: inline-block; padding: 6px 0; }
  .site-footer-bottom { flex-direction: column; align-items: flex-start; }
  .site-footer-bottom a { display: inline-block; padding: 8px 0; }
}

/* Hero com Têmis girando na rolagem (desktop; ativado pelo themis.js) */
.hero-photo, .hero-themis { display: none; }
@media (min-width: 769px) {
  .hero.themis-on { background-image: none; background-color: #0b0907; height: 100vh; height: 100svh; max-height: none; }
  .hero.themis-on .hero-photo {
    display: block; position: absolute; inset: 0; z-index: 0;
    background: url('/Imagens/Carolina%20Perut%20Advogada.png') 79% top / cover no-repeat;
  }
  .hero.themis-on .hero-overlay { z-index: 1; }
  .hero.themis-on .hero-themis {
    display: block; position: absolute; left: 50%; top: 7%; height: 100%; aspect-ratio: 480 / 900;
    z-index: 2; pointer-events: none; mix-blend-mode: screen; will-change: transform, opacity;
    /* a base passa da borda inferior da tela e se dissolve no escuro */
    -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 74%, transparent 95%);
    mask-image: linear-gradient(to bottom, #000 0%, #000 74%, transparent 95%);
  }
  .hero.themis-on .hero-themis canvas { display: block; width: 100%; height: 100%; animation: themis-in 1.4s ease-out both; }
}
@keyframes themis-in { from { opacity: 0; } to { opacity: 1; } }

/* Mobile: começa grande no centro, gira, e termina com meia estátua discreta à direita, atrás do texto */
@media (max-width: 768px) {
  .hero.themis-mobile .hero-themis {
    display: block; position: absolute; right: 0; bottom: 0; height: 400px; max-height: 62%; aspect-ratio: 480 / 900;
    z-index: 1; pointer-events: none; mix-blend-mode: screen; will-change: transform, opacity;
    --mtop: 0%; --mbot: 93%; /* esmaecido do topo e da base; animados pelo themis.js (base some na abertura) */
    -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 var(--mtop), #000 var(--mbot), transparent 100%);
    mask-image: linear-gradient(to bottom, transparent 0%, #000 var(--mtop), #000 var(--mbot), transparent 100%);
  }
  .hero.themis-mobile .hero-themis canvas { display: block; width: 100%; height: 100%; animation: themis-in 1.4s ease-out both; }
  .hero.themis-mobile .hero-content-z { position: relative; z-index: 5; }
  .hero.themis-mobile .hero-mobile-media { z-index: 2; } /* a estátua passa por trás da foto ao descer */
}

/* Aviso "Role para baixo" no hero com a Têmis (18/10/2026): no início só a estátua aparece e não ficava claro
   que o site continua. Discreto, em dourado; o themis.js o apaga quando a rolagem começa. Sem a Têmis
   ("reduzir movimento" ou sem JS) não aparece, porque o hero já mostra o texto. */
.hero-scroll-hint { display: none; }
.hero.themis-on .hero-scroll-hint, .hero.themis-mobile .hero-scroll-hint {
  display: block; position: absolute; left: 50%; z-index: 6; transform: translateX(-50%); pointer-events: none;
  /* at the bottom of the screen (the hero is pinned at the top; on the phone it is taller than the screen) */
  top: calc(100vh - 84px); top: calc(100svh - 84px - env(safe-area-inset-bottom, 0px));
}
.hero-scroll-hint-in {
  display: flex; flex-direction: column; align-items: center; gap: 12px;
  font: 600 .68rem/1 var(--font-body); letter-spacing: .24em; text-transform: uppercase; color: var(--gold-light);
  text-shadow: 0 1px 8px rgba(0,0,0,.6); animation: themis-in 1.2s .9s ease-out both;
}
.hero-scroll-hint-icon { position: relative; width: 22px; height: 34px; border: 1.5px solid rgba(232,213,163,.75); border-radius: 12px; }
.hero-scroll-hint-icon::before {
  content: ""; position: absolute; left: 50%; top: 7px; width: 3px; height: 7px; margin-left: -1.5px; border-radius: 2px;
  background: var(--gold-light); animation: hint-wheel 1.9s ease-in-out infinite;
}
@keyframes hint-wheel {
  0% { opacity: 0; transform: translateY(0); } 25% { opacity: 1; }
  70% { opacity: 1; transform: translateY(10px); } 100% { opacity: 0; transform: translateY(12px); }
}
/* toque (celular, tablet): seta em vez do mouse */
@media (hover: none) {
  .hero-scroll-hint-icon { width: 14px; height: 14px; border: 0; border-radius: 0;
    border-right: 1.5px solid var(--gold-light); border-bottom: 1.5px solid var(--gold-light);
    transform: rotate(45deg); animation: hint-arrow 1.9s ease-in-out infinite; }
  .hero-scroll-hint-icon::before { content: none; }
}
@keyframes hint-arrow { 0%, 100% { translate: 0 -3px; opacity: .55; } 50% { translate: 0 4px; opacity: 1; } }
/* computador e tablet deitado (19/10/2026, pedido do usuário): no centro o aviso caía sobre a base da estátua.
   Fica no canto de baixo à esquerda, alinhado à margem do conteúdo (a logo e o texto que entra depois), na
   altura do botão do WhatsApp do canto direito. Quando a estátua desliza para a esquerda, o aviso já sumiu. */
@media (min-width: 769px) {
  .hero.themis-on .hero-scroll-hint { left: calc(max(0px, (100% - 1240px) / 2) + 48px); transform: none;
    top: calc(100vh - 73px); top: calc(100svh - 73px - env(safe-area-inset-bottom, 0px)); }
  .hero.themis-on .hero-scroll-hint-in { flex-direction: row; gap: 14px; }
}
@media (min-width: 769px) and (max-width: 1100px) {
  .hero.themis-on .hero-scroll-hint { left: 32px; }
}
/* computador: um pouco maior, para ser notado */
@media (min-width: 769px) and (hover: hover) {
  .hero-scroll-hint-in { font-size: .76rem; gap: 14px; }
  .hero-scroll-hint-icon { width: 26px; height: 40px; border-radius: 14px; }
  .hero-scroll-hint-icon::before { top: 8px; height: 8px; }
}
@media (max-width: 768px) { .hero.themis-mobile .hero-scroll-hint { top: calc(100vh - 60px); top: calc(100svh - 60px - env(safe-area-inset-bottom, 0px)); } }

/* Botão flutuante do WhatsApp (todas as páginas públicas). Abaixo do menu mobile (z-index 200). */
.whatsapp-fab {
  position: fixed; right: 24px; bottom: calc(24px + env(safe-area-inset-bottom, 0px)); z-index: 150;
  display: inline-flex; align-items: center; gap: 12px; text-decoration: none;
}
.whatsapp-fab-icon {
  width: 58px; height: 58px; border-radius: 50%; background: #25D366; color: #fff;
  display: grid; place-items: center; box-shadow: 0 8px 24px rgba(0,0,0,.28);
  transition: transform 200ms ease, box-shadow 200ms ease;
}
.whatsapp-fab-icon svg { width: 30px; height: 30px; }
.whatsapp-fab-label {
  background: #111; color: #fff; font: 600 .82rem/1 var(--font-body); letter-spacing: .01em;
  padding: 11px 16px; border-radius: 999px; border: 1px solid rgba(255,255,255,.16);
  box-shadow: 0 6px 20px rgba(0,0,0,.25); white-space: nowrap;
}
.whatsapp-fab:hover .whatsapp-fab-icon { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(0,0,0,.32); }
.whatsapp-fab:focus-visible { outline: none; }
.whatsapp-fab:focus-visible .whatsapp-fab-icon { outline: 3px solid #fff; outline-offset: 3px; }
@media (max-width: 768px) {
  .whatsapp-fab { right: 16px; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); }
  .whatsapp-fab-label { display: none; }
  .whatsapp-fab-icon { width: 54px; height: 54px; }
}
@media (prefers-reduced-motion: reduce) { .whatsapp-fab-icon { transition: none; } }
@media print { .whatsapp-fab { display: none; } }

/* Palavras do título do hero animadas uma a uma pelo themis.js (sem JS ficam no lugar normal) */
.hero h1 .hw { display: inline-block; }

/* Páginas de área: grade de tópicos e FAQ em fundo claro (mesmo desenho do FAQ da home) */
.topic-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 40px; margin: 24px 0 8px; }
.topic { padding: 22px 0; border-top: 1px solid #d8d6d1; }
.content-prose .topic h3 { margin: 0 0 8px; font-size: 1.15rem; }
.topic p { margin: 0; font-size: .95rem; line-height: 1.7; color: var(--text-mid); }
@media (max-width: 640px) { .topic-grid { grid-template-columns: 1fr; } }
.area-faq { margin-top: 48px; }
.area-faq .faq-list { border-top-color: #d8d6d1; }
.area-faq .faq-item { border-bottom-color: #d8d6d1; }
.area-faq .faq-item summary { color: var(--text-dark); }
.area-faq .faq-item summary:hover, .area-faq .faq-item[open] summary { color: #a63232; }
.area-faq .faq-item summary:focus-visible { outline-color: #a63232; }
.area-faq .faq-toggle { color: #a63232; }
.area-faq .faq-answer { color: var(--text-mid); }

/* Espaçamento: o topo das páginas internas já tem respiro embaixo; a 1ª seção não soma mais 96 px */
.page-header + .section { padding-top: 56px; }
@media (max-width: 768px) { .page-header + .section { padding-top: 40px; } }

/* Footer: keep the lawyer's name and OAB number on the same line */
.footer-nowrap { white-space: nowrap; }

/* Images placed in the article text with the panel's "Inserir imagem" button (19/10/2026) */
.content-prose .article-image { margin: 2em 0; }
.content-prose .article-image img { display: block; width: 100%; height: auto; border-radius: 6px; background: #f3f2ef; }
