@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');:root{--primary:#5b5ce2;--ink:#101828;--muted:#667085;--line:#e7e9f0;--soft:#f6f7fb;--font:'DM Sans',Arial,sans-serif}*{box-sizing:border-box}body{margin:0;color:var(--ink);font:16px/1.65 var(--font);background:#fff}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}.wrap{width:min(1160px,calc(100% - 40px));margin:auto}.announcement{background:var(--ink);color:#fff;text-align:center;padding:7px 15px;font-size:13px}.header{position:sticky;top:0;z-index:20;background:#ffffffed;backdrop-filter:blur(14px);border-bottom:1px solid #eef0f5}.nav{height:82px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:11px;font-weight:800;letter-spacing:-.4px}.brand img{width:42px;height:42px;object-fit:contain}.brand-mark{display:grid;place-items:center;background:var(--primary);color:white;border-radius:13px;width:42px;height:42px;font:800 23px Manrope}.brand small{display:block;color:var(--muted);font-size:10px;font-weight:600;letter-spacing:1.2px;text-transform:uppercase}.navlinks{display:flex;align-items:center;gap:28px;font-size:14px;font-weight:600}.navlinks a:not(.nav-cta):hover,.footer a:hover{color:var(--primary)}.nav-cta{padding:11px 17px;background:var(--ink);color:#fff;border-radius:10px}.nav-toggle{display:none;border:0;background:none;font-size:24px}.hero{padding:90px 0 82px;background:radial-gradient(ellipse at 80% 10%,#e8e8ff 0,transparent 42%),linear-gradient(135deg,#fbfbff,#fff 65%)}.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;align-items:center;gap:65px}.eyebrow{font-size:12px;text-transform:uppercase;letter-spacing:1.7px;color:var(--primary);font-weight:800;margin:0 0 16px}.hero h1{font:800 clamp(42px,5.6vw,70px)/1.08 Manrope,Arial;letter-spacing:-3px;margin:0 0 23px;max-width:740px}.hero h1 em{color:var(--primary);font-style:normal}.hero p,.lead{font-size:18px;color:var(--muted);max-width:620px}.actions{display:flex;gap:13px;flex-wrap:wrap;margin-top:30px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;border-radius:10px;padding:14px 20px;font-weight:700;font-size:14px;transition:.2s}.btn-primary{background:var(--primary);color:white;box-shadow:0 8px 24px #5b5ce233}.btn-dark{background:var(--ink);color:white}.btn-outline{border:1px solid #d9dce7;background:white}.btn:hover{transform:translateY(-2px)}.hero-visual{min-height:380px;border-radius:28px;background:linear-gradient(145deg,#22245e,#5b5ce2 60%,#9da0ff);padding:28px;position:relative;overflow:hidden;color:white;box-shadow:0 25px 70px #3537a32c}.hero-visual:before,.hero-visual:after{content:'';position:absolute;border:1px solid #ffffff50;border-radius:50%;width:330px;height:330px;right:-70px;top:-65px}.hero-visual:after{width:220px;height:220px;right:-10px;top:-10px}.dashboard{position:absolute;z-index:1;left:28px;right:28px;bottom:28px;border:1px solid #ffffff50;background:#ffffffed;color:var(--ink);padding:23px;border-radius:18px;box-shadow:0 20px 45px #13145a55}.dash-top{display:flex;justify-content:space-between;font-size:12px;color:var(--muted)}.dash-number{font:800 35px Manrope;margin:16px 0 2px}.chart{height:75px;display:flex;align-items:end;gap:8px;margin-top:12px}.chart span{flex:1;border-radius:5px 5px 0 0;background:linear-gradient(var(--primary),#a5a6ff)}.trust-row{display:flex;gap:30px;flex-wrap:wrap;margin-top:38px;color:var(--muted);font-size:13px}.trust-row strong{color:var(--ink)}.section{padding:82px 0}.section-soft{background:var(--soft)}.section-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:35px}.section-head h2,.page-hero h1{font:800 clamp(30px,4vw,46px)/1.15 Manrope;letter-spacing:-1.8px;margin:0}.section-head p{max-width:480px;color:var(--muted);margin:0}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card{border:1px solid var(--line);border-radius:18px;padding:25px;background:#fff;transition:.2s}.card:hover{transform:translateY(-4px);box-shadow:0 18px 45px #1720440d;border-color:#d6d7fa}.service-icon{display:grid;place-items:center;width:47px;height:47px;border-radius:14px;background:#efefff;color:var(--primary);font-size:21px;font-weight:800;margin-bottom:20px}.card h3{font:700 20px Manrope;margin:0 0 9px;letter-spacing:-.4px}.card p{color:var(--muted);margin:0 0 16px}.text-link{font-weight:700;font-size:14px;color:var(--primary)}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:35px}.stat{border-left:3px solid var(--primary);padding-left:18px}.stat strong{font:800 30px Manrope;display:block}.stat span{color:var(--muted);font-size:13px}.split{display:grid;grid-template-columns:1fr 1fr;gap:65px;align-items:center}.split-visual{min-height:310px;border-radius:22px;background:linear-gradient(135deg,#e8e9ff,#f6f7ff);display:grid;place-items:center;padding:35px}.orbit{width:220px;height:220px;border:1px solid #a6a7ee;border-radius:50%;display:grid;place-items:center;position:relative}.orbit:before,.orbit:after{content:'';position:absolute;inset:22px;border:1px dashed #a6a7ee;border-radius:50%}.orbit:after{inset:55px;background:var(--primary);border:0}.orbit span{z-index:1;color:white;font:800 25px Manrope}.project-card{padding:0;overflow:hidden}.project-image{height:200px;background:linear-gradient(135deg,#dfe2ff,#f2f3ff);display:grid;place-items:center;color:var(--primary);font-size:45px}.project-image img{width:100%;height:100%;object-fit:cover}.project-info{padding:22px}.quote{font-size:16px;color:#344054}.client{font-weight:800;margin-top:20px}.client small{display:block;color:var(--muted);font-weight:500}.page-hero{padding:72px 0 55px;background:linear-gradient(120deg,#f6f6ff,#fff)}.page-hero p{color:var(--muted);max-width:720px;font-size:18px}.prose{max-width:850px;color:#475467}.prose h2,.prose h3{font-family:Manrope;color:var(--ink)}.detail-grid{display:grid;grid-template-columns:1fr 300px;gap:40px}.detail-aside{background:var(--soft);padding:24px;border-radius:18px;height:max-content}.detail-aside h3{margin-top:0}.field{display:grid;gap:7px;margin-bottom:17px}.field label{font-size:13px;font-weight:700}.field input,.field textarea,.field select{width:100%;border:1px solid #d9dce5;border-radius:9px;padding:13px;font:inherit;background:white}.field textarea{min-height:135px;resize:vertical}.form-card{padding:28px;border:1px solid var(--line);border-radius:18px;background:white}.notice{padding:13px 16px;background:#e9f9ef;color:#17663b;border-radius:10px;margin-bottom:18px}.footer-cta{background:var(--ink);color:white;padding:54px 0}.footer-cta-inner{display:flex;justify-content:space-between;align-items:center;gap:30px}.footer-cta h2{font:800 34px/1.2 Manrope;margin:0 0 10px}.footer-cta p:not(.eyebrow){color:#c3c8d4;margin:0}.btn-light{background:white;color:var(--ink);white-space:nowrap}.footer{background:#0b1020;color:#fff;padding:52px 0 20px}.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:35px}.footer-grid>div{display:flex;flex-direction:column;align-items:start;gap:10px}.footer-grid p{color:#aeb6c7;max-width:320px;font-size:14px}.footer-grid strong{margin-bottom:8px}.footer-grid a:not(.brand){color:#c8ceda;font-size:14px}.footer-brand{color:white}.footer-bottom{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;border-top:1px solid #283044;margin-top:38px;padding-top:20px;color:#aeb6c7;font-size:12px}.footer-bottom a{color:#dfe3eb}.social-link{margin-left:10px}.faq{border-bottom:1px solid var(--line);padding:18px 0}.faq summary{font-weight:700;cursor:pointer}.faq p{color:var(--muted)}.empty{padding:40px;text-align:center;background:var(--soft);border-radius:16px;color:var(--muted)}.article-image{max-height:440px;width:100%;object-fit:cover;border-radius:18px}.announcement{font-size:13px}@media(max-width:850px){.hero-grid,.split,.detail-grid{grid-template-columns:1fr;gap:35px}.hero{padding:62px 0}.hero-visual{min-height:330px}.cards{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:repeat(2,1fr)}.section{padding:62px 0}.navlinks{gap:16px}.hero h1{letter-spacing:-2px}}@media(max-width:640px){.wrap{width:min(100% - 30px,1160px)}.nav{height:70px}.nav-toggle{display:block}.navlinks{display:none;position:absolute;top:70px;left:0;right:0;padding:18px 22px;background:white;border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;gap:15px}.navlinks.open{display:flex}.nav-cta{text-align:center}.hero h1{font-size:42px}.hero p,.lead{font-size:16px}.hero-visual{min-height:300px;padding:15px}.dashboard{left:15px;right:15px;bottom:15px;padding:17px}.cards,.stats{grid-template-columns:1fr}.section-head{display:block}.section-head p{margin-top:12px}.footer-cta-inner{display:block}.footer-cta .btn{margin-top:24px}.footer-grid{grid-template-columns:1fr 1fr;gap:28px 18px}.footer-grid>div:first-child{grid-column:1/-1}.footer-bottom{display:block}.footer-bottom span{display:block;margin:8px 0}.page-hero{padding:50px 0 35px}.section{padding:52px 0}}

