:root {
    --forest: #1a3d2b;
    --sage: #3d6b4f;
    --leaf: #5a8a5e;
    --mint: #a8c5a0;
    --cream: #f5f0e8;
    --warm-white: #faf7f2;
    --gold: #93bf1c;
    /*--gold: #b8924a;*/
    --gold-light: #75a91b;
    /*--gold-light: #d4aa6a;*/
    --text-dark: #1c2b1e;
    --text-mid: #3a4d3c;
    --text-light: #6b7f6d;
  }

  * { margin: 0; padding: 0; box-sizing: border-box; }

  html { scroll-behavior: smooth; }

  body {
    font-family: 'Lato', sans-serif;
    background: var(--warm-white);
    color: var(--text-dark);
    overflow-x: hidden;
  }


  /* ===== NAV ===== */
  nav {
    position: fixed; top: 0; left: 0; right: 0; z-index: 100;
    background: rgba(26, 61, 43, 0.97);
    backdrop-filter: blur(12px);
    display: flex; align-items: center; justify-content: space-between;
    padding: 0 5%;
    height: 68px;
    border-bottom: 1px solid rgba(168,197,160,0.2);
  }

  .nav-logo {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    text-decoration: none;
  }

  .nav-logo-img {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid rgba(168,197,160,0.4);
    flex-shrink: 0;
  }

  .nav-logo-text {
    font-family: 'Poppins', serif;
    font-size: 1.35rem;
    font-weight: 700;
    color: var(--cream);
    letter-spacing: 0.02em;
    line-height: 1.15;
  }

  .nav-logo-text span { color: var(--gold-light); display: block; font-size: 0.78rem; font-weight: 400; letter-spacing: 0.06em; text-transform: uppercase; }

  .nav-links {
    display: flex; gap: 2.2rem; list-style: none;
  }

  .nav-links a {
    color: rgba(245,240,232,0.75);
    text-decoration: none;
    font-size: 0.85rem;
    font-weight: 500;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    transition: color 0.2s;
  }
 
	.nav-links a.active
	{
		color: var(--gold);
		font-weight: bold;
	}

  .nav-links a:hover { color: var(--gold-light); }

  .nav-cta {
    background: var(--gold);
    color: white !important;
    padding: 0.5rem 1.2rem;
    border-radius: 4px;
    transition: background 0.2s !important;
  }

  .nav-cta:hover { background: var(--gold-light) !important; color: var(--forest) !important; }
  
  /* ===== SECTION SHARED ===== */
  section { padding: 90px 5%; }

  .section-label {
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--sage);
    margin-bottom: 0.6rem;
  }

  .section-title {
    font-family: 'Poppins', serif;
    font-size: clamp(2rem, 3.5vw, 2.8rem);
    font-weight: 700;
    color: var(--forest);
    line-height: 1.2;
  }

  .section-title em { font-style: italic; color: var(--gold); }

  .section-desc {
    color: var(--text-light);
    font-size: 0.95rem;
    line-height: 1.75;
    max-width: 540px;
    margin-top: 1rem;
  }

  .section-head { margin-bottom: 3.5rem; }
  
  .page-hero { padding:3% 5%; }
  
  .hero-icon-bg
  {
    position: absolute;
    right: 5%;
    top: 50%;
    transform: translateY(-50%);
    font-size: 9rem;
    opacity: 0.06;
    pointer-events: none;
    user-select: none;
	text-align: right;
  }
  
  .read-more {
    display: inline-flex; align-items: center; gap: 0.5rem;
    color: var(--sage); font-size: 0.82rem;
    font-weight: 600; text-decoration: none;
    letter-spacing: 0.04em; text-transform: uppercase;
    margin-top: 1rem; transition: color 0.2s;
  }

  .read-more:hover { color: var(--forest); }
  
  .page-hero-desc
  {
	  color:#fff !important;
  }
  .page-hero::after {
    content: ''; position: absolute; right: 0; top: 0; bottom: 0; width: 40%;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 800'%3E%3Ccircle cx='200' cy='400' r='280' fill='none' stroke='rgba(168,197,160,0.07)' stroke-width='1'/%3E%3Ccircle cx='200' cy='400' r='220' fill='none' stroke='rgba(168,197,160,0.05)' stroke-width='1'/%3E%3Ccircle cx='200' cy='400' r='160' fill='none' stroke='rgba(168,197,160,0.04)' stroke-width='1'/%3E%3C/svg%3E") center / cover no-repeat;
  }
  
   .page-hero-badge {
    display: inline-flex; align-items: center; gap: 0.5rem;
    background: rgba(168,197,160,0.15);
    border: 1px solid rgba(168,197,160,0.3);
    color: var(--mint);
    padding: 0.4rem 1rem;
    border-radius: 100px;
    font-size: 0.78rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-bottom: 1.5rem;
    font-weight: 500;
  }

  .page-hero-badge::before { content: '✦'; font-size: 0.6rem; }
  
  
  .doc-photo {
  width: 90px; height: 90px;
  border-radius: 50%;
  margin: 0 auto 1rem;
  border: 3px solid var(--gold);
  overflow: hidden;
  position: relative;
}
.doc-photo img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: top center;
  display: block;
  filter: saturate(0.85) brightness(0.95);
}
/* Green-tinted avatar fallback shown via ::after if img fails */
.doc-photo-fallback {
  width: 90px; height: 90px;
  border-radius: 50%; margin: 0 auto 1rem;
  border: 3px solid var(--gold);
  display: flex; align-items: center; justify-content: center;
  font-family: 'Poppins', serif;
  font-size: 2rem; font-weight: 700;
  background: linear-gradient(135deg, var(--sage), var(--forest));
  color: var(--mint);
}

  
  
  /* ===== FOOTER ===== */
  footer {
    background: #111f16;
    padding: 2.5rem 5%;
    display: flex; align-items: center; justify-content: space-between;
    flex-wrap: wrap; gap: 1rem;
  }

  .footer-logo-wrap {
    display: flex;
    align-items: center;
    gap: 0.75rem;
  }

  .footer-logo {
    font-family: 'Poppins', serif;
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--cream);
  }

  .footer-logo span { color: var(--gold-light); }

  footer p { font-size: 0.8rem; color: rgba(245,240,232,0.35); }

  .footer-tagline {
    font-size: 0.78rem;
    color: var(--mint);
    letter-spacing: 0.08em;
  }

  /* ===== SCROLL ANIMATION ===== */
  .reveal {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity 0.65s ease, transform 0.65s ease;
  }

  .reveal.visible {
    opacity: 1;
    transform: translateY(0);
  }
  
  
  /* ===== RESPONSIVE ===== */

  /* --- Hamburger Button (hidden on desktop) --- */
  .nav-hamburger {
    display: none;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 6px;
    z-index: 200;
  }

  .nav-hamburger span {
    display: block;
    width: 24px;
    height: 2px;
    background: var(--cream);
    border-radius: 2px;
    transition: all 0.3s ease;
  }

  .nav-hamburger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .nav-hamburger.open span:nth-child(2) { opacity: 0; }
  .nav-hamburger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

  /* --- Tablet: 768px – 1024px --- */
  @media (max-width: 1024px) {

  }

  /* --- Large Mobile / Small Tablet: up to 900px --- */
  @media (max-width: 900px) {
    /* Nav: hide links, show hamburger */
    .nav-hamburger { display: flex; }

    .nav-links {
      display: none;
      flex-direction: column;
      gap: 0;
      position: fixed;
      top: 68px;
      left: 0; right: 0;
      background: rgba(26, 61, 43, 0.98);
      backdrop-filter: blur(12px);
      padding: 1.2rem 5% 2rem;
      border-bottom: 1px solid rgba(168,197,160,0.2);
      z-index: 99;
    }

    .nav-links.open { display: flex; }

    .nav-links li { border-bottom: 1px solid rgba(168,197,160,0.1); }
    .nav-links li:last-child { border-bottom: none; margin-top: 0.5rem; }

    .nav-links a {
      display: block;
      padding: 0.85rem 0;
      font-size: 0.95rem;
    }

    .nav-cta {
      display: inline-block;
      text-align: center;
      width: 100%;
      padding: 0.75rem 1.2rem !important;
      margin-top: 0.4rem;
    }

  }

  /* --- Mobile: up to 600px --- */
  @media (max-width: 600px) {
    section { padding: 60px 5%; }

    /* Nav */
    nav { padding: 0 4%; }

    .nav-logo { font-size: 1.1rem; }

    /* Footer */
    footer {
      flex-direction: column;
      text-align: center;
      align-items: center;
      padding: 2rem 5%;
    }
  }

  /* --- Small Mobile: up to 400px --- */
  @media (max-width: 400px) {
    .nav-logo { font-size: 0.95rem; }
  }