/*
 Theme Name:   GPI Defense
 Theme URI:    https://gpidefense.com
 Description:  A custom child theme for GPI Defense built on Divi.
 Author:       Jameson Ellis
 Author URI:   https://gpidefense.com
 Template:     Divi
 Version:      1.0.0
*/

/* =========================================================
   GPI Defense Transparent Header
   Glass Effect On Scroll
   ========================================================= */

/* Default transparent state */
#main-header {
  background: transparent !important;
  box-shadow: none !important;
  border-bottom: none !important;
  transition:
    background 0.25s ease,
    backdrop-filter 0.25s ease,
    box-shadow 0.25s ease;
}

/* Sticky / scrolled state */
#main-header.et-fixed-header {
  background: rgba(8,10,12,0.42) !important;
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);

  box-shadow:
    0 0.125rem 0.875rem rgba(0,0,0,0.28) !important;

  border-bottom:
    1px solid rgba(255,255,255,0.05) !important;
}



/* Align Divi Pixel active menu brackets with menu text */
#top-menu li a {
  line-height: 1 !important;
}

#top-menu li a span,
#top-menu li a:before,
#top-menu li a:after {
  vertical-align: middle !important;
}

/* Divi Pixel bracket correction */
#top-menu li a .dp-menu-bracket,
#top-menu li a .dipi-menu-bracket,
#top-menu li a .dipi_active_bracket,
#top-menu li a .dipi-menu-active {
  position: relative !important;
  top: -1px !important;
}







/* =========================================================
   Tactical Glass
   Non-sticky reusable glass effect
   ========================================================= */

/* 
   Required:
   isolation keeps pseudo-element effects contained.
   Child selector keeps content above blur/distortion layers.
*/

.tactical-glass-class {
  position: relative;
  overflow: hidden;
  background: transparent !important;

  box-shadow:
    0 0.125rem 0.875rem rgba(0, 0, 0, 0.28),
    inset 0 0 0 0.0625rem rgba(255,255,255,0.06),
    inset 0 0.0625rem 0 rgba(255,255,255,0.08),
    inset 0 -0.0625rem 0 rgba(255,255,255,0.025);

  border: 0.0625rem solid rgba(255,255,255,0.055);
}

/* Distortion + blur layer */
.tactical-glass-class::before {
  content: "";
  position: absolute;

  /* Extend past the edges so distortion artifacts are clipped away */
  inset: -1.5rem;

  pointer-events: none;
	
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);

  filter: url(#de-glass-distortion);
  background: rgba(8,10,12,0.25);

  z-index: 1;
}

/* Shine / edge lighting layer */
.tactical-glass-class::after {
  content: "";
  position: absolute;
  inset: 0;

  pointer-events: none;

  background:
    linear-gradient(
      to bottom,
      rgba(255,255,255,0.08) 0rem,
      rgba(255,255,255,0.035) 0.125rem,
      rgba(255,255,255,0.00) 0.5rem
    ),
    linear-gradient(
      to right,
      rgba(255,255,255,0.06) 0rem,
      rgba(255,255,255,0.025) 0.125rem,
      rgba(255,255,255,0.00) 0.5rem
    ),
    linear-gradient(
      to left,
      rgba(255,255,255,0.04) 0rem,
      rgba(255,255,255,0.018) 0.125rem,
      rgba(255,255,255,0.00) 0.5rem
    );

  box-shadow:
    inset 0 0.0625rem 0 rgba(255,255,255,0.08),
    inset 0 0 0 0.0625rem rgba(255,255,255,0.045),
    inset 0 -0.625rem 1.125rem rgba(255,255,255,0.01),
    inset 0 0.625rem 1.125rem rgba(0,0,0,0.08);

  z-index: 2;
}

/* Keep inner content above the effect */
.tactical-glass-class > * {
  position: relative !important;
  z-index: 3 !important;
}







/* =========================================================
   Mobile Fixed Header
   Replaces Divi Pixel fixed mobile header behavior
   ========================================================= */

@media only screen and (max-width: 980px) {

  /* Keeps the mobile header fixed at the top */
  #main-header,
  .et-l--header {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    z-index: 9999 !important;
  }

  /* Removes Divi's default spacing above the page */
  #page-container,
  #main-content,
  body {
    padding-top: 0 !important;
    margin-top: 0 !important;
  }

  /* Limits horizontal overflow without fighting vertical touch scroll */
  html,
  body {
    max-width: 100% !important;
  }

  #page-container {
    overflow-x: clip !important;
    max-width: 100% !important;
  }

  /* Adds controlled spacing inside hero under the fixed transparent header */
  .mobile-hero-under-header {
    height: 720px !important;
    min-height: 720px !important;
    padding-top: 120px !important;
    margin-top: 0 !important;
    background-size: cover !important;
    background-position: center center !important;
  }

}