.sat-page {
  overflow: hidden;
}

.sat-page .section {
  position: relative;
}

.sat-hero {
  padding-block: var(--space-10) var(--space-9);
}

.sat-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  align-items: center;
  gap: var(--space-6);
}

.sat-hero__copy,
.sat-hero__media,
.sat-role-map__intro,
.sat-role-map__callout,
.sat-audit__content,
.sat-shapes__intro,
.sat-diagnostic,
.sat-synergy__content,
.sat-encounters__copy,
.sat-traps__intro,
.sat-traps__reassurance,
.sat-checklist__intro,
.sat-reading__intro {
  min-width: 0;
}

.sat-hero__copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-4);
  padding: var(--space-6);
  border-color: var(--color-violet-line);
  background: linear-gradient(145deg, rgba(17, 13, 32, 0.98), rgba(8, 6, 17, 0.98));
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px));
}

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

.sat-hero__copy h1 {
  max-width: 620px;
}

.sat-hero__lead {
  max-width: 600px;
}

.sat-hero__notes {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  width: 100%;
  gap: var(--space-3);
}

.sat-mini-note {
  min-width: 0;
  padding: var(--space-3);
  border-inline-start: 1px solid var(--color-cyan);
  background: rgba(27, 22, 64, 0.44);
}

.sat-mini-note:last-child {
  border-inline-start-color: var(--color-magenta);
}

.sat-mini-note p,
.sat-mini-note .card__label {
  margin: 0;
}

.sat-mini-note p {
  font-size: var(--text-14);
  line-height: 1.5;
}

.sat-hero__actions {
  width: 100%;
  margin-top: var(--space-1);
}

.sat-hero__media {
  width: 100%;
  max-width: calc(100% + var(--space-6));
  margin: 0 calc(var(--space-6) * -1) 0 0;
  position: relative;
}

.sat-hero__media::before,
.sat-encounters__media::before,
.sat-closing__panel::before {
  position: absolute;
  z-index: -1;
  content: "";
  inset: 8% 5%;
  background: radial-gradient(circle, rgba(240, 42, 155, 0.22), transparent 62%), radial-gradient(circle at 78% 60%, rgba(91, 231, 242, 0.14), transparent 54%);
  filter: blur(18px);
}

.sat-hero__media img,
.sat-encounters__media img {
  width: 100%;
  aspect-ratio: 16 / 10;
  border: 1px solid var(--color-violet-line);
  border-radius: 4px;
  object-fit: cover;
}

.sat-hero__media img {
  object-position: 72% center;
}

.sat-hero__media figcaption,
.sat-encounters__media figcaption {
  max-width: 380px;
}

.sat-role-map__intro {
  width: 58.333%;
  max-width: 720px;
}

.sat-role-map__intro > :last-child,
.sat-shapes__intro > :last-child,
.sat-traps__intro > :last-child,
.sat-reading__intro > :last-child,
.sat-checklist__intro > :last-child {
  margin-bottom: 0;
}

.sat-role-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-5);
  margin-top: var(--space-6);
}

.sat-role-card {
  min-width: 0;
  min-height: 100%;
  padding: var(--space-5);
  border: 1px solid var(--color-violet-line);
  background: var(--color-archive);
  transition: border-color var(--transition-base), transform var(--transition-fast);
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px));
}

.sat-role-card:hover {
  border-color: var(--color-magenta-bright);
  transform: translateY(-1px);
}

.sat-role-card--protection,
.sat-role-card--control {
  box-shadow: inset 2px 0 0 var(--color-cyan);
}

.sat-role-card--damage {
  box-shadow: inset 2px 0 0 var(--color-magenta);
}

.sat-role-card--support {
  box-shadow: inset 2px 0 0 var(--color-signal);
}

.sat-role-card h3 {
  font-size: var(--text-22);
}

.sat-role-card > :last-child {
  margin-bottom: 0;
}

.sat-role-map__callout {
  width: 58.333%;
  max-width: 720px;
  margin-top: var(--space-6);
}

.sat-audit__layout,
.sat-synergy__layout {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: var(--space-6);
}

.sat-audit__content,
.sat-synergy__content {
  width: 100%;
  max-width: 700px;
}

