/* Approved upper page only. The existing audiences, AI section, final CTA,
   site footer, navigation, and their styles remain outside this scope. */
.dm-approved-top {
  --dmx-navy: #05284d;
  --dmx-gold: #a66b0a;
  --dmx-cream: #fffaf0;
  --dmx-line: #e6c99e;
  width: 100%;
  color: var(--dmx-navy);
  background: #fff;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
  line-height: 1.4;
}
.dm-approved-top *, .dm-approved-top *::before, .dm-approved-top *::after { box-sizing: border-box; }
.dm-approved-top :where(h1, h2, h3, p, ul, ol, figure) { margin: 0; padding: 0; }
.dm-approved-top :where(h1, h2, h3) { color: var(--dmx-navy); }
.dm-approved-top a { color: inherit; text-decoration: none; }
.dm-approved-top a:focus-visible { outline: 3px solid #95600a; outline-offset: 4px; }
.dm-approved-top img { display: block; max-width: 100%; }
.dm-approved-top .dmx-symbols { position: absolute; width: 0; height: 0; overflow: hidden; }
.dm-approved-top .dmx-icon { display: inline-block; flex: 0 0 auto; width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; vertical-align: middle; }
.dm-approved-top .dmx-eyebrow { font-size: 10px; font-weight: 700; letter-spacing: .27em; line-height: 1.25; text-transform: uppercase; }
.dm-approved-top .dmx-button { display: inline-flex; align-items: center; justify-content: center; gap: 13px; min-height: 43px; padding: 9px 20px; border: 1px solid transparent; border-radius: 4px; font-size: 13px; font-weight: 700; line-height: 1.15; text-align: center; text-transform: uppercase; letter-spacing: .035em; transition: filter .15s ease; }
.dm-approved-top .dmx-button:hover { filter: brightness(.93); }
.dm-approved-top .dmx-button .dmx-icon { width: 23px; height: 23px; }
.dm-approved-top .dmx-button-gold { border-color: #aa751d; color: #fff; background: linear-gradient(115deg, #dba641, #b87b13 75%, #985d04); box-shadow: inset 0 1px 0 #f1cc7e; }
.dm-approved-top .dmx-button-outline { border-color: #b77a18; color: var(--dmx-navy); background: rgba(255,255,255,.93); }
.dm-approved-top .dmx-button-navy { color: #fff; border-color: #294966; background: linear-gradient(#234b6d, #05243e); }
.dm-approved-top .dmx-button-navy .dmx-icon { color: #e2ac4b; }
.dm-approved-top .dmx-play { display: inline-grid; place-items: center; width: 27px; height: 27px; border-radius: 50%; padding-left: 2px; color: white; background: linear-gradient(130deg, #dba740, #a46302); font-size: 15px; }

.dm-approved-top .dmx-hero { position: relative; background: #f6edda url("../assets/homepage-approved-20261019/hero-bokeh-background.webp") center / cover; }
.dm-approved-top .dmx-hero::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(255,251,242,.12), rgba(255,255,255,.93) 16%, rgba(255,252,244,.63) 39%, transparent 58%, rgba(255,253,246,.62) 90%, rgba(255,255,255,.08)); }
.dm-approved-top .dmx-hero-stage { position: relative; width: min(92%, 1500px); min-height: 428px; margin-inline: auto; }
.dm-approved-top .dmx-hero-copy { position: relative; z-index: 2; width: 41.5%; padding: 26px 0 112px clamp(0px, 3.6vw, 60px); }
.dm-approved-top .dmx-hero-copy .dmx-eyebrow { margin-bottom: 8px; font-size: clamp(8px, .61vw, 10px); }
.dm-approved-top .dmx-hero-copy h1 { font-family: "Times New Roman", Georgia, serif; font-size: clamp(38px, 3.23vw, 52px); font-weight: 700; letter-spacing: -.045em; line-height: .9; }
.dm-approved-top .dmx-hero-copy h1 > span { position: relative; display: inline-block; padding-bottom: 6px; color: #c18b24; }
.dm-approved-top .dmx-hero-copy h1 > span::after { content: ""; position: absolute; inset: auto -3% -3px 0; height: 7px; border-top: 3px solid #b57913; border-radius: 50%; transform: rotate(.3deg); }
.dm-approved-top .dmx-hero-copy h2 { margin-top: 10px; font-family: "Times New Roman", Georgia, serif; font-size: clamp(18px, 1.33vw, 22px); font-weight: 700; line-height: 1.1; letter-spacing: -.025em; }
.dm-approved-top .dmx-description { margin-top: 8px; font-size: clamp(12.5px, .86vw, 14px); line-height: 1.26; letter-spacing: .015em; }
.dm-approved-top .dmx-actions { display: flex; gap: 11px; margin-top: 12px; }
.dm-approved-top .dmx-actions .dmx-button { flex: 1 1 auto; padding-inline: 12px; font-size: clamp(11px, .82vw, 13px); white-space: nowrap; }
/* The photograph, film strip, and benefits share a bottom anchor. This keeps
   the two old overlay fragments covered even when editable hero copy wraps. */
.dm-approved-top .dmx-hero-art { position: absolute; z-index: 1; bottom: 65px; left: 39.5%; width: 48.5333%; aspect-ratio: 728 / 363; overflow: hidden; }
.dm-approved-top .dmx-hero-art img { width: 100%; height: 100%; object-fit: contain; }
.dm-approved-top .dmx-features { position: absolute; z-index: 2; top: 23px; right: -.2%; display: grid; gap: 5px; width: 14.8%; list-style: none; }
.dm-approved-top .dmx-features li { display: flex; align-items: center; gap: 13px; min-height: 29px; font-size: clamp(10px, .73vw, 12px); line-height: 1.2; }
.dm-approved-top .dmx-features li > span { display: grid; flex: 0 0 31px; place-items: center; width: 31px; height: 31px; border: 1px solid #efd9b4; border-radius: 50%; background: #fff7e4; color: #b16e0a; }
.dm-approved-top .dmx-features .dmx-icon { width: 19px; height: 19px; }
.dm-approved-top .dmx-benefits { position: absolute; z-index: 4; bottom: -7px; left: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); width: 47.5%; min-height: 108px; padding: 8px 5px 10px; border: 2px solid #fff; border-radius: 12px; background: linear-gradient(135deg, #fffaf0, #f9f1e5); box-shadow: 0 2px 8px #663f0b14; list-style: none; }
.dm-approved-top .dmx-benefits li { position: relative; padding: 0 7px; text-align: center; }
.dm-approved-top .dmx-benefits li + li::before { position: absolute; top: 10px; bottom: 2px; left: 0; width: 1px; content: ""; background: #e8cba0; }
.dm-approved-top .dmx-benefit-icon { display: grid; place-items: center; width: 46px; height: 46px; margin: -7px auto 4px; border: 3px solid #fff; border-radius: 50%; outline: 1px solid #eed09e; background: linear-gradient(135deg, #f0cd7d, #c58719 52%, #a16003); color: #fff; }
.dm-approved-top .dmx-benefit-icon .dmx-icon { width: 30px; height: 30px; }
.dm-approved-top .dmx-benefits h3 { font-family: Arial, Helvetica, sans-serif; font-size: clamp(9px, .66vw, 11px); font-weight: 700; line-height: 1.1; text-transform: uppercase; }
.dm-approved-top .dmx-benefits p { margin-top: 2px; font-size: clamp(8px, .59vw, 10px); line-height: 1.16; }
.dm-approved-top .dmx-film { position: absolute; z-index: 5; right: 16.8%; bottom: 18px; display: grid; grid-template-columns: 39% 61%; align-items: center; width: 35.5%; min-height: 48px; padding: 3px 8px; border: 1px solid #d3b37b; border-radius: 6px; background: #fffaf0; box-shadow: 0 1px 3px #87612b13; }
.dm-approved-top .dmx-film-heading { display: flex; align-items: center; gap: 9px; padding-right: 8px; border-right: 1px solid #e9d6b6; }
.dm-approved-top .dmx-film-sparkle { display: grid; flex: 0 0 29px; place-items: center; width: 29px; height: 29px; border-radius: 50%; background: #05243e; color: #fff; }
.dm-approved-top .dmx-film-sparkle .dmx-icon { width: 21px; height: 21px; }
.dm-approved-top .dmx-film h3 { font-family: "Times New Roman", Georgia, serif; color: #946006; font-size: clamp(10px, .77vw, 13px); font-weight: 700; line-height: 1.06; text-transform: uppercase; }
.dm-approved-top .dmx-film-stages { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; padding-left: 10px; }
.dm-approved-top .dmx-film-stages figure { position: relative; display: flex; flex-direction: column; align-items: center; min-width: 0; }
.dm-approved-top .dmx-film-stages figure:not(:last-child)::after { position: absolute; top: 4px; right: -12px; content: "→"; color: #af6c06; font-size: 24px; line-height: 1; }
.dm-approved-top .dmx-film-stages img { width: 34px; height: 32px; border-radius: 2px; object-fit: cover; }
.dm-approved-top .dmx-film-stages figcaption { font-size: clamp(8px, .59vw, 10px); line-height: 1.05; text-align: center; white-space: nowrap; }
.dm-approved-top .dmx-hero-note { position: absolute; z-index: 3; right: -.8%; bottom: 15px; display: flex; flex-direction: column; justify-content: center; width: 18.7%; min-height: 138px; padding: 17px 17px 15px 24px; background: linear-gradient(115deg, #183f5b, #08283f); clip-path: polygon(5% 4%, 98% 0, 95% 8%, 100% 14%, 96% 23%, 100% 34%, 97% 46%, 100% 61%, 96% 72%, 100% 90%, 4% 99%, 7% 90%, 0 81%, 5% 71%, 0 60%, 4% 48%, 0 31%, 5% 20%, 1% 13%); color: #fff; transform: rotate(-4deg); }
.dm-approved-top .dmx-hero-note p { padding-bottom: 8px; border-bottom: 2px solid #d1a148; font-family: "Times New Roman", Georgia, serif; font-size: clamp(17px, 1.34vw, 23px); font-style: italic; line-height: 1.08; text-align: center; }
.dm-approved-top .dmx-hero-note > span { margin-top: 6px; font-size: clamp(8px, .59vw, 10px); line-height: 1.2; text-align: center; }

.dm-approved-top .dmx-reassurance { position: relative; border-block: 1px solid #d5b681; background: linear-gradient(110deg, #173c58, #0b2b46 65%, #183e58); color: #fff; }
.dm-approved-top .dmx-reassurance-inner { position: relative; width: min(88%, 1472px); min-height: 57px; margin-inline: auto; }
.dm-approved-top .dmx-reassurance ul { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: center; width: 63%; min-height: 57px; padding: 9px 0; list-style: none; }
.dm-approved-top .dmx-reassurance li { display: flex; align-items: center; gap: 12px; min-height: 28px; padding: 0 13px; }
.dm-approved-top .dmx-reassurance li:first-child { padding-left: 0; }
.dm-approved-top .dmx-reassurance li + li { border-left: 1px solid #718798; }
.dm-approved-top .dmx-reassurance li .dmx-icon { width: 28px; height: 28px; }
.dm-approved-top .dmx-reassurance li p { font-size: clamp(9px, .64vw, 11px); line-height: 1.25; }
.dm-approved-top .dmx-reassurance strong, .dm-approved-top .dmx-reassurance li span { display: block; font-weight: 400; }
.dm-approved-top .dmx-start-banner { position: absolute; z-index: 6; top: -17px; right: -1%; display: flex; align-items: center; gap: 14px; width: 37.4%; min-height: 77px; padding: 6px 15px 6px 4px; border: 1px solid #eddfc8; border-radius: 7px; background: #fffdf8; color: var(--dmx-navy); box-shadow: 0 3px 9px #72480b19; }
.dm-approved-top .dmx-start-banner > img { flex: 0 0 80px; width: 80px; height: 65px; object-fit: cover; }
.dm-approved-top .dmx-start-banner > div { flex: 1 1 auto; min-width: 0; }
.dm-approved-top .dmx-start-banner h2 { font-family: "Times New Roman", Georgia, serif; font-size: clamp(15px, 1.04vw, 18px); line-height: 1.05; }
.dm-approved-top .dmx-start-banner p { margin-top: 4px; font-size: clamp(9px, .6vw, 10px); line-height: 1.2; }
.dm-approved-top .dmx-start-banner .dmx-button { flex: 0 0 auto; min-height: 42px; padding-inline: 17px; font-size: 12px; gap: 9px; }

.dm-approved-top .dmx-how { display: grid; grid-template-columns: 28% 1fr; align-items: center; gap: 20px; width: min(88%, 1472px); margin-inline: auto; padding: 13px 0 12px; background: #fff; }
.dm-approved-top .dmx-how .dmx-eyebrow { font-size: 9px; }
.dm-approved-top .dmx-how-intro h2 { margin-top: 1px; font-family: "Times New Roman", Georgia, serif; font-size: clamp(33px, 2.66vw, 45px); font-weight: 700; letter-spacing: -.045em; line-height: 1; }
.dm-approved-top .dmx-how-intro > p:last-child { margin-top: 4px; font-size: clamp(11px, .83vw, 14px); line-height: 1.25; }
.dm-approved-top .dmx-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; list-style: none; }
.dm-approved-top .dmx-steps li { position: relative; display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 9px; }
.dm-approved-top .dmx-steps li:not(:last-child)::after { position: absolute; top: 22px; right: -16px; content: "›"; color: #ab6b0a; font-family: Arial, Helvetica, sans-serif; font-size: 28px; font-weight: 400; }
.dm-approved-top .dmx-step-number { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid #efd9b0; border-radius: 50%; background: #ffebc5; color: #935600; font-family: "Times New Roman", Georgia, serif; font-size: 23px; font-weight: 700; }
.dm-approved-top .dmx-steps .dmx-icon { display: block; width: 26px; height: 26px; margin-bottom: 5px; }
.dm-approved-top .dmx-steps h3 { font-family: "Times New Roman", Georgia, serif; font-size: clamp(13px, 1vw, 17px); font-weight: 700; line-height: 1.08; }
.dm-approved-top .dmx-steps p { margin-top: 4px; font-size: clamp(10px, .73vw, 12px); line-height: 1.25; }

.dm-approved-top .dmx-paths { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; width: 100%; scroll-margin-top: 92px; }
.dm-approved-top .dmx-path { position: relative; min-height: 240px; overflow: hidden; border-radius: 5px; background: #f7eedc url("../assets/homepage-approved-20261019/hero-bokeh-background.webp") center / cover; }
.dm-approved-top .dmx-path::after { content: ""; position: absolute; z-index: 1; inset: 0 42% 0 0; pointer-events: none; background: linear-gradient(90deg, rgba(255,249,235,.05), rgba(255,251,241,.98) 19%, rgba(255,251,241,.97) 77%, transparent); }
.dm-approved-top .dmx-path-copy { position: relative; z-index: 2; width: 46%; padding: 17px 9px 13px clamp(26px, 6vw, 100px); }
.dm-approved-top .dmx-path-copy .dmx-eyebrow { font-size: clamp(8px, .58vw, 10px); letter-spacing: .24em; }
.dm-approved-top .dmx-path-copy h2 { margin-top: 1px; font-family: "Times New Roman", Georgia, serif; font-size: clamp(27px, 2.03vw, 34px); font-weight: 700; line-height: 1; letter-spacing: -.035em; white-space: nowrap; }
.dm-approved-top .dmx-path-copy > p:not(.dmx-eyebrow) { margin-top: 4px; font-size: clamp(11px, .82vw, 14px); line-height: 1.25; }
.dm-approved-top .dmx-path-copy ul { margin-top: 7px; list-style: none; }
.dm-approved-top .dmx-path-copy li { position: relative; margin-top: 3px; padding-left: 25px; font-size: clamp(9px, .69vw, 11.5px); line-height: 1.24; }
.dm-approved-top .dmx-path-copy li::before { content: "✓"; position: absolute; top: -1px; left: 1px; display: grid; place-items: center; width: 16px; height: 16px; border-radius: 50%; color: #fff; background: #b97b12; font-size: 12px; font-weight: 700; }
.dm-approved-top .dmx-path-copy .dmx-button { gap: 9px; min-height: 30px; margin-top: 9px; padding: 6px 12px; font-size: clamp(8px, .61vw, 10px); letter-spacing: .04em; white-space: nowrap; }
.dm-approved-top .dmx-path-copy .dmx-button .dmx-icon { width: 17px; height: 17px; }
.dm-approved-top .dmx-path-art { position: absolute; z-index: 0; inset: 0 0 0 44%; overflow: hidden; }
.dm-approved-top .dmx-path-art img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.dm-approved-top .dmx-path-art:focus-visible { z-index: 3; outline-offset: -5px; }
.dm-approved-top .dmx-closing { display: flex; align-items: center; justify-content: center; gap: 55px; padding: 13px 24px 15px; border-bottom: 1px solid #eadcc4; background: #fffaf0; }
.dm-approved-top .dmx-closing > p { display: flex; align-items: center; gap: 13px; color: #a56911; font-family: "Times New Roman", Georgia, serif; font-size: clamp(22px, 1.65vw, 28px); font-style: italic; line-height: 1.1; }
.dm-approved-top .dmx-closing > p .dmx-icon { width: 29px; height: 29px; stroke-width: 1.1; }
.dm-approved-top .dmx-closing > a { display: inline-flex; align-items: center; gap: 9px; border-bottom: 1px solid #c09451; padding-bottom: 2px; font-size: 12px; }
.dm-approved-top .dmx-closing > a .dmx-icon { width: 18px; height: 18px; color: #a66b0a; }

@media (min-width: 1200px) and (max-width: 1439px) {
  .dm-approved-top .dmx-hero-stage { width: 94%; min-height: 403px; }
  .dm-approved-top .dmx-hero-copy { padding-left: 26px; padding-top: 24px; }
  .dm-approved-top .dmx-hero-copy h1 { font-size: 3.3vw; }
  .dm-approved-top .dmx-features { gap: 3px; }
  .dm-approved-top .dmx-features li { gap: 8px; }
  .dm-approved-top .dmx-start-banner { gap: 9px; padding-right: 9px; }
  .dm-approved-top .dmx-start-banner > img { flex-basis: 55px; width: 55px; }
  .dm-approved-top .dmx-start-banner .dmx-button { font-size: 10px; padding-inline: 10px; }
  .dm-approved-top .dmx-reassurance li { padding-inline: 8px; gap: 7px; }
  .dm-approved-top .dmx-reassurance li .dmx-icon { width: 23px; height: 23px; }
  .dm-approved-top .dmx-path { min-height: 240px; }
  .dm-approved-top .dmx-path-copy { width: 47%; padding-left: 5vw; }
  .dm-approved-top .dmx-path-copy li { padding-left: 22px; }
}

@media (max-width: 1199px) {
  .dm-approved-top .dmx-hero-stage { display: flex; flex-direction: column; align-items: stretch; gap: 20px; width: min(90%, 920px); min-height: 0; padding: 27px 0 25px; }
  .dm-approved-top .dmx-hero::before { background: linear-gradient(90deg, #fffaf0df, #fffdf8eb 55%, #fff8ebad); }
  .dm-approved-top .dmx-hero-copy { order: 1; width: 100%; padding: 0; }
  .dm-approved-top .dmx-hero-copy .dmx-eyebrow { font-size: 10px; }
  .dm-approved-top .dmx-hero-copy h1 { font-size: clamp(36px, 5.5vw, 58px); line-height: .96; }
  .dm-approved-top .dmx-hero-copy h2 { max-width: 710px; margin-top: 13px; font-size: 23px; line-height: 1.2; }
  .dm-approved-top .dmx-description { max-width: 690px; margin-top: 9px; font-size: 15px; line-height: 1.4; }
  .dm-approved-top .dmx-actions { max-width: 540px; margin-top: 17px; }
  .dm-approved-top .dmx-actions .dmx-button { min-height: 46px; font-size: 13px; }
  .dm-approved-top .dmx-hero-art { position: relative; inset: auto; order: 2; width: min(100%, 580px); margin-inline: auto; aspect-ratio: 432 / 363; border-radius: 6px; }
  .dm-approved-top .dmx-film { position: relative; inset: auto; order: 3; width: min(100%, 650px); min-height: 70px; margin: -12px auto 0; padding: 8px 12px; }
  .dm-approved-top .dmx-film h3 { font-size: 15px; line-height: 1.1; }
  .dm-approved-top .dmx-film-stages img { width: 46px; height: 43px; }
  .dm-approved-top .dmx-film-stages figcaption { margin-top: 2px; font-size: 10px; }
  .dm-approved-top .dmx-film-stages figure:not(:last-child)::after { top: 10px; right: -13px; }
  .dm-approved-top .dmx-features { position: relative; inset: auto; order: 4; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px 13px; width: 100%; }
  .dm-approved-top .dmx-features li { gap: 9px; font-size: 12px; }
  .dm-approved-top .dmx-benefits { position: relative; inset: auto; order: 5; width: 100%; min-height: 116px; padding-top: 12px; }
  .dm-approved-top .dmx-benefits h3 { font-size: 12px; }
  .dm-approved-top .dmx-benefits p { margin-top: 5px; font-size: 11px; }
  .dm-approved-top .dmx-hero-note { position: relative; inset: auto; order: 6; align-self: center; width: min(100%, 370px); min-height: 112px; margin-top: 2px; transform: rotate(-3deg); }
  .dm-approved-top .dmx-hero-note p { font-size: 24px; }
  .dm-approved-top .dmx-hero-note > span { font-size: 11px; }
  .dm-approved-top .dmx-reassurance-inner { width: min(90%, 920px); padding-bottom: 17px; }
  .dm-approved-top .dmx-reassurance ul { width: 100%; padding: 17px 0; }
  .dm-approved-top .dmx-reassurance li p { font-size: 11px; }
  .dm-approved-top .dmx-reassurance li { gap: 9px; padding-inline: 12px; }
  .dm-approved-top .dmx-start-banner { position: relative; inset: auto; width: min(100%, 660px); margin-inline: auto; min-height: 78px; gap: 16px; padding: 6px 15px 6px 5px; }
  .dm-approved-top .dmx-start-banner h2 { font-size: 20px; }
  .dm-approved-top .dmx-start-banner p { font-size: 11px; }
  .dm-approved-top .dmx-start-banner .dmx-button { font-size: 12px; }
  .dm-approved-top .dmx-how { grid-template-columns: 1fr; gap: 18px; width: min(90%, 920px); padding-block: 24px; }
  .dm-approved-top .dmx-how-intro h2 { margin-top: 4px; font-size: 40px; }
  .dm-approved-top .dmx-how-intro > p:last-child { font-size: 14px; }
  .dm-approved-top .dmx-steps { gap: 28px; }
  .dm-approved-top .dmx-steps h3 { font-size: 16px; }
  .dm-approved-top .dmx-steps p { font-size: 12px; }
  .dm-approved-top .dmx-paths { grid-template-columns: 1fr; gap: 8px; }
  .dm-approved-top .dmx-path { min-height: 276px; }
  .dm-approved-top .dmx-path-copy { width: 45%; padding: 24px 12px 20px 5vw; }
  .dm-approved-top .dmx-path-copy .dmx-eyebrow { font-size: 10px; }
  .dm-approved-top .dmx-path-copy h2 { font-size: 34px; }
  .dm-approved-top .dmx-path-copy > p:not(.dmx-eyebrow) { max-width: 350px; margin-top: 7px; font-size: 15px; }
  .dm-approved-top .dmx-path-copy li { margin-top: 5px; font-size: 12px; }
  .dm-approved-top .dmx-path-copy .dmx-button { min-height: 40px; font-size: 11px; }
  .dm-approved-top .dmx-path-art { inset-inline-start: 44%; }
  .dm-approved-top .dmx-closing { flex-wrap: wrap; gap: 14px 30px; padding-block: 22px; }
  .dm-approved-top .dmx-closing > p { font-size: 27px; }
}

@media (max-width: 700px) {
  .dm-approved-top .dmx-features { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dm-approved-top .dmx-benefits { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 20px; padding: 16px 7px 14px; }
  .dm-approved-top .dmx-benefits li:nth-child(4)::before { display: none; }
  .dm-approved-top .dmx-reassurance ul { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 0; }
  .dm-approved-top .dmx-reassurance li:nth-child(3) { border-left: 0; padding-left: 0; }
  .dm-approved-top .dmx-reassurance li p { font-size: 12px; }
  .dm-approved-top .dmx-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 23px; }
  .dm-approved-top .dmx-steps li::after { display: none; }
  .dm-approved-top .dmx-path-copy { width: 50%; padding-left: 5vw; }
  .dm-approved-top .dmx-path-copy h2 { font-size: 29px; white-space: normal; }
  .dm-approved-top .dmx-path-copy > p:not(.dmx-eyebrow) { font-size: 13px; }
  .dm-approved-top .dmx-path-copy li { font-size: 11px; }
  .dm-approved-top .dmx-path-copy .dmx-button { font-size: 9px; padding-inline: 10px; white-space: normal; }
  .dm-approved-top .dmx-path-art { inset-inline-start: 46%; }
  .dm-approved-top .dmx-closing > p { flex-wrap: wrap; justify-content: center; gap: 2px 10px; font-size: 25px; text-align: center; }
}

@media (max-width: 500px) {
  .dm-approved-top .dmx-hero-stage { width: 90%; gap: 20px; padding-top: 23px; }
  .dm-approved-top .dmx-hero-copy h1 { font-size: clamp(31px, 8.2vw, 41px); line-height: .99; letter-spacing: -.048em; }
  .dm-approved-top .dmx-hero-copy .dmx-eyebrow { font-size: 8px; letter-spacing: .22em; }
  .dm-approved-top .dmx-hero-copy h2 { font-size: 20px; line-height: 1.14; }
  .dm-approved-top .dmx-description { font-size: 14px; }
  .dm-approved-top .dmx-actions { flex-direction: column; gap: 10px; }
  .dm-approved-top .dmx-actions .dmx-button { min-height: 45px; font-size: 13px; }
  .dm-approved-top .dmx-film { grid-template-columns: 1fr; gap: 10px; padding: 12px; }
  .dm-approved-top .dmx-film-heading { justify-content: center; padding: 0; border-right: 0; }
  .dm-approved-top .dmx-film h3 { font-size: 15px; }
  .dm-approved-top .dmx-film-stages { gap: 19px; padding: 0; }
  .dm-approved-top .dmx-film-stages img { width: 60px; height: 58px; }
  .dm-approved-top .dmx-film-stages figcaption { font-size: 10px; }
  .dm-approved-top .dmx-film-stages figure:not(:last-child)::after { top: 18px; right: -19px; }
  .dm-approved-top .dmx-features li { gap: 7px; font-size: 11px; }
  .dm-approved-top .dmx-benefits { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 18px; }
  .dm-approved-top .dmx-benefits li:nth-child(odd)::before { display: none; }
  .dm-approved-top .dmx-benefits li:nth-child(4)::before { display: block; }
  .dm-approved-top .dmx-benefits li:last-child { grid-column: 1 / -1; }
  .dm-approved-top .dmx-benefits h3 { font-size: 11px; }
  .dm-approved-top .dmx-benefits p { font-size: 11px; }
  .dm-approved-top .dmx-start-banner { display: grid; grid-template-columns: 62px 1fr; gap: 8px 11px; padding: 9px; }
  .dm-approved-top .dmx-start-banner > img { width: 62px; height: 60px; }
  .dm-approved-top .dmx-start-banner h2 { font-size: 18px; }
  .dm-approved-top .dmx-start-banner p { font-size: 10px; }
  .dm-approved-top .dmx-start-banner .dmx-button { grid-column: 1 / -1; width: 100%; min-height: 44px; }
  .dm-approved-top .dmx-reassurance li { padding-right: 6px; gap: 7px; }
  .dm-approved-top .dmx-reassurance li .dmx-icon { width: 25px; height: 25px; }
  .dm-approved-top .dmx-reassurance li p { font-size: 10px; }
  .dm-approved-top .dmx-steps li { grid-template-columns: 30px 1fr; gap: 7px; }
  .dm-approved-top .dmx-step-number { width: 30px; height: 30px; font-size: 20px; }
  .dm-approved-top .dmx-steps h3 { font-size: 15px; }
  .dm-approved-top .dmx-steps p { font-size: 12px; }
  .dm-approved-top .dmx-path { min-height: 0; }
  .dm-approved-top .dmx-path::after { inset: 0 0 40%; background: linear-gradient(#fffaf0e8, #fffaf0f5); }
  .dm-approved-top .dmx-path-copy { width: 100%; padding: 23px 6vw 20px; }
  .dm-approved-top .dmx-path-copy h2 { font-size: 34px; }
  .dm-approved-top .dmx-path-copy > p:not(.dmx-eyebrow) { max-width: none; font-size: 14px; }
  .dm-approved-top .dmx-path-copy li { font-size: 12px; }
  .dm-approved-top .dmx-path-copy .dmx-button { min-height: 42px; margin-top: 13px; padding-inline: 16px; font-size: 11px; }
  .dm-approved-top .dmx-path-art { position: relative; z-index: 2; inset: auto; display: block; width: 100%; aspect-ratio: 490 / 237; }
  .dm-approved-top .dmx-path-pet .dmx-path-art { aspect-ratio: 460 / 238; }
  .dm-approved-top .dmx-path-art img { object-fit: contain; }
  .dm-approved-top .dmx-closing > p { flex-direction: column; gap: 5px; font-size: 27px; }
  .dm-approved-top .dmx-closing > p .dmx-icon { width: 27px; height: 27px; }
}

@media (prefers-reduced-motion: reduce) {
  .dm-approved-top .dmx-button { transition: none; }
}