body{font-family:Arial,sans-serif;line-height:1.6;margin:0;padding:0;color:#333}
header{background:violet;color:rgb(0, 0, 0);padding:1rem}

/* Navigation */
nav ul{list-style:none;display:flex;gap:1rem;justify-content:center}
nav a{color:rgb(0, 0, 0);text-decoration:none}

/* accueil */
.banner{background:linear-gradient(rgba(0, 0, 0, 0.7),rgba(0, 0, 0, 0.7)),url('../images/drapeau.webp')center/cover no-repeat;color:rgb(255, 255, 255);text-align:center;padding:5rem 1rem;margin-bottom:1rem}
h1{text-align:center;margin-bottom:1rem}.banner p{font-size:1.2rem;max-width:800px;margin:0 auto 2rem}
.btn {display: inline-block;background: rgba(238, 130, 238, 0.733);color: rgb(0, 0, 0);padding: 0.8rem 1.5rem;text-decoration: none;border-radius: 5px;transition: background 0.3s;}
.btn:hover {background: #a3009b;}
.services-home {padding: 2rem;text-align: center;}
.services-grid {display: grid;grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));gap: 2rem;margin: 2rem 0;}
.service-card {background: white;border: 1px solid #ddd;padding: 2rem;border-radius: 5px;box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);}
.service-card i {font-size: 2.5rem;color: #0078d7;margin-bottom: 1rem;}
.temoignages {background: #f9f9f9;padding: 2rem;text-align: center;}
.temoignages-grid {display: grid;grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));gap: 2rem;margin: 2rem 0;}
.temoignage-card {background: white;padding: 1.5rem;border-radius: 5px;box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);}
.temoignage-card p {font-style: italic;margin-bottom: 1rem;}
.temoignage-auteur {font-weight: bold;color: #0078d7;}
.cta {text-align: center;padding: 3rem 1rem;background: #0076d74b;color: rgb(0, 0, 0);}
.cta h2 {margin-bottom: 1rem;}

/* footer */
footer {text-align: center;padding: 1rem;background: #f4f4f4;}

/* services */
.services{display: flex;flex-wrap: wrap;justify-content: center;gap: 1rem;padding: 3rem 2rem;max-width: 1200px;margin: 0 auto;}
.service-card {background: #fff;border-radius: 10px;box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);padding: 2rem;width: 300px;text-align: center;transition: transform 0.3s ease, box-shadow 0.3s ease;}
.service-card:hover {transform: translateY(-10px);box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);}
.service-card i {font-size: 2.5rem;color: #4a6fa5;margin-bottom: 1.5rem;}
.service-card h3 {font-size: 1.5rem;margin-bottom: 1rem;color: #2c3e50;}
.service-card p {color: #000000;font-size: 0.95rem;}
@media (max-width: 768px) {
    .services {flex-direction: column;align-items: center;}}

/* Tarifs */
.tarifs {font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;max-width: 1000px;margin: 2rem auto;padding: 0 1rem;color: #000000;}
.tarifs h1 {text-align: center;margin-bottom: 1rem;color: #2c3e50;font-size: 2.2rem;}
.tarifs > p {text-align: center;margin-bottom: 2rem;font-size: 1.1rem;color: #000000;}
.tarifs-table { width: 100%; border-collapse: collapse; margin-bottom: 2rem; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); border-radius: 8px; overflow: hidden;}
.tarif-header {background-color: #3498db;color: white;font-weight: bold;}
.tarif-header div {padding: 1rem;text-align: left;}
.tarif-row {border-bottom: 1px solid #ecf0f1;}
.tarif-row:last-child {border-bottom: none;}
.tarif-row div {padding: 1rem;}
.tarif-service {font-weight: 600;color: #000000;}
.tarif-prix {color: #e74c3c;font-weight: bold; }
.tarif-delai {color: #000000;}
.tarif-description {color: #000000;font-size: 0.9rem;}
.tarif-row:hover {background-color: #f9f9f9;}
.call-to-action {text-align: center;margin-top: 2rem;}
.call-to-action p {font-size: 1.1rem;}
.call-to-action a {color: #3498db;text-decoration: none;font-weight: bold;border-bottom: 2px solid #3498db;transition: all 0.3s ease;}
.call-to-action a:hover {color: #2980b9;border-bottom-color: #2980b9;}
@media (max-width: 768px) {
    .tarif-header, .tarif-row {display: flex;flex-direction: column;}
    .tarif-header div, .tarif-row div {display: block;text-align: left;padding: 0.5rem;border: none;border-bottom: 1px solid #ecf0f1;}
    .tarif-header {display: none;}
    .tarif-row div::before {content: attr(data-label);font-weight: bold;display: inline-block;width: 120px;color: #2c3e50;}
    .tarif-service { font-weight: bold; }.tarif-prix { color: #e74c3c; }.tarif-delai { color: #27ae60; }}

/* Contact */
.contact {padding: 2rem;max-width: 1200px;margin: 0 auto;}
.contact h1 {text-align: center; margin-bottom: 2rem;}
.contact-container {display: grid;grid-template-columns: 1fr 1fr;gap: 2rem;margin-bottom: 2rem;}
.contact-form, .contact-info {background: white;padding: 2rem;border-radius: 5px;box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);}
.form-group {margin-bottom: 1rem;}
.form-group label {display: block;margin-bottom: 0.5rem;font-weight: bold;}
.form-group input,.form-group select,.form-group textarea { width: 100%; padding: 0.5rem; border: 1px solid #ddd; border-radius: 5px;}
.contact-info ul {list-style: none;padding: 0;}
.contact-info li { margin-bottom: 1rem;display: flex;align-items: center;}
.contact-info i {margin-right: 0.5rem;color: #0078d7;}
.social-links {display: flex;gap: 1rem;margin-top: 1rem;}
.social-links a {display: flex;align-items: center;justify-content: center;width: 35px;height: 35px;background: #0078d7;color: white;border-radius: 50%;text-decoration: none;}
.contact-map {margin-top: 2rem;}
.contact-map iframe {border-radius:5px;box-shadow:0 2px 5px rgba(0,0,0,0.1)}
.alert{padding: 1rem;margin-bottom:1rem;border-radius:5px;text-align:center}
.alert.success{background:#d4edda;color:#155724}
.alert.error{background:#f8d7da;color:#721c24}
@media (max-width: 768px){.contact-container{grid-template-columns: 1fr}}