/* results.css */

[data-fade] { opacity:0; transform:translateY(20px); transition:opacity .5s var(--ease),transform .5s var(--ease); }
[data-fade].visible { opacity:1; transform:none; }

.inline-link { font-style:normal; color:var(--maroon); font-weight:600; text-decoration:none; border-bottom:1px solid var(--gold); padding-bottom:1px; transition:border-color var(--t-fast),color var(--t-fast); }
.inline-link:hover { color:var(--saffron); border-color:var(--saffron); }

/* Hero */
.results-hero { background:var(--navy); color:var(--cream); padding:64px 0 72px; }
.rh-inner { margin-bottom:56px; }
.rh-sub { font-size:var(--text-md); line-height:1.65; color:rgba(251,245,228,.78); margin-top:20px; }

.rh-stats { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:1px; background:rgba(251,245,228,.14); border:1px solid rgba(251,245,228,.22); max-width:980px; margin:0 auto; }
.rhs-card { background:var(--navy); padding:32px 28px; display:flex; flex-direction:column; }
.rhs-card.big { background:var(--maroon); padding:44px 36px; grid-row:span 2; justify-content:space-between; position:relative; overflow:hidden; }
.rhs-card.big::after { content:''; position:absolute; bottom:-40px; right:-40px; width:180px; height:180px; background:radial-gradient(circle,rgba(201,168,58,.2),transparent 70%); }
.rhs-tag { margin-bottom:12px; }
.rhs-n { font-family:var(--font-display); font-weight:600; font-size:clamp(88px,11vw,160px); line-height:.85; color:var(--gold); letter-spacing:-.03em; margin:auto 0; font-variant-numeric:lining-nums; position:relative; z-index:1; display:inline-flex; align-items:center; gap:4px; }
.rhs-n .stat-prefix,.rhs-n .stat-suffix { color:var(--saffron); font-size:.6em; }
.rhs-card.big .rhs-n .stat-suffix { color:var(--saffron); }
.rhs-n.sm { font-size:clamp(38px,4.5vw,58px); margin:0 0 8px; }
.rhs-l { font-size:var(--text-sm); color:rgba(251,245,228,.75); line-height:1.4; max-width:28ch; position:relative; z-index:1; }
.rhs-side { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); grid-template-rows:1fr 1fr; gap:1px; background:rgba(251,245,228,.14); }
.rhs-side .rhs-card { background:var(--navy); }

/* Full-width result section intros */
.results-section-intro {
  display: block;
  max-width: none;
}
.results-section-intro .label {
  display: flex;
}
.results-section-intro .h-section {
  max-width: none;
}
.results-section-intro p {
  max-width: none;
  margin-top: 20px;
}

/* Improvement */
.improvement { padding:var(--space-3xl) 0 28px; }
.improvement .section-head { margin-bottom:20px; }
.improvement-grid { display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:1px; background:var(--rule); border:1px solid var(--rule); }
.imp-card { background:var(--paper); padding:32px 28px; display:flex; flex-direction:column; gap:12px; }
.imp-card.featured-imp { background:var(--maroon); color:var(--cream); padding:40px 32px; grid-row:span 2; }
.imp-tag { margin-bottom:4px; }
.imp-n { font-family:var(--font-display); font-weight:600; font-size:clamp(56px,7vw,90px); color:var(--gold); line-height:1; letter-spacing:-.02em; font-variant-numeric:lining-nums; display:inline-flex; align-items:center; gap:3px; }
.imp-n.plain { color:var(--maroon); font-size:clamp(44px,5vw,64px); }
.imp-n .stat-prefix,.imp-n .stat-suffix { color:var(--saffron); font-size:.6em; }
.imp-n.plain .stat-prefix,.imp-n.plain .stat-suffix { color:var(--saffron); }
.imp-sub { font-size:var(--text-sm); line-height:1.5; color:rgba(251,245,228,.78); max-width:22ch; }
.imp-card:not(.featured-imp) .imp-sub { color:var(--navy); opacity:.75; }
.imp-detail { display:flex; gap:24px; margin-top:auto; padding-top:16px; border-top:1px solid rgba(251,245,228,.2); }
.imp-detail > div { display:flex; flex-direction:column; gap:8px; }
.id-n { font-family:var(--font-display); font-weight:600; font-size:28px; color:var(--gold-soft); display:inline-flex; align-items:center; gap:2px; font-variant-numeric:lining-nums; }
.id-n .stat-prefix,.id-n .stat-suffix { color:var(--saffron); font-size:.6em; }
.id-l { font-family:var(--font-mono); font-size:9px; letter-spacing:.12em; text-transform:uppercase; color:rgba(251,245,228,.6); }

