/* Shared card geometry and responsive alignment. */

.activity-showcase-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  gap: 28px;
}
.home-film-section + .activity-showcase { padding-top: 0; }
.activity-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 12px;
  overflow: hidden;
  border: 1px solid #b7c394;
  border-radius: 26px;
  background: #f6f8ed;
  box-shadow: var(--new-clay);
}
.activity-card > video,
.activity-photo-card > img {
  display: block;
  flex: none;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: contain;
  object-position: center;
  border-radius: 16px;
  background: #e5ead8;
}
.activity-card > video { background: #18210b; }
.activity-card > .activity-card-copy {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: flex-start;
  padding: 26px 16px 16px;
}
.activity-card .stage-label { font-size: 12px; line-height: 1.7; }
.activity-card h3 {
  margin: 12px 0 14px;
  padding: 0;
  font-size: 25px;
  line-height: 1.4;
  letter-spacing: -.6px;
}
.activity-card p { margin: 0 0 24px; font-size: 17px; line-height: 1.8; }
.activity-card-footer {
  width: 100%;
  margin-top: auto;
  padding-top: 18px;
  border-top: 1px solid #ccd5b8;
}
.activity-card-footer .text-link { min-height: 44px; font-size: 16px; }
.activity-photo-card:hover .text-link { text-decoration: underline; text-underline-offset: 5px; }

/* Paired classroom and outdoor cards share the same media and content columns. */
.space-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; }
.space-card > img {
  flex: none;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: contain;
  object-position: center;
  background: #e5ead8;
}
.space-card > div { display: flex; flex: 1; flex-direction: column; align-items: flex-start; }
.space-card h3 { line-height: 1.4; }
.space-card p { margin-bottom: 24px; line-height: 1.8; }
.space-card .text-link { width: 100%; margin-top: auto; padding-top: 18px; border-top: 1px solid #ccd5b8; min-height: 44px; }

/* Programme and news links remain level when the paragraph lengths differ. */
.stage-card { display: flex; flex-direction: column; min-width: 0; }
.stage-image { flex: none; }
.stage-copy { display: flex; flex: 1; flex-direction: column; align-items: flex-start; }
.stage-card p { min-height: 0; margin-bottom: 24px; }
.stage-card .text-link { margin-top: auto; min-height: 44px; }
.editorial-news-card { display: flex; flex-direction: column; }
.editorial-news-card > .poster-frame { flex: none; }
.editorial-news-card > div { display: flex; flex: 1; flex-direction: column; align-items: flex-start; }
.editorial-news-card .text-link { margin-top: auto; padding-top: 16px; min-height: 44px; }
.editorial-news-card h3 { line-height: 1.4; }
.curriculum-card, .download-card { display: flex; flex-direction: column; min-width: 0; }
.curriculum-card .text-link { margin-top: auto; padding-top: 22px; }
.download-card-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.download-card-top .pill { float: none; }
.download-card p { margin-bottom: 26px; }
.download-card .resource-download { margin-top: auto; align-self: flex-start; }
.parent-shortcuts > a { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; }
.parent-shortcuts > a > span { margin-top: auto; }

/* Every photo row has a common frame, including the two rotated source photos. */
.gallery-item { display: flex; flex-direction: column; min-width: 0; }
.gallery-item .photo,
.gallery-item .photo[data-photo='gathering'],
.gallery-item .photo[data-photo='outdoor-gathering'] {
  flex: none;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
}
.gallery-item > span { flex: 1; width: 100%; align-items: flex-start; }
.gallery-item .photo > img { object-position: center; }
.gallery-item .photo[data-photo='gathering'] > img,
.gallery-item .photo[data-photo='outdoor-gathering'] > img { transform: rotate(-90deg) scale(1.333333); }
.video-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; }
.video-grid .video-card { display: flex; flex-direction: column; min-width: 0; }
.video-grid .video-card video { flex: none; height: auto; aspect-ratio: 16 / 9; }
.video-grid .video-card h3 { margin: 0; padding: 22px 12px 12px; font-size: 20px; line-height: 1.45; }
.video-grid .video-card > p:not(.video-status) { margin: 0; padding: 0 12px 18px; font-size: 17px; line-height: 1.8; }

/* Prevent long copy from pushing grid columns beyond the viewport. */
.section-head > div, .section-head > p,
.recognition-grid > article, .topic-grid > article,
.team-profile, .news-preview > div, .curriculum-grid > article { min-width: 0; }
.section-head > p { flex: 0 1 360px; }
.subject-list { padding-right: 6px; }
section[id], .gallery-grid[id] { scroll-margin-top: 125px; }

