html {
  font-size: clamp(14px, 1.2vw, 18px);
}
html, body {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
/* Amazingpandph main CSS (kept tiny) */
.button,button,input[type=submit]{padding:.6rem 1rem;border:1px solid #ccc;border-radius:.5rem;background:#f8f8f8}
.button:hover,button:hover,input[type=submit]:hover{background:#f0f0f0}
.entry-title{line-height:1.2;margin:1rem 0}
.entry-content > * + *{margin-top:1rem}
.breadcrumbs ol{list-style:none;padding:0;display:flex;gap:.5rem;flex-wrap:wrap}
.breadcrumbs a{text-decoration:none}
.menu-toggle{display:none}
@media (max-width: 800px){
  .menu-toggle{display:inline-block}
  #primary-menu{display:none}
  .site-nav[aria-expanded="true"] #primary-menu{display:block}
}

.site-title {
  display: none;
}

.site-description {
  font-size: 1.1rem;
  color: #4CAF50; 
  font-weight: 500;
  text-align: center;
  letter-spacing: 0.5px;
  margin-top: 0.3rem;
  margin-bottom: 1rem;
}


.site-branding {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}


.custom-logo {
  max-height: 80px;
  width: auto;
  border-radius: 12px;
  margin-bottom: 0.5rem;
  transition: transform 0.3s ease;
}

.custom-logo:hover {
  transform: scale(1.05);
}


.site-nav a {
  text-decoration: none;
  color: #333;
  font-weight: 600;
  transition: color 0.3s ease;
}

.site-nav a:hover {
  color: #4CAF50;
}


.skip-link {
  display: none !important;
}


.site-footer {
  text-align: center;
  color: #555;
  font-size: 0.9rem;
}

.site-footer a {
  color: #4CAF50;
  text-decoration: none;
}

.site-footer a:hover {
  color: #0B5FFF;
}
.site-nav {
  display: flex;
  justify-content: center;
  gap: 1.5rem;
  margin-top: 0.5rem;
  list-style: none;
  padding: 0;
}

/* Remove bullets from nav list */
.site-nav ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 1.2rem;
}

/* Nav link style */
.site-nav a {
  text-decoration: none;
  color: #333;
  font-weight: 600;
  font-size: 1rem;
  transition: color 0.3s ease, border-bottom 0.3s ease;
}

.site-nav a:hover {
  color: #4CAF50;
  border-bottom: 2px solid #4CAF50;
}


/* Add a leaf before the text */
.menu-toggle::before {
  content: "🌿";
  font-size: 1.1rem;
	  }
.menu-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  padding: 14px 24px;
  border-radius: 50px;
  border: none;
  font-size: 18px;
  font-weight: 600;
  color: var(--button-color);
  background: var(--button-background);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
  cursor: pointer;
  transition: all 0.25s ease;
}
/* Hover glow */
.menu-toggle:hover {
  background: #2E7D32;
  color: #fff !important;
  transform: translateY(-2px);
}

/* pressed look */
.menu-toggle:active {
  transform: translateY(0);
  filter: brightness(0.95);
}
/* ===== Keep Menu button on top; stack dropdown under it (mobile) ===== */
@media (max-width: 800px) {
  /* Force vertical stacking: button on top, list below */
  .site-nav {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 0 !important;
  }

  /* Give the button breathing room above the list */
  .menu-toggle {
    margin: .25rem 0 .5rem 0;
  }

  /* Dropdown panel centered under the button */
  #primary-menu {
    position: static !important;         /* don't sit beside the button */
    width: min(92%, 520px) !important;   /* centered, nice width */
    margin: 0 auto !important;
    /* animation state (closed) */
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transform: translateY(-6px);
    transition:
      max-height .35s ease,
      opacity .25s ease,
      transform .35s ease;
    list-style: none;
    padding: 0;
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: 12px;
    box-shadow: 0 8px 20px rgba(0,0,0,.06);
  }

  /* Open state (when aria-expanded=true on .site-nav via JS) */
  .site-nav[aria-expanded="true"] #primary-menu {
    max-height: 60vh;
    opacity: 1;
    transform: translateY(0);
  }

  /* Item styles */
  #primary-menu li { border-bottom: 1px solid #f1f5f4; }
  #primary-menu li:last-child { border-bottom: 0; }
  #primary-menu a {
    display: block;
    padding: .9rem 1rem;
    text-decoration: none;
    color: #2f2f2f;
    font-weight: 600;
  }
  #primary-menu a:hover { background: #f4fff6; color: #fff !important; }

  /* Remove the little triangle if you added it earlier */
  #primary-menu::before { display: none !important; }
}

/* Desktop stays inline; hide the button there */
@media (min-width: 801px) {
  .menu-toggle { display: none !important; }
  .site-nav { display: flex; justify-content: center; }
  #primary-menu { display: flex; gap: 1.2rem; list-style: none; padding: 0; margin: .5rem 0 0; }
}

.post-grid{display:grid;gap:1.25rem;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.post-card{border:1px solid #eee;border-radius:.75rem;padding:1rem;background:#fff;transition:box-shadow .2s,transform .2s}
.post-card:hover{box-shadow:0 8px 20px rgba(0,0,0,.06);transform:translateY(-2px)}
.post-card .card-img{width:100%;height:auto;border-radius:.5rem;object-fit:cover}
.post-card .entry-title{margin:.75rem 0 .25rem;font-size:1.15rem;line-height:1.25}
.post-card .entry-title a{text-decoration:none;color:#222}
.post-card .entry-title a:hover{color:#2E7D32}
.post-card .post-meta{color:#666;font-size:.9rem;margin:0 0 .5rem}
.post-card .entry-excerpt{color:#444}
.post-card .button{display:inline-block;padding:.55rem .9rem;border-radius:.6rem;border:1px solid #e5e7eb;background:#f8fafc;text-decoration:none;font-weight:600}
.post-card .button:hover{background:#4CAF50;color:#fff;border-color:#4CAF50}

/* Pull quotes & quotes */
.wp-block-quote {
  border-left: 4px solid var(--fp-green);
  padding: .5rem 1rem;
  color: #1f3b21;
  background: #f4fff6;
  border-radius: .5rem;
}

/* Compact mobile layout */
@media (max-width: 800px) {
  body { font-size: clamp(14px, 3.8vw, 16px); line-height: 1.5; }
  .container { padding-inline: 0.8rem; }

  /* Headings smaller on phones */
  h1, .entry-title { font-size: clamp(1.4rem, 6vw, 1.9rem); margin: .8rem 0 .5rem; }
  h2 { font-size: clamp(1.15rem, 4.8vw, 1.5rem); margin: .7rem 0 .45rem; }
  h3 { font-size: clamp(1rem, 4.2vw, 1.25rem); }

  /* Reduce vertical whitespace */
  main .entry-content > * + * { margin-top: .8rem; }
  section, article, header, footer { padding: .8rem 0; }

  /* Logo + tagline tighter */
  .custom-logo { max-height: 64px; }
  .site-description { font-size: .95rem; margin: .3rem 0 .6rem; }

  /* Card list tighter on home */
  .post-grid { gap: 0.9rem; }
  .post-card { padding: .85rem; }
}

/* Make media never overflow */
img, video, iframe { max-width: 100%; height: auto; border-radius: 8px; }
body { overflow-x: hidden; }