/* Start:/assets/vendor/slick/slick.css?17824366531776*/
/* Slider */
.slick-slider
{
    position: relative;

    display: block;
    box-sizing: border-box;

    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;

    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
        touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list
{
    position: relative;

    display: block;
    overflow: hidden;

    margin: 0;
    padding: 0;
}
.slick-list:focus
{
    outline: none;
}
.slick-list.dragging
{
    cursor: pointer;
    cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list
{
    -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
         -o-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
}

.slick-track
{
    position: relative;
    top: 0;
    left: 0;

    display: block;
    margin-left: auto;
    margin-right: auto;
}
.slick-track:before,
.slick-track:after
{
    display: table;

    content: '';
}
.slick-track:after
{
    clear: both;
}
.slick-loading .slick-track
{
    visibility: hidden;
}

.slick-slide
{
    display: none;
    float: left;

    height: 100%;
    min-height: 1px;
}
[dir='rtl'] .slick-slide
{
    float: right;
}
.slick-slide img
{
    display: block;
}
.slick-slide.slick-loading img
{
    display: none;
}
.slick-slide.dragging img
{
    pointer-events: none;
}
.slick-initialized .slick-slide
{
    display: block;
}
.slick-loading .slick-slide
{
    visibility: hidden;
}
.slick-vertical .slick-slide
{
    display: block;

    height: auto;

    border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
    display: none;
}

/* End */


/* Start:/assets/ui-global.css?1783910671133065*/
/* Crysteam global tokens, primitives, and reusable blocks. */
@import url("https://fonts.googleapis.com/css2?family=Onest:wght@300;400;500;600;700&display=swap");

:root {
      color-scheme: dark;
      --bg: #030506;
      --bg-soft: #070b0d;
      --surface: rgba(9, 14, 15, 0.48);
      --surface-strong: rgba(18, 24, 24, 0.68);
      --surface-soft: rgba(255, 255, 255, 0.055);
      --line: rgba(230, 238, 236, 0.2);
      --line-strong: rgba(238, 245, 242, 0.38);
      --glass-edge: rgba(238, 245, 242, 0.34);
      --glass-fog: rgba(236, 245, 241, 0.09);
      --lime: #b6ff17;
      --lime-2: #8fe812;
      --lime-soft: rgba(182, 255, 23, 0.14);
      --text: #f6f8f3;
      --muted: #a7ada8;
      --dim: #747d78;
      --violet: #9d84ff;
      --warning: #ffd86b;
      --danger: #ff6b7c;
      --icon-size: 20px;
      --icon-box-size: 56px;
      --icon-box-glyph-size: 24px;
      --control-icon-size: 56px;
      --control-height: 54px;
      --radius-sm: 14px;
      --radius-md: 22px;
      --radius-lg: 32px;
      --panel-bg:
        linear-gradient(145deg, rgba(255, 255, 255, 0.062), rgba(255, 255, 255, 0.016) 54%, rgba(182, 255, 23, 0.024)),
        rgba(9, 14, 15, 0.42);
      --panel-line: rgba(238, 245, 242, 0.23);
      --panel-shadow:
        inset 0 1px 1px rgba(255, 255, 255, 0.18),
        inset 0 -1px 0 rgba(182, 255, 23, 0.05),
        0 20px 58px rgba(0, 0, 0, 0.32);
      --panel-blur: blur(18px) saturate(136%);
      --shadow-lime: 0 0 34px rgba(182, 255, 23, 0.28);
      --shadow-panel: 0 26px 90px rgba(0, 0, 0, 0.48);
      --section-gap: clamp(96px, 10vw, 160px);
      --page-bg-image: url("/assets/glass-bg.webp");
      --font: "Onest", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
      --fs-display: 76px;
      --fs-h1: 58px;
      --fs-h2: 44px;
      --fs-h3: 28px;
      --fs-h4: 21px;
      --fs-body-lg: 18px;
      --fs-body: 16px;
      --fs-body-sm: 14px;
      --fs-caption: 12px;
      --lh-tight: 1.04;
      --lh-heading: 1.12;
      --lh-body: 1.58;
    }

@media (max-width: 760px) {
      :root {
            --section-gap: clamp(56px, 16vw, 76px);
          }
    }

@property --btn-hover-glow {
      syntax: "<number>";
      inherits: true;
      initial-value: 0;
    }

@property --cursor-glow {
      syntax: "<number>";
      inherits: true;
      initial-value: 0;
    }

@property --btn-fill {
      syntax: "<number>";
      inherits: true;
      initial-value: 0;
    }

@property --btn-crystal-reveal {
      syntax: "<number>";
      inherits: true;
      initial-value: 0;
    }

@property --btn-light-x {
      syntax: "<percentage>";
      inherits: true;
      initial-value: 50%;
    }

@property --btn-light-y {
      syntax: "<percentage>";
      inherits: true;
      initial-value: 50%;
    }

* {
      box-sizing: border-box;
    }

body {
      margin: 0;
      min-width: 320px;
      background:
        linear-gradient(180deg, rgba(3, 5, 6, 0.22), rgba(2, 3, 3, 0.72)),
        radial-gradient(circle at 12% 16%, rgba(112, 176, 36, 0.18), transparent 28rem),
        radial-gradient(circle at 90% 2%, rgba(157, 132, 255, 0.16), transparent 22rem),
        var(--page-bg-image) center center / cover fixed,
        linear-gradient(180deg, #050707 0%, #020303 100%);
      color: var(--text);
      font-family: var(--font);
      font-size: var(--fs-body);
      line-height: var(--lh-body);
      letter-spacing: 0;
    }

::selection {
      background: rgba(182, 255, 23, 0.82);
      color: #071008;
      text-shadow: none;
    }

::-moz-selection {
      background: rgba(182, 255, 23, 0.82);
      color: #071008;
      text-shadow: none;
    }

a {
      color: inherit;
      text-decoration: none;
    }

button,
    input,
    textarea {
      font: inherit;
    }

button {
      cursor: pointer;
    }

:where(a, button, input, textarea, select, summary, [tabindex]):focus {
      outline: none;
    }

:where(a, button, input, textarea, select, summary, [tabindex]):focus-visible {
      outline: 2px solid rgba(182, 255, 23, 0.62);
      outline-offset: 3px;
    }

svg {
      display: block;
    }

.svg-sprite {
      position: absolute;
      width: 0;
      height: 0;
      overflow: hidden;
    }

.glass {
      --cursor-x: 50%;
      --cursor-y: 50%;
      --cursor-glow: 0;
      --edge-top: 0;
      --edge-left: 0;
      --edge-right: 0;
      --edge-bottom: 0;
      position: relative;
      overflow: hidden;
      isolation: isolate;
      border: 1px solid var(--glass-edge);
      background: var(--surface);
      background-clip: padding-box;
      box-shadow:
        inset 0 1px 1px rgba(255, 255, 255, 0.42),
        inset 0 -1px 0 rgba(182, 255, 23, 0.055),
        inset 0 0 18px rgba(236, 245, 241, 0.018),
        0 0 22px rgba(255, 255, 255, calc((var(--edge-top) + var(--edge-left)) * 0.024)),
        0 0 34px rgba(157, 132, 255, calc(var(--edge-bottom) * 0.066)),
        0 0 42px rgba(182, 255, 23, calc(var(--edge-right) * 0.058)),
        var(--shadow-panel);
      backdrop-filter: blur(24px) saturate(145%) brightness(1.08);
      -webkit-backdrop-filter: blur(24px) saturate(145%) brightness(1.08);
    }

.glass::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      pointer-events: none;
      background:
        radial-gradient(circle 360px at var(--cursor-x) var(--cursor-y), rgba(255, 255, 255, calc(var(--cursor-glow) * 0.5)), rgba(232, 255, 182, calc(var(--cursor-glow) * 0.24)) 16%, rgba(188, 146, 255, calc(var(--cursor-glow) * 0.16)) 44%, transparent 72%),
        radial-gradient(circle 460px at var(--cursor-x) var(--cursor-y), rgba(255, 255, 255, calc((var(--edge-top) + var(--edge-left)) * 0.42)), rgba(238, 246, 255, calc((var(--edge-top) + var(--edge-left)) * 0.18)) 24%, transparent 74%),
        radial-gradient(circle 500px at var(--cursor-x) var(--cursor-y), rgba(226, 255, 168, calc(var(--edge-right) * 0.66)), rgba(182, 255, 23, calc(var(--edge-right) * 0.36)) 22%, transparent 76%),
        radial-gradient(620px 360px at var(--cursor-x) var(--cursor-y), rgba(218, 188, 255, calc(var(--edge-bottom) * 0.62)), rgba(157, 132, 255, calc(var(--edge-bottom) * 0.36)) 24%, transparent 78%),
        radial-gradient(42% 220% at 0% 0%, rgba(255, 255, 255, calc(0.72 + (var(--edge-top) + var(--edge-left)) * 0.08)), rgba(238, 246, 255, calc(0.34 + (var(--edge-top) + var(--edge-left)) * 0.06)) 24%, transparent 68%),
        linear-gradient(to top, rgba(203, 170, 255, calc(0.46 + var(--edge-bottom) * 0.12)), rgba(157, 132, 255, calc(0.26 + var(--edge-bottom) * 0.08)) 10%, transparent 34%),
        linear-gradient(to left, rgba(220, 255, 154, calc(0.42 + var(--edge-right) * 0.14)), rgba(182, 255, 23, calc(0.24 + var(--edge-right) * 0.08)) 12%, transparent 36%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.34), rgba(255, 255, 255, 0.1) 28%, rgba(157, 132, 255, 0.16) 54%, rgba(182, 255, 23, 0.18) 82%, rgba(255, 255, 255, 0.3));
      opacity: calc(0.66 + var(--cursor-glow) * 0.22);
      padding: 1.5px;
      border-radius: inherit;
      -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
      -webkit-mask-composite: xor;
      mask-composite: exclude;
    }

.glass::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      pointer-events: none;
      background:
        radial-gradient(circle 640px at var(--cursor-x) var(--cursor-y), rgba(255, 255, 255, calc((var(--edge-top) + var(--edge-left)) * 0.052)), transparent 76%),
        radial-gradient(circle 700px at var(--cursor-x) var(--cursor-y), rgba(182, 255, 23, calc(var(--edge-right) * 0.048)), transparent 78%),
        radial-gradient(760px 420px at var(--cursor-x) var(--cursor-y), rgba(157, 132, 255, calc(var(--edge-bottom) * 0.056)), transparent 80%),
        linear-gradient(to bottom, rgba(255, 255, 255, calc(var(--edge-top) * 0.2)), rgba(238, 246, 255, calc(var(--edge-top) * 0.09)) 30px, transparent 118px),
        linear-gradient(to right, rgba(255, 255, 255, calc(var(--edge-left) * 0.18)), rgba(238, 246, 255, calc(var(--edge-left) * 0.08)) 30px, transparent 118px),
        linear-gradient(to left, rgba(182, 255, 23, calc(var(--edge-right) * 0.24)), rgba(182, 255, 23, calc(var(--edge-right) * 0.1)) 34px, transparent 138px),
        linear-gradient(to top, rgba(188, 146, 255, calc(var(--edge-bottom) * 0.26)), rgba(157, 132, 255, calc(var(--edge-bottom) * 0.11)) 36px, transparent 148px),
        linear-gradient(to bottom, rgba(245, 250, 255, 0.14), rgba(245, 250, 255, 0.045) 5%, transparent 15%),
        linear-gradient(to top, rgba(188, 146, 255, 0.18), rgba(157, 132, 255, 0.06) 6%, transparent 17%),
        linear-gradient(to left, rgba(182, 255, 23, 0.12), rgba(182, 255, 23, 0.04) 7%, transparent 18%),
        linear-gradient(to right, rgba(238, 246, 255, 0.095), rgba(238, 246, 255, 0.03) 6%, transparent 16%),
        radial-gradient(28% 14% at 8% 0%, rgba(255, 255, 255, 0.17), rgba(157, 132, 255, 0.075) 42%, transparent 76%),
        radial-gradient(32% 16% at 50% 100%, rgba(201, 166, 255, 0.15), rgba(157, 132, 255, 0.055) 38%, transparent 78%),
        radial-gradient(30% 20% at 100% 100%, rgba(182, 255, 23, 0.15), rgba(182, 255, 23, 0.05) 38%, transparent 80%);
      opacity: calc(0.72 + var(--cursor-glow) * 0.2);
      mix-blend-mode: screen;
      transition: opacity 220ms linear;
    }

.glass > * {
      position: relative;
      z-index: 1;
    }

.glass .glass {
      background: rgba(10, 15, 16, 0.38);
      box-shadow:
        inset 0 1px 1px rgba(255, 255, 255, 0.26),
        inset 0 -1px 0 rgba(182, 255, 23, 0.045),
        0 16px 44px rgba(0, 0, 0, 0.24);
      backdrop-filter: none;
      -webkit-backdrop-filter: none;
    }

.glass .glass::before {
      opacity: calc(0.56 + var(--cursor-glow) * 0.28);
    }

.glass .glass::after {
      opacity: calc(0.58 + var(--cursor-glow) * 0.24);
    }

.reactive-panel {
      --cursor-x: 50%;
      --cursor-y: 50%;
      --cursor-glow: 0;
      --edge-top: 0;
      --edge-left: 0;
      --edge-right: 0;
      --edge-bottom: 0;
      position: relative;
      overflow: hidden;
      isolation: isolate;
    }

.reactive-panel::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      border-radius: inherit;
      pointer-events: none;
      background:
        radial-gradient(circle 360px at var(--cursor-x) var(--cursor-y), rgba(255, 255, 255, calc(var(--cursor-glow) * 0.08)), rgba(232, 255, 182, calc(var(--cursor-glow) * 0.035)) 18%, transparent 72%),
        radial-gradient(circle 480px at var(--cursor-x) var(--cursor-y), rgba(255, 255, 255, calc((var(--edge-top) + var(--edge-left)) * 0.09)), transparent 74%),
        radial-gradient(circle 520px at var(--cursor-x) var(--cursor-y), rgba(182, 255, 23, calc(var(--edge-right) * 0.115)), transparent 76%),
        radial-gradient(620px 340px at var(--cursor-x) var(--cursor-y), rgba(157, 132, 255, calc(var(--edge-bottom) * 0.125)), transparent 78%),
        linear-gradient(to bottom, rgba(255, 255, 255, calc(var(--edge-top) * 0.24)), rgba(238, 246, 255, calc(var(--edge-top) * 0.1)) 30px, transparent 112px),
        linear-gradient(to right, rgba(255, 255, 255, calc(var(--edge-left) * 0.22)), rgba(238, 246, 255, calc(var(--edge-left) * 0.09)) 30px, transparent 112px),
        linear-gradient(to left, rgba(182, 255, 23, calc(var(--edge-right) * 0.3)), rgba(182, 255, 23, calc(var(--edge-right) * 0.12)) 34px, transparent 132px),
        linear-gradient(to top, rgba(188, 146, 255, calc(var(--edge-bottom) * 0.32)), rgba(157, 132, 255, calc(var(--edge-bottom) * 0.13)) 36px, transparent 142px);
      opacity: calc(0.18 + var(--cursor-glow) * 0.82);
      mix-blend-mode: screen;
    }

.reactive-panel > * {
      position: relative;
      z-index: 1;
    }

.icon {
      width: var(--icon-size);
      min-width: var(--icon-size);
      height: var(--icon-size);
      min-height: var(--icon-size);
      flex: 0 0 var(--icon-size);
      stroke: currentColor;
    }

.icon.fill {
      fill: currentColor;
      stroke: none;
    }

.logo-mark {
      --icon-size: 24px;
      width: 38px;
      min-width: 38px;
      height: 38px;
      min-height: 38px;
      flex: 0 0 38px;
      display: inline-grid;
      place-items: center;
      border: 1px solid rgba(182, 255, 23, 0.72);
      border-radius: 10px;
      color: var(--lime);
      box-shadow: 0 0 22px rgba(182, 255, 23, 0.18);
    }

.logo-mark--crystal {
      --crystal-size: 54px;
      position: relative;
      width: 48px;
      min-width: 48px;
      height: 56px;
      min-height: 56px;
      flex-basis: 48px;
      overflow: visible;
      border: 0;
      border-radius: 0;
      background: none;
      box-shadow: none;
      backdrop-filter: none;
      -webkit-backdrop-filter: none;
    }

.logo-mark--crystal::before {
      content: "";
      width: var(--crystal-size);
      height: var(--crystal-size);
      background: url("/assets/brand-crystal.webp") center / contain no-repeat;
      filter:
        drop-shadow(0 0 7px rgba(182, 255, 23, 0.72))
        drop-shadow(0 0 14px rgba(157, 132, 255, 0.2));
    }

.logo-mark--crystal .icon {
      display: none;
    }

.logo {
      position: relative;
      display: inline-flex;
      align-items: center;
      gap: 13px;
      font-size: 20px;
      font-weight: 600;
      white-space: nowrap;
    }

.logo-image {
      display: block;
      width: 118px;
      height: auto;
    }

.logo-image--brand-chip {
      width: 112px;
    }

.code-traff-logo__white {
      filter: none;
    }

.code-traff-logo__neon {
      opacity: 1;
      filter:
        saturate(1.02)
        drop-shadow(0 0 0.55px rgba(142, 232, 18, 0.58))
        drop-shadow(0 0 1.6px rgba(142, 232, 18, 0.28));
      animation: code-traff-neon-power 1.55s ease-out both;
    }

.code-traff-logo__neon--top {
      animation-delay: 0.18s;
    }

.code-traff-logo__neon--middle {
      animation-delay: 0.42s;
    }

.code-traff-logo__neon--bottom {
      animation-delay: 0.72s;
    }

.logo-image--ready .code-traff-logo__neon {
      animation: none;
    }

.logo:hover .code-traff-logo__neon--bottom,
.logo-image:hover .code-traff-logo__neon--bottom {
      animation: code-traff-neon-hover-blink 1.24s ease-in-out infinite;
    }

@keyframes code-traff-neon-power {
      0% {
        opacity: 0;
        filter: brightness(0.35);
      }

      8% {
        opacity: 1;
        filter:
          saturate(1.04)
          drop-shadow(0 0 0.7px rgba(142, 232, 18, 0.64))
          drop-shadow(0 0 2.2px rgba(142, 232, 18, 0.32));
      }

      12% {
        opacity: 0.18;
        filter: brightness(0.42);
      }

      19% {
        opacity: 1;
        filter:
          saturate(1.05)
          drop-shadow(0 0 0.8px rgba(142, 232, 18, 0.7))
          drop-shadow(0 0 2.4px rgba(142, 232, 18, 0.36));
      }

      27% {
        opacity: 0.45;
        filter: brightness(0.75);
      }

      36%,
      49% {
        opacity: 1;
        filter:
          saturate(1.04)
          drop-shadow(0 0 0.75px rgba(142, 232, 18, 0.66))
          drop-shadow(0 0 2.1px rgba(142, 232, 18, 0.32));
      }

      43% {
        opacity: 0.72;
        filter:
          brightness(0.95)
          drop-shadow(0 0 0.45px rgba(142, 232, 18, 0.3));
      }

      100% {
        opacity: 1;
        filter:
          saturate(1.02)
          drop-shadow(0 0 0.55px rgba(142, 232, 18, 0.58))
          drop-shadow(0 0 1.6px rgba(142, 232, 18, 0.28));
      }
    }

@keyframes code-traff-neon-hover-blink {
      0%,
      100% {
        opacity: 1;
        filter:
          saturate(1.02)
          drop-shadow(0 0 0.55px rgba(142, 232, 18, 0.58))
          drop-shadow(0 0 1.6px rgba(142, 232, 18, 0.28));
      }

      18%,
      42% {
        opacity: 0.58;
        filter:
          brightness(0.82)
          drop-shadow(0 0 0.45px rgba(142, 232, 18, 0.34));
      }

      28%,
      58%,
      74% {
        opacity: 1;
        filter:
          saturate(1.08)
          drop-shadow(0 0 0.8px rgba(142, 232, 18, 0.72))
          drop-shadow(0 0 2.4px rgba(142, 232, 18, 0.38));
      }

      66% {
        opacity: 0.68;
        filter:
          brightness(0.9)
          drop-shadow(0 0 0.55px rgba(142, 232, 18, 0.42));
      }
    }

@media (prefers-reduced-motion: reduce) {
      .code-traff-logo__neon {
        opacity: 1;
        animation: none;
        filter:
          saturate(1.02)
          drop-shadow(0 0 0.55px rgba(142, 232, 18, 0.58))
          drop-shadow(0 0 1.6px rgba(142, 232, 18, 0.28));
      }

      .logo:hover .code-traff-logo__neon--bottom,
      .logo-image:hover .code-traff-logo__neon--bottom {
        animation: none;
      }
    }

.topbar {
      position: sticky;
      top: 0;
      z-index: 30;
      min-height: 78px;
      display: grid;
      grid-template-columns: auto minmax(0, 1fr) auto auto;
      align-items: center;
      column-gap: 24px;
      row-gap: 0;
      padding: 18px 28px;
      border-radius: 28px;
      transition:
        min-height 260ms ease,
        padding-bottom 260ms ease,
        border-radius 180ms linear,
        border-color 180ms linear,
        box-shadow 180ms linear;
    }

.topbar.glass {
      overflow: visible;
    }

.topbar.is-mega-open {
      padding-bottom: 22px;
    }

[id] {
      scroll-margin-top: 116px;
    }

.topbar.is-stuck {
      border-top-color: rgba(3, 5, 6, 0.96);
      border-top-left-radius: 0;
      border-top-right-radius: 0;
      box-shadow:
        inset 0 1px 0 rgba(3, 5, 6, 0.98),
        var(--panel-shadow),
        0 18px 64px rgba(0, 0, 0, 0.34);
    }

.topbar.is-stuck::before {
      inset: 1px 0 0;
      border-top-left-radius: 0;
      border-top-right-radius: 0;
    }

.main-header .topbar::before {
      background: none;
    }

.nav {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: clamp(18px, 4vw, 58px);
      position: relative;
      z-index: 80;
      color: rgba(246, 248, 243, 0.76);
      font-size: 16px;
    }

.nav a,
    .nav__link {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 0;
      border: 0;
      background: transparent;
      color: inherit;
      font: inherit;
      line-height: 1.2;
      text-decoration: none;
      cursor: pointer;
      transition: color 180ms ease, text-shadow 180ms ease;
    }

.nav__link .icon {
      width: 14px;
      height: 14px;
      opacity: 0.76;
      transform: rotate(90deg);
      transition: transform 180ms ease, opacity 180ms ease;
    }

.nav-dropdown {
      position: relative;
      display: inline-flex;
      align-items: center;
      z-index: 120;
    }

.nav-dropdown__menu {
      position: absolute;
      top: calc(100% + 14px);
      left: 50%;
      z-index: 130;
      width: 220px;
      display: grid;
      gap: 2px;
      padding: 10px;
      border: 1px solid rgba(238, 245, 242, 0.2);
      border-radius: 18px;
      background:
        linear-gradient(145deg, #202322, #101313 62%, #0a0d0d),
        #101313;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        0 24px 56px rgba(0, 0, 0, 0.58),
        0 0 28px rgba(182, 255, 23, 0.08);
      backdrop-filter: none;
      -webkit-backdrop-filter: none;
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
      transform: translate(-50%, -6px);
      transition: opacity 180ms ease, visibility 180ms ease, transform 180ms ease;
    }

.nav-dropdown__menu::before {
      content: "";
      position: absolute;
      left: 0;
      right: 0;
      bottom: 100%;
      height: 16px;
    }

.nav-dropdown.is-open .nav-dropdown__menu {
      opacity: 1;
      visibility: visible;
      pointer-events: auto;
      transform: translate(-50%, 0);
    }

.nav-dropdown__menu a {
      width: 100%;
      min-height: 36px;
      justify-content: space-between;
      padding: 8px 10px;
      border-radius: 12px;
      color: rgba(246, 248, 243, 0.74);
      font-size: var(--fs-body-sm);
      line-height: 1.25;
      transition: color 160ms ease, background 160ms ease, transform 160ms ease;
    }

.nav-dropdown__menu a::after {
      content: "↗";
      color: rgba(182, 255, 23, 0.64);
      font-size: 13px;
      opacity: 0;
      transform: translate(-3px, 3px);
      transition: opacity 160ms ease, transform 160ms ease;
    }

.nav-dropdown__menu a:hover,
    .nav-dropdown__menu a:focus-visible {
      color: var(--text);
      background: rgba(182, 255, 23, 0.07);
      transform: translateX(1px);
    }

.nav-dropdown__menu a:hover::after,
    .nav-dropdown__menu a:focus-visible::after {
      opacity: 1;
      transform: translate(0, 0);
    }

.nav a:hover,
    .nav__link:hover,
    .nav__link[aria-expanded="true"],
    .nav .active {
      color: var(--lime);
      text-shadow: 0 0 16px rgba(182, 255, 23, 0.36);
    }

.nav__link:hover .icon,
    .nav-dropdown.is-open .nav__link .icon,
    .nav__link[aria-expanded="true"] .icon {
      opacity: 1;
      transform: rotate(-90deg);
    }

.mega-menu {
      grid-column: 1 / -1;
      width: 100%;
      max-height: 0;
      overflow: hidden;
      opacity: 0;
      pointer-events: none;
      transition: max-height 320ms ease, opacity 180ms ease;
    }

.topbar.is-mega-open .mega-menu {
      max-height: min(430px, calc(100vh - 92px));
      opacity: 1;
      pointer-events: auto;
    }

.mega-menu__inner {
      padding: 16px 0 10px;
      border-top: 1px solid rgba(238, 245, 242, 0.11);
      max-height: min(430px, calc(100vh - 92px));
      overflow-y: auto;
      scrollbar-width: thin;
      scrollbar-color: rgba(182, 255, 23, 0.32) transparent;
    }

.mega-menu__panel {
      display: none;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: clamp(16px, 2vw, 28px);
      opacity: 0;
      transform: translateY(-8px);
      transition: opacity 220ms ease 70ms, transform 220ms ease 70ms;
    }

.mega-menu__panel--compact {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }

.mega-menu__panel.is-active {
      display: grid;
    }

.topbar.is-mega-open .mega-menu__panel.is-active {
      opacity: 1;
      transform: translateY(0);
    }

.mega-menu__column {
      display: grid;
      align-content: start;
      gap: 5px;
    }

.mega-menu__label {
      display: inline-flex;
      align-items: center;
      width: max-content;
      max-width: 100%;
      min-height: 32px;
      margin-bottom: 4px;
      padding: 7px 13px;
      border: 1px solid rgba(238, 245, 242, 0.12);
      border-radius: 999px;
      background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.018)),
        rgba(255, 255, 255, 0.026);
      color: rgba(246, 248, 243, 0.68);
      font-size: var(--fs-caption);
      font-weight: 600;
      line-height: 1;
      box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.08);
    }

