.elementor-kit-442{--e-global-color-primary:#8DB2C1;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-442 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1500px;}.e-con{--container-max-width:1500px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//**
 * SeaMate Global Background Styles for WordPress Theme
 * Apply this CSS globally to give all pages the SeaMate background
 */

/* ===== CSS CUSTOM PROPERTIES ===== */
:root {
  /* Apple Glass Core Colors */
  --glass-bg-primary: #0f1419;
  --glass-bg-secondary: #1a1f24;
  --glass-bg-gradient: linear-gradient(180deg, #0f1419 0%, #1a1f24 25%, #252a2f 50%, #1a1f24 75%, #0f1419 100%);
  --glass-bg-overlay: rgba(15, 20, 25, 0.95);
  --glass-surface: rgba(255, 255, 255, 0.04);
  --glass-surface-hover: rgba(255, 255, 255, 0.08);
  --glass-surface-active: rgba(255, 255, 255, 0.12);
  
  /* Glass Effects */
  --glass-border: rgba(255, 255, 255, 0.08);
  --glass-border-hover: rgba(255, 255, 255, 0.16);
  --glass-blur: 24px;
  --glass-shadow: 0 8px 32px rgba(0, 0, 0, 0.6);
  --glass-shadow-xl: 0 20px 60px rgba(0, 0, 0, 0.8);
  --glass-glow: 0 0 20px rgba(0, 212, 255, 0.3);
  --glass-glow-strong: 0 0 30px rgba(0, 212, 255, 0.5);
  
  /* HUD Colors */
  --hud-primary: #00D4FF;
  --hud-secondary: #0099FF;
  --hud-accent: #00FF88;
  --hud-warning: #FFB800;
  --hud-danger: #FF4444;
  --hud-text: #FFFFFF;
  --hud-text-dim: rgba(255, 255, 255, 0.7);
  --hud-text-muted: rgba(255, 255, 255, 0.5);
  
  /* Gradients */
  --gradient-primary: linear-gradient(135deg, var(--hud-primary) 0%, var(--hud-secondary) 100%);
  --gradient-accent: linear-gradient(135deg, var(--hud-accent) 0%, var(--hud-primary) 100%);
  --gradient-mesh: 
    radial-gradient(ellipse at 20% 80%, var(--hud-primary) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 20%, var(--hud-secondary) 0%, transparent 50%),
    radial-gradient(ellipse at 40% 40%, var(--hud-accent) 0%, transparent 50%);
}

/* ===== GLOBAL BACKGROUND STYLES ===== */

/* Apply to html and body for full coverage */
html, body {
  margin: 0 !important;
  padding: 0 !important;
  width: 100vw !important;
  min-height: 100vh !important;
  /* Solid base color to avoid white bars under browser UI */
  background-color: #0f1419 !important;
  background-image: var(--glass-bg-gradient) !important;
  background-repeat: no-repeat !important;
  background-size: 100% 100% !important;
  background-attachment: fixed !important;
  background-position: top left !important;
  /* Remove any gaps or lines */
  line-height: 1 !important;
  overflow-x: hidden !important;
}

/* Ensure all containers inherit the background */
body {
  background-color: #0f1419 !important;
  background-image: var(--glass-bg-gradient) !important;
  background-attachment: fixed !important;
  background-size: 100% 100% !important;
  background-position: top left !important;
  background-repeat: no-repeat !important;
}

/* Apply to main content areas */
.site, 
.site-main, 
.content-area, 
.entry-content, 
.page-content,
.container,
.wrapper,
#main,
#content,
#primary {
  background: transparent !important;
  color: var(--hud-text) !important;
}

/* Override theme backgrounds */
.site-header,
.site-footer,
.widget-area,
.sidebar,
.comments-area,
.entry-header,
.entry-footer,
.post-header,
.post-footer,
.page-header,
.page-footer {
  background: transparent !important;
}

/* ===== OPTIONAL: ADD MESH OVERLAY ===== */
/* Uncomment the following to add the subtle mesh overlay effect */

/*
body::before {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  background: var(--gradient-mesh);
  opacity: 0.02;
  filter: blur(2px);
  pointer-events: none;
}
*/

/* ===== OPTIONAL: ADD FLOATING ORBS ===== */
/* Uncomment the following to add floating orb animations */

/*
body::after {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  pointer-events: none;
  background-image: 
    radial-gradient(circle at 10% 10%, var(--hud-primary) 0%, transparent 50%),
    radial-gradient(circle at 90% 60%, var(--hud-secondary) 0%, transparent 50%),
    radial-gradient(circle at 20% 80%, var(--hud-accent) 0%, transparent 50%),
    radial-gradient(circle at 80% 30%, var(--hud-primary) 0%, transparent 50%);
  background-size: 200px 200px, 150px 150px, 100px 100px, 120px 120px;
  background-position: 10% 10%, 90% 60%, 20% 80%, 80% 30%;
  background-repeat: no-repeat;
  opacity: 0.1;
  animation: float 6s ease-in-out infinite;
}

@keyframes float {
  0%, 100% { 
    transform: translateY(0px) scale(1); 
    opacity: 0.1;
  }
  50% { 
    transform: translateY(-20px) scale(1.1); 
    opacity: 0.15;
  }
}
*/

/* ===== MOBILE OPTIMIZATIONS ===== */
@media (max-width: 768px) {
  html, body {
    background-attachment: scroll !important;
    -webkit-overflow-scrolling: touch !important;
  }
  
  /* Ensure mobile browsers don't show white bars */
  body {
    background-size: 100% 100% !important;
    background-position: top center !important;
  }
}

/* ===== REDUCED MOTION SUPPORT ===== */
@media (prefers-reduced-motion: reduce) {
  body::after {
    animation: none !important;
  }
}

/* ===== THEME COMPATIBILITY ===== */
/* Ensure compatibility with popular WordPress themes */

/* Twenty Twenty-Four */
.twenty-twenty-four .site,
.twenty-twenty-four .site-main {
  background: transparent !important;
}

/* Astra */
.ast-container,
.ast-separate-container {
  background: transparent !important;
}

/* GeneratePress */
.site-content,
.content-area {
  background: transparent !important;
}

/* OceanWP */
#content,
#primary {
  background: transparent !important;
}

/* Storefront */
.site-content,
.content-area {
  background: transparent !important;
}

/* Neve */
.nv-content-wrap,
.content-area {
  background: transparent !important;
}

/* Kadence */
.content-bg,
.content-area {
  background: transparent !important;
}/* End custom CSS */