/* Seminarian application: 6-stage checklist (Oyster/Vanta-style) */
.stages{background:var(--paper)}
.stages .head{max-width:720px;margin-bottom:32px}
.stages .head h2 em{font-style:italic;color:var(--gold-ink)}

/* Welcome / progress banner */
.stage-banner{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px 32px;align-items:center;background:var(--teal);color:var(--white);border-radius:var(--r);padding:24px 28px;margin-bottom:24px}
.stage-banner h3{color:var(--white);font:500 1.45rem/1.25 var(--f-display);margin:0 0 4px}
.stage-banner p{margin:0;color:#D5E1E8;font-size:.95rem}
.stage-banner .aid{font:600 .78rem/1 var(--f-label);letter-spacing:.08em;text-transform:uppercase;color:var(--gold)}
.stage-progress{grid-column:1/-1;display:flex;align-items:center;gap:14px}
.stage-progress .bar{flex:1;height:8px;background:rgba(255,255,255,.18);border-radius:99px;overflow:hidden}
.stage-progress .bar span{display:block;height:100%;width:0;background:var(--gold);border-radius:99px;transition:width .4s ease}
.stage-progress output{font:600 .82rem/1 var(--f-label);letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.stage-banner .btn{white-space:nowrap}
.stage-banner[data-state="new"] .stage-progress{display:none}

/* Stage cards */
.stage-list{list-style:none;margin:0;padding:0;display:grid;gap:12px;counter-reset:stage}
.stage{display:grid;grid-template-columns:52px minmax(0,1fr) auto;gap:8px 22px;align-items:start;background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:24px;transition:border-color .2s,box-shadow .2s}
.stage.is-next{border-color:var(--gold);box-shadow:0 0 0 3px rgba(210,154,82,.18)}
.stage.is-done{background:#F3F7F5}
.stage-num{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;border:1.5px solid var(--line);font:600 1.1rem/1 var(--f-display);color:var(--gold-ink);background:var(--white)}
.stage.is-done .stage-num{background:var(--steel);border-color:var(--steel);color:transparent;position:relative}
.stage.is-done .stage-num::after{content:"";position:absolute;width:11px;height:6px;border-left:2.5px solid #fff;border-bottom:2.5px solid #fff;transform:translateY(-2px) rotate(-45deg)}
.stage-body h3{font-size:1.3rem;margin:0 0 4px;display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}
.stage-meta{font:600 .74rem/1 var(--f-label);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.stage-body p{font-size:.95rem;line-height:1.6;color:var(--muted);margin:6px 0 0}
.stage-includes{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 0;padding:0}
.stage-includes li{font-size:.78rem;line-height:1;padding:6px 10px;border-radius:99px;background:var(--mist);color:var(--teal-2)}
.stage-note{font-size:.86rem!important}
.stage-note a{color:var(--steel);text-decoration:underline;text-underline-offset:2px}
.pill{font:600 .68rem/1 var(--f-label);letter-spacing:.08em;text-transform:uppercase;padding:5px 9px;border-radius:99px;background:var(--mist);color:var(--muted)}
.is-next .pill{background:#F6E8D4;color:var(--gold-ink)}
.is-started .pill{background:#E1EDF3;color:var(--steel)}
.is-done .pill{background:#DCEBE3;color:#2F6B4F}
.stage-actions{display:flex;flex-direction:column;align-items:stretch;gap:10px;min-width:190px}
.stage-actions .btn{justify-content:center;white-space:nowrap}
.stage-done{display:flex;align-items:center;gap:8px;font-size:.85rem;color:var(--muted);cursor:pointer;user-select:none}
.stage-done input{width:18px;height:18px;accent-color:var(--steel);margin:0}

/* Handled-for-you row */
.handled{margin-top:28px;border:1px dashed var(--line);border-radius:var(--r);padding:24px 28px;background:var(--white)}
.handled h3{font-size:1.15rem;margin:0 0 6px}
.handled>p{color:var(--muted);font-size:.95rem;margin:0 0 16px}
.handled ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.handled li{padding:14px 16px;background:var(--paper);border-radius:var(--r);font-size:.9rem;line-height:1.5;color:var(--muted)}
.handled li strong{display:block;color:var(--ink);font-size:.98rem;margin-bottom:2px}

.stage-help{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;justify-content:space-between;margin-top:28px;font-size:.92rem;color:var(--muted)}
.stage-help a{color:var(--steel)}
.stage-reset{background:none;border:0;padding:0;font:inherit;font-size:.85rem;color:var(--muted);text-decoration:underline;cursor:pointer}

@media(max-width:860px){
  .stage{grid-template-columns:40px minmax(0,1fr);padding:20px}
  .stage-num{width:34px;height:34px;font-size:1rem}
  .stage-actions{grid-column:1/-1;flex-direction:row;flex-wrap:wrap;align-items:center;min-width:0}
  .stage-actions .btn{flex:1 1 auto}
  .handled ul{grid-template-columns:1fr}
  .stage-banner{grid-template-columns:1fr;padding:22px}
}

/* Secondary button: the site's .btn-ghost is built for dark backgrounds */
.stage-actions .btn-ghost{background:var(--white);color:var(--teal);border:1.5px solid var(--teal);box-shadow:none}
.stage-actions .btn-ghost:hover,.stage-actions .btn-ghost:focus-visible{background:var(--teal);color:var(--white)}
.stage.is-done .stage-actions .btn-ghost{border-color:var(--line);color:var(--muted)}

/* The site's stacking-card effect makes list items sticky; a checklist must scroll normally */
.stages .stage-list>.stage{position:relative;top:auto}

/* Printable / online copies of the forms sent to references and doctors */
.handled .handled-paper{margin:-6px 0 16px;font-size:.92rem;color:var(--muted)}
.handled .handled-paper strong{color:var(--ink)}
.handled li{display:flex;flex-direction:column}
.handled .dl{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:auto;padding-top:12px}
.handled .dl a{font:600 .74rem/1 var(--f-label);letter-spacing:.08em;text-transform:uppercase;color:var(--steel);text-decoration:none;border-bottom:1.5px solid currentColor;padding-bottom:3px}
.handled .dl a:hover,.handled .dl a:focus-visible{color:var(--teal)}

/* Downloadable documents inside a step card */
.stage-docs{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.stage-docs a{font-size:.8rem;line-height:1;padding:8px 11px;border:1px solid var(--line);border-radius:var(--r);color:var(--teal);text-decoration:none;background:var(--white)}
.stage-docs a:hover,.stage-docs a:focus-visible{border-color:var(--teal);background:var(--mist)}