.elementor-kit-6{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-6 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS */<!DOCTYPE html>
<html lang="fr">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Alpha Logiciel</title>
  <link href="https://fonts.googleapis.com/css2?family=Segoe+UI:wght@400;700&display=swap" rel="stylesheet">
  <style>
    * { box-sizing: border-box; margin: 0; padding: 0; }
    body {
      font-family: 'Segoe UI', sans-serif;
      background: #fff;
      color: #333;
      overflow-x: hidden;
    }
    header {
      background: #0096f2;
      color: white;
      padding: 1.2rem 2rem;
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex-wrap: wrap;
      position: sticky;
      top: 0;
      z-index: 999;
    }
    header img {
      height: 50px;
    }
    nav a {
      color: white;
      margin-left: 1.2rem;
      text-decoration: none;
      font-weight: bold;
      transition: color 0.3s;
    }
    nav a:hover {
      color: #bfe6ff;
    }

    .hero {
      padding: 6rem 2rem;
      text-align: center;
      background: linear-gradient(rgba(0, 55, 107, 0.8), rgba(0, 55, 107, 0.9)),
        url('https://via.placeholder.com/1200x600/001f3f/ffffff?text=Technologie+de+pointe') no-repeat center center/cover;
      color: white;
      animation: fadeIn 2s ease-in-out;
    }
    .hero h1 {
      font-size: 3rem;
      text-shadow: 1px 1px 3px #000;
    }
    .hero p {
      font-size: 1.2rem;
      margin-top: 1rem;
      text-shadow: 1px 1px 2px #000;
    }

    .services {
      padding: 3rem 2rem;
      background: #f9fbfd;
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
      gap: 2rem;
    }
    .service {
      background: white;
      padding: 2rem;
      border-radius: 10px;
      box-shadow: 0 4px 8px rgba(0,0,0,0.05);
      text-align: center;
      transition: transform 0.3s ease, box-shadow 0.3s ease;
    }
    .service:hover {
      transform: translateY(-5px);
      box-shadow: 0 6px 15px rgba(0,0,0,0.1);
    }
    .service img {
      width: 80px;
      margin-bottom: 1rem;
    }
    .service h3 {
      color: #0096f2;
      font-size: 1.2rem;
      margin-bottom: 0.5rem;
    }

    .clients {
      padding: 3rem 2rem;
      background: #eef2f7;
      text-align: center;
    }
    .clients h2 {
      color: #0096f2;
      margin-bottom: 1.5rem;
    }
    .clients-logos {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 2rem;
    }
    .clients-logos img {
      height: 60px;
      transition: transform 0.3s ease;
    }
    .clients-logos img:hover {
      transform: scale(1.1);
    }

    footer {
      background: #5a646d;
      color: white;
      text-align: center;
      padding: 2rem 1rem;
    }

    .whatsapp {
      position: fixed;
      bottom: 20px;
      right: 20px;
      background-color: #25d366;
      color: white;
      border-radius: 50%;
      padding: 15px;
      text-decoration: none;
      font-size: 24px;
      box-shadow: 0 2px 5px rgba(0,0,0,0.2);
      z-index: 1000;
    }

    @keyframes fadeIn {
      from { opacity: 0; }
      to { opacity: 1; }
    }

    @media (max-width: 600px) {
      .hero h1 {
        font-size: 2rem;
      }
      nav {
        justify-content: center;
        flex-direction: column;
        gap: 0.5rem;
      }
    }
  </style>
</head>
<body>

<header>
  <img src="https://via.placeholder.com/150x50?text=Alpha+Logiciel" alt="Logo Alpha Logiciel" />
  <nav>
    <a href="#">Accueil</a>
    <a href="#services">Services</a>
    <a href="#clients">Clients</a>
    <a href="#contact">Contact</a>
    <a href="index-pt.html" style="background:#fff;color:#0096f2;padding:5px 10px;border-radius:5px;">🇵🇹 PT</a>
  </nav>
</header>

<section class="hero">
  <h1>Solutions intelligentes en logiciels et support IT</h1>
  <p>Nous desservons le Luxembourg et la Belgique avec qualité et confiance.</p>
</section>

<section class="services" id="services">
  <div class="service">
    <img src="https://via.placeholder.com/80?text=POS" alt="POS">
    <h3>Vente de logiciels</h3>
    <p>Systèmes POS, facturation et gestion pour votre entreprise.</p>
  </div>
  <div class="service">
    <img src="https://via.placeholder.com/80?text=IT" alt="IT Support">
    <h3>Assistance IT</h3>
    <p>Support technique, maintenance, réseaux et sécurité.</p>
  </div>
</section>

<section class="clients" id="clients">
  <h2>Nos Clients</h2>
  <div class="clients-logos">
    <img src="https://via.placeholder.com/100x60?text=Client+1" alt="Client 1" />
    <img src="https://via.placeholder.com/100x60?text=Client+2" alt="Client 2" />
    <img src="https://via.placeholder.com/100x60?text=Client+3" alt="Client 3" />
  </div>
</section>

<footer id="contact">
  <p>Email : info@alphalogiciel.com | WhatsApp : +352 621 514746</p>
  <p>&copy; 2025 Alpha Logiciel. Tous droits réservés.</p>
</footer>

<a href="https://wa.me/352621514746" class="whatsapp" target="_blank">💬</a>

</body>
</html>/* End custom CSS */