/* Band chart */
.band-section { margin-top:44px; }
.band-title {
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:8px;
  font-family:var(--font-display);
  font-weight:600;
  font-size:24px;
  color:var(--maroon);
  margin-bottom:22px;
}
.band-title-label { display:inline-flex; align-items:center; gap:10px; }
.band-title-main { font-size:clamp(26px,3vw,34px); line-height:1; color:var(--navy); }
.bands { display:flex; flex-direction:column; gap:14px; }
.band-row { display:grid; grid-template-columns:76px minmax(0,1fr) 92px; gap:14px; align-items:center; }
.band-label { font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.1em; text-transform:uppercase; color:var(--navy); font-weight:600; text-align:right; }
.band-bar-wrap { background:var(--paper-alt); border-radius:2px; height:40px; overflow:visible; position:relative; box-shadow:inset 0 0 0 1px var(--rule); }
.band-bar { height:100%; background:var(--maroon); display:flex; align-items:center; padding:0 12px; min-width:0; border-radius:2px; position:relative; }
.band-bar > span { display:inline-flex; align-items:center; white-space:nowrap; font-family:var(--font-mono); font-size:var(--text-xs); color:#fff; font-weight:600; line-height:1; }
.band-bar .stat-prefix,.band-bar .stat-suffix { color:inherit; font-size:.94em; }
.band-bar.mid { background:var(--navy); }
.band-bar.low { background:var(--saffron); }
.band-bar.lowest { background:rgba(13,44,74,.3); }
.band-bar.low > span,
.band-bar.lowest > span {
  position:absolute;
  left:calc(100% + 8px);
  color:var(--navy);
}
.band-count { font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.08em; color:var(--navy); opacity:.65; }
.band-note { font-size:var(--text-sm); color:var(--navy); opacity:.55; margin-top:20px; font-style:italic; }

/* Tenure */
.tenure { padding:var(--space-3xl) 0; }
.tenure-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-bottom:28px; }
.tenure-card { background:var(--paper); border:1px solid var(--rule); border-top:4px solid var(--maroon); padding:32px 28px; position:relative; }
.tenure-card.featured-tc { border-top-color:var(--gold); background:var(--navy); color:var(--cream); }
.tc-badge { position:absolute; top:0; right:0; background:var(--gold); color:var(--navy); font-family:var(--font-mono); font-size:9px; letter-spacing:.14em; text-transform:uppercase; padding:5px 10px; font-weight:700; }
.tc-years { font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.16em; text-transform:uppercase; color:var(--maroon); font-weight:600; margin-bottom:12px; }
.featured-tc .tc-years { color:var(--gold-soft); }
.tc-n { font-family:var(--font-display); font-weight:600; font-size:clamp(48px,6vw,72px); color:var(--maroon); line-height:1; letter-spacing:-.02em; font-variant-numeric:lining-nums; margin-bottom:6px; display:inline-flex; align-items:center; gap:3px; }
.tc-n .stat-suffix { color:var(--saffron); font-size:.6em; }
.featured-tc .tc-n { color:var(--gold); }
.featured-tc .tc-n .stat-suffix { color:var(--saffron); }
.tc-l { font-family:var(--font-body); font-size:var(--text-xs); color:var(--navy); opacity:.7; margin-bottom:12px; }
.featured-tc .tc-l { color:rgba(251,245,228,.7); opacity:1; }
.tc-sub { font-family:var(--font-mono); font-size:9px; letter-spacing:.1em; text-transform:uppercase; color:var(--navy); opacity:.5; margin-bottom:12px; }
.featured-tc .tc-sub { color:rgba(251,245,228,.5); opacity:1; }
.tc-imp { font-size:var(--text-sm); color:var(--navy); opacity:.78; display:flex; align-items:baseline; gap:5px; }
.tc-imp strong { color:var(--maroon); font-size:1.05em; }
.tc-imp strong { display:inline-flex; align-items:center; gap:1px; }
.tc-imp strong .stat-prefix,.tc-imp strong .stat-suffix { color:var(--saffron); font-size:.6em; }
.tc-imp-arrow { color:var(--maroon); font-weight:700; font-size:1.1em; line-height:1; }
.featured-tc .tc-imp { color:rgba(251,245,228,.82); }
.featured-tc .tc-imp strong { color:var(--gold-soft); }
.featured-tc .tc-imp strong .stat-prefix,.featured-tc .tc-imp strong .stat-suffix { color:var(--saffron); }
.featured-tc .tc-imp-arrow { color:var(--gold-soft); }
.tenure-note { font-size:var(--text-sm); color:var(--navy); opacity:.6; max-width:64ch; font-style:italic; }

