.purchase-page {
  --purchase-paper: #e8e8e3;
  --purchase-ink: #080909;
  --purchase-muted: #8b8f8d;
}

.purchase-hero {
  position: relative;
  min-height: 100svh;
  overflow: hidden;
  background: #070808;
}
.purchase-hero__media {
  position: absolute;
  inset: 0 0 0 42%;
  overflow: hidden;
}
.purchase-hero__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 53%;
  filter: grayscale(1) contrast(1.08) brightness(.74);
  transform: scale(1.025);
}
.purchase-hero__media::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(104deg, #070808 0 9%, rgba(7,8,8,.94) 22%, rgba(7,8,8,.4) 47%, rgba(7,8,8,.08) 74%),
    linear-gradient(0deg, rgba(7,8,8,.66), transparent 47%);
}
.purchase-hero__inner {
  position: relative;
  z-index: 1;
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding-top: 150px;
  padding-bottom: clamp(42px, 7vh, 80px);
}
.purchase-kicker {
  margin: 0;
  color: #a7aaa8;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .28em;
  text-transform: uppercase;
}
.purchase-hero h1 {
  margin: clamp(30px, 4vw, 58px) 0 0;
  font-size: clamp(76px, 14vw, 232px);
  font-weight: 500;
  line-height: .76;
  letter-spacing: -.075em;
}
.purchase-hero h1 span { display: block; }
.purchase-hero h1 span:last-child { padding-left: clamp(45px, 10vw, 165px); }
.purchase-hero__bottom {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 40px;
  margin-top: clamp(55px, 9vh, 112px);
}
.purchase-hero__bottom p {
  margin: 0;
  color: #d0d2d1;
  font-size: clamp(15px, 1.25vw, 19px);
  line-height: 2;
}
.purchase-hero__bottom a {
  display: inline-flex;
  align-items: center;
  gap: 42px;
  padding-bottom: 7px;
  border-bottom: 1px solid rgba(255,255,255,.68);
  font-size: 10px;
  letter-spacing: .2em;
}

.purchase-intro {
  overflow: hidden;
  background: var(--purchase-paper);
  color: var(--purchase-ink);
}
.purchase-intro__headline {
  width: min(1320px, 100%);
  margin: clamp(38px, 5vw, 70px) 0 0;
  font-size: clamp(58px, 9.2vw, 150px);
  font-weight: 500;
  line-height: 1.02;
  letter-spacing: -.068em;
  white-space: nowrap;
}
.purchase-intro__body {
  width: min(1080px, 100%);
  display: grid;
  grid-template-columns: .72fr 1.28fr;
  gap: clamp(60px, 11vw, 180px);
  margin: clamp(90px, 11vw, 170px) 0 0 auto;
  padding-top: clamp(35px, 4vw, 62px);
  border-top: 1px solid #aaa;
}
.purchase-intro__body > p {
  margin: 0;
  font-size: clamp(18px, 1.65vw, 26px);
  line-height: 1.9;
  letter-spacing: -.025em;
}
.purchase-intro__copy p {
  margin: 0 0 28px;
  color: #4e5150;
  font-size: 15px;
  line-height: 2.15;
}

.purchase-value {
  position: relative;
  min-height: 92svh;
  overflow: hidden;
  display: grid;
  align-items: end;
  background: #090a0a;
}
.purchase-value__media {
  position: absolute;
  inset: 0;
}
.purchase-value__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 57%;
  filter: grayscale(1) contrast(1.1) brightness(.6);
}
.purchase-value__media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(96deg, rgba(6,7,7,.98) 0%, rgba(6,7,7,.9) 38%, rgba(6,7,7,.42) 66%, rgba(6,7,7,.1) 100%);
}
.purchase-value__inner {
  position: relative;
  z-index: 1;
  padding-top: clamp(130px, 15vw, 230px);
  padding-bottom: clamp(100px, 13vw, 200px);
}
.purchase-value h2 {
  max-width: 920px;
  margin: clamp(38px, 5vw, 70px) 0 0;
  font-size: clamp(51px, 7.5vw, 122px);
  font-weight: 500;
  line-height: 1.04;
  letter-spacing: -.065em;
  white-space: nowrap;
}
.purchase-value__copy {
  width: min(620px, 100%);
  margin: clamp(55px, 7vw, 100px) 0 0;
  padding-top: clamp(28px, 3vw, 45px);
  border-top: 1px solid rgba(255,255,255,.36);
}
.purchase-value__copy p {
  margin: 0 0 22px;
  color: #c2c5c3;
  font-size: 15px;
  line-height: 2.1;
}
.purchase-value__copy small {
  display: block;
  color: #777c79;
  font-size: 10px;
  line-height: 1.8;
}

