/* MobileNav — visible only below 1024px (Mobile_Navigation_Spec.md
   section 2: one breakpoint, no intermediate tablet state). */

.mobile-menu-trigger {
  display: none;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  background: none;
  border: none;
  color: var(--color-navy-900);
  cursor: pointer;
  flex-shrink: 0;
}

@media (max-width: 1023px) {
  .mobile-menu-trigger {
    display: inline-flex;
  }
}

.mobile-panel {
  position: fixed;
  inset: 0;
  top: 64px;
  z-index: 200;
  background: var(--color-sand-50);
  display: none;
  flex-direction: column;
  opacity: 0;
  transform: translateY(8px);
  visibility: hidden;
  overscroll-behavior: contain;
  transition:
    opacity var(--duration-base) var(--ease-standard),
    transform var(--duration-base) var(--ease-standard),
    visibility 0s linear var(--duration-base);
}

@media (max-width: 1023px) {
  .mobile-panel {
    display: flex;
  }
}

.mobile-panel--open {
  opacity: 1;
  transform: translateY(0);
  visibility: visible;
  transition:
    opacity var(--duration-base) var(--ease-standard),
    transform var(--duration-base) var(--ease-standard),
    visibility 0s linear 0s;
}

@media (prefers-reduced-motion: reduce) {
  .mobile-panel {
    transition: visibility 0s linear var(--duration-base);
  }
  .mobile-panel--open {
    transition: visibility 0s linear 0s;
  }
}

.mobile-panel-scroll {
  flex: 1;
  overflow-y: auto;
}

.mobile-panel-column {
  max-width: 560px;
  margin: 0 auto;
  padding: var(--space-4) var(--gutter-mobile);
}

@media (max-width: 379px) {
  .mobile-panel-column {
    padding-left: var(--gutter-mobile-small);
    padding-right: var(--gutter-mobile-small);
  }
}

/* Rows: 48px minimum, 64px where a descriptor is present. */
.mobile-row {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 48px;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: var(--text-base);
  color: var(--color-navy-900);
  text-decoration: none;
}

.mobile-row--with-descriptor {
  min-height: 64px;
  gap: var(--space-1);
}

.mobile-row-label {
  font-weight: 600;
}

.mobile-row-descriptor {
  font-family: var(--font-body);
  font-weight: 400;
  font-size: var(--text-sm);
  color: var(--color-slate-300);
}

.mobile-row[data-current] {
  background: var(--color-blue-200);
}

.mobile-row--pending {
  color: var(--color-slate-300);
  cursor: default;
}

.mobile-section {
  margin-top: var(--space-6);
}

.mobile-section-label {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: var(--text-sm);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--color-navy-900);
  padding-bottom: var(--space-2);
  border-bottom: 2px solid var(--color-gold-500);
  margin-bottom: var(--space-2);
}

.mobile-family-group {
  border: none;
}

.mobile-family-trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 48px;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: var(--text-base);
  color: var(--color-navy-900);
  background: none;
  border: none;
  cursor: pointer;
  text-align: left;
}

.mobile-family-chevron {
  color: var(--color-navy-900);
  flex-shrink: 0;
}

.mobile-family-items {
  list-style: none;
  margin: 0;
  padding: 0 0 0 var(--space-4);
  overflow: hidden;
}

.mobile-divider {
  border-top: 1px solid var(--color-slate-200);
  margin: var(--space-6) 0;
}

.mobile-panel-cta {
  display: none;
  text-align: center;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: var(--text-base);
  color: #ffffff;
  background: var(--color-blue-600);
  border-radius: var(--radius-md);
  padding: var(--space-4);
  text-decoration: none;
}

/* Below 380px only: the header CTA is dropped, and this pins to the
   foot of the open panel at full width (section 9). */
@media (max-width: 379px) {
  .mobile-panel-cta {
    display: block;
  }
}
.site-header[data-astro-cid-nen7h5rs] {
  position: sticky;
  top: 0;
  z-index: 100;
  width: 100%;
}

.header-glass[data-astro-cid-nen7h5rs] {
  position: absolute;
  inset: 0;
  z-index: 0;
  background: #f5fafbb8;
  backdrop-filter: blur(8px) saturate(1.2);
  -webkit-backdrop-filter: blur(8px) saturate(1.2);
  border-bottom: 1px solid #ffffff59;
  transition: background-color var(--duration-base) var(--ease-standard),
      box-shadow var(--duration-base) var(--ease-standard),
      border-color var(--duration-base) var(--ease-standard);
}

