.elementor-11 .elementor-element.elementor-element-f2d93ae{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-11 .elementor-element.elementor-element-4000689{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}body:not(.rtl) .elementor-11 .elementor-element.elementor-element-bc0fe57{left:910px;}body.rtl .elementor-11 .elementor-element.elementor-element-bc0fe57{right:910px;}.elementor-11 .elementor-element.elementor-element-bc0fe57{bottom:60px;text-align:right;}.elementor-11 .elementor-element.elementor-element-bc0fe57 img{width:9%;}.elementor-11 .elementor-element.elementor-element-8306e42{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:-20px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-11 .elementor-element.elementor-element-5ad0b06{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}:root{--page-title-display:none;}@media(max-width:767px){.elementor-11 .elementor-element.elementor-element-bc0fe57{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 10px 0px 0px;bottom:68.984px;text-align:right;}body:not(.rtl) .elementor-11 .elementor-element.elementor-element-bc0fe57{left:270px;}body.rtl .elementor-11 .elementor-element.elementor-element-bc0fe57{right:270px;}.elementor-11 .elementor-element.elementor-element-bc0fe57 img{width:45%;}}@media(min-width:768px){.elementor-11 .elementor-element.elementor-element-f2d93ae{--content-width:1920px;}.elementor-11 .elementor-element.elementor-element-4000689{--content-width:1920px;}.elementor-11 .elementor-element.elementor-element-8306e42{--content-width:1920px;}}/* Start custom CSS for html, class: .elementor-element-594d59a */.btn-primary {
  display: inline-block;
  padding: 14px 28px;
  border-radius: 999px;
  font-weight: 700;
  background: linear-gradient(135deg, #A9C1B7 0%, #BFD7EA 100%);
  color: #000000; /* 🔹 texto preto */
  text-decoration: none;
  border: 2px solid rgba(255,255,255,0.3);
  box-shadow: 0 8px 20px rgba(169,193,183,0.35);
  transition: all 0.25s ease;
}
.btn-primary:hover {
  background: linear-gradient(135deg, #BFD7EA 0%, #A9C1B7 100%);
  transform: translateY(-2px);
  box-shadow: 0 10px 30px rgba(169,193,183,0.5);
}


/* Garante que o container permita posicionar o ícone */
.hero-illustration {
  position: relative !important;
  overflow: visible !important; /* evita cortar o dentinho */
}

/* Faz o dentinho ficar acima da foto */
.hero-illustration img.tooth-deco,
.hero-illustration img[src*="c12aee71"] {
  position: absolute !important;
  top: -88px !important;
  right: -118px !important;
  width: 160px !important;
  height: auto !important;
  z-index: 999 !important; /* acima da imagem */
  pointer-events: none !important;
  animation: floatTooth 5s ease-in-out infinite !important;
  filter: drop-shadow(0 4px 10px rgba(0,0,0,.25)) !important;
  opacity: 1 !important;
}

/* Animação leve */
@keyframes floatTooth {
  0%,100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}

/* ===== SOMENTE MOBILE (não mexe no desktop) ===== */
@media (max-width: 768px){

  /* Reorganiza a hero no mobile sem usar absolute na foto */
  .hero-wrap{
    display: flex !important;
    flex-direction: column-reverse !important; /* imagem sobe */
    align-items: center !important;
    gap: 0px !important;
  }

  /* Container da imagem: visível e editável */
  .hero-illustration{
    position: relative !important;
    overflow: visible !important;     /* não corta o ícone */
    width: 100% !important;
    max-width: 360px !important;      /* ajuste do tamanho da foto no mobile */
    margin: -10px auto 10px !important;  /* "sobe" para a 1ª dobra */
    z-index: 1 !important;            /* fica acima do fundo, mas abaixo do ícone */
  }

  /* FOTO principal: garante que não some e pode ser clicada no editor */
  .hero-illustration img:not(.tooth-deco){
    display: block !important;
    width: 100% !important;
    height: auto !important;
  
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;  /* EDITÁVEL */
    position: static !important;      /* evita “sumir” por positioning */
    z-index: 1 !important;
  }

  /* ÍCONE do dentinho: por cima, mas NÃO intercepta cliques */
  .hero-illustration img.tooth-deco{
    position: absolute !important;
    top: -18px !important;
    right: -12px !important;
    width: 68px !important;
    height: auto !important;
    z-index: 999 !important;          /* acima da foto */
    pointer-events: none !important;  /* não bloqueia edição da foto */
    animation: floatTooth 5s ease-in-out infinite !important;
    filter: drop-shadow(0 4px 8px rgba(0,0,0,.22)) !important;
  }

  @keyframes floatTooth{
    0%,100%{ transform: translateY(0); }
    50%    { transform: translateY(-6px); }
  }
}


.bullets li {
  animation: fadeInUp 0.5s ease forwards;
}
@keyframes fadeInUp {
  from {opacity: 0; transform: translateY(8px);}
  to {opacity: 1; transform: translateY(0);}
}




/* Mantém alinhamento e reduz apenas a largura visual dos bullets no desktop */
.bullets {
  list-style: none;
  padding: 0;
  margin: 0 0 18px;
  display: grid;
  gap: 10px;
}

.bullets li {
  background: linear-gradient(135deg, #BFD7EA 0%, #A9C1B7 100%);
  border: 1px solid #d9e6e1;
  border-radius: 12px;
  padding: 12px 16px;
  box-shadow: 0 6px 14px rgba(36,50,55,.06);
  color: #22353a;
  font-weight: 500;
  transition: transform .2s ease, box-shadow .2s ease;
  width: 80%;          /* 🔹 Diminui a largura mantendo o alinhamento */
  max-width: 560px;    /* 🔹 Limite de largura */
}

.bullets li:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 18px rgba(36,50,55,.12);
}

/* 🔹 Mobile: bullets ocupam 100% novamente */
@media (max-width: 768px) {
  .bullets li {
    width: 100%;
    max-width: 100%;
  }
}
/* --- Mobile: centralizar 1ª dobra --- */
@media (max-width: 430px) {
  .hero-wrap { 
    grid-template-columns: 1fr;           /* já empilha */
    justify-items: center;                 /* centraliza a coluna */
  }

  .hero h1,
  .hero .sub { 
    text-align: center;
  }

  /* Lista centralizada e com largura confortável */
  .bullets { 
    justify-items: center;
  }
  .bullets li {
    width: min(92vw, 430px);               /* não ocupa 100%, fica “cartão” centralizado */
    margin: px auto;                      /* centraliza */
  }

  /* CTA centralizado e com mesma largura dos bullets */
  .hero .btn {
    display: block;
    width: min(92vw, 340px);
    margin: 14px auto 0;
    text-align: center;
  }
}


---
/* Sobre */
.about {
  background: #fff;
}

.about-wrap {
  max-width: 1120px;
  margin: 0 auto;
  display: grid;
  gap: 32px; /* mantém leve respiro entre imagem e texto */
  grid-template-columns: 0.6fr 1.4fr; /* imagem menor e texto maior */
  align-items: center; /* centraliza verticalmente */
}

@media (max-width: 900px) {
  .about-wrap {
    grid-template-columns: 1fr;
  }
}

.about-photo {
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 14px 30px rgba(36, 50, 55, 0.1);
  border: 1px solid #eef3f6;
}

.about-photo img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 360px; /* controla o tamanho da imagem */
  object-fit: cover;
  aspect-ratio: 2/3;
}
/* Sobre */
.about {
  background: #fff;
}

.about-wrap {
  max-width: 1120px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 0.55fr 1.45fr; /* deixa a imagem menor e o texto mais largo */
  align-items: center;
  gap: 0; /* elimina o espaço entre imagem e texto */
}

@media (max-width: 900px) {
  .about-wrap {
    grid-template-columns: 1fr;
  }
}

.about-photo {
  border-radius: 16px;
  overflow: hidden;
  /* remove fundo branco e bordas */
  background: none;
  box-shadow: none;
  border: none;
  justify-self: end; /* empurra imagem pra direita */
}

.about-photo img {
  display: block;
  width: 90%; /* controla tamanho sem deixar gigante */
  height: auto;
  object-fit: cover;
  aspect-ratio: 2/3;
}/* End custom CSS */
/* Start custom CSS for image, class: .elementor-element-bc0fe57 */.elementor-11 .elementor-element.elementor-element-bc0fe57{

    transform:scale(1) rotate(0deg);
    transition:.8s ease-in-out;}


    animation:none; 
    transition:.8s ease-in-out;}
}
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-5ad0b06 *//* Garante que o container permita posicionar o ícone */
.hero-illustration {
  position: relative !important;
  overflow: visible !important; /* evita cortar o dentinho */
}

/* Faz o dentinho ficar acima da foto */
.hero-illustration img.tooth-deco,
.hero-illustration img[src*="c12aee71"] {
  position: absolute !important;
  top: -88px !important;
  right: -118px !important;
  width: 160px !important;
  height: auto !important;
  z-index: 999 !important; /* acima da imagem */
  pointer-events: none !important;
  animation: floatTooth 5s ease-in-out infinite !important;
  filter: drop-shadow(0 4px 10px rgba(0,0,0,.25)) !important;
  opacity: 1 !important;
}

/* Animação leve */
@keyframes floatTooth {
  0%,100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}

/* ===== SOMENTE MOBILE (não mexe no desktop) ===== */
@media (max-width: 768px){

  /* Reorganiza a hero no mobile sem usar absolute na foto */
  .hero-wrap{
    display: flex !important;
    flex-direction: column-reverse !important; /* imagem sobe */
    align-items: center !important;
    gap: 0px !important;
  }

  /* Container da imagem: visível e editável */
  .hero-illustration{
    position: relative !important;
    overflow: visible !important;     /* não corta o ícone */
    width: 100% !important;
    max-width: 360px !important;      /* ajuste do tamanho da foto no mobile */
    margin: -10px auto 10px !important;  /* "sobe" para a 1ª dobra */
    z-index: 1 !important;            /* fica acima do fundo, mas abaixo do ícone */
  }

  /* FOTO principal: garante que não some e pode ser clicada no editor */
  .hero-illustration img:not(.tooth-deco){
    display: block !important;
    width: 100% !important;
    height: auto !important;
  
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;  /* EDITÁVEL */
    position: static !important;      /* evita “sumir” por positioning */
    z-index: 1 !important;
  }

  /* ÍCONE do dentinho: por cima, mas NÃO intercepta cliques */
  .hero-illustration img.tooth-deco{
    position: absolute !important;
    top: -18px !important;
    right: -12px !important;
    width: 68px !important;
    height: auto !important;
    z-index: 999 !important;          /* acima da foto */
    pointer-events: none !important;  /* não bloqueia edição da foto */
    animation: floatTooth 5s ease-in-out infinite !important;
    filter: drop-shadow(0 4px 8px rgba(0,0,0,.22)) !important;
  }

  @keyframes floatTooth{
    0%,100%{ transform: translateY(0); }
    50%    { transform: translateY(-6px); }
  }
}


.bullets li {
  animation: fadeInUp 0.5s ease forwards;
}
@keyframes fadeInUp {
  from {opacity: 0; transform: translateY(8px);}
  to {opacity: 1; transform: translateY(0);}
}




/* Mantém alinhamento e reduz apenas a largura visual dos bullets no desktop */
.bullets {
  list-style: none;
  padding: 0;
  margin: 0 0 18px;
  display: grid;
  gap: 10px;
}

.bullets li {
  background: linear-gradient(135deg, #BFD7EA 0%, #A9C1B7 100%);
  border: 1px solid #d9e6e1;
  border-radius: 12px;
  padding: 12px 16px;
  box-shadow: 0 6px 14px rgba(36,50,55,.06);
  color: #22353a;
  font-weight: 500;
  transition: transform .2s ease, box-shadow .2s ease;
  width: 80%;          /* 🔹 Diminui a largura mantendo o alinhamento */
  max-width: 560px;    /* 🔹 Limite de largura */
}

.bullets li:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 18px rgba(36,50,55,.12);
}

/* 🔹 Mobile: bullets ocupam 100% novamente */
@media (max-width: 768px) {
  .bullets li {
    width: 100%;
    max-width: 100%;
  }
}
/* --- Mobile: centralizar 1ª dobra --- */
@media (max-width: 430px) {
  .hero-wrap { 
    grid-template-columns: 1fr;           /* já empilha */
    justify-items: center;                 /* centraliza a coluna */
  }

  .hero h1,
  .hero .sub { 
    text-align: center;
  }

  /* Lista centralizada e com largura confortável */
  .bullets { 
    justify-items: center;
  }
  .bullets li {
    width: min(92vw, 430px);               /* não ocupa 100%, fica “cartão” centralizado */
    margin: px auto;                      /* centraliza */
  }

  /* CTA centralizado e com mesma largura dos bullets */
  .hero .btn {
    display: block;
    width: min(92vw, 340px);
    margin: 14px auto 0;
    text-align: center;
  }
}


---
/* Sobre */
.about {
  background: #fff;
}

.about-wrap {
  max-width: 1120px;
  margin: 0 auto;
  display: grid;
  gap: 32px; /* mantém leve respiro entre imagem e texto */
  grid-template-columns: 0.6fr 1.4fr; /* imagem menor e texto maior */
  align-items: center; /* centraliza verticalmente */
}

@media (max-width: 900px) {
  .about-wrap {
    grid-template-columns: 1fr;
  }
}

.about-photo {
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 14px 30px rgba(36, 50, 55, 0.1);
  border: 1px solid #eef3f6;
}

.about-photo img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 360px; /* controla o tamanho da imagem */
  object-fit: cover;
  aspect-ratio: 2/3;
}
/* Sobre */
.about {
  background: #fff;
}