.purchase-strengths {
  background: #080909;
}
.purchase-strengths__head {
  display: grid;
  grid-template-columns: .52fr 1.48fr;
  gap: clamp(55px, 9vw, 145px);
  align-items: end;
}
.purchase-strengths__head h2 {
  margin: 0;
  font-size: clamp(58px, 9vw, 146px);
  font-weight: 500;
  line-height: .9;
  letter-spacing: -.07em;
}
.purchase-strengths__list {
  margin-top: clamp(80px, 10vw, 155px);
  border-top: 1px solid rgba(255,255,255,.3);
}
.purchase-strengths__list article {
  display: grid;
  grid-template-columns: 9% 35% 1fr;
  gap: 30px;
  align-items: start;
  padding: clamp(45px, 6vw, 88px) 0;
  border-bottom: 1px solid rgba(255,255,255,.16);
}
.purchase-strengths__list span {
  color: #717674;
  font-size: 10px;
  letter-spacing: .2em;
}
.purchase-strengths__list h3 {
  margin: 0;
  font-size: clamp(27px, 3.3vw, 52px);
  font-weight: 500;
  line-height: 1.28;
  letter-spacing: -.045em;
}
.purchase-strengths__list p {
  max-width: 590px;
  margin: 0;
  color: #a9adab;
  font-size: 14px;
  line-height: 2.1;
}

.purchase-flow {
  background: var(--purchase-paper);
  color: var(--purchase-ink);
}
.purchase-flow__head {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 50px;
}
.purchase-flow h2 {
  margin: 0;
  font-size: clamp(59px, 9.5vw, 155px);
  font-weight: 500;
  line-height: .82;
  letter-spacing: -.07em;
}
.purchase-flow__head > p {
  max-width: 420px;
  margin: 0;
  color: #565957;
  font-size: 14px;
  line-height: 2;
}
.purchase-flow__list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: clamp(80px, 10vw, 150px);
  border-top: 1px solid #111;
}
.purchase-flow__list article {
  min-height: 300px;
  padding: 28px clamp(20px, 2.6vw, 40px) 34px;
  border-right: 1px solid #aaa;
}
.purchase-flow__list article:first-child { border-left: 1px solid #aaa; }
.purchase-flow__list span {
  color: #777a78;
  font-size: 9px;
  letter-spacing: .18em;
}
.purchase-flow__list h3 {
  margin: clamp(70px, 7vw, 108px) 0 0;
  font-size: clamp(22px, 2.2vw, 33px);
  font-weight: 500;
  letter-spacing: -.035em;
}
.purchase-flow__list p {
  margin: 18px 0 0;
  color: #5d605e;
  font-size: 12px;
  line-height: 1.9;
}

.purchase-license {
  background: #0a0b0b;
}
.purchase-license__layout {
  display: grid;
  grid-template-columns: .72fr 1.28fr;
  gap: clamp(70px, 11vw, 180px);
}
.purchase-license h2 {
  margin: clamp(34px, 4vw, 56px) 0 0;
  font-size: clamp(45px, 5.7vw, 92px);
  font-weight: 500;
  line-height: 1.04;
  letter-spacing: -.06em;
  white-space: nowrap;
}
.purchase-license dl {
  margin: 0;
  border-top: 1px solid rgba(255,255,255,.34);
}
.purchase-license dl > div {
  display: grid;
  grid-template-columns: minmax(160px, .37fr) 1fr;
  gap: 30px;
  padding: clamp(28px, 3vw, 44px) 0;
  border-bottom: 1px solid rgba(255,255,255,.16);
}
.purchase-license dt {
  color: #747977;
  font-size: 9px;
  letter-spacing: .18em;
}
.purchase-license dd {
  margin: 0;
  color: #c1c4c3;
  font-size: 14px;
  line-height: 1.8;
}
.purchase-license__note {
  margin: 24px 0 0;
  color: #6f7472;
  font-size: 10px;
  line-height: 1.9;
}

.purchase-closing {
  overflow: hidden;
  background: var(--purchase-paper);
  color: var(--purchase-ink);
}
.purchase-closing h2 {
  width: min(1120px, 100%);
  margin: 0;
  font-size: clamp(54px, 6vw, 94px);
  font-weight: 500;
  line-height: 1.02;
  letter-spacing: -.07em;
  white-space: nowrap;
}
.purchase-closing__bottom {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(60px, 10vw, 160px);
  margin-top: clamp(75px, 10vw, 150px);
  padding-top: clamp(32px, 4vw, 55px);
  border-top: 1px solid #aaa;
}
.purchase-closing__bottom p {
  margin: 0;
  color: #565957;
  font-size: 15px;
  line-height: 2.1;
}
.purchase-closing__bottom a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-self: end;
  padding: 24px 2px;
  border-top: 1px solid #111;
  border-bottom: 1px solid #111;
  font-size: 13px;
  transition: padding .35s, color .35s, background .35s;
}
.purchase-closing__bottom a:hover {
  padding-inline: 18px;
  color: #f2f2ef;
  background: #080909;
}

