/* Technology chapter redesign — orbital mission-control clarity. */
.reference-opening::after {
  display: none;
}

.reference-opening {
  background: transparent;
}

.reference-opening__video {
  -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 68%, rgba(0, 0, 0, 0.72) 80%, transparent 100%);
  mask-image: linear-gradient(180deg, #000 0%, #000 68%, rgba(0, 0, 0, 0.72) 80%, transparent 100%);
}

.technology,
.technology.section-dark {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding-top: clamp(78px, 9vw, 126px);
  padding-bottom: clamp(96px, 11vw, 156px);
  background: transparent;
}

.technology::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  pointer-events: none;
  opacity: 0.44;
  background-image:
    linear-gradient(rgba(124, 186, 255, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(124, 186, 255, 0.04) 1px, transparent 1px);
  background-size: 80px 80px;
  -webkit-mask-image: linear-gradient(180deg, transparent, #000 18%, #000 84%, transparent);
  mask-image: linear-gradient(180deg, transparent, #000 18%, #000 84%, transparent);
}

.technology::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: 17%;
  left: -280px;
  width: 760px;
  aspect-ratio: 1;
  border: 1px solid rgba(108, 207, 255, 0.14);
  border-radius: 50%;
  box-shadow:
    0 0 0 80px rgba(115, 92, 255, 0.025),
    0 0 0 160px rgba(82, 189, 255, 0.02);
  pointer-events: none;
}

.technology__shell {
  position: relative;
  z-index: 2;
}

.technology-heading {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
  align-items: end;
  margin-bottom: clamp(38px, 5vw, 66px);
}

.technology-heading__eyebrow,
.technology-command__header span,
.technology-matrix-heading span {
  display: block;
  color: #80dfff;
  font-family: "Inter", var(--font-sans);
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.2em;
}

.technology-heading__eyebrow {
  margin-bottom: 18px;
}

.technology-heading h2 {
  max-width: 850px;
  color: #f4f8ff;
  font-size: clamp(36px, 8.8vw, 62px);
  font-weight: 700;
  line-height: 1.06;
  letter-spacing: -0.045em;
  text-shadow: 0 10px 40px rgba(1, 4, 22, 0.44);
}

.technology-heading > p {
  max-width: 55ch;
  color: rgba(220, 230, 247, 0.72);
  font-size: 15px;
  line-height: 1.82;
}

.technology-command {
  position: relative;
  min-height: 0;
  overflow: hidden;
  padding: 22px;
  border: 1px solid rgba(161, 210, 255, 0.2);
  border-radius: 26px;
  background:
    linear-gradient(145deg, rgba(7, 14, 40, 0.84), rgba(7, 12, 34, 0.58)),
    radial-gradient(circle at 70% 5%, rgba(86, 131, 255, 0.2), transparent 32%);
  box-shadow:
    0 30px 90px rgba(0, 0, 24, 0.32),
    inset 0 1px rgba(255, 255, 255, 0.06);
  -webkit-backdrop-filter: blur(14px) saturate(118%);
  backdrop-filter: blur(14px) saturate(118%);
}

.technology-command::before {
  content: "";
  position: absolute;
  z-index: 0;
  top: -120px;
  right: -70px;
  left: auto;
  width: 390px;
  height: 390px;
  border: 1px solid rgba(108, 221, 255, 0.12);
  border-radius: 50%;
  box-shadow: 0 0 0 54px rgba(107, 84, 255, 0.025);
  transform: none;
}

.technology-command::after {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  width: auto;
  height: auto;
  border: 0;
  border-radius: inherit;
  background:
    linear-gradient(90deg, transparent 49.94%, rgba(144, 202, 255, 0.09) 50%, transparent 50.06%),
    linear-gradient(transparent 49.9%, rgba(144, 202, 255, 0.09) 50%, transparent 50.1%);
  box-shadow: none;
  transform: none;
  pointer-events: none;
}

.technology-command__header {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 9px;
  padding: 4px 4px 20px;
  border-bottom: 1px solid rgba(164, 207, 255, 0.13);
}

.technology-command__header strong {
  color: rgba(242, 247, 255, 0.86);
  font-size: 16px;
  font-weight: 500;
  line-height: 1.45;
}

.capability-orbit {
  position: relative;
  z-index: 2;
  min-height: 0;
  margin: 0;
  padding: 12px 0 0;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: none;
  gap: 12px;
}

.capability-orbit__item {
  --module-accent: #71dcff;
  position: relative;
  min-height: 190px;
  padding: 22px 18px;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) 96px;
  gap: 12px;
  align-items: center;
  overflow: hidden;
  border: 1px solid rgba(164, 207, 255, 0.14);
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(9, 18, 50, 0.72), rgba(5, 10, 30, 0.54));
  transform: translate3d(0, var(--tech-enter-y, 0), 0);
  transition:
    transform 360ms var(--ease),
    border-color 260ms ease,
    background 260ms ease,
    box-shadow 260ms ease;
}

