/**
 * Home page (inc/50-home.php): hero sunrise (the one load moment), « Par où commencer ? », rubriques (crème band),
 * « Comment se passe un chantier » (the sun rises a little more at each stage), « Bien choisir son artisan » (crème
 * band), « Les derniers guides » (the lead guide in front of a rising half-sun, the next four beside it, family filters).
 */

/* ── Hero: a sunrise ────────────────────────────────
   A layered sunrise stands on the floor of the band — coral half-disc, coral tint, crème glow, a blue-green ring and
   protractor rays — behind the headline; the white search card stands on its horizon, in front of the sun. */
.rv-home-hero .rv-hero__panel { padding-top: 64px; padding-bottom: 0; background: linear-gradient(180deg, var(--rv-page) 0%, var(--rv-creme-2) 100%); }
.rv-home-hero .rv-hero__panel > :not(.rv-home-hero__stage) { position: relative; z-index: 1; }
.rv-home-hero .rv-hero__title { max-width: 15ch; font-size: clamp(2.4rem, 1.5rem + 3.2vw, 4.1rem); letter-spacing: -.04em; }
.rv-home-hero__stage { position: relative; padding: 170px 0 56px; }
.rv-sunrise { position: absolute; z-index: 0; left: 50%; bottom: 0; width: 1152px; max-width: none; height: auto; transform: translateX(-50%); pointer-events: none; }

.rv-home-hero__find {
	position: relative; z-index: 1; box-sizing: border-box; width: 100%; max-width: 620px; margin: 0 auto;
	padding: var(--rv-s5) var(--rv-s5) var(--rv-s4); background: var(--rv-white); border: 1px solid var(--rv-line); border-radius: var(--rv-r-xl);
	text-align: left;
}
.rv-home-hero__find .rv-search { max-width: none; margin: 0; }
.rv-home-hero__find .rv-search__label { margin-bottom: 2px; font-size: 1.2rem; }
.rv-home-hero__chips { display: flex; flex-wrap: wrap; gap: var(--rv-s2); margin: var(--rv-s3) 0 0; padding: 0; list-style: none; }
.rv-home-hero__chips .rv-chip { min-height: 36px; background: var(--rv-creme-2); }

/* The single orchestrated moment: the sun rises, the tint and the glow follow, the ring draws itself, then the rays
   and the two small lights fade in. */
@media (prefers-reduced-motion: no-preference) {
	.rv-sunrise .l-rise { animation: rv-sun-rise .9s var(--rv-ease) both; }
	.rv-sunrise .l-d2 { animation-delay: .12s; }
	.rv-sunrise .l-d3 { animation-delay: .24s; }
	.rv-sunrise .l-fade { animation: rv-sun-fade .8s ease both; }
	.rv-sunrise .l-d4 { animation-delay: .55s; }
	.rv-sunrise .l-d5 { animation-delay: .85s; }
	.rv-sunrise .l-draw { stroke-dasharray: 1; stroke-dashoffset: 1; animation: rv-sun-draw 1.1s .35s var(--rv-ease) forwards; }
}
/* Keyframes rv-sun-rise / rv-sun-fade / rv-sun-draw: site.css (shared with the rubrique heroes). */

@media (max-width: 899px) {
	.rv-sunrise { width: 1000px; }
	.rv-home-hero__stage { padding-top: 150px; }
}
@media (max-width: 599px) {
	.rv-home-hero .rv-hero__panel { padding-top: var(--rv-s7); }
	/* Phones: the horizon moves up to just under the top of the card, so the sun rises from behind it. */
	.rv-home-hero__stage { padding: 150px 0 var(--rv-s5); }
	.rv-sunrise { width: 720px; bottom: auto; top: calc(150px + 56px - 360px); }
	.rv-home-hero__find { padding: var(--rv-s4) var(--rv-s4) var(--rv-s3); border-radius: var(--rv-r-l); }
	.rv-home-hero__find .rv-search__btn { width: 100%; }
}

/* ── Hero version 2 (inc/50-home.php rv_render_home_hero_v2) ─────
   Same sunrise; two cards rest on the sun's ring (« Le guide du moment », « À calculer ») and the site's live figures
   sit on the horizon under the search card. The cards join the end of the load moment (after the rays). */
