:root {
      --flag-blue:  #003366;
      --hf-gold:    #CDB642;
      --hf-green:   #334F3A;
      --white:      #ffffff;
      --text:       #333333;
    }
    *, *::before, *::after { box-sizing: border-box; margin:0; padding:0 }
    body {
      font-family: "Lato", sans-serif;
      color: var(--text);
      background: var(--white);
    }
    a { color: inherit; text-decoration: none; }

    /* NAVBAR */
    .navbar {
      position: sticky; top:0;
      background: var(--flag-blue);
      display:flex; align-items:center; justify-content:space-between;
      padding:.75rem 1rem; z-index:100;
    }
    .brand {
      color: var(--hf-gold);
      font-family: '4', serif;
      font-size: 1.25rem;
    }
    .nav-links {
      display: flex; gap:1rem;
    }
    .nav-btn {
      padding:.5rem 1rem;
      border:2px solid var(--hf-gold);
      border-radius:4px;
      background: transparent;
      color: var(--hf-gold);
      font-weight:700;
      transition:.2s;
    }
    .nav-btn:hover {
      background: var(--hf-gold);
      color: var(--flag-blue);
    }
    .hamburger {
      display:none;
      background:none; border:none;
      color: var(--hf-gold);
      font-size:1.5rem;
    }
    .mobile-menu {
      display:none;
      flex-direction:column;
      background: var(--flag-blue);
    }
    .mobile-menu a {
      padding:.75rem 1rem;
      color: var(--hf-gold);
    }
    .mobile-menu a:hover {
      background:rgba(255,255,255,0.1);
    }
    .mobile-menu.show {
      display:flex;
    }
    @media(max-width:768px) {
      .nav-links { display:none }
      .hamburger { display:block }
    }

    /* SITE BANNER */
    .site-banner {
      background: var(--flag-blue);
      color: var(--hf-gold);
      text-align: center;
      padding: 1rem;
      font-family: 'Miller Display SemiBold', serif;
      border-bottom: 3px solid var(--hf-gold);
    }
    .site-banner img {
      vertical-align: middle;
      height: 70px;
      margin-right: .5rem;
    }
    .site-banner .title {
      font-size:1.6rem;
    }
    .site-banner .subtitle {
      font-size:.9rem;
      margin-top:.25rem;
    }

    /* HERO: MISSION + PHOTO */
    .hero {
      display:flex; align-items:center; justify-content:center;
      gap:2rem; padding:3rem 1rem; position:relative;
    }
    .mission-card {
      max-width:400px;
      background: var(--white);
      border:3px solid var(--hf-gold);
      padding:2rem;
      box-shadow:0 4px 12px rgba(0,0,0,.2);
      z-index:2;
      display:flex; flex-direction:column; align-items:center;
      text-align:left;
    }
    .mission-card h3 {
      margin-bottom:1rem;
      font-size:1.4rem;
      color: var(--flag-blue);
    }
    .mission-card p {
      line-height:1.6;
      margin-bottom:1.5rem;
    }
    .donate-wrapper {
      width:100%;
      display:flex;
      justify-content:center;
      margin-top:1rem;
    }
    .donate-btn {
      display:inline-block;
      padding:.75rem 1.5rem;
      background: var(--flag-blue);
      color: white;
      font-weight:700;
      border-radius:4px;
      text-decoration:none;
    }
    .hero-photo {
      flex:1;
      margin-left:-80px; /* overlap */
      z-index:1;
    }
    .hero-photo img {
      width:100%;
      height:auto;
      box-shadow:0 4px 12px rgba(0,0,0,.2);
      display:block;
    }
    @media(max-width:768px) {
      .hero { flex-direction:column-reverse }
      .hero-photo { margin:1rem 0 0 }
    }

    /* HUDSON FARM */
    .hf-section {
      display:flex; justify-content:center;
      padding:2rem 1rem;
    }
    .hf-card {
      background: var(--hf-green);
      color: var(--white);
      border:3px solid var(--hf-gold);
      padding:1.5rem;
      text-align:center;
      box-shadow:0 4px 12px rgba(0,0,0,.2);
      max-width:620px; width:100%;
    }
    .hf-logos {
      display:flex; justify-content:center;
      gap:1.5rem; margin-bottom:1rem;
    }
    .hf-logos img {
      height:60px;
    }
    .hf-card h3 {
      margin-bottom:1rem;
    }
    .hf-card p {
      line-height:1.6;
    }
    .hf-card a {
      display:inline-block;
      margin-top:1rem;
      background: var(--hf-gold);
      color: var(--hf-green) !important;
      padding:.75rem 1.5rem;
      font-weight:700;
      border-radius:4px;
    }