/* ==========================================================================
   Dra. Isadora Salvucci — site
   Visual "editorial de alto padrão": Newsreader (títulos/serifa) + Figtree (texto)
   Gerado junto com ferramentas/gerar.py (home, /blog/ e artigos).
   ========================================================================== */

:root {
  /* cores-mãe (Instagram da Dra. Isadora): rosa #DBB3A9 e azul #124F76. Pedido de 19/10: "um pouco mais de rosa"
     (volume médio: rosa pleno no manifesto e na chamada do artigo, véu no consultório, nas avaliações e no rodapé,
     blush na consulta; o neutro quente da sala de estar continua no resto). Ver _trabalho/COR-PLANO.md. */
  --marfim: #FAF6EF;          /* papel da página */
  --areia: #F2EADF;           /* neutro quente: fora de uso desde a rodada rosa-fix 1 (os painéis e capas foram para véu e pó) */
  --areia-2: #EDE3D6;
  --rosa: #DBB3A9;            /* PLENO: manifesto, chamada do artigo, botão do rodapé e o fio (sublinhados, traços, aspas) */
  --rosa-50: #FBF2EF;         /* névoa: luz de janela do véu */
  --rosa-100: #F6E7E2;        /* véu: faixa do topo, consultório, avaliações, artigos, topo do /blog/, assinatura, "Continue lendo", rodapé */
  --rosa-200: #EFD8D1;        /* pó: forma atrás da médica, ficha, LIBRAS, capas sem foto, placeholders, seleção de texto */
  --rosa-300: #E6C6BD;        /* blush: a consulta, luz do manifesto, trilho da barra do carrossel */
  --rosa-tinta: #8A4F42;      /* estrelas e rótulos da ficha (sobre marfim, véu e pó, ≥ 4,7:1; nunca sobre blush ou pleno) */
  --azul: #124F76;            /* PRINCIPAL: botões cheios, Infância, chamada do rodapé, etiqueta CRM, numerais, rótulos */
  --azul-noite: #0B2E45;      /* títulos, texto sobre rosa, hover dos botões, faixa legal */
  --azul-fundo: var(--azul-noite);   /* alias antigo (era #0B3350): títulos e texto escuro */
  --tinta: #15293A;           /* texto corrido (13,8:1 no marfim; 7,8:1 no rosa pleno) */
  --tinta-2: #3A4A57;         /* texto secundário: só sobre marfim, névoa, véu e areia (≥ 7,2:1). Nunca sobre pó, blush ou pleno */
  --claro-2: #E9DFD4;         /* texto secundário só sobre o azul-noite (10,7:1); sobre o #124F76 usar marfim */
  --linha: rgba(18, 79, 118, .16);
  --linha-forte: rgba(18, 79, 118, .28);   /* só nos botões contornados */
  --linha-clara: rgba(250, 246, 239, .22);
  --linha-rosa: rgba(11, 46, 69, .22);     /* filetes sobre blush e pleno */
  /* tons de sala de estar: o linho saiu das superfícies (encostava no rosa e virava "bege sujo", COR-PLANO 1.3) */
  --linho: #EEE3D3;
  --luz: #FBF4EA;             /* centro da "luz de janela" dos painéis areia */

  /* forma: suave, sem cair no "fofo" */
  --r-xs: 10px;
  --r-sm: 16px;
  --r-md: 20px;
  --r-lg: 28px;
  --r-card: 18px;
  --r-painel: clamp(20px, 2.2vw, 30px);
  --r-pill: 999px;
  --recuo: clamp(12px, 2.2vw, 32px);

  --serif: "Newsreader", "Iowan Old Style", Georgia, serif;
  --sans: "Figtree", "Segoe UI", system-ui, -apple-system, sans-serif;

  --largura: 1240px;
  --gutter: 40px;
  --secao: 136px;
  --faixa-h: 0px;     /* barra superior removida em 20/10 */
  --barra-h: 84px;
  --pad-painel: max(calc(var(--gutter) - var(--recuo)), clamp(18px, 3vw, 40px));
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--barra-h) + 16px); }
body {
  margin: 0;
  background: var(--marfim);
  color: var(--tinta);
  font: 400 19px/1.68 var(--sans);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: clip;
}
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
p { margin: 0 0 1em; }
figure, blockquote, dl, dd, ol, ul { margin: 0; }
ol, ul { padding: 0; list-style: none; }
address { font-style: normal; }
button { font-family: inherit; }
[hidden] { display: none !important; }
::selection { background: var(--rosa-200); color: var(--azul-noite); }
h1, h2, h3, h4 {
  font-family: var(--serif);
  font-weight: 500;
  color: var(--azul-fundo);
  margin: 0;
  font-optical-sizing: auto;
  text-wrap: balance;
}
h1 em, h2 em, h3 em { font-style: italic; color: var(--azul); font-weight: 450; }
h2 { font-size: clamp(38px, 2.6vw + 18px, 60px); line-height: 1.06; letter-spacing: -.012em; }
h3, h4 { font-size: 27px; line-height: 1.2; letter-spacing: -.005em; }

:focus-visible { outline: 3px solid var(--azul); outline-offset: 3px; }
.secao--azul :focus-visible, .rodape__legal :focus-visible, .rodape__chamada :focus-visible { outline-color: var(--rosa); }

