/* =====================
   RESET
===================== */
*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

/* =====================
   TOKENS
===================== */
:root{
  --primary:#2f6bff;
  --primary-2:#2556cc;

  --danger:#dc2626;

  --whatsapp:#23b458;
  --whatsapp-hover:#219951;

  --bg:#f4f6fb;
  --surface:#ffffff;
  --surface-soft:#f8f9fc;

  --text:#0f172a;
  --muted:#475569;
  --muted-2:#64748b;

  --border:#e2e8f0;

  --shadow-sm:0 6px 16px rgba(15,23,42,.06);
  --shadow:0 14px 40px rgba(15,23,42,.08);
}

/* =====================
   BASE
===================== */
html{ scroll-behavior:smooth; }

body{
  font-family: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",
  Roboto,Oxygen,Ubuntu,Cantarell,"Open Sans","Helvetica Neue",sans-serif;

  background: linear-gradient(180deg,#f6f7fb 0%, #eef2f9 100%);
  color:var(--text);
  font-size:16px;
  line-height:1.5;

  min-height:100vh;
  display:flex;
  flex-direction:column;
}

main{ flex:1; }

a{
  text-decoration:none;
  color:inherit;
}

.container{
  max-width:1100px;
  margin:0 auto;
  padding:0 18px;
}

/* =====================
   TOPBAR
===================== */
.topbar{
  position:sticky;
  top:0;
  z-index:50;

  background:rgba(255,255,255,.85);
  backdrop-filter:blur(12px);

  border-bottom:1px solid var(--border);
}

.topbar-inner{
  min-height:72px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}

.brand{
  display:flex;
  align-items:center;
}

.brand-logo{
  height:40px;
  width:auto;
  display:block;
}

/* =====================
   MENU
===================== */
.menu{
  display:flex;
  align-items:center;
  gap:8px;
}

.menu-link{
  padding:9px 14px;
  border-radius:999px;
  font-weight:700;
  font-size:14px;
  color:var(--muted);
  transition:.18s ease;
}

.menu-link:hover{
  background:rgba(47,107,255,.08);
  color:var(--primary);
}

/* =====================
   BUTTONS
===================== */
.topbar-actions{
  display:flex;
  align-items:center;
  gap:12px;
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;

  padding:10px 18px;
  border-radius:999px;

  font-size:14px;
  font-weight:700;

  cursor:pointer;
  transition:.18s ease;
}

.w-100{ width:100%; }

.btn-ghost{
  border:1px solid rgba(47,107,255,.35);
  background:#fff;
  color:var(--primary);
}

.btn-ghost:hover{
  background:rgba(47,107,255,.08);
  transform:translateY(-2px);
}

.btn-primary{
  background:linear-gradient(135deg,#2f6bff,#3b7cff);
  color:#fff;
  border:none;
  box-shadow:0 10px 24px rgba(47,107,255,.35);
}

.btn-primary:hover{
  transform:translateY(-3px);
  box-shadow:0 16px 34px rgba(47,107,255,.45);
}

a.btn-whatsapp{
  background:var(--whatsapp);
  color:#fff;
}

a.btn-whatsapp:hover{
  background:var(--whatsapp-hover);
}

/* =====================
   CARDS BASE
===================== */
.card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:18px;
  box-shadow:var(--shadow-sm);
}

/* =====================
   FORM FIELDS
===================== */
.field label{
  display:block;
  font-size:13px;
  font-weight:700;
  margin-bottom:6px;
  color:var(--muted);
}

.field input,
.field select,
.field textarea{
  width:100%;
  padding:12px;
  border-radius:12px;
  border:1px solid var(--border);
  background:#fff;
  outline:none;
}

.field input:focus,
.field select:focus,
.field textarea:focus{
  border-color:var(--primary);
  box-shadow:0 0 0 3px rgba(47,107,255,.12);
}

.hint{
  display:block;
  margin-top:6px;
  font-size:12px;
  color:var(--muted-2);
}

/* =====================
   FOOTER
===================== */
.footer{
  border-top:1px solid var(--border);
  padding:18px 0;
  text-align:center;
  font-size:13px;
  color:var(--muted-2);
  background:#fff;
}

/* =====================
   MODAL
===================== */
.modal{
  position:fixed;
  inset:0;
  display:none;
  z-index:9999;
}

.modal.is-open{
  display:grid;
  place-items:center;
}

.modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.55);
}

.modal-card{
  position:relative;
  z-index:1;
  width:min(520px,calc(100% - 24px));
  border-radius:16px;
  padding:18px;
  background:#fff;
  box-shadow:0 20px 60px rgba(0,0,0,.25);
}
/* =====================
   LINKS “CLICÁVEIS” (Termos/Privacidade etc)
===================== */

/* Footer: sempre parecer link */
.footer a{
  color: var(--primary);
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.footer a:hover{
  opacity: .9;
}

/* Avisos (ex: 18+ e notas) – deixa o link com cara de link */
.hero-note a,
.pub-note a,
.modal-card a{
  color: var(--primary);
  font-weight: 850;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.hero-note a:hover,
.pub-note a:hover,
.modal-card a:hover{
  opacity: .9;
}

/* Ajuda a não quebrar layout se URL for grande */
a{
  overflow-wrap: anywhere;
}
/* =====================
   RESPONSIVE
===================== */
@media(max-width:860px){
  .menu{ display:none; }
}