/* ==========================================================================
   Sara Momenti — estilos
   Estrutura: tokens · base · utilitários · componentes · seções · movimento
   ========================================================================== */

/* ---------- Tokens ---------- */
:root {
  --c-bg: #100E25;          /* azul profundo / índigo */
  --c-bg-2: #15122F;        /* variação para alternar seções */
  --c-bg-3: #0B0A1B;        /* rodapé */
  --c-violet: #6143A3;      /* detalhes e transições */
  --c-gold: #DFBD85;        /* destaques */
  --c-gold-2: #EBD3A8;      /* hover do dourado */
  --c-text: #F4EEE6;        /* branco quente */
  --c-muted: #BCB4CB;       /* lavanda clara */

  --c-line: rgba(188, 180, 203, .16);
  --c-line-gold: rgba(223, 189, 133, .32);
  --c-surface: rgba(244, 238, 230, .03);

  --f-serif: "Cormorant Garamond", "Cormorant", Garamond, "Times New Roman", serif;
  --f-sans: "Manrope", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  --container: 72rem;
  --gutter: clamp(1rem, 4vw, 2.5rem);
  --section-y: clamp(5rem, 11vw, 9rem);

  --radius: 1.25rem;
  --header-h: 4.5rem;
  --ease: cubic-bezier(.22, .61, .36, 1);
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-padding-top: var(--header-h);
}

@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}

body {
  margin: 0;
  background: var(--c-bg);
  color: var(--c-text);
  font-family: var(--f-sans);
  font-size: 1.0625rem;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

img, svg { display: block; max-width: 100%; }
img { height: auto; }

h1, h2, h3, p, ul, ol, figure, blockquote { margin: 0; }
:where(ul[role="list"], ol[role="list"]) { list-style: none; padding: 0; }

a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: .25em; }

strong { font-weight: 600; color: var(--c-text); }

::selection { background: var(--c-violet); color: var(--c-text); }

:focus-visible {
  outline: 2px solid var(--c-gold);
  outline-offset: 3px;
  border-radius: 4px;
}

/* ---------- Utilitários ---------- */
.sr-only {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0);
  white-space: nowrap; border: 0;
}

.skip-link {
  position: absolute;
  left: 1rem; top: -4rem;
  z-index: 100;
  padding: .75rem 1.25rem;
  background: var(--c-gold);
  color: var(--c-bg);
  font-weight: 600;
  border-radius: 999px;
  text-decoration: none;
  transition: top .2s var(--ease);
}
.skip-link:focus { top: 1rem; }

.container {
  width: 100%;
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: var(--gutter);
}
.narrow { max-width: 50rem; }
.center { text-align: center; }

/* ---------- Tipografia ---------- */
.eyebrow {
  font-family: var(--f-sans);
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--c-gold);
  margin-bottom: 1.25rem;
}

.display,
.title {
  font-family: var(--f-serif);
  font-weight: 500;
  letter-spacing: -.01em;
  color: var(--c-text);
  text-wrap: balance;
}

.display {
  display: flex;
  flex-direction: column;
  font-size: clamp(2.6rem, 5.2vw + 1rem, 5.25rem);
  line-height: 1.02;
}

.title {
  display: flex;
  flex-direction: column;
  font-size: clamp(2.1rem, 3vw + 1.1rem, 3.6rem);
  line-height: 1.08;
}
.center .title, .title.center { align-items: center; }
.title-sm { font-size: clamp(1.9rem, 2vw + 1.2rem, 2.6rem); }

.display-accent,
.title-accent {
  font-style: italic;
  font-weight: 400;
  color: var(--c-gold);
}

.lead {
  font-size: clamp(1.0625rem, .4vw + 1rem, 1.25rem);
  line-height: 1.7;
  color: var(--c-muted);
}
.lead-sm { font-size: 1.15rem; color: var(--c-text); }

.prose p { color: var(--c-muted); }
.prose p + p { margin-top: 1.1em; }