.container { width: 100%; max-width: calc(var(--largura) + var(--gutter) * 2); margin-inline: auto; padding-inline: var(--gutter); }
.ic { width: 20px; height: 20px; flex: none; }
.ic--inv { transform: scaleX(-1); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

.pular {
  position: absolute; left: 16px; top: -100px; z-index: 100;
  background: var(--azul); color: var(--marfim); padding: 12px 18px; font-weight: 600;
}
.pular:focus { top: 12px; }

/* ---------- Elementos comuns ---------- */
.rubrica {
  display: flex; align-items: center; gap: 14px;
  font: 600 16px/1.3 var(--sans);
  color: var(--azul);
  letter-spacing: .01em;
  margin: 0 0 26px;
}
.rubrica span {
  font: italic 500 24px/1 var(--serif);
  color: var(--azul);
  display: inline-flex; align-items: center; gap: 14px;
}
/* o traço é o fio rosa (gráfico); sobre o blush ele vira azul para não sumir */
.rubrica span::after { content: ""; width: 44px; height: 2px; border-radius: 2px; background: var(--rosa); }
.secao--rosa .rubrica span::after { background: var(--azul); height: 1px; opacity: .7; }
.rubrica--clara { color: var(--rosa-200); }   /* rótulo 16px sobre o #124F76: pó (6,4:1); rosa pleno só ≥ 24px */
.rubrica--clara span { color: var(--rosa); }

.botao {
  display: inline-flex; align-items: center; justify-content: center; gap: 12px;
  min-height: 58px; padding: 0 30px;
  font: 600 17px/1.2 var(--sans); letter-spacing: .005em;
  text-decoration: none; border: 1.5px solid transparent; border-radius: var(--r-pill);
  transition: background-color .2s, color .2s, border-color .2s;
  cursor: pointer;
}
.botao .ic { width: 21px; height: 21px; }
.botao--cheio { background: var(--azul); color: var(--marfim); }
.botao--cheio:hover { background: var(--azul-noite); }
.botao--claro { background: var(--marfim); color: var(--azul-noite); }
.botao--claro:hover { background: var(--rosa-100); }
/* pílula rosa: só sobre o azul (chamada do rodapé), o par do Instagram; nunca sobre fundo claro */
.botao--rosa { background: var(--rosa); color: var(--azul-noite); }
.botao--rosa:hover { background: var(--marfim); }
.botao--linha { border-color: var(--azul); color: var(--azul-noite); background: transparent; }
.botao--linha:hover { background: var(--azul); color: var(--marfim); border-color: var(--azul); }

.link-seta {
  display: inline-flex; align-items: center; gap: 10px;
  font: 600 18px/1.3 var(--sans); color: var(--azul-fundo);
  text-decoration: none; padding: 12px 0 8px;
  border-bottom: 2px solid var(--rosa);
}
.link-seta .ic { transition: transform .2s; }
.link-seta:hover .ic { transform: translateX(4px); }

.estrelas { color: var(--rosa-tinta); letter-spacing: 3px; }

.secao { padding: var(--secao) 0; }
/* luz de janela: bem sutil, entrando pelo alto à esquerda */
.secao--areia { background: radial-gradient(120% 90% at 18% 0%, var(--luz) 0%, var(--areia) 58%); }
/* véu: a mesma luz de janela, no rosa (consultório) */
.secao--veu { background: radial-gradient(120% 90% at 18% 0%, var(--rosa-50) 0%, var(--rosa-100) 58%); }
/* a consulta continua o painel do consultório: o véu de cima escurece até o blush, sem costura reta */
.secao--rosa { background: linear-gradient(180deg, var(--rosa-100) 0, var(--rosa-300) clamp(120px, 12vw, 200px)); }
.secao--azul { background: var(--azul); color: var(--marfim); }
/* seções de cor = painéis arredondados, recuados das bordas da tela (no máximo 1600 px) */
.manifesto, .secao--azul, .secao--areia, .secao--veu, .secao--rosa, .rodape__chamada, .blog-topo {
  margin-inline: max(var(--recuo), calc((100% - 1600px) / 2));
  border-radius: var(--r-painel);
}
/* o texto de dentro continua alinhado com a grade de fora (a partir de ~1384 px) e recua 30–40 px abaixo disso */
:is(.manifesto, .secao--azul, .secao--areia, .secao--veu, .secao--rosa, .rodape__chamada, .blog-topo) > .container {
  max-width: calc(var(--largura) + 2 * var(--pad-painel));
  padding-inline: var(--pad-painel);
}
/* consultório + consulta = um painel só; a cor muda dentro dele */
#consultorio { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
#consulta { border-top-left-radius: 0; border-top-right-radius: 0; margin-top: 0; }
.secao--azul h2 { color: var(--marfim); }
.secao--azul h2 em { color: var(--rosa); }

/* cabeçalhos de seção em duas colunas (título | apoio) */
.aval__abre, .art__abre, .atend__abre, .consulta__abre {
  display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: 0 72px; align-items: end; margin-bottom: 72px;
}
.atend__abre .rubrica, .consulta__abre .rubrica { grid-column: 1; grid-row: 1; }
.atend__abre h2, .consulta__abre h2 { grid-column: 1; grid-row: 2; }
.atend__abre .apoio, .consulta__abre .apoio { grid-column: 2; grid-row: 2; }
.apoio { margin: 0; padding-bottom: 6px; max-width: 34em; }

/* ==========================================================================
   CABEÇALHO
   ========================================================================== */
.topo {
  position: sticky; top: calc(var(--faixa-h) * -1); z-index: 40;
  background: var(--marfim);
}
.topo__faixa { height: var(--faixa-h); background: var(--rosa-100); font-size: 15px; color: var(--tinta-2); }
.topo__faixa-in { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.topo__faixa p { margin: 0; display: flex; align-items: center; gap: 8px; }
.topo__faixa ul { display: flex; gap: 28px; }
.topo__faixa li, .topo__faixa a { display: flex; align-items: center; gap: 8px; }
.topo__faixa a { text-decoration: none; }
.topo__faixa a:hover { color: var(--azul); text-decoration: underline; text-underline-offset: 4px; }
.topo__faixa .ic { width: 17px; height: 17px; color: var(--azul); }

.topo__barra { height: var(--barra-h); border-bottom: 1px solid transparent; transition: border-color .25s, box-shadow .25s; }
.topo--rolado .topo__barra { border-bottom-color: var(--linha); box-shadow: 0 10px 30px -24px rgba(11, 51, 80, .45); }
.topo__barra-in { height: 100%; display: flex; align-items: center; gap: 40px; }

.marca { display: flex; align-items: center; gap: 14px; text-decoration: none; margin-right: auto; min-width: 0; }
.marca__selo, .rodape__selo { position: relative; width: 52px; height: 52px; flex: none; color: var(--rosa); }
.marca__selo svg, .rodape__selo svg { position: relative; width: 100%; height: 100%; }
/* selo IS: anel no rosa da marca, com o miolo em véu (no rodapé, que já é véu, o miolo é pó) */
.marca__selo::before, .rodape__selo::before { content: ""; position: absolute; inset: 4%; border-radius: 50%; background: var(--rosa-100); }
.rodape__selo::before { background: var(--rosa-200); }
.marca__selo b, .rodape__selo b {
  position: absolute; inset: 0; display: grid; place-items: center;
  font: italic 500 21px/1 var(--serif); color: var(--azul-fundo); letter-spacing: -.02em; padding-right: 1px;
}
.marca__texto { display: flex; flex-direction: column; min-width: 0; }
.marca__nome { font: 500 27px/1.05 var(--serif); color: var(--azul-fundo); letter-spacing: -.01em; white-space: nowrap; }
.marca__sub { font: 500 15px/1.3 var(--sans); color: var(--tinta-2); margin-top: 4px; letter-spacing: .01em; white-space: nowrap; }

.menu ul { display: flex; gap: 30px; }
.menu a {
  font: 500 16px/1 var(--sans); color: var(--tinta); text-decoration: none;
  padding: 12px 0; position: relative;
}
.menu a::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 4px; height: 2px;
  background: var(--rosa); transform: scaleX(0); transform-origin: left; transition: transform .25s;
}
.menu a:hover::after, .menu a[aria-current]::after { transform: scaleX(1); }
.menu a[aria-current] { color: var(--azul-fundo); }

.botao--topo { min-height: 50px; padding: 0 24px; font-size: 16px; background: var(--azul); color: var(--marfim); }
.botao--topo:hover { background: var(--azul-noite); }
.botao--topo .ic { width: 19px; height: 19px; }

.topo__wpp {
  display: none; place-items: center; flex: none;
  width: 48px; height: 48px; border-radius: 50%;
  background: var(--azul); color: var(--marfim);
}
.topo__wpp .ic { width: 23px; height: 23px; }
.topo__wpp:hover { background: var(--azul-noite); }

.hamburguer {
  display: none; align-items: center; gap: 12px;
  min-height: 48px; min-width: 48px; padding: 0 2px 0 10px; margin-right: -2px;
  background: none; border: 0; color: var(--azul-fundo); cursor: pointer;
  font: 600 16px/1 var(--sans);
}
.hamburguer__linhas { position: relative; width: 26px; height: 14px; display: block; }
.hamburguer__linhas i {
  position: absolute; left: 0; width: 100%; height: 2px; background: currentColor;
  transition: transform .25s, top .25s;
}
.hamburguer__linhas i:first-child { top: 0; }
.hamburguer__linhas i:last-child { top: 12px; }
.hamburguer[aria-expanded="true"] .hamburguer__linhas i:first-child { top: 6px; transform: rotate(45deg); }
.hamburguer[aria-expanded="true"] .hamburguer__linhas i:last-child { top: 6px; transform: rotate(-45deg); }

.gaveta {
  position: fixed; left: 0; right: 0; bottom: 0; top: var(--gaveta-topo, 72px);
  background: var(--marfim); z-index: 39; overflow-y: auto;
  padding: 8px var(--gutter) 40px;
  border-top: 1px solid var(--linha);
  display: flex; flex-direction: column; gap: 32px;
}
.gaveta__nav li { border-bottom: 1px solid var(--linha); }
.gaveta__nav a {
  display: flex; align-items: baseline; gap: 18px; min-height: 64px; padding: 16px 0 14px;
  font: 500 29px/1.15 var(--serif); color: var(--azul-fundo); text-decoration: none;
}
.gaveta__nav a span { font: italic 500 18px/1 var(--serif); color: var(--azul); width: 26px; flex: none; }
.gaveta__rodape { display: flex; flex-direction: column; gap: 14px; }
.gaveta__rodape .botao { width: 100%; }
.gaveta__tel {
  display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 56px;
  border: 1.5px solid var(--azul); color: var(--azul-fundo); font-weight: 600; text-decoration: none; border-radius: var(--r-pill);
}
.gaveta__rodape p { margin: 8px 0 0; font-size: 16px; color: var(--tinta-2); text-align: center; line-height: 1.5; }
body.menu-aberto { overflow: hidden; }

/* ==========================================================================
   ABERTURA
   ========================================================================== */
.capa { padding: 64px 0 112px; }
.capa__grade {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 560px);
  gap: 64px; align-items: center;
}
.capa__sobre {
  display: flex; align-items: center; gap: 0 14px;
  font: 600 17px/1.4 var(--sans); color: var(--azul); margin: 0 0 28px;
}
.capa__sobre::before { content: ""; width: 44px; height: 2px; border-radius: 2px; background: var(--rosa); flex: none; }
.capa h1 {
  font-size: clamp(46px, 4.2vw + 20px, 88px);
  line-height: 1.0; letter-spacing: -.022em; font-weight: 500;
  margin: 0 0 32px;
}
.capa__lead { font-size: 22px; line-height: 1.62; max-width: 31em; color: var(--tinta); margin: 0; }
.capa__acoes { display: flex; flex-wrap: wrap; align-items: center; gap: 20px 36px; margin-top: 40px; }

.capa__selos {
  display: flex; flex-direction: column; align-items: flex-start; gap: 2px;
  margin-top: 24px; font: 500 16px/1.4 var(--sans); color: var(--tinta-2);
}
.capa__selos li { display: flex; align-items: center; gap: 10px; min-height: 30px; }
.capa__selos a { display: flex; align-items: center; gap: 10px; text-decoration: none; min-height: 30px; }
.capa__selos a:hover span:last-child { text-decoration: underline; text-underline-offset: 4px; }
.capa__selos b { color: var(--azul-fundo); font-weight: 700; }
.capa__selos .estrelas { font-size: 15px; letter-spacing: 2px; }


/* foto a 520 px de largura (o arquivo de 1237 px aguenta até ~770 px) */
.capa__foto { position: relative; margin: 14px 14px 14px 26px; }
/* um segundo arco, chapado no rosa pleno da marca, atrás do retrato e deslocado para baixo e para a esquerda
   (rodada rosa-fix 1: o filete saiu; o arco em pó lia como sombra). Sobreposição chapada, nunca sombra nem blob */
.capa__moldura { position: relative; isolation: isolate; }
.capa__moldura::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  transform: translate(-40px, 40px);
  background: var(--rosa);
  border-radius: 50% 50% var(--r-lg) var(--r-lg) / 40% 40% var(--r-lg) var(--r-lg);
}
.capa__moldura img {
  position: relative; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 100%;
  /* topo em arco (janela/porta): em 4:5, 50% da largura = 40% da altura, semicírculo perfeito */
  border-radius: 50% 50% var(--r-lg) var(--r-lg) / 40% 40% var(--r-lg) var(--r-lg);
}
.capa__etiqueta {
  /* embaixo à esquerda, toda dentro da foto (o filete passa inteiro por fora): não cobre o rosto */
  position: absolute; z-index: 2; left: 24px; top: auto; bottom: 28px;
  display: flex; flex-direction: column; gap: 2px;
  background: var(--azul); color: var(--marfim);
  padding: 16px 22px 17px; border-radius: var(--r-sm);
  box-shadow: 0 14px 32px -22px rgba(11, 51, 80, .35);
  font: 500 15px/1.4 var(--sans);
}
.capa__etiqueta strong { font: 500 22px/1.2 var(--serif); color: var(--marfim); }

/* ==========================================================================
   MANIFESTO
   ========================================================================== */
/* rosa pleno, com a luz de janela em blush (mesmo tom, sem degradê para outra cor) */
.manifesto { padding: 104px 0 96px; text-align: center; background: radial-gradient(120% 90% at 18% 0%, var(--rosa-300) 0%, var(--rosa) 62%); }
.manifesto__in, .manifesto__texto { display: flex; flex-direction: column; align-items: center; }
.manifesto__aspas { font: 500 140px/.6 var(--serif); color: var(--azul); height: 64px; }
.manifesto blockquote p {
  font: 400 clamp(29px, 1.7vw + 16px, 44px)/1.28 var(--serif);
  color: var(--azul-fundo); max-width: 24em; margin: 0 auto; letter-spacing: -.008em; text-wrap: balance;
}
.manifesto blockquote em { color: var(--azul); }
.manifesto__autora { margin: 30px 0 0; font: 600 17px/1.4 var(--sans); color: var(--azul-noite); display: flex; align-items: center; gap: 14px; }
.manifesto__autora::before, .manifesto__autora::after { content: ""; width: 32px; height: 1px; background: var(--azul); }
/* variante B (MANIFESTO_PAR no gerar.py): foto da sala em arco ao lado da citação */
.manifesto__foto img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 50% 50% var(--r-lg) var(--r-lg) / 40% 40% var(--r-lg) var(--r-lg); }
@media (min-width: 961px) {
  .manifesto--par .manifesto__in { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 0 88px; align-items: center; text-align: left; }
  .manifesto--par .manifesto__foto { max-width: 440px; justify-self: end; width: 100%; }
  .manifesto--par .manifesto__texto { align-items: flex-start; }
  .manifesto--par blockquote p { margin: 0; }
  .manifesto--par .manifesto__autora::after { display: none; }
}
@media (min-width: 641px) and (max-width: 960px) {
  .manifesto--par .manifesto__in { display: grid; grid-template-columns: 1fr 1fr; gap: 0 48px; align-items: center; text-align: left; }
  .manifesto--par .manifesto__texto { align-items: flex-start; }
  .manifesto--par .manifesto__autora::after { display: none; }
}
@media (max-width: 640px) {
  .manifesto--par .manifesto__foto { order: 2; width: 100%; max-width: 320px; margin-top: 40px; }
  .manifesto--par .manifesto__foto img { border-radius: var(--r-lg); }
}

