/*
 * Seanav Marine — Futuristic Homepage v3.0
 * Military Dark #0d1117 + Electric Green matrix theme
 * CSS-only effects — zero JS overhead — max performance
 * Loads only on front page (is_front_page())
 */

/* ============================================================
   DESIGN TOKENS — Military Dark + Matrix Green
   ============================================================ */
:root {
  /* Backgrounds */
  --hp-bg:          #0d1117;
  --hp-bg-2:        #0a0e14;
  --hp-bg-3:        #111820;
  --hp-bg-card:     #131b24;
  --hp-bg-hover:    #1a2433;

  /* Green matrix accent (primary brand) */
  --hp-green:       #00ff88;
  --hp-green-dim:   #00cc6a;
  --hp-green-dark:  #00994f;
  --hp-green-glow:  rgba(0, 255, 136, 0.15);
  --hp-green-border:rgba(0, 255, 136, 0.22);

  /* Cyan (secondary — navigation/tech) */
  --hp-cyan:        #00d4ff;
  --hp-cyan-dim:    #00a8cc;
  --hp-cyan-glow:   rgba(0, 212, 255, 0.12);

  /* Text */
  --hp-white:       #f0f6fc;
  --hp-text:        #c9d1d9;
  --hp-text-muted:  #8b949e;
  --hp-text-dim:    #6e7681;

  /* Borders */
  --hp-border:      rgba(255, 255, 255, 0.07);
  --hp-border-green:rgba(0, 255, 136, 0.25);
  --hp-border-cyan: rgba(0, 212, 255, 0.20);

  /* Radii */
  --hp-r:    10px;
  --hp-r-sm: 6px;
  --hp-r-lg: 16px;

  /* Transitions — fast for speed */
  --hp-t: 0.22s ease;
}

/* ============================================================
   GLOBAL HOMEPAGE BODY
   ============================================================ */
body.home {
  background-color: var(--hp-bg) !important;
  color: var(--hp-text) !important;
}

body.home a {
  color: var(--hp-cyan-dim);
  transition: color var(--hp-t);
}

body.home a:hover {
  color: var(--hp-green);
}

body.home h1,
body.home h2,
body.home h3,
body.home h4,
body.home h5,
body.home h6 {
  color: var(--hp-white) !important;
}

body.home p {
  color: var(--hp-text) !important;
}

/* ============================================================
   HEADER — GLASSMORPHISM MILITARY DARK
   ============================================================ */
body.home #header {
  background: rgba(13, 17, 23, 0.96) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  border-bottom: 1px solid var(--hp-border) !important;
  box-shadow: 0 1px 0 rgba(0, 255, 136, 0.1), 0 4px 20px rgba(0, 0, 0, 0.4) !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 9999 !important;
}

/* Top bar */
body.home .header-top {
  background: rgba(10, 14, 20, 0.99) !important;
  border-bottom: 1px solid var(--hp-border) !important;
  padding: 6px 0 !important;
}

body.home .header-top .top-bar-item a,
body.home .header-top a {
  color: var(--hp-text-muted) !important;
  font-size: 0.82rem !important;
  transition: color var(--hp-t) !important;
}

body.home .header-top a:hover {
  color: var(--hp-green) !important;
}

body.home .header-top .seanav-icon {
  stroke: var(--hp-green) !important;
}

/* Main header row */
body.home .header-main {
  background: transparent !important;
  border-bottom: none !important;
  min-height: 60px !important;
}

/* Logo */
body.home .logo-fallback-text {
  font-family: 'Outfit', sans-serif !important;
  font-size: 1.35rem !important;
  font-weight: 900 !important;
  color: var(--hp-white) !important;
  letter-spacing: 0.04em !important;
}

body.home .logo-fallback-text span {
  color: var(--hp-green) !important;
}

body.home .header-logo img {
  filter: brightness(1.1) !important;
}

/* Nav links */
body.home .mega-nav-link {
  color: var(--hp-text) !important;
  font-size: 0.88rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  padding: 20px 10px !important;
  transition: color var(--hp-t) !important;
  position: relative !important;
}

body.home .mega-nav-link .chevron {
  color: var(--hp-text-dim) !important;
}

body.home .mega-nav-item:hover > .mega-nav-link,
body.home .mega-nav-item:hover > .mega-nav-link .chevron {
  color: var(--hp-green) !important;
}

/* Active underline */
body.home .mega-nav-item:hover > .mega-nav-link::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 2px;
  background: var(--hp-green);
}

/* Shop highlight button */
body.home .mega-nav-link.highlight {
  background: var(--hp-green) !important;
  color: #0d1117 !important;
  border-radius: 6px !important;
  padding: 8px 18px !important;
  margin: 10px 6px !important;
  font-size: 0.82rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  transition: all var(--hp-t) !important;
  box-shadow: 0 0 16px rgba(0, 255, 136, 0.25) !important;
}

