/* General Reset */ * {
  margin: 0; padding: 0; box-sizing: border-box; } body { font-family: "Open 
  Sans", sans-serif; background-color: #f9f9f9; color: #3A3F4B; line-height: 1.6; 
  padding-bottom: 2rem;
} /* Header */ .site-header {
  background-color: #1A1F2B; padding: 1rem; display: flex; flex-direction: 
  column; align-items: center;
} .site-header .main-logo {
  max-width: 220px; height: auto; margin-bottom: 0.5rem; } /* Mobile Menu Toggle 
Button */ .menu-toggle {
  display: none; background: none; border: none; font-size: 2rem; color: white; 
  cursor: pointer; margin-top: 0.5rem;
} /* Navigation */ .site-nav {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 1rem; } .site-nav 
a {
  color: #FFFFFF; text-decoration: none; font-weight: 600; transition: color 0.3s 
  ease;
} .site-nav a:hover {
  color: #C1440E; } /* Hero Section */ .hero { text-align: center; 
  background-color: #E1E5EA; padding: 2rem 1rem;
} .hero h1 {
  font-size: 2rem; margin-bottom: 0.5rem; font-weight: bold; } .hero p { 
  font-size: 1.1rem; opacity: 0.9;
} /* Cards Grid */ .cards {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); 
  gap: 1.5rem; padding: 2rem; max-width: 1200px; margin: 0 auto;
} .card {
  background-color: #FFFFFF; border-radius: 12px; box-shadow: 0 4px 12px 
  rgba(0,0,0,0.08); padding: 1.5rem; text-align: center; text-decoration: none; 
  transition: transform 0.3s ease, box-shadow 0.3s ease;
} .card:hover {
  transform: translateY(-5px); box-shadow: 0 8px 18px rgba(0,0,0,0.12); } .card 
img.icon {
  width: 64px; height: 64px; object-fit: contain; margin-bottom: 1rem; } .card h2 
{
  font-family: "Montserrat", sans-serif; font-size: 1.2rem; color: #1A1F2B; 
  margin-bottom: 0.5rem;
} .card p {
  font-size: 0.95rem; color: #555; } /* Footer */ footer { background-color: 
  #1A1F2B; color: #FFFFFF; padding: 2rem 1rem; text-align: center;
} footer a {
  color: #C1440E; text-decoration: none; font-weight: 500; } footer a:hover { 
  text-decoration: underline;
} footer img.icon {
  height: 28px; vertical-align: middle; margin: 0 8px; } /* Responsive Email Icon 
*/ .__cf_email__ {
  color: #ddd; font-style: italic; } /* Responsive Layout */ img, img.icon, 
img.main-logo, .card img {
  max-width: 100%; height: auto; display: block; } /* Mobile Styles */ @media 
(max-width: 768px) {
  .cards {
    padding: 1rem;
  } .card {
    padding: 1rem;
  } .site-nav {
    display: none; flex-direction: column; align-items: center; gap: 1rem; 
    margin-top: 1rem;
  } .site-nav.show {
    display: flex;
  } .menu-toggle {
    display: block;
  }
}