:root {
  color-scheme: light;
  --wine: #70233a;
  --wine-deep: #451928;
  --wine-dark: #351521;
  --gold: #efc761;
  --cream: #f7f3eb;
  --paper: #fffefa;
  --ink: #272321;
  --muted: #77706b;
  --line: #dfd8cd;
  --font: "Tajawal", sans-serif;
  font-family: var(--font);
  color: var(--ink);
  background: var(--paper);
  font-synthesis: none;
  text-rendering: optimizeLegibility;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 92px; }
body { margin: 0; min-width: 320px; background: var(--paper); }
body, button, a { font-family: var(--font); }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { color: inherit; }
.skip-link { position: fixed; z-index: 20; top: 12px; right: 12px; transform: translateY(-160%); padding: 10px 16px; background: var(--paper); color: var(--wine); }
.skip-link:focus { transform: translateY(0); }

.site-header { height: 82px; padding: 0 6.2vw; display: flex; align-items: center; justify-content: space-between; position: relative; z-index: 5; background: var(--paper); }
.brand { display: inline-flex; align-items: center; gap: 10px; color: var(--wine); }
.brand-mark { width: 42px; height: 42px; display: grid; place-items: center; color: var(--gold); background: var(--wine); font-size: 28px; font-weight: 800; clip-path: polygon(50% 0, 100% 24%, 100% 78%, 50% 100%, 0 78%, 0 24%); }
.brand-name { display: flex; flex-direction: column; font-size: 13px; font-weight: 600; line-height: 1.15; letter-spacing: -.2px; white-space: nowrap; }
.brand-name strong { font-weight: 800; font-size: 16px; }
.brand-name small { margin-top: 4px; color: #837671; font-size: 10px; letter-spacing: .2px; }
.desktop-nav { display: flex; align-items: center; gap: clamp(24px, 3.2vw, 52px); }
.desktop-nav a, .header-contact { font-size: 14px; font-weight: 600; transition: color .2s; }
.desktop-nav a:hover, .footer-links a:hover { color: var(--wine); }
.header-contact { display: inline-flex; gap: 13px; align-items: center; color: var(--wine); }
.header-contact span { font-family: "DM Sans", sans-serif; font-size: 20px; }
.header-portal { display: none; }
.menu-toggle, .mobile-nav { display: none; }

.hero { height: min(690px, calc(100svh - 82px)); min-height: 570px; position: relative; display: flex; align-items: center; overflow: hidden; color: white; background: var(--wine-deep); }
.hero-image, .hero-shade { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero-image { object-fit: cover; object-position: center 44%; }
.hero-shade { background: linear-gradient(270deg, rgba(37, 17, 23, .83) 0%, rgba(40, 20, 24, .62) 37%, rgba(38, 18, 22, .12) 100%), linear-gradient(0deg, rgba(25, 12, 18, .36), transparent 44%); }
.hero-content { z-index: 1; width: min(690px, 59vw); margin-right: 11.5vw; padding: 30px 0 42px; }
.eyebrow { display: inline-flex; align-items: center; gap: 10px; color: var(--wine); font-size: 13px; font-weight: 700; letter-spacing: .15px; }
.hero-eyebrow, .eyebrow-light { color: var(--gold); }
.hero-eyebrow span { width: 25px; height: 1px; background: var(--gold); }
.hero h1 { margin: 21px 0 12px; font-size: clamp(67px, 9vw, 128px); font-weight: 800; line-height: .91; letter-spacing: -5px; }
.hero h1 em, .difference h2 em, .visit h2 em { color: var(--gold); font-style: normal; }
.hero-copy { max-width: 470px; margin: 25px 0 30px; color: rgba(255,255,255,.86); font-size: 17px; font-weight: 500; line-height: 1.9; }
.button { min-height: 52px; padding: 0 22px; display: inline-flex; align-items: center; justify-content: center; gap: 24px; font-size: 14px; font-weight: 700; transition: transform .2s, background .2s, color .2s; }
.button:hover { transform: translateY(-3px); }
.button span { font-family: "DM Sans", sans-serif; font-size: 20px; line-height: 1; }
.button-gold { color: var(--wine-dark); background: var(--gold); }
.button-gold:hover { background: #f6d782; }
.hero-note { position: absolute; left: 6.2vw; bottom: 53px; display: flex; align-items: center; gap: 13px; color: rgba(255,255,255,.83); font-size: 12px; }
.note-line { width: 54px; height: 1px; background: var(--gold); }
.scroll-cue { position: absolute; right: 6.2vw; bottom: 44px; display: flex; align-items: center; gap: 15px; color: white; font-size: 12px; }
.scroll-cue b { display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid rgba(255,255,255,.55); border-radius: 50%; font-size: 17px; font-weight: 400; }

.section-wrap { padding-inline: 11.5vw; }
.intro { min-height: 426px; padding-top: 105px; padding-bottom: 88px; position: relative; display: grid; grid-template-columns: .72fr 2fr; gap: 6vw; overflow: hidden; }
.intro-label { display: flex; align-items: flex-start; gap: 16px; padding-top: 10px; }
.section-number { color: #a58b7c; font-family: "DM Sans", sans-serif; font-size: 12px; }
.intro-copy h2, .section-heading h2, .numbers h2 { margin: 0; font-size: clamp(38px, 4.5vw, 61px); line-height: 1.25; font-weight: 700; letter-spacing: -1.4px; }
.intro-copy h2 span, .section-heading h2 span { color: var(--wine); }
.intro-bottom { margin-top: 26px; display: flex; align-items: center; gap: 50px; }
.intro-bottom p { max-width: 425px; margin: 0; color: var(--muted); font-size: 16px; line-height: 1.9; }
.text-link { display: inline-flex; align-items: center; gap: 12px; flex: 0 0 auto; color: var(--wine); font-size: 14px; font-weight: 700; }
.text-link span { font-family: "DM Sans", sans-serif; font-size: 19px; }
.intro-doodle { position: absolute; left: 9%; bottom: 10%; width: 110px; aspect-ratio: 1290 / 1272; opacity: .09; filter: invert(1); mix-blend-mode: multiply; pointer-events: none; }
.intro-doodle img { width: 100%; height: 100%; object-fit: contain; }

.learning { padding-top: 86px; padding-bottom: 113px; background: var(--cream); }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 40px; margin-bottom: 39px; }
.section-heading h2 { margin-top: 10px; font-size: clamp(37px, 4vw, 53px); }
.section-heading > p { max-width: 295px; margin: 0 0 5px; color: var(--muted); font-size: 15px; line-height: 1.85; }
.program-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 23px; }
.program-card { background: var(--paper); }
.program-image-wrap { height: 235px; position: relative; overflow: hidden; background: #e5ddd1; }
.program-image-wrap img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.program-card:hover .program-image-wrap img { transform: scale(1.04); }
.program-index { position: absolute; top: 13px; left: 13px; padding: 5px 9px; color: white; background: rgba(48, 28, 32, .66); font-family: "DM Sans", sans-serif; font-size: 10px; direction: ltr; }
.program-info { padding: 23px 23px 25px; }
.program-age { color: #977e70; font-size: 12px; font-weight: 600; }
.program-info h3 { margin: 8px 0; color: var(--wine); font-size: 25px; font-weight: 700; }
.program-info p { min-height: 53px; margin: 0 0 17px; color: var(--muted); font-size: 14px; line-height: 1.75; }
.program-info a { display: inline-flex; align-items: center; gap: 12px; color: var(--wine); font-size: 13px; font-weight: 700; }
.program-info a span { font-family: "DM Sans", sans-serif; font-size: 18px; }

.difference { min-height: 680px; display: grid; grid-template-columns: 1.04fr .96fr; background: var(--wine); color: white; }
.difference-image { min-height: 680px; position: relative; overflow: hidden; }
.difference-image img { width: 100%; height: 100%; position: absolute; inset: 0; object-fit: cover; object-position: center; }
.difference-image::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(35,16,22,.53), transparent 32%); }
.image-caption { position: absolute; z-index: 1; right: 7%; bottom: 42px; color: white; font-size: 13px; }
.difference-content { position: relative; padding: 95px 11% 80px 13%; align-self: center; overflow: hidden; }
.difference h2 { position: relative; z-index: 1; margin: 25px 0 16px; font-size: clamp(53px, 6.1vw, 83px); line-height: 1.08; font-weight: 700; letter-spacing: -2px; }
.difference-content > p { position: relative; z-index: 1; max-width: 390px; margin: 22px 0 30px; color: rgba(255,255,255,.79); font-size: 16px; line-height: 1.95; }
.button-outline { border: 1px solid rgba(255,255,255,.68); color: white; }
.button-outline:hover { color: var(--wine); background: white; }
.difference-star { position: absolute; left: -26px; bottom: -60px; width: 330px; aspect-ratio: 1290 / 1272; opacity: .12; mix-blend-mode: screen; pointer-events: none; }
.difference-star img { width: 100%; height: 100%; object-fit: contain; }

.numbers { position: relative; display: grid; grid-template-columns: 1.4fr repeat(3, 1fr); align-items: center; gap: 25px; min-height: 285px; padding-top: 70px; padding-bottom: 77px; }
.numbers-heading { padding-left: 20px; }
.numbers h2 { margin-top: 9px; font-size: 32px; }
.number-item { min-height: 114px; padding-inline-start: 26px; border-right: 1px solid var(--line); display: flex; flex-direction: column; justify-content: center; }
.number-item strong { color: var(--wine); font-family: var(--font); font-size: 46px; font-weight: 700; line-height: 1; }
.number-item span { margin-top: 11px; color: var(--muted); font-size: 13px; line-height: 1.65; }
.numbers-footnote { position: absolute; left: 11.5vw; bottom: 23px; margin: 0; color: #998f86; font-size: 10px; }

.quote-section { min-height: 392px; padding: 78px 19vw; position: relative; display: flex; align-items: center; overflow: hidden; color: white; background: var(--wine-deep); }
.quote-mark { position: absolute; top: 17px; right: 9vw; color: rgba(239,199,97,.18); font-family: Georgia, serif; font-size: 270px; line-height: 1; }
.quote-content { position: relative; z-index: 1; max-width: 690px; }
.quote-content blockquote { margin: 17px 0 25px; font-size: clamp(29px, 3.5vw, 45px); font-weight: 500; line-height: 1.55; }
.quote-byline { display: flex; align-items: center; gap: 12px; }
.quote-avatar { width: 39px; height: 39px; display: grid; place-items: center; border-radius: 50%; color: var(--wine-dark); background: var(--gold); font-size: 18px; font-weight: 700; }
.quote-byline span:last-child { display: flex; flex-direction: column; gap: 2px; }
.quote-byline strong { font-size: 13px; }
.quote-byline small { color: rgba(255,255,255,.64); font-size: 11px; }
.quote-side-note { position: absolute; left: 8vw; bottom: 56px; color: rgba(255,255,255,.49); font-size: 13px; line-height: 1.8; }

.visit { min-height: 555px; padding-top: 95px; padding-bottom: 95px; position: relative; display: grid; grid-template-columns: 1fr .9fr; align-items: center; gap: 9%; overflow: hidden; }
.visit-copy { position: relative; z-index: 1; }
.visit h2 { margin: 18px 0 12px; color: var(--wine); font-size: clamp(55px, 6vw, 78px); line-height: 1.05; font-weight: 700; }
.visit h2 em { color: #b38d39; }
.visit-copy > p { max-width: 375px; margin: 18px 0 25px; color: var(--muted); font-size: 15px; line-height: 1.9; }
.button-dark { color: white; background: var(--wine); }
.button-dark:hover { background: var(--wine-deep); }
.visit-image { height: 370px; position: relative; z-index: 1; }
.visit-image::before { content: ""; position: absolute; z-index: -1; top: -18px; left: -18px; width: 100%; height: 100%; border: 1px solid #d9ccb8; }
.visit-image img { width: 100%; height: 100%; object-fit: cover; }
.visit-mark { position: absolute; left: 23%; bottom: -190px; color: #f6f0e6; font-size: 470px; font-weight: 800; line-height: 1; }

.site-footer { padding: 63px 11.5vw 0; color: white; background: var(--wine-dark); }
.footer-main { display: grid; grid-template-columns: 1fr 1.1fr 1.2fr .75fr; gap: 35px; padding-bottom: 53px; }
.brand-footer { color: white; align-self: start; }
.brand-footer .brand-name small { color: rgba(255,255,255,.58); }
.brand-footer .brand-mark { color: var(--wine-dark); background: var(--gold); }
.footer-main > p { margin: 0; font-size: 26px; font-weight: 600; line-height: 1.5; }
.footer-contact, .footer-links { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.footer-contact .eyebrow { margin-bottom: 5px; }
.footer-contact a { font-size: 14px; }
.footer-links a { color: rgba(255,255,255,.78); font-size: 13px; }
.footer-bottom { min-height: 57px; border-top: 1px solid rgba(255,255,255,.18); display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1.35fr) auto auto; align-items: center; gap: 25px; padding-block: 23px; color: rgba(255,255,255,.58); font-size: 10px; line-height: 1.9; }
.footer-bottom a { color: var(--gold); font-size: 11px; }
.footer-credit { display: block; color: rgba(255,255,255,.84); font-size: 12px; line-height: 2; }
.footer-developer-mark { display: flex; flex-direction: column; align-items: center; gap: 7px; }
.developer-logo-square { width: 108px; height: 108px; padding: 0; display: grid; place-items: center; background: transparent; border: 0; }
.developer-logo-square img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: screen; filter: contrast(2) brightness(1.1); opacity: .92; }
.footer-developer-mark > span { color: rgba(239,199,97,.74); font-size: 9px; }
.footer-back-to-top { white-space: nowrap; }
.back-to-top { position: fixed; right: max(20px, env(safe-area-inset-right)); bottom: max(20px, env(safe-area-inset-bottom)); z-index: 20; width: 48px; height: 48px; display: grid; place-items: center; color: var(--gold); background: var(--wine); border: 1px solid rgba(239,199,97,.55); box-shadow: 0 5px 20px rgba(53,21,33,.19); transition: background .2s, transform .2s; }
.back-to-top:hover { background: var(--wine-deep); transform: translateY(-3px); }
.back-to-top:focus-visible { outline: 3px solid var(--gold); outline-offset: 4px; }
.back-to-top[hidden] { display: none; }
body:has(.complaint-form :focus) .back-to-top { visibility: hidden; }
.desktop-nav .student-portal-link { color: var(--wine); font-weight: 800; }
.mobile-nav .student-portal-link { color: var(--wine); font-weight: 800; }

@media (min-width: 1500px) {
  .site-header { padding-inline: max(6.2vw, calc((100vw - 1440px) / 2)); }
  .section-wrap { padding-inline: max(11.5vw, calc((100vw - 1220px) / 2)); }
}
@media (max-width: 900px) {
  .site-header { height: 74px; padding-inline: 5vw; }
  .desktop-nav { gap: 20px; }
  .desktop-nav a, .header-contact { font-size: 13px; }
  .hero { height: 650px; min-height: 560px; }
  .hero-content { width: 70vw; margin-right: 8vw; }
  .section-wrap { padding-inline: 8vw; }
  .intro { grid-template-columns: .55fr 2fr; gap: 4vw; padding-block: 85px; }
  .intro-bottom { gap: 25px; align-items: flex-start; flex-direction: column; }
  .program-grid { gap: 14px; }
  .program-image-wrap { height: 195px; }
  .program-info { padding: 19px 16px 21px; }
  .difference, .difference-image { min-height: 600px; }
  .difference-content { padding: 75px 10%; }
  .numbers { grid-template-columns: repeat(3, 1fr); gap: 25px; padding-block: 64px 80px; }
  .numbers-heading { grid-column: 1 / -1; }
  .numbers-heading h2 { font-size: 29px; }
  .number-item { padding-inline-start: 16px; }
  .numbers-footnote { left: 8vw; }
  .visit { gap: 6%; }
  .site-footer { padding-inline: 8vw; }
}
@media (max-width: 640px) {
  html { scroll-padding-top: 70px; }
  .site-header { height: 70px; padding-inline: 21px; }
  .brand-mark { width: 37px; height: 37px; font-size: 25px; }
  .brand-name { font-size: 13px; }
  .brand-name strong { font-size: 17px; }
  .header-actions { display: flex; align-items: center; gap: 18px; }
  .header-contact { font-size: 12px; gap: 6px; }
  .header-contact span { font-size: 17px; }
  .desktop-nav { display: none; }
  .menu-toggle { width: 34px; height: 34px; padding: 7px 3px; border: 0; background: transparent; display: flex; flex-direction: column; justify-content: center; gap: 6px; cursor: pointer; }
  .menu-toggle span { width: 26px; height: 2px; background: var(--wine); transition: transform .2s; }
  .menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(4px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-4px) rotate(-45deg); }
  .mobile-nav:not([hidden]) { position: absolute; top: 70px; right: 0; left: 0; padding: 12px 23px 20px; display: flex; flex-direction: column; background: var(--paper); box-shadow: 0 14px 18px rgba(40,20,24,.12); }
  .mobile-nav a { padding: 13px 3px; border-bottom: 1px solid var(--line); font-size: 15px; font-weight: 600; }
  .mobile-nav a:last-child { color: var(--wine); border: 0; }
  .hero { height: min(720px, calc(100svh - 70px)); min-height: 590px; align-items: center; }
  .hero-image { object-position: 57% center; }
  .hero-shade { background: linear-gradient(270deg, rgba(37,17,23,.78), rgba(40,20,24,.4) 74%, rgba(38,18,22,.12)), linear-gradient(0deg, rgba(25,12,18,.45), transparent 47%); }
  .hero-content { width: auto; margin: -12px 27px 0; padding: 0; }
  .hero h1 { margin-top: 19px; font-size: clamp(66px, 18vw, 95px); letter-spacing: -3px; }
  .hero-copy { max-width: 410px; margin: 20px 0 25px; font-size: 15px; line-height: 1.85; }
  .button { min-height: 49px; padding-inline: 18px; font-size: 13px; }
  .hero-note { right: 27px; left: auto; bottom: 28px; font-size: 10px; }
  .scroll-cue { right: auto; left: 27px; bottom: 23px; gap: 9px; font-size: 10px; }
  .scroll-cue b { width: 29px; height: 29px; }
  .section-wrap { padding-inline: 25px; }
  .intro { min-height: 0; display: block; padding-top: 70px; padding-bottom: 75px; }
  .intro-label { margin-bottom: 24px; }
  .intro-copy h2 { font-size: 39px; letter-spacing: -1px; }
  .intro-bottom { margin-top: 17px; gap: 17px; }
  .intro-bottom p { font-size: 14px; }
  .intro-doodle { left: 7%; bottom: 3%; width: 76px; }
  .learning { padding-top: 68px; padding-bottom: 75px; }
  .section-heading { display: block; margin-bottom: 25px; }
  .section-heading h2 { margin-top: 7px; font-size: 36px; letter-spacing: -.8px; }
  .section-heading > p { margin-top: 11px; font-size: 14px; }
  .program-grid { grid-template-columns: 1fr; gap: 19px; }
  .program-image-wrap { height: 220px; }
  .program-info { padding: 18px 20px 21px; }
  .program-info h3 { font-size: 23px; }
  .program-info p { min-height: unset; margin-bottom: 12px; }
  .difference { display: flex; flex-direction: column; }
  .difference-image { min-height: 360px; }
  .difference-content { padding: 58px 27px 64px; }
  .difference h2 { margin: 17px 0 14px; font-size: 60px; letter-spacing: -1px; }
  .difference-content > p { margin: 16px 0 23px; font-size: 14px; }
  .difference-star { left: -20px; bottom: -52px; width: 260px; }
  .numbers { grid-template-columns: 1fr 1fr; gap: 28px 12px; min-height: unset; padding-top: 64px; padding-bottom: 84px; }
  .numbers-heading { grid-column: 1 / -1; padding: 0; }
  .numbers h2 { font-size: 29px; }
  .number-item { min-height: 100px; padding-inline-start: 15px; }
  .number-item:nth-of-type(4) { grid-column: 1 / -1; border-right: 0; }
  .number-item strong { font-size: 40px; }
  .number-item span { font-size: 12px; }
  .numbers-footnote { right: 25px; left: auto; bottom: 24px; font-size: 9px; }
  .quote-section { min-height: 367px; padding: 65px 27px; }
  .quote-mark { top: 10px; right: 13px; font-size: 190px; }
  .quote-content blockquote { margin: 15px 0 22px; font-size: 30px; line-height: 1.6; }
  .quote-side-note { left: 25px; bottom: 25px; font-size: 10px; }
  .visit { display: flex; flex-direction: column; align-items: stretch; gap: 39px; padding-top: 70px; padding-bottom: 75px; }
  .visit h2 { font-size: 64px; }
  .visit-copy > p { font-size: 14px; }
  .visit-image { height: 270px; margin-inline: 7px 0; }
  .visit-mark { left: 5%; bottom: -122px; font-size: 300px; }
  .site-footer { padding: 44px 26px 0; }
  .footer-main { grid-template-columns: 1fr 1fr; gap: 34px 22px; padding-bottom: 37px; }
  .footer-main > p { font-size: 22px; }
  .footer-contact { grid-column: 1 / -1; }
  .footer-links { align-self: start; }
  .footer-bottom { min-height: 74px; grid-template-columns: minmax(0, 1fr) 96px; gap: 12px 18px; padding-block: 24px 82px; font-size: 9px; }
  .footer-copyright { grid-column: 1 / -1; grid-row: 3; padding-top: 7px; }
  .footer-credit { grid-column: 1; grid-row: 1 / 3; font-size: 12px; line-height: 2.1; }
  .footer-developer-mark { grid-column: 2; grid-row: 1; }
  .developer-logo-square { width: 88px; height: 88px; }
  .footer-back-to-top { grid-column: 2; grid-row: 2; text-align: center; }
  .back-to-top { right: max(15px, env(safe-area-inset-right)); bottom: max(15px, env(safe-area-inset-bottom)); width: 45px; height: 45px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}

/* Supplied logo, added at the owner's request. */
.brand-logo { display: block; width: clamp(175px, 21vw, 215px); height: auto; max-height: 68px; object-fit: contain; }
@media (max-width: 600px) { .brand-logo { width: 175px; max-height: 58px; } }

/* School community additions, using the original wine/gold palette. */
.stage-gradient{isolation:isolate;display:grid;place-items:center;color:var(--gold);background:radial-gradient(circle at 80% 20%,#efc76177,transparent 55%),linear-gradient(135deg,var(--wine),var(--wine-deep));}
.stage-gradient-2{color:var(--wine);background:radial-gradient(circle at 80% 15%,#fffefa99,transparent 55%),linear-gradient(135deg,var(--gold),#ddad50 50%,#a85c4e);}
.stage-gradient-3{background:radial-gradient(circle at 15% 85%,#efc76177,transparent 50%),linear-gradient(145deg,var(--wine-dark),var(--wine) 70%,#a8695b);}
.stage-gradient>svg{width:85px;height:85px;z-index:1;filter:drop-shadow(0 4px 10px #35152122);}
.stage-gradient:after{content:'';position:absolute;width:180px;height:180px;border:1px solid currentColor;opacity:.18;transform:rotate(45deg);border-radius:38px;}
.gradient-orbit{position:absolute;width:310px;height:310px;border:1px solid currentColor;border-radius:50%;opacity:.15;transform:translate(-40%,25%);}
.school-community{padding-block:88px;background:var(--paper);}.school-staff{background:var(--cream);}.school-community .section-heading h2 span{color:#9d7f4d;}
.community-empty{grid-column:1/-1;width:100%;margin:0;padding:45px 24px;text-align:center;border:1px dashed var(--line);border-radius:12px;color:var(--muted);font-size:15px;line-height:2;background:#ffffff66;}
.achievement-grid,.staff-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;}
.community-retry{padding:10px 20px;background:var(--wine);color:white;border:0;border-radius:5px;cursor:pointer;}
.achievement-card{min-width:0;border:1px solid var(--line);background:var(--paper);border-radius:10px;overflow:hidden;}.achievement-open{display:block;width:100%;height:250px;padding:0;border:0;background:var(--cream);cursor:pointer;}.achievement-open img{width:100%;height:100%;object-fit:cover;}.achievement-open img[hidden]{display:none;}.image-unavailable{font-size:14px;color:var(--muted);padding:20px;display:block;}.achievement-body{padding:22px;}.achievement-body h3{margin:0 0 10px;font-size:21px;color:var(--wine);}.achievement-body p{color:var(--muted);line-height:1.9;font-size:14px;margin:0;white-space:pre-line;}.achievement-body time{display:block;font-size:12px;color:#9d7f4d;margin-top:16px;}
.staff-filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:30px;}.staff-filters button{border:1px solid var(--line);background:var(--paper);padding:11px 20px;border-radius:30px;font:inherit;font-size:13px;cursor:pointer;}.staff-filters button[aria-pressed="true"]{background:var(--wine);border-color:var(--wine);color:white;}
.staff-card{position:relative;border:1px solid var(--line);background:var(--paper);border-radius:12px;padding:28px;}.staff-monogram{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(140deg,#efc76155,#70233a15);color:var(--wine);font-size:27px;font-weight:700;margin-bottom:20px;}.staff-group{font-size:11px;color:#997a42;}.staff-card h3{font-size:22px;margin:10px 0;color:var(--wine);}.staff-card p{font-size:14px;line-height:1.8;margin:0;color:var(--muted);}.staff-card small{display:block;font-size:12px;margin-top:12px;color:#997a42;}
.school-location{padding-block:80px;background:var(--paper);display:grid;grid-template-columns:.85fr 1.3fr;gap:55px;align-items:center;}.location-copy h2{color:var(--wine);font-size:44px;margin:16px 0;}.location-copy p{font-size:17px;line-height:1.9;margin:0 0 24px;color:var(--muted);}.school-map{border:1px solid var(--line);border-radius:14px;width:100%;height:370px;background:var(--cream);}
.school-complaints{padding-block:88px;background:var(--wine-deep);color:white;display:grid;grid-template-columns:1fr 1.1fr;gap:60px;align-items:start;}.complaints-copy h2{font-size:clamp(36px,4.5vw,57px);line-height:1.4;margin:20px 0;}.complaints-copy h2 em{font-style:normal;color:var(--gold);}.complaints-copy>p{font-size:16px;line-height:2;color:#f4e7e9;}.complaints-copy .complaint-privacy{font-size:13px;color:#e2bfc9;margin-top:26px;padding-top:20px;border-top:1px solid #ffffff22;}
.complaint-form{background:var(--paper);border-radius:14px;padding:32px;color:var(--ink);}.complaint-form label{display:block;font-size:14px;color:var(--wine);font-weight:700;margin-bottom:9px;}.complaint-form label>span{font-weight:400;color:var(--muted);font-size:11px;margin-inline-start:7px;}.complaint-form input,.complaint-form textarea{display:block;width:100%;min-height:46px;border:1px solid var(--line);border-radius:6px;padding:12px;font:inherit;font-size:14px;color:var(--ink);background:white;margin-bottom:23px;}.complaint-form textarea{resize:vertical;line-height:1.8;}.complaint-form input:focus-visible,.complaint-form textarea:focus-visible{outline:2px solid var(--gold);outline-offset:3px;}.complaint-optional{display:grid;grid-template-columns:1fr 1fr;gap:15px;}.complaint-form button{border:0;cursor:pointer;}.complaint-form button:disabled{opacity:.65;cursor:wait;}.complaint-trap{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);}.complaint-form #complaint-result{font-size:13px;line-height:2;margin:16px 0 0;overflow-wrap:anywhere;}.complaint-success{color:#356044;}.complaint-error{color:#a32f42;}
.achievement-dialog{border:0;padding:0;width:min(850px,calc(100vw - 32px));max-height:90dvh;border-radius:12px;background:var(--paper);color:var(--ink);}.achievement-dialog::backdrop{background:#1d0d16bb;}.achievement-dialog>img{display:block;width:100%;max-height:65dvh;object-fit:contain;background:#21181b;}.achievement-dialog>div{padding:24px;}.achievement-dialog h2{color:var(--wine);font-size:23px;margin:0 0 12px;}.achievement-dialog p{color:var(--muted);font-size:14px;line-height:1.9;white-space:pre-line;}.achievement-close{position:absolute;top:12px;left:12px;background:var(--paper);color:var(--wine);border:1px solid var(--line);border-radius:50%;width:40px;height:40px;font-size:28px;cursor:pointer;}
@media(min-width:1081px){.desktop-nav{gap:clamp(12px,1.7vw,24px);}.desktop-nav a{font-size:13px;}}
@media(max-width:1080px){.desktop-nav{display:none;}.header-actions{display:flex;align-items:center;gap:16px;}.menu-toggle{width:34px;height:34px;padding:7px 3px;border:0;background:transparent;display:flex;flex-direction:column;justify-content:center;gap:6px;cursor:pointer;}.menu-toggle span{width:26px;height:2px;background:var(--wine);}.mobile-nav:not([hidden]){position:absolute;top:100%;right:0;left:0;padding:12px 23px 20px;display:flex;flex-direction:column;background:var(--paper);box-shadow:0 14px 18px #28141820;}.mobile-nav a{padding:11px 3px;border-bottom:1px solid var(--line);font-size:14px;}.school-complaints{gap:30px;}.school-location{gap:30px;}}
@media(max-width:750px){.school-community{padding-block:55px;}.achievement-grid,.staff-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;}.school-location,.school-complaints{grid-template-columns:1fr;padding-block:55px;gap:30px;}.school-map{height:330px;}.complaint-form{padding:24px;}.school-community .section-heading{align-items:start;flex-direction:column;gap:15px;}.school-community .section-heading>p{max-width:100%;}.location-copy h2{font-size:35px;}}
@media(max-width:480px){.achievement-grid,.staff-grid{grid-template-columns:1fr;}.complaint-optional{grid-template-columns:1fr;gap:0;}.complaint-form{padding:21px;}.complaints-copy h2{font-size:36px;}.staff-filters button{padding:10px 14px;font-size:12px;}.school-map{height:300px;}.stage-gradient>svg{width:72px;height:72px;}}
@media(max-width:1080px){.header-portal{display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:8px 13px;white-space:nowrap;background:var(--wine);color:var(--gold);font-size:12px;font-weight:700;}.header-portal:focus-visible{outline:2px solid var(--gold);outline-offset:3px;}}
@media(max-width:600px){.header-contact{display:none;}.header-actions{gap:12px;}.header-portal{font-size:11px;padding:8px 11px;}.site-header{gap:12px;}}
@media(max-width:375px){.site-header{padding-inline:15px;gap:8px;}.site-header .brand-logo{width:155px;}.header-actions{gap:8px;}.header-portal{font-size:10px;padding-inline:8px;}.menu-toggle{width:29px;}.menu-toggle span{width:23px;}}