.service-landing {
  --service-accent: #3ea7b4;
  --service-accent-rgb: 62, 167, 180;
  --service-deep: #24666e;
  --service-bg: #07111f;
  overflow: clip;
  color: #dce8f4;
  background: var(--service-bg);
  font-family: "JetBrains Mono", monospace;
}
.service-landing--crimson { --service-accent: #e33e67; --service-accent-rgb: 227, 62, 103; --service-deep: #9d2445; }
.service-landing--violet { --service-accent: #a34dff; --service-accent-rgb: 163, 77, 255; --service-deep: #6330b8; }
.service-landing--azure { --service-accent: #18aee0; --service-accent-rgb: 24, 174, 224; --service-deep: #1975b9; }
.service-landing--emerald { --service-accent: #32d39b; --service-accent-rgb: 50, 211, 155; --service-deep: #13855e; }
.service-landing--amber { --service-accent: #f6b93b; --service-accent-rgb: 246, 185, 59; --service-deep: #bf7617; }
.service-landing--orange { --service-accent: #ff7747; --service-accent-rgb: 255, 119, 71; --service-deep: #bd4527; }
.service-landing--indigo { --service-accent: #7277ff; --service-accent-rgb: 114, 119, 255; --service-deep: #4248b5; }
body.service-theme-turquoise { --service-accent:#3ea7b4; --service-accent-rgb:62,167,180; } body.service-theme-crimson { --service-accent:#e33e67; --service-accent-rgb:227,62,103; } body.service-theme-violet { --service-accent:#a34dff; --service-accent-rgb:163,77,255; } body.service-theme-azure { --service-accent:#18aee0; --service-accent-rgb:24,174,224; } body.service-theme-emerald { --service-accent:#32d39b; --service-accent-rgb:50,211,155; } body.service-theme-amber { --service-accent:#f6b93b; --service-accent-rgb:246,185,59; } body.service-theme-orange { --service-accent:#ff7747; --service-accent-rgb:255,119,71; } body.service-theme-indigo { --service-accent:#7277ff; --service-accent-rgb:114,119,255; }
.service-landing *, .service-landing *::before, .service-landing *::after { box-sizing: border-box; }
.service-theme #header { background: rgba(7, 17, 31, .94); border-bottom: 1px solid rgba(255, 255, 255, .07); backdrop-filter: blur(14px); }
.service-theme #header .navbar > ul > li > a, .service-theme #header .navbar > ul > li > a:focus { color: #edf6ff; }
.service-theme #header .navbar > ul > li > a:hover, .service-theme #header .navbar > ul > li > .active { color: var(--service-accent, #47b2e4); }
.service-theme #header .navbar .dropdown > ul { width: 278px; max-height: calc(100vh - 78px); padding: 10px; overflow-y: auto; border: 1px solid rgba(var(--service-accent-rgb, 62,167,180), .28); border-radius: 8px; background: #0b1928; box-shadow: 0 22px 55px rgba(0,0,0,.42); }
.service-theme #header .navbar .dropdown > ul > li { min-width: 0; }
.service-theme #header .navbar .dropdown > ul a, .service-theme #header .navbar .dropdown > ul a:focus { padding: 11px 13px; color: #d9e6f2; border-radius: 5px; font-size: 12px; line-height: 1.35; white-space: normal; }
.service-theme #header .navbar .dropdown > ul a::before { display: none; }
.service-theme #header .navbar .dropdown > ul a:hover, .service-theme #header .navbar .dropdown > ul li:hover > a { color: #07111f; background: var(--service-accent, #3ea7b4); }
.service-theme #footer { margin-top:0; background:radial-gradient(circle at 84% 0,color-mix(in srgb,var(--service-accent) 24%,transparent),transparent 38%),#07111f; }
.service-theme #footer .footer-top { border-top:1px solid color-mix(in srgb,var(--service-accent) 40%,transparent); }
.service-theme #footer .hero-text { color:var(--service-accent); background:none; -webkit-text-fill-color:var(--service-accent); }
.service-theme #footer .footer-top h4, .service-theme #footer .footer-top .footer-links ul i { color:var(--service-accent); }
.service-theme #footer .footer-top .footer-links ul a { color:#c7d5e3; }
.service-theme #footer .footer-top .footer-links ul a:hover { color:var(--service-accent); }
.service-theme #footer .copyright-wrap { border-top-color:color-mix(in srgb,var(--service-accent) 42%,transparent); }
.service-theme #footer .social-links a { border:1px solid color-mix(in srgb,var(--service-accent) 38%,transparent); background:color-mix(in srgb,var(--service-accent) 14%,transparent); }
.service-theme #footer .social-links a:hover { color:#07111f; background:var(--service-accent); }
.service-hero { position: relative; min-height: 820px; display: flex; align-items: center; padding: 155px 0 100px; isolation: isolate; background: radial-gradient(circle at 76% 42%, rgba(var(--service-accent-rgb), .14), transparent 28%), linear-gradient(135deg, #07111f 0%, #091624 55%, #06101d 100%); }
.service-hero::before { content: ""; position: absolute; z-index: -2; inset: 0; opacity: .48; background: repeating-linear-gradient(132deg, transparent 0 58px, rgba(42, 67, 92, .22) 59px 83px, transparent 84px 132px); clip-path: polygon(13% 14%, 100% 6%, 100% 92%, 0 100%, 0 71%); }
.service-hero::after { content: ""; position: absolute; z-index: -1; width: 56vw; height: 56vw; max-width: 780px; max-height: 780px; right: -12vw; top: 14%; border: 1px solid rgba(var(--service-accent-rgb), .13); border-radius: 50%; box-shadow: 0 0 0 80px rgba(var(--service-accent-rgb), .025), 0 0 0 160px rgba(var(--service-accent-rgb), .018); }
.service-noise { position: absolute; inset: 0; z-index: -1; opacity: .22; pointer-events: none; background-image: linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px); background-size: 48px 48px; mask-image: linear-gradient(to bottom, #000 15%, transparent 88%); }
.service-hero-layout { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0, 1.02fr) minmax(430px, .98fr); align-items: center; gap: clamp(40px, 6vw, 96px); }
.service-hero-copy { max-width: 700px; }
.service-kicker, .service-section-heading > span, .service-related article > div > span { display: inline-flex; align-items: center; gap: 10px; color: var(--service-accent); font-size: .77rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.service-kicker::before { content: ""; width: 34px; height: 2px; background: var(--service-accent); }
.service-hero h1 { max-width: 780px; margin: 22px 0 16px; color: #fff; font: 700 clamp(3rem, 5vw, 5.7rem)/.98 "JetBrains Mono", monospace; letter-spacing: -.065em; text-wrap: balance; }
.service-hero-line { max-width: 690px; margin: 0 0 24px; color: var(--service-accent); font: italic 600 clamp(1.25rem, 2vw, 1.75rem)/1.45 "JetBrains Mono", monospace; }
.service-intro { max-width: 670px; margin: 0; color: #aec0d1; font: 400 1rem/1.8 "Open Sans", sans-serif; }
.service-actions { display: flex; flex-wrap: wrap; gap: 13px; margin-top: 34px; }
.service-button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 50px; padding: 12px 22px; border: 1px solid transparent; border-radius: 5px; font-size: .86rem; font-weight: 700; letter-spacing: .02em; transition: color .25s ease, background .25s ease, border-color .25s ease, transform .25s ease, box-shadow .25s ease; }
.service-button--primary { color: #07111f; background: var(--service-accent); box-shadow: 0 12px 34px rgba(var(--service-accent-rgb), .24); }
.service-button--primary:hover { color: #07111f; transform: translateY(-3px); box-shadow: 0 16px 42px rgba(var(--service-accent-rgb), .36); }
.service-button--ghost { color: #e8f1fa; border-color: rgba(255,255,255,.22); background: rgba(255,255,255,.03); }
.service-button--ghost:hover { color: #fff; border-color: var(--service-accent); background: rgba(var(--service-accent-rgb), .09); transform: translateY(-3px); }
.service-hero-art { position: relative; min-height: 540px; transform: translate3d(0,var(--parallax-y,0),0); transition: transform .12s linear; }
.visual-device { position: absolute; top: 16%; left: 7%; width: 88%; height: 67%; padding: 18px; border: 2px solid rgba(255,255,255,.62); border-radius: 24px; background: linear-gradient(145deg, rgba(255,255,255,.96), rgba(224,236,247,.88)); box-shadow: 0 40px 90px rgba(0,0,0,.38), 18px 22px 0 rgba(var(--service-accent-rgb), .25); transform: perspective(900px) rotateY(-8deg) rotateX(4deg); animation: service-float 5s ease-in-out infinite; }
.visual-desktop { top: 14%; left: 2%; width: 96%; height: 68%; border-radius: 14px; }
.visual-desktop::after { content: ""; position: absolute; left: 35%; right: 35%; bottom: -54px; height: 54px; background: linear-gradient(to right, transparent, var(--service-accent) 20% 80%, transparent); clip-path: polygon(38% 0,62% 0,68% 74%,100% 88%,100% 100%,0 100%,0 88%,32% 74%); opacity: .75; }
.visual-phone { top: 4%; left: 26%; width: 49%; height: 88%; padding: 17px; border: 7px solid #f1e7ff; border-radius: 54px; transform: rotate(3deg); box-shadow: 0 42px 100px rgba(0,0,0,.42), 20px 22px 0 rgba(var(--service-accent-rgb), .3); }
.visual-phone::before { content: ""; position: absolute; z-index: 3; width: 34%; height: 22px; left: 33%; top: 7px; border-radius: 0 0 15px 15px; background: #162337; }
.visual-phone > b { position: absolute; z-index: 4; left: calc(50% - 17px); bottom: 7px; width: 34px; height: 5px; border-radius: 10px; background: #69778c; }
.visual-toolbar { display: flex; gap: 7px; height: 30px; align-items: flex-start; }
.visual-toolbar i { width: 9px; height: 9px; border-radius: 50%; background: rgba(var(--service-accent-rgb), .55); }
.visual-screen { position: relative; height: calc(100% - 30px); overflow: hidden; border-radius: 13px; background: linear-gradient(145deg, rgba(var(--service-accent-rgb), .2), #fff 62%); }
.visual-phone .visual-screen { height: 100%; border-radius: 35px; background: linear-gradient(160deg, rgba(var(--service-accent-rgb), .31), #fff 48%, rgba(var(--service-accent-rgb), .12)); }
.visual-screen span { position: absolute; top: 13%; left: 9%; width: 40%; height: 13%; border-radius: 7px; background: var(--service-accent); opacity: .78; }
.visual-screen strong { position: absolute; top: 33%; left: 9%; right: 9%; height: 23%; border-radius: 9px; background: linear-gradient(100deg, rgba(var(--service-accent-rgb), .8), rgba(var(--service-accent-rgb), .22)); }
.visual-screen i { position: relative; display: inline-block; width: 22%; height: 24%; margin: 64% 2% 0 8%; border-radius: 8px; background: rgba(var(--service-accent-rgb), .24); }
.visual-float { position: absolute; z-index: 5; display: grid; place-items: center; color: #fff; border: 1px solid rgba(255,255,255,.52); border-radius: 17px; background: linear-gradient(145deg, rgba(var(--service-accent-rgb), .96), var(--service-deep)); box-shadow: 0 22px 45px rgba(0,0,0,.32); animation: service-float 4.2s ease-in-out infinite alternate; }
.visual-float i { font-size: 2rem; }
.visual-float--one { width: 130px; height: 78px; top: 7%; left: -1%; transform: rotate(-6deg); }
.visual-float--two { width: 142px; height: 105px; top: 53%; right: -3%; animation-delay: -.8s; transform: rotate(5deg); }
.visual-float--three { width: 90px; height: 75px; bottom: 3%; left: 9%; animation-delay: -1.6s; transform: rotate(-4deg); }
.visual-api { position: absolute; inset: 2% 0; }
.visual-api svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.visual-api path { fill: none; stroke: rgba(255,255,255,.22); stroke-width: 3; stroke-dasharray: 8 9; }
.visual-api .api-flow { stroke: var(--service-accent); stroke-width: 4; stroke-dasharray: 36 320; animation: api-flow 3s linear infinite; filter: drop-shadow(0 0 7px var(--service-accent)); }
.api-node, .api-core { position: absolute; z-index: 2; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.32); background: #102130; box-shadow: 0 20px 45px rgba(0,0,0,.35), inset 0 0 28px rgba(var(--service-accent-rgb), .11); }
.api-node { width: 78px; height: 78px; border-radius: 18px; color: var(--service-accent); font-size: 1.8rem; animation: service-float 4s ease-in-out infinite alternate; }
.api-node--one { left: 7%; top: 11%; }.api-node--two { right: 4%; top: 17%; animation-delay: -.8s; }.api-node--three { left: 9%; bottom: 10%; animation-delay: -1.6s; }.api-node--four { right: 5%; bottom: 12%; animation-delay: -2.4s; }
.api-core { width: 142px; height: 142px; left: calc(50% - 71px); top: calc(50% - 71px); border-radius: 31px; color: #fff; font-size: 2rem; font-weight: 700; background: linear-gradient(145deg, var(--service-accent), var(--service-deep)); }
.api-core span { display: block; font-size: .82rem; opacity: .75; }.api-core > *,.api-core { }
.service-pixel-rail { position: absolute; z-index: 1; width: 14px; height: 180px; opacity: .88; background: repeating-linear-gradient(to bottom,var(--service-accent) 0 14px,transparent 14px 28px); }
.service-pixel-rail--right { top: 9%; right: 3%; }.service-pixel-rail--left { bottom: 7%; left: 3%; height: 120px; }
.service-use-cases, .service-deliverables, .service-process, .service-related, .service-faq { position: relative; padding: 105px 0; }
.service-use-cases { background: #0a1725; }
.service-section-heading { max-width: 780px; margin-bottom: 50px; }
.service-section-heading h2 { margin: 14px 0 16px; color: #f7fbff; font: 700 clamp(2rem,3.8vw,3.5rem)/1.15 "JetBrains Mono",monospace; letter-spacing: -.045em; text-wrap: balance; }
.service-section-heading p { max-width: 660px; margin: 0; color: #97acbf; font: 400 1rem/1.75 "Open Sans",sans-serif; }
.service-use-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; }
.service-use-card { position: relative; min-height: 250px; padding: 30px; overflow: hidden; border: 1px solid rgba(255,255,255,.09); border-radius: 10px; background: linear-gradient(145deg,rgba(255,255,255,.045),rgba(var(--service-accent-rgb),.035)); transition: transform .3s ease,border-color .3s ease,box-shadow .3s ease; }
.service-use-card::after { content:""; position:absolute; right:-50px; bottom:-60px; width:150px; height:150px; border:1px solid rgba(var(--service-accent-rgb),.23); transform:rotate(45deg); }
.service-use-card:hover { transform:translateY(-7px); border-color:rgba(var(--service-accent-rgb),.5); box-shadow:0 22px 50px rgba(0,0,0,.22); }
.service-use-card > span { color:#52677a; font-size:.75rem; }.service-use-card > i { display:block; margin:38px 0 18px; color:var(--service-accent); font-size:2rem; }.service-use-card h3 { max-width:310px; margin:0; color:#eaf3fb; font:600 1.05rem/1.55 "JetBrains Mono",monospace; }
.service-deliverables { background:linear-gradient(105deg,#07111f,#0b1928); }
.service-split { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:clamp(45px,8vw,110px); align-items:start; }
.service-section-heading--sticky { position:sticky; top:120px; }
.service-output-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.service-output-card { position:relative; min-height:190px; display:flex; flex-direction:column; justify-content:space-between; padding:27px; border:1px solid rgba(255,255,255,.1); border-radius:12px; background:rgba(255,255,255,.035); }
.service-output-card--wide { grid-column:1/-1; min-height:220px; background:linear-gradient(135deg,rgba(var(--service-accent-rgb),.22),rgba(255,255,255,.035)); }
.service-output-card > i { color:var(--service-accent); font-size:2rem; }.service-output-card h3 { max-width:330px; margin:22px 0 0; color:#edf6ff; font:600 1rem/1.55 "JetBrains Mono",monospace; }.service-output-card > span { position:absolute; top:22px; right:24px; color:#7890a4; }
.service-process { background:#0a1725; }
.service-process-track { position:relative; display:grid; grid-template-columns:repeat(4,1fr); gap:0; }
.service-process-track::before { content:""; position:absolute; top:54px; left:4%; right:4%; height:2px; background:linear-gradient(to right,var(--service-accent),rgba(var(--service-accent-rgb),.12)); }
.service-process-track article { position:relative; padding:0 24px 0 0; }.service-process-track b { color:var(--service-accent); font-size:.8rem; }.service-process-track article > span { position:relative; z-index:2; display:block; width:18px; height:18px; margin:26px 0 30px; border:4px solid #0a1725; border-radius:50%; background:var(--service-accent); box-shadow:0 0 0 1px var(--service-accent),0 0 22px rgba(var(--service-accent-rgb),.5); }.service-process-track p { max-width:250px; margin:0; color:#d4e0eb; font-size:.92rem; line-height:1.65; }
.service-related { background:var(--service-accent); color:#07111f; }
.service-related-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr)); gap:22px; }.service-related article { display:flex; min-height:320px; flex-direction:column; align-items:flex-start; justify-content:space-between; gap:35px; padding:34px; border:1px solid rgba(7,17,31,.23); border-radius:10px; background:rgba(255,255,255,.12); }.service-related article > div > span { color:#07111f; opacity:.72; }.service-related h2 { margin:13px 0; color:#07111f; font:700 clamp(2.4rem,5vw,4.1rem)/1 "JetBrains Mono",monospace; }.service-related p { max-width:720px; margin:0; color:rgba(7,17,31,.75); font:600 1rem/1.7 "Open Sans",sans-serif; }.service-related a { flex:none; display:inline-flex; align-items:center; gap:10px; padding:13px 20px; border:1px solid rgba(7,17,31,.45); border-radius:5px; color:#07111f; font-weight:700; }
.service-faq { background:#07111f; }.service-faq-list { border-top:1px solid rgba(255,255,255,.12); }.service-faq-list details { border-bottom:1px solid rgba(255,255,255,.12); }.service-faq-list summary { list-style:none; display:grid; grid-template-columns:42px 1fr auto; align-items:center; gap:12px; padding:25px 4px; color:#eaf4fc; cursor:pointer; font-weight:600; line-height:1.5; }.service-faq-list summary::-webkit-details-marker { display:none; }.service-faq-list summary span { color:var(--service-accent); font-size:.72rem; }.service-faq-list summary i { color:var(--service-accent); transition:transform .25s ease; }.service-faq-list details[open] summary i { transform:rotate(45deg); }.service-faq-list details p { margin:0; padding:0 42px 26px 58px; color:#9eb1c3; font:400 .95rem/1.75 "Open Sans",sans-serif; }
.service-final-cta { position:relative; overflow:hidden; padding:115px 0; text-align:center; background:radial-gradient(circle at 50% 120%,rgba(var(--service-accent-rgb),.32),transparent 47%),#091624; }.service-final-cta::before { content:""; position:absolute; inset:0; opacity:.25; background:repeating-linear-gradient(132deg,transparent 0 75px,rgba(var(--service-accent-rgb),.22) 76px 94px,transparent 95px 145px); }.service-final-cta .container { position:relative; z-index:2; }.service-final-cta .container > span { color:var(--service-accent); letter-spacing:.22em; }.service-final-cta h2 { max-width:900px; margin:20px auto 30px; color:#fff; font:700 clamp(2rem,4vw,4rem)/1.17 "JetBrains Mono",monospace; letter-spacing:-.05em; }
@keyframes service-float { 0%,100%{translate:0 0;}50%{translate:0 -13px;} }
@keyframes api-flow { to{stroke-dashoffset:-356;} }
@media (max-width: 991px) {
  .service-theme #header .navbar-mobile > ul { background:#091624; }
  .service-theme #header .navbar-mobile > ul > li > a, .service-theme #header .navbar-mobile > ul > li > a:focus { color:#dce8f4; }
  .service-theme #header .navbar-mobile .dropdown > ul { width:auto; max-height:none; margin:8px 14px 14px; border-color:rgba(var(--service-accent-rgb,62,167,180),.24); background:#102131; box-shadow:none; }
  .service-theme #header .navbar-mobile .dropdown > ul a, .service-theme #header .navbar-mobile .dropdown > ul a:focus { color:#cbd9e7; }
  .service-theme #header .navbar-mobile .dropdown > ul a:hover, .service-theme #header .navbar-mobile .dropdown > ul li:hover > a { color:#07111f; background:var(--service-accent,#3ea7b4); }
  .service-hero { min-height:auto; padding:135px 0 90px; }.service-hero-layout { grid-template-columns:1fr; }.service-hero-copy { max-width:760px; }.service-hero-art { width:min(620px,100%); min-height:480px; margin:0 auto; }.service-split { grid-template-columns:1fr; gap:35px; }.service-section-heading--sticky { position:static; }.service-use-grid { grid-template-columns:1fr 1fr; }.service-use-card:last-child { grid-column:1/-1; }.service-process-track { grid-template-columns:1fr 1fr; gap:42px 15px; }.service-process-track::before { display:none; }.service-process-track article > span { margin:16px 0; }.service-related article { align-items:flex-start; flex-direction:column; }
}
@media (max-width: 767px) {
  .service-hero { padding:122px 0 70px; }.service-hero h1 { font-size:clamp(2.45rem,12vw,3.35rem); }.service-hero-line { font-size:1.08rem; }.service-actions { align-items:stretch; flex-direction:column; }.service-button { width:100%; }.service-hero-art { min-height:370px; }.visual-device { left:3%; width:94%; }.visual-phone { left:23%; width:56%; }.visual-float--one { left:0; width:92px;height:64px}.visual-float--two{right:0;width:100px;height:78px}.visual-float--three{width:72px;height:62px}.visual-api{transform:scale(.82)}.service-pixel-rail{display:none}.service-use-cases,.service-deliverables,.service-process,.service-related,.service-faq{padding:75px 0}.service-section-heading{margin-bottom:34px}.service-section-heading h2{font-size:2rem}.service-use-grid,.service-output-grid,.service-process-track{grid-template-columns:1fr}.service-use-card:last-child,.service-output-card--wide{grid-column:auto}.service-use-card{min-height:210px}.service-process-track article{display:grid;grid-template-columns:42px 18px 1fr;gap:12px;align-items:start;padding:0}.service-process-track article>span{margin:0}.service-related h2{font-size:2.8rem}.service-faq-list summary{grid-template-columns:32px 1fr auto}.service-faq-list details p{padding-left:48px}.service-final-cta{padding:82px 0}.service-final-cta h2{font-size:2.1rem}
}
@media (prefers-reduced-motion: reduce) {
  .service-landing *, .service-landing *::before, .service-landing *::after { scroll-behavior:auto!important; animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; }.service-hero-art{transform:none!important}
}
