:root{
  --black:#121212;
  --black-2:#1D1D1D;
  --gold:#D6A331;
  --gold-dark:#AE812A;
  --red:#A32B37;
  --red-dark:#87212B;
  --green:#3FC53B;
  --cream:#FFFFFF;
  --bone:#FFFFFF;
  --bone-2:#EFEFEF;
  --ink:#1A1A1A;
  --fog:#A8A8A8;
  --header-h:70px;
  --maxw:1180px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth; overflow-x:hidden;}
body{
  margin:0;
  overflow-x:hidden;
  font-family:'Figtree', sans-serif;
  background:var(--bone);
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
  padding-top:var(--header-h);
}
img{max-width:100%; display:block;}
a{text-decoration:none; color:inherit;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 24px;}

.stitch{
  border:none;
  height:0;
  border-top:2px dashed rgba(244,239,225,0.28);
  margin:0;
}

/* ---------- scroll reveal (só com JS ativo) ---------- */
.js .reveal{
  opacity:0;
  transition:opacity .9s cubic-bezier(.16,.8,.3,1), transform .9s cubic-bezier(.16,.8,.3,1);
  will-change:opacity, transform;
}
.js .reveal-up{transform:translateY(34px);}
.js .reveal-left{transform:translateX(-42px);}
.js .reveal-right{transform:translateX(42px);}
.js .reveal.in-view{opacity:1; transform:translate(0,0);}
@media(prefers-reduced-motion: reduce){
  .js .reveal, .js .reveal-up, .js .reveal-left, .js .reveal-right{transition:none; transform:none; opacity:1;}
}

