:root {
  --orange: #F0771F;
  --blue: #0E2A47;
  --blue-accent: #1F4C7B;
  --text: #0e1a2a;
  --bg: #ffffff;
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji"; color: var(--text); background: var(--bg); }
a { color: var(--orange); text-decoration: none; }
a:hover { text-decoration: underline; }

.header { display:flex; align-items:center; gap:1rem; padding: 1rem 1.25rem; max-width: 1100px; margin: 0 auto; }
.header img.logo { height: 64px; width:auto; }
.header .brand { display:flex; flex-direction:column; }
.header .brand h1 { font-size: clamp(1.4rem, 2.2vw, 2rem); margin:0; color: var(--blue); letter-spacing: 0.5px; }
.header .brand span { font-size: 0.95rem; color: var(--blue-accent); text-transform: uppercase; letter-spacing: 2px; }

.hero {
  background: linear-gradient(135deg, var(--blue) 0%, var(--blue-accent) 60%, var(--orange) 120%);
  color: white;
  padding: clamp(2rem, 6vw, 5rem) 1.25rem;
}
.hero-inner { max-width: 1100px; margin:0 auto; display:grid; grid-template-columns: 1.2fr 1fr; gap: 2rem; align-items:center; }
.hero h2 { font-size: clamp(1.8rem, 4vw, 3rem); margin: 0 0 0.5rem 0; }
.hero p { font-size: clamp(1rem, 1.5vw, 1.15rem); opacity: 0.95; }
.ctas { display:flex; gap: 0.75rem; flex-wrap: wrap; margin-top: 1rem; }
.button {
  display:inline-block; padding: 0.75rem 1rem; border-radius: 14px; font-weight: 600;
  background: white; color: var(--blue); border: 2px solid white;
}
.button.secondary { background: transparent; color: white; border-color: rgba(255,255,255,0.6); }

.card-row { max-width: 1100px; margin: -2rem auto 2rem auto; padding: 0 1.25rem; display:grid; gap:1rem; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.card { background:white; border: 1px solid #e9eef4; border-radius: 16px; padding: 1.1rem; box-shadow: 0 6px 18px rgba(6,18,40,0.08); }
.card h3 { margin-top:0; color: var(--blue); }

.section { max-width: 1100px; margin: 0 auto; padding: 2rem 1.25rem; }
.section h2 { color: var(--blue); margin-top:0; }

.footer {
  background:#f7f9fc; border-top: 1px solid #e9eef4; padding: 1.25rem;
}
.footer-inner { max-width: 1100px; margin:0 auto; display:flex; flex-wrap:wrap; gap:0.75rem; align-items:center; justify-content:space-between; }
.small { font-size: 0.95rem; color:#445; }
.contact a { font-weight:600; }
.map { width:100%; height: 320px; border:0; border-radius: 12px; }
@media (max-width: 860px) {
  .hero-inner { grid-template-columns: 1fr; }
  .header { flex-direction: column; align-items:flex-start; }
}