:root{
  --cream:#FAF5EA;
  --cream-2:#F2EADA;
  --ink:#132038;
  --ink-2:#1C2C4A;
  --gold:#C9973E;
  --gold-light:#E7C878;
  --gold-deep:#9C7327;
  --line:rgba(19,32,56,0.12);
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:'Inter',sans-serif;
  background:var(--cream);
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
}

/* =========================================================
   SECTION 1 — HERO / CLUBE VIP (convite principal)
   ========================================================= */
.session-1 .wrap{
  display:grid;
  grid-template-columns:1fr 1fr;
  min-height:100vh;
  background:var(--cream);
}

.visual{
  position:relative;
  background:
    radial-gradient(120% 90% at 20% 0%, #24365c 0%, transparent 55%),
    linear-gradient(160deg, var(--ink-2) 0%, #0D1727 100%);
  overflow:hidden;
  padding:44px 40px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
.visual::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    radial-gradient(1px 1px at 15% 22%, rgba(231,200,120,0.5) 0, transparent 60%),
    radial-gradient(1px 1px at 78% 12%, rgba(231,200,120,0.4) 0, transparent 60%),
    radial-gradient(1.5px 1.5px at 60% 38%, rgba(231,200,120,0.35) 0, transparent 60%),
    radial-gradient(1px 1px at 30% 55%, rgba(231,200,120,0.4) 0, transparent 60%),
    radial-gradient(1px 1px at 88% 60%, rgba(231,200,120,0.3) 0, transparent 60%),
    radial-gradient(1.5px 1.5px at 45% 78%, rgba(231,200,120,0.4) 0, transparent 60%);
  pointer-events:none;
}

.brand-mark{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  gap:12px;
  color:var(--cream);
}
.brand-mark img{
  width:54px;
  height:54px;
  border-radius:12px;
  flex-shrink:0;
  box-shadow:0 6px 14px rgba(0,0,0,0.3);
}
.brand-mark .name{
  font-family:'Fraunces',serif;
  font-size:22px;
  letter-spacing:0.5px;
}
.brand-mark .name span{
  display:block;
  font-family:'Inter',sans-serif;
  font-size:9.5px;
  letter-spacing:3.5px;
  color:var(--gold-light);
  font-weight:600;
  margin-top:1px;
}

.compass-stage{
  position:relative;
  z-index:2;
  flex:1;
  min-height:530px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:30px 0;
}
.compass{ width:180px; height:180px; opacity:0.9; }
.compass .spin{ transform-origin:90px 90px; animation:spin 40s linear infinite; }
@keyframes spin{ to{ transform:rotate(360deg);} }

.postcards{ position:absolute; inset:0; z-index:2; }
.postcard{
  position:absolute;
  width:132px;
  background:#FFFDF8;
  padding:8px 8px 14px;
  border-radius:3px;
  box-shadow:0 18px 34px rgba(0,0,0,0.35);
}
.postcard .art{ width:100%; aspect-ratio:1/1; border-radius:2px; overflow:hidden; }
.postcard .art img{ width:100%; height:100%; object-fit:cover; display:block; }
.postcard .cap{ display:block; text-align:center; font-family:'Fraunces',serif; font-style:italic; font-size:11px; letter-spacing:0.5px; text-transform:uppercase; color:var(--ink); margin-top:7px; }
.pc-norte{ top:50%; left:50%; transform:translate(-50%, calc(-50% - 172px)) rotate(6deg); }
.pc-sul{ top:50%; left:50%; transform:translate(-50%, calc(-50% + 172px)) rotate(5deg); }
.pc-leste{ top:50%; left:50%; transform:translate(calc(-50% + 175px), -50%) rotate(8deg); }
.pc-oeste{ top:50%; left:50%; transform:translate(calc(-50% - 175px), -50%) rotate(-7deg); }

.visual-foot{ position:absolute; z-index:2; left:0; top:50%; transform:translateY(calc(-50% + 170px)); max-width:190px; color:var(--cream); }
.visual-foot .quote{ font-family:'Fraunces',serif; font-style:italic; font-weight:500; font-size:15px; line-height:1.45; color:#F2E7CE; }
.visual-foot .who{ margin-top:8px; font-size:10.5px; letter-spacing:1.5px; text-transform:uppercase; color:var(--gold-light); font-weight:600; }

.content{
  position:relative;
  padding:44px 56px 44px;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
}
.content::before{
  content:"";
  position:absolute;
  left:0; top:36px; bottom:36px;
  width:1px;
  background-image:linear-gradient(var(--line) 60%, transparent 0%);
  background-size:1px 10px;
  background-repeat:repeat-y;
}

.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-size:11.5px; letter-spacing:2.6px; font-weight:700; text-transform:uppercase;
  color:var(--gold-deep); margin-bottom:22px;
}
.eyebrow::before{ content:""; width:26px; height:1px; background:var(--gold-deep); }

h1,h2,h3{ }
h1{
  font-family:'Fraunces',serif; font-weight:600; font-size:44px; line-height:1.18; letter-spacing:-0.5px; color:var(--ink);
}
h1 em{
  font-style:italic; font-weight:600;
  color:var(--gold-deep);
}

.lede{ margin-top:20px; font-size:16px; line-height:1.65; color:#3D4A63; padding-right:40px; }

.divider{ margin:32px 0 30px; height:1px; background:linear-gradient(90deg, var(--line), transparent); }

.benefits{ display:grid; grid-template-columns:1fr 1fr; gap:20px 28px; }
.benefit{ display:flex; align-items:flex-start; gap:12px; }
.benefit .icon{
  width:36px; height:36px; flex-shrink:0; border-radius:50%;
  background:linear-gradient(145deg, var(--gold-light), var(--gold-deep));
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 10px rgba(156,115,39,0.28);
}
.benefit .icon svg{ width:17px; height:17px; }
.benefit .txt{ font-size:14px; line-height:1.4; font-weight:600; color:var(--ink); padding-top:6px; }

.community-line{ margin-top:32px; font-size:14.5px; color:#3D4A63; }
.community-line a{ color:var(--gold-deep); font-weight:700; text-decoration:none; border-bottom:1px solid var(--gold-deep); }

.cta{
  margin-top:18px; display:flex; align-items:center; justify-content:center; gap:12px;
  width:100%; padding:17px 20px; border:none; border-radius:9px;
  background:linear-gradient(135deg, #2FD675, #189951);
  color:#FFFFFF; font-family:'Inter',sans-serif; font-weight:800; font-size:15px; letter-spacing:0.3px;
  cursor:pointer;
  transition:transform .18s ease;
}
.cta:hover{ transform:translateY(-2px); }
.cta:active{ transform:translateY(0px); }
.cta svg{ width:26px; height:26px; flex-shrink:0; }

.fineprint{ margin-top:16px; display:flex; align-items:center; gap:7px; font-size:11.5px; color:#7C8598; }
.fineprint svg{ width:12px; height:12px; flex-shrink:0; }

/* =========================================================
   SECTION 2 — INFORMAÇÕES COMPLEMENTARES
   ========================================================= */
.session-2{
  background:var(--ink-2);
  color:var(--cream);
  position:relative;
  overflow:hidden;
}
.s2-inner{
  max-width:1180px;
  margin:0 auto;
  padding:90px 56px 90px;
  position:relative;
  z-index:2;
}
.s2-head{ text-align:center; max-width:640px; margin:0 auto 64px; }
.s2-eyebrow{
  font-size:11.5px; letter-spacing:2.6px; font-weight:700; text-transform:uppercase; color:var(--gold-light);
  display:flex; align-items:center; justify-content:center; gap:10px; margin-bottom:16px;
}
.s2-eyebrow::before, .s2-eyebrow::after{ content:""; width:26px; height:1px; background:var(--gold-light); }
.s2-head h2{
  font-family:'Fraunces',serif; font-weight:600; font-size:34px; line-height:1.2; color:var(--cream);
}
.info-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:24px;
  margin-bottom:70px;
}
.info-card{
  background:rgba(250,245,234,0.04);
  border:1px solid rgba(231,200,120,0.18);
  border-radius:12px;
  padding:28px 24px;
}
.info-card h3{ font-family:'Fraunces',serif; font-weight:600; font-size:19px; margin-bottom:10px; color:var(--gold-light); }
.info-card p{ font-size:13.5px; line-height:1.6; color:#AFB9CE; }
.info-list{ list-style:none; margin-top:14px; display:flex; flex-direction:column; gap:8px; }
.info-list li{ font-size:13.5px; line-height:1.5; color:#E3E7F0; font-weight:600; }

/* FAQ — sessão clara própria, quebrando o azul contínuo */
.session-faq{
  background:var(--cream);
}
.faq-inner{
  max-width:1180px;
  margin:0 auto;
  padding:80px 56px;
}
.faq-label{
  margin-bottom:18px;
  font-size:11.5px; letter-spacing:2.2px; font-weight:700; text-transform:uppercase; color:var(--gold-deep);
}
.faq-item{ border-bottom:1px solid var(--line); }
.faq-item summary{
  list-style:none; cursor:pointer;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:20px 4px; font-family:'Fraunces',serif; font-size:17px; font-weight:600; color:var(--ink);
}
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary .plus{ color:var(--gold-deep); display:inline-flex; transition:transform .25s ease; flex-shrink:0; }
.faq-item summary .plus svg{ width:18px; height:18px; }
.faq-item[open] summary .plus{ transform:rotate(180deg); }
.faq-item p{ padding:0 48px 20px 4px; font-size:14px; line-height:1.65; color:#3D4A63; }

/* CTA final — sessão escura, fecha o ritmo escuro / claro / escuro */
.session-2-cta{
  background:var(--ink-2);
}
.cta-inner{
  max-width:1180px;
  margin:0 auto;
  padding:80px 56px 100px;
}

.testimonials{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:24px;
}
.testimonial{
  background:rgba(250,245,234,0.04);
  border:1px solid rgba(231,200,120,0.18);
  border-radius:12px;
  padding:26px;
}
.testimonial .stars{ color:var(--gold-light); font-size:13px; letter-spacing:2px; margin-bottom:10px; }
.testimonial p.quote{ font-family:'Fraunces',serif; font-style:italic; font-size:15px; line-height:1.55; color:#E3E7F0; }
.testimonial .who{ margin-top:14px; font-size:12.5px; line-height:1.7; color:#9AA5BC; }
.testimonial .who b{ display:block; margin-bottom:2px; font-size:13.5px; color:var(--gold-light); }
.testimonial .who .label{ color:var(--gold-light); font-weight:700; }

/* final CTA band */
.s2-cta-band{
  text-align:center;
  padding-top:10px;
}
.s2-cta-band h3{ font-family:'Fraunces',serif; font-weight:600; font-size:26px; color:var(--cream); margin-bottom:10px; }
.s2-cta-band p{ font-size:14px; color:#AFB9CE; margin-bottom:28px; }
.cta-secondary{
  display:inline-flex; align-items:center; gap:12px;
  padding:16px 34px; border:none; border-radius:9px;
  background:linear-gradient(135deg, #2FD675, #189951);
  color:#FFFFFF; font-family:'Inter',sans-serif; font-weight:800; font-size:15px;
  cursor:pointer; box-shadow:0 14px 26px rgba(24,153,81,0.35);
  transition:transform .18s ease;
}
.cta-secondary:hover{ transform:translateY(-2px); }
.cta-secondary svg{ width:26px; height:26px; flex-shrink:0; }

.site-footer{
  background:var(--ink-2);
  border-top:1px solid rgba(231,200,120,0.15);
  text-align:center;
  padding:22px 24px;
}
.site-footer p{ font-size:11.5px; line-height:1.7; color:#7C88A3; }

/* ---------------- responsive ---------------- */
@media (max-width:880px){
  .session-1 .wrap{ grid-template-columns:1fr; min-height:auto; }
  .visual{ min-height:660px; padding:32px 24px; justify-content:flex-start; }
  .content{ padding:40px 26px 56px; }
  .content::before{ display:none; }
  h1{ font-size:34px; }
  .postcard{ width:82px; }
  .compass{ width:110px; height:110px; }
  .compass-stage{ min-height:460px; flex:none; }
  .visual-foot{
    position:absolute;
    left:0;
    right:0;
    top:100%;
    margin-top:18px;
    text-align:center;
    max-width:none;
    transform:none;
  }
  .pc-norte{ top:50%; left:50%; transform:translate(-50%, calc(-50% - 135px)) rotate(-6deg); }
  .pc-sul{ top:50%; left:50%; transform:translate(-50%, calc(-50% + 135px)) rotate(5deg); }
  .pc-leste{ top:50%; left:50%; transform:translate(calc(-50% + 116px), -50%) rotate(8deg); }
  .pc-oeste{ top:50%; left:50%; transform:translate(calc(-50% - 116px), -50%) rotate(-7deg); }

  .benefits{ gap:12px; }
  .benefit{
    background:var(--cream-2);
    border:1px solid var(--line);
    border-radius:12px;
    padding:14px 16px;
  }

  .s2-inner{ padding:64px 26px 64px; }
  .s2-head h2{ font-size:27px; }
  .info-grid{ grid-template-columns:1fr; }
  .testimonials{ grid-template-columns:1fr; }
  .faq-inner{ padding:56px 26px; }
  .cta-inner{ padding:56px 26px 70px; }
}
@media (max-width:460px){
  .benefits{ grid-template-columns:1fr; }
  h1{ font-size:29px; }
}

/* ---------------- acessibilidade ---------------- */
a:focus-visible,
button:focus-visible,
summary:focus-visible{
  outline:2px solid var(--gold-deep);
  outline-offset:3px;
}

@media (prefers-reduced-motion: reduce){
  .compass .spin{ animation-play-state:paused; }
}
