.solutions-overview, .solution-detail { overflow: clip; background: var(--sanfu-warm-white); }
.solutions-overview .section-shell, .solution-detail .section-shell { width: var(--sanfu-shell); margin-inline: auto; }
.solutions-section { padding-block: var(--sanfu-section-default); }
.solutions-heading { display: grid; gap: 1rem; margin-bottom: var(--sanfu-section-heading-gap); }
.solutions-heading h2, .solution-approach h2, .solution-bridge h2, .solution-performance h2, .solution-flexibility h2 { max-width: var(--sanfu-measure-heading); margin: 0; font-size: var(--sanfu-type-h2); font-weight: var(--sanfu-weight-semibold); letter-spacing: -.012em; line-height: var(--sanfu-leading-h2); }
.solutions-heading > p:last-child { max-width: 42rem; margin: 0; font-size: clamp(1rem, 1.5vw, 1.25rem); line-height: 1.65; }
.solution-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1.5rem; margin-top: 2rem; }

.solutions-hero, .solution-detail-hero { position: relative; min-height: clamp(38rem, 62vw, 50rem); display: grid; align-items: end; isolation: isolate; color: var(--sanfu-white); }
.solutions-hero > img, .solution-detail-hero picture, .solution-detail-hero picture img, .solutions-hero__shade, .solution-detail-hero__shade { position: absolute; z-index: -2; width: 100%; height: 100%; inset: 0; }
.solutions-hero > img, .solution-detail-hero picture img { object-fit: cover; object-position: center; }
.solutions-hero__shade, .solution-detail-hero__shade { z-index: -1; background: linear-gradient(90deg, rgb(11 25 24 / .84), rgb(11 25 24 / .2) 72%); }
.solutions-hero__content, .solution-detail-hero__content { display: grid; gap: 1.4rem; padding-block: clamp(5rem, 11vh, 8rem); }
.solutions-hero h1, .solution-detail-hero h1 { max-width: var(--sanfu-measure-display); margin: 0; font-size: var(--sanfu-type-h1); font-weight: var(--sanfu-weight-medium); letter-spacing: -.02em; line-height: var(--sanfu-leading-h1); }
.solutions-hero__content > p:last-child, .solution-detail-hero__content > p:last-child { max-width: 43rem; margin: 0; font-size: clamp(1.05rem, 1.6vw, 1.35rem); line-height: 1.55; }
.solution-detail-hero .breadcrumbs { color: var(--sanfu-white); }
.solution-detail-hero .breadcrumbs a { color: inherit; }

.solutions-preview { background: var(--sanfu-warm-white); }
.solutions-preview__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-rows: clamp(14rem, 19vw, 20rem); gap: clamp(.8rem, 1.5vw, 1.5rem); }
.solution-preview { min-width: 0; }
.solution-preview--1 { grid-column: 1 / span 8; grid-row: span 2; }
.solution-preview--2, .solution-preview--3 { grid-column: 9 / span 4; }
.solution-preview--4 { grid-column: 1 / -1; grid-row: span 2; }
.solution-preview--5, .solution-preview--6 { grid-column: span 6; grid-row: span 2; }
.solution-preview > a { position: relative; height: 100%; display: block; overflow: hidden; background: var(--sanfu-graphite); color: var(--sanfu-white); text-decoration: none; }
.solution-preview__media, .solution-preview__media::after { position: absolute; inset: 0; }
.solution-preview__media::after { content: ''; background: linear-gradient(0deg, rgb(8 20 19 / .84), transparent 64%); }
.solution-preview__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 350ms ease; }
.solution-preview > a:hover .solution-preview__media img, .solution-preview > a:focus-visible .solution-preview__media img { transform: scale(1.02); }
.solution-preview__content { position: absolute; right: 0; bottom: 0; left: 0; display: grid; grid-template-columns: 2.5rem 1fr; gap: .35rem 1rem; padding: clamp(1.25rem, 2.5vw, 2.75rem); }
.solution-preview__content > span:first-child { grid-row: 1 / span 3; font-size: .68rem; letter-spacing: .14em; opacity: .72; }
.solution-preview__content strong { font-size: var(--sanfu-type-h3); font-weight: var(--sanfu-weight-semibold); letter-spacing: -.006em; line-height: var(--sanfu-leading-h3); }
.solution-preview__content small { max-width: 32rem; font-size: .9rem; line-height: 1.45; opacity: .88; }
.solution-preview__content .text-link { margin-top: .6rem; font-size: .82rem; }
.solution-preview--2 .solution-preview__content, .solution-preview--3 .solution-preview__content { grid-template-columns: 1fr; }
.solution-preview--2 .solution-preview__content > span:first-child, .solution-preview--3 .solution-preview__content > span:first-child { grid-row: auto; }
.solution-preview--2 .solution-preview__content strong, .solution-preview--3 .solution-preview__content strong { font-size: var(--sanfu-type-h3); }

