/* Carnet de bord : mur de 5 polaroïds avec ruban, citation, léger décalage au défilement (carnet.js).
   Bloc autonome (ses propres couleurs), utilisé sur CSE, Noël, Team building et Nos ateliers. */
.cdc-carnet{--cacao:#15100E; --torrefie:#2A211D; --blanc:#FFFFFF; --texte:#4A4340; --cuivre-f:#7A5229; --papier:#F2F0EB;
  --radius:var(--cdc-radius,10px); --radius-in:var(--cdc-radius-in,4px); --f:"Hanken Grotesk",system-ui,-apple-system,"Segoe UI",sans-serif;
  background:var(--blanc);color:var(--texte);font:400 17px/1.6 var(--f);overflow:hidden}
.cdc-carnet *{box-sizing:border-box}
.cdc-carnet .souv{padding-block:clamp(64px,9vw,120px)}
.cdc-carnet .in{max-width:1240px;margin:0 auto;padding-inline:clamp(16px,4vw,56px)}
.cdc-carnet h2{color:var(--cacao);font-weight:600;margin:0;letter-spacing:-.02em;line-height:1.06;text-wrap:balance;font-size:clamp(30px,4vw,52px)}
.cdc-carnet p{margin:0}
.cdc-carnet .eti{font:600 12px var(--f);letter-spacing:.14em;text-transform:uppercase;color:var(--cuivre-f)}
.cdc-carnet .tete{display:flex;justify-content:space-between;align-items:end;gap:16px 40px;flex-wrap:wrap;margin-bottom:clamp(28px,4vw,48px)}
.cdc-carnet .tete>div{display:grid;gap:12px;max-width:58ch}
.cdc-carnet .tete p{font-size:18px}
.cdc-carnet .btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 24px;border-radius:var(--radius);font:600 16px var(--f);text-decoration:none;background:var(--cacao);color:var(--papier);white-space:nowrap;transition:transform .25s,box-shadow .25s}
.cdc-carnet .btn:hover{transform:translateY(-2px);box-shadow:0 10px 24px -12px rgba(21,16,14,.5);color:var(--papier)}
.cdc-carnet .btn:focus-visible{outline:2px solid #D9B27C;outline-offset:3px}
.cdc-carnet .mur{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(14px,2vw,26px);align-items:start}
.cdc-carnet .pola{background:var(--blanc);padding:12px 12px 14px;border-radius:var(--radius);box-shadow:0 26px 50px -30px rgba(21,16,14,.55);transform:translateY(var(--py,0px)) rotate(var(--rot,0deg));transition:box-shadow .4s,transform .6s cubic-bezier(.2,.8,.2,1);position:relative;margin:0}
.cdc-carnet .pola:hover{box-shadow:0 34px 60px -28px rgba(21,16,14,.6)}
.cdc-carnet .pola .ph{border-radius:var(--radius-in);background:var(--torrefie);aspect-ratio:var(--ar,4/3);overflow:hidden}
.cdc-carnet .pola .ph img{width:100%;height:100%;object-fit:cover;display:block;max-width:none;border-radius:0}
.cdc-carnet .pola figcaption{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-top:12px;font-size:15px;line-height:1.35;color:var(--cacao);font-weight:600}
.cdc-carnet .pola figcaption small{font:600 12px var(--f);letter-spacing:.12em;text-transform:uppercase;color:var(--cuivre-f);white-space:nowrap}
.cdc-carnet .pola::before{content:"";position:absolute;z-index:1;left:50%;top:-10px;width:76px;height:22px;transform:translateX(-50%) rotate(-3deg);background:rgba(217,178,124,.55);border-radius:2px}
.cdc-carnet .pola.p1{grid-column:1/6;grid-row:1;--ar:4/5;--rot:-2deg}
.cdc-carnet .pola.p2{grid-column:6/10;grid-row:1;--ar:1/1;--rot:1.5deg;margin-top:48px}
.cdc-carnet .pola.p3{grid-column:10/13;grid-row:1;--ar:3/4;--rot:-1deg;margin-top:8px}
.cdc-carnet .pola.p4{grid-column:6/13;grid-row:2;--ar:21/9;--rot:1deg;margin-top:40px}
.cdc-carnet .pola.p5{grid-column:3/11;grid-row:3;--ar:21/9;--rot:-1.2deg;margin-top:48px}
.cdc-carnet .cit{grid-column:1/6;grid-row:2;align-self:center;max-width:20ch;font-size:clamp(22px,2.4vw,32px);line-height:1.25;color:var(--cacao);font-weight:500;margin:40px 0 0 clamp(8px,2vw,32px)}
.cdc-carnet .cit span{display:block;margin-top:10px;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--cuivre-f);font-weight:600}
@media (max-width:900px){
  .cdc-carnet .mur{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:28px}
  .cdc-carnet .pola.p1,.cdc-carnet .pola.p2,.cdc-carnet .pola.p3,.cdc-carnet .pola.p4,.cdc-carnet .pola.p5{grid-column:auto;grid-row:auto;margin-top:0;--ar:4/5;--py:0px}
  .cdc-carnet .pola.p1{grid-column:1/-1;--ar:3/2}
  .cdc-carnet .cit{grid-column:1/-1;grid-row:auto;margin:16px 0 0;max-width:none;text-align:center;justify-self:center}
}
@media (max-width:560px){
  .cdc-carnet .pola{padding:8px 8px 10px}
  .cdc-carnet .pola figcaption{flex-direction:column;gap:2px;font-size:14px}
  .cdc-carnet .pola::before{width:54px;height:16px}
  .cdc-carnet .btn{white-space:normal;text-align:center}
}
@media (prefers-reduced-motion:reduce){.cdc-carnet .pola{--py:0px!important;transition:none}}