/* Star Mark Agency — unified service navigation and service dock */
:root {
  --sm-ui-header-height: 78px;
  --sm-ui-max: 1440px;
  --sm-ui-bg: rgba(3, 8, 18, .92);
  --sm-ui-surface: rgba(7, 13, 29, .96);
  --sm-ui-text: var(--text, #f7f8fc);
  --sm-ui-muted: var(--muted, #9aa7bd);
  --sm-ui-muted-strong: var(--muted-strong, #cbd3e1);
  --sm-ui-line: var(--line, rgba(255, 255, 255, .11));
  --sm-ui-line-strong: var(--line-strong, rgba(255, 255, 255, .2));
  --sm-ui-gold: var(--gold, #eac266);
  --sm-ui-gold-light: var(--gold-light, #ffe7a5);
  --sm-ui-gold-rgb: var(--gold-rgb, 234, 194, 102);
  --sm-ui-accent: var(--accent, var(--cyan, #62dff7));
  --sm-ui-ease: var(--ease, cubic-bezier(.2, .75, .25, 1));
}

.site-header {
  position: fixed !important;
  z-index: 1650 !important;
  inset: 0 0 auto !important;
  width: 100% !important;
  height: var(--sm-ui-header-height) !important;
  border: 0 !important;
  border-bottom: 1px solid transparent !important;
  background: transparent !important;
  box-shadow: none !important;
  transition: background .3s ease, border-color .3s ease, transform .35s var(--sm-ui-ease) !important;
}
.site-header.is-scrolled {
  border-bottom-color: var(--sm-ui-line) !important;
  background: var(--sm-ui-bg) !important;
  box-shadow: 0 14px 40px rgba(0, 0, 0, .16) !important;
  -webkit-backdrop-filter: blur(22px) saturate(135%) !important;
  backdrop-filter: blur(22px) saturate(135%) !important;
}
.site-header.is-hidden { transform: translateY(-110%) !important; }
.site-header .header-inner {
  width: min(calc(100% - 48px), var(--sm-ui-max)) !important;
  height: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: clamp(18px, 2vw, 34px) !important;
}
.site-header .brand {
  min-width: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  text-decoration: none !important;
}
.site-header .brand picture,
.site-header .brand img {
  width: 124px !important;
  height: 62px !important;
}
.site-header .brand img {
  display: block !important;
  object-fit: contain !important;
  object-position: left center !important;
}
.site-header .desktop-nav {
  min-width: 0 !important;
  justify-self: center !important;
  display: flex !important;
  align-items: center !important;
  gap: clamp(16px, 2.15vw, 38px) !important;
}
.site-header .desktop-nav a {
  position: relative !important;
  padding: 10px 0 !important;
  color: var(--sm-ui-muted-strong) !important;
  font-size: .72rem !important;
  font-weight: 850 !important;
  line-height: 1 !important;
  letter-spacing: .12em !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}
.site-header .desktop-nav a::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 100% !important;
  bottom: 3px !important;
  height: 1px !important;
  background: var(--sm-ui-gold) !important;
  transition: right .3s var(--sm-ui-ease) !important;
}
.site-header .desktop-nav a:hover::after,
.site-header .desktop-nav a:focus-visible::after { right: 0 !important; }
.site-header .header-actions {
  min-width: max-content !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 9px !important;
}
.site-header .language-switch {
  display: flex !important;
  align-items: center !important;
  gap: 2px !important;
  padding: 4px !important;
  border: 1px solid var(--sm-ui-line) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, .025) !important;
}
.site-header .language-switch a,
.site-header .language-switch span {
  min-width: 34px !important;
  min-height: 34px !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  border: 0 !important;
  border-radius: 50% !important;
  font-size: .69rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
}
.site-header .language-switch span {
  color: #070914 !important;
  background: var(--sm-ui-gold) !important;
}
.site-header .language-switch a { color: var(--sm-ui-muted) !important; }
.site-header .language-switch a:hover,
.site-header .language-switch a:focus-visible { color: var(--sm-ui-text) !important; }
.site-header .icon-button,
.mobile-menu .icon-button {
  width: 43px !important;
  height: 43px !important;
  min-width: 43px !important;
  min-height: 43px !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid var(--sm-ui-line) !important;
  border-radius: 50% !important;
  color: var(--sm-ui-text) !important;
  background: rgba(255, 255, 255, .035) !important;
  box-shadow: none !important;
  cursor: pointer !important;
  transition: transform .2s ease, border-color .2s ease, color .2s ease, background .2s ease !important;
}
.site-header .icon-button svg,
.mobile-menu .icon-button svg {
  width: 20px !important;
  height: 20px !important;
}
.site-header .icon-button:hover,
.site-header .icon-button:focus-visible,
.mobile-menu .icon-button:hover,
.mobile-menu .icon-button:focus-visible {
  transform: translateY(-2px) !important;
  color: var(--sm-ui-accent) !important;
  border-color: color-mix(in srgb, var(--sm-ui-accent) 52%, transparent) !important;
  background: color-mix(in srgb, var(--sm-ui-accent) 9%, transparent) !important;
}
.site-header .header-cta {
  min-height: 44px !important;
  padding: 0 18px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  border: 1px solid transparent !important;
  border-radius: 999px !important;
  color: #070914 !important;
  background: linear-gradient(120deg, var(--sm-ui-gold-light), var(--sm-ui-gold)) !important;
  box-shadow: none !important;
  font-size: .82rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transition: transform .25s var(--sm-ui-ease), box-shadow .25s ease !important;
}
.site-header .header-cta svg { width: 18px !important; height: 18px !important; }
.site-header .header-cta:hover,
.site-header .header-cta:focus-visible {
  transform: translateY(-2px) !important;
  box-shadow: 0 14px 36px rgba(var(--sm-ui-gold-rgb), .22) !important;
}
.site-header .mobile-menu-button { display: none !important; }

.mobile-menu {
  position: fixed !important;
  z-index: 2200 !important;
  inset: 0 !important;
}
.mobile-menu[hidden] { display: none !important; }
.mobile-menu__backdrop {
  position: absolute !important;
  inset: 0 !important;
  background: rgba(0, 0, 0, .74) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  backdrop-filter: blur(8px) !important;
}
.mobile-menu__panel {
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  width: min(88vw, 430px) !important;
  height: 100% !important;
  padding: 100px 30px 42px !important;
  display: flex !important;
  flex-direction: column !important;
  border: 0 !important;
  border-left: 1px solid var(--sm-ui-line) !important;
  background: var(--sm-ui-surface) !important;
  box-shadow: -30px 0 90px rgba(0, 0, 0, .54) !important;
  animation: sm-ui-panel-in .35s var(--sm-ui-ease) both !important;
  overflow-y: auto !important;
}
.mobile-menu__panel > a {
  padding: 17px 4px !important;
  border-bottom: 1px solid var(--sm-ui-line) !important;
  color: var(--sm-ui-text) !important;
  font-size: 1.04rem !important;
  font-weight: 820 !important;
  text-decoration: none !important;
}
.mobile-menu__panel > a:hover,
.mobile-menu__panel > a:focus-visible { color: var(--sm-ui-gold-light) !important; }
.mobile-menu__close { position: absolute !important; top: 24px !important; right: 24px !important; }
@keyframes sm-ui-panel-in { from { transform: translateX(100%); } to { transform: none; } }

.service-dock {
  position: fixed !important;
  z-index: 1850 !important;
  right: max(18px, env(safe-area-inset-right)) !important;
  bottom: max(20px, env(safe-area-inset-bottom)) !important;
  width: 68px !important;
  height: 68px !important;
  pointer-events: none !important;
}
.service-dock__ship {
  --ship-tilt: 0deg;
  --ship-thrust: 0;
  position: absolute !important;
  inset: 0 !important;
  width: 68px !important;
  height: 68px !important;
  min-width: 68px !important;
  min-height: 68px !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid rgba(var(--sm-ui-gold-rgb), .42) !important;
  border-radius: 24px !important;
  color: var(--sm-ui-gold-light) !important;
  background: linear-gradient(145deg, rgba(19, 29, 57, .95), rgba(5, 9, 23, .98)) !important;
  box-shadow: 0 22px 55px rgba(0, 0, 0, .46) !important;
  cursor: pointer !important;
  pointer-events: auto !important;
  transform: rotate(var(--ship-tilt)) !important;
  animation: sm-ui-ship-hover 3.8s ease-in-out infinite !important;
  transition: border-color .2s ease, box-shadow .2s ease !important;
}
.service-dock__ship:hover,
.service-dock__ship:focus-visible {
  border-color: rgba(var(--sm-ui-gold-rgb), .76) !important;
  box-shadow: 0 22px 60px rgba(0, 0, 0, .5), 0 0 28px rgba(var(--sm-ui-gold-rgb), .18) !important;
}
.service-dock__ship svg {
  width: 38px !important;
  height: 38px !important;
  transform: translateY(-2px) !important;
}
.service-dock__ship > span {
  position: absolute !important;
  left: 50% !important;
  top: 53px !important;
  width: 12px !important;
  height: calc(12px + var(--ship-thrust) * 13px) !important;
  transform: translateX(-50%) !important;
  border-radius: 50% !important;
  opacity: calc(.42 + var(--ship-thrust) * .55) !important;
  background: linear-gradient(to bottom, #fff4bd, #ff9a47 42%, transparent) !important;
  filter: drop-shadow(0 5px 8px rgba(255, 157, 64, .75)) !important;
}
.service-dock__menu {
  position: absolute !important;
  right: 4px !important;
  bottom: 82px !important;
  width: min(350px, calc(100vw - 32px)) !important;
  max-height: min(72dvh, 720px) !important;
  overflow: auto !important;
  padding: 14px !important;
  border: 1px solid var(--sm-ui-line-strong) !important;
  border-radius: 24px !important;
  background: rgba(5, 9, 23, .95) !important;
  box-shadow: 0 28px 80px rgba(0, 0, 0, .58) !important;
  -webkit-backdrop-filter: blur(24px) !important;
  backdrop-filter: blur(24px) !important;
  pointer-events: auto !important;
  animation: sm-ui-dock-open .28s var(--sm-ui-ease) both !important;
}
.service-dock__menu[hidden] { display: none !important; }
.service-dock__menu > span {
  display: block !important;
  padding: 7px 10px 12px !important;
  color: var(--sm-ui-gold) !important;
  font-size: .61rem !important;
  font-weight: 950 !important;
  letter-spacing: .16em !important;
}
.service-dock__menu a {
  min-height: 61px !important;
  padding: 9px 10px !important;
  display: grid !important;
  grid-template-columns: 42px 1fr !important;
  align-items: center !important;
  column-gap: 12px !important;
  border: 0 !important;
  border-radius: 16px !important;
  color: var(--sm-ui-text) !important;
  background: transparent !important;
  text-decoration: none !important;
}
.service-dock__menu a:hover,
.service-dock__menu a:focus-visible { background: rgba(98, 223, 247, .08) !important; }
.service-dock__menu a > svg {
  grid-row: 1 / span 2 !important;
  width: 23px !important;
  height: 23px !important;
  justify-self: center !important;
  color: var(--sm-ui-gold) !important;
}
.service-dock__menu strong {
  align-self: end !important;
  color: var(--sm-ui-text) !important;
  font-size: .78rem !important;
  line-height: 1.2 !important;
}
.service-dock__menu small {
  align-self: start !important;
  color: var(--sm-ui-muted) !important;
  font-size: .66rem !important;
  line-height: 1.35 !important;
}
.service-dock__menu hr { width: 100% !important; border: 0 !important; border-top: 1px solid var(--sm-ui-line) !important; }
@keyframes sm-ui-ship-hover { 50% { translate: 0 -7px; } }
@keyframes sm-ui-dock-open { from { opacity: 0; transform: translateY(13px) scale(.92); } to { opacity: 1; transform: none; } }

@media (max-width: 1180px) {
  .site-header .header-inner { width: min(calc(100% - 34px), var(--sm-ui-max)) !important; gap: 16px !important; }
  .site-header .desktop-nav { gap: 18px !important; }
  .site-header .desktop-nav a { font-size: .68rem !important; letter-spacing: .09em !important; }
  .site-header .header-cta { padding-inline: 15px !important; }
}
@media (max-width: 1020px) {
  .site-header .desktop-nav { display: none !important; }
  .site-header .mobile-menu-button { display: grid !important; }
}
@media (max-width: 700px) {
  :root { --sm-ui-header-height: 72px; }
  .site-header .header-inner { width: calc(100% - 24px) !important; gap: 7px !important; }
  .site-header .brand picture,
  .site-header .brand img { width: 104px !important; height: 54px !important; }
  .site-header .header-cta { display: none !important; }
  .site-header .header-actions { gap: 6px !important; }
  .site-header .icon-button { width: 40px !important; height: 40px !important; min-width: 40px !important; min-height: 40px !important; }
  .site-header .language-switch { padding: 3px !important; }
  .site-header .language-switch a,
  .site-header .language-switch span { min-width: 31px !important; min-height: 31px !important; }
  .service-dock { right: 14px !important; bottom: calc(14px + env(safe-area-inset-bottom)) !important; width: 60px !important; height: 60px !important; }
  .service-dock__ship { width: 60px !important; height: 60px !important; min-width: 60px !important; min-height: 60px !important; border-radius: 21px !important; }
  .service-dock__ship svg { width: 33px !important; height: 33px !important; }
  .service-dock__ship > span { top: 47px !important; }
  .service-dock__menu { right: 0 !important; bottom: 72px !important; }
}
@media (max-width: 390px) {
  .site-header .brand picture,
  .site-header .brand img { width: 92px !important; }
  .site-header .language-switch a,
  .site-header .language-switch span { min-width: 29px !important; min-height: 29px !important; font-size: .64rem !important; }
  .site-header .icon-button { width: 38px !important; height: 38px !important; min-width: 38px !important; min-height: 38px !important; }
}

@media (prefers-reduced-motion: reduce) {
  .site-header,
  .site-header *,
  .mobile-menu__panel,
  .service-dock__ship,
  .service-dock__menu { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
html.reduce-motion .service-dock__ship,
html.reduce-motion .service-dock__menu,
html.reduce-motion .mobile-menu__panel { animation: none !important; }