/* Finisdom Landing Styles */
:root{
  --navy:#0B1C2C; /* deep navy */
  --gold:#D4AF37; /* classic gold */
}
html{ scroll-behavior: smooth; }

/* Tailwind base extensions via CSS variables */
body.bg-navy{ background: var(--navy); }
.text-gold{ color: var(--gold); }
.bg-gold{ background-color: var(--gold); }
.border-gold{ border-color: var(--gold); }

/* Custom gold shades for non-Tailwind utilities used in HTML */
.bg-gold-80{ background-color: rgba(212,175,55,.8); }
.bg-gold-70{ background-color: rgba(212,175,55,.7); }
.bg-gold-60{ background-color: rgba(212,175,55,.6); }
.bg-gold-50{ background-color: rgba(212,175,55,.5); }
.gold-gradient{ background: linear-gradient(90deg, rgba(212,175,55,.3), rgba(212,175,55,.1), transparent); }

/* Helpers */
.section{ padding: 80px 0; }
.section.alt{ background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0)); }
.section-title{ font-size: clamp(1.75rem, 2.5vw, 2.5rem); font-weight: 800; }

.btn-gold{ display:inline-flex; align-items:center; justify-content:center; padding:.8rem 1.2rem; border-radius:.6rem; background:var(--gold); color:#0B1C2C; font-weight:700; transition:transform .2s, box-shadow .2s; }
.btn-gold:hover{ transform: translateY(-1px); box-shadow:0 10px 25px rgba(212,175,55,.25); }
.btn-outline{ display:inline-flex; align-items:center; justify-content:center; padding:.8rem 1.2rem; border-radius:.6rem; border:1px solid rgba(255,255,255,.2); color:#E5EAF1; font-weight:600; transition:all .2s; }
.btn-outline:hover{ border-color: var(--gold); color: var(--gold); }

.nav-link{ color:#CBD5E1; transition:color .2s; }
.nav-link:hover{ color: var(--gold); }

.hero-bg{ background: radial-gradient(1200px 600px at 80% 0%, rgba(212,175,55,.08), transparent), radial-gradient(700px 500px at 0% 30%, rgba(212,175,55,.06), transparent); }
.bg-grid{ background-image: linear-gradient(rgba(255,255,255,.07) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.07) 1px, transparent 1px); background-size: 40px 40px; }

.glass-card{ background: rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.12); border-radius: 14px; box-shadow: 0 10px 30px rgba(0,0,0,.25); }

.feature{ display:flex; gap:.9rem; padding:1rem; border:1px solid rgba(255,255,255,.08); border-radius:12px; background:rgba(255,255,255,.03); transition:transform .2s, border-color .2s, background .2s; }
.feature i{ color:var(--gold); font-size:1.25rem; margin-top:.2rem; }
.feature:hover{ transform: translateY(-2px); border-color: rgba(212,175,55,.6); background: rgba(212,175,55,.06); }

.badge{ display:inline-flex; align-items:center; gap:.5rem; padding:.6rem .8rem; border:1px solid rgba(255,255,255,.16); border-radius:999px; background:rgba(255,255,255,.03); color:#E5EAF1; font-weight:600; }
.badge i{ color:var(--gold); }

/* Reveal on scroll */
.reveal{ opacity:0; transform: translateY(18px); transition: opacity .7s ease, transform .7s ease; }
.reveal.visible{ opacity:1; transform:none; }
.delay-200{ transition-delay:.15s; }

/* World map styling */
.world-map svg{ filter: drop-shadow(0 4px 24px rgba(212,175,55,.15)); background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0)); border-radius: 12px; border:1px solid rgba(255,255,255,0.08); }

/* Footer */
footer{ background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0)); }

/* Responsive tweaks */
@media (max-width: 640px){
  .section{ padding: 64px 0; }
}