/* College & Training v2 (2026-10-25, audit/college_v2_plan.md). Nate's
   approved mockup v3. Loaded after static/css/dashboard.css, whose base
   layout classes (.hm, .hm-head, .card, .sec-h, .btn, .hero-r, .tag, .goal,
   .ag ...) it reuses; this file sets the College colour (pink #be185d) and
   adds the College-only pieces. Phone: one step at a time (college.js). */


:root{
  --hm:#be185d; --hm-ink:#9d174d; --hm-soft:#fdf2f8; --hm-line:#fbcfe8;
  --hm-grad:linear-gradient(90deg,#be185d,#db2777); --hm-ring-in:#a3134f;
}
.app-content{background:linear-gradient(180deg,#fdecf5 0,#f8f6f9 320px)}
.hm .route-chip{display:inline-block;line-height:1.4;padding:6px 12px;border-radius:999px;background:#f0eeff;color:#4f3fd9;font-size:13px;font-weight:700;text-decoration:none;border:1px solid #ddd6fe}
.hm .route-chip b{color:#312e81}
.hm .route-chip svg{width:15px;height:15px;vertical-align:-3px;margin-right:6px}

/* hero: the verdict + education along the route */
.hm .cg-hero{border-radius:20px;overflow:hidden;background:var(--hm-grad);color:#fff;box-shadow:0 12px 28px rgba(190,24,93,.22);display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}
.hm .cg-hero .hero-l h2{font-size:23px}
.hm .verdict{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;background:rgba(255,255,255,.18);border-radius:999px;padding:4px 12px;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.hm .cg-hero .hero-l p.big{font-size:15px;opacity:.95;line-height:1.5;margin:0}
.hm .tl{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:0}
.hm .tl li{display:grid;grid-template-columns:22px minmax(0,1fr) auto;gap:12px;align-items:start;padding:10px 0;position:relative}
.hm .tl li:not(:last-child):before{content:"";position:absolute;left:10px;top:28px;bottom:-6px;width:2px;background:#e9d5e3}
.hm .tl .n{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:800;background:#fff;border:2px solid #f9a8d4;color:var(--hm-ink);position:relative;z-index:1}
.hm .tl li.now .n{background:var(--hm);border-color:var(--hm);color:#fff}
.hm .tl .r{font-size:14px;font-weight:800;color:var(--ink)} .hm .tl .w{font-size:12px;color:var(--faint)}
.hm .need{font-size:12px;font-weight:800;padding:4px 9px;border-radius:999px;white-space:nowrap;align-self:center}
.hm .need.none{background:#ecfdf3;color:#15803d}
.hm .need.cert{background:#eff6ff;color:#1d4ed8}
.hm .need.deg{background:#fdf2f8;color:#9d174d}
.hm .src{font-size:11.5px;color:var(--faint);margin-top:6px}

/* options */
.hm .opts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.hm .opt{position:relative;display:flex;flex-direction:column;gap:9px;padding:16px;border-radius:16px;background:#fff;border:1px solid var(--line);min-width:0}
.hm .opt.pick{border:2px solid var(--hm);box-shadow:0 10px 24px rgba(190,24,93,.12)}
.hm .opt .badge{align-self:flex-start;font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;padding:3px 9px;border-radius:999px;background:var(--hm-soft);color:var(--hm-ink)}
.hm .opt .badge.best{background:var(--hm);color:#fff}
.hm .opt h3{margin:0;font-size:16.5px;font-weight:800;letter-spacing:-.01em}
.hm .opt .facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:10px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.hm .opt .facts div{font-size:11.5px;color:var(--faint);font-weight:700}
.hm .opt .facts b{display:block;font-size:14px;color:var(--ink);font-weight:800}
.hm .opt p{margin:0;font-size:13px;color:var(--muted);line-height:1.5}
.hm .opt .fstep{font-size:13px;color:var(--ink)} .hm .opt .fstep b{color:var(--hm-ink)}
.hm .opt .btn{margin-top:auto}

/* compare */
.hm .cmp{width:100%;border-collapse:collapse;font-size:13.5px}
.hm .cmp th,.hm .cmp td{padding:10px 8px;border-top:1px solid var(--line);text-align:left;vertical-align:top}
.hm .cmp thead th{border-top:0;font-size:12px;color:var(--faint);font-weight:800;text-transform:uppercase;letter-spacing:.05em}
.hm .cmp tbody th{font-weight:700;color:var(--muted);width:24%}
.hm .cmp .good{color:#15803d;font-weight:800}
.hm .cmp .mid{color:#a16207;font-weight:800}
.hm .cmp .bad{color:#b91c1c;font-weight:800}
.hm .cmp-wrap{overflow-x:auto}

/* schools */
.hm .sch{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,.7fr)) auto;gap:12px;align-items:center;padding:12px 0;border-top:1px solid var(--line)}
.hm .sch:first-of-type{border-top:0}
.hm .sch .nm{font-size:14px;font-weight:800} .hm .sch .loc{font-size:12px;color:var(--faint)}
.hm .sch .k{font-size:11px;color:var(--faint);font-weight:700} .hm .sch .v{font-size:14px;font-weight:800}
.hm .chipset{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.hm .chipset span{font-size:12px;font-weight:700;padding:5px 10px;border-radius:999px;background:#f1f5f9;color:#334155}
.hm .chipset span.on{background:var(--hm);color:#fff}
.hm .official{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;color:#15803d;background:#ecfdf3;padding:3px 9px;border-radius:999px}

/* paying */
.hm .pay{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.hm .payc{padding:14px;border-radius:14px;border:1px solid var(--line);background:#fff;display:flex;flex-direction:column;gap:6px}
.hm .payc h4{margin:0;font-size:14.5px;font-weight:800}
.hm .payc p{margin:0;font-size:13px;color:var(--muted);line-height:1.5}
.hm .payc .when{font-size:12px;font-weight:800;color:var(--hm-ink)}
.hm .sc{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;padding:11px 0;border-top:1px solid var(--line);font-size:13.5px}
.hm .sc:first-of-type{border-top:0}
.hm .sc b{font-weight:800} .hm .sc .amt{font-weight:800;color:#15803d;text-align:right}
.hm .sc .meta{grid-column:1/-1;font-size:12px;color:var(--faint)}
.hm .verify{font-size:11.5px;font-weight:700;color:#a16207;background:#fef3c7;padding:2px 8px;border-radius:999px}

/* states */
.hm .states{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.hm .state{padding:14px;border-radius:14px;border:1px dashed #e2c6d6;background:#fff}
.hm .state .lbl{font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--faint);margin-bottom:8px}
.hm .strip{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:12px;font-size:13px;line-height:1.45}
.hm .strip.amber{background:#fffbeb;border:1px solid #fcd34d;color:#92400e}
.hm .strip.green{background:#ecfdf3;border:1px solid #bbf7d0;color:#166534}
.hm .strip.gray{background:#f8fafc;border:1px solid #e2e8f0;color:#334155}
.hm .strip b{display:block;margin-bottom:2px}
.hm .strip .btn{margin-top:8px;min-height:34px;font-size:13px}

.hm .qlist{margin:0;padding-left:18px;display:grid;gap:6px;font-size:13.5px;color:var(--ink)}
@media (max-width:1180px){.hm .opts,.hm .pay,.hm .states{grid-template-columns:minmax(0,1fr)}}
@media (max-width:760px){
  .hm .cg-hero{grid-template-columns:minmax(0,1fr)}
  .hm .sch{grid-template-columns:repeat(3,minmax(0,1fr))}.hm .sch>div:first-child{grid-column:1/-1}.hm .sch .btn{grid-column:1/-1}
  .hm .route-chip{margin-top:6px}
}
.hm .cg-hero .goal b{white-space:normal}

.hm .cg-hero .goal b{white-space:normal}
.hm .route-chip{display:inline-block;line-height:1.4}
.hm .route-chip svg{vertical-align:-3px;margin-right:6px}

/* the guided steps */
.hm .stepper{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:10px}
.hm .stp{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:11px;text-decoration:none;color:var(--muted);font-size:13px;font-weight:700;min-width:0}
.hm .stp i{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:12px;font-weight:800;border:2px solid #e5c3d6;color:var(--hm-ink);flex:0 0 auto;background:#fff}
.hm .stp.done i{background:var(--hm);border-color:var(--hm);color:#fff}
.hm .stp.now{background:var(--hm-soft);color:var(--hm-ink)}
.hm .stp.now i{border-color:var(--hm)}
.hm .stp span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hm .stepno{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--hm);color:#fff;font-size:12px;font-weight:800;margin-right:8px;vertical-align:1px}

/* data labels: where every number comes from */
.hm .srcchip{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:800;padding:2px 8px;border-radius:999px;white-space:nowrap}
.hm .srcchip.off{background:#ecfdf3;color:#15803d}
.hm .srcchip.est{background:#fef3c7;color:#a16207}
.hm .srcchip.you{background:#eef2ff;color:#4338ca}
.hm .legend{display:flex;gap:8px;flex-wrap:wrap;align-items:center;font-size:12px;color:var(--faint)}

/* salary in the route timeline */
.hm .tl .pay{display:block;white-space:nowrap;font-size:12px;color:var(--muted);font-weight:700}

/* payback line inside options */
.hm .payback{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12.5px;padding:8px 10px;border-radius:10px;background:#f8fafc}
.hm .payback b{font-size:13.5px}

/* certificate fact box */
.hm .certbox{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;padding:12px;border-radius:12px;background:#eff6ff;border:1px solid #dbeafe;font-size:12px;color:#1e3a8a}
.hm .certbox b{display:block;font-size:14px;color:#0f172a}

/* shortlist tracker (like Jobs) */
.hm .sl{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,.8fr) minmax(0,.9fr) auto;gap:12px;align-items:center;padding:12px 0;border-top:1px solid var(--line)}
.hm .sl:first-of-type{border-top:0}
.hm .stage{font-size:12px;font-weight:800;padding:4px 10px;border-radius:999px;white-space:nowrap;justify-self:start}
.hm .stage.r{background:#f1f5f9;color:#334155} .hm .stage.a{background:#fff7ed;color:#c2410c} .hm .stage.d{background:#eff6ff;color:#1d4ed8} .hm .stage.k{background:#ecfdf3;color:#15803d}
.hm .dl{font-size:12.5px;color:var(--muted)} .hm .dl b{color:var(--ink)}
.hm .tabs{display:flex;gap:6px;margin:0 0 10px;flex-wrap:wrap}
.hm .tabs span{font-size:13px;font-weight:800;padding:7px 12px;border-radius:10px;color:var(--muted);background:#f1f5f9}
.hm .tabs span.on{background:var(--hm);color:#fff}
.hm .gl{border-bottom:1px dotted currentColor;cursor:help}

/* checklists */
.hm .chk2{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.hm .chk2 li{display:grid;grid-template-columns:22px minmax(0,1fr) auto;gap:10px;align-items:start;padding:9px 0;border-top:1px solid var(--line);font-size:13.5px}
.hm .chk2 li:first-child{border-top:0}
.hm .box{width:20px;height:20px;border-radius:6px;border:2px solid #d5dbe5;display:grid;place-items:center;color:#fff;margin-top:1px}
.hm .chk2 li.ok .box{background:var(--ok);border-color:var(--ok)}
.hm .chk2 li.ok .t{color:var(--faint);text-decoration:line-through}
.hm .chk2 .s{display:block;font-size:12px;color:var(--faint);margin-top:2px}
.hm .chk2 em{font-style:normal;font-size:12px;color:var(--hm-ink);font-weight:800;white-space:nowrap}
.hm .stat{display:flex;gap:12px;align-items:center;padding:12px 14px;border-radius:12px;background:var(--hm-soft);color:var(--hm-ink);font-size:13px;line-height:1.45}
.hm .stat b{font-size:22px;font-weight:800;white-space:nowrap}
.hm .two-eq{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px}
.hm .remind{display:flex;align-items:center;gap:10px;margin-top:10px;font-size:13px;font-weight:700}
.hm .remind .sw2{width:40px;height:22px;border-radius:999px;background:#16a34a;position:relative;flex:0 0 auto}
.hm .remind .sw2:after{content:"";position:absolute;top:3px;right:3px;width:16px;height:16px;border-radius:50%;background:#fff}
.hm .save{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.hm .save div{padding:12px;border-radius:12px;border:1px solid var(--line);background:#fff;font-size:12.5px;color:var(--muted)}
.hm .save b{display:block;font-size:13.5px;color:var(--ink);margin-bottom:3px}
@media (max-width:1180px){.hm .save{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){
  .hm .stepper{grid-template-columns:repeat(5,minmax(0,1fr));padding:8px;gap:4px}
  .hm .stp{flex-direction:column;gap:4px;padding:6px 2px;font-size:10.5px;text-align:center}
  .hm .stp span{white-space:normal}
  .hm .certbox{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hm .sl{grid-template-columns:minmax(0,1fr) auto}.hm .sl .dl{grid-column:1/-1}
  .hm .two-eq,.hm .save{grid-template-columns:minmax(0,1fr)}
}

/* ── phone: one step at a time (mockup v3) ── */
.hm .ph-only{display:none}
@media (max-width:760px){
  .hm .ph-hide{display:none !important}
  .hm .ph-only{display:block}
  .hm [data-step]:not(.act){display:none !important}
  .hm .stepper{position:sticky;top:0;z-index:30;box-shadow:0 6px 16px rgba(15,23,42,.08);border-radius:0 0 14px 14px;margin:-14px -14px 0;border-left:0;border-right:0;border-top:0}
  .hm .stp{cursor:pointer}
  .hm .route-chip{font-size:12px;padding:5px 10px;margin-top:4px}
  .hm .cg-hero .hero-l{padding:16px 16px 6px;gap:8px}
  .hm .cg-hero .hero-l h2{font-size:20px}
  .hm .tl li{padding:7px 0}
  .hm .opts{gap:10px}
  .hm .opt{padding:13px;gap:8px}
  .hm .opt h3{font-size:15.5px}
  .hm .opt .facts{padding:8px 0}
  .hm .certbox{padding:10px}
  .hm .stat b{font-size:19px}
  .hm .save{display:none}
  .hm details.more-ways[open] + .save{display:grid}
  .hm details.more-ways{margin-top:10px}
  .hm details.more-ways summary{cursor:pointer;font-size:13.5px;font-weight:800;color:var(--hm-ink);padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:#fff;list-style:none}
  .hm .nextstep{width:100%;margin-top:12px}
  .hm .sl .loc{display:none}
}

@media (max-width:760px){
  .hm [data-step="1"]{order:10}.hm [data-step="2"]{order:20}.hm [data-step="3"]{order:30}.hm [data-step="4"]{order:40}.hm [data-step="5"]{order:50}
  .hm .ph-extra[data-step="2"]{order:21}.hm .ph-extra[data-step="4"]{order:41}.hm .ph-extra[data-step="5"]{order:51}
  .hm .nextstep[data-step="1"]{order:12}.hm .nextstep[data-step="2"]{order:22}.hm .nextstep[data-step="3"]{order:32}.hm .nextstep[data-step="4"]{order:42}
  .hm .stepper{order:1}
}

/* ── added for the real page ── */
.hm .opt.pick .badge.best{background:var(--hm);color:#fff}
.hm .opt .btn[disabled]{opacity:.6;cursor:wait}
.hm .chk2 li{cursor:pointer}
.hm .chk2 li .box{transition:background .15s}
.hm .chk2 li:focus-visible{outline:3px solid var(--hm);outline-offset:2px;border-radius:8px}
.hm .chk2 a{color:var(--hm-ink);font-weight:700}
.hm .lk{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;align-items:center;padding:12px 0;border-top:1px solid var(--line)}
.hm .lk:first-of-type{border-top:0}
.hm .lk .nm{font-weight:800;font-size:14px} .hm .lk .mt{font-size:12.5px;color:var(--muted);line-height:1.45}
.hm .msg{font-size:13px;margin:8px 0 0;min-height:1em;color:var(--muted)}
.hm .msg.err{color:#b91c1c}
.hm .center-card{padding:22px;text-align:left}
.hm .center-card h2{margin:0 0 6px;font-size:20px;font-weight:800}
.hm .center-card p{margin:0 0 14px;color:var(--muted);font-size:14px;line-height:1.55}
.hm .spinner{width:22px;height:22px;border-radius:50%;border:3px solid rgba(255,255,255,.35);border-top-color:#fff;animation:hm-spin .9s linear infinite;display:inline-block;vertical-align:-5px;margin-right:10px}
.hm .edu-steps{list-style:none;margin:0;padding:0}
.hm .edu-steps li{display:grid;grid-template-columns:20px minmax(0,1fr);gap:10px;padding:8px 0;font-size:13.5px;align-items:start}
.hm .edu-steps .dot{margin-top:2px}
.hm .edu-steps li.done .dot{background:var(--hm);border-color:var(--hm)} .hm .edu-steps li.done .st{color:var(--faint);text-decoration:line-through}
.hm .edu-steps li.now .dot{border-color:var(--hm);box-shadow:0 0 0 4px var(--hm-soft)} .hm .edu-steps li.now .st{font-weight:800}
.hm .edu-steps .sub{display:block;font-size:12px;color:var(--muted);font-weight:500;margin-top:2px}
.hm .need.school{background:#fff7ed;color:#c2410c}
.hm .tl .note{display:block;font-size:12px;color:var(--muted);margin-top:2px}
.hm .stepper{scroll-margin-top:0}
@media (max-width:760px){
  .hm .tl .note{display:none}
  .hm .stepper{top:0}
}

/* ── laptop widths (sidebar + right column leave ~600px): keep it roomy ── */
.hm .stp span{white-space:normal;line-height:1.2}
.hm .opts{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.hm .opt .facts{grid-template-columns:repeat(auto-fit,minmax(78px,1fr))}
.hm .opt .facts b{overflow-wrap:anywhere}
@media (max-width:1400px) and (min-width:761px){
  .hm .cg-hero{grid-template-columns:minmax(0,1fr)}
  .hm .cg-hero .hero-r{margin:0 10px 10px}
}

/* Schools near you (College Scorecard, 2026-10-25, audit/college_schools_plan.md) */
.hm .near-h{font-size:14px;font-weight:800;margin:4px 0 8px}
.hm .near-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px;font-weight:700;margin-bottom:8px}
.hm .near-form[hidden]{display:none}
.hm .near-form{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,.8fr) auto;gap:8px;margin-bottom:8px}
.hm .near-form input{min-width:0;padding:9px 11px;border:1px solid var(--line);border-radius:10px;font:inherit;font-size:14px}
.hm .otabs{display:flex;gap:6px;flex-wrap:wrap;margin:4px 0 6px}
.hm .otab{font:inherit;font-size:12.5px;font-weight:800;padding:7px 11px;border-radius:10px;border:0;cursor:pointer;color:var(--muted);background:#f1f5f9;max-width:100%;text-align:left}
.hm .otab[aria-selected="true"]{background:var(--hm);color:#fff}
.hm .nsch{padding:12px 0;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:6px;min-width:0}
.hm .nsch-top{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:start}
.hm .nsch .nm{font-size:14px;font-weight:800}
.hm .nsch .mt,.hm .nsch .prog{font-size:12.5px;color:var(--muted);line-height:1.45}
.hm .nsch .sv{padding:6px 12px;font-size:12.5px}
.hm .nsch .sv[aria-pressed="true"]{background:var(--hm-soft);color:var(--hm-ink);border-color:var(--hm-line)}
.hm .nsch .fp{align-self:flex-start;font-size:11.5px;font-weight:800;padding:3px 9px;border-radius:999px;background:#fff7ed;color:#c2410c}
.hm .nsch .nums{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.hm .nsch .nums div{font-size:11.5px;color:var(--faint);font-weight:700;display:flex;flex-direction:column;justify-content:space-between}
.hm .nsch .nums b{display:block;font-size:14px;color:var(--ink);font-weight:800}
.hm .nsch .lks{display:flex;gap:14px;font-size:12.5px}
.hm .nsl{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;align-items:center;padding:10px 0;border-top:1px solid var(--line)}
.hm .nsl:first-child{border-top:0}
.hm .nsl .nm{font-weight:800;font-size:14px} .hm .nsl .mt{font-size:12.5px;color:var(--muted)}
.hm #cgShort{padding:10px 12px;border-radius:12px;background:var(--hm-soft);border:1px solid var(--hm-line);margin-bottom:12px}
.hm .near-n{display:inline-block;font-size:12.5px;font-weight:800;color:var(--hm-ink);text-decoration:none}
.hm .near-n[hidden]{display:none}
.hm .near .src{font-size:11.5px;color:var(--faint);margin-top:8px;line-height:1.45}
@media (max-width:760px){.hm .near-form{grid-template-columns:minmax(0,1fr) minmax(0,.7fr)}.hm .near-form .btn{grid-column:1/-1}}

/* Fit the page to the person (2026-10-26, audit/college_fit_plan.md) */
.hm .nb-note{font-size:13px;color:var(--hm-ink);background:var(--hm-soft);border:1px solid var(--hm-line);border-radius:12px;padding:10px 12px;margin:0 0 12px}
.hm details.school-fold>summary{cursor:pointer;font-size:14px;font-weight:800;color:var(--hm-ink);list-style:none}
.hm details.school-fold>summary::-webkit-details-marker{display:none}
.hm details.school-fold>summary::after{content:" +";font-weight:800}
.hm details.school-fold[open]>summary::after{content:" −"}
.hm details.school-fold[open]>summary{margin-bottom:12px}
.hm .nsch-count{font-size:12.5px;color:var(--muted);font-weight:700;margin:2px 0 0}

/* Help you may qualify for (audit/aid_help_plan.md) */
.hm .aid{border:1px solid #bbf7d0;background:linear-gradient(180deg,#f0fdf4,#fff 60%)}
.hm .aid .sec-h h3{margin:0;font-size:16px;font-weight:900;letter-spacing:-.01em}
.hm .aid .aid-ask{margin:6px 0 4px;font-size:13.5px;color:var(--ink,#0f172a);line-height:1.5}
.hm .aid .aid-foot{margin:8px 0 0;color:var(--faint)}

/* ── Design pass B2 (2026-10-29, mockup round 5): header line, stepper,
   step 1 points, Cards/Compare, school sort and bars, help questions,
   the step-5 guide. ── */
.hm .hm-meta .route-lnk{color:var(--hm-ink);font-weight:650;text-decoration:none}
.hm .hm-meta .route-lnk:hover{text-decoration:underline}
.hm .stp-prog{grid-column:1/-1;display:flex;align-items:center;gap:10px;padding:2px 6px 0;font-size:12px;font-weight:750;color:var(--muted)}
.hm .stp-bar{flex:1;height:6px;border-radius:99px;background:#f1e3ea;overflow:hidden}
.hm .stp-bar i{display:block;height:100%;background:var(--hm-grad);border-radius:inherit;transition:width .3s}
.hm [data-step].flash{animation:cg-flash 1.2s ease-out}
@keyframes cg-flash{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--hm) 45%,transparent)}100%{box-shadow:0 0 0 14px transparent}}
.hm [data-step]{scroll-margin-top:16px}
/* step 1 */
.hm .pts{list-style:none;margin:2px 0 4px;padding:0;display:grid;gap:8px}
.hm .pts li{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;line-height:1.4}
.hm .pts b{display:block;font-size:11px;letter-spacing:.07em;text-transform:uppercase;opacity:.85}
.hm .pt-ic{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;flex:none;background:rgba(255,255,255,.18)}
.hm .pt-ic svg{width:16px;height:16px;color:#fff}
.hm .pt-ic svg .duo{fill:#fff;opacity:.3}
.hm .goal-btn{margin-left:auto;font:inherit;font-size:13px;font-weight:800;color:#fff;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.35);border-radius:10px;padding:7px 12px;cursor:pointer;white-space:nowrap}
.hm .goal-btn:hover{background:rgba(255,255,255,.28)}
/* step 2 */
.hm .seg{display:inline-flex;gap:2px;background:#f3eef1;border-radius:12px;padding:3px;margin:0 0 12px}
.hm .seg button{display:inline-flex;align-items:center;gap:6px;border:0;background:none;font:inherit;font-size:13px;font-weight:750;color:var(--muted);padding:7px 12px;border-radius:9px;cursor:pointer;min-height:36px}
.hm .seg button svg{width:15px;height:15px}
.hm .seg button[aria-pressed="true"]{background:#fff;color:var(--hm-ink);box-shadow:0 1px 3px rgba(15,23,42,.12)}
.hm .cmp-card[hidden],.hm #cgCards[hidden]{display:none}
.hm .cmp-card .cmp{min-width:520px}
/* step 3 */
.hm .near-top .btn-sm{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:0 10px;font-size:12.5px}
.hm .near-top .btn-sm svg{width:14px;height:14px}
.hm .sortl{margin-left:auto;font-size:12.5px;color:var(--muted);font-weight:700}
.hm #cgSort{font:inherit;font-size:13px;padding:6px 8px;border:1px solid var(--line);border-radius:9px;background:#fff}
.hm .nsch .lks{gap:8px;flex-wrap:wrap}
.hm .nsch .lks .btn-sm,.hm .sc .btn-sm{display:inline-flex;align-items:center;gap:5px;min-height:30px;padding:0 10px;font-size:12px;border-radius:9px;text-decoration:none}
.hm .gbar{display:block;height:5px;border-radius:99px;background:#eef2f6;overflow:hidden;margin-top:4px}
.hm .gbar i{display:block;height:100%;border-radius:inherit}
.hm .gbar.hi i{background:#16a34a}.hm .gbar.mid i{background:#d97706}.hm .gbar.lo i{background:#dc2626}
.hm .nsch-more{margin-top:10px}
/* step 4 */
.hm .aidq{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:10px;margin:10px 0}
.hm .aidq label{display:grid;gap:4px;font-size:12.5px;font-weight:750;color:var(--muted)}
.hm .aidq select{font:inherit;font-size:14px;color:var(--ink);padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:#fff;min-width:0}
.hm .aid-priv{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12.5px;color:var(--muted);background:#f8fafc;border-radius:10px;padding:8px 10px}
.hm .aid-priv svg{width:16px;height:16px;color:#15803d;flex:none}
.hm .aid-priv span{flex:1;min-width:180px}
.hm .fafsa-basics>summary{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:14px;font-weight:800;color:var(--hm-ink);list-style:none}
.hm .fafsa-basics>summary::-webkit-details-marker{display:none}
.hm .fafsa-basics>summary svg{width:18px;height:18px}
.hm .fafsa-basics>summary::after{content:"+";margin-left:auto;font-weight:800}
.hm .fafsa-basics[open]>summary::after{content:"−"}
/* step 5 */
.hm .gring{--p:0;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;position:relative;flex:none;background:conic-gradient(var(--hm) calc(var(--p)*1%),#f3e3ec 0)}
.hm .gring::before{content:"";position:absolute;inset:5px;border-radius:50%;background:#fff}
.hm .gring b{position:relative;font-size:12px;font-weight:850;color:var(--hm-ink)}
.hm .g-intro{margin:0 0 10px}
.hm .gsteps{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.hm .gstep{border:1px solid var(--line);border-radius:14px;background:#fff;overflow:hidden}
.hm .gstep.open{border-color:var(--hm-line);box-shadow:0 10px 24px -18px color-mix(in srgb,var(--hm) 70%,transparent)}
.hm .gstep.done{background:#f7fbf8}
.hm .gs-head{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:none;border:0;font:inherit;color:inherit;padding:12px 14px;cursor:pointer}
.hm .gs-n{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;flex:none;font-size:13px;font-weight:850;color:var(--hm-ink);background:var(--hm-soft);border:2px solid var(--hm-line)}
.hm .gstep.open .gs-n{background:var(--hm);border-color:var(--hm);color:#fff}
.hm .gstep.done .gs-n{background:#16a34a;border-color:#16a34a;color:#fff}
.hm .gs-t{flex:1;min-width:0;display:grid;gap:2px}
.hm .gs-t b{font-size:14.5px;line-height:1.3}
.hm .gstep.done .gs-t b{color:var(--muted)}
.hm .gs-t small{display:flex;align-items:center;gap:5px;font-size:12px;color:var(--faint);font-weight:650}
.hm .gs-t small svg{width:13px;height:13px}
.hm .gs-chev svg{width:18px;height:18px;color:var(--faint);transition:transform .2s}
.hm .gstep.open .gs-chev svg{transform:rotate(180deg)}
.hm .gs-body{padding:0 14px 14px 56px;display:grid;gap:10px;justify-items:start}
.hm .gs-subs{list-style:none;margin:0;padding:0;display:grid;gap:2px;width:100%}
.hm .gs-subs li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:10px;align-items:start;padding:7px 0;font-size:13.5px;cursor:pointer;border-top:1px solid var(--line)}
.hm .gs-subs li:first-child{border-top:0}
.hm .gs-subs li.ok .box{background:var(--ok);border-color:var(--ok)}
.hm .gs-subs li.ok>span:last-child{color:var(--faint);text-decoration:line-through}
.hm .gs-subs li:focus-visible{outline:3px solid var(--hm);outline-offset:2px;border-radius:8px}
.hm .gs-tip{display:flex;gap:8px;align-items:flex-start;margin:0;padding:9px 11px;border-radius:10px;background:#fffbeb;color:#92400e;font-size:13px;line-height:1.45;width:100%;box-sizing:border-box}
.hm .gs-tip svg{width:16px;height:16px;flex:none;margin-top:1px}
.hm .gs-set{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:12px;padding:14px;border-radius:14px;background:linear-gradient(135deg,#fdf2f8,#fff);border:1px solid var(--hm-line)}
.hm .gs-set[hidden]{display:none}
.hm .gs-set-ic{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;color:#fff;background:linear-gradient(155deg,#fde68a,#f59e0b 60%,#d97706);flex:none}
.hm .gs-set-ic svg{width:22px;height:22px}
.hm .gs-set>div{flex:1;min-width:180px}
.hm .gs-set b{display:block;font-size:16px}.hm .gs-set span{font-size:13px;color:var(--muted)}
/* change-route dialog */
.cg-dlg{border:0;border-radius:18px;padding:22px 20px;max-width:440px;width:calc(100% - 32px);box-shadow:0 24px 64px rgba(0,0,0,.25);font-family:Inter,system-ui,sans-serif;color:#0f172a}
.cg-dlg::backdrop{background:rgba(15,23,42,.55)}
.cg-dlg h3{margin:10px 0 6px;font-size:19px;font-weight:850}
.cg-dlg p{margin:0;font-size:14px;color:#475569;line-height:1.5}
.cg-dlg-ic{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;color:#fff;background:linear-gradient(155deg,#60a5fa,#2563eb 60%,#1d4ed8)}
.cg-dlg-ic svg{width:22px;height:22px}
.cg-dlg-ic svg .duo{fill:#fff;opacity:.3}
.cg-dlg-acts{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-top:16px}
.cg-dlg .btn{display:inline-flex;align-items:center;gap:6px;min-height:42px;padding:0 16px;border-radius:10px;font:inherit;font-size:14px;font-weight:750;cursor:pointer;text-decoration:none;border:1px solid transparent}
.cg-dlg .btn-pri{background:var(--hm,#be185d);color:#fff}.cg-dlg .btn-out{background:#fff;color:var(--hm-ink,#9d174d);border-color:#e2e8f0}
@media (max-width:760px){
  .hm .gs-body{padding:0 12px 12px}
  .hm .stepper{padding:8px 6px 6px}
  .hm .stp{padding:6px 1px;gap:5px}
  .hm .stp i{width:22px;height:22px;font-size:11px;border-width:2px}
  .hm .stp span{font-size:10px;line-height:1.15;hyphens:auto}
  .hm .stp-prog{padding:4px 4px 0}
  .hm .goal-btn{margin-left:0}
  .hm .cg-hero .goal{flex-wrap:wrap}
}
@media (prefers-reduced-motion:reduce){.hm [data-step].flash{animation:none}.hm .gs-chev svg{transition:none}}
.hm .gs-body[hidden]{display:none}
.hm .two-eq>.fafsa-basics{align-self:start}
.hm .stp-next{grid-column:1/-1;margin:0;padding:0 6px;font-size:12px;color:var(--muted);font-weight:600}

/* ── Design pass D (2026-10-29, audit/design_pass_d_plan.md): match the
   approved mockup (rounds 5–6). Full width with no right column, every step
   in a card, step 1 as two cards, path/school/help cards with icon tiles,
   tap answers. Colours come from --hm so school branding still wins. ── */
.hm-body.cg-one{grid-template-columns:minmax(0,1fr);max-width:1180px}
.hm .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.hm .cstep{padding:18px 20px;border-radius:18px;box-shadow:0 1px 2px rgba(15,23,42,.05),0 2px 8px -2px rgba(15,23,42,.06)}
.hm .cstep>.sec-h h2{display:flex;align-items:center;gap:10px;font-size:19px;font-weight:850}
.hm .cstep>.sec-h .stepno{width:28px;height:28px;margin:0;font-size:13px;flex:none;background:linear-gradient(160deg,color-mix(in srgb,var(--hm) 70%,#fff),var(--hm))}
.hm .cstep>.sec-h .srcchip svg{width:13px;height:13px}
.hm .sec-intro{margin:-4px 0 14px;font-size:13px;color:var(--muted);line-height:1.5}
.hm .sec-intro b{color:var(--ink)}
.hm .sec-intro .legend{display:inline-flex;gap:6px;align-items:center;margin-left:4px;color:var(--faint)}
.hm .cstep>.sec-h .seg{margin:0;background:#f1f5f9}

/* stepper */
.hm .stepper{border-radius:18px;padding:10px 12px 12px;box-shadow:0 2px 8px -2px rgba(15,23,42,.06)}
.hm .stp-prog #cgStepCount{order:2;color:var(--hm-ink);font-weight:800;white-space:nowrap}
.hm .stp.done i svg{width:14px;height:14px}
.hm .stp-next{display:flex;justify-content:space-between;gap:4px 12px;flex-wrap:wrap}
.hm .stp-next:empty{display:none}
.hm .stp-left{margin-left:auto;color:var(--faint);font-weight:600}
@media (min-width:761px){
  .hm .stp{flex-direction:column;justify-content:center;gap:7px;padding:10px 4px;border-radius:14px;text-align:center;font-size:13px;font-weight:650;color:var(--ink2,#334155)}
  .hm .stp i{width:30px;height:30px;font-size:13px;border:2px solid color-mix(in srgb,var(--hm) 35%,#fff)}
  .hm .stp.done i{border-color:var(--hm)}
  .hm .stp.now{background:color-mix(in srgb,var(--hm) 8%,#fff);color:var(--hm-ink)}
  .hm .stp.now i{border-color:var(--hm);box-shadow:0 0 0 4px color-mix(in srgb,var(--hm) 15%,transparent)}
  .hm .stp-prog{padding:4px 8px 0}
  .hm .stp-prog .stp-bar{height:7px}
}

/* step 1: two cards side by side */
.hm .cg-hero{background:none;box-shadow:none;border-radius:0;overflow:visible;gap:16px;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:stretch}
.hm .cg-hero .hero-l{border-radius:22px;padding:22px;gap:10px;color:#fff;position:relative;overflow:hidden;
  background:radial-gradient(110% 120% at 100% 0%,rgba(255,255,255,.2),transparent 60%),linear-gradient(140deg,color-mix(in srgb,var(--hm) 80%,#000),var(--hm) 55%,color-mix(in srgb,var(--hm) 82%,#fff));
  box-shadow:0 20px 40px -24px color-mix(in srgb,var(--hm) 95%,transparent)}
.hm .cg-hero .hero-r{margin:0;border:1px solid var(--line);border-radius:22px;padding:18px;box-shadow:0 1px 2px rgba(15,23,42,.05),0 2px 8px -2px rgba(15,23,42,.06);justify-content:flex-start;gap:6px}
.hm .verdict{background:none;padding:0;border-radius:0;font-size:11px;letter-spacing:.09em;opacity:.95}
.hm .cg-hero .hero-l h2{font-size:24px;font-weight:850;line-height:1.15;text-wrap:balance}
.hm .cg-hero .hero-l p.big{font-size:14px;line-height:1.5;color:color-mix(in srgb,#fff 88%,var(--hm));opacity:1}
.hm .pts{gap:8px;margin:2px 0 0}
.hm .pts li{gap:9px;font-size:13.5px;font-weight:600;color:#fff}
.hm .pt-ic{width:18px;height:18px;border-radius:50%;background:rgba(255,255,255,.22)}
.hm .pt-ic svg{width:11px;height:11px;stroke-width:3}
.hm .cg-hero .goal{margin-top:auto;flex-wrap:wrap;gap:10px 12px;border:1px solid rgba(255,255,255,.25);border-radius:14px;padding:10px 12px}
.hm .cg-hero .goal-ic{width:34px;height:34px;border-radius:10px;color:#fff}
.hm .cg-hero .goal-ic svg{width:18px;height:18px}
.hm .cg-hero .goal-ic svg .duo{fill:#fff;opacity:.3}
.hm .goal-btn{background:#fff;color:var(--hm-ink);border-color:#fff;font-size:12.5px;padding:7px 12px}
.hm .goal-btn:hover{background:#fff;box-shadow:0 6px 14px -8px rgba(0,0,0,.4)}
.hm .eyb{font-size:11px;letter-spacing:.09em;font-weight:800;text-transform:uppercase;color:var(--hm-ink)}
.hm .tl{gap:4px;margin-top:8px}
.hm .tl li{grid-template-columns:28px minmax(0,1fr) auto;padding:10px 0}
.hm .tl li:not(:last-child):before{left:13px;top:36px;background:color-mix(in srgb,var(--hm) 22%,#fff)}
.hm .tl .n{width:28px;height:28px;font-size:13px;border:2px solid color-mix(in srgb,var(--hm) 40%,#fff);color:var(--hm)}
.hm .tl li.now .n{background:var(--hm);border-color:var(--hm);color:#fff}
.hm .tl .r{font-size:14.5px}
.hm .tl .w{font-size:12px;color:var(--muted)}
.hm .tl .pay{display:block;font-size:13px;font-weight:800;color:var(--ink2,#334155);margin-top:2px}
.hm .tl .note{display:block;font-size:12.5px;color:var(--ink2,#334155);margin-top:3px}
.hm .need{font-size:12px;font-weight:700;padding:4px 10px;align-self:start}
.hm .need.cert,.hm .need.deg{background:color-mix(in srgb,var(--hm) 10%,#fff);color:var(--hm-ink)}
.hm .hero-r .src{margin-top:auto;padding-top:6px;font-size:12px;color:var(--muted)}
@container hm (max-width:880px){
  .hm .cg-hero{grid-template-columns:minmax(0,1fr)}
}

/* step 2: path cards */
.hm .opts{gap:12px;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr))}
.hm .opt{gap:10px;padding:16px;border-radius:18px;box-shadow:0 1px 2px rgba(15,23,42,.05),0 2px 8px -2px rgba(15,23,42,.06)}
.hm .opt.pick{border:2px solid var(--hm);box-shadow:0 14px 30px -18px color-mix(in srgb,var(--hm) 70%,transparent)}
.hm .opt .badge,.hm .opt.pick .badge.best{display:flex;align-items:center;gap:6px;align-self:stretch;text-transform:none;letter-spacing:0;font-size:12px;font-weight:700;padding:5px 10px;border-radius:999px;background:#f1f5f9;color:var(--ink2,#334155)}
.hm .opt .badge.best,.hm .opt.pick .badge.best{background:color-mix(in srgb,var(--hm) 10%,#fff);color:var(--hm-ink)}
.hm .opt .badge svg{width:14px;height:14px}
.hm .opt .oh{display:flex;gap:10px;align-items:center}
.hm .opt .oh .dp-tile{--t:var(--hm)}
.hm .opt h3{font-size:16px;line-height:1.25}
.hm .opt .kv{display:grid}
.hm .opt .kv>div{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:7px 0;border-top:1px dashed var(--line);font-size:13px}
.hm .opt .kv>div span{display:flex;align-items:center;gap:6px;color:var(--muted)}
.hm .opt .kv>div span svg{width:14px;height:14px;flex:none}
.hm .opt .kv>div b{text-align:right;font-weight:750;color:var(--ink);overflow-wrap:anywhere}
.hm .opt .kv .payback{background:none;border-radius:0;font-size:13px}
.hm .opt p.owhy{margin:0;font-size:13px;color:var(--ink2,#334155);line-height:1.5}
.hm .opt .btn{align-self:flex-start;margin-top:auto;display:inline-flex;align-items:center;gap:6px}
.hm .opt .btn svg{width:14px;height:14px}
.hm .cg-subs{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:12px;margin-top:14px}
.hm .cg-sub{background:#fbfcfe;box-shadow:none}

/* step 3: schools as cards */
.hm .otab{border:1px solid var(--line);background:#fff;border-radius:999px;padding:7px 12px;font-weight:650;font-size:13px;color:var(--ink2,#334155)}
.hm .otab[aria-selected="true"]{background:var(--hm);border-color:var(--hm);color:#fff;box-shadow:0 6px 14px -8px var(--hm)}
.hm #cgSchools{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));margin-top:10px}
.hm #cgSchools>:not(.nsch){grid-column:1/-1;margin:0}
.hm .nsch{gap:12px;padding:16px;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:0 1px 2px rgba(15,23,42,.05),0 2px 8px -2px rgba(15,23,42,.06)}
.hm .nsch.saved{border-color:color-mix(in srgb,var(--hm) 45%,var(--line))}
.hm .nsch-top{grid-template-columns:auto minmax(0,1fr) auto;gap:12px}
.hm .nsch-top .dp-tile{--t:var(--hm)}
.hm .nsch .nm{font-size:15px;line-height:1.25}
.hm .nsch .mt{margin-top:2px}
.hm .nsch .sv{display:inline-flex;align-items:center;gap:5px;padding:6px 11px;font-size:12.5px}
.hm .nsch .sv svg{width:14px;height:14px}
.hm .nsch .sv[aria-pressed="true"]{background:var(--hm);color:#fff;border-color:var(--hm)}
.hm .nsch-meta{display:flex;gap:6px;flex-wrap:wrap}
.hm .nsch-meta .chip{font-size:12px;font-weight:700;padding:3px 10px;border-radius:999px;background:#f1f5f9;color:var(--ink2,#334155)}
.hm .nsch .prog{color:var(--ink2,#334155);font-weight:600}
.hm .nsch .nums{grid-template-columns:repeat(2,minmax(0,1fr))}
.hm .nsch .nums>div{background:#f8fafc;border:1px solid #eef2f7;border-radius:12px;padding:10px 12px;justify-content:flex-start;gap:3px}
.hm .nsch .nums b{font-size:15px}
.hm .nsch .lks .btn-sm{min-height:32px}
.hm .nsch .lks .btn-sm svg,.hm .money .btn-sm svg{width:13px;height:13px}
.hm .cnote{display:flex;gap:8px;align-items:flex-start;padding:10px 12px;border-radius:12px;background:#fffbeb;color:#92400e;font-size:13px}
.hm .cnote svg{width:16px;height:16px;flex:none;margin-top:1px}

/* step 4: help */
.hm .aid{border:0;background:none}
.hm .hform{border:1px solid #cdeed8;border-radius:16px;background:linear-gradient(180deg,#f2fcf6,#fff);overflow:hidden}
.hm .hhead{width:100%;display:flex;gap:12px;align-items:center;text-align:left;border:0;background:transparent;padding:13px 14px;cursor:pointer;font:inherit;color:inherit}
.hm .hh-t,.hm .sf-t{flex:1;min-width:0}
.hm .hh-t b,.hm .sf-t b{display:block;font-size:14.5px;color:var(--ink)}
.hm .hh-t small,.hm .sf-t small{display:block;font-size:12.5px;color:var(--muted);font-weight:500}
.hm .sf-chev{margin-left:auto;flex:none;display:grid}
.hm .sf-chev svg{width:18px;height:18px;color:var(--muted);transition:transform .2s}
.hm .hhead[aria-expanded="true"] .sf-chev svg,.hm details[open]>summary .sf-chev svg{transform:rotate(180deg)}
.hm .hbody{padding:0 14px 14px;display:grid;gap:12px}
.hm .hbody[hidden]{display:none}
.hm .aidq{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;margin:0}
.hm fieldset.hq{border:0;margin:0;padding:0;min-width:0}
.hm .hq legend{font-size:13.5px;font-weight:700;color:var(--ink);padding:0;margin-bottom:6px}
.hm .hopts{display:flex;gap:6px;flex-wrap:wrap}
.hm .hopt{position:relative;display:inline-flex}
.hm .hopt input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
.hm .hopt span{border:1px solid var(--line);background:#fff;border-radius:999px;padding:7px 13px;font-weight:650;font-size:13px;color:var(--ink2,#334155);transition:background .15s}
.hm .hopt input:checked+span{background:#15803d;border-color:#15803d;color:#fff;box-shadow:0 6px 14px -8px #15803d}
.hm .hopt input:focus-visible+span{outline:3px solid #86efac;outline-offset:2px}
.hm .hsel select{font:inherit;font-size:13px;font-weight:650;color:var(--ink2,#334155);border:1px solid var(--line);background:#fff;border-radius:999px;padding:7px 12px;max-width:100%}
.hm .aid-priv{gap:12px;padding:12px 14px;border-radius:14px;background:linear-gradient(90deg,#f0fdf4,#fff);border:1px solid #cdeed8;font-size:13px;color:var(--ink2,#334155)}
.hm .aid-priv .dp-tile svg{width:18px;height:18px;color:inherit}
.hm .aid-lead{margin:14px 0 8px;font-size:13px;color:var(--muted)}
.hm .money{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}
.hm .mc{display:grid;gap:10px;padding:16px;border-radius:18px;background:#fff;border:1px solid var(--line);box-shadow:0 1px 2px rgba(15,23,42,.05),0 2px 8px -2px rgba(15,23,42,.06);align-content:start}
.hm .mc .mh{display:flex;gap:12px;align-items:center}
.hm .mc .mh b{display:block;font-size:15px;line-height:1.25}
.hm .mc .amt{display:inline-block;margin-top:4px;font-size:11.5px;font-weight:750;padding:2px 9px;border-radius:999px;background:color-mix(in srgb,var(--t) 10%,#fff);color:var(--t)}
.hm .mc p{margin:0;font-size:13px;color:var(--ink2,#334155);line-height:1.5}
.hm .mc .btn{justify-self:start;display:inline-flex;align-items:center;gap:6px;color:var(--t);border-color:color-mix(in srgb,var(--t) 25%,var(--line))}
.hm details.school-fold,.hm details.fafsa-basics{margin-top:12px;border:1px solid var(--line);border-radius:16px;background:#fff;padding:0;box-shadow:0 1px 2px rgba(15,23,42,.05)}
.hm details.school-fold>summary,.hm details.fafsa-basics>summary{display:flex;gap:12px;align-items:center;padding:13px 14px;cursor:pointer;list-style:none;color:inherit;margin:0}
.hm details.school-fold>summary::after,.hm details.fafsa-basics>summary::after{content:none}
.hm details.school-fold>summary .dp-tile,.hm details.fafsa-basics>summary .dp-tile{--t:var(--hm)}
.hm details.school-fold>summary .dp-tile svg,.hm details.fafsa-basics>summary .dp-tile svg{width:18px;height:18px}
.hm details.school-fold>:not(summary){margin:0 14px 14px}
.hm details.fafsa-basics>:not(summary){margin-left:14px;margin-right:14px}
.hm details.fafsa-basics>:last-child{margin-bottom:14px}

/* step 5 */
.hm .gs-head .dp-tile{--t:var(--hm)}
.hm .gs-n{width:28px;height:28px;border:0;background:color-mix(in srgb,var(--hm) 10%,#fff)}
.hm .gstep.open .gs-n{background:var(--hm);color:#fff}
.hm .gstep.done .gs-n{background:linear-gradient(160deg,#22c55e,#15803d);color:#fff}
.hm .gs-body{padding:0 14px 14px 100px}
.hm .gs-subs{gap:6px}
.hm .gs-subs li{border:1px solid #eef2f7;background:#fbfcfe;border-radius:12px;padding:9px 10px;align-items:center}
.hm .gs-subs li:first-child{border-top:1px solid #eef2f7}
.hm .gs-subs li.ok{background:#f3fcf6;border-color:#d4f0dd}
.hm .gs-subs .box,.hm .chk2 .box{border-radius:50%;width:20px;height:20px}
.hm .gs-subs li.ok .box,.hm .chk2 li.ok .box{background:linear-gradient(160deg,#22c55e,#15803d);border-color:transparent}
.hm .gs-done{display:inline-flex;align-items:center;gap:6px}
.hm .gs-done svg{width:14px;height:14px}

@media (max-width:760px){
  .hm .cstep{padding:14px}
  .hm .cstep>.sec-h h2{font-size:17px}
  .hm .cg-hero .hero-l{padding:18px}
  .hm .cg-hero .hero-l h2{font-size:20px}
  .hm .cg-hero .hero-r{padding:14px}
  .hm .tl .note{display:block}
  .hm .goal-btn{margin-left:auto}
  .hm .gs-body{padding:0 12px 12px}
  .hm .stp-left{margin-left:0}
}
.hm .cstep>.sec-h .stepno{color:#fff}
.hm .mc .dp-tile{--t:inherit}
.hm .aid-priv .dp-tile{flex:none;min-width:0}
.hm #cgAidMsg:empty{display:none}
.hm .cstep>.cg-sub{margin-top:14px}
@media (max-width:760px){ .hm .stp-left{display:none} }