.solution-approach { background: var(--sanfu-light-stone); }
.solution-approach__layout { display: grid; grid-template-columns: var(--sanfu-grid-split); gap: var(--sanfu-editorial-gap); }
.solution-approach__layout > div { display: grid; align-content: start; gap: 1.25rem; }
.solution-approach ol { margin: 0; padding: 0; border-top: 2px solid currentColor; list-style: none; }
.solution-approach li { display: grid; grid-template-columns: 3.5rem minmax(0, .8fr) minmax(0, 1fr); gap: 1.5rem; padding: 1.75rem 0; border-bottom: var(--sanfu-border); }
.solution-approach li span { font-size: .68rem; letter-spacing: .14em; opacity: .6; }
.solution-approach li strong { font-size: clamp(1.1rem, 1.7vw, 1.45rem); }
.solution-approach li p { margin: 0; line-height: 1.6; }

.solution-bridge { background: var(--sanfu-warm-white); }
.solution-bridge__layout { display: grid; grid-template-columns: var(--sanfu-grid-split); gap: var(--sanfu-editorial-gap); align-items: end; }
.solution-bridge__layout > div { display: grid; gap: 1.25rem; }
.solution-bridge__layout p { max-width: 36rem; margin: 0; font-size: clamp(1.05rem, 1.6vw, 1.3rem); line-height: 1.65; }

.solution-needs { background: var(--sanfu-warm-white); }
.solution-needs ol { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: clamp(1.5rem, 3vw, 3rem); margin: 0; padding: 0; border-top: 2px solid currentColor; list-style: none; }
.solution-needs li { min-height: 12rem; display: grid; align-content: space-between; gap: 2rem; padding-top: 1.5rem; }
.solution-needs li span { font-size: .68rem; letter-spacing: .14em; opacity: .58; }
.solution-needs li strong { font-size: var(--sanfu-type-h3); font-weight: var(--sanfu-weight-medium); letter-spacing: -.006em; line-height: var(--sanfu-leading-h3); }

.solution-design { padding: 0; background: var(--sanfu-light-stone); }
.solution-design__layout { width: 100% !important; max-width: none; display: grid; grid-template-columns: var(--sanfu-grid-media-copy); align-items: stretch; }
.solution-design__media { min-height: clamp(34rem, 58vw, 58rem); overflow: hidden; }
.solution-design__media img { width: 100%; height: 100%; object-fit: cover; }
.solution-design__copy { display: grid; align-content: end; gap: 1.25rem; padding: clamp(3rem, 5vw, 5rem); }
.solution-design__copy h2 { max-width: var(--sanfu-measure-heading); margin: 0; font-size: var(--sanfu-type-h2); font-weight: var(--sanfu-weight-semibold); letter-spacing: -.012em; line-height: var(--sanfu-leading-h2); }
.solution-design__copy p:last-child { max-width: 32rem; margin: 0; line-height: 1.7; }

.solution-recommendations { background: var(--sanfu-warm-white); }
.solution-collection-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(3rem, 6vw, 6rem) clamp(1.5rem, 3vw, 3rem); }
.solution-collection-grid .collection-preview { grid-template-columns: 1fr; }
.solution-collection-grid .collection-preview__media { min-height: 0; aspect-ratio: 4 / 3; }
.solution-collection-grid .collection-preview__content { padding-top: 1.5rem; }
.solution-colors { background: var(--sanfu-light-stone); }
.solution-color-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1rem; }

.solution-performance { background: var(--sanfu-light-stone); }
.solution-performance__layout { display: grid; grid-template-columns: var(--sanfu-grid-split); gap: var(--sanfu-editorial-gap); }
.solution-performance__layout > div { display: grid; align-content: start; gap: 1.2rem; }
.solution-performance ul { margin: 0; padding: 0; border-top: 2px solid currentColor; list-style: none; }
.solution-performance li { padding: 1.5rem 0; border-bottom: var(--sanfu-border); font-size: clamp(1.05rem, 1.6vw, 1.3rem); line-height: 1.5; }

