/* Versão Dourada: o visual das imagens da imersão. Luz âmbar, a silhueta no anel de luz, pó dourado, Cormorant e Jost. */
@font-face { font-family: "Jost"; src: url("/assets/fonts/jost.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }
:root {
	--noite: #140b04;
	--ambar: #2b1707;
	--ouro: #e8b95a;
	--ouro-claro: #f7e3b0;
	--marfim: #fff6e3;
	--texto: rgba(255, 246, 227, .8);
	--grad: linear-gradient(100deg, #9a6a1c 0%, #e8b95a 22%, #fff4d2 40%, #f0c66c 55%, #a8772a 75%, #f7e3b0 100%);
}
html::-webkit-scrollbar { width: 12px; }
html::-webkit-scrollbar-track { background: var(--noite); }
html::-webkit-scrollbar-thumb { border: 2px solid var(--noite); border-radius: 99px; background: linear-gradient(180deg, #fff1c9, #e8b95a 50%, #8a5a14) padding-box; }
::selection { background: #e8b95a; color: #140b04; }
body { background: var(--noite); color: var(--marfim); font: 300 1.0625rem/1.7 "Jost", "Segoe UI", sans-serif; }
h1, h2, h3 { font-family: "Cormorant Garamond", Georgia, serif; font-weight: 500; line-height: 1.08; letter-spacing: .005em; text-wrap: balance; }
h2 { font-size: clamp(2.3rem, 5vw, 4rem); }
:focus-visible { outline: 2px solid var(--ouro); outline-offset: 4px; }
.sobre { font: 400 .8125rem/1.4 "Jost", sans-serif; letter-spacing: .32em; text-transform: uppercase; color: var(--ouro); margin-bottom: 18px; }
.ouro-brilho { background: var(--grad); background-size: 220% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: brilho 7s ease-in-out infinite; filter: drop-shadow(0 2px 18px rgba(232, 185, 90, .25)); }
.ouro-brilho .w > span { background: inherit; -webkit-background-clip: text; background-clip: text; }
@keyframes brilho { 50% { background-position: 100% 0; } }

/* botões dourados com brilho que passa */
.botao { position: relative; overflow: hidden; padding: 17px 30px; border-radius: 999px; background: linear-gradient(120deg, #c9902f, #f3cf7d 45%, #e2a944); color: #241303; font-weight: 600; box-shadow: 0 10px 40px rgba(232, 185, 90, .35); }
.botao::after { content: ""; position: absolute; inset: -40%; background: linear-gradient(110deg, transparent 40%, rgba(255, 255, 255, .7) 50%, transparent 60%); transform: translateX(-80%); transition: transform .9s var(--suave); }
.botao:hover { box-shadow: 0 14px 60px rgba(247, 210, 120, .6); }
.botao:hover::after { transform: translateX(80%); }
.botao--mini { padding: 10px 20px; font-size: .9375rem; }
.botao--grande { padding: 21px 38px; font-size: 1.125rem; margin-top: 36px; }
.link { color: var(--ouro-claro); text-underline-offset: 6px; text-decoration-color: rgba(232, 185, 90, .6); }
.link:hover { color: #fff; }
.acoes { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 28px; margin-top: 30px; }

.progresso { background: var(--grad); }
.topo.rolou { background: rgba(20, 11, 4, .78); backdrop-filter: blur(14px); padding-block: 10px; }
.marca { font: 500 1.05rem/1 "Cormorant Garamond", serif; letter-spacing: .3em; text-transform: uppercase; text-decoration: none; color: var(--ouro-claro); }
.zap-fixo { background: linear-gradient(120deg, #c9902f, #f3cf7d 45%, #e2a944); color: #241303; box-shadow: 0 10px 30px rgba(0, 0, 0, .45); }
.cursor { border: 1.5px solid rgba(247, 227, 176, .8); }
.cursor.sobre { background: rgba(232, 185, 90, .16); border-color: var(--ouro); }
.cursor-ponto { background: var(--ouro-claro); box-shadow: 0 0 12px 3px rgba(255, 214, 140, .8); }
.luz::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: radial-gradient(520px circle at var(--lx, 50%) var(--ly, 40%), rgba(255, 220, 150, .14), transparent 70%); }

/* abertura: a arte dourada inteira, o texto do lado vazio da imagem */
.heroi { min-height: 100svh; display: flex; align-items: center; overflow: hidden; padding: 120px 0 90px; }
.heroi__fundo { position: absolute; inset: -6% 0; z-index: 0; }
.heroi__fundo img { width: 100%; height: 100%; object-fit: cover; animation: respira 22s ease-in-out infinite alternate; }
@keyframes respira { to { transform: scale(1.08); } }
.heroi::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, rgba(20, 11, 4, .88) 0%, rgba(20, 11, 4, .55) 34%, rgba(20, 11, 4, 0) 58%), linear-gradient(0deg, var(--noite) 0%, rgba(20, 11, 4, 0) 28%); }
.heroi__feixe { position: absolute; left: 50%; top: -10%; z-index: 1; width: 3px; height: 70%; background: linear-gradient(180deg, transparent, #fff6dc 40%, transparent); filter: blur(2px); animation: feixe 4.5s ease-in-out infinite; opacity: .7; }
@keyframes feixe { 50% { opacity: .2; transform: scaleY(.85); } }
.heroi__texto { position: relative; z-index: 2; width: min(1200px, 100% - 40px); margin-inline: auto; }
.heroi__texto > * { max-width: 560px; }
.heroi h1 { font-size: clamp(3rem, 6.6vw, 5.8rem); font-weight: 500; }
.heroi__sub { margin-top: 22px; font: italic 400 clamp(1.3rem, 2.2vw, 1.7rem)/1.4 "Cormorant Garamond", serif; color: var(--ouro-claro); }
.data { margin-top: 26px; color: var(--marfim); font-size: .9688rem; }
.data span + span::before { content: "✦"; margin-right: 14px; color: var(--ouro); font-size: .7em; }
.data__aviso { color: var(--ouro-claro); }
.data--centro { justify-content: center; }
.rolar { position: absolute; z-index: 2; left: 50%; bottom: 26px; width: 26px; height: 42px; margin-left: -13px; border: 1.5px solid rgba(247, 227, 176, .6); border-radius: 20px; }
.rolar span { position: absolute; left: 50%; top: 8px; width: 4px; height: 8px; margin-left: -2px; border-radius: 4px; background: var(--ouro-claro); animation: rolar 1.8s ease-in-out infinite; }
@keyframes rolar { 60% { transform: translateY(14px); opacity: 0; } }

/* dores: uma frase por vez, saindo do desfoque */
.dores { padding: 150px 0 120px; background: radial-gradient(ellipse 60% 50% at 50% 50%, rgba(154, 106, 28, .25), transparent 70%), var(--noite); text-align: center; }
.dores .caixa { position: relative; z-index: 2; }
.dor { min-height: 46vh; display: grid; align-content: center; justify-items: center; }
.dor h3 { font-size: clamp(2.2rem, 5.2vw, 4.4rem); font-weight: 400; max-width: 16em; }
.dor p { margin-top: 18px; max-width: 34em; color: var(--texto); font-size: 1.125rem; }

/* a virada */
.virada { padding: 150px 0; text-align: center; background: linear-gradient(180deg, var(--noite), var(--ambar) 50%, var(--noite)); }
.virada__1, .virada__2 { font: italic 400 clamp(1.4rem, 2.6vw, 2rem)/1.4 "Cormorant Garamond", serif; color: var(--texto); }
.virada__2 { margin-top: 10px; }
.virada h2 { margin-top: 44px; font-size: clamp(2.4rem, 5.6vw, 4.6rem); }
.virada__3 { margin-top: 24px; color: var(--texto); font-size: 1.125rem; }

/* convite em vídeo, num arco com anel girando */
.convite { padding: 130px 0; overflow: hidden; }
.convite__grade { position: relative; z-index: 2; display: grid; grid-template-columns: .8fr 1.2fr; gap: 80px; align-items: center; }
.convite__moldura { position: relative; justify-self: center; width: min(360px, 100%); }
.convite__moldura video { position: relative; z-index: 1; width: 100%; aspect-ratio: 9 / 16; object-fit: cover; border-radius: 999px 999px 26px 26px; background: #000; box-shadow: 0 30px 80px rgba(0, 0, 0, .6); }
.convite h2 { margin-bottom: 20px; }
.convite p:not(.sobre) { color: var(--texto); font-size: 1.125rem; max-width: 34em; }
.anel { position: absolute; inset: -18px; border-radius: 999px 999px 40px 40px; padding: 2px; background: conic-gradient(from var(--giro, 0deg), transparent 0 60%, #fff1c9 75%, #e8b95a 85%, transparent 100%); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; animation: anel 6s linear infinite; }
@property --giro { syntax: "<angle>"; initial-value: 0deg; inherits: false; }
@keyframes anel { to { --giro: 360deg; } }

/* o que você vai aprender */
.aprender { padding: 130px 0; background: var(--ambar); }
.aprender h2 { margin-bottom: 50px; }
.itens { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.item { position: relative; overflow: hidden; padding: 38px 36px; border-radius: 22px; border: 1px solid rgba(232, 185, 90, .35); background: linear-gradient(160deg, rgba(255, 220, 150, .08), rgba(255, 220, 150, .02)); transition: transform .5s var(--suave), border-color .4s; }
.item::before { content: ""; position: absolute; inset: 0; background: radial-gradient(300px circle at var(--mx, 50%) var(--my, 50%), rgba(255, 220, 150, .2), transparent 70%); opacity: 0; transition: opacity .4s; }
.item:hover { border-color: var(--ouro); }
.item:hover::before { opacity: 1; }
.item__estrela { display: inline-block; font-size: 1.6rem; color: var(--ouro); transition: transform .8s var(--suave); }
.item:hover .item__estrela { transform: rotate(180deg) scale(1.3); }
.item h3 { margin-top: 12px; font-size: 1.9rem; }
.item p { margin-top: 8px; color: var(--texto); }

/* a Dani */
.dani { padding: 140px 0; overflow: hidden; background: radial-gradient(ellipse 50% 60% at 25% 50%, rgba(154, 106, 28, .3), transparent 70%), var(--noite); }
.dani__grade { position: relative; z-index: 2; display: grid; grid-template-columns: .8fr 1.2fr; gap: 80px; align-items: center; }
.dani__foto { position: relative; justify-self: center; width: min(400px, 100%); }
.dani__foto img { position: relative; z-index: 1; width: 100%; aspect-ratio: 2 / 3; object-fit: cover; border-radius: 999px 999px 24px 24px; }
.anel--gira { inset: -16px; }
.dani h2 { margin-bottom: 22px; }
.dani p { color: var(--texto); margin-top: 14px; max-width: 36em; }
.dani blockquote { margin-top: 30px; padding-left: 26px; border-left: 1px solid var(--ouro); }
.dani blockquote p { font: italic 400 clamp(1.3rem, 2vw, 1.6rem)/1.45 "Cormorant Garamond", serif; color: var(--ouro-claro); }

/* depoimentos numa esteira que corre */
.depoimentos { padding: 120px 0; background: var(--ambar); overflow: hidden; }
.depoimentos h2 { margin-bottom: 50px; }
.esteira__trilho { display: flex; gap: 22px; width: max-content; animation: esteira 70s linear infinite; }
.esteira:hover .esteira__trilho { animation-play-state: paused; }
@keyframes esteira { to { transform: translateX(-50%); } }
.depo { width: 380px; flex: none; padding: 34px 30px; border-radius: 22px; background: linear-gradient(170deg, #fff8ea, #f3e1bb); color: #2b1707; box-shadow: 0 20px 50px rgba(0, 0, 0, .35); }
.depo__ini { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 50%; background: linear-gradient(135deg, #a8772a, #f0c66c); color: #fff; font: 600 1.1rem "Jost", sans-serif; }
.depo h3 { margin-top: 16px; font-size: 1.55rem; color: #4a2b06; }
.depo blockquote { margin-top: 10px; font-size: .9688rem; line-height: 1.6; }
.depo figcaption { margin-top: 14px; font-size: .875rem; color: #7a5520; }

/* oferta */
.oferta { padding: 150px 0; overflow: hidden; text-align: center; }
.oferta .heroi__fundo { opacity: .45; }
.oferta::before { content: ""; position: absolute; inset: 0; z-index: 1; background: radial-gradient(ellipse 60% 70% at 50% 50%, rgba(20, 11, 4, .55), rgba(20, 11, 4, .95)); }
.oferta__caixa { position: relative; z-index: 2; }
.preco { margin: 44px auto 0; padding: 40px 30px; max-width: 560px; border-radius: 28px; border: 1px solid rgba(232, 185, 90, .5); background: rgba(20, 11, 4, .55); backdrop-filter: blur(10px); box-shadow: 0 0 80px rgba(232, 185, 90, .2); }
.preco__de { letter-spacing: .2em; text-transform: uppercase; font-size: .875rem; color: var(--texto); }
.preco__por { font: 500 clamp(4.4rem, 11vw, 7.5rem)/1 "Cormorant Garamond", serif; margin-top: 8px; }
.preco__nota { margin-top: 12px; color: var(--texto); }
.bonus { margin-top: 30px; display: grid; gap: 4px; }
.bonus span { color: var(--ouro); letter-spacing: .2em; text-transform: uppercase; font-size: .8125rem; }
.bonus b { font: 500 1.6rem/1.3 "Cormorant Garamond", serif; }
.vagas { margin: 30px auto 0; max-width: 420px; }
.vagas__barra { margin-top: 10px; height: 6px; border-radius: 6px; background: rgba(255, 246, 227, .15); overflow: hidden; }
.vagas__barra i { display: block; height: 100%; width: 0; background: var(--grad); transition: width 2s var(--suave) .3s; }
.vagas.on .vagas__barra i { width: 82%; }
.contagem { justify-content: center; margin-top: 34px; }
.contagem div { padding: 14px 10px; border-radius: 16px; border: 1px solid rgba(232, 185, 90, .3); background: rgba(255, 220, 150, .05); }
.contagem b { font: 500 2.6rem/1 "Cormorant Garamond", serif; color: var(--ouro-claro); }
.contagem small { margin-top: 4px; font-size: .75rem; letter-spacing: .14em; text-transform: uppercase; color: var(--texto); }
.oferta .data { margin-top: 18px; }

/* perguntas */
.perguntas { padding: 120px 0; }
.perguntas h2 { margin-bottom: 40px; }
.pergunta { border-bottom: 1px solid rgba(232, 185, 90, .3); }
.pergunta summary { padding: 24px 0; font: 500 1.6rem/1.3 "Cormorant Garamond", serif; }
.pergunta summary::after { color: var(--ouro); font-size: 1.8rem; }
.pergunta p { padding: 0 40px 26px 0; color: var(--texto); }

/* fechamento */
.fim { padding: 160px 0; text-align: center; overflow: hidden; background: radial-gradient(ellipse 60% 80% at 50% 100%, rgba(232, 185, 90, .35), transparent 70%), var(--noite); }
.fim .caixa { position: relative; z-index: 2; }
.fim p { color: var(--texto); font-size: 1.2rem; }
.fim h2 { margin: 16px 0; font-size: clamp(2.8rem, 7vw, 5.4rem); }
.pe { color: rgba(255, 246, 227, .6); background: #0d0702; }

@media (max-width: 900px) {
	.heroi { align-items: flex-end; padding-bottom: 110px; }
	.heroi::before { background: linear-gradient(0deg, var(--noite) 0%, rgba(20, 11, 4, .82) 45%, rgba(20, 11, 4, .1) 75%); }
	.convite__grade, .dani__grade, .itens { grid-template-columns: 1fr; gap: 50px; }
	.dor { min-height: 38vh; }
	.heroi h1 { font-size: clamp(2.6rem, 12vw, 3.6rem); }
	.depo { width: 300px; }
	.contagem { gap: 8px; }
	.contagem div { min-width: 58px; }
	.contagem b { font-size: 2rem; }
}