.rv-hcards { display: none; }
/* Below 1180 px the two cards follow the figures, under the search card (2 columns from 640 px). */
@media (max-width: 1179px) {
	.rv-home-hero--v2 .rv-home-hero__stage { display: flex; flex-direction: column; }
	.rv-home-hero--v2 .rv-home-hero__find { order: 1; }
	.rv-home-hero--v2 .rv-hfacts { order: 2; }
	.rv-hcards { order: 3; position: relative; z-index: 1; display: grid; gap: var(--rv-s3); width: 100%; max-width: 620px; margin: var(--rv-s4) auto 0; }
	.rv-hcards .rv-hcard { width: auto; }
}
@media (min-width: 640px) and (max-width: 1179px) { .rv-hcards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* The extra rows make the stage taller: the sun is anchored from the top so it stays behind the search card, as in v1
   (sunrise height = width ÷ 2; search card ≈ 180 px). */
@media (min-width: 900px) and (max-width: 1179px) { .rv-home-hero--v2 .rv-sunrise { bottom: auto; top: calc(170px + 180px + 56px - 576px); } }
@media (min-width: 600px) and (max-width: 899px) { .rv-home-hero--v2 .rv-sunrise { bottom: auto; top: calc(150px + 180px + 56px - 500px); } }
.rv-hcard {
	display: grid; gap: 6px; box-sizing: border-box; width: 260px; padding: 16px 18px 16px;
	background: var(--rv-white); border: 1px solid var(--rv-line); border-radius: var(--rv-r-l);
	box-shadow: 0 18px 36px -24px rgba(32, 35, 38, .35); color: var(--rv-ink); text-align: left; text-decoration: none;
	transition: transform .2s var(--rv-ease), border-color .2s ease;
}
.rv-hcard:hover { transform: translateY(-3px); border-color: var(--rv-teal); color: var(--rv-ink); }
.rv-hcard:focus-visible { outline: 2px solid var(--rv-teal-d); outline-offset: 3px; }
.rv-hcard__tag { display: inline-flex; align-items: center; gap: 8px; font-size: var(--rv-fs-xs); font-weight: 600; }
.rv-hcard__tag .rv-icon { width: 26px; height: 26px; padding: 5px; box-sizing: border-box; border-radius: 50%; flex: none; }
.rv-hcard--guide .rv-hcard__tag { color: var(--rv-corail-t); }
.rv-hcard--guide .rv-hcard__tag .rv-icon { background: var(--rv-creme); }
.rv-hcard--calc .rv-hcard__tag { color: var(--rv-teal-d); }
.rv-hcard--calc .rv-hcard__tag .rv-icon { background: var(--rv-teal-tint); }
.rv-hcard__title { color: var(--rv-ink); font: 700 1.02rem/1.3 var(--rv-font-h); letter-spacing: -.01em; text-wrap: balance; }
.rv-hcard__meta { display: flex; flex-wrap: wrap; gap: 4px 12px; color: var(--rv-grey); font-size: var(--rv-fs-xs); }
@media (min-width: 1180px) {
	.rv-hcards { display: block; position: absolute; inset: 0; z-index: 1; pointer-events: none; }
	.rv-hcard { position: absolute; pointer-events: auto; }
	/* On the ring, either side of the search card, at the height of the two small lights of the sunrise. */
	.rv-hcard--guide { left: calc(50% - 580px); top: 70px; transform: rotate(-2deg); }
	.rv-hcard--calc { right: calc(50% - 580px); top: 118px; transform: rotate(2deg); }
	.rv-hcard--guide:hover { transform: rotate(-2deg) translateY(-3px); }
	.rv-hcard--calc:hover { transform: rotate(2deg) translateY(-3px); }
}

.rv-hfacts {
	position: relative; z-index: 1; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px;
	max-width: 620px; margin: var(--rv-s4) auto 0; padding: 0; list-style: none;
}
.rv-hfacts a {
	display: inline-flex; align-items: baseline; gap: 6px; min-height: 40px; box-sizing: border-box; padding: 9px 16px;
	border-radius: var(--rv-r-pill); background: rgba(255, 255, 255, .94); box-shadow: inset 0 0 0 1px var(--rv-line);
	color: var(--rv-ink); font-size: var(--rv-fs-sm); text-decoration: none;
}
.rv-hfacts a:hover { box-shadow: inset 0 0 0 1.5px var(--rv-teal); color: var(--rv-ink); }
.rv-hfacts b { font: 700 1.05rem/1 var(--rv-font-h); color: var(--rv-teal-d); }

@media (prefers-reduced-motion: no-preference) {
	.rv-hcards .rv-hcard, .rv-hfacts { animation: rv-hcard-in .7s var(--rv-ease) both; }
	.rv-hcard--guide { animation-delay: 1s !important; }
	.rv-hcard--calc { animation-delay: 1.15s !important; }
	.rv-hfacts { animation-delay: .9s; }
}
@keyframes rv-hcard-in { from { opacity: 0; translate: 0 16px; } to { opacity: 1; translate: 0 0; } }
@media (prefers-reduced-motion: reduce) { .rv-hcard { transition: none; } }
@media (max-width: 599px) {
	.rv-hfacts { gap: 6px; }
	.rv-hfacts a { padding: 8px 12px; font-size: var(--rv-fs-xs); }
}

/* ── Par où commencer ? ─────────────────────────────
   A project selector: one tab per family, each a sun at a different phase on the same horizon (dawn, half-risen,
   risen in its ring, shining); the selected tab opens like a folder into its crème panel, where the family's sun
   rises above the first step. Without JS (no .is-tabs) the tabs are jump links and every panel shows. */
.rv-start--a0, .rv-start--a1 { --a: var(--rv-corail); --a-soft: var(--rv-corail-tint); --a-text: var(--rv-corail-t); --a-wash: var(--rv-creme); }
.rv-start--a2, .rv-start--a3 { --a: var(--rv-teal); --a-soft: #B9DCD9; --a-text: var(--rv-teal-d); --a-wash: var(--rv-teal-tint); }
.rv-start__intro { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--rv-s3) var(--rv-s7); align-items: end; margin-bottom: var(--rv-s6); }
.rv-start__intro p { margin: 0; max-width: 46ch; color: var(--rv-grey); }

/* The sun (inline SVG from rv_start_sun()). */
.rv-sun { display: block; width: 100%; height: auto; overflow: visible; }
.rv-sun__halo { fill: var(--a-wash); }
.rv-sun__core { fill: var(--a); transition: fill .25s ease; }
.rv-sun__ring { fill: none; stroke: var(--a); stroke-width: 2.5; transition: stroke .25s ease; }
.rv-sun__rays { fill: none; stroke: var(--rv-corail); stroke-width: 3.5; stroke-linecap: round; transition: stroke .25s ease; }
.rv-sun__horizon { fill: none; stroke: var(--rv-line); stroke-width: 2; }
.rv-sun__arc { fill: none; stroke: var(--a-soft); stroke-width: 1.5; }
.rv-sun__arc--dash { stroke-dasharray: 1.5 7; stroke-linecap: round; stroke-width: 2.5; }

/* Tabs. */
.rv-start__tabs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--rv-s2); }
.rv-start__tab {
	display: grid; gap: var(--rv-s3); align-content: start; padding: var(--rv-s5);
	border-radius: var(--rv-r-l) var(--rv-r-l) 0 0; color: var(--rv-ink); text-decoration: none; cursor: pointer;
	transition: background-color .2s ease;
}
.rv-start__tab .rv-sun { width: 132px; }
.rv-start__tlabel { display: grid; gap: 2px; }
.rv-start__tname { font: 800 1.4rem/1.1 var(--rv-font-h); letter-spacing: -.03em; }
.rv-start__tline { font-size: var(--rv-fs-sm); line-height: 1.4; color: var(--rv-grey); }
.rv-start__tcount { margin-top: 4px; font-size: .875rem; font-weight: 600; color: var(--a-text); }
.rv-start__tab:hover { color: var(--rv-ink); }
.rv-start__tab:hover .rv-start__tname { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .2em; text-decoration-color: var(--a); }
.rv-start__tab:focus-visible { outline-offset: -3px; border-radius: var(--rv-r-l) var(--rv-r-l) 0 0; }
.rv-start:not(.is-tabs) .rv-start__tab { border: 1px solid var(--rv-line); border-radius: var(--rv-r-l); }
.is-tabs .rv-start__tab[aria-selected="true"] { background: var(--rv-creme-2); }
.is-tabs .rv-start__tab[aria-selected="true"] .rv-start__tname { text-decoration: none; }
.is-tabs .rv-start__tab[aria-selected="false"] .rv-sun__core { fill: var(--a-soft); }
.is-tabs .rv-start__tab[aria-selected="false"] .rv-sun__ring { stroke: var(--a-soft); }
.is-tabs .rv-start__tab[aria-selected="false"] .rv-sun__rays { stroke: var(--rv-corail-tint); }