.mega-menu__column a {
      min-height: 28px;
      display: inline-flex;
      align-items: center;
      justify-content: flex-start;
      gap: 8px;
      width: max-content;
      max-width: 100%;
      padding: 4px 0;
      color: rgba(246, 248, 243, 0.72);
      font-size: var(--fs-body-sm);
      line-height: 1.25;
      text-decoration: none;
      transition: color 180ms ease, transform 180ms ease;
    }

.mega-menu__column a::after {
      content: "↗";
      color: rgba(182, 255, 23, 0.68);
      font-size: 14px;
      line-height: 1;
      opacity: 0;
      transform: translate(-4px, 4px);
      transition: opacity 180ms ease, transform 180ms ease;
    }

.mega-menu__column a:hover,
    .mega-menu__column a:focus-visible {
      color: var(--text);
      transform: translateX(2px);
    }

.mega-menu__column a:hover::after,
    .mega-menu__column a:focus-visible::after {
      opacity: 1;
      transform: translate(0, 0);
    }

.mega-menu__banner {
      grid-column: 4;
      min-height: 100%;
      display: grid;
      align-content: center;
      gap: 8px;
      padding: 18px;
      border: 1px solid rgba(182, 255, 23, 0.22);
      border-radius: 22px;
      background:
        radial-gradient(circle at 88% 18%, rgba(182, 255, 23, 0.2), transparent 40%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.018) 58%, rgba(182, 255, 23, 0.06)),
        rgba(9, 14, 15, 0.38);
      color: var(--text);
      text-decoration: none;
      box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.12);
      transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
    }

.mega-menu__banner span {
      color: var(--lime);
      font-size: var(--fs-caption);
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0;
    }

.mega-menu__banner strong {
      max-width: 260px;
      font-size: clamp(18px, 1.7vw, 22px);
      line-height: 1.14;
      font-weight: 600;
    }

.mega-menu__banner small {
      max-width: 260px;
      color: rgba(246, 248, 243, 0.64);
      font-size: var(--fs-body-sm);
      line-height: 1.35;
    }

.mega-menu__banner:hover,
    .mega-menu__banner:focus-visible {
      border-color: rgba(182, 255, 23, 0.42);
      box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.16), 0 16px 42px rgba(0, 0, 0, 0.28);
      transform: translateY(-1px);
    }

.site-header {
      min-height: 72px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 20px;
      padding: 16px 22px;
      border-radius: 24px;
    }

.site-header__nav {
      display: flex;
      align-items: center;
      gap: clamp(14px, 3vw, 42px);
      color: rgba(246, 248, 243, 0.76);
      font-size: 14px;
    }

.site-header__nav a:hover {
      color: var(--lime);
    }

.header-burger {
      --icon-size: 24px;
      width: var(--control-height);
      min-width: var(--control-height);
      height: var(--control-height);
      min-height: var(--control-height);
      display: inline-grid;
      place-items: center;
      padding: 0;
      border: 1px solid rgba(238, 245, 242, 0.22);
      border-radius: 16px;
      background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.105), rgba(255, 255, 255, 0.028) 52%, rgba(157, 132, 255, 0.05)),
        rgba(10, 14, 16, 0.58);
      color: var(--text);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.18),
        inset 0 -1px 0 rgba(157, 132, 255, 0.08),
        0 12px 28px rgba(0, 0, 0, 0.24);
      backdrop-filter: blur(14px) saturate(132%);
      -webkit-backdrop-filter: blur(14px) saturate(132%);
    }

.header-burger:hover,
    .header-burger:focus-visible {
      border-color: rgba(238, 245, 242, 0.36);
      outline: 0;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.24),
        inset 0 -1px 0 rgba(157, 132, 255, 0.12),
        0 0 24px rgba(157, 132, 255, 0.08),
        0 14px 32px rgba(0, 0, 0, 0.28);
    }

.topbar .header-burger,
    .site-header--desktop .header-burger {
      display: none;
    }

.site-header--tablet {
      width: min(100%, 680px);
    }

.site-header--tablet .site-header__nav,
    .site-header--mobile .site-header__nav {
      display: none;
    }

.site-header--mobile {
      width: min(100%, 360px);
      min-height: 66px;
      padding: 14px 16px;
      border-radius: 22px;
    }

.site-header--mobile .logo {
      gap: 10px;
    }

.site-header--mobile .logo-image {
      width: 96px;
    }

.site-header--mobile .logo span:last-child {
      display: none;
    }

.site-header--tablet .btn-primary,
    .site-header--mobile .btn-primary {
      display: none;
    }

.eyebrow {
      position: relative;
      z-index: 0;
      display: inline-flex;
      width: fit-content;
      max-width: 100%;
      justify-self: start;
      align-self: start;
      align-items: center;
      gap: 10px;
      min-height: 38px;
      padding: 8px 16px;
      overflow: hidden;
      isolation: isolate;
      border: 1px solid transparent;
      border-radius: 999px;
      background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.028) 42%, rgba(182, 255, 23, 0.042)),
        rgba(8, 13, 14, 0.68);
      color: var(--text);
      font-size: 14px;
      font-weight: 500;
      line-height: 1;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.18),
        inset 0 -1px 0 rgba(182, 255, 23, 0.08),
        0 12px 30px rgba(0, 0, 0, 0.26);
      backdrop-filter: blur(15px) saturate(142%);
      -webkit-backdrop-filter: blur(15px) saturate(142%);
    }

.eyebrow::before,
    .chip::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: -1;
      border-radius: inherit;
      pointer-events: none;
      background:
        radial-gradient(95px 58px at 16% 0%, rgba(255, 255, 255, 0.2), transparent 68%),
        radial-gradient(110px 64px at 100% 80%, rgba(182, 255, 23, 0.11), transparent 72%),
        radial-gradient(130px 70px at 50% 100%, rgba(157, 132, 255, 0.105), transparent 76%);
      opacity: 0.92;
    }

.dot {
      --dot-size: 18px;
      width: var(--dot-size);
      height: var(--dot-size);
      flex: 0 0 var(--dot-size);
      display: inline-block;
      background: url("/assets/brand-crystal.webp") center / contain no-repeat;
      filter:
        drop-shadow(0 0 7px rgba(182, 255, 23, 0.72))
        drop-shadow(0 0 16px rgba(182, 255, 23, 0.26));
    }

.chip .dot {
      --dot-size: 17px;
      margin-left: -2px;
    }

h1,
    h2,
    h3,
    p {
      margin: 0;
    }

h1 {
      max-width: 720px;
      margin-top: 32px;
      font-size: clamp(40px, 6vw, 82px);
      line-height: 0.98;
      font-weight: 600;
    }

h2 {
      font-size: clamp(28px, 3.5vw, 48px);
      line-height: 1.05;
      font-weight: 600;
    }

h3 {
      font-size: 22px;
      line-height: 1.15;
      font-weight: 500;
    }

.lead {
      max-width: 680px;
      margin-top: 24px;
      color: var(--muted);
      font-size: clamp(17px, 1.8vw, 21px);
      line-height: 1.55;
    }

.accent {
      color: var(--lime);
      text-shadow: 0 0 22px rgba(182, 255, 23, 0.32);
    }

.grid {
      display: grid;
      gap: 18px;
    }

.grid.two {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

.grid.three {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }

.grid-span-2-1 > :first-child,
    .grid-span-2-1 > .ui-kit-copy-shell:first-child {
      grid-column: span 2;
    }

.grid.six {
      grid-template-columns: repeat(6, minmax(0, 1fr));
    }

.grid-span-3-3-2 > :nth-child(-n + 2),
    .grid-span-3-3-2 > .ui-kit-copy-shell:nth-child(-n + 2) {
      grid-column: span 3;
    }

.grid-span-3-3-2 > :nth-child(n + 3),
    .grid-span-3-3-2 > .ui-kit-copy-shell:nth-child(n + 3) {
      grid-column: span 2;
    }

.grid.four {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }

.grid.auto {
      grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }

.token-card,
    .component-card {
      border: 1px solid rgba(238, 245, 242, 0.16);
      border-radius: var(--radius-md);
      background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.018) 58%, rgba(182, 255, 23, 0.028)),
        rgba(9, 14, 15, 0.34);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), inset 0 -1px 0 rgba(182, 255, 23, 0.035);
      backdrop-filter: blur(16px) saturate(130%);
      -webkit-backdrop-filter: blur(16px) saturate(130%);
      padding: 20px;
      min-width: 0;
    }

.token-card strong,
    .component-card strong {
      display: block;
      margin-bottom: 6px;
      font-size: 14px;
    }

.token-card span,
    .component-card span {
      color: var(--muted);
      font-size: 12px;
      line-height: 1.4;
    }

.rich-text {
      display: grid;
      gap: 22px;
      max-width: 920px;
      color: var(--muted);
      font-size: var(--fs-body);
      line-height: var(--lh-body);
    }

.rich-text h1,
    .rich-text h2,
    .rich-text h3,
    .rich-text h4 {
      max-width: none;
      margin: 0;
      color: var(--text);
      line-height: var(--lh-heading);
      font-weight: 600;
    }

.rich-text h1 {
      font-size: var(--fs-h1);
    }

.rich-text h2 {
      font-size: var(--fs-h2);
    }

.rich-text h3 {
      font-size: var(--fs-h3);
    }

.rich-text h4 {
      font-size: var(--fs-h4);
    }

.rich-text p,
    .rich-text blockquote,
    .rich-text ul,
    .rich-text ol {
      margin: 0;
    }

.rich-text blockquote {
      display: grid;
      grid-template-columns: auto 1fr;
      gap: 18px;
      align-items: start;
      padding: 22px 24px;
      border: 1px solid rgba(238, 245, 242, 0.12);
      border-radius: 18px;
      background: rgba(238, 245, 242, 0.045);
      color: var(--text);
      font-size: var(--fs-body-lg);
      line-height: 1.5;
    }

.rich-text blockquote::before {
      content: "“";
      color: var(--lime);
      font-size: 56px;
      line-height: 0.9;
      text-shadow: 0 0 18px rgba(182, 255, 23, 0.32);
    }

.rich-text ul,
    .rich-text ol {
      display: grid;
      gap: 8px;
      padding-left: 26px;
    }

.rich-text ol {
      counter-reset: rich-list;
      list-style: none;
    }

.rich-text ol ol {
      margin-top: 8px;
      padding-left: 22px;
    }

.rich-text ol li {
      counter-increment: rich-list;
      position: relative;
    }

.rich-text ol li::before {
      content: counters(rich-list, ".") " ";
      position: absolute;
      right: calc(100% + 8px);
      color: var(--lime);
      font-weight: 600;
      white-space: nowrap;
    }

.rich-text li::marker {
      color: var(--lime);
      font-weight: 700;
    }

.rich-table {
      width: 100%;
      border-collapse: separate;
      border-spacing: 0;
      overflow: hidden;
      border: 1px solid rgba(238, 245, 242, 0.1);
      border-radius: 16px;
      color: var(--muted);
      font-size: var(--fs-body-sm);
      line-height: 1.45;
    }

.rich-table th,
    .rich-table td {
      padding: 13px 16px;
      border-right: 1px solid rgba(238, 245, 242, 0.08);
      border-bottom: 1px solid rgba(238, 245, 242, 0.08);
      background: rgba(9, 14, 15, 0.44);
      text-align: left;
    }

.rich-table th {
      color: var(--text);
      font-weight: 600;
      background: rgba(238, 245, 242, 0.055);
    }

.rich-table tr:last-child td {
      border-bottom: 0;
    }

.rich-table tbody tr {
      transition:
        background-color 160ms ease,
        color 160ms ease;
    }

.rich-table tbody tr:hover td {
      background:
        linear-gradient(90deg, rgba(182, 255, 23, 0.055), rgba(238, 245, 242, 0.035) 46%, rgba(182, 255, 23, 0.025)),
        rgba(9, 14, 15, 0.5);
      color: rgba(246, 248, 243, 0.82);
    }

.rich-table th:last-child,
    .rich-table td:last-child {
      border-right: 0;
    }

.text-strong {
      color: var(--text);
      font-weight: 600;
    }

.text-link,
    .text-underline {
      color: var(--text);
      text-decoration: underline;
      text-decoration-color: rgba(182, 255, 23, 0.95);
      text-underline-offset: 0.22em;
      text-decoration-thickness: 1px;
    }

.text-link {
      transition:
        color 180ms ease,
        text-decoration-color 180ms ease;
    }

.text-link:hover,
    .text-link:focus-visible {
      color: var(--lime);
      text-decoration-color: rgba(182, 255, 23, 0.95);
      outline: none;
    }

.text-mark {
      padding: 0.08em 0.32em;
      border-radius: 8px;
      background: var(--lime);
      color: #071006;
    }

.text-strike {
      color: var(--muted);
      text-decoration: line-through;
      text-decoration-color: rgba(182, 255, 23, 0.58);
      text-decoration-thickness: 1px;
    }

.text-muted {
      color: var(--dim);
    }

.text-uppercase {
      text-transform: uppercase;
      letter-spacing: 0;
    }

.text-lowercase {
      text-transform: lowercase;
    }

.btn {
      --btn-edge: rgba(238, 245, 242, 0.16);
      --btn-hover-glow: 0;
      --btn-fill: 0;
      --btn-crystal-reveal: 0;
      --btn-light-x: 50%;
      --btn-light-y: 50%;
      --btn-height: var(--control-height);
      --btn-padding-x: 24px;
      --btn-radius: 18px;
      --btn-gap: 12px;
      --btn-font-size: 15px;
      --btn-icon-size: 20px;
      --btn-reveal-size: 120px;
      min-height: var(--btn-height);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: var(--btn-gap);
      border: 1px solid transparent;
      border-radius: var(--btn-radius);
      padding: 0 var(--btn-padding-x);
      color: var(--text);
      background: transparent;
      font-size: var(--btn-font-size);
      font-weight: 600;
      line-height: 1;
      white-space: nowrap;
      position: relative;
      isolation: isolate;
      overflow: hidden;
      transform: translateZ(0);
      transition:
        --btn-hover-glow 220ms linear,
        --btn-fill 260ms linear,
        --btn-crystal-reveal 190ms linear,
        border-color 180ms linear,
        background 220ms linear,
        box-shadow 260ms linear,
        color 180ms linear,
        filter 180ms linear;
    }

.btn-sm {
      --btn-height: 44px;
      --btn-padding-x: 18px;
      --btn-radius: 14px;
      --btn-gap: 9px;
      --btn-font-size: 13px;
      --btn-icon-size: 18px;
      --btn-reveal-size: 86px;
    }

.btn-md {
      --btn-height: 54px;
      --btn-padding-x: 24px;
      --btn-radius: 18px;
      --btn-gap: 12px;
      --btn-font-size: 15px;
      --btn-icon-size: 20px;
      --btn-reveal-size: 120px;
    }

.btn-lg {
      --btn-height: 64px;
      --btn-padding-x: 30px;
      --btn-radius: 22px;
      --btn-gap: 14px;
      --btn-font-size: 17px;
      --btn-icon-size: 22px;
      --btn-reveal-size: 150px;
    }

.btn::before,
    .btn::after {
      content: "";
      position: absolute;
      inset: 0;
      border-radius: inherit;
      pointer-events: none;
    }

.btn::before {
      z-index: 2;
      padding: 1px;
      background:
        radial-gradient(circle 138px at var(--btn-light-x) var(--btn-light-y), rgba(255, 255, 255, calc(var(--btn-hover-glow) * 0.74)), rgba(238, 246, 255, calc(var(--btn-hover-glow) * 0.26)) 22%, rgba(157, 132, 255, calc(var(--btn-hover-glow) * 0.2)) 46%, transparent 74%),
        radial-gradient(58% 220% at var(--btn-light-x) 0%, rgba(255, 255, 255, calc(0.24 + var(--btn-hover-glow) * 0.34)), rgba(157, 132, 255, calc(0.12 + var(--btn-hover-glow) * 0.14)) 24%, transparent 62%),
        radial-gradient(70% 180% at 100% 100%, rgba(182, 255, 23, calc(0.18 + var(--btn-hover-glow) * 0.34)), transparent 64%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.34), var(--btn-edge) 36%, rgba(157, 132, 255, 0.2) 58%, rgba(182, 255, 23, calc(0.24 + var(--btn-hover-glow) * 0.22)));
      -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
      -webkit-mask-composite: xor;
      mask-composite: exclude;
      opacity: calc(0.68 + var(--btn-hover-glow) * 0.28);
      transition:
        opacity 180ms linear,
        background-position 320ms linear;
    }

.btn::after {
      z-index: 0;
      background:
        radial-gradient(circle 160px at var(--btn-light-x) var(--btn-light-y), rgba(255, 255, 255, calc(var(--btn-hover-glow) * 0.18)), transparent 58%),
        linear-gradient(110deg, transparent 0 31%, rgba(255, 255, 255, calc(var(--btn-hover-glow) * 0.2)) 47%, transparent 63%),
        radial-gradient(120% 90% at 100% 100%, rgba(182, 255, 23, calc(var(--btn-hover-glow) * 0.12)), transparent 62%);
      background-size: 100% 100%, 240% 100%, 100% 100%;
      background-position: center, 135% 0, center;
      opacity: 1;
      mix-blend-mode: screen;
      transition:
        background-position 340ms linear,
        opacity 180ms linear;
    }

.btn:hover::after,
    .btn:focus-visible::after {
      background-position: center, -40% 0, center;
    }

.btn > .icon {
      --icon-size: var(--btn-icon-size);
      position: relative;
      z-index: 3;
      transition:
        transform 220ms linear,
        filter 180ms linear,
        color 160ms linear;
      will-change: transform;
    }

.btn > .btn-label {
      position: relative;
      z-index: 3;
      display: inline-flex;
      align-items: center;
      color: currentColor;
      opacity: 1;
      mix-blend-mode: normal;
    }

.btn:hover,
    .btn:focus-visible {
      --btn-hover-glow: 1;
      --btn-fill: 1;
    }

.btn:hover > .icon,
    .btn:focus-visible > .icon {
      transform: translate3d(3px, -1px, 0);
      filter: drop-shadow(0 0 12px rgba(182, 255, 23, 0.36));
    }

.btn:has(> .icon:only-child):hover > .icon,
    .btn:has(> .icon:only-child):focus-visible > .icon {
      transform: scale(1.08);
      filter:
        drop-shadow(0 0 10px rgba(238, 245, 242, 0.28))
        drop-shadow(0 0 14px rgba(157, 132, 255, 0.18));
    }

.btn:focus-visible {
      outline: 2px solid rgba(182, 255, 23, 0.64);
      outline-offset: 3px;
    }

.btn-primary {
      --btn-edge: rgba(238, 255, 206, 0.6);
      color: #152000;
      background: #b6ff17;
      box-shadow:
        0 0 0 1px rgba(182, 255, 23, 0.12),
        0 14px 36px rgba(151, 238, 9, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.52),
        inset 0 -1px 0 rgba(42, 64, 0, 0.16);
    }

.btn-primary::before {
      background:
        radial-gradient(circle 156px at var(--btn-light-x) var(--btn-light-y), rgba(255, 255, 255, calc(var(--btn-hover-glow) * 0.78)), rgba(238, 255, 206, calc(var(--btn-hover-glow) * 0.34)) 20%, rgba(182, 255, 23, calc(var(--btn-hover-glow) * 0.22)) 48%, transparent 76%),
        radial-gradient(48% 220% at var(--btn-light-x) 0%, rgba(255, 255, 255, calc(0.34 + var(--btn-hover-glow) * 0.24)), rgba(238, 255, 206, calc(0.18 + var(--btn-hover-glow) * 0.1)) 24%, transparent 62%),
        radial-gradient(78% 190% at 100% 100%, rgba(92, 164, 0, calc(0.18 + var(--btn-hover-glow) * 0.16)), transparent 66%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.46), rgba(238, 255, 206, 0.24) 32%, rgba(74, 132, 0, 0.22) 53%, rgba(255, 255, 255, 0.34) 74%, rgba(42, 64, 0, 0.14));
    }

.btn-primary::after {
      z-index: 1;
      background:
        linear-gradient(180deg, rgba(206, 255, 72, 0.1), rgba(148, 239, 0, 0.08)),
        url("/assets/crystal-button-skin.webp");
      background-size: 100% 100%, 112% 132%;
      background-position: center, 50% 50%;
      opacity: 1;
      mix-blend-mode: normal;
      filter: saturate(1.12) contrast(1.06);
      -webkit-mask-image:
        radial-gradient(circle var(--btn-reveal-size) at var(--btn-light-x) var(--btn-light-y),
          rgba(0, 0, 0, calc(var(--btn-crystal-reveal) * 0.9)) 0%,
          rgba(0, 0, 0, calc(var(--btn-crystal-reveal) * 0.54)) 30%,
          rgba(0, 0, 0, calc(var(--btn-crystal-reveal) * 0.19)) 64%,
          rgba(0, 0, 0, 0) 100%);
      mask-image:
        radial-gradient(circle var(--btn-reveal-size) at var(--btn-light-x) var(--btn-light-y),
          rgba(0, 0, 0, calc(var(--btn-crystal-reveal) * 0.9)) 0%,
          rgba(0, 0, 0, calc(var(--btn-crystal-reveal) * 0.54)) 30%,
          rgba(0, 0, 0, calc(var(--btn-crystal-reveal) * 0.19)) 64%,
          rgba(0, 0, 0, 0) 100%);
    }

.btn-primary:hover::after,
    .btn-primary:focus-visible::after {
      background-position: center, 50% 50%;
    }

.btn-primary:hover {
      box-shadow:
        0 0 0 1px rgba(182, 255, 23, 0.22),
        0 16px 42px rgba(151, 238, 9, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.66),
        inset 0 -1px 0 rgba(42, 64, 0, 0.14);
    }

.btn-primary:hover > .icon,
    .btn-primary:focus-visible > .icon {
      transform: none;
      filter: drop-shadow(0 1px 0 rgba(255, 255, 255, 0.2));
    }

.btn-filled {
      color: #152000;
      background: #b6ff17;
      border-color: rgba(182, 255, 23, 0.42);
      box-shadow:
        0 0 0 1px rgba(182, 255, 23, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.42),
        inset 0 -1px 0 rgba(42, 64, 0, 0.12);
      transition: none;
    }

.btn-filled::before,
    .btn-filled::after {
      display: none;
    }

.btn-filled > .icon {
      transition: none;
    }

.btn-filled:hover,
    .btn-filled:focus-visible {
      --btn-hover-glow: 0;
      --btn-fill: 0;
      --btn-crystal-reveal: 0;
      background: #b6ff17;
      box-shadow:
        0 0 0 1px rgba(182, 255, 23, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.42),
        inset 0 -1px 0 rgba(42, 64, 0, 0.12);
    }

.btn-filled:hover > .icon,
    .btn-filled:focus-visible > .icon {
      transform: none;
      filter: none;
    }

.btn-lime-border {
      --btn-edge: rgba(182, 255, 23, 0.92);
      color: var(--text);
      border-color: rgba(182, 255, 23, 0.78);
      background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.025) 48%, rgba(182, 255, 23, 0.05)),
        rgba(12, 16, 19, 0.64);
      box-shadow:
        0 0 0 1px rgba(182, 255, 23, 0.18),
        0 12px 32px rgba(0, 0, 0, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.16),
        inset 0 -1px 0 rgba(182, 255, 23, 0.1);
    }

.btn-lime-border::before {
      background:
        radial-gradient(circle 138px at var(--btn-light-x) var(--btn-light-y), rgba(255, 255, 255, calc(var(--btn-hover-glow) * 0.62)), rgba(238, 255, 206, calc(var(--btn-hover-glow) * 0.24)) 24%, rgba(182, 255, 23, calc(var(--btn-hover-glow) * 0.2)) 52%, transparent 76%),
        linear-gradient(135deg, rgba(238, 255, 206, 0.84), rgba(182, 255, 23, 0.96) 42%, rgba(121, 216, 0, 0.7) 72%, rgba(238, 255, 206, 0.72));
      opacity: calc(0.88 + var(--btn-hover-glow) * 0.12);
    }

.btn-lime-border::after {
      z-index: 0;
      background:
        radial-gradient(92% 160% at var(--btn-light-x) 0%, rgba(255, 255, 255, 0.3), transparent 56%),
        linear-gradient(135deg, #c8ff3f, #a8ff00 52%, #8ee600);
      opacity: var(--btn-fill);
      mix-blend-mode: normal;
    }

.btn-lime-border:hover,
    .btn-lime-border:focus-visible {
      color: #132000;
      border-color: rgba(182, 255, 23, 1);
      box-shadow:
        0 0 0 1px rgba(182, 255, 23, 0.28),
        0 16px 38px rgba(151, 238, 9, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.42),
        inset 0 -1px 0 rgba(42, 64, 0, 0.16);
    }

.btn-lime-border:hover > .icon,
    .btn-lime-border:focus-visible > .icon {
      transform: none;
      filter: none;
    }

.btn-crystal-gray {
      --btn-edge: rgba(238, 245, 242, 0.58);
      color: var(--text);
      background: #3c4244;
      border-color: rgba(238, 245, 242, 0.18);
      box-shadow:
        0 0 0 1px rgba(238, 245, 242, 0.08),
        0 14px 36px rgba(0, 0, 0, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.24),
        inset 0 -1px 0 rgba(0, 0, 0, 0.22);
    }

.btn-crystal-gray::before {
      background:
        radial-gradient(circle 156px at var(--btn-light-x) var(--btn-light-y), rgba(255, 255, 255, calc(var(--btn-hover-glow) * 0.7)), rgba(238, 246, 255, calc(var(--btn-hover-glow) * 0.32)) 20%, rgba(157, 132, 255, calc(var(--btn-hover-glow) * 0.12)) 48%, transparent 76%),
        radial-gradient(48% 220% at var(--btn-light-x) 0%, rgba(255, 255, 255, calc(0.3 + var(--btn-hover-glow) * 0.22)), rgba(238, 246, 255, calc(0.16 + var(--btn-hover-glow) * 0.1)) 24%, transparent 62%),
        radial-gradient(78% 190% at 100% 100%, rgba(245, 250, 255, calc(0.14 + var(--btn-hover-glow) * 0.14)), transparent 66%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.42), rgba(238, 246, 255, 0.22) 32%, rgba(157, 132, 255, 0.12) 53%, rgba(255, 255, 255, 0.3) 74%, rgba(0, 0, 0, 0.18));
    }

