/* Page /la-marque/ (page-la-marque.php) : ce qui lui est propre ; le reste vient de le-sac.css (préfixe aj-ns-). Mobile d'abord, ordinateur à partir de 1024 px. */

.aj-lm .aj-ns-haut__texte strong { font-weight: 500; color: #141110; }

/* Preuves : presse + note Google, bande claire entre l'intro et l'histoire */
.aj-lm-preuves { display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 28px 17px 32px; border-top: 1px solid var(--ns-trait); text-align: center; }
.aj-lm-preuves__logos { display: flex; justify-content: space-between; align-items: center; gap: 4px; width: 100%; max-width: 340px; }
.aj-lm-preuves__logos img { display: block; width: auto; height: calc((100vw - 50px) / 9.5 * var(--k, 1)); } /* mobile : les 5 logos sur une ligne, comme sur l'accueil */
/* mobile, mêmes réductions que sur l'accueil (Theo, 01/11) : Gala -15 %, Modes & Travaux -10 %, Maxi -10 %, Prima -15 % */
.aj-lm-preuves__logos img[alt="Gala"] { --k: .595 !important; }
.aj-lm-preuves__logos img[alt="Modes & Travaux"] { --k: .837 !important; }
.aj-lm-preuves__logos img[alt="Maxi"] { --k: .828 !important; }
.aj-lm-preuves__logos img[alt="Prima"] { --k: .85 !important; }

/* Notre histoire : même disposition que le bloc de Florine de « Nos modèles », sur fond beige */
.aj-lm-histoire { max-width: none; background: var(--ns-beige); }
.aj-lm-histoire .aj-ns-polaroid { background: #fff; }
.aj-lm-signature { order: 4; margin: 0; font-family: var(--aj-titre); font-size: 20px; font-style: italic; line-height: 1.35; color: #3a3431; }

/* Savoir-faire : deux polaroïds superposés, l'artisan derrière, le sac devant */
.aj-lm-atelier { padding-top: 24px; } /* proche des entretiens juste au-dessus */
.aj-lm-duo { position: relative; order: 3; align-self: center; width: min(100% - 24px, 322px); /* mobile : grande photo calée à gauche, petite à droite, sur toute la largeur */ margin: 0 0 14px; padding-top: 34%; }
.aj-lm-duo { display: flex; align-items: flex-start; }
.aj-lm-duo .aj-ns-polaroid { flex: none; margin: 0; align-self: flex-start; }
.aj-lm-duo__arriere { --incl: -5deg; width: 60%; } /* le grand (artisan) en bas à gauche, penché à gauche */
.aj-lm-duo__avant { --incl: 6deg; position: absolute !important; right: 0; top: 0; z-index: 1; width: 50%; } /* le petit (sac) en haut à droite, penché à droite, par-dessus le fond de l'atelier : les mains restent visibles */
.aj-lm-duo__avant img { aspect-ratio: 1; object-position: 50% 45%; }
.aj-lm-duo figcaption { font-size: 13px; }
/* scotchs posés différemment sur chaque photo, pas au même endroit */
.aj-lm-duo__arriere .aj-ns-polaroid__scotch { left: 24%; transform: translateX(-50%) rotate(-9deg); }
.aj-lm-duo__avant .aj-ns-polaroid__scotch { left: 78%; top: -8px; width: 64px; transform: translateX(-50%) rotate(28deg); }

/* Chiffres clés, entre l'histoire et les engagements */
.aj-lm-chiffres { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 10px; max-width: 1100px; margin: 0 auto; padding: 40px 16px; border-bottom: 1px solid var(--ns-trait); text-align: center; }
.aj-lm-chiffres div { display: flex; flex-direction: column; gap: 14px; }
.aj-lm-chiffres strong { display: flex; align-items: flex-end; justify-content: center; gap: .18em; height: 1em; font-family: var(--aj-titre); font-size: 34px; font-weight: 400; font-style: italic; line-height: 1; white-space: nowrap; color: #141110; }
.aj-lm-chiffres span { font-size: 10px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: #6f6763; }
.aj-lm-chiffres em { font-style: normal; }
.aj-lm-chiffres img { display: block; width: auto; height: 1.3em; margin-bottom: -.05em; } /* logo GRS à la hauteur des chiffres */
.aj-lm-chiffres small { margin: 0 2px; font-family: Poppins, system-ui, sans-serif; font-size: .5em; font-style: normal; font-weight: 300; vertical-align: .35em; } /* « % » et « + de » : le % de la Playfair est trop chargé */

/* Engagements : les cartes du bloc Florine, sur fond blanc dans la colonne beige */
.aj-lm-engagements li { background: #fff; }

/* L'accord parfait */
.aj-lm-concept { display: flex; flex-direction: column; align-items: center; gap: 18px; max-width: 760px; margin: 0 auto; padding: 64px 20px; text-align: center; }
.aj-lm-concept h2 { font-size: 34px; line-height: 1.05; }
.aj-lm-concept p:not(.aj-ns__sur) { margin: 0; font-size: 15px; line-height: 1.6; color: var(--ns-gris); }
.aj-lm-concept .aj-lm-concept__phrase { font-family: var(--aj-titre); font-size: 20px; font-style: italic; line-height: 1.35; color: #141110; }
.aj-lm-concept .aj-ns__bouton { align-self: center; margin-top: 6px; }

/* Les entretiens */
.aj-lm-entretiens { max-width: 1320px; margin: 0 auto; padding: 0 20px 24px; }
.aj-lm-entretiens__tete { display: flex; flex-direction: column; gap: 14px; margin-bottom: 24px; padding-bottom: 18px; border-bottom: 1px solid #141110; }
.aj-lm-entretiens__tete h2 { font-size: 34px; line-height: 1.05; }
.aj-lm-entretiens__grille { display: grid; gap: 28px; }
.aj-lm-entretien { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 0; border: 0; background: none; font: inherit; font-weight: 400; letter-spacing: normal; text-transform: none; color: #141110; text-align: left; cursor: pointer; } /* sans les majuscules du rond vidéo (aj-ns-video) */
.aj-lm-entretien__image { position: relative; display: block; width: 100%; margin-bottom: 10px; overflow: hidden; }
.aj-lm-entretien__image img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; transition: transform .5s; }
.aj-lm-entretien__play { position: absolute; left: 50%; top: 50%; display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; background: rgba(255, 255, 255, .92); transform: translate(-50%, -50%); transition: transform .3s; }
.aj-lm-entretien__play svg { width: 22px; height: 22px; margin-left: 3px; fill: #141110; }
.aj-lm-entretien__nom { font-family: var(--aj-titre); font-size: 24px; font-style: italic; line-height: 1.1; }
.aj-lm-entretien__role { font-size: 11px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; color: #6f6763; }
@media (hover: hover) {
	.aj-lm-entretien:hover .aj-lm-entretien__image img { transform: scale(1.03); }
	.aj-lm-entretien:hover .aj-lm-entretien__play { transform: translate(-50%, -50%) scale(1.08); }
}

/* Fenêtre vidéo des entretiens : format paysage */
.aj-ns-fenetre--paysage .aj-ns-fenetre__cadre { width: min(100%, 1100px); aspect-ratio: 16 / 9; max-height: 80vh; }

@media (min-width: 1024px) {
	.aj-lm-chiffres { padding: 56px 40px; }
	.aj-lm-chiffres strong { font-size: 48px; }
	.aj-lm-chiffres span { font-size: 11px; letter-spacing: .16em; }
	.aj-lm-preuves { padding: 36px 40px 40px; }
	.aj-lm-preuves__logos { justify-content: center; gap: 16px 44px; max-width: none; }
	.aj-lm-preuves__logos img { height: calc(48px * var(--k, 1)); }
	.aj-lm-preuves__logos img[alt="Gala"] { --k: .7 !important; }
	.aj-lm-preuves__logos img[alt="Modes & Travaux"] { --k: .93 !important; }
	.aj-lm-preuves__logos img[alt="Maxi"] { --k: .92 !important; }
	.aj-lm-preuves__logos img[alt="Prima"] { --k: 1 !important; }
	.aj-lm-concept { max-width: 1000px; padding: 104px 40px; }
	.aj-lm-concept h2 { white-space: nowrap; } /* titre sur une ligne */
	.aj-lm-concept p:not(.aj-ns__sur) { max-width: 46em; }
	.aj-lm-concept h2, .aj-lm-entretiens__tete h2 { font-size: 52px; }
	.aj-lm-entretiens { padding: 0 40px 24px; }
	.aj-lm-entretiens__grille { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
	/* Une vision responsable : sur ordinateur, photo encadrée dans le beige plutôt qu'à fond perdu */
	.aj-lm-vision { max-width: 1320px; margin: 0 auto; padding: 0 40px; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 80px; align-items: center; background: none; }
	.aj-lm-vision .aj-ns-split__image { padding: 64px 0; }
	.aj-lm-vision .aj-ns-split__image img { height: auto; min-height: 0; aspect-ratio: 4 / 5; object-position: 40% 50%; }
	.aj-lm-vision .aj-ns-split__texte { padding: 64px 0; background: none; }
	.aj-lm-vision .aj-lm-engagements li { background: var(--ns-beige); }
	.aj-lm-atelier { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; padding-top: 32px; }
	.aj-lm-duo__arriere { width: 68%; }
	.aj-lm-duo__avant { top: 14%; right: -8%; width: 56%; }
	.aj-lm-atelier .aj-lm-duo { order: 2; width: min(100%, 460px); margin: 24px 0; justify-self: start; } /* près du texte plutôt que contre le bord droit */
	.aj-lm-duo figcaption { font-size: 16px; }
	.aj-lm-atelier .aj-ns-florine__contact { justify-content: flex-start; }
	.aj-lm-histoire { padding-left: max(40px, calc((100% - 1240px) / 2)); padding-right: max(40px, calc((100% - 1240px) / 2)); }
}

/* Mobile : tous les textes alignés à gauche (en fin de fichier pour passer après les règles centrées ; centrés sur ordinateur) */
@media (max-width: 1023px) {
	.aj-lm .aj-ns-haut, .aj-lm-concept, .aj-lm-preuves { align-items: flex-start; text-align: left; }
	.aj-lm-concept .aj-ns__bouton, .aj-lm-atelier .aj-ns-florine__contact .aj-ns__bouton { align-self: flex-start; }
	.aj-lm-atelier .aj-ns-florine__contact { align-items: flex-start; }
}
