/* ============================================================
   IKIGAI · SITE · camada de layout e movimento
   Sobre ikigai-design-system.css (cores, fontes, espaçamento da marca).
   Visão: página de abertura imersiva e escura, tipografia grande,
   seções que alternam entre o roxo profundo e o papel, cantos retos.
   ============================================================ */

:root{
  --header-h: 76px;
  --maxw: 1240px;
  --gut: clamp(20px, 4vw, 48px);
  --ease: cubic-bezier(.2,.7,.2,1);
}

html{ scroll-behavior: smooth; }
body{
  font-weight: 400;
  font-size: 17px;
  line-height: 1.6;
  overflow-x: hidden;
}
img{ max-width: 100%; display: block; }
a{ color: inherit; }
::selection{ background: var(--roxo); color: var(--papel); }

.skip{
  position: absolute; left: 16px; top: -60px; z-index: 200;
  background: var(--papel); color: var(--prof); padding: 10px 16px; border-radius: var(--raio);
}
.skip:focus{ top: 12px; }

:focus-visible{ outline: 2px solid var(--roxo); outline-offset: 3px; }
.sec--dark :focus-visible, .hero :focus-visible, .site-footer :focus-visible, .menu-m :focus-visible{ outline-color: var(--lilas); }

.container{ width: 100%; max-width: var(--maxw); margin: 0 auto; padding-inline: var(--gut); }
.narrow{ max-width: 760px; }

/* ---------- Tipografia ---------- */
.eyebrow{
  font-size: 12px; letter-spacing: .18em; text-transform: uppercase;
  color: var(--roxo); font-weight: 600;
}
.sec--dark .eyebrow, .hero .eyebrow{ color: var(--lilas); }
.display{
  font-family: var(--display); font-weight: 400;
  letter-spacing: -.02em; line-height: 1.06; text-wrap: balance;
}
.h-xl{ font-size: clamp(38px, 6.2vw, 84px); }
.h-lg{ font-size: clamp(30px, 4.4vw, 56px); }
.h-md{ font-size: clamp(24px, 3vw, 36px); }
.lead{ font-size: clamp(18px, 1.7vw, 22px); line-height: 1.55; color: var(--cinza); max-width: 58ch; }
.sec--dark .lead, .hero .lead{ color: var(--lilas); }
.prose p{ max-width: 62ch; margin-top: 1em; }
.prose p:first-child{ margin-top: 0; }
.prose ul{ margin: 1em 0 0 1.2em; max-width: 62ch; }
.prose li{ margin-top: .45em; }
.muted{ color: var(--cinza); }
.sec--dark .muted{ color: var(--lilas-fraco); }

/* ---------- Botões ---------- */
.btn{
  --bg: var(--prof); --fg: var(--papel); --bd: var(--prof);
  display: inline-flex; align-items: center; justify-content: center; gap: .6em;
  padding: 16px 28px; min-height: 52px;
  background: var(--bg); color: var(--fg); border: 1px solid var(--bd); border-radius: var(--raio);
  font: 600 15px/1 var(--corpo); letter-spacing: .02em; text-decoration: none; cursor: pointer;
  transition: background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease), transform .25s var(--ease);
}
.btn::after{ content: "\2192"; transition: transform .25s var(--ease); }
.btn:hover::after{ transform: translateX(4px); }
.btn:hover{ --bg: var(--roxo); --bd: var(--roxo); }
.btn--light{ --bg: var(--papel); --fg: var(--prof); --bd: var(--papel); }
.btn--light:hover{ --bg: var(--lilas); --bd: var(--lilas); --fg: var(--prof); }
.btn--ghost{ --bg: transparent; --fg: currentColor; --bd: color-mix(in srgb, currentColor 45%, transparent); }
.btn--ghost:hover{ --bg: color-mix(in srgb, currentColor 12%, transparent); --bd: currentColor; --fg: currentColor; }
.btn--sm{ padding: 11px 18px; min-height: 42px; font-size: 14px; }
.btn--plain::after{ content: none; }
.btn[disabled]{ opacity: .6; cursor: progress; }
.btnrow{ display: flex; flex-wrap: wrap; gap: 14px; margin-top: 32px; }

.link-seta{
  display: inline-flex; gap: .5em; align-items: center; font-weight: 600; font-size: 15px;
  text-decoration: none; color: var(--roxo); border-bottom: 1px solid currentColor; padding-bottom: 2px;
}
.link-seta::after{ content: "\2192"; transition: transform .25s var(--ease); }
.link-seta:hover::after{ transform: translateX(4px); }
.sec--dark .link-seta{ color: var(--lilas); }

