critcal css




/* ================================
   Patriot Property Pros
   Critical CSS — Above the Fold
   Scope: Header, Hero, Hero CTAs, Mobile Menu
   ================================ */

/* Base */
html,
body {
  margin: 0;
  padding: 0;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  color: #0f172a;
  background-color: #ffffff;
}

/* Slight rounding on primary header bar */
.ast-primary-header-bar {
  border-radius: 15px !important;
}

/* ================================
   HERO: Universal Cover Styles
   Applies to: .ppp-hero-lcp, .is-light, .wp-duotone-unset-1,
   and default alignfull heroes used as page/post heroes
   ================================ */

/* Hero container */
.wp-block-cover.ppp-hero-lcp,
.wp-block-cover.is-light,
.wp-block-cover.wp-duotone-unset-1 {
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  min-height: 520px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  position: relative;
}

/* Hero background image */
.wp-block-cover.ppp-hero-lcp img,
.wp-block-cover.is-light img,
.wp-block-cover.wp-duotone-unset-1 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 80%;
}

/* Dim overlay for these variants */
.wp-block-cover.ppp-hero-lcp .has-background-dim,
.wp-block-cover.ppp-hero-lcp .has-background-dim-20,
.wp-block-cover.is-light .has-background-dim,
.wp-block-cover.is-light .has-background-dim-20,
.wp-block-cover.wp-duotone-unset-1 .has-background-dim,
.wp-block-cover.wp-duotone-unset-1 .has-background-dim-20 {
  background-color: rgba(0, 0, 0, 0.25);
}

/* Default alignfull hero overlay + stacking */
div.wp-block-cover.alignfull.is-style-default .wp-block-cover__inner-container {
  position: relative !important;
  z-index: 2 !important;
}

div.wp-block-cover.alignfull.is-style-default::before,
div.wp-block-cover.alignfull.is-style-default .wp-block-cover__background {
  background-color: rgba(0,0,0,0.45) !important;
  z-index: 1 !important;
}

/* Hero headings — force white + consistent */
.wp-block-cover.ppp-hero-lcp h1,
.wp-block-cover.ppp-hero-lcp h2,
.wp-block-cover.is-light h1,
.wp-block-cover.is-light h2,
.wp-block-cover.wp-duotone-unset-1 h1,
.wp-block-cover.wp-duotone-unset-1 h2,
div.wp-block-cover.alignfull.is-style-default .wp-block-cover__inner-container h1 {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-align: center;
  font-size: clamp(34px, 3vw + 1rem, 56px);
  font-family: var(--ast-global-heading-font-family);
  font-weight: var(--ast-global-heading-font-weight);
  line-height: var(--ast-global-heading-line-height);
  font-style: var(--ast-global-heading-font-style);
  letter-spacing: var(--ast-global-heading-letter-spacing);
  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.6);
  margin: 0 0 10px;
}

/* Global H1 fallback for cover blocks */
.wp-block-cover h1 {
  font-size: 56px !important;
}

@media (max-width: 1024px) {
  .wp-block-cover h1 {
    font-size: 42px !important;
  }
}

@media (max-width: 468px) {
  .wp-block-cover h1 {
    font-size: 32px !important;
  }
}

/* Hero paragraphs — white, centered */
.wp-block-cover.ppp-hero-lcp p,
.wp-block-cover.is-light p,
.wp-block-cover.wp-duotone-unset-1 p,
div.wp-block-cover.alignfull.is-style-default .wp-block-cover__inner-container p {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-align: center;
  font-size: 18px;
  max-width: 900px;
  margin: 0 auto 1.5rem;
  font-family: var(--ast-global-body-font-family);
  font-weight: var(--ast-global-body-font-weight);
  line-height: var(--ast-global-body-line-height);
}

/* Hero buttons container */
.wp-block-cover.ppp-hero-lcp .wp-block-buttons,
.wp-block-cover.is-light .wp-block-buttons,
.wp-block-cover.wp-duotone-unset-1 .wp-block-buttons,
div.wp-block-cover.alignfull.is-style-default .wp-block-cover__inner-container .wp-block-buttons {
  display: flex;
  justify-content: center;
  gap: 12px;
}

