.ec-hero { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.9fr); min-height:670px; margin-top:28px; overflow:hidden; border-radius:34px; background:#f3f6ef; color:#0c130d; }
.ec-hero-copy { align-self:center; padding:clamp(38px,5.1vw,82px); }
.ec-hero .eyebrow { color:#478e1f; }
.ec-hero h1 { max-width:740px; margin:25px 0 18px; font:600 clamp(54px,6.15vw,98px)/.96 "Space Grotesk",sans-serif; letter-spacing:-.075em; }
.ec-hero-subtitle { max-width:620px; margin:0 0 18px; font:600 clamp(23px,2.2vw,32px)/1.22 "Space Grotesk",sans-serif; letter-spacing:-.045em; }
.ec-hero-copy>p:not(.ec-hero-subtitle) { max-width:630px; color:#445047; font-size:15px; line-height:1.8; }
.ec-hero .button-row { display:flex; flex-wrap:wrap; gap:10px; margin-top:28px; }
.ec-hero-benefits { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:11px 20px; margin:39px 0 0; padding:22px 0 0; border-top:1px solid #ced8cb; list-style:none; }
.ec-hero-benefits li { position:relative; padding-left:17px; color:#263a2b; font-size:12px; font-weight:700; }
.ec-hero-benefits li::before { content:""; position:absolute; top:.45em; left:0; width:7px; height:7px; border-radius:50%; background:#64ce22; }
.ec-hero-art { position:relative; display:flex; flex-direction:column; justify-content:space-between; min-width:0; overflow:hidden; padding:28px; background:radial-gradient(circle at 80% 12%,#a7f782 0,transparent 34%),linear-gradient(145deg,#244e30 0%,#162a1f 42%,#0d1511 100%); }
.ec-hero-art::before { content:""; position:absolute; width:480px; height:480px; right:-160px; top:-130px; border:1px solid #b7ef9b66; border-radius:50%; box-shadow:0 0 0 80px #b7ef9b11,0 0 0 160px #b7ef9b0c; }
.ec-art-top,.ec-art-bottom { position:relative; z-index:2; display:flex; justify-content:space-between; gap:20px; color:#e2f4e0; font-size:9px; font-weight:800; letter-spacing:.17em; }
.ec-art-bottom { margin-top:25px; }
.ec-browser { position:relative; z-index:1; width:89%; margin:55px 0 65px; overflow:hidden; border:1px solid #cfdec9; border-radius:19px; background:#fafbf6; box-shadow:0 35px 90px #020d06a8; transform:rotate(-2deg); }
.ec-browser-bar { display:flex; align-items:center; gap:5px; height:38px; padding:0 12px; border-bottom:1px solid #e5e8e0; color:#415247; }
.ec-browser-bar i { width:6px; height:6px; border-radius:50%; background:#c9d3c6; }
.ec-browser-bar span { margin-left:10px; font-size:7px; font-weight:900; letter-spacing:.12em; }
.ec-browser-bar b { margin-left:auto; font-size:6px; letter-spacing:.07em; }
.ec-browser-body { display:grid; grid-template-columns:1fr 1fr; gap:13px; min-height:370px; padding:25px 19px; color:#13221a; }
.ec-browser-heading { display:flex; flex-direction:column; justify-content:center; gap:15px; }
.ec-browser-heading small { max-width:170px; color:#657568; font-size:7px; font-weight:800; letter-spacing:.11em; }
.ec-browser-heading strong { font:600 clamp(28px,3.2vw,48px)/.98 "Space Grotesk",sans-serif; letter-spacing:-.07em; }
.ec-browser-heading em { color:#5b9d3e; font-style:normal; }
.ec-browser-heading span { align-self:flex-start; padding:9px 10px; border-radius:50px; background:#142f1a; color:white; font-size:7px; font-weight:800; }
.ec-product-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
.ec-product { display:flex; flex-direction:column; justify-content:flex-end; padding:10px; border-radius:8px; background:#e0e8d8; }
.ec-product:nth-child(2) { background:#f1dfc7; }
.ec-product-shape { position:relative; display:block; width:65%; height:49%; margin:auto; border-radius:28% 28% 42% 42%; background:linear-gradient(115deg,#d7b59c,#a37055); box-shadow:inset -14px 0 #82574144,10px 12px 10px #59402a22; }
.ec-product-shape::before { content:""; position:absolute; width:50%; height:17%; top:-13%; left:25%; border:5px solid #ae856c; border-bottom:0; border-radius:50% 50% 0 0; }
.shape-two { width:61%; height:34%; border-radius:45% 45% 28% 28%; background:linear-gradient(125deg,#718a6c,#354d39); }
.shape-two::before { border-color:#4a654a; }
.ec-product small { color:#7d867a; font-size:6px; font-weight:800; letter-spacing:.12em; }
.ec-product b { margin-top:4px; font-size:9px; }
.ec-phone { position:absolute; z-index:2; width:26%; min-width:125px; right:4.5%; bottom:11%; padding:11px 10px 13px; border:5px solid #1a211b; border-radius:21px; background:#f5f8f1; color:#172417; box-shadow:0 18px 35px #06110896; transform:rotate(7deg); }
.ec-phone-top { display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; font-size:6px; font-weight:800; }
.ec-phone-top i { width:19px; height:5px; border-radius:9px; background:#162116; }
.ec-phone>small { display:block; text-align:center; font-size:5px; font-weight:900; letter-spacing:.1em; }
.ec-phone-product { display:grid; place-items:center; height:105px; margin:13px 0; border-radius:5px; background:#e3e9dc; }
.ec-phone-product i { width:50px; height:65px; border-radius:30% 30% 42% 42%; background:linear-gradient(125deg,#cfaf98,#99684f); }
.ec-phone>strong { display:block; font:600 12px/1.1 "Space Grotesk",sans-serif; }
.ec-phone-cta { display:block; padding:6px; margin-top:9px; border-radius:30px; background:#223b25; color:#fff; text-align:center; font-size:5px; font-weight:800; }
.ec-split { display:grid; grid-template-columns:.88fr 1fr; gap:clamp(40px,8vw,130px); }
.ec-why { padding-block:135px; }
.ec-why h2,.ec-section-intro h2,.ec-pricing h2,.ec-choice h2,.ec-work h2,.ec-faq h2 { margin:20px 0; color:var(--white); font:600 clamp(41px,4.8vw,72px)/1.05 "Space Grotesk",sans-serif; letter-spacing:-.06em; }
.ec-prose p { margin:0 0 20px; color:#b4c1b5; font-size:15px; line-height:1.85; }
.ec-services,.ec-features,.ec-work { padding-block:110px 125px; }
.ec-services .section-heading,.ec-features .section-heading { max-width:920px; }
.ec-services .section-heading p,.ec-features .section-heading p,.ec-section-intro p,.ec-choice-heading>p,.ec-faq-intro>p { max-width:740px; color:#b4c1b5; line-height:1.8; }
.ec-service-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:45px; }
.ec-service-grid article { min-height:280px; padding:25px; border:1px solid #344636; border-radius:23px; background:#19241b; transition:transform .25s ease,border-color .25s ease,background .25s ease; }
.ec-service-grid article:hover { transform:translateY(-5px); border-color:#79e735; background:#203022; }
.ec-card-icon { display:grid; place-items:center; width:46px; height:46px; border:1px solid #4f7c43; border-radius:13px; color:var(--lime); }
.ec-card-icon svg { width:25px; height:25px; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.ec-card-num { display:block; margin-top:34px; color:#81af77; font-size:10px; font-weight:800; letter-spacing:.1em; }
.ec-service-grid h3 { margin:10px 0 12px; color:var(--white); font:600 21px/1.18 "Space Grotesk",sans-serif; letter-spacing:-.035em; }
.ec-service-grid p { margin:0; color:#aebead; font-size:12px; line-height:1.75; }
.ec-service-related { margin:27px 0 0; color:#aebead; font-size:13px; line-height:1.75; }
.ec-service-related a { color:var(--lime); text-decoration:underline; text-underline-offset:3px; }
.ec-platforms,.ec-process,.ec-choice,.ec-faq { padding-block:120px; }
.ec-section-intro { max-width:900px; }
.ec-platform-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:15px; margin:47px 0 28px; }
.ec-platform-grid article { padding:36px; border:1px solid #3e4c3e; border-radius:26px; background:#182119; }
.ec-platform-grid article:nth-child(2) { background:#e7f1dd; color:#1b2a1e; }
.ec-platform-grid article>span { color:var(--lime); font-size:10px; font-weight:800; letter-spacing:.12em; }
.ec-platform-grid article:nth-child(2)>span { color:#488c2c; }
.ec-platform-grid h3 { margin:55px 0 16px; color:var(--white); font:600 35px/1.05 "Space Grotesk",sans-serif; letter-spacing:-.05em; }
.ec-platform-grid article:nth-child(2) h3 { color:#172c1b; }
.ec-platform-grid p { color:#b6c4b5; font-size:13px; line-height:1.8; }
.ec-platform-grid article:nth-child(2) p { color:#405447; }
.ec-platforms .text-link { color:var(--lime); }
.ec-feature-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:0; margin-top:55px; border-top:1px solid #445644; }
.ec-feature-grid article { min-height:175px; padding:25px 24px 25px 0; border-bottom:1px solid #445644; }
.ec-feature-grid article:not(:nth-child(4n+1)) { padding-left:24px; border-left:1px solid #445644; }
.ec-feature-grid b { color:var(--lime); font-size:10px; }
.ec-feature-grid h3 { margin:23px 0 9px; color:var(--white); font:600 18px/1.2 "Space Grotesk",sans-serif; }
.ec-feature-grid p { margin:0; color:#a8b9aa; font-size:12px; line-height:1.7; }
.ec-process-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; margin:50px 0 0; padding:0; border-top:1px solid #405041; list-style:none; }
.ec-process-list li { display:grid; grid-template-columns:40px 1fr; gap:15px; min-height:175px; padding:26px 24px 28px 0; border-bottom:1px solid #405041; }
.ec-process-list li:not(:nth-child(3n+1)) { padding-left:24px; border-left:1px solid #405041; }
.ec-process-list li>span { color:var(--lime); font-size:11px; font-weight:800; }
.ec-process-list h3 { margin:0 0 12px; color:var(--white); font:600 21px/1.2 "Space Grotesk",sans-serif; }
.ec-process-list p { margin:0; color:#aebbae; font-size:12px; line-height:1.75; }
.ec-pricing { padding-block:110px; background:#1d2b1f; }
.ec-pricing-head { display:flex; justify-content:space-between; align-items:end; gap:40px; margin-bottom:46px; }
.ec-pricing-head>div { max-width:860px; }
.ec-pricing h2 { margin-bottom:22px; }
.ec-pricing-head>div>p { max-width:750px; margin:0; color:#bfd0bd; font-size:15px; line-height:1.8; }
.ec-pricing-aside { flex:0 0 220px; margin:0; padding:0 0 8px 25px; border-left:1px solid #6a8765; color:#adc2ae; font-size:11px; line-height:1.8; }
.ec-pricing-aside strong { color:#f2f9ef; font-size:13px; }
.ec-plan-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.ec-plan-card { display:flex; flex-direction:column; min-width:0; padding:29px 25px 25px; border:1px solid #557352; border-radius:24px; background:#102015; transition:transform .25s ease,border-color .25s ease; }
.ec-plan-card:hover { transform:translateY(-5px); border-color:#8cf04f; }
.ec-plan-card.is-featured { border-color:#dff7ca; background:#e4f5d8; color:#162418; }
.ec-plan-kicker { color:var(--lime); font-size:10px; font-weight:800; letter-spacing:.13em; }
.ec-plan-card.is-featured .ec-plan-kicker { color:#42852a; }
.ec-plan-card h3 { min-height:64px; margin:22px 0 10px; color:var(--white); font:600 clamp(24px,2.2vw,32px)/1.08 "Space Grotesk",sans-serif; letter-spacing:-.045em; }
.ec-plan-card.is-featured h3 { color:#162418; }
.ec-plan-card>p:not(.ec-plan-price):not(.ec-plan-scope) { min-height:74px; margin:0; color:#b4c8b3; font-size:12px; line-height:1.65; }
.ec-plan-card.is-featured>p:not(.ec-plan-price):not(.ec-plan-scope) { color:#4d654d; }
.ec-plan-price { display:flex; align-items:baseline; flex-wrap:wrap; gap:5px 9px; margin:23px 0 25px; padding:21px 0; border-top:1px solid #456047; border-bottom:1px solid #456047; }
.ec-plan-price span,.ec-plan-price small { color:#b6cab5; font-size:10px; font-weight:700; }
.ec-plan-price strong { color:var(--lime); font:600 clamp(38px,3.6vw,53px)/1 "Space Grotesk",sans-serif; letter-spacing:-.06em; }
.ec-plan-card.is-featured .ec-plan-price { border-color:#b4cfa9; }
.ec-plan-card.is-featured .ec-plan-price span,.ec-plan-card.is-featured .ec-plan-price small { color:#52704f; }
.ec-plan-card.is-featured .ec-plan-price strong { color:#245e20; }
.ec-plan-list-label { color:#f1f9ee; font-size:11px; font-weight:800; }
.ec-plan-card.is-featured .ec-plan-list-label { color:#1c3a1d; }
.ec-plan-card ul { flex:1; margin:14px 0 0; padding:0; list-style:none; }
.ec-plan-card li { position:relative; padding:0 0 12px 17px; color:#ccdbca; font-size:11px; line-height:1.55; }
.ec-plan-card li::before { content:""; position:absolute; top:.53em; left:0; width:6px; height:6px; border-radius:50%; background:var(--lime); }
.ec-plan-card.is-featured li { color:#345037; }
.ec-plan-card.is-featured li::before { background:#4e9e2b; }
.ec-plan-card .ec-plan-scope { min-height:58px; margin:12px 0 18px; padding-top:14px; border-top:1px solid #456047; color:#a8c1a6; font-size:10px; line-height:1.55; }
.ec-plan-card.is-featured .ec-plan-scope { border-color:#b4cfa9; color:#4b654b; }
.ec-plan-card>a { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:13px 16px; border-radius:40px; background:var(--lime); color:#102016; font-size:11px; font-weight:800; text-decoration:none; transition:background .2s ease,transform .2s ease; }
.ec-plan-card>a:hover { background:#a6ff70; transform:translateY(-2px); }
.ec-plan-card.is-featured>a { background:#172d1b; color:#f5fff0; }
.ec-plan-card.is-featured>a:hover { background:#315e2c; }
.ec-plan-card>a svg { width:16px; height:16px; flex:none; }
.ec-plan-terms { display:grid; grid-template-columns:1fr 1fr; gap:clamp(35px,6vw,90px); margin:42px 0 0; padding:33px 0 70px; border-bottom:1px solid #63805f; }
.ec-plan-terms h3 { margin:11px 0 8px; color:var(--white); font:600 22px/1.2 "Space Grotesk",sans-serif; }
.ec-plan-terms p { max-width:570px; margin:0; color:#a9bea9; font-size:11px; line-height:1.75; }
.ec-pricing-layout { display:grid; grid-template-columns:1fr .88fr; gap:clamp(40px,9vw,140px); align-items:center; padding-top:75px; }
.ec-pricing-layout h3 { margin:18px 0; color:var(--white); font:600 clamp(35px,4vw,56px)/1.06 "Space Grotesk",sans-serif; letter-spacing:-.055em; }
.ec-pricing-layout>div:first-child>p { max-width:650px; margin-bottom:30px; color:#bdd0bd; font-size:15px; line-height:1.85; }
.ec-cost-panel { padding:38px; border:1px solid #63875e; border-radius:26px; background:#102015; }
.ec-cost-panel h3 { margin:0 0 20px; color:var(--white); font:600 28px "Space Grotesk",sans-serif; }
.ec-cost-panel ul { margin:0; padding:0; list-style:none; }
.ec-cost-panel li { display:flex; gap:16px; padding:12px 0; border-bottom:1px solid #35543a; color:#d7e5d5; font-size:13px; }
.ec-cost-panel li span { color:var(--lime); font-size:10px; font-weight:800; }
.ec-cost-panel p { margin:21px 0 0; color:#a8bda9; font-size:12px; line-height:1.7; }
.ec-choice { display:grid; grid-template-columns:.88fr 1.1fr; gap:60px 90px; }
.ec-choice .text-link { color:var(--lime); }
.ec-choice-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.ec-choice-grid article { padding:28px; border:1px solid #3b4d3c; border-radius:22px; background:#19231a; }
.ec-choice-grid span { color:var(--lime); font-size:11px; font-weight:800; }
.ec-choice-grid h3 { margin:50px 0 11px; color:var(--white); font:600 21px/1.2 "Space Grotesk",sans-serif; }
.ec-choice-grid p { margin:0; color:#adbdad; font-size:12px; line-height:1.75; }
.ec-location-note { grid-column:1/-1; max-width:850px; padding-top:22px; border-top:1px solid #354836; color:#a4b2a5; font-size:12px; line-height:1.7; }
.ec-work-layout { display:grid; grid-template-columns:1fr .86fr; gap:clamp(40px,8vw,120px); align-items:center; }
.ec-work p { max-width:650px; color:#b6c5b6; font-size:15px; line-height:1.8; }
.ec-work p a { color:var(--lime); text-decoration:underline; text-underline-offset:3px; }
.ec-work .button { margin-top:18px; }
.ec-work-art { margin:0; overflow:hidden; border:1px solid #425e41; border-radius:28px; background:#1b271e; }
.ec-work-art a { display:block; overflow:hidden; }
.ec-work-art a:focus-visible { outline:3px solid var(--lime); outline-offset:-3px; }
.ec-work-art img { display:block; width:100%; height:auto; transition:transform .4s ease; }
.ec-work-art a:hover img { transform:scale(1.025); }
.ec-work-art figcaption { padding:17px 23px; color:#cde3c9; font-size:10px; font-weight:800; letter-spacing:.12em; }
.ec-faq { display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(40px,8vw,120px); }
.ec-faq-list { border-top:1px solid #3d503e; }
.ec-faq-list details { border-bottom:1px solid #3d503e; }
.ec-faq-list summary { position:relative; padding:22px 40px 22px 0; color:var(--white); font:600 18px/1.35 "Space Grotesk",sans-serif; cursor:pointer; list-style:none; }
.ec-faq-list summary::-webkit-details-marker { display:none; }
.ec-faq-list summary::after { content:"+"; position:absolute; right:8px; top:21px; color:var(--lime); font:400 24px/1 sans-serif; }
.ec-faq-list details[open] summary::after { content:"−"; }
.ec-faq-list details p { max-width:680px; margin:0 35px 22px 0; color:#b4c3b5; font-size:13px; line-height:1.85; }
.ec-faq-list a { color:var(--lime); text-decoration:underline; }
.ec-final { padding-block:35px 125px; }
.ec-final-panel { padding:clamp(36px,6vw,90px); border-radius:34px; background:#dff2d3; color:#102316; }
.ec-final .eyebrow { color:#468e2f; }
.ec-final h2 { max-width:850px; margin:24px 0; font:600 clamp(46px,5.5vw,80px)/1 "Space Grotesk",sans-serif; letter-spacing:-.065em; }
.ec-final p { max-width:720px; color:#3b5340; font-size:15px; line-height:1.8; }
.ec-final .button-row { display:flex; flex-wrap:wrap; gap:11px; margin-top:28px; }
@media (max-width:1100px) { .ec-hero { grid-template-columns:1fr; } .ec-hero-art { min-height:540px; } .ec-browser { max-width:650px; margin-inline:auto; } .ec-service-grid,.ec-plan-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .ec-choice { gap:40px; } }
@media (max-width:800px) { .ec-split,.ec-pricing-layout,.ec-choice,.ec-work-layout,.ec-faq { grid-template-columns:1fr; } .ec-why,.ec-platforms,.ec-process,.ec-choice,.ec-faq { padding-block:85px; } .ec-services,.ec-features,.ec-work { padding-block:85px; } .ec-platform-grid { grid-template-columns:1fr; } .ec-platform-grid h3 { margin-top:35px; } .ec-feature-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .ec-feature-grid article:not(:nth-child(4n+1)) { padding-left:0; border-left:0; } .ec-feature-grid article:nth-child(even) { padding-left:20px; border-left:1px solid #445644; } .ec-process-list { grid-template-columns:repeat(2,minmax(0,1fr)); } .ec-process-list li:not(:nth-child(3n+1)) { padding-left:0; border-left:0; } .ec-process-list li:nth-child(even) { padding-left:20px; border-left:1px solid #405041; } .ec-choice-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .ec-location-note { grid-column:auto; } .ec-work-art { min-height:360px; } }
@media (max-width:800px) { .ec-pricing-head { display:block; } .ec-pricing-aside { margin-top:24px; } }
@media (max-width:600px) { .ec-hero { margin-top:15px; border-radius:25px; } .ec-hero-copy { padding:37px 28px; } .ec-hero h1 { font-size:clamp(46px,13vw,68px); } .ec-hero-subtitle { font-size:24px; } .ec-hero .button-row .button,.ec-final .button-row .button { width:100%; justify-content:center; } .ec-hero-benefits { gap:11px; } .ec-hero-art { min-height:395px; padding:19px; } .ec-browser { width:93%; margin:35px 0 40px; } .ec-browser-body { min-height:250px; padding:17px 12px; } .ec-browser-heading strong { font-size:27px; } .ec-browser-bar b { display:none; } .ec-phone { bottom:14%; min-width:105px; padding:8px; } .ec-phone-product { height:70px; } .ec-phone-product i { width:35px; height:45px; } .ec-service-grid,.ec-feature-grid,.ec-process-list,.ec-choice-grid,.ec-plan-grid,.ec-plan-terms { grid-template-columns:1fr; } .ec-service-grid article { min-height:230px; } .ec-feature-grid article:nth-child(even),.ec-process-list li:nth-child(even) { padding-left:0; border-left:0; } .ec-feature-grid article { min-height:0; } .ec-platform-grid article,.ec-cost-panel { padding:26px; } .ec-pricing { padding-block:85px; } .ec-pricing-head { display:block; } .ec-pricing-aside { margin-top:23px; } .ec-plan-card h3,.ec-plan-card>p:not(.ec-plan-price):not(.ec-plan-scope),.ec-plan-card .ec-plan-scope { min-height:0; } .ec-plan-price strong { font-size:48px; } .ec-plan-terms { gap:24px; padding-bottom:45px; } .ec-pricing-layout { padding-top:55px; } .ec-final { padding-bottom:90px; } .ec-final-panel { border-radius:25px; } }
@media (prefers-reduced-motion:reduce) { .ec-service-grid article,.ec-plan-card,.ec-plan-card>a { transition:none; } .ec-service-grid article:hover,.ec-plan-card:hover,.ec-plan-card>a:hover { transform:none; } }