/* =========================================================================
   Alumni directory, profile, and check-in.

   The design bundle names its tokens --spot / --ink-2 / --rule-soft; the theme
   already ships an equivalent set under different names, and the theme's are the
   ones that flip in dark mode. So the first block maps one onto the other rather
   than declaring a second palette that would drift out of sync.

   No border-radius, no shadows, no gradients anywhere in here — structure comes
   from rules, exactly like the rest of the site.
   ========================================================================= */

.boz-alumni {
  --spot:       var(--red);
  --ink-2:      var(--ink-soft);
  --line:       var(--ink-line);
  --line-soft:  color-mix(in srgb, var(--ink) 18%, transparent);
  --surface:    var(--paper-sunk);
  --field:      var(--paper);

  padding-block: 3.5rem 4.5rem;
}

.boz-alumni :is(h1, h2, h3) { font-family: var(--font-display); text-transform: uppercase; letter-spacing: -.02em; }
.boz-alumni a { color: inherit; }

/* ---- Breadcrumbs, eyebrows, deck --------------------------------------- */

.boz-crumbs {
  font-family: var(--font-mono);
  font-size: .75rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink-2);
  display: flex;
  flex-wrap: wrap;
  gap: .5em;
  margin-bottom: 1.5rem;
}
.boz-crumbs a { text-decoration: none; }
.boz-crumbs a:hover { color: var(--spot); }
.boz-crumbs__here { color: var(--spot); }

.boz-eyebrow {
  font-family: var(--font-mono);
  font-size: .75rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink-2);
  margin: 0 0 .75rem;
}
.boz-eyebrow--spot { color: var(--spot); }

.boz-alumni__h1 {
  font-size: clamp(2.625rem, 7vw, 4.75rem);
  line-height: .92;
  margin: 0 0 1rem;
}

.boz-deck {
  font-size: clamp(1.0625rem, 2.2vw, 1.3125rem);
  line-height: 1.45;
  color: var(--ink-2);
  max-width: var(--measure);
  text-wrap: pretty;
  margin: 0 0 2.75rem;
}

.boz-h2 { font-size: clamp(1.5rem, 3vw, 1.875rem); margin: 0 0 .5rem; }

/* ---- Buttons ------------------------------------------------------------ */

.boz-btn {
  display: inline-block;
  border-radius: 0;
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 1.0625rem;
  line-height: 1.2;
  padding: .875rem 1.625rem;
  text-decoration: none;
  border: 1px solid transparent;
  cursor: pointer;
  transition: background-color .12s linear, color .12s linear;
}
.boz-btn--spot  { background: var(--spot); color: #fff; }
.boz-btn--spot:hover  { background: var(--ink); color: var(--paper); }
.boz-btn--line  { border-color: var(--line); background: transparent; color: var(--ink); }
.boz-btn--line:hover  { background: var(--ink); color: var(--paper); }
.boz-btn--soft  { border-color: var(--line-soft); background: transparent; color: var(--ink); }
.boz-btn--soft:hover  { background: var(--ink); color: var(--paper); }
.boz-btn--big   { font-size: 1.25rem; padding: 1.125rem 2.25rem; }

.boz-alumni :is(a, button, input, select):focus-visible {
  outline: 3px solid var(--spot);
  outline-offset: 2px;
}
.boz-btn--spot:focus-visible { outline-color: var(--ink); outline-offset: 3px; }

/* ---- Selling block ------------------------------------------------------ */

.boz-sell {
  border: 2px solid var(--line);
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 3rem;
  align-items: center;
  padding: 1.875rem 2.125rem;
  margin: 0 0 2.75rem;
}
/* Heavier top rule on the profile: it separates an ad from a record. */
.boz-sell--heavy { border-top-width: 6px; margin-top: 3rem; }

.boz-sell__eyebrow {
  font-family: var(--font-mono);
  font-size: .75rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ink-2);
  margin: 0 0 .5rem;
}
.boz-sell__eyebrow--open { color: var(--spot); }
.boz-sell__eyebrow span { color: var(--spot); }

