/* Task-focused layout; shared brand and components come from style.css. */
.page-enrolment {
  color-scheme: light;
  --color-heading: var(--text-brown);
  --color-text: var(--text-brown);
  --color-ink: var(--text-brown);
  --color-link: var(--deep-brown);
  --color-link-hover: var(--fox-terracotta-hover);
  --color-text-on-dark: var(--text-brown);
  --border-subtle: 1px solid rgba(58, 48, 44, .22);
  --card-bg: var(--cream-light);
  --surface-raised: var(--parchment);
}
.enrolment-header { padding-block: var(--space-xl); display: flex; justify-content: space-between; gap: var(--space-lg); border-bottom: var(--border-subtle); }
.brand { font-size: .9375rem; font-weight: 700; letter-spacing: var(--letter-spacing-label); text-decoration: none; color: var(--color-heading); }
.page-enrolment main { padding-block: var(--space-2xl); }
.intro { max-width: 700px; margin-bottom: var(--space-2xl); }
.eyebrow { font-size: .75rem; letter-spacing: var(--letter-spacing-label); text-transform: uppercase; font-weight: 600; color: var(--fox-terracotta); }
.page-enrolment h1 { font-size: clamp(2rem, 4vw, 3rem); letter-spacing: -.025em; }
.page-enrolment :is(h2, #receipt h1) { font-size: clamp(1.25rem, 3vw, 1.625rem); margin-bottom: var(--space-lg); }
.page-enrolment h3 { margin-top: var(--space-lg); }
.intro > p:not(.eyebrow) { font-size: var(--font-size-body-lg); }
.note, .hint, .form-guide { font-size: .875rem; }
.notice { padding: var(--card-padding); border: var(--card-border); background: var(--card-bg); border-radius: var(--card-radius); margin-bottom: var(--space-lg); }
.enrolment-section { margin-block: var(--space-xl); padding-top: var(--space-xl); border-top: var(--border-subtle); }
.enrolment-section > .eyebrow { margin-bottom: var(--space-sm); }
.field { min-width: 0; }
.field.wide { grid-column: 1 / -1; }
.page-enrolment input, .page-enrolment select, .page-enrolment textarea { min-width: 0; min-height: 46px; }
.page-enrolment .check { display: flex; align-items: flex-start; gap: var(--space-sm); min-height: 44px; padding-block: var(--space-xs); font-size: 1rem; font-weight: 400; }
.page-enrolment input[type=checkbox], .page-enrolment input[type=radio] { width: 20px; height: 20px; min-height: 20px; flex: 0 0 20px; margin: 2px 0 0; padding: 0; accent-color: var(--fox-terracotta); }
.checks { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-2xs) var(--space-lg); }
.page-enrolment fieldset { min-width: 0; border: 0; padding: 0; margin: 0; }
.page-enrolment fieldset.group { margin-block: var(--space-lg); }
.page-enrolment fieldset > legend { font: 600 .875rem var(--font-body); color: var(--color-heading); margin-bottom: var(--space-md); }
.intake-fields:disabled { opacity: .8; }
.page-enrolment button { min-height: 48px; }
.page-enrolment button:disabled { opacity: .55; cursor: not-allowed; transform: none; }
.actions { display: flex; gap: var(--space-md); flex-wrap: wrap; margin-block: var(--space-lg); }
.actions p { width: 100%; margin: 0; }
.page-enrolment :focus-visible { outline: 2px solid var(--fox-terracotta); outline-offset: 3px; }
.page-enrolment .waitlist-form .form-field :is(input,select,textarea):focus-visible { outline: 2px solid var(--fox-terracotta); outline-offset: 3px; }
.page-enrolment .error { color: var(--text-brown); border: 2px solid var(--fox-terracotta); }
.page-enrolment .btn--hero-outline { border-color: var(--deep-brown); }
.term-highlight { border-left: 4px solid var(--fox-terracotta); }
.term-highlight strong { font-size: 1.25rem; }
.programme-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-lg); margin-bottom: var(--space-lg); }
.programme-card { display: flex; align-items: flex-start; gap: var(--space-sm); padding: var(--space-lg); border: var(--border-subtle); border-radius: var(--card-radius); background: var(--card-bg); cursor: pointer; }
.programme-card:has(input:checked) { outline: 2px solid var(--fox-terracotta); outline-offset: -2px; }
.programme-card strong { font-size: var(--font-size-body-lg); }
.programme-description, .programme-fee { display: block; margin-top: var(--space-sm); }
.programme-fee { white-space: pre-line; font-weight: 700; font-size: var(--font-size-body-lg); }
.page-enrolment .text-action { background: transparent; border: 0; padding: 0; color: var(--color-link); font: inherit; text-decoration: underline; cursor: pointer; }
.page-enrolment .waitlist-form [aria-invalid=true] { border: 2px solid var(--fox-terracotta); }
#summary { white-space: pre-line; font-size: var(--font-size-body-lg); }
#disclosure { border-left: 3px solid var(--fox-terracotta); padding: var(--space-md) var(--space-lg); background: var(--surface-raised); }
#receipt-id { font-size: 1.5rem; letter-spacing: var(--letter-spacing-label); white-space: nowrap; }
.page-enrolment footer { margin-top: var(--space-2xl); padding-top: var(--space-lg); border-top: var(--border-subtle); font-size: .875rem; }
.dob-inputs { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,2fr) minmax(0,1.3fr); gap: var(--space-sm); }
.more-learning { margin-top: var(--space-lg); }
.more-learning summary { cursor: pointer; padding-block: var(--space-sm); min-height: 44px; }
.more-learning[open] summary { margin-bottom: var(--space-md); }
[hidden] { display: none !important; }
@media (max-width: 639px) {
  .enrolment-header { padding-block: var(--space-lg); flex-direction: column; gap: var(--space-xs); }
  .enrolment-header > a:last-child { font-size: .875rem; }
  .page-enrolment main { padding-block: var(--space-xl); }
  .checks { grid-template-columns: 1fr; }
  .programme-options { grid-template-columns: 1fr; }
  .actions button { width: 100%; }
  .notice { padding: var(--space-lg); }
}
@media (max-width: 400px) { .dob-inputs { grid-template-columns: 1fr; } }
@media print {
  .enrolment-header,.intro,footer,form,.actions,#availability,#error,#print-receipt,.skip-link { display: none !important; }
  .page-enrolment,.page-enrolment h2,.notice { background: white; color: var(--text-brown); }
  .page-enrolment main { width: 100%; padding: 0; background: white; }
  #receipt { border: 0; padding: 0; }
  #receipt a { color: var(--text-brown); }
}
.enrolment-language { margin-bottom: 1.5rem; }
.enrolment-language > span { font-size: .875rem; }
.enrolment-language #google_translate_element { margin-top: .35rem; }
@media print { .enrolment-language { display: none; } }