:root {
    --svc-ink: #07152f;
    --svc-navy: #102653;
    --svc-text: #12213f;
    --svc-muted: #6c7c99;
    --svc-line: #dce5f4;
    --svc-soft: #f4f7fc;
    --svc-accent: #ffb51b;
    --svc-ease: 260ms cubic-bezier(.2,.8,.2,1);
}

.svc-page { --svc-accent-two: #5b8cff; --svc-accent-three: #72d8ff; overflow: hidden; color: var(--svc-text); background: #f4f7fc; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.svc-page *, .svc-page *::before, .svc-page *::after { box-sizing: border-box; }
.svc-shell { width: min(1180px, calc(100% - 40px)); margin: 0 auto; }
.svc-label { display: inline-flex; align-items: center; gap: 7px; color: var(--svc-accent); font-size: 10px; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.svc-hero { position: relative; isolation: isolate; display: grid; grid-template-columns: .9fr 1.1fr; gap: 55px; align-items: center; min-height: 600px; padding: 76px clamp(24px, 6vw, 84px); margin: 0 auto; background: linear-gradient(135deg, var(--svc-navy), var(--svc-ink) 62%, #18265e); }
.svc-shell-panel { width: min(1240px, calc(100% - 40px)); border-radius: 0 0 28px 28px; }
.svc-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .28; background-image: linear-gradient(rgba(152,186,255,.12) 1px, transparent 1px), linear-gradient(90deg, rgba(152,186,255,.12) 1px, transparent 1px); background-size: 48px 48px; mask-image: linear-gradient(#000, transparent 88%); }
.svc-hero::after { content: ""; position: absolute; z-index: -1; right: 4%; top: 8%; width: 230px; height: 230px; border-radius: 50%; background: rgba(91,140,255,.2); filter: blur(58px); }
.svc-hero-copy { position: relative; z-index: 2; }
.svc-hero h1 { max-width: 650px; margin: 18px 0 20px; color: #fff; font-size: clamp(42px, 5vw, 70px); font-weight: 900; letter-spacing: -.05em; line-height: 1.02; }
.svc-hero h1 em { color: transparent; background: linear-gradient(100deg, var(--svc-accent-two), var(--svc-accent-three)); -webkit-background-clip: text; background-clip: text; font-style: normal; }
.svc-hero p { max-width: 550px; margin: 0; color: #b8c7e5; font-size: 15px; line-height: 1.75; }
.svc-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-top: 28px; }
.svc-btn { display: inline-flex; align-items: center; justify-content: center; gap: 11px; min-height: 50px; padding: 0 20px; border: 1px solid transparent; border-radius: 12px; font-size: 12px; font-weight: 850; text-decoration: none; transition: transform var(--svc-ease), box-shadow var(--svc-ease), background var(--svc-ease), border-color var(--svc-ease); }
.svc-btn i { font-size: 11px; transition: transform var(--svc-ease); }
.svc-btn:hover { transform: translateY(-3px); }
.svc-btn:hover i { transform: translate(3px, -3px); }
.svc-btn-primary { color: #17233f; background: var(--svc-accent); box-shadow: 0 12px 25px rgba(255,181,27,.2); }
.svc-btn-primary:hover { background: #ffd05a; box-shadow: 0 17px 30px rgba(255,181,27,.3); }
.svc-btn-light { color: #e8efff; border-color: rgba(181,204,250,.3); background: rgba(255,255,255,.05); }
.svc-btn-light:hover { border-color: rgba(181,204,250,.7); background: rgba(255,255,255,.1); }
.svc-strip { border-top: 1px solid var(--svc-line); border-bottom: 1px solid var(--svc-line); background: #eef3fa; }
.svc-strip-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.svc-strip-grid span { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 68px; padding: 8px 12px; border-right: 1px solid var(--svc-line); color: #526783; font-size: 11px; font-weight: 800; text-align: center; transition: background var(--svc-ease), transform var(--svc-ease); }
.svc-strip-grid span:last-child { border-right: 0; }
.svc-strip-grid span:hover { background: #fff; transform: translateY(-2px); }
.svc-strip-grid i { color: var(--svc-accent); }
.svc-section { padding: 105px 0; }
.svc-light { background: #f4f7fc; border-bottom: 1px solid var(--svc-line); }
.svc-white { background: #fff; border-bottom: 1px solid var(--svc-line); }
.svc-blue-light { background: linear-gradient(135deg, #edf3ff, #f8faff 60%, #f2edff); border-bottom: 1px solid var(--svc-line); }
.svc-feature-dark { color: #fff; background: linear-gradient(135deg, #0b1b3a, #102653 60%, #172f68); border-top: 1px solid rgba(141,180,255,.18); border-bottom: 1px solid rgba(141,180,255,.2); }
.svc-split { display: grid; grid-template-columns: .85fr 1.15fr; gap: 70px; align-items: center; }
.svc-heading { max-width: 620px; margin-bottom: 40px; }
.svc-heading h2, .svc-split h2 { margin: 13px 0; color: var(--svc-text); font-size: clamp(32px, 4vw, 53px); font-weight: 900; letter-spacing: -.045em; line-height: 1.04; }
.svc-heading p, .svc-split p { margin: 0; color: var(--svc-muted); font-size: 14px; line-height: 1.75; }
.svc-heading-light h2 { color: #fff; }
.svc-heading-light p { color: #b8c7e5; }
.svc-card-grid { display: grid; gap: 14px; }
.svc-card-grid-four { grid-template-columns: repeat(4, 1fr); }
.svc-card-grid-six { grid-template-columns: repeat(3, 1fr); }
.svc-card-grid article { position: relative; min-height: 205px; padding: 23px; overflow: hidden; border: 1px solid var(--svc-line); border-radius: 19px; background: #fff; box-shadow: 0 10px 25px rgba(20,48,97,.06); transition: transform var(--svc-ease), border-color var(--svc-ease), box-shadow var(--svc-ease); }
.svc-card-grid article::before { content: ""; position: absolute; top: 0; right: 15%; left: 15%; height: 3px; border-radius: 0 0 8px 8px; background: linear-gradient(90deg, var(--svc-accent-two), var(--svc-accent), var(--svc-accent-three)); }
.svc-card-grid article:hover { transform: translateY(-6px); border-color: #a9c1e8; box-shadow: 0 20px 38px rgba(20,48,97,.13); }
.svc-card-grid article > i { width: 42px; height: 42px; display: grid; place-items: center; margin-bottom: 19px; border-radius: 12px; font-size: 17px; }
.svc-card-grid h3 { margin: 0 0 9px; color: var(--svc-text); font-size: 15px; line-height: 1.25; }
.svc-card-grid p { margin: 0; color: var(--svc-muted); font-size: 11px; line-height: 1.65; }
.svc-icon-blue { color: #315fce; background: #edf3ff; }.svc-icon-green { color: #159a75; background: #e5f8f1; }.svc-icon-purple { color: #8057ca; background: #f1eaff; }.svc-icon-orange { color: #d58b00; background: #fff1d8; }.svc-icon-cyan { color: #138ead; background: #e4f8fc; }.svc-icon-pink { color: #cb577e; background: #ffedf4; }.svc-icon-yellow { color: #bd7d00; background: #fff5dc; }
.svc-feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.svc-feature-grid span, .svc-reasons span { display: flex; align-items: center; gap: 12px; min-height: 64px; padding: 16px; border: 1px solid rgba(150,186,255,.18); border-radius: 14px; color: #d7e4ff; background: rgba(255,255,255,.06); font-size: 12px; font-weight: 800; transition: transform var(--svc-ease), background var(--svc-ease); }
.svc-feature-grid span:hover, .svc-reasons span:hover { transform: translateY(-5px); background: rgba(91,140,255,.14); }
.svc-feature-grid i, .svc-reasons i { color: var(--svc-accent); }
.svc-timeline { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.svc-timeline::before { content: ""; position: absolute; top: 24px; left: 8%; right: 8%; height: 1px; background: linear-gradient(90deg, #628be0, #9b7be0, #54bda0, #e8b448); }
.svc-timeline article { position: relative; z-index: 1; }
.svc-timeline article > b { width: 48px; height: 48px; display: grid; place-items: center; margin-bottom: 22px; border: 1px solid #7192db; border-radius: 50%; color: #315fce; background: #f6f8fc; box-shadow: 0 0 0 7px #f6f8fc, 0 0 23px rgba(49,95,206,.2); font-size: 12px; }
.svc-timeline h3 { margin: 0 0 8px; color: var(--svc-text); font-size: 16px; }.svc-timeline p { max-width: 220px; margin: 0; color: var(--svc-muted); font-size: 12px; line-height: 1.65; }
.svc-feature-dark .svc-timeline article > b { color: #bcd0ff; background: #102653; box-shadow: 0 0 0 7px #102653, 0 0 23px rgba(91,140,255,.25); }.svc-feature-dark .svc-timeline h3 { color: #fff; }.svc-feature-dark .svc-timeline p { color: #b8c7e5; }
.svc-faq { background: #fff; border-bottom: 1px solid var(--svc-line); }.svc-faq-layout { display: grid; grid-template-columns: .75fr 1.25fr; gap: 70px; align-items: center; }.svc-faq-list { padding: 10px 17px; border: 1px solid var(--svc-line); border-radius: 22px; background: #fff; box-shadow: 0 18px 38px rgba(20,48,97,.08); }.svc-faq-list article { margin: 4px 0; border: 1px solid transparent; border-bottom-color: #e5ebf5; border-radius: 12px; transition: background var(--svc-ease), border-color var(--svc-ease); }.svc-faq-list article:last-child { border-bottom-color: transparent; }.svc-faq-list article:hover, .svc-faq-list article.is-open { border-color: #d8e3f4; background: #f7faff; }.svc-faq-list button { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 19px 14px; border: 0; color: var(--svc-text); background: transparent; font: inherit; font-size: 13px; font-weight: 800; text-align: left; cursor: pointer; }.svc-faq-list button i { color: var(--svc-accent-two); transition: transform var(--svc-ease), color var(--svc-ease); }.svc-faq-list article.is-open button i { color: var(--svc-accent); transform: rotate(45deg); }.svc-faq-list article p { display: grid; grid-template-rows: 0fr; overflow: hidden; max-height: 0; margin: 0; padding: 0 14px; color: var(--svc-muted); font-size: 12px; line-height: 1.7; transition: max-height 320ms ease, padding 320ms ease; }.svc-faq-list article.is-open p { max-height: 150px; padding: 0 14px 18px; }
.svc-cta { position: relative; isolation: isolate; overflow: hidden; padding: 86px 0; color: #fff; text-align: center; background: linear-gradient(135deg, #07152f, #102653 60%, #172f68); }.svc-cta::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .25; background-image: linear-gradient(rgba(150,190,255,.14) 1px, transparent 1px), linear-gradient(90deg, rgba(150,190,255,.14) 1px, transparent 1px); background-size: 48px 48px; mask-image: linear-gradient(#000, transparent 90%); }.svc-cta h2 { max-width: 740px; margin: 14px auto; color: #fff; font-size: clamp(34px, 4.5vw, 58px); line-height: 1.03; letter-spacing: -.045em; }.svc-cta p { max-width: 530px; margin: 0 auto; color: #b8c7e5; font-size: 14px; line-height: 1.7; }.svc-cta .svc-actions { justify-content: center; }
.svc-phone-stage { position: relative; min-height: 420px; }.svc-phone { position: absolute; width: 185px; height: 375px; padding: 9px; border: 3px solid #526da4; border-radius: 29px; background: #0a1632; box-shadow: 0 28px 50px rgba(0,0,0,.35); }.svc-phone-screen { height: 100%; overflow: hidden; padding: 19px 15px; border-radius: 21px; background: linear-gradient(150deg, #eff5ff, #aacbff 52%, #805cc2); color: #17233f; }.svc-phone-screen small { color: #6176a5; font-size: 7px; letter-spacing: .1em; }.svc-phone-screen strong { display: block; margin-top: 25px; font-size: 22px; line-height: 1.1; }.svc-phone-screen em { color: #6847ab; font-style: normal; }.svc-phone-back { top: 17%; left: 16%; transform: rotate(-10deg); opacity: .78; }.svc-phone-back .svc-phone-screen { background: linear-gradient(150deg, #fff4d8, #efc86c 55%, #cf7c76); }.svc-phone-back b { display: block; margin-bottom: 22px; }.svc-screen-line { display: block; width: 80%; height: 6px; margin: 10px 0; border-radius: 5px; background: #7e6ca2; }.svc-screen-card { display: block; height: 48px; margin: 12px 0; border-radius: 10px; background: rgba(255,255,255,.65); }.svc-phone-front { top: 4%; right: 17%; transform: rotate(7deg); z-index: 2; }.svc-screen-chart { display: block; height: 112px; margin-top: 22px; border-radius: 14px; background: linear-gradient(155deg, #315fce 0 45%, #7d54bd 45% 70%, #ffb51b 70%); }.svc-screen-button { display: block; margin-top: 22px; padding: 10px; border-radius: 8px; color: #fff; background: #172f68; font-size: 9px; text-align: center; }.svc-float { position: absolute; z-index: 4; display: inline-flex; align-items: center; gap: 7px; padding: 10px 12px; border: 1px solid rgba(180,208,255,.28); border-radius: 10px; color: #dce8ff; background: rgba(10,25,57,.85); box-shadow: 0 13px 30px rgba(0,0,0,.22); font-size: 9px; animation: svcFloat 5s ease-in-out infinite; }.svc-float i { color: var(--svc-accent); }.svc-float-one { top: 7%; left: 4%; }.svc-float-two { right: 2%; bottom: 25%; animation-delay: 1s; }.svc-float-three { bottom: 5%; left: 18%; animation-delay: 2s; }
.svc-dashboard, .svc-analytics, .svc-module-board { position: relative; min-height: 335px; border: 1px solid rgba(170,202,255,.3); border-radius: 18px; background: rgba(10,24,56,.78); box-shadow: 0 25px 55px rgba(0,0,0,.28); }.svc-dashboard-top, .svc-analytics-head { display: flex; align-items: center; gap: 7px; padding: 16px; border-bottom: 1px solid rgba(170,202,255,.16); color: #aebfe0; font-size: 9px; }.svc-dashboard-top i { width: 7px; height: 7px; border-radius: 50%; background: #f06a74; }.svc-dashboard-top i:nth-child(2) { background: #ffbf37; }.svc-dashboard-top i:nth-child(3) { background: #5bdda5; }.svc-dashboard-top b { margin-left: auto; font-size: 9px; }.svc-dashboard-body { display: grid; grid-template-columns: 54px 1fr; min-height: 276px; }.svc-dashboard-body aside { display: flex; flex-direction: column; gap: 20px; padding: 25px 18px; border-right: 1px solid rgba(170,202,255,.16); }.svc-dashboard-body aside span { width: 18px; height: 5px; border-radius: 5px; background: #6076a4; }.svc-dashboard-body main { padding: 27px; color: #fff; }.svc-dashboard-body small, .svc-analytics small { display: block; color: #73d2bc; font-size: 8px; letter-spacing: .1em; }.svc-dashboard-body strong { display: block; margin-top: 8px; font-size: 22px; }.svc-chart, .svc-growth-chart { display: flex; align-items: end; gap: 9px; height: 130px; margin-top: 25px; padding: 15px; border-radius: 12px; background: rgba(95,140,235,.13); }.svc-chart i, .svc-growth-chart i { flex: 1; border-radius: 5px 5px 0 0; background: linear-gradient(#70d5b5, #3e77ce); }.svc-chart i:nth-child(1) { height: 35%; }.svc-chart i:nth-child(2) { height: 58%; }.svc-chart i:nth-child(3) { height: 44%; }.svc-chart i:nth-child(4) { height: 78%; }.svc-chart i:nth-child(5) { height: 92%; }.svc-module-row { display: flex; gap: 8px; margin-top: 19px; }.svc-module-row span { padding: 7px 8px; border-radius: 6px; color: #b9caff; background: rgba(91,140,255,.18); font-size: 8px; }.svc-workflow, .svc-automation { display: flex; align-items: center; justify-content: center; gap: 13px; padding: 23px; border: 1px solid var(--svc-line); border-radius: 18px; background: #fff; }.svc-workflow span, .svc-automation span { padding: 14px; border-radius: 10px; color: #315fce; background: #edf3ff; font-size: 11px; font-weight: 850; }.svc-workflow i, .svc-automation i { color: var(--svc-accent); }
.svc-analytics { padding: 23px; background: linear-gradient(145deg, #281d52, #1d234e); }.svc-analytics-head { justify-content: space-between; padding: 0 0 15px; border-bottom: 0; }.svc-analytics-head b { color: #69dbab; font-size: 16px; }.svc-growth-chart i:nth-child(1) { height: 25%; }.svc-growth-chart i:nth-child(2) { height: 40%; }.svc-growth-chart i:nth-child(3) { height: 35%; }.svc-growth-chart i:nth-child(4) { height: 59%; }.svc-growth-chart i:nth-child(5) { height: 73%; }.svc-growth-chart i:nth-child(6) { height: 94%; background: linear-gradient(#ffb2a4, #ff8cbb); }.svc-analytics-cards { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; margin-top: 13px; }.svc-analytics-cards span, .svc-ranking { padding: 11px; border: 1px solid rgba(255,255,255,.12); border-radius: 9px; background: rgba(255,255,255,.07); }.svc-analytics-cards small { color: #b3b1d2; font-size: 7px; }.svc-analytics-cards strong { display: block; margin-top: 6px; color: #fff; font-size: 15px; }.svc-ranking { display: flex; align-items: center; gap: 8px; margin-top: 10px; color: #d8def5; font-size: 9px; }.svc-ranking i { color: #ff9a83; }.svc-ranking b { margin-left: auto; color: #70dbad; }.svc-metric-stack { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; }.svc-metric-stack article { padding: 19px; border: 1px solid var(--svc-line); border-radius: 14px; background: #fff; }.svc-metric-stack b { color: #d58b00; font-size: 10px; }.svc-metric-stack strong { display: block; margin: 18px 0 7px; }.svc-metric-stack span { color: var(--svc-muted); font-size: 11px; line-height: 1.5; }.svc-campaign-flow { display: flex; align-items: center; justify-content: space-between; gap: 12px; }.svc-campaign-flow span { display: flex; align-items: center; gap: 9px; padding: 14px; border: 1px solid rgba(157,190,255,.2); border-radius: 12px; color: #dce8ff; background: rgba(255,255,255,.06); font-size: 11px; font-weight: 800; }.svc-campaign-flow b { color: var(--svc-accent); }.svc-campaign-flow > i { color: #8eb4ff; }.svc-reasons { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }.svc-architecture { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }.svc-architecture span { padding: 18px; border: 1px solid rgba(91,211,174,.24); border-radius: 12px; color: #bdebdc; background: rgba(54,172,132,.1); font-size: 12px; font-weight: 800; }.svc-architecture i { margin-right: 8px; color: #5bd3ae; }.svc-dashboard-split { display: grid; grid-template-columns: .9fr 1.1fr; gap: 70px; align-items: center; }.svc-mini-dashboard { padding: 25px; border: 1px solid rgba(91,211,174,.28); border-radius: 17px; background: rgba(44,165,127,.1); color: #fff; }.svc-mini-dashboard small { color: #71dfba; font-size: 9px; }.svc-mini-dashboard strong { display: block; margin-top: 10px; font-size: 24px; }.svc-mini-bars { display: flex; align-items: end; gap: 10px; height: 110px; margin: 25px 0; padding: 15px; border-radius: 10px; background: rgba(0,0,0,.14); }.svc-mini-bars i { flex: 1; border-radius: 5px 5px 0 0; background: #5bd3ae; }.svc-mini-bars i:nth-child(1){height:35%}.svc-mini-bars i:nth-child(2){height:55%}.svc-mini-bars i:nth-child(3){height:42%}.svc-mini-bars i:nth-child(4){height:76%}.svc-mini-bars i:nth-child(5){height:92%}.svc-mini-dashboard > div:last-child { display: flex; justify-content: space-between; color: #b8e7d7; font-size: 10px; }.svc-mini-dashboard b { color: #fff; }
.svc-page article, .svc-page .svc-module, .svc-page .svc-float { opacity: 0; transform: translateY(16px); transition: opacity 600ms ease, transform 600ms ease, box-shadow var(--svc-ease), border-color var(--svc-ease); }.svc-page article.is-visible, .svc-page .svc-module.is-visible, .svc-page .svc-float.is-visible { opacity: 1; transform: translateY(0); }
@keyframes svcFloat { 0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)} }
@media (max-width: 900px) { .svc-hero { grid-template-columns: 1fr; gap: 25px; padding: 62px 35px 70px; }.svc-hero-copy { max-width: 650px; }.svc-card-grid-four { grid-template-columns: repeat(2,1fr); }.svc-card-grid-six { grid-template-columns: repeat(2,1fr); }.svc-split, .svc-dashboard-split { grid-template-columns: 1fr; gap: 38px; }.svc-heading { margin-bottom: 30px; }.svc-phone-stage { max-width: 560px; margin: 0 auto; width: 100%; }.svc-faq-layout { grid-template-columns: 1fr; gap: 38px; }.svc-feature-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 560px) { .svc-shell { width: min(100% - 30px, 1180px); }.svc-shell-panel { width: calc(100% - 24px); border-radius: 0 0 20px 20px; }.svc-hero { padding: 48px 22px 55px; }.svc-hero h1 { font-size: clamp(38px, 11.5vw, 55px); }.svc-hero p { font-size: 13px; line-height: 1.65; }.svc-actions { flex-direction: column; align-items: stretch; }.svc-btn { width: 100%; }.svc-strip-grid { grid-template-columns: 1fr 1fr; }.svc-strip-grid span { min-height: 60px; font-size: 10px; }.svc-strip-grid span:nth-child(2) { border-right: 0; }.svc-strip-grid span:nth-child(-n+2) { border-bottom: 1px solid var(--svc-line); }.svc-section { padding: 74px 0; }.svc-heading h2, .svc-split h2 { font-size: 34px; }.svc-card-grid-four, .svc-card-grid-six { grid-template-columns: 1fr; }.svc-card-grid article { min-height: 0; padding: 20px; }.svc-feature-grid, .svc-reasons, .svc-architecture { grid-template-columns: 1fr; }.svc-timeline { grid-template-columns: 1fr; gap: 0; padding-left: 24px; }.svc-timeline::before { top: 24px; bottom: 24px; left: 24px; right: auto; width: 1px; height: auto; background: linear-gradient(#628be0,#9b7be0,#54bda0,#e8b448); }.svc-timeline article { display: grid; grid-template-columns: 48px 1fr; gap: 18px; min-height: 120px; }.svc-timeline article > b { margin: 0; }.svc-feature-dark .svc-timeline article > b { box-shadow: 0 0 0 7px #102653, 0 0 23px rgba(91,140,255,.25); }.svc-workflow, .svc-automation, .svc-campaign-flow { flex-wrap: wrap; }.svc-workflow i, .svc-automation i, .svc-campaign-flow > i { display: none; }.svc-metric-stack { grid-template-columns: 1fr; }.svc-phone-stage { min-height: 340px; transform: scale(.86); transform-origin: top center; margin-bottom: -46px; }.svc-phone { width: 155px; height: 320px; }.svc-phone-back { left: 7%; }.svc-phone-front { right: 7%; }.svc-float { transform: scale(.85); }.svc-float-one { left: -4%; }.svc-float-two { right: -5%; }.svc-float-three { left: 13%; }.svc-dashboard, .svc-analytics, .svc-module-board { min-height: 290px; }.svc-dashboard-body main { padding: 20px; }.svc-chart, .svc-growth-chart { height: 105px; }.svc-module-board { transform: scale(.9); transform-origin: center; margin: -15px -12px; }.svc-cta { padding: 58px 0; }.svc-cta h2 { font-size: 36px; }.svc-cta .svc-actions { margin-top: 23px; }.svc-faq-list { padding: 8px 10px; border-radius: 18px; } }
@media (prefers-reduced-motion: reduce) { .svc-page *, .svc-page *::before, .svc-page *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }.svc-page article, .svc-page .svc-module, .svc-page .svc-float { opacity: 1; transform: none; } }

.svc-mobile { --svc-accent-two: #8667e8; --svc-accent-three: #68d8ff; }.svc-software { --svc-accent-two: #21a37b; --svc-accent-three: #61d2bf; }.svc-marketing { --svc-accent-two: #e66b9f; --svc-accent-three: #a66bf2; }.svc-business { --svc-accent-two: #4c8df5; --svc-accent-three: #58c796; }
.svc-mobile .svc-hero::after { background: rgba(137,92,240,.24); }.svc-software .svc-hero::after { background: rgba(44,194,142,.2); }.svc-marketing .svc-hero::after { background: rgba(224,86,157,.22); }.svc-business .svc-hero::after { background: rgba(255,181,27,.15); }

/* Blue outer gutters around the centered hero panel. */
.svc-page {
    background: #102653;
}

.svc-page .svc-hero {
    background: #102653;
}

.svc-page .svc-hero::after {
    display: none;
}

.svc-business .svc-module-board {
    min-height: 335px;
    overflow: hidden;
    background:
        radial-gradient(circle at 50% 50%, rgba(76, 141, 245, 0.16), transparent 34%),
        #0b1b3a;
}

.svc-business .svc-module-board::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 210px;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(91, 199, 150, 0.8), transparent);
    transform: translate(-50%, -50%);
}

.svc-business .svc-board-core {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    display: grid;
    place-items: center;
    width: 126px;
    height: 82px;
    border: 1px solid rgba(135, 190, 255, 0.55);
    border-radius: 16px;
    color: #ffffff;
    background: linear-gradient(145deg, #315fce, #173b67);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.28), 0 0 28px rgba(76, 141, 245, 0.22);
    text-align: center;
    transform: translate(-50%, -50%);
}

.svc-business .svc-board-core i {
    margin-bottom: 5px;
    color: #ffb51b;
    font-size: 17px;
}

.svc-business .svc-board-core strong {
    font-size: 10px;
    letter-spacing: 0.08em;
    line-height: 1.25;
}

.svc-business .svc-module {
    position: absolute;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-width: 108px;
    padding: 10px 11px;
    border: 1px solid rgba(153, 195, 255, 0.35);
    border-radius: 10px;
    color: #e4edff;
    background: rgba(24, 53, 105, 0.96);
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.2);
    font-size: 10px;
    font-weight: 800;
    white-space: nowrap;
}

.svc-business .svc-module i {
    color: #58c796;
    font-size: 12px;
}

.svc-business .svc-module-finance { top: 12%; left: 8%; }
.svc-business .svc-module-people { top: 12%; right: 8%; }
.svc-business .svc-module-customer { top: 43%; left: 4%; }
.svc-business .svc-module-stock { top: 43%; right: 4%; }
.svc-business .svc-module-report { bottom: 12%; left: 8%; }
.svc-business .svc-module-comms { right: 8%; bottom: 12%; }

@media (max-width: 560px) {
    .svc-business .svc-module-board {
        min-height: 290px;
        transform: none;
        margin: 0;
    }

    .svc-business .svc-board-core {
        width: 108px;
        height: 72px;
    }

    .svc-business .svc-module {
        min-width: 92px;
        padding: 8px;
        font-size: 8px;
    }

    .svc-business .svc-module-finance { left: 3%; }
    .svc-business .svc-module-people { right: 3%; }
    .svc-business .svc-module-report { left: 3%; }
    .svc-business .svc-module-comms { right: 3%; }
}

.svc-page .svc-blue-light .svc-reasons span {
    color: var(--svc-text);
    border-color: var(--svc-line);
    background: #ffffff;
    box-shadow: 0 10px 24px rgba(20, 48, 97, 0.06);
}

.svc-page .svc-blue-light .svc-reasons span:hover {
    background: #f7faff;
    border-color: #b9ccef;
    box-shadow: 0 16px 30px rgba(20, 48, 97, 0.11);
}

.svc-page .svc-blue-light .svc-reasons i {
    color: #d58b00;
}