.prod-wrap {
  font-family: 'Segoe UI', Arial, sans-serif;
  color: #1C2833;
  max-width: 100%;
  margin: 0;
}

/* ── HERO ── */
.prod-hero {
  background: linear-gradient(135deg, #1C2833 0%, #17405A 55%, #D96F1E 100%);
  border-radius: 16px;
  padding: 2.5rem 2rem 2rem;
  color: white;
  margin-bottom: 2rem;
  position: relative;
  overflow: hidden;
}
.prod-hero::before {
  content: '🔍';
  position: absolute;
  right: 2rem;
  top: 50%;
  transform: translateY(-50%);
  font-size: 80px;
  opacity: 0.12;
  pointer-events: none;
}
.prod-hero-badge {
  display: inline-block;
  background: rgba(217,111,30,0.35);
  border: 1px solid rgba(217,111,30,0.6);
  color: #F5B97A;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  padding: 4px 14px;
  border-radius: 20px;
  margin-bottom: 0.9rem;
}
.prod-hero h2 {
  font-size: 28px;
  font-weight: 800;
  margin: 0 0 0.5rem;
  line-height: 1.2;
  max-width: 560px;
}
.prod-hero p {
  font-size: 14px;
  color: rgba(255,255,255,0.72);
  line-height: 1.75;
  max-width: 540px;
  margin: 0 0 1.25rem;
}
.prod-hero-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.prod-hero-pill {
  background: rgba(255,255,255,0.1);
  border: 1px solid rgba(255,255,255,0.2);
  color: white;
  font-size: 12px;
  font-weight: 600;
  padding: 4px 14px;
  border-radius: 20px;
}

/* ── STATS ── */
.prod-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 2rem;
}
.prod-stat {
  background: white;
  border: 1px solid #E8E6E0;
  border-radius: 12px;
  padding: 1.25rem 1rem;
  text-align: center;
}
.prod-stat .icon { font-size: 24px; display: block; margin-bottom: 6px; }
.prod-stat .val { font-size: 26px; font-weight: 800; color: #1C2833; display: block; line-height: 1; margin-bottom: 4px; }
.prod-stat .lbl { font-size: 11px; font-weight: 600; color: #aaa; text-transform: uppercase; letter-spacing: 1px; display: block; }

/* ── SECTION TITRE ── */
.prod-section-titre {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #D96F1E;
  margin-bottom: 1.25rem;
  margin-top: 2rem;
  padding-bottom: 0.5rem;
  border-bottom: 2px solid #F2F3F4;
}

/* ── DESCRIPTION ── */
.prod-desc-bloc {
  background: #F8F9FA;
  border: 1px solid #E8E6E0;
  border-radius: 12px;
  padding: 1.75rem 2rem;
  margin-bottom: 2rem;
}
.prod-desc-bloc p {
  font-size: 14px;
  color: #444;
  line-height: 1.8;
  margin: 0 0 1rem;
}
.prod-desc-bloc p:last-child { margin: 0; }

/* ── GRILLE SECTEURS ── */
.prod-secteurs {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-bottom: 2rem;
}
.prod-secteur {
  background: white;
  border: 1px solid #E8E6E0;
  border-radius: 10px;
  padding: 0.9rem 1rem;
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  font-weight: 600;
  color: #1C2833;
}
.prod-secteur .emoji { font-size: 20px; flex-shrink: 0; }

/* ── POINTS FORTS ── */
.prod-atouts {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  margin-bottom: 2rem;
}
.prod-atout {
  background: white;
  border: 1px solid #E8E6E0;
  border-radius: 12px;
  padding: 1.25rem 1.5rem;
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.prod-atout .icon { font-size: 22px; flex-shrink: 0; margin-top: 2px; }
.prod-atout h4 { font-size: 13px; font-weight: 700; color: #1C2833; margin: 0 0 4px; }
.prod-atout p { font-size: 13px; color: #666; line-height: 1.6; margin: 0; }

/* ── BLOC ACHAT ── */
.prod-achat {
  background: linear-gradient(135deg, #1C2833 0%, #17405A 100%);
  border-radius: 16px;
  padding: 2rem;
  color: white;
  margin-bottom: 2rem;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 2rem;
  align-items: center;
}
.prod-achat h3 { font-size: 20px; font-weight: 800; margin: 0 0 0.5rem; }
.prod-achat p { font-size: 13px; color: rgba(255,255,255,0.65); line-height: 1.7; margin: 0 0 1rem; }
.prod-achat-liste {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.prod-achat-liste li {
  font-size: 13px;
  color: rgba(255,255,255,0.75);
  display: flex;
  align-items: center;
  gap: 8px;
}
.prod-achat-liste li::before { content: '✔'; color: #6BC47A; font-weight: 700; }
.prod-prix-bloc {
  background: rgba(255,255,255,0.07);
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 12px;
  padding: 1.5rem 2rem;
  text-align: center;
  flex-shrink: 0;
}
.prod-prix-bloc .label { font-size: 11px; color: rgba(255,255,255,0.45); text-transform: uppercase; letter-spacing: 1px; display: block; margin-bottom: 6px; }
.prod-prix-bloc .prix { font-size: 38px; font-weight: 800; color: #F5B97A; line-height: 1; display: block; }
.prod-prix-bloc .ttc { font-size: 12px; color: rgba(255,255,255,0.35); display: block; margin-top: 4px; }
.prod-prix-bloc .acces { font-size: 12px; color: rgba(255,255,255,0.55); display: block; margin-top: 10px; padding-top: 10px; border-top: 1px solid rgba(255,255,255,0.1); }

/* ── BOUTON PAYPAL ── */
.prod-paypal-wrap {
  background: white;
  border: 1px solid #E8E6E0;
  border-radius: 14px;
  padding: 2rem;
  margin-bottom: 2rem;
  text-align: center;
}
.prod-paypal-wrap h3 { font-size: 17px; font-weight: 700; color: #1C2833; margin: 0 0 0.5rem; }
.prod-paypal-wrap p { font-size: 13px; color: #888; margin: 0 0 1.5rem; line-height: 1.6; }
.prod-paypal-securite {
  display: flex;
  justify-content: center;
  gap: 1.5rem;
  margin-top: 1.25rem;
  flex-wrap: wrap;
}
.prod-paypal-securite span {
  font-size: 12px;
  color: #aaa;
  display: flex;
  align-items: center;
  gap: 5px;
}

/* ── UTILISATION ── */
.prod-usage {
  background: linear-gradient(135deg, #17405A, #1C2833);
  border-radius: 12px;
  padding: 1.75rem 2rem;
  color: white;
  margin-bottom: 2rem;
}
.prod-usage h3 { font-size: 16px; font-weight: 700; margin: 0 0 1rem; }
.prod-usage-grille { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.prod-usage-item { text-align: center; }
.prod-usage-item .icon { font-size: 28px; display: block; margin-bottom: 6px; }
.prod-usage-item strong { display: block; font-size: 13px; font-weight: 700; color: white; margin-bottom: 3px; }
.prod-usage-item span { font-size: 12px; color: rgba(255,255,255,0.55); line-height: 1.5; display: block; }

/* ── LEGAL ── */
.prod-legal {
  background: #F8F9FA;
  border: 1px solid #E8E6E0;
  border-radius: 10px;
  padding: 1.25rem 1.5rem;
  font-size: 12px;
  color: #888;
  line-height: 2;
  text-align: center;
  margin-bottom: 1rem;
}
.prod-legal strong { color: #555; }

/* ── RESPONSIVE ── */
@media (max-width: 650px) {
  .prod-stats { grid-template-columns: repeat(2, 1fr); }
  .prod-secteurs { grid-template-columns: repeat(2, 1fr); }
  .prod-atouts { grid-template-columns: 1fr; }
  .prod-achat { grid-template-columns: 1fr; }
  .prod-usage-grille { grid-template-columns: 1fr; }
  .prod-hero h2 { font-size: 22px; }
}
@media (min-width: 651px) and (max-width: 900px) {
  .prod-stats { grid-template-columns: repeat(2, 1fr); }
  .prod-secteurs { grid-template-columns: repeat(2, 1fr); }
}

/* ── Compléments gabarit produit (site OVH) ── */
.prod-hero h1 { font-size: 28px; font-weight: 800; margin: 0 0 0.5rem; line-height: 1.2; max-width: 620px; }
.prod-hero h1 .sous { display: block; font-size: 17px; font-weight: 500; color: rgba(255,255,255,0.65); margin-top: 6px; }
.prod-hero.icone-ssi::before { content: '🔥'; }
.prod-hero.icone-aps::before { content: '🛡️'; }
.prod-hero.icone-jeu::before { content: '🎲'; }
.prod-hero.icone-epi::before { content: '🧯'; }
.prod-hero.icone-sst::before { content: '🚑'; }
.prod-hero-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 1.25rem; }
.prod-btn { display: inline-block; background: #D96F1E; color: white; font-size: 14px; font-weight: 700; padding: 12px 24px; border-radius: 8px; text-decoration: none; border: none; cursor: pointer; font-family: inherit; transition: background .15s; }
.prod-btn:hover { background: #B05A18; color: white; }
.prod-btn.sec { background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.3); }
.prod-btn.sec:hover { background: rgba(255,255,255,0.2); }
.prod-btn.sombre { background: #1C2833; }
.prod-btn.sombre:hover { background: #17405A; }

/* Galerie */
.prod-galerie { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 2rem; }
.prod-galerie figure { margin: 0; background: white; border: 1px solid #E8E6E0; border-radius: 12px; overflow: hidden; }
.prod-galerie img { width: 100%; aspect-ratio: 16/10; object-fit: cover; display: block; }
.prod-galerie figcaption { font-size: 12px; color: #777; padding: 8px 12px; }

/* Modules (simulateurs) */
.prod-module { display: grid; grid-template-columns: 340px 1fr; gap: 0; background: white; border: 1px solid #E8E6E0; border-radius: 14px; overflow: hidden; margin-bottom: 16px; }
.prod-module-img { background: #1C2833; position: relative; min-height: 220px; }
.prod-module-img img { width: 100%; height: 100%; object-fit: cover; display: block; position: absolute; inset: 0; }
.prod-module-rep { position: absolute; top: 12px; left: 12px; background: #D96F1E; color: white; font-size: 11px; font-weight: 800; letter-spacing: 1px; padding: 4px 10px; border-radius: 20px; z-index: 1; }
.prod-module-body { padding: 1.4rem 1.6rem; }
.prod-module-body h3 { font-size: 18px; font-weight: 800; margin: 0 0 0.4rem; color: #1C2833; }
.prod-module-body > p { font-size: 13.5px; color: #555; line-height: 1.7; margin: 0 0 0.75rem; }
.prod-liste { list-style: none; margin: 0 0 0.75rem; padding: 0; }
.prod-liste li { display: flex; gap: 8px; font-size: 13px; color: #444; padding: 4px 0; line-height: 1.5; }
.prod-liste li::before { content: '→'; color: #D96F1E; font-weight: 700; flex-shrink: 0; }
.prod-module details { background: #F8F9FA; border: 1px solid #E8E6E0; border-radius: 8px; padding: 0.6rem 0.9rem; margin-bottom: 0.9rem; }
.prod-module summary { cursor: pointer; font-size: 13px; font-weight: 700; color: #17405A; }
.prod-module details p { font-size: 13px; color: #555; line-height: 1.7; margin: 0.6rem 0 0; }
.prod-module details h4 { font-size: 12px; text-transform: uppercase; letter-spacing: 1px; color: #888; margin: 0.8rem 0 0.3rem; }
.prod-demo { display: inline-flex; align-items: center; gap: 6px; background: #17405A; color: white; font-size: 13px; font-weight: 700; padding: 9px 18px; border-radius: 7px; text-decoration: none; }
.prod-demo:hover { background: #D96F1E; color: white; }
.prod-tag-off { display: inline-block; font-size: 11px; font-weight: 600; color: #888; background: #F2F3F4; padding: 3px 10px; border-radius: 20px; }

/* Grille tarifs */
.prod-tarifs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-bottom: 1.25rem; align-items: stretch; }
.prod-tarif { background: white; border: 1px solid #E8E6E0; border-radius: 14px; padding: 1.5rem; display: flex; flex-direction: column; }
.prod-tarif.vedette { background: linear-gradient(135deg, #1C2833, #17405A); color: white; border-color: transparent; }
.prod-tarif .surtitre { font-size: 11px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: #D96F1E; margin-bottom: 4px; }
.prod-tarif.vedette .surtitre { color: #F5B97A; }
.prod-tarif h3 { font-size: 18px; font-weight: 800; margin: 0 0 0.5rem; }
.prod-tarif .montant { font-size: 34px; font-weight: 800; color: #1C2833; line-height: 1; margin: 0.25rem 0 0.25rem; }
.prod-tarif.vedette .montant { color: #F5B97A; }
.prod-tarif .montant small { font-size: 13px; font-weight: 500; color: #999; }
.prod-tarif.vedette .montant small { color: rgba(255,255,255,0.5); }
.prod-tarif > p { font-size: 13px; color: #666; line-height: 1.6; margin: 0 0 0.75rem; }
.prod-tarif.vedette > p { color: rgba(255,255,255,0.7); }
.prod-tarif ul { list-style: none; margin: 0 0 1rem; padding: 0; flex: 1; }
.prod-tarif li { font-size: 13px; color: #555; padding: 4px 0; display: flex; gap: 8px; }
.prod-tarif li::before { content: '✔'; color: #2E9E5B; font-weight: 700; }
.prod-tarif.vedette li { color: rgba(255,255,255,0.8); }
.prod-tarif.vedette li::before { color: #6BC47A; }
.prod-durees { width: 100%; border-collapse: collapse; margin: 0 0 1rem; font-size: 13px; }
.prod-durees td { padding: 7px 4px; border-bottom: 1px solid rgba(255,255,255,0.1); }
.prod-durees td:last-child { text-align: right; font-weight: 700; color: #F5B97A; }
.prod-note { font-size: 12px; color: #888; line-height: 1.8; text-align: center; margin: 0 0 2rem; }

/* Commande : bouton PayPal ou commande par e-mail */
.prod-commande { display: flex; flex-direction: column; align-items: center; gap: 8px; margin-top: auto; }
.prod-commande form { display: inline-grid; justify-items: center; gap: 0.4rem; }
.prod-pp-btn { text-align: center; border: none; border-radius: 0.25rem; min-width: 11.625rem; padding: 0 2rem; height: 2.625rem; font-weight: bold; background-color: #FFD140; color: #000; font-family: "Helvetica Neue", Arial, sans-serif; font-size: 1rem; line-height: 1.25rem; cursor: pointer; }
.prod-pp-btn:hover { background-color: #F2C230; }
.prod-commande .pp-sous { font-size: 0.75rem; color: #888; }
.prod-tarif.vedette .prod-commande .pp-sous { color: rgba(255,255,255,0.5); }
.prod-commande-mail { display: inline-block; background: #D96F1E; color: white; font-size: 14px; font-weight: 700; padding: 11px 22px; border-radius: 8px; text-decoration: none; text-align: center; }
.prod-commande-mail:hover { background: #B05A18; color: white; }
.prod-commande .mail-sous { font-size: 11.5px; color: #999; text-align: center; line-height: 1.5; }
.prod-tarif.vedette .prod-commande .mail-sous { color: rgba(255,255,255,0.5); }

/* Bandeau démo / info */
.prod-bandeau { background: #FDF3EA; border: 1px solid rgba(217,111,30,0.3); border-left: 4px solid #D96F1E; border-radius: 8px; padding: 1rem 1.5rem; margin-bottom: 2rem; font-size: 13.5px; color: #555; line-height: 1.7; }
.prod-bandeau strong { color: #B05A18; }

@media (max-width: 900px) {
  .prod-module { grid-template-columns: 1fr; }
  .prod-module-img { min-height: 200px; aspect-ratio: 16/9; }
  .prod-tarifs { grid-template-columns: 1fr; }
}
@media (max-width: 650px) {
  .prod-galerie { grid-template-columns: 1fr 1fr; }
  .prod-hero h1 { font-size: 22px; }
}

.prod-atouts.trois { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 900px) { .prod-atouts.trois { grid-template-columns: 1fr; } }

/* Sélecteur de durée (pack SSIAP) */
.prod-duree-choix { display: flex; flex-wrap: wrap; gap: 6px; margin: 0.25rem 0 0.9rem; }
.prod-duree-choix button { flex: 1 1 auto; background: rgba(255,255,255,0.07); border: 1px solid rgba(255,255,255,0.2); color: rgba(255,255,255,0.85); font-family: inherit; font-size: 13px; font-weight: 600; padding: 8px 10px; border-radius: 8px; cursor: pointer; }
.prod-duree-choix button:hover { background: rgba(255,255,255,0.14); }
.prod-duree-choix button[aria-checked="true"] { background: rgba(245,185,122,0.16); border-color: #F5B97A; color: #fff; }
.prod-tarif .montant { margin-bottom: 0.9rem; }
.prod-tarif .montant .sd { font-size: 20px; font-weight: 700; }