/* ==========================================================================
   A MÉDICA
   ========================================================================== */
.sobre { display: grid; grid-template-columns: minmax(0, 512px) minmax(0, 1fr); gap: 112px; align-items: start; }
/* margem 0: a foto e a legenda alinham com a grade (x = 100 a 1440), como o resto da página */
.sobre__foto { margin: 16px 0 0; max-width: 480px; position: sticky; top: calc(var(--barra-h) + 40px); }   /* 480 px: o mesmo tamanho aprovado (o recorte aguenta até ~480) */
/* forma em pó atrás só da foto (a legenda fica fora): um L de 40 px à direita e embaixo,
   começando mais baixo e mais para dentro que a foto, para ler como almofada e não como sombra */
.sobre__quadro { position: relative; isolation: isolate; }
.sobre__quadro::before {
  content: ""; position: absolute; z-index: -1; inset: 30% -40px -40px 22%;
  background: var(--rosa-200); border-radius: calc(var(--r-lg) + 8px);
}
/* recorte de 780×975 px do original (x 100–880, y 20–995): exibido a no máximo 480 px de largura */
.sobre__recorte { overflow: hidden; aspect-ratio: 780 / 975; border-radius: var(--r-lg); background: var(--rosa-200); isolation: isolate; }
.sobre__recorte img { width: 155.39%; max-width: none; margin: -12% 0 0 -12.82%; }
.sobre__foto figcaption, .consult figcaption, .pediatria__foto figcaption {
  margin-top: 34px; font: 400 16px/1.5 var(--sans); color: var(--tinta-2);
  display: flex; gap: 12px; align-items: baseline;
}
.sobre__foto figcaption::before, .consult figcaption::before, .pediatria__foto figcaption::before {
  content: ""; width: 24px; height: 2px; border-radius: 2px; background: var(--rosa); flex: none; transform: translateY(-5px);
}
.sobre__foto figcaption { margin-top: 68px; }   /* abaixo da forma em pó (40 px) */
.sobre__texto { padding-top: 16px; max-width: 640px; }
.sobre__texto h2 { margin-bottom: 30px; font-size: clamp(42px, 3vw + 18px, 66px); }
.sobre__abre { font: 400 26px/1.42 var(--serif); color: var(--azul-fundo); margin-bottom: 26px; }
.ficha {
  margin-top: 40px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 40px;
  background: var(--rosa-200); border-radius: var(--r-card); padding: 6px 32px 10px;
}
.ficha div { padding: 18px 0 20px; border-top: 1px solid var(--linha); }
.ficha div:nth-child(-n+2) { border-top: 0; }
.ficha div:last-child { grid-column: 1 / -1; }
.ficha dt { font: 600 16px/1.5 var(--sans); color: var(--rosa-tinta); margin-bottom: 4px; }   /* 4,70:1 no pó */
.ficha dd { font-size: 19px; line-height: 1.5; }

/* ==========================================================================
   BEBÊS E CRIANÇAS
   ========================================================================== */
.pediatria {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 500px);
  grid-template-areas: "abre foto" "marcos marcos" "fecho fecho";
  gap: 0 104px; align-items: center;
}
.pediatria__abre { grid-area: abre; max-width: 660px; }
.pediatria__abre h2 { font-size: clamp(42px, 3.4vw + 16px, 72px); line-height: 1.02; margin-bottom: 36px; }
.pediatria__lead { font-size: 21px; line-height: 1.66; color: var(--marfim); margin: 0; }
.pediatria__foto { grid-area: foto; }
.pediatria__foto img { width: 100%; aspect-ratio: 899 / 670; object-fit: cover; border-radius: var(--r-lg); }
.pediatria__foto figcaption { color: var(--marfim); margin-top: 18px; }
.pediatria__foto figcaption::before { background: var(--rosa); }
.marcos {
  grid-area: marcos; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 48px;
  margin-top: 88px;
}
.marcos li { position: relative; border-top: 1px solid var(--linha-clara); padding: 26px 0 0; }
.marcos li::before { content: ""; position: absolute; top: -5px; left: 0; width: 9px; height: 9px; border-radius: 50%; background: var(--rosa); }
.marcos__quando { display: block; font: 500 25px/1.3 var(--serif); color: var(--rosa); margin-bottom: 10px; }
.marcos p { margin: 0; font-size: 19px; color: var(--marfim); }
.pediatria__fecho {
  grid-area: fecho; display: flex; align-items: center; justify-content: space-between; gap: 32px 48px; flex-wrap: wrap;
  margin-top: 64px; padding-top: 40px; border-top: 1px solid var(--linha-clara);
}
.pediatria__dado { margin: 0; display: flex; align-items: flex-end; gap: 22px; }
.pediatria__num { font: italic 400 96px/.8 var(--serif); color: var(--rosa); letter-spacing: -.03em; flex: none; }
.pediatria__num-legenda { font: 500 17px/1.45 var(--sans); color: var(--marfim); max-width: 17em; padding-bottom: 2px; }

/* ==========================================================================
   ATENDIMENTOS
   ========================================================================== */
.atend__grupos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 72px; align-items: start; }
.atend__grupo--criancas { grid-column: 1; grid-row: 1; }
.atend__grupo--adultos { grid-column: 2; grid-row: 1; }
/* LIBRAS: faixa própria, de largura total, abaixo das duas colunas (3 + 4 itens acima) */
.atend__grupo--todos {
  grid-column: 1 / -1; grid-row: 2; margin-top: 64px;
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 72px; align-items: center;
  background: var(--rosa-200); border-radius: var(--r-card); padding: 36px 44px;
}
.atend__grupo--todos .atend__titulo { border: 0; padding: 0; font: 500 30px/1.15 var(--serif); color: var(--azul-fundo); letter-spacing: -.005em; }
.atend__grupo--todos .indice li { border: 0; padding: 0; }
.atend__titulo {
  display: flex; align-items: center; gap: 14px;
  font: 600 18px/1.3 var(--sans); color: var(--azul); letter-spacing: .01em;
  padding-bottom: 14px; border-bottom: 1px solid var(--linha);
}
.indice li {
  display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 8px;
  padding: 28px 0 30px; border-bottom: 1px solid var(--linha);
}
.indice li:last-child { border-bottom: 0; }
.indice__n { font: italic 500 24px/1.25 var(--serif); color: var(--azul); padding-top: 2px; }
.indice h4 { margin-bottom: 10px; font-size: 26px; }
.indice p { margin: 0; max-width: 34em; }

/* ==========================================================================
   CONSULTÓRIO
   ========================================================================== */
.consult {
  display: grid; grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-template-rows: auto 1fr; gap: 56px 32px;
}
.consult__abre { grid-column: 1 / 6; grid-row: 1; align-self: start; }
.consult__abre .apoio { margin: 28px 0 0; max-width: 30em; padding: 0; }
.consult__a { grid-column: 7 / 13; grid-row: 1 / 3; display: flex; flex-direction: column; }
.consult__a img { flex: 1 1 0; min-height: 0; height: 100%; }
.consult__b { grid-column: 1 / 4; grid-row: 2; align-self: end; }
.consult__c { grid-column: 4 / 7; grid-row: 2; align-self: end; }
.consult figure img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: var(--r-md); }
.consult__a img { aspect-ratio: auto; object-position: 50% 70%; border-radius: var(--r-lg); }
.consult__c img { object-position: 50% 22%; }
.consult figcaption { margin-top: 14px; }

/* ==========================================================================
   CONSULTA PARTICULAR
   ========================================================================== */
.consulta__itens { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 56px; }
.consulta__itens li { padding: 8px 0 0; }
.consulta__n { display: block; font: italic 400 46px/1 var(--serif); color: var(--azul); margin-bottom: 22px; }
.consulta__itens h3 { margin-bottom: 12px; }
.consulta__itens p { margin: 0; }
.consulta__fecho {
  display: flex; align-items: center; justify-content: space-between; gap: 24px 40px; flex-wrap: wrap;
  margin-top: 56px;
}
.consulta__fecho p { margin: 0; font: italic 400 25px/1.4 var(--serif); color: var(--azul-fundo); }

/* ==========================================================================
   AVALIAÇÕES
   ========================================================================== */
.aval__abre { align-items: end; }
.aval__nota { display: flex; align-items: center; gap: 28px; justify-self: end; }
.aval__num { font: 400 128px/.8 var(--serif); color: var(--azul); letter-spacing: -.04em; }
.aval__nota .estrelas--g { font-size: 24px; display: block; line-height: 1; }
.aval__nota p { margin: 8px 0 0; font: 600 18px/1.4 var(--sans); color: var(--azul-fundo); }
.aval__nota .link-seta { font-size: 17px; padding-top: 6px; }

.aval__carrossel { position: relative; }
.aval__trilho {
  display: flex; gap: 24px; align-items: flex-start;
  overflow-x: auto; overflow-y: hidden; overscroll-behavior-x: contain;
  transition: height .35s ease;
  scroll-snap-type: x mandatory; scroll-padding-inline: 0;
  scrollbar-width: none; padding: 4px 0 6px; border-radius: var(--r-card);
}
.aval__trilho::-webkit-scrollbar { display: none; }
/* altura: o site.js iguala os cards que estão na tela (--aval-alt) e ajusta o trilho a eles, para estrelas,
   nome e data fecharem na mesma linha (o figcaption tem margin-top: auto) sem esticar tudo até o card maior */
@media (prefers-reduced-motion: no-preference) { .aval__trilho { scroll-behavior: smooth; } }
.aval__trilho:focus-visible { outline-offset: 4px; }

/* card: aspas, texto inteiro, depois estrelas, nome e mês/ano (sempre na mesma linha de base) */
.aval {
  flex: 0 0 calc((100% - 48px) / 3);
  scroll-snap-align: start;
  display: flex; flex-direction: column; margin: 0;
  background: var(--rosa-100); border-radius: var(--r-card);
  padding: 28px 28px 26px;
  min-height: var(--aval-alt, 0px); transition: min-height .35s ease, max-height .35s ease;
  /* o card que espia pela borda (mais alto que os da vez) é cortado dentro da própria caixa, com os cantos
     arredondados, e o texto some num esmaecido (.aval--cortado, marcado pelo site.js) em vez de partir no meio */
  max-height: var(--aval-alt, none); overflow: hidden; position: relative;
}
.aval--cortado::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 88px; pointer-events: none;
  background: linear-gradient(rgba(246, 231, 226, 0), var(--rosa-100) 72%);
}
.aval::before { content: "\201C"; display: block; font: 500 44px/1 var(--serif); color: var(--rosa); height: 24px; margin: -2px 0 12px -1px; }
.aval blockquote { margin: 0; }
.aval blockquote p { margin: 0; font: 400 19px/1.62 var(--sans); color: var(--tinta); }
.aval figcaption { margin-top: auto; padding-top: 24px; display: flex; flex-direction: column; gap: 4px; }
.aval__estrelas { display: flex; gap: 3px; color: var(--rosa-tinta); margin-bottom: 8px; }
.aval__estrelas svg { width: 18px; height: 18px; }
.aval__nome { font: 500 23px/1.25 var(--serif); color: var(--azul-fundo); }
.aval__data { font: 400 16px/1.4 var(--sans); color: var(--tinta-2); }

