:root {
      --primary: #123dff;
      --primary-dark: #061bb5;
      --primary-deep: #02042b;
      --primary-soft: #edf3ff;
      --ink: #020416;
      --ink-soft: #17223d;
      --text-muted: #63768a;
      --line: rgba(10, 163, 123, 0.14);
      --page: #edf7f4;
      --surface: rgba(255, 255, 255, 0.78);
      --shadow:
        0 30px 76px rgba(5, 45, 37, 0.08),
        0 10px 26px rgba(5, 45, 37, 0.045);
    }

    * {
      box-sizing: border-box;
    }

    html {
      scroll-behavior: smooth;
    }

    body {
      margin: 0;
      min-height: 100vh;
      overflow-x: hidden;
      color: var(--ink);
      font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      background:
        radial-gradient(circle at 10% 4%, rgba(10, 163, 123, 0.16), transparent 26%),
        radial-gradient(circle at 92% 13%, rgba(10, 163, 123, 0.12), transparent 25%),
        radial-gradient(circle at 52% 52%, rgba(10, 163, 123, 0.06), transparent 38%),
        var(--page);
    }

    ::selection {
      color: #ffffff;
      background: var(--primary);
    }

    a,
    button {
      -webkit-tap-highlight-color: transparent;
    }

    a:focus-visible,
    button:focus-visible {
      outline: 3px solid rgba(10, 163, 123, 0.34);
      outline-offset: 3px;
    }

    .page-grid {
      position: fixed;
      inset: 0;
      z-index: -3;
      pointer-events: none;
      background-image:
        linear-gradient(rgba(10, 163, 123, 0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(10, 163, 123, 0.045) 1px, transparent 1px);
      background-size: 48px 48px;
      mask-image: radial-gradient(circle at 50% 26%, black 20%, transparent 70%);
    }

    .orb {
      position: fixed;
      z-index: -2;
      pointer-events: none;
      border-radius: 999px;
      animation: drift 12s ease-in-out infinite alternate;
    }

    .orb-one {
      left: -100px;
      top: 27%;
      height: 260px;
      width: 260px;
      background: rgba(10, 163, 123, 0.08);
    }

    .orb-two {
      right: -140px;
      bottom: 13%;
      height: 320px;
      width: 320px;
      background: rgba(10, 163, 123, 0.075);
      animation-delay: -5s;
    }

    .glass {
      border: 1px solid rgba(255, 255, 255, 0.84);
      background: var(--surface);
      box-shadow: var(--shadow);
      backdrop-filter: blur(22px);
      -webkit-backdrop-filter: blur(22px);
    }

    .soft-border {
      border: 1px solid var(--line);
    }

    .brand-gradient {
      background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%);
    }

    .text-gradient {
      color: transparent;
      background: linear-gradient(115deg, #081d1a 12%, var(--primary) 86%);
      background-clip: text;
      -webkit-background-clip: text;
    }

    .brand-mark {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: #ffffff;
      background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%);
      box-shadow: 0 12px 24px rgba(10, 163, 123, 0.19);
    }

    .brand-mark svg {
      width: 62%;
      height: 62%;
    }

    .nav-shell {
      animation: slide-down 0.76s ease both;
      border-color: rgba(255, 255, 255, 0.12);
      background: linear-gradient(120deg, #071d42 0%, #0a3b55 58%, #07634f 100%);
      box-shadow: 0 22px 48px rgba(2, 18, 38, 0.2);
    }

    .nav-shell .text-slate-900 {
      color: #ffffff !important;
    }

    .nav-shell .text-slate-500,
    .nav-shell .text-slate-600 {
      color: rgba(232, 248, 245, 0.76) !important;
    }

    .nav-shell .nav-link:hover {
      color: #ffffff !important;
    }

    .nav-shell .nav-link::after {
      background: #75ffd0;
    }

    .nav-pricing,
    .mobile-pricing {
      color: #071d42 !important;
      background: #75ffd0;
      text-decoration: none;
    }

    .nav-pricing {
      padding: 9px 15px;
      border-radius: 999px;
      transition: transform 0.22s ease, background 0.22s ease;
    }

    .nav-pricing:hover,
    .nav-pricing:focus-visible,
    .mobile-pricing:hover,
    .mobile-pricing:focus-visible {
      color: #071d42 !important;
      background: #a2ffe0;
      transform: translateY(-2px);
    }

    .nav-shell .landing-user,
    .nav-shell .landing-mobile-user {
      border-color: rgba(255, 255, 255, 0.16);
      color: #ffffff;
      background: rgba(255, 255, 255, 0.1);
    }

    .nav-shell .landing-user-copy small {
      color: rgba(232, 248, 245, 0.7);
    }

    .nav-shell .landing-user-arrow {
      color: #75ffd0;
    }

    .nav-shell #menuButton {
      border-color: rgba(255, 255, 255, 0.16);
      color: #ffffff !important;
      background: rgba(255, 255, 255, 0.1);
    }

    .nav-shell #mobileMenu > div {
      border-color: rgba(255, 255, 255, 0.12);
    }

    .nav-link {
      position: relative;
      transition: color 0.22s ease;
    }

    .nav-link::after {
      content: "";
      position: absolute;
      right: 0;
      bottom: -7px;
      left: 0;
      height: 2px;
      transform: scaleX(0);
      transform-origin: center;
      background: var(--primary);
      transition: transform 0.25s ease;
    }

    .nav-link:hover {
      color: var(--primary-dark);
    }

    .nav-link:hover::after {
      transform: scaleX(1);
    }

    .hero-copy {
      animation: fade-up 0.8s ease 0.08s both;
    }

    .hero-dashboard {
      animation: fade-up 0.88s ease 0.17s both;
    }

    .dashboard-shell {
      border-color: rgba(255, 255, 255, 0.12);
      background: linear-gradient(145deg, #071d42 0%, #0b3150 55%, #075444 100%);
      box-shadow: 0 30px 70px rgba(2, 18, 38, 0.2);
    }

    .dashboard-shell > div {
      background: #f1f6f5;
    }

    .status-dot {
      position: relative;
    }

    .status-dot::after {
      content: "";
      position: absolute;
      inset: -5px;
      border-radius: 999px;
      border: 1px solid rgba(10, 163, 123, 0.42);
      animation: pulse-ring 1.9s infinite;
    }

    .button-primary {
      transition: transform 0.24s ease, box-shadow 0.24s ease;
    }

    .button-primary:hover {
      transform: translateY(-2px);
      box-shadow: 0 18px 31px rgba(10, 163, 123, 0.24);
    }

    .button-secondary {
      transition: transform 0.24s ease, border-color 0.24s ease, background 0.24s ease;
    }

    .button-secondary:hover {
      transform: translateY(-2px);
      border-color: rgba(10, 163, 123, 0.28);
      background: #ffffff;
    }

    .dashboard-shell {
      position: relative;
      overflow: hidden;
    }

    .dashboard-shell::before {
      content: "";
      position: absolute;
      top: -52%;
      left: -52%;
      z-index: 3;
      width: 28%;
      height: 208%;
      transform: rotate(25deg);
      pointer-events: none;
      background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.82), transparent);
      animation: shine 5.2s ease-in-out infinite;
    }

    .floating-card {
      animation: float-card 4.5s ease-in-out infinite;
    }

    .floating-card.delay {
      animation-delay: -2s;
    }

    .metric-card {
      transition: transform 0.28s ease, border-color 0.28s ease, box-shadow 0.28s ease;
    }

    .metric-card:hover {
      transform: translateY(-4px);
      border-color: rgba(10, 163, 123, 0.27);
      box-shadow: 0 18px 34px rgba(8, 44, 37, 0.06);
    }

    .metric-card:nth-child(1),
    .metric-card:nth-child(2) {
      border-color: rgba(255, 255, 255, 0.16);
      color: #eafff7;
      background:
        linear-gradient(135deg, rgba(10, 163, 123, 0.96), rgba(6, 76, 61, 0.99)),
        var(--primary-deep);
      box-shadow: 0 18px 36px rgba(5, 45, 37, 0.12);
    }

    .metric-card:nth-child(3) {
      border-color: rgba(255, 255, 255, 0.18);
      color: #fff9ef;
      background:
        linear-gradient(135deg, rgba(205, 124, 14, 0.94), rgba(112, 67, 10, 0.98)),
        #70430a;
    }

    .metric-card:nth-child(4) {
      border-color: rgba(255, 255, 255, 0.18);
      color: #fff1f1;
      background:
        linear-gradient(135deg, rgba(138, 52, 57, 0.96), rgba(77, 28, 32, 0.99)),
        #4d1c20;
    }

    .metric-card:nth-child(1) .text-slate-900,
    .metric-card:nth-child(2) .text-slate-900,
    .metric-card:nth-child(3) .text-slate-900,
    .metric-card:nth-child(4) .text-slate-900 {
      color: #ffffff;
    }

    .metric-card:nth-child(1) .text-slate-400,
    .metric-card:nth-child(2) .text-slate-400,
    .metric-card:nth-child(3) .text-slate-400,
    .metric-card:nth-child(4) .text-slate-400,
    .metric-card:nth-child(1) .text-emerald-600,
    .metric-card:nth-child(2) .text-emerald-600,
    .metric-card:nth-child(3) .text-amber-600,
    .metric-card:nth-child(4) .text-rose-600 {
      color: rgba(234, 255, 247, 0.74);
    }

    .alert-item {
      transition: background 0.22s ease, transform 0.22s ease;
    }

    .alert-item:hover {
      transform: translateX(3px);
      background: #ffffff;
    }

    .section-kicker {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      color: var(--primary-dark);
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.21em;
      text-transform: uppercase;
    }

    .section-kicker::before {
      content: "";
      width: 22px;
      height: 1px;
      background: var(--primary);
    }

    .audience-band {
      animation: fade-up 0.82s ease 0.27s both;
    }

    .audience-band > .glass {
      border-color: rgba(255, 255, 255, 0.12);
      background: linear-gradient(120deg, #071d42 0%, #0a3b55 58%, #07634f 100%);
      box-shadow: 0 24px 58px rgba(2, 18, 38, 0.17);
    }

    .audience-band > .glass > p {
      color: #75ffd0 !important;
      text-shadow: 0 0 18px rgba(117, 255, 208, 0.32);
    }

    .audience-pill {
      color: #f2fffb;
      border: 1px solid rgba(255, 255, 255, 0.14);
      background: rgba(255, 255, 255, 0.09);
      box-shadow: none;
      transition: transform 0.22s ease, border-color 0.22s ease, background 0.22s ease;
    }

    .audience-pill:hover {
      transform: translateY(-2px);
      border-color: rgba(185, 245, 223, 0.4);
      background: rgba(255, 255, 255, 0.15);
    }

    .audience-pill i {
      color: #72e8c0;
    }

    .price-mask {
      display: inline-block;
      filter: blur(6px);
      user-select: none;
    }

    .feature-card {
      background: linear-gradient(145deg, rgba(226, 240, 237, 0.96), rgba(215, 232, 237, 0.92));
      border-color: rgba(43, 91, 107, 0.14);
      transition: transform 0.28s ease, border-color 0.28s ease, box-shadow 0.28s ease;
    }

    .feature-card:hover {
      transform: translateY(-5px);
      border-color: rgba(10, 163, 123, 0.24);
      box-shadow: 0 22px 38px rgba(8, 44, 37, 0.06);
    }

    .feature-card:nth-child(2),
    .feature-card:nth-child(6),
    .workflow-card:nth-child(2),
    .trust-card:nth-child(1),
    .trust-card:nth-child(3) {
      border-color: rgba(255, 255, 255, 0.16);
      color: #eafff7;
      background:
        linear-gradient(135deg, rgba(18, 61, 255, 0.96), rgba(6, 27, 181, 0.99)),
        var(--primary-deep);
      box-shadow: 0 24px 50px rgba(6, 27, 181, 0.14);
    }

    .feature-card:nth-child(4),
    .workflow-card:nth-child(3) {
      border-color: rgba(255, 255, 255, 0.18);
      color: #eafff7;
      background:
        linear-gradient(135deg, rgba(10, 163, 123, 0.96), rgba(6, 76, 61, 0.99)),
        #064c3d;
      box-shadow: 0 24px 50px rgba(5, 45, 37, 0.13);
    }

    .trust-card:nth-child(2) {
      border-color: rgba(255, 255, 255, 0.18);
      color: #eaf5ff;
      background:
        linear-gradient(135deg, rgba(13, 85, 128, 0.98), rgba(7, 54, 79, 0.99)),
        #07364f;
      box-shadow: 0 24px 50px rgba(7, 54, 79, 0.13);
    }

    .back-to-top {
      position: fixed;
      z-index: 80;
      right: 24px;
      bottom: 22px;
      width: 58px;
      height: 58px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border: 1px solid rgba(255, 255, 255, 0.16);
      border-radius: 18px;
      color: #ffffff;
      background: linear-gradient(135deg, #123dff, #075f50);
      box-shadow: 0 14px 32px rgba(2, 20, 55, 0.24);
      font-size: 30px;
      font-weight: 800;
      text-decoration: none;
      opacity: 0;
      pointer-events: none;
      transform: translateY(18px);
      transition: opacity 0.22s ease, transform 0.22s ease, box-shadow 0.22s ease;
    }

    .back-to-top.visible {
      opacity: 1;
      pointer-events: auto;
      transform: translateY(0);
    }

    .back-to-top:hover,
    .back-to-top:focus-visible {
      transform: translateY(-5px);
      box-shadow: 0 20px 38px rgba(2, 20, 55, 0.3);
    }

    .feature-card:nth-child(2) h3,
    .feature-card:nth-child(4) h3,
    .feature-card:nth-child(6) h3,
    .workflow-card:nth-child(2) h3,
    .workflow-card:nth-child(3) h3,
    .trust-card h3,
    .feature-card:nth-child(2) .text-slate-900,
    .feature-card:nth-child(4) .text-slate-900,
    .feature-card:nth-child(6) .text-slate-900,
    .workflow-card:nth-child(2) .text-slate-900,
    .workflow-card:nth-child(3) .text-slate-900,
    .trust-card .text-slate-900 {
      color: #ffffff;
    }

    .feature-card:nth-child(2) p,
    .feature-card:nth-child(4) p,
    .feature-card:nth-child(6) p,
    .workflow-card:nth-child(2) p,
    .workflow-card:nth-child(3) p,
    .trust-card p,
    .feature-card:nth-child(2) .text-slate-500,
    .feature-card:nth-child(4) .text-slate-500,
    .feature-card:nth-child(6) .text-slate-500,
    .workflow-card:nth-child(2) .text-slate-500,
    .workflow-card:nth-child(3) .text-slate-500,
    .trust-card .text-slate-500 {
      color: rgba(234, 255, 247, 0.75);
    }

    .feature-card:nth-child(2) .feature-icon,
    .feature-card:nth-child(4) .feature-icon,
    .feature-card:nth-child(6) .feature-icon,
    .workflow-card:nth-child(2) span,
    .workflow-card:nth-child(3) span,
    .trust-card span {
      color: #eafff7;
      background: rgba(255, 255, 255, 0.13);
    }

    .workflow-card:nth-child(2) > p,
    .workflow-card:nth-child(3) > p {
      color: #9ff7d6;
    }

    .feature-icon {
      position: relative;
      overflow: hidden;
    }

    .feature-icon::after {
      content: "";
      position: absolute;
      inset: 0;
      transform: translateX(-110%);
      background: linear-gradient(115deg, transparent, rgba(255, 255, 255, 0.76), transparent);
      animation: mini-shimmer 4.4s ease-in-out infinite;
    }

    .workflow-card {
      position: relative;
      border-color: rgba(43, 91, 107, 0.14);
      background: linear-gradient(145deg, #edf4f2, #e2eeec);
    }

    .workflow-card:not(:last-child)::after {
      content: "";
      position: absolute;
      top: 50px;
      left: calc(100% - 14px);
      width: 28px;
      height: 1px;
      background: linear-gradient(90deg, rgba(10, 163, 123, 0.43), rgba(10, 163, 123, 0.08));
    }

    .workspace-tab {
      transition: color 0.22s ease, background 0.22s ease;
    }

    .workspace-tab:hover {
      color: var(--primary-dark);
      background: #edf3ff;
    }

    .progress-line {
      position: relative;
      overflow: hidden;
      background: #d9f8ee;
    }

    .progress-line::after {
      content: "";
      position: absolute;
      top: 0;
      bottom: 0;
      left: -42%;
      width: 42%;
      background: linear-gradient(90deg, transparent, var(--primary), transparent);
      animation: loading 2.35s ease-in-out infinite;
    }

    .trust-card {
      transition: transform 0.28s ease, border-color 0.28s ease;
    }

    .trust-card:hover {
      transform: translateY(-4px);
      border-color: rgba(10, 163, 123, 0.24);
    }

    .landing-user,
    .landing-mobile-user {
      align-items: center;
      gap: 10px;
      color: #17223d;
      text-decoration: none;
    }

    .landing-user {
      max-width: 220px;
      padding: 6px 10px 6px 7px;
      border: 1px solid rgba(18, 61, 255, 0.12);
      border-radius: 999px;
      background: rgba(255, 255, 255, 0.76);
    }

    .landing-mobile-user {
      display: flex;
    }

    .landing-user-avatar {
      width: 36px;
      height: 36px;
      flex: 0 0 36px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border-radius: 50%;
      color: #123dff;
      background: #edf3ff;
    }

    .landing-user-copy {
      min-width: 0;
      display: grid;
      line-height: 1.2;
    }

    .landing-user-copy strong,
    .landing-user-copy small {
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .landing-user-arrow {
      margin-left: auto;
      color: var(--primary);
      font-size: 20px;
    }

    .landing-user-copy strong {
      font-size: 12px;
    }

    .landing-user-copy small {
      margin-top: 3px;
      color: #6f7d95;
      font-size: 10px;
    }

    .pricing-card {
      position: relative;
      overflow: hidden;
    }

    .themed-pricing {
      border-color: rgba(10, 163, 123, 0.24);
      color: #eafff7;
      background:
        linear-gradient(135deg, rgba(10, 163, 123, 0.96), rgba(6, 76, 61, 0.99)),
        var(--primary-deep);
      box-shadow:
        0 30px 76px rgba(5, 45, 37, 0.18),
        0 12px 28px rgba(10, 163, 123, 0.14);
    }

    .pricing-card::after {
      content: "";
      position: absolute;
      right: -92px;
      top: -116px;
      width: 230px;
      height: 230px;
      border-radius: 999px;
      background: rgba(10, 163, 123, 0.08);
      pointer-events: none;
    }

    .themed-pricing::before {
      content: "";
      position: absolute;
      inset: auto -12% -38% 38%;
      height: 220px;
      border-radius: 999px;
      background: rgba(255, 255, 255, 0.12);
      pointer-events: none;
      transform: rotate(-8deg);
    }

    .themed-pricing::after {
      background: rgba(255, 255, 255, 0.12);
    }

    .themed-pricing h3,
    .themed-pricing .text-slate-950 {
      color: #ffffff;
    }

    .themed-pricing .text-slate-500,
    .themed-pricing .text-slate-600 {
      color: rgba(234, 255, 247, 0.78);
    }

    .themed-pricing .border-emerald-100 {
      border-color: rgba(255, 255, 255, 0.18);
    }

    .themed-pricing .pricing-plan {
      border-color: rgba(255, 255, 255, 0.16);
      background: rgba(255, 255, 255, 0.1);
      backdrop-filter: blur(16px);
    }

    .themed-pricing .pricing-plan.featured {
      border-color: rgba(255, 255, 255, 0.26);
      background: rgba(255, 255, 255, 0.18);
      box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
    }

    .themed-pricing .pricing-plan .text-slate-400 {
      color: rgba(234, 255, 247, 0.54);
    }

    .themed-pricing .pricing-plan .text-emerald-700,
    .themed-pricing .text-emerald-700,
    .themed-pricing .text-emerald-600 {
      color: #9ff7d6;
    }

    .themed-pricing .pricing-plan .bg-emerald-50,
    .themed-pricing .pricing-plan .bg-white,
    .themed-pricing .bg-emerald-50 {
      color: #02042b;
      background: rgba(255, 255, 255, 0.86);
    }

    .themed-pricing .button-primary {
      color: var(--primary-deep);
      background: #ffffff;
      box-shadow: 0 16px 32px rgba(5, 45, 37, 0.18);
    }

    .themed-pricing .pricing-cta {
      min-width: 176px;
      color: var(--primary-deep);
      background: #ffffff;
      white-space: nowrap;
      align-self: flex-start;
    }

    .themed-pricing .pricing-cta i {
      color: var(--primary);
    }

    .landing-footer {
      position: relative;
      overflow: hidden;
      color: #daf9ef;
      background:
        radial-gradient(circle at 12% 8%, rgba(92, 241, 196, 0.16), transparent 26%),
        linear-gradient(135deg, #020416 0%, #061bb5 52%, #008f45 100%);
    }

    .footer-wave {
      position: absolute;
      top: -1px;
      right: 0;
      left: 0;
      height: 58px;
      color: var(--page);
      transform: translateY(-1px);
    }

    .footer-wave svg {
      width: 100%;
      height: 100%;
      display: block;
    }

    .footer-wave path {
      fill: currentColor;
    }

    .landing-footer .footer-grid {
      border-color: rgba(159, 247, 214, 0.18);
    }

    .landing-footer .brand-mark {
      background: rgba(255, 255, 255, 0.12);
      box-shadow: none;
    }

    .landing-footer .text-slate-900,
    .landing-footer .text-slate-500,
    .landing-footer .text-slate-400 {
      color: rgba(234, 255, 247, 0.78);
    }

    .landing-footer .text-slate-900,
    .landing-footer .font-bold {
      color: #ffffff;
    }

    .landing-footer .text-emerald-600 {
      color: #8bf4cd;
    }

    .footer-link {
      transition: color 0.2s ease;
    }

    .footer-link:hover {
      color: #ffffff;
    }

    #mobileMenu {
      max-height: 0;
      overflow: hidden;
      opacity: 0;
      transition: max-height 0.3s ease, opacity 0.25s ease, margin-top 0.3s ease;
    }

    #mobileMenu.open {
      max-height: 420px;
      opacity: 1;
      margin-top: 14px;
    }

    .landing-offer-backdrop {
      position: fixed;
      inset: 0;
      z-index: 80;
      display: grid;
      place-items: center;
      padding: 22px;
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
      background: rgba(2, 4, 43, 0.34);
      backdrop-filter: blur(12px);
      transition: opacity 0.22s ease, visibility 0.22s ease;
    }

    .landing-offer-backdrop.visible {
      opacity: 1;
      visibility: visible;
      pointer-events: auto;
    }

    .landing-offer {
      position: relative;
      width: min(500px, 100%);
      display: grid;
      gap: 16px;
      padding: 30px;
      border: 1px solid rgba(255, 255, 255, 0.18);
      border-radius: 28px;
      color: #ffffff;
      background:
        radial-gradient(circle at 92% 8%, rgba(0, 200, 83, 0.22), transparent 30%),
        linear-gradient(145deg, #123dff 0%, #061bb5 58%, #02042b 100%);
      box-shadow: 0 30px 80px rgba(2, 4, 43, 0.24);
    }

    .landing-offer-close {
      position: absolute;
      top: 14px;
      right: 14px;
      width: 36px;
      height: 36px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border: 1px solid rgba(255, 255, 255, 0.2);
      border-radius: 12px;
      color: #ffffff;
      background: rgba(255, 255, 255, 0.12);
    }

    .landing-offer-badge {
      width: fit-content;
      padding: 8px 11px;
      border-radius: 999px;
      color: #02042b;
      background: #ffffff;
      font-size: 11px;
      font-weight: 900;
      text-transform: uppercase;
      letter-spacing: 0.08em;
    }

    .landing-offer-icons {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      padding-top: 2px;
    }

    .landing-offer-icons span {
      width: 44px;
      height: 44px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border-radius: 15px;
      color: #ffffff;
      background: rgba(255, 255, 255, 0.13);
      font-size: 19px;
    }

    .landing-offer-icons span:nth-child(2) {
      color: #ffffff;
      background: rgba(255, 255, 255, 0.13);
    }

    .landing-offer-icons span:nth-child(3) {
      color: #ffffff;
      background: rgba(255, 255, 255, 0.13);
    }

    .landing-offer-icons span:nth-child(4) {
      color: #ffffff;
      background: rgba(255, 255, 255, 0.13);
    }

    .landing-offer h2 {
      margin: 0;
      color: #ffffff;
      font-size: clamp(24px, 5vw, 34px);
      font-weight: 800;
      line-height: 1.08;
    }

    .landing-offer p {
      margin: 0;
      color: rgba(255, 255, 255, 0.76);
      font-size: 14px;
      line-height: 1.65;
    }

    .landing-offer-value {
      display: grid;
      gap: 9px;
      padding: 15px;
      border-radius: 17px;
      background: rgba(255, 255, 255, 0.1);
    }

    .landing-offer-value span {
      display: flex;
      align-items: flex-start;
      gap: 9px;
      color: rgba(255, 255, 255, 0.9);
      font-size: 12px;
      font-weight: 700;
      line-height: 1.5;
    }

    .landing-offer-value i {
      color: #8bf4cd;
      font-size: 16px;
    }


    .landing-offer-cta {
      min-height: 52px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 9px;
      border-radius: 16px;
      color: #ffffff;
      background: #123dff;
      font-size: 14px;
      font-weight: 900;
      text-decoration: none;
      box-shadow: 0 16px 28px rgba(18, 61, 255, 0.22);
    }

    @keyframes drift {
      from {
        transform: translate3d(0, -8px, 0) scale(1);
      }
      to {
        transform: translate3d(17px, 19px, 0) scale(1.06);
      }
    }

    @keyframes slide-down {
      from {
        opacity: 0;
        transform: translateY(-16px);
      }
      to {
        opacity: 1;
        transform: translateY(0);
      }
    }

    @keyframes fade-up {
      from {
        opacity: 0;
        transform: translateY(22px);
      }
      to {
        opacity: 1;
        transform: translateY(0);
      }
    }

    @keyframes pulse-ring {
      0% {
        opacity: 0.72;
        transform: scale(0.75);
      }
      75%,
      100% {
        opacity: 0;
        transform: scale(2.2);
      }
    }

    @keyframes shine {
      0%,
      22% {
        left: -52%;
      }
      63%,
      100% {
        left: 128%;
      }
    }

    @keyframes float-card {
      0%,
      100% {
        transform: translateY(0);
      }
      50% {
        transform: translateY(-9px);
      }
    }

    @keyframes mini-shimmer {
      0%,
      18% {
        transform: translateX(-110%);
      }
      65%,
      100% {
        transform: translateX(110%);
      }
    }

    @keyframes loading {
      from {
        left: -42%;
      }
      to {
        left: 110%;
      }
    }

    @media (max-width: 1023px) {
      .workflow-card:not(:last-child)::after {
        display: none;
      }
    }

    @media (max-width: 767px) {
      .themed-pricing .pricing-cta {
        width: 100%;
      }

      .landing-footer {
        padding-top: 4.75rem;
      }

      .landing-offer-backdrop {
        align-items: end;
        padding: 14px;
      }

      .landing-offer {
        width: 100%;
        padding: 24px;
        border-radius: 24px;
      }

      .landing-offer-icons span {
        width: 40px;
        height: 40px;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      *,
      *::before,
      *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
      }
    }