/* Base styles (Tempus palette) */
:root{
  --dark:#141e30;
  --tan:#dacec2;
  --muted:#4a6889;
  --muted-50:#7d8eaf;
  --ink:#233040;
}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Inter,Helvetica,Arial,sans-serif;background:#0d141f;color:#e6e9ee;}
a{color:#cfe4ff;text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:1024px;margin:0 auto;padding:18px}

.site-header{background:#0f1724;border-bottom:1px solid rgba(255,255,255,.06);position:sticky;top:0;z-index:10}
.site-header .brand{margin:0;font-weight:800;color:#fff}
.site-header nav{display:flex;gap:14px;align-items:center}
.site-header .btn{margin-left:8px}

.hero{padding:56px 0;background:linear-gradient(180deg, rgba(20,30,48,0.95), rgba(20,30,48,0.6));}
.hero h2{font-size:32px;margin:0 0 10px}
.hero p{max-width:720px;line-height:1.5}
.cta-row{display:flex;gap:12px;margin-top:16px}
.btn{display:inline-block;background:#334e6f;color:#fff;padding:10px 14px;border-radius:10px}
.btn-accent{background:#4a6889}
.btn:hover{filter:brightness(1.08)}

.learn{padding:32px 0;background:#0f1724;border-top:1px solid rgba(255,255,255,.06)}
.learn h3{margin-top:0}
.learn ul{line-height:1.7}

.site-footer{padding:24px 0;border-top:1px solid rgba(255,255,255,.06);background:#0f1724}

/* Tools */
.tools-hero{padding:26px 0 6px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin:18px 0 40px}
.card{display:block;background:#101a2a;border:1px solid rgba(255,255,255,.06);padding:16px;border-radius:14px}
.card h3{margin:0 0 6px;color:#fff}
.card p{margin:0 0 10px;color:#c9d2dc}
.card:hover{outline:1px solid rgba(207,228,255,.25)}
.card-bonus{background:linear-gradient(180deg, rgba(74,104,137,.33), rgba(35,48,64,.8));border-color:rgba(207,228,255,.25)}
.chip{display:inline-block;padding:4px 8px;border-radius:999px;background:#1e2a3b;color:#cfe4ff;font-size:12px}
.chip-accent{background:#4a6889;color:#fff}
.chip-gated{background:#233040;color:#cfe4ff;}

/* Modal */
.modal.hidden { display: none; }
.modal { position: fixed; inset: 0; z-index: 1000; }
.modal__backdrop { position:absolute; inset:0; background: rgba(0,0,0,.55); }
.modal__card {
  position: relative;
  max-width: 560px;
  margin: 8vh auto;
  background: var(--dark);
  color: var(--tan);
  border-radius: 16px;
  padding: 24px 22px 18px;
  box-shadow: 0 10px 40px rgba(0,0,0,.4);
}
.modal__close {
  position:absolute; top: 8px; right: 12px;
  background: transparent; border: 0; color: var(--tan);
  font-size: 28px; line-height: 1; cursor: pointer;
}
#bonusTitle { margin: 0 0 6px; font-size: 22px; }
.modal__sub { margin: 0 0 16px; color: var(--muted-50); }
.modal__note { display:block; margin-top: 10px; color: #AAB8C2; font-size: 12px; }
.modal .formkit-form { box-shadow: none !important; margin-top: 8px; }
.modal .formkit-column:nth-child(1) { border-radius: 8px; }