
    .page-hero { padding: 160px 0 80px; position: relative; overflow: hidden; }
    .page-hero-glow { position: absolute; width: 700px; height: 700px; border-radius: 50%; background: radial-gradient(circle, rgba(91,95,239,0.12) 0%, transparent 70%); top: -200px; right: -100px; pointer-events: none; }

    /* Filter tabs */
    .filter-tabs {
      display: flex;
      gap: var(--space-2);
      flex-wrap: wrap;
      margin-bottom: var(--space-10);
    }
    .filter-tab {
      padding: 8px 18px;
      border-radius: var(--radius-full);
      font-size: var(--text-sm);
      font-weight: 600;
      cursor: pointer;
      transition: all var(--transition-fast);
      border: 1px solid var(--border-subtle);
      background: transparent;
      color: var(--text-secondary);
      font-family: var(--font-body);
    }
    .filter-tab:hover { border-color: var(--border-accent); color: var(--text-primary); background: var(--bg-card); }
    .filter-tab.active { background: var(--gradient-primary); border-color: transparent; color: #fff; box-shadow: 0 4px 14px rgba(91,95,239,0.35); }

    /* Services full grid */
    .services-full-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: var(--space-5);
    }

    .service-full-card {
      padding: var(--space-7);
      border-radius: var(--radius-xl);
      background: var(--bg-card);
      border: 1px solid var(--border-subtle);
      transition: all var(--transition-base);
      position: relative;
      overflow: hidden;
      text-decoration: none;
      display: block;
    }
    .service-full-card::after {
      content: '';
      position: absolute;
      bottom: 0; left: 0; right: 0;
      height: 2px;
      background: var(--gradient-primary);
      transform: scaleX(0);
      transition: transform var(--transition-base);
    }
    .service-full-card:hover::after { transform: scaleX(1); }
    .service-full-card:hover {
      background: var(--bg-card-hover);
      border-color: var(--border-accent);
      transform: translateY(-4px);
      box-shadow: var(--shadow-md);
    }

    .sfc-icon {
      width: 52px; height: 52px;
      border-radius: 14px;
      background: var(--gradient-primary);
      display: flex; align-items: center; justify-content: center;
      margin-bottom: var(--space-5);
      box-shadow: 0 6px 20px rgba(91,95,239,0.3);
    }
    .sfc-icon svg { width: 26px; height: 26px; color: #fff; }

    .sfc-category {
      font-size: var(--text-xs);
      font-weight: 700;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: var(--accent-light);
      margin-bottom: var(--space-2);
    }
    .sfc-title {
      font-family: var(--font-display);
      font-size: 1.1rem;
      font-weight: 700;
      color: var(--text-primary);
      margin-bottom: var(--space-3);
      line-height: 1.3;
    }
    .sfc-desc { font-size: var(--text-sm); color: var(--text-secondary); line-height: 1.7; margin-bottom: var(--space-4); }

    .sfc-features {
      display: flex;
      flex-direction: column;
      gap: var(--space-2);
      margin-bottom: var(--space-5);
    }
    .sfc-feature {
      display: flex;
      align-items: center;
      gap: var(--space-2);
      font-size: var(--text-xs);
      color: var(--text-muted);
    }
    .sfc-feature svg { width: 12px; height: 12px; color: var(--accent-light); flex-shrink: 0; }

    .sfc-link {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-size: var(--text-sm);
      font-weight: 600;
      color: var(--accent-light);
      transition: gap var(--transition-fast), color var(--transition-fast);
    }
    .sfc-link:hover { gap: 10px; color: var(--text-primary); }
    .sfc-link svg { width: 14px; height: 14px; }

    /* Categories section headings */
    .category-heading {
      font-family: var(--font-display);
      font-size: 0.7rem;
      font-weight: 700;
      letter-spacing: 0.15em;
      text-transform: uppercase;
      color: var(--text-muted);
      padding: var(--space-2) 0;
      border-bottom: 1px solid var(--border-subtle);
      margin-bottom: var(--space-5);
      grid-column: 1 / -1;
    }

    @media (max-width: 1024px) {
      .services-full-grid { grid-template-columns: repeat(2, 1fr); }
    }
    @media (max-width: 640px) {
      .services-full-grid { grid-template-columns: 1fr; }
    }
  