/* School pages: crest colours blended with whichever YBN theme is active.
   Only the colour tokens change; everything else is inherited from base.css. */
.school{
  --school-navy:#041937;   /* sampled from the PS/MS 206 crest */
  --school-gold:#f29d1b;
  --secondary:color-mix(in srgb,var(--school-navy) 55%,var(--theme-secondary));
  --accent:color-mix(in srgb,var(--school-gold) 55%,var(--theme-accent));
}

.s-hero{position:relative;overflow:hidden;isolation:isolate;padding-top:3rem}
.s-hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:2rem;align-items:center;padding-bottom:5rem}
.s-hero h1{font-size:clamp(3.4rem,10vw,9rem);margin:1rem 0 1.25rem}
.s-hero h1 em{font-style:normal;color:var(--text);background:linear-gradient(var(--accent),var(--accent)) 0 88%/100% .32em no-repeat}
.s-hero p.lede{font-size:1.3rem;max-width:30rem}
.s-meta{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.5rem}
.s-meta span{background:var(--secondary);color:var(--on-secondary);font-weight:700;font-size:.85rem;padding:.4rem .9rem;border-radius:3rem}
.s-meta span:nth-child(2n){background:var(--accent);color:var(--on-accent)}
.s-crest{position:relative;display:grid;place-items:center;min-height:26rem}
.s-crest::before{content:"";position:absolute;inset:6% -12% 4% 8%;background:var(--accent);clip-path:polygon(14% 0,100% 8%,86% 100%,0 90%);z-index:-1}
.s-crest img{width:min(100%,25rem);height:auto;transform:rotate(-3deg);filter:drop-shadow(.7rem .7rem 0 var(--secondary))}
.stripes{height:3.5rem;background:repeating-linear-gradient(105deg,var(--secondary) 0 2.2rem,transparent 2.2rem 4.4rem)}

.pillars{display:grid;grid-template-columns:repeat(12,1fr);gap:1.25rem}
.pillar{padding:clamp(1.25rem,3vw,2.25rem);border-radius:.4rem;display:flex;flex-direction:column;justify-content:space-between;gap:2.5rem;min-height:11rem}
.pillar .icon{width:2.4rem;height:2.4rem}
.pillar p{font-size:1rem;margin-top:.5rem;max-width:34rem}
.pillar h3{font-size:clamp(1.6rem,3vw,2.6rem)}
.pillar--secondary{background:var(--secondary);color:var(--on-secondary)}
.pillar--accent{background:var(--accent);color:var(--on-accent)}
.pillar--surface{background:var(--surface)}
.p1{grid-column:1/8}
.p2{grid-column:8/13}
.p3{grid-column:1/5}
.p4{grid-column:5/9}
.p5{grid-column:9/13}
.p6{grid-column:1/13;flex-direction:row;align-items:flex-end;flex-wrap:wrap}
.p6 h3{font-size:clamp(2.2rem,6vw,5rem)}
.p6 .btn{margin-left:auto}
@media (max-width:860px){
  .s-hero .wrap{grid-template-columns:1fr}
  .s-crest{min-height:20rem;order:-1}
  .pillars>*{grid-column:1/-1!important;grid-row:auto!important}
}

/* mission + vision */
.mv{display:grid;grid-template-columns:1.25fr 1fr;gap:1.25rem;align-items:stretch}
.mv__quote{margin:0;display:flex;flex-direction:column;justify-content:space-between;gap:2rem}
.mv__quote p{font-size:clamp(1.9rem,4vw,3.4rem);line-height:1.02}
.mv__quote footer{font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:.8rem}
.mv__vision h3{font-size:2rem;margin:0 0 .75rem}

/* visit */
.s-visit{background:var(--surface)}
.visit{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(1.5rem,5vw,5rem);align-items:end}
.visit h2{font-size:clamp(2.6rem,6vw,5.2rem);margin-bottom:1.25rem}
.visit__history{max-width:34rem;font-size:1.15rem}
.visit__card{font-style:normal;display:grid;gap:.75rem;justify-items:start}
.visit__card h3{margin:0;font-size:2.2rem}
.visit__card a:not(.btn){font-weight:700}
@media (max-width:860px){.mv,.visit{grid-template-columns:1fr}}

/* values */
.values{display:grid;grid-template-columns:repeat(4,1fr);gap:.9rem}
.values li{display:flex;flex-direction:column;justify-content:space-between;gap:1.5rem;min-height:11rem;padding:1.1rem;border-radius:.4rem}
.values b{font-size:5.5rem;line-height:.8}
.values span{font-weight:700;font-size:1.1rem;overflow-wrap:anywhere}
.v1{background:var(--secondary);color:var(--on-secondary)}
.v2{background:var(--accent);color:var(--on-accent)}
.v3{background:var(--text);color:var(--bg)}
.v4{background:var(--surface)}
.v2{margin-top:1.5rem}.v4{margin-top:1.5rem}
@media (max-width:760px){.values{grid-template-columns:1fr 1fr}.values b{font-size:4rem}.v2,.v4{margin-top:0}}

/* two schools + families */
.twin{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem}
.twin h3{font-size:clamp(1.8rem,3.4vw,2.6rem);margin:.4rem 0 .8rem}
.twin p+p{margin-top:.7rem}
.twin .chips{display:flex;flex-wrap:wrap;gap:.4rem}
.twin .chips span{border:2px solid currentColor;border-radius:3rem;padding:.1rem .7rem;font-weight:700;font-size:.9rem}
.twin__note{margin-top:1rem}
@media (max-width:760px){.twin{grid-template-columns:1fr}}

/* student voice */
.s-voice{background:var(--surface)}
.voice{display:grid;grid-template-columns:1fr 1.2fr;gap:clamp(1.5rem,5vw,5rem);align-items:start}
.voice h2{font-size:clamp(2.6rem,6vw,5rem)}
.voice p+p{margin-top:.8rem}
.voice .row{margin-top:1.25rem}
@media (max-width:760px){.voice{grid-template-columns:1fr}}

/* official pages */
.official{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,5vw,5rem);align-items:start}
.official h2{font-size:clamp(2.4rem,5vw,4.2rem);margin-bottom:.8rem}
.official__links{display:grid;gap:.5rem}
.official__links a{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:3.25rem;padding:.4rem 1rem;border-radius:.4rem;background:var(--secondary);color:var(--on-secondary);font-weight:700;text-decoration:none}
.official__links a:hover{background:var(--text)}
@media (max-width:760px){.official{grid-template-columns:1fr}}
