/* ========= Breezy Homepage Full-Bleed (Astra) ========= */

/* Target ONLY the homepage body class */
.home .site-content,
.home .ast-container,
.home .content-area,
.home .entry-content,
.home .site-main,
.home article,
.home .ast-article-single {
  max-width: none !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Remove the default Astra spacing around page content */
.home .ast-container {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Hide the "Homepage" title if it shows */
.home .entry-header,
.home h1.entry-title {
  display: none !important;
}

/* Our split wrapper */
.breezy-home-split{
  position: relative;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  line-height: 0;
  overflow: hidden;
}

/* Image fills the viewport width without cropping */
.breezy-home-img{
  width: 100%;
  height: auto;
  display: block;
}

/* Click zones */
.breezy-home-link{
  position: absolute;
  top: 0;
  height: 100%;
  width: 50%;
  display: block;
  z-index: 5;
}

/* Left/Right */
.breezy-home-link-left{ left: 0; }
.breezy-home-link-right{ right: 0; }

/* Optional: cursor + subtle hover glow (desktop) */
@media (hover:hover) and (pointer:fine){
  .breezy-home-link-left:hover{
    box-shadow: inset 0 0 0 9999px rgba(0,0,0,.10);
  }
  .breezy-home-link-right:hover{
    box-shadow: inset 0 0 0 9999px rgba(0,0,0,.10);
  }
}

/* Mobile: keep image visible and clickable */
@media (max-width: 768px){
  .breezy-home-link{
    width: 50%;
  }
}
/* === FULL-BLEED BACKGROUND BEHIND HEADER (HOMEPAGE ONLY) === */
.home body,
.home #page,
.home .site,
.home .site-content {
  background: radial-gradient(1200px 600px at 15% 10%, rgba(216,178,90,.14), transparent 60%),
              radial-gradient(900px 500px at 85% 25%, rgba(167,112,255,.18), transparent 55%),
              linear-gradient(180deg, #0b0616, #160a2b 40%, #2a0f4d) !important;
}
/* === TRANSPARENT HEADER ON HOMEPAGE === */
.home header.site-header,
.home .ast-primary-header-bar,
.home .ast-primary-header {
  background: transparent !important;
  border-bottom: none !important;
}
/* === FULL WIDTH HEADER === */
.home .ast-container,
.home .ast-primary-header-bar .ast-container {
  max-width: none !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
}
/* Nav hover polish */
.home .main-header-menu a:hover {
  color: #f2da8a !important;
}
/* Hero glow depth */
.breezy-hero {
  position: relative;
}
.breezy-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 30% 40%, rgba(216,178,90,.12), transparent 60%);
  pointer-events: none;
}/* ========= FIX ASTRA MOBILE MENU (full height + no white gap) ========= */

/* 1) Make the off-canvas drawer fill the screen */
.ast-header-break-point .ast-mobile-popup-drawer,
.ast-header-break-point .ast-mobile-popup-content,
.ast-header-break-point .ast-mobile-popup-inner,
.ast-header-break-point .ast-mobile-popup-content-inner {
  height: 100vh !important;
  max-height: 100vh !important;
}

/* 2) Apply Breezy gradient background to the entire drawer (kills white area) */
.ast-header-break-point .ast-mobile-popup-drawer,
.ast-header-break-point .ast-mobile-popup-content {
  background: radial-gradient(1200px 600px at 15% 10%, rgba(216,178,90,.14), transparent 60%),
              radial-gradient(900px 500px at 85% 25%, rgba(167,112,255,.18), transparent 55%),
              linear-gradient(180deg, #0b0616, #160a2b 40%, #2a0f4d) !important;
}

/* 3) Ensure inner area scrolls instead of creating empty space */
.ast-header-break-point .ast-mobile-popup-content-inner{
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;
  padding: 18px 18px 28px !important;
}

/* 4) Remove excess top padding/margins that push content down */
.ast-header-break-point .ast-mobile-popup-header,
.ast-header-break-point .ast-mobile-popup-content-inner > *:first-child{
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* 5) Style the menu list */
.ast-header-break-point .main-header-menu,
.ast-header-break-point .ast-nav-menu {
  background: transparent !important;
  margin: 14px 0 0 !important;
  padding: 0 !important;
}

/* Menu links: readable + luxe */
.ast-header-break-point .main-header-menu a,
.ast-header-break-point .ast-nav-menu a {
  color: rgba(255,255,255,.92) !important;
  font-weight: 700 !important;
  letter-spacing: .02em;
  padding: 14px 10px !important;
}

/* Optional: subtle divider between items */
.ast-header-break-point .main-header-menu > li,
.ast-header-break-point .ast-nav-menu > li {
  border-bottom: 1px solid rgba(255,255,255,.10) !important;
}

/* 6) Fix close (X) visibility */
.ast-header-break-point .ast-mobile-popup-close,
.ast-header-break-point .ast-mobile-popup-close svg {
  color: #f2da8a !important;
  fill: #f2da8a !important;
}

/* 7) Mobile logo sizing so it doesn't feel tiny */
.ast-header-break-point .site-branding img,
.ast-header-break-point .custom-logo {
  max-height: 46px !important;
  width: auto !important;
}/* ===== Breezy Mobile Off-Canvas Menu Fix (Astra) ===== */

/* 1) Make the slide-out menu background match your brand */
.ast-header-break-point .ast-mobile-popup-drawer,
.ast-header-break-point .ast-mobile-popup-drawer .ast-mobile-popup-inner{
  background:
    radial-gradient(900px 500px at 15% 10%, rgba(216,178,90,.14), transparent 60%),
    radial-gradient(700px 420px at 85% 25%, rgba(167,112,255,.18), transparent 55%),
    linear-gradient(180deg, #0b0616, #160a2b 40%, #2a0f4d) !important;
}

/* 2) Force menu text to be visible + luxe */
.ast-header-break-point .ast-mobile-popup-drawer a{
  color: #ffffff !important;
  font-weight: 700;
  letter-spacing: .04em;
}

/* 3) Gold hover + current page */
.ast-header-break-point .ast-mobile-popup-drawer a:hover,
.ast-header-break-point .ast-mobile-popup-drawer .current-menu-item > a,
.ast-header-break-point .ast-mobile-popup-drawer .current_page_item > a{
  color: #F2DA8A !important;
}

/* 4) Clean up the weird “blank white rows” look */
.ast-header-break-point .ast-mobile-popup-drawer .ast-nav-menu,
.ast-header-break-point .ast-mobile-popup-drawer .ast-nav-menu li,
.ast-header-break-point .ast-mobile-popup-drawer .ast-nav-menu li a{
  background: transparent !important;
}

/* 5) Make items look intentional (spacing + soft dividers) */
.ast-header-break-point .ast-mobile-popup-drawer .ast-nav-menu li a{
  padding: 16px 18px !important;
  font-size: 18px !important;
  border-bottom: 1px solid rgba(255,255,255,.12) !important;
}

/* 6) Center the menu items (optional, but looks high-end) */
.ast-header-break-point .ast-mobile-popup-drawer .ast-nav-menu li{
  text-align: center;
}

/* 7) Fix the close button so it stays visible on dark bg */
.ast-header-break-point .ast-mobile-popup-drawer .ast-mobile-popup-close{
  color: #F2DA8A !important;
}/* ===============================
   ABOUT PAGE: remove white band (mobile header + page bg)
   Targets body class "page-about"
================================ */

/* 1) Make the mobile header bar dark (kills the white strip) */
@media (max-width: 921px){
  body.page-about .site-header,
  body.page-about .ast-primary-header-bar,
  body.page-about .ast-mobile-header-wrap .ast-primary-header-bar{
    background: #0b0616 !important; /* deep plum */
    border-bottom: 1px solid rgba(255,255,255,.10) !important;
  }

  /* Optional: tighten header height a bit */
  body.page-about .ast-primary-header-bar{
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }

  /* Make the hamburger + icons gold */
  body.page-about .menu-toggle,
  body.page-about .ast-button-wrap .menu-toggle{
    color: #f2da8a !important;
  }
  body.page-about .menu-toggle svg,
  body.page-about .ast-button-wrap .menu-toggle svg{
    fill: #f2da8a !important;
  }
}

/* 2) Make the About page background match your brand (no random white behind content) */
body.page-about,
body.page-about .site-content{
  background:
    radial-gradient(1200px 600px at 15% 10%, rgba(216,178,90,.14), transparent 60%),
    radial-gradient(900px 500px at 85% 25%, rgba(167,112,255,.18), transparent 55%),
    linear-gradient(180deg, #0b0616, #160a2b 40%, #2a0f4d) !important;
}

/* 3) If Astra is adding white "card" backgrounds, make them transparent */
body.page-about.ast-separate-container .ast-article-single,
body.page-about.ast-separate-container .ast-article-post,
body.page-about .content-area .site-main{
  background: transparent !important;
}
/* ================================
   ABOUT PAGE (page-id-237) - REMOVE WHITE / MATCH BRAND
   ================================ */

/* 1) Kill any white page wrapper background on About */
.page-id-237,
.page-id-237 body,
.page-id-237 .site,
.page-id-237 #page,
.page-id-237 #content,
.page-id-237 .site-content,
.page-id-237 .ast-container,
.page-id-237 .content-area,
.page-id-237 .entry-content,
.page-id-237 .site-main,
.page-id-237 article,
.page-id-237 .ast-article-single{
  background: #0b0616 !important;
}

/* 2) Make the mobile header area NOT white */
.page-id-237 .site-header,
.page-id-237 .ast-primary-header-bar,
.page-id-237 .ast-mobile-header-wrap,
.page-id-237 .ast-mobile-header-content,
.page-id-237 .ast-main-header-wrap{
  background: linear-gradient(180deg, #0b0616, #160a2b 55%, #2a0f4d) !important;
  border: 0 !important;
}

/* 3) Fix the “row” behind logo/menu that turns white on mobile */
@media (max-width: 921px){
  .page-id-237 .ast-builder-grid-row-container,
  .page-id-237 .ast-builder-grid-row,
  .page-id-237 .site-header-section{
    background: transparent !important;
  }
}

/* 4) Off-canvas menu panel + overlay (so it doesn’t open on beige/white) */
.page-id-237 .ast-mobile-popup-inner,
.page-id-237 .ast-mobile-popup-content,
.page-id-237 .ast-mobile-popup-drawer,
.page-id-237 .ast-mobile-popup-drawer .ast-builder-layout-element{
  background: linear-gradient(180deg, #0b0616, #160a2b 55%, #2a0f4d) !important;
  color: #ffffff !important;
}

/* 5) Mobile menu links readable + luxe divider */
.page-id-237 .ast-mobile-popup-inner a,
.page-id-237 .ast-mobile-popup-inner .menu-link{
  color: rgba(255,255,255,.92) !important;
}
.page-id-237 .ast-mobile-popup-inner .menu-item{
  border-bottom: 1px solid rgba(216,178,90,.22) !important;
}

/* 6) Hamburger + close icon gold */
.page-id-237 .ast-button-wrap .menu-toggle .ast-icon,
.page-id-237 .ast-mobile-popup-close,
.page-id-237 .ast-mobile-popup-close .ast-icon{
  color: #d8b25a !important;
  fill: #d8b25a !important;
}

/* 7) Optional: remove any default Astra “page header” block background */
.page-id-237 .ast-page-title-bar,
.page-id-237 .ast-page-builder-template .ast-page-title-bar{
  background: transparent !important;
}/* Fix top white space on mobile (first section/pagetitle gap) */
@media (max-width: 767px){

  /* Make sure the page background isn't showing white anywhere */
  html, body { background: #0b0616 !important; }

  /* Remove top spacing from the first Elementor section on the page */
  .elementor-page .elementor-section-wrap > .elementor-section:first-child,
  .elementor-page .elementor > .elementor-section:first-child{
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  /* If the page title/header block is adding extra padding */
  .elementor-page-title,
  .page-header,
  .entry-header{
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  /* Remove any default top margin on the first heading that can create a “gap” */
  .elementor-page h1:first-child,
  .elementor-page .elementor-widget-heading:first-child h1{
    margin-top: 0 !important;
  }
}/* =========================
   FORCE REMOVE MOBILE TOP GAP
   ========================= */
@media (max-width: 767px){

  /* Kill any white background bleed */
  html, body {
    background-color: #0b0616 !important;
  }

  /* Remove ALL top spacing injected by theme */
  body,
  #page,
  #content,
  .site,
  .site-content,
  .content-area,
  .site-main {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  /* Astra / generic page header spacing */
  .ast-container,
  .ast-container-fluid,
  .ast-plain-container,
  .ast-page-builder-template {
    padding-top: 0 !important;
    margin-top: 0 !important;
  }

  /* Elementor first section hard reset */
  .elementor,
  .elementor-section-wrap,
  .elementor-section:first-child {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  /* If a page title or header block exists invisibly */
  .entry-header,
  .page-header,
  .elementor-page-title {
    display: none !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Mobile admin bar offset fix (THIS is often the culprit) */
  body.admin-bar {
    margin-top: 0 !important;
  }

  /* Pull the first visible section up under the header */
  .elementor > .elementor-section:first-child {
    position: relative;
    top: -12px;
  }
}/* ======================================
   HARD FIX: MOBILE HEADER WHITE GAP
   ====================================== */
@media (max-width: 767px){

  /* Force header background to dark */
  header,
  .site-header,
  .ast-primary-header,
  .ast-mobile-header-wrap,
  .ast-header-break-point .main-header-bar {
    background: #0b0616 !important;
  }

  /* Kill reserved header spacing */
  .ast-header-break-point body,
  .ast-header-break-point .site-content,
  .ast-header-break-point #content,
  .ast-header-break-point .site-main {
    padding-top: 0 !important;
    margin-top: 0 !important;
  }

  /* Remove phantom spacer below header */
  .ast-header-break-point .main-header-bar,
  .ast-header-break-point .ast-primary-header-bar {
    margin-bottom: 0 !important;
  }

  /* FORCE first Elementor section to hug header */
  .ast-header-break-point .elementor-section:first-child {
    margin-top: -20px !important;
    padding-top: 0 !important;
  }

  /* If page title exists but invisible */
  .ast-header-break-point .ast-page-title-bar {
    display: none !important;
  }
}/* ======================================
   REMOVE THIN WHITE LINE UNDER MOBILE HEADER
   ====================================== */
@media (max-width: 767px){

  /* Remove header bottom borders/dividers */
  .ast-header-break-point .main-header-bar,
  .ast-header-break-point .ast-primary-header-bar,
  .ast-header-break-point .ast-mobile-header-wrap {
    border-bottom: none !important;
    box-shadow: none !important;
  }

  /* Remove any pseudo dividers */
  .ast-header-break-point .main-header-bar:after,
  .ast-header-break-point .ast-primary-header-bar:after {
    display: none !important;
    content: none !important;
  }
}