@media (min-width: 901px) {
  .stage-image img { height: auto; aspect-ratio: 4 / 3; }
}
@media (min-width: 821px) and (max-width: 1050px) {
  .activity-card h3, .space-card h3 { min-height: 2.8em; }
}
@media (min-width: 601px) and (max-width: 900px) {
  .stage-card { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); }
  .stage-card .stage-image { height: 100%; }
  .stage-card .stage-image img { display: block; height: 100%; min-height: 290px; }
  .stage-card .stage-copy { padding-block: 24px; }
}
@media (max-width: 820px) {
  .space-grid { grid-template-columns: minmax(0, 1fr); }
  .activity-card > .activity-card-copy { padding: 24px 14px 14px; }
  .activity-card h3 { font-size: 24px; }
  .activity-card-footer .text-link { font-size: 16px; }
}
@media (max-width: 700px) {
  .video-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
  .activity-showcase-grid { grid-template-columns: minmax(0, 1fr); }
  .section-head > p { flex: none; }
  .activity-card { padding: 10px; border-radius: 23px; }
  .activity-card > video, .activity-photo-card > img { border-radius: 14px; }
  .activity-card h3 { font-size: 23px; }
  .activity-card .stage-label { font-size: 11px; }
  .stage-card { display: flex; }
  .stage-card .stage-image img { height: auto; min-height: 0; aspect-ratio: 4 / 3; }
  .download-card .resource-download { width: 100%; padding-inline: 16px; }
  .download-card-top { gap: 10px; }
  .download-card-top .pill { letter-spacing: .4px; font-size: 12px; }
  section[id], .gallery-grid[id] { scroll-margin-top: 110px; }
}

