/* Dr. Rodrigo Gavaldão — site institucional
   Layout: faixa escura de abertura que continua o fundo do retrato; páginas internas em coluna de leitura com cartão de agendamento ao lado.
   Paleta e tipografia do manual de identidade visual (fundo claro, versão única de tema). */
:root {
  --azul: #335576;        /* azul institucional */
  --profundo: #172B40;    /* azul profundo */
  --ciano: #55C5E5;       /* destaque */
  --ciano-texto: #1F7EA0; /* ciano escurecido para texto sobre fundo claro */
  --acinzentado: #6A839B; /* texto de apoio */
  --gelo: #F3F6F9;        /* fundo alternativo */
  --branco: #FFFFFF;
  --tinta: #1C2B3B;       /* texto corrido */
  --linha: #DCE4EC;       /* bordas finas */
  --retrato: #19222E;     /* fundo da abertura, igual ao do retrato */
  --pendente: #FFF1B8;

  --f-titulo: "Cormorant Garamond", "Cormorant", Garamond, "Times New Roman", serif;
  --f-texto: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --f-rotulo: "Montserrat", "Inter", system-ui, sans-serif;

  --t-1: clamp(2.4rem, 1.6rem + 3.4vw, 4rem);
  --t-2: clamp(1.9rem, 1.4rem + 1.8vw, 2.6rem);
  --t-3: 1.45rem;
  --t-corpo: 1.0625rem;
  --t-peq: 0.875rem;
  --t-rotulo: 0.72rem;

  --largura: 1160px;
  --leitura: 66ch;
  --raio: 6px;
  color-scheme: light;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } * { transition: none !important; animation: none !important; } }
body {
  margin: 0;
  background: var(--branco);
  color: var(--tinta);
  font-family: var(--f-texto);
  font-size: var(--t-corpo);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--azul); text-underline-offset: 3px; }
a:hover { color: var(--profundo); }
:focus-visible { outline: 2px solid var(--ciano); outline-offset: 3px; border-radius: 2px; }
h1, h2, h3 { font-family: var(--f-titulo); font-weight: 600; color: var(--profundo); line-height: 1.12; text-wrap: balance; margin: 0; }
h1 { font-size: var(--t-1); letter-spacing: -0.005em; }
h2 { font-size: var(--t-2); }
h3 { font-size: var(--t-3); }
p { margin: 0; }
.pendente { background: var(--pendente); color: #5C4A00; padding: 0 .3em; border-radius: 3px; font-weight: 500; white-space: nowrap; }

.faixa { padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); }
.miolo { max-width: var(--largura); margin: 0 auto; }
.rotulo {
  font-family: var(--f-rotulo); font-size: var(--t-rotulo); font-weight: 600;
  letter-spacing: .18em; text-transform: uppercase; color: var(--ciano-texto);
}

/* Cabeçalho */
body::before { content: ""; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top, 0px); z-index: 30; background: var(--branco); }
.topo { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 20; background: rgba(255,255,255,.96); backdrop-filter: blur(8px); border-bottom: 1px solid var(--linha); }
.topo .miolo { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 76px; }
.marca { display: flex; align-items: center; gap: 12px; text-decoration: none; color: var(--azul); min-width: 0; }
.marca img { width: 46px; height: auto; flex: none; }
.marca-texto { display: flex; flex-direction: column; line-height: 1.15; min-width: 0; }
.marca-nome { font-family: var(--f-titulo); font-weight: 600; font-size: 1.28rem; letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; }
.marca-sub { font-family: var(--f-rotulo); font-size: .6rem; font-weight: 500; letter-spacing: .26em; text-transform: uppercase; color: var(--acinzentado); white-space: nowrap; }
.menu { display: flex; align-items: center; gap: 4px; }
.menu a { font-family: var(--f-rotulo); font-size: .76rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; text-decoration: none; color: var(--tinta); padding: 10px 12px; border-radius: var(--raio); }
.menu a:hover, .menu a[aria-current="page"] { color: var(--azul); background: var(--gelo); }
.menu .botao { margin-left: 8px; }
.abre-menu { display: none; background: none; border: 1px solid var(--linha); border-radius: var(--raio); padding: 9px 12px; font-family: var(--f-rotulo); font-size: .72rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--profundo); cursor: pointer; }