.about-wrap {
  max-width: 1120px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 0.55fr 1.45fr; /* deixa a imagem menor e o texto mais largo */
  align-items: center;
  gap: 0; /* elimina o espaço entre imagem e texto */
}

@media (max-width: 900px) {
  .about-wrap {
    grid-template-columns: 1fr;
  }
}

.about-photo {
  border-radius: 16px;
  overflow: hidden;
  /* remove fundo branco e bordas */
  background: none;
  box-shadow: none;
  border: none;
  justify-self: end; /* empurra imagem pra direita */
}

.about-photo img {
  display: block;
  width: 90%; /* controla tamanho sem deixar gigante */
  height: auto;
  object-fit: cover;
  aspect-ratio: 2/3;
}
.btn-primary {
  display: inline-block;
  padding: 14px 26px;
  border-radius: 999px;
  font-weight: 700;
  background: linear-gradient(135deg, #A9C1B7 0%, #BFD7EA 100%);
  color: #0f1f23;
  text-decoration: none;
  border: 2px solid rgba(255,255,255,0.3);
  box-shadow: 0 8px 24px rgba(169,193,183,0.35);
  transition: all 0.25s ease;
}
.btn-primary:hover {
  background: linear-gradient(135deg, #BFD7EA 0%, #A9C1B7 100%);
  box-shadow: 0 10px 30px rgba(169,193,183,0.5);
  transform: translateY(-2px);
}/* End custom CSS */