/* Alto Padrão Formaturas: noite de gala. Preto da marca (#181914), ouro (#BC9C22), losango art déco do monograma. */
@font-face{font-family:'Bodoni Moda';font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/BodoniModa-normal.woff2) format('woff2')}
@font-face{font-family:'Bodoni Moda';font-style:italic;font-weight:400 700;font-display:swap;src:url(/fonts/BodoniModa-italic.woff2) format('woff2')}
@font-face{font-family:'Karla';font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/Karla-normal.woff2) format('woff2')}

:root{
  --noite:#181914; --noite-2:#22231c; --noite-3:#2d2e25;
  --ouro:#bc9c22; --ouro-claro:#e2c766; --champanhe:#efe5c4; --papel:#f6f1e1;
  --texto:#e9e3cf; --texto-2:#b8b29d; --linha:color-mix(in oklch,var(--ouro) 38%,transparent);
  --serif:'Bodoni Moda',Didot,'Times New Roman',serif; --sans:'Karla',system-ui,-apple-system,'Segoe UI',sans-serif;
  --raio:2px; --ease:cubic-bezier(.2,.7,.2,1); --dur:.7s;
  --gutter:clamp(16px,4vw,48px); --max:1180px;
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--noite);color:var(--texto);font:400 clamp(16px,1.05vw + 12px,18px)/1.65 var(--sans)}
img{max-width:100%;height:auto;display:block}
a{color:var(--ouro-claro);text-underline-offset:3px}
a:hover{color:var(--champanhe)}
:focus-visible{outline:2px solid var(--ouro-claro);outline-offset:3px}
h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.1;color:var(--champanhe);margin:0 0 .5em}
h1{font-size:clamp(2.4rem,5.6vw,4.6rem);letter-spacing:-.01em}
h2{font-size:clamp(1.7rem,3.2vw,2.6rem)}
h3{font-size:1.3rem}
h1 em,h2 em{font-style:italic;color:var(--ouro-claro)}
.sobre{font:italic 500 1.05rem/1.3 var(--serif);color:var(--ouro);margin:0 0 1rem;display:flex;align-items:center;gap:.7em}
.sobre::before{content:"";width:.55em;height:.55em;border:1px solid currentColor;transform:rotate(45deg);flex:none}
.lead{font-size:1.15em;color:var(--texto);max-width:60ch}
.pular{position:absolute;left:-999px;top:0;background:var(--ouro);color:var(--noite);padding:.6em 1em;z-index:10}
.pular:focus{left:var(--gutter)}

/* Topo: monograma em losango + nome em duas linhas, como a assinatura do convite */
.topo{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;display:flex;align-items:center;gap:1.5rem;
  padding:.8rem var(--gutter);background:var(--noite);
  border-bottom:1px solid transparent;transition:border-color .4s}
.topo.rolou{border-bottom-color:var(--linha)}
.marca{display:flex;align-items:center;gap:.8rem;text-decoration:none;color:var(--champanhe);margin-right:auto}
.losango{width:52px;height:52px;flex:none}
.losango img{width:52px;height:52px}
.marca-txt{font:500 1.25rem/1 var(--serif);display:flex;flex-direction:column}
.marca-txt em{font:italic 400 .82rem/1.5 var(--serif);color:var(--ouro)}
.menu{display:flex;gap:1.4rem}
.menu a{color:var(--texto-2);text-decoration:none;font-size:.95rem;padding:.3rem 0;border-bottom:1px solid transparent}
.menu a:hover,.menu a[aria-current]{color:var(--champanhe);border-bottom-color:var(--ouro)}
.menu-btn{display:none;background:none;border:1px solid var(--linha);color:var(--champanhe);font:600 .95rem var(--sans);padding:.55rem .9rem;border-radius:var(--raio)}
@media (max-width:860px){
  .menu-btn{display:block}
  .menu{position:absolute;left:0;right:0;top:100%;flex-direction:column;gap:0;background:var(--noite-2);border-bottom:1px solid var(--linha);padding:.5rem var(--gutter) 1rem}
  .menu a{padding:.8rem 0;border-bottom:1px solid color-mix(in oklch,var(--ouro) 14%,transparent)}
  .menu[hidden]{display:none}
}

main{display:block}
section{padding:clamp(56px,9vw,120px) var(--gutter)}
section>*{max-width:var(--max);margin-left:auto;margin-right:auto}
.sec-cab{margin-bottom:2.5rem}

