/* =====================================================================
   Ask Moiz · v3 Kinetic Bento · AM Digital Academy (page styles)
   Loaded after site.css + services.css on academy/*.html only.
   Tokens only (--y --ink --ink-2 --ink-3 --n* --paper --r-* --gap --pad
   --ease-out --spring-pop). Prefix: .aca-

   Contents
    1  Landing hero: homepage-style bento (portrait + ring fact sticker,
       welcome-video poster, guarantee tile, the shared deal tile)
    2  Review ribbon (the page's one marquee)
    3  Proof: three stats + three reviews; shared review card (.rv)
    4  Fit pair
    5  Curriculum: six stage accordions + the clip shelf
    6  Skills (black band): twelve cells
    7  Included bento + price card (the strike that draws across 50,000)
    8  How you get in (black)
    9  Instructor bento, account screenshots, endorsements, logos
   10  Student reviews bento, the screenshot wall, placeholders
   11  Guarantee seal
   12  Media dialog (videos + "View original")
   13  checkout.html: summary lines, order bump, amount due, payment block
   14  thank-you.html: status tracker, main action, goal chips, video tile
   15  Motion + reduced motion
   ===================================================================== */

/* ---------- 1. Landing hero ---------- */
/* the sticker breaks at the dot, never inside "Moiz Khan" */
.aca-hero .svc-hero__sub { max-width: 44ch; }
.aca-watch .i--fill { width: 16px; height: 16px; margin: 0 8px 0 2px; vertical-align: -2px; }

/* welcome-video poster (a pressable tile; it plays in the dialog) */
.aca-hero__video { min-height: 184px; }
.aca-vid { position: relative; height: 100%; min-height: 184px; padding: 0; display: block; }
.aca-vid__img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 40% 30%;
}
.aca-play {
  position: absolute; left: 50%; top: 42%; display: grid; place-items: center;
  width: 60px; height: 60px; margin: -30px 0 0 -30px; border-radius: 50%;
  background: var(--y); color: var(--ink); border: 2px solid var(--ink); box-shadow: 3px 3px 0 var(--ink);
  transition: transform 160ms var(--ease-out);
}
.aca-play .i { width: 24px; height: 24px; margin-left: 3px; }
.aca-play--sm { position: static; width: 44px; height: 44px; margin: 0; box-shadow: none; }
.aca-play--sm .i { width: 18px; height: 18px; margin-left: 2px; }
.aca-vid__cap {
  position: absolute; left: 10px; right: 10px; bottom: 10px; display: flex; flex-direction: column; gap: 1px;
  padding: 8px 12px; background: #fff; color: var(--ink); border: 2px solid var(--ink); border-radius: 12px;
  font-size: 12px; font-weight: 600; line-height: 1.3;
}
.aca-vid__cap b { font-size: 13px; font-weight: 800; }
@media (hover: hover) and (pointer: fine) { .press:hover .aca-play { transform: scale(1.06); } }

/* guarantee tile */
.aca-g { display: flex; flex-direction: column; justify-content: space-between; gap: 8px; height: 100%; min-height: 184px; padding: 16px; }
.aca-g__i { width: 30px; height: 30px; stroke-width: 2.25; }
.aca-g__t { font-size: 17px; font-weight: 800; line-height: 1.15; letter-spacing: -0.01em; text-transform: uppercase; }
.aca-g__s { font-size: 13px; font-weight: 600; line-height: 1.35; color: var(--ink-3); }

/* the deal tile is the shared .svc-hero__deal (services.css §2); only its place in this bento is set here */
.aca-deal .svc-price__save s {
  display: inline-flex; padding: 4px 10px; border-radius: 999px; background: var(--n100); color: var(--n600);
  font-size: 13px; font-weight: 700; white-space: nowrap;
}

/* phones: the shared order (promise, price, then the portrait), then video + guarantee side by side */
.aca-hero__video { grid-column: 1; order: 3; }
.aca-hero__g { grid-column: 2; order: 3; }
@media (max-width: 767px) {
  .aca-g__t { font-size: 15px; }
  .aca-vid__cap span { display: none; }
}
@media (min-width: 768px) {
  .aca-hero__grid > .svc-hero__copy { grid-row: 1; }
  .aca-hero .svc-hero__portrait { grid-column: 1 / 4; grid-row: 2 / 4; height: auto; min-height: 420px; }
  .aca-hero__video { grid-column: 4 / 7; grid-row: 2; min-height: 220px; }
  .aca-vid { min-height: 220px; }
  .aca-hero__g { grid-column: 4 / 7; grid-row: 3; }
  .aca-g { min-height: 0; padding: 18px 20px; }
  .aca-deal { grid-column: 1 / 7; grid-row: 4; padding: 18px 22px; }
}
@media (min-width: 1200px) {
  .aca-hero__grid {
    grid-template-rows: repeat(3, clamp(118px, 10.4vw, 150px)) auto;
  }
  .aca-hero .svc-hero__copy { grid-column: 1 / 7; grid-row: 1 / 5; padding: 0 28px 0 0; }
  .aca-hero .svc-hero__portrait { grid-column: 7 / 10; grid-row: 1 / 4; min-height: 0; }
  .aca-hero .svc-hero__cutout { left: 50%; height: 93%; }
  .aca-hero .svc-hero__disc { left: 50%; top: 56%; width: 84%; }
  .aca-hero__video { grid-column: 10 / 13; grid-row: 1 / 3; min-height: 0; }
  .aca-vid { min-height: 0; }
  .aca-hero__g { grid-column: 10 / 13; grid-row: 3; }
  .aca-g { padding: 14px 16px; gap: 4px; }
  .aca-g__i { width: 26px; height: 26px; }
  .aca-deal { grid-column: 7 / 13; grid-row: 4; gap: 12px; padding: 16px 20px 18px; }
  .aca-hero .ring { top: -44px; left: -44px; }
}

/* ---------- 2. Proof ribbon: the shared client-logo ribbon (services.css §3) ---------- */