@media (max-width: 960px) {
  .abre-menu { display: inline-block; }
  .menu { display: none; position: absolute; left: 0; right: 0; top: 100%; flex-direction: column; align-items: stretch; background: var(--branco); border-bottom: 1px solid var(--linha); padding: 8px max(16px, env(safe-area-inset-right, 0px)) 16px max(16px, env(safe-area-inset-left, 0px)); gap: 2px; }
  .menu.aberto { display: flex; }
  .menu a { padding: 14px 12px; font-size: .82rem; }
  .menu .botao { margin: 8px 0 0; justify-content: center; }
}
@media (max-width: 420px) {
  .marca-nome { font-size: 1.02rem; letter-spacing: .06em; }
  .marca-sub { font-size: .5rem; letter-spacing: .18em; }
  .marca img { width: 38px; }
}

/* Botões */
.botao {
  display: inline-flex; align-items: center; gap: 10px; text-decoration: none;
  font-family: var(--f-rotulo); font-size: .8rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase;
  padding: 15px 24px; border-radius: var(--raio); border: 1px solid transparent; cursor: pointer; transition: background .2s, color .2s, border-color .2s;
}
.botao svg { width: 18px; height: 18px; flex: none; }
.botao-principal { background: var(--azul); color: var(--branco); }
.botao-principal:hover { background: var(--profundo); color: var(--branco); }
.menu a.botao-principal, .menu a.botao-principal:hover { color: var(--branco); background: var(--azul); }
.menu a.botao-principal:hover { background: var(--profundo); }
.botao-claro { background: var(--ciano); color: var(--profundo); }
.botao-claro:hover { background: #7AD3EC; color: var(--profundo); }
.botao-contorno { border-color: rgba(255,255,255,.35); color: var(--branco); }
.botao-contorno:hover { border-color: var(--branco); color: var(--branco); }
.botao-contorno-escuro { border-color: var(--linha); color: var(--profundo); background: var(--branco); }
.botao-contorno-escuro:hover { border-color: var(--azul); color: var(--azul); }

/* Abertura (página inicial) */
.abertura { background: var(--retrato); color: #D7E2EC; position: relative; overflow: hidden; }
.abertura .miolo { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); align-items: end; min-height: 560px; }
.abertura-texto { padding-block: 72px 80px; display: grid; gap: 26px; position: relative; z-index: 2; }
.abertura .rotulo { color: var(--ciano); }
.abertura h1 { color: var(--branco); font-weight: 500; }
.abertura h1 em { font-style: italic; color: #A9DDEE; }
.abertura-lead { font-size: 1.12rem; max-width: 46ch; color: #C3D1DE; }
.acoes { display: flex; flex-wrap: wrap; gap: 12px; }
.credencial { font-family: var(--f-rotulo); font-size: .72rem; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: #8FA6BC; border-top: 1px solid rgba(255,255,255,.12); padding-top: 18px; }
.abertura-foto { align-self: stretch; position: relative; margin-right: calc(-1 * max(16px, env(safe-area-inset-right, 0px))); }
.abertura-foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 38% 18%;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 28%); mask-image: linear-gradient(90deg, transparent 0, #000 28%); }
.arcos { position: absolute; left: -120px; bottom: -220px; width: 640px; height: 640px; z-index: 1; pointer-events: none; opacity: .5; }
@media (max-width: 860px) {
  .abertura .miolo { grid-template-columns: 1fr; min-height: 0; }
  .abertura-foto { order: -1; height: 360px; margin-left: calc(-1 * max(16px, env(safe-area-inset-left, 0px))); }
  .abertura-foto img { object-position: 50% 15%; -webkit-mask-image: linear-gradient(180deg, #000 70%, transparent 100%); mask-image: linear-gradient(180deg, #000 70%, transparent 100%); }
  .abertura-texto { padding-block: 8px 56px; }
}

/* Seções */
.secao { padding-block: 88px; }
.secao-gelo { background: var(--gelo); }
.secao-escura { background: var(--profundo); color: #C9D6E2; }
.secao-escura h2, .secao-escura h3 { color: var(--branco); }
.secao-escura .rotulo { color: var(--ciano); }
.cabeca { display: grid; gap: 14px; max-width: 62ch; margin-bottom: 44px; }
.cabeca p { color: var(--acinzentado); }
.secao-escura .cabeca p { color: #9FB3C6; }

/* Condições */
.condicoes { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; border-top: 1px solid var(--linha); }
.condicoes li { list-style: none; padding: 22px 20px 22px 0; border-bottom: 1px solid var(--linha); display: grid; gap: 4px; }
.condicoes strong { font-family: var(--f-titulo); font-size: 1.3rem; font-weight: 600; color: var(--profundo); line-height: 1.2; }
.condicoes span { font-size: var(--t-peq); color: var(--acinzentado); }
.condicoes .regiao { font-family: var(--f-rotulo); font-size: .64rem; letter-spacing: .16em; text-transform: uppercase; color: var(--ciano-texto); font-weight: 600; }
ul.condicoes { margin: 0; padding: 0; }
@media (max-width: 900px) { .condicoes { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { .condicoes { grid-template-columns: 1fr; } }

/* Serviços */
.servicos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.servico { background: var(--branco); border: 1px solid var(--linha); border-radius: var(--raio); padding: 30px 28px; display: grid; grid-template-rows: auto auto 1fr auto; gap: 14px; text-decoration: none; color: var(--tinta); transition: border-color .2s, transform .2s; }
.servico:hover { border-color: var(--azul); color: var(--tinta); transform: translateY(-2px); }
.servico .icone { width: 48px; height: 48px; color: var(--azul); }
.servico p { color: var(--acinzentado); font-size: .98rem; }
.servico .onde { font-family: var(--f-rotulo); font-size: .68rem; letter-spacing: .14em; text-transform: uppercase; font-weight: 600; color: var(--ciano-texto); }
.servico .mais { font-family: var(--f-rotulo); font-size: .74rem; letter-spacing: .1em; text-transform: uppercase; font-weight: 600; color: var(--azul); }
@media (max-width: 900px) { .servicos { grid-template-columns: 1fr; } }

/* Etapas do atendimento */
.etapas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; counter-reset: etapa; margin: 0; padding: 0; }
.etapas li { list-style: none; display: grid; gap: 10px; border-top: 2px solid var(--ciano); padding-top: 20px; }
.etapas li::before { counter-increment: etapa; content: "Etapa " counter(etapa); font-family: var(--f-rotulo); font-size: .68rem; letter-spacing: .16em; text-transform: uppercase; font-weight: 600; color: var(--ciano); }
.etapas p { color: #A9BBCC; }
@media (max-width: 820px) { .etapas { grid-template-columns: 1fr; gap: 28px; } }

/* Sobre */
.sobre { display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); gap: 64px; align-items: start; }
.sobre-foto { border-radius: var(--raio); overflow: hidden; background: var(--retrato); aspect-ratio: 4 / 5; max-width: 100%; }
.sobre-foto img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; }
.sobre-texto { display: grid; gap: 22px; min-width: 0; }
.sobre-texto > p { max-width: var(--leitura); }
.curriculo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; margin-top: 10px; }
.curriculo h3 { font-family: var(--f-rotulo); font-size: var(--t-rotulo); letter-spacing: .18em; text-transform: uppercase; color: var(--ciano-texto); margin-bottom: 12px; }
.curriculo ul { margin: 0; padding: 0; display: grid; gap: 12px; }
.curriculo li { list-style: none; font-size: .96rem; padding-left: 16px; position: relative; }
.curriculo li::before { content: ""; position: absolute; left: 0; top: .72em; width: 7px; height: 1px; background: var(--azul); }
.curriculo .ano { color: var(--acinzentado); font-variant-numeric: tabular-nums; }
@media (max-width: 900px) { .sobre { grid-template-columns: 1fr; gap: 36px; } .sobre-foto { max-width: 420px; } }
@media (max-width: 560px) { .curriculo { grid-template-columns: 1fr; } }

/* Hospitais */
.hospitais { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin: 0; padding: 0; border-left: 1px solid var(--linha); }
.hospitais li { list-style: none; padding: 26px 22px; border-right: 1px solid var(--linha); display: grid; gap: 4px; }
.hospitais strong { font-family: var(--f-titulo); font-size: 1.3rem; font-weight: 600; color: var(--profundo); line-height: 1.2; }
.hospitais span { font-size: var(--t-peq); color: var(--acinzentado); }
.nota { margin-top: 18px; font-size: var(--t-peq); color: var(--acinzentado); }
@media (max-width: 900px) { .hospitais { grid-template-columns: repeat(2, minmax(0, 1fr)); border-left: 0; } .hospitais li { border-right: 0; border-bottom: 1px solid var(--linha); padding-left: 0; } }

/* Localização */
.local { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; align-items: center; }
.local-dados { display: grid; gap: 22px; }
.dado { display: grid; gap: 2px; }
.dado .rotulo { color: var(--ciano); }
.dado .valor { color: var(--branco); font-size: 1.12rem; }
.dado .valor a { color: var(--branco); }
.mapa { position: relative; border-radius: var(--raio); overflow: hidden; border: 1px solid rgba(255,255,255,.12); background: #1E3550; aspect-ratio: 4 / 3; max-width: 100%; display: block; text-decoration: none; }
.mapa svg { width: 100%; height: 100%; display: block; }
.mapa .legenda { position: absolute; left: 16px; bottom: 16px; background: var(--branco); color: var(--profundo); font-family: var(--f-rotulo); font-size: .72rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; padding: 10px 14px; border-radius: var(--raio); }
@media (max-width: 860px) { .local { grid-template-columns: 1fr; } }

/* Páginas internas */
.cabeca-pagina { background: var(--gelo); border-bottom: 1px solid var(--linha); }
.cabeca-pagina .miolo { padding-block: 56px 52px; display: grid; gap: 16px; }
.cabeca-pagina p { max-width: 60ch; color: var(--acinzentado); font-size: 1.1rem; }
.trilha { font-family: var(--f-rotulo); font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; color: var(--acinzentado); }
.trilha a { color: var(--acinzentado); text-decoration: none; }
.trilha a:hover { color: var(--azul); }
.corpo { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 64px; padding-block: 64px 96px; align-items: start; }
.texto { display: grid; gap: 40px; min-width: 0; max-width: var(--leitura); }
.texto section { display: grid; gap: 14px; }
.texto h2 { font-size: 1.85rem; }
.texto ul, .texto ol { margin: 0; padding-left: 1.2em; display: grid; gap: 8px; }
.texto li::marker { color: var(--azul); }
.aviso { border-left: 2px solid var(--ciano); background: var(--gelo); padding: 16px 20px; border-radius: 0 var(--raio) var(--raio) 0; font-size: .96rem; }
.lista-dupla { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.lista-dupla h3 { font-size: 1.3rem; margin-bottom: 8px; }
@media (max-width: 600px) { .lista-dupla { grid-template-columns: 1fr; } }
.lateral { position: sticky; top: calc(env(safe-area-inset-top, 0px) + 100px); display: grid; gap: 16px; }
.cartao { border: 1px solid var(--linha); border-radius: var(--raio); padding: 26px 24px; display: grid; gap: 14px; background: var(--branco); }
.cartao-escuro { background: var(--profundo); border-color: var(--profundo); color: #C9D6E2; }
.cartao-escuro h3 { color: var(--branco); font-size: 1.5rem; }
.cartao .botao { justify-content: center; }
.cartao small { font-size: .82rem; color: #9FB3C6; }
.cartao .linha-dado { font-size: .92rem; display: grid; gap: 2px; }
.cartao .linha-dado .rotulo { font-size: .62rem; }
@media (max-width: 960px) { .corpo { grid-template-columns: 1fr; gap: 40px; } .lateral { position: static; } }

/* Rodapé */
.rodape { background: var(--profundo); color: #9FB3C6; font-size: var(--t-peq); }
.rodape .miolo { padding-block: 56px 40px; display: grid; gap: 32px; }
.rodape-topo { display: grid; grid-template-columns: minmax(0, 1.2fr) repeat(2, minmax(0, 1fr)); gap: 40px; }
.rodape-marca img { width: 230px; }
.rodape h4 { font-family: var(--f-rotulo); font-size: .66rem; letter-spacing: .18em; text-transform: uppercase; color: var(--ciano); margin: 0 0 12px; }
.rodape ul { margin: 0; padding: 0; display: grid; gap: 8px; }
.rodape li { list-style: none; }
.rodape a { color: #D7E2EC; text-decoration: none; }
.rodape a:hover { color: var(--branco); text-decoration: underline; }
.rodape-legal { border-top: 1px solid rgba(255,255,255,.12); padding-top: 24px; display: grid; gap: 8px; }
.rodape-legal .registro { color: var(--branco); font-family: var(--f-rotulo); font-size: .74rem; letter-spacing: .1em; text-transform: uppercase; font-weight: 500; }
@media (max-width: 820px) { .rodape-topo { grid-template-columns: 1fr; gap: 28px; } }

/* WhatsApp flutuante */
.whats-flutuante { position: fixed; right: calc(20px + env(safe-area-inset-right, 0px)); bottom: calc(20px + env(safe-area-inset-bottom, 0px)); z-index: 40;
  display: inline-flex; align-items: center; gap: 10px; background: #1F9E5A; color: var(--branco); text-decoration: none; border-radius: 999px; padding: 14px 20px 14px 16px;
  font-family: var(--f-rotulo); font-size: .76rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; box-shadow: 0 8px 24px rgba(23,43,64,.25); }
.whats-flutuante:hover { background: #17834A; color: var(--branco); }
.whats-flutuante svg { width: 22px; height: 22px; }
@media (max-width: 520px) { .whats-flutuante span { display: none; } .whats-flutuante { padding: 15px; } }

/* Blog */
.artigos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.artigo-cartao { border: 1px solid var(--linha); border-radius: var(--raio); padding: 28px 26px; display: grid; grid-template-rows: auto auto 1fr auto; gap: 12px; text-decoration: none; color: var(--tinta); background: var(--branco); transition: border-color .2s, transform .2s; }
.artigo-cartao:hover { border-color: var(--azul); color: var(--tinta); transform: translateY(-2px); }
.artigo-cartao .onde { font-family: var(--f-rotulo); font-size: .68rem; letter-spacing: .14em; text-transform: uppercase; font-weight: 600; color: var(--ciano-texto); }
.artigo-cartao h3 { font-size: 1.4rem; }
.artigo-cartao p { color: var(--acinzentado); font-size: .96rem; }
.artigo-cartao .mais { font-family: var(--f-rotulo); font-size: .74rem; letter-spacing: .1em; text-transform: uppercase; font-weight: 600; color: var(--azul); }
@media (max-width: 900px) { .artigos { grid-template-columns: 1fr; } }
.meta-artigo { font-family: var(--f-rotulo); font-size: .74rem !important; letter-spacing: .08em; text-transform: uppercase; color: var(--acinzentado); }
.artigo > p { max-width: var(--leitura); }
.autor { display: flex; gap: 16px; align-items: center; border-top: 1px solid var(--linha); border-bottom: 1px solid var(--linha); padding-block: 20px; }
.autor img { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; object-position: 50% 18%; flex: none; background: var(--retrato); }
.autor div { display: grid; gap: 2px; min-width: 0; }
.autor strong { font-family: var(--f-titulo); font-size: 1.25rem; color: var(--profundo); }
.autor span { font-size: .88rem; color: var(--acinzentado); }