/* Marcelo Leal — estilo compartilhado (hub + isca) */
:root{
  --noite:#0B1424;      /* fundo principal */
  --noite-2:#0E1A2E;
  --azul:#16243C;       /* cartões */
  --azul-borda:#24365A;
  --ouro:#D9B26A;
  --ouro-claro:#F2CF7A;
  --ouro-escuro:#C8922F;
  --creme:#F3E9D6;
  --branco:#FFFFFF;
  --texto:#E6EAF2;
  --texto-suave:#A9B4C7;
  --serif:"Playfair Display", Georgia, serif;
  --sans:"Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;
  --raio:14px;
  --larg:1160px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{background:var(--noite);color:var(--texto);font-family:var(--sans);font-size:17px;line-height:1.65;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
[hidden]{display:none!important}
[id]{scroll-margin-top:84px}
a{color:inherit}
.wrap{max-width:var(--larg);margin:0 auto;padding:0 24px}
@media (max-width:600px){.wrap{padding:0 16px}body{font-size:16px}}

/* ---------- topo ---------- */
.topo{position:sticky;top:0;z-index:50;background:rgba(11,20,36,.86);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid rgba(217,178,106,.14)}
.topo .wrap{display:flex;align-items:center;justify-content:space-between;height:68px;gap:16px}
.marca{font-family:var(--sans);font-weight:700;letter-spacing:.28em;font-size:14px;text-decoration:none;color:var(--branco);white-space:nowrap}
.marca span{color:var(--ouro)}
.menu{display:flex;gap:28px;align-items:center}
.menu a{text-decoration:none;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--texto-suave);transition:color .2s}
.menu a:hover{color:var(--ouro-claro)}
.menu a.btn-ouro,.menu a.btn-ouro:hover{color:#1A1206}
.menu a.btn-linha{color:var(--ouro-claro)}
@media (max-width:820px){.menu a:not(.btn){display:none}}
.menu .btn{white-space:nowrap}
@media (max-width:420px){.marca{font-size:12px;letter-spacing:.2em}.menu .btn-pq{padding:9px 14px;font-size:11px}}

/* ---------- botões ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--sans);font-weight:700;font-size:14px;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;border-radius:999px;padding:15px 28px;border:1px solid transparent;cursor:pointer;transition:transform .2s cubic-bezier(.2,.8,.2,1),box-shadow .2s,background .2s,color .2s}
.btn-ouro{background:linear-gradient(180deg,var(--ouro-claro),var(--ouro-escuro));color:#1A1206;box-shadow:0 8px 28px -10px rgba(242,207,122,.55)}
.btn-ouro:hover{transform:translateY(-2px);box-shadow:0 14px 34px -10px rgba(242,207,122,.7)}
.btn-linha{border-color:rgba(217,178,106,.55);color:var(--ouro-claro);background:transparent}
.btn-linha:hover{background:rgba(217,178,106,.1)}
.btn-pq{padding:10px 18px;font-size:12px}
.btn[aria-disabled="true"]{background:transparent;border-color:var(--azul-borda);color:var(--texto-suave);box-shadow:none;cursor:default;pointer-events:none}

/* ---------- tipografia ---------- */
.rotulo{font-size:12px;font-weight:700;letter-spacing:.28em;text-transform:uppercase;color:var(--ouro)}
h1,h2,h3{font-family:var(--serif);font-weight:700;color:var(--branco);line-height:1.12;letter-spacing:-.01em}
h1{font-size:clamp(36px,5.6vw,64px)}
h2{font-size:clamp(30px,4vw,46px)}
h3{font-size:24px}
em.ouro,.ouro{color:var(--ouro-claro);font-style:italic}
.fio{width:64px;height:2px;background:linear-gradient(90deg,var(--ouro),transparent);margin:22px 0}
.centro{text-align:center}
.centro .fio{margin:22px auto;background:linear-gradient(90deg,transparent,var(--ouro),transparent)}
.suave{color:var(--texto-suave)}
section{padding:96px 0}
@media (max-width:600px){section{padding:68px 0}}

/* ---------- fundo com luz ---------- */
.luz{position:relative;isolation:isolate}
.luz::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(ellipse 55% 45% at 78% 30%,rgba(217,178,106,.16),transparent 70%),
             radial-gradient(ellipse 50% 60% at 10% 90%,rgba(36,54,90,.55),transparent 70%)}

/* ---------- rodapé ---------- */
.rodape{border-top:1px solid rgba(217,178,106,.14);padding:48px 0 40px;font-size:14px;color:var(--texto-suave)}
.rodape .wrap{display:flex;flex-wrap:wrap;gap:24px;justify-content:space-between;align-items:center}
.rodape nav{display:flex;gap:22px;flex-wrap:wrap}
.rodape a{text-decoration:none}
.rodape a:hover{color:var(--ouro-claro)}
.miudo{font-size:12.5px;color:#7F8BA1;line-height:1.6}

/* ---------- animação de entrada ---------- */
.surge{opacity:0;transform:translateY(22px);transition:opacity .8s cubic-bezier(.2,.8,.2,1),transform .8s cubic-bezier(.2,.8,.2,1)}
.surge.visivel{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.surge{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}
:focus-visible{outline:2px solid var(--ouro-claro);outline-offset:3px;border-radius:6px}
