/* Shared A1 chrome. Keep these values matched to index-A1.html. */
:root {
  --pantone-blue: #31599c;
  --pantone-yellow: #f9b323;
  --navy: #001d33;
  --yellow: #f9b323;
  --white: #f6f7fb;
}

body {
  zoom: 1.2 !important;
}

.topbar {
  position: sticky !important;
  top: 0 !important;
  z-index: 20 !important;
  height: 66px !important;
  border-bottom: 2px solid var(--yellow) !important;
  background: linear-gradient(90deg, rgba(0, 29, 51, .98) 0%, rgba(32, 68, 126, .96) 48%, rgba(41, 75, 141, .94) 100%) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 28px !important;
  font-weight: 700 !important;
  font-size: 8px !important;
  letter-spacing: 3px !important;
  backdrop-filter: none !important;
}

.topbar-inner {
  width: min(1320px, 100%) !important;
  min-height: 0 !important;
  display: grid !important;
  grid-template-columns: 142px 190px 1fr 72px !important;
  align-items: center !important;
  gap: 18px !important;
  margin: 0 !important;
}

.brand-mark {
  width: 128px !important;
  height: auto !important;
  justify-self: start !important;
  background: transparent !important;
  border-radius: 3px !important;
  display: block !important;
  overflow: visible !important;
  padding: 0 !important;
  box-shadow: 0 8px 18px rgba(0, 0, 0, .18) !important;
}

.brand-logo {
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
  object-fit: initial !important;
  object-position: initial !important;
  display: block !important;
  filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .25)) !important;
}

.brand-logo.is-loaded { display: block !important; }

.catalog-mini {
  justify-self: start !important;
  border: 1px solid var(--yellow) !important;
  border-radius: 4px !important;
  width: 182px !important;
  padding: 8px 10px !important;
  line-height: 1 !important;
  text-align: center !important;
  white-space: nowrap !important;
  font-family: "Montserrat", Arial, Helvetica, sans-serif !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  color: var(--yellow) !important;
  text-transform: none !important;
  background: transparent !important;
}

.catalog-mini:hover,
.catalog-mini:focus-visible {
  background: var(--yellow) !important;
  color: var(--navy) !important;
  transform: translateY(-2px) scale(1.04) !important;
  box-shadow: 0 0 0 2px rgba(249, 179, 35, .42), 0 0 26px rgba(249, 179, 35, .48) !important;
  outline: 0 !important;
}

.main-nav {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 24px !important;
  white-space: nowrap !important;
  flex: initial !important;
  color: inherit !important;
}

.main-nav a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0 !important;
  line-height: 1 !important;
  border-radius: 3px !important;
  padding: 8px 4px !important;
  margin: -8px -4px !important;
  font-family: "Montserrat", Arial, Helvetica, sans-serif !important;
  font-weight: 500 !important;
  text-transform: none !important;
  font-size: 14px !important;
  letter-spacing: 0 !important;
  color: rgba(246, 247, 251, .86) !important;
  background: transparent !important;
}

.main-nav a:hover,
.main-nav a:focus-visible {
  background: var(--pantone-yellow) !important;
  color: var(--pantone-blue) !important;
  transform: translateY(-2px) scale(1.04) !important;
  text-shadow: none !important;
  box-shadow: 0 0 0 1px rgba(255, 163, 0, .35), 0 8px 18px rgba(0, 0, 0, .22) !important;
  outline: 0 !important;
}

.main-nav a::before,
.main-nav .larsson::before { content: none !important; }

.main-nav .larsson {
  color: #ff4ea3 !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
}

.nav-millard {
  color: var(--yellow) !important;
  font-weight: 700 !important;
}

.language {
  justify-self: end !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  font-family: "Montserrat", Arial, Helvetica, sans-serif !important;
  font-size: 12px !important;
  font-weight: 550 !important;
  letter-spacing: .4px !important;
  text-transform: uppercase !important;
}

.language:hover,
.language:focus-within {
  transform: translateY(-2px) scale(1.08) !important;
  filter: drop-shadow(0 0 10px rgba(255, 255, 255, .45)) !important;
}

.crest {
  width: 24px !important;
  height: 24px !important;
  background: var(--white) !important;
  border-radius: 50% !important;
  position: relative !important;
  display: inline-block !important;
}

