/* =========================================================
   HEADER & NAVIGATION ADJUSTMENTS
   ========================================================= */

/* 1. Prevent the navigation from having a solid white block background */
.main-navigation,
#site-navigation,
.main-navigation ul,
#site-navigation ul,
.main-navigation li,
#site-navigation li,
.inside-navigation {
  background: transparent !important;
}

/* 2. Style the white-background logo into an elegant framed emblem */
.site-logo,
.custom-logo-link,
.site-branding img {
  background: #ffffff !important;
  padding: 6px 8px !important;
  border-radius: 8px !important;
  border: 1.5px solid #f0c040 !important; /* Gold frame matching theme */
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5), 0 0 10px rgba(240, 192, 64, 0.2) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 52px !important; /* Keep within the 72px header height */
  width: auto !important;
  margin-top: 4px !important;
  margin-bottom: 4px !important;
  box-sizing: border-box !important;
  transition: transform 0.3s ease !important;
}

.site-logo:hover,
.custom-logo-link:hover {
  transform: scale(1.03) !important;
}

/* Ensure the image inside scales perfectly */
.site-logo img,
.custom-logo,
.site-branding img {
  max-height: 38px !important;
  height: 38px !important;
  width: auto !important;
  object-fit: contain !important;
  display: block !important;
}

/* 3. Fix Site Title Color (make it vibrant gold instead of dark grey) */
.site-title,
.site-title a {
  color: #f0c040 !important;
  text-shadow: 0 0 12px rgba(240, 192, 64, 0.4) !important;
}


/* =========================================================
   THREE-COLUMN LAYOUT FIX (Robust & Multi-Block Compatible)
   ========================================================= */

/* Desktop layout constraints to prevent horizontal overlaps */
@media (min-width: 901px) {
  /* 1. Ensure the container behaves as a strict flex row with gap */
  .wp-block-columns,
  .gb-grid-wrapper {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important; /* stretch ensures equal-height columns */
    gap: 2rem !important;
  }

  /* 2. Constrain column widths strictly to prevent overlapping */
  .wp-block-column,
  .gb-grid-column,
  .wp-block-columns > *,
  .gb-grid-wrapper > * {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 30% !important;
    max-width: 33% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }
}

/* 3. Reset vertical spacing to completely eliminate text overlapping */
.wp-block-column > *,
.gb-grid-column > *,
.wp-block-columns > * > *,
.gb-grid-wrapper > * > * {
  margin-top: 0 !important;
  margin-bottom: 1.5rem !important;
}

.wp-block-column > *:last-child,
.gb-grid-column > *:last-child {
  margin-bottom: 0 !important;
}

/* 4. Heading Clearance (Forces headings to render cleanly below preceding elements) */
h1, h2, h3, h4, h5, h6,
.wp-block-column h1, .wp-block-column h2, .wp-block-column h3, .wp-block-column h4,
.gb-grid-column h1, .gb-grid-column h2, .gb-grid-column h3, .gb-grid-column h4 {
  clear: both !important;
  display: block !important;
}


/* =========================================================
   COLUMN SPECIFIC STYLES (Boxes, Backgrounds, Borders)
   ========================================================= */

/* Left & Right Column Containers */
.wp-block-columns > :first-child,
.gb-grid-wrapper > :first-child,
.wp-block-columns > :last-child,
.gb-grid-wrapper > :last-child {
  justify-content: center;
  padding: 2.2rem 1.8rem !important;
  background: rgba(11, 13, 26, 0.65) !important;
  border: 1px solid rgba(255, 215, 90, 0.16) !important;
  border-radius: 14px !important;
  box-sizing: border-box !important;
}

/* Middle Column — Individual Portal Boxes */
.wp-block-columns > :nth-child(2) .wp-block-group,
.gb-grid-wrapper > :nth-child(2) .wp-block-group,
.gb-grid-wrapper > :nth-child(2) .gb-container {
  padding: 1.25rem 1.5rem !important;
  background: rgba(24, 29, 53, 0.85) !important;
  border: 1px solid rgba(255, 215, 90, 0.18) !important;
  border-radius: 10px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0.6rem !important;
  transition: border-color 0.3s ease, transform 0.3s ease !important;
}

.wp-block-columns > :nth-child(2) .wp-block-group:hover,
.gb-grid-wrapper > :nth-child(2) .gb-container:hover {
  border-color: rgba(255, 215, 90, 0.45) !important;
  transform: translateY(-3px) !important;
}