.capability-orbit__item--knowledge { --module-accent: #a98dff; }
.capability-orbit__item--voice { --module-accent: #65f0c5; }
.capability-orbit__item--device { --module-accent: #ffb06f; }
.capability-orbit__item:last-child { border-bottom-color: rgba(164, 207, 255, 0.14); }

.capability-orbit__item::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 3px;
  height: auto;
  border: 0;
  border-radius: 0 3px 3px 0;
  background: var(--module-accent);
  box-shadow: 0 0 20px color-mix(in srgb, var(--module-accent) 62%, transparent);
}

.capability-orbit__item::after {
  content: "";
  position: absolute;
  top: -70px;
  right: -50px;
  width: 190px;
  height: 190px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--module-accent) 14%, transparent);
  filter: blur(34px);
  opacity: 0;
  transition: opacity 300ms ease;
}

.capability-orbit__item:hover {
  border-color: color-mix(in srgb, var(--module-accent) 48%, transparent);
  background: linear-gradient(145deg, rgba(12, 25, 63, 0.84), rgba(7, 13, 38, 0.7));
  box-shadow: 0 20px 52px rgba(0, 1, 23, 0.28);
  transform: translate3d(0, -4px, 0);
}

.capability-orbit__item:hover::after { opacity: 1; }
.capability-orbit__item:hover .capability-orbit__index {
  color: var(--module-accent);
  text-shadow: 0 0 20px color-mix(in srgb, var(--module-accent) 42%, transparent);
}

.capability-orbit__index {
  align-self: start;
  padding: 2px 0 0;
  color: var(--module-accent);
  font-family: "Inter", var(--font-sans);
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.12em;
  text-shadow: 0 0 20px color-mix(in srgb, var(--module-accent) 42%, transparent);
}

.capability-orbit__copy {
  position: relative;
  z-index: 2;
  min-width: 0;
}

.capability-orbit__copy dt {
  color: color-mix(in srgb, var(--module-accent) 78%, #b9c9e4);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.17em;
}

.capability-orbit__copy dd {
  margin-top: 7px;
  color: #f5f8ff;
  font-size: clamp(20px, 5.4vw, 26px);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.025em;
}

.capability-orbit__copy span {
  display: block;
  max-width: 35ch;
  margin-top: 10px;
  color: rgba(211, 222, 241, 0.68);
  font-size: 12px;
  line-height: 1.65;
}

.capability-orbit__route { display: none; }

.capability-orbit__visual {
  position: relative;
  z-index: 2;
  width: 96px;
  aspect-ratio: 16 / 10;
  display: block;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--module-accent) 52%, transparent);
  border-radius: 16px;
  background: rgba(5, 11, 33, 0.88);
  box-shadow:
    inset 0 0 0 4px rgba(4, 9, 27, 0.62),
    0 12px 28px rgba(0, 0, 19, 0.28);
  transition: transform 360ms var(--ease), border-color 260ms ease;
}

.capability-orbit__visual::after {
  inset: 4px;
  border-color: rgba(255, 255, 255, 0.14);
  border-radius: 12px;
}

