/* Variables globales */
:root {
  --color-primary: #5A9BD3;
  --color-primary-light: #dff4ff;
  --color-primary-dark: #2B6DAF;
  --color-accent: #F5A623;
  --color-bg: #ffffff;
  --color-text: #333333;
  --font-heading: 'Poppins', sans-serif;
  --font-body: 'Open Sans', sans-serif;
}

/* Reset et base */
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family: var(--font-body); color: var(--color-text); background: var(--color-bg); line-height:1.6; max-width: 100vw; }
.container { width:90%; max-width:1200px; margin:0 auto; }
.container-large { width: 100%; margin:0 auto; }
a { text-decoration:none; color: inherit; }
h1 { font-size: 3.5rem; }
h2 { font-size: 2.5rem; margin-bottom: 1rem; }
h3 { font-size: 2rem; }
h4 { font-size: 1.7rem; }
p { font-size: 1.2rem; font-weight: 500;}
s { font-size: 0.9rem; }

/* Top Bar */
.top-bar { background: var(--color-primary); color: #fff; font-size:0.875rem; }
.top-bar .container { display:flex; justify-content:right; padding:0.5rem 0; }
.top-bar a { color: #fff; text-decoration:underline; }

/* ---- HEADER ---- */

/* Header */
.site-header { background-color: transparent !important; border-bottom: none !important; position: fixed; width: 100vw; z-index: 1000; transition: all 0.4s ease; padding: 1rem 0; }
.site-header.scrolled { background-color: #ffffff !important; border-bottom: 1px solid #ddd !important; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); }
.site-header .container { display: flex; align-items: center; justify-content: space-between; }
.logo img { height: 65px; transition: all 0.4s ease; }
.site-header:not(.scrolled) .logo img { filter: brightness(0) invert(1); }
.site-header.scrolled .logo img { filter: none; }
.nav-toggle { display: none; background: none; border: none; font-size: 1.5rem; color: white; }
.site-header.scrolled .nav-toggle { color: black; }
.main-nav ul { list-style: none; display: flex; gap: 1rem; margin: 0; padding: 0; }
.main-nav a { position: relative; transition: color 0.4s; text-decoration: none; }
.site-header:not(.scrolled) .main-nav a { color: white !important; }
.site-header.scrolled .main-nav a { color: black !important; }
.main-nav a:hover { color: var(--color-primary-dark) !important; }

.main-nav a::after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  bottom: -4px;
  width: 100%;
  height: 3px;
  background: var(--color-primary);
  transform: scaleX(0);
  transition: transform 0.2s;
  border-radius: 2px;
}

.main-nav a:hover::after,
.main-nav a:focus::after {
  transform: scaleX(1);
}

.flag {align-self: center; margin-top: -4px; margin-left: 10px;}

/*-----------------------------------*/

/* ---- HERO ---- */

/* Herohome */
.hero-content h1 { font-family: var(--font-heading); color: #fff; margin-bottom: 1rem; position: relative; display: inline-block; }
.hero-content h1::after { content: ''; position: absolute; left: 50%; transform: translateX(-50%); bottom: -0.5rem; width: 70%; height: 5px; background-color:var(--color-primary); border-radius: 2px; }
.hero-content h4 { margin: 1rem; font-weight: 600;}
.btn { display: inline-block; padding: 0.75rem 1.5rem; border-radius: 8px; font-family: var(--font-heading); }
.btn-primary { background: var(--color-primary); color: #fff; }
.btn-primary:hover { background: var(--color-primary-dark); }

/* Heroabout */
.heroabout { background: url('media/heroabout.webp') center/cover no-repeat fixed; color: #fff; display: flex; text-align: center; align-items: center; padding: 4rem 0; min-height: 100vh; }
.heroabout-content h1 { font-family: var(--font-heading); color: #fff; margin-bottom: 1rem; position: relative; display: inline-block; }
.heroabout-content h1::after { content: ''; position: absolute; left: 50%; transform: translateX(-50%); bottom: -0.5rem; width: 70%; height: 5px; background-color:var(--color-primary); border-radius: 2px; }
.heroabout-content h4 { margin: 1rem; font-weight: 600; }
.btnabout { display: inline-block; padding: 0.75rem 1.5rem; border-radius: 8px; font-family: var(--font-heading); }
.btnabout-primary { background: var(--color-primary); color: #fff; }
.btnabout-primary:hover { background: var(--color-primary-dark); }

/* Heroproducts */
.heroproducts { background: url('media/heroproducts.webp') center/cover no-repeat fixed; color: #fff; display: flex; text-align: center; align-items: center; padding: 4rem 0; min-height: 100vh; }
.heroproducts-content h1 { font-family: var(--font-heading); color: #fff; margin-bottom: 1rem; position: relative; display: inline-block; }
.heroproducts-content h1::after { content: ''; position: absolute; left: 50%; transform: translateX(-50%); bottom: -0.5rem; width: 70%; height: 5px; background-color:var(--color-primary); border-radius: 2px; }
.heroproducts-content h4 { margin: 1rem; font-weight: 600; }
.btnproducts { display: inline-block; padding: 0.75rem 1.5rem; border-radius: 8px; font-family: var(--font-heading); }
.btnproducts-primary { background: var(--color-primary); color: #fff; }
.btnproducts-primary:hover { background: var(--color-primary-dark); }

/* Herotech */

.herotech { background: url('media/herotech.webp') center/cover no-repeat fixed; background-position: center 75%; color: #fff; display: flex; text-align: center; align-items: center; padding: 4rem 0; min-height: 100vh; }
.herotech-content h1 { font-family: var(--font-heading); color: #fff; margin-bottom: 1rem; position: relative; display: inline-block; }
.herotech-content h1::after { content: ''; position: absolute; left: 50%; transform: translateX(-50%); bottom: -0.5rem; width: 70%; height: 5px; background-color:var(--color-primary); border-radius: 2px; }
.herotech-content h4 { margin: 1rem; font-weight: 600; }

/* HeroContact */

.heroContact { background: url('media/heropartners.webp') center/cover no-repeat fixed; color: #fff; display: flex; text-align: center; align-items: center; padding: 4rem 0; min-height: 100vh; }
.heroContact-content h1 { font-family: var(--font-heading); color: #fff; margin-bottom: 1rem; position: relative; display: inline-block; }
.heroContact-content h1::after { content: ''; position: absolute; left: 50%; transform: translateX(-50%); bottom: -0.5rem; width: 70%; height: 5px; background-color:var(--color-primary); border-radius: 2px; }
.heroContact-content h4 { margin: 1rem; font-weight: 600; }

/* Herofaq */

.herofaq { background: url('media/herofaq.jpeg') center/cover no-repeat fixed; color: #fff; display: flex; text-align: center; align-items: center; padding: 4rem 0; min-height: 100vh; }
.herofaq-content h1 { font-family: var(--font-heading); color: #fff; margin-bottom: 1rem; position: relative; display: inline-block; }
.herofaq-content h1::after { content: ''; position: absolute; left: 50%; transform: translateX(-50%); bottom: -0.5rem; width: 70%; height: 5px; background-color:var(--color-primary); border-radius: 2px; }
.herofaq-content h4 { margin: 1rem; font-weight: 600; }

@media (max-width:1024px) {
.hero, .heroabout, .heroproducts, .herotech, .heroContact, .herofaq { padding:3rem 1rem; min-height:100vh; background-attachment:scroll; background-size:cover; background-position:center; }
}

@media (max-width:800px) {
.hero-content h4 {text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7);}
}

@media (max-width:600px) {
.hero, .heroabout, .heroproducts, .herotech, .heroContact, .herofaq { padding:2rem 1rem; min-height:100vh; background-size:cover; background-position:center; }
}

/* ----------------------------------------------*/

/* ---- HOME PAGE ---- */

/* Benefits */
.benefits{padding:3rem 0;background:#fff}
.processus::after{content:'';display:block;width:50%;height:6px;background-color:var(--color-primary);margin:0 auto;border-radius:2px;margin-top:5%}
.benefits h4{text-align:center;font-family:var(--font-heading);font-weight:700;line-height:2;margin-bottom:2rem;font-style:italic;color:var(--color-text);margin-left:11%;margin-right:11%;max-width:80%;}
.benefits h4::after{content:'';display:block;width:70%;height:6px;background-color:var(--color-primary);margin:0 auto;border-radius:2px;margin-top:10%;margin-bottom:10%}
.benefits-list{display:flex;justify-content:center;align-items:stretch;gap:2rem;padding:2rem;margin:0 3rem}
.benefit-item{background:#f0f0f0;border-radius:8px;padding:2.5rem;flex:1;display:flex;flex-direction:column;justify-content:center;text-align:center;transition:transform .3s ease;font-size:1.1rem;line-height:1.8}
.benefits-list .benefit-item:nth-child(2){background-color:var(--color-primary);color:var(--color-bg);flex:1;padding:3.5rem;box-shadow:0 0 25px rgba(0,0,0,0.4);transform:scale(1.15);z-index:1}
.benefit-item h3{margin-bottom:1.2rem;font-weight:700}
.benefits-list .benefit-item:nth-child(2) h3{font-size:2.2rem;position:relative;top:-1rem}
.benefit-item p{font-size:1.1rem;line-height:1.7}
.benefit-item:nth-child(2) p{font-size:1.25rem}
@media(max-width:768px){.benefits-list{flex-direction:column;margin:0 1rem}.benefit-item{flex:none;margin-bottom:2rem;transform:none!important}.benefits-list .benefit-item:nth-child(2){flex:none;padding:2rem}.benefits h4{font-size:1.4rem;line-height:1.7;margin-left:5%;margin-right:5%}}



/* Processus - comment ça marche */

.processus { padding:4rem 0; background:#f9f9f9; }
.processus-title { background-color:var(--color-primary-dark); color:white; padding:7px 6px 0px 6px; border-radius:4px; }
.processus h2 { text-align:center; font-family:var(--font-heading); font-weight:700; margin-bottom:7rem; font-size:2.5rem; }
.processus-timeline { display:flex; justify-content:space-between; align-items:flex-start; position:relative; padding:0 2rem; }
.processus-timeline::before { content:''; position:absolute; top:90px; left:50px; right:50px; height:2px; background:var(--color-primary-dark); z-index:1; }
.processus-step { display:flex; flex-direction:column; align-items:center; position:relative; z-index:2; width:22%; min-width:200px; }
.arrow-right { width:3rem; height:3rem; margin-top:0.7rem; }
.processus-icon { width:80px; height:80px; background:white; border-radius:50%; display:flex; justify-content:center; align-items:center; border:2px solid var(--color-primary-dark); box-shadow:0 4px 12px rgba(0,0,0,0.1); margin-bottom:1.5rem; }
.processus-bubble strong { font-size:1.1rem; color:var(--color-primary-dark); margin-bottom:0.5rem; }
.processus-icon img { width:40px; height:40px; object-fit:contain; }
.processus-bubble { background:white; border:2px solid var(--color-primary-dark); color:#333; padding:1.8rem; border-radius:12px; width:100%; box-shadow:0 4px 16px rgba(0,0,0,0.1); text-align:center; justify-content:center; min-height:200px; display:flex; flex-direction:column; transition:transform 0.3s ease; }
.processus-bubble:hover { transform:translateY(-5px); box-shadow:0 6px 20px rgba(0,0,0,0.15); }

@media (max-width:992px) {
.processus-timeline { flex-wrap:wrap; justify-content:center; gap:3rem; padding:0; }
.processus-timeline::before { display:none; }
.processus-step { width:45%; min-width:250px; }
.processus h2 { margin-bottom:3rem; }
}

@media (max-width:576px) {
.processus-timeline { flex-direction:column; align-items:center; position:relative; }
.processus-timeline::before { display:block; position:absolute; left:50%; top:0; bottom:0; width:2px; background:var(--color-primary-dark); z-index:0; }
.processus-step { width:100%; max-width:320px; margin-bottom:3rem; text-align:center; }
.processus-icon { margin-bottom:1rem; z-index:2; background:#fff; }
.processus-bubble { min-height:auto; padding:1.2rem; margin:0 auto; }
.processus-arrow { display:none; }
.processus-title { font-size: 2rem; }
}




/* ----------------------------------- */

/* ---- ABOUT PAGE ---- */

/* Valeurs */
#valeurs { padding: 60px 40px; text-align: center; margin-bottom: 30px; font-size: 2rem;}
.valeurs-container { display: flex; justify-content: space-between; gap: 40px; margin-top: 40px; flex-wrap: wrap;}
.valeur { flex: 1; padding: 0 20px; position: relative; }
#valeurs h2 { margin-bottom: 6rem; }
.mot-clef { background-color: var(--color-primary-dark); color: white; padding: 2px 6px; border-radius: 4px; }
.valeur h4 { margin-bottom: 10px; }
.valeur p { line-height: 1.6; }
.valeur:not(:last-child)::after { content: ""; position: absolute; top: 0; right: 0; height: 100%; width: 5px; background-color: var(--color-primary); border-radius: 2px;}
@media (max-width:576px) {
#valeurs { padding:40px 20px; }
.valeurs-container { position:relative; display:flex; flex-direction:column; gap:50px; }
.valeurs-container::before { content:""; position:absolute; left:50%; top:40px; bottom:40px; width:2px; background:#ddd; }
.valeur { position:relative; width:100%; display:flex; flex-direction:column; max-width:85%; }
.valeur:nth-child(odd){ align-self:flex-start; text-align:left; }
.valeur:nth-child(even){ align-self:flex-end; text-align:left; }
.valeur:not(:last-child)::after { content: ""; position: absolute; top: 0; right: 0; height: 100%; width: 5px; background-color: var(--color-bg); border-radius: 2px;} /* supprime les anciens points/traits bleus */
.valeur h4 { font-size:1.2rem; font-weight:700; margin-bottom:8px; color:#222; }
.valeur p { font-size:0.95rem; line-height:1.6; color:#444; background:#fff; padding:15px; border-radius:10px; box-shadow:0 2px 6px rgba(0,0,0,0.08); }
}

/* Atouts */
#atouts{font-size:2rem;margin-bottom:30px;text-align:center;}
#atouts>h2{margin-bottom:6rem;font-weight:700;color:var(--color-text);}
.atout{display:flex;align-items:center;width:70vw;padding:3rem 2rem;}
.atout:nth-child(odd){background-color:var(--color-primary-light);flex-direction:row;margin-left:auto;margin-right:0;color:#222; margin-bottom: 1rem; margin-top: 1rem;}
.atout:nth-child(even){background-color:var(--color-primary);color:#fff;flex-direction:row-reverse;margin-left:0;margin-right:auto;padding:4rem 3rem;}
.atout h4{flex-basis:30%;margin:0;text-align:left;padding:1rem;}
.atout p{flex-basis:70%;line-height:1.6;margin:0 2rem 0 0;text-align:left;padding:2rem;border-left:3px solid var(--color-primary);}
.atout:nth-child(even) p{margin:0 0 0 2rem;border-left:none;border-right:3px solid var(--color-primary-light);text-align:right;}
@media(max-width:900px){
  .atout{flex-direction:column!important;width:90vw!important;margin:0 auto 3rem!important;padding:1.5rem!important;}
  .atout p,.atout h4{flex-basis:auto!important;margin:0 0 1rem 0!important;text-align:center!important;border:none!important;}
}

/* Notre Equipe */
#equipe{font-size:2rem;margin-bottom:30px;text-align:center}
#equipe::after{content:'';display:block;width:50%;height:6px;background-color:var(--color-primary);margin:5% auto 0 auto;border-radius:2px}
#equipe>h2{margin-bottom:6rem;margin-top:6rem;font-weight:700;color:var(--color-text)}
.mot-clef{background-color:var(--color-primary-dark);color:white;padding:2px 6px;border-radius:4px}
.equipe-container{display:flex;gap:40px;justify-content:space-evenly;flex-wrap:wrap;}
.membre{text-align:center}
.photo{width:180px;height:180px;border-radius:50%;background-size:cover;background-position:center;background-color:#ccc;margin:0 auto 1rem}
.membre:nth-child(1) .photo{background-image:url(media/felbcell.png)}
.membre:nth-child(2) .photo{background-image:url(media/maxbcell.webp)}
.membre:nth-child(3) .photo{background-image:url(media/person.svg)}
.membre:nth-child(4) .photo{background-image:url(media/minabcell.webp); background-size:180%;}
.membre p{margin:0;color:var(--color-text)}
@media(max-width:1200px){.equipe-container{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.equipe-container{grid-template-columns:repeat(2,1fr)}.photo{width:130px;height:130px}}
@media(max-width:480px){.equipe-container{grid-template-columns:repeat(2,1fr)}.photo{width:110px;height:110px}}





/* ----------------------------------- */

/* ---- PRODUCTS PAGE ---- */

/* Reset de base */
body { font-family: Arial, sans-serif; line-height: 1.6; margin: 0; padding: 0; color: #333; }
section { padding: 40px 20px; }

/* Section showing */
#showing { display: flex; align-items: center; justify-content: space-between; gap: 40px; padding: 40px 5%; }
.showing-text { flex: 1; max-width: 50%; }
.showing-text h2 { font-size: 2rem; margin: 20px 0; }
.showing-text p { line-height: 1.6; }
.keywords { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.keywords li { background: #f0f0f0; padding: 5px 10px; border-radius: 15px; font-size: 0.9rem; }
.buttons { margin-top: 20px; display: flex; flex-wrap: wrap; gap: 15px; }
.btn { display: inline-block; padding: 10px 18px; border-radius: 6px; background: #007bff; color: #fff; text-decoration: none; transition: 0.3s; }
.btn:hover { background: #0056b3; }
.showing-image { flex: 1; display: flex; justify-content: center; }
.showing-image img { max-width: 100%; height: auto; border-radius: 6px; }

/* Section trusted */
.trusted { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 30px; padding: 40px 5%; background-color: #f9f9f9; }
.trusted-left h3 { margin: 0; font-size: 1.5rem; }
.trusted-right { display: flex; flex-wrap: wrap; justify-content: center; gap: 30px; }
.trusted-right img { max-height: 40px; height: auto; display: block; }

/* Section products */
#products { display: flex; flex-wrap: wrap; padding: 40px 5%; gap: 20px; }
.product-list { flex: 1 1 200px; max-width: 200px; }
.product-list p:not(:first-child) { display: block; width: 100%; margin-bottom: 5px; padding: 4px; cursor: pointer; }
.product-list p:hover:not(:first-child) { text-decoration: underline; }
.product-list p.active { text-decoration: underline; }
.product-details { flex: 3 1 400px; padding-left: 20px; }
.product-details.default { display: none; }
.detail h4 { margin-top: 0; }
.product-buttons { margin-top: 15px; }
.separator { border: none; height: 1px; background: #ccc; margin: 40px 0; }
.compare table { width: 100%; border-collapse: collapse; }
.compare th, .compare td { border: 1px solid #ccc; padding: 8px; text-align: center; }
.compare th { background: #f0f0f0; }

/* Section services */
.service-list { flex: 1 1 200px; max-width: 200px; }
.service-list p:not(:first-child) { display: block; width: 100%; margin-bottom: 5px; padding: 4px; cursor: pointer; }
.service-list p:hover:not(:first-child) { text-decoration: underline; }
.service-list p.active { text-decoration: underline; }

/* Responsive */
@media (max-width: 1024px) {
  #showing { gap: 20px; }
  .showing-text, .showing-image { max-width: 100%; }
  .showing-image img { max-width: 320px; }
  .trusted-right img { max-height: 35px; }
}

@media (max-width: 768px) {
  #showing { flex-direction: column; text-align: center; gap: 20px; }
  .showing-text { max-width: 100%; }
  .showing-image img { display: none; }
  .buttons { justify-content: center; }
  .trusted-right img { max-height: 30px; }
  #products { flex-direction: column; }
  .product-details { padding-left: 0; }
  .service-list { margin-top: 20px; }
  .btn { width: 80%; text-align: center; }
}

@media (max-width: 480px) {
  section { padding: 20px 10px; }
  .showing-text h2 { font-size: 1.4rem; }
  .btn { width: 100%; font-size: 0.9rem; padding: 8px 12px; }
  .keywords { gap: 5px; }
  .keywords li { font-size: 0.8rem; padding: 4px 8px; }
  .compare th, .compare td { font-size: 0.8rem; padding: 5px; }
  .showing-image img { max-width: 220px; }
  .trusted-right img { max-height: 25px; }
}

@media (max-width:768px){
  #products{flex-direction:column;align-items:center}
  .product-list{width:100%;text-align:center;margin-bottom:20px}
  .product-list p.active{color:#0073e6;font-weight:600}
  .product-details{padding-left:0}
}




/* Products Details */

.product-spec-container{margin:20px 0;padding:20px;border:1px solid #d1d5db;background:#e7e4e4;border-radius:10px}
.product-info h2{font-size:1.4rem;font-weight:600;color:#111827;margin-bottom:15px}
.specs-table-compact,.specs-table{width:100%;border-collapse:collapse;margin-top:10px;font-size:.95rem}
.specs-table-compact th,.specs-table th{text-align:left;padding:8px;background:#f3f4f6;color:#111827;font-weight:600;border:1px solid #d1d5db}
.specs-table-compact td,.specs-table td{padding:8px;border:1px solid #d1d5db;color:#374151}
.specs-table th[colspan="2"]{text-align:center;background:#e5e7eb;color:#111827;font-size:1rem}
.product-info a{display:inline-block;margin-top:10px;color:#1e3a8a;font-weight:500;text-decoration:none;transition:color .2s ease}
.product-info a:hover{text-decoration:underline;color:#111827}
.product-details .default{display:block;text-align:center;margin:60px auto;padding:30px;border:2px dashed #ccc;border-radius:10px;background:#fafafa;color:#333;max-width:500px}
.product-details .default h3{margin-bottom:15px;font-size:1.4rem;color:var(--color-primary-dark)}
.product-details .default p{margin-bottom:20px;font-size:1rem;color:#555}
.product-header{position:relative;margin-bottom:20px}
.product-header h2{margin:0}
.product-certifications{position:absolute;top:0;right:0;display:flex;gap:8px}
.product-certifications img{height:32px;width:auto;object-fit:contain}
.sticker-stock{display:inline-block;background:#4CAF50;color:#fff;font-weight:bold;font-size:.75em;padding:4px 12px;border-radius:14px;text-transform:uppercase;box-shadow:0 2px 5px rgba(0,0,0,.25);border:1px solid rgba(0,0,0,.15)}
.sticker-restock{display:inline-block;background:#2e7d32;color:#fff;font-weight:bold;font-size:.75em;padding:4px 12px;border-radius:14px;text-transform:uppercase;box-shadow:0 2px 5px rgba(0,0,0,.25);border:1px solid rgba(0,0,0,.15)}
.download-btn{display:inline-flex;align-items:center;gap:6px;margin-top:12px;padding:12px 20px;font-size:1rem;font-weight:600;border:none;border-radius:10px;text-decoration:none;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 10px rgba(0,0,0,.15);background:var(--color-primary);color:#111!important}
.download-btn:hover{background:var(--color-primary-dark);color:var(--color-primary-light)!important;text-decoration:underline}
.product-slider{position:relative;width:100%;max-width:800px;margin:0 auto 20px;overflow:hidden;border-radius:12px;background:#f2f2f2}
.product-slider .slider-track{display:flex;transition:transform .4s ease-in-out}
.product-slider img{width:100%;height:400px;object-fit:contain;object-position:center;flex-shrink:0;background:#f2f2f2;transform:scale(1.2)}
.product-slider img:nth-child(4){transform:scale(1)}
.product-slider .slider-btn{position:absolute;top:50%;transform:translateY(-50%);background:rgba(30,58,138,.8);color:#fff;border:none;border-radius:50%;cursor:pointer;padding:10px 14px;font-size:1.5rem;transition:background .3s ease;z-index:10}
.product-slider .slider-btn.prev{left:10px}
.product-slider .slider-btn.next{right:10px}
.product-slider .slider-btn:hover{background:rgba(30,58,138,1)}
.sticker{display:inline-block;margin-left:10px;padding:4px 8px;background-color:#ff4747;color:#fff;font-size:.9em;font-weight:bold;border-radius:6px;text-transform:uppercase;box-shadow:0 2px 4px rgba(0,0,0,.2);animation:pulse 1.5s infinite}
@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.1)}100%{transform:scale(1)}}
.product-description{max-width:800px;margin:0 auto;font-family:Arial,sans-serif;line-height:1.7;color:#444}
.product-description .intro p{margin-bottom:1.2em;font-size:1.1em;text-align:justify;color:#333}
.product-description .intro p:first-child{font-size:1.2em;font-weight:bold;border-left:4px solid #4CAF50;padding-left:10px;margin-bottom:1.5em}
.product-description .services{margin-top:1.5em}
.product-description .service-item{position:relative;display:inline-block;background:#f9f9f9;border:1px solid #ddd;padding:6px 12px 6px 30px;border-radius:6px;font-weight:500;margin-bottom:.6em}
.product-description .service-item::before{content:"✔";position:absolute;left:10px;color:#4CAF50;font-weight:bold}
.product-description .service-item:hover{background:#eefaf0}
.product-description .service-item2{position:relative;display:inline-block;background:#f9f9f9;border:1px solid #ddd;padding:6px 12px 6px 12px;border-radius:6px;font-weight:500;margin-bottom:.6em}
.product-description .service-item2:hover{background:#eefaf0}
@media(max-width:768px){.product-header{display:flex;flex-direction:column;align-items:flex-start;gap:10px;position:relative}
.product-header h2{font-size:1.2rem}
.product-certifications{position:static;justify-content:flex-start;flex-wrap:wrap}
.product-certifications img{height:24px}
.product-slider img{height:250px;transform:scale(1)}
.specs-table th,.specs-table td,.specs-table-compact th,.specs-table-compact td{font-size:.8rem;padding:6px}
.download-btn{width:100%;text-align:center;font-size:.9rem;padding:10px}}
@media(max-width:480px){.product-header h2{font-size:1rem}
.product-slider img{height:200px}
.specs-table th,.specs-table td,.specs-table-compact th,.specs-table-compact td{font-size:.75rem;padding:4px}}



/* ---- TECHNOLOGY PAGE ---- */

/* tech */

#cellules {display:flex;align-items:flex-start;justify-content:space-between;gap:2rem;padding:3rem 2rem;background:linear-gradient(135deg,#bccfdf,#d9dde3);border-radius:1rem;box-shadow:0 8px 20px rgba(0,0,0,0.08);max-width:1200px;margin:2rem auto;}
#cellules .content {flex:1 1 60%;}
#cellules header {margin-bottom:1.5rem;}
#cellules h2 {font-size:1.8rem;font-weight:700;color:#1f2937;margin-bottom:0.5rem;}
#cellules header p {font-size:1rem;line-height:1.6;color:#4b5563;}
#cellules ul {list-style:none;padding:0;margin:0 0 1.5rem 0;}
#cellules ul li {position:relative;padding-left:1.5rem;margin-bottom:0.75rem;font-size:1rem;color:#374151;line-height:1.5;}
#cellules ul li::before {content:"✔";position:absolute;left:0;top:0.1rem;color:#10b981;font-size:1rem;}
#cellules .content p {font-weight:500;color:#111827;margin-top:1rem;}
#cellules figure {flex:1 1 40%;margin:0;text-align:center;}
#cellules img {max-width:100%;border-radius:0.75rem;box-shadow:0 6px 16px rgba(0,0,0,0.12);}
#cellules figcaption {margin-top:0.5rem;font-size:0.9rem;color:#6b7280;}
@media (max-width:900px){#cellules {flex-direction:column;text-align:center;}#cellules figure {margin-top:1.5rem;}#cellules ul li {text-align:left;}}


#assemblage {display:flex;align-items:flex-start;justify-content:space-between;gap:2rem;padding:3rem 2rem;background:linear-gradient(135deg,#bccfdf,#d9dde3);border-radius:1rem;box-shadow:0 8px 20px rgba(0,0,0,0.08);max-width:1200px;margin:2rem auto;}
#assemblage .content {flex:1 1 60%;}
#assemblage header {margin-bottom:1.5rem;}
#assemblage h2 {font-size:1.8rem;font-weight:700;color:#1f2937;margin-bottom:0.5rem;}
#assemblage header p {font-size:1rem;line-height:1.6;color:#4b5563;}
#assemblage ul {list-style:none;padding:0;margin:0 0 1.5rem 0;}
#assemblage ul li {position:relative;padding-left:1.5rem;margin-bottom:0.75rem;font-size:1rem;color:#374151;line-height:1.5;}
#assemblage ul li::before {content:"✔";position:absolute;left:0;top:0.1rem;color:#10b981;font-size:1rem;}
#assemblage .content p {font-weight:500;color:#111827;margin-top:1rem;}
#assemblage figure {flex:1 1 40%;margin:0;text-align:center;}
#assemblage img {max-width:100%;border-radius:0.75rem;box-shadow:0 6px 16px rgba(0,0,0,0.12);}
#assemblage figcaption {margin-top:0.5rem;font-size:0.9rem;color:#6b7280;}
@media (max-width:900px){#assemblage {flex-direction:column;text-align:center;}#assemblage figure {margin-top:1.5rem;}#assemblage ul li {text-align:left;}}


#bms {display:flex;align-items:flex-start;justify-content:space-between;gap:2rem;padding:3rem 2rem;background:linear-gradient(135deg,#bccfdf,#d9dde3);border-radius:1rem;box-shadow:0 8px 20px rgba(0,0,0,0.08);max-width:1200px;margin:2rem auto;}
#bms .content {flex:1 1 60%;}
#bms header {margin-bottom:1.5rem;}
#bms h2 {font-size:1.8rem;font-weight:700;color:#1f2937;margin-bottom:0.5rem;}
#bms header p {font-size:1rem;line-height:1.6;color:#4b5563;}
#bms ul {list-style:none;padding:0;margin:0 0 1.5rem 0;}
#bms ul li {position:relative;padding-left:1.5rem;margin-bottom:0.75rem;font-size:1rem;color:#374151;line-height:1.5;}
#bms ul li::before {content:"✔";position:absolute;left:0;top:0.1rem;color:#10b981;font-size:1rem;}
#bms .content p {font-weight:500;color:#111827;margin-top:1rem;}
#bms figure {flex:1 1 40%;margin:0;text-align:center;}
#bms img {max-width:100%;border-radius:0.75rem;box-shadow:0 6px 16px rgba(0,0,0,0.12);}
#bms figcaption {margin-top:0.5rem;font-size:0.9rem;color:#6b7280;}
@media (max-width:900px){#bms {flex-direction:column;text-align:center;}#bms figure {margin-top:1.5rem;}#bms ul li {text-align:left;}}

#securite {display:flex;align-items:flex-start;justify-content:space-between;gap:2rem;padding:3rem 2rem;background:linear-gradient(135deg,#bccfdf,#d9dde3);border-radius:1rem;box-shadow:0 8px 20px rgba(0,0,0,0.08);max-width:1200px;margin:2rem auto;}
#securite .content {flex:1 1 60%;}
#securite header {margin-bottom:1.5rem;}
#securite h2 {font-size:1.8rem;font-weight:700;color:#1f2937;margin-bottom:0.5rem;}
#securite header p {font-size:1rem;line-height:1.6;color:#4b5563;}
#securite ul {list-style:none;padding:0;margin:0 0 1.5rem 0;}
#securite ul li {position:relative;padding-left:1.5rem;margin-bottom:0.75rem;font-size:1rem;color:#374151;line-height:1.5;}
#securite ul li::before {content:"✔";position:absolute;left:0;top:0.1rem;color:#10b981;font-size:1rem;}
#securite figure {flex:1 1 40%;margin:0;text-align:center;}
#securite img {max-width:100%;border-radius:0.75rem;box-shadow:0 6px 16px rgba(0,0,0,0.12);}
#securite figcaption {margin-top:0.5rem;font-size:0.9rem;color:#6b7280;}
@media (max-width:900px){#securite {flex-direction:column;text-align:center;}#securite figure {margin-top:1.5rem;}#securite ul li {text-align:left;}}


#resume {display:flex;align-items:center;justify-content:center;flex-direction:column;gap:2rem;padding:4rem 2rem;background:linear-gradient(135deg,#bccfdf,#d9dde3);border-radius:1rem;box-shadow:0 6px 16px rgba(0,0,0,0.06);max-width:1000px;margin:3rem auto;text-align:center;}
#resume .content {max-width:700px;}
#resume h2 {font-size:2rem;font-weight:800;color:#111827;margin-bottom:1rem;}
#resume p {font-size:1.15rem;line-height:1.7;color:#374151;}
#resume figure {margin:0;}
#resume img {max-width:100%;border-radius:1rem;box-shadow:0 8px 20px rgba(0,0,0,0.1);transition:transform 0.4s ease;}
#resume img:hover {transform:scale(1.03);}
#resume figcaption {margin-top:0.75rem;font-size:1rem;font-weight:500;color:#4b5563;}



/*-----------------------------------*/

/* ---- CONTACT PAGE ---- */

.container {max-width: 1200px;margin: 0 auto;padding: 0 20px;}
.contact-info {background-color: #f1f1f1;padding: 60px 0;position: relative;}
.info-container {display: flex;justify-content: space-between;flex-wrap: wrap;}
.info-item {flex: 1;min-width: 300px;padding: 20px;text-align: center;position: relative;}
.info-item:not(:last-child)::after {content: '';position: absolute;right: 0;top: 50%;transform: translateY(-50%);height: 70%;width: 1px;background-color: var(--color-primary-dark);}
.icon {width: 70px;height: 70px;border-radius: 50%;display: flex;align-items: center;justify-content: center;margin: 0 auto 20px;color: white;font-size: 28px;}
.info-item h3 {color: #000;margin-bottom: 15px;font-size: 1.5rem;}
.info-item p {color: #777;margin-bottom: 20px;font-size: 1rem;line-height: 1.5;}
.info-item .details {color: var(--color-primary-dark);font-weight: 600;font-size: 1.1rem;}
.icon img { width: 60px; height: 60px; object-fit: contain; }
.contact-form-section {padding: 60px 0;position: relative;}
.contact-form-section::before {content: "";position: absolute;top: 0;left: 50%;transform: translateX(-50%);width: 90%;height: 1px;background-color: #e0e0e0;}
.section-title {text-align: center;margin-bottom: 40px;color: var(--color-primary-dark);font-size: 2rem;position: relative;}
.section-title::after {content: "";position: absolute;bottom: -10px;left: 50%;transform: translateX(-50%);width: 50px;height: 3px;background-color: var(--color-primary-dark);}
.form-container {max-width: 800px;margin: 0 auto;background: white;padding: 40px;border-radius: 10px;box-shadow: 0 5px 20px rgba(0, 0, 0, 0.08);}
.contact-form {display: grid;grid-template-columns: 1fr 1fr;gap: 25px;}
.form-group {display: flex;flex-direction: column;}
.form-group.full-width {grid-column: span 2;}
label {margin-bottom: 8px;font-weight: 600;color: #444;}
input, textarea {padding: 12px 15px;border: 1px solid #ddd;border-radius: 5px;font-size: 1rem;transition: border-color 0.3s;}
input:focus, textarea:focus {outline: none;border-color: var(--color-primary-dark);box-shadow: 0 0 0 2px rgba(10, 61, 98, 0.1);}
textarea {min-height: 150px;resize: vertical;}
.btn {background-color: var(--color-primary-dark);color: white;border: none;padding: 14px 25px;font-size: 1.1rem;border-radius: 5px;cursor: pointer;font-weight: 600;text-transform: uppercase;letter-spacing: 1px;}
@media (max-width: 768px) {
.contact-form {grid-template-columns: 1fr;}
.form-group.full-width {grid-column: span 1;}
.info-container {flex-direction: column;}
.info-item {min-width: 100%;padding: 30px 0;}
.info-item:not(:last-child)::after {content: none;}
.info-item:not(:last-child) {border-bottom: 1px solid var(--color-primary-dark);padding-bottom: 30px;}
}

/* ----------------------------------*/

/* ----FAQ---- */

.cases{background:#f9fafb;padding:3rem 1rem;font-family:"Inter","Segoe UI",sans-serif;color:#1f2937}
.cases .container{max-width:900px;margin:0 auto}
.cases-list{display:grid;gap:1.5rem}
.cases-list article{background:#fff;border-radius:1rem;padding:1.5rem 2rem;box-shadow:0 4px 12px rgba(0,0,0,.05);cursor:pointer;transition:transform .2s,box-shadow .2s;overflow:hidden}
.cases-list article:hover{transform:translateY(-3px);box-shadow:0 6px 20px rgba(0,0,0,.08)}
.cases-list h3{font-size:1.2rem;font-weight:600;margin:0;color:#111827;position:relative;padding-right:1.5rem}
.cases-list h3::after{content:"＋";position:absolute;right:0;top:0;font-weight:bold;transition:transform .1s}
.cases-list p{line-height:1.6;font-size:.95rem;margin:.5rem 0 0;color:#374151;opacity:0;max-height:0;transition:all .2s}
.cases-list article.active p{opacity:1;max-height:300px;margin-top:.8rem}
.cases-list article.active h3::after{content:"–";transform:rotate(180deg)}
.cases-list strong{color:var(--color-primary-dark);font-weight:600}

/* ----------------------------------*/

/* ----FOOTER---- */

/* Footer */
.site-footer{background:var(--color-primary);color:#ece9e9;padding:2rem 0;font-family:'Segoe UI',sans-serif;font-size:.95rem}
.footer-container{width:90%;max-width:1200px;margin:0 auto;display:flex;flex-wrap:wrap;gap:2rem;justify-content:space-between;align-items:flex-start}
.footer-box{flex:1;min-width:250px;padding:1rem}
.footer-box p{margin:.4rem 0;line-height:1.6}
.logofoot{width:180px;margin-bottom:1rem;filter:brightness(0) invert(1);height:auto;display:block}
.social-icons img{height:40px;margin:0 .4rem;transition:transform .3s ease,opacity .3s ease}
.social-icons img:hover{transform:scale(1.1);opacity:.8}
.footer-box a{color:#d3cfcf;text-decoration:none;transition:color .3s ease}
.footer-box a:hover{color:#fff;}
.footer-container .footer-box:nth-child(3){text-align:right}
.logo-social-wrap{display:flex;flex-direction:column;align-items:center}
@media(max-width:768px){.footer-container{flex-direction:column;text-align:center}
.footer-container .footer-box:nth-child(3){text-align:center}
.logofoot{width:140px;max-width:80%;margin:0 auto}
.social-icons{margin-top:.5rem}
.social-icons img{height:36px}}
@media(max-width:480px){.logofoot{width:120px;max-width:70%;margin:0}
.logo-social-wrap{flex-direction:row;justify-content:center;align-items:center;gap:10px}
.social-icons{margin:0}
.social-icons img{height:32px}}




/* ----------------------------------*/

/* Responsive */
@media(max-width:1024px) {
  .hero-grid { grid-template-columns:1fr; }
}
@media(max-width:768px){
.hero-grid,.footer-grid{grid-template-columns:1fr;}

.nav-toggle{display:none}
.ham-menu{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:0.5rem;position:absolute;top:1.5rem;right:1.5rem;width:2.5rem;height:2.5rem;cursor:pointer;z-index:3;background-color: white; border-radius: 0.5rem;}
.ham-menu .line{background:#000;width:80%;height:0.2rem;border-radius:2px;transition:all .3s ease}
.nav-toggle:checked+.ham-menu .line1{transform:rotate(22.5deg)}
.nav-toggle:checked+.ham-menu .line2{transform:rotate(-22.5deg)}
.main-nav{position:fixed;top:0;right:0;width:70%;max-width:300px;height:100vh;background:#fff;display:flex;flex-direction:column;justify-content:center;transform:translateX(100%);opacity:0;transition:all .3s ease;z-index:2}
.nav-toggle:checked~.main-nav{transform:translateX(0);opacity:1}
.main-nav ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:0;align-items:center}
.main-nav a{color:#000!important;font-size:1.5rem;text-decoration:none;transition:color .2s}
.main-nav a:hover{color:#00bcd4!important}
.site-header .main-nav a { border-top: solid 1px #e6e6e6; padding: 0.8em; display: inline-block; width: 200px;}
.site-header:not(.scrolled) .main-nav a { color: black !important; }
.site-header.scrolled{background:transparent!important;box-shadow:none!important}
.site-header.scrolled{background-color:transparent!important;border-bottom:0!important;box-shadow:unset!important}
.site-header.scrolled .logo{opacity:0;transition:opacity 200ms}
.site-header.scrolled .logo img{filter:brightness(0) invert(1)}
.site-header.scrolled .ham-menu{background-color:white;transition:background-color 300ms}
.site-header.scrolled .main-nav a{color:#000!important}
}



/* Styles pour les écrans de taille moyenne et grande */
@media (min-width: 768px) {
  html {
    font-size: 15px;
  }
  .compare table {font-size: 10px;}
}

/* Styles pour les écrans de grande taille */
@media (min-width: 992px) {
  html {
    font-size: 16px;
  }
  .compare table {font-size: 11px;}
}

/* Styles pour les écrans très larges */
@media (min-width: 1200px) {
  html {
    font-size: 16px;
  }
  .compare table {font-size: 14px;}
}

/* Styles spécifiques pour les petits écrans */
@media (max-width: 767px) {
/* html {
    font-size: 14px;
  }*/
  .valeur { display: flex; }
  .valeur h4 { }
  .valeur:not(:last-child) h4::after { content: ""; position: absolute; top: 0; right: 0; height: 100%; width: 5px; background-color: var(--color-primary); border-radius: 2px;}
  /*.valeur h4::after { content: ""; position: absolute; top: 0; right: 0; height: 100%; width: 5px; background-color: var(--color-primary); border-radius: 2px;}*/
}

/* Styles pour les écrans de très petite taille */
@media (max-width: 480px) {
  html {
    font-size: 11px;
  }
}