/* Panels. */
.rv-start__panels { display: grid; gap: var(--rv-s5); margin-top: var(--rv-s5); }
.is-tabs .rv-start__panels { margin-top: 0; }
.rv-start__panel { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 340px); gap: var(--rv-s7); padding: var(--rv-s7); background: var(--rv-creme-2); border-radius: var(--rv-r-xl); scroll-margin-top: 96px; }
.rv-start__panel[hidden] { display: none; }
.is-tabs .rv-start__panel:focus { outline: none; }
.is-tabs .rv-start__tabs:has(> :first-child[aria-selected="true"]) + .rv-start__panels .rv-start__panel { border-top-left-radius: 0; }
.is-tabs .rv-start__tabs:has(> :last-child[aria-selected="true"]) + .rv-start__panels .rv-start__panel { border-top-right-radius: 0; }
.rv-start__title { margin: 0; font-size: 1.6rem; font-weight: 800; letter-spacing: -.03em; line-height: 1.1; }
.rv-start__line { margin: 2px 0 var(--rv-s5); font-size: var(--rv-fs-sm); color: var(--rv-grey); }
/* In tabs mode the tab already names the family: the panel heading stays for screen readers only. */
.is-tabs .rv-start__title, .is-tabs .rv-start__line { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

.rv-start__tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--rv-s3); margin: 0; padding: 0; list-style: none; }
.rv-start__tile {
	display: flex; gap: var(--rv-s4); align-items: flex-start; box-sizing: border-box; height: 100%; padding: var(--rv-s4) var(--rv-s5) var(--rv-s5) var(--rv-s4);
	background: var(--rv-white); border: 1px solid var(--rv-line); border-radius: 16px; color: var(--rv-ink); text-decoration: none; transition: border-color .15s ease;
}
.rv-start__tile:hover { border-color: var(--a-text); color: var(--rv-ink); }
.rv-start__tile:hover .rv-start__tname2 { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .18em; }
.rv-start__ticon { display: grid; place-items: center; flex: none; width: 44px; height: 44px; border-radius: 12px; background: var(--a-wash); color: var(--a-text); }
.rv-start__ttext { display: grid; gap: 4px; min-width: 0; }
.rv-start__tname2 { font: 700 1.1rem/1.25 var(--rv-font-h); letter-spacing: -.015em; }
.rv-start__tdesc { font-size: var(--rv-fs-sm); line-height: 1.45; color: var(--rv-grey); }

.rv-start__side { display: grid; align-content: start; gap: var(--rv-s2); }
.rv-sun--big { width: 100%; max-width: 300px; margin: 0 auto -10px; }
.rv-sun--big .rv-sun__horizon { stroke: transparent; }
.rv-start__first {
	position: relative; display: flex; gap: var(--rv-s4); align-items: center; padding: var(--rv-s4) var(--rv-s5);
	background: var(--rv-white); border: 1px solid var(--rv-line); border-radius: 16px; color: var(--rv-ink); text-decoration: none; transition: border-color .15s ease;
}
.rv-start__first:hover { border-color: var(--a-text); color: var(--rv-ink); }
.rv-start__first:hover .rv-start__ftitle { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .18em; }
.rv-start__img { flex: none; display: block; width: 96px; height: 72px; object-fit: cover; border-radius: 10px; }
.rv-start__ftext { display: grid; gap: 2px; min-width: 0; }
.rv-start__flabel { font-size: .875rem; font-weight: 600; color: var(--a-text); }
.rv-start__ftitle { font: 700 1.2rem/1.25 var(--rv-font-h); letter-spacing: -.02em; }
.rv-start__fline { font-size: var(--rv-fs-sm); color: var(--rv-grey); }
.rv-start__devis { display: flex; gap: var(--rv-s2); align-items: center; min-height: 44px; padding: 0 var(--rv-s1); font-size: var(--rv-fs-sm); font-weight: 600; color: var(--rv-teal-d); text-decoration: none; }
.rv-start__devis svg { flex: none; width: 20px; height: 20px; }
.rv-start__devis:hover span { text-decoration: underline; text-underline-offset: .18em; }