.capability-orbit__visual img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  opacity: 0.9;
  filter: saturate(0.82) contrast(1.08);
}

.capability-orbit__item:hover .capability-orbit__visual {
  border-color: var(--module-accent);
  box-shadow:
    inset 0 0 0 4px rgba(4, 9, 27, 0.54),
    0 14px 34px color-mix(in srgb, var(--module-accent) 18%, transparent);
  transform: translateY(-2px) scale(1.03);
}

.technology.is-tech-active .capability-orbit__visual { animation: none; }

/* Reveal the four related modules as one recognizable system on small screens. */
.has-js .technology-command.is-tech-visible .capability-orbit__item {
  --tech-enter-y: 0px;
  opacity: 1;
  filter: none;
}

.technology-matrix-heading {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  align-items: end;
  margin: clamp(68px, 8vw, 112px) 0 28px;
}

.technology-matrix-heading span { margin-bottom: 13px; }

.technology-matrix-heading h3 {
  color: #f4f8ff;
  font-size: clamp(30px, 7.3vw, 48px);
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -0.04em;
}

.technology-matrix-heading > p {
  max-width: 54ch;
  color: rgba(211, 222, 241, 0.68);
  font-size: 14px;
  line-height: 1.75;
}

.technology-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin-top: 0;
}

.technology-card,
.technology-card--four,
.technology-card--five,
.technology-card--seven,
.technology-card--eight {
  --card-accent: #77ddff;
  grid-column: auto;
}

.technology-card:nth-child(2),
.technology-card:nth-child(6) { --card-accent: #a98dff; }
.technology-card:nth-child(3),
.technology-card:nth-child(5) { --card-accent: #65f0c5; }
.technology-card:nth-child(4),
.technology-card:nth-child(8) { --card-accent: #ffb06f; }

.technology-card {
  position: relative;
  min-height: 188px;
  padding: 22px 20px 20px;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  grid-template-rows: auto 1fr auto;
  gap: 12px 14px;
  overflow: hidden;
  border: 1px solid rgba(167, 208, 255, 0.15);
  border-radius: 18px;
  background: linear-gradient(155deg, rgba(9, 18, 50, 0.82), rgba(5, 10, 29, 0.66));
  box-shadow: 0 22px 52px rgba(0, 0, 22, 0.2), inset 0 1px rgba(255, 255, 255, 0.045);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  transform: translate3d(0, var(--tech-enter-y, 0), 0) perspective(1000px) rotateX(var(--tech-tilt-x, 0deg)) rotateY(var(--tech-tilt-y, 0deg));
  transition: transform 220ms var(--ease), border-color 240ms ease, box-shadow 240ms ease;
}

.technology-card::before {
  inset: 0;
  background:
    radial-gradient(circle 190px at var(--tech-light-x) var(--tech-light-y), color-mix(in srgb, var(--card-accent) 16%, transparent), transparent 70%);
}

.technology-card::after {
  content: attr(data-capability);
  position: absolute;
  right: 14px;
  bottom: -18px;
  color: rgba(255, 255, 255, 0.025);
  font-family: "Inter", sans-serif;
  font-size: 88px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.08em;
  pointer-events: none;
}

.technology-card:hover {
  border-color: color-mix(in srgb, var(--card-accent) 48%, transparent);
  box-shadow: 0 28px 68px rgba(0, 0, 26, 0.3), inset 0 1px rgba(255, 255, 255, 0.08);
  transform: translate3d(0, -5px, 0) perspective(1000px) rotateX(var(--tech-tilt-x, 0deg)) rotateY(var(--tech-tilt-y, 0deg));
}

.technology-card > span {
  position: relative;
  z-index: 2;
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--card-accent) 40%, transparent);
  border-radius: 10px;
  color: var(--card-accent);
  font-family: "Inter", var(--font-sans);
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.08em;
  background: color-mix(in srgb, var(--card-accent) 8%, rgba(4, 9, 28, 0.85));
}

.technology-card > div {
  position: relative;
  z-index: 2;
  min-width: 0;
}

.technology-card h3 {
  color: #f4f8ff;
  font-size: clamp(19px, 5vw, 24px);
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.025em;
}

.technology-card p {
  max-width: 34ch;
  margin-top: 10px;
  color: rgba(207, 220, 242, 0.64);
  font-size: 12px;
  line-height: 1.65;
}

.technology-card b {
  position: relative;
  z-index: 2;
  grid-column: 2;
  align-self: end;
  justify-self: start;
  padding: 6px 9px;
  border: 1px solid color-mix(in srgb, var(--card-accent) 34%, transparent);
  border-radius: 999px;
  color: color-mix(in srgb, var(--card-accent) 82%, white);
  background: rgba(3, 8, 26, 0.46);
  font-size: 9px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.1em;
}

.technology-card > i {
  right: 20px;
  bottom: 0;
  left: 20px;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--card-accent), transparent);
  opacity: 0.7;
}