.sat-audit__lead,
.sat-synergy__lead {
  max-width: 700px;
}

.sat-audit-step {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  gap: var(--space-4);
  margin-top: var(--space-6);
  padding-inline-start: var(--space-3);
  border-inline-start: 2px solid var(--color-cyan);
}

.sat-audit-step--magenta {
  border-inline-start-color: var(--color-magenta);
}

.sat-audit-step--split {
  border-image: linear-gradient(var(--color-cyan), var(--color-magenta)) 1;
}

.sat-audit-step__number {
  min-width: 0;
  color: var(--color-cyan);
  font-family: var(--font-heading);
  font-size: var(--text-36);
  font-weight: 700;
  line-height: 1;
}

.sat-audit-step--magenta .sat-audit-step__number {
  color: var(--color-magenta-bright);
}

.sat-audit-step__copy {
  min-width: 0;
}

.sat-audit-step__copy > :last-child {
  margin-bottom: 0;
}

.sat-annotation {
  display: block;
  margin-bottom: var(--space-2);
  color: var(--color-magenta-bright);
  font-size: var(--text-12);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.sat-audit__template {
  max-width: 620px;
  margin-top: var(--space-6);
}

.sat-copy-button,
.sat-disclosure {
  min-height: 44px;
  padding: 0.625rem 0.75rem;
  border: 1px solid var(--color-violet-line);
  background: transparent;
  color: var(--color-text-primary);
  font-family: var(--font-heading);
  font-size: var(--text-12);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  transition: color var(--transition-fast), border-color var(--transition-fast), background-color var(--transition-fast);
}

.sat-copy-button:hover,
.sat-disclosure:hover {
  border-color: var(--color-cyan);
  background: rgba(91, 231, 242, 0.08);
  color: var(--color-cyan);
}

.sat-audit__rune,
.sat-synergy__diagram {
  align-self: stretch;
  min-width: 0;
  position: relative;
  opacity: 0.58;
}

.sat-audit__rune::before,
.sat-audit__rune::after,
.sat-synergy__diagram::before,
.sat-synergy__diagram::after {
  position: absolute;
  content: "";
  border: 1px solid rgba(91, 231, 242, 0.34);
  border-radius: 50%;
}

.sat-audit__rune::before {
  width: min(28vw, 330px);
  aspect-ratio: 1;
  top: 18%;
  left: 18%;
}

.sat-audit__rune::after {
  width: min(18vw, 220px);
  aspect-ratio: 1;
  top: 29%;
  left: 31%;
  border-color: rgba(240, 42, 155, 0.42);
}

.sat-audit__rune span {
  position: absolute;
  width: 1px;
  height: 52%;
  top: 21%;
  left: 49%;
  background: linear-gradient(transparent, var(--color-magenta), transparent);
}

.sat-audit__rune span:nth-child(2) {
  transform: rotate(60deg);
}

.sat-audit__rune span:nth-child(3) {
  transform: rotate(-60deg);
}

.sat-shapes__intro {
  width: 58.333%;
  max-width: 680px;
}

.sat-shapes__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
  margin-top: var(--space-6);
}

.sat-shape-card {
  display: flex;
  min-width: 0;
  min-height: 100%;
  flex-direction: column;
  align-items: stretch;
  gap: var(--space-4);
  padding: var(--space-5);
  border: 1px solid var(--color-violet-line);
  background: var(--color-archive);
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px));
}

.sat-shape-card h3,
.sat-shape-card p,
.sat-shape-card .card__label {
  margin: 0;
}

.sat-shape-card--pressure {
  border-color: var(--color-magenta);
  background: linear-gradient(145deg, var(--color-indigo), var(--color-archive));
  box-shadow: inset 0 1px 0 rgba(255, 104, 194, 0.28), var(--glow-magenta);
}

.sat-shape-card--endurance {
  box-shadow: inset 2px 0 0 var(--color-cyan), inset -2px 0 0 var(--color-signal);
}

.sat-role-chain {
  display: flex;
  min-width: 0;
  min-height: 52px;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2);
  color: var(--color-cyan);
  font-size: var(--text-12);
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 1.3;
  text-transform: uppercase;
}

.sat-role-chain span {
  min-width: 0;
}

