/* =======
   OVERLAYS
   ======== */


/* Overlay background when body has overlay-open */
body.overlay-open {
   overflow: hidden; }
      
body.overlay-open .overlay-bkg {
   isplay: block; }
      
      
     /* Overlay form container - hidden by default */
     #newsletter-overlay-form {
       position: fixed;
       top: 0; left: 0; right: 0; bottom: 0;
       width: 100vw;
       height: 100vh;
       display: flex;
       align-items: center;
       justify-content: center;
       z-index: 1000;
       opacity: 0;
       pointer-events: none;
       transition: opacity 0.3s;
     }
     
   
      
      /* Show overlay when active */
      #newsletter-overlay-form.active {
        opacity: 1;
        display: flex !important;
        pointer-events: auto;
      }
      
      /* Overlay inner content */
      #newsletter-overlay-form .overlay-content {
        background: var(--color__gray__05);
        color: #222;
        padding: 2rem 2.5rem;
        margin: 0 3rem;
        border-radius: 8px;
        box-shadow: 0 8px 32px rgba(0,0,0,0.22);
        max-width: 460px;
        width: 100%;
        position: relative;
        max-height: 90%;
        overflow-y: auto; }
      
      /* Close button styling */
      #newsletter-overlay-close {
        position: absolute;
        top: 0.8rem;
        right: 1rem;
        font-size: 1.5rem;
        background: none;
        border: none;
        cursor: pointer;
        color: #888;
        transition: color 0.2s;
      }
      #newsletter-overlay-close:hover {
        color: #222;
      }
      
      
      
/* Overlay BKG */
.overlay-bkg {
   position: absolute;
   top: 0; left: 0;
   width: 100%;
   height: 100%;
   z-index: -10;
   pointer-events: none;
   opacity: 0;
   backdrop-filter: blur(0px);
   background: transparent;
   transition: opacity 0.4s, backdrop-filter 0.4s, background 0.4s, z-index 0s 0.4s; }
  
/* Overlay visible (nav open) */
body.nav-open .overlay-bkg,
body.overlay-open .overlay-bkg {
   z-index: 19;
   pointer-events: auto;
   opacity: 1;
   backdrop-filter: blur(3px);
   background: var(--color__navy__1__alpha95);
   transition: opacity 0.4s, backdrop-filter 0.4s, background 0.4s, z-index 0s; }
 
 body.overlay-open .overlay-bkg {
   z-index: 99; }
 
  
 body.nav-closing .overlay-bkg {
   z-index: 19;
   pointer-events: auto;
   opacity: 0;
   backdrop-filter: blur(0px);
   background: transparent;
   transition: opacity 0.4s, backdrop-filter 0.4s, background 0.4s, z-index 0s 0.4s; }
    
 
 
 /* Overlay Structure */
 .overlay-content__header {
    margin-bottom: var(--spacing__sm); }
 
 .overlay-content__header h2 {
  margin-bottom: .5em; }