.referral-page {
    --referral-navy: #071f45;
    --referral-blue: #0b4fa3;
    --referral-sky: #eaf4ff;
    --referral-gold: #f4b942;
    --referral-green: #14866d;
    --referral-text: #132238;
    --referral-muted: #66758a;
    --referral-border: #d9e4ef;
    position: relative;
    width: 100%;
    min-height: calc(100vh - 1px);
    overflow-x: clip;
    background: #f6f9fc;
    color: var(--referral-text);
    isolation: isolate;
}

.referral-page *,
.referral-page *::before,
.referral-page *::after { box-sizing: border-box; }
.referral-page .container { width: min(1160px, calc(100% - 40px)); margin-inline: auto; }

.referral-hero {
    position: relative;
    overflow: hidden;
    padding: 76px 0 68px;
    color: #fff;
    background:
        radial-gradient(circle at 83% 25%, rgba(61, 156, 255, .34), transparent 30%),
        linear-gradient(125deg, #061b3d 0%, #093d82 55%, #0c67b2 100%);
}
.referral-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    opacity: .2;
    background-image: linear-gradient(rgba(255,255,255,.16) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.16) 1px, transparent 1px);
    background-size: 42px 42px;
    mask-image: linear-gradient(to right, transparent, #000 45%, #000);
}
.referral-hero__grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 42px; align-items: center; }
.referral-eyebrow, .referral-kicker { display: inline-flex; align-items: center; gap: 8px; color: var(--referral-blue); font-size: 12px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.referral-eyebrow { color: #ffe08a; }
.referral-hero h1 { margin: 10px 0 12px; font-size: clamp(38px, 6vw, 70px); line-height: .98; letter-spacing: -.045em; }
.referral-hero p { max-width: 720px; margin: 0; color: rgba(255,255,255,.82); font-size: 17px; line-height: 1.7; }
.referral-hero__badge { display: grid; grid-template-columns: 38px auto 20px 38px auto 20px 38px auto; gap: 9px; align-items: center; padding: 18px 20px; border: 1px solid rgba(255,255,255,.2); border-radius: 18px; background: rgba(255,255,255,.1); backdrop-filter: blur(18px); box-shadow: 0 24px 80px rgba(0,0,0,.16); }
.referral-hero__badge span { display: grid; width: 38px; height: 38px; place-items: center; border-radius: 50%; color: var(--referral-navy); background: #fff; font-weight: 900; }
.referral-hero__badge strong { white-space: nowrap; font-size: 13px; }
.referral-hero__badge i { color: rgba(255,255,255,.55); font-style: normal; }

.referral-content {
    position: relative;
    z-index: 1;
    padding: 54px 0 96px;
}
.referral-layout { display: grid; grid-template-columns: 310px minmax(0, 1fr); gap: 28px; align-items: start; }
.referral-summary,
.referral-card {
    min-width: 0;
    border: 1px solid var(--referral-border);
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 24px 70px rgba(21, 48, 80, .08);
}
.referral-summary { position: sticky; top: 26px; padding: 28px; }
.referral-summary h2 { margin: 10px 0 18px; font-size: 25px; line-height: 1.18; letter-spacing: -.025em; }
.referral-summary ul { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.referral-summary li { position: relative; padding-left: 28px; color: #45566d; line-height: 1.5; }
.referral-summary li::before { content: "✓"; position: absolute; left: 0; top: 1px; display: grid; width: 19px; height: 19px; place-items: center; border-radius: 50%; color: #fff; background: var(--referral-green); font-size: 11px; font-weight: 900; }
.referral-summary__note { margin-top: 24px; padding: 17px; border-radius: 16px; background: var(--referral-sky); }
.referral-summary__note strong { color: var(--referral-blue); }
.referral-summary__note p { margin: 6px 0 0; color: #4f637c; font-size: 13px; line-height: 1.55; }

.referral-card {
    width: 100%;
    min-width: 0;
    padding: 32px;
    overflow: hidden;
}
.referral-card form { min-width: 0; }
.referral-card input,
.referral-card button,
.referral-card a { max-width: 100%; }
.referral-card__heading { display: flex; justify-content: space-between; gap: 24px; align-items: start; padding-bottom: 24px; border-bottom: 1px solid var(--referral-border); }
.referral-card__heading h2 { margin: 7px 0 5px; font-size: 29px; letter-spacing: -.03em; }
.referral-card__heading p { margin: 0; color: var(--referral-muted); }
.referral-required { white-space: nowrap; color: var(--referral-muted); font-size: 12px; }
.referral-required b, .referral-field label span { color: #d83a4b; }
.referral-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; padding-top: 28px; }
.referral-field--wide { grid-column: 1 / -1; }
.referral-field label { display: block; margin-bottom: 8px; font-size: 13px; font-weight: 800; }
.referral-field input { width: 100%; height: 50px; padding: 0 15px; border: 1px solid #cad7e3; border-radius: 13px; outline: none; color: var(--referral-text); background: #fff; font: inherit; transition: border-color .18s, box-shadow .18s, background .18s; }
.referral-field input:focus { border-color: #4289d5; box-shadow: 0 0 0 4px rgba(66,137,213,.13); }
.referral-field input.is-invalid { border-color: #d83a4b; background: #fff7f8; box-shadow: 0 0 0 3px rgba(216,58,75,.09); }
.referral-field small, .referral-consent > small { display: block; min-height: 18px; margin-top: 5px; color: #c5263b; font-size: 12px; }

.referral-lookup { display: grid; grid-template-columns: 48px minmax(0,1fr); gap: 14px; align-items: center; margin-top: 22px; padding: 17px 19px; border: 1px solid #a7decf; border-radius: 16px; background: #effbf7; }
.referral-lookup__icon { display: grid; width: 48px; height: 48px; place-items: center; border-radius: 50%; color: #fff; background: var(--referral-green); font-size: 22px; font-weight: 900; }
.referral-lookup span { display: block; color: #387264; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.referral-lookup strong { display: block; margin: 2px 0; color: #095f4b; font-size: 28px; letter-spacing: .13em; }
.referral-lookup p { margin: 0; color: #4c7269; font-size: 13px; }

.referral-consent { margin-top: 24px; padding: 18px; border: 1px solid var(--referral-border); border-radius: 17px; background: #f9fbfd; }
.referral-consent > div:first-child { display: flex; gap: 13px; align-items: center; }
.referral-consent__icon { display: grid; flex: 0 0 38px; height: 38px; place-items: center; border-radius: 50%; color: #fff; background: var(--referral-blue); font-weight: 900; }
.referral-consent strong { display: block; }
.referral-consent p { margin: 3px 0 0; color: var(--referral-muted); font-size: 13px; }
.referral-consent .referral-btn { margin-top: 14px; }
.referral-consent__state { margin-top: 13px; color: #8a6370; font-size: 13px; font-weight: 700; }
.referral-consent__state.is-accepted { color: var(--referral-green); }
.referral-consent__state span { display: inline-grid; width: 21px; height: 21px; margin-right: 5px; place-items: center; border-radius: 50%; border: 1px solid currentColor; }
.referral-alert { margin-top: 18px; padding: 14px 16px; border-radius: 13px; color: #8f1e2d; background: #fff0f2; font-size: 13px; }
.referral-alert[data-type="success"] { color: #0b6953; background: #ecfaf5; }
.referral-actions {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-top: 26px;
    padding-top: 24px;
    border-top: 1px solid var(--referral-border);
}
.referral-actions > * { min-width: 0; }
.referral-btn { display: inline-flex; min-height: 46px; align-items: center; justify-content: center; gap: 10px; padding: 0 18px; border: 0; border-radius: 12px; cursor: pointer; text-decoration: none; font: inherit; font-size: 13px; font-weight: 800; transition: transform .18s, filter .18s, opacity .18s; }
.referral-btn:hover { transform: translateY(-1px); }
.referral-btn:disabled { cursor: not-allowed; opacity: .5; transform: none; }
.referral-btn--primary { color: #fff; background: linear-gradient(135deg, #0b4fa3, #0d72bd); box-shadow: 0 12px 24px rgba(11,79,163,.22); }
.referral-btn--outline { color: var(--referral-blue); border: 1px solid #9fbfe3; background: #fff; }
.referral-btn--ghost { color: #52677f; background: #edf2f7; }
.referral-btn.is-loading span::after { content: "…"; }

.referral-modal, .referral-result-modal { position: fixed; z-index: 1200; inset: 0; display: grid; place-items: center; padding: 18px; }
.referral-modal[hidden], .referral-result-modal[hidden] { display: none !important; }
.referral-modal__backdrop { position: absolute; inset: 0; border: 0; background: rgba(3, 16, 35, .72); backdrop-filter: blur(8px); }
.referral-modal__dialog { position: relative; display: grid; width: min(900px, 100%); max-height: min(90vh, 920px); grid-template-rows: auto minmax(0,1fr) auto; overflow: hidden; border-radius: 22px; background: #fff; box-shadow: 0 40px 120px rgba(0,0,0,.35); }
.referral-modal__header { display: flex; justify-content: space-between; gap: 20px; align-items: start; padding: 22px 24px; color: #fff; background: linear-gradient(135deg, #071f45, #0b559e); }
.referral-modal__header span { color: #ffe08a; font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.referral-modal__header h2 { margin: 5px 0 0; font-size: 22px; }
.referral-modal__close { display: grid; flex: 0 0 38px; height: 38px; place-items: center; border: 1px solid rgba(255,255,255,.25); border-radius: 50%; color: #fff; background: rgba(255,255,255,.1); cursor: pointer; font-size: 24px; }
.referral-modal__content { overflow-y: auto; padding: 25px 28px 40px; scroll-behavior: smooth; }
.referral-modal__content section + section { margin-top: 26px; padding-top: 24px; border-top: 1px solid #e1e8ef; }
.referral-modal__content h3 { margin: 0 0 10px; color: #073b78; font-size: 20px; }
.referral-modal__content h4 { margin: 21px 0 8px; color: #1c385c; font-size: 16px; }
.referral-modal__content p, .referral-modal__content li { color: #4b5e74; font-size: 14px; line-height: 1.68; }
.referral-modal__content ul { margin: 8px 0 0; padding-left: 22px; }
.referral-modal__agreement { display: grid; grid-template-columns: 24px minmax(0,1fr); gap: 12px; padding: 17px; border: 1px solid #bdd5ee; border-radius: 15px; background: #f0f7ff; cursor: pointer; }
.referral-modal__agreement input { width: 20px; height: 20px; margin-top: 2px; accent-color: var(--referral-blue); }
.referral-modal__agreement span { color: #254768; font-size: 14px; font-weight: 650; line-height: 1.55; }
.referral-modal__footer { display: flex; justify-content: space-between; gap: 16px; align-items: center; padding: 16px 24px; border-top: 1px solid #dfe7ef; background: #f8fafc; }
.referral-modal__footer small { color: var(--referral-muted); }
body.referral-modal-open { overflow: hidden; }

.referral-result-modal__dialog { position: relative; width: min(460px, 100%); padding: 34px; border-radius: 24px; text-align: center; background: #fff; box-shadow: 0 40px 120px rgba(0,0,0,.35); }
.referral-result-modal__icon { display: grid; width: 68px; height: 68px; margin: 0 auto 18px; place-items: center; border-radius: 50%; color: #fff; background: var(--referral-green); font-size: 32px; font-weight: 900; }
.referral-result-modal__dialog h2 { margin: 8px 0; font-size: 28px; }
.referral-result-modal__dialog > strong { display: block; margin: 16px 0 12px; color: var(--referral-blue); font-size: 42px; letter-spacing: .18em; }
.referral-result-modal__dialog p { color: var(--referral-muted); line-height: 1.6; }
.referral-result-modal__dialog .referral-btn { width: 100%; margin-top: 12px; }

@media (max-width: 900px) {
    .referral-hero__grid, .referral-layout { grid-template-columns: 1fr; }
    .referral-hero__badge { justify-self: stretch; }
    .referral-summary { position: static; }
}
@media (max-width: 640px) {
    .referral-page .container { width: min(100% - 24px, 1160px); }
    .referral-hero { padding: 52px 0 48px; }
    .referral-hero__badge { grid-template-columns: 32px 1fr; }
    .referral-hero__badge i { display: none; }
    .referral-hero__badge span { width: 32px; height: 32px; }
    .referral-content { padding: 26px 0 72px; }
    .referral-summary, .referral-card { border-radius: 19px; }
    .referral-card { padding: 20px; }
    .referral-card__heading { display: block; }
    .referral-required { display: block; margin-top: 10px; }
    .referral-grid { grid-template-columns: 1fr; gap: 14px; }
    .referral-field--wide { grid-column: auto; }
    .referral-actions, .referral-modal__footer { align-items: stretch; flex-direction: column-reverse; }
    .referral-actions .referral-btn { width: 100%; }
    .referral-modal { padding: 8px; }
    .referral-modal__dialog { max-height: 96vh; border-radius: 16px; }
    .referral-modal__header, .referral-modal__content, .referral-modal__footer { padding-left: 17px; padding-right: 17px; }
    .referral-result-modal__dialog { padding: 26px 20px; }
}


/* v15.2.7: The global Admission footer is intentionally outside .referral-page.
   These rules preserve a clean boundary even when the theme applies adjacent margins. */
.referral-page + footer,
.referral-page + .admission-footer,
.referral-page + [data-admission-footer] {
    position: relative;
    z-index: 2;
    margin-top: 0;
    clear: both;
}

/* PPDB_REFERRAL_VISIBILITY_FIX_v16_0_2 */
.ppdb-referral-existing[hidden],
.ppdb-referral-alert[hidden],
.ppdb-referral-result[hidden],
.referral-existing[hidden],
.referral-alert[hidden],
.referral-result-modal[hidden],
[data-referral-lookup][hidden],
[data-referral-message][hidden],
[data-referral-result-modal][hidden] {
    display: none !important;
}
/* /PPDB_REFERRAL_VISIBILITY_FIX_v16_0_2 */

/* PPDB_REFERRAL_INITIAL_STATE_GUARD_v16_0_5 */
.referral-force-hidden,
.referral-force-hidden[hidden],
[data-referral-lookup].referral-force-hidden,
[data-referral-result-modal].referral-force-hidden,
[data-referral-lookup][hidden],
[data-referral-result-modal][hidden] {
    display: none !important;
}
/* /PPDB_REFERRAL_INITIAL_STATE_GUARD_v16_0_5 */

/* PPDB_REFERRAL_CANONICAL_FINAL_v16_2_3
 * The existing-referral card is hidden by default.
 * Only showExisting() may reveal it by adding .is-visible after a valid lookup.
 */
[data-referral-lookup][hidden],
[data-referral-lookup]:not(.is-visible) {
  display: none !important;
}
/* /PPDB_REFERRAL_CANONICAL_FINAL_v16_2_3 */

/* PPDB_REFERRAL_FAIL_CLOSED_FINAL_v16_2_4
 * Fail closed: the card remains hidden unless all three states are valid:
 * .is-visible, data-referral-found="1", and a non-empty validated code node.
 */
[data-referral-lookup],
[data-referral-lookup][hidden],
[data-referral-lookup]:not(.is-visible),
[data-referral-lookup][data-referral-found="0"] {
  display: none !important;
}

[data-referral-lookup].is-visible[data-referral-found="1"]:not([hidden]):has(
  [data-referral-existing-code][data-valid-referral-code="1"]:not(:empty)
) {
  display: grid !important;
}
/* /PPDB_REFERRAL_FAIL_CLOSED_FINAL_v16_2_4 */

/* PPDB_REFERRAL_AGREEMENT_FINAL_v16_2_5 */
.referral-agreement-card {
  margin: 22px 0 4px;
  padding: 18px;
  border: 1px solid #c9d9e9;
  border-radius: 18px;
  background: #f7fbff;
}

.referral-agreement-check {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  margin: 0;
  cursor: pointer;
}

.referral-agreement-check > input {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
}

.referral-agreement-box {
  position: relative;
  display: block;
  width: 22px;
  height: 22px;
  margin-top: 1px;
  border: 2px solid #8ea9c5;
  border-radius: 7px;
  background: #fff;
  transition: border-color .18s ease, background-color .18s ease, box-shadow .18s ease;
}

.referral-agreement-check > input:focus-visible + .referral-agreement-box {
  box-shadow: 0 0 0 4px rgba(16, 87, 155, .16);
}

.referral-agreement-check > input:checked + .referral-agreement-box {
  border-color: #178d78;
  background: #178d78;
}

.referral-agreement-check > input:checked + .referral-agreement-box::after {
  position: absolute;
  left: 6px;
  top: 2px;
  width: 6px;
  height: 11px;
  content: "";
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

.referral-agreement-copy {
  display: grid;
  gap: 4px;
  color: #17263b;
}

.referral-agreement-copy strong {
  font-size: 13px;
  line-height: 1.45;
}

.referral-agreement-copy small {
  color: #667a92;
  font-size: 11px;
  line-height: 1.55;
}

.referral-consent-state {
  margin: 10px 0 0 34px;
  color: #8b5d17;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.referral-consent-state.is-accepted {
  color: #147e6d;
}

.referral-agreement-card .referral-field-error:not(:empty) {
  margin: 10px 0 0 34px;
  color: #b42318;
  font-size: 11px;
  font-weight: 700;
}

@media (max-width: 640px) {
  .referral-agreement-card {
    padding: 15px;
    border-radius: 15px;
  }

  .referral-agreement-copy strong {
    font-size: 12px;
  }
}
/* /PPDB_REFERRAL_AGREEMENT_FINAL_v16_2_5 */

/* PPDB_REFERRAL_COMPLETE_FINAL_v16_3_3 */
.referral-lookup-slot[hidden],.referral-modal[hidden],.referral-result-modal[hidden]{display:none!important}
.referral-existing-card{display:grid;grid-template-columns:48px minmax(0,1fr);gap:14px;align-items:center;margin:22px 0;padding:17px 19px;border:1px solid #8edbc9;border-radius:17px;background:#edfdf8;color:#176e61}
.referral-existing-icon{display:grid;width:48px;height:48px;place-items:center;border-radius:50%;background:#168e78;color:#fff;font-size:27px;font-weight:800}
.referral-existing-copy{display:grid;gap:4px}.referral-existing-copy strong{font-size:12px;letter-spacing:.05em;text-transform:uppercase}.referral-existing-copy span{color:#51766f;font-size:11px;line-height:1.55}.referral-existing-number{margin-top:4px;color:#105c51;font-size:22px;letter-spacing:.12em}
.referral-agreement-launcher{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:center;margin:22px 0;padding:18px;border:1px solid #c9d9e9;border-radius:18px;background:#f7fbff}.referral-agreement-launcher>div:first-child{display:grid;gap:4px}.referral-agreement-kicker{color:#0d559f;font-size:9px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.referral-agreement-launcher strong{color:#17263b;font-size:13px}.referral-agreement-launcher small{color:#667a92;font-size:11px;line-height:1.5}
.referral-terms-open,.referral-button-primary,.referral-button-secondary{min-height:42px;padding:0 17px;border-radius:12px;font:inherit;font-size:11px;font-weight:800;cursor:pointer}.referral-terms-open,.referral-button-primary{border:1px solid #0d67b5;background:#0d67b5;color:#fff}.referral-button-primary:disabled{cursor:not-allowed;opacity:.52}.referral-button-secondary{border:1px solid #cbd8e5;background:#fff;color:#496079}.referral-consent-state{grid-column:1/-1;color:#8b5d17;font-size:10px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}.referral-consent-state.is-accepted{color:#147e6d}.referral-agreement-launcher .referral-field-error:not(:empty){grid-column:1/-1;margin:0;color:#b42318;font-size:11px;font-weight:700}
.referral-modal,.referral-result-modal{position:fixed;z-index:1200;inset:0;display:grid;place-items:center;padding:20px}.referral-modal-backdrop{position:absolute;inset:0;background:rgba(8,23,42,.68);backdrop-filter:blur(5px)}.referral-modal-panel{position:relative;z-index:1;width:min(720px,100%);max-height:min(86vh,780px);overflow:auto;border:1px solid rgba(255,255,255,.65);border-radius:22px;background:#fff;box-shadow:0 28px 80px rgba(10,38,70,.28)}.referral-modal-header{position:sticky;z-index:2;top:0;display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:20px 22px;border-bottom:1px solid #dbe5ef;background:#fff}.referral-modal-header span{color:#0d559f;font-size:9px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.referral-modal-header h2{margin:4px 0 0;color:#17263b;font-size:22px}.referral-modal-close{width:38px;height:38px;border:1px solid #d5e0eb;border-radius:12px;background:#f5f8fb;color:#41566f;font-size:24px;cursor:pointer}
.referral-terms-content,.referral-result-content{padding:22px;color:#42566f;font-size:12px;line-height:1.7}.referral-terms-content>p{margin-top:0}.referral-terms-content ol{display:grid;gap:10px;margin:16px 0;padding-left:22px}.referral-terms-check{display:grid;grid-template-columns:20px minmax(0,1fr);gap:10px;align-items:start;margin-top:20px;padding:15px;border:1px solid #b9d8d0;border-radius:14px;background:#f1fbf8;color:#1c6258;font-weight:700;cursor:pointer}.referral-terms-check input{width:18px;height:18px;margin:2px 0 0;accent-color:#168e78}.referral-modal-actions{position:sticky;bottom:0;display:flex;justify-content:flex-end;gap:10px;padding:16px 22px;border-top:1px solid #dbe5ef;background:#fff}.referral-result-panel{width:min(500px,100%)}.referral-result-content{display:grid;justify-items:center;gap:16px;text-align:center}.referral-result-code{padding:13px 20px;border:1px dashed #5ca896;border-radius:14px;background:#edfdf8;color:#126d5f;font-size:30px;letter-spacing:.15em}body.referral-modal-open{overflow:hidden}
@media(max-width:640px){.referral-agreement-launcher{grid-template-columns:1fr}.referral-terms-open{width:100%}.referral-modal,.referral-result-modal{align-items:end;padding:10px}.referral-modal-panel{width:100%;max-height:92vh;border-radius:20px 20px 12px 12px}.referral-modal-actions{display:grid;grid-template-columns:1fr}.referral-button-primary,.referral-button-secondary{width:100%}}
/* /PPDB_REFERRAL_COMPLETE_FINAL_v16_3_3 */