/* The one interaction: choosing a family makes its sun rise above the first step. */
@media (prefers-reduced-motion: no-preference) {
	.is-tabs .rv-start__panel:not([hidden]) .rv-sun--big .rv-sun__rise { animation: rv-start-rise .7s var(--rv-ease) both; }
	.is-tabs .rv-start__panel:not([hidden]) .rv-sun--big .rv-sun__arc { animation: rv-sun-fade .6s .2s ease both; }
}
@keyframes rv-start-rise { from { transform: translateY(34px); } to { transform: none; } }

@media (max-width: 1079px) {
	.rv-start__panel { grid-template-columns: minmax(0, 1fr) minmax(0, 280px); gap: var(--rv-s6); padding: var(--rv-s6); }
	.rv-start__tiles { grid-template-columns: 1fr; }
}
@media (max-width: 899px) {
	.rv-start__intro { grid-template-columns: 1fr; margin-bottom: var(--rv-s5); }
	.rv-start__tab { padding: var(--rv-s4); }
	.rv-start__tab .rv-sun { width: 96px; }
	.rv-start__tname { font-size: 1.15rem; }
	.rv-start__tline { display: none; }
	.rv-start__panel { grid-template-columns: 1fr; gap: var(--rv-s5); padding: var(--rv-s5); }
	.rv-start__side { order: -1; }
	.rv-sun--big { max-width: 180px; }
	.rv-start__tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 599px) {
	.rv-start__tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.rv-start__tab { gap: var(--rv-s2); padding: var(--rv-s3) var(--rv-s4) var(--rv-s4); border: 1px solid var(--rv-line); border-radius: var(--rv-r-m); }
	.rv-start__tab:focus-visible { border-radius: var(--rv-r-m); }
	.rv-start__tab .rv-sun { width: 84px; }
	.is-tabs .rv-start__tab[aria-selected="true"] { border-color: var(--a); box-shadow: inset 0 0 0 1px var(--a); }
	.is-tabs .rv-start__panels { margin-top: var(--rv-s3); }
	.rv-start__panel { padding: var(--rv-s5) var(--rv-s4); border-radius: var(--rv-r-l); }
	.rv-start__tiles { grid-template-columns: 1fr; }
	.rv-start__img { width: 80px; height: 60px; }
}

/* ── Rubriques: 4 groups (crème band) ─────────────── */
.rv-groups { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--rv-s5); align-items: start; }
.rv-group__title { margin: 0; font-size: 1.3rem; font-weight: 800; letter-spacing: -.02em; line-height: 1.2; }
.rv-group__line { margin: 2px 0 var(--rv-s4); font-size: var(--rv-fs-sm); color: var(--rv-grey); }
.rv-group__tiles { display: grid; gap: var(--rv-s3); margin: 0; padding: 0; list-style: none; }
.rv-tile {
	display: flex; gap: var(--rv-s3); align-items: flex-start; padding: var(--rv-s4);
	background: var(--rv-white); border: 1px solid var(--rv-line); border-radius: 16px;
	color: var(--rv-ink); text-decoration: none; transition: border-color .15s ease;
}
.rv-tile:hover { border-color: var(--rv-teal); color: var(--rv-ink); }
.rv-tile:hover .rv-tile__name { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .18em; }
.rv-tile__icon { display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: 12px; background: var(--rv-creme); color: var(--rv-teal-d); }
.rv-group--renover .rv-tile__icon, .rv-group--equiper .rv-tile__icon { background: var(--rv-teal-tint); }
.rv-tile__text { display: grid; gap: 2px; min-width: 0; }
.rv-tile__name { font: 700 1.05rem/1.25 var(--rv-font-h); letter-spacing: -.015em; }
.rv-tile__line { font-size: var(--rv-fs-sm); line-height: 1.4; color: var(--rv-grey); }
.rv-tile__count { margin-top: 4px; font-size: .875rem; font-weight: 600; color: var(--rv-teal-d); }
@media (max-width: 1079px) { .rv-groups { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--rv-s6) var(--rv-s5); } }
@media (max-width: 599px) { .rv-groups { grid-template-columns: 1fr; } }

/* ── Comment se passe un chantier ───────────────────
   Four stages on one horizon; the sun rises a little more at each one: a glimmer, a quarter, half, then the whole
   sun inside its blue-green ring. */
.rv-stages__list { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--rv-s5); margin: 0; padding: 0; list-style: none; }
.rv-stages__list::before { content: ""; position: absolute; left: 0; right: 0; top: 95px; height: 2px; background: var(--rv-line); }
.rv-stages__item { display: grid; align-content: start; }
.rv-stages__pic { position: relative; display: block; width: 120px; height: 96px; overflow: hidden; }
.rv-stages__pic i { position: absolute; left: 50%; display: block; box-sizing: border-box; border-radius: 50%; }
.rv-stages__sun { width: 56px; height: 56px; margin-left: -28px; background: var(--rv-corail); box-shadow: 0 0 0 12px var(--rv-corail-tint); }
.rv-stages__ring { width: 100px; height: 100px; margin-left: -50px; border: 2px solid var(--rv-teal); opacity: 0; }
.rv-stages__item--1 .rv-stages__sun { top: 82px; }
.rv-stages__item--2 .rv-stages__sun { top: 62px; }
.rv-stages__item--3 .rv-stages__sun { top: 42px; }
.rv-stages__item--4 .rv-stages__sun { top: 24px; }
.rv-stages__item--4 .rv-stages__ring { top: 2px; opacity: 1; }
.rv-stages__n { display: grid; place-items: center; width: 32px; height: 32px; margin-top: var(--rv-s4); border-radius: 50%; background: var(--rv-ink); color: #fff; font: 700 .95rem/1 var(--rv-font-h); }
.rv-stages__title { margin: var(--rv-s3) 0 0; font-size: var(--rv-fs-h3); font-weight: 700; letter-spacing: -.015em; line-height: 1.25; }
.rv-stages__item p { margin: var(--rv-s2) 0 0; font-size: var(--rv-fs-sm); line-height: 1.5; color: var(--rv-grey); }
.rv-stages__link { justify-self: start; margin-top: var(--rv-s3); padding: 4px 0; font-size: var(--rv-fs-sm); font-weight: 600; }
@media (max-width: 899px) {
	.rv-stages__list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--rv-s7) var(--rv-s5); }
	.rv-stages__list::before { display: none; }
	.rv-stages__pic { width: auto; border-bottom: 2px solid var(--rv-line); }
	.rv-stages__pic i { left: 60px; }
}
@media (max-width: 599px) {
	.rv-stages__list { grid-template-columns: 1fr; gap: var(--rv-s6); }
}

