/* Approved photo replacements — local review, September 24. */
.approved-hero-grid>img{aspect-ratio:16/9;width:100%;height:auto;max-height:none;object-fit:cover;justify-self:center;object-position:center}
.room-view img{object-fit:contain;object-position:center;background:#111d40}
.activity-view img{object-fit:contain;object-position:center;background:#111d40}
@media(max-width:780px){.approved-hero-grid>img{width:100%;height:auto;max-height:580px}.story-visual.room-view,.story-visual.activity-view{bottom:32%}.room-view img{object-position:center top}.activity-view img{object-position:center top}}

/* Blend the approved landscape discovery photo into the story background. */
.story-visual.activity-view{display:flex;align-items:center;justify-content:center}
.story-visual.activity-view img{
 width:100%;height:auto;max-height:100%;aspect-ratio:16/9;flex:none;
 object-fit:contain;object-position:center;background:transparent;
 -webkit-mask-image:linear-gradient(to right,transparent,#000 7%,#000 85%,transparent),linear-gradient(to bottom,transparent,#000 10%,#000 78%,transparent);
 mask-image:linear-gradient(to right,transparent,#000 7%,#000 85%,transparent),linear-gradient(to bottom,transparent,#000 10%,#000 78%,transparent);
 -webkit-mask-composite:source-in;mask-composite:intersect;
}

/* Slightly larger classroom, with feathered edges against the story background. */
.story-visual.room-view{right:36%;display:flex;align-items:center;justify-content:center}
.story-visual.room-view img{
 width:100%;height:auto;max-height:100%;aspect-ratio:4/3;object-fit:contain;object-position:center;background:transparent;
 -webkit-mask-image:linear-gradient(to right,transparent,#000 7%,#000 85%,transparent),linear-gradient(to bottom,transparent,#000 9%,#000 83%,transparent);
 mask-image:linear-gradient(to right,transparent,#000 7%,#000 85%,transparent),linear-gradient(to bottom,transparent,#000 9%,#000 83%,transparent);
 -webkit-mask-composite:source-in;mask-composite:intersect;
}
@media(max-width:780px){.story-visual.room-view{right:0;bottom:28%;align-items:flex-start}.story-visual.room-view img{width:108%;max-width:none;flex:none;max-height:none}}

.visit .socials{flex-wrap:wrap;row-gap:14px}

/* Larger, edge-blended opening classroom photo. */
.approved-hero{overflow:hidden;padding-block:42px 50px}
.approved-hero-grid{grid-template-columns:minmax(0,.95fr) minmax(0,1.1fr);gap:3%;min-height:540px}
.approved-hero-grid>div{position:relative;z-index:1}
.approved-hero-grid>img{
 width:calc(100% + 80px);max-width:none;height:clamp(440px,43vw,590px);max-height:none;
 aspect-ratio:auto;object-fit:cover;object-position:38% center;border-radius:0;
 -webkit-mask-image:linear-gradient(to right,transparent,#000 12%,#000 76%,transparent),linear-gradient(to bottom,transparent,#000 12%,#000 84%,transparent);
 mask-image:linear-gradient(to right,transparent,#000 12%,#000 76%,transparent),linear-gradient(to bottom,transparent,#000 12%,#000 84%,transparent);
 -webkit-mask-composite:source-in;mask-composite:intersect;
}
@media(max-width:780px){
 .approved-hero{padding-block:30px 18px}
 .approved-hero-grid{grid-template-columns:minmax(0,1fr);gap:12px;min-height:0}
 .approved-hero-grid>img{width:calc(100% + 36px);height:clamp(310px,95vw,460px);object-position:33% center}
}

/* Fade the learning-corner layer itself so its composited edge cannot show. */
.story-visual.corner-view{
 -webkit-mask-image:linear-gradient(to right,#000 70%,transparent);
 mask-image:linear-gradient(to right,#000 70%,transparent);
}
.story-visual.corner-view:after{inset:-2px}

/* Keep each mobile photo and its caption together within the sticky scene. */
@media(max-width:780px){
 #school-world .story-scene{
  display:flex;flex-direction:column;justify-content:center;
  padding-bottom:96px;
 }
 #school-world .story-visual{
  position:relative;inset:auto;width:100%;height:auto;min-height:0;
  flex:0 1 auto;display:flex;align-items:center;justify-content:center;
  -webkit-mask-image:none;mask-image:none;
 }
 #school-world .story-visual img{
  width:100%;max-width:none;height:auto;max-height:calc(100svh - 380px);
  aspect-ratio:auto;object-fit:contain;object-position:center;background:transparent;
  -webkit-mask-image:linear-gradient(to bottom,#000 65%,transparent 100%);
  mask-image:linear-gradient(to bottom,#000 65%,transparent 100%);
  -webkit-mask-composite:source-over;mask-composite:add;
 }
 #school-world .story-visual:after{content:none}
 #school-world .story-copy{
  position:relative;inset:auto;transform:none;flex:none;
  width:86%;margin:8px auto 0;
 }
}
@media(max-width:780px) and (max-height:700px){
 #school-world .story-scene{padding-bottom:78px}
 #school-world .story-visual img{max-height:calc(100svh - 330px)}
 #school-world .story-copy{margin-top:4px}
}

/* Keep short landscape screens readable without changing portrait or desktop. */
@media(orientation:landscape) and (max-height:600px) and (max-width:1100px){
 #school-world .story-stage{min-height:0}
 #school-world .story-scene{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr);align-items:center;gap:4%;padding:12px 5% 55px}
 #school-world .story-visual{position:relative;inset:auto;grid-column:2;grid-row:1;width:100%;height:100%;min-height:0;display:flex;align-items:center;justify-content:center;-webkit-mask-image:none;mask-image:none}
 #school-world .story-visual img{width:auto;height:auto;max-width:100%;max-height:100%;aspect-ratio:auto;object-fit:contain;object-position:center;background:transparent;-webkit-mask-image:linear-gradient(to bottom,#000 72%,transparent);mask-image:linear-gradient(to bottom,#000 72%,transparent);-webkit-mask-composite:source-over;mask-composite:add}
 #school-world .story-visual:after{content:none}
 #school-world .story-copy{position:relative;inset:auto;grid-column:1;grid-row:1;width:100%;margin:0;transform:none}
 #school-world .story-copy h2{font-size:clamp(19px,3vw,26px);line-height:1.4}
 #school-world .story-copy p{font-size:13px;line-height:1.6;margin:8px 0 0}
 #school-world .story-copy .eyebrow{font-size:11px;margin-bottom:7px}
 #school-world .story-nav{left:auto;right:5%;bottom:15px;gap:18px}
 #school-world .story-nav span{font-size:10px;padding-top:7px}
 #school-world .story-skip{left:5%;bottom:15px;font-size:11px}
}

.contact-direct .contact-address{display:block;margin-top:8px}
.contact-direct a{display:inline-block;white-space:nowrap}
html.photo-open{overflow:hidden}
#photo-dialog{width:min(1100px,96vw);height:90vh;height:90svh;max-width:96vw;max-height:94svh;border:0;border-radius:16px;padding:0;overflow:hidden;background:#101c38}
#photo-dialog[open]{display:flex;flex-direction:column}
#photo-dialog .photo-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex:none;padding:8px 12px;color:white;background:#101c38;direction:rtl}
#photo-dialog .photo-controls{display:flex;align-items:center;gap:8px;direction:ltr}
#photo-dialog .photo-toolbar button{position:static;min-width:44px;width:auto;height:44px;padding:0 12px;display:grid;place-items:center;border:1px solid #ffffff45;border-radius:9px;background:#ffffff0d;color:white;font-size:23px;line-height:1}
#photo-dialog .photo-toolbar button:disabled{opacity:.35;cursor:default}
#photo-dialog .photo-toolbar button:focus-visible{outline:3px solid #ef7ca3;outline-offset:2px}
#photo-dialog .photo-controls output{min-width:45px;text-align:center;font-size:13px;font-family:Arial,sans-serif}
#photo-dialog .photo-viewport{position:relative;flex:1;min-height:0;width:100%;overflow:auto;direction:ltr;overscroll-behavior:contain;touch-action:pan-x pan-y}
#photo-dialog .photo-canvas{position:relative;min-width:100%;min-height:100%}
#photo-dialog .photo-canvas img{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:var(--photo-width);height:var(--photo-height);max-width:none;max-height:none;margin:0;object-fit:contain;user-select:none;-webkit-user-drag:none}
#photo-dialog p{flex:none;margin:0;padding:12px 18px;color:white;font-size:15px;line-height:1.6;text-align:center}
#photo-dialog p:empty{display:none}
@media(max-width:780px){
 #photo-dialog{width:100vw;max-width:100vw;height:100vh;height:100dvh;max-height:100dvh;border-radius:0;margin:0}
 #photo-dialog .photo-toolbar{padding-top:max(8px,env(safe-area-inset-top));padding-inline:10px}
 #photo-dialog p{font-size:14px;padding-bottom:max(12px,env(safe-area-inset-bottom))}
}