.solutions-page { background: var(--color-white); }
.solutions-page h2 { font-size: 2.7rem; }
.solutions-page h3 { font-size: 1.6rem; }
.solutions-page h4 { font: 750 1rem var(--font-body); }
.solutions-page p { color: var(--color-text-muted); }
.solutions-page :focus-visible { outline: 3px solid var(--color-gold-600); outline-offset: 4px; }
.solutions-page section[id] { scroll-margin-top: 6rem; }
.solutions-section { padding-block: 4.5rem; }
.solutions-hero { position: relative; background: var(--color-forest-950); color: var(--color-white); overflow: hidden; }
.solutions-hero__image, .solutions-hero__shade { position: absolute; inset: 0; width: 100%; height: 100%; }
.solutions-hero__image { object-fit: cover; object-position: center 42%; }
.solutions-hero__shade { background: linear-gradient(90deg, rgba(4,37,24,.97), rgba(4,37,24,.81) 42%, rgba(4,37,24,.12) 80%); }
.solutions-hero__inner { position: relative; padding-block: 4.5rem 2.5rem; min-height: 36rem; display: grid; align-content: center; justify-items: start; gap: 1.5rem; }
.solutions-hero h1 { font-size: 4.5rem; color: var(--color-white); max-width: 16ch; }
.solutions-hero h1 em { color: var(--color-gold-300); }
.solutions-hero .eyebrow { color: var(--color-gold-300); }
.solutions-hero p:not(.eyebrow) { color: var(--color-white); max-width: 49ch; font-size: 1.125rem; }
.solutions-actions { display: flex; gap: 1rem; flex-wrap: wrap; }
.hero-points { display: flex; gap: 2rem; flex-wrap: wrap; padding-top: 1.5rem; margin-top: .5rem; border-top: 1px solid var(--color-border-dark); }
.hero-points li { display: flex; align-items: center; gap: .7rem; font-size: .875rem; }
.hero-points .ui-icon { color: var(--color-gold-300); }
.intro-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: center; }
.intro-copy { display: grid; gap: 1.25rem; }
.solutions-intro h2 { margin-top: .75rem; }
.solution-flow { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; counter-reset: flow; margin-top: .5rem; }
.solution-flow li { counter-increment: flow; padding-block: .75rem; border-top: 1px solid var(--color-border); font-weight: 650; font-size: .875rem; }
.solution-flow li::before { content: '0' counter(flow); color: var(--color-olive-700); margin-right: .75rem; font-weight: 700; }
.solution-explorer { background: var(--color-cream-100); }
.solution-categories { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 1.25rem; margin-block: 2rem 3rem; }
.solution-category { display: grid; grid-template-rows: 9rem 1fr; padding: 0; border: 1px solid var(--color-border); border-radius: var(--radius-sm); overflow: hidden; text-align: left; background: var(--color-white); color: var(--color-text); position: relative; scroll-margin-top: 6rem; transition: border-color var(--transition-base); }
.solution-category[aria-pressed='true'] { border: 2px solid var(--color-forest-800); }
.solution-category:hover { border-color: var(--color-gold-600); }
.category-image { width: 100%; height: 100%; object-fit: cover; }
.category-image[data-cropped-photo] { object-position: center top; }
.category-illustration { display: grid; place-items: center; background: var(--color-forest-100); color: var(--color-forest-900); }
.category-illustration .ui-icon { width: 3.5rem; height: 3.5rem; }
.category-copy { display: grid; gap: .35rem; padding: 1.1rem 2.7rem 1.1rem 1.1rem; }
.category-copy strong { font-size: 1.05rem; }
.category-copy small { color: var(--color-text-muted); font-size: .875rem; line-height: 1.5; }
.category-copy .action-arrow { position: absolute; right: 1rem; bottom: 1.3rem; }
.category-selected { position: absolute; top: .65rem; right: .65rem; background: var(--color-forest-900); color: var(--color-white); padding: .15rem .6rem; font-size: .75rem; font-weight: 700; }
.solution-category[aria-pressed='false'] .category-selected { display: none; }
.solution-detail { display: grid; grid-template-columns: .85fr 1.15fr; gap: 3rem; align-items: start; border-top: 1px solid var(--color-border); padding-top: 3rem; }
.solution-detail img { width: 100%; height: 30rem; object-fit: cover; border-radius: var(--radius-sm); }
.solution-detail img[data-portrait-photo] { object-position: center 20%; }
.solution-detail__copy { display: grid; gap: 1.25rem; }
.solution-detail__copy .button { justify-self: start; }
.solution-needs { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem 1rem; font-size: .9rem; }
.solution-needs li::before { content: '\2713'; color: var(--color-forest-800); margin-right: .6rem; }
.recommended-services { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem 1rem; }
.recommended-services a { display: flex; align-items: center; gap: .7rem; font-size: .875rem; padding: .65rem 0; border-bottom: 1px solid var(--color-border); }
.recommended-services a:hover { color: var(--color-olive-700); }
.recommended-services .ui-icon { flex: none; color: var(--color-forest-800); }
.integrated-section { background: var(--color-white); }
.integration-diagram { display: grid; justify-items: center; text-align: center; gap: 2rem; position: relative; }
.diagram-property { display: grid; gap: .5rem; justify-items: center; }
.diagram-property .ui-icon { width: 2.5rem; height: 2.5rem; }
.diagram-services { width: 100%; display: grid; grid-template-columns: repeat(3,1fr); border-top: 1px solid var(--color-gold-600); border-bottom: 1px solid var(--color-gold-600); padding: 1.5rem 0; gap: .75rem; position: relative; }
.diagram-services::before, .diagram-services::after { content: ''; height: 2rem; width: 1px; background: var(--color-gold-600); position: absolute; left: 50%; }
.diagram-services::before { top: -2rem; }.diagram-services::after { bottom: -2rem; }
.diagram-services > div { display: grid; gap: .65rem; justify-items: center; font-size: .9rem; }
.diagram-services .ui-icon { color: var(--color-forest-800); }
.diagram-partner { display: grid; justify-items: center; gap: .4rem; color: var(--color-white); background: var(--color-forest-900); width: 100%; padding: 1.25rem; }
.diagram-partner span { font-size: .875rem; color: var(--color-gold-300); }
.solution-process { border-top: 1px solid var(--color-border); }
.solution-process .process-steps { margin-top: 2.5rem; }
.solution-process .process-steps h3 { font-size: 1rem; }
.solution-benefits { background: var(--color-forest-950); color: var(--color-white); }
.solution-benefits h2, .solution-benefits h3 { color: var(--color-white); }
.solution-benefits .eyebrow { color: var(--color-gold-300); }
.solution-benefit-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 2rem; margin-top: 2.5rem; }
.solution-benefit-grid article { border-top: 1px solid var(--color-border-dark); padding-top: 1.5rem; display: grid; gap: .75rem; align-content: start; }
.solution-benefit-grid .ui-icon { color: var(--color-gold-300); width: 2rem; height: 2rem; }
.solution-benefit-grid h3 { font: 700 1.125rem var(--font-body); }
.solution-benefit-grid p { color: var(--color-forest-100); font-size: .95rem; }
.builder-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 4rem; margin-top: 2rem; }
.builder-grid form { display: grid; gap: 2rem; align-content: start; }
.builder-grid fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
.builder-grid legend { font-weight: 750; margin-bottom: 1rem; }
.builder-needs { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.builder-needs label { display: flex; align-items: center; gap: .75rem; min-height: 3.25rem; padding: .75rem; border-bottom: 1px solid var(--color-border); cursor: pointer; }
.builder-needs input { width: 1.1rem; height: 1.1rem; accent-color: var(--color-forest-800); flex: none; }
.builder-needs label:has(input:checked) { background: var(--color-forest-100); }
.builder-result { border-left: 2px solid var(--color-gold-600); padding-left: 2rem; display: grid; gap: 1rem; align-content: start; }
.builder-result li { padding: .35rem 0; }
.builder-result li .ui-icon { margin-right: .6rem; vertical-align: middle; }
.builder-result .button { justify-self: start; }
.solution-philosophy { background: var(--color-cream-100); }
.solution-philosophy h2, .solution-philosophy h3 { margin-block: .75rem 1rem; }
.specific-service { border-left: 1px solid var(--color-border); padding-left: 3rem; }
.specific-service > .ui-icon { width: 2rem; height: 2rem; }
.specific-service .button { margin-top: 1.5rem; }
.solutions-final-cta { background: var(--color-forest-900); padding-block: 3rem; }
.solutions-final-cta > .container { display: flex; gap: 3rem; justify-content: space-between; align-items: center; }
.solutions-final-cta h2 { color: var(--color-white); font-size: 2.3rem; }
.solutions-final-cta p { color: var(--color-forest-100); margin-top: 1rem; max-width: 58ch; }
.solutions-final-cta .solutions-actions { flex: none; }
@media (max-width: 1050px) {
  .intro-grid, .builder-grid { gap: 2rem; }
  .solution-categories { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .solution-detail { gap: 2rem; }
  .solutions-final-cta > .container { flex-direction: column; align-items: start; }
}
@media (max-width: 800px) {
  .solutions-page h2 { font-size: 2.2rem; }
  .intro-grid, .solution-detail, .builder-grid { grid-template-columns: 1fr; }
  .solution-detail img { height: 22rem; }
  .solution-benefit-grid { grid-template-columns: 1fr 1fr; }
  .specific-service { border-left: 0; border-top: 1px solid var(--color-border); padding: 2rem 0 0; }
  .builder-result { padding-left: 1.5rem; }
}
@media (max-width: 600px) {
  .solutions-section { padding-block: 3rem; }
  .solutions-hero__inner { min-height: 36rem; padding-block: 3rem 2rem; }
  .solutions-hero h1 { font-size: 3rem; }
  .solutions-hero__shade { background: rgba(4,37,24,.8); }
  .hero-points { gap: 1rem; }
  .solution-categories, .recommended-services, .solution-benefit-grid { grid-template-columns: 1fr; }
  .solution-category { grid-template-rows: 10rem 1fr; }
  .solution-needs { grid-template-columns: 1fr; }
  .solution-detail img { height: 18rem; }
  .builder-needs { grid-template-columns: 1fr; }
  .diagram-services { gap: .4rem; }
  .diagram-services > div { font-size: .8rem; overflow-wrap: anywhere; }
  .solutions-actions .button { white-space: normal; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .solution-category { transition: none; }
}
