/*-- -------------------------- -->
<---       Apply Form           -->
<--- -------------------------- -*/

/* Mobile - 0px */
@media only screen and (min-width: 0px) {

	#apply-form {
		background: #fafaf8;
		padding-bottom: 5rem;
		display: flex;
		flex-direction: column;
	}

	/* ── Progress Rail ─────────────────────────────────────────── */

	#apply-form .apply-form__rail {
		position: sticky;
		top: var(--nav-offset, 4.5rem);
		z-index: 50;
		width: 100%;
		background: var(--white);
		border-bottom: 0.5px solid rgba(0, 0, 0, 0.09);
		box-shadow: 0 2px 14px rgba(10, 22, 40, 0.06);
		padding: 0.875rem 1rem 0.75rem;
	}

	/* ── Steps ─────────────────────────────────────────────────── */

	#apply-form .apply-form__steps {
		display: flex;
		flex-direction: row;
		align-items: flex-start;
		list-style: none;
		padding: 0;
		margin: 0;
	}

	#apply-form .apply-form__step {
		flex: 1;
		display: flex;
		flex-direction: column;
		align-items: center;
		position: relative;
		cursor: pointer;
	}

	/* Connecting line */
	#apply-form .apply-form__step::after {
		content: '';
		position: absolute;
		top: 0.4375rem;
		left: 50%;
		width: 100%;
		height: 1.5px;
		background: var(--silver);
		z-index: 0;
	}

	#apply-form .apply-form__step:last-child::after {
		display: none;
	}

	#apply-form .apply-form__step--done::after,
	#apply-form .apply-form__step--passed::after {
		background: var(--brooklynBlue);
	}

	#apply-form .apply-form__step--active::after {
		background: linear-gradient(to right, var(--brooklynBlue), var(--silver));
	}

	/* ── Step Dot ──────────────────────────────────────────────── */

	#apply-form .apply-form__step-dot {
		position: relative;
		z-index: 1;
		width: 1rem;
		height: 1rem;
		border-radius: 50%;
		border: 2px solid var(--silver);
		background: var(--white);
		display: flex;
		align-items: center;
		justify-content: center;
		transition: all 0.25s ease;
		flex-shrink: 0;
	}

	#apply-form .apply-form__step--done .apply-form__step-dot {
		border-color: var(--brooklynBlue);
		background: var(--brooklynBlue);
	}

	#apply-form .apply-form__step--active .apply-form__step-dot {
		border-color: var(--navy);
		box-shadow: 0 0 0 3px rgba(15, 47, 91, 0.15);
	}

	#apply-form .apply-form__step--active .apply-form__step-dot::after {
		content: '';
		width: 0.375rem;
		height: 0.375rem;
		border-radius: 50%;
		background: var(--navy);
		display: block;
	}

	/* ── Step Body ─────────────────────────────────────────────── */

	#apply-form .apply-form__step-body {
		display: flex;
		flex-direction: column;
		align-items: center;
		text-align: center;
		padding-top: 0.375rem;
	}

	#apply-form .apply-form__step-num {
		display: block;
		font-size: 0.5rem;
		font-weight: 700;
		letter-spacing: 0.08em;
		text-transform: uppercase;
		color: var(--silver);
		margin-bottom: 0.125rem;
	}

	#apply-form .apply-form__step--active .apply-form__step-num {
		color: var(--navy);
	}

	#apply-form .apply-form__step--done .apply-form__step-num {
		color: var(--brooklynBlue);
		opacity: 0.7;
	}

	/* Hidden on mobile */
	#apply-form .apply-form__step-title {
		display: none;
	}

	/* ── Form Layout ───────────────────────────────────────────── */

	#apply-form .apply-form__layout {
		padding: 0.75rem 1rem 0;
	}

	/* ── Form Card ─────────────────────────────────────────────── */

	#apply-form .apply-form__card {
		scroll-margin-top: calc(var(--nav-offset, 4.5rem) + 4rem);
		background: var(--white);
		border: 0.5px solid rgba(0, 0, 0, 0.09);
		border-radius: 0.375rem;
		overflow: hidden;
		margin-bottom: 1.25rem;
		box-shadow: 0 2px 14px rgba(10, 22, 40, 0.04);
	}

	#apply-form .apply-form__card-head {
		background: var(--navy);
		padding: 0.875rem 1.5rem;
		display: flex;
		align-items: center;
		gap: 0.75rem;
	}

	#apply-form .apply-form__card-num {
		width: 1.625rem;
		height: 1.625rem;
		border-radius: 50%;
		background: var(--signingGold);
		color: var(--navy);
		font-size: 0.6875rem;
		font-weight: 700;
		display: flex;
		align-items: center;
		justify-content: center;
		flex-shrink: 0;
	}

	#apply-form .apply-form__card-title {
		font-size: 0.875rem;
		font-weight: 700;
		color: var(--white);
		letter-spacing: 0.03em;
		margin: 0;
	}

	#apply-form .apply-form__card-opt {
		font-size: 0.6875rem;
		color: rgba(255, 255, 255, 0.4);
		margin-left: auto;
		font-style: italic;
	}

	#apply-form .apply-form__card-body {
		padding: 1.5rem;
	}

	/* ── Sub Label ─────────────────────────────────────────────── */

	#apply-form .apply-form__sublabel {
		font-size: 0.59375rem;
		font-weight: 700;
		letter-spacing: 0.14em;
		text-transform: uppercase;
		color: var(--signingGold);
		margin: 0 0 0.75rem;
		display: flex;
		align-items: center;
		gap: 0.5rem;
	}

	#apply-form .apply-form__sublabel::after {
		content: '';
		flex: 1;
		height: 1px;
		background: rgba(15, 47, 91, 0.07);
	}

	/* ── Divider ───────────────────────────────────────────────── */

	#apply-form .apply-form__divider {
		height: 1px;
		background: rgba(0, 0, 0, 0.06);
		border: none;
		margin: 1.125rem 0;
	}

	/* ── Grid ──────────────────────────────────────────────────── */

	#apply-form .apply-form__grid {
		display: grid;
		gap: 0.8125rem;
		margin-bottom: 0.8125rem;
	}

	#apply-form .apply-form__grid--2,
	#apply-form .apply-form__grid--3 {
		grid-template-columns: 1fr;
	}

	/* ── Field ─────────────────────────────────────────────────── */

	#apply-form .apply-form__field {
		display: flex;
		flex-direction: column;
		gap: 0.25rem;
	}

	#apply-form .apply-form__field--full {
		grid-column: 1 / -1;
	}

	#apply-form .apply-form__label {
		font-size: 0.625rem;
		font-weight: 700;
		letter-spacing: 0.08em;
		text-transform: uppercase;
		color: rgba(15, 47, 91, 0.48);
	}

	#apply-form .apply-form__label abbr {
		text-decoration: none;
		color: var(--brooklynBlue);
	}

	#apply-form .apply-form__input,
	#apply-form .apply-form__select {
		border: 1px solid var(--silver);
		border-radius: 0.3125rem;
		padding: 0.5rem 0.6875rem;
		font-size: 0.8125rem;
		color: var(--charcoal);
		background: #fafaf8;
		outline: none;
		width: 100%;
		transition: border-color 0.18s ease, box-shadow 0.18s ease;
		appearance: auto;
	}

	#apply-form .apply-form__input:focus,
	#apply-form .apply-form__select:focus {
		border-color: var(--brooklynBlue);
		background: var(--white);
		box-shadow: 0 0 0 3px rgba(26, 120, 189, 0.09);
	}

	#apply-form .apply-form__input::placeholder,
	#apply-form .apply-form__select::placeholder {
		color: var(--silver);
		opacity: 0.7;
	}

	/* ── Checkbox Row ──────────────────────────────────────────── */

	#apply-form .apply-form__checkbox-row {
		display: flex;
		align-items: center;
		gap: 0.5rem;
		margin-bottom: 0.5625rem;
		cursor: pointer;
		font-size: 0.8125rem;
		color: var(--charcoal);
	}

	#apply-form .apply-form__checkbox {
		accent-color: var(--brooklynBlue);
		width: 0.875rem;
		height: 0.875rem;
		flex-shrink: 0;
		cursor: pointer;
	}

	/* ── Chips ─────────────────────────────────────────────────── */

	#apply-form .apply-form__chips {
		display: flex;
		flex-wrap: wrap;
		gap: 0.4375rem;
		margin-bottom: 0.8125rem;
	}

	#apply-form .apply-form__chip {
		display: flex;
		align-items: center;
		gap: 0.375rem;
		font-size: 0.78125rem;
		color: var(--charcoal);
		cursor: pointer;
		padding: 0.4375rem 0.75rem;
		border: 1px solid var(--silver);
		border-radius: 0.3125rem;
		background: #fafaf8;
		user-select: none;
		transition: border-color 0.18s ease, background 0.18s ease;
	}

	#apply-form .apply-form__chip input {
		accent-color: var(--brooklynBlue);
	}

	#apply-form .apply-form__chip:hover {
		border-color: var(--brooklynBlue);
		background: #f0f7fd;
	}

	#apply-form .apply-form__chip input:checked + span {
		color: var(--navy);
		font-weight: 500;
	}

	/* ── Program Cards ─────────────────────────────────────────── */

	#apply-form .apply-form__prog-grid {
		display: grid;
		grid-template-columns: 1fr;
		gap: 0.5rem;
		margin-bottom: 0.8125rem;
	}

	#apply-form .apply-form__prog-card {
		border: 1px solid var(--silver);
		border-radius: 0.3125rem;
		padding: 0.625rem 0.75rem;
		cursor: pointer;
		transition: border-color 0.18s ease, background 0.18s ease;
		display: flex;
		align-items: flex-start;
		gap: 0.5rem;
		background: #fafaf8;
	}

	#apply-form .apply-form__prog-card input {
		accent-color: var(--brooklynBlue);
		margin-top: 0.125rem;
		flex-shrink: 0;
	}

	#apply-form .apply-form__prog-card:hover {
		border-color: var(--brooklynBlue);
		background: #f0f7fd;
	}

	#apply-form .apply-form__prog-info {
		display: flex;
		flex-direction: column;
		gap: 0.125rem;
	}

	#apply-form .apply-form__prog-name {
		font-size: 0.75rem;
		font-weight: 600;
		color: var(--navy);
		display: block;
	}

	#apply-form .apply-form__prog-note {
		font-size: 0.65625rem;
		color: var(--silver);
	}

	/* ── Month Picker ──────────────────────────────────────────── */

	#apply-form .apply-form__months {
		display: flex;
		flex-wrap: wrap;
		gap: 0.375rem;
		margin-bottom: 0.6875rem;
	}

	#apply-form .apply-form__month {
		display: flex;
		align-items: center;
		gap: 0.3125rem;
		font-size: 0.75rem;
		color: var(--charcoal);
		cursor: pointer;
		padding: 0.375rem 0.625rem;
		border: 1px solid var(--silver);
		border-radius: 0.3125rem;
		background: #fafaf8;
		transition: border-color 0.18s ease, background 0.18s ease;
	}

	#apply-form .apply-form__month input {
		accent-color: var(--brooklynBlue);
	}

	#apply-form .apply-form__month:hover {
		border-color: var(--brooklynBlue);
		background: #f0f7fd;
	}

	/* ── Notice ────────────────────────────────────────────────── */

	#apply-form .apply-form__notice {
		background: #f0f6fb;
		border-left: 3px solid var(--brooklynBlue);
		border-radius: 0 0.3125rem 0.3125rem 0;
		padding: 0.75rem 0.9375rem;
		font-size: 0.78125rem;
		color: #3a5a7a;
		line-height: 1.6;
		margin-bottom: 0.8125rem;
	}

	#apply-form .apply-form__notice strong {
		color: var(--navy);
		font-weight: 600;
	}

	#apply-form .apply-form__notice--warn {
		background: #fdf8ec;
		border-left-color: var(--signingGold);
		color: #6b5020;
	}

	/* ── Payment Box ───────────────────────────────────────────── */

	#apply-form .apply-form__payment-box {
		border: 1px solid var(--silver);
		border-radius: 0.3125rem;
		padding: 1rem;
		background: #fafaf8;
		margin-bottom: 0.8125rem;
	}

	#apply-form .apply-form__payment-title {
		font-size: 0.71875rem;
		font-weight: 700;
		color: var(--navy);
		margin-bottom: 0.625rem;
		letter-spacing: 0.04em;
	}

	#apply-form .apply-form__payment-details {
		display: grid;
		grid-template-columns: auto 1fr;
		gap: 0.25rem 1rem;
		font-size: 0.75rem;
		color: #4a5568;
		line-height: 1.75;
	}

	#apply-form .apply-form__payment-details dt {
		font-weight: 600;
		color: var(--navy);
		white-space: nowrap;
	}

	#apply-form .apply-form__payment-details dd {
		margin: 0;
	}

	/* ── Declaration ───────────────────────────────────────────── */

	#apply-form .apply-form__declaration {
		background: #f8f8f6;
		border: 1px solid var(--silver);
		border-radius: 0.3125rem;
		padding: 1rem;
		font-size: 0.75rem;
		color: #4a5568;
		line-height: 1.75;
		margin-bottom: 1rem;
	}

	#apply-form .apply-form__declaration h3 {
		font-size: 0.6875rem;
		font-weight: 700;
		color: var(--navy);
		letter-spacing: 0.06em;
		text-transform: uppercase;
		margin-bottom: 0.375rem;
		margin-top: 0.8125rem;
	}

	#apply-form .apply-form__declaration h3:first-child {
		margin-top: 0;
	}

	#apply-form .apply-form__declaration p {
		margin-bottom: 0.25rem;
		font-size: 0.75rem;
		color: #4a5568;
	}

	#apply-form .apply-form__declaration p strong {
		color: var(--navy);
	}

	/* ── Signature Pad ─────────────────────────────────────────── */

	#apply-form .apply-form__sig-wrap {
		border: 1px solid var(--silver);
		border-radius: 0.3125rem;
		background: var(--white);
		overflow: hidden;
		transition: border-color 0.18s ease, box-shadow 0.18s ease;
	}

	#apply-form .apply-form__sig-wrap:focus-within {
		border-color: var(--brooklynBlue);
		box-shadow: 0 0 0 3px rgba(26, 120, 189, 0.09);
	}

	#apply-form .apply-form__sig-wrap.is-signed {
		border-color: rgba(15, 47, 91, 0.3);
	}

	#apply-form .apply-form__sig-canvas {
		display: block;
		width: 100%;
		height: 7.5rem;
		cursor: crosshair;
		touch-action: none;
		background: var(--white);
	}

	#apply-form .apply-form__sig-toolbar {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 0.375rem 0.625rem;
		border-top: 1px solid rgba(0, 0, 0, 0.06);
		background: #f5f5f3;
	}

	#apply-form .apply-form__sig-hint {
		font-size: 0.65625rem;
		color: var(--silver);
		font-style: italic;
	}

	#apply-form .apply-form__sig-clear {
		font-size: 0.5625rem;
		font-weight: 700;
		letter-spacing: 0.08em;
		text-transform: uppercase;
		color: rgba(15, 47, 91, 0.45);
		background: none;
		border: 1px solid rgba(15, 47, 91, 0.18);
		border-radius: 100px;
		padding: 0.25rem 0.625rem;
		cursor: pointer;
		transition: all 0.18s ease;
	}

	#apply-form .apply-form__sig-clear:hover {
		color: var(--navy);
		border-color: rgba(15, 47, 91, 0.4);
		background: rgba(15, 47, 91, 0.04);
	}

	#apply-form .apply-form__sig-clear:disabled {
		opacity: 0.35;
		cursor: default;
		pointer-events: none;
	}

	#apply-form .apply-form__sig-note {
		font-size: 0.65625rem;
		color: var(--silver);
		margin-top: 0.25rem;
		display: block;
	}

	/* ── Actions ───────────────────────────────────────────────── */

	#apply-form .apply-form__actions {
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin-top: 1.25rem;
		padding-top: 1.125rem;
		border-top: 1px solid rgba(0, 0, 0, 0.06);
	}

	#apply-form .apply-form__btn {
		font-size: 0.6875rem;
		font-weight: 700;
		letter-spacing: 0.1em;
		text-transform: uppercase;
		border-radius: 100px;
		padding: 0.6875rem 1.75rem;
		cursor: pointer;
		transition: all 0.22s ease;
		line-height: 1;
	}

	#apply-form .apply-form__btn--solid {
		background: var(--brooklynBlue);
		color: var(--white);
		border: 1.5px solid var(--brooklynBlue);
	}

	#apply-form .apply-form__btn--solid:hover {
		background: #1562a0;
		border-color: #1562a0;
	}

	#apply-form .apply-form__btn--ghost {
		background: transparent;
		color: rgba(15, 47, 91, 0.6);
		border: 1.5px solid rgba(15, 47, 91, 0.22);
	}

	#apply-form .apply-form__btn--ghost:hover {
		color: var(--navy);
		border-color: rgba(15, 47, 91, 0.45);
		background: rgba(15, 47, 91, 0.03);
	}

} /* Mobile */