/* ---------- Botões e links ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .6rem;
  min-height: 3.25rem;
  padding: .85rem 1.9rem;
  border: 1px solid transparent;
  border-radius: 999px;
  font-family: var(--f-sans);
  font-size: .95rem;
  font-weight: 600;
  letter-spacing: .02em;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: background-color .25s var(--ease), box-shadow .25s var(--ease), transform .25s var(--ease);
}

.btn-primary {
  background: var(--c-gold);
  color: var(--c-bg);
  box-shadow: 0 0 0 0 rgba(223, 189, 133, 0);
}
.btn-primary:hover {
  background: var(--c-gold-2);
  box-shadow: 0 10px 34px -10px rgba(223, 189, 133, .55);
}
.btn-primary:active { transform: translateY(1px); }
.btn-primary:focus-visible { outline-color: var(--c-text); border-radius: 999px; }

.btn-lg { min-height: 3.6rem; padding-inline: 2.4rem; font-size: 1rem; }

.btn-icon { width: 1.25rem; height: 1.25rem; fill: currentColor; flex: none; }

.link-arrow {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  min-height: 2.75rem;
  color: var(--c-text);
  font-weight: 500;
  font-size: .95rem;
  text-decoration: underline;
  text-decoration-color: var(--c-line-gold);
  transition: color .2s var(--ease), text-decoration-color .2s var(--ease);
}
.link-arrow span { transition: transform .25s var(--ease); }
.link-arrow:hover { color: var(--c-gold); text-decoration-color: var(--c-gold); }
.link-arrow:hover span { transform: translateX(3px); }

.pill {
  display: inline-block;
  padding: .35rem .9rem;
  border: 1px solid var(--c-line-gold);
  border-radius: 999px;
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--c-gold);
}

/* ---------- Marca ---------- */
.brand {
  display: inline-flex;
  align-items: center;
  gap: .8rem;
  min-width: 0;
  text-decoration: none;
  color: var(--c-text);
}
.brand-mark {
  width: 1.75rem;
  height: 2.85rem;           /* proporção do símbolo: 253 × 410 */
  flex: none;
  fill: var(--c-gold);
}
.brand-text {
  display: flex;
  flex-direction: column;
  min-width: 0;
  line-height: 1.15;
}
.brand-name {
  font-family: var(--f-serif);
  font-size: 1.5rem;
  font-weight: 600;
  letter-spacing: .01em;
}
.brand-role {
  margin-top: .2rem;
  font-size: .66rem;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--c-muted);
}

/* ---------- Cabeçalho ---------- */
.site-header {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 50;
  transition: background-color .35s var(--ease), border-color .35s var(--ease);
  border-bottom: 1px solid transparent;
}
.site-header.is-scrolled,
.site-header.is-open {
  background: rgba(16, 14, 37, .94);
  border-bottom-color: var(--c-line);
}

.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: var(--header-h);
}

.site-nav ul {
  display: flex;
  align-items: center;
  gap: clamp(1rem, 2.2vw, 2.25rem);
  margin: 0;
  padding: 0;
  list-style: none;
}
.site-nav a {
  display: inline-flex;
  align-items: center;
  min-height: 2.75rem;
  font-size: .9rem;
  font-weight: 500;
  color: var(--c-muted);
  text-decoration: none;
  transition: color .2s var(--ease);
}
.site-nav a:hover { color: var(--c-text); }
.site-nav a[aria-current="true"] { color: var(--c-text); }

.site-nav .nav-cta {
  padding: 0 1.25rem;
  border: 1px solid var(--c-line-gold);
  border-radius: 999px;
  color: var(--c-gold);
  transition: background-color .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease);
}
.site-nav .nav-cta:hover { background: var(--c-gold); border-color: var(--c-gold); color: var(--c-bg); }
.site-nav .nav-cta:focus-visible { border-radius: 999px; }

.nav-toggle {
  display: none;
  position: relative;
  flex: none;
  width: 2.75rem;
  height: 2.75rem;
  padding: 0;
  border: 1px solid var(--c-line);
  border-radius: 999px;
  background: transparent;
  color: var(--c-text);
  cursor: pointer;
}
.nav-toggle:focus-visible { border-radius: 999px; }
.nav-toggle-bars,
.nav-toggle-bars::before,
.nav-toggle-bars::after {
  position: absolute;
  left: 50%;
  width: 1.1rem;
  height: 1.5px;
  margin-left: -.55rem;
  background: currentColor;
  border-radius: 2px;
  transition: transform .3s var(--ease), opacity .2s var(--ease);
}
.nav-toggle-bars { top: 50%; margin-top: -.75px; }
.nav-toggle-bars::before,
.nav-toggle-bars::after { content: ""; left: 0; margin-left: 0; }
.nav-toggle-bars::before { transform: translateY(-5px); }
.nav-toggle-bars::after { transform: translateY(5px); }
.nav-toggle[aria-expanded="true"] .nav-toggle-bars { background: transparent; }
.nav-toggle[aria-expanded="true"] .nav-toggle-bars::before { transform: rotate(45deg); background: var(--c-text); }
.nav-toggle[aria-expanded="true"] .nav-toggle-bars::after { transform: rotate(-45deg); background: var(--c-text); }

