/* Galeria (galeria.html): coleções por marca, filtro, "ver mais".
   O lightbox é o de js/main.js (cada .masonry é um grupo navegável). */

.top-nav a[aria-current="page"]{color:var(--gold-2)}
.top-nav a[aria-current="page"]::after{right:0}

.gx-hero{position:relative;padding:clamp(140px,18vw,210px) 0 clamp(40px,6vw,70px);overflow:hidden;
  background:radial-gradient(70% 60% at 85% 0%,rgba(139,44,255,.16),transparent 70%),radial-gradient(60% 50% at 0% 100%,rgba(217,164,65,.12),transparent 70%)}
.gx-hero h1{font-family:var(--display);font-weight:900;text-transform:uppercase;letter-spacing:-.04em;line-height:.9;font-size:clamp(2.8rem,9vw,7.4rem)}
.gx-hero h1 .gold{display:block}
.gx-lede{max-width:560px;margin-top:24px;color:var(--muted);font-size:clamp(16px,1.6vw,19px)}
.gx-stats{list-style:none;display:flex;flex-wrap:wrap;gap:12px 34px;margin-top:34px}
.gx-stats li{font-size:14px;color:var(--muted)}
.gx-stats b{display:block;font-family:var(--display);font-weight:800;font-size:clamp(1.6rem,3vw,2.3rem);color:var(--text);letter-spacing:-.02em;line-height:1.1}

/* filtro por marca: fica preso por baixo do cabeçalho */
.gx-tabs{position:sticky;top:68px;z-index:40;background:rgba(8,7,10,.86);backdrop-filter:blur(14px) saturate(140%);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.gx-tabs .wrap{display:flex;gap:8px;overflow-x:auto;padding-top:12px;padding-bottom:12px;scrollbar-width:none}
.gx-tabs .wrap::-webkit-scrollbar{display:none}
.gx-tabs button{flex:none;display:inline-flex;align-items:center;gap:9px;padding:10px 16px;border-radius:999px;border:1px solid var(--line);font-family:var(--display);font-size:11.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:rgba(239,236,230,.82);transition:border-color .3s,color .3s,background .3s}
.gx-tabs button span{font-family:var(--body);font-weight:500;letter-spacing:0;color:var(--muted);font-size:12px}
.gx-tabs button:hover{border-color:rgba(246,217,139,.5);color:var(--gold-2)}
.gx-tabs button[aria-pressed="true"]{background:var(--gold-grad);background-size:200% 100%;border-color:transparent;color:#1b1206}
.gx-tabs button[aria-pressed="true"] span{color:rgba(27,18,6,.7)}

.gx-brand{padding:clamp(60px,8vw,110px) 0 0;scroll-margin-top:130px}
.gx-brand[hidden]{display:none}
.gx-brand + .gx-brand{border-top:1px solid var(--line);margin-top:clamp(50px,7vw,90px)}
.gx-brand-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px 40px;align-items:end}
.gx-brand-head h2{font-size:clamp(2rem,5vw,3.8rem)}
.gx-brand-head p{color:var(--muted);margin-top:14px;max-width:560px}
.gx-ig{display:inline-flex;align-items:center;gap:8px;text-decoration:none;font-size:13px;font-weight:600;padding:10px 16px;border-radius:999px;border:1px solid rgba(246,217,139,.4);color:var(--gold-2);white-space:nowrap;transition:background .3s,color .3s}
.gx-ig svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8}
.gx-ig svg .dot{fill:currentColor;stroke:none}
.gx-ig:hover{background:var(--gold-2);color:var(--ink)}
.gx-brand-head .gx-ig{justify-self:start}

.gx-group{margin-top:clamp(40px,5vw,64px);scroll-margin-top:130px}
.gx-group-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px 24px;flex-wrap:wrap;padding-bottom:16px;border-bottom:1px solid var(--line)}
.gx-group-head h3{font-family:var(--display);font-weight:800;font-size:clamp(1.15rem,2vw,1.55rem);letter-spacing:-.015em}
.gx-group-head p{font-size:14px;color:var(--muted)}
.gx-group-head p b{color:var(--gold-2);font-weight:600}

.gx-grid{margin-top:20px}
.gx-grid img{filter:none}
.gx-grid button{background:var(--ink-3)}
.gx-grid button::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(246,217,139,0);transition:box-shadow .4s}
.gx-grid button:hover::after{box-shadow:inset 0 0 0 1px rgba(246,217,139,.55)}
.gx-grid .gx-x{display:none}
.gx-group.open .gx-grid .gx-x{display:block}
.gx-more{display:flex;justify-content:center;margin-top:8px}
.gx-group.open .gx-more{display:none}

.gx-cta{margin-top:clamp(80px,10vw,130px);padding:clamp(60px,8vw,100px) 0;border-top:1px solid var(--line);text-align:center;background:radial-gradient(60% 80% at 50% 100%,rgba(217,164,65,.12),transparent 70%)}
.gx-cta h2{max-width:820px;margin:0 auto}
.gx-cta p{color:var(--muted);margin:18px auto 0;max-width:520px}
.gx-cta .hero-ctas{justify-content:center}

/* Página inicial: coleções por baixo das fotografias */
.gx-cols{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(10px,1.4vw,18px);margin-top:clamp(36px,4vw,56px)}
.gx-col{position:relative;display:block;aspect-ratio:4/5;border-radius:16px;overflow:hidden;text-decoration:none;background:var(--ink-3);isolation:isolate}
.gx-col img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .9s var(--ease)}
.gx-col::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(8,7,10,.05) 30%,rgba(8,7,10,.88) 100%)}
.gx-col span{position:absolute;left:16px;right:16px;bottom:16px;display:flex;flex-direction:column;gap:4px}
.gx-col b{font-family:var(--display);font-weight:800;font-size:clamp(15px,1.6vw,19px);text-transform:uppercase;letter-spacing:-.01em;line-height:1.1}
.gx-col em{font-style:normal;font-size:13px;color:var(--gold-2)}
.gx-col:hover img{transform:scale(1.06)}
.gx-all{display:flex;justify-content:center;margin-top:clamp(28px,3vw,40px)}

@media (max-width:980px){
  .gx-tabs{top:68px}
  .gx-brand-head{grid-template-columns:1fr}
  .gx-cols{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:620px){
  .gx-tabs{top:60px}
  .gx-tabs button{padding:9px 13px;font-size:10.5px}
  .gx-grid{columns:2 140px}
}
