*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html, body { overflow-x: hidden; }
body { font-family: 'Inter', sans-serif; background: #04080f; color: #fff; }

.fixed { position: fixed; }
.absolute { position: absolute; }
.relative { position: relative; }
.inset-0 { top: 0; right: 0; bottom: 0; left: 0; }

#bg-gradient {
  position: fixed; inset: 0; z-index: -2;
  background:
    radial-gradient(120% 90% at 50% 22%, #123255 0%, #0c2138 30%, #071425 55%, #04080f 80%, #02050b 100%);
}
#particles-canvas {
  position: fixed; inset: 0; width: 100%; height: 100%;
  pointer-events: none; z-index: -1;
}

nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 50;
  display: flex; align-items: center; justify-content: space-between;
  padding: 1.25rem 2.5rem;
  background: rgba(4,8,15,0.55);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(255,255,255,0.05);
}
nav .logo { font-weight: 700; font-size: 1.25rem; color: #fff; letter-spacing: -0.025em; text-decoration: none; }
nav .logo span { color: #2C5C88; }
nav .nav-links { display: flex; align-items: center; gap: 1.5rem; }
nav .nav-links a { font-size: 0.875rem; color: #d1d5db; text-decoration: none; transition: color 0.2s; }
nav .nav-links a:hover { color: #fff; }
nav .social { display: flex; align-items: center; gap: 1rem; }
nav .social a { color: #d1d5db; transition: color 0.2s; }
nav .social a:hover { color: #fff; }
nav .social svg { width: 1.25rem; height: 1.25rem; }
nav .nav-right { display: flex; align-items: center; gap: 1.5rem; }
nav .nav-phone {
  display: inline-flex; align-items: center; gap: 0.5rem;
  background: #2C5C88; color: #fff; text-decoration: none;
  font-size: 0.85rem; font-weight: 600; border-radius: 0.5rem;
  padding: 0.55rem 1rem; transition: background 0.2s; white-space: nowrap;
}
nav .nav-phone:hover { background: #3a7aad; }
nav .nav-phone svg { width: 1rem; height: 1rem; }

.hamburger {
  display: none; flex-direction: column; justify-content: center;
  gap: 5px; cursor: pointer; padding: 4px; background: none; border: none;
}
.hamburger span {
  display: block; width: 22px; height: 2px;
  background: #d1d5db; border-radius: 2px;
  transition: all 0.25s;
}
.hamburger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.hamburger.open span:nth-child(2) { opacity: 0; }
.hamburger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

#mobile-menu {
  display: none; position: fixed; top: 58px; left: 0; right: 0; z-index: 49;
  background: rgba(4,8,15,0.97); backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(255,255,255,0.07);
  flex-direction: column; padding: 1.25rem 1.5rem 1.5rem; gap: 0.25rem;
}
#mobile-menu.open { display: flex; }
#mobile-menu a {
  font-size: 1rem; color: #d1d5db; text-decoration: none;
  padding: 0.75rem 0; border-bottom: 1px solid rgba(255,255,255,0.06);
  transition: color 0.2s;
}
#mobile-menu a:last-child { border-bottom: none; }
#mobile-menu a:hover { color: #fff; }
#mobile-menu .mob-phone {
  display: inline-flex; align-items: center; gap: 0.5rem;
  background: #2C5C88; color: #fff; border-radius: 0.5rem;
  padding: 0.75rem 1rem; font-weight: 600; font-size: 0.9rem;
  margin-top: 0.75rem; text-decoration: none;
}

.cta-btn {
  display: inline-flex; align-items: center; gap: 0.5rem;
  background: #2C5C88; color: #fff; font-weight: 500; border-radius: 0.5rem;
  padding: 0.875rem 2rem; font-size: 0.875rem; text-decoration: none; transition: background 0.2s;
}
.cta-btn:hover { background: #3a7aad; }

#site { position: relative; z-index: 10; }
#site .section-pad { max-width: 72rem; margin: 0 auto; padding: 7rem 2.5rem; }
.eyebrow { font-size: 0.8rem; letter-spacing: 0.12em; text-transform: uppercase; color: #2C5C88; font-weight: 600; margin-bottom: 0.9rem; }
.section-title { font-size: clamp(1.75rem, 4vw, 2.75rem); font-weight: 700; line-height: 1.15; margin-bottom: 1rem; }
.section-lead { color: #9ca3af; font-size: 1.05rem; max-width: 44rem; line-height: 1.65; }

.services-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; margin-top: 3rem; }
.service-card { background: #0d0f15; border: 1px solid rgba(255,255,255,0.06); border-radius: 0.9rem; padding: 1.75rem; transition: border-color 0.25s, transform 0.25s; }
.service-card:hover { border-color: rgba(44,92,136,0.65); transform: translateY(-4px); }
.service-card .num { font-size: 0.8rem; color: #2C5C88; font-weight: 600; letter-spacing: 0.08em; }
.service-card h3 { font-size: 1.2rem; font-weight: 600; margin: 0.7rem 0 0.6rem; }
.service-card p { color: #9ca3af; font-size: 0.9rem; line-height: 1.6; }

.client-tags { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 2.5rem; }
.client-tags span { background: #0d0f15; border: 1px solid rgba(255,255,255,0.08); border-radius: 999px; padding: 0.6rem 1.25rem; font-size: 0.9rem; color: #d1d5db; }

.office-card { background: #0d0f15; border: 1px solid rgba(255,255,255,0.06); border-radius: 0.9rem; padding: 1.75rem; }
.office-card h3 { font-size: 1.05rem; font-weight: 600; margin-bottom: 0.5rem; }
.office-card p { color: #9ca3af; font-size: 0.95rem; line-height: 1.6; margin-bottom: 0.6rem; }
.office-card p:last-child { margin-bottom: 0; }
.office-card ul { color: #9ca3af; font-size: 0.92rem; line-height: 1.7; padding-left: 1.1rem; }
.office-card ul li::marker { color: #2C5C88; }

#site footer { border-top: 1px solid rgba(255,255,255,0.07); }
#site footer .inner { max-width: 72rem; margin: 0 auto; padding: 3rem 2.5rem; }
#site footer .brand { font-weight: 700; font-size: 1.1rem; }
#site footer .brand span { color: #2C5C88; }
#site footer .tag { color: #6b7280; font-size: 0.85rem; line-height: 1.5; }

.footer-content { display: grid; grid-template-columns: repeat(5, 1fr); gap: 2rem; margin-bottom: 2rem; }
.footer-section h3 { font-size: 0.85rem; font-weight: 700; margin: 0 0 1rem; color: #8fb3d9; text-transform: uppercase; letter-spacing: 0.1em; }
.footer-section .brand { margin: 0 0 0.75rem; }
.footer-section .brand span { color: #2C5C88; }
.footer-section > .tag { margin-bottom: 1rem; color: #6b7280; }
.footer-contact { margin-top: 0.75rem; }
.footer-link { color: #8fb3d9; text-decoration: none; transition: color 0.2s ease; font-size: 0.9rem; }
.footer-link:hover { color: #b8d4e8; }
.footer-sep { margin: 0 0.4rem; color: #4a5f7f; }
.footer-links { list-style: none; padding: 0; margin: 0; }
.footer-links li { margin-bottom: 0.7rem; font-size: 0.9rem; line-height: 1.5; color: #9ca3af; }
.footer-links a { color: #8fb3d9; text-decoration: none; transition: color 0.2s ease; }
.footer-links a:hover { color: #b8d4e8; text-decoration: underline; }
.footer-links strong { color: #b8d4e8; display: block; margin-bottom: 0.3rem; font-weight: 600; }
.footer-bottom { text-align: center; padding-top: 1.5rem; border-top: 1px solid rgba(139, 179, 217, 0.1); }

.svc-link { display:inline-flex; align-items:center; gap:0.35rem; margin-top:0.9rem; color:#8fb3d1; font-size:0.85rem; font-weight:600; text-decoration:none; transition:color 0.2s; }
.svc-link:hover { color:#fff; }

.faq-list { margin-top: 2.5rem; display: flex; flex-direction: column; gap: 1rem; max-width: 48rem; }
.faq-item { background: #0d0f15; border: 1px solid rgba(255,255,255,0.06); border-radius: 0.9rem; padding: 1.5rem 1.75rem; }
.faq-item h3 { font-size: 1.02rem; font-weight: 600; margin-bottom: 0.5rem; color: #fff; }
.faq-item p { color: #9ca3af; font-size: 0.92rem; line-height: 1.6; margin: 0; }

.loc-hero { padding: 9rem 2.5rem 4rem; max-width: 56rem; margin: 0 auto; }
.loc-hero .breadcrumb { font-size: 0.85rem; color: #7a9cc4; margin-bottom: 1rem; }
.loc-hero .breadcrumb a { color: #7a9cc4; text-decoration: none; }
.loc-hero .breadcrumb a:hover { color: #b8d4e8; }
.loc-hero h1 { font-size: clamp(1.8rem, 4vw, 2.6rem); font-weight: 700; line-height: 1.15; margin-bottom: 1rem; }
.loc-hero .loc-sub { color: #a0a9b8; font-size: 1.05rem; line-height: 1.6; max-width: 40rem; }
.loc-hero .ctas { display: flex; gap: 1rem; flex-wrap: wrap; margin-top: 1.75rem; }

.loc-grid { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 2.5rem; align-items: start; margin-top: 1rem; }
.loc-block h2 { font-size: 1.3rem; font-weight: 700; margin: 2rem 0 0.75rem; }
.loc-block h2:first-child { margin-top: 0; }
.loc-block p { color: #a0a9b8; line-height: 1.7; margin-bottom: 0.75rem; }
.loc-block ul { color: #a0a9b8; line-height: 1.8; padding-left: 1.2rem; margin-bottom: 0.75rem; }
.loc-block ul li::marker { color: #2C5C88; }

.landmark-tags { display: flex; flex-wrap: wrap; gap: 0.6rem; margin: 0.5rem 0 1rem; }
.landmark-tags span, .landmark-tags a { background: #0d0f15; border: 1px solid rgba(255,255,255,0.08); border-radius: 999px; padding: 0.45rem 0.9rem; font-size: 0.85rem; color: #d1d5db; text-decoration: none; transition: border-color 0.2s, color 0.2s; }
.landmark-tags a:hover { border-color: rgba(44,92,136,0.65); color: #fff; }

.loc-testimonial { background: #0d0f15; border: 1px solid rgba(255,255,255,0.06); border-radius: 0.9rem; padding: 1.75rem; margin-top: 1.5rem; }
.loc-testimonial .quote-mark { font-size: 2.2rem; color: #2C5C88; line-height: 1; font-family: Georgia, serif; display: block; margin-bottom: 0.4rem; }
.loc-testimonial p.quote { color: #d1d5db; font-size: 0.94rem; line-height: 1.6; margin-bottom: 1rem; }
.loc-testimonial .name { font-weight: 600; color: #fff; font-size: 0.92rem; }

.loc-cta-band { background: rgba(44,92,136,0.08); border-top: 1px solid rgba(255,255,255,0.06); border-bottom: 1px solid rgba(255,255,255,0.06); padding: 3rem 2.5rem; text-align: center; margin-top: 3rem; }
.loc-cta-band h2 { font-size: 1.4rem; margin-bottom: 0.75rem; }
.loc-cta-band p { color: #a0a9b8; margin-bottom: 1.5rem; }

.honest-note { background: rgba(44,92,136,0.07); border: 1px solid rgba(44,92,136,0.3); border-radius: 0.75rem; padding: 1.25rem 1.5rem; margin: 1.5rem 0; }
.honest-note p { color: #cfe3f2; font-size: 0.92rem; line-height: 1.6; margin: 0; }

.city-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; margin-top: 3rem; }
.city-card { background: #0d0f15; border: 1px solid rgba(255,255,255,0.06); border-radius: 0.9rem; padding: 1.75rem; display: block; text-decoration: none; transition: border-color 0.25s, transform 0.25s; }
.city-card:hover { border-color: rgba(44,92,136,0.65); transform: translateY(-4px); }
.city-card h3 { font-size: 1.15rem; font-weight: 700; color: #fff; margin-bottom: 0.5rem; }
.city-card p { color: #9ca3af; font-size: 0.88rem; line-height: 1.55; margin-bottom: 0; }
.city-card .svc-link { margin-top: 0.85rem; }

@media (max-width: 768px) {
  nav { padding: 0.9rem 1.25rem; }
  nav .nav-links { display: none; }
  nav .social { display: none; }
  nav .nav-phone { display: none; }
  .hamburger { display: flex; }
  #site .section-pad { padding: 4.5rem 1.5rem; }
  .services-grid { grid-template-columns: 1fr; }
  .city-grid { grid-template-columns: 1fr; }
  .footer-content { grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
  .loc-grid { grid-template-columns: 1fr; }
  .loc-hero { padding: 6.5rem 1.25rem 2.5rem; }
}
@media (max-width: 480px) {
  .footer-content { grid-template-columns: 1fr; gap: 1.5rem; }
  .footer-section h3 { font-size: 0.8rem; margin-bottom: 0.75rem; }
  .footer-links li { margin-bottom: 0.5rem; font-size: 0.85rem; }
  #site footer .inner { padding: 2rem 1.5rem; }
}
