:root{
  --noir:#0D0D0D; --encre:#3A3A38; --encre-clair:#6B6862;
  --papier:#FAF8F5; --blanc:#FFFFFF; --or:#B8860B;
  --ligne:#E3DFD7;
  --serif:'Cormorant Garamond', Georgia, serif;
  --sans:'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{background:var(--papier);color:var(--encre);font-family:var(--sans);font-size:17px;line-height:1.75;font-weight:300;-webkit-font-smoothing:antialiased}
.wrap{max-width:1180px;margin:0 auto;padding:0 28px}
.narrow{max-width:680px}
h1,h2,h3{font-family:var(--serif);color:var(--noir);font-weight:400;line-height:1.15;letter-spacing:-.01em}
h1{font-size:clamp(2.4rem,5.6vw,4.1rem)}
h2{font-size:clamp(1.8rem,3.4vw,2.7rem)}
h3{font-size:clamp(1.25rem,2vw,1.55rem)}
p{margin-bottom:1.15em}
p:last-child{margin-bottom:0}
a{color:inherit}
strong{font-weight:500}

.label{font-size:.68rem;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--or);display:block;margin-bottom:1.5rem}
.chapo{font-size:1.12rem;color:var(--encre-clair);max-width:56ch}

/* en-tête */
header{position:sticky;top:0;z-index:50;background:rgba(250,248,245,.94);backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid var(--ligne)}
.nav{display:flex;align-items:center;justify-content:space-between;height:74px}
.logo{font-family:var(--serif);font-size:1.5rem;letter-spacing:.14em;color:var(--noir);text-decoration:none;font-weight:500}
.logo span{color:var(--or)}
.nav ul{display:flex;gap:2.1rem;list-style:none}
.nav a{text-decoration:none;font-size:.85rem;letter-spacing:.04em;color:var(--encre);padding-bottom:3px;border-bottom:1px solid transparent;transition:border-color .25s}
.nav a:hover,.nav a.actif{border-color:var(--or)}
.burger{display:none;background:none;border:0;font-size:1.4rem;color:var(--noir);cursor:pointer}
#menu-mobile{display:none;border-top:1px solid var(--ligne);padding:14px 0}
#menu-mobile.ouvert{display:block}
#menu-mobile ul{list-style:none}
#menu-mobile a{display:block;padding:11px 0;text-decoration:none;font-size:.95rem;border-bottom:1px solid var(--ligne)}

section{padding:clamp(64px,8vw,120px) 0}
.tete{padding-top:clamp(52px,6vw,88px);padding-bottom:clamp(28px,3vw,44px)}
.tete h1{max-width:17ch;margin-bottom:1.3rem}

/* emplacements photo */
.ph{position:relative;width:100%;background:linear-gradient(135deg,#EFEAE2 0%,#E4DED4 60%,#DCD5C9 100%);border:1px solid var(--ligne);display:flex;align-items:center;justify-content:center;overflow:hidden}
.ph::after{content:'';position:absolute;inset:14px;border:1px solid rgba(184,134,11,.28);pointer-events:none}
.ph-32{aspect-ratio:3/2}.ph-45{aspect-ratio:4/5}.ph-169{aspect-ratio:16/9}.ph-11{aspect-ratio:1/1}
.ph-note{position:relative;z-index:2;text-align:center;padding:22px 28px;max-width:34ch}
.ph-note strong{display:block;font-size:.65rem;letter-spacing:.2em;text-transform:uppercase;color:var(--or);margin-bottom:.5rem;font-weight:600}
.ph-note em{font-style:normal;font-size:.88rem;color:var(--encre-clair);line-height:1.5;display:block}

/* grilles */
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(26px,4vw,60px)}
.trio>div{padding-top:1.5rem;border-top:1px solid var(--ligne)}
.trio h3{margin-bottom:.6rem}
.trio p{font-size:.95rem;color:var(--encre-clair)}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4.5vw,72px)}
.duo-large{grid-template-columns:1.15fr 1fr}

.fond-blanc{background:var(--blanc);border-top:1px solid var(--ligne);border-bottom:1px solid var(--ligne)}

/* projets */
.carte{display:block;text-decoration:none;color:inherit}
.carte h3{margin:1.2rem 0 .4rem;font-size:1.4rem}
.meta{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--encre-clair);display:block;margin-bottom:.9rem}
.carte p{font-size:.94rem;color:var(--encre-clair)}
.statut{display:inline-block;font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;border:1px solid var(--or);color:var(--or);padding:3px 10px;margin-left:10px;vertical-align:2px}
.lien{display:inline-block;margin-top:1.3rem;font-size:.82rem;letter-spacing:.08em;text-decoration:none;border-bottom:1px solid var(--or);padding-bottom:2px;color:var(--noir);transition:opacity .2s}
.lien:hover{opacity:.6}
.liste-projets{display:grid;gap:clamp(76px,9vw,140px)}

/* rythme éditorial des projets — trois compositions alternées plutôt qu'une grille répétée */
.projet figure{margin:0}
.projet figure img{width:100%;height:auto;display:block}
.projet .fiche{margin-top:0}

