/* Top VIP banner */
.most_top_bar {
  background-color: #1f8f86;
  text-align: center;
  padding: 12px 10px;
}

/* Region wrapper */
.most_top_bar .region-most-top-bar {
  max-width: 1200px;
  margin: 0 auto;
}

/* Remove default paragraph spacing */
.most_top_bar p {
  margin: 0;
}

/* Link styling */
.most_top_bar a.wp-block-button__link {
  display: inline-block;
  color: #ffffff;
  text-decoration: none;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.4;
  background: transparent;
}

/* Hover effect */
.most_top_bar a.wp-block-button__link:hover {
  text-decoration: underline;
}


/* Header container */
.site-header {
  background: #ffffff;
  padding: 18px 40px;
  border-bottom: 1px solid #eee;
}

/* Main header row */
.site-header .region-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* Logo */
.site-header .site-logo img {
  max-height: 60px;
  width: auto;
  display: block;
}

/* Top menu */
.site-header .menu--top-menu {
  margin-left: auto;
}

.site-header .menu--top-menu .menu {
  display: flex;
  align-items: center;
  gap: 40px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.site-header .menu--top-menu .menu a {
  text-decoration: none;
  font-size: 20px;
  color: #333;
  font-weight: 500;
}

.site-header .menu--top-menu .menu a:hover {
  color: #1f8f86;
}

/* Search form */
.site-header .search-block-form {
  margin-left: 40px;
}

.site-header .search-block-form form {
  display: flex;
  align-items: center;
}

/* Search input */
.site-header .form-search {
  border: 2px solid #1f8f86;
  border-right: none;
  padding: 12px 16px;
  font-size: 16px;
  width: 260px;
  outline: none;
}

/* Search button */
.site-header .form-submit {
  background: #1f8f86;
  border: 2px solid #1f8f86;
  color: #fff;
  padding: 12px 18px;
  cursor: pointer;
  font-size: 16px;
}

.site-header .form-submit:hover {
  background: #16746d;
}













/* =============================================================
   Wellness Mama – Drupal 11 Primary Menu CSS
   Default links: near-black (#1a1a1a)
   Hover / active: teal green (#0f766e)
   ============================================================= */

/* ── CSS Custom Properties (mirrors theme tokens) ─────────── */
:root {
  --wm-color-primary:    #0f766e;   /* teal green  – hover & active */
  --wm-color-secondary:  #ecf4f4;   /* light teal-grey – bar bg     */
  --wm-color-link:       #1a1a1a;   /* near-black  – default links  */
  --wm-color-base:       #ffffff;
  --wm-color-tertiary:   #0d9488;

  --wm-font-outfit:      Outfit, sans-serif;
  --wm-font-size-xs:     18px;   /* x-small preset */

  --wm-fw-medium:        500;
  --wm-fw-regular:       400;

  --wm-lh-medium:        1.5;

  --wm-spacing-xs:       20px;
  --wm-spacing-gap:      30px;
}

/* ── Primary Menu Wrapper ─────────────────────────────────── */
nav.primary-menu {
  background-color: var(--wm-color-secondary);
  border-bottom: 2px solid var(--wm-color-primary);
  padding-top:    12px;
  padding-bottom: 12px;
  width: 100%;
  box-sizing: border-box;
}

/* ── Region / Inner Container ────────────────────────────── */
nav.primary-menu .region.region-primary-menu {
  max-width: 1240px;
  margin-left:  auto;
  margin-right: auto;
  padding-left:  var(--wm-spacing-xs);
  padding-right: var(--wm-spacing-xs);
  box-sizing: border-box;
}

/* ── Block-level Nav element ─────────────────────────────── */
nav.primary-menu .block.block-menu {
  width: 100%;
}

/* Hide the visually-hidden heading (Drupal a11y element) */
nav.primary-menu h2.visually-hidden {
  border:      0;
  clip:        rect(0 0 0 0);
  height:      1px;
  margin:     -1px;
  overflow:    hidden;
  padding:     0;
  position:    absolute;
  width:       1px;
  white-space: nowrap;
}

/* ── Menu List ────────────────────────────────────────────── */
nav.primary-menu ul.menu {
  display:         flex;
  flex-wrap:       wrap;
  justify-content: center;
  align-items:     center;
  list-style:      none;
  margin:          0;
  padding:         0;
  gap:             0;
}

/* ── Menu Items ───────────────────────────────────────────── */
nav.primary-menu ul.menu li.menu-item {
  display:     inline-flex;
  align-items: center;
  margin:      0;
  padding:     0;
}

/* ── Menu Links – default state: near-black ──────────────── */
nav.primary-menu ul.menu li.menu-item a {
  font-family:     var(--wm-font-outfit);
  font-size:       var(--wm-font-size-xs);   /* 18px */
  font-weight:     var(--wm-fw-medium);      /* 500  */
  line-height:     var(--wm-lh-medium);      /* 1.5  */
  color:           var(--wm-color-link);     /* #1a1a1a – near-black */
  text-decoration: none;
  padding:         4px 14px;
  display:         inline-block;
  white-space:     nowrap;
  transition:      color 0.2s ease;
}

/* ── Hover & Focus – teal green ──────────────────────────── */
nav.primary-menu ul.menu li.menu-item a:hover,
nav.primary-menu ul.menu li.menu-item a:focus {
  color:           var(--wm-color-primary);  /* #0f766e teal */
  outline:         none;
  text-decoration: none;
}

nav.primary-menu ul.menu li.menu-item a:focus-visible {
  outline:        2px solid var(--wm-color-primary);
  outline-offset: 2px;
  border-radius:  2px;
}

/* ── Active / Current Page – teal green ──────────────────── */
nav.primary-menu ul.menu li.menu-item a.is-active,
nav.primary-menu ul.menu li.menu-item--active-trail a {
  color:       var(--wm-color-primary);   /* #0f766e teal */
  font-weight: var(--wm-fw-medium);
}

/* Underline indicator on active-trail item */
nav.primary-menu ul.menu li.menu-item--active-trail a {
  text-decoration:       underline;
  text-decoration-color: var(--wm-color-primary);
  text-underline-offset: 3px;
}

/* ── Responsive – Tablet ────────────────────────────────── */
@media (max-width: 1024px) {
  nav.primary-menu ul.menu li.menu-item a {
    padding:   4px 10px;
    font-size: 16px;
  }
}

/* ── Responsive – Small Tablet ──────────────────────────── */
@media (max-width: 768px) {
  nav.primary-menu ul.menu {
    justify-content: flex-start;
  }

  nav.primary-menu ul.menu li.menu-item a {
    padding:   6px 10px;
    font-size: 16px;
  }
}

/* ── Responsive – Mobile ─────────────────────────────────── */
@media (max-width: 480px) {
  nav.primary-menu ul.menu {
    flex-direction: column;
    align-items:    flex-start;
  }

  nav.primary-menu ul.menu li.menu-item {
    width: 100%;
  }

  nav.primary-menu ul.menu li.menu-item a {
    display:       block;
    padding:       10px var(--wm-spacing-xs);
    border-bottom: 1px solid rgba(15, 118, 110, 0.15);
  }
}