/* ── Header ─────────────────────────────────────────────────────────────── */

header {
  position:      sticky;
  top:           0;
  z-index:       100;
  background:    #1B3A3A;
  border-bottom: 1px solid rgba(255,255,255,.08);
  box-shadow:    0 4px 16px rgba(0,0,0,.18);
}

.header-inner {
  width:           90%;
  max-width:       1920px;
  margin:          0 auto;
  padding:         14px 0;
  display:         flex;
  justify-content: space-between;
  align-items:     center;
  gap:             24px;
}

.logo-group {
  display:     flex;
  align-items: center;
  gap:         12px;
}

.logo-group a { display: flex; }

.logo-group img {
  width:         40px;
  border-radius: 10px;
}

.header-nav {
  display:       flex;
  align-items:   center;
  gap:           28px;
  flex:          1 1 auto;
  padding-right: 24px;
  border-right:  1px solid rgba(255,255,255,.12);
}

.header-nav a {
  position:    relative;
  color:       #D8E4E2;
  font-weight: 600;
  padding:     4px 0;
  transition:  color .15s;
}

.header-nav a::after {
  content:    "";
  position:   absolute;
  left:       0;
  right:      0;
  bottom:     0;
  height:     2px;
  background: var(--orange);
  transform:  scaleX(0);
  transition: transform .2s ease;
}

.header-nav a:hover { color: #fff; }

.header-nav a:hover::after { transform: scaleX(1); }

/* Hidden on desktop — the .header-cta button takes its place */
.mobile-cta { display: none; }

.header-cta {
  background:    linear-gradient(135deg, var(--orange) 0%, var(--orange-dk) 100%);
  color:         #fff;
  padding:       10px 22px;
  border-radius: 10px;
  font-weight:   700;
  font-size:     .88rem;
  white-space:   nowrap;
  transition:    transform .15s, box-shadow .15s;
}

.header-cta:hover {
  transform:  translateY(-2px);
  box-shadow: 0 8px 18px rgba(224,123,84,.35);
}


/* ── Hamburger ───────────────────────────────────────────────────────────── */

.hamburger {
  display:         none;
  flex-direction:  column;
  justify-content: center;
  gap:             5px;
  background:      none;
  border:          none;
  cursor:          pointer;
  padding:         4px;
  width:           36px;
  height:          36px;
  flex-shrink:     0;
}

.hamburger span {
  display:       block;
  width:         24px;
  height:        2px;
  background:    #D8E4E2;
  border-radius: 2px;
  transition:    transform .25s ease, opacity .25s ease;
}

header.nav-open .hamburger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
header.nav-open .hamburger span:nth-child(2) { opacity: 0; transform: scaleX(0); }
header.nav-open .hamburger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }