/*
 * Bloc « À la une » de l'accueil (maquette docs/maquettes/accueil-2026-10-13), repris seul le 19/10/2026 :
 * la dernière actualité en grand, les suivantes par trois à droite (rotation : accueil-une.js).
 * Règles reprises de accueil.css (branche accueil-premium), mêmes classes.
 */
.accueil{
	--acc-rouge:#e40520;
	--acc-encre:#1d1d1b;
	--acc-gris:#6b6b6b;
	--acc-gris-doux:#8f8f8f;
	--acc-filet:#ebe6e4;
	--acc-fond:#f6f3f2;
	font-size:16px;
	line-height:1.55;
	color:#323232;
}
.acc-conteneur{width:94%;max-width:1200px;margin:0 auto}
.acc-surtitre{display:inline-block;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--acc-rouge)}
.accueil a{color:inherit;text-decoration:none}
.accueil .acc-titre-section{font-size:32px;line-height:1.2;font-weight:600;color:var(--acc-encre);letter-spacing:-.01em;text-transform:none;background:none;padding:0;margin:0}
.acc-lien-fleche{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--acc-encre);transition:gap .2s,color .2s}
.acc-lien-fleche:after{content:"";width:16px;height:2px;background:currentColor}
a.acc-lien-fleche:hover,.acc-carte-actu:hover .acc-lien-fleche{color:var(--acc-rouge);gap:12px}

.acc-section{padding:80px 0}
.acc-section-tete{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:36px}
.acc-section-tete .acc-titre-section{margin-top:10px}

.acc-une{display:grid;grid-template-columns:1.25fr 1fr;gap:28px;align-items:stretch}
/* Hauteur fixe pendant la rotation : la colonne prend la hauteur de la grande carte (contain:size), ses trois cartes se
   la partagent, et les titres longs sont coupés à trois lignes : la page ne saute pas quand les actualités changent */
.acc-une-principale .acc-carte-actu{min-height:560px}
.acc-une-colonne{position:relative;contain:size}
.acc-une-page{display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:18px;height:100%;transition:opacity .35s ease}
.acc-une-page[hidden]{display:none}
.acc-une-page.sortie,.acc-une-page.entree{opacity:0}
.acc-carte-actu{display:flex;flex-direction:column;height:100%;background:#fff;border:1px solid var(--acc-filet);border-radius:6px;overflow:hidden;transition:box-shadow .25s,transform .25s,border-color .25s}
.acc-carte-actu:hover{box-shadow:0 18px 44px rgba(0,0,0,.09);transform:translateY(-3px);border-color:#e1dad8}
.acc-visuel{position:relative;aspect-ratio:16/9;background:var(--acc-fond);overflow:hidden}
.acc-visuel img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.acc-visuel.contenir img{object-fit:contain;padding:18px;box-sizing:border-box}
/* Actualité sans image : fond clair et M de Mercialys */
.acc-visuel.vide:after{content:"M";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:44px;font-weight:600;color:#dcd5d3}
.acc-carte-actu:hover .acc-visuel img{transform:scale(1.04)}
.acc-contenu{padding:22px 24px 24px;display:flex;flex-direction:column;gap:10px;flex:1}
.acc-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;font-size:12px;color:var(--acc-gris-doux)}
.acc-etiquette{display:inline-block;padding:3px 10px;border-radius:12px;background:#fbf1f2;color:var(--acc-rouge);font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.accueil .acc-carte-actu h3{margin:0;padding:0;font-size:17px;line-height:1.35;font-weight:600;color:var(--acc-encre);text-transform:none;background:none}
.accueil .acc-carte-actu.principale h3{font-size:25px;line-height:1.25}
.acc-carte-actu.principale .acc-visuel{aspect-ratio:16/10}
.accueil .acc-carte-actu p{margin:0;font-size:14px;line-height:1.55;color:var(--acc-gris)}
.acc-carte-actu .acc-lien-fleche{margin-top:auto;padding-top:6px}
/* Grande actualité sans image : texte seul, sur fond clair avec un filet rouge */
.acc-carte-actu.principale.sans-image{background:var(--acc-fond);border-top:4px solid var(--acc-rouge)}
.acc-carte-actu.principale.sans-image .acc-contenu{justify-content:center;gap:16px;padding:48px 44px}
.accueil .acc-carte-actu.principale.sans-image h3{font-size:32px;line-height:1.2}
.accueil .acc-carte-actu.principale.sans-image p{font-size:16px}
.acc-une-colonne .acc-carte-actu{flex-direction:row}
.acc-une-colonne .acc-visuel{flex:none;width:40%;aspect-ratio:auto;min-height:120px}
.acc-une-colonne .acc-contenu{padding:16px 18px;overflow:hidden}
.accueil .acc-une-colonne .acc-carte-actu h3{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

@media (prefers-reduced-motion: reduce){
	.acc-une-page,.acc-carte-actu,.acc-visuel img{transition:none}
}
@media only screen and (max-width: 1100px){
	.acc-une{grid-template-columns:1fr}
	.acc-une-principale .acc-carte-actu{min-height:0}
	/* Une seule colonne : hauteur fixe de chaque carte de droite, pour la même raison */
	.acc-une-colonne{contain:none}
	.acc-une-page{grid-template-rows:repeat(3,150px)}
}
@media only screen and (max-width: 640px){
	.acc-section{padding:56px 0}
	.accueil .acc-titre-section{font-size:25px}
	.acc-section-tete{flex-direction:column;align-items:flex-start;gap:10px}
	.accueil .acc-carte-actu.principale h3{font-size:20px}
	.acc-carte-actu.principale.sans-image .acc-contenu{padding:28px 22px}
	.accueil .acc-carte-actu.principale.sans-image h3{font-size:24px}
	.acc-une-page{grid-template-rows:repeat(3,128px);gap:14px}
	.acc-une-colonne .acc-visuel{width:36%;min-height:0}
	.acc-une-colonne .acc-contenu{padding:12px 14px;gap:6px}
	.accueil .acc-une-colonne .acc-carte-actu h3{font-size:15px;-webkit-line-clamp:2}
	.acc-une-colonne .acc-meta{flex-wrap:nowrap;white-space:nowrap;overflow:hidden;gap:6px;font-size:11px}
	.acc-une-colonne .acc-etiquette{padding:2px 7px;font-size:10px;letter-spacing:.04em}
}

/* Apparition des blocs de l'accueil au défilement, comme la maquette (20/10/2026) : fondu et montée de 24 px quand le
   bloc arrive à l'écran (accueil-apparition.js, qui retire ensuite ces classes) ; les cartes d'une même ligne se suivent */
html.apparition .accueil .apparait{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}
html.apparition .accueil .apparait.vu{opacity:1;transform:none}
html.apparition .acc-acces > .apparait:nth-child(2),html.apparition .acc-une > .apparait:nth-child(2){transition-delay:.1s}
html.apparition .acc-acces > .apparait:nth-child(3){transition-delay:.2s}
html.apparition .acc-acces > .apparait:nth-child(4){transition-delay:.3s}
@media (prefers-reduced-motion: reduce){
	html.apparition .accueil .apparait{opacity:1;transform:none;transition:none}
}
