/* Fontes hospedadas no próprio site */
@font-face { font-family: "Jost"; font-style: normal; font-weight: 400; font-display: swap; src: url("fontes/jost-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Jost"; font-style: normal; font-weight: 500; font-display: swap; src: url("fontes/jost-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "Jost"; font-style: normal; font-weight: 600; font-display: swap; src: url("fontes/jost-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Cormorant Garamond"; font-style: normal; font-weight: 500; font-display: swap; src: url("fontes/cormorant-garamond-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "Cormorant Garamond"; font-style: normal; font-weight: 600; font-display: swap; src: url("fontes/cormorant-garamond-latin-600-normal.woff2") format("woff2"); }

:root {
  --marca: #0B1F3A;
  --marca-escura: #061427;
  --nevoa: #EDF1F6;
  --branco: #FCFCFD;
  --texto: #15202E;
  --suave: #596A7E;
  --linha: #D4DCE6;
  --claro-sobre-marca: #C6D2E1;
  --dourado: #C9A96E;
  --dourado-escuro: #A8864A;
  --serifa: "Cormorant Garamond", Georgia, serif;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; scroll-padding-top: 80px; }
body { font-variant-numeric: lining-nums; font-feature-settings: "lnum" 1; font-family: "Jost", system-ui, sans-serif; font-weight: 400; font-size: 1.09rem; line-height: 1.65; color: var(--texto); background: var(--branco); }
a { color: inherit; }
img { display: block; max-width: 100%; height: auto; }
:focus-visible { outline: 2px solid var(--marca); outline-offset: 3px; }
.sobre-marca :focus-visible { outline-color: #fff; }
.wrap { max-width: 1160px; margin: 0 auto; padding: 0 1.5rem; }
section { padding: 6rem 0; }
.titulo-secao { font-family: var(--serifa); font-weight: 600; font-size: clamp(2.1rem, 3.8vw, 3rem); line-height: 1.08; color: var(--marca); }
.intro-secao { color: var(--suave); max-width: 38rem; margin-top: 1rem; }
.cabeca-secao { margin-bottom: 3rem; }

.botao { display: inline-block; text-decoration: none; font-weight: 500; letter-spacing: 0.01em; font-size: 1rem; padding: 0.9rem 1.5rem; border: 1px solid transparent; cursor: pointer; font-family: inherit; }
.botao-marca { background: var(--marca); color: #fff; }
.botao-marca:hover { background: var(--marca-escura); }
.botao-branco { background: #fff; color: var(--marca); }
.botao-branco:hover { background: var(--nevoa); }
.botao-marca { border-color: var(--marca); }
.botao-marca:hover { background: var(--marca-escura); border-color: var(--marca-escura); }
.botao-contorno { border-color: var(--dourado); color: #fff; }
.botao-contorno:hover { background: rgba(201,169,110,0.16); }
.link-seta { font-weight: 600; color: var(--marca); text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 1px; }

/* Cabeçalho */
header { position: sticky; top: 0; z-index: 40; border-top: 3px solid var(--dourado); background: rgba(252,252,253,0.97); border-bottom: 1px solid var(--linha); }
.nav { display: flex; align-items: center; justify-content: space-between; height: 80px; gap: 1.5rem; }
.nav .logo img { height: 48px; width: auto; }
.menu { display: flex; align-items: center; gap: 1.9rem; list-style: none; }
.menu a { text-decoration: none; color: var(--suave); font-weight: 500; font-size: 0.97rem; }
.menu a:hover { color: var(--marca); }
.menu .botao { color: #fff; padding: 0.65rem 1.1rem; font-size: 0.95rem; }
.menu-toggle { display: none; background: none; border: 1px solid var(--linha); padding: 0.55rem 0.8rem; font: inherit; font-weight: 600; color: var(--marca); cursor: pointer; }

/* Abertura */
.abertura { background: var(--marca); color: #fff; overflow: hidden; }
.abertura-grid { display: grid; grid-template-columns: 1.3fr 0.7fr; gap: 4rem; align-items: center; min-height: min(calc(100vh - 80px), 720px); padding-top: 5rem; padding-bottom: 5rem; }
.abertura h1 { font-family: var(--serifa); font-weight: 500; font-size: clamp(2.7rem, 5.2vw, 4.6rem); line-height: 1.04; letter-spacing: -0.01em; max-width: 42rem; }
.abertura p { margin-top: 1.75rem; font-size: 1.2rem; color: var(--claro-sobre-marca); max-width: 34rem; }
.abertura .acoes { margin-top: 2.5rem; display: flex; gap: 1rem; flex-wrap: wrap; }
.abertura-simbolo { justify-self: end; width: 100%; max-width: 300px; margin-right: 1.5rem; }
.abertura-simbolo img { display: block; width: 100%; height: auto; }

/* Credenciais */
.credenciais { padding: 0; background: var(--branco); border-bottom: 1px solid var(--linha); }
.credenciais-grid { display: grid; grid-template-columns: repeat(3, 1fr); }
.credencial { padding: 2.75rem 2rem 2.75rem 0; }
.credencial + .credencial { padding-left: 2rem; border-left: 1px solid var(--linha); }
.credencial { position: relative; }
.credencial strong { display: block; font-family: var(--serifa); font-weight: 600; font-size: 2rem; line-height: 1.1; color: var(--marca); }
.credencial strong::before { content: ""; display: block; width: 34px; height: 2px; background: var(--dourado); margin-bottom: 0.9rem; }
.credencial span { display: block; margin-top: 0.4rem; color: var(--suave); }

/* Diferencial */
.diferencial { background: var(--nevoa); }
.diferencial-grid { display: grid; grid-template-columns: 0.95fr 1.05fr; gap: 5rem; align-items: start; }
.diferencial-cabeca { position: sticky; top: 120px; }
.diferencial .rotulo { color: var(--dourado-escuro); font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; font-size: 0.85rem; margin-bottom: 1rem; }
.diferencial h2 { font-family: var(--serifa); font-weight: 600; font-size: clamp(2.8rem, 5.4vw, 4.6rem); line-height: 0.98; letter-spacing: -0.01em; color: var(--marca); }
.diferencial-cabeca > p:not(.rotulo) { margin-top: 1.5rem; font-size: 1.2rem; color: var(--suave); max-width: 30rem; }
.diferencial-cabeca .botao { margin-top: 2rem; }
.compromissos { list-style: none; border-top: 2px solid var(--dourado); }
.compromissos li { display: grid; grid-template-columns: 28px 1fr; gap: 1.25rem; padding: 1.75rem 0; border-bottom: 1px solid var(--linha); }
.compromissos svg { width: 22px; height: 22px; margin-top: 0.3rem; }
.compromissos h3 { font-family: var(--serifa); font-weight: 600; font-size: 1.6rem; line-height: 1.15; color: var(--texto); }
.compromissos p { margin-top: 0.4rem; color: var(--suave); }

/* Sobre */
.sobre-grid { display: grid; grid-template-columns: 0.85fr 1.15fr; grid-template-rows: auto 1fr; grid-template-areas: "foto titulo" "foto texto"; column-gap: 5rem; row-gap: 1.75rem; align-items: start; }
.sobre-titulo { grid-area: titulo; }
.sobre-foto { grid-area: foto; }
.sobre-texto { grid-area: texto; }
.retrato { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.ficha { margin-top: 1.25rem; padding-top: 1.25rem; border-top: 2px solid var(--dourado); }
.ficha .nome { font-family: var(--serifa); font-weight: 600; font-size: 1.75rem; line-height: 1.15; }
.ficha .registro { color: var(--suave); }
.ficha .perfil { display: inline-block; margin-top: 0.6rem; font-size: 0.95rem; color: var(--marca); text-underline-offset: 4px; }
.sobre-texto p { margin-bottom: 1.2rem; max-width: 38rem; }
.sobre-texto p.lead { font-family: var(--serifa); font-size: 1.55rem; line-height: 1.35; color: var(--texto); }
.formacao { margin-top: 2.25rem; border-left: 2px solid var(--dourado); padding-left: 1.5rem; }
.formacao div + div { margin-top: 1.4rem; }
.formacao dt { font-family: var(--serifa); font-weight: 600; font-size: 1.5rem; line-height: 1; color: var(--marca); }
.formacao dd { margin-top: 0.35rem; color: var(--suave); }
.formacao dd strong { display: block; color: var(--texto); font-weight: 600; }

/* Áreas */
.areas { background: var(--nevoa); }
.areas-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--linha); border-left: 1px solid var(--linha); }
.area { padding: 2.25rem 2rem 2.5rem; border-right: 1px solid var(--linha); border-bottom: 1px solid var(--linha); background: var(--branco); }
.area h3 { font-family: var(--serifa); font-weight: 600; font-size: 1.7rem; line-height: 1.15; color: var(--marca); margin-bottom: 1.1rem; }
.area ul { list-style: none; }
.area li { padding: 0.5rem 0; border-top: 1px solid var(--nevoa); color: var(--suave); }
.area li:first-child { border-top: 0; padding-top: 0; }
.area-destaque { background: var(--marca); color: #fff; display: flex; flex-direction: column; justify-content: space-between; gap: 1.5rem; }
.area-destaque h3 { color: #fff; }
.area-destaque p { color: var(--claro-sobre-marca); }
.area-destaque .link-seta { color: var(--dourado); text-decoration-color: var(--dourado); }

/* Sustentação oral */
.sustentacao { background: var(--marca-escura); color: #fff; }
.sustentacao-grid { display: grid; grid-template-columns: 1.15fr 0.85fr; gap: 5rem; align-items: center; }
.sustentacao .titulo-secao { color: #fff; margin-bottom: 1.5rem; }
.sustentacao .titulo-secao::after, .contato .titulo-secao::after, .diferencial h2::after { content: ""; display: block; width: 56px; height: 2px; background: var(--dourado); margin-top: 1rem; }
.sustentacao .lead { font-family: var(--serifa); font-size: 1.65rem; line-height: 1.3; margin-bottom: 1.5rem; max-width: 32rem; }
.sustentacao-texto p:not(.lead) { color: var(--claro-sobre-marca); max-width: 36rem; margin-bottom: 1.2rem; }
.etapas-so { list-style: none; counter-reset: so; margin: 2rem 0 2.25rem; border-top: 1px solid rgba(201,169,110,0.55); }
.etapas-so li { counter-increment: so; display: grid; grid-template-columns: 2.5rem 1fr; padding: 0.85rem 0; border-bottom: 1px solid rgba(255,255,255,0.2); color: #fff; }
.etapas-so li::before { content: counter(so); font-family: var(--serifa); font-weight: 600; font-size: 1.35rem; line-height: 1.2; color: var(--dourado); }
.sustentacao-foto { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }

/* Atendimento */
.etapas { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3rem; list-style: none; counter-reset: etapa; }
.etapas li { counter-increment: etapa; border-top: 2px solid var(--dourado); padding-top: 1.5rem; }
.etapas li::before { content: counter(etapa); display: block; font-family: var(--serifa); font-weight: 600; font-size: 2.75rem; line-height: 1; color: var(--marca); margin-bottom: 0.9rem; }
.etapas h3 { font-size: 1.1rem; font-weight: 600; margin-bottom: 0.4rem; }
.etapas p { color: var(--suave); }

/* Conteúdos */
.conteudos { background: var(--nevoa); }
.artigos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; align-items: stretch; }
.artigo { display: flex; flex-direction: column; background: var(--branco); border-top: 3px solid var(--dourado); padding: 1.75rem 1.75rem 1.6rem; text-decoration: none; color: inherit; }
.artigo:hover h3 { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; }
.artigo .tema { font-size: 0.82rem; color: var(--dourado-escuro); font-weight: 600; letter-spacing: 0.07em; text-transform: uppercase; }
.artigo h3 { font-family: var(--serifa); font-weight: 600; font-size: 1.6rem; line-height: 1.15; margin: 0.5rem 0 0.75rem; }
.artigo .resumo { color: var(--suave); }
.artigo .abrir { margin-top: auto; padding-top: 1.1rem; font-weight: 500; color: var(--marca); text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 1px; }

/* Contato */
.contato-grid { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 5rem; }
.contato .titulo-secao { margin-bottom: 1rem; }
.dados { margin-top: 2.25rem; }
.dados div { padding: 1.1rem 0; border-top: 1px solid var(--linha); }
.dados div:last-child { border-bottom: 1px solid var(--linha); }
.dados dt { font-size: 0.93rem; color: var(--suave); }
.dados dd { font-size: 1.15rem; font-weight: 500; }
.dados a { text-decoration: none; }
.dados a:hover { color: var(--marca); text-decoration: underline; text-underline-offset: 4px; }
.formulario { background: var(--nevoa); padding: 2.5rem; }
.formulario h3 { font-family: var(--serifa); font-weight: 600; font-size: 1.8rem; line-height: 1.15; color: var(--marca); }
.formulario > p { color: var(--suave); margin: 0.4rem 0 1.75rem; }
.campo { margin-bottom: 1.2rem; }
.campo label { display: block; font-weight: 600; font-size: 0.95rem; margin-bottom: 0.35rem; }
.campo input, .campo select, .campo textarea { width: 100%; font: inherit; color: var(--texto); background: #fff; border: 1px solid var(--linha); padding: 0.8rem 0.9rem; border-radius: 0; }
.campo textarea { min-height: 130px; resize: vertical; }
.campo input:focus, .campo select:focus, .campo textarea:focus { outline: 2px solid var(--marca); outline-offset: 0; border-color: var(--marca); }
.erro { color: #9B2C2C; font-size: 0.93rem; margin-top: 0.3rem; display: none; }
.campo.invalido .erro { display: block; }
.campo.invalido input, .campo.invalido textarea { border-color: #9B2C2C; }
.privacidade { font-size: 0.88rem; color: var(--suave); margin-top: 1rem; }
.privacidade a { color: var(--marca); text-underline-offset: 3px; }

/* Rodapé */
footer { background: var(--marca-escura); color: var(--claro-sobre-marca); padding: 4rem 0 2rem; font-size: 0.95rem; }
.rodape-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 3rem; padding-bottom: 3rem; border-bottom: 1px solid rgba(201,169,110,0.35); }
.rodape-grid img { height: 46px; width: auto; margin-bottom: 1.25rem; }
.rodape-grid h4 { color: var(--dourado); font-weight: 600; font-size: 0.85rem; letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 0.9rem; }
.rodape-grid ul { list-style: none; }
.rodape-grid li { margin-bottom: 0.45rem; }
.rodape-grid p + p { margin-top: 0.9rem; }
.rodape-local { font-size: 0.9rem; max-width: 22rem; }
.rodape-grid a { text-decoration: none; }
.rodape-grid a:hover { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
.rodape-final { padding-top: 1.5rem; display: flex; justify-content: space-between; gap: 1rem 2rem; flex-wrap: wrap; font-size: 0.88rem; }
.rodape-final a { text-underline-offset: 3px; }
.rodape-final a:hover { color: #fff; }

.whats { position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 30; display: flex; align-items: center; gap: 0.5rem; background: var(--marca); color: #fff; text-decoration: none; font-weight: 600; padding: 0.8rem 1.2rem; border: 1px solid var(--dourado); box-shadow: 0 6px 20px rgba(6,20,39,0.28); }
.whats svg { width: 20px; height: 20px; }

/* Onde atendo */
.locais { margin-top: 5rem; padding-top: 3.5rem; border-top: 1px solid var(--linha); display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 4rem; }
.locais-titulo { font-family: var(--serifa); font-weight: 600; font-size: clamp(1.9rem, 3vw, 2.4rem); line-height: 1.1; color: var(--marca); }
.locais-cabeca p { color: var(--suave); margin-top: 0.9rem; max-width: 26rem; }
.local + .local { margin-top: 2.25rem; padding-top: 2.25rem; border-top: 1px solid var(--linha); }
.local h4 { font-size: 0.82rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--dourado-escuro); font-weight: 600; margin-bottom: 1rem; }
.cidades { list-style: none; columns: 3; column-gap: 2rem; }
.cidades li { padding: 0.32rem 0; break-inside: avoid; }
.local .destaque { font-family: var(--serifa); font-weight: 600; font-size: 1.6rem; line-height: 1.2; color: var(--marca); }
.local .destaque + p { color: var(--suave); margin-top: 0.5rem; max-width: 34rem; }

/* Páginas internas */
.pagina { padding: 4.5rem 0 6rem; }
.estreito { max-width: 46rem; margin: 0 auto; padding: 0 1.5rem; }
.voltar { display: inline-block; font-size: 0.95rem; color: var(--suave); text-underline-offset: 4px; margin-bottom: 2.5rem; }
.voltar:hover { color: var(--marca); }
.pagina .tema { font-size: 0.82rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--dourado-escuro); font-weight: 600; }
.pagina h1 { font-family: var(--serifa); font-weight: 600; font-size: clamp(2.4rem, 5vw, 3.5rem); line-height: 1.06; color: var(--marca); margin-top: 0.75rem; }
.linha-fina { font-family: var(--serifa); font-weight: 500; font-size: 1.5rem; line-height: 1.35; margin-top: 1.25rem; }
.autoria { display: flex; gap: 1rem; align-items: center; margin: 2.25rem 0 2.75rem; padding: 1.1rem 0; border-top: 2px solid var(--dourado); border-bottom: 1px solid var(--linha); }
.autoria img { width: 56px; height: 56px; object-fit: cover; object-position: 50% 30%; flex: none; }
.autoria strong { display: block; font-weight: 600; }
.autoria span { display: block; color: var(--suave); font-size: 0.93rem; }
.texto p, .texto li { font-size: 1.125rem; line-height: 1.75; }
.texto p { margin-bottom: 1.25rem; }
.texto h2 { font-family: var(--serifa); font-weight: 600; font-size: 1.95rem; line-height: 1.15; color: var(--marca); margin: 2.75rem 0 0.9rem; }
.texto h2:first-child { margin-top: 0; }
.texto ul { margin: 0 0 1.25rem 1.25rem; }
.texto li { margin-bottom: 0.45rem; padding-left: 0.25rem; }
.texto li::marker { color: var(--dourado-escuro); }
.texto a { color: var(--marca); text-underline-offset: 3px; }
.texto .aviso { font-size: 0.95rem; color: var(--suave); border-top: 1px solid var(--linha); padding-top: 1.1rem; margin-top: 2.5rem; }
.chamada { background: var(--marca); color: #fff; padding: 2.5rem; margin-top: 3rem; border-top: 3px solid var(--dourado); }
.chamada h2 { font-family: var(--serifa); font-weight: 600; font-size: 2rem; line-height: 1.15; }
.chamada p { color: var(--claro-sobre-marca); margin: 0.75rem 0 1.6rem; max-width: 32rem; }
.outros { margin-top: 3.5rem; }
.outros h2 { font-size: 0.82rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--dourado-escuro); font-weight: 600; margin-bottom: 0.5rem; }
.outros ul { list-style: none; }
.outros li { border-bottom: 1px solid var(--linha); }
.outros a { display: block; padding: 1rem 0; font-family: var(--serifa); font-weight: 600; font-size: 1.45rem; line-height: 1.2; color: var(--marca); text-decoration: none; }
.outros a:hover { text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 1px; }
.atualizado { color: var(--suave); font-size: 0.95rem; margin-top: 1rem; }

@media (max-width: 1020px) {
  .menu-toggle { display: block; }
  .menu { display: none; position: absolute; top: 80px; left: 0; right: 0; background: var(--branco); flex-direction: column; align-items: stretch; gap: 0; padding: 0.5rem 1.5rem 1.5rem; border-bottom: 1px solid var(--linha); }
  .menu.aberto { display: flex; }
  .menu li a:not(.botao) { display: block; padding: 0.85rem 0; border-bottom: 1px solid var(--nevoa); }
  .menu .botao { margin-top: 1rem; text-align: center; }
  .abertura-grid { grid-template-columns: 1fr 0.45fr; gap: 2.5rem; min-height: 0; padding-top: 4.5rem; padding-bottom: 4.5rem; }
  .areas-grid, .artigos { grid-template-columns: 1fr 1fr; }
  .sustentacao-grid, .contato-grid, .diferencial-grid { grid-template-columns: 1fr; gap: 3rem; }
  .diferencial-cabeca { position: static; }
  .locais { grid-template-columns: 1fr; gap: 2.25rem; }
  .diferencial-cabeca .botao { display: block; text-align: center; }
  .sobre-grid { grid-template-columns: 1fr; grid-template-rows: auto; grid-template-areas: "titulo" "foto" "texto"; row-gap: 2rem; }
  .retrato, .sustentacao-foto { max-width: 380px; }
  .sustentacao-foto { order: -1; }
}
@media (max-width: 680px) {
  section { padding: 4.25rem 0; }
  .cidades { columns: 2; }
  .pagina { padding: 3rem 0 4.5rem; }
  .chamada { padding: 2rem 1.5rem; }
  .chamada .botao { display: block; text-align: center; }
  .locais { margin-top: 3.5rem; padding-top: 2.75rem; }
  .nav { height: 70px; }
  .nav .logo img { height: 38px; }
  .menu { top: 70px; }
  .abertura-grid { grid-template-columns: 1fr; gap: 2.25rem; padding-top: 3.5rem; padding-bottom: 4rem; }
  .abertura-simbolo { order: -1; justify-self: start; max-width: 80px; margin-right: 0; }
  .abertura .acoes { flex-direction: column; align-items: stretch; }
  .abertura .botao { text-align: center; }
  .credenciais-grid, .areas-grid, .artigos, .etapas, .rodape-grid { grid-template-columns: 1fr; }
  .credencial, .credencial + .credencial { padding: 1.5rem 0; border-left: 0; }
  .credencial + .credencial { border-top: 1px solid var(--linha); }
  .etapas { gap: 2rem; }
  .formulario { padding: 1.75rem 1.25rem; }
  .whats { padding: 0.8rem; }
  .whats span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