body.home .mega-nav-link.highlight:hover {
  background: var(--hp-green-dim) !important;
  box-shadow: 0 0 28px rgba(0, 255, 136, 0.45) !important;
  transform: translateY(-1px) !important;
}

body.home .mega-nav-link.highlight::after { display: none !important; }

/* Quote button */
body.home .header-quote-btn {
  background: transparent !important;
  border: 1.5px solid var(--hp-green-border) !important;
  color: var(--hp-green) !important;
  border-radius: 6px !important;
  padding: 8px 18px !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  transition: all var(--hp-t) !important;
}

body.home .header-quote-btn:hover {
  background: var(--hp-green) !important;
  color: #0d1117 !important;
  border-color: var(--hp-green) !important;
  box-shadow: 0 0 20px rgba(0, 255, 136, 0.35) !important;
}

/* Cart icon */
body.home .cart-link {
  background: rgba(255, 255, 255, 0.04) !important;
  color: var(--hp-text) !important;
  border: 1px solid var(--hp-border) !important;
  transition: all var(--hp-t) !important;
}

body.home .cart-link:hover {
  background: var(--hp-green-glow) !important;
  color: var(--hp-green) !important;
  border-color: var(--hp-green-border) !important;
}

body.home .cart-count {
  background: var(--hp-green) !important;
  color: #0d1117 !important;
  font-weight: 800 !important;
  border-color: var(--hp-bg) !important;
}

/* Search input */
body.home .header-search-input {
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid var(--hp-border) !important;
  color: var(--hp-white) !important;
  border-radius: 8px !important;
  transition: border-color var(--hp-t), box-shadow var(--hp-t) !important;
}

body.home .header-search-input::placeholder {
  color: var(--hp-text-dim) !important;
}

body.home .header-search-input:focus {
  border-color: var(--hp-green-border) !important;
  box-shadow: 0 0 0 3px var(--hp-green-glow) !important;
  background: rgba(0, 255, 136, 0.03) !important;
}

body.home .header-search-btn {
  color: var(--hp-text-muted) !important;
}

body.home .header-search-btn:hover {
  color: var(--hp-green) !important;
}

/* Live search panel */
body.home .seanav-ls-panel {
  background: var(--hp-bg-3) !important;
  border: 1px solid var(--hp-border-green) !important;
  border-top: 2px solid var(--hp-green) !important;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.6) !important;
}

body.home .seanav-ls-name { color: var(--hp-white) !important; }
body.home .seanav-ls-price { color: var(--hp-green) !important; }
body.home .seanav-ls-link:hover { background: rgba(0, 255, 136, 0.06) !important; }
body.home .seanav-ls-viewall {
  background: var(--hp-bg) !important;
  color: var(--hp-text-muted) !important;
  border-top-color: var(--hp-border) !important;
}
body.home .seanav-ls-viewall:hover { color: var(--hp-green) !important; }
body.home .seanav-ls-thumb {
  background: var(--hp-bg-card) !important;
  border-color: var(--hp-border) !important;
}

/* ============================================================
   MEGA DROPDOWN — DARK GLASS
   ============================================================ */
body.home .seanav-mega-menu {
  background: rgba(13, 17, 23, 0.98) !important;
  backdrop-filter: blur(24px) !important;
  border: 1px solid var(--hp-border) !important;
  border-top: 2px solid var(--hp-green) !important;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(0, 255, 136, 0.06) !important;
}

body.home .mega-col-title {
  color: var(--hp-green) !important;
  font-size: 0.72rem !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  border-bottom: 1px solid rgba(0, 255, 136, 0.15) !important;
  padding-bottom: 8px !important;
}

body.home .mega-col-title .arrow { color: var(--hp-green) !important; }

body.home .mega-col-list li a {
  color: var(--hp-text-muted) !important;
  font-size: 0.85rem !important;
  transition: all 0.18s ease !important;
}

body.home .mega-col-list li a:hover {
  color: var(--hp-green) !important;
  transform: translateX(4px) !important;
}

/* ============================================================
   MOBILE DRAWER
   ============================================================ */
body.home .drawer-content {
  background: var(--hp-bg-2) !important;
  border-left: 1px solid var(--hp-border) !important;
}

body.home .drawer-header {
  background: rgba(0, 255, 136, 0.04) !important;
  border-bottom: 1px solid var(--hp-border) !important;
}

body.home .drawer-title {
  color: var(--hp-green) !important;
  font-weight: 900 !important;
  letter-spacing: 0.08em !important;
}

body.home .drawer-close { color: var(--hp-text-muted) !important; }

body.home .mobile-menu-list .mobile-menu-item {
  border-bottom-color: var(--hp-border) !important;
}