body.menu-open .header-glass[data-astro-cid-nen7h5rs] {
  background: #f5fafb80;
}

.site-header[data-astro-cid-nen7h5rs].is-solid .header-glass[data-astro-cid-nen7h5rs] {
  background: #f5fafb9e;
  border-bottom-color: #08152414;
  box-shadow: 0 6px 24px #0815240f;
}

.header-inner[data-astro-cid-nen7h5rs] {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-8);
  max-width: var(--container-max);
  margin: 0 auto;
  padding: var(--space-4) var(--gutter-desktop);
}

.logo[data-astro-cid-nen7h5rs] {
  display: block;
  flex-shrink: 0;
  line-height: 0;
  transform: translate(-2px, 3px);
}

.logo[data-astro-cid-nen7h5rs] img[data-astro-cid-nen7h5rs] {
  display: block;
  width: 240px;
  height: auto;
  min-width: 144px;
}

.primary-nav[data-astro-cid-nen7h5rs] {
  display: flex;
  align-items: center;
  gap: var(--space-7, 28px);
  flex: 1;
  justify-content: center;
}

.nav-link[data-astro-cid-nen7h5rs], .nav-trigger[data-astro-cid-nen7h5rs] {
  position: relative;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: var(--text-base);
  color: var(--color-navy-900);
  text-decoration: none;
  background: none;
  border: none;
  cursor: pointer;
  padding: var(--space-2) 0;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.nav-link[data-astro-cid-nen7h5rs]:after, .nav-trigger[data-astro-cid-nen7h5rs]:after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -2px;
  height: 2px;
  background: var(--color-gold-500);
  border-radius: 2px;
  transform: scaleX(0);
  transform-origin: center;
  transition: transform var(--duration-base) var(--ease-standard);
}

.nav-link[data-astro-cid-nen7h5rs]:hover:after, .nav-trigger[data-astro-cid-nen7h5rs]:hover:after, .nav-trigger[data-astro-cid-nen7h5rs][aria-expanded="true"]:after {
  transform: scaleX(1);
}

.nav-link[data-astro-cid-nen7h5rs]:hover, .nav-trigger[data-astro-cid-nen7h5rs]:hover, .nav-trigger[data-astro-cid-nen7h5rs][aria-expanded="true"] {
  color: var(--color-blue-600);
}

.nav-caret[data-astro-cid-nen7h5rs] {
  width: 7px;
  height: 7px;
  border-right: 1.5px solid;
  border-bottom: 1.5px solid;
  transform: rotate(45deg) translateY(-1px);
  transition: transform var(--duration-fast) var(--ease-standard);
  opacity: .7;
}

.nav-trigger[data-astro-cid-nen7h5rs][aria-expanded="true"] .nav-caret[data-astro-cid-nen7h5rs] {
  transform: rotate(-135deg) translateY(-1px);
}

.nav-item[data-astro-cid-nen7h5rs] {
  position: relative;
}

.cta-button[data-astro-cid-nen7h5rs] {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-family: var(--font-body);
  font-weight: 700;
  font-size: var(--text-base);
  color: #fff;
  background: linear-gradient(135deg, var(--color-blue-600) 0%, var(--color-blue-800) 100%);
  border-radius: var(--radius-md);
  padding: var(--space-3) var(--space-6);
  text-decoration: none;
  flex-shrink: 0;
  box-shadow: 0 4px 14px #05619052;
  transition: transform var(--duration-fast) var(--ease-standard),
      box-shadow var(--duration-fast) var(--ease-standard);
}

.cta-button[data-astro-cid-nen7h5rs]:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px #05619073;
}

.cta-arrow[data-astro-cid-nen7h5rs] {
  transition: transform var(--duration-fast) var(--ease-standard);
}

.cta-button[data-astro-cid-nen7h5rs]:hover .cta-arrow[data-astro-cid-nen7h5rs] {
  transform: translateX(3px);
}

@media (width <= 1023px) {
  .primary-nav[data-astro-cid-nen7h5rs] {
    display: none;
  }

  .header-inner[data-astro-cid-nen7h5rs] {
    min-height: 64px;
    padding-top: 0;
    padding-bottom: 0;
  }
}

