/* =========================================================================
   AgileWoW — Updated style.css (fixes footer semicircle + header/events/footer)
   Replace your site's /assets/css/style.css with this file and hard-refresh
   ========================================================================= */

/* Fix for Font display issue (30ms saving) */
@font-face {
  font-family: 'FontAwesome';
  src: url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2');
  font-weight: normal;
  font-style: normal;
  font-display: swap; /* This is the fix */
}

/* ---------- Base resets ---------- */
*,
*::before,
*::after { box-sizing: border-box; }

/* Remove italics everywhere (requested) */
em, i, .italic, h1 em, h2 em, h3 em { font-style: normal !important; }

/* Basic typography */
body {
  margin: 0;
  font-family: "Open Sans", Arial, sans-serif;
  color: #222;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Images responsive */
img { max-width: 100%; height: auto; display: block; }

/* =============== Header =============== */
/* Force header purple even if inline style sets blue */
.meeta-header-section,
.meeta-header-section.meeta-header-4 {
  background-color: #311a79 !important;
  color: #ffffff !important;
}

/* Navigation center on desktop */
.header-navigation { position: relative; z-index: 200; }
.header-navigation .main-menu {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
.header-navigation .main-menu > li {
  position: relative;
  white-space: nowrap;
  list-style: none !important;
}
.header-navigation .main-menu > li > a {
  display: inline-block !important;
  padding: 18px 16px !important;
  color: #fff !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

/* Submenu: hidden by default, shown on hover (desktop) */
.header-navigation .main-menu li .sub-menu {
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
  min-width: 220px !important;
  background: #ffffff !important;
  color: #1a0a1e !important;
  box-shadow: 0 6px 20px rgba(0,0,0,0.12) !important;
  padding: 8px 0 !important;
  border-radius: 6px !important;
  z-index: 9999 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translateY(6px) !important;
  transition: all 200ms ease !important;
  border-bottom: 3px solid #fc097c !important;
}
.header-navigation .main-menu li:hover > .sub-menu,
.header-navigation .main-menu li:focus-within > .sub-menu {
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(0) !important;
}
.header-navigation .sub-menu li a {
  display: block !important;
  padding: 8px 18px !important;
  color: #1a0a1e !important;
  text-decoration: none !important;
  font-weight: 600 !important;
}
.header-navigation .sub-menu li a:hover { color: #fc097c !important; }

/* Mobile: submenus become static blocks */
@media (max-width: 991px) {
  .header-navigation .main-menu { flex-direction: column !important; align-items: flex-start !important; }
  .header-navigation .sub-menu {
    position: static !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important; border: 0 !important;
  }
  .header-navigation .sub-menu li a { color: #fff !important; padding: 10px 18px !important; }
}

/* =============== Event section (cards) =============== */
.event-section,
.meeta-footer-section .event-section,
.meeta-footer-section .events-wrap {
  width: 100%;
  max-width: 1180px;
  margin: 24px auto;
  box-sizing: border-box;
}

/* white panel only around the event-row */
.meeta-footer-section .events-wrap,
.event-section {
  background: #ffffff !important;
  padding: 28px !important;
  border-radius: 6px !important;
  box-shadow: 0 10px 30px rgba(0,0,0,0.04) !important;
}

/* event-row: centered flex grid with equal-height cards */
.event-section .event-row,
.meeta-footer-section .event-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 28px !important;
  justify-content: center !important;
  align-items: stretch !important; /* equal height cards */
  margin: 0 !important;
  padding: 8px 6px 0 6px !important;
}

/* Card: vertical layout so CTA sits at bottom, consistent card sizing */
.event-section .event-card,
.meeta-footer-section .event-card {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: calc(33.333% - 28px) !important; /* 3 per row */
  min-width: 220px !important;
  max-width: 360px !important;
  padding: 22px !important;
  background: #fff !important;
  border-radius: 8px !important;
  box-shadow: 0 6px 22px rgba(0,0,0,0.06) !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  min-height: 420px !important;
  text-align: center !important;
}

/* 4 across on super-wide */
@media (min-width: 1400px) {
  .event-section .event-card { width: calc(25% - 28px) !important; }
}

/* Images: force square and contain */
.event-section .event-card img,
.meeta-footer-section .event-card img {
  width: 220px !important;
  height: 220px !important;
  object-fit: contain !important;
  object-position: center center !important;
  display: block !important;
  margin: 0 auto 18px !important;
  border-radius: 6px !important;
  background: #fff !important;
  box-shadow: 0 6px 14px rgba(0,0,0,0.06) !important;
  transform: none !important;
  filter: none !important;
}

/* ignore inline width/height on image tags */
.event-section .event-card img[width],
.event-section .event-card img[height],
.meeta-footer-section .event-card img[width],
.meeta-footer-section .event-card img[height] {
  width: 220px !important;
  height: 220px !important;
}

/* Title & CTA inside cards */
.event-section .event-card h3,
.meeta-footer-section .event-card h3 {
  margin: 0 0 12px !important;
  padding: 0 6px !important;
  font-size: 1.15rem !important;
  color: #1a0a1e !important;
  font-weight: 700 !important;
  flex-grow: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
}
.event-section .event-card .cta-button,
.meeta-footer-section .event-card .cta-button,
.event-card a { margin-top: auto !important; color: #0056b3 !important; font-weight: 700 !important; text-decoration: none !important; }

/* Tablet & mobile adjustments */
@media (max-width: 991px) {
  .event-section .event-card { width: calc(50% - 28px) !important; min-height: 380px !important; }
  .event-section .event-card img { width: 180px !important; height: 180px !important; }
}
@media (max-width: 575px) {
  .event-section { margin: 12px !important; padding: 18px !important; }
  .event-section .event-row { gap: 18px !important; }
  .event-section .event-card { width: 92% !important; padding: 16px !important; min-height: auto !important; }
  .event-section .event-card img { width: 150px !important; height: 150px !important; margin-bottom: 12px !important; }
  .event-section .event-card h3 { font-size: 1.05rem !important; }
}

/* =============== Footer =============== */
.meeta-footer-section,
.site-footer,
footer {
  background: #311a79 !important;
  color: #ffffff !important;
  padding: 56px 18px !important;
  box-sizing: border-box;
  text-align: center !important;
  position: relative;
}

/* wrapper */
.meeta-footer-section .container,
.site-footer .footer-inner,
footer .footer-inner {
  max-width: 1180px !important;
  margin: 0 auto !important;
  padding: 0 18px !important;
}

/* footer logo */
.meeta-footer-section .footer-logo { text-align: center !important; margin-bottom: 8px !important; }
.meeta-footer-section .footer-logo img {
  width: 96px !important;
  height: 96px !important;
  object-fit: contain !important;
  border-radius: 8px !important;
  box-shadow: 0 6px 14px rgba(0,0,0,0.25) !important;
  display: inline-block !important;
}

/* social heading & text */
.meeta-footer-section .lgx-footer-single { text-align: center !important; padding: 12px 16px !important; }
.meeta-footer-section .lgx-footer-single .footer-title { font-size: 28px !important; margin: 12px 0 8px !important; font-weight:700 !important; color: #fff !important; }
.meeta-footer-section .lgx-footer-single .text { color: rgba(255,255,255,0.9) !important; margin: 0 0 12px !important; line-height: 1.6 !important; text-align: center !important; }

/* social icons: remove bullets and center */
.meeta-footer-section ul,
.meeta-footer-section ul li,
.meeta-footer-section .lgx-social-footer,
.meeta-footer-section .lgx-social-footer li {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}
.lgx-social-footer {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 18px 0 !important;
}
.lgx-social-footer li a {
  width: 44px !important;
  height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 50% !important;
  background: rgba(255,255,255,0.06) !important;
  color: #ffffff !important;
  text-decoration: none !important;
}
.lgx-social-footer li a:hover { transform: translateY(-3px) !important; background: rgba(255,255,255,0.12) !important; }

/* footer links & copyright */
.meeta-footer-section .footer-links { text-align: center !important; margin-top: 16px !important; margin-bottom: 8px !important; }
.meeta-footer-section .footer-links a { color: #ffffff !important; margin: 0 10px !important; font-weight: 600 !important; text-decoration: none !important; }
.meeta-footer-section .footer-links span { color: rgba(255,255,255,0.6) !important; }
.meeta-footer-section .footer-copyright { margin-top: 10px !important; color: rgba(255,255,255,0.72) !important; font-size: 14px !important; text-align: center !important; }

/* defensive */
.meeta-footer-section ul { list-style: none !important; }

/* =============== Hide decorative semicircle / orphaned divs =============== */
/* Hide the progress-wrap circle and any common decorative curve elements */
.progress-wrap,
.progress-wrap * {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  width: 0 !important;
  overflow: hidden !important;
}

/* Also hide commonly used curve/divider classes if present */
.footer-curve,
.bottom-curve,
.site-divider,
.curve,
.section-divider,
.page-bottom-curve {
  display: none !important;
  visibility: hidden !important;
}

/* If the black semicircle is implemented by a full-width SVG inside a raw div after footer,
   the following very specific rule targets that (safe because it targets only SVGs after footer) */
.meeta-footer-section + div svg,
footer + div svg,
.meeta-footer-section + svg,
footer + svg {
  display: none !important;
  visibility: hidden !important;
}

/* =============== Page title & content headings =============== */
.page-title, .post-title, h1 {
  font-family: "Big Shoulders Display", cursive;
  font-size: 40px;
  font-weight: 900;
  text-align: center;
  margin: 26px 0;
  color: #0f0f0f;
  line-height: 1.06;
}
.post-content h2, .post-content h3, article h2, article h3 {
  text-align: left !important;
  font-family: "Open Sans", Arial, sans-serif !important;
  color: #d64a44 !important;
  font-weight: 700 !important;
  margin-top: 28px !important;
}
.post-content p, .article p { text-align: left !important; }

/* =============== Small utilities =============== */
a:hover { text-decoration: underline; }
button:focus, a:focus { outline: 2px dashed rgba(100,100,255,0.2); outline-offset: 2px; }


/* Fix invisible buttons inside the Past Events blue box */
.past-events-box a,
.past-events-box .btn,
.past-events-box .button {
    color: #ffffff !important;        /* Make link text white */
    font-weight: 600;
}

.past-events-box a:hover,
.past-events-box .btn:hover,
.past-events-box .button:hover {
    color: #ffddaa !important;        /* Light amber hover for good contrast */
}

/* End of file */