.course-product-story {
  padding-block: 80px;
  background: #f3f3eb;
  color: #21372b;
  border-block: 1px solid #d5ddce;
}

.course-product-story *,
.course-product-story *::before,
.course-product-story *::after {
  box-sizing: border-box;
}

.course-product-story .wrap,
.course-story-heading > * {
  min-width: 0;
}

.course-story-heading { margin-bottom:28px; }

.course-story-heading .overline {
  margin-bottom: 22px;
  color: #647650;
}

.course-story-heading h2 {
  font-size: clamp(44px, 4.7vw, 68px);
  line-height: 1.03;
}

.course-story-heading h2 em {
  color: #6d813e;
}

.course-story-heading > p {
  max-width: 460px;
  margin: 18px 0 0;
  color: #61705d;
  font-size: 15px;
  line-height: 1.8;
}

.movely-landing .usage-landing-hero {
  grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
  gap:clamp(28px,4vw,64px);
}
.movely-landing .usage-landing-hero h1 {
  font-size:clamp(46px,4.8vw,72px);
  text-wrap:balance;
}
.course-product-pair {
  display:grid; grid-template-columns:minmax(0,3.15fr) minmax(124px,1fr);
  align-items:start; gap:14px; min-width:0;
}
.course-product-pair figure { margin:0; min-width:0; }
.course-product-pair-screen {
  display:block; width:100%; padding:0; border:1px solid #526350; border-radius:10px;
  overflow:hidden; background:#20362a; color:#f5f3eb; text-align:left; cursor:zoom-in;
}
.course-product-pair-screen img { display:block; width:100%; height:auto; }
.course-product-pair-screen:focus-visible { outline:3px solid #d8ee83; outline-offset:4px; }
.course-product-pair-public .course-product-pair-screen { border:0; background:transparent; overflow:visible; }
.course-product-pair-device {
  position:relative; display:block; overflow:hidden; padding:13px 4px 4px;
  border:2px solid #a6b39f; border-radius:clamp(16px,2vw,24px); background:#111d17;
}
.course-product-pair-device::before {
  content:""; position:absolute; top:5px; left:50%; width:28%; height:4px;
  transform:translateX(-50%); border-radius:8px; background:#526350;
}
.course-product-pair-viewport { display:block; overflow:hidden; aspect-ratio:390/844; border-radius:5px 5px 12px 12px; }
.course-story-copy { max-width:860px; margin-inline:auto; }
@media(max-width:900px) {
  .movely-landing .usage-landing-hero { grid-template-columns:minmax(0,1fr); }
  .movely-landing .usage-landing-hero h1 { font-size:clamp(46px,8vw,66px); }
}
@media(max-width:520px) {
  .course-product-pair { grid-template-columns:minmax(0,1fr); gap:20px; }
  .course-product-pair-public { justify-self:center; width:min(100%,210px); }
}
.course-story-landmarks {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-self: center;
  gap: 24px;
  margin: 0;
}

.course-story-landmarks > div {
  min-width: 0;
  padding-top: 17px;
  border-top: 1px solid #c9d2be;
}

.course-story-landmarks dt {
  margin: 0 0 8px;
  font: 600 14px/1.5 DM, Arial, sans-serif;
}

.course-story-landmarks dd {
  margin: 0;
  color: #61705d;
  font-size: 12px;
  line-height: 1.8;
}


.course-product-story button:focus-visible {
  outline: 3px solid #718644;
  outline-offset: 5px;
}

@media (max-width: 650px) {
  .course-product-story { padding-block:46px; }
  .course-story-heading .overline { margin-bottom:16px; }
  .course-story-heading h2 { font-size:clamp(38px,9vw,54px); }
  .course-story-landmarks { grid-template-columns:minmax(0,1fr); gap:12px; }
  .course-story-landmarks > div { padding-top:10px; }
  .course-story-landmarks dt { margin-bottom:4px; }
}