.aval__controles { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 32px; }
.aval__posicao { display: flex; align-items: center; gap: 18px; margin: 0; font: 500 16px/1 var(--sans); color: var(--tinta-2); font-variant-numeric: tabular-nums; }
.aval__barra { position: relative; width: 160px; height: 3px; border-radius: 3px; background: var(--rosa-300); overflow: hidden; }
.aval__barra i { position: absolute; top: 0; bottom: 0; left: var(--ini, 0%); width: var(--larg, 30%); border-radius: 3px; background: var(--azul); transition: left .3s ease; }
.aval__setas { display: flex; gap: 12px; }
.aval__seta {
  display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; padding: 0;
  border: 1.5px solid var(--azul); background: transparent; color: var(--azul-fundo); cursor: pointer;
  transition: background-color .2s, color .2s, border-color .2s, opacity .2s;
}
.aval__seta .ic { width: 22px; height: 22px; }
.aval__seta:hover:not([aria-disabled="true"]) { background: var(--azul); border-color: var(--azul); color: var(--marfim); }
.aval__seta[aria-disabled="true"] { border-color: var(--linha-forte); color: var(--tinta-2); opacity: .45; cursor: default; }

/* ==========================================================================
   ARTIGOS (prévia da home)
   ========================================================================== */
.art__grade { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px 56px; }
.art a { text-decoration: none; display: block; color: inherit; }
.art__img { overflow: hidden; background: var(--rosa-200); border-radius: var(--r-md); isolation: isolate; }
.art__img img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; transition: transform .6s ease; }
.art a:hover .art__img img { transform: scale(1.03); }
.art a:hover h3 { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 6px; text-decoration-color: var(--rosa); }
.art__cat, .cartao__cat { font: 600 15px/1.3 var(--sans); color: var(--azul); letter-spacing: .06em; text-transform: uppercase; margin: 24px 0 12px; }
/* o fio rosa das rubricas antes da categoria (o texto continua azul) */
.art__cat, .cartao .cartao__cat { display: flex; align-items: center; gap: 12px; }
.art__cat::before, .cartao__cat::before { content: ""; width: 28px; height: 2px; border-radius: 2px; background: var(--rosa); flex: none; }
.art h3 { font-size: 28px; line-height: 1.18; }
.art__resumo { margin: 14px 0 0; }

.art--destaque { grid-column: 1 / -1; }
.art--destaque a { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 0 64px; align-items: center; }
.art--destaque .art__img { grid-row: 1 / 6; }
.art--destaque .art__img img { aspect-ratio: 16 / 10; }
.art--destaque .art__cat { margin-top: 0; }
.art--destaque h3 { font-size: clamp(32px, 1.4vw + 20px, 44px); line-height: 1.1; }
.art--destaque .link-seta { justify-self: start; margin-top: 26px; }
.art:not(.art--destaque) a { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 28px; align-items: start; }
.art:not(.art--destaque) .art__img { border-radius: var(--r-sm); }
.art:not(.art--destaque) .art__img img { aspect-ratio: 4 / 3.4; }
.art:not(.art--destaque) .art__cat { margin-top: 0; }
.art__todos { margin: 56px 0 0; }

/* ==========================================================================
   LOCALIZAÇÃO
   ========================================================================== */
.local {
  display: grid; grid-template-columns: minmax(0, 13fr) minmax(0, 11fr);
  gap: 0 72px; align-items: stretch;
}
.local__info h2 { margin-bottom: 44px; }
.endereco { position: relative; display: flex; flex-direction: column; padding: 4px 0 6px 26px; }
.endereco::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; border-radius: 4px; background: var(--rosa); }
.endereco__predio { font: 500 40px/1.1 var(--serif); color: var(--azul-fundo); letter-spacing: -.01em; margin-bottom: 10px; }
.endereco__linha { font: 400 27px/1.32 var(--serif); color: var(--tinta); }
.endereco__bairro { font: 600 18px/1.4 var(--sans); color: var(--tinta-2); margin-top: 14px; }
/* três rotas na mesma linha, com a mesma largura */
.local__rotas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 36px 0 44px; }
.local__rotas .botao { padding: 0 12px; min-height: 54px; font-size: 16px; gap: 8px; white-space: nowrap; border-color: var(--linha-forte); }
.local__rotas .botao--linha:hover { border-color: var(--azul); }
.js-copiar.copiado { background: var(--azul); color: var(--marfim); border-color: var(--azul); }

.canais { border-bottom: 1px solid var(--linha); }
.canais li { border-top: 1px solid var(--linha); }
.canais a, .canais li > div {
  display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 16px; align-items: center;
  min-height: 64px; padding: 10px 0; text-decoration: none;
}
.canais a { transition: background-color .2s; padding-inline: 14px; margin-inline: -14px; border-radius: var(--r-xs); }
.canais a:hover { background: var(--rosa-100); }
.canais a:hover .canais__val { color: var(--azul); }
.canais__rot { display: flex; align-items: center; gap: 10px; font: 600 16px/1.3 var(--sans); color: var(--azul); }
.canais__rot .ic { width: 19px; height: 19px; }
.canais__val { font-size: 19px; line-height: 1.45; overflow-wrap: anywhere; }
.canais a .canais__val { text-decoration: underline; text-decoration-color: var(--rosa); text-decoration-thickness: 2px; text-underline-offset: 5px; }

.local__mapa { display: flex; flex-direction: column; }
/* a foto fica limpa (as cadeiras e a janela à mostra) e a legenda desce para baixo dela */
.mapa { position: static; display: flex; flex-direction: column; flex: 1; min-height: 0; overflow: visible; background: none; margin: 0; }
.mapa__janela { position: relative; flex: 1; min-height: 540px; overflow: hidden; border-radius: var(--r-lg); background: var(--rosa-200); isolation: isolate; }
.mapa__foto { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 78%; }
.mapa__painel {
  position: static; background: none; padding: 20px 0 0;
  display: flex; align-items: flex-start; justify-content: space-between; gap: 16px 28px; flex-wrap: wrap;
  color: var(--tinta-2);
}
.mapa__legenda { position: relative; display: flex; flex-direction: column; gap: 2px; padding-left: 36px; font: 400 16px/1.5 var(--sans); }
.mapa__legenda::before { content: ""; position: absolute; left: 0; top: 14px; width: 24px; height: 2px; border-radius: 2px; background: var(--rosa); }
.mapa__legenda strong { font: 500 23px/1.25 var(--serif); color: var(--azul-fundo); }
.mapa__painel .botao { min-height: 54px; }
.mapa iframe {
  position: absolute; left: 0; width: 100%; border: 0; z-index: 0;
  top: -190px; height: calc(100% + 190px);   /* esconde o cartão branco do Google (com o nome em 2 linhas ele passava de 150 px) */
  opacity: 0; transition: opacity .4s ease;
}
.mapa__foto { z-index: 1; }
/* enquanto o mapa carrega, a foto e o painel continuam na tela, com o aviso de carregamento */
.mapa--carregando .js-ver-mapa { cursor: progress; }
.mapa--carregando .js-ver-mapa .ic { animation: mapa-gira 1s linear infinite; }
@keyframes mapa-gira { to { transform: rotate(360deg); } }
.mapa__aviso:empty { display: none; }
.mapa__aviso { flex-basis: 100%; font: 500 16px/1.45 var(--sans); color: var(--tinta-2); }
.mapa__aviso a { color: var(--azul-fundo); font-weight: 600; text-underline-offset: 4px; }
.mapa--ativo iframe { opacity: 1; }
.mapa--ativo .mapa__foto, .mapa--ativo .js-ver-mapa { display: none; }

/* ==========================================================================
   RODAPÉ
   ========================================================================== */
/* a chamada azul é um painel recuado como os outros (4 cantos) e fica meio por cima da base em véu, que é
   um painel com o MESMO recuo (rodada rosa-fix 1: a base de ponta a ponta com o topo arredondado aparecia
   como uma "orelha" de 8–32 px ao lado da chamada); a faixa legal azul-noite fecha a página */
.rodape { background: var(--marfim); color: var(--tinta); }
.rodape__chamada { position: relative; z-index: 1; background: var(--azul); color: var(--marfim); }
.rodape__base {
  --sobe: clamp(56px, 6vw, 96px);
  background: var(--rosa-100); border-radius: var(--r-painel);
  margin: calc(var(--sobe) * -1) max(var(--recuo), calc((100% - 1600px) / 2)) var(--recuo);
  padding-top: var(--sobe);
}
.rodape__base > .container { max-width: calc(var(--largura) + 2 * var(--pad-painel)); padding-inline: var(--pad-painel); }
.rodape__chamada-in { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 32px 72px; padding-top: 80px; padding-bottom: 80px; }
.rodape__chamada-txt { margin: 0; font: 500 clamp(36px, 2.4vw + 16px, 58px)/1.08 var(--serif); color: var(--marfim); letter-spacing: -.015em; text-wrap: balance; }
.rodape__chamada-txt em { font-style: italic; color: var(--rosa); font-weight: 450; }
/* bloco do botão alinhado à margem direita da grade */
.rodape__chamada-acao { display: flex; flex-direction: column; align-items: flex-end; text-align: right; gap: 16px; justify-self: end; }
.rodape__chamada-acao .botao { font-size: 18px; padding: 0 32px; }
.rodape__chamada-acao p { margin: 0; font-size: 16px; line-height: 1.5; color: var(--marfim); }

