.product-page { background: #f2f4ef; }
.product-site-header { position: absolute; color: #eef7f2; }.product-site-header .main-nav a.is-current { color: var(--teal); }
.product-hero { position: relative; min-height: 790px; height: 100vh; overflow: hidden; color: #edf7f2; background: #071416; }.product-hero:after { position: absolute; inset: 0; z-index: 1; pointer-events: none; content: ""; border-bottom: 1px solid rgba(147,220,205,.16); }
#product-scene { position: absolute; z-index: 0; inset: 0; width: 100%; height: 100%; }
.product-hero-copy { position: relative; z-index: 2; display: flex; flex-direction: column; justify-content: center; width: min(650px, 50vw); min-height: 100%; padding: 130px 0 122px 8.4vw; }.product-hero-copy h1 { margin: 0 0 25px; font-size: 62px; line-height: 1.18; }.product-hero-copy h1 span,.product-hero-copy h1 em { display: block; font-style: normal; }.product-hero-copy h1 em { color: var(--teal); }.product-hero-copy > p:not(.eyebrow) { max-width: 530px; margin: 0 0 31px; color: #afc6be; font-size: 16px; line-height: 1.9; }
.product-hero-notes { position: absolute; z-index: 2; right: 8.4vw; bottom: 72px; display: grid; grid-template-columns: repeat(3, minmax(115px, 1fr)); gap: 28px; width: min(505px, 40vw); }.product-hero-notes div { padding-left: 12px; border-left: 1px solid rgba(141,221,203,.38); }.product-hero-notes b { display: block; color: var(--teal); font-size: 12px; }.product-hero-notes span { display: block; margin-top: 4px; color: #b1c5bf; font-size: 12px; white-space: nowrap; }
.product-scroll { position: absolute; z-index: 2; right: 8.4vw; bottom: 27px; display: flex; align-items: center; gap: 10px; color: #819a92; font-size: 10px; font-weight: 800; letter-spacing: 1.2px; }.product-scroll i { width: 60px; height: 1px; background: var(--teal); }.product-scroll b { margin-left: 9px; color: #e7f5ef; font-size: 10px; }

.product-overview { padding: 132px 8.4vw 138px; background: #f6f8f4; }.product-overview-heading { display: grid; grid-template-columns: 1.25fr .75fr; gap: 8vw; align-items: end; }.product-overview-heading h2 { margin: 0; }.product-overview-heading h2 em { color: var(--teal-deep); font-style: normal; }.product-overview-heading > p { max-width: 405px; margin: 0 0 7px; color: #50625d; font-size: 16px; line-height: 1.85; }
.product-route { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: end; gap: 18px; margin-top: 74px; padding: 44px 0 50px; border-bottom: 1px solid #d5e0da; }.product-route:before { position: absolute; right: 0; bottom: 50px; left: 0; height: 1px; content: ""; background: #a6c5bc; }.route-module { position: relative; display: flex; flex-direction: column; min-height: 335px; padding: 25px 23px 39px; border: 1px solid #dce5df; background: #fff; box-shadow: 13px 15px 0 rgba(20,123,107,.06); }.route-module:nth-child(2) { min-height: 380px; }.route-module:nth-child(3) { min-height: 350px; }.route-module:nth-child(4) { min-height: 400px; }.route-module:before { position: absolute; bottom: -51px; left: 50%; width: 12px; height: 12px; border: 3px solid #f6f8f4; border-radius: 50%; content: ""; background: #22bda1; box-shadow: 0 0 0 1px #76bcae; transform: translateX(-50%); }.route-module:after { position: absolute; bottom: -39px; left: 50%; width: 1px; height: 39px; content: ""; background: #a6c5bc; }.route-module > p { margin: 0; color: #71877f; font-size: 10px; font-weight: 800; letter-spacing: 1px; }.route-module > span { margin-top: 8px; color: var(--teal-deep); font-size: 10px; font-weight: 800; letter-spacing: .8px; }.route-module h3 { margin: auto 0 13px; color: #0c2221; font-size: 25px; line-height: 1.22; }.route-module > div { width: 32px; height: 2px; margin-bottom: 13px; background: var(--teal); }.route-module small { color: #5a6d67; font-size: 13px; line-height: 1.82; }.route-pin { position: absolute; top: 26px; right: 23px; width: 23px; height: 23px; border: 1px solid #7cccb9; transform: rotate(45deg); }.route-pin i { position: absolute; inset: 6px; display: block; background: var(--teal); }.route-module-1 .route-pin { border-color: #ff9a7a; }.route-module-1 .route-pin i { background: var(--orange); }.route-module-2 .route-pin { border-color: #91a9dc; }.route-module-2 .route-pin i { background: #5a8ee6; }.route-module-3 .route-pin { border-color: #d9af62; }.route-module-3 .route-pin i { background: #e4bd5f; }

.product-control { display: grid; grid-template-columns: .88fr 1.12fr; gap: 9vw; min-height: 630px; padding: 125px 8.4vw; color: #edf8f3; background: #0a1b1d; }.product-control-copy { align-self: center; max-width: 480px; }.product-control-copy h2 { margin-bottom: 20px; }.product-control-copy > p:not(.eyebrow) { color: #a9c2ba; font-size: 16px; line-height: 1.87; }.product-control-copy .underlined-button { color: #e8f8f2; border-color: #d7efe6; }
.product-control-board { align-self: center; overflow: hidden; border: 1px solid rgba(150,225,207,.4); background: #0d2426; box-shadow: 18px 18px 0 rgba(84,226,196,.1); transform: perspective(1100px) rotateY(-5deg) rotateX(2deg); }.control-board-top { display: flex; align-items: center; gap: 6px; height: 46px; padding: 0 17px; border-bottom: 1px solid rgba(172,230,216,.17); }.control-board-top i { width: 7px; height: 7px; border-radius: 50%; background: #506d68; }.control-board-top i:first-child { background: var(--orange); }.control-board-top i:nth-child(2) { background: #e1c15d; }.control-board-top b { margin-left: 9px; color: #93aea5; font-size: 10px; letter-spacing: 1px; }.control-board-body { position: relative; display: grid; gap: 13px; min-height: 330px; padding: 31px; }.control-board-body article { position: relative; z-index: 1; display: grid; grid-template-columns: 36px 1fr auto; align-items: center; min-height: 64px; padding: 0 16px; border: 1px solid rgba(150,225,207,.16); background: rgba(84,226,196,.05); }.control-board-body article span { color: var(--teal); font-size: 11px; font-weight: 800; }.control-board-body article strong { font-size: 15px; }.control-board-body article b { color: #75cdb8; font-size: 10px; letter-spacing: .9px; }.control-board-line { position: absolute; top: 54px; bottom: 47px; left: 48px; width: 1px; background: rgba(84,226,196,.45); }.control-board-line i { position: absolute; left: -3px; width: 7px; height: 7px; border-radius: 50%; background: var(--teal); }.control-board-line i:nth-child(1) { top: 0; }.control-board-line i:nth-child(2) { top: 50%; }.control-board-line i:nth-child(3) { bottom: 0; }.control-board-line i:nth-child(4) { display: none; }

.product-connect { padding: 123px 8.4vw 134px; color: #122220; background: #e9efeb; text-align: center; }.product-connect .section-index { margin-bottom: 22px; }.product-connect h2 { margin: 0; }.product-connect > div { display: flex; flex-wrap: wrap; justify-content: center; gap: 0; max-width: 850px; margin: 63px auto 0; border-top: 1px solid rgba(18,34,32,.18); border-left: 1px solid rgba(18,34,32,.18); }.product-connect span { flex: 1 1 30%; min-width: 180px; padding: 20px 18px; border-right: 1px solid rgba(18,34,32,.18); border-bottom: 1px solid rgba(18,34,32,.18); color: #36514a; font-size: 14px; font-weight: 700; }
.product-cta { padding: 120px 24px; color: #f0f9f4; background: #147b6b; text-align: center; }.product-cta p { margin: 0 0 16px; color: #bff9ea; font-size: 11px; font-weight: 800; letter-spacing: 1.4px; }.product-cta h2 { margin: 0 0 31px; }.product-cta .primary-button { color: #edf8f4; border-color: rgba(239,250,245,.6); background: transparent; }.product-cta .primary-button:hover { color: #102422; background: #e8fff7; }

@media (max-width: 1100px) { .product-hero-copy,.product-overview,.product-control,.product-connect{padding-left:6vw;padding-right:6vw}.product-hero-notes,.product-scroll{right:6vw}.product-route{gap:12px}.route-module{padding-left:18px;padding-right:18px}.route-module h3{font-size:22px}.product-control{gap:6vw} }
@media (max-width: 760px) { .product-site-header{height:70px;padding:0 20px}.product-hero{min-height:770px;height:auto}.product-hero-copy{width:100%;min-height:770px;padding:155px 24px 205px}.product-hero-copy h1{font-size:40px;line-height:1.22}.product-hero-copy > p:not(.eyebrow){font-size:15px;line-height:1.8}.product-hero-notes{right:24px;bottom:72px;left:24px;width:auto;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.product-hero-notes div{min-width:0;padding-left:8px}.product-hero-notes b{font-size:11px}.product-hero-notes span{font-size:10px;line-height:1.35;white-space:normal}.product-scroll{right:24px;bottom:25px}.product-overview{padding:78px 24px}.product-overview-heading{grid-template-columns:1fr;gap:24px}.product-overview-heading > p{font-size:15px}.product-route{grid-template-columns:1fr;gap:14px;margin-top:42px;padding:0 0 43px;border-bottom:0}.product-route:before{display:none}.route-module,.route-module:nth-child(n){min-height:250px;padding:21px 20px 26px;box-shadow:9px 11px 0 rgba(20,123,107,.06)}.route-module:before,.route-module:after{display:none}.route-module h3{margin-top:auto;font-size:24px}.product-control{grid-template-columns:1fr;gap:44px;min-height:0;padding:78px 24px}.product-control-copy > p:not(.eyebrow){font-size:15px}.product-control-board{transform:none}.control-board-body{min-height:300px;padding:22px}.control-board-body article{grid-template-columns:30px 1fr;padding:0 12px}.control-board-body article b{grid-column:2;font-size:9px}.control-board-line{left:37px}.product-connect{padding:78px 24px}.product-connect > div{margin-top:38px}.product-connect span{flex-basis:50%;min-width:0;padding:16px 7px;font-size:12px}.product-cta{padding:82px 24px}.product-cta h2{font-size:31px} }
