:root {
  --color-primary: #0057A0;
  --color-accent: #FFA000;
  --color-text: #0f2a3a;
  --color-muted: #516471;
  --color-bg: #f7fafc;
  --color-border: #e3e8ee;
}

* { box-sizing: border-box; }
html, body { margin:0; padding:0; font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; color:var(--color-text); }
a { color: var(--color-primary); text-decoration: none; }
a:hover { text-decoration: underline; }
.container { width: min(1100px, 92%); margin: 0 auto; }
.text-center { text-align: center; }

/* Header + dropdown nav */
header { position: sticky; top:0; z-index: 10; background:#fff; border-bottom: 1px solid var(--color-border); }
.header-content { display:flex; align-items:center; justify-content: space-between; padding: .65rem 0; gap: 1rem; }
.header-logo img { height: 52px; width:auto; display:block; }
.nav { display:flex; gap:1rem; align-items:center; position: relative; }
.nav > a { font-weight:600; color:#113a58; padding:.4rem .25rem; }
.nav > a.active, .nav > a:hover { color: var(--color-primary); }

.dropdown { position: relative; }
.dropdown > a { display:inline-flex; align-items:center; gap:.35rem; }
.dropdown-menu {
  position: absolute; top: 2.1rem; right: 0;
  display: none; min-width: 240px;
  background:#fff; border:1px solid var(--color-border); border-radius:10px;
  box-shadow: 0 10px 30px rgba(0,0,0,.08); padding:.4rem;
}
.dropdown:hover .dropdown-menu { display:block; }
.dropdown-menu a {
  display:block; padding:.55rem .7rem; border-radius:8px; color:#113a58;
}
.dropdown-menu a:hover { background: rgba(0,87,160,.06); text-decoration:none; }

/* Hero (now single-column, centered, no side image) */
.hero { background: radial-gradient(1200px 400px at 70% -50%, rgba(0,87,160,.18), rgba(0,87,160,0)) , #ffffff; }
.hero-inner { display:flex; flex-direction:column; align-items:center; justify-content:center; min-height: 64vh; padding: 3rem 0; text-align:center; }
.hero-title { font-size: clamp(1.8rem, 3.6vw + 1rem, 3rem); margin:.25rem 0 1rem; color:#0e2d44; }
.hero-sub { font-size: 1.05rem; line-height:1.6; color: var(--color-muted); max-width: 760px; }
.hero .button { margin-top: 1rem; }
.hero-logo { max-width: 420px; width: 65%; height:auto; margin-bottom: .75rem; }

.button { display:inline-block; padding:.8rem 1.05rem; border-radius: 10px; background: var(--color-primary); color:#fff; font-weight:700; }
.button:hover { filter: brightness(0.95); text-decoration:none; }

.section-title { font-size: 1.8rem; margin: 0 0 .75rem; }
.section-muted { color: var(--color-muted); margin-bottom: 1.5rem; }

#services { background: var(--color-bg); padding: 3rem 0; }
.services-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1.25rem; }
.card { background:#fff; border:1px solid var(--color-border); border-radius:14px; padding:1.1rem; }
.card h3 { margin:.25rem 0 .4rem; }
.card p { color: var(--color-muted); margin:0 0 .75rem; }
.card a { font-weight:700; }

.feature-list { display:grid; grid-template-columns: repeat(auto-fit, minmax(260px,1fr)); gap: .75rem 1rem; padding-left: 1rem; }
.feature-list li { margin:.25rem 0; }

.sub-hero { background: var(--color-primary); color:#fff; padding: 3rem 0; }
.service-detail { padding: 2.2rem 0; }

.footer { background:#0e2d44; color:#cfe0ee; padding: 2rem 0 1.2rem; margin-top: 2rem; }
.footer h3 { color:#fff; margin-top:0; }
.footer-grid { display:grid; grid-template-columns: 1.2fr .8fr .8fr; gap:1.25rem; }
.footer a { color:#fff; }
.footer-links { list-style:none; padding:0; margin:0; }
.footer-links li { margin:.35rem 0; }
.footer small { color:#aac2d2; }

/* contact form */
.form-card { background:#fff; border:1px solid var(--color-border); border-radius: 12px; padding:1.1rem; }
.form-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(240px,1fr)); gap:1rem; }
.form-grid label { display:block; font-weight:700; margin-bottom:.35rem; }
.form-grid input[type=text], .form-grid input[type=email], .form-grid input[type=tel], .form-grid input[type=number], .form-grid textarea {
  width:100%; padding:.65rem .8rem; border:1px solid var(--color-border); border-radius: 8px;
}
.checkboxes { display:grid; grid-template-columns: repeat(auto-fit, minmax(160px,1fr)); gap:.45rem 1rem; border:1px dashed var(--color-border); border-radius:8px; padding:.75rem; background: rgba(0,87,160,.03); }
.form-actions { display:flex; align-items:center; gap:.85rem; margin-top: .75rem; }
.success-msg { display:none; background:#eaf8ef; color:#165b2e; border:1px solid #a7e3b4; padding:.75rem .9rem; border-radius:8px; }
.error-msg { display:none; background:#fdecec; color:#7a1717; border:1px solid #f5b5b5; padding:.75rem .9rem; border-radius:8px; }

@media (max-width: 880px) {
  .footer-grid { grid-template-columns: 1fr; }
  .dropdown-menu { right: auto; left: 0; }
}