/* ── Moved from styles.css (30 September 2026) ─────────────────────────
   Rules used only on /, split out by tools/split-css.py so
   other pages stop downloading them. They come first so that anything
   this page sheet already said still follows them, as it did before. */
.hero-text-col { width: 100%; }
@media (max-width: 1100px) {
  .houses-grid { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 768px) {
  .hc-item + .hc-item::before { display: none; }
}
@media (max-width: 480px) {
  .houses-grid { grid-template-columns: 1fr; }
}
@media (max-height: 940px) {
  .hero-crest { width: clamp(110px, 12vw, 150px); margin-bottom: 14px; }
  .hero-counters-wrap { margin-top: 38px; }
  .hero-counters { padding-top: 20px; }
  .hc-num { font-size: 1.9rem; }
}
@media (max-height: 800px) {
  .hero-crest { width: 96px; margin-bottom: 12px; }
  .hero-counters-wrap { margin-top: 28px; }
  .hc-item { padding: 6px 28px; }
  .hc-label { font-size: .75rem; }
}
.h4c-motto { font-family: "Georgia", "Times New Roman", serif; font-size: 1.7rem; font-style: italic; font-weight: 700; letter-spacing: .05em; text-align: center; margin-top: 12px; text-shadow: 0 1px 4px rgba(0,0,0,.18); color: var(--h4-ink, var(--gold)); }
@media (hover: none) {
  .h4c-color-tag { color: var(--h4-ink, var(--gold)); }
}
@media (max-width: 960px) {
  .about-strip-inner { grid-template-columns: 1fr; }
  .qn-grid { grid-template-columns: repeat(2,1fr); }
  .adm-cta-inner { flex-direction: column; }
}
@media (max-width: 768px) {
  .qn-grid { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .as-stats { grid-template-columns: 1fr 1fr; }
}
.nt-label {
  flex-shrink: 0; padding: 13px 20px;
  color: var(--gold);
  font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  font-size: .75rem; white-space: nowrap;
  border-right: 1px solid rgba(255,255,255,.1);
}
.nt-item:hover { color: var(--gold); }
.nt-sep { color: rgba(255,207,1,.55); font-size: .75rem; flex-shrink: 0; }
.nt-all:hover { color: #fff; }
@supports (animation-timeline: scroll()) {
  @media (prefers-reduced-motion: no-preference) {
    .hero-video-wrap {
      will-change: transform;
      backface-visibility: hidden;
      animation: sdHeroZoom linear both;
      animation-timeline: scroll();
      animation-range: 0 100svh;
      animation-range: 0 min(100svh, 1000px);
    }
  }
}
.now-sep { color: rgba(255,255,255,.3); }
.now-next { color: var(--gold-lt, #ffe066); }
@media (min-width: 900px) {
  .qn-grid {
    grid-template-columns: repeat(3, 1fr);
    grid-auto-rows: 1fr;          /* every row exactly the same height */
    gap: 20px;                    /* equal spacing horizontally & vertically */
  }
}
@media (max-width: 640px) {
  .now-inner { flex-direction: column; gap: 4px; padding: 12px 20px; text-align: center; }
}
.hero-video-wrap { z-index: 0; }
.hero-overlay { z-index: 1; }
@media (max-width: 680px) {
  .hero-crest { width: 72px; margin-bottom: 10px; }
  .hero-cta { gap: 10px; }
  .hero-counters-wrap { margin-top: 20px; }
  .hero-counters { gap: 0; }
  .hc-item { padding: 8px 14px; }
  .hc-num { font-size: 1.5rem; }
  .hc-label { font-size: .75rem; }
}
.adm-notice-close:hover { background: rgba(255, 255, 255, .24); }
.adm-notice-crest {
  width: 148px; height: 148px; object-fit: contain;
  /* margin-inline, not the parent's text-align. The base reset near the
     top of this file sets `img { display: block }`, and text-align has no
     effect on a block — so the crest sat hard left inside a masthead that
     was centring everything else. The second time this stylesheet's
     globals have quietly beaten an inherited centre; the title above was
     the first. */
  margin-inline: auto;
  filter: drop-shadow(0 6px 18px rgba(0, 0, 0, .4));
}
.adm-notice-rule {
  width: 54px; height: 2px; margin: 16px auto; border: 0;
  background: var(--gold); opacity: .9;
}
.adm-notice-title span { color: var(--gold); }
.adm-notice-body { padding: clamp(20px, 4vw, 30px) clamp(22px, 4vw, 34px) clamp(24px, 4vw, 32px); }
.adm-notice-body p,
.adm-notice-body dt,
.adm-notice-body dd { text-align: start; -webkit-hyphens: manual; hyphens: manual; }
.adm-notice-deadline-lbl {
  font-size: .75rem; font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase; color: var(--gold-ink);
}
.adm-notice-deadline strong {
  font-size: clamp(1.05rem, .95rem + .5vw, 1.25rem); color: var(--ink);
}
.adm-notice-facts {
  display: grid; gap: 12px; margin: 0;
  grid-template-columns: repeat(auto-fit, minmax(208px, 1fr));
}
.adm-notice-facts dd span {
  display: block; margin-top: 2px;
  font-size: .82rem; font-weight: 400; color: var(--txt-mid);
}
.adm-notice-syl strong { color: var(--ink); }
.adm-notice-note { margin: 10px 0 0; font-size: .82rem; color: var(--txt-lt); }
.adm-notice-more { font-size: .9rem; font-weight: 600; margin-left: auto; }
@media (max-width: 560px), (max-height: 620px) and (max-width: 950px) {
  .adm-notice-crest { grid-area: 1 / 1 / 4 / 2; width: 64px; height: 64px; }
  .adm-notice-title { grid-area: 2 / 2 / 3 / 3; text-align: left; font-size: 1.5rem; margin-top: 2px; }
  .adm-notice-rule { display: none; }
  .adm-notice-sub br { display: none; }
  .adm-notice-body { padding: 16px 18px 20px; }
  .adm-notice-deadline { margin-bottom: 14px; padding: 10px 13px; gap: 1px 10px; }
  .adm-notice-deadline strong { font-size: 1.05rem; }
  .adm-notice-facts { grid-template-columns: 1fr; gap: 0; }
  .adm-notice-facts dd span { display: inline; font-size: .86rem; }
  .adm-notice-facts dd span::before { content: "·"; padding: 0 .42em; }
  .adm-notice-note { font-size: .78rem; }
  .adm-notice-more { grid-column: 1 / -1; margin: 0; text-align: center; }
}
@media (min-width: 561px) and (max-height: 620px) {
  .adm-notice-head { column-gap: 18px; }
  .adm-notice-sub { font-size: .82rem; }
  .adm-notice-more { grid-column: auto; justify-self: end; text-align: right; }
  .adm-notice-facts { grid-template-columns: 1fr 1fr; column-gap: 26px; }
}
@media (max-width: 360px) {
  .adm-notice-head { column-gap: 12px; padding: 14px 16px 16px; }
  .adm-notice-crest { width: 56px; height: 56px; }
  .adm-notice-college { letter-spacing: .04em; padding-right: 44px; }
  .adm-notice-title { font-size: 1.32rem; }
  .adm-notice-body { padding: 14px 16px 18px; }
  .adm-notice-facts > div { grid-template-columns: 1fr; row-gap: 1px; }
  .adm-notice-acts {
    margin: 16px -16px -18px;
    padding: 12px 16px calc(12px + env(safe-area-inset-bottom));
  }
}
@media (max-width: 344px) {
  .adm-notice-acts { grid-template-columns: 1fr; }
}
@media (max-width: 380px) {
  .hero-title { font-size: clamp(1.7rem, 9vw, 2.1rem); }
}
@media (max-width: 700px) {
  .h4c-logo { width: 140px; height: 140px; }
  .h4c-motto { font-size: 1.35rem; }
}
@media (max-width: 420px) {
  .h4c-logo { width: 116px; height: 116px; }
  .h4c-motto { font-size: 1.2rem; }
}
[data-u~="u-bordercolor-3c7f"][data-u~="u-bordercolor-3c7f"][data-u~="u-bordercolor-3c7f"] { border-color:rgba(255,255,255,.5); color:#fff; }
[data-u~="u-color-6771"][data-u~="u-color-6771"][data-u~="u-color-6771"] { color:rgba(255,255,255,.7); }
[data-u~="u-margintop-3343"][data-u~="u-margintop-3343"][data-u~="u-margintop-3343"] { margin-top:24px; }
[data-u~="u-position-23c6"][data-u~="u-position-23c6"][data-u~="u-position-23c6"] { position:absolute; inset:0; z-index:1; pointer-events:none; }
[data-u~="u-position-899e"][data-u~="u-position-899e"][data-u~="u-position-899e"] { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 30%; z-index:0; pointer-events:none; }
[data-u~="u-position-da94"][data-u~="u-position-da94"][data-u~="u-position-da94"] { position:relative; z-index:2; }
@media (max-width: 768px) {
  .nt-item { padding-block: 6px; }
}

/* ── What's on (homepage) — filled by initWhatsOn() in main.js from /events ── */
.whatson-section { background: var(--cream); }
.wo-list {
  list-style: none; margin: 34px auto 0; padding: 0; max-width: 1180px;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px;
}
.wo-item a {
  display: grid; grid-template-columns: 74px 1fr; gap: 16px; align-items: center; height: 100%;
  padding: 18px; border-radius: 16px; background: var(--surface); box-shadow: var(--shd-sm);
  text-decoration: none; border-top: 4px solid var(--gold);
  transition: transform .2s ease, box-shadow .2s ease;
}
.wo-item a:hover, .wo-item a:focus-visible { transform: translateY(-3px); box-shadow: var(--shd-md); }
.wo-fallback a { grid-template-columns: 1fr; }
.wo-fallback span { display: block; color: var(--txt-mid); font-size: .85rem; margin-top: 4px; }
.wo-date {
  display: grid; place-items: center; align-content: center; width: 74px; height: 78px; border-radius: 12px;
  background: var(--g-deep); color: #fff; line-height: 1;
}
[data-theme="dark"] .wo-date { background: var(--gold); color: #04101f; }
.wo-date b { font-family: "Playfair Display", serif; font-size: 1.9rem; }
.wo-date span { font-size: .75rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; margin-top: 4px; }
.wo-item b { display: block; color: var(--ink); font-size: 1.02rem; line-height: 1.3; }
.wo-sub { display: block; color: var(--txt-mid); font-size: .85rem; }
.wo-when { display: block; margin-top: 4px; font-size: .85rem; font-weight: 700; color: var(--gold-ink); }
.wo-foot { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; margin-top: 28px; }
@media (prefers-reduced-motion: reduce) { .wo-item a { transition: none; } }