body.home .mobile-menu-list .mobile-menu-item > a,
body.home .mobile-menu-item-row > a {
  color: var(--hp-text) !important;
}

body.home .mobile-menu-list a:hover {
  color: var(--hp-green) !important;
}

body.home .mobile-menu-group-label {
  color: var(--hp-text-dim) !important;
  font-size: 0.78rem !important;
  letter-spacing: 1.5px !important;
  text-transform: uppercase !important;
}

body.home .mobile-submenu {
  border-left-color: rgba(0, 255, 136, 0.2) !important;
}

body.home .mobile-submenu > .mobile-menu-item > a,
body.home .mobile-submenu .mobile-menu-item-row > a,
body.home .mobile-submenu .mobile-menu-group-label {
  color: var(--hp-text-muted) !important;
}

body.home .mobile-submenu-toggle {
  color: var(--hp-text-dim) !important;
}

body.home .mobile-submenu-toggle:hover {
  background: rgba(0, 255, 136, 0.06) !important;
  color: var(--hp-green) !important;
}

body.home .mobile-drawer-contact { border-top-color: var(--hp-border) !important; }

body.home .mobile-drawer-contact-link {
  color: var(--hp-text) !important;
  border-bottom-color: var(--hp-border) !important;
}

body.home .mobile-drawer-contact-link:hover { color: var(--hp-green) !important; }

body.home .mobile-drawer-quote {
  background: var(--hp-green) !important;
  color: #0d1117 !important;
  font-weight: 800 !important;
  border-radius: var(--hp-r-sm) !important;
}

body.home .mobile-drawer-quote:hover {
  background: var(--hp-green-dim) !important;
}

body.home .mobile-nav-toggle {
  color: var(--hp-text) !important;
}

/* ============================================================
   HERO / BANNER SECTION
   ============================================================ */
/* Subtle green scan-bar at bottom of hero — CSS only */
body.home .ux-slider-wrapper {
  position: relative !important;
  overflow: hidden !important;
}

body.home .ux-slider-wrapper::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, transparent, var(--hp-green), var(--hp-cyan), transparent);
  z-index: 10;
  pointer-events: none;
}

/* Hero overlay vignette */
body.home .ux-banner.banner {
  position: relative !important;
}

/* Hero text enhancement */
body.home .ux-banner .text-box h1,
body.home .ux-banner .text-box-inner h1 {
  color: #ffffff !important;
  text-shadow: 0 2px 20px rgba(0, 0, 0, 0.7) !important;
}

/* Keep accent phrase in hero title (e.g. "Marine Technology") as button green */
body.home .ux-banner .text-box-inner h1 span[style*="color:#00bcd4"],
body.home .ux-banner .text-box-inner h1 span[style*="color: #00bcd4"],
body.home .ux-banner .text-box h1 span[style*="color:#00bcd4"],
body.home .ux-banner .text-box h1 span[style*="color: #00bcd4"] {
  color: var(--hp-green) !important;
}

/* Home ports strip — match button green */
body.home .seanav-home-ports-strip {
  padding: 14px 0 !important;
  border-top: 1px solid var(--hp-green-border) !important;
}

body.home .seanav-home-ports-strip p,
body.home .seanav-home-ports-strip strong,
body.home .seanav-home-ports-strip a {
  color: var(--hp-green) !important;
}

body.home .seanav-home-ports-strip a:hover {
  color: var(--hp-green-dim) !important;
  text-decoration: underline !important;
}

/* Hero CTA buttons — match product ADD TO CART (green fill + dark label) */
body.home .ux-banner a.button,
body.home .ux-banner .button,
body.home .ux-banner a.button span,
body.home .ux-banner .button span {
  background: var(--hp-green) !important;
  color: #0d1117 !important;
  border: none !important;
  font-weight: 800 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  font-size: 0.88rem !important;
  padding: 13px 32px !important;
  border-radius: var(--hp-r-sm) !important;
  box-shadow: 0 4px 20px rgba(0, 255, 136, 0.30) !important;
  transition: all var(--hp-t) !important;
}

body.home .ux-banner a.button span,
body.home .ux-banner .button span {
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  font-size: inherit !important;
}

body.home .ux-banner a.button:hover,
body.home .ux-banner .button:hover,
body.home .ux-banner a.button:hover span,
body.home .ux-banner .button:hover span {
  background: var(--hp-green-dim) !important;
  box-shadow: 0 6px 30px rgba(0, 255, 136, 0.50) !important;
  transform: translateY(-2px) !important;
  color: #0d1117 !important;
}