/* ── Bien choisir son artisan (crème band) ──────────
   The checklist is a white sheet lit by a quarter-sun sweeping in from its top-right corner. */
.rv-artisan__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: var(--rv-s8); align-items: center; }
.rv-artisan__text p { margin: var(--rv-s3) 0 var(--rv-s5); max-width: 46ch; color: var(--rv-grey); font-size: var(--rv-fs-lead); line-height: 1.5; }
.rv-artisan__sheet { position: relative; overflow: hidden; isolation: isolate; padding: var(--rv-s6); background: var(--rv-white); border: 1px solid var(--rv-line); border-radius: var(--rv-r-l); }
.rv-artisan__light { position: absolute; z-index: -1; top: 0; right: 0; width: 132px; height: 132px; }
.rv-artisan__light .l-glow { fill: var(--rv-creme-2); }
.rv-artisan__sheet-title { max-width: calc(100% - 90px); margin: 0 0 var(--rv-s3); font: 800 1.3rem/1.2 var(--rv-font-h); letter-spacing: -.02em; }
.rv-artisan__list { margin: 0; padding: 0; list-style: none; }
.rv-artisan__list li { display: flex; gap: var(--rv-s3); align-items: flex-start; padding: var(--rv-s3) 0; border-top: 1px dashed var(--rv-line); line-height: 1.45; }
.rv-artisan__list .rv-icon { width: 28px; height: 28px; padding: 5px; box-sizing: border-box; border-radius: 50%; background: var(--rv-teal-tint); color: var(--rv-teal-d); }
@media (max-width: 899px) {
	.rv-artisan__grid { grid-template-columns: 1fr; gap: var(--rv-s4); }
	.rv-artisan__sheet { padding-inline: var(--rv-s5); }
	.rv-artisan__light { width: 112px; height: 112px; }
}

/* ── Votre projet en 3 étapes ───────────────────────
   A real form to the devis page: type of works (radio chips) › what to prepare for its family (switched in CSS with
   :has(); without it the general list shows) › « Recevoir mes devis ». The step numbers light up from crème to coral;
   a half-sun rises from the card's floor behind the last step. */
.rv-projet__card { position: relative; overflow: hidden; padding: var(--rv-s7); background: var(--rv-white); border: 1px solid var(--rv-line); border-radius: var(--rv-r-xl); }
.rv-projet__card::after { content: ""; position: absolute; z-index: 0; right: -60px; bottom: -150px; width: 300px; height: 300px; border-radius: 50%; background: radial-gradient(circle, var(--rv-corail-tint) 0 46%, var(--rv-creme) 46.5% 70%, transparent 70.5%); pointer-events: none; }
.rv-projet__head { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--rv-s3) var(--rv-s7); align-items: end; margin-bottom: var(--rv-s6); }
.rv-projet__head p { margin: 0; max-width: 46ch; color: var(--rv-grey); }
.rv-projet__steps { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr) minmax(0, .85fr); margin: 0; padding: 0; list-style: none; }
.rv-projet__step { min-width: 0; padding: 0 var(--rv-s6); }
.rv-projet__step--1 { padding-left: 0; }
.rv-projet__step--3 { padding-right: 0; }
.rv-projet__step + .rv-projet__step { border-left: 1px solid var(--rv-line); }
.rv-projet__step fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.rv-projet__label { display: flex; align-items: center; gap: var(--rv-s3); margin: 0 0 var(--rv-s4); padding: 0; font: 700 1.15rem/1.25 var(--rv-font-h); letter-spacing: -.015em; color: var(--rv-ink); }
.rv-projet__n { display: grid; place-items: center; flex: none; width: 32px; height: 32px; border-radius: 50%; font: 700 .95rem/1 var(--rv-font-h); color: var(--rv-ink); }
.rv-projet__step--1 .rv-projet__n { background: var(--rv-creme); }
.rv-projet__step--2 .rv-projet__n { background: var(--rv-corail-tint); }
.rv-projet__step--3 .rv-projet__n { background: var(--rv-corail); }

.rv-projet__chips { display: flex; flex-wrap: wrap; gap: var(--rv-s2); margin: 0; padding: 0; list-style: none; }
.rv-projet__chip {
	display: inline-flex; align-items: center; gap: 6px; min-height: 44px; box-sizing: border-box; padding: 0 14px 0 12px;
	border: 1px solid var(--rv-line); border-radius: var(--rv-r-pill); background: var(--rv-creme-2);
	font-size: var(--rv-fs-sm); font-weight: 500; color: var(--rv-ink); cursor: pointer; transition: border-color .15s ease, background-color .15s ease;
}
.rv-projet__chip svg { flex: none; width: 18px; height: 18px; color: var(--rv-teal-d); }
.rv-projet__chip input { position: absolute; width: 1px; height: 1px; margin: 0; opacity: 0; }
.rv-projet__chip:hover { border-color: var(--rv-teal); }
.rv-projet__chip:has(input:checked) { background: var(--rv-teal-tint); border-color: var(--rv-teal-d); color: var(--rv-teal-d); font-weight: 600; }
.rv-projet__chip:has(input:focus-visible) { outline: 2px solid var(--rv-teal); outline-offset: 2px; }

