/* ============================================================
   Casamento Lucas & Vivian — Preto · Dourado · Prateado
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400&family=Great+Vibes&family=Jost:wght@300;400;500;600&display=swap');

:root{
  --preto:#0c0c0e;
  --preto-2:#141418;
  --preto-3:#1d1d23;
  --dourado:#c9a34a;
  --dourado-claro:#e8cf8f;
  --prata:#b9bec7;
  --prata-escura:#7d838e;
  --branco:#f5f2ea;
  --erro:#e2604f;
  --ok:#5fb576;
  --f-script:'Great Vibes',cursive;
  --f-display:'Cormorant Garamond',serif;
  --f-corpo:'Jost',sans-serif;
  --radius:10px;
  --sombra:0 10px 40px rgba(0,0,0,.45);
  --linha:1px solid rgba(201,163,74,.28);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--preto);color:var(--branco);font-family:var(--f-corpo);font-weight:300;line-height:1.7;letter-spacing:.02em}
img{max-width:100%;display:block}
a{color:var(--dourado);text-decoration:none}
::selection{background:var(--dourado);color:var(--preto)}

h1,h2,h3{font-family:var(--f-display);font-weight:500}
.script{font-family:var(--f-script);color:var(--dourado-claro);font-weight:400}

.container{width:min(1100px,92%);margin:0 auto}
section{padding:90px 0}
.sec-titulo{text-align:center;margin-bottom:56px}
.sec-titulo .script{font-size:clamp(1.6rem,3vw,2.2rem);display:block;margin-bottom:4px}
.sec-titulo h2{font-size:clamp(2rem,4.5vw,3rem);letter-spacing:.12em;text-transform:uppercase}
.sec-titulo::after{content:"";display:block;width:70px;height:1px;background:linear-gradient(90deg,transparent,var(--dourado),transparent);margin:22px auto 0}

/* ---------- botões ---------- */
.btn{display:inline-block;padding:16px 42px;border:1px solid var(--dourado);color:var(--dourado);
  font-family:var(--f-corpo);font-size:.85rem;letter-spacing:.25em;text-transform:uppercase;
  background:transparent;cursor:pointer;transition:.35s;border-radius:2px}
.btn:hover{background:var(--dourado);color:var(--preto)}
.btn-solido{background:var(--dourado);color:var(--preto);font-weight:500}
.btn-solido:hover{background:var(--dourado-claro);border-color:var(--dourado-claro)}
.btn-prata{border-color:var(--prata-escura);color:var(--prata)}
.btn-prata:hover{background:var(--prata);color:var(--preto);border-color:var(--prata)}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn-bloco{display:block;width:100%;text-align:center}

/* ---------- header ---------- */
header{position:fixed;inset:0 0 auto 0;z-index:50;background:rgba(12,12,14,.82);backdrop-filter:blur(12px);border-bottom:var(--linha)}
.nav{display:flex;align-items:center;justify-content:space-between;height:66px}
.nav .logo{font-family:var(--f-script);font-size:1.7rem;color:var(--dourado-claro)}
.nav ul{display:flex;gap:26px;list-style:none}
.nav ul a{color:var(--prata);font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;transition:.3s}
.nav ul a:hover{color:var(--dourado)}
.menu-btn{display:none;background:none;border:none;color:var(--dourado);font-size:1.6rem;cursor:pointer}
@media(max-width:900px){
  .menu-btn{display:block}
  .nav ul{position:fixed;top:66px;right:0;flex-direction:column;background:var(--preto-2);
    width:min(320px,80vw);height:calc(100vh - 66px);padding:34px;gap:20px;transform:translateX(100%);transition:.4s;border-left:var(--linha)}
  .nav ul.aberto{transform:none}
}

/* ---------- hero ---------- */
.hero{min-height:100svh;display:flex;align-items:center;justify-content:center;text-align:center;position:relative;
  background:linear-gradient(rgba(12,12,14,.55),rgba(12,12,14,.88)),url('../img/foto09.jpg') center 12%/cover no-repeat;padding:120px 0 80px}
