.landing-page { background: #f5f7f4; }
.landing-nav { height: 82px; max-width: 1280px; margin: 0 auto; padding: 0 28px; display: flex; align-items: center; justify-content: space-between; }
.landing-brand { display: flex; padding: 0; color: #173b30; }.landing-brand > span:last-child { display: block; }.landing-brand strong { color: #163b30; }.landing-brand small { color: #729085; }.landing-nav nav { display: flex; align-items: center; gap: 30px; }.landing-nav nav a { text-decoration: none; color: #52665f; font-weight: 700; font-size: 12px; }.landing-nav > .button { display: inline-flex; align-items: center; text-decoration: none; }
.landing-hero { min-height: 660px; max-width: 1360px; margin: 0 auto; padding: 84px clamp(28px,6vw,86px); border-radius: 28px; color: #fff; background: radial-gradient(circle at 79% 12%,rgba(91,211,166,.22),transparent 24%),linear-gradient(135deg,#0b2820,#174d3c 68%,#1b624a); display: grid; grid-template-columns: minmax(0,1.05fr) minmax(480px,.95fr); align-items: center; gap: 70px; overflow: hidden; }
.landing-kicker { margin: 0 0 17px; color: #73dab3; font-weight: 800; font-size: 11px; text-transform: uppercase; letter-spacing: .16em; }.landing-kicker.dark { color: #0d8a63; }.landing-hero h1 { margin: 0; font: 700 clamp(42px,5vw,70px)/1.02 Manrope,sans-serif; letter-spacing: -.055em; }.landing-lede { color: #bfd5cc; font-size: 17px; line-height: 1.7; max-width: 700px; margin: 25px 0 30px; }.landing-actions { display: flex; gap: 11px; }.landing-actions a { min-height: 46px; display: inline-flex; align-items: center; text-decoration: none; }.trust-row { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 31px; color: #a8c8bc; font-size: 10px; font-weight: 700; }
.product-window { transform: perspective(1100px) rotateY(-4deg) rotateX(2deg); border-radius: 17px; background: #f5f7f5; box-shadow: 0 34px 70px rgba(0,0,0,.28); color: #182720; overflow: hidden; }.window-bar { height: 36px; display: flex; align-items: center; gap: 6px; background: #e9eeeb; padding: 0 13px; }.window-bar i { width: 7px; height: 7px; border-radius: 50%; background: #b6c3be; }.window-bar span { margin-left: auto; color: #7d8d87; font-size: 8px; text-transform: uppercase; letter-spacing: .1em; font-weight: 800; }.window-body { padding: 23px; }.window-summary { display: grid; grid-template-columns: repeat(3,1fr); gap: 9px; }.window-summary > span { padding: 12px; background: #fff; border: 1px solid #dfe6e2; border-radius: 10px; color: #718079; font-size: 8px; }.window-summary strong { color: #17382e; display: block; font: 700 19px Manrope,sans-serif; margin-top: 7px; }.window-opportunity { margin: 13px 0; padding: 16px; background: #fff; border: 1px solid #dfe6e2; border-radius: 12px; display: grid; grid-template-columns: 44px 1fr auto; align-items: center; gap: 12px; }.score-badge { width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; background: #dff4e9; color: #08704f; font-weight: 800; }.window-opportunity small,.window-opportunity strong,.window-opportunity p { display: block; margin: 0; }.window-opportunity div small { color: #86938e; font-size: 8px; text-transform: uppercase; }.window-opportunity div strong { margin: 5px 0; font-size: 10px; }.window-opportunity p { color: #708079; font-size: 8px; }.window-opportunity > b { color: #0d7856; font-size: 16px; text-align: right; }.window-opportunity > b small { color: #89958f; font-size: 7px; font-weight: 500; margin-top: 3px; }.window-flow { min-height: 62px; background: #123c30; color: #b7ccc4; border-radius: 11px; display: flex; align-items: center; justify-content: space-around; padding: 10px; }.window-flow span { font-size: 8px; border: 1px solid rgba(255,255,255,.15); border-radius: 999px; padding: 6px 8px; }.window-flow span.done { background: #2e8567; color: #fff; }.window-flow i { font-style: normal; color: #608b7b; }
.proof-strip { max-width: 1180px; margin: 36px auto 0; padding: 24px 25px; display: flex; align-items: center; justify-content: center; gap: 35px; }.proof-strip p { color: #87948f; font-size: 10px; text-transform: uppercase; letter-spacing: .13em; font-weight: 800; }.proof-strip div { display: flex; gap: 28px; color: #3e534b; font-weight: 700; }
.landing-section { max-width: 1180px; margin: 0 auto; padding: 120px 28px; }.section-copy { max-width: 700px; margin-bottom: 50px; }.section-copy h2,.pilot-section h2 { margin: 0; font: 700 clamp(34px,4.5vw,53px)/1.08 Manrope,sans-serif; letter-spacing: -.045em; }.section-copy > p:last-child { color: #6a7873; font-size: 15px; line-height: 1.7; }.module-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }.module-grid article { min-height: 190px; background: #fff; border: 1px solid #dfe6e2; border-radius: 16px; padding: 22px; }.module-grid article > span { color: #0c8a62; font-size: 9px; font-weight: 800; }.module-grid h3 { font: 700 19px Manrope,sans-serif; margin: 35px 0 10px; }.module-grid p { color: #6b7a74; line-height: 1.6; margin: 0; }
.workflow-section { max-width: 1360px; margin: 0 auto; padding: 110px clamp(28px,7vw,100px); border-radius: 28px; background: #112e25; color: #fff; }.section-copy.inverse p:last-child { color: #a9c0b7; }.workflow-steps { list-style: none; padding: 0; margin: 0 0 40px; display: grid; grid-template-columns: repeat(5,1fr); gap: 14px; }.workflow-steps li { position: relative; min-height: 170px; padding: 22px 18px; border-radius: 14px; background: rgba(255,255,255,.055); border: 1px solid rgba(255,255,255,.08); }.workflow-steps li > span { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: #2d755d; color: #fff; font-weight: 800; font-size: 10px; }.workflow-steps h3 { font: 700 16px Manrope,sans-serif; margin: 27px 0 8px; }.workflow-steps p { color: #9cb5ab; line-height: 1.55; margin: 0; font-size: 11px; }.workflow-section > .button { display: inline-flex; align-items: center; text-decoration: none; min-height: 46px; }
.package-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; align-items: stretch; }.package-grid article { min-height: 450px; background: #fff; border: 1px solid #dfe6e2; border-radius: 18px; padding: 27px; position: relative; }.package-grid article.featured { border: 2px solid #17845f; box-shadow: 0 18px 38px rgba(19,97,72,.10); transform: translateY(-8px); }.recommended { position: absolute; right: 20px; top: 20px; color: #0d7956; background: #e0f3ea; border-radius: 999px; padding: 6px 9px; font-size: 8px; text-transform: uppercase; letter-spacing: .08em; font-weight: 800; }.package-label { color: #0f8b64; text-transform: uppercase; letter-spacing: .12em; font-weight: 800; font-size: 9px; }.package-grid h3 { font: 700 30px Manrope,sans-serif; margin: 14px 0 11px; }.package-grid article > p:nth-of-type(2) { color: #6c7974; min-height: 60px; line-height: 1.55; }.package-grid ul { list-style: none; padding: 18px 0; margin: 18px 0; border-top: 1px solid #e4e9e6; }.package-grid li { padding: 8px 0 8px 20px; position: relative; }.package-grid li::before { content: '✓'; position: absolute; left: 0; color: #0e8b63; font-weight: 800; }.package-price { position: absolute; left: 27px; bottom: 27px; color: #455950; font-weight: 800; font-size: 11px; }
.pilot-section { max-width: 1360px; margin: 0 auto 35px; padding: 95px clamp(28px,7vw,100px); border-radius: 28px; background: radial-gradient(circle at 80% 10%,rgba(96,214,170,.22),transparent 25%),#0c3428; color: #fff; display: grid; grid-template-columns: minmax(0,1.25fr) minmax(330px,.75fr); gap: 80px; align-items: center; }.pilot-section > div:first-child > p:last-child { color: #b4cbc2; font-size: 15px; line-height: 1.7; max-width: 690px; }.pilot-card { border: 1px solid rgba(255,255,255,.13); background: rgba(255,255,255,.07); border-radius: 18px; padding: 26px; }.pilot-card > span { color: #76ddb7; font-size: 10px; text-transform: uppercase; letter-spacing: .12em; font-weight: 800; }.pilot-card ul { list-style: none; padding: 17px 0; margin: 12px 0; border-top: 1px solid rgba(255,255,255,.1); }.pilot-card li { padding: 8px 0 8px 19px; position: relative; color: #d1e2db; }.pilot-card li::before { content: '✓'; position: absolute; left: 0; color: #6ad6ae; }.pilot-card .button { display: flex; align-items: center; justify-content: center; text-decoration: none; }.pilot-card-actions { display: grid; gap: 10px; }.pilot-secondary-link { color: #a9ead2; text-align: center; font-size: 11px; font-weight: 800; text-decoration: none; }.pilot-secondary-link:hover,.pilot-secondary-link:focus-visible { color: #fff; text-decoration: underline; }.pilot-card small { display: block; text-align: center; color: #8eaaa0; margin-top: 10px; font-size: 8px; }
.landing-footer { max-width: 1180px; margin: 0 auto; min-height: 150px; padding: 40px 28px; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid #dfe6e2; }.landing-footer p { color: #697872; }.landing-footer > div { display: flex; flex-direction: column; text-align: right; gap: 7px; color: #71817b; font-size: 10px; }.landing-footer > div a { color: #0d7956; font-weight: 800; }
@media (max-width: 980px) { .landing-nav nav { display: none; }.landing-hero { grid-template-columns: 1fr; padding-top: 65px; }.product-window { max-width: 650px; transform: none; }.module-grid { grid-template-columns: repeat(2,1fr); }.workflow-steps { grid-template-columns: repeat(3,1fr); }.package-grid { grid-template-columns: 1fr; max-width: 700px; }.package-grid article.featured { transform: none; }.pilot-section { grid-template-columns: 1fr; gap: 35px; }.proof-strip { display: block; text-align: center; }.proof-strip div { flex-wrap: wrap; justify-content: center; } }
@media (max-width: 620px) { .landing-nav { height: 70px; padding: 0 16px; }.landing-nav > .button { padding: 0 10px; }.landing-hero { border-radius: 0; min-height: auto; padding: 60px 20px; }.landing-hero h1 { font-size: 40px; }.landing-lede { font-size: 15px; }.trust-row { gap: 10px; }.product-window { display: none; }.proof-strip div { gap: 13px; }.landing-section { padding: 80px 18px; }.module-grid { grid-template-columns: 1fr; }.workflow-section { border-radius: 0; padding: 80px 20px; }.workflow-steps { grid-template-columns: 1fr; }.workflow-steps li { min-height: 130px; }.pilot-section { border-radius: 0; margin-bottom: 0; padding: 80px 20px; }.landing-footer { display: block; padding-bottom: 90px; }.landing-footer p { margin: 25px 0; }.landing-footer > div { text-align: left; } }