/* ---------- header ---------- */
header{
  background:var(--black);
  position:fixed; top:0; left:0; right:0; z-index:200;
  min-height:var(--header-h);
  display:flex; align-items:center;
  border-bottom:1px solid rgba(244,239,225,0.08);
}
.nav{
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 20px;
  max-width:var(--maxw); margin:0 auto;
  width:100%;
  gap:16px;
}
.brand{display:flex; align-items:center; gap:12px; min-width:0;}
.brand img{height:42px; width:42px; border-radius:50%; object-fit:cover; border:2px solid var(--gold); flex-shrink:0;}
.brand span{
  color:var(--cream); font-weight:700; font-size:16px; letter-spacing:0.01em;
  white-space:nowrap;
}
.navlinks{display:none; gap:26px; align-items:center;}
.navlinks a{
  color:var(--fog); font-weight:500; font-size:15px; transition:color .2s;
}
.navlinks a:hover{color:var(--cream);}
@media(min-width:860px){ .navlinks{display:flex;} }

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  background:var(--gold); color:var(--black);
  font-weight:700; font-size:15px;
  padding:12px 20px; border-radius:8px;
  transition:background .2s, transform .15s;
  white-space:normal;
  text-align:center;
  line-height:1.25;
}
.btn:hover{background:var(--gold-dark); transform:translateY(-1px);}
.btn--ghost{
  background:transparent; border:1.5px solid var(--fog); color:var(--cream);
}
.btn--ghost:hover{border-color:var(--cream); background:rgba(244,239,225,0.06);}
.btn svg{width:18px; height:18px; flex-shrink:0;}
.btn--nav{
  padding:9px 14px; font-size:13px; gap:6px;
  flex-shrink:0;
  background:var(--green); color:#FFFFFF;
}
.btn--nav:hover{background:#33A631;}
.btn--nav svg{width:16px; height:16px;}
.btn--nav .btn-label-full{display:none;}
.btn--nav .btn-label-short{display:inline;}
@media(min-width:480px){
  .btn--nav{padding:11px 18px; font-size:14px;}
  .btn--nav .btn-label-full{display:inline;}
  .btn--nav .btn-label-short{display:none;}
}

/* ---------- grupo VIP de leilões (topo) ---------- */
.vip-band{
  background:linear-gradient(rgba(0,0,0,.8), rgba(0,0,0,.8)), url("/vip-fundo.webp") center/cover no-repeat, #272727;
  color:#FFFFFF; text-align:center;
  padding:40px 0 48px;
}
@media(max-width:767px){
  .vip-band{background-image:linear-gradient(rgba(0,0,0,.8), rgba(0,0,0,.8)), url("/faca-6.webp");}
}
.vip-title{font-size:clamp(28px,4vw,39px); font-weight:600; margin:0 0 22px;}
.vip-progress{background:#EEEEEE; height:36px; border-radius:2px; overflow:hidden; text-align:left;}
.vip-progress-bar{
  background:var(--green); height:100%; width:93%;
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:0 18px; font-size:13px; font-weight:500; color:#FFFFFF; white-space:nowrap;
}
.js .vip-progress-bar{width:0; transition:width 1.6s cubic-bezier(.16,.8,.3,1);}
.js .vip-progress-bar.cheio{width:93%;}
.vip-progress-bar span:first-child{overflow:hidden; text-overflow:ellipsis;}
.vip-text{font-size:clamp(17px,2.4vw,27px); font-weight:700; line-height:1.5; margin:32px auto 30px; max-width:40ch;}
.vip-btn{
  display:inline-block; max-width:100%;
  background:var(--green); color:#FFFFFF;
  font-size:clamp(14px,2.8vw,40px); font-weight:700; letter-spacing:2px; line-height:1.5;
  padding:15px clamp(22px,3vw,50px); border-radius:clamp(17px,3vw,45px);
  box-shadow:0 0 16px 4px rgba(0,0,0,.92);
  transition:background .2s, transform .15s;
}
.vip-btn:hover{background:#33A631; transform:translateY(-1px);}

/* ---------- hero ---------- */
/* depois da faixa VIP o hero não precisa ocupar a tela inteira */
.vip-band + .hero{min-height:auto;}
.hero{
  background:
    radial-gradient(ellipse 900px 500px at 18% 0%, rgba(163,43,55,0.28), transparent 60%),
    var(--black);
  color:var(--cream);
  position:relative;
  padding:44px 0 56px;
  min-height:calc(100svh - var(--header-h));
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.hero .wrap{
  display:flex;
  flex-direction:column;
  gap:24px;
}
.hero-kicker{
  color:var(--fog); font-weight:500; font-size:15px;
  margin:0; max-width:34ch; order:1;
}
h1.headline{
  font-size:clamp(30px, 8vw, 60px);
  line-height:1.08;
  font-weight:600;
  letter-spacing:-0.015em;
  margin:0; max-width:16ch;
  order:2;
}
.headline em{
  font-style:normal;
  color:var(--red);
}
.hero-sub{
  font-size:15px; line-height:1.55; color:var(--fog);
  max-width:46ch; margin:0; font-weight:400;
  order:3;
}
.hero-sub--full{display:none;}
.hero-sub--short{display:block;}
.hero-figure{
  order:4;
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 24px 50px -20px rgba(0,0,0,0.55);
}
.hero-figure img{ width:100%; height:100%; object-fit:cover; aspect-ratio:16/10;}
.hero-actions{
  order:5;
  display:flex; flex-wrap:wrap; gap:12px;
}
.hero-actions .btn:not(.btn--ghost){background:#FFFFFF; color:var(--black);}
.hero-actions .btn:not(.btn--ghost):hover{background:#EDEDED;}
.hero-actions .btn{flex:1 1 200px;}

@media(min-width:900px){
  .hero{padding:32px 0;}
  .hero .wrap{
    display:grid;
    grid-template-columns: 0.95fr 1.15fr;
    grid-template-rows:auto auto auto;
    column-gap:56px; row-gap:0;
    align-items:center;
    max-width:min(94vw, 1640px);
  }
  .hero-kicker{grid-column:1; grid-row:1; font-size:16px;}
  h1.headline{grid-column:1; grid-row:2; font-size:clamp(44px,5.4vw,72px); margin:20px 0 24px;}
  .hero-sub{grid-column:1; grid-row:3; font-size:20px; line-height:1.6; margin:0 0 34px; max-width:44ch;}
  .hero-sub--full{display:block;}
  .hero-sub--short{display:none;}
  .hero-actions{grid-column:1; grid-row:4;}
  .hero-figure{grid-column:2; grid-row:1 / 5; max-height:70vh;}
  .hero-figure img{aspect-ratio:auto; height:100%;}
  .hero-actions .btn{flex:0 0 auto; padding:14px 24px; font-size:16px;}
}

/* ---------- section shells ---------- */
section{padding:64px 0;}
@media(min-width:760px){ section{padding:80px 0;} }
.section-head{
  max-width:640px;
  margin:0 0 36px;
}
.eyebrow-tag{
  display:inline-block;
  font-size:14px; font-weight:600; color:var(--red);
  margin:0 0 10px;
}
h2.h2{
  font-size:clamp(26px,3.4vw,38px);
  font-weight:700;
  letter-spacing:-0.01em;
  line-height:1.18;
  margin:0 0 14px;
  color:var(--ink);
}
.section-head p{
  font-size:16px; line-height:1.6; color:#2A2A2A; margin:0; font-weight:400;
}
.on-dark h2.h2{color:var(--cream);}
.on-dark .eyebrow-tag{color:#FFFFFF;}
.section-head.on-dark p, .on-dark .section-head p{color:#FFFFFF !important;}

/* ---------- gallery ---------- */
.gallery-band{background:var(--bone);}
.gallery-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap:14px;
}
@media(min-width:700px){
  .gallery-grid{grid-template-columns: repeat(4, 1fr); grid-auto-rows:160px; gap:16px;}
  .gallery-grid a{grid-column:span 2;}
  .gallery-grid a:nth-child(1){grid-column:span 2; grid-row:span 2;}
  /* 4 e 5 empilhadas à esquerda, 6 grande à direita: espelha o bloco de cima e fecha a grade */
  .gallery-grid a:nth-child(4){grid-column:1 / 3; grid-row:3;}
  .gallery-grid a:nth-child(5){grid-column:1 / 3; grid-row:4;}
  .gallery-grid a:nth-child(6){grid-column:3 / 5; grid-row:3 / 5;}
}
.gallery-grid a{
  display:block; overflow:hidden; border-radius:10px;
  background:var(--bone-2);
  position:relative;
}
.gallery-grid a img{
  width:100%; height:auto; object-fit:cover;
  transition:transform .5s ease;
}
@media(min-width:700px){
  .gallery-grid a img{height:100%;}
}
.gallery-grid a:hover img{transform:scale(1.06);}

/* ---------- custom builder ---------- */
.builder-band{
  background:linear-gradient(135deg, var(--red) 0%, var(--red-dark) 100%);
  color:var(--cream);
}
.builder-inner{
  display:grid; grid-template-columns:1fr; gap:28px; align-items:center;
}
@media(min-width:860px){
  .builder-inner{grid-template-columns: 1.1fr 0.9fr; gap:48px;}
}
.builder-inner h2.h2{color:var(--cream); max-width:16ch;}
.builder-inner p{color:rgba(244,239,225,0.88); font-size:16px; line-height:1.6; max-width:46ch; margin:0 0 26px;}
.builder-inner .btn{max-width:100%; width:fit-content; background:#FFFFFF; color:var(--black);}
.builder-inner .btn:hover{background:#EDEDED;}
.builder-figure img{border-radius:12px; box-shadow:0 24px 50px -18px rgba(0,0,0,0.5); width:100%;}

/* ---------- testimonials ---------- */
.testi-band{background:var(--black); color:var(--cream);}
.testi-grid{
  display:grid; grid-template-columns:repeat(1,1fr); gap:20px;
}
@media(min-width:760px){ .testi-grid{grid-template-columns:repeat(3,1fr);} }
.testi-card{
  background:var(--black-2);
  border:1px solid rgba(244,239,225,0.1);
  border-radius:12px;
  padding:14px;
}
.testi-card img{
  border-radius:8px;
  border:1px solid rgba(244,239,225,0.12);
  width:100%; height:auto;
}

/* ---------- community ---------- */
.community-band{background:var(--bone);}
.community-grid{
  display:grid; grid-template-columns:1fr; gap:18px;
}
@media(min-width:760px){ .community-grid{grid-template-columns:1fr 1fr;} }
.comm-card{
  background:var(--cream);
  border:1px solid rgba(26,26,26,0.08);
  border-radius:14px;
  padding:28px;
}
.comm-card h3{font-size:21px; font-weight:700; margin:0 0 10px;}
.comm-card p{font-size:15px; line-height:1.55; color:#2A2A2A; margin:0 0 20px; font-weight:400;}
.comm-icon{
  width:44px; height:44px; border-radius:10px;
  background:var(--black); color:#FFFFFF;
  display:flex; align-items:center; justify-content:center; margin-bottom:16px;
}
.comm-icon svg{width:22px; height:22px;}
.comm-card .btn{background:var(--black); color:#FFFFFF;}
.comm-card .btn:hover{background:var(--black-2);}

/* ---------- FAQ accordion ---------- */
.faq-band{background:var(--black); color:var(--cream);}
.faq-list{max-width:760px;}
.faq-item{ border-bottom:1px dashed rgba(244,239,225,0.22); }
.faq-item:first-child{ border-top:1px dashed rgba(244,239,225,0.22); }
.faq-q{
  width:100%; text-align:left; background:none; border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:20px 4px; color:var(--cream);
  font-family:inherit; font-size:17px; font-weight:600;
}
.faq-q .plus{
  flex-shrink:0; width:24px; height:24px; position:relative;
}
.faq-q .plus::before, .faq-q .plus::after{
  content:""; position:absolute; background:#FFFFFF;
  top:50%; left:50%; transform:translate(-50%,-50%);
}
.faq-q .plus::before{width:15px; height:2px;}
.faq-q .plus::after{width:2px; height:15px; transition:opacity .2s, transform .25s;}
.faq-item.open .faq-q .plus::after{transform:translate(-50%,-50%) rotate(90deg); opacity:0;}
.js .faq-a{
  max-height:0; overflow:hidden; transition:max-height .3s ease;
}
.faq-a p{
  padding:0 4px 20px; margin:0; font-size:15px; line-height:1.6; color:var(--fog); font-weight:400; max-width:60ch;
}

/* ---------- final CTA ---------- */
.cta-band{
  background:var(--red);
  color:var(--cream);
  text-align:center;
  padding:56px 0;
}
.cta-band h2{
  font-size:clamp(24px,3.6vw,36px); font-weight:700; margin:0 0 14px; letter-spacing:-0.01em;
}
.cta-band p{font-size:16px; margin:0 0 26px; color:rgba(255,255,255,0.85);}
.cta-band .btn{background:#FFFFFF; color:var(--black); width:fit-content; max-width:100%; margin:0 auto;}
.cta-band .btn:hover{background:#EDEDED;}

/* ---------- footer ---------- */
footer{background:var(--black-2); color:var(--fog); padding:36px 0 28px;}
.footer-inner{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;
  gap:20px; padding-bottom:22px;
}
.footer-brand{display:flex; align-items:center; gap:12px;}
.footer-brand img{height:38px; width:38px; border-radius:50%; object-fit:cover; border:2px solid var(--gold);}
.footer-brand div span{display:block;}
.footer-brand .name{color:var(--cream); font-weight:700; font-size:15px;}
.footer-brand .tag{font-size:13px; color:var(--fog);}
.footer-social{display:flex; gap:12px;}
.footer-social a{
  width:38px; height:38px; border-radius:8px; border:1px solid rgba(244,239,225,0.18);
  display:flex; align-items:center; justify-content:center; transition:border-color .2s, background .2s;
}
.footer-social a:hover{border-color:var(--cream); background:rgba(244,239,225,0.06);}
.footer-social svg{width:18px; height:18px; color:var(--cream);}
.footer-bottom{font-size:13px; color:rgba(168,168,168,0.7); margin-top:20px;}