/* ---------- Cabeçalho: box arredondado flutuante, em vidro ---------- */
.site-header{
  position: fixed; top: 12px; left: 0; right: 0; z-index: 100; height: 64px; pointer-events: none;
  color: var(--papel); transition: color .3s var(--ease);
}
.hbox{
  pointer-events: auto; width: min(1200px, calc(100% - 2 * var(--gut))); height: 100%; margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 0 10px 0 26px;
  border-radius: 22px; border: 1px solid rgba(255, 255, 255, .16);
  background: color-mix(in srgb, #24101f 42%, transparent);
  backdrop-filter: saturate(1.5) blur(18px); -webkit-backdrop-filter: saturate(1.5) blur(18px);
  box-shadow: 0 18px 40px -24px rgba(10, 4, 12, .6);
  transition: background .3s var(--ease), border-color .3s var(--ease), box-shadow .3s var(--ease);
}
.site-header.is-solid{ color: var(--tinta); }
.site-header.is-solid .hbox{
  background: color-mix(in srgb, var(--papel) 84%, transparent); border-color: color-mix(in srgb, var(--giz) 90%, transparent);
  box-shadow: 0 18px 40px -26px rgba(36, 29, 38, .45);
}
.site-header.is-light{ color: var(--tinta); }
.logo{ display: block; width: 138px; height: 24px; position: relative; flex: none; }
.logo img{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; object-position: left center; transition: opacity .3s var(--ease); }
.logo .l-escuro{ opacity: 0; }
.site-header.is-solid .l-claro, .site-header.is-light .l-claro{ opacity: 0; }
.site-header.is-solid .l-escuro, .site-header.is-light .l-escuro{ opacity: 1; }
.nav-d{ display: flex; align-items: center; gap: clamp(18px, 2.4vw, 36px); }
.nav-d a.nl{
  text-decoration: none; font-size: 14.5px; font-weight: 500; letter-spacing: .01em; position: relative; padding: 6px 0;
}
.nav-d a.nl::after{
  content: ""; position: absolute; left: 0; right: 100%; bottom: 0; height: 1px; background: currentColor;
  transition: right .3s var(--ease);
}
.nav-d a.nl:hover::after, .nav-d a.nl[aria-current="page"]::after{ right: 0; }
.site-header .btn{ --bg: var(--papel); --fg: var(--prof); --bd: var(--papel); border-radius: 14px; }
.site-header.is-solid .btn, .site-header.is-light .btn{ --bg: var(--prof); --fg: var(--papel); --bd: var(--prof); }
.site-header .btn:hover{ --bg: var(--roxo); --bd: var(--roxo); --fg: var(--papel); }
.burger{
  display: none; width: 46px; height: 46px; background: none; border: 0; color: inherit; cursor: pointer; position: relative;
}
.burger span{ position: absolute; left: 11px; right: 11px; height: 2px; background: currentColor; transition: transform .3s var(--ease), opacity .2s; }
.burger span:nth-child(1){ top: 16px; } .burger span:nth-child(2){ top: 22px; } .burger span:nth-child(3){ top: 28px; }
.menu-open .burger span:nth-child(1){ transform: translateY(6px) rotate(45deg); }
.menu-open .burger span:nth-child(2){ opacity: 0; }
.menu-open .burger span:nth-child(3){ transform: translateY(-6px) rotate(-45deg); }

.menu-m{
  position: fixed; inset: 0; z-index: 90; background: var(--prof); color: var(--papel);
  padding: calc(var(--header-h) + 24px) var(--gut) 40px;
  display: flex; flex-direction: column; gap: 6px; overflow-y: auto;
  opacity: 0; visibility: hidden; transition: opacity .3s var(--ease), visibility .3s;
}
.menu-open .menu-m{ opacity: 1; visibility: visible; }
.menu-open .site-header{ color: var(--papel); }
.menu-open .hbox{ background: transparent; border-color: transparent; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
.menu-open .site-header .l-claro{ opacity: 1 !important; } .menu-open .site-header .l-escuro{ opacity: 0 !important; }
.menu-m a.ml{
  font-family: var(--display); font-size: clamp(32px, 9vw, 48px); line-height: 1.15; text-decoration: none;
  padding: 10px 0; border-bottom: 1px solid color-mix(in srgb, var(--lilas) 25%, transparent);
}
.menu-m .btn{ margin-top: 24px; align-self: flex-start; }
.menu-m .rodape-m{ margin-top: auto; padding-top: 32px; color: var(--lilas); font-size: 15px; }

@media (max-width: 960px){
  .nav-d{ display: none; }
  .burger{ display: block; }
  .site-header .btn.topo-btn{ display: none; }
  .hbox{ padding: 0 6px 0 20px; border-radius: 20px; }
}

/* ---------- Topo (hero) ---------- */
.hero{
  position: relative; isolation: isolate; color: var(--papel); background: var(--prof);
  min-height: min(100svh, 940px); display: flex; align-items: flex-end;
  padding: calc(var(--header-h) + 40px) 0 clamp(56px, 8vw, 96px); overflow: hidden;
}
.hero__bg{ position: absolute; inset: 0; z-index: -2; }
.hero__bg img, .hero__bg video{
  width: 100%; height: 118%; object-fit: cover; object-position: 6% 20%; will-change: transform;
}
.hero::before{
  content: ""; position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(90deg, rgba(36,18,38,.94) 0%, rgba(44,22,46,.72) 30%, rgba(54,28,56,.12) 56%, transparent 72%),
    linear-gradient(270deg, rgba(36,18,38,.92) 0%, rgba(36,18,38,.5) 9%, transparent 22%),
    linear-gradient(0deg, rgba(36,18,38,.72) 0%, transparent 34%);
}
.hero__txt{ max-width: 660px; }
@media (min-width: 1600px){ .hero__txt{ max-width: 600px; } }
.hero h1{ margin-top: 20px; color: var(--papel); }
.hero .lead{ margin-top: 26px; max-width: 52ch; color: #e7dbe6; }
.hero .nota{ margin-top: 18px; font-size: 14px; color: var(--lilas); }
@media (max-width: 900px){
  .hero{ display: block; min-height: 0; padding: 0 0 clamp(48px, 10vw, 72px); }
  .hero::before{ display: none; }
  .hero__bg{ position: relative; inset: auto; height: min(92vw, 540px); }
  .hero__bg img, .hero__bg video{ height: 100%; object-position: 60% 14%; }
  .hero__bg::after{ content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, var(--prof) 0%, rgba(78,42,75,.55) 22%, transparent 56%), linear-gradient(180deg, rgba(36,18,38,.55) 0%, transparent 26%); }
  .hero .container{ position: relative; margin-top: -72px; }
  .hero h1{ font-size: clamp(32px, 8.4vw, 44px); }
}

/* ---------- Números ---------- */
.provas{ background: var(--prof); color: var(--papel); border-top: 1px solid color-mix(in srgb, var(--lilas) 22%, transparent); }
.provas__grid{ display: grid; grid-template-columns: repeat(4, 1fr); }
.provas__it{ padding: 34px 24px 34px 0; display: flex; flex-direction: column; gap: 6px; }
.provas__it + .provas__it{ padding-left: 24px; border-left: 1px solid color-mix(in srgb, var(--lilas) 22%, transparent); }
.provas__n{ font-family: var(--display); font-size: clamp(40px, 5vw, 64px); line-height: 1; letter-spacing: -.02em; }
.provas__t{ font-size: 14.5px; color: var(--lilas); max-width: 22ch; line-height: 1.4; }
.provas__frase{ max-width: 62ch; margin: 0 auto; padding: 8px 0 40px; text-align: center; font-size: clamp(18px, 2vw, 24px); line-height: 1.4; color: var(--lilas); }
@media (max-width: 800px){
  .provas__grid{ grid-template-columns: 1fr 1fr; }
  .provas__it:nth-child(3){ padding-left: 0; border-left: 0; }
  .provas__it:nth-child(n+3){ border-top: 1px solid color-mix(in srgb, var(--lilas) 22%, transparent); }
}

/* ---------- Faixa de perguntas (marquee) ---------- */
.marquee{ background: var(--tinta); color: var(--lilas); overflow: hidden; padding: 20px 0; }
.marquee__trk{ display: flex; width: max-content; animation: marq 55s linear infinite; }
.marquee:hover .marquee__trk{ animation-play-state: paused; }
.marquee__grp{ display: flex; align-items: center; flex: none; }
.marquee__it{ font-family: var(--display); font-size: clamp(20px, 2.2vw, 28px); padding: 0 28px; white-space: nowrap; }
.marquee__it::after{ content: "\2022"; margin-left: 56px; color: var(--roxo); }
@keyframes marq{ to{ transform: translateX(-50%); } }

/* ---------- Seções ---------- */
.sec{ padding-block: clamp(72px, 10vw, 148px); position: relative; }
.sec--dark{ background: var(--prof); color: var(--papel); }
.sec--nevoa{ background: var(--nevoa); }
.sec--tinta{ background: var(--tinta); color: var(--papel); }
.sec--compact{ padding-block: clamp(48px, 6vw, 80px); }
.sec__head{ max-width: 820px; margin-bottom: clamp(40px, 6vw, 72px); }
.sec__head .display{ margin-top: 16px; }
.sec__head .lead{ margin-top: 20px; }

/* Dúvidas */
.duvidas{ display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--giz); }
.duvida{
  padding: clamp(28px, 4vw, 52px) clamp(0px, 2vw, 28px) clamp(28px, 4vw, 52px) 0;
  border-bottom: 1px solid var(--giz);
  font-family: var(--display); font-size: clamp(24px, 2.8vw, 38px); line-height: 1.18; letter-spacing: -.01em;
  transition: color .3s var(--ease);
}
.duvida:nth-child(even){ padding-left: clamp(0px, 3vw, 40px); border-left: 1px solid var(--giz); }
.duvida:hover{ color: var(--roxo); }
.duvidas__fecho{ margin-top: 40px; max-width: 60ch; font-size: clamp(18px, 1.8vw, 22px); color: var(--cinza); }
@media (max-width: 760px){
  .duvidas{ grid-template-columns: 1fr; }
  .duvida:nth-child(even){ padding-left: 0; border-left: 0; }
}

/* Passos */
.passos{ display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(24px, 4vw, 56px); counter-reset: p; }
.passo{ border-top: 2px solid var(--prof); padding-top: 28px; }
.passo__n{ font-family: var(--display); font-size: clamp(56px, 7vw, 96px); line-height: .9; color: var(--roxo); letter-spacing: -.03em; }
.passo h3{ font-size: clamp(22px, 2.2vw, 28px); margin-top: 18px; }
.passo p{ margin-top: 12px; color: var(--cinza); max-width: 34ch; }
.nota-fim{ margin-top: 48px; padding-top: 24px; border-top: 1px solid var(--giz); color: var(--cinza); max-width: 70ch; }
@media (max-width: 800px){ .passos{ grid-template-columns: 1fr; } }

/* Caminhos */
.caminhos{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.cam{
  position: relative; display: flex; flex-direction: column; justify-content: space-between; gap: 40px; min-height: 340px;
  padding: 30px 26px; text-decoration: none; background: #fff; border: 1px solid var(--giz); border-radius: var(--raio);
  transition: transform .4s var(--ease), box-shadow .4s var(--ease), background .3s var(--ease), color .3s var(--ease), border-color .3s;
}
.cam:hover{ transform: translateY(-6px); box-shadow: 0 28px 48px -30px rgba(36,29,38,.45); border-color: var(--lilas); }
.cam__t{ font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--roxo); font-weight: 600; }
.cam h3{ font-size: clamp(24px, 2.2vw, 30px); margin-top: 14px; line-height: 1.12; }
.cam p{ margin-top: 14px; color: var(--cinza); font-size: 16px; }
.cam__go{ font-weight: 600; font-size: 15px; display: inline-flex; gap: .5em; align-items: center; color: var(--prof); }
.cam__go::after{ content: "\2192"; transition: transform .25s var(--ease); }
.cam:hover .cam__go::after{ transform: translateX(5px); }
.cam--forte{ background: var(--prof); color: var(--papel); border-color: var(--prof); }
.cam--forte .cam__t{ color: var(--lilas); } .cam--forte p{ color: var(--lilas); } .cam--forte .cam__go{ color: var(--papel); }
.cam--forte:hover{ background: var(--roxo); border-color: var(--roxo); }
.cam--forte:hover p, .cam--forte:hover .cam__t{ color: #efe3ee; }
@media (max-width: 1100px){ .caminhos{ grid-template-columns: 1fr 1fr; } }
.caminhos--3{ grid-template-columns: repeat(3, 1fr); }
@media (max-width: 860px){ .caminhos--3{ grid-template-columns: 1fr; } }
@media (max-width: 600px){ .caminhos{ grid-template-columns: 1fr; } .cam{ min-height: 0 !important; } }

/* Aulas */
.aulas{ display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.aula{
  display: flex; flex-direction: column; gap: 22px; padding: clamp(28px, 3.4vw, 48px);
  background: color-mix(in srgb, var(--papel) 6%, var(--prof)); border: 1px solid color-mix(in srgb, var(--lilas) 26%, transparent);
  border-radius: var(--raio); transition: border-color .3s, transform .4s var(--ease);
}
.aula:hover{ border-color: var(--lilas); transform: translateY(-4px); }
.aula__tag{
  align-self: flex-start; font-size: 11.5px; letter-spacing: .16em; text-transform: uppercase; font-weight: 600;
  padding: 6px 12px; border: 1px solid color-mix(in srgb, var(--lilas) 50%, transparent); color: var(--lilas); border-radius: var(--raio);
}
.aula{ color: var(--papel); }
.aula h2, .aula h3, .aula .display{ font-size: clamp(26px, 2.8vw, 38px); line-height: 1.1; color: var(--papel); }
.aula__preco{ font-family: var(--display); font-size: 30px; color: var(--papel); }
.aula p{ color: #e2d6e1; max-width: 46ch; }
.aula__rod{ margin-top: auto; display: flex; flex-wrap: wrap; align-items: center; gap: 18px; padding-top: 14px; }
.aula__preco{ font-family: var(--display); font-size: 30px; }
@media (max-width: 860px){ .aulas{ grid-template-columns: 1fr; } }

/* Sobre (divisão) */
.split{ display: grid; grid-template-columns: 5fr 7fr; gap: clamp(32px, 6vw, 96px); align-items: center; }
.split--rev{ grid-template-columns: 7fr 5fr; }
.retrato{ position: relative; aspect-ratio: 4 / 5; overflow: hidden; border-radius: var(--raio); background: var(--prof); }
.retrato img{ width: 100%; height: 100%; object-fit: cover; object-position: 51% 20%; transform: scale(1.12); transform-origin: 70% 30%; }
.retrato::after{ content: ""; position: absolute; inset: 0; box-shadow: inset 0 0 0 1px rgba(36,29,38,.08); pointer-events: none; }
@media (max-width: 860px){ .split, .split--rev{ grid-template-columns: 1fr; } .retrato{ max-width: 420px; } }

/* Redes */
.redes{ display: flex; flex-wrap: wrap; gap: 14px; margin-top: 28px; }
.rede{
  display: inline-flex; align-items: center; gap: 12px; padding: 14px 20px; min-height: 52px; text-decoration: none; font-weight: 600; font-size: 15px;
  border: 1px solid var(--giz); background: #fff; color: var(--tinta); border-radius: var(--raio);
  transition: border-color .25s, transform .3s var(--ease), background .25s;
}
.rede:hover{ border-color: var(--roxo); transform: translateY(-3px); }
.rede svg{ width: 20px; height: 20px; fill: currentColor; flex: none; }
.sec--dark .rede{ background: transparent; color: var(--papel); border-color: color-mix(in srgb, var(--lilas) 40%, transparent); }
.sec--dark .rede:hover{ border-color: var(--lilas); background: color-mix(in srgb, var(--papel) 8%, transparent); }

/* Depoimentos e logos */
.depos{ display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 24px; }
.depo{ background: #fff; border: 1px solid var(--giz); border-radius: var(--raio); padding: 34px; display: flex; flex-direction: column; gap: 22px; }
.depo blockquote{ font-family: var(--display); font-size: 22px; line-height: 1.35; }
.depo cite{ font-style: normal; font-size: 14px; color: var(--cinza); }
.depo cite b{ display: block; color: var(--tinta); font-weight: 600; }
.logos{ display: flex; flex-wrap: wrap; gap: 36px 56px; align-items: center; margin-top: 8px; }
.logos img{ height: 34px; width: auto; opacity: .7; filter: grayscale(1); }

/* Conteúdo (cartões) */
.cards-conteudo{ display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 22px; }
.cc{ display: flex; flex-direction: column; gap: 14px; padding: 28px; background: #fff; border: 1px solid var(--giz); text-decoration: none; border-radius: var(--raio); transition: transform .4s var(--ease), border-color .3s; }
.cc:hover{ transform: translateY(-5px); border-color: var(--lilas); }
.cc small{ font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--roxo); font-weight: 600; }
.cc h3{ font-size: 22px; line-height: 1.2; }

/* Vídeo (YouTube leve) */
.yt{ position: relative; aspect-ratio: 16 / 9; background: var(--tinta); overflow: hidden; border-radius: var(--raio); }
.yt button{ position: absolute; inset: 0; width: 100%; border: 0; cursor: pointer; background: center / cover no-repeat; color: var(--papel); }
.yt button::before{ content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(36,18,38,.6), rgba(36,18,38,.15)); }
.yt button{ display: flex; align-items: flex-end; justify-content: flex-start; padding: 0 0 clamp(14px, 2.4vw, 26px) clamp(14px, 2.4vw, 26px); }
.yt button span{
  position: relative; display: inline-flex; width: 60px; height: 60px; border-radius: 50%; align-items: center; justify-content: center;
  background: var(--papel); color: var(--prof); font-size: 20px; padding-left: 4px; transition: transform .3s var(--ease);
}
.yt button:hover span{ transform: scale(1.08); }
.yt iframe{ position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* CTA final */
.cta-final{ background: var(--prof); color: var(--papel); overflow: hidden; isolation: isolate; }
.cta-final::before{
  content: ""; position: absolute; inset: 0; z-index: -1; opacity: .9;
  background: url("/assets/foto/tinta-sobre.jpg") center / cover; mix-blend-mode: multiply;
}
.cta-final .display{ max-width: 16ch; }
.cta-final .lead{ color: #efe3ee; }
.cta-final .eyebrow{ color: var(--lilas); }

/* FAQ */
.faq{ border-top: 1px solid var(--giz); max-width: 820px; }
.faq details{ border-bottom: 1px solid var(--giz); }
.faq summary{
  list-style: none; cursor: pointer; padding: 24px 40px 24px 0; position: relative;
  font-family: var(--display); font-size: clamp(20px, 2vw, 26px); line-height: 1.25;
}
.faq summary::-webkit-details-marker{ display: none; }
.faq summary::after{ content: "+"; position: absolute; right: 4px; top: 22px; font-size: 30px; line-height: 1; color: var(--roxo); transition: transform .3s var(--ease); }
.faq details[open] summary::after{ transform: rotate(45deg); }
.faq details p{ padding: 0 40px 26px 0; color: var(--cinza); max-width: 62ch; }

/* Página interna: topo */
.page-top{ background: var(--prof); color: var(--papel); padding: calc(var(--header-h) + clamp(56px, 8vw, 110px)) 0 clamp(56px, 8vw, 100px); position: relative; overflow: hidden; isolation: isolate; }
.page-top::before{ content: ""; position: absolute; inset: 0; z-index: -1; opacity: .9; background: url("/assets/foto/tinta-hero.jpg") 80% 40% / cover; mix-blend-mode: multiply; }
.page-top h1{ margin-top: 18px; max-width: 18ch; color: var(--papel); }
.page-top .lead{ margin-top: 24px; color: #e2d6e1; }
.migalha{ font-size: 14px; color: var(--lilas); display: flex; gap: 10px; flex-wrap: wrap; }
.migalha a{ text-decoration: none; border-bottom: 1px solid transparent; }
.migalha a:hover{ border-bottom-color: currentColor; }

/* Listas de "para quem" */
.duas{ display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.caixa{ padding: 30px; background: #fff; border: 1px solid var(--giz); border-radius: var(--raio); }
.caixa h3{ font-size: 22px; }
.caixa ul{ margin: 16px 0 0 1.1em; color: var(--cinza); }
.caixa li{ margin-top: .5em; }
.caixa--nao{ background: transparent; }
@media (max-width: 760px){ .duas{ grid-template-columns: 1fr; } }

.aviso{ margin-top: 28px; padding: 18px 22px; border: 1px solid var(--lilas); background: color-mix(in srgb, var(--lilas) 18%, transparent); border-radius: var(--raio); font-size: 15.5px; max-width: 70ch; }

/* ---------- Formulários ---------- */
.form{ display: grid; gap: 18px; }
.form .linha{ display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
@media (max-width: 640px){ .form .linha{ grid-template-columns: 1fr; } }
.campo{ display: flex; flex-direction: column; gap: 8px; }
.campo label{ font-size: 14px; font-weight: 600; color: var(--tinta); }
.campo label small{ font-weight: 400; color: var(--cinza); }
.campo input, .campo select, .campo textarea{
  width: 100%; font: 400 16px/1.4 var(--corpo); color: var(--tinta); background: #fff;
  border: 1px solid #cfc6cc; border-radius: var(--raio); padding: 14px 16px; min-height: 52px;
  transition: border-color .2s, box-shadow .2s;
}
.campo textarea{ min-height: 140px; resize: vertical; }
.campo input:focus, .campo select:focus, .campo textarea:focus{ outline: none; border-color: var(--roxo); box-shadow: 0 0 0 3px color-mix(in srgb, var(--roxo) 22%, transparent); }
.aceite{ display: flex; gap: 12px; align-items: flex-start; font-size: 14px; color: var(--cinza); }
.aceite input{ width: 20px; height: 20px; margin-top: 2px; flex: none; accent-color: var(--roxo); }
.hp{ position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form-msg{ font-size: 15px; padding: 14px 16px; border-radius: var(--raio); display: none; }
.form-msg.ok{ display: block; background: #e6f1e8; color: #1e4a30; border: 1px solid #b7d6c0; }
.form-msg.erro{ display: block; background: #f7e4e4; color: #6b1f1f; border: 1px solid #e3b4b4; }
.form-card{ background: #fff; border: 1px solid var(--giz); padding: clamp(24px, 4vw, 44px); border-radius: var(--raio); }
.cartao-wa{ display: flex; flex-direction: column; gap: 16px; padding: 30px; background: var(--prof); color: var(--papel); border-radius: var(--raio); }
.cartao-wa p{ color: var(--lilas); }
.contato-grid{ display: grid; grid-template-columns: 5fr 7fr; gap: clamp(28px, 5vw, 72px); align-items: start; }
.contato-grid--aula{ grid-template-columns: 7fr 5fr; }
@media (max-width: 900px){ .contato-grid, .contato-grid--aula{ grid-template-columns: 1fr; } }

/* ---------- Rodapé profissional ---------- */
.site-footer{
  background: var(--tinta);
  color: var(--papel);
  padding: clamp(60px, 7vw, 96px) 0 36px;
  border-top: 1px solid color-mix(in srgb, var(--lilas) 16%, transparent);
  position: relative;
  overflow: hidden;
}
.site-footer::before{
  content: "";
  position: absolute;
  top: 0; left: 10%; right: 10%; height: 1px;
  background: radial-gradient(circle, color-mix(in srgb, var(--lilas) 45%, transparent), transparent 70%);
  pointer-events: none;
}

/* Bloco superior de chamada no rodapé */
.foot-top{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  padding: clamp(26px, 3.5vw, 38px);
  background: color-mix(in srgb, var(--prof) 50%, rgba(255,255,255,.03));
  border: 1px solid color-mix(in srgb, var(--lilas) 18%, transparent);
  border-radius: var(--raio);
  margin-bottom: clamp(44px, 6vw, 68px);
}
.foot-top__txt{ max-width: 620px; }
.foot-top__tag{
  display: inline-block;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--lilas);
  margin-bottom: 8px;
}
.foot-top__tit{
  font-size: clamp(20px, 2.2vw, 26px);
  line-height: 1.2;
  letter-spacing: -.02em;
  color: var(--papel);
  margin-bottom: 8px;
}
.foot-top__desc{
  font-size: 14.5px;
  color: #cfc2ce;
  line-height: 1.5;
  margin: 0;
}
.foot-top__cta{
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  flex: none;
}
@media (max-width: 860px){
  .foot-top{ flex-direction: column; align-items: flex-start; }
  .foot-top__cta{ width: 100%; }
  .foot-top__cta .btn{ flex: 1; text-align: center; }
}

/* Grid principal de links */
.foot-grid{
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1.15fr;
  gap: clamp(32px, 3.8vw, 56px);
}
.foot-col h4{
  font-family: var(--corpo);
  font-size: 11.5px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--lilas);
  font-weight: 600;
  margin-bottom: 18px;
}
.foot-col ul{
  list-style: none;
  display: grid;
  gap: 12px;
  margin: 0;
  padding: 0;
}
.foot-col a{
  text-decoration: none;
  color: #dfd4de;
  font-size: 14.5px;
  line-height: 1.4;
  transition: color .2s, transform .2s var(--ease);
  display: inline-block;
}
.foot-col a:hover{
  color: var(--papel);
  transform: translateX(3px);
}

/* Coluna da marca */
.foot-col--marca{ max-width: 380px; }
.foot-logo{ display: inline-block; margin-bottom: 14px; }
.foot-logo img{ width: 144px; height: auto; display: block; }
.foot-selo{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 500;
  color: var(--lilas);
  background: color-mix(in srgb, var(--prof) 60%, transparent);
  border: 1px solid color-mix(in srgb, var(--lilas) 25%, transparent);
  padding: 4px 10px;
  border-radius: 999px;
  margin-bottom: 14px;
}
.foot-selo__ponto{
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #52c41a;
  box-shadow: 0 0 8px rgba(82, 196, 26, .6);
}
.foot-col--marca .foot-desc{
  font-size: 14px;
  line-height: 1.6;
  color: #cfc2ce;
  margin-bottom: 16px;
}
.foot-gallup{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 500;
  color: var(--lilas) !important;
  border-bottom: 1px dashed color-mix(in srgb, var(--lilas) 40%, transparent);
  padding-bottom: 2px;
  transition: border-color .2s, color .2s !important;
  transform: none !important;
}
.foot-gallup:hover{
  color: var(--papel) !important;
  border-bottom-color: var(--papel);
}
.foot-gallup svg{ flex: none; transition: transform .2s var(--ease); }
.foot-gallup:hover svg{ transform: translate(2px, -2px); }

/* Canais com ícones */
.foot-canais{ gap: 10px !important; }
.foot-canal{
  display: inline-flex !important;
  align-items: center;
  gap: 10px;
  color: #dfd4de;
  font-size: 14.5px;
}
.foot-canal svg{
  width: 17px;
  height: 17px;
  fill: currentColor;
  flex: none;
  opacity: .85;
}
.foot-canal:hover svg{ opacity: 1; fill: var(--lilas); }

/* Barra de encerramento */
.foot-fim{
  margin-top: clamp(48px, 6vw, 64px);
  padding-top: 24px;
  border-top: 1px solid color-mix(in srgb, var(--lilas) 16%, transparent);
  display: flex;
  flex-wrap: wrap;
  gap: 16px 32px;
  align-items: center;
  justify-content: space-between;
  color: #bfaabf;
  font-size: 13.5px;
}
.foot-fim__copy{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}
.foot-fim__copy a{
  color: #bfaabf;
  text-decoration: none;
  transition: color .2s;
}
.foot-fim__copy a:hover{ color: var(--papel); text-decoration: underline; }
.foot-fim__sep{ opacity: .4; }

/* Assinatura Primage, no mesmo padrão do site do Henrique */
.foot-primage{ margin: 0; color: #bfaabf; font-size: 12px; }
.foot-primage__coracao{ color: #e0567a; }
.foot-primage a{ color: inherit; text-decoration: underline; transition: color .2s; }
.foot-primage a:hover{ color: var(--papel); }

@media (max-width: 960px){
  .foot-grid{ grid-template-columns: 1fr 1fr; }
  .foot-col--marca{ grid-column: 1 / -1; max-width: none; }
}
@media (max-width: 600px){
  .foot-grid{ grid-template-columns: 1fr; }
  .foot-fim{ flex-direction: column; align-items: flex-start; gap: 14px; }
}

/* ---------- Barra fixa no celular ---------- */
.sticky-cta{
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 80;
  padding: 12px var(--gut) calc(12px + env(safe-area-inset-bottom, 0px));
  background: color-mix(in srgb, var(--prof) 94%, transparent); backdrop-filter: blur(10px);
  transform: translateY(110%); transition: transform .4s var(--ease); display: none;
}
.sticky-cta.is-on{ transform: none; }
.sticky-cta .btn{ width: 100%; --bg: var(--papel); --fg: var(--prof); --bd: var(--papel); }
@media (max-width: 760px){ .sticky-cta{ display: block; } body.tem-sticky{ padding-bottom: 76px; } }

/* ---------- Revelar ao rolar ---------- */
.js [data-reveal]{ opacity: 0; transform: translateY(28px); transition: opacity .9s var(--ease), transform .9s var(--ease); transition-delay: var(--d, 0s); }
.js [data-reveal].is-in{ opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior: auto; }
  .js [data-reveal]{ opacity: 1; transform: none; transition: none; }
  .marquee__trk{ animation: none; flex-wrap: wrap; width: auto; }
  .hero__bg img, .hero__bg video{ height: 100%; transform: none !important; }
  .btn, .btn::after, .cam, .aula, .rede, .cc{ transition: none; }
}

/* ============================================================
   V2 · momentos de impacto (página inicial)
   ============================================================ */

/* barra de progresso de leitura */
.progress{
  position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 120; transform-origin: 0 50%; transform: scaleX(0);
  background: linear-gradient(90deg, var(--roxo), var(--lilas)); pointer-events: none;
}

/* título do topo: palavras sobem uma a uma */
.hero h1{ font-size: clamp(40px, 5.7vw, 92px); line-height: 1.03; letter-spacing: -.035em; max-width: 10.4em; }
.hero__txt{ max-width: min(900px, 100%); }
.hero .lead{ font-size: clamp(18px, 1.5vw, 21px); }
.wd{ display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .12em; margin-bottom: -.12em; }
.wd > span{ display: inline-block; transform: translateY(112%); animation: sobe .95s var(--ease) forwards; animation-delay: calc(.12s + var(--i) * .055s); }
@keyframes sobe{ to{ transform: none; } }
@media (min-width: 901px){ .hero h1{ max-width: 9.9em; } }


/* números maiores */
.provas__grid{ grid-template-columns: repeat(4, minmax(0, 1fr)); }
.provas__n{ font-size: clamp(40px, 5.6vw, 88px); white-space: nowrap; }
.provas__n--txt{ font-size: clamp(30px, 3.9vw, 62px); padding-top: .25em; }
@media (max-width: 800px){ .provas__grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); } .provas__n{ font-size: clamp(40px, 12vw, 56px); } .provas__n--txt{ font-size: clamp(28px, 8vw, 38px); } }
.provas__n small{ font-family: var(--corpo); font-size: .26em; letter-spacing: .04em; color: var(--lilas); }
.provas__it{ padding-block: clamp(36px, 5vw, 64px); }
.marquee{ padding: clamp(22px, 3vw, 34px) 0; background: #1a1220; }
.marquee__it{ font-size: clamp(28px, 4vw, 56px); font-style: italic; letter-spacing: -.02em; }
.marquee__trk{ animation-duration: 70s; }

/* frase que acende conforme se rola */
.statement{ background: var(--tinta); color: var(--papel); padding-block: clamp(96px, 16vw, 240px); }
.statement .eyebrow{ color: var(--lilas); }
.statement__txt{ margin-top: 28px; font-size: clamp(32px, 5.6vw, 86px); line-height: 1.08; letter-spacing: -.03em; max-width: 19em; }
.js .statement .w{ color: color-mix(in srgb, var(--papel) 18%, transparent); transition: color .5s var(--ease); }
.js .statement .w.on{ color: var(--papel); }

/* lista de palavras gigantes */
.pilares-sec{ background: var(--papel); }
.pilares{ display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(32px, 6vw, 112px); align-items: center; }
.pl-list{ display: flex; flex-direction: column; align-items: flex-start; }
.pl{
  background: none; border: 0; padding: 0; text-align: left; cursor: pointer; font: inherit; color: inherit;
  font-family: var(--display); font-size: clamp(44px, 7.6vw, 124px); line-height: 1.02; letter-spacing: -.04em;
  color: color-mix(in srgb, var(--tinta) 20%, transparent); transition: color .35s var(--ease), transform .5s var(--ease);
}
.pl:hover, .pl:focus-visible, .pl[aria-selected="true"]{ color: var(--tinta); }
.pl[aria-selected="true"]{ transform: translateX(14px); }
.pl-card{ position: relative; aspect-ratio: 4 / 5; overflow: hidden; border-radius: var(--raio); background: var(--prof); color: var(--papel); }
.pl-card img{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 51% 20%; transform: scale(1.08); transform-origin: 70% 30%; transition: transform 1.2s var(--ease); }
.pl-card:hover img{ transform: scale(1.14); }
.pl-card::after{ content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(24,10,26,.92) 0%, rgba(24,10,26,.55) 38%, transparent 66%); }
.pl-card__txt{ position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; padding: clamp(22px, 3vw, 40px); display: grid; gap: 18px; transition: opacity .25s, transform .35s var(--ease); }
.pl-card__txt.troca{ opacity: 0; transform: translateY(10px); }
.pl-q{ font-size: clamp(24px, 2.6vw, 38px); line-height: 1.12; letter-spacing: -.02em; max-width: 18ch; }
.pl-card .link-seta{ color: var(--lilas); justify-self: start; }
@media (max-width: 900px){ .pilares{ grid-template-columns: 1fr; } .pl{ font-size: clamp(40px, 11vw, 64px); } .pl-card{ aspect-ratio: 4 / 4.6; } }

/* carrossel de cartões altos */
.carro-sec{ background: var(--tinta); color: var(--papel); padding-inline: 0; overflow: hidden; }
.carro-sec .eyebrow{ color: var(--lilas); }
.carro-head{ display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: clamp(32px, 5vw, 56px); }
.carro-head .display{ max-width: 15em; }
.carro-setas{ display: flex; gap: 10px; flex: none; }
.carro-setas button{
  width: 54px; height: 54px; border: 1px solid color-mix(in srgb, var(--lilas) 45%, transparent); background: transparent; color: var(--papel);
  font-size: 22px; cursor: pointer; border-radius: var(--raio); transition: background .25s, border-color .25s;
}
.carro-setas button:hover{ background: var(--papel); color: var(--prof); border-color: var(--papel); }
.carro{
  display: flex; gap: 20px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; -webkit-overflow-scrolling: touch;
  padding: 4px max(var(--gut), calc((100vw - var(--maxw)) / 2 + var(--gut))) 20px;
  scroll-padding-inline: max(var(--gut), calc((100vw - var(--maxw)) / 2 + var(--gut)));
  cursor: grab;
}
.carro::-webkit-scrollbar{ display: none; }
.carro.arrastando{ cursor: grabbing; scroll-snap-type: none; }
.carro.arrastando a{ pointer-events: none; }
.cc2{
  position: relative; flex: 0 0 min(80vw, 360px); aspect-ratio: 3 / 4.5; scroll-snap-align: start; isolation: isolate; overflow: hidden;
  display: flex; flex-direction: column; justify-content: flex-end; gap: 12px; padding: clamp(24px, 2.6vw, 34px); text-decoration: none; color: var(--papel); border-radius: var(--raio);
}
.cc2__bg{
  position: absolute; inset: 0; z-index: -2; background-color: var(--c); background-image: url("/assets/foto/tinta-hero.jpg");
  background-size: var(--sz); background-position: var(--pos); background-blend-mode: multiply; transition: transform 1.1s var(--ease);
}
.cc2::after{ content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(20,8,22,.88) 0%, rgba(20,8,22,.32) 55%, transparent 82%); }
.cc2:hover .cc2__bg{ transform: scale(1.1); }
.cc2__t{ font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 600; color: var(--lilas); }
.cc2 h3{ font-size: clamp(30px, 2.8vw, 40px); line-height: 1.06; letter-spacing: -.025em; }
.cc2 p{ color: #e6dae5; font-size: 15.5px; }
.cc2__go{ margin-top: 8px; font-weight: 600; font-size: 15px; display: inline-flex; gap: .6em; align-items: center; }
.cc2__go::after{ content: "\2192"; transition: transform .25s var(--ease); }
.cc2:hover .cc2__go::after{ transform: translateX(6px); }

/* vídeo em tela cheia */
.vfull{ position: relative; isolation: isolate; overflow: hidden; color: var(--papel); text-align: center; background: var(--prof);
  padding-block: clamp(96px, 14vw, 200px); }
.vfull__bg{ position: absolute; inset: -4%; z-index: -2; background: var(--prof) center / cover no-repeat; filter: blur(10px) saturate(.8); transform: scale(1.08); }
.vfull::before{ content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(ellipse at center, rgba(40,18,42,.78), rgba(26,10,28,.95) 78%); }
.vfull .eyebrow{ color: var(--lilas); }
.vfull h2{ margin: 18px auto 0; max-width: 14em; color: var(--papel); letter-spacing: -.035em; }
.vfull .lead{ margin: 22px auto 0; color: #e2d6e1; }

.modal{ position: fixed; inset: 0; z-index: 300; background: rgba(14,6,16,.92); display: grid; place-items: center; padding: var(--gut); opacity: 0; transition: opacity .3s; }
.modal.on{ opacity: 1; }
.modal__box{ position: relative; width: min(1100px, 100%); aspect-ratio: 16 / 9; background: #000; }
.modal--vertical{ padding: max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left)); background: radial-gradient(circle at 50% 42%, rgba(78,42,75,.42), rgba(14,6,16,.96) 68%); }
.modal--vertical .modal__box{ width: min(430px, calc((100svh - 32px) * .5625), 100%); aspect-ratio: 9 / 16; border: 1px solid rgba(255,255,255,.2); border-radius: 24px; box-shadow: 0 32px 90px rgba(0,0,0,.62); overflow: hidden; }
.modal__box iframe{ position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.modal__x{ position: absolute; top: -52px; right: 0; background: none; border: 0; color: var(--papel); font-size: 15px; font-weight: 600; cursor: pointer; letter-spacing: .06em; }
.modal--vertical .modal__x{ top: 12px; right: 12px; z-index: 2; min-width: 44px; height: 44px; padding: 0 12px; border: 1px solid rgba(255,255,255,.28); border-radius: 999px; background: rgba(20,8,22,.68); box-shadow: 0 8px 24px rgba(0,0,0,.28); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); font-size: 0; }
.modal--vertical .modal__x::after{ content: "Fechar  ×"; font-size: 13px; letter-spacing: .04em; }

/* passos e cartões de aula com mais presença */
.passo__n{ font-size: clamp(72px, 10vw, 150px); }
.passo{ border-top-width: 3px; padding-top: 32px; }
.aulas2{ display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.aula2{
  position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; gap: 18px; justify-content: flex-end;
  min-height: clamp(380px, 38vw, 520px); padding: clamp(28px, 3.4vw, 52px); text-decoration: none; color: var(--papel); border-radius: var(--raio);
}
.aula2__bg{ position: absolute; inset: 0; z-index: -2; background-color: #5a2f57; background-image: url("/assets/foto/tinta-sobre.jpg"); background-size: 250%; background-position: var(--pos); background-blend-mode: multiply; transition: transform 1.1s var(--ease); }
.aula2::after{ content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(20,8,22,.9) 0%, rgba(20,8,22,.4) 55%, transparent 90%); }
.aula2:hover .aula2__bg{ transform: scale(1.08); }
.aula2 h3{ font-size: clamp(30px, 3.4vw, 50px); line-height: 1.05; letter-spacing: -.03em; max-width: 14em; }
.aula2 p{ color: #e6dae5; max-width: 44ch; }
.aula2__go{ font-weight: 600; display: inline-flex; gap: .6em; }
.aula2__go::after{ content: "\2192"; transition: transform .25s var(--ease); }
.aula2:hover .aula2__go::after{ transform: translateX(6px); }
@media (max-width: 860px){ .aulas2{ grid-template-columns: 1fr; } }

.retrato--alto{ aspect-ratio: 4 / 5.2; }
.retrato--alto img{ height: 112%; transform: none; object-position: 51% 20%; }

/* redes grandes */
.redes-big{ display: grid; grid-template-columns: 1fr 1.2fr; gap: 40px; align-items: end; }
.redes-lista{ display: grid; }
.redes-lista a{
  display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 22px 0; text-decoration: none; border-bottom: 1px solid var(--giz);
  font-family: var(--display); font-size: clamp(30px, 4vw, 56px); letter-spacing: -.03em; transition: padding .35s var(--ease), color .3s;
}
.redes-lista a:first-child{ border-top: 1px solid var(--giz); }
.redes-lista a:hover{ padding-left: 18px; color: var(--roxo); }
.redes-lista svg{ width: 30px; height: 30px; fill: currentColor; flex: none; }
@media (max-width: 800px){ .redes-big{ grid-template-columns: 1fr; } }

/* chamada final */
.cta-final .display{ font-size: clamp(44px, 8vw, 128px); max-width: 11em; letter-spacing: -.04em; }

@media (prefers-reduced-motion: reduce){
  .wd > span{ animation: none; transform: none; }
  .js .statement .w{ color: var(--papel); transition: none; }
  .cc2__bg, .aula2__bg, .pl-card img{ transition: none; }
}


/* ============================================================
   Página Sobre
   ============================================================ */
.sobre-top__grid{ display: grid; grid-template-columns: 1.25fr 1fr; gap: clamp(32px, 6vw, 96px); align-items: end; }
.sobre-top h1{ max-width: 10em; font-size: clamp(44px, 6.4vw, 100px); letter-spacing: -.04em; }
.sobre-top .retrato{ max-width: 460px; justify-self: end; width: 100%; }
@media (max-width: 900px){ .sobre-top__grid{ grid-template-columns: 1fr; } .sobre-top .retrato{ justify-self: start; max-width: 380px; } }

.trajeto{ list-style: none; border-top: 1px solid var(--giz); }
.trajeto li{ display: grid; grid-template-columns: minmax(180px, 1fr) 2fr; gap: clamp(20px, 4vw, 64px); padding: clamp(28px, 4vw, 48px) 0; border-bottom: 1px solid var(--giz); align-items: start; }
.trajeto .linha__t, .linha__t{ font-family: var(--display); font-size: clamp(30px, 4vw, 56px); letter-spacing: -.03em; line-height: 1; color: var(--roxo); }
.trajeto h3{ font-size: clamp(22px, 2.4vw, 32px); }
.trajeto p{ margin-top: 10px; color: var(--cinza); max-width: 52ch; }
@media (max-width: 700px){ .trajeto li{ grid-template-columns: 1fr; gap: 10px; } }

.forcas{ border-top: 1px solid color-mix(in srgb, var(--lilas) 30%, transparent); }
.forca{ display: grid; grid-template-columns: minmax(0, 1.3fr) 2fr; gap: clamp(16px, 4vw, 64px); align-items: baseline; padding: clamp(24px, 3vw, 40px) 0; border-bottom: 1px solid color-mix(in srgb, var(--lilas) 30%, transparent); }
.forca h3{ font-size: clamp(28px, 3.4vw, 50px); letter-spacing: -.035em; line-height: 1; color: var(--papel); }
.forca p{ color: var(--lilas); font-size: clamp(17px, 1.5vw, 20px); max-width: 46ch; }
@media (max-width: 700px){ .forca{ grid-template-columns: 1fr; gap: 10px; } }

.citacao{ margin-top: 24px; font-size: clamp(28px, 4.2vw, 60px); line-height: 1.12; letter-spacing: -.03em; }

.manifesto{ background: var(--tinta); color: var(--papel); padding-block: clamp(80px, 12vw, 180px); }
.manifesto .eyebrow{ color: var(--lilas); }
.manifesto__lista{ margin-top: 40px; display: grid; }
.manifesto__lista p{ font-size: clamp(30px, 5.2vw, 80px); line-height: 1.06; letter-spacing: -.035em; padding: clamp(18px, 2.4vw, 34px) 0; border-bottom: 1px solid color-mix(in srgb, var(--lilas) 22%, transparent); color: color-mix(in srgb, var(--papel) 72%, transparent); transition: color .35s var(--ease), padding .4s var(--ease); }
.manifesto__lista p:first-child{ border-top: 1px solid color-mix(in srgb, var(--lilas) 22%, transparent); }
.manifesto__lista p:hover{ color: var(--papel); padding-left: 16px; }

.narrow-video{ max-width: 960px; }
.prova-link{ display: inline-block; margin-top: 8px; color: var(--lilas); font-size: 13px; font-weight: 600; border-bottom: 1px solid currentColor; text-decoration: none; }
.redes-lista .seta{ font-style: normal; font-size: 32px; }


/* ============================================================
   Botões do topo: brilho giratório, seta que se move, efeito de ímã
   ============================================================ */
@property --ang{ syntax: "<angle>"; initial-value: 0deg; inherits: false; }
@keyframes giro{ to{ --ang: 360deg; } }

.hero-cta{ display: flex; flex-wrap: wrap; gap: 16px; margin-top: 36px; }
.cta-mag, .cta-vidro{
  position: relative; display: inline-flex; align-items: center; justify-content: space-between; gap: 28px; text-decoration: none;
  min-height: 72px; padding: 10px 10px 10px 28px; border-radius: 20px; isolation: isolate;
  transition: transform .5s var(--ease), box-shadow .4s var(--ease); will-change: transform;
}
.cta-mag small, .cta-vidro small{ display: block; font-size: 11.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 3px; }
.cta-mag__txt, .cta-vidro__txt{ font: 600 17px/1.2 var(--corpo); letter-spacing: .005em; }

.cta-mag{ background: var(--papel); color: var(--prof); box-shadow: 0 22px 44px -20px rgba(0,0,0,.7); }
.cta-mag small{ color: var(--roxo); }
/* contorno de luz que gira em volta do botão */
.cta-mag::before{
  content: ""; position: absolute; inset: -3px; z-index: -1; border-radius: 23px;
  background: conic-gradient(from var(--ang), rgba(201,179,199,0) 0 55%, var(--lilas) 78%, #fff 90%, rgba(201,179,199,0) 100%);
  animation: giro 3.6s linear infinite; filter: blur(.3px);
}
.cta-mag::after{ content: ""; position: absolute; inset: 0; z-index: -1; border-radius: 20px; background: var(--papel); }
/* luz que acompanha o cursor */
.cta-mag__brilho{ position: absolute; inset: 0; z-index: 0; border-radius: 20px; pointer-events: none; opacity: 0; transition: opacity .3s;
  background: radial-gradient(160px circle at var(--mx, 50%) var(--my, 50%), rgba(128,71,124,.22), transparent 70%); }
.cta-mag:hover .cta-mag__brilho{ opacity: 1; }
.cta-mag__txt, .cta-mag__seta{ position: relative; z-index: 1; }
.cta-mag__seta{
  display: grid; place-items: center; width: 52px; height: 52px; border-radius: 14px; background: var(--prof); color: var(--papel); font-size: 22px;
  transition: transform .45s var(--ease), background .3s;
}
.cta-mag:hover{ box-shadow: 0 30px 56px -18px rgba(0,0,0,.8); }
.cta-mag:hover .cta-mag__seta{ background: var(--roxo); transform: translateX(6px) rotate(-45deg); }

.cta-vidro{
  color: var(--papel); background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.34);
  backdrop-filter: blur(14px) saturate(1.3); -webkit-backdrop-filter: blur(14px) saturate(1.3);
}
.cta-vidro small{ color: var(--lilas); }
.cta-vidro__seta{ display: grid; place-items: center; width: 52px; height: 52px; border-radius: 14px; background: rgba(255,255,255,.14); font-size: 22px; transition: transform .45s var(--ease), background .3s, color .3s; }
.cta-vidro:hover{ background: rgba(255,255,255,.16); border-color: rgba(255,255,255,.7); }
.cta-vidro:hover .cta-vidro__seta{ background: var(--papel); color: var(--prof); transform: translate(4px, -4px); }

@keyframes video-pulso{ 0%, 100%{ opacity: .35; transform: scale(1); } 50%{ opacity: 0; transform: scale(1.32); } }
.hero-video{
  position: absolute; z-index: 2; top: 67%; right: 5.5%; display: flex; align-items: center; gap: 13px; width: auto; min-height: 72px; padding: 9px 12px 9px 10px; border: 1px solid rgba(255,255,255,.28); border-radius: 22px; background: rgba(36,18,38,.56); color: var(--papel); text-align: left; cursor: pointer; box-shadow: 0 20px 48px rgba(20,8,22,.34); backdrop-filter: blur(16px) saturate(1.2); -webkit-backdrop-filter: blur(16px) saturate(1.2); transition: background .3s, border-color .3s, transform .3s var(--ease), box-shadow .3s;
}
.hero-video__play{ position: relative; flex: none; width: 52px; height: 52px; border: 1px solid rgba(255,255,255,.78); border-radius: 50%; background: rgba(255,255,255,.14); box-shadow: inset 0 0 0 5px rgba(255,255,255,.05); transition: background .3s, transform .3s var(--ease); }
.hero-video__play::before{ content: ""; position: absolute; inset: -7px; border: 1px solid rgba(255,255,255,.5); border-radius: inherit; animation: video-pulso 2.8s ease-out infinite; }
.hero-video__play::after{ content: ""; position: absolute; left: 21px; top: 15px; border-left: 15px solid var(--papel); border-top: 10px solid transparent; border-bottom: 10px solid transparent; }
.hero-video__copy{ display: grid; gap: 2px; min-width: 0; }
.hero-video small{ color: var(--lilas); font-size: 10px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.hero-video strong{ font: 600 15px/1.2 var(--corpo); white-space: nowrap; }
.hero-video__tempo{ align-self: stretch; display: grid; place-items: center; min-width: 48px; padding-left: 10px; border-left: 1px solid rgba(255,255,255,.18); color: var(--lilas); font-size: 12px; font-weight: 600; }
.hero-video:hover{ background: rgba(78,42,75,.78); border-color: rgba(255,255,255,.5); box-shadow: 0 24px 58px rgba(20,8,22,.46); transform: translateY(-3px); }
.hero-video:hover .hero-video__play{ background: rgba(255,255,255,.22); transform: scale(1.05); }
.hero-video:focus-visible{ outline: 2px solid var(--papel); outline-offset: 5px; }
@media (max-width: 900px){
  .hero .container{ margin-top: 0; }
  .hero-video{ top: min(67vw, 390px); left: 20px; right: 20px; min-height: 68px; padding: 8px 10px 8px 9px; border-radius: 20px; background: rgba(36,18,38,.72); }
  .hero-video__play{ width: 50px; height: 50px; }
  .hero-video__play::after{ left: 20px; top: 15px; border-left-width: 14px; border-top-width: 9px; border-bottom-width: 9px; }
  .hero-video__copy{ flex: 1; }
  .hero-video strong{ white-space: normal; }
  .hero-video__tempo{ min-width: 46px; }
}
@media (max-width: 370px){
  .hero-video{ left: 16px; right: 16px; }
  .hero-video small{ font-size: 9px; }
  .hero-video strong{ font-size: 14px; }
}
@media (prefers-reduced-motion: reduce){ .hero-video__play::before{ animation: none; } }

.hero-chips{ list-style: none; display: flex; flex-wrap: wrap; gap: 10px 22px; margin-top: 26px; font-size: 14px; color: var(--lilas); }
.hero-chips li{ display: inline-flex; align-items: center; gap: 10px; }
.hero-chips li::before{ content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--lilas); box-shadow: 0 0 0 4px rgba(201,179,199,.18); }

@media (max-width: 560px){
  .hero-cta{ flex-direction: column; align-items: stretch; }
  .cta-mag, .cta-vidro{ width: 100%; }
}
@media (prefers-reduced-motion: reduce){ .cta-mag::before{ animation: none; } .cta-mag, .cta-vidro, .cta-mag__seta, .cta-vidro__seta{ transition: none; } }

/* ============================================================
   Tamanhos de título mais confortáveis para ler (ajuste final)
   ============================================================ */
.h-xl{ font-size: clamp(32px, 4.6vw, 64px); }
.h-lg{ font-size: clamp(26px, 3.4vw, 44px); }
.h-md{ font-size: clamp(22px, 2.4vw, 30px); }
.hero h1{ font-size: clamp(34px, 4.7vw, 70px); line-height: 1.06; letter-spacing: -.03em; max-width: 11.2em; }
@media (min-width: 901px){ .hero h1{ max-width: 11em; } }
@media (max-width: 900px){ .hero h1{ font-size: clamp(30px, 7.4vw, 40px); } }
.page-top h1{ max-width: 20ch; }
.sobre-top h1{ font-size: clamp(36px, 5vw, 72px); }
.statement__txt{ font-size: clamp(26px, 4vw, 58px); line-height: 1.12; letter-spacing: -.025em; }
.pl{ font-size: clamp(36px, 5.4vw, 84px); }
@media (max-width: 900px){ .pl{ font-size: clamp(34px, 9vw, 52px); } }
.pl-q{ font-size: clamp(22px, 2.1vw, 30px); }
.cc2 h3{ font-size: clamp(25px, 2.2vw, 32px); }
.carro-head .display{ max-width: 17em; }
.aula2 h3{ font-size: clamp(26px, 2.7vw, 38px); }
.vfull h2{ font-size: clamp(32px, 4.6vw, 64px); }
.cta-final .display{ font-size: clamp(36px, 5.8vw, 84px); letter-spacing: -.035em; }
.manifesto__lista p{ font-size: clamp(26px, 3.8vw, 56px); }
.citacao{ font-size: clamp(24px, 3.2vw, 44px); }
.passo__n{ font-size: clamp(60px, 8vw, 112px); }
.provas__n{ font-size: clamp(36px, 4.6vw, 70px); }
.provas__n--txt{ font-size: clamp(26px, 3.2vw, 50px); }
.trajeto .linha__t, .linha__t{ font-size: clamp(26px, 3.2vw, 44px); }
.forca h3{ font-size: clamp(26px, 2.8vw, 40px); }
.redes-lista a{ font-size: clamp(26px, 3.2vw, 44px); }
.duvida{ font-size: clamp(22px, 2.3vw, 32px); }
.sec__head .lead{ font-size: clamp(17px, 1.5vw, 20px); }


/* Página Carreira */
.momentos{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.momento{ display: flex; flex-direction: column; gap: 14px; padding: clamp(24px, 3vw, 36px); background: #fff; border: 1px solid var(--giz); border-radius: var(--raio); }
.momento h3{ font-size: clamp(22px, 2.1vw, 28px); line-height: 1.15; letter-spacing: -.02em; }
.momento p{ margin-top: auto; padding-top: 18px; border-top: 1px solid var(--giz); color: var(--cinza); }
@media (max-width: 900px){ .momentos{ grid-template-columns: 1fr; } }

/* logo Ikigai no topo do hero */
.hero__logo{ display: block; width: clamp(200px, 22vw, 300px); height: auto; margin: 0 0 clamp(20px, 3vw, 32px); }

/* fundo do hero: retrato em fundo ameixa (rosto à direita, texto sobre a área escura à esquerda) */
.hero__bg img, .hero__bg video{ object-position: 80% 0%; }
@media (max-width: 900px){
  .hero__bg img, .hero__bg video{ object-position: 100% 50%; }
  .hero__bg::after{ background: linear-gradient(0deg, var(--prof) 0%, rgba(44,22,46,.6) 20%, transparent 50%), linear-gradient(180deg, rgba(36,18,38,.5) 0%, transparent 22%); }
}
.hero__bg picture{ display: block; width: 100%; height: 100%; }
.hero__bg picture img{ display: block; }

/* cards de desafio: ilustração inteira (sem corte) sobre o mesmo creme da arte, texto em tinta sobre o rodapé da composição */
.pl-card{ aspect-ratio: auto; background: #FEF9F1; color: var(--tinta); border: 1px solid color-mix(in srgb, var(--prof) 14%, transparent); display: flex; flex-direction: column; }
.pl-card::after{ display: none; }
.pl-card__img{ position: relative; aspect-ratio: 1 / 1; width: 100%; }
.pl-card .pl-img{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; transform: none; mix-blend-mode: multiply; opacity: 0; transition: opacity .5s var(--ease); }
.pl-card .pl-img.on{ opacity: 1; }
.pl-card:hover .pl-img{ transform: none; }
.pl-card__txt{ position: relative; left: auto; right: auto; bottom: auto; margin-top: -7%; padding: 0 clamp(22px, 3vw, 36px) clamp(24px, 3vw, 34px); gap: 14px; background: linear-gradient(180deg, rgba(254,249,241,0) 0%, #FEF9F1 34%); padding-top: 22px; }
.pl-q{ color: var(--prof); font-size: clamp(22px, 2.1vw, 30px); max-width: 20ch; }
.pl-card .link-seta{ color: var(--prof); }
@media (max-width: 900px){ .pl-card{ aspect-ratio: auto; max-width: 560px; } }
@media (prefers-reduced-motion: reduce){ .pl-card .pl-img{ transition: none; } }
/* link do card de desafio: tom mais claro que a pergunta, para dar hierarquia (contraste 5,8:1 sobre o creme) */
.pl-card .link-seta{ color: #7B5579; }

/* eyebrows maiores e mais legíveis em todo o site */
.eyebrow{ font-size: clamp(14px, 1.15vw, 16px); letter-spacing: .14em; }
/* seção "Qual é o seu desafio hoje?": a pergunta vira título, em caixa normal */
.pilares-sec .eyebrow{ font-family: var(--display); font-weight: 400; text-transform: none; letter-spacing: -.01em; font-size: clamp(26px, 3vw, 40px); line-height: 1.15; color: var(--prof); }

/* cards "Por onde começar": foto na proporção original (2:3), sem corte; texto sobre a parte escura da própria imagem */
.cc2{ flex-basis: min(84vw, 400px); aspect-ratio: 2 / 3; }
.cc2__bg{ background: none; width: 100%; height: 100%; object-fit: cover; }
.cc2:hover .cc2__bg{ transform: scale(1.04); }
.cc2::after{ background: linear-gradient(0deg, rgba(20,8,22,.9) 0%, rgba(20,8,22,.78) 38%, rgba(20,8,22,.25) 62%, transparent 80%); }

/* ---------- legibilidade: piso de tamanho de texto em todo o site ---------- */
body{ font-size: 18px; }
/* rótulos em caixa alta */
.aula__tag, .cam__t, .cc2__t, .cc small, .foot-top__tag, .cta-mag small, .cta-vidro small{ font-size: 13px; }
/* botões e links de ação */
.btn{ font-size: 16px; }
.btn--sm, .btn.btn--sm{ font-size: 15.5px; }
.nl{ font-size: 16px; }
.link-seta, .cam__go, .cc2__go{ font-size: 16px; }
.rodape-m{ font-size: 16px; }
/* corpo de cards e blocos de apoio */
.cc2 p{ font-size: 17px; line-height: 1.5; }
.provas__t{ font-size: 16px; }
.muted{ font-size: 16px; }
.hero .nota, .hero-chips, .depo cite{ font-size: 15px; }
.prova-link, .ik-marca{ font-size: 14px; }
.qz-privacidade{ font-size: 14px; }
/* formulários e navegação secundária */
.campo label, .aceite, .migalha, .form-msg{ font-size: 15px; }
.migalha a, .campo a, .aceite a{ font-size: inherit; }
/* rodapé */
.foot-desc, .foot-top__desc{ font-size: 16px; }
.foot-fim__copy, .foot-fim__sep, .foot-primage, .foot-primage__coracao{ font-size: 14px; }
.site-footer a, .site-footer li, .site-footer h4{ font-size: 15.5px; }
.site-footer .btn{ font-size: 15.5px; }
.nav-d a.nl{ font-size: 16px; }

/* projetos sociais: bloco na home e no Sobre */
.social{ display: grid; grid-template-columns: 1.15fr 1fr; gap: clamp(32px, 6vw, 96px); align-items: center; }
.social__lista{ list-style: none; margin: 0; padding: 0; border-top: 1px solid color-mix(in srgb, var(--prof) 22%, transparent); }
.social__lista li{ display: grid; gap: 6px; padding: 22px 0; border-bottom: 1px solid color-mix(in srgb, var(--prof) 22%, transparent); }
.social__lista b{ font-family: var(--display); font-weight: 400; font-size: clamp(22px, 2.2vw, 28px); color: var(--prof); letter-spacing: -.01em; }
.social__lista span{ font-size: 17px; color: var(--tinta); }
@media (max-width: 900px){ .social{ grid-template-columns: 1fr; } }

/* retrato executivo (3:4) inteiro, sem corte nem zoom */
.retrato--exec{ aspect-ratio: 3 / 4; }
.retrato--exec img{ height: 100%; transform: none; object-fit: cover; object-position: 50% 50%; }

/* Sobre: retrato editorial como fundo do topo; texto à esquerda, sobre a parte lisa da imagem */
.sobre-top::before{ display: none; }
.sobre-top__bg{ position: absolute; inset: 0; z-index: -1; }
.sobre-top__bg picture{ display: block; width: 100%; height: 100%; }
.sobre-top__bg img{ width: 100%; height: 100%; object-fit: cover; object-position: 85% 40%; }
.sobre-top__bg::after{ content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(60,30,58,.6) 0%, rgba(60,30,58,.25) 45%, transparent 65%), linear-gradient(0deg, rgba(60,30,58,.55) 0%, transparent 30%); }
.sobre-top__grid{ grid-template-columns: minmax(0, 1fr); }
.sobre-top__grid > div{ max-width: min(660px, 54%); }
@media (max-width: 900px){
  .sobre-top{ padding-top: 0; }
  .sobre-top__bg{ position: relative; inset: auto; z-index: 0; height: min(78vw, 460px); }
  .sobre-top__bg img{ object-position: 80% 30%; }
  .sobre-top__bg::after{ background: linear-gradient(0deg, var(--prof) 0%, rgba(78,42,75,.6) 22%, transparent 55%), linear-gradient(180deg, rgba(36,18,38,.5) 0%, transparent 24%); }
  .sobre-top .container{ position: relative; margin-top: -56px; }
  .sobre-top__grid > div{ max-width: none; }
}

/* Temas de aulas: imagem inteira na proporção original, texto sobre a parte escura */
.aula2{ min-height: 0; aspect-ratio: 1.08 / 1; }
.aula2__bg{ background: none; width: 100%; height: 100%; object-fit: cover; object-position: 50% 0%; }
.aula2:hover .aula2__bg{ transform: scale(1.03); }
.aula2::after{ background: linear-gradient(0deg, rgba(20,8,22,.92) 0%, rgba(20,8,22,.8) 34%, rgba(20,8,22,.3) 58%, transparent 78%); }
@media (max-width: 860px){ .aula2{ aspect-ratio: auto; min-height: 470px; } }

/* Projetos sociais: topo com retrato, três formas de contribuir */
.soc-top__grid{ display: grid; grid-template-columns: 1.25fr 1fr; gap: clamp(32px, 6vw, 96px); align-items: end; }
.soc-top .retrato{ max-width: 440px; justify-self: end; width: 100%; }
.soc-top h1{ max-width: 11em; }
.ofertas{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.oferta{ display: grid; align-content: start; gap: 14px; padding: clamp(24px, 3vw, 36px); background: #fff; border: 1px solid color-mix(in srgb, var(--prof) 14%, transparent); border-radius: var(--raio); }
.oferta__n{ font-family: var(--display); font-size: 44px; line-height: 1; color: var(--lilas); }
.oferta h3{ color: var(--prof); font-size: clamp(24px, 2.2vw, 30px); }
.oferta p{ font-size: 17px; }
@media (max-width: 900px){ .soc-top__grid{ grid-template-columns: 1fr; } .soc-top .retrato{ justify-self: start; max-width: 380px; } .ofertas{ grid-template-columns: 1fr; } }

/* Teste diagnóstico (CTA final): bússola como fundo, texto à esquerda sobre a parte escura */
.cta-final::before{
  opacity: 1; mix-blend-mode: normal;
  background: linear-gradient(90deg, rgba(30,14,32,.5) 0%, rgba(30,14,32,.15) 50%, transparent 70%), url("/assets/foto/cta-bussola.jpg") 85% center / cover no-repeat;
}
@media (max-width: 1000px){
  .cta-final::before{ background: linear-gradient(180deg, rgba(30,14,32,.8) 0%, rgba(30,14,32,.62) 55%, rgba(30,14,32,.25) 100%), url("/assets/foto/cta-bussola-m.jpg") right bottom / cover no-repeat; }
}

/* Sobre e Projetos sociais: parágrafos do topo com o mesmo tamanho, cor e espaçamento */
.sobre-top .lead, .sobre-top__grid > div > p{ font-size: clamp(17px, 1.5vw, 19.5px); line-height: 1.65; color: #ecdfeb; margin-top: 18px; max-width: 60ch; }
.sobre-top .lead{ margin-top: 24px; }

/* janelas com formulário (webinar e lista de espera) */
.modal--form{ overflow-y: auto; align-items: start; padding-block: clamp(32px, 8vh, 80px); }
.modal__box--form{ aspect-ratio: auto; width: min(520px, 100%); background: var(--papel); color: var(--tinta); border-radius: var(--raio); padding: clamp(24px, 4vw, 40px); margin: 0 auto; }
.modal__box--form .modal__x{ top: 14px; right: 16px; color: var(--cinza); }
.modal__box--form h2{ margin-top: 12px; color: var(--prof); }
.modal__box--form .muted{ margin-top: 10px; font-size: 16px; }
.modal__box--form .form{ margin-top: 22px; }
.modal__box--form .eyebrow{ font-size: 13px; }


/* ============================================================
   Landing Pages de Vendas (NR-1, Feedback)
   ============================================================ */
/* Landing Pages de Vendas (NR-1, Feedback) */
.lp-hero {
  position: relative;
  background: var(--prof);
  color: var(--papel);
  min-height: min(92svh, 840px);
  display: flex;
  align-items: center;
  padding-top: calc(var(--header-h) + clamp(28px, 4vw, 56px));
  padding-bottom: clamp(48px, 6vw, 84px);
  overflow: hidden;
  isolation: isolate;
}
.lp-hero__bg {
  position: absolute;
  inset: 0;
  z-index: -1;
}
.lp-hero__bg picture {
  display: block;
  width: 100%;
  height: 100%;
}
.lp-hero__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 85% 35%;
}
.lp-hero__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(38,18,36,0.96) 0%, rgba(38,18,36,0.88) 36%, rgba(38,18,36,0.48) 58%, rgba(38,18,36,0.18) 76%, transparent 100%),
    linear-gradient(0deg, rgba(38,18,36,0.72) 0%, transparent 32%);
}
.lp-hero__txt {
  max-width: min(640px, 100%);
}
.lp-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--lilas);
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(226, 214, 225, 0.28);
  padding: 6px 14px;
  border-radius: 999px;
  margin-bottom: 20px;
}
.lp-badge__ponto {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #52c41a;
  box-shadow: 0 0 8px rgba(82, 196, 26, 0.8);
}
.lp-hero h1 {
  font-size: clamp(34px, 4.4vw, 56px);
  line-height: 1.08;
  letter-spacing: -0.03em;
  color: var(--papel);
  margin-bottom: 20px;
}
.lp-hero .lead {
  color: #ebdce9;
  font-size: clamp(17px, 1.4vw, 20.5px);
  line-height: 1.55;
  max-width: 52ch;
}
.lp-micro-seals {
  display: flex;
  flex-wrap: wrap;
  gap: 16px 24px;
  color: #d8c8d6;
  font-size: 13px;
  margin-top: 14px;
}
.lp-micro-seals span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

@media (max-width: 900px) {
  .lp-hero {
    display: block;
    min-height: 0;
    padding-top: 0;
    padding-bottom: clamp(48px, 8vw, 72px);
  }
  .lp-hero__bg {
    position: relative;
    inset: auto;
    height: min(84vw, 480px);
  }
  .lp-hero__bg img {
    object-position: 80% 30%;
  }
  .lp-hero__bg::after {
    background: linear-gradient(0deg, var(--prof) 0%, rgba(78,42,75,.65) 26%, transparent 58%),
                linear-gradient(180deg, rgba(36,18,38,.55) 0%, transparent 28%);
  }
  .lp-hero .container {
    position: relative;
    margin-top: -64px;
  }
  .lp-hero__txt {
    max-width: none;
  }
}

/* Seção 2: Destaques (modelo do anexo) */
.lp-provas-sec {
  background: var(--prof);
  color: var(--papel);
  border-top: 1px solid color-mix(in srgb, var(--lilas) 22%, transparent);
  border-bottom: 1px solid color-mix(in srgb, var(--lilas) 16%, transparent);
}
.lp-provas-sec .provas__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}
.lp-provas-sec .provas__it {
  padding: clamp(34px, 4.5vw, 56px) 24px clamp(34px, 4.5vw, 56px) 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.lp-provas-sec .provas__it + .provas__it {
  padding-left: 24px;
  border-left: 1px solid color-mix(in srgb, var(--lilas) 22%, transparent);
}
.lp-provas-sec .provas__n {
  font-family: var(--display);
  font-size: clamp(44px, 5.2vw, 76px);
  line-height: 1;
  letter-spacing: -0.03em;
  color: var(--papel);
}
.lp-provas-sec .provas__t {
  font-size: 14.5px;
  color: var(--lilas);
  line-height: 1.45;
  max-width: 26ch;
}
.lp-provas-sec .provas__t strong {
  display: block;
  font-size: 16px;
  font-weight: 600;
  color: var(--papel);
  margin-bottom: 4px;
  letter-spacing: -0.01em;
}
.lp-provas-sec .provas__frase {
  max-width: 68ch;
  margin: 0 auto;
  padding: 12px 0 clamp(36px, 5vw, 56px);
  text-align: center;
  font-size: clamp(19px, 2.1vw, 25px);
  line-height: 1.4;
  color: var(--lilas);
  border-top: 1px solid color-mix(in srgb, var(--lilas) 16%, transparent);
}
@media (max-width: 860px) {
  .lp-provas-sec .provas__grid {
    grid-template-columns: 1fr 1fr;
  }
  .lp-provas-sec .provas__it:nth-child(3) {
    padding-left: 0;
    border-left: 0;
  }
  .lp-provas-sec .provas__it:nth-child(n+3) {
    border-top: 1px solid color-mix(in srgb, var(--lilas) 22%, transparent);
  }
}
@media (max-width: 520px) {
  .lp-provas-sec .provas__grid {
    grid-template-columns: 1fr;
  }
  .lp-provas-sec .provas__it {
    padding-left: 0 !important;
    border-left: 0 !important;
  }
  .lp-provas-sec .provas__it + .provas__it {
    border-top: 1px solid color-mix(in srgb, var(--lilas) 22%, transparent);
  }
}

/* Grid de Cenários / Dores */
.lp-cenarios {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  margin-top: 36px;
}
.lp-cenario-card {
  background: #fff;
  border: 1px solid var(--giz);
  border-radius: 18px;
  padding: clamp(26px, 3.5vw, 38px);
  position: relative;
  transition: transform 0.3s var(--ease), border-color 0.3s, box-shadow 0.3s;
}
.lp-cenario-card:hover {
  transform: translateY(-4px);
  border-color: var(--roxo);
  box-shadow: 0 20px 40px -20px rgba(36, 18, 38, 0.15);
}
.lp-cenario-card__n {
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--roxo);
  margin-bottom: 12px;
}
.lp-cenario-card h3 {
  font-size: clamp(20px, 2.2vw, 24px);
  line-height: 1.25;
  color: var(--tinta);
  margin-bottom: 12px;
}
.lp-cenario-card p {
  color: var(--cinza);
  font-size: 15.5px;
  line-height: 1.55;
}

/* Box de Destaque / Método */
.lp-destaque-box, .lp-nr1-box {
  background: var(--prof);
  color: var(--papel);
  border-radius: 24px;
  padding: clamp(36px, 6vw, 68px);
  position: relative;
  overflow: hidden;
  isolation: isolate;
  border: 1px solid rgba(226, 214, 225, 0.22);
}
.lp-destaque-box::before, .lp-nr1-box::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: radial-gradient(circle at 10% 90%, rgba(138, 77, 134, 0.35), transparent 60%);
}
.lp-destaque-grid, .lp-nr1-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(28px, 4vw, 48px);
  margin-top: 36px;
}
.lp-destaque-col, .lp-nr1-col {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(226, 214, 225, 0.15);
  border-radius: 16px;
  padding: 28px;
}
.lp-destaque-col h3, .lp-nr1-col h3 {
  font-size: 20px;
  color: var(--papel);
  margin-bottom: 10px;
}
.lp-destaque-col p, .lp-nr1-col p {
  color: #dfd1de;
  font-size: 15px;
  line-height: 1.55;
}

/* Grade de Módulos */
.lp-modulos-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  margin-top: 40px;
}
.lp-mod-card {
  background: #fff;
  border: 1px solid var(--giz);
  border-radius: 20px;
  padding: clamp(28px, 3.5vw, 40px);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 20px;
  transition: transform 0.3s var(--ease), border-color 0.3s, box-shadow 0.3s;
}
.lp-mod-card:hover {
  transform: translateY(-4px);
  border-color: var(--lilas);
  box-shadow: 0 24px 48px -24px rgba(36, 18, 38, 0.18);
}
.lp-mod-tag {
  display: inline-block;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--roxo);
  background: color-mix(in srgb, var(--lilas) 20%, transparent);
  padding: 4px 12px;
  border-radius: 999px;
  align-self: flex-start;
}
.lp-mod-card h3 {
  font-size: clamp(22px, 2.4vw, 28px);
  line-height: 1.2;
  color: var(--tinta);
  margin-top: 10px;
}
.lp-mod-card p {
  color: var(--cinza);
  font-size: 15.5px;
  line-height: 1.55;
  margin-top: 10px;
}
.lp-mod-topics {
  list-style: none;
  padding: 0;
  margin: 16px 0 0;
  display: grid;
  gap: 8px;
  border-top: 1px solid var(--giz);
  padding-top: 16px;
}
.lp-mod-topics li {
  font-size: 14px;
  color: var(--tinta);
  display: flex;
  align-items: center;
  gap: 8px;
}
.lp-mod-topics li::before {
  content: "•";
  color: var(--roxo);
  font-size: 20px;
  line-height: 1;
}

/* Para quem é / Não é */
.lp-publico-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 28px;
  margin-top: 40px;
}
.lp-publico-card {
  border-radius: 20px;
  padding: clamp(30px, 4vw, 44px);
}
.lp-publico-card--sim {
  background: color-mix(in srgb, #f5fcf6 90%, #fff);
  border: 1px solid #c3e6cb;
}
.lp-publico-card--nao {
  background: color-mix(in srgb, #fdf8f8 90%, #fff);
  border: 1px solid #f0d5d5;
}
.lp-publico-card h3 {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: clamp(20px, 2.2vw, 25px);
  margin-bottom: 20px;
}
.lp-publico-card--sim h3 { color: #1e5c30; }
.lp-publico-card--nao h3 { color: #782626; }
.lp-publico-card ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 14px;
}
.lp-publico-card li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-size: 15.5px;
  line-height: 1.45;
  color: var(--tinta);
}
.lp-publico-card--sim svg { color: #2e7d32; flex: none; width: 20px; height: 20px; margin-top: 2px; }
.lp-publico-card--nao svg { color: #c62828; flex: none; width: 20px; height: 20px; margin-top: 2px; }

/* Checkout Box de Alta Conversão */
.lp-checkout-box {
  background: color-mix(in srgb, var(--prof) 65%, rgba(255,255,255,.05));
  border: 1px solid rgba(226, 214, 225, 0.35);
  border-radius: 24px;
  padding: clamp(32px, 5vw, 60px);
  box-shadow: 0 36px 80px -28px rgba(0, 0, 0, 0.7);
  backdrop-filter: blur(16px);
  margin-top: 40px;
  text-align: left;
}
.lp-checkout-grid {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: clamp(32px, 4vw, 56px);
  align-items: center;
}
.lp-preco-destaque {
  background: rgba(0,0,0,0.3);
  border: 1px solid rgba(226, 214, 225, 0.2);
  border-radius: 20px;
  padding: 32px 28px;
  text-align: center;
}
.lp-preco-de {
  font-size: 14px;
  color: var(--lilas);
  text-decoration: line-through;
}
.lp-preco-por {
  font-family: var(--display);
  font-size: clamp(48px, 6vw, 76px);
  color: var(--papel);
  line-height: 1;
  margin: 6px 0;
}
.lp-garantia {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 32px;
  padding-top: 24px;
  border-top: 1px solid rgba(226, 214, 225, 0.2);
}
.lp-garantia svg {
  flex: none;
  width: 44px;
  height: 44px;
  color: var(--lilas);
}
.lp-garantia p {
  font-size: 13.5px;
  color: #dfd1de;
  line-height: 1.45;
  margin: 0;
}

@media (max-width: 960px) {
  .lp-cenarios { grid-template-columns: 1fr; }
  .lp-destaque-grid, .lp-nr1-grid { grid-template-columns: 1fr; }
  .lp-modulos-grid { grid-template-columns: 1fr; }
  .lp-publico-grid { grid-template-columns: 1fr; }
  .lp-checkout-grid { grid-template-columns: 1fr; }
}