.hero-conteudo{position:relative;z-index:2}
.hero .script{font-size:clamp(1.4rem,3vw,2rem)}
.hero h1{font-size:clamp(3rem,10vw,6.5rem);letter-spacing:.06em;line-height:1.05;margin:8px 0 14px}
.hero h1 .amp{font-family:var(--f-script);color:var(--dourado);font-size:.65em;vertical-align:middle;padding:0 .12em}
.hero-data{font-size:clamp(.95rem,2vw,1.2rem);letter-spacing:.4em;text-transform:uppercase;color:var(--prata)}
.hero-local{margin-top:8px;color:var(--prata-escura);font-size:.85rem;letter-spacing:.14em}
.hero .btn{margin-top:36px}

/* contador */
.contador{display:flex;justify-content:center;gap:clamp(14px,4vw,40px);margin-top:44px;flex-wrap:wrap}
.contador div{min-width:78px}
.contador b{display:block;font-family:var(--f-display);font-size:clamp(2rem,5vw,3.2rem);color:var(--dourado-claro);font-weight:500;line-height:1}
.contador span{font-size:.68rem;letter-spacing:.28em;text-transform:uppercase;color:var(--prata-escura)}

/* seta scroll */
.scroll-seta{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);color:var(--dourado);font-size:1.4rem;animation:flutua 2.2s infinite}
@keyframes flutua{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,10px)}}

/* ---------- nossa história ---------- */
.historia-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.historia-fotos{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.historia-fotos img{border-radius:var(--radius);border:1px solid rgba(201,163,74,.25);box-shadow:var(--sombra);aspect-ratio:3/4;object-fit:cover}
.historia-fotos img:nth-child(2){margin-top:34px}
.timeline{margin-top:34px;border-left:1px solid rgba(201,163,74,.4);padding-left:26px}
.timeline li{list-style:none;position:relative;padding-bottom:24px}
.timeline li::before{content:"";position:absolute;left:-31px;top:8px;width:9px;height:9px;border-radius:50%;background:var(--dourado)}
.timeline b{color:var(--dourado-claro);font-weight:500;letter-spacing:.06em}
.timeline p{color:var(--prata);font-size:.95rem}

/* ---------- adesão / itens ---------- */
.fundo-2{background:var(--preto-2)}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:22px}
.card{background:var(--preto-3);border:var(--linha);border-radius:var(--radius);padding:38px 28px;text-align:center;transition:.35s}
.card:hover{transform:translateY(-6px);border-color:var(--dourado)}
.card .icone{font-size:2rem;color:var(--dourado);margin-bottom:14px}
.card h3{font-size:1.35rem;margin-bottom:10px;letter-spacing:.06em}
.card p{color:var(--prata);font-size:.93rem}

/* aviso garrafal */
.aviso-garrafal{margin-top:54px;text-align:center;border:2px solid var(--dourado);border-radius:var(--radius);
  padding:34px 20px;background:linear-gradient(135deg,rgba(201,163,74,.12),rgba(201,163,74,.03))}
.aviso-garrafal strong{display:block;font-family:var(--f-corpo);font-weight:700;
  font-size:clamp(1.05rem,3vw,1.6rem);letter-spacing:.18em;color:var(--dourado-claro);text-transform:uppercase}
.aviso-garrafal p{margin-top:10px;color:var(--prata);font-size:.95rem}

/* ---------- valores ---------- */
.tabela-valores{max-width:640px;margin:0 auto;background:var(--preto-3);border:var(--linha);border-radius:var(--radius);overflow:hidden}
.tabela-valores .linha{display:flex;justify-content:space-between;align-items:center;padding:24px 34px;border-bottom:1px solid rgba(185,190,199,.1)}
.tabela-valores .linha:last-child{border-bottom:none}
.tabela-valores .preco{font-family:var(--f-display);font-size:1.9rem;color:var(--dourado-claro)}
.tabela-valores small{display:block;color:var(--prata-escura);font-size:.8rem}
.nota-prazo{text-align:center;margin-top:26px;color:var(--prata);font-size:.92rem}
.nota-prazo b{color:var(--dourado)}

/* ---------- galeria ---------- */
.galeria{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.galeria img{aspect-ratio:3/4;object-fit:cover;border-radius:var(--radius);cursor:pointer;transition:.4s;border:1px solid transparent}
.galeria img:hover{transform:scale(1.025);border-color:var(--dourado)}
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.94);display:none;align-items:center;justify-content:center;z-index:99;padding:22px}
.lightbox.aberto{display:flex}
.lightbox img{max-height:92vh;max-width:94vw;object-fit:contain;border-radius:6px}
.lightbox .fechar{position:absolute;top:18px;right:26px;font-size:2.2rem;color:var(--dourado);cursor:pointer;background:none;border:none}