.rodape__marca { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 26px; align-items: center; padding: 80px 0 52px; border-bottom: 1px solid var(--linha); }
.rodape__selo { width: 84px; height: 84px; grid-row: 1 / 3; color: var(--rosa); }
.rodape__selo b { font-size: 34px; }
.rodape__nome { margin: 0; font: 500 clamp(44px, 4.4vw + 12px, 92px)/1 var(--serif); color: var(--azul-fundo); letter-spacing: -.025em; }
.rodape__sub { margin: 10px 0 0; font: 500 18px/1.4 var(--sans); color: var(--tinta-2); }
/* quatro colunas iguais, separadas pelo espaço (sem divisórias verticais) */
.rodape__grade { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: 64px; padding: 56px 0 64px; }
.rodape__bloco { position: relative; min-width: 0; }
.rodape__bloco h2 { font: 600 17px/1.3 var(--sans); color: var(--azul); letter-spacing: .01em; margin: 0 0 16px; }
.rodape__bloco p, .rodape__bloco address, .rodape__lista li { font-size: 17px; line-height: 1.6; }
.rodape__obs { color: var(--tinta-2); margin: 0; font-size: 16px !important; }
.rodape__links { display: flex; gap: 24px; margin: 10px 0 0; }
.rodape__links a, .rodape__lista a {
  font-weight: 600; color: var(--azul-fundo); text-decoration: underline; text-decoration-color: var(--rosa);
  text-decoration-thickness: 2px; text-underline-offset: 5px;
  display: inline-flex; align-items: center; min-height: 40px;
}
.rodape__lista a { font-weight: 500; overflow-wrap: anywhere; }
.rodape__lista--nav a { text-decoration: none; }
.rodape__lista--nav a:hover, .rodape__links a:hover, .rodape__lista a:hover { color: var(--azul); text-decoration: underline; }
.rodape__legal { background: var(--azul-noite); color: var(--claro-2); }
.rodape__legal-in { padding-top: 24px; padding-bottom: 24px; display: flex; justify-content: space-between; gap: 12px 32px; flex-wrap: wrap; }
.rodape__legal p { margin: 0; font-size: 15px; line-height: 1.5; }
.rodape__legal strong { color: var(--marfim); font-weight: 600; }
.rodape__legal a { color: var(--marfim); text-underline-offset: 4px; }

/* ==========================================================================
   WHATSAPP FLUTUANTE
   ========================================================================== */
.wpp-flutuante {
  position: fixed; right: 24px; bottom: 24px; z-index: 30;
  height: 58px; min-width: 58px; padding: 0 16px; border-radius: 29px;
  display: flex; align-items: center; justify-content: center;
  background: var(--azul); color: var(--marfim); text-decoration: none;
  box-shadow: 0 0 0 3px var(--marfim), 0 12px 28px -10px rgba(11, 51, 80, .55);
  transition: background-color .2s, opacity .3s, transform .3s, visibility .3s;
}
.wpp-flutuante svg { width: 26px; height: 26px; flex: none; }
.wpp-flutuante__txt {
  max-width: 0; overflow: hidden; white-space: nowrap; opacity: 0;
  font: 600 16px/1 var(--sans); transition: max-width .3s ease, opacity .2s, margin .3s;
}
.wpp-flutuante:hover, .wpp-flutuante:focus-visible { background: var(--azul-noite); }
.wpp-flutuante:hover .wpp-flutuante__txt, .wpp-flutuante:focus-visible .wpp-flutuante__txt { max-width: 240px; opacity: 1; margin-left: 10px; margin-right: 4px; }
.wpp-flutuante--oculto { opacity: 0; visibility: hidden; transform: translateY(16px); pointer-events: none; }
body.menu-aberto .wpp-flutuante { opacity: 0; pointer-events: none; }

/* ==========================================================================
   BLOG — lista de artigos
   ========================================================================== */
/* título à esquerda; apoio e filtros à direita (a grade sobe e o cabeçalho não fica vazio) */
/* topo do /blog/: painel véu com a luz de janela, com o mesmo recuo e raio dos painéis da home (só fundo; HTML igual) */
.blog-topo { padding: 72px 0 64px; margin-top: 8px; background: radial-gradient(120% 90% at 18% 0%, var(--rosa-50) 0%, var(--rosa-100) 58%); }
.blog-topo__in { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 0 72px; align-items: end; }
.blog-topo h1 { font-size: clamp(44px, 3.4vw + 18px, 76px); line-height: 1.02; letter-spacing: -.02em; max-width: 14em; }
.blog-topo__apoio { font-size: 21px; line-height: 1.62; max-width: 36em; margin: 0; }
.filtros { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 32px; }
.filtros button {
  min-height: 48px; padding: 0 22px; border-radius: var(--r-pill); cursor: pointer;
  border: 1.5px solid var(--azul); background: transparent; color: var(--azul-fundo);
  font: 600 16px/1 var(--sans); transition: background-color .2s, color .2s;
}
.filtros button:hover { background: var(--rosa-200); }
.filtros button[aria-pressed="true"] { background: var(--azul); border-color: var(--azul); color: var(--marfim); }

.lista-artigos { padding: 64px 0 var(--secao); }
.cartoes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 64px 40px; }
.cartao { display: flex; flex-direction: column; text-decoration: none; color: inherit; }
/* todo card: área visual 3:2 (387×258 no desktop), depois tema, título e resumo */
.cartao__img { position: relative; display: block; overflow: hidden; aspect-ratio: 3 / 2; background: var(--rosa-200); border-radius: var(--r-md); isolation: isolate; }
.cartao__img img { width: 100%; height: 100%; object-fit: cover; transform: scale(var(--zoom, 1)); transition: transform .6s ease; }
.cartao:hover .cartao__img img { transform: scale(calc(var(--zoom, 1) * 1.03)); }
.cartao .cartao__cat { margin: 22px 0 10px; }
.cartao__tit { font-size: 26px; line-height: 1.2; }
.cartao:hover .cartao__tit { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 6px; text-decoration-color: var(--rosa); }
.cartao__resumo { display: block; margin-top: 12px; font-size: 19px; line-height: 1.62; color: var(--tinta); }
.cartao__meta { display: block; margin-top: 14px; font: 500 16px/1.4 var(--sans); color: var(--tinta-2); }

/* capa padronizada do card sem foto: um tom só (pó) para todos os temas, anéis finos no rosa pleno,
   monograma e tema em azul. Padrão editorial, igual em todos os cards sem foto. Hover: blush. */
.capa-tema {
  position: absolute; inset: 0; overflow: hidden;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px;
  background: var(--rosa-200); color: var(--azul);
  --anel: var(--rosa); --anel-fundo: rgba(219, 179, 169, .22);
  transition: background-color .3s;
}
.cartao--sem-foto:hover .capa-tema { background: var(--rosa-300); }
.capa-tema__aneis {
  position: absolute; right: -58px; top: -58px; width: 200px; height: 200px; border-radius: 50%;
  border: 1px solid var(--anel);
  box-shadow: 0 0 0 24px var(--anel-fundo), inset 0 0 0 24px var(--anel-fundo);
}
.capa-tema__aneis::after { content: ""; position: absolute; inset: 38px; border-radius: 50%; border: 1px solid var(--anel); opacity: .7; }
.capa-tema__selo { position: relative; width: 68px; height: 68px; flex: none; color: var(--azul); }
.capa-tema__selo svg { width: 100%; height: 100%; }
.capa-tema__selo b {
  position: absolute; inset: 0; display: grid; place-items: center;
  font: italic 500 27px/1 var(--serif); color: var(--azul-fundo); letter-spacing: -.02em; padding-right: 1px;
}
.capa-tema__nome { position: relative; font: italic 500 22px/1.2 var(--serif); color: var(--azul-fundo); letter-spacing: -.005em; }

/* ==========================================================================
   ARTIGO
   ========================================================================== */
.container--artigo { max-width: calc(800px + var(--gutter) * 2); }
.artigo-topo { padding: 56px 0 48px; }
.artigo-topo__in { display: block; }
.artigo-topo--lado .artigo-topo__in { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 48px; align-items: center; }
.voltar {
  display: inline-flex; align-items: center; gap: 10px; min-height: 48px;
  font: 600 17px/1.3 var(--sans); color: var(--azul-fundo); text-decoration: none; margin-bottom: 20px;
}
.voltar:hover { color: var(--azul); text-decoration: underline; text-underline-offset: 5px; }
.artigo-topo .art__cat { margin: 0 0 16px; }
.artigo-topo h1 { font-size: clamp(38px, 2.2vw + 22px, 58px); line-height: 1.06; letter-spacing: -.018em; }
.artigo-meta { display: flex; flex-wrap: wrap; gap: 6px 0; margin: 26px 0 0; font: 500 16px/1.4 var(--sans); color: var(--tinta-2); }
.artigo-meta span:first-child { flex-basis: 100%; color: var(--azul-fundo); font-weight: 600; }
.artigo-meta span + span + span::before { content: "·"; margin: 0 10px; color: var(--azul); }
.artigo-topo__foto img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; border-radius: var(--r-md); }
.artigo-topo__foto { margin: 0; }
.artigo-capa { margin: 0 0 64px; }
/* topo sem foto: só tipográfico, com título, meta e um filete */
.artigo-topo--tipo { padding-bottom: 64px; }
.artigo-topo--tipo .artigo-topo__texto { position: relative; padding-bottom: 40px; border-bottom: 1px solid var(--linha); }
.artigo-topo--tipo .artigo-topo__texto::after { content: ""; position: absolute; left: 0; bottom: -2px; width: 72px; height: 3px; border-radius: 3px; background: var(--rosa); }
/* texto do topo na mesma coluna de 680 px do corpo, centralizada; a capa de 800 px sobra igual dos dois lados */
.artigo-topo--capa .artigo-topo__texto, .artigo-topo--tipo .artigo-topo__texto { max-width: 680px; margin-inline: auto; }
.artigo-capa img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--r-lg); }