@media (max-width: 900px) {
  .purchase-hero__media { left: 30%; }
  .purchase-intro__body,
  .purchase-strengths__head,
  .purchase-license__layout { grid-template-columns: 1fr; }
  .purchase-intro__body { width: 100%; gap: 42px; }
  .purchase-strengths__list article { grid-template-columns: 9% 43% 1fr; }
  .purchase-flow__head { align-items: start; flex-direction: column; }
  .purchase-flow__list { grid-template-columns: 1fr 1fr; }
  .purchase-flow__list article:nth-child(3) { border-left: 1px solid #aaa; }
  .purchase-license__layout { gap: 70px; }
}

@media (max-width: 600px) {
  .purchase-hero__media { inset: 0; }
  .purchase-hero__media::after {
    background: linear-gradient(0deg, rgba(7,8,8,.92) 0%, rgba(7,8,8,.38) 64%, rgba(7,8,8,.62) 100%);
  }
  .purchase-hero__inner { padding-top: 130px; }
  .purchase-hero h1 { font-size: clamp(65px, 20vw, 94px); }
  .purchase-hero h1 span:last-child { padding-left: 34px; }
  .purchase-hero__bottom { align-items: start; flex-direction: column; }
  .purchase-hero__bottom p { font-size: 14px; }
  .purchase-intro__headline { font-size: 44px; }
  .purchase-intro__headline,
  .purchase-value h2,
  .purchase-license h2,
  .purchase-closing h2 { white-space: normal; }
  .purchase-intro__body > p { font-size: 18px; }
  .purchase-intro__copy p { font-size: 14px; }
  .purchase-value { min-height: 800px; }
  .purchase-value__media img { object-position: 60% center; }
  .purchase-value__media::after { background: rgba(6,7,7,.72); }
  .purchase-value h2 { font-size: 41px; }
  .purchase-value__copy p { font-size: 14px; }
  .purchase-strengths__head h2 { font-size: 58px; }
  .purchase-strengths__list article { grid-template-columns: 46px 1fr; gap: 20px; }
  .purchase-strengths__list article > p { grid-column: 2; font-size: 13px; }
  .purchase-flow h2 { font-size: 58px; }
  .purchase-flow__list { grid-template-columns: 1fr; }
  .purchase-flow__list article,
  .purchase-flow__list article:nth-child(3) { min-height: 230px; border-left: 1px solid #aaa; }
  .purchase-flow__list h3 { margin-top: 52px; }
  .purchase-license h2 { font-size: 48px; }
  .purchase-license dl > div { grid-template-columns: 1fr; gap: 10px; }
  .purchase-license dd { font-size: 13px; }
  .purchase-closing h2 { font-size: 34px; }
  .purchase-closing__bottom { grid-template-columns: 1fr; gap: 50px; }
}

@media (prefers-reduced-motion: reduce) {
  .purchase-hero__media img { transform: none; }
}