/* =========================================================
   BUTTON STYLING & OVERRIDES
   ========================================================= */

/* Button layout flow to prevent collapsing/floating overlaps */
.wp-block-buttons {
  display: flex !important;
  flex-wrap: wrap !important;
  float: none !important;
  clear: both !important;
  margin-top: 1.2rem !important;
  margin-bottom: 2.2rem !important; /* Space beneath button before next block */
}

.wp-block-button {
  float: none !important;
  display: inline-block !important;
  margin: 0 !important;
}

/* Clean typography and structure reset for all column buttons */
.wp-block-column .wp-block-button__link,
.wp-block-column .button,
.wp-block-column .btn,
.gb-grid-column .wp-block-button__link,
.gb-grid-column .button,
.gb-grid-column .btn,
.gb-button {
  display: inline-block !important;
  font-family: var(--font-heading), 'Cinzel', serif !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  border-radius: 4px !important;
  padding: 0.65rem 1.4rem !important;
  transition: opacity 0.3s ease, transform 0.3s ease, background 0.3s ease, border-color 0.3s ease !important;
  text-align: center !important;
  width: auto !important;
}

/* Filled Gold Buttons — Left & Right Column Actions */
.wp-block-columns > :first-child .wp-block-button__link,
.wp-block-columns > :first-child .button,
.wp-block-columns > :first-child .btn,
.gb-grid-wrapper > :first-child .gb-button,
.wp-block-columns > :last-child .wp-block-button__link,
.wp-block-columns > :last-child .button,
.wp-block-columns > :last-child .btn,
.gb-grid-wrapper > :last-child .gb-button {
  background: linear-gradient(135deg, #f0c040, #b8860b) !important;
  color: #0b0d1a !important;
  border: none !important;
  box-shadow: 0 3px 14px rgba(240, 192, 64, 0.35) !important;
}

.wp-block-columns > :first-child .wp-block-button__link:hover,
.wp-block-columns > :last-child .wp-block-button__link:hover {
  opacity: 0.9 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 5px 18px rgba(240, 192, 64, 0.5) !important;
}

/* Gold Outline Buttons — Middle Column Portal Actions */
.wp-block-columns > :nth-child(2) .wp-block-button__link,
.wp-block-columns > :nth-child(2) .button,
.wp-block-columns > :nth-child(2) .btn,
.gb-grid-wrapper > :nth-child(2) .gb-button {
  background: transparent !important;
  color: #f0c040 !important;
  border: 1px solid rgba(240, 192, 64, 0.5) !important;
  padding: 0.45rem 1rem !important;
  font-size: 0.72rem !important;
}

.wp-block-columns > :nth-child(2) .wp-block-button__link:hover,
.gb-grid-wrapper > :nth-child(2) .gb-button:hover {
  background: rgba(240, 192, 64, 0.1) !important;
  border-color: #f0c040 !important;
}


/* =========================================================
   FOOTER STYLE FIXES
   ========================================================= */

/* Force the white copyright bar to blend into the theme */
.site-footer,
#colophon,
.site-info,
.footer-copy {
  background: #070911 !important;
  color: #9b95b0 !important;
  border-top: 1px solid rgba(255, 215, 90, 0.18) !important;
}

.site-info a,
.footer-copy a {
  color: #f0c040 !important;
}

.site-info a:hover {
  color: #fde68a !important;
}


/* =========================================================
   BASE STYLES
   ========================================================= */

body {
  background: #050816 url('images/stars-bg.png') repeat;
  background-size: cover;
  color: #f5f3ff;
  font-family: "Cormorant Garamond", serif;
  cursor: url('images/wand-cursor.png') 0 0, auto;
}


/* =========================================================
   STICKY FOOTER FIX (Pushes footer to the bottom of the page)
   ========================================================= */

html, body {
  height: 100%;
  margin: 0;
  padding: 0;
}

/* Force the GeneratePress wrapper to span at least the full viewport height */
#page {
  display: flex !important;
  flex-direction: column !important;
  min-height: 100vh !important;
}

/* Force the main content area to grow and fill any remaining vertical space */
#content {
  flex-grow: 1 !important;
  display: flex !important;
  flex-direction: column !important;
}

/* Prevent the footer from shrinking and align it to the bottom */
.site-footer,
#colophon {
  margin-top: auto !important;
  flex-shrink: 0 !important;
}