.solution-page { --solution-display-size:clamp(48px,5vw,78px);--solution-lead-size:27px;background:#080808;color:#fff; }
.solution-hero { min-height:calc(100svh - 97px);padding:100px 0; }
.solution-hero h1 { max-width:1100px;margin:0;font-size:clamp(54px,8vw,132px);font-weight:500;line-height:1.03;letter-spacing:-.055em;text-wrap:balance; }
.solution-hero .home-sr { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0; }
@media(max-width:760px) { .solution-hero { min-height:calc(100svh - 97px);padding:72px 0; }.solution-hero h1 { font-size:clamp(42px,10vw,72px); } }

/* Hero and introduction share the same responsive display and supporting text sizes. */
.solution-hero h1.solution-statement { max-width:none;font-size:var(--solution-lead-size);font-weight:400;line-height:1.5;letter-spacing:-.025em;text-wrap:initial; }
.solution-lead { display:block;max-width:900px; }
.solution-rotation { display:grid;grid-template-columns:minmax(0,1fr);overflow:hidden;margin-top:4px;padding:.06em .03em .12em 0;font-size:var(--solution-display-size);font-weight:500;line-height:1.08;letter-spacing:normal; }
.solution-word { color:#fff;grid-area:1/1;opacity:0;white-space:normal;align-self:center; }
.solution-period { color:var(--accent); }
.solution-word[data-current] { opacity:1; }
@media(max-width:760px) { .solution-page { --solution-display-size:46px;--solution-lead-size:23px; }.solution-rotation { line-height:1;margin-top:12px; } }
@media(max-width:360px) { .solution-page { --solution-display-size:41px; } }

.solution-label { margin:0 0 20px;font-size:12px;font-weight:500;line-height:1.4;letter-spacing:.12em;text-transform:uppercase; }
@media(max-width:760px) { .solution-label { font-size:10px;margin-bottom:16px; } }

/* Product Design expands the template hero height by 20%; keep phone framing stable. */
.solution-hero-contained { height:min(912px,calc(120svh - 116.4px));min-height:648px; }
.solution-introduction.home { background:#f7f7f3; }
@media(max-width:760px) { .solution-hero-contained { height:648px;min-height:648px; } }

/* Product Design shares one content edge from navigation through the introduction. */
.solution-page:has(.solution-introduction) { --solution-content-width:min(1340px,calc(100% - 100px)); }
.solution-page:has(.solution-introduction) .header-inner,
.solution-hero-contained > .container,
.solution-introduction.home > .container { width:var(--solution-content-width); }
.solution-page:has(.solution-introduction) .header-inner { padding-inline:0; }
@media(max-width:1100px) { .solution-page:has(.solution-introduction) { --solution-content-width:calc(100% - 70px); } }
@media(max-width:760px) { .solution-page:has(.solution-introduction) { --solution-content-width:calc(100% - 40px); } }

.solution-clients > div { grid-template-columns:repeat(6,minmax(0,1fr)); }
@media(max-width:760px) { .solution-clients .home-client:last-child { width:50%; } }

.solution-introduction .home-intro-grid { align-items:start;row-gap:0; }
.solution-introduction .solution-label { grid-column:1/-1; }

.solution-introduction .home-intro-grid h2 { font-size:var(--solution-display-size); }
.solution-introduction .home-intro-grid > div > .home-lead { font-size:var(--solution-lead-size); }
.solution-project-grey { background:#e8e8e5; }

#solution-project-government-of-alberta-atlas .work-feature-art{aspect-ratio:1920 / 1500}