/* LOGE&NERJ — feuille de style
   Charte tirée du logo officiel (assets/brand/logo-officiel.webp). Détail dans docs/charte-graphique.md.
   Verts des champs et des sapins, bleus des panneaux, jaune du soleil, fond blanc.
   Motif : bandes arrondies séparées par un blanc franc, comme les champs et les panneaux du logo. */
:root{
  /* couleurs du logo */
  --forest:#425A1B;      /* sapins, logotype */
  --forest-dark:#2F4113; /* fonds sombres */
  --field:#597424;       /* champ foncé */
  --leaf:#749A30;        /* champ clair, feuilles, accroche */
  --sky:#01CCFF;         /* panneau clair */
  --azure:#01B0EB;       /* panneau moyen */
  --blue:#006CC0;        /* panneau foncé */
  --sun:#FFCD01;         /* soleil */
  /* neutres dérivés */
  --paper:#FBFBF6;
  --paper-2:#F1F4E8;
  --paper-3:#DCE4CB;
  --ink:#1F2C0E;
  --ink-2:#3B4A28;
  --mute:#67715A;
  --white:#FFFFFF;
  /* typographies */
  --display:'Oswald', 'Arial Narrow', sans-serif;
  --body:'Nunito Sans', 'Segoe UI', sans-serif;
  --hand:'Amatic SC', 'Comic Sans MS', cursive;
  --gutter:clamp(16px, 4vw, 48px);
  --max:1280px;
  --r:18px;
  --tape-h:12px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;overflow-x:clip;}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);font-size:18px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:clip;}
img{max-width:100%;display:block;}
a{color:inherit;}
p a, li a, .lnk{color:var(--forest);font-weight:700;text-decoration:underline;text-decoration-color:var(--leaf);text-decoration-thickness:3px;text-underline-offset:4px;transition:background .2s, text-decoration-color .2s;}
p a:hover, li a:hover, .lnk:hover{background:linear-gradient(transparent 55%, rgba(255,205,1,.55) 55%);text-decoration-color:var(--sun);}
h1,h2,h3,h4{font-family:var(--display);font-weight:600;text-transform:uppercase;color:var(--forest);}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gutter);}
.mono{font-family:var(--display);font-size:.8rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;}
.hand{font-family:var(--hand);font-weight:700;font-size:1.5rem;line-height:1.1;letter-spacing:.02em;}
::selection{background:var(--sun);color:var(--ink);}

/* ---------- Mètre (progression de lecture) ---------- */
.tape{position:fixed;top:0;left:0;right:0;height:var(--tape-h);z-index:60;background:var(--paper-2);}
.tape-fill{position:absolute;inset:0 auto 0 0;width:0;background:var(--sun);
  background-image:repeating-linear-gradient(90deg, var(--forest) 0 1px, transparent 1px 10px),
                   repeating-linear-gradient(90deg, var(--forest) 0 2px, transparent 2px 50px);
  background-size:auto 4px, auto 8px;background-repeat:repeat-x;}
.tape-count{position:absolute;right:8px;top:0;height:100%;display:flex;align-items:center;font-family:var(--display);font-size:9px;letter-spacing:.08em;background:var(--forest);color:var(--sun);padding:0 6px;}

/* ---------- En-tête ---------- */
.hdr{position:sticky;top:var(--tape-h);z-index:50;background:rgba(251,251,246,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--paper-3);}
.hdr-in{display:flex;align-items:center;gap:24px;height:80px;}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;}
.brand img{height:50px;width:auto;flex:none;}
.brand-name{display:block;font-family:var(--display);font-weight:600;font-size:1.65rem;letter-spacing:.01em;line-height:1;color:var(--forest);}
.brand-sub{display:block;font-family:var(--hand);font-weight:700;font-size:1.15rem;letter-spacing:.04em;text-transform:uppercase;color:var(--leaf);line-height:1;margin-top:3px;}
.nav{display:flex;gap:4px;margin-left:auto;}
.nav a{font-family:var(--display);font-size:.95rem;font-weight:500;text-transform:uppercase;letter-spacing:.06em;text-decoration:none;padding:8px 14px;border-radius:999px;color:var(--forest);transition:background .2s;}
.nav a:hover{background:var(--paper-2);}
.nav a[aria-current="page"]{background:var(--forest);color:var(--white);}
.btn{display:inline-flex;align-items:center;gap:10px;font-family:var(--display);font-weight:500;font-size:1.05rem;letter-spacing:.05em;text-transform:uppercase;text-decoration:none;border:2px solid var(--forest);background:var(--forest);color:var(--white);padding:12px 24px;border-radius:999px;cursor:pointer;transition:transform .2s, background .2s, border-color .2s;}
.btn:hover{transform:translateY(-2px);background:var(--field);border-color:var(--field);}
.btn.sun{background:var(--sun);border-color:var(--sun);color:var(--forest-dark);}
.btn.sun:hover{background:#FFD93D;border-color:#FFD93D;}
.btn.ghost{background:transparent;color:var(--forest);}
.btn.ghost:hover{background:var(--paper-2);}
.btn .arr{transition:transform .2s;}
.btn:hover .arr{transform:translateX(4px);}
.hdr .btn{padding:10px 18px;font-size:.95rem;}
.burger{display:none;margin-left:auto;background:none;border:2px solid var(--forest);border-radius:12px;width:46px;height:46px;cursor:pointer;position:relative;}
.burger span,.burger span::before,.burger span::after{position:absolute;left:11px;right:11px;height:2px;background:var(--forest);content:"";border-radius:2px;}
.burger span{top:50%;}
.burger span::before{top:-7px;left:0;right:0;}
.burger span::after{top:7px;left:0;right:0;}
@media (max-width:980px){
  .nav,.hdr .btn{display:none;}
  .burger{display:block;}
  .nav.open{display:flex;flex-direction:column;position:absolute;top:80px;left:0;right:0;background:var(--paper);border-bottom:3px solid var(--leaf);padding:12px var(--gutter) 20px;}
  .nav.open a{font-size:1.15rem;padding:14px 12px;}
}
@media (max-width:420px){.brand img{height:42px;}.brand-name{font-size:1.4rem;}.brand-sub{font-size:1rem;}}

/* ---------- Bandeau maquette ---------- */
.mock-flag{background:var(--forest-dark);color:var(--sun);font-family:var(--display);font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;text-align:center;padding:5px 12px;}

/* ---------- Champs (motif du logo) ---------- */
.champs{height:clamp(60px,9vw,120px);background:url("../assets/brand/champs.svg") center bottom/100% 100% no-repeat;}
.champs.flip{transform:scaleY(-1);}

/* ---------- Hero ---------- */
.hero{padding:clamp(10px,2vw,22px) 0 40px;position:relative;}
/* Les 3 mots et le logo animé ont la même hauteur : 3 lignes × 0,9 = 2,7 × la taille du titre.
   Le logo occupe environ 79 % de la hauteur de la vidéo (fond blanc autour), d'où une vidéo 1,27 × plus haute, recentrée par des marges négatives. */
.hero-top{--fs:clamp(2.3rem, 8vw, 8rem);padding-top:calc(var(--fs) * 0.14);display:flex;align-items:center;justify-content:space-between;gap:clamp(8px,3vw,48px);}

.hero-title{flex:none;margin:0;font-family:var(--display);font-weight:700;font-size:var(--fs);line-height:.9;letter-spacing:-.005em;text-transform:uppercase;color:var(--forest);}
.hero-title span{display:block;white-space:nowrap;}
/* « isoler » prend le dégradé bleu des panneaux du logo */
.hero-title .w-isoler{background:linear-gradient(100deg,var(--sky) 0%,var(--azure) 40%,var(--blue) 100%);-webkit-background-clip:text;background-clip:text;color:transparent;}
.hero-title .w-eco{color:var(--leaf);}
.hero-title .sun-dot{display:inline-block;width:.2em;height:.2em;border-radius:50%;background:var(--sun);margin-left:.04em;vertical-align:baseline;animation:lever 1.4s .3s cubic-bezier(.2,.8,.2,1) both;}
@keyframes lever{from{transform:translateY(.4em);opacity:0}to{transform:none;opacity:1}}
.hero-bottom{display:grid;grid-template-columns:1.1fr 1fr;gap:12px clamp(24px,4vw,56px);align-items:start;margin-top:clamp(14px,2.5vw,28px);}
.hero-bottom .hero-actions{margin-top:6px;}
@media (max-width:900px){.hero-bottom{grid-template-columns:1fr;}}
.hero-kicker{color:var(--leaf);margin:0 0 6px;}
/* logo animé (assets/brand/logo-animation-720.mp4), même principe que sur le site Apexus */
.hero-logo{flex:none;display:block;height:calc(var(--fs) * 3.43);width:auto;aspect-ratio:1;margin:calc(var(--fs) * -0.365) 0;mix-blend-mode:multiply;cursor:pointer;}

.hero-lede{font-size:1.2rem;line-height:1.5;margin:0 0 22px;}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;}
.specs{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px;}
.specs span{font-family:var(--display);font-size:.85rem;font-weight:500;text-transform:uppercase;letter-spacing:.08em;padding:5px 12px;border-radius:999px;background:var(--paper-2);color:var(--forest);}

