/* Header: make logo band first, menu row second */
header.header.container-header {
  display: flex;          /* override grid */
  flex-direction: column; /* stack rows */
}

/* Force logo block (2nd grid-child) to the top */
header.header.container-header > .grid-child:nth-child(2) {
  order: 1;
  background: var(--template-special-color); /* your colored band */
}

/* Force menu block (container-below-top) under it */
header.header.container-header > .container-below-top {
  order: 2;
  background: #fff;
  border-top: 1px solid rgba(0,0,0,.08);
}

/* Make menu text black on white */
header.header.container-header > .container-below-top a {
  color: #111 !important;
}

header.header.container-header > .container-below-top a:hover,
header.header.container-header > .container-below-top a:focus,
header.header.container-header > .container-below-top .active > a,
header.header.container-header > .container-below-top a[aria-current="page"] {
  color: #111 !important;
  text-decoration: underline;
}
header.header.container-header > .container-below-top {
  padding-top: 0.125rem;
  padding-bottom: 0.125rem;
}
@media (max-width: 767px) {
  header.header.container-header > .container-below-top .navbar-collapse {
    background: #fff;
  }
}
header.header.container-header > .container-below-top .nav-link {
  line-height: 1.2;
}
/* ===== Menu spacing + optical alignment under logo band ===== */

/* Menu row: keep it tight */
header.header.container-header > .container-below-top{
  padding: 0 !important;
  margin: 0 !important;
}

/* Navbar: reduce default Bootstrap padding/height */
header.header.container-header > .container-below-top .navbar{
  padding: .12rem 0 !important;
  min-height: auto !important;
}

/* UL can add margins in some setups */
header.header.container-header > .container-below-top ul.mod-menu{
  margin: 0 !important;
  padding: 0 !important;
}

/* Links: tighter vertical rhythm */
header.header.container-header > .container-below-top .nav-link,
header.header.container-header > .container-below-top a{
  padding: .18rem .75rem !important;   /* vertical, horizontal */
  line-height: 1.15 !important;
}

/* Optional: if you want the menu closer to the band, pull it up slightly */
header.header.container-header > .container-below-top{
  margin-top: -2px;   /* try -1px to -4px if desired */
}
/* Cassiopeia: reduce typography on Contact component pages */
body.com-contact h1 {
  font-size: 1.8rem;
  line-height: 1.2;
  margin-bottom: .75rem;
}

body.com-contact h2 {
  font-size: 1.25rem;
  line-height: 1.25;
  margin-top: 1.25rem;
  margin-bottom: .5rem;
}

/* Reduce general text + form labels on the contact page */
body.com-contact .com-contact,
body.com-contact .com-contact label,
body.com-contact .com-contact .form-control,
body.com-contact .com-contact .form-text {
  font-size: 1rem;
}

/* Optional: shrink the "Send an Email" legend/text */
body.com-contact .com-contact legend,
body.com-contact .com-contact .form-title {
  font-size: 1.05rem;
}
/* Rapsey Press video embed */
.rp-video {
  max-width: 1200px;
  margin: 2rem auto;
}

.rp-video video {
  width: 100%;
  height: auto;
  display: block;
}
/* Black background only on video page */
body.video-page {
  background-color: #000;
  color: #eaeaea;
}

/* Ensure content area also stays black */
body.video-page main,
body.video-page .container-component,
body.video-page .site-grid {
  background-color: #000;
}

/* Video polish */
body.video-page video {
  background-color: #000;
}
/* Mobile menu toggle: force it visible */
.navbar-toggler {
  border: 0;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Cassiopeia uses an icon span; make it visible */
.navbar-toggler .icon-menu {
  display: inline-block;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Ensure the icon has contrast (adjust if your menu row is white) */
header.header.container-header .container-below-top .navbar-toggler .icon-menu {
  color: #111 !important;
}

/* If your toggle is in a dark header area, use this instead */
/*
header.header.container-header .navbar-toggler .icon-menu {
  color: #fff !important;
}
*/

/* Make sure the toggle sits above any header overlays */
header.header.container-header .navbar {
  position: relative;
  z-index: 10;
}
/* ---- Fix: eliminate the "second" blue band on wide screens ---- */

/* Blue belongs to the full-width header container */
header.header.container-header {
  background: var(--template-special-color) !important;
}

/* Logo row should NOT carry its own blue background */
header.header.container-header > .grid-child:nth-child(2) {
  background: transparent !important;
}

/* Keep the menu row white */
header.header.container-header > .container-below-top {
  background: #fff !important;
  border-top: 1px solid rgba(0,0,0,.08);
}
/* === HARD FIX: remove stray header background on wide screens === */

/* 1) Make the actual header wrapper blue */
header.header.container-header.full-width {
  background: var(--template-special-color) !important;
}

/* 2) Cassiopeia often applies background to the INNER container-header div */
header.header.container-header.full-width .container-header {
  background: transparent !important;
}

/* 3) Kill any template pseudo-element / overlay */
header.header.container-header.full-width::before,
header.header.container-header.full-width::after,
header.header.container-header.full-width .container-header::before,
header.header.container-header.full-width .container-header::after {
  background: transparent !important;
  content: none !important;
}

/* 4) Keep logo row transparent so only the full-width header supplies blue */
header.header.container-header.full-width > .grid-child {
  background: transparent !important;
}

/* 5) Keep menu row white */
header.header.container-header.full-width > .container-below-top {
  background: #fff !important;
  border-top: 1px solid rgba(0,0,0,.08);
}
/* Make the white menu background span full viewport width */
header.header.container-header.full-width > .container-below-top{
  background: #fff !important;
  border-top: 1px solid rgba(0,0,0,.08);

  /* breakout to full width */
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

/* Keep the actual menu items aligned to your normal page width */
header.header.container-header.full-width > .container-below-top nav.navbar{
  max-width: var(--site-grid-width, 1200px);
  margin: 0 auto;
}
/* Full-bleed white band behind the menu row (reliable in Cassiopeia) */
header.header.container-header .grid-child.container-below-top {
  background: #fff !important;
  position: relative;
  z-index: 5;

  /* paint full width without changing layout */
  box-shadow: 0 0 0 100vmax #fff;
  clip-path: inset(0 -100vmax);
  border-top: 1px solid rgba(0,0,0,.08);
}

/* Keep header band blue */
header.header.container-header {
  background: var(--template-special-color) !important;
}
