/* ============================================================================
   Module Divi « Liste de valeurs » (Copelectronic / Mak2com)
   Styles du rendu généré par inc/divi-module-valeurs.php
   Couleurs et police héritées du thème (var(--bleufonce), var(--orange), Anton)
   ========================================================================= */
.cop-accordion{
	--cop-dark:var(--bleufonce,#16303d);   /* fond ouvert + textes repliés + icône "+" */
	--cop-orange:var(--orange,#dc733e);    /* arcs décoratifs + icône "×" */
	--cop-white:var(--blanc,#ffffff);
	--cop-line:rgba(22,48,61,.16);         /* filet séparateur */
	--cop-radius:0px;                      /* arrondi des blocs */
	--cop-title-col:32%;                   /* largeur colonne titre (desktop) */
	--cop-toggle:46px;                     /* diamètre du bouton +/× */
	--cop-pad-x:34px;
	--cop-pad-y:24px;

	width:100%;
}
.cop-accordion *{ box-sizing:border-box; }

.cop_valeurs_item {
	margin-bottom: 0 !important;
	border-bottom: 1px solid var(--bleufonce);
}

/* ---- Item ---- */
.cop-accordion__item{
	position:relative;
	border-radius:var(--cop-radius);
	transition:margin .35s ease;
}
.cop-accordion__item + .cop-accordion__item{ border-top:1px solid var(--cop-line); }

/* Fond bleu qui déborde jusqu'au bord DROIT de l'écran (au survol / à l'ouverture),
   alors que le contenu reste centré. NB : suppose une rangée Divi centrée. */
.cop-accordion__item::before{
	content:"";
	position:absolute;
	top:0; bottom:0; left:0;
	right:calc((100% - 100vw) / 2);
	background:var(--cop-dark);
	border-radius:var(--cop-radius);
	opacity:0;
	z-index:0;
	pointer-events:none;
	transition:opacity .35s ease;
}

/* ---- Ligne cliquable : titre | contenu | icône ---- */
.cop-accordion__row{
	position:relative;
	z-index:1;
	display:flex;
	align-items:center;
	gap:28px;
	padding:var(--cop-pad-y) var(--cop-pad-x);
	cursor:pointer;
}

/* ---- Titre ---- */
.cop-accordion__title{
	flex:0 0 var(--cop-title-col);
	margin:0;
	font-family:'Anton',Helvetica,Arial,sans-serif;
	font-weight:400;
	text-transform:uppercase;
	letter-spacing:.5px;
	line-height:1;
	font-size:clamp(26px,3vw,42px);
	color:var(--cop-dark);
	transition:color .35s ease;
}

/* ---- Colonne contenu ---- */
.cop-accordion__content{ flex:1 1 auto; min-width:0; }

/* Extrait (visible replié) */
.cop-accordion__excerpt{
	margin:0;
	overflow:hidden;
	max-height:10em;
	opacity:1;
	color:var(--cop-dark);
	font-family:'Roboto',Arial,sans-serif;
	font-size:clamp(15px,1.15vw,18px);
	line-height:1.4;
	transition:max-height .35s ease, opacity .25s ease, margin .35s ease;
}

/* Détails (visible déplié) — animation de hauteur sans valeur magique */
.cop-accordion__details{
	display:grid;
	grid-template-rows:0fr;
	transition:grid-template-rows .4s ease;
}
.cop-accordion__details-inner{ overflow:hidden; min-height:0; }

.cop-accordion__points{ list-style:none !important; margin:0; padding:0; display:grid; gap:14px; }
.cop-accordion__points li{
	list-style:none !important;
	position:relative;
	padding-left:46px;
	color:var(--cop-white);
	font-family:'Roboto',Arial,sans-serif;
	font-size:clamp(15px,1.15vw,18px);
	line-height:1.4;
}
.cop-accordion__points li::marker{ content:""; }
/* Élément décoratif orange (SVG fourni), apparaît à l'ouverture / au survol */
.cop-accordion__points li::before{
	content:"";
	position:absolute;
	left:0;
	top:.2em;
	width:30px;
	height:20px;
	background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='20' viewBox='0 0 30 20' fill='none'%3E%3Cpath d='M3.59388 3.24646C3.5031 10.8161 8.52172 17.2669 15.4077 18.042C22.0214 18.7879 28.1164 14.0399 30 7.10589C28.8264 15.1231 21.5027 20.8182 13.3977 19.9036C5.12086 18.9728 -0.834704 11.5037 0.0957512 3.22376L1.78808 0L3.59711 3.2497L3.59388 3.24646Z' fill='%23EB6F2C'/%3E%3C/svg%3E") no-repeat center / contain;
	opacity:0;
	transform:translateX(-6px);
	transition:opacity .35s ease .05s, transform .4s ease .05s;
}

/* ---- Bouton icône +/× ---- */
.cop-accordion__toggle{
	flex:0 0 var(--cop-toggle);
	width:var(--cop-toggle);
	height:var(--cop-toggle);
	margin-left:auto;
	padding:0;
	border:0;
	border-radius:50%;
	background:var(--cop-dark);
	cursor:pointer;
	align-self:center;
	transition:background .35s ease;
}
.cop-accordion__icon{
	display:block;
	position:relative;
	width:100%;
	height:100%;
	transition:transform .35s ease;
}
.cop-accordion__icon::before,
.cop-accordion__icon::after{
	content:"";
	position:absolute;
	top:50%; left:50%;
	width:15px; height:2.5px;
	background:var(--cop-white);
	border-radius:2px;
	transform:translate(-50%,-50%);
}
.cop-accordion__icon::after{ transform:translate(-50%,-50%) rotate(90deg); }

.recrutement_btn_blue {
	background-color: var(--bleufonce);
    padding: 15px 25px;
    font-family: 'Anton', sans-serif;
    text-transform: uppercase;
    color: var(--blanc);
    font-size: 18px;
}
.recrutement_btn_simple {
	background-color: transparent;
    padding: 15px 25px;
    font-family: 'Anton', sans-serif;
    text-transform: uppercase;
    color: #005870;
    font-size: 18px;
}

/* ===== ÉTAT OUVERT — au clic (.is-open) ET au survol (desktop) ===== */
.cop-accordion__item.is-open{ margin:14px 0; }
.cop-accordion__item.is-open::before{ opacity:1; }
.cop-accordion__item.is-open,
.cop-accordion__item.is-open + .cop-accordion__item{ border-top-color:transparent; }
.cop-accordion__item.is-open .cop-accordion__title{ color:var(--cop-white); }
.cop-accordion__item.is-open .cop-accordion__excerpt{ max-height:0; opacity:0; margin:0; }
.cop-accordion__item.is-open .cop-accordion__details{ grid-template-rows:1fr; }
.cop-accordion__item.is-open .cop-accordion__details-inner{ padding-top:2px; }
.cop-accordion__item.is-open .cop-accordion__points li::before{ opacity:1; transform:translateX(0); }
.cop-accordion__item.is-open .cop-accordion__toggle{ background:var(--cop-orange); align-self:flex-start; }
.cop-accordion__item.is-open .cop-accordion__icon{ transform:rotate(45deg); }

@media (hover:hover){
	.cop-accordion__item:hover::before{ opacity:1; }
	.cop-accordion__item:hover,
	.cop-accordion__item:hover + .cop-accordion__item{ border-top-color:transparent; }
	.cop-accordion__item:hover .cop-accordion__title{ color:var(--cop-white); }
	.cop-accordion__item:hover .cop-accordion__excerpt{ max-height:0; opacity:0; margin:0; }
	.cop-accordion__item:hover .cop-accordion__details{ grid-template-rows:1fr; }
	.cop-accordion__item:hover .cop-accordion__details-inner{ padding-top:2px; }
	.cop-accordion__item:hover .cop-accordion__points li::before{ opacity:1; transform:translateX(0); }
	.cop-accordion__item:hover .cop-accordion__toggle{ background:var(--cop-orange); align-self:flex-start; }
	.cop-accordion__item:hover .cop-accordion__icon{ transform:rotate(45deg); }
}

/* ===== RESPONSIVE ===== */
@media (max-width:980px){
	.cop-accordion{ --cop-pad-x:22px; --cop-pad-y:20px; }
	.cop-accordion__row{ flex-wrap:wrap; gap:12px 16px; }
	.cop-accordion__title{ flex:1 1 auto; order:1; }
	.cop-accordion__toggle{ order:2; margin-left:auto; align-self:center !important; }
	.cop-accordion__content{ flex:1 1 100%; order:3; }
	.cop-accordion__item.is-open .cop-accordion__toggle{ align-self:center !important; }
}