@media (width <= 767px) {
  .header-inner[data-astro-cid-nen7h5rs] {
    padding-left: var(--gutter-mobile);
    padding-right: var(--gutter-mobile);
  }

  .cta-button[data-astro-cid-nen7h5rs] {
    display: none;
  }

  .logo[data-astro-cid-nen7h5rs] img[data-astro-cid-nen7h5rs] {
    width: 200px;
    min-width: 160px;
  }
}

@media (width <= 379px) {
  .header-inner[data-astro-cid-nen7h5rs] {
    padding-left: var(--gutter-mobile-small);
    padding-right: var(--gutter-mobile-small);
  }

  .logo[data-astro-cid-nen7h5rs] img[data-astro-cid-nen7h5rs] {
    width: 172px;
    min-width: 150px;
  }
}

.dropdown-panel[data-astro-cid-nen7h5rs] {
  position: absolute;
  top: calc(100% + var(--space-3));
  left: 0;
  background: #f5fafb80;
  backdrop-filter: blur(16px) saturate(1.3);
  -webkit-backdrop-filter: blur(16px) saturate(1.3);
  border: 1px solid #fff9;
  border-radius: var(--radius-lg);
  box-shadow: 0 24px 56px #08152433;
  padding: var(--space-6);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity var(--duration-base) var(--ease-standard),
      visibility var(--duration-base) var(--ease-standard);
}

.dropdown-panel[data-astro-cid-nen7h5rs].is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.dropdown-panel--flat[data-astro-cid-nen7h5rs] {
  width: 340px;
}

.dropdown-panel--mega[data-astro-cid-nen7h5rs] {
  left: 50%;
  margin-left: calc(min(1040px, 94vw) / -2);
  width: min(1040px, 94vw);
}

.mega-menu[data-astro-cid-nen7h5rs] {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr .95fr;
  gap: var(--space-6);
}

.family-group[data-astro-cid-nen7h5rs] + .family-group[data-astro-cid-nen7h5rs] {
  margin-top: var(--space-6);
}

.family-label[data-astro-cid-nen7h5rs] {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--color-navy-900);
  padding-bottom: var(--space-2);
  border-bottom: 2px solid var(--color-gold-500);
  margin-bottom: var(--space-3);
}

.family-items[data-astro-cid-nen7h5rs], .flat-list[data-astro-cid-nen7h5rs] {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.menu-item[data-astro-cid-nen7h5rs] {
  display: block;
  padding: var(--space-2) var(--space-3);
  margin: 0 calc(-1 * var(--space-3));
  border-radius: var(--radius-md);
  text-decoration: none;
  transition: background-color var(--duration-fast) var(--ease-standard);
}

.menu-item[data-astro-cid-nen7h5rs]:hover {
  background: #2e86b01a;
}

.menu-item-name[data-astro-cid-nen7h5rs] {
  display: block;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: var(--text-base);
  color: var(--color-navy-900);
  transition: color var(--duration-fast) var(--ease-standard);
}

.menu-item[data-astro-cid-nen7h5rs]:hover .menu-item-name[data-astro-cid-nen7h5rs] {
  color: var(--color-blue-700);
}

.menu-item-desc[data-astro-cid-nen7h5rs] {
  display: block;
  font-family: var(--font-body);
  font-size: var(--text-sm);
  line-height: 1.4;
  color: var(--color-slate-500);
  margin-top: 1px;
}

.menu-item--pending[data-astro-cid-nen7h5rs] {
  cursor: default;
}

.menu-item--pending[data-astro-cid-nen7h5rs]:hover {
  background: none;
}

.menu-item--pending[data-astro-cid-nen7h5rs] .menu-item-name[data-astro-cid-nen7h5rs] {
  color: var(--color-slate-400);
}

.menu-item--pending[data-astro-cid-nen7h5rs]:hover .menu-item-name[data-astro-cid-nen7h5rs] {
  color: var(--color-slate-400);
}

.mega-column--intelligence[data-astro-cid-nen7h5rs] {
  display: flex;
}

.intelligence-panel[data-astro-cid-nen7h5rs] {
  display: flex;
  flex-direction: column;
  background: linear-gradient(160deg, var(--color-navy-900) 0%, var(--color-navy-950) 100%);
  border: 1px solid #9fcadf24;
  border-radius: var(--radius-lg);
  padding: var(--space-5);
  flex: 1;
}

.intelligence-eyebrow[data-astro-cid-nen7h5rs] {
  font-family: var(--font-mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--color-gold-500);
  margin-bottom: var(--space-3);
}

.intelligence-heading[data-astro-cid-nen7h5rs] {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--text-lg);
  line-height: var(--line-height-tight);
  letter-spacing: var(--tracking-tight);
  color: #fff;
  margin-bottom: var(--space-2);
}