.btn-crystal-gray::after {
      z-index: 1;
      background:
        linear-gradient(180deg, rgba(245, 250, 255, 0.1), rgba(152, 162, 166, 0.1)),
        url("/assets/crystal-button-skin.webp");
      background-size: 100% 100%, 112% 132%;
      background-position: center, 50% 50%;
      opacity: 1;
      mix-blend-mode: screen;
      filter: grayscale(1) saturate(0.16) brightness(0.84) contrast(1.2);
      -webkit-mask-image:
        radial-gradient(circle var(--btn-reveal-size) at var(--btn-light-x) var(--btn-light-y),
          rgba(0, 0, 0, calc(var(--btn-crystal-reveal) * 0.84)) 0%,
          rgba(0, 0, 0, calc(var(--btn-crystal-reveal) * 0.5)) 30%,
          rgba(0, 0, 0, calc(var(--btn-crystal-reveal) * 0.18)) 64%,
          rgba(0, 0, 0, 0) 100%);
      mask-image:
        radial-gradient(circle var(--btn-reveal-size) at var(--btn-light-x) var(--btn-light-y),
          rgba(0, 0, 0, calc(var(--btn-crystal-reveal) * 0.84)) 0%,
          rgba(0, 0, 0, calc(var(--btn-crystal-reveal) * 0.5)) 30%,
          rgba(0, 0, 0, calc(var(--btn-crystal-reveal) * 0.18)) 64%,
          rgba(0, 0, 0, 0) 100%);
    }

.btn-crystal-gray:hover::after,
    .btn-crystal-gray:focus-visible::after {
      background-position: center, 50% 50%;
    }

.btn-crystal-gray:hover {
      box-shadow:
        0 0 0 1px rgba(238, 245, 242, 0.16),
        0 16px 42px rgba(0, 0, 0, 0.24),
        inset 0 1px 0 rgba(255, 255, 255, 0.34),
        inset 0 -1px 0 rgba(0, 0, 0, 0.18);
    }

.btn-crystal-gray:hover > .icon,
    .btn-crystal-gray:focus-visible > .icon {
      transform: none;
      filter: drop-shadow(0 1px 0 rgba(255, 255, 255, 0.16));
    }

.btn-outline {
      --btn-edge: rgba(238, 245, 242, 0.34);
      border-color: rgba(238, 245, 242, 0.24);
      background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.115), rgba(255, 255, 255, 0.034) 42%, rgba(157, 132, 255, 0.055) 76%, rgba(238, 245, 242, 0.036)),
        radial-gradient(115% 120% at 0% 0%, rgba(238, 246, 255, 0.13), transparent 58%),
        radial-gradient(95% 110% at 100% 100%, rgba(157, 132, 255, 0.08), transparent 62%),
        rgba(12, 16, 19, 0.76);
      color: var(--text);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.2),
        inset 0 -1px 0 rgba(157, 132, 255, 0.08),
        0 12px 30px rgba(0, 0, 0, 0.22);
    }

.btn-outline::after,
    .btn-ghost::after {
      background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.04), rgba(238, 245, 242, calc(0.035 + var(--btn-fill) * 0.038)) 44%, rgba(157, 132, 255, calc(0.035 + var(--btn-fill) * 0.04))),
        linear-gradient(110deg, transparent 0 31%, rgba(255, 255, 255, calc(var(--btn-hover-glow) * 0.18)) 47%, transparent 63%);
      background-size: 100% 100%, 240% 100%;
      background-position: center, 135% 0;
      opacity: calc(0.42 + var(--btn-fill) * 0.34);
      mix-blend-mode: normal;
    }

.btn-outline::before,
    .btn-ghost::before {
      background:
        radial-gradient(58% 220% at var(--btn-light-x) 0%, rgba(255, 255, 255, calc(0.28 + var(--btn-hover-glow) * 0.34)), rgba(157, 132, 255, calc(0.12 + var(--btn-hover-glow) * 0.18)) 28%, transparent 64%),
        radial-gradient(76% 190% at 100% 100%, rgba(157, 132, 255, calc(0.1 + var(--btn-hover-glow) * 0.18)), rgba(238, 245, 242, calc(0.06 + var(--btn-hover-glow) * 0.1)) 38%, transparent 68%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.36), rgba(238, 245, 242, 0.2) 38%, rgba(157, 132, 255, calc(0.18 + var(--btn-hover-glow) * 0.12)) 68%, rgba(255, 255, 255, 0.28));
    }

.btn-outline:hover::after,
    .btn-outline:focus-visible::after,
    .btn-ghost:hover::after,
    .btn-ghost:focus-visible::after {
      background-position: center, -40% 0;
    }

.btn-outline:hover,
    .btn-outline:focus-visible {
      border-color: rgba(238, 245, 242, 0.42);
      color: var(--text);
      background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.13), rgba(255, 255, 255, 0.04) 42%, rgba(157, 132, 255, 0.068) 76%, rgba(238, 245, 242, 0.044)),
        radial-gradient(115% 120% at 0% 0%, rgba(238, 246, 255, 0.14), transparent 58%),
        radial-gradient(95% 110% at 100% 100%, rgba(157, 132, 255, 0.1), transparent 62%),
        rgba(12, 16, 19, 0.8);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.23),
        inset 0 -1px 0 rgba(157, 132, 255, 0.12),
        0 0 28px rgba(157, 132, 255, 0.08),
        0 14px 32px rgba(0, 0, 0, 0.25);
    }

.btn-ghost {
      --btn-edge: rgba(238, 245, 242, 0.22);
      border-color: rgba(238, 245, 242, 0.14);
      background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.095), rgba(255, 255, 255, 0.028) 45%, rgba(157, 132, 255, 0.052)),
        radial-gradient(110% 120% at 0% 0%, rgba(238, 246, 255, 0.1), transparent 58%),
        rgba(12, 16, 19, 0.7);
      color: var(--text);
    }

.btn-ghost:hover,
    .btn-ghost:focus-visible {
      border-color: rgba(238, 245, 242, 0.32);
      color: var(--text);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.14),
        inset 0 -1px 0 rgba(157, 132, 255, 0.08),
        0 0 26px rgba(157, 132, 255, 0.06);
    }

.btn-text {
      min-height: var(--btn-height);
      padding: 0;
      border: 0;
      border-radius: var(--btn-radius);
      color: var(--lime);
      background: transparent;
    }

.btn-text::before,
    .btn-text::after {
      display: none;
    }

.btn-text:hover,
    .btn-text:focus-visible {
      color: #d7ff77;
      text-shadow: 0 0 18px rgba(182, 255, 23, 0.24);
    }

.btn-text:hover > .icon,
    .btn-text:focus-visible > .icon {
      transform: translate3d(4px, -1px, 0);
    }

.btn-square,
    .btn-icon {
      --btn-edge: rgba(238, 245, 242, 0.28);
      width: var(--btn-height);
      min-width: var(--btn-height);
      height: var(--btn-height);
      min-height: var(--btn-height);
      flex: 0 0 var(--btn-height);
      padding: 0;
      border-radius: calc(var(--btn-radius) - 2px);
      border-color: rgba(238, 245, 242, 0.18);
      background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.026) 48%, rgba(157, 132, 255, 0.045)),
        rgba(10, 14, 16, 0.5);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.16),
        inset 0 -1px 0 rgba(157, 132, 255, 0.09),
        0 12px 28px rgba(0, 0, 0, 0.24);
    }

.btn-icon {
      border-radius: calc(var(--btn-radius) - 2px);
    }

.btn-icon::before,
    .btn-square:not(.btn-primary)::before {
      background:
        radial-gradient(70% 210% at var(--btn-light-x) 0%, rgba(255, 255, 255, calc(0.34 + var(--btn-hover-glow) * 0.28)), rgba(206, 194, 255, calc(0.16 + var(--btn-hover-glow) * 0.16)) 28%, transparent 64%),
        radial-gradient(90% 190% at 100% 100%, rgba(157, 132, 255, calc(0.14 + var(--btn-hover-glow) * 0.18)), rgba(238, 245, 242, calc(0.08 + var(--btn-hover-glow) * 0.12)) 38%, transparent 68%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.4), rgba(238, 245, 242, 0.2) 38%, rgba(157, 132, 255, calc(0.22 + var(--btn-hover-glow) * 0.12)) 68%, rgba(255, 255, 255, 0.28));
    }

.btn-icon::after,
    .btn-square:not(.btn-primary)::after {
      background:
        radial-gradient(circle 145px at var(--btn-light-x) var(--btn-light-y), rgba(255, 255, 255, calc(var(--btn-hover-glow) * 0.16)), rgba(206, 194, 255, calc(var(--btn-hover-glow) * 0.08)) 42%, transparent 68%),
        linear-gradient(110deg, transparent 0 31%, rgba(255, 255, 255, calc(var(--btn-hover-glow) * 0.18)) 47%, transparent 63%),
        radial-gradient(110% 90% at 100% 100%, rgba(157, 132, 255, calc(0.04 + var(--btn-hover-glow) * 0.08)), transparent 64%);
      background-size: 100% 100%, 240% 100%, 100% 100%;
      background-position: center, 135% 0, center;
      mix-blend-mode: screen;
    }

.btn-icon:hover,
    .btn-icon:focus-visible,
    .btn-square:not(.btn-primary):hover,
    .btn-square:not(.btn-primary):focus-visible {
      border-color: rgba(238, 245, 242, 0.34);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.22),
        inset 0 -1px 0 rgba(157, 132, 255, 0.14),
        0 0 26px rgba(157, 132, 255, 0.1),
        0 14px 30px rgba(0, 0, 0, 0.28);
    }

.btn-square:hover > .icon,
    .btn-square:focus-visible > .icon,
    .btn-icon:hover > .icon,
    .btn-icon:focus-visible > .icon {
      transform: scale(1.08);
      filter:
        drop-shadow(0 0 10px rgba(238, 245, 242, 0.28))
        drop-shadow(0 0 14px rgba(157, 132, 255, 0.18));
    }

.btn-icon:focus-visible,
    .btn-square:not(.btn-primary):focus-visible {
      outline-color: rgba(238, 245, 242, 0.46);
    }

.btn-filled.btn-square {
      color: #152000;
      background: #b6ff17;
      border-color: rgba(182, 255, 23, 0.42);
      box-shadow:
        0 0 0 1px rgba(182, 255, 23, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.42),
        inset 0 -1px 0 rgba(42, 64, 0, 0.12);
    }

.btn-filled.btn-square::before,
    .btn-filled.btn-square::after {
      display: none;
    }

.btn-filled.btn-square:hover,
    .btn-filled.btn-square:focus-visible {
      background: #b6ff17;
      border-color: rgba(182, 255, 23, 0.42);
      box-shadow:
        0 0 0 1px rgba(182, 255, 23, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.42),
        inset 0 -1px 0 rgba(42, 64, 0, 0.12);
    }

.btn-filled.btn-square:hover > .icon,
    .btn-filled.btn-square:focus-visible > .icon {
      transform: scale(1.08);
      filter: none;
    }

.btn[disabled] {
      cursor: not-allowed;
      opacity: 0.42;
      transform: none;
      box-shadow: none;
    }

.btn[disabled]::before,
    .btn[disabled]::after {
      opacity: 0;
    }

.btn[disabled] > .icon {
      transform: none;
      filter: none;
    }

.button-row,
    .chip-row {
      display: flex;
      flex-wrap: wrap;
      gap: 14px;
      align-items: center;
    }

.filter-tabs {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 12px;
    }

.filter-tab {
      position: relative;
      min-height: 38px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      padding: 8px 18px;
      border: 1px solid rgba(238, 245, 242, 0.12);
      border-radius: 999px;
      background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.018)),
        rgba(8, 13, 14, 0.62);
      color: rgba(246, 248, 243, 0.62);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 10px 24px rgba(0, 0, 0, 0.16);
      font: inherit;
      font-size: 13px;
      line-height: 1;
      text-decoration: none;
      cursor: pointer;
      transition:
        color 160ms linear,
        border-color 160ms linear,
        background 160ms linear,
        box-shadow 160ms linear;
    }

.filter-tab:hover,
    .filter-tab:focus-visible,
    .filter-tab.active {
      color: var(--lime);
      border-color: rgba(182, 255, 23, 0.24);
      background:
        linear-gradient(145deg, rgba(182, 255, 23, 0.14), rgba(182, 255, 23, 0.052) 50%, rgba(255, 255, 255, 0.022)),
        rgba(11, 18, 13, 0.76);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.14),
        0 0 0 1px rgba(182, 255, 23, 0.04),
        0 12px 30px rgba(0, 0, 0, 0.2),
        0 0 20px rgba(182, 255, 23, 0.12);
      outline: none;
    }

.chip {
      position: relative;
      z-index: 0;
      min-height: 38px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 9px;
      padding: 8px 15px;
      overflow: hidden;
      isolation: isolate;
      border: 1px solid rgba(238, 245, 242, 0.18);
      border-radius: 999px;
      background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.078), rgba(255, 255, 255, 0.026) 44%, rgba(182, 255, 23, 0.038)),
        rgba(8, 13, 14, 0.67);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.16),
        inset 0 -1px 0 rgba(182, 255, 23, 0.07),
        0 10px 24px rgba(0, 0, 0, 0.22);
      backdrop-filter: blur(15px) saturate(142%);
      -webkit-backdrop-filter: blur(15px) saturate(142%);
      color: var(--muted);
      font-size: 13px;
      font-weight: 500;
      line-height: 1;
      text-align: center;
    }

.chip.active {
      color: var(--lime);
      border-color: rgba(182, 255, 23, 0.42);
      background:
        linear-gradient(145deg, rgba(182, 255, 23, 0.18), rgba(182, 255, 23, 0.068) 42%, rgba(157, 132, 255, 0.035)),
        rgba(10, 17, 13, 0.72);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.18),
        inset 0 -1px 0 rgba(182, 255, 23, 0.18),
        0 0 26px rgba(182, 255, 23, 0.14);
    }

.chip.date {
      color: rgba(246, 248, 243, 0.68);
      background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.096), rgba(255, 255, 255, 0.036) 50%, rgba(157, 132, 255, 0.04)),
        rgba(8, 13, 14, 0.7);
    }

.chip-date-split {
      min-height: 34px;
      gap: 5px;
      padding: 7px 13px;
      border-color: rgba(238, 245, 242, 0.11);
      background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.016) 58%, rgba(182, 255, 23, 0.018)),
        rgba(8, 12, 13, 0.56);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.09),
        0 10px 22px rgba(0, 0, 0, 0.18);
      color: rgba(246, 248, 243, 0.62);
      font-size: 12px;
      font-weight: 500;
    }

.chip-date-split__day {
      color: var(--lime);
      font-weight: 600;
    }

.chip-quiet {
      min-height: 34px;
      padding: 7px 13px;
      border-color: rgba(238, 245, 242, 0.11);
      background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.016) 58%, rgba(182, 255, 23, 0.018)),
        rgba(8, 12, 13, 0.56);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.09),
        0 10px 22px rgba(0, 0, 0, 0.18);
      color: rgba(246, 248, 243, 0.68);
      font-size: 12px;
      font-weight: 500;
    }

.chip.price {
      color: var(--text);
      border-color: rgba(182, 255, 23, 0.3);
      background:
        linear-gradient(145deg, rgba(182, 255, 23, 0.13), rgba(182, 255, 23, 0.052) 48%, rgba(255, 255, 255, 0.036)),
        rgba(8, 13, 14, 0.7);
    }

.iconbox {
      --icon-size: var(--icon-box-glyph-size);
      width: var(--icon-box-size);
      min-width: var(--icon-box-size);
      height: var(--icon-box-size);
      min-height: var(--icon-box-size);
      flex: 0 0 var(--icon-box-size);
      display: inline-grid;
      place-items: center;
      border: 1px solid rgba(238, 245, 242, 0.22);
      border-radius: 16px;
      color: var(--lime);
      background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.025) 52%, rgba(182, 255, 23, 0.055)),
        radial-gradient(circle at 50% 0%, rgba(238, 246, 255, 0.16), transparent 68%),
        rgba(9, 14, 15, 0.42);
      box-shadow:
        inset 0 1px 1px rgba(255, 255, 255, 0.34),
        inset 0 -1px 0 rgba(182, 255, 23, 0.1),
        0 0 22px rgba(182, 255, 23, 0.08);
      backdrop-filter: blur(14px) saturate(135%);
      -webkit-backdrop-filter: blur(14px) saturate(135%);
    }

.iconbox.round {
      border-radius: 50%;
    }

.iconbox--crystal::before {
      content: "";
      width: 34px;
      height: 34px;
      background: url("/assets/brand-crystal.webp") center / contain no-repeat;
      filter:
        drop-shadow(0 0 7px rgba(182, 255, 23, 0.64))
        drop-shadow(0 0 14px rgba(157, 132, 255, 0.18));
    }

.iconbox--crystal .icon {
      display: none;
    }

.tilt-glare-card {
      --tilt-glare-hover: 0;
      --tilt-glare-pos: -42%;
      --tilt-glare-x: 0deg;
      --tilt-glare-y: 0deg;
      --tilt-glare-motion-strength: 1;
      --tilt-glare-glow-strength: 1;
      cursor: pointer;
      transform: perspective(900px) rotateY(var(--tilt-glare-y)) rotateX(var(--tilt-glare-x));
      transform-origin: center center;
      transform-style: preserve-3d;
      will-change: transform;
      transition:
        opacity 260ms ease,
        transform 260ms ease,
        border-color 260ms ease,
        box-shadow 260ms ease;
    }

.tilt-glare-card:hover,
    .tilt-glare-card:focus-within {
      transition:
        opacity 260ms ease,
        border-color 260ms ease,
        box-shadow 260ms ease;
    }

.tilt-glare-card.glass::after {
      background:
        linear-gradient(110deg, transparent 0 31%, rgba(255, 255, 255, calc(var(--tilt-glare-hover) * 0.16)) 47%, transparent 63%),
        radial-gradient(110% 90% at 100% 100%, rgba(157, 132, 255, 0.06), transparent 64%),
        radial-gradient(72% 92% at 88% 12%, rgba(230, 255, 196, 0.1), transparent 62%),
        radial-gradient(80% 92% at 12% 100%, rgba(157, 132, 255, 0.07), transparent 68%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.085), rgba(255, 255, 255, 0.024) 52%, rgba(182, 255, 23, 0.032)),
        rgba(9, 14, 15, 0.42);
      background-size:
        240% 240%,
        100% 100%,
        100% 100%,
        100% 100%,
        100% 100%,
        100% 100%;
      background-position:
        var(--tilt-glare-pos) var(--tilt-glare-pos),
        0% 0%,
        0% 0%,
        0% 0%,
        0% 0%,
        0% 0%;
      background-repeat: no-repeat;
      opacity: 1;
      mix-blend-mode: normal;
      transition: background-position 180ms linear;
    }

.tilt-glare-card:hover.glass::after,
    .tilt-glare-card:focus-within.glass::after {
      transition: none;
    }

.service-card--featured.tilt-glare-card {
      --tilt-glare-motion-strength: 0.52;
      --tilt-glare-glow-strength: 0.72;
    }

.service-card {
      position: relative;
      overflow: hidden;
      min-height: 260px;
      height: 100%;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      gap: 28px;
      padding: 26px;
      border-radius: var(--radius-md);
    }

.service-card--featured {
      min-height: 0;
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(170px, 1fr);
      gap: clamp(22px, 4vw, 52px);
      align-items: center;
      padding: clamp(14px, 2vw, 23px);
    }

.service-card--compact.service-card {
      min-height: 0;
      display: grid;
      grid-template-columns: minmax(150px, 150px) minmax(0, 1fr);
      gap: clamp(10px, 3vw, 10px);
      align-items: flex-start;
      padding: clamp(15px, 1.8vw, 15px);
    }

.service-card--compact .btn {
      display: none;
    }

.service-card__content {
      height: 100%;
      position: relative;
      z-index: 3;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      justify-content: space-between;
      gap: 28px;
      min-width: 0;
    }

.service-card--featured .iconbox {
      --icon-box-glyph-size: 34px;
    }

.service-card--compact .iconbox {
      --icon-box-glyph-size: 32px;
    }

.service-card h3 {
      margin-top: 0;
    }

.card-title-link,
    .service-card__media,
    .case-card__media,
    .article-visual {
      color: inherit;
      text-decoration: none;
    }

.card-title-link {
      display: inline;
    }

.service-card--featured h3::after,
    .service-card--compact h3::after {
      content: "";
      display: block;
      width: 64px;
      height: 2px;
      margin-top: 18px;
      border-radius: 999px;
      background:
        linear-gradient(90deg, var(--lime), rgba(182, 255, 23, 0.45) 52%, rgba(182, 255, 23, 0));
      box-shadow: 0 0 14px rgba(182, 255, 23, 0.2);
    }

.service-card--compact h3::after {
      width: 52px;
      margin-top: 14px;
    }

.service-card p {
      max-width: 300px;
      margin-top: 14px;
      color: var(--muted);
      font-size: 15px;
      line-height: 1.5;
      display: -webkit-box;
      overflow: hidden;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 3;
    }

.service-card--compact p {
      max-width: 260px;
      font-size: 14px;
    }

.service-card__media {
      position: relative;
      z-index: 1;
      width: 100%;
      aspect-ratio: 1 / 1;
      min-height: 0;
      display: grid;
      place-items: center;
      overflow: hidden;
      border-radius: 24px;
    }

.service-card > .service-card__content {
      z-index: 3;
    }

.service-card > .service-card__media {
      z-index: 1;
    }

.service-card--compact .service-card__media {
      order: -1;
      width: min(180px, 100%);
      aspect-ratio: 5 / 5;
      justify-self: start;
      border-radius: 20px;
    }

.service-card__media > img {
      width: 100%;
      height: 100%;
      display: block;
      object-fit: cover;
      border-radius: inherit;
    }

.service-card__placeholder {
      width: 100%;
      height: 100%;
      display: grid;
      place-items: center;
      align-content: center;
      gap: 10px;
      padding: 24px;
      border: 1px dashed rgba(238, 245, 242, 0.24);
      border-radius: inherit;
      background:
        radial-gradient(circle at 100% 100%, rgba(182, 255, 23, 0.08), transparent 64%),
        rgba(9, 14, 15, 0.32);
      color: var(--muted);
      text-align: center;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        inset 0 -1px 0 rgba(182, 255, 23, 0.04),
        0 20px 54px rgba(0, 0, 0, 0.2);
    }

.service-card__placeholder .icon {
      --icon-size: 42px;
      color: rgba(246, 248, 243, 0.34);
    }

.service-card__placeholder span {
      color: rgba(246, 248, 243, 0.34);
      font-size: 14px;
      line-height: 1.25;
    }

.case-card {
      --case-content-width: 56%;
      --case-border-glow: var(--cursor-glow, 0);
      min-height: 315px;
      display: grid;
      grid-template-rows: auto 1fr auto;
      gap: 28px;
      padding: 24px;
      border-radius: var(--radius-md);
      background: rgba(9, 14, 15, 0.22);
      border: 1px solid rgba(238, 245, 242, 0.2);
      box-shadow:
        inset 0 1px 1px rgba(255, 255, 255, 0.26),
        inset 0 -1px 0 rgba(182, 255, 23, 0.07),
        0 24px 70px rgba(0, 0, 0, 0.34);
      overflow: hidden;
      position: relative;
    }

.case-card.reactive-panel::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 2;
      padding: 1px;
      border-radius: inherit;
      pointer-events: none;
      background:
        radial-gradient(circle var(--glint-size, 360px) at var(--border-x, 50%) var(--border-y, 0%), rgba(255, 255, 255, calc(var(--case-border-glow) * 0.72)), rgba(238, 246, 255, calc(var(--case-border-glow) * 0.34)) 24%, transparent 72%),
        radial-gradient(circle var(--glint-near-size, 180px) at var(--border-near-x, 100%) var(--border-near-y, 0%), rgba(182, 255, 23, calc(var(--case-border-glow) * 0.46)), transparent 76%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.34), rgba(238, 246, 255, 0.14) 34%, rgba(157, 132, 255, 0.14) 62%, rgba(182, 255, 23, 0.2));
      opacity: calc(0.54 + var(--case-border-glow) * 0.34);
      -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
      -webkit-mask-composite: xor;
      mask-composite: exclude;
    }

.case-card.reactive-panel {
      background: rgba(9, 14, 15, 0.22);
      background-clip: padding-box;
      backdrop-filter: none;
      -webkit-backdrop-filter: none;
    }

.case-card.reactive-panel::after {
      display: none;
    }

.case-card .chip-row,
    .case-card .btn {
      position: relative;
      z-index: 1;
      width: min(100%, var(--case-content-width));
    }

.case-card__media {
      position: absolute;
      inset: 0;
      z-index: 0;
      display: grid;
      min-width: 0;
      min-height: 0;
    }

.case-card > .case-card__media {
      position: absolute;
      inset: 0;
      z-index: 0;
    }

.case-card__media::after {
      content: "";
      position: absolute;
      inset: 0;
      background: rgba(3, 5, 6, 0.46);
      pointer-events: none;
    }

.case-card__media > img {
      width: 100%;
      height: 100%;
      display: block;
      object-fit: cover;
    }

.case-card__placeholder {
      display: grid;
      place-items: center;
      align-content: center;
      gap: 10px;
      padding: 24px;
      background: rgba(9, 14, 15, 0.34);
      color: rgba(246, 248, 243, 0.34);
      text-align: center;
    }

.case-card__placeholder .icon {
      --icon-size: 42px;
      color: currentColor;
    }

.case-card__placeholder span {
      font-size: 14px;
      line-height: 1.25;
    }

.case-card__content {
      width: min(100%, var(--case-content-width));
      align-self: center;
      position: relative;
      z-index: 1;
      display: grid;
      gap: 12px;
    }

.case-card--center {
      text-align: center;
    }

.case-card--center .chip-row,
    .case-card--center .case-card__content,
    .case-card--center .btn {
      justify-content: center;
      justify-items: center;
      justify-self: center;
    }