body.home .ux-banner a.button:hover span,
body.home .ux-banner .button:hover span {
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

/* Secondary / outline in hero — same dark label on green (match ADD TO CART) */
body.home .ux-banner a.button.secondary,
body.home .ux-banner a.button.outline,
body.home .ux-banner a.button:nth-child(2),
body.home .ux-banner a.button.secondary span,
body.home .ux-banner a.button.outline span,
body.home .ux-banner a.button:nth-child(2) span {
  background: var(--hp-green) !important;
  border: none !important;
  color: #0d1117 !important;
  box-shadow: 0 4px 20px rgba(0, 255, 136, 0.30) !important;
}

body.home .ux-banner a.button.secondary span,
body.home .ux-banner a.button.outline span,
body.home .ux-banner a.button:nth-child(2) span {
  background: transparent !important;
  box-shadow: none !important;
}

body.home .ux-banner a.button.secondary:hover,
body.home .ux-banner a.button.outline:hover,
body.home .ux-banner a.button:nth-child(2):hover,
body.home .ux-banner a.button.secondary:hover span,
body.home .ux-banner a.button.outline:hover span,
body.home .ux-banner a.button:nth-child(2):hover span {
  background: var(--hp-green-dim) !important;
  border-color: transparent !important;
  color: #0d1117 !important;
  box-shadow: 0 6px 30px rgba(0, 255, 136, 0.50) !important;
}

body.home .ux-banner a.button.secondary:hover span,
body.home .ux-banner a.button.outline:hover span,
body.home .ux-banner a.button:nth-child(2):hover span {
  background: transparent !important;
  box-shadow: none !important;
}

/* ============================================================
   ALL SECTIONS — DARK BACKGROUNDS
   ============================================================ */
body.home .section {
  background: var(--hp-bg) !important;
}

body.home .section.dark,
body.home .section-dark,
body.home .section[data-color="dark"],
body.home .section[data-color="navy"] {
  background: var(--hp-bg-2) !important;
}

/* Direct row sections (no .section wrapper) */
body.home #content main > .row.row-collapse {
  background: var(--hp-bg-2) !important;
}

/* ============================================================
   SECTION HEADINGS — "Category" eyebrow labels
   ============================================================ */
body.home .section .section-title,
body.home .col-inner > h2,
body.home .col-inner > h3 {
  color: var(--hp-white) !important;
}

/* Eyebrow pill labels — all those green "📡 Category" styled spans */
body.home p[style*="letter-spacing"],
body.home .text-box-inner > p:first-child,
body.home span[style*="letter-spacing"][style*="uppercase"],
body.home span[style*="text-transform: uppercase"],
body.home span[style*="text-transform:uppercase"] {
  color: var(--hp-green) !important;
  text-shadow: 0 0 12px rgba(0, 255, 136, 0.3) !important;
}

/* ============================================================
   ABOUT SECTION
   ============================================================ */
body.home .seanav-about-panel--intro {
  background: linear-gradient(135deg, #0a2540 0%, #0d3460 55%, #0e4080 100%) !important;
  position: relative;
  overflow: hidden;
}

body.home .seanav-about-panel--intro::before {
  content: '';
  position: absolute;
  top: -40%;
  right: -20%;
  width: 320px;
  height: 320px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(0, 255, 136, 0.1) 0%, transparent 70%);
  pointer-events: none;
}

body.home .seanav-about-panel--mission {
  background-color: var(--hp-bg-2) !important;
}

body.home .seanav-about-panel--mission::before {
  background: linear-gradient(105deg, rgba(10, 14, 20, 0.9) 0%, rgba(0, 212, 255, 0.2) 100%) !important;
}

body.home .seanav-about-eyebrow {
  color: var(--hp-green) !important;
  text-shadow: 0 0 10px rgba(0, 255, 136, 0.3) !important;
}

body.home .seanav-about-panel h2 {
  color: var(--hp-white) !important;
}

body.home .seanav-about-panel h3 {
  color: var(--hp-white) !important;
}

body.home .seanav-about-panel p {
  color: rgba(255, 255, 255, 0.80) !important;
}

body.home .seanav-about-panel .button,
body.home .seanav-about-panel a.button,
body.home .seanav-about-panel .button span,
body.home .seanav-about-panel a.button span {
  border: none !important;
  color: #0d1117 !important;
  background: var(--hp-green) !important;
  transition: all var(--hp-t) !important;
}

body.home .seanav-about-panel .button span,
body.home .seanav-about-panel a.button span {
  background: transparent !important;
}

body.home .seanav-about-panel .button:hover,
body.home .seanav-about-panel a.button:hover,
body.home .seanav-about-panel .button:hover span,
body.home .seanav-about-panel a.button:hover span {
  background: var(--hp-green-dim) !important;
  border-color: transparent !important;
  color: #0d1117 !important;
}

body.home .seanav-about-panel .button:hover span,
body.home .seanav-about-panel a.button:hover span {
  background: transparent !important;
}