.intelligence-body[data-astro-cid-nen7h5rs] {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  color: var(--color-blue-50);
  line-height: var(--line-height);
  margin: 0 0 var(--space-5);
}

.intelligence-link[data-astro-cid-nen7h5rs] {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  margin-top: auto;
  font-family: var(--font-body);
  font-weight: 700;
  font-size: var(--text-sm);
  color: var(--color-blue-200);
  text-decoration: none;
}

.intelligence-link[data-astro-cid-nen7h5rs]:hover {
  color: #fff;
}

.intelligence-arrow[data-astro-cid-nen7h5rs] {
  transition: transform var(--duration-fast) var(--ease-standard);
}

.intelligence-link[data-astro-cid-nen7h5rs]:hover .intelligence-arrow[data-astro-cid-nen7h5rs] {
  transform: translateX(3px);
}

@media (prefers-reduced-motion: reduce) {
  .dropdown-panel[data-astro-cid-nen7h5rs] {
    transition: opacity var(--duration-fast) var(--ease-standard),
        visibility var(--duration-fast) var(--ease-standard);
  }
}
.site-footer[data-astro-cid-jo6i4kqk] {
  width: 100%;
}

.footer-main-band[data-astro-cid-jo6i4kqk] {
  background: var(--color-navy-900);
  width: 100%;
}

.footer-main[data-astro-cid-jo6i4kqk] {
  max-width: var(--container-max);
  margin: 0 auto;
  padding: var(--band-padding-desktop) var(--gutter-desktop);
  display: grid;
  grid-template-columns: 1fr 2.4fr;
  gap: var(--space-16);
  align-items: start;
}

.footer-brand-q[data-astro-cid-jo6i4kqk] {
  display: block;
  height: 53px;
  width: auto;
  margin-bottom: var(--space-5);
}

.footer-brand-desc[data-astro-cid-jo6i4kqk] {
  font-family: var(--font-body);
  font-size: var(--text-base);
  font-weight: 500;
  line-height: var(--line-height);
  color: var(--color-blue-200);
  margin: 0;
  max-width: 32ch;
}

.footer-address[data-astro-cid-jo6i4kqk] {
  font-family: var(--font-body);
  font-style: normal;
  font-size: var(--text-sm);
  line-height: 2;
  color: var(--color-blue-200);
  margin: var(--space-5) 0 0;
}

.footer-contact-line[data-astro-cid-jo6i4kqk] {
  display: flex;
  gap: var(--space-2);
  font-family: var(--font-body);
  font-size: var(--text-sm);
  color: var(--color-blue-200);
  margin: var(--space-3) 0 0;
}

.footer-contact-label[data-astro-cid-jo6i4kqk] {
  color: var(--color-slate-400);
}

.footer-contact-line[data-astro-cid-jo6i4kqk] a[data-astro-cid-jo6i4kqk] {
  color: var(--color-blue-200);
  text-decoration: none;
  transition: color var(--duration-fast) var(--ease-standard);
}

.footer-contact-line[data-astro-cid-jo6i4kqk] a[data-astro-cid-jo6i4kqk]:hover {
  color: #fff;
}

.footer-nav[data-astro-cid-jo6i4kqk] {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: var(--space-8);
}

.footer-column-heading[data-astro-cid-jo6i4kqk] {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--text-sm);
  text-transform: uppercase;
  letter-spacing: .08em;
  color: #fff;
  margin: 0 0 var(--space-5);
  min-height: 1em;
}

.footer-family-group[data-astro-cid-jo6i4kqk] + .footer-family-group[data-astro-cid-jo6i4kqk] {
  margin-top: var(--space-6);
}

.footer-links[data-astro-cid-jo6i4kqk] + .footer-family-group[data-astro-cid-jo6i4kqk] {
  margin-top: var(--space-8);
}

.footer-family-label[data-astro-cid-jo6i4kqk] {
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--color-gold-500);
  margin: 0 0 var(--space-3);
}

