.initiatives-page{background:var(--paper)}

/* Full-width page header */
.initiatives-hero{
  padding:0 0 86px;
  background:var(--paper);
  border-bottom:1px solid var(--ink);
}
.initiatives-hero-banner{
  position:relative;
  width:100%;
  height:clamp(500px,55vw,760px);
  margin:0;
  overflow:hidden;
  border-bottom:1px solid var(--ink);
  background:#c9c5bf;
}
.initiatives-hero-banner>img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 48%;
  filter:saturate(.78) contrast(1.03);
}
.initiatives-hero-banner:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.02) 25%,rgba(0,0,0,.26) 100%);
  pointer-events:none;
}
.initiatives-hero-overlay{
  position:absolute;
  z-index:2;
  left:0;
  right:0;
  bottom:0;
  padding:0 0 34px;
}
.initiatives-hero-panel{
  width:min(850px,76vw);
  padding:25px 30px 27px;
  background:rgba(242,238,233,.86);
  border:1px solid var(--ink);
  backdrop-filter:blur(9px);
  -webkit-backdrop-filter:blur(9px);
  box-shadow:12px 12px 0 rgba(12,12,12,.13);
}
.initiatives-meta{
  display:flex;
  align-items:center;
  gap:16px;
  margin-bottom:13px;
  font-size:10px;
  font-weight:900;
  line-height:1;
  letter-spacing:.19em;
  text-transform:uppercase;
}
.initiatives-meta:after{
  content:"";
  width:min(180px,22vw);
  height:1px;
  background:currentColor;
  opacity:.48;
}
.initiatives-title{
  margin:0;
  font-size:clamp(62px,8.8vw,132px);
  font-weight:950;
  line-height:.77;
  letter-spacing:-.083em;
  text-transform:uppercase;
}
.initiatives-title .blue{color:var(--blue);font-style:italic;font-weight:850}
.initiatives-hero-copy{
  display:grid;
  grid-template-columns:minmax(0,880px) 1fr;
  gap:52px;
  align-items:end;
  padding-top:35px;
}
.initiatives-intro{
  margin:0;
  font-size:18px;
  line-height:1.58;
}
.initiatives-hero-note{
  justify-self:end;
  padding-bottom:4px;
  font-size:10px;
  font-weight:900;
  letter-spacing:.18em;
  text-align:right;
  text-transform:uppercase;
  color:rgba(12,12,12,.55);
}