.case-card--left {
      --case-content-width: 70%;
      text-align: left;
    }

.case-card--left .chip-row,
    .case-card--left .case-card__content,
    .case-card--left .btn {
      justify-content: start;
      justify-self: start;
    }

.case-card .btn {
      width: fit-content;
      align-self: center;
    }

.case-card p {
      max-width: 440px;
      color: var(--muted);
      font-size: 15px;
      line-height: 1.45;
    }

.case-card--left p {
      max-width: 360px;
    }

.article-card {
      height: 100%;
      min-height: 530px;
      display: flex;
      flex-direction: column;
      gap: 18px;
      padding: 24px;
      border-radius: var(--radius-md);
      border: 1px solid rgba(238, 245, 242, 0.15);
      background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.018) 54%, rgba(182, 255, 23, 0.025)),
        rgba(9, 14, 15, 0.42);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 18px 54px rgba(0, 0, 0, 0.28);
      backdrop-filter: blur(16px) saturate(132%);
      -webkit-backdrop-filter: blur(16px) saturate(132%);
    }

.article-visual {
      position: relative;
      display: block;
      aspect-ratio: 16 / 9;
      min-height: 148px;
      margin: 0;
      border-radius: 17px;
      overflow: hidden;
      background:
        radial-gradient(circle at 100% 100%, rgba(182, 255, 23, 0.08), transparent 64%),
        rgba(9, 14, 15, 0.32);
      border: 1px dashed rgba(238, 245, 242, 0.24);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        inset 0 -1px 0 rgba(182, 255, 23, 0.04),
        0 20px 54px rgba(0, 0, 0, 0.2);
    }

.article-visual--contain {
      display: grid;
      place-items: center;
    }

.article-visual--contain > img {
      width: 100%;
      height: 100%;
      object-fit: contain;
      object-position: center center;
    }

.main-blog__grid .article-visual.article-visual--contain > img {
      object-fit: contain;
      object-position: center center;
    }

.article-visual .chip.date {
      position: absolute;
      top: 12px;
      left: 12px;
      z-index: 2;
    }

.article-visual__placeholder {
      width: 100%;
      height: 100%;
      display: grid;
      place-items: center;
      align-content: center;
      gap: 10px;
      padding: 24px;
      color: rgba(246, 248, 243, 0.34);
      text-align: center;
    }

.article-visual__placeholder .icon {
      --icon-size: 42px;
      color: currentColor;
    }

.article-visual__placeholder span {
      font-size: 13px;
      line-height: 1.25;
    }

.article-card h3 {
      margin-top: 0;
      display: -webkit-box;
      overflow: hidden;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
    }

.article-card p {
      margin-top: 0;
      color: var(--muted);
      font-size: 15px;
      line-height: 1.5;
      display: -webkit-box;
      overflow: hidden;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 3;
    }

.article-card > .btn,
    .article-card .btn-text {
      align-self: flex-start;
      margin-top: auto;
    }

.article-grid {
      align-items: stretch;
    }

.article-grid > .ui-kit-copy-shell {
      height: 100%;
    }

.article-grid > .ui-kit-copy-shell > .article-card {
      height: 100%;
    }

.form-panel {
      display: grid;
      gap: 14px;
      padding: 28px;
      border-radius: var(--radius-md);
    }

.field {
      position: relative;
      min-width: 0;
    }

.form-stack {
      display: grid;
      gap: 14px;
    }

.form-row {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 14px;
    }

.form-group {
      display: grid;
      gap: 8px;
      min-width: 0;
    }

.field-label {
      color: rgba(246, 248, 243, 0.92);
      font-size: 13px;
      font-weight: 600;
    }

.field-hint {
      color: var(--dim);
      font-size: 12px;
      line-height: 1.35;
    }

.field .icon {
      position: absolute;
      top: 50%;
      left: 18px;
      color: rgba(246, 248, 243, 0.68);
      transform: translateY(-50%);
    }

.field:has(textarea) .icon {
      top: 22px;
      transform: none;
    }

.field .select-arrow {
      left: auto;
      right: 18px;
      color: rgba(246, 248, 243, 0.92);
      pointer-events: none;
    }

.field input,
    .field select,
    .field textarea {
      width: 100%;
      border: 1px solid rgba(238, 245, 242, 0.16);
      border-radius: 16px;
      outline: 0;
      background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.015)),
        rgba(9, 14, 15, 0.32);
      color: var(--text);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.13);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      transition: border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
    }

.field select {
      height: var(--control-height);
      min-height: var(--control-height);
      padding: 0 62px 0 58px;
      appearance: none;
    }

.field input {
      height: var(--control-height);
      min-height: var(--control-height);
      padding: 0 18px 0 58px;
    }

.field textarea {
      min-height: 142px;
      resize: vertical;
      padding: 20px 56px 36px 58px;
    }

.field input::placeholder,
    .field textarea::placeholder {
      color: rgba(246, 248, 243, 0.56);
    }

.field input:focus,
    .field select:focus,
    .field textarea:focus {
      border-color: rgba(182, 255, 23, 0.58);
      background: rgba(182, 255, 23, 0.055);
      box-shadow: 0 0 0 4px rgba(182, 255, 23, 0.08);
    }

.field.is-error input,
    .field.is-error select,
    .field.is-error textarea {
      border-color: rgba(255, 107, 124, 0.7);
      background: rgba(255, 107, 124, 0.055);
      box-shadow: 0 0 0 4px rgba(255, 107, 124, 0.08);
    }

.field.is-success input,
    .field.is-success select,
    .field.is-success textarea {
      border-color: rgba(182, 255, 23, 0.62);
      background: rgba(182, 255, 23, 0.052);
    }

.field.is-disabled {
      opacity: 0.48;
      pointer-events: none;
    }

.counter {
      position: absolute;
      right: 18px;
      bottom: 16px;
      color: var(--muted);
      font-size: 13px;
    }

.form-note {
      display: flex;
      align-items: center;
      gap: 10px;
      color: var(--muted);
      font-size: 13px;
    }

.form-note .icon {
      color: var(--lime);
    }

.choice-line {
      display: flex;
      align-items: flex-start;
      gap: 12px;
      min-width: 0;
      padding: 13px 14px;
      border: 1px solid rgba(238, 245, 242, 0.14);
      border-radius: 16px;
      background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.014)),
        rgba(9, 14, 15, 0.34);
      color: var(--muted);
      line-height: 1.4;
    }

.choice-line input {
      width: 18px;
      height: 18px;
      margin: 1px 0 0;
      flex: 0 0 18px;
      accent-color: var(--lime);
    }

.choice-line strong {
      display: block;
      color: var(--text);
      font-size: 14px;
    }

.choice-line span {
      color: var(--muted);
      font-size: 12px;
    }

.choice-line a {
      color: var(--lime);
    }

.choice-line a:hover {
      text-shadow: 0 0 16px rgba(182, 255, 23, 0.34);
    }

.form-message {
      width: 100%;
      padding: 18px 22px;
      border: 1px solid rgba(238, 245, 242, 0.14);
      border-radius: 22px;
      background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.014)),
        rgba(9, 14, 15, 0.34);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.07),
        0 16px 36px rgba(0, 0, 0, 0.18);
      color: rgba(246, 248, 243, 0.9);
      font-size: 18px;
      font-weight: 500;
      line-height: 1.45;
    }

.form-message--success {
      border-color: rgba(182, 255, 23, 0.36);
      background:
        linear-gradient(145deg, rgba(182, 255, 23, 0.12), rgba(182, 255, 23, 0.035)),
        rgba(10, 18, 13, 0.62);
    }

.form-message--error {
      border-color: rgba(255, 107, 124, 0.45);
      background:
        linear-gradient(145deg, rgba(255, 107, 124, 0.12), rgba(255, 107, 124, 0.035)),
        rgba(18, 10, 13, 0.62);
      color: rgba(255, 201, 208, 0.96);
    }

.form-message--modal {
      text-align: left;
    }

.form-message__text {
      display: block;
    }

@media (max-width: 640px) {
      .form-message {
        padding: 15px 16px;
        border-radius: 18px;
        font-size: 15px;
      }
    }

.file-drop {
      min-height: 112px;
      display: grid;
      place-items: center;
      gap: 8px;
      padding: 20px;
      border: 1px dashed rgba(238, 245, 242, 0.24);
      border-radius: 18px;
      background:
        radial-gradient(circle at 100% 100%, rgba(182, 255, 23, 0.08), transparent 64%),
        rgba(9, 14, 15, 0.32);
      color: var(--muted);
      text-align: center;
    }

.file-drop .icon {
      color: var(--lime);
    }

.search-field .icon {
      left: auto;
      right: 18px;
    }

.search-field input {
      padding-left: 18px;
      padding-right: 56px;
    }

.subscribe {
      display: flex;
      gap: 10px;
    }

.subscribe .field {
      flex: 1;
    }

.subscribe .field input {
      padding-left: 18px;
    }

.stepper {
      display: grid;
      grid-template-columns: repeat(5, 1fr);
      gap: 0;
      margin-bottom: 24px;
    }

.step {
      position: relative;
      display: grid;
      gap: 9px;
      justify-items: center;
      color: var(--muted);
      font-size: 13px;
    }

.step::before {
      content: "";
      position: absolute;
      top: 19px;
      left: 0;
      width: 100%;
      height: 1px;
      background: rgba(255, 255, 255, 0.16);
      z-index: 0;
    }

.step:first-child::before {
      left: 50%;
      width: 50%;
    }

.step:last-child::before {
      width: 50%;
    }

.step-number {
      width: 39px;
      height: 39px;
      display: grid;
      place-items: center;
      border: 1px solid rgba(255, 255, 255, 0.22);
      border-radius: 50%;
      background: #111616;
      color: var(--muted);
      z-index: 1;
    }

.step.active {
      color: var(--text);
    }

.step.active .step-number {
      border-color: var(--lime);
      color: var(--lime);
      box-shadow: 0 0 24px rgba(182, 255, 23, 0.32);
    }

.choice-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 14px;
    }

.choice-card {
      min-height: 176px;
      display: grid;
      gap: 12px;
      place-items: center;
      padding: 20px 16px;
      border: 1px solid rgba(238, 245, 242, 0.16);
      border-radius: 18px;
      background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.014)),
        rgba(9, 14, 15, 0.36);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
      backdrop-filter: blur(14px) saturate(130%);
      -webkit-backdrop-filter: blur(14px) saturate(130%);
      text-align: center;
      color: var(--muted);
      position: relative;
    }

.choice-card strong {
      color: var(--text);
      font-size: 17px;
    }

.choice-card p {
      font-size: 13px;
      line-height: 1.35;
    }

.choice-card.selected {
      border-color: rgba(182, 255, 23, 0.84);
      background: rgba(182, 255, 23, 0.08);
      box-shadow: inset 0 0 40px rgba(182, 255, 23, 0.08);
    }

.check-dot {
      position: absolute;
      top: 12px;
      right: 12px;
      width: 26px;
      height: 26px;
      display: grid;
      place-items: center;
      border-radius: 50%;
      background: var(--lime);
      color: #172300;
    }

.check-dot .icon {
      display: none;
    }

.check-dot::before {
      content: "";
      width: 10px;
      height: 6px;
      border-left: 2.2px solid #071006;
      border-bottom: 2.2px solid #071006;
      transform: rotate(-45deg) translate(1px, -1px);
      transform-origin: center;
    }

.summary-card {
      min-height: 342px;
      display: grid;
      align-content: start;
      gap: 18px;
      padding: 28px;
      border-radius: var(--radius-md);
    }

.price-value {
      color: var(--lime);
      font-size: clamp(34px, 4vw, 52px);
      line-height: 1;
      font-weight: 600;
    }

.check-list {
      display: grid;
      gap: 13px;
      margin: 0;
      padding: 0;
      list-style: none;
    }

.check-list li {
      display: flex;
      gap: 11px;
      align-items: center;
      color: var(--muted);
      font-size: 14px;
    }

.check-list .icon {
      --icon-size: 18px;
      color: var(--lime);
    }

.faq {
      display: grid;
      gap: 12px;
    }

.faq-item {
      border: 1px solid rgba(255, 255, 255, 0.1);
      border-radius: 18px;
      background: rgba(255, 255, 255, 0.04);
      overflow: hidden;
      transition:
        border-color 260ms ease,
        box-shadow 260ms ease,
        background-color 260ms ease;
    }

.faq-question {
      width: 100%;
      min-height: 98px;
      display: grid;
      grid-template-columns: minmax(0, 1fr) 54px;
      align-items: start;
      column-gap: 18px;
      border: 0;
      padding: 22px;
      background: transparent;
      color: var(--text);
      text-align: left;
      font-size: 17px;
      font-weight: 600;
      transition:
        color 260ms ease,
        padding 320ms cubic-bezier(0.22, 1, 0.36, 1);
    }

.faq-question > span:first-child {
      align-self: center;
      min-width: 0;
    }

.faq-answer {
      max-height: 220px;
      padding: 0 22px 24px;
      color: var(--muted);
      line-height: 1.55;
      opacity: 1;
      transform: translateY(0);
      overflow: hidden;
      transition:
        max-height 420ms cubic-bezier(0.22, 1, 0.36, 1),
        padding 420ms cubic-bezier(0.22, 1, 0.36, 1),
        opacity 240ms ease,
        transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
    }

.faq-item:not(.open) .faq-answer {
      max-height: 0;
      padding-top: 0;
      padding-bottom: 0;
      opacity: 0;
      transform: translateY(-6px);
    }

.faq-question .btn {
      --btn-height: 54px;
      --btn-icon-size: 22px;
      align-self: start;
      justify-self: end;
      pointer-events: none;
      transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
    }

.faq-item.open {
      border-color: rgba(182, 255, 23, 0.6);
      box-shadow: inset 0 0 40px rgba(182, 255, 23, 0.055);
    }

.faq-item.open .faq-question {
      padding-bottom: 12px;
      color: var(--lime);
    }

.faq-item.open .faq-question .btn {
      transform: rotate(180deg);
    }

.contact-card {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      min-height: 84px;
      padding: 18px;
      border: 1px solid rgba(238, 245, 242, 0.15);
      border-radius: 18px;
      background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.065), rgba(255, 255, 255, 0.015)),
        rgba(9, 14, 15, 0.36);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
      backdrop-filter: blur(14px) saturate(130%);
      -webkit-backdrop-filter: blur(14px) saturate(130%);
    }

.contact-card.glass-animated {
      position: relative;
      overflow: hidden;
      isolation: isolate;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        0 0 30px rgba(107, 255, 214, calc(var(--cursor-glow, 0) * 0.07)),
        0 0 42px rgba(157, 132, 255, calc(var(--cursor-glow, 0) * 0.085)),
        0 0 54px rgba(182, 255, 23, calc(var(--cursor-glow, 0) * 0.11));
    }

.contact-card.glass-animated::before,
    .contact-card.glass-animated::after {
      content: "";
      position: absolute;
      inset: 0;
      border-radius: inherit;
      pointer-events: none;
    }

.contact-card.glass-animated::before {
      z-index: 2;
      padding: 1px;
      background:
        radial-gradient(circle var(--glint-size, 260px) at var(--border-x, 50%) var(--border-y, 0), rgba(255, 255, 255, calc(var(--border-glow, 0) * 0.82)), rgba(107, 255, 214, calc(var(--border-glow, 0) * 0.34)) 18%, rgba(182, 255, 23, calc(var(--border-glow, 0) * 0.28)) 48%, transparent 76%),
        radial-gradient(circle var(--glint-near-size, 150px) at var(--border-near-x, 100%) var(--border-near-y, 50%), rgba(182, 255, 23, calc(var(--border-glow, 0) * 0.58)), rgba(157, 132, 255, calc(var(--border-glow, 0) * 0.28)) 38%, transparent 76%),
        linear-gradient(135deg, rgba(107, 255, 214, calc(var(--border-glow, 0) * 0.32)), rgba(238, 245, 242, calc(var(--border-glow, 0) * 0.16)) 34%, rgba(157, 132, 255, calc(var(--border-glow, 0) * 0.3)) 62%, rgba(182, 255, 23, calc(var(--border-glow, 0) * 0.34)));
      -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
      -webkit-mask-composite: xor;
      mask-composite: exclude;
    }

.contact-card.glass-animated::after {
      z-index: 0;
      background:
        radial-gradient(circle var(--reveal-size, 240px) at var(--cursor-x, 50%) var(--cursor-y, 50%), rgba(107, 255, 214, calc(var(--cursor-glow, 0) * 0.18)), rgba(182, 255, 23, calc(var(--cursor-glow, 0) * 0.14)) 34%, transparent 74%),
        radial-gradient(460px 220px at calc(var(--cursor-x, 50%) + 120px) 100%, rgba(182, 255, 23, calc(var(--cursor-glow, 0) * 0.24)), transparent 72%),
        radial-gradient(420px 220px at calc(var(--cursor-x, 50%) - 90px) 0%, rgba(157, 132, 255, calc(var(--cursor-glow, 0) * 0.24)), transparent 74%),
        radial-gradient(340px 170px at 100% 50%, rgba(107, 255, 214, calc(var(--cursor-glow, 0) * 0.12)), transparent 70%),
        linear-gradient(110deg, transparent 0 28%, rgba(157, 132, 255, calc(var(--cursor-glow, 0) * 0.12)) 44%, rgba(182, 255, 23, calc(var(--cursor-glow, 0) * 0.11)) 54%, transparent 70%);
      mix-blend-mode: screen;
    }

.contact-card.glass-animated > * {
      position: relative;
      z-index: 1;
    }

.contact-main {
      display: flex;
      align-items: center;
      gap: 14px;
      min-width: 0;
    }

.contact-text,
    .contact-text strong,
    .contact-text span {
      display: block;
    }

.contact-text span {
      margin-top: 4px;
      color: var(--muted);
      font-size: 14px;
    }

.mini-cards {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 14px;
    }

.mini-card {
      min-height: 164px;
      padding: 22px;
      border: 1px solid rgba(238, 245, 242, 0.15);
      border-radius: 18px;
      background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.014)),
        rgba(9, 14, 15, 0.36);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
      backdrop-filter: blur(14px) saturate(130%);
      -webkit-backdrop-filter: blur(14px) saturate(130%);
    }

.mini-card strong {
      display: block;
      margin-top: 16px;
      font-size: 17px;
    }

.mini-card p {
      margin-top: 10px;
      color: var(--muted);
      font-size: 14px;
      line-height: 1.45;
    }

.modal {
      width: min(640px, 100%);
      padding: clamp(26px, 4vw, 46px);
      border-radius: var(--radius-lg);
    }

.modal-top {
      display: flex;
      justify-content: space-between;
      align-items: start;
      gap: 18px;
      margin-bottom: 24px;
    }

.modal h2 {
      margin-top: 20px;
      text-align: center;
    }

.modal p {
      max-width: 450px;
      margin: 18px auto 26px;
      color: var(--muted);
      text-align: center;
      line-height: 1.55;
    }

.pagination {
      display: flex;
      align-items: center;
      gap: 10px;
    }

.pagination-dot {
      width: 9px;
      height: 9px;
      border-radius: 50%;
      background: rgba(255, 255, 255, 0.24);
    }

.pagination-dot.active {
      background: var(--lime);
      box-shadow: 0 0 14px rgba(182, 255, 23, 0.72);
    }

.page-pagination {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      justify-content: center;
      gap: 10px;
    }

.page-pagination__item,
    .page-pagination__arrow {
      min-width: 42px;
      height: 42px;
      display: inline-grid;
      place-items: center;
      padding: 0 12px;
      border: 1px solid rgba(238, 245, 242, 0.14);
      border-radius: 14px;
      background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.018)),
        rgba(8, 13, 14, 0.68);
      color: rgba(246, 248, 243, 0.68);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 10px 26px rgba(0, 0, 0, 0.2);
      font-size: 14px;
      font-weight: 600;
      line-height: 1;
      text-decoration: none;
      transition:
        color 160ms linear,
        border-color 160ms linear,
        background 160ms linear,
        box-shadow 160ms linear;
    }

.page-pagination__arrow {
      color: var(--lime);
    }

.page-pagination__arrow .icon {
      --icon-size: 18px;
    }

.page-pagination__item:hover,
    .page-pagination__item:focus-visible,
    .page-pagination__arrow:hover,
    .page-pagination__arrow:focus-visible,
    .page-pagination__item.active {
      color: #101602;
      border-color: rgba(182, 255, 23, 0.48);
      background: linear-gradient(180deg, #c5ff35, #97ee08);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.46),
        0 0 24px rgba(182, 255, 23, 0.24);
      outline: none;
    }

.page-pagination__ellipsis {
      min-width: 30px;
      display: inline-grid;
      place-items: center;
      color: rgba(246, 248, 243, 0.42);
      font-weight: 600;
    }

.testimonial-section {
      position: relative;
      padding-top: clamp(64px, 8vw, 120px);
      padding-bottom: clamp(64px, 8vw, 116px);
      overflow: visible;
    }

.testimonial-section::before,
    .testimonial-section::after {
      content: "+";
      position: absolute;
      z-index: 0;
      color: rgba(182, 255, 23, 0.2);
      font-size: clamp(76px, 9vw, 130px);
      line-height: 1;
      font-weight: 700;
      text-shadow:
        0 0 18px rgba(182, 255, 23, 0.24),
        0 0 52px rgba(182, 255, 23, 0.16);
      pointer-events: none;
      transform: rotate(5deg);
    }

.testimonial-section::before {
      top: 18%;
      left: min(9vw, 120px);
    }

.testimonial-section::after {
      right: min(9vw, 120px);
      bottom: 20%;
      transform: rotate(-8deg);
    }

.testimonial-section > *:not(.testimonial-decor) {
      position: relative;
      z-index: 1;
    }

.testimonial-decor {
      position: absolute;
      inset: 0;
      z-index: 0;
      pointer-events: none;
      perspective: 900px;
      transform-style: preserve-3d;
      mix-blend-mode: screen;
      opacity: 1;
    }

.testimonial-decor > * {
      position: absolute;
      display: grid;
      place-items: center;
      transform-style: preserve-3d;
      will-change: transform;
    }

.testimonial-decor__plus::before,
    .testimonial-decor__glyph::before {
      line-height: 1;
      font-weight: 700;
      color: rgba(182, 255, 23, 0.2);
      text-shadow:
        0 0 18px rgba(182, 255, 23, 0.24),
        0 0 52px rgba(182, 255, 23, 0.16);
    }

.testimonial-decor__plus::after,
    .testimonial-decor__glyph::after {
      content: "";
      position: absolute;
      inset: -32%;
      z-index: -1;
      border-radius: 50%;
      background:
        radial-gradient(circle, rgba(182, 255, 23, 0.26), rgba(182, 255, 23, 0.1) 38%, transparent 68%);
      filter: blur(16px);
      opacity: 0.82;
    }

.testimonial-decor__plus::before {
      content: "+";
      font-size: clamp(54px, 5.8vw, 86px);
    }

.testimonial-decor__glyph::before {
      content: attr(data-glyph);
      font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
      font-size: clamp(38px, 4.4vw, 66px);
      letter-spacing: 0;
    }

.testimonial-decor__drop {
      width: clamp(64px, 6.4vw, 92px);
      aspect-ratio: 1;
      border-radius: 50%;
      border: 1px solid rgba(238, 245, 242, 0.2);
      background:
        radial-gradient(42% 34% at 32% 24%, rgba(255, 255, 255, 0.24), transparent 68%),
        radial-gradient(38% 28% at 28% 78%, rgba(182, 255, 23, 0.58), transparent 64%),
        radial-gradient(70% 84% at 70% 62%, rgba(182, 255, 23, 0.17), transparent 70%),
        linear-gradient(145deg, rgba(238, 245, 242, 0.1), rgba(157, 132, 255, 0.055) 58%, rgba(182, 255, 23, 0.052)),
        rgba(238, 245, 242, 0.05);
      box-shadow:
        inset 0 1px 22px rgba(255, 255, 255, 0.15),
        inset 0 -18px 34px rgba(182, 255, 23, 0.16),
        0 0 42px rgba(182, 255, 23, 0.16),
        0 0 96px rgba(182, 255, 23, 0.12);
      backdrop-filter: blur(3px) saturate(125%);
      -webkit-backdrop-filter: blur(3px) saturate(125%);
    }

.testimonial-decor__drop::after {
      content: "";
      position: absolute;
      inset: auto -18% -18% -18%;
      height: 46%;
      border-radius: 50%;
      background: radial-gradient(ellipse, rgba(182, 255, 23, 0.34), transparent 68%);
      filter: blur(18px);
      opacity: 0.78;
    }

.testimonial-decor__plus--one {
      top: 19%;
      left: 13%;
      transform: translateZ(-120px) rotateX(14deg) rotateY(-18deg) rotate(-7deg) scale(1);
      filter: blur(2px);
      opacity: 0.68;
    }

.testimonial-decor__plus--two {
      top: 18%;
      right: 13%;
      transform: translateZ(80px) rotateX(-8deg) rotateY(18deg) rotate(9deg) scale(0.95);
      opacity: 0.76;
      filter: blur(1px);
    }

.testimonial-decor__plus--three {
      left: 7%;
      bottom: 17%;
      transform: translateZ(130px) rotateX(12deg) rotateY(26deg) rotate(-5deg) scale(0.92);
      opacity: 0.62;
      filter: blur(1.4px);
    }

.testimonial-decor__plus--four {
      right: 8%;
      top: 36%;
      transform: translateZ(-220px) rotateX(-16deg) rotateY(-30deg) rotate(12deg) scale(0.86);
      opacity: 0.44;
      filter: blur(3.4px);
    }

.testimonial-decor__drop--one {
      top: 22%;
      left: 3%;
      transform: translateZ(150px) rotateX(8deg) rotateY(-22deg) rotate(-18deg);
      opacity: 0.72;
    }

.testimonial-decor__drop--two {
      right: 5%;
      bottom: 18%;
      transform: translateZ(90px) rotateX(-10deg) rotateY(24deg) rotate(20deg) scale(1);
      opacity: 0.58;
      filter: blur(1.4px);
    }

.testimonial-decor__drop--three {
      left: 24%;
      top: 44%;
      transform: translateZ(-240px) rotateX(22deg) rotateY(-28deg) rotate(34deg) scale(0.78);
      opacity: 0.34;
      filter: blur(5px);
    }

.testimonial-decor__glyph--terminal {
      left: 9%;
      top: 43%;
      transform: translateZ(-180px) rotateX(18deg) rotateY(-24deg) rotate(-9deg) scale(0.88);
      opacity: 0.44;
      filter: blur(2.6px);
    }

.testimonial-decor__glyph--hash-one {
      right: 22%;
      top: 12%;
      transform: translateZ(-80px) rotateX(-10deg) rotateY(18deg) rotate(13deg) scale(0.86);
      opacity: 0.46;
      filter: blur(2px);
    }

.testimonial-decor__glyph--hash-two {
      right: 11%;
      bottom: 34%;
      transform: translateZ(120px) rotateX(12deg) rotateY(24deg) rotate(-11deg) scale(0.84);
      opacity: 0.5;
      filter: blur(1.2px);
    }

.testimonial-section__head {
      display: grid;
      justify-items: center;
      gap: 18px;
      max-width: 720px;
      margin: 0 auto;
      text-align: center;
    }

.testimonial-section__head .eyebrow {
      justify-self: center;
      align-self: center;
    }

.testimonial-section__head h2 {
      margin: 0;
      font-size: var(--fs-h1);
      line-height: var(--lh-heading);
      font-weight: 600;
      text-wrap: balance;
    }

.testimonial-section__head p {
      max-width: 620px;
      margin: 0;
      color: rgba(246, 248, 243, 0.74);
      font-size: var(--fs-body-lg);
      line-height: 1.6;
      text-wrap: balance;
    }

.testimonial-slider__controls {
      position: absolute;
      top: clamp(168px, 15.4vw, 238px);
      right: clamp(0px, 5vw, 82px);
      z-index: 4;
      display: none;
      align-items: center;
      gap: 14px;
    }

.testimonial-slider-shell {
      --testimonial-slide-gap: clamp(10px, 1.4vw, 18px);
      --testimonial-arrow-size: clamp(58px, 6vw, 78px);
      --testimonial-arrow-outset: clamp(42px, 4.8vw, 74px);
      --testimonial-dots-block: 42px;
      --testimonial-viewport-height: clamp(412px, 33vw, 452px);
      position: relative;
      margin-top: clamp(28px, 4vw, 46px);
    }

.testimonial-slider {
      position: relative;
    }

.testimonial-slider__viewport {
      position: relative;
      width: 100%;
      height: var(--testimonial-viewport-height);
      margin: 0 auto;
    }

.testimonial-slider__track {
      min-width: 0;
    }

.testimonial-slider__track:not(.slick-initialized) {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: calc(var(--testimonial-slide-gap) * 2);
      height: 100%;
      overflow: hidden;
    }

.testimonial-slider .slick-list {
      height: 100%;
      overflow: hidden;
      padding-top: 28px;
      padding-bottom: 26px;
    }

.testimonial-slider .slick-track {
      height: 100%;
      display: flex;
      align-items: stretch;
      padding-top: 8px;
      padding-bottom: 8px;
    }

.testimonial-slider .slick-slide {
      height: auto;
    }

.testimonial-slider .slick-slide.testimonial-card {
      display: flex;
    }

.testimonial-slider .slick-slide:not(.testimonial-card) > div {
      height: 100%;
    }

.testimonial-card {
      --testimonial-card-cut: clamp(38px, 4.4vw, 64px);
      --testimonial-card-border: 1.5px;
      --testimonial-glare-pos: -42%;
      --testimonial-tilt-x: 0deg;
      --testimonial-tilt-y: 0deg;
      --btn-edge: rgba(238, 245, 242, 0.28);
      --btn-hover-glow: 0;
      --btn-light-x: 50%;
      --btn-light-y: 50%;
      position: relative;
      min-height: clamp(350px, 27vw, 390px);
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      gap: clamp(16px, 2vw, 24px);
      margin: 0 var(--testimonial-slide-gap);
      padding: clamp(24px, 2.7vw, 38px);
      overflow: hidden;
      isolation: isolate;
      border: 0;
      border-radius: 30px;
      clip-path: polygon(0 0, calc(100% - var(--testimonial-card-cut)) 0, 100% var(--testimonial-card-cut), 100% 100%, 0 100%);
      background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.4), rgba(238, 245, 242, 0.2) 38%, rgba(157, 132, 255, 0.24) 68%, rgba(255, 255, 255, 0.28));
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.24),
        inset 0 -1px 0 rgba(182, 255, 23, 0.08),
        0 24px 80px rgba(0, 0, 0, 0.36);
      backdrop-filter: blur(18px) saturate(134%);
      -webkit-backdrop-filter: blur(18px) saturate(134%);
      cursor: pointer;
      opacity: 1;
      transform: perspective(900px) rotateY(var(--testimonial-tilt-y)) rotateX(var(--testimonial-tilt-x));
      transform-origin: center center;
      transform-style: preserve-3d;
      will-change: transform;
      transition:
        --btn-hover-glow 220ms linear,
        opacity 260ms ease,
        transform 260ms ease,
        border-color 260ms ease,
        box-shadow 260ms ease;
    }

