/* =========================================================================
   DRA. ELIZETE KAFFER — theme.css
   Design system sobre Bootstrap 5. Cores e componentes via variáveis do BS.
   Só há CSS custom onde o utilitário do framework não resolve.
   ========================================================================= */

/* ---------- Fonte da marca: Muller Narrow ---------- */
@font-face{
  font-family:"Muller Narrow";
  src:url("../fonts/MullerNarrow-Light.otf") format("opentype");
  font-weight:300;font-style:normal;font-display:swap;
}
@font-face{
  font-family:"Muller Narrow";
  src:url("../fonts/MullerNarrow-LightItalic.otf") format("opentype");
  font-weight:300;font-style:italic;font-display:swap;
}
@font-face{
  font-family:"Muller Narrow";
  src:url("../fonts/MullerNarrowMedium.otf") format("opentype");
  font-weight:500;font-style:normal;font-display:swap;
}
@font-face{
  font-family:"Muller Narrow";
  src:url("../fonts/MullerNarrowMediumItalic.otf") format("opentype");
  font-weight:500;font-style:italic;font-display:swap;
}
@font-face{
  font-family:"Muller Narrow";
  src:url("../fonts/MullerNarrowExtraBold.otf") format("opentype");
  font-weight:800;font-style:normal;font-display:swap;
}
@font-face{
  font-family:"Muller Narrow";
  src:url("../fonts/MullerNarrow-ExtraBoldItalic.otf") format("opentype");
  font-weight:800;font-style:italic;font-display:swap;
}

/* ---------- Paleta da marca -> variáveis do Bootstrap ---------- */
:root{
  --bs-primary:#2a9d97;            /* teal (topbar, CTA, links, ícones)   */
  --bs-primary-rgb:42,157,151;
  --bs-secondary:#3f5350;          /* verde-acinzentado (títulos escuros) */
  --bs-secondary-rgb:63,83,80;
  --bs-light:#e5f8f8;              /* mint (fundos de seção / navbar / footer) */
  --bs-light-rgb:229,248,248;
  --bs-dark:#3a3a3a;
  --bs-dark-rgb:58,58,58;

  --bs-body-bg:#ffffff;
  --bs-body-color:#5f6b69;         /* corpo de texto */
  --bs-body-color-rgb:95,107,105;
  --bs-body-font-family:"Muller Narrow",-apple-system,"Segoe UI",Roboto,sans-serif;
  --bs-body-font-size:1.0625rem;   /* 17px, como na referência */
  --bs-body-font-weight:300;
  --bs-body-line-height:1.65;

  --bs-heading-color:#4a4a4a;
  --bs-emphasis-color:#3a3a3a;

  --bs-link-color:#2a9d97;
  --bs-link-color-rgb:42,157,151;
  --bs-link-hover-color:#1f7a75;
  --bs-link-hover-color-rgb:31,122,117;
  --bs-link-decoration:none;

  --bs-border-radius:1rem;
  --bs-border-radius-lg:1.25rem;
  --bs-border-radius-xl:1.5rem;

  /* tokens da marca reutilizados no CSS custom */
  --brand-teal-deep:#299f9a;
  --brand-mint:#e5f8f8;
  --brand-mint-2:#d8f2f0;
  --brand-soft:#ddf3f1;
}