/* ---------- 3. Proof: stats + three reviews ---------- */
.aca-proof { padding: 28px 0 var(--sec); }
.aca-stats { list-style: none; padding: 0; margin: 0; }   /* the shared four-tile strip (services.css §3) */
.aca-proof__lead { margin: 44px 0 16px; font-size: var(--t-h4); font-weight: 700; letter-spacing: -0.01em; max-width: 46ch; }
.aca-trio { display: grid; gap: var(--gap); }
/* phones: the three reviews are one swipe row (the homepage testimonial pattern), so proof costs one card of height */
@media (max-width: 767px) {
  .aca-trio {
    margin: 0 calc(-1 * var(--gutter)); padding: 4px var(--gutter) 12px;
    display: flex; gap: 12px; overflow-x: auto; overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory; scroll-padding-inline: var(--gutter); scrollbar-width: thin;
  }
  .aca-trio > .rv { flex: 0 0 86%; scroll-snap-align: start; }
  .js .aca-trio > .reveal { opacity: 1; transform: none; transition: none; }
}
@media (min-width: 768px) {
  .aca-trio { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .aca-trio > .rv--lead { grid-column: 1 / -1; }
}
@media (min-width: 1024px) {
  .aca-proof { padding-top: 40px; }
  .aca-trio { grid-template-columns: minmax(0, 6fr) minmax(0, 3fr) minmax(0, 3fr); }
  .aca-trio > .rv--lead { grid-column: auto; }
}

/* review card, shared by proof and the reviews fold */
.rv { margin: 0; display: flex; flex-direction: column; gap: 18px; }
.rv blockquote { margin: 0; }
.rv blockquote p { font-size: 16px; line-height: 1.55; }
.rv--lead { padding: 28px 24px; }
.rv--lead blockquote p { font-size: clamp(20px, 0.8vw + 15px, 26px); font-weight: 700; line-height: 1.3; letter-spacing: -0.015em; }
.rv__cap { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; margin-top: auto; line-height: 1.35; }
.rv__cap b { font-size: 15px; }
.rv__meta { font-size: 13px; font-weight: 600; color: var(--n600); }
.tile--ink .rv__meta { color: var(--n300); }
.tile--sun .rv__meta { color: var(--ink-3); }
.rv__stars { letter-spacing: 0.08em; color: var(--ink); }
.tile--ink .rv__stars { color: var(--y); }
.rv__orig {
  display: inline-flex; align-items: center; gap: 6px; min-height: 44px; margin-bottom: -10px;
  font-size: 13px; font-weight: 700; color: inherit;
  text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; text-decoration-color: var(--ink);
}
.rv__orig .i { width: 15px; height: 15px; }
.tile--ink .rv__orig { text-decoration-color: var(--y); }

/* a link inside a running sentence: keeps the line box (the site's a.link is an inline-block with 11px padding,
   which breaks the sentence as a unit and opens a gap between lines); inline links are exempt from target size */
a.link.aca-inline { display: inline; padding-block: 0; line-height: inherit; text-decoration-thickness: 2px; text-underline-offset: 4px; }
a.link.aca-inline .i { width: 16px; height: 16px; margin-left: 4px; }

/* ---------- 4. Fit pair ---------- */
.aca-fit__yes, .aca-fit__no { padding: 26px 22px; }
.aca-who { list-style: none; padding: 0; margin-top: 18px; display: grid; gap: 16px; }
.aca-who li { display: flex; align-items: flex-start; gap: 14px; }
.aca-who__i {
  flex: none; display: grid; place-items: center; width: 44px; height: 44px;
  border-radius: 12px; background: var(--y); border: 2px solid var(--ink);
}
.aca-who__i .i { width: 22px; height: 22px; }
.aca-who p { padding-top: 9px; font-size: 16px; line-height: 1.5; }
.aca-who b { font-weight: 800; }
.aca-fit__no .ticks li { font-size: 16px; line-height: 1.5; }
.aca-fit__go { margin-top: 24px; }
@media (min-width: 768px) {
  .aca-fit__yes, .aca-fit__no { padding: 32px; }
  .aca-who { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 28px; }
}

/* ---------- 5. Curriculum ---------- */
.aca-learn__grid { margin-top: 40px; display: grid; gap: 28px; align-items: start; }
.aca-learn__main { display: grid; gap: 20px; min-width: 0; }

/* "Where should you start?": one question, the homepage quiz's option style (selected = the face turns ink) */
.aca-start { display: grid; gap: 14px; padding: 22px 20px; }
.aca-start[hidden] { display: none; }
.aca-start__h { font-size: var(--t-h4); font-weight: 800; letter-spacing: -0.015em; line-height: 1.2; }
.aca-start__opts { display: flex; flex-wrap: wrap; gap: 10px 12px; }
.aca-start__opt {
  position: relative; isolation: isolate; padding: 0; margin: 0 4px 4px 0; border: 0; border-radius: 999px; background: none;
  font: inherit; color: inherit; cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.aca-start__opt::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; background: var(--ink); transform: translate(3px, 3px); }
.aca-start__face {
  display: inline-flex; align-items: center; min-height: 44px; padding: 8px 18px;
  border: 2px solid var(--ink); border-radius: inherit; background: #fff;
  font-size: 15px; font-weight: 700; line-height: 1.25; text-align: left;
  transition: transform 160ms var(--ease-out), background-color 120ms ease, color 120ms ease;
}
.aca-start__opt[aria-pressed="true"] .aca-start__face { background: var(--ink); color: #fff; }
.aca-start__opt:active .aca-start__face { transform: translate(2px, 2px) scale(0.97); transition-duration: 100ms; }
@media (hover: hover) and (pointer: fine) { .aca-start__opt:hover .aca-start__face { transform: translate(-2px, -2px); } }
.aca-start__out { font-size: 15px; font-weight: 600; line-height: 1.45; color: var(--ink); }
.aca-start__out:empty { display: none; }
.aca-start__out b { font-weight: 800; }
/* the "Start here" sticker the answer puts on its stage */
.aca-here { flex: none; height: 26px; padding: 0 10px; font-size: 11px; --rot: -4deg; transform: rotate(var(--rot)); }
@media (max-width: 479px) { .aca-here { position: absolute; top: -13px; right: 52px; } }
.aca-stage summary { position: relative; }
.aca-stages { list-style: none; padding: 0; display: grid; gap: 12px; }
.aca-stage summary { justify-content: flex-start; gap: 14px; padding-left: 14px; }
.aca-stage__n {
  flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%;
  background: var(--y); border: 2px solid var(--ink); font-size: 18px; letter-spacing: -0.02em;
  transition: background-color 160ms ease, color 160ms ease;
}
.aca-stage[open] .aca-stage__n { background: var(--ink); color: var(--y); }
.aca-stage__t { flex: 1; min-width: 0; }
.aca-stage .qa__icon { flex: none; }
.aca-stage .ticks.qa__a { margin: 0; padding: 0 18px 20px; }
@media (min-width: 560px) { .aca-stage .ticks.qa__a { padding-left: 74px; } }

.aca-clips { padding: 26px 22px; }
.aca-clips .h3 { color: #fff; }
.aca-clips__sub { margin-top: 6px; font-size: 15px; font-weight: 600; color: var(--n300); }
.aca-clips__grid { list-style: none; padding: 0; margin: 22px 0 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 16px; }
.aca-clips__grid li { position: relative; isolation: isolate; margin: 0 4px 4px 0; }
.aca-clips__grid li::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: var(--r-in); background: var(--y); transform: translate(4px, 4px); }
.aca-clip {
  position: relative; display: flex; flex-direction: column; justify-content: space-between; gap: 18px; height: 100%; min-height: 132px;
  padding: 14px; border: 2px solid #fff; border-radius: var(--r-in); background: var(--ink-2); color: #fff; text-decoration: none;
  transition: transform 160ms var(--ease-out);
}
.aca-clip__t { font-size: 16px; font-weight: 800; line-height: 1.2; letter-spacing: -0.01em; }
.aca-clip__k { margin-top: -14px; font-size: 12px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--n400); }
.aca-clip:active { transform: translate(3px, 3px) scale(0.98); transition-duration: 100ms; }
@media (hover: hover) and (pointer: fine) { .aca-clip:hover { transform: translate(-2px, -2px); } }
.aca-clips__ph { margin-top: 18px; }
.aca-clips .ph-inline, .aca-access .ph-inline { background: var(--n900); color: var(--n400); border-color: var(--n600); }
@media (min-width: 768px) { .aca-clips { padding: 32px; } }
@media (min-width: 1024px) {
  .aca-learn__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 36px; }
  .aca-clips { position: sticky; top: 96px; }
}

