/* Modèle Estética Avançada | modeleestetica.com.br em HTML puro (07/10/2026)
   Cores, fontes e medidas tiradas do tema Avada 7.0 que estava no ar (estilos computados no navegador).
   Ícones: Font Awesome Free 5.15.4 (CC BY 4.0, fontawesome.com), embutidos como SVG. */

@font-face { font-family: "Source Sans Pro"; font-style: normal; font-weight: 300; font-display: swap; src: url(../fonts/source-sans-300.woff2) format("woff2"); }
@font-face { font-family: "Source Sans Pro"; font-style: italic; font-weight: 300; font-display: swap; src: url(../fonts/source-sans-300i.woff2) format("woff2"); }
@font-face { font-family: "Source Sans Pro"; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/source-sans-400.woff2) format("woff2"); }
@font-face { font-family: "Source Sans Pro"; font-style: normal; font-weight: 600; font-display: swap; src: url(../fonts/source-sans-600.woff2) format("woff2"); }
@font-face { font-family: "Source Sans Pro"; font-style: italic; font-weight: 600; font-display: swap; src: url(../fonts/source-sans-600i.woff2) format("woff2"); }
@font-face { font-family: "Source Sans Pro"; font-style: normal; font-weight: 700; font-display: swap; src: url(../fonts/source-sans-700.woff2) format("woff2"); }
@font-face { font-family: "Source Sans Pro"; font-style: italic; font-weight: 700; font-display: swap; src: url(../fonts/source-sans-700i.woff2) format("woff2"); }
@font-face { font-family: "Roboto"; font-style: normal; font-weight: 100 900; font-display: swap; src: url(../fonts/roboto.woff2) format("woff2"); }
@font-face { font-family: "Alef"; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/alef-400.woff2) format("woff2"); }