/* ---------- Base ---------- */
body{-webkit-font-smoothing:antialiased;text-wrap:pretty;background:linear-gradient(180deg,var(--brand-mint) 0%,#f2fcfc 42%,#ffffff 100%) top/100% 680px no-repeat,#ffffff;}
a:hover{color:var(--bs-link-hover-color);}

/* cor de títulos (text-primary) e botões primários: #2FB9B3 */
.text-primary{color:#2fb9b3 !important;}

/* Links e rótulos de botão em peso Medium (500) */
a,.btn,.nav-link{font-weight:500;}

/* Largura de conteúdo do design (~1200px) — decisão única p/ todo o site */
@media (min-width:1200px){.container{max-width:1200px;}}

/* Headings finos como no design (Muller Light) */
h1,h2,h3,h4,h5,h6,
.h1,.h2,.h3,.h4,.h5,.h6,
.display-1,.display-2,.display-3,.display-4,.display-5,.display-6{
  font-weight:300;letter-spacing:.005em;line-height:1.12;text-wrap:balance;
}

/* ---------- Botões: pílula é o padrão embutido no .btn ---------- */
.btn{
  --bs-btn-border-radius:50rem;
  --bs-btn-padding-x:2.6rem;
  --bs-btn-padding-y:.55rem;
  --bs-btn-font-weight:500;
  --bs-btn-font-size:1.0625rem;
  --bs-btn-line-height:1.3;
  display:inline-flex;align-items:center;justify-content:center;gap:.6rem;
  white-space:nowrap;
}
.btn-lg{--bs-btn-padding-x:3.2rem;--bs-btn-padding-y:.62rem;--bs-btn-font-size:1.0625rem;}
.btn-primary{
  --bs-btn-bg:#2fb9b3;--bs-btn-border-color:#2fb9b3;--bs-btn-color:#fff;
  --bs-btn-hover-bg:#28a19c;--bs-btn-hover-border-color:#28a19c;--bs-btn-hover-color:#fff;
  --bs-btn-active-bg:#23918c;--bs-btn-active-border-color:#23918c;
}
.btn-outline-primary{
  --bs-btn-color:#2a9d97;--bs-btn-border-color:#8fcecb;
  --bs-btn-hover-bg:#2a9d97;--bs-btn-hover-border-color:#2a9d97;--bs-btn-hover-color:#fff;
  --bs-btn-active-bg:#1f7a75;--bs-btn-active-border-color:#1f7a75;
}
/* variante mint suave (btn-light restilizado) */
.btn-light{
  --bs-btn-bg:#ddf3f1;--bs-btn-border-color:#ddf3f1;--bs-btn-color:#2a9d97;
  --bs-btn-hover-bg:#c9ece9;--bs-btn-hover-border-color:#c9ece9;--bs-btn-hover-color:#23847f;
  --bs-btn-active-bg:#bde6e3;--bs-btn-active-border-color:#bde6e3;
}

/* ---------- Header ---------- */
.topbar{background:var(--brand-teal-deep);font-size:.9rem;}
.topbar a{color:#fff;}
.topbar .icon-circle{
  width:1.9rem;height:1.9rem;border:1.5px solid rgba(255,255,255,.85);border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;
}
.topbar-wa{font-size:1.3rem;line-height:1;color:#fff;}
.topbar-search{
  width:2.15rem;height:2.15rem;background:#fff;color:var(--brand-teal-deep);
  border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:.9rem;
  flex:0 0 auto;
}
/* campo de busca que expande ao clicar na lupa */
.topbar-search-wrap .topbar-search-field{
  width:0;padding-left:0;padding-right:0;border:0;opacity:0;
  transition:width .25s ease,opacity .2s ease,padding .25s ease;
  border-radius:50rem;
}
.topbar-search-wrap.open .topbar-search-field{
  width:12rem;opacity:1;padding-left:.9rem;padding-right:.9rem;
}
.site-nav{background:#ebfafa;}
.site-nav .nav-link{
  color:#555;text-transform:uppercase;letter-spacing:.09em;font-size:.8rem;
  padding:.5rem 2.2rem;
}
.site-nav .nav-link:hover,.site-nav .nav-link.active{color:var(--bs-primary);}
@media (min-width:992px) and (max-width:1279.98px){
  .site-nav .navbar-nav.gap-lg-5{gap:1rem !important;}
  .site-nav .nav-link{padding-left:1rem;padding-right:1rem;}
}
.brand-logo{height:58px;width:auto;}

/* Submenus (dropdown) da navbar */
.site-nav .dropdown-toggle::after{vertical-align:.15em;margin-left:.4em;border-top-color:currentColor;}
.site-nav .dropdown-menu{
  --bs-dropdown-link-active-bg:var(--bs-primary);
  --bs-dropdown-link-active-color:#fff;
  --bs-dropdown-link-hover-bg:var(--brand-mint);
  --bs-dropdown-link-hover-color:var(--bs-primary);
  --bs-dropdown-link-color:#555;
  border:0;border-radius:.9rem;padding:.6rem;margin-top:.35rem;
  box-shadow:0 18px 40px rgba(40,90,88,.14);min-width:16rem;
}
.site-nav .dropdown-item{border-radius:.5rem;padding:.5rem .9rem;font-size:.95rem;white-space:normal;}
.site-nav .dropdown-item-all{color:var(--bs-primary);font-weight:500;text-transform:uppercase;letter-spacing:.06em;font-size:.82rem;}
.site-nav .dropdown-item:active,.site-nav .dropdown-item.active{background:var(--bs-primary);color:#fff !important;}
@media (min-width:992px){
  .site-nav .dropdown:hover>.dropdown-menu{display:block;}
  .site-nav .dropdown-menu{margin-top:0;}
  .site-nav .dropdown>.dropdown-menu::before{content:"";position:absolute;top:-.6rem;left:0;right:0;height:.6rem;}
}

/* fundo do hero (gradiente mint -> branco) — não há utilitário p/ gradiente */
.bg-hero{background:transparent;}
.section-mint{background:var(--brand-mint);}

/* ---------- Chips (pílulas de destaque do hero) ---------- */
.chip{
  display:inline-block;border:1px solid #cfe6e4;border-radius:50rem;
  padding:.45rem 1.05rem;color:#6c7b79;font-size:.95rem;background:#fff;
  text-decoration:none;font-weight:500;transition:.15s;
}
.chip:hover{border-color:var(--bs-primary);color:var(--bs-primary);}

/* ---------- Cards de post (home + blog) ---------- */
.post-card{border:0;border-radius:1rem;overflow:visible;box-shadow:0 18px 40px rgba(40,90,88,.08);position:relative;}
@media (max-width:767.98px){.post-card{box-shadow:0 10px 26px rgba(40,90,88,.10);}}
/* home: dá espaço no carrossel do blog p/ a sombra não cortar */
#blogCarousel .carousel-inner{padding:8px 6px 20px;}
.post-card .post-thumb{border-radius:1rem 1rem 0 0;overflow:visible;position:relative;}
.post-card .post-thumb img{width:100%;height:100%;object-fit:cover;border-radius:1rem 1rem 0 0;}
.post-card .post-thumb.ratio > .post-arrow{
  position:absolute;top:auto;left:auto;right:1.25rem;bottom:-1.2rem;
  width:2.4rem;height:2.4rem;border-radius:50%;
  background:var(--bs-primary);color:#fff;display:inline-flex;align-items:center;justify-content:center;
  box-shadow:0 6px 14px rgba(42,157,151,.4);z-index:5;
}
.post-arrow{
  position:absolute;right:1.25rem;bottom:-1.2rem;width:2.4rem;height:2.4rem;border-radius:50%;
  background:var(--bs-primary);color:#fff;display:inline-flex;align-items:center;justify-content:center;
  box-shadow:0 6px 14px rgba(42,157,151,.4);z-index:5;
}
.post-arrow:hover{color:#fff;background:#23847f;}

/* ---------- Logos de instituições ---------- */
.logo-inst{filter:grayscale(1);opacity:.55;max-height:74px;width:auto;}

/* faixa de logos como slider animado — 5 visíveis no desktop */
.logos-track{gap:0;animation-duration:38s;}
.logo-slot{flex:0 0 auto;width:20vw;max-width:240px;display:flex;align-items:center;justify-content:center;}
.logos-track .logo-inst{flex:0 0 auto;box-shadow:none;border-radius:0;}
@media (min-width:1200px){.logo-slot{width:240px;}}
@media (max-width:768px){.logo-slot{width:40vw;}.logos-track .logo-inst{max-height:56px;}}

/* ---------- WhatsApp flutuante ---------- */
.wa-float{
  position:fixed;right:1.6rem;bottom:1.6rem;z-index:1030;
  width:3.6rem;height:3.6rem;border-radius:50%;background:#2fb9b3;color:#fff;
  display:inline-flex;align-items:center;justify-content:center;font-size:1.6rem;
  box-shadow:0 10px 24px rgba(42,157,151,.45);
}
.wa-float:hover{color:#fff;background:#23847f;}
/* pulso suave + leve balanço para chamar atenção */
.wa-float{animation:wa-pulse 2.4s ease-in-out infinite;}
.wa-float i{display:inline-block;animation:wa-wiggle 2.4s ease-in-out infinite;transform-origin:50% 55%;}
.wa-float:hover{animation-play-state:paused;}
@keyframes wa-pulse{
  0%,100%{box-shadow:0 10px 24px rgba(42,157,151,.45),0 0 0 0 rgba(42,157,151,.45);}
  50%{box-shadow:0 10px 24px rgba(42,157,151,.45),0 0 0 14px rgba(42,157,151,0);}
}
@keyframes wa-wiggle{
  0%,88%,100%{transform:rotate(0);}
  91%{transform:rotate(-12deg);}
  95%{transform:rotate(12deg);}
}
@media (prefers-reduced-motion:reduce){.wa-float,.wa-float i{animation:none;}}

/* ---------- Footer ---------- */
.site-footer{background:var(--brand-mint);}
.site-footer a{color:#555;}
.site-footer a:hover{color:var(--bs-primary);}
.site-footer .foot-nav{text-transform:uppercase;letter-spacing:.08em;font-size:.8rem;}
.social-circle{
  width:2.75rem;height:2.75rem;border:1.5px solid #bcccca;border-radius:50%;color:#4a4a4a;
  display:inline-flex;align-items:center;justify-content:center;font-size:1.1rem;
}
.social-circle:hover{background:var(--bs-primary);border-color:var(--bs-primary);color:#fff;}
.foot-contact i{color:#6b8a89;}

/* ---------- Faixa de imagens: slider auto-animado (marquee) ---------- */
.marquee{overflow:hidden;width:100%;}
.marquee-track{
  display:flex;align-items:center;gap:1.5rem;width:max-content;
  animation:marquee-rtl 55s linear infinite;
}
.marquee:hover .marquee-track{animation-play-state:paused;}
.marquee-track img{
  border-radius:.9rem;object-fit:cover;flex:0 0 auto;
  box-shadow:0 14px 30px rgba(40,90,88,.10);
}
@keyframes marquee-rtl{from{transform:translateX(-50%);}to{transform:translateX(0);}}
@media (prefers-reduced-motion:reduce){.marquee-track{animation:none;}}

/* ---------- Utilitário de imagem com cantos e sombra ---------- */
.img-soft{border-radius:1.25rem;box-shadow:0 24px 55px rgba(40,90,88,.16);object-fit:cover;}

/* ---------- Ritmo vertical de seção (além do py-5 do BS) ---------- */
.py-6{padding-top:5rem;padding-bottom:5rem;}
.py-7{padding-top:7rem;padding-bottom:7rem;}
.pt-6{padding-top:5rem;}.pb-6{padding-bottom:5rem;}
.pt-7{padding-top:7rem;}.pb-7{padding-bottom:7rem;}
@media (min-width:992px){.pt-lg-6{padding-top:5rem;}}
.pt-8{padding-top:7rem;}.pb-8{padding-bottom:7rem;}
@media (min-width:992px){.pt-lg-8{padding-top:12rem;}.pb-lg-8{padding-bottom:12rem;}}

/* mapa embed */
.map-embed iframe{width:100%;height:100%;border-radius:1.25rem;}

/* ---------- Contato: mapa full-bleed + formulário ---------- */
.contato-map iframe{width:100%;height:100%;border:0;min-height:420px;}
.contato-field{
  border:1px solid #cfe6e4;border-radius:50rem;background:#fff;padding:.9rem 1.4rem;
}
.contato-field:focus{border-color:var(--bs-primary);box-shadow:0 0 0 .2rem rgba(42,157,151,.15);}
textarea.contato-field{border-radius:1.25rem;}
.contato-maparea{border-top:1px solid #c7e0dd;border-bottom:1px solid #c7e0dd;}

/* ---------- Blog: widgets da sidebar + paginação ---------- */
.blog-widget{border:1px solid #cbe6e3;border-radius:1rem;box-shadow:none;background:transparent;}
.page-dot{
  width:2.4rem;height:2.4rem;border-radius:50%;border:1px solid #bfe0dd;color:var(--bs-primary);
  display:inline-flex;align-items:center;justify-content:center;text-decoration:none;transition:.15s;
}
.page-dot:hover,.page-dot.active{background:var(--bs-primary);border-color:var(--bs-primary);color:#fff;}

/* paginação do blog (bolinhas + setas) */
.blog-pagination .pagination{--bs-pagination-border-color:transparent;--bs-pagination-bg:transparent;gap:.5rem;}
.blog-pagination .page-link{
  border:1px solid #bfe0dd;border-radius:50% !important;color:var(--bs-primary);background:transparent;
  width:2.4rem;height:2.4rem;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;padding:0;transition:.15s;
}
.blog-pagination .page-item.active .page-link{background:var(--bs-primary);border-color:var(--bs-primary);color:#fff;}
.blog-pagination .page-link:hover{background:var(--bs-primary);border-color:var(--bs-primary);color:#fff;}
.blog-pagination .page-link-arrow{
  width:auto;border-radius:50rem !important;padding:0 1.2rem;white-space:nowrap;
}
.blog-pagination .page-link-arrow.disabled{color:#a9bfbc;border-color:#dcecea;pointer-events:none;background:transparent;}
.link-primary{color:var(--bs-primary);text-decoration:none;}
.link-primary:hover{color:#1f7a75;}
.blog-cta{background:var(--brand-mint) !important;border:0 !important;}

/* ---------- Página de erro (atalhos) ---------- */
.erro-link{background:#fff;border:1px solid #d5ebe9;border-radius:1rem;padding:1.6rem;transition:.18s;}
.erro-link:hover{border-color:var(--bs-primary);box-shadow:0 16px 34px rgba(40,90,88,.1);transform:translateY(-3px);}
.erro-link:hover h3{color:var(--bs-primary) !important;}
.erro-ico{
  display:inline-flex;align-items:center;justify-content:center;width:3rem;height:3rem;border-radius:.8rem;
  background:var(--brand-mint);color:var(--bs-primary);font-size:1.4rem;margin-bottom:1rem;
}
/* hero video: quadrado no mobile, retrato no desktop */
.hero-video{aspect-ratio:1/1;}
@media (min-width:992px){.hero-video{aspect-ratio:384/535;}}

/* ---------- Especialidades: colagem do hero ---------- */
.esp-collage{position:relative;min-height:440px;}.esp-collage img{position:absolute;border-radius:1rem;object-fit:cover;box-shadow:0 20px 45px rgba(40,90,88,.16);}
.esp-c1{width:62%;aspect-ratio:16/11;top:0;right:0;z-index:1;}
.esp-c2{width:48%;aspect-ratio:3/2;top:34%;left:0;z-index:2;}
.esp-c3{width:34%;aspect-ratio:4/3;bottom:0;right:6%;z-index:3;}
@media (max-width:991.98px){
  .esp-collage{min-height:0;display:grid;grid-template-columns:1fr 1fr;gap:1rem;}
  .esp-collage img{position:static;width:100%;box-shadow:0 12px 26px rgba(40,90,88,.14);}
  .esp-c1{grid-column:1 / -1;aspect-ratio:16/9;}
}

/* ---------- Especialidades: cards de tratamento ---------- */
.treat-card{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:1rem;transition:transform .2s;}
.treat-card:hover{transform:translateY(-4px);}
.treat-icon{height:150px;display:flex;align-items:center;justify-content:center;}
.treat-icon img{max-height:150px;width:auto;max-width:100%;}
.treat-card:hover h3{color:#1f7a75 !important;}

/* ---------- Lightbox de galeria ---------- */
.lightbox{
  position:fixed;inset:0;z-index:1080;display:none;align-items:center;justify-content:center;
  gap:1rem;padding:2rem;background:rgba(20,45,44,.9);
}
.lightbox.open{display:flex;}
.lightbox-figure{margin:0;max-width:min(1100px,90vw);max-height:86vh;display:flex;}
.lightbox-figure img{max-width:100%;max-height:86vh;width:auto;height:auto;border-radius:1rem;object-fit:contain;box-shadow:0 24px 60px rgba(0,0,0,.4);}
.lightbox-nav,.lightbox-close{
  flex:0 0 auto;border:0;border-radius:50%;background:var(--bs-primary);color:#fff;
  display:inline-flex;align-items:center;justify-content:center;cursor:pointer;
}
.lightbox-nav{width:3.2rem;height:3.2rem;font-size:1.3rem;}
.lightbox-nav:hover{background:#23847f;}
.lightbox-close{position:absolute;top:1.4rem;right:1.6rem;width:2.9rem;height:2.9rem;font-size:1.1rem;background:rgba(255,255,255,.15);}
.lightbox-close:hover{background:var(--bs-primary);}
@media (max-width:575.98px){
  .lightbox{padding:1rem;gap:.4rem;}
  .lightbox-nav{width:2.6rem;height:2.6rem;font-size:1.05rem;}
}

/* ---------- Etapas da jornada ---------- */
.etapa-num{
  display:inline-block;color:var(--bs-primary);text-transform:uppercase;letter-spacing:.12em;
  font-weight:500;font-size:1rem;border-bottom:2px solid var(--bs-primary);padding-bottom:.2rem;
}
.etapa-blob{
  background:var(--brand-mint);border-radius:63% 37% 54% 46% / 55% 48% 52% 45%;
  padding:2.2rem;display:inline-block;max-width:440px;width:100%;
}

/* ---------- Card de citação (hero atendimento) ---------- */
.quote-card{
  background:var(--brand-teal-deep);color:#fff;border-radius:1.5rem;padding:3rem;
}
.quote-card p{font-size:1.6rem;line-height:1.4;}
@media (max-width:991.98px){
  .quote-card{padding:2rem;}
  .quote-card p{font-size:1.35rem;}
}

/* ---------- Accordion FAQ ---------- */
.faq-accordion .accordion-item{
  background:#fff;border:1px solid #d5ebe9;border-radius:.9rem;margin-bottom:1rem;overflow:hidden;
}
.faq-accordion .accordion-button{
  font-size:1.15rem;color:var(--bs-secondary);font-weight:500;padding:1.15rem 1.35rem;background:#fff;
}
.faq-accordion .accordion-button:not(.collapsed){color:var(--bs-primary);background:#fff;box-shadow:none;}
.faq-accordion .accordion-button:focus{box-shadow:none;}
.faq-accordion .accordion-button::after{
  --bs-accordion-btn-icon:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath stroke='%232a9d97' stroke-linecap='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
  --bs-accordion-btn-active-icon:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath stroke='%232a9d97' stroke-linecap='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
}
.faq-accordion .accordion-body{padding:0 1.35rem 1.35rem;}

/* dots de paginação/carrossel */
.dots{display:flex;gap:.5rem;justify-content:center;align-items:center;}
.dots .dot{width:.6rem;height:.6rem;border-radius:50%;background:#bfe0dd;}
.dots .dot.bar{width:1.8rem;border-radius:50rem;background:var(--bs-primary);}

/* ---------- Carrossel de galeria (perfil) ---------- */
.gallery-carousel{position:relative;}
.gallery-arrow{
  width:2.75rem;height:2.75rem;flex:0 0 auto;border-radius:50%;background:var(--bs-primary);color:#fff;border:0;
  display:inline-flex;align-items:center;justify-content:center;font-size:1.1rem;opacity:1;
  top:50%;bottom:auto;transform:translateY(-50%);
}
.gallery-carousel .carousel-control-prev{left:-3.5rem;width:2.75rem;}
.gallery-carousel .carousel-control-next{right:-3.5rem;width:2.75rem;}
.gallery-arrow:hover{background:#23847f;color:#fff;}
.gallery-dots{gap:.5rem;}
.gallery-dots [data-bs-target]{
  width:.55rem;height:.55rem;border-radius:50%;background:#bfe0dd;border:0;opacity:1;
  text-indent:0;margin:0 .25rem;transition:.2s;
}
.gallery-dots [data-bs-target].active{width:1.8rem;border-radius:50rem;background:var(--bs-primary);}
@media (max-width:1400px){
  .gallery-carousel .carousel-control-prev{left:.25rem;}
  .gallery-carousel .carousel-control-next{right:.25rem;}
}