# MDR Solutions Website

A professional, responsive business website for MDR (Managed Detection and Response) solutions.

## Project Structure

```
MDR Website/
├── index.html              # Homepage
├── pages/
│   ├── about.html         # About page
│   ├── services.html      # Services page
│   └── contact.html       # Contact page
├── assets/
│   ├── css/
│   │   └── styles.css     # Main stylesheet
│   ├── js/
│   │   └── main.js        # JavaScript functionality
│   └── images/            # Image directory (for future use)
└── README.md              # This file
```

## Features

- **Responsive Design**: Works seamlessly on desktop, tablet, and mobile devices
- **Modern Styling**: Clean, professional design with smooth transitions and hover effects
- **Multiple Pages**: Home, About, Services, and Contact pages
- **Contact Form**: Functional contact form with validation
- **Navigation**: Sticky navigation bar with active page highlighting
- **Performance**: Lightweight and fast-loading

## Getting Started

1. Open `index.html` in your web browser to view the site
2. Navigate through pages using the navigation menu
3. All pages are fully responsive and mobile-friendly

## Customization

### Colors
Edit the color scheme in `assets/css/styles.css`:
- Primary color: `#00d4ff` (cyan)
- Secondary color: `#1a1a2e` (dark blue)
- Accent color: `#16213e` (darker blue)

### Content
Edit content in each HTML file:
- `index.html` - Homepage content and hero section
- `pages/about.html` - Company information
- `pages/services.html` - Service descriptions
- `pages/contact.html` - Contact information and form

### Company Information
Replace placeholder text with your actual company information:
- Company name: "MDR Solutions"
- Email: info@mdrsolutions.com
- Phone: +1 (555) 123-4567
- Address: Update in contact page

## Analytics

Google Analytics is integrated into all pages to track user behavior and engagement:

### Tracked Events:
- **Page Views**: Automatically tracked on all pages
- **Navigation Clicks**: Track when users click navigation menu items
- **CTA Clicks**: Track calls-to-action button clicks ("Get Started", "Schedule a Demo", etc.)
- **Contact Form Submissions**: Track when users submit the contact form

### Setup:
1. Replace `G-XXXXXXXXXX` with your actual Google Analytics ID in all HTML files:
   - `index.html`
   - `pages/about.html`
   - `pages/services.html`
   - `pages/contact.html`

2. Create a Google Analytics account at [analytics.google.com](https://analytics.google.com)
3. Set up a new property for your website
4. Copy your Measurement ID (starting with `G-`)
5. Replace all instances of `G-XXXXXXXXXX` with your ID

### View Analytics:
- Log in to your Google Analytics dashboard
- Monitor real-time user activity
- Track conversion goals and user engagement
- Analyze traffic sources and user behavior

## Contact Form

The contact form validates required fields and email format. For production use, connect it to a backend service to actually send emails.

## Deployment

To deploy this website:
1. Upload all files to your web hosting provider
2. Ensure the file structure is maintained
3. Test all links and pages after deployment

## Browser Support

- Chrome (latest)
- Firefox (latest)
- Safari (latest)
- Edge (latest)
- Mobile browsers

## License

© 2026 MDR Solutions. All rights reserved.