.footer-links[data-astro-cid-jo6i4kqk] {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.footer-link[data-astro-cid-jo6i4kqk] {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  color: var(--color-blue-50);
  text-decoration: none;
  transition: color var(--duration-fast) var(--ease-standard);
}

.footer-link[data-astro-cid-jo6i4kqk]:hover {
  color: #fff;
}

.footer-link--pending[data-astro-cid-jo6i4kqk] {
  color: var(--color-slate-400);
  cursor: default;
}

.footer-link--pending[data-astro-cid-jo6i4kqk]:hover {
  color: var(--color-slate-400);
}

.brand-band[data-astro-cid-jo6i4kqk] {
  background: var(--color-sand-50);
  width: 100%;
}

.brand-band-inner[data-astro-cid-jo6i4kqk] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-8);
  max-width: var(--container-max);
  margin: 0 auto;
  padding: var(--space-8) var(--gutter-desktop);
}

.brand-band-logo[data-astro-cid-jo6i4kqk] img[data-astro-cid-jo6i4kqk] {
  display: block;
  width: 216px;
  height: auto;
  min-width: 144px;
  transform: translateX(-2px);
}

.brand-band-partners[data-astro-cid-jo6i4kqk] {
  display: flex;
  align-items: center;
  gap: var(--space-6);
}

.brand-band-partners-label[data-astro-cid-jo6i4kqk] {
  font-family: var(--font-mono);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--color-slate-400);
  white-space: nowrap;
}

.partner-logos[data-astro-cid-jo6i4kqk] {
  display: flex;
  align-items: center;
  gap: var(--space-12);
}

.partner-logo[data-astro-cid-jo6i4kqk] {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 1;
}

.partner-logo[data-astro-cid-jo6i4kqk]:hover {
  z-index: 5;
}

.partner-logo[data-astro-cid-jo6i4kqk] img[data-astro-cid-jo6i4kqk] {
  display: block;
  height: var(--rest-h, 40px);
  width: auto;
  transform-origin: bottom;
  will-change: transform;
  transition: transform var(--duration-slow) var(--ease-standard),
      filter var(--duration-slow) var(--ease-standard);
}

.partner-logo[data-astro-cid-jo6i4kqk]:hover img[data-astro-cid-jo6i4kqk] {
  transform: translateY(-12px) scale(1.55);
  filter: drop-shadow(0 14px 26px #08152447);
}

@media (prefers-reduced-motion: reduce) {
  .partner-logo[data-astro-cid-jo6i4kqk] img[data-astro-cid-jo6i4kqk] {
    transition: none;
  }

  .partner-logo[data-astro-cid-jo6i4kqk]:hover img[data-astro-cid-jo6i4kqk] {
    transform: scale(1.3);
    filter: drop-shadow(0 6px 14px #08152440);
  }
}

.legal-strip[data-astro-cid-jo6i4kqk] {
  background: var(--color-navy-950);
  width: 100%;
}

.legal-strip-inner[data-astro-cid-jo6i4kqk] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  max-width: var(--container-max);
  margin: 0 auto;
  padding: var(--space-4) var(--gutter-desktop);
}

.legal-copyright[data-astro-cid-jo6i4kqk] {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  color: var(--color-blue-200);
  margin: 0;
}

.legal-links[data-astro-cid-jo6i4kqk] {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  gap: var(--space-6);
}

.legal-link[data-astro-cid-jo6i4kqk] {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  color: var(--color-slate-400);
}

@media (width <= 1023px) {
  .footer-main[data-astro-cid-jo6i4kqk] {
    grid-template-columns: 1fr;
    gap: var(--space-10);
  }

  .footer-nav[data-astro-cid-jo6i4kqk] {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-8) var(--space-6);
  }
}