/* Hero */
.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(24px,5vw,72px);align-items:center;max-width:calc(var(--max) + 2*var(--gutter));margin:0 auto;padding-top:clamp(32px,6vw,80px)}
.hero>*{max-width:none;margin:0}
.mini{font-size:.9rem;color:var(--texto-2);max-width:52ch}
.hero-arte{position:relative;display:grid;place-items:center;min-height:440px}
.moldura{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.moldura rect{fill:none;stroke:var(--ouro);stroke-width:1;stroke-dasharray:1;stroke-dashoffset:1;animation:traco 2.2s var(--ease) .2s forwards}
.moldura rect+rect{stroke:var(--linha);animation-delay:.6s}
@keyframes traco{to{stroke-dashoffset:0}}
.tela-hero{position:relative;width:min(250px,62%);border-radius:28px;border:6px solid #0d0d0a;box-shadow:0 30px 80px -20px #000;
  animation:sobe 1.1s var(--ease) .35s both}
@keyframes sobe{from{opacity:0;transform:translateY(40px)}}
@media (max-width:760px){.hero{grid-template-columns:1fr}.hero-arte{min-height:360px;order:-1}}

.lojas{display:flex;flex-wrap:wrap;gap:.8rem;margin:1.6rem 0 1rem}
.loja{display:inline-flex;align-items:center;gap:.7rem;padding:.65rem 1.1rem .65rem .9rem;border:1px solid var(--ouro);border-radius:var(--raio);
  color:var(--champanhe);text-decoration:none;background:var(--noite-2);transition:background .3s,transform .3s var(--ease)}
.loja svg{width:26px;height:26px;color:var(--ouro-claro)}
.loja span{display:flex;flex-direction:column;font:600 1.05rem/1.1 var(--sans)}
.loja small{font-weight:400;font-size:.72rem;color:var(--texto-2);letter-spacing:.04em}
.loja:hover{background:var(--noite-3);transform:translateY(-2px);color:var(--champanhe)}

/* Recursos: lista com losangos, sem cartões iguais em grade */
.faixa{background:var(--noite-2);border-block:1px solid var(--linha)}
.recursos{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:0 3rem}
.rec{padding:1.4rem 0 1.4rem 2.2rem;border-top:1px solid color-mix(in oklch,var(--ouro) 20%,transparent);position:relative}
.rec-n{position:absolute;left:0;top:1.55rem;color:var(--ouro);font-size:.9rem}
.rec h3{margin-bottom:.3rem}
.rec p{margin:0;color:var(--texto-2)}

/* Telas: fila que rola de lado no celular */
.telas-fila{display:flex;gap:clamp(16px,3vw,40px);justify-content:center;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:1rem}
.telas figure{margin:0;flex:0 0 min(240px,70vw);scroll-snap-align:center}
.telas figure:nth-child(2){transform:translateY(32px)}
.telas img{border-radius:24px;border:5px solid #0d0d0a;box-shadow:0 20px 50px -20px #000}
.telas figcaption{font-size:.88rem;color:var(--texto-2);margin-top:.8rem;text-align:center}

/* Assinatura: contagem regressiva, a mesma da tela inicial do app */
.contagem-caixa{border:1px solid var(--linha);padding:clamp(24px,5vw,56px);position:relative;background:linear-gradient(120deg,var(--noite-2),color-mix(in oklch,var(--ouro) 18%,var(--noite-2)))}
.contagem-caixa::before,.contagem-caixa::after{content:"";position:absolute;width:14px;height:14px;border:1px solid var(--ouro);transform:rotate(45deg);top:-8px;left:calc(50% - 7px);background:var(--noite)}
.contagem-caixa::after{top:auto;bottom:-8px}
.data{display:inline-flex;flex-direction:column;gap:.4rem;font-size:.9rem;color:var(--texto-2);margin:.5rem 0 1.5rem}
input,select,textarea{font:inherit;color:var(--texto);background:var(--noite);border:1px solid var(--linha);border-radius:var(--raio);padding:.7rem .8rem;width:100%}
input:focus,select:focus,textarea:focus{border-color:var(--ouro-claro);outline:none}
.data input{width:auto}
.relogio{display:grid;grid-template-columns:repeat(5,1fr);gap:.6rem;max-width:560px}
.relogio span{border:1px solid var(--linha);background:color-mix(in oklch,var(--noite) 55%,transparent);padding:.7rem .3rem;text-align:center;font-size:.8rem;color:var(--texto-2)}
.relogio b{display:block;font:500 clamp(1.5rem,4vw,2.4rem)/1.1 var(--serif);color:var(--champanhe);font-variant-numeric:tabular-nums}

.cartoes{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:1.2rem}
.cartao{display:block;padding:1.8rem;border:1px solid var(--linha);text-decoration:none;color:var(--texto);transition:background .3s,border-color .3s}
.cartao p{color:var(--texto-2)}
.cartao span{color:var(--ouro-claro);font-weight:600}
.cartao:hover{background:var(--noite-2);border-color:var(--ouro);color:var(--texto)}

/* Páginas internas */
.pagina{max-width:860px;margin:0 auto}
.pagina h2{margin-top:2.6rem}
.texto h2{font-size:clamp(1.35rem,2.4vw,1.75rem)}
.lista{padding-left:1.2rem}
.lista li{margin:.5rem 0}
.lista li::marker{content:"◆  ";color:var(--ouro);font-size:.7em}
.canais{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:1rem;margin:2rem 0}
.canal{display:flex;flex-direction:column;gap:.3rem;padding:1.2rem;border:1px solid var(--linha);text-decoration:none;color:var(--texto);word-break:break-word}
.canal b{font:italic 500 1.05rem var(--serif);color:var(--ouro)}
a.canal:hover{border-color:var(--ouro);color:var(--champanhe)}
.faq details{border-top:1px solid var(--linha);padding:1rem 0}
.faq summary{cursor:pointer;font:500 1.15rem var(--serif);color:var(--champanhe)}
.faq p{color:var(--texto-2);margin:.7rem 0 0}
.passos{counter-reset:p;list-style:none;padding:0;margin:2rem 0}
.passos li{counter-increment:p;display:grid;grid-template-columns:3rem 1fr;gap:.2rem 1rem;padding:1.1rem 0;border-top:1px solid var(--linha)}
.passos li::before{content:counter(p);grid-row:span 2;width:2.4rem;height:2.4rem;display:grid;place-items:center;background:var(--ouro);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);font:600 1rem var(--serif);color:var(--noite)}
.passos b{color:var(--champanhe)}
.passos span{color:var(--texto-2);word-break:break-word}
.aviso{border:1px solid var(--linha);padding:1rem 1.2rem;color:var(--texto);background:var(--noite-2)}
.tabela{overflow-x:auto}
table{border-collapse:collapse;width:100%;min-width:520px}
th,td{text-align:left;padding:.7rem .6rem;border-bottom:1px solid var(--linha);vertical-align:top}
th{font:italic 500 1rem var(--serif);color:var(--ouro)}

/* Formulário */
.form{margin-top:1rem}
.campos{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.campos label{display:flex;flex-direction:column;gap:.35rem;font-size:.9rem;color:var(--texto-2)}
.campos .largo{grid-column:1/-1}
@media (max-width:600px){.campos{grid-template-columns:1fr}}
[aria-invalid="true"]{border-color:#d9776b}
.isca{position:absolute;left:-9999px}
.cf-turnstile{margin:1.2rem 0}
.botao{display:inline-block;background:var(--ouro);color:var(--noite);border:0;border-radius:var(--raio);padding:.85rem 1.6rem;font:700 .95rem var(--sans);letter-spacing:.06em;cursor:pointer;text-decoration:none;transition:background .3s}
.botao:hover{background:var(--ouro-claro);color:var(--noite)}
.botao[disabled]{opacity:.6;cursor:wait}
.botao.fantasma{background:none;border:1px solid var(--ouro);color:var(--champanhe)}
.erro,.status.erro{color:#e9988e}
.status.ok{color:var(--ouro-claro)}
.nota{font-size:.85rem;color:var(--texto-2)}

/* Rodapé */
.rodape{border-top:1px solid var(--linha);padding:3rem var(--gutter) calc(2rem + env(safe-area-inset-bottom,0px));background:#11120e;font-size:.92rem;color:var(--texto-2)}
.rodape-grade{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2rem}
@media (max-width:760px){.rodape-grade{grid-template-columns:1fr}}
.rodape a{color:var(--texto)}
.rodape-marca{font:500 1.4rem var(--serif);color:var(--champanhe);margin-top:0}
.rodape-marca em{color:var(--ouro-claro)}
.rodape-tit{font:italic 500 1.05rem var(--serif);color:var(--ouro);margin-top:0}
.rodape-fim{max-width:var(--max);margin:2.5rem auto 0;padding-top:1.2rem;border-top:1px solid color-mix(in oklch,var(--ouro) 15%,transparent);font-size:.82rem}
.dms-pref{background:none;border:0;color:var(--texto);text-decoration:underline;font:inherit;cursor:pointer;padding:0}
.assinatura{color:var(--texto-2)!important}

/* Entrada ao rolar (IntersectionObserver em site.js) */
.js .reveal{opacity:0;transform:translateY(22px);transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease)}
.js .reveal.in{opacity:1;transform:none}
.js .telas figure.reveal.in:nth-child(2){transform:translateY(32px)}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001s!important;animation-delay:0s!important;transition-duration:.001s!important}
  .js .reveal{opacity:1;transform:none}
}
:root{--dms-cookies-bg:#22231c;--dms-cookies-fg:#e9e3cf;--dms-cookies-accent:#bc9c22;--dms-cookies-accent-fg:#181914}