/* ============================================================
   SERVICE PROMO BANNERS (Communication, Navigation, Safety, Airtime)
   ============================================================ */
body.home .row.row-collapse .ux-banner {
  border-radius: 0 !important;
}

/* Dark overlay tint on all service banners */
body.home .row.row-collapse .ux-banner .banner-overlay {
  background: rgba(10, 14, 20, 0.45) !important;
}

body.home .row.row-collapse .ux-banner .text-box-inner > p:first-child,
body.home .row.row-collapse .ux-banner .text-box-inner > p:first-child > span {
  color: var(--hp-green) !important;
  background: transparent !important;
  letter-spacing: 4px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
}

body.home .row.row-collapse .ux-banner .text-box-inner > h2,
body.home .row.row-collapse .ux-banner .text-box-inner > h3 {
  color: #ffffff !important;
}

body.home .row.row-collapse .ux-banner .text-box-inner > p {
  color: rgba(255, 255, 255, 0.85) !important;
}

body.home .row.row-collapse .ux-banner a.button,
body.home .row.row-collapse .ux-banner .button,
body.home .row.row-collapse .ux-banner a.button span,
body.home .row.row-collapse .ux-banner .button span {
  background: var(--hp-green) !important;
  color: #0d1117 !important;
  border: none !important;
  font-weight: 800 !important;
  border-radius: var(--hp-r-sm) !important;
  transition: all var(--hp-t) !important;
}

body.home .row.row-collapse .ux-banner a.button span,
body.home .row.row-collapse .ux-banner .button span {
  background: transparent !important;
}

body.home .row.row-collapse .ux-banner a.button:hover,
body.home .row.row-collapse .ux-banner .button:hover,
body.home .row.row-collapse .ux-banner a.button:hover span,
body.home .row.row-collapse .ux-banner .button:hover span {
  background: var(--hp-green-dim) !important;
  transform: translateY(-1px) !important;
  color: #0d1117 !important;
}

body.home .row.row-collapse .ux-banner a.button:hover span,
body.home .row.row-collapse .ux-banner .button:hover span {
  background: transparent !important;
  transform: none !important;
}

/* ============================================================
   CATEGORY TILES — service icon tiles
   ============================================================ */
body.home #content .box.box-push.box-text-bottom,
body.home #content .seanav-cat-tile {
  background: var(--hp-bg-card) !important;
  border: 1px solid var(--hp-border) !important;
  border-radius: var(--hp-r) !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.3) !important;
  transition: all var(--hp-t) !important;
}

body.home #content .box.box-push.box-text-bottom:hover,
body.home #content .seanav-cat-tile:hover {
  border-color: var(--hp-green-border) !important;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.4), 0 0 16px var(--hp-green-glow) !important;
  transform: translateY(-4px) !important;
}

body.home #content .box.box-push.box-text-bottom .box-image,
body.home #content .seanav-cat-tile .box-image {
  background: var(--hp-bg) !important;
  border-radius: 10px 10px 0 0 !important;
}

/* Category tile title */
body.home #content .box.box-push.box-text-bottom .box-text-inner h5,
body.home #content .box.box-push.box-text-bottom .seanav-cat-tile-title,
body.home #content .seanav-cat-tile .box-text-inner h5,
body.home #content .seanav-cat-tile .seanav-cat-tile-title {
  color: var(--hp-white) !important;
  font-size: 11px !important;
  letter-spacing: 1.5px !important;
}

body.home #content .box.box-push.box-text-bottom .box-text,
body.home #content .seanav-cat-tile .box-text {
  background: var(--hp-bg-card) !important;
  padding: 8px 4px !important;
}

/* ============================================================
   PRODUCT CARDS — dark glass style
   ============================================================ */
body.home .product-small .box,
body.home .product-small .product-small.box {
  background: var(--hp-bg-card) !important;
  border: 1px solid var(--hp-border) !important;
  border-radius: var(--hp-r) !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3) !important;
  transition: all var(--hp-t) !important;
}

body.home .product-small .box:hover {
  border-color: var(--hp-green-border) !important;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.5), 0 0 20px var(--hp-green-glow) !important;
  transform: translateY(-4px) !important;
}

body.home .product-small .box-image {
  background: var(--hp-bg) !important;
}

/* Product title */
body.home .product-small .title-wrapper h5,
body.home .product-small h5.title,
body.home .product-small .product-title,
body.home .product-small .box-text h5,
body.home .product-small h5 {
  color: var(--hp-white) !important;
  font-size: 0.85rem !important;
}

/* Price */
body.home .product-small .price,
body.home .product-small ins .amount,
body.home .product-small .woocommerce-Price-amount {
  color: var(--hp-green) !important;
  font-weight: 700 !important;
}