.testimonial-card:hover,
    .testimonial-card:focus-within {
      transition:
        --btn-hover-glow 120ms linear,
        opacity 260ms ease,
        border-color 260ms ease,
        box-shadow 260ms ease;
    }

.testimonial-card > * {
      position: relative;
      z-index: 1;
    }

.testimonial-card::before {
      content: "";
      position: absolute;
      inset: var(--testimonial-card-border);
      z-index: 0;
      border-radius: calc(30px - var(--testimonial-card-border));
      clip-path: polygon(0 0, calc(100% - calc(var(--testimonial-card-cut) - var(--testimonial-card-border))) 0, 100% calc(var(--testimonial-card-cut) - var(--testimonial-card-border)), 100% 100%, 0 100%);
      background:
        linear-gradient(110deg, transparent 0 31%, rgba(255, 255, 255, calc(var(--btn-hover-glow) * 0.18)) 47%, transparent 63%),
        radial-gradient(110% 90% at 100% 100%, rgba(157, 132, 255, 0.045), transparent 64%),
        radial-gradient(68% 44% at 100% 0%, rgba(182, 255, 23, 0.18), transparent 72%),
        radial-gradient(72% 92% at 88% 12%, rgba(230, 255, 196, 0.13), transparent 62%),
        radial-gradient(80% 92% at 12% 100%, rgba(157, 132, 255, 0.08), transparent 68%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.095), rgba(255, 255, 255, 0.025) 52%, rgba(182, 255, 23, 0.035)),
        rgba(9, 14, 15, 0.58);
      background-size:
        240% 240%,
        100% 100%,
        100% 100%,
        100% 100%,
        100% 100%,
        100% 100%,
        100% 100%;
      background-position:
        var(--testimonial-glare-pos) var(--testimonial-glare-pos),
        0% 0%,
        0% 0%,
        0% 0%,
        0% 0%,
        0% 0%,
        0% 0%;
      background-repeat: no-repeat;
      transition:
        background-position 180ms linear;
      pointer-events: none;
    }

.testimonial-card:hover::before,
    .testimonial-card:focus-within::before {
      transition: none;
    }

.testimonial-card__person {
      display: grid;
      grid-template-columns: auto 1fr;
      gap: 18px;
      align-items: center;
      min-width: 0;
    }

.testimonial-card__person > div {
      min-width: 0;
    }

.testimonial-card__person .iconbox {
      --icon-box-size: 64px;
      --icon-box-glyph-size: 30px;
      border-radius: 18px;
    }

.testimonial-card__avatar {
      display: block;
      width: 64px;
      height: 64px;
      border: 1px solid rgba(234, 255, 210, 0.24);
      border-radius: 50%;
      object-fit: cover;
      background: rgba(246, 248, 243, 0.08);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.26),
        0 14px 34px rgba(0, 0, 0, 0.28),
        0 0 26px rgba(166, 255, 0, 0.12);
      flex: 0 0 64px;
    }

.testimonial-card__person strong {
      display: block;
      color: var(--text);
      font-size: 18px;
      line-height: 1.18;
      font-weight: 600;
    }

.testimonial-card__person span {
      display: block;
      margin-top: 5px;
      color: rgba(246, 248, 243, 0.68);
      font-size: var(--fs-body-sm);
      line-height: 1.35;
    }

.testimonial-card__quote {
      display: grid;
      grid-template-columns: 36px minmax(0, 1fr);
      align-items: start;
      gap: 12px;
      margin: 0;
      height: calc(1em * 7.75);
      overflow: hidden;
      color: var(--text);
      font-size: clamp(13px, 1vw, 14px);
      line-height: 1.55;
    }

.testimonial-card__quote-icon {
      display: block;
      width: 30px;
      height: 30px;
      margin: 2px 0 0 2px;
      color: var(--lime);
      filter: drop-shadow(0 0 10px rgba(182, 255, 23, 0.42));
    }

.testimonial-card__quote span {
      display: -webkit-box;
      overflow: hidden;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 5;
    }

.testimonial-card__result {
      display: grid;
      box-sizing: border-box;
      grid-template-columns: auto auto 1fr;
      align-items: center;
      gap: 10px;
      height: 54px;
      min-height: 54px;
      padding: 8px 14px;
      overflow: hidden;
      border: 1px solid rgba(238, 245, 242, 0.14);
      border-radius: 999px;
      background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.018)),
        rgba(9, 14, 15, 0.44);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.13),
        0 14px 32px rgba(0, 0, 0, 0.22);
      color: rgba(246, 248, 243, 0.74);
      font-size: var(--fs-caption);
      line-height: 1.25;
      text-decoration: none;
    }

.testimonial-card__result:hover,
    .testimonial-card__result:focus-visible {
      border-color: rgba(182, 255, 23, 0.36);
      color: rgba(246, 248, 243, 0.9);
    }

.testimonial-card__result .icon {
      color: var(--lime);
      filter: drop-shadow(0 0 12px rgba(182, 255, 23, 0.34));
    }

.testimonial-card__result strong {
      color: var(--lime);
      font-size: clamp(22px, 2vw, 30px);
      line-height: 1;
      font-weight: 600;
      white-space: nowrap;
    }

.testimonial-slider__arrow {
      position: relative;
      z-index: 1;
      width: var(--testimonial-arrow-size);
      min-width: var(--testimonial-arrow-size);
      height: var(--testimonial-arrow-size);
      min-height: var(--testimonial-arrow-size);
      display: inline-grid;
      place-items: center;
      border: 1px solid rgba(238, 245, 242, 0.24);
      border-radius: 50%;
      background:
        radial-gradient(circle at 34% 24%, rgba(255, 255, 255, 0.14), transparent 58%),
        radial-gradient(circle at 78% 82%, rgba(157, 132, 255, 0.16), transparent 64%),
        linear-gradient(145deg, rgba(238, 245, 242, 0.095), rgba(238, 245, 242, 0.032)),
        rgba(12, 15, 17, 0.58);
      color: rgba(246, 248, 243, 0.94);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.18),
        inset 0 -1px 0 rgba(157, 132, 255, 0.1),
        0 18px 42px rgba(0, 0, 0, 0.32);
      backdrop-filter: blur(16px) saturate(130%);
      -webkit-backdrop-filter: blur(16px) saturate(130%);
      cursor: pointer;
      transform: none;
      transition:
        border-color 180ms ease,
        background 180ms ease,
        box-shadow 180ms ease,
        transform 180ms ease;
    }

.testimonial-slider__arrow:hover,
    .testimonial-slider__arrow:focus-visible {
      border-color: rgba(238, 245, 242, 0.42);
      background:
        radial-gradient(circle at 34% 24%, rgba(255, 255, 255, 0.2), transparent 58%),
        radial-gradient(circle at 78% 82%, rgba(157, 132, 255, 0.22), transparent 64%),
        linear-gradient(145deg, rgba(238, 245, 242, 0.13), rgba(238, 245, 242, 0.05)),
        rgba(16, 19, 22, 0.68);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.24),
        inset 0 -1px 0 rgba(157, 132, 255, 0.16),
        0 20px 48px rgba(0, 0, 0, 0.36),
        0 0 24px rgba(238, 245, 242, 0.08);
      transform: none;
      outline: none;
    }

.testimonial-slider__arrow .icon {
      --icon-size: 30px;
    }

.testimonial-slider__dots {
      min-height: 18px;
      margin-top: 24px;
      display: flex;
      justify-content: center;
    }

.testimonial-slider__dots .slick-dots {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 18px;
      margin: 0;
      padding: 0;
      list-style: none;
    }

.testimonial-slider__dots button {
      width: 11px;
      height: 11px;
      display: block;
      padding: 0;
      border: 0;
      border-radius: 50%;
      background: rgba(238, 245, 242, 0.34);
      color: transparent;
      font-size: 0;
      box-shadow: none;
      cursor: pointer;
      transition:
        background 180ms ease,
        box-shadow 180ms ease,
        transform 180ms ease;
    }

.testimonial-slider__dots .slick-active button {
      background: var(--lime);
      box-shadow: 0 0 16px rgba(182, 255, 23, 0.74);
      transform: scale(1.12);
    }

.testimonial-slider__cta {
      position: relative;
      width: min(760px, 100%);
      min-height: 86px;
      display: grid;
      grid-template-columns: auto 1fr auto;
      gap: 22px;
      align-items: center;
      margin: clamp(34px, 4vw, 54px) auto 0;
      padding: 12px 18px 12px 26px;
      border-radius: 999px;
      color: var(--text);
    }

.testimonial-slider__cta .iconbox {
      --icon-box-size: 58px;
      --icon-box-glyph-size: 28px;
      border-radius: 18px;
    }

.testimonial-slider__cta strong {
      font-size: clamp(18px, 2vw, 24px);
      line-height: 1.25;
      font-weight: 500;
    }

.testimonial-slider__cta .btn {
      --btn-height: 58px;
      width: 58px;
      min-width: 58px;
      padding: 0;
      border-radius: 50%;
    }

.footer {
      display: grid;
      grid-template-columns: repeat(5, minmax(0, 1fr));
      column-gap: clamp(22px, 2vw, 32px);
      row-gap: 0;
      align-items: start;
      margin-top: 56px;
      padding: 34px;
      border-radius: var(--radius-lg);
    }

.content-shell.footer {
      margin: 56px auto 0;
    }

.footer-seo {
      display: grid;
      grid-template-columns: minmax(0, 0.78fr) minmax(0, 1fr);
      gap: clamp(24px, 4vw, 58px);
      align-items: start;
      z-index: 1;
      margin: clamp(76px, 9vw, 132px) auto 0;
      padding: clamp(26px, 4vw, 46px);
      border-radius: var(--radius-lg);
      background:
        radial-gradient(circle at 10% 0%, rgba(255, 255, 255, 0.13), transparent 32%),
        radial-gradient(circle at 88% 20%, rgba(182, 255, 23, 0.14), transparent 34%),
        radial-gradient(circle at 42% 100%, rgba(157, 132, 255, 0.11), transparent 38%),
        rgba(9, 14, 15, 0.66);
    }

.footer-seo + .main-footer {
      margin-top: clamp(24px, 3vw, 38px);
    }

.footer-seo__head {
      display: grid;
      gap: 18px;
      min-width: 0;
    }

.footer-seo__head .chip {
      width: fit-content;
      justify-self: start;
    }

.footer-seo__head h2 {
      max-width: 620px;
      margin: 0;
      font-size: clamp(26px, 3.4vw, 42px);
      line-height: 1.12;
      font-weight: 600;
      letter-spacing: 0;
    }

.footer-seo__text {
      display: grid;
      gap: 16px;
      min-width: 0;
      color: rgba(246, 248, 243, 0.7);
      font-size: var(--fs-body);
      line-height: 1.68;
    }

.footer-seo__text p {
      margin: 0;
    }

.footer-seo__links {
      grid-column: 2;
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      margin-top: 4px;
    }

.footer-seo__links a {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      min-height: 38px;
      padding: 8px 14px;
      border: 1px solid rgba(238, 245, 242, 0.16);
      border-radius: 999px;
      background: rgba(255, 255, 255, 0.045);
      color: rgba(246, 248, 243, 0.78);
      font-size: var(--fs-body-sm);
      line-height: 1.2;
      transition:
        color 160ms linear,
        border-color 160ms linear,
        background 160ms linear;
    }

.footer-seo__links a:hover {
      border-color: rgba(182, 255, 23, 0.5);
      background: rgba(182, 255, 23, 0.09);
      color: var(--lime);
    }

.footer-seo__links .icon {
      --icon-size: 14px;
      color: var(--lime);
    }

.footer p {
      max-width: 330px;
      margin-top: 16px;
      color: var(--muted);
      line-height: 1.55;
    }

.main-footer__brand {
      grid-column: span 1;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      min-width: 0;
      min-height: 100%;
    }

.main-footer__brand-main {
      display: grid;
      gap: 16px;
      min-width: 0;
    }

.main-footer__brand-main p {
      margin-top: 0;
    }

.main-footer__menus {
      min-width: 0;
      display: contents;
    }

.main-footer::before,
    .main-footer::after {
      z-index: 0;
    }

.main-footer__brand,
    .main-footer__menus,
    .main-footer .footer-group {
      position: relative;
      z-index: 2;
    }

.footer-group {
      min-width: 0;
    }

.main-footer__copyright {
      position: relative;
      z-index: 1;
      display: block;
      width: min(1180px, calc(100% - 40px));
      max-width: none;
      margin: 16px auto 18px;
      color: rgba(157, 132, 255, 0.82);
      font-size: var(--fs-body-sm);
      font-weight: 300;
      line-height: 1.35;
      text-align: center;
    }

.footer-title {
      margin-bottom: 14px;
      font-weight: 600;
    }

.footer-links {
      display: grid;
      gap: 10px;
    }

.footer-links--split {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      align-items: start;
      column-gap: 14px;
      row-gap: 0;
    }

.footer-links__column {
      min-width: 0;
      display: grid;
      align-content: start;
      gap: 10px;
    }

.footer-links a {
      min-width: 0;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      color: rgba(246, 248, 243, 0.92);
      font-size: 14px;
      line-height: 1.32;
    }

.main-footer .footer-links a {
      color: rgba(246, 248, 243, 0.92);
    }

.footer-links a:hover {
      color: var(--lime);
    }

.footer-links .icon {
      --icon-size: 14px;
      flex: 0 0 auto;
      color: var(--lime);
    }

.main-footer__contacts {
      width: 100%;
      margin-top: clamp(18px, 2.4vw, 30px);
    }

.main-footer__contacts .footer-links {
      gap: 9px;
    }

.main-footer__contacts .footer-links a {
      justify-content: flex-start;
    }

.main-footer__contacts .footer-links a span {
      min-width: 0;
      display: inline-flex;
      align-items: center;
      gap: 8px;
    }

.main-footer__contacts .main-footer-icon {
      --icon-size: 18px;
      margin-right: 0;
    }

.brand-chip {
      display: flex;
      align-items: center;
      gap: 14px;
      min-height: 72px;
      padding: 14px 18px;
      border: 1px solid rgba(255, 255, 255, 0.11);
      border-radius: 20px;
      background: rgba(255, 255, 255, 0.04);
    }

.brand-chip small {
      display: block;
      margin-top: 2px;
      color: var(--muted);
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }

.content-shell {
      width: min(1180px, calc(100% - 40px));
      margin: 0 auto;
    }

.content-shell--narrow {
      width: min(840px, calc(100% - 40px));
    }

.content-grid {
      display: grid;
      gap: 18px;
    }

.content-grid--2 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

.content-grid--3 {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }

.content-grid--4 {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }

.content-grid--main-aside {
      grid-template-columns: minmax(0, 2fr) minmax(260px, 0.78fr);
    }

.content-grid--aside-main {
      grid-template-columns: minmax(260px, 0.78fr) minmax(0, 2fr);
    }

.glass,
    .reactive-panel {
      --glint-size: 210px;
      --glint-strength: 1;
      --glint-border: 1px;
      --border-x: 50%;
      --border-y: 0px;
      --border-near-x: 100%;
      --border-near-y: 50%;
      --border-glow: 0;
      --glint-near-size: 170px;
      --center-glow: 0;
      --inner-glow-x: 300px;
      --inner-glow-y: 190px;
      --reveal-size: 300px;
      --mask-center: 0.48;
      --mask-mid: 0.58;
      --mask-edge: 0.68;
      border: 1px solid var(--panel-line);
      background: var(--panel-bg);
      background-clip: padding-box;
      box-shadow:
        var(--panel-shadow),
        0 0 24px rgba(255, 255, 255, calc((var(--edge-top) + var(--edge-left)) * 0.026)),
        0 0 38px rgba(157, 132, 255, calc(var(--edge-bottom) * 0.066)),
        0 0 46px rgba(182, 255, 23, calc(var(--edge-right) * 0.06));
      backdrop-filter: var(--panel-blur);
      -webkit-backdrop-filter: var(--panel-blur);
    }

.glass::before,
    .reactive-panel::before {
      content: "";
      position: absolute;
      inset: 0;
      width: auto;
      height: auto;
      z-index: 2;
      padding: var(--glint-border);
      border: 0;
      border-radius: inherit;
      transform: none;
      pointer-events: none;
      background:
        radial-gradient(circle var(--glint-size) at var(--border-x) var(--border-y), rgba(255, 255, 255, calc(var(--border-glow) * 0.78 * var(--glint-strength))), rgba(232, 255, 182, calc(var(--border-glow) * 0.36 * var(--glint-strength))) 18%, rgba(188, 146, 255, calc(var(--border-glow) * 0.24 * var(--glint-strength))) 48%, transparent 74%),
        radial-gradient(circle var(--glint-near-size) at var(--border-near-x) var(--border-near-y), rgba(255, 255, 255, calc(var(--border-glow) * 0.52 * var(--glint-strength))), rgba(232, 255, 182, calc(var(--border-glow) * 0.22 * var(--glint-strength))) 20%, rgba(188, 146, 255, calc(var(--border-glow) * 0.17 * var(--glint-strength))) 50%, transparent 74%),
        radial-gradient(42% 220% at 0% 0%, rgba(255, 255, 255, 0.78), rgba(238, 246, 255, 0.36) 24%, transparent 68%),
        linear-gradient(to top, rgba(203, 170, 255, 0.48), rgba(157, 132, 255, 0.27) 10%, transparent 34%),
        linear-gradient(to left, rgba(220, 255, 154, 0.46), rgba(182, 255, 23, 0.27) 12%, transparent 36%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.36), rgba(255, 255, 255, 0.11) 28%, rgba(157, 132, 255, 0.17) 54%, rgba(182, 255, 23, 0.19) 82%, rgba(255, 255, 255, 0.32));
      opacity: calc(0.8 + var(--cursor-glow) * 0.2);
      -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
      -webkit-mask-composite: xor;
      mask-composite: exclude;
      transition: opacity 180ms linear;
    }

.glass::after,
    .reactive-panel::after {
      content: "";
      position: absolute;
      inset: 0;
      width: auto;
      height: auto;
      z-index: 0;
      border: 0;
      border-radius: inherit;
      transform: none;
      pointer-events: none;
      background:
        radial-gradient(circle var(--reveal-size) at var(--cursor-x) var(--cursor-y), rgba(3, 5, 6, var(--mask-center)) 0%, rgba(3, 5, 6, var(--mask-center)) 24%, rgba(3, 5, 6, var(--mask-mid)) 58%, rgba(3, 5, 6, var(--mask-edge)) 100%),
        linear-gradient(to bottom, rgba(245, 250, 255, 0.24), rgba(238, 246, 255, 0.105) 62px, transparent 220px),
        linear-gradient(to right, rgba(238, 246, 255, 0.17), rgba(238, 246, 255, 0.072) 66px, transparent 210px),
        linear-gradient(to left, rgba(182, 255, 23, 0.22), rgba(182, 255, 23, 0.092) 88px, transparent 260px),
        linear-gradient(to top, rgba(188, 146, 255, 0.23), rgba(157, 132, 255, 0.092) 96px, transparent 275px),
        radial-gradient(42% 24% at 8% 0%, rgba(255, 255, 255, 0.24), rgba(238, 246, 255, 0.092) 42%, transparent 78%),
        radial-gradient(46% 28% at 100% 74%, rgba(182, 255, 23, 0.2), rgba(182, 255, 23, 0.072) 44%, transparent 80%),
        radial-gradient(54% 30% at 48% 100%, rgba(188, 146, 255, 0.22), rgba(157, 132, 255, 0.078) 46%, transparent 82%);
      opacity: 1;
      mix-blend-mode: normal;
    }

.glass > *,
    .reactive-panel > * {
      position: relative;
      z-index: 1;
    }

.choice-card.selected {
      border-color: rgba(182, 255, 23, 0.72);
      box-shadow:
        var(--panel-shadow),
        inset 0 0 40px rgba(182, 255, 23, 0.08),
        0 0 34px rgba(182, 255, 23, 0.1);
    }

.faq-item.open.reactive-panel {
      border-color: rgba(182, 255, 23, 0.56);
      box-shadow:
        var(--panel-shadow),
        inset 0 0 40px rgba(182, 255, 23, 0.055),
        0 0 30px rgba(182, 255, 23, 0.08);
    }

@media (prefers-reduced-motion: reduce) {
  html {
          scroll-behavior: auto;
        }
  
  .btn,
        .btn::before,
        .btn::after,
        .btn > .icon,
        .testimonial-card,
        .testimonial-card::before,
        .tilt-glare-card,
        .tilt-glare-card::after {
          transition: none;
          animation: none;
        }
}