@media (max-width: 54.99rem) {
  .nav-toggle { display: block; }

  .site-nav {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: rgba(16, 14, 37, .98);
    border-bottom: 1px solid var(--c-line);
    padding: .5rem var(--gutter) 1.5rem;
  }
  .js .site-nav { display: none; }
  .js .site-header.is-open .site-nav { display: block; }

  .site-nav ul { flex-direction: column; align-items: stretch; gap: 0; }
  .site-nav li + li { border-top: 1px solid var(--c-line); }
  .site-nav a { width: 100%; min-height: 3.25rem; font-size: 1rem; color: var(--c-text); }
  .site-nav li:last-child { border-top: 0; padding-top: 1rem; }
  .site-nav .nav-cta { justify-content: center; }
}

/* Sem JS, o menu fica visível abaixo do cabeçalho (não some) */
@media (max-width: 54.99rem) {
  html:not(.js) .site-header { position: static; background: var(--c-bg); }
  html:not(.js) .site-nav { position: static; padding-inline: 0; }
}

@media (max-width: 23.75rem) {
  .brand { gap: .6rem; }
  .brand-mark { width: 1.45rem; height: 2.35rem; }
  .brand-name { font-size: 1.3rem; }
  .brand-role { font-size: .58rem; letter-spacing: .1em; }
}

/* ---------- Seções (base) ---------- */
.section {
  position: relative;
  padding-block: var(--section-y);
  overflow-x: clip;
}

/* Linha de transição violeta entre seções */
.section::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: min(42rem, 80%);
  height: 1px;
  transform: translateX(-50%);
  background: linear-gradient(90deg, transparent, rgba(97, 67, 163, .75), rgba(223, 189, 133, .35), rgba(97, 67, 163, .75), transparent);
}

/* Estrelas discretas e estáticas nas seções calmas */
.stars-soft,
.proposta,
.mentoria,
.contato {
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='420' height='420'%3E%3Cg fill='%23F4EEE6'%3E%3Ccircle cx='24' cy='38' r='.8' opacity='.5'/%3E%3Ccircle cx='118' cy='92' r='.6' opacity='.35'/%3E%3Ccircle cx='212' cy='22' r='1' opacity='.4'/%3E%3Ccircle cx='330' cy='70' r='.7' opacity='.45'/%3E%3Ccircle cx='398' cy='160' r='.9' opacity='.3'/%3E%3Ccircle cx='60' cy='210' r='.7' opacity='.4'/%3E%3Ccircle cx='170' cy='260' r='1.1' opacity='.25'/%3E%3Ccircle cx='280' cy='200' r='.6' opacity='.45'/%3E%3Ccircle cx='360' cy='300' r='.8' opacity='.35'/%3E%3Ccircle cx='96' cy='350' r='.6' opacity='.4'/%3E%3Ccircle cx='240' cy='380' r='.9' opacity='.3'/%3E%3Ccircle cx='400' cy='402' r='.6' opacity='.4'/%3E%3C/g%3E%3Ccircle cx='300' cy='130' r='1.2' fill='%23DFBD85' opacity='.45'/%3E%3Ccircle cx='140' cy='170' r='1' fill='%23DFBD85' opacity='.3'/%3E%3C/svg%3E");
  background-size: 420px 420px;
}

/* ---------- 2. Abertura ---------- */
.hero {
  position: relative;
  isolation: isolate;
  min-height: 100svh;
  display: flex;
  align-items: center;
  padding-top: calc(var(--header-h) + clamp(2rem, 6vw, 4rem));
  padding-bottom: clamp(4rem, 8vw, 6rem);
  overflow-x: clip;
  background: var(--c-bg);
}

.starfield {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
}