/* Projects */
.initiatives-section{padding:108px 0 128px;background:#fff}
.initiatives-heading{
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:32px;
  margin-bottom:58px;
}
.initiatives-heading h2{
  margin:0;
  font-size:clamp(52px,7vw,102px);
  line-height:.82;
  letter-spacing:-.07em;
  text-transform:uppercase;
}
.initiatives-heading p{
  max-width:330px;
  margin:0 0 6px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.initiatives-grid{
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:24px;
  align-items:stretch;
}
.initiative-card{
  --card-bg:var(--paper);
  display:flex;
  flex-direction:column;
  min-width:0;
  height:auto;
  min-height:0;
  margin:0;
  overflow:hidden;
  border:1px solid var(--ink);
  background:var(--card-bg);
  transition:transform .3s ease,box-shadow .3s ease;
}
.initiative-card:hover{
  transform:translateY(-5px);
  box-shadow:10px 10px 0 rgba(12,12,12,.12);
}
.initiative-card:nth-child(1){grid-column:1/8;--card-bg:var(--violet)}
.initiative-card:nth-child(2){grid-column:8/13;--card-bg:var(--paper)}
.initiative-card:nth-child(3){grid-column:1/6;--card-bg:var(--coral)}
.initiative-card:nth-child(4){grid-column:6/13;--card-bg:var(--acid)}
.initiative-image{
  position:relative;
  flex:0 0 500px;
  height:500px;
  overflow:hidden;
  border-bottom:1px solid var(--ink);
  background:#bbb;
}
.initiative-image:after{display:none}
.initiative-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  filter:saturate(.82) contrast(1.02);
  transition:transform .6s ease;
}
.initiative-card:hover .initiative-image img{transform:scale(1.025)}
.initiative-card:nth-child(1) .initiative-image img{object-position:center 50%}
.initiative-card:nth-child(2) .initiative-image img{object-position:center 54%}
.initiative-card:nth-child(3) .initiative-image img{object-position:center 48%}
.initiative-card:nth-child(4) .initiative-image img{object-position:center 68%}
.card-tag{
  position:absolute;
  z-index:3;
  top:16px;
  left:16px;
  padding:8px 10px;
  border:1px solid var(--ink);
  background:rgba(242,238,233,.92);
  font-size:9px;
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.initiative-content{
  display:flex;
  flex:1 1 auto;
  min-height:0;
  flex-direction:column;
  justify-content:flex-start;
  padding:28px 32px 30px;
  background:var(--card-bg);
}
.initiative-number{
  display:flex;
  align-items:center;
  gap:13px;
  font-size:10px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.initiative-number:after{
  content:"";
  height:1px;
  flex:1;
  background:currentColor;
  opacity:.4;
}
.initiative-content h3{
  margin:22px 0 17px;
  max-width:760px;
  font-size:clamp(33px,3.2vw,49px);
  line-height:.9;
  letter-spacing:-.058em;
  text-transform:uppercase;
}
.initiative-card:nth-child(2) .initiative-content h3,
.initiative-card:nth-child(3) .initiative-content h3{
  font-size:clamp(29px,2.6vw,40px);
}
.initiative-content p{
  margin:0;
  max-width:700px;
  font-size:15px;
  line-height:1.54;
}
.initiative-card:nth-child(2) .initiative-content p,
.initiative-card:nth-child(3) .initiative-content p{font-size:14px}

/* Compact ending */
.initiatives-cta{background:var(--blue);color:#fff;padding:90px 0 0;overflow:hidden;border-top:1px solid var(--ink)}
.initiatives-cta-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:48px;align-items:end;padding-bottom:66px}
.initiatives-cta h2{margin:0;font-size:clamp(78px,12vw,184px);line-height:.72;letter-spacing:-.088em;text-transform:uppercase}
.initiatives-cta-actions{display:flex;flex-wrap:wrap;gap:12px;padding-bottom:8px}
.initiatives-cta-actions a{display:inline-flex;padding:16px 20px;border:1px solid #fff;font-size:10px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
.initiatives-cta-actions a:first-child{background:#fff;color:var(--ink)}
.initiatives-cta-actions a:hover{background:var(--acid);border-color:var(--acid);color:var(--ink)}
.initiatives-cta-line{border-top:1px solid rgba(255,255,255,.45);padding:20px 0;font-size:10px;font-weight:900;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.78)}
.initiatives-page footer{padding-top:32px}

@media(max-width:1100px){
  .initiatives-hero-copy{grid-template-columns:1fr 210px;gap:28px}
  .initiative-card{height:auto;min-height:0}
  .initiative-image{height:470px;flex-basis:470px}
  .initiative-content{padding:27px 25px 28px;justify-content:flex-start}
  .initiative-content h3{font-size:clamp(30px,3.2vw,44px)}
  .initiative-card:nth-child(2) .initiative-content h3,
  .initiative-card:nth-child(3) .initiative-content h3{font-size:clamp(27px,2.8vw,37px)}
}

@media(max-width:820px){
  .initiatives-hero{padding-bottom:68px}
  .initiatives-hero-banner{height:520px}
  .initiatives-hero-overlay{padding-bottom:22px}
  .initiatives-hero-panel{width:min(88vw,700px);padding:22px 23px 23px}
  .initiatives-title{font-size:clamp(58px,14vw,105px)}
  .initiatives-hero-copy{grid-template-columns:1fr;gap:17px;padding-top:26px}
  .initiatives-hero-note{justify-self:start;text-align:left}
  .initiatives-section{padding:84px 0 104px}
  .initiatives-heading{display:block}
  .initiatives-heading p{margin-top:22px}
  .initiatives-grid{grid-template-columns:1fr;gap:20px}
  .initiative-card:nth-child(n){grid-column:1;height:auto;min-height:0}
  .initiative-image{height:340px;flex-basis:340px}
  .initiative-content{min-height:0;padding:27px 25px 29px;justify-content:flex-start}
  .initiative-content h3,
  .initiative-card:nth-child(n) .initiative-content h3{font-size:clamp(36px,7.8vw,56px)}
  .initiative-content p,
  .initiative-card:nth-child(n) .initiative-content p{font-size:15px}
  .initiatives-cta-grid{grid-template-columns:1fr;gap:38px}
}

@media(max-width:520px){
  .initiatives-hero-banner{height:420px}
  .initiatives-hero-panel{width:calc(100vw - 28px);padding:18px 17px 19px;box-shadow:8px 8px 0 rgba(12,12,12,.13)}
  .initiatives-meta{margin-bottom:10px}
  .initiatives-meta:after{width:82px}
  .initiatives-title{font-size:clamp(49px,16.5vw,82px)}
  .initiatives-intro{font-size:15px;line-height:1.55}
  .initiatives-heading h2{font-size:clamp(52px,17vw,82px)}
  .initiative-image{height:285px;flex-basis:285px}
  .initiative-content{min-height:0;padding:26px 22px 27px;justify-content:flex-start}
  .initiative-content h3,
  .initiative-card:nth-child(n) .initiative-content h3{font-size:clamp(30px,10.4vw,44px);margin:19px 0 16px}
  .initiative-content p,
  .initiative-card:nth-child(n) .initiative-content p{font-size:14px}
  .initiatives-cta{padding-top:72px}
  .initiatives-cta h2{font-size:clamp(70px,23vw,112px)}
}