@media (max-width: 1060px) {
  :root {
          --fs-display: 52px;
          --fs-h1: 42px;
          --fs-h2: 34px;
          --fs-h3: 24px;
          --fs-h4: 20px;
          --fs-body-lg: 17px;
          --fs-body: 15px;
          --fs-body-sm: 13px;
          --fs-caption: 12px;
        }

  .testimonial-section__head h2 {
          font-size: var(--fs-h1);
        }
  
  .testimonial-slider__viewport {
          width: min(100%, calc(100vw - 32px));
        }

  .testimonial-slider__controls {
          position: relative;
          top: auto;
          right: auto;
          display: flex;
          justify-content: flex-end;
          margin-top: 18px;
        }
  
  .testimonial-slider__arrow--prev {
          left: 2px;
        }
  
  .testimonial-slider__arrow--next {
          right: 2px;
        }
  
  .topbar {
          grid-template-columns: auto minmax(0, 1fr) auto;
          align-items: center;
        }
  
  .nav,
        .site-header--desktop .site-header__nav {
          display: none;
        }

  .mega-menu {
          display: none;
        }
  
  .topbar .btn-primary,
        .site-header--desktop .btn-primary {
          display: none;
        }
  
  .topbar .header-burger,
        .site-header--desktop .header-burger {
          grid-column: 3;
          justify-self: end;
          display: inline-grid;
        }
  
  .grid-span-3-3-2 > :nth-child(n),
        .grid-span-3-3-2 > .ui-kit-copy-shell:nth-child(n) {
          grid-column: auto;
        }
  
  .grid.four {
          grid-template-columns: repeat(2, minmax(0, 1fr));
        }
  
  .content-grid--4 {
          grid-template-columns: repeat(2, minmax(0, 1fr));
        }

  .footer {
          grid-template-columns: 1fr;
        }

  .main-footer__menus {
          display: grid;
          grid-template-columns: repeat(2, minmax(0, 1fr));
        }

  .main-footer__menus > .footer-group:nth-child(n) {
          grid-column: auto;
        }

  .footer-seo {
          grid-template-columns: 1fr;
        }

  .footer-seo__links {
          grid-column: auto;
        }
  
  .content-grid--main-aside,
        .content-grid--aside-main {
          grid-template-columns: 1fr;
        }
  
  .choice-grid,
        .mini-cards {
          grid-template-columns: repeat(2, minmax(0, 1fr));
        }

  .grid.two:has(> .service-card),
        .grid.three:has(> .service-card),
        .grid.two:has(> .ui-kit-copy-shell > .service-card),
        .grid.three:has(> .ui-kit-copy-shell > .service-card) {
          grid-template-columns: repeat(2, minmax(0, 1fr));
        }
  
  .service-card h3,
        .case-card h3,
        .article-card h3 {
          font-size: 22px;
        }
  
  .service-card p,
        .case-card p,
        .article-card p {
          font-size: 14px;
        }

  .service-card--featured {
          grid-template-columns: 1fr;
          min-height: auto;
        }

  .service-card--compact.service-card {
          grid-template-columns: minmax(150px, 150px) minmax(0, 1fr);
          min-height: 0;
        }

  .service-card--featured .service-card__media {
          order: -1;
          width: 100%;
          aspect-ratio: 1 / 1;
          max-height: max-content;
        }

  .service-card--compact .service-card__media {
          order: -1;
          width: 100%;
          aspect-ratio: 1 / 1;
          max-height: max-content;
          justify-self: stretch;
        }

  .service-card--featured .service-card__media > img,
        .service-card--compact .service-card__media > img {
          max-width: 100%;
          max-height: 100%;
        }

  .service-card--compact .btn {
          display: inline-flex;
        }

  .filter-tabs {
          gap: 10px;
        }

  .filter-tab {
          flex: 0 1 auto;
          min-height: 36px;
          padding-inline: 14px;
          font-size: 12px;
        }

  .page-pagination {
          gap: 8px;
        }

  .page-pagination__item,
        .page-pagination__arrow {
          min-width: 38px;
          height: 38px;
          border-radius: 12px;
          font-size: 13px;
        }
}

@media (max-width: 720px) {
  :root {
          --fs-display: 38px;
          --fs-h1: 32px;
          --fs-h2: 27px;
          --fs-h3: 22px;
          --fs-h4: 19px;
          --fs-body-lg: 16px;
          --fs-body: 14px;
          --fs-body-sm: 12px;
          --fs-caption: 12px;
        }

  .testimonial-section {
          padding-top: 56px;
          padding-bottom: 62px;
        }
  
  .testimonial-section::before,
        .testimonial-section::after {
          opacity: 0.48;
        }
  
  .testimonial-section::before {
          top: 24%;
          left: -12px;
        }
  
  .testimonial-section::after {
          right: -10px;
          bottom: 25%;
        }
  
  .testimonial-section__head {
          justify-items: start;
          text-align: left;
        }
  
  .testimonial-section__head p {
          font-size: var(--fs-body);
        }

  .testimonial-slider__controls {
          position: relative;
          top: auto;
          right: auto;
          display: flex;
          justify-content: flex-end;
          margin-top: 18px;
        }
  
  .testimonial-slider-shell {
          --testimonial-slide-gap: 10px;
          --testimonial-viewport-height: 414px;
          margin-top: 26px;
        }

  .testimonial-slider .slick-list {
          padding-bottom: 10px;
        }

  .testimonial-slider .slick-track {
          padding-bottom: 0;
        }
  
  .testimonial-slider__track:not(.slick-initialized) {
          grid-template-columns: 1fr;
        }
  
  .testimonial-card {
          --testimonial-card-cut: 42px;
          min-height: 360px;
          margin: 0 var(--testimonial-slide-gap);
          transform: none;
        }
  
  .testimonial-card__quote {
          grid-template-columns: 34px minmax(0, 1fr);
          gap: 12px;
          height: calc(1em * 7.75);
          font-size: 14px;
        }

  .testimonial-card__quote-icon {
          width: 28px;
          height: 28px;
        }
  
  .testimonial-card__result {
          grid-template-columns: auto auto 1fr;
          border-radius: 22px;
        }
  
  .testimonial-card__result span {
          grid-column: auto;
        }
  
  .testimonial-slider__arrow {
          width: 52px;
          min-width: 52px;
          height: 52px;
          min-height: 52px;
        }
  
  .testimonial-slider__dots {
          margin-top: 8px;
          padding: 0 70px;
        }
  
  .testimonial-slider__cta {
          grid-template-columns: 44px minmax(0, 1fr) 44px;
          align-items: center;
          gap: 10px;
          justify-items: stretch;
          min-height: 74px;
          margin-top: 58px;
          border-radius: 26px;
          padding: 12px;
        }

  .testimonial-slider__cta .iconbox {
          --icon-box-size: 44px;
          --icon-box-glyph-size: 22px;
          border-radius: 14px;
        }

  .testimonial-slider__cta strong {
          min-width: 0;
          font-size: clamp(15px, 4.2vw, 18px);
          line-height: 1.18;
        }

  .testimonial-slider__cta .btn {
          --btn-height: 44px;
          width: 44px;
          min-width: 44px;
          height: 44px;
          min-height: 44px;
        }

  .main-testimonials .testimonial-slider-shell {
          --testimonial-viewport-height: 402px;
        }

  .main-testimonials .testimonial-slider .slick-list {
          padding-bottom: 4px;
        }

  .main-testimonials .testimonial-slider__arrow {
          bottom: -17px;
        }

  .main-testimonials .testimonial-slider__dots {
          margin-top: 6px;
        }
  
  .topbar {
          width: calc(100% + 24px);
          margin-top: -18px;
          margin-left: -12px;
          margin-right: -12px;
          padding: 16px;
          border-left: 0;
          border-right: 0;
          border-radius: 0 0 22px 22px;
        }
  
  .topbar.is-stuck {
          border-top-left-radius: 0;
          border-top-right-radius: 0;
          border-bottom-left-radius: 22px;
          border-bottom-right-radius: 22px;
        }
  
  .grid.four,
        .content-grid--2,
        .content-grid--3,
        .content-grid--4,
        .choice-grid,
        .mini-cards {
          grid-template-columns: 1fr;
        }

  .grid.two:has(> .service-card),
        .grid.three:has(> .service-card),
        .grid.two:has(> .ui-kit-copy-shell > .service-card),
        .grid.three:has(> .ui-kit-copy-shell > .service-card) {
          grid-template-columns: 1fr;
        }
  
  .grid-span-2-1 > :first-child,
        .grid-span-2-1 > .ui-kit-copy-shell:first-child {
          grid-column: auto;
        }
  
  .rich-table {
          display: block;
          overflow-x: auto;
        }
  
  .service-card--featured {
          grid-template-columns: 1fr;
          min-height: auto;
        }

  .service-card--compact.service-card {
          grid-template-columns: 1fr;
          min-height: 0;
        }

  .service-card--featured .service-card__media,
        .service-card--compact .service-card__media {
          order: -1;
          width: 100%;
          aspect-ratio: 1 / 1;
          max-height: max-content;
        }

  .service-card--featured .service-card__media > img,
        .service-card--compact .service-card__media > img {
          width: auto;
          height: auto;
          max-width: 100%;
          max-height: 100%;
          object-fit: contain;
          border-radius: 0;
        }
  
  .service-card--compact .service-card__media {
          justify-self: stretch;
        }

  .service-card__media {
          min-height: 0;
        }
  
  .stepper {
          overflow-x: auto;
          grid-template-columns: repeat(5, 120px);
          padding-bottom: 6px;
        }
  
  .subscribe {
          display: grid;
        }
}

@media (max-width: 680px) {
  .main-footer__menus,
        .footer-links--split {
          grid-template-columns: 1fr;
        }

  .footer-links--split {
          row-gap: 10px;
        }
}

/* End */


/* Start:/assets/main.css?178383537948175*/
/* Page-specific styles for index.html. */

body {
  --main-page-gutter: clamp(20px, 5vw, 76px);
  background: #020303;
}

body::before,
body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  transform: translate3d(0, 0, 0);
}

body::before {
  background: url("/assets/bg.webp") center center / cover no-repeat;
  filter: brightness(0.96);
}

body::after {
  background: rgba(1, 3, 4, 0.48);
}

.main-page,
.main-footer {
  position: relative;
  z-index: 1;
}

.main-page {
  --page-section-gap: var(--section-gap);
}

.main-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 30;
  width: min(1180px, calc(100% - var(--main-page-gutter) - var(--main-page-gutter)));
  margin: 0 auto;
  padding-top: 0;
  transform: none;
}

.main-header .topbar {
  width: 100%;
  margin: 0;
  border-top-color: rgba(3, 5, 6, 0.96);
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  box-shadow:
    inset 0 1px 0 rgba(3, 5, 6, 0.98),
    var(--panel-shadow),
    0 18px 64px rgba(0, 0, 0, 0.34);
}

.main-header .topbar::before {
  inset: 1px 0 0;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.main-header .topbar > .btn-primary {
  grid-column: 4;
  justify-self: end;
  margin-right: 0;
}

.mobile-menu {
  display: none;
}

@media (min-width: 1181px) {
  .mobile-menu :is(.bx-context-toolbar-empty-area, .bx-component-opener, .bx-context-toolbar) {
    display: none !important;
  }
}

.main-page {
  padding: 0;
}

.listing-page {
  padding-top: clamp(126px, 11vw, 162px);
}

.listing-page .main-blog {
  padding-top: 0;
}

.listing-page #cases.main-blog {
  padding-bottom: clamp(56px, 7vw, 104px);
}

.listing-hero {
  padding-bottom: clamp(56px, 7vw, 104px);
}

.listing-hero__panel {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(320px, 0.7fr);
  gap: clamp(28px, 5vw, 72px);
  align-items: stretch;
  padding: clamp(28px, 5vw, 56px);
  border-radius: var(--radius-lg);
}

.listing-hero__copy {
  display: grid;
  align-content: center;
  gap: 22px;
  min-width: 0;
}

.listing-hero__copy h1 {
  max-width: 820px;
  margin: 0;
  font-size: clamp(34px, 4vw, 58px);
}

.listing-hero__copy p {
  max-width: 700px;
  color: rgba(246, 248, 243, 0.72);
  font-size: var(--fs-body-lg);
  line-height: 1.55;
}

.listing-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 8px;
}

.listing-hero__facts {
  display: grid;
  gap: 14px;
  align-content: stretch;
}

.listing-hero__facts .mini-card {
  align-content: start;
}

.listing-hero__facts strong {
  display: block;
  margin-top: 16px;
  color: var(--text);
  font-size: 22px;
  line-height: 1.2;
  font-weight: 500;
}

.listing-hero__facts p {
  margin-top: 12px;
  color: rgba(246, 248, 243, 0.62);
  line-height: 1.5;
}

.main-page > .content-shell,
.main-footer {
  width: min(1180px, calc(100% - var(--main-page-gutter) - var(--main-page-gutter)));
}

.main-page > .content-shell {
  margin-top: 0;
  margin-bottom: 0;
}

.main-page > :is(.main-hero, .services-hero, .content-shell) + .content-shell {
  margin-top: var(--page-section-gap);
}

.breadcrumbs {
  position: absolute;
  top: clamp(75px, 20vw, 110px);
  left: 50%;
  z-index: 5;
  transform: translateX(-50%);
  padding-top: 0;
  color: rgba(246, 248, 243, 0.54);
  font-size: var(--fs-body-sm);
  line-height: 1.35;
}

.breadcrumbs__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.breadcrumbs__item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.breadcrumbs a,
.breadcrumbs [aria-current="page"] {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  max-width: 100%;
  padding: 7px 0;
  overflow: hidden;
  color: rgba(246, 248, 243, 0.72);
  text-decoration: none;
  line-height: 1.15;
  white-space: nowrap;
  text-overflow: ellipsis;
  transition: color 160ms linear;
}

.breadcrumbs a:hover,
.breadcrumbs a:focus-visible {
  color: var(--lime);
  outline: none;
}

.breadcrumbs .icon {
  --icon-size: 14px;
  flex: 0 0 var(--icon-size);
  color: rgba(182, 255, 23, 0.78);
  transform: translateY(1px);
}

.breadcrumbs [aria-current="page"] {
  color: var(--text);
}

.main-page > .breadcrumbs + .content-shell {
  margin-top: 0 !important;
}

.skeleton-main > .breadcrumbs + .skeleton-content {
  margin-top: clamp(18px, 2.5vw, 30px) !important;
}

.main-hero {
  width: 100%;
  min-width: 0;
}

@media (max-width: 640px) {
  .main-page {
    padding-top: 60px;
  }
}

.main-hero__panel {
  --hero-stage-width: min(100vw, 1720px);
  --hero-panel-min-height: 760px;
  --hero-title-size: clamp(38px, 4.25vw, 64px);
  --hero-lead-size: clamp(16px, 1.5vw, 22px);
  --hero-copy-offset: clamp(-78px, -5vw, -46px);
  position: relative;
  box-sizing: border-box;
  height: 100vh;
  min-height: 0;
  max-height: 900px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(118px, 8vw, 156px) var(--main-page-gutter) clamp(28px, 3.5vw, 58px);
  background: transparent;
  overflow: hidden;
}

.main-hero__content {
  position: relative;
  z-index: 4;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 26px;
  width: min(740px, 100%);
  margin: 0 auto;
  text-align: center;
  transform: translateY(var(--hero-copy-offset));
}

.main-hero__content::before {
  content: none;
}

.main-services,
.main-blog,
.main-testimonials {
  position: relative;
  overflow: hidden;
}

.testimonial-section.main-testimonials {
  padding-top: 0;
  padding-bottom: 0;
}

.main-services > *:not(.main-decor),
.main-blog > *:not(.main-decor),
.main-testimonials > *:not(.main-decor) {
  position: relative;
  z-index: 1;
}

.main-decor {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  perspective: 900px;
  transform-style: preserve-3d;
  mix-blend-mode: screen;
}

.main-decor > * {
  position: absolute;
  display: grid;
  place-items: center;
  transform-style: preserve-3d;
}

.main-decor__glyph {
  color: rgba(182, 255, 23, 0.28);
  font-size: clamp(52px, 5.6vw, 86px);
  line-height: 1;
  font-weight: 700;
  letter-spacing: 0;
  text-shadow:
    0 0 9px rgba(182, 255, 23, 0.24),
    0 0 27px rgba(182, 255, 23, 0.12);
  filter: blur(0.55px);
}

.main-decor__glyph::before {
  content: attr(data-glyph);
}

.main-decor__glyph::after {
  content: "";
  position: absolute;
  inset: -20%;
  z-index: -1;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(182, 255, 23, 0.12), rgba(182, 255, 23, 0.04) 42%, transparent 70%);
  filter: blur(9px);
  opacity: 0.48;
}

.main-decor__orb {
  width: clamp(64px, 6.4vw, 92px);
  aspect-ratio: 1;
  border-radius: 50%;
  border: 1px solid rgba(238, 245, 242, 0.18);
  background:
    radial-gradient(42% 34% at 32% 24%, rgba(255, 255, 255, 0.22), transparent 68%),
    radial-gradient(38% 28% at 28% 78%, rgba(182, 255, 23, 0.54), transparent 64%),
    radial-gradient(70% 84% at 70% 62%, rgba(182, 255, 23, 0.15), transparent 70%),
    rgba(238, 245, 242, 0.045);
  box-shadow:
    inset 0 1px 22px rgba(255, 255, 255, 0.13),
    inset 0 -18px 34px rgba(182, 255, 23, 0.14),
    0 0 42px rgba(182, 255, 23, 0.16);
  filter: blur(1px);
}

.main-decor__orb::after {
  content: "";
  position: absolute;
  inset: auto -18% -18% -18%;
  height: 46%;
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(182, 255, 23, 0.3), transparent 68%);
  filter: blur(20px);
  opacity: 0.76;
}

.main-decor__glyph--services-terminal {
  left: 1%;
  top: 66%;
  transform: translateZ(-35px) rotateX(3deg) rotateY(-3deg) rotate(-6deg) scale(0.58);
  opacity: 0.38;
  filter: blur(0.55px);
}

.main-decor__glyph--services-terminal::after {
  inset: -12%;
  filter: blur(6px);
  opacity: 0.32;
}

.main-decor__glyph--cases-hash {
  left: 3%;
  top: 34%;
  transform: translateZ(-50px) rotateX(5deg) rotateY(-5deg) rotate(-9deg) scale(0.62);
  opacity: 0.46;
  filter: blur(0.65px);
}

.main-decor__glyph--blog-hash {
  left: 5%;
  bottom: 6%;
  transform: translateZ(-40px) rotateX(4deg) rotateY(-5deg) rotate(8deg) scale(0.6);
  opacity: 0.44;
  filter: blur(0.62px);
}

.main-decor__glyph--blog-arrow {
  right: 4%;
  top: 10%;
  transform: translateZ(-60px) rotateX(-4deg) rotateY(5deg) rotate(-5deg) scale(0.66);
  opacity: 0.42;
  filter: blur(0.68px);
}

.main-hero h1 {
  max-width: 820px;
  margin: 0;
  font-size: var(--hero-title-size);
  line-height: 1.12;
  font-weight: 600;
  text-wrap: balance;
}

.main-hero__highlight {
  display: inline-block;
  padding: 0 0.18em 0.08em;
  border-radius: 0.22em;
  background: rgba(182, 255, 23, 0.08);
  box-shadow:
    0 0 30px rgba(182, 255, 23, 0.2),
    inset 0 -0.08em 0 rgba(182, 255, 23, 0.26);
}

.main-hero .lead {
  max-width: 720px;
  margin: 0;
  color: rgba(246, 248, 243, 0.72);
  font-size: var(--hero-lead-size);
  line-height: 1.48;
}

.main-services {
  padding: 0;
}

.main-services__head {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 24px;
  margin-bottom: 26px;
}

.main-services__head > div {
  display: grid;
  gap: clamp(18px, 2.2vw, 28px);
}

.main-services__head h2 {
  max-width: 760px;
  margin: 0;
}

.main-services__head p {
  max-width: 620px;
  margin: 0;
  color: var(--muted);
  font-size: var(--fs-body);
  line-height: 1.5;
}

.main-services__grid {
  scroll-margin-top: 126px;
}

.main-services__grid .service-card {
  min-width: 0;
}

.main-services__grid .service-card h3 {
  font-size: 27px;
}

.main-services__subhead {
  display: grid;
  gap: 14px;
  max-width: 760px;
  margin-top: clamp(32px, 5vw, 62px);
  margin-bottom: 20px;
}

.main-services__subhead h3 {
  margin: 0;
  font-size: clamp(27px, 3vw, 42px);
  line-height: var(--lh-heading);
  font-weight: 600;
}

.main-services__subhead p {
  max-width: 660px;
  margin: 0;
  color: var(--muted);
  font-size: var(--fs-body);
  line-height: 1.55;
}

.main-services__map {
  align-items: stretch;
}

.main-services__map .service-card {
  min-width: 0;
  min-height: 0;
}

.main-services__map .service-card h3 {
  font-size: clamp(20px, 1vw, 25px);
}

.main-services__map .service-card p {
  max-width: 270px;
}

.main-services__map .service-card__media {
  background:
    radial-gradient(circle at 60% 38%, rgba(182, 255, 23, 0.16), transparent 54%),
    rgba(6, 10, 11, 0.34);
}

.main-services__map .service-card__media > img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  border-radius: 0;
}

.home-system {
  display: grid;
  gap: 24px;
}

.home-system__head p {
  max-width: 780px;
  margin-top: 14px;
  color: var(--muted);
  font-size: var(--fs-body);
  line-height: 1.58;
}

.home-system__grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.home-system__grid .mini-card {
  min-height: 220px;
}

.home-system__grid .iconbox {
  --icon-box-size: 58px;
  --icon-box-glyph-size: 28px;
}

.home-faq {
  display: grid;
  gap: clamp(28px, 4vw, 52px);
}

.home-faq__head {
  display: grid;
  justify-items: center;
  gap: 16px;
  max-width: 920px;
  margin: 0 auto;
  text-align: center;
}

.home-faq__head .eyebrow {
  justify-self: center;
}

.home-faq__head h2 {
  max-width: 900px;
  margin: 0;
  font-size: clamp(34px, 4.8vw, 68px);
  line-height: 1.02;
  font-weight: 600;
  text-wrap: balance;
}

.home-faq__head p {
  max-width: 720px;
  margin: 0;
  color: var(--muted);
  font-size: var(--fs-body-lg);
  line-height: 1.55;
  text-wrap: balance;
}

.home-faq__panel {
  width: min(980px, 100%);
  margin: 0 auto;
}

.home-faq__list {
  gap: clamp(12px, 1.4vw, 18px);
}

.home-faq__list .faq-item {
  border-color: rgba(182, 255, 23, 0.18);
  background:
    radial-gradient(ellipse 32% 76% at 100% 100%, rgba(182, 255, 23, 0.055), transparent 70%),
    rgba(5, 8, 9, 0.62);
}

.home-faq__list .faq-item.open {
  border-color: rgba(182, 255, 23, 0.62);
  background:
    radial-gradient(ellipse 32% 72% at 100% 100%, rgba(182, 255, 23, 0.18), transparent 70%),
    linear-gradient(145deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.012)),
    rgba(5, 8, 9, 0.78);
}

.home-faq__list .faq-answer p {
  margin: 0;
}

.main-blog {
  padding-top: 0;
  padding-bottom: 0;
  scroll-margin-top: 126px;
}

#cases.main-blog {
  padding-bottom: 0;
}

.main-blog .article-grid {
  align-items: start;
}

.main-blog .article-card {
  height: auto;
  min-height: 0;
}

.main-blog__head {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 24px;
  margin-bottom: 26px;
}

.main-blog__head h2 {
  max-width: 760px;
  margin-top: 18px;
}

.main-blog__head .btn {
  flex: 0 0 auto;
}

.main-blog__cta--mobile {
  display: none;
}

.main-blog__grid .article-visual > img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: right top;
}

.case-mobile-slider-shell,
.blog-mobile-slider-shell {
  position: relative;
}

.case-mobile-slider__arrow,
.case-mobile-slider__dots,
.blog-mobile-slider__arrow,
.blog-mobile-slider__dots {
  display: none;
}

.main-hero__cta {
  position: absolute;
  z-index: 5;
  left: 50%;
  bottom: clamp(40px, 3.8vw, 62px);
  width: min(1180px, calc(100% - var(--main-page-gutter) - var(--main-page-gutter)));
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: clamp(24px, 4vw, 52px);
  align-items: center;
  padding: clamp(11px, 1.5vw, 14px) clamp(11px, 1.5vw, 17px);
  border-radius: var(--radius-lg);
  transform: translateX(-50%);
}

.main-hero .btn-primary {
  background: #b6ff17;
}

.main-hero .btn-primary::before,
.main-hero .btn-primary::after {
  content: none;
}

.main-hero__cta-copy {
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 6px 0 6px clamp(10px, 2vw, 20px);
}

.main-hero__cta-copy strong {
  position: relative;
  z-index: 1;
  color: #fff !important;
  font-size: clamp(15px, 1.4vw, 18px);
  line-height: 1.35;
  font-weight: 600;
}

.main-hero__cta-copy span {
  position: relative;
  z-index: 1;
  max-width: 680px;
  color: rgba(246, 248, 243, 0.68);
  font-size: clamp(13px, 1.15vw, 15px);
  line-height: 1.45;
}

.main-hero__cta .btn {
  justify-self: end;
  min-width: 220px;
  margin-left: clamp(14px, 2vw, 24px);
  white-space: nowrap;
}

.footer-contact {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 0.78fr);
  gap: clamp(34px, 6vw, 78px);
  align-items: start;
  margin-top: clamp(18px, 3vw, 42px);
  margin-bottom: clamp(18px, 3vw, 34px);
  padding: clamp(24px, 4vw, 48px) 0;
}

.footer-contact::before {
  content: none;
}

.footer-contact::after {
  content: none;
}

.footer-contact > * {
  position: relative;
  z-index: 1;
}

.footer-contact__copy {
  display: grid;
  align-content: start;
  gap: clamp(44px, 5vw, 74px);
  padding-top: clamp(6px, 1.2vw, 18px);
}

.footer-contact__intro {
  display: grid;
  gap: clamp(22px, 2.4vw, 34px);
}

.footer-contact__copy h2 {
  max-width: 640px;
  font-size: clamp(36px, 5vw, 72px);
  line-height: 1.08;
  font-weight: 600;
}

.footer-contact__copy p {
  max-width: 560px;
  color: var(--muted);
  font-size: clamp(17px, 1.5vw, 20px);
  line-height: 1.55;
}

.footer-contact__benefits {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(12px, 1.5vw, 16px);
}

.footer-contact__benefits .mini-card {
  min-height: 116px;
}

.footer-contact__benefit {
  display: grid;
  align-content: center;
}

.footer-contact__benefit-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 14px;
}

.footer-contact__benefit-head .iconbox {
  --icon-box-size: 58px;
  --icon-box-glyph-size: 28px;
  border-radius: 16px;
}

.footer-contact__benefit strong {
  margin-top: 0;
  font-size: clamp(17px, 1.45vw, 21px);
  line-height: 1.2;
}

.footer-contact__form {
  display: grid;
  align-content: start;
  gap: 22px;
  padding: clamp(24px, 3vw, 34px);
  border-radius: var(--radius-lg);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.014)),
    rgba(7, 10, 10, 0.48);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.12),
    0 0 44px rgba(182, 255, 23, 0.1),
    var(--shadow-panel);
}

