/* ==========================================================================
   Clínica Gestar — sistema de design e estilos
   --------------------------------------------------------------------------
   Direção: editorial e premium. Títulos e texto em Raleway com destaques
   em Brother Signature (tipografia da marca), seções escuras em ameixa
   alternadas com fundos claros e quentes, fotos grandes e acentos em lilás.

   1. Tokens   2. Base   3. Componentes   4. Layout (topo, header, rodapé)
   5. Seções da home   6. Páginas internas   7. Movimento   8. Responsivo
   ========================================================================== */

@font-face { font-family: "Brother Signature"; src: url("../fonts/brother-signature.woff2") format("woff2"); font-display: swap; }
@font-face { font-family: "Raleway"; src: url("../fonts/raleway-var.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: "Raleway"; src: url("../fonts/raleway-italic-var.woff2") format("woff2"); font-weight: 100 900; font-style: italic; font-display: swap; }

/* ---------- 1. Tokens ---------- */
:root {
  /* Escuros (ameixa) */
  --ameixa-950: #1b1026;
  /* Tom claro da marca, enviado pela agência. Só com texto escuro: 6,5:1 com ameixa e 2,8:1 com branco. */
  --lilas-marca: #b08fb7;
  --ameixa-900: #24163a;
  --ameixa-800: #33204f;
  /* Marca */
  --lilas-600: #7238b0;   /* botões e destaques sobre claro — 6,6:1 com branco */
  --lilas-500: #8b4fc6;   /* cor da marca */
  --lilas-300: #c9a6f2;   /* destaques sobre escuro — 8:1 sobre ameixa */
  --lilas-100: #efe6fa;
  --rosa-500:  #ff5fa8;   /* coração do símbolo — decorativo */
  /* Claros */
  --creme:  #f7f2ec;
  --nevoa:  #f4f0f8;
  --branco: #ffffff;
  /* Texto */
  --tinta:   #1f1828;     /* títulos — 16:1 */
  --texto:   #4a4352;     /* corpo — 9:1 */
  --texto-2: #6a6372;     /* apoio — 5,6:1 */
  --claro:   rgba(255, 255, 255, .92);
  --claro-2: rgba(255, 255, 255, .72);
  --linha:   rgba(31, 24, 40, .1);
  --linha-clara: rgba(255, 255, 255, .14);
  --whatsapp: #157a3c;

  /* Tipografia */
  /* Tipografia da marca: Raleway nos títulos e Brother Signature nos destaques (como nos posts). */
  --serif: "Raleway", system-ui, sans-serif;
  --script: "Brother Signature", cursive;
  --sans: "Raleway", system-ui, -apple-system, "Segoe UI", sans-serif;
  --fs-hero: clamp(2.6rem, 1.6rem + 3.4vw, 4.6rem);
  --fs-h1:   clamp(2.4rem, 1.6rem + 2.8vw, 4rem);
  --fs-h2:   clamp(2rem, 1.45rem + 2vw, 3.1rem);
  --fs-h3:   clamp(1.15rem, 1.06rem + .35vw, 1.35rem);
  --fs-lead: clamp(1.06rem, 1rem + .25vw, 1.2rem);
  --fs-base: 1.0625rem;
  --fs-sm:   .9375rem;
  --fs-xs:   .8125rem;
  --fs-tag:  .6875rem;

  /* Espaçamento (base 4/8) */
  --e-1: 4px; --e-2: 8px; --e-3: 12px; --e-4: 16px; --e-5: 24px;
  --e-6: 32px; --e-7: 48px; --e-8: 64px; --e-9: 96px; --e-10: 128px;
  --secao: clamp(80px, 8vw + 32px, 144px);
  --gutter: clamp(20px, 4vw, 40px);
  --container: 1180px;

  /* Raios e sombras */
  --r-sm: 8px;
  --r-md: 14px;
  --r-lg: 22px;
  --r-pill: 999px;
  --s-1: 0 1px 2px rgba(27, 16, 38, .05), 0 12px 32px -18px rgba(27, 16, 38, .28);
  --s-2: 0 2px 6px rgba(27, 16, 38, .06), 0 36px 70px -34px rgba(27, 16, 38, .55);

  --ease: cubic-bezier(.22, 1, .36, 1);
  --topo-h: 40px;
  --header-h: 92px;
}

/* ---------- 2. Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; scroll-padding-top: 100px; }
html, main { overflow-x: clip; }
/* O Safari do iPhone pinta as barras do navegador com o fundo do body:
   fundo escuro no body (topo e rodapé já são escuros) e branco no conteúdo. */
html { background: var(--ameixa-950); }
main { background: var(--branco); }
body { margin: 0; font-family: var(--sans); font-size: var(--fs-base); line-height: 1.7; color: var(--texto); background: var(--ameixa-950); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
img, svg, video, iframe { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; color: inherit; }
button { cursor: pointer; border: 0; background: none; padding: 0; }
::selection { background: var(--lilas-500); color: #fff; }
:focus-visible { outline: 2px solid var(--rosa-500); outline-offset: 3px; border-radius: 4px; }

h1, h2, h3, h4 { margin: 0; font-family: var(--serif); font-weight: 500; color: var(--tinta); line-height: 1.08; letter-spacing: -.02em; text-wrap: balance; font-variation-settings: "SOFT" 50, "WONK" 0; }
h1 { font-size: var(--fs-h1); }
h2 { font-size: var(--fs-h2); }
h3 { font-size: var(--fs-h3); font-family: var(--sans); font-weight: 650; line-height: 1.3; letter-spacing: -.005em; }
h1 em, h2 em, .destaque { font-family: var(--script); font-style: normal; font-weight: 400; font-size: 1.45em; line-height: .8; letter-spacing: 0; padding-inline: .05em; color: var(--lilas-600); }
p { margin: 0 0 1em; text-wrap: pretty; }
p:last-child { margin-bottom: 0; }
strong { font-weight: 650; color: var(--tinta); }
.lead { font-size: var(--fs-lead); line-height: 1.65; color: var(--texto-2); }
.sr-only { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip-link { position: absolute; left: 16px; top: -80px; z-index: 300; padding: 12px 20px; border-radius: var(--r-sm); background: var(--lilas-600); color: #fff; font-weight: 650; transition: top .2s; }
.skip-link:focus { top: 16px; }
.icone { width: 1.2em; height: 1.2em; flex-shrink: 0; }

/* Contexto escuro: inverte as cores de texto */
.escuro { background: var(--ameixa-950); color: var(--claro-2); }
.escuro :is(h1, h2, h3, strong) { color: #fff; }
.escuro :is(h1 em, h2 em, .destaque) { color: var(--lilas-300); }
.escuro .lead { color: var(--claro-2); }

/* ---------- 3. Componentes ---------- */
.tag { display: inline-flex; align-items: center; gap: var(--e-2); margin-bottom: var(--e-5); padding: 7px 14px; border: 1px solid var(--linha); border-radius: var(--r-pill); background: rgba(255, 255, 255, .6); font-size: var(--fs-tag); font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--tinta); }
.tag::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--rosa-500); }
.tag { max-width: 100%; white-space: nowrap; }
.escuro .tag { border-color: var(--linha-clara); background: rgba(255, 255, 255, .05); color: #fff; }

.btn {
  --bg: var(--lilas-600); --fg: #fff; --ic-bg: rgba(255, 255, 255, .16); --ic-fg: #fff; --borda: transparent;
  display: inline-flex; align-items: center; justify-content: space-between; gap: var(--e-4);
  min-height: 56px; padding: 7px 7px 7px var(--e-5); border-radius: var(--r-sm);
  background: var(--bg); color: var(--fg); box-shadow: inset 0 0 0 1px var(--borda);
  font-size: var(--fs-xs); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; line-height: 1.2; white-space: nowrap;
  transition: background-color .3s, color .3s, transform .4s var(--ease), box-shadow .4s var(--ease);
}
.btn__ic { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 6px; background: var(--ic-bg); color: var(--ic-fg); transition: transform .4s var(--ease), background-color .3s; }
.btn__ic .icone { width: 18px; height: 18px; }
.btn:hover { transform: translateY(-2px); box-shadow: inset 0 0 0 1px var(--borda), 0 18px 32px -18px rgba(27, 16, 38, .6); }
.btn:hover .btn__ic { transform: translateX(2px); }
.btn--claro { --bg: #fff; --fg: var(--tinta); --ic-bg: var(--lilas-600); --ic-fg: #fff; }
.btn--claro:hover { --bg: var(--lilas-100); }
.btn--escuro { --bg: var(--ameixa-900); --fg: #fff; --ic-bg: var(--lilas-500); }
.btn--escuro:hover { --bg: var(--ameixa-800); }
.btn--linha { --bg: transparent; --fg: var(--tinta); --borda: rgba(31, 24, 40, .22); --ic-bg: var(--tinta); --ic-fg: #fff; }
.btn--linha:hover { --bg: var(--tinta); --fg: #fff; --ic-bg: var(--lilas-500); }
.escuro .btn--linha, .btn--linha-clara { --bg: transparent; --fg: #fff; --borda: rgba(255, 255, 255, .35); --ic-bg: #fff; --ic-fg: var(--ameixa-900); }
.escuro .btn--linha:hover, .btn--linha-clara:hover { --bg: #fff; --fg: var(--tinta); --ic-bg: var(--lilas-600); --ic-fg: #fff; }
.btn--whats { --bg: var(--whatsapp); --ic-bg: rgba(255, 255, 255, .18); }
.btn--whats:hover { --bg: #0f6430; }
.btn--sm { min-height: 46px; padding: 5px 5px 5px var(--e-4); }
.btn--sm .btn__ic { width: 36px; height: 36px; }
.btn--simples { padding: 0 var(--e-5); justify-content: center; }
.btn-grupo { display: flex; flex-wrap: wrap; align-items: center; gap: var(--e-3); margin-top: var(--e-6); }

.link-seta { display: inline-flex; align-items: center; gap: var(--e-2); min-height: 44px; font-size: var(--fs-xs); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--lilas-600); }
.link-seta .icone { width: 16px; height: 16px; transition: transform .4s var(--ease); }
.link-seta:hover .icone, a:hover > .link-seta .icone { transform: translateX(4px); }
.escuro .link-seta { color: var(--lilas-300); }

.moldura { overflow: hidden; border-radius: var(--r-md); }
.moldura img { width: 100%; height: 100%; object-fit: cover; }

.selo-icone { display: grid; place-items: center; width: 44px; height: 44px; border-radius: var(--r-sm); background: var(--lilas-100); color: var(--lilas-600); flex-shrink: 0; }
.selo-icone .icone { width: 20px; height: 20px; }
.escuro .selo-icone { background: rgba(255, 255, 255, .08); color: var(--lilas-300); }

.numeral { position: absolute; right: -6px; top: -26px; font-family: var(--serif); font-style: italic; font-weight: 300; font-size: 8.5rem; line-height: 1; letter-spacing: -.04em; color: rgba(114, 56, 176, .08); pointer-events: none; user-select: none; }

/* ---------- 4. Layout ---------- */
.container { width: 100%; max-width: var(--container); margin-inline: auto; padding-inline: var(--gutter); }
.container--texto { max-width: 800px; }
.secao { position: relative; padding-block: var(--secao); }
.secao--creme { background: var(--creme); }
.secao--nevoa { background: var(--nevoa); }
.secao--escura { background: var(--ameixa-950); }
.secao--escura.com-brilho { background: radial-gradient(120% 90% at 85% 0%, #3b2459 0%, var(--ameixa-950) 55%); }
/* Seções no tom claro da marca. Classe dobrada para vencer as regras de .hero que vêm depois. */
.lilas.lilas { background: var(--lilas-marca); color: var(--ameixa-950); }
.lilas.lilas :is(h1, h2, h3, strong, p, .lead, .hero__sub, .hero__local, .citacao) { color: var(--ameixa-950); }
.lilas.lilas :is(h1 em, h2 em, .destaque) { color: var(--ameixa-800); }
.lilas.lilas .tag { border-color: rgba(27, 16, 38, .4); background: rgba(255, 255, 255, .25); color: var(--ameixa-950); }
.lilas.lilas .citacao { border-left-color: var(--ameixa-950); }
.lilas.lilas .hero__local .icone { color: var(--ameixa-950); }
.lilas.lilas .btn--linha-clara { --fg: var(--ameixa-950); --borda: rgba(27, 16, 38, .55); --ic-bg: var(--ameixa-900); --ic-fg: #fff; }
.lilas.lilas .btn--linha-clara:hover { --bg: var(--ameixa-950); --fg: #fff; --ic-bg: #fff; --ic-fg: var(--ameixa-900); }
.secao--colada { padding-top: 0; }

.cabecalho { max-width: 700px; margin-bottom: clamp(40px, 5vw, 64px); }
.cabecalho .lead { margin-top: var(--e-5); }
.cabecalho--centro { margin-inline: auto; text-align: center; }
.cabecalho--linha { max-width: none; display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--e-5) var(--e-8); }
.cabecalho--linha > div { max-width: 600px; }
.grid-2 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(40px, 6vw, 96px); align-items: center; }
.divisor { height: 1px; margin: 0; border: 0; background: var(--linha); }

/* Barra superior */
.topo { position: relative; z-index: 101; height: var(--topo-h); background: var(--ameixa-950); border-bottom: 1px solid var(--linha-clara); color: var(--claro-2); font-size: var(--fs-xs); }
.topo .container { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: var(--e-5); }
.topo a, .topo span { display: inline-flex; align-items: center; gap: var(--e-2); min-height: 32px; }
.topo a:hover { color: #fff; }
.topo .icone { width: 15px; height: 15px; color: var(--lilas-300); }
.topo__dir { display: flex; gap: var(--e-5); }

/* Header */
.header { position: absolute; left: 0; right: 0; top: var(--topo-h); z-index: 100; height: var(--header-h); color: #fff; transition: background-color .35s, box-shadow .35s, transform .45s var(--ease), color .35s; }
.header.is-fixo { position: fixed; top: 0; background: rgba(255, 255, 255, .94); backdrop-filter: saturate(1.5) blur(14px); -webkit-backdrop-filter: saturate(1.5) blur(14px); box-shadow: 0 1px 0 var(--linha); color: var(--tinta); animation: desce .45s var(--ease); }
.header.is-hidden { transform: translateY(-100%); }
.header__inner { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: var(--e-5); border-bottom: 1px solid var(--linha-clara); }
.header.is-fixo .header__inner { border-bottom-color: transparent; }
.logo { position: relative; z-index: 2; display: inline-flex; flex-direction: column; gap: 4px; padding-block: 14px; }
.logo img { width: 104px; height: auto; }
.logo small { font-size: 8.5px; font-weight: 650; letter-spacing: .06em; white-space: nowrap; opacity: .9; }
.logo .logo--cor, .header.is-fixo .logo .logo--branca, .menu-aberto .logo .logo--branca { display: none; }
.header.is-fixo .logo .logo--cor, .menu-aberto .logo .logo--cor { display: block; }
.header.is-fixo .logo small, .menu-aberto .logo small { color: var(--lilas-600); }

.nav { display: flex; align-items: center; gap: var(--e-1); }
.nav__link { position: relative; display: inline-flex; align-items: center; min-height: 44px; padding: 0 var(--e-3); font-size: var(--fs-sm); font-weight: 550; opacity: .88; transition: opacity .25s, color .25s; }
.nav__link::after { content: ""; position: absolute; left: var(--e-3); right: var(--e-3); bottom: 8px; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform .4s var(--ease); }
.nav__link:hover, .nav__link[aria-current="page"] { opacity: 1; }
.nav__link:hover::after, .nav__link[aria-current="page"]::after { transform: scaleX(1); }
.header.is-fixo .nav__link[aria-current="page"] { color: var(--lilas-600); }
.nav .btn { margin-left: var(--e-4); }
.nav__extra { display: none; }

.menu-toggle { display: none; position: relative; z-index: 2; width: 48px; height: 48px; border-radius: var(--r-sm); border: 1px solid currentColor; color: inherit; }
.menu-toggle span { position: absolute; left: 14px; right: 14px; height: 1.5px; border-radius: 2px; background: currentColor; transition: transform .4s var(--ease), opacity .25s; }
.menu-toggle span:nth-child(1) { top: 17px; }
.menu-toggle span:nth-child(2) { top: 23px; }
.menu-toggle span:nth-child(3) { top: 29px; }
.menu-aberto .menu-toggle span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.menu-aberto .menu-toggle span:nth-child(2) { opacity: 0; }
.menu-aberto .menu-toggle span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* Rodapé */
.footer { position: relative; overflow: clip; background: var(--ameixa-950); color: var(--claro-2); padding: var(--e-9) 0 var(--e-6); font-size: var(--fs-sm); }
.footer__topo { display: grid; grid-template-columns: 1.1fr 1fr; gap: var(--e-8); align-items: start; padding-bottom: var(--e-8); border-bottom: 1px solid var(--linha-clara); }
.footer__logo img { width: 156px; }
.footer__logo small { display: block; margin-top: 4px; font-size: 10.5px; letter-spacing: .06em; color: var(--claro-2); }
.footer__frase { margin-top: var(--e-5); max-width: 380px; font-family: var(--serif); font-size: 1.5rem; line-height: 1.3; color: #fff; }
.footer__frase em { font-family: var(--script); font-style: normal; font-size: 1.45em; line-height: .8; color: var(--lilas-300); }
.footer__mapa { position: relative; overflow: hidden; aspect-ratio: 16 / 9; border-radius: var(--r-md); background: var(--ameixa-900); border: 1px solid var(--linha-clara); }
.footer__mapa__alt { position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; gap: var(--e-2); text-align: center; color: var(--claro-2); font-size: var(--fs-sm); }
.footer__mapa__alt .icone { width: 28px; height: 28px; color: var(--lilas-300); }
.footer__mapa iframe { position: relative; width: 100%; height: 100%; border: 0; filter: grayscale(.4) contrast(.95); }
.footer__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--e-7); padding-top: var(--e-7); }
.footer h2 { margin-bottom: var(--e-3); font-family: var(--sans); font-size: var(--fs-tag); font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: #fff; }
.footer ul { list-style: none; margin: 0; padding: 0; }
.footer li a, .footer li > span { display: inline-flex; align-items: center; gap: var(--e-3); min-height: 40px; transition: color .25s; }
.footer a:hover { color: #fff; }
.footer .icone { width: 17px; height: 17px; color: var(--lilas-300); }
.footer__rt { font-size: var(--fs-xs); line-height: 1.6; }
.footer__base { margin-top: var(--e-7); padding-top: var(--e-5); border-top: 1px solid var(--linha-clara); display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--e-3); font-size: var(--fs-xs); color: rgba(255, 255, 255, .6); }

/* WhatsApp flutuante (desktop) e barra de agendamento (celular) */
.whats-float { position: fixed; right: 24px; bottom: 24px; z-index: 90; display: grid; place-items: center; width: 58px; height: 58px; border-radius: 50%; background: var(--whatsapp); color: #fff; box-shadow: 0 14px 30px -12px rgba(21, 122, 60, .8); transition: transform .4s var(--ease); }
.whats-float:hover { transform: scale(1.06); }
.whats-float .icone { width: 27px; height: 27px; }
.barra-cta { display: none; }

/* ---------- 5. Seções da home ---------- */

/* Hero */
.hero { position: relative; overflow: hidden; min-height: min(100svh, 920px); display: flex; align-items: center; background: var(--lilas-marca); color: var(--claro-2); padding: calc(var(--topo-h) + var(--header-h) + 48px) 0 96px; }
.hero__foto { position: absolute; inset: 0 0 0 auto; width: 62%; }
.hero__foto { display: block; overflow: hidden; } /* a animação de entrada não deixa a foto passar da área do degradê */
.hero__foto img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; }
.hero__foto::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, var(--lilas-marca) 0%, rgba(176, 143, 183, .82) 12%, rgba(176, 143, 183, .28) 30%, rgba(176, 143, 183, 0) 48%), linear-gradient(0deg, rgba(176, 143, 183, .6) 0%, transparent 30%); }
.hero .container { position: relative; z-index: 1; }
.hero__texto { max-width: 590px; }
.hero h1 { font-size: var(--fs-hero); color: #fff; }
.hero h1 em { color: var(--lilas-300); }
.hero__sub { margin-top: var(--e-6); max-width: 30rem; font-size: var(--fs-lead); }
.hero__sub strong { display: block; margin-bottom: var(--e-2); color: #fff; }
.hero .btn-grupo { margin-top: var(--e-7); }
.hero__local { display: none; }
.hero__provas { display: flex; flex-wrap: wrap; gap: var(--e-3); margin: var(--e-7) 0 0; padding: 0; list-style: none; }
.hero__provas li { display: inline-flex; align-items: center; gap: var(--e-2); padding: 8px 14px 8px 10px; border-radius: var(--r-pill); background: rgba(255, 255, 255, .06); border: 1px solid var(--linha-clara); backdrop-filter: blur(6px); font-size: var(--fs-xs); font-weight: 600; color: #fff; }
.hero__provas .icone { width: 16px; height: 16px; color: var(--lilas-300); }
.hero__assinatura { position: absolute; right: var(--gutter); bottom: 32px; z-index: 1; display: flex; align-items: center; gap: var(--e-3); color: #fff; font-size: var(--fs-xs); }
.hero__assinatura b { display: block; font-family: var(--serif); font-size: 1.25rem; font-weight: 400; }

/* Hero em telas largas: foto horizontal (Group 1) de ponta a ponta, com o texto
   sobre a parede vazia à esquerda. A altura acompanha a proporção da foto (≈2:1)
   para as fundadoras não ficarem atrás do texto. */
@media (min-width: 1200px) {
  .hero { min-height: max(640px, calc(100vw / 2.0126)); padding: calc(var(--topo-h) + var(--header-h) + 32px) 0 56px; }
  /* A foto ocupa a largura toda sem corte; se o conteúdo for mais alto que ela,
     a base funde com o fundo ameixa em vez de a foto ser cortada pela esquerda. */
  .hero__foto { inset: 0 0 auto 0; width: 100%; height: auto; }
  .hero__foto img { height: auto; aspect-ratio: 2880 / 1431; object-fit: cover; }
  .hero__foto::after { background:
    linear-gradient(180deg, rgba(27, 16, 38, .78) 0%, rgba(27, 16, 38, .6) 11%, rgba(27, 16, 38, 0) 20%),
    linear-gradient(90deg, rgb(176, 143, 183) 0%, rgba(176, 143, 183, .92) 26%, rgba(176, 143, 183, .4) 40%, rgba(176, 143, 183, 0) 52%),
    linear-gradient(0deg, var(--lilas-marca) 0%, rgba(176, 143, 183, .55) 10%, rgba(176, 143, 183, 0) 30%); }
  .hero__texto { max-width: min(520px, 34vw); }
  .hero h1 { font-size: clamp(2.6rem, 3.15vw, 3.9rem); }
  .hero__sub { max-width: 30rem; font-size: 1rem; line-height: 1.85; }
  .hero__sub strong { margin-bottom: var(--e-5); font-size: 1rem; }
  .hero .btn-grupo { flex-wrap: nowrap; width: max-content; }
  .hero .btn { padding-left: 20px; }
}

/* Faixa com o símbolo da marca */
.faixa { overflow: hidden; background: var(--ameixa-900); border-block: 1px solid var(--linha-clara); padding-block: var(--e-4); }
.faixa__trilho { display: flex; width: max-content; animation: faixa 50s linear infinite; }
.faixa span { display: inline-flex; align-items: center; gap: var(--e-4); padding-right: var(--e-8); font-family: var(--serif); font-size: 1.15rem; font-style: italic; color: var(--claro-2); white-space: nowrap; }
.faixa .simbolo-solido { width: 18px; height: 22px; }

/* Momentos — cards com foto e legenda sobreposta */
.momentos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e-4); }
.momento { position: relative; display: flex; flex-direction: column; justify-content: flex-end; min-height: 400px; overflow: hidden; border-radius: var(--r-md); color: #fff; isolation: isolate; }
.momento img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.momento::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(27, 16, 38, .45) 0%, rgba(27, 16, 38, 0) 18%, rgba(27, 16, 38, .15) 35%, rgba(27, 16, 38, .62) 58%, rgba(27, 16, 38, .94) 100%); transition: background-color .4s; }
.momento:hover img { transform: scale(1.06); }
.momento__num { position: absolute; top: var(--e-5); left: var(--e-6); font-family: var(--serif); font-style: italic; font-size: 1.3rem; color: #fff; }
.momento__corpo { max-width: 470px; padding: var(--e-6); }
.momento h3 { font-family: var(--serif); font-size: clamp(1.5rem, 1.3rem + .7vw, 2rem); font-weight: 400; line-height: 1.15; color: #fff; }
.momento p { margin: var(--e-3) 0 var(--e-4); font-size: var(--fs-sm); line-height: 1.55; color: rgba(255, 255, 255, .82); }
.momento .link-seta { color: #fff; padding: 0 var(--e-3); min-height: 40px; border: 1px solid rgba(255, 255, 255, .35); border-radius: var(--r-pill); transition: background-color .3s, color .3s; }
.momento:hover .link-seta { background: #fff; color: var(--tinta); }

/* Diferencial (escuro, cartão de foto + texto) */
.cartao-foto { position: relative; margin: 0; overflow: hidden; border-radius: var(--r-lg); aspect-ratio: 4 / 4.6; box-shadow: var(--s-2); }
.cartao-foto img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; }
/* Diferencial: foto maior, ocupando a coluna mais larga e a altura do texto. */
#diferencial .grid-2 { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); align-items: center; }
#diferencial .cartao-foto { aspect-ratio: auto; background: var(--ameixa-950); }
#diferencial .cartao-foto img { display: block; height: auto; aspect-ratio: 4 / 3; }
.cartao-foto figcaption { position: absolute; left: var(--e-4); right: var(--e-4); bottom: var(--e-4); padding: var(--e-4) var(--e-5); border-radius: var(--r-md); background: rgba(27, 16, 38, .55); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border: 1px solid var(--linha-clara); color: var(--claro-2); font-size: var(--fs-xs); }
.cartao-foto figcaption b { display: block; font-family: var(--serif); font-size: 1.2rem; font-weight: 400; color: #fff; }
#diferencial .cartao-foto figcaption { position: static; border: 0; border-radius: 0; background: var(--ameixa-950); backdrop-filter: none; -webkit-backdrop-filter: none; }
.citacao { margin: var(--e-6) 0; padding-left: var(--e-5); border-left: 2px solid var(--lilas-300); font-family: var(--serif); font-size: clamp(1.2rem, 1.1rem + .4vw, 1.45rem); font-style: italic; line-height: 1.45; color: #fff; }
.pontos { list-style: none; margin: var(--e-6) 0 0; padding: 0; display: grid; gap: var(--e-4); }
.pontos li { display: flex; gap: var(--e-3); align-items: flex-start; }
.pontos .icone { width: 18px; height: 18px; margin-top: 4px; color: var(--lilas-300); }

/* Exames em destaque — cards com numeral */
.exames-lista { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--e-4); }
.exame-item { position: relative; overflow: hidden; display: flex; flex-direction: column; gap: var(--e-3); min-height: 280px; padding: var(--e-6); border-radius: var(--r-md); background: #fff; border: 1px solid var(--linha); transition: border-color .3s, box-shadow .45s var(--ease), transform .45s var(--ease); }
.exame-item:hover { border-color: transparent; box-shadow: var(--s-2); transform: translateY(-4px); }
.exame-item h3 { position: relative; margin-top: var(--e-8); max-width: 85%; }
.exame-item p { position: relative; flex: 1; font-size: var(--fs-sm); color: var(--texto-2); }
.exame-item .link-seta { position: relative; }

/* História */
#historia .grid-2 { align-items: start; }
#historia h2 { font-size: clamp(2rem, 1.3rem + 1.6vw, 2.75rem); text-wrap: wrap; }
.historia__media { position: relative; padding-top: var(--e-2); }
.historia__media .moldura { aspect-ratio: 6 / 7; border-radius: var(--r-lg); }
.historia__ano { display: flex; align-items: flex-start; gap: var(--e-4); margin: var(--e-6) 0; }
.historia__ano b { font-family: var(--serif); font-style: italic; font-weight: 300; font-size: clamp(4rem, 3rem + 4vw, 6.5rem); line-height: .9; color: var(--lilas-600); }
.historia__ano span { max-width: 15rem; padding-top: .6em; font-size: var(--fs-sm); line-height: 1.5; color: var(--texto-2); }
.marcos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--e-5); margin-top: var(--e-6); padding-top: var(--e-5); border-top: 1px solid var(--linha); }
.marcos b { display: block; font-family: var(--serif); font-size: 1.6rem; font-weight: 400; color: var(--tinta); }
.marcos span { font-size: var(--fs-xs); line-height: 1.5; color: var(--texto-2); }

/* Fundadoras (escuro) */
.fundadoras { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--e-5); }
/* Foto inteira no card e texto por cima, na parte de baixo, com degradê só abaixo do rosto.
   No celular o texto vai para baixo da foto (ver media query de 640px). */
.fundadora { position: relative; display: grid; overflow: hidden; border-radius: var(--r-lg); background: var(--ameixa-950); border: 1px solid var(--linha-clara); color: var(--claro-2); }
.fundadora__foto { display: contents; }
.fundadora__foto img, .fundadora__corpo { grid-area: 1 / 1; }
.fundadora__foto img { width: 100%; aspect-ratio: 1614 / 1860; height: auto; object-fit: cover; object-position: 50% 0; transition: transform 1.4s var(--ease); }
.fundadora:hover .fundadora__foto img { transform: scale(1.03); }
.fundadora__corpo { position: relative; align-self: end; display: flex; flex-direction: column; padding: 30% var(--e-6) var(--e-6); background: linear-gradient(180deg, rgba(27, 16, 38, 0) 0%, rgba(27, 16, 38, .72) 32%, rgba(27, 16, 38, .94) 70%, var(--ameixa-950) 100%); }
.fundadora__corpo .link-seta { margin-top: var(--e-2); }
.fundadora h3 { font-family: var(--serif); font-size: clamp(1.6rem, 1.35rem + .9vw, 2.15rem); font-weight: 400; color: #fff; line-height: 1.1; }
.fundadora p { font-size: var(--fs-sm); line-height: 1.6; }
.registro { margin: var(--e-2) 0 var(--e-4); font-size: var(--fs-tag); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--lilas-300); }
.secao:not(.escuro) .registro, .claro .registro { color: var(--lilas-600); }
.secao .fundadora .registro, .secao .fundadora .link-seta { color: var(--lilas-300); }

/* Corpo clínico (home) */
.equipe-linha { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--e-4); }
.membro { margin: 0; }
.membro .moldura { aspect-ratio: 3 / 3.8; background: var(--lilas-100); }
.membro .moldura img { object-position: 50% 15%; }
.membro figcaption { margin-top: var(--e-3); font-size: var(--fs-sm); font-weight: 650; color: var(--tinta); line-height: 1.35; }
.membro figcaption span { display: block; font-size: var(--fs-xs); font-weight: 500; color: var(--texto-2); }
.membro--mais { display: flex; flex-direction: column; justify-content: space-between; aspect-ratio: 3 / 3.8; overflow: hidden; padding: var(--e-5); border-radius: var(--r-md); background: var(--ameixa-950); color: var(--claro-2); transition: background-color .3s; }
.membro--mais:hover { background: var(--ameixa-800); }
.membro--mais b { font-family: var(--serif); font-size: 4.5rem; font-weight: 300; font-style: italic; line-height: 1; color: var(--lilas-300); }
.membro--mais span { font-family: var(--serif); font-size: 1.35rem; line-height: 1.25; color: #fff; }
.areas { display: flex; flex-wrap: wrap; gap: var(--e-2); margin-top: var(--e-6); }
.areas span { display: inline-flex; align-items: center; gap: var(--e-2); padding: 8px 14px; border-radius: var(--r-pill); border: 1px solid var(--linha); background: #fff; font-size: var(--fs-xs); font-weight: 600; color: var(--tinta); }
.areas .icone { width: 14px; height: 14px; color: var(--lilas-600); }

/* Perguntas (conteúdos e FAQ) */
.perguntas { border-top: 1px solid var(--linha); }
.pergunta { display: flex; align-items: center; justify-content: space-between; gap: var(--e-5); min-height: 72px; padding: var(--e-4) 0; border-bottom: 1px solid var(--linha); font-family: var(--serif); font-size: clamp(1.1rem, 1rem + .4vw, 1.35rem); line-height: 1.3; color: var(--tinta); transition: color .3s, padding-left .4s var(--ease); }
.pergunta:hover { color: var(--lilas-600); padding-left: var(--e-2); }
.pergunta i { display: grid; place-items: center; flex-shrink: 0; width: 40px; height: 40px; border-radius: var(--r-sm); border: 1px solid var(--linha); color: var(--tinta); transition: background-color .3s, color .3s, border-color .3s; }
.pergunta:hover i { background: var(--lilas-600); border-color: var(--lilas-600); color: #fff; }
.pergunta .icone { width: 17px; height: 17px; }

.faq { border-top: 1px solid var(--linha); }
.faq details { border-bottom: 1px solid var(--linha); }
.faq summary { display: flex; align-items: center; justify-content: space-between; gap: var(--e-5); min-height: 68px; padding: var(--e-4) 0; cursor: pointer; list-style: none; font-weight: 650; color: var(--tinta); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary .icone { width: 20px; height: 20px; color: var(--lilas-600); transition: transform .4s var(--ease); }
.faq details[open] summary .icone { transform: rotate(45deg); }
.faq details p { margin: 0; padding: 0 var(--e-8) var(--e-5) 0; color: var(--texto-2); }
.faq summary:hover { color: var(--lilas-600); }

/* Resultados */
.resultados { position: relative; overflow: hidden; display: grid; grid-template-columns: 1.2fr 1fr; gap: var(--e-7); align-items: center; padding: clamp(40px, 6vw, 80px); border-radius: var(--r-lg); background: radial-gradient(110% 120% at 100% 0%, #3d2560 0%, var(--ameixa-950) 60%); }
.resultados__card { justify-self: center; width: min(320px, 100%); padding: var(--e-5); border-radius: var(--r-md); background: rgba(255, 255, 255, .06); border: 1px solid var(--linha-clara); transform: rotate(-3deg); box-shadow: 0 40px 70px -40px rgba(0, 0, 0, .8); }
.resultados__card .topo-card { display: flex; align-items: center; gap: var(--e-3); margin-bottom: var(--e-4); font-size: var(--fs-sm); font-weight: 650; color: #fff; }
.resultados__card .barra { height: 8px; margin: var(--e-3) 0; border-radius: 6px; background: rgba(255, 255, 255, .16); }
.resultados__card .barra:nth-of-type(2) { width: 72%; }
.resultados__card .barra:nth-of-type(3) { width: 86%; }
.resultados__card .ok { display: inline-flex; align-items: center; gap: var(--e-2); margin-top: var(--e-4); padding: 7px 12px; border-radius: var(--r-pill); background: var(--lilas-300); color: var(--ameixa-950); font-size: var(--fs-xs); font-weight: 700; }
.resultados__card .ok .icone { width: 14px; height: 14px; }
.resultados__simbolo { position: absolute; right: -60px; bottom: -80px; width: 320px; opacity: .22; pointer-events: none; }

/* Instagram */
.insta-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--e-3); }
.insta-grid a { position: relative; display: block; overflow: hidden; aspect-ratio: 4 / 5; border-radius: var(--r-md); }
.insta-grid img { width: 100%; height: 100%; object-fit: cover; transition: transform .9s var(--ease); }
.insta-grid a::after { content: ""; position: absolute; inset: 0; background: rgba(27, 16, 38, .55); opacity: 0; transition: opacity .4s; }
.insta-grid a:hover img { transform: scale(1.05); }
.insta-grid a:is(:hover, :focus-visible)::after { opacity: 1; }
.insta-grid .icone { position: absolute; z-index: 2; left: 50%; top: 50%; width: 30px; height: 30px; color: #fff; opacity: 0; translate: -50% -50%; transition: opacity .3s; }
.insta-grid a:is(:hover, :focus-visible) .icone { opacity: 1; }

/* CTA final com foto */
.cta-foto { position: relative; overflow: hidden; isolation: isolate; padding-block: clamp(96px, 12vw, 176px); text-align: center; color: var(--claro-2); }
.cta-foto__fundo { position: absolute; inset: 0; z-index: -2; }
.cta-foto__fundo img { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 640px) { .cta-foto__fundo img { object-position: 50% 30%; } }
.cta-foto::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(27, 16, 38, .66), rgba(27, 16, 38, .86)); }
.cta-foto h2 { max-width: 820px; margin-inline: auto; color: #fff; }
.cta-foto h2 em { color: var(--lilas-300); }
.cta-foto p { max-width: 600px; margin: var(--e-5) auto 0; }
.cta-foto .btn-grupo { justify-content: center; }
.cta-foto .tag { border-color: var(--linha-clara); background: rgba(255, 255, 255, .06); color: #fff; }
.cta-foto__local { display: inline-flex; align-items: center; gap: var(--e-2); margin-top: var(--e-5); font-weight: 600; color: #fff; }
.cta-foto__local .icone { color: var(--lilas-300); }

/* ---------- 6. Páginas internas ---------- */
.page-hero { position: relative; overflow: hidden; display: flex; align-items: flex-end; min-height: 560px; background: var(--ameixa-950); color: var(--claro-2); padding: calc(var(--topo-h) + var(--header-h) + 72px) 0 clamp(56px, 7vw, 96px); }
.page-hero__foto { position: absolute; inset: 0 0 0 auto; width: 52%; }
.page-hero__foto img { width: 100%; height: 100%; object-fit: cover; }
.page-hero__foto::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, var(--ameixa-950) 0%, rgba(27, 16, 38, .7) 30%, rgba(27, 16, 38, .2) 100%); }
.page-hero .container { position: relative; z-index: 1; }
.page-hero h1 { max-width: 15ch; color: #fff; }
.page-hero h1 em { color: var(--lilas-300); }
.page-hero .lead { max-width: 34rem; margin-top: var(--e-5); color: var(--claro-2); }
.page-hero--centro { min-height: 0; align-items: center; text-align: center; padding-bottom: clamp(48px, 6vw, 80px); }
.page-hero--centro h1 { max-width: 22ch; margin-inline: auto; font-size: clamp(2.2rem, 1.5rem + 2.4vw, 3.6rem); }
.page-hero--centro + .secao { padding-top: clamp(48px, 6vw, 80px); }
.page-hero--centro .lead { margin-inline: auto; }
.page-hero--centro .breadcrumb { justify-content: center; }
/* Abertura clara (corpo clínico): mesmo fundo creme da grade logo abaixo, como uma seção só. */
.page-hero--claro { background: var(--creme); color: var(--texto); }
.page-hero--claro h1 { color: var(--tinta); }
.page-hero--claro h1 em { color: var(--lilas-600); }
.page-hero--claro .lead { color: var(--texto-2); }
.page-hero--claro .breadcrumb { color: var(--texto-2); }
.page-hero--claro .breadcrumb a:hover { color: var(--tinta); }
.page-hero--claro .breadcrumb a { text-decoration-color: var(--linha); }
.page-hero--claro.page-hero--centro { padding-bottom: var(--e-6); }
.page-hero--claro + .secao { padding-top: var(--e-4); }
/* Header sobre abertura clara: logo colorido e texto escuro antes de rolar. */
body:has(.page-hero--claro) .header:not(.is-fixo) { color: var(--tinta); }
body:has(.page-hero--claro) .header:not(.is-fixo) .header__inner { border-bottom-color: var(--linha); }
body:has(.page-hero--claro) .header:not(.is-fixo) .logo .logo--branca { display: none; }
body:has(.page-hero--claro) .header:not(.is-fixo) .logo .logo--cor { display: block; }
body:has(.page-hero--claro) .header:not(.is-fixo) .logo small { color: var(--lilas-600); }
body:has(.page-hero--claro) .header:not(.is-fixo) .nav .btn--claro { --bg: var(--ameixa-900); --fg: #fff; }
.breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: var(--e-2); margin-bottom: var(--e-6); font-size: var(--fs-xs); color: var(--claro-2); }
.breadcrumb a { display: inline-flex; align-items: center; min-height: 40px; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(255, 255, 255, .35); }
.breadcrumb a:hover { color: #fff; }

/* Exames */
.filtros { position: sticky; top: calc(var(--header-h) + 8px); z-index: 20; display: flex; flex-wrap: wrap; gap: var(--e-3); align-items: center; justify-content: space-between; margin-bottom: var(--e-8); padding: var(--e-2); border-radius: var(--r-md); background: rgba(255, 255, 255, .96); backdrop-filter: blur(10px); box-shadow: var(--s-1); border: 1px solid var(--linha); }
.chips { display: flex; flex-wrap: wrap; gap: var(--e-1); }
.chip { min-height: 44px; padding: 0 var(--e-4); border-radius: var(--r-sm); font-size: var(--fs-sm); font-weight: 650; color: var(--texto); transition: background-color .3s, color .3s; }
.chip:hover { background: var(--nevoa); color: var(--tinta); }
.chip[aria-pressed="true"] { background: var(--ameixa-950); color: #fff; }
.busca { position: relative; flex: 1; min-width: 220px; max-width: 360px; }
.busca input { width: 100%; min-height: 46px; padding: 0 var(--e-4) 0 46px; border-radius: var(--r-sm); border: 1px solid var(--linha); background: var(--nevoa); font-size: var(--fs-sm); transition: border-color .3s, box-shadow .3s, background-color .3s; }
.busca input::placeholder { color: var(--texto-2); }
.busca input:focus { outline: none; border-color: var(--lilas-600); background: #fff; box-shadow: 0 0 0 4px rgba(114, 56, 176, .14); }
.busca .icone { position: absolute; left: 16px; top: 50%; translate: 0 -50%; width: 18px; height: 18px; color: var(--lilas-600); pointer-events: none; }
.grupo-exames + .grupo-exames { margin-top: var(--e-9); }
.grupo-exames[hidden] { display: none; }
.grupo-exames__topo { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--e-4); margin-bottom: var(--e-5); padding-bottom: var(--e-4); border-bottom: 1px solid var(--linha); }
.grupo-exames__topo h2 { font-size: clamp(1.6rem, 1.3rem + 1vw, 2.2rem); }
.grupo-exames__topo p { margin: var(--e-2) 0 0; font-size: var(--fs-sm); color: var(--texto-2); }
.grupo-exames__num { font-family: var(--serif); font-style: italic; font-size: 2.6rem; line-height: 1; color: var(--lilas-600); }
.exames-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e-4); }
.exame-card { display: flex; flex-direction: column; gap: var(--e-3); padding: var(--e-6); border-radius: var(--r-md); background: #fff; border: 1px solid var(--linha); scroll-margin-top: 200px; transition: box-shadow .45s var(--ease), border-color .3s; }
.exame-card:hover { border-color: transparent; box-shadow: var(--s-2); }
.exame-card.is-alvo { border-color: var(--lilas-500); box-shadow: 0 0 0 4px var(--lilas-100), var(--s-2); }
.exame-card[hidden] { display: none; }
.exame-card h3 { font-family: var(--serif); font-size: 1.4rem; font-weight: 400; }
.exame-card p { flex: 1; color: var(--texto-2); }
.exame-card .acoes { display: flex; flex-wrap: wrap; align-items: center; gap: var(--e-2) var(--e-5); margin-top: var(--e-2); }
.sem-resultado { padding: var(--e-8) var(--e-5); border-radius: var(--r-lg); background: var(--nevoa); text-align: center; }
.sem-resultado[hidden] { display: none; }
.sem-resultado .btn-grupo { justify-content: center; }
.aviso { display: flex; gap: var(--e-4); margin-top: var(--e-8); padding: var(--e-5) var(--e-6); border-radius: var(--r-md); background: var(--nevoa); color: var(--texto-2); font-size: var(--fs-sm); }
.aviso .icone { width: 22px; height: 22px; margin-top: 2px; color: var(--lilas-600); }

/* A Gestar */
.depoimentos { max-width: 880px; margin-inline: auto; }
.fala { display: grid; grid-template-columns: 160px 1fr; gap: var(--e-6); padding-block: var(--e-6); border-bottom: 1px solid var(--linha-clara); }
.fala:last-child { border-bottom: 0; }
.fala__quem { padding-top: 6px; font-size: var(--fs-tag); font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--lilas-300); }
.fala p { font-family: var(--serif); font-size: clamp(1.15rem, 1.05rem + .4vw, 1.4rem); line-height: 1.5; color: #fff; }
.linha-tempo { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--e-6); margin-top: var(--e-8); padding-top: var(--e-6); border-top: 1px solid var(--linha-clara); }
.linha-tempo b { display: block; margin-bottom: var(--e-2); font-family: var(--serif); font-style: italic; font-size: 2rem; font-weight: 300; color: var(--lilas-300); }
.linha-tempo p { font-size: var(--fs-sm); }

.valores { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--e-4); }
.valor { position: relative; overflow: hidden; padding: var(--e-6); border-radius: var(--r-md); background: #fff; border: 1px solid var(--linha); }
.valor h3 { position: relative; margin: var(--e-8) 0 var(--e-3); }
.valor p { position: relative; font-size: var(--fs-sm); color: var(--texto-2); }

.bio { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(40px, 6vw, 96px); align-items: start; }
.bio--inv { grid-template-columns: 1.1fr .9fr; }
.bio--inv .bio__foto { order: 2; }
.bio__foto { position: sticky; top: 120px; }
.bio__foto .moldura { aspect-ratio: 4 / 5; border-radius: var(--r-lg); box-shadow: var(--s-2); }
.bio__foto img { object-position: 50% 15%; }
.bio__texto .registro { margin-bottom: var(--e-6); }
.bio__texto blockquote { margin: var(--e-6) 0; padding: var(--e-2) 0 var(--e-2) var(--e-5); border-left: 2px solid var(--lilas-500); font-family: var(--serif); font-style: italic; font-size: clamp(1.2rem, 1.1rem + .4vw, 1.45rem); line-height: 1.45; color: var(--tinta); }
.fatos { list-style: none; margin: var(--e-6) 0 0; padding: 0; border-top: 1px solid var(--linha); }
.fatos li { display: grid; grid-template-columns: 140px 1fr; gap: var(--e-4); padding: var(--e-4) 0; border-bottom: 1px solid var(--linha); font-size: var(--fs-sm); }
.fatos b { font-size: var(--fs-tag); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--lilas-600); padding-top: 3px; }

.galeria { display: grid; grid-template-columns: 1.4fr 1fr 1fr; grid-auto-rows: 270px; gap: var(--e-3); }
.galeria figure { position: relative; margin: 0; overflow: hidden; border-radius: var(--r-md); }
.galeria figure:first-child { grid-row: span 2; }
.galeria img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ease); }
.galeria figure:hover img { transform: scale(1.04); }
.galeria figcaption { position: absolute; left: var(--e-3); bottom: var(--e-3); padding: 6px 12px; border-radius: var(--r-pill); background: rgba(27, 16, 38, .6); backdrop-filter: blur(10px); font-size: var(--fs-xs); font-weight: 600; color: #fff; }

/* Corpo clínico */
.equipe { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--e-4); }
.medico { display: flex; flex-direction: column; overflow: hidden; border-radius: var(--r-md); background: #fff; border: 1px solid var(--linha); }
.medico__foto { position: relative; aspect-ratio: 1 / 1.1; overflow: hidden; background: var(--nevoa); }
.medico__foto img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 15%; }
.medico__foto--vazia { display: grid; place-items: center; background: linear-gradient(160deg, var(--nevoa), #fff 70%); }
.medico__foto--vazia .simbolo-linha { width: 34%; }
.medico__foto--vazia span { position: absolute; left: 0; right: 0; bottom: var(--e-4); text-align: center; font-size: var(--fs-tag); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--lilas-600); }
.medico__corpo { padding: var(--e-5); }
.medico__corpo h3 { font-family: var(--serif); font-size: 1.2rem; font-weight: 400; }
.medico__corpo .registro { margin-bottom: 0; }
/* Corpo clínico: todos os profissionais juntos, 4 por fila e a última fila centralizada. */
.equipe--todos { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--e-5); }
.equipe--todos .medico { flex: 0 0 calc((100% - 3 * var(--e-5)) / 4); }
.medico__selo { display: block; margin-bottom: var(--e-1); font-size: var(--fs-tag); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--lilas-600); }

/* Conteúdos */
.artigos-nav { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--e-4); }
.artigo-card { position: relative; overflow: hidden; display: flex; flex-direction: column; gap: var(--e-3); min-height: 260px; padding: var(--e-6); border-radius: var(--r-md); background: #fff; border: 1px solid var(--linha); transition: transform .45s var(--ease), box-shadow .45s var(--ease), border-color .3s; }
.artigo-card:hover { transform: translateY(-4px); box-shadow: var(--s-2); border-color: transparent; }
.artigo-card__tag { position: relative; font-size: var(--fs-tag); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--lilas-600); }
.artigo-card h3 { position: relative; flex: 1; margin-top: var(--e-6); font-family: var(--serif); font-size: 1.45rem; font-weight: 400; line-height: 1.2; }
.artigo-card .link-seta { position: relative; }
.artigo { scroll-margin-top: 120px; }
.artigo + .artigo { margin-top: var(--e-9); padding-top: var(--e-9); border-top: 1px solid var(--linha); }
.artigo h2 { margin-bottom: var(--e-6); }
.artigo h3 { margin: var(--e-7) 0 var(--e-3); font-family: var(--serif); font-size: 1.45rem; font-weight: 400; }
.artigo p, .artigo li { line-height: 1.8; }
.artigo ul { padding-left: 1.25em; margin: 0 0 1em; }
.artigo li { margin-bottom: var(--e-2); }
.artigo li::marker { color: var(--lilas-500); }
.etapas { display: grid; gap: var(--e-3); margin: var(--e-6) 0; }
.etapa { display: grid; grid-template-columns: 210px 1fr; gap: var(--e-5); padding: var(--e-5) var(--e-6); border-radius: var(--r-md); background: #fff; border: 1px solid var(--linha); }
.etapa b { font-family: var(--serif); font-size: 1.15rem; font-weight: 400; color: var(--tinta); }
.etapa b small { display: block; margin-bottom: 2px; font-family: var(--sans); font-size: var(--fs-tag); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--lilas-600); }
.etapa p { margin: 0; font-size: var(--fs-sm); }

/* ---------- 7. Movimento ---------- */
.simbolo-linha :is(path, circle) { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.simbolo-linha .s-pessoa { stroke: var(--lilas-500); }
.simbolo-linha .s-coracao { stroke: var(--rosa-500); }
.simbolo-linha--branco .s-pessoa { stroke: #fff; }
.simbolo-linha--branco .s-coracao { stroke: var(--lilas-300); }
.simbolo-solido .s-cabeca, .simbolo-solido .s-corpo { fill: var(--lilas-300); }
.simbolo-solido .s-coracao { fill: var(--rosa-500); }
.js .simbolo-linha [data-draw] { stroke-dasharray: var(--len); stroke-dashoffset: var(--len); }
.js .simbolo-linha.is-drawn [data-draw] { stroke-dashoffset: 0; transition: stroke-dashoffset 2.2s var(--ease); }
.js .simbolo-linha.is-drawn [data-draw]:nth-child(2) { transition-delay: .3s; }
.js .simbolo-linha.is-drawn .s-coracao { transition-delay: .7s; }

.js [data-reveal] { opacity: 0; transform: translateY(22px); transition: opacity .9s var(--ease), transform .9s var(--ease); transition-delay: var(--d, 0s); }
.js [data-reveal].is-in { opacity: 1; transform: none; }
.js [data-mask] { clip-path: inset(0 0 100% 0); transition: clip-path 1.2s var(--ease); transition-delay: var(--d, 0s); }
.js [data-mask].is-in { clip-path: inset(0 0 0 0); }
.js [data-mask] img { transform: scale(1.1); transition: transform 1.6s var(--ease); transition-delay: var(--d, 0s); }
.js [data-mask].is-in img { transform: none; }
.js .hero [data-hero], .js .page-hero [data-hero] { opacity: 0; transform: translateY(18px); animation: entra 1s var(--ease) forwards; animation-delay: var(--d, .1s); }
.js .hero__foto img, .js .page-hero__foto img { animation: aproxima 2.2s var(--ease) both; }

@keyframes entra { to { opacity: 1; transform: none; } }
@keyframes aproxima { from { transform: scale(1.08); opacity: .4; } to { transform: none; opacity: 1; } }
@keyframes desce { from { transform: translateY(-100%); } to { transform: none; } }
@keyframes faixa { to { transform: translateX(-50%); } }

/* ---------- 8. Responsivo ---------- */
@media (max-width: 1120px) {
  .nav__link { padding: 0 var(--e-2); }
  .momento { min-height: 380px; }
  .equipe { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .equipe--todos .medico { flex-basis: calc((100% - 2 * var(--e-5)) / 3); }
  .footer__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}

@media (max-width: 960px) {
  #diferencial .grid-2 { grid-template-columns: 1fr; }
  /* Texto sobre a foto como no desktop, mas com espaço livre em cima para o rosto
     e o degradê começando só abaixo dele. */
  .fundadora__foto img { position: absolute; inset: 0; height: 100%; aspect-ratio: auto; object-position: 50% 0; }
  .fundadora__corpo { padding: min(80vw, 360px) var(--e-5) var(--e-6);
    background: linear-gradient(180deg, rgba(27, 16, 38, 0) 0%, rgba(27, 16, 38, 0) 36%, rgba(27, 16, 38, .55) 48%, rgba(27, 16, 38, .88) 64%, var(--ameixa-950) 100%); }
  :root { --header-h: 72px; }
  .topo__dir a:not(:first-child) { display: none; }
  .logo img { width: 96px; }
  .logo { padding-block: 10px; }
  .menu-toggle { display: block; }
  .nav {
    position: fixed; inset: 0; z-index: 1; flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 0;
    padding: calc(var(--header-h) + var(--e-5)) var(--gutter) var(--e-6); background: #fff; color: var(--tinta); overflow-y: auto;
    opacity: 0; visibility: hidden; transform: translateY(-12px); transition: opacity .35s var(--ease), transform .45s var(--ease), visibility 0s .45s;
  }
  .menu-aberto .nav { opacity: 1; visibility: visible; transform: none; transition: opacity .35s var(--ease), transform .45s var(--ease), visibility 0s; }
  .nav__link { min-height: 58px; padding: 0; border-bottom: 1px solid var(--linha); font-family: var(--serif); font-size: 1.5rem; font-weight: 400; opacity: 1; }
  .nav__link::after { display: none; }
  .nav__link[aria-current="page"] { color: var(--lilas-600); }
  .nav .btn { margin: var(--e-6) 0 0; --bg: var(--ameixa-900); --fg: #fff; }
  .nav__extra { display: flex; flex-direction: column; gap: var(--e-1); margin-top: var(--e-6); }
  .nav__extra a { display: inline-flex; align-items: center; gap: var(--e-3); min-height: 44px; font-size: var(--fs-sm); font-weight: 600; color: var(--lilas-600); }
  /* Trava a rolagem da página com o menu aberto (no iPhone o overflow precisa estar no html). */
  html:has(body.menu-aberto), .menu-aberto { overflow: hidden; }
  .nav { overscroll-behavior: contain; }
  /* Acima da faixa do topo (z-index 101), senão ela cobre o logo e o botão de fechar. */
  /* Desfoque atrás do header sobre a foto. Fica num pseudo-elemento porque backdrop-filter
     no próprio header prenderia o painel do menu (position: fixed) dentro dele. */
  .header::before { content: ""; position: absolute; inset: 0; z-index: -1; background: rgba(27, 16, 38, .28); backdrop-filter: blur(14px) saturate(1.2); -webkit-backdrop-filter: blur(14px) saturate(1.2); transition: opacity .35s; }
  body:has(.hero.lilas) .header::before { background: rgba(27, 16, 38, .62); }
  .header.is-fixo::before, .menu-aberto .header::before { opacity: 0; }
  .menu-aberto .header { position: fixed; top: 0; z-index: 102; background: #fff; color: var(--tinta); box-shadow: none; transform: none;
    /* backdrop-filter e animação viram referência do position:fixed e prendiam o painel dentro do header. */
    backdrop-filter: none; -webkit-backdrop-filter: none; animation: none; }

  .hero { flex-direction: column; align-items: stretch; min-height: 0; padding: 0 0 var(--e-8); }
  .hero__foto { position: relative; inset: auto; width: 100%; height: clamp(460px, 125vw, 720px); }
  .hero__foto img { object-position: 50% 0; }
  /* Topo mais escuro para o menu ter contraste; base com transição longa e suave até a headline. */
  .hero__foto::after { background: linear-gradient(180deg,
    rgba(27, 16, 38, .82) 0%, rgba(27, 16, 38, .5) 10%, rgba(27, 16, 38, .12) 18%, rgba(27, 16, 38, 0) 23%,
    rgba(176, 143, 183, 0) 50%, rgba(176, 143, 183, .3) 60%, rgba(176, 143, 183, .62) 71%, rgba(176, 143, 183, .86) 82%, var(--lilas-marca) 94%); }
  .hero .container { margin-top: -150px; }
  .hero__assinatura { display: none; }
  .page-hero { min-height: 0; flex-direction: column; align-items: stretch; padding: 0 0 var(--e-8); }
  .page-hero__foto { position: relative; inset: auto; width: 100%; height: clamp(260px, 62vw, 420px); }
  .page-hero__foto::after { background: linear-gradient(180deg, rgba(27, 16, 38, .6) 0%, rgba(27, 16, 38, .1) 35%, var(--ameixa-950) 100%); }
  .page-hero .container { margin-top: -40px; }
  .page-hero--sem-foto { padding-top: calc(var(--topo-h) + var(--header-h) + 48px); }

  .grid-2, .bio, .bio--inv, .resultados, .footer__topo { grid-template-columns: 1fr; }
  .bio--inv .bio__foto { order: 0; }
  .bio__foto { position: relative; top: 0; max-width: 460px; }
  .exames-lista { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .equipe-linha { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .insta-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .artigos-nav, .valores { grid-template-columns: 1fr; }
  .galeria { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-auto-rows: 200px; }
  .galeria figure:first-child { grid-column: span 2; grid-row: auto; }
  .filtros { position: static; }
  .busca { max-width: none; }
  .historia__media { max-width: 520px; padding-top: 0; }

  .whats-float { display: none; }
  .barra-cta {
    position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 90; display: flex; gap: var(--e-2); padding: var(--e-2);
    border-radius: var(--r-md); background: rgba(27, 16, 38, .92); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); box-shadow: 0 20px 40px -16px rgba(0, 0, 0, .6);
    transform: translateY(140%); transition: transform .5s var(--ease);
  }
  .barra-cta.is-visivel { transform: none; }
  .barra-cta .btn { flex: 1; min-height: 52px; }
  .barra-cta .btn--linha-clara { flex: 0 0 52px; padding: 0; justify-content: center; }
  .menu-aberto .barra-cta { transform: translateY(140%); }
  .footer { padding-bottom: 110px; }
}

@media (max-width: 640px) {
  /* Primeira dobra do celular: sem a faixa do topo (a localização vai para baixo dos botões),
     logo menor com mais respiro e textos mais compactos para o botão aparecer. */
  :root { --topo-h: 0px; --header-h: 84px; }
  .topo { display: none; }
  .logo { padding-block: 16px; }
  .logo img { width: 82px; }
  /* A foto começa um pouco abaixo do topo para a cabeça delas não ficar atrás do menu. */
  .hero__foto { height: clamp(420px, 112vw, 600px); margin-top: 44px; }
  .hero__foto::after { background: linear-gradient(180deg,
    var(--ameixa-950) 0%, rgba(27, 16, 38, .6) 5%, rgba(27, 16, 38, .2) 11%, rgba(27, 16, 38, 0) 16%,
    rgba(176, 143, 183, 0) 54%, rgba(176, 143, 183, .32) 63%, rgba(176, 143, 183, .66) 74%, rgba(176, 143, 183, .9) 85%, var(--lilas-marca) 96%); }
  .hero .container { margin-top: -140px; }
  .hero .tag { margin-bottom: var(--e-4); }
  .hero__sub { margin-top: var(--e-4); font-size: .9rem; line-height: 1.6; }
  .hero__sub strong { margin-bottom: var(--e-1); font-size: .98rem; line-height: 1.5; }
  .hero .btn-grupo { margin-top: var(--e-5); gap: var(--e-2); }
  .hero__local { display: inline-flex; align-items: center; gap: var(--e-2); min-height: 44px; margin-top: var(--e-3); font-size: var(--fs-xs); color: var(--claro-2); }
  .hero__local .icone { width: 16px; height: 16px; color: var(--lilas-300); }
  :root { --fs-base: 1rem; }
  .btn { white-space: normal; text-align: left; }
  .cartao-foto figcaption { padding: var(--e-3) var(--e-4); }
  .cartao-foto figcaption b { font-size: 1.05rem; }
  .hero .tag { font-size: 10px; letter-spacing: .12em; }
  .hero .tag__extra { display: none; }
  /* Cabe em até 3 linhas nas telas de 380–410px. */
  .hero h1 { font-size: min(2.6rem, calc((100vw - 2rem) * .105)); }
  .topo { font-size: 12px; }
  .topo .topo__dir { display: none; }
  .topo .container { justify-content: center; }
  .momentos, .exames-lista, .exames-grid, .fundadoras, .footer__grid { grid-template-columns: 1fr; }
  .momento { min-height: 360px; }
  .hero .btn-grupo .btn, .cta-foto .btn-grupo .btn { width: 100%; }
  .equipe { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--e-3); }
  .equipe--todos { gap: var(--e-3); }
  .equipe--todos .medico { flex-basis: calc((100% - var(--e-3)) / 2); }
  .medico__corpo { padding: var(--e-4); }
  .medico__corpo h3 { font-size: 1.05rem; }
  .marcos, .linha-tempo { grid-template-columns: 1fr; gap: var(--e-4); }
  .fala { grid-template-columns: 1fr; gap: var(--e-2); }
  .etapa, .fatos li { grid-template-columns: 1fr; gap: var(--e-1); }
  .filtros { flex-direction: column; align-items: stretch; }
  .chips { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .chip { flex-shrink: 0; }
  .exame-card, .valor, .artigo-card, .exame-item { padding: var(--e-5); }
  .numeral { font-size: 7rem; }
  .faq details p { padding-right: 0; }
  .membro--mais { padding: var(--e-4); }
  .membro--mais b { font-size: 3rem; }
  .membro--mais span { font-size: 1.05rem; }
  .grupo-exames__num { font-size: 2rem; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  .js [data-reveal], .js [data-mask], .js [data-hero] { opacity: 1 !important; transform: none !important; clip-path: none !important; }
  .js [data-mask] img { transform: none !important; }
  .faixa__trilho { animation: none; }
}