/* Category label / badge */
body.home .product-small .label-category,
body.home .product-small .category-name a,
body.home .product-small .label-text {
  background: rgba(0, 255, 136, 0.1) !important;
  color: var(--hp-green) !important;
  border: 1px solid rgba(0, 255, 136, 0.2) !important;
  border-radius: 4px !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  padding: 2px 8px !important;
}

/* Product add-to-cart / button */
body.home .product-small .button,
body.home .product-small .add_to_cart_button,
body.home .product-small .product_type_simple.button,
body.home .product-small .button span,
body.home .product-small .add_to_cart_button span {
  background: var(--hp-green) !important;
  color: #0d1117 !important;
  border: none !important;
  border-radius: 6px !important;
  font-weight: 700 !important;
  font-size: 0.8rem !important;
  letter-spacing: 0.04em !important;
  transition: all var(--hp-t) !important;
  box-shadow: 0 2px 10px rgba(0, 255, 136, 0.2) !important;
}

body.home .product-small .button span,
body.home .product-small .add_to_cart_button span {
  background: transparent !important;
  box-shadow: none !important;
  font-size: inherit !important;
}

body.home .product-small .button:hover,
body.home .product-small .add_to_cart_button:hover,
body.home .product-small .button:hover span,
body.home .product-small .add_to_cart_button:hover span {
  background: var(--hp-green-dim) !important;
  box-shadow: 0 4px 18px rgba(0, 255, 136, 0.4) !important;
  transform: translateY(-1px) !important;
  color: #0d1117 !important;
}