/* A — image pleine largeur, puis texte et faits en colonnes inégales */
.projet-a .p-corps{display:grid;grid-template-columns:minmax(0,2.6fr) minmax(0,1.2fr);gap:clamp(30px,4.5vw,76px);margin-top:clamp(22px,2.8vw,40px)}

/* B — texte à gauche, image à droite */
.projet-b{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:clamp(30px,4.5vw,68px);align-items:center}
.projet-b figure{order:2}
.projet-b .p-corps{order:1}

/* C — image à gauche, texte à droite */
.projet-c{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(30px,4.5vw,68px);align-items:center}

.projet-b .fiche,.projet-c .fiche{margin-top:1.7rem}

@media (max-width:860px){
  .projet-a .p-corps,.projet-b,.projet-c{grid-template-columns:1fr}
  .projet-b figure,.projet-b .p-corps{order:0}
}

/* comparateur */
.compare{position:relative;user-select:none;touch-action:none;cursor:ew-resize;overflow:hidden;border:1px solid var(--ligne)}
.compare .ph{border:0}
.cmp-av{position:absolute;inset:0;width:50%;overflow:hidden}
.cmp-av .ph{width:1180px;height:100%;background:linear-gradient(135deg,#2A2723 0%,#3C382F 60%,#4A4438 100%)}
.cmp-av .ph-note em{color:#A9A296}
.poignee{position:absolute;top:0;bottom:0;left:50%;width:2px;background:var(--papier);pointer-events:none}
.poignee::after{content:'‹ ›';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:44px;height:44px;border-radius:50%;background:var(--papier);border:1px solid var(--ligne);display:flex;align-items:center;justify-content:center;font-size:.95rem;color:var(--noir)}
.cmp-legende{display:flex;justify-content:space-between;margin-top:.8rem}
.cmp-legende span{font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--encre-clair)}
.compare.demo .cmp-av{animation:cmpDemoAv 2.4s ease-in-out 1}
.compare.demo .poignee{animation:cmpDemoPg 2.4s ease-in-out 1}
@keyframes cmpDemoAv{0%{width:50%}18%{width:50%}45%{width:28%}70%{width:28%}90%{width:50%}100%{width:50%}}
@keyframes cmpDemoPg{0%{left:50%}18%{left:50%}45%{left:28%}70%{left:28%}90%{left:50%}100%{left:50%}}

[data-galerie] img{cursor:zoom-in}
.lightbox-overlay{position:fixed;inset:0;background:rgba(13,13,13,.94);display:none;align-items:center;justify-content:center;z-index:999;padding:3rem 1rem}
.lightbox-overlay.actif{display:flex}
.lightbox-img{max-width:92vw;max-height:82vh;object-fit:contain;border:1px solid rgba(250,248,245,.15)}
.lightbox-fermer{position:absolute;top:1.2rem;right:1.4rem;background:none;border:0;color:var(--papier);font-size:2rem;line-height:1;cursor:pointer;opacity:.85}
.lightbox-fermer:hover{opacity:1}
.lightbox-prev,.lightbox-next{position:absolute;top:50%;transform:translateY(-50%);background:none;border:0;color:var(--papier);font-size:2.6rem;line-height:1;cursor:pointer;padding:.5rem 1.1rem;opacity:.75}
.lightbox-prev:hover,.lightbox-next:hover{opacity:1}
.lightbox-prev{left:.2rem}
.lightbox-next{right:.2rem}
.lightbox-compteur{position:absolute;bottom:1.3rem;left:50%;transform:translateX(-50%);color:var(--papier);font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;opacity:.75}
@media (max-width:640px){.lightbox-prev,.lightbox-next{font-size:2rem;padding:.4rem .7rem}}

/* fiches techniques */
.fiche{border-top:1px solid var(--ligne)}
.fiche div{display:flex;justify-content:space-between;gap:20px;padding:.72rem 0;border-bottom:1px solid var(--ligne);font-size:.92rem}
.fiche dt{color:var(--encre-clair)}
.fiche dd{text-align:right;color:var(--noir)}

/* étapes */
.etapes{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(22px,3.5vw,50px);margin-top:2.8rem}
.etape{border-top:1px solid var(--ligne);padding-top:1.4rem}
.etape .num{font-family:var(--serif);font-size:2rem;color:var(--or);line-height:1;display:block;margin-bottom:.8rem}
.etape h3{font-size:1.12rem;margin-bottom:.45rem}
.etape p{font-size:.91rem;color:var(--encre-clair)}

/* bloc noir */
.noir{background:var(--noir);color:#B5B0A6}
.noir h1,.noir h2,.noir h3{color:var(--papier)}
.noir .label{color:var(--or)}
.noir ul{list-style:none;margin-top:1.8rem}
.noir li{padding:.8rem 0;border-top:1px solid rgba(255,255,255,.1);font-size:.94rem;display:flex;gap:1rem;align-items:baseline;color:#CFCAC1}
.noir li::before{content:'—';color:var(--or)}
.noir .ph{background:linear-gradient(135deg,#22201C 0%,#2E2A24 60%,#3A342A 100%);border-color:rgba(255,255,255,.12)}
.noir .ph-note em{color:#8A857C}

/* questions */
.qa{border-top:1px solid var(--ligne);padding:2rem 0}
.qa:last-of-type{border-bottom:1px solid var(--ligne)}
.qa h3{font-size:1.26rem;margin-bottom:.7rem}
.qa p{font-size:.96rem;color:var(--encre-clair);max-width:70ch}

/* formulaire */
.champ{margin-bottom:1.25rem}
.champ label{display:block;font-size:.71rem;letter-spacing:.14em;text-transform:uppercase;color:var(--encre-clair);margin-bottom:.45rem}
.champ input,.champ textarea,.champ select{width:100%;padding:.82rem 1rem;border:1px solid var(--ligne);background:var(--papier);font-family:var(--sans);font-size:.95rem;font-weight:300;color:var(--encre);border-radius:0;transition:border-color .2s}
.champ input:focus,.champ textarea:focus,.champ select:focus{outline:0;border-color:var(--or)}
.champ textarea{min-height:118px;resize:vertical}
.btn{display:inline-block;background:var(--noir);color:var(--papier);border:1px solid var(--noir);padding:.92rem 2.1rem;font-size:.81rem;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;text-decoration:none;transition:background .25s,color .25s}
.btn:hover{background:transparent;color:var(--noir)}
.btn-ligne{background:transparent;color:var(--noir);margin-left:10px}
.btn-ligne:hover{background:var(--noir);color:var(--papier)}
.coord{border-top:1px solid var(--ligne);padding-top:1.3rem;margin-top:1.8rem}
.coord dt{font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--or);margin-bottom:.2rem}
.coord dd{margin-bottom:1.1rem;font-size:.96rem}

/* pied */
footer{background:var(--noir);color:#8A857C;padding:60px 0 36px;font-size:.87rem}
.foot{display:flex;justify-content:space-between;gap:32px;flex-wrap:wrap;align-items:flex-start}
footer a{color:#CFCAC1;text-decoration:none}
footer a:hover{color:var(--or)}
.foot-logo{font-family:var(--serif);font-size:1.4rem;letter-spacing:.14em;color:var(--papier)}
.foot-logo span{color:var(--or)}
.foot-sign{font-family:var(--serif);font-style:italic;color:#8A857C;margin-top:.4rem;font-size:1rem}
.foot ul{list-style:none;display:grid;gap:.45rem}
.legal{margin-top:40px;padding-top:20px;border-top:1px solid rgba(255,255,255,.1);font-size:.76rem;display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;color:#6E6A63}

.rev{opacity:0;transform:translateY(14px);transition:opacity .7s ease,transform .7s ease}
.rev.on{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.rev{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}

@media (max-width:860px){
  body{font-size:16px}
  .nav ul{display:none}
  .burger{display:block}
  .trio,.duo,.duo-large,.etapes{grid-template-columns:1fr}
  .duo .ph-45{aspect-ratio:16/9}
}
@media (max-width:520px){.wrap{padding:0 20px}}

/* ---------- Barre de progression (journal client et démonstration) ---------- */
.barre{flex:1;min-width:160px;height:3px;background:var(--ligne);position:relative}
.barre i{position:absolute;left:0;top:0;bottom:0;background:var(--or);display:block}

/* ══════════ ACCUEIL — ouverture ══════════ */
/* pas de photo ni de téléphone ici : l'ouverture respire, et le Journal
   garde son moment fort plus bas, avec son téléphone animé */
/* trois registres distincts : la signature, les métiers, puis la promesse */
.metiers{margin-top:1.5rem;font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:var(--encre-clair)}
.accroche{border-left:1px solid var(--or);padding-left:clamp(22px,2.8vw,40px);margin-top:clamp(56px,7vw,104px);max-width:58ch}
.accroche-phrase{font-family:var(--serif);font-size:clamp(1.5rem,2.6vw,2.05rem);line-height:1.25;color:var(--noir);margin-bottom:1.1rem}
.accroche-texte{font-size:1rem;color:var(--encre-clair);margin-bottom:0}
.accroche .lien{margin-top:1.5rem}

.btn-plein{display:inline-flex;align-items:center;gap:.9rem;background:var(--or);color:var(--papier);border:1px solid var(--or);
  padding:1rem 2rem;font-size:.76rem;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;transition:background .25s,color .25s}
.btn-plein:hover{background:transparent;color:var(--or)}

/* ══════════ ACCUEIL — nouvelle architecture ══════════ */

/* les trois temps : avant / pendant / après */
.temps{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(30px,4.6vw,84px)}
.temps>div{border-top:1px solid var(--ligne);padding-top:1.5rem}
.temps .quand{font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;color:var(--or);display:block;margin-bottom:.9rem}
.temps h3{font-size:1.2rem;margin-bottom:.7rem;max-width:20ch}
.temps p{font-size:.93rem;color:var(--encre-clair)}

/* scène du Journal — téléphone fixe, écrans qui se succèdent au défilement */
.scene{background:var(--blanc);border-top:1px solid var(--ligne);border-bottom:1px solid var(--ligne)}
/* le téléphone est placé en colonne 2 mais vient en premier dans le code,
   pour rester au-dessus du texte sur mobile — et sa cellule s'étire sur
   toute la hauteur, sans quoi il n'aurait pas de course pour rester fixe */
.scene-grille{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.72fr);gap:clamp(40px,6vw,110px);align-items:stretch}
.scene-etapes{grid-column:1;grid-row:1;display:grid;gap:clamp(150px,24vh,280px);padding:clamp(30px,6vh,80px) 0 clamp(50px,10vh,130px)}
.scene-tel{grid-column:2;grid-row:1}
.tel-sticky{position:sticky;top:clamp(96px,20vh,170px);padding-top:clamp(30px,6vh,80px)}
.etape-jr{opacity:.3;transition:opacity .8s ease}
.etape-jr.active{opacity:1}
.etape-jr .rang{font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;color:var(--or);display:block;margin-bottom:.8rem}
.etape-jr h3{font-size:1.5rem;margin-bottom:.7rem;max-width:18ch}
.etape-jr p{font-size:.96rem;color:var(--encre-clair);max-width:40ch}
/* coque de téléphone : châssis sombre, écran encastré, encoche */
.tel-appareil{position:relative;width:100%;max-width:308px;margin:0 auto;padding:11px;border-radius:48px;
  background:linear-gradient(158deg,#3A3730 0%,#141310 38%,#100F0D 62%,#332F29 100%);
  box-shadow:0 42px 84px -38px rgba(13,13,13,.5), 0 4px 16px rgba(13,13,13,.16),
             inset 0 0 0 1px rgba(255,255,255,.1)}
.tel-appareil::after{content:'';position:absolute;top:21px;left:50%;transform:translateX(-50%);
  width:82px;height:21px;border-radius:12px;background:#0A0908;z-index:4;pointer-events:none}
.tel-cadre{position:relative;width:100%;aspect-ratio:589/1117;border-radius:38px;overflow:hidden;background:var(--papier)}
.tel-ecran{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top center;opacity:0;transition:opacity .9s ease}
.tel-ecran.visible{opacity:1}
.scene-note{font-size:.76rem;color:var(--encre-clair);text-align:center;margin-top:1.1rem}

/* trois projets en preuve */
.trois-projets{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,3.6vw,56px)}
.trois-projets .carte h3{font-size:1.2rem;margin:1rem 0 .35rem;max-width:20ch}
.trois-projets .carte p{font-size:.9rem}
.encours{display:grid;grid-template-columns:minmax(0,.46fr) minmax(0,1fr);gap:clamp(22px,3.2vw,48px);align-items:center;
  border-top:1px solid var(--ligne);padding-top:clamp(28px,3.6vw,46px);margin-top:clamp(38px,5vw,70px)}
.encours img{width:100%;height:auto;display:block}

/* le fondateur */
.fondateur{display:grid;grid-template-columns:minmax(0,.4fr) minmax(0,1fr);gap:clamp(28px,4.2vw,70px);align-items:center}
.fondateur .signature{font-family:var(--serif);font-size:1.06rem;color:var(--noir);margin-top:1.2rem}

@media (max-width:860px){
  .temps,.trois-projets{grid-template-columns:1fr}
  /* en colonne unique, le bloc redevient un simple flux : le téléphone,
     premier dans le code, reste fixe pendant que les étapes défilent dessous */
  .scene-grille{display:block}
  .scene-tel,.scene-etapes{grid-column:auto;grid-row:auto}
  .tel-sticky{top:76px;padding-top:14px;padding-bottom:10px;background:var(--blanc)}
  .tel-appareil{max-width:178px;padding:7px;border-radius:32px}
  .tel-appareil::after{top:13px;width:52px;height:13px}
  .tel-cadre{border-radius:26px}
  .scene-note{display:none}
  .scene-etapes{display:grid;gap:58vh;padding:6vh 0 10vh}
  .etape-jr{opacity:1}
  .encours,.fondateur{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  .etape-jr{opacity:1}
  .tel-ecran{transition:none}
}

/* captures réelles du Journal, sur téléphone */
.telephones{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,3.2vw,52px);align-items:start}
.tel{margin:0}
.tel img{width:100%;height:auto;display:block;border-radius:16px;border:1px solid rgba(255,255,255,.14)}
.tel figcaption{font-size:.8rem;color:#B5B0A6;margin-top:.85rem}
.tel:nth-child(2){margin-top:clamp(18px,3.6vw,54px)}
.tel:nth-child(3){margin-top:clamp(6px,1.4vw,20px)}
@media (max-width:860px){
  .telephones{grid-template-columns:1fr;max-width:330px;margin:0 auto;gap:34px}
  .tel:nth-child(2),.tel:nth-child(3){margin-top:0}
}
/* ---------- Invitation vers la démonstration publique ---------- */
.invitation{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:clamp(34px,5vw,80px);align-items:start;background:var(--blanc);border:1px solid var(--ligne);padding:clamp(28px,4.2vw,58px)}
.invitation h2{font-family:var(--serif);font-weight:400;font-size:clamp(1.5rem,2.8vw,2.1rem);line-height:1.2;color:var(--noir);margin:.9rem 0 1.2rem;max-width:24ch}
.invitation p{font-size:.96rem;line-height:1.75;color:var(--encre);margin-bottom:clamp(24px,3vw,36px)}
.invitation-chiffres{list-style:none;margin:0;padding:0;border-top:1px solid var(--ligne)}
.invitation-chiffres li{display:flex;align-items:baseline;gap:16px;padding:.95rem 0;border-bottom:1px solid var(--ligne)}
.invitation-chiffres strong{font-family:var(--serif);font-weight:400;font-size:1.85rem;line-height:1;color:var(--or);flex:0 0 2ch;text-align:right;font-variant-numeric:tabular-nums}
.invitation-chiffres span{font-size:.85rem;line-height:1.5;color:var(--encre-clair)}
@media (max-width:860px){
  .invitation{grid-template-columns:1fr;gap:clamp(30px,5vw,44px)}
  .invitation-chiffres strong{font-size:1.6rem}
}

/* ---------- JOURNAL DE PROJET — espace privé client (v3, calme) ---------- */
:root{
  --alerte:#B5533C; --alerte-bg:#FBEEEA; --valid-bg:#FFF3E0;
}

/* en-tête et pied allégés, propres au Journal */
.jr-entete{padding:22px 0;border-bottom:1px solid var(--ligne)}
.jr-entete .wrap{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
.jr-entete-id{text-align:right}
.jr-entete-id .label-prive{font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:var(--or);display:block;margin-bottom:.2rem}
.jr-entete-id .noms{font-family:var(--serif);font-size:1.05rem;color:var(--noir)}
.jr-contact-lien{font-size:.78rem;color:var(--encre-clair);text-decoration:none;border-bottom:1px solid var(--ligne);padding-bottom:1px}
.jr-contact-lien:hover{border-color:var(--or);color:var(--noir)}
.jr-pied{background:var(--papier);border-top:1px solid var(--ligne);padding:34px 0;color:var(--encre-clair);font-size:.82rem;text-align:center}
.jr-pied .foot-logo{font-family:var(--serif);font-size:1.15rem;color:var(--noir);margin-bottom:.5rem}
.jr-pied .foot-logo span{color:var(--or)}
.jr-pied a{color:var(--encre-clair);text-decoration:none;border-bottom:1px solid var(--ligne)}

/* Marqueurs de grande section — numéro doré, titre sombre, sous-titre gris, filet discret */
.jr-section-marqueur{margin-bottom:1.7rem}
.jr-section-marqueur.jr-section-filet{padding-top:2.5rem;border-top:1px solid var(--ligne)}
.jr-section-num{display:block;font-family:var(--sans);font-size:.76rem;font-weight:600;letter-spacing:.1em;color:var(--or);margin-bottom:.55rem}
.jr-section-titre{font-family:var(--serif);font-size:1.65rem;font-weight:400;color:var(--noir);margin:0 0 .35rem}
.jr-section-soustitre{font-family:var(--sans);font-size:.85rem;color:var(--encre-clair);margin:0}

/* Votre chantier aujourd'hui — un seul ensemble, presque sans bordures */
.jr-aujourdhui{margin-bottom:3rem}
.jr-phase-actuelle{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--encre-clair);margin-bottom:.35rem}
.jr-phase-actuelle strong{display:block;font-family:var(--serif);font-size:1.7rem;color:var(--noir);text-transform:none;letter-spacing:0;margin-top:.3rem}

.jr-frise{display:flex;flex-wrap:wrap;gap:0;margin:1.6rem 0 1.4rem;padding-top:1.2rem;border-top:1px solid var(--ligne)}
.jr-frise .e{flex:1;min-width:90px;text-align:center;font-size:.68rem;letter-spacing:.05em;color:#BEB9AD;padding:0 4px;position:relative}
.jr-frise .e .pt{display:flex;align-items:center;justify-content:center;width:15px;height:15px;border-radius:50%;margin:0 auto 8px;font-size:.62rem;line-height:1;background:#E7E2D6;color:transparent;transition:.2s}
.jr-frise .e.fait{color:var(--encre-clair)}
.jr-frise .e.fait .pt{background:var(--papier);border:1.5px solid var(--or);color:var(--or)}
.jr-frise .e.actuel{color:var(--noir);font-weight:600}
.jr-frise .e.actuel .pt{background:var(--or);width:19px;height:19px;box-shadow:0 0 0 3px rgba(184,134,11,.14)}

.jr-avancement{display:flex;align-items:center;gap:16px;margin-bottom:1.4rem}
.jr-avancement .barre{flex:1;height:2px}
.jr-avancement .txt{font-size:.8rem;color:var(--encre-clair);white-space:nowrap}
.jr-avancement .txt strong{color:var(--noir);font-variant-numeric:tabular-nums}

.jr-resume{font-size:1.05rem;color:var(--encre);max-width:62ch}
.jr-maj{font-size:.78rem;color:var(--encre-clair);margin-top:.9rem}

.jr-validation,.jr-vigilance,.jr-bonne{padding:.9rem 1.1rem;margin-top:1.3rem;font-size:.9rem;border-radius:2px}
/* bonne nouvelle : ce que le client doit retenir même en lisant vite */
.jr-bonne{background:#F5EBD6;color:var(--encre);border-left:3px solid var(--or)}
.jr-bonne strong:first-child{display:block;font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;margin-bottom:.3rem;color:#8A6200}
.jr-bonne strong{font-weight:600;color:var(--noir)}
.jr-validation{background:var(--valid-bg);color:var(--encre)}
.jr-vigilance{background:var(--alerte-bg);color:var(--encre)}
.jr-validation strong,.jr-vigilance strong{display:block;font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;margin-bottom:.3rem}
.jr-validation strong{color:#96650A}
.jr-vigilance strong{color:var(--alerte)}

/* Votre point hebdomadaire — bilan (fait) puis suite (prévu), lecture verticale */
.jr-bilan{margin-bottom:2.4rem}
.jr-suite{margin-bottom:2.4rem;padding:1.5rem 1.6rem;background:var(--blanc);border-left:2px solid var(--or)}
.jr-bloc-titre{font-family:var(--serif);font-size:1.15rem;color:var(--noir);font-weight:400;margin-bottom:.3rem}
.jr-bloc-dates{font-size:.85rem;color:var(--encre-clair);margin-bottom:1.2rem}
.jr-bloc-souslabel{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--or);font-family:var(--sans);font-weight:500;margin-bottom:.7rem}
.jr-bilan ul,.jr-suite ul{list-style:none}
.jr-bilan li,.jr-suite li{padding:.6rem 0;border-top:1px solid var(--ligne);font-size:.93rem;padding-left:1.1rem;position:relative}
.jr-bilan li::before,.jr-suite li::before{content:'—';position:absolute;left:0;color:#C9C4B8}
.jr-bilan .vide,.jr-suite .vide{font-size:.88rem;color:var(--encre-clair);padding:.6rem 0;border-top:1px solid var(--ligne)}

/* Votre chantier en images — mise en page adaptative selon le nombre de photos */
.jr-photo-vignette{display:block;width:100%;text-align:left;background:none;border:0;padding:0;cursor:pointer;font-family:var(--sans);color:inherit}
.jr-photo-vignette .ph{position:relative;overflow:hidden}
.jr-photo-vignette .ph img{width:100%;height:100%;object-fit:cover;display:block}
.jr-photo-loupe{position:absolute;right:10px;bottom:10px;background:rgba(13,13,13,.55);color:#fff;font-size:.66rem;letter-spacing:.05em;padding:5px 10px;display:flex;align-items:center;gap:5px;opacity:.85;transition:opacity .2s,background .2s;pointer-events:none}
.jr-photo-vignette:hover .jr-photo-loupe{opacity:1;background:rgba(13,13,13,.78)}
.jr-photo-vignette .titre{font-family:var(--serif);font-size:.98rem;color:var(--noir);margin-top:.55rem;display:block}
.jr-photo-vignette .date{font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--encre-clair);display:block;margin-top:.15rem}

/* une seule photo de la semaine — pleine largeur, dominante */
.jr-photos-une .ph{aspect-ratio:16/10;border:0}

/* deux photos — même taille, côte à côte sur ordinateur, empilées sur téléphone */
.jr-photos-duo{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.jr-photos-duo .ph{aspect-ratio:4/3;border:0}

/* trois photos ou plus — une dominante puis une grille régulière */
.jr-photos-principale-wrap{margin-bottom:1.4rem}
.jr-photos-principale-wrap .ph{aspect-ratio:16/10;border:0}
.jr-photos-grille{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.jr-photos-grille .ph{aspect-ratio:1/1;border:0}
.jr-photos-grille .titre{font-size:.86rem}

@media (max-width:640px){
  .jr-photos-duo{grid-template-columns:1fr}
  .jr-photos-grille{grid-template-columns:1fr 1fr}
}

/* visionneuse plein écran, ouverte au clic sur une photo */
.jr-lightbox{position:fixed;inset:0;background:rgba(13,13,13,.94);z-index:200;display:flex;align-items:center;justify-content:center;padding:26px}
.jr-lightbox-contenu{max-width:1100px;width:100%;max-height:90vh;display:flex;flex-direction:column;align-items:center}
.jr-lightbox-contenu img{max-width:100%;max-height:68vh;object-fit:contain;display:block}
.jr-lightbox-infos{color:#EDE9E1;text-align:center;margin-top:1.2rem;max-width:64ch}
.jr-lightbox-titre{font-family:var(--serif);font-size:1.25rem;color:#fff}
.jr-lightbox-date{font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:#B5B0A6;margin:.35rem 0 .7rem}
.jr-lightbox-desc{font-size:.92rem;color:#CFCAC1}
.jr-lightbox-fermer,.jr-lightbox-precedent,.jr-lightbox-suivant{position:absolute;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.25);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s;font-family:var(--sans)}
.jr-lightbox-fermer:hover,.jr-lightbox-precedent:hover,.jr-lightbox-suivant:hover{background:rgba(255,255,255,.18)}
.jr-lightbox-fermer{top:20px;right:20px;width:42px;height:42px;font-size:1.1rem;border-radius:50%}
.jr-lightbox-precedent,.jr-lightbox-suivant{top:50%;transform:translateY(-50%);width:48px;height:48px;border-radius:50%;font-size:1.4rem}
.jr-lightbox-precedent{left:16px}
.jr-lightbox-suivant{right:16px}
@media (max-width:640px){
  .jr-lightbox-precedent{left:6px;width:40px;height:40px}
  .jr-lightbox-suivant{right:6px;width:40px;height:40px}
  .jr-lightbox-fermer{top:10px;right:10px;width:38px;height:38px}
}

/* mention brève d'une décision dans la semaine */
.jr-decision-brief{display:flex;align-items:center;gap:10px;padding:.6rem 0;border-top:1px solid var(--ligne);font-size:.9rem;flex-wrap:wrap}
.jr-decisions-brief-titre{font-size:.72rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--or);margin:1.8rem 0 .3rem;display:block}

/* bannière de consultation d'archive */
.jr-archive-banniere{background:#F5F2EA;padding:1rem 1.2rem;margin-bottom:1.6rem}
.jr-archive-banniere strong{display:block;font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--or);margin-bottom:.4rem}
.jr-archive-banniere .semaine-txt{font-family:var(--serif);font-size:1.08rem;color:var(--noir);margin-bottom:.9rem}
.jr-archive-banniere button{background:none;border:1px solid var(--noir);padding:.55rem 1.1rem;font-size:.74rem;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;color:var(--noir);font-family:var(--sans)}
.jr-archive-banniere button:hover{background:var(--noir);color:var(--papier)}

/* badges */
.jr-badge{display:inline-block;font-size:.6rem;letter-spacing:.09em;text-transform:uppercase;padding:2px 9px;color:var(--encre-clair);background:var(--papier)}
.jr-badge.validee{color:#8A6200;background:#F5EBD6}
.jr-badge.attente{color:#96650A;background:var(--valid-bg)}
.jr-badge.modifiee,.jr-badge.annulee{color:#8A857C;background:#EFECE6}

/* décision complète (journal des décisions déployé) */
.jr-decision{padding:1.1rem 0;border-top:1px solid var(--ligne)}
.jr-decision .d{font-size:.72rem;color:var(--encre-clair);letter-spacing:.04em}
.jr-decision .q{font-family:var(--serif);font-size:1.06rem;color:var(--noir);margin:.2rem 0 .4rem}
.jr-decision p{font-size:.89rem;color:var(--encre-clair);margin-bottom:.5rem}

/* sections secondaires repliées par défaut */
.jr-details{border-top:1px solid var(--ligne);padding:1.1rem 0}
.jr-details summary{cursor:pointer;font-size:.72rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--encre);list-style:none;display:flex;justify-content:space-between;align-items:center}
.jr-details summary::-webkit-details-marker{display:none}
.jr-details summary::after{content:'+';font-family:var(--serif);font-size:1.3rem;color:var(--or);line-height:1}
.jr-details[open] summary::after{content:'–'}
.jr-details .contenu{margin-top:1.4rem}

.jr-nav-semaines-liste{list-style:none}
.jr-nav-semaines-liste li{border-top:1px solid var(--ligne)}
.jr-nav-semaines-liste button{width:100%;text-align:left;background:none;border:0;padding:.85rem 0;font-size:.9rem;color:var(--encre);cursor:pointer;font-family:var(--sans)}
.jr-nav-semaines-liste button:hover{color:var(--or)}

.jr-doc-groupe{margin-bottom:1.4rem}
.jr-doc-groupe:last-child{margin-bottom:0}
.jr-doc-groupe h4{font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--or);font-family:var(--sans);font-weight:500;margin-bottom:.5rem}
.jr-doc-groupe .ligne{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:.5rem 0;border-top:1px solid var(--ligne);font-size:.87rem;color:var(--encre-clair)}
.jr-doc-lien{font-family:var(--sans);font-size:.78rem;letter-spacing:.05em;text-decoration:none;border:0;border-bottom:1px solid var(--or);background:none;color:var(--noir);white-space:nowrap;padding:0 0 1px;flex-shrink:0;cursor:pointer}
.jr-doc-lien:hover{opacity:.7}
.jr-doc-absent{font-size:.76rem;color:var(--encre-clair);white-space:nowrap;flex-shrink:0;font-style:italic}

@media (max-width:860px){
  .jr-frise .e{min-width:30%}
  .jr-entete .wrap{flex-direction:column;align-items:flex-start}
  .jr-entete-id{text-align:left}
}
@media (max-width:480px){
  .jr-avancement{flex-direction:column;align-items:flex-start;gap:8px}
  .jr-avancement .barre{width:100%}
  .jr-avancement .txt{white-space:normal}
}

/* ===== Démonstration publique du Journal ===== */
.demo-bandeau{border:1px solid var(--ligne);border-left:3px solid var(--or);background:var(--blanc);padding:clamp(20px,3vw,32px) clamp(20px,3vw,34px);margin-bottom:clamp(44px,6vw,72px)}
.demo-bandeau strong{display:block;font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:var(--or);margin-bottom:.8rem}
.demo-bandeau p{font-size:.95rem;line-height:1.72;color:var(--encre);margin:0}
.demo-bandeau p + p{margin-top:.9rem;font-size:.88rem;color:var(--encre-clair)}
.jr-doc-mention{margin-top:1.6rem;padding-top:1.2rem;border-top:1px solid var(--ligne);font-size:.84rem;line-height:1.68;color:var(--encre-clair)}
.demo-cloture{margin-top:clamp(70px,9vw,124px);padding-top:clamp(40px,5vw,64px);border-top:1px solid var(--ligne)}
.demo-cloture h2{font-family:var(--serif);font-weight:400;font-size:clamp(1.55rem,3vw,2.15rem);line-height:1.2;color:var(--noir);margin:0 0 1.1rem;max-width:22ch}
.demo-cloture p{font-size:.96rem;line-height:1.75;color:var(--encre);max-width:54ch;margin:0}
.demo-cloture-liens{display:flex;align-items:center;gap:clamp(20px,3vw,38px);flex-wrap:wrap;margin-top:clamp(26px,3.4vw,42px)}

/* ---------- Rappel « avant » sous la photo d'un projet ---------- */
.rappel-avant{display:grid;grid-template-columns:130px minmax(0,1fr);gap:clamp(14px,1.6vw,22px);align-items:center;margin-top:clamp(14px,1.6vw,20px)}
.rappel-avant img{width:100%;height:auto;display:block;border:1px solid var(--ligne);cursor:zoom-in;filter:saturate(.9)}
.rappel-avant p{font-size:.8rem;line-height:1.6;color:var(--encre-clair);margin:0}
.rappel-avant strong{display:block;font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--or);margin-bottom:.3rem}
@media (max-width:520px){ .rappel-avant{grid-template-columns:100px minmax(0,1fr)} }

/* ---------- Grille de paires avant / après (images d'archives) ---------- */
.note-archive{font-size:.76rem;color:var(--encre-clair);font-style:italic;margin-top:.9rem}

.grille-paires{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(26px,3.4vw,46px);margin-top:clamp(30px,4vw,54px)}
.paire-titre{display:block;font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--encre-clair);margin-bottom:.7rem}
.paire-images{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.paire-images span{display:block}
.paire-images img{width:100%;height:auto;display:block;border:1px solid var(--ligne);cursor:zoom-in}
.paire-images em{display:block;font-style:normal;font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:var(--or);margin-top:.4rem}
.chantier-vivant{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,2.4vw,34px);align-items:start}
.chantier-vivant figure{margin:0}
.chantier-vivant img{width:100%;height:auto;display:block;cursor:zoom-in}
.chantier-vivant figcaption{font-size:.72rem;letter-spacing:.04em;color:var(--encre-clair);margin-top:.7rem}
.chantier-texte{margin-top:clamp(26px,3.4vw,44px);max-width:62ch}
.chantier-texte p{font-size:.96rem;color:var(--encre-clair);margin-top:.9rem}
@media (max-width:860px){
  .grille-paires{grid-template-columns:1fr;gap:clamp(24px,4vw,34px)}
  .chantier-vivant{grid-template-columns:1fr}
}

/* ---------- Principe affiché au fil d'un projet ---------- */
.principe{border-left:1px solid var(--or);background:var(--blanc);padding:clamp(18px,2.4vw,28px) clamp(20px,2.6vw,32px);margin:clamp(26px,3.4vw,42px) 0}
.principe p{font-size:.94rem;line-height:1.72;color:var(--encre);margin:0}
.principe strong{color:var(--noir)}

/* ---------- Section Rénovations ---------- */
.renovation{border-top:1px solid var(--ligne);padding-top:clamp(26px,3.4vw,42px)}
.renovation + .renovation{margin-top:clamp(50px,6vw,86px)}
.reno-suite{border-top:1px solid var(--ligne);margin-top:clamp(44px,5.5vw,74px);padding-top:clamp(26px,3.4vw,40px);max-width:62ch}
.reno-suite p{font-size:.96rem;line-height:1.75;color:var(--encre);margin:0 0 1.1rem}
.reno-suite strong{color:var(--noir)}

/* ---------- Deux photos de même taille en tête d'un projet ---------- */
.photos-duo{display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,1.6vw,20px)}
.photos-duo figure{margin:0}
.photos-duo img{width:100%;height:auto;display:block;cursor:zoom-in}
.photos-duo figcaption{font-size:.74rem;color:var(--encre-clair);margin-top:.55rem}
@media (max-width:620px){ .photos-duo{grid-template-columns:1fr} }