body { margin: 0; -webkit-font-smoothing: antialiased; }
* { box-sizing: border-box; }
a { color: #0f2233; text-decoration: none; }
a:hover { color: #c9962c; }
::selection { background: #c9962c; color: #fff; }
.services-grid { grid-template-columns: repeat(3, 1fr); }
.hero-grid { grid-template-columns: minmax(280px, 1.15fr) minmax(260px, 0.85fr); }
.about-grid { grid-template-columns: minmax(220px, 0.75fr) minmax(320px, 1.6fr); }
.contact-grid { grid-template-columns: minmax(280px, 1.1fr) minmax(280px, 0.9fr); }
.pillars-grid { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 900px) {
  .pillars-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 679px) {
  .services-grid { grid-template-columns: 1fr; }
  .hero-grid, .about-grid, .contact-grid, .pillars-grid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: no-preference) {
  .reveal {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .reveal.in-view { opacity: 1; transform: translateY(0); }

  .reveal-group > * {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1), transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .reveal-group.in-view > * { opacity: 1; transform: translateY(0); }
  .reveal-group.in-view > *:nth-child(1) { transition-delay: 0.03s; }
  .reveal-group.in-view > *:nth-child(2) { transition-delay: 0.09s; }
  .reveal-group.in-view > *:nth-child(3) { transition-delay: 0.15s; }
  .reveal-group.in-view > *:nth-child(4) { transition-delay: 0.21s; }
  .reveal-group.in-view > *:nth-child(5) { transition-delay: 0.27s; }
  .reveal-group.in-view > *:nth-child(6) { transition-delay: 0.33s; }
}

@media (prefers-reduced-motion: reduce) {
  .reveal, .reveal-group > * { opacity: 1; transform: none; transition: none; }
}

.site-header { position: relative; }
.site-nav { display: flex; align-items: center; gap: clamp(14px, 2.5vw, 32px); flex-wrap: wrap; }
.menu-toggle { display: none; flex-direction: column; justify-content: center; align-items: center; gap: 5px; width: 40px; height: 40px; }
.menu-toggle:hover { border-color: rgba(16,31,44,0.3); }
@media (max-width: 679px) {
  .menu-toggle { display: flex; }
  .site-nav {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    background: #faf6ef;
    border-bottom: 1px solid rgba(16,31,44,0.12);
    box-shadow: 0 16px 28px -16px rgba(16,31,44,0.22);
    padding: 20px clamp(20px, 5vw, 56px) 26px;
  }
  .site-nav.open { display: flex; }
}