body.home .product-small .button:hover span,
body.home .product-small .add_to_cart_button:hover span {
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

/* product-small box text area */
body.home .product-small .box-text {
  background: var(--hp-bg-card) !important;
  padding: 12px 14px !important;
}

/* ============================================================
   WooCommerce PRODUCT LOOP (if used natively)
   ============================================================ */
body.home .woocommerce ul.products li.product {
  background: var(--hp-bg-card) !important;
  border: 1px solid var(--hp-border) !important;
  border-radius: var(--hp-r) !important;
  transition: all var(--hp-t) !important;
}

body.home .woocommerce ul.products li.product:hover {
  border-color: var(--hp-green-border) !important;
  box-shadow: 0 8px 28px rgba(0, 255, 136, 0.12) !important;
  transform: translateY(-4px) !important;
}

body.home .woocommerce ul.products li.product .woocommerce-loop-product__title {
  color: var(--hp-white) !important;
}

body.home .woocommerce ul.products li.product .price {
  color: var(--hp-green) !important;
}

body.home .woocommerce ul.products li.product .button {
  background: var(--hp-green) !important;
  color: #0d1117 !important;
  border: none !important;
  font-weight: 800 !important;
  border-radius: 6px !important;
  transition: all var(--hp-t) !important;
}

body.home .woocommerce ul.products li.product .button:hover {
  background: var(--hp-green-dim) !important;
  transform: translateY(-1px) !important;
}

body.home .woocommerce .onsale {
  background: var(--hp-green) !important;
  color: #0d1117 !important;
  font-weight: 800 !important;
  border-radius: 4px !important;
}

body.home .woocommerce .star-rating span::before {
  color: #f59e0b !important;
}

/* ============================================================
   GLOBAL BUTTONS — match product ADD TO CART (green + dark text)
   ============================================================ */
body.home a.button,
body.home .button:not(.add_to_cart_button):not(.mobile-nav-toggle):not(.mobile-submenu-toggle):not(.drawer-close),
body.home a.button span,
body.home .button:not(.add_to_cart_button):not(.mobile-nav-toggle):not(.mobile-submenu-toggle):not(.drawer-close) span {
  background: var(--hp-green) !important;
  color: #0d1117 !important;
  border: none !important;
  border-radius: var(--hp-r-sm) !important;
  font-weight: 800 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  font-size: 0.85rem !important;
  padding: 11px 26px !important;
  transition: all var(--hp-t) !important;
  box-shadow: 0 3px 14px rgba(0, 255, 136, 0.22) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

body.home a.button span,
body.home .button:not(.add_to_cart_button):not(.mobile-nav-toggle):not(.mobile-submenu-toggle):not(.drawer-close) span {
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  display: inline !important;
  font-size: inherit !important;
  letter-spacing: inherit !important;
}

body.home a.button:hover,
body.home .button:not(.add_to_cart_button):not(.mobile-nav-toggle):not(.mobile-submenu-toggle):not(.drawer-close):hover,
body.home a.button:hover span,
body.home .button:not(.add_to_cart_button):not(.mobile-nav-toggle):not(.mobile-submenu-toggle):not(.drawer-close):hover span {
  background: var(--hp-green-dim) !important;
  color: #0d1117 !important;
  box-shadow: 0 6px 24px rgba(0, 255, 136, 0.40) !important;
  transform: translateY(-2px) !important;
}

body.home a.button:hover span,
body.home .button:not(.add_to_cart_button):not(.mobile-nav-toggle):not(.mobile-submenu-toggle):not(.drawer-close):hover span {
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

/* Outlined / border style buttons — same dark label as ADD TO CART */
body.home a.button.outline,
body.home a.secondary.button,
body.home a.button.outline span,
body.home a.secondary.button span {
  background: var(--hp-green) !important;
  border: none !important;
  color: #0d1117 !important;
  box-shadow: 0 3px 14px rgba(0, 255, 136, 0.22) !important;
}

body.home a.button.outline span,
body.home a.secondary.button span {
  background: transparent !important;
  box-shadow: none !important;
}

body.home a.button.outline:hover,
body.home a.secondary.button:hover,
body.home a.button.outline:hover span,
body.home a.secondary.button:hover span {
  background: var(--hp-green-dim) !important;
  color: #0d1117 !important;
}

body.home a.button.outline:hover span,
body.home a.secondary.button:hover span {
  background: transparent !important;
}

/* "Read more" / text-only links acting as buttons */
body.home .btn-link,
body.home .mega-col-list .btn-link {
  color: var(--hp-green) !important;
  font-weight: 700 !important;
  font-size: 0.82rem !important;
}

body.home .btn-link:hover { color: var(--hp-white) !important; }

/* ============================================================
   CTA / SUPPORT SECTION
   ============================================================ */
body.home .section.dark h2,
body.home .section.dark h3 {
  color: var(--hp-white) !important;
}

body.home .section.dark p {
  color: var(--hp-text) !important;
}

/* ============================================================
   VESSEL COVERAGE SECTION
   ============================================================ */
body.home .col-inner ul li {
  color: var(--hp-text) !important;
}

body.home a[href*="/ports/"] {
  color: var(--hp-cyan) !important;
  font-weight: 600;
  transition: color var(--hp-t);
}

body.home a[href*="/ports/"]:hover {
  color: var(--hp-green) !important;
}

/* ============================================================
   REGISTERED COMPANIES BAR
   ============================================================ */
body.home p:has(> span:only-child) {
  color: var(--hp-text-muted) !important;
}

/* ============================================================
   FOOTER — FULL DARK REDESIGN
   ============================================================ */
body.home #footer,
body.home .footer-wrapper {
  background: var(--hp-bg-2) !important;
  border-top: 1px solid var(--hp-border) !important;
  color: var(--hp-text) !important;
}

body.home .footer-widgets {
  padding: 56px 0 40px !important;
}

body.home .widget-title {
  color: var(--hp-white) !important;
  font-size: 0.8rem !important;
  font-weight: 800 !important;
  letter-spacing: 2.5px !important;
  text-transform: uppercase !important;
  padding-bottom: 12px !important;
  border-bottom: 2px solid var(--hp-green) !important;
  margin-bottom: 18px !important;
  display: block;
}

body.home .footer-wrapper ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

body.home .footer-wrapper ul li {
  padding: 5px 0 !important;
}

body.home .footer-wrapper ul li a,
body.home .footer-wrapper p a {
  color: var(--hp-text-muted) !important;
  font-size: 0.88rem !important;
  transition: color var(--hp-t) !important;
}

body.home .footer-wrapper ul li a:hover,
body.home .footer-wrapper p a:hover {
  color: var(--hp-green) !important;
}

body.home .footer-wrapper p {
  color: var(--hp-text-muted) !important;
  font-size: 0.88rem !important;
  line-height: 1.7 !important;
}

body.home .footer-wrapper strong {
  color: var(--hp-text) !important;
}

/* Footer column headings (from custom footer block) */
body.home .footer-wrapper h3,
body.home .footer-wrapper h4 {
  color: var(--hp-white) !important;
  font-size: 0.82rem !important;
  font-weight: 800 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  margin-bottom: 16px !important;
}

body.home .footer-wrapper .footer-menu-list a {
  color: var(--hp-text-muted) !important;
  display: block;
  padding: 4px 0 !important;
  font-size: 0.87rem !important;
  transition: all var(--hp-t) !important;
}

body.home .footer-wrapper .footer-menu-list a:hover {
  color: var(--hp-green) !important;
  padding-left: 4px !important;
}

/* Absolute footer bar */
body.home .absolute-footer {
  background: var(--hp-bg) !important;
  border-top: 1px solid var(--hp-border) !important;
  padding: 16px 0 !important;
}

body.home .absolute-footer p {
  color: var(--hp-text-dim) !important;
  font-size: 0.82rem !important;
  margin: 0 !important;
}

body.home .absolute-footer .payment-icons span {
  color: var(--hp-text-dim) !important;
  font-size: 0.8rem !important;
}

/* ============================================================
   CUSTOM FOOTER BLOCK (if rendered via UX blocks)
   ============================================================ */
body.home .footer-wrapper [class*="section"],
body.home .footer-wrapper .section {
  background: var(--hp-bg-2) !important;
}

/* ============================================================
   GENERAL SECTION CONTENT INSIDE HOME
   ============================================================ */
/* All text in sections */
body.home .col-inner > p,
body.home .text-box-inner p,
body.home .col-inner li {
  color: var(--hp-text) !important;
}

/* Icon colours */
body.home .seanav-icon {
  stroke: var(--hp-green) !important;
}

/* Hero search submit icon — dark like button labels */
body.home .ux-banner .search-submit,
body.home .ux-banner .search-submit .seanav-icon,
body.home .ux-banner .seanav-ls-wrap .search-submit .seanav-icon {
  color: #0d1117 !important;
  stroke: #0d1117 !important;
}

/* Generic box/card used for non-product items */
body.home .box:not(.product-small):not(.box-push) {
  background: var(--hp-bg-card) !important;
  border: 1px solid var(--hp-border) !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.3) !important;
}

body.home .box:not(.product-small):not(.box-push):hover {
  border-color: var(--hp-green-border) !important;
}

/* ============================================================
   QUICK CSS-ONLY TRANSITIONS (replaces JS)
   ============================================================ */

/* Smooth image hover zoom on product cards */
body.home .product-small .box-image img {
  transition: transform 0.35s ease !important;
}

body.home .product-small .box:hover .box-image img {
  transform: scale(1.04) !important;
}

/* Category tile image zoom */
body.home #content .box.box-push.box-text-bottom .box-image img {
  transition: transform 0.35s ease !important;
}

body.home #content .box.box-push.box-text-bottom:hover .box-image img {
  transform: scale(1.05) !important;
}