/* Toppers */
.toppers { padding:28px 0 var(--space-3xl); }
.toppers .section-head { margin-bottom:calc(var(--space-xl) / 2); }
.toppers-table { border-top:2px solid var(--maroon); position:relative; width:100%; max-width:1160px; }
.toppers-table::before { content:''; position:absolute; top:-2px; left:0; width:80px; height:2px; background:var(--gold); }
.tt-header { display:grid; grid-template-columns:70px minmax(260px,1.35fr) minmax(260px,1fr) 120px 130px; column-gap:28px; padding:14px 0; border-bottom:1px solid var(--rule-strong); font-family:var(--font-mono); font-size:9px; letter-spacing:.14em; text-transform:uppercase; color:var(--maroon); font-weight:600; }
.tt-row { display:grid; grid-template-columns:70px minmax(260px,1.35fr) minmax(260px,1fr) 120px 130px; column-gap:28px; padding:14px 0; border-bottom:1px solid var(--rule); align-items:center; transition:background var(--t-fast); }
.tt-row:hover { background:var(--paper-alt); }
.tt-row:nth-child(2) { background:rgba(139,26,26,.04); }
.tt-rank { font-family:var(--font-mono); font-size:var(--text-xs); color:var(--maroon); font-weight:700; letter-spacing:.1em; }
.tt-name { font-family:var(--font-display); font-weight:600; font-size:18px; color:var(--maroon); }
.tt-school { font-size:var(--text-sm); color:var(--navy); opacity:.72; }
.tt-score { font-family:var(--font-display); font-weight:600; font-size:20px; color:var(--navy); font-variant-numeric:lining-nums; }
.tt-imp { font-family:var(--font-mono); font-size:var(--text-base); color:var(--maroon); opacity:1; font-weight:600; }
.tt-imp.positive { color:#2d8a45; font-weight:700; opacity:1; }
.tt-header > span:first-child,
.tt-rank { text-align:center; justify-self:center; }
.tt-header > span:nth-child(4),
.tt-header > span:nth-child(5),
.tt-score,
.tt-imp { text-align:right; justify-self:end; }
.tt-header > span:nth-child(4),
.tt-score {
  width:100%;
  max-width:82px;
}
.tt-header > span:nth-child(4) { text-align:center; }
.tt-score.inline-stat { display:flex; justify-content:flex-end; }
.inline-stat { display:inline-flex; align-items:center; gap:1px; }
.inline-stat .stat-prefix,.inline-stat .stat-suffix { color:var(--saffron); font-size:.6em; }
.toppers-note { font-size:var(--text-sm); color:var(--navy); opacity:.55; margin-top:20px; font-style:italic; }

/* School table */
.school-perf { padding:var(--space-3xl) 0; }
.school-perf .section-head { margin-bottom:calc(var(--space-xl) / 2); }
.school-table { border-top:2px solid var(--maroon); position:relative; width:100%; max-width:1120px; }
.school-table::before { content:''; position:absolute; top:-2px; left:0; width:80px; height:2px; background:var(--gold); }
.st-header { display:grid; grid-template-columns:minmax(300px,1.5fr) 110px 130px 120px 150px; column-gap:28px; padding:14px 0; border-bottom:1px solid var(--rule-strong); font-family:var(--font-mono); font-size:9px; letter-spacing:.13em; text-transform:uppercase; color:var(--maroon); font-weight:600; }
.st-row { display:grid; grid-template-columns:minmax(300px,1.5fr) 110px 130px 120px 150px; column-gap:28px; padding:13px 0; border-bottom:1px solid var(--rule); font-size:var(--text-sm); color:var(--navy); align-items:center; transition:background var(--t-fast); }
.st-row:hover { background:var(--paper-alt); }
.st-row > span:first-child { font-weight:500; }
.st-row > span:nth-child(3) { font-family:var(--font-display); font-weight:600; font-size:16px; color:var(--maroon); }
.st-row > span:last-child { font-family:var(--font-mono); font-weight:700; font-size:var(--text-base); color:var(--maroon); }
.st-row .inline-stat { justify-self:start; }
.st-header > span:not(:first-child),
.st-row > span:not(:first-child) { text-align:right; justify-self:end; }
.st-row > span.inline-stat { justify-self:end; }

/* Beyond Boards — olympiad stats */
.beyond-boards { padding:var(--space-3xl) 0; }
.oly-stats-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--rule); border:1px solid var(--rule); margin:48px 0 40px; }
.oly-stat { background:var(--paper); padding:32px 28px; display:flex; flex-direction:column; gap:6px; }
.oly-n { font-family:var(--font-display); font-weight:600; font-size:clamp(44px,5.5vw,68px); color:var(--maroon); line-height:1; letter-spacing:-.02em; font-variant-numeric:lining-nums; }
.oly-label { font-family:var(--font-mono); font-size:9px; letter-spacing:.12em; text-transform:uppercase; color:var(--navy); opacity:.7; }
.oly-years { font-family:var(--font-mono); font-size:9px; color:var(--navy); opacity:.4; }

