/* ====== Wilson Global — centralized CSS ====== */
:root{
  --blue-900:#0a2a4a;
  --blue-800:#0f3a66;
  --blue-700:#124a86;
  --blue-600:#1a63b8;
  --blue-100:#e9f1fb;
  --ink:#0b1a2a;
  --muted:#5f6b7a;
  --bg:#ffffff;
  --card:#ffffff;
  --ring: rgba(26,99,184,.3);
  --shadow: 0 8px 24px rgba(14, 44, 78, .08);
  --radius: 16px;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font: 16px/1.6 system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji","Segoe UI Emoji";
  color:var(--ink);
  background:linear-gradient(180deg, #f7fbff 0%, #ffffff 60%);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;display:block}
a{color:var(--blue-700)}

/* Layout */
.container{width:min(1120px, 92vw); margin-inline:auto}
.content{padding: min(6vh, 48px) 0 72px}
.visually-hidden{position:absolute!important; width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;padding:0;margin:-1px}

/* Skip link */
.skip-link{position:absolute; left:-9999px; top:auto}
.skip-link:focus{left:12px; top:12px; z-index:1000; background:#fff; padding:8px 12px; border-radius:8px; box-shadow:var(--shadow)}

/* Header / Nav */
.site-header{
  position:sticky; top:0; z-index:50;
  background:rgba(255,255,255,.9);
  backdrop-filter:saturate(150%) blur(8px);
  border-bottom:1px solid #e9eef6;
}
.nav-bar{display:flex; align-items:center; justify-content:space-between; padding:14px 0}
.brand{display:flex; align-items:center; gap:12px; text-decoration:none}
.brand-mark{width:36px; height:auto; filter: drop-shadow(0 2px 6px rgba(0,0,0,.08))}
.brand-name{font-weight:700; font-size:1.05rem; color:var(--blue-900); letter-spacing:.2px}

.nav ul{display:flex; gap:6px; list-style:none; margin:0; padding:0}
.nav a{
  display:inline-block;
  padding:10px 14px;
  border-radius:12px;
  text-decoration:none;
  color:var(--ink);
  transition: background .2s ease, color .2s ease, box-shadow .2s ease;
}
.nav a:hover{background:var(--blue-100)}
.nav a[aria-current="page"]{
  background:var(--blue-700);
  color:white;
  box-shadow: 0 6px 16px rgba(26,99,184,.25);
}

/* Mobile nav */
.nav-toggle{display:none; background:transparent; border:0; padding:8px; margin-left:auto; cursor:pointer}
.nav-toggle .bar{display:block; width:22px; height:2px; background:var(--ink); margin:4px 0; border-radius:1px}
@media (max-width: 760px){
  .nav{position:absolute; top:64px; left:0; right:0; background:#fff; border-bottom:1px solid #e9eef6; display:none}
  .nav.open{display:block}
  .nav ul{flex-direction:column; padding:8px}
  .nav a{padding:12px 14px; border-radius:10px}
  .nav-toggle{display:block}
}

/* Buttons */
.btn{
  display:inline-block;
  padding:10px 16px;
  border-radius:12px;
  font-weight:600;
  text-decoration:none;
  border:1px solid transparent;
  transition: transform .05s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
  box-shadow: var(--shadow);
}
.btn:active{transform:translateY(1px)}
.btn-primary{color:#fff; background:var(--blue-700); border-color:var(--blue-700)}
.btn-primary:hover{background:var(--blue-800)}
.btn-ghost{color:var(--blue-700); background:#fff; border-color:#e1e9f5}
.btn-ghost:hover{background:#f7fbff}

/* Hero (Home) */
.hero{display:grid; place-items:center; text-align:center; padding: min(10vh, 96px) 0}
.hero-logo{width:min(320px, 70vw); margin-bottom:18px; animation:fadeUp .6s ease both}
.hero-title{font-size: clamp(1.75rem, 1.2rem + 2vw, 2.5rem); line-height:1.15; margin: 0 0 8px; color:var(--blue-900)}
.hero-sub{max-width:780px; color:var(--muted); margin:0 auto 16px}
.hero-actions{display:flex; gap:12px; flex-wrap:wrap; justify-content:center; margin-top:6px}

/* Placeholder (coming soon) */
.placeholder{
  text-align:center;
  background: linear-gradient(180deg, #f7fbff, #ffffff);
  border:1px dashed #cdd9ea;
  border-radius: var(--radius);
  padding:32px;
  box-shadow: 0 4px 14px rgba(14,44,78,.06);
}
.placeholder-title{margin:4px 0 8px; color:var(--blue-900)}
.placeholder-sub{margin:0; color:var(--muted)}

/* Contact — minimalist email CTA */
.contact-cta{
  display:grid; place-items:center; text-align:center;
  padding: 36px 0 8px;
}
.cta-lead{margin:0 0 10px; color:var(--muted); font-weight:600; letter-spacing:.3px; text-transform:uppercase}
.email-pill{
  display:inline-block;
  padding:14px 20px;
  border-radius:999px;
  background:#fff;
  border:1px solid #e1e9f5;
  box-shadow: var(--shadow);
  text-decoration:none;
  font-weight:700;
  color:var(--blue-700);
  transition: transform .05s ease, background .2s ease, box-shadow .2s ease;
}
.email-pill:hover{background:#f7fbff; box-shadow: 0 10px 28px rgba(26,99,184,.15)}
.email-pill:active{transform:translateY(1px)}

/* Footer */
.site-footer{
  border-top:1px solid #e9eef6; background:#fbfdff; color:#6a7686;
  padding:18px 0 28px; font-size:.925rem; text-align:center;
}

/* Focus styles */
a:focus, button:focus{outline:3px solid var(--ring); outline-offset:2px; border-radius:10px}

/* Animations */
@keyframes fadeUp{from{opacity:0; transform: translateY(8px)} to{opacity:1; transform: translateY(0)}}