/* ============================================================
   SECTIONS THAT NEED PADDING / SPACING FIXES
   ============================================================ */
body.home .section {
  position: relative;
}

/* Ensure section backgrounds don't bleed white */
body.home .section > .section-content {
  background: inherit !important;
}

/* ============================================================
   CUSTOM STATS / TRUST SECTION (if present as shortcode)
   ============================================================ */
body.home .stat-pulse {
  color: var(--hp-white) !important;
}

body.home .stat-pulse > span,
body.home .stat-pulse > span[style*="color:#00bcd4"],
body.home .stat-pulse > span[style*="color: #00bcd4"],
body.home .stat-pulse > span[style*="color:#00c8e0"],
body.home .stat-pulse > span[style*="color: #00c8e0"] {
  color: #ffffff !important;
}

/* ============================================================
   SEARCH PAGE (preserved but still dark on home)
   ============================================================ */
body.home .search-no-results {
  background: var(--hp-bg) !important;
  color: var(--hp-text) !important;
}

/* ============================================================
   MISC — fix any remaining white boxes/panels
   ============================================================ */
body.home [style*="background:#fff"],
body.home [style*="background: #fff"],
body.home [style*="background:#ffffff"],
body.home [style*="background: #ffffff"],
body.home [style*="background-color:#fff"],
body.home [style*="background-color: #fff"],
body.home [style*="background-color:#ffffff"],
body.home [style*="background-color: #ffffff"] {
  background: var(--hp-bg-card) !important;
}

body.home [style*="background:#f8fafc"],
body.home [style*="background-color:#f8fafc"] {
  background: var(--hp-bg) !important;
}

/* Fix any white text areas */
body.home [style*="color:#0f172a"],
body.home [style*="color: #0f172a"],
body.home [style*="color:#061729"],
body.home [style*="color: #061729"],
body.home [style*="color:#0a1929"],
body.home [style*="color: #0a1929"] {
  color: var(--hp-white) !important;
}

body.home [style*="color:#64748b"],
body.home [style*="color: #64748b"] {
  color: var(--hp-text-muted) !important;
}

/* ============================================================
   RESPONSIVE — mobile polish
   ============================================================ */
@media (max-width: 960px) {
  body.home #header {
    background: rgba(13, 17, 23, 0.99) !important;
  }
}

@media (max-width: 549px) {
  body.home .header-main {
    min-height: 56px !important;
  }

  body.home a.button,
  body.home .button:not(.add_to_cart_button):not(.mobile-nav-toggle):not(.mobile-submenu-toggle) {
    padding: 10px 20px !important;
    font-size: 0.82rem !important;
  }
}

/* ============================================================
   REDUCED MOTION — safety
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
  body.home .product-small .box-image img,
  body.home #content .box.box-push.box-text-bottom .box-image img {
    transition: none !important;
    transform: none !important;
  }
}