/* ---------- checkout ---------- */
.checkout-caixa{max-width:760px;margin:0 auto;background:var(--preto-3);border:var(--linha);border-radius:var(--radius);padding:clamp(26px,5vw,52px);box-shadow:var(--sombra)}
.passos{display:flex;justify-content:center;gap:10px;margin-bottom:38px;flex-wrap:wrap}
.passos span{width:34px;height:34px;border-radius:50%;border:1px solid var(--prata-escura);color:var(--prata-escura);
  display:flex;align-items:center;justify-content:center;font-size:.85rem}
.passos span.ativo{border-color:var(--dourado);color:var(--preto);background:var(--dourado);font-weight:500}
.passos span.feito{border-color:var(--dourado);color:var(--dourado)}
.passo{display:none;animation:surge .45s}
.passo.ativo{display:block}
@keyframes surge{from{opacity:0;transform:translateY(12px)}to{opacity:1}}

label{display:block;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--prata);margin:18px 0 7px}
input,select,textarea{width:100%;background:var(--preto);border:1px solid rgba(185,190,199,.25);border-radius:6px;
  color:var(--branco);padding:14px 16px;font-family:var(--f-corpo);font-size:1rem;transition:.3s}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--dourado)}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}
@media(max-width:600px){.grid-2{grid-template-columns:1fr}}
.check-linha{display:flex;gap:12px;align-items:flex-start;margin-top:22px}
.check-linha input{width:auto;margin-top:5px}
.check-linha span{font-size:.9rem;color:var(--prata)}
.msg-erro{color:var(--erro);font-size:.85rem;margin-top:10px;display:none}
.msg-erro.mostrar{display:block}
.nav-passos{display:flex;justify-content:space-between;gap:14px;margin-top:34px}

/* acompanhantes */
.acomp-item{background:var(--preto);border:1px solid rgba(185,190,199,.18);border-radius:8px;padding:18px;margin-top:14px;position:relative}
.acomp-item .remover{position:absolute;top:10px;right:12px;background:none;border:none;color:var(--erro);cursor:pointer;font-size:1rem}
.add-acomp{margin-top:18px;background:none;border:1px dashed var(--dourado);color:var(--dourado);width:100%;padding:13px;border-radius:8px;cursor:pointer;letter-spacing:.12em;font-family:var(--f-corpo);text-transform:uppercase;font-size:.8rem}
.resumo-valor{margin-top:26px;padding:20px;border:var(--linha);border-radius:8px;display:flex;justify-content:space-between;align-items:center}
.resumo-valor b{font-family:var(--f-display);font-size:1.8rem;color:var(--dourado-claro)}

/* pagamento */
.opcoes-pag{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:8px}
@media(max-width:600px){.opcoes-pag{grid-template-columns:1fr}}
.op-pag{border:1px solid rgba(185,190,199,.25);border-radius:8px;padding:24px;text-align:center;cursor:pointer;transition:.3s}
.op-pag:hover,.op-pag.sel{border-color:var(--dourado);background:rgba(201,163,74,.08)}
.op-pag .icone{font-size:1.8rem;color:var(--dourado);margin-bottom:8px}
.painel-pag{display:none;margin-top:26px;padding:26px;background:var(--preto);border-radius:8px;border:var(--linha);text-align:center}
.painel-pag.ativo{display:block}
.chave-pix{font-family:monospace;font-size:1.05rem;background:var(--preto-3);padding:14px;border-radius:6px;margin:14px 0;word-break:break-all;color:var(--dourado-claro)}
#qr-pix{display:flex;justify-content:center;margin:14px 0}
#qr-pix canvas,#qr-pix img{background:#fff;padding:12px;border-radius:8px}

/* ---------- infos: mapa, dress, cronograma, hospedagem ---------- */
.info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:22px}
.cronograma{max-width:560px;margin:0 auto}
.cronograma li{list-style:none;display:flex;gap:22px;padding:16px 0;border-bottom:1px solid rgba(185,190,199,.12)}
.cronograma b{font-family:var(--f-display);font-size:1.3rem;color:var(--dourado-claro);min-width:78px}

