*{ font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial; }
h1,h2,h3,.crest-word{ font-family:"Crimson Text", Georgia, "Times New Roman", serif; }

/* ===== HERO ===== */
.hero{
  color:#fff; padding:96px 0 72px; position:relative;
  background:
    linear-gradient(180deg, rgba(15,31,61,.95), rgba(15,31,61,.85)),
    url('/assets/img/campus-banner.jpg') center/cover no-repeat;
  border-bottom:4px solid #caa95a;
}
.hero .crest-badge{
  display:flex; align-items:center; gap:.8rem; margin-bottom:14px;
}
.crest-shield{
  width:60px; height:60px; border-radius:14px; display:grid; place-items:center;
  background:linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.10));
  border:2px solid rgba(255,255,255,.55);
  box-shadow:0 8px 24px rgba(0,0,0,.2);
  backdrop-filter: blur(6px);
}
.crest-shield span{ font-weight:900; letter-spacing:1px; font-size:1.1rem; }
.ribbon{
  display:inline-flex; align-items:center; gap:.6rem; margin-top:12px;
  padding:.35rem .75rem; border-radius:999px; font-weight:700;
  background:linear-gradient(180deg, rgba(202,169,90,.22), rgba(202,169,90,.15));
  border:1px solid rgba(202,169,90,.55);
  color:#fff; margin-bottom: -5px;
/*margin-bottom: 30px;*/
}
.hero h1{ font-weight:900; letter-spacing:.2px; color: #fff;}
.hero .sub{color: #fff;}
input[type=text], input[type=password], input[type=email], input[type=number], input[type=tel], textarea{
      border: 1px solid #e5e7eb;
      height: 40px;
      border-radius: 4px;
      font-size: 15px;
      background: #fbfdff;
}
.input-group .input-group-text{
  font-size: 14px;
    padding: 8px 10px;
    height: 40px;
}
/* ===== LAYOUT ===== */
.app-wrap{ margin-top:0; }
@media (min-width:992px){ .pull-up-lg{ margin-top:-56px; } } /* only left column pulls up */
.app-card{
  background:#ffffff;
  border:1px solid #e5e7eb;
  border-radius:22px;
  box-shadow:0 18px 50px rgba(15, 23, 42, .10);;
  overflow:hidden;
  position:relative;
}
/* watermark crest inside card */
.app-card:after{
  content:"HU"; position:absolute; right:24px; bottom:10px; font-size:58px; font-weight:900;
  font-family:"Crimson Text", Georgia, serif; color:#0f1f3d10; pointer-events:none;
}
.card-header{
  background:linear-gradient(180deg,#fbfdff,#fff);
  border-bottom:1px solid #e5e7eb;
}
.card-header h2{margin-bottom: 15px;}
input[type=checkbox] ~ label::before, input[type=radio] ~ label::before{display: none;}

/* spine accent on each section group */
.section-block{ position:relative; padding-left:18px; }
.section-block:before{
  content:""; position:absolute; left:0; top:.35rem; bottom:.35rem; width:2px;
  background:linear-gradient(180deg, #dabb6d, #b8903c);
  border-radius:4px;
}

.req-badge{
      background: rgba(202, 169, 90, .14);
    color: #7c632e;
    border: 1px solid rgba(202, 169, 90, .35);
    font-weight: 700;
    font-size: 12px;
    padding: 4px 14px;
    border-radius: 999px;
}
.opt-badge{
  background:#f3f4f7; color:#5b6471; border:1px solid #e5e7eb;
  font-weight:700; font-weight: 700;
    font-size: 12px;
    padding: 4px 14px; border-radius:999px;
}

.section-title{
  display:flex; align-items:center; gap:.6rem; margin:1.15rem 0 .55rem; color:var(--hu-navy);
}
.section-title i{ color:#12356a; }
.section-caption{ color:var(--hu-muted); margin-top:-.25rem; margin-bottom:.85rem; }

/* Inputs (calm, no hover effects) */
.form-control,.form-select{ border:1px solid #e5e7eb; border-radius:5px; background:#fbfdff; height: 40px; font-size: 15px;}
.form-control:focus,.form-select:focus{ border-color:#12356a; box-shadow:0 0 0 .22rem rgba(18,53,106,.17); }
.form-control:hover,.form-select:hover{ border-color:#e5e7eb; box-shadow:none; }
/* hide number spinners */
input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
input[type=number]{ -moz-appearance:textfield; }
textarea.form-control{height: 60px; resize: none;}
.text-muted{font-size: 15px;}
/* Pill radios */
.pill-group .btn{
  border-radius:999px; border:1px solid #e5e7eb; background:#fff; color:var(--hu-ink);
  padding:.45rem .9rem; font-weight:600;
}
.pill-group .btn:hover{ border-color:#e5e7eb; }
.pill-group .btn-check:checked + .btn{
  border-color:#12356a; background:linear-gradient(180deg,#eef3ff,#eaf0ff); color:#12356a;
  box-shadow:0 0 0 .2rem rgba(18,53,106,.16);
}

/* Dropzone */
.dropzone{
  border:1.5px dashed #cdd6e1; border-radius:8px; padding:6px;
  background:#fbfdff; cursor:pointer; transition:border-color .2s, background .2s;
}
.dropzone:hover{ background:#fbfdff; } /* no hover tint */
.dropzone.dragover{ border-color:#12356a; background:#eef2ff; }

/* Sidebar progress — bookmark rail */
.sticky-col{
  position: -webkit-sticky; /* Safari fix */
  position: sticky;
  top: 24px; /* distance from top (adjust as needed) */
  align-self: flex-start; /* required when inside .row (flex) */
  z-index: 2;
}
input[type=checkbox] ~ label::after, input[type=radio] ~ label::after{
  display: none;
}
.btn-group>.btn-group:not(:first-child), .btn-group>.btn:not(:first-child){
  font-size: 15px;
}
/* ===== Sticky Sidebar Base ===== */
.sticky-col {
  position: -webkit-sticky;
  position: sticky;
  top: 24px;
  align-self: flex-start; /* ensures proper sticky behavior in Bootstrap rows */
  z-index: 5;
  transition: all 0.2s ease;
}

/* when JS adds "is-fixed" */
.sticky-col.is-fixed {
  position: fixed !important;
  top: 24px;
  width: 350px; /* adjust to match your sidebar width */
  z-index: 99;
}

@media (max-width: 991.98px) {
  .sticky-col {
    position: static !important;
  }
}

.rail{
  background:rgba(255,255,255,.7);
  backdrop-filter: blur(10px) saturate(130%);
  border:1px solid rgba(229,231,235,.85);
  border-radius:22px;
  box-shadow:0 18px 50px rgba(15, 23, 42, .10);;
}
.step{ display:flex; align-items:center; gap:.8rem; padding:.7rem .7rem; border-radius:12px; }
.step .bullet{
  width:28px; height:28px; border-radius:50%; display:grid; place-items:center;
  border:2px solid #e5e7eb; color:var(--hu-muted); background:#fff; font-weight:700; font-size:14px;
}
.step.active{ background:#f2f5ff; }
.step.active .bullet{ border-color:#12356a; background: #12356a; color:#fff; }
.step.done .bullet{ background:#12356a; border-color:#12356a; color:#fff; }

/* Submit bar */
.submit-bar{
  border-top:1px solid #e5e7eb; background:#fff; padding:16px; position:sticky; bottom:-1px;
  display:flex; gap:12px; justify-content:flex-end;
}
.btn-primary{
  background:linear-gradient(180deg,#1e4b96,#143b76);
  border:1px solid #143b76; border-radius:12px; font-weight:700;
  box-shadow:0 10px 24px rgba(20,59,118,.25); color:#fff;
  font-size: 15px;
    font-weight: 700;
    padding: 8px 20px;
    width: auto;
}
.btn-primary:hover{ filter:none; transform:translateY(-1px); }
.btn-outline-secondary{border-radius: 12px;
    font-size: 15px;
    font-weight: 600;
    padding: 8px 20px;
    width: auto;

}

/* Choices.js */
.choices__inner{ border-radius:12px; border:1px solid #fbfdff; padding:.65rem .9rem; background: #fbfdff}
.is-focused .choices__inner,.is-open .choices__inner{ border-color:#12356a; box-shadow:0 0 0 .22rem rgba(18,53,106,.17); }
.choices__list--dropdown{ border-color:#e5e7eb; }
.choices__item--selectable.is-highlighted{ background:#eef2ff; color:var(--hu-ink); }
.choices__heading{ color:#12356a; font-weight:700; }
.choices__inner{background: #fbfdff !important;}
.choices__heading{font-size: 15px!important;}
/* Intro callout */
.callout{
  background:linear-gradient(180deg,#ffffff,#fbfdff);
  border:1px solid #e5e7eb;
  border-radius:14px; padding:16px;
}
.callout .icon{
  width:42px;height:42px;border-radius:10px;display:grid;place-items:center;
  background:linear-gradient(180deg,#e9f0ff,#eaf6ff); color:#12356a; border:1px solid #dbe7ff;
  margin-right:.85rem;
}
.callout p{ margin-bottom:.65rem; color:#314155; }
@media (max-width: 768px) {
.hidden-xs{
  display: none;
}
.btn-primary{
  font-size: 12px;
}
.btn-outline-secondary{font-size: 12px;}
input[type=checkbox] ~ label::before, input[type=radio] ~ label::before{
  display: none;
}
.pill-group .btn-check:checked + .btn{font-size: 12px;}
.btn-group>.btn-group:not(:first-child), .btn-group>.btn:not(:first-child) {
    font-size: 14px;
}
.section-caption{font-size: 12px;}
.form-label {
    margin-bottom: .5rem;
    font-size: 13px;
}
.section-title{ font-size: 13px;}
.card-header:first-child {
    display: block !important;
}
.text-muted{margin-top: 10px;}
.callout p{font-size: 14px;}
.app-card{top: -80px;}
}