/* ============================================================
   ALMEIDA, LEAL & MOLINA ADVOGADOS — Folha de estilos principal
   Base: design system BMS (padrão Clínica HE), re-tokenizado.

   Direção visual
   - A cor de fundo das seções de pessoas (--slate) foi tirada do
     próprio fundo das fotos de estúdio: os retratos "fundem" com a
     página, como se o visitante estivesse no estúdio com a equipe.
   - Paleta fria e sóbria (tinta, ardósia, pedra); o latão aparece
     só em fios, estados ativos e no CTA principal.
   - Newsreader (serifa editorial com tamanhos ópticos) nos títulos;
     Source Sans 3 (alta legibilidade) nos textos.
   - Raios mínimos (2px), sem sombras de "card" genérico.
   Mobile-first.
   ============================================================ */

:root {
  --ink: #121c26;          /* tinta — cabeçalho sólido, contato, rodapé */
  --slate: #1f2b34;        /* ardósia — mesmo tom do fundo das fotos */
  --slate-2: #2a3a46;      /* ardósia clara — superfícies sobre a ardósia */
  --stone: #eceeec;        /* pedra — fundo alternado */
  --paper: #fafaf8;        /* papel — fundo base */
  --brass: #a8895a;        /* latão — acento, com parcimônia */
  --brass-light: #c9b088;
  --text: #1b242c;
  --muted: #56626c;
  --line: #d6dbd8;
  --on-dark: #e9edef;
  --on-dark-muted: #a6b2ba;
  --line-dark: rgba(233, 237, 239, 0.16);

  --font-titulo: "Newsreader", "Iowan Old Style", Georgia, "Times New Roman", serif;
  --font-texto: "Source Sans 3", "Segoe UI", system-ui, -apple-system, sans-serif;

  --radius: 2px;
  --container: 1200px;
  --header-h: 76px;

  --text-display: clamp(2.6rem, 1.2rem + 5.6vw, 5.4rem);
  --text-3xl: clamp(1.9rem, 1.3rem + 2.2vw, 3rem);
  --text-2xl: clamp(1.45rem, 1.2rem + 0.9vw, 1.9rem);
  --text-xl: 1.3rem;
  --text-lg: clamp(1.06rem, 1rem + 0.3vw, 1.2rem);
  --text-base: 1.0625rem;
  --text-sm: 0.94rem;
  --text-xs: 0.82rem;

  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-fast: 0.22s;
  --dur-med: 0.4s;
  --dur-slow: 0.8s;

  --section-pad: clamp(72px, 10vw, 136px);
}

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h) + 12px); -webkit-text-size-adjust: 100%; }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: hidden; }
body {
  margin: 0;
  font-family: var(--font-texto);
  font-size: var(--text-base);
  line-height: 1.65;
  color: var(--text);
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
body.is-locked { overflow: hidden; }
img, svg, video, picture { max-width: 100%; display: block; }
img { height: auto; }
a { color: inherit; text-decoration: none; }
ul, ol { margin: 0; padding: 0; list-style: none; }
p { margin: 0 0 1em; }
address { font-style: normal; }
button { font: inherit; color: inherit; }
h1, h2, h3, h4 {
  font-family: var(--font-titulo);
  font-weight: 500;
  line-height: 1.12;
  letter-spacing: -0.012em;
  margin: 0 0 0.55em;
  text-wrap: balance;
  font-optical-sizing: auto;
}
h3, h4 { line-height: 1.25; letter-spacing: -0.005em; }
.amp { font-style: italic; font-weight: 400; }

.container { width: 100%; max-width: var(--container); margin-inline: auto; padding-inline: clamp(20px, 4vw, 40px); }

.skip-link {
  position: absolute; left: 12px; top: -60px; z-index: 1000;
  background: var(--ink); color: #fff; padding: 10px 16px; border-radius: var(--radius);
}
.skip-link:focus { top: 12px; }

:focus-visible { outline: 2px solid var(--brass); outline-offset: 3px; }
.section--slate :focus-visible, .section--ink :focus-visible, .hero :focus-visible, .footer :focus-visible { outline-color: var(--brass-light); }
::selection { background: rgba(168, 137, 90, 0.28); }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* ============================================================
   BOTÕES
   ============================================================ */
.btn {
  --bh: 48px;
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: var(--bh); padding: 0 24px;
  font-family: var(--font-texto); font-weight: 600; font-size: 0.98rem; letter-spacing: 0.01em;
  border: 1px solid transparent; border-radius: var(--radius);
  cursor: pointer; white-space: nowrap;
  transition: background-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease),
              border-color var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease);
}
.btn:active { transform: scale(0.985); }
.btn--lg { --bh: 54px; padding: 0 30px; font-size: 1.02rem; }
.btn--brass { background: var(--brass); color: #10171e; }
.btn--brass:hover { background: var(--brass-light); }
.btn--ghost { border-color: rgba(255, 255, 255, 0.45); color: #fff; background: rgba(18, 28, 38, 0.18); backdrop-filter: blur(6px); }
.btn--ghost:hover { border-color: #fff; background: rgba(255, 255, 255, 0.1); }
.btn--line { border-color: currentColor; color: inherit; background: transparent; }
.btn--line:hover { border-color: var(--brass); color: var(--brass); }
.btn--line-dark { border-color: var(--text); color: var(--text); background: transparent; }
.btn--line-dark:hover { background: var(--ink); color: #fff; border-color: var(--ink); }
.btn--sm { --bh: 40px; padding: 0 16px; font-size: 0.9rem; }
.btn[disabled] { opacity: 0.5; cursor: not-allowed; }

.link-arrow {
  display: inline-block; font-weight: 600; padding-bottom: 4px;
  background: linear-gradient(currentColor, currentColor) 0 100% / 100% 1px no-repeat;
  transition: background-size var(--dur-med) var(--ease), color var(--dur-fast);
}
.link-arrow:hover { color: var(--brass); background-size: 40% 1px; }

/* ============================================================
   HEADER
   ============================================================ */
.header {
  position: fixed; inset: 0 0 auto 0; z-index: 100;
  height: var(--header-h);
  color: #fff;
  transition: background-color var(--dur-med) var(--ease), transform var(--dur-med) var(--ease), border-color var(--dur-med);
  border-bottom: 1px solid transparent;
}
.header__inner { height: 100%; display: flex; align-items: center; justify-content: space-between; }
.header--scrolled { background: rgba(8, 13, 19, 0.94); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom-color: var(--line-dark); }
.header--hidden { transform: translateY(-100%); }
/* Menu aberto: sem backdrop-filter (ele criaria um containing block e
   prenderia o painel fixo do menu à altura do header) */
.header--nav-open, .header--nav-open.header--scrolled { background: var(--ink); -webkit-backdrop-filter: none; backdrop-filter: none; }

.logo { display: flex; flex-direction: column; line-height: 1; }
.logo__name { font-family: var(--font-titulo); font-size: 1.32rem; font-weight: 500; letter-spacing: -0.01em; white-space: nowrap; }
.logo__sub { font-size: 0.78rem; letter-spacing: 0.22em; margin-top: 6px; color: var(--brass-light); padding-left: 1px; }
@media (max-width: 420px) { .logo__name { font-size: 1.12rem; } }

/* Único controle de navegação sempre visível: uma palavra + ícone no
   canto. Nada de barra fixa com lista de links — o menu só aparece
   quando o visitante pede. */
.menu-toggle { display: inline-flex; align-items: center; gap: 12px; background: none; border: 0; color: #fff; cursor: pointer; padding: 10px 0 10px 10px; margin-right: -10px; }
.menu-toggle__label { font-size: 0.82rem; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; }
.menu-toggle__icon { width: 26px; height: 16px; position: relative; }
.menu-toggle__icon span {
  position: absolute; left: 0; width: 100%; height: 1.5px; background: currentColor;
  transition: transform var(--dur-med) var(--ease), opacity var(--dur-fast), top var(--dur-med) var(--ease);
}
.menu-toggle__icon span:nth-child(1) { top: 0; }
.menu-toggle__icon span:nth-child(2) { top: 50%; margin-top: -0.75px; }
.menu-toggle__icon span:nth-child(3) { top: 100%; margin-top: -1.5px; }
.menu-toggle[aria-expanded="true"] .menu-toggle__icon span:nth-child(1) { top: 50%; margin-top: -0.75px; transform: rotate(45deg); }
.menu-toggle[aria-expanded="true"] .menu-toggle__icon span:nth-child(2) { opacity: 0; }
.menu-toggle[aria-expanded="true"] .menu-toggle__icon span:nth-child(3) { top: 50%; margin-top: -0.75px; transform: rotate(-45deg); }

/* ============================================================
   MENU — painel lateral escuro em tela cheia (mesmo motivo visual
   do painel de perfil), links em escala editorial e numerados,
   igual ao resto do site. Substitui a barra de navegação fixa,
   em qualquer tamanho de tela.
   ============================================================ */
.nav-drawer { position: fixed; inset: 0; z-index: 150; }
.nav-drawer[hidden] { display: none; }
.nav-drawer__backdrop { position: absolute; inset: 0; background: rgba(4, 7, 10, 0.72); opacity: 0; transition: opacity var(--dur-med) var(--ease); }
.nav-drawer__panel {
  position: absolute; top: 0; right: 0; bottom: 0; width: min(560px, 100%);
  background: var(--ink); color: #fff; display: flex; flex-direction: column;
  padding: 0 clamp(28px, 5vw, 56px) clamp(28px, 4vw, 44px);
  overflow-y: auto; overscroll-behavior: contain;
  transform: translateX(100%); transition: transform 0.6s var(--ease);
}
.nav-drawer.is-open .nav-drawer__backdrop { opacity: 1; }
.nav-drawer.is-open .nav-drawer__panel { transform: none; }
.nav-drawer__head { display: flex; align-items: center; justify-content: space-between; height: var(--header-h); flex: none; }
.nav-drawer__close {
  width: 44px; height: 44px; display: grid; place-items: center; background: none; color: #fff;
  border: 1px solid var(--line-dark); border-radius: 50%; cursor: pointer;
  transition: border-color var(--dur-fast), transform var(--dur-med) var(--ease);
}
.nav-drawer__close:hover { border-color: var(--brass-light); transform: rotate(90deg); }

.nav-drawer__list { flex: 1; display: flex; flex-direction: column; justify-content: center; padding: 24px 0; }
.nav-drawer__link {
  display: flex; align-items: baseline; gap: 18px; padding: 14px 0;
  border-bottom: 1px solid var(--line-dark); color: rgba(255, 255, 255, 0.82);
  font-family: var(--font-titulo); font-size: clamp(1.6rem, 1rem + 3vw, 2.7rem); font-weight: 400;
  transition: color var(--dur-fast), padding-left var(--dur-med) var(--ease);
}
.nav-drawer__list li:first-child .nav-drawer__link { border-top: 1px solid var(--line-dark); }
.nav-drawer__index { font-family: var(--font-texto); font-size: 0.76rem; font-weight: 600; letter-spacing: 0.06em; color: var(--brass-light); transition: color var(--dur-fast); }
.nav-drawer__link:hover, .nav-drawer__link.is-active, .nav-drawer__link:focus-visible { color: #fff; padding-left: 10px; }
.nav-drawer__link:hover .nav-drawer__index, .nav-drawer__link.is-active .nav-drawer__index { color: #fff; }

.nav-drawer__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 24px; padding-top: 22px; border-top: 1px solid var(--line-dark); flex: none; }
.nav-drawer__admin { font-size: 0.8rem; color: var(--on-dark-muted); transition: color var(--dur-fast); }
.nav-drawer__admin:hover { color: #fff; }

@media (max-width: 599px) {
  .menu-toggle__label { display: none; }
  .nav-drawer__panel { padding-inline: 22px; }
}

/* ============================================================
   PRELOADER
   ============================================================ */
.preloader {
  position: fixed; inset: 0; z-index: 999; display: grid; place-items: center;
  background: var(--ink); color: #fff;
  transition: opacity 0.55s var(--ease), visibility 0s linear 0.55s;
  animation: preloader-auto 0.01s linear 2.2s forwards; /* fallback sem JS */
}
.preloader__mark { font-family: var(--font-titulo); font-size: clamp(1.4rem, 1rem + 2vw, 2.2rem); opacity: 0; animation: preloader-in 0.7s var(--ease) 0.05s forwards; }
.preloader.is-done { opacity: 0; visibility: hidden; }
@keyframes preloader-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes preloader-auto { to { opacity: 0; visibility: hidden; } }
@media (prefers-reduced-motion: reduce) { .preloader { display: none; } }

/* ============================================================
   HERO
   ============================================================ */
.hero {
  position: relative; min-height: 100svh; display: flex; flex-direction: column; justify-content: flex-end;
  overflow: hidden; background: var(--ink); color: #fff;
  padding: calc(var(--header-h) + 48px) 0 0;
}
.hero__media { position: absolute; inset: 0; z-index: 0; }
.hero__poster { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 22%; }
.hero__overlay {
  position: absolute; inset: 0; z-index: 1;
  background:
    linear-gradient(90deg, rgba(8, 13, 19, 0.92) 0%, rgba(8, 13, 19, 0.68) 48%, rgba(8, 13, 19, 0.32) 100%),
    linear-gradient(180deg, rgba(8, 13, 19, 0.65) 0%, transparent 32%, transparent 52%, rgba(8, 13, 19, 0.94) 100%);
}
.hero__inner { position: relative; z-index: 2; padding-bottom: clamp(40px, 7vh, 80px); }
.hero__content { max-width: 860px; }
.hero__place { color: var(--brass-light); font-size: var(--text-sm); letter-spacing: 0.04em; margin-bottom: 20px; }
.hero__title { font-size: var(--text-display); font-weight: 400; line-height: 1.02; letter-spacing: -0.022em; margin-bottom: 0.32em; }
.hero__title-sub { display: block; font-size: 0.42em; letter-spacing: 0.02em; color: var(--on-dark); margin-top: 0.35em; font-weight: 400; }
.hero__subtitle { font-size: var(--text-lg); color: var(--on-dark); max-width: 44ch; margin-bottom: 34px; }
.hero__actions { display: flex; flex-wrap: wrap; gap: 12px; }
.hero__areas {
  position: relative; z-index: 2; display: flex; flex-wrap: wrap; gap: 6px 28px;
  padding-top: 18px; padding-bottom: 22px;
  font-size: var(--text-sm); color: var(--on-dark-muted);
}
/* fio superior alinhado ao conteúdo (não à caixa com padding) */
.hero__areas::before { content: ""; position: absolute; top: 0; left: clamp(20px, 4vw, 40px); right: clamp(20px, 4vw, 40px); height: 1px; background: var(--line-dark); }
.hero__areas a { transition: color var(--dur-fast); }
.hero__areas a:hover { color: #fff; }

@media (prefers-reduced-motion: no-preference) {
  .hero__content > * { opacity: 0; transform: translateY(18px); animation: hero-in 0.9s var(--ease) forwards; }
  .hero__content > :nth-child(1) { animation-delay: 0.15s; }
  .hero__content > :nth-child(2) { animation-delay: 0.25s; }
  .hero__content > :nth-child(3) { animation-delay: 0.55s; }
  .hero__content > :nth-child(4) { animation-delay: 0.7s; }
  @keyframes hero-in { to { opacity: 1; transform: none; } }
}
.hero__title .hero-word { display: inline-block; will-change: transform; }

@media (max-width: 699px) {
  .hero__overlay { background: linear-gradient(180deg, rgba(8, 13, 19, 0.7) 0%, rgba(8, 13, 19, 0.42) 35%, rgba(8, 13, 19, 0.96) 78%); }
  .hero__actions .btn { flex: 1 1 100%; }
  .hero__areas { gap: 4px 18px; }
}

/* ============================================================
   SEÇÕES — estrutura e fundos
   ============================================================ */
.section { padding: var(--section-pad) 0; position: relative; }
.section--paper { background: var(--paper); }
.section--stone { background: var(--stone); }
.section--slate { background: var(--slate); color: var(--on-dark); }
.section--ink { background: var(--ink); color: var(--on-dark); }

.section__head { margin-bottom: clamp(40px, 6vw, 72px); max-width: 760px; }
.section__head--split { max-width: none; display: grid; gap: 28px; align-items: end; }
@media (min-width: 900px) { .section__head--split { grid-template-columns: minmax(0, 1fr) auto; gap: 48px; } }
.section__eyebrow {
  display: flex; align-items: center; gap: 12px; font-size: var(--text-sm); font-weight: 600; color: var(--brass); margin-bottom: 18px;
}
.section__eyebrow::before { content: ""; width: 28px; height: 1px; background: currentColor; }
.section--slate .section__eyebrow, .section--ink .section__eyebrow { color: var(--brass-light); }
.section__title { font-size: var(--text-3xl); max-width: 22ch; margin-bottom: 0; }
.section__lead { font-size: var(--text-lg); color: var(--muted); max-width: 60ch; margin-top: 24px; }
.section--slate .section__lead, .section--ink .section__lead { color: var(--on-dark-muted); }

/* ---------- O Escritório ---------- */
.about { display: grid; gap: 48px; align-items: center; }
.about__text p:not(.section__eyebrow):not(.section__lead) { color: var(--muted); max-width: 62ch; }
.about__text .section__title { max-width: 18ch; }
.about__text .link-arrow { margin-top: 12px; }
.about__figure { margin: 0; }
.about__photo { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; object-position: center 30%; }
.about__figure figcaption { font-size: var(--text-xs); color: var(--muted); margin-top: 12px; }
@media (min-width: 1000px) {
  .about { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 72px; }
  .about__figure { margin-right: calc(-1 * clamp(20px, 4vw, 40px)); }
}

.credentials { display: grid; gap: 0; margin: clamp(56px, 8vw, 96px) 0 0; }
.credentials__item { border-top: 1px solid var(--line); padding: 22px 0 6px; }
.credentials dt { font-family: var(--font-titulo); font-size: 1.22rem; margin-bottom: 6px; }
.credentials dd { margin: 0; color: var(--muted); font-size: var(--text-sm); max-width: 32ch; }
@media (min-width: 700px) { .credentials { grid-template-columns: repeat(2, 1fr); column-gap: 40px; } }
@media (min-width: 1100px) { .credentials { grid-template-columns: repeat(4, 1fr); } }

/* ---------- Áreas de atuação ---------- */
.modes { display: grid; gap: 24px; max-width: 620px; }
@media (min-width: 600px) { .modes { grid-template-columns: 1fr 1fr; } }
.modes__item { border-left: 1px solid var(--brass); padding-left: 18px; }
.modes__item h3 { font-size: 1.2rem; margin-bottom: 6px; }
.modes__item p { font-size: var(--text-sm); color: var(--muted); margin: 0; }

.areas { border-top: 1px solid var(--text); }
.area { border-bottom: 1px solid var(--line); }
.area__head {
  width: 100%; display: grid; grid-template-columns: 40px minmax(0, 1fr) 28px; gap: 18px; align-items: start;
  text-align: left; background: none; border: 0; padding: 28px 0; cursor: pointer;
}
.area__icon { width: 32px; height: 32px; color: var(--brass); margin-top: 4px; }
.area__heading { margin: 0; font: inherit; }
.area__title { display: block; font-family: var(--font-titulo); font-weight: 500; line-height: 1.2; font-size: var(--text-2xl); margin: 0 0 6px; transition: color var(--dur-fast); }
.area__summary { display: block; text-wrap: pretty; color: var(--muted); margin: 0; max-width: 62ch; line-height: 1.6; }
.area__tags { display: flex; gap: 8px; margin-top: 14px; flex-wrap: wrap; }
.tag { font-size: var(--text-xs); border: 1px solid var(--line); padding: 3px 10px; border-radius: var(--radius); color: var(--muted); background: var(--paper); }
.area__toggle { width: 28px; height: 28px; margin-top: 8px; position: relative; }
.area__toggle::before, .area__toggle::after { content: ""; position: absolute; left: 50%; top: 50%; width: 16px; height: 1.5px; background: currentColor; transform: translate(-50%, -50%); transition: transform var(--dur-med) var(--ease); }
.area__toggle::after { transform: translate(-50%, -50%) rotate(90deg); }
.area.is-open .area__toggle::after { transform: translate(-50%, -50%) rotate(0deg); }
.area__head:hover .area__title { color: var(--brass); }
.area__panel { display: grid; grid-template-rows: 0fr; transition: grid-template-rows var(--dur-med) var(--ease); }
.area.is-open .area__panel { grid-template-rows: 1fr; }
.area__panel-inner { overflow: hidden; min-height: 0; visibility: hidden; transition: visibility 0s linear var(--dur-med); }
.area.is-open .area__panel-inner { visibility: visible; transition-delay: 0s; }
.area__panel-content { padding: 0 0 32px 58px; }
.area__panel-content p { color: var(--muted); max-width: 62ch; }
.area__people-label { font-size: var(--text-sm); font-weight: 600; margin-bottom: 12px; }
.chips { display: flex; flex-wrap: wrap; gap: 10px; }
.chip {
  display: inline-flex; align-items: center; gap: 10px; padding: 4px 14px 4px 4px; background: var(--paper);
  border: 1px solid var(--line); border-radius: 40px; font-size: var(--text-sm); cursor: pointer;
  transition: border-color var(--dur-fast);
}
.chip:hover { border-color: var(--brass); }
.chip img, .chip .chip__mono { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; object-position: center 18%; }
.chip .chip__mono { display: grid; place-items: center; background: var(--slate); color: var(--brass-light); font-family: var(--font-titulo); font-size: 0.8rem; }
@media (max-width: 599px) {
  .area__head { grid-template-columns: minmax(0, 1fr) 28px; }
  .area__icon { display: none; }
  .area__panel-content { padding-left: 0; }
}

/* ---------- Sócios ---------- */
.partners { display: grid; gap: clamp(56px, 7vw, 40px); }
@media (min-width: 900px) { .partners { grid-template-columns: repeat(3, 1fr); gap: 36px; } }
.partner { display: flex; flex-direction: column; }
.partner__photo-wrap { position: relative; display: block; overflow: hidden; background: var(--slate-2); cursor: pointer; border: 0; padding: 0; width: 100%; }
.partner__photo-wrap img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: center 18%; transition: transform 1.1s var(--ease); }
.partner__photo-wrap:hover img { transform: scale(1.035); }
.partner__body { padding-top: 26px; display: flex; flex-direction: column; flex: 1; }
.partner__name { font-size: var(--text-2xl); margin-bottom: 6px; color: #fff; }
.partner__role { font-size: var(--text-sm); color: var(--brass-light); margin-bottom: 16px; }
.partner__highlight { color: var(--on-dark-muted); margin-bottom: 24px; max-width: 40ch; }
.partner__actions { margin-top: auto; display: flex; gap: 20px; align-items: center; flex-wrap: wrap; }
.partner__more { background: none; border: 0; padding: 0 0 4px; cursor: pointer; color: #fff; }
.linkedin { display: inline-flex; align-items: center; gap: 8px; font-size: var(--text-sm); color: var(--on-dark-muted); transition: color var(--dur-fast); }
.linkedin:hover { color: #fff; }
.linkedin svg { width: 18px; height: 18px; }

/* ---------- Equipe ---------- */
.filters { display: flex; flex-wrap: wrap; gap: 8px; }
.filter {
  font-size: var(--text-sm); padding: 7px 14px; border: 1px solid var(--line); background: transparent;
  border-radius: var(--radius); cursor: pointer; color: var(--muted);
  transition: background-color var(--dur-fast), color var(--dur-fast), border-color var(--dur-fast);
}
.filter:hover { border-color: var(--text); color: var(--text); }
.filter[aria-pressed="true"] { background: var(--ink); border-color: var(--ink); color: #fff; }

.team { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 16px; }
@media (min-width: 700px) { .team { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 44px 24px; } }
@media (min-width: 1100px) { .team { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.member[hidden] { display: none; }
.member { position: relative; }
.member__link { background: none; border: 0; padding: 0; font: inherit; color: inherit; text-align: left; cursor: pointer; }
.member__link::after { content: ""; position: absolute; inset: 0; z-index: 1; } /* card inteiro clicável */
.member__photo { position: relative; overflow: hidden; background: var(--slate); aspect-ratio: 4 / 5; }
.member__photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 16%; transition: transform 1s var(--ease); }
.member:hover .member__photo img { transform: scale(1.04); }
.member__name { font-size: 1.2rem; margin: 16px 0 4px; transition: color var(--dur-fast); }
.member:hover .member__name { color: var(--brass); }
.member__role { font-size: var(--text-sm); color: var(--muted); margin: 0; }
.team__empty { color: var(--muted); }
#equipe .section__head--split { grid-template-columns: minmax(0, 1fr); gap: 28px; }
#equipe .section__title { max-width: none; }

/* Placeholder de foto (identificável para substituição) */
.photo-ph {
  position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px;
  background:
    radial-gradient(90% 70% at 50% 30%, rgba(255, 255, 255, 0.06), transparent 70%),
    var(--slate);
  color: var(--brass-light);
}
.photo-ph__mono { font-family: var(--font-titulo); font-size: clamp(2rem, 1.4rem + 2vw, 3.2rem); letter-spacing: 0.04em; }
.photo-ph__note { font-size: 0.72rem; color: var(--on-dark-muted); letter-spacing: 0.04em; }

/* ---------- Faixa de foto da equipe ---------- */
.band { margin: 0; position: relative; background: var(--stone); }
.band__photo { width: 100%; height: clamp(280px, 56vw, 760px); object-fit: cover; object-position: center 42%; }
.band figcaption { font-size: var(--text-xs); color: var(--muted); padding-top: 12px; padding-bottom: 12px; }

/* ---------- Conteúdos (cards de publicação) ---------- */
.posts { display: grid; gap: 40px; }
@media (min-width: 800px) { .posts { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; } }
.post-card { display: flex; flex-direction: column; border-top: 1px solid var(--text); padding-top: 20px; }
.post-card__cover { display: block; overflow: hidden; margin-bottom: 20px; background: var(--stone); aspect-ratio: 16 / 10; }
.post-card__cover img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ease); }
.post-card:hover .post-card__cover img { transform: scale(1.04); }
.post-card__cover--empty { display: grid; place-items: center; background: var(--slate); color: var(--brass-light); font-family: var(--font-titulo); font-size: 1.1rem; }
.post-card__meta { display: flex; gap: 14px; flex-wrap: wrap; font-size: var(--text-xs); color: var(--muted); margin-bottom: 10px; }
.post-card__cat { color: var(--brass); font-weight: 600; }
.post-card__title { font-size: 1.45rem; margin-bottom: 10px; }
.post-card__title a { background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size var(--dur-med) var(--ease); }
.post-card:hover .post-card__title a { background-size: 100% 1px; }
.post-card__excerpt { color: var(--muted); font-size: var(--text-sm); margin-bottom: 18px; }
.post-card__author { margin-top: auto; font-size: var(--text-sm); color: var(--text); }
.posts__loading, .posts__empty { color: var(--muted); }
.posts__empty { grid-column: 1 / -1; border-top: 1px solid var(--line); padding-top: 20px; }

/* ---------- Contato ---------- */
.contact { display: grid; gap: 56px; }
@media (min-width: 1000px) { .contact { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 72px; } }
.contact .section__title { color: #fff; }
.contact__actions { display: flex; flex-wrap: wrap; gap: 18px 28px; align-items: center; margin-top: 36px; }
.contact__mail { color: #fff; font-size: 1.05rem; padding-bottom: 3px; border-bottom: 1px solid var(--line-dark); transition: border-color var(--dur-fast); }
.contact__mail:hover { border-color: var(--brass-light); }
.contact__phone { margin-top: 20px; color: var(--on-dark-muted); font-size: var(--text-sm); }
.offices { display: grid; gap: 28px; }
@media (min-width: 700px) { .offices { grid-template-columns: 1fr 1fr; } }
.office { border-top: 1px solid var(--brass-light); padding-top: 22px; display: flex; flex-direction: column; }
.office__city { font-size: var(--text-2xl); color: #fff; margin-bottom: 12px; }
.office address { color: var(--on-dark-muted); margin-bottom: 20px; }
.office__map { position: relative; margin-top: auto; aspect-ratio: 4 / 3; background: var(--slate); overflow: hidden; }
.office__map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; filter: grayscale(0.85) contrast(1.05); }
.office__map-btn {
  position: absolute; inset: 0; width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px;
  background:
    repeating-linear-gradient(0deg, transparent 0 39px, rgba(233, 237, 239, 0.05) 39px 40px),
    repeating-linear-gradient(90deg, transparent 0 39px, rgba(233, 237, 239, 0.05) 39px 40px),
    var(--slate);
  border: 0; color: #fff; cursor: pointer; font-size: var(--text-sm);
}
.office__map-btn svg { color: var(--brass-light); }
.office__map-btn:hover { background-color: var(--slate-2); }
.office__link { font-size: var(--text-sm); color: var(--on-dark-muted); margin-top: 12px; }
.office__link:hover { color: #fff; }

/* ============================================================
   RODAPÉ
   ============================================================ */
.footer { background: #0d151d; color: var(--on-dark-muted); padding: 72px 0 28px; font-size: var(--text-sm); }
.footer__grid { display: grid; gap: 40px; padding-bottom: 48px; border-bottom: 1px solid var(--line-dark); }
@media (min-width: 800px) { .footer__grid { grid-template-columns: 1.4fr 1fr 1fr 1fr; } }
.footer__brand { display: flex; flex-direction: column; color: #fff; }
.footer__brand .logo__name { font-size: 1.5rem; }
.footer__title { font-family: var(--font-texto); font-size: var(--text-sm); font-weight: 600; color: #fff; margin-bottom: 14px; }
.footer__col li + li { margin-top: 8px; }
.footer__col a { transition: color var(--dur-fast); }
.footer__col a:hover { color: #fff; }
.footer__col strong { color: var(--on-dark); font-weight: 600; }
.footer__bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; padding-top: 24px; font-size: var(--text-xs); }
.footer__bottom p { margin: 0; }
.footer__bottom a:hover { color: #fff; }

/* ============================================================
   WHATSAPP FLUTUANTE
   ============================================================ */
.wa-float {
  position: fixed; right: max(18px, env(safe-area-inset-right)); bottom: max(18px, env(safe-area-inset-bottom)); z-index: 90;
  width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center;
  background: #1f8f55; color: #fff; box-shadow: 0 8px 24px rgba(13, 21, 29, 0.28);
  transition: transform var(--dur-med) var(--ease), background-color var(--dur-fast);
}
.wa-float:hover { transform: translateY(-3px); background: #19784a; }

/* ============================================================
   PAINEL DE PERFIL (drawer)
   ============================================================ */
.drawer { position: fixed; inset: 0; z-index: 200; }
.drawer[hidden] { display: none; }
.drawer__backdrop { position: absolute; inset: 0; background: rgba(13, 21, 29, 0.6); opacity: 0; transition: opacity var(--dur-med) var(--ease); }
.drawer__panel {
  position: absolute; top: 0; right: 0; bottom: 0; width: min(640px, 100%); background: var(--paper); overflow-y: auto; overscroll-behavior: contain;
  transform: translateX(100%); transition: transform 0.55s var(--ease);
}
.drawer.is-open .drawer__backdrop { opacity: 1; }
.drawer.is-open .drawer__panel { transform: none; }
.drawer__close {
  position: sticky; top: 16px; float: right; margin: 16px 16px 0 0; z-index: 2; width: 44px; height: 44px;
  display: grid; place-items: center; background: var(--paper); border: 1px solid var(--line); border-radius: 50%; cursor: pointer;
}
.drawer__close:hover { border-color: var(--text); }
.profile__photo { position: relative; aspect-ratio: 4 / 4.2; background: var(--slate); overflow: hidden; }
.profile__photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 18%; }
.profile__content { padding: 32px clamp(24px, 5vw, 48px) 56px; }
.profile__role { color: var(--brass); font-weight: 600; font-size: var(--text-sm); margin-bottom: 8px; }
.profile__name { font-size: var(--text-3xl); margin-bottom: 8px; }
.profile__oab { color: var(--muted); font-size: var(--text-sm); margin-bottom: 20px; }
.profile__tags { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 28px; }
.profile__block { border-top: 1px solid var(--line); padding-top: 22px; margin-top: 28px; }
.profile__block h3 { font-family: var(--font-texto); font-size: var(--text-sm); font-weight: 600; margin-bottom: 14px; }
.profile__block p, .profile__block li { color: var(--muted); }
.profile__block ul li { padding-left: 18px; position: relative; margin-bottom: 8px; }
.profile__block ul li::before { content: ""; position: absolute; left: 0; top: 0.72em; width: 8px; height: 1px; background: var(--brass); }
.profile__pending { color: var(--muted); font-style: italic; }
.profile__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.profile__actions .linkedin { color: var(--text); border: 1px solid var(--text); padding: 0 18px; min-height: 48px; border-radius: var(--radius); font-weight: 600; }
.profile__actions .linkedin:hover { background: var(--ink); color: #fff; }

/* ============================================================
   MOVIMENTO — apoio ao motion.js
   ============================================================ */
.media-reveal { overflow: hidden; }
.media-reveal img { will-change: transform; }
.cursor-dot { display: none; }


/* ============================================================
   ALM 2026 — REVISÃO VISUAL / UX
   Camada editorial adicionada sobre o design existente.
   Não substitui a estrutura de dados nem o sistema de movimento.
   ============================================================ */

/* Hero: mais cinematográfico, menos "caixa" */
.hero { min-height: min(920px, 92svh); }
.hero__media::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(10,16,22,.72) 0%, rgba(10,16,22,.28) 52%, rgba(10,16,22,.12) 100%); pointer-events:none; }
.hero__video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; opacity:0; transition:opacity 1.4s var(--ease); }
.hero__video.is-playing { opacity:1; } /* pinta por cima da foto (vem depois dela no DOM) */
/* Sem vídeo (padrão até o arquivo chegar): a foto ganha um zoom lento e
   contínuo — dá o mesmo peso "cinematográfico" só com a imagem estática. */
.hero__poster { transition: opacity 1.2s var(--ease); animation: hero-kenburns 26s ease-in-out infinite alternate; transform-origin: 52% 30%; }
@keyframes hero-kenburns { from { transform: scale(1); } to { transform: scale(1.09); } }
.hero__content { position:relative; }
.hero__content::before { content:""; position:absolute; left:-30px; top:4px; width:1px; height:72px; background:var(--brass-light); opacity:.8; }
.hero__place { letter-spacing:.14em; text-transform:uppercase; font-size:.72rem; }
.hero__subtitle { max-width:38ch; }
.hero__areas { grid-template-columns:repeat(5,1fr); }
.hero__areas a { display:flex; gap:10px; align-items:center; }
.hero__areas a span { font-size:.68rem; color:var(--brass-light); letter-spacing:.08em; }
.hero__scroll { position:absolute; right:clamp(20px,4vw,48px); bottom:clamp(98px,10vh,140px); z-index:4; display:flex; flex-direction:column; align-items:center; gap:9px; color:rgba(255,255,255,.72); font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; }
.hero__scroll i { width:1px; height:58px; background:linear-gradient(var(--brass-light), transparent); position:relative; overflow:hidden; }
.hero__scroll i::after { content:""; position:absolute; left:0; top:-100%; width:1px; height:50%; background:#fff; animation:hero-scroll 2.2s var(--ease) infinite; }
@keyframes hero-scroll { to { transform:translateY(300%); } }

/* Faixa editorial entre o hero e a primeira grande seção */
.statement { background:var(--paper); border-bottom:1px solid var(--line); }
.statement__inner { min-height:clamp(240px,25vw,340px); display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:clamp(24px,5vw,72px); align-items:center; }
.statement__index { margin:0; color:var(--brass); font-size:.72rem; letter-spacing:.12em; }
.statement__text { margin:0; max-width:18ch; font-family:var(--font-titulo); font-size:clamp(2rem,2.8vw,3.5rem); line-height:1.04; letter-spacing:-.025em; }
.statement__link { align-self:end; margin-bottom:34px; font-size:.9rem; border-bottom:1px solid var(--text); padding-bottom:5px; transition:color var(--dur-fast), border-color var(--dur-fast); }
.statement__link:hover { color:var(--brass); border-color:var(--brass); }

/* Escritório: composição assimétrica com elemento lateral */
.about { position:relative; }
.about__aside { position:absolute; right:calc(50% + 20px); bottom:12px; display:flex; flex-direction:column; gap:6px; color:var(--muted); font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; writing-mode:vertical-rl; transform:rotate(180deg); }
.about__aside strong { color:var(--brass); font-family:var(--font-titulo); font-size:1.15rem; letter-spacing:.04em; }
.about__figure { position:relative; }
.about__figure::after { content:""; position:absolute; left:-18px; bottom:24px; width:42%; height:1px; background:var(--brass); }
.about__photo { transition:transform 1.1s var(--ease); }
.about__figure:hover .about__photo { transform:scale(1.015); }
.credentials__item { position:relative; transition:transform var(--dur-med) var(--ease), border-color var(--dur-fast); }
.credentials__item:hover { transform:translateY(-4px); border-color:var(--brass); }
.credentials__item::before { content:""; position:absolute; left:0; top:-1px; width:0; height:1px; background:var(--brass); transition:width var(--dur-med) var(--ease); }
.credentials__item:hover::before { width:54px; }

/* Áreas: leitura editorial e números em vez de cinco "caixas" */
.areas { counter-reset: area; }
.area { counter-increment:area; position:relative; transition:background-color var(--dur-med) var(--ease), padding-left var(--dur-med) var(--ease); }
.area::before { content:"0" counter(area); position:absolute; left:0; top:28px; color:rgba(27,36,44,.34); font-size:.72rem; letter-spacing:.1em; pointer-events:none; transition:color var(--dur-fast); }
.area__head { padding-left:58px; }
.area:hover::before, .area.is-open::before { color:var(--brass); }
.area:hover { padding-left:8px; }
.area.is-open { background:rgba(255,255,255,.22); }
.area__head:hover .area__title { transform:translateX(4px); }
.area__title { transition:color var(--dur-fast), transform var(--dur-med) var(--ease); }

/* Sócios: 12 colunas, um retrato dominante */
@media (min-width:900px) {
  .partners { grid-template-columns:repeat(12,minmax(0,1fr)); gap:42px 28px; }
  .partner:nth-child(1) { grid-column:span 7; }
  .partner:nth-child(2), .partner:nth-child(3) { grid-column:span 5; }
  .partner:nth-child(2) .partner__photo-wrap, .partner:nth-child(3) .partner__photo-wrap { max-width:78%; margin-left:auto; }
  .partner:nth-child(1) .partner__photo-wrap img { aspect-ratio:16 / 11; }
}
.partner__photo-wrap::after { content:"Ver perfil"; position:absolute; left:22px; bottom:18px; color:#fff; font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; opacity:0; transform:translateY(8px); transition:opacity var(--dur-med), transform var(--dur-med) var(--ease); }
.partner__photo-wrap:hover::after, .partner__photo-wrap:focus-visible::after { opacity:1; transform:none; }
.partner__photo-wrap::before { content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(180deg,transparent 45%,rgba(8,13,18,.7)); opacity:0; transition:opacity var(--dur-med); }
.partner__photo-wrap:hover::before, .partner__photo-wrap:focus-visible::before { opacity:1; }
.partner__photo-wrap > * { position:relative; z-index:0; }
.partner__photo-wrap img { transition:transform 1.2s var(--ease), filter 1.2s var(--ease); }
.partner__photo-wrap:hover img { transform:scale(1.04); filter:saturate(.92); }

/* Equipe: mais editorial, menos "catálogo" */
@media (min-width:1100px) {
  .team { grid-template-columns:repeat(12,minmax(0,1fr)); gap:56px 20px; }
  .team .member { grid-column:span 3; }
  .team .member:nth-child(3n+1) { grid-column:span 4; }
  .team .member:nth-child(5n) { grid-column:span 3; margin-top:56px; }
}
.member__photo { overflow:hidden; }
.member__photo::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 55%,rgba(12,18,24,.44)); opacity:0; transition:opacity var(--dur-med); }
.member:hover .member__photo::after, .member:focus-within .member__photo::after { opacity:1; }
.member__name { position:relative; z-index:2; }
.member__role { transition:color var(--dur-fast); }
.member:hover .member__role { color:var(--text); }
.filter { position:relative; overflow:hidden; }
.filter::after { content:""; position:absolute; left:0; bottom:0; width:100%; height:2px; background:var(--brass); transform:scaleX(0); transform-origin:left; transition:transform var(--dur-med) var(--ease); }
.filter:hover::after, .filter[aria-pressed="true"]::after { transform:scaleX(1); }

/* Faixa fotográfica: quebra de seção e sensação de profundidade */
.band { margin-top:clamp(10px,2vw,28px); }
.band::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(10,16,22,.45),transparent 55%,rgba(10,16,22,.16)); pointer-events:none; }
.band figcaption { position:absolute; left:0; right:0; bottom:0; z-index:2; color:#fff; border-top:1px solid rgba(255,255,255,.25); }

/* Conteúdos: primeira publicação assume papel de destaque */
.posts__intro { display:flex; justify-content:space-between; align-items:end; gap:24px; margin:-18px 0 28px; padding-bottom:18px; border-bottom:1px solid var(--line); }
.posts__intro span { color:var(--brass); font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; }
.posts__intro p { margin:0; max-width:40ch; color:var(--muted); font-size:.88rem; }
@media (min-width:800px) {
  .posts { grid-template-columns:repeat(12,minmax(0,1fr)); gap:48px 28px; }
  .posts .post-card { grid-column:span 4; }
  .posts .post-card:first-child { grid-column:span 7; grid-row:span 2; }
  .posts .post-card:first-child .post-card__cover { aspect-ratio:16 / 9; }
  .posts .post-card:first-child .post-card__title { font-size:clamp(1.7rem,1.2rem + 1vw,2.25rem); }
  .posts .post-card:nth-child(2), .posts .post-card:nth-child(3) { grid-column:span 5; }
}
.post-card { position:relative; border-top:1px solid var(--text); padding-top:18px; transition:transform var(--dur-med) var(--ease); }
.post-card:hover { transform:translateY(-4px); }
.post-card__cover { position:relative; }
.post-card__cover::after { content:"Abrir análise"; position:absolute; right:16px; bottom:14px; color:#fff; background:rgba(18,28,38,.76); padding:7px 10px; font-size:.68rem; letter-spacing:.08em; text-transform:uppercase; opacity:0; transform:translateY(6px); transition:opacity var(--dur-med), transform var(--dur-med) var(--ease); }
.post-card:hover .post-card__cover::after { opacity:1; transform:none; }
.post-card__cover--empty { background:linear-gradient(135deg,var(--slate),var(--ink)); }
.post-card__cover--empty::before { content:"ALM"; font-family:var(--font-titulo); font-size:clamp(4rem,8vw,8rem); color:rgba(255,255,255,.08); position:absolute; right:8%; bottom:-.12em; }

/* Contato: chamada final com escala tipográfica */
.cta-final__title { font-size:clamp(3rem,7vw,7.5rem); max-width:6ch !important; line-height:.9; letter-spacing:-.04em; }
.contact__intro { position:relative; }
.contact__intro::after { content:"RJ / SP"; position:absolute; right:0; bottom:0; color:rgba(255,255,255,.08); font-family:var(--font-titulo); font-size:clamp(4rem,10vw,9rem); line-height:.8; }
.office { transition:transform var(--dur-med) var(--ease); }
.office:hover { transform:translateY(-5px); }
.office__map-btn { transition:background-color var(--dur-med), transform var(--dur-med) var(--ease); }
.office__map-btn:hover { transform:scale(1.012); }

/* Botões: microinteração consistente */
.btn { position:relative; overflow:hidden; }
.btn::after { content:"→"; display:inline-block; margin-left:2px; transform:translateX(-5px); opacity:0; transition:transform var(--dur-med) var(--ease), opacity var(--dur-med); }
.btn:hover::after, .btn:focus-visible::after { transform:none; opacity:1; }
.btn--sm::after { content:""; }
.link-arrow::after { content:" ↗"; display:inline-block; transition:transform var(--dur-med) var(--ease); }
.link-arrow:hover::after { transform:translate(3px,-3px); }

/* Header: compacto depois que o visitante entra na página */
.header { transition:height var(--dur-med) var(--ease), background-color var(--dur-med) var(--ease), transform var(--dur-med) var(--ease), color var(--dur-med); }
.header--scrolled { height:64px; }
.header--scrolled .logo__name { font-size:1.18rem; }
.header--scrolled .logo__sub { margin-top:3px; font-size:.68rem; }

/* WhatsApp mais discreto, com entrada e hover */
.wa-float { transition:transform var(--dur-med) var(--ease), box-shadow var(--dur-med), background-color var(--dur-fast); }
.wa-float:hover { transform:translateY(-5px) scale(1.03); box-shadow:0 14px 32px rgba(13,21,29,.34); }

@media (max-width:899px) {
  .statement__inner { grid-template-columns:1fr auto; }
  .statement__text { grid-column:1 / -1; grid-row:2; }
  .statement__link { margin:0; }
  .about__aside { display:none; }
  .hero__content::before { left:-14px; }
}
@media (max-width:699px) {
  .hero { min-height:86svh; }
  .hero__areas { grid-template-columns:repeat(2,1fr); }
  .hero__areas a { padding:7px 0; }
  .hero__scroll { display:none; }
  .posts__intro { display:block; }
  .posts__intro p { margin-top:8px; }
  .cta-final__title { font-size:clamp(3rem,18vw,5.5rem); }
}
@media (prefers-reduced-motion: reduce) {
  .post-card:hover, .office:hover { transform:none; }
  .hero__scroll i::after { animation:none; }
  .hero__poster { animation:none; }
}