/* Fluid responsive sizing across phones, tablets, laptops, and wide screens. */
html{-webkit-text-size-adjust:100%}
body{width:100%;min-width:0}
img,svg,video{display:block;max-width:100%}
button,input,select,textarea{max-width:100%}
.shell{width:min(1180px,calc(100% - clamp(32px,6vw,80px)))}
.nav{gap:clamp(18px,3vw,42px)}
.brand{flex:0 1 350px;min-width:0}
.brand img{width:clamp(205px,24vw,350px);height:auto;max-height:112px}
.nav-links{gap:clamp(14px,2vw,30px)}
.hero{min-height:min(830px,100svh)}
.hero-grid{min-height:clamp(600px,calc(100svh - 132px),670px);gap:clamp(24px,5vw,72px)}
.hero h1{font-size:clamp(4rem,10vw,9rem);overflow-wrap:anywhere}
.hero-copy,.mission-copy,.commission-copy,.connect-copy{min-width:0}
.lede{font-size:clamp(1rem,1.4vw,1.12rem)}
.actions{flex-wrap:wrap}
.button{min-height:48px}
.hero-mark{width:100%;height:clamp(380px,42vw,570px)}
.section{padding-block:clamp(76px,10vw,120px)}
.mission-grid{grid-template-columns:minmax(120px,.6fr) minmax(0,1.8fr) minmax(180px,.8fr);gap:clamp(30px,6vw,70px)}
.path{padding:clamp(76px,8vw,100px) clamp(24px,7vw,110px)}
.path h2{font-size:clamp(3.5rem,7vw,5rem)}
.connect-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(48px,8vw,100px)}
.connect-card{grid-template-columns:minmax(0,1fr) auto}
.connect-card strong{min-width:0}
.footer-grid{grid-template-columns:minmax(210px,260px) minmax(0,1fr) auto;gap:clamp(28px,5vw,50px)}
.legal span:last-child{max-width:760px;text-align:right}
.outreach-dialog{max-width:calc(100vw - 32px)}

@media (max-width:1080px){
  .nav-links{gap:14px;font-size:.76rem;letter-spacing:.05em}
  .nav-cta{padding:10px 12px}
  .hero-grid{grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr)}
  .mission-grid{grid-template-columns:150px minmax(0,1fr)}
  .mission blockquote{grid-column:2;margin:10px 0 0}
}
@media (max-width:900px){
  .brand{flex-basis:auto}.brand img{width:clamp(190px,40vw,225px)}
  .nav-links{gap:22px;font-size:.84rem}.hero{min-height:auto}
  .hero-grid{grid-template-columns:1fr;min-height:clamp(620px,84svh,760px);padding-block:clamp(64px,10vw,90px) 40px}
  .hero h1{font-size:clamp(4rem,15vw,7.5rem)}
  .mission-grid{grid-template-columns:1fr}.mission blockquote{grid-column:auto}
  .connect-grid,.footer-grid{grid-template-columns:1fr}
  .legal span:last-child{text-align:left}
}
@media (max-width:560px){
  .shell{width:calc(100% - 32px)}
  .hero-grid{min-height:auto;padding-block:clamp(92px,24vw,128px) 72px}
  .hero h1{font-size:clamp(3.65rem,19vw,5.3rem)}
  .eyebrow,.overline{letter-spacing:.15em}
  .section,.path{padding:clamp(68px,18vw,82px) 16px}
  .mission h2,.commission h2,.connect h2{font-size:clamp(3.1rem,16vw,4.3rem)}
  .path h2{font-size:clamp(3.25rem,17vw,4rem)}.big-script{font-size:clamp(10rem,58vw,15rem)}
  .connect-card{gap:12px;padding-inline:4px}.connect-card strong{font-size:clamp(1.45rem,7vw,1.8rem)}
  .actions{display:grid;grid-template-columns:1fr}
  .actions .button{width:100%;justify-content:space-between}
  .connect-card{grid-template-columns:minmax(0,1fr) auto}
  .connect-card strong{min-width:0;overflow-wrap:anywhere}
  .outreach-dialog{width:calc(100% - 20px);max-height:calc(100dvh - 20px);padding:32px 18px}
  .outreach-dialog h2{font-size:clamp(2.5rem,13vw,3rem)}.artist-dialog h3{font-size:1.45rem}
  .footer-grid img{width:min(230px,75vw);height:auto}
}
@media (max-width:380px){
  .shell{width:calc(100% - 24px)}.brand img{width:180px}.hero h1{font-size:3.45rem}
  .button{gap:12px;padding:13px 16px}.marquee{font-size:1.15rem}
}
@media (min-width:1500px){
  .shell{width:calc(100% - clamp(96px,8vw,180px));max-width:none}
  .hero-grid{min-height:clamp(720px,72vh,920px)}
  .hero h1{font-size:clamp(8rem,7vw,11rem)}
  .path{padding-inline:clamp(80px,8vw,150px)}
}
@media (min-width:1900px){
  .shell{width:calc(100% - clamp(140px,9vw,360px))}
  .nav{height:clamp(110px,7vw,150px)}
  .brand img{width:clamp(300px,18vw,460px);max-height:130px}
  .nav-links{font-size:clamp(.9rem,.72vw,1.15rem);gap:clamp(24px,2vw,48px)}
  .hero{padding-top:clamp(110px,7vw,150px)}
  .hero-grid{grid-template-columns:minmax(0,1.05fr) minmax(500px,.95fr);min-height:clamp(800px,72vh,1120px)}
  .hero h1{font-size:clamp(10rem,7vw,15rem)}
  .lede{max-width:clamp(700px,38vw,1000px);font-size:clamp(1.15rem,1vw,1.45rem)}
  .eyebrow,.overline{font-size:clamp(.82rem,.65vw,1rem)}
  .button{padding:clamp(16px,1vw,22px) clamp(22px,1.5vw,34px);font-size:clamp(.82rem,.65vw,1rem)}
  .hero-mark{height:clamp(600px,36vw,900px)}
  .be-light-art{width:min(34vw,760px);height:clamp(600px,36vw,900px)}
  .verse{font-size:clamp(.9rem,.7vw,1.1rem)}
  .section{padding-block:clamp(120px,8vw,190px)}
  .mission h2,.commission h2,.connect h2{font-size:clamp(6rem,5vw,8rem)}
}
/* Keep the moving ministry banner seamless across wide displays. */
.marquee > div {
  display: flex;
  width: max-content;
}

.marquee > div > span {
  display: inline-flex;
  align-items: center;
  justify-content: space-around;
  min-width: 100vw;
}