:root {
  --bg: #ffffff;
  --surface: #f7f8ff;
  --surface-2: #eef1ff;
  --surface-3: #e7ebff;
  --line: #d7deef;
  --ink: #111528;
  --ink-soft: #4f5876;
  --theme: #1E1F4F;
  --theme-2: #2a2d7a;
  --theme-3: #3d44c2;
  --blue: #2356ff;
  --blue-2: #0f39d8;
  --lime: #0f39d8;
  --white: #fff;
  --shadow: 0 20px 70px rgba(12, 23, 61, 0.08);
  --radius: 20px;
  --container: 1240px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--bg);
  font-family: Inter, Arial, sans-serif;
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; }
button { cursor: pointer; }
img { max-width: 100%; display: block; }
.noise {
  position: fixed; inset: 0; pointer-events: none; z-index: 120; opacity: .03;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.75'/%3E%3C/svg%3E");
}
.cursor-glow {
  position: fixed; width: 340px; height: 340px; border-radius: 50%; pointer-events: none; z-index: -1;
  background: radial-gradient(circle, rgba(49, 105, 255, .10), transparent 64%);
  transform: translate(-50%, -50%);
}
.container,
.section-pad { width: min(var(--container), calc(100% - 56px)); margin-inline: auto; }
.page-main { padding-top: 112px; }
.section-block { padding: 82px 0; }
.section-block.tight { padding: 58px 0; }
.eyebrow {
  font-size: 10px; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; color: var(--blue);
  margin-bottom: 10px; position: relative; padding-left: 14px;
}
.eyebrow::before { content: ""; position: absolute; left: 0; top: 2px; bottom: 2px; width: 2px; border-radius: 2px; background: var(--blue); }
.eyebrow.light { color: #d9e3ff; }
.eyebrow.light::before { background: #6b91ff; }
h1,h2,h3,h4,p { margin-top: 0; }
.h-display,
.hero-title,
.section-title,
.page-hero h1,
.cta-card h2,
.process-head h2,
.featured-copy h2,
.impact-copy h2,
.trusted h2 {
  font-family: Manrope, Inter, sans-serif;
  letter-spacing: -.055em;
}
.section-title,
.featured-copy h2,
.impact-copy h2,
.process-head h2,
.trusted h2 {
  margin: 0;
  font-size: clamp(34px, 4.2vw, 60px);
  line-height: .95;
}
.text-muted { color: var(--ink-soft); }
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 48px;
  padding: 0 20px; border-radius: 10px; font-size: 13px; font-weight: 700; border: 1px solid transparent;
  transition: transform .28s ease, background .28s ease, box-shadow .28s ease, border-color .28s ease;
}
.btn:hover { transform: translateY(-2px); }
.btn-blue { color: #fff; background: linear-gradient(135deg, var(--blue), var(--blue-2)); box-shadow: 0 14px 28px rgba(35, 86, 255, .18); }
.btn-lime { color: #ffffff; background: var(--e7ebff); box-shadow: 0 12px 26px rgba(216,255,84,.18); }
.btn-ghost-light { color: #fff; border-color: rgba(255,255,255,.32); background: rgba(255,255,255,.06); }
.btn-ghost-dark { color: var(--theme); border-color: rgba(30,31,79,.18); background: rgba(255,255,255,.86); }
.btn-small { min-height: 40px; padding: 0 16px; font-size: 12px; }
.text-link { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; color: var(--blue); }
.center-link {
  margin-top: 20px; padding: 0 20px; min-height: 46px; border-radius: 10px;
  background: linear-gradient(135deg, var(--blue), var(--blue-2)); color: #fff; width: max-content;
}
.round-arrow {
  width: 22px; height: 22px; border-radius: 50%; background: #0b1022; display: grid; place-items: center;
}

/* header */
.site-header {
  position: fixed; top: 16px; left: 0; right: 0; z-index: 60; padding: 0 28px; transition: .35s ease;
}
.nav-shell {
  height: 64px; width: min(var(--container), 100%); margin: auto; display: flex; align-items: center; justify-content: space-between;
  gap: 18px; padding: 0 16px 0 20px; border-radius: 16px; color: #fff;
  border: 1px solid rgba(255,255,255,.14); background: #0f39d8; backdrop-filter: blur(18px);
  box-shadow: 0 14px 32px rgba(9, 19, 51, .10);
}
.site-header.scrolled .nav-shell {
  background: rgba(255,255,255,.94); color: var(--ink); border-color: rgba(20,32,68,.08);
  box-shadow: 0 18px 42px rgba(10, 24, 55, .09);
}
.brand { display: inline-flex; align-items: center; gap: 12px; font-family: Manrope, sans-serif; font-weight: 800; letter-spacing: .08em; font-size: 13px; }
.brand-mark { width: 24px; height: 24px; display: grid; grid-template-columns: 1fr 1fr; gap: 2px; transform: rotate(45deg); }
.brand-mark i { display: block; border-radius: 2px; background: linear-gradient(135deg, #6f73ff, #0cb0ff); }
.brand-mark i:nth-child(2) { background: linear-gradient(135deg, #3452f0, #71d2ff); }
.brand-mark i:nth-child(3) { background: linear-gradient(135deg, #8d55ff, #4c78ff); }
.brand-mark i:nth-child(4) { background: linear-gradient(135deg, #2231a7, #7070ff); }
.desktop-nav { display: flex; align-items: center; gap: 34px; margin-left: auto; margin-right: 12px; }
.desktop-nav a,
.nav-link-arrow { position: relative; font-size: 12px; font-weight: 700; letter-spacing: .03em; opacity: .92; }
.desktop-nav a::after,
.nav-link-arrow::after {
  content: ""; position: absolute; left: 0; bottom: -8px; width: 0; height: 1px; background: currentColor; transition: width .28s ease;
}
.desktop-nav a:hover::after,
.nav-link-arrow:hover::after { width: 100%; }
.nav-actions { display: flex; align-items: center; gap: 16px; }
.menu-toggle { display:none; border:0; background:none; padding:9px; color: currentColor; }
.menu-toggle span { display:block; width:26px; height:2px; margin:5px 0; background:currentColor; }
.mobile-menu {
  position: fixed; inset: 0; z-index: 61; background: linear-gradient(180deg, #0d1334, #1E1F4F); color: white;
  padding: 24px; display:flex; flex-direction:column; opacity:0; visibility:hidden; transform:translateY(-10px);
}
.mobile-menu-top { display:flex; align-items:center; justify-content:space-between; }
.menu-close { color:#fff; background:none; border:0; font-size:36px; font-weight:300; }
.mobile-menu nav { margin-top:56px; border-top:1px solid rgba(255,255,255,.12); }
.mobile-menu nav a {
  display:grid; grid-template-columns:42px 1fr auto; align-items:center; padding:18px 0; border-bottom:1px solid rgba(255,255,255,.12);
  font: 600 27px/1.1 Manrope,sans-serif;
}
.mobile-menu nav span { font: 500 11px/1 Inter,sans-serif; color:#aeb8d8; }
.mobile-menu nav b { font-size:18px; }
.mobile-cta { margin-top:auto; min-height:58px; }

/* home hero */
.hero {
  width: 100%; padding: 16px 0 28px;
}
.hero-card {
  width: min(100% - 32px, 1580px); margin-inline: auto; min-height: 720px; position: relative; overflow: hidden;
  border-radius: 26px; display: grid; place-items: center; text-align: center; color: #fff; padding: 140px 24px 90px;
  background:
    radial-gradient(circle at 84% 18%, rgba(96,182,255,.32), transparent 26%),
    radial-gradient(circle at 8% 110%, rgba(70,149,255,.28), transparent 28%),
    linear-gradient(135deg, #0c1130 0%, #1E1F4F 42%, #2d47a8 72%, #1d8fea 100%);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.10), 0 25px 70px rgba(11, 24, 69, .14);
}
.hero-card::before {
  content: ""; position: absolute; inset: 0; background:
    radial-gradient(circle at 10% 30%, rgba(255,255,255,.06), transparent 22%),
    radial-gradient(circle at 90% 74%, rgba(255,255,255,.07), transparent 20%);
}
.hero-grid {
  position: absolute; inset: 0; opacity: .15;
  background-image: linear-gradient(rgba(255,255,255,.08) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.08) 1px, transparent 1px);
  background-size: 42px 42px; mask-image: linear-gradient(to bottom, rgba(0,0,0,.8), transparent 80%);
}
.hero-wave {
  position:absolute; inset:auto -8% -34% -8%; height:56%;
  background: radial-gradient(ellipse at center, rgba(121, 185, 255, .56), transparent 62%); filter: blur(44px);
}
.hero-orb { position:absolute; border-radius:50%; mix-blend-mode:screen; }
.hero-orb-a { width: 350px; height: 350px; left: -120px; bottom: -140px; background: radial-gradient(circle, rgba(171,228,255,.95), rgba(61,175,255,.62) 36%, transparent 70%); }
.hero-orb-b { width: 320px; height: 320px; right: -120px; top: -100px; background: radial-gradient(circle, rgba(95,198,255,.9), transparent 65%); }
.hero-beam,
.hero-beam-2 {
  position: absolute; width: 36vw; max-width: 520px; height: 2px; background: linear-gradient(90deg, transparent, rgba(111,164,255,.9), transparent);
  transform: rotate(-12deg); opacity: .65;
}
.hero-beam { right: -4%; top: 33%; }
.hero-beam-2 { left: -8%; bottom: 30%; transform: rotate(12deg); opacity: .4; }
.cloud {
  position:absolute; width:280px; height:76px; border-radius:50%; background: rgba(235,247,255,.66); filter: blur(10px); opacity:.38;
}
.cloud::before,.cloud::after { content:""; position:absolute; border-radius:50%; background:inherit; }
.cloud::before { width:110px; height:110px; left:50px; bottom:8px; }
.cloud::after { width:150px; height:150px; left:120px; bottom:-10px; }
.cloud-a { left: -36px; bottom: -30px; transform: scale(.9); }
.cloud-b { right: -70px; bottom: -35px; transform: scale(.7); opacity: .28; }
.hero-kicker { position:relative; z-index:2; font-size:10px; letter-spacing:.22em; font-weight:700; opacity:.84; margin-bottom:20px; }
.hero-title { position:relative; z-index:2; margin:0; font-size: clamp(54px, 7vw, 98px); line-height: .95; font-weight: 700; }
.title-line { display:block; }
.hero-copy {
  position:relative; z-index:2; width:min(720px,90%); margin: 26px auto 30px; font-size: 18px; line-height: 1.55; color: rgba(255,255,255,.86);
}
.hero-actions { position:relative; z-index:2; display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }

/* marquee */
.tech-marquee {
  width: min(var(--container), calc(100% - 40px)); margin: 24px auto 40px; position: relative; overflow:hidden; padding: 10px 0 0;
}
.marquee-title { text-align: center; font: 800 clamp(34px, 6vw, 60px)/1 Manrope, sans-serif; color: #0d1120; letter-spacing: -.04em; margin-bottom: 22px; }
.marquee-row { overflow:hidden; margin: 14px 0; }
.marquee-track { display:flex; align-items:center; gap:16px; width:max-content; will-change: transform; }
.tech-pill {
  min-width:max-content; padding:14px 24px; border-radius:10px; color:#f3f5fb; background:#202331; border:1px solid rgba(255,255,255,.08);
  font-weight:600; letter-spacing:.14em; box-shadow: 0 8px 18px rgba(17,42,82,.04);
}
.row-2 .tech-pill { background:#2e3241; }
.row-3 .tech-pill { background:#111; opacity:.93; }
.marquee-fade { position:absolute; top:0; bottom:0; width:10%; z-index:3; pointer-events:none; }
.marquee-fade.left { left:0; background: linear-gradient(90deg, #fff, transparent); }
.marquee-fade.right { right:0; background: linear-gradient(-90deg, #fff, transparent); }
.logo-row { margin-top: 22px; }
.logo-track { gap: 34px; padding: 6px 0 20px; }
.logo-tile {
  width: 100px; height: 100px; display:grid; place-items:center; position:relative; border-radius:18px; font-weight:800; font-size:36px;
  background:#f7f8fd; box-shadow: 0 12px 28px rgba(13,34,70,.07);
}
.logo-tile small { position:absolute; top:8px; font-size:9px; letter-spacing:.08em; }
.html-logo { color:#e44d26; }
.css-logo { color:#2862e9; }
.js-logo { background:#f8df2c; color:#111; }
.react-logo { color:#39c6e8; font-size:54px; }
.angular-logo { background:#df2431; color:#fff; clip-path:polygon(50% 0,100% 18%,88% 80%,50% 100%,12% 80%,0 18%); border-radius:0; }
.wp-logo { color:#2474a8; font-family:Georgia,serif; }
.shopify-logo { color:#69a741; }
.figma-logo { background:#121212; }
.figma-dots { width:34px;height:50px;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:repeat(3,1fr); }
.figma-dots i { border-radius:9px; }
.figma-dots i:nth-child(1){background:#f24e1e}.figma-dots i:nth-child(2){background:#ff7262}.figma-dots i:nth-child(3){background:#a259ff}.figma-dots i:nth-child(4){background:#1abcfe}.figma-dots i:nth-child(5){background:#0acf83}

/* services */
.services { padding-top: 36px; padding-bottom: 48px; }
.compact-heading h2 { margin:0; font: 800 clamp(34px,4.4vw,58px)/.94 Manrope, sans-serif; letter-spacing: -.055em; }
.service-grid { display:grid; grid-template-columns: repeat(5, 1fr); gap: 14px; margin-top: 24px; }
.service-card {
  min-height: 350px; padding: 24px 20px 18px; border: 1px solid #e4e8f1; border-radius: 18px;
  background: linear-gradient(145deg, #fff, #f3f5ff); position: relative; overflow: hidden; box-shadow: 0 12px 26px rgba(10, 23, 62, .04);
}
.service-card::after {
  content: ""; position:absolute; inset:auto -40px -70px auto; width: 170px; height: 170px;
  background: linear-gradient(135deg, rgba(83, 120, 255, .10), rgba(255,255,255,0)); border-radius: 50%;
}
.service-card.dark-card { background: linear-gradient(160deg, #15193e, #23308e); color: white; border-color: transparent; }
.service-card.dark-card p { color: rgba(231, 238, 255, .84); }
.service-card.blue-card { background: linear-gradient(160deg, #1e1f4f, #2356ff); }
.service-icon {
  width: 38px; height: 38px; display:grid; place-items:center; border-radius:50%; background: rgba(35,86,255,.10); color: var(--blue);
  margin-bottom: 18px; font-size: 16px; font-weight: 700;
}
.dark-card .service-icon { background: rgba(255,255,255,.10); color: #fff; }
.service-card h3 { font: 800 24px/.95 Manrope, sans-serif; letter-spacing: -.05em; margin: 0 0 12px; }
.service-card p { margin: 0; color: #607089; font-size: 13px; line-height: 1.55; max-width: 95%; }
.service-card a {
  position: absolute; left: 20px; bottom: 18px; width: 34px; height: 34px; border-radius: 50%;
  display:grid; place-items:center; border: 1px solid rgba(17,26,49,.12); color: var(--blue); background: rgba(255,255,255,.72);
}
.dark-card a { border-color: rgba(255,255,255,.18); color: #fff; background: rgba(255,255,255,.08); }

/* pricing */
.pricing {
  padding: 58px 0 52px; background: linear-gradient(180deg, #fbfcff 0%, #f2f5ff 100%);
}
.pricing-shell {
  width: min(var(--container), calc(100% - 56px)); margin: auto; background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(248,250,255,.96));
  border: 1px solid #e5e9f5; border-radius: 24px; padding: 38px; box-shadow: var(--shadow);
}
.pricing-top { display:grid; grid-template-columns: .85fr 1.15fr; gap: 46px; align-items: end; }
.pricing-top h2 { margin: 0; font: 800 clamp(34px,4vw,54px)/.95 Manrope, sans-serif; letter-spacing:-.05em; }
.pricing-top p { margin: 0; color: var(--ink-soft); font-size: 14px; line-height: 1.7; max-width: 740px; }
.pricing-tabs {
  display:flex; gap: 10px; flex-wrap: wrap; margin-top: 28px; padding-top: 18px; border-top: 1px solid var(--line);
}
.pricing-tab {
  border: 1px solid #d8deef; background: #fff; color: var(--ink); min-height: 44px; padding: 0 16px; border-radius: 999px; font-size: 12px; font-weight: 700;
}
.pricing-tab.active { color: #fff; background: linear-gradient(135deg, var(--theme), var(--blue)); border-color: transparent; }
.pricing-grid { display:grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 26px; }
.price-card {
  position: relative; min-height: 100%; padding: 24px; border-radius: 18px; border: 1px solid #dde4f3;
  background: linear-gradient(180deg, #fff 0%, #f6f8ff 100%); box-shadow: 0 12px 22px rgba(18, 32, 69, .04);
}
.price-card.popular {
  background: linear-gradient(180deg, rgba(30,31,79,.98) 0%, rgba(35,86,255,.96) 100%); color: #fff; border-color: transparent; transform: translateY(-8px);
  box-shadow: 0 22px 44px rgba(31, 47, 122, .16);
}
.popular-badge {
  position:absolute; right: 18px; top: 18px; font-size: 10px; padding: 7px 10px; border-radius: 999px; background: rgba(255,255,255,.14); letter-spacing: .12em; font-weight: 800;
}
.price-card .category { font-size: 10px; letter-spacing: .12em; font-weight: 800; color: #6780c9; margin-bottom: 16px; }
.price-card.popular .category { color: #cdddff; }
.price-card h3 { margin: 0 0 12px; font: 800 24px/1.06 Manrope, sans-serif; letter-spacing: -.04em; }
.price-card .price { font: 800 38px/.95 Manrope, sans-serif; letter-spacing: -.06em; margin-bottom: 12px; }
.price-card p { margin: 0 0 18px; font-size: 13px; line-height: 1.55; color: #5b6981; }
.price-card.popular p { color: rgba(234, 239, 255, .86); }
.features { list-style: none; padding: 0; margin: 0 0 22px; display: grid; gap: 10px; }
.features li {
  position: relative; padding-left: 22px; font-size: 12px; line-height: 1.45; color: #40506b;
}
.features li::before {
  content: "✓"; position: absolute; left: 0; top: 0; color: var(--blue); font-weight: 800;
}
.price-card.popular .features li { color: rgba(238, 243, 255, .9); }
.price-card.popular .features li::before { color: #d8ff54; }
.pricing-note { margin-top: 16px; font-size: 13px; color: #5e6b81; }
.pricing-note a { color: var(--blue); font-weight: 700; }

/* featured / cards */
.featured { padding: 58px 0 46px; }
.featured-layout { display:grid; grid-template-columns: .8fr 1.2fr; gap: 22px; align-items: start; }
.featured-copy p { max-width: 300px; font-size: 13px; line-height: 1.6; color: #67738a; margin: 18px 0 24px; }
.project-slider-wrap { position: relative; overflow: hidden; }
.project-slider { display:flex; gap: 14px; will-change: transform; }
.project-card {
  min-width: calc(50% - 7px); min-height: 270px; border-radius: 18px; color: white; padding: 24px; position: relative; overflow: hidden;
  background: #0a1225; box-shadow: 0 16px 34px rgba(10, 20, 48, .10);
}
.project-meta { font-size: 9px; letter-spacing: .15em; color: #a9bad7; }
.project-card h3 { font: 700 26px/1.02 Manrope, sans-serif; margin: 10px 0 13px; letter-spacing: -.05em; }
.project-tags { display:flex; gap: 6px; flex-wrap: wrap; }
.project-tags span { font-size: 8px; border: 1px solid rgba(255,255,255,.35); border-radius: 999px; padding: 5px 8px; }
.project-stat { position:absolute; left: 24px; bottom: 24px; font: 700 24px/1 Manrope, sans-serif; }
.project-stat small { display:block; font-size: 10px; font-weight:500; color:#c0cae0; margin-top:6px; }
.project-one { background: radial-gradient(circle at 80% 10%, rgba(61,83,255,.5), transparent 42%), linear-gradient(135deg, #090f22, #17245a); }
.project-two { background: linear-gradient(145deg, #122a47, #925f45); }
.project-three { background: linear-gradient(140deg, #10132b, #2356ff 55%, #7bc8ff); }
.project-four { background: linear-gradient(140deg, #0f162d, #33415a 40%, #7a5872); }
.crystal { position:absolute; right:18%; top:36%; width:110px; height:150px; clip-path:polygon(50% 0,90% 60%,55% 100%,10% 66%); background:linear-gradient(140deg, rgba(255,255,255,.9), rgba(57,86,255,.22) 42%, rgba(3,12,40,.9)); transform:rotate(20deg); box-shadow:0 0 50px rgba(63,100,255,.7); }
.crystal-2 { right:-3%; top:25%; transform:scale(.7) rotate(-12deg); opacity:.75; }
.building { position:absolute; right:-14px; bottom:-6px; width:74%; height:66%; display:grid; grid-template-columns:repeat(3,1fr); gap:6px; transform:skewY(-7deg); opacity:.9; }
.building i { background:linear-gradient(180deg, rgba(255,218,168,.85), rgba(24,40,57,.25)); border:1px solid rgba(255,255,255,.18); }
.dashboard-bars { position:absolute; inset:auto 26px 26px auto; width: 150px; display:grid; gap:8px; }
.dashboard-bars i { display:block; height: 22px; border-radius: 10px; background: linear-gradient(90deg, rgba(255,255,255,.92), rgba(125, 203, 255, .2)); }
.glow-ring { position:absolute; right: -18px; bottom: -22px; width: 160px; height:160px; border-radius:50%; border:1px solid rgba(255,255,255,.16); box-shadow: 0 0 0 34px rgba(255,255,255,.03), 0 0 0 68px rgba(255,255,255,.02); }
.slider-controls { display:flex; justify-content:flex-end; gap:8px; margin-top: 14px; }
.slider-btn {
  width: 42px; height: 42px; border-radius: 50%; border: 1px solid #d7deef; display:grid; place-items:center; background:#fff; color: var(--theme);
}

/* impact */
.impact {
  width: 100%; padding: 70px max(28px, calc((100vw - 1240px)/2)) 66px;
  background: linear-gradient(110deg, #fafcff 0%, #eef3ff 100%);
}
.impact-inner { display:grid; grid-template-columns: 1fr .85fr; gap: 48px; align-items:center; }
.impact-copy p { font-size: 13px; line-height: 1.6; color:#68748a; max-width: 530px; margin: 18px 0 24px; }
.metric-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.metric-card {
  min-height: 150px; background: linear-gradient(145deg, #1E1F4F, #2356ff); color:#fff; border-radius:18px; padding:24px;
  display:flex; flex-direction:column; justify-content:center; box-shadow: 0 16px 30px rgba(30,31,79,.12);
}
.metric-card strong { font: 800 40px/1 Manrope, sans-serif; letter-spacing:-.06em; }
.metric-card span { font: 700 20px/1.15 Manrope, sans-serif; margin-top:6px; }

/* process */
.process { padding-top: 64px; padding-bottom: 56px; }
.process-head,
.industries-head { display:flex; align-items:start; justify-content:space-between; gap:24px; }
.process-line { height:1px; background:#dfe5ef; margin:40px 0 30px; transform-origin:left; }
.process-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.process-card { position:relative; padding-right: 10px; }
.process-icon {
  width:56px; height:56px; border-radius:50%; background: linear-gradient(135deg, var(--theme), var(--blue)); color:white;
  display:grid; place-items:center; font-size:23px; margin-bottom:22px;
}
.process-card > span { display:block; color: var(--blue); font-weight:800; font-size:13px; }
.process-card h3 { margin:7px 0 8px; font:800 19px/1 Manrope,sans-serif; }
.process-card p { margin:0; color:#667287; font-size: 12px; line-height:1.6; }

/* industries */
.industries { padding-top: 24px; padding-bottom: 52px; }
.industries-head h2 { text-transform:none; }
.industry-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:24px; }
.industry-grid article {
  min-height:168px; padding:24px; border-radius:16px; border:1px solid #e0e6f1; background:linear-gradient(145deg,#fff,#ebf1ff); position:relative; overflow:hidden;
}
.industry-grid article::after {
  content:""; position:absolute; right:-40px; bottom:-60px; width:170px; height:170px; background:linear-gradient(135deg, rgba(101,131,255,.65), rgba(255,255,255,.08)); transform:rotate(35deg); filter:blur(2px);
}
.industry-grid .industry-featured { color:white; background:linear-gradient(145deg, #11183e, #2457ff); border-color: transparent; }
.industry-grid h3 { margin:0 0 10px; font:800 20px Manrope,sans-serif; }
.industry-grid p { margin:0; max-width:85%; font-size:12px; line-height:1.55; color:#5f6c82; }
.industry-featured p { color:#c4d0e6; }
.industry-grid span {
  position:absolute; left:24px; bottom:20px; width:30px; height:30px; border:1px solid #76a0ff; border-radius:50%; display:grid; place-items:center; color:#0d5ee7;
}
.industry-featured span { color:white; border-color: rgba(255,255,255,.28); }

/* trusted */
.trusted { padding-top: 0; padding-bottom: 52px; }
.trusted h2 { text-transform:none; }
.trusted-marquee { overflow:hidden; margin-top:24px; border-top:1px solid #edf0f5; border-bottom:1px solid #edf0f5; padding: 22px 0; }
.trusted-track { display:flex; width:max-content; gap:64px; will-change: transform; }
.trusted-track span { font:700 18px Manrope,sans-serif; color:#8994a8; letter-spacing:.05em; }

/* CTA */
.cta-wrap { padding-top: 0; padding-bottom: 56px; }
.cta-card {
  min-height: 210px; border-radius: 22px; padding: 36px 42px; display:grid; grid-template-columns:1.1fr .9fr .7fr; gap:30px; align-items:center; color:#fff;
  background: radial-gradient(circle at 60% 50%, rgba(35,86,255,.8), transparent 30%), linear-gradient(125deg, #081225 0%, var(--theme) 52%, #081225 100%);
  overflow:hidden; position:relative;
}
.cta-card::before {
  content:""; position:absolute; inset:0; background-image: linear-gradient(90deg, transparent, rgba(255,255,255,.06), transparent); transform: translateX(-100%);
}
.cta-card h2 { margin:0; font-size: clamp(32px,4vw,50px); line-height: .95; font-weight: 800; }
.cta-card h2 span { color:#6ca7ff; }
.cta-card p { font-size: 13px; line-height: 1.4; color:#d5e0f4; max-width:190px; }
.cta-actions { display:flex; gap:10px; justify-content:center; flex-wrap:wrap; }

/* faq */
.faq {
  width: 100%; background: linear-gradient(120deg, #061224, #11183f 52%, #1e1f4f 100%); color:white; padding: 74px 0 78px;
}
.faq-shell { width:min(var(--container), calc(100% - 56px)); margin:auto; display:grid; grid-template-columns:.75fr 1.25fr; gap:48px; align-items: start; }
.faq-intro { position:relative; overflow:hidden; min-height: 420px; }
.faq-intro h2 { font:700 26px/1.18 Manrope,sans-serif; margin:10px 0 20px; letter-spacing:-.04em; }
.faq-intro p { max-width:390px; color:#c0c9d6; font-size:13px; line-height:1.7; }
.faq-rings {
  position:absolute; width:620px; height:620px; border:1px solid rgba(38,98,255,.20); border-radius:50%; left:-320px; top:170px;
  box-shadow: 0 0 0 50px rgba(38,98,255,.03), 0 0 0 100px rgba(38,98,255,.025), 0 0 0 150px rgba(38,98,255,.02);
}
.faq-rings::after { content:""; position:absolute; width:180px; height:2px; background:#1566ff; right:-86px; top:50%; box-shadow:0 22px 0 #153dff; transform:rotate(-5deg); }
.faq-list { border-top:1px solid rgba(255,255,255,.15); }
.faq-item { border-bottom:1px solid rgba(255,255,255,.13); }
.faq-item button {
  width:100%; display:flex; justify-content:space-between; align-items:center; background:none; border:0; color:white; padding:18px 0; text-align:left; font-size:13px;
}
.faq-item button b { font-size:22px; font-weight:300; transition:.3s; }
.faq-answer { height:0; overflow:hidden; }
.faq-answer p { margin:0; padding:0 34px 18px 0; color:#b6c2d4; font-size:12px; line-height:1.6; }
.faq-item.open button b { transform:rotate(45deg); }

/* page hero inner pages */
.page-hero-wrap { width: 100%; padding-top: 10px; }
.page-hero {
  width: min(100% - 32px, 1580px); margin-inline: auto; min-height: 400px; border-radius: 26px; overflow:hidden; position:relative;
  background: radial-gradient(circle at 82% 20%, rgba(95,180,255,.28), transparent 28%), linear-gradient(135deg, #0c1130 0%, #1E1F4F 44%, #2c43a5 76%, #2ea2f4 100%);
  color: #fff; padding: 120px 42px 42px; display:flex; align-items:flex-end;
}
.page-hero::before {
  content:""; position:absolute; inset:0; background-image: linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px); background-size: 42px 42px; opacity: .14;
}
.page-hero .hero-content { position:relative; z-index:2; max-width: 760px; }
.page-hero h1 { margin: 0 0 16px; font-size: clamp(40px, 5vw, 72px); line-height: .95; font-weight: 700; }
.page-hero p { margin: 0; font-size: 15px; line-height: 1.7; color: rgba(255,255,255,.86); max-width: 640px; }
.breadcrumbs { position:absolute; top: 34px; left: 42px; z-index:2; font-size: 12px; display:flex; gap: 10px; align-items:center; color: rgba(255,255,255,.76); }
.breadcrumbs span:last-child { color: #fff; font-weight: 700; }
.page-grid-two { display:grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.info-card {
  border-radius: 18px; border: 1px solid #e0e5f2; background: linear-gradient(180deg, #fff, #f6f8ff); padding: 28px; box-shadow: 0 12px 24px rgba(10, 18, 40, .04);
}
.info-card h3 { margin: 0 0 12px; font: 800 24px/1.04 Manrope, sans-serif; letter-spacing: -.04em; }
.info-card p { margin: 0; font-size: 13px; line-height: 1.7; color: #5e6a7f; }
.content-block p { font-size: 14px; line-height: 1.75; color: #5e6a7f; }
.step-list { display:grid; gap: 14px; }
.step-item { display:grid; grid-template-columns: 60px 1fr; gap: 14px; align-items:start; padding: 18px 0; border-bottom: 1px solid #e7ebf6; }
.step-item:last-child { border-bottom: 0; }
.step-no { width: 50px; height: 50px; border-radius: 50%; display:grid; place-items:center; background: linear-gradient(135deg, var(--theme), var(--blue)); color:#fff; font:800 16px Manrope, sans-serif; }
.step-item h4 { margin: 0 0 8px; font: 800 19px/1 Manrope, sans-serif; }
.step-item p { margin: 0; font-size: 13px; line-height: 1.7; color: #5e6a7f; }
.value-grid { display:grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
.value-card { padding: 22px; border: 1px solid #e3e8f4; border-radius: 18px; background: #fff; box-shadow: 0 10px 22px rgba(11,20,43,.04); }
.value-card h4 { margin: 0 0 10px; font: 800 20px/1.05 Manrope,sans-serif; }
.value-card p { margin:0; font-size:13px; color:#5e6a7f; line-height:1.6; }

/* footer */
.footer { background:#050b15; color:white; padding:34px max(28px, calc((100vw - 1240px)/2)); }
.footer-top { display:flex; align-items:center;  gap:24px; padding-bottom:28px; border-bottom:1px solid rgba(255,255,255,.1); }
.footer-top p { color:#9eabc0; font-size:13px; margin:0; }
.footer-bottom { padding-top:18px; display:flex; align-items:center; justify-content:space-between; color:#7f8ba0; font-size:11px; gap: 16px; }
.footer-bottom div { display:flex; gap:20px; flex-wrap: wrap; }

/* utilities */
.reveal-up { opacity: 0; transform: translateY(26px); }
.hide-desktop { display:none; }

@media (max-width: 1180px) {
  .desktop-nav { gap: 20px; }
  .service-grid { grid-template-columns: repeat(3, 1fr); }
  .pricing-grid { grid-template-columns: repeat(2, 1fr); }
  .featured-layout { grid-template-columns: 1fr; }
  .project-card { min-width: calc(50% - 7px); }
  .impact-inner { grid-template-columns: 1fr 1fr; }
  .process-grid { grid-template-columns: repeat(2, 1fr); }
  .cta-card { grid-template-columns: 1fr 1fr; }
  .cta-card p { grid-column: 1 / -1; max-width: none; }
  .faq-shell { grid-template-columns: 1fr; }
  .faq-intro { min-height: 240px; }
  .faq-rings { display: none; }
  .value-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 980px) {
  .site-header { padding: 0 16px; top: 10px; }
  .nav-shell { height: 58px; padding-left: 14px; border-radius: 13px; }
  .desktop-nav, .nav-actions { display:none; }
  .menu-toggle { display:block; }
  .page-main { padding-top: 90px; }
  .hero-card { width: calc(100% - 16px); min-height: 680px; border-radius: 18px; padding-top: 120px; }
  .page-hero { width: calc(100% - 16px); border-radius: 18px; min-height: 360px; }
  .container, .section-pad, .pricing-shell, .faq-shell { width: min(var(--container), calc(100% - 32px)); }
  .pricing-top { grid-template-columns: 1fr; gap: 20px; }
  .metric-grid { grid-template-columns: 1fr 1fr; }
  .page-grid-two { grid-template-columns: 1fr; }
}
@media (max-width: 820px) {
  .section-block { padding: 60px 0; }
  .hero-title { font-size: clamp(46px, 10vw, 72px); }
  .hero-copy { font-size: 14px; }
  .marquee-title { font-size: clamp(26px, 8vw, 42px); }
  .tech-marquee { margin-bottom: 20px; }
  .logo-tile { width: 76px; height: 76px; font-size: 28px; }
  .service-grid { grid-template-columns: repeat(2, 1fr); }
  .pricing-shell { padding: 24px; }
  .project-card { min-width: 100%; }
  .impact { padding-inline: 24px; }
  .impact-inner { grid-template-columns: 1fr; gap: 28px; }
  .industry-grid { grid-template-columns: 1fr; }
  .cta-card { grid-template-columns: 1fr; padding: 32px; }
  .cta-actions { justify-content: flex-start; }
  .value-grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .container, .section-pad, .pricing-shell, .faq-shell { width: calc(100% - 24px); }
  .hero-card { min-height: 620px; padding: 108px 20px 72px; }
  .hero-kicker { font-size: 8px; }
  .hero-actions { flex-direction: column; width: 100%; max-width: 290px; }
  .hero-actions .btn { width: 100%; }
  .page-hero { min-height: 320px; padding: 110px 22px 26px; }
  .breadcrumbs { left: 22px; top: 26px; }
  .service-grid, .pricing-grid, .process-grid, .metric-grid { grid-template-columns: 1fr; }
  .service-card { min-height: 228px; }
  .pricing-tabs { overflow: auto; flex-wrap: nowrap; padding-bottom: 8px; }
  .pricing-tab { white-space: nowrap; }
  .price-card.popular { transform: none; }
  .process-head, .industries-head { display:block; }
  .process-head .btn, .industries-head .btn { margin-top: 18px; }
  .cta-card { padding: 28px 22px; }
  .cta-actions { flex-direction: column; }
  .cta-actions .btn { width: 100%; }
  .faq { padding: 60px 0 66px; }
  .faq-intro p, .price-card p, .step-item p, .content-block p { font-size: 12px; }
  .footer-top, .footer-bottom { align-items:flex-start; flex-direction:column; }
  .cursor-glow { display:none; }
}