.solution-flexibility { background: var(--sanfu-warm-white); }
.solution-flexibility__layout { display: grid; grid-template-columns: var(--sanfu-grid-split); gap: var(--sanfu-editorial-gap); align-items: end; }
.solution-flexibility__layout > div { display: grid; gap: 1.25rem; }
.solution-flexibility__layout p { max-width: 36rem; margin: 0; font-size: clamp(1.05rem, 1.6vw, 1.3rem); line-height: 1.65; }
.solution-flexibility__layout strong { display: block; padding-top: 2rem; border-top: var(--sanfu-border); font-size: var(--sanfu-type-h1); font-weight: var(--sanfu-weight-medium); letter-spacing: -.02em; line-height: var(--sanfu-leading-h1); }
.solution-flexibility__layout strong span { font-size: 1.8em; }

.solution-final-cta { padding-block: var(--sanfu-section-large); background: var(--sanfu-deep-teal); color: var(--sanfu-white); }
.solution-final-cta .section-shell { display: grid; gap: 1.5rem; }
.solution-final-cta h2 { max-width: var(--sanfu-measure-heading); margin: 0; font-size: var(--sanfu-type-h2); font-weight: var(--sanfu-weight-medium); letter-spacing: -.012em; line-height: var(--sanfu-leading-h2); }

@media (max-width: 1040px) {
  .solutions-preview__grid { grid-auto-rows: clamp(14rem, 28vw, 20rem); }
  .solution-preview--1 { grid-column: 1 / span 7; }
  .solution-preview--2, .solution-preview--3 { grid-column: 8 / span 5; }
  .solution-needs ol { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .solution-color-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .solution-design__layout { grid-template-columns: minmax(0, 1.15fr) minmax(18rem, .85fr); }
}

@media (max-width: 760px) {
  .solutions-section { padding-block: var(--sanfu-section-default); }
  .solutions-hero, .solution-detail-hero { min-height: 36rem; }
  .solutions-hero > img, .solution-detail-hero picture img { object-position: 58% center; }
  .solutions-hero__shade, .solution-detail-hero__shade { background: linear-gradient(0deg, rgb(11 25 24 / .88), rgb(11 25 24 / .12)); }
  .solutions-preview__grid { grid-template-columns: 1fr; grid-auto-rows: auto; gap: .8rem; }
  .solution-preview, .solution-preview--1, .solution-preview--2, .solution-preview--3, .solution-preview--4, .solution-preview--5, .solution-preview--6 { grid-column: auto; grid-row: auto; }
  .solution-preview > a { min-height: 28rem; }
  .solution-preview__content, .solution-preview--2 .solution-preview__content, .solution-preview--3 .solution-preview__content { grid-template-columns: 2.25rem 1fr; }
  .solution-preview__content > span:first-child, .solution-preview--2 .solution-preview__content > span:first-child, .solution-preview--3 .solution-preview__content > span:first-child { grid-row: 1 / span 3; }
  .solution-preview__content strong, .solution-preview--2 .solution-preview__content strong, .solution-preview--3 .solution-preview__content strong { font-size: var(--sanfu-type-h3); }
  .solution-approach__layout, .solution-bridge__layout, .solution-performance__layout, .solution-flexibility__layout { grid-template-columns: 1fr; }
  .solution-approach li { grid-template-columns: 2.5rem 1fr; }
  .solution-approach li p { grid-column: 2; }
  .solution-needs ol { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .solution-needs li { min-height: 10rem; }
  .solution-design__layout { grid-template-columns: 1fr; }
  .solution-design__media { min-height: 30rem; }
  .solution-design__copy { padding: 4rem 1rem; }
  .solution-collection-grid { grid-template-columns: 1fr; }
  .solution-color-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .solution-actions { align-items: stretch; flex-direction: column; }
  .solution-actions .button, .solution-actions .text-link { width: 100%; justify-content: center; }
  .solutions-heading h2, .solution-approach h2, .solution-bridge h2, .solution-performance h2, .solution-flexibility h2, .solution-design__copy h2 { max-width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .solution-preview__media img { transition: none; }
}