@media (width <= 767px) {
  .footer-main[data-astro-cid-jo6i4kqk] {
    padding: var(--band-padding-mobile) var(--gutter-mobile);
  }

  .footer-nav[data-astro-cid-jo6i4kqk] {
    grid-template-columns: repeat(2, 1fr);
  }

  .footer-column-heading[data-astro-cid-jo6i4kqk][aria-hidden="true"] {
    display: none;
  }

  .brand-band-inner[data-astro-cid-jo6i4kqk] {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-6);
    padding: var(--space-6) var(--gutter-mobile);
  }

  .brand-band-partners[data-astro-cid-jo6i4kqk] {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-3);
  }

  .partner-logos[data-astro-cid-jo6i4kqk] {
    gap: var(--space-6);
  }

  .legal-strip-inner[data-astro-cid-jo6i4kqk] {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-3);
    padding: var(--space-5) var(--gutter-mobile);
  }
}
/* QwickSoft Design System — CSS Custom Properties */
/* Authority: /Users/VSG/dev/QwickSoft/Claude.md (Design System section),
   cross-checked against qwicksoft-design-system/project/tokens/*.css
   (the design system's own exported tokens — not read when this file
   was first written, which caused several real divergences fixed in
   this pass: no @font-face at all (fonts were silently falling back
   to system defaults), an invented slate-300 value not matching the
   real scale, and --container-max hardcoded to 1280px with no source
   for that number at all. See TASKS.md for the full list. */

/* Self-hosted font files in public/fonts/. The design system's own font
   assets shipped as byte-identical per-weight duplicates (a bold that was
   really a regular), so every weight rendered the same. Replaced with the
   genuine, distinct weight files from the upstream open-source families,
   sourced via @fontsource (SIL Open Font Licence, kept as devDependencies
   for provenance/regeneration; licences at public/fonts/OFL-*.txt):
   Space Grotesk 500/600/700, Manrope 400/500/600/700, JetBrains Mono
   400/500 — latin subset. font-weight now differs correctly. */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/space-grotesk-500.woff2') format('woff2');
}
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/fonts/space-grotesk-600.woff2') format('woff2');
}
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/space-grotesk-700.woff2') format('woff2');
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/manrope-400.woff2') format('woff2');
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/manrope-500.woff2') format('woff2');
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/fonts/manrope-600.woff2') format('woff2');
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/manrope-700.woff2') format('woff2');
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/jetbrains-mono-400.woff2') format('woff2');
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/jetbrains-mono-500.woff2') format('woff2');
}

