/* =========================================================
   Digital Forger — composants propres à certaines pages
   ========================================================= */

/* ---------- Cadres épinglés (Votre quotidien, Pour qui) ---------- */
.pin{position:relative;height:260vh;height:260svh}
.pin--paper2{background:var(--papier-2)}
.pin--paper{background:var(--papier)}
.stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;display:flex;align-items:center}
.stage .wrap{width:100%}
.pin-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:center}
.pin-right{display:flex;flex-direction:column;gap:28px;min-width:0}
.fcards{position:relative;height:340px}
.fcard{position:absolute;left:0;right:0;top:50%;margin-top:-75px;min-height:150px;padding:28px 32px;border-radius:var(--r);background:var(--blanc);border:1px solid var(--filet);display:flex;gap:18px;align-items:flex-start;will-change:transform,filter,opacity;transform-origin:center}
.fcard.is-hot{border-color:var(--braise);box-shadow:0 0 0 1px rgba(232,100,27,.45),0 12px 36px rgba(232,100,27,.18)}
.fcard .fsq{flex-shrink:0;margin-top:11px;width:12px;height:12px;border-radius:2px;background:var(--acier-clair);transition:background .4s,box-shadow .4s}
.fcard.is-hot .fsq{background:var(--incandescent);box-shadow:0 0 0 3px rgba(232,100,27,.2),0 0 16px 3px rgba(255,181,71,.9)}
.fcard .fnum{display:block;margin-bottom:6px;font-family:var(--display);font-weight:700;font-size:12px;letter-spacing:.12em;color:var(--braise-texte)}
.fcard p{font-family:var(--display);font-weight:700;font-size:22px;line-height:1.3}
.dots{display:flex;gap:10px;margin-top:32px}
.dot{width:28px;height:4px;border-radius:2px;background:var(--filet-2);border:0;padding:0;cursor:pointer;transition:background .4s,box-shadow .4s}
.dot.on{background:var(--braise);box-shadow:0 0 10px rgba(232,100,27,.6)}
.down{display:inline-flex;align-items:center;gap:8px;font-weight:600}
.down svg{width:18px;height:18px;transition:transform .3s}
.down:hover svg{transform:translateY(3px)}
/* variante centrée */
.pin--center .pin-grid{grid-template-columns:minmax(0,1fr);gap:20px;justify-items:center;text-align:center}
.pin--center .pin-intro{display:flex;flex-direction:column;align-items:center}
.pin--center .dots{margin-top:20px}
.pin--center .pin-right{width:100%;max-width:640px;text-align:left}
.pin--center .fcards{height:320px}
.pin-after{position:relative;z-index:2;margin-top:calc((500px - 100vh)/2);padding-bottom:clamp(64px,8vw,104px)}
.conclusion{max-width:760px;margin:0 auto;background:var(--charbon);color:var(--papier);border-radius:var(--r);padding:32px 40px;text-align:center;animation:df-ember-box 4s ease-in-out infinite}
.conclusion .ico-c{width:36px;height:36px;margin:0 auto 14px;stroke:var(--braise);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.conclusion p.big{font-family:var(--display);font-weight:700;font-size:clamp(20px,2.2vw,24px);line-height:1.3}
@media (max-width:860px){
  .pin-grid{grid-template-columns:minmax(0,1fr);gap:20px}
  .dots{margin-top:16px}
  .fcards,.pin--center .fcards{height:300px}
  .fcard{padding:22px 20px;gap:14px;min-height:130px;margin-top:-65px}
  .fcard p{font-size:19px}
  .conclusion{padding:24px 20px}
}
/* sans animation : cadres empilés */
.pin-static .pin{height:auto}
.pin-static .stage{position:static;height:auto;padding-block:96px}
.pin-static .fcards{height:auto;display:flex;flex-direction:column;gap:16px}
.pin-static .fcard{position:static;margin:0;transform:none!important;filter:none!important;opacity:1!important}
.pin-static .pin-after{margin-top:0}

/* ---------- Accueil : vitrine / atelier en diagonale ---------- */
.duo{position:relative;overflow:hidden;background:var(--blanc)}
.duo-dark{position:absolute;inset:0;background:var(--charbon);clip-path:polygon(57% 0,100% 0,100% 100%,43% 100%);pointer-events:none}
.duo-glow-l,.duo-glow-r{position:absolute;inset:0;opacity:0;transition:opacity .7s ease;pointer-events:none}
.duo-glow-l{clip-path:polygon(0 0,57% 0,43% 100%,0 100%);background:radial-gradient(ellipse 70% 80% at 52% 55%,rgba(255,181,71,.30),rgba(232,100,27,.14) 40%,rgba(255,255,255,0) 75%)}
.duo-glow-r{clip-path:polygon(57% 0,100% 0,100% 100%,43% 100%);background:radial-gradient(ellipse 70% 80% at 50% 55%,rgba(255,181,71,.22),rgba(232,100,27,.20) 35%,rgba(139,74,43,.10) 60%,rgba(26,23,20,0) 80%)}
.duo-seam{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.duo-seam.blur{filter:blur(12px);animation:df-seam 4s ease-in-out infinite}
@keyframes df-seam{0%,100%{opacity:.55}50%{opacity:1}}
.duo-runner{position:absolute;left:57%;top:0;width:11px;height:11px;margin:-5.5px 0 0 -5.5px;border-radius:50%;background:#FFF1D6;box-shadow:0 0 10px 3px var(--incandescent),0 0 40px 14px rgba(232,100,27,.55);animation:df-run 5.5s ease-in-out infinite;z-index:2;pointer-events:none}
@keyframes df-run{0%{left:57%;top:0;opacity:0}12%{opacity:1}88%{opacity:1}100%{left:43%;top:100%;opacity:0}}
.duo-grid{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:repeat(7,auto)}
.half{display:grid;grid-row:span 7;grid-template-rows:subgrid;row-gap:20px;align-items:start}
.half--l{padding-right:150px}
.half--r{padding-left:150px;color:var(--papier)}
.half .quotes{align-self:stretch}
.half--r .quotes{background:var(--charbon-2);border:1px solid var(--charbon-line)}
.half--r .quotes .q-label,.half--r .muted{color:var(--cendre)}
.half .foot{padding-top:16px;border-top:1px solid var(--filet);font-size:15px;color:var(--encre-douce)}
.half--r .foot{border-color:var(--charbon-line);color:var(--cendre)}
.half--r a{color:var(--braise-vive)}
.half .cta{align-self:end;font-weight:600}
.half-head h2{font-size:clamp(32px,3.6vw,44px)}
@media (hover:hover){
  .duo:has(.half--l:hover) .duo-glow-l,.duo:has(.half--r:hover) .duo-glow-r{opacity:1}
  .duo:has(.half:hover) .duo-seam.blur{animation:none;opacity:1}
  .half:hover .ico{animation:none;box-shadow:0 0 0 2px var(--braise),0 0 28px rgba(232,100,27,.65)}
  .half .quotes{transition:box-shadow .6s ease}
  .half:hover .quotes{box-shadow:0 0 0 1px rgba(232,100,27,.7),0 0 22px rgba(232,100,27,.18)}
}
.duo-band{background:var(--papier-2);padding-block:48px}
/* téléphone : empilé, diagonale horizontale */
@media (max-width:900px){
  .duo{background:var(--charbon)}
  .duo-dark,.duo-glow-l,.duo-glow-r,.duo-seam,.duo-runner{display:none}
  .duo-grid{display:block}
  .half{display:flex;flex-direction:column;gap:16px;padding:0}
  .half--l{background:var(--blanc);padding:64px var(--gutter) 100px;margin-inline:calc(var(--gutter)*-1)}
  .half--r{position:relative;padding:104px var(--gutter) 64px;margin:-72px calc(var(--gutter)*-1) 0;background:var(--charbon);clip-path:polygon(0 72px,100% 0,100% 100%,0 100%)}
  .duo-grid.wrap{padding-inline:var(--gutter)}
  .duo-grid.sec{padding-block:0}
  .seam-m{display:block!important}
  .half .cta{align-self:flex-start}
}
.seam-m{display:none;position:relative;height:0;z-index:3}
.seam-m::before{content:"";position:absolute;left:calc(var(--gutter)*-1);right:calc(var(--gutter)*-1);top:-72px;height:72px;background:linear-gradient(to bottom right,transparent calc(50% - 2px),#FFB547 50%,transparent calc(50% + 2px));filter:drop-shadow(0 0 8px rgba(232,100,27,.9))}

/* ---------- Accueil : plaques d'engagement (fer chauffé) ---------- */
.plaques{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:24px}
.plaque{position:relative;overflow:hidden;padding:36px 32px;border-radius:var(--r);background:var(--charbon-2);border:1px solid var(--charbon-line);transition:border-color .5s,box-shadow .5s,transform .5s}
.plaque .roman{display:block;font-family:var(--display);font-weight:800;font-size:48px;line-height:1;letter-spacing:.04em;color:#6B6F75;margin-bottom:20px;transition:color .6s,text-shadow .6s}
.plaque h3{margin-bottom:12px}
.plaque p{color:var(--cendre)}
.plaque .ember{position:absolute;inset:0;background:radial-gradient(ellipse 90% 70% at 50% 110%,rgba(232,100,27,.28),rgba(139,74,43,.10) 55%,rgba(35,31,27,0) 80%);opacity:0;transition:opacity .6s;pointer-events:none}
.plaque .bar{position:absolute;left:0;bottom:0;width:100%;height:3px;background:var(--heat);transform:scaleX(0);transform-origin:left;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.plaque>*:not(.ember):not(.bar){position:relative}
@media (hover:hover){
  .plaque:hover{border-color:var(--braise);box-shadow:0 0 0 1px rgba(232,100,27,.5),0 0 36px rgba(232,100,27,.28);transform:translateY(-4px)}
  .plaque:hover .roman{color:var(--incandescent);text-shadow:0 0 14px rgba(255,181,71,.9),0 0 38px rgba(232,100,27,.7)}
  .plaque:hover .ember{opacity:1}
  .plaque:hover .bar{transform:scaleX(1)}
}
@media (hover:none){
  .plaques.is-live .plaque{animation:df-strike 9s ease-in-out var(--dl,0s) infinite}
  .plaques.is-live .plaque .roman{animation:df-heatnum 9s ease-in-out var(--dl,0s) infinite}
  .plaques.is-live .plaque .bar{animation:df-heatbar 9s ease-out var(--dl,0s) infinite}
}
@keyframes df-strike{0%,100%{border-color:#3A342F;box-shadow:none}5%{border-color:#E8641B;box-shadow:0 0 0 1px rgba(232,100,27,.55),0 0 30px rgba(232,100,27,.35)}25%{border-color:#3A342F;box-shadow:none}}
@keyframes df-heatnum{0%,100%{color:#6B6F75;text-shadow:none}5%,14%{color:#FFB547;text-shadow:0 0 12px rgba(255,181,71,.9),0 0 30px rgba(232,100,27,.7)}30%{color:#6B6F75;text-shadow:none}}
@keyframes df-heatbar{0%{transform:scaleX(0);opacity:1}8%{transform:scaleX(1);opacity:1}24%{transform:scaleX(1);opacity:0}25%,100%{transform:scaleX(0);opacity:0}}
.motto{margin-top:72px;display:flex;flex-wrap:wrap;align-items:center;gap:24px}
.motto .rule{width:56px;height:3px;background:var(--heat)}
.motto p{font-family:var(--display);font-weight:800;font-size:clamp(28px,3.4vw,40px);line-height:1.1;letter-spacing:-.015em}

/* ---------- Accueil : coulée de la méthode ---------- */
.flow{position:relative;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:32px}
.flow-track{position:absolute;left:12px;right:calc((100% - 96px)/4 - 12px);top:11px;height:2px;background:var(--filet)}
.flow-track span{position:absolute;left:0;top:-1px;height:4px;width:0;border-radius:2px;background:linear-gradient(90deg,#8B4A2B,#E8641B 70%,#FFB547);box-shadow:0 0 12px rgba(232,100,27,.6)}
.flow.is-live .flow-track span{animation:df-flow 10s linear infinite}
.flow-track span::after{content:"";position:absolute;right:-6px;top:-4px;width:12px;height:12px;border-radius:50%;background:#FFF1D6;box-shadow:0 0 10px 3px var(--incandescent),0 0 28px 8px rgba(232,100,27,.55)}
@keyframes df-flow{0%{width:0;opacity:1}60%{width:100%;opacity:1}78%{width:100%;opacity:1}88%,100%{width:100%;opacity:0}}
.step{position:relative;padding-top:52px}
.step .node,.step .ring{position:absolute;left:0;top:0;width:24px;height:24px;border-radius:50%}
.step .node{border:2px solid var(--acier);background:var(--papier)}
.step .ring{border:2px solid var(--incandescent);opacity:0}
.step .big-num{display:block;font-family:var(--display);font-weight:800;font-size:64px;line-height:1;color:rgba(232,100,27,0);-webkit-text-stroke:1.5px var(--acier-clair);margin-bottom:18px}
.step h3{margin-bottom:8px}
.step p{color:var(--encre-douce)}
.flow.is-live .step:nth-child(2) .node{animation:df-n0 10s linear infinite}.flow.is-live .step:nth-child(2) .ring{animation:df-ring0 10s linear infinite}.flow.is-live .step:nth-child(2) .big-num{animation:df-t0 10s linear infinite}
.flow.is-live .step:nth-child(3) .node{animation:df-n1 10s linear infinite}.flow.is-live .step:nth-child(3) .ring{animation:df-ring1 10s linear infinite}.flow.is-live .step:nth-child(3) .big-num{animation:df-t1 10s linear infinite}
.flow.is-live .step:nth-child(4) .node{animation:df-n2 10s linear infinite}.flow.is-live .step:nth-child(4) .ring{animation:df-ring2 10s linear infinite}.flow.is-live .step:nth-child(4) .big-num{animation:df-t2 10s linear infinite}
.flow.is-live .step:nth-child(5) .node{animation:df-n3 10s linear infinite}.flow.is-live .step:nth-child(5) .ring{animation:df-ring3 10s linear infinite}.flow.is-live .step:nth-child(5) .big-num{animation:df-t3 10s linear infinite}
@keyframes df-n0{0%{background:#F6F1E9;border-color:#4A4F55;box-shadow:none}2%,78%{background:#E8641B;border-color:#FFB547;box-shadow:0 0 0 4px rgba(232,100,27,.18),0 0 22px rgba(255,181,71,.85)}88%,100%{background:#F6F1E9;border-color:#4A4F55;box-shadow:none}}
@keyframes df-n1{0%,20%{background:#F6F1E9;border-color:#4A4F55;box-shadow:none}22%,78%{background:#E8641B;border-color:#FFB547;box-shadow:0 0 0 4px rgba(232,100,27,.18),0 0 22px rgba(255,181,71,.85)}88%,100%{background:#F6F1E9;border-color:#4A4F55;box-shadow:none}}
@keyframes df-n2{0%,40%{background:#F6F1E9;border-color:#4A4F55;box-shadow:none}42%,78%{background:#E8641B;border-color:#FFB547;box-shadow:0 0 0 4px rgba(232,100,27,.18),0 0 22px rgba(255,181,71,.85)}88%,100%{background:#F6F1E9;border-color:#4A4F55;box-shadow:none}}
@keyframes df-n3{0%,60%{background:#F6F1E9;border-color:#4A4F55;box-shadow:none}62%,78%{background:#E8641B;border-color:#FFB547;box-shadow:0 0 0 4px rgba(232,100,27,.18),0 0 22px rgba(255,181,71,.85)}88%,100%{background:#F6F1E9;border-color:#4A4F55;box-shadow:none}}
@keyframes df-t0{0%{color:rgba(232,100,27,0);-webkit-text-stroke-color:#8C8379}2%,78%{color:#E8641B;-webkit-text-stroke-color:#E8641B;text-shadow:0 0 18px rgba(232,100,27,.45)}88%,100%{color:rgba(232,100,27,0);-webkit-text-stroke-color:#8C8379;text-shadow:none}}
@keyframes df-t1{0%,20%{color:rgba(232,100,27,0);-webkit-text-stroke-color:#8C8379}22%,78%{color:#E8641B;-webkit-text-stroke-color:#E8641B;text-shadow:0 0 18px rgba(232,100,27,.45)}88%,100%{color:rgba(232,100,27,0);-webkit-text-stroke-color:#8C8379;text-shadow:none}}
@keyframes df-t2{0%,40%{color:rgba(232,100,27,0);-webkit-text-stroke-color:#8C8379}42%,78%{color:#E8641B;-webkit-text-stroke-color:#E8641B;text-shadow:0 0 18px rgba(232,100,27,.45)}88%,100%{color:rgba(232,100,27,0);-webkit-text-stroke-color:#8C8379;text-shadow:none}}
@keyframes df-t3{0%,60%{color:rgba(232,100,27,0);-webkit-text-stroke-color:#8C8379}62%,78%{color:#E8641B;-webkit-text-stroke-color:#E8641B;text-shadow:0 0 18px rgba(232,100,27,.45)}88%,100%{color:rgba(232,100,27,0);-webkit-text-stroke-color:#8C8379;text-shadow:none}}
@keyframes df-ring0{0%{transform:scale(1);opacity:0}1%{opacity:.85}9%,100%{transform:scale(3.4);opacity:0}}
@keyframes df-ring1{0%,20%{transform:scale(1);opacity:0}21%{opacity:.85}29%,100%{transform:scale(3.4);opacity:0}}
@keyframes df-ring2{0%,40%{transform:scale(1);opacity:0}41%{opacity:.85}49%,100%{transform:scale(3.4);opacity:0}}
@keyframes df-ring3{0%,60%{transform:scale(1);opacity:0}61%{opacity:.85}69%,100%{transform:scale(3.4);opacity:0}}
@media (max-width:860px){
  .flow{grid-template-columns:1fr;gap:0}
  .flow-track{display:none}
  .step{padding:0 0 28px 48px}
  .step:last-child{padding-bottom:0}
  .step .node,.step .ring{top:4px}
  .step .big-num{font-size:40px;margin-bottom:8px}
  .step:not(:last-child)::before{content:"";position:absolute;left:11px;top:30px;bottom:-6px;width:2px;background:var(--filet)}
}
@media (prefers-reduced-motion:reduce){.step .big-num{color:var(--braise-texte);-webkit-text-stroke-color:var(--braise-texte)}}

/* ---------- Site internet : choix d'entrée ---------- */
.choices{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:20px;max-width:840px}
.choice{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:24px 28px;border-radius:var(--r);background:var(--charbon-3);border:1.5px solid var(--acier-clair);color:var(--papier);text-decoration:none;transition:border-color .3s,box-shadow .3s,background .3s}
.choice strong{display:block;font-family:var(--display);font-weight:700;font-size:20px}
.choice span span{display:block;font-size:15px;color:var(--cendre)}
.choice svg{width:24px;height:24px;stroke:var(--braise);fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;transition:transform .3s}
.choice:hover{color:var(--papier);border-color:var(--braise);background:#332B26;box-shadow:0 0 0 1px rgba(232,100,27,.6),0 0 30px rgba(232,100,27,.3)}
.choice:hover svg{transform:translateY(4px)}
.split{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:64px;align-items:start}
.sub-h{font-family:var(--display);font-weight:700;font-size:18px;margin:0 0 6px}

/* Site internet : refaire (forge) */
.signs{display:flex;flex-wrap:wrap;gap:10px}
.sign{display:inline-flex;align-items:center;gap:10px;padding:9px 16px;border-radius:999px;background:var(--charbon-2);border:1px solid var(--acier);color:var(--cendre);font-size:15px;animation:df-signheat 10s ease-in-out var(--dl,0s) infinite}
.sign i{width:7px;height:7px;border-radius:50%;background:var(--rouille);animation:df-signdot 10s ease-in-out var(--dl,0s) infinite}
@keyframes df-signheat{0%,100%{border-color:#4A4F55;color:#B8B0A6;box-shadow:none}6%,16%{border-color:#E8641B;color:#F6F1E9;box-shadow:0 0 16px rgba(232,100,27,.35)}28%{border-color:#4A4F55;color:#B8B0A6;box-shadow:none}}
@keyframes df-signdot{0%,100%{background:#8B4A2B;box-shadow:none}6%,16%{background:#FFB547;box-shadow:0 0 8px 2px rgba(255,181,71,.8)}28%{background:#8B4A2B;box-shadow:none}}
@media (hover:hover){.sign:hover{animation:none;border-color:var(--braise);color:var(--papier);box-shadow:0 0 16px rgba(232,100,27,.4)}.sign:hover i{animation:none;background:var(--incandescent)}}
.forge-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
@media (max-width:900px){.forge-cards{grid-template-columns:1fr}}
.forge-card{position:relative;overflow:hidden;background:var(--charbon-2);border:1px solid var(--charbon-line);border-radius:var(--r);padding:32px;display:flex;flex-direction:column;gap:14px;transition:border-color .35s,box-shadow .35s,transform .35s}
.gauge{height:4px;border-radius:2px;background:var(--charbon-line);overflow:hidden}
.gauge div{height:100%;border-radius:2px;background:linear-gradient(90deg,#8B4A2B,#E8641B 30%,#FFB547 50%,#E8641B 70%,#8B4A2B);background-size:200% 100%;animation:df-shimmer 3s linear infinite}
.fire-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.fire-row span:first-child{font-family:var(--display);font-weight:700;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--braise-vive)}
.notches{display:flex;gap:4px}
.notches i{width:10px;height:10px;border-radius:2px;background:var(--charbon-line)}
.notches i.on{background:var(--braise)}
.forge-card h3{margin-top:6px}
.forge-card p{color:var(--cendre)}
@media (hover:hover){.forge-card:hover{border-color:var(--braise);box-shadow:0 0 0 1px rgba(232,100,27,.5),0 0 34px rgba(232,100,27,.25);transform:translateY(-4px)}.forge-card:hover .notches i.on{box-shadow:0 0 8px rgba(255,181,71,.8)}}
.free-note{display:inline-flex;align-items:center;gap:10px;font-weight:600;color:var(--papier)}
.free-note i{width:8px;height:8px;border-radius:50%;background:var(--incandescent);box-shadow:0 0 8px 2px rgba(255,181,71,.7)}

/* ---------- Outils : comparatif & cartes besoin ---------- */
.needs{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:24px}
.need{display:grid;grid-row:span 2;grid-template-rows:subgrid;row-gap:20px}
.need p.q{font-family:var(--display);font-weight:700;font-size:20px;line-height:1.3;color:var(--encre)}
.need .sol{padding-top:16px;border-top:1px solid var(--filet);display:flex;gap:10px;align-items:flex-start;color:var(--encre-douce)}
.need .sol svg{flex-shrink:0;margin-top:4px;width:18px;height:18px;stroke:var(--braise-texte);fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.compare{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:32px}
.compare div{padding:24px;border-radius:var(--r)}
.compare .std{border:1.5px solid var(--acier)}
.compare .cus{background:var(--charbon);color:var(--papier);animation:df-ember-box 4s ease-in-out infinite}
.compare .lab{font-family:var(--display);font-weight:700;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--encre-douce);margin-bottom:8px}
.compare .cus .lab{color:var(--braise-vive)}
.compare p:not(.lab){font-weight:600}
@media (max-width:560px){.compare{grid-template-columns:1fr}}
.principle{margin-top:32px;padding-top:24px;border-top:3px solid var(--braise);font-family:var(--display);font-weight:800;font-size:clamp(22px,2.4vw,26px);line-height:1.2}

/* ---------- Ma méthode : étapes au survol ---------- */
.rows{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.row{position:relative;display:grid;grid-template-columns:120px minmax(0,1fr) minmax(0,320px);gap:40px;padding:40px 0;border-top:1px solid var(--filet);align-items:start}
.row:last-child{border-bottom:1px solid var(--filet)}
.row .rbar{position:absolute;left:0;top:-2px;width:100%;height:3px;background:linear-gradient(90deg,#8B4A2B,#E8641B 30%,#FFB547 50%,#E8641B 70%,#8B4A2B);background-size:200% 100%;transform:scaleX(0);transform-origin:left;transition:transform .7s cubic-bezier(.2,.7,.2,1),box-shadow .5s}
.row .rnum{font-family:var(--display);font-weight:800;font-size:64px;line-height:.9;color:rgba(232,100,27,0);-webkit-text-stroke:1.5px var(--acier-clair);transition:color .5s,-webkit-text-stroke-color .5s,text-shadow .5s}
.row h3{font-size:clamp(22px,2.2vw,28px);margin-bottom:12px}
.row .you{padding:20px;border-radius:var(--r);background:var(--papier-2)}
.row .you b{display:block;font-family:var(--display);font-weight:700;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--encre-douce);margin-bottom:4px}
.row .you span{font-weight:500}
@media (hover:hover){.row:hover .rbar{transform:scaleX(1);animation:df-shimmer 2s linear infinite;box-shadow:0 0 12px rgba(232,100,27,.6)}.row:hover .rnum{color:var(--braise);-webkit-text-stroke-color:var(--braise);text-shadow:0 0 18px rgba(232,100,27,.45)}}
@media (hover:none){.row .rbar{animation:df-rowbar 10s ease-out var(--dl,0s) infinite}.row .rnum{animation:df-rownum 10s ease-out var(--dl,0s) infinite}}
@keyframes df-rowbar{0%{transform:scaleX(0);opacity:1}6%{transform:scaleX(1);opacity:1}70%{transform:scaleX(1);opacity:1}80%,100%{transform:scaleX(1);opacity:0}}
@keyframes df-rownum{0%,100%{color:rgba(232,100,27,0);-webkit-text-stroke-color:#8C8379;text-shadow:none}4%,70%{color:#E8641B;-webkit-text-stroke-color:#E8641B;text-shadow:0 0 18px rgba(232,100,27,.4)}80%{color:rgba(232,100,27,0);-webkit-text-stroke-color:#8C8379}}
@media (max-width:860px){.row{grid-template-columns:1fr;gap:12px;padding:28px 0}.row .rnum{font-size:40px}}
@media (prefers-reduced-motion:reduce){.row .rnum{color:var(--braise-texte);-webkit-text-stroke-color:var(--braise-texte)}}
.faq-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:64px;align-items:start}
@media (max-width:860px){.faq-grid{grid-template-columns:1fr;gap:24px}}
.faq{display:flex;flex-direction:column;gap:12px}
.faq details{background:var(--blanc);border:1px solid var(--filet);border-radius:var(--r);padding:20px 24px;transition:border-color .3s,box-shadow .3s}
.faq summary{cursor:pointer;font-family:var(--display);font-weight:700;font-size:19px}
.faq summary::marker{color:var(--braise)}
.faq details p{margin-top:12px;color:var(--encre-douce)}
@media (hover:hover){.faq details:hover{border-color:var(--braise);box-shadow:0 0 0 1px rgba(232,100,27,.35)}}

/* ---------- Appli ---------- */
.app-hero{background:var(--papier-2)}
.app-hero .split{align-items:center}
.phase{display:inline-flex;align-items:center;gap:10px;padding:10px 14px;border-radius:12px;background:var(--papier);border:1px solid var(--filet);font-size:14px;font-weight:500}
.phase i{width:8px;height:8px;border-radius:50%;background:var(--braise);animation:df-dot 2.4s ease-in-out infinite;flex-shrink:0}
.shot{aspect-ratio:16/10;max-width:100%;border-radius:var(--r);background:var(--blanc);border:2px dashed var(--acier-clair);display:flex;align-items:center;justify-content:center;text-align:center;padding:24px;color:var(--encre-douce);font-size:15px;box-shadow:0 12px 32px rgba(26,23,20,.12)}
.testers{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:20px;margin:40px 0}
.testers ul{padding-left:20px;color:var(--cendre);display:flex;flex-direction:column;gap:4px}

/* ---------- À propos ---------- */
.emblem{position:relative;overflow:hidden;aspect-ratio:4/5;max-width:440px;width:100%;justify-self:center;border-radius:var(--r);background:var(--charbon);box-shadow:0 1px 2px rgba(26,23,20,.08),0 16px 40px rgba(26,23,20,.18);display:flex;align-items:center;justify-content:center}
.emblem .glow{left:50%;top:55%;width:576px;height:576px;margin:-288px 0 0 -288px}
.emblem img{position:relative;width:240px;filter:drop-shadow(0 0 18px rgba(232,100,27,.45))}
.emblem .cap{position:absolute;left:0;right:0;bottom:24px;text-align:center;font-family:var(--display);font-weight:700;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--cendre)}
@media (max-width:760px){.emblem{aspect-ratio:16/11}.emblem img{width:160px}.emblem .glow{width:384px!important;height:384px!important;margin:-192px 0 0 -192px}}
.story{display:flex;flex-direction:column;gap:20px;font-size:19px;line-height:1.6}
.verb{animation:df-verb 6s ease-in-out var(--dl,0s) infinite}
@keyframes df-verb{0%,100%{color:inherit;text-shadow:none}6%,18%{color:#FFB547;text-shadow:0 0 18px rgba(255,181,71,.8),0 0 36px rgba(232,100,27,.5)}30%{color:inherit;text-shadow:none}}
.wm-logo{position:absolute;right:6%;top:50%;width:360px;margin-top:-115px;opacity:.08;animation:df-logo 6s ease-in-out infinite;pointer-events:none}
@keyframes df-logo{0%,100%{opacity:.06;filter:none}50%{opacity:.14;filter:drop-shadow(0 0 24px rgba(232,100,27,.6))}}
@media (max-width:760px){.wm-logo{display:none}}
.value-label{font-family:var(--display);font-weight:700;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--braise-texte);margin-bottom:10px}

/* ---------- Contact ---------- */
.means{display:flex;flex-direction:column;gap:16px}
.mean{display:flex;align-items:center;gap:18px;padding:22px 24px;border-radius:var(--r);background:var(--blanc);border:1px solid var(--filet);color:var(--encre);text-decoration:none;transition:border-color .3s,box-shadow .3s,transform .3s}
.mean strong{display:block;font-weight:600}
.mean span span{display:block;color:var(--encre-douce);font-size:15px}
.mean .ico{width:48px;height:48px;animation:none}
.mean .ico svg{width:22px;height:22px}
.mean:hover{color:var(--encre);border-color:var(--braise);box-shadow:0 0 0 1px rgba(232,100,27,.6),0 0 24px rgba(232,100,27,.25);transform:translateY(-2px)}
.reassure{margin-top:16px;padding:24px;border-radius:var(--r);background:var(--papier-2)}
.reassure strong{display:block;margin-bottom:8px;font-weight:600}

/* ---------- Réalisations / pages texte ---------- */
.waiting{max-width:760px;margin:0 auto;text-align:center;padding:56px 48px;border-radius:var(--r);background:var(--blanc);border:1px solid var(--filet);box-shadow:var(--shadow-card)}
.waiting h2{margin-bottom:16px}
@media (max-width:760px){.waiting{padding:32px 20px}}
.legal section{padding:32px 0;border-top:1px solid var(--filet)}
.legal h2{font-size:clamp(20px,2vw,24px);font-weight:700;margin-bottom:12px}
.legal p,.legal ul{margin-bottom:12px}
.legal ul{padding-left:22px;display:flex;flex-direction:column;gap:6px}
.todo{background:#FFE2A8;color:var(--encre);padding:0 4px;border-radius:3px}

/* ---------- Formulaire en étapes ---------- */
.contact-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);gap:56px;align-items:start}
.contact-side{position:sticky;top:110px}
@media (max-width:980px){.contact-grid{grid-template-columns:1fr;gap:48px}.contact-side{position:static}}
.wizard{position:relative;background:var(--blanc);border:1px solid var(--filet);border-radius:var(--r-lg);padding:clamp(22px,3.4vw,44px);box-shadow:var(--shadow-card);overflow:hidden}
.wizard::before{content:"";position:absolute;inset:0 0 auto;height:3px;background:var(--heat);opacity:.9}
.wprog{display:flex;align-items:center;gap:14px;margin-bottom:28px}
.wprog-bar{flex:1;height:6px;border-radius:6px;background:var(--papier-2);overflow:hidden;position:relative}
.wprog-fill{position:absolute;inset:0 auto 0 0;width:8%;border-radius:6px;background:var(--heat);box-shadow:0 0 12px rgba(232,100,27,.55);transition:width .6s cubic-bezier(.2,.8,.2,1)}
.wprog-fill::after{content:"";position:absolute;right:-2px;top:50%;width:10px;height:10px;border-radius:50%;transform:translateY(-50%);background:var(--incandescent);box-shadow:0 0 10px 3px rgba(255,181,71,.8)}
.wprog-txt{font:600 13px var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--encre-douce);white-space:nowrap}
.wstep{animation:df-wstep .45s ease both}
@keyframes df-wstep{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.wstep.back{animation-name:df-wstep-b}
@keyframes df-wstep-b{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}
.wkicker{font:700 12px var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--braise-texte);margin-bottom:10px}
.wtitle{font-size:clamp(24px,2.6vw,32px);font-weight:800;line-height:1.15;outline:none}
.wintro{color:var(--encre-douce);margin-top:10px}
.wbody{display:flex;flex-direction:column;gap:22px;margin-top:26px}
.wbody fieldset{border:0;padding:0;margin:0;min-width:0}
.wbody legend{font-weight:600;font-size:15px;padding:0;margin-bottom:8px}
.wbody fieldset .hint{display:block;margin:-4px 0 10px}
.req{color:var(--braise-texte)}
.ferr{display:none;font-size:14px;color:#B3261E;font-weight:500}
.q.invalid .ferr{display:block}
.q.invalid input:not([type=checkbox]):not([type=radio]),.q.invalid textarea,.q.invalid select{border-color:#B3261E}
.q.invalid .chip span{border-color:#E3A497}

/* grandes cartes de choix */
.wcards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
@media (max-width:620px){.wcards{grid-template-columns:1fr}}
.wcard{position:relative;display:flex;gap:16px;align-items:flex-start;padding:20px;border-radius:var(--r);border:1.5px solid var(--filet);background:var(--blanc);cursor:pointer;transition:border-color .25s,box-shadow .3s,transform .25s,background .25s}
.wcard input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.wcard-ico{flex-shrink:0;width:46px;height:46px;border-radius:12px;display:grid;place-items:center;background:var(--charbon);transition:box-shadow .3s}
.wcard-ico svg{width:22px;height:22px;fill:none;stroke:var(--braise);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.wcard-txt strong{display:block;font-family:var(--display);font-size:18px;line-height:1.25}
.wcard-txt span{display:block;font-size:15px;color:var(--encre-douce);margin-top:4px;line-height:1.45}
.wcard:hover{border-color:var(--braise);transform:translateY(-2px);box-shadow:0 10px 26px rgba(232,100,27,.12)}
.wcard:has(input:focus-visible){outline:2px solid var(--braise);outline-offset:3px}
.wcard:has(input:checked){border-color:var(--braise);background:#FFF8F2;box-shadow:var(--glow-braise)}
.wcard:has(input:checked) .wcard-ico{box-shadow:0 0 0 1px rgba(232,100,27,.8),0 0 18px rgba(232,100,27,.55)}

/* puces */
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chip{position:relative;cursor:pointer}
.chip input{position:absolute;opacity:0;width:1px;height:1px}
.chip span{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 16px;border-radius:999px;border:1.5px solid var(--filet-2);background:var(--blanc);font-size:15px;font-weight:500;line-height:1.3;transition:border-color .2s,background .2s,box-shadow .25s,color .2s}
.chip span::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--filet-2);transition:background .2s,box-shadow .25s;flex-shrink:0}
.chip:hover span{border-color:var(--braise)}
.chip input:focus-visible+span{outline:2px solid var(--braise);outline-offset:2px}
.chip input:checked+span{border-color:var(--braise);background:#FFF3EA;color:var(--encre)}
.chip input:checked+span::before{background:var(--braise);box-shadow:0 0 8px 2px rgba(232,100,27,.6)}

.wnote{font-size:15px;color:var(--encre-douce);padding:14px 16px;border-radius:var(--r-sm);background:var(--papier)}
.wnav{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:32px;padding-top:24px;border-top:1px solid var(--filet)}
.wnav .btn{margin-left:auto}
.wback{display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:0 6px;background:none;border:0;font:600 16px var(--body);color:var(--encre-douce);cursor:pointer}
.wback svg{width:18px;height:18px}
.wback:hover{color:var(--braise-texte)}
@media (max-width:520px){.wnav .btn{flex:1;padding:0 18px}}
.wizard .form-msg{margin-top:20px}
.wizard .form-msg a{font-weight:600}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.cf-turnstile{margin-top:8px}

/* récapitulatif */
.wrecap{display:flex;flex-direction:column;gap:14px}
.rblock{border:1px solid var(--filet);border-radius:var(--r);padding:18px 20px;background:var(--papier)}
.rhead{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:10px}
.rhead strong{font-family:var(--display);font-size:17px}
.rhead button{background:none;border:0;padding:4px 0;font:600 14px var(--body);color:var(--braise-texte);cursor:pointer;text-decoration:underline;text-underline-offset:4px}
.rblock dl{margin:0;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);gap:6px 16px;font-size:15px}
.rblock dt{color:var(--encre-douce)}
.rblock dd{margin:0;font-weight:500;overflow-wrap:anywhere;white-space:pre-line}
@media (max-width:560px){.rblock dl{grid-template-columns:1fr;gap:2px}.rblock dd{margin-bottom:8px}}

/* confirmation */
.wdone{text-align:center;padding:12px 0}
.wdone-ico{display:inline-grid;place-items:center;width:72px;height:72px;border-radius:50%;background:var(--charbon);margin-bottom:20px;box-shadow:0 0 0 1px rgba(232,100,27,.7),0 0 36px rgba(232,100,27,.5);animation:df-pulse 2.6s ease-in-out infinite}
.wdone-ico svg{width:34px;height:34px;fill:none;stroke:var(--incandescent);stroke-width:1.8;stroke-linejoin:round}
@keyframes df-pulse{50%{box-shadow:0 0 0 1px rgba(255,181,71,.9),0 0 52px rgba(232,100,27,.75)}}
.wnext{text-align:left;width:fit-content;max-width:min(100%,480px);margin:28px auto 0;padding:20px 24px;list-style:none;counter-reset:wn;display:flex;flex-direction:column;gap:14px;color:var(--encre-douce);background:var(--papier);border-radius:var(--r)}
.wnext li{position:relative;padding-left:40px;counter-increment:wn;line-height:1.5}
.wnext li::before{content:counter(wn);position:absolute;left:0;top:-1px;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font:700 13px/1 var(--body);background:var(--charbon);color:var(--incandescent)}
.wnext strong{color:var(--encre)}
.wizard.is-done .wnav,.wizard.is-done .wprog{display:none}
.wnojs{padding:20px;border-radius:var(--r);background:var(--blanc);border:1px solid var(--filet)}
@media (prefers-reduced-motion:reduce){.wstep,.wstep.back{animation:none}.wprog-fill{transition:none}.wdone-ico{animation:none}}
.wizard{scroll-margin-top:100px}
[hidden]{display:none!important}
@media (max-width:980px){.contact-grid{grid-template-columns:minmax(0,1fr)}}

/* ---- Appli : captures, visite guidée, démo ---- */
.app-stage{position:relative;padding:22px;border-radius:24px;background:linear-gradient(140deg,#E6ECFB 0%,#F1F3FA 45%,#F6EDE3 100%);border:1px solid rgba(26,23,20,.06)}
.app-frame{position:relative;margin:0;border-radius:14px;overflow:hidden;background:#F4F6FB;border:1px solid rgba(28,35,51,.14);box-shadow:0 1px 2px rgba(28,35,51,.06),0 10px 24px -6px rgba(28,35,51,.14),0 30px 60px -20px rgba(28,35,51,.28)}
.app-frame__bar{display:flex;align-items:center;gap:7px;height:36px;padding:0 14px;background:#ECEFF5;border-bottom:1px solid rgba(28,35,51,.10)}
.app-frame__bar i{width:10px;height:10px;border-radius:50%;background:#FF5F57}
.app-frame__bar i:nth-child(2){background:#FEBC2E}.app-frame__bar i:nth-child(3){background:#28C840}
.app-frame__bar span{margin:0 auto;transform:translateX(-24px);font:500 12px var(--body);color:#5B6475;background:#fff;border:1px solid rgba(28,35,51,.10);border-radius:7px;padding:3px 14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:60%}
.app-frame img{display:block;width:100%;height:auto}
.app-hero .app-stage{transform:perspective(1600px) rotateY(-5deg) rotateX(2deg);transform-origin:left center}
@media (max-width:900px){.app-hero .app-stage{transform:none;padding:12px;border-radius:18px}}

.tour{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:40px;align-items:start}
.tour__list{display:flex;flex-direction:column;gap:8px}
.tour__tab{display:flex;align-items:flex-start;gap:14px;width:100%;text-align:left;padding:14px 16px;border-radius:16px;border:1px solid transparent;background:transparent;color:var(--encre);font:inherit;cursor:pointer;transition:background .2s,border-color .2s,box-shadow .2s}
.tour__tab:hover{background:rgba(255,255,255,.55)}
.tour__tab[aria-selected="true"]{background:var(--blanc);border-color:var(--filet);box-shadow:0 8px 22px -10px rgba(26,23,20,.25)}
.tour__tab:focus-visible{outline:3px solid var(--braise);outline-offset:2px}
.tour__ic{flex-shrink:0;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--papier);border:1px solid var(--filet);transition:background .2s,border-color .2s}
.tour__ic svg{width:20px;height:20px;fill:none;stroke:var(--encre-douce);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.tour__tab[aria-selected="true"] .tour__ic{background:var(--braise);border-color:var(--braise)}
.tour__tab[aria-selected="true"] .tour__ic svg{stroke:#fff}
.tour__lbl{display:flex;flex-direction:column;gap:4px;min-width:0}
.tour__lbl b{font:700 16px var(--body)}
.tour__lbl small{font-size:14px;line-height:1.45;color:var(--encre-douce)}
.tour__tab[aria-selected="false"] .tour__lbl small{display:none}
.tour__stage{position:sticky;top:96px;min-width:0}
.tour__panel{animation:tour-in .35s ease}
@keyframes tour-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.tour__cap{display:none}
.tour__note{margin-top:12px;text-align:right;font-size:13px;color:var(--encre-douce)}
@media (max-width:900px){
  .tour{grid-template-columns:minmax(0,1fr);gap:16px}
  .tour__list{flex-direction:row;overflow-x:auto;gap:8px;padding-bottom:6px;scrollbar-width:none}
  .tour__list::-webkit-scrollbar{display:none}
  .tour__tab{width:auto;flex-shrink:0;align-items:center;padding:8px 14px 8px 8px;border-radius:999px;border-color:var(--filet);background:var(--blanc)}
  .tour__tab[aria-selected="true"]{background:var(--charbon);border-color:var(--charbon);color:var(--papier)}
  .tour__ic{width:30px;height:30px;border-radius:50%}
  .tour__ic svg{width:16px;height:16px}
  .tour__lbl small{display:none!important}
  .tour__lbl b{font-size:14px;white-space:nowrap}
  .tour__stage{position:static}
  .tour__cap{display:block;margin-bottom:14px;color:var(--encre-douce)}
  .tour__cap b{color:var(--encre)}
}
@media (prefers-reduced-motion:reduce){.tour__panel{animation:none}.app-hero .app-stage{transform:none}}

.demo-band{display:flex;flex-direction:column;align-items:flex-start;gap:36px}
.demo-band__txt{max-width:640px;min-width:0}
.app-stage--doc{padding:0;overflow:hidden}
.app-stage--doc img{display:block;width:100%;height:auto}
fieldset.field{border:0;padding:0;margin:0;min-width:0}
fieldset.field legend{padding:0;margin-bottom:8px;font-weight:600;font-size:15px}
fieldset.field.invalid .chip span{border-color:#E3A497}
/* Formulaire en étapes (candidature) */
.fprog{margin-bottom:22px}
.fprog__bar{height:6px;border-radius:99px;background:var(--papier-2);overflow:hidden}
.fprog__bar i{display:block;height:100%;width:33.34%;border-radius:99px;background:linear-gradient(90deg,#E8641B,#FFB547);transition:width .4s ease}
.fprog__lbl{margin-top:10px;font-size:14px;color:var(--encre-douce)}
.fprog__lbl b{color:var(--encre)}
.fstep{display:flex;flex-direction:column;gap:inherit}
.fstep[hidden]{display:none!important}
.fstep__nav{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:6px}
.btn--ghost-dark{background:transparent;color:var(--encre);border:1.5px solid var(--filet-2);box-shadow:none}
.btn--ghost-dark:hover{background:var(--papier);color:var(--encre);border-color:var(--encre);box-shadow:none}
@media (prefers-reduced-motion:reduce){.fprog__bar i{transition:none}}
.form .fstep__nav .btn{flex:1 1 auto;width:auto}
.form .fstep__nav [data-prev]{flex:0 0 auto;padding-left:22px;padding-right:22px}
.fstep__nav>span:empty{display:none}
.test-q{padding-top:clamp(120px,14vw,170px)}.test-q__h1{font-size:clamp(34px,5vw,52px);line-height:1.05;margin:8px 0 18px}.test-q .form>.btn{margin-top:8px}
@media (min-width:900px){.test-q .split>div:first-child{position:sticky;top:130px}}
.legal h3{font-size:17px;font-weight:700;margin:22px 0 8px}
/* Réalisations */
.case{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:56px;align-items:center}
.case__intro h2{margin:6px 0 10px}
.case__meta{list-style:none;padding:0;margin:24px 0 28px;display:flex;flex-direction:column;gap:12px}
.case__meta li{display:flex;flex-direction:column;gap:2px;padding-left:14px;border-left:3px solid var(--braise);font-size:16px;color:var(--encre)}
.case__meta span{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--braise-texte,#A9420B)}
.case__link{display:inline-flex;align-items:center;gap:8px;width:auto}
.case__steps{margin-top:56px}
.case__steps h3{margin-bottom:10px}
.ba__title{margin:72px 0 24px;font-size:clamp(22px,2.4vw,28px)}
.ba-row{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:40px;align-items:center;margin-bottom:48px}
.ba-copy h4{font-size:20px;font-weight:700;margin-bottom:14px}
.ba-copy p{margin-bottom:12px;padding:14px 16px;border-radius:12px;font-size:15px;line-height:1.55}

.ba-copy b{display:block;font-size:12px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:4px}
.ba-copy__before{background:#EFE9E0;color:#5C564F}
.ba-copy__after{background:#FBEFE6;color:#1A1714;border-left:3px solid var(--braise)}
.ba-copy__after b{color:#A9420B}
.ba__tag{position:absolute;top:12px;left:12px;z-index:3;padding:5px 12px;border-radius:999px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:#1A1714;color:#F6F1E9;pointer-events:none}
.ba__tag--after{background:var(--braise);color:#1A1714}
.cmp{position:relative;aspect-ratio:16/10;overflow:hidden;border-radius:14px;border:1px solid var(--filet);box-shadow:0 18px 44px rgba(26,23,20,.14);background:#fff;touch-action:pan-y}
.cmp__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top left;display:block}
.cmp__before{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--pos)) 0 0);z-index:1}
.cmp__line{position:absolute;top:0;bottom:0;left:var(--pos);width:3px;margin-left:-1.5px;background:var(--braise);z-index:2;pointer-events:none}
.cmp__line i{position:absolute;top:50%;left:50%;width:42px;height:42px;margin:-21px 0 0 -21px;border-radius:50%;background:var(--braise);box-shadow:0 0 0 4px rgba(255,255,255,.85),0 6px 18px rgba(0,0,0,.25)}
.cmp__line i::before{content:"\2039\00a0\203A";position:absolute;inset:0;display:grid;place-items:center;color:#1A1714;font:700 20px/1 sans-serif}
.cmp__tag--l{left:12px}.cmp__tag--r{left:auto;right:12px}
.cmp__range{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;z-index:4}
.cmp__range:focus-visible+*,.cmp:focus-within{outline:2px solid var(--braise);outline-offset:3px}
.ba__hint{margin-top:10px;font-size:13px;color:#8A8178}
.ba-pair{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.ba__item{position:relative;margin:0;aspect-ratio:16/10;overflow:hidden;border-radius:14px;border:1px solid var(--filet);box-shadow:0 14px 36px rgba(26,23,20,.10);background:#fff}
.ba__item img{width:100%;height:100%;object-fit:cover;object-position:left top;display:block}
.proj{gap:32px}
.proj__card .app-stage{margin-bottom:22px}
.proj__card h3{margin:4px 0 8px}
.proj__card p{color:var(--douce,#5C564F)}
.proj__card .link{display:inline-block;margin-top:10px}
.proj__card .app-frame img{aspect-ratio:16/10;object-fit:cover;object-position:top}
@media (max-width:900px){.case{grid-template-columns:1fr;gap:32px}.ba-row{grid-template-columns:1fr;gap:20px}}
@media (max-width:560px){.ba-pair{grid-template-columns:1fr}}

/* planning : étude de cas en onglets */
.cs{margin-top:88px;text-align:center}
.cs__eyebrow{display:inline-flex;align-items:center;gap:18px;font:600 13px/1 var(--body);letter-spacing:.2em;text-transform:uppercase;color:var(--braise-texte);margin-bottom:18px}
.cs__eyebrow::before,.cs__eyebrow::after{content:"";width:44px;height:1px;background:currentColor;opacity:.6}
.cs__title{font-family:var(--display);font-weight:800;font-size:clamp(30px,4.4vw,52px);line-height:1.08;letter-spacing:-.02em;margin-bottom:12px}
.cs__sub{font-size:clamp(16px,1.6vw,20px);color:var(--encre-douce);margin-bottom:36px}
.cs__tabs{display:flex;align-items:center;gap:20px;border-bottom:1px solid var(--filet);margin-bottom:36px;text-align:left}
.cs__tablist{flex:1;min-width:0;display:grid;grid-template-columns:repeat(4,1fr)}
.cs__tab{position:relative;display:flex;align-items:baseline;gap:12px;padding:16px 8px 18px;border:0;background:none;font:500 17px/1.2 var(--body);color:var(--encre-douce);cursor:pointer;text-align:left;transition:color .3s}
.cs__tab span{font-size:14px;color:#9A9189;transition:color .3s}
.cs__tab i{position:absolute;left:0;bottom:-1px;height:3px;width:0;border-radius:2px;background:var(--braise)}
.cs__tab:hover{color:var(--encre)}
.cs__tab.is-on{color:var(--encre);font-weight:700}
.cs__tab.is-on span{color:var(--braise-texte);font-weight:700;font-size:18px}
.cs__tab.is-on i{width:100%}
.cs.is-auto .cs__tab.is-on i{width:0;animation:df-csbar 6.5s linear forwards}
.cs.is-paused .cs__tab.is-on i{animation-play-state:paused}
@keyframes df-csbar{to{width:100%}}
.cs__pause{flex-shrink:0;display:flex;align-items:center;gap:10px;border:0;background:none;font:500 14px var(--body);color:var(--encre-douce);cursor:pointer;padding:8px 6px 8px 0}
.cs__pico{position:relative;width:34px;height:34px;border-radius:50%;border:1.5px solid var(--encre)}
.cs__pico::before,.cs__pico::after{content:"";position:absolute;top:10px;width:3px;height:11px;border-radius:1px;background:var(--encre)}
.cs__pico::before{left:11px}.cs__pico::after{left:17px}
.cs.is-paused .cs__pico::before{left:12px;top:9px;width:0;height:0;border-radius:0;background:none;border-style:solid;border-width:7px 0 7px 11px;border-color:transparent transparent transparent var(--encre)}
.cs.is-paused .cs__pico::after{display:none}
.cs__cards{display:grid;grid-template-columns:1fr 1fr;gap:28px;text-align:left}
.cs__card{background:#FBF8F3;border:1px solid var(--filet);border-radius:18px;padding:16px 16px 18px;box-shadow:0 18px 44px rgba(26,23,20,.07)}
.cs__head{display:flex;align-items:center;gap:14px;padding:4px 10px 16px}
.cs__dot{flex-shrink:0;width:14px;height:14px;border-radius:50%;background:#A39B93}
.cs__card--a .cs__dot{background:var(--braise)}
.cs__pill{flex-shrink:0;padding:8px 16px;border-radius:999px;font:700 14px/1 var(--body);letter-spacing:.06em;text-transform:uppercase;background:#ECE6DE;color:#1A1714}
.cs__card--a .cs__pill{background:#F5A06B}
.cs__bar{flex-shrink:0;width:1px;align-self:stretch;margin:4px 2px;background:var(--filet-2)}
.cs__stack{display:grid}
.cs__stack>*{grid-area:1/1}
.cs__head h4{font-family:var(--display);font-weight:700;font-size:clamp(17px,1.8vw,22px);line-height:1.2;margin:0}
.cs__shot{position:relative;aspect-ratio:16/10;border-radius:12px;border:1px solid var(--filet);background:#fff}
.cs__shot img{width:100%;height:100%;object-fit:cover;object-position:left top;display:block;border-radius:11px}
.cs__shot svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.cs__shot line{stroke-width:1.8;vector-effect:non-scaling-stroke;stroke:#1A1714;stroke-dasharray:600;stroke-dashoffset:600;transition:stroke-dashoffset .6s .25s ease,opacity .3s}
.cs__card--a line{stroke:var(--braise)}
.cs__shot line.is-on{stroke-dashoffset:0}
.cs__pt{position:absolute;z-index:2;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:#1A1714;box-shadow:0 0 0 3px #fff,0 2px 8px rgba(0,0,0,.3)}
.cs__card--a .cs__pt{background:var(--braise)}
.cs__bub{position:absolute;z-index:3;display:flex;align-items:center;gap:10px;white-space:nowrap;transform:translate(-50%,-50%) scale(.85);padding:5px 18px 5px 5px;border-radius:999px;font:600 clamp(12px,1.15vw,15px)/1 var(--body);background:#1A1714;color:#F6F1E9;box-shadow:0 10px 26px rgba(26,23,20,.28)}
.cs__bub b{width:clamp(28px,2.8vw,38px);height:clamp(28px,2.8vw,38px);border-radius:50%;display:grid;place-items:center;font:700 clamp(12px,1.2vw,15px)/1 var(--body);background:#1A1714;color:#F6F1E9;box-shadow:0 0 0 2px #F6F1E9}
.cs__card--a .cs__bub{background:var(--braise);color:#fff}
.cs__card--a .cs__bub b{background:var(--braise);color:#fff;box-shadow:0 0 0 2px #fff}
.cs__swap{opacity:0;transition:opacity .35s ease,transform .45s cubic-bezier(.3,1.4,.5,1)}
.cs__swap.is-on{opacity:1}
.cs__bub.is-on{transform:translate(-50%,-50%) scale(1)}
.cs__pt.is-on{animation:df-cspt 2s ease-out .5s infinite}
@keyframes df-cspt{0%{box-shadow:0 0 0 3px #fff,0 0 0 3px rgba(232,100,27,.55)}100%{box-shadow:0 0 0 3px #fff,0 0 0 14px rgba(232,100,27,0)}}
.cs__cap{display:flex;align-items:center;gap:22px;margin-top:16px;padding:20px 24px;border-radius:14px;background:#F1ECE5}
.cs__card--a .cs__cap{background:#FCEADC}
.cs__num b{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;font:700 17px/1 var(--body);background:#1A1714;color:#F6F1E9}
.cs__card--a .cs__num b{background:var(--braise);color:#fff}
.cs__cap p{margin:0;font-size:clamp(15px,1.4vw,18px);line-height:1.45;color:#1A1714}
.cs__cap .cs__stack{align-items:center}
.cs__end{font-family:var(--display);font-weight:800;font-size:clamp(22px,2.6vw,32px);margin-top:44px}
.cs__endsub{color:var(--encre-douce);margin-top:4px}
@media (prefers-reduced-motion:reduce){.cs__swap,.cs__shot line{transition:none}.cs__pt.is-on{animation:none}}
@media (max-width:900px){.cs__cards{grid-template-columns:1fr}.cs__tabs{flex-wrap:wrap;gap:0}.cs__tablist{grid-template-columns:repeat(2,1fr);flex-basis:100%}.cs__pause{margin-left:auto}.cs__tab{font-size:15px;padding:12px 6px 14px}}
@media (max-width:560px){.cs__eyebrow{letter-spacing:.12em;font-size:12px;gap:10px}.cs__eyebrow::before,.cs__eyebrow::after{width:18px}.cs__tab{font-size:14px}.cs__head{flex-wrap:wrap;gap:10px}.cs__head .cs__bar{display:none}.cs__head h4{flex-basis:100%}.cs__cap{gap:14px;padding:16px}.cs__num b{width:38px;height:38px;font-size:15px}.cs__bub{padding-right:12px;gap:7px}}

/* accueil : aperçu réalisation */
.home-real__shot{display:block;border-radius:16px;overflow:hidden;border:1px solid var(--filet);box-shadow:0 22px 50px rgba(26,23,20,.14);transition:transform .35s,box-shadow .35s}
.home-real__shot img{display:block;width:100%;height:auto}
@media (hover:hover){.home-real__shot:hover{transform:translateY(-4px);box-shadow:0 0 0 1px rgba(232,100,27,.5),0 26px 56px rgba(26,23,20,.18)}}

/* cadres épinglés : sur téléphone, le texte de conclusion passe sous la section (sinon il est coupé) */
.pin-after-in{display:flex;flex-direction:column;gap:28px}
.pin-tail{display:none}
@media (max-width:860px){
  .pin-after-in{display:none}
  .pin-tail{display:block;padding:8px 0 72px}
  .pin-tail .lead{margin-bottom:20px}
}
.pin-static .pin-after-in{display:none}
.pin-static .pin-tail{display:block;padding:0 0 72px}