@media (min-width: 700px) {
  .technology-heading,
  .technology-matrix-heading {
    grid-template-columns: minmax(0, 1.08fr) minmax(260px, 0.65fr);
    gap: clamp(34px, 7vw, 112px);
  }

  .technology-command { padding: 26px; }

  .technology-command__header {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
  }

  .technology-command__header strong { text-align: right; }

  .capability-orbit {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
  }

  .capability-orbit__item {
    min-height: 212px;
    padding: 26px 22px;
    grid-template-columns: 40px minmax(0, 1fr) 110px;
    gap: 14px;
  }

  .capability-orbit__visual {
    width: 110px;
    border-radius: 17px;
  }

  .technology-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
  }
}

@media (min-width: 1100px) {
  .technology-command { padding: 30px; }

  .capability-orbit { gap: 16px; }

  .capability-orbit__item {
    min-height: 270px;
    padding: 30px 28px;
    grid-template-columns: 46px minmax(0, 1fr) minmax(190px, 220px);
    gap: 22px;
  }

  .capability-orbit__visual {
    width: min(100%, 220px);
    border-radius: 20px;
  }

  .technology-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
  }

  .technology-card {
    min-height: 232px;
    padding: 24px 22px 22px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .capability-orbit__item,
  .technology-card,
  .capability-orbit__visual {
    transition-duration: 0.01ms !important;
  }

  .capability-orbit__item:hover,
  .technology-card:hover { transform: none; }
}

/* 2026-08-12 — editorial image/caption gallery for the six core capabilities. */
.technology-gallery-heading {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  align-items: end;
  margin: clamp(54px, 7vw, 92px) 0 clamp(26px, 3.5vw, 42px);
}

.technology-gallery-heading span {
  display: block;
  margin-bottom: 14px;
  color: #80dfff;
  font-family: "Inter", var(--font-sans);
  font-size: 10px;
  font-weight: 650;
  line-height: 1;
  letter-spacing: 0.2em;
}

.technology-gallery-heading h3 {
  max-width: 760px;
  color: #f4f8ff;
  font-size: clamp(29px, 5vw, 46px);
  font-weight: 700;
  line-height: 1.08;
  letter-spacing: -0.04em;
}

.technology-gallery-heading > p {
  max-width: 52ch;
  color: rgba(211, 222, 241, 0.68);
  font-size: 14px;
  line-height: 1.76;
}

.technology-gallery {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(32px, 6vw, 54px) clamp(18px, 2vw, 28px);
}

.technology-gallery__item {
  min-width: 0;
}

.technology-gallery__media {
  position: relative;
  overflow: hidden;
  aspect-ratio: 3 / 2;
  border: 1px solid rgba(132, 194, 255, 0.18);
  border-radius: 4px;
  background: #040b22;
  box-shadow: 0 24px 64px rgba(0, 0, 25, 0.22);
  isolation: isolate;
}

.technology-gallery__media::after {
  content: "";
  position: absolute;
  z-index: 2;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(5, 11, 31, 0.02) 54%, rgba(4, 10, 29, 0.28) 100%),
    radial-gradient(circle at 75% 0%, rgba(88, 184, 255, 0.1), transparent 38%);
}

