/* Ascend Graduation Application. Builds on the site's shared .asa-why design tokens and the
   .asa-con-form field styles (the Contact form), so it looks like the rest of the site. */

.asa-why.aga .aga-req{list-style:none;display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 0;padding:0}
.asa-why.aga .aga-req li{margin:0;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.35);border-radius:999px;padding:6px 14px;font-size:.95rem}
.asa-why.aga .aga-req b{font-size:1.05rem;margin-right:4px}

.asa-why.aga .aga-card{max-width:860px;margin:0 auto}
.asa-why.aga .aga-form{display:grid;gap:18px}
.asa-why.aga fieldset{border:0;margin:0;padding:0;min-width:0;display:grid;gap:14px}
.asa-why.aga legend{font-size:1.35rem;font-weight:800;color:var(--asa-navy);margin:0 0 4px;padding:0}
.asa-why.aga .aga-help{margin:0;color:var(--asa-muted)}
.asa-why.aga .asa-con-form label small,.asa-why.aga .aga-course small{display:inline;font-weight:400;color:var(--asa-muted);font-size:.82rem;margin-left:4px}

/* Every label wraps its own box: text on top, box underneath (the Contact form's label rules expect them apart). */
.asa-why.aga .asa-con-form label{display:block;margin:0}
.asa-why.aga .asa-con-form label > input,.asa-why.aga .asa-con-form label > select,.asa-why.aga .asa-con-form label > textarea{display:block;width:100%;box-sizing:border-box;margin:6px 0 0}

.asa-why.aga .aga-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.asa-why.aga .aga-grid-3{grid-template-columns:2fr 1fr 1fr}
.asa-why.aga .aga-grid > label{margin:0}

.asa-why.aga .aga-group{border:1px solid var(--asa-line);border-radius:18px;padding:16px 18px;display:grid;gap:10px;background:var(--asa-soft)}
.asa-why.aga .aga-group h3{margin:0;font-size:1.02rem;color:var(--asa-blue)}
.asa-why.aga .asa-con-form label.aga-course{display:grid;grid-template-columns:1fr 150px;align-items:center;gap:12px;margin:0;font-weight:600}
.asa-why.aga .asa-con-form label.aga-course > select{margin:0}