@media (prefers-reduced-motion:reduce){.hero-title .sun-dot{animation:none;}}

/* ---------- Avant / après au niveau à bulle ---------- */
.ba{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--forest-dark);margin-top:36px;user-select:none;touch-action:pan-y;border-radius:var(--r);}
.ba img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;}
.ba .ba-after{clip-path:inset(0 0 0 var(--pos,50%));}
.ba .ba-after img{object-position:50% 28%;}
.ba-tag{position:absolute;top:16px;font-family:var(--display);font-size:.85rem;letter-spacing:.1em;text-transform:uppercase;padding:5px 14px;border-radius:999px;background:var(--forest);color:var(--white);z-index:3;}
.ba-tag.l{left:16px;}
.ba-tag.r{right:16px;background:var(--sun);color:var(--forest-dark);}
.ba-handle{position:absolute;top:0;bottom:0;left:var(--pos,50%);width:0;z-index:4;pointer-events:none;}
.ba-handle::before{content:"";position:absolute;top:0;bottom:0;left:-3px;width:6px;background:var(--white);}
.level{position:absolute;top:50%;left:50%;width:124px;height:36px;transform:translate(-50%,-50%);background:var(--sun);border-radius:10px;border:3px solid var(--white);display:flex;align-items:center;justify-content:center;box-shadow:0 6px 18px rgba(31,44,14,.3);}
.level i{display:block;width:58px;height:16px;border-radius:10px;background:#DFF0B8;border:2px solid var(--forest);position:relative;overflow:hidden;}
.level i::before,.level i::after{content:"";position:absolute;top:-2px;bottom:-2px;width:2px;background:var(--forest);}
.level i::before{left:18px;}.level i::after{right:18px;}
.level b{position:absolute;top:2px;left:50%;width:14px;height:8px;margin-left:-7px;border-radius:50%;background:rgba(255,255,255,.95);transition:transform .25s;}
.ba input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;z-index:5;margin:0;}
.ba-cap{display:flex;justify-content:space-between;gap:16px;margin-top:10px;color:var(--leaf);}

/* ---------- Ruban défilant ---------- */
.ribbon{background:var(--forest);color:var(--white);overflow:hidden;margin:32px 0;}
.ribbon-track{display:flex;width:max-content;animation:defile 30s linear infinite;}
.ribbon span{font-family:var(--display);font-weight:500;font-size:clamp(1.6rem,3.6vw,2.6rem);letter-spacing:.04em;text-transform:uppercase;padding:12px 0;white-space:nowrap;display:flex;align-items:center;}
.ribbon span::after{content:"";width:.55em;height:.55em;background:var(--leaf);margin:0 .8em;border-radius:0 80% 0 80%;}
.ribbon span:nth-child(3n)::after{background:var(--sun);border-radius:50%;}
.ribbon span:nth-child(3n+1)::after{background:var(--sky);border-radius:3px;transform:skewX(-12deg);}
@keyframes defile{to{transform:translateX(-50%);}}
@media (prefers-reduced-motion:reduce){.ribbon-track{animation:none;}}

/* ---------- Titres de section ---------- */
.sec{padding:clamp(56px,9vw,112px) 0;}
.sec-head{display:grid;grid-template-columns:auto 1fr;gap:10px 24px;align-items:baseline;margin-bottom:40px;}
.sec-num{justify-self:start;font-family:var(--display);font-weight:600;font-size:.9rem;color:var(--white);background:var(--leaf);padding:4px 12px;border-radius:999px;letter-spacing:.06em;}
.sec-title{margin:0;font-weight:700;font-size:clamp(2.2rem,5.4vw,4.2rem);line-height:1;max-width:18ch;}
.sec-intro{grid-column:2;margin:6px 0 0;max-width:58ch;color:var(--ink-2);font-size:1.1rem;}
@media (max-width:600px){.sec-head{grid-template-columns:1fr;}.sec-intro{grid-column:1;}}