.footer-contact__form.glass {
  border-color: rgba(182, 255, 23, 0.24);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.058), rgba(255, 255, 255, 0.015)),
    rgba(7, 10, 10, 0.5);
}

.footer-contact__form h3 {
  font-size: clamp(22px, 2vw, 28px);
  line-height: 1.18;
}

.footer-contact__form .eyebrow {
  width: fit-content;
}

.footer-contact__form .form-panel {
  padding: 0;
}

.footer-contact__form .field {
  position: relative;
  display: grid;
  grid-template-columns: 74px minmax(0, 1fr);
  align-items: stretch;
  min-height: 0;
  overflow: hidden;
  border: 1px solid rgba(238, 245, 242, 0.16);
  border-radius: 16px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.015)),
    rgba(9, 14, 15, 0.32);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.13);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.footer-contact__form .field::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 74px;
  width: 1px;
  background: rgba(238, 245, 242, 0.14);
  pointer-events: none;
}

.footer-contact__form .field .icon {
  position: static;
  align-self: center;
  justify-self: center;
  width: 24px;
  min-width: 24px;
  height: 24px;
  min-height: 0;
  margin-top: 0;
  padding: 0;
  color: rgba(246, 248, 243, 0.42);
  transform: none;
}

.footer-contact__form .field:has(input) {
  height: var(--control-height);
}

.footer-contact__form .field:has(textarea) .icon {
  align-self: start;
  margin-top: 24px;
}

.footer-contact__form .field input,
.footer-contact__form .field textarea {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.footer-contact__form .field input {
  padding: 0 22px;
}

.footer-contact__form .field textarea {
  padding: 22px 56px 36px 22px;
}

.footer-contact__form .field:focus-within {
  border-color: rgba(182, 255, 23, 0.58);
  background: rgba(182, 255, 23, 0.055);
  box-shadow: 0 0 0 4px rgba(182, 255, 23, 0.08);
}

.footer-contact__form .field:focus-within .icon {
  color: var(--lime);
}

.form-captcha {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.form-captcha__challenge {
  display: grid;
  grid-template-columns: minmax(126px, 180px) minmax(0, 1fr);
  gap: 12px;
  align-items: stretch;
  min-width: 0;
}

.form-captcha__image {
  display: grid;
  place-items: center;
  min-width: 0;
  min-height: var(--control-height);
  overflow: hidden;
  border: 1px solid rgba(238, 245, 242, 0.16);
  border-radius: 16px;
  background: rgba(246, 248, 243, 0.88);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
}

.form-captcha__image img {
  display: block;
  max-width: 100%;
  height: auto;
}

.footer-contact__form .form-captcha__field {
  height: var(--control-height);
}

.footer-contact__form .btn {
  width: 100%;
}

.contact-channel-label {
  color: rgba(246, 248, 243, 0.46);
  font-size: 15px;
  line-height: 1.25;
  font-weight: 400;
}

.contact-channel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) repeat(3, auto);
  align-items: center;
  gap: 14px;
}

.contact-channel__option {
  position: relative;
  display: inline-flex;
  min-width: 0;
  cursor: pointer;
}

.contact-channel__option input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.contact-channel__control {
  --contact-plate-size: 74px;
  --plate-rim-1: #aeb8b4;
  --plate-rim-2: #7d8985;
  --plate-rim-3: #58635f;
  --plate-rim-4: #7d8985;
  --plate-rim-5: #aeb8b4;
  --plate-rim-glow-1: #aeb8b4;
  --plate-rim-glow-2: #7d8985;
  --plate-rim-opacity-1: .46;
  --plate-rim-opacity-2: .36;
  --plate-rim-opacity-3: .26;
  --plate-rim-opacity-4: .34;
  --plate-rim-opacity-5: .42;
  --plate-rim-glow-opacity-1: .06;
  --plate-rim-glow-opacity-2: .04;
  --plate-inner-rim-color: #aeb8b4;
  --plate-inner-rim-opacity: .16;
  position: relative;
  display: inline-grid;
  place-items: center;
  color: rgba(246, 248, 243, 0.72);
  transition: color 160ms ease, transform 160ms ease;
}

.contact-channel__radio {
  position: absolute;
  top: 5px;
  left: 5px;
  z-index: 2;
  width: 16px;
  height: 16px;
  border: 1px solid rgba(238, 245, 242, 0.34);
  border-radius: 50%;
  background: rgba(7, 11, 12, 0.42);
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.28);
  opacity: 0;
  pointer-events: none;
  transition: border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
}

.contact-channel__radio::after {
  content: "";
  display: block;
  width: 7px;
  height: 7px;
  margin: 3.5px;
  border-radius: 50%;
  background: var(--lime);
  opacity: 0;
  transform: scale(0.55);
  transition: opacity 160ms ease, transform 160ms ease;
}

.contact-channel__icon {
  position: relative;
  z-index: 1;
  width: var(--contact-plate-size);
  height: var(--contact-plate-size);
  display: grid;
  place-items: center;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  transition: transform 160ms ease;
}

.contact-channel__plate,
.contact-channel__plate > use {
  --plate-rim-1: inherit;
  --plate-rim-2: inherit;
  --plate-rim-3: inherit;
  --plate-rim-4: inherit;
  --plate-rim-5: inherit;
  --plate-rim-glow-1: inherit;
  --plate-rim-glow-2: inherit;
  --plate-corner-rim-color: inherit;
  --plate-corner-rim-opacity-1: inherit;
  --plate-corner-rim-opacity-2: inherit;
  --plate-corner-rim-opacity-3: inherit;
  --plate-rim-opacity-1: inherit;
  --plate-rim-opacity-2: inherit;
  --plate-rim-opacity-3: inherit;
  --plate-rim-opacity-4: inherit;
  --plate-rim-opacity-5: inherit;
  --plate-rim-glow-opacity-1: inherit;
  --plate-rim-glow-opacity-2: inherit;
  --plate-inner-rim-color: inherit;
  --plate-inner-rim-opacity: inherit;
}

.contact-channel__plate {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  transition: opacity 180ms ease;
}

.contact-channel__plate--on {
  opacity: 0;
}

.contact-channel__icon img {
  width: 30px;
  height: 30px;
  display: block;
  object-fit: contain;
  position: relative;
  z-index: 1;
  transform: translate(-2px, -1px);
}

.contact-channel__icon .icon {
  --icon-size: 30px;
  color: var(--lime);
  position: relative;
  z-index: 1;
  transform: translate(-2px, -1px);
  filter: drop-shadow(0 3px 5px rgba(0, 0, 0, 0.44));
}

.contact-channel__icon--max img {
  width: 34px;
  height: 34px;
  transform: translate(-3px, -1px);
}

.contact-channel__control::after {
  content: attr(data-tooltip);
  position: absolute;
  left: calc(50% + 14px);
  bottom: calc(100% + 10px);
  z-index: 4;
  padding: 7px 10px;
  border: 1px solid rgba(238, 245, 242, 0.14);
  border-radius: 10px;
  background: rgba(8, 10, 12, 0.92);
  color: var(--text);
  font-size: 12px;
  line-height: 1;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, 6px);
  transition: opacity 160ms ease, transform 160ms ease;
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.34);
}

.contact-channel__control::before {
  content: "";
  position: absolute;
  left: calc(50% + 14px);
  bottom: calc(100% + 4px);
  z-index: 4;
  width: 9px;
  height: 9px;
  background: rgba(8, 10, 12, 0.92);
  border-right: 1px solid rgba(238, 245, 242, 0.14);
  border-bottom: 1px solid rgba(238, 245, 242, 0.14);
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, 6px) rotate(45deg);
  transition: opacity 160ms ease, transform 160ms ease;
}

.contact-channel__option:hover .contact-channel__control::before,
.contact-channel__option:hover .contact-channel__control::after,
.contact-channel__option input:focus-visible + .contact-channel__control::before,
.contact-channel__option input:focus-visible + .contact-channel__control::after {
  opacity: 1;
  transform: translate(-50%, 0) rotate(45deg);
}

.contact-channel__option:hover .contact-channel__control::after,
.contact-channel__option input:focus-visible + .contact-channel__control::after {
  transform: translate(-50%, 0);
}

.contact-channel__option input:checked + .contact-channel__control {
  --plate-rim-1: #b6ff17;
  --plate-rim-2: #8fe812;
  --plate-rim-3: #b6ff17;
  --plate-rim-4: #8fe812;
  --plate-rim-5: #b6ff17;
  --plate-rim-glow-1: #8fe812;
  --plate-rim-glow-2: #b6ff17;
  --plate-rim-opacity-1: .74;
  --plate-rim-opacity-2: .68;
  --plate-rim-opacity-3: .54;
  --plate-rim-opacity-4: .62;
  --plate-rim-opacity-5: .7;
  --plate-rim-glow-opacity-1: .18;
  --plate-rim-glow-opacity-2: .14;
  --plate-inner-rim-color: #b6ff17;
  --plate-inner-rim-opacity: .18;
  color: var(--text);
}

.contact-channel__option input:checked + .contact-channel__control .contact-channel__radio {
  border-color: rgba(182, 255, 23, 0.72);
  background: rgba(182, 255, 23, 0.12);
  box-shadow: 0 0 18px rgba(182, 255, 23, 0.16);
}

.contact-channel__option input:checked + .contact-channel__control .contact-channel__radio::after {
  opacity: 1;
  transform: scale(1);
}

.contact-channel__option input:checked + .contact-channel__control .contact-channel__plate--off {
  opacity: 0;
}

.contact-channel__option input:checked + .contact-channel__control .contact-channel__plate--on {
  opacity: 1;
}

.contact-channel__option:hover .contact-channel__icon {
  transform: translateY(-1px);
}

.contact-channel__option input:focus-visible + .contact-channel__control .contact-channel__icon {
  outline: 2px solid rgba(182, 255, 23, 0.62);
  outline-offset: 3px;
}

.footer-contact .choice-line a {
  color: var(--lime);
}

.footer-contact .choice-line > span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.footer-contact .choice-line a:hover {
  text-shadow: 0 0 16px rgba(182, 255, 23, 0.34);
}

body.project-modal-open {
  position: fixed;
  width: 100%;
  overflow: hidden;
  overscroll-behavior: none;
}

.project-modal {
  position: fixed;
  inset: 0;
  z-index: 120;
  display: grid;
  place-items: center;
  padding: clamp(16px, 4vw, 48px);
  overflow-y: auto;
  background:
    radial-gradient(circle at 64% 58%, rgba(182, 255, 23, 0.16), transparent 28rem),
    rgba(0, 0, 0, 0.72);
  backdrop-filter: blur(14px) saturate(120%);
  -webkit-backdrop-filter: blur(14px) saturate(120%);
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transition: opacity 220ms ease, visibility 220ms ease;
}

.project-modal.is-open {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}

.project-modal__dialog {
  position: relative;
  width: min(470px, 100%);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  transform: translateY(18px) scale(0.98);
  transition: transform 260ms cubic-bezier(0.16, 1, 0.3, 1);
}

.project-modal.is-open .project-modal__dialog {
  transform: translateY(0) scale(1);
}

.project-modal__dialog::before {
  content: none;
}

.project-modal__dialog > * {
  position: relative;
  z-index: 1;
}

.project-modal__close {
  --icon-size: 24px;
  position: absolute;
  top: 18px;
  right: 18px;
  z-index: 2;
  width: 48px;
  min-width: 48px;
  height: 48px;
  display: inline-grid;
  place-items: center;
  border: 1px solid rgba(238, 245, 242, 0.18);
  border-radius: 50%;
  background: rgba(238, 245, 242, 0.08);
  color: var(--text);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.18),
    0 16px 34px rgba(0, 0, 0, 0.34);
  transition: border-color 160ms ease, color 160ms ease, box-shadow 160ms ease;
}

.project-modal__close:hover {
  border-color: rgba(182, 255, 23, 0.42);
  color: var(--lime);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.18),
    0 0 24px rgba(182, 255, 23, 0.14);
}

.project-modal__form.footer-contact__form {
  width: 100%;
  gap: 16px;
  margin: 0 auto;
  padding: clamp(20px, 3vw, 28px);
}

.project-modal__form .eyebrow {
  width: fit-content;
  margin: 6px auto 0;
}

.project-modal__title {
  max-width: 430px;
  margin: 0 auto;
  padding: 0 44px;
  font-size: clamp(30px, 3.4vw, 38px);
  line-height: 1.1;
  text-align: center;
}

.project-modal__lead {
  max-width: 410px;
  margin: -2px auto 4px;
  color: rgba(246, 248, 243, 0.84);
  font-size: 16px;
  line-height: 1.55;
  text-align: center;
}

.project-modal__form .form-panel {
  gap: 12px;
  padding: 0;
}

.project-modal__form .field {
  grid-template-columns: 64px minmax(0, 1fr);
}

.project-modal__form .field::before {
  left: 64px;
}

.project-modal__form .field input {
  height: 52px;
  min-height: 52px;
}

.project-modal__form .field textarea {
  min-height: 118px;
  padding-top: 18px;
}

.project-modal__form .field:has(textarea) .icon {
  margin-top: 21px;
}

.project-modal__form .contact-channel {
  gap: 10px;
}

.project-modal__form .contact-channel-label span {
  display: block;
}

.project-modal__form .contact-channel__icon {
  width: 56px;
  height: 56px;
}

.project-modal__form .choice-line a {
  color: var(--lime);
}

.project-modal__form .choice-line a:hover {
  text-shadow: 0 0 16px rgba(182, 255, 23, 0.34);
}

@media (max-width: 640px) {
  .project-modal {
    align-items: end;
    padding: 12px;
  }

  .project-modal__dialog {
    max-height: calc(100svh - 24px);
    width: 100%;
  }

  .project-modal__close {
    top: 12px;
    right: 12px;
    width: 42px;
    min-width: 42px;
    height: 42px;
  }

  .project-modal__form.footer-contact__form {
    gap: 16px;
    padding: 18px 14px 16px;
  }

  .project-modal__title {
    padding: 0 44px;
    font-size: 30px;
  }

  .project-modal__lead {
    margin-bottom: 0;
    font-size: 15px;
  }

  .project-modal__form .contact-channel {
    grid-template-columns: repeat(3, 1fr);
  }

  .project-modal__form .contact-channel-label {
    grid-column: 1 / -1;
  }

  .project-modal__form .contact-channel__icon {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .project-modal,
  .project-modal__dialog {
    transition: none;
  }
}

@media (min-width: 1181px) {
  .footer-contact {
    align-items: stretch;
  }

  .footer-contact__copy {
    min-height: 100%;
    grid-template-rows: auto minmax(0, 1fr) auto;
    gap: 0;
  }

  .footer-contact__intro {
    display: contents;
  }

  .footer-contact__copy h2 {
    align-self: start;
  }

  .footer-contact__copy p {
    align-self: center;
  }

  .footer-contact__benefits {
    align-self: end;
  }

  .main-hero__cta {
    bottom: clamp(28px, 3.2vw, 46px);
    width: min(960px, calc(100% - var(--main-page-gutter) - var(--main-page-gutter)));
    grid-template-columns: minmax(0, 1fr) auto;
    gap: clamp(20px, 3vw, 34px);
    padding: 10px 14px;
  }

  .main-hero__cta-copy {
    gap: 8px;
  }

  .main-hero__cta-copy strong {
    font-size: clamp(15px, 1.4vw, 18px);
  }

  .main-hero__cta-copy span {
    max-width: 560px;
    font-size: clamp(13px, 1.15vw, 15px);
  }

  .main-hero__cta .btn {
    min-width: 220px;
    font-size: 16px;
  }

  .main-services__grid .service-card--featured {
    padding: clamp(25px, 3vw, 25px);
    overflow: hidden;
  }

  .main-services,
  .main-services__grid {
    overflow: visible;
  }

  .main-services__grid .service-card__media > img {
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    object-fit: cover;
    border-radius: 0;
    object-position: top;
  }
}

.main-footer {
  margin-top: 0;
}

.main-footer-icon {
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
}

@media (max-width: 1180px) {
  .service-card p,
  .main-services__grid .service-card h3 {
    max-width: 100%;
  }

  .footer-contact {
    grid-template-columns: 1fr;
  }

  .footer-contact__copy {
    align-content: start;
  }

  .main-hero__panel {
    --hero-panel-min-height: 720px;
    --hero-title-size: clamp(34px, 5.4vw, 58px);
    --hero-lead-size: clamp(15px, 1.9vw, 19px);
    --hero-copy-offset: clamp(-58px, -4.8vw, -28px);
  }

  .main-hero__cta {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .main-hero__cta .btn {
    grid-column: 1 / -1;
    width: 100%;
  }

  .main-decor__glyph {
    font-size: clamp(44px, 7vw, 70px);
  }

  .main-decor__glyph--cases-hash {
    top: 40%;
  }

}

@media (max-width: 1060px) {
  .grid.main-services__grid,
  .grid.main-services__map {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .main-services__grid .service-card--featured {
    grid-template-columns: 1fr;
  }

  .main-services__map .service-card--compact.service-card {
    grid-template-columns: minmax(150px, 150px) minmax(0, 1fr);
  }

  .main-services__grid .service-card__media,
  .main-services__map .service-card__media {
    aspect-ratio: 1 / 1;
    max-height: max-content;
  }

  .main-services__grid .service-card__media > img,
  .main-services__map .service-card__media > img {
    max-width: 100%;
    max-height: 100%;
  }
}

@media (max-width: 780px) {
  .listing-page {
    padding-top: 104px;
  }

  .listing-hero__panel {
    grid-template-columns: 1fr;
    padding: 24px;
  }

  .listing-hero__actions .btn {
    width: 100%;
  }

  .footer-contact {
    gap: 26px;
    padding: 22px 0;
  }

  .footer-contact__copy h2 {
    font-size: clamp(32px, 10vw, 46px);
  }

  .footer-contact__benefits {
    grid-template-columns: 1fr;
  }

  .footer-contact__benefits .mini-card {
    min-height: 0;
  }

  .footer-contact__form {
    padding: 20px;
    border-radius: 24px;
  }

  .footer-contact__form .field {
    grid-template-columns: 52px minmax(0, 1fr);
  }

  .footer-contact__form .field::before {
    left: 52px;
  }

  .footer-contact__form .field .icon {
    width: 20px;
    min-width: 20px;
    height: 20px;
  }

  .footer-contact__form .field:has(textarea) .icon {
    margin-top: 22px;
  }

  .footer-contact__form .field input {
    padding: 0 16px;
  }

  .footer-contact__form .field textarea {
    padding: 20px 48px 34px 16px;
  }

  .contact-channel {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
  }

  .contact-channel-label {
    grid-column: 1 / -1;
  }

  .contact-channel__option {
    width: 100%;
  }

  .contact-channel__control,
  .contact-channel__icon {
    width: 100%;
  }

  body::after {
    background: rgba(1, 3, 4, 0.54);
  }

  .main-page,
  .main-footer {
    position: relative;
    z-index: 1;
  }

  .main-footer {
    width: min(1180px, calc(100% - var(--main-page-gutter) - var(--main-page-gutter)));
    margin-right: 0;
    margin-left: 0;
    padding-right: 14px;
    padding-left: 14px;
  }

  body.mobile-menu-open {
    position: fixed;
    width: 100%;
    overflow: hidden;
    overscroll-behavior: none;
  }

  .mobile-menu {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: block;
    padding: 0;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    clip-path: circle(0 at calc(100% - 38px) 36px);
    transition:
      clip-path 620ms cubic-bezier(0.16, 1, 0.3, 1),
      opacity 260ms ease,
      visibility 0s linear 620ms;
  }

  .mobile-menu.is-open {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
    clip-path: circle(150% at calc(100% - 38px) 36px);
    transition:
      clip-path 720ms cubic-bezier(0.16, 1, 0.3, 1),
      opacity 180ms ease,
      visibility 0s linear 0s;
  }

  .mobile-menu::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
      radial-gradient(circle at 88% 10%, rgba(182, 255, 23, 0.22), transparent 34%),
      radial-gradient(circle at 10% 72%, rgba(157, 132, 255, 0.16), transparent 38%),
      linear-gradient(180deg, rgba(3, 5, 6, 0.74), rgba(3, 5, 6, 0.94));
  }

  .mobile-menu::after {
    content: "";
    position: absolute;
    inset: -20%;
    opacity: 0.38;
    background:
      linear-gradient(rgba(182, 255, 23, 0.08) 1px, transparent 1px),
      linear-gradient(90deg, rgba(238, 245, 242, 0.055) 1px, transparent 1px);
    background-size: 42px 42px;
    transform: perspective(500px) rotateX(62deg) translateY(10%);
    transform-origin: center bottom;
    pointer-events: none;
  }

  .mobile-menu__shell {
    position: relative;
    z-index: 1;
    --glint-border: 0px;
    --panel-bg: var(--mobile-digital-bg);
    --panel-blur: none;
    min-height: 100vh;
    min-height: 100dvh;
    display: grid;
    grid-template-rows: auto 1fr auto;
    gap: 24px;
    overflow: hidden;
    padding: 18px;
    border: 0;
    border-radius: 0;
    background: var(--panel-bg);
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    transform: translateY(-12px) scale(0.98) rotateX(5deg);
    transform-origin: top right;
    transition: transform 520ms cubic-bezier(0.16, 1, 0.3, 1);
  }

  .mobile-menu__shell.glass::before {
    display: none;
  }

  .mobile-menu__shell.glass::after {
    opacity: 0.72;
    background:
      linear-gradient(rgba(182, 255, 23, 0.07) 1px, transparent 1px),
      linear-gradient(90deg, rgba(238, 245, 242, 0.045) 1px, transparent 1px);
    background-size: 42px 42px;
  }

  .mobile-menu.is-open .mobile-menu__shell {
    transform: translateY(0) scale(1) rotateX(0);
  }

  .mobile-menu__top,
  .mobile-menu__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
  }

  .mobile-menu__top {
    min-height: 52px;
  }

  .mobile-menu__top .logo-image {
    width: 112px;
  }

  .mobile-menu__close {
    --icon-size: 24px;
    width: 48px;
    min-width: 48px;
    height: 48px;
    display: inline-grid;
    place-items: center;
    border: 0;
    border-radius: 50%;
    background: rgba(238, 245, 242, 0.08);
    color: var(--text);
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.18),
      0 0 24px rgba(182, 255, 23, 0.08);
  }

  .mobile-menu__nav {
    display: grid;
    align-content: start;
    gap: 10px;
    overflow-y: auto;
    padding: 6px 0 14px;
    overscroll-behavior: contain;
  }

  .mobile-menu__group {
    border-bottom: 1px solid rgba(238, 245, 242, 0.12);
    opacity: 0;
    transform: translateY(18px) rotateX(-8deg);
    transition:
      opacity 360ms ease,
      transform 520ms cubic-bezier(0.16, 1, 0.3, 1);
  }

  .mobile-menu.is-open .mobile-menu__group {
    opacity: 1;
    transform: translateY(0) rotateX(0);
  }

  .mobile-menu.is-open .mobile-menu__group:nth-child(1) {
    transition-delay: 110ms;
  }

  .mobile-menu.is-open .mobile-menu__group:nth-child(2) {
    transition-delay: 160ms;
  }

  .mobile-menu.is-open .mobile-menu__group:nth-child(3) {
    transition-delay: 210ms;
  }

  .mobile-menu.is-open .mobile-menu__group:nth-child(4) {
    transition-delay: 260ms;
  }

  .mobile-menu.is-open .mobile-menu__group:nth-child(5) {
    transition-delay: 310ms;
  }

  .mobile-menu__row {
    width: 100%;
    min-height: 58px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 16px;
    padding: 12px 0;
  }

  .mobile-menu__link {
    display: block;
    min-width: 0;
    color: var(--text);
    font-size: 25px;
    line-height: 1.12;
    font-weight: 500;
  }

  .mobile-menu__link.active {
    color: var(--lime);
  }

  .mobile-menu__toggle {
    --icon-size: 24px;
    width: 44px;
    height: 44px;
    display: inline-grid;
    place-items: center;
    border: 0;
    border-radius: 50%;
    background: #020707;
    color: var(--lime);
    font: inherit;
    box-shadow: inset 0 0 0 1px rgba(182, 255, 23, 0.2);
  }

  .mobile-menu__toggle .icon {
    transform: rotate(90deg);
    transition: transform 220ms ease;
  }

  .mobile-menu__group.is-open .mobile-menu__toggle .icon {
    transform: rotate(-90deg);
  }

  .mobile-menu__submenu {
    display: grid;
    gap: 2px;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transform: translateY(-6px);
    transition:
      max-height 320ms ease,
      opacity 220ms ease,
      transform 260ms ease;
  }

  .mobile-menu__group.is-open .mobile-menu__submenu {
    max-height: 520px;
    opacity: 1;
    transform: translateY(0);
  }

  .mobile-menu__submenu a {
    display: block;
    padding: 0 0 12px 2px;
    color: rgba(246, 248, 243, 0.68);
    font-size: 15px;
    line-height: 1.35;
  }

  .mobile-menu__badge {
    width: fit-content;
    margin: 8px 0 8px 2px;
    padding: 5px 9px;
    border: 1px solid rgba(182, 255, 23, 0.18);
    border-radius: 999px;
    color: var(--lime);
    background: rgba(182, 255, 23, 0.08);
    font-size: 12px;
    line-height: 1;
    font-weight: 600;
  }

  .mobile-menu__badge:first-child {
    margin-top: 2px;
  }

  .mobile-menu__footer {
    align-items: stretch;
    flex-direction: column;
    opacity: 0;
    transform: translateY(18px);
    transition:
      opacity 360ms ease 310ms,
      transform 520ms cubic-bezier(0.16, 1, 0.3, 1) 310ms;
  }

  .mobile-menu.is-open .mobile-menu__footer {
    opacity: 1;
    transform: translateY(0);
  }

  .mobile-menu__cta {
    width: 100%;
    justify-content: center;
  }

  .mobile-menu__socials {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
  }

  .mobile-menu__socials a {
    min-height: 48px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(238, 245, 242, 0.15);
    border-radius: 16px;
    background: rgba(238, 245, 242, 0.055);
    color: var(--lime);
  }

  .mobile-menu__socials .icon {
    --icon-size: 22px;
  }

  @media (prefers-reduced-motion: reduce) {
    .mobile-menu,
    .mobile-menu__shell,
    .mobile-menu__group,
    .mobile-menu__submenu,
    .mobile-menu__footer,
    .mobile-menu__toggle .icon {
      transition: none;
    }
  }

  .main-header {
    top: 0;
    width: 100%;
    margin: 0;
    padding-top: 0;
  }

  .main-header .topbar {
    min-height: 70px;
    grid-template-columns: auto minmax(0, 1fr) auto;
    width: 100%;
    margin: 0;
    padding: 10px 14px;
    border-left: 1px solid var(--glass-edge);
    border-right: 1px solid var(--glass-edge);
    border-bottom-left-radius: 22px;
    border-bottom-right-radius: 22px;
  }

  .main-header .logo-image {
    width: 94px;
  }

  .main-header .header-burger {
    --icon-size: 21px;
    grid-column: 3;
    justify-self: end;
    width: 48px;
    min-width: 48px;
    height: 48px;
    min-height: 48px;
    border-radius: 14px;
  }

  .main-header .topbar > .btn-primary {
    margin-right: 0;
  }

  .main-hero__panel {
    --hero-title-size: clamp(28px, 8.6vw, 42px);
    --hero-lead-size: clamp(14px, 4.5vw, 18px);
    --hero-copy-offset: 0px;
    --mobile-browser-bar-height: 70px;
    isolation: isolate;
    height: auto;
    min-height: calc(100vh - var(--mobile-browser-bar-height));
    max-height: none;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    align-items: stretch;
    gap: 34px;
    padding: 112px 18px 28px;
    background: transparent;
  }

  @supports (height: 100svh) {
    .main-hero__panel {
      min-height: 100svh;
    }
  }

  @supports (height: 100dvh) {
    .main-hero__panel {
      min-height: 100dvh;
    }
  }

  .main-hero__panel::before {
    content: none;
  }

  .main-hero__panel::after {
    content: none;
  }

  .main-hero__content {
    position: relative;
    z-index: 3;
    align-self: stretch;
    justify-content: center;
    padding-bottom: 0;
    transform: none;
  }

  .main-hero h1 {
    font-size: var(--hero-title-size);
  }

  .main-hero__cta {
    position: relative;
    z-index: 3;
    align-self: end;
    left: auto;
    bottom: auto;
    width: 100%;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 16px 14px;
    justify-items: stretch;
    margin: 0;
    transform: none;
  }

  .main-hero__cta-copy {
    align-self: center;
    gap: 8px;
    display: grid;
    padding: 0;
  }

  .main-hero__cta-copy strong {
    align-self: center;
    color: #fff !important;
    font-weight: 600;
  }

  .main-hero__cta-copy span {
    display: -webkit-box;
    max-width: none;
    overflow: hidden;
    color: rgba(246, 248, 243, 0.78);
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  .main-hero__cta .btn {
    grid-column: 1 / -1;
    width: 100%;
    min-width: 0;
  }

  .main-decor__glyph {
    font-size: clamp(34px, 14vw, 52px);
  }

  .main-decor__glyph--services-terminal {
    left: 4%;
    top: 72%;
    bottom: auto;
  }

  .main-decor__glyph--cases-hash {
    left: 5%;
    top: 44%;
  }

  .main-decor__glyph--blog-hash {
    left: 8%;
    bottom: 4%;
  }

  .main-decor__glyph--blog-arrow {
    right: 8%;
    top: 8%;
  }

  .main-services__head {
    display: grid;
    align-items: start;
  }

  .home-system__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .main-blog__head {
    display: grid;
    align-items: start;
  }

  .main-blog__head .btn {
    width: 100%;
  }
}

@media (max-width: 760px) {
  .main-services {
    padding-top: 20px;
    padding-right: 0;
    padding-left: 0;
  }

  .grid.main-services__grid,
  .grid.main-services__map,
  .grid.main-blog__grid {
    grid-template-columns: 1fr;
  }

  .main-services__map .service-card--compact.service-card {
    grid-template-columns: 1fr;
  }

  .home-system__grid {
    grid-template-columns: 1fr;
  }

  .case-mobile-slider-shell,
  .blog-mobile-slider-shell {
    --article-slide-gap: 10px;
    --testimonial-arrow-size: 52px;
    --testimonial-dots-block: 42px;
    margin-top: 0;
  }

  .case-mobile-slider__viewport,
  .blog-mobile-slider__viewport {
    position: relative;
    width: min(100%, calc(100vw - var(--main-page-gutter) - var(--main-page-gutter)));
    margin: 0 auto;
  }

  .case-mobile-slider .main-blog__grid.slick-initialized,
  .blog-mobile-slider .main-blog__grid.slick-initialized {
    display: block;
  }

  .case-mobile-slider .slick-list,
  .blog-mobile-slider .slick-list {
    overflow: hidden;
  }

  .case-mobile-slider .slick-track,
  .blog-mobile-slider .slick-track {
    display: flex;
    align-items: flex-start;
  }

  .case-mobile-slider .slick-slide,
  .blog-mobile-slider .slick-slide {
    height: auto;
  }

  .case-mobile-slider .article-card,
  .blog-mobile-slider .article-card {
    height: auto;
    min-height: auto;
  }

  .case-mobile-slider .slick-slide.article-card,
  .blog-mobile-slider .slick-slide.article-card {
    display: flex;
    margin: 0 var(--article-slide-gap);
  }

  .case-mobile-slider .slick-slide:not(.article-card) > div,
  .blog-mobile-slider .slick-slide:not(.article-card) > div {
    height: auto;
  }

  .case-mobile-slider .article-card > .btn {
    display: none;
  }

  .case-mobile-slider-shell.case-mobile-slider--ready .case-mobile-slider__arrow,
  .blog-mobile-slider-shell.blog-mobile-slider--ready .blog-mobile-slider__arrow {
    display: inline-grid;
    top: auto;
    bottom: -10px;
    width: var(--testimonial-arrow-size);
    min-width: var(--testimonial-arrow-size);
    height: var(--testimonial-arrow-size);
    min-height: var(--testimonial-arrow-size);
    transform: none;
  }

  .case-mobile-slider-shell.case-mobile-slider--ready .case-mobile-slider__arrow:hover,
  .case-mobile-slider-shell.case-mobile-slider--ready .case-mobile-slider__arrow:focus-visible,
  .blog-mobile-slider-shell.blog-mobile-slider--ready .blog-mobile-slider__arrow:hover,
  .blog-mobile-slider-shell.blog-mobile-slider--ready .blog-mobile-slider__arrow:focus-visible {
    transform: none;
  }

  .case-mobile-slider__arrow--prev,
  .blog-mobile-slider__arrow--prev {
    left: 0;
  }

  .case-mobile-slider__arrow--next,
  .blog-mobile-slider__arrow--next {
    right: 0;
  }

  .case-mobile-slider-shell.case-mobile-slider--ready .case-mobile-slider__dots,
  .blog-mobile-slider-shell.blog-mobile-slider--ready .blog-mobile-slider__dots {
    min-height: 18px;
    margin-top: 38px;
    padding: 0 70px;
    display: flex;
    justify-content: center;
  }

  .case-mobile-slider-shell + .main-blog__cta--mobile,
  .blog-mobile-slider-shell + .main-blog__cta--mobile {
    margin-top: 26px;
  }

  .main-blog__head .main-blog__cta--head {
    display: none;
  }

  .main-blog__cta--mobile {
    display: inline-flex;
    width: 100%;
    justify-content: center;
    margin-top: 18px;
  }

  .main-services__grid .service-card h3 {
    font-size: clamp(26px, 9vw, 34px);
  }
}

/* End */


/* Start:/assets/privacy-consent.css?17838075281456*/
.privacy-consent {
  position: fixed;
  right: max(18px, env(safe-area-inset-right));
  bottom: max(18px, env(safe-area-inset-bottom));
  left: max(18px, env(safe-area-inset-left));
  z-index: 120;
  display: flex;
  justify-content: center;
  pointer-events: none;
}

.privacy-consent[hidden] {
  display: none !important;
}

.privacy-consent__panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  width: min(920px, 100%);
  padding: 18px 20px;
  border-radius: 26px;
  pointer-events: auto;
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.42), 0 0 34px rgba(182, 255, 23, 0.1);
}