.asa-why.aga .aga-electives{display:grid;gap:10px}
.asa-why.aga .aga-elective{display:grid;grid-template-columns:minmax(0,1fr) 110px 150px 40px;min-width:0;gap:10px;align-items:end;background:var(--asa-soft);border:1px solid var(--asa-line);border-radius:16px;padding:12px}
.asa-why.aga .aga-elective label{margin:0;font-size:.88rem}
.asa-why.aga .aga-elective .aga-remove{width:40px;min-width:0;max-width:40px;padding:0;margin:0;height:44px;border:1.5px solid var(--asa-line);border-radius:12px;background:#fff;color:var(--asa-muted);font-size:1.4rem;line-height:1;cursor:pointer}
.asa-why.aga .aga-remove:hover{color:#b3261e;border-color:#f0c4c0}
.asa-why.aga .aga-step .aga-add{margin:0;min-width:0;justify-self:start;border:1.5px dashed var(--asa-blue);background:#fff;color:var(--asa-blue);border-radius:999px;padding:10px 18px;font-weight:700;cursor:pointer}

.asa-why.aga .aga-total{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:4px}
.asa-why.aga .aga-total > div{background:#fff;border:1.5px solid var(--asa-line);border-radius:16px;padding:10px 12px;text-align:center}
.asa-why.aga .aga-total b{display:block;font-size:1.45rem;color:var(--asa-navy);line-height:1.2}
.asa-why.aga .aga-total span{font-size:.82rem;color:var(--asa-muted)}
.asa-why.aga .aga-total .is-good{border-color:#9fd3a8;background:#f1faf2}
.asa-why.aga .aga-total .is-good b{color:#1d6b2f}
.asa-why.aga .aga-total .is-low{border-color:#f1c79a;background:#fff8ee}

.asa-why.aga .aga-steps{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0 0 20px;padding:0;counter-reset:aga}
.asa-why.aga .aga-steps li{counter-increment:aga;margin:0;display:flex;align-items:center;gap:8px;padding:7px 14px 7px 8px;border-radius:999px;background:var(--asa-soft);border:1px solid var(--asa-line);color:var(--asa-muted);font-size:.88rem;font-weight:600}
.asa-why.aga .aga-steps li::before{content:counter(aga);display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#fff;border:1px solid var(--asa-line);font-size:.8rem}
.asa-why.aga .aga-steps li.is-on{background:var(--asa-blue);border-color:var(--asa-blue);color:#fff}
.asa-why.aga .aga-steps li.is-on::before{color:var(--asa-blue)}
.asa-why.aga .aga-steps li.is-done::before{content:'\2713';background:#e7f5ea;color:#1d6b2f;border-color:#9fd3a8}
.asa-why.aga:not(.aga-js) .aga-steps,.asa-why.aga:not(.aga-js) .aga-nav [data-prev],.asa-why.aga:not(.aga-js) .aga-nav [data-next]{display:none}
.asa-why.aga.aga-js .aga-steps li{cursor:pointer}
.asa-why.aga .aga-steps li:focus-visible{outline:3px solid var(--asa-blue);outline-offset:2px}

.asa-why.aga .aga-nav{display:flex;gap:12px;justify-content:flex-end;flex-wrap:wrap}
.asa-why.aga .aga-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 28px;border-radius:999px;border:0;background:var(--asa-blue);color:#fff;font:inherit;font-weight:700;font-size:1rem;cursor:pointer;box-shadow:0 6px 16px rgba(3,124,175,.22)}
.asa-why.aga .aga-btn:hover{background:#02688f}
.asa-why.aga .aga-btn-send{background:#ffd166;color:#10222e;box-shadow:0 6px 18px rgba(0,0,0,.16)}
.asa-why.aga .aga-btn-send:hover{background:#ffc53d}
.asa-why.aga .aga-btn-ghost{background:#fff;color:var(--asa-blue);border:1.5px solid var(--asa-blue);box-shadow:none}
.asa-why.aga .aga-btn-ghost:hover{background:var(--asa-soft)}
.asa-why.aga .aga-btn[disabled]{opacity:.6;cursor:progress}
.asa-why.aga .aga-btn:focus-visible,.asa-why.aga .aga-add:focus-visible,.asa-why.aga .aga-remove:focus-visible{outline:3px solid var(--asa-navy);outline-offset:2px}
.asa-why.aga [hidden]{display:none!important}

.asa-why.aga .aga-bad{border-color:#d93025!important;box-shadow:0 0 0 3px rgba(217,48,37,.15)!important}
.asa-why.aga .aga-warn,.asa-why.aga .aga-alert{margin:0;padding:12px 16px;border-radius:14px;background:#fff6db;border:1px solid #f3d27a;color:#5c4200;font-weight:600}
.asa-why.aga .aga-alert{margin-bottom:16px}
.asa-why.aga .aga-fine{margin:0;font-size:.85rem;color:var(--asa-muted)}
.asa-why.aga .aga-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.asa-why.aga .aga-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.asa-why.aga .aga-done{max-width:760px;margin:0 auto}
.asa-why.aga .aga-done h2{margin-top:0}

@media (max-width:700px){
	.asa-why.aga .asa-con-form.aga-card{padding:22px 16px}
	.asa-why.aga .aga-grid,.asa-why.aga .aga-grid-3{grid-template-columns:1fr}
	.asa-why.aga .asa-con-form label.aga-course{grid-template-columns:1fr;gap:6px}
	.asa-why.aga .aga-elective{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 40px}
	.asa-why.aga .aga-elective label:first-child{grid-column:1 / -1}
	.asa-why.aga .aga-steps li{font-size:0;padding:4px}
	.asa-why.aga .aga-steps li::before{font-size:.8rem}
	.asa-why.aga .aga-steps li.is-on{font-size:.85rem;padding:4px 12px 4px 4px}
	.asa-why.aga .aga-total b{font-size:1.2rem}
	.asa-why.aga .aga-nav .aga-btn{flex:1}
}