/* ---------- Échantillons métiers ---------- */
.samples{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.sample{background:var(--white);border:2px solid var(--paper-3);border-radius:var(--r);overflow:hidden;text-decoration:none;display:flex;flex-direction:column;transition:transform .3s cubic-bezier(.2,.8,.2,1), border-color .3s;}
.sample:hover{transform:translateY(-6px);border-color:var(--leaf);}
.sample-tex{height:210px;position:relative;border-bottom:6px solid var(--white);}
.sample-tex .mono{position:absolute;left:14px;top:14px;background:var(--white);color:var(--forest);padding:3px 10px;border-radius:999px;font-size:.72rem;}
.sample-body{padding:20px 22px 24px;display:flex;flex-direction:column;gap:10px;flex:1;}
.sample h3{margin:0;font-size:2rem;font-weight:600;line-height:1;}
.sample p{margin:0;color:var(--ink-2);}
.sample .status{display:inline-flex;align-self:flex-start;font-family:var(--display);font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;padding:3px 10px;border-radius:999px;background:var(--paper-2);color:var(--forest);}
.sample .status.new{background:var(--sun);color:var(--forest-dark);}
.sample .status.minor{background:transparent;border:1.5px dashed var(--leaf);color:var(--mute);}
.sample .go{margin-top:auto;font-family:var(--display);font-weight:500;text-transform:uppercase;letter-spacing:.06em;color:var(--forest);display:flex;justify-content:space-between;align-items:center;padding-top:12px;border-top:1px solid var(--paper-3);}
.sample:hover .go span:last-child{color:var(--leaf);transform:translateX(4px);}
.sample .go span:last-child{transition:transform .2s;}
@media (max-width:900px){.samples{grid-template-columns:1fr;}.sample-tex{height:150px;}}

/* Textures de matériaux, dans les couleurs du logo */
.tex-tile{background:linear-gradient(135deg,var(--sky),var(--azure) 45%,var(--blue));position:relative;}
.tex-tile::before{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--white) 5px, transparent 5px),linear-gradient(90deg,var(--white) 5px, transparent 5px);background-size:52px 52px;background-position:-3px -3px;}
.tex-plaster{background-color:#F3F2EA;background-image:
  radial-gradient(ellipse 120px 26px at 20% 30%, rgba(255,255,255,.95), transparent 70%),
  radial-gradient(ellipse 160px 30px at 70% 55%, rgba(255,255,255,.9), transparent 70%),
  radial-gradient(ellipse 110px 22px at 35% 78%, rgba(255,255,255,.85), transparent 70%),
  radial-gradient(ellipse 140px 24px at 85% 18%, rgba(116,154,48,.16), transparent 70%),
  radial-gradient(ellipse 90px 18px at 55% 92%, rgba(116,154,48,.16), transparent 70%);}
.tex-roof{background-color:var(--forest-dark);background-image:
  radial-gradient(circle at 50% 100%, var(--field) 0 17px, var(--white) 18px 20px, transparent 21px),
  radial-gradient(circle at 50% 100%, var(--leaf) 0 17px, var(--white) 18px 20px, transparent 21px);
  background-size:40px 22px;background-position:0 0, 20px 11px;}