.top-cta {
  position: fixed !important;
  right: 30px !important;
  top: 82px !important;
  z-index: 19 !important;
  background: rgba(255, 163, 0, .94) !important;
  color: #001d33 !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255, 255, 255, .46) !important;
  padding: 12px 22px !important;
  font-family: "Inter", "Aptos", "Segoe UI Variable", "Segoe UI", Arial, Helvetica, sans-serif !important;
  font-size: 13px !important;
  line-height: 1 !important;
  font-weight: 650 !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
  backdrop-filter: blur(14px) saturate(1.25) !important;
  overflow: hidden !important;
  isolation: isolate !important;
  box-shadow: 0 14px 32px rgba(0, 29, 51, .22), 0 1px 0 rgba(255, 255, 255, .58) inset !important;
  animation: cta-pulse 4.2s ease-in-out infinite !important;
  text-shadow: none !important;
  width: auto !important;
  min-height: 0 !important;
}

.top-cta::before {
  content: "" !important;
  position: absolute !important;
  inset: 1px !important;
  border-radius: inherit !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, .34), rgba(255, 255, 255, 0)) !important;
  z-index: -1 !important;
}

.top-cta::after {
  content: "" !important;
  position: absolute !important;
  inset: -45% auto -45% -60% !important;
  width: 38% !important;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .9), transparent) !important;
  transform: skewX(-18deg) !important;
  animation: cta-shine 4.2s ease-in-out infinite !important;
  z-index: 0 !important;
  pointer-events: none !important;
}

.top-cta:hover,
.top-cta:focus-visible {
  transform: translateY(-4px) scale(1.06) !important;
  color: #001d33 !important;
  background: rgba(255, 180, 45, .98) !important;
  box-shadow: 0 18px 40px rgba(0, 29, 51, .28), 0 0 0 4px rgba(255, 255, 255, .18), 0 0 28px rgba(255, 163, 0, .32) !important;
  outline: 0 !important;
}

@keyframes cta-shine {
  0%, 48% { left: -55%; }
  63%, 100% { left: 120%; }
}

@keyframes cta-pulse {
  0%, 100% { box-shadow: 0 14px 32px rgba(0, 29, 51, .22), 0 1px 0 rgba(255, 255, 255, .58) inset; }
  56% { box-shadow: 0 14px 32px rgba(0, 29, 51, .22), 0 1px 0 rgba(255, 255, 255, .58) inset, 0 0 26px rgba(255, 163, 0, .3); }
}

.bottom-cta {
  min-height: 320px !important;
  display: grid !important;
  align-items: center !important;
  padding-top: 52px !important;
  padding-bottom: 70px !important;
  padding-inline: 28px !important;
  background: transparent !important;
  text-align: initial !important;
  border-top: 0 !important;
}

.footer-links {
  width: min(940px, 100%) !important;
  margin: 0 auto 58px !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 34px !important;
  color: var(--white) !important;
  text-align: center !important;
  text-transform: none !important;
}

.footer-link-group {
  display: grid !important;
  align-content: start !important;
  justify-items: center !important;
  gap: 13px !important;
}

.footer-link-title {
  color: var(--yellow) !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
}

.footer-links a {
  width: auto !important;
  max-width: 100% !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: .2px !important;
  text-transform: none !important;
  color: var(--white) !important;
}

.footer-links a:hover,
.footer-links a:focus-visible {
  color: var(--yellow) !important;
  transform: translateY(-2px) scale(1.08) !important;
  text-shadow: 0 0 14px rgba(249, 179, 35, .55) !important;
  outline: 0 !important;
}

.bottom-wrap {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 28px !important;
}

.arrow-stack {
  width: 42px !important;
  height: 58px !important;
  color: var(--white) !important;
  font-size: 72px !important;
  line-height: .72 !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-weight: 900 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-shadow: 10px 0 0 var(--yellow), 20px 0 0 var(--white) !important;
}

