.equipment-page {
  background:
    radial-gradient(circle at 85% 8%, rgba(46, 56, 92, 0.18), transparent 28rem),
    var(--color-ink-950);
}

.equipment-page .section {
  padding-block: clamp(2.5rem, 5vw, 5rem);
}

.equipment-page .eyebrow {
  margin: 0;
}

.equipment-hero__grid,
.equipment-weapons__layout,
.equipment-upgrades__layout {
  display: grid;
  min-width: 0;
  gap: var(--content-gutter);
}

.equipment-hero__grid {
  grid-template-columns: minmax(0, 58fr) minmax(24.375rem, 42fr);
  align-items: center;
}

.equipment-hero__copy,
.equipment-hero__media,
.equipment-weapons__content,
.equipment-weapons__callout,
.equipment-upgrades__content,
.equipment-upgrades__related {
  min-width: 0;
  width: 100%;
}

.equipment-hero__copy {
  display: flex;
  max-width: 33.75rem;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-4);
}

.equipment-hero__copy h1,
.equipment-hero__copy p,
.equipment-hero__copy .eyebrow {
  margin: 0;
}

.equipment-hero__lead {
  max-width: 33.75rem;
  color: var(--color-moon-300);
}

.equipment-hero__actions,
.equipment-closing__actions {
  display: flex;
  min-width: 0;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3);
}

.equipment-hero__actions > *,
.equipment-closing__actions > * {
  min-width: 0;
}

.equipment-hero__media {
  margin: 0;
}

.equipment-hero__media img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  filter: brightness(0.78);
}

.equipment-hero__media figcaption {
  padding: var(--space-3) var(--space-4);
  margin: 0;
}

.equipment-decisions__intro,
.equipment-sets__intro,
.equipment-shield__heading,
.equipment-checklist__intro,
.equipment-plans__intro,
.equipment-related__intro {
  max-width: 38.75rem;
}

.equipment-decisions__intro p:last-child,
.equipment-sets__intro p:last-child,
.equipment-shield__heading p:last-child,
.equipment-checklist__intro p:last-child,
.equipment-plans__intro p:last-child,
.equipment-related__intro p:last-child {
  color: var(--color-moon-300);
}

.equipment-decisions__grid,
.equipment-sets__comparison,
.equipment-timeline,
.equipment-checklist__grid,
.equipment-notes,
.equipment-plans__grid,
.equipment-related__grid {
  display: grid;
  min-width: 0;
  gap: var(--content-gutter);
}

.equipment-decisions__grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.equipment-decision,
.equipment-set-panel,
.equipment-check-card,
.equipment-plan,
.equipment-related-card {
  min-width: 0;
  width: 100%;
}

