/* Entrada pública: papéis oficiais da marca + superfícies aprovadas do Hub.
 * A composição e o tema compartilhado das páginas internas são preservados.
 */
html[data-maple][data-maple-landing] {
  --black: var(--maple-background);
  --white: var(--maple-text-primary);
  --white-dim: var(--maple-text-secondary);
  --mute: var(--maple-text-secondary);
  --cyan: var(--maple-color-ice);
  --line: var(--maple-border-decorative);
  --line-soft: color-mix(in srgb, var(--maple-color-white) 9%, transparent);
  --mp-glass: var(--maple-ambient-product);
  --mp-glass-solid: var(--glass-solid);
  --mp-edge: color-mix(in srgb, var(--maple-color-ice) 11%, transparent);
  --mp-hi: color-mix(in srgb, var(--maple-color-ice) 26%, transparent);
  --mp-grad-text: linear-gradient(100deg, var(--maple-text-primary) 10%, var(--maple-color-ice) 100%);
  background: var(--maple-background);
  scrollbar-color: var(--maple-border-decorative) transparent;
}

html[data-maple-landing] nav.top {
  background: var(--maple-ambient-dark) !important;
}

html[data-maple-landing] nav.top .logo .studio {
  border-color: var(--maple-border-essential);
  color: var(--maple-color-ice);
}

html[data-maple-landing] .hero-title {
  display: flex;
  justify-content: center;
  align-items: baseline;
  gap: 0.22em;
  font-size: clamp(36px, 8.8vw, 132px);
}
html[data-maple-landing] .hero-wordmark {
  display: inline-flex;
  align-items: baseline;
  gap: 0.03em;
}
html[data-maple-landing] .hero-wordmark img {
  display: block;
  width: 4.55em;
  height: auto;
}
html[data-maple-landing] .footer-signature {
  text-align: center;
}

/* Sombra neutra mantém a leitura sobre as cores originais do vídeo. */
html[data-maple-landing] .mp-stage::after {
  background:
    radial-gradient(ellipse 60% 70% at 50% 50%, rgb(0 0 0 / 60%), rgb(0 0 0 / 90%)),
    linear-gradient(0deg, rgb(0 0 0 / 70%), transparent 50%);
}

html[data-maple-landing] main::after {
  background:
    radial-gradient(900px 480px at 18% 30%, color-mix(in srgb, var(--maple-color-mineral) 16%, transparent), transparent 70%),
    radial-gradient(800px 460px at 85% 75%, color-mix(in srgb, var(--maple-color-ice) 3%, transparent), transparent 75%);
}

html[data-maple-landing] .mp-backdrop .a1 {
  background: radial-gradient(circle, var(--aurora-1), transparent 65%);
}
html[data-maple-landing] .mp-backdrop .a2 {
  background: radial-gradient(circle, var(--aurora-3), transparent 65%);
}
html[data-maple-landing] .mp-backdrop .a3 {
  background: radial-gradient(circle, var(--aurora-4), transparent 65%);
}

html[data-maple-landing] .access {
  background: var(--maple-ambient-product);
  border-color: var(--mp-edge);
}

html[data-maple-landing] .access a {
  background: var(--maple-action);
  color: var(--maple-on-action);
  box-shadow: 0 8px 30px -10px rgb(0 0 0 / 50%);
}
html[data-maple-landing] .access a:hover {
  background: var(--maple-action-hover);
  color: var(--maple-on-action-hover);
  box-shadow: 0 16px 40px -12px rgb(0 0 0 / 55%);
}

html[data-maple-landing] :focus-visible {
  outline-color: var(--maple-focus);
}
html[data-maple-landing] ::selection {
  background: var(--maple-selection);
  color: var(--maple-text-primary);
}
html[data-maple-landing] ::-webkit-scrollbar-thumb {
  background-color: var(--maple-border-decorative);
}