/* ==========================================================================
   Clínica Lapidare — Saúde Integrada
   Paleta amostrada da marca real: teal do diamante/fachada + nude/creme/madeira
   do interior. Degradê + vidro (glassmorphism) na linha da referência do Cauê.
   ========================================================================== */

:root{
  /* bases nude/creme */
  --creme:        #F4EBE1;
  --creme-2:      #EFE3D3;
  --branco:       #FCF8F2;
  --nude:         #E8DAC8;
  --areia:        #DAC7AF;

  /* teal — cor da marca */
  --teal-vivo:    #14A3AA;   /* diamante / ícones / decoração */
  --teal:         #0C6E74;   /* links e acentos legíveis */
  --teal-profundo:#0F4653;   /* títulos, botão, rodapé */
  --teal-escuro:  #0A333C;   /* fundo mais profundo */

  /* champanhe / madeira (acento quente) */
  --champanhe:    #B8925F;
  --champanhe-cl: #D8B98C;

  /* texto */
  --texto:        #34302B;
  --texto-suave:  #6A6157;
  --texto-claro:  #E9F2F1;

  /* linhas e vidro */
  --linha:        rgba(15,70,83,.14);
  --linha-forte:  rgba(15,70,83,.24);
  --vidro:        rgba(252,248,242,.55);
  --vidro-borda:  rgba(255,255,255,.65);

  --serifa: "Marcellus", Georgia, "Times New Roman", serif;
  --sans:   "Manrope", "Segoe UI", system-ui, sans-serif;
  --script: "Sacramento", "Marcellus", cursive;

  --largura: 1180px;
  --raio: 20px;
  --sombra: 0 24px 60px -30px rgba(15,70,83,.45);
  --sombra-suave: 0 14px 40px -26px rgba(15,70,83,.4);
}

*{ box-sizing:border-box; margin:0; padding:0; }

html{ scroll-behavior:smooth; }

body{
  font-family:var(--sans);
  color:var(--texto);
  background:var(--creme);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

/* fundo geral com degradês suaves */
body::before{
  content:"";
  position:fixed; inset:0; z-index:-1;
  background:
    radial-gradient(1100px 700px at 88% -8%, rgba(20,163,170,.14), transparent 60%),
    radial-gradient(900px 620px at -6% 12%, rgba(184,146,95,.14), transparent 60%),
    linear-gradient(180deg, var(--creme) 0%, var(--creme-2) 100%);
}

img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }

h1,h2,h3,h4{ font-family:var(--serifa); font-weight:400; color:var(--teal-profundo); line-height:1.12; letter-spacing:.01em; }
h1{ font-size:clamp(2.3rem,5.4vw,3.85rem); }
h2{ font-size:clamp(1.85rem,3.6vw,2.7rem); }
h3{ font-size:clamp(1.15rem,2vw,1.4rem); }

.conteudo{ width:min(var(--largura), 92vw); margin-inline:auto; }
.secao{ padding:clamp(4rem,9vw,7rem) 0; position:relative; }
.secao-nude{ background:linear-gradient(180deg, rgba(232,218,200,.55), rgba(240,227,211,.75)); }

.rotulo{
  font-family:var(--sans);
  text-transform:uppercase; letter-spacing:.26em; font-size:.72rem; font-weight:700;
  color:var(--teal); margin-bottom:1rem;
}
.rotulo.claro{ color:var(--teal-vivo); }

.eyebrow{
  text-transform:uppercase; letter-spacing:.24em; font-size:.74rem; font-weight:700;
  color:var(--teal); margin-bottom:1.4rem;
}

.script{ font-family:var(--script); text-transform:none; letter-spacing:0; }

/* ---------- Cabeçalho ---------- */
.cabecalho{
  position:sticky; top:0; z-index:60;
  background:rgba(244,235,225,.72);
  backdrop-filter:saturate(1.4) blur(16px);
  -webkit-backdrop-filter:saturate(1.4) blur(16px);
  border-bottom:1px solid var(--linha);
}
.cabecalho-interno{
  width:min(var(--largura), 94vw); margin-inline:auto;
  display:flex; align-items:center; justify-content:space-between;
  padding:.85rem 0;
}
.marca{ display:flex; align-items:center; gap:.7rem; }
.marca-diamante{ color:var(--teal-vivo); width:34px; height:34px; display:grid; place-items:center; }
.marca-diamante svg{ width:100%; height:100%; }
.marca-diamante.grande{ width:52px; height:52px; }
.marca-texto{ display:flex; flex-direction:column; line-height:1; }
.marca-nome{ font-family:var(--serifa); font-size:1.5rem; color:var(--teal-profundo); letter-spacing:.02em; }
.marca-tag{ font-size:.6rem; text-transform:uppercase; letter-spacing:.32em; color:var(--champanhe); margin-top:.28rem; }