/* Our Results Speak Volumes — legacy aggregate stats */
.legacy-stats { padding:var(--space-3xl) 0; }
.legacy-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  margin:36px 0 32px;
}
.lt-col {
  display:flex;
  flex-direction:column;
  overflow:hidden;
  background:var(--paper);
  border:1px solid rgba(251,245,228,.34);
  border-radius:8px;
  box-shadow:0 18px 44px rgba(26,7,7,.18);
}
.lt-head {
  background:linear-gradient(180deg,var(--cream),var(--paper));
  padding:22px 24px 18px;
  border-top:4px solid var(--gold);
  border-bottom:1px solid var(--rule);
}
.legacy-col-head { font-family:var(--font-display); font-weight:600; font-size:19px; color:var(--maroon); margin-bottom:5px; }
.lt-oly .legacy-col-head { color:var(--navy); }
.legacy-col-era { font-family:var(--font-mono); font-size:9px; letter-spacing:.12em; text-transform:uppercase; color:var(--navy); opacity:.5; display:block; margin-top:4px; }
.lt-cell {
  background:var(--paper);
  padding:14px 24px;
  display:grid;
  grid-template-columns:68px 1fr;
  gap:14px;
  align-items:center;
  font-size:var(--text-sm);
  color:var(--navy);
  line-height:1.4;
  border-bottom:1px solid rgba(139,26,26,.08);
}
.lt-cell:last-child { border-bottom:0; }
.legacy-n {
  font-family:var(--font-display);
  font-weight:700;
  font-size:24px;
  color:var(--maroon);
  line-height:1;
  font-variant-numeric:lining-nums;
}
.lt-oly .legacy-n { color:var(--navy); opacity:.85; }

/* Big quote */
.res-big-quote { font-family:var(--font-display); font-style:italic; font-weight:500; font-size:clamp(24px,3.5vw,40px); line-height:1.25; color:var(--cream); max-width:32ch; }

