/* Textos */
p,
.credentials li,
.contact address {
  font-size: 18px;
}

/* Títulos das seções */
h2 {
  font-size: clamp(36px, 4.5vw, 60px);
}

/* Títulos menores */
h3 {
  font-size: 30px;
}

/* Menu e botões */
nav a,
.button {
  font-size: 15px;
}

/* Legendas */
figcaption {
  font-size: 14px;
}#inicio.hero::after {
  inset: 0 0 0 auto;
  width: 60%;
  background-position: center;
  background-size: cover;
  opacity: 0.16;
  -webkit-mask-image: radial-gradient(
    ellipse 50% 65% at 55% 45%,
    #000 15%,
    transparent 100%
  );
  mask-image: radial-gradient(
    ellipse 50% 65% at 55% 45%,
    #000 15%,
    transparent 100%
		
  );
}

@media (max-width: 760px) {
  #inicio.hero::after {
    width: 100%;
  }
}/* Textos pequenos acima dos títulos */
.eyebrow {
  font-size: 13px;
  letter-spacing: 2px;
}

/* Arte · Ciência · Odontologia */
.art span {
  font-size: 13px;
  letter-spacing: 3px;
}

/* Faixa com os nomes dos tratamentos */
.ribbon {
  font-size: 13px;
}

/* Rodapé */
footer {
  font-size: 13px;
}#inicio.hero::after {
  background-size: auto 90%;
  background-position: center 60px;
  background-repeat: no-repeat;
}#inicio.hero::after {
  inset: 60px 5% auto auto;
  width: min(40vw, 520px);
  height: auto;
  aspect-ratio: 1363 / 2047;
  background-size: 100% 100%;
  background-position: center;
  background-repeat: no-repeat;

  -webkit-mask-image: radial-gradient(
    ellipse closest-side,
    #000 40%,
    transparent 100%
  );
  mask-image: radial-gradient(
    ellipse closest-side,
    #000 40%,
    transparent 100%
  );
}

@media (max-width: 760px) {
  #inicio.hero::after {
    width: 85%;
    right: 0;
  }
}#inicio.hero::after {
  right: 16%;

  -webkit-mask-image:
    linear-gradient(to right,
      transparent, #000 20%, #000 80%, transparent),
    linear-gradient(to bottom,
      transparent, #000 12%, #000 75%, transparent);
  mask-image:
    linear-gradient(to right,
      transparent, #000 20%, #000 80%, transparent),
    linear-gradient(to bottom,
      transparent, #000 12%, #000 75%, transparent);

  -webkit-mask-composite: source-in;
  mask-composite: intersect;
}

@media (max-width: 760px) {
  #inicio.hero::after {
    right: 7%;
  }
}/* Posicionamento da foto no tablet */
@media (min-width: 600px) and (max-width: 1024px) {
  #inicio.hero::after {
    right: -10%;
  }
}/* Baixar a foto somente no celular */
@media (max-width: 599px) {
  #inicio.hero::after {
    top: 110px;
  }
}@media (max-width: 760px) {
  header {
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    padding: 8px 12px;
  }

  header .brand img {
    width: 100px;
    height: 45px;
  }

  header nav {
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    gap: 12px;
  }

  header nav a:not(.button) {
    display: inline-block;
    font-size: 11px;
    white-space: nowrap;
  }

  header nav .button {
    font-size: 10px;
    padding: 10px;
    white-space: nowrap;
  }
}@media (max-width: 599px) {
  #inicio.hero {
    padding-top: 30px;
    padding-bottom: 40px;
    min-height: auto;
    align-items: start;
  }

  #inicio.hero::after {
    top: 30px;
  }
}/* Legendas legíveis em todas as telas */
.treatment-photo figcaption,
.preservation-case figcaption,
.digital-plan figcaption {
  font-size: 14px;
  line-height: 1.7;
}

