/* HEADER */
    .header {
	        background: linear-gradient(135deg, #0d1b4b 0%, #1a2e6e 100%);
		    color: white;
		        text-align: center;
			    padding: 30px 20px 20px;
			      }
			        .header h1 { font-size: 1.4em; letter-spacing: 2px; text-transform: uppercase; margin-bottom: 6px; }
				  .header .levels { font-size: 3em; font-weight: 900; line-height: 1; }
				    .n1 { color: #4caf50; }
				      .n2 { color: #ff9800; }
				        .n3 { color: #f44336; }
					  .sep { color: #ccc; }
					    .header .subtitle {
						        display: inline-block;
							    background: #1a3a8f;
							        color: #fff;
								    font-weight: bold;
								        font-size: 1em;
									    letter-spacing: 1px;
									        padding: 6px 18px;
										    border-radius: 4px;
										        margin: 10px 0 14px;
											    text-transform: uppercase;
											      }
											        .header p { font-size: 0.92em; color: #c5cfe8; max-width: 420px; margin: 0 auto; }

												  /* COLUMNS */
												  .columns {
													      display: flex;
													          gap: 0;
														      background: transparent;
														          padding: 20px 10px;
															      max-width: 1000px;
															          margin: 0 auto;
																      flex-wrap: wrap;
																        }
																	  .col {
																		      flex: 1 1 200px;
																		          background: transparent;
																			      border-radius: 8px;
																			          margin: 8px;
																				      overflow: hidden;
																				          box-shadow: none;
																					    }

																					      .col-header {
																						          text-align: center;
																							      padding: 12px 8px 8px;
																							          font-weight: bold;
																								    }
																								      .col-n1 .col-header { background: #e8f5e9; border-bottom: 3px solid #4caf50; }
																								        .col-n2 .col-header { background: #fff3e0; border-bottom: 3px solid #ff9800; }
																									  .col-n3 .col-header { background: #ffebee; border-bottom: 3px solid #f44336; }

																									    .col-header .badge {
																										        display: inline-block;
																											    font-size: 1em;
																											        font-weight: 900;
																												    border-radius: 4px;
																												        padding: 2px 10px;
																													    color: white;
																													        margin-bottom: 4px;
																														  }
																														    .col-n1 .badge { background: #4caf50; }
																														      .col-n2 .badge { background: #ff9800; }
																														        .col-n3 .badge { background: #f44336; }

																															  .col-header .role-title { font-size: 0.8em; text-transform: uppercase; letter-spacing: 1px; color: #555; margin-top: 2px; }

																															    .col-avatar { text-align: center; padding: 14px 8px 8px; font-size: 2.8em; }

																															      .section { padding: 10px 14px; border-bottom: 1px solid #f0f0f0; }
																															        .section-title {
																																	    font-size: 0.78em;
																																	        font-weight: bold;
																																		    text-transform: uppercase;
																																		        letter-spacing: 1px;
																																			    display: flex;
																																			        align-items: center;
																																				    gap: 6px;
																																				        margin-bottom: 6px;
																																					  }
																																					    .col-n1 .section-title { color: #388e3c; }
																																					      .col-n2 .section-title { color: #e65100; }
																																					        .col-n3 .section-title { color: #c62828; }

																																						  .section ul { padding-left: 0; list-style: none; }
																																						    .section ul li {
																																							        font-size: 0.7em;
																																								    padding: 2px 0 2px 16px;
																																								        position: relative;
																																									    color: #333;
																																									        line-height: 1.4;
																																										  }
																																										    .section ul li::before { content: "•"; position: absolute; left: 0; color: #888; }

																																										      .section.examples ul li::before { content: "✔"; color: #4caf50; }

																																										        .objectif { font-size: 0.7em; color: #333; line-height: 1.5; }

																																											  .mot-ordre {
																																												      text-align: center;
																																												          padding: 10px;
																																													      font-weight: bold;
																																													          font-size: 0.7em;
																																														      text-transform: uppercase;
																																														          letter-spacing: 1px;
																																															    }
																																															      .col-n1 .mot-ordre { background: #e8f5e9; color: #388e3c; }
																																															        .col-n2 .mot-ordre { background: #fff3e0; color: #e65100; }
																																																  .col-n3 .mot-ordre { background: #ffebee; color: #c62828; }

																																																    /* FLUX */
																																																    .flux {
																																																	        max-width: 1000px;
																																																		    margin: 0 auto 10px;
																																																		        padding: 0 18px;
																																																			    display: flex;
																																																			        gap: 14px;
																																																				    flex-wrap: wrap;
																																																				      }
																																																				        .flux-box {
																																																						    flex: 1 1 260px;
																																																						        background: white;
																																																							    border-radius: 8px;
																																																							        box-shadow: 0 2px 8px rgba(0,0,0,0.07);
																																																								    overflow: hidden;
																																																								      }
																																																								        .flux-title {
																																																										    background: #D2232B;
																																																										        color: white;
																																																											    font-weight: bold;
																																																											        font-size: 0.9em;
																																																												    text-transform: uppercase;
																																																												        letter-spacing: 1px;
																																																													    padding: 10px 16px;
																																																													        text-align: center;
																																																														  }
																																																														    .flux-content {
																																																															        padding: 16px;
																																																																    display: flex;
																																																																        align-items: flex-start;
																																																																	    gap: 6px;
																																																																	        justify-content: center;
																																																																		    flex-wrap: wrap;
																																																																		      }
																																																																		        .flux-node {
																																																																				    display: flex;
																																																																				        flex-direction: column;
																																																																					    align-items: center;
																																																																					        gap: 4px;
																																																																						    min-width: 80px;
																																																																						      }
																																																																						        .flux-circle {
																																																																								    width: 40px; height: 40px;
																																																																								        border-radius: 50%;
																																																																									    display: flex; align-items: center; justify-content: center;
																																																																									        font-weight: 900; color: white; font-size: 1em;
																																																																										  }
																																																																										    .fn1 { background: #4caf50; }
																																																																										      .fn2 { background: #ff9800; }
																																																																										        .fn3 { background: #f44336; }
																																																																											  .flux-label { font-size: 0.72em; color: #444; text-align: center; line-height: 1.3; max-width: 85px; }
																																																																											    .flux-arrow { font-size: 1.4em; color: #888; margin-top: 10px; }
																																																																											      .flux-note { font-size: 0.78em; color: #555; margin-top: 10px; padding: 0 8px 8px; text-align: center; line-height: 1.4; }

																																																																											        /* TABLE */
																																																																											        .table-box { flex: 1 1 280px; }
																																																																												  .table-title {
																																																																													      background: #D2232B;
																																																																													          color: white;
																																																																														      font-weight: bold;
																																																																														          font-size: 0.9em;
																																																																															      text-transform: uppercase;
																																																																															          letter-spacing: 1px;
																																																																																      padding: 10px 16px;
																																																																																          text-align: center;
																																																																																	    }
																																																																																	      table { width: 100%; border-collapse: collapse; font-size: 0.82em; }
																																																																																	        th { background: #f0f0f0; padding: 7px 10px; font-weight: bold; border: 1px solid #ddd; text-align: center; }
																																																																																		  th.n1h { color: #4caf50; }
																																																																																		    th.n2h { color: #ff9800; }
																																																																																		      th.n3h { color: #f44336; }
																																																																																		        td { padding: 7px 10px; border: 1px solid #eee; text-align: center; vertical-align: middle; }
																																																																																			  tr:nth-child(even) td { background: #fafafa; }
																																																																																			    .dot { width: 12px; height: 12px; border-radius: 50%; display: inline-block; }
																																																																																			      .dot-green { background: #4caf50; }
																																																																																			        .dot-orange { background: #ff9800; }
																																																																																				  .dot-red { background: #f44336; }

																																																																																				    /* RETENIR */
																																																																																				    .retenir {
																																																																																					        max-width: 1000px;
																																																																																						    margin: 0 auto 30px;
																																																																																						        padding: 0 18px;
																																																																																							  }
																																																																																							    .retenir-box {
																																																																																								        background: #1a3a8f;
																																																																																									    color: white;
																																																																																									        border-radius: 8px;
																																																																																										    display: flex;
																																																																																										        align-items: center;
																																																																																											    gap: 16px;
																																																																																											        padding: 16px 22px;
																																																																																												    flex-wrap: wrap;
																																																																																												      }
																																																																																												        .retenir-label {
																																																																																														    background: #f9a825;
																																																																																														        color: #1a3a8f;
																																																																																															    font-weight: bold;
																																																																																															        font-size: 0.85em;
																																																																																																    padding: 6px 12px;
																																																																																																        border-radius: 6px;
																																																																																																	    white-space: nowrap;
																																																																																																	        text-transform: uppercase;
																																																																																																		    letter-spacing: 1px;
																																																																																																		      }
																																																																																																		        .retenir-text { flex: 1; }
																																																																																																			  .retenir-text strong { font-size: 1em; display: block; margin-bottom: 4px; }
																																																																																																			    .retenir-text p { font-size: 0.83em; color: #c5d0f0; line-height: 1.5; }