.rv-projet__prep { display: none; }
.rv-projet__prep--all { display: block; }
.rv-projet:has(input[data-g]:checked) .rv-projet__prep--all { display: none; }
.rv-projet:has(input[data-g="0"]:checked) .rv-projet__prep[data-g="0"],
.rv-projet:has(input[data-g="1"]:checked) .rv-projet__prep[data-g="1"],
.rv-projet:has(input[data-g="2"]:checked) .rv-projet__prep[data-g="2"],
.rv-projet:has(input[data-g="3"]:checked) .rv-projet__prep[data-g="3"] { display: block; }
.rv-projet__for { margin: 0 0 var(--rv-s2); font-size: .875rem; font-weight: 600; color: var(--rv-corail-t); }
.rv-projet__prep ul { display: grid; gap: var(--rv-s3); margin: 0; padding: 0; list-style: none; }
.rv-projet__prep li { display: flex; gap: var(--rv-s2); align-items: flex-start; font-size: var(--rv-fs-sm); line-height: 1.45; }
.rv-projet__prep li svg { flex: none; width: 20px; height: 20px; margin-top: 1px; color: var(--rv-teal); }

.rv-projet__step--3 p { margin: 0 0 var(--rv-s4); font-size: var(--rv-fs-sm); line-height: 1.5; color: var(--rv-grey); }
.rv-projet__btn { width: 100%; }
.rv-projet__badges { margin-top: var(--rv-s4); }
.rv-projet__badges .rv-badge { min-height: 32px; font-size: .875rem; }

@media (max-width: 1079px) {
	.rv-projet__steps { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--rv-s6) 0; }
	.rv-projet__step--1 { grid-column: 1 / -1; padding-right: 0; }
	.rv-projet__step--2 { padding-left: 0; border-left: 0 !important; }
}
@media (max-width: 699px) {
	.rv-projet__card { padding: var(--rv-s6) var(--rv-s4); border-radius: var(--rv-r-l); }
	.rv-projet__head { grid-template-columns: 1fr; margin-bottom: var(--rv-s5); }
	.rv-projet__steps { grid-template-columns: 1fr; gap: 0; }
	.rv-projet__step { padding: var(--rv-s5) 0; }
	.rv-projet__step--1 { padding-top: 0; }
	.rv-projet__step + .rv-projet__step { border-left: 0; border-top: 1px solid var(--rv-line); }
	/* Twelve types on a phone: two columns of compact tiles instead of a long pill list. */
	.rv-projet__chips { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.rv-projet__chip { width: 100%; height: 100%; padding: 8px 10px; border-radius: var(--rv-r-s); font-size: .875rem; line-height: 1.25; }
}

/* ── Pourquoi comparer 3 devis ? ────────────────────
   The six lines to read, beside three blank quote sheets crossed by one lit row (the same line, read across). */
.rv-comparer { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: var(--rv-s8); align-items: center; }
.rv-comparer__lead { margin: var(--rv-s3) 0 var(--rv-s5); max-width: 52ch; color: var(--rv-grey); }
.rv-comparer__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--rv-s5) var(--rv-s6); margin: 0; }
.rv-comparer__list div { padding-top: var(--rv-s3); border-top: 2px solid var(--rv-line); }
.rv-comparer__list dt { font: 700 1.05rem/1.25 var(--rv-font-h); letter-spacing: -.015em; }
.rv-comparer__list dd { margin: 4px 0 0; font-size: var(--rv-fs-sm); line-height: 1.5; color: var(--rv-grey); }
.rv-comparer__cta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--rv-s3) var(--rv-s4); margin-top: var(--rv-s6); }
.rv-comparer__cta span { font-size: var(--rv-fs-sm); color: var(--rv-grey); }

.rv-comparer__art { position: relative; overflow: hidden; display: grid; place-items: center; min-height: 380px; padding: var(--rv-s6) var(--rv-s5); background: var(--rv-creme-2); border-radius: var(--rv-r-xl); }
.rv-comparer__light { position: absolute; top: 0; right: 0; width: 48%; height: auto; }
.rv-comparer__sheets { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--rv-s3); width: 100%; max-width: 400px; }
/* The lit row runs behind the three sheets. */
.rv-comparer__sheets::before { content: ""; position: absolute; left: -100vw; right: -100vw; top: 90px; height: 30px; background: var(--rv-corail-tint); opacity: .7; }
.rv-comparer__sheet { position: relative; display: grid; gap: 14px; align-content: start; padding: 22px 14px 26px; background: var(--rv-white); border: 1px solid var(--rv-line); border-radius: 12px; }
.rv-comparer__sheet i { display: block; height: 8px; border-radius: 4px; background: var(--rv-line); }
.rv-comparer__sheet .rv-comparer__top { width: 55%; height: 12px; margin-bottom: 8px; background: var(--rv-ink); opacity: .85; }
.rv-comparer__sheet .rv-comparer__lit { height: 10px; background: var(--rv-corail); }
.rv-comparer__sheet .rv-comparer__short { width: 60%; }

@media (max-width: 899px) {
	.rv-comparer { grid-template-columns: 1fr; gap: var(--rv-s6); }
	.rv-comparer__art { min-height: 300px; order: -1; }
}
@media (max-width: 599px) {
	.rv-comparer__list { grid-template-columns: 1fr; gap: var(--rv-s4); }
	.rv-comparer__art { min-height: 260px; border-radius: var(--rv-r-l); }
	.rv-comparer__cta .rv-btn { width: 100%; }
}

/* ── Les travaux de saison ──────────────────────────
   Each season is the sun's path across its sky: low in winter, high in summer. The current season comes first. */