.sat-role-chain i {
  width: 16px;
  min-width: 16px;
  height: 1px;
  background: var(--color-magenta);
}

.sat-disclosure__content {
  padding-top: var(--space-3);
  border-top: 1px solid var(--color-violet-line);
  color: var(--color-text-secondary);
  font-size: var(--text-14);
  line-height: 1.5;
}

.sat-diagnostic {
  width: 58.333%;
  max-width: 720px;
  margin-top: var(--space-6);
  padding: var(--space-5);
  border: 1px solid var(--color-violet-line);
  background: rgba(17, 13, 32, 0.7);
}

.sat-diagnostic h3 {
  font-size: var(--text-22);
}

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

.sat-diagnostic__rows p {
  margin: 0;
  padding-top: var(--space-3);
  border-top: 1px solid rgba(64, 51, 107, 0.7);
}

.sat-lens {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  gap: var(--space-3);
  margin-top: var(--space-6);
}

.sat-lens > span {
  min-width: 0;
  color: var(--color-cyan);
  font-family: var(--font-heading);
  font-size: var(--text-14);
  font-weight: 700;
}

.sat-lens--magenta > span {
  color: var(--color-magenta-bright);
}

.sat-lens--signal > span {
  color: var(--color-signal);
}

.sat-lens > div {
  min-width: 0;
  padding-bottom: var(--space-4);
  border-bottom: 1px solid var(--color-violet-line);
}

.sat-lens h3,
.sat-lens p {
  margin: 0;
}

.sat-lens h3 {
  margin-bottom: var(--space-2);
  font-size: var(--text-22);
}

.sat-synergy__warning {
  width: 85.714%;
  max-width: 610px;
  margin-top: var(--space-6);
  margin-left: var(--space-5);
}

.sat-synergy__diagram::before {
  width: min(30vw, 360px);
  aspect-ratio: 1;
  top: 14%;
  left: 12%;
}

.sat-synergy__diagram::after {
  width: min(20vw, 245px);
  aspect-ratio: 1;
  top: 25%;
  left: 26%;
  border-color: rgba(240, 42, 155, 0.46);
}

.sat-synergy__diagram span {
  position: absolute;
  width: 1px;
  height: 54%;
  top: 20%;
  left: 50%;
  background: linear-gradient(transparent, var(--color-cyan), transparent);
}

.sat-synergy__diagram span:nth-child(2) { transform: rotate(45deg); }
.sat-synergy__diagram span:nth-child(3) { transform: rotate(90deg); }
.sat-synergy__diagram span:nth-child(4) { transform: rotate(135deg); }

.sat-encounters {
  background: linear-gradient(90deg, rgba(17, 13, 32, 0.88), rgba(27, 22, 64, 0.9));
  border-block: 1px solid var(--color-violet-line);
}

.sat-encounters__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: var(--space-7);
}

.sat-encounters__copy {
  width: 100%;
  max-width: 680px;
}

.sat-encounters__lead {
  max-width: 680px;
}

.sat-encounter-block {
  margin-top: var(--space-6);
  padding-bottom: var(--space-5);
  border-bottom: 1px solid var(--color-violet-line);
}

.sat-encounter-block--portal {
  border-inline-start: 2px solid var(--color-magenta);
  padding-inline-start: var(--space-4);
}

.sat-encounter-block > :last-child {
  margin-bottom: 0;
}

.sat-encounters__media {
  width: 100%;
  min-width: 0;
  position: sticky;
  top: var(--space-5);
}

.sat-encounters__media img {
  object-position: 64% center;
  box-shadow: var(--shadow-floating);
}

.sat-field-test {
  max-width: 600px;
  margin-top: var(--space-6);
}

.sat-field-test ul {
  margin-bottom: var(--space-3);
}

.sat-traps__intro {
  width: 58.333%;
  max-width: 650px;
}

.sat-trap-list {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  margin-top: var(--space-6);
}

.sat-trap-panel {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-5);
  min-width: 0;
  padding: var(--space-5);
  border: 1px solid var(--color-violet-line);
  background: var(--color-archive);
}

.sat-trap-panel--indigo {
  background: var(--color-indigo);
}

.sat-trap,
.sat-correction {
  min-width: 0;
}

