/* Logo refresh 2026: align site accents with new vivid green + gold logo */

/* Footer: deep green derived from the new accent, replacing the old neutral gray */
.site-footer {
  background-color: #284012;
}

/* Buttons that still use the old muted-green accent hardcoded in page content */
a.wp-block-button__link[style*="8aab74" i],
a.wp-block-button__link[style*="89aa73" i] {
  background-color: #66ac27 !important;
  color: #303030 !important;
}

/* "Book a Tour" buttons: gold as a secondary accent, matching the logo's lettering */
a.wp-block-button__link[href="https://franklinchildrenscentre.com/contact/"] {
  background-color: #ffca02 !important;
  border-color: #ffca02 !important;
  color: #303030 !important;
}
a.wp-block-button__link[href="https://franklinchildrenscentre.com/contact/"]:hover,
a.wp-block-button__link[href="https://franklinchildrenscentre.com/contact/"]:focus {
  background-color: #e6b600 !important;
  border-color: #e6b600 !important;
  color: #303030 !important;
}

/* Instagram callout: gradient badge, pulse ring, and caption under the social icons */
.menu-social-container {
  position: relative !important;
  padding-bottom: 30px !important;
}
#menu-social .menu-item a[href*="instagram.com"] {
  background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%) !important;
  box-shadow: 0 0 0 0 rgba(214, 36, 159, 0.5);
  transform: scale(1.12);
  transition: transform 0.2s ease;
  animation: fcc-insta-pulse 2.4s infinite;
}
#menu-social .menu-item a[href*="instagram.com"]:hover {
  transform: scale(1.22);
}
#menu-social .menu-item a[href*="instagram.com"] svg {
  filter: drop-shadow(0 1px 1px rgba(0,0,0,0.3));
}
@keyframes fcc-insta-pulse {
  0% { box-shadow: 0 0 0 0 rgba(214, 36, 159, 0.45); }
  70% { box-shadow: 0 0 0 12px rgba(214, 36, 159, 0); }
  100% { box-shadow: 0 0 0 0 rgba(214, 36, 159, 0); }
}
.menu-social-container::after {
  content: "\1F4F8  Keep up to date with our Centre on Instagram!";
  position: absolute !important;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  white-space: nowrap;
  font-size: 0.85rem;
  font-weight: 700;
  color: #d6249f;
}
@media (max-width: 500px) {
  .menu-social-container { padding-bottom: 42px !important; }
  .menu-social-container::after {
    white-space: normal;
    width: 240px;
    text-align: center;
    font-size: 0.78rem;
  }
}