/* Shared Calm Waters shell — used by all public tools and forms. */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:wght@500;600;700&display=swap');

:root {
  --navy: #0e3048 !important;
  --deep-navy: #082234 !important;
  --deep: #082234 !important;
  --teal: #2f8583 !important;
  --calm-blue: #2f8583 !important;
  --sea-glass: #d9eff0 !important;
  --water-blue: #d9eff0 !important;
  --cream: #fcfaf5 !important;
  --warm-white: #fcfaf5 !important;
  --sand: #e9dcc5 !important;
  --gold: #b58b4d !important;
  --ink: #20313a !important;
  --charcoal: #20313a !important;
  --muted: #61717a !important;
  --line: rgba(14, 48, 72, .15) !important;
}

body { font-family: 'DM Sans', Arial, sans-serif !important; background: var(--cream) !important; color: var(--ink) !important; }
h1, h2, h3, h4, .panel-head h2, .side-card h2 { font-family: 'Playfair Display', Georgia, serif !important; color: var(--navy) !important; }
p { color: var(--muted) !important; }

header, .site-header {
  position: sticky !important;
  top: 0 !important;
  background: rgba(252,250,245,.97) !important;
  border-bottom: 1px solid var(--line) !important;
  box-shadow: none !important;
  backdrop-filter: blur(12px);
}
header.scrolled { background: rgba(252,250,245,.97) !important; border-color: var(--line) !important; }
.nav { min-height: 86px !important; }
.brand { gap: .8rem !important; font-family: 'Playfair Display', Georgia, serif !important; color: var(--navy) !important; }
.brand-mark {
  width: 46px !important; height: 46px !important; color: transparent !important;
  background: #fcfaf5 !important; border: 2px solid var(--gold) !important;
  box-shadow: none !important; position: relative; overflow: hidden;
}
.brand-mark::before { content: ''; position: absolute; width: 12px; height: 12px; border-radius: 50%; background: var(--gold); top: 7px; left: 15px; }
.brand-mark::after { content: '⌁'; position: absolute; left: 8px; bottom: 0; color: var(--teal); font: 700 2rem/1 Georgia, serif; }
.brand-copy { font-size: 1.12rem !important; font-weight: 600 !important; }
.brand-copy small { color: var(--teal) !important; letter-spacing: .12em !important; font: 700 .62rem/1 'DM Sans', Arial, sans-serif !important; margin-top: 5px !important; }
.nav-links { color: var(--navy) !important; gap: 1.4rem !important; }
.nav-links a { font-family: 'DM Sans', Arial, sans-serif !important; font-weight: 700 !important; }
.nav-links a.active { color: var(--teal) !important; }
.nav-links .nav-group { position: relative; display: flex; align-items: center; }
.nav-links .nav-group-head { display: flex; align-items: center; white-space: nowrap; }
.nav-links .nav-group-head > a { padding: 12px 4px; text-decoration: none; }
.nav-links .nav-submenu-toggle { display: grid; place-items: center; width: 28px; height: 34px; padding: 0; border: 0; background: transparent; color: var(--navy); cursor: pointer; font-size: .72rem; transition: transform .2s ease; }
.nav-links .nav-group.open .nav-submenu-toggle { transform: rotate(180deg); }
.nav-links .nav-submenu { display: none; position: absolute; z-index: 80; top: calc(100% - 2px); left: 0; width: max-content; min-width: 220px; max-width: 290px; padding: 9px; background: rgba(252,250,245,.99); border: 1px solid var(--line); border-radius: 13px; box-shadow: 0 20px 45px rgba(8,34,52,.16); }
.nav-links .nav-group.open .nav-submenu,.nav-links .nav-group:hover .nav-submenu,.nav-links .nav-group:focus-within .nav-submenu { display: grid; }
.nav-links .nav-submenu a { display: block; padding: 10px 12px; border-radius: 8px; color: var(--navy) !important; font-size: .84rem !important; line-height: 1.25; text-decoration: none; }
.nav-links .nav-submenu a:hover,.nav-links .nav-submenu a:focus-visible { background: #eaf5f2; color: var(--teal) !important; }
.btn, .button { border-radius: 3px !important; font-family: 'DM Sans', Arial, sans-serif !important; font-weight: 700 !important; }
.btn-primary, .button.primary { background: var(--navy) !important; border-color: var(--navy) !important; color: #fff !important; box-shadow: none !important; }
.btn-primary:hover, .button.primary:hover { background: var(--teal) !important; border-color: var(--teal) !important; }

.hero { background: linear-gradient(115deg, var(--deep-navy), var(--navy) 68%, #17465c) !important; }
.hero h1, .hero p { color: #fff !important; }
.hero .eyebrow, .hero-eyebrow { color: #c4e5e3 !important; }
.hero .truth-card, .hero-card { border-radius: 3px !important; }
.side-card, .main-card, .card, .receipt, .status-card { border-radius: 4px !important; box-shadow: 0 18px 45px rgba(8,34,52,.10) !important; }
.main-card, .side-card, .card { background: #fff !important; }
.tab-button.active { background: var(--navy) !important; border-color: var(--navy) !important; }
.notice { border-left-color: var(--teal) !important; }
input, select, textarea { background: #fffdfa !important; border-radius: 3px !important; }
.footer-row, footer { background: var(--deep-navy) !important; }

@media (max-width: 1040px) {
  .nav-links { background: var(--cream) !important; border-bottom: 1px solid var(--line) !important; }
  .nav-links .nav-group { display: block; width: 100%; border-bottom: 1px solid rgba(14,48,72,.08); }
  .nav-links .nav-group-head { justify-content: space-between; width: 100%; }
  .nav-links .nav-group-head > a { flex: 1; padding: 12px 8px; }
  .nav-links .nav-submenu-toggle { width: 44px; height: 44px; }
  .nav-links .nav-submenu,.nav-links .nav-group:hover .nav-submenu,.nav-links .nav-group:focus-within .nav-submenu { display: none; position: static; width: 100%; max-width: none; min-width: 0; padding: 0 8px 10px 18px; border: 0; border-radius: 0; box-shadow: none; background: transparent; }
  .nav-links .nav-group.open .nav-submenu { display: grid; }
}

/* Careers uses the same hamburger-triggered dropdown menu as the other branded pages. */
body:has(.career-hero) .nav { position: relative; }
body:has(.career-hero) .nav-toggle { display: block !important; cursor: pointer; }
body:has(.career-hero) .nav-links {
  display: none !important;
  position: absolute !important;
  top: calc(100% - 7px) !important;
  right: 0 !important;
  left: auto !important;
  width: min(350px, calc(100vw - 28px));
  padding: 14px !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 3px !important;
  background: rgba(252,250,245,.99) !important;
  border: 1px solid rgba(14,48,72,.13) !important;
  border-radius: 16px !important;
  box-shadow: 0 22px 50px rgba(8,34,52,.16) !important;
}
body:has(.career-hero) .nav-links.open { display: flex !important; }
body:has(.career-hero) .nav-links > a { width: 100%; padding: 11px 13px; border-radius: 9px; }
body:has(.career-hero) .nav-links > a:hover,
body:has(.career-hero) .nav-links > a:focus-visible { background: #eaf5f2; }
body:has(.career-hero) .nav-links .nav-cta { margin-top: 5px; text-align: center; }