.boz-sell__head { font-size: clamp(1.5rem, 3.2vw, 2rem); line-height: 1.05; margin: 0 0 .625rem; }
.boz-sell__body { font-size: 1rem; line-height: 1.5; color: var(--ink-2); max-width: 56ch; margin: 0; }

.boz-sell__cta { display: flex; flex-direction: column; gap: .625rem; align-items: stretch; }
.boz-sell__cta .boz-btn { text-align: center; white-space: nowrap; }

.boz-count { display: flex; gap: .5rem; margin-bottom: .25rem; }
.boz-count__box {
  border: 1px solid var(--line-soft);
  padding: .5rem .75rem;
  min-width: 56px;
  text-align: center;
  font-family: var(--font-mono);
}
.boz-count__num { display: block; font-size: 1.625rem; line-height: 1; }
.boz-count__lab { display: block; font-size: .625rem; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-2); margin-top: .25rem; }

/* ---- Directory: search, counts, rail ------------------------------------ */

.boz-search { margin: 0 0 1.75rem; }
.boz-search__label {
  display: block;
  font-family: var(--font-mono);
  font-size: .75rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink-2);
  margin-bottom: .5rem;
}
.boz-search__row { display: flex; border: 2px solid var(--line); max-width: var(--measure); }
.boz-search__row.is-active { border-color: var(--spot); }
.boz-search__row input {
  flex: 1;
  font: inherit;
  font-size: 1.125rem;
  padding: .875rem 1rem;
  border: 0;
  border-radius: 0;
  background: var(--field);
  color: var(--ink);
  min-width: 0;
}
.boz-search__row input:focus { background: var(--surface); outline: none; }
.boz-search__row button {
  border: 0;
  border-left: 2px solid var(--line);
  border-radius: 0;
  background: var(--ink);
  color: var(--paper);
  font: inherit;
  font-weight: 700;
  padding: 0 1.5rem;
  cursor: pointer;
}
.boz-search__row button:hover { background: var(--spot); color: #fff; }

.boz-countrow {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: baseline;
  justify-content: space-between;
  border-bottom: 2px solid var(--line);
  padding-bottom: .625rem;
  margin-bottom: .25rem;
}
.boz-countrow__count { font-family: var(--font-mono); font-size: .875rem; color: var(--ink-2); margin: 0; }
.boz-countrow__count .num { font-size: 1.25rem; color: var(--ink); }

.boz-rail { display: flex; flex-wrap: wrap; gap: .5rem; font-family: var(--font-mono); font-size: .8125rem; }
.boz-rail a { color: var(--ink-2); text-decoration: none; }
.boz-rail a:hover { color: var(--spot); }
.boz-rail a.is-active { color: var(--spot); font-weight: 700; }

/* ---- Directory: the names ----------------------------------------------- */

.boz-names { list-style: none; margin: 0 0 2rem; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 3rem; }
.boz-names li { border-bottom: 1px solid var(--line-soft); }
.boz-names a { display: flex; justify-content: space-between; gap: 1rem; align-items: baseline; padding: .6875rem 0; font-size: 1.125rem; text-decoration: none; }
.boz-names a:hover { color: var(--spot); }
.boz-names mark { background: var(--spot); color: #fff; padding: 0 .1em; }

/* Launch day: fewer names, bigger type, so a short list reads as a start
   rather than as a page that failed to load. */
.boz-names--sparse { grid-template-columns: repeat(2, 1fr); gap: 0 4rem; }
.boz-names--sparse a { padding: 1.125rem 0; }
.boz-names--sparse .boz-names__name { font-family: var(--font-display); text-transform: uppercase; font-size: 1.625rem; line-height: 1.05; }
.boz-names__meta { font-family: var(--font-mono); font-size: .8125rem; color: var(--ink-2); white-space: nowrap; }

/* ---- Pagination ---------------------------------------------------------- */

.boz-pager {
  border-top: 2px solid var(--line);
  padding-top: .875rem;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: center;
  justify-content: space-between;
}
.boz-pager__of { font-family: var(--font-mono); font-size: .8125rem; color: var(--ink-2); margin: 0; }
.boz-pager__links { display: flex; flex-wrap: wrap; gap: .375rem; font-family: var(--font-mono); font-size: .8125rem; }
.boz-pager__links :is(a, span) { padding: .5rem .75rem; border: 1px solid var(--line-soft); text-decoration: none; }
.boz-pager__links a:hover { border-color: var(--line); color: var(--spot); }
.boz-pager__links .is-current { background: var(--spot); color: #fff; border-color: var(--spot); }
.boz-pager__links .is-disabled { color: var(--ink-2); opacity: .5; }
.boz-pager__links .is-next { font-weight: 700; border-color: var(--line); }

/* ---- Empty states -------------------------------------------------------- */

.boz-empty { border-top: 2px solid var(--line); padding-top: 1.75rem; max-width: var(--measure); }
.boz-empty h2 { font-size: clamp(1.5rem, 3.4vw, 2.125rem); margin: 0 0 .75rem; text-transform: none; }
.boz-empty p { font-size: 1.125rem; color: var(--ink-2); line-height: 1.5; }
.boz-empty__cta { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.25rem; }

/* ---- Profile: identity --------------------------------------------------- */

.boz-ident {
  display: grid;
  grid-template-columns: minmax(0, var(--measure)) auto;
  gap: 3.5rem;
  align-items: end;
  border-bottom: 3px solid var(--line);
  padding-bottom: 2rem;
  margin-bottom: 2.75rem;
}
.boz-ident__name { font-size: clamp(2.625rem, 7.5vw, 5rem); line-height: .92; letter-spacing: -.025em; margin: 0 0 .75rem; }
.boz-ident__meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: 1rem; margin: 0; }
.boz-ident__li { font-size: 1.0625rem; font-weight: 600; text-decoration: none; border-bottom: 2px solid var(--spot); }
.boz-ident__li:hover { color: var(--spot); }
.boz-ident__stats { font-family: var(--font-mono); font-size: .875rem; color: var(--ink-2); }

.boz-addli {
  display: block;
  background: var(--spot);
  color: #fff;
  text-decoration: none;
  padding: 1rem 1.625rem;
  min-width: 260px;
  text-align: center;
}
.boz-addli:hover { background: var(--ink); color: var(--paper); }
.boz-addli:focus-visible { outline: 3px solid var(--ink); outline-offset: 3px; }
.boz-addli__main { display: block; font-weight: 700; font-size: 1.0625rem; }
.boz-addli__sub { display: block; font-family: var(--font-mono); font-size: .6875rem; letter-spacing: .1em; text-transform: uppercase; opacity: .85; margin-top: .25rem; }

/* ---- Profile: attendance + credibility rail ------------------------------ */

.boz-profile__grid { display: grid; grid-template-columns: minmax(0, var(--measure)) 260px; gap: 3.5rem; align-items: start; }
.boz-profile__explain { font-size: 1.0625rem; color: var(--ink-2); line-height: 1.5; margin: 0 0 2.25rem; max-width: var(--measure); }

.boz-class { border-top: 2px solid var(--line); padding-top: 1.25rem; margin-bottom: 2.25rem; }
.boz-class__head { display: flex; flex-wrap: wrap; gap: .75rem; align-items: baseline; justify-content: space-between; }
.boz-class__title { font-size: 1.5rem; margin: 0; }
.boz-class__title a { text-decoration: none; border-bottom: 3px solid var(--spot); }
.boz-class__title a:hover { color: var(--spot); }
.boz-class__count { font-family: var(--font-mono); font-size: .8125rem; color: var(--ink-2); margin: 0; }

.boz-days { list-style: none; margin: .875rem 0 0; padding: 0; }
.boz-days li { display: flex; gap: 1.25rem; align-items: baseline; padding: .5625rem 0; border-bottom: 1px solid var(--line-soft); font-family: var(--font-mono); font-size: .9375rem; }
.boz-days__tick { color: var(--spot); }
.boz-days__date { min-width: 140px; }
.boz-days__label { color: var(--ink-2); }

.boz-cred { border: 1px solid var(--line-soft); padding: 1.375rem; position: sticky; top: 1.5rem; }
.boz-cred__h { font-family: var(--font-mono); font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; color: var(--spot); margin: 0 0 .5rem; }
.boz-cred__h--muted { color: var(--ink-2); border-top: 1px solid var(--line-soft); padding-top: 1rem; margin-top: 1rem; }
.boz-cred p { font-size: .9375rem; line-height: 1.45; margin: 0; }
.boz-cred__foot { font-family: var(--font-mono); font-size: .75rem; color: var(--ink-2); border-top: 1px solid var(--line-soft); padding-top: 1rem; margin-top: 1rem; line-height: 1.5; }

/* ---- Check-in form ------------------------------------------------------- */

.boz-form { max-width: 34rem; }
.boz-field { display: block; margin: 0 0 1.5rem; }
.boz-field label {
  display: block;
  font-family: var(--font-mono);
  font-size: .75rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink-2);
  margin-bottom: .5rem;
}
.boz-field__opt { color: var(--ink-2); opacity: .7; }
.boz-field input {
  display: block;
  width: 100%;
  font: inherit;
  font-size: 1.25rem;
  padding: .875rem 1rem;
  border: 2px solid var(--line);
  border-radius: 0;
  background: var(--field);
  color: var(--ink);
}
.boz-field input:focus { background: var(--surface); }
.boz-field__hint { display: block; font-size: .875rem; color: var(--ink-2); margin-top: .5rem; line-height: 1.4; }

.boz-form__submit { display: flex; flex-wrap: wrap; gap: 1.25rem; align-items: center; border-top: 2px solid var(--line); padding-top: 1.5rem; }
.boz-form__notice { flex: 1 1 18rem; font-size: .875rem; color: var(--ink-2); line-height: 1.45; margin: 0; }

.boz-alert { border: 2px solid var(--spot); border-left-width: 6px; padding: .875rem 1rem; font-size: 1rem; max-width: 34rem; margin: 0 0 1.75rem; }
.boz-attend__actions { display: flex; flex-wrap: wrap; gap: .75rem; margin: 0 0 1.5rem; }
.boz-attend__nudge { font-size: .9375rem; color: var(--ink-2); max-width: var(--measure); }

/* ---- Responsive ---------------------------------------------------------- */

@media (max-width: 1000px) {
  .boz-names { grid-template-columns: repeat(2, 1fr); gap: 0 2rem; }
  .boz-profile__grid { grid-template-columns: 1fr; gap: 2.5rem; }
  .boz-cred { position: static; }
  .boz-ident { grid-template-columns: 1fr; gap: 1.75rem; align-items: start; }
  .boz-addli { min-width: 0; width: 100%; }
}

@media (max-width: 700px) {
  .boz-alumni { padding-block: 1.75rem 2.25rem; }
  .boz-names, .boz-names--sparse { grid-template-columns: 1fr; gap: 0; }
  .boz-names a { padding: .9375rem 0; min-height: 48px; }
  .boz-sell { grid-template-columns: 1fr; gap: 1.5rem; padding: 1.5rem 1.25rem; }
  .boz-count { justify-content: space-between; }
  .boz-count__box { flex: 1; }
  .boz-pager { flex-direction: column; align-items: stretch; }
  .boz-pager__links { justify-content: space-between; }
  .boz-pager__links :is(a, span) { min-height: 48px; display: flex; align-items: center; }
  .boz-days li { flex-wrap: wrap; gap: .5rem 1rem; }
  .boz-days__date { min-width: 0; }
  .boz-form__submit { flex-direction: column; align-items: stretch; }
  .boz-btn { min-height: 48px; display: flex; align-items: center; justify-content: center; }
}