/* Modern polish: soft gradients, layered surfaces and accessible focus states */
:focus-visible{outline:3px solid #8c8cff;outline-offset:3px}.hero,.page-hero{position:relative;overflow:hidden}.hero:before{content:"";position:absolute;width:440px;height:440px;border-radius:50%;right:-180px;top:-220px;background:linear-gradient(135deg,#d8d9ff88,#6ee7d755);filter:blur(2px);pointer-events:none}.hero-grid,.apps-hero-grid{position:relative;z-index:1}.card{box-shadow:0 8px 28px #17204405}.btn-primary{background:linear-gradient(135deg,var(--primary),#7779f4);box-shadow:0 10px 25px #5b5ce233}.header{box-shadow:0 5px 24px #17204405}.app-card{min-height:220px}.app-card .project-info{flex:1;min-width:0}.app-card .project-info p{overflow-wrap:anywhere}.app-icon{box-shadow:0 8px 22px #18264a12}.app-screenshots a{display:block;border-radius:16px;overflow:hidden;border:1px solid #e4e7f0;background:#f6f7fb;transition:transform .2s,box-shadow .2s}.app-screenshots a:hover{transform:translateY(-4px);box-shadow:0 14px 30px #17204415}.app-screenshots img{object-fit:cover}.app-detail-icon{box-shadow:0 15px 35px #17204425;border:3px solid #ffffffa8}


/* Premium visual enhancement — additive CSS only; original layout and components preserved. */
.hero-visual:not([style*="background-image"]) {
  background-image: linear-gradient(145deg, rgba(24,26,74,.10), rgba(91,92,226,.08)), url('/assets/it/visuals/digital-growth-dashboard.svg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.split-visual {
  background-image: linear-gradient(135deg, rgba(238,239,255,.22), rgba(246,247,255,.35)), url('/assets/it/visuals/digital-workflow.svg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
/* Keep decorative artwork behind existing content and avoid layout shifts. */
.hero-visual > * { position: relative; z-index: 1; }
.service-icon { box-shadow: 0 8px 20px rgba(91,92,226,.10); border: 1px solid rgba(91,92,226,.08); }
.project-image { background-image: linear-gradient(135deg, #e5e7ff, #eefbf8); }
@media (prefers-reduced-motion: reduce) {
  .card, .btn, .app-screenshots a { transition: none !important; }
}


/* Reference-matched homepage refinement: front-end only; all content remains database-driven. */
:root{--primary:#575cf2;--ink:#101d3a;--muted:#61708b;--line:#e3eaf7;--soft:#f5f8ff}
.wrap{width:min(1080px,calc(100% - 40px))}
.header{background:rgba(255,255,255,.94);border-bottom-color:#edf1fb;box-shadow:0 4px 24px rgba(31,55,110,.035)}
.nav{height:58px}.brand img,.brand-mark{width:34px;height:34px;border-radius:10px}.brand-mark{font-size:20px}.brand{font-size:13px;gap:9px}.brand small{font-size:8px;letter-spacing:1.1px}.navlinks{gap:23px;font-size:12px}.nav-cta{padding:9px 14px;border-radius:9px}
.hero{padding:42px 0 34px;background:radial-gradient(ellipse at 78% 15%,#e6e8ff 0,transparent 42%),radial-gradient(ellipse at 15% 45%,#e9f7ff 0,transparent 32%),linear-gradient(120deg,#fff,#f8faff 65%,#f2f1ff);overflow:hidden}
.hero:after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.45;background:linear-gradient(35deg,transparent 0 27%,#dce9ff 27.1%,transparent 27.5% 100%)}
.hero-grid{grid-template-columns:1.04fr .96fr;gap:38px;position:relative;z-index:1}.eyebrow{font-size:10px;letter-spacing:1.8px;margin-bottom:10px}.hero h1{font-size:clamp(34px,4.2vw,48px);line-height:1.06;letter-spacing:-2.1px;margin-bottom:12px;max-width:510px}.hero p,.lead{font-size:13px;line-height:1.65;color:#52627f}.hero .actions{margin-top:17px;gap:9px}.btn{padding:10px 15px;border-radius:9px;font-size:11px}.btn-primary{background:linear-gradient(135deg,#4e55f2,#7778ff);box-shadow:0 8px 18px #5b5ce233}.btn-outline{border-color:#dce4f2;box-shadow:0 3px 10px #1e3b6b08}.trust-row{gap:15px;margin-top:17px;font-size:10px}.hero-visual{min-height:260px;border-radius:25px;padding:18px;background-color:#e7eaff;background-image:url('/assets/it/visuals/digital-growth-dashboard.svg');background-size:cover;background-position:center;box-shadow:none;color:var(--ink);overflow:visible}.hero-visual:before,.hero-visual:after{border-color:#ffffffb0;opacity:.7}.dashboard{left:7%;right:7%;bottom:9%;padding:17px;border-radius:15px;box-shadow:0 15px 35px #414dc522;background:rgba(255,255,255,.94);border:1px solid #fff}.dash-top{font-size:8px}.dash-number{font-size:20px;margin:7px 0 0}.dashboard>div:nth-child(3){font-size:9px;color:#65718c}.chart{height:45px;gap:5px;margin-top:7px}
.section{padding:38px 0}.section-soft{background:linear-gradient(115deg,#f6f9ff,#f4f6ff 68%,#f7f4ff)}.split{grid-template-columns:.92fr 1.08fr;gap:45px}.split h2{font-size:clamp(26px,3.1vw,34px)!important;letter-spacing:-1.25px!important;line-height:1.12!important;margin-bottom:10px!important}.split .lead{font-size:12px;max-width:440px}.split .btn{margin-top:2px}.split-visual{min-height:245px;border-radius:26px;background-color:#f0f3ff;background-image:url('/assets/it/visuals/digital-workflow.svg');background-size:cover;background-position:center;box-shadow:none}.orbit{width:155px;height:155px;background:#ffffff22}.orbit:before{inset:15px}.orbit:after{inset:40px}.orbit span{font-size:13px}
.section-head{align-items:end;gap:35px;margin-bottom:19px}.section-head h2,.page-hero h1{font-size:clamp(25px,3vw,32px);line-height:1.12;letter-spacing:-1.15px}.section-head p{font-size:11px;line-height:1.65;max-width:420px}.cards{gap:14px}.card{padding:16px;border-radius:12px;border-color:#e3eafa;box-shadow:0 8px 22px #294f8b0b;background:rgba(255,255,255,.88)}.card h3{font-size:13px;line-height:1.35;letter-spacing:-.2px;margin-bottom:6px}.card p{font-size:10px;line-height:1.55;margin-bottom:9px}.service-icon{width:35px;height:35px;border-radius:10px;margin-bottom:10px;font-size:17px}.text-link{font-size:10px}.stats{gap:12px;margin-top:16px}.stat{border-left-width:2px;padding-left:11px}.stat strong{font-size:21px;line-height:1.3}.stat span{font-size:9px}.homepage .showcase-section,.homepage section:has(.quote){display:none!important}
.homepage>section[style*="order:50"] .card{min-height:100px}.homepage>section[style*="order:50"] .card h3{margin-top:0}.homepage>section[style*="order:60"]{padding-top:26px;padding-bottom:24px}.homepage>section[style*="order:60"] .section-head{margin-bottom:0}.homepage>section[style*="order:60"] .prose{font-size:11px}.footer-cta{position:relative;overflow:hidden;padding:30px 0;background:radial-gradient(ellipse at 82% 20%,#263b83 0,transparent 38%),linear-gradient(115deg,#0d193b,#101d42 65%,#111b3a)}.footer-cta:before{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(145deg,transparent 0 72px,#526fd51a 73px,#526fd51a 74px,transparent 75px 112px)}.footer-cta-inner{position:relative;z-index:1}.footer-cta .eyebrow{color:#8c9aff}.footer-cta h2{font-size:26px;letter-spacing:-.8px;margin-bottom:5px}.footer-cta p:not(.eyebrow){font-size:11px}.btn-light{padding:12px 17px;border-radius:9px}.footer{padding:26px 0 14px;background:linear-gradient(130deg,#0b1224,#0c1428)}.footer-grid{grid-template-columns:1.6fr .8fr .9fr 1fr;gap:28px}.footer-grid>div{gap:6px}.footer-grid p,.footer-grid a:not(.brand){font-size:10px;line-height:1.6}.footer-grid strong{font-size:11px;margin-bottom:3px}.footer-brand .brand-mark{width:30px;height:30px}.footer-bottom{margin-top:18px;padding-top:12px;font-size:9px}
@media(max-width:850px){.hero{padding:35px 0 30px}.hero-grid{grid-template-columns:1fr 1fr;gap:24px}.hero h1{font-size:clamp(32px,5vw,42px)}.hero-visual{min-height:240px}.split{grid-template-columns:1fr 1fr;gap:24px}.section{padding:32px 0}.cards{grid-template-columns:repeat(3,minmax(0,1fr))}.card{padding:14px}.footer-grid{grid-template-columns:1.3fr 1fr 1fr 1fr;gap:18px}}
@media(max-width:640px){.wrap{width:calc(100% - 32px)}.nav{height:62px}.navlinks{top:62px}.hero{padding:35px 0 27px}.hero-grid{grid-template-columns:1fr;gap:24px}.hero h1{font-size:39px;max-width:430px}.hero p,.lead{font-size:13px}.hero-visual{min-height:235px;max-width:500px;width:100%;margin:auto}.trust-row{gap:9px 14px}.split{grid-template-columns:1fr;gap:22px}.split-visual{min-height:230px;order:2}.section{padding:34px 0}.section-head{display:block;margin-bottom:18px}.section-head p{margin-top:10px}.section-head h2,.page-hero h1{font-size:28px}.cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.card{padding:13px}.card h3{font-size:12px}.card p{font-size:10px}.service-icon{width:34px;height:34px}.stats{gap:8px}.stat strong{font-size:19px}.homepage>section[style*="order:50"] .cards{grid-template-columns:1fr}.homepage>section[style*="order:50"] .card{min-height:0}.homepage>section[style*="order:60"]{padding:24px 0}.footer-cta{padding:27px 0}.footer-cta h2{font-size:25px}.footer-cta .btn{margin-top:17px}.footer-grid{grid-template-columns:1fr 1fr;gap:22px 16px}.footer-grid>div:first-child{grid-column:1/-1}.footer-bottom{display:flex;flex-direction:column;gap:6px}.footer-bottom span{display:block;margin:0}}

/* Final reference-image alignment: service pictograms, FAQ illustration and compact rhythm. */
.service-icon{position:relative;display:grid;place-items:center;color:#fff;background:linear-gradient(145deg,#38b6ff,#2788ed);border:0;box-shadow:0 8px 16px #258df51c}
.service-icon svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.service-icon-ecommerce-development{background:linear-gradient(145deg,#a56aff,#7b42e9)}
.service-icon-seo{background:linear-gradient(145deg,#40d7c1,#18b7a8)}
.service-icon-digital-marketing{background:linear-gradient(145deg,#ffb044,#ff8318)}
.service-icon-google-ads{background:linear-gradient(145deg,#4285f4,#1557d5)}
.service-icon-social-media-marketing{background:linear-gradient(145deg,#ff6097,#e92c70)}
.ads-mark{font:900 24px/1 Manrope,Arial,sans-serif;color:#ffd34d;text-shadow:1px 1px 0 #fff}
.faq-section{padding-top:27px!important;padding-bottom:25px!important;background:linear-gradient(115deg,#fff,#f8faff 70%,#f3f2ff)}
.faq-layout{display:grid;grid-template-columns:1.25fr .75fr;gap:30px;align-items:center}
.faq-layout h2{font:800 clamp(25px,3vw,32px)/1.12 Manrope,Arial,sans-serif;letter-spacing:-1.15px;margin:0 0 8px}
.faq-layout .eyebrow{margin-bottom:7px}
.faq-copy{font-size:11px;line-height:1.65;color:var(--muted);margin:0;max-width:600px}
.faq-art{height:95px;position:relative;display:flex;align-items:center;justify-content:center;gap:0}
.faq-art:before{content:"";position:absolute;width:170px;height:75px;border-radius:50%;background:linear-gradient(110deg,#eef0ff,#f8f8ff);filter:blur(2px)}
.faq-art .bubble{position:absolute;top:12px;display:grid;place-items:center;width:76px;height:48px;border-radius:25px;font-size:17px;letter-spacing:3px;box-shadow:0 10px 25px #4d62ed20}
.faq-art .bubble-back{left:calc(50% - 48px);background:linear-gradient(135deg,#f0f1ff,#c7ceff);color:#fff;transform:translateY(-4px)}
.faq-art .bubble-front{left:calc(50% - 5px);background:linear-gradient(135deg,#8293ff,#4b60ed);color:#fff;top:20px}
.faq-art small{position:absolute;bottom:0;color:#667391;font-size:9px}
@media(max-width:640px){.faq-layout{grid-template-columns:1fr;gap:8px}.faq-art{height:85px;max-width:280px;justify-self:center;width:100%}.faq-layout h2{font-size:27px}.faq-copy{font-size:12px}}

/* Responsive hardening: mobile, tablet and desktop */
html{scroll-padding-top:76px;overflow-x:clip}body{max-width:100%;overflow-x:clip}img,svg,video,canvas{max-width:100%}button,a{touch-action:manipulation}.nav{min-width:0}.brand{min-width:0}.brand>span:last-child{overflow-wrap:anywhere}.navlinks{margin-left:auto}.footer-grid>div{min-width:0}.footer-grid a,.footer-grid p,.footer-bottom{overflow-wrap:anywhere}.cards>*{min-width:0}.hero-grid>*,.split>*,.detail-grid>*{min-width:0}.hero h1,.section-head h2,.page-hero h1{overflow-wrap:anywhere}input,textarea,select,button{max-width:100%}
@media(max-width:850px){.nav{gap:14px}.navlinks{gap:14px}.nav-cta{white-space:nowrap}.hero-grid,.split,.detail-grid{min-width:0}.footer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.footer-grid>div{min-width:0}}
@media(max-width:640px){.nav{position:relative;justify-content:space-between;gap:10px}.brand{flex:1;min-width:0}.brand img,.brand-mark{flex-shrink:0}.nav-toggle{flex-shrink:0;width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--ink);cursor:pointer}.navlinks{z-index:25;max-height:calc(100dvh - 72px);overflow-y:auto;overscroll-behavior:contain}.navlinks a{min-height:42px;white-space:normal;overflow-wrap:anywhere}.wrap{width:calc(100% - 28px)}.hero h1{letter-spacing:-1.2px;overflow-wrap:anywhere}.hero-visual{overflow:hidden}.dashboard{min-width:0}.dash-top{gap:8px;flex-wrap:wrap}.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.card{min-width:0;overflow-wrap:anywhere}.card h3{font-size:clamp(12px,3.5vw,15px)}.card p{font-size:12px}.footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 14px}.footer-grid>div:first-child{grid-column:1/-1}.footer-bottom{align-items:flex-start;flex-direction:column;gap:8px}.footer-cta-inner{align-items:flex-start}.btn{max-width:100%;white-space:normal}.form-card{padding:18px}.detail-aside{padding:18px}}
@media(max-width:380px){.cards,.stats,.footer-grid{grid-template-columns:minmax(0,1fr)}.footer-grid>div:first-child{grid-column:auto}.nav{height:64px}.navlinks{top:64px}.hero h1{font-size:clamp(30px,9vw,38px)}.card{padding:16px}.footer-grid>div{grid-column:auto}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}


/* Premium finish pass — preserves the existing SAPNON layout and content */
:root{
  --premium-shadow:0 12px 34px rgba(16,24,40,.07);
  --premium-shadow-hover:0 20px 48px rgba(16,24,40,.12);
}
html{scroll-behavior:smooth;scroll-padding-top:92px}
body{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
::selection{background:rgba(91,92,226,.18);color:var(--ink)}
a{transition:color .2s ease,background-color .2s ease,border-color .2s ease,box-shadow .2s ease}
.header{box-shadow:0 3px 18px rgba(16,24,40,.025)}
.nav{min-height:76px}
.navlinks a:not(.nav-cta){position:relative}
.navlinks a:not(.nav-cta)::after{content:"";position:absolute;left:0;right:100%;bottom:-5px;height:2px;border-radius:2px;background:var(--primary);transition:right .22s ease}
.navlinks a:not(.nav-cta):hover::after,.navlinks a:not(.nav-cta):focus-visible::after{right:0}
.nav-cta{box-shadow:0 7px 18px rgba(16,24,40,.12);transition:transform .2s ease,box-shadow .2s ease,background .2s ease}
.nav-cta:hover{transform:translateY(-1px);box-shadow:0 11px 24px rgba(16,24,40,.16)}
.hero{position:relative}
.hero h1{line-height:1.07;text-wrap:balance}
.hero p,.lead{line-height:1.75}
.hero-visual{isolation:isolate}
.btn{transition:transform .2s ease,box-shadow .2s ease,background-color .2s ease,border-color .2s ease}
.btn-primary:hover{box-shadow:0 12px 28px rgba(91,92,226,.27)}
.btn-dark:hover{background:#252b3b;box-shadow:0 10px 22px rgba(16,24,40,.18)}
.btn-outline:hover{border-color:var(--primary);background:#f8f8ff;color:var(--primary)}
.section{padding-top:68px;padding-bottom:68px}
.section-head{margin-bottom:30px}
.section-head h2,.page-hero h1{letter-spacing:-1.25px;text-wrap:balance}
.page-hero{background:linear-gradient(135deg,#fafaff 0%,#fff 58%,#f7f7ff 100%);border-bottom:1px solid #f0f1f8}
.page-hero .wrap{padding-top:54px;padding-bottom:54px}
.page-hero h1{line-height:1.12}
.cards{gap:22px}
.card{border:1px solid #e9ebf4;border-radius:18px;background:linear-gradient(180deg,#fff 0%,#fdfdff 100%);box-shadow:0 4px 18px rgba(16,24,40,.035);transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease}
.card:hover{transform:translateY(-4px);border-color:#d9dafe;box-shadow:var(--premium-shadow-hover)}
.card h3{letter-spacing:-.25px;line-height:1.35}
.service-icon{box-shadow:0 8px 18px rgba(91,92,226,.12)}
.text-link{font-weight:700}
.text-link:hover{text-decoration:underline;text-underline-offset:4px}
.split-visual,.form-card,.detail-aside{border:1px solid #eceef6;box-shadow:var(--premium-shadow)}
.form-card{border-radius:18px}
input,textarea,select{border-color:#dfe3ec!important;border-radius:10px!important;transition:border-color .2s ease,box-shadow .2s ease}
input:focus,textarea:focus,select:focus{border-color:var(--primary)!important;box-shadow:0 0 0 4px rgba(91,92,226,.12)!important;outline:none}
.field label{font-weight:650}
.notice{border-radius:12px}
.footer{border-top:1px solid #e9ebf3}
.footer a{transition:color .2s ease}
.footer-grid h3,.footer-grid h4{letter-spacing:.1px}
.footer-cta{border-radius:20px}
.prose h2{letter-spacing:-.45px;line-height:1.3}
.prose p,.prose li{line-height:1.8}
:focus-visible{outline:3px solid rgba(91,92,226,.65);outline-offset:3px}
@media(max-width:850px){
  .section{padding-top:54px;padding-bottom:54px}
  .cards{gap:16px}
}
@media(max-width:640px){
  .nav{min-height:66px}
  .hero{padding:58px 0 52px}
  .hero h1{line-height:1.1;letter-spacing:-1.1px}
  .hero p,.lead{font-size:16px}
  .page-hero .wrap{padding-top:38px;padding-bottom:38px}
  .section{padding-top:42px;padding-bottom:42px}
  .section-head{margin-bottom:22px}
  .card{border-radius:15px;padding:18px}
  .cards{gap:12px}
  .btn{min-height:44px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none!important;animation:none!important}
}

/* =========================================================
   SAPNON PREMIUM SHARED DESIGN SYSTEM
   Shared visual layer for services, about, insights and detail pages.
   No database, form handling, URLs or admin functionality changed.
========================================================= */
:root{--sap-ink:#111a2e;--sap-muted:#66738a;--sap-line:#e5eaf2;--sap-soft:#f7f8fc;--sap-purple:#5b5ce2;--sap-blue:#3976e8;--sap-cyan:#17a6b7;--sap-shadow:0 16px 42px rgba(24,39,75,.075);--sap-shadow-hover:0 24px 54px rgba(41,53,112,.14)}
body{color:var(--sap-ink);background:#fff;font-family:'DM Sans','Plus Jakarta Sans',Arial,sans-serif;-webkit-font-smoothing:antialiased}
.wrap{width:min(1180px,calc(100% - 44px))}
.header{background:rgba(255,255,255,.92);border-bottom:1px solid rgba(226,232,242,.85);box-shadow:0 4px 24px rgba(20,32,60,.035)}
.nav{min-height:78px;height:auto}
.brand{font-family:'Manrope','DM Sans',sans-serif;font-size:16px;letter-spacing:-.4px}
.brand-mark{background:linear-gradient(145deg,#7778ff,#4143bd);box-shadow:0 8px 22px #5b5ce238}
.navlinks{gap:25px}
.navlinks a{transition:color .2s ease}
.nav-cta{border-radius:12px;background:linear-gradient(120deg,#191f36,#343c61);box-shadow:0 7px 18px #11182720;padding:12px 18px}
.nav-cta:hover{color:#fff!important;transform:translateY(-1px)}
.page-hero{position:relative;overflow:hidden;padding:clamp(62px,8vw,100px) 0 76px;background:radial-gradient(ellipse at 9% 4%,rgba(91,92,226,.11),transparent 37%),radial-gradient(ellipse at 92% 12%,rgba(23,166,183,.10),transparent 33%),linear-gradient(180deg,#f8f9ff 0%,#fff 100%)}
.page-hero:after{content:"";position:absolute;width:360px;height:360px;border:1px solid rgba(91,92,226,.08);border-radius:50%;right:-170px;bottom:-235px;pointer-events:none}
.page-hero>.wrap{position:relative;z-index:1}
.page-hero h1{max-width:850px;color:#111a2e;font:800 clamp(38px,5.5vw,62px)/1.08 'Manrope','DM Sans',sans-serif;letter-spacing:-2.8px}
.page-hero h1 span{background:linear-gradient(100deg,#5557df 0%,#8060e8 48%,#159eae 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.page-hero p:not(.eyebrow){max-width:700px;color:#64718a;font-size:16px;line-height:1.85}
.eyebrow{display:inline-flex;align-items:center;gap:8px;color:#5b5ce2;font-size:11px;font-weight:800;letter-spacing:1.5px}
.actions{gap:12px;margin-top:26px}
.btn{border-radius:12px;padding:13px 19px;transition:transform .2s,box-shadow .2s,border-color .2s}
.btn-primary{background:linear-gradient(115deg,#5658df,#7772ed);box-shadow:0 9px 23px rgba(91,92,226,.24)}
.btn-primary:hover{box-shadow:0 13px 28px rgba(91,92,226,.3);transform:translateY(-2px)}
.btn-outline{border:1px solid #dce2ee;background:rgba(255,255,255,.8);color:#34405a}
.btn-outline:hover{border-color:#aeb4f4;background:#fff}
.section{padding:clamp(58px,7vw,88px) 0}
.section-head{align-items:flex-end;margin-bottom:32px}
.section-head h2,.prose h2{color:#111a2e;font:800 clamp(27px,3.5vw,39px)/1.18 'Manrope','DM Sans',sans-serif;letter-spacing:-1.35px}
.section-head p{color:#6b7890;line-height:1.8;font-size:14px}
.cards,.grid{gap:21px}
.card{border:1px solid #e5e9f2;border-radius:20px;padding:25px;background:rgba(255,255,255,.96);box-shadow:0 8px 25px rgba(22,34,68,.045);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.card:hover{transform:translateY(-5px);border-color:#d5d8fa;box-shadow:var(--sap-shadow-hover)}
.card h3{color:#18223a;font:750 19px/1.35 'Manrope','DM Sans',sans-serif;letter-spacing:-.45px}
.card p,.prose p{color:#66738a;line-height:1.85}
.text-link{color:#5557dc;font-weight:800}
.text-link:hover{color:#3035a8}
.split{gap:55px}
.split-visual{border:1px solid #e3e8fb;background:radial-gradient(circle at 50% 50%,#fff 0%,#f1f2ff 58%,#eaf8fb 100%);box-shadow:var(--sap-shadow);border-radius:26px}
.detail-grid{gap:34px;align-items:start}
.prose{color:#46536b}
.prose h2{margin-top:28px}
.prose h3{color:#18223a}
.detail-aside{border:1px solid #e4e8f3;border-radius:22px;padding:27px;background:linear-gradient(155deg,#fff 0%,#f7f8ff 100%);box-shadow:var(--sap-shadow)}
.detail-aside h3{font:800 22px/1.25 'Manrope',sans-serif;color:#17213a}
.detail-aside p{color:#6b7890;line-height:1.8}
.faq{border:1px solid #e5e9f2;border-radius:13px;padding:15px 17px;margin:11px 0;background:#fff}
.faq summary{color:#202b43;font-weight:700;cursor:pointer}
.faq p{margin:12px 0 0}
.project-card{padding:0;border-radius:20px}
.project-image{border-radius:20px 20px 0 0}
.empty,.service-empty{border:1px dashed #cbd5e5;border-radius:20px;background:#fff;padding:34px;text-align:center;color:#65728a}
.service-hero-copy{max-width:690px}
.services-hero-inner{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr);align-items:center;gap:50px}
.services-hero .eyebrow{padding:8px 13px;border:1px solid #e4e6fb;border-radius:999px;background:#fff;box-shadow:0 5px 18px rgba(47,57,120,.05)}
.services-hero h1{margin:13px 0 18px}
.services-hero .service-hero-copy>p:not(.eyebrow){max-width:620px}
.service-trust-points{display:flex;flex-wrap:wrap;gap:15px 22px;margin-top:26px;color:#66738a;font-size:12px;font-weight:600}
.service-trust-points i{color:#20a58b;margin-right:6px}
.services-hero-art{position:relative;min-height:360px;display:grid;place-items:center}
.services-art-orbit{position:absolute;border:1px solid rgba(91,92,226,.18);border-radius:50%;transform:rotate(-22deg)}
.orbit-one{width:300px;height:220px}
.orbit-two{width:230px;height:310px;transform:rotate(42deg);border-color:rgba(23,166,183,.2)}
.services-art-core{position:relative;z-index:2;width:165px;height:165px;border-radius:42px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(145deg,#5456dc,#8582f5 58%,#27a7b2);color:#fff;box-shadow:0 25px 55px rgba(79,83,210,.28);transform:rotate(-7deg)}
.services-art-core i{font-size:34px;margin-bottom:10px}
.services-art-core b{font:800 21px 'Manrope',sans-serif}.services-art-core span{font-size:12px;opacity:.85}
.floating-service-chip{position:absolute;z-index:3;display:flex;align-items:center;gap:9px;padding:12px 15px;border:1px solid rgba(226,231,244,.9);border-radius:13px;background:rgba(255,255,255,.94);box-shadow:0 12px 30px rgba(27,40,80,.1);font-size:12px;font-weight:800;color:#35415c}
.floating-service-chip i{color:#5b5ce2}.chip-one{top:40px;left:2%}.chip-two{right:0;top:47%}.chip-three{bottom:30px;left:10%}
.service-list-section{background:linear-gradient(180deg,#fff,#fafbff)}
.service-section-head h2{max-width:620px;margin:5px 0 0}
.service-cards{grid-template-columns:repeat(3,minmax(0,1fr))}
.service-card{position:relative;min-height:245px;padding:25px 25px 23px;overflow:hidden}
.service-card:after{content:"";position:absolute;width:145px;height:145px;right:-90px;top:-90px;border-radius:50%;background:linear-gradient(135deg,rgba(91,92,226,.09),rgba(23,166,183,.08));transition:transform .3s}
.service-card:hover:after{transform:scale(1.7)}
.service-card-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}
.service-icon{width:54px;height:54px;border-radius:17px;display:grid;place-items:center;font-size:22px;margin:0;box-shadow:0 8px 18px rgba(73,83,190,.11)}
.service-icon-1{color:#5758dc;background:linear-gradient(145deg,#efefff,#e3e5ff)}
.service-icon-2{color:#159b9d;background:linear-gradient(145deg,#e4fbf7,#d8f3f2)}
.service-icon-3{color:#c17c22;background:linear-gradient(145deg,#fff4df,#ffebc7)}
.service-icon-4{color:#8b55c7;background:linear-gradient(145deg,#f5eaff,#eee1ff)}
.service-icon-5{color:#3277c8;background:linear-gradient(145deg,#e8f3ff,#dcecff)}
.service-icon-6{color:#d45c83;background:linear-gradient(145deg,#fff0f5,#ffe2ec)}
.service-card-number{font:800 12px 'Manrope',sans-serif;color:#b1b9ca;letter-spacing:1px}
.service-card h3{position:relative;z-index:1;margin:0 0 9px}
.service-card p{position:relative;z-index:1;min-height:52px;margin:0 0 18px;color:#6b7890;font-size:13px;line-height:1.75}
.service-card .text-link{position:relative;z-index:1;font-size:13px}
.service-bottom-cta{padding:28px 0 76px;background:#fff}
.service-bottom-inner{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:34px 38px;border:1px solid #e1e5f5;border-radius:23px;background:radial-gradient(ellipse at 95% 0%,rgba(91,92,226,.13),transparent 40%),linear-gradient(115deg,#f8f8ff,#f1fbfc);box-shadow:0 13px 35px rgba(30,45,90,.06)}
.service-bottom-inner h2{margin:4px 0 8px;font:800 clamp(23px,3vw,31px)/1.2 'Manrope',sans-serif;letter-spacing:-1px;color:#17213a}
.service-bottom-inner p:not(.eyebrow){margin:0;color:#69768c;font-size:13px;line-height:1.7}
.service-bottom-inner>div{max-width:700px}
.service-detail-hero{padding-top:58px;padding-bottom:62px}
.service-detail-hero-inner{display:grid;grid-template-columns:minmax(0,1fr) 260px;align-items:center;gap:40px}
.service-back-link{display:inline-block;margin-bottom:25px;color:#6a7390;font-size:12px;font-weight:700}
.service-back-link:hover{color:#5658dc}
.service-detail-hero h1{margin:10px 0 14px}
.service-detail-symbol{display:grid;justify-items:center;gap:13px;color:#7a849a;font-size:9px;font-weight:800;letter-spacing:1.6px}
.service-detail-symbol-inner{width:165px;height:165px;display:grid;place-items:center;border:1px solid #e2e5fa;border-radius:42px;background:linear-gradient(145deg,#f0f0ff,#e5f7f8);box-shadow:0 20px 50px rgba(67,78,170,.12);color:#5b5ce2;font-size:58px;transform:rotate(5deg)}
.service-detail-grid{grid-template-columns:minmax(0,1fr) 330px}
.service-detail-content{padding:4px 0}
.service-content-block{margin-bottom:40px}
.service-content-block h2{margin:4px 0 15px}
.service-feature-list{display:grid;gap:12px;padding:0;list-style:none}
.service-feature-list li{display:flex;align-items:flex-start;gap:12px;padding:13px 15px;border:1px solid #e8ebf3;border-radius:13px;background:#fff;color:#59667e}
.service-feature-list li i{flex:0 0 18px;margin-top:4px;color:#22a18c}
.service-detail-aside{position:sticky;top:105px}
.aside-icon{display:grid;place-items:center;width:48px;height:48px;margin-bottom:17px;border-radius:15px;background:linear-gradient(145deg,#ededff,#e1f7f7);color:#5b5ce2;font-size:20px}
.aside-divider{height:1px;margin:22px 0;background:#e7eaf2}
.detail-aside .aside-note{display:flex;gap:9px;align-items:flex-start;margin:0;font-size:11px}.aside-note i{color:#20a58b;margin-top:4px}
.service-faq{box-shadow:0 3px 12px rgba(24,39,75,.025)}
@media(max-width:900px){.services-hero-inner{grid-template-columns:1fr .7fr;gap:20px}.services-art-core{width:140px;height:140px}.orbit-one{width:230px}.orbit-two{width:190px}.service-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.service-detail-grid{grid-template-columns:minmax(0,1fr) 290px}}
@media(max-width:700px){.wrap{width:calc(100% - 34px)}.nav{min-height:70px}.nav-toggle{display:block;width:42px;height:42px;border:1px solid #e2e7f0;border-radius:12px;background:#fff;color:#18223a}.navlinks{display:none;position:absolute;top:100%;left:0;right:0;padding:12px 18px 18px;background:#fff;border-top:1px solid #edf0f5;box-shadow:0 18px 25px rgba(20,32,60,.1);flex-direction:column;align-items:stretch;gap:0}.navlinks.open{display:flex}.navlinks a{padding:13px 8px;border-bottom:1px solid #f0f2f7}.navlinks .nav-cta{margin-top:10px;text-align:center}.page-hero{padding:55px 0 54px}.page-hero h1{font-size:clamp(35px,9vw,48px);letter-spacing:-1.8px}.page-hero p:not(.eyebrow){font-size:14px}.services-hero-inner{grid-template-columns:1fr;gap:0}.services-hero-art{min-height:265px;max-width:440px;width:100%;margin:0 auto}.orbit-one{width:240px;height:180px}.orbit-two{width:190px;height:240px}.service-trust-points{gap:10px 16px}.section{padding:55px 0}.section-head{display:block}.section-head>p{margin-top:12px}.service-cards{grid-template-columns:1fr;gap:14px}.service-card{min-height:0;padding:22px}.service-card p{min-height:0}.service-bottom-cta{padding:12px 0 55px}.service-bottom-inner{display:block;padding:25px 22px}.service-bottom-inner .btn{margin-top:20px}.service-detail-hero-inner{grid-template-columns:1fr;gap:25px}.service-detail-symbol{display:none}.service-detail-grid{grid-template-columns:1fr;gap:25px}.service-detail-aside{position:static;order:-1}.detail-grid{grid-template-columns:1fr}.split{grid-template-columns:1fr;gap:30px}.cards,.grid{grid-template-columns:1fr!important}.detail-aside{padding:23px}.prose h2{font-size:27px}}
@media(max-width:380px){.wrap{width:calc(100% - 28px)}.services-art-core{width:125px;height:125px}.floating-service-chip{font-size:10px;padding:10px 11px}.chip-one{left:0}.chip-two{right:0}}
@media(prefers-reduced-motion:reduce){.card,.btn,.service-card:after{transition:none!important}.service-card,.services-art-core{animation:none!important}}



/* SAPNON unified motion layer — internal pages only.
   Palette follows the existing homepage tokens; content remains visible without JS. */
:root{
 --sap-violet:#5b5ce2;--sap-violet-deep:#4143bd;--sap-lilac:#8582f5;
 --sap-teal:#17a6b7;--sap-ink:#101828;--sap-muted:#667085;
 --sap-line:#e7e9f0;--sap-soft:#f6f7fb;
 --sap-shadow:0 18px 55px rgba(53,55,163,.10);
 --sap-shadow-hover:0 24px 60px rgba(53,55,163,.16);
}
body:not(.home-page){background:#fff;color:var(--sap-ink)}
body:not(.home-page) .page-hero{
 background:
  radial-gradient(ellipse at 80% 10%,rgba(232,232,255,.95) 0,transparent 42%),
  radial-gradient(ellipse at 8% 5%,rgba(23,166,183,.075) 0,transparent 35%),
  linear-gradient(135deg,#fbfbff 0%,#fff 68%);
}
body:not(.home-page) .section-soft,
body:not(.home-page) .service-list-section{
 background:linear-gradient(180deg,#f6f7fb 0%,#fff 100%);
}
body:not(.home-page) .service-bottom-inner{
 background:radial-gradient(ellipse at 90% 0%,rgba(91,92,226,.15),transparent 42%),
 linear-gradient(115deg,#f8f8ff,#f1fbfc);
}
body:not(.home-page) .card{box-shadow:0 8px 25px rgba(22,34,68,.045)}
body:not(.home-page) .btn-primary{
 background:linear-gradient(110deg,#5b5ce2 0%,#7772ed 58%,#17a6b7 125%);
 box-shadow:0 9px 24px rgba(91,92,226,.24);
}
body:not(.home-page) .btn-primary:hover{box-shadow:0 15px 34px rgba(91,92,226,.32)}
body:not(.home-page) .header{background:rgba(255,255,255,.88);backdrop-filter:blur(16px)}
body:not(.home-page) .footer{background:#101828;color:#fff}

/* Gentle ambient motion; avoid large layout shifts and keep text readable. */
@keyframes sap-float{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-9px,0)}}
@keyframes sap-glow{0%,100%{box-shadow:0 18px 45px rgba(91,92,226,.18)}50%{box-shadow:0 22px 58px rgba(23,166,183,.22)}}
@keyframes sap-orbit{to{transform:rotate(360deg)}}
@keyframes sap-orbit-reverse{to{transform:rotate(-360deg)}}
@keyframes sap-gradient{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@keyframes sap-reveal{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
body:not(.home-page) .services-art-core{animation:sap-float 5.5s ease-in-out infinite,sap-glow 6s ease-in-out infinite}
body:not(.home-page) .service-detail-symbol-inner{animation:sap-float 6s ease-in-out infinite}
body:not(.home-page) .services-art-orbit{animation:sap-orbit 28s linear infinite}
body:not(.home-page) .services-art-orbit.orbit-two{animation:sap-orbit-reverse 34s linear infinite}
body:not(.home-page) .floating-service-chip{animation:sap-float 5s ease-in-out infinite}
body:not(.home-page) .chip-two{animation-delay:-1.7s}
body:not(.home-page) .chip-three{animation-delay:-3.2s}
body:not(.home-page) .btn,.body:not(.home-page) .card{transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease,background-color .28s ease}
body:not(.home-page) .page-hero h1 span{background-size:200% 200%;animation:sap-gradient 8s ease infinite}
body:not(.home-page) .service-card{transition:transform .32s cubic-bezier(.2,.75,.25,1),box-shadow .32s ease,border-color .32s ease}
body:not(.home-page) .service-card:hover{transform:translateY(-7px)}
body:not(.home-page) .service-card .service-icon{transition:transform .35s ease,box-shadow .35s ease}
body:not(.home-page) .service-card:hover .service-icon{transform:translateY(-3px) rotate(-5deg);box-shadow:0 13px 25px rgba(91,92,226,.18)}
body:not(.home-page) .sap-reveal{animation:sap-reveal .7s cubic-bezier(.2,.7,.2,1) both}
body:not(.home-page) .sap-reveal-delay-1{animation-delay:.08s}
body:not(.home-page) .sap-reveal-delay-2{animation-delay:.16s}
body:not(.home-page) .sap-reveal-delay-3{animation-delay:.24s}
@media(hover:hover) and (pointer:fine){
 body:not(.home-page) .card:hover{box-shadow:var(--sap-shadow-hover)}
}
@media(prefers-reduced-motion:reduce){
 body:not(.home-page) *,body:not(.home-page) *:before,body:not(.home-page) *:after{
  animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important
 }
}


/* Database-driven circular services orbit */
.services-orbit-stage{isolation:isolate}
.services-orbit-items{position:absolute;inset:0;z-index:4;animation:sap-orbit 42s linear infinite}
.services-orbit-item{
 position:absolute;left:50%;top:50%;width:max-content;max-width:170px;
 transform:rotate(calc(var(--orbit-index)*1turn/var(--orbit-count))) translateY(-150px) rotate(calc(var(--orbit-index)*-1turn/var(--orbit-count)));
 transform-origin:center;display:flex;align-items:center;justify-content:center;
}
.services-orbit-item span{
 display:block;padding:9px 13px;border:1px solid rgba(226,231,244,.95);border-radius:999px;
 background:rgba(255,255,255,.96);box-shadow:0 10px 25px rgba(27,40,80,.10);
 color:#35415c;font-size:11px;font-weight:800;white-space:nowrap;
 animation:sap-orbit-reverse 42s linear infinite;
}
.services-orbit-stage:hover .services-orbit-items,
.services-orbit-stage:hover .services-orbit-item span{animation-play-state:paused}
@media(max-width:900px){
 .services-orbit-item{transform:rotate(calc(var(--orbit-index)*1turn/var(--orbit-count))) translateY(-118px) rotate(calc(var(--orbit-index)*-1turn/var(--orbit-count)))}
 .services-orbit-item span{font-size:10px;padding:8px 10px}
}
@media(max-width:700px){
 .services-orbit-item{transform:rotate(calc(var(--orbit-index)*1turn/var(--orbit-count))) translateY(-112px) rotate(calc(var(--orbit-index)*-1turn/var(--orbit-count)))}
 .services-orbit-items,.services-orbit-item span{animation-duration:55s}
}

.sap-observe-pending{opacity:1}.sap-observe-pending.sap-reveal{opacity:1}


/* Premium illustrated services grid */
.services-hero{position:relative;overflow:hidden;background:
 radial-gradient(ellipse at 92% 4%,rgba(133,130,245,.20),transparent 34%),
 radial-gradient(ellipse at 4% 78%,rgba(88,192,229,.13),transparent 32%),
 linear-gradient(135deg,#fbfbff 0%,#fff 58%,#f5f9ff 100%)}
.services-hero:after{content:"";position:absolute;inset:auto -8% -170px -8%;height:260px;pointer-events:none;background:radial-gradient(ellipse,rgba(151,133,255,.13),transparent 68%)}
.service-list-section{position:relative;padding-top:76px;padding-bottom:88px;background:
 radial-gradient(ellipse at 8% 12%,rgba(227,229,255,.40),transparent 34%),
 linear-gradient(180deg,#f8f9ff 0%,#fff 48%,#f8faff 100%)}
.service-section-head{display:grid;grid-template-columns:1fr minmax(260px,.62fr);align-items:end;gap:44px;margin-bottom:34px}
.service-section-head .eyebrow{letter-spacing:2px}
.service-section-head h2{font:800 clamp(30px,3.4vw,43px)/1.13 Manrope,sans-serif;letter-spacing:-1.8px;color:#111c3a}
.service-section-head>p{border-left:1px solid #dfe3f3;padding-left:24px;color:#65718d;font-size:14px;line-height:1.8;margin:0 0 4px}
.service-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.premium-service-card{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1.12fr) minmax(110px,.88fr);align-items:stretch;gap:0;min-height:248px;padding:22px 17px 20px 22px;border:1px solid rgba(222,228,244,.94);border-radius:21px;background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(250,251,255,.94));box-shadow:0 10px 28px rgba(34,48,94,.055),inset 0 1px 0 #fff;overflow:hidden;transition:transform .38s cubic-bezier(.2,.75,.25,1),box-shadow .38s,border-color .38s}
.premium-service-card:before{content:"";position:absolute;z-index:-1;right:-68px;top:-92px;width:180px;height:180px;border-radius:50%;background:linear-gradient(140deg,rgba(111,104,239,.12),rgba(70,191,210,.08));transition:transform .55s}
.premium-service-card:after{content:"";position:absolute;z-index:-1;inset:0;opacity:0;background:radial-gradient(circle at 78% 48%,rgba(129,117,255,.12),transparent 45%);transition:opacity .4s}
.premium-service-card:hover{transform:translateY(-7px);border-color:#d6d9fb;box-shadow:0 22px 48px rgba(59,65,151,.13),0 4px 12px rgba(50,70,120,.04)}
.premium-service-card:hover:before{transform:scale(1.35)}
.premium-service-card:hover:after{opacity:1}
.service-card-copy{position:relative;z-index:2;display:flex;flex-direction:column;align-items:flex-start;min-width:0}
.premium-service-card .service-card-top{width:100%;margin:0 0 17px}
.premium-service-card .service-icon{width:47px;height:47px;border-radius:15px;font-size:20px;box-shadow:0 8px 20px rgba(91,92,226,.14)}
.premium-service-card .service-card-number{font:800 11px Manrope;color:#aeb8d0}
.premium-service-card h3{font:800 clamp(15px,1.15vw,17px)/1.3 Manrope,sans-serif;letter-spacing:-.45px;color:#17213e;margin:0 0 8px}
.premium-service-card p{font-size:12px;line-height:1.65;color:#697792;margin:0 0 16px;min-height:58px}
.premium-service-card .text-link{font-size:12px;font-weight:800;color:#5a51dc;margin-top:auto;transition:gap .25s,color .25s}
.premium-service-card .text-link span{display:inline-block;margin-left:4px;transition:transform .25s}
.premium-service-card:hover .text-link span{transform:translate(3px,-2px)}
.service-visual{position:relative;align-self:stretch;min-width:0;min-height:170px;display:grid;place-items:center;overflow:visible}
.visual-orb{position:absolute;border-radius:50%;filter:blur(1px);pointer-events:none}
.visual-orb-one{width:132px;height:132px;background:radial-gradient(circle,rgba(133,126,255,.19),rgba(133,126,255,0) 70%);right:0;top:15px}
.visual-orb-two{width:94px;height:94px;background:radial-gradient(circle,rgba(35,190,202,.16),transparent 70%);left:0;bottom:0}
.visual-device{position:relative;z-index:1;width:118px;height:92px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;filter:drop-shadow(0 15px 12px rgba(62,69,155,.20));transform:rotate(-7deg);transition:transform .45s cubic-bezier(.2,.75,.25,1)}
.premium-service-card:hover .visual-device{transform:translateY(-5px) rotate(-4deg) scale(1.05)}
.visual-device-screen{width:108px;height:75px;padding:8px;border:3px solid #252e65;border-radius:9px;background:linear-gradient(145deg,#e8eaff,#b9c5ff 50%,#d9f5ff);box-shadow:inset 0 0 0 1px #fff}
.visual-screen-top{display:flex;gap:3px;margin-bottom:8px}.visual-screen-top i{width:4px;height:4px;border-radius:50%;background:#8885ee}
.visual-screen-art{height:26px;border-radius:5px;display:flex;gap:4px;align-items:end;padding:4px;background:linear-gradient(120deg,#6c5be8,#58c9d9)}
.visual-screen-art span{flex:1;border-radius:3px;background:rgba(255,255,255,.72);height:45%}.visual-screen-art span:nth-child(2){height:80%}.visual-screen-art span:nth-child(3){height:60%}
.visual-screen-lines{display:grid;gap:3px;margin-top:6px}.visual-screen-lines i{height:2px;border-radius:2px;background:#929bc5;width:80%}.visual-screen-lines i:nth-child(2){width:60%}.visual-screen-lines i:nth-child(3){width:42%}
.visual-device-base{width:128px;height:8px;margin-top:1px;border-radius:2px 2px 9px 9px;background:linear-gradient(180deg,#dfe5ff,#8794ca 55%,#f4f6ff);box-shadow:0 4px 5px #6875b44a}
.visual-floating-icon{position:absolute;z-index:2;right:2px;bottom:18px;width:42px;height:42px;border:1px solid #ffffffd9;border-radius:14px;display:grid;place-items:center;background:linear-gradient(145deg,#fff,#e9eaff);color:#6658e8;font-size:19px;box-shadow:0 10px 24px rgba(77,80,180,.18);animation:sap-float 5.5s ease-in-out infinite}
.visual-spark{position:absolute;z-index:2;width:7px;height:7px;border-radius:2px;background:#8a80ff;box-shadow:0 0 15px #8a80ff;transform:rotate(45deg);animation:sap-float 4s ease-in-out infinite}
.spark-a{top:25px;right:24px}.spark-b{bottom:27px;left:9px;width:5px;height:5px;background:#37bdc6;animation-delay:-2s}
.visual-phone .visual-device{width:75px;height:137px;transform:rotate(9deg)}
.visual-phone .visual-device-screen{width:67px;height:126px;border-radius:14px;padding:8px 5px;border-width:3px;background:linear-gradient(150deg,#b9c6ff,#eeeaff 58%,#b7f0f0)}
.visual-phone .visual-screen-art{height:60px;display:grid;grid-template-columns:1fr 1fr;align-items:stretch}
.visual-phone .visual-screen-art span{height:auto}
.visual-phone .visual-device-base{display:none}
.visual-phone .visual-floating-icon{right:0;bottom:10px}
.visual-shop .visual-device-screen{border-radius:12px;background:linear-gradient(140deg,#ffe8cb,#fff5e8 55%,#e9eaff)}
.visual-shop .visual-screen-art{background:linear-gradient(110deg,#f6a84e,#ffcc82)}
.visual-seo .visual-screen-art{background:linear-gradient(110deg,#8d5de9,#c18cff)}
.visual-seo .visual-screen-art span{height:35%}.visual-seo .visual-screen-art span:nth-child(2){height:70%}.visual-seo .visual-screen-art span:nth-child(3){height:100%}
.visual-marketing .visual-floating-icon{background:linear-gradient(145deg,#fff,#f4e8ff);color:#d15fd2}
.visual-social .visual-floating-icon{background:linear-gradient(145deg,#fff,#e7f5ff);color:#258fe3}
.visual-play .visual-floating-icon{color:#28a4a0}
.visual-automation .visual-screen-art{background:linear-gradient(110deg,#35b6a8,#7475ed)}
.service-bottom-inner{border-radius:25px}
@media(max-width:1050px){
 .service-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
 .premium-service-card{min-height:235px}
}
@media(max-width:680px){
 .service-list-section{padding-top:55px;padding-bottom:60px}
 .service-section-head{grid-template-columns:1fr;gap:12px;margin-bottom:25px}
 .service-section-head>p{border-left:0;border-top:1px solid #e1e5f3;padding:13px 0 0}
 .service-cards{grid-template-columns:1fr;gap:14px}
 .premium-service-card{grid-template-columns:minmax(0,1.15fr) minmax(112px,.85fr);min-height:215px;padding:19px 14px 18px 18px}
 .premium-service-card .service-card-top{margin-bottom:13px}
 .premium-service-card p{min-height:0;margin-bottom:14px}
 .service-visual{min-height:150px}
 .visual-device{transform:scale(.88) rotate(-7deg)}
 .visual-phone .visual-device{transform:scale(.88) rotate(9deg)}
}
@media(prefers-reduced-motion:reduce){
 .premium-service-card,.premium-service-card *{animation:none!important;transition:none!important}
}


/* ==========================================================
   SAPNON SERVICES — LIGHT COSMIC ORBIT + PREMIUM SERVICE CARDS
   Scoped to services.php visual classes. Keeps the existing
   light blue / violet brand palette; no dark-theme takeover.
   ========================================================== */

/* Cosmic atmosphere behind the orbit */
.services-hero-art.services-orbit-stage{
  isolation:isolate;
  overflow:visible;
  border-radius:32px;
  background:
    radial-gradient(ellipse at 50% 48%,rgba(108,113,255,.13) 0%,rgba(108,113,255,.055) 32%,transparent 66%),
    radial-gradient(ellipse at 25% 25%,rgba(69,190,220,.10),transparent 46%),
    radial-gradient(ellipse at 78% 78%,rgba(174,112,255,.10),transparent 48%);
}
.services-hero-art.services-orbit-stage:before,
.services-hero-art.services-orbit-stage:after{
  content:"";
  position:absolute;
  z-index:0;
  inset:7%;
  border-radius:50%;
  pointer-events:none;
  background:
    radial-gradient(circle at 12% 22%,rgba(255,255,255,.95) 0 1px,transparent 2px),
    radial-gradient(circle at 82% 17%,rgba(111,127,255,.65) 0 1.5px,transparent 2.5px),
    radial-gradient(circle at 88% 73%,rgba(54,186,213,.75) 0 1px,transparent 2px),
    radial-gradient(circle at 18% 78%,rgba(155,111,245,.7) 0 1.5px,transparent 2.5px),
    radial-gradient(circle at 53% 8%,rgba(255,255,255,.95) 0 1px,transparent 2px),
    radial-gradient(circle at 6% 53%,rgba(111,127,255,.6) 0 1px,transparent 2px);
  opacity:.85;
  animation:sapGalaxyTwinkle 5.5s ease-in-out infinite alternate;
}
.services-hero-art.services-orbit-stage:after{
  inset:15%;
  transform:rotate(25deg);
  opacity:.55;
  animation-duration:8s;
  animation-direction:alternate-reverse;
}

/* Multi-layer luminous orbit rings */
.services-orbit-stage .services-art-orbit{
  z-index:1;
  border:1px solid rgba(105,117,255,.25);
  box-shadow:0 0 18px rgba(102,111,245,.075),inset 0 0 18px rgba(91,165,224,.045);
  will-change:transform;
}
.services-orbit-stage .orbit-one{
  width:clamp(255px,25vw,322px);
  height:clamp(190px,18vw,238px);
  border-color:rgba(109,112,255,.34);
  transform:rotate(-25deg);
  animation:sapGalaxyRingOne 24s linear infinite;
}
.services-orbit-stage .orbit-two{
  width:clamp(205px,20vw,260px);
  height:clamp(270px,26vw,330px);
  border-color:rgba(39,178,202,.32);
  transform:rotate(42deg);
  animation:sapGalaxyRingTwo 31s linear infinite;
}
.services-orbit-stage .orbit-one:before,
.services-orbit-stage .orbit-two:before{
  content:"";
  position:absolute;
  left:50%;top:-5px;
  width:9px;height:9px;border-radius:50%;
  background:linear-gradient(135deg,#fff,#7d83ff);
  box-shadow:0 0 0 4px rgba(116,123,255,.10),0 0 17px rgba(103,111,255,.75);
}
.services-orbit-stage .orbit-two:before{
  top:auto;left:auto;right:14%;bottom:8%;
  background:linear-gradient(135deg,#fff,#55d4d0);
  box-shadow:0 0 0 4px rgba(65,195,202,.12),0 0 17px rgba(65,195,202,.8);
}

/* Central digital planet — dimensional, but still light and on-brand */
.services-orbit-stage .services-art-core{
  width:clamp(138px,13vw,174px);
  height:clamp(138px,13vw,174px);
  border-radius:50%;
  border:1px solid rgba(255,255,255,.72);
  background:
    radial-gradient(circle at 29% 22%,rgba(255,255,255,.48),transparent 27%),
    radial-gradient(circle at 72% 78%,rgba(28,177,207,.45),transparent 43%),
    linear-gradient(145deg,#514fe0 0%,#7771f1 48%,#49a9d4 100%);
  box-shadow:
    0 18px 48px rgba(76,83,218,.25),
    0 0 0 9px rgba(117,112,246,.055),
    0 0 42px rgba(100,105,246,.28),
    inset -12px -15px 26px rgba(36,61,169,.19),
    inset 8px 8px 20px rgba(255,255,255,.22);
  transform:none;
  animation:sapGalaxyPlanetFloat 6s ease-in-out infinite,sapGalaxyPlanetGlow 5s ease-in-out infinite;
}
.services-orbit-stage .services-art-core:before{
  content:"";
  position:absolute;
  inset:-13px;
  border:1px solid rgba(111,125,255,.26);
  border-radius:50%;
  box-shadow:0 0 22px rgba(107,115,255,.14),inset 0 0 18px rgba(91,174,218,.08);
  transform:rotate(-22deg) scaleX(1.12);
}
.services-orbit-stage .services-art-core:after{
  content:"";
  position:absolute;
  inset:12px 20px auto auto;
  width:34px;height:34px;border-radius:50%;
  background:radial-gradient(circle at 35% 30%,rgba(255,255,255,.75),rgba(255,255,255,.08) 70%,transparent);
  filter:blur(1px);
  pointer-events:none;
}
.services-orbit-stage .services-art-core i{
  position:relative;z-index:1;
  font-size:clamp(26px,2.7vw,36px);
  margin-bottom:7px;
  filter:drop-shadow(0 3px 7px rgba(34,42,125,.22));
}
.services-orbit-stage .services-art-core b{
  position:relative;z-index:1;
  font-size:clamp(17px,1.7vw,21px);
  text-shadow:0 2px 8px rgba(34,42,125,.2);
}
.services-orbit-stage .services-art-core span{
  position:relative;z-index:1;
  font-size:11px;letter-spacing:.08em;text-transform:uppercase;
  opacity:.92;
}

/* Orbiting service-name capsules: clean glass with individual accent colours */
.services-orbit-stage .services-orbit-items{
  z-index:5;
  animation:sap-orbit 58s linear infinite;
}
.services-orbit-stage .services-orbit-item{
  max-width:190px;
}
.services-orbit-stage .services-orbit-item span{
  --orbit-accent:#6668ed;
  --orbit-wash:rgba(102,104,237,.11);
  padding:9px 13px;
  border:1px solid color-mix(in srgb,var(--orbit-accent) 23%,white);
  border-radius:999px;
  background:linear-gradient(135deg,rgba(255,255,255,.98),color-mix(in srgb,var(--orbit-wash) 55%,white));
  color:#34415e;
  box-shadow:0 8px 22px rgba(48,61,119,.10),inset 0 1px 0 #fff;
  font-size:10px;
  font-weight:800;
  letter-spacing:-.01em;
  backdrop-filter:blur(9px);
  -webkit-backdrop-filter:blur(9px);
  animation:sap-orbit-reverse 58s linear infinite,sapGalaxyChipFloat 4.5s ease-in-out infinite;
  transition:background .25s ease,border-color .25s ease,box-shadow .25s ease,color .25s ease,transform .25s ease;
}
.services-orbit-stage .services-orbit-item:nth-child(6n+1) span{--orbit-accent:#5d63ee;--orbit-wash:rgba(93,99,238,.13)}
.services-orbit-stage .services-orbit-item:nth-child(6n+2) span{--orbit-accent:#18a9a8;--orbit-wash:rgba(24,169,168,.13)}
.services-orbit-stage .services-orbit-item:nth-child(6n+3) span{--orbit-accent:#e49a36;--orbit-wash:rgba(228,154,54,.15)}
.services-orbit-stage .services-orbit-item:nth-child(6n+4) span{--orbit-accent:#9860dc;--orbit-wash:rgba(152,96,220,.13)}
.services-orbit-stage .services-orbit-item:nth-child(6n+5) span{--orbit-accent:#438bd9;--orbit-wash:rgba(67,139,217,.13)}
.services-orbit-stage .services-orbit-item:nth-child(6n) span{--orbit-accent:#df6798;--orbit-wash:rgba(223,103,152,.13)}
.services-orbit-stage .services-orbit-item span:hover{
  color:var(--orbit-accent);
  border-color:var(--orbit-accent);
  background:#fff;
  box-shadow:0 12px 28px color-mix(in srgb,var(--orbit-accent) 20%,transparent),0 0 0 4px color-mix(in srgb,var(--orbit-accent) 8%,transparent);
  transform:translateY(-3px) scale(1.04);
}
.services-orbit-stage:hover .services-orbit-items,
.services-orbit-stage:hover .services-orbit-item span{animation-play-state:paused}

/* Service listing: richer colour, clear contrast, consistent premium cards */
.service-list-section{
  position:relative;
  background:
    radial-gradient(ellipse at 4% 0%,rgba(91,116,245,.055),transparent 32%),
    radial-gradient(ellipse at 100% 80%,rgba(33,174,190,.045),transparent 34%),
    linear-gradient(180deg,#fbfcff 0%,#f6f8fd 100%);
}
.service-section-head .eyebrow{
  display:inline-flex;align-items:center;
  padding:6px 10px;border:1px solid #e1e7ff;border-radius:999px;
  background:linear-gradient(120deg,#f0f4ff,#f8f2ff);
  color:#575ce4;
}
.service-section-head h2{color:#17233d}
.service-section-head>p{color:#65738d;line-height:1.8}
.service-cards{gap:19px}
.service-card{
  --service-accent:#5965ed;
  --service-tint:rgba(89,101,237,.11);
  isolation:isolate;
  min-height:245px;
  padding:24px 24px 22px;
  border:1px solid color-mix(in srgb,var(--service-accent) 14%,#e8edf7)!important;
  border-radius:19px!important;
  background:
    radial-gradient(circle at 100% 0%,var(--service-tint),transparent 39%),
    linear-gradient(145deg,#fff 0%,#fff 65%,color-mix(in srgb,var(--service-tint) 60%,white) 100%)!important;
  box-shadow:0 8px 24px rgba(36,55,105,.055),inset 0 1px 0 rgba(255,255,255,.95)!important;
  transition:transform .32s cubic-bezier(.2,.8,.2,1),box-shadow .32s ease,border-color .32s ease!important;
}
.service-card:nth-child(6n+1){--service-accent:#5965ed;--service-tint:rgba(89,101,237,.13)}
.service-card:nth-child(6n+2){--service-accent:#16a6a5;--service-tint:rgba(22,166,165,.13)}
.service-card:nth-child(6n+3){--service-accent:#e59a35;--service-tint:rgba(229,154,53,.16)}
.service-card:nth-child(6n+4){--service-accent:#925bd4;--service-tint:rgba(146,91,212,.13)}
.service-card:nth-child(6n+5){--service-accent:#4389d5;--service-tint:rgba(67,137,213,.13)}
.service-card:nth-child(6n){--service-accent:#d95f91;--service-tint:rgba(217,95,145,.13)}
.service-card:before{
  content:"";position:absolute;z-index:-1;left:0;right:0;top:0;height:3px;
  background:linear-gradient(90deg,var(--service-accent),color-mix(in srgb,var(--service-accent) 8%,white));
  opacity:.9;
}
.service-card:after{
  width:165px;height:165px;right:-90px;top:-94px;
  background:radial-gradient(circle,var(--service-tint),transparent 68%);
  transition:transform .4s ease,opacity .4s ease;
}
.service-card:hover{
  transform:translateY(-7px)!important;
  border-color:color-mix(in srgb,var(--service-accent) 38%,white)!important;
  box-shadow:0 18px 38px rgba(36,55,105,.11),0 5px 18px color-mix(in srgb,var(--service-accent) 10%,transparent)!important;
}
.service-card:hover:after{transform:scale(1.35);opacity:1}
.service-card .service-icon{
  width:50px;height:50px;border-radius:15px;
  color:#fff!important;
  background:linear-gradient(145deg,color-mix(in srgb,var(--service-accent) 72%,white),var(--service-accent))!important;
  border:1px solid color-mix(in srgb,var(--service-accent) 30%,white);
  box-shadow:0 8px 18px color-mix(in srgb,var(--service-accent) 23%,transparent),inset 0 1px 0 rgba(255,255,255,.35);
  transition:transform .3s ease,box-shadow .3s ease;
}
.service-card:hover .service-icon{
  transform:translateY(-3px) rotate(-5deg) scale(1.05);
  box-shadow:0 12px 23px color-mix(in srgb,var(--service-accent) 30%,transparent);
}
.service-card .service-card-number{
  color:var(--service-accent);
  opacity:.72;
  padding:5px 8px;
  border-radius:8px;
  background:var(--service-tint);
}
.service-card h3{color:#1b2944;font-weight:800;letter-spacing:-.025em}
.service-card p{color:#5f6e86;line-height:1.75}
.service-card .text-link{
  color:var(--service-accent);
  font-weight:800;
  transition:gap .2s ease,color .2s ease;
}
.service-card .text-link:hover{color:color-mix(in srgb,var(--service-accent) 75%,#17233d)}
.service-card .text-link span{display:inline-block;transition:transform .2s ease}
.service-card .text-link:hover span{transform:translate(3px,-2px)}
.service-bottom-inner{
  border-color:#dfe6f5;
  background:
    radial-gradient(ellipse at 92% 0%,rgba(112,104,245,.17),transparent 43%),
    radial-gradient(ellipse at 0% 100%,rgba(36,174,190,.10),transparent 42%),
    linear-gradient(115deg,#f8f9ff,#f0f9fc);
  box-shadow:0 15px 38px rgba(30,45,90,.075),inset 0 1px 0 #fff;
}

@keyframes sapGalaxyTwinkle{0%{opacity:.42;transform:scale(.98)}100%{opacity:.95;transform:scale(1.025)}}
@keyframes sapGalaxyRingOne{from{transform:rotate(-25deg)}to{transform:rotate(335deg)}}
@keyframes sapGalaxyRingTwo{from{transform:rotate(42deg)}to{transform:rotate(402deg)}}
@keyframes sapGalaxyPlanetFloat{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-6px) scale(1.018)}}
@keyframes sapGalaxyPlanetGlow{0%,100%{filter:brightness(1)}50%{filter:brightness(1.08)}}
@keyframes sapGalaxyChipFloat{0%,100%{margin-top:0}50%{margin-top:-3px}}

@media(max-width:900px){
  .services-hero-art.services-orbit-stage{min-height:330px}
  .services-orbit-stage .services-art-core{width:145px;height:145px}
  .services-orbit-stage .orbit-one{width:260px;height:195px}
  .services-orbit-stage .orbit-two{width:210px;height:270px}
  .services-orbit-item{transform:rotate(calc(var(--orbit-index)*1turn/var(--orbit-count))) translateY(-122px) rotate(calc(var(--orbit-index)*-1turn/var(--orbit-count)))}
  .service-card{min-height:235px}
}
@media(max-width:700px){
  .services-hero-art.services-orbit-stage{min-height:285px;max-width:440px}
  .services-orbit-stage .services-art-core{width:128px;height:128px}
  .services-orbit-stage .services-art-core i{font-size:27px}
  .services-orbit-stage .services-art-core b{font-size:17px}
  .services-orbit-stage .orbit-one{width:230px;height:175px}
  .services-orbit-stage .orbit-two{width:185px;height:240px}
  .services-orbit-stage .services-orbit-item{transform:rotate(calc(var(--orbit-index)*1turn/var(--orbit-count))) translateY(-108px) rotate(calc(var(--orbit-index)*-1turn/var(--orbit-count)))}
  .services-orbit-stage .services-orbit-item span{font-size:9px;padding:7px 9px}
  .service-card{padding:21px!important;min-height:unset}
}
@media(prefers-reduced-motion:reduce){
  .services-orbit-stage:before,.services-orbit-stage:after,
  .services-orbit-stage .services-art-orbit,
  .services-orbit-stage .services-art-core,
  .services-orbit-stage .services-orbit-items,
  .services-orbit-stage .services-orbit-item span,
  .service-card,.service-card:after,.service-card .service-icon{
    animation:none!important;transition:none!important
  }
}