.sat-trap {
  padding-right: var(--space-5);
  border-right: 1px solid var(--color-violet-line);
}

.sat-trap > span,
.sat-correction > span {
  display: block;
  margin-bottom: var(--space-2);
  font-size: var(--text-12);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.sat-trap > span {
  color: var(--color-magenta-bright);
}

.sat-correction > span {
  color: var(--color-cyan);
}

.sat-trap h3 {
  font-size: var(--text-22);
}

.sat-trap > :last-child,
.sat-correction > :last-child {
  margin-bottom: 0;
}

.sat-traps__reassurance {
  width: 50%;
  max-width: 650px;
  margin-top: var(--space-6);
}

.sat-checklist__intro {
  width: 50%;
  max-width: 620px;
  margin-inline: auto;
  text-align: left;
}

.sat-checklist__panel {
  display: flex;
  width: 66.666%;
  min-width: 0;
  max-width: 820px;
  margin: var(--space-6) auto 0;
  padding: var(--space-6);
  flex-direction: column;
  align-items: stretch;
  gap: var(--space-5);
}

.sat-check-item {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  gap: var(--space-4);
  min-width: 0;
}

.sat-check-item > span {
  min-width: 0;
  color: var(--color-cyan);
  font-family: var(--font-heading);
  font-size: var(--text-28);
  font-weight: 700;
  line-height: 1;
}

.sat-check-item--complete > span {
  color: var(--color-signal);
}

.sat-check-item > div {
  min-width: 0;
  max-width: 620px;
}

.sat-check-item h3,
.sat-check-item p {
  margin: 0;
}

.sat-check-item h3 {
  margin-bottom: var(--space-2);
  font-size: var(--text-22);
}

.sat-checklist__reminder {
  width: calc(100% - 48px - var(--space-4));
  margin-left: calc(48px + var(--space-4));
  min-width: 0;
  max-width: 580px;
  padding-top: var(--space-4);
  border-top: 1px solid var(--color-violet-line);
}

.sat-checklist__reminder > div {
  margin-top: var(--space-3);
}

.sat-checklist__reminder p {
  margin-bottom: 0;
}

.sat-reading__intro {
  width: 58.333%;
  max-width: 650px;
}

.sat-reading__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
  margin-top: var(--space-6);
}

.sat-reading-card {
  display: flex;
  min-width: 0;
  min-height: 100%;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-3);
  padding: var(--space-5);
  border: 1px solid var(--color-violet-line);
  background: var(--color-archive);
  color: var(--color-text-primary);
  text-decoration: none;
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px));
  transition: border-color var(--transition-base), transform var(--transition-fast), background-color var(--transition-fast);
}

.sat-reading-card:hover {
  border-color: var(--color-cyan);
  background: var(--color-indigo);
  transform: translateY(-1px);
}

.sat-reading-card--magenta:hover {
  border-color: var(--color-magenta-bright);
}

.sat-reading-card h3,
.sat-reading-card p,
.sat-reading-card .card__label {
  margin: 0;
}

.sat-reading-card h3 {
  font-size: var(--text-22);
}

.sat-reading-card p {
  color: var(--color-text-secondary);
}

.sat-reading-card__arrow {
  margin-top: auto;
  color: var(--color-cyan);
  font-family: var(--font-heading);
  font-size: var(--text-12);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.sat-closing__panel {
  display: flex;
  width: 58.333%;
  min-width: 0;
  max-width: 720px;
  margin-inline: auto;
  padding: var(--space-7);
  position: relative;
  flex-direction: column;
  align-items: center;
  gap: var(--space-4);
  overflow: visible;
  text-align: center;
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px));
}

.sat-closing__panel > * {
  position: relative;
}

.sat-closing__panel h2,
.sat-closing__panel p,
.sat-closing__panel .eyebrow {
  margin: 0;
}

.sat-closing__panel > p:not(.sat-closing__note) {
  max-width: 600px;
}

.sat-closing__panel .button {
  min-width: 220px;
}

.sat-closing__note {
  max-width: 520px;
  color: var(--color-text-secondary);
  font-size: var(--text-14);
  line-height: 1.5;
}

