:root {
      color-scheme: dark;
      --night: #020711;
      --night-soft: #071525;
      --cyan: #70dcfa;
      --cyan-bright: #b8f1ff;
      --blue: #1674bb;
      --violet: #8e87ff;
      --paper: #edf5f8;
      --paper-bright: #f9fcfd;
      --ink: #102d3d;
      --muted: #5e7887;
      --line-dark: rgba(102, 210, 255, .18);
      --line-light: rgba(28, 111, 151, .16);
      --shell: min(100% - 64px, 1480px);
    }

    * { box-sizing: border-box; }

    html {
      min-width: 320px;
      scroll-behavior: smooth;
      background: var(--night);
    }

    body {
      min-width: 320px;
      margin: 0;
      overflow-x: hidden;
      color: #eaf4ff;
      background: var(--night);
      font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      font-weight: 400;
      -webkit-font-smoothing: antialiased;
      text-rendering: optimizeLegibility;
    }

    button, input, a { font: inherit; }
    button { color: inherit; }
    img, svg { max-width: 100%; }
    a { color: inherit; }
    main { overflow: clip; }

    .skip-link {
      position: fixed;
      top: 10px;
      left: 10px;
      z-index: 1000;
      padding: 10px 14px;
      color: #06111d;
      border-radius: 8px;
      background: #dff9ff;
      transform: translateY(-150%);
      transition: transform .2s ease;
    }

    .skip-link:focus { transform: translateY(0); }

    .site-header {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      z-index: 100;
      height: 90px;
      padding: 28px clamp(28px, 3vw, 48px) 0;
      display: flex;
      align-items: flex-start;
      isolation: isolate;
      opacity: 0;
      transform: translateY(-10px);
      animation: headerIn .9s ease .15s forwards;
    }

    .site-header::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: -1;
      pointer-events: none;
      opacity: 0;
      background: linear-gradient(180deg, rgba(248, 252, 255, .97) 0%, rgba(243, 249, 253, .88) 72%, rgba(243, 249, 253, 0) 100%);
      box-shadow: 0 12px 36px rgba(43, 83, 117, .08);
      -webkit-backdrop-filter: blur(18px) saturate(130%);
      backdrop-filter: blur(18px) saturate(130%);
      transition: opacity .55s ease;
    }

    .site-header.is-light::before { opacity: 1; }

    .mini-logo {
      margin: 9px 58px 0 0;
      flex: 0 0 auto;
      color: #bfeeff;
      background: linear-gradient(105deg, #68cfff 0%, #bfefff 17%, #fff 29%, #68cfff 46%, #e9fbff 64%, #70d6ff 82%, #d6f7ff 100%);
      background-size: 240% 100%;
      -webkit-background-clip: text;
      background-clip: text;
      -webkit-text-fill-color: transparent;
      font-size: 15px;
      font-weight: 500;
      line-height: 18px;
      letter-spacing: .08em;
      text-decoration: none;
      white-space: nowrap;
      opacity: .9;
      filter: drop-shadow(0 0 8px rgba(73, 190, 255, .34));
      transition: opacity .25s ease, filter .35s ease;
      animation: miniLogoShimmer 9s ease-in-out infinite alternate;
    }

    .mini-logo:hover,
    .mini-logo:focus-visible { opacity: 1; filter: drop-shadow(0 0 11px rgba(82, 203, 255, .62)); }
    .site-header.is-light .mini-logo { filter: brightness(.56) saturate(1.5) drop-shadow(0 2px 7px rgba(18, 99, 160, .16)); }

    .main-nav { min-height: 38px; display: flex; align-items: center; gap: clamp(28px, 3.25vw, 54px); }

    .main-nav a,
    .header-actions a {
      color: rgba(220, 233, 247, .72);
      text-decoration: none;
      font-size: 12px;
      transition: color .25s ease, border-color .25s ease, background .25s ease, box-shadow .25s ease;
    }

    .main-nav a:hover,
    .main-nav a:focus-visible,
    .main-nav a[aria-current="page"] { color: #eef8ff; }
    .site-header.is-light .main-nav a { color: rgba(24, 47, 70, .7); }
    .site-header.is-light .main-nav a:hover,
    .site-header.is-light .main-nav a:focus-visible,
    .site-header.is-light .main-nav a[aria-current="page"] { color: #0869b5; }

    .header-actions { margin-left: auto; display: flex; align-items: center; gap: 27px; }
    .header-actions a {
      min-width: 142px;
      height: 36px;
      padding-inline: 16px;
      border: 1px solid rgba(44, 147, 255, .38);
      border-radius: 10px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: #e9f8ff;
      background: linear-gradient(180deg, rgba(26, 113, 201, .82), rgba(9, 62, 119, .92));
      box-shadow: inset 0 1px rgba(255, 255, 255, .1), 0 0 22px rgba(17, 119, 233, .14);
      white-space: nowrap;
    }
    .header-actions a:hover,
    .header-actions a:focus-visible { color: #fff; border-color: rgba(76, 177, 255, .66); box-shadow: 0 0 24px rgba(20, 127, 255, .2); }
    .site-header.is-light .header-actions a { color: #f8fcff; border-color: rgba(18, 110, 181, .28); background: linear-gradient(180deg, #1782d1, #0d65aa); box-shadow: 0 8px 24px rgba(18, 105, 171, .2), inset 0 1px rgba(255, 255, 255, .2); }

    .menu-toggle {
      position: relative;
      width: 40px;
      height: 40px;
      margin: -2px 0 0 10px;
      padding: 0;
      flex: 0 0 40px;
      display: none;
      border: 1px solid rgba(91, 193, 238, .34);
      border-radius: 11px;
      color: #8edfff;
      background: rgba(4, 15, 29, .68);
      box-shadow: inset 0 0 18px rgba(39, 151, 217, .08), 0 8px 24px rgba(0, 0, 0, .14);
      -webkit-backdrop-filter: blur(12px) saturate(130%);
      backdrop-filter: blur(12px) saturate(130%);
      cursor: pointer;
      -webkit-tap-highlight-color: transparent;
      transition: color .35s ease, border-color .35s ease, background .55s ease, box-shadow .35s ease;
    }

    .menu-toggle span { position: absolute; left: 10px; width: 18px; height: 1px; border-radius: 2px; background: currentColor; box-shadow: 0 0 7px currentColor; transform-origin: center; transition: top .32s ease, opacity .24s ease, transform .32s cubic-bezier(.2, .72, .2, 1); }
    .menu-toggle span:nth-child(1) { top: 12px; }
    .menu-toggle span:nth-child(2) { top: 19px; }
    .menu-toggle span:nth-child(3) { top: 26px; }
    .site-header.is-menu-open .menu-toggle span:nth-child(1) { top: 19px; transform: rotate(45deg); }
    .site-header.is-menu-open .menu-toggle span:nth-child(2) { opacity: 0; transform: scaleX(.2); }
    .site-header.is-menu-open .menu-toggle span:nth-child(3) { top: 19px; transform: rotate(-45deg); }
    .menu-toggle:hover,
    .menu-toggle:focus-visible,
    .site-header.is-menu-open .menu-toggle { color: #e4faff; border-color: rgba(112, 221, 255, .7); box-shadow: inset 0 0 20px rgba(52, 171, 232, .14), 0 0 20px rgba(36, 168, 235, .18); }
    .site-header.is-light .menu-toggle { color: #166d95; border-color: rgba(32, 115, 153, .28); background: rgba(248, 252, 253, .84); }
    .menu-toggle:focus-visible { outline: 1px solid currentColor; outline-offset: 4px; }

    [data-reveal] { opacity: 0; transform: translateY(28px); transition: opacity .82s ease, transform .9s cubic-bezier(.2, .7, .2, 1); }
    [data-reveal].is-visible { opacity: 1; transform: translateY(0); }

    .services-hero {
      position: relative;
      min-height: max(820px, 100svh);
      overflow: hidden;
      isolation: isolate;
      background:
        radial-gradient(circle at 76% 42%, rgba(17, 126, 222, .19), transparent 30%),
        radial-gradient(circle at 18% 86%, rgba(92, 66, 210, .1), transparent 25%),
        linear-gradient(145deg, #020711 0%, #071728 58%, #020912 100%);
    }

    .services-hero::before {
      content: "SERVICES";
      position: absolute;
      left: -1vw;
      bottom: -2.5vw;
      z-index: -3;
      color: transparent;
      -webkit-text-stroke: 1px rgba(104, 210, 255, .045);
      font-size: clamp(110px, 17vw, 300px);
      font-weight: 650;
      line-height: .8;
      letter-spacing: -.09em;
      white-space: nowrap;
    }

    .hero-grid,
    .dark-grid {
      position: absolute;
      inset: 0;
      z-index: -2;
      opacity: .28;
      background-image: linear-gradient(rgba(92, 199, 244, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(92, 199, 244, .05) 1px, transparent 1px);
      background-size: 54px 54px;
      -webkit-mask-image: radial-gradient(circle at 70% 42%, #000, transparent 66%);
      mask-image: radial-gradient(circle at 70% 42%, #000, transparent 66%);
    }

    .hero-shell {
      width: var(--shell);
      min-height: max(820px, 100svh);
      margin: 0 auto;
      padding: 135px 0 82px;
      display: grid;
      grid-template-columns: minmax(410px, .78fr) minmax(580px, 1.22fr);
      gap: clamp(55px, 7vw, 112px);
      align-items: center;
    }

    .breadcrumbs { margin: 0 0 55px; display: flex; align-items: center; gap: 10px; color: rgba(151, 186, 210, .48); font-size: 9px; letter-spacing: .16em; text-transform: uppercase; }
    .breadcrumbs a { text-decoration: none; transition: color .25s ease; }
    .breadcrumbs a:hover { color: #9be8ff; }
    .breadcrumbs span::before { content: "/"; margin-right: 10px; opacity: .5; }
    .hero-kicker,
    .section-kicker { margin: 0 0 19px; display: flex; align-items: center; gap: 12px; color: #72d5f4; font-size: 9px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; }
    .hero-kicker::before,
    .section-kicker::before { content: ""; width: 30px; height: 1px; background: linear-gradient(90deg, currentColor, transparent); box-shadow: 0 0 7px currentColor; }
    .hero-title { max-width: 770px; margin: 0; color: #f0faff; font-size: clamp(68px, 7.1vw, 116px); font-weight: 390; line-height: .83; letter-spacing: -.078em; }
    .hero-title span { color: #9de6fb; }
    .hero-lead { max-width: 650px; margin: 35px 0 0; color: rgba(194, 222, 235, .68); font-size: clamp(15px, 1.2vw, 18px); line-height: 1.72; }
    .hero-promise { max-width: 625px; margin: 27px 0 0; padding: 17px 0 17px 19px; color: rgba(206, 233, 244, .76); border-left: 1px solid rgba(104, 215, 255, .56); background: linear-gradient(90deg, rgba(53, 163, 215, .07), transparent); font-size: 12px; line-height: 1.55; }
    .hero-actions,
    .cta-actions { margin-top: 34px; display: flex; align-items: center; flex-wrap: wrap; gap: 12px; }
    .button-primary,
    .button-secondary { min-height: 48px; padding: 0 21px; border: 1px solid rgba(74, 181, 231, .34); border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; gap: 30px; color: #f1fbff; background: linear-gradient(180deg, rgba(26, 119, 194, .92), rgba(10, 75, 130, .94)); box-shadow: inset 0 1px rgba(255, 255, 255, .1), 0 14px 34px rgba(0, 72, 130, .18); font-size: 11px; letter-spacing: .03em; text-decoration: none; transition: transform .28s ease, border-color .28s ease, box-shadow .28s ease; }
    .button-primary::after,
    .button-secondary::after { content: ""; width: 8px; height: 8px; border-top: 1px solid currentColor; border-right: 1px solid currentColor; transform: rotate(45deg); }
    .button-secondary { color: rgba(198, 226, 239, .72); background: rgba(12, 33, 51, .45); }
    .button-primary:hover,
    .button-primary:focus-visible,
    .button-secondary:hover,
    .button-secondary:focus-visible { transform: translateY(-2px); border-color: rgba(112, 221, 255, .68); box-shadow: 0 17px 38px rgba(0, 74, 135, .25); }

    .router {
      position: relative;
      width: min(100%, 760px);
      aspect-ratio: 1.04;
      justify-self: end;
      overflow: hidden;
      border: 1px solid rgba(94, 202, 244, .18);
      border-radius: 30px;
      background: linear-gradient(rgba(72, 181, 231, .035) 1px, transparent 1px), linear-gradient(90deg, rgba(72, 181, 231, .035) 1px, transparent 1px), radial-gradient(circle at 50% 48%, rgba(28, 139, 205, .14), transparent 28%), rgba(3, 13, 26, .55);
      background-size: 35px 35px, 35px 35px, auto, auto;
      box-shadow: inset 0 1px rgba(255, 255, 255, .035), 0 38px 100px rgba(0, 0, 0, .25);
      -webkit-backdrop-filter: blur(12px);
      backdrop-filter: blur(12px);
      transform: perspective(1100px) rotateY(-3deg) rotateX(1deg);
      transform-style: preserve-3d;
      transition: transform .3s ease-out;
    }

    .router::before { content: ""; position: absolute; inset: 14px; border: 1px solid rgba(101, 205, 244, .08); border-radius: 21px; pointer-events: none; }
    .router-toolbar { position: absolute; top: 0; left: 0; right: 0; height: 58px; padding: 0 20px; display: flex; align-items: center; justify-content: space-between; color: rgba(130, 192, 219, .48); border-bottom: 1px solid rgba(83, 185, 230, .1); font-size: 8px; letter-spacing: .18em; text-transform: uppercase; }
    .router-toolbar::after { content: "online"; padding-left: 13px; color: rgba(148, 226, 249, .64); background: radial-gradient(circle at 2px 50%, #74dcf8 0 2px, transparent 3px); }
    .router-traces { position: absolute; inset: 57px 0 0; width: 100%; height: calc(100% - 57px); pointer-events: none; }
    .router-traces path { fill: none; stroke: rgba(103, 205, 245, .18); stroke-width: 1; vector-effect: non-scaling-stroke; }
    .router-traces .current { stroke: rgba(139, 229, 255, .82); stroke-dasharray: 2 96; filter: drop-shadow(0 0 5px rgba(97, 213, 255, .8)); animation: currentRun 7s linear infinite; }
    .router-traces circle { fill: #071929; stroke: rgba(110, 217, 253, .55); vector-effect: non-scaling-stroke; }
    .router-traces circle.node-hot { fill: #9be9fb; filter: drop-shadow(0 0 6px rgba(114, 220, 255, .9)); }

    .router-core {
      position: absolute;
      left: 50%;
      top: 50%;
      width: clamp(180px, 29%, 222px);
      aspect-ratio: 1;
      border: 1px solid rgba(104, 216, 255, .34);
      border-radius: 28px;
      display: grid;
      place-items: center;
      color: #ddf8ff;
      background: radial-gradient(circle at 50% 40%, rgba(70, 180, 229, .24), transparent 42%), linear-gradient(145deg, rgba(8, 32, 54, .98), rgba(4, 16, 29, .98));
      box-shadow: inset 0 0 38px rgba(64, 183, 233, .09), 0 0 0 8px rgba(41, 153, 206, .025), 0 25px 65px rgba(0, 0, 0, .4), 0 0 44px rgba(37, 147, 207, .12);
      transform: translate(-50%, -48%);
      isolation: isolate;
    }
    .router-core::before { content: ""; position: absolute; inset: 15px; z-index: -1; border: 1px solid rgba(103, 209, 248, .12); border-radius: 20px; }
    .router-core::after { content: ""; position: absolute; inset: -14px; z-index: -2; border: 1px dashed rgba(113, 217, 253, .17); border-radius: 36px; animation: coreOrbit 30s linear infinite; }
    .core-content { text-align: center; }
    .core-content small { display: block; color: rgba(130, 205, 231, .52); font-size: 7px; letter-spacing: .22em; text-transform: uppercase; }
    .core-content strong { margin-top: 9px; display: block; font-size: clamp(36px, 4vw, 58px); font-weight: 420; line-height: .9; letter-spacing: -.07em; }
    .core-active { max-width: 150px; min-height: 30px; margin: 13px auto 0; color: #83d9f3; font-size: 9px; line-height: 1.4; }

    .route-node {
      position: absolute;
      width: 28%;
      min-height: 72px;
      padding: 13px 15px;
      border: 1px solid rgba(94, 198, 238, .16);
      border-radius: 14px;
      display: flex;
      align-items: center;
      gap: 11px;
      color: rgba(205, 231, 241, .7);
      background: rgba(5, 19, 34, .72);
      box-shadow: inset 0 1px rgba(255, 255, 255, .025);
      text-align: left;
      cursor: pointer;
      -webkit-tap-highlight-color: transparent;
      transition: color .3s ease, border-color .3s ease, background .3s ease, box-shadow .3s ease, transform .3s ease;
    }
    .route-node::before { content: attr(data-index); flex: 0 0 auto; color: rgba(121, 206, 235, .55); font-family: Georgia, serif; font-size: 20px; }
    .route-node span { font-size: 10px; line-height: 1.35; }
    .route-node:hover,
    .route-node:focus-visible,
    .route-node.is-active { color: #edfbff; border-color: rgba(120, 222, 255, .5); background: rgba(10, 43, 67, .88); box-shadow: 0 0 28px rgba(36, 164, 218, .11), inset 0 0 20px rgba(80, 195, 236, .05); transform: translateY(-2px); outline: none; }
    .route-node:nth-of-type(1) { left: 5%; top: 15%; }
    .route-node:nth-of-type(2) { right: 5%; top: 15%; }
    .route-node:nth-of-type(3) { left: 3%; top: 44%; }
    .route-node:nth-of-type(4) { right: 3%; top: 44%; }
    .route-node:nth-of-type(5) { left: 8%; bottom: 8%; }
    .route-node:nth-of-type(6) { right: 8%; bottom: 8%; }

    .light-bridge {
      position: relative;
      z-index: 3;
      height: 160px;
      margin-top: -1px;
      overflow: hidden;
      background: linear-gradient(180deg, #020912 0%, #0a2233 35%, #92b9c7 78%, var(--paper) 100%);
    }
    .light-bridge svg { position: absolute; inset: 0; width: 100%; height: 100%; }
    .light-bridge path { fill: none; stroke: rgba(164, 228, 247, .25); stroke-width: 1; vector-effect: non-scaling-stroke; }
    .light-bridge .current { stroke: rgba(218, 250, 255, .9); stroke-dasharray: 2 100; filter: drop-shadow(0 0 5px rgba(177, 239, 255, .9)); animation: currentRun 8s linear infinite; }

    .competencies-section {
      position: relative;
      color: var(--ink);
      background: radial-gradient(circle at 88% 11%, rgba(41, 139, 177, .08), transparent 26%), linear-gradient(180deg, var(--paper), var(--paper-bright));
    }
    .competencies-section::after { content: "CAPABILITIES"; position: absolute; right: -1vw; top: 6%; color: transparent; -webkit-text-stroke: 1px rgba(39, 115, 144, .05); font-size: clamp(80px, 13vw, 210px); font-weight: 650; line-height: .8; letter-spacing: -.08em; pointer-events: none; }
    .section-shell { position: relative; z-index: 1; width: var(--shell); margin: 0 auto; padding: 110px 0 145px; }
    .section-heading { display: grid; grid-template-columns: minmax(500px, .92fr) minmax(380px, .62fr); gap: clamp(60px, 10vw, 155px); align-items: end; }
    .section-kicker { color: #187aa0; }
    .section-title { margin: 0; color: #14384a; font-size: clamp(58px, 6.2vw, 98px); font-weight: 410; line-height: .88; letter-spacing: -.07em; }
    .section-title span { color: #2889ad; }
    .section-intro { max-width: 590px; margin: 0; color: #5b7684; font-size: 15px; line-height: 1.75; }

    .service-explorer {
      margin-top: 74px;
      display: grid;
      grid-template-columns: minmax(300px, .46fr) minmax(600px, 1.15fr);
      gap: 16px;
      align-items: stretch;
    }
    .service-tabs { padding: 12px; display: grid; gap: 5px; border: 1px solid rgba(35, 116, 148, .15); border-radius: 24px; background: rgba(255, 255, 255, .44); box-shadow: inset 0 1px rgba(255, 255, 255, .7), 0 24px 70px rgba(30, 74, 93, .08); }
    .service-tab {
      width: 100%;
      min-height: 78px;
      padding: 13px 16px;
      border: 1px solid transparent;
      border-radius: 15px;
      display: grid;
      grid-template-columns: 38px 1fr 12px;
      gap: 9px;
      align-items: center;
      color: #466773;
      background: transparent;
      text-align: left;
      cursor: pointer;
      -webkit-tap-highlight-color: transparent;
      transition: color .35s ease, border-color .35s ease, background .35s ease, box-shadow .35s ease;
    }
    .service-tab strong { color: #2980a1; font-family: Georgia, serif; font-size: 21px; font-weight: 400; }
    .service-tab span { font-size: 12px; line-height: 1.35; }
    .service-tab::after { content: ""; width: 7px; height: 7px; border-top: 1px solid currentColor; border-right: 1px solid currentColor; opacity: .36; transform: rotate(45deg); transition: transform .35s ease, opacity .35s ease; }
    .service-tab:hover,
    .service-tab:focus-visible { color: #174f65; background: rgba(255, 255, 255, .55); outline: none; }
    .service-tab.is-active { color: #123f52; border-color: rgba(32, 125, 161, .18); background: rgba(255, 255, 255, .86); box-shadow: 0 10px 32px rgba(27, 91, 117, .1), inset 3px 0 #2484aa; }
    .service-tab.is-active::after { opacity: .8; transform: translateX(2px) rotate(45deg); }

    .service-panes { min-width: 0; display: grid; }
    .service-panel {
      grid-area: 1 / 1;
      min-height: 610px;
      padding: clamp(35px, 4vw, 62px);
      overflow: hidden;
      border: 1px solid rgba(38, 117, 146, .17);
      border-radius: 24px;
      display: grid;
      grid-template-columns: minmax(360px, .92fr) minmax(290px, .7fr);
      gap: clamp(35px, 5vw, 75px);
      align-items: center;
      visibility: hidden;
      opacity: 0;
      color: #e8f7fb;
      background: radial-gradient(circle at 82% 29%, rgba(32, 154, 205, .22), transparent 29%), linear-gradient(145deg, #0a283b, #061724 72%);
      box-shadow: 0 30px 80px rgba(26, 70, 89, .18);
      transform: translateY(10px);
      transition: opacity .38s ease, transform .5s cubic-bezier(.2, .72, .2, 1), visibility 0s linear .5s;
    }
    .service-panel.is-active { visibility: visible; opacity: 1; transform: translateY(0); transition-delay: 0s; }
    .panel-index { margin: 0 0 25px; display: flex; align-items: center; gap: 12px; color: #77d7f3; font-size: 8px; letter-spacing: .2em; text-transform: uppercase; }
    .panel-index::after { content: ""; width: 80px; height: 1px; background: linear-gradient(90deg, rgba(114, 219, 250, .6), transparent); }
    .panel-title { margin: 0; color: #eefbff; font-size: clamp(38px, 3.7vw, 60px); font-weight: 420; line-height: .94; letter-spacing: -.06em; }
    .panel-copy { margin: 25px 0 0; color: rgba(192, 220, 231, .68); font-size: 14px; line-height: 1.72; }
    .panel-scope { margin: 30px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; list-style: none; }
    .panel-scope li { min-height: 45px; padding: 10px 12px; border: 1px solid rgba(99, 196, 232, .12); border-radius: 10px; display: flex; align-items: center; gap: 9px; color: rgba(207, 232, 241, .72); background: rgba(11, 37, 54, .48); font-size: 10px; line-height: 1.35; }
    .panel-scope li::before { content: ""; width: 5px; height: 5px; flex: 0 0 5px; border-radius: 50%; background: #70d8f5; box-shadow: 0 0 8px rgba(82, 210, 248, .7); }

    .service-visual { position: relative; min-height: 390px; border: 1px solid rgba(96, 201, 239, .16); border-radius: 22px; display: grid; place-items: center; overflow: hidden; background: linear-gradient(rgba(82, 191, 236, .04) 1px, transparent 1px), linear-gradient(90deg, rgba(82, 191, 236, .04) 1px, transparent 1px), rgba(3, 15, 27, .5); background-size: 28px 28px; box-shadow: inset 0 0 60px rgba(45, 164, 214, .05); }
    .service-visual::before { content: attr(data-code); position: absolute; right: 15px; top: 14px; color: rgba(125, 210, 238, .34); font-size: 7px; letter-spacing: .18em; text-transform: uppercase; }

    .process-section {
      position: relative;
      min-height: 820px;
      overflow: hidden;
      color: #ebf8fc;
      background: radial-gradient(circle at 15% 20%, rgba(78, 64, 200, .1), transparent 28%), radial-gradient(circle at 80% 68%, rgba(27, 139, 202, .16), transparent 32%), linear-gradient(145deg, #020711, #071725 65%, #020911);
      isolation: isolate;
    }
    .process-shell { width: var(--shell); margin: 0 auto; padding: 130px 0 150px; }
    .dark-heading { display: grid; grid-template-columns: minmax(520px, .9fr) minmax(360px, .55fr); gap: clamp(60px, 9vw, 145px); align-items: end; }
    .dark-title { margin: 0; color: #eefaff; font-size: clamp(58px, 6.2vw, 98px); font-weight: 400; line-height: .88; letter-spacing: -.07em; }
    .dark-title span { color: #8ddff7; }
    .dark-intro { margin: 0; color: rgba(189, 216, 229, .64); font-size: 15px; line-height: 1.75; }
    .process-track { position: relative; margin-top: 92px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 13px; }
    .process-track::before { content: ""; position: absolute; left: 10%; right: 10%; top: 39px; height: 1px; background: linear-gradient(90deg, transparent, rgba(105, 210, 248, .4) 10%, rgba(105, 210, 248, .4) 90%, transparent); }
    .process-track::after { content: ""; position: absolute; top: 39px; left: 5%; width: 120px; height: 1px; background: linear-gradient(90deg, transparent, #b8f3ff, transparent); filter: drop-shadow(0 0 7px rgba(105, 224, 255, .9)); animation: processSignal 8s linear infinite; }
    .process-step { position: relative; min-height: 340px; padding: 77px 26px 30px; border: 1px solid rgba(92, 190, 230, .12); border-radius: 19px; overflow: hidden; background: linear-gradient(145deg, rgba(11, 40, 59, .75), rgba(4, 17, 29, .62)); box-shadow: inset 0 1px rgba(255, 255, 255, .02); }
    .process-step::before { content: ""; position: absolute; top: 31px; left: 25px; width: 16px; height: 16px; border: 1px solid rgba(109, 216, 252, .56); border-radius: 50%; background: #071829; box-shadow: 0 0 0 7px rgba(61, 176, 221, .04), 0 0 16px rgba(64, 189, 235, .18); }
    .process-step::after { content: ""; position: absolute; top: 36px; left: 30px; width: 6px; height: 6px; border-radius: 50%; background: #8fe5fa; box-shadow: 0 0 8px rgba(100, 219, 252, .8); }
    .step-index { color: #70d0ee; font-size: 8px; letter-spacing: .2em; text-transform: uppercase; }
    .process-step h3 { margin: auto 0 0; padding-top: 72px; color: #eaf8fc; font-size: clamp(25px, 2vw, 33px); font-weight: 450; line-height: 1.05; letter-spacing: -.045em; }
    .process-step p { margin: 18px 0 0; color: rgba(187, 214, 225, .6); font-size: 12px; line-height: 1.7; }

    .open-brief-section { position: relative; overflow: hidden; color: var(--ink); background: linear-gradient(180deg, #eaf3f6, #f8fbfc); }
    .open-brief-shell { width: var(--shell); margin: 0 auto; padding: 130px 0 145px; display: grid; grid-template-columns: minmax(450px, .88fr) minmax(520px, 1.12fr); gap: clamp(70px, 10vw, 155px); align-items: center; }
    .open-title { margin: 0; color: #15394a; font-size: clamp(58px, 6.4vw, 102px); font-weight: 410; line-height: .86; letter-spacing: -.073em; }
    .open-title span { color: #2788ad; }
    .open-copy { max-width: 620px; margin: 30px 0 0; color: #5b7582; font-size: 15px; line-height: 1.75; }
    .open-note { margin: 30px 0 0; padding: 18px 20px; border-left: 2px solid #2688ad; color: #315e70; background: linear-gradient(90deg, rgba(40, 134, 171, .08), transparent); font-size: 13px; line-height: 1.65; }

    .brief-orbit { position: relative; min-height: 570px; border: 1px solid rgba(35, 119, 152, .16); border-radius: 28px; overflow: hidden; background: linear-gradient(rgba(33, 119, 153, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(33, 119, 153, .045) 1px, transparent 1px), rgba(255, 255, 255, .5); background-size: 38px 38px; box-shadow: 0 30px 80px rgba(29, 74, 91, .08), inset 0 1px rgba(255, 255, 255, .8); }
    .brief-orbit::before,
    .brief-orbit::after { content: ""; position: absolute; left: 50%; top: 50%; border: 1px dashed rgba(32, 122, 157, .16); border-radius: 50%; transform: translate(-50%, -50%); }
    .brief-orbit::before { width: 69%; aspect-ratio: 1; }
    .brief-orbit::after { width: 46%; aspect-ratio: 1; }
    .orbit-core { position: absolute; left: 50%; top: 50%; z-index: 2; width: 190px; aspect-ratio: 1; border: 1px solid rgba(39, 130, 165, .25); border-radius: 50%; display: grid; place-items: center; color: #eefbff; background: radial-gradient(circle at 42% 35%, rgba(76, 185, 224, .5), transparent 33%), linear-gradient(145deg, #1e789c, #0b3e59); box-shadow: inset -18px -20px 42px rgba(1, 30, 48, .28), inset 13px 12px 30px rgba(195, 244, 255, .13), 0 24px 55px rgba(21, 92, 122, .22); text-align: center; transform: translate(-50%, -50%); }
    .orbit-core::after { content: ""; position: absolute; inset: 12px; border: 1px solid rgba(220, 250, 255, .15); border-radius: inherit; }
    .orbit-core strong { max-width: 120px; font-size: 25px; font-weight: 470; line-height: 1; letter-spacing: -.04em; }
    .orbit-item { position: absolute; z-index: 3; max-width: 185px; padding: 13px 15px; border: 1px solid rgba(40, 126, 158, .16); border-radius: 12px; color: #376574; background: rgba(251, 254, 255, .86); box-shadow: 0 12px 32px rgba(37, 83, 100, .08); font-size: 10px; line-height: 1.45; }
    .orbit-item::before { content: ""; width: 5px; height: 5px; margin: 0 8px 1px 0; display: inline-block; border-radius: 50%; background: #2686aa; box-shadow: 0 0 7px rgba(37, 132, 169, .4); }
    .orbit-item:nth-of-type(2) { left: 7%; top: 16%; }
    .orbit-item:nth-of-type(3) { right: 7%; top: 18%; }
    .orbit-item:nth-of-type(4) { left: 6%; bottom: 17%; }
    .orbit-item:nth-of-type(5) { right: 6%; bottom: 15%; }
    .orbit-code { position: absolute; color: rgba(31, 111, 142, .25); font: 8px/1.8 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .08em; }
    .orbit-code--a { left: 9%; top: 45%; }
    .orbit-code--b { right: 8%; top: 47%; text-align: right; }

    .services-cta { position: relative; min-height: 690px; overflow: hidden; display: grid; place-items: center; text-align: center; background: radial-gradient(circle at 50% 45%, rgba(31, 137, 214, .2), transparent 29%), linear-gradient(145deg, #020711, #071728 58%, #020912); isolation: isolate; }
    .services-cta::before { content: ""; position: absolute; inset: 0; z-index: -2; opacity: .3; background-image: linear-gradient(rgba(93, 201, 244, .055) 1px, transparent 1px), linear-gradient(90deg, rgba(93, 201, 244, .055) 1px, transparent 1px); background-size: 50px 50px; -webkit-mask-image: radial-gradient(circle at 50% 45%, #000, transparent 68%); mask-image: radial-gradient(circle at 50% 45%, #000, transparent 68%); }
    .cta-circuit { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; pointer-events: none; }
    .cta-circuit path { fill: none; stroke: rgba(101, 210, 249, .13); stroke-width: 1; vector-effect: non-scaling-stroke; }
    .cta-circuit .current { stroke: rgba(130, 227, 255, .74); stroke-dasharray: 2 84; filter: drop-shadow(0 0 6px rgba(93, 216, 255, .75)); animation: currentRun 8s linear infinite; }
    .cta-inner { width: min(100% - 40px, 1120px); padding: 105px 0; }
    .cta-kicker { margin: 0 0 22px; color: #7bddfb; font-size: 9px; letter-spacing: .22em; text-transform: uppercase; }
    .cta-title { margin: 0; color: #f0faff; font-size: clamp(58px, 7.4vw, 116px); font-weight: 390; line-height: .85; letter-spacing: -.075em; }
    .cta-title span { color: #9de3f8; }
    .cta-copy { max-width: 680px; margin: 31px auto 0; color: rgba(194, 222, 235, .66); font-size: 16px; line-height: 1.72; }
    .cta-actions { justify-content: center; }

    .site-footer {
      --footer-ink: #173b4d;
      --footer-steel: #2c7794;
      --footer-ice: #ecf5f7;
      position: relative;
      min-height: 720px;
      overflow: hidden;
      color: var(--footer-ink);
      background: radial-gradient(circle at 13% 8%, rgba(79, 151, 178, .09), transparent 27%), linear-gradient(180deg, #edf5f7 0%, #e7f0f3 52%, #eaf2f4 100%);
      isolation: isolate;
    }
    .site-footer::before { content: ""; position: absolute; inset: 0; z-index: -2; opacity: .38; background-image: linear-gradient(rgba(31, 111, 142, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(31, 111, 142, .05) 1px, transparent 1px); background-size: 46px 46px; -webkit-mask-image: radial-gradient(circle at 50% 38%, #000, transparent 80%); mask-image: radial-gradient(circle at 50% 38%, #000, transparent 80%); }
    .site-footer::after { content: "FLEXCORE"; position: absolute; right: -1.5vw; bottom: -2vw; z-index: -1; color: transparent; -webkit-text-stroke: 1px rgba(40, 111, 137, .055); font-size: clamp(90px, 14vw, 240px); font-weight: 650; line-height: .8; letter-spacing: -.08em; white-space: nowrap; }
    .footer-signal { position: absolute; top: 0; left: 5.2vw; right: 5.2vw; z-index: 3; height: 92px; overflow: hidden; pointer-events: none; }
    .footer-signal::before { content: ""; position: absolute; top: 0; left: 50%; width: 1px; height: 53px; background: linear-gradient(180deg, rgba(196, 239, 249, .92), rgba(30, 131, 169, .32)); box-shadow: 0 0 13px rgba(72, 187, 219, .34); }
    .footer-signal-rail { position: absolute; top: 53px; left: 0; width: 100%; height: 1px; background: linear-gradient(90deg, transparent, rgba(28, 121, 158, .2) 11%, rgba(51, 145, 178, .54) 50%, rgba(28, 121, 158, .2) 89%, transparent); }
    .footer-signal-rail::before,
    .footer-signal-rail::after { content: ""; position: absolute; top: 0; width: clamp(70px, 10vw, 150px); height: 1px; opacity: .92; background: linear-gradient(90deg, transparent, #effcff 50%, transparent); filter: drop-shadow(0 0 6px rgba(59, 169, 202, .7)); animation: footerSignalRun 7.5s linear infinite; }
    .footer-signal-rail::after { animation-delay: -3.75s; }
    .footer-signal-node { position: absolute; top: 47px; left: 50%; width: 13px; height: 13px; border: 1px solid rgba(42, 133, 166, .72); border-radius: 50%; background: #eff8fa; box-shadow: 0 0 0 6px rgba(42, 130, 163, .055), 0 0 18px rgba(47, 149, 181, .3); transform: translateX(-50%); }
    .footer-signal-node::after { content: ""; position: absolute; inset: 3px; border-radius: inherit; background: #247c9c; box-shadow: 0 0 8px rgba(42, 145, 179, .55); animation: footerNodePulse 2.8s ease-in-out infinite; }
    .footer-inner { position: relative; z-index: 2; width: min(100%, 1600px); min-height: 720px; margin: 0 auto; padding: clamp(116px, 14vh, 158px) clamp(30px, 5.2vw, 82px) clamp(34px, 4.5vh, 56px); display: flex; flex-direction: column; justify-content: space-between; gap: clamp(46px, 6vh, 74px); }
    .footer-main { display: grid; grid-template-columns: minmax(340px, .82fr) minmax(560px, 1.18fr); gap: clamp(64px, 8vw, 132px); align-items: start; }
    .footer-brand { min-width: 0; overflow: visible; }
    .footer-kicker { margin: 0 0 16px; display: flex; align-items: center; gap: 11px; color: rgba(48, 91, 109, .58); font-size: 9px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; }
    .footer-kicker::before { content: ""; width: 24px; height: 1px; background: linear-gradient(90deg, var(--footer-steel), transparent); box-shadow: 0 0 7px rgba(48, 141, 174, .2); }
    .footer-wordmark { width: fit-content; padding: .08em .035em .14em 0; display: inline-block; overflow: visible; color: var(--footer-ice); background: linear-gradient(108deg, #173f54 0%, #6f9bab 34%, #245f78 58%, #89afbc 78%, #173f54 100%); background-size: 230% 100%; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; filter: drop-shadow(0 12px 30px rgba(49, 108, 130, .1)); font-size: clamp(48px, 5.1vw, 84px); font-weight: 500; line-height: 1; letter-spacing: -.075em; white-space: nowrap; text-decoration: none; animation: footerWordmarkFlow 10s ease-in-out infinite alternate; }
    .footer-tagline { max-width: 470px; margin: 30px 0 0; color: rgba(48, 78, 92, .75); font-size: clamp(14px, 1.1vw, 17px); line-height: 1.7; }
    .footer-accreditation { width: fit-content; max-width: 100%; margin-top: 24px; padding: 10px 13px 10px 11px; display: inline-flex; align-items: center; gap: 9px; color: rgba(42, 84, 102, .75); border: 1px solid rgba(34, 111, 141, .18); border-radius: 999px; background: rgba(255, 255, 255, .48); font-size: 9px; letter-spacing: .09em; line-height: 1.35; text-decoration: none; text-transform: uppercase; -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
    .footer-accreditation::before { content: ""; width: 6px; height: 6px; flex: 0 0 6px; border-radius: 50%; background: #277f9f; box-shadow: 0 0 10px rgba(43, 141, 174, .42); animation: footerNodePulse 2.8s ease-in-out infinite; }
    .footer-columns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(26px, 3.3vw, 54px); }
    .footer-column { position: relative; min-width: 0; padding-top: 19px; border-top: 1px solid rgba(29, 104, 134, .18); }
    .footer-column::before { content: ""; position: absolute; top: -1px; left: 0; width: 34px; height: 1px; background: #277c9c; box-shadow: 0 0 8px rgba(41, 137, 170, .3); transition: width .45s ease; }
    .footer-column:hover::before { width: min(100%, 88px); }
    .footer-column-title { margin: 0 0 21px; color: rgba(47, 86, 102, .58); font-size: 9px; font-weight: 500; letter-spacing: .19em; text-transform: uppercase; }
    .footer-links { margin: 0; padding: 0; display: grid; gap: 13px; list-style: none; }
    .footer-links a,
    .footer-links span { width: fit-content; max-width: 100%; display: inline-flex; align-items: center; gap: 8px; color: rgba(38, 70, 84, .78); font-size: 12px; line-height: 1.45; text-decoration: none; }
    .footer-links a { transition: color .28s ease, transform .28s ease; }
    .footer-links a::after { content: ""; width: 13px; height: 1px; opacity: 0; background: currentColor; transform: translateX(-8px); transition: opacity .28s ease, transform .28s ease; }
    .footer-links a:hover,
    .footer-links a:focus-visible { color: #0a4865; transform: translateX(3px); }
    .footer-links a:hover::after,
    .footer-links a:focus-visible::after { opacity: .58; transform: translateX(0); }
    .footer-links .footer-contact-primary { color: #153f54; font-size: 14px; letter-spacing: -.015em; }
    .footer-links .footer-hours { color: rgba(61, 91, 103, .58); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
    .footer-meta { margin-top: auto; display: grid; gap: 25px; }
    .footer-location { padding: 24px 0; display: flex; align-items: center; justify-content: space-between; gap: 28px; border-top: 1px solid rgba(29, 104, 134, .15); border-bottom: 1px solid rgba(29, 104, 134, .15); }
    .footer-address { display: flex; align-items: center; gap: 13px; color: rgba(35, 73, 90, .78); font-size: clamp(13px, 1.05vw, 16px); line-height: 1.45; text-decoration: none; }
    .footer-address::before { content: ""; width: 9px; height: 9px; flex: 0 0 9px; border: 1px solid #337e99; border-radius: 50%; box-shadow: 0 0 0 5px rgba(48, 132, 162, .05), 0 0 10px rgba(51, 139, 169, .18); }
    .footer-location-meta { display: flex; align-items: center; gap: 15px; color: rgba(55, 83, 95, .54); font-size: 9px; letter-spacing: .15em; text-transform: uppercase; white-space: nowrap; }
    .footer-location-meta::before { content: ""; width: 34px; height: 1px; background: linear-gradient(90deg, transparent, rgba(35, 112, 141, .4)); }
    .footer-bottom { display: flex; align-items: center; justify-content: space-between; gap: 24px; color: rgba(59, 85, 96, .52); font-size: 9px; letter-spacing: .1em; line-height: 1.5; text-transform: uppercase; }
    .footer-legal { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 18px; }
    .footer-to-top { display: inline-flex; align-items: center; gap: 12px; color: rgba(39, 77, 94, .7); text-decoration: none; }
    .footer-to-top::after { content: ""; width: 8px; height: 8px; border-top: 1px solid currentColor; border-left: 1px solid currentColor; transform: translateY(2px) rotate(45deg); transition: transform .3s ease; }
    .footer-to-top:hover::after { transform: translateY(-3px) rotate(45deg); }

    @keyframes headerIn { to { opacity: 1; transform: translateY(0); } }
    @keyframes miniLogoShimmer { to { background-position: 100% 50%; } }
    @keyframes currentRun { to { stroke-dashoffset: -100; } }
    @keyframes coreOrbit { to { transform: rotate(360deg); } }
    @keyframes processSignal { from { left: 4%; } to { left: 88%; } }
    @keyframes footerSignalRun { from { left: -14%; } to { left: 100%; } }
    @keyframes footerNodePulse { 50% { opacity: .36; transform: scale(.65); } }
    @keyframes footerWordmarkFlow { to { background-position: 100% 50%; } }

    @media (max-width: 1220px) {
      :root { --shell: min(100% - 48px, 1480px); }
      .mini-logo { margin-right: 34px; }
      .main-nav { gap: 24px; }
      .hero-shell { grid-template-columns: minmax(370px, .72fr) minmax(540px, 1.28fr); gap: 42px; }
      .route-node { width: 30%; }
      .service-explorer { grid-template-columns: 300px minmax(0, 1fr); }
      .service-panel { grid-template-columns: minmax(320px, .9fr) minmax(260px, .7fr); gap: 34px; }
      .footer-main { grid-template-columns: minmax(280px, .7fr) minmax(540px, 1.3fr); gap: 58px; }
    }

    @media (max-width: 1020px) {
      .hero-shell { min-height: auto; padding: 138px 0 105px; grid-template-columns: 1fr; gap: 70px; }
      .hero-copy { max-width: 850px; }
      .router { width: min(100%, 780px); justify-self: center; transform: none; }
      .section-heading,
      .dark-heading { grid-template-columns: 1fr; gap: 28px; }
      .section-intro,
      .dark-intro { max-width: 760px; }
      .service-explorer { grid-template-columns: 1fr; }
      .service-tabs { grid-template-columns: repeat(3, 1fr); }
      .service-tab { min-height: 86px; grid-template-columns: 30px 1fr; }
      .service-tab::after { display: none; }
      .service-panel { min-height: 580px; }
      .process-track { grid-template-columns: repeat(2, 1fr); }
      .process-track::before,
      .process-track::after { display: none; }
      .process-step { min-height: 300px; }
      .open-brief-shell { grid-template-columns: 1fr; }
      .open-copy { max-width: 750px; }
      .brief-orbit { width: min(100%, 780px); justify-self: center; }
      .footer-main { grid-template-columns: 1fr; }
      .footer-brand { max-width: 650px; }
    }

    @media (max-width: 860px) {
      .main-nav { position: absolute; top: 76px; left: 18px; right: 18px; z-index: 2; min-height: 0; padding: 9px; display: grid; gap: 0; overflow: hidden; border: 1px solid rgba(83, 184, 232, .25); border-radius: 18px; background: linear-gradient(rgba(62, 166, 222, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(62, 166, 222, .045) 1px, transparent 1px), rgba(3, 12, 24, .95); background-size: 24px 24px, 24px 24px, auto; box-shadow: 0 22px 60px rgba(0, 0, 0, .34), inset 0 1px rgba(255, 255, 255, .04); -webkit-backdrop-filter: blur(22px) saturate(135%); backdrop-filter: blur(22px) saturate(135%); opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(-10px) scale(.985); transform-origin: 80% 0; transition: opacity .28s ease, transform .38s cubic-bezier(.2, .78, .2, 1), visibility 0s linear .38s, background .7s ease, border-color .7s ease; }
      .main-nav::before { content: ""; position: absolute; top: 0; left: 18px; right: 18px; height: 1px; background: linear-gradient(90deg, transparent, rgba(119, 226, 255, .8), transparent); box-shadow: 0 0 12px rgba(85, 211, 255, .42); }
      .site-header.is-menu-open .main-nav { opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0) scale(1); transition-delay: 0s; }
      .main-nav a { min-height: 48px; padding: 0 14px; display: flex; align-items: center; border-bottom: 1px solid rgba(102, 178, 218, .12); font-size: 12px; letter-spacing: .045em; }
      .main-nav a:last-child { border-bottom: 0; }
      .site-header.is-light .main-nav { border-color: rgba(25, 111, 158, .2); background: linear-gradient(rgba(21, 112, 160, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(21, 112, 160, .045) 1px, transparent 1px), rgba(245, 250, 252, .96); background-size: 24px 24px, 24px 24px, auto; box-shadow: 0 22px 60px rgba(25, 71, 99, .16), inset 0 1px rgba(255, 255, 255, .7); }
      .menu-toggle { display: block; }
      .mini-logo { margin-right: 0; }
      .header-actions { gap: 10px; }
    }

    @media (max-width: 700px) {
      :root { --shell: min(100% - 32px, 1480px); }
      .services-hero { min-height: auto; }
      .hero-shell { padding: 114px 0 76px; gap: 52px; }
      .breadcrumbs { margin-bottom: 40px; }
      .hero-title { font-size: clamp(57px, 16.6vw, 80px); }
      .hero-lead { margin-top: 28px; font-size: 14px; }
      .hero-promise { font-size: 11px; }
      .hero-actions,
      .cta-actions { align-items: stretch; flex-direction: column; }
      .hero-actions a,
      .cta-actions a { width: 100%; justify-content: space-between; }
      .router { aspect-ratio: auto; min-height: 590px; border-radius: 21px; }
      .router-toolbar { height: 50px; }
      .router-traces { display: none; }
      .router-core { top: 56%; width: 145px; border-radius: 22px; }
      .router-core::before { inset: 10px; border-radius: 15px; }
      .core-content strong { font-size: 38px; }
      .core-active { max-width: 110px; font-size: 8px; }
      .route-node { width: calc(50% - 26px); min-height: 74px; padding: 10px; }
      .route-node span { font-size: 9px; }
      .route-node:nth-of-type(1) { left: 12px; top: 68px; }
      .route-node:nth-of-type(2) { right: 12px; top: 68px; }
      .route-node:nth-of-type(3) { left: 12px; top: 166px; }
      .route-node:nth-of-type(4) { right: 12px; top: 166px; }
      .route-node:nth-of-type(5) { left: 12px; top: auto; bottom: 18px; }
      .route-node:nth-of-type(6) { right: 12px; top: auto; bottom: 18px; }
      .light-bridge { height: 110px; }
      .section-shell,
      .process-shell,
      .open-brief-shell { padding-block: 100px 115px; }
      .section-title,
      .dark-title,
      .open-title { font-size: clamp(50px, 14.5vw, 70px); }
      .service-explorer { margin-top: 55px; }
      .service-tabs { padding: 8px; grid-template-columns: repeat(2, 1fr); border-radius: 19px; }
      .service-tab { min-height: 88px; padding: 11px; grid-template-columns: 26px 1fr; }
      .service-tab strong { font-size: 18px; }
      .service-tab span { font-size: 10px; }
      .service-panel { min-height: 0; padding: 28px 22px; grid-template-columns: 1fr; gap: 35px; border-radius: 20px; }
      .panel-title { font-size: 42px; }
      .panel-copy { font-size: 13px; }
      .panel-scope { grid-template-columns: 1fr; }
      .service-visual { min-height: 310px; }
      .process-track { margin-top: 55px; grid-template-columns: 1fr; }
      .process-step { min-height: 270px; }
      .brief-orbit { min-height: 530px; border-radius: 20px; }
      .brief-orbit::before { width: 112%; }
      .brief-orbit::after { width: 68%; }
      .orbit-core { width: 150px; }
      .orbit-core strong { font-size: 21px; }
      .orbit-item { max-width: 145px; padding: 10px; font-size: 9px; }
      .orbit-item:nth-of-type(2) { left: 10px; top: 20px; }
      .orbit-item:nth-of-type(3) { right: 10px; top: 70px; }
      .orbit-item:nth-of-type(4) { left: 10px; bottom: 66px; }
      .orbit-item:nth-of-type(5) { right: 10px; bottom: 18px; }
      .orbit-code { display: none; }
      .services-cta { min-height: 650px; }
      .cta-title { font-size: clamp(52px, 15vw, 76px); }
      .cta-copy { font-size: 14px; }
      .footer-inner { min-height: auto; padding-inline: 20px; }
      .footer-columns { grid-template-columns: 1fr; gap: 32px; }
      .footer-location { align-items: flex-start; flex-direction: column; gap: 15px; }
      .footer-location-meta { white-space: normal; }
      .footer-bottom { align-items: flex-start; flex-direction: column; }
      .site-footer::after { right: 16px; bottom: 18px; font-size: 17vw; }
    }

    @media (max-width: 620px) {
      .site-header { height: 74px; padding: 19px 18px 0; }
      .header-actions a { min-width: 124px; height: 34px; padding-inline: 12px; font-size: 11px; }
      .main-nav { top: 66px; left: 10px; right: 10px; }
    }

    @media (max-width: 450px) {
      .header-actions a { min-width: 112px; padding-inline: 9px; font-size: 10px; }
      .route-node::before { font-size: 17px; }
      .footer-wordmark { font-size: clamp(46px, 15vw, 60px); }
      .footer-accreditation { align-items: flex-start; border-radius: 16px; }
    }

    /* Cinematic engineering command-center redesign */
    .services-hero {
      min-height: max(900px, 100svh);
      background:
        radial-gradient(circle at 75% 47%, rgba(31, 152, 220, .22), transparent 25%),
        radial-gradient(circle at 69% 47%, rgba(68, 72, 211, .1), transparent 42%),
        linear-gradient(132deg, #01050c 0%, #04111e 48%, #061827 72%, #01060d 100%);
    }
    .services-hero::before { content: "FLEXCORE"; left: -1.5vw; bottom: -1vw; color: transparent; -webkit-text-stroke: 1px rgba(116, 222, 255, .055); font-size: clamp(130px, 19vw, 330px); letter-spacing: -.095em; }
    .services-hero::after { content: "ADVANCED ENGINEERING · SYSTEM 06"; position: absolute; top: 50%; right: 12px; z-index: 2; color: rgba(123, 213, 240, .28); font-size: 7px; letter-spacing: .28em; writing-mode: vertical-rl; transform: translateY(-50%); }
    .hero-grid { opacity: .42; background-size: 45px 45px; -webkit-mask-image: radial-gradient(circle at 73% 47%, #000 0 17%, transparent 65%); mask-image: radial-gradient(circle at 73% 47%, #000 0 17%, transparent 65%); }
    .hero-shell { grid-template-columns: minmax(440px, .82fr) minmax(620px, 1.18fr); gap: clamp(45px, 6vw, 96px); padding-top: 124px; padding-bottom: 68px; }
    .hero-copy { position: relative; z-index: 4; }
    .hero-kicker { margin-bottom: 26px; color: #91e6fb; }
    .hero-title { max-width: 710px; color: #f2fbff; font-size: clamp(72px, 6.8vw, 112px); font-weight: 370; line-height: .76; letter-spacing: -.078em; }
    .hero-title span { display: block; }
    .hero-title-primary { color: #eef8ff !important; }
    .hero-title-secondary { color: rgba(216, 235, 244, .82) !important; }
    .hero-title-accent { padding: 0 0 .08em; color: #82daf3 !important; filter: drop-shadow(0 0 28px rgba(69, 184, 229, .15)); }
    .hero-lead { max-width: 610px; margin-top: 38px; color: rgba(195, 222, 233, .67); font-size: clamp(15px, 1.24vw, 19px); }
    .hero-promise { max-width: 660px; margin-top: 26px; padding: 0; border: 0; display: flex; flex-wrap: wrap; gap: 7px; background: none; }
    .hero-promise span { min-height: 28px; padding: 0 10px; border: 1px solid rgba(103, 207, 245, .15); display: inline-flex; align-items: center; color: rgba(164, 218, 236, .62); background: rgba(9, 34, 52, .54); font-size: 7px; letter-spacing: .14em; line-height: 1; }
    .hero-actions { margin-top: 30px; }
    .button-primary,
    .button-secondary { border-radius: 4px; clip-path: polygon(0 0, calc(100% - 11px) 0, 100% 11px, 100% 100%, 11px 100%, 0 calc(100% - 11px)); letter-spacing: .075em; text-transform: uppercase; }
    .hero-manifest { max-width: 660px; margin-top: 32px; padding-top: 21px; border-top: 1px solid rgba(104, 210, 248, .13); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; background: linear-gradient(90deg, transparent, rgba(94, 201, 241, .13), transparent); }
    .hero-manifest div { min-height: 58px; padding: 7px 15px; display: flex; align-items: center; gap: 12px; background: rgba(2, 10, 20, .7); }
    .hero-manifest div:first-child { padding-left: 0; }
    .hero-manifest strong { color: #bcefff; font-family: Georgia, serif; font-size: 23px; font-weight: 400; letter-spacing: -.03em; }
    .hero-manifest span { color: rgba(142, 190, 209, .52); font-size: 7px; letter-spacing: .12em; line-height: 1.5; text-transform: uppercase; }

    .router { aspect-ratio: 1.035; overflow: hidden; contain: layout paint; border: 1px solid rgba(104, 218, 255, .25); border-radius: 0; clip-path: polygon(0 0, calc(100% - 28px) 0, 100% 28px, 100% 100%, 28px 100%, 0 calc(100% - 28px)); background: linear-gradient(rgba(86, 198, 241, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(86, 198, 241, .045) 1px, transparent 1px), radial-gradient(circle at 50% 50%, rgba(31, 147, 205, .19), transparent 27%), linear-gradient(145deg, rgba(4, 19, 34, .94), rgba(1, 8, 17, .88)); background-size: 32px 32px, 32px 32px, auto, auto; box-shadow: inset 0 0 100px rgba(62, 190, 237, .045), 0 42px 120px rgba(0, 0, 0, .4); }
    .router::before { inset: 14px; border-radius: 0; border-color: rgba(111, 218, 255, .1); clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 18px 100%, 0 calc(100% - 18px)); }
    .router::after { content: ""; position: absolute; left: 0; right: 0; top: -12%; z-index: 0; height: 18%; pointer-events: none; opacity: .24; background: linear-gradient(180deg, transparent, rgba(112, 222, 255, .27), transparent); will-change: transform; animation: routerSweep 8s linear infinite; }
    .router-toolbar { z-index: 8; color: rgba(140, 210, 235, .48); border-bottom-color: rgba(104, 213, 252, .14); }
    .router-toolbar::after { content: "CORE ONLINE · 100%"; color: rgba(162, 238, 255, .78); }
    .router-scan { position: absolute; left: 50%; top: 59px; bottom: 0; z-index: 0; width: 1px; background: linear-gradient(transparent, rgba(112, 220, 255, .16), transparent); box-shadow: 0 0 24px rgba(64, 186, 231, .16); }
    .router-coordinates { position: absolute; left: 20px; right: 20px; bottom: 16px; z-index: 7; display: flex; justify-content: space-between; color: rgba(107, 187, 216, .25); font: 6px/1 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .16em; }
    .router-traces { z-index: 2; }
    .router-traces path { stroke: rgba(103, 208, 248, .24); }
    .router-traces .current { stroke: rgba(190, 244, 255, .92); stroke-dasharray: 2 72; }
    .router-halo { position: absolute; left: 50%; top: 50%; z-index: 2; width: 390px; aspect-ratio: 1; pointer-events: none; transform: translate(-50%, -48%); animation: haloDrift 36s linear infinite; }
    .router-halo i { position: absolute; border: 1px solid rgba(105, 216, 253, .13); border-radius: 50%; }
    .router-halo i:nth-child(1) { inset: 0; border-style: dashed; }
    .router-halo i:nth-child(2) { inset: 34px; border-color: rgba(133, 104, 255, .12); }
    .router-halo i:nth-child(3) { inset: 68px; border-style: dotted; border-color: rgba(143, 229, 255, .22); }
    .router-halo b { position: absolute; width: 7px; height: 7px; border: 1px solid rgba(153, 231, 255, .74); border-radius: 50%; background: #081a28; box-shadow: 0 0 12px rgba(100, 220, 255, .64); }
    .router-halo b:nth-of-type(1) { left: 49%; top: -3px; }
    .router-halo b:nth-of-type(2) { right: 12%; bottom: 14%; }
    .router-halo b:nth-of-type(3) { left: 6%; bottom: 30%; }
    .router-core { z-index: 5; width: clamp(190px, 29%, 222px); border-radius: 50%; border-color: rgba(147, 231, 255, .48); background: radial-gradient(circle at 38% 30%, rgba(130, 225, 255, .27), transparent 24%), radial-gradient(circle at 50% 47%, rgba(39, 154, 210, .3), transparent 46%), linear-gradient(145deg, #0a2c43, #03101d 76%); box-shadow: inset -20px -24px 55px rgba(0, 6, 15, .5), inset 15px 15px 42px rgba(150, 231, 255, .08), 0 0 0 10px rgba(75, 183, 225, .025), 0 30px 80px rgba(0, 0, 0, .48), 0 0 75px rgba(50, 166, 222, .18); transform: translate(-50%, -48%); }
    .router-core::before { inset: 13px; border-radius: 50%; border-color: rgba(186, 241, 255, .15); }
    .router-core::after { inset: -17px; border-radius: 50%; border-color: rgba(130, 225, 255, .28); }
    .core-content { width: 100%; padding: 0 18px; }
    .core-content small { color: rgba(171, 230, 247, .5); font-size: 6px; }
    .core-content strong { margin-top: 12px; color: #eefcff; font-size: clamp(22px, 2.4vw, 34px); font-weight: 520; letter-spacing: -.05em; }
    .core-content strong span { color: #7bd8f5; font-weight: 360; }
    .core-active { min-height: 28px; margin-top: 12px; color: #a4e8fb; font-size: 8px; }
    .core-content em { margin-top: 9px; display: block; color: rgba(112, 202, 232, .35); font: 6px/1 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .18em; font-style: normal; }
    .route-node { z-index: 6; min-height: 75px; border-radius: 0; clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px)); background: linear-gradient(135deg, rgba(11, 44, 65, .86), rgba(4, 18, 31, .88)); }
    .route-node:hover,
    .route-node:focus-visible,
    .route-node.is-active { border-color: rgba(150, 232, 255, .62); background: linear-gradient(135deg, rgba(18, 71, 100, .96), rgba(5, 25, 42, .94)); box-shadow: 0 0 42px rgba(47, 174, 223, .16), inset 0 0 24px rgba(98, 210, 248, .06); }

    .light-bridge { height: 145px; background: linear-gradient(180deg, #01060d 0%, #061927 54%, #020913 100%); }
    .light-bridge::before { content: "SYSTEM EXPANSION / 01—06"; position: absolute; left: 50%; top: 50%; color: rgba(145, 218, 240, .28); font-size: 7px; letter-spacing: .24em; transform: translate(-50%, -50%); }
    .light-bridge path { stroke: rgba(125, 222, 255, .2); }

    .competencies-section { color: #eaf8fc; background: radial-gradient(circle at 82% 18%, rgba(40, 141, 204, .17), transparent 29%), radial-gradient(circle at 14% 76%, rgba(95, 65, 194, .08), transparent 25%), linear-gradient(150deg, #030914, #071927 58%, #020812); }
    .competencies-section::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .36; background-image: linear-gradient(rgba(96, 203, 245, .04) 1px, transparent 1px), linear-gradient(90deg, rgba(96, 203, 245, .04) 1px, transparent 1px); background-size: 52px 52px; -webkit-mask-image: radial-gradient(circle at 50% 43%, #000, transparent 80%); mask-image: radial-gradient(circle at 50% 43%, #000, transparent 80%); }
    .competencies-section::after { content: "COMMAND"; color: transparent; -webkit-text-stroke: 1px rgba(113, 214, 250, .055); }
    .competencies-section .section-kicker { color: #78d9f5; }
    .competencies-section .section-title { color: #edfaff; }
    .competencies-section .section-title span { color: #8fe2f8; }
    .competencies-section .section-intro { color: rgba(188, 217, 229, .63); }
    .service-explorer { position: relative; padding: 13px; border: 1px solid rgba(101, 207, 246, .13); clip-path: polygon(0 0, calc(100% - 22px) 0, 100% 22px, 100% 100%, 22px 100%, 0 calc(100% - 22px)); background: linear-gradient(145deg, rgba(10, 38, 56, .58), rgba(2, 11, 21, .72)); box-shadow: 0 40px 100px rgba(0, 0, 0, .28); }
    .service-explorer::before { content: "CAPABILITY CONTROL MATRIX · SELECT MODULE"; position: absolute; left: 18px; top: -26px; color: rgba(113, 208, 239, .38); font: 7px/1 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .18em; }
    .service-tabs { border-color: rgba(101, 203, 241, .12); border-radius: 0; background: rgba(2, 11, 21, .72); box-shadow: inset 0 0 45px rgba(60, 170, 216, .03); }
    .service-tab { border-radius: 0; color: rgba(169, 204, 216, .6); }
    .service-tab strong { color: #79d7f3; }
    .service-tab:hover,
    .service-tab:focus-visible { color: #e5f7fc; background: rgba(23, 71, 95, .4); }
    .service-tab.is-active { color: #effbff; border-color: rgba(108, 213, 249, .25); background: linear-gradient(90deg, rgba(29, 105, 137, .54), rgba(8, 32, 47, .72)); box-shadow: inset 3px 0 #85e1f9, 0 0 30px rgba(35, 149, 194, .09); }
    .service-panel { min-height: 640px; border-radius: 0; border-color: rgba(105, 211, 248, .18); background: radial-gradient(circle at 82% 28%, rgba(41, 165, 218, .25), transparent 26%), linear-gradient(142deg, #0a2b40, #04121f 74%); box-shadow: inset 0 1px rgba(255, 255, 255, .025), 0 34px 90px rgba(0, 0, 0, .26); }
    .service-panel::before { position: absolute; right: 3%; bottom: -10%; z-index: 0; color: transparent; -webkit-text-stroke: 1px rgba(151, 226, 250, .055); font-family: Georgia, serif; font-size: clamp(180px, 20vw, 340px); line-height: .8; }
    .service-panel:nth-child(1)::before { content: "01"; }
    .service-panel:nth-child(2)::before { content: "02"; }
    .service-panel:nth-child(3)::before { content: "03"; }
    .service-panel:nth-child(4)::before { content: "04"; }
    .service-panel:nth-child(5)::before { content: "05"; }
    .service-panel:nth-child(6)::before { content: "06"; }
    .service-panel::after { content: ""; position: absolute; right: 0; top: 0; width: 54px; height: 54px; border-top: 1px solid rgba(141, 228, 255, .42); border-right: 1px solid rgba(141, 228, 255, .42); clip-path: polygon(0 0, 100% 0, 100% 100%); }
    .service-panel > * { position: relative; z-index: 1; }
    .panel-title { font-size: clamp(42px, 4.1vw, 66px); }
    .service-visual { contain: layout paint; border-radius: 0; border-color: rgba(112, 216, 250, .19); background-color: rgba(1, 10, 19, .6); }

    .phase-bridge { position: relative; height: 180px; margin: -1px 0; overflow: hidden; isolation: isolate; }
    .phase-bridge--to-light { background: linear-gradient(180deg, #020812 0%, #09202f 30%, #6f95a4 68%, #eef5f7 100%); }
    .phase-bridge--to-dark { background: linear-gradient(180deg, #eef5f7 0%, #88a6b1 34%, #102b3a 72%, #030914 100%); }
    .phase-bridge svg { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; }
    .phase-bridge path { fill: none; stroke: rgba(218, 250, 255, .46); stroke-width: 1; vector-effect: non-scaling-stroke; }
    .phase-bridge .phase-current { stroke: rgba(238, 253, 255, .96); stroke-dasharray: 2 96; filter: drop-shadow(0 0 7px rgba(197, 245, 255, .9)); animation: currentRun 7s linear infinite; }
    .phase-bridge span { position: absolute; left: 50%; top: 52%; z-index: 2; color: rgba(236, 252, 255, .64); font-size: 7px; letter-spacing: .24em; transform: translate(-50%, -50%); white-space: nowrap; }

    .process-section { min-height: 800px; color: #173c4c; background: radial-gradient(circle at 86% 14%, rgba(42, 136, 172, .1), transparent 26%), linear-gradient(180deg, #eef5f7, #f9fbfc 58%, #eaf2f5); }
    .process-section .dark-grid { opacity: .48; background-image: linear-gradient(rgba(35, 119, 151, .04) 1px, transparent 1px), linear-gradient(90deg, rgba(35, 119, 151, .04) 1px, transparent 1px); -webkit-mask-image: radial-gradient(circle at 50% 50%, #000, transparent 76%); mask-image: radial-gradient(circle at 50% 50%, #000, transparent 76%); }
    .process-section .section-kicker { color: #1d7fa5; }
    .process-section .dark-title { color: #15394a; }
    .process-section .dark-title span { color: #278aaf; }
    .process-section .dark-intro { color: #5d7784; }
    .process-track::before { background: linear-gradient(90deg, transparent, rgba(35, 126, 161, .35) 10%, rgba(35, 126, 161, .35) 90%, transparent); }
    .process-track::after { background: linear-gradient(90deg, transparent, #2589ad, transparent); filter: drop-shadow(0 0 6px rgba(36, 135, 171, .55)); }
    .process-step { border-color: rgba(34, 116, 147, .16); color: #15394a; background: linear-gradient(145deg, rgba(255, 255, 255, .86), rgba(234, 243, 246, .74)); box-shadow: 0 22px 65px rgba(36, 77, 93, .08), inset 0 1px rgba(255, 255, 255, .9); transition: transform .38s ease, box-shadow .38s ease, border-color .38s ease; }
    .process-step:hover { border-color: rgba(34, 126, 163, .3); box-shadow: 0 30px 75px rgba(35, 81, 100, .14); transform: translateY(-7px); }
    .process-step::before { border-color: rgba(38, 135, 171, .56); background: #f1f8fa; box-shadow: 0 0 0 7px rgba(45, 136, 171, .05), 0 0 16px rgba(48, 139, 175, .2); }
    .process-step::after { background: #267fa1; box-shadow: 0 0 8px rgba(38, 132, 169, .62); }
    .step-index { color: #247e9f; }
    .process-step h3 { color: #173b4c; }
    .process-step p { color: #607985; }

    .open-brief-section { color: #e9f7fb; background: radial-gradient(circle at 74% 50%, rgba(33, 147, 209, .18), transparent 30%), radial-gradient(circle at 12% 80%, rgba(97, 66, 201, .09), transparent 26%), linear-gradient(145deg, #030914, #071a28 62%, #020812); }
    .open-brief-section::before { content: "ANY STACK"; position: absolute; left: -1vw; bottom: -2vw; color: transparent; -webkit-text-stroke: 1px rgba(120, 217, 249, .05); font-size: clamp(100px, 16vw, 270px); font-weight: 650; line-height: .8; letter-spacing: -.08em; white-space: nowrap; }
    .open-brief-section .section-kicker { color: #76d8f4; }
    .open-title { color: #edfaff; }
    .open-title span { color: #9ce5f9; }
    .open-copy { color: rgba(190, 219, 230, .66); }
    .open-note { border-left-color: #77d8f4; color: rgba(205, 232, 241, .76); background: linear-gradient(90deg, rgba(48, 157, 205, .1), transparent); }
    .brief-orbit { contain: layout paint; border-radius: 0; border-color: rgba(107, 211, 248, .2); background: linear-gradient(rgba(86, 194, 237, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(86, 194, 237, .045) 1px, transparent 1px), rgba(2, 12, 22, .66); background-size: 36px 36px; box-shadow: 0 40px 100px rgba(0, 0, 0, .32), inset 0 0 80px rgba(49, 170, 218, .05); clip-path: polygon(0 0, calc(100% - 25px) 0, 100% 25px, 100% 100%, 25px 100%, 0 calc(100% - 25px)); }
    .brief-orbit::before,
    .brief-orbit::after { border-color: rgba(115, 218, 252, .17); }
    .orbit-core { border-color: rgba(137, 226, 254, .5); color: #f0fbff; background: radial-gradient(circle at 37% 29%, rgba(133, 228, 255, .36), transparent 25%), linear-gradient(145deg, #17668a, #061b2b 74%); box-shadow: inset -22px -26px 50px rgba(0, 9, 20, .48), inset 13px 13px 30px rgba(194, 242, 255, .1), 0 26px 65px rgba(0, 0, 0, .36), 0 0 58px rgba(48, 171, 223, .2); }
    .orbit-item { border-radius: 0; border-color: rgba(105, 207, 244, .17); color: rgba(200, 227, 237, .72); background: rgba(5, 25, 39, .9); box-shadow: 0 16px 38px rgba(0, 0, 0, .22); }
    .orbit-item::before { background: #7dddf6; box-shadow: 0 0 9px rgba(94, 218, 252, .64); }
    .orbit-code { color: rgba(119, 204, 231, .27); }

    .services-cta { min-height: 760px; background: radial-gradient(circle at 50% 50%, rgba(43, 155, 219, .24), transparent 24%), radial-gradient(circle at 50% 50%, rgba(105, 73, 213, .1), transparent 45%), linear-gradient(145deg, #01050c, #071827 58%, #020810); }
    .services-cta::after { content: "INITIATE"; position: absolute; left: 50%; bottom: -2vw; z-index: -2; color: transparent; -webkit-text-stroke: 1px rgba(117, 215, 248, .06); font-size: clamp(120px, 19vw, 320px); font-weight: 650; line-height: .75; letter-spacing: -.08em; transform: translateX(-50%); }
    .cta-title { font-size: clamp(68px, 8.8vw, 140px); line-height: .8; }
    .cta-title span { color: #a0e7fa; }
    .cta-kicker { color: #83def6; }
    .cta-copy { max-width: 720px; }

    @keyframes premiumTitleFlow { to { background-position: 100% 50%; } }
    @keyframes routerSweep { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(0, 650%, 0); } }
    @keyframes haloDrift { to { transform: translate(-50%, -48%) rotate(360deg); } }

    @media (max-width: 1220px) {
      .hero-shell { grid-template-columns: minmax(390px, .72fr) minmax(540px, 1.28fr); gap: 42px; }
      .hero-title { font-size: clamp(68px, 6.8vw, 94px); }
      .service-panel { min-height: 620px; }
    }

    @media (max-width: 1020px) {
      .hero-shell { min-height: auto; padding: 138px 0 105px; grid-template-columns: 1fr; gap: 76px; }
      .hero-copy { max-width: 840px; }
      .hero-title { max-width: 800px; font-size: clamp(78px, 10vw, 112px); }
      .hero-lead,
      .hero-promise,
      .hero-manifest { max-width: 760px; }
      .router { width: min(100%, 780px); justify-self: center; transform: none; }
      .service-panel { min-height: 600px; }
    }

    @media (max-width: 700px) {
      .services-hero::after { display: none; }
      .hero-shell { padding: 112px 0 78px; gap: 58px; }
      .hero-kicker { margin-bottom: 22px; }
      .hero-title { font-size: clamp(61px, 17vw, 82px); line-height: .79; }
      .hero-lead { margin-top: 30px; }
      .hero-promise { gap: 5px; }
      .hero-promise span { min-height: 25px; padding-inline: 8px; font-size: 6px; }
      .hero-manifest { margin-top: 26px; padding-top: 15px; }
      .hero-manifest div { min-height: 58px; padding: 6px 8px; gap: 7px; }
      .hero-manifest div:first-child { padding-left: 4px; }
      .hero-manifest strong { font-size: 18px; }
      .hero-manifest span { font-size: 5px; }
      .router { min-height: 620px; aspect-ratio: auto; clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 18px 100%, 0 calc(100% - 18px)); }
      .router-toolbar { padding-inline: 13px; }
      .router-toolbar span { max-width: 210px; overflow: hidden; white-space: nowrap; }
      .router-toolbar::after { content: "ONLINE"; }
      .router-coordinates { display: none; }
      .router-halo { top: 56%; width: 270px; }
      .router-core { top: 56%; width: 150px; }
      .core-content strong { font-size: 22px; }
      .core-active { max-width: 112px; font-size: 7px; }
      .route-node { min-height: 74px; }
      .light-bridge { height: 118px; }
      .light-bridge::before { font-size: 6px; }
      .competencies-section::after { top: 8%; }
      .service-explorer { padding: 8px; clip-path: polygon(0 0, calc(100% - 15px) 0, 100% 15px, 100% 100%, 15px 100%, 0 calc(100% - 15px)); }
      .service-tabs { border-radius: 0; }
      .service-panel { min-height: 0; border-radius: 0; }
      .service-panel::before { right: 2%; bottom: -2%; font-size: 180px; }
      .phase-bridge { height: 135px; }
      .phase-bridge span { font-size: 6px; }
      .process-step { min-height: 270px; }
      .process-step:hover { transform: none; }
      .open-brief-shell { gap: 62px; }
      .brief-orbit { min-height: 550px; border-radius: 0; }
      .services-cta { min-height: 690px; }
      .cta-title { font-size: clamp(58px, 16vw, 80px); }
    }

    @media (max-width: 450px) {
      .hero-title { font-size: clamp(58px, 16.6vw, 72px); }
      .hero-manifest span { letter-spacing: .08em; }
      .router-halo { width: 250px; }
      .service-explorer::before { letter-spacing: .11em; }
    }

    /* Spectrum system: individual color and geometry for every capability */
    .hero-title-accent { color: #82daf3 !important; }
    .hero-promise span { position: relative; overflow: hidden; }
    .hero-promise span::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 2px; background: var(--chip-color, #6bd8f6); box-shadow: 0 0 10px var(--chip-color, #6bd8f6); }
    .hero-promise span:nth-child(1) { --chip-color: #60caff; }
    .hero-promise span:nth-child(2) { --chip-color: #b38cff; }
    .hero-promise span:nth-child(3) { --chip-color: #43dbc1; }
    .hero-promise span:nth-child(4) { --chip-color: #eda454; }
    .hero-promise span:nth-child(5) { --chip-color: #8d83ff; }
    .hero-promise span:nth-child(6) { --chip-color: #71d69b; }
    .hero-manifest { background: linear-gradient(90deg, rgba(84, 202, 244, .2), rgba(174, 127, 246, .2) 52%, rgba(239, 171, 87, .17)); }
    .hero-manifest strong { color: #bcefff; }
    .button-primary { border-color: rgba(127, 210, 255, .44); background: linear-gradient(110deg, #0f74ba 0%, #176bba 48%, #654fae 100%); box-shadow: inset 0 1px rgba(255, 255, 255, .14), 0 15px 36px rgba(24, 91, 166, .23); }
    .button-primary:hover,
    .button-primary:focus-visible { border-color: rgba(206, 181, 255, .68); box-shadow: 0 18px 44px rgba(74, 79, 187, .28); }

    .route-node:nth-of-type(1) { --node-accent: #62cbff; --node-rgb: 98, 203, 255; }
    .route-node:nth-of-type(2) { --node-accent: #b28cff; --node-rgb: 178, 140, 255; }
    .route-node:nth-of-type(3) { --node-accent: #48dec3; --node-rgb: 72, 222, 195; }
    .route-node:nth-of-type(4) { --node-accent: #efa657; --node-rgb: 239, 166, 87; }
    .route-node:nth-of-type(5) { --node-accent: #8f86ff; --node-rgb: 143, 134, 255; }
    .route-node:nth-of-type(6) { --node-accent: #76d99b; --node-rgb: 118, 217, 155; }
    .route-node { border-color: rgba(var(--node-rgb), .18); box-shadow: inset 3px 0 rgba(var(--node-rgb), .68), inset 0 1px rgba(255, 255, 255, .025); }
    .route-node::before { color: var(--node-accent); text-shadow: 0 0 15px rgba(var(--node-rgb), .32); }
    .route-node:hover,
    .route-node:focus-visible,
    .route-node.is-active { border-color: rgba(var(--node-rgb), .66); background: linear-gradient(135deg, rgba(var(--node-rgb), .22), rgba(5, 24, 40, .94) 68%); box-shadow: inset 3px 0 var(--node-accent), 0 0 42px rgba(var(--node-rgb), .2), inset 0 0 28px rgba(var(--node-rgb), .07); }
    .router[data-active-service="1"] { --core-accent: #68ceff; --core-rgb: 104, 206, 255; }
    .router[data-active-service="2"] { --core-accent: #b790ff; --core-rgb: 183, 144, 255; }
    .router[data-active-service="3"] { --core-accent: #4ae0c5; --core-rgb: 74, 224, 197; }
    .router[data-active-service="4"] { --core-accent: #f0aa5d; --core-rgb: 240, 170, 93; }
    .router[data-active-service="5"] { --core-accent: #968cff; --core-rgb: 150, 140, 255; }
    .router[data-active-service="6"] { --core-accent: #79dca0; --core-rgb: 121, 220, 160; }
    .router-core { border-color: rgba(var(--core-rgb, 104, 206, 255), .56); background: radial-gradient(circle at 37% 28%, rgba(var(--core-rgb, 104, 206, 255), .38), transparent 25%), radial-gradient(circle at 50% 48%, rgba(var(--core-rgb, 104, 206, 255), .18), transparent 47%), linear-gradient(145deg, #0a2b43, #030e1a 76%); box-shadow: inset -20px -24px 55px rgba(0, 6, 15, .5), inset 15px 15px 42px rgba(var(--core-rgb, 104, 206, 255), .1), 0 0 0 10px rgba(var(--core-rgb, 104, 206, 255), .025), 0 30px 80px rgba(0, 0, 0, .48), 0 0 78px rgba(var(--core-rgb, 104, 206, 255), .24); transition: border-color .5s ease, background .6s ease, box-shadow .6s ease; }
    .core-content strong span,
    .core-active { color: var(--core-accent, #7bd8f5); transition: color .5s ease; }
    .router-halo::before { content: ""; position: absolute; inset: -2px; border-radius: 50%; opacity: .33; background: conic-gradient(from 20deg, #55cef2, transparent 18%, #ad85ff 31%, transparent 49%, #eda65a 62%, transparent 77%, #47d9bd 90%, #55cef2); -webkit-mask: radial-gradient(transparent 67%, #000 68% 69%, transparent 70%); mask: radial-gradient(transparent 67%, #000 68% 69%, transparent 70%); }
    .router-traces path:nth-child(1),
    .router-traces path:nth-child(7) { stroke: #62cbff; }
    .router-traces path:nth-child(2),
    .router-traces path:nth-child(8) { stroke: #b28cff; }
    .router-traces path:nth-child(3),
    .router-traces path:nth-child(9) { stroke: #48dec3; }
    .router-traces path:nth-child(4),
    .router-traces path:nth-child(10) { stroke: #efa657; }
    .router-traces path:nth-child(5),
    .router-traces path:nth-child(11) { stroke: #8f86ff; }
    .router-traces path:nth-child(6),
    .router-traces path:nth-child(12) { stroke: #76d99b; }
    .router-traces path:not(.current) { opacity: .34; }
    .router-traces .current { opacity: .9; filter: drop-shadow(0 0 5px currentColor); }
    .light-bridge { background: radial-gradient(circle at 24% 60%, rgba(74, 213, 197, .13), transparent 18%), radial-gradient(circle at 72% 45%, rgba(171, 129, 250, .15), transparent 22%), linear-gradient(180deg, #01060d 0%, #071b2b 54%, #020913 100%); }

    .competencies-section { background: radial-gradient(circle at 84% 18%, rgba(93, 93, 216, .15), transparent 27%), radial-gradient(circle at 13% 77%, rgba(36, 174, 155, .1), transparent 24%), radial-gradient(circle at 54% 58%, rgba(224, 133, 73, .055), transparent 31%), linear-gradient(150deg, #030914, #081a29 58%, #020812); }
    .service-tab:nth-child(1) { --tab-accent: #62cbff; --tab-rgb: 98, 203, 255; }
    .service-tab:nth-child(2) { --tab-accent: #b28cff; --tab-rgb: 178, 140, 255; }
    .service-tab:nth-child(3) { --tab-accent: #48dec3; --tab-rgb: 72, 222, 195; }
    .service-tab:nth-child(4) { --tab-accent: #efa657; --tab-rgb: 239, 166, 87; }
    .service-tab:nth-child(5) { --tab-accent: #8f86ff; --tab-rgb: 143, 134, 255; }
    .service-tab:nth-child(6) { --tab-accent: #76d99b; --tab-rgb: 118, 217, 155; }
    .service-tab strong { color: var(--tab-accent); text-shadow: 0 0 14px rgba(var(--tab-rgb), .24); }
    .service-tab.is-active { border-color: rgba(var(--tab-rgb), .38); background: linear-gradient(90deg, rgba(var(--tab-rgb), .25), rgba(7, 30, 45, .7) 72%); box-shadow: inset 3px 0 var(--tab-accent), 0 0 34px rgba(var(--tab-rgb), .12); }
    .service-explorer[data-active-service="1"] { --active-accent: #62cbff; --active-rgb: 98, 203, 255; }
    .service-explorer[data-active-service="2"] { --active-accent: #b28cff; --active-rgb: 178, 140, 255; }
    .service-explorer[data-active-service="3"] { --active-accent: #48dec3; --active-rgb: 72, 222, 195; }
    .service-explorer[data-active-service="4"] { --active-accent: #efa657; --active-rgb: 239, 166, 87; }
    .service-explorer[data-active-service="5"] { --active-accent: #8f86ff; --active-rgb: 143, 134, 255; }
    .service-explorer[data-active-service="6"] { --active-accent: #76d99b; --active-rgb: 118, 217, 155; }
    .service-explorer { border-color: rgba(var(--active-rgb, 98, 203, 255), .24); box-shadow: 0 40px 100px rgba(0, 0, 0, .28), 0 0 65px rgba(var(--active-rgb, 98, 203, 255), .06); transition: border-color .5s ease, box-shadow .6s ease; }
    .service-explorer::after { content: ""; position: absolute; right: 0; top: 16%; bottom: 16%; width: 2px; background: linear-gradient(transparent, var(--active-accent, #62cbff), transparent); box-shadow: 0 0 14px rgba(var(--active-rgb, 98, 203, 255), .62); transition: background .5s ease, box-shadow .5s ease; }

    .service-panel:nth-child(1) { --accent: #62cbff; --accent-2: #2779c8; --accent-rgb: 98, 203, 255; border-radius: 0 58px 0 0; background: radial-gradient(circle at 82% 28%, rgba(62, 165, 225, .28), transparent 27%), linear-gradient(142deg, #0a2d45, #04121f 74%); }
    .service-panel:nth-child(2) { --accent: #b28cff; --accent-2: #ef8ac1; --accent-rgb: 178, 140, 255; clip-path: polygon(0 0, calc(100% - 46px) 0, 100% 46px, 100% 100%, 0 100%); background: radial-gradient(circle at 18% 24%, rgba(235, 119, 183, .17), transparent 23%), radial-gradient(circle at 82% 70%, rgba(144, 102, 237, .24), transparent 30%), linear-gradient(142deg, #211738, #090f22 72%); }
    .service-panel:nth-child(3) { --accent: #48dec3; --accent-2: #2ca1c8; --accent-rgb: 72, 222, 195; border-radius: 48px 0 48px 0; background: radial-gradient(circle at 77% 25%, rgba(51, 208, 181, .24), transparent 27%), linear-gradient(142deg, #073b3d, #061522 72%); }
    .service-panel:nth-child(4) { --accent: #efa657; --accent-2: #e9684f; --accent-rgb: 239, 166, 87; clip-path: polygon(34px 0, 100% 0, 100% 100%, 0 100%, 0 34px); background: radial-gradient(circle at 18% 76%, rgba(229, 91, 66, .18), transparent 27%), radial-gradient(circle at 83% 25%, rgba(239, 166, 87, .23), transparent 25%), linear-gradient(142deg, #3a261d, #111521 72%); }
    .service-panel:nth-child(5) { --accent: #8f86ff; --accent-2: #cb7cff; --accent-rgb: 143, 134, 255; border-radius: 0 68px 0 68px; background: radial-gradient(circle at 80% 25%, rgba(164, 104, 255, .28), transparent 28%), radial-gradient(circle at 14% 80%, rgba(68, 111, 225, .14), transparent 24%), linear-gradient(142deg, #1b1b48, #071222 72%); }
    .service-panel:nth-child(6) { --accent: #76d99b; --accent-2: #9d7eff; --accent-rgb: 118, 217, 155; clip-path: polygon(0 0, calc(100% - 34px) 0, 100% 34px, 100% calc(100% - 34px), calc(100% - 34px) 100%, 34px 100%, 0 calc(100% - 34px)); background: radial-gradient(circle at 77% 26%, rgba(111, 214, 151, .22), transparent 27%), radial-gradient(circle at 17% 78%, rgba(149, 102, 242, .18), transparent 25%), linear-gradient(142deg, #0b332e, #0a1324 72%); }
    .service-panel:nth-child(even) { grid-template-columns: minmax(290px, .7fr) minmax(360px, .92fr); }
    .service-panel:nth-child(even) .service-visual { order: -1; }
    .service-panel::before { -webkit-text-stroke-color: rgba(var(--accent-rgb), .11); }
    .service-panel::after { border-color: rgba(var(--accent-rgb), .68); }
    .service-panel .panel-index { color: var(--accent); }
    .service-panel .panel-index::after { background: linear-gradient(90deg, rgba(var(--accent-rgb), .72), transparent); }
    .service-panel .panel-title { text-shadow: 0 0 36px rgba(var(--accent-rgb), .08); }
    .service-panel .panel-scope li { border-color: rgba(var(--accent-rgb), .16); background: linear-gradient(110deg, rgba(var(--accent-rgb), .08), rgba(8, 29, 43, .48)); }
    .service-panel .panel-scope li::before { background: var(--accent); box-shadow: 0 0 10px rgba(var(--accent-rgb), .82); }
    .service-panel .service-visual { border-color: rgba(var(--accent-rgb), .3); background-image: linear-gradient(rgba(var(--accent-rgb), .055) 1px, transparent 1px), linear-gradient(90deg, rgba(var(--accent-rgb), .055) 1px, transparent 1px), radial-gradient(circle at 50% 48%, rgba(var(--accent-rgb), .12), transparent 45%); box-shadow: inset 0 0 65px rgba(var(--accent-rgb), .06), 0 22px 52px rgba(0, 0, 0, .16); }
    .service-panel:nth-child(1) .service-visual { border-radius: 0 34px 0 0; }
    .service-panel:nth-child(2) .service-visual { border-radius: 36px 0 36px 0; transform: perspective(900px) rotateY(4deg); }
    .service-panel:nth-child(3) .service-visual { clip-path: polygon(8% 0, 92% 0, 100% 12%, 100% 88%, 92% 100%, 8% 100%, 0 88%, 0 12%); }
    .service-panel:nth-child(4) .service-visual { clip-path: polygon(0 0, 100% 0, 100% 84%, 84% 100%, 0 100%); }
    .service-panel:nth-child(5) .service-visual { border-radius: 50% 50% 22px 22px; }
    .service-panel:nth-child(6) .service-visual { clip-path: polygon(15% 0, 100% 0, 100% 85%, 85% 100%, 0 100%, 0 15%); }
    /* Restrained two-colour command centre: fewer paint layers, no animated image filters. */
    .competencies-section { background: radial-gradient(circle at 82% 20%, rgba(89, 112, 205, .12), transparent 29%), radial-gradient(circle at 13% 78%, rgba(61, 172, 210, .08), transparent 25%), linear-gradient(150deg, #030914, #081925 58%, #020812); }
    .route-node:nth-of-type(n) { --node-accent: #72d2ef; --node-rgb: 114, 210, 239; }
    .route-node:nth-of-type(even) { --node-accent: #9ba9ee; --node-rgb: 155, 169, 238; }
    .router[data-active-service] { --core-accent: #76d5f0; --core-rgb: 118, 213, 240; }
    .router-halo::before { background: conic-gradient(from 20deg, #55c9ec, transparent 22%, #899bea 44%, transparent 67%, #55c9ec); }
    .router-traces path:nth-child(n) { stroke: #72d2ef; }
    .router-traces path:nth-child(even) { stroke: #9ba9ee; }

    .service-tab:nth-child(n) { --tab-accent: #72d2ef; --tab-rgb: 114, 210, 239; }
    .service-tab:nth-child(even) { --tab-accent: #9ba9ee; --tab-rgb: 155, 169, 238; }
    .service-tab strong { text-shadow: none; }
    .service-tab.is-active { border-color: rgba(var(--tab-rgb), .34); background: linear-gradient(90deg, rgba(var(--tab-rgb), .17), rgba(7, 30, 45, .68) 72%); box-shadow: inset 3px 0 var(--tab-accent); }
    .service-explorer[data-active-service] { --active-accent: #72d2ef; --active-rgb: 114, 210, 239; }
    .service-explorer { border-color: rgba(114, 210, 239, .2); box-shadow: 0 30px 76px rgba(0, 0, 0, .23); transition: none; }
    .service-explorer::after { background: linear-gradient(transparent, #72d2ef, transparent); box-shadow: 0 0 10px rgba(114, 210, 239, .36); transition: none; }

    .service-panel:nth-child(n) { --accent: #72d2ef; --accent-2: #7394d8; --accent-rgb: 114, 210, 239; clip-path: none; border-radius: 0 38px 0 0; background: radial-gradient(circle at 82% 28%, rgba(79, 151, 198, .16), transparent 30%), linear-gradient(142deg, #0b2a3b, #071522 74%); }
    .service-panel:nth-child(even) { --accent: #9ba9ee; --accent-2: #72d2ef; --accent-rgb: 155, 169, 238; }
    .service-panel:nth-child(n) .service-visual { clip-path: none; border-radius: 18px; transform: none; background-image: none; background-color: #061522; box-shadow: inset 0 0 45px rgba(85, 178, 216, .045), 0 18px 42px rgba(0, 0, 0, .14); }
    .service-panel::after { border-color: rgba(114, 210, 239, .4); }
    .service-panel .panel-scope li { border-color: rgba(114, 210, 239, .13); background: rgba(8, 30, 44, .54); }
    .service-panel .panel-scope li::before { background: #72d2ef; box-shadow: 0 0 7px rgba(114, 210, 239, .54); }

    .service-visual--art { isolation: isolate; background-color: #061522; }
    .service-visual--art::before { display: none; }
    .service-visual--art::after { content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none; background: linear-gradient(180deg, rgba(3, 13, 24, .08), rgba(3, 13, 24, .4)), linear-gradient(135deg, rgba(80, 175, 211, .08), rgba(85, 94, 174, .09)); box-shadow: inset 0 0 55px rgba(83, 177, 213, .1); }
    .service-art { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; object-fit: cover; opacity: .86; filter: none; transform: none; transition: none; }
    .service-art:not([src]) { opacity: 0; }
    .service-panel:nth-child(n) .service-art,
    .service-panel:nth-child(n).is-active .service-visual--art:hover .service-art { opacity: .86; filter: none; transform: none; }

    .phase-bridge::before { content: ""; position: absolute; left: 8%; right: 8%; top: 50%; z-index: 1; height: 1px; background: linear-gradient(90deg, transparent, #56cffa 17%, #a583ff 38%, #ed9fa5 57%, #eda453 74%, #46d8b9 90%, transparent); box-shadow: 0 0 10px rgba(154, 164, 255, .34); }
    .phase-bridge::after { content: ""; position: absolute; top: calc(50% - 2px); left: 8%; z-index: 2; width: 70px; height: 4px; border-radius: 50%; background: linear-gradient(90deg, transparent, #fff, transparent); filter: blur(.5px) drop-shadow(0 0 7px #9be9ff); animation: spectrumSignal 7s linear infinite; }
    .process-track::before { height: 2px; background: linear-gradient(90deg, transparent, #4eb7ed 10%, #9d77e8 38%, #e69a47 67%, #38aa93 90%, transparent); opacity: .56; }
    .process-step:nth-child(1) { --step-accent: #4eb7ed; --step-rgb: 78, 183, 237; border-radius: 42px 10px 10px 10px; }
    .process-step:nth-child(2) { --step-accent: #9d77e8; --step-rgb: 157, 119, 232; margin-top: 38px; border-radius: 10px 42px 10px 10px; background: linear-gradient(145deg, rgba(249, 246, 255, .94), rgba(235, 229, 247, .78)); }
    .process-step:nth-child(3) { --step-accent: #e69a47; --step-rgb: 230, 154, 71; clip-path: polygon(0 0, calc(100% - 34px) 0, 100% 34px, 100% 100%, 0 100%); background: linear-gradient(145deg, rgba(255, 250, 241, .94), rgba(244, 235, 220, .78)); }
    .process-step:nth-child(4) { --step-accent: #45d0b2; --step-rgb: 69, 208, 178; margin-top: 38px; border-radius: 10px 10px 42px 10px; color: #eafffa; background: radial-gradient(circle at 80% 18%, rgba(67, 207, 177, .2), transparent 30%), linear-gradient(145deg, #133b42, #09212d); box-shadow: 0 26px 70px rgba(19, 69, 72, .18), inset 0 2px rgba(104, 225, 202, .38); }
    .process-step { border-color: rgba(var(--step-rgb), .27); box-shadow: 0 22px 65px rgba(36, 77, 93, .08), inset 0 2px rgba(var(--step-rgb), .56); }
    .process-step::before { border-color: rgba(var(--step-rgb), .75); }
    .process-step::after { background: var(--step-accent); box-shadow: 0 0 10px rgba(var(--step-rgb), .78); }
    .process-step .step-index { color: var(--step-accent); }
    .process-step:nth-child(4) h3 { color: #effffc; }
    .process-step:nth-child(4) p { color: rgba(202, 235, 229, .66); }

    .open-brief-section { background: radial-gradient(circle at 74% 49%, rgba(105, 86, 226, .2), transparent 28%), radial-gradient(circle at 17% 35%, rgba(226, 137, 69, .075), transparent 22%), radial-gradient(circle at 11% 82%, rgba(45, 191, 163, .12), transparent 24%), linear-gradient(145deg, #030914, #091a2b 61%, #030811); }
    .open-note { border-left-color: #efa657; background: linear-gradient(90deg, rgba(239, 166, 87, .12), rgba(145, 115, 234, .04), transparent); }
    .orbit-core { background: radial-gradient(circle at 34% 28%, rgba(118, 226, 255, .44), transparent 24%), radial-gradient(circle at 68% 72%, rgba(178, 123, 255, .25), transparent 37%), linear-gradient(145deg, #176d88, #151b45 72%); box-shadow: inset -22px -26px 50px rgba(0, 9, 20, .48), inset 13px 13px 30px rgba(194, 242, 255, .1), 0 26px 65px rgba(0, 0, 0, .36), 0 0 32px rgba(67, 208, 240, .2), 0 0 78px rgba(145, 113, 244, .12); }
    .orbit-item:nth-of-type(2) { --orbit-color: #5bcdf2; --orbit-rgb: 91, 205, 242; border-radius: 24px 0 0 0; }
    .orbit-item:nth-of-type(3) { --orbit-color: #ad87ff; --orbit-rgb: 173, 135, 255; border-radius: 0 24px 0 0; }
    .orbit-item:nth-of-type(4) { --orbit-color: #efa657; --orbit-rgb: 239, 166, 87; clip-path: polygon(0 0, 100% 0, 100% 78%, 88% 100%, 0 100%); }
    .orbit-item:nth-of-type(5) { --orbit-color: #50d3aa; --orbit-rgb: 80, 211, 170; border-radius: 0 0 24px 0; }
    .orbit-item { border-color: rgba(var(--orbit-rgb), .35); background: linear-gradient(110deg, rgba(var(--orbit-rgb), .13), rgba(5, 25, 39, .92) 65%); box-shadow: 0 16px 38px rgba(0, 0, 0, .22), inset 2px 0 var(--orbit-color); }
    .orbit-item::before { background: var(--orbit-color); box-shadow: 0 0 10px rgba(var(--orbit-rgb), .8); }
    .services-cta { background: radial-gradient(circle at 37% 48%, rgba(40, 173, 214, .16), transparent 24%), radial-gradient(circle at 61% 47%, rgba(135, 95, 225, .18), transparent 27%), radial-gradient(circle at 80% 69%, rgba(231, 142, 79, .06), transparent 20%), linear-gradient(145deg, #01050c, #081827 58%, #030810); }
    .services-cta .button-primary { background: linear-gradient(110deg, #1179b9 0%, #495cbd 55%, #8050ae 100%); }

    @keyframes spectrumSignal { from { left: 5%; } to { left: 91%; } }

    @media (max-width: 1020px) {
      .service-panel:nth-child(even) { grid-template-columns: minmax(260px, .7fr) minmax(320px, .9fr); }
      .process-step:nth-child(2),
      .process-step:nth-child(4) { margin-top: 0; }
    }

    @media (max-width: 700px) {
      .service-panel:nth-child(even) { grid-template-columns: 1fr; }
      .service-panel:nth-child(even) .service-visual { order: initial; }
      .service-panel:nth-child(2) .service-visual { transform: none; }
      .service-panel:nth-child(1) { border-radius: 0 34px 0 0; }
      .service-panel:nth-child(3) { border-radius: 30px 0 30px 0; }
      .service-panel:nth-child(5) { border-radius: 0 36px 0 36px; }
      .process-step:nth-child(2),
      .process-step:nth-child(4) { margin-top: 0; }
      .phase-bridge::after { animation-duration: 5.5s; }
    }

    /* Friendly project atelier: from a small task to a large digital system. */
    .services-hero {
      min-height: max(900px, 100svh);
      background:
        radial-gradient(circle at 78% 33%, rgba(78, 170, 224, .2), transparent 28%),
        radial-gradient(circle at 88% 83%, rgba(232, 164, 116, .09), transparent 22%),
        radial-gradient(circle at 35% 9%, rgba(122, 119, 219, .08), transparent 24%),
        linear-gradient(138deg, #020711 0%, #061522 54%, #081b29 76%, #020812 100%);
    }
    .services-hero::before { content: "FLEXCORE"; left: -1.2vw; bottom: -1.2vw; color: transparent; -webkit-text-stroke: 1px rgba(132, 219, 247, .05); font-size: clamp(130px, 18vw, 315px); }
    .services-hero::after { content: "САЙТ · СЕРВИС · СИСТЕМА"; top: 50%; right: 14px; color: rgba(142, 216, 239, .3); letter-spacing: .25em; }
    .hero-grid { opacity: .42; background-image: radial-gradient(circle, rgba(126, 211, 240, .12) 0 1px, transparent 1.35px); background-size: 26px 26px; -webkit-mask-image: radial-gradient(ellipse at 71% 43%, #000 0 18%, transparent 67%); mask-image: radial-gradient(ellipse at 71% 43%, #000 0 18%, transparent 67%); }
    .hero-shell { grid-template-columns: minmax(480px, .94fr) minmax(560px, 1.06fr); gap: clamp(48px, 5.8vw, 92px); padding-top: 118px; padding-bottom: 66px; }
    .breadcrumbs { margin-bottom: 38px; }
    .hero-kicker { margin-bottom: 24px; color: #8adcf3; letter-spacing: .17em; }
    .hero-title { max-width: 760px; font-size: clamp(78px, 7vw, 118px); font-weight: 390; line-height: .76; letter-spacing: -.082em; }
    .hero-title-primary { color: #f4fbff !important; }
    .hero-title-secondary { margin-left: .32em; color: rgba(219, 237, 245, .82) !important; }
    .hero-title-accent { position: relative; margin-left: .08em; color: #85dcf4 !important; }
    .hero-title-accent::after { content: "✦"; position: absolute; top: .05em; right: -.37em; color: #e7ae82; font-size: .22em; font-weight: 400; line-height: 1; text-shadow: 0 0 18px rgba(231, 174, 130, .34); }
    .hero-title-note { margin: 24px 0 0 7px; display: flex; align-items: center; gap: 11px; color: rgba(165, 215, 231, .61); font-size: 9px; letter-spacing: .15em; line-height: 1.4; text-transform: uppercase; }
    .hero-title-note i { width: 23px; height: 23px; border: 1px solid rgba(126, 214, 242, .34); border-radius: 50%; display: inline-grid; place-items: center; box-shadow: inset 0 0 13px rgba(74, 183, 220, .08); }
    .hero-title-note i::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: #8bdcf2; box-shadow: 0 0 10px rgba(121, 219, 246, .75); }
    .hero-lead { max-width: 660px; margin-top: 28px; color: rgba(201, 226, 235, .73); font-size: clamp(15px, 1.18vw, 18px); line-height: 1.68; }
    .hero-promise { max-width: 690px; margin-top: 24px; gap: 7px; }
    .hero-promise span { min-height: 32px; padding: 0 13px 0 25px; border-color: rgba(127, 213, 241, .18); border-radius: 999px; color: rgba(204, 233, 242, .72); background: rgba(9, 36, 53, .66); font-size: 8px; letter-spacing: .08em; text-transform: none; }
    .hero-promise span::before { left: 11px; top: 50%; bottom: auto; width: 5px; height: 5px; border-radius: 50%; transform: translateY(-50%); box-shadow: 0 0 8px var(--chip-color, #6bd8f6); }
    .hero-promise span:nth-child(n) { --chip-color: #79d4ee; }
    .hero-promise span:nth-child(even) { --chip-color: #aab5ee; }
    .hero-actions { margin-top: 27px; }
    .hero-actions .button-primary,
    .hero-actions .button-secondary { min-height: 50px; padding-inline: 22px; border-radius: 999px; clip-path: none; font-size: 10px; letter-spacing: .035em; text-transform: none; }
    .hero-actions .button-primary { border-color: rgba(138, 222, 247, .5); background: linear-gradient(120deg, #187ca9, #315eaf); }
    .hero-actions .button-secondary { border-color: rgba(140, 210, 233, .18); background: rgba(12, 34, 49, .56); }
    .hero-manifest { position: relative; max-width: 675px; margin-top: 35px; padding: 10px; border: 1px solid rgba(128, 209, 235, .13); border-radius: 22px; gap: 8px; background: rgba(4, 19, 30, .62); box-shadow: inset 0 1px rgba(255, 255, 255, .025); }
    .hero-manifest::before { content: "масштаб проекта"; position: absolute; left: 16px; top: -8px; padding: 0 8px; color: rgba(143, 204, 223, .45); background: #05121e; font-size: 6px; letter-spacing: .18em; text-transform: uppercase; }
    .hero-manifest div { min-height: 68px; padding: 10px 13px; border: 1px solid rgba(120, 207, 235, .08); border-radius: 15px; display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 10px; background: rgba(11, 39, 54, .58); }
    .hero-manifest div:first-child { padding-left: 13px; }
    .hero-manifest div:nth-child(even) { background: rgba(26, 38, 69, .52); }
    .hero-manifest strong { color: #a9e7f7; font-family: inherit; font-size: 25px; font-weight: 520; }
    .hero-manifest div:nth-child(even) strong { color: #c4c9f7; }
    .hero-manifest span { color: rgba(174, 211, 223, .55); font-size: 6px; letter-spacing: .1em; line-height: 1.55; }

    .router { aspect-ratio: 1.04; overflow: hidden; contain: layout paint; border-color: rgba(127, 212, 240, .21); border-radius: 42px 9px 42px 42px; clip-path: none; background: radial-gradient(circle at 18% 16%, rgba(232, 170, 123, .11), transparent 17%), radial-gradient(circle at 78% 76%, rgba(119, 130, 224, .14), transparent 25%), radial-gradient(circle, rgba(121, 209, 237, .07) 0 1px, transparent 1.2px), linear-gradient(145deg, rgba(7, 28, 42, .9), rgba(3, 13, 24, .92)); background-size: auto, auto, 27px 27px, auto; box-shadow: inset 0 1px rgba(255, 255, 255, .04), 0 42px 115px rgba(0, 0, 0, .34); transform: perspective(1100px) rotateY(-1.5deg) rotateX(.5deg); }
    .router::before { inset: 13px; border-color: rgba(137, 216, 240, .09); border-radius: 33px 4px 33px 33px; clip-path: none; }
    .router::after { content: "ЗАДАЧА ЛЮБОГО МАСШТАБА"; left: auto; right: 22px; top: 76px; bottom: auto; width: auto; height: auto; padding: 8px 11px; border: 1px solid rgba(231, 174, 130, .24); border-radius: 999px; opacity: 1; color: rgba(239, 196, 160, .7); background: rgba(82, 48, 35, .22); filter: none; font-size: 6px; letter-spacing: .15em; line-height: 1; animation: none; }
    .router-toolbar { height: 62px; padding-inline: 22px; color: rgba(165, 218, 234, .55); font-size: 8px; letter-spacing: .14em; }
    .router-toolbar::after { content: "ОТКРЫТО ДЛЯ ИДЕЙ"; padding: 7px 10px 7px 22px; border: 1px solid rgba(123, 210, 237, .15); border-radius: 999px; color: rgba(185, 232, 245, .72); background: radial-gradient(circle at 11px 50%, #82daf1 0 2px, transparent 3px), rgba(9, 34, 49, .56); }
    .router-scan,
    .router-traces { display: none; }
    .router-coordinates { left: 23px; right: 23px; bottom: 17px; z-index: 8; color: rgba(147, 204, 220, .4); font-size: 6px; letter-spacing: .1em; }
    .router-coordinates span { padding-top: 8px; border-top: 1px solid rgba(124, 205, 231, .13); }
    .router-halo { top: 51%; width: 380px; border-radius: 43% 57% 53% 47% / 48% 42% 58% 52%; opacity: .9; background: radial-gradient(circle at 36% 30%, rgba(118, 213, 240, .16), transparent 36%), linear-gradient(135deg, rgba(81, 132, 205, .11), rgba(157, 112, 203, .08) 58%, rgba(225, 164, 119, .07)); transform: translate(-50%, -49%) rotate(-8deg); animation: none; }
    .router-halo i,
    .router-halo b,
    .router-halo::before { display: none; }
    .router-core { top: 51%; width: clamp(205px, 30%, 232px); border-color: rgba(142, 224, 247, .46); border-radius: 50%; background: radial-gradient(circle at 35% 27%, rgba(144, 227, 248, .3), transparent 24%), radial-gradient(circle at 62% 74%, rgba(127, 118, 219, .16), transparent 37%), linear-gradient(145deg, #0c3549, #06131f 76%); box-shadow: inset -20px -24px 55px rgba(0, 6, 15, .46), inset 14px 14px 38px rgba(185, 239, 251, .08), 0 28px 70px rgba(0, 0, 0, .42), 0 0 65px rgba(74, 181, 219, .18); transform: translate(-50%, -49%); }
    .router-core::before { inset: 13px; border-radius: 50%; border-color: rgba(190, 241, 252, .13); }
    .router-core::after { inset: -15px; border: 1px solid rgba(132, 215, 239, .2); border-radius: 46% 54% 49% 51%; animation: none; transform: rotate(10deg); }
    .core-content small { color: rgba(184, 227, 239, .55); font-size: 6px; letter-spacing: .15em; }
    .core-content strong { margin-top: 13px; font-size: clamp(28px, 2.65vw, 38px); }
    .core-active { max-width: 155px; min-height: 30px; margin-top: 13px; color: #95def2; font-size: 8px; }
    .core-content em { margin-top: 8px; color: rgba(153, 208, 224, .38); font-size: 5px; letter-spacing: .13em; }
    .route-node { width: 29%; min-height: 82px; padding: 12px 14px; border-color: rgba(var(--node-rgb), .19); border-radius: 24px 24px 8px 24px; gap: 10px; color: rgba(220, 239, 245, .78); background: rgba(11, 37, 51, .78); box-shadow: inset 0 1px rgba(255, 255, 255, .035), 0 14px 30px rgba(0, 0, 0, .16); transform: rotate(var(--card-tilt, 0deg)); }
    .route-node:nth-of-type(even) { border-radius: 8px 24px 24px 24px; background: rgba(24, 32, 60, .76); }
    .route-node::before { width: 30px; height: 30px; border: 1px solid rgba(var(--node-rgb), .24); border-radius: 50%; display: grid; place-items: center; color: var(--node-accent); background: rgba(var(--node-rgb), .06); font-family: inherit; font-size: 10px; }
    .route-node span { font-size: 10px; line-height: 1.35; }
    .route-node:hover,
    .route-node:focus-visible,
    .route-node.is-active { color: #f2fbff; border-color: rgba(var(--node-rgb), .55); background: linear-gradient(145deg, rgba(var(--node-rgb), .17), rgba(8, 29, 43, .9) 72%); box-shadow: 0 18px 42px rgba(0, 0, 0, .22), inset 0 0 30px rgba(var(--node-rgb), .05); transform: translateY(-4px) rotate(0deg) scale(1.018); }
    .route-node:nth-of-type(1) { --card-tilt: -1.6deg; left: 4%; top: 18%; }
    .route-node:nth-of-type(2) { --card-tilt: 1.7deg; right: 4%; top: 17%; }
    .route-node:nth-of-type(3) { --card-tilt: 1deg; left: 2.5%; top: 43%; }
    .route-node:nth-of-type(4) { --card-tilt: -1.2deg; right: 2.5%; top: 42%; }
    .route-node:nth-of-type(5) { --card-tilt: -1deg; left: 7%; bottom: 11%; }
    .route-node:nth-of-type(6) { --card-tilt: 1.5deg; right: 7%; bottom: 11%; }

    @media (max-width: 1220px) {
      .hero-shell { grid-template-columns: minmax(410px, .8fr) minmax(530px, 1.2fr); gap: 38px; }
      .hero-title { font-size: clamp(72px, 6.8vw, 94px); }
      .hero-manifest span { letter-spacing: .07em; }
      .route-node { width: 30%; }
    }

    @media (max-width: 1020px) {
      .hero-shell { min-height: auto; padding: 136px 0 96px; grid-template-columns: 1fr; gap: 70px; }
      .hero-copy { max-width: 850px; }
      .hero-title { max-width: 780px; font-size: clamp(78px, 10vw, 110px); }
      .hero-lead,
      .hero-promise,
      .hero-manifest { max-width: 760px; }
      .router { width: min(100%, 780px); justify-self: center; transform: none; }
    }

    @media (max-width: 700px) {
      .services-hero::after { display: none; }
      .hero-shell { padding: 108px 0 72px; gap: 48px; }
      .breadcrumbs { margin-bottom: 34px; }
      .hero-kicker { margin-bottom: 20px; font-size: 7px; line-height: 1.45; }
      .hero-title { font-size: clamp(58px, 17vw, 80px); line-height: .78; }
      .hero-title-secondary { margin-left: .18em; }
      .hero-title-accent { margin-left: 0; }
      .hero-title-accent::after { right: -.26em; }
      .hero-title-note { margin-top: 19px; margin-left: 1px; font-size: 7px; letter-spacing: .11em; }
      .hero-lead { margin-top: 24px; font-size: 14px; line-height: 1.65; }
      .hero-promise { margin-top: 20px; gap: 6px; }
      .hero-promise span { min-height: 30px; padding-inline: 22px 11px; font-size: 7px; }
      .hero-promise span::before { left: 9px; }
      .hero-actions { margin-top: 24px; }
      .hero-manifest { margin-top: 30px; padding: 7px; gap: 5px; border-radius: 18px; }
      .hero-manifest div { min-height: 70px; padding: 8px; grid-template-columns: 1fr; align-content: center; gap: 3px; border-radius: 12px; }
      .hero-manifest div:first-child { padding-left: 8px; }
      .hero-manifest strong { font-size: 21px; }
      .hero-manifest span { font-size: 6px; line-height: 1.45; }
      .router { min-height: 640px; aspect-ratio: auto; border-radius: 30px 7px 30px 30px; }
      .router::before { inset: 9px; border-radius: 23px 3px 23px 23px; }
      .router::after { display: none; }
      .router-toolbar { height: 58px; padding-inline: 13px; }
      .router-toolbar span { max-width: 205px; }
      .router-toolbar::after { content: "S — XL"; padding: 6px 8px 6px 20px; }
      .router-coordinates { left: 15px; right: 15px; bottom: 13px; display: flex; font-size: 5px; letter-spacing: .06em; }
      .router-halo { top: 58%; width: 255px; }
      .router-core { top: 58%; width: 154px; }
      .core-content { padding-inline: 12px; }
      .core-content small { font-size: 5px; }
      .core-content strong { font-size: 25px; }
      .core-active { max-width: 112px; min-height: 26px; font-size: 7px; }
      .core-content em { font-size: 4px; }
      .route-node { width: calc(50% - 24px); min-height: 78px; padding: 10px; }
      .route-node::before { width: 27px; height: 27px; font-size: 9px; }
      .route-node span { font-size: 9px; }
      .route-node:nth-of-type(1) { left: 10px; top: 76px; }
      .route-node:nth-of-type(2) { right: 10px; top: 76px; }
      .route-node:nth-of-type(3) { left: 10px; top: 174px; }
      .route-node:nth-of-type(4) { right: 10px; top: 174px; }
      .route-node:nth-of-type(5) { left: 10px; bottom: 50px; }
      .route-node:nth-of-type(6) { right: 10px; bottom: 50px; }
    }

    @media (max-width: 450px) {
      .hero-title { font-size: clamp(56px, 16.2vw, 68px); }
      .hero-title-note i { width: 20px; height: 20px; }
      .hero-manifest span { font-size: 5.5px; letter-spacing: .055em; }
      .router { min-height: 610px; }
      .router-toolbar span { max-width: 175px; font-size: 6px; }
      .router-coordinates { font-size: 4.5px; }
      .router-halo { width: 235px; }
      .router-core { width: 146px; }
      .route-node { width: calc(50% - 21px); min-height: 75px; gap: 7px; }
      .route-node::before { width: 24px; height: 24px; font-size: 8px; }
      .route-node span { font-size: 8px; }
    }

    /* Editorial product collage: three scales, no command-centre metaphor. */
    .product-collage { position: relative; width: min(100%, 720px); aspect-ratio: 1; justify-self: end; isolation: isolate; }
    .product-collage::before { content: ""; position: absolute; inset: 8% 3% 6% 8%; z-index: -2; border-radius: 43% 57% 42% 58% / 54% 38% 62% 46%; background: radial-gradient(circle at 30% 23%, rgba(114, 218, 240, .23), transparent 28%), radial-gradient(circle at 70% 70%, rgba(154, 125, 221, .19), transparent 36%), rgba(9, 31, 47, .48); box-shadow: inset 0 0 90px rgba(99, 197, 227, .06), 0 60px 120px rgba(0, 0, 0, .2); transform: rotate(-7deg); }
    .product-collage::after { content: ""; position: absolute; inset: 0; z-index: -3; opacity: .44; background-image: radial-gradient(circle, rgba(143, 218, 240, .22) 0 1px, transparent 1.2px); background-size: 23px 23px; -webkit-mask-image: radial-gradient(circle at 50% 48%, #000, transparent 72%); mask-image: radial-gradient(circle at 50% 48%, #000, transparent 72%); }
    .collage-backtype { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
    .collage-backtype span { position: absolute; color: transparent; -webkit-text-stroke: 1px rgba(161, 225, 243, .13); font-size: clamp(110px, 11vw, 175px); font-weight: 650; line-height: .8; letter-spacing: -.09em; }
    .collage-backtype span:first-child { left: -2%; top: 30%; transform: rotate(-9deg); }
    .collage-backtype span:last-child { right: -1%; bottom: 17%; transform: rotate(7deg); }

    .scale-card { --tilt: 0deg; --hover-tilt: 0deg; position: absolute; z-index: 2; overflow: hidden; border: 1px solid rgba(255, 255, 255, .42); display: block; color: #153541; text-decoration: none; box-shadow: 0 30px 65px rgba(0, 0, 0, .27), inset 0 1px rgba(255, 255, 255, .65); transform: rotate(var(--tilt)); transform-origin: 50% 70%; transition: transform .42s cubic-bezier(.2, .72, .2, 1), box-shadow .42s ease; }
    .scale-card:hover,
    .scale-card:focus-visible { z-index: 8; outline: none; box-shadow: 0 42px 90px rgba(0, 0, 0, .35), inset 0 1px rgba(255, 255, 255, .72); transform: translateY(-9px) rotate(var(--hover-tilt)); }
    .scale-card:focus-visible { outline: 2px solid #e8fbff; outline-offset: 5px; }
    .scale-card--s { --tilt: -4.5deg; --hover-tilt: -2deg; left: 1%; top: 3%; width: 43%; height: 35%; z-index: 5; border-radius: 19px 56px 19px 19px; background: linear-gradient(145deg, #f0fcfa, #bfe6e9 76%); }
    .scale-card--m { --tilt: 3.3deg; --hover-tilt: 1.2deg; right: 0; top: 22%; width: 56%; height: 43%; z-index: 4; border-radius: 58px 18px 58px 18px; color: #241b42; background: linear-gradient(145deg, #eeeaff, #c6bfea 72%); }
    .scale-card--xl { --tilt: -2.2deg; --hover-tilt: -.7deg; left: 10%; bottom: 2%; width: 68%; height: 43%; z-index: 3; border-color: rgba(145, 217, 239, .24); border-radius: 14px 68px 14px 46px; color: #e9f8fc; background: linear-gradient(145deg, #123c50, #071826 75%); box-shadow: 0 38px 85px rgba(0, 0, 0, .4), inset 0 1px rgba(255, 255, 255, .08); }
    .scale-card-head { position: absolute; left: 17px; right: 17px; top: 13px; display: flex; align-items: center; gap: 10px; }
    .scale-card-head strong { font-size: clamp(30px, 3.4vw, 50px); font-weight: 520; line-height: .8; letter-spacing: -.08em; }
    .scale-card-head span { font-size: 7px; font-weight: 650; letter-spacing: .1em; line-height: 1.28; text-transform: uppercase; }
    .scale-card-head i { margin-left: auto; opacity: .44; font: 7px/1 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .12em; font-style: normal; }
    .scale-card .scale-card-footer { position: absolute; left: 17px; right: 17px; bottom: 13px; display: flex; flex-wrap: wrap; gap: 5px; }
    .scale-card .scale-card-footer span { padding: 4px 7px; border: 1px solid currentColor; border-radius: 999px; opacity: .55; font-size: 5px; letter-spacing: .08em; line-height: 1; text-transform: uppercase; }
    .scale-preview { position: absolute; left: 17px; right: 17px; top: 66px; bottom: 39px; overflow: hidden; }

    .scale-preview--site { border: 1px solid rgba(25, 87, 101, .17); border-radius: 9px 24px 9px 9px; background: rgba(255, 255, 255, .68); box-shadow: 0 12px 25px rgba(24, 82, 94, .11); }
    .preview-browser { height: 23px; padding: 0 8px; border-bottom: 1px solid rgba(26, 85, 98, .1); display: flex; align-items: center; gap: 4px; }
    .preview-browser span { width: 4px; height: 4px; border-radius: 50%; background: #6db3bd; }
    .preview-browser span:nth-child(2) { background: #e0a883; }
    .preview-browser span:nth-child(3) { background: #9287c9; }
    .preview-browser em { margin-left: auto; color: rgba(30, 76, 87, .45); font-size: 5px; letter-spacing: .06em; font-style: normal; }
    .preview-site-copy { position: absolute; inset: 23px 0 0; padding: 12px 13px; background: radial-gradient(circle at 83% 15%, rgba(115, 197, 209, .26), transparent 28%), linear-gradient(145deg, #f9ffff, #e9f5f3); }
    .preview-site-copy small { display: block; color: #358797; font-size: 5px; letter-spacing: .13em; text-transform: uppercase; }
    .preview-site-copy b { margin-top: 7px; display: block; color: #143945; font-size: clamp(13px, 1.45vw, 21px); font-weight: 560; line-height: .92; letter-spacing: -.055em; }
    .preview-site-copy i { position: absolute; right: 11px; bottom: 10px; width: 37px; aspect-ratio: 1; border-radius: 50% 50% 12px 50%; background: linear-gradient(145deg, #78ced7, #7676bf); box-shadow: -10px -8px 0 rgba(232, 174, 130, .62); }

    .scale-preview--app { border: 1px solid rgba(64, 42, 117, .2); border-radius: 28px 8px 28px 8px; display: grid; grid-template-columns: 24% 1fr; background: #221c46; box-shadow: 0 14px 30px rgba(42, 27, 93, .23); }
    .preview-app-nav { padding: 10px 7px; display: flex; align-items: center; flex-direction: column; gap: 9px; background: rgba(12, 11, 35, .64); }
    .preview-app-nav b { width: 18px; height: 18px; border-radius: 6px; display: grid; place-items: center; color: #efeaff; background: #7469ce; font-size: 8px; }
    .preview-app-nav i { width: 55%; height: 3px; border-radius: 999px; background: rgba(209, 199, 255, .24); }
    .preview-app-main { padding: 11px; }
    .preview-app-title { width: 42%; height: 6px; border-radius: 999px; display: block; background: rgba(231, 224, 255, .52); }
    .preview-app-chart { height: 50%; margin-top: 10px; padding: 7px 8px 0; border-radius: 8px; display: flex; align-items: end; gap: 5px; background: rgba(255, 255, 255, .06); }
    .preview-app-chart i { width: 20%; border-radius: 3px 3px 0 0; background: linear-gradient(#c5a8ff, #7469ce); }
    .preview-app-chart i:nth-child(1) { height: 34%; }
    .preview-app-chart i:nth-child(2) { height: 58%; }
    .preview-app-chart i:nth-child(3) { height: 45%; }
    .preview-app-chart i:nth-child(4) { height: 78%; }
    .preview-app-chart i:nth-child(5) { height: 66%; }
    .preview-app-cards { margin-top: 7px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px; }
    .preview-app-cards i { height: 19px; border-radius: 5px; background: rgba(221, 211, 255, .11); }
    .preview-app-cards i:nth-child(2) { background: rgba(230, 172, 200, .14); }

    .scale-preview--system { border: 1px solid rgba(128, 212, 238, .2); border-radius: 7px 34px 7px 22px; background: #05131e; box-shadow: inset 0 0 35px rgba(77, 182, 217, .06); }
    .preview-system-top { height: 25px; padding: 0 9px; border-bottom: 1px solid rgba(111, 205, 235, .12); display: flex; align-items: center; gap: 6px; color: rgba(176, 229, 242, .46); font-size: 5px; letter-spacing: .12em; }
    .preview-system-top i { width: 4px; height: 4px; border-radius: 50%; background: #63cde9; box-shadow: 0 0 7px rgba(99, 205, 233, .7); }
    .preview-system-top b { margin-left: auto; color: #8fdcf0; font-size: 5px; font-weight: 500; }
    .preview-system-grid { height: calc(100% - 25px); padding: 9px; display: grid; grid-template-columns: .72fr 1.15fr .62fr; gap: 7px; }
    .preview-system-grid > div { min-width: 0; padding: 7px; border: 1px solid rgba(108, 200, 229, .09); border-radius: 5px; background: rgba(14, 47, 63, .45); }
    .preview-system-grid small { display: block; color: #b8eef9; font-size: 17px; line-height: 1; }
    .preview-system-grid div:first-child i { width: 78%; height: 3px; margin-top: 7px; border-radius: 999px; display: block; background: rgba(122, 211, 235, .2); }
    .preview-system-grid div:first-child i:nth-of-type(2) { width: 56%; }
    .preview-system-grid div:first-child i:nth-of-type(3) { width: 68%; }
    .preview-system-grid div:nth-child(2) { display: flex; align-items: end; gap: 4px; }
    .preview-system-grid div:nth-child(2) span { width: 25%; border-radius: 3px 3px 0 0; background: linear-gradient(#64cae6, #285d8f); }
    .preview-system-grid div:nth-child(2) span:nth-child(1) { height: 40%; }
    .preview-system-grid div:nth-child(2) span:nth-child(2) { height: 72%; }
    .preview-system-grid div:nth-child(2) span:nth-child(3) { height: 56%; }
    .preview-system-grid div:nth-child(2) span:nth-child(4) { height: 84%; }
    .preview-system-grid div:last-child { display: grid; gap: 5px; align-content: center; }
    .preview-system-grid div:last-child b { height: 13px; border-radius: 4px; background: rgba(122, 210, 235, .12); }
    .preview-system-grid div:last-child b:nth-child(2) { background: rgba(151, 132, 220, .16); }

    .collage-note { position: absolute; right: 1%; bottom: 5%; z-index: 7; width: 32%; padding: 17px 18px 19px; border-radius: 24px 5px 24px 24px; color: #3b261d; background: #edb486; box-shadow: 0 24px 55px rgba(0, 0, 0, .28), inset 0 1px rgba(255, 255, 255, .48); transform: rotate(4deg); }
    .collage-note small { display: block; opacity: .5; font-size: 6px; letter-spacing: .15em; text-transform: uppercase; }
    .collage-note strong { margin-top: 7px; display: block; font-size: clamp(14px, 1.3vw, 20px); font-weight: 570; line-height: 1.02; letter-spacing: -.045em; }
    .collage-path { position: absolute; left: 3%; top: 49%; z-index: 1; display: flex; align-items: center; gap: 8px; color: rgba(178, 226, 240, .42); font-size: 6px; letter-spacing: .16em; text-transform: uppercase; transform: rotate(-7deg); }
    .collage-path i { width: 88px; height: 1px; position: relative; background: linear-gradient(90deg, currentColor, transparent); }
    .collage-path i::after { content: ""; position: absolute; right: 0; top: -3px; width: 6px; height: 6px; border-top: 1px solid currentColor; border-right: 1px solid currentColor; transform: rotate(45deg); }

    @media (max-width: 1020px) {
      .product-collage { width: min(100%, 760px); justify-self: center; }
    }

    @media (max-width: 700px) {
      .product-collage { width: 100%; min-height: 650px; aspect-ratio: auto; }
      .product-collage::before { inset: 7% 2% 4% 5%; }
      .collage-backtype span { font-size: 118px; }
      .scale-card--s { left: 0; top: 2%; width: 60%; height: 215px; }
      .scale-card--m { right: 0; top: 29%; width: 70%; height: 250px; }
      .scale-card--xl { left: 1%; bottom: 0; width: 83%; height: 250px; }
      .scale-card-head { left: 13px; right: 13px; top: 11px; }
      .scale-card-head strong { font-size: 33px; }
      .scale-card-head span { font-size: 6px; }
      .scale-card .scale-card-footer { left: 13px; right: 13px; bottom: 11px; }
      .scale-preview { left: 13px; right: 13px; top: 56px; bottom: 34px; }
      .preview-site-copy b { font-size: 15px; }
      .collage-note { right: 0; bottom: 2%; width: 40%; padding: 14px 13px 16px; }
      .collage-note strong { font-size: 14px; }
      .collage-path { display: none; }
    }

    @media (max-width: 450px) {
      .product-collage { min-height: 620px; }
      .scale-card--s { width: 64%; height: 205px; }
      .scale-card--m { top: 28%; width: 74%; height: 238px; }
      .scale-card--xl { width: 86%; height: 238px; }
      .scale-card-head strong { font-size: 29px; }
      .scale-card .scale-card-footer span { font-size: 4.5px; }
      .collage-note { width: 42%; }
      .preview-system-grid { grid-template-columns: .7fr 1fr; }
      .preview-system-grid > div:last-child { display: none; }
    }

    /* Six genuinely different capability art directions. */
    .service-explorer[data-active-service="1"] { --active-accent: #55c9ff; --active-rgb: 85, 201, 255; }
    .service-explorer[data-active-service="2"] { --active-accent: #b87cff; --active-rgb: 184, 124, 255; }
    .service-explorer[data-active-service="3"] { --active-accent: #45dfc7; --active-rgb: 69, 223, 199; }
    .service-explorer[data-active-service="4"] { --active-accent: #f2a64f; --active-rgb: 242, 166, 79; }
    .service-explorer[data-active-service="5"] { --active-accent: #9d86ff; --active-rgb: 157, 134, 255; }
    .service-explorer[data-active-service="6"] { --active-accent: #76d992; --active-rgb: 118, 217, 146; }
    .service-explorer { border-color: rgba(var(--active-rgb, 85, 201, 255), .27); border-radius: 28px; clip-path: none; background: radial-gradient(circle at 96% 3%, rgba(var(--active-rgb, 85, 201, 255), .16), transparent 28%), linear-gradient(145deg, rgba(10, 35, 52, .7), rgba(2, 10, 19, .82)); box-shadow: 0 38px 95px rgba(0, 0, 0, .3), 0 0 70px rgba(var(--active-rgb, 85, 201, 255), .075); transition: border-color .48s ease, background .55s ease, box-shadow .55s ease; }
    .service-explorer::after { background: linear-gradient(transparent, var(--active-accent, #55c9ff), transparent); box-shadow: 0 0 17px rgba(var(--active-rgb, 85, 201, 255), .58); transition: background .48s ease, box-shadow .48s ease; }
    .service-explorer::before { content: "ВЫБЕРИТЕ НАПРАВЛЕНИЕ · 01—06"; }
    .service-tabs { border-color: rgba(135, 205, 230, .12); border-radius: 19px; background: rgba(2, 11, 21, .78); }
    .service-tab { border-radius: 13px; color: rgba(185, 212, 221, .64); }
    .service-tab:nth-child(1) { --tab-accent: #55c9ff; --tab-rgb: 85, 201, 255; }
    .service-tab:nth-child(2) { --tab-accent: #c17fff; --tab-rgb: 193, 127, 255; }
    .service-tab:nth-child(3) { --tab-accent: #45dfc7; --tab-rgb: 69, 223, 199; }
    .service-tab:nth-child(4) { --tab-accent: #f2a64f; --tab-rgb: 242, 166, 79; }
    .service-tab:nth-child(5) { --tab-accent: #9d86ff; --tab-rgb: 157, 134, 255; }
    .service-tab:nth-child(6) { --tab-accent: #76d992; --tab-rgb: 118, 217, 146; }
    .service-tab strong { color: var(--tab-accent); text-shadow: 0 0 14px rgba(var(--tab-rgb), .25); }
    .service-tab:hover,
    .service-tab:focus-visible { color: #eefbff; border-color: rgba(var(--tab-rgb), .18); background: rgba(var(--tab-rgb), .075); }
    .service-tab.is-active { color: #f5fcff; border-color: rgba(var(--tab-rgb), .43); background: linear-gradient(105deg, rgba(var(--tab-rgb), .25), rgba(7, 27, 41, .78) 72%); box-shadow: inset 4px 0 var(--tab-accent), 0 12px 30px rgba(var(--tab-rgb), .1); }

    .service-panel:nth-child(n) { --accent: #55c9ff; --accent-rgb: 85, 201, 255; --panel-title: #eefbff; --panel-copy: rgba(197, 224, 234, .72); --chip-color: rgba(219, 239, 246, .76); --chip-bg: rgba(11, 40, 57, .58); --image-overlay: linear-gradient(180deg, rgba(3, 13, 24, .03), rgba(3, 13, 24, .28)); min-height: 640px; clip-path: none; border-color: rgba(var(--accent-rgb), .33); border-radius: 4px 66px 4px 4px; color: var(--panel-title); background: radial-gradient(circle at 83% 23%, rgba(76, 177, 232, .31), transparent 29%), linear-gradient(142deg, #0a3049, #04131f 76%); box-shadow: 0 34px 88px rgba(0, 0, 0, .29), inset 0 1px rgba(255, 255, 255, .035); }
    .service-panel:nth-child(2) { --accent: #9c62ef; --accent-rgb: 156, 98, 239; --panel-title: #281944; --panel-copy: #665778; --chip-color: #493a61; --chip-bg: rgba(255, 255, 255, .57); --image-overlay: linear-gradient(135deg, rgba(126, 81, 214, .06), rgba(225, 127, 184, .15)); border-radius: 74px 8px 74px 8px; background: radial-gradient(circle at 15% 18%, rgba(229, 136, 197, .28), transparent 25%), radial-gradient(circle at 86% 80%, rgba(121, 91, 219, .25), transparent 32%), linear-gradient(145deg, #f5efff, #d8d0f3 74%); box-shadow: 0 36px 90px rgba(47, 30, 83, .28), inset 0 1px rgba(255, 255, 255, .82); }
    .service-panel:nth-child(3) { --accent: #47dec8; --accent-rgb: 71, 222, 200; --panel-title: #eafffb; --panel-copy: rgba(194, 231, 225, .73); --chip-color: rgba(216, 245, 239, .8); --chip-bg: rgba(9, 58, 58, .5); --image-overlay: linear-gradient(145deg, rgba(24, 184, 164, .05), rgba(1, 17, 24, .3)); border-radius: 58px 58px 8px 58px; background: radial-gradient(circle at 78% 21%, rgba(46, 211, 186, .29), transparent 28%), radial-gradient(circle at 13% 82%, rgba(36, 126, 151, .17), transparent 27%), linear-gradient(142deg, #073d3c, #041820 76%); }
    .service-panel:nth-child(4) { --accent: #f0a34d; --accent-rgb: 240, 163, 77; --panel-title: #fff5e8; --panel-copy: rgba(235, 211, 184, .72); --chip-color: rgba(250, 228, 201, .78); --chip-bg: rgba(75, 43, 19, .45); --image-overlay: linear-gradient(145deg, rgba(228, 138, 58, .04), rgba(14, 9, 5, .34)); border-radius: 0; clip-path: polygon(0 0, calc(100% - 42px) 0, 100% 42px, 100% 100%, 42px 100%, 0 calc(100% - 42px)); background: radial-gradient(circle at 82% 24%, rgba(239, 157, 63, .29), transparent 28%), linear-gradient(142deg, #3a2515, #111318 73%); box-shadow: 0 34px 88px rgba(25, 14, 5, .42), inset 0 1px rgba(255, 220, 177, .07); }
    .service-panel:nth-child(5) { --accent: #a08aff; --accent-rgb: 160, 138, 255; --panel-title: #f4f0ff; --panel-copy: rgba(213, 205, 238, .73); --chip-color: rgba(232, 226, 250, .78); --chip-bg: rgba(40, 29, 82, .49); --image-overlay: radial-gradient(circle at 50% 45%, rgba(168, 120, 255, .02), rgba(5, 7, 27, .3)); border-radius: 86px 8px 86px 8px; background: radial-gradient(circle at 78% 24%, rgba(157, 105, 255, .31), transparent 30%), radial-gradient(circle at 13% 82%, rgba(68, 90, 210, .18), transparent 26%), linear-gradient(142deg, #231b55, #070d24 74%); }
    .service-panel:nth-child(6) { --accent: #31986c; --accent-rgb: 49, 152, 108; --panel-title: #193a2d; --panel-copy: #557064; --chip-color: #355a49; --chip-bg: rgba(255, 255, 255, .58); --image-overlay: linear-gradient(145deg, rgba(83, 184, 119, .05), rgba(125, 91, 199, .12)); border-radius: 10px 78px 78px 78px; background: radial-gradient(circle at 83% 22%, rgba(87, 197, 128, .25), transparent 28%), radial-gradient(circle at 15% 82%, rgba(130, 99, 208, .14), transparent 26%), linear-gradient(145deg, #eff8ec, #d7eadf 74%); box-shadow: 0 36px 90px rgba(29, 73, 52, .24), inset 0 1px rgba(255, 255, 255, .9); }

    .service-panel::before { -webkit-text-stroke-color: rgba(var(--accent-rgb), .16); }
    .service-panel .panel-index { color: var(--accent); }
    .service-panel .panel-index::after { background: linear-gradient(90deg, rgba(var(--accent-rgb), .85), transparent); }
    .service-panel .panel-title { color: var(--panel-title); text-shadow: none; }
    .service-panel .panel-copy { color: var(--panel-copy); }
    .service-panel .panel-scope li { border-color: rgba(var(--accent-rgb), .22); color: var(--chip-color); background: var(--chip-bg); }
    .service-panel .panel-scope li::before { background: var(--accent); box-shadow: 0 0 9px rgba(var(--accent-rgb), .7); }
    .service-panel .service-visual { border-color: rgba(var(--accent-rgb), .34); background: rgba(3, 13, 24, .72); box-shadow: 0 24px 55px rgba(0, 0, 0, .22), inset 0 0 48px rgba(var(--accent-rgb), .06); }
    .service-panel .service-visual--art::after { background: var(--image-overlay); box-shadow: inset 0 0 55px rgba(var(--accent-rgb), .11); }
    .service-panel .service-art,
    .service-panel.is-active .service-visual--art:hover .service-art { opacity: .92; transform: none; }

    .service-panel:nth-child(1) .service-visual { border-radius: 4px 42px 4px 4px; }
    .service-panel:nth-child(2) .panel-title { font-family: Georgia, "Times New Roman", serif; font-weight: 400; font-style: italic; letter-spacing: -.055em; }
    .service-panel:nth-child(2) .service-visual { border-radius: 48% 10px 48% 10px; background: #26184b; transform: rotate(-1.6deg); }
    .service-panel:nth-child(3) .service-visual { border-radius: 44px 44px 8px 44px; clip-path: polygon(0 0, 100% 0, 100% 86%, 88% 86%, 88% 100%, 72% 86%, 0 86%); }
    .service-panel:nth-child(4) .panel-title { font-size: clamp(38px, 3.7vw, 59px); font-weight: 650; letter-spacing: -.045em; text-transform: uppercase; }
    .service-panel:nth-child(4) .service-visual { border-radius: 0; clip-path: polygon(0 0, 100% 0, 100% 82%, 82% 100%, 0 100%); background: #120d09; }
    .service-panel:nth-child(5) .panel-title { font-weight: 340; letter-spacing: -.075em; }
    .service-panel:nth-child(5) .service-visual { border-radius: 50% 50% 18px 18px; background: #0d0a2b; }
    .service-panel:nth-child(6) .panel-title { font-family: Georgia, "Times New Roman", serif; font-weight: 400; letter-spacing: -.055em; }
    .service-panel:nth-child(6) .service-visual { border-radius: 12px 72px 12px 72px; background: #15281f; transform: rotate(1.4deg); }

    .service-panel:nth-child(1)::after { right: 0; top: 0; width: 112px; height: 112px; border-top-color: rgba(var(--accent-rgb), .7); border-right-color: rgba(var(--accent-rgb), .7); background: none; clip-path: polygon(0 0, 100% 0, 100% 100%); }
    .service-panel:nth-child(2)::after { right: 5%; top: 7%; width: 112px; height: 112px; border: 1px solid rgba(var(--accent-rgb), .28); border-radius: 50%; clip-path: none; background: radial-gradient(circle at 38% 34%, rgba(255, 255, 255, .62) 0 5%, transparent 6%), rgba(var(--accent-rgb), .08); }
    .service-panel:nth-child(3)::after { right: 4%; top: auto; bottom: 5%; width: 108px; height: 42px; border: 0; clip-path: none; opacity: .45; background: radial-gradient(circle, var(--accent) 0 2px, transparent 3px); background-size: 18px 18px; }
    .service-panel:nth-child(4)::after { left: 0; right: auto; top: 0; width: 190px; height: 9px; border: 0; clip-path: none; background: repeating-linear-gradient(135deg, var(--accent) 0 15px, #1a120b 15px 29px); }
    .service-panel:nth-child(5)::after { right: 4%; top: 5%; width: 145px; height: 145px; border: 1px solid rgba(var(--accent-rgb), .3); border-radius: 50%; clip-path: none; background: radial-gradient(circle, transparent 0 53%, rgba(var(--accent-rgb), .08) 54% 56%, transparent 57%); }
    .service-panel:nth-child(6)::after { right: 5%; top: 7%; width: 72px; height: 72px; border: 1px solid rgba(var(--accent-rgb), .28); border-radius: 14px; clip-path: none; background: rgba(var(--accent-rgb), .08); transform: rotate(13deg); }

    @media (max-width: 700px) {
      .service-explorer { padding: 7px; border-radius: 20px; }
      .service-tabs { border-radius: 15px; }
      .service-tab { border-radius: 10px; }
      .service-panel:nth-child(n) { min-height: 0; padding: 30px 22px; grid-template-columns: 1fr; gap: 34px; clip-path: none; border-radius: 4px 38px 4px 4px; }
      .service-panel:nth-child(even) { grid-template-columns: 1fr; }
      .service-panel:nth-child(even) .service-visual { order: initial; }
      .service-panel:nth-child(2) { border-radius: 38px 7px 38px 7px; }
      .service-panel:nth-child(3) { border-radius: 34px 34px 7px 34px; }
      .service-panel:nth-child(4) { border-radius: 0; }
      .service-panel:nth-child(5) { border-radius: 44px 7px 44px 7px; }
      .service-panel:nth-child(6) { border-radius: 7px 40px 40px 40px; }
      .service-panel:nth-child(n) .service-visual { min-height: 310px; clip-path: none; transform: none; }
      .service-panel:nth-child(1) .service-visual { border-radius: 4px 30px 4px 4px; }
      .service-panel:nth-child(2) .service-visual { border-radius: 36px 7px 36px 7px; }
      .service-panel:nth-child(3) .service-visual { border-radius: 30px 30px 7px 30px; }
      .service-panel:nth-child(4) .service-visual { border-radius: 0; }
      .service-panel:nth-child(5) .service-visual { border-radius: 42% 42% 14px 14px; }
      .service-panel:nth-child(6) .service-visual { border-radius: 8px 36px 8px 36px; }
      .service-panel:nth-child(4) .panel-title { font-size: 38px; }
      .service-panel::before { font-size: 165px; }
      .service-panel::after { opacity: .55; }
    }

    /* Light capability gallery: horizontal swatches instead of a left menu. */
    .light-bridge { height: 165px; background: linear-gradient(180deg, #020812 0%, #153246 32%, #91b1bd 72%, #edf5f5 100%); }
    .light-bridge::before { color: rgba(222, 247, 251, .62); }
    .light-bridge path { stroke: rgba(190, 237, 247, .38); }
    .light-bridge .current { stroke: #f2fdff; }

    .competencies-section { color: #183743; background: radial-gradient(circle at 88% 12%, rgba(119, 169, 219, .14), transparent 27%), radial-gradient(circle at 10% 78%, rgba(110, 190, 166, .1), transparent 25%), linear-gradient(180deg, #edf5f5, #f8fbfa 58%, #eef4f3); }
    .competencies-section::before { opacity: .7; background-image: linear-gradient(rgba(42, 105, 130, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(42, 105, 130, .045) 1px, transparent 1px); -webkit-mask-image: radial-gradient(circle at 50% 43%, #000, transparent 82%); mask-image: radial-gradient(circle at 50% 43%, #000, transparent 82%); }
    .competencies-section::after { content: "CAPABILITY GALLERY"; right: -1vw; top: 8%; color: transparent; -webkit-text-stroke: 1px rgba(38, 103, 126, .06); }
    .competencies-section .section-kicker { color: #287e9e; }
    .competencies-section .section-title { color: #173a49; }
    .competencies-section .section-title span { color: #438da6; }
    .competencies-section .section-intro { color: #647d87; }

    .service-explorer { margin-top: 68px; padding: 0; border: 0; border-radius: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; background: transparent; box-shadow: none; transition: none; }
    .service-explorer::before { content: "ПАЛИТРА КОМПЕТЕНЦИЙ · ВЫБЕРИТЕ НАПРАВЛЕНИЕ"; left: 2px; top: -24px; color: rgba(40, 94, 112, .5); }
    .service-explorer::after { display: none; }
    .service-tabs { padding: 0; border: 0; border-radius: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; background: transparent; box-shadow: none; }
    .service-tab { --tab-bg: rgba(255, 255, 255, .78); position: relative; min-height: 124px; padding: 16px 15px; border: 1px solid rgba(var(--tab-rgb), .2); border-radius: 18px; display: flex; align-items: flex-start; justify-content: space-between; flex-direction: column; gap: 12px; color: #38545f; background: var(--tab-bg); box-shadow: 0 15px 36px rgba(42, 78, 91, .07), inset 0 1px rgba(255, 255, 255, .86); transform: translateY(0); transition: color .3s ease, border-color .3s ease, background .3s ease, box-shadow .35s ease, transform .35s ease; }
    .service-tab:nth-child(1) { --tab-accent: #258fc2; --tab-rgb: 37, 143, 194; --tab-bg: #e5f4fb; }
    .service-tab:nth-child(2) { --tab-accent: #8054bd; --tab-rgb: 128, 84, 189; --tab-bg: #f0e9fb; }
    .service-tab:nth-child(3) { --tab-accent: #188c78; --tab-rgb: 24, 140, 120; --tab-bg: #e2f5ef; }
    .service-tab:nth-child(4) { --tab-accent: #b56a21; --tab-rgb: 181, 106, 33; --tab-bg: #fff0db; }
    .service-tab:nth-child(5) { --tab-accent: #6d61c7; --tab-rgb: 109, 97, 199; --tab-bg: #eceaff; }
    .service-tab:nth-child(6) { --tab-accent: #4f895b; --tab-rgb: 79, 137, 91; --tab-bg: #e9f3e5; }
    .service-tab strong { color: var(--tab-accent); font-family: inherit; font-size: 28px; font-weight: 520; line-height: 1; text-shadow: none; }
    .service-tab span { max-width: 150px; color: #344f59; font-size: 11px; line-height: 1.35; }
    .service-tab::after { width: 7px; height: 7px; position: absolute; right: 15px; top: 16px; border: 0; border-radius: 50%; opacity: .38; background: var(--tab-accent); box-shadow: 0 0 0 5px rgba(var(--tab-rgb), .08); transform: none; }
    .service-tab:hover,
    .service-tab:focus-visible { color: #183743; border-color: rgba(var(--tab-rgb), .42); background: var(--tab-bg); box-shadow: 0 19px 44px rgba(var(--tab-rgb), .14); transform: translateY(-3px); }
    .service-tab.is-active { color: #173541; border-color: rgba(var(--tab-rgb), .58); background: var(--tab-bg); box-shadow: 0 23px 54px rgba(var(--tab-rgb), .18), inset 0 -4px var(--tab-accent); transform: translateY(-6px); }
    .service-tab.is-active::after { opacity: 1; box-shadow: 0 0 0 6px rgba(var(--tab-rgb), .12), 0 0 15px rgba(var(--tab-rgb), .35); transform: none; }
    .service-panes { margin-top: 4px; }

    .service-panel:nth-child(n) { --accent: #258fc2; --accent-rgb: 37, 143, 194; --panel-title: #163b4d; --panel-copy: #587582; --chip-color: #355a69; --chip-bg: rgba(255, 255, 255, .66); --image-overlay: linear-gradient(145deg, rgba(255, 255, 255, .05), rgba(77, 170, 214, .1)); min-height: 620px; border-color: rgba(var(--accent-rgb), .24); border-radius: 18px 72px 18px 18px; color: var(--panel-title); background: radial-gradient(circle at 84% 22%, rgba(92, 183, 224, .23), transparent 28%), linear-gradient(145deg, #f8fcff, #dceef7 76%); box-shadow: 0 30px 75px rgba(43, 91, 111, .13), inset 0 1px rgba(255, 255, 255, .9); }
    .service-panel:nth-child(2) { --accent: #8054bd; --accent-rgb: 128, 84, 189; --panel-title: #352451; --panel-copy: #70617e; --chip-color: #554567; --chip-bg: rgba(255, 255, 255, .62); --image-overlay: linear-gradient(145deg, rgba(255, 255, 255, .06), rgba(147, 99, 211, .11)); border-radius: 72px 18px 72px 18px; background: radial-gradient(circle at 16% 20%, rgba(219, 151, 206, .22), transparent 25%), radial-gradient(circle at 86% 80%, rgba(137, 105, 205, .17), transparent 31%), linear-gradient(145deg, #fbf9ff, #e7ddf7 76%); box-shadow: 0 31px 78px rgba(79, 55, 108, .14), inset 0 1px rgba(255, 255, 255, .92); }
    .service-panel:nth-child(3) { --accent: #188c78; --accent-rgb: 24, 140, 120; --panel-title: #173f3a; --panel-copy: #5b7972; --chip-color: #345f56; --chip-bg: rgba(255, 255, 255, .63); --image-overlay: linear-gradient(145deg, rgba(255, 255, 255, .05), rgba(45, 170, 146, .1)); border-radius: 54px 54px 16px 54px; background: radial-gradient(circle at 80% 20%, rgba(61, 190, 162, .2), transparent 28%), linear-gradient(145deg, #f7fffc, #d9f0e9 76%); box-shadow: 0 30px 75px rgba(42, 105, 91, .13), inset 0 1px rgba(255, 255, 255, .9); }
    .service-panel:nth-child(4) { --accent: #b56a21; --accent-rgb: 181, 106, 33; --panel-title: #55371e; --panel-copy: #806b58; --chip-color: #684b33; --chip-bg: rgba(255, 255, 255, .59); --image-overlay: linear-gradient(145deg, rgba(255, 255, 255, .04), rgba(222, 150, 72, .09)); border-radius: 0; clip-path: polygon(0 0, calc(100% - 42px) 0, 100% 42px, 100% 100%, 42px 100%, 0 calc(100% - 42px)); background: radial-gradient(circle at 82% 22%, rgba(226, 157, 84, .22), transparent 28%), linear-gradient(145deg, #fffaf3, #f2ddc3 76%); box-shadow: 0 30px 75px rgba(106, 71, 38, .14), inset 0 1px rgba(255, 255, 255, .86); }
    .service-panel:nth-child(5) { --accent: #6d61c7; --accent-rgb: 109, 97, 199; --panel-title: #342e69; --panel-copy: #696688; --chip-color: #4e4a75; --chip-bg: rgba(255, 255, 255, .61); --image-overlay: linear-gradient(145deg, rgba(255, 255, 255, .05), rgba(119, 102, 204, .1)); border-radius: 82px 16px 82px 16px; background: radial-gradient(circle at 80% 22%, rgba(142, 124, 220, .2), transparent 29%), linear-gradient(145deg, #faf9ff, #e2dff4 76%); box-shadow: 0 31px 78px rgba(68, 62, 118, .14), inset 0 1px rgba(255, 255, 255, .9); }
    .service-panel:nth-child(6) { --accent: #4f895b; --accent-rgb: 79, 137, 91; --panel-title: #294631; --panel-copy: #667b69; --chip-color: #49604d; --chip-bg: rgba(255, 255, 255, .62); --image-overlay: linear-gradient(145deg, rgba(255, 255, 255, .05), rgba(87, 153, 99, .09)); border-radius: 16px 78px 78px 78px; background: radial-gradient(circle at 82% 22%, rgba(109, 176, 119, .2), transparent 28%), linear-gradient(145deg, #fbfdf8, #dfeeda 76%); box-shadow: 0 30px 75px rgba(57, 96, 63, .13), inset 0 1px rgba(255, 255, 255, .9); }
    .service-panel .panel-title { color: var(--panel-title); }
    .service-panel .panel-copy { color: var(--panel-copy); }
    .service-panel .panel-scope li { border-color: rgba(var(--accent-rgb), .2); color: var(--chip-color); background: var(--chip-bg); box-shadow: inset 0 1px rgba(255, 255, 255, .72); }
    .service-panel .service-visual { border-color: rgba(var(--accent-rgb), .28); box-shadow: 0 22px 52px rgba(52, 75, 85, .17), inset 0 0 45px rgba(var(--accent-rgb), .04); }
    .service-panel .service-visual--art::after { background: var(--image-overlay); box-shadow: inset 0 0 48px rgba(255, 255, 255, .07); }
    .service-panel::before { -webkit-text-stroke-color: rgba(var(--accent-rgb), .12); }
    .service-panel:nth-child(4) .panel-title { color: var(--panel-title); }

    .phase-bridge--light-flow { height: 135px; background: linear-gradient(180deg, #eef4f3, #f8fbfa 54%, #eef5f7); }
    .phase-bridge--light-flow path { stroke: rgba(48, 126, 153, .22); }
    .phase-bridge--light-flow .phase-current { stroke: rgba(35, 133, 166, .7); filter: drop-shadow(0 0 5px rgba(59, 153, 184, .32)); }
    .phase-bridge--light-flow span { color: rgba(41, 101, 121, .5); }
    .phase-bridge--light-flow::before { background: linear-gradient(90deg, transparent, #63b9d2 20%, #8db9d5 50%, #67bca9 80%, transparent); box-shadow: 0 0 9px rgba(91, 161, 183, .2); }
    .phase-bridge--light-flow::after { background: linear-gradient(90deg, transparent, #ffffff, transparent); filter: blur(.5px) drop-shadow(0 0 6px rgba(70, 153, 180, .42)); }

    @media (max-width: 1100px) {
      .service-tabs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
      .service-tab { min-height: 106px; }
    }

    @media (max-width: 700px) {
      .light-bridge { height: 130px; }
      .competencies-section .section-shell { padding-top: 92px; }
      .service-explorer { margin-top: 58px; padding: 0; border-radius: 0; }
      .service-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
      .service-tab { min-height: 102px; padding: 13px; border-radius: 14px; }
      .service-tab strong { font-size: 24px; }
      .service-tab span { font-size: 9px; }
      .service-tab::after { right: 12px; top: 13px; }
      .service-tab.is-active { transform: translateY(-3px); }
      .service-panes { margin-top: 2px; }
      .service-panel:nth-child(n) { padding: 30px 22px; border-radius: 14px 38px 14px 14px; }
      .service-panel:nth-child(2) { border-radius: 38px 14px 38px 14px; }
      .service-panel:nth-child(3) { border-radius: 34px 34px 14px 34px; }
      .service-panel:nth-child(4) { border-radius: 0; }
      .service-panel:nth-child(5) { border-radius: 40px 14px 40px 14px; }
      .service-panel:nth-child(6) { border-radius: 14px 40px 40px 40px; }
      .phase-bridge--light-flow { height: 110px; }
    }

    /* Unified product-view frames: clean geometry replaces the assorted masks. */
    .service-panel:nth-child(n) .service-visual--art {
      min-height: 400px;
      border: 1px solid rgba(var(--accent-rgb), .24);
      border-radius: 26px;
      clip-path: none;
      transform: none;
      background:
        linear-gradient(115deg, rgba(255, 255, 255, .82), rgba(var(--accent-rgb), .1)),
        rgba(238, 246, 247, .78);
      box-shadow:
        0 24px 54px rgba(45, 72, 82, .14),
        inset 0 1px rgba(255, 255, 255, .92),
        inset 0 0 0 8px rgba(255, 255, 255, .28);
    }
    .service-panel:nth-child(n) .service-art,
    .service-panel:nth-child(n).is-active .service-visual--art:hover .service-art {
      inset: 9px;
      width: calc(100% - 18px);
      height: calc(100% - 18px);
      border-radius: 18px;
      opacity: .94;
      object-fit: cover;
      transform: none;
    }
    .service-panel:nth-child(n) .service-visual--art::after {
      inset: 9px;
      border-radius: 18px;
      background:
        linear-gradient(180deg, rgba(8, 21, 30, .02), rgba(8, 21, 30, .17)),
        linear-gradient(135deg, rgba(255, 255, 255, .08), rgba(var(--accent-rgb), .08));
      box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, .16),
        inset 0 -42px 70px rgba(4, 17, 25, .08);
    }
    .service-panel:nth-child(n) .service-visual--art::before {
      content: attr(data-frame);
      position: absolute;
      left: 23px;
      right: auto;
      top: 23px;
      z-index: 4;
      display: block;
      padding: 8px 12px 8px 27px;
      border: 1px solid rgba(var(--accent-rgb), .24);
      border-radius: 999px;
      color: #294a57;
      background:
        radial-gradient(circle at 13px 50%, var(--accent) 0 2px, transparent 3px),
        rgba(248, 252, 252, .84);
      box-shadow: 0 9px 22px rgba(16, 44, 56, .12), inset 0 1px rgba(255, 255, 255, .88);
      font: 600 8px/1.2 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
      letter-spacing: .13em;
      text-transform: uppercase;
      white-space: nowrap;
      -webkit-backdrop-filter: blur(8px);
      backdrop-filter: blur(8px);
    }

    @media (max-width: 700px) {
      .service-panel:nth-child(n) .service-visual--art {
        min-height: 300px;
        border-radius: 22px;
        box-shadow: 0 18px 38px rgba(45, 72, 82, .13), inset 0 1px rgba(255, 255, 255, .92), inset 0 0 0 6px rgba(255, 255, 255, .26);
      }
      .service-panel:nth-child(n) .service-art,
      .service-panel:nth-child(n).is-active .service-visual--art:hover .service-art {
        inset: 7px;
        width: calc(100% - 14px);
        height: calc(100% - 14px);
        border-radius: 15px;
      }
      .service-panel:nth-child(n) .service-visual--art::after {
        inset: 7px;
        border-radius: 15px;
      }
      .service-panel:nth-child(n) .service-visual--art::before {
        left: 18px;
        top: 18px;
        padding: 7px 10px 7px 24px;
        background:
          radial-gradient(circle at 11px 50%, var(--accent) 0 2px, transparent 3px),
          rgba(248, 252, 252, .86);
        font-size: 7px;
      }
    }

    /* One typographic system across all six competency panels. */
    .service-explorer,
    .service-explorer button,
    .service-panel:nth-child(n) .panel-index,
    .service-panel:nth-child(n) .panel-title,
    .service-panel:nth-child(n) .panel-copy,
    .service-panel:nth-child(n) .panel-scope {
      font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    }
    .service-panel:nth-child(n) .panel-title {
      color: var(--panel-title);
      font-size: clamp(42px, 4.1vw, 64px);
      font-weight: 450;
      font-style: normal;
      line-height: .94;
      letter-spacing: -.055em;
      text-transform: none;
    }
    .service-panel:nth-child(n) .panel-index {
      font-weight: 600;
      font-style: normal;
    }
    .service-panel:nth-child(n) .panel-copy,
    .service-panel:nth-child(n) .panel-scope li {
      font-weight: 400;
      font-style: normal;
      text-transform: none;
    }

    @media (max-width: 700px) {
      .service-panel:nth-child(n) .panel-title {
        font-size: clamp(36px, 10.5vw, 48px);
      }
    }

    .competencies-portfolio-cta {
      margin-top: clamp(46px, 6vw, 86px);
    }

    .portfolio-mega-link {
      position: relative;
      min-height: clamp(140px, 12vw, 188px);
      padding: clamp(28px, 3.4vw, 48px) clamp(28px, 4vw, 62px);
      overflow: hidden;
      isolation: isolate;
      border: 1px solid rgba(66, 154, 182, .32);
      border-radius: 28px;
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      grid-template-rows: auto auto;
      align-items: center;
      gap: 8px 32px;
      color: #f4fcff;
      background:
        radial-gradient(circle at 83% 24%, rgba(142, 225, 239, .26), transparent 25%),
        linear-gradient(112deg, #133847 0%, #17617d 58%, #255f6c 100%);
      box-shadow: 0 28px 72px rgba(38, 85, 101, .2), inset 0 1px rgba(255, 255, 255, .14);
      text-decoration: none;
      transform: translateY(0);
      transition: transform .42s cubic-bezier(.2, .72, .2, 1), border-color .35s ease, box-shadow .42s ease;
    }

    .portfolio-mega-link::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: -1;
      pointer-events: none;
      opacity: .3;
      background-image: linear-gradient(rgba(190, 239, 248, .1) 1px, transparent 1px), linear-gradient(90deg, rgba(190, 239, 248, .1) 1px, transparent 1px);
      background-size: 34px 34px;
      -webkit-mask-image: linear-gradient(90deg, transparent, #000 54%, #000);
      mask-image: linear-gradient(90deg, transparent, #000 54%, #000);
    }

    .portfolio-mega-link::after {
      content: "PORTFOLIO";
      position: absolute;
      right: -.02em;
      bottom: -.28em;
      z-index: -1;
      pointer-events: none;
      color: transparent;
      -webkit-text-stroke: 1px rgba(221, 248, 252, .1);
      font-size: clamp(86px, 12vw, 190px);
      font-weight: 650;
      line-height: .8;
      letter-spacing: -.08em;
      white-space: nowrap;
    }

    .portfolio-mega-link small,
    .portfolio-mega-link strong,
    .portfolio-mega-link i { position: relative; z-index: 1; }
    .portfolio-mega-link small { grid-column: 1; grid-row: 1; color: rgba(211, 239, 246, .62); font-size: 9px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; }
    .portfolio-mega-link strong { grid-column: 1; grid-row: 2; font-size: clamp(44px, 5.2vw, 82px); font-weight: 390; line-height: .9; letter-spacing: -.065em; }
    .portfolio-mega-link i { grid-column: 2; grid-row: 1 / span 2; width: clamp(68px, 7vw, 104px); aspect-ratio: 1; border: 1px solid rgba(218, 247, 252, .25); border-radius: 50%; display: grid; place-items: center; color: #173a48; background: #d9fa78; box-shadow: 0 16px 38px rgba(7, 40, 54, .22); font-size: clamp(27px, 3vw, 44px); font-style: normal; transition: color .35s ease, background .35s ease, transform .42s cubic-bezier(.2, .72, .2, 1); }
    .portfolio-mega-link:hover { border-color: rgba(91, 193, 220, .54); box-shadow: 0 36px 88px rgba(35, 91, 111, .28), inset 0 1px rgba(255, 255, 255, .17); transform: translateY(-5px); }
    .portfolio-mega-link:hover i { color: #f4fcff; background: #1b7b99; transform: rotate(45deg); }
    .portfolio-mega-link:focus-visible { outline: 3px solid rgba(46, 143, 177, .28); outline-offset: 5px; }

    @media (max-width: 700px) {
      .competencies-portfolio-cta { margin-top: 48px; }
      .portfolio-mega-link { min-height: 172px; padding: 25px 22px; border-radius: 20px; gap: 10px 14px; }
      .portfolio-mega-link small { max-width: 220px; font-size: 7px; line-height: 1.55; letter-spacing: .12em; }
      .portfolio-mega-link strong { font-size: clamp(38px, 11.5vw, 52px); }
      .portfolio-mega-link i { width: 60px; font-size: 27px; }
      .portfolio-mega-link::after { right: -.08em; bottom: -.2em; font-size: 25vw; }
    }

    @media (prefers-reduced-motion: reduce) {
      html { scroll-behavior: auto; }
      *, *::before, *::after { animation-duration: .01ms !important; animation-delay: 0ms !important; animation-iteration-count: 1 !important; }
      [data-reveal] { opacity: 1; transform: none; transition: none; }
      .router { transform: none !important; }
      .service-panel { transition: none; }
    }

/* Общий профиль производительности: отключаем непрерывные токи и тяжёлые переходы
   на слабых устройствах, сохраняя статичную графику страницы. */
html.motion-lite [data-reveal] {
  opacity: 1;
  transform: none;
  transition: none;
}

html.motion-lite .router-traces .current,
html.motion-lite .light-bridge .current,
html.motion-lite .phase-bridge .phase-current,
html.motion-lite .cta-circuit .current,
html.motion-lite .process-track::after,
html.motion-lite .phase-bridge::after {
  display: none !important;
  animation: none !important;
  filter: none !important;
}

html.motion-lite .router,
html.motion-lite .router::after,
html.motion-lite .router-halo,
html.motion-lite .router-core::after {
  animation: none !important;
  will-change: auto !important;
}

html.motion-lite .router {
  transform: none !important;
}

html.motion-lite .service-panel {
  transition: none !important;
}

/* Keep breadcrumbs below the fixed header even when the shared layout CSS is not loaded. */
.services-hero .breadcrumbs {
  position: relative;
  z-index: 6;
  transform: translateY(clamp(30px, 4vh, 42px));
}

@media (max-width: 700px) {
  .services-hero .breadcrumbs { transform: translateY(22px); }
}