.technology-gallery__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.002);
  transition: transform 700ms cubic-bezier(0.2, 0.8, 0.2, 1), filter 500ms ease;
}

.technology-gallery__media > span {
  position: absolute;
  z-index: 3;
  top: 14px;
  left: 14px;
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid rgba(136, 220, 255, 0.38);
  border-radius: 50%;
  color: rgba(232, 248, 255, 0.88);
  background: rgba(3, 10, 31, 0.58);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  font-family: "Inter", var(--font-sans);
  font-size: 10px;
  font-weight: 650;
  letter-spacing: 0.08em;
}

.technology-gallery__caption {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-content: start;
  min-height: 128px;
  padding: 19px 4px 0;
}

.technology-gallery__caption small {
  display: block;
  margin-bottom: 8px;
  color: rgba(119, 221, 255, 0.82);
  font-family: "Inter", var(--font-sans);
  font-size: 9px;
  font-weight: 650;
  line-height: 1;
  letter-spacing: 0.16em;
}

.technology-gallery__caption h3 {
  color: #f5f8ff;
  font-size: clamp(20px, 2vw, 25px);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.025em;
}

.technology-gallery__caption p {
  max-width: 44ch;
  margin-top: 9px;
  color: rgba(207, 220, 242, 0.62);
  font-size: 12px;
  line-height: 1.65;
}

@media (hover: hover) and (pointer: fine) {
  .technology-gallery__item:hover .technology-gallery__media img {
    filter: saturate(1.08) brightness(1.04);
    transform: scale(1.035);
  }

  .technology-gallery__item:hover .technology-gallery__media {
    border-color: rgba(119, 221, 255, 0.42);
    box-shadow: 0 30px 76px rgba(0, 3, 30, 0.34), 0 0 0 1px rgba(115, 205, 255, 0.08);
  }
}

@media (min-width: 680px) {
  .technology-gallery-heading {
    grid-template-columns: minmax(0, 1.08fr) minmax(260px, 0.65fr);
    gap: clamp(34px, 7vw, 112px);
  }

  .technology-gallery {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1100px) {
  .technology-gallery {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .technology-gallery__caption {
    min-height: 148px;
    padding-top: 21px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .technology-gallery__media img {
    transition-duration: 0.01ms !important;
  }

  .technology-gallery__item:hover .technology-gallery__media img {
    transform: none;
  }
}

/* 2026-08-12 refinement: larger media, centered captions and a stronger left-led chapter title. */
.technology__shell {
  width: min(100%, calc(1480px + var(--gutter) * 2));
}

.technology-heading {
  justify-items: start;
  text-align: left;
}

.technology-heading h2 {
  width: min(100%, 980px);
  max-width: 980px;
  font-size: clamp(52px, 7.4vw, 92px);
  line-height: 1.01;
}

.technology-heading > p {
  justify-self: start;
}

.technology-gallery {
  gap: clamp(44px, 6vw, 82px) clamp(28px, 3.2vw, 52px);
}

.technology-gallery__media {
  aspect-ratio: 16 / 10.35;
}

.technology-gallery__caption {
  justify-items: center;
  min-height: 150px;
  padding: 22px 18px 0;
  text-align: center;
}

.technology-gallery__caption small,
.technology-gallery__caption h3,
.technology-gallery__caption p {
  margin-inline: auto;
  text-align: center;
}

.technology-gallery__caption h3 {
  font-size: clamp(22px, 2.2vw, 30px);
}

.technology-gallery__caption p {
  max-width: 38ch;
  font-size: 13px;
}

@media (min-width: 700px) {
  .technology-heading {
    grid-template-columns: minmax(0, 1.34fr) minmax(260px, 0.54fr);
    gap: clamp(40px, 7vw, 118px);
  }
}

@media (min-width: 1100px) {
  .technology-gallery {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1480px) {
  .technology-gallery {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}