/* Public school facts: the same information people and search services can read. */
.school-facts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 36px; margin:0; }
.school-facts > div { min-width:0; padding:24px 0; border-bottom:1px solid #c3ceb0; }
.school-facts dt { color:#526b2b; font-size:14px; line-height:1.7; font-weight:700; margin-bottom:10px; }
.school-facts dd { margin:0; font-size:19px; line-height:1.7; overflow-wrap:anywhere; }
.school-facts-wide { grid-column:1/-1; }
.school-information-note { max-width:850px; font-size:17px; line-height:1.8; margin-top:28px; }
.school-information-note a { text-decoration:underline; text-underline-offset:4px; }
@media(max-width:600px) { .school-facts { grid-template-columns:1fr; } .school-facts-wide { grid-column:auto; } .school-facts dd { font-size:18px; } }

/* Contact details, source-labelled staff portraits and activity media. */
.topline .wrap { gap: 18px; }
.topline .school-phone-links { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.topline .school-phone-links a { white-space: nowrap; font-size: 13px; }
.school-phone-secondary { display: block; margin-top: 8px; }
.team-jumps, .media-jump-links, .activity-quick-links { display: flex; gap: 14px; flex-wrap: wrap; align-items: center; }
.team-jumps { margin-bottom: 42px; }
.team-group + .team-group { margin-top: 70px; }
.team-group-title { margin: 0 0 12px; font-size: clamp(27px, 3vw, 36px); letter-spacing: -.7px; line-height: 1.25; }
.team-group-intro { margin: 0 0 28px; max-width: 700px; font-size: 18px; line-height: 1.7; }
.team-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px; align-items: stretch; }
.team-profile { display: flex; flex-direction: column; min-width: 0; }
.team-profile > .staff-portrait { padding: 14px; background: #e8eddd; }
.staff-portrait img { width: 100%; height: 280px; object-fit: contain; object-position: center; border-radius: 14px; display: block; }
.team-profile > .staff-profile-copy { padding: 24px; flex: 1; }
.staff-profile-copy h4 { margin: 0; font-size: 23px; line-height: 1.35; letter-spacing: -.4px; }
.team-profile .team-role { font-size: 17px; line-height: 1.6; margin-top: 12px; color: #4c602d; }
.head-intro-photo > img { object-fit: contain; object-position: center; background: #e8eddd; }
.media-jump-links { padding-top: 0; padding-bottom: 10px; }
.school-video-section { padding-top: 44px; }
.video-filters { margin-bottom: 30px; }
.filters { flex-wrap: wrap; gap: 10px; }
.filter { min-height: 44px; padding: 12px 17px; white-space: normal; font-size: 15px; }
.activity-film { border: 1px solid #b7c394; background: #f6f8ed; border-radius: 25px; overflow: hidden; box-shadow: var(--new-clay); }
.video-media { padding: 12px 12px 0; }
.video-media video { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: contain; background: #18210b; border-radius: 15px; }
.activity-film > .video-copy { display: flex; flex: 1; flex-direction: column; align-items: flex-start; padding: 24px; }
.media-meta { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; width: 100%; gap: 10px; font-size: 13px; color: #4c602d; }
.activity-tag { display: inline-flex; padding: 6px 11px; border: 1px solid #b7c394; border-radius: 30px; background: #e7edda; font-size: 13px; line-height: 1.5; font-weight: 650; }
.activity-film .video-copy h3 { margin: 18px 0 12px; padding: 0; font-size: 25px; line-height: 1.35; }
.activity-film .video-copy > p { margin: 0 0 24px; padding: 0; font-size: 17px; line-height: 1.8; }
.activity-film .video-copy > .text-link { margin-top: auto; width: 100%; border-top: 1px solid #ccd5b8; padding-top: 16px; min-height: 44px; }
.activity-quick-links { margin-top: 30px; }
.video-count { margin-top: 24px; }
.gallery-bar { flex-wrap: wrap; gap: 22px; align-items: flex-start; }
.gallery-item > span { display: flex; flex-direction: column; gap: 10px; padding: 20px; font-size: 17px; line-height: 1.5; }
.photo-activity-tag { display: block; font-size: 12px; text-transform: uppercase; letter-spacing: .7px; color: #4c602d; line-height: 1.5; }
[data-video-category][hidden], .gallery-item[hidden] { display: none !important; }
@media (max-width: 1000px) {
  .team-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .topline .top-motto { display: none; }
}
@media (max-width: 620px) {
  .topline .wrap { gap: 10px; justify-content: space-between; }
  .topline .school-location { font-size: 12px; }
  .topline .school-phone-links { gap: 7px; }
  .topline .school-phone-links a { font-size: 12px; }
  .team-grid { grid-template-columns: minmax(0, 1fr); }
  .staff-portrait img { height: 275px; }
  .team-jumps { gap: 10px; }
  .team-jumps .button { width: 100%; }
  .activity-film > .video-copy { padding: 20px; }
  .media-jump-links > a { flex: 1 1 100%; }
  .activity-quick-links > .button { flex: 1 1 100%; }
  .gallery-bar .filters { width: 100%; }
}


/* Department contacts */
.department-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.department-card { min-width:0; padding:28px; border:1px solid #d3d9c2; border-radius:26px; background:#f7f8ef; box-shadow:0 6px 0 #e4e8d7; }
.department-card h3 { margin:0 0 12px; font-size:24px; }
.department-card p { margin:0 0 16px; }
.department-card a,.department-context a { overflow-wrap:anywhere; text-decoration:underline; text-underline-offset:4px; }
.department-card a { display:inline-flex; align-items:center; min-height:44px; }
.department-context { padding:24px 0 0; display:flex; flex-wrap:wrap; gap:16px 32px; }
.department-context p { min-width:0; margin:0; }
.department-context strong,.department-context a { display:block; }
.enquiry-recipient { overflow-wrap:anywhere; }
@media(max-width:1000px) { .department-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:620px) { .department-grid { grid-template-columns:1fr; } .department-card { padding:24px; } }

/* Match the replacement introduction film without stretching or cropping its footage. */
.school-film-player #school-introduction-video { aspect-ratio:30 / 17; width:100%; height:auto; object-fit:contain; }

/* Equal staff frames retain the slide's original brush outline and green texture. */
.team-profile > .staff-portrait { padding:0; background:#007b70; overflow:hidden; }
.team-profile > .staff-portrait img { display:block; width:100%; height:auto; aspect-ratio:10 / 9; object-fit:contain; border-radius:0; }
.head-intro-photo > img { width:100%; height:auto; aspect-ratio:10 / 9; object-fit:contain; background:#007b70; }
.swimming-feature { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:48px; align-items:center; }
.swimming-photo { margin:0; padding:12px; background:#f6f8ed; border:1px solid #b7c394; border-radius:26px; box-shadow:var(--new-clay); max-width:470px; justify-self:center; }
.swimming-photo img { display:block; width:100%; height:auto; aspect-ratio:3 / 4; object-fit:contain; border-radius:17px; }
.swimming-photo figcaption { padding:18px 12px 8px; font-size:17px; font-weight:650; }
.swimming-feature h2 { margin:12px 0 24px; }
.swimming-feature p { font-size:18px; line-height:1.8; }
.swimming-feature .button { margin-top:18px; }
@media(max-width:700px) { .swimming-feature { grid-template-columns:1fr; gap:32px; } .swimming-photo { width:100%; max-width:400px; } }

/* Staff portraits appear once each, in their individual profile cards. */
.team-intro { grid-template-columns:1fr; }
.team-intro .page-intro-copy { max-width:940px; }

/* Named staff and office contacts */
.staff-email { display:flex; align-items:center; min-height:44px; margin-top:18px; padding-top:12px; border-top:1px solid #d3d9c2; font-size:16px; line-height:1.6; color:#354c22; overflow-wrap:anywhere; text-decoration:underline; text-underline-offset:4px; }
.staff-email:focus-visible,.department-card a:focus-visible { outline:2px solid #354c22; outline-offset:4px; border-radius:4px; }
.department-card { display:flex; flex-direction:column; }
.department-card .department-person { font-weight:700; color:#354c22; }
.department-person span { display:block; margin-top:6px; font-weight:400; font-size:16px; line-height:1.6; color:#4c602d; }
.department-card > a { margin-top:auto; }