/* Solutions page */
.sl-ic{width:22px;height:22px;flex:none}

/* Hero */
.sl-top{padding-bottom:110px}
.sl-hero{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));margin:0 4%;padding:96px 0 84px}
.sl-hero h1{grid-column:1/5;font-size:clamp(56px,6.4vw,100px);line-height:1;letter-spacing:-.035em}
.sl-hero-copy{grid-column:5/7;padding:14px 0 0 28px;display:flex;flex-direction:column;gap:18px;color:var(--sub);font-size:17px;line-height:1.55}
.sl-hero-lead{color:var(--ink);font-size:22px;line-height:1.4}
.sl-hero-copy .btn{align-self:flex-start;margin-top:14px}

/* Index of five audiences */
.sl-index{list-style:none;margin:0 4%;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.sl-card{position:relative;display:flex;flex-direction:column;justify-content:flex-end;aspect-ratio:3/4;padding:18px;color:#fff;text-decoration:none;overflow:hidden;isolation:isolate}
.sl-card::before{content:"";position:absolute;inset:0;z-index:-2;background:var(--img) var(--pos)/var(--size) no-repeat;transition:transform .8s var(--ease)}
.sl-card:hover::before,.sl-card:focus-visible::before{transform:scale(1.06)}
.sl-card:focus-visible{outline:2px solid var(--blue);outline-offset:3px}

/* Audience rows: full-height 50/50 split, photo bleeds to the edge */
.sl-items{border-top:1px solid var(--line)}
.sl-item{display:grid;grid-template-columns:1fr 1fr;min-height:100vh;border-bottom:1px solid var(--line);scroll-margin-top:0}
.sl-item:last-child{border-bottom:0}
.sl-media{position:relative;overflow:hidden}
.sl-photo{position:absolute;inset:0;background:var(--img) var(--pos)/var(--size) no-repeat}
.sl-copy{align-self:center;padding:96px max(4vw,48px) 96px 7vw;max-width:760px}
.sl-item.flip .sl-media{grid-column:2;grid-row:1}
.sl-item.flip .sl-copy{grid-column:1;grid-row:1;justify-self:end;padding:96px 7vw 96px max(4vw,48px)}
.sl-eyebrow{display:flex;align-items:center;gap:10px;color:var(--blue);font-size:16px;font-weight:500;letter-spacing:.02em}
.sl-copy h2{margin-top:26px;font-size:clamp(40px,3.9vw,58px);line-height:1.06;letter-spacing:-.03em}
.sl-lead{margin-top:30px;font-size:22px;line-height:1.4}
.sl-body{margin-top:16px;color:var(--sub);font-size:17px;line-height:1.6}
.sl-facts{margin-top:44px;display:grid;gap:30px}
.sl-facts>div{padding-top:22px;border-top:1px solid var(--line)}
.sl-facts h3{font-family:'DM Sans',sans-serif;font-size:14px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--sub)}
.sl-chips{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.sl-chips li{padding:7px 14px;border:1px solid #346b9f40;border-radius:99px;background:#fff;font-size:15px;line-height:1.3}
.sl-suit{list-style:none;margin:16px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px 24px}
.sl-suit li{display:flex;gap:10px;align-items:flex-start;font-size:16px;line-height:1.4}
.sl-suit svg{width:18px;height:18px;flex:none;margin-top:2px;color:var(--blue)}
.sl-btn{margin-top:44px}

/* Closing CTA */
.sl-cta .contact-blue h2{max-width:560px}
.sl-cta .contact-blue p{color:#e2ebf4!important;max-width:440px;margin-top:26px;font-size:18px;line-height:1.5}
.sl-cta-actions{margin-top:auto;width:100%;display:flex;flex-direction:column;gap:18px}
.sl-cta-actions .contact-button{align-self:flex-start}
.sl-cta-link{display:inline-flex;align-items:center;gap:12px;align-self:flex-start;font-size:16px;color:#fff;border-bottom:1px solid #ffffff80;padding:6px 0;text-decoration:none}
.sl-cta-link .mi{width:18px;height:18px;fill:currentColor;transition:transform .3s var(--ease)}
.sl-cta-link:hover .mi{transform:translateX(4px)}

/* Motion: copy floats up, photos slide in */
.js .sl-up{opacity:0;transform:translateY(40px);transition:opacity .9s var(--ease) var(--d,0s),transform .9s var(--ease) var(--d,0s)}
.js .sl-slide .sl-photo{opacity:0;transform:scale(1.08);transition:opacity 1s var(--ease),transform 1.6s var(--ease)}
.js .sl-in{opacity:1;transform:none}
.js .sl-slide.sl-in .sl-photo{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.js .sl-up,.js .sl-slide .sl-photo{opacity:1;transform:none;transition:none}.sl-card::before{transition:none}}

@media(max-width:1050px){
 .sl-hero{grid-template-columns:1fr;gap:32px}.sl-hero h1,.sl-hero-copy{grid-column:1}.sl-hero-copy{padding:0}
 .sl-index{grid-template-columns:repeat(3,1fr)}
 .sl-item,.sl-item.flip{grid-template-columns:1fr;min-height:0}
 .sl-media,.sl-item.flip .sl-media{grid-column:1;grid-row:1;aspect-ratio:4/3}
 .sl-copy,.sl-item.flip .sl-copy{grid-column:1;grid-row:2;padding:56px 5%;justify-self:stretch;max-width:none}
}