.artigo-corpo { max-width: calc(680px + var(--gutter) * 2); margin: 0 auto; padding: 0 var(--gutter); }
.artigo-topo__texto { max-width: 760px; }
.artigo-corpo p, .artigo-corpo li { font-size: 19px; line-height: 1.75; }
.artigo-corpo p { margin: 0 0 1.15em; }
.artigo-corpo > p:first-child { font: 400 23px/1.6 var(--serif); color: var(--azul-fundo); }
.artigo-corpo h2, .artigo-corpo h3 { margin: 1.6em 0 .6em; font-size: 31px; line-height: 1.2; }
.artigo-corpo ul { list-style: disc; padding-left: 1.3em; margin: 0 0 1.2em; }
.artigo-corpo ul li::marker { color: var(--azul); }
.artigo-corpo li { margin-bottom: .4em; }
.artigo-corpo strong { font-weight: 600; color: var(--azul-fundo); }
.artigo-corpo a { color: var(--azul); text-decoration-color: var(--rosa); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.artigo-corpo blockquote { margin: 1.6em 0; padding: 4px 0 4px 26px; border-left: 3px solid var(--rosa); }
.artigo-corpo blockquote p { font: italic 400 23px/1.55 var(--serif); color: var(--azul-fundo); }
.artigo-figura { margin: 2em 0; }
.artigo-figura img { border-radius: var(--r-xs); }

.artigo-assinatura {
  max-width: 680px; margin: 64px auto 0; padding: 28px 32px; background: var(--rosa-100); border-radius: var(--r-card);
  display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 24px; align-items: center;
}
.artigo-assinatura img { width: 96px; height: 96px; border-radius: 50%; object-fit: cover; object-position: 40% 22%; }
.artigo-assinatura strong { display: block; font: 500 24px/1.25 var(--serif); color: var(--azul-fundo); margin-bottom: 4px; }
.artigo-assinatura span { display: block; font-size: 17px; line-height: 1.6; color: var(--tinta-2); }
/* título e botão lado a lado (empilham só no celular) */
.chamada-artigo {
  max-width: 680px; margin: 40px auto var(--secao); padding: 36px 40px; border-radius: var(--r-card);
  background: var(--rosa); display: flex; align-items: center; justify-content: space-between; gap: 20px 32px;
}
.chamada-artigo p { margin: 0; flex: 1 1 auto; min-width: 0; font: italic 400 25px/1.35 var(--serif); color: var(--azul-fundo); text-wrap: pretty; }
.chamada-artigo .botao { flex: none; }

.continue { margin-bottom: clamp(40px, 5vw, 72px); padding-top: clamp(64px, 6.5vw, 92px); }   /* marfim entre o painel e o rodapé; topo mais curto (a rubrica sozinha não pede 136 px) */
.continue .rubrica { margin-bottom: 40px; }
.continue__todos { margin: 56px 0 0; }

/* ==========================================================================
   RESPONSIVO
   ========================================================================== */
@media (max-width: 1320px) {
  .menu ul { gap: 24px; }
  .topo__barra-in { gap: 28px; }
}

/* rodapé em 2×2 quando 4 colunas iguais ficariam estreitas para o e-mail e o horário */
@media (max-width: 1260px) {
  .rodape__grade { grid-template-columns: 1fr 1fr; gap: 48px 64px; }
}

@media (max-width: 1180px) {
  .menu { display: none; }
  .hamburguer { display: inline-flex; }
  :root { --secao: 112px; }
  .capa__grade { gap: 72px; grid-template-columns: minmax(0, 1fr) minmax(0, 400px); }
  .sobre { gap: 72px; grid-template-columns: minmax(0, 400px) minmax(0, 1fr); }
  .pediatria { gap: 0 64px; grid-template-columns: minmax(0, 1fr) minmax(0, 420px); }
}

/* avaliações: 2 cards visíveis no tablet */
@media (max-width: 1100px) {
  .aval { flex-basis: calc((100% - 24px) / 2); }
}

@media (max-width: 1260px) and (min-width: 961px) {
  .local__rotas { grid-template-columns: 1fr 1fr; }
  .local__rotas .js-copiar { grid-column: 1 / -1; }
}

@media (max-width: 960px) {
  :root { --gutter: 32px; --secao: 96px; }
  .topo__faixa { display: none; }
  .topo { top: 0; }
  .aval__abre, .art__abre, .atend__abre, .consulta__abre { grid-template-columns: 1fr; gap: 0; margin-bottom: 52px; align-items: start; }
  .atend__abre .rubrica, .atend__abre h2, .atend__abre .apoio, .consulta__abre .rubrica, .consulta__abre h2, .consulta__abre .apoio { grid-column: 1; grid-row: auto; }
  .apoio { margin-top: 26px; }
  .capa { padding: 48px 0 96px; }
  .capa__grade { display: flex; flex-direction: column; align-items: stretch; gap: 0; }
  .capa__texto { display: contents; }
  .capa__foto { order: 5; max-width: 460px; width: calc(100% - 28px); margin: 64px auto 24px; align-self: center; }
  .capa__etiqueta { left: 20px; top: auto; bottom: 24px; }
  .capa__moldura::before { transform: translate(-24px, 24px); }
  .sobre { grid-template-columns: 1fr; gap: 56px; }
  .sobre__foto { max-width: 440px; position: relative; top: auto; }
  .sobre__texto { padding-top: 0; }
  .pediatria { grid-template-columns: 1fr; grid-template-areas: "abre" "foto" "marcos" "fecho"; gap: 0; }
  .pediatria__foto { margin-top: 56px; max-width: 520px; }
  .marcos { grid-template-columns: 1fr; margin-top: 56px; border-bottom: 1px solid var(--linha-clara); }
  .marcos li { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 24px; padding: 22px 0; }
  .marcos__quando { margin: 0; font-size: 23px; }
  .pediatria__fecho { margin-top: 48px; padding-top: 0; border-top: 0; }
  .atend__grupos { grid-template-columns: 1fr; gap: 56px; }
  .atend__grupo--criancas, .atend__grupo--adultos, .atend__grupo--todos { grid-column: 1; grid-row: auto; margin: 0; }
  .atend__grupo--todos { grid-template-columns: 1fr; gap: 18px; padding: 30px 28px; }
  .atend__grupo--adultos { order: 2; }
  .atend__grupo--todos { order: 3; }
  .consult { grid-template-columns: 1fr 1fr; grid-template-rows: auto; gap: 40px 20px; }
  .consult__abre, .consult__a { grid-column: 1 / -1; grid-row: auto; }
  .consult__a { max-width: 640px; }
  .consult__a img { flex: none; height: auto; aspect-ratio: 4 / 5; }
  .consult__b { grid-column: 1; grid-row: auto; }
  .consult__c { grid-column: 2; grid-row: auto; }
  .consulta__itens { grid-template-columns: 1fr; }
  .consulta__itens { gap: 0; }
  .consulta__itens li { padding: 30px 0; }
  .consulta__itens li:first-child { padding-top: 8px; }
  .consulta__itens li + li { border-top: 1px solid var(--linha-rosa); }
  .consulta__n { font-size: 38px; margin-bottom: 14px; }
  .aval__nota { justify-self: start; margin-top: 36px; }
  .art__grade { grid-template-columns: 1fr; gap: 48px; }
  .art--destaque a { grid-template-columns: 1fr; }
  .art--destaque .art__img { grid-row: auto; margin-bottom: 26px; }
  .local { grid-template-columns: 1fr; gap: 56px; }
  .mapa { flex: none; }
  .mapa__janela { flex: none; min-height: 0; aspect-ratio: 4 / 5; max-height: 720px; }
  .rodape__chamada-in { grid-template-columns: 1fr; padding-top: 64px; padding-bottom: 64px; }
  .rodape__chamada-acao { align-items: flex-start; text-align: left; justify-self: start; }
  .cartoes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .blog-topo__in { grid-template-columns: 1fr; }
  .blog-topo__apoio { margin-top: 28px; }
  .artigo-topo--lado .artigo-topo__in { grid-template-columns: 1fr; gap: 36px; }
  .artigo-topo__foto { max-width: 360px; }
}

@media (max-width: 640px) {
  :root { --gutter: 22px; --secao: 80px; --barra-h: 72px; --r-lg: 22px; --r-md: 18px; --r-sm: 14px; --r-card: 16px; --r-painel: 20px; --recuo: 8px; }
  body { font-size: 18px; line-height: 1.66; }
  h2 { font-size: clamp(34px, 7vw + 8px, 44px); line-height: 1.08; }
  h3, h4 { font-size: 24px; }
  .botao { min-height: 56px; padding: 0 24px; }
  .botao--topo { display: none; }
  .topo__barra-in { gap: 6px; }
  .topo__wpp { display: grid; }
  .marca { gap: 10px; }
  .marca__selo { width: 42px; height: 42px; }
  .marca__selo b { font-size: 17px; }
  .marca__nome { font-size: 23px; }
  .marca__sub { font-size: 15px; margin-top: 3px; }
  .marca__sub-mais { display: none; }
  .hamburguer__rotulo { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .hamburguer { padding: 0 11px; margin-right: -11px; }

  /* abertura enxuta: título, texto, foto (rosto e olhos acima da dobra em 390×844), botão e selos */
  .capa { padding: 24px 0 72px; }
  .capa__sobre { font-size: 16px; margin-bottom: 16px; }
  .capa__rj { display: none; }
  .capa__sobre::before { width: 32px; }
  .capa h1 { font-size: clamp(40px, 9.6vw + 4px, 52px); line-height: 1.02; margin-bottom: 18px; }
  .capa__lead { font-size: 19px; line-height: 1.6; }
  .capa__acoes { order: 6; margin-top: 0; gap: 12px; flex-direction: column; align-items: stretch; }
  .capa__selos { order: 7; }
  .capa__acoes .botao { width: 100%; }
  .capa__acoes .link-seta { align-self: flex-start; }
  .capa__selos { margin-top: 22px; }
  .capa__foto { width: calc(100% - 20px); margin: 26px auto 44px; }
  /* moldura 5:4 com o rosto na metade de cima (no 4:5 os 40% de cima eram só parede) */
  .capa__moldura img { aspect-ratio: 5 / 4; object-position: 50% 70%; border-radius: var(--r-lg); }
  .capa__moldura::before { transform: translate(-14px, 14px); border-radius: var(--r-lg); }
  .capa__etiqueta { left: -10px; top: auto; bottom: -30px; padding: 11px 16px 12px; }
  .capa__etiqueta strong { font-size: 20px; }

  .manifesto { padding: 72px 0 68px; }
  .manifesto__aspas { font-size: 110px; height: 50px; }
  .manifesto blockquote p { font-size: 27px; line-height: 1.32; }

  .sobre__foto { margin: 0 14px 0 0; }
  .sobre__quadro::before { inset: 30% -14px -14px 22%; border-radius: calc(var(--r-lg) + 4px); }
  .sobre__foto figcaption { margin-top: 36px; }
  .sobre__abre { font-size: 23px; }
  .ficha { grid-template-columns: 1fr; }
  .ficha { padding: 4px 22px 8px; margin-top: 36px; }
  .ficha div { padding: 14px 0 16px; }
  .ficha div:nth-child(2) { border-top: 1px solid var(--linha); }
  .ficha dd { font-size: 18px; }

  .pediatria__abre h2 { font-size: 42px; margin-bottom: 28px; }
  .pediatria__lead { font-size: 19px; }
  .pediatria__foto { margin-top: 44px; }
  .marcos li { grid-template-columns: 1fr; gap: 6px; padding: 18px 0; }
  .marcos p { font-size: 18px; }
  .pediatria .botao { width: 100%; }
  .pediatria__num { font-size: 76px; }
  .pediatria__num-legenda { font-size: 16px; }

  .atend__titulo { font-size: 17px; }
  .indice li { grid-template-columns: 46px minmax(0, 1fr); padding: 22px 0 24px; }
  .indice__n { font-size: 21px; }
  .indice h4 { margin-bottom: 6px; font-size: 24px; }

  .consult { gap: 32px 14px; }
  .consult__b, .consult__c { align-self: start; }
  .consulta__fecho { margin-top: 24px; }

  .consulta__fecho p { font-size: 22px; }
  .consulta__fecho .botao { width: 100%; }

  .aval__num { font-size: 88px; }
  .aval__nota p { font-size: 17px; }
  .aval__nota { gap: 20px; }
  /* 1 card + um pedaço do próximo; o trilho vai até a borda da tela */
  /* a assinatura vem logo depois do texto e o trilho acompanha o card da vez (as setas sobem junto);
     com stretch os cards curtos ficavam com 400–450 px de areia vazia e o nome caía fora da tela */
  .aval__trilho { gap: 14px; margin-inline: calc(var(--gutter) * -1); padding-inline: var(--gutter); scroll-padding-inline: var(--gutter); border-radius: 0; }
  .aval__trilho:focus-visible { outline-offset: -3px; }
  .aval { flex-basis: 86%; padding: 24px 22px 22px; }
  .aval::before { font-size: 38px; height: 20px; margin-bottom: 10px; }
  .aval blockquote p { font-size: 18px; }
  .aval__controles { margin-top: 24px; }
  .aval__barra { width: 96px; }
  .aval__seta { width: 48px; height: 48px; }

  .art__grade { gap: 44px; }
  .art h3 { font-size: 25px; }
  .art--destaque h3 { font-size: 30px; }
  .art:not(.art--destaque) a { grid-template-columns: 1fr; gap: 0; }
  .art:not(.art--destaque) .art__img { margin-bottom: 22px; border-radius: var(--r-md); }
  .art:not(.art--destaque) .art__img img { aspect-ratio: 3 / 2; }

  .local__info h2 { margin-bottom: 36px; }
  .endereco { padding-left: 20px; }
  .endereco__predio { font-size: 34px; }
  .endereco__linha { font-size: 24px; }
  .local__rotas { display: grid; grid-template-columns: 1fr 1fr; margin: 28px 0 36px; }
  .local__rotas .botao { width: 100%; padding: 0 14px; }
  .local__rotas .js-copiar { grid-column: 1 / -1; }
  .canais a, .canais li > div { grid-template-columns: 1fr; gap: 2px; padding-block: 12px; min-height: 72px; }
  .canais__val { font-size: 18px; }
  .mapa__painel { padding: 18px 0 0; }
  .mapa__painel .botao { width: 100%; }
  .mapa__legenda strong { font-size: 23px; }

  .rodape__chamada-in { padding-top: 56px; padding-bottom: 56px; gap: 28px; }
  .rodape__chamada-txt { font-size: 38px; }
  .rodape__chamada-acao, .rodape__chamada-acao .botao { width: 100%; }
  .rodape__marca { grid-template-columns: 1fr; gap: 0; padding: 56px 0 40px; }
  .rodape__selo { width: 60px; height: 60px; grid-row: auto; margin-bottom: 20px; }
  .rodape__selo b { font-size: 25px; }
  .rodape__nome { font-size: 46px; }
  .rodape__sub { font-size: 17px; }
  .rodape__grade { grid-template-columns: 1fr; gap: 0; padding: 8px 0 40px; }
  .rodape__bloco { padding: 32px 0; border-top: 1px solid var(--linha); }
  .rodape__bloco:first-child { border-top: 0; }
  .rodape__links a, .rodape__lista a { min-height: 48px; }
  .rodape__lista--nav { display: grid; grid-template-columns: 1fr 1fr; }
  .rodape__legal-in { flex-direction: column; padding-bottom: calc(32px + env(safe-area-inset-bottom, 0px)); }
  .wpp-flutuante { right: 16px; bottom: 16px; height: 56px; min-width: 56px; }

  .blog-topo { padding: 44px 0 40px; }
  .blog-topo h1 { font-size: 44px; }
  .blog-topo__apoio { font-size: 19px; margin-top: 22px; }
  .filtros { margin-top: 30px; }
  .lista-artigos { padding-top: 48px; }
  .cartoes { grid-template-columns: 1fr; gap: 52px; }
  .cartao__tit { font-size: 25px; }
  .cartao__resumo { font-size: 18px; }

  .artigo-topo { padding: 28px 0 36px; }
  .voltar { margin-bottom: 12px; }
  .artigo-topo h1 { font-size: 36px; line-height: 1.1; }
  body:not(.pagina-home) .wpp-flutuante { display: none; }
  .artigo-topo__foto { max-width: none; margin: 0; }
  .artigo-topo__foto img { aspect-ratio: 4 / 3; }
  .artigo-capa { margin-bottom: 40px; }
  .artigo-capa .container { padding: 0 8px; }
  .artigo-capa img { border-radius: 20px; }
  .artigo-topo--tipo { padding-bottom: 44px; }
  .artigo-topo--tipo .artigo-topo__texto { padding-bottom: 30px; }
  .artigo-corpo p, .artigo-corpo li { font-size: 18px; line-height: 1.72; }
  .artigo-corpo > p:first-child { font-size: 21px; }
  .artigo-corpo h2, .artigo-corpo h3 { font-size: 27px; }
  .artigo-assinatura { grid-template-columns: minmax(0, 1fr); gap: 16px; align-items: start; margin-top: 48px; margin-inline: -14px; padding: 24px 22px; }
  .artigo-assinatura img { width: 72px; height: 72px; }
  .artigo-assinatura span { font-size: 16px; }
  .chamada-artigo { padding: 28px 22px; margin-inline: -14px; flex-direction: column; align-items: stretch; }
  .chamada-artigo .botao { width: 100%; }
}

@media (max-width: 400px) {
  .aval__nota { flex-wrap: wrap; gap: 14px 20px; }
  .aval__nota p, .aval__nota .link-seta { white-space: nowrap; }
}

@media (max-width: 380px) {
  .marca__selo { display: none; }
  .capa h1 { font-size: 38px; }
  .local__rotas { grid-template-columns: 1fr; }
}

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

/* Símbolo da logo da Dra. Isadora (substitui o monograma "IS") */
.marca__selo::before, .rodape__selo::before { display: none; }
.marca__selo img, .rodape__selo img, .capa-tema__selo img { position: relative; display: block; width: 100%; height: 100%; object-fit: contain; }
.capa-tema__selo img { opacity: .9; }

/* Logo completa da Dra. Isadora no cabeçalho (arquivo original do site) */
.marca__logo { display: block; height: 58px; width: auto; }
@media (max-width: 640px) { .marca__logo { height: 40px; } }

/* Logo completa no rodapé */
.rodape__marca { display: flex; flex-direction: column; align-items: flex-start; gap: 18px; }
.rodape__logo { display: block; height: 78px; width: auto; }
@media (max-width: 640px) { .rodape__logo { height: 58px; } }

/* Redes sociais na seção de contato */
.canais__redes { display: flex !important; flex-wrap: wrap; justify-content: flex-start; gap: 8px 28px; }
.canais__redes a { flex: none; width: auto; }
.canais__redes a { color: inherit; text-decoration: underline; text-decoration-color: var(--rosa); text-decoration-thickness: 2px; text-underline-offset: 5px; }
.canais__redes a:hover { color: var(--azul); }
.canais .canais__redes a { display: inline; padding: 0; margin: 0; min-height: 0; grid-template-columns: none; border-radius: 0; }
.canais .canais__redes a:hover { background: none; }

/* 20/10: sem numeração nas seções e na lista de atendimentos */
.indice li { grid-template-columns: minmax(0, 1fr) !important; }

/* 20/10: momento da Retina e adultos (mesmo peso do bloco da infância) */
.retina__grade { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); grid-template-areas: "abre dado" "itens itens" "fecho fecho"; gap: 0 80px; align-items: end; }
.retina__abre { grid-area: abre; max-width: 660px; }
.retina__abre h2 { font-size: clamp(42px, 3.4vw + 16px, 72px); line-height: 1.02; margin-bottom: 36px; }
.retina__lead { font-size: 21px; line-height: 1.66; color: var(--tinta); margin: 0; }
.retina__dado { grid-area: dado; margin: 0; display: flex; flex-direction: column; gap: 14px; justify-self: end; text-align: right; }
.retina__sigla { font: italic 400 clamp(96px, 9vw, 168px)/.8 var(--serif); color: var(--azul); letter-spacing: -.02em; }
.retina__legenda { font: 500 18px/1.45 var(--sans); color: var(--tinta); max-width: 19em; margin-left: auto; }
.retina__itens { grid-area: itens; list-style: none; margin: 72px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 48px; }
.retina__itens li { position: relative; border-top: 1px solid rgba(18, 79, 118, .28); padding-top: 26px; }
.retina__itens li::before { content: ""; position: absolute; top: -5px; left: 0; width: 9px; height: 9px; border-radius: 50%; background: var(--azul); }
.retina__itens h3 { font: 500 25px/1.3 var(--serif); color: var(--azul); margin: 0 0 10px; }
.retina__itens p { margin: 0; font-size: 19px; color: var(--tinta); }
.retina__fecho { grid-area: fecho; margin-top: 56px; }
@media (max-width: 900px) {
  .retina__grade { grid-template-columns: 1fr; grid-template-areas: "abre" "dado" "itens" "fecho"; }
  .retina__dado { justify-self: start; text-align: left; margin-top: 44px; }
  .retina__legenda { margin-left: 0; }
  .retina__itens { grid-template-columns: 1fr; margin-top: 44px; }
  .retina__itens li { padding: 20px 0; }
}
@media (max-width: 640px) {
  .retina__abre h2 { font-size: 42px; margin-bottom: 28px; }
  .retina__lead { font-size: 19px; }
  .retina__sigla { font-size: 92px; }
  .retina__itens p { font-size: 18px; }
  .retina .botao { width: 100%; }
}

/* 20/10: capa sem foto vira placa editorial por tema (sem logo), nome do tema grande */
.capa-tema { justify-content: flex-end; align-items: flex-start; padding: 26px 28px; }
.capa-tema__nome { font: italic 400 clamp(38px, 3.2vw, 52px)/1 var(--serif); letter-spacing: -.015em; }
.capa-tema--retina { background: var(--azul); --anel: var(--rosa); --anel-fundo: rgba(219, 179, 169, .12); }
.capa-tema--retina .capa-tema__nome { color: var(--rosa); }
.cartao--sem-foto:hover .capa-tema--retina { background: var(--azul-noite, #0B2E45); }
.capa-tema--infantil { background: var(--rosa); }
.capa-tema--infantil .capa-tema__nome { color: var(--azul-noite, #0B2E45); }
.capa-tema--saude { background: var(--rosa-200); }

/* 20/10: ajustes do detector — palavras sozinhas, títulos, alvos de toque */
p, li, figcaption, .apoio, blockquote { text-wrap: pretty; }
h1, h2, h3 { text-wrap: balance; }
.visualmente-oculto { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
h2.rubrica { font-size: 16px; }
.rodape__priv { display: inline-block; padding: 12px 0; }
.canais__redes a { padding: 10px 0 !important; }
.sem-quebra { white-space: nowrap; }
.retina { margin-bottom: clamp(64px, 8vw, 120px); }

/* 20/10: retina sem o "USP" gigante; formação como linha sóbria */
.retina__grade { grid-template-columns: 1fr; grid-template-areas: "abre" "itens" "fecho"; }
.retina__abre { max-width: 760px; }
.retina__formacao { margin: 28px 0 0; display: flex; align-items: center; gap: 14px; font: 600 17px/1.4 var(--sans); color: var(--azul); }
.retina__formacao::before { content: ""; width: 44px; height: 1px; background: var(--azul); opacity: .6; flex: none; }
/* horário da consulta em texto simples, sem itálico de destaque */
.consulta__fecho p { font: 400 18px/1.5 var(--sans) !important; color: var(--tinta); }
/* 20/10: "7–9" no mesmo tamanho dos marcos (não é destaque de idade atendida) */
.pediatria__dado { align-items: baseline !important; gap: 12px !important; }
.pediatria__num { font: 500 25px/1.3 var(--serif) !important; letter-spacing: 0 !important; color: var(--rosa); }
.pediatria__num-legenda { font: 400 19px/1.5 var(--sans) !important; max-width: none !important; padding: 0 !important; }
@media (max-width: 640px) { .pediatria__num { font-size: 23px !important; } .pediatria__num-legenda { font-size: 18px !important; } }

/* 20/10: quatro marcos da infância — 4 lado a lado, 2×2 no tablet, lista no celular */
.marcos { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 0 40px !important; }
.pediatria__fecho { justify-content: flex-end; }
@media (max-width: 1100px) and (min-width: 901px) { .marcos { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; row-gap: 36px !important; } }
@media (max-width: 900px) { .marcos { grid-template-columns: 1fr !important; } }
.pediatria__fecho { border-top: 0 !important; padding-top: 0 !important; margin-top: 56px !important; justify-content: flex-start !important; }

/* 20/10 (pedido da médica): botões de WhatsApp no verde do WhatsApp */
:root { --wpp: #25D366; --wpp-escuro: #1DA851; }
.botao[href*="wa.me"], .topo__wpp, .wpp-flutuante { background: var(--wpp) !important; color: #fff !important; border-color: transparent !important; }
.botao[href*="wa.me"]:hover, .topo__wpp:hover, .wpp-flutuante:hover, .wpp-flutuante:focus-visible { background: var(--wpp-escuro) !important; }
.wpp-flutuante { box-shadow: 0 0 0 3px var(--marfim), 0 12px 28px -10px rgba(18, 140, 70, .55); }

/* 20/10: três marcos de novo (sem o "7 a 9 anos") */
.marcos { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 0 48px !important; }
@media (max-width: 1100px) and (min-width: 901px) { .marcos { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } }
@media (max-width: 900px) { .marcos { grid-template-columns: 1fr !important; } }

/* 20/10: prematuros em destaque dentro da infância */
.pediatria { grid-template-areas: "abre foto" "prem prem" "marcos marcos" "fecho fecho"; }
.prematuros {
  grid-area: prem; margin-top: 80px; padding: 48px 56px; border-radius: var(--r-lg);
  background: rgba(219, 179, 169, .12); border: 1px solid rgba(219, 179, 169, .45);
  display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 8px 64px; align-items: start;
}
.prematuros__rot { grid-column: 1; margin: 0 0 6px; font: 600 15px/1.4 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--rosa); }
.prematuros h3 { grid-column: 1; margin: 0; font: 400 clamp(32px, 2vw + 14px, 44px)/1.1 var(--serif); color: var(--marfim); }
.prematuros h3 em { color: var(--rosa); }
.prematuros__texto { grid-column: 2; grid-row: 1 / 3; }
.prematuros__texto p { margin: 0 0 16px; font-size: 19px; line-height: 1.6; color: var(--marfim); }
.link-seta--clara { color: var(--marfim); }
@media (max-width: 900px) {
  .pediatria { grid-template-areas: "abre" "foto" "prem" "marcos" "fecho"; }
  .prematuros { grid-template-columns: 1fr; margin-top: 56px; padding: 36px 32px; }
  .prematuros__texto { grid-column: 1; grid-row: auto; margin-top: 20px; }
}
@media (max-width: 640px) {
  .prematuros { padding: 28px 22px; }
  .prematuros h3 { font-size: 30px; }
  .prematuros__texto p { font-size: 18px; }
}

/* 20/10: seção de miopia */
.miopia__grade { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); grid-template-areas: "abre blocos" "fecho blocos"; gap: 0 96px; align-items: start; }
.miopia__abre { grid-area: abre; }
.miopia__abre h2 { font-size: clamp(42px, 3.4vw + 16px, 72px); line-height: 1.02; margin-bottom: 36px; }
.miopia__lead { font-size: 21px; line-height: 1.66; color: var(--tinta); margin: 0; max-width: 30em; }
.miopia__blocos { grid-area: blocos; display: grid; gap: 0; }
.miopia__bloco { position: relative; border-top: 1px solid rgba(18, 79, 118, .28); padding: 30px 0 36px; }
.miopia__bloco::before { content: ""; position: absolute; top: -5px; left: 0; width: 9px; height: 9px; border-radius: 50%; background: var(--azul); }
.miopia__bloco h3 { font: 500 30px/1.25 var(--serif); color: var(--azul); margin: 0 0 12px; }
.miopia__bloco p { margin: 0 0 14px; font-size: 19px; line-height: 1.6; color: var(--tinta); }
.miopia__fecho { grid-area: fecho; margin-top: 48px; }
@media (max-width: 900px) {
  .miopia__grade { grid-template-columns: 1fr; grid-template-areas: "abre" "blocos" "fecho"; }
  .miopia__blocos { margin-top: 48px; }
  .miopia__fecho { margin-top: 24px; }
}
@media (max-width: 640px) {
  .miopia__abre h2 { font-size: 42px; margin-bottom: 28px; }
  .miopia__lead { font-size: 19px; }
  .miopia__bloco h3 { font-size: 26px; }
  .miopia__bloco p { font-size: 18px; }
  .miopia .botao { width: 100%; }
}
.prematuros { grid-template-rows: auto 1fr; }
.prematuros h3 { align-self: start; }
.miopia__abre h2 { font-size: clamp(42px, 2.8vw + 16px, 64px); }

/* 22/10: recorte da foto "A médica" sem ampliar além do tamanho real do arquivo
   (antes 155% = foto esticada 1,23× em tela retina; agora 134%: x 0–905, y 0–1131 do original, ~1,07×,
   sem a lente cortada na borda direita) */
.sobre__recorte img { width: 133.92% !important; margin: 0 !important; }

/* 22/10: assinatura discreta da Hub Médica no rodapé: frase miúda e apagada, só a logo é link (acende ao passar o mouse) */
.assinatura { display: inline-flex; align-items: center; gap: 10px; }
.assinatura__txt { font: 400 15px/1.5 var(--sans) !important; letter-spacing: 0; color: var(--claro-2); opacity: .55; }
.assinatura a { display: inline-flex; align-items: center; padding: 10px 2px; color: var(--claro-2) !important; opacity: .7; transition: opacity .2s, color .2s; }
.assinatura a:hover, .assinatura a:focus-visible { opacity: 1; color: var(--marfim) !important; }
.assinatura__logo { height: 28px; width: auto; display: block; }

/* 05/11: páginas que vieram do site original (Cursos, E-book, Política, Termos), no visual novo */
.pagina-topo { padding-bottom: 64px; }
.pagina-topo__lead p { font: 400 23px/1.6 var(--serif); color: var(--azul-fundo); margin: 24px 0 0; max-width: 34em; }
.pagina-topo__lead strong { font-weight: 600; }
.cursos__lista { display: grid; gap: 40px; max-width: 1040px; }
.curso { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 48px; align-items: start; background: var(--marfim); border-radius: var(--r-lg); padding: 48px; }
.curso__img { width: 240px; height: 240px; border-radius: var(--r-md); object-fit: cover; }
.curso h2 { font-size: clamp(30px, 1.4vw + 20px, 40px); line-height: 1.15; margin: 0 0 18px; }
.curso p, .curso li { font-size: 18px; line-height: 1.65; }
.curso p { margin: 0 0 14px; }
.curso strong { font-weight: 600; color: var(--azul-fundo); }
.curso ul { list-style: disc; padding-left: 1.3em; margin: 0 0 28px; }
.curso li::marker { color: var(--azul); }
.ebook { display: grid; grid-template-columns: minmax(0, 380px) minmax(0, 1fr); gap: 72px; align-items: start; max-width: 1120px; }
.ebook__capa { margin: 0; }
.ebook__capa img { width: 100%; height: auto; border-radius: var(--r-md); box-shadow: 0 24px 48px -28px rgba(11, 46, 69, .45); }
.ebook__texto h1 { font-size: clamp(38px, 2.2vw + 22px, 56px); line-height: 1.06; margin: 0 0 28px; }
.ebook__texto > p { font-size: 19px; line-height: 1.7; margin: 0 0 16px; }
.ebook__baixar { margin: 36px 0 28px; padding: 32px; border-radius: var(--r-lg); background: var(--rosa-100); }
.ebook__baixar h2 { font-size: 30px; margin: 0 0 10px; }
.ebook__baixar p { margin: 0 0 22px; font-size: 18px; }
.ebook__autora { font-size: 16px !important; color: var(--tinta-2); }
.ebook-conteudo h2 { font-size: clamp(30px, 1.4vw + 20px, 42px); line-height: 1.15; margin: 8px 0 32px; }
.ebook-conteudo__rot { margin: 0; font-size: 18px; }
.ebook-conteudo__lista { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 40px; }
.ebook-conteudo__lista li { padding: 14px 0 14px 26px; border-top: 1px solid rgba(18, 79, 118, .18); position: relative; font-size: 18px; }
.ebook-conteudo__lista li::before { content: ""; position: absolute; left: 0; top: 24px; width: 9px; height: 9px; border-radius: 50%; background: var(--rosa); }
.ebook-conteudo__fecho { margin-top: 56px; }
.ebook-conteudo__fecho h2 { margin-bottom: 24px; }
.ebook-conteudo__legal { margin: 28px 0 0; font-size: 16px; }
.ebook-conteudo__legal a { color: var(--azul); text-underline-offset: 4px; }
.pagina-legal { padding: 56px 0 96px; }
.pagina-legal .artigo-corpo > p:first-child { font: inherit; color: inherit; }
.pagina-legal h1 { font-size: clamp(38px, 2.2vw + 22px, 56px); margin: 0 0 32px; }
@media (max-width: 900px) {
  .curso { grid-template-columns: 1fr; gap: 28px; padding: 32px 24px; }
  .ebook { grid-template-columns: 1fr; gap: 40px; }
  .ebook__capa { max-width: 320px; }
}
@media (max-width: 640px) {
  .pagina-topo__lead p { font-size: 20px; }
  .curso__img { width: 180px; height: 180px; }
  .ebook-conteudo__lista { grid-template-columns: 1fr; }
  .curso .botao, .ebook .botao, .ebook-conteudo .botao { width: 100%; }
}

/* Cursos: menos respiro no topo do bloco das mentorias */
.secao.cursos { padding-top: 56px; }
@media (max-width: 760px) { .secao.cursos { padding-top: 32px; } }