.equipment-decision {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.equipment-decision h3,
.equipment-decision p {
  margin: 0;
}

.equipment-decision p {
  color: var(--color-moon-300);
}

.equipment-decision__icon {
  display: inline-flex;
  width: 2rem;
  height: 2rem;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  color: var(--color-moon-100);
  font-size: 1.25rem;
}

.equipment-decision__icon--amber {
  border-color: rgba(242, 184, 75, 0.45);
  color: var(--color-amber-400);
}

.equipment-decision__icon--teal {
  border-color: rgba(56, 197, 178, 0.45);
  color: var(--color-teal-400);
}

.equipment-weapons__layout {
  grid-template-columns: minmax(0, 70fr) minmax(15.625rem, 30fr);
  align-items: start;
}

.equipment-weapons__content {
  max-width: 41.25rem;
}

.equipment-weapons__lead {
  max-width: 41.25rem;
  color: var(--color-moon-300);
}

.equipment-numbered-list,
.equipment-upgrade-steps {
  display: grid;
  gap: var(--space-5);
  margin: 0;
  padding: 0;
  list-style: none !important;
}

.equipment-numbered-list li,
.equipment-upgrade-steps li {
  display: grid;
  min-width: 0;
  grid-template-columns: 3.25rem minmax(0, 1fr);
  gap: var(--space-4);
}

.equipment-numbered-list__number,
.equipment-upgrade-steps > li > span {
  display: inline-flex;
  width: 3.25rem;
  height: 2rem;
  align-items: center;
  justify-content: center;
  border-inline-start: 2px solid var(--color-amber-400);
  color: var(--color-amber-200);
  font-family: var(--font-heading);
  font-size: 1.125rem;
  font-variant-numeric: tabular-nums;
}

.equipment-numbered-list__number--teal {
  border-color: var(--color-teal-400);
  color: var(--color-teal-400);
}

.equipment-numbered-list h3,
.equipment-numbered-list p,
.equipment-upgrade-steps h3,
.equipment-upgrade-steps p {
  margin: 0;
}

.equipment-numbered-list li > div,
.equipment-upgrade-steps li > div {
  display: flex;
  min-width: 0;
  max-width: 38.125rem;
  flex-direction: column;
  gap: var(--space-2);
}

.equipment-numbered-list p,
.equipment-upgrade-steps p {
  color: var(--color-moon-300);
}

.equipment-weapons__callout {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  position: sticky;
  top: var(--space-5);
}

.equipment-weapons__callout h3,
.equipment-weapons__callout p {
  margin: 0;
}

.equipment-weapons__callout p {
  color: var(--color-moon-300);
}

.equipment-sets__comparison {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
}

.equipment-set-panel {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.equipment-set-panel h3,
.equipment-set-panel p,
.equipment-set-panel figure {
  margin: 0;
}

.equipment-set-panel > p {
  max-width: 29.375rem;
  color: var(--color-moon-300);
}

.equipment-set-panel--violet {
  border-color: rgba(183, 164, 245, 0.45);
}

.equipment-set-panel__media {
  margin-top: auto !important;
}

.equipment-set-panel__media img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  filter: brightness(0.8);
}

.equipment-set-panel__question {
  padding-top: var(--space-3);
  border-top: 1px solid var(--color-border);
}

.equipment-rule {
  display: grid;
  min-width: 0;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 2.1fr);
  gap: var(--content-gutter);
  margin-top: var(--content-gutter);
  padding: var(--space-5);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-ink-900);
}

.equipment-rule h3,
.equipment-rule p {
  margin: 0;
}

.equipment-rule__questions {
  display: grid;
  min-width: 0;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-3);
}

.equipment-rule__questions a {
  min-width: 0;
  color: var(--color-moon-100);
  font-size: var(--font-size-small);
  font-weight: 600;
  text-decoration: none;
}

.equipment-rule__questions a:hover {
  color: var(--color-amber-200);
}

.equipment-rule__questions span {
  display: block;
  margin-bottom: var(--space-1);
  color: var(--color-amber-400);
  font-family: var(--font-heading);
  font-size: 1.25rem;
  font-variant-numeric: tabular-nums;
}

.equipment-shield__heading {
  max-width: 35rem;
}

.equipment-shield__top {
  display: grid;
  min-width: 0;
  grid-template-columns: minmax(0, 55fr) minmax(22.5rem, 45fr);
  align-items: center;
  gap: var(--content-gutter);
}

.equipment-shield__copy,
.equipment-shield__media {
  min-width: 0;
  width: 100%;
}

.equipment-shield__copy {
  max-width: 35rem;
  padding-left: var(--space-4);
  border-inline-start: 3px solid var(--color-teal-400);
}

.equipment-shield__copy h3 {
  margin-bottom: var(--space-3);
}

.equipment-shield__copy p {
  margin-bottom: 0;
  color: var(--color-moon-300);
}

.equipment-shield__media {
  margin: 0;
}

.equipment-shield__media img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  filter: brightness(0.8);
}

.equipment-shield__media figcaption {
  padding: var(--space-3) var(--space-4);
  margin: 0;
}

.equipment-timeline {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: var(--space-6);
}

.equipment-timeline__step {
  position: relative;
  min-width: 0;
  padding-top: var(--space-5);
  border-top: 1px solid var(--color-border);
}

.equipment-timeline__marker {
  position: absolute;
  top: -0.875rem;
  left: 0;
  display: inline-flex;
  width: 1.75rem;
  height: 1.75rem;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--color-slate-700);
  border-radius: 50%;
  background: var(--color-ink-950);
  color: var(--color-moon-100);
  font-size: var(--font-size-meta);
  font-weight: 700;
}

