:root { --space: 1rem; --maxw: 1100px; }
* { box-sizing: border-box; }
body { margin: 0; font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; line-height: 1.5; color: #1e293b; }
a { color: #0ea5e9; text-decoration: none; }
a:hover { text-decoration: underline; }
.site-header, .site-footer { padding: var(--space); background: #0b1220; color: #fff; }
.site-header a { color: #fff; font-weight: 600; }
.container { max-width: var(--maxw); margin: 0 auto; padding: calc(var(--space)*2) var(--space); }

.hero {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 60vh;
  color: white;
  text-align: center;
  background:
    linear-gradient(180deg, rgba(2,6,23,.55), rgba(2,6,23,.55)),
    url('/assets/hero.jpg') center/cover no-repeat;
  overflow: hidden;
}
.hero .content {
  position: relative;
  z-index: 1;
  padding: calc(var(--space)*2);
  opacity: 0;
  transform: translateY(12px);
  animation: fadeUp 900ms ease-out 120ms forwards;
}
@keyframes fadeUp {
  to { opacity: 1; transform: translateY(0); }
}

.hero h1 { font-size: clamp(2rem, 6vw, 4rem); margin: 0 0 .5rem 0; }
.hero p { font-size: clamp(1rem, 2.2vw, 1.25rem); }

.grid { display: grid; gap: calc(var(--space)*1.25); grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.card { background: #fff; border-radius: 16px; padding: calc(var(--space)*1.25); box-shadow: 0 6px 22px rgba(2,6,23,.08); }
.card h3 { margin-top: 0; }

.button { display: inline-block; padding: .625rem 1rem; border-radius: 10px; background: #0ea5e9; color: #fff; font-weight: 600; }
.button:hover { background: #0284c7; text-decoration: none; }

.section { padding: calc(var(--space)*2) 0; }
small.muted { color: #64748b; }
ul.link-list { list-style: none; padding: 0; margin: 0; }
ul.link-list li { margin: .5rem 0; }