/* ---------- FAQ ---------- */
.faq{max-width:760px;margin:0 auto}
details{border-bottom:1px solid rgba(185,190,199,.15);padding:6px 0}
summary{cursor:pointer;padding:18px 0;font-family:var(--f-display);font-size:1.2rem;list-style:none;display:flex;justify-content:space-between;align-items:center}
summary::after{content:"+";color:var(--dourado);font-size:1.5rem;transition:.3s}
details[open] summary::after{transform:rotate(45deg)}
details p{padding:0 0 18px;color:var(--prata);font-size:.95rem}

/* ---------- footer ---------- */
footer{background:var(--preto-2);border-top:var(--linha);padding:60px 0 34px;text-align:center}
footer .script{font-size:2.2rem}
footer p{color:var(--prata-escura);font-size:.85rem;margin-top:10px}

/* ---------- música ---------- */
.btn-musica{position:fixed;bottom:22px;right:22px;z-index:60;width:52px;height:52px;border-radius:50%;
  border:1px solid var(--dourado);background:rgba(12,12,14,.85);color:var(--dourado);font-size:1.15rem;cursor:pointer;backdrop-filter:blur(8px);transition:.3s}
.btn-musica.tocando{animation:pulsa 2s infinite}
@keyframes pulsa{0%,100%{box-shadow:0 0 0 0 rgba(201,163,74,.5)}50%{box-shadow:0 0 0 12px rgba(201,163,74,0)}}

/* ---------- loader ---------- */
.loader{position:fixed;inset:0;background:var(--preto);z-index:999;display:flex;flex-direction:column;gap:18px;align-items:center;justify-content:center;transition:opacity .6s}
.loader.some{opacity:0;pointer-events:none}
.loader .script{font-size:3rem}
.loader .barra{width:160px;height:1px;background:rgba(201,163,74,.2);overflow:hidden}
.loader .barra::after{content:"";display:block;width:40%;height:100%;background:var(--dourado);animation:desliza 1.2s infinite}
@keyframes desliza{from{transform:translateX(-100%)}to{transform:translateX(400%)}}

/* ---------- confetes ---------- */
.confete{position:fixed;top:-12px;z-index:98;pointer-events:none;animation:cai linear forwards}
@keyframes cai{to{transform:translateY(110vh) rotate(720deg);opacity:.2}}

/* ---------- área do convidado / admin ---------- */
.painel-pagina{min-height:100svh;padding:120px 0 80px}
.status-pill{display:inline-block;padding:6px 18px;border-radius:99px;font-size:.75rem;letter-spacing:.14em;text-transform:uppercase}
.pill-pendente{background:rgba(226,96,79,.15);color:var(--erro);border:1px solid rgba(226,96,79,.4)}
.pill-analise{background:rgba(185,190,199,.12);color:var(--prata);border:1px solid rgba(185,190,199,.35)}
.pill-confirmado{background:rgba(95,181,118,.14);color:var(--ok);border:1px solid rgba(95,181,118,.4)}
.qr-caixa{background:#fff;border-radius:12px;padding:22px;display:inline-block;margin:18px auto}
.tabela-admin{width:100%;border-collapse:collapse;font-size:.9rem}
.tabela-admin th,.tabela-admin td{padding:12px 10px;border-bottom:1px solid rgba(185,190,199,.12);text-align:left;vertical-align:top}
.tabela-admin th{color:var(--dourado);letter-spacing:.1em;text-transform:uppercase;font-size:.72rem}
.metricas{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin-bottom:34px}
.metrica{background:var(--preto-3);border:var(--linha);border-radius:var(--radius);padding:24px;text-align:center}
.metrica b{display:block;font-family:var(--f-display);font-size:2.2rem;color:var(--dourado-claro)}
.metrica span{font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--prata-escura)}
.toast{position:fixed;bottom:26px;left:50%;transform:translate(-50%,80px);background:var(--preto-3);border:var(--linha);
  color:var(--branco);padding:14px 28px;border-radius:99px;z-index:120;transition:.4s;opacity:0}
.toast.mostrar{transform:translate(-50%,0);opacity:1}

@media(max-width:900px){
  .historia-grid{grid-template-columns:1fr}
  section{padding:64px 0}
}
@media (prefers-reduced-motion: reduce){
  *{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
}
