/*
Theme Name: Clínica RF
Theme URI: https://clinicarf.gtwagencia.com.br
Author: GTW Agência
Author URI: https://www.gtwagencia.com.br
Description: Tema sob medida para a Clínica RF, de dermatologia e psiquiatria em Penápolis-SP, feito a partir do layout do Canva. Página única com especialidades, tratamentos estéticos, clínicos e cirúrgicos, psiquiatria e Liftera; cada tratamento abre o WhatsApp com o nome dele, e o painel no Personalizar guarda contato, Instagram, vídeo do Liftera, médicos e SEO.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.9
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: clinica-rf
Tags: one-column, translation-ready
*/
/* =========================================================
   CLÍNICA RF — Dermatologia e Psiquiatria em Penápolis-SP
   Layout: "CLÍNICA RF - SITE WAD @2026 - desdobramentos.pdf"
   (Canva, 1440 px). Cores e fontes tiradas do próprio PDF; a
   Baskerville Display PT do layout é paga, então os títulos usam
   a Libre Caslon Display e os destaques em itálico a Libre Caslon Text.
   ========================================================= */

:root{
  --tinta:#6d6262;      /* texto e títulos */
  --ouro:#ae9276;       /* destaques, traços, faixa do rodapé */
  --creme:#e2dcc9;      /* rodapé dos cards */
  --topo-bg:#d1ccc3;    /* barra do topo e tela de carregamento */
  --fundo:#ebe4da;      /* fundo liso (celular, por trás das fotos) */
  --branco:#fff;

  --display:"Libre Caslon Display", "Libre Caslon Text", Georgia, serif;
  --italico:"Libre Caslon Text", Georgia, serif;
  --corpo:"Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;

  --gut:clamp(20px, 5.7vw, 82px);
  --topo-h:clamp(76px, 9.3vw, 134px);
  --raio:12px;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }
body{
  margin:0; background:var(--fundo); color:var(--tinta);
  font:400 1rem/1.5 var(--corpo);
  padding-top:var(--topo-h);
  -webkit-font-smoothing:antialiased;
}
img,svg{ display:block; max-width:100%; }
img{ height:auto; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,p,ul,figure{ margin:0; }
ul{ padding:0; list-style:none; }
:focus-visible{ outline:2px solid var(--ouro); outline-offset:3px; }
.screen-reader-text{
  border:0; clip-path:inset(50%); height:1px; width:1px;
  margin:-1px; overflow:hidden; padding:0; position:absolute; white-space:nowrap;
}
.screen-reader-text:focus{
  clip-path:none; height:auto; width:auto; z-index:200; left:0; top:0;
  background:var(--tinta); color:var(--branco); padding:.75rem 1.25rem; font-weight:600;
}
[id]{ scroll-margin-top:var(--topo-h); }

/* ---------- botões ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  min-height:64px; padding:.6em 1.6em; min-width:min(100%, 306px);
  /* cheio desde 26/10/2026 (pedido do Alex): o que era o hover virou o normal,
     e o hover passou para o dourado */
  border:2px solid var(--tinta); color:var(--branco); background:var(--tinta);
  font:400 clamp(1rem, 1.35vw, 1.2rem)/1.1 var(--display); text-transform:uppercase; letter-spacing:-.01em;
  transition:background .25s, color .25s, border-color .25s;
}
.btn:hover, .btn:focus-visible{ background:var(--ouro); border-color:var(--ouro); color:var(--branco); }
/* .btn--cheio (os dourados do layout: dermatologia e "Iniciar atendimento")
   ficou igual aos outros em 26/10/2026 — escuro parado, dourado no hover —
   a pedido do Alex: estavam ao contrário. A classe segue no HTML, sem efeito. */

