/* Vision & Mission page-only stylesheet. Scoped to .vm-page to protect all other pages. */
.vm-page { --vm-navy:#0B1F3A; --vm-navy-deep:#07182D; --vm-gold:#D4AF37; --vm-cream:#FAF8F1; color:#172033; }
.vm-page .vm-v3-kicker,.vm-page .vm-v3-label { letter-spacing:.16em; font-size:.72rem; font-weight:800; }
.vm-page .vm-hero-v3 { min-height:440px; padding:64px 0 28px; }
.vm-page .vm-hero-v3-inner { padding-bottom:36px; }
.vm-page .vm-hero-v3-copy h1 { font-size:clamp(2.7rem,5.5vw,5.2rem); line-height:.98; }
.vm-page .vm-hero-v3-copy p { max-width:480px; font-size:1rem; line-height:1.75; }
.vm-page .vm-hero-v3-bottom { padding-top:16px; }
.vm-page .vm-foundation-v3 { padding:54px 0; background:var(--vm-cream); }
.vm-page .vm-foundation-grid { gap:36px; }
.vm-page .vm-foundation-title h2 { max-width:540px; font-size:clamp(1.8rem,3.1vw,2.65rem); line-height:1.18; }
.vm-page .vm-foundation-copy p { margin:0; max-width:580px; font-size:1rem; line-height:1.8; color:#465267; }
.vm-page .vm-vision-v3 { padding:66px 0; }
.vm-page .vm-v3-section-head { margin-bottom:28px; }
.vm-page .vm-v3-section-head h2 { font-size:clamp(2rem,4vw,3.3rem); line-height:1.12; }
.vm-page .vm-v3-feature { display:grid; grid-template-columns:68px minmax(145px,.55fr) minmax(0,1.45fr); align-items:start; gap:24px; padding:30px 32px; border:1px solid rgba(11,31,58,.12); border-left:4px solid var(--vm-gold); border-radius:14px; background:#fff; box-shadow:0 14px 36px rgba(11,31,58,.06); }
.vm-page .vm-v3-feature-number { color:var(--vm-gold-dark,#B88A1A); font-size:2.3rem; font-weight:800; line-height:1; }
.vm-page .vm-v3-feature-label { padding-top:5px; font-size:.72rem; font-weight:800; letter-spacing:.12em; color:var(--vm-navy); }
.vm-page .vm-v3-feature-text p { margin:0; color:#465267; font-size:1rem; line-height:1.85; }
.vm-page .vm-mission-v3 { padding:68px 0; background:#F7F8FA; }
.vm-page .vm-mission-grid { gap:clamp(32px,5vw,72px); align-items:center; }
.vm-page .vm-mission-image img { display:block; width:100%; max-height:430px; object-fit:cover; border-radius:16px; }
.vm-page .vm-mission-copy h2 { font-size:clamp(2rem,3.7vw,3rem); line-height:1.13; }
.vm-page .vm-mission-copy>p { color:#465267; font-size:1rem; line-height:1.85; }
.vm-page .vm-mission-words { display:flex; flex-wrap:wrap; gap:8px; }
.vm-page .vm-mission-words span { padding:7px 10px; border:1px solid rgba(11,31,58,.14); border-radius:999px; color:var(--vm-navy); background:#fff; font-size:.68rem; font-weight:800; letter-spacing:.06em; }
.vm-page .vm-goal-v3 { padding:62px 0; }
.vm-page .vm-goal-v3-grid { gap:28px; }
.vm-page .vm-goal-v3-grid h2 { font-size:clamp(2rem,3.8vw,3rem); line-height:1.12; }
.vm-page .vm-goal-v3-grid p { max-width:760px; color:#465267; line-height:1.8; }
/* School Motto is deliberately the visual centre of the page. */
.vm-page .vm-motto-v3 { padding:34px 0 82px; background:#fff; }
.vm-page .vm-motto-v3-card { position:relative; overflow:hidden; display:grid; grid-template-columns:110px minmax(0,1fr); gap:clamp(24px,4vw,56px); padding:clamp(30px,5vw,64px); border-radius:22px; color:#fff; background:linear-gradient(125deg,var(--vm-navy-deep),var(--vm-navy) 65%,#183b68); box-shadow:0 24px 60px rgba(7,24,45,.2); }
.vm-page .vm-motto-v3-card:after { content:""; position:absolute; width:300px; height:300px; right:-100px; top:-140px; border:1px solid rgba(212,175,55,.35); border-radius:50%; box-shadow:0 0 0 35px rgba(212,175,55,.045),0 0 0 70px rgba(212,175,55,.035); pointer-events:none; }
.vm-page .vm-motto-v3-mark { position:relative; z-index:1; color:var(--vm-gold); font-size:clamp(3rem,6vw,5.5rem); font-weight:800; line-height:1; }
.vm-page .vm-motto-v3-content { position:relative; z-index:1; max-width:900px; }
.vm-page .vm-motto-v3-content .vm-v3-kicker { color:var(--vm-gold-light,#F2D36B); }
.vm-page .vm-motto-v3-content h2 { margin:14px 0 24px; color:#fff; font-size:clamp(2.5rem,5.2vw,4.8rem); line-height:1.03; letter-spacing:-.035em; }
.vm-page .vm-motto-v3-content h2 span { color:var(--vm-gold-light,#F2D36B); }
.vm-page .vm-motto-v3-content blockquote { max-width:760px; margin:0; padding:20px 0 0 22px; border-left:3px solid var(--vm-gold); color:rgba(255,255,255,.88); font-size:clamp(1rem,1.35vw,1.16rem); line-height:1.85; }
.vm-page .vm-closing-v3 { padding:55px 0 72px; }
.vm-page .vm-closing-v3-inner { text-align:center; }
.vm-page .vm-closing-v3-inner h2 { font-size:clamp(1.8rem,3.5vw,2.8rem); line-height:1.2; }
@media (max-width:767.98px) {
 .vm-page .vm-hero-v3 { min-height:0; padding:48px 0 24px; }
 .vm-page .vm-hero-v3-inner { padding-bottom:26px; }
 .vm-page .vm-hero-v3-side { display:none; }
 .vm-page .vm-hero-v3-bottom .container { gap:12px; }
 .vm-page .vm-v3-bottom-items { flex-wrap:wrap; gap:9px; }
 .vm-page .vm-foundation-v3,.vm-page .vm-vision-v3,.vm-page .vm-mission-v3,.vm-page .vm-goal-v3 { padding:44px 0; }
 .vm-page .vm-v3-feature { grid-template-columns:42px minmax(0,1fr); gap:12px 16px; padding:23px 20px; }
 .vm-page .vm-v3-feature-number { font-size:1.8rem; }
 .vm-page .vm-v3-feature-label { align-self:center; }
 .vm-page .vm-v3-feature-text { grid-column:1/-1; }
 .vm-page .vm-motto-v3 { padding:16px 0 52px; }
 .vm-page .vm-motto-v3-card { grid-template-columns:1fr; gap:14px; padding:28px 22px; border-radius:16px; }
 .vm-page .vm-motto-v3-mark { font-size:2.6rem; }
 .vm-page .vm-motto-v3-content h2 { margin:12px 0 20px; }
 .vm-page .vm-motto-v3-content blockquote { padding-left:15px; font-size:.98rem; }
}
@media (prefers-reduced-motion:reduce) { .vm-page *, .vm-page *:before, .vm-page *:after { scroll-behavior:auto !important; animation:none !important; transition:none !important; } }

/* Readability refinement: make Vision and Mission more prominent, without affecting other pages. */
.vm-page .vm-v3-feature {
  grid-template-columns: 76px minmax(180px,.62fr) minmax(0,1.38fr);
  gap: 28px;
  padding: 38px 38px;
  border-radius: 16px;
}
.vm-page .vm-v3-feature-number { font-size: clamp(2.6rem, 3.4vw, 3.4rem); }
.vm-page .vm-v3-feature-label { font-size: .86rem; letter-spacing: .1em; line-height: 1.5; }
.vm-page .vm-v3-feature-text p { font-size: clamp(1.12rem, 1.25vw, 1.28rem); line-height: 1.9; }
.vm-page .vm-v3-section-head h2 { font-size: clamp(2.4rem, 4.4vw, 3.8rem); }
.vm-page .vm-mission-copy h2 { font-size: clamp(2.6rem, 4.1vw, 3.7rem); line-height: 1.08; max-width: 720px; }
.vm-page .vm-mission-copy>p { font-size: clamp(1.08rem, 1.2vw, 1.2rem); line-height: 1.9; }
.vm-page .vm-goal-v3-grid h2 { font-size: clamp(2.3rem, 4vw, 3.4rem); }
@media (max-width: 767.98px) {
  .vm-page .vm-v3-feature { grid-template-columns: 44px minmax(0,1fr); gap: 14px 16px; padding: 25px 20px; }
  .vm-page .vm-v3-feature-number { font-size: 2rem; }
  .vm-page .vm-v3-feature-label { font-size: .78rem; }
  .vm-page .vm-v3-feature-text p { font-size: 1.06rem; line-height: 1.8; }
  .vm-page .vm-mission-copy h2 { font-size: clamp(2.1rem, 8vw, 2.8rem); }
}


/* Final visual balance: consistent bold section numbers, clear Goal, refined Motto */
.vm-page .vm-v3-feature-number,
.vm-page .vm-mission-number,
.vm-page .vm-goal-v3-number,
.vm-page .vm-motto-v3-mark {
    display: block;
    font-size: clamp(3.1rem, 4.2vw, 3.8rem) !important;
    font-weight: 900 !important;
    line-height: .95 !important;
    letter-spacing: -.045em !important;
    opacity: 1 !important;
    text-shadow: none !important;
    filter: none !important;
}

/* 01 Vision and 02 Mission use the same strong gold treatment. */
.vm-page .vm-v3-feature-number,
.vm-page .vm-mission-number {
    color: #C18F16 !important;
    -webkit-text-fill-color: #C18F16 !important;
}
.vm-page .vm-mission-copy { position: relative; }
.vm-page .vm-mission-number { margin: 0 0 .45rem; }
.vm-page .vm-mission-copy > .vm-v3-kicker {
    display: inline-block;
    font-size: .82rem;
    font-weight: 800;
    letter-spacing: .12em;
    opacity: 1 !important;
}

/* 03 Goal: white number for strong contrast on the navy section. */
.vm-page .vm-goal-v3-number {
    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;
}

/* 04 Motto: navy number, not pale yellow, for strong contrast on soft gold. */
.vm-page .vm-motto-v3-card {
    background: #E5B84B !important;
    border-color: #D5A637;
}
.vm-page .vm-motto-v3-card::before { background: #102650; }
.vm-page .vm-motto-v3-mark {
    color: #102650 !important;
    -webkit-text-fill-color: #102650 !important;
}
.vm-page .vm-motto-v3-content .vm-v3-kicker,
.vm-page .vm-motto-v3-content h2,
.vm-page .vm-motto-v3-content h2 span,
.vm-page .vm-motto-v3-content blockquote {
    color: #102650 !important;
}
.vm-page .vm-image-caption span {
    color: #C18F16 !important;
    font-weight: 900 !important;
    font-size: 1.15rem !important;
    opacity: 1 !important;
}
.vm-page .vm-image-caption {
    font-weight: 800 !important;
    opacity: 1 !important;
}
@media (max-width: 767.98px) {
    .vm-page .vm-v3-feature-number,
    .vm-page .vm-mission-number,
    .vm-page .vm-goal-v3-number,
    .vm-page .vm-motto-v3-mark {
        font-size: 2.8rem !important;
    }
}


/* Scroll-in animations for this page only. Content stays visible if JS is unavailable. */
.vm-page.vm-scroll-ready .vm-vision-v3 .vm-v3-section-head,
.vm-page.vm-scroll-ready .vm-vision-v3 .vm-v3-feature,
.vm-page.vm-scroll-ready .vm-mission-v3 .vm-mission-image,
.vm-page.vm-scroll-ready .vm-mission-v3 .vm-mission-copy,
.vm-page.vm-scroll-ready .vm-goal-v3 .vm-goal-v3-grid,
.vm-page.vm-scroll-ready .vm-motto-v3 .vm-motto-v3-card,
.vm-page.vm-scroll-ready .vm-foundation-v3 .vm-foundation-title,
.vm-page.vm-scroll-ready .vm-foundation-v3 .vm-foundation-copy {
    opacity: 0;
    transition: opacity .75s ease, transform .8s cubic-bezier(.2,.7,.2,1);
    will-change: opacity, transform;
}
.vm-page.vm-scroll-ready .vm-vision-v3 .vm-v3-section-head,
.vm-page.vm-scroll-ready .vm-foundation-v3 .vm-foundation-title,
.vm-page.vm-scroll-ready .vm-mission-v3 .vm-mission-image {
    transform: translate3d(-52px,0,0);
}
.vm-page.vm-scroll-ready .vm-vision-v3 .vm-v3-feature,
.vm-page.vm-scroll-ready .vm-foundation-v3 .vm-foundation-copy,
.vm-page.vm-scroll-ready .vm-goal-v3 .vm-goal-v3-grid,
.vm-page.vm-scroll-ready .vm-motto-v3 .vm-motto-v3-card {
    transform: translate3d(0,38px,0);
}
.vm-page.vm-scroll-ready .vm-mission-v3 .vm-mission-copy {
    transform: translate3d(52px,0,0);
}
.vm-page.vm-scroll-ready .vm-vision-v3 .vm-vm-in-view,
.vm-page.vm-scroll-ready .vm-mission-v3 .vm-vm-in-view,
.vm-page.vm-scroll-ready .vm-goal-v3 .vm-vm-in-view,
.vm-page.vm-scroll-ready .vm-motto-v3 .vm-vm-in-view,
.vm-page.vm-scroll-ready .vm-foundation-v3 .vm-vm-in-view {
    opacity: 1;
    transform: translate3d(0,0,0);
}
@media (prefers-reduced-motion: reduce) {
    .vm-page.vm-scroll-ready .vm-vision-v3 .vm-v3-section-head,
    .vm-page.vm-scroll-ready .vm-vision-v3 .vm-v3-feature,
    .vm-page.vm-scroll-ready .vm-mission-v3 .vm-mission-image,
    .vm-page.vm-scroll-ready .vm-mission-v3 .vm-mission-copy,
    .vm-page.vm-scroll-ready .vm-goal-v3 .vm-goal-v3-grid,
    .vm-page.vm-scroll-ready .vm-motto-v3 .vm-motto-v3-card,
    .vm-page.vm-scroll-ready .vm-foundation-v3 .vm-foundation-title,
    .vm-page.vm-scroll-ready .vm-foundation-v3 .vm-foundation-copy {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
    /* Vision & Mission hero: brighten the existing background image */
.vm-page .vm-hero-v3-bg {
    filter: brightness(1.4) saturate(1.08) !important;
}

/* Keep the navy overlay, but make it less dark */
.vm-page .vm-hero-v3-overlay {
    opacity: 0.65 !important;
}
}

/* Approved page refinement: align hero with Contact, balance type, and clarify Goal/Motto contrast. */
.vm-page .vm-hero-v3 {
  min-height: clamp(230px, 34vw, 430px);
  padding: 0;
  isolation: isolate;
}
.vm-page .vm-hero-v3-bg {
  filter: brightness(1.18) saturate(1.06);
  transform: scale(1.055);
  animation: vmHeroImageSettle 1.2s cubic-bezier(.2,.7,.2,1) both;
  will-change: transform;
}
.vm-page .vm-hero-v3-overlay {
  opacity: 1;
  background: linear-gradient(90deg, rgba(4,19,38,.78) 0%, rgba(4,19,38,.62) 46%, rgba(4,19,38,.28) 76%, rgba(4,19,38,.18) 100%);
}
.vm-page .vm-hero-v3-inner { padding-top: 30px; padding-bottom: 54px; }
.vm-page .vm-hero-v3-copy { padding: 24px 0; }
.vm-page .vm-hero-v3-copy h1 { font-size: clamp(2.65rem, 5.2vw, 4.6rem); line-height: .98; margin: 14px 0 18px; }
.vm-page .vm-hero-v3-copy p { font-size: clamp(1rem, 1.2vw, 1.08rem); line-height: 1.75; }
.vm-page .vm-hero-v3-bottom { padding: 13px 0; }
.vm-page .vm-v3-side-number { font-size: clamp(3rem, 4.5vw, 4.5rem); }

/* Consistent section typography */
.vm-page .vm-foundation-v3 { padding: clamp(48px, 6vw, 72px) 0; }
.vm-page .vm-foundation-title h2 { font-size: clamp(1.9rem, 3.2vw, 2.8rem); line-height: 1.16; }
.vm-page .vm-foundation-copy p { font-size: clamp(1rem, 1.2vw, 1.08rem); line-height: 1.85; }
.vm-page .vm-vision-v3 { padding: clamp(54px, 6.5vw, 78px) 0; }
.vm-page .vm-v3-section-head h2 { font-size: clamp(2.15rem, 4vw, 3.25rem); line-height: 1.08; }
.vm-page .vm-v3-feature { grid-template-columns: 64px minmax(150px,.58fr) minmax(0,1.42fr); gap: 22px; padding: clamp(25px, 3.2vw, 36px); }
.vm-page .vm-v3-feature-number { font-size: clamp(2.4rem, 3.2vw, 3.1rem) !important; }
.vm-page .vm-v3-feature-label { font-size: .76rem; line-height: 1.5; }
.vm-page .vm-v3-feature-text p { font-size: clamp(1rem, 1.15vw, 1.08rem); line-height: 1.85; }
.vm-page .vm-mission-v3 { padding: clamp(56px, 6.5vw, 80px) 0; }
.vm-page .vm-mission-grid { gap: clamp(36px, 5vw, 64px); }
.vm-page .vm-mission-copy h2 { font-size: clamp(2.05rem, 3.7vw, 3.15rem); line-height: 1.1; }
.vm-page .vm-mission-copy > p { font-size: clamp(1rem, 1.15vw, 1.08rem); line-height: 1.85; }

/* Goal is a deliberate navy section; text remains high-contrast. */
.vm-page .vm-goal-v3 {
  padding: clamp(54px, 6.5vw, 78px) 0;
  background: #071a32;
  color: #fff;
}
.vm-page .vm-goal-v3 .vm-v3-kicker { color: #e5c35c; }
.vm-page .vm-goal-v3-grid h2 { font-size: clamp(2.15rem, 3.8vw, 3.15rem); line-height: 1.1; color: #fff; }
.vm-page .vm-goal-v3-grid h2 span { color: #e5c35c; }
.vm-page .vm-goal-v3-grid p { color: rgba(255,255,255,.84); font-size: clamp(1rem, 1.15vw, 1.08rem); line-height: 1.85; }
.vm-page .vm-goal-v3-number { color: #fff !important; -webkit-text-fill-color: #fff !important; }

/* Gold School Motto panel, refined to complement—not overpower—the navy Goal section. */
.vm-page .vm-motto-v3 { padding: clamp(28px, 4vw, 44px) 0 clamp(52px, 6vw, 70px); background: #fff; }
.vm-page .vm-motto-v3-card {
  grid-template-columns: 86px minmax(0,1fr);
  gap: clamp(22px, 3.5vw, 42px);
  padding: clamp(28px, 4vw, 46px);
  border: 1px solid #d8ad3b;
  border-radius: 18px;
  background: #e5b84b !important;
  box-shadow: 0 18px 42px rgba(16,36,62,.12);
  color: #102650;
}
.vm-page .vm-motto-v3-card:before { background: #102650; }
.vm-page .vm-motto-v3-card:after { border-color: rgba(16,38,80,.2); box-shadow: 0 0 0 35px rgba(16,38,80,.045), 0 0 0 70px rgba(16,38,80,.025); }
.vm-page .vm-motto-v3-mark { font-size: clamp(2.8rem, 4vw, 3.6rem) !important; color: #102650 !important; -webkit-text-fill-color: #102650 !important; }
.vm-page .vm-motto-v3-content .vm-v3-kicker { color: #102650 !important; }
.vm-page .vm-motto-v3-content h2 { margin: 12px 0 20px; font-size: clamp(2.15rem, 4vw, 3.25rem); line-height: 1.08; color: #102650 !important; }
.vm-page .vm-motto-v3-content h2 span { color: #102650 !important; text-decoration: underline; text-decoration-color: rgba(16,38,80,.45); text-decoration-thickness: 3px; text-underline-offset: 5px; }
.vm-page .vm-motto-v3-content blockquote { max-width: 780px; padding-top: 14px; color: #263750 !important; font-size: clamp(.98rem, 1.15vw, 1.08rem); line-height: 1.8; border-left-color: #102650; }

@keyframes vmHeroImageSettle {
  from { transform: scale(1.09); }
  to { transform: scale(1.055); }
}
@media (max-width: 991.98px) {
  .vm-page .vm-hero-v3 { min-height: clamp(250px, 40vw, 380px); }
  .vm-page .vm-v3-feature { grid-template-columns: 54px minmax(130px,.55fr) minmax(0,1.45fr); }
  .vm-page .vm-goal-v3-grid { grid-template-columns: 86px minmax(0,1fr); gap: 24px; }
}
@media (max-width: 767.98px) {
  .vm-page .vm-hero-v3 { min-height: 300px; }
  .vm-page .vm-hero-v3-inner { padding: 28px 0 62px; }
  .vm-page .vm-hero-v3-copy { padding: 12px 0; }
  .vm-page .vm-hero-v3-copy h1 { font-size: clamp(2.45rem, 11vw, 3.3rem); line-height: .98; margin: 12px 0 14px; }
  .vm-page .vm-hero-v3-copy p { max-width: 95%; font-size: .98rem; }
  .vm-page .vm-hero-v3-bottom { padding: 10px 0; }
  .vm-page .vm-v3-scroll { display: none; }
  .vm-page .vm-hero-v3-bottom .container { justify-content: flex-start; }
  .vm-page .vm-v3-bottom-items { gap: 9px; font-size: .61rem; }
  .vm-page .vm-v3-bottom-items i { width: 12px; }
  .vm-page .vm-foundation-v3,.vm-page .vm-vision-v3,.vm-page .vm-mission-v3,.vm-page .vm-goal-v3 { padding: 44px 0; }
  .vm-page .vm-v3-section-head { display: block; margin-bottom: 26px; }
  .vm-page .vm-v3-section-head h2 { margin-top: 12px; text-align: left; font-size: clamp(2rem, 8.5vw, 2.65rem); }
  .vm-page .vm-v3-feature { grid-template-columns: 42px minmax(0,1fr); gap: 12px 15px; padding: 23px 20px; }
  .vm-page .vm-v3-feature-number { font-size: 2rem !important; }
  .vm-page .vm-v3-feature-label { align-self: center; }
  .vm-page .vm-v3-feature-text { grid-column: 1 / -1; }
  .vm-page .vm-v3-feature-text p { font-size: 1rem; }
  .vm-page .vm-mission-grid { gap: 30px; }
  .vm-page .vm-mission-image { padding-left: 16px; padding-bottom: 22px; }
  .vm-page .vm-mission-image img { height: 270px; }
  .vm-page .vm-mission-copy h2 { font-size: clamp(2rem, 8vw, 2.7rem); }
  .vm-page .vm-goal-v3-grid { grid-template-columns: 1fr; gap: 16px; }
  .vm-page .vm-goal-v3-number { font-size: 2.8rem !important; }
  .vm-page .vm-goal-v3-grid h2 { font-size: clamp(2rem, 8vw, 2.7rem); }
  .vm-page .vm-motto-v3 { padding: 18px 0 46px; }
  .vm-page .vm-motto-v3-card { grid-template-columns: 1fr; gap: 12px; padding: 26px 22px; border-radius: 14px; }
  .vm-page .vm-motto-v3-mark { font-size: 2.5rem !important; }
  .vm-page .vm-motto-v3-content h2 { font-size: clamp(2rem, 8vw, 2.7rem); margin-bottom: 16px; }
  .vm-page .vm-motto-v3-content blockquote { padding-left: 14px; font-size: .96rem; }
}
@media (prefers-reduced-motion: reduce) {
  .vm-page .vm-hero-v3-bg { animation: none !important; transform: none !important; }
}