/* ================================
   LIGHT GREEN TEXTURED MENU THEME
   ================================ */

/* Light texture background */
.header {
  background:
    linear-gradient(
      rgba(220, 245, 220, 0.95),
      rgba(200, 235, 200, 0.95)
    ),
    repeating-linear-gradient(
      45deg,
      rgba(255,255,255,0.15) 0,
      rgba(255,255,255,0.15) 2px,
      transparent 2px,
      transparent 6px
    );
  border-bottom: 4px solid #7cb342;
  position: relative;
}

/* ================================
   LEAF DECORATION
   ================================ */
.header::before,
.header::after {
  content: "🍃";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  font-size: 38px;
  opacity: 0.5;
  animation: leafFloat 3s ease-in-out infinite;
}

.header::before {
  left: 10px;
}

.header::after {
  right: 10px;
  animation-delay: 1.5s;
}

@keyframes leafFloat {
  0%, 100% {
    transform: translateY(-50%) rotate(0deg);
  }
  50% {
    transform: translateY(-60%) rotate(8deg);
  }
}

/* ================================
   MENU LINKS STYLE
   ================================ */
nav ul li a {
  color: #1b5e20;
  padding: 6px 10px;
  border-radius: 6px;
  transition: all 0.3s ease;
}

nav ul li a:hover {
  background: rgba(124,179,66,0.25);
  box-shadow: 0 0 6px rgba(124,179,66,0.6);
}

/* ================================
   GP TITLE OFFICIAL LOOK
   ================================ */
.gp-title {
  color: #1b5e20;
  text-shadow:
    1px 1px 0 #ffffff,
    2px 2px 3px rgba(0,0,0,0.2);
}

/* ================================
   CENTER ALL H2 HEADINGS
   ================================ */
h2 {
  text-align: center;
  margin-bottom: 25px;
  position: relative;
  color: #1b5e20;
}

/* Decorative underline */
h2::after {
  content: "";
  display: block;
  width: 80px;
  height: 3px;
  background: linear-gradient(to right, #7cb342, #aed581);
  margin: 10px auto 0;
  border-radius: 3px;
}

/* ================================
   MOBILE MENU LOOK
   ================================ */
@media (max-width: 768px) {

  nav {
    background:
      linear-gradient(
        rgba(220, 245, 220, 0.97),
        rgba(200, 235, 200, 0.97)
      );
  }

  nav ul li a {
    font-size: 16px;
    text-align: center;
  }

  .header::before,
  .header::after {
    font-size: 28px;
  }
}