.rv-saisons .rv-section__head { align-items: end; }
.rv-saisons__lead { margin: 0; max-width: 52ch; font-size: var(--rv-fs-sm); color: var(--rv-grey); }
.rv-saisons__list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--rv-s4); margin: 0; padding: 0; list-style: none; }
.rv-season { display: flex; flex-direction: column; padding: var(--rv-s5); background: var(--rv-white); border: 1px solid var(--rv-line); border-radius: var(--rv-r-l); }
.rv-season.is-now { background: var(--rv-creme-2); border-color: var(--rv-corail-tint); }
.rv-season__sky { display: block; width: 100%; max-width: 200px; height: auto; margin-bottom: var(--rv-s4); }
.rv-season__path { fill: none; stroke: var(--rv-corail-tint); stroke-width: 2; stroke-dasharray: 2 6; stroke-linecap: round; }
.rv-season__horizon { fill: none; stroke: var(--rv-line); stroke-width: 2; }
.rv-season__halo { fill: var(--rv-creme); }
.rv-season__sun { fill: var(--rv-corail); }
.rv-season--hiver .rv-season__sun { fill: var(--rv-teal); }
.rv-season--hiver .rv-season__halo { fill: var(--rv-teal-tint); }
.rv-season__title { display: flex; flex-wrap: wrap; align-items: center; gap: var(--rv-s2); margin: 0; font-size: 1.3rem; font-weight: 800; letter-spacing: -.02em; line-height: 1.2; }
.rv-season__now { padding: 3px 10px; border-radius: var(--rv-r-pill); background: var(--rv-white); border: 1px solid var(--rv-corail-tint); font: 600 .8125rem/1.3 var(--rv-font-b); letter-spacing: 0; color: var(--rv-corail-t); }
.rv-season p { margin: var(--rv-s2) 0 var(--rv-s3); font-size: var(--rv-fs-sm); line-height: 1.5; color: var(--rv-grey); }
.rv-season__cats { display: flex; flex-wrap: wrap; gap: 0 var(--rv-s3); margin: 0 0 var(--rv-s3); padding: 0; list-style: none; font-size: var(--rv-fs-sm); }
.rv-season__cats a { display: inline-block; padding: 6px 0; font-weight: 600; color: var(--rv-teal-d); }
.rv-season__devis { display: inline-flex; align-items: center; align-self: start; min-height: 44px; margin-top: auto; padding: 0 var(--rv-s4); border-radius: var(--rv-r-s); background: var(--rv-white); border: 1px solid var(--rv-line); font-size: var(--rv-fs-sm); font-weight: 600; color: var(--rv-ink); text-decoration: none; transition: border-color .15s ease; }
.rv-season__devis:hover { border-color: var(--rv-teal); color: var(--rv-ink); }
@media (max-width: 1079px) { .rv-saisons__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 599px) {
	.rv-saisons__list { grid-template-columns: 1fr; }
	.rv-season__sky { max-width: 150px; }
}

/* ── Les derniers guides ────────────────────────────
   An editorial front page: the newest guide is the lead (big image, rubrique chip, « En bref », reading time) and
   stands in front of a half-sun rising behind its card; the next four are listed beside it with small thumbnails.
   The first visible item of the list is the lead (.is-lead). Family chips (buttons, aria-pressed, revealed by
   assets/js/home-latest.js) filter the list; choosing one replays the sunrise. */
.rv-latest__head { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--rv-s4) var(--rv-s7); align-items: end; }
.rv-latest__intro p { margin: var(--rv-s3) 0 0; max-width: 46ch; color: var(--rv-grey); }
.rv-latest__filters { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: var(--rv-s2); }
.rv-latest__filters[hidden] { display: none; }
.rv-latest__chip {
	min-height: 44px; padding: 0 18px; border: 1px solid var(--rv-line); border-radius: var(--rv-r-pill);
	background: var(--rv-white); color: var(--rv-ink); font: 500 var(--rv-fs-sm)/1 var(--rv-font-b); cursor: pointer;
	transition: border-color .15s ease, background-color .15s ease, color .15s ease;
}
.rv-latest__chip:hover { border-color: var(--rv-teal); }
.rv-latest__chip[aria-pressed="true"] { background: var(--rv-teal-d); border-color: var(--rv-teal-d); color: var(--rv-white); font-weight: 600; }

/* Stage: the sun stands on a line 40px under the top of the lead card, so only its upper part shows. */
.rv-latest__stage { position: relative; margin-top: var(--rv-s3); padding-top: 80px; }
.rv-latest__sun { position: absolute; z-index: 0; top: -16px; left: calc(40% - 176px); width: 352px; height: auto; pointer-events: none; }
.rv-latest__sun .l-glow { fill: var(--rv-creme); }
.rv-latest__sun .l-ring { stroke-dasharray: 2 8; stroke-linecap: round; }

.rv-latest__list {
	position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
	grid-template-rows: repeat(4, auto) minmax(88px, 1fr); column-gap: var(--rv-s7); margin: 0; padding: 0; list-style: none;
}
.rv-latest__item[hidden] { display: none; }
.rv-latest__item { grid-column: 2; }
.rv-latest__item.is-lead { grid-column: 1; grid-row: 1 / -1; }

.rv-latest__card { position: relative; }
.rv-latest__link { color: var(--rv-ink); text-decoration: none; }
.rv-latest__link::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.rv-latest__link:focus-visible { outline: none; }
.rv-latest__link:focus-visible::after { outline: 2px solid var(--rv-teal); outline-offset: 3px; }
.rv-latest__card:hover .rv-latest__link { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 3px; text-decoration-color: var(--rv-corail); }
.rv-latest__media { overflow: hidden; background: var(--rv-creme); }
.rv-latest__img { display: block; width: 100%; height: 100%; object-fit: cover; }
.rv-latest__ph { display: grid; place-items: center; width: 100%; height: 100%; color: var(--rv-corail-t); background: linear-gradient(180deg, var(--rv-creme), var(--rv-creme-2)); }
.rv-latest__body > * { margin: 0; }
.rv-latest__cat { display: flex; align-items: center; gap: 6px; font-size: .875rem; font-weight: 600; color: var(--rv-corail-t); }
.rv-latest__cat .rv-icon { width: 18px; height: 18px; flex: none; }
.rv-latest__title { font-family: var(--rv-font-h); font-weight: 700; letter-spacing: -.015em; }
.rv-latest__time { display: flex; align-items: center; gap: 6px; font-size: var(--rv-fs-xs); color: var(--rv-grey); }
.rv-latest__time .rv-icon { width: 16px; height: 16px; flex: none; }
.rv-latest__brief { display: none; }