:root {
  color-scheme: only light;
  --texto: #7f8795;
  --titulo: #515b69;
  --link: #72849c;
  --destaque: #00add4;
  --azul: #35baf2;
  --rosa: #e64c8c;
  --rosa-escuro: #cf0055;
  --borda: #e5e5e5;
  --cinza-barra: #f4f6f8;
  --cinza-rodape: #ecf0f5;
  --largura: 1170px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; background: #fff; color: var(--texto); font: 300 22px/1.68 "Source Sans Pro", Arial, Helvetica, sans-serif; overflow-x: hidden; }
img, video, svg { max-width: 100%; }
img { height: auto; }
a { color: var(--link); text-decoration: none; transition: color .2s; }
a:hover { color: var(--destaque); }
p { margin: 0 0 20px; }
strong, b { font-weight: 700; }
h1, h2, h3, h4, h5, h6 { color: var(--titulo); font-weight: 300; letter-spacing: 0; }
h1, .h1 { font-size: 50px; line-height: 1.16; margin: 5px 0 17.5px; }
h2, .h2 { font-size: 40px; line-height: 1.2; margin: 0 0 20px; }
h3, .h3 { font-size: 32px; line-height: 1.25; margin: 12.8px 0 11.2px; }
h4, .h4 { font-size: 28px; line-height: 1.29; margin: 8.4px 0 20.44px; }
h5, .h5 { font-size: 22px; line-height: 1.36; margin: 30.14px 0; }
h6, .h6 { font-size: 18px; line-height: 1.44; margin: 0 0 15px; }
ul, ol { margin: 0 0 20px; padding-left: 40px; }
blockquote { margin: 0 0 20px; padding-left: 20px; border-left: 3px solid var(--borda); }
.ic { width: 1em; height: 1em; fill: currentColor; vertical-align: -.125em; }
.visualmente-oculto { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.pular { position: absolute; left: -9999px; top: 0; z-index: 10000; background: #fff; padding: 10px 16px; font-size: 16px; }
.pular:focus { left: 10px; }

/* ---------------------------------------------------------------- topo */
.barra-topo { border-top: 3px solid var(--destaque); border-bottom: 1px solid var(--borda); background: #fff; font-size: 14px; color: #747474; padding: 0 30px; }
.barra-topo-in { display: flex; justify-content: space-between; align-items: center; min-height: 44px; padding: 0 25.5px; }
.barra-topo p { margin: 0; line-height: 44px; }
.barra-topo a { color: #747474; }
.barra-redes { display: flex; gap: 18px; }
.barra-redes a { color: #bebdbd; font-size: 15px; display: inline-flex; }
.barra-redes a:hover { color: var(--destaque); }
.cabecalho { background: #fff; border-bottom: 1px solid var(--borda); padding: 0 30px; position: relative; z-index: 100; }
.cabecalho-in { display: flex; justify-content: space-between; align-items: center; min-height: 90px; padding: 0 25.5px; }
.logo { display: block; margin: 5px 0; line-height: 0; }
.logo img { width: 235px; height: 80px; }
.menu-botao { display: none; }
.menu-lista { list-style: none; margin: 0; padding: 0; display: flex; gap: 34px; }
.menu-lista > li > a, .menu-lista > li > .sub-botao { display: flex; align-items: center; height: 89px; border-top: 2px solid transparent; font: 600 15px/1 "Source Sans Pro", Arial, sans-serif; color: var(--titulo); background: none; border-left: 0; border-right: 0; border-bottom: 0; padding: 0; cursor: pointer; }
.menu-lista > li > a:hover, .menu-lista > li > .sub-botao:hover, .menu-lista > li:focus-within > .sub-botao { color: var(--destaque); }
.menu-lista > li.ativo > a, .menu-lista > li.ativo > .sub-botao { color: var(--destaque); border-top-color: var(--destaque); }
.tem-sub { position: relative; }
.sub { list-style: none; margin: 0; padding: 0; position: absolute; top: 100%; left: 0; width: 200px; background: #fff; border-top: 3px solid var(--destaque); box-shadow: 0 6px 12px rgba(0, 0, 0, .1); visibility: hidden; opacity: 0; transition: opacity .2s, visibility .2s; z-index: 200; }
.sub a { display: block; padding: 16px 20px; font: 300 15px/1.68 "Source Sans Pro", Arial, sans-serif; color: var(--titulo); border-bottom: 1px solid #dbe2ea; }
.sub a:hover, .sub a[aria-current] { background: #f9f9fb; color: var(--destaque); }
.tem-sub:hover > .sub, .tem-sub:focus-within > .sub, .tem-sub.aberto > .sub { visibility: visible; opacity: 1; }
.tem-sub.mega { position: static; }
.mega > .sub { left: 50%; transform: translateX(-50%); width: min(var(--largura), 100vw); display: grid; grid-template-columns: repeat(6, 1fr); padding: 10px 0; }
.mega > .sub a { border-bottom: 0; padding: 12px 20px; }

/* ---------------------------------------------------------------- barra de título (páginas no modelo padrão do Avada) */
.barra-titulo { background: var(--cinza-barra); min-height: 75px; display: flex; align-items: center; justify-content: center; padding: 0 30px; }
.migalhas { font-size: 13px; line-height: 1.68; margin: 0; text-align: center; }
.migalhas a { color: var(--texto); }
.migalhas span[aria-hidden] { padding: 0 6px; }

/* ---------------------------------------------------------------- conteúdo (faixas e colunas do Fusion Builder) */
main { overflow-x: clip; }
main.padrao { padding: 60px 30px 30px; }
main.padrao-sem-barra { padding: 0 30px 30px; }
main.padrao .faixa, main.padrao-sem-barra .faixa { max-width: var(--largura); margin-left: auto; margin-right: auto; padding-left: 0 !important; padding-right: 0 !important; }
.faixa { position: relative; padding-left: 30px; padding-right: 30px; background-size: cover; background-position: center; }
.faixa[style*="--fundo-img"] { background-image: var(--fundo-img); }
.faixa-in { max-width: var(--largura); margin: 0 auto; }
.faixa.larga .faixa-in { max-width: none; }
.linha { display: flex; flex-wrap: wrap; align-items: flex-start; }
.faixa.iguais .linha { align-items: stretch; }
.col { width: var(--w, 100%); margin-right: var(--mr, 0); min-width: 0; position: relative; }
.col[style*="--fundo-img"] { background-image: var(--fundo-img); background-size: cover; }
.col.centro { display: flex; flex-direction: column; justify-content: center; }
.texto { margin: 0; }  /* como o fusion-text do Avada: só os parágrafos e títulos têm margem */
.texto img { display: inline-block; }
.texto ul li, .texto ol li { margin-bottom: 0; }
.ancora { position: relative; top: -20px; display: block; }
.espaco { display: block; }
.img { margin: 0; line-height: 0; }
.img.c { text-align: center; }
.img.d { text-align: right; }
.img img { display: inline-block; }
.sep { width: 100%; border-top: var(--sep-esp, 1px) solid var(--sep-cor, #e0dede); margin-left: auto; margin-right: auto; }
.botao-linha { margin: 0; line-height: 1; }
.botao-linha.c { text-align: center; }
.botao-linha.d { text-align: right; }
.botao { display: inline-block; padding: 17px 40px; font: 600 18px/21px "Source Sans Pro", Arial, sans-serif; color: var(--b-cor, #fff); background: var(--b-fundo, var(--rosa));
  border: var(--b-borda-l, 0) solid var(--b-borda, transparent); border-radius: var(--b-raio, 2px); transition: color .2s, background .2s, border-color .2s; text-align: center; }
.botao:hover, .botao:focus { color: var(--b-cor-h, var(--b-cor, #fff)); background: var(--b-fundo-h, var(--b-fundo, var(--rosa))); border-color: var(--b-cor-h, var(--b-borda, transparent)); }
.botao .ic { margin-right: 6px; }

/* home: o conteúdo do Avada ficava dentro de uma seção "boxed" do Elementor; as 4 caixas do topo apareciam em 2 colunas */
main.home > .faixa { max-width: 1180px; margin-left: auto; margin-right: auto; }
main.home .caixas.lado { --cols: 2 !important; }

/* caixas de conteúdo (content boxes do Avada) */
.caixas { display: grid; grid-template-columns: repeat(var(--cols, 1), minmax(0, 1fr)); column-gap: 30px; row-gap: 40px; margin-bottom: 40px; }
.caixa-tit { color: var(--tit-cor, var(--titulo)); font-size: 32px; line-height: 1.16; font-weight: 300; margin: 0; }
.caixa-txt > :last-child { margin-bottom: 0; }
.caixa-link { color: inherit; }
.caixa-img { line-height: 0; flex: none; }
.caixa-ic { display: inline-flex; align-items: center; justify-content: center; color: var(--ic-cor, #fff); font-size: var(--ic-fs, 24px); flex: none; line-height: 1; }
.caixa-ic.circulo { border: var(--ic-borda, 0 solid transparent); background: var(--ic-fundo2, transparent); border-radius: var(--ic-raio, 50%); }
.ic-dentro { display: flex; align-items: center; justify-content: center; width: var(--ic-tam, 48px); height: var(--ic-tam, 48px); box-sizing: content-box; border: var(--ic-anel, 0 solid transparent); background: var(--ic-fundo, transparent); border-radius: var(--ic-raio, 50%); }
.caixas.lado .caixa { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 20px; align-items: start; }
.caixas.lado .caixa-cab, .caixas.lado .caixa-link { display: contents; }
.caixas.lado .caixa-ic, .caixas.lado .caixa-img { grid-column: 1; grid-row: 1 / span 2; }
.caixas.lado .caixa-tit, .caixas.lado .caixa-txt { grid-column: 2; }
.caixas.titulo .caixa-cab, .caixas.titulo .caixa-link { display: flex; align-items: center; gap: 22px; }
.caixas.titulo .caixa-cab { margin-bottom: 19px; }
.caixas.titulo .caixa-txt { margin-top: -4px; }
.caixas.topo .caixa { text-align: center; }
.caixas.topo .caixa-cab, .caixas.topo .caixa-link { display: flex; flex-direction: column; align-items: center; gap: 15px; }
.caixas.topo .caixa-txt { margin-top: 15px; }

/* banner do Revolution Slider (cursos): grade de 1200 x 500 como no plugin */
.rev { position: relative; container-type: inline-size; aspect-ratio: 1200 / 500; background: #fff left center / cover no-repeat; overflow: hidden; margin: 0 -30px; }
.rev-camada { position: absolute; white-space: nowrap; color: var(--cor); left: calc(var(--x) * 100cqw / 1200); top: calc(var(--y) * 100cqw / 1200);
  font-size: calc(var(--fs) * 100cqw / 1200); line-height: calc(var(--lh) * 100cqw / 1200); font-weight: 400; }
.rev { background-image: var(--fundo-rev); }
@media (max-width: 800px) { .rev { background-image: var(--fundo-rev-m, var(--fundo-rev)); } }
@container (min-width: 1200px) {
  .rev-camada { left: calc(50cqw - 600px + var(--x) * 1px); top: calc(var(--y) * 1px); font-size: calc(var(--fs) * 1px); line-height: calc(var(--lh) * 1px); }
}
@media (min-width: 1200px) { .rev { aspect-ratio: auto; height: 500px; } }
@media (max-width: 480px) {
  .rev { aspect-ratio: 480 / 550; }
  .rev-camada { color: var(--corm); left: calc(var(--xm) * 100cqw / 480); top: calc(var(--ym) * 100cqw / 480); font-size: calc(var(--fsm) * 100cqw / 480); line-height: calc(var(--lhm) * 100cqw / 480); }
}

/* carrossel (imagens) */
.carrossel { position: relative; margin-bottom: 20px; }
.carrossel-lista { list-style: none; margin: 0; padding: 0; display: flex; gap: 13px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; scroll-behavior: smooth; }
.carrossel-lista::-webkit-scrollbar { display: none; }
.carrossel-lista > li { flex: 0 0 calc((100% - (var(--cols, 1) - 1) * 13px) / var(--cols, 1)); scroll-snap-align: start; line-height: 0; }
.carrossel-lista img { width: 100%; height: auto; }
.carrossel-seta { position: absolute; top: 50%; transform: translateY(-50%); width: 22px; height: 95px; border: 0; background: rgba(0, 0, 0, .25); color: #fff; cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 0; }
.carrossel-seta:hover { background: rgba(0, 0, 0, .45); }
.carrossel-seta.anterior { left: 0; }
.carrossel-seta.proxima { right: 0; }
.carrossel-seta .ic { width: 12px; height: 12px; }

/* slides da home */
.slides { position: relative; overflow: hidden; background: #b66a71; }
.slides-lista { list-style: none; margin: 0; padding: 0; display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; scroll-behavior: smooth; }
.slides-lista::-webkit-scrollbar { display: none; }
.slides-lista > li { flex: 0 0 100%; scroll-snap-align: start; }
/* Banners com texto na arte: nunca recortar. A altura segue a proporção da imagem (1600 x 584) em qualquer largura. */
.slides-lista a { display: block; aspect-ratio: 1600 / 584; }
.slides-lista img { width: 100%; height: 100%; object-fit: contain; display: block; }
.slides-seta { position: absolute; top: 50%; transform: translateY(-50%); background: none; border: 0; color: #fff; font-size: 40px; cursor: pointer; padding: 10px; line-height: 0; opacity: .9; }
.slides-seta.anterior { left: 10px; }
.slides-seta.proxima { right: 10px; }

/* vídeo do YouTube (fachada: o iframe só carrega no clique) */
.yt { position: relative; width: 100%; aspect-ratio: 16 / 9; margin: 0 auto 20px; background: #000; }
.yt.c { margin-left: auto; margin-right: auto; }
.yt-botao { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; padding: 0; cursor: pointer; background: #000; }
.yt-botao img { width: 100%; height: 100%; object-fit: cover; display: block; }
.yt-play { position: absolute; left: 50%; top: 50%; width: 68px; height: 48px; transform: translate(-50%, -50%); }
.yt iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.video-local { text-align: center; margin-bottom: 20px; line-height: 0; }
.video-local video { max-width: 100%; height: auto; background: #000; }

/* ---------------------------------------------------------------- rodapé */
.rodape { padding: 83px 30px 80px; border-top: 12px solid transparent; background: #fff; }
.rodape-in { max-width: var(--largura); margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 30px; text-align: center; }
.rodape-ic { display: inline-flex; align-items: center; justify-content: center; width: 88px; height: 88px; border-radius: 50%; border: 1px solid var(--destaque); color: var(--destaque); font-size: 44px; margin-bottom: 20px; }
.rodape h2 { font-size: 28px; line-height: 1.29; margin: 8.4px 0 20.44px; }
.rodape p { margin: 0 0 20px; }
.rodape a { color: var(--texto); }
.rodape a:hover { color: var(--destaque); }
.copyright { background: var(--cinza-rodape); padding: 35px 30px; text-align: center; }
.copyright p { font-size: 16px; line-height: 1.68; margin: 0 0 22px; }
.copyright-redes { display: flex; justify-content: center; gap: 8px; }
.copyright-redes a { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 4px; background: #bec5d1; color: #fff; font-size: 14px; }
.copyright-redes a:hover { background: var(--destaque); color: #fff; }

/* botão flutuante do WhatsApp (Click to Chat, estilo 9) */
.whatsapp-flutuante { position: fixed; right: 10px; bottom: 10px; z-index: 900; line-height: 0; }
.whatsapp-flutuante img { width: 48px; height: 48px; }

/* bloco que substituiu os formulários (Elementor) */
.form-whats { text-align: center; }
.form-whats .botao-whats { display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 100%; max-width: 424px; padding: 10px 20px; border-radius: 8px; color: #fff; background: var(--fw-cor, #25d366); font: 500 15px/1.4 Montserrat, sans-serif; }
.form-whats .botao-whats:hover { filter: brightness(.92); color: #fff; }

/* 404 */
.pagina-404 ul { columns: 2; }

/* ---------------------------------------------------------------- responsivo (pontos de quebra do Avada: 1024 e 800/640) */
@media (max-width: 1100px) {
  .menu-lista { gap: 22px; }
}
@media (max-width: 1024px) {
  .mega > .sub { grid-template-columns: repeat(4, 1fr); }
}
@media (min-width: 1025px) {
  .oculto-g { display: none !important; }
}
@media (max-width: 800px) {
  body { font-size: 18px; }
  h1, .h1 { font-size: 36px; }
  h2, .h2 { font-size: 30px; }
  h3, .h3 { font-size: 26px; }
  h4, .h4 { font-size: 23px; }
  h5, .h5 { font-size: 20px; }
  .barra-topo { padding: 0 10px; }
  .barra-topo-in { flex-direction: column; padding: 4px 0; min-height: 0; }
  .barra-topo p { line-height: 28px; }
  .cabecalho { padding: 0 15px; }
  .cabecalho-in { padding: 0; min-height: 70px; flex-wrap: wrap; }
  .logo img { width: 176px; height: 60px; }
  .menu-botao { display: inline-flex; align-items: center; gap: 8px; background: var(--rosa-escuro); color: #fff; border: 0; border-radius: 4px; padding: 10px 14px; font: 600 15px/1 "Source Sans Pro", Arial, sans-serif; cursor: pointer; }
  .menu { position: static; }
  .menu-lista { display: none; position: absolute; left: 0; right: 0; top: 100%; flex-direction: column; gap: 0; background: var(--rosa-escuro); padding: 6px 0; max-height: calc(100vh - 120px); overflow-y: auto; box-shadow: 0 8px 16px rgba(0, 0, 0, .15); }
  .menu.aberto .menu-lista { display: flex; }
  .menu-lista > li > a, .menu-lista > li > .sub-botao { height: auto; padding: 14px 20px; border-top: 0; color: #fff; width: 100%; justify-content: space-between; font-size: 16px; }
  .menu-lista > li.ativo > a, .menu-lista > li.ativo > .sub-botao, .menu-lista > li > a:hover, .menu-lista > li > .sub-botao:hover { color: #fff; text-decoration: underline; }
  .sub, .mega > .sub { position: static; visibility: visible; opacity: 1; display: none; width: auto; transform: none; box-shadow: none; border-top: 0; background: rgba(0, 0, 0, .15); padding: 0; grid-template-columns: 1fr; }
  .tem-sub:hover > .sub { display: none; }
  .tem-sub.aberto > .sub, .tem-sub.aberto:hover > .sub { display: block; }
  .sub a, .mega > .sub a { color: #fff; border-bottom: 0; padding: 11px 20px 11px 36px; font-size: 15px; }
  .sub a:hover, .sub a[aria-current] { background: rgba(0, 0, 0, .15); color: #fff; }
  .col { width: 100%; margin-right: 0; }
  .caixas { grid-template-columns: 1fr; }
  .caixa-tit { font-size: 26px !important; line-height: 1.2 !important; }
  .rodape { padding: 50px 20px; }
  .rodape-in { grid-template-columns: 1fr; gap: 40px; }
  .slides-seta { font-size: 26px; }
  .pagina-404 ul { columns: 1; }
  main.padrao { padding: 40px 20px 20px; }
  main.padrao-sem-barra { padding: 0 20px 20px; }
  .faixa { padding-left: 20px !important; padding-right: 20px !important; }
  .rev { margin: 0 -20px; }
}
@media (max-width: 640px) {
  .oculto-p { display: none !important; }
}
@media (min-width: 641px) and (max-width: 1024px) {
  .oculto-m { display: none !important; }
}