.tex-joinery{background:linear-gradient(160deg,#BFEFFF,var(--azure));position:relative;}
.tex-joinery::before{content:"";position:absolute;inset:18px 22%;border:10px solid var(--white);border-radius:6px;background:linear-gradient(var(--white),var(--white)) center/8px 100% no-repeat,linear-gradient(var(--white),var(--white)) center/100% 8px no-repeat;}
.tex-joinery::after{content:"";position:absolute;left:0;right:0;bottom:0;height:22%;background:repeating-linear-gradient(90deg,var(--forest) 0 6px,transparent 6px 26px),linear-gradient(transparent 30%,var(--forest) 30% 40%,transparent 40% 70%,var(--forest) 70% 80%,transparent 80%);}
.tex-roller{background:repeating-linear-gradient(105deg,var(--leaf) 0 70px,var(--white) 70px 78px,var(--sun) 78px 148px,var(--white) 148px 156px,var(--sky) 156px 226px,var(--white) 226px 234px);}
.tex-depannage{background:var(--forest-dark);position:relative;overflow:hidden;}
.tex-depannage::before{content:"";position:absolute;left:calc(50% - 90px);top:50%;width:70px;height:110px;transform:translateY(-50%);background:var(--sun);clip-path:polygon(60% 0,8% 58%,44% 58%,30% 100%,92% 40%,56% 40%,78% 0);}
.tex-depannage::after{content:"";position:absolute;left:calc(50% + 20px);top:50%;width:62px;height:62px;transform:translateY(-35%) rotate(45deg);background:var(--sky);border-radius:0 50% 50% 50%;}
.tex-heat{background:radial-gradient(circle at 30% 120%,var(--sun) 0 28%,transparent 29%),repeating-radial-gradient(circle at 30% 120%,transparent 0 34px,rgba(255,255,255,.55) 34px 40px),linear-gradient(135deg,#FFE27A,var(--leaf));}
.tex-brick{background-color:#A0583C;background-image:
  linear-gradient(#D9D3C4 3px, transparent 3px),
  linear-gradient(90deg,#D9D3C4 3px, transparent 3px),
  linear-gradient(90deg,#D9D3C4 3px, transparent 3px);
  background-size:100% 22px, 60px 44px, 60px 44px;background-position:0 0, 0 0, 30px 22px;}

/* ---------- Coupe de mur ---------- */
.coupe-sec{background:var(--forest-dark);color:var(--paper);}
.coupe-sec .sec-title{color:var(--white);}
.coupe-sec .sec-intro{color:#C9D3B6;}
.coupe-sec .sec-num{background:var(--sun);color:var(--forest-dark);}
.coupe{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;min-height:440px;}
.layer{position:relative;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;border-radius:14px;background:rgba(255,255,255,.06);}
.layer-tex{position:absolute;inset:0;transform:translateY(101%);transition:transform .9s cubic-bezier(.7,0,.2,1);}
.coupe.in .layer-tex{transform:none;}
.coupe.in .layer:nth-child(2) .layer-tex{transition-delay:.12s;}
.coupe.in .layer:nth-child(3) .layer-tex{transition-delay:.24s;}
.coupe.in .layer:nth-child(4) .layer-tex{transition-delay:.36s;}
.coupe.in .layer:nth-child(5) .layer-tex{transition-delay:.48s;}
.layer-lbl{position:relative;z-index:2;margin:10px;background:var(--white);color:var(--ink);padding:12px 14px;border-radius:12px;}
.layer-lbl .mono{color:var(--leaf);display:block;margin-bottom:2px;font-size:.72rem;}
.layer-lbl strong{display:block;font-family:var(--display);font-weight:600;text-transform:uppercase;color:var(--forest);font-size:1.2rem;line-height:1.1;}
.layer-lbl small{display:block;color:var(--ink-2);font-size:.88rem;margin-top:6px;line-height:1.35;}
.tex-stud{background:#9AA3A8 repeating-linear-gradient(90deg,#C4CACD 0 6px,#9AA3A8 6px 40px,#7D868B 40px 44px, #9AA3A8 44px 80px);}
.tex-wool{background-color:#F2C94C;background-image:radial-gradient(circle at 20% 30%, rgba(255,255,255,.5) 0 6px, transparent 7px),radial-gradient(circle at 70% 70%, rgba(160,110,20,.3) 0 8px, transparent 9px),radial-gradient(circle at 40% 80%, rgba(255,255,255,.45) 0 5px, transparent 6px);background-size:34px 30px, 42px 38px, 26px 24px;}
.tex-board{background:#DADDD6;}
.tex-paint{background:var(--white);}
.tex-paint::after{content:"";position:absolute;left:18%;right:18%;top:18%;height:10px;border-radius:10px;background:var(--leaf);}
@media (max-width:800px){
  .coupe{grid-template-columns:1fr;min-height:0;}
  .layer{min-height:120px;}
  .layer-tex{transform:translateX(-101%);}
}
@media (prefers-reduced-motion:reduce){.layer-tex{transform:none!important;transition:none!important;}}

/* ---------- Fiches chantier ---------- */
.fiches{display:grid;grid-template-columns:repeat(2,1fr);gap:28px;}
.fiche{background:var(--white);border:2px solid var(--paper-3);border-radius:var(--r);overflow:hidden;text-decoration:none;display:flex;flex-direction:column;transition:transform .3s, border-color .3s;}
.fiche:hover{transform:translateY(-6px);border-color:var(--leaf);}
.fiche-top{display:flex;justify-content:space-between;align-items:center;background:var(--forest);color:var(--white);padding:10px 18px;}
.fiche-top .mono{font-size:.75rem;}
.fiche-top .tag{background:var(--sun);color:var(--forest-dark);padding:2px 10px;border-radius:999px;}
.fiche-img{aspect-ratio:4/3;overflow:hidden;background:var(--paper-2);}
.fiche-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s;}
.fiche:hover .fiche-img img{transform:scale(1.04);}
.fiche-body{padding:20px 22px 24px;display:flex;flex-direction:column;gap:14px;flex:1;}
.fiche h3{margin:0;font-size:1.55rem;font-weight:600;line-height:1.1;}
.fields{display:grid;grid-template-columns:auto 1fr;gap:4px 16px;margin:0;font-size:.98rem;}
.fields dt{font-family:var(--display);font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;color:var(--leaf);padding-top:3px;}
.fields dd{margin:0;}
.chips{display:flex;flex-wrap:wrap;gap:6px;}
.chip{font-family:var(--display);font-size:.75rem;font-weight:500;text-transform:uppercase;letter-spacing:.08em;padding:4px 12px;border-radius:999px;background:var(--paper-2);color:var(--forest);}
.chip.carrelage{background:var(--azure);color:var(--white);}
.chip.platrerie{background:var(--leaf);color:var(--white);}
.chip.couverture{background:var(--forest);color:var(--white);}
.chip.menuiserie{background:var(--blue);color:var(--white);}
.chip.peinture{background:var(--sun);color:var(--forest-dark);}
.chip.depannage{background:var(--forest-dark);color:var(--sun);}
@media (max-width:800px){.fiches{grid-template-columns:1fr;}}

.filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px;}
.filters button{font-family:var(--display);font-size:.9rem;font-weight:500;text-transform:uppercase;letter-spacing:.06em;padding:9px 18px;border:2px solid var(--forest);border-radius:999px;background:transparent;color:var(--forest);cursor:pointer;}
.filters button[aria-pressed="true"]{background:var(--forest);color:var(--white);}

/* ---------- Méthode ---------- */
.method{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;}
.step{padding:26px 22px;background:var(--paper-2);}
.step:first-child{border-radius:var(--r) 0 0 var(--r);}
.step:last-child{border-radius:0 var(--r) var(--r) 0;background:var(--leaf);color:var(--white);}
.step:last-child h3,.step:last-child p{color:var(--white);}
.step:last-child .step-n{color:var(--sun);}
.step-n{font-family:var(--display);font-weight:700;font-size:3.6rem;line-height:1;color:var(--leaf);}
.step h3{margin:8px 0 6px;font-size:1.35rem;font-weight:600;}
.step p{margin:0;color:var(--ink-2);font-size:1rem;}
@media (max-width:900px){.method{grid-template-columns:1fr 1fr;}.step:first-child{border-radius:var(--r) 0 0 0;}.step:nth-child(2){border-radius:0 var(--r) 0 0;}.step:nth-child(3){border-radius:0 0 0 var(--r);}}
@media (max-width:520px){.method{grid-template-columns:1fr;}.step,.step:first-child,.step:nth-child(2),.step:nth-child(3),.step:last-child{border-radius:0;}.step:first-child{border-radius:var(--r) var(--r) 0 0;}.step:last-child{border-radius:0 0 var(--r) var(--r);}}

/* ---------- Appel ---------- */
.callband{background:var(--forest);color:var(--white);padding:clamp(48px,8vw,96px) 0;position:relative;overflow:hidden;}
.callband::after{content:"";position:absolute;right:-40px;bottom:-60px;width:360px;height:260px;background:url("../assets/brand/champs.svg") center/100% 100% no-repeat;opacity:.35;transform:rotate(-8deg);}
.callband h2{margin:0 0 18px;font-size:clamp(2rem,5vw,3.6rem);line-height:1.02;max-width:20ch;color:var(--white);position:relative;z-index:1;}
.callband .phone{display:inline-block;font-family:var(--display);font-weight:700;font-size:clamp(2.4rem,7vw,5.4rem);letter-spacing:.01em;text-decoration:none;line-height:1;color:var(--sun);position:relative;z-index:1;border-bottom:5px solid var(--leaf);}
.callband .phone:hover{border-color:var(--sun);}
.callband p{position:relative;z-index:1;margin:20px 0 0;max-width:52ch;color:#DDE5CC;}
.callband p a{color:var(--white);}

/* ---------- Pied de page ---------- */
.ftr{background:var(--paper-2);color:var(--ink-2);padding:12px 0 160px;font-size:.98rem;}
.ftr-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:32px;align-items:start;padding-top:36px;}
.ftr-logo{width:min(240px,70%);height:auto;margin-bottom:10px;}
.ftr h4{font-size:.9rem;letter-spacing:.12em;color:var(--leaf);margin:0 0 12px;font-weight:500;}
.ftr ul{list-style:none;margin:0;padding:0;display:grid;gap:6px;}
.ftr a{text-decoration:none;}
.ftr a:hover{color:var(--forest);text-decoration:underline;text-decoration-color:var(--leaf);text-decoration-thickness:2px;}
.ftr-legal{margin-top:36px;padding-top:18px;border-top:1px solid var(--paper-3);display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;font-family:var(--display);font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);}
@media (max-width:800px){.ftr-grid{grid-template-columns:1fr;}}
@media (min-width:981px){.ftr{padding-bottom:104px;}}

/* ---------- Barre mobile ---------- */
.mbar{display:none;}
@media (max-width:980px){
  .mbar{display:grid;grid-template-columns:1fr 1fr;gap:6px;position:fixed;left:0;right:0;bottom:0;z-index:55;padding:6px;background:var(--white);box-shadow:0 -4px 16px rgba(31,44,14,.12);}
  .mbar a{display:flex;align-items:center;justify-content:center;padding:13px 8px;white-space:nowrap;font-size:.98rem;border-radius:999px;font-family:var(--display);font-weight:500;text-transform:uppercase;letter-spacing:.06em;text-decoration:none;background:var(--forest);color:var(--white);}
  .mbar a + a{background:var(--sun);color:var(--forest-dark);}
}

/* ---------- Pages intérieures ---------- */
.page-hero{padding:clamp(40px,7vw,84px) 0 clamp(20px,3vw,32px);}
.page-hero .mono{color:var(--leaf);}
.page-hero h1{margin:10px 0 0;font-weight:700;font-size:clamp(3rem,8vw,6.4rem);line-height:.95;max-width:16ch;}
.page-hero p{margin:18px 0 0;max-width:60ch;font-size:1.15rem;color:var(--ink-2);}

/* Savoir-faire */
.metier{display:grid;grid-template-columns:5fr 7fr;gap:6px;margin:0 auto 6px;max-width:var(--max);padding:0 var(--gutter);}
.metier-tex{position:relative;min-height:380px;border-radius:var(--r);overflow:hidden;}
.metier-tex .big{z-index:2;position:absolute;left:20px;bottom:6px;font-family:var(--display);font-weight:700;font-size:clamp(5rem,12vw,10rem);line-height:.85;color:var(--white);text-shadow:0 2px 0 rgba(31,44,14,.15);}
.metier-body{padding:clamp(24px,4vw,52px);background:var(--paper-2);border-radius:var(--r);}
.metier-body h2{margin:4px 0 10px;font-size:clamp(2.4rem,4.8vw,3.8rem);font-weight:700;line-height:1;}
.metier-body .accroche{font-size:1.25rem;margin:0 0 10px;font-weight:700;color:var(--ink);}
.metier-body p{color:var(--ink-2);max-width:62ch;}
.metier-body .mono{color:var(--leaf);}
.presta{list-style:none;padding:0;margin:24px 0;display:grid;grid-template-columns:1fr 1fr;gap:0 24px;counter-reset:p;}
.presta li{counter-increment:p;padding:11px 0;border-top:1px solid var(--paper-3);display:flex;gap:12px;}
.presta li::before{content:counter(p, decimal-leading-zero);font-family:var(--display);font-weight:600;color:var(--leaf);}
.metier-body .chip{background:var(--white);}
@media (max-width:900px){.metier{grid-template-columns:1fr;}.metier-tex{min-height:180px;}.presta{grid-template-columns:1fr;}}
.metiers-wrap{padding:20px 0 0;}
.nope{background:var(--white);border:2px solid var(--paper-3);border-radius:var(--r);padding:clamp(24px,4vw,48px);}
.nope h2{margin:4px 0 6px;font-size:clamp(2rem,4vw,3rem);}
.nope .mono{color:var(--leaf);}
.nope ul{list-style:none;padding:0;margin:20px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:12px 32px;}
.nope li{font-size:1.15rem;font-weight:700;position:relative;padding-left:36px;}
.nope li::before,.nope li::after{content:"";position:absolute;left:4px;top:.75em;width:18px;height:3px;border-radius:2px;background:var(--azure);transform:rotate(45deg);}
.nope li::after{transform:rotate(-45deg);}
@media (max-width:700px){.nope ul{grid-template-columns:1fr;}}

/* Chantier */
.panneau{display:grid;grid-template-columns:1.25fr 1fr;gap:6px;}
.panneau-l{padding:clamp(24px,4vw,44px);background:var(--paper-2);border-radius:var(--r) 0 0 var(--r);}
.panneau-l .mono{color:var(--leaf);}
.panneau-l h1{margin:8px 0 0;font-size:clamp(2.4rem,5.4vw,4.4rem);font-weight:700;line-height:1;}
.panneau-l p{margin:16px 0 0;font-size:1.1rem;color:var(--ink-2);max-width:54ch;}
.panneau-r{padding:clamp(24px,4vw,44px);background:var(--forest);color:var(--white);border-radius:0 var(--r) var(--r) 0;}
.panneau-r .fields{font-size:1.05rem;gap:12px 20px;}
.panneau-r .fields dt{color:var(--sun);}
.fictif-note{margin-top:18px;background:var(--sun);color:var(--forest-dark);border-radius:12px;padding:12px 16px;font-size:.98rem;}
@media (max-width:800px){.panneau{grid-template-columns:1fr;}.panneau-l{border-radius:var(--r) var(--r) 0 0;}.panneau-r{border-radius:0 0 var(--r) var(--r);}}
.etapes{display:grid;gap:clamp(48px,8vw,96px);}
.etape{display:grid;grid-template-columns:110px 1fr 1fr;gap:clamp(16px,3vw,40px);align-items:center;}
.etape-n{font-family:var(--display);font-weight:700;font-size:clamp(4rem,9vw,6.6rem);line-height:.8;color:var(--leaf);align-self:start;}
.etape figure{margin:0;border-radius:var(--r);overflow:hidden;background:var(--paper-2);}
.etape figure img{width:100%;max-height:640px;object-fit:cover;}
.etape figure.portrait img{aspect-ratio:3/4;}
.etape figure.landscape img{aspect-ratio:16/10;}
.etape h3{margin:10px 0 8px;font-size:clamp(1.7rem,3vw,2.4rem);font-weight:600;line-height:1.05;}
.etape p{margin:0;color:var(--ink-2);font-size:1.08rem;}
.etape:nth-child(even) figure{order:3;}
.etape:nth-child(even) .etape-txt{order:2;}
@media (max-width:900px){.etape{grid-template-columns:1fr;}.etape:nth-child(even) figure{order:0;}.etape-n{font-size:4rem;}}
.next-ch{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;align-items:center;border-top:2px solid var(--paper-3);padding-top:28px;margin-top:64px;}

/* Qui suis-je */
.about{display:grid;grid-template-columns:7fr 5fr;gap:clamp(24px,4vw,56px);align-items:start;}
.about-photo{border-radius:var(--r);overflow:hidden;position:relative;}
.about-photo img{width:100%;aspect-ratio:16/10;object-fit:cover;}
.about-photo figcaption{position:absolute;left:14px;bottom:14px;background:var(--white);color:var(--forest);padding:4px 12px;border-radius:999px;}
.portrait-slot{aspect-ratio:4/5;border:2px solid var(--paper-3);border-radius:var(--r);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:var(--paper-2);text-align:center;padding:20px;color:var(--forest);}
.portrait-slot img{width:120px;opacity:.9;}
.portrait-slot strong{font-family:var(--display);font-weight:600;text-transform:uppercase;font-size:1.3rem;}
.about-text p{font-size:1.15rem;}
.todo{background:var(--sun);padding:0 6px;border-radius:4px;font-size:.88em;font-weight:700;}
.rules{list-style:none;margin:0;padding:0;counter-reset:r;}
.rules li{counter-increment:r;display:grid;grid-template-columns:80px 1fr;gap:16px;padding:22px 0;border-bottom:1px solid var(--paper-3);align-items:baseline;}
.rules li::before{content:counter(r, decimal-leading-zero);font-family:var(--display);font-weight:700;font-size:2.4rem;color:var(--leaf);}
.rules strong{display:block;font-family:var(--display);font-weight:600;text-transform:uppercase;font-size:1.4rem;color:var(--forest);letter-spacing:.01em;}
.rules span{color:var(--ink-2);}
@media (max-width:900px){.about{grid-template-columns:1fr;}}

/* Contact */
.contact-grid{display:grid;grid-template-columns:7fr 5fr;gap:clamp(24px,4vw,56px);align-items:start;}
.form{background:var(--white);border:2px solid var(--paper-3);border-radius:var(--r);padding:clamp(20px,3vw,36px);display:grid;gap:18px;}
.row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.field{display:flex;flex-direction:column;gap:6px;}
.field label,.field legend{font-family:var(--display);font-size:.8rem;font-weight:500;text-transform:uppercase;letter-spacing:.1em;color:var(--forest);}
.field input,.field select,.field textarea{font:inherit;font-size:1rem;padding:12px 14px;border:2px solid var(--paper-3);background:var(--paper);border-radius:12px;color:var(--ink);}
.field input:focus,.field select:focus,.field textarea:focus{outline:3px solid var(--sky);outline-offset:1px;border-color:var(--azure);background:var(--white);}
.field textarea{min-height:130px;resize:vertical;}
fieldset.field{border:0;padding:0;margin:0;}
.checks{display:flex;flex-wrap:wrap;gap:8px;}
.checks label{font-family:var(--body);font-size:1rem;font-weight:600;text-transform:none;letter-spacing:0;display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border:2px solid var(--paper-3);border-radius:999px;cursor:pointer;background:var(--paper);color:var(--ink);}
.checks input{accent-color:var(--leaf);width:18px;height:18px;margin:0;}
.checks label:has(input:checked){background:var(--leaf);border-color:var(--leaf);color:var(--white);}
.consent{display:flex;gap:10px;align-items:flex-start;font-size:.94rem;color:var(--ink-2);}
.consent input{width:20px;height:20px;accent-color:var(--leaf);flex:none;margin-top:3px;}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}
.status-msg{min-height:1.4em;margin:0;font-weight:700;}
.status-msg.ok{color:var(--field);}
.status-msg.err{color:#B23B1E;}
@media (max-width:600px){.row{grid-template-columns:1fr;}}
@media (max-width:900px){.contact-grid{grid-template-columns:1fr;}}
.card-info{border-radius:var(--r);background:var(--forest);color:var(--white);padding:clamp(20px,3vw,32px);}
.card-info .mono{color:var(--sun);}
.card-info a.big{display:block;font-family:var(--display);font-weight:600;font-size:clamp(1.9rem,4vw,2.6rem);text-decoration:none;margin:4px 0 18px;line-height:1.05;word-break:break-word;}
.card-info a.big:hover{color:var(--sun);}
.card-info p{margin:0 0 18px;color:#DDE5CC;}
.zone{margin-top:20px;}
.zone .mono{color:var(--leaf);}

/* Mentions */
.legal{max-width:780px;}
.legal h2{font-size:1.6rem;margin:40px 0 8px;}
.legal p{color:var(--ink-2);}

/* ---------- Apparition au défilement ---------- */
.rv{opacity:0;transform:translateY(24px);transition:opacity .7s, transform .7s cubic-bezier(.2,.8,.2,1);}
.rv.in{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none;}}

/* ---------- Chat ---------- */
.chat-fab{position:fixed;right:20px;bottom:20px;z-index:58;display:flex;align-items:center;gap:10px;background:var(--white);color:var(--forest);border:2px solid var(--leaf);border-radius:999px;padding:6px 18px 6px 8px;cursor:pointer;font-family:var(--display);font-weight:500;font-size:1.05rem;text-transform:uppercase;letter-spacing:.05em;box-shadow:0 8px 24px rgba(31,44,14,.18);transition:transform .2s;}
.chat-fab:hover{transform:translateY(-2px);}
.chat-fab img{width:44px;height:auto;}
.chat-fab .dot{width:9px;height:9px;border-radius:50%;background:var(--leaf);box-shadow:0 0 0 3px rgba(116,154,48,.25);}
@media (max-width:980px){.chat-fab{bottom:76px;right:12px;padding:6px;}.chat-fab .lbl,.chat-fab .dot{display:none;}}
.chat{position:fixed;right:20px;bottom:20px;z-index:59;width:min(390px, calc(100vw - 24px));height:min(600px, calc(100vh - 120px));background:var(--paper);border-radius:var(--r);overflow:hidden;box-shadow:0 18px 50px rgba(31,44,14,.28);display:none;flex-direction:column;}
.chat.open{display:flex;}
@media (max-width:980px){.chat{right:12px;bottom:76px;height:min(560px, calc(100vh - 140px));}}
.chat-hd{background:var(--forest);color:var(--white);padding:12px 14px;display:flex;align-items:center;gap:12px;}
.chat-hd img{width:46px;background:var(--white);border-radius:12px;padding:4px;}
.chat-hd strong{display:block;line-height:1.1;font-family:var(--display);font-weight:500;text-transform:uppercase;letter-spacing:.04em;}
.chat-hd .mono{color:var(--sun);font-size:.68rem;}
.chat-x{margin-left:auto;background:none;border:2px solid rgba(255,255,255,.6);border-radius:50%;color:var(--white);width:34px;height:34px;cursor:pointer;font-size:1.1rem;line-height:1;}
.chat-log{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px;}
.msg{max-width:85%;padding:10px 14px;font-size:.98rem;line-height:1.45;border-radius:16px;}
.msg.bot{background:var(--white);align-self:flex-start;border:1px solid var(--paper-3);border-bottom-left-radius:4px;}
.msg.me{background:var(--leaf);color:var(--white);align-self:flex-end;border-bottom-right-radius:4px;}
.msg.typing{color:var(--mute);font-style:italic;font-size:.9rem;}
.msg a{color:var(--forest);font-weight:700;}
.quick{display:flex;flex-wrap:wrap;gap:6px;padding:0 16px 10px;}
.quick button{font-family:var(--body);font-size:.88rem;font-weight:600;padding:6px 12px;border:1.5px solid var(--leaf);border-radius:999px;background:var(--white);color:var(--forest);cursor:pointer;}
.quick button:hover{background:var(--leaf);color:var(--white);}
.chat-in{display:flex;gap:8px;padding:10px;border-top:1px solid var(--paper-3);background:var(--white);}
.chat-in input{flex:1;font:inherit;font-size:1rem;border:2px solid var(--paper-3);border-radius:999px;padding:10px 14px;background:var(--paper);min-width:0;}
.chat-in input:focus{outline:none;border-color:var(--azure);}
.chat-in button{background:var(--sun);border:0;border-radius:999px;padding:0 18px;font-family:var(--display);font-weight:500;text-transform:uppercase;letter-spacing:.05em;color:var(--forest-dark);cursor:pointer;}
.chat-demo{font-family:var(--display);font-size:.66rem;text-transform:uppercase;letter-spacing:.1em;text-align:center;color:var(--mute);padding:6px;background:var(--white);}

/* ---------- Page charte ---------- */
.swatches{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;}
.swatch{border-radius:14px;overflow:hidden;border:1px solid var(--paper-3);background:var(--white);}
.swatch i{display:block;height:96px;}
.swatch div{padding:10px 12px;font-size:.88rem;line-height:1.35;}
.swatch b{display:block;font-family:var(--display);font-weight:600;text-transform:uppercase;color:var(--forest);}
.type-row{display:grid;grid-template-columns:200px 1fr;gap:20px;padding:22px 0;border-bottom:1px solid var(--paper-3);align-items:baseline;}
@media (max-width:700px){.type-row{grid-template-columns:1fr;}}
.logo-board{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:12px;}
.logo-board figure{margin:0;border-radius:var(--r);padding:24px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-height:240px;}
.logo-board figcaption{font-size:.9rem;color:var(--mute);text-align:center;}
@media (max-width:800px){.logo-board{grid-template-columns:1fr;}}
.panneau-r .chip{background:rgba(255,255,255,.14);color:var(--white);}
.panneau-r .chip.couverture{background:var(--sun);color:var(--forest-dark);}

/* ---------- Lien Facebook ---------- */
.fb-ico{width:1.15em;height:1.15em;flex:none;vertical-align:-.2em;}
.fb-link{display:inline-flex;align-items:center;gap:8px;font-weight:700;color:var(--forest);}
.fb-btn{margin-top:4px;}
.card-info .fb-btn{margin-top:0;}
.fb-cta{margin-top:28px;font-size:1.1rem;}

/* 7e métier : la dernière carte prend toute la largeur, texture à gauche */
@media (min-width:901px){
  .samples .sample:last-child:nth-child(3n+1){grid-column:1/-1;flex-direction:row;}
  .samples .sample:last-child:nth-child(3n+1) .sample-tex{height:auto;min-height:200px;width:33%;border-bottom:0;border-right:6px solid var(--white);}
}
.chip.chauffage{background:var(--sun);color:var(--forest-dark);}

/* ---------- Crédit Apexus (pied de page) ---------- */
.ftr-credit a{color:var(--forest);font-weight:600;text-decoration:underline;text-decoration-color:var(--leaf);text-decoration-thickness:2px;text-underline-offset:3px;transition:background .2s, text-decoration-color .2s;}
.ftr-credit a:hover{background:linear-gradient(transparent 55%, rgba(255,205,1,.55) 55%);text-decoration-color:var(--sun);}

/* ---------- Widget de chat n8n (version en ligne), aux couleurs LOGE&NERJ ----------
   Les variables sont posées sur #n8n-chat (et non :root) : la feuille du widget, chargée après celle-ci, redéfinit :root. */
#n8n-chat, #n8n-chat .n8n-chat{
  --chat--color-primary:var(--forest);
  --chat--color-primary-shade-50:var(--field);
  --chat--color-primary-shade-100:var(--forest-dark);
  --chat--color-secondary:var(--leaf);
  --chat--color-secondary-shade-50:var(--field);
  --chat--toggle--background:var(--white);
  --chat--toggle--hover--background:var(--paper-2);
  --chat--toggle--active--background:var(--paper-2);
  --chat--toggle--color:var(--forest);
  --chat--toggle--size:64px;
  --chat--window--width:380px;
  --chat--window--height:600px;
  --chat--border-radius:18px;
  --chat--header--background:var(--forest);
  --chat--header--color:var(--white);
  --chat--body--background:var(--paper);
  --chat--message--bot--background:var(--white);
  --chat--message--bot--color:var(--ink);
  --chat--message--bot--border:1px solid var(--paper-3);
  --chat--message--user--background:var(--leaf);
  --chat--message--user--color:var(--white);
  --chat--input--border:1px solid var(--paper-3);
  --chat--input--send--button--background:var(--sun);
  --chat--input--send--button--background-hover:#FFD93D;
  --chat--input--send--button--color:var(--forest-dark);
  --chat--input--send--button--color-hover:var(--forest-dark);
  --chat--font-family:var(--body);
}
#n8n-chat .chat-window-toggle,
#n8n-chat [class*="toggle"]{
  background-image:url("../assets/brand/embleme-160.webp") !important;
  background-repeat:no-repeat !important;
  background-position:center !important;
  background-size:70% auto !important;
  border:2px solid var(--leaf) !important;
  box-shadow:0 8px 24px rgba(31,44,14,.18) !important;
}
#n8n-chat .chat-window-toggle svg,
#n8n-chat [class*="toggle"] svg{display:none !important;}
#n8n-chat .chat-header h1,#n8n-chat .chat-header h2{font-family:var(--display) !important;text-transform:uppercase;letter-spacing:.04em;}
@media (max-width:980px){
  #n8n-chat .chat-window-wrapper{bottom:76px !important;right:12px !important;}
}
.callband .phone[data-email]{font-size:clamp(1.5rem,5vw,4rem);overflow-wrap:anywhere;}
#n8n-chat .chat-input button svg,#n8n-chat [class*="send"] svg{fill:var(--forest-dark) !important;color:var(--forest-dark) !important;}

/* ---------- Réalisations en vidéo (Facebook, chargées au clic) ---------- */
.fiche.video .fiche-video{display:flex;justify-content:center;align-items:center;min-height:500px;padding:12px;background:var(--forest-dark) url("../assets/brand/champs.svg") center bottom/100% 90px no-repeat;}
.fiche-video iframe{display:block;max-width:100%;border-radius:12px;background:#000;}
.fiche-video .play{text-decoration:none;width:267px;max-width:100%;height:476px;border:0;border-radius:12px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:var(--white);font-family:var(--display);background:linear-gradient(160deg,var(--field),var(--forest-dark));box-shadow:inset 0 0 0 2px rgba(255,255,255,.15);transition:transform .2s;}
.fiche-video .play:hover{transform:scale(1.02);}
.play-ico{width:78px;height:78px;border-radius:50%;background:var(--sun);position:relative;}
.play-ico::after{content:"";position:absolute;left:31px;top:24px;border-left:24px solid var(--forest-dark);border-top:15px solid transparent;border-bottom:15px solid transparent;}
.play-txt{font-size:1.3rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;}
.play-note{font-family:var(--body);font-size:.85rem;color:#DDE5CC;}
.fiche-txt{margin:0;color:var(--ink-2);font-size:.98rem;}
.fiche .lnk{align-self:flex-start;}
.chip.depannage{background:var(--forest-dark);color:var(--sun);}

/* ---------- Pièces jointes du formulaire ---------- */
.field .dropzone{display:flex;align-items:center;gap:12px;padding:16px;border:2px dashed var(--leaf);border-radius:12px;background:var(--paper-2);cursor:pointer;text-transform:none;letter-spacing:0;font-family:var(--body);font-size:.95rem;color:var(--ink-2);}
.field .dropzone:hover,.field .dropzone:focus-within{background:#E7EED8;border-color:var(--forest);}
.dropzone input{position:absolute;width:1px;height:1px;opacity:0;}
.dropzone b{color:var(--forest);}
.dz-txt::before{content:"+";display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;margin-right:10px;border-radius:50%;background:var(--sun);color:var(--forest-dark);font-weight:700;}
.pj-list{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:6px;}
.pj-list li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 12px;border-radius:10px;background:var(--white);border:1px solid var(--paper-3);font-size:.92rem;word-break:break-all;}
.pj-list button{flex:none;width:28px;height:28px;border-radius:50%;border:1px solid var(--paper-3);background:var(--paper);color:var(--forest);cursor:pointer;font-size:1rem;line-height:1;}
.pj-list .pj-err{background:#FDECE7;border-color:#F2B8A6;color:#8A2E14;}
.pj-note{margin:4px 0 0;font-size:.85rem;color:var(--mute);}

/* ---------- Carte « album photo Facebook » ---------- */
.fiche-album{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:minmax(0,1fr) minmax(0,1fr);gap:6px;height:340px;overflow:hidden;background:var(--white);}
.fiche-album img{width:100%;height:100%;min-height:0;object-fit:cover;}
.fiche-album img:first-child{grid-row:1/3;}

/* vignette de la vidéo (image Facebook « avant travaux ») : image et voile vert posés en style en ligne par site.js (chemin relatif à la page) */
.fiche-video .play.has-vignette{background-position:center;background-size:cover;background-repeat:no-repeat;justify-content:flex-end;padding-bottom:28px;}
.fiche-video .play.has-vignette .play-ico{box-shadow:0 6px 20px rgba(0,0,0,.35);}
.fiche-video .play.has-vignette .play-txt,.fiche-video .play.has-vignette .play-note{text-shadow:0 1px 6px rgba(0,0,0,.6);}

/* ---------- Bulle d'annonce du chat (au-dessus du bouton) ---------- */
.chat-teaser{position:fixed;right:20px;bottom:100px;z-index:9998;width:min(330px,calc(100vw - 24px));opacity:0;transform:translateY(12px) scale(.96);transform-origin:bottom right;transition:opacity .35s,transform .35s cubic-bezier(.2,.8,.2,1);pointer-events:none;}
.chat-teaser.show{opacity:1;transform:none;pointer-events:auto;animation:ct-flotte 3s 1s ease-in-out infinite;}
.chat-teaser-open{display:flex;flex-direction:column;gap:4px;width:100%;text-align:left;cursor:pointer;background:var(--white);border:2px solid var(--leaf);border-radius:18px 18px 4px 18px;padding:14px 40px 14px 16px;box-shadow:0 12px 32px rgba(31,44,14,.22);font-family:var(--body);color:var(--ink);position:relative;}
.chat-teaser-open::after{content:"";position:absolute;right:22px;bottom:-11px;width:18px;height:18px;background:var(--white);border-right:2px solid var(--leaf);border-bottom:2px solid var(--leaf);transform:rotate(45deg);}
.chat-teaser-open:hover{border-color:var(--forest);}
.chat-teaser-open strong{font-family:var(--display);font-weight:600;font-size:1.15rem;text-transform:uppercase;letter-spacing:.02em;color:var(--forest);line-height:1.1;}
.ct-kicker{display:inline-flex;align-items:center;gap:6px;font-family:var(--display);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--leaf);}
.ct-dot{width:8px;height:8px;border-radius:50%;background:#3BB54A;box-shadow:0 0 0 3px rgba(59,181,74,.25);}
.ct-txt{font-size:.9rem;color:var(--ink-2);line-height:1.35;}
.chat-teaser-x{position:absolute;top:8px;right:8px;width:26px;height:26px;border-radius:50%;border:1px solid var(--paper-3);background:var(--paper);color:var(--forest);cursor:pointer;font-size:1rem;line-height:1;}
@keyframes ct-flotte{0%,100%{transform:none}50%{transform:translateY(-5px)}}
#n8n-chat .chat-window-toggle.chat-pulse{animation:ct-pulse 2.2s ease-out infinite;}
@keyframes ct-pulse{0%{box-shadow:0 0 0 0 rgba(116,154,48,.55),0 8px 24px rgba(31,44,14,.18)}70%{box-shadow:0 0 0 16px rgba(116,154,48,0),0 8px 24px rgba(31,44,14,.18)}100%{box-shadow:0 0 0 0 rgba(116,154,48,0),0 8px 24px rgba(31,44,14,.18)}}
@media (max-width:980px){.chat-teaser{right:12px;bottom:160px;}}
@media (prefers-reduced-motion:reduce){.chat-teaser.show{animation:none}#n8n-chat .chat-window-toggle.chat-pulse{animation:none}}

/* ---------- Fermeture du chat ---------- */
#n8n-chat .chat-header{position:relative;padding-right:56px !important;}
#n8n-chat .chat-close{position:absolute;top:14px;right:14px;width:36px;height:36px;border-radius:50%;border:2px solid var(--sun);background:var(--sun);color:var(--forest-dark);font-family:var(--display);font-size:1.5rem;line-height:1;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0 0 3px;transition:background .2s,transform .2s;}
#n8n-chat .chat-close:hover{background:var(--white);border-color:var(--white);transform:rotate(90deg);}
#n8n-chat .chat-close:focus-visible{outline:3px solid var(--sky);outline-offset:2px;}
/* bouton rond : logo quand le chat est fermé, croix quand il est ouvert */
#n8n-chat .chat-window-toggle.is-open{background-image:none !important;background-color:var(--forest) !important;border-color:var(--sun) !important;animation:none !important;}
#n8n-chat .chat-window-toggle.is-open::before{content:"×";color:var(--sun);font-family:var(--display);font-size:2.2rem;font-weight:600;line-height:1;margin-top:-4px;}
/* Mobile : la fenêtre du chat laisse voir le haut de la page et le bouton de fermeture */
@media (max-width:980px){
  #n8n-chat, #n8n-chat .n8n-chat{--chat--window--width:calc(100vw - 24px);--chat--window--height:min(520px, calc(100vh - 230px));}
  @supports (height:100dvh){#n8n-chat, #n8n-chat .n8n-chat{--chat--window--height:min(520px, calc(100dvh - 230px));}}
  #n8n-chat .chat-window{max-height:calc(100dvh - 230px) !important;}
}
/* en-tête du chat compact (le widget prévoit un grand bandeau) */
#n8n-chat .chat-header{min-height:0 !important;height:auto !important;padding:12px 56px 12px 16px !important;gap:2px !important;}
#n8n-chat .chat-header h1{font-size:1.35rem !important;line-height:1.1 !important;margin:0 !important;}
#n8n-chat .chat-header p{font-size:.85rem !important;line-height:1.3 !important;margin:2px 0 0 !important;opacity:.9;}
#n8n-chat .chat-close{top:50%;transform:translateY(-50%);}
#n8n-chat .chat-close:hover{transform:translateY(-50%) rotate(90deg);}

.ftr-credit{text-transform:none;letter-spacing:0;font-family:var(--body);font-size:.85rem;}
.chat-teaser.ct-hidden{opacity:0 !important;pointer-events:none !important;}