/* Hero buttons — base shape + typography */
.wp-block-cover.ppp-hero-lcp .wp-block-button__link,
.wp-block-cover.is-light .wp-block-button__link,
.wp-block-cover.wp-duotone-unset-1 .wp-block-button__link,
div.wp-block-cover.alignfull.is-style-default .wp-block-cover__inner-container .wp-block-button__link {
  border-radius: 8px !important;
  padding: 12px 32px !important;
  font-family: var(--ast-global-button-font-family) !important;
  font-weight: var(--ast-global-button-font-weight) !important;
  line-height: var(--ast-global-button-line-height) !important;
  text-decoration: none !important;
  border: none !important;
  box-shadow: none !important;
  transition: all 0.2s ease !important;
}

/* Hero button colors — Patriot Navy */
.wp-block-cover.ppp-hero-lcp .wp-block-button__link.has-primary-background-color,
.wp-block-cover.is-light .wp-block-button__link.has-primary-background-color,
.wp-block-cover.wp-duotone-unset-1 .wp-block-button__link.has-primary-background-color,
div.wp-block-cover.alignfull.is-style-default .wp-block-cover__inner-container .wp-block-button__link.has-primary-background-color {
  background-color: #002147 !important;
  color: #ffffff !important;
}

/* Hero button colors — Patriot Red */
.wp-block-cover.ppp-hero-lcp .wp-block-button__link.has-vivid-red-background-color,
.wp-block-cover.is-light .wp-block-button__link.has-vivid-red-background-color,
.wp-block-cover.wp-duotone-unset-1 .wp-block-button__link.has-vivid-red-background-color,
div.wp-block-cover.alignfull.is-style-default .wp-block-cover__inner-container .wp-block-button__link.has-vivid-red-background-color {
  background-color: #BF0A30 !important;
  color: #ffffff !important;
}

/* Hero button colors — White outline */
.wp-block-cover.ppp-hero-lcp .wp-block-button__link.has-white-background-color,
.wp-block-cover.is-light .wp-block-button__link.has-white-background-color,
.wp-block-cover.wp-duotone-unset-1 .wp-block-button__link.has-white-background-color,
div.wp-block-cover.alignfull.is-style-default .wp-block-cover__inner-container .wp-block-button__link.has-white-background-color {
  background-color: #ffffff !important;
  color: #002147 !important;
  border: 2px solid #002147 !important;
}

/* Hero button hover */
.wp-block-cover.ppp-hero-lcp .wp-block-button__link:hover,
.wp-block-cover.is-light .wp-block-button__link:hover,
.wp-block-cover.wp-duotone-unset-1 .wp-block-button__link:hover,
div.wp-block-cover.alignfull.is-style-default .wp-block-cover__inner-container .wp-block-button__link:hover {
  opacity: 0.9 !important;
  transform: translateY(-2px) !important;
}

/* ================================
   MOBILE-ONLY: MENU & HEADER TWEAKS
   ================================ */

@media (max-width: 768px) {
  /* Fullscreen mobile menu panel */
  .ast-header-break-point .ast-mobile-header-content .ast-builder-menu-mobile {
    background-color: #002147 !important;
    color: #ffffff !important;
    height: 100vh !important;
    width: 100vw !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: column !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    z-index: 999999 !important;
    padding: 0 !important;
    margin: 0 !important;
    text-align: center !important;
  }

  /* Mobile menu list layout */
  .ast-header-break-point .ast-mobile-header-content .main-header-menu {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  /* Mobile menu links */
  .ast-header-break-point .ast-mobile-header-content .menu-link {
    color: #ffffff !important;
    font-family: var(--ast-global-heading-font-family, inherit) !important;
    font-size: 28px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    line-height: 2 !important;
    text-align: center !important;
    transition: color 0.25s ease-in-out !important;
    padding: 8px 0 !important;
  }

  .ast-header-break-point .ast-mobile-header-content .menu-link:hover,
  .ast-header-break-point .ast-mobile-header-content .current-menu-item > .menu-link {
    color: #BF0A30 !important;
  }

  /* Submenu links */
  .ast-header-break-point .ast-mobile-header-content .sub-menu .menu-link {
    font-size: 22px !important;
    font-weight: 500 !important;
    opacity: 0.9 !important;
    padding-left: 20px !important;
  }

  /* Hide dropdown arrows */
  .ast-header-break-point .ast-mobile-header-
  
  
  
  
  /* Closing CTA override: make final button Patriot Red inside dark blue CTA */
.wp-block-group[style*="background-color:#1b3a61"]
  .wp-block-buttons .wp-block-button:last-child .wp-block-button__link {
  background-color: #BF0A30 !important; /* Patriot Red */
  color: #ffffff !important;
  border: none !important;
}
