/* Pages légales : même rendu que grosbusch.lu (grosbusch-v2/css/pages.css, « Pages légales »).
   Couleurs et polices de grosbusch.lu ; un site peut surcharger les variables --grb-*.
   Sélecteurs préfixés par body.grb-legal-page : ils doivent l'emporter sur la typographie des thèmes (.v2-prose…). */
.grb-legal {
	--grb-font: 'DM Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
	--grb-head: 'Outfit', 'DM Sans', system-ui, sans-serif;
	--grb-ink: #1f2016;
	--grb-muted: #5d5f52;
	--grb-line: #e7e6dd;
	--grb-cream: #f7f6f0;
	--grb-lime: #b1c903;
	--grb-lime-700: #6f7f00;
	--grb-orange: #f08411;

	display: grid; grid-template-columns: minmax(220px, 290px) minmax(0, 1fr); gap: clamp(28px, 5vw, 72px); align-items: start;
	box-sizing: border-box; width: 100%; max-width: 1180px; margin: 44px auto; text-align: left;
	font-family: var(--grb-font);
}
.grb-legal *, .grb-legal *:before { box-sizing: border-box; }
.grb-legal > .grb-prose:only-child { grid-column: 1 / -1; margin: 0 auto; }

body.grb-legal-page .grb-legal .grb-legal-toc { position: sticky; top: 150px; max-height: calc(100vh - 180px); overflow: auto; padding: 22px 20px; border-radius: 24px; background: var(--grb-cream); scrollbar-width: thin; }
body.grb-legal-page .grb-legal .grb-legal-toc-t { display: flex; align-items: center; gap: 10px; margin: 0 0 12px; padding: 0; font-family: var(--grb-head); font-size: .78rem; font-weight: 700; letter-spacing: .14em; line-height: 1.4; text-transform: uppercase; color: var(--grb-lime-700); }
body.grb-legal-page .grb-legal .grb-ico { flex: none; width: 18px; height: 18px; color: var(--grb-orange); }
body.grb-legal-page .grb-legal .grb-legal-toc ol { margin: 0; padding: 0; list-style: none; counter-reset: toc; }
body.grb-legal-page .grb-legal .grb-legal-toc li { margin: 0; padding: 0; counter-increment: toc; background: none; list-style: none; }
body.grb-legal-page .grb-legal .grb-legal-toc li:before { content: none; }
body.grb-legal-page .grb-legal .grb-legal-toc a {
	display: flex; gap: 10px; padding: 7px 10px; border-radius: 10px;
	color: var(--grb-muted); font-family: var(--grb-font); font-size: .88rem; font-weight: 400; line-height: 1.35; text-decoration: none; text-transform: lowercase;
	transition: background-color .2s, color .2s;
}
body.grb-legal-page .grb-legal .grb-legal-toc a:first-letter { text-transform: uppercase; }
body.grb-legal-page .grb-legal .grb-legal-toc a:before { content: counter(toc, decimal-leading-zero); flex: none; font-family: var(--grb-head); font-weight: 700; color: var(--grb-orange); opacity: .8; }
body.grb-legal-page .grb-legal .grb-legal-toc a:hover { background: #fff; color: var(--grb-ink); }
body.grb-legal-page .grb-legal .grb-legal-toc a.is-current { background: #fff; color: var(--grb-ink); font-weight: 600; box-shadow: 0 4px 12px -8px rgba(31, 32, 22, .4); }

body.grb-legal-page .grb-legal .grb-prose { max-width: none; min-width: 0; } /* Fruit : même largeur que les autres pages du site */
body.grb-legal-page .grb-legal .grb-prose > :first-child { margin-top: 0; }
body.grb-legal-page .grb-legal .grb-prose p, body.grb-legal-page .grb-legal .grb-prose li { margin: 0 0 1em; color: #3a3b31; font-family: var(--grb-font); font-size: 1rem; line-height: 1.75; text-align: left; }
body.grb-legal-page .grb-legal .grb-prose h2 {
	scroll-margin-top: 150px;
	display: flex; align-items: baseline; gap: 12px;
	margin: 2.4em 0 .7em; padding: 1.4em 0 0; border: 0; border-top: 1px solid var(--grb-line); background: none;
	font-family: var(--grb-head); font-size: clamp(1.15rem, 1rem + .5vw, 1.4rem); font-weight: 800; letter-spacing: .01em; line-height: 1.3; text-align: left; text-transform: none; color: var(--grb-ink);
}
body.grb-legal-page .grb-legal .grb-prose h2:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
body.grb-legal-page .grb-legal .grb-prose h2:before { content: ""; flex: none; width: 10px; height: 10px; border-radius: 50%; background: var(--grb-lime); transform: translateY(-2px); }
body.grb-legal-page .grb-legal .grb-prose h3 { margin: 1.6em 0 .5em; font-family: var(--grb-head); font-size: 1.05rem; font-weight: 700; line-height: 1.35; text-transform: none; color: var(--grb-ink); }
body.grb-legal-page .grb-legal .grb-prose a { color: var(--grb-lime-700); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
body.grb-legal-page .grb-legal .grb-prose a:hover { color: var(--grb-orange); }
body.grb-legal-page .grb-legal .grb-prose ul, body.grb-legal-page .grb-legal .grb-prose ol { margin: 0 0 1em; padding-left: 1.3em; }
body.grb-legal-page .grb-legal .grb-prose ul { list-style: disc; }
body.grb-legal-page .grb-legal .grb-prose ol { list-style: decimal; }
body.grb-legal-page .grb-legal .grb-prose li { margin-bottom: .3em; }
body.grb-legal-page .grb-legal .grb-prose li::marker { color: var(--grb-orange); }
body.grb-legal-page .grb-legal .grb-prose table { width: 100%; border-collapse: collapse; margin: 1em 0; font-size: .95rem; }
body.grb-legal-page .grb-legal .grb-prose th, body.grb-legal-page .grb-legal .grb-prose td { padding: 10px 12px; border-bottom: 1px solid var(--grb-line); text-align: left; vertical-align: top; }

@media screen and (max-width: 900px) {
	.grb-legal { grid-template-columns: minmax(0, 1fr); margin-top: 28px; }
	body.grb-legal-page .grb-legal .grb-legal-toc { position: static; max-height: none; }
}
@media print {
	body.grb-legal-page .grb-legal .grb-legal-toc { display: none !important; }
	.grb-legal { display: block; }
}

/* Fruit@Office / Fruit@Home, template v2 : « .fh-v2/.fo-v2 .v2-section--intro .v2-prose > :not(…) » limite les blocs à 820 px
   (sélecteur trop spécifique pour être battu autrement) ; la page légale prend toute la largeur du site. */
body.grb-legal-page .v2-prose { max-width: none; }
body.grb-legal-page .v2-prose > .grb-legal { max-width: none !important; width: 100%; margin-left: 0; margin-right: 0; }

/* Fruit@Office / Fruit@Home, template v1 : pas de colonne « Intéressé ? », texte en pleine largeur comme grosbusch.lu. */
body.grb-legal-page .mainContent001 > .column1_4 { display: none; }
body.grb-legal-page .mainContent001 > .column3_4 { float: none; width: 100%; }
