/* ======================================================
   Riddler's Project - Main Menu Pages
   Shared visual layer for the seven header menu pages only.
   ====================================================== */

:root {
  --rp-menu-page-bg:
    linear-gradient(180deg, #2f2e2a 0%, #252422 32%, #1f1e1c 100%);
  --rp-menu-surface:
    linear-gradient(145deg, rgba(50, 49, 45, 0.96) 0%, rgba(30, 29, 27, 0.985) 100%);
  --rp-menu-surface-soft:
    linear-gradient(145deg, rgba(44, 43, 40, 0.86) 0%, rgba(26, 25, 23, 0.94) 100%);
  --rp-menu-line: rgba(185, 155, 94, 0.28);
  --rp-menu-line-strong: rgba(185, 155, 94, 0.42);
  --rp-menu-gold: #c6a15b;
  --rp-menu-gold-soft: #d6c39a;
  --rp-menu-text: #e8e0d1;
  --rp-menu-muted: rgba(224, 224, 224, 0.74);
  --rp-menu-radius: 24px;
  --rp-menu-page-top: 56px;
  --rp-menu-hero-width: 940px;
  --rp-menu-hero-min-height: 0px;
  --rp-menu-shadow:
    0 22px 54px rgba(0, 0, 0, 0.34),
    0 0 24px rgba(185, 155, 94, 0.07),
    inset 0 1px 0 rgba(255, 245, 201, 0.04);
}

.rp-streams-page,
.rp-calendar-page,
.rp-about-project-page,
.rp-install-guide-page,
.rp-registration-page,
.rp-contact-page {
  position: relative !important;
  left: 50% !important;
  right: 50% !important;
  width: 100vw !important;
  max-width: 100vw !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
  box-sizing: border-box !important;
  overflow-x: clip !important;
  padding: var(--rp-menu-page-top) 22px 82px !important;
  background: var(--rp-menu-page-bg) !important;
  color: var(--rp-menu-text) !important;
}

.rp-streams-shell,
.rp-calendar-shell,
.rp-about-shell,
.rp-install-guide-shell,
.rp-contact-shell {
  width: min(1180px, 100%) !important;
  max-width: 1180px !important;
  margin: 0 auto !important;
}

.rp-contact-shell {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.rp-registration-page {
  margin-top: calc(var(--rp-menu-page-top) * -1) !important;
  padding-top: calc(var(--rp-menu-page-top) * 2) !important;
}

@supports selector(body:has(.rp-registration-page)) {
  body:has(.scoutline-hero),
  body:has(.rp-scoutline-page),
  body:has(.rp-streams-page),
  body:has(.rp-calendar-page),
  body:has(.rp-about-project-page),
  body:has(.rp-install-guide-page),
  body:has(.rp-registration-page),
  body:has(.rp-contact-page) {
    background: #1f1e1c !important;
  }

  body:has(.scoutline-hero) .site-main,
  body:has(.rp-scoutline-page) .site-main,
  body:has(.rp-streams-page) .site-main,
  body:has(.rp-calendar-page) .site-main,
  body:has(.rp-about-project-page) .site-main,
  body:has(.rp-install-guide-page) .site-main,
  body:has(.rp-registration-page) .site-main,
  body:has(.rp-contact-page) .site-main,
  body:has(.scoutline-hero) #main,
  body:has(.rp-scoutline-page) #main,
  body:has(.rp-streams-page) #main,
  body:has(.rp-calendar-page) #main,
  body:has(.rp-about-project-page) #main,
  body:has(.rp-install-guide-page) #main,
  body:has(.rp-registration-page) #main,
  body:has(.rp-contact-page) #main,
  body:has(.scoutline-hero) .site-content,
  body:has(.rp-scoutline-page) .site-content,
  body:has(.rp-streams-page) .site-content,
  body:has(.rp-calendar-page) .site-content,
  body:has(.rp-about-project-page) .site-content,
  body:has(.rp-install-guide-page) .site-content,
  body:has(.rp-registration-page) .site-content,
  body:has(.rp-contact-page) .site-content,
  body:has(.scoutline-hero) .ct-container-full,
  body:has(.rp-scoutline-page) .ct-container-full,
  body:has(.rp-streams-page) .ct-container-full,
  body:has(.rp-calendar-page) .ct-container-full,
  body:has(.rp-about-project-page) .ct-container-full,
  body:has(.rp-install-guide-page) .ct-container-full,
  body:has(.rp-registration-page) .ct-container-full,
  body:has(.rp-contact-page) .ct-container-full,
  body:has(.rp-registration-page) #main-container,
  body:has(.rp-registration-page) .ct-main,
  body:has(.rp-registration-page) .ct-container,
  body:has(.rp-registration-page) .content-area,
  body:has(.rp-registration-page) article,
  body:has(.rp-registration-page) .page,
  body:has(.rp-registration-page) .entry-card {
    background: var(--rp-menu-page-bg) !important;
  }

  body:has(.scoutline-hero) .entry-content,
  body:has(.rp-scoutline-page) .entry-content,
  body:has(.rp-streams-page) .entry-content,
  body:has(.rp-calendar-page) .entry-content,
  body:has(.rp-about-project-page) .entry-content,
  body:has(.rp-install-guide-page) .entry-content,
  body:has(.rp-registration-page) .entry-content,
  body:has(.rp-contact-page) .entry-content,
  body:has(.scoutline-hero) .wp-block-post-content,
  body:has(.rp-scoutline-page) .wp-block-post-content,
  body:has(.rp-streams-page) .wp-block-post-content,
  body:has(.rp-calendar-page) .wp-block-post-content,
  body:has(.rp-about-project-page) .wp-block-post-content,
  body:has(.rp-install-guide-page) .wp-block-post-content,
  body:has(.rp-registration-page) .wp-block-post-content,
  body:has(.rp-contact-page) .wp-block-post-content {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
}

.scoutline-hero,
.rp-streams-hero,
.rp-calendar-hero,
.rp-about-hero,
.rp-install-hero,
.rp-registration-hero,
.rp-contact-hero {
  position: relative !important;
  isolation: isolate !important;
  overflow: visible !important;
  display: block !important;
  box-sizing: border-box !important;
  width: min(var(--rp-menu-hero-width), 100%) !important;
  max-width: var(--rp-menu-hero-width) !important;
  min-height: var(--rp-menu-hero-min-height) !important;
  margin: 0 auto 30px !important;
  padding: 0 0 24px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(185, 155, 94, 0.34) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  text-align: center !important;
}

.scoutline-hero {
  margin-top: var(--rp-menu-page-top) !important;
}

.rp-scoutline-page .scoutline-hero {
  margin-top: 0 !important;
}

.scoutline-hero .scoutline-kicker {
  display: none !important;
}

.scoutline-hero::before,
.rp-streams-hero::before,
.rp-calendar-hero::before,
.rp-about-hero::before,
.rp-install-hero::before,
.rp-registration-hero::before,
.rp-contact-hero::before {
  content: "" !important;
  display: none !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  background:
    linear-gradient(90deg, rgba(255, 245, 201, 0), rgba(255, 245, 201, 0.055), rgba(255, 245, 201, 0)),
    linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0)) !important;
}

.scoutline-hero > *,
.rp-streams-hero > *,
.rp-calendar-hero > *,
.rp-about-hero > *,
.rp-install-hero > *,
.rp-registration-hero > *,
.rp-contact-hero > * {
  position: relative;
  z-index: 1;
}

.scoutline-kicker {
  display: block !important;
  width: auto !important;
  min-height: 0 !important;
  margin: 0 0 15px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  text-align: center !important;
}

.scoutline-kicker p,
.scoutline-kicker span,
.scoutline-kicker h1,
.scoutline-kicker h2,
.scoutline-kicker h3,
.scoutline-kicker h4,
.scoutline-kicker .elementor-heading-title,
.rp-streams-kicker,
.rp-calendar-kicker,
.rp-about-hero .rp-about-kicker,
.rp-install-hero .rp-install-kicker,
.rp-registration-kicker,
.rp-contact-kicker {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 32px !important;
  margin: 0 0 15px !important;
  padding: 7px 14px !important;
  border: 1px solid rgba(185, 155, 94, 0.30) !important;
  border-radius: 999px !important;
  background: rgba(185, 155, 94, 0.06) !important;
  color: var(--rp-menu-gold-soft) !important;
  font-family: "Inter", sans-serif !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  line-height: 1.1 !important;
  letter-spacing: 0 !important;
  text-transform: uppercase !important;
  text-align: center !important;
  box-shadow: inset 0 1px 0 rgba(255, 245, 201, 0.04) !important;
}

.scoutline-title h1,
.scoutline-title h2,
.scoutline-title .elementor-heading-title,
.rp-streams-title,
.rp-calendar-title,
.rp-about-hero h1,
.rp-install-hero h1,
.rp-registration-hero h1,
.rp-contact-hero h1 {
  max-width: 900px !important;
  margin: 0 auto 14px !important;
  color: var(--rp-menu-gold) !important;
  font-family: "Chakra Petch", "Inter", sans-serif !important;
  font-size: clamp(31px, 3vw, 46px) !important;
  font-weight: 800 !important;
  line-height: 1.08 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  text-align: center !important;
  text-shadow: 0 12px 28px rgba(0, 0, 0, 0.32) !important;
}

.scoutline-lead,
.scoutline-lead p,
.rp-streams-subtitle,
.rp-calendar-subtitle,
.rp-about-hero p,
.rp-install-hero p,
.rp-registration-hero-lead,
.rp-contact-lead,
.rp-contact-sublead {
  max-width: 820px !important;
  margin: 0 auto !important;
  color: var(--rp-menu-muted) !important;
  font-family: "Inter", sans-serif !important;
  font-size: clamp(15px, 1vw, 17px) !important;
  font-style: normal !important;
  font-weight: 600 !important;
  line-height: 1.66 !important;
  text-align: center !important;
}

.rp-contact-sublead {
  margin-top: 10px !important;
}

body .rp-scoutline-page .scoutline-hero,
body .rp-streams-page .rp-streams-shell > .rp-streams-hero,
body .rp-calendar-page .rp-calendar-shell > .rp-calendar-hero,
body .rp-about-project-page .rp-about-shell > .rp-about-hero,
body .rp-install-guide-page .rp-install-guide-shell > .rp-install-hero,
body .rp-registration-page > .rp-registration-hero,
body .rp-contact-page .rp-contact-shell > .rp-contact-hero {
  overflow: visible !important;
  display: block !important;
  width: min(var(--rp-menu-hero-width), 100%) !important;
  max-width: var(--rp-menu-hero-width) !important;
  min-height: 0 !important;
  margin: 0 auto 30px !important;
  padding: 0 0 24px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(185, 155, 94, 0.34) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  text-align: center !important;
}

body .rp-streams-page .rp-streams-shell > .rp-streams-hero::before,
body .rp-calendar-page .rp-calendar-shell > .rp-calendar-hero::before,
body .rp-about-project-page .rp-about-shell > .rp-about-hero::before,
body .rp-install-guide-page .rp-install-guide-shell > .rp-install-hero::before,
body .rp-registration-page > .rp-registration-hero::before,
body .rp-contact-page .rp-contact-shell > .rp-contact-hero::before {
  display: none !important;
}

body .rp-streams-page .rp-streams-shell > .rp-streams-hero > *,
body .rp-calendar-page .rp-calendar-shell > .rp-calendar-hero > *,
body .rp-about-project-page .rp-about-shell > .rp-about-hero > *,
body .rp-install-guide-page .rp-install-guide-shell > .rp-install-hero > *,
body .rp-registration-page > .rp-registration-hero > *,
body .rp-contact-page .rp-contact-shell > .rp-contact-hero > * {
  position: relative !important;
  z-index: 1 !important;
}

body .rp-streams-page .rp-streams-title,
body .rp-calendar-page .rp-calendar-title,
body .rp-about-project-page .rp-about-hero h1,
body .rp-install-guide-page .rp-install-hero h1,
body .rp-registration-page > .rp-registration-hero h1,
body .rp-contact-page .rp-contact-hero h1 {
  margin: 0 auto 14px !important;
}

.rp-registration-hero-grid,
.rp-streams-hero-details {
  width: min(var(--rp-menu-hero-width), 100%) !important;
  max-width: var(--rp-menu-hero-width) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.rp-registration-hero-grid {
  margin-top: -8px !important;
  margin-bottom: 34px !important;
}

.rp-streams-hero-details {
  margin-top: -10px !important;
  margin-bottom: 36px !important;
  text-align: center !important;
}

.rp-streams-note,
.rp-streams-filters {
  border-color: rgba(185, 155, 94, 0.24) !important;
  background: rgba(26, 25, 23, 0.48) !important;
  box-shadow: inset 0 1px 0 rgba(255, 245, 201, 0.035) !important;
}

.rp-streams-note {
  margin: 0 auto 16px !important;
}

.rp-streams-filters {
  margin: 18px auto 0 !important;
}

.scoutline-featured,
.scoutline-card,
.scoutline-more-box,
.rp-streams-featured,
.rp-stream-card,
.rp-calendar-card,
.rp-calendar-empty,
.rp-about-quick-card,
.rp-about-section,
.rp-about-editor-box,
.rp-install-quick-card,
.rp-install-step,
.rp-install-troubleshooting,
.rp-install-help-box,
.rp-registration-hero-card,
.rp-reg-card,
.rp-contact-form-card {
  border-color: var(--rp-menu-line) !important;
  background: var(--rp-menu-surface-soft) !important;
  box-shadow:
    0 16px 40px rgba(0, 0, 0, 0.26),
    0 0 18px rgba(185, 155, 94, 0.055),
    inset 0 1px 0 rgba(255, 245, 201, 0.035) !important;
}

.rp-contact-form-card {
  width: min(760px, 100%) !important;
  margin-top: 28px !important;
}

.rp-calendar-card,
.rp-stream-card,
.scoutline-card,
.rp-registration-hero-card,
.rp-about-quick-card,
.rp-install-quick-card {
  transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease !important;
}

.rp-calendar-card:hover,
.rp-stream-card:hover,
.scoutline-card:hover,
.rp-registration-hero-card:hover,
.rp-about-quick-card:hover,
.rp-install-quick-card:hover {
  border-color: var(--rp-menu-line-strong) !important;
  box-shadow:
    0 18px 42px rgba(0, 0, 0, 0.30),
    0 0 22px rgba(185, 155, 94, 0.085),
    inset 0 1px 0 rgba(255, 245, 201, 0.04) !important;
}

.rp-calendar-card-content h2,
.rp-streams-featured-content h2,
.rp-stream-card-body h3,
.rp-about-quick-card h2,
.rp-about-section h2,
.rp-about-editor-box h2,
.rp-install-quick-card h2,
.rp-install-step h2,
.rp-install-troubleshooting h2,
.rp-contact-form-head h2,
.rp-reg-card-head h2,
.rp-registration-hero-card h2 {
  color: var(--rp-menu-gold) !important;
}

.rp-about-kicker,
.rp-install-kicker,
.rp-reg-card-eyebrow,
.rp-contact-form-head span,
.rp-streams-badge,
.rp-streams-filter-label {
  color: var(--rp-menu-gold-soft) !important;
  letter-spacing: 0 !important;
}

.rp-streams-btn,
.rp-calendar-btn,
.rp-about-btn--gold,
.rp-install-btn--gold,
.rp-registration-page .registration-form button[type="submit"],
.rp-contact-page .fluentform button.ff-btn-submit,
.rp-contact-page .fluentform .ff-btn-submit,
.rp-contact-page [class*="fluentform_wrapper"] button.ff-btn-submit,
.rp-contact-page [class*="fluentform_wrapper"] .ff-btn-submit {
  border-color: rgba(185, 155, 94, 0.68) !important;
  background: linear-gradient(180deg, #d2b86f 0%, #b99b5e 52%, #8d6f3a 100%) !important;
  color: #252422 !important;
  letter-spacing: 0 !important;
  box-shadow:
    0 10px 22px rgba(0, 0, 0, 0.24),
    inset 0 1px 0 rgba(255, 245, 201, 0.22) !important;
}

.rp-streams-btn:hover,
.rp-calendar-btn:hover,
.rp-about-btn--gold:hover,
.rp-install-btn--gold:hover,
.rp-registration-page .registration-form button[type="submit"]:hover,
.rp-contact-page .fluentform button.ff-btn-submit:hover,
.rp-contact-page .fluentform .ff-btn-submit:hover,
.rp-contact-page [class*="fluentform_wrapper"] button.ff-btn-submit:hover,
.rp-contact-page [class*="fluentform_wrapper"] .ff-btn-submit:hover {
  border-color: rgba(214, 195, 154, 0.76) !important;
  background: linear-gradient(180deg, #dbc57d 0%, #c3a564 52%, #967743 100%) !important;
  color: #211d14 !important;
  transform: translateY(-1px) !important;
  filter: none !important;
}

@media (max-width: 767px) {
  .rp-streams-page,
  .rp-calendar-page,
  .rp-about-project-page,
  .rp-install-guide-page,
  .rp-registration-page,
  .rp-contact-page {
    padding: 36px 14px 58px !important;
  }

  .rp-registration-page {
    margin-top: -36px !important;
    padding-top: 72px !important;
  }

  .scoutline-hero,
  .rp-streams-hero,
  .rp-calendar-hero,
  .rp-about-hero,
  .rp-install-hero,
  .rp-registration-hero,
  .rp-contact-hero {
    margin-bottom: 26px !important;
    padding: 0 0 20px !important;
    border-radius: 0 !important;
  }

  .scoutline-hero {
    margin-top: 36px !important;
  }

  .scoutline-title h1,
  .scoutline-title h2,
  .scoutline-title .elementor-heading-title,
  .rp-streams-title,
  .rp-calendar-title,
  .rp-about-hero h1,
  .rp-install-hero h1,
  .rp-registration-hero h1,
  .rp-contact-hero h1 {
    font-size: clamp(28px, 8.2vw, 38px) !important;
    line-height: 1.1 !important;
  }

  .rp-registration-hero-grid {
    margin-top: -4px !important;
    margin-bottom: 28px !important;
  }

  .rp-streams-hero-details {
    margin-top: -4px !important;
    margin-bottom: 30px !important;
  }
}

/* Contact page header compensation:
   Fluent Forms/page CSS shifts the whole menu block slightly down on this page. */
@supports selector(body:has(.rp-contact-page)) {
  body:has(.rp-contact-page) .rp-header-menu-wrap {
    align-items: center !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
    transform: translateY(-5px) !important;
  }

  body:has(.rp-contact-page) .rp-header-menu,
  body:has(.rp-contact-page) .rp-header-menu__list {
    align-items: center !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
    transform: none !important;
  }

  body:has(.rp-contact-page) .rp-header-menu__list > li {
    display: flex !important;
    align-items: center !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    transform: none !important;
  }
}