:root{--wc-blue:#0b83ff;--wc-blue2:#02b9fd;--wc-ink:#0d1f39;--wc-muted:#6e7d90;--wc-line:#e8eef6;--wc-bg:#fff;--wc-soft:#f7fbff;--wc-radius:24px;--wc-shadow:0 20px 60px rgba(32,104,190,.10)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body.webcraft-site{margin:0;background:#fff;color:var(--wc-ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Arial,sans-serif;-webkit-font-smoothing:antialiased}.webcraft-site a{text-decoration:none;color:inherit}.wc-page{overflow:hidden}.wc-container{width:min(1180px,calc(100% - 48px));margin:0 auto}.wc-header{height:82px;display:flex;align-items:center;background:rgba(255,255,255,.86);backdrop-filter:blur(20px);position:sticky;top:0;z-index:30;border-bottom:1px solid rgba(232,238,246,.7)}.wc-nav{display:flex;align-items:center;gap:34px}.wc-logo{display:flex;align-items:center;margin-right:auto}.wc-logo img{width:126px;height:auto;display:block}.wc-menu{display:flex;gap:30px;font-size:14px;font-weight:600}.wc-menu a{opacity:.82}.wc-menu a:hover{color:var(--wc-blue);opacity:1}.wc-btn{min-height:48px;padding:0 20px;border-radius:14px;display:inline-flex;align-items:center;justify-content:center;gap:12px;font-weight:700;font-size:14px;transition:.25s ease}.wc-btn:hover{transform:translateY(-2px)}.wc-btn-primary{background:linear-gradient(135deg,var(--wc-blue),var(--wc-blue2));color:#fff;box-shadow:0 12px 28px rgba(11,131,255,.2)}.wc-btn-ghost{border:1px solid var(--wc-line);background:#fff}.wc-menu-toggle{display:none;background:#fff;border:1px solid var(--wc-line);width:44px;height:44px;border-radius:12px;padding:11px}.wc-menu-toggle span{display:block;height:2px;background:var(--wc-ink);margin:4px 0;border-radius:5px}.wc-hero{padding:68px 0 42px;background:radial-gradient(circle at 76% 30%,rgba(45,160,255,.14),transparent 30%),linear-gradient(#fff,#fbfdff)}.wc-hero-grid{display:grid;grid-template-columns:1.02fr .98fr;align-items:center;gap:38px;min-height:570px}.wc-kicker,.wc-label{display:inline-block;color:var(--wc-blue);font-size:12px;font-weight:800;letter-spacing:.06em}.wc-kicker{background:#f3f8ff;border:1px solid #dfefff;padding:8px 12px;border-radius:999px}.wc-hero h1{font-size:clamp(46px,5.2vw,76px);line-height:1.01;letter-spacing:-.045em;margin:20px 0}.wc-hero h1 em{font-style:normal;color:var(--wc-blue)}.wc-hero-copy>p{max-width:580px;color:var(--wc-muted);font-size:18px;line-height:1.7}.wc-actions{display:flex;gap:14px;margin:32px 0}.wc-mini-features{display:flex;flex-wrap:wrap;gap:14px 24px;color:#587087;font-size:13px}.wc-hero-art{height:520px;position:relative}.wc-laptop{position:absolute;left:5%;right:11%;top:56px;transform:rotate(-4deg);filter:drop-shadow(0 35px 40px rgba(13,31,57,.18))}.wc-screen{aspect-ratio:16/10;background:linear-gradient(145deg,#ffffff,#f2f7ff);border:8px solid #18263a;border-bottom-width:14px;border-radius:20px;padding:28px;position:relative;overflow:hidden}.wc-screen:after{content:"";position:absolute;width:220px;height:220px;border-radius:50%;right:-40px;top:25px;background:linear-gradient(135deg,rgba(11,131,255,.08),rgba(2,185,253,.32));filter:blur(2px)}.wc-screen-top{display:flex;gap:5px}.wc-screen-top i{width:6px;height:6px;border-radius:50%;background:#d9e2ef}.wc-screen-brand{font-size:34px;font-weight:800;line-height:1.02;letter-spacing:-.04em;margin-top:45px;position:relative;z-index:2}.wc-screen-card{position:absolute;right:50px;bottom:45px;width:38%;height:34%;border-radius:18px;background:linear-gradient(135deg,#fff,rgba(11,131,255,.14));box-shadow:0 18px 45px rgba(11,131,255,.18)}.wc-screen-btn{width:90px;height:25px;border-radius:8px;background:var(--wc-blue);margin-top:20px}.wc-base{height:22px;margin:0 -7%;background:linear-gradient(#eef2f7,#cbd5e1);border-radius:3px 3px 35px 35px}.wc-phone{position:absolute;right:0;bottom:75px;width:155px;height:310px;background:#fff;border:8px solid #18263a;border-radius:32px;box-shadow:0 28px 50px rgba(13,31,57,.22);padding:48px 16px 16px;transform:rotate(5deg)}.wc-phone-notch{position:absolute;top:9px;left:50%;transform:translateX(-50%);width:65px;height:16px;border-radius:12px;background:#18263a}.wc-phone-text{font-weight:800;font-size:19px;line-height:1.05}.wc-phone-button{width:72px;height:24px;border-radius:8px;background:var(--wc-blue);margin-top:18px}.wc-orb{position:absolute;border-radius:50%;background:linear-gradient(135deg,var(--wc-blue2),var(--wc-blue));box-shadow:0 18px 40px rgba(11,131,255,.18)}.wc-orb-a{width:62px;height:62px;right:4%;top:25px}.wc-orb-b{width:24px;height:24px;left:10%;bottom:40px}.wc-trust{padding:28px 0 54px}.wc-logos{display:grid;grid-template-columns:repeat(6,1fr);align-items:center;gap:25px;color:#718096;font-weight:800;font-size:18px;text-align:center;opacity:.85}.wc-section{padding:88px 0}.wc-section:nth-of-type(even){background:linear-gradient(180deg,#fff,#fbfdff)}.wc-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:34px}.wc-section-head h2,.wc-center h2,.wc-value h2,.wc-cta h2{font-size:clamp(32px,4vw,50px);letter-spacing:-.04em;margin:7px 0 0}.wc-section-head>a{color:var(--wc-blue);font-weight:700;font-size:14px}.wc-cards{display:grid;gap:18px}.wc-services{grid-template-columns:repeat(3,1fr)}.wc-card{background:#fff;border:1px solid var(--wc-line);border-radius:20px;padding:28px;box-shadow:0 10px 35px rgba(45,88,130,.04);transition:.28s ease}.wc-card:hover{transform:translateY(-5px);box-shadow:var(--wc-shadow);border-color:#dceafd}.wc-card>b{display:flex;width:44px;height:44px;border-radius:13px;align-items:center;justify-content:center;background:#f1f7ff;color:var(--wc-blue);font-size:20px}.wc-card h3{font-size:19px;margin:24px 0 10px}.wc-card p{color:var(--wc-muted);line-height:1.65;font-size:14px}.wc-card>a{color:var(--wc-blue);font-size:22px}.wc-value{background:radial-gradient(circle at 72% 50%,rgba(11,131,255,.09),transparent 26%)}.wc-value-grid{display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:70px}.wc-checks{list-style:none;padding:0;margin:28px 0 0;display:grid;gap:24px}.wc-checks li{display:grid;gap:5px;padding-left:34px;position:relative}.wc-checks li:before{content:"✓";position:absolute;left:0;top:0;color:#fff;background:var(--wc-blue);width:22px;height:22px;border-radius:50%;font-size:12px;display:grid;place-items:center}.wc-checks span{color:var(--wc-muted);font-size:14px;line-height:1.6}.wc-ui-stack{height:370px;position:relative}.wc-ui-stack div{position:absolute;border-radius:28px;background:rgba(255,255,255,.74);border:1px solid #e2edfb;box-shadow:0 25px 70px rgba(11,131,255,.12);backdrop-filter:blur(12px)}.wc-ui-stack div:nth-child(1){inset:75px 8% 20px 18%;transform:rotate(-8deg)}.wc-ui-stack div:nth-child(2){inset:35px 18% 80px 5%;transform:rotate(6deg)}.wc-ui-stack div:nth-child(3){width:155px;height:105px;right:2%;top:40px}.wc-ui-stack div:nth-child(4){width:140px;height:90px;left:8%;bottom:10px}.wc-ui-stack>span{position:absolute;inset:0;display:grid;place-items:center;font-size:110px;font-weight:900;color:var(--wc-blue);text-shadow:0 12px 30px rgba(11,131,255,.22)}.wc-projects{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.wc-project-img{height:215px;border-radius:18px;display:flex;align-items:flex-end;padding:18px;overflow:hidden;background-size:cover!important;position:relative}.wc-project-img:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent,rgba(13,31,57,.45))}.wc-project-img span{color:#fff;font-weight:800;position:relative;z-index:2}.wc-p1{background:linear-gradient(135deg,#cdd8e4,#5d7690)}.wc-p2{background:linear-gradient(135deg,#f8f8f8,#c8d0d9)}.wc-p3{background:linear-gradient(135deg,#eef5ff,#90bfff)}.wc-p4{background:linear-gradient(135deg,#a6d4ff,#486d85)}.wc-project small{display:block;margin-top:14px;color:#8b9aad}.wc-project h3{font-size:16px;margin:5px 0}.wc-center{text-align:center}.wc-steps{display:grid;grid-template-columns:repeat(5,1fr);gap:15px;margin-top:50px;position:relative}.wc-steps:before{content:"";height:1px;background:#dce8f7;position:absolute;left:6%;right:6%;top:26px}.wc-steps>div{display:grid;gap:10px;text-align:center;position:relative}.wc-steps i{font-style:normal;width:52px;height:52px;border-radius:50%;background:#fff;border:1px solid #dce8f7;color:var(--wc-blue);display:grid;place-items:center;margin:auto;box-shadow:0 8px 25px rgba(11,131,255,.1)}.wc-steps span{font-size:13px;color:var(--wc-muted);line-height:1.5}.wc-stats{margin-top:55px;border:1px solid var(--wc-line);border-radius:22px;display:grid;grid-template-columns:repeat(4,1fr);padding:28px;background:#fff}.wc-stats>div{text-align:center;border-right:1px solid var(--wc-line)}.wc-stats>div:last-child{border-right:0}.wc-stats strong{display:block;font-size:32px;color:var(--wc-ink)}.wc-stats span{font-size:13px;color:var(--wc-muted)}.wc-reviews{grid-template-columns:repeat(3,1fr)}.wc-person{display:flex;align-items:center;gap:12px}.wc-person>span{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:#eff6ff;color:var(--wc-blue);font-weight:800}.wc-person small{display:block;color:#8996a8;margin-top:3px}.wc-stars{color:var(--wc-blue);letter-spacing:4px;margin-top:18px}.wc-cta{padding-top:30px}.wc-cta-box{min-height:280px;border-radius:30px;padding:48px;background:linear-gradient(135deg,#f6faff,#edf6ff);display:grid;grid-template-columns:1.2fr .8fr;align-items:center;overflow:hidden;border:1px solid #dfecfb}.wc-cta-box p{color:var(--wc-muted);margin-bottom:24px}.wc-cta-art{height:220px;position:relative}.wc-cta-art:before,.wc-cta-art:after{content:"";position:absolute;border-radius:34px;inset:45px 15% 0 24%;background:linear-gradient(145deg,#fff,#d8ecff);box-shadow:0 30px 55px rgba(11,131,255,.14);transform:rotate(-8deg)}.wc-cta-art:after{inset:70px 25% 10px 10%;transform:rotate(7deg);opacity:.8}.wc-cta-art span{position:absolute;inset:0;display:grid;place-items:center;color:var(--wc-blue);font-size:80px;font-weight:900;z-index:2}.wc-footer{padding:65px 0 25px;border-top:1px solid var(--wc-line);background:#fff}.wc-footer-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:45px}.wc-logo-footer img{width:145px}.wc-footer p,.wc-footer span,.wc-footer a{font-size:13px;color:var(--wc-muted);line-height:1.8}.wc-footer-grid>div{display:flex;flex-direction:column;align-items:flex-start}.wc-footer-grid b{margin-bottom:13px}.wc-copy{border-top:1px solid var(--wc-line);margin-top:40px;padding-top:20px;color:#93a0af;font-size:12px}.reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}.reveal.is-visible{opacity:1;transform:none}
@media(max-width:960px){.wc-menu,.wc-nav-cta{display:none}.wc-menu-toggle{display:block}.wc-menu.is-open{position:absolute;display:flex;flex-direction:column;top:70px;left:24px;right:24px;background:#fff;border:1px solid var(--wc-line);border-radius:18px;padding:20px;box-shadow:var(--wc-shadow)}.wc-hero-grid,.wc-value-grid{grid-template-columns:1fr}.wc-hero-art{height:430px}.wc-services{grid-template-columns:repeat(2,1fr)}.wc-projects{grid-template-columns:repeat(2,1fr)}.wc-steps{grid-template-columns:1fr 1fr}.wc-steps:before{display:none}.wc-stats{grid-template-columns:repeat(2,1fr);gap:20px}.wc-stats>div{border:0}.wc-reviews{grid-template-columns:1fr}.wc-footer-grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.wc-container{width:min(100% - 30px,1180px)}.wc-header{height:68px}.wc-logo img{width:105px}.wc-hero{padding-top:35px}.wc-hero-grid{min-height:0}.wc-hero h1{font-size:44px}.wc-hero-copy>p{font-size:16px}.wc-actions{flex-direction:column;align-items:stretch}.wc-mini-features{display:grid;grid-template-columns:1fr 1fr}.wc-hero-art{height:330px}.wc-laptop{left:0;right:12%;top:35px}.wc-screen{padding:16px;border-width:5px;border-bottom-width:10px}.wc-screen-brand{font-size:23px;margin-top:22px}.wc-phone{width:100px;height:205px;border-width:5px;right:0;bottom:30px;border-radius:22px;padding:36px 10px 10px}.wc-phone-text{font-size:12px}.wc-phone-notch{width:45px;height:11px}.wc-logos{grid-template-columns:repeat(3,1fr);font-size:13px;gap:20px}.wc-section{padding:62px 0}.wc-section-head{align-items:flex-start}.wc-services,.wc-projects,.wc-steps,.wc-stats,.wc-footer-grid{grid-template-columns:1fr}.wc-project-img{height:240px}.wc-stats>div{padding:10px 0}.wc-value-grid{gap:35px}.wc-ui-stack{height:280px}.wc-cta-box{grid-template-columns:1fr;padding:30px}.wc-cta-art{height:160px}.wc-menu.is-open{top:62px;left:15px;right:15px}}

/* WebCraft v5 — typography + coded hero devices */
body.webcraft-site{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;font-weight:400;letter-spacing:-.01em}
.wc-menu{font-size:15px;font-weight:500;letter-spacing:-.015em}.wc-menu a{opacity:.9}
.wc-btn{min-height:50px;padding:0 23px;border-radius:13px;font-size:15px;font-weight:600;letter-spacing:-.015em}.wc-btn-primary,.wc-btn-primary:visited,.wc-btn-primary:hover,.wc-btn-primary:focus{color:#fff!important}
.wc-nav-cta{font-size:15px;font-weight:600;padding-inline:24px}.wc-hero h1{font-weight:650}.wc-hero-copy>p{font-weight:400}.wc-card h3,.wc-section-head h2,.wc-center h2,.wc-value h2,.wc-cta h2{font-weight:650}.wc-card p,.wc-footer p,.wc-footer a,.wc-footer span{font-weight:400}
.wc-kicker,.wc-mini-features{display:none!important}
.wc-hero-art{height:540px;perspective:1200px;isolation:isolate}.wc-art-glow{position:absolute;width:520px;height:420px;right:-20px;top:55px;border-radius:50%;background:radial-gradient(circle,rgba(26,145,255,.22),rgba(117,199,255,.09) 48%,transparent 72%);filter:blur(16px);z-index:-2}
.wc-laptop{left:4%;right:7%;top:75px;transform:rotateX(3deg) rotateY(-7deg) rotateZ(-1.5deg);filter:drop-shadow(0 38px 38px rgba(20,48,82,.23));animation:wcDeviceFloat 6s ease-in-out infinite}.wc-screen{aspect-ratio:16/10;border:9px solid #172234;border-bottom-width:13px;border-radius:17px;padding:24px;background:linear-gradient(145deg,#fff 30%,#f2f8ff);box-shadow:inset 0 0 0 1px rgba(255,255,255,.7)}.wc-screen-nav{height:24px;display:flex;align-items:center;gap:6px;font-size:8px;position:relative;z-index:3}.wc-screen-nav b{font-size:17px;color:var(--wc-blue);font-style:italic}.wc-screen-nav span{font-weight:650;margin-right:auto}.wc-screen-nav i{width:24px;height:3px;border-radius:3px;background:#dce6f2}.wc-screen-brand{font-size:31px;font-weight:700;line-height:1.02;margin-top:48px;z-index:3}.wc-screen-brand em,.wc-phone-text em{font-style:normal;color:var(--wc-blue)}.wc-screen>p{font-size:8px;color:#74859a;max-width:160px;line-height:1.5;position:relative;z-index:3}.wc-screen-visual{position:absolute;right:34px;top:70px;width:43%;height:58%;border-radius:26px;background:linear-gradient(145deg,rgba(255,255,255,.92),rgba(76,165,255,.16));box-shadow:0 25px 55px rgba(11,131,255,.18);display:grid;place-items:center;transform:rotate(-4deg);z-index:2}.wc-screen-visual:before,.wc-screen-visual:after{content:"";position:absolute;width:58%;height:32%;border-radius:16px;background:rgba(255,255,255,.75);border:1px solid rgba(156,207,255,.45);box-shadow:0 14px 30px rgba(11,131,255,.1)}.wc-screen-visual:before{left:-20%;bottom:5%;transform:rotate(9deg)}.wc-screen-visual:after{right:-14%;top:4%;transform:rotate(8deg)}.wc-screen-visual b{width:74px;height:74px;border-radius:20px;display:grid;place-items:center;background:linear-gradient(145deg,var(--wc-blue2),var(--wc-blue));color:#fff;font-size:40px;box-shadow:0 18px 34px rgba(11,131,255,.32);transform:rotate(4deg)}.wc-screen-btn{display:inline-flex;width:auto;height:auto;padding:8px 12px;border-radius:8px;color:#fff;background:linear-gradient(135deg,var(--wc-blue),var(--wc-blue2));font-size:7px;font-weight:600;margin-top:10px;position:relative;z-index:3}.wc-base{height:28px;margin:0 -10%;background:linear-gradient(180deg,#eef2f6,#b9c4d1);border-radius:2px 2px 42px 42px;box-shadow:0 18px 20px rgba(43,70,101,.12)}
.wc-phone{right:-1%;bottom:38px;width:152px;height:315px;border:7px solid #172234;border-radius:32px;padding:42px 14px 14px;transform:rotate(6deg);box-shadow:0 32px 55px rgba(13,31,57,.25);animation:wcPhoneFloat 5s ease-in-out infinite;z-index:8}.wc-phone-notch{top:8px;width:62px;height:15px}.wc-phone-logo{position:absolute;top:32px;left:14px;font-size:7px;font-weight:650}.wc-phone-logo b{color:var(--wc-blue);font-size:12px}.wc-phone-text{font-size:20px;font-weight:700;line-height:1.02;margin-top:20px}.wc-phone>p{font-size:7px;line-height:1.45;color:#78879a;margin:13px 0}.wc-phone-button{display:inline-flex;width:auto;height:auto;padding:8px 10px;border-radius:8px;color:#fff;background:linear-gradient(135deg,var(--wc-blue),var(--wc-blue2));font-size:7px;font-weight:600}.wc-phone-icons{position:absolute;left:13px;right:13px;bottom:16px;display:flex;justify-content:space-between;color:var(--wc-blue)}.wc-phone-icons i{font-size:10px;font-style:normal}
.wc-float{position:absolute;background:rgba(255,255,255,.72);border:1px solid rgba(194,220,248,.7);box-shadow:0 18px 45px rgba(30,112,205,.12);backdrop-filter:blur(14px);z-index:7;animation:wcFloat 5.5s ease-in-out infinite}.wc-float-chart{left:-2%;top:105px;width:132px;height:105px;border-radius:19px;padding:17px;transform:rotate(-2deg)}.wc-float-chart small{display:block;color:#718198;font-size:9px}.wc-float-chart strong{display:block;color:var(--wc-blue);font-size:15px;margin-top:4px}.wc-float-chart i{display:block;width:70px;height:32px;margin-top:9px;border-bottom:2px solid var(--wc-blue);transform:skewY(-17deg);opacity:.8}.wc-float-code{right:-8%;top:350px;width:72px;height:72px;border-radius:18px;display:grid;place-items:center;color:var(--wc-blue);font-size:21px;font-weight:650;transform:rotate(12deg);animation-delay:-1.4s}.wc-float-w{right:-4%;bottom:4px;width:68px;height:68px;border-radius:18px;display:grid;place-items:center;color:var(--wc-blue);font-size:30px;font-weight:750;transform:rotate(9deg);animation-delay:-2.5s}.wc-ring{position:absolute;left:4%;bottom:58px;width:62px;height:62px;border:14px solid #168fff;border-radius:50%;box-shadow:inset 0 0 15px rgba(255,255,255,.8),0 15px 30px rgba(11,131,255,.2);transform:rotateX(58deg) rotateZ(-20deg);z-index:6;animation:wcFloat 4.8s ease-in-out infinite}.wc-orb-a{width:38px;height:38px;right:-1%;top:70px}.wc-orb-b{width:20px;height:20px;left:18%;top:25px;bottom:auto;background:linear-gradient(135deg,#fff,#78bfff)}
@keyframes wcDeviceFloat{0%,100%{transform:rotateX(3deg) rotateY(-7deg) rotateZ(-1.5deg) translateY(0)}50%{transform:rotateX(3deg) rotateY(-7deg) rotateZ(-1.5deg) translateY(-9px)}}@keyframes wcPhoneFloat{0%,100%{transform:rotate(6deg) translateY(0)}50%{transform:rotate(4deg) translateY(-12px)}}@keyframes wcFloat{0%,100%{translate:0 0}50%{translate:0 -12px}}
@media(max-width:960px){.wc-float-code{right:1%}.wc-float-w{right:4%}}
@media(max-width:640px){.wc-btn{font-size:15px;font-weight:600}.wc-hero-art{height:360px}.wc-laptop{left:3%;right:10%;top:62px}.wc-screen{padding:12px}.wc-screen-nav i{display:none}.wc-screen-brand{font-size:20px;margin-top:22px}.wc-screen>p{display:none}.wc-screen-visual{right:17px;top:45px}.wc-screen-visual b{width:44px;height:44px;border-radius:13px;font-size:24px}.wc-screen-btn{font-size:5px;padding:5px 7px}.wc-phone{width:94px;height:195px;right:0;bottom:28px;padding:28px 8px 8px}.wc-phone-logo{top:23px;left:8px}.wc-phone-text{font-size:12px;margin-top:12px}.wc-phone>p{display:none}.wc-phone-button{font-size:5px;padding:5px 6px}.wc-phone-icons{display:none}.wc-float-chart{width:88px;height:70px;padding:10px;left:0;top:25px}.wc-float-chart small{font-size:6px}.wc-float-chart strong{font-size:10px}.wc-float-chart i{width:45px;height:18px;margin-top:4px}.wc-float-code{width:46px;height:46px;font-size:14px;top:245px}.wc-float-w{width:44px;height:44px;font-size:20px}.wc-ring{width:42px;height:42px;border-width:9px;bottom:35px}}
@media(prefers-reduced-motion:reduce){.wc-laptop,.wc-phone,.wc-float,.wc-ring{animation:none!important}}

/* WebCraft v6 — refined coded laptop & phone */
.wc-hero-art{height:560px}
.wc-art-glow{width:590px;height:455px;right:-65px;top:48px;background:radial-gradient(circle at 54% 48%,rgba(33,145,255,.25),rgba(117,199,255,.10) 46%,transparent 73%);filter:blur(18px)}
.wc-laptop{left:1%;right:4%;top:68px;transform:rotateX(4deg) rotateY(-7deg) rotateZ(-1.2deg);transform-style:preserve-3d;filter:drop-shadow(0 42px 40px rgba(20,48,82,.20));z-index:4}
.wc-display{position:relative;padding:8px;background:linear-gradient(145deg,#1b2638,#0c1420);border-radius:22px 22px 15px 15px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.10),0 0 0 1px rgba(16,30,48,.12)}
.wc-display:before{content:"";position:absolute;top:5px;left:50%;width:4px;height:4px;border-radius:50%;background:#29425f;box-shadow:0 0 0 2px #101b2a;z-index:5}
.wc-screen{border:0;border-radius:15px;aspect-ratio:16/10;padding:27px;background:linear-gradient(145deg,#fff 27%,#f4f8ff 72%,#edf5ff);overflow:hidden}
.wc-screen:after{width:260px;height:260px;right:-46px;top:18px;background:radial-gradient(circle at 45% 40%,rgba(255,255,255,.92),rgba(76,165,255,.24) 48%,rgba(57,150,255,.10) 70%,transparent 72%)}
.wc-screen-brand{font-size:32px;margin-top:43px}.wc-screen>p{font-size:8px;max-width:170px}.wc-screen-visual{right:28px;top:65px;width:44%;height:60%;border-radius:28px;background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(91,174,255,.16));box-shadow:0 25px 58px rgba(11,131,255,.22);transform:rotate(-3deg)}
.wc-screen-visual b{width:78px;height:78px;border-radius:23px;font-size:42px;z-index:3}
.wc-ui-tile{position:absolute;border-radius:15px;background:rgba(255,255,255,.82);border:1px solid rgba(165,210,255,.55);box-shadow:0 14px 26px rgba(11,131,255,.11)}
.wc-ui-tile-a{width:42%;height:27%;left:-13%;bottom:3%;transform:rotate(8deg)}.wc-ui-tile-b{width:37%;height:24%;right:-10%;top:3%;transform:rotate(7deg)}
.wc-ui-dot{position:absolute;width:9px;height:9px;border-radius:3px;background:var(--wc-blue);box-shadow:0 6px 12px rgba(11,131,255,.22)}.wc-ui-dot-a{left:16%;top:22%}.wc-ui-dot-b{right:17%;bottom:17%}
.wc-deck{height:72px;margin:-2px -9% 0;background:linear-gradient(180deg,#eef2f6 0%,#dce3ea 54%,#c6d0da 100%);clip-path:polygon(7% 0,93% 0,100% 100%,0 100%);position:relative;transform-origin:top center;transform:rotateX(66deg);box-shadow:0 28px 26px rgba(37,66,98,.13)}
.wc-keyboard{position:absolute;left:22%;right:22%;top:11px;height:32px;border-radius:5px;background:repeating-linear-gradient(90deg,#273343 0 7px,transparent 7px 10px),repeating-linear-gradient(0deg,rgba(35,48,63,.92) 0 6px,transparent 6px 9px);opacity:.90;filter:drop-shadow(0 1px 0 rgba(255,255,255,.25))}
.wc-trackpad{position:absolute;width:24%;height:22px;left:38%;bottom:7px;border-radius:4px;border:1px solid rgba(98,113,130,.25);background:rgba(225,231,237,.55)}
.wc-lip{height:10px;margin:-25px -9% 0;border-radius:0 0 42px 42px;background:linear-gradient(180deg,#c4ced8,#e8edf2 65%,#b8c3ce);position:relative;z-index:4}.wc-lip:after{content:"";position:absolute;left:43%;right:43%;top:0;height:4px;border-radius:0 0 8px 8px;background:#aeb9c5}
.wc-phone{right:-1.5%;bottom:25px;width:165px;height:337px;background:linear-gradient(145deg,#252f3a,#8793a0 55%,#202a35);border:0;border-radius:36px;padding:5px;box-shadow:0 34px 58px rgba(13,31,57,.28),inset 0 0 0 1px rgba(255,255,255,.36);transform:rotate(5deg);z-index:9}
.wc-phone-screen{position:relative;width:100%;height:100%;border-radius:31px;background:linear-gradient(160deg,#fff 35%,#f8fbff 100%);overflow:hidden;padding:44px 14px 14px;box-shadow:inset 0 0 0 1px rgba(14,30,48,.20)}
.wc-phone-screen:after{content:"";position:absolute;width:130px;height:130px;right:-55px;top:94px;border-radius:50%;background:radial-gradient(circle,rgba(50,153,255,.18),transparent 68%)}
.wc-phone-notch{top:9px;width:66px;height:17px;background:#101a27;z-index:4}.wc-phone-notch:after{content:"";position:absolute;width:5px;height:5px;border-radius:50%;right:9px;top:6px;background:#25394d}
.wc-phone-logo{top:34px;left:14px;right:14px;display:flex;align-items:center;gap:4px;z-index:3}.wc-phone-logo span{margin-left:auto;font-size:10px;color:#283649}.wc-phone-text{font-size:20px;margin-top:22px;position:relative;z-index:3}.wc-phone>p{display:none}.wc-phone-screen>p{font-size:7px;line-height:1.45;color:#78879a;margin:13px 0;position:relative;z-index:3}
.wc-phone-button{font-size:7px;padding:8px 9px;position:relative;z-index:3}.wc-phone-icons{left:14px;right:14px;bottom:15px;z-index:3}.wc-phone-icons i{display:grid;gap:3px;text-align:center;font-size:11px}.wc-phone-icons small{font-size:4px;color:#8b99aa;font-weight:500}
.wc-phone-side{position:absolute;display:block;background:#5d6874;border-radius:3px;z-index:-1}.wc-phone-side-a{width:3px;height:48px;left:-2px;top:73px}.wc-phone-side-b{width:3px;height:62px;right:-2px;top:90px}
.wc-float-chart{left:-1%;top:102px}.wc-float-code{right:-7%;top:342px}.wc-float-w{right:-3%;bottom:0}.wc-ring{left:5%;bottom:52px}
@keyframes wcDeviceFloat{0%,100%{transform:rotateX(4deg) rotateY(-7deg) rotateZ(-1.2deg) translateY(0)}50%{transform:rotateX(4deg) rotateY(-7deg) rotateZ(-1.2deg) translateY(-8px)}}
@media(max-width:640px){.wc-hero-art{height:375px}.wc-laptop{left:2%;right:8%;top:64px}.wc-screen{padding:13px}.wc-screen-brand{font-size:20px;margin-top:23px}.wc-screen-visual{right:14px;top:44px}.wc-deck{height:45px}.wc-keyboard{top:7px;height:20px}.wc-trackpad{height:13px;bottom:5px}.wc-lip{height:7px;margin-top:-16px}.wc-phone{width:101px;height:207px;right:0;bottom:23px;border-radius:24px;padding:3px}.wc-phone-screen{border-radius:21px;padding:29px 8px 8px}.wc-phone-notch{width:46px;height:11px;top:6px}.wc-phone-logo{top:22px;left:8px;right:8px}.wc-phone-text{font-size:12px;margin-top:13px}.wc-phone-screen>p{display:none}.wc-phone-button{font-size:5px;padding:5px 6px}.wc-phone-icons{display:none}.wc-phone-side-a{height:30px;top:48px}.wc-phone-side-b{height:38px;top:57px}}

/* WebCraft v7 — premium hero rebuild */
.wc-hero{padding:54px 0 24px;background:radial-gradient(circle at 78% 28%,rgba(58,166,255,.18),transparent 34%),linear-gradient(180deg,#fff 0%,#fbfdff 100%)}
.wc-hero-grid{grid-template-columns:.9fr 1.1fr;gap:24px;min-height:650px}
.wc-hero-copy{padding-top:6px;position:relative;z-index:10}
.wc-hero h1{font-size:clamp(54px,5.35vw,82px);line-height:.98;letter-spacing:-.055em;margin:0 0 24px;max-width:690px;font-weight:800}
.wc-hero-copy>p{font-size:18px;line-height:1.62;max-width:635px;margin:0;color:#6a7b91}
.wc-actions{margin:31px 0 34px;gap:16px}
.wc-btn{min-height:54px;padding:0 25px;border-radius:14px;font-size:15px;font-weight:650;letter-spacing:-.01em}
.wc-btn-primary{color:#fff!important}.wc-btn-primary *{color:#fff!important}
.wc-btn-ghost{font-weight:600}
.wc-hero-stats{display:grid;grid-template-columns:repeat(4,1fr);max-width:600px;margin-top:14px}
.wc-hero-stats>div{padding:0 20px;border-right:1px solid #e4edf7}.wc-hero-stats>div:first-child{padding-left:0}.wc-hero-stats>div:last-child{border-right:0}
.wc-hero-stats strong{display:block;color:#087df4;font-size:27px;line-height:1;font-weight:750;letter-spacing:-.04em;margin-bottom:8px}
.wc-hero-stats span{font-size:12px;line-height:1.35;color:#8090a3}
.wc-hero-art{height:610px;position:relative;perspective:1400px}
.wc-art-glow{position:absolute;width:690px;height:520px;right:-50px;top:28px;border-radius:50%;background:radial-gradient(circle at 50% 48%,rgba(67,171,255,.24),rgba(105,194,255,.11) 45%,transparent 73%);filter:blur(14px)}
.wc-laptop{position:absolute;left:0;right:9%;top:74px;transform:none!important;filter:drop-shadow(0 38px 38px rgba(25,59,100,.21));z-index:4;animation:wcPremiumLaptop 6s ease-in-out infinite}
.wc-display{padding:7px;border-radius:20px 20px 14px 14px;background:linear-gradient(145deg,#1a2636,#0d1521);box-shadow:inset 0 0 0 1px rgba(255,255,255,.11)}
.wc-screen{aspect-ratio:16/9.5;border-radius:14px;padding:28px 30px;background:linear-gradient(145deg,#fff 28%,#f5f9ff 72%,#edf5ff);overflow:hidden;position:relative}
.wc-screen-nav{display:flex;align-items:center;gap:5px;position:relative;z-index:4;font-size:7px;color:#26364a}.wc-screen-nav b{color:#0b83ff;font-size:18px}.wc-screen-nav span{font-weight:700;margin-right:auto}.wc-screen-nav i{width:27px;height:4px;border-radius:8px;background:#dce6f1}
.wc-screen-brand{position:relative;z-index:3;font-size:38px;line-height:.98;margin-top:48px;font-weight:800;letter-spacing:-.055em}.wc-screen-brand em{font-style:normal;color:#0b83ff}
.wc-screen>p{position:relative;z-index:3;max-width:190px;font-size:8px;line-height:1.45;color:#7b8a9d}
.wc-screen-btn{position:relative;z-index:3;display:inline-flex;width:auto;height:auto;padding:8px 11px;border-radius:8px;color:#fff;background:linear-gradient(135deg,#0b83ff,#02b9fd);font-size:7px;font-weight:650;margin-top:10px}
.wc-screen-visual{position:absolute;right:30px;top:88px;width:46%;height:55%;border-radius:28px;background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(69,165,255,.15));border:1px solid rgba(181,217,252,.74);box-shadow:0 25px 58px rgba(11,131,255,.20);transform:none;z-index:2}
.wc-screen-visual:before,.wc-screen-visual:after{content:"";position:absolute;border-radius:18px;background:rgba(255,255,255,.72);border:1px solid rgba(182,219,255,.58)}
.wc-screen-visual:before{width:42%;height:26%;left:-12%;bottom:8%;transform:rotate(6deg)}.wc-screen-visual:after{width:34%;height:25%;right:-8%;top:-6%;transform:rotate(5deg)}
.wc-screen-visual b{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:86px;height:86px;border-radius:25px;background:linear-gradient(145deg,#1495ff,#006ce9);color:#fff;font-size:45px;box-shadow:0 18px 36px rgba(11,131,255,.30)}
.wc-ui-tile,.wc-ui-dot{display:none}
.wc-deck{height:105px;margin:-1px -7% 0;background:linear-gradient(180deg,#eef3f7,#d6dee6 60%,#bdc8d3);clip-path:polygon(6% 0,94% 0,100% 100%,0 100%);position:relative;transform:perspective(360px) rotateX(62deg);transform-origin:top center;box-shadow:0 25px 25px rgba(30,58,90,.15)}
.wc-keyboard{left:18%;right:18%;top:12px;height:38px;border-radius:6px;background:repeating-linear-gradient(90deg,#273442 0 9px,transparent 9px 12px),repeating-linear-gradient(0deg,rgba(37,50,65,.95) 0 7px,transparent 7px 10px);opacity:.92}
.wc-trackpad{width:24%;height:28px;left:38%;bottom:10px;border-radius:5px;background:rgba(238,242,246,.58);border:1px solid rgba(90,107,125,.21)}
.wc-lip{height:12px;margin:-35px -7% 0;border-radius:0 0 50px 50px;background:linear-gradient(180deg,#c1ccd7,#edf1f4 68%,#b4c0cb);z-index:5}
.wc-phone{position:absolute;right:-1%;bottom:26px;width:168px;height:348px;padding:5px;border:0;border-radius:38px;background:linear-gradient(145deg,#222c37,#929daa 56%,#202a35);box-shadow:0 34px 58px rgba(13,31,57,.30),inset 0 0 0 1px rgba(255,255,255,.32);transform:rotate(4deg)!important;z-index:9;animation:wcPremiumPhone 5.2s ease-in-out infinite}
.wc-phone-screen{width:100%;height:100%;border-radius:33px;background:linear-gradient(160deg,#fff 35%,#f8fbff 100%);padding:48px 15px 15px;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(14,30,48,.18)}
.wc-phone-notch{top:10px;width:68px;height:18px;background:#101a27}.wc-phone-logo{top:35px;left:15px;right:15px;font-size:7px}.wc-phone-logo b{font-size:12px}.wc-phone-text{font-size:22px;line-height:1.0;margin-top:24px;letter-spacing:-.04em}.wc-phone-text em{font-style:normal;color:#0b83ff}.wc-phone-screen>p{font-size:7px;line-height:1.5;color:#78879a;margin:14px 0}.wc-phone-button{font-size:7px;padding:8px 10px;border-radius:9px}.wc-phone-icons{bottom:16px}
.wc-float{background:rgba(255,255,255,.83);border:1px solid rgba(185,216,248,.76);box-shadow:0 20px 48px rgba(30,112,205,.12);backdrop-filter:blur(16px);z-index:8}
.wc-float-chart{left:4%;top:72px;width:135px;height:102px;border-radius:20px;padding:17px;transform:rotate(-4deg)}
.wc-float-speed,.wc-float-support{display:flex;align-items:center;gap:11px;padding:14px 16px;border-radius:18px;font-size:11px;font-weight:650;color:#26384f;line-height:1.2}.wc-float-speed b,.wc-float-support b{color:#0b83ff;font-size:20px}.wc-float-speed{right:-3%;top:128px;width:150px;transform:rotate(4deg)}.wc-float-support{right:-6%;bottom:92px;width:158px;transform:rotate(-3deg)}
.wc-orb-a{width:46px;height:46px;right:14%;top:30px}.wc-orb-b{width:20px;height:20px;left:16%;top:20px}
.wc-ring{display:none!important}
@keyframes wcPremiumLaptop{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes wcPremiumPhone{0%,100%{transform:rotate(4deg) translateY(0)}50%{transform:rotate(3deg) translateY(-10px)}}
@media(max-width:1100px){.wc-hero-grid{grid-template-columns:1fr 1fr}.wc-hero-stats{grid-template-columns:repeat(2,1fr);gap:16px}.wc-hero-stats>div{border-right:0;padding:0}.wc-float-speed,.wc-float-support{display:none}.wc-phone{right:-4%}}
@media(max-width:960px){.wc-hero-grid{grid-template-columns:1fr;min-height:auto}.wc-hero-copy{padding-top:20px}.wc-hero-art{height:560px;max-width:720px;width:100%;margin:0 auto}.wc-hero-stats{max-width:520px}.wc-laptop{left:4%;right:11%;top:74px}.wc-phone{right:3%;bottom:28px}.wc-float-chart{left:3%}}
@media(max-width:640px){.wc-hero{padding-top:38px}.wc-hero h1{font-size:45px}.wc-hero-copy>p{font-size:16px}.wc-actions{flex-direction:column;align-items:stretch}.wc-actions .wc-btn{width:100%}.wc-hero-stats{grid-template-columns:repeat(2,1fr);gap:22px 10px}.wc-hero-art{height:390px}.wc-laptop{left:1%;right:8%;top:62px}.wc-screen{padding:13px}.wc-screen-nav i{display:none}.wc-screen-brand{font-size:21px;margin-top:25px}.wc-screen-visual{right:14px;top:48px}.wc-screen-visual b{width:48px;height:48px;border-radius:14px;font-size:25px}.wc-deck{height:56px}.wc-keyboard{top:7px;height:22px}.wc-trackpad{height:15px;bottom:6px}.wc-lip{height:7px;margin-top:-20px}.wc-phone{width:102px;height:213px;right:0;bottom:18px;border-radius:24px;padding:3px}.wc-phone-screen{border-radius:21px;padding:30px 8px 8px}.wc-phone-notch{width:46px;height:11px;top:6px}.wc-phone-logo{top:22px;left:8px;right:8px}.wc-phone-text{font-size:12px;margin-top:14px}.wc-phone-screen>p{display:none}.wc-phone-button{font-size:5px;padding:5px 6px}.wc-phone-icons{display:none}.wc-float-chart{width:88px;height:68px;padding:10px;left:1%;top:25px}.wc-float-chart small{font-size:6px}.wc-float-chart strong{font-size:10px}.wc-float-chart i{width:45px;height:18px;margin-top:4px}.wc-orb-a{width:30px;height:30px}.wc-orb-b{display:none}}

/* WebCraft v9 — rebuilt hero device composition */
.wc-header .wc-container,
.wc-hero .wc-container{width:min(1380px,calc(100% - 72px))}
.wc-hero{padding:42px 0 28px;background:
  radial-gradient(circle at 79% 30%,rgba(83,181,255,.16) 0,rgba(83,181,255,.07) 29%,transparent 54%),
  linear-gradient(180deg,#fff 0%,#fbfdff 100%)}
.wc-hero-grid{grid-template-columns:minmax(0,.92fr) minmax(620px,1.08fr);gap:20px;min-height:650px;align-items:center}
.wc-hero-copy{padding:0 0 0 2px;z-index:6}
.wc-hero h1{max-width:650px;margin:0 0 25px;font-size:clamp(52px,4.55vw,72px);line-height:1.015;letter-spacing:-.052em;font-weight:760}
.wc-hero-copy>p{max-width:590px;font-size:17px;line-height:1.72;color:#6e7f93}
.wc-actions{margin:31px 0 34px}
.wc-btn{min-height:52px;padding:0 24px;font-size:15px;font-weight:620;border-radius:14px;letter-spacing:-.012em}
.wc-btn-primary{box-shadow:0 14px 30px rgba(11,131,255,.19)}
.wc-hero-stats{display:flex;max-width:390px;margin-top:12px}
.wc-hero-stats>div{min-width:150px;padding:0 24px;border-right:1px solid #e3edf7}
.wc-hero-stats>div:first-child{padding-left:0}.wc-hero-stats>div:last-child{border-right:0}
.wc-hero-stats strong{font-size:29px;font-weight:760;margin-bottom:8px}
.wc-hero-stats span{font-size:12px;line-height:1.55;color:#7f8fa2}

.wc-hero-art{height:590px;position:relative;perspective:none;overflow:visible}
.wc-art-glow{position:absolute;width:760px;height:570px;right:-65px;top:0;border-radius:50%;background:radial-gradient(circle at 48% 48%,rgba(91,187,255,.24),rgba(91,187,255,.09) 45%,transparent 72%);filter:blur(19px);opacity:.9;pointer-events:none}
.wc-device-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;display:block}
.wc-svg-laptop{transform-origin:390px 280px;animation:wcV9Laptop 6.5s ease-in-out infinite}
.wc-svg-phone{transform-origin:632px 358px;animation:wcV9Phone 5.2s ease-in-out infinite}
.wc-svg-card{transform-box:fill-box;transform-origin:center;animation:wcV9Card 5.8s ease-in-out infinite}
.wc-svg-card-speed{animation-delay:-1.6s}.wc-svg-card-support{animation-delay:-3.1s}
.wc-svg-orb{transform-box:fill-box;transform-origin:center;animation:wcV9Orb 6s ease-in-out infinite}.wc-svg-orb-b{animation-delay:-2.2s}.wc-svg-orb-c{animation-delay:-4.1s}
@keyframes wcV9Laptop{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-6px,0)}}
@keyframes wcV9Phone{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-10px,0)}}
@keyframes wcV9Card{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-8px,0)}}
@keyframes wcV9Orb{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(0,-11px,0) scale(1.05)}}

@media(max-width:1250px){
  .wc-header .wc-container,.wc-hero .wc-container{width:min(1180px,calc(100% - 48px))}
  .wc-hero-grid{grid-template-columns:.92fr 1.08fr;gap:8px}
  .wc-hero h1{font-size:clamp(50px,5vw,66px)}
  .wc-hero-art{height:555px}
}
@media(max-width:1040px){
  .wc-hero-grid{grid-template-columns:1fr;gap:10px;min-height:auto}
  .wc-hero-copy{max-width:720px;padding-top:18px}
  .wc-hero h1{max-width:720px}
  .wc-hero-art{height:570px;max-width:820px;width:100%;margin:0 auto}
  .wc-art-glow{right:-20px}
}
@media(max-width:720px){
  .wc-header .wc-container,.wc-hero .wc-container{width:calc(100% - 32px)}
  .wc-hero{padding-top:30px}
  .wc-hero h1{font-size:clamp(42px,12vw,56px);line-height:1.02}
  .wc-hero-copy>p{font-size:16px;line-height:1.65}
  .wc-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:26px 0}
  .wc-actions .wc-btn{padding:0 14px;font-size:13px;min-height:50px}
  .wc-hero-stats{max-width:100%;display:grid;grid-template-columns:1fr 1fr}
  .wc-hero-stats>div{min-width:0;padding:0 18px}.wc-hero-stats>div:first-child{padding-left:0}
  .wc-hero-art{height:410px;margin-top:4px}
  .wc-device-svg{transform:scale(1.12);transform-origin:center top}
}
@media(max-width:470px){
  .wc-hero h1{font-size:42px}
  .wc-actions{grid-template-columns:1fr}
  .wc-hero-art{height:330px}
  .wc-device-svg{transform:scale(1.26);transform-origin:55% top}
}
@media(prefers-reduced-motion:reduce){.wc-svg-laptop,.wc-svg-phone,.wc-svg-card,.wc-svg-orb{animation:none!important}}

/* WebCraft v10 — refined hero devices from user screenshot review */
.wc-hero-grid{grid-template-columns:minmax(0,.9fr) minmax(650px,1.1fr);gap:8px}
.wc-hero-art{height:600px;min-width:0}
.wc-device-svg{width:108%;height:100%;left:-3%;top:0;overflow:visible}
.wc-svg-laptop{transform-origin:430px 286px;animation:wcV10Laptop 6.8s ease-in-out infinite}
.wc-svg-phone{transform-origin:695px 370px;animation:wcV10Phone 5.4s ease-in-out infinite}
.wc-svg-card{animation:wcV10Card 5.8s ease-in-out infinite}
.wc-svg-card-speed{animation-delay:-1.7s}.wc-svg-card-support{animation-delay:-3.2s}
@keyframes wcV10Laptop{0%,100%{transform:rotate(-1.2deg) translate3d(0,0,0)}50%{transform:rotate(-1.2deg) translate3d(0,-6px,0)}}
@keyframes wcV10Phone{0%,100%{transform:rotate(5deg) translate3d(0,0,0)}50%{transform:rotate(4.2deg) translate3d(0,-10px,0)}}
@keyframes wcV10Card{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-7px,0)}}
@media(max-width:1250px){
  .wc-hero-grid{grid-template-columns:.9fr 1.1fr}
  .wc-hero-art{height:565px}
  .wc-device-svg{width:110%;left:-5%}
}
@media(max-width:1040px){
  .wc-hero-grid{grid-template-columns:1fr}
  .wc-hero-art{height:575px;max-width:860px}
  .wc-device-svg{width:100%;left:0}
}
@media(max-width:720px){
  .wc-hero-art{height:405px}
  .wc-device-svg{width:118%;left:-9%;transform:none}
}
@media(max-width:470px){
  .wc-hero-art{height:325px}
  .wc-device-svg{width:128%;left:-15%;transform:none}
}


/* WebCraft v11 — CMS constellation hero */
.wc-cms-art{height:600px;position:relative;overflow:visible;isolation:isolate;perspective:1200px}
.wc-cms-art .wc-art-glow,.wc-cms-art .wc-device-svg{display:none!important}
.wc-cms-glow{position:absolute;inset:24px -40px 10px 10px;border-radius:46%;background:radial-gradient(circle at 55% 48%,rgba(35,151,255,.25),rgba(80,185,255,.09) 42%,transparent 70%);filter:blur(18px);z-index:-3}
.wc-cms-orbit{position:absolute;border:1px solid rgba(65,161,255,.22);border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-13deg);pointer-events:none}
.wc-cms-orbit-a{width:590px;height:350px}.wc-cms-orbit-b{width:470px;height:470px;opacity:.55;transform:translate(-50%,-50%) rotate(35deg)}
.wc-cms-dot{position:absolute;border-radius:50%;background:linear-gradient(145deg,#68d1ff,#087cff);box-shadow:0 14px 30px rgba(11,131,255,.22);animation:wcCmsDot 6s ease-in-out infinite}
.wc-cms-dot-a{width:48px;height:48px;right:7%;top:66px}.wc-cms-dot-b{width:20px;height:20px;left:17%;top:48px;animation-delay:-2s}.wc-cms-dot-c{width:27px;height:27px;right:10%;bottom:82px;animation-delay:-4s}
.wc-cms-core{position:absolute;left:50%;top:50%;width:280px;height:280px;transform:translate(-50%,-50%) rotate(-4deg);border-radius:64px;background:linear-gradient(145deg,rgba(255,255,255,.97),rgba(237,247,255,.86));border:1px solid rgba(169,216,255,.9);box-shadow:0 38px 90px rgba(40,123,211,.18),inset 0 1px 0 rgba(255,255,255,.9);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;z-index:4;backdrop-filter:blur(18px);animation:wcCmsCore 7s ease-in-out infinite}
.wc-cms-core:before{content:"";position:absolute;inset:25px;border-radius:46px;background:radial-gradient(circle at 50% 45%,rgba(48,163,255,.18),transparent 62%);z-index:-1}
.wc-cms-core-mark{width:112px;height:112px;border-radius:31px;background:linear-gradient(145deg,#087aff,#05bafa);color:#fff;font-size:64px;line-height:112px;font-weight:820;letter-spacing:-.08em;box-shadow:0 24px 46px rgba(11,131,255,.28);margin-bottom:20px;transform:rotate(4deg)}
.wc-cms-core span{font-size:13px;color:#71839a;margin-bottom:7px}.wc-cms-core strong{font-size:18px;color:#12243d;font-weight:720;letter-spacing:-.025em}
.wc-cms-card{position:absolute;width:245px;min-height:104px;padding:17px 18px;display:flex;align-items:center;gap:15px;border-radius:25px;background:rgba(255,255,255,.9);border:1px solid rgba(179,218,252,.9);box-shadow:0 25px 58px rgba(38,111,188,.14);backdrop-filter:blur(18px);z-index:6;transition:transform .35s ease,box-shadow .35s ease;animation:wcCmsFloat 6s ease-in-out infinite}
.wc-cms-card strong{display:block;font-size:17px;font-weight:720;color:#14253d;letter-spacing:-.02em;margin-bottom:5px}.wc-cms-card span{display:block;font-size:11px;color:#7d8da0;line-height:1.35}
.wc-cms-card:hover{box-shadow:0 34px 72px rgba(38,111,188,.2)}
.wc-cms-icon{flex:0 0 62px;width:62px;height:62px;border-radius:20px;display:grid;place-items:center;font-weight:800;box-shadow:0 12px 28px rgba(30,115,208,.16)}
.wc-wp-icon{border-radius:50%;background:#21759b;color:#fff;font-family:Georgia,serif;font-size:36px;border:4px solid #fff;outline:1px solid rgba(33,117,155,.18)}
.wc-oc-icon{background:linear-gradient(145deg,#16b6eb,#0a8fcd);color:#fff}.wc-oc-icon svg{width:42px;height:42px}
.wc-dle-icon{background:linear-gradient(145deg,#263d63,#111e34);color:#fff;font-size:18px;letter-spacing:-.04em}
.wc-presta-icon{background:linear-gradient(145deg,#2aaed2,#6dcae0);color:#fff;font-size:34px;font-family:Georgia,serif}
.wc-cms-wordpress{left:2%;top:105px;transform:rotate(-5deg);animation-delay:-.5s}.wc-cms-opencart{right:-2%;top:128px;transform:rotate(5deg);animation-delay:-2.2s}.wc-cms-dle{left:1%;bottom:88px;transform:rotate(3deg);animation-delay:-3.4s}.wc-cms-presta{right:1%;bottom:74px;transform:rotate(-4deg);animation-delay:-4.6s}
.wc-cms-mini{position:absolute;width:64px;height:64px;border-radius:19px;background:rgba(255,255,255,.84);border:1px solid rgba(185,220,249,.82);box-shadow:0 16px 38px rgba(39,111,187,.12);display:grid;place-items:center;color:#0b83ff;font-weight:760;font-size:12px;z-index:5;backdrop-filter:blur(15px);animation:wcCmsMini 5.7s ease-in-out infinite}
.wc-cms-mini-a{left:28%;top:48px;transform:rotate(9deg)}.wc-cms-mini-b{right:27%;top:48px;transform:rotate(-8deg);animation-delay:-1.8s}.wc-cms-mini-c{left:44%;bottom:24px;transform:rotate(7deg);animation-delay:-3.5s}
@keyframes wcCmsCore{0%,100%{transform:translate(-50%,-50%) rotate(-4deg) translateY(0)}50%{transform:translate(-50%,-50%) rotate(-2deg) translateY(-10px)}}
@keyframes wcCmsFloat{0%,100%{margin-top:0}50%{margin-top:-10px}}
@keyframes wcCmsMini{0%,100%{margin-top:0}50%{margin-top:-8px}}
@keyframes wcCmsDot{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-12px) scale(1.06)}}
@media(max-width:1250px){.wc-cms-art{height:560px}.wc-cms-orbit-a{width:530px}.wc-cms-card{width:220px}.wc-cms-core{width:250px;height:250px}.wc-cms-core-mark{width:100px;height:100px;line-height:100px;font-size:58px}}
@media(max-width:1040px){.wc-cms-art{height:600px;max-width:760px;width:100%;margin:0 auto}.wc-cms-wordpress{left:3%}.wc-cms-opencart{right:3%}.wc-cms-dle{left:3%}.wc-cms-presta{right:3%}}
@media(max-width:720px){.wc-cms-art{height:470px;margin-top:15px}.wc-cms-core{width:205px;height:205px;border-radius:48px}.wc-cms-core-mark{width:80px;height:80px;line-height:80px;font-size:46px;border-radius:24px;margin-bottom:13px}.wc-cms-core strong{font-size:15px}.wc-cms-core span{font-size:11px}.wc-cms-card{width:164px;min-height:78px;padding:11px;border-radius:19px;gap:10px}.wc-cms-card strong{font-size:13px}.wc-cms-card span{font-size:9px}.wc-cms-icon{flex-basis:46px;width:46px;height:46px;border-radius:15px}.wc-wp-icon{font-size:27px}.wc-oc-icon svg{width:32px}.wc-dle-icon{font-size:14px}.wc-presta-icon{font-size:26px}.wc-cms-wordpress{left:-1%;top:73px}.wc-cms-opencart{right:-1%;top:90px}.wc-cms-dle{left:-1%;bottom:72px}.wc-cms-presta{right:-1%;bottom:65px}.wc-cms-orbit-a{width:390px;height:250px}.wc-cms-orbit-b{width:340px;height:340px}.wc-cms-mini{width:47px;height:47px;border-radius:15px;font-size:9px}.wc-cms-mini-a{left:31%;top:28px}.wc-cms-mini-b{right:31%;top:28px}.wc-cms-mini-c{left:45%;bottom:18px}}
@media(max-width:470px){.wc-cms-art{height:395px}.wc-cms-core{width:170px;height:170px}.wc-cms-core-mark{width:64px;height:64px;line-height:64px;font-size:38px}.wc-cms-core strong{font-size:12px}.wc-cms-card{width:138px;min-height:68px;padding:9px 10px;gap:8px}.wc-cms-card strong{font-size:11px}.wc-cms-card span{display:none}.wc-cms-icon{flex-basis:39px;width:39px;height:39px;border-radius:13px}.wc-wp-icon{font-size:23px}.wc-oc-icon svg{width:27px}.wc-dle-icon{font-size:12px}.wc-presta-icon{font-size:22px}.wc-cms-wordpress{left:-3%;top:58px}.wc-cms-opencart{right:-3%;top:72px}.wc-cms-dle{left:-3%;bottom:64px}.wc-cms-presta{right:-3%;bottom:58px}.wc-cms-mini{display:none}.wc-cms-orbit-a{width:330px;height:220px}.wc-cms-orbit-b{width:285px;height:285px}}
@media(prefers-reduced-motion:reduce){.wc-cms-core,.wc-cms-card,.wc-cms-mini,.wc-cms-dot{animation:none!important}}

/* WebCraft v12 — centered minimal hero */
.wc-hero-centered{
  padding:110px 0 120px;
  min-height:560px;
  display:flex;
  align-items:center;
  background:
    radial-gradient(circle at 50% 38%,rgba(11,131,255,.09),transparent 34%),
    linear-gradient(180deg,#fff 0%,#fbfdff 100%);
}
.wc-hero-centered .wc-container{display:flex;justify-content:center}
.wc-hero-centered .wc-hero-copy{
  width:min(980px,100%);
  max-width:none;
  margin:0 auto;
  padding:0;
  text-align:center;
}
.wc-hero-centered .wc-hero-copy h1{
  max-width:980px;
  margin:0 auto 28px;
  font-size:clamp(50px,6vw,88px);
  line-height:1.02;
  letter-spacing:-.055em;
  font-weight:780;
}
.wc-hero-centered .wc-hero-copy h1 em{font-style:normal;color:var(--wc-blue)}
.wc-hero-centered .wc-hero-copy>p{
  max-width:820px;
  margin:0 auto;
  font-size:20px;
  line-height:1.7;
  color:var(--wc-muted);
}
@media(max-width:720px){
  .wc-hero-centered{min-height:470px;padding:80px 0 88px}
  .wc-hero-centered .wc-hero-copy h1{font-size:clamp(42px,12vw,58px);margin-bottom:22px}
  .wc-hero-centered .wc-hero-copy>p{font-size:16px;line-height:1.65}
}
@media(max-width:470px){
  .wc-hero-centered{min-height:430px;padding:64px 0 72px}
  .wc-hero-centered .wc-hero-copy h1{font-size:40px}
}


/* WebCraft v13 — centered hero buttons */
.wc-hero-centered .wc-hero-centered-actions{
  justify-content:center;
  align-items:center;
  margin:34px auto 0;
}
.wc-hero-centered .wc-hero-centered-actions .wc-btn{
  min-width:170px;
  min-height:52px;
  font-size:15px;
  font-weight:650;
}
@media(max-width:520px){
  .wc-hero-centered .wc-hero-centered-actions{
    width:100%;
    flex-direction:column;
    gap:12px;
    margin-top:28px;
  }
  .wc-hero-centered .wc-hero-centered-actions .wc-btn{width:min(300px,100%)}
}


/* =========================================================
   WebCraft v14 — animated logo-gradient hero background
   ========================================================= */
.wc-hero-centered{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:560px;
  padding:110px 0 120px;
  display:flex;
  align-items:center;
  background:
    radial-gradient(circle at 12% 18%,rgba(0,118,252,.18) 0,rgba(0,118,252,0) 34%),
    radial-gradient(circle at 88% 28%,rgba(2,185,253,.20) 0,rgba(2,185,253,0) 38%),
    radial-gradient(circle at 52% 100%,rgba(0,118,252,.10) 0,rgba(0,118,252,0) 44%),
    linear-gradient(135deg,#ffffff 0%,#f4fbff 46%,#ffffff 100%);
}

/* soft moving glow, based on logo colors #0076FC → #02B9FD */
.wc-hero-centered::before{
  content:"";
  position:absolute;
  width:760px;
  height:760px;
  left:-330px;
  top:-390px;
  border-radius:50%;
  background:linear-gradient(135deg,rgba(0,118,252,.30),rgba(2,185,253,.12));
  filter:blur(82px);
  opacity:.88;
  pointer-events:none;
  z-index:0;
  animation:wcHeroGlowLeft 12s ease-in-out infinite;
}

.wc-hero-centered::after{
  content:"";
  position:absolute;
  width:820px;
  height:820px;
  right:-370px;
  bottom:-470px;
  border-radius:50%;
  background:linear-gradient(135deg,rgba(2,185,253,.28),rgba(0,118,252,.12));
  filter:blur(92px);
  opacity:.82;
  pointer-events:none;
  z-index:0;
  animation:wcHeroGlowRight 14s ease-in-out infinite;
}

.wc-hero-centered .wc-container{
  position:relative;
  z-index:2;
}

/* premium text treatment */
.wc-hero-centered .wc-hero-copy h1{
  text-shadow:0 8px 34px rgba(14,31,58,.045);
}

.wc-hero-centered .wc-hero-copy h1 em{
  font-style:normal;
  color:#0076FC;
  background:linear-gradient(90deg,#0076FC 0%,#02B9FD 48%,#0076FC 100%);
  background-size:220% auto;
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  animation:wcHeroTextFlow 5.5s linear infinite;
}

/* buttons in the same visual language as the logo */
.wc-hero-centered .wc-btn-primary{
  color:#fff!important;
  background:linear-gradient(110deg,#0076FC 0%,#02B9FD 50%,#0076FC 100%);
  background-size:220% 100%;
  box-shadow:0 13px 32px rgba(0,118,252,.23),0 3px 10px rgba(2,185,253,.10);
  animation:wcHeroButtonFlow 6s ease-in-out infinite;
}

.wc-hero-centered .wc-btn-primary:hover{
  color:#fff!important;
  transform:translateY(-3px);
  box-shadow:0 19px 42px rgba(0,118,252,.31),0 6px 16px rgba(2,185,253,.16);
}

.wc-hero-centered .wc-btn-ghost{
  color:#14253d;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(0,118,252,.14);
  box-shadow:0 10px 30px rgba(30,92,151,.065);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}

.wc-hero-centered .wc-btn-ghost:hover{
  color:#0076FC;
  background:rgba(255,255,255,.94);
  border-color:rgba(0,118,252,.29);
  box-shadow:0 16px 38px rgba(0,118,252,.11);
}

@keyframes wcHeroGlowLeft{
  0%,100%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(125px,95px,0) scale(1.14)}
}

@keyframes wcHeroGlowRight{
  0%,100%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(-125px,-75px,0) scale(1.12)}
}

@keyframes wcHeroTextFlow{
  0%{background-position:0% 50%}
  100%{background-position:220% 50%}
}

@keyframes wcHeroButtonFlow{
  0%,100%{background-position:0% 50%}
  50%{background-position:100% 50%}
}

@media(max-width:720px){
  .wc-hero-centered{min-height:500px;padding:80px 0 90px}
  .wc-hero-centered::before{width:520px;height:520px;left:-315px;top:-210px;filter:blur(70px)}
  .wc-hero-centered::after{width:560px;height:560px;right:-330px;bottom:-280px;filter:blur(76px)}
}

@media(prefers-reduced-motion:reduce){
  .wc-hero-centered::before,
  .wc-hero-centered::after,
  .wc-hero-centered .wc-hero-copy h1 em,
  .wc-hero-centered .wc-btn-primary{
    animation:none!important;
  }
}


/* =========================================================
   WebCraft v15 — gentle mouse parallax + subtle shine
   ========================================================= */
.wc-hero-centered{
  --wc-parallax-x:0px;
  --wc-parallax-y:0px;
  --wc-parallax-x2:0px;
  --wc-parallax-y2:0px;
  background:
    radial-gradient(circle at calc(12% + var(--wc-parallax-x)) calc(18% + var(--wc-parallax-y)),rgba(0,118,252,.18) 0,rgba(0,118,252,0) 34%),
    radial-gradient(circle at calc(88% + var(--wc-parallax-x2)) calc(28% + var(--wc-parallax-y2)),rgba(2,185,253,.20) 0,rgba(2,185,253,0) 38%),
    radial-gradient(circle at calc(52% + var(--wc-parallax-x2)) calc(100% + var(--wc-parallax-y)),rgba(0,118,252,.10) 0,rgba(0,118,252,0) 44%),
    linear-gradient(135deg,#ffffff 0%,#f4fbff 46%,#ffffff 100%);
  transition:background-position .18s ease-out;
}

/* Keep the glow movement, but add a very small cursor-driven offset. */
@keyframes wcHeroGlowLeft{
  0%,100%{transform:translate3d(var(--wc-parallax-x),var(--wc-parallax-y),0) scale(1)}
  50%{transform:translate3d(calc(125px + var(--wc-parallax-x)),calc(95px + var(--wc-parallax-y)),0) scale(1.14)}
}

@keyframes wcHeroGlowRight{
  0%,100%{transform:translate3d(var(--wc-parallax-x2),var(--wc-parallax-y2),0) scale(1)}
  50%{transform:translate3d(calc(-125px + var(--wc-parallax-x2)),calc(-75px + var(--wc-parallax-y2)),0) scale(1.12)}
}

/* A faint highlight passes across “роста” every few seconds. */
.wc-hero-centered .wc-hero-copy h1 em{
  background-image:linear-gradient(
    105deg,
    #0076FC 0%,
    #02B9FD 34%,
    #45c9ff 42%,
    #dff7ff 48%,
    #42c8ff 54%,
    #02B9FD 62%,
    #0076FC 100%
  );
  background-size:320% 100%;
  background-position:100% 50%;
  animation:wcGrowthShine 7.2s ease-in-out infinite;
}

@keyframes wcGrowthShine{
  0%,58%{background-position:100% 50%}
  76%{background-position:0% 50%}
  100%{background-position:0% 50%}
}

@media (hover:none),(pointer:coarse){
  .wc-hero-centered{
    --wc-parallax-x:0px;
    --wc-parallax-y:0px;
    --wc-parallax-x2:0px;
    --wc-parallax-y2:0px;
  }
}

@media(prefers-reduced-motion:reduce){
  .wc-hero-centered .wc-hero-copy h1 em{animation:none!important;background-position:50% 50%}
}

/* =========================================================
   WebCraft v16 — refined hero typography + floating brands
   ========================================================= */
.wc-hero-centered{
  position:relative;
  isolation:isolate;
}

/* Headline: more air between Cyrillic letters, less heavy */
.wc-hero-centered .wc-hero-copy h1{
  font-weight:700;
  letter-spacing:-.018em;
  line-height:1.075;
  word-spacing:.015em;
  font-kerning:normal;
  text-rendering:optimizeLegibility;
}

/* Keep the central copy above decorative logos */
.wc-hero-centered .wc-container{
  position:relative;
  z-index:3;
}

.wc-hero-brands{
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
}

.wc-brand-float{
  --brand-size:72px;
  position:absolute;
  width:var(--brand-size);
  height:var(--brand-size);
  border-radius:24px;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.66);
  border:1px solid rgba(255,255,255,.82);
  box-shadow:
    0 22px 58px rgba(22,111,204,.13),
    inset 0 1px 0 rgba(255,255,255,.95);
  -webkit-backdrop-filter:blur(16px);
  backdrop-filter:blur(16px);
  opacity:.92;
  animation:wcBrandFloat 7.4s ease-in-out infinite;
  will-change:transform;
}

.wc-brand-float::after{
  content:"";
  position:absolute;
  inset:10px;
  border-radius:17px;
  background:radial-gradient(circle at 35% 25%,rgba(255,255,255,.88),rgba(255,255,255,.18) 56%,transparent 72%);
  z-index:-1;
}

.wc-brand-float img{
  width:40px;
  height:40px;
  display:block;
  object-fit:contain;
  filter:drop-shadow(0 7px 12px rgba(15,85,165,.10));
}

/* Four corners from the user's marked screenshot */
.wc-brand-facebook{
  left:clamp(28px,6vw,105px);
  bottom:clamp(42px,10%,88px);
  transform:rotate(-7deg);
  animation-delay:-1.2s;
}
.wc-brand-wordpress{
  left:clamp(260px,29vw,470px);
  top:clamp(24px,6%,54px);
  transform:rotate(7deg);
  animation-delay:-3.1s;
}
.wc-brand-telegram{
  right:clamp(30px,5vw,88px);
  top:clamp(28px,7%,62px);
  transform:rotate(8deg);
  animation-delay:-4.8s;
}
.wc-brand-instagram{
  right:clamp(56px,8vw,140px);
  bottom:clamp(45px,11%,94px);
  transform:rotate(-8deg);
  animation-delay:-2.2s;
}

/* Soft colored halos that match each brand without becoming loud */
.wc-brand-facebook{box-shadow:0 22px 58px rgba(24,119,242,.16),inset 0 1px 0 rgba(255,255,255,.95)}
.wc-brand-wordpress{box-shadow:0 22px 58px rgba(33,117,155,.15),inset 0 1px 0 rgba(255,255,255,.95)}
.wc-brand-telegram{box-shadow:0 22px 58px rgba(38,165,228,.16),inset 0 1px 0 rgba(255,255,255,.95)}
.wc-brand-instagram{box-shadow:0 22px 58px rgba(214,41,118,.13),inset 0 1px 0 rgba(255,255,255,.95)}

@keyframes wcBrandFloat{
  0%,100%{margin-top:0}
  50%{margin-top:-10px}
}

@media(max-width:1050px){
  .wc-brand-float{--brand-size:62px;border-radius:21px;opacity:.78}
  .wc-brand-float img{width:34px;height:34px}
  .wc-brand-wordpress{left:18%;top:24px}
  .wc-brand-telegram{right:4%;top:30px}
  .wc-brand-facebook{left:4%;bottom:42px}
  .wc-brand-instagram{right:5%;bottom:46px}
}

@media(max-width:720px){
  .wc-hero-centered .wc-hero-copy h1{
    font-weight:700;
    letter-spacing:-.012em;
    line-height:1.09;
  }
  .wc-brand-float{--brand-size:48px;border-radius:16px;opacity:.58}
  .wc-brand-float img{width:27px;height:27px}
  .wc-brand-wordpress{left:7%;top:18px}
  .wc-brand-telegram{right:6%;top:22px}
  .wc-brand-facebook{left:5%;bottom:22px}
  .wc-brand-instagram{right:5%;bottom:24px}
}

@media(max-width:470px){
  .wc-brand-wordpress,.wc-brand-instagram{display:none}
  .wc-brand-facebook{left:12px;bottom:18px}
  .wc-brand-telegram{right:12px;top:18px}
}

@media(prefers-reduced-motion:reduce){
  .wc-brand-float{animation:none!important}
}


/* =========================================================
   WebCraft v17 — taller hero + interactive floating brand icons
   ========================================================= */

/* Make the first screen about 40% taller than v16. */
.wc-hero-centered{
  min-height:784px;
  padding:145px 0 155px;
}

/* Give decorative brand marks enough room and make each one interactive. */
.wc-hero-brands{
  pointer-events:none;
}

.wc-brand-float{
  --brand-x:0px;
  --brand-y:0px;
  --brand-scale:1;
  --brand-rot:0deg;
  pointer-events:auto;
  cursor:default;
  margin-top:0;
  transform:
    translate3d(var(--brand-x),var(--brand-y),0)
    rotate(var(--brand-rot))
    scale(var(--brand-scale));
  transition:
    transform .32s cubic-bezier(.2,.8,.2,1),
    box-shadow .32s ease,
    opacity .32s ease,
    filter .32s ease;
}

.wc-brand-facebook{--brand-rot:-7deg}
.wc-brand-wordpress{--brand-rot:7deg}
.wc-brand-telegram{--brand-rot:8deg}
.wc-brand-instagram{--brand-rot:-8deg}

/* Individual hover: icon lifts, turns a touch and gains depth. */
.wc-brand-float:hover{
  --brand-scale:1.16;
  z-index:8;
  opacity:1;
  filter:saturate(1.08);
  box-shadow:
    0 30px 76px rgba(20,108,210,.22),
    inset 0 1px 0 rgba(255,255,255,.98);
}

.wc-brand-float:hover img{
  transform:scale(1.08) rotate(-3deg);
}

.wc-brand-float img{
  transition:transform .3s cubic-bezier(.2,.8,.2,1);
}

/* Keep the slow floating motion while cursor-parallax is applied via transform. */
@keyframes wcBrandFloat{
  0%,100%{margin-top:0}
  50%{margin-top:-14px}
}

@media(max-width:1050px){
  .wc-hero-centered{min-height:730px;padding:125px 0 135px}
}

@media(max-width:720px){
  .wc-hero-centered{min-height:610px;padding:95px 0 105px}
  .wc-brand-float{pointer-events:none}
}

@media(max-width:470px){
  .wc-hero-centered{min-height:560px;padding:82px 0 90px}
}

@media(prefers-reduced-motion:reduce){
  .wc-brand-float{
    --brand-x:0px!important;
    --brand-y:0px!important;
    transition:none!important;
  }
}

/* =========================================================
   WebCraft v18 — very subtle New York skyline under hero effects
   Photo source: Wikimedia Commons, NYC Manhattan Skyline 1.JPG (CC0)
   ========================================================= */
.wc-hero-centered{
  position:relative;
  isolation:isolate;
}

/* The city sits at the very bottom of the visual stack. */
.wc-hero-city{
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background-image:url("https://upload.wikimedia.org/wikipedia/commons/thumb/6/6e/NYC_Manhattan_Skyline_1.JPG/1280px-NYC_Manhattan_Skyline_1.JPG");
  background-size:cover;
  background-position:center 58%;
  background-repeat:no-repeat;
  opacity:.075;
  filter:grayscale(.55) saturate(.55) contrast(.88) brightness(1.15);
  transform:scale(1.025);
  transform-origin:center center;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.20) 13%,rgba(0,0,0,.76) 35%,#000 58%,#000 100%);
  mask-image:linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.20) 13%,rgba(0,0,0,.76) 35%,#000 58%,#000 100%);
}

/* Existing logo-colored glows stay above the city image. */
.wc-hero-centered::before,
.wc-hero-centered::after{
  z-index:1;
}

/* Everything the user already has stays above both the photo and glows. */
.wc-hero-brands{
  z-index:3;
}
.wc-hero-centered .wc-container{
  z-index:4;
}

/* On narrower screens keep the skyline even more restrained. */
@media(max-width:720px){
  .wc-hero-city{
    opacity:.055;
    background-position:center 60%;
    transform:scale(1.06);
  }
}


/* =========================================================
   WebCraft v19 — user supplied New York city background
   Local optimized WebP, more visible but still behind all content
   ========================================================= */
.wc-hero-city{
  background-image:url("../images/nyc-city.webp");
  background-size:cover;
  background-position:center 50%;
  background-repeat:no-repeat;
  opacity:.22;
  filter:grayscale(.18) saturate(.78) contrast(.92) brightness(1.10);
  transform:scale(1.02);
  -webkit-mask-image:linear-gradient(
    to bottom,
    rgba(0,0,0,.12) 0%,
    rgba(0,0,0,.38) 15%,
    rgba(0,0,0,.80) 34%,
    #000 54%,
    #000 100%
  );
  mask-image:linear-gradient(
    to bottom,
    rgba(0,0,0,.12) 0%,
    rgba(0,0,0,.38) 15%,
    rgba(0,0,0,.80) 34%,
    #000 54%,
    #000 100%
  );
}

/* Keep the center readable while allowing buildings to remain visible around it. */
.wc-hero-centered .wc-hero-copy{
  position:relative;
}
.wc-hero-centered .wc-hero-copy::before{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:min(1080px,110vw);
  height:125%;
  transform:translate(-50%,-50%);
  z-index:-1;
  pointer-events:none;
  background:radial-gradient(ellipse at center,
    rgba(245,251,255,.72) 0%,
    rgba(245,251,255,.46) 38%,
    rgba(245,251,255,.12) 66%,
    transparent 82%);
  filter:blur(8px);
}

@media(max-width:720px){
  .wc-hero-city{
    opacity:.16;
    background-position:center 52%;
    transform:scale(1.08);
  }
}

/* =========================================================
   WebCraft v20 — dark NYC hero with logo-colored gradient
   ========================================================= */
.wc-hero-centered{
  background:
    radial-gradient(circle at 18% 18%,rgba(0,118,252,.34),transparent 32%),
    radial-gradient(circle at 82% 24%,rgba(2,185,253,.30),transparent 34%),
    radial-gradient(circle at 50% 115%,rgba(0,118,252,.22),transparent 44%),
    linear-gradient(135deg,#040b14 0%,#07182a 38%,#06111e 68%,#02070d 100%);
  color:#fff;
}

/* NYC stays underneath everything, now darker and richer. */
.wc-hero-city{
  opacity:.38;
  filter:grayscale(.10) saturate(.78) contrast(1.06) brightness(.48);
  background-position:center 48%;
  transform:scale(1.03);
  -webkit-mask-image:linear-gradient(
    to bottom,
    rgba(0,0,0,.82) 0%,
    #000 16%,
    #000 78%,
    rgba(0,0,0,.88) 100%
  );
  mask-image:linear-gradient(
    to bottom,
    rgba(0,0,0,.82) 0%,
    #000 16%,
    #000 78%,
    rgba(0,0,0,.88) 100%
  );
}

/* Deep blue/cyan moving glow above the photo. */
.wc-hero-centered::before{
  background:radial-gradient(circle,
    rgba(0,118,252,.40) 0%,
    rgba(0,118,252,.18) 42%,
    transparent 72%);
  opacity:.92;
  filter:blur(78px);
  mix-blend-mode:screen;
}
.wc-hero-centered::after{
  background:radial-gradient(circle,
    rgba(2,185,253,.34) 0%,
    rgba(2,185,253,.15) 44%,
    transparent 74%);
  opacity:.86;
  filter:blur(86px);
  mix-blend-mode:screen;
}

/* Remove the old light halo behind centered text. */
.wc-hero-centered .wc-hero-copy::before{
  background:radial-gradient(ellipse at center,
    rgba(3,14,27,.72) 0%,
    rgba(3,14,27,.48) 42%,
    rgba(3,14,27,.10) 70%,
    transparent 84%);
  filter:blur(10px);
}

/* Hero typography on the dark background. */
.wc-hero-centered .wc-hero-copy h1{
  color:#f7fbff;
  text-shadow:0 8px 38px rgba(0,0,0,.34);
}
.wc-hero-centered .wc-hero-copy h1 em{
  background:linear-gradient(90deg,#0076FC 0%,#02B9FD 48%,#63dcff 68%,#0076FC 100%);
  background-size:230% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}
.wc-hero-centered .wc-hero-copy>p{
  color:rgba(224,238,252,.78);
  text-shadow:0 3px 18px rgba(0,0,0,.34);
}

/* Buttons remain readable and premium on dark. */
.wc-hero-centered .wc-btn-primary{
  color:#fff!important;
  border:1px solid rgba(126,213,255,.18);
  box-shadow:0 16px 38px rgba(0,118,252,.30),0 0 38px rgba(2,185,253,.10);
}
.wc-hero-centered .wc-btn-ghost{
  color:#f4f9ff!important;
  background:rgba(7,22,39,.52);
  border:1px solid rgba(160,211,255,.24);
  box-shadow:0 14px 32px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.wc-hero-centered .wc-btn-ghost:hover{
  color:#fff!important;
  background:rgba(11,45,77,.72);
  border-color:rgba(79,190,255,.48);
  box-shadow:0 18px 42px rgba(0,118,252,.18);
}

/* Brand badges get dark glass shells so their original logos stay visible. */
.wc-hero-centered .wc-brand-float{
  background:rgba(4,17,31,.62);
  border:1px solid rgba(126,201,255,.22);
  box-shadow:0 22px 58px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
.wc-hero-centered .wc-brand-float:hover{
  box-shadow:0 32px 82px rgba(0,118,252,.30),inset 0 1px 0 rgba(255,255,255,.14);
  border-color:rgba(2,185,253,.44);
}

/* A soft dark veil keeps copy legible while retaining the city. */
.wc-hero-centered > .wc-hero-city::after{content:none}
.wc-hero-centered:before,
.wc-hero-centered:after{pointer-events:none}

@media(max-width:720px){
  .wc-hero-city{
    opacity:.30;
    filter:grayscale(.12) saturate(.72) contrast(1.04) brightness(.44);
    background-position:center 52%;
  }
  .wc-hero-centered .wc-hero-copy::before{
    background:radial-gradient(ellipse at center,
      rgba(3,14,27,.80) 0%,
      rgba(3,14,27,.58) 48%,
      rgba(3,14,27,.12) 76%,
      transparent 88%);
  }
}

/* =========================================================
   WebCraft v21 — refined dark NYC hero + brighter brand badges
   ========================================================= */

/* Slightly calmer logo gradient on the highlighted word. */
.wc-hero-centered .wc-hero-copy h1 em{
  background:linear-gradient(90deg,#1595ff 0%,#31b9f4 48%,#66d6ff 68%,#1595ff 100%);
  background-size:230% 100%;
  filter:saturate(.92) brightness(.98);
}

/* Soft blue halo behind the headline only. */
.wc-hero-centered .wc-hero-copy h1{
  position:relative;
  z-index:1;
}
.wc-hero-centered .wc-hero-copy h1::before{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:82%;
  height:128%;
  transform:translate(-50%,-50%);
  background:radial-gradient(ellipse at center,
    rgba(0,118,252,.18) 0%,
    rgba(2,185,253,.10) 38%,
    rgba(2,185,253,.035) 62%,
    transparent 76%);
  filter:blur(34px);
  opacity:.9;
  z-index:-1;
  pointer-events:none;
}

/* Bright glass shells for the social/CMS icons on the dark city. */
.wc-hero-centered .wc-brand-float{
  background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(231,246,255,.90));
  border:1px solid rgba(255,255,255,.78);
  box-shadow:
    0 20px 54px rgba(0,0,0,.18),
    0 0 34px rgba(35,170,255,.14),
    inset 0 1px 0 rgba(255,255,255,1);
  backdrop-filter:blur(18px) saturate(1.12);
  -webkit-backdrop-filter:blur(18px) saturate(1.12);
}
.wc-hero-centered .wc-brand-float::after{
  opacity:.32;
}
.wc-hero-centered .wc-brand-float img{
  filter:saturate(1.18) brightness(1.08) drop-shadow(0 5px 11px rgba(0,73,140,.16));
  opacity:1;
}
.wc-hero-centered .wc-brand-float:hover{
  background:linear-gradient(145deg,#ffffff,#eaf8ff);
  border-color:rgba(127,218,255,.95);
  box-shadow:
    0 30px 78px rgba(0,0,0,.20),
    0 0 46px rgba(2,185,253,.27),
    inset 0 1px 0 rgba(255,255,255,1);
}
.wc-hero-centered .wc-brand-float:hover img{
  filter:saturate(1.28) brightness(1.12) drop-shadow(0 7px 15px rgba(0,73,140,.18));
}

@media(max-width:720px){
  .wc-hero-centered .wc-hero-copy h1::before{
    width:102%;
    height:135%;
    filter:blur(28px);
    opacity:.78;
  }
}


/* =========================================================
   WebCraft v22 — roaming brand icons around the hero perimeter
   ========================================================= */
.wc-brand-float{
  --wander-x:0px;
  --wander-y:0px;
  translate:var(--wander-x) var(--wander-y);
  transition:
    transform .32s cubic-bezier(.2,.8,.2,1),
    translate 5.6s cubic-bezier(.45,.08,.2,1),
    box-shadow .32s ease,
    opacity .32s ease,
    filter .32s ease;
}

/* Keep every logo in its own safe zone, so it roams but never crosses the central copy. */
.wc-brand-facebook{--wander-max-x:150;--wander-max-y:90}
.wc-brand-wordpress{--wander-max-x:125;--wander-max-y:72}
.wc-brand-telegram{--wander-max-x:130;--wander-max-y:78}
.wc-brand-instagram{--wander-max-x:145;--wander-max-y:92}

/* A tiny natural tilt change while the cursor is over a logo. */
.wc-brand-float:hover{
  translate:calc(var(--wander-x) * 1.02) calc(var(--wander-y) * 1.02);
}

@media(max-width:1050px){
  .wc-brand-facebook{--wander-max-x:82;--wander-max-y:62}
  .wc-brand-wordpress{--wander-max-x:70;--wander-max-y:50}
  .wc-brand-telegram{--wander-max-x:74;--wander-max-y:52}
  .wc-brand-instagram{--wander-max-x:80;--wander-max-y:60}
}

@media(max-width:720px){
  .wc-brand-float{
    translate:0 0!important;
    transition:opacity .32s ease,filter .32s ease!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .wc-brand-float{
    --wander-x:0px!important;
    --wander-y:0px!important;
    translate:0 0!important;
  }
}

/* =========================================================
   WebCraft v23 — Firefox-safe highlighted word fix
   Removes the gradient-box artifact and keeps a subtle shine.
   ========================================================= */
.wc-hero-centered .wc-hero-copy h1 em{
  display:inline;
  position:relative;
  background:none!important;
  background-image:none!important;
  -webkit-background-clip:border-box!important;
  background-clip:border-box!important;
  -webkit-text-fill-color:#23b5f6!important;
  color:#23b5f6!important;
  filter:none!important;
  animation:wcGrowthTextGlow 7.2s ease-in-out infinite!important;
  text-shadow:0 0 0 rgba(35,181,246,0);
}

@keyframes wcGrowthTextGlow{
  0%,60%,100%{
    -webkit-text-fill-color:#23b5f6;
    color:#23b5f6;
    text-shadow:0 0 0 rgba(35,181,246,0);
  }
  74%{
    -webkit-text-fill-color:#59d2ff;
    color:#59d2ff;
    text-shadow:0 0 18px rgba(38,190,255,.26);
  }
  84%{
    -webkit-text-fill-color:#23b5f6;
    color:#23b5f6;
    text-shadow:0 0 5px rgba(38,190,255,.10);
  }
}

@media(prefers-reduced-motion:reduce){
  .wc-hero-centered .wc-hero-copy h1 em{
    animation:none!important;
    -webkit-text-fill-color:#23b5f6!important;
    color:#23b5f6!important;
    text-shadow:none!important;
  }
}


/* =========================================================
   WebCraft v24 — soft cursor glow + minimal scroll indicator
   ========================================================= */

/* Cursor light sits above the city, below copy and floating brand icons. */
.wc-cursor-glow{
  position:absolute;
  left:50%;
  top:50%;
  width:420px;
  height:420px;
  margin-left:-210px;
  margin-top:-210px;
  border-radius:50%;
  pointer-events:none;
  z-index:2;
  opacity:0;
  background:radial-gradient(circle,
    rgba(55,194,255,.18) 0%,
    rgba(0,118,252,.12) 28%,
    rgba(2,185,253,.055) 50%,
    rgba(2,185,253,0) 72%);
  filter:blur(10px);
  mix-blend-mode:screen;
  transform:scale(.94);
  transition:
    left .16s cubic-bezier(.22,.7,.2,1),
    top .16s cubic-bezier(.22,.7,.2,1),
    opacity .34s ease,
    transform .34s ease;
  will-change:left,top,opacity,transform;
}
.wc-hero-centered.wc-cursor-active .wc-cursor-glow{
  opacity:1;
  transform:scale(1);
}

/* A tiny mouse indicator centered at the bottom of the hero. */
.wc-scroll-indicator{
  position:absolute;
  left:50%;
  bottom:24px;
  z-index:7;
  width:38px;
  height:54px;
  transform:translateX(-50%);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:5px;
  opacity:.72;
  transition:opacity .25s ease,transform .25s ease;
}
.wc-scroll-indicator:hover{
  opacity:1;
  transform:translateX(-50%) translateY(2px);
}
.wc-scroll-mouse{
  position:relative;
  width:22px;
  height:33px;
  border:1.5px solid rgba(225,244,255,.72);
  border-radius:14px;
  background:rgba(3,18,33,.18);
  box-shadow:
    0 6px 18px rgba(0,0,0,.14),
    inset 0 1px 0 rgba(255,255,255,.08),
    0 0 18px rgba(2,185,253,.08);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.wc-scroll-mouse i{
  position:absolute;
  left:50%;
  top:7px;
  width:3px;
  height:7px;
  margin-left:-1.5px;
  border-radius:3px;
  background:linear-gradient(180deg,#77dcff,#10a9ff);
  box-shadow:0 0 9px rgba(2,185,253,.42);
  animation:wcScrollWheel 1.9s ease-in-out infinite;
}
.wc-scroll-chevron{
  width:7px;
  height:7px;
  border-right:1.5px solid rgba(214,240,255,.72);
  border-bottom:1.5px solid rgba(214,240,255,.72);
  transform:rotate(45deg);
  animation:wcScrollChevron 1.9s ease-in-out infinite;
}
@keyframes wcScrollWheel{
  0%,100%{transform:translateY(0);opacity:.35}
  42%{transform:translateY(8px);opacity:1}
  70%{transform:translateY(8px);opacity:.15}
}
@keyframes wcScrollChevron{
  0%,100%{transform:rotate(45deg) translate(0,0);opacity:.38}
  48%{transform:rotate(45deg) translate(2px,2px);opacity:.95}
}

/* Keep the glow decorative and the scroll control unobtrusive on touch devices. */
@media (hover:none),(pointer:coarse){
  .wc-cursor-glow{display:none!important}
  .wc-scroll-indicator{opacity:.55}
}
@media(max-width:720px){
  .wc-scroll-indicator{bottom:16px;transform:translateX(-50%) scale(.9)}
  .wc-scroll-indicator:hover{transform:translateX(-50%) scale(.9)}
}
@media(prefers-reduced-motion:reduce){
  .wc-cursor-glow{display:none!important}
  .wc-scroll-mouse i,.wc-scroll-chevron{animation:none!important}
}

/* =========================================================
   WebCraft v25 — crisp white social badges on desktop + mobile
   ========================================================= */
.wc-hero-centered .wc-brand-float{
  opacity:1!important;
  background:#ffffff!important;
  background-image:none!important;
  border:1px solid rgba(255,255,255,.96)!important;
  box-shadow:
    0 16px 42px rgba(0,0,0,.20),
    0 0 0 1px rgba(100,205,255,.10),
    0 0 28px rgba(24,174,255,.16)!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
.wc-hero-centered .wc-brand-float::before,
.wc-hero-centered .wc-brand-float::after{
  opacity:0!important;
}
.wc-hero-centered .wc-brand-float img{
  opacity:1!important;
  filter:saturate(1.12) brightness(1.04) drop-shadow(0 4px 9px rgba(0,77,143,.12))!important;
}
.wc-hero-centered .wc-brand-float:hover{
  opacity:1!important;
  background:#ffffff!important;
  border-color:rgba(121,218,255,.96)!important;
  box-shadow:
    0 24px 58px rgba(0,0,0,.22),
    0 0 38px rgba(2,185,253,.28)!important;
}

@media(max-width:720px){
  .wc-hero-centered .wc-brand-float{
    opacity:1!important;
    background:#ffffff!important;
    border-color:#ffffff!important;
    box-shadow:
      0 12px 28px rgba(0,0,0,.24),
      0 0 22px rgba(2,185,253,.13)!important;
  }
  .wc-hero-centered .wc-brand-float img{
    opacity:1!important;
    filter:saturate(1.15) brightness(1.06) drop-shadow(0 3px 7px rgba(0,77,143,.10))!important;
  }
}

/* =========================================================
   WebCraft v26 — centered hero buttons on mobile
   ========================================================= */
@media(max-width:720px){
  .wc-hero-centered .wc-hero-centered-actions{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%;
    gap:14px;
    margin-left:auto!important;
    margin-right:auto!important;
  }

  .wc-hero-centered .wc-hero-centered-actions .wc-btn{
    width:min(300px,100%)!important;
    margin-left:auto!important;
    margin-right:auto!important;
    justify-content:center!important;
    text-align:center!important;
  }
}


/* =========================================================
   WebCraft v27 — final requested refinements
   ========================================================= */

/* White scroll/mouse indicator in the hero. */
.wc-hero-centered .wc-scroll-indicator{
  opacity:.96;
}
.wc-hero-centered .wc-scroll-mouse{
  border-color:#ffffff!important;
  background:rgba(255,255,255,.06)!important;
  box-shadow:
    0 7px 22px rgba(0,0,0,.18),
    0 0 18px rgba(255,255,255,.12)!important;
}
.wc-hero-centered .wc-scroll-mouse i{
  background:#ffffff!important;
  box-shadow:0 0 10px rgba(255,255,255,.42)!important;
}
.wc-hero-centered .wc-scroll-chevron{
  border-right-color:#ffffff!important;
  border-bottom-color:#ffffff!important;
}

/* Services heading/button requested styling. */
#services .wc-section-head{
  align-items:center;
}
#services .wc-section-head h2{
  margin:0;
}
#services .wc-services-link{
  min-height:48px;
  padding:0 22px;
  border:1px solid var(--wc-line);
  border-radius:14px;
  background:#fff;
  color:var(--wc-ink);
  font-size:14px;
  font-weight:600;
  box-shadow:0 8px 24px rgba(20,63,110,.06);
}
#services .wc-services-link:hover{
  color:var(--wc-blue);
  border-color:rgba(11,131,255,.25);
  background:#fff;
  box-shadow:0 12px 30px rgba(11,131,255,.10);
}

@media(max-width:640px){
  #services .wc-section-head{
    align-items:center;
    gap:16px;
  }
  #services .wc-services-link{
    flex:0 0 auto;
    min-height:44px;
    padding:0 17px;
    font-size:13px;
  }
}


/* WebCraft v28 — expanded services + custom line icons */
#services .wc-services{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:20px;
}
#services .wc-service-card{
  position:relative;
  overflow:hidden;
  min-height:270px;
  padding:30px;
  border:1px solid #e5edf7;
  background:linear-gradient(145deg,#ffffff 0%,#fbfdff 100%);
}
#services .wc-service-card::before{
  content:"";
  position:absolute;
  width:150px;
  height:150px;
  right:-70px;
  top:-70px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(11,131,255,.10),rgba(2,185,253,0) 70%);
  pointer-events:none;
  transition:transform .35s ease,opacity .35s ease;
}
#services .wc-service-card:hover::before{transform:scale(1.25);opacity:1}
#services .wc-service-icon{
  width:54px;
  height:54px;
  display:grid;
  place-items:center;
  border-radius:16px;
  color:#0b83ff;
  background:linear-gradient(145deg,#eef7ff,#ffffff);
  border:1px solid #dcecff;
  box-shadow:0 12px 28px rgba(11,131,255,.10),inset 0 1px 0 rgba(255,255,255,.95);
  transition:transform .28s ease,box-shadow .28s ease,background .28s ease;
}
#services .wc-service-icon svg{
  width:28px;
  height:28px;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
#services .wc-service-card:hover .wc-service-icon{
  transform:translateY(-3px) rotate(-2deg);
  background:linear-gradient(135deg,#0b83ff,#02b9fd);
  color:#fff;
  box-shadow:0 16px 34px rgba(11,131,255,.22);
}
#services .wc-service-card h3{
  margin:24px 0 10px;
  font-size:19px;
  line-height:1.28;
  letter-spacing:-.02em;
}
#services .wc-service-card p{
  margin:0;
  font-size:14px;
  line-height:1.65;
}
#services .wc-service-card>a{
  position:absolute;
  left:30px;
  bottom:24px;
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#0b83ff;
  background:#f1f7ff;
  font-size:18px;
  transition:.25s ease;
}
#services .wc-service-card:hover>a{
  color:#fff;
  background:linear-gradient(135deg,#0b83ff,#02b9fd);
  transform:translateX(4px);
}
#services .wc-services .wc-service-card:last-child{grid-column:2}
@media(max-width:960px){
  #services .wc-services{grid-template-columns:repeat(2,minmax(0,1fr))}
  #services .wc-services .wc-service-card:last-child{grid-column:auto}
}
@media(max-width:640px){
  #services .wc-services{grid-template-columns:1fr;gap:14px}
  #services .wc-service-card{min-height:245px;padding:24px}
  #services .wc-service-card>a{left:24px;bottom:20px}
  #services .wc-service-icon{width:50px;height:50px;border-radius:15px}
  #services .wc-service-icon svg{width:26px;height:26px}
}


/* =========================================================
   WebCraft v29 — services: gradient premium cards (variant 3)
   ========================================================= */
#services{
  background:
    radial-gradient(circle at 8% 8%,rgba(139,92,246,.055),transparent 24%),
    radial-gradient(circle at 92% 88%,rgba(14,165,233,.06),transparent 26%),
    linear-gradient(180deg,#ffffff 0%,#fbfdff 100%);
}
#services .wc-services{
  counter-reset:wc-service;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}
#services .wc-service-card{
  --svc-a:#7c3aed;
  --svc-b:#2563eb;
  counter-increment:wc-service;
  position:relative;
  min-height:285px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  overflow:hidden;
  padding:27px 27px 25px;
  border:1px solid rgba(220,229,241,.95);
  border-radius:22px;
  background:
    radial-gradient(circle at 8% 4%,color-mix(in srgb,var(--svc-a) 8%,transparent),transparent 31%),
    #fff;
  box-shadow:0 12px 34px rgba(21,51,88,.055);
  transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease;
  isolation:isolate;
}
#services .wc-service-card::before{
  content:counter(wc-service, decimal-leading-zero);
  position:absolute;
  top:28px;
  left:93px;
  color:var(--svc-a);
  font-size:12px;
  line-height:1;
  font-weight:800;
  letter-spacing:.05em;
}
#services .wc-service-card::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:3px;
  background:linear-gradient(90deg,var(--svc-a),var(--svc-b));
  opacity:.78;
  transform:scaleX(.72);
  transform-origin:left center;
  transition:transform .28s ease,opacity .28s ease;
}
#services .wc-service-card:hover{
  transform:translateY(-7px);
  border-color:color-mix(in srgb,var(--svc-a) 23%,#dbe7f5);
  box-shadow:0 25px 58px rgba(29,75,126,.115);
}
#services .wc-service-card:hover::after{transform:scaleX(1);opacity:1}
#services .wc-service-icon{
  width:58px;
  height:58px;
  flex:0 0 58px;
  display:grid;
  place-items:center;
  margin:0 0 22px;
  border:0;
  border-radius:18px;
  color:#fff;
  background:linear-gradient(145deg,var(--svc-a),var(--svc-b));
  box-shadow:
    0 13px 26px color-mix(in srgb,var(--svc-a) 24%,transparent),
    inset 0 1px 0 rgba(255,255,255,.28);
  transition:transform .3s ease,box-shadow .3s ease;
}
#services .wc-service-card:hover .wc-service-icon{
  transform:translateY(-2px) rotate(-3deg) scale(1.05);
  box-shadow:0 17px 32px color-mix(in srgb,var(--svc-a) 30%,transparent),inset 0 1px 0 rgba(255,255,255,.34);
}
#services .wc-service-icon svg{
  width:29px;
  height:29px;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}
#services .wc-service-card h3{
  margin:4px 0 11px;
  font-size:19px;
  line-height:1.27;
  letter-spacing:-.025em;
  font-weight:740;
  color:#10223c;
}
#services .wc-service-card p{
  margin:0 0 22px;
  color:#718198;
  font-size:14px;
  line-height:1.62;
}
#services .wc-service-card .wc-service-more{
  width:auto;
  min-height:38px;
  margin-top:auto;
  padding:0 17px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid color-mix(in srgb,var(--svc-a) 24%,#dce8f5);
  border-radius:11px;
  background:linear-gradient(180deg,#fff,color-mix(in srgb,var(--svc-a) 4%,#fff));
  color:var(--svc-a);
  font-size:13px;
  line-height:1;
  font-weight:720;
  box-shadow:0 7px 18px rgba(31,77,126,.055);
  transition:transform .22s ease,box-shadow .22s ease,color .22s ease,background .22s ease;
}
#services .wc-service-card .wc-service-more:hover{
  transform:translateY(-2px);
  color:#fff;
  border-color:transparent;
  background:linear-gradient(135deg,var(--svc-a),var(--svc-b));
  box-shadow:0 11px 24px color-mix(in srgb,var(--svc-a) 22%,transparent);
}

/* Individual gradients */
#services .wc-service-card:nth-child(1){--svc-a:#7c3aed;--svc-b:#2563eb}
#services .wc-service-card:nth-child(2){--svc-a:#6366f1;--svc-b:#3b82f6}
#services .wc-service-card:nth-child(3){--svc-a:#ec4899;--svc-b:#fb7185}
#services .wc-service-card:nth-child(4){--svc-a:#22c55e;--svc-b:#10b981}
#services .wc-service-card:nth-child(5){--svc-a:#f59e0b;--svc-b:#fb7185}
#services .wc-service-card:nth-child(6){--svc-a:#06b6d4;--svc-b:#3b82f6}
#services .wc-service-card:nth-child(7){--svc-a:#8b5cf6;--svc-b:#6366f1}
#services .wc-service-card:nth-child(8){--svc-a:#7c3aed;--svc-b:#ec4899}
#services .wc-service-card:nth-child(9){--svc-a:#22c55e;--svc-b:#60a5fa}
#services .wc-service-card:nth-child(10){--svc-a:#8b5cf6;--svc-b:#4f46e5}
#services .wc-service-card:nth-child(11){--svc-a:#3b82f6;--svc-b:#06b6d4}
#services .wc-service-card:nth-child(12){--svc-a:#ec4899;--svc-b:#8b5cf6}
#services .wc-service-card:nth-child(13){--svc-a:#14b8a6;--svc-b:#22c55e}

@media(max-width:960px){
  #services .wc-services{grid-template-columns:repeat(2,minmax(0,1fr))}
  #services .wc-service-card{min-height:270px}
}
@media(max-width:640px){
  #services .wc-services{grid-template-columns:1fr;gap:14px}
  #services .wc-service-card{min-height:0;padding:23px 22px 22px;border-radius:19px}
  #services .wc-service-icon{width:54px;height:54px;flex-basis:54px;border-radius:17px;margin-bottom:19px}
  #services .wc-service-card::before{top:26px;left:86px}
  #services .wc-service-card h3{font-size:18px}
  #services .wc-service-card p{font-size:13.5px;margin-bottom:20px}
}

/* =========================================================
   WebCraft v30 — services width aligned with header
   Left edge = logo, right edge = "Начать проект" button
   ========================================================= */
#services > .wc-container{
  width:min(1180px,calc(100% - 48px));
  max-width:1180px;
  margin-left:auto;
  margin-right:auto;
}
#services .wc-section-head,
#services .wc-services{
  width:100%;
  margin-left:0;
  margin-right:0;
}
@media(max-width:640px){
  #services > .wc-container{
    width:min(100% - 30px,1180px);
  }
}

/* =========================================================
   WebCraft v31 — unified service icon color + remove numbers
   ========================================================= */
#services .wc-service-card{
  --svc-a:#3b82f6;
  --svc-b:#06b6d4;
}
#services .wc-service-card::before{
  content:none !important;
  display:none !important;
}

/* =========================================================
   WebCraft v32 — service links, mobile button fix, service pages
   ========================================================= */

/* Home services: one unified blue icon style, no numbers. */
#services .wc-service-card{
  --svc-a:#3b82f6 !important;
  --svc-b:#06b6d4 !important;
}
#services .wc-service-card::before{
  content:none !important;
  display:none !important;
}
#services .wc-service-card::after{
  background:linear-gradient(90deg,#3b82f6,#06b6d4) !important;
}
#services .wc-service-icon{
  color:#fff !important;
  background:linear-gradient(145deg,#3b82f6,#06b6d4) !important;
  box-shadow:0 13px 28px rgba(59,130,246,.22),inset 0 1px 0 rgba(255,255,255,.3) !important;
}
#services .wc-service-card .wc-service-more{
  position:static !important;
  left:auto !important;
  right:auto !important;
  top:auto !important;
  bottom:auto !important;
  width:auto !important;
  height:auto !important;
  min-height:40px;
  margin-top:auto;
  padding:0 18px;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(59,130,246,.24) !important;
  border-radius:12px;
  color:#2563eb !important;
  background:#fff !important;
  font-size:13px;
  line-height:1;
  font-weight:700;
  white-space:nowrap;
  transform:none !important;
}
#services .wc-service-card .wc-service-more:hover{
  color:#fff !important;
  border-color:transparent !important;
  background:linear-gradient(135deg,#3b82f6,#06b6d4) !important;
  box-shadow:0 11px 24px rgba(59,130,246,.22) !important;
  transform:translateY(-2px) !important;
}

@media(max-width:640px){
  #services .wc-service-card{
    padding:22px !important;
  }
  #services .wc-service-card p{
    margin-bottom:18px !important;
  }
  #services .wc-service-card .wc-service-more{
    position:static !important;
    margin-top:2px !important;
    min-height:42px;
    padding:0 20px;
  }
}

/* Shared inner-page typography */
.wc-inner-page{
  background:#fff;
}
.wc-breadcrumb{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:9px;
  margin-bottom:24px;
  color:#7b8ba1;
  font-size:13px;
}
.wc-breadcrumb a:hover{color:var(--wc-blue)}

/* All services index */
.wc-services-page-hero{
  padding:88px 0 72px;
  background:
    radial-gradient(circle at 18% 0%,rgba(59,130,246,.12),transparent 28%),
    radial-gradient(circle at 88% 10%,rgba(6,182,212,.10),transparent 26%),
    linear-gradient(180deg,#fff,#f8fbff);
  border-bottom:1px solid #edf2f8;
}
.wc-services-page-hero h1{
  margin:0 0 18px;
  font-size:clamp(46px,6vw,78px);
  line-height:1;
  letter-spacing:-.055em;
  color:#0d1f39;
}
.wc-services-page-hero p{
  max-width:760px;
  margin:0;
  color:#6f7f94;
  font-size:19px;
  line-height:1.7;
}
.wc-services-page-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}
.wc-services-page-card{
  display:flex;
  flex-direction:column;
  min-height:300px;
  padding:28px;
  border:1px solid #e3ebf5;
  border-radius:22px;
  background:linear-gradient(145deg,#fff,#fbfdff);
  box-shadow:0 12px 34px rgba(25,58,98,.055);
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
}
.wc-services-page-card:hover{
  transform:translateY(-5px);
  border-color:#cfe2fb;
  box-shadow:0 24px 50px rgba(36,99,170,.10);
}
.wc-service-page-list-icon,
.wc-service-page-icon,
.wc-related-icon{
  display:grid;
  place-items:center;
  color:#fff;
  background:linear-gradient(145deg,#3b82f6,#06b6d4);
  box-shadow:0 14px 30px rgba(59,130,246,.22),inset 0 1px 0 rgba(255,255,255,.3);
}
.wc-service-page-list-icon{
  width:58px;
  height:58px;
  border-radius:18px;
  margin-bottom:24px;
}
.wc-service-page-list-icon svg,
.wc-service-page-icon svg,
.wc-related-icon svg{
  width:29px;
  height:29px;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.wc-services-page-card h2{
  margin:0 0 11px;
  color:#10223c;
  font-size:20px;
  line-height:1.28;
  letter-spacing:-.025em;
}
.wc-services-page-card p{
  margin:0 0 22px;
  color:#718198;
  font-size:14px;
  line-height:1.65;
}
.wc-services-page-card .wc-btn{
  margin-top:auto;
  align-self:flex-start;
}

/* Individual service page */
.wc-service-page-hero{
  position:relative;
  overflow:hidden;
  padding:86px 0 92px;
  background:
    radial-gradient(circle at 78% 35%,rgba(6,182,212,.13),transparent 29%),
    radial-gradient(circle at 62% 0%,rgba(59,130,246,.12),transparent 32%),
    linear-gradient(180deg,#ffffff,#f7fbff);
  border-bottom:1px solid #edf2f8;
}
.wc-service-page-hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(360px,.72fr);
  gap:72px;
  align-items:center;
}
.wc-service-page-icon{
  width:70px;
  height:70px;
  border-radius:21px;
  margin-bottom:25px;
}
.wc-service-page-icon svg{width:35px;height:35px}
.wc-service-page-copy h1{
  max-width:820px;
  margin:0 0 22px;
  color:#0d1f39;
  font-size:clamp(44px,5.3vw,76px);
  line-height:1.02;
  letter-spacing:-.055em;
}
.wc-service-lead{
  max-width:760px;
  margin:0;
  color:#687a91;
  font-size:19px;
  line-height:1.7;
}
.wc-service-page-art{
  position:relative;
  min-height:390px;
}
.wc-service-page-art-card{
  position:absolute;
  inset:45px 24px 36px 14px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  gap:10px;
  padding:34px;
  border:1px solid rgba(203,222,246,.95);
  border-radius:32px;
  background:linear-gradient(145deg,rgba(255,255,255,.95),rgba(237,247,255,.9));
  box-shadow:0 32px 70px rgba(39,102,174,.15);
  transform:rotate(-3deg);
  backdrop-filter:blur(14px);
}
.wc-service-page-art-card::before{
  content:"W";
  position:absolute;
  left:34px;
  top:34px;
  width:86px;
  height:86px;
  display:grid;
  place-items:center;
  border-radius:25px;
  color:#fff;
  background:linear-gradient(145deg,#3b82f6,#06b6d4);
  box-shadow:0 18px 36px rgba(59,130,246,.26);
  font-size:42px;
  font-weight:850;
}
.wc-service-page-art-card span{
  max-width:260px;
  color:#11243d;
  font-size:24px;
  line-height:1.15;
  font-weight:750;
  letter-spacing:-.03em;
}
.wc-service-page-art-card i{
  display:block;
  width:72%;
  height:8px;
  border-radius:99px;
  background:#dceafa;
}
.wc-service-page-art-card i:nth-of-type(2){width:56%}
.wc-service-page-art-card i:nth-of-type(3){width:40%;background:#b9ddff}
.wc-service-page-art-orb{
  position:absolute;
  border-radius:50%;
  background:linear-gradient(145deg,#67d2ff,#3b82f6);
  box-shadow:0 18px 38px rgba(59,130,246,.20);
}
.wc-service-page-art-orb-a{width:55px;height:55px;right:0;top:18px}
.wc-service-page-art-orb-b{width:24px;height:24px;left:5px;bottom:18px}
.wc-service-details-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:70px;
  align-items:start;
}
.wc-service-details h2{
  margin:7px 0 18px;
  font-size:clamp(34px,4vw,52px);
  line-height:1.05;
  letter-spacing:-.04em;
}
.wc-service-details p{
  max-width:600px;
  color:#6f8095;
  font-size:16px;
  line-height:1.8;
}
.wc-service-includes{
  padding:30px;
  border:1px solid #e3edf8;
  border-radius:24px;
  background:#fbfdff;
}
.wc-service-includes h3{margin:0 0 20px;font-size:21px}
.wc-service-includes ul{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.wc-service-includes li{
  position:relative;
  padding:14px 16px 14px 46px;
  border:1px solid #e7eef7;
  border-radius:14px;
  background:#fff;
  color:#41536b;
  font-size:14px;
}
.wc-service-includes li::before{
  content:"✓";
  position:absolute;
  left:15px;
  top:50%;
  transform:translateY(-50%);
  width:22px;
  height:22px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#fff;
  background:linear-gradient(145deg,#3b82f6,#06b6d4);
  font-size:11px;
  font-weight:800;
}
.wc-service-process{background:#f8fbff !important}
.wc-service-process-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
}
.wc-service-process-grid article{
  min-height:215px;
  padding:26px;
  border:1px solid #e3edf8;
  border-radius:20px;
  background:#fff;
}
.wc-service-process-grid article>span{
  display:block;
  margin-bottom:32px;
  color:#3b82f6;
  font-size:13px;
  font-weight:800;
}
.wc-service-process-grid h3{margin:0 0 10px;font-size:19px}
.wc-service-process-grid p{margin:0;color:#718198;font-size:14px;line-height:1.6}
.wc-service-related-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
}
.wc-related-card{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:16px;
  padding:20px;
  border:1px solid #e3edf8;
  border-radius:18px;
  background:#fff;
  transition:.25s ease;
}
.wc-related-card:hover{transform:translateY(-3px);border-color:#cfe2fb;box-shadow:0 16px 34px rgba(36,99,170,.09)}
.wc-related-icon{width:48px;height:48px;border-radius:15px}
.wc-related-icon svg{width:24px;height:24px}
.wc-related-card strong{font-size:15px;line-height:1.35}
.wc-related-card i{font-style:normal;color:#3b82f6;font-size:20px}

@media(max-width:960px){
  .wc-services-page-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .wc-service-page-hero-grid{grid-template-columns:1fr;gap:28px}
  .wc-service-page-art{min-height:300px;max-width:620px;width:100%}
  .wc-service-details-grid{grid-template-columns:1fr;gap:35px}
  .wc-service-process-grid{grid-template-columns:repeat(2,1fr)}
  .wc-service-related-grid{grid-template-columns:1fr}
}
@media(max-width:640px){
  .wc-services-page-hero{padding:62px 0 52px}
  .wc-services-page-hero h1{font-size:46px}
  .wc-services-page-hero p{font-size:16px}
  .wc-services-page-grid{grid-template-columns:1fr;gap:14px}
  .wc-services-page-card{min-height:0;padding:23px;border-radius:19px}
  .wc-service-page-hero{padding:58px 0 62px}
  .wc-service-page-copy h1{font-size:42px}
  .wc-service-lead{font-size:16px}
  .wc-service-page-icon{width:60px;height:60px;border-radius:18px}
  .wc-service-page-art{min-height:250px}
  .wc-service-page-art-card{inset:28px 12px 24px 8px;padding:24px;border-radius:24px}
  .wc-service-page-art-card::before{left:24px;top:24px;width:64px;height:64px;border-radius:19px;font-size:32px}
  .wc-service-page-art-card span{font-size:19px}
  .wc-service-process-grid{grid-template-columns:1fr}
  .wc-service-process-grid article{min-height:0}
  .wc-service-includes{padding:20px}
}


/* =========================================================
   WebCraft v33 — service prices + cleaner service typography
   ========================================================= */

/* Home service cards: price sits beside the icon. */
#services .wc-service-card{
  position:relative;
}
#services .wc-service-price{
  position:absolute;
  top:30px;
  right:27px;
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:0 13px;
  border:1px solid rgba(59,130,246,.16);
  border-radius:999px;
  background:#f3f8ff;
  color:#1677e8;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  font-size:13px;
  line-height:1;
  font-weight:650;
  letter-spacing:0;
  white-space:nowrap;
}
#services .wc-service-card h3{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif !important;
  font-weight:620 !important;
  letter-spacing:-.008em !important;
  line-height:1.34 !important;
}

/* All services page. */
.wc-services-page-card{
  position:relative;
}
.wc-services-page-price{
  position:absolute;
  top:30px;
  right:28px;
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:0 13px;
  border:1px solid rgba(59,130,246,.16);
  border-radius:999px;
  background:#f3f8ff;
  color:#1677e8;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  font-size:13px;
  line-height:1;
  font-weight:650;
  letter-spacing:0;
  white-space:nowrap;
}
.wc-services-page-card h2{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif !important;
  font-weight:620 !important;
  letter-spacing:-.008em !important;
  line-height:1.34 !important;
}

/* Individual service page: clear price badge near service icon. */
.wc-service-page-price{
  display:inline-flex;
  align-items:center;
  min-height:38px;
  margin:-9px 0 20px;
  padding:0 15px;
  border:1px solid rgba(59,130,246,.18);
  border-radius:999px;
  background:linear-gradient(180deg,#f7fbff,#eef7ff);
  color:#1677e8;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  font-size:14px;
  line-height:1;
  font-weight:650;
  letter-spacing:0;
  box-shadow:0 8px 22px rgba(59,130,246,.08);
}
.wc-service-page-copy h1,
.wc-service-details h2,
.wc-service-page-art-card span,
.wc-related-card strong{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif !important;
  letter-spacing:-.01em !important;
}
.wc-service-page-copy h1{
  font-weight:650 !important;
  line-height:1.08 !important;
}
.wc-service-details h2{
  font-weight:630 !important;
  line-height:1.12 !important;
}
.wc-service-page-art-card span,
.wc-related-card strong{
  font-weight:620 !important;
}

@media(max-width:640px){
  #services .wc-service-price{
    top:24px;
    right:22px;
    min-height:32px;
    padding:0 11px;
    font-size:12px;
  }
  .wc-services-page-price{
    top:24px;
    right:22px;
    min-height:32px;
    padding:0 11px;
    font-size:12px;
  }
  #services .wc-service-card h3,
  .wc-services-page-card h2{
    padding-right:0;
  }
  .wc-service-page-price{
    min-height:36px;
    margin:-5px 0 18px;
    font-size:13px;
  }
  .wc-service-page-copy h1{
    font-size:40px !important;
    line-height:1.1 !important;
  }
}

/* =========================================================
   WebCraft v34 — unified content width
   All main blocks align with the header logo on the left
   and the "Начать проект" button on the right.
   ========================================================= */
.wc-page .wc-container,
#services > .wc-container{
  width:min(1380px,calc(100% - 72px));
  max-width:1380px;
  margin-left:auto;
  margin-right:auto;
}

/* Keep inner grids inside the same visual rails. */
.wc-page .wc-section-head,
.wc-page .wc-services,
.wc-page .wc-projects,
.wc-page .wc-value-grid,
.wc-page .wc-steps,
.wc-page .wc-stats,
.wc-page .wc-reviews,
.wc-page .wc-cta-box,
.wc-page .wc-services-page-grid,
.wc-page .wc-service-page-hero-grid,
.wc-page .wc-service-details-grid,
.wc-page .wc-service-process-grid,
.wc-page .wc-service-related-grid{
  width:100%;
  max-width:none;
  margin-left:auto;
  margin-right:auto;
}

@media(max-width:1250px){
  .wc-page .wc-container,
  #services > .wc-container{
    width:min(1180px,calc(100% - 48px));
    max-width:1180px;
  }
}

@media(max-width:720px){
  .wc-page .wc-container,
  #services > .wc-container{
    width:calc(100% - 32px);
    max-width:none;
  }
}

/* =========================================================
   WebCraft v35 — pure white service cards
   ========================================================= */
#services .wc-service-card,
.wc-services-page-card{
  background:#ffffff !important;
}

/* =========================================================
   WebCraft v36 — Apple-style button typography
   Uses the native Apple system font where available.
   ========================================================= */
.wc-btn,
.wc-service-more,
.wc-services-page-card .wc-btn,
.wc-service-page .wc-btn,
.wc-nav-cta,
.wc-services-link{
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Segoe UI",Roboto,Arial,sans-serif !important;
  font-weight:600 !important;
  letter-spacing:-0.01em !important;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

/* =========================================================
   WebCraft v37 — larger service titles, buttons and prices
   ========================================================= */

/* Service titles: +30% for clearer reading. */
#services .wc-service-card h3{
  font-size:25px !important;
  line-height:1.28 !important;
  font-weight:600 !important;
}
.wc-services-page-card h2{
  font-size:26px !important;
  line-height:1.28 !important;
  font-weight:600 !important;
}

/* Buttons: about +20% larger text site-wide. */
.wc-btn,
.wc-nav-cta,
.wc-services-link,
.wc-services-page-card .wc-btn,
.wc-service-page .wc-btn{
  font-size:18px !important;
}
#services .wc-service-card .wc-service-more,
.wc-service-more{
  font-size:16px !important;
  min-height:44px !important;
  padding-left:20px !important;
  padding-right:20px !important;
}

/* Keep the same price badge design, only make the text larger. */
#services .wc-service-price,
.wc-services-page-price{
  font-size:16px !important;
  min-height:38px !important;
  padding-left:15px !important;
  padding-right:15px !important;
}
.wc-service-page-price{
  font-size:17px !important;
  min-height:42px !important;
  padding-left:17px !important;
  padding-right:17px !important;
}

@media(max-width:640px){
  #services .wc-service-card h3{
    font-size:23px !important;
  }
  .wc-services-page-card h2{
    font-size:23px !important;
  }
  .wc-btn,
  .wc-nav-cta,
  .wc-services-link,
  .wc-services-page-card .wc-btn,
  .wc-service-page .wc-btn{
    font-size:17px !important;
  }
  #services .wc-service-card .wc-service-more,
  .wc-service-more{
    font-size:16px !important;
  }
  #services .wc-service-price,
  .wc-services-page-price{
    font-size:15px !important;
  }
  .wc-service-page-price{
    font-size:16px !important;
  }
}


/* =========================================================
   WebCraft v38 — match home service button typography
   and simplify service-list Подробнее buttons
   ========================================================= */
#services .wc-service-card .wc-service-more{
  font-size:18px !important;
}
@media(max-width:640px){
  #services .wc-service-card .wc-service-more{
    font-size:17px !important;
  }
}

/* =========================================================
   WebCraft v39 — homepage: show 9 services + All services CTA
   ========================================================= */
#services .wc-services-all-card{
  grid-column:1 / -1;
  min-height:118px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-top:2px;
  border:1px solid #e4ebf4;
  border-radius:22px;
  background:#fff;
  box-shadow:0 10px 30px rgba(25,58,98,.045);
}
#services .wc-services-all-btn{
  min-width:210px;
  min-height:52px;
  padding:0 28px;
  border-color:rgba(59,130,246,.22) !important;
  background:#fff !important;
  color:#1677e8 !important;
  font-size:16px !important;
  font-weight:600 !important;
  border-radius:14px;
  box-shadow:0 8px 22px rgba(59,130,246,.08);
}
#services .wc-services-all-btn:hover{
  color:#fff !important;
  border-color:transparent !important;
  background:linear-gradient(135deg,#3b82f6,#06b6d4) !important;
  box-shadow:0 14px 30px rgba(59,130,246,.20);
}
@media(max-width:640px){
  #services .wc-services-all-card{
    min-height:96px;
    border-radius:19px;
  }
  #services .wc-services-all-btn{
    width:min(260px,calc(100% - 36px));
  }
}


/* =========================================================
   WebCraft v41 — unified service button design
   ========================================================= */
/* Dark text on every "Подробнее" button. */
#services .wc-service-card .wc-service-more,
.wc-services-page-card .wc-btn{
  color:#0D1F39 !important;
}

/* Main-page "Все услуги" uses the same design as service buttons. */
#services .wc-services-link{
  min-height:44px !important;
  padding:0 20px !important;
  border:1px solid rgba(59,130,246,.24) !important;
  border-radius:12px !important;
  background:#fff !important;
  color:#0D1F39 !important;
  box-shadow:0 7px 18px rgba(31,77,126,.055) !important;
  font-size:18px !important;
  font-weight:600 !important;
  line-height:1 !important;
}
#services .wc-services-link:hover,
#services .wc-service-card .wc-service-more:hover,
.wc-services-page-card .wc-btn:hover{
  color:#fff !important;
  border-color:transparent !important;
  background:linear-gradient(135deg,#3b82f6,#06b6d4) !important;
  box-shadow:0 11px 24px rgba(59,130,246,.22) !important;
  transform:translateY(-2px) !important;
}

@media(max-width:640px){
  #services .wc-services-link{
    min-height:42px !important;
    padding:0 18px !important;
    font-size:17px !important;
  }
}

/* =========================================================
   WebCraft v42 — fix home services grid last card alignment
   ========================================================= */
#services .wc-services .wc-service-card:last-child{
  grid-column:auto !important;
}

/* =========================================================
   WebCraft v43 — fix WHY US section width
   Keep .wc-value-grid on the same rails as header/services.
   ========================================================= */
.wc-page .wc-container.wc-value-grid{
  width:min(1380px,calc(100% - 72px)) !important;
  max-width:1380px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

@media(max-width:1250px){
  .wc-page .wc-container.wc-value-grid{
    width:min(1180px,calc(100% - 48px)) !important;
    max-width:1180px !important;
  }
}

@media(max-width:720px){
  .wc-page .wc-container.wc-value-grid{
    width:calc(100% - 32px) !important;
    max-width:none !important;
  }
}


/* =========================================================
   WebCraft v44 — sticky header + advantages heading
   ========================================================= */
.wc-page{
  overflow-x:clip !important;
  overflow-y:visible !important;
}
.wc-header{
  position:sticky !important;
  top:0 !important;
  z-index:9999 !important;
}

/* Keep the advantages section heading clean after removing the eyebrow label. */
.wc-value-grid > div:first-child > h2{
  margin-top:0 !important;
}

/* =========================================================
   WebCraft v45 — premium advantages cards
   ========================================================= */
.wc-advantages{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 8% 12%,rgba(11,131,255,.10),transparent 26%),
    radial-gradient(circle at 92% 88%,rgba(2,185,253,.10),transparent 28%),
    linear-gradient(180deg,#f7fbff 0%,#eef7ff 100%) !important;
}
.wc-advantages::before,
.wc-advantages::after{
  content:"";
  position:absolute;
  border-radius:50%;
  pointer-events:none;
  filter:blur(18px);
}
.wc-advantages::before{
  width:280px;
  height:280px;
  left:-110px;
  top:-100px;
  background:rgba(11,131,255,.08);
}
.wc-advantages::after{
  width:320px;
  height:320px;
  right:-140px;
  bottom:-140px;
  background:rgba(2,185,253,.08);
}
.wc-advantages > .wc-container{
  position:relative;
  z-index:1;
}
.wc-advantages-head{
  margin-bottom:34px;
}
.wc-advantages-head h2{
  margin:0;
  color:#0D1F39;
  font-size:clamp(32px,4vw,50px);
  line-height:1.08;
  letter-spacing:-.035em;
  font-weight:650;
}
.wc-advantages-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px;
}
.wc-advantage-card{
  min-height:235px;
  padding:28px;
  border:1px solid rgba(204,222,243,.92);
  border-radius:22px;
  background:#fff;
  box-shadow:0 12px 34px rgba(35,87,145,.055);
  transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease;
}
.wc-advantage-card:hover{
  transform:translateY(-6px);
  border-color:rgba(11,131,255,.24);
  box-shadow:0 24px 54px rgba(28,94,164,.12),0 0 0 1px rgba(2,185,253,.04);
}
.wc-advantage-icon{
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  margin-bottom:24px;
  border-radius:18px;
  color:#fff;
  background:linear-gradient(145deg,#0b83ff,#02b9fd);
  box-shadow:0 14px 30px rgba(11,131,255,.22),inset 0 1px 0 rgba(255,255,255,.32);
  transition:transform .28s ease,box-shadow .28s ease;
}
.wc-advantage-card:hover .wc-advantage-icon{
  transform:translateY(-2px) scale(1.04);
  box-shadow:0 18px 36px rgba(11,131,255,.28),inset 0 1px 0 rgba(255,255,255,.38);
}
.wc-advantage-icon svg{
  width:29px;
  height:29px;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.wc-advantage-card h3{
  margin:0 0 11px;
  color:#10223c;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  font-size:20px;
  line-height:1.3;
  letter-spacing:-.015em;
  font-weight:620;
}
.wc-advantage-card p{
  margin:0;
  color:#718198;
  font-size:14px;
  line-height:1.66;
}
@media(max-width:1100px){
  .wc-advantages-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:640px){
  .wc-advantages-head{margin-bottom:24px}
  .wc-advantages-grid{grid-template-columns:1fr;gap:14px}
  .wc-advantage-card{min-height:0;padding:23px;border-radius:19px}
  .wc-advantage-icon{width:54px;height:54px;border-radius:17px;margin-bottom:20px}
  .wc-advantage-icon svg{width:27px;height:27px}
  .wc-advantage-card h3{font-size:19px}
}

/* =========================================================
   WebCraft v46 — stronger advantages section background
   ========================================================= */
.wc-advantages{
  border-top:1px solid #d7eaff;
  border-bottom:1px solid #d2e7ff;
  background:
    radial-gradient(circle at 12% 18%,rgba(0,118,252,.18) 0,rgba(0,118,252,0) 30%),
    radial-gradient(circle at 88% 82%,rgba(2,185,253,.19) 0,rgba(2,185,253,0) 32%),
    linear-gradient(135deg,#e9f4ff 0%,#dceeff 48%,#edf9ff 100%) !important;
}
.wc-advantages::before{
  width:340px;
  height:340px;
  left:-115px;
  top:-120px;
  background:rgba(0,118,252,.16);
  filter:blur(28px);
}
.wc-advantages::after{
  width:380px;
  height:380px;
  right:-145px;
  bottom:-155px;
  background:rgba(2,185,253,.17);
  filter:blur(30px);
}
.wc-advantage-card{
  background:#ffffff !important;
  border-color:#cfe3f8;
  box-shadow:0 14px 38px rgba(32,92,156,.09);
}

/* =========================================================
   WebCraft v47 — premium mesh background for advantages
   ========================================================= */
.wc-advantages{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border-top:1px solid #cfe4fb;
  border-bottom:1px solid #cfe4fb;
  background:
    radial-gradient(circle at 14% 18%,rgba(0,118,252,.20) 0,rgba(0,118,252,0) 28%),
    radial-gradient(circle at 86% 26%,rgba(2,185,253,.18) 0,rgba(2,185,253,0) 30%),
    radial-gradient(circle at 52% 100%,rgba(46,136,255,.12) 0,rgba(46,136,255,0) 36%),
    linear-gradient(135deg,#f8fbff 0%,#edf5ff 38%,#eaf8ff 72%,#f7fbff 100%) !important;
}

/* very subtle tech grid */
.wc-advantages{
  background-size:auto,auto,auto,auto,32px 32px,32px 32px !important;
}
.wc-advantages::before{
  content:"";
  position:absolute;
  inset:0;
  width:auto;
  height:auto;
  left:0;
  top:0;
  border-radius:0;
  background:
    linear-gradient(rgba(11,131,255,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(11,131,255,.035) 1px,transparent 1px);
  background-size:32px 32px;
  filter:none;
  opacity:.55;
  z-index:-2;
  pointer-events:none;
}

/* soft diagonal light ribbon */
.wc-advantages::after{
  content:"";
  position:absolute;
  width:760px;
  height:260px;
  right:-120px;
  bottom:-110px;
  border-radius:50%;
  background:linear-gradient(90deg,rgba(0,118,252,.14),rgba(2,185,253,.22),rgba(255,255,255,0));
  filter:blur(44px);
  opacity:.75;
  transform:rotate(-10deg);
  z-index:-1;
  pointer-events:none;
}

.wc-advantages > .wc-container{
  position:relative;
  z-index:1;
}

.wc-advantage-card{
  background:#ffffff !important;
  border:1px solid rgba(188,216,244,.95) !important;
  box-shadow:0 18px 45px rgba(27,84,145,.10) !important;
}
.wc-advantage-card:hover{
  border-color:rgba(11,131,255,.28) !important;
  box-shadow:0 28px 62px rgba(27,84,145,.16),0 0 0 1px rgba(2,185,253,.05) !important;
}

/* =========================================================
   WebCraft v48 — dark premium advantages background
   ========================================================= */
.wc-advantages{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border-top:1px solid rgba(80,180,255,.16) !important;
  border-bottom:1px solid rgba(80,180,255,.14) !important;
  background:
    radial-gradient(circle at 12% 16%,rgba(0,118,252,.24) 0,rgba(0,118,252,0) 28%),
    radial-gradient(circle at 88% 22%,rgba(2,185,253,.20) 0,rgba(2,185,253,0) 30%),
    radial-gradient(circle at 50% 110%,rgba(0,118,252,.16) 0,rgba(0,118,252,0) 38%),
    linear-gradient(135deg,#040b13 0%,#071522 35%,#0a2439 68%,#05101a 100%) !important;
}

/* subtle tech grid + micro dots */
.wc-advantages::before{
  content:"";
  position:absolute;
  inset:0;
  width:auto;
  height:auto;
  left:0;
  top:0;
  border-radius:0;
  background:
    linear-gradient(rgba(112,205,255,.038) 1px,transparent 1px),
    linear-gradient(90deg,rgba(112,205,255,.038) 1px,transparent 1px),
    radial-gradient(circle,rgba(121,213,255,.10) 1px,transparent 1.4px);
  background-size:42px 42px,42px 42px,22px 22px;
  filter:none;
  opacity:.52;
  z-index:-2;
  pointer-events:none;
}

/* deep blue glows behind cards */
.wc-advantages::after{
  content:"";
  position:absolute;
  inset:-80px -80px -100px -80px;
  width:auto;
  height:auto;
  border-radius:0;
  background:
    radial-gradient(circle at 16% 28%,rgba(0,118,252,.22),transparent 26%),
    radial-gradient(circle at 84% 72%,rgba(2,185,253,.18),transparent 28%),
    radial-gradient(ellipse at 50% 100%,rgba(16,128,255,.13),transparent 45%);
  filter:blur(18px);
  opacity:.95;
  transform:none;
  z-index:-1;
  pointer-events:none;
}

.wc-advantages-head h2{
  color:#ffffff !important;
  text-shadow:0 8px 34px rgba(0,118,252,.18);
}

.wc-advantage-card{
  background:#ffffff !important;
  border:1px solid rgba(205,226,246,.92) !important;
  box-shadow:
    0 22px 55px rgba(0,0,0,.22),
    0 0 0 1px rgba(255,255,255,.32) inset !important;
}

.wc-advantage-card:hover{
  transform:translateY(-7px);
  border-color:rgba(74,184,255,.46) !important;
  box-shadow:
    0 32px 72px rgba(0,0,0,.28),
    0 0 38px rgba(2,185,253,.10),
    0 0 0 1px rgba(255,255,255,.36) inset !important;
}

.wc-advantage-icon{
  background:linear-gradient(145deg,#087cff,#02b9fd) !important;
  box-shadow:
    0 16px 34px rgba(0,126,255,.28),
    inset 0 1px 0 rgba(255,255,255,.36) !important;
}

@media(max-width:640px){
  .wc-advantages{
    background:
      radial-gradient(circle at 18% 10%,rgba(0,118,252,.23) 0,rgba(0,118,252,0) 34%),
      radial-gradient(circle at 90% 88%,rgba(2,185,253,.16) 0,rgba(2,185,253,0) 34%),
      linear-gradient(160deg,#040b13 0%,#081a2a 52%,#071522 100%) !important;
  }
}

/* =========================================================
   WebCraft v49.1 — CORRECTED from v48 base
   Light logo-gradient advantages + portfolio CTA
   ========================================================= */
.wc-advantages{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border-top:1px solid rgba(0,118,252,.12) !important;
  border-bottom:1px solid rgba(2,185,253,.14) !important;
  background:
    radial-gradient(circle at 10% 18%,rgba(0,118,252,.23) 0%,rgba(0,118,252,0) 32%),
    radial-gradient(circle at 88% 24%,rgba(2,185,253,.24) 0%,rgba(2,185,253,0) 34%),
    radial-gradient(circle at 54% 108%,rgba(0,118,252,.12) 0%,rgba(0,118,252,0) 44%),
    linear-gradient(135deg,#f7fbff 0%,#e8f6ff 42%,#e2f8ff 68%,#f8fcff 100%) !important;
}
.wc-advantages::before{
  content:"";
  position:absolute;
  inset:0;
  width:auto;
  height:auto;
  left:0;
  top:0;
  border-radius:0;
  background:
    linear-gradient(rgba(0,118,252,.028) 1px,transparent 1px),
    linear-gradient(90deg,rgba(2,185,253,.028) 1px,transparent 1px);
  background-size:42px 42px;
  filter:none;
  opacity:.55;
  z-index:-2;
  pointer-events:none;
}
.wc-advantages::after{
  content:"";
  position:absolute;
  inset:-90px -100px -110px -100px;
  width:auto;
  height:auto;
  border-radius:0;
  background:
    radial-gradient(circle at 18% 34%,rgba(0,118,252,.16),transparent 28%),
    radial-gradient(circle at 82% 62%,rgba(2,185,253,.18),transparent 30%);
  filter:blur(24px);
  opacity:.9;
  transform:none;
  z-index:-1;
  pointer-events:none;
}
.wc-advantages-head h2{
  color:#0D1F39 !important;
  text-shadow:none !important;
}
.wc-advantage-card{
  background:#ffffff !important;
  border:1px solid rgba(195,219,242,.96) !important;
  box-shadow:0 18px 45px rgba(28,86,149,.10) !important;
}
.wc-advantage-card:hover{
  transform:translateY(-7px);
  border-color:rgba(0,118,252,.28) !important;
  box-shadow:0 28px 64px rgba(28,86,149,.16),0 0 34px rgba(2,185,253,.08) !important;
}
.wc-advantage-icon{
  background:linear-gradient(145deg,#0076FC,#02B9FD) !important;
  box-shadow:0 16px 34px rgba(0,126,255,.24),inset 0 1px 0 rgba(255,255,255,.36) !important;
}
@media(max-width:640px){
  .wc-advantages{
    background:
      radial-gradient(circle at 15% 10%,rgba(0,118,252,.20) 0%,rgba(0,118,252,0) 38%),
      radial-gradient(circle at 90% 90%,rgba(2,185,253,.18) 0%,rgba(2,185,253,0) 38%),
      linear-gradient(160deg,#f7fbff 0%,#e8f6ff 52%,#eefaff 100%) !important;
  }
}

#portfolio .wc-portfolio-link{
  min-height:44px !important;
  padding:0 20px !important;
  border:1px solid rgba(59,130,246,.24) !important;
  border-radius:12px !important;
  background:#fff !important;
  color:#0D1F39 !important;
  box-shadow:0 7px 18px rgba(31,77,126,.055) !important;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Segoe UI",Roboto,Arial,sans-serif !important;
  font-size:18px !important;
  font-weight:600 !important;
  letter-spacing:-.01em !important;
  line-height:1 !important;
}
#portfolio .wc-portfolio-link:hover{
  color:#fff !important;
  border-color:transparent !important;
  background:linear-gradient(135deg,#3b82f6,#06b6d4) !important;
  box-shadow:0 11px 24px rgba(59,130,246,.22) !important;
  transform:translateY(-2px) !important;
}
@media(max-width:640px){
  #portfolio .wc-portfolio-link{
    min-height:42px !important;
    padding:0 18px !important;
    font-size:17px !important;
  }
}

/* =========================================================
   WebCraft v50 — requested section cleanup + animated advantages
   ========================================================= */
/* Advantages: keep the v48 dark look and periodically wash to a light logo gradient. */
.wc-advantages{
  position:relative !important;
  isolation:isolate !important;
  overflow:hidden !important;
  border-top:1px solid rgba(80,180,255,.16) !important;
  border-bottom:1px solid rgba(80,180,255,.14) !important;
  background:
    radial-gradient(circle at 12% 16%,rgba(0,118,252,.24) 0,rgba(0,118,252,0) 28%),
    radial-gradient(circle at 88% 22%,rgba(2,185,253,.20) 0,rgba(2,185,253,0) 30%),
    radial-gradient(circle at 50% 110%,rgba(0,118,252,.16) 0,rgba(0,118,252,0) 38%),
    linear-gradient(135deg,#040b13 0%,#071522 35%,#0a2439 68%,#05101a 100%) !important;
}
.wc-advantages > .wc-container{
  position:relative;
  z-index:3;
}
.wc-advantages-light-shift{
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  opacity:0;
  background:
    radial-gradient(circle at 10% 18%,rgba(0,118,252,.25) 0%,rgba(0,118,252,0) 31%),
    radial-gradient(circle at 88% 24%,rgba(2,185,253,.27) 0%,rgba(2,185,253,0) 34%),
    radial-gradient(circle at 54% 108%,rgba(0,118,252,.14) 0%,rgba(0,118,252,0) 42%),
    linear-gradient(135deg,#f8fcff 0%,#e7f6ff 38%,#dff7ff 66%,#f9fdff 100%);
  animation:wcAdvantagesLightSweep 5.2s ease-in-out infinite;
}
.wc-advantages::before{
  z-index:1 !important;
  opacity:.42 !important;
}
.wc-advantages::after{
  z-index:2 !important;
  opacity:.76 !important;
}
.wc-advantages-head h2{
  color:#fff !important;
  text-shadow:0 8px 34px rgba(0,118,252,.18) !important;
  animation:wcAdvantagesTitleTone 5.2s ease-in-out infinite;
}
@keyframes wcAdvantagesLightSweep{
  0%,28%,100%{opacity:0}
  44%,62%{opacity:1}
  78%{opacity:.12}
}
@keyframes wcAdvantagesTitleTone{
  0%,28%,100%{color:#fff;text-shadow:0 8px 34px rgba(0,118,252,.18)}
  44%,62%{color:#0D1F39;text-shadow:none}
  78%{color:#f7fbff;text-shadow:0 8px 34px rgba(0,118,252,.14)}
}

/* Process heading is left aligned like the other sections. */
.wc-process-head{
  justify-content:flex-start !important;
  align-items:flex-start !important;
  margin-bottom:44px !important;
}
.wc-process-head h2{
  margin:0 !important;
}
.wc-process .wc-steps{
  margin-top:0 !important;
}

/* Reviews begin directly with cards after removing the old heading. */
#reviews .wc-reviews{
  margin-top:0;
}

@media(prefers-reduced-motion:reduce){
  .wc-advantages-light-shift,
  .wc-advantages-head h2{
    animation:none !important;
  }
}

/* =========================================================
   WebCraft v51 — restore v48 advantages + subtle white stars
   ========================================================= */
.wc-advantages{
  position:relative !important;
  isolation:isolate !important;
  overflow:hidden !important;
  border-top:1px solid rgba(80,180,255,.16) !important;
  border-bottom:1px solid rgba(80,180,255,.14) !important;
  background:
    radial-gradient(circle at 12% 16%,rgba(0,118,252,.24) 0,rgba(0,118,252,0) 28%),
    radial-gradient(circle at 88% 22%,rgba(2,185,253,.20) 0,rgba(2,185,253,0) 30%),
    radial-gradient(circle at 50% 110%,rgba(0,118,252,.16) 0,rgba(0,118,252,0) 38%),
    linear-gradient(135deg,#040b13 0%,#071522 35%,#0a2439 68%,#05101a 100%) !important;
}
.wc-advantages::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  width:auto !important;
  height:auto !important;
  left:0 !important;
  top:0 !important;
  border-radius:0 !important;
  background:
    linear-gradient(rgba(112,205,255,.038) 1px,transparent 1px),
    linear-gradient(90deg,rgba(112,205,255,.038) 1px,transparent 1px),
    radial-gradient(circle,rgba(121,213,255,.10) 1px,transparent 1.4px) !important;
  background-size:42px 42px,42px 42px,22px 22px !important;
  filter:none !important;
  opacity:.52 !important;
  z-index:-2 !important;
  pointer-events:none !important;
}
.wc-advantages::after{
  content:"" !important;
  position:absolute !important;
  inset:-80px -80px -100px -80px !important;
  width:auto !important;
  height:auto !important;
  border-radius:0 !important;
  background:
    radial-gradient(circle at 16% 28%,rgba(0,118,252,.22),transparent 26%),
    radial-gradient(circle at 84% 72%,rgba(2,185,253,.18),transparent 28%),
    radial-gradient(ellipse at 50% 100%,rgba(16,128,255,.13),transparent 45%) !important;
  filter:blur(18px) !important;
  opacity:.95 !important;
  transform:none !important;
  z-index:-1 !important;
  pointer-events:none !important;
}
.wc-advantages > .wc-container{
  position:relative !important;
  z-index:3 !important;
}
.wc-advantages-head h2{
  color:#ffffff !important;
  text-shadow:0 8px 34px rgba(0,118,252,.18) !important;
  animation:none !important;
}
.wc-advantage-card{
  background:#ffffff !important;
  border:1px solid rgba(205,226,246,.92) !important;
  box-shadow:0 22px 55px rgba(0,0,0,.22),0 0 0 1px rgba(255,255,255,.32) inset !important;
}
.wc-advantage-card:hover{
  transform:translateY(-7px);
  border-color:rgba(74,184,255,.46) !important;
  box-shadow:0 32px 72px rgba(0,0,0,.28),0 0 38px rgba(2,185,253,.10),0 0 0 1px rgba(255,255,255,.36) inset !important;
}
.wc-advantage-icon{
  background:linear-gradient(145deg,#087cff,#02b9fd) !important;
  box-shadow:0 16px 34px rgba(0,126,255,.28),inset 0 1px 0 rgba(255,255,255,.36) !important;
}

/* Sparse star field — intentionally subtle. */
.wc-advantages-stars{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  opacity:.52;
  background:
    radial-gradient(circle at 8% 20%,rgba(255,255,255,.82) 0 1.2px,transparent 1.8px),
    radial-gradient(circle at 18% 68%,rgba(255,255,255,.60) 0 1px,transparent 1.6px),
    radial-gradient(circle at 27% 36%,rgba(255,255,255,.72) 0 1.1px,transparent 1.7px),
    radial-gradient(circle at 39% 79%,rgba(255,255,255,.55) 0 1px,transparent 1.6px),
    radial-gradient(circle at 46% 16%,rgba(255,255,255,.70) 0 1.2px,transparent 1.8px),
    radial-gradient(circle at 57% 58%,rgba(255,255,255,.58) 0 1px,transparent 1.6px),
    radial-gradient(circle at 68% 30%,rgba(255,255,255,.78) 0 1.1px,transparent 1.7px),
    radial-gradient(circle at 76% 76%,rgba(255,255,255,.52) 0 1px,transparent 1.6px),
    radial-gradient(circle at 86% 48%,rgba(255,255,255,.74) 0 1.2px,transparent 1.8px),
    radial-gradient(circle at 93% 18%,rgba(255,255,255,.56) 0 1px,transparent 1.6px),
    radial-gradient(circle at 13% 88%,rgba(255,255,255,.48) 0 1px,transparent 1.6px),
    radial-gradient(circle at 62% 90%,rgba(255,255,255,.62) 0 1px,transparent 1.6px);
  animation:wcAdvantageStars 7s ease-in-out infinite alternate;
}
@keyframes wcAdvantageStars{
  from{opacity:.38}
  to{opacity:.62}
}

@media(max-width:640px){
  .wc-advantages{
    background:
      radial-gradient(circle at 18% 10%,rgba(0,118,252,.23) 0,rgba(0,118,252,0) 34%),
      radial-gradient(circle at 90% 88%,rgba(2,185,253,.16) 0,rgba(2,185,253,0) 34%),
      linear-gradient(160deg,#040b13 0%,#081a2a 52%,#071522 100%) !important;
  }
  .wc-advantages-stars{opacity:.42}
}
@media(prefers-reduced-motion:reduce){
  .wc-advantages-stars{animation:none !important}
}

/* =========================================================
   WebCraft v53 — animated space video hero
   Replaces the former New York background completely.
   ========================================================= */
.wc-hero-centered{
  position:relative;
  isolation:isolate;
  background:#020914 !important;
}
.wc-hero-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  z-index:0;
  pointer-events:none;
  opacity:.78;
  filter:saturate(1.12) contrast(1.06) brightness(.82);
  transform:scale(1.015);
}
.wc-hero-video-shade{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:
    radial-gradient(circle at 18% 24%,rgba(0,118,252,.20),transparent 32%),
    radial-gradient(circle at 82% 28%,rgba(2,185,253,.15),transparent 34%),
    radial-gradient(ellipse at center,rgba(3,15,29,.08) 0%,rgba(2,9,19,.28) 58%,rgba(1,6,14,.58) 100%),
    linear-gradient(180deg,rgba(2,8,17,.28),rgba(2,8,17,.52));
}
/* Keep existing moving glow effects above the video. */
.wc-hero-centered::before,
.wc-hero-centered::after{
  z-index:2 !important;
}
.wc-hero-centered .wc-hero-brands{
  z-index:4 !important;
}
.wc-hero-centered .wc-container{
  position:relative;
  z-index:5 !important;
}
.wc-hero-centered .wc-scroll-indicator{
  z-index:6 !important;
}
.wc-hero-centered .wc-cursor-glow{
  z-index:3 !important;
}
/* The old city element is intentionally disabled in case cached markup remains. */
.wc-hero-city{display:none !important;}

@media(max-width:720px){
  .wc-hero-video{
    opacity:.72;
    object-position:center center;
    transform:scale(1.05);
  }
  .wc-hero-video-shade{
    background:
      radial-gradient(circle at 50% 32%,rgba(0,118,252,.18),transparent 40%),
      linear-gradient(180deg,rgba(2,8,17,.34),rgba(2,8,17,.64));
  }
}

@media(prefers-reduced-motion:reduce){
  .wc-hero-video{display:none;}
  .wc-hero-centered{
    background-image:url("../images/space-poster.webp") !important;
    background-size:cover !important;
    background-position:center !important;
  }
}

/* =========================================================
   WebCraft v54 — real deep-space hero
   Cinematic star field + blue nebula + planet crescent.
   ========================================================= */
.wc-hero-centered{
  background:#010713 !important;
}
.wc-hero-video{
  opacity:.94 !important;
  filter:saturate(1.18) contrast(1.08) brightness(.94) !important;
  transform:scale(1.01) !important;
}
.wc-hero-video-shade{
  background:
    radial-gradient(ellipse at 50% 48%,rgba(2,8,18,.18) 0%,rgba(2,8,18,.30) 30%,rgba(2,8,18,.12) 55%,rgba(1,6,14,.32) 100%),
    linear-gradient(180deg,rgba(1,6,15,.14),rgba(1,6,15,.28)) !important;
}
@media(max-width:720px){
  .wc-hero-video{
    opacity:.90 !important;
    object-position:center center !important;
    transform:scale(1.035) !important;
  }
  .wc-hero-video-shade{
    background:
      radial-gradient(ellipse at 50% 42%,rgba(2,8,18,.22),rgba(2,8,18,.38) 58%,rgba(1,6,14,.48) 100%) !important;
  }
}

/* =========================================================
   WebCraft v55 — clean distant stars hero
   Star-only background: no planet, no nebula, no large objects.
   Slow seamless motion is baked into the local 12s / 30fps video.
   ========================================================= */
.wc-hero-centered{
  background:#020a12 !important;
}
.wc-hero-video{
  opacity:.90 !important;
  filter:saturate(.95) contrast(1.04) brightness(.90) !important;
  transform:none !important;
  object-fit:cover !important;
  object-position:center center !important;
}
.wc-hero-video-shade{
  background:
    radial-gradient(ellipse at 50% 48%,rgba(0,24,48,.06) 0%,rgba(0,13,29,.12) 52%,rgba(0,7,17,.25) 100%),
    linear-gradient(180deg,rgba(1,7,16,.08),rgba(1,7,16,.18)) !important;
}
@media(max-width:720px){
  .wc-hero-video{
    opacity:.88 !important;
    transform:none !important;
    object-position:center center !important;
  }
  .wc-hero-video-shade{
    background:linear-gradient(180deg,rgba(1,7,16,.14),rgba(1,7,16,.30)) !important;
  }
}


/* =========================================================
   WebCraft v56 — slower tiny-star video + 3-word blue shimmer
   ========================================================= */
/* Video is now a 30s seamless ultra-slow pan. Stars in the
   source are smaller/subpixel so they stay subtle behind copy. */
.wc-hero-video{
  opacity:.88 !important;
  filter:saturate(.92) contrast(1.03) brightness(.88) !important;
}

/* "роста вашего бизнеса" — all blue, with a soft shimmer
   travelling across the three words without gradient-clip bugs. */
.wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase{
  display:inline;
  color:#23b5f6;
}
.wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase > span{
  display:inline;
  color:#23b5f6;
  -webkit-text-fill-color:#23b5f6;
  text-shadow:0 0 0 rgba(35,181,246,0);
  animation:wcGrowthPhraseWave 6.4s ease-in-out infinite;
}
.wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase > span:nth-child(2){animation-delay:.24s;}
.wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase > span:nth-child(3){animation-delay:.48s;}
@keyframes wcGrowthPhraseWave{
  0%,64%,100%{
    color:#23b5f6;
    -webkit-text-fill-color:#23b5f6;
    text-shadow:0 0 0 rgba(35,181,246,0);
  }
  74%{
    color:#61d8ff;
    -webkit-text-fill-color:#61d8ff;
    text-shadow:0 0 15px rgba(38,190,255,.24);
  }
  84%{
    color:#02b9fd;
    -webkit-text-fill-color:#02b9fd;
    text-shadow:0 0 5px rgba(38,190,255,.10);
  }
}
@media(prefers-reduced-motion:reduce){
  .wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase > span{
    animation:none !important;
    color:#23b5f6 !important;
    -webkit-text-fill-color:#23b5f6 !important;
    text-shadow:none !important;
  }
}

/* =========================================================
   WebCraft v58 — premium 60fps starfield video
   Higher bitrate + 60fps + tiny stars + smooth seamless motion.
   ========================================================= */
.wc-hero-video{
  opacity:.92 !important;
  filter:saturate(1.02) contrast(1.06) brightness(.94) !important;
  transform:translateZ(0) !important;
  backface-visibility:hidden;
  will-change:transform;
}

/* =========================================================
   WebCraft v59 — smaller stars, smoother premium pan,
   and moderate left-to-right logo-gradient phrase.
   ========================================================= */
.wc-hero-video{
  opacity:.94 !important;
  filter:saturate(1.02) contrast(1.08) brightness(.98) !important;
  transform:translateZ(0) !important;
  backface-visibility:hidden;
  will-change:transform;
}
.wc-hero-video-shade{
  background:
    radial-gradient(ellipse at 50% 45%, rgba(0,16,34,.10) 0%, rgba(0,12,27,.22) 54%, rgba(0,8,19,.38) 100%),
    linear-gradient(180deg, rgba(1,7,16,.08), rgba(1,7,16,.16)) !important;
}
.wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase{
  display:inline-block;
  background:linear-gradient(90deg,#0076FC 0%, #1797ff 35%, #02B9FD 68%, #42dbff 100%);
  background-size:200% 100%;
  background-position:0% 50%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent !important;
  -webkit-text-fill-color:transparent !important;
  animation:wcGrowthGradientFlow 8.5s ease-in-out infinite;
  text-shadow:0 0 18px rgba(2,185,253,.12);
}
.wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase > span{
  color:inherit !important;
  -webkit-text-fill-color:inherit !important;
  animation:none !important;
  text-shadow:none !important;
}
@keyframes wcGrowthGradientFlow{
  0%{background-position:0% 50%;}
  50%{background-position:100% 50%;}
  100%{background-position:0% 50%;}
}
@media(prefers-reduced-motion:reduce){
  .wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase{
    animation:none !important;
    background-position:45% 50% !important;
  }
}

/* =========================================================
   WebCraft v60 — 40% slower star video + stronger premium
   left-to-right shimmer for “роста вашего бизнеса”.
   ========================================================= */
.wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase{
  display:inline-block;
  background:
    linear-gradient(90deg,
      #0076FC 0%,
      #0789ff 20%,
      #02B9FD 38%,
      #bff6ff 50%,
      #28ccff 58%,
      #02B9FD 72%,
      #0076FC 100%);
  background-size:230% 100%;
  background-position:115% 50%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent !important;
  -webkit-text-fill-color:transparent !important;
  animation:wcGrowthGradientFlowV60 6.8s linear infinite !important;
  filter:drop-shadow(0 0 8px rgba(2,185,253,.22));
  will-change:background-position,filter;
}
.wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase > span{
  color:inherit !important;
  -webkit-text-fill-color:inherit !important;
  animation:none !important;
  text-shadow:none !important;
}
@keyframes wcGrowthGradientFlowV60{
  0%{
    background-position:115% 50%;
    filter:drop-shadow(0 0 5px rgba(2,185,253,.15));
  }
  42%{
    filter:drop-shadow(0 0 11px rgba(42,205,255,.34));
  }
  68%{
    filter:drop-shadow(0 0 8px rgba(2,185,253,.25));
  }
  100%{
    background-position:-115% 50%;
    filter:drop-shadow(0 0 5px rgba(2,185,253,.15));
  }
}
@media(prefers-reduced-motion:reduce){
  .wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase{
    animation:none !important;
    background-position:50% 50% !important;
    filter:drop-shadow(0 0 6px rgba(2,185,253,.18));
  }
}

/* =========================================================
   WebCraft v61 — another 40% slower hero video and a single,
   more visible left-to-right shimmer for “роста вашего бизнеса”.
   ========================================================= */
.wc-hero-video{
  opacity:.95 !important;
  filter:saturate(1.03) contrast(1.08) brightness(1.0) !important;
}
.wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase{
  display:inline-block;
  background:
    linear-gradient(90deg,
      #0076FC 0%,
      #0d86ff 22%,
      #02B9FD 42%,
      #eefcff 50%,
      #9cecff 57%,
      #02B9FD 72%,
      #0076FC 100%);
  background-size:235% 100%;
  background-position:118% 50%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent !important;
  -webkit-text-fill-color:transparent !important;
  animation:wcGrowthGradientOnceV61 5.8s cubic-bezier(.22,.61,.36,1) 1 forwards !important;
  filter:drop-shadow(0 0 9px rgba(2,185,253,.24));
  will-change:background-position,filter;
}
.wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase > span{
  color:inherit !important;
  -webkit-text-fill-color:inherit !important;
  animation:none !important;
  text-shadow:none !important;
}
@keyframes wcGrowthGradientOnceV61{
  0%{
    background-position:118% 50%;
    filter:drop-shadow(0 0 6px rgba(2,185,253,.16));
  }
  48%{
    filter:drop-shadow(0 0 14px rgba(150,236,255,.34));
  }
  100%{
    background-position:-18% 50%;
    filter:drop-shadow(0 0 8px rgba(2,185,253,.20));
  }
}
@media(prefers-reduced-motion:reduce){
  .wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase{
    animation:none !important;
    background-position:45% 50% !important;
    filter:drop-shadow(0 0 6px rgba(2,185,253,.18));
  }
}

/* =========================================================
   WebCraft v62 — much slower star motion and a one-time white
   shimmer that settles into the original v48 blue tone.
   ========================================================= */
.wc-hero-video{
  opacity:.95 !important;
  filter:saturate(1.03) contrast(1.08) brightness(1.0) !important;
}
.wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase{
  display:inline-block;
  background-image:linear-gradient(90deg,
    #23b5f6 0%,
    #23b5f6 34%,
    #7ae4ff 44%,
    #f8feff 50%,
    #b3f1ff 56%,
    #23b5f6 66%,
    #23b5f6 100%);
  background-size:240% 100%;
  background-position:118% 50%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent !important;
  -webkit-text-fill-color:transparent !important;
  animation:wcGrowthShimmerOnceV62 4.9s cubic-bezier(.24,.65,.3,1) 1 forwards !important;
  filter:drop-shadow(0 0 10px rgba(122,228,255,.18));
}
.wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase > span{
  color:inherit !important;
  -webkit-text-fill-color:inherit !important;
  animation:none !important;
  text-shadow:none !important;
}
@keyframes wcGrowthShimmerOnceV62{
  0%{
    background-image:linear-gradient(90deg,
      #23b5f6 0%,#23b5f6 34%,#7ae4ff 44%,#f8feff 50%,#b3f1ff 56%,#23b5f6 66%,#23b5f6 100%);
    background-position:118% 50%;
    filter:drop-shadow(0 0 6px rgba(122,228,255,.12));
  }
  58%{
    filter:drop-shadow(0 0 14px rgba(248,254,255,.24));
  }
  100%{
    background-image:linear-gradient(90deg,#23b5f6 0%,#23b5f6 100%);
    background-position:0% 50%;
    filter:drop-shadow(0 0 6px rgba(35,181,246,.10));
  }
}
@media(prefers-reduced-motion:reduce){
  .wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase{
    animation:none !important;
    background-image:linear-gradient(90deg,#23b5f6 0%,#23b5f6 100%) !important;
    background-position:0% 50% !important;
    filter:none !important;
  }
}

/* =========================================================
   WebCraft v63 — premium multi-layer starfield + full phrase shine.
   The video uses three tiny-star depth layers with very slow parallax.
   The shine crosses every word once and then settles to v48 blue.
   ========================================================= */
.wc-hero-video{
  opacity:.96 !important;
  filter:saturate(1.02) contrast(1.07) brightness(1.01) !important;
  transform:translateZ(0) !important;
  backface-visibility:hidden;
}
.wc-hero-video-shade{
  background:
    radial-gradient(ellipse at 50% 45%,rgba(0,14,30,.04) 0%,rgba(0,10,24,.13) 58%,rgba(0,6,16,.28) 100%),
    linear-gradient(180deg,rgba(1,6,15,.05),rgba(1,6,15,.12)) !important;
}

/* Base phrase color after the shimmer: the same #23b5f6 used in v48. */
.wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase{
  display:inline;
  color:#23b5f6 !important;
  -webkit-text-fill-color:#23b5f6 !important;
  background:none !important;
  animation:none !important;
  filter:none !important;
  text-shadow:0 0 7px rgba(35,181,246,.10);
}
.wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase > span{
  display:inline-block;
  color:transparent !important;
  -webkit-text-fill-color:transparent !important;
  background-image:linear-gradient(105deg,
    #23b5f6 0%,
    #23b5f6 37%,
    #9cecff 44%,
    #ffffff 50%,
    #b8f2ff 56%,
    #23b5f6 63%,
    #23b5f6 100%);
  background-size:310% 100%;
  background-position:125% 50%;
  -webkit-background-clip:text;
  background-clip:text;
  animation:wcWordShineV63 1.85s cubic-bezier(.22,.68,.32,1) 1 forwards !important;
  filter:drop-shadow(0 0 8px rgba(150,236,255,.12));
}
.wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase > span:nth-child(1){animation-delay:.45s !important;}
.wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase > span:nth-child(2){animation-delay:1.35s !important;}
.wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase > span:nth-child(3){animation-delay:2.25s !important;}
@keyframes wcWordShineV63{
  0%{
    background-position:125% 50%;
    filter:drop-shadow(0 0 5px rgba(150,236,255,.08));
  }
  52%{
    filter:drop-shadow(0 0 14px rgba(255,255,255,.24));
  }
  100%{
    background-position:-125% 50%;
    filter:drop-shadow(0 0 5px rgba(35,181,246,.08));
  }
}
@media(prefers-reduced-motion:reduce){
  .wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase > span{
    animation:none !important;
    background:none !important;
    color:#23b5f6 !important;
    -webkit-text-fill-color:#23b5f6 !important;
    filter:none !important;
  }
}

/* =========================================================
   WebCraft v65 — inspected from screen recording:
   - much subtler 120fps star motion (no fast parallel drift)
   - one continuous white shimmer across the entire phrase
   - clean v48 blue (#23b5f6) before and after the shimmer
   ========================================================= */
.wc-hero-video{
  opacity:.96 !important;
  filter:saturate(1.02) contrast(1.08) brightness(1.01) !important;
  transform:translateZ(0) !important;
  backface-visibility:hidden;
  will-change:transform;
}
.wc-hero-video-shade{
  background:
    radial-gradient(ellipse at 50% 45%,rgba(0,14,30,.02) 0%,rgba(0,10,24,.10) 60%,rgba(0,6,16,.24) 100%),
    linear-gradient(180deg,rgba(1,6,15,.03),rgba(1,6,15,.10)) !important;
}

.wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase{
  position:relative;
  display:inline-block;
  color:#23b5f6 !important;
  -webkit-text-fill-color:#23b5f6 !important;
  background:none !important;
  animation:none !important;
  filter:none !important;
  text-shadow:0 0 7px rgba(35,181,246,.10);
}
.wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase > span{
  animation:none !important;
}
.wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase::after{
  content:attr(data-text);
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  color:transparent;
  -webkit-text-fill-color:transparent;
  background-image:linear-gradient(100deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,0) 38%,
    rgba(191,245,255,.72) 44%,
    rgba(255,255,255,.98) 50%,
    rgba(211,250,255,.84) 56%,
    rgba(255,255,255,0) 63%,
    rgba(255,255,255,0) 100%);
  background-size:300% 100%;
  background-position:150% 50%;
  -webkit-background-clip:text;
  background-clip:text;
  animation:wcPhraseShineFullV65 4.6s cubic-bezier(.22,.61,.36,1) .55s 1 forwards !important;
  filter:drop-shadow(0 0 9px rgba(224,252,255,.22));
  opacity:1;
}
@keyframes wcPhraseShineFullV65{
  0%{background-position:150% 50%;opacity:1;}
  88%{background-position:-50% 50%;opacity:1;}
  100%{background-position:-70% 50%;opacity:0;}
}
@media(prefers-reduced-motion:reduce){
  .wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase::after{display:none!important;}
}

/* =========================================================
   WebCraft v66 — simple light white shimmer for the phrase.
   ========================================================= */
.wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase{
  position:relative;
  display:inline-block;
  color:#23b5f6 !important;
  -webkit-text-fill-color:#23b5f6 !important;
  background:none !important;
  text-shadow:0 0 6px rgba(35,181,246,.08) !important;
}
.wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase > span{
  animation:none !important;
  background:none !important;
  color:inherit !important;
  -webkit-text-fill-color:inherit !important;
  filter:none !important;
}
.wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase::after{
  content:attr(data-text);
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  color:transparent;
  -webkit-text-fill-color:transparent;
  background-image:linear-gradient(100deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,0) 42%,
    rgba(255,255,255,.22) 47%,
    rgba(255,255,255,.60) 50%,
    rgba(255,255,255,.22) 53%,
    rgba(255,255,255,0) 58%,
    rgba(255,255,255,0) 100%);
  background-size:240% 100%;
  background-position:135% 50%;
  -webkit-background-clip:text;
  background-clip:text;
  filter:drop-shadow(0 0 5px rgba(255,255,255,.10));
  opacity:1;
  animation:wcPhraseSoftShimmerV66 3.8s ease-out .45s 1 forwards !important;
}
@keyframes wcPhraseSoftShimmerV66{
  0%{background-position:135% 50%;opacity:1;}
  92%{background-position:-35% 50%;opacity:1;}
  100%{background-position:-50% 50%;opacity:0;}
}
@media(prefers-reduced-motion:reduce){
  .wc-hero-centered .wc-hero-copy h1 .wc-growth-phrase::after{display:none!important;}
}


/* WebCraft v67 — scroll indicator removed from hero */
.wc-scroll-indicator{display:none !important;}

/* =========================================================
   WebCraft v69 — remove browser video overlay/PiP button.
   Hero video is decorative and must not expose media controls.
   ========================================================= */
.wc-hero-video{
  pointer-events:none !important;
  user-select:none !important;
  -webkit-user-select:none !important;
}
.wc-hero-video::-webkit-media-controls,
.wc-hero-video::-webkit-media-controls-enclosure,
.wc-hero-video::-webkit-media-controls-panel,
.wc-hero-video::-webkit-media-controls-overlay-play-button,
.wc-hero-video::-webkit-media-controls-picture-in-picture-button,
.wc-hero-video::-webkit-media-controls-start-playback-button{
  display:none !important;
  opacity:0 !important;
  visibility:hidden !important;
}

/* =========================================================
   WebCraft v70 — global update
   language switch, forms/modal, works page, Firefox sticky fix,
   portfolio card meta, scroll-to-top styling.
   ========================================================= */

/* Firefox-safe sticky header: no clipping/scroll-container ancestor. */
body.webcraft-site{overflow-x:clip !important;}
.wc-page{overflow:visible !important;}
.wc-header{
  position:sticky !important;
  top:0 !important;
  left:0;
  right:0;
  width:100%;
  min-height:82px;
  z-index:99999 !important;
  transform:none !important;
  isolation:isolate;
}
.wc-nav{gap:20px !important;}
.wc-menu{gap:26px !important;}

/* RU / RO segmented switch. */
.wc-lang-switch{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:3px;
  min-height:44px;
  padding:4px;
  border:1px solid #dce8f7;
  border-radius:14px;
  background:#f5f9ff;
  box-shadow:0 6px 18px rgba(31,77,126,.05);
}
.wc-lang-link{
  min-width:42px;
  height:34px;
  padding:0 10px;
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#0D1F39 !important;
  font-size:13px;
  font-weight:700;
  line-height:1;
  transition:.22s ease;
}
.wc-lang-link:hover{background:#fff;color:#1677e8 !important;}
.wc-lang-link.is-active{
  color:#fff !important;
  background:linear-gradient(135deg,#3b82f6,#06b6d4);
  box-shadow:0 7px 16px rgba(59,130,246,.22);
}

/* Project cards: no text over the image, metadata under it. */
.wc-project-img{padding:0 !important;}
.wc-project-img::after{display:none !important;}
.wc-project-img > span{display:none !important;}
.wc-project-info{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-top:15px;
}
.wc-project-copy{min-width:0;}
.wc-project-copy h3{
  margin:0 0 5px !important;
  color:#0D1F39;
  font-size:18px !important;
  font-weight:650;
  line-height:1.25;
}
.wc-project-copy small{
  display:block;
  margin:0 !important;
  color:#8797aa;
  font-size:13px;
}
.wc-project-external{
  flex:0 0 42px;
  width:42px;
  height:42px;
  border:1px solid #dce8f7;
  border-radius:12px;
  background:#fff;
  display:grid;
  place-items:center;
  color:#1677e8 !important;
  box-shadow:0 7px 18px rgba(31,77,126,.055);
  transition:.22s ease;
}
.wc-project-external svg{width:20px;height:20px;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.wc-project-external:hover{
  color:#fff !important;
  border-color:transparent;
  background:linear-gradient(135deg,#3b82f6,#06b6d4);
  transform:translateY(-2px);
  box-shadow:0 11px 24px rgba(59,130,246,.20);
}
.wc-project-external.is-placeholder{cursor:default;}

/* Standalone works page. */
.wc-works-hero{
  padding:84px 0 58px;
  background:
    radial-gradient(circle at 80% 20%,rgba(2,185,253,.11),transparent 28%),
    linear-gradient(180deg,#f8fbff 0%,#fff 100%);
  border-bottom:1px solid #edf2f8;
}
.wc-works-hero h1{font-size:clamp(42px,5vw,68px);letter-spacing:-.045em;margin:18px 0 14px;color:#0D1F39;}
.wc-works-hero p{max-width:720px;margin:0;color:#65768a;font-size:17px;line-height:1.7;}
.wc-projects-page{gap:30px 22px !important;}

/* CTA inline lead form. */
.wc-cta-form-box{grid-template-columns:1.45fr .55fr !important;}
.wc-lead-form{display:grid;gap:14px;}
.wc-inline-lead-form{
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;
  align-items:end;
  max-width:800px;
  margin-top:22px;
}
.wc-lead-form label{display:grid;gap:7px;color:#31455e;font-size:12px;font-weight:650;}
.wc-lead-form input[type="text"],
.wc-lead-form input[type="tel"]{
  width:100%;
  height:52px;
  border:1px solid #d9e7f5;
  border-radius:14px;
  background:#fff;
  color:#0D1F39;
  padding:0 16px;
  font:500 15px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  outline:none;
  box-shadow:0 7px 18px rgba(31,77,126,.035);
  transition:border-color .2s ease,box-shadow .2s ease;
}
.wc-lead-form input:focus{border-color:#48b9ff;box-shadow:0 0 0 4px rgba(2,185,253,.10),0 8px 22px rgba(31,77,126,.06);}
.wc-inline-lead-form .wc-btn{height:52px;white-space:nowrap;}
.wc-form-status{grid-column:1/-1;min-height:18px;font-size:13px;line-height:1.4;}
.wc-form-status.is-success{color:#15945c;}
.wc-form-status.is-error{color:#cc3d4a;}
.wc-hp-field{position:absolute !important;left:-99999px !important;width:1px !important;height:1px !important;opacity:0 !important;pointer-events:none !important;}
.wc-lead-form button:disabled{opacity:.65;cursor:wait;}

/* Modal request form. */
body.wc-modal-open{overflow:hidden !important;}
.wc-project-modal{position:fixed;inset:0;z-index:200000;display:grid;place-items:center;padding:20px;visibility:hidden;opacity:0;transition:opacity .22s ease,visibility .22s ease;}
.wc-project-modal.is-open{visibility:visible;opacity:1;}
.wc-project-modal-backdrop{position:absolute;inset:0;background:rgba(3,12,25,.72);backdrop-filter:blur(7px);}
.wc-project-modal-dialog{
  position:relative;
  z-index:1;
  width:min(520px,100%);
  padding:34px;
  border:1px solid rgba(221,235,249,.9);
  border-radius:26px;
  background:#fff;
  box-shadow:0 35px 100px rgba(3,18,38,.30);
  transform:translateY(14px) scale(.985);
  transition:transform .22s ease;
}
.wc-project-modal.is-open .wc-project-modal-dialog{transform:none;}
.wc-project-modal-close{position:absolute;right:16px;top:14px;width:40px;height:40px;border:0;border-radius:50%;background:#f2f7fc;color:#0D1F39;font-size:25px;line-height:1;cursor:pointer;transition:.2s ease;}
.wc-project-modal-close:hover{background:#e7f3ff;color:#1677e8;transform:rotate(4deg);}
.wc-modal-kicker{display:inline-block;color:#1677e8;font-size:12px;font-weight:800;letter-spacing:.04em;margin-bottom:9px;}
.wc-project-modal h2{margin:0 42px 10px 0;color:#0D1F39;font-size:32px;letter-spacing:-.035em;}
.wc-project-modal p{margin:0 0 20px;color:#65768a;font-size:14px;line-height:1.65;}
.wc-modal-service{margin:-5px 0 17px;padding:10px 12px;border-radius:11px;background:#f0f8ff;color:#1677e8;font-size:13px;font-weight:650;}
.wc-project-modal .wc-btn{width:100%;height:52px;margin-top:2px;}

/* Astra scroll-to-top: keep the current arrow, change only the button. */
#ast-scroll-top,
.ast-scroll-top-icon{
  width:58px !important;
  height:58px !important;
  min-width:58px !important;
  min-height:58px !important;
  border-radius:50% !important;
  background:linear-gradient(135deg,#3b82f6,#06b6d4) !important;
  color:#fff !important;
  box-shadow:0 12px 28px rgba(59,130,246,.28) !important;
  border:0 !important;
  transition:transform .22s ease,box-shadow .22s ease !important;
}
#ast-scroll-top:hover,
.ast-scroll-top-icon:hover{transform:translateY(-3px) !important;box-shadow:0 16px 34px rgba(59,130,246,.36) !important;}
#ast-scroll-top svg,.ast-scroll-top-icon svg{fill:currentColor !important;color:#fff !important;}

@media(max-width:1180px){
  .wc-nav{gap:14px !important;}
  .wc-menu{gap:18px !important;font-size:13px !important;}
  .wc-nav-cta{padding-inline:18px !important;}
}
@media(max-width:960px){
  .wc-header{min-height:68px;height:68px;}
  .wc-lang-switch{margin-left:8px;min-height:40px;padding:3px;}
  .wc-lang-link{min-width:38px;height:32px;font-size:12px;}
  .wc-menu-toggle{order:4;margin-left:6px;}
  .wc-lang-switch{order:3;}
  .wc-menu{order:5;}
}
@media(max-width:720px){
  .wc-inline-lead-form{grid-template-columns:1fr;}
  .wc-inline-lead-form .wc-btn{width:100%;}
  .wc-cta-form-box{grid-template-columns:1fr !important;}
  .wc-cta-form-box .wc-cta-art{display:none;}
  .wc-project-modal-dialog{padding:28px 22px 24px;border-radius:22px;}
  .wc-project-modal h2{font-size:27px;}
  .wc-works-hero{padding:62px 0 42px;}
  #ast-scroll-top,.ast-scroll-top-icon{width:54px !important;height:54px !important;min-width:54px !important;min-height:54px !important;}
}


/* =========================================================
   WebCraft v71 — cleaner project modal and stronger hero-video
   control suppression for Firefox / PiP overlays.
   ========================================================= */
.wc-project-modal h2{margin-top:0 !important;}
.wc-project-modal-close{
  right:18px !important;
  top:16px !important;
  width:46px !important;
  height:46px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border:1px solid #dfe9f6 !important;
  border-radius:50% !important;
  background:linear-gradient(180deg,#f9fbff,#edf4fb) !important;
  color:#0d1f39 !important;
  font-size:28px !important;
  font-weight:300 !important;
  line-height:1 !important;
  padding:0 !important;
  box-shadow:0 8px 22px rgba(13,31,57,.08) !important;
}
.wc-project-modal-close:hover{
  background:#ffffff !important;
  color:#1677e8 !important;
  border-color:#cfe2fb !important;
  transform:translateY(-1px) !important;
  box-shadow:0 12px 26px rgba(22,119,232,.14) !important;
}
.wc-hero-video{
  pointer-events:none !important;
  user-select:none !important;
  -webkit-user-select:none !important;
  -moz-user-select:none !important;
}
.wc-hero-video-shade{
  pointer-events:auto !important;
}
.wc-hero-video::-webkit-media-controls,
.wc-hero-video::-webkit-media-controls-enclosure,
.wc-hero-video::-webkit-media-controls-panel,
.wc-hero-video::-webkit-media-controls-overlay-play-button,
.wc-hero-video::-webkit-media-controls-picture-in-picture-button,
.wc-hero-video::-webkit-media-controls-start-playback-button{
  display:none !important;
  opacity:0 !important;
  visibility:hidden !important;
}

/* =========================================================
   WebCraft v72 — modal polish, RO prices, project icon refresh,
   dark inner-page hero matching "Наши преимущества".
   ========================================================= */

/* Modal: title aligned with the close control. */
.wc-project-modal-dialog{
  padding-top:30px !important;
}
.wc-project-modal h2{
  min-height:48px !important;
  display:flex !important;
  align-items:center !important;
  margin:0 72px 10px 0 !important;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Segoe UI",Roboto,Arial,sans-serif !important;
  font-weight:650 !important;
  letter-spacing:-.035em !important;
}
.wc-project-modal-close{
  top:24px !important;
  right:20px !important;
  width:46px !important;
  height:46px !important;
  padding:0 !important;
  display:grid !important;
  place-items:center !important;
  line-height:0 !important;
  font-size:0 !important;
}
.wc-project-modal-close svg{
  width:18px !important;
  height:18px !important;
  display:block !important;
  stroke:currentColor !important;
  stroke-width:1.7 !important;
  stroke-linecap:round !important;
}
.wc-modal-service{
  margin:-4px 0 18px !important;
  padding:12px 14px !important;
  border-radius:12px !important;
  background:#eef7ff !important;
  color:#1677e8 !important;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,Arial,sans-serif !important;
  font-size:15px !important;
  line-height:1.35 !important;
  font-weight:500 !important;
  letter-spacing:-.012em !important;
}

/* Cleaner project external-link icon on homepage and Works page. */
.wc-project-external{
  width:46px !important;
  height:46px !important;
  min-width:46px !important;
  border-radius:14px !important;
  display:grid !important;
  place-items:center !important;
  background:#fff !important;
  border:1px solid #dce8f5 !important;
  color:#0D1F39 !important;
  box-shadow:0 8px 22px rgba(31,77,126,.07) !important;
}
.wc-project-external svg{
  width:21px !important;
  height:21px !important;
  stroke:currentColor !important;
  stroke-width:1.75 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
}
.wc-project-external:hover{
  color:#fff !important;
  border-color:transparent !important;
  background:linear-gradient(135deg,#3b82f6,#06b6d4) !important;
  transform:translateY(-2px) !important;
  box-shadow:0 12px 26px rgba(59,130,246,.22) !important;
}

/* Inner page headers — same dark visual language as "Наши преимущества". */
.wc-services-page-hero,
.wc-works-hero{
  position:relative !important;
  isolation:isolate !important;
  overflow:hidden !important;
  border-top:1px solid rgba(80,180,255,.14) !important;
  border-bottom:1px solid rgba(80,180,255,.16) !important;
  background:
    radial-gradient(circle at 12% 16%,rgba(0,118,252,.24) 0,rgba(0,118,252,0) 28%),
    radial-gradient(circle at 88% 22%,rgba(2,185,253,.20) 0,rgba(2,185,253,0) 30%),
    radial-gradient(circle at 50% 110%,rgba(0,118,252,.16) 0,rgba(0,118,252,0) 38%),
    linear-gradient(135deg,#040b13 0%,#071522 35%,#0a2439 68%,#05101a 100%) !important;
}
.wc-services-page-hero::before,
.wc-works-hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  pointer-events:none;
  opacity:.58;
  background:
    radial-gradient(circle at 7% 28%,rgba(255,255,255,.78) 0 1px,transparent 1.6px),
    radial-gradient(circle at 18% 72%,rgba(255,255,255,.50) 0 1px,transparent 1.6px),
    radial-gradient(circle at 30% 20%,rgba(255,255,255,.66) 0 1.1px,transparent 1.7px),
    radial-gradient(circle at 43% 78%,rgba(255,255,255,.46) 0 1px,transparent 1.6px),
    radial-gradient(circle at 55% 30%,rgba(255,255,255,.70) 0 1.1px,transparent 1.7px),
    radial-gradient(circle at 67% 66%,rgba(255,255,255,.48) 0 1px,transparent 1.6px),
    radial-gradient(circle at 79% 22%,rgba(255,255,255,.68) 0 1.1px,transparent 1.7px),
    radial-gradient(circle at 91% 74%,rgba(255,255,255,.52) 0 1px,transparent 1.6px),
    linear-gradient(rgba(112,205,255,.032) 1px,transparent 1px),
    linear-gradient(90deg,rgba(112,205,255,.032) 1px,transparent 1px);
  background-size:auto,auto,auto,auto,auto,auto,auto,auto,42px 42px,42px 42px;
}
.wc-services-page-hero::after,
.wc-works-hero::after{
  content:"";
  position:absolute;
  inset:-80px;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(circle at 18% 32%,rgba(0,118,252,.18),transparent 26%),
    radial-gradient(circle at 82% 68%,rgba(2,185,253,.16),transparent 28%);
  filter:blur(18px);
}
.wc-services-page-hero > .wc-container,
.wc-works-hero > .wc-container{
  position:relative;
  z-index:2;
}
.wc-services-page-hero h1,
.wc-works-hero h1{
  color:#fff !important;
  text-shadow:0 8px 34px rgba(0,118,252,.16) !important;
}
.wc-services-page-hero p,
.wc-works-hero p{
  color:rgba(231,242,252,.82) !important;
}
.wc-services-page-hero .wc-breadcrumb,
.wc-works-hero .wc-breadcrumb{
  color:rgba(222,237,250,.68) !important;
}
.wc-services-page-hero .wc-breadcrumb a,
.wc-works-hero .wc-breadcrumb a{
  color:#fff !important;
}
.wc-services-page-hero .wc-breadcrumb a:hover,
.wc-works-hero .wc-breadcrumb a:hover{
  color:#63d7ff !important;
}
.wc-services-page-hero .wc-breadcrumb span,
.wc-works-hero .wc-breadcrumb span{
  color:rgba(222,237,250,.68) !important;
}

@media(max-width:720px){
  .wc-project-modal h2{
    min-height:44px !important;
    margin-right:62px !important;
    font-size:27px !important;
  }
  .wc-project-modal-close{
    top:20px !important;
    right:16px !important;
    width:42px !important;
    height:42px !important;
  }
  .wc-modal-service{font-size:14px !important;}
}

/* =========================================================
   WebCraft v73 — global polish, mobile optimization, blog,
   admin-driven works, contacts, footer, header and SEO UI.
   ========================================================= */
:root{
  --wc-phone-blue:#0d8cff;
}
body.webcraft-site{overflow-x:clip!important}
.wc-page{overflow:visible!important}
.wc-header{
  position:sticky!important;
  top:0!important;
  z-index:99999!important;
  width:100%!important;
  isolation:isolate;
}
.wc-nav{gap:18px!important}
.wc-menu{gap:25px!important;align-items:center}
.wc-menu>a{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,Arial,sans-serif;font-weight:500!important;letter-spacing:-.01em}
.wc-header-phone{
  display:inline-flex;align-items:center;gap:8px;white-space:nowrap;
  color:#0D1F39!important;font-size:14px;font-weight:600;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,Arial,sans-serif;
  transition:.2s ease;
}
.wc-header-phone svg,.wc-header-phone-mobile svg,.wc-mobile-menu-phone svg{width:19px;height:19px;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.wc-header-phone:hover{color:#1677e8!important}
.wc-header-phone-mobile{display:none}
.wc-mobile-menu-phone{display:none!important}

/* Modal: exact title / close alignment and stronger typography. */
.wc-project-modal-dialog{padding:34px!important}
.wc-project-modal h2{
  min-height:46px!important;margin:0 74px 8px 0!important;display:flex!important;align-items:center!important;
  font-size:32px!important;line-height:1.1!important;font-weight:650!important;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Segoe UI",Roboto,Arial,sans-serif!important;
}
.wc-project-modal-close{
  top:34px!important;right:24px!important;width:46px!important;height:46px!important;
  display:grid!important;place-items:center!important;padding:0!important;line-height:0!important;
  background:#f5f9fd!important;border:1px solid #dce9f7!important;border-radius:50%!important;
  color:#0D1F39!important;box-shadow:0 7px 22px rgba(20,56,96,.07)!important;
}
.wc-project-modal-close svg{width:19px!important;height:19px!important;display:block!important;stroke:currentColor!important;stroke-width:2!important;stroke-linecap:round!important;stroke-linejoin:round!important}
.wc-project-modal-close:hover{color:#1677e8!important;background:#fff!important;border-color:#c9e1fb!important;transform:none!important}
.wc-project-modal p{font-size:15.5px!important;line-height:1.65!important;margin-bottom:21px!important}
.wc-modal-service{font-size:16px!important;font-weight:500!important;line-height:1.4!important;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,Arial,sans-serif!important}
.wc-lead-form label>span{font-size:14.5px!important;font-weight:650!important;line-height:1.3!important}
.wc-inline-lead-form label>span{font-size:14.5px!important}

/* CTA: replace W with a lightly tilted real site logo. */
.wc-cta-logo-art{display:grid!important;place-items:center!important;min-height:220px}
.wc-cta-logo-art:before,.wc-cta-logo-art:after{opacity:.7}
.wc-cta-logo-card{
  position:relative!important;z-index:3!important;display:grid!important;place-items:center!important;
  width:min(270px,78%)!important;min-height:145px!important;padding:28px!important;border-radius:28px!important;
  background:rgba(255,255,255,.68)!important;border:1px solid rgba(255,255,255,.76)!important;
  box-shadow:0 26px 60px rgba(28,126,222,.13)!important;backdrop-filter:blur(8px);
  transform:rotate(-6deg)!important;
}
.wc-cta-logo-card img{width:min(205px,90%)!important;height:auto!important;display:block!important;opacity:.84!important;filter:saturate(.92) brightness(1.06)!important}

/* Project cards: clean media and icon. */
.wc-project-img{padding:0!important;background-position:center!important;background-size:cover!important}
.wc-project-img::after{display:none!important}
.wc-project-img.has-image img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .45s ease}
.wc-project:hover .wc-project-img.has-image img{transform:scale(1.025)}
.wc-project-info{align-items:center!important}
.wc-project-copy h3{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",Roboto,Arial,sans-serif!important;font-weight:650!important}
.wc-project-external{border-radius:13px!important}
.wc-project-external svg{stroke-width:1.8!important}

/* Blog cards and article pages. */
.wc-articles-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.wc-article-card{overflow:hidden;border:1px solid #e4edf7;border-radius:22px;background:#fff;box-shadow:0 12px 34px rgba(24,61,103,.055);transition:.25s ease}
.wc-article-card:hover{transform:translateY(-4px);box-shadow:0 18px 46px rgba(24,61,103,.09);border-color:#d6e7fa}
.wc-article-media{display:block;height:205px;background:linear-gradient(135deg,#eaf5ff,#d8efff);overflow:hidden}
.wc-article-media img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .4s ease}
.wc-article-card:hover .wc-article-media img{transform:scale(1.025)}
.wc-article-body{padding:22px}
.wc-article-body time{display:block;color:#8a9aab;font-size:12px;margin-bottom:9px}
.wc-article-body h3{margin:0 0 10px;font-size:21px;line-height:1.28;letter-spacing:-.025em;font-weight:650}
.wc-article-body p{margin:0 0 18px;color:#64768a;font-size:14px;line-height:1.65}
.wc-article-read{display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border:1px solid rgba(59,130,246,.22);border-radius:11px;background:#fff;color:#0D1F39!important;font-size:14px;font-weight:600;transition:.2s ease}
.wc-article-read:hover{color:#fff!important;border-color:transparent;background:linear-gradient(135deg,#3b82f6,#06b6d4)}
.wc-blog-hero,.wc-article-hero{padding:78px 0 62px}
.wc-inner-dark-hero{position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(circle at 12% 16%,rgba(0,118,252,.24),transparent 28%),radial-gradient(circle at 88% 22%,rgba(2,185,253,.20),transparent 30%),linear-gradient(135deg,#040b13 0%,#071522 35%,#0a2439 68%,#05101a 100%)}
.wc-inner-dark-hero:before{content:"";position:absolute;inset:0;z-index:-1;opacity:.52;pointer-events:none;background:radial-gradient(circle at 8% 24%,rgba(255,255,255,.72) 0 1px,transparent 1.6px),radial-gradient(circle at 23% 72%,rgba(255,255,255,.46) 0 1px,transparent 1.6px),radial-gradient(circle at 42% 18%,rgba(255,255,255,.58) 0 1px,transparent 1.6px),radial-gradient(circle at 64% 66%,rgba(255,255,255,.48) 0 1px,transparent 1.6px),radial-gradient(circle at 84% 30%,rgba(255,255,255,.62) 0 1px,transparent 1.6px)}
.wc-inner-dark-hero h1{margin:12px 0 14px;color:#fff;font-size:clamp(38px,5vw,64px);letter-spacing:-.045em}
.wc-inner-dark-hero p,.wc-inner-dark-hero .wc-breadcrumb,.wc-inner-dark-hero .wc-breadcrumb a,.wc-inner-dark-hero .wc-article-meta{color:rgba(235,245,255,.78)!important}
.wc-article-meta{display:flex;gap:16px;font-size:13px}
.wc-article-container{max-width:920px!important}
.wc-article-cover{margin:0 0 34px;border-radius:24px;overflow:hidden}
.wc-article-cover img{width:100%;height:auto;display:block}
.wc-prose{font-size:17px;line-height:1.8;color:#263a50}
.wc-prose h2{font-size:34px;line-height:1.2;letter-spacing:-.03em;margin:44px 0 16px;color:#0D1F39}
.wc-prose h3{font-size:25px;line-height:1.3;margin:34px 0 12px;color:#0D1F39}
.wc-prose img{max-width:100%;height:auto;border-radius:18px}
.wc-prose a{color:#1677e8;text-decoration:underline;text-underline-offset:3px}
.wc-pagination{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:42px}
.wc-pagination .page-numbers{min-width:42px;height:42px;padding:0 12px;display:grid;place-items:center;border:1px solid #dce8f5;border-radius:11px;background:#fff;color:#0D1F39}
.wc-pagination .current,.wc-pagination a:hover{border-color:transparent;background:linear-gradient(135deg,#3b82f6,#06b6d4);color:#fff}
.wc-empty-state{padding:60px 24px;text-align:center;border:1px solid #e4edf7;border-radius:22px;background:#fbfdff}

/* Footer — 3 clean columns. */
.wc-footer{padding:58px 0 22px!important;background:#fff!important}
.wc-footer-grid{display:grid!important;grid-template-columns:1.05fr 1.45fr .9fr!important;gap:64px!important;align-items:start!important}
.wc-footer-grid>div{display:block!important}
.wc-logo-footer img{width:108px!important;height:auto!important}
.wc-footer-brand p{max-width:310px;margin:18px 0 0!important;font-size:15px!important;line-height:1.65!important;color:#65768a!important}
.wc-footer-grid b{display:block;margin:0 0 17px!important;font-size:15px;color:#0D1F39}
.wc-footer-service-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px 26px}
.wc-footer-service-links a,.wc-footer-contacts>a{font-size:14px!important;color:#65768a!important;line-height:1.55!important;transition:.2s ease}
.wc-footer-service-links a:hover,.wc-footer-contacts>a:hover{color:#1677e8!important}
.wc-footer-contacts{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:9px!important}
.wc-footer-phone{font-weight:650!important;color:#0D1F39!important}
.wc-footer-messengers{margin-top:9px}
.wc-copy{display:flex;align-items:center;justify-content:flex-start;margin-top:42px!important;padding-top:20px!important;font-size:13px!important}
.wc-copy a{color:#0D1F39!important;font-weight:600!important}

/* Messenger / call buttons. */
.wc-contact-buttons{display:flex;gap:9px;align-items:center}
.wc-contact-btn{width:42px;height:42px;display:grid;place-items:center;border-radius:50%;color:#fff!important;box-shadow:0 8px 20px rgba(18,54,95,.13);transition:transform .2s ease,box-shadow .2s ease}
.wc-contact-btn:hover{transform:translateY(-2px);box-shadow:0 12px 25px rgba(18,54,95,.2)}
.wc-contact-btn svg{width:21px;height:21px;display:block}
.wc-contact-phone svg{fill:none!important;stroke:currentColor!important;stroke-width:1.9!important;stroke-linecap:round;stroke-linejoin:round}
.wc-contact-whatsapp{background:#25D366!important}
.wc-contact-viber{background:#7360F2!important}
.wc-contact-phone{background:linear-gradient(135deg,#3b82f6,#06b6d4)!important}
.wc-floating-contacts{position:fixed;right:24px;bottom:110px;z-index:9990}
.wc-floating-contact-buttons{flex-direction:column}
.wc-floating-contact-buttons .wc-contact-btn{width:50px;height:50px}
.wc-floating-contact-buttons .wc-contact-btn svg{width:24px;height:24px}

/* Astra scroll button: keep current arrow, center it precisely. */
#ast-scroll-top,.ast-scroll-top-icon{
  display:flex!important;align-items:center!important;justify-content:center!important;padding:0!important;line-height:1!important;
}
#ast-scroll-top>*,.ast-scroll-top-icon>*{margin:auto!important;position:static!important;transform:none!important;line-height:1!important}
#ast-scroll-top svg,.ast-scroll-top-icon svg{display:block!important;margin:auto!important}

/* ---------------------------------------------------------
   Mobile / tablet optimization across every template.
   --------------------------------------------------------- */
@media(max-width:1240px){
  .wc-header-phone span{display:none}
  .wc-header-phone{width:42px;height:42px;border:1px solid #dce8f5;border-radius:12px;justify-content:center;background:#fff}
  .wc-nav{gap:12px!important}
  .wc-menu{gap:18px!important}
  .wc-nav-cta{padding-inline:16px!important}
}
@media(max-width:960px){
  .wc-container,.wc-page .wc-container{width:calc(100% - 36px)!important;max-width:none!important}
  .wc-header{height:70px!important;min-height:70px!important;background:rgba(255,255,255,.94)!important;backdrop-filter:blur(18px)!important}
  .wc-nav{height:70px!important;position:relative!important;gap:9px!important}
  .wc-logo{margin-right:auto!important}
  .wc-logo img{width:108px!important}
  .wc-header-phone{display:none!important}
  .wc-header-phone-mobile{display:grid!important;place-items:center!important;width:40px;height:40px;border-radius:12px;background:#f3f8ff;color:#1677e8!important;border:1px solid #dbeafb}
  .wc-header-phone-mobile svg{width:19px;height:19px}
  .wc-nav-cta{display:none!important}
  .wc-lang-switch{order:initial!important;margin:0!important;min-height:40px!important;padding:3px!important}
  .wc-lang-link{min-width:37px!important;height:32px!important;font-size:12px!important}
  .wc-menu-toggle{order:initial!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;width:42px!important;height:42px!important;margin:0!important;padding:0!important;border-radius:12px!important;background:linear-gradient(135deg,#0c76dd,#06aee9)!important;border:0!important;box-shadow:0 8px 18px rgba(19,133,227,.16)!important}
  .wc-menu-toggle span{width:18px!important;height:2px!important;margin:2.5px 0!important;background:#fff!important;transition:.2s ease!important}
  .wc-menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .wc-menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
  .wc-menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .wc-menu{display:none!important;position:absolute!important;top:calc(100% + 10px)!important;left:0!important;right:0!important;z-index:1000!important;padding:10px!important;border:1px solid rgba(89,181,255,.18)!important;border-radius:20px!important;background:linear-gradient(145deg,rgba(4,13,24,.98),rgba(7,34,55,.98))!important;box-shadow:0 24px 60px rgba(2,13,27,.28)!important;backdrop-filter:blur(18px)!important;overflow:hidden!important}
  .wc-menu.is-open{display:flex!important;flex-direction:column!important;gap:0!important}
  .wc-menu>a{display:flex!important;align-items:center!important;min-height:49px!important;width:100%!important;padding:0 15px!important;border-radius:12px!important;border-bottom:1px solid rgba(255,255,255,.07)!important;color:#fff!important;font-size:14px!important;font-weight:500!important;opacity:1!important}
  .wc-menu>a:last-child{border-bottom:0!important}
  .wc-menu>a:hover,.wc-menu>a:focus{background:rgba(47,165,255,.11)!important;color:#63d7ff!important}
  .wc-mobile-menu-phone{display:flex!important;color:#64d7ff!important;gap:9px!important;border-bottom:0!important;margin-top:4px!important}
  .wc-mobile-menu-phone svg{width:18px;height:18px}
  .wc-hero-centered{min-height:600px!important;padding:88px 0 95px!important}
  .wc-hero-centered .wc-hero-copy{max-width:760px!important}
  .wc-hero-centered .wc-hero-copy h1{font-size:clamp(42px,8vw,58px)!important}
  .wc-services{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .wc-services-page-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .wc-advantages-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .wc-projects,.wc-projects-page{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .wc-articles-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .wc-footer-grid{grid-template-columns:1fr 1.2fr!important;gap:38px!important}
  .wc-footer-contacts{grid-column:1/-1!important;border-top:1px solid #e8eef5;padding-top:24px!important}
  .wc-floating-contacts{right:18px;bottom:100px}
}
@media(max-width:720px){
  body.webcraft-site{font-size:16px}
  .wc-container,.wc-page .wc-container{width:calc(100% - 30px)!important}
  .wc-header,.wc-nav{height:66px!important;min-height:66px!important}
  .wc-logo img{width:96px!important}
  .wc-header-phone-mobile{width:38px;height:38px;border-radius:11px}
  .wc-lang-switch{min-height:38px!important}
  .wc-lang-link{min-width:34px!important;height:30px!important}
  .wc-menu-toggle{width:39px!important;height:39px!important;border-radius:11px!important}
  .wc-menu{top:calc(100% + 8px)!important;border-radius:18px!important;padding:8px!important}
  .wc-menu>a{min-height:47px!important;padding:0 14px!important;font-size:14px!important}
  .wc-section{padding:58px 0!important}
  .wc-section-head{align-items:center!important;gap:12px!important;margin-bottom:28px!important}
  .wc-section-head h2,.wc-advantages-head h2,.wc-cta h2{font-size:34px!important;line-height:1.08!important}
  .wc-section-head>.wc-btn,.wc-section-head>a{flex:0 0 auto}
  .wc-hero-centered{min-height:535px!important;padding:76px 0 82px!important}
  .wc-hero-centered .wc-hero-copy h1{font-size:40px!important;line-height:1.04!important;margin-bottom:20px!important}
  .wc-hero-centered .wc-hero-copy>p{font-size:15.5px!important;line-height:1.62!important;padding:0 3px!important}
  .wc-hero-centered-actions{gap:10px!important;margin-top:27px!important}
  .wc-hero-centered-actions .wc-btn{min-height:48px!important;font-size:15px!important}
  .wc-brand-float{transform:scale(.82)}
  .wc-services,.wc-services-page-grid,.wc-advantages-grid,.wc-projects,.wc-projects-page,.wc-articles-grid{grid-template-columns:1fr!important}
  .wc-service-card,.wc-services-page-card,.wc-advantage-card{border-radius:19px!important}
  .wc-services-page-hero,.wc-works-hero,.wc-blog-hero,.wc-article-hero{padding:54px 0 44px!important}
  .wc-services-page-hero h1,.wc-works-hero h1,.wc-inner-dark-hero h1{font-size:40px!important;line-height:1.08!important}
  .wc-services-page-hero p,.wc-works-hero p,.wc-inner-dark-hero p{font-size:15px!important;line-height:1.65!important}
  .wc-breadcrumb{font-size:12px!important;gap:8px!important;flex-wrap:wrap}
  .wc-project-img{height:225px!important}
  .wc-project-info{padding-top:12px!important}
  .wc-project-copy h3{font-size:18px!important}
  .wc-project-external{width:43px!important;height:43px!important;min-width:43px!important}
  .wc-cta-box,.wc-cta-form-box{grid-template-columns:1fr!important;padding:28px 22px!important;border-radius:24px!important}
  .wc-cta-logo-art{min-height:160px!important;margin-top:8px!important;display:grid!important}
  .wc-cta-logo-card{width:min(235px,85%)!important;min-height:120px!important;padding:22px!important}
  .wc-cta-logo-card img{width:min(175px,90%)!important}
  .wc-inline-lead-form{grid-template-columns:1fr!important;gap:12px!important}
  .wc-inline-lead-form label>span,.wc-lead-form label>span{font-size:15px!important}
  .wc-project-modal{padding:14px!important}
  .wc-project-modal-dialog{width:100%!important;max-height:calc(100vh - 28px)!important;overflow:auto!important;padding:24px 20px!important;border-radius:22px!important}
  .wc-project-modal h2{min-height:40px!important;margin:0 56px 8px 0!important;font-size:27px!important;line-height:1.12!important}
  .wc-project-modal-close{top:24px!important;right:20px!important;width:40px!important;height:40px!important}
  .wc-project-modal-close svg{width:17px!important;height:17px!important}
  .wc-project-modal p{font-size:15px!important;line-height:1.6!important}
  .wc-modal-service{font-size:15px!important}
  .wc-article-media{height:210px}
  .wc-article-body{padding:20px}
  .wc-prose{font-size:16px;line-height:1.75}
  .wc-prose h2{font-size:29px;margin-top:36px}
  .wc-prose h3{font-size:23px}
  .wc-article-meta{flex-direction:column;gap:5px}
  .wc-footer{padding:44px 0 20px!important}
  .wc-footer-grid{grid-template-columns:1fr!important;gap:31px!important}
  .wc-footer-contacts{grid-column:auto!important;border-top:1px solid #e8eef5;padding-top:24px!important}
  .wc-footer-service-links{grid-template-columns:1fr 1fr;gap:10px 18px}
  .wc-footer-brand p{font-size:14.5px!important}
  .wc-copy{margin-top:30px!important}
  .wc-floating-contacts{right:15px;bottom:90px}
  .wc-floating-contact-buttons .wc-contact-btn{width:46px;height:46px}
  .wc-floating-contact-buttons .wc-contact-btn svg{width:22px;height:22px}
  #ast-scroll-top,.ast-scroll-top-icon{width:54px!important;height:54px!important;min-width:54px!important;min-height:54px!important}
}
@media(max-width:430px){
  .wc-container,.wc-page .wc-container{width:calc(100% - 24px)!important}
  .wc-logo img{width:90px!important}
  .wc-header-phone-mobile{width:36px;height:36px}
  .wc-lang-link{min-width:31px!important;font-size:11px!important}
  .wc-menu-toggle{width:37px!important;height:37px!important}
  .wc-hero-centered .wc-hero-copy h1{font-size:36px!important}
  .wc-section-head h2,.wc-advantages-head h2,.wc-cta h2{font-size:31px!important}
  .wc-section-head{flex-wrap:wrap!important}
  .wc-section-head .wc-btn,.wc-section-head>a{min-height:40px!important;font-size:14px!important;padding:0 14px!important}
  .wc-service-card{padding:23px!important}
  .wc-service-price{top:24px!important;right:22px!important}
  .wc-footer-service-links{grid-template-columns:1fr}
  .wc-floating-contacts{right:12px;bottom:84px}
  .wc-floating-contact-buttons .wc-contact-btn{width:43px;height:43px}
}


/* =========================================================
   WebCraft v75 — original WhatsApp / Viber brand artwork.
   No hand-drawn messenger glyphs.
   ========================================================= */
.wc-contact-btn .wc-brand-messenger-icon{
  display:block !important;
  object-fit:contain !important;
  pointer-events:none !important;
}
.wc-contact-whatsapp{
  background:#fff !important;
  overflow:hidden !important;
  padding:0 !important;
}
.wc-contact-whatsapp .wc-brand-messenger-whatsapp{
  width:100% !important;
  height:100% !important;
}
.wc-contact-viber{
  background:#7360F2 !important;
  overflow:hidden !important;
}
.wc-contact-viber .wc-brand-messenger-viber{
  width:62% !important;
  height:62% !important;
}

/* =========================================================
   WebCraft v76 — light mobile menu, full responsive polish,
   paired articles, article page cleanup and floating contacts.
   ========================================================= */

/* Footer contact rows: phone above e-mail, both clearly clickable. */
.wc-footer-contacts > a{
  display:flex !important;
  align-items:center !important;
  width:max-content !important;
  max-width:100% !important;
  min-height:26px !important;
  text-decoration:none !important;
}
.wc-footer-contacts .wc-footer-phone{
  order:1;
  font-size:15px !important;
  font-weight:600 !important;
  color:#0D1F39 !important;
}
.wc-footer-contacts > a[href^="mailto:"]{
  order:2;
  font-size:14px !important;
  color:#65768a !important;
}
.wc-footer-contacts .wc-footer-messengers{order:3;margin-top:10px !important;}

/* Floating contact group: left side, vertically centered. */
.wc-floating-contacts{
  position:fixed !important;
  left:20px !important;
  right:auto !important;
  top:50% !important;
  bottom:auto !important;
  transform:translateY(-50%) !important;
  z-index:9990 !important;
}
.wc-floating-contact-buttons{
  display:flex !important;
  flex-direction:column !important;
  gap:10px !important;
}

/* Astra scroll-to-top — keep Astra's arrow, but make it larger and truly centered. */
#ast-scroll-top,
.ast-scroll-top-icon{
  display:grid !important;
  place-items:center !important;
  padding:0 !important;
  line-height:0 !important;
}
#ast-scroll-top .ast-icon,
.ast-scroll-top-icon .ast-icon,
#ast-scroll-top > span,
.ast-scroll-top-icon > span{
  width:100% !important;
  height:100% !important;
  display:grid !important;
  place-items:center !important;
  margin:0 !important;
  padding:0 !important;
  line-height:0 !important;
}
#ast-scroll-top svg,
.ast-scroll-top-icon svg{
  width:24px !important;
  height:24px !important;
  margin:0 !important;
  position:static !important;
  transform:translateY(1px) !important;
}

/* Single article: category is the quiet label above the title, no date in hero. */
.wc-article-category{
  display:inline-flex;
  align-items:center;
  min-height:32px;
  margin-top:22px;
  padding:0 13px;
  border:1px solid rgba(113,210,255,.24);
  border-radius:999px;
  background:rgba(68,180,255,.10);
  color:#8de5ff !important;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,Arial,sans-serif;
  font-size:13px;
  font-weight:600;
  letter-spacing:-.01em;
}
.wc-single-article .wc-article-hero h1{margin-top:14px !important;}
.wc-single-article .wc-article-meta{display:none !important;}

/* Smaller related-article cards below an article. */
.wc-related-articles{padding-top:56px !important;}
.wc-related-articles .wc-articles-grid{gap:18px !important;}
.wc-related-articles .wc-article-card{border-radius:18px !important;box-shadow:0 9px 26px rgba(24,61,103,.045) !important;}
.wc-related-articles .wc-article-media{height:150px !important;}
.wc-related-articles .wc-article-body{padding:17px 18px 18px !important;}
.wc-related-articles .wc-article-body time{font-size:11px !important;margin-bottom:7px !important;}
.wc-related-articles .wc-article-body h3{font-size:18px !important;margin-bottom:7px !important;}
.wc-related-articles .wc-article-body p{font-size:13px !important;line-height:1.55 !important;margin-bottom:14px !important;}
.wc-related-articles .wc-article-read{min-height:36px !important;padding:0 13px !important;font-size:13px !important;}
.wc-related-articles .wc-related-all{
  min-height:44px !important;
  padding:0 20px !important;
  border:1px solid rgba(59,130,246,.24) !important;
  border-radius:12px !important;
  background:#fff !important;
  color:#0D1F39 !important;
  box-shadow:0 7px 18px rgba(31,77,126,.055) !important;
  font-size:16px !important;
  font-weight:600 !important;
}
.wc-related-articles .wc-related-all:hover{
  color:#fff !important;
  border-color:transparent !important;
  background:linear-gradient(135deg,#3b82f6,#06b6d4) !important;
  box-shadow:0 11px 24px rgba(59,130,246,.20) !important;
}

/* Light premium mobile menu — intentionally distinct from the dark hero. */
@media(max-width:960px){
  .wc-menu{
    top:calc(100% + 9px) !important;
    left:0 !important;
    right:0 !important;
    padding:8px !important;
    border:1px solid rgba(190,216,243,.86) !important;
    border-radius:20px !important;
    background:
      radial-gradient(circle at 92% 4%,rgba(2,185,253,.10),transparent 34%),
      linear-gradient(145deg,rgba(255,255,255,.99),rgba(244,249,255,.99)) !important;
    box-shadow:0 22px 55px rgba(17,48,83,.16) !important;
    backdrop-filter:blur(20px) saturate(1.08) !important;
  }
  .wc-menu>a{
    min-height:48px !important;
    padding:0 15px !important;
    border:0 !important;
    border-bottom:1px solid #e8f0f8 !important;
    border-radius:11px !important;
    color:#152b45 !important;
    font-size:14px !important;
    font-weight:500 !important;
    opacity:1 !important;
    transition:background .18s ease,color .18s ease,transform .18s ease !important;
  }
  .wc-menu>a:last-child{border-bottom:0 !important;}
  .wc-menu>a:hover,.wc-menu>a:focus{
    background:linear-gradient(90deg,rgba(59,130,246,.08),rgba(6,182,212,.07)) !important;
    color:#087bd9 !important;
    transform:translateX(2px);
  }
  .wc-mobile-menu-phone{
    margin-top:6px !important;
    border:0 !important;
    background:linear-gradient(135deg,#eef7ff,#f5fbff) !important;
    color:#087bd9 !important;
    font-weight:600 !important;
  }
  .wc-mobile-menu-phone:hover,.wc-mobile-menu-phone:focus{background:#eaf6ff !important;color:#006fc9 !important;}

  /* Tablet page grids and article content. */
  .wc-article-container{max-width:820px !important;}
  .wc-related-articles .wc-article-media{height:145px !important;}
  .wc-footer-grid{align-items:start !important;}
  .wc-floating-contacts{left:14px !important;right:auto !important;top:50% !important;bottom:auto !important;}
}

@media(max-width:720px){
  html,body{max-width:100%;overflow-x:hidden;}
  .wc-header{box-shadow:0 1px 0 rgba(223,234,246,.9) !important;}
  .wc-menu{left:-2px !important;right:-2px !important;border-radius:17px !important;padding:7px !important;}
  .wc-menu>a{min-height:46px !important;padding:0 13px !important;}

  /* All page heroes remain readable and compact. */
  .wc-services-page-hero,.wc-works-hero,.wc-blog-hero,.wc-article-hero{padding:48px 0 40px !important;}
  .wc-inner-dark-hero h1,.wc-services-page-hero h1,.wc-works-hero h1{font-size:clamp(34px,10vw,40px) !important;overflow-wrap:anywhere;}
  .wc-inner-dark-hero p,.wc-services-page-hero p,.wc-works-hero p{font-size:15px !important;line-height:1.6 !important;}

  /* Service, work, blog and article layouts. */
  .wc-services-page-card,.wc-service-card,.wc-advantage-card,.wc-article-card{min-width:0 !important;}
  .wc-project-img{height:210px !important;}
  .wc-article-media{height:190px !important;}
  .wc-article-container{width:calc(100% - 30px) !important;}
  .wc-article-cover{margin-bottom:25px !important;border-radius:18px !important;}
  .wc-prose{font-size:16px !important;line-height:1.72 !important;overflow-wrap:anywhere;}
  .wc-prose h2{font-size:27px !important;margin:34px 0 14px !important;}
  .wc-prose h3{font-size:22px !important;margin:28px 0 11px !important;}
  .wc-prose table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;}
  .wc-prose iframe,.wc-prose video{max-width:100% !important;}
  .wc-article-category{margin-top:18px;min-height:30px;font-size:12.5px;}

  .wc-related-articles{padding-top:44px !important;}
  .wc-related-articles .wc-section-head{align-items:center !important;}
  .wc-related-articles .wc-article-media{height:165px !important;}
  .wc-related-articles .wc-article-body{padding:16px !important;}
  .wc-related-articles .wc-related-all{min-height:40px !important;padding:0 15px !important;font-size:14px !important;}

  /* Forms and modal keep comfortable tap targets. */
  .wc-lead-form input{width:100% !important;min-width:0 !important;}
  .wc-project-modal-dialog{overscroll-behavior:contain;}

  /* Footer stacks cleanly; contact links never merge into one line. */
  .wc-footer-grid{grid-template-columns:1fr !important;gap:27px !important;}
  .wc-footer-service-links{grid-template-columns:1fr 1fr !important;}
  .wc-footer-contacts{width:100% !important;}
  .wc-footer-contacts > a{width:max-content !important;max-width:100% !important;}
  .wc-copy{line-height:1.5 !important;}

  /* Floating contact buttons on the left, vertically centered, smaller on phones. */
  .wc-floating-contacts{left:9px !important;right:auto !important;top:50% !important;bottom:auto !important;}
  .wc-floating-contact-buttons{gap:8px !important;}
  .wc-floating-contact-buttons .wc-contact-btn{width:42px !important;height:42px !important;}
  .wc-floating-contact-buttons .wc-contact-btn svg{width:20px !important;height:20px !important;}

  #ast-scroll-top,.ast-scroll-top-icon{width:56px !important;height:56px !important;min-width:56px !important;min-height:56px !important;}
  #ast-scroll-top svg,.ast-scroll-top-icon svg{width:24px !important;height:24px !important;}
}

@media(max-width:430px){
  .wc-menu{top:calc(100% + 7px) !important;}
  .wc-menu>a{font-size:13.5px !important;min-height:44px !important;}
  .wc-footer-service-links{grid-template-columns:1fr !important;}
  .wc-related-articles .wc-section-head{align-items:flex-start !important;}
  .wc-related-articles .wc-related-all{width:auto !important;}
  .wc-floating-contacts{left:7px !important;}
  .wc-floating-contact-buttons .wc-contact-btn{width:39px !important;height:39px !important;}
}


/* =========================================================
   WebCraft v77 — mobile hero cleanup + collapsible chat widget.
   ========================================================= */
/* On phones the hero keeps only the content and star video. */
@media(max-width:720px){
  .wc-hero-centered .wc-hero-brands,
  .wc-hero-centered .wc-brand-float{
    display:none !important;
  }
}

/* Floating chat lives on the right above Astra's scroll-to-top button. */
.wc-floating-contacts.wc-chat-widget{
  position:fixed !important;
  right:20px !important;
  left:auto !important;
  bottom:96px !important;
  top:auto !important;
  transform:none !important;
  z-index:9995 !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  gap:10px !important;
}
.wc-chat-toggle{
  width:58px;
  height:58px;
  min-width:58px;
  min-height:58px;
  padding:0;
  border:0;
  border-radius:50%;
  display:grid;
  place-items:center;
  cursor:pointer;
  color:#fff;
  background:linear-gradient(135deg,#3b82f6,#06b6d4);
  box-shadow:0 12px 28px rgba(59,130,246,.30);
  transition:transform .22s ease,box-shadow .22s ease,background .22s ease;
}
.wc-chat-toggle:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 34px rgba(59,130,246,.38);
}
.wc-chat-toggle svg{
  width:27px;
  height:27px;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.wc-chat-widget.is-open .wc-chat-toggle{
  background:linear-gradient(135deg,#0d1f39,#1f486e);
}
.wc-floating-contacts .wc-floating-contact-buttons{
  display:flex !important;
  flex-direction:column !important;
  gap:9px !important;
  align-items:center !important;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(14px) scale(.92);
  transform-origin:bottom center;
  transition:opacity .2s ease,transform .2s ease,visibility .2s ease;
}
.wc-floating-contacts.is-open .wc-floating-contact-buttons{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:none;
}
.wc-floating-contacts .wc-floating-contact-items{
  display:flex !important;
  flex-direction:column !important;
  gap:9px !important;
}
.wc-floating-contacts .wc-contact-btn{
  width:48px !important;
  height:48px !important;
  min-width:48px !important;
  min-height:48px !important;
  border-radius:50% !important;
  box-shadow:0 10px 24px rgba(20,51,86,.16) !important;
  transition:transform .18s ease,box-shadow .18s ease !important;
}
.wc-floating-contacts .wc-contact-btn:hover{
  transform:translateY(-2px) scale(1.03) !important;
  box-shadow:0 14px 28px rgba(20,51,86,.22) !important;
}

@media(max-width:720px){
  .wc-floating-contacts.wc-chat-widget{
    right:12px !important;
    left:auto !important;
    bottom:88px !important;
    top:auto !important;
    transform:none !important;
  }
  .wc-chat-toggle{
    width:54px;
    height:54px;
    min-width:54px;
    min-height:54px;
  }
  .wc-chat-toggle svg{width:25px;height:25px;}
  .wc-floating-contacts .wc-contact-btn{
    width:44px !important;
    height:44px !important;
    min-width:44px !important;
    min-height:44px !important;
  }
}
@media(max-width:430px){
  .wc-floating-contacts.wc-chat-widget{right:10px !important;bottom:84px !important;}
}

/* =========================================================
   WebCraft v78 — single article cleanup requested:
   no date in hero, compact related cards, clear category badge,
   branded All Articles button.
   ========================================================= */
.wc-single-article .wc-article-meta,
.wc-single-article .wc-article-hero time,
.wc-single-article .wc-article-hero .entry-date,
.wc-single-article .wc-article-hero .posted-on{
  display:none !important;
}

/* Category sits between breadcrumbs and H1 as a subtle premium pill. */
.wc-single-article .wc-article-category{
  display:inline-flex !important;
  align-items:center !important;
  min-height:30px !important;
  margin:20px 0 0 !important;
  padding:0 12px !important;
  border:1px solid rgba(125,220,255,.24) !important;
  border-radius:999px !important;
  background:rgba(68,180,255,.09) !important;
  color:#9beaff !important;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,Arial,sans-serif !important;
  font-size:12.5px !important;
  font-weight:550 !important;
  letter-spacing:-.01em !important;
}
.wc-single-article .wc-article-hero h1{
  margin-top:13px !important;
}

/* Make the related articles noticeably smaller and calmer. */
.wc-related-articles{
  padding-top:48px !important;
}
.wc-related-articles .wc-articles-grid{
  gap:15px !important;
}
.wc-related-articles .wc-article-card{
  border-radius:16px !important;
  box-shadow:0 7px 22px rgba(24,61,103,.04) !important;
}
.wc-related-articles .wc-article-media{
  height:124px !important;
}
.wc-related-articles .wc-article-body{
  padding:14px 15px 15px !important;
}
.wc-related-articles .wc-article-body time{
  font-size:10.5px !important;
  margin-bottom:6px !important;
}
.wc-related-articles .wc-article-body h3{
  font-size:16.5px !important;
  line-height:1.28 !important;
  margin:0 0 10px !important;
}
.wc-related-articles .wc-article-body p{
  display:none !important;
}
.wc-related-articles .wc-article-read{
  min-height:34px !important;
  padding:0 12px !important;
  border-radius:10px !important;
  font-size:12.5px !important;
}

/* Same branded language as “Все услуги”. */
.wc-related-articles .wc-related-all{
  min-height:44px !important;
  padding:0 20px !important;
  border:1px solid rgba(59,130,246,.24) !important;
  border-radius:12px !important;
  background:#fff !important;
  color:#0D1F39 !important;
  box-shadow:0 7px 18px rgba(31,77,126,.055) !important;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,Arial,sans-serif !important;
  font-size:16px !important;
  font-weight:600 !important;
  letter-spacing:-.01em !important;
  transition:.22s ease !important;
}
.wc-related-articles .wc-related-all:hover{
  color:#fff !important;
  border-color:transparent !important;
  background:linear-gradient(135deg,#3b82f6,#06b6d4) !important;
  box-shadow:0 11px 24px rgba(59,130,246,.20) !important;
  transform:translateY(-2px) !important;
}

@media(max-width:720px){
  .wc-single-article .wc-article-category{
    margin-top:16px !important;
    min-height:29px !important;
    font-size:12px !important;
  }
  .wc-related-articles{
    padding-top:38px !important;
  }
  .wc-related-articles .wc-articles-grid{
    gap:13px !important;
  }
  .wc-related-articles .wc-article-media{
    height:128px !important;
  }
  .wc-related-articles .wc-article-body{
    padding:13px 14px 14px !important;
  }
  .wc-related-articles .wc-article-body h3{
    font-size:16px !important;
  }
  .wc-related-articles .wc-related-all{
    min-height:41px !important;
    padding:0 16px !important;
    font-size:14px !important;
  }
}

/* =========================================================
   WebCraft v79 — single article header + related cards cleanup
   ========================================================= */
/* In the article hero: title first, category directly below it. */
.wc-single-article .wc-article-hero h1{
  margin-bottom:14px !important;
}
.wc-single-article .wc-article-category-under-title{
  display:inline-flex !important;
  margin-top:0 !important;
  margin-bottom:0 !important;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Arial,sans-serif !important;
}
/* Dates are hidden only inside the "Другие статьи / Alte articole" block. */
.wc-related-articles .wc-article-card time,
.wc-related-articles .wc-article-body > time{
  display:none !important;
}
.wc-related-articles .wc-article-body h3{
  margin-top:0 !important;
}
@media(max-width:720px){
  .wc-single-article .wc-article-hero h1{margin-bottom:12px !important;}
}


/* =========================================================
   WebCraft v80 — floating buttons alignment + official WhatsApp
   + footer contact icons.
   ========================================================= */

/* Footer contact links: add elegant small icons and clean spacing. */
.wc-footer-contacts > a{
  gap:10px !important;
}
.wc-footer-contact-icon{
  width:18px;
  height:18px;
  min-width:18px;
  min-height:18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#4a6788;
  opacity:.92;
}
.wc-footer-contact-icon svg{
  width:18px;
  height:18px;
  display:block;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.wc-footer-phone span:last-child,
.wc-footer-email span:last-child{
  display:inline-block;
}
.wc-footer-email{
  color:#65768a !important;
}
.wc-footer-phone:hover,
.wc-footer-email:hover{
  color:var(--wc-blue) !important;
}
.wc-footer-phone:hover .wc-footer-contact-icon,
.wc-footer-email:hover .wc-footer-contact-icon{
  color:var(--wc-blue);
}

/* Use crisp brand icon sizing for WhatsApp in floating buttons + footer. */
.wc-contact-btn .wc-brand-messenger-icon{
  display:block;
  object-fit:contain;
}
.wc-contact-whatsapp .wc-brand-messenger-whatsapp{
  width:24px !important;
  height:24px !important;
}
.wc-footer-messengers .wc-contact-whatsapp .wc-brand-messenger-whatsapp,
.wc-floating-contact-items .wc-contact-whatsapp .wc-brand-messenger-whatsapp{
  width:23px !important;
  height:23px !important;
}

/* Make chat launcher and Astra back-to-top perfectly aligned and same size. */
.wc-floating-contacts.wc-chat-widget{
  right:18px !important;
  left:auto !important;
  bottom:92px !important;
  gap:12px !important;
  align-items:center !important;
}
.wc-chat-toggle,
#ast-scroll-top,
.ast-scroll-top-icon{
  width:58px !important;
  height:58px !important;
  min-width:58px !important;
  min-height:58px !important;
  border-radius:50% !important;
  display:grid !important;
  place-items:center !important;
  padding:0 !important;
}
#ast-scroll-top,
.ast-scroll-top-icon{
  right:18px !important;
  left:auto !important;
}
.wc-chat-toggle svg{
  width:24px;
  height:24px;
  display:block;
  margin:0;
}
#ast-scroll-top .ast-icon,
.ast-scroll-top-icon .ast-icon,
#ast-scroll-top > span,
.ast-scroll-top-icon > span{
  width:100% !important;
  height:100% !important;
  display:grid !important;
  place-items:center !important;
  margin:0 !important;
  padding:0 !important;
  line-height:0 !important;
}
#ast-scroll-top svg,
.ast-scroll-top-icon svg{
  width:28px !important;
  height:28px !important;
  display:block !important;
  margin:0 !important;
  position:static !important;
  transform:none !important;
}
.wc-floating-contacts .wc-contact-btn{
  width:48px !important;
  height:48px !important;
  min-width:48px !important;
  min-height:48px !important;
  display:grid !important;
  place-items:center !important;
}
.wc-floating-contacts .wc-contact-btn img,
.wc-footer-messengers .wc-contact-btn img{
  display:block;
  margin:auto;
}

@media(max-width:720px){
  .wc-floating-contacts.wc-chat-widget{
    right:14px !important;
    bottom:86px !important;
  }
  .wc-chat-toggle,
  #ast-scroll-top,
  .ast-scroll-top-icon{
    width:56px !important;
    height:56px !important;
    min-width:56px !important;
    min-height:56px !important;
  }
  #ast-scroll-top,
  .ast-scroll-top-icon{
    right:14px !important;
  }
  #ast-scroll-top svg,
  .ast-scroll-top-icon svg,
  .wc-chat-toggle svg{
    width:26px !important;
    height:26px !important;
  }
}
@media(max-width:430px){
  .wc-floating-contacts.wc-chat-widget{
    right:12px !important;
    bottom:82px !important;
  }
  #ast-scroll-top,
  .ast-scroll-top-icon{
    right:12px !important;
  }
}


/* =========================================================
   WebCraft v81 — homepage-style forms on internal CTA blocks,
   footer copyright spacing and mobile floating-controls polish.
   ========================================================= */
.wc-copy-brand{
  display:flex !important;
  align-items:center !important;
  flex-wrap:wrap !important;
  gap:5px !important;
}
.wc-copy-brand > span,
.wc-copy-brand > a{
  display:inline-block !important;
}

/* Internal service/work pages use the exact same responsive form layout as home. */
.wc-services-page .wc-cta-form-box,
.wc-works-page .wc-cta-form-box{
  grid-template-columns:1.2fr .8fr !important;
}
.wc-services-page .wc-inline-lead-form,
.wc-works-page .wc-inline-lead-form{
  width:100% !important;
}

@media(max-width:720px){
  .wc-services-page .wc-cta-form-box,
  .wc-works-page .wc-cta-form-box{
    grid-template-columns:1fr !important;
  }
  .wc-services-page .wc-cta-form-box .wc-cta-art,
  .wc-works-page .wc-cta-form-box .wc-cta-art{
    display:none !important;
  }

  /* Same right edge, one directly above the other, both a little higher. */
  #ast-scroll-top,
  .ast-scroll-top-icon{
    right:14px !important;
    bottom:30px !important;
    left:auto !important;
  }
  .wc-floating-contacts.wc-chat-widget{
    right:14px !important;
    left:auto !important;
    bottom:98px !important;
    top:auto !important;
    transform:none !important;
  }

  /* Astra's glyph points down in this setup; flip it upward on mobile. */
  #ast-scroll-top svg,
  .ast-scroll-top-icon svg{
    transform:rotate(180deg) !important;
    transform-origin:50% 50% !important;
  }
}
@media(max-width:430px){
  #ast-scroll-top,
  .ast-scroll-top-icon{
    right:12px !important;
    bottom:26px !important;
  }
  .wc-floating-contacts.wc-chat-widget{
    right:12px !important;
    bottom:94px !important;
  }
}