/* Tablet - 768px */
@media only screen and (min-width: 48rem) {

	#apply-form .apply-form__rail {
		padding: 0.875rem 2rem 0.75rem;
	}

	#apply-form .apply-form__layout {
		padding: 0.75rem 2rem 0;
	}

	#apply-form .apply-form__grid--2 {
		grid-template-columns: 1fr 1fr;
	}

	#apply-form .apply-form__grid--3 {
		grid-template-columns: 1fr 1fr;
	}

	#apply-form .apply-form__prog-grid {
		grid-template-columns: 1fr 1fr;
	}

	/* Show step titles on tablet+ */
	#apply-form .apply-form__step-title {
		display: block;
		font-size: 0.625rem;
		font-weight: 600;
		color: rgba(15, 47, 91, 0.38);
		text-align: center;
	}

	#apply-form .apply-form__step--active .apply-form__step-title {
		color: var(--navy);
	}

	#apply-form .apply-form__step--done .apply-form__step-title {
		color: rgba(15, 47, 91, 0.52);
	}

} /* Tablet */


/* Desktop - 1024px */
@media only screen and (min-width: 64rem) {

	#apply-form {
		padding-bottom: 6.25rem;
	}

	#apply-form .apply-form__rail {
		padding: 1.125rem 6vw 1rem;
	}

	#apply-form .apply-form__layout {
		max-width: 80rem;
		margin: 0 auto;
		padding: 0.75rem 6vw 0;
	}

	#apply-form .apply-form__card {
		scroll-margin-top: calc(var(--nav-offset, 4.5rem) + 4rem);
	}

	#apply-form .apply-form__step-title {
		font-size: 0.6875rem;
	}

	#apply-form .apply-form__grid--3 {
		grid-template-columns: 1fr 1fr 1fr;
	}

} /* Desktop */