/* Títulos do masterplan na estética tipográfica da marca TEMPLO DA LUA
   (Jost ~640, caixa alta, espaçamento .055em, filtro #lua-cut). Corpo de texto inalterado.
   No fim, dois ajustes só de layout no masterplan (menu e capa), sem mudar nenhum texto. */
h1:not(.tdl-sr-only), h2, h3, h4, .tdl-prancha-title {
  font-family: var(--tdl-display) !important;
  font-weight: 640 !important;
  font-style: normal !important;
  text-transform: uppercase !important;
  letter-spacing: .055em !important;
  line-height: 1.06 !important;
  text-wrap: balance;
}
h2 { font-size: clamp(28px, 2.75vw, 44px) !important; filter: url(#lua-cut); }
h3 { font-size: clamp(19px, 1.65vw, 26px) !important; filter: url(#lua-cut-s); }
h4 { font-size: clamp(16px, 1.25vw, 20px) !important; filter: url(#lua-cut-s); }
.tdl-prancha-title { font-size: clamp(24px, 2.4vw, 36px) !important; filter: url(#lua-cut); }
.tdl-feature-film h2 { font-size: clamp(30px, 3vw, 48px) !important; }
@media (max-width: 768px) {
  h2 { font-size: clamp(25px, 7.4vw, 34px) !important; }
  h3 { font-size: clamp(18px, 5.2vw, 23px) !important; }
}

/* Títulos em <span> (legendas de filme/pranchas, etapas da Jornada) — mesma estética da marca.
   Valores numéricos e dados continuam no corpo de texto original.
   Classes prontas para o HTML do masterplan: .tdl-titulo-span (os quatro tamanhos maiores),
   .tdl-titulo-span-sm (clamp 24–32 px) e .tdl-titulo-jornada (h3 da Jornada da Lua).
   Depois de pôr as classes nos elementos, apague os seletores por estilo inline (span[style*=…] e h3[style*=…]). */
span[style*="clamp(26px, 2.4vw, 38px)"], span[style*="clamp(24px, 2.4vw, 36px)"],
span[style*="clamp(24px, 2vw, 32px)"], span[style*="clamp(25px, 2.7vw, 40px)"],
span[style*="clamp(23px, 2.2vw, 34px)"], .tdl-titulo-span, .tdl-titulo-span-sm {
  font-family: var(--tdl-display) !important; font-weight: 640 !important; font-style: normal !important;
  text-transform: uppercase !important; letter-spacing: .055em !important; line-height: 1.12 !important;
  filter: url(#lua-cut-s);
}
span[style*="clamp(26px, 2.4vw, 38px)"], span[style*="clamp(24px, 2.4vw, 36px)"],
span[style*="clamp(25px, 2.7vw, 40px)"], span[style*="clamp(23px, 2.2vw, 34px)"], .tdl-titulo-span { font-size: clamp(20px, 1.9vw, 30px) !important; }
span[style*="clamp(24px, 2vw, 32px)"], .tdl-titulo-span-sm { font-size: clamp(18px, 1.5vw, 23px) !important; }
/* Título "Jornada da Lua" mantém a escala de destaque original */
h3[style*="clamp(38px, 3.6vw, 58px)"], h3[style*="clamp(38px, 3.4vw, 54px)"], .tdl-titulo-jornada { font-size: clamp(30px, 3vw, 48px) !important; filter: url(#lua-cut); }
@media (max-width: 760px) {
  h3[style*="clamp(38px, 3.6vw, 58px)"], h3[style*="clamp(38px, 3.4vw, 54px)"], .tdl-titulo-jornada { font-size: clamp(25px, 7.4vw, 34px) !important; }
}

/* ---------- Ajustes só de layout no masterplan ---------- */
/* Menu: o item "Wellness Club" abre outra página. Fica dourado e ganha uma seta; o rótulo não muda. */
.tdl-site-nav a[href*="wellness-club"]:not([href^="#"]) { color: #D7B98C; white-space: nowrap; }
.tdl-site-nav a[href*="wellness-club"]:not([href^="#"])::after {
  content: ""; display: inline-block; width: .7em; height: .7em; margin-left: .4em; vertical-align: .02em; background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M2.2 7.8 7.6 2.4M3.4 2.2h4.4v4.4' fill='none' stroke='%23000' stroke-width='1.3'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M2.2 7.8 7.6 2.4M3.4 2.2h4.4v4.4' fill='none' stroke='%23000' stroke-width='1.3'/%3E%3C/svg%3E") center / contain no-repeat;
}
/* Capa: a linha de fases da lua alinhada à borda do título; no celular, o símbolo grande menor,
   já que a marca está no cabeçalho, para os números da capa subirem. */
main > section:first-of-type img[src$="glifos-lua.svg"] { margin-left: -8px !important; }
@media (max-width: 768px) {
  main > section:first-of-type img[src$="marca-templo-da-lua.png"] { height: 52px !important; width: auto !important; }
  main > section:first-of-type img[src$="glifos-lua.svg"] { margin-left: -12px !important; }
}