/* No celular, cada foto com sua legenda abaixo */
@media (max-width: 599px) {
  .preservation-case .martina-photos {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .preservation-case .martina-photos figure:first-child {
    width: 65%;
  }
}@media (max-width: 599px) {
  #inicio.hero {
    padding-bottom: 100px;
  }

  #inicio .art span {
    bottom: 28px;
    left: 16px;
    right: 16px;
    font-size: 11px;
    letter-spacing: 2px;
    line-height: 1.6;
  }
}@media (max-width: 760px) {
  /* Larguras e espaçamentos */
  main section {
    padding: 48px 22px;
  }

  main section > *,
  .grid > *,
  .martina-photos > * {
    min-width: 0;
    max-width: 100%;
  }

  .intro,
  .about,
  .contact,
  .courses {
    grid-template-columns: minmax(0, 1fr);
    gap: 28px;
  }

  /* Cabeçalho com menu completo */
  body header {
    padding: 8px 12px 12px;
    flex-direction: column;
    gap: 6px;
  }

  header .brand img {
    width: 100px;
    height: 44px;
  }

  body header nav {
    width: 100%;
    justify-content: center;
    gap: 10px;
  }

  header nav a:not(.button) {
    display: inline-block;
    font-size: 11px;
    white-space: nowrap;
  }

  header nav .button {
    padding: 10px;
    font-size: 10px;
    white-space: nowrap;
  }

  /* Página inicial */
  #inicio.hero {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    min-height: auto;
    gap: 28px;
    padding: 30px 22px;
  }

  #inicio.hero > div:first-child {
    width: 100%;
  }

  #inicio.hero h1 {
    margin: 20px 0;
  }

  #inicio.hero .signature {
    width: 100%;
    max-width: 440px;
    height: auto;
    margin: 0 auto;
  }

  #inicio.hero p {
    font-size: 16px;
    line-height: 1.75;
  }

  #inicio .eyebrow {
    display: block;
    font-size: 11px;
    line-height: 1.8;
    letter-spacing: 1.5px;
  }

  #inicio .actions {
    flex-direction: column;
    align-items: center;
    gap: 12px;
    margin-top: 24px;
  }

  #inicio .actions .button {
    width: 100%;
    max-width: 310px;
    padding: 16px 12px;
    font-size: 13px;
  }

  /* Frase abaixo dos botões, sem sobreposição */
  #inicio.hero .art {
    position: relative;
    inset: auto;
    width: 100%;
    height: auto;
    margin: 0;
    display: block;
    background: none;
    z-index: 1;
  }

  #inicio .art span {
    position: static;
    display: block;
    font-size: 11px;
    line-height: 1.8;
    letter-spacing: 2px;
  }

  /* Textos e títulos */
  main section h2 {
    font-size: clamp(28px, 7.5vw, 38px);
    line-height: 1.2;
    letter-spacing: -1px;
  }

  main section h3 {
    font-size: 27px;
    line-height: 1.25;
  }

  main section p,
  .credentials li,
  #contato address {
    font-size: 16px;
    line-height: 1.75;
  }

  /* Faixa de tratamentos sem corte lateral */
  .ribbon {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    padding: 20px 12px;
    font-size: 9px;
    letter-spacing: .5px;
    text-align: center;
    line-height: 1.7;
    overflow-wrap: anywhere;
  }

  /* Fotos e respectivas legendas */
  .preservation-case {
    margin: 36px 0;
    padding: 32px 0;
  }

  .preservation-case .martina-photos {
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
  }

  .preservation-case .martina-photos figure:first-child {
    width: 70%;
    margin: 0 auto;
  }

  .treatment-photo figcaption,
  .preservation-case figcaption,
  .digital-plan figcaption {
    font-size: 14px;
    line-height: 1.7;
    text-align: left;
  }

  .courses figure {
    width: 100%;
  }

  #contato .button,
  .courses .courses-cta {
    max-width: 100%;
    white-space: normal;
    text-align: center;
    line-height: 1.5;
  }
}@media (max-width: 599px) {
  main section p,
  #inicio.hero p,
  .service p,
  .credentials li,
  #contato address,
  summary {
    font-size: 14px;
    line-height: 1.7;
  }

  main section h2,
  .intro h2 {
    font-size: 28px;
    line-height: 1.2;
  }

  main section h3,
  .preservation-case h3 {
    font-size: 23px;
    line-height: 1.3;
  }

  .treatment-photo figcaption,
  .preservation-case figcaption,
  .digital-plan figcaption {
    font-size: 12px;
    line-height: 1.65;
  }

  #inicio .actions .button,
  #contato .button,
  .courses .courses-cta {
    font-size: 12px;
  }

  .eyebrow,
  #inicio .eyebrow,
  #inicio .art span {
    font-size: 10px;
    letter-spacing: 1.2px;
  }

  footer,
  .note,
  #contato a.text {
    font-size: 11px;
  }
}@media (max-width: 599px) {
  #inicio .eyebrow {
    white-space: nowrap;
    font-size: clamp(8px, 2.4vw, 10px);
    letter-spacing: .5px;
  }
}@media (max-width: 599px) {
  main section p,
  .service p,
  .credentials li,
  #contato address,
  details p {
    line-height: 1.5;
  }

  main section h2,
  .intro h2 {
    line-height: 1.12;
    margin: 12px 0 18px;
  }

  main section h3,
  .preservation-case h3 {
    line-height: 1.18;
    margin: 18px 0 12px;
  }

  .treatment-photo figcaption,
  .preservation-case figcaption,
  .digital-plan figcaption {
    line-height: 1.45;
  }
}@media (max-width: 599px) {
  main section h2,
  main section h3,
  .intro h2,
  .preservation-case h3,
  .service h3 {
    margin-bottom: 8px;
  }

  main section h2 + p,
  main section h3 + p {
    margin-top: 0;
  }

  main section p {
    margin-bottom: 12px;
  }
}@media (max-width: 599px) {
  main section h2,
  main section h3,
  .intro h2,
  .preservation-case h3,
  .service h3 {
    margin-bottom: 2px;
  }

  main section h2 + p,
  main section h3 + p {
    margin-top: 0;
  }

  .intro {
    gap: 4px;
  }

  .intro p:first-child {
    margin-top: 0;
  }
}@media (max-width: 599px) {
  #inicio.hero::after {
    width: 65%;
    right: -5%;
  }
}@media (max-width: 599px) {
  #inicio.hero::after {
    top: 10px;
  }
}@media (min-width: 600px) and (max-width: 1024px) {
  #inicio.hero::after {
    top: 40px;
  }
}@media (min-width: 600px) and (max-width: 1024px) {
  #inicio.hero::after {
    top: 20px;
  }
}top: 30;
top: 0;