/* Responsive */
@media (max-width:1024px) {
  .improvement-grid { grid-template-columns:1fr 1fr; }
  .tenure-grid { grid-template-columns:1fr 1fr; }
  .legacy-grid { grid-template-columns:1fr; grid-template-rows:none; }
  .lt-col { grid-row:auto; }
  .tt-header,.tt-row { grid-template-columns:48px minmax(0,1.1fr) minmax(0,1fr) 72px 94px; column-gap:12px; }
  .st-header,.st-row { grid-template-columns:minmax(0,1.35fr) 56px 76px 72px 96px; column-gap:12px; }
}
@media (max-width:680px) {
  .rh-stats { grid-template-columns:1fr; }
  .rhs-card.big { grid-row:auto; }
  .rhs-side { grid-template-columns:1fr 1fr; }
}
@media (max-width:640px) {
  .improvement-grid { grid-template-columns:1fr; }
  .imp-card.featured-imp { grid-column:auto; }
  .tenure-grid { grid-template-columns:1fr; }
  .oly-stats-grid { grid-template-columns:1fr 1fr; }
  .rhs-side { grid-template-columns:1fr 1fr; }
  .band-title { margin-bottom:18px; }
  .band-row {
    grid-template-columns:1fr auto;
    gap:8px 14px;
    padding:12px 0;
    border-bottom:1px solid var(--rule);
  }
  .band-label { text-align:left; }
  .band-count { text-align:right; }
  .band-bar-wrap { grid-column:1 / -1; height:38px; }
  .tt-header,.st-header { display:none; }
  .toppers-table,.school-table { border-top:0; display:grid; gap:12px; }
  .toppers-table::before,.school-table::before { display:none; }
  .tt-row,.st-row {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px 16px;
    padding:16px;
    border:1px solid var(--rule);
    background:var(--paper);
    border-radius:8px;
    box-shadow:0 10px 26px rgba(13,44,74,.06);
  }
  .tt-row:hover,.st-row:hover { background:var(--paper); }
  .tt-row > span,.st-row > span {
    display:flex;
    flex-direction:column;
    gap:4px;
    min-width:0;
    justify-self:stretch;
    text-align:left;
  }
  .tt-rank,
  .tt-score,
  .tt-imp,
  .st-row > span:not(:first-child),
  .st-row > span.inline-stat {
    justify-self:stretch;
    text-align:left;
  }
  .tt-row > span::before,.st-row > span::before {
    font-family:var(--font-mono);
    font-size:9px;
    letter-spacing:.13em;
    text-transform:uppercase;
    color:var(--maroon);
    opacity:.68;
    font-weight:700;
  }
  .tt-row > span:nth-child(1)::before { content:'Rank'; }
  .tt-row > span:nth-child(2)::before { content:'Student'; }
  .tt-row > span:nth-child(3)::before { content:'School'; }
  .tt-row > span:nth-child(4)::before { content:'Score'; }
  .tt-row > span:nth-child(5)::before { content:'Improvement'; }
  .st-row > span:nth-child(1)::before { content:'School'; }
  .st-row > span:nth-child(2)::before { content:'Students'; }
  .st-row > span:nth-child(3)::before { content:'Avg score'; }
  .st-row > span:nth-child(4)::before { content:'90%+ rate'; }
  .st-row > span:nth-child(5)::before { content:'Avg improvement'; }
  .tt-row > span.inline-stat,
  .st-row > span.inline-stat {
    display:grid;
    grid-template-columns:auto auto auto;
    justify-content:start;
    align-items:baseline;
    column-gap:1px;
    row-gap:4px;
  }
  .tt-row > span.inline-stat::before,
  .st-row > span.inline-stat::before {
    grid-column:1 / -1;
  }
  .tt-name,.tt-school,.st-row > span:first-child { grid-column:auto; }
}