.nav-desktop{ display:flex; align-items:center; gap:1.9rem; }
.nav-desktop a{ font-size:.92rem; font-weight:500; color:var(--texto); transition:color .2s; }
.nav-desktop a:hover{ color:var(--teal); }
.nav-desktop a.btn{ color:#fff; }
.nav-desktop a.btn:hover{ color:#fff; }

.menu-botao{ display:none; background:none; border:0; cursor:pointer; width:42px; height:42px; padding:9px; }
.menu-botao span{ display:block; height:2px; background:var(--teal-profundo); border-radius:2px; margin:4px 0; transition:.3s; }
.menu-botao[aria-expanded="true"] span:nth-child(1){ transform:translateY(6px) rotate(45deg); }
.menu-botao[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.menu-botao[aria-expanded="true"] span:nth-child(3){ transform:translateY(-6px) rotate(-45deg); }

.menu-mobile{
  display:none; flex-direction:column; gap:.2rem;
  padding:0 4vw; max-height:0; overflow:hidden;
  background:rgba(244,235,225,.96);
  border-bottom:1px solid var(--linha);
  transition:max-height .4s ease;
}
.menu-mobile.aberto{ max-height:420px; }
.menu-mobile a{ padding:.9rem .2rem; border-bottom:1px solid var(--linha); font-weight:500; }
.menu-mobile a:last-child{ border-bottom:0; margin:.8rem 0 1.2rem; }

/* ---------- Botões ---------- */
.btn{
  display:inline-flex; align-items:center; gap:.55rem; justify-content:center;
  background:var(--teal-profundo); color:#fff;
  padding:.72rem 1.35rem; border-radius:999px;
  font-weight:600; font-size:.94rem; letter-spacing:.01em;
  border:1px solid transparent; cursor:pointer;
  transition:transform .25s, box-shadow .25s, background .25s;
  box-shadow:0 12px 26px -14px rgba(15,70,83,.7);
}
.btn:hover{ transform:translateY(-2px); background:#0c5561; box-shadow:0 18px 34px -14px rgba(15,70,83,.75); }
.btn .ic{ width:1.05em; height:1.05em; }
.btn-grande{ padding:.92rem 1.7rem; font-size:1rem; }
.btn-mini{ padding:.5rem 1.05rem; font-size:.85rem; }
.btn-fantasma{
  background:rgba(255,255,255,.35); color:var(--teal-profundo);
  border:1px solid var(--linha-forte); box-shadow:none;
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
}
.btn-fantasma:hover{ background:rgba(255,255,255,.6); }

.link-seta{ display:inline-flex; align-items:center; gap:.5rem; color:var(--teal); font-weight:600; font-size:.95rem; }
.link-seta span{ transition:transform .25s; }
.link-seta:hover span{ transform:translateX(5px); }
.link-seta.claro{ color:var(--teal-vivo); }

/* ---------- Hero — foto da clínica em full-bleed + painel de vidro ---------- */
.hero{
  position:relative; overflow:hidden;
  min-height:clamp(620px, 88vh, 860px);
  /* o letreiro da fachada fica na parte de cima da foto, então o painel de texto
     é ancorado embaixo — a marca aparece limpa no topo */
  display:flex; flex-direction:column; justify-content:flex-end;
  padding:clamp(9rem,22vw,15rem) 0 clamp(2rem,4vw,3rem);
}
.hero-foto{ position:absolute; inset:0; z-index:0; }
.hero-foto img{
  position:absolute; top:-4%; left:0;
  width:100%; height:108%;           /* folga discreta para o parallax (máx. 20px) */
  object-fit:cover; object-position:center 12%;
}
.hero-veu{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    linear-gradient(180deg,
      rgba(244,235,225,.18) 0%,
      rgba(244,235,225,.02) 26%,
      rgba(244,235,225,.34) 56%,
      rgba(244,235,225,.86) 80%,
      rgba(240,227,211,.99) 100%),
    linear-gradient(95deg,
      rgba(244,235,225,.50) 0%,
      rgba(244,235,225,.14) 44%,
      transparent 72%);
}
.hero-brilho{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    radial-gradient(520px 360px at 80% 24%, rgba(20,163,170,.16), transparent 65%),
    radial-gradient(460px 340px at 12% 80%, rgba(184,146,95,.14), transparent 65%);
}
.hero-interno{ position:relative; z-index:2; width:min(var(--largura), 92vw); margin-inline:auto; }
.hero-painel{
  max-width:660px;
  background:rgba(252,248,242,.5);
  backdrop-filter:blur(18px) saturate(1.35); -webkit-backdrop-filter:blur(18px) saturate(1.35);
  border:1px solid rgba(255,255,255,.7); border-radius:26px;
  padding:clamp(1.8rem,3.4vw,2.9rem);
  box-shadow:0 30px 70px -40px rgba(15,70,83,.55);
}
.hero-painel h1{ margin:.4rem 0 1.3rem; position:relative; font-size:clamp(2.05rem,3.5vw,3.05rem); }
.hero-painel h1 .script{
  display:block; color:var(--teal-vivo); font-size:.62em; margin-top:.15rem;
  transform:rotate(-3deg); transform-origin:left; margin-left:.1em;
}
.hero-sub{ font-size:1.06rem; color:var(--texto-suave); }
.hero-acoes{ display:flex; flex-wrap:wrap; gap:.9rem; margin-top:1.9rem; }
.hero-local{
  display:flex; align-items:center; gap:.55rem; margin-top:1.5rem;
  font-size:.88rem; color:var(--texto-suave); font-weight:500;
}
.hero-local .ponto{
  width:8px; height:8px; border-radius:50%; background:var(--teal-vivo);
  box-shadow:0 0 0 4px rgba(20,163,170,.28);
}
.vidro-foto{
  position:relative; border-radius:var(--raio); overflow:hidden;
  border:1px solid var(--vidro-borda); box-shadow:var(--sombra);
  background:var(--vidro);
}
.vidro-foto img{ width:100%; height:100%; object-fit:cover; aspect-ratio:1/1; }
.vidro-foto.alta img{ aspect-ratio:4/5; }
.vidro-foto figcaption{
  position:absolute; left:14px; bottom:14px;
  display:flex; align-items:center; gap:.5rem;
  background:rgba(15,70,83,.55); color:#fff;
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  padding:.45rem .85rem; border-radius:999px; font-size:.8rem; font-weight:500;
  border:1px solid rgba(255,255,255,.25);
}
.vidro-foto .ponto{ width:8px; height:8px; border-radius:50%; background:var(--teal-vivo); box-shadow:0 0 0 4px rgba(20,163,170,.3); }

/* selos de confiança */
.hero-selos{
  position:relative; z-index:2;
  width:min(var(--largura), 92vw); margin:clamp(2.5rem,5vw,3.5rem) auto 0;
  display:grid; grid-template-columns:repeat(4,1fr); gap:1rem;
}
.selo{
  background:var(--vidro); border:1px solid var(--vidro-borda);
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  border-radius:16px; padding:1.1rem 1.2rem; text-align:center;
  box-shadow:var(--sombra-suave);
}
.selo strong{ display:block; font-family:var(--serifa); font-size:1.7rem; color:var(--teal-profundo); line-height:1; }
.selo .estrelas{ color:var(--champanhe); font-size:.9rem; letter-spacing:.1em; }
.selo small{ display:block; color:var(--texto-suave); font-size:.78rem; margin-top:.4rem; }

/* ---------- A clínica ---------- */
.grade-clinica{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(2rem,4vw,3.6rem); align-items:center; }
.clinica-texto h2{ margin-bottom:1.3rem; }
.clinica-texto p{ color:var(--texto-suave); margin-bottom:1.1rem; max-width:34rem; }
.clinica-texto .link-seta{ margin-top:.5rem; }
.clinica-fotos{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; align-items:start; }
.clinica-fotos .vidro-foto:nth-child(2){ margin-top:2.2rem; }

/* ---------- Especialidades ---------- */
.cabecalho-secao{ max-width:44rem; margin-bottom:clamp(2.2rem,4vw,3rem); }
.cabecalho-secao .intro{ color:var(--texto-suave); font-size:1.05rem; margin-top:.9rem; }

.grade-servicos{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.1rem; }
.cartao-servico{
  display:flex; flex-direction:column;
  background:var(--vidro); border:1px solid var(--vidro-borda);
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  border-radius:var(--raio); padding:1.6rem 1.4rem;
  box-shadow:var(--sombra-suave);
  transition:transform .3s, box-shadow .3s, border-color .3s;
}
.cartao-servico:hover{ transform:translateY(-5px); box-shadow:var(--sombra); border-color:rgba(20,163,170,.45); }
.cartao-icone{ width:44px; height:44px; color:var(--teal-vivo); margin-bottom:1rem; display:block; }
.cartao-icone svg{ width:100%; height:100%; }
.cartao-servico h3{ margin-bottom:.55rem; }
.cartao-servico > p{ color:var(--texto-suave); font-size:.92rem; flex-grow:1; }
.cartao-prof{ margin:1rem 0 1.1rem; padding-top:1rem; border-top:1px solid var(--linha); }
.prof-nome{ display:block; font-weight:700; color:var(--teal-profundo); font-size:.95rem; }
.prof-area{ display:block; color:var(--texto-suave); font-size:.8rem; margin-top:.15rem; }
.cartao-zap{
  display:inline-flex; align-items:center; gap:.5rem; margin-top:auto;
  color:var(--teal); font-weight:600; font-size:.88rem;
}
.cartao-zap .ic{ width:1.15em; height:1.15em; color:var(--teal-vivo); flex-shrink:0; }
.cartao-zap:hover{ color:var(--teal-profundo); }
.destaque-nutri{ border-color:rgba(20,163,170,.4); background:linear-gradient(180deg, rgba(20,163,170,.08), var(--vidro)); }
.cartao-recepcao{ background:linear-gradient(160deg, rgba(15,70,83,.92), rgba(10,51,60,.95)); border-color:transparent; }
.cartao-recepcao h3{ color:#fff; }
.cartao-recepcao > p{ color:rgba(233,242,241,.85); }
.cartao-recepcao .cartao-icone{ color:var(--teal-vivo); }
.cartao-recepcao .cartao-zap{ color:#fff; }
.cartao-recepcao .cartao-zap .ic{ color:var(--teal-vivo); }

/* ---------- Quem cuida ---------- */
.grade-equipe{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem; }
.cartao-prof-grande{
  text-align:center;
  background:var(--vidro); border:1px solid var(--vidro-borda);
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  border-radius:var(--raio); padding:2.2rem 1.6rem;
  box-shadow:var(--sombra-suave); transition:transform .3s, box-shadow .3s;
}
.cartao-prof-grande:hover{ transform:translateY(-5px); box-shadow:var(--sombra); }
.avatar-diamante{
  position:relative; width:82px; height:82px; margin:0 auto 1.1rem;
  display:grid; place-items:center; color:var(--teal-vivo);
}
.avatar-diamante svg{ width:100%; height:100%; }
.avatar-diamante em{
  position:absolute; inset:0; display:grid; place-items:center;
  font-style:normal; font-family:var(--serifa); font-size:1.15rem;
  color:var(--teal-profundo); padding-top:.4rem;
}
.cartao-prof-grande h3{ margin-bottom:.25rem; }
.prof-tag{ color:var(--teal); font-weight:600; font-size:.85rem; text-transform:uppercase; letter-spacing:.14em; }
.prof-desc{ color:var(--texto-suave); font-size:.92rem; margin:.9rem 0; }
.prof-registro{ font-size:.82rem; color:var(--texto-suave); margin-bottom:1.2rem; font-weight:500; }
.mini-zap{
  display:inline-flex; align-items:center; gap:.45rem;
  border:1px solid var(--linha-forte); border-radius:999px;
  padding:.5rem 1.2rem; font-weight:600; font-size:.85rem; color:var(--teal-profundo);
  transition:background .25s, color .25s;
}
.mini-zap:hover{ background:var(--teal-profundo); color:#fff; }
.nota-equipe{ text-align:center; color:var(--texto-suave); font-size:.92rem; margin-top:2rem; max-width:38rem; margin-inline:auto; }

/* ---------- Experiência (faixa teal) ---------- */
.secao-teal{
  background:linear-gradient(150deg, var(--teal-profundo), var(--teal-escuro));
  color:var(--texto-claro); overflow:hidden;
}
.secao-teal h2{ color:#fff; }
.secao-teal p{ color:rgba(233,242,241,.85); }
.grade-exp{ display:grid; grid-template-columns:1.1fr .9fr; gap:3rem; align-items:center; }
.exp-texto h2{ margin:.5rem 0 1.2rem; max-width:24rem; }
.exp-texto p{ max-width:32rem; margin-bottom:1.5rem; }
.exp-diamante{ position:relative; display:grid; place-items:center; min-height:230px; }
.exp-diamante svg{ width:min(60%,220px); color:var(--teal-vivo); opacity:.85; filter:drop-shadow(0 18px 40px rgba(0,0,0,.35)); }
.script-teal{ position:absolute; bottom:8%; color:#fff; font-size:2.4rem; opacity:.95; }

/* ---------- Avaliações ---------- */
.nota-google{ font-family:var(--serifa); font-size:1.35rem; color:var(--teal-profundo); margin-right:.4rem; }
.nota-google .estrelas{ color:var(--champanhe); font-size:.95rem; }
.grade-avaliacoes{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.3rem; }
.cartao-avaliacao{
  position:relative;
  background:var(--vidro); border:1px solid var(--vidro-borda);
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  border-radius:var(--raio); padding:2.2rem 1.7rem 1.7rem;
  box-shadow:var(--sombra-suave);
}
.cartao-avaliacao .aspas{
  position:absolute; top:.1rem; left:1.3rem;
  font-family:var(--serifa); font-size:4rem; color:var(--teal-vivo); opacity:.35; line-height:1;
}
.cartao-avaliacao blockquote{ color:var(--texto); font-size:.98rem; margin:.4rem 0 1.3rem; }
.cartao-avaliacao figcaption strong{ color:var(--teal-profundo); font-weight:700; display:block; }
.cartao-avaliacao figcaption span{ color:var(--texto-suave); font-size:.82rem; }

/* ---------- Onde fica — faixa de mapa full-width + cartão sobreposto
   (mesmo padrão do site da Luiza: o mapa vem primeiro, o cartão sobe por cima) ---------- */
.secao-onde{
  position:relative;
  background:linear-gradient(180deg, rgba(232,218,200,.55), rgba(240,227,211,.75));
  padding-bottom:clamp(3rem,6vw,4.5rem);
}
.mapa-faixa{ line-height:0; position:relative; border-bottom:1px solid var(--linha); }
.mapa-faixa iframe{
  width:100%; height:clamp(320px, 46vh, 520px);
  border:0; display:block;
  filter:saturate(.82) contrast(1.02);
}
.onde-conteudo{ position:relative; z-index:2; margin-top:-150px; }
.onde-cartao{
  max-width:620px;
  background:rgba(252,248,242,.8);
  backdrop-filter:blur(16px) saturate(1.3); -webkit-backdrop-filter:blur(16px) saturate(1.3);
  border:1px solid var(--vidro-borda); border-radius:var(--raio);
  padding:clamp(1.7rem,3.2vw,2.4rem);
  box-shadow:var(--sombra);
}
.onde-cartao h2{ margin:.3rem 0 1.1rem; }
.endereco{ color:var(--texto); font-size:1.05rem; margin-bottom:1.5rem; }
.horario{ border:1px solid var(--linha); border-radius:16px; overflow:hidden; margin-bottom:1.5rem; background:rgba(255,255,255,.55); }
.horario-linha{ display:flex; justify-content:space-between; padding:.85rem 1.2rem; }
.horario-linha:not(:last-child){ border-bottom:1px solid var(--linha); }
.horario-linha span{ color:var(--texto-suave); }
.horario-linha strong{ color:var(--teal-profundo); }
.onde-contatos{ display:flex; flex-wrap:wrap; gap:.8rem; margin-bottom:1.1rem; }
.onde-extra{ color:var(--texto-suave); font-size:.9rem; }
.onde-extra a{ color:var(--teal); font-weight:600; }

/* ---------- Rodapé ---------- */
.rodape{ background:linear-gradient(160deg, var(--teal-profundo), var(--teal-escuro)); color:var(--texto-claro); padding:clamp(3rem,6vw,4.5rem) 0 0; }
.rodape-interno{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:2.4rem; padding-bottom:2.6rem; }
.rodape .marca-diamante{ color:var(--teal-vivo); }
.rodape .marca-nome{ color:#fff; }
.rodape .marca-tag{ color:var(--champanhe-cl); }
.rodape-marca .marca-diamante{ margin-bottom:.6rem; }
.rodape-slogan{ font-family:var(--script); font-size:1.6rem; color:rgba(233,242,241,.9); margin-top:.6rem; }
.rodape-col h4{ font-family:var(--sans); font-size:.8rem; text-transform:uppercase; letter-spacing:.2em; color:var(--champanhe-cl); margin-bottom:1rem; font-weight:700; }
.rodape-col a, .rodape-col p{ display:block; color:rgba(233,242,241,.8); font-size:.92rem; margin-bottom:.55rem; }
.rodape-col a:hover{ color:#fff; }
.rodape-base{ border-top:1px solid rgba(255,255,255,.14); padding:1.4rem 0 2rem; }
.rodape-base .conteudo, .rodape-base p{ text-align:center; }
.rodape-base{ text-align:center; }
.rodape-base p{ color:rgba(233,242,241,.6); font-size:.8rem; margin-bottom:.35rem; }

/* ---------- Botões flutuantes ---------- */
.flutuantes{ position:fixed; right:18px; bottom:18px; z-index:70; display:flex; flex-direction:column; gap:.7rem; }
.fab{
  width:54px; height:54px; border-radius:50%; display:grid; place-items:center;
  box-shadow:0 14px 30px -10px rgba(15,70,83,.6); transition:transform .25s;
  border:1px solid rgba(255,255,255,.35);
}
.fab svg{ width:26px; height:26px; }
.fab:hover{ transform:translateY(-3px) scale(1.05); }
.fab-zap{ background:#25D366; color:#fff; }
.fab-insta{ background:linear-gradient(45deg,#f09433,#dc2743,#bc1888); color:#fff; }

/* ---------- Animações de revelação ---------- */
.revelar{ opacity:0; transform:translateY(30px); transition:opacity .9s cubic-bezier(.2,.7,.2,1), transform .9s cubic-bezier(.2,.7,.2,1); }
.revelar.visivel{ opacity:1; transform:none; }

@media (prefers-reduced-motion:reduce){
  .revelar{ opacity:1 !important; transform:none !important; transition:none; }
  html{ scroll-behavior:auto; }
}

/* ==========================================================================
   Responsivo
   ========================================================================== */
@media (max-width:960px){
  .grade-clinica, .grade-exp{ grid-template-columns:1fr; }
  .onde-conteudo{ margin-top:-80px; }
  .onde-cartao{ max-width:none; }
  /* no celular a foto vira uma FAIXA no topo (não o fundo do hero inteiro),
     senão o `cover` num bloco alto e estreito corta uma fatia irreconhecível */
  .hero{
    --banda: clamp(300px, 70vw, 460px);
    min-height:auto;
    padding-top:calc(var(--banda) - 2.5rem);
    padding-bottom:2.5rem;
  }
  .hero-foto, .hero-veu{ height:var(--banda); bottom:auto; }
  .hero-foto img{ top:-3%; height:106%; object-position:center 22%; }
  .hero-veu{
    background:linear-gradient(180deg,
      rgba(244,235,225,.05) 0%,
      rgba(244,235,225,.16) 55%,
      rgba(244,235,225,.84) 88%,
      var(--creme) 100%);
  }
  .hero-brilho{ display:none; }
  .hero-painel{ max-width:none; }
  .grade-servicos{ grid-template-columns:repeat(2,1fr); }
  .grade-equipe{ grid-template-columns:1fr; max-width:440px; margin-inline:auto; }
  .grade-avaliacoes{ grid-template-columns:1fr; max-width:560px; margin-inline:auto; }
  .hero-selos{ grid-template-columns:repeat(2,1fr); }
  .clinica-fotos{ max-width:520px; }
  .rodape-interno{ grid-template-columns:1fr 1fr; }
  .rodape-marca{ grid-column:1 / -1; }
}

@media (max-width:680px){
  .nav-desktop{ display:none; }
  .menu-botao{ display:block; }
  .menu-mobile{ display:flex; }
  .grade-servicos{ grid-template-columns:1fr; }
  .clinica-fotos .vidro-foto:nth-child(2){ margin-top:0; }
  .hero-acoes .btn{ flex:1 1 auto; }
  .rodape-interno{ grid-template-columns:1fr; }
  .flutuantes{ right:14px; bottom:14px; }
  .fab{ width:50px; height:50px; }
}