.privacy-consent__text {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.privacy-consent__text strong {
  color: var(--text);
  font-size: var(--fs-body);
  font-weight: 600;
  line-height: 1.25;
}

.privacy-consent__text span {
  color: var(--muted);
  font-size: var(--fs-body-sm);
  line-height: 1.45;
}

.privacy-consent__text a {
  color: var(--lime);
  text-decoration: none;
}

.privacy-consent__text a:hover {
  color: var(--lime-strong);
}

.privacy-consent__button {
  min-width: 132px;
  white-space: nowrap;
}

@media (max-width: 720px) {
  .privacy-consent {
    right: 12px;
    bottom: max(12px, env(safe-area-inset-bottom));
    left: 12px;
  }

  .privacy-consent__panel {
    grid-template-columns: 1fr;
    padding: 16px;
    border-radius: 22px;
  }

  .privacy-consent__button {
    width: 100%;
  }
}

/* End */


/* Start:/assets/blog.css?178390469415142*/
/* Page-specific styles for blog.php and blog.html. */

html {
  scroll-padding-top: 110px;
}

body {
  overflow-x: hidden;
}

body.blog-body {
  --blog-breadcrumb-offset: clamp(96px, 7vw, 124px);
  --blog-content-width: 1180px;
}

.blog-page {
  display: grid;
  gap: clamp(8px, 1.4vw, 14px);
  padding: 0;
}

.blog-page > .content-shell {
  width: min(1180px, calc(100% - var(--main-page-gutter) - var(--main-page-gutter)));
}

.blog-page > .blog-hero {
  width: 100%;
}

.blog-section-page {
  --blog-section-hero-gap: clamp(28px, 3vw, 44px);
  gap: 0;
}

.blog-section-page > .breadcrumbs {
  position: relative;
  top: auto;
  left: auto;
  width: min(var(--blog-content-width), calc(100% - var(--main-page-gutter) - var(--main-page-gutter)));
  margin: var(--blog-breadcrumb-offset) auto 0;
  transform: none;
}

.blog-hero {
  position: relative;
  box-sizing: border-box;
  height: auto;
  min-height: 0;
  max-height: none;
  display: grid;
  align-items: center;
  justify-items: center;
  gap: clamp(28px, 3.8vw, 56px);
  padding: clamp(106px, 7.2vw, 136px) var(--main-page-gutter) clamp(44px, 5vw, 78px);
  border: 0;
  border-radius: 0;
  background: transparent;
  overflow: hidden;
  isolation: isolate;
}

.blog-section-page > .blog-hero {
  gap: var(--blog-section-hero-gap);
  padding-top: clamp(54px, 5vw, 82px);
  padding-bottom: 0;
}

.blog-section-page > .breadcrumbs + .blog-hero {
  padding-top: clamp(34px, 4vw, 56px);
}

.main-page.blog-section-page > .blog-hero + .content-shell.blog-listing {
  margin-top: var(--blog-section-hero-gap);
  padding-top: 0;
}

.blog-hero__main {
  position: relative;
  z-index: 3;
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(360px, 0.9fr);
  align-items: center;
  gap: clamp(36px, 5.5vw, 82px);
  width: min(1180px, 100%);
}

.blog-hero__copy {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 26px;
  width: 100%;
  margin: 0;
  min-width: 0;
  text-align: left;
  transform: none;
}

.blog-hero h1 {
  max-width: 660px;
  margin: 0;
  font-size: clamp(38px, 4.25vw, 64px);
  line-height: 1.12;
  font-weight: 600;
  text-wrap: balance;
}

.blog-hero .lead {
  max-width: 620px;
  margin: 0;
  color: rgba(246, 248, 243, 0.76);
  font-size: clamp(16px, 1.5vw, 22px);
  line-height: 1.48;
}

.blog-hero__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 14px;
  margin-top: 4px;
}

.blog-hero__actions .btn {
  white-space: nowrap;
}

.blog-hero__media {
  position: relative;
  width: min(100%, 560px);
  aspect-ratio: 1.08 / 1;
  margin: 0;
  border: 1px solid rgba(238, 245, 242, 0.16);
  border-radius: 32px;
  background: rgba(13, 15, 18, 0.48);
  overflow: hidden;
}

.blog-hero__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 53% center;
}

.blog-hero--plain .blog-hero__main {
  grid-template-columns: minmax(0, 780px);
  justify-content: center;
  justify-items: center;
}

.blog-hero--plain .blog-hero__copy {
  align-items: center;
  text-align: center;
}

.blog-hero--plain h1,
.blog-hero--plain .lead {
  margin-right: auto;
  margin-left: auto;
}

.blog-hero--plain .blog-hero__actions {
  justify-content: center;
}

.blog-hero--plain .blog-hero__media {
  display: none;
}

.blog-hero__subscribe {
  position: relative;
  z-index: 3;
  left: auto;
  bottom: auto;
  width: min(1180px, 100%);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: clamp(10px, 1.35vw, 18px);
  margin: 0 auto;
  padding: clamp(11px, 1.35vw, 14px) clamp(13px, 1.6vw, 20px);
  border-radius: var(--radius-lg);
  transform: none;
}

.blog-hero__subscribe-title,
.blog-hero__subscribe-side {
  flex: 0 1 auto;
  min-width: 0;
}

.blog-hero__subscribe-title {
  flex: 1 1 420px;
  padding-left: clamp(2px, 0.5vw, 6px);
}

.blog-hero__subscribe-side {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: clamp(16px, 2vw, 28px);
  max-width: max-content;
}

.blog-hero__subscribe-socials {
  padding-left: clamp(14px, 1.7vw, 24px);
  border-left: 1px solid rgba(238, 245, 242, 0.12);
}

.blog-hero__subscribe-form {
  width: max-content;
  max-width: min(100%, 720px);
  padding-left: 0;
  border-left: 0;
}

.blog-hero__subscribe-title strong {
  display: block;
  max-width: 660px;
  color: #fff;
  font-size: clamp(16px, 1.28vw, 20px);
  line-height: 1.2;
  font-weight: 600;
  text-wrap: balance;
}

.blog-hero__subscribe-form {
  display: flex;
  gap: 10px;
  align-items: center;
}

.blog-hero__subscribe-form .field {
  flex: 0 0 clamp(220px, 18vw, 280px);
  min-height: 54px;
}

.blog-hero__subscribe-form .field .icon {
  top: calc(50% + 1px);
  pointer-events: none;
}

.blog-hero__subscribe-socials {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  max-width: max-content;
}

.blog-hero__subscribe-socials > span {
  color: rgba(246, 248, 243, 0.62);
  font-size: 13px;
  line-height: 1.25;
  white-space: nowrap;
}

.blog-hero__subscribe-socials > div {
  display: flex;
  flex: 0 0 auto;
  justify-content: flex-end;
  gap: 9px;
}

.blog-hero__subscribe-socials a {
  width: 46px;
  height: 46px;
  display: inline-grid;
  place-items: center;
  border: 1px solid rgba(238, 245, 242, 0.16);
  border-radius: 15px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.018)),
    rgba(8, 13, 14, 0.62);
  color: var(--lime);
  text-decoration: none;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.1),
    0 10px 24px rgba(0, 0, 0, 0.16);
  transition:
    color 160ms linear,
    border-color 160ms linear,
    box-shadow 160ms linear;
}

.blog-hero__subscribe-socials a:hover,
.blog-hero__subscribe-socials a:focus-visible {
  border-color: rgba(182, 255, 23, 0.36);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.14),
    0 0 20px rgba(182, 255, 23, 0.14);
  outline: none;
}

.blog-hero__subscribe-socials .icon {
  --icon-size: 22px;
}

.blog-hero__subscribe-socials img {
  width: 24px;
  height: 24px;
  display: block;
}

.blog-hero__subscribe-socials a > span {
  font-size: 13px;
  font-weight: 800;
  line-height: 1;
}

.blog-listing {
  padding-top: clamp(6px, 1vw, 12px);
  padding-bottom: clamp(46px, 6vw, 86px);
}

.blog-topics {
  padding: 0;
}

.blog-topics__head {
  max-width: 860px;
  margin-bottom: clamp(24px, 3vw, 34px);
}

.blog-topics__head h2 {
  max-width: 760px;
  margin-top: 18px;
  font-size: var(--fs-h2);
  line-height: 1.16;
}

.blog-topics__head p,
.blog-listing__lead {
  max-width: 790px;
  margin: 14px 0 0;
  color: rgba(246, 248, 243, 0.7);
  font-size: var(--fs-body-lg);
  line-height: 1.55;
}

.blog-topic-card {
  position: relative;
  display: block;
  --mask-center: 0.54;
  --mask-mid: 0.64;
  --mask-edge: 0.74;
  --glint-size: 170px;
  --glint-near-size: 138px;
  --glint-strength: 0.72;
  --glint-border: 1px;
  min-height: 224px;
  overflow: hidden;
  isolation: isolate;
  border-color: rgba(238, 245, 242, 0.18);
  border-radius: var(--radius-lg);
  background:
    radial-gradient(72% 58% at 8% -8%, rgba(255, 255, 255, 0.18), rgba(238, 246, 255, 0.06) 38%, transparent 68%),
    radial-gradient(84% 64% at 102% 98%, rgba(182, 255, 23, 0.15), rgba(182, 255, 23, 0.052) 42%, transparent 72%),
    radial-gradient(82% 62% at 48% 112%, rgba(188, 146, 255, 0.14), rgba(157, 132, 255, 0.052) 44%, transparent 72%),
    linear-gradient(145deg, rgba(31, 36, 38, 0.82), rgba(9, 14, 15, 0.9) 54%, rgba(7, 12, 13, 0.84));
  box-shadow:
    inset 0 1px 1px rgba(255, 255, 255, 0.16),
    inset 0 -1px 0 rgba(182, 255, 23, 0.045),
    0 20px 58px rgba(0, 0, 0, 0.34);
  color: inherit;
  text-decoration: none;
  scroll-margin-top: 126px;
  backdrop-filter: blur(18px) saturate(136%);
  -webkit-backdrop-filter: blur(18px) saturate(136%);
  transition:
    border-color 160ms linear,
    box-shadow 160ms linear,
    transform 160ms linear;
}

.blog-topic-card > * {
  position: relative;
  z-index: 1;
}

.blog-topic-card:hover,
.blog-topic-card:focus-visible {
  border-color: rgba(238, 245, 242, 0.2);
  box-shadow:
    inset 0 1px 1px rgba(255, 255, 255, 0.16),
    inset 0 -1px 0 rgba(182, 255, 23, 0.045),
    0 20px 58px rgba(0, 0, 0, 0.34);
  outline: none;
  transform: none;
}

.blog-topic-card:focus-visible {
  outline: 1px solid rgba(238, 245, 242, 0.42);
  outline-offset: 4px;
}

.blog-topic-card .iconbox {
  color: var(--lime);
}

.blog-listing .article-card[id] {
  scroll-margin-top: 126px;
}

.blog-listing__anchor {
  display: block;
  height: 0;
  overflow: hidden;
  scroll-margin-top: 126px;
}

.blog-listing__filters {
  margin-bottom: clamp(22px, 3vw, 34px);
}

.blog-listing .main-blog__grid {
  margin-top: 0;
}

.blog-listing__pagination {
  margin-top: clamp(28px, 4vw, 48px);
}

.blog-newsletter-card {
  display: grid;
  align-content: center;
  gap: 24px;
  min-height: 530px;
  padding: clamp(28px, 3vw, 40px);
  border: 1px solid rgba(238, 245, 242, 0.15);
  border-radius: var(--radius-md);
  background:
    radial-gradient(circle at 82% 18%, rgba(182, 255, 23, 0.1), transparent 44%),
    linear-gradient(145deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.018) 62%),
    rgba(9, 14, 15, 0.46);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 18px 54px rgba(0, 0, 0, 0.28);
}

.blog-newsletter-card > div:first-child {
  display: grid;
  gap: 12px;
  max-width: 340px;
}

.blog-newsletter-card h3 {
  max-width: 340px;
  margin: 0;
  font-size: clamp(24px, 2.4vw, 32px);
  line-height: 1.2;
  font-weight: 600;
}

.blog-newsletter-card p {
  max-width: 330px;
  margin: 0;
  color: rgba(246, 248, 243, 0.68);
  line-height: 1.55;
}

.blog-newsletter-card__form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: stretch;
}

.blog-newsletter-card__form .field {
  min-height: 58px;
}

.blog-newsletter-card__form .field .icon {
  top: calc(50% + 1px);
  pointer-events: none;
}

.blog-newsletter-card__socials {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 14px;
  color: rgba(246, 248, 243, 0.58);
  font-size: 13px;
  line-height: 1.35;
}

.blog-newsletter-card__socials > span {
  flex: 0 0 auto;
}

.blog-newsletter-card__socials > div {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.blog-newsletter-card__socials a {
  width: 42px;
  height: 42px;
  display: inline-grid;
  place-items: center;
  border: 1px solid rgba(238, 245, 242, 0.16);
  border-radius: 13px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.018)),
    rgba(8, 13, 14, 0.62);
  color: var(--lime);
  text-decoration: none;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.1),
    0 10px 24px rgba(0, 0, 0, 0.16);
  transition:
    color 160ms linear,
    border-color 160ms linear,
    box-shadow 160ms linear;
}

.blog-newsletter-card__socials a:hover,
.blog-newsletter-card__socials a:focus-visible {
  color: var(--lime);
  border-color: rgba(182, 255, 23, 0.32);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.14),
    0 0 20px rgba(182, 255, 23, 0.14);
  outline: none;
}

.blog-newsletter-card__socials .icon {
  --icon-size: 20px;
}

.blog-newsletter-card__socials img {
  width: 21px;
  height: 21px;
  display: block;
}

.blog-newsletter-card__socials a > span {
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
}

@media (max-width: 1180px) {
  .blog-hero {
    height: auto;
    max-height: none;
    gap: 22px;
  }

  .blog-hero__main {
    grid-template-columns: minmax(0, 1fr) minmax(280px, 0.78fr);
    gap: clamp(26px, 4vw, 46px);
  }

  .blog-hero--plain .blog-hero__main {
    grid-template-columns: minmax(0, 760px);
  }

  .blog-hero__media {
    justify-self: center;
  }

  .blog-hero__subscribe {
    position: relative;
    left: auto;
    bottom: auto;
    width: min(1180px, 100%);
    flex-wrap: nowrap;
    gap: 16px 14px;
    transform: none;
  }

  .blog-hero__subscribe-form {
    flex: 0 0 auto;
  }

  .blog-hero__subscribe-side {
    flex: 0 0 auto;
    max-width: max-content;
    justify-content: flex-end;
  }

  .blog-hero__subscribe-socials {
    justify-content: flex-end;
    padding-top: 0;
    border-top: 0;
  }
}

@media (max-width: 780px) {
  body.blog-body {
    --blog-breadcrumb-offset: clamp(84px, 23vw, 112px);
  }

  .blog-page {
    gap: clamp(16px, 6vw, 24px);
  }

  .blog-section-page {
    --blog-section-hero-gap: clamp(24px, 7vw, 34px);
    gap: 0;
  }

  .blog-section-page > .breadcrumbs {
    width: calc(100% - var(--main-page-gutter) - var(--main-page-gutter));
  }

  .blog-page > .content-shell:not(.blog-hero) {
    width: calc(100% - var(--main-page-gutter) - var(--main-page-gutter));
  }

  .blog-page > .blog-hero {
    width: 100%;
  }

  .blog-hero {
    height: auto;
    min-height: 0;
    padding-top: clamp(90px, 23vw, 112px);
    padding-bottom: clamp(24px, 7vw, 36px);
  }

  .blog-section-page > .blog-hero {
    gap: var(--blog-section-hero-gap);
    padding-top: clamp(46px, 12vw, 64px);
    padding-bottom: 0;
  }

  .blog-section-page > .breadcrumbs + .blog-hero {
    padding-top: clamp(24px, 7vw, 38px);
  }

  .main-page.blog-section-page > .blog-hero + .content-shell.blog-listing {
    margin-top: var(--blog-section-hero-gap);
  }

  .blog-hero__main {
    grid-template-columns: 1fr;
    gap: clamp(18px, 6vw, 26px);
  }

  .blog-hero__copy {
    gap: clamp(16px, 5vw, 20px);
  }

  .blog-hero h1 {
    font-size: clamp(34px, 10vw, 44px);
  }

  .blog-hero__actions {
    width: 100%;
    gap: 10px;
  }

  .blog-hero__actions .btn {
    flex: 1 1 100%;
  }

  .blog-hero__media {
    width: 100%;
    border-radius: 22px;
  }

  .blog-hero__subscribe {
    width: 100%;
    flex-direction: column;
    align-items: stretch;
    gap: 20px;
    padding: clamp(22px, 6vw, 28px);
  }

  .blog-hero__subscribe-title,
  .blog-hero__subscribe-side,
  .blog-hero__subscribe-form,
  .blog-hero__subscribe-socials {
    flex: 0 1 auto;
    padding: 0;
    border-left: 0;
  }

  .blog-hero__subscribe-side {
    width: 100%;
    max-width: none;
    flex-direction: column;
    align-items: stretch;
    gap: 14px;
  }

  .blog-hero__subscribe-title strong {
    max-width: none;
    font-size: clamp(22px, 6vw, 30px);
  }

  .blog-hero__subscribe-form {
    width: 100%;
    max-width: none;
    flex-wrap: nowrap;
  }

  .blog-hero__subscribe-form .field {
    flex: 1 1 auto;
    min-width: 0;
  }

  .blog-hero__subscribe-socials {
    padding-top: 0;
    border-top: 0;
  }

  .blog-hero__subscribe-socials > div {
    justify-content: flex-start;
  }

  .blog-newsletter-card,
  .blog-newsletter-card > div:first-child,
  .blog-newsletter-card h3,
  .blog-newsletter-card p {
    max-width: none;
  }

  .blog-newsletter-card {
    min-height: auto;
    padding: clamp(22px, 6vw, 28px);
  }

  .blog-newsletter-card__form {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .blog-newsletter-card__form .field {
    min-width: 0;
  }

  .blog-topics__grid {
    grid-template-columns: 1fr;
  }

  .blog-topics__head p,
  .blog-listing__lead {
    font-size: var(--fs-body);
  }
}

/* End */
/* /assets/vendor/slick/slick.css?17824366531776 */
/* /assets/ui-global.css?1783910671133065 */
/* /assets/main.css?178383537948175 */
/* /assets/privacy-consent.css?17838075281456 */
/* /assets/blog.css?178390469415142 */