.hero-nebula {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    /* nebulosa violeta atrás do retrato */
    radial-gradient(42rem 34rem at 78% 42%, rgba(97, 67, 163, .55), transparent 65%),
    radial-gradient(22rem 18rem at 88% 18%, rgba(140, 96, 205, .28), transparent 70%),
    /* brilho dourado suave */
    radial-gradient(18rem 14rem at 66% 78%, rgba(223, 189, 133, .12), transparent 70%),
    /* área calma atrás do texto */
    radial-gradient(48rem 40rem at 18% 55%, rgba(16, 14, 37, .92), transparent 70%),
    /* esmaecer para a próxima seção */
    linear-gradient(180deg, transparent 70%, var(--c-bg) 100%);
}

/* Galáxia espiral discreta */
.galaxy {
  position: absolute;
  z-index: -1;
  top: 50%;
  right: -10rem;
  width: 46rem;
  max-width: none;
  height: auto;
  transform: translateY(-55%) rotate(-18deg);
  pointer-events: none;
  opacity: .55;
}
.galaxy .arm {
  fill: none;
  stroke: var(--c-gold);
  stroke-width: 1;
  stroke-linecap: round;
  opacity: .35;
}
.galaxy .arm-soft { stroke: #9C82D6; stroke-width: 6; opacity: .1; }
.galaxy-core { fill: var(--c-gold); opacity: .35; }

.hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr);
  align-items: center;
  gap: clamp(2.5rem, 6vw, 6rem);
}

.hero-copy { max-width: 36rem; }
.hero-copy .display { margin-bottom: 1.75rem; }
.hero-copy .lead { max-width: 34rem; }

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem 2rem;
  margin-top: 2.5rem;
}

/* Retrato com topo arredondado e órbitas */
.portrait {
  position: relative;
  justify-self: center;
  width: min(100%, 22rem);
  padding: 2.25rem 1.75rem;
}

.portrait-frame {
  position: relative;
  aspect-ratio: 340 / 500;
  overflow: hidden;
  /* topo em semicírculo exato para a proporção 340×500 */
  border-radius: 50% 50% 1.75rem 1.75rem / 34% 34% 1.75rem 1.75rem;
  border: 1px solid var(--c-line-gold);
  box-shadow: 0 30px 80px -30px rgba(97, 67, 163, .8), 0 0 0 8px rgba(16, 14, 37, .5);
  background: var(--c-bg-2);
}
.portrait-frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.portrait-frame::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 30%;
  background: linear-gradient(180deg, transparent, rgba(16, 14, 37, .45));
  pointer-events: none;
}

.orbits {
  position: absolute;
  max-width: none;
  inset: -4% -14%;
  width: 128%;
  height: 108%;
  pointer-events: none;
  overflow: visible;
}
.orbit-g {
  transform-box: view-box;
  transform-origin: 250px 300px;
}
.orbit {
  fill: none;
  stroke: var(--c-gold);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}
.orbit-1 { opacity: .35; }
.orbit-2 { opacity: .22; stroke: #9C82D6; }
.orbit-3 { opacity: .16; stroke-dasharray: 2 7; }
.orbit-dot { fill: var(--c-gold); }
.dot-2 { fill: var(--c-text); opacity: .8; }
.dot-3 { opacity: .7; }

@media (max-width: 54.99rem) {
  .hero { min-height: 0; }
  .hero-grid { grid-template-columns: minmax(0, 1fr); text-align: left; }
  .hero-copy { max-width: none; }
  .portrait { width: min(100%, 19rem); }
  .hero-nebula {
    background:
      radial-gradient(30rem 26rem at 70% 78%, rgba(97, 67, 163, .55), transparent 65%),
      radial-gradient(16rem 14rem at 85% 10%, rgba(140, 96, 205, .25), transparent 70%),
      radial-gradient(30rem 24rem at 20% 25%, rgba(16, 14, 37, .9), transparent 70%),
      linear-gradient(180deg, transparent 80%, var(--c-bg) 100%);
  }
  .galaxy { top: auto; bottom: -6rem; right: -16rem; width: 34rem; transform: rotate(-18deg); }
}

/* ---------- 3. Proposta ---------- */
.proposta { background-color: var(--c-bg-2); }

.dimensions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .35rem .85rem;
  margin-bottom: 1.75rem;
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--c-gold);
}
.dimensions span[aria-hidden] { color: var(--c-violet); }

.pillars {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 1rem;
  margin-top: clamp(3rem, 6vw, 4.5rem);
  list-style: none;
}