.equipment-timeline__marker--amber {
  border-color: var(--color-amber-400);
  color: var(--color-amber-400);
}

.equipment-timeline__marker--teal {
  border-color: var(--color-teal-400);
  color: var(--color-teal-400);
}

.equipment-timeline__step h3,
.equipment-timeline__step p {
  margin: 0;
}

.equipment-timeline__step p {
  max-width: 16.25rem;
  margin-top: var(--space-2);
  color: var(--color-moon-300);
  font-size: var(--font-size-small);
}

.equipment-shield__link-panel {
  display: flex;
  max-width: 35rem;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-3);
  margin-top: var(--space-6);
  padding: var(--space-4);
  border-inline-start: 3px solid var(--color-teal-400);
  background: rgba(56, 197, 178, 0.06);
}

.equipment-shield__link-panel p {
  margin: 0;
  color: var(--color-moon-300);
}

.equipment-checklist__grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.equipment-check-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.equipment-check-card > span {
  color: var(--color-amber-400);
  font-family: var(--font-heading);
  font-size: 1.5rem;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}

.equipment-check-card > .equipment-check-card__teal {
  color: var(--color-teal-400);
}

.equipment-check-card h3,
.equipment-check-card p {
  margin: 0;
}

.equipment-check-card p:last-child {
  color: var(--color-moon-300);
  font-size: var(--font-size-small);
}

.equipment-check-card__meta {
  color: var(--color-teal-400) !important;
  font-size: var(--font-size-meta) !important;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.equipment-notes {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: var(--content-gutter);
}

.equipment-note {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-3);
  padding: var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-ink-900);
}

.equipment-note p {
  margin: 0;
  color: var(--color-moon-300);
}

.equipment-note--tip {
  border-inline-start-color: var(--color-amber-400);
  border-inline-start-width: 3px;
}

.equipment-note--warning {
  border-inline-start-color: var(--color-red-400);
  border-inline-start-width: 3px;
}

.equipment-upgrades__layout {
  grid-template-columns: minmax(0, 66fr) minmax(16.25rem, 34fr);
  align-items: start;
}

.equipment-upgrades__content {
  max-width: 38.75rem;
}

.equipment-upgrades__lead {
  max-width: 38.75rem;
  color: var(--color-moon-300);
}

.equipment-upgrade-steps > li > span {
  width: 3rem;
  height: 3rem;
  border: 1px solid rgba(242, 184, 75, 0.5);
  border-radius: 50%;
  background: var(--color-ink-900);
}

.equipment-upgrades__related {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-3);
}

.equipment-upgrades__related h3,
.equipment-upgrades__related p {
  margin: 0;
}

.equipment-upgrades__related p {
  color: var(--color-moon-300);
}

.equipment-plans__grid,
.equipment-related__grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.equipment-plan {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-3);
}

.equipment-plan h3,
.equipment-plan p,
.equipment-plan a {
  margin: 0;
}

.equipment-plan p {
  color: var(--color-moon-300);
}

.equipment-plan a {
  margin-top: auto;
}

.equipment-plan--teal:hover {
  border-color: var(--color-teal-400);
}

.equipment-plan--violet:hover {
  border-color: var(--color-violet-300);
}

.equipment-related-card {
  display: flex;
  min-height: 100%;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-3);
  padding: var(--space-5);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  color: var(--color-text);
  text-decoration: none;
  transition: border-color var(--transition-fast), background-color var(--transition-fast);
}

.equipment-related-card:hover {
  border-color: var(--color-amber-400);
  background: var(--color-ink-900);
  color: var(--color-text);
}

.equipment-related-card--teal:hover {
  border-color: var(--color-teal-400);
}

.equipment-related-card h3,
.equipment-related-card p,
.equipment-related-card > span:last-child {
  margin: 0;
}

.equipment-related-card p {
  color: var(--color-moon-300);
}

.equipment-related-card > span:last-child {
  margin-top: auto;
  color: var(--color-amber-400);
  font-size: var(--font-size-small);
  font-weight: 700;
}