/* ---------- tela de carregamento ---------- */
.carregando{ display:none; }
.js .carregando{
  position:fixed; inset:0; z-index:300;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1.6rem;
  background:var(--topo-bg) url("assets/img/sombra-folhas.webp") center/cover no-repeat;
  transition:opacity .6s ease, visibility .6s;
}
.carregando__logo{ width:clamp(130px, 16vw, 230px); }
.carregando__barra{ width:min(576px, 70vw); height:6px; background:rgba(255,255,255,.25); overflow:hidden; }
.carregando__barra span{
  display:block; height:100%; width:100%;
  background:linear-gradient(90deg, #b48a4a, #e6cf98 30%, #a37b3c 55%, #e6cf98 80%, #b48a4a);
  transform-origin:left; animation:carrega 1.4s ease-out forwards;
}
.carregando__texto{ font:400 1.15rem var(--display); letter-spacing:.18em; text-transform:uppercase; color:var(--branco); }
@keyframes carrega{ from{ transform:scaleX(.2); } to{ transform:scaleX(1); } }
.carregando.is-pronto{ opacity:0; visibility:hidden; }

/* ---------- topo ---------- */
.topo{
  position:fixed; inset:0 0 auto; z-index:100;
  background:var(--topo-bg); height:var(--topo-h);
  transition:height .3s, box-shadow .3s;
}
.topo.is-rolou{ --topo-h:clamp(68px, 6.5vw, 96px); box-shadow:0 6px 24px rgba(80,64,52,.12); }
/* O mesmo vão entre todos os itens, inclusive dos dois lados do logo, e o
   logo no centro exato: as duas metades (1fr) têm a mesma largura e cada uma
   encosta os itens no logo. Margens laterais iguais — com 82 px de um lado e
   20 do outro, o logo ficava 31 px fora do centro (medido em 15/10/2026). */
.topo__inner{
  --vao:clamp(1.1rem, 3.3vw, 3.4rem);
  height:100%; padding:0 var(--gut);
  display:grid; grid-template-columns:minmax(0, 1fr) auto minmax(0, 1fr); align-items:center; column-gap:var(--vao);
}
.topo__nav{ display:flex; align-items:center; gap:var(--vao); }
.topo__nav--esq{ justify-content:flex-end; }
.topo__nav a{
  font:400 clamp(.95rem, 1.4vw, 1.3rem)/1 var(--display); text-transform:uppercase; letter-spacing:-.01em;
  color:var(--branco); transition:color .2s; white-space:nowrap;
}
.topo__nav a:hover{ color:var(--tinta); }
.topo__marca img{ height:calc(var(--topo-h) * .74); width:auto; transition:height .3s; }
.topo__dir{ display:flex; align-items:center; justify-content:flex-start; gap:var(--vao); }
.topo__cta{ flex-shrink:0; min-height:0; height:calc(var(--topo-h) * .48); min-width:0; padding-inline:1.1em; white-space:nowrap; }
.topo__menu{ display:none; }
.menu-celular{ display:none; }

/* ---------- telas (seções) ---------- */
.tela{
  position:relative; isolation:isolate; overflow:hidden;
  min-height:calc(100svh - var(--topo-h));
  display:flex; align-items:center;
  padding:clamp(3.5rem, 6vw, 5.5rem) var(--gut);
}
.tela > *{ width:100%; }
.tela--fundo{ background:#e7dfd4 url("assets/img/fundo.webp") center/cover no-repeat; }
.tela--arco{ background:#ece3d6 url("assets/img/fundo-arco.webp") center/cover no-repeat; }
.tela--arco::before{ /* o creme claro por trás das seis etapas, como no layout */
  content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(100deg, rgba(240,233,216,0) 42%, rgba(240,233,216,.78) 62%, rgba(241,235,219,.92) 100%);
}
.tela--liftera{ background:#d9cdbd url("assets/img/fundo-liftera.webp") center/cover no-repeat; }
.tela--marca::before{ /* o RF grande e claro atrás do conteúdo */
  content:""; position:absolute; z-index:-1; left:50%; top:52%;
  width:min(46vw, 640px); aspect-ratio:411/451; transform:translate(-50%,-50%);
  background:url("assets/img/logo-rf-branco.svg") center/contain no-repeat; opacity:.16;
}

/* foto de fundo inteira, texto à esquerda */
.tela--foto{ background:#e5dbcf; }
.tela__foto{
  position:absolute; inset:0; z-index:-2; width:100%; height:100%;
  object-fit:cover; object-position:right center;
}
.tela--foto::after{ /* garante a leitura sobre a parede clara, sem apagar a foto */
  content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(90deg, rgba(236,226,214,.55) 0%, rgba(236,226,214,.3) 38%, rgba(236,226,214,0) 52%);
}
.tela--foto .tela__texto{ max-width:640px; }
/* tela mais alta que o 16:9 do layout: a foto corta pelos lados e o prédio
   chega no texto — o claro da esquerda vai mais longe */
@media (max-aspect-ratio:16/10) and (min-width:901px){
  .tela--foto::after{ background:linear-gradient(90deg, rgba(236,226,214,.93) 0%, rgba(236,226,214,.82) 40%, rgba(236,226,214,0) 60%); }
  .tela--foto .tela__texto{ max-width:min(640px, 46vw); }
}

.tela__duas{
  display:grid; grid-template-columns:minmax(0, 560px) minmax(0, 640px);
  justify-content:space-between; align-items:center; gap:clamp(2rem, 6vw, 6rem);
}
.tela__cheia{ max-width:1280px; margin-inline:auto; }
/* página só com o título (saúde capilar, de exemplo): título no alto, onde
   ficam os das outras páginas, e não no meio da tela */
.tela.tela--so-titulo{ align-items:flex-start; min-height:calc(100svh - var(--topo-h)); } /* também no celular, onde .tela não tem altura */

/* ---------- tipografia ---------- */
.sobre{
  display:flex; align-items:flex-start; gap:15px; margin:0 0 clamp(2rem, 4.5vw, 4rem) -8px;
  font:500 clamp(.66rem, .8vw, .72rem)/1.4 var(--corpo); text-transform:uppercase; letter-spacing:.1em;
}
.sobre::before{ content:""; flex:0 0 35px; height:3px; margin-top:.5em; background:var(--ouro); }
.titulo{
  font:400 clamp(2.35rem, 4.45vw, 4rem)/.97 var(--display);
  text-transform:uppercase; letter-spacing:-.045em; color:var(--tinta);
  text-wrap:balance;
}
.titulo em{ font-family:var(--italico); font-style:italic; text-transform:none; color:var(--ouro); letter-spacing:-.03em; }
.dourado{ color:var(--ouro); }
.titulo--secao{ margin-bottom:clamp(2rem, 4vw, 3.5rem); }
/* o espaço entre a palavra e o itálico sumia com o letter-spacing negativo
   ("PSIQUIATRIA Adulto…", "SAÚDE Capilar") — afastado em 26/10/2026 */
.titulo--secao em{ font-size:1.18em; margin-left:.22em; }
#estetico .titulo--secao em{ display:block; font-size:.78em; margin-top:.15em; margin-left:0; }
.titulo--frase{ text-transform:none; font-size:clamp(2.6rem, 5vw, 4.5rem); line-height:1.05; letter-spacing:-.04em; }
.titulo--menor{ font-size:clamp(2rem, 3.35vw, 3rem); line-height:1.08; }
.titulo--menor em{ font-size:1.12em; }
.titulo--boas-vindas{ text-transform:none; line-height:1; }
.titulo--boas-vindas span{ display:block; font-size:clamp(1.8rem, 3vw, 2.75rem); text-transform:uppercase; color:var(--ouro); letter-spacing:-.03em; margin-bottom:.2em; }
.titulo--boas-vindas em{ display:block; font-size:clamp(3.6rem, 7.2vw, 6.5rem); color:var(--tinta); letter-spacing:-.02em; line-height:1.05; }
.traco{ width:133px; height:3px; margin:clamp(1.6rem, 3vw, 2.4rem) 0; border:0; background:var(--ouro); }
.texto{
  font-size:clamp(1rem, 1.3vw, 1.18rem); line-height:1.45; letter-spacing:.01em;
  text-align:justify; hyphens:none; /* sem hifenização (pedido do Alex, 26/10/2026) */ margin-bottom:clamp(2rem, 3.4vw, 2.6rem); max-width:560px;
}
.texto strong{ font-weight:700; }
.texto--italico{ font:italic 400 clamp(1.25rem, 2vw, 1.8rem)/1.3 var(--italico); text-align:left; letter-spacing:0; }

/* ---------- cards com foto ---------- */
.card{
  display:flex; flex-direction:column; height:100%;
  border-radius:var(--raio); overflow:hidden; background:var(--creme);
  box-shadow:0 10px 30px -18px rgba(80,64,52,.45);
  transition:transform .3s, box-shadow .3s;
}
.card img{ width:100%; aspect-ratio:232/146; object-fit:cover; filter:grayscale(1); transition:filter .4s, transform .6s; }
.card:hover{ transform:translateY(-3px); box-shadow:0 16px 34px -18px rgba(80,64,52,.55); }
/* em cinza como no layout; a cor (fotos coloridas, 15/10/2026) aparece ao
   passar o mouse, no foco do teclado e no toque do celular */
.card:hover img, .card:focus-visible img, .card:active img{ filter:none; transform:scale(1.04); }
.card__rodape{
  flex:1; display:flex; align-items:center; gap:.9rem; position:relative; z-index:1; background:var(--creme);
  padding:.75rem 1rem .75rem 1.1rem; min-height:48px;
}
.card__nome{ flex:1; font:500 .75rem/1.15 var(--corpo); text-transform:uppercase; letter-spacing:.1em; }
.card__seta{ flex:0 0 18px; width:18px; height:18px; color:var(--ouro); transition:transform .25s; }
.card:hover .card__seta{ transform:translateX(4px); }

/* flex em vez de grid: com cards a menos (26/10/2026: 9 clínicos, 6
   cirúrgicos) a última linha fica centralizada, sem buraco à direita.
   --col = cards por linha; a largura desconta os vãos. */
.cards{
  --col:5; --gx:clamp(1rem, 1.75vw, 1.6rem);
  display:flex; flex-wrap:wrap; justify-content:center; gap:clamp(1.2rem, 3.2vw, 2.9rem) var(--gx);
}
.cards > li{ flex:0 0 calc((100% - (var(--col) - 1) * var(--gx)) / var(--col)); min-width:0; }
.cards--5{ --col:5; }
.cards--4{ --col:4; }
.cards--4 .card img{ aspect-ratio:292/194; }

/* especialidades: foto colorida, maior, com ícone */
.especialidades{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:clamp(1rem, 1.9vw, 1.75rem) clamp(1rem, 1.4vw, 1.25rem); }
.card--esp img{ aspect-ratio:310/196; filter:none; }
.card--esp .card__rodape{ padding:1rem 1.1rem 1rem 1.6rem; min-height:65px; color:var(--ouro); }
.card__ic{ flex:0 0 46px; width:46px; height:38px; color:var(--ouro); }
.card--esp .card__nome{ font-weight:400; font-size:clamp(.7rem, 1vw, .9rem); letter-spacing:.14em; padding-left:1rem; border-left:1px solid var(--ouro); line-height:1.1; }

/* ---------- estético avançado: os "chips" ---------- */
.grupos{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem, 3vw, 2.6rem) clamp(2rem, 3vw, 2.9rem); }
.grupo{ --cor:var(--ouro); }
.grupo--escuro{ --cor:var(--tinta); grid-row:span 2; }
.grupo__nome{
  display:flex; align-items:center; gap:7px; margin-bottom:1.6rem;
  font:700 clamp(.95rem, 1.3vw, 1.15rem)/1 var(--corpo); text-transform:uppercase; letter-spacing:.1em;
}
.grupo__nome::before{ content:""; width:9px; height:22px; background:var(--ouro); }
.chips{ display:grid; grid-template-columns:1fr 1fr; gap:14px 18px; padding-left:14px; }
.chips__largo{ grid-column:1 / -1; }
.chip{
  display:flex; align-items:center; justify-content:center; text-align:center; height:100%;
  min-height:46px; padding:.45rem 1rem; border:2px solid var(--cor); border-radius:var(--raio);
  font:700 clamp(.66rem, .9vw, .8rem)/1.15 var(--corpo); text-transform:uppercase; letter-spacing:.1em;
  transition:background .2s, color .2s;
}
.chip:hover{ background:var(--cor); color:var(--branco); }

/* ---------- Liftera ---------- */
.liftera__foto{ position:relative; justify-self:center; width:min(100%, 470px, calc((100svh - var(--topo-h) - 7rem) * 471 / 707)); min-width:min(100%, 300px); }
.liftera__foto img{ width:100%; aspect-ratio:471/707; object-fit:cover; border-radius:24px; border:2px solid #efe6d7; }
.liftera__play{
  position:absolute; left:50%; top:52%; transform:translate(-50%,-50%);
  width:92px; height:92px; padding:0; border:0; background:none; color:#f6f1ea; cursor:pointer;
  filter:drop-shadow(0 4px 14px rgba(0,0,0,.35)); transition:transform .25s;
}
.liftera__play svg{ width:100%; height:100%; }
.liftera__play:hover{ transform:translate(-50%,-50%) scale(1.08); }

/* ---------- dermatologia: as seis etapas ---------- */
.etapas{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem, 3.6vw, 3rem) clamp(1.5rem, 2.5vw, 2.25rem); }
.etapas li{ display:grid; grid-template-columns:56px 1fr; column-gap:10px; align-items:start; }
.etapas__ic{ grid-row:span 2; width:56px; height:56px; color:var(--tinta); }
.etapas h3{ font:700 clamp(.8rem, 1.05vw, .95rem)/1.1 var(--corpo); text-transform:uppercase; letter-spacing:.1em; color:var(--ouro); margin:.4rem 0 .9rem; }
.etapas p{ font-size:clamp(.92rem, 1.2vw, 1.05rem); line-height:1.4; }

/* ---------- rodapé ---------- */
.rodape{ position:relative; background:var(--ouro); color:var(--branco); }
/* a foto inteira (1440 × 700 no layout): a faixa só encosta na mesa, abaixo das mãos */
.rodape__foto{ width:100%; height:clamp(340px, 48.6vw, 760px); object-fit:cover; object-position:center top; }
.rodape__faixa{
  position:relative; margin-top:-60px; padding:clamp(3rem, 5vw, 4.5rem) var(--gut) 1.5rem;
  background:var(--ouro); border-radius:60px 60px 0 0;
}
.rodape__grade{
  display:grid; grid-template-columns:1fr 1.3fr 1fr 1fr; gap:2rem; align-items:start;
  max-width:1260px; margin-inline:auto; padding-left:clamp(0px, 6vw, 85px);
}
.rodape__logo{ width:clamp(80px, 7.2vw, 104px); }
.rodape__col h2{ font:italic 400 clamp(1.6rem, 2.3vw, 2.1rem)/1.2 var(--italico); margin-bottom:1rem; }
.rodape__col p{ font-size:.92rem; line-height:1.45; text-transform:uppercase; letter-spacing:.01em; }
.rodape__col a:hover{ text-decoration:underline; text-underline-offset:3px; }
.rodape__insta{ display:inline-flex; align-items:center; gap:14px; font-size:.92rem; text-transform:uppercase; }
.rodape__insta svg{ flex:0 0 48px; width:48px; height:48px; color:#f1ebe2; }
/* os perfis dos médicos embaixo do da clínica, alinhados com o texto dele
   (48 px do ícone + 14 de vão) — pedido do Alex, 26/10/2026 */
.rodape__redes{ display:flex; flex-direction:column; align-items:flex-start; gap:.7rem; }
.rodape__insta--medico{ padding-left:62px; }
.rodape__base{
  display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end; gap:1rem 2rem;
  max-width:1260px; margin:3rem auto 0; padding-top:1.25rem; border-top:1px solid rgba(255,255,255,.3);
  font-size:.78rem; line-height:1.6; color:rgba(255,255,255,.88);
}
.rodape__base a{ text-decoration:underline; text-underline-offset:3px; }

/* ---------- WhatsApp flutuante ---------- */
.wpp-float{
  position:fixed; right:clamp(14px, 2vw, 26px); bottom:clamp(14px, 2vw, 26px); z-index:90;
  width:58px; height:58px; border-radius:50%; display:grid; place-items:center;
  background:#25d366; color:#fff; box-shadow:0 8px 24px rgba(0,0,0,.22); transition:transform .2s;
}
.wpp-float:hover{ transform:scale(1.07); }

/* ---------- vídeo do Liftera ---------- */
.video-modal{ width:min(92vw, 420px); padding:0; border:0; background:transparent; overflow:visible; }
.video-modal::backdrop{ background:rgba(40,32,28,.82); }
.video-modal__quadro{ position:relative; aspect-ratio:9/16; max-height:86vh; background:#000; border-radius:16px; overflow:hidden; }
.video-modal__quadro iframe, .video-modal__quadro video{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.video-modal--largo{ width:min(92vw, 1100px); }
.video-modal--largo .video-modal__quadro{ aspect-ratio:16/9; }
.video-modal__fechar{
  position:absolute; top:-48px; right:0; width:40px; height:40px; border:0; border-radius:50%;
  background:rgba(255,255,255,.15); color:#fff; cursor:pointer; display:grid; place-items:center;
}

/* =========================================================
   TABLET
   ========================================================= */
@media (max-width:1180px){
  .cards--5{ --col:3; }
  .tela__duas{ grid-template-columns:minmax(0, 1fr) minmax(0, 1fr); }
}

/* =========================================================
   TOPO COM MENU DE CELULAR
   Até 1120 px os sete itens não cabem com o mesmo vão entre eles (em 960 o
   botão saía da tela, medido em 15/10/2026): entra o menu do celular.
   ========================================================= */
@media (max-width:1120px){
  .topo__inner{ grid-template-columns:auto 1fr auto; padding:0 var(--gut); }
  .topo__nav, .topo__dir{ display:none; }
  .topo__marca{ grid-column:1; }
  .topo__marca img{ height:calc(var(--topo-h) * .72); }
  .topo__menu{
    grid-column:3; display:grid; place-content:center; gap:7px;
    width:46px; height:46px; padding:0; border:0; background:none; cursor:pointer;
  }
  .topo__menu span{ display:block; width:28px; height:2px; background:var(--tinta); transition:transform .25s; }
  .topo.is-aberto .topo__menu span:first-child{ transform:translateY(4.5px) rotate(45deg); }
  .topo.is-aberto .topo__menu span:last-child{ transform:translateY(-4.5px) rotate(-45deg); }
  .menu-celular{
    display:flex; flex-direction:column; gap:.25rem;
    position:absolute; inset:var(--topo-h) 0 auto; background:var(--topo-bg);
    padding:1rem var(--gut) 1.75rem; box-shadow:0 14px 24px rgba(80,64,52,.15);
  }
  .menu-celular[hidden]{ display:none; }
  .menu-celular a:not(.btn){ padding:.8rem 0; font:400 1.35rem/1 var(--display); text-transform:uppercase; color:var(--tinta); border-bottom:1px solid rgba(109,98,98,.15); }
  .menu-celular .btn{ margin-top:1.25rem; }
}

/* =========================================================
   CELULAR E TABLET EM PÉ
   ========================================================= */
@media (max-width:900px){
  :root{ --topo-h:76px; }
  .topo.is-rolou{ --topo-h:64px; }
  .tela{ min-height:0; }
  .tela__duas, .grupos{ grid-template-columns:minmax(0, 1fr); }
  /* o arco das fotos de fundo cortaria o texto na coluna única */
  .tela--arco, .tela--liftera{ background-image:none; background-color:var(--fundo); }
  .tela--arco::before{ display:none; }
  .grupo--escuro{ grid-row:auto; }

  /* foto em cima, texto embaixo */
  .tela--foto{ flex-direction:column; align-items:stretch; padding:0; background:var(--fundo); }
  .tela--foto::after{ display:none; }
  .tela__foto{ position:static; height:min(62vw, 420px); object-position:78% center; }
  .tela--foto .tela__texto{ max-width:none; padding:2.75rem var(--gut) 3.5rem; }

  .texto{ text-align:left; }
  .especialidades{ gap:.9rem; }
  .card--esp .card__rodape{ padding:.8rem; gap:.6rem; }
  .card__ic{ flex-basis:32px; width:32px; height:28px; }
  .card--esp .card__nome{ padding-left:.6rem; }
  .cards--5, .cards--4{ --col:2; --gx:1rem; gap:1rem; }
  .liftera__foto{ width:min(100%, 380px); }
  .rodape__grade{ grid-template-columns:1fr 1fr; padding-left:0; }
  .rodape__logo{ grid-column:1 / -1; }
}

@media (max-width:560px){
  .chips{ grid-template-columns:1fr; padding-left:0; }
  .etapas{ grid-template-columns:1fr; }
  .btn{ width:100%; }
  .especialidades .card__seta{ display:none; }
  .card__rodape{ padding:.7rem .75rem; gap:.5rem; }
  .card__nome{ font-size:.66rem; letter-spacing:.06em; }
  .rodape__faixa{ border-radius:36px 36px 0 0; margin-top:-36px; }
  .rodape__grade{ grid-template-columns:1fr; }
  .rodape__base{ flex-direction:column; align-items:flex-start; }
}


/* =========================================================
   AJUSTES DO WORDPRESS
   ========================================================= */

/* barra de administração fixa não pode cobrir o topo do site */
.admin-bar .topo{ top:32px; }
.admin-bar .menu-celular{ top:calc(var(--topo-h)); }
@media screen and (max-width:782px){ .admin-bar .topo{ top:46px; } }

/* páginas internas (política de privacidade, 404) */
.pagina{ padding:clamp(4rem, 8vw, 7rem) var(--gut); background:var(--fundo); color:var(--tinta); min-height:60vh; }
.pagina__inner{ width:min(100%, 760px); margin-inline:auto; }
.pagina h1{ font:400 clamp(2.2rem, 4vw, 3.4rem)/1.05 var(--display); text-transform:uppercase; letter-spacing:-.04em; margin-bottom:1.75rem; text-wrap:balance; }
.pagina h2{ font:400 1.6rem/1.2 var(--display); margin:2.5rem 0 .85rem; }
.pagina p, .pagina li{ margin-bottom:1rem; line-height:1.6; }
.pagina ul{ list-style:disc; padding-left:1.25rem; margin-bottom:1.5rem; }
.pagina a:not(.btn){ color:var(--ouro); text-decoration:underline; text-underline-offset:3px; }
.pagina .btn{ margin-top:1.5rem; }

/* alinhamentos do editor de blocos */
.pagina img{ border-radius:var(--raio); }
.alignleft{ float:left; margin:.4rem 1.5rem 1rem 0; }
.alignright{ float:right; margin:.4rem 0 1rem 1.5rem; }
.aligncenter{ margin-inline:auto; }
.wp-caption-text{ font-size:.85rem; }

/* aviso para o administrador quando faltam dados de contato */
.aviso-admin{ max-width:1260px; margin:2rem auto 0; padding:.9rem 1.1rem; border:1px dashed rgba(255,255,255,.7); border-radius:6px; font-size:.88rem; color:#fff; }