:root {
  /* ========== COLORS ========== */
  /* Navy — structural spine, text, dark surfaces. Never means clickable. */
  --color-navy-950: #081524;
  --color-navy-900: #0a2540;
  --color-navy-800: #123655;

  /* Blue — interaction, brand, indicates clickable */
  --color-blue-800: #033A57;     /* pressed state */
  --color-blue-700: #044E75;     /* hover state */
  --color-blue-600: #056190;     /* default, brand, interactive — PRIMARY */
  --color-blue-400: #2E86B0;     /* links on dark surfaces, distant hero nodes */
  --color-blue-200: #9FCADF;     /* selected fills, active borders */
  --color-blue-50: #EEF6FA;      /* tinted surfaces, hover backgrounds */

  /* Sand — warm neutral surfaces, replacing cool grey */
  --color-sand-50: #FAF8F5;      /* page canvas */
  --color-sand-100: #F2EFEA;     /* alternating sections, unselected pills */

  /* Signal and emphasis */
  --color-gold-500: #dab00e;     /* signal, active-stage rules, hero sensing pulse */
  --color-yellow-500: #fff200;   /* signal on dark surfaces only, hero pulse core flash */
  --color-red-500: #be1e2d;      /* controlled emphasis, exceptions, live incidents */

  /* Slate — hairlines, disabled states, secondary UI text only (not
     surfaces). Claude.md's prose only gave the two endpoints
     (#34424f through #dde0e3); the intermediate stops below are the
     real values from the design system's own colors.css, not
     invented — an earlier version of this file guessed a slate-300
     value (#7a8892) that didn't match the actual scale at all. */
  --color-slate-700: #34424f;
  --color-slate-500: #626d78;
  --color-slate-400: #8a8d93;
  --color-slate-300: #b7bcc2;
  --color-slate-200: #dde0e3;
  --color-slate-100: #eef0f2;
  --color-slate-50: #f7f8f9;

  /* ========== TYPOGRAPHY ========== */
  /* Families */
  --font-display: 'Space Grotesk', sans-serif;     /* weights: 600, 700 */
  --font-body: 'Manrope', sans-serif;              /* weights: 400, 500, 600, 700 */
  --font-mono: 'JetBrains Mono', monospace;        /* weights: 400, 500 */

  /* Type scale (px) */
  --text-xs: 12px;
  --text-sm: 14px;
  --text-base: 16px;
  --text-lg: 18px;
  --text-xl: 22px;
  --text-2xl: 28px;
  --text-3xl: 36px;
  --text-4xl: 48px;
  /* Larger sizes the design system defines but Claude.md's content-page
     prose never needed (48px was the largest H1 spec'd there) — added
     for completeness, likely needed once the hero is built. Naming
     kept consistent with the scale above (--text-4xl already = 48px
     here) rather than renamed to match the design system's own
     xl/2xl/3xl numbering, which would require touching every file
     that already references these tokens for no visual difference. */
  --text-5xl: 64px;
  --text-6xl: 88px;

  /* Line height */
  --line-height: 1.7;
  --line-height-tight: 1.1;  /* large display headlines, not body copy */

  /* Letter-spacing. Claude.md's Type section never specifies tracking
     values at all — this is a craft addition, not an override of a
     specified value. Large bold headlines need negative tracking to
     avoid looking loose; body copy stays at browser default (not
     listed here, deliberately, since 0 needs no token). */
  --tracking-tight: -0.02em;
  --tracking-tighter: -0.03em;

  /* ========== SHADOWS ========== */
  /* Exact values from the design system's spacing.css — the shadow
     values used in Header/Footer/etc. before this pass were
     hand-approximated to a similar navy tint, not these exact ones. */
  --shadow-sm: 0 1px 2px rgba(10, 25, 40, 0.06);
  --shadow-md: 0 4px 12px rgba(10, 25, 40, 0.08);
  --shadow-lg: 0 12px 32px rgba(10, 25, 40, 0.12);
  --shadow-dark-md: 0 8px 24px rgba(0, 0, 0, 0.35);

  /* ========== SPACING ========== */
  /* Base unit: 4px */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;

  /* ========== RADIUS ========== */
  /* Governed by function, not by size */
  --radius-sm: 4px;              /* containers: cards, panels, dialogs, inputs, images */
  --radius-md: 8px;              /* buttons */
  --radius-lg: 14px;             /* large containers: mega-menu, result panels */
  --radius-full: 999px;          /* tokens/pills: capability chips, tags, badges, platform labels, filters */
  --radius-hero: 0;              /* hero: full bleed */

  /* ========== MOTION ========== */
  --duration-fast: 120ms;
  --duration-base: 200ms;
  --duration-slow: 320ms;
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);

  /* ========== RESPONSIVE ========== */
  /* Breakpoints */
  --breakpoint-mobile: 0;        /* < 768px: fluid */
  --breakpoint-tablet: 768px;    /* 768px–1023px: two-column */
  --breakpoint-desktop: 1024px;  /* 1024px+: full layout */

  /* Measures and gutters */
  --measure: 680px;              /* content measure (desktop & tablet) */
  --gutter-desktop: 40px;        /* desktop gutters */
  --gutter-tablet: 40px;         /* tablet gutters */
  --gutter-mobile: 24px;         /* mobile gutters */
  --gutter-mobile-small: 20px;   /* below 380px */

  /* Band padding (full-width sections) */
  --band-padding-desktop: 64px;
  --band-padding-tablet: 48px;
  --band-padding-mobile: 40px;

  /* Max width for full-bleed section inner content (Header, Footer,
     homepage sections). 1200px from the design system's spacing.css —
     Claude.md never specified this number at all; the 1280px used
     everywhere before this pass had no source in either document, it
     was just picked without grounding it in anything. */
  --container-max: 1200px;
}

/* ========== BASE ========== */
/* Every real component already sets font-family explicitly per
   Claude.md's Type table. This only catches genuinely unstyled text
   (e.g. the scaffold page's placeholder paragraph), which otherwise
   falls back to the browser's default serif — caught by comparing a
   real screenshot against what was actually shipped. */
body {
  font-family: var(--font-body);
}

/* ========== BASE RESET ========== */
/* Zero the browser's default 8px body margin here, in the shared stylesheet
   every page loads, rather than in a per-layout inline block. The inline
   `is:global` reset applied reliably on the homepage but not through the
   StandardPage layout (an Astro dev bundling quirk), which let the default
   margin push the sticky header down 8px on inner pages. Setting it here
   applies deterministically everywhere. */
html,
body {
  margin: 0;
  padding: 0;
}

/* ========== ACCESSIBILITY ========== */
/* Respect user motion preferences */
@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}