@media (max-width: 66.24rem) {
  .sat-hero__grid {
    grid-template-columns: minmax(0, 5fr) minmax(0, 3fr);
  }

  .sat-hero__media {
    max-width: calc(100% + var(--space-4));
    margin-right: calc(var(--space-4) * -1);
  }

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

  .sat-shape-card--balanced {
    grid-column: 1 / -1;
  }

  .sat-encounters__grid {
    grid-template-columns: minmax(0, 5fr) minmax(0, 3fr);
  }
}

@media (max-width: 64.99rem) {
  .sat-encounters__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .sat-encounters__copy {
    width: 75%;
    max-width: 680px;
  }

  .sat-encounters__media {
    width: 100%;
    position: relative;
    top: auto;
  }
}

@media (max-width: 61.24rem) {
  .sat-role-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

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

  .sat-reading-card:last-child {
    grid-column: 1 / -1;
  }
}

@media (max-width: 57.49rem) {
  .sat-audit__layout,
  .sat-synergy__layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .sat-audit__content,
  .sat-synergy__content {
    width: 87.5%;
  }

  .sat-audit__rune,
  .sat-synergy__diagram {
    display: none;
  }

  .sat-audit-step {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-2);
  }

  .sat-audit-step__number {
    font-size: var(--text-22);
  }
}

@media (max-width: 53.74rem) {
  .sat-trap-panel {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-4);
  }

  .sat-trap {
    padding-right: 0;
    padding-bottom: var(--space-4);
    border-right: 0;
    border-bottom: 1px solid var(--color-violet-line);
  }

  .sat-checklist__panel {
    width: 100%;
  }
}

@media (max-width: 51.24rem) {
  .sat-closing__panel {
    width: 100%;
    padding: var(--space-6);
  }
}

@media (max-width: 47.49rem) {
  .sat-hero {
    padding-block: var(--space-9) var(--space-8);
  }

  .sat-hero__grid {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-5);
  }

  .sat-hero__copy {
    padding: var(--space-5);
  }

  .sat-hero__copy h1 {
    font-size: clamp(2.5rem, 11vw, 2.75rem);
    line-height: 1.08;
  }

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

  .sat-hero__media {
    max-width: 100%;
    margin: 0;
  }

  .sat-hero__media img {
    object-position: 62% center;
  }

  .sat-role-map__intro,
  .sat-role-map__callout,
  .sat-shapes__intro,
  .sat-diagnostic,
  .sat-traps__intro,
  .sat-traps__reassurance,
  .sat-checklist__intro,
  .sat-reading__intro,
  .sat-encounters__copy,
  .sat-audit__content,
  .sat-synergy__content,
  .sat-synergy__warning {
    width: 100%;
    margin-left: 0;
  }

  .sat-role-grid,
  .sat-shapes__grid,
  .sat-reading__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .sat-shape-card--balanced,
  .sat-reading-card:last-child {
    grid-column: auto;
  }

  .sat-role-card,
  .sat-shape-card,
  .sat-reading-card,
  .sat-trap-panel,
  .sat-checklist__panel {
    padding: var(--space-4);
  }

  .sat-shape-card h3,
  .sat-role-card h3,
  .sat-reading-card h3,
  .sat-trap h3,
  .sat-check-item h3,
  .sat-lens h3 {
    font-size: var(--text-22);
  }

  .sat-role-chain {
    min-height: auto;
  }

  .sat-encounters__media {
    order: -1;
  }

  .sat-encounters__grid {
    gap: var(--space-5);
  }

  .sat-encounters__media figcaption {
    max-width: 100%;
  }

  .sat-checklist__panel {
    gap: var(--space-5);
  }

  .sat-check-item {
    grid-template-columns: 32px minmax(0, 1fr);
    gap: var(--space-3);
  }

  .sat-check-item > span {
    font-size: var(--text-22);
  }

  .sat-checklist__reminder {
    width: 100%;
    margin-left: 0;
  }

  .sat-closing__panel {
    padding: var(--space-5);
  }

  .sat-closing__panel .button {
    width: 100%;
    min-height: 48px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sat-encounters__media {
    position: relative;
    top: auto;
  }

  .sat-role-card:hover,
  .sat-reading-card:hover {
    transform: none;
  }
}