.arrow-stack::before { content: "\2039" !important; }
.bottom-wrap .arrow-stack { transform: scale(1.2) !important; }
.bottom-wrap .arrow-stack:first-child { text-shadow: -10px 0 0 var(--yellow), -20px 0 0 var(--white) !important; }
.bottom-wrap .arrow-stack:first-child::before { content: "\203A" !important; }
.bottom-wrap .arrow-stack:last-child { text-shadow: 10px 0 0 var(--yellow), 20px 0 0 var(--white) !important; }
.bottom-wrap .arrow-stack:last-child::before { content: "\2039" !important; }

.big-cta {
  width: min(350px, 54vw) !important;
  border: 2px solid var(--yellow) !important;
  color: var(--white) !important;
  text-align: center !important;
  padding: 15px 20px !important;
  font-size: 15px !important;
  letter-spacing: 10px !important;
  font-weight: 950 !important;
  position: relative !important;
  background: transparent !important;
  border-radius: 0 !important;
  text-transform: uppercase !important;
}

.big-cta:hover,
.big-cta:focus-visible {
  background: var(--yellow) !important;
  color: var(--navy) !important;
  transform: scale(1.03) !important;
  outline: 0 !important;
}

.big-cta::before,
.big-cta::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  height: 1px !important;
  background: var(--yellow) !important;
}

.big-cta::before { top: -14px !important; }
.big-cta::after { bottom: -14px !important; }

.footer {
  min-height: 62px !important;
  padding: 0 30px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  color: var(--white) !important;
  font-size: 8px !important;
  font-weight: 950 !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  border-top: 0 !important;
  background: transparent !important;
}

.construction {
  min-height: auto !important;
  padding: 28px 0 24px !important;
}

.construction-panel {
  width: min(350px, 100%) !important;
  padding: 16px clamp(14px, 2vw, 22px) !important;
  border-radius: 12px !important;
}

.construction-panel::before { opacity: .75 !important; }
.brand-title { font-size: clamp(20px, 3vw, 26px) !important; margin-bottom: 4px !important; }
.subtitle { font-size: clamp(8px, .9vw, 10px) !important; margin-bottom: 13px !important; letter-spacing: .18em !important; }
.gear-mark { width: 44px !important; height: 44px !important; margin-bottom: 13px !important; }
.gear { width: 28px !important; height: 28px !important; box-shadow: 0 0 0 6px rgba(249, 179, 35, .13) !important; }
.gear.small { width: 18px !important; height: 18px !important; right: 3px !important; bottom: 0 !important; }
.gear::before,
.gear.small::before { box-shadow: 0 0 0 6px currentColor !important; }
.construction-panel h1 { font-size: clamp(20px, 3vw, 25px) !important; margin-bottom: 8px !important; }
.lead { max-width: 310px !important; font-size: clamp(10px, 1vw, 12px) !important; line-height: 1.4 !important; margin-bottom: 12px !important; }
.actions { gap: 8px !important; }
.action { min-height: 28px !important; padding: 0 10px !important; font-size: 10px !important; }

@media (max-width: 820px) and (min-width: 641px) {
  .topbar { padding-inline: 14px !important; height: 56px !important; font-size: 4.8px !important; letter-spacing: 1px !important; }
  .topbar-inner { grid-template-columns: 76px 108px 1fr 24px !important; gap: 5px !important; }
  .brand-mark { width: 68px !important; height: auto !important; }
  .catalog-mini { width: 106px !important; padding: 6px 4px !important; font-size: 7.2px !important; letter-spacing: 0 !important; }
  .main-nav { gap: 9px !important; }
  .main-nav a { font-size: 8px !important; letter-spacing: 0 !important; }
  .language { gap: 4px !important; font-size: 7px !important; }
  .crest { width: 18px !important; height: 20px !important; }
}

@media (max-width: 640px) {
  body { zoom: 1 !important; }
  .topbar { height: auto !important; padding-block: 10px !important; }
  .topbar-inner { grid-template-columns: 1fr !important; justify-items: center !important; }
  .brand-mark { justify-self: center !important; width: min(118px, 52vw) !important; height: auto !important; }
  .catalog-mini,
  .language { justify-self: center !important; }
  .main-nav { flex-wrap: wrap !important; gap: 12px !important; }
  .top-cta { top: 18px !important; right: 18px !important; }
  .footer-links { grid-template-columns: 1fr !important; text-align: center !important; }
  .bottom-wrap { gap: 2px !important; }
}
