/* Shipping Wish public pages: the original near-black header, light page, amber actions.
   Inner pages already use marketing.css. This file only tightens the corporate chrome
   and the homepage menu breakpoint. It does not paint the page black. */

body.marketing {
  background: #f4f7fb;
  color: #0f172a;
  overflow-x: clip;
}

body.marketing .nav {
  background: #020617;
  border-bottom: 1px solid rgba(148, 163, 184, 0.16);
  box-shadow: none;
}

body.marketing .nav-logo-text { color: #f8fafc; }
body.marketing .nav-logo-text span { color: #60a5fa; }
body.marketing .nav-logo-mark {
  background: linear-gradient(135deg, #2563eb, #60a5fa);
  color: #fff;
}

body.marketing .nav-links a { color: #e2e8f0; }
body.marketing .nav-links a:hover {
  color: #fff;
  background: rgba(255, 255, 255, 0.08);
}
body.marketing .nav-links a.active { color: #fbbf24; }

body.marketing .nav-dropdown-menu {
  background: #fff;
  border: 1px solid #e2e8f0;
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.16);
}
body.marketing .nav-dropdown-menu a { color: #334155; }
body.marketing .nav-dropdown-menu a:hover {
  background: #f8fafc;
  color: #0b1f3a;
}
body.marketing .dropdown-label { color: #64748b; }

body.marketing .live-status {
  color: #d1fae5;
  background: rgba(16, 185, 129, 0.16);
  border: 1px solid rgba(110, 231, 183, 0.35);
}

body.marketing .nav-phone {
  color: #e2e8f0;
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
  text-decoration: none;
}

/* Dark tool heroes (carrier lookup): headings stay white on the navy band. */
body.marketing .cs-hero,
body.marketing .cs-hero h1,
body.marketing .cs-hero h2,
body.marketing .cs-hero .cs-heading,
body.marketing #cs-heading {
  color: #fff !important;
}
body.marketing .nav-phone:hover { color: #fff; }
body.marketing .nav-hamburger span { background: #f8fafc; }
body.marketing .nav .btn-secondary {
  background: transparent;
  color: #f8fafc;
  border-color: rgba(255, 255, 255, 0.28);
}
body.marketing .nav .btn-primary {
  background: linear-gradient(90deg, #2563eb, #4f46e5);
  color: #fff;
  border-color: transparent;
}

body.marketing .nav-mobile {
  background: #ffffff !important;
  color: #0f172a;
  padding: 84px 22px calc(16px + env(safe-area-inset-bottom, 0px)) !important;
}
body.marketing .nav-mobile.open {
  display: flex !important;
  flex-direction: column;
  overflow: hidden;
}
body.marketing .nav-mobile-links {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
body.marketing .nav-mobile a { color: #0f172a !important; }
body.marketing .nav-mobile a:hover,
body.marketing .nav-mobile a:active {
  color: #b45309 !important;
  background: #fffbeb;
}
body.marketing .nav-mobile-cta-group {
  position: static;
  flex: 0 0 auto;
  margin: 0;
  padding: 12px 0 0;
  background: #fff;
  border-top: 1px solid #e2e8f0;
}

.pay-note,
.stripe-pay-note {
  display: inline-flex;
  align-items: center;
  font-size: 12px;
  font-weight: 700;
  color: #334155;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  padding: 6px 12px;
}

/* Desktop/laptop nav from 900px. Hamburger only on phones. */
@media (min-width: 900px) {
  body.marketing .nav-links,
  body.marketing .nav-actions {
    display: flex !important;
  }
  body.marketing .nav-hamburger {
    display: none !important;
  }
  body.sw-home .sw-desk-nav {
    display: flex !important;
  }
  body.sw-home .sw-phone-nav {
    display: none !important;
  }
}

@media (max-width: 899px) {
  body.marketing .nav-links,
  body.marketing .nav-actions {
    display: none !important;
  }
  body.marketing .nav-hamburger {
    display: flex !important;
  }
  body.sw-home .sw-desk-nav {
    display: none !important;
  }
  body.sw-home .sw-phone-nav {
    display: flex !important;
  }
}

@media (min-width: 900px) and (max-width: 1280px) {
  body.marketing .nav-links a {
    padding: 8px 8px;
    font-size: 13px;
  }
  body.marketing .nav-actions { gap: 8px; }
}

@media (max-width: 640px) {
  body.marketing .mkt-hero { padding: 28px 0 36px; }
  body.marketing .nav-inner { padding-inline: 14px; }
}
