/* Geist Font - Variable Weight */
@font-face {
  font-family: 'Geist';
  src: url('fonts/geist/geist-variablefont_wght.ttf') format('truetype');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

/* Arvo Font - Regular and Bold */
@font-face {
  font-family: 'Arvo';
  src: url('fonts/arvo/arvo-regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Arvo';
  src: url('fonts/arvo/arvo-bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Arvo';
  src: url('fonts/arvo/arvo-italic.ttf') format('truetype');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Arvo';
  src: url('fonts/arvo/arvo-bolditalic.ttf') format('truetype');
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}body { font-family: 'Geist', sans-serif; color: #111; margin: 0; padding: 0; line-height: 1.6}h1,h2,h3 { margin-top: 0; font-weight: 700; font-family: 'Arvo', serif; letter-spacing: .5px}p { margin-bottom: 1rem}a { color: #b30000; text-decoration: none}a:hover { text-decoration: underline}nav,a,button,.btn,.donate-btn { font-family: 'Geist', sans-serif; font-weight: 600; letter-spacing: .05em}.hero { position: relative; width: 100vw; height: 100vh; margin: 0; padding: 0; background: url('images/hero.jpeg') center center / cover no-repeat fixed; color: #fff; display: flex; flex-direction: column; justify-content: space-between; overflow: hidden}.hero::after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgb(0 0 0 / .55); z-index: 1}.hero-content,.hero-top,.hero-center { position: relative; z-index: 2}.hero-top { display: flex; justify-content: space-between; align-items: center; width: 90%; max-width: 1400px; margin: 0 auto; padding: 2rem 0}.hero-logo { height: 100px; width: auto; filter: drop-shadow(0 0 8px rgb(0 0 0 / .5))}.hero-nav { display: flex; gap: 2rem; align-items: center}.hero-nav a { color: #fff; text-decoration: none; font-weight: 600; transition: color 0.3s ease}.hero-nav a:hover { color: #00a859}.hero-center { text-align: center; max-width: 700px; margin: auto; padding-bottom: 5rem}.hero-center h1 { font-size: 3rem; margin-bottom: 1rem; letter-spacing: 1px; color: #fff}.hero-center p { font-size: 1.2rem; margin-bottom: 1.5rem; color: #eee; font-family: 'Geist', sans-serif; font-weight: 400}.btn { display: inline-block; padding: .8rem 1.5rem; border-radius: 4px; text-decoration: none; font-weight: 600; transition: background-color 0.3s ease, color 0.3s ease; margin: .3rem}.primary-btn { background-color: #00a859; color: #fff}.primary-btn:hover { background-color: #b30000}.secondary-btn { border: 2px solid #b30000; color: #fff}.secondary-btn:hover { background-color: #b30000; color: #fff}.donate-btn { background-color: #b30000; color: #fff !important; padding: .5rem 1rem; border-radius: 4px; font-weight: 600}.donate-btn:hover { background-color: #00a859; color: #fff}.heart { color: #b30000 !important}section { width: 100%; padding: 5rem 0}.section { padding: 5rem 0}.section.light { background-color: #fff; color: #000}.section.dark { background-color: #000; color: #fff; background-size: cover; background-position: center; background-blend-mode: multiply}.section h2 { text-align: center; font-size: 2rem; margin-bottom: 2rem; color: #b30000}.section-inner { width: 90%; max-width: 1200px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 2rem}.section-inner img { width: 45%; border-radius: 10px; box-shadow: 0 4px 10px rgb(0 0 0 / .15); object-fit: cover}.section-inner .text { flex: 1; min-width: 300px}.section-inner h2 { color: #fff; margin-bottom: 1rem; font-size: 2.2rem}.section-inner p { font-family: 'Geist', sans-serif; font-size: 1.05rem}#about-mission,#officers,#contact { width: 100%; margin: 0; padding: 0}#about-mission { background-color: #fff; color: #000}#officers { background-color: #00a859; color: #fff}#officers h2 { color: #fff}#history { position: relative; background: url('images/history.jpeg') center / cover no-repeat fixed; background-size: cover; background-position: center; color: #fff; text-align: center}#history::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgb(0 0 0 / .55); z-index: 1}#history .section-inner { position: relative; z-index: 2; flex-direction: column}#contact { background-color: #fff; color: #000}#contact .section-inner { flex-direction: row-reverse}#about-mission .section-inner,#officers .section-inner,#contact .section-inner { display: flex; flex-wrap: nowrap; align-items: stretch; justify-content: center; width: 100%; max-width: none; margin: 0; padding: 0; min-height: 80vh}#about-mission .section-inner { flex-direction: row}#officers .section-inner { flex-direction: row-reverse}#contact .section-inner { flex-direction: row}#about-mission img,#officers img,#contact img,#about-mission picture,#officers picture,#contact picture { width: 50%; height: auto; min-height: 80vh; object-fit: cover; display: block}#about-mission picture img,#officers picture img,#contact picture img { width: 100%; height: 100%; object-fit: cover}#about-mission .text,#officers .text,#contact .text { width: 50%; padding: 5rem 4rem; display: flex; flex-direction: column; justify-content: center; background-color: #fff; box-sizing: border-box}#officers .text { background-color: #00a859; color: #fff}#about-mission .text h2,#contact .text h2 { color: #b30000}#officers .text h2 { color: #fff}.officer-list { list-style: none; padding: 0; max-width: 600px; margin: auto}.officer-list li { padding: .5rem 0; border-bottom: 1px solid #ccc; margin: .5rem 0}.contact-info { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2rem}.contact-info p { margin: 0 0 1rem 0}.contact-info a { color: #b30000; text-decoration: none}.contact-info a:hover { text-decoration: underline}#contact .contact-info { display: flex; flex-direction: column; gap: 1.5rem}.footer { background-color: #111; color: #fff; text-align: center; padding: 2rem 0; font-size: .95rem; border-top: 4px solid #b30000; font-family: 'Geist', sans-serif; margin-top: 2rem}.footer p { margin: .5rem 0}@media (max-width:1024px) { .hero-top { flex-direction: column; gap: 1rem; text-align: center } .hero-nav { flex-wrap: wrap; gap: 1rem; justify-content: center } .hero-logo { height: 60px } .section-inner { flex-direction: column; text-align: center } .section-inner img { width: 100%; height: auto; min-height: 300px } .section-inner .text { width: 100% }}@media (max-width:900px) {#about-mission .section-inner,#officers .section-inner,#contact .section-inner { flex-direction: column }#about-mission img,#officers img,#contact img,#about-mission picture,#officers picture,#contact picture,#about-mission .text,#officers .text,#contact .text { width: 100%; min-height: auto }#about-mission .text,#officers .text,#contact .text { padding: 3rem 2rem }#officers .section-inner { flex-direction: column-reverse !important }#officers img,#officers picture { width: 100% !important; height: auto !important; min-height: 250px }#officers img { object-fit: cover; display: block }#officers .text { width: 100% !important; padding: 2rem 1.5rem !important; text-align: center }#officers .text ul { text-align: left; padding-left: 1.5rem; margin: 0 auto; max-width: 400px }}@media (max-width:768px) { .navbar .nav-links { flex-direction: column; background-color: #000; position: absolute; top: 100%; left: 0; width: 100%; display: none; text-align: center; padding: 1rem 0 } .navbar.active .nav-links { display: flex } .hero { background-attachment: scroll; height: 70vh } .hero-center h1 { font-size: 2rem; line-height: 1.2 } .hero-center p { font-size: 1rem; padding: 0 1rem } .btn { padding: .6rem 1.2rem; font-size: .9rem }#about-mission img,#officers img,#contact img { height: auto; min-height: 250px }#about-mission .text,#officers .text,#contact .text { padding: 2rem 1.5rem }#officers .text ul { text-align: left; padding-left: 1.5rem }#contact .contact-info { flex-direction: column; align-items: center; text-align: center }#contact .contact-info p { margin-bottom: 1rem } .footer { padding: 1.5rem 1rem; font-size: .85rem }}@media (max-width:480px) { .hero-center h1 { font-size: 2rem } .hero-center p { font-size: .9rem } .btn { font-size: .85rem } .section-inner .text h2 { font-size: 1.6rem } .section-inner p { font-size: .95rem }}