/* The list beside the lead: thumbnail and text, separated by hairlines. */
.rv-latest__item:not(.is-lead) .rv-latest__card { display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: var(--rv-s4); align-items: center; padding: var(--rv-s4) 0; border-top: 1px solid var(--rv-line); }
.rv-latest__item.is-next .rv-latest__card { padding-top: 0; border-top: 0; }
.rv-latest__item:not(.is-lead) .rv-latest__media { aspect-ratio: 1; border-radius: var(--rv-r-m); }
.rv-latest__item:not(.is-lead) .rv-latest__body { display: grid; gap: 6px; }
.rv-latest__item:not(.is-lead) .rv-latest__title { font-size: 1.0625rem; line-height: 1.3; }

/* The lead: a white card in front of the sun. */
.rv-latest__item.is-lead .rv-latest__card { padding: 12px; background: var(--rv-white); border: 1px solid var(--rv-line); border-radius: var(--rv-r-xl); transition: border-color .15s ease; }
.rv-latest__item.is-lead .rv-latest__card:hover { border-color: var(--rv-teal); }
.rv-latest__item.is-lead .rv-latest__media { aspect-ratio: 16 / 10; border-radius: var(--rv-r-l); }
.rv-latest__item.is-lead .rv-latest__ph .rv-icon { width: 56px; height: 56px; }
.rv-latest__item.is-lead .rv-latest__body { display: grid; gap: var(--rv-s3); padding: var(--rv-s5) var(--rv-s4) var(--rv-s3); }
.rv-latest__item.is-lead .rv-latest__cat { justify-self: start; min-height: 32px; padding: 0 12px 0 10px; border-radius: var(--rv-r-pill); background: var(--rv-creme); }
.rv-latest__item.is-lead .rv-latest__title { font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem); line-height: 1.15; letter-spacing: -.025em; text-wrap: balance; }
.rv-latest__item.is-lead .rv-latest__brief { display: block; padding-left: var(--rv-s4); border-left: 3px solid var(--rv-corail-tint); }
.rv-latest__blabel { display: flex; align-items: center; gap: 6px; margin: 0 0 4px; font: 700 .9375rem/1.2 var(--rv-font-h); }
.rv-latest__blabel .rv-icon { width: 18px; height: 18px; color: var(--rv-teal-d); }
.rv-latest__btext { display: -webkit-box; margin: 0; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 4; line-clamp: 4; line-height: 1.55; color: var(--rv-ink); }
.rv-latest__item.is-lead .rv-latest__time { font-size: var(--rv-fs-sm); }

/* One guide only: the lead spreads over the whole width, image beside the text. */
.rv-latest__list[data-n="1"] { grid-template-columns: 1fr; grid-template-rows: auto; }
.rv-latest__list[data-n="1"] .is-lead .rv-latest__card { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); align-items: center; }
@media (min-width: 900px) { .rv-latest__list[data-n="1"] .is-lead .rv-latest__body { padding: var(--rv-s5) var(--rv-s6); } }

/* « Voir tous les guides » closes the list column, level with the foot of the lead card (the last grid row keeps room for it). */
.rv-latest__all { position: absolute; z-index: 1; bottom: 0; left: calc((100% - var(--rv-s7)) * 1.2 / 2.2 + var(--rv-s7)); margin: 0; }
.rv-latest__list[data-n="1"] + .rv-latest__all { position: static; margin-top: var(--rv-s5); }

/* Choosing a family: the sun rises again behind the new lead. */
@media (prefers-reduced-motion: no-preference) {
	.rv-latest__stage.is-rising .rv-latest__rise { animation: rv-latest-rise .7s var(--rv-ease) both; }
	.rv-latest__stage.is-rising .is-lead .rv-latest__card { animation: rv-sun-fade .35s ease both; }
}
@keyframes rv-latest-rise { from { transform: translateY(60px); } to { transform: none; } }

@media (max-width: 899px) {
	.rv-latest__head { grid-template-columns: 1fr; }
	.rv-latest__filters { justify-content: flex-start; }
	.rv-latest__stage { margin-top: var(--rv-s5); padding-top: 72px; }
	.rv-latest__sun { top: -10px; left: calc(50% - 150px); width: 300px; }
	.rv-latest__list, .rv-latest__list[data-n="1"] { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; }
	.rv-latest__item, .rv-latest__item.is-lead { grid-column: 1; grid-row: auto; }
	.rv-latest__item.is-lead { margin-bottom: var(--rv-s5); }
	.rv-latest__list[data-n="1"] .is-lead .rv-latest__card { display: block; }
	.rv-latest__all { position: static; margin-top: var(--rv-s5); }
}
@media (max-width: 599px) {
	.rv-latest__item:not(.is-lead) .rv-latest__card { grid-template-columns: 84px minmax(0, 1fr); gap: var(--rv-s3); }
	.rv-latest__item.is-lead .rv-latest__card { padding: 8px; border-radius: var(--rv-r-l); }
	.rv-latest__item.is-lead .rv-latest__media { border-radius: var(--rv-r-m); }
	.rv-latest__item.is-lead .rv-latest__body { padding: var(--rv-s4) var(--rv-s2) var(--rv-s2); }
	.rv-latest__all .rv-btn { width: 100%; }
}
