/* Shared styles for the Solvo USA sector detail pages */
.solution-page { background: var(--paper); }
.page-hero { position: relative; min-height: 720px; padding: 190px 0 95px; overflow: hidden; }
.page-hero::after { position: absolute; right: 0; bottom: -1px; left: 0; height: 45px; background: var(--paper); clip-path: polygon(0 100%, 100% 0, 100% 100%); content: ''; }
.page-hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: .9fr 1.1fr; align-items: center; gap: 8%; }
.page-hero-copy { padding-bottom: 35px; }.page-hero-copy h1 { max-width: 590px; margin-bottom: 27px; font-size: clamp(2.8rem, 4.8vw, 5.2rem); }.page-hero-copy h1 em { color: var(--lime); }.page-hero-copy .hero-lede { max-width: 465px; margin-bottom: 32px; }.page-hero-actions { display: flex; align-items: center; gap: 25px; flex-wrap: wrap; }
.breadcrumb { display: flex; align-items: center; gap: 9px; margin-bottom: 25px; color: rgba(244, 246, 241, .52); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }.breadcrumb a:hover { color: var(--lime); }.breadcrumb span { color: var(--lime); }
.page-visual { position: relative; min-height: 500px; padding: 16px; background: #26382f; box-shadow: 22px 22px 0 rgba(185, 243, 91, .16); }.page-visual-image { position: absolute; inset: 16px; overflow: hidden; }.page-visual-image img { height: 100%; min-height: 468px; filter: saturate(.72); }.page-visual-image::after { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(19, 34, 28, .9), rgba(19, 34, 28, .05) 65%), linear-gradient(90deg, rgba(19, 34, 28, .45), transparent 70%); content: ''; }.visual-label { position: absolute; z-index: 2; top: 30px; right: 30px; left: 30px; display: flex; justify-content: space-between; color: rgba(244, 246, 241, .72); font-size: 9px; letter-spacing: .12em; text-transform: uppercase; }.visual-label strong { color: var(--lime); font-weight: 600; }.visual-feature-stack { position: absolute; z-index: 2; right: 30px; bottom: 30px; left: 30px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }.visual-feature { min-height: 83px; padding: 13px; border: 1px solid rgba(244, 246, 241, .24); background: rgba(19, 34, 28, .75); backdrop-filter: blur(8px); }.visual-feature span { display: block; margin-bottom: 14px; color: var(--lime); font-family: var(--serif); font-size: 16px; }.visual-feature strong { display: block; color: var(--paper); font-family: var(--serif); font-size: 13px; font-weight: 500; letter-spacing: -.02em; }.visual-feature small { display: block; margin-top: 3px; color: rgba(244, 246, 241, .55); font-size: 9px; }
.page-sector-bar { position: relative; z-index: 1; border-block: 1px solid rgba(19, 34, 28, .1); background: var(--sage); }.page-sector-inner { display: flex; align-items: center; justify-content: space-between; min-height: 86px; gap: 30px; }.page-sector-inner > strong { font-family: var(--serif); font-size: 18px; font-weight: 500; letter-spacing: -.04em; }.page-sector-list { display: flex; flex-wrap: wrap; gap: 10px 25px; }.page-sector-list span { font-size: 10px; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }.page-sector-list span::before { display: inline-block; width: 5px; height: 5px; margin: 0 8px 2px 0; border-radius: 50%; background: var(--ink); content: ''; }
.detail-intro { padding: 135px 0 90px; }.detail-intro-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 12%; align-items: end; }.detail-intro h2 { margin-bottom: 0; }.detail-intro-copy { max-width: 550px; color: var(--muted); font-size: 15.5px; font-weight: 500; line-height: 1.6; }.detail-intro-copy p:last-child { margin-bottom: 0; }
.capability-section { padding: 60px 0 145px; }.capability-section-head { display: flex; align-items: end; justify-content: space-between; gap: 40px; margin-bottom: 52px; }.capability-section-head h2 { margin-bottom: 0; font-size: clamp(2.2rem, 3.4vw, 3.8rem); }.capability-section-head > p { max-width: 330px; margin: 0 0 5px; color: var(--muted); font-size: 13px; }.capability-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 13px; }.capability-card { min-height: 252px; padding: 25px 25px 28px; border-top: 2px solid #b4c4b1; background: #f2f2ec; transition: transform .3s var(--ease), background .3s, border-color .3s; }a.capability-card:hover, a.capability-card:focus-visible { border-color: var(--lime); background: var(--ink); color: var(--paper); transform: translateY(-6px); }a.capability-card:hover p, a.capability-card:hover small, a.capability-card:focus-visible p, a.capability-card:focus-visible small { color: rgba(244, 246, 241, .68); }.feature-icon { display: grid; width: 34px; height: 34px; margin-bottom: 37px; place-items: center; border: 1px solid #9dae9d; border-radius: 50%; color: var(--ink); font-family: var(--serif); font-size: 14px; }a.capability-card:hover .feature-icon, a.capability-card:focus-visible .feature-icon { border-color: var(--lime); color: var(--lime); }.capability-card h3 { margin-bottom: 12px; font-size: 25px; }.capability-card p { max-width: 285px; margin-bottom: 14px; color: var(--muted); font-size: 13px; line-height: 1.55; }.capability-card small { color: #526a59; font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.service-card { padding: 0; overflow: hidden; }.service-card-image { height: 185px; overflow: hidden; }.service-card-image img { height: 100%; transition: transform .6s var(--ease); }.service-card:hover .service-card-image img, .service-card:focus-visible .service-card-image img { transform: scale(1.045); }.service-card-body { padding: 22px 25px 28px; }.service-card-body .feature-icon { margin-bottom: 24px; }.service-card-body h3 { margin-bottom: 12px; }.system-section { position: relative; padding: 135px 0 150px; border-block: 1px solid rgba(244, 246, 241, .12); background: #101a16; box-shadow: none; }.system-section::before { position: absolute; top: -1px; left: max(20px, calc((100% - var(--container)) / 2)); width: 120px; height: 2px; background: linear-gradient(90deg, var(--lime), var(--solvo-blue)); content: ''; }.system-section .system-section-head h2 em { color: #d7e8c4; }.system-section .eyebrow-lime span { color: var(--lime); }.system-section .system-node { border-color: rgba(158, 196, 255, .65); background: linear-gradient(145deg, #1d4650, #12282f); }.system-section .system-node::before { background: var(--solvo-blue); }.system-section-head { display: grid; grid-template-columns: 1fr .8fr; align-items: end; gap: 12%; margin-bottom: 60px; }.system-section-head h2 { margin-bottom: 0; }.system-section-head > p { max-width: 360px; margin: 0 0 6px; color: rgba(244, 246, 241, .62); font-size: 14px; }.system-map { display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(2, minmax(135px, auto)); gap: 13px; }.system-map::before, .system-map::after { display: none; }.system-node { position: relative; z-index: 1; grid-column: 2; grid-row: 2; display: flex; flex-direction: column; justify-content: space-between; width: 224px; height: 184px; margin: auto; padding: 22px; overflow: hidden; border: 1px solid rgba(185, 243, 91, .55); border-radius: 12px; background: linear-gradient(145deg, #30483b, #1b2b24); box-shadow: 0 0 0 8px rgba(185, 243, 91, .05), 0 20px 42px rgba(0, 0, 0, .16); text-align: left; }.system-node::before { position: absolute; top: 0; right: 0; left: 0; height: 3px; background: var(--lime); content: ''; }.system-node-brand { position: relative; z-index: 1; display: flex; align-items: center; gap: 11px; color: rgba(244, 246, 241, .78); font-size: 10px; font-weight: 700; letter-spacing: .18em; line-height: 1; }.system-node-mark { display: grid; flex: 0 0 auto; grid-template-columns: repeat(2, 6px); grid-template-rows: repeat(2, 6px); gap: 2px; width: 14px; height: 14px; transform: rotate(45deg); }.system-node-mark i { display: block; background: var(--lime); }.system-node-mark i:nth-child(1) { border-radius: 50% 0 0 0; }.system-node-mark i:nth-child(2) { border-radius: 0 50% 0 0; }.system-node-mark i:nth-child(3) { border-radius: 0 0 0 50%; }.system-node-mark i:nth-child(4) { border-radius: 0 0 50% 0; }.system-node-title { position: relative; z-index: 1; display: block; max-width: 170px; color: var(--paper); font-family: var(--serif); font-size: 25px; font-weight: 500; letter-spacing: -.07em; line-height: .9; }.system-node-partner { position: relative; z-index: 1; display: flex; align-items: baseline; justify-content: space-between; gap: 12px; border-top: 1px solid rgba(244, 246, 241, .17); padding-top: 11px; }.system-node-partner span { color: var(--solvo-blue); font-family: var(--serif); font-size: 15px; letter-spacing: -.03em; }.system-node-partner small { max-width: 92px; color: rgba(244, 246, 241, .47); font-size: 8px; letter-spacing: .03em; line-height: 1.2; text-align: right; text-transform: uppercase; }.map-card { position: relative; z-index: 1; display: grid; grid-template-columns: 31px 1fr; gap: 10px; align-items: start; padding: 17px; border: 1px solid rgba(244, 246, 241, .22); background: #26382f; }.system-map .map-card:nth-child(n) { grid-column: auto; grid-row: auto; }.system-map .map-card { min-height: 135px; align-content: space-between; border: 1px solid rgba(244, 246, 241, .16); border-top: 2px solid rgba(185, 243, 91, .42); background: #26382f; transition: border-color .25s, transform .25s var(--ease), background .25s; }.system-map button.map-card:hover { border-color: rgba(185, 243, 91, .45); border-top-color: var(--lime); background: #2b4035; transform: translateY(-4px); }.feature-trigger { width: 100%; color: var(--paper); font: inherit; text-align: left; }.feature-trigger.is-active { border-color: rgba(185, 243, 91, .55); border-top-color: var(--lime); background: #2b4035; }.feature-trigger:focus-visible { outline: 2px solid var(--solvo-blue); outline-offset: 3px; }.feature-trigger > span:last-child { display: grid; align-content: start; gap: 2px; }.map-card-icon { display: grid; width: 25px; height: 25px; place-items: center; border: 1px solid var(--lime); border-radius: 50%; color: var(--lime); font-size: 10px; }.map-card strong { display: block; margin-bottom: 3px; color: var(--paper); font-family: var(--serif); font-size: 14px; font-weight: 500; }.map-card small { color: rgba(244, 246, 241, .6); font-size: 10px; line-height: 1.35; }
.system-map { padding: 14px; border: 1px solid rgba(244, 246, 241, .14); background: rgba(0, 0, 0, .1); }.system-map .map-card { border-color: rgba(244, 246, 241, .14); border-top-color: rgba(185, 243, 91, .52); background: #192821; }.system-map button.map-card:hover { border-color: rgba(185, 243, 91, .38); border-top-color: var(--lime); background: #21332a; }.feature-trigger.is-active { border-color: rgba(185, 243, 91, .55); border-top-color: var(--lime); box-shadow: inset 0 0 28px rgba(185, 243, 91, .04); }.map-card-icon { border-color: rgba(185, 243, 91, .62); color: var(--lime); }.feature-demo { display: grid; grid-template-columns: 1fr .9fr; gap: 45px; margin-top: 22px; border: 1px solid rgba(244, 246, 241, .15); background: #17251f; transition: opacity .18s ease, transform .18s ease; }.feature-demo.is-changing { opacity: .45; transform: translateY(3px); }.feature-demo-copy { padding: 31px 34px 32px; }.feature-demo-kicker { margin: 0 0 18px; color: var(--lime); font-size: 10px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }.feature-demo-copy h3 { max-width: 400px; margin-bottom: 15px; color: var(--paper); font-size: clamp(1.55rem, 2.35vw, 2.35rem); }.feature-demo-copy > p:not(.feature-demo-kicker) { max-width: 465px; margin-bottom: 22px; color: rgba(244, 246, 241, .65); font-size: 13px; line-height: 1.55; }.feature-demo-tags { display: flex; flex-wrap: wrap; gap: 7px; }.feature-demo-tags span { padding: 7px 10px; border: 1px solid rgba(185, 243, 91, .35); color: rgba(244, 246, 241, .72); font-size: 9px; letter-spacing: .04em; }.feature-demo-visual { display: flex; flex-direction: column; justify-content: center; min-height: 215px; padding: 30px 34px; background: #1c2c25; }.demo-visual-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 32px; color: rgba(244, 246, 241, .45); font-size: 9px; letter-spacing: .12em; }.demo-status { color: var(--lime); }.demo-status i { display: inline-block; width: 5px; height: 5px; margin: 0 5px 1px 0; border-radius: 50%; background: var(--lime); }.feature-demo-visual > strong { margin-bottom: 5px; color: var(--lime); font-family: var(--serif); font-size: clamp(2rem, 3.5vw, 3.5rem); font-weight: 500; letter-spacing: -.07em; line-height: .95; }.feature-demo-visual > small { color: rgba(244, 246, 241, .62); font-size: 10px; }.demo-bars { display: flex; align-items: end; gap: 5px; height: 32px; margin-top: 25px; border-bottom: 1px solid rgba(244, 246, 241, .22); }.demo-bars i { display: block; flex: 1; background: var(--lime); opacity: .75; }.demo-bars i:nth-child(1) { height: 35%; opacity: .28; }.demo-bars i:nth-child(2) { height: 55%; opacity: .4; }.demo-bars i:nth-child(3) { height: 43%; opacity: .5; }.demo-bars i:nth-child(4) { height: 78%; opacity: .65; }.demo-bars i:nth-child(5) { height: 100%; }.demo-bars i:nth-child(6) { height: 64%; opacity: .82; }.demo-bars i:nth-child(7) { height: 87%; }.workflow-section { padding: 130px 0 145px; }.workflow-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 12%; }.workflow-copy h2 { margin-bottom: 25px; }.workflow-copy > p:not(.eyebrow) { max-width: 330px; color: var(--muted); font-size: 14px; }.workflow-list { border-top: 1px solid var(--line); }.workflow-row { display: grid; grid-template-columns: 55px 1fr 1.05fr; gap: 20px; align-items: center; padding: 21px 0; border-bottom: 1px solid var(--line); }.workflow-row > span { color: #769172; font-family: var(--serif); font-size: 20px; }.workflow-row strong { font-family: var(--serif); font-size: 21px; font-weight: 500; letter-spacing: -.04em; }.workflow-row small { color: var(--muted); font-size: 12.5px; line-height: 1.45; }
.page-cta { padding: 115px 0; border-block: 1px solid rgba(19, 34, 28, .1); background: var(--sage); }.page-cta h2 em { color: #647c5c; }.page-cta-inner { display: flex; align-items: end; justify-content: space-between; gap: 40px; }.page-cta h2 { margin-bottom: 0; }.page-cta p { max-width: 350px; margin: 0 0 5px; color: #54704f; font-size: 14px; }.page-cta .button { flex: 0 0 auto; }

@media (max-width: 1000px) {
  .page-hero { min-height: 680px; }.page-hero-grid { gap: 40px; }.page-visual { min-height: 450px; }.page-visual-image img { min-height: 418px; }.capability-grid { grid-template-columns: 1fr 1fr; }.capability-card { min-height: 220px; }.system-section, .workflow-section, .detail-intro { padding-block: 105px; }
}
@media (max-width: 760px) {
  .page-hero { min-height: 820px; padding-top: 155px; }.page-hero::after { height: 28px; }.page-hero-grid { display: flex; flex-direction: column; align-items: stretch; gap: 25px; }.page-hero-copy { padding: 0; }.page-hero-copy h1 { font-size: clamp(2.7rem, 11vw, 3.9rem); }.page-hero-copy .hero-lede { font-size: 15px; }.page-visual { min-height: 355px; box-shadow: 10px 10px 0 rgba(185, 243, 91, .16); }.page-visual-image { inset: 10px; }.page-visual-image img { min-height: 333px; }.visual-label { top: 21px; right: 21px; left: 21px; font-size: 8px; }.visual-feature-stack { right: 20px; bottom: 20px; left: 20px; gap: 5px; }.visual-feature { min-height: 68px; padding: 9px; }.visual-feature span { margin-bottom: 9px; font-size: 13px; }.visual-feature strong { font-size: 10px; }.visual-feature small { font-size: 8px; }.page-sector-inner { display: block; padding-block: 21px; }.page-sector-inner > strong { display: block; margin-bottom: 14px; font-size: 16px; }.page-sector-list { gap: 8px 15px; }.page-sector-list span { font-size: 8px; }.detail-intro, .capability-section, .system-section, .workflow-section { padding-block: 85px; }.detail-intro-grid, .system-section-head, .workflow-grid { display: block; }.detail-intro h2 { margin-bottom: 27px; }.detail-intro-copy, .system-section-head > p { font-size: 13px; }.capability-section-head { display: block; margin-bottom: 35px; }.capability-section-head h2 { margin-bottom: 24px; }.capability-grid { display: block; }.capability-card { min-height: 0; margin-bottom: 10px; padding: 22px; }.service-card { padding: 0; }.service-card-image { height: 185px; }.service-card-body { padding: 22px; }.feature-icon { margin-bottom: 24px; }.system-section-head > p { margin-top: 26px; }.system-map { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto; gap: 8px; min-height: 0; }.system-map::before, .system-map::after { display: none; }.system-node { grid-column: span 2; grid-row: auto; width: min(100%, 224px); height: 170px; margin: 20px auto; padding: 18px; }.system-node-title { font-size: 22px; }.system-node-partner small { max-width: 88px; font-size: 7px; }.map-card:nth-child(n) { grid-column: auto; grid-row: auto; min-height: 85px; padding: 11px; }.map-card strong { font-size: 12px; }.map-card small { font-size: 9px; }.feature-demo { display: block; margin-top: 12px; }.feature-demo-copy { padding: 24px 20px; }.feature-demo-copy h3 { font-size: 2rem; }.feature-demo-visual { min-height: 175px; padding: 24px 20px; }.demo-visual-header { margin-bottom: 23px; }.workflow-copy { margin-bottom: 46px; }.workflow-row { grid-template-columns: 35px 1fr; gap: 10px; padding: 17px 0; }.workflow-row > span { font-size: 16px; }.workflow-row strong { font-size: 18px; }.workflow-row small { grid-column: 2; font-size: 11px; }.page-cta { padding-block: 78px; }.page-cta-inner { display: block; }.page-cta h2 { margin-bottom: 27px; }.page-cta p { margin-bottom: 28px; font-size: 13px; }
}