/* O site da clínica (thronusclinic.com.br): a identidade do app (src/theme, caminho C): Lora nos títulos,
   Open Sans no texto, verde oficial #2D5B55, fundo #F5F7F6, dourado das asas #C08840. As fontes são
   servidas daqui mesmo (site/fontes), sem pedir nada a terceiros. */
@font-face { font-family: 'Lora'; src: url('fontes/Lora_600SemiBold.ttf') format('truetype'); font-weight: 600; font-display: swap; }
@font-face { font-family: 'Open Sans'; src: url('fontes/OpenSans_400Regular.ttf') format('truetype'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Open Sans'; src: url('fontes/OpenSans_600SemiBold.ttf') format('truetype'); font-weight: 600; font-display: swap; }

:root {
  --verde: #2D5B55;
  --verde-escuro: #20403C;
  --tinta: #1F3B37;
  --secundario: #5B6E6B;
  --fundo: #F5F7F6;
  --branco: #FFFFFF;
  --linha: #E1E7E5;
  --tom: #E8EEEC;
  --dourado: #C08840;
  --dourado-texto: #8A5216;
  --creme: #F6EBDA;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--fundo); color: var(--tinta); font-family: 'Open Sans', Arial, sans-serif; font-size: 17px; line-height: 1.6; }
a { color: var(--verde); }
h1, h2, h3 { font-family: 'Lora', Georgia, serif; font-weight: 600; color: var(--verde); margin: 0 0 0.4em; line-height: 1.25; }
h1 { font-size: 2rem; }
h2 { font-size: 1.4rem; }
h3 { font-size: 1.1rem; color: var(--tinta); }
p { margin: 0 0 1em; }

.cabecalho { background: var(--branco); border-bottom: 1px solid var(--linha); }
.cabecalho .faixa { max-width: 960px; margin: 0 auto; padding: 14px 16px; display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.cabecalho img { height: 44px; width: auto; display: block; }
.menu { display: flex; gap: 4px 18px; flex-wrap: wrap; font-weight: 600; font-size: 0.95rem; }
.menu a { text-decoration: none; color: var(--secundario); padding: 6px 0; }
.menu a[aria-current="page"], .menu a:hover { color: var(--verde); }
.menu .menu-botao { background: var(--verde); color: var(--branco); padding: 8px 14px; border-radius: 10px; }
.menu .menu-botao:hover { background: var(--verde-escuro); color: var(--branco); }

.secao { margin-top: 36px; }
.secao > h2 { font-size: 1.6rem; margin-bottom: 12px; }
.cartao h3 { margin-bottom: 6px; }

main { max-width: 960px; margin: 0 auto; padding: 32px 16px 48px; }

.abertura { display: flex; align-items: center; gap: 32px; padding: 24px 0 8px; }
.abertura img { width: 150px; max-width: 32%; height: auto; }
.abertura .texto p { font-size: 1.1rem; color: var(--secundario); max-width: 36em; }
.selo { display: inline-block; background: var(--creme); color: var(--dourado-texto); font-weight: 600; font-size: 0.9rem; padding: 4px 12px; border-radius: 999px; margin-bottom: 12px; }

.cartoes { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; margin: 24px 0; }
.cartao { background: var(--branco); border: 1px solid var(--linha); border-radius: 16px; padding: 20px 22px; }
.cartao h2 { font-size: 1.15rem; margin-bottom: 8px; }
.cartao p { margin-bottom: 0.5em; }
.cartao p:last-child { margin-bottom: 0; }
.cartao .mini { color: var(--secundario); font-size: 0.95rem; }

.botao { display: inline-block; background: var(--verde); color: var(--branco); text-decoration: none; font-weight: 600; padding: 12px 20px; border-radius: 12px; margin-top: 8px; }
.botao:hover { background: var(--verde-escuro); }
.botao.secundario { background: transparent; color: var(--verde); border: 1.5px solid var(--verde); }

.documento { background: var(--branco); border: 1px solid var(--linha); border-radius: 16px; padding: 8px 24px; }
.documento section { padding: 18px 0; border-top: 1px solid var(--linha); }
.documento section:first-of-type { border-top: 0; }
.documento p, .documento li { text-align: justify; hyphens: auto; font-size: 1rem; }
.documento ol, .documento ul { padding-left: 1.3em; }
.documento li { margin-bottom: 0.5em; }
.versao { color: var(--secundario); margin-top: -8px; margin-bottom: 20px; }

.rodape { border-top: 1px solid var(--linha); background: var(--branco); }
.rodape .faixa { max-width: 960px; margin: 0 auto; padding: 24px 16px 32px; color: var(--secundario); font-size: 0.9rem; display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.rodape p { margin: 0 0 4px; }
.rodape strong { color: var(--verde); }
.rodape nav { display: flex; gap: 6px 16px; flex-wrap: wrap; align-items: center; }
.rodape .rodape-titulo { color: var(--secundario); }
.rodape nav a { color: var(--secundario); font-size: 0.85rem; }

@media (max-width: 640px) {
  body { font-size: 16px; }
  h1 { font-size: 1.6rem; }
  .abertura { flex-direction: column; align-items: flex-start; gap: 16px; }
  .abertura img { width: 110px; }
  .documento { padding: 4px 18px; }
}