:root {
      --pamplemousse: #ff7a00;
      --pamplemousse-soft: #fff5ed;
      --dark-text: #2d3436;
    }

    body {
      font-family: 'Inter', sans-serif;
      color: var(--dark-text);
      line-height: 1.6;
    }

    h1,
    h2,
    h3,
    .navbar-brand {
      font-family: 'Poppins', sans-serif;
    }

    /* Navbar */
    .navbar {
      transition: all 0.3s;
      padding: 20px 0;
    }

    .navbar.scrolled {
      background: rgba(255, 255, 255, 0.95);
      backdrop-filter: blur(10px);
      padding: 10px 0;
      border-bottom: 1px solid #eee;
    }

    .nav-link {
      font-weight: 500;
      color: var(--dark-text) !important;
      margin: 0 10px;
    }

    .nav-link:hover {
      color: var(--pamplemousse) !important;
    }

    /* Hero Section */
    .hero {
      padding: 160px 0 100px;
      background: linear-gradient(135deg, #fff 50%, var(--pamplemousse-soft) 100%);
    }

    .text-pamplemousse {
      color: var(--pamplemousse);
    }

    /* Sections */
    section {
      padding: 80px 0;
    }

    .bg-soft {
      background-color: var(--pamplemousse-soft);
    }

    /* Cards & Buttons */
    .card {
      border: none;
      border-radius: 15px;
      transition: transform 0.3s;
      box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
    }

    .card:hover {
      transform: translateY(-5px);
    }

    .btn-pamplemousse {
      background: var(--pamplemousse);
      color: white;
      border: none;
      padding: 12px 30px;
      border-radius: 8px;
      font-weight: 600;
    }

    .btn-pamplemousse:hover {
      background: #e66e00;
      color: white;
    }

    /* Modal Form */
    .form-control:focus {
      border-color: var(--pamplemousse);
      box-shadow: 0 0 0 0.25rem rgba(255, 122, 0, 0.25);
    }

    /* Style des labels flottants */
    .form-floating>.form-control:focus~label,
    .form-floating>.form-control:not(:placeholder-shown)~label {
      color: var(--pamplemousse);
    }

    .form-control:focus,
    .form-select:focus {
      border-color: var(--pamplemousse);
      box-shadow: 0 0 0 0.25rem rgba(255, 122, 0, 0.15);
    }

    /* Checkboxes façon "petits boutons" pour le mobile */
    .custom-card-check {
      border: 1px solid #dee2e6;
      padding: 10px 10px 10px 35px;
      border-radius: 8px;
      transition: all 0.2s;
      cursor: pointer;
    }

    .custom-card-check:hover {
      background-color: var(--pamplemousse-soft);
      border-color: var(--pamplemousse);
    }

    .form-check-input:checked {
      background-color: var(--pamplemousse);
      border-color: var(--pamplemousse);
    }

    /* Responsive ajustements */
    @media (max-width: 576px) {
      .modal-dialog {
        margin: 0.5rem;
      }

      .btn-pamplemousse {
        width: 100%;
      }
    }

    .text-pamplemousse {
      color: #ff7a00 !important;
      transition: color 0.2s ease-in-out;
    }

    .text-pamplemousse:hover {
      color: #e66e00 !important;
      text-decoration: underline;
    }

    /* ZONE Annimation */
    .hero-animated-bg {
      position: absolute;
      /* --- Positionnement à droite --- */
      top: 50%;
      /* Centre verticalement par rapport à la section */
      right: 5%;
      /* Ajustez ce pourcentage pour décaler plus ou moins du bord droit */

      /* --- Dimensions de l'image (ajustez selon vos besoins) --- */
      width: 700px;
      height: 700px;

      /* --- Chargement de l'image --- */
      background-image: url('../img/logo.png');
      /* Vérifiez votre chemin ! */
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;

      /* --- Style et Sécurité --- */
      opacity: 0.2;
      /* Très subtil en fond */
      z-index: 0;
      /* Place l'image derrière le texte */
      pointer-events: none;
      /* Permet de cliquer à travers l'image */

      /* --- Liaison de l'Animation mise à jour --- */
      animation: rotate-on-spot 60s linear infinite;
      /* Rotation très lente */

      /* --- Point d'origine de la rotation (Crucial pour le "sur place") --- */
      transform-origin: center center;
      /* La rotation se fait autour du centre de l'image elle-même */

      /* --- Position initiale pour le centrage vertical --- */
      transform: translateY(-50%);
    }

    /* --- Nouvelle Keyframe pour la rotation sur place --- */
    @keyframes rotate-on-spot {
      from {
        /* On conserve le centrage vertical initial */
        transform: translateY(-50%) rotate(0deg);
      }

      to {
        /* On conserve le centrage vertical initial */
        transform: translateY(-50%) rotate(360deg);
      }
    }

    @media (max-width: 768px) {
      .hero-animated-bg {
        width: 400px;
        height: 400px;
        right: 2%;
        /* Plus proche du bord sur mobile */
      }
    }

    /* FIN ZONE Annimation */
    .maquette-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    border-radius: 10px;
}

.maquette-card:hover {
    transform: translateY(-10px) scale(1.02);
    box-shadow: 0 15px 30px rgba(255, 122, 0, 0.15) !important; /* Ombre légère couleur pamplemousse */
}