.pillar {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  padding: 1.75rem .5rem;
  text-align: center;
  font-size: .8rem;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--c-muted);
  min-width: 0;
}
.pillar + .pillar { border-left: 1px solid var(--c-line); }

.pillar-icon {
  width: 3rem;
  height: 3rem;
  fill: none;
  stroke: var(--c-gold);
  stroke-width: 1.3;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.pillar-icon .fill { fill: var(--c-gold); stroke: none; }

@media (max-width: 54.99rem) {
  .pillars { grid-template-columns: repeat(6, minmax(0, 1fr)); row-gap: 0; }
  .pillar { grid-column: span 2; }
  .pillar:nth-child(4) { grid-column: 2 / span 2; }
  .pillar + .pillar { border-left: 0; }
}
@media (max-width: 30rem) {
  .pillars { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pillar, .pillar:nth-child(4) { grid-column: auto; }
  .pillar:last-child { grid-column: 1 / -1; }
  .pillar { font-size: .68rem; letter-spacing: .06em; }
}

/* ---------- 4. Sobre ---------- */
.sobre-grid {
  display: grid;
  grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
  gap: clamp(2.5rem, 7vw, 6.5rem);
  align-items: center;
}

.sobre-foto {
  position: relative;
  max-width: 26rem;
  justify-self: center;
  width: 100%;
}
.sobre-foto::before {
  content: "";
  position: absolute;
  inset: 1.1rem -1.1rem -1.1rem 1.1rem;
  border: 1px solid var(--c-line-gold);
  border-radius: 12rem 12rem var(--radius) var(--radius);
  pointer-events: none;
}
.sobre-foto img {
  position: relative;
  width: 100%;
  height: auto;
  aspect-ratio: 547 / 820;
  object-fit: cover;
  border-radius: 12rem 12rem var(--radius) var(--radius);
}

.sobre-texto .title { margin-bottom: 2rem; }

.sobre .trajetoria {
  position: relative;
  display: grid;
  gap: 1.1rem;
  margin: 2.5rem 0;
  padding-left: 1.5rem;
}
.trajetoria::before {
  content: "";
  position: absolute;
  left: .25rem;
  top: .5rem;
  bottom: .5rem;
  width: 1px;
  background: linear-gradient(180deg, var(--c-gold), var(--c-violet));
  opacity: .6;
}
.trajetoria li {
  position: relative;
  display: grid;
  grid-template-columns: 7.5rem minmax(0, 1fr);
  gap: .25rem 1.25rem;
  font-size: .95rem;
  line-height: 1.5;
}
.trajetoria li::before {
  content: "";
  position: absolute;
  left: -1.5rem;
  top: .45rem;
  width: .55rem;
  height: .55rem;
  border-radius: 50%;
  background: var(--c-bg);
  border: 1px solid var(--c-gold);
}
.t-quando {
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--c-gold);
  padding-top: .15rem;
}
.t-o-que { color: var(--c-text); }

@media (max-width: 30rem) {
  .trajetoria li { grid-template-columns: minmax(0, 1fr); }
}

.quote {
  padding: 1.75rem 0 0;
  border-top: 1px solid var(--c-line);
}
.quote p {
  font-family: var(--f-serif);
  font-style: italic;
  font-size: clamp(1.45rem, 1.2vw + 1.1rem, 1.9rem);
  line-height: 1.35;
  color: var(--c-text);
}
.quote footer {
  margin-top: .9rem;
  font-size: .8rem;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--c-gold);
}

@media (max-width: 54.99rem) {
  .sobre-grid { grid-template-columns: minmax(0, 1fr); }
  .sobre-foto { max-width: 19rem; margin-right: 1.1rem; }
}

/* ---------- 5. Mentoria ---------- */
.mentoria {
  background-color: var(--c-bg-2);
}
.mentoria::after {
  content: "";
  position: absolute;
  z-index: 0;
  left: 50%;
  top: 40%;
  width: 60rem;
  height: 30rem;
  transform: translate(-50%, -50%);
  background: radial-gradient(closest-side, rgba(97, 67, 163, .28), transparent);
  pointer-events: none;
}
.mentoria > .container { position: relative; z-index: 1; }

.mentoria-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 2rem clamp(2rem, 6vw, 5rem);
  align-items: end;
  margin-bottom: clamp(3rem, 6vw, 4.5rem);
}
.mentoria-intro { max-width: 30rem; }

.steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.25rem;
  counter-reset: none;
}
.step {
  position: relative;
  padding: 2.25rem 1.75rem 2rem;
  border: 1px solid var(--c-line);
  border-radius: var(--radius);
  background: linear-gradient(180deg, rgba(97, 67, 163, .14), rgba(16, 14, 37, .35));
}
.step::before {
  content: "";
  position: absolute;
  top: -1px;
  left: 1.75rem;
  right: 1.75rem;
  height: 1px;
  background: linear-gradient(90deg, var(--c-gold), transparent);
  opacity: .7;
}
.step-num {
  display: block;
  font-family: var(--f-serif);
  font-style: italic;
  font-size: 2.75rem;
  line-height: 1;
  color: var(--c-gold);
  margin-bottom: 1.25rem;
}
.step-title {
  font-family: var(--f-serif);
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1.2;
  margin-bottom: .75rem;
}
.step p { color: var(--c-muted); font-size: 1rem; }

.mentoria-close { margin-top: clamp(3rem, 6vw, 4.5rem); }
.closing {
  font-family: var(--f-serif);
  font-style: italic;
  font-size: clamp(1.6rem, 1.6vw + 1.1rem, 2.25rem);
  line-height: 1.25;
  color: var(--c-text);
  margin-bottom: 2rem;
  text-wrap: balance;
}

