:root{--green: #198754;--darkgreen: #0f5132;--yellow: #ffc107;--orange: #fd7e14;--blue: #0d6efd;--dark: #1b2430;} @font-face{font-family: 'Montserrat';src: url('../fonts/Montserrat-Regular.ttf') format('truetype');font-weight: 400;font-style: normal;font-display: swap;} @font-face{font-family: 'Montserrat';src: url('../fonts/Montserrat-Bold.ttf') format('truetype');font-weight: 700;font-style: normal;font-display: swap;} body{font-family: 'Montserrat', 'Segoe UI', sans-serif;background-color: #f8f9fa;color: #212529;scroll-behavior: smooth;margin: 0;padding: 0;line-height: 1.6;} .visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;} h1, h2, h3, h4, h5{font-weight: 600;} .navbar-brand{display: flex;align-items: center;} .navbar-brand img{margin-right: 0;} .navbar-brand span{font-weight: 700 !important;margin-left: 0.5rem;} .navbar-nav .nav-link{position: relative;margin: 0 5px;padding: 8px 15px !important;border-radius: 5px;transition: all 0.3s ease;font-weight: 500;} .navbar-nav .nav-link:hover, .navbar-nav .nav-link:focus{background-color: rgba(255,255,255,0.1);transform: translateY(-1px);} .navbar-nav .nav-link.active{background-color: var(--green);color: white !important;} section{padding-top: 3rem;padding-bottom: 3rem;} .hero-header, .header-gradient{background: linear-gradient(to right, var(--green), var(--darkgreen));color: white;padding: 5rem 2rem;text-align: center;} .hero-header h1, .hero-header h2, .hero-header h3, .hero-header h4, .hero-header h5, .hero-header h6, .header-gradient h1, .header-gradient h2, .header-gradient h3, .header-gradient h4, .header-gradient h5, .header-gradient h6{color: white !important;} .certification-badge{background: linear-gradient(135deg, var(--green), var(--blue));color: #ffffff;padding: 20px;border-radius: 12px;margin: 25px auto;text-align: center;border: 2px solid #ffffff;box-shadow: 0 8px 25px rgba(0,0,0,0.15);max-width: 600px;animation: pulse-subtle 4s infinite ease-in-out;} .certification-badge h3, .certification-badge strong, .certification-badge span, .certification-badge small{color: #ffffff !important;text-shadow: 0 2px 4px rgba(0,0,0,0.3);} .certification-badge h3{font-weight: 700;font-size: 1.5rem;} @keyframes pulse-subtle{0%{transform: scale(1);} 50%{transform: scale(1.02);} 100%{transform: scale(1);}} .afrique-badge{background: linear-gradient(135deg, var(--yellow), var(--orange));color: black;padding: 10px 20px;border-radius: 25px;font-weight: bold;display: inline-block;margin-bottom: 15px;font-size: 1.1rem;} .afrique-highlight{background: linear-gradient(135deg, var(--yellow), var(--orange));color: #000000;padding: 20px;border-radius: 12px;margin: 20px 0;text-align: center;border: 2px solid #ffffff;box-shadow: 0 8px 25px rgba(0,0,0,0.15);} .afrique-highlight h4{color: #000000 !important;font-weight: 700;} .activity-badge{background: var(--green);color: #fff;padding: 8px 15px;border-radius: 20px;font-size: .9rem;display: inline-block;margin: 5px;transition: transform 0.2s ease, box-shadow 0.2s ease;} .activity-badge:hover{transform: translateY(-2px);box-shadow: 0 4px 8px rgba(0,0,0,0.15);} .service-card{transition: transform .3s ease;height: 100%;border: 0;box-shadow: 0 4px 10px rgba(0,0,0,0.1);border-radius: 12px;} .service-card:hover{transform: translateY(-8px);} .card-afrique{border: 0;box-shadow: 0 4px 10px rgba(0,0,0,0.1);border-radius: 12px;transition: transform 0.3s ease;height: 100%;} .card-afrique:hover{transform: translateY(-5px);} .img-uniforme{height: 280px;object-fit: cover;width: 100%;border-radius: 8px;box-shadow: 0 4px 12px rgba(0,0,0,0.1);transition: transform 0.3s ease;} .img-uniforme:hover{transform: scale(1.02);} .service-image{width: 100%;max-height: 220px;object-fit: cover;border-radius: 8px;transition: transform 0.3s ease, box-shadow 0.3s ease;} .service-image:hover{transform: scale(1.05);box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);} .destinations-grid{display: grid;grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));gap: 20px;margin: 40px 0;} .destination-card{background: white;padding: 25px;border-radius: 12px;box-shadow: 0 4px 15px rgba(0,0,0,0.1);border: 2px solid transparent;transition: all 0.3s ease;text-align: center;color: #000;text-decoration: none;display: block;} .destination-card:hover, .destination-card:focus{transform: translateY(-6px);border-color: var(--green);text-decoration: none;color: #000;box-shadow: 0 8px 25px rgba(0,0,0,0.15);} .simulateur-section{background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);border-radius: 12px;padding: 2rem;margin: 2rem 0;border: 1px solid #dee2e6;} .loading-spinner{display: none;text-align: center;padding: 1rem;} .spinner-border{width: 2rem;height: 2rem;} .btn-k2f{background-color: var(--green);color: white;border: none;font-weight: 500;transition: all 0.3s ease-in-out;} .btn-k2f:hover{background-color: var(--darkgreen);transform: translateY(-2px);} .img-fluid{transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;} .img-fluid:hover{transform: scale(1.02);box-shadow: 0 8px 25px rgba(0,0,0,0.15);} footer{background-color: var(--dark);color: white;font-size: 0.9rem;} footer a{color: white;text-decoration: none;transition: color 0.2s ease;} footer a:hover{text-decoration: underline;color: var(--green);} .back-to-top{position: fixed;bottom: 20px;left: 20px;background: var(--green);color: white;width: 50px;height: 50px;border-radius: 50%;display: flex;align-items: center;justify-content: center;text-decoration: none;box-shadow: 0 4px 12px rgba(0,0,0,0.2);opacity: 0;transition: opacity 0.3s, transform 0.3s;z-index: 9998;} .back-to-top.visible{opacity: 1;} .back-to-top:hover{transform: translateY(-3px);background: var(--darkgreen);} blockquote{position: relative;padding-left: 2rem;border-left: 4px solid var(--yellow);} blockquote::before{content: '"';position: absolute;left: 10px;top: -10px;font-size: 3rem;color: var(--yellow);opacity: 0.3;font-family: Georgia, serif;} .legal-info{transition: all 0.3s ease;background: #f8f9fa !important;color: #333333 !important;} .legal-info:hover{transform: translateY(-3px);box-shadow: 0 6px 15px rgba(0,0,0,0.1);} ul li{transition: transform 0.2s ease;} ul li:hover{transform: translateX(5px);} a{transition: color 0.2s ease;} .legal-content{background: white;color: #333;padding: 2rem;border-radius: 8px;box-shadow: 0 4px 12px rgba(0,0,0,0.1);} .legal-content h2{color: var(--green);margin-top: 1.5rem;margin-bottom: 1rem;padding-bottom: 0.5rem;border-bottom: 1px solid #e9ecef;} .legal-content a{color: var(--green);text-decoration: none;} .legal-content a:hover{text-decoration: underline;} .table-of-contents{background: #f8f9fa;padding: 1.5rem;border-radius: 8px;margin-bottom: 2rem;} .table-of-contents ul{list-style-type: none;padding-left: 0;} .table-of-contents li{margin-bottom: 0.5rem;} .table-of-contents a{color: var(--green);text-decoration: none;} .table-of-contents a:hover{text-decoration: underline;} .section-anchor{scroll-margin-top: 80px;} .bg-light h1, .bg-light h2, .bg-light h3, .bg-light h4, .bg-light h5, .bg-light h6, .card h1, .card h2, .card h3, .card h4, .card h5, .card h6{color: var(--green);} @keyframes fadeInUp{from{opacity: 0;transform: translateY(20px);} to{opacity: 1;transform: translateY(0);}} .fade-in-up{animation: fadeInUp 0.5s ease-out;} @media (max-width: 768px){.destinations-grid{grid-template-columns: 1fr;gap: 15px;} .certification-badge{margin: 15px auto;padding: 15px;} .simulateur-section{padding: 1rem;} .navbar-brand span{display: inline !important;} .hero-header, .header-gradient{padding: 3rem 1rem;} section{padding-top: 2rem;padding-bottom: 2rem;}} @media print{.floating-buttons, .back-to-top{display: none !important;} .navbar{position: static !important;}} .hero-title{font-size: 2.6rem;font-weight: 700;color: #ffffff !important;text-align: center;margin-bottom: 1rem;} .hero-subtitle{font-size: 1.25rem;color: #f1f1f1;text-align: center;margin-bottom: 2rem;} .hero-section::before{background: rgba(0, 0, 0, 0.45) !important;} .hero-section h1, .hero-section h2, .hero-section p{color: #ffffff !important;text-shadow: 0 0 8px rgba(0,0,0,0.35);} .services-hero::before{background: rgba(0, 0, 0, 0.45) !important;} .services-hero h1, .services-hero h2, .services-hero p{color: #ffffff !important;text-shadow: 0 0 8px rgba(0,0,0,0.35);} .flag-band{position: absolute;top: 0;left: 0;right: 0;height: 8px;z-index: 1;} header{position: relative !important;}