/* Galerias do portfólio — mesma paleta do site. */
:root{
  --bg:        #0b1022;
  --bg-deep:   #070a17;
  --surface:   #121a33;
  --ink:       #f5f1e6;
  --ink-dim:   #b6bcd2;
  --ink-faint: #7e87a6;
  --gold:      #c9a24a;
  --gold-soft: #e8cf93;
  --line:      rgba(245,241,230,0.13);
}
*{box-sizing:border-box;}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:'Jost',system-ui,-apple-system,sans-serif; font-weight:300; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
body.visor-aberto{overflow:hidden;}
h1,h2{font-family:'Cormorant Garamond','Times New Roman',serif; font-weight:400; margin:0; text-wrap:balance;}
p{margin:0;}
a{color:inherit;}
img{max-width:100%;}
:focus-visible{outline:2px solid var(--gold-soft); outline-offset:3px;}
.wrap{max-width:1320px; margin:0 auto; padding:0 28px;}

/* ---------- barra ---------- */
.barra{
  position:sticky; top:0; z-index:20;
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  padding:12px 28px; background:rgba(7,10,23,0.95); backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.barra .marca img{height:46px; width:auto; display:block;}
.voltar{
  display:inline-flex; align-items:center; gap:8px; min-height:44px; padding:0 4px;
  font-size:12px; letter-spacing:0.14em; text-transform:uppercase; text-decoration:none; color:var(--gold-soft);
}
.voltar:hover{color:#fff5e0;}

/* ---------- cabeçalho do álbum ---------- */
.album-topo{padding:64px 0 36px;}
.etiqueta{font-size:11px; font-weight:500; letter-spacing:0.24em; text-transform:uppercase; color:var(--gold-soft);}
.album-topo h1{font-size:clamp(36px,5.4vw,64px); line-height:1.05; margin-top:14px;}
.album-topo p{color:var(--ink-dim); margin-top:14px; font-size:16px;}

/* ---------- mosaico ---------- */
.mosaico{columns:4 260px; column-gap:8px; padding-bottom:40px;}
.foto{
  display:block; margin:0 0 8px; break-inside:avoid;
  border-radius:14px; overflow:hidden; background:var(--surface);
  position:relative;
}
.foto img{display:block; width:100%; height:auto; transition:transform .6s cubic-bezier(.2,.7,.3,1);}
.foto:hover img{transform:scale(1.04);}
.foto:focus-visible{outline-offset:2px;}
.foto::after{
  content:""; position:absolute; inset:0; border-radius:inherit;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,0.06); pointer-events:none;
}

/* ---------- chamada para a lista ---------- */
.convite{
  margin:24px 0 72px; padding:44px 36px; text-align:center;
  border:1px solid rgba(232,207,147,0.3); background:var(--surface); border-radius:18px;
}
.convite h2{font-size:clamp(26px,3.4vw,38px);}
.convite p{color:var(--ink-dim); margin:12px auto 0; max-width:520px;}
.btn-ouro{
  display:inline-flex; align-items:center; justify-content:center; margin-top:26px;
  min-height:48px; padding:16px 36px; border-radius:2px; text-decoration:none;
  font-size:11px; font-weight:500; letter-spacing:0.22em; text-transform:uppercase; color:#1d1608;
  background:linear-gradient(135deg, var(--gold-soft) 0%, var(--gold) 54%, #b1883a 100%);
  box-shadow:0 10px 30px rgba(0,0,0,0.42), inset 0 1px 0 rgba(255,255,255,0.45);
  transition:transform .22s ease;
}
.btn-ouro:hover{transform:translateY(-2px);}

/* ---------- rodapé ---------- */
.rodape{border-top:1px solid var(--line); background:var(--bg-deep); padding:36px 0;}
.rodape .wrap{display:flex; flex-wrap:wrap; justify-content:space-between; gap:18px; font-size:13px; color:var(--ink-faint);}
.rodape a{color:var(--ink-dim); text-decoration:none;}
.rodape a:hover{color:var(--gold-soft);}
.rodape nav{display:flex; flex-wrap:wrap; gap:22px;}

/* ---------- visualizador ---------- */
.visor{
  width:100vw; height:100vh; max-width:none; max-height:none; margin:0; padding:0;
  border:none; background:rgba(4,6,14,0.97); color:var(--ink);
}
.visor::backdrop{background:rgba(4,6,14,0.9);}
.visor-palco{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  padding:64px 84px 56px;
}
.visor-img{
  max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain;
  border-radius:6px; box-shadow:0 20px 60px rgba(0,0,0,0.6);
}
.visor button{
  position:absolute; z-index:2; display:flex; align-items:center; justify-content:center;
  width:52px; height:52px; border-radius:50%; cursor:pointer;
  border:1px solid rgba(232,207,147,0.4); background:rgba(18,26,51,0.8); color:var(--gold-soft);
  font-size:22px; line-height:1; transition:background .2s;
}
.visor button:hover{background:rgba(201,162,74,0.22);}
.visor-fechar{top:14px; right:16px;}
.visor-ant{left:18px; top:50%; transform:translateY(-50%);}
.visor-prox{right:18px; top:50%; transform:translateY(-50%);}
.visor-contador{
  position:absolute; left:0; right:0; bottom:18px; text-align:center;
  font-size:12px; letter-spacing:0.16em; text-transform:uppercase; color:var(--ink-dim);
}
@media(max-width:640px){
  .visor-palco{padding:64px 10px 76px;}
  .visor-ant, .visor-prox{top:auto; bottom:10px; transform:none;}
  .visor-ant{left:12px;} .visor-prox{right:12px;}
  .visor-contador{bottom:26px;}
  .mosaico{columns:2 140px; column-gap:6px;}
  .foto{margin-bottom:6px; border-radius:10px;}
}
@media(prefers-reduced-motion:reduce){
  .foto img, .btn-ouro{transition:none;}
}