@media (max-width: 54.99rem) {
  .mentoria-head { grid-template-columns: minmax(0, 1fr); align-items: start; }
  .steps { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- 6. Curso ---------- */
.curso { padding-block: calc(var(--section-y) * .8); }

.curso-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.1rem;
  max-width: 38rem;
  margin-inline: auto;
  padding: clamp(2.25rem, 5vw, 3.25rem) clamp(1.5rem, 5vw, 3.5rem);
  border: 1px dashed var(--c-line-gold);
  border-radius: calc(var(--radius) * 1.5);
  text-align: center;
  background: var(--c-surface);
}
.curso-card > p:last-child { color: var(--c-muted); max-width: 30rem; }
.curso-lotus {
  width: 3.5rem;
  height: auto;
  fill: none;
  stroke: var(--c-gold);
  stroke-width: 1.2;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: .9;
}

/* ---------- 7. Dúvidas ---------- */
.duvidas .title { margin-bottom: clamp(2rem, 5vw, 3rem); }

.faq { border-top: 1px solid var(--c-line); }
.faq-item { border-bottom: 1px solid var(--c-line); }

.faq-item summary {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 4.5rem;
  padding: 1.25rem 3.25rem 1.25rem 0;
  font-family: var(--f-serif);
  font-size: clamp(1.3rem, .8vw + 1.05rem, 1.6rem);
  font-weight: 500;
  line-height: 1.3;
  cursor: pointer;
  list-style: none;
  transition: color .2s var(--ease);
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary:hover { color: var(--c-gold); }
.faq-item summary:focus-visible { outline-offset: -2px; }

/* Ícone + / − */
.faq-item summary::before,
.faq-item summary::after {
  content: "";
  position: absolute;
  right: .9rem;
  top: 50%;
  width: .9rem;
  height: 1.5px;
  background: var(--c-gold);
  transition: transform .3s var(--ease);
}
.faq-item summary::after { transform: rotate(90deg); }
.faq-item[open] summary::after { transform: rotate(0deg); }

.faq-body {
  padding: 0 3.25rem 1.75rem 0;
  color: var(--c-muted);
}
.faq-body p + p { margin-top: .75rem; }

/* Abertura suave onde o navegador suporta */
@supports (interpolate-size: allow-keywords) {
  @media (prefers-reduced-motion: no-preference) {
    .faq-item { interpolate-size: allow-keywords; }
    .faq-item::details-content {
      height: 0;
      overflow: clip;
      transition: height .35s var(--ease), content-visibility .35s allow-discrete;
    }
    .faq-item[open]::details-content { height: auto; }
  }
}

/* ---------- 8. Contato ---------- */
.contato {
  isolation: isolate;
  padding-block: calc(var(--section-y) * 1.15);
}
.contato-glow {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    radial-gradient(36rem 24rem at 50% 55%, rgba(97, 67, 163, .45), transparent 70%),
    radial-gradient(16rem 10rem at 50% 30%, rgba(223, 189, 133, .1), transparent 70%);
  pointer-events: none;
}
.contato-mark {
  width: 2.6rem;
  height: 4.2rem;
  margin: 0 auto 2rem;
  fill: var(--c-gold);
}
.contato .title { max-width: 40rem; margin-inline: auto; }
.contato .lead { margin: 1.5rem auto 2.5rem; max-width: 32rem; }

/* ---------- 9. Rodapé ---------- */
.site-footer {
  position: relative;
  background: var(--c-bg-3);
  border-top: 1px solid var(--c-line);
  padding-top: 3.5rem;
}
.footer-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  padding-bottom: 2.5rem;
}
.footer-phrase {
  flex: 1 1 18rem;
  max-width: 31rem;
  font-family: var(--f-serif);
  font-style: italic;
  font-size: 1.3rem;
  line-height: 1.4;
  color: var(--c-muted);
  text-align: center;
}
.to-top {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  min-height: 2.75rem;
  font-size: .85rem;
  font-weight: 500;
  color: var(--c-muted);
  text-decoration: none;
  transition: color .2s var(--ease);
}
.to-top:hover { color: var(--c-gold); }

.footer-bottom {
  padding-block: 1.5rem;
  border-top: 1px solid var(--c-line);
  font-size: .8rem;
  color: var(--c-muted);
}

@media (max-width: 54.99rem) {
  .footer-inner { flex-direction: column; align-items: flex-start; }
  .footer-phrase { text-align: left; flex-basis: auto; }
  .footer-bottom { text-align: left; }
}

/* ---------- Aviso demonstrativo ---------- */
.demo-dialog {
  width: min(26rem, calc(100% - 2rem));
  padding: 2.25rem 2rem 2rem;
  border: 1px solid var(--c-line-gold);
  border-radius: calc(var(--radius) * 1.25);
  background: var(--c-bg-2);
  color: var(--c-text);
  text-align: center;
  box-shadow: 0 30px 80px -20px rgba(0, 0, 0, .6);
}
.demo-dialog::backdrop { background: rgba(8, 7, 20, .78); }
.demo-dialog h2 {
  font-family: var(--f-serif);
  font-size: 1.9rem;
  font-weight: 500;
  line-height: 1.2;
  margin-bottom: .75rem;
}
.demo-dialog p { color: var(--c-muted); font-size: .98rem; margin-bottom: 1.75rem; }
.dialog-mark { width: 1.6rem; height: 2.6rem; margin: 0 auto 1.25rem; fill: var(--c-gold); }

/* ---------- Movimento ---------- */
@media (prefers-reduced-motion: no-preference) {
  .js .reveal {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity .9s var(--ease), transform .9s var(--ease);
  }
  .js .reveal.is-visible { opacity: 1; transform: none; }

  .steps .step:nth-child(2), .pillars .pillar:nth-child(2) { transition-delay: .08s; }
  .steps .step:nth-child(3), .pillars .pillar:nth-child(3) { transition-delay: .16s; }
  .pillars .pillar:nth-child(4) { transition-delay: .24s; }
  .pillars .pillar:nth-child(5) { transition-delay: .32s; }

  .orbit-g-1 { animation: orbit-sway 26s ease-in-out infinite alternate; }
  .orbit-g-2 { animation: orbit-spin 120s linear infinite; }
  .orbit-g-3 { animation: orbit-sway 34s ease-in-out infinite alternate-reverse; }
  .orbit-dot { animation: twinkle 5s ease-in-out infinite; }
  .dot-2 { animation-delay: -1.6s; }
  .dot-3 { animation-delay: -3.2s; }

  .hero-copy > * { animation: rise 1s var(--ease) both; }
  .hero-copy > :nth-child(2) { animation-delay: .1s; }
  .hero-copy > :nth-child(3) { animation-delay: .2s; }
  .hero-copy > :nth-child(4) { animation-delay: .3s; }
  .portrait { animation: fade 1.4s var(--ease) .15s both; }
}

@keyframes orbit-spin { to { transform: rotate(-360deg); } }
@keyframes orbit-sway { from { transform: rotate(-4deg); } to { transform: rotate(5deg); } }
@keyframes twinkle { 0%, 100% { opacity: .9; } 50% { opacity: .3; } }
@keyframes rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes fade { from { opacity: 0; } to { opacity: 1; } }