@media (max-width:768px) {
  .tt-header,
  .st-header {
    display:none;
  }

  .toppers-table,
  .school-table {
    max-width:none;
    border-top:0;
    display:grid;
    gap:14px;
  }

  .toppers-table::before,
  .school-table::before {
    display:none;
  }

  .tt-row,
  .st-row {
    background:var(--paper);
    border:1px solid var(--rule);
    border-top:3px solid var(--gold);
    border-radius:8px;
    box-shadow:0 10px 26px rgba(13,44,74,.06);
    padding:20px;
  }

  .tt-row,
  .tt-row:nth-child(2),
  .tt-row:hover,
  .st-row,
  .st-row:hover {
    background:var(--paper);
  }

  .tt-row {
    display:grid;
    grid-template-columns:1fr 1fr;
    grid-template-areas:
      "rank rank"
      "name name"
      "school school"
      "score improvement";
    gap:8px 16px;
  }

  .tt-rank {
    grid-area:rank;
    justify-self:start;
    display:inline-flex;
    align-items:center;
    gap:6px;
    border:1px solid rgba(139,26,26,.16);
    background:var(--paper-alt);
    padding:5px 8px;
    border-radius:999px;
    text-align:left;
    font-size:10px;
  }

  .tt-rank::before {
    content:'Rank';
    font-family:var(--font-mono);
    font-size:8px;
    letter-spacing:.12em;
    text-transform:uppercase;
    color:var(--maroon);
    opacity:.62;
  }

  .tt-name {
    grid-area:name;
    font-size:20px;
    line-height:1.15;
  }

  .tt-school {
    grid-area:school;
    font-size:var(--text-sm);
    line-height:1.45;
    margin-bottom:4px;
  }

  .tt-name::before,
  .tt-school::before,
  .st-row > span:first-child::before {
    content:none;
    display:none;
  }

  .tt-score { grid-area:score; }
  .tt-imp { grid-area:improvement; }

  .tt-score,
  .tt-imp {
    justify-self:stretch;
    text-align:left;
    border-top:1px solid var(--rule);
    padding-top:12px;
    min-width:0;
  }

  .tt-score::before,
  .tt-imp::before {
    display:block;
    font-family:var(--font-mono);
    font-size:9px;
    letter-spacing:.13em;
    text-transform:uppercase;
    color:var(--maroon);
    opacity:.68;
    font-weight:700;
    margin-bottom:5px;
  }

  .tt-score::before { content:'Score'; }
  .tt-imp::before { content:'Improvement'; }

  .tt-score.inline-stat,
  .tt-imp.inline-stat {
    display:grid;
    grid-template-columns:auto auto auto;
    justify-content:start;
    align-items:baseline;
    column-gap:1px;
  }

  .tt-score.inline-stat::before,
  .tt-imp.inline-stat::before {
    grid-column:1 / -1;
  }

  .st-row {
    display:grid;
    grid-template-columns:1fr 1fr;
    grid-template-areas:
      "school school"
      "students avg"
      "rate improvement";
    gap:14px 16px;
  }

  .st-row > span {
    justify-self:stretch;
    text-align:left;
    min-width:0;
  }

  .st-row > span:first-child {
    grid-area:school;
    font-family:var(--font-display);
    font-weight:600;
    font-size:20px;
    line-height:1.2;
    color:var(--maroon);
    padding-bottom:4px;
  }

  .st-row > span:nth-child(2) { grid-area:students; }
  .st-row > span:nth-child(3) { grid-area:avg; }
  .st-row > span:nth-child(4) { grid-area:rate; }
  .st-row > span:nth-child(5) { grid-area:improvement; }

  .st-row > span:not(:first-child) {
    border-top:1px solid var(--rule);
    padding-top:12px;
    display:grid;
    grid-template-columns:auto auto auto;
    justify-content:start;
    align-items:baseline;
    column-gap:1px;
    font-size:18px;
    font-weight:700;
    color:var(--navy);
  }

  .st-row > span:not(:first-child)::before {
    grid-column:1 / -1;
    font-family:var(--font-mono);
    font-size:9px;
    letter-spacing:.13em;
    text-transform:uppercase;
    color:var(--maroon);
    opacity:.68;
    font-weight:700;
    margin-bottom:5px;
  }

  .st-row > span:nth-child(2)::before { content:'Students'; }
  .st-row > span:nth-child(3)::before { content:'Avg score'; }
  .st-row > span:nth-child(4)::before { content:'90%+ rate'; }
  .st-row > span:nth-child(5)::before { content:'Avg improvement'; }
}