.connect-section{position:relative;z-index:2;padding:78px max(32px,calc((100vw - 1380px)/2)) 92px;background:linear-gradient(180deg,rgba(7,10,8,.94),rgba(8,12,9,.98));border-top:1px solid rgba(204,214,207,.055)}.connect-section>header{text-align:center}.connect-section>header small{color:#79847c;font-size:9px;font-weight:800;letter-spacing:.2em}.connect-section>header h2{margin:8px 0 10px;color:#edf1ee;font:36px Georgia,serif}.connect-section>header h2 span{display:inline-block;margin-right:8px;color:#8fd052;transform:rotate(-16deg);text-shadow:0 0 10px rgba(142,210,79,.35)}.connect-section>header>i{width:58px;height:2px;display:block;margin:auto;background:linear-gradient(90deg,transparent,#80c449,transparent);box-shadow:0 0 8px rgba(128,196,73,.32)}.connect-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:52px}.connect-steps article{position:relative;min-height:360px;display:flex;align-items:center;flex-direction:column;padding:28px 24px 24px;overflow:hidden;border:1px solid rgba(207,216,210,.1);border-top:2px solid rgba(126,193,70,.72);background:linear-gradient(155deg,rgba(20,24,21,.93),rgba(12,15,13,.96));text-align:center;box-shadow:0 15px 32px rgba(0,0,0,.18);transition:transform .65s cubic-bezier(.22,.61,.36,1),border-color .55s ease,box-shadow .55s ease}.connect-steps article:before{content:"";position:absolute;inset:0;opacity:0;background:radial-gradient(circle at 50% 10%,rgba(136,204,76,.095),transparent 48%);transition:opacity .6s ease}.connect-steps article:hover{transform:translateY(-4px);border-color:rgba(141,207,82,.3);border-top-color:#8bcf50;box-shadow:0 20px 38px rgba(0,0,0,.28),0 0 17px rgba(122,188,64,.07)}.connect-steps article:hover:before{opacity:1}.connect-icon{position:relative;z-index:1;width:70px;height:70px;display:grid;place-items:center;margin-bottom:18px;border:1px solid rgba(132,204,70,.58);border-radius:50%;background:#101611;color:#91d254;font:29px Georgia,serif;box-shadow:0 0 13px rgba(127,195,68,.12);transition:transform .65s ease,box-shadow .65s ease}.connect-icon b{position:absolute;right:14px;bottom:10px;font:13px Arial,sans-serif}.connect-steps article:hover .connect-icon{transform:scale(1.045);box-shadow:0 0 17px rgba(127,195,68,.22)}.connect-steps article>span{position:relative;color:#707b73;font-size:8px;font-weight:900;letter-spacing:.18em}.connect-steps h3{position:relative;margin:7px 0 10px;color:#a4d978;font:20px Georgia,serif}.connect-steps p{position:relative;min-height:68px;margin:0;color:#9ba59e;font:13px/1.65 Georgia,serif}.connect-steps article>a,.connect-steps article>button{position:relative;width:100%;min-height:46px;display:flex;align-items:center;justify-content:center;margin-top:auto;padding:0 15px;border:1px solid rgba(137,202,78,.38);background:linear-gradient(180deg,#3f742d,#294f20);color:#f0f7ec;cursor:pointer;font-size:10px;font-weight:900;letter-spacing:.1em;text-decoration:none;box-shadow:0 0 10px rgba(114,184,58,.09);transition:transform .45s ease,filter .4s ease,box-shadow .5s ease}.connect-steps article>a:hover,.connect-steps article>button:hover{transform:translateY(-2px);filter:brightness(1.12);box-shadow:0 0 14px rgba(122,196,63,.25),0 7px 17px rgba(0,0,0,.2)}.connect-steps .connect-demo-button{flex-direction:column;gap:3px}.connect-demo-button small{color:#a9b8a0;font-size:7px;letter-spacing:.16em}.connect-steps code{position:relative;width:100%;margin-top:auto;padding:14px 10px;border:1px solid rgba(137,202,78,.3);background:#070a08;color:#91d75a;font:12px/1.5 Consolas,monospace}.connect-ready{position:relative;width:100%;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:2px 9px;margin-top:auto;padding:13px 14px;border:1px solid rgba(137,202,78,.16);background:rgba(114,175,60,.035);text-align:left}.connect-ready>i{grid-row:1/3;width:8px;height:8px;border-radius:50%;background:#86ca4e;box-shadow:0 0 8px rgba(134,202,78,.75)}.connect-ready strong{color:#b9df99;font-size:9px;letter-spacing:.1em}.connect-ready small{color:#687268;font-size:7px;letter-spacing:.11em}@media(max-width:1050px){.connect-steps{grid-template-columns:repeat(2,1fr)}}@media(max-width:620px){.connect-section{padding:65px 18px 75px}.connect-steps{grid-template-columns:1fr}.connect-steps article{min-height:330px}.connect-section>header h2{font-size:31px}}