.equipment-closing__panel {
  padding: clamp(var(--space-5), 5vw, var(--space-7));
  border: 1px solid rgba(242, 184, 75, 0.4);
  border-radius: var(--radius-lg);
  background: linear-gradient(110deg, rgba(242, 184, 75, 0.1), transparent 48%), var(--color-ink-900);
}

.equipment-closing__copy {
  display: flex;
  max-width: 37.5rem;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-4);
}

.equipment-closing__copy h2,
.equipment-closing__copy p,
.equipment-closing__copy .eyebrow,
.equipment-closing__actions {
  margin: 0;
}

.equipment-closing__copy p {
  color: var(--color-moon-300);
}

.equipment-closing__actions > a:last-child:not(.button) {
  color: var(--color-moon-300);
  font-size: var(--font-size-small);
  font-weight: 600;
}

@media (max-width: 64.9375rem) {
  .equipment-checklist__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 61.25rem) {
  .equipment-hero__grid {
    grid-template-columns: minmax(0, 58fr) minmax(18rem, 42fr);
  }
}

@media (max-width: 57.5rem) {
  .equipment-weapons__layout,
  .equipment-upgrades__layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .equipment-weapons__callout {
    position: static;
    order: -1;
    max-width: none;
  }

  .equipment-upgrades__content {
    max-width: none;
  }

  .equipment-upgrades__related {
    max-width: none;
  }

  .equipment-decisions__grid,
  .equipment-plans__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .equipment-decisions__grid > :nth-child(3),
  .equipment-plans__grid > :nth-child(3) {
    grid-column: 1 / -1;
  }
}

@media (max-width: 56.25rem) {
  .equipment-shield__top {
    grid-template-columns: minmax(0, 60fr) minmax(16rem, 40fr);
  }
}

@media (max-width: 53.75rem) {
  .equipment-related__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .equipment-related__grid > :nth-child(3) {
    grid-column: 1 / -1;
  }
}

@media (max-width: 51.25rem) {
  .equipment-sets__comparison,
  .equipment-shield__top {
    grid-template-columns: minmax(0, 1fr);
  }

  .equipment-shield__media {
    max-width: none;
  }

  .equipment-rule {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 47.5rem) {
  .equipment-hero__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .equipment-hero__copy {
    max-width: none;
  }

  .equipment-hero__lead {
    max-width: 34rem;
  }

  .equipment-hero__media {
    max-width: none;
  }

  .equipment-timeline {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-5);
    border-inline-start: 1px solid var(--color-border);
    padding-inline-start: var(--space-5);
  }

  .equipment-timeline__step {
    padding-top: 0;
    border-top: 0;
  }

  .equipment-timeline__marker {
    top: 0;
    left: calc(-1 * var(--space-5) - 0.875rem);
  }

  .equipment-timeline__step p {
    max-width: none;
  }
}

@media (max-width: 42.5rem) {
  .equipment-decisions__grid,
  .equipment-plans__grid,
  .equipment-checklist__grid,
  .equipment-notes {
    grid-template-columns: minmax(0, 1fr);
  }

  .equipment-decisions__grid > :nth-child(3),
  .equipment-plans__grid > :nth-child(3) {
    grid-column: auto;
  }

  .equipment-rule__questions {
    grid-template-columns: minmax(0, 1fr);
  }

  .equipment-numbered-list li,
  .equipment-upgrade-steps li {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-2);
  }

  .equipment-numbered-list__number,
  .equipment-upgrade-steps > li > span {
    width: auto;
    justify-content: flex-start;
  }
}

@media (max-width: 38.75rem) {
  .equipment-related__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .equipment-related__grid > :nth-child(3) {
    grid-column: auto;
  }

  .equipment-hero__actions,
  .equipment-closing__actions {
    width: 100%;
    flex-direction: column;
    align-items: stretch;
  }

  .equipment-hero__actions > .button,
  .equipment-closing__actions > .button {
    width: 100%;
  }

  .equipment-closing__actions > a:last-child:not(.button) {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .equipment-related-card {
    transition: none;
  }
}