/* ---------- 6. Skills (black band) ---------- */
.aca-skills { background: var(--ink); color: #fff; --focus: var(--y); --halo: transparent; }
.aca-skills__grid { list-style: none; padding: 0; margin: 44px 0 0; display: grid; gap: var(--gap); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.aca-skill {
  display: flex; flex-direction: column; justify-content: space-between; gap: 14px; min-height: 124px;
}
.aca-skill:not(.aca-skill--big) { background: var(--ink-2); box-shadow: inset 0 0 0 1px var(--n800); }
.aca-skill--big { grid-column: 1 / -1; min-height: 220px; box-shadow: none; color: var(--ink); }
.aca-skill--big.tile--card { border-color: #fff; }
.aca-skill__t { font-size: 16px; font-weight: 700; line-height: 1.25; letter-spacing: -0.01em; }
.aca-skill--big .aca-skill__t { font-size: clamp(24px, 1.2vw + 18px, 34px); font-weight: 800; line-height: 1.05; letter-spacing: -0.025em; text-transform: uppercase; }
.aca-skill--big p { margin-top: -6px; font-size: 15px; line-height: 1.5; max-width: 38ch; color: var(--ink-3); }
.aca-skill__icons { display: flex; gap: 8px; }
.aca-ico {
  display: grid; place-items: center; flex: none; width: 44px; height: 44px;
  border-radius: 12px; background: #fff; border: 2px solid var(--ink); color: var(--ink);
}
.aca-ico img { width: 60%; height: auto; filter: grayscale(1) contrast(1.15); }
.aca-ico .i { width: 22px; height: 22px; }
.aca-skill--big .aca-ico { width: 56px; height: 56px; }
/* phones: the ten smaller skills read as compact icon + name rows, so the band is one screen, not three */
@media (max-width: 767px) {
  .aca-skills__grid { gap: 10px; }
  .aca-skill:not(.aca-skill--big) { flex-direction: row; align-items: center; justify-content: flex-start; gap: 10px; min-height: 64px; padding: 10px 12px; }
  .aca-skill:not(.aca-skill--big) .aca-ico { width: 38px; height: 38px; border-radius: 10px; }
  .aca-skill:not(.aca-skill--big) .aca-ico .i { width: 19px; height: 19px; }
  .aca-skill:not(.aca-skill--big) .aca-skill__t { font-size: 14px; line-height: 1.2; }
  .aca-skill--big { min-height: 0; gap: 18px; }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .aca-skills__grid { grid-template-columns: repeat(10, minmax(0, 1fr)); }
  .aca-skill { grid-column: span 2; }
  .aca-skill--big { grid-column: span 5; }
}
@media (min-width: 1024px) {
  .aca-skills__grid { grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-rows: minmax(132px, auto); }
  .aca-skill { grid-column: span 2; }
  .aca-skill--big { grid-row: 1 / 3; grid-column: span 4; padding: 28px; }
  .aca-skill:nth-child(3) { grid-column: 9 / 11; grid-row: 1; }
  .aca-skill:nth-child(4) { grid-column: 11 / 13; grid-row: 1; }
  .aca-skill:nth-child(5) { grid-column: 9 / 11; grid-row: 2; }
  .aca-skill:nth-child(6) { grid-column: 11 / 13; grid-row: 2; }
}

/* ---------- 7. Included + price card ---------- */
.aca-inc { margin-top: 44px; display: grid; gap: 28px; align-items: start; }
.aca-inc__grid { display: grid; gap: var(--gap); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.aca-inc__hours { grid-column: 1 / -1; display: flex; flex-direction: column; justify-content: space-between; gap: 18px; min-height: 220px; }
.aca-inc__big { font-size: clamp(96px, 7vw + 48px, 168px); line-height: 0.82; letter-spacing: -0.055em; }
.aca-inc__k { font-size: 20px; font-weight: 800; line-height: 1.2; color: #fff; }
.aca-inc__s { margin-top: 4px; font-size: 14px; font-weight: 600; color: var(--n300); }
.aca-inc__cell, .aca-inc__cert { display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 8px; text-align: left; }
.aca-inc__cell p { font-size: 15px; color: var(--ink-3); }
.aca-inc__cert { background: #fff; }
.aca-inc__cert .ph__label { font-size: 12px; }
.aca-inc__i { display: grid; place-items: center; width: 44px; height: 44px; margin-bottom: 4px; border-radius: 50%; background: var(--y); border: 2px solid var(--ink); }
.aca-inc__i .i { width: 22px; height: 22px; }
.aca-inc__rest { grid-column: 1 / -1; }
.aca-inc__rest .ticks { margin-top: 14px; }
@media (min-width: 560px) {
  .aca-inc__hours { grid-column: 1; grid-row: 1 / 3; }
  .aca-inc__cell { grid-column: 2; grid-row: 1; }
  .aca-inc__cert { grid-column: 2; grid-row: 2; }
  .aca-inc__rest .ticks { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 24px; }
}
@media (min-width: 1024px) {
  .aca-inc { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 36px; }
  .aca-card { margin-top: 0; }
}

.aca-card { margin-top: 18px; gap: 12px; }
.aca-card__name { font-size: var(--t-h4); font-weight: 800; letter-spacing: -0.01em; }
.aca-card .price__big { margin-top: 2px; }
.aca-card__was { margin-top: -2px; }
.aca-strike { position: relative; display: inline-block; font-size: 18px; font-weight: 700; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.aca-strike::after {
  content: ""; position: absolute; left: -6%; right: -6%; top: 50%; height: 3px; margin-top: -1px;
  border-radius: 2px; background: var(--ink); transform: rotate(-7deg); transform-origin: left center;
}
.aca-card__add {
  display: flex; align-items: flex-start; gap: 10px; padding: 10px 12px; margin-top: 4px;
  border: 2px dashed var(--ink); border-radius: 12px; background: rgba(255, 255, 255, 0.55);
  font-size: 15px; font-weight: 600; line-height: 1.4;
}
.aca-card__add .i { flex: none; width: 18px; height: 18px; margin-top: 2px; stroke-width: 3; }
.aca-card .btn { margin-top: 6px; }

/* ---------- 8. How you get in (black) ---------- */
.aca-access { background: var(--ink); color: #fff; --focus: var(--y); --halo: transparent; padding-block: var(--sec); }
.aca-access__list { list-style: none; padding: 0; margin: 44px 0 0; display: grid; gap: 16px; }
.aca-step { position: relative; display: flex; flex-direction: column; gap: 12px; padding: 24px 22px; border-radius: var(--r-tile); background: var(--ink-2); }
.aca-step .h4 { color: #fff; }
.aca-step p { font-size: 15px; line-height: 1.5; color: var(--n300); }
.aca-step__icon { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: var(--y); color: var(--ink); border: 2px solid var(--ink); }
.aca-step__icon .i { width: 24px; height: 24px; }
.aca-step--now { box-shadow: inset 0 0 0 2px var(--y); }
.aca-step__time { margin-top: auto; padding-top: 6px; display: flex; align-items: baseline; gap: 8px; font-size: 16px; font-weight: 700; color: #fff !important; }
.aca-step__time .num { font-size: clamp(48px, 2vw + 34px, 64px); color: var(--y); }
.aca-step:not(:last-child)::after { content: ""; position: absolute; left: 47px; bottom: -17px; height: 18px; border-left: 2px dashed var(--y); }
.aca-access__foot { margin-top: 40px; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 28px; }
.aca-access__intl { font-size: 15px; font-weight: 600; color: var(--n300); max-width: 52ch; }
.aca-access__intl .link { color: #fff; text-decoration-color: var(--y); }
@media (min-width: 768px) {
  .aca-access__list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .aca-step { padding: 28px 26px; }
  .aca-step:not(:last-child)::after { left: auto; right: -17px; bottom: auto; top: 53px; width: 18px; height: 0; border-left: 0; border-top: 2px dashed var(--y); }
}

/* ---------- 9. Instructor ---------- */
.aca-about__grid > * { grid-column: 1 / -1; }
.aca-about__photo { min-height: 400px; padding: 0; }
.aca-about__text { padding: 12px 0 4px; }
.aca-about__text .h2 { max-width: 17ch; }
.aca-about__stats { list-style: none; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 18px; align-content: center; padding: 26px 24px; }
.aca-about__stats li { display: flex; flex-direction: column; gap: 4px; }
.aca-about__stats .num { font-size: clamp(38px, 1.6vw + 26px, 54px); }
.aca-about__stats li > span:last-child { font-size: 15px; font-weight: 600; color: #fff; }
.aca-teach { margin: 0; padding: 10px; display: flex; flex-direction: column; gap: 10px; }
.aca-teach img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; object-position: 50% 28%; border-radius: 12px; }
.aca-teach figcaption { padding: 0 6px 4px; font-size: 14px; font-weight: 700; }
@media (min-width: 768px) {
  .aca-about__photo { grid-column: 1 / 4; grid-row: 1 / 3; min-height: 500px; }
  .aca-about__text { grid-column: 4 / 7; grid-row: 1; padding-left: 12px; }
  .aca-about__stats { grid-column: 4 / 7; grid-row: 2; }
  .aca-teach { grid-column: 1 / 7; grid-row: 3; }
  .aca-teach img { aspect-ratio: 16 / 7; object-position: 50% 30%; }
}
@media (min-width: 1024px) {
  .aca-about__photo { grid-column: 1 / 6; grid-row: 1 / 3; min-height: 640px; }
  .aca-about__text { grid-column: 6 / 13; grid-row: 1; padding: 8px 0 12px 28px; }
  .aca-about__stats { grid-column: 6 / 10; grid-row: 2; padding: 28px 30px; }
  .aca-teach { grid-column: 10 / 13; grid-row: 2; }
  .aca-teach img { flex: 1; min-height: 0; aspect-ratio: auto; height: 100%; object-position: 46% 30%; }
}

.aca-shots__lead { margin: 56px 0 16px; font-size: var(--t-h4); font-weight: 700; letter-spacing: -0.01em; }
.aca-shots { display: grid; gap: var(--gap); }
.aca-shot { margin: 0; padding: 12px; display: flex; flex-direction: column; gap: 12px; }
.aca-shot a { position: relative; display: block; border: 2px solid var(--ink); border-radius: 12px; overflow: hidden; background: #fff; }
.aca-shot img { width: 100%; }
.aca-shot__zoom {
  position: absolute; right: 10px; bottom: 10px; display: grid; place-items: center; width: 40px; height: 40px;
  border-radius: 50%; background: #fff; border: 2px solid var(--ink); transition: transform 160ms var(--ease-out);
}
.aca-shot__zoom .i { width: 18px; height: 18px; }
.aca-shot figcaption { padding: 0 4px 2px; font-size: 14px; font-weight: 600; line-height: 1.45; color: var(--n700); font-variant-numeric: tabular-nums; }
@media (hover: hover) and (pointer: fine) { .aca-shot a:hover .aca-shot__zoom { transform: scale(1.08); } }
@media (min-width: 768px) { .aca-shots { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* phones: the account screenshots swipe sideways; the instructor photo steps aside (the face is in the hero) */
@media (max-width: 767px) {
  .aca-shots {
    margin: 0 calc(-1 * var(--gutter)); padding: 4px var(--gutter) 10px;
    display: flex; gap: 12px; overflow-x: auto; overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory; scroll-padding-inline: var(--gutter); scrollbar-width: thin;
  }
  .aca-shots > .aca-shot { flex: 0 0 86%; scroll-snap-align: start; }
  .js .aca-shots > .reveal { opacity: 1; transform: none; transition: none; }
  .aca-about__photo { display: none; }
}


.aca-logos__ph { margin-top: 20px; }

/* ---------- 10. Student reviews ---------- */
.aca-reviews { background: var(--n100); }
.aca-reviews .tile--paper { background: #fff; }
.aca-reviews__src { margin-top: 14px; font-size: 15px; font-weight: 600; color: var(--n600); max-width: 62ch; }
.aca-reviews__grid { margin-top: 36px; display: grid; gap: var(--gap); }
.aca-rv--1 blockquote p { font-size: clamp(18px, 0.4vw + 15.5px, 21px); font-weight: 600; line-height: 1.45; letter-spacing: -0.01em; }
.aca-rv--ph { justify-content: center; gap: 14px; padding: 22px 18px; }
.aca-ph__thumbs { list-style: none; padding: 0; margin: 0; flex-wrap: wrap; justify-content: center; }
/* phones: the lead review stays full width; the rest become one swipe row (the homepage testimonial pattern) */
@media (max-width: 767px) {
  .aca-reviews__rest {
    margin: 0 calc(-1 * var(--gutter)); padding: 4px var(--gutter) 14px;
    display: flex; gap: 12px; overflow-x: auto; overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory; scroll-padding-inline: var(--gutter); scrollbar-width: thin;
  }
  .aca-reviews__rest > * { flex: 0 0 84%; scroll-snap-align: start; }
  .aca-reviews__rest .rv { padding: 22px 20px; }
  /* cards outside the row count as off-screen, so the row never waits on a scroll reveal */
  .js .aca-reviews__rest .reveal { opacity: 1; transform: none; transition: none; }
}
@media (min-width: 768px) {
  .aca-reviews__rest { display: contents; }
  .aca-reviews__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .aca-rv--1 { grid-column: 1 / -1; }
}
@media (min-width: 1024px) {
  .aca-reviews__grid { grid-template-columns: repeat(12, minmax(0, 1fr)); }
  .aca-rv--1 { grid-column: 1 / 6; grid-row: 1 / 3; padding: 34px 32px; }
  .aca-rv--2 { grid-column: 6 / 10; grid-row: 1; }
  .aca-rv--3 { grid-column: 10 / 13; grid-row: 1; }
  .aca-rv--4 { grid-column: 6 / 9; grid-row: 2; }
  .aca-rv--5 { grid-column: 9 / 13; grid-row: 2; }
  .aca-rv--6 { grid-column: 1 / 6; grid-row: 3; }
  .aca-rv--ph { grid-column: 6 / 13; grid-row: 3; }
}
.aca-reviews__more { margin-top: 28px; display: grid; gap: 16px; justify-items: start; }
.aca-more { width: 100%; }
.aca-more summary {
  position: relative; isolation: isolate; display: inline-flex; margin: 0 4px 4px 0; border-radius: var(--r-btn);
  list-style: none; cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.aca-more summary::-webkit-details-marker { display: none; }
.aca-more summary::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; background: var(--ink); transform: translate(4px, 4px); }
.aca-more__face {
  display: inline-flex; align-items: center; gap: 10px; min-height: 48px; padding: 0 20px;
  border: 2px solid var(--ink); border-radius: inherit; background: #fff; font-weight: 600;
  transition: transform 160ms var(--ease-out);
}
.aca-more__i { transition: transform 200ms var(--ease-out); }
.aca-more[open] .aca-more__i { transform: rotate(45deg); }
.aca-more summary:active .aca-more__face { transform: translate(3px, 3px) scale(0.97); transition-duration: 100ms; }
@media (hover: hover) and (pointer: fine) { .aca-more summary:hover .aca-more__face { transform: translate(-2px, -2px); } }
.aca-wall { list-style: none; padding: 0; margin: 20px 0 0; columns: 2; column-gap: 12px; }
.aca-wall li { break-inside: avoid; margin-bottom: 12px; }
.aca-wall a { display: block; border: 2px solid var(--ink); border-radius: 12px; overflow: hidden; background: #fff; }
.aca-wall img { width: 100%; }
@media (min-width: 768px) { .aca-wall { columns: 3; column-gap: 16px; } .aca-wall li { margin-bottom: 16px; } }
@media (min-width: 1024px) { .aca-wall { columns: 4; } }
.aca-reviews__next { margin-top: 32px; }

/* ---------- 11. Guarantee seal ---------- */
.aca-guarantee { padding-bottom: 0; }
.aca-seal-card {
  display: grid; gap: 24px; align-items: center; justify-items: start; padding: 28px 22px; margin-right: 8px;
  background: #fff; border: 2px solid var(--ink); border-radius: var(--r-tile); box-shadow: 8px 8px 0 var(--ink);
}
.aca-seal { position: relative; width: 156px; height: 156px; transform: rotate(var(--rot, 0deg)); }
.aca-seal svg { width: 100%; height: 100%; overflow: visible; }
.aca-seal__disc { fill: var(--ink); }
.aca-seal__line { fill: none; stroke: #fff; stroke-width: 1.5; stroke-dasharray: 2 5; stroke-linecap: round; }
.aca-seal__text { fill: #fff; font-family: var(--font); font-size: 10.5px; font-weight: 800; letter-spacing: 0.08em; }
.aca-seal__num { position: absolute; inset: 0; display: grid; place-content: center; text-align: center; line-height: 1; color: var(--y); }
.aca-seal__num b { font-size: 50px; letter-spacing: -0.05em; }
.aca-seal__num small { margin-top: 2px; font-size: 12px; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; color: #fff; }
.aca-seal-card__body { margin-top: 16px; font-size: var(--t-lead); line-height: 1.5; color: var(--ink-3); max-width: 54ch; }
.aca-seal-card__body a { font-weight: 700; text-decoration-thickness: 2px; text-underline-offset: 4px; }
.aca-seal-card__ph { margin-top: 12px; max-width: 70ch; }
.aca-seal-card .btn { margin-top: 24px; }
@media (min-width: 768px) {
  .aca-seal-card { grid-template-columns: auto minmax(0, 1fr); gap: 40px; padding: 40px; }
}
@media (min-width: 1024px) {
  .aca-seal { width: 208px; height: 208px; }
  .aca-seal__num b { font-size: 66px; }
  .aca-seal-card { padding: 48px 56px; gap: 56px; }
}

/* ---------- 12. Media dialog ---------- */
.aca-dlg {
  width: min(960px, 100vw - 32px); max-width: none; max-height: calc(100dvh - 32px); margin: auto; padding: 0;
  border: 2px solid var(--ink); border-radius: var(--r-tile); background: var(--ink); color: #fff; overflow: visible;
  --focus: var(--y); --halo: transparent;
  opacity: 0; transform: translateY(10px) scale(0.98);
  transition: opacity 200ms var(--ease-out), transform 200ms var(--ease-out);
}
.aca-dlg.is-open { opacity: 1; transform: none; }
.aca-dlg::backdrop { background: rgba(10, 10, 10, 0.72); }
.aca-dlg[data-kind="image"] { width: fit-content; max-width: min(900px, 100vw - 32px); background: #fff; color: var(--ink); --focus: var(--ink); --halo: var(--y); }
.aca-dlg__box { position: relative; display: grid; gap: 10px; padding: 12px; }
.aca-dlg__stage iframe { display: block; width: 100%; aspect-ratio: 16 / 9; border: 0; border-radius: 12px; background: #000; }
.aca-dlg__stage img { display: block; width: auto; max-width: 100%; max-height: calc(100dvh - 150px); margin: 0 auto; border-radius: 10px; }
.aca-dlg__cap { padding: 0 6px 2px; font-size: 14px; font-weight: 600; line-height: 1.4; color: var(--n300); max-width: 70ch; }
.aca-dlg[data-kind="image"] .aca-dlg__cap { color: var(--n600); }
.aca-dlg__x { position: absolute; top: -18px; right: -10px; }
.aca-dlg__close2 { justify-self: end; min-height: 44px; padding: 0 10px; font-size: 15px; font-weight: 700; color: #fff; }
.aca-dlg[data-kind="image"] .aca-dlg__close2 { color: var(--ink); }
@media (max-width: 559px) { .aca-dlg__x { top: -22px; right: -4px; } }

/* =====================================================================
   13. checkout.html
   ===================================================================== */
.aca-checkout .step__h1 { max-width: 14ch; }
.aca-sum .sum__title { font-size: clamp(24px, 1vw + 18px, 30px); }
.aca-sum__lines { display: grid; gap: 10px; padding: 14px; border-radius: 14px; background: var(--ink-2); }
.aca-sum__row { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; font-size: 15px; font-weight: 600; line-height: 1.35; }
.aca-sum__row > span:last-child { flex: none; text-align: right; font-variant-numeric: tabular-nums; }
.aca-sum__row s { margin-right: 6px; font-size: 13px; color: var(--n400); text-decoration-thickness: 1.5px; }
.aca-sum__row b { font-weight: 800; }
.aca-sum__row--sops { color: var(--y); }
.aca-sum .sum__due { display: grid; gap: 4px; }
.aca-sum .sum__due p:first-child { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.aca-sum .sum__due .num { white-space: nowrap; font-size: clamp(30px, 1.2vw + 24px, 38px); }
.aca-sum .sum__due-n { font-size: 13px; font-weight: 600; color: var(--n300); }
.aca-sum__trust a { color: #fff; text-decoration-color: var(--y); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.aca-sum .rv__stars { color: var(--y); }
.sum__bar-t [data-total] { font-weight: 800; }

/* order bump: a pressable checkbox card, directly above Continue */
.aca-bump-field { margin-top: 30px; }
.aca-bump { position: relative; isolation: isolate; display: flex; margin: 0 4px 4px 0; border-radius: var(--r-in); cursor: pointer; -webkit-tap-highlight-color: transparent; }
.aca-bump::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; background: var(--ink); transform: translate(4px, 4px); }
.aca-bump__face {
  position: relative; display: flex; align-items: flex-start; gap: 14px; width: 100%; padding: 20px 16px 16px;
  border: 2px dashed var(--ink); border-radius: inherit; background: var(--y-100);
  transition: transform 160ms var(--ease-out), background-color 120ms ease;
}
.aca-bump__face .check__box { margin-top: 2px; }
.aca-bump__body { display: flex; flex-direction: column; gap: 4px; font-size: 15px; line-height: 1.45; }
.aca-bump__body b { font-size: 16px; font-weight: 800; line-height: 1.3; }
.aca-bump__tag { position: absolute; top: -17px; right: 14px; --rot: 3deg; }
.aca-bump input:checked + .aca-bump__face { background: var(--y); border-style: solid; }
.aca-bump input:checked + .aca-bump__face .check__box { background: #fff; }
.aca-bump input:checked + .aca-bump__face .check__box .i { opacity: 1; }
.aca-bump input:focus-visible + .aca-bump__face { outline: 3px solid var(--ink); outline-offset: 3px; box-shadow: 0 0 0 3px var(--y); }
.aca-bump:active .aca-bump__face { transform: translate(3px, 3px) scale(0.985); transition-duration: 100ms; }
@media (hover: hover) and (pointer: fine) { .aca-bump:hover .aca-bump__face { transform: translate(-2px, -2px); } }
.aca-go { margin-top: 26px; }
/* "Continue to payment: PKR 6,000" stays on one line on phones: the arrow goes, the label keeps every word */
@media (max-width: 479px) {
  .aca-go .btn__arrow { display: none; }
  .aca-go .btn--lg .btn__face { padding-inline: 12px; font-size: 15.5px; letter-spacing: -0.01em; white-space: nowrap; }
}
@media (max-width: 359px) { .aca-go .btn--lg .btn__face { white-space: normal; } }
/* header: "Back to AM Digital Academy" reads "Back to Academy" on small phones; screen readers still get it all */
@media (max-width: 479px) {
}
.opt.is-disabled { cursor: not-allowed; }
.opt.is-disabled .opt__face { transform: none !important; }
.aca-sum .rv__cap b { color: #fff; }
.aca-sum .rv__meta { color: var(--n300); }

/* step 2: amount, bump toggle, reference */
.aca-backlink { margin: -8px 0 16px; }
.aca-backlink .i { width: 18px; height: 18px; }
.aca-due {
  display: grid; gap: 14px; padding: 18px; margin-bottom: 22px;
  background: var(--ink); color: #fff; border-radius: var(--r-in); --focus: var(--y); --halo: transparent;
}
.aca-due__top { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px 16px; }
.aca-due__k { font-size: 13px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--n300); }
.aca-due__v { margin-top: 4px; font-size: clamp(38px, 2vw + 28px, 52px); letter-spacing: -0.04em; color: var(--y); }
.aca-due__acts { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; }
.aca-due .copy { border-color: #fff; }
.aca-due .copy.is-copied { border-color: var(--y); }
.aca-bumptoggle {
  display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0; border: 0; background: none; color: #fff;
  font-size: 14px; font-weight: 700; text-align: left;
}
.aca-bumptoggle > span { display: inline-flex; align-items: center; gap: 6px; }
.aca-bumptoggle .i { width: 16px; height: 16px; stroke-width: 3; color: var(--y); }
.aca-bumptoggle u { text-decoration-color: var(--y); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.aca-bumptoggle__add { text-decoration: underline; text-decoration-color: var(--y); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.aca-due__ref { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; padding-top: 14px; border-top: 1px solid var(--n800); font-size: 14px; font-weight: 600; color: var(--n300); }
.aca-due__ref b { color: #fff; font-size: 16px; font-weight: 800; font-variant-numeric: tabular-nums; letter-spacing: 0.01em; }
.aca-due__help { margin-top: -6px; font-size: 13px; font-weight: 600; color: var(--n400); }
.aca-due__help b { color: #fff; }

.aca-paybox { margin-bottom: 24px; }
.aca-paybox .fx-field { margin-bottom: 4px; }
.aca-methods { gap: 12px 14px; }
.aca-methods .opt__face { min-height: 64px; }
.aca-methods .opt__sub { font-size: 13px; }
.aca-paybox .paybox__acct { display: grid; gap: 6px; }
.aca-paybox .paybox__rows > div { grid-template-columns: 96px minmax(0, 1fr); }
.aca-paybox .fx-note { margin-top: 0; }
.aca-paybox .fx-note .btn { justify-self: start; margin: 4px 4px 4px 0; }
.aca-proof-field .field__label { display: block; margin-bottom: 8px; }
.aca-proof-field > .field__hint { margin-top: 8px; }
.aca-paybox .paybox__rows dt { line-height: 1.3; }
@media (max-width: 479px) {
  .fx-submit .btn--lg { --bp: 14px; --bf: 16px; }
  .aca-paybox .paybox__rows > div { grid-template-columns: 84px minmax(0, 1fr); }
}
.aca-when-file { display: none; }
.has-file .aca-when-file { display: inline; }
.has-file .aca-when-empty { display: none; }
/* the amount to send, restated beside the submit button (the summary bar has scrolled away on phones) */
.aca-submit-total { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 0 2px; font-size: 15px; font-weight: 700; }
.aca-submit-total .num { font-size: 24px; letter-spacing: -0.03em; }
.aca-pending { margin-top: -4px; }
.aca-pending .link { min-height: 44px; font-size: 15px; }
.aca-pending .link .i { width: 16px; height: 16px; }

/* =====================================================================
   14. thank-you.html
   ===================================================================== */
.aca-ty { padding-bottom: 72px; }

.aca-ty__ref { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-top: 18px; }
.aca-ty__ref .chip { margin: 0; font-size: 14px; font-weight: 700; }
.aca-ty__ref .chip b { margin-left: 4px; font-variant-numeric: tabular-nums; }
.aca-act { margin-top: 26px; display: grid; gap: 12px; justify-items: start; max-width: 50ch; }
.aca-act__h { font-size: var(--t-h3); font-weight: 800; letter-spacing: -0.02em; line-height: 1.15; }
.aca-act__h .i { width: 26px; height: 26px; margin-right: 4px; vertical-align: -4px; stroke-width: 3; }
.aca-act p { font-size: var(--t-lead); line-height: 1.5; color: var(--ink-3); }
.aca-act .btn { margin-top: 6px; }
.aca-act .ty2__cta { justify-self: stretch; margin-top: 0; }
.aca-act p.ty2__under { margin-top: -2px; font-size: 13px; font-weight: 600; line-height: 1.4; }
.aca-act .link { padding-block: 8px; }

.aca-track {
  align-self: center; display: grid; gap: 14px; padding: 22px 20px; margin: 8px 8px 0 0;
  background: #fff; border: 2px solid var(--ink); border-radius: var(--r-tile); box-shadow: 8px 8px 0 var(--ink);
}
.aca-track__h { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 12px; font-size: 13px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--n600); }
.aca-track__h span { font-size: 15px; letter-spacing: 0; text-transform: none; color: var(--ink); font-variant-numeric: tabular-nums; }
.aca-track__list { position: relative; list-style: none; padding: 0; margin: 0; display: grid; gap: 18px; }
.aca-track__list::before { content: ""; position: absolute; left: 15px; top: 16px; bottom: 16px; border-left: 2px dashed var(--ink); }
.aca-track__list li { position: relative; display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 14px; align-items: start; }
.aca-track__dot {
  position: relative; z-index: 1; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%;
  border: 2px solid var(--ink); background: #fff;
}
.aca-track__dot .i { width: 16px; height: 16px; stroke-width: 3.5; }
.aca-track__list .is-done .aca-track__dot { background: var(--ink); color: var(--y); }
.aca-track__list .is-now .aca-track__dot { background: var(--y); }
.aca-track__list .is-now .aca-track__dot::after { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--ink); }
.aca-track__list b { display: block; font-size: 17px; font-weight: 800; line-height: 1.25; }
.aca-track__list li > div > span { display: block; margin-top: 2px; font-size: 14px; font-weight: 600; line-height: 1.4; color: var(--n600); }
@media (min-width: 768px) {
  .aca-ty .ty-hero__copy { padding-bottom: 0; }
  .aca-ty .ty-hero__grid { align-items: center; }
  .aca-track { padding: 26px 26px; }
}
@media (min-width: 1024px) { .aca-ty { padding-bottom: 96px; } }

.aca-ty-side { display: grid; gap: 16px; }
.aca-ty-video { min-height: 220px; }
.aca-ty-video .aca-vid { min-height: 220px; }
.aca-goal { display: grid; gap: 12px; padding: 22px; }
.aca-goal > p { color: var(--ink-3); font-size: 15px; }
.aca-goal__opts { display: flex; flex-wrap: wrap; gap: 10px; }
.aca-goal__opts button {
  display: inline-flex; align-items: center; min-height: 44px; padding: 8px 16px; border: 2px solid var(--ink); border-radius: 999px; background: #fff;
  font-size: 15px; font-weight: 600; line-height: 1.25; text-align: left;
  transition: background-color 120ms ease, transform 160ms var(--ease-out);
}
.aca-goal__opts button[aria-pressed="true"] { background: var(--y); box-shadow: 3px 3px 0 var(--ink); transform: translate(-1px, -1px); }
.aca-goal__opts button:active { transform: scale(0.97); transition-duration: 100ms; }
@media (hover: hover) and (pointer: fine) { .aca-goal__opts button:hover:not([aria-pressed="true"]) { background: var(--y-100); } }
.aca-goal__ok { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; }
.aca-goal__ok .i { width: 18px; height: 18px; stroke-width: 3; }

.aca-check-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 6px 14px; flex-wrap: wrap; }
.aca-check-row .check { flex: 1 1 220px; }
/* the row's action sits on the label's first line (24px+ target, as a standalone link needs) */
.aca-check-row .link { display: inline-flex; align-items: center; min-height: 44px; padding: 0 8px; line-height: 1.5; color: #fff; font-size: 15px; text-underline-offset: 5px; }
.aca-check-row .link .i--fill { width: 14px; height: 14px; margin: 0 6px 0 0; }
.aca-next { display: grid; gap: 10px; }
@media (min-width: 768px) {
  .aca-next { grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "tag title cta" "tag text cta"; align-items: center; gap: 4px 28px; }
  .aca-next > .sticker { grid-area: tag; }
  .aca-next > .h3 { grid-area: title; align-self: end; }
  .aca-next > p:not(.sticker) { grid-area: text; align-self: start; }
  .aca-next > .link { grid-area: cta; }
}
.aca-paynow { margin-top: 4px; }
/* the next offer's framing line: plain text (a two-line rotated sticker read as clutter) */
.aca-offer__k { font-size: 14px; font-weight: 700; line-height: 1.4; color: var(--ink-3); max-width: 40ch; }
.ty2-more .next-offer > .link { margin-top: auto; }
/* ---------- 15. Motion ---------- */
@media (prefers-reduced-motion: no-preference) {
  /* the price card's one authored moment: once the card is in, a pen line strikes the old price */
  .js .aca-card .aca-strike::after { transform: rotate(-7deg) scaleX(0); transition: transform 460ms var(--ease-out) 380ms; }
  .js .aca-card.is-in .aca-strike::after { transform: rotate(-7deg) scaleX(1); }
  /* "Where should you start?": the answer stamps a Start here sticker on its stage */
  .aca-here.is-stamp { animation: pop 300ms var(--spring-pop) both; }
  /* the bump's price sticker stamps on when the box is ticked */
  .aca-bump input:checked + .aca-bump__face .aca-bump__tag { animation: pop 300ms var(--spring-pop) both; }
  /* thank-you: the first tracker dot enters like a tile (the spring overshoot is for stickers only) */
  .js .aca-track__list .is-done .aca-track__dot { animation: tileIn 240ms var(--ease-out) 200ms both; }
  .js .aca-guarantee [data-pops] .aca-seal.pop { opacity: 0; }
  .js .aca-guarantee [data-pops].is-in .aca-seal.pop { animation: pop 340ms var(--spring-pop) 160ms both; }
}
@media (prefers-reduced-motion: reduce) {
  .aca-dlg { transform: none; transition: opacity 150ms ease; }
  .aca-clip:active, .aca-bump:active .aca-bump__face, .aca-more summary:active .aca-more__face { transform: none; }
  .aca-goal__opts button[aria-pressed="true"] { transform: none; }
}
@media (forced-colors: active) {
  .aca-bump input:checked + .aca-bump__face { outline: 3px solid Highlight; }
  .aca-goal__opts button[aria-pressed="true"] { outline: 3px solid Highlight; }
  .aca-strike { text-decoration: line-through; }
}

/* Round 7: the student-video tile is a link to the homepage's video testimonials */
.aca-rv--videos { color: #fff; text-decoration: none; transition: transform 160ms var(--ease-out); }
.aca-rv--videos .ph__thumbs img { filter: grayscale(1); opacity: 0.9; }
.aca-rv__videos { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px 8px; font-size: 16px; font-weight: 600; text-align: center; color: var(--n300); }
.aca-rv__videos b { color: var(--y); }
.aca-rv__videos .i { width: 18px; height: 18px; color: var(--y); transition: transform 160ms var(--ease-out); }
.aca-rv--videos:active { transform: scale(0.98); }
@media (hover: hover) and (pointer: fine) { .aca-rv--videos:hover .aca-rv__videos .i { transform: translateX(3px); } }