/*
Theme Name: Elia Tellure — Le manuscrit
Theme URI: https://www.eliatellure.fr/
Author: Maquette de refonte
Description: Theme sur mesure pour eliatellure.fr. Portraits au graphite et temoignages. Deux fonds (ivoire, anthracite), deux typographies, capture d'e-mail comme action unique.
Version: 1.4
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: elia-tellure
*/


/* =====================================================================
   ELIA TELLURE — LE MANUSCRIT
   Concept : le site est un livre en train de s'écrire. Papier ivoire,
   encre anthracite, annotations au crayon qui se tracent à la lecture.
   Les images sortent de leurs cadres. Les chapitres sont numérotés.
   L'actualité est un carnet ; la newsletter, une correspondance.
   ===================================================================== */
:root{
  --papier:#F4F0E8; --papier-2:#ECE6DA; --craie:#FBF9F5;
  --encre:#17150F; --encre-2:#211E17;
  --graphite:#55504A; --mine:#8C867B; --ligne:#D9D2C3; --ligne-n:#33302A;
  --rouge:#A63D2A; --rouge-2:#8C3220;
  --serif:"Newsreader",Georgia,serif;
  --mono:"Courier Prime",ui-monospace,monospace;
  --main:"Caveat",cursive;
  --mx:clamp(20px,4.6vw,72px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--papier);color:#2E2B25;font-family:var(--serif);font-weight:400;font-size:18px;line-height:1.75;-webkit-font-smoothing:antialiased;overflow-x:hidden}
::selection{background:var(--encre);color:var(--craie)}
a{color:inherit}
img{display:block;max-width:100%;height:auto}
.wrap>*{min-width:0}
button{font:inherit;color:inherit;cursor:pointer}
[hidden]{display:none!important}

/* ---------- chrome de démo ---------- */
.site{container-type:inline-size;position:relative;background:var(--papier);width:100%}

/* grain papier */
.site::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:700;opacity:.22;mix-blend-mode:multiply;
background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='190' height='190'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3'/><feColorMatrix type='saturate' values='0'/></filter><rect width='190' height='190' filter='url(%23n)' opacity='.26'/></svg>")}

/* ---------- titre courant + folio, comme un livre ---------- */
.entete{position:fixed;top:0;left:0;right:0;z-index:540;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:13px var(--mx);background:rgba(244,240,232,.93);backdrop-filter:blur(10px);border-bottom:1px solid var(--ligne)}
.entete .marque{font-family:var(--main);font-size:26px;color:var(--encre);text-decoration:none;line-height:1;display:flex;align-items:baseline;gap:12px}
.entete .role{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:#7A7468;display:none}
@container (min-width:600px){.entete .role{display:inline}}
.entete .liens{display:none;gap:24px;font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase}
.entete .liens a{text-decoration:none;color:#4A453E;padding:6px 0;border-bottom:1px solid transparent}
.entete .liens a:hover{color:var(--encre);border-bottom-color:var(--encre)}
@container (min-width:880px){.entete .liens{display:flex}}
.folio{position:fixed;left:16px;bottom:16px;z-index:530;font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;color:#4A453E;background:rgba(251,249,245,.94);border:1px solid var(--ligne);padding:5px 11px;pointer-events:none}

/* ---------- nav ---------- */

/* ---------- tampon rotatif ---------- */
.tampon{position:fixed;right:20px;bottom:20px;z-index:540;width:96px;height:96px;text-decoration:none;transform:translateY(140px);transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.tampon.la{transform:none}
.tampon svg{width:100%;height:100%;animation:tourne 22s linear infinite}
@keyframes tourne{to{transform:rotate(360deg)}}
.tampon text{font-family:var(--mono);font-size:11.4px;letter-spacing:.18em;text-transform:uppercase;fill:var(--craie)}
.tampon .fondc{fill:var(--encre)}
.tampon .fleche{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:26px;color:var(--craie)}

/* ---------- conversion ---------- */
.form.claire input{border-color:#B9B1A2;color:var(--encre);background:var(--craie)}
.form.claire input::placeholder{color:#8A8478}
.form.claire input:focus-visible{outline-color:var(--encre)}
.sous-form{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:14px;font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:#7A7468}
.sous-form span::before{content:"✓";font-family:var(--main);font-size:15px;margin-right:7px;color:#4A453E}
.lien-doux{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:#7A7468;text-decoration:none;border-bottom:1px solid var(--ligne);padding-bottom:2px}
.lien-doux:hover{color:var(--encre);border-color:var(--encre)}
.gains{list-style:none;margin:18px 0 4px;padding:0;display:grid;gap:9px}
.gains li{display:flex;gap:12px;align-items:baseline;font-size:15.5px;color:#3E3A33}
.sombrec .gains li{color:#DAD4C9}
.gains li::before{content:"✓";font-family:var(--main);font-size:19px;color:#7A7468;flex:none}
.sombrec .gains li::before{color:#B5AFA3}
.gains b{font-family:var(--mono);font-weight:700;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:#55504A;margin-right:6px}
.sombrec .gains b{color:#948E82}
.merci{border:1px dashed currentColor;padding:22px 24px;max-width:480px}
.merci .ok{font-family:var(--main);font-size:30px;line-height:1;display:block;margin-bottom:8px}
.merci b{font-family:var(--mono);font-size:12.5px;letter-spacing:.1em;text-transform:uppercase}
.merci p{margin:8px 0 0;font-size:15px}
.entete .btn{padding:9px 15px;font-size:11px;white-space:nowrap;display:none}
@container (min-width:760px){.entete .btn{display:inline-flex}}
.barrec{position:fixed;left:0;right:0;bottom:0;z-index:560;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:var(--encre);color:var(--craie);transform:translateY(110%);transition:transform .4s cubic-bezier(.2,.7,.2,1);box-shadow:0 -14px 40px rgba(0,0,0,.28)}
.barrec.la{transform:none}
.barrec .t{font-size:14.5px;line-height:1.3}
.barrec .t small{display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:#948E82}
.barrec .btn{background:var(--craie);color:var(--encre);border-color:var(--craie);padding:11px 18px;min-height:0;font-size:11.5px;white-space:nowrap}
@container (min-width:760px){.barrec{display:none}}
.tampon{display:none}
@container (min-width:760px){.tampon{display:block}}
@container (max-width:759px){.folio{bottom:78px}}

/* ---------- sur commande ---------- */
.commande{border-top:1px solid var(--ligne)}
.grille-cmd{display:grid;gap:44px;align-items:start;position:relative;z-index:2}
@container (min-width:860px){.grille-cmd{grid-template-columns:1.1fr .9fr;gap:80px}}
.etapes-cmd{margin-top:clamp(34px,4.5vh,54px);border-bottom:1px solid var(--ligne)}
.etape-cmd{display:grid;grid-template-columns:52px 1fr;gap:20px;align-items:baseline;border-top:1px solid var(--ligne);padding:16px 0}
@container (min-width:760px){.etape-cmd{grid-template-columns:52px minmax(0,42ch) 1fr;padding:18px 0}}
.etape-cmd b{font-family:var(--mono);font-weight:700;font-size:12px;letter-spacing:.1em;color:var(--rouge);flex:none}
.etape-cmd span{font-size:16px;line-height:1.6}

/* ---------- déjà paru ---------- */
.paru{display:grid;gap:28px;align-items:start;margin-top:clamp(36px,4.5vh,56px);padding-top:26px;border-top:1px solid var(--ligne);position:relative;z-index:2}
.sombrec .paru{border-top-color:var(--ligne-n)}
@container (min-width:900px){.paru{grid-template-columns:180px minmax(0,1.15fr) minmax(200px,.55fr);gap:52px;align-items:center}}
.paru-couv{margin:0;justify-self:start}
.paru-couv img{width:min(190px,52cqw);box-shadow:0 18px 44px rgba(23,21,15,.22);transform:rotate(-1.4deg)}
.paru-texte h3{margin:8px 0 14px}
.paru-texte p{font-size:16px;max-width:46ch;margin:0 0 .9em}
.paru-note{font-family:var(--mono);font-size:12px;line-height:1.7;color:#7A7468}
.sombrec .paru-note{color:#948E82}
.paru-auto{margin:0;text-align:center}
.paru-auto img{width:min(150px,44cqw);border-radius:50%;filter:grayscale(1);margin:0 auto;background:var(--craie)}
.paru-auto figcaption{margin-top:12px;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:#7A7468;line-height:1.6}
.sombrec .paru-auto figcaption{color:#948E82}

/* ---------- les remises ---------- */
.terrain{margin-top:40px}
.terrain-grille{display:grid;gap:24px}
@container (min-width:900px){.terrain-grille{grid-template-columns:1fr 1fr;gap:34px}}
.cliche{margin:0;background:var(--craie);padding:12px 12px 0;box-shadow:0 20px 50px rgba(23,21,15,.14);transform:rotate(-.7deg)}
.cliche:nth-child(2){transform:rotate(.8deg)}
.cliche img{width:100%;aspect-ratio:5/4;max-height:400px;object-fit:cover;object-position:center 28%}
.cliche figcaption{padding:14px 4px 16px;font-size:13.5px;line-height:1.55;color:#55504A}

@media (prefers-reduced-motion:reduce){.tampon svg{animation:none}}

/* ---------- annotations au crayon ---------- */
.annot{font-family:var(--main);font-size:clamp(21px,2.3cqw,26px);color:#4A453E;line-height:1.3;transform:rotate(-2deg);display:inline-block}
.crayon{stroke:var(--graphite);fill:none;stroke-width:2;stroke-linecap:round}
.trace{stroke-dasharray:900;stroke-dashoffset:900}
.vu .trace,.vu.trace{animation:tracer 1.2s .35s cubic-bezier(.3,.6,.3,1) forwards}
@keyframes tracer{to{stroke-dashoffset:0}}
.entoure{position:relative;white-space:nowrap}
.entoure svg{position:absolute;inset:-14% -7%;width:114%;height:130%;overflow:visible;pointer-events:none}
.souligne{position:relative;white-space:nowrap}
.souligne svg{position:absolute;left:-2%;bottom:-.14em;width:104%;height:.32em;overflow:visible;pointer-events:none}
.rature{position:relative;white-space:nowrap;color:var(--mine)}
.rature svg{position:absolute;left:-3%;top:46%;width:106%;height:.3em;overflow:visible;pointer-events:none}

/* ---------- typo ---------- */
.mono{font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:#7A7468}
h1,h2{font-weight:300;letter-spacing:-.014em;margin:0;color:var(--encre)}
.titan{font-size:clamp(38px,7.4cqw,92px);line-height:1.06}
h2{font-size:clamp(30px,5cqw,56px);line-height:1.12;max-width:none;text-wrap:balance}
/* dans les colonnes étroites, le titre garde un cadre lisible */
.autrice .grille h2,.recueilc .grille h2,.grille-cmd h2{max-width:18ch}
h3{font-weight:400;font-size:clamp(20px,2.4cqw,26px);margin:0;color:var(--encre)}
.lede{font-size:clamp(18px,2.2cqw,22px);line-height:1.68;color:#2E2B25;text-wrap:pretty}
.pmono{font-family:var(--mono);font-size:13.5px;letter-spacing:.02em;line-height:1.8;color:var(--graphite);text-transform:none}
.it{font-style:italic;font-weight:200}
.sig{font-family:var(--main);line-height:1}

/* ---------- apparitions ---------- */
.app{opacity:0;transform:translateY(30px);transition:opacity .85s cubic-bezier(.2,.6,.2,1),transform .85s cubic-bezier(.2,.6,.2,1)}
.app.vu{opacity:1;transform:none}
.app.d1{transition-delay:.12s}.app.d2{transition-delay:.24s}.app.d3{transition-delay:.36s}

/* ---------- chapitres ---------- */
.chap{position:relative;padding:clamp(58px,7.5vh,92px) var(--mx)}
.wrap{max-width:1240px;margin:0 auto;position:relative}
.chap .wrap{z-index:2}
.ombre{background:var(--papier-2)}
.sombrec{background:var(--encre);color:#C9C3B7}
.sombrec h2,.sombrec h3{color:var(--craie)}
.sombrec .lede{color:#DAD4C9}
.sombrec .mono{color:#948E82}
.sombrec .pmono{color:#A6A095}
.sombrec .numero{-webkit-text-stroke-color:var(--ligne-n)}
.sombrec .annot{color:#B5AFA3}
.sombrec .crayon{stroke:#A29C90}
/* intitulé de chapitre : discret — c'est le fond qui sépare */
.chap-tete{display:flex;align-items:baseline;gap:16px;margin-bottom:clamp(20px,3vh,32px)}
.chap-tete .mono::before{content:"";display:inline-block;width:30px;height:1px;background:currentColor;opacity:.6;vertical-align:middle;margin-right:12px}

/* ---------- bord déchiré ---------- */

/* =========================== COUVERTURE =========================== */
.couv{min-height:auto;position:relative;display:flex;flex-direction:column;justify-content:center;padding:110px var(--mx) 40px;overflow:visible}
.couv .grille{display:grid;gap:32px;max-width:1050px;margin:0 auto;width:100%;align-items:center}
@container (min-width:860px){.couv .grille{grid-template-columns:auto auto;justify-content:center;gap:48px;align-items:center}}
.couv h1{position:relative;z-index:3;max-width:19ch}
.couv .lede{max-width:40ch;margin-top:22px}
.couv .actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:38px}
.btn{display:inline-flex;align-items:center;gap:12px;white-space:nowrap;background:var(--encre);color:var(--craie);border:1px solid var(--encre);padding:16px 26px;font-family:var(--mono);font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;transition:transform .2s,box-shadow .2s}
.btn:hover{transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--mine)}
.btn:focus-visible,a:focus-visible,input:focus-visible,button:focus-visible{outline:2px solid currentColor;outline-offset:3px}
/* CTA principal : rouge correcteur, ombre portée franche, léger désaxage crayonné */
.btn.action{background:var(--rouge);border-color:var(--rouge);color:#FBF9F5;box-shadow:4px 4px 0 rgba(23,21,15,.85);transform:rotate(-.4deg)}
.btn.action:hover{background:var(--rouge-2);transform:rotate(-.4deg) translate(-2px,-2px);box-shadow:6px 6px 0 rgba(23,21,15,.85)}
.sombrec .btn.action{background:var(--rouge);color:#FBF9F5;border-color:var(--rouge);box-shadow:4px 4px 0 rgba(95, 90, 90, 0.5)}
/* CTA secondaire : contour rouge, plus discret en milieu de tunnel */
.btn.action.creux{background:transparent;color:var(--rouge);border-color:var(--rouge);box-shadow:none;transform:none}
.btn.action.creux:hover{background:rgba(166,61,42,.08);transform:translate(-2px,-2px);box-shadow:4px 4px 0 rgba(166,61,42,.25)}
.sombrec .btn.action.creux{color:#E08A72;border-color:#B85B44}
/* pastille d'urgence */
.urgence{display:inline-flex;align-items:baseline;gap:8px;font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--rouge);border:1px solid rgba(166,61,42,.5);padding:6px 12px;margin:0 0 16px}
.sombrec .urgence{color:#E08A72;border-color:rgba(224,138,114,.4)}
.urgence b{font-family:var(--serif);font-weight:400;font-size:17px;line-height:1}

.btn.creux{background:transparent;color:var(--encre);border-color:var(--encre)}
.sombrec .btn{background:var(--craie);color:var(--encre);border-color:var(--craie)}
.sombrec .btn.creux{background:none;color:var(--craie);border-color:#57534B}

/* l'image sort du cadre */
.horscadre{position:relative;justify-self:start;width:360px;max-width:100%;max-height:50svh}
.horscadre .cadre{position:absolute;inset:9% -6% -6% 8%;border:1.5px solid var(--encre);z-index:1}
.horscadre .cadre::after{content:"L'HOMME DE L'OMBRE";position:absolute;bottom:-28px;left:0;font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;color:#7A7468}
.horscadre img{position:relative;z-index:2;width:100%;max-height:50svh;object-fit:contain;object-position:top;filter:grayscale(1) contrast(1.06);
  -webkit-mask-image:linear-gradient(to bottom,#000 82%,transparent 100%);
  mask-image:linear-gradient(to bottom,#000 82%,transparent 100%)}

/* =========================== CH. I — L'ŒUVRE =========================== */
.planche{display:grid;gap:16px;position:relative;z-index:2}
@container (min-width:820px){
  .planche{grid-template-columns:repeat(12,1fr);gap:18px;align-items:start}
  .planche .p1{grid-column:1/5;  grid-row:1; transform:rotate(-1deg)}
  .planche .p2{grid-column:5/13; grid-row:1; transform:rotate(.6deg) translateY(12px);align-self:center}
  .planche .p3{grid-column:1/4;  grid-row:2; transform:rotate(-.6deg) translateY(16px)}
  .planche .p4{grid-column:4/7;  grid-row:2; transform:rotate(1deg)}
  .planche .p6{grid-column:7/10; grid-row:2; transform:rotate(-.8deg) translateY(14px)}
  .planche .p5{grid-column:10/13;grid-row:2; transform:rotate(.8deg) translateY(2px)}
}
.oeuvrec{position:relative;background:var(--craie);padding:9px 9px 32px;box-shadow:0 16px 40px rgba(23,21,15,.14)}
.oeuvrec::before,.oeuvrec::after{content:"";position:absolute;width:0;height:0;border:12px solid transparent;z-index:3}
.oeuvrec::before{top:-2px;left:-2px;border-top-color:var(--encre);border-left-color:var(--encre)}
.oeuvrec::after{bottom:-2px;right:-2px;border-bottom-color:var(--encre);border-right-color:var(--encre)}
.oeuvrec img{width:100%;aspect-ratio:4/5;max-height:min(52svh,520px);object-fit:cover;filter:grayscale(1) contrast(1.05)}
.oeuvrec.paysage img{aspect-ratio:16/10;max-height:min(46svh,430px)}
.oeuvrec.p2 img{object-position:top center}
.oeuvrec figcaption{position:absolute;left:12px;right:12px;bottom:9px;display:flex;justify-content:space-between;gap:10px;font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:#7A7468}
.oeuvrec .croquis{position:absolute;inset:12px 12px 46px;display:flex;align-items:center;justify-content:center;background:repeating-linear-gradient(-48deg,transparent 0 9px,rgba(23,21,15,.05) 9px 10px),var(--papier-2)}
.oeuvrec .croquis span{font-family:var(--main);font-size:21px;color:var(--mine);transform:rotate(-3deg);text-align:center;max-width:16ch}

/* =========================== CH. II — LES VOIX =========================== */
.voixc blockquote{margin:0 auto;font-weight:300;font-style:italic;font-size:clamp(21px,3.1cqw,37px);line-height:1.38;
  color:#E7E1D7;max-width:28ch;position:relative;z-index:2;text-wrap:balance;text-align:center;padding-top:34px}
.voixc blockquote::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);
  width:46px;height:1px;background:#57534B}
@container (min-width:760px){.voixc blockquote{max-width:32ch}}
.voixc .attrib{margin-top:16px;text-align:center}
.marge{border-left:1px solid var(--ligne-n);padding-left:26px;margin-top:26px;max-width:none}
@container (min-width:900px){.marge{columns:2;column-gap:56px;padding-left:30px}}
.marge p{font-size:16.5px;line-height:1.75;color:#BEB8AC;margin:0}

/* frères d'armes : pleine largeur qui casse le chapitre */
.pleine{margin:clamp(38px,5vh,62px) calc(var(--mx)*-1) 0;position:relative;overflow:hidden}
.pleine img{width:100%;height:clamp(300px,42svh,420px);object-fit:cover;object-position:center 28%;filter:grayscale(1) contrast(1.06);will-change:transform}
.pleine .voile{position:absolute;inset:0;background:linear-gradient(to bottom,var(--encre) 0%,rgba(23,21,15,.06) 30%,rgba(23,21,15,.12) 62%,var(--encre) 100%)}
.pleine .leg{position:absolute;left:var(--mx);right:var(--mx);bottom:26px;display:flex;justify-content:space-between;gap:16px;font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:#B9B2A6}

/* =========================== CH. III — L'AUTRICE =========================== */
.autrice .grille{display:grid;gap:56px;align-items:start;position:relative;z-index:2}
@container (min-width:820px){.autrice .grille{grid-template-columns:minmax(300px,.85fr) 1.15fr;gap:64px;align-items:center}}
.polar{position:relative;transform:rotate(-1.8deg);max-width:400px;width:100%;justify-self:start}
.polar .cadre{position:relative;background:#fff;padding:13px 13px 52px;box-shadow:0 30px 70px rgba(23,21,15,.2)}
.polar .cadre img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center 22%}
.polar img{width:100%}
.polar .cadre .sig{position:absolute;right:26px;bottom:14px;font-size:32px;color:#2A2722}
.polar .scotch{position:absolute;top:-14px;left:50%;transform:translateX(-50%) rotate(-2deg);width:110px;height:30px;background:rgba(23,21,15,.08);border:1px solid rgba(23,21,15,.06)}
.polar-cta{margin-top:26px;display:flex;justify-content:center;transform:rotate(1.8deg)}
.autrice .deux{columns:1;gap:44px}
@container (min-width:980px){.autrice .deux{columns:2}}
.autrice .deux p{break-inside:avoid;margin:0 0 1.2em;font-size:17px;line-height:1.75}
.autrice .deux p:first-child::first-letter{font-size:64px;line-height:.8;float:left;padding:8px 10px 0 0;color:var(--encre);font-weight:200}
.autrice.sombrec .deux p:first-child::first-letter{color:var(--craie)}
.repere{display:flex;gap:16px;align-items:baseline;border-top:1px solid var(--ligne);padding:12px 0;font-size:16px}
.sombrec .repere{border-top-color:var(--ligne-n)}
.repere b{font-family:var(--mono);font-weight:700;font-size:12px;letter-spacing:.12em;color:#55504A;min-width:64px}
.sombrec .repere b{color:#A6A095}

/* =========================== CH. IV — LE RECUEIL =========================== */
#recueil{padding-top:clamp(44px,5.5vh,68px);padding-bottom:clamp(44px,5.5vh,68px)}
#recueil .chap-tete{margin-bottom:clamp(14px,2vh,22px)}
#recueil .lede{margin-top:14px!important;font-size:clamp(17px,1.9cqw,19.5px);line-height:1.55}
#recueil .compte{margin:18px 0 0;gap:22px}
#recueil .compte b{font-size:clamp(30px,3.2cqw,42px)}
#recueil .gains{margin:16px 0 0;gap:7px}
#recueil .gains li{font-size:14.5px;line-height:1.45}
#recueil .form{margin-top:18px}
#recueil .form input,#recueil .form .btn{min-height:50px}
#recueil .mention{margin-top:10px;font-size:11.5px;line-height:1.7;max-width:none}
.mention .preuve{font-weight:700;color:var(--encre);letter-spacing:.08em}
.sombrec .mention .preuve{color:var(--craie)}
.tag-dev{display:inline-block;margin-left:7px;padding:1px 5px;border:1px dashed currentColor;border-radius:2px;font-weight:400;font-size:9px;letter-spacing:.1em;opacity:.6}
#recueil .livre .obj{width:min(440px,95%)}
.recueilc .grille{display:grid;gap:48px;align-items:center;position:relative;z-index:2}
@container (min-width:900px){.recueilc .grille{grid-template-columns:.8fr 1.2fr;gap:64px}}
.livre{perspective:1500px;display:flex;justify-content:center}
.livre .obj{width:min(300px,80%);transform:rotateY(-15deg) rotateX(4deg);box-shadow:30px 40px 70px rgba(0,0,0,.55),0 2px 0 #060605;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.livre:hover .obj{transform:rotateY(-7deg) rotateX(2deg)}
.compte{display:flex;gap:26px;margin:22px 0 4px}
.compte b{display:block;font-weight:200;font-size:clamp(36px,4.2cqw,56px);line-height:1;color:var(--encre)}
.sombrec .compte b{color:var(--craie)}
.compte span{font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:#7A7468}
.sombrec .compte span{color:#948E82}
.form{display:flex;flex-direction:column;gap:10px;margin-top:26px;max-width:480px}
.form{align-items:stretch}
.form input{font-family:var(--mono);font-size:14px;padding:0 18px;min-height:56px;border:1px solid var(--ligne);background:var(--craie);color:var(--encre)}
.form .btn{min-height:56px;padding-top:0;padding-bottom:0;justify-content:center}
.form input::placeholder{color:#8A8478}
.form input:focus-visible{outline:2px solid var(--encre);outline-offset:2px}
.sombrec .form input,footer .form input{border-color:#57534B;background:transparent;color:var(--craie)}
.sombrec .form input:focus-visible,footer .form input:focus-visible{outline-color:var(--craie)}
.form input:focus-visible{outline:2px solid var(--craie);outline-offset:2px}
@container (min-width:560px){.form{flex-direction:row}.form input{flex:1}}
.mention{font-family:var(--mono);font-size:12px;line-height:1.7;color:#7A7468;margin-top:12px;max-width:52ch}
.sombrec .mention{color:#948E82}

/* =========================== LE CARNET (actualité) =========================== */
.carnet .flux{display:grid;gap:0;border-top:1px solid var(--ligne);position:relative;z-index:2}
.entree{display:grid;gap:8px;padding:20px 0;border-bottom:1px solid var(--ligne);text-decoration:none;transition:background .2s;position:relative}
@container (min-width:760px){.entree{grid-template-columns:150px 1fr auto;gap:34px;align-items:baseline}}
.entree:hover{background:rgba(23,21,15,.03)}
.entree .date{font-family:var(--mono);font-size:12px;letter-spacing:.1em;color:#7A7468}
.entree h3{transition:transform .25s}
.entree:hover h3{transform:translateX(8px)}
.entree p{margin:6px 0 0;font-size:15.5px;line-height:1.65;color:#55504A;max-width:64ch}
.entree .fl{font-size:22px;color:var(--mine);justify-self:end;align-self:center}
.badge{display:inline-block;font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;border:1px solid var(--encre);color:var(--encre);padding:3px 8px;margin-left:12px;vertical-align:middle}
.agenda{margin-top:44px}
.agenda .lignes{display:grid;gap:0;border-top:1px solid var(--ligne)}
.rdv{display:flex;align-items:baseline;gap:22px;padding:16px 0;border-bottom:1px solid var(--ligne)}
.rdv .jour{font-weight:200;font-size:clamp(30px,4cqw,44px);color:var(--encre);min-width:96px;line-height:1}
.rdv .jour small{display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--mine);margin-top:4px}
.rdv .quoi{flex:1;font-size:16.5px;color:#3E3A33}
.rdv .ou{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#7A7468}

/* =========================== LA CORRESPONDANCE =========================== */
.lettre{max-width:660px;margin:0 auto;background:var(--craie);border:1px solid var(--ligne);padding:clamp(26px,3.6cqw,42px);box-shadow:0 30px 70px rgba(23,21,15,.14);transform:rotate(-.5deg);position:relative;z-index:2}
.lettre::before{content:"";position:absolute;top:-12px;left:50%;transform:translateX(-50%) rotate(1.6deg);width:120px;height:28px;background:rgba(23,21,15,.07);border:1px solid rgba(23,21,15,.05)}
.lettre .pmono{margin:0 0 20px}
.lettre p{font-size:17px;margin:0 0 1.1em}
.lettre .form input{border-color:var(--ligne);color:var(--encre)}
.lettre .form input::placeholder{color:var(--mine)}
.lettre .form input:focus-visible{outline-color:var(--encre)}
.lettre .mention{color:#7A7468;font-size:11.5px;margin-top:24px}
.lettre .sig{font-size:36px;color:var(--encre);margin-top:18px;display:inline-block;transform:rotate(-3deg)}

/* =========================== COLOPHON =========================== */
footer{background:var(--encre);color:#8D877D;padding:52px var(--mx) 34px}
footer .haut{display:grid;gap:40px;max-width:1240px;margin:0 auto}
@container (min-width:760px){footer .haut{grid-template-columns:1.4fr 1fr 1fr}}
footer .sig{font-size:36px;color:var(--craie)}
footer a{text-decoration:none;color:#C3BDB1;display:block;padding:6px 0;font-size:15px}
footer a:hover{color:var(--craie)}
footer .mono{color:#7C766C}
footer .bas{max-width:1240px;margin:34px auto 0;padding-top:18px;border-top:1px solid var(--ligne-n);display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:#847E72}


/* ---------- conversion ---------- */
.form.claire input{border-color:#B9B1A2;color:var(--encre);background:var(--craie)}
.form.claire input::placeholder{color:#8A8478}
.form.claire input:focus-visible{outline-color:var(--encre)}
.sous-form{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:14px;font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:#7A7468}
.sous-form span::before{content:"✓";font-family:var(--main);font-size:15px;margin-right:7px;color:#4A453E}
.lien-doux{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:#7A7468;text-decoration:none;border-bottom:1px solid var(--ligne);padding-bottom:2px}
.lien-doux:hover{color:var(--encre);border-color:var(--encre)}
/* appel plein cadre : centré, sur toute la largeur du chapitre */
.fiche{border:1px solid #3B3830;background:rgba(251,249,245,.035);
  padding:clamp(30px,4cqw,52px) clamp(22px,3cqw,44px);
  margin:clamp(30px,4vh,48px) auto 0;max-width:none;width:100%;text-align:center}
.fiche .mono{margin-bottom:14px}
.fiche p{font-size:clamp(17px,1.9cqw,20px);line-height:1.6;color:#DAD4C9;margin:0 auto;max-width:58ch}
.fiche .form{margin:26px auto 0;max-width:580px;width:100%}
.gains{list-style:none;margin:18px 0 4px;padding:0;display:grid;gap:9px}
.gains li{display:flex;gap:12px;align-items:baseline;font-size:15.5px;color:#3E3A33}
.sombrec .gains li{color:#DAD4C9}
.gains li::before{content:"✓";font-family:var(--main);font-size:19px;color:#7A7468;flex:none}
.sombrec .gains li::before{color:#B5AFA3}
.gains b{font-family:var(--mono);font-weight:700;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:#55504A;margin-right:6px}
.sombrec .gains b{color:#948E82}
.merci{border:1px dashed currentColor;padding:22px 24px;max-width:480px}
.merci .ok{font-family:var(--main);font-size:30px;line-height:1;display:block;margin-bottom:8px}
.merci b{font-family:var(--mono);font-size:12.5px;letter-spacing:.1em;text-transform:uppercase}
.merci p{margin:8px 0 0;font-size:15px}
.entete .btn{padding:9px 15px;font-size:11px;white-space:nowrap;display:none}
@container (min-width:760px){.entete .btn{display:inline-flex}}
.barrec{position:fixed;left:0;right:0;bottom:0;z-index:560;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:var(--encre);color:var(--craie);transform:translateY(110%);transition:transform .4s cubic-bezier(.2,.7,.2,1);box-shadow:0 -14px 40px rgba(0,0,0,.28)}
.barrec.la{transform:none}
.barrec .t{font-size:14.5px;line-height:1.3}
.barrec .t small{display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:#948E82}
.barrec .btn{background:var(--craie);color:var(--encre);border-color:var(--craie);padding:11px 18px;min-height:0;font-size:11.5px;white-space:nowrap}
@container (min-width:760px){.barrec{display:none}}
.tampon{display:none}
@container (min-width:760px){.tampon{display:block}}
@container (max-width:759px){.folio{bottom:78px}}

/* ---------- sur commande ---------- */
.commande{border-top:1px solid var(--ligne)}
.grille-cmd{display:grid;gap:44px;align-items:start;position:relative;z-index:2}
@container (min-width:860px){.grille-cmd{grid-template-columns:1.1fr .9fr;gap:80px}}
.etapes-cmd{margin-top:clamp(34px,4.5vh,54px);border-bottom:1px solid var(--ligne)}
.etape-cmd{display:grid;grid-template-columns:52px 1fr;gap:20px;align-items:baseline;border-top:1px solid var(--ligne);padding:16px 0}
@container (min-width:760px){.etape-cmd{grid-template-columns:52px minmax(0,42ch) 1fr;padding:18px 0}}
.etape-cmd b{font-family:var(--mono);font-weight:700;font-size:12px;letter-spacing:.1em;color:var(--rouge);flex:none}
.etape-cmd span{font-size:16px;line-height:1.6}

/* pied de planche : une seule ligne — la phrase, puis l'action */
.planche-fin{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:14px 28px;
  margin-top:clamp(34px,4.5vh,52px);padding-top:22px;border-top:1px solid var(--ligne)}
.planche-fin p{margin:0;font-size:16px;line-height:1.5;color:#55504A}
.planche-fin p b{font-weight:400;color:var(--encre)}
.planche-fin .btn{margin-left:auto}

/* ---------- déjà paru ---------- */
.paru{display:grid;gap:28px;align-items:start;margin-top:clamp(36px,4.5vh,56px);padding-top:26px;border-top:1px solid var(--ligne);position:relative;z-index:2}
.sombrec .paru{border-top-color:var(--ligne-n)}
@container (min-width:900px){.paru{grid-template-columns:180px minmax(0,1.15fr) minmax(200px,.55fr);gap:52px;align-items:center}}
.paru-couv{margin:0;justify-self:start}
.paru-couv img{width:min(190px,52cqw);box-shadow:0 18px 44px rgba(23,21,15,.22);transform:rotate(-1.4deg)}
.paru-texte h3{margin:8px 0 14px}
.paru-texte p{font-size:16px;max-width:46ch;margin:0 0 .9em}
.paru-note{font-family:var(--mono);font-size:12px;line-height:1.7;color:#7A7468}
.sombrec .paru-note{color:#948E82}
.paru-auto{margin:0;text-align:center}
.paru-auto img{width:min(150px,44cqw);border-radius:50%;filter:grayscale(1);margin:0 auto;background:var(--craie)}
.paru-auto figcaption{margin-top:12px;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:#7A7468;line-height:1.6}
.sombrec .paru-auto figcaption{color:#948E82}

/* ---------- les remises ---------- */
.terrain{margin-top:40px}
.terrain-grille{display:grid;gap:24px}
@container (min-width:900px){.terrain-grille{grid-template-columns:1fr 1fr;gap:34px}}
.cliche{margin:0;background:var(--craie);padding:12px 12px 0;box-shadow:0 20px 50px rgba(23,21,15,.14);transform:rotate(-.7deg)}
.cliche:nth-child(2){transform:rotate(.8deg)}
.cliche img{width:100%;aspect-ratio:5/4;max-height:400px;object-fit:cover;object-position:center 28%}
.cliche figcaption{padding:14px 4px 16px;font-size:13.5px;line-height:1.55;color:#55504A}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .app{opacity:1;transform:none}
  .trace{stroke-dashoffset:0}
}


/* =====================================================================
   Compléments WordPress
   ===================================================================== */

/* Libellés réservés aux lecteurs d'écran */
.ecran-lecteur{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.ecran-lecteur:focus{position:fixed!important;top:8px;left:8px;width:auto;height:auto;clip:auto;z-index:999;
  background:var(--encre);color:var(--craie);padding:12px 18px;font-family:var(--mono);font-size:12px}

/* Corps de texte des articles et pages */
.corps{font-size:17px;line-height:1.75}
.corps p{margin:0 0 1.2em}
.corps h2{font-size:clamp(24px,3.4cqw,34px);margin:1.6em 0 .5em}
.corps h3{margin:1.4em 0 .4em}
.corps ul,.corps ol{margin:0 0 1.2em;padding-left:1.3em}
.corps li{margin-bottom:.5em}
.corps a{color:var(--rouge);text-decoration:none;border-bottom:1px solid rgba(166,61,42,.4)}
.corps a:hover{border-bottom-color:var(--rouge)}
.corps blockquote{margin:1.6em 0;padding-left:24px;border-left:2px solid var(--ligne);font-style:italic;color:#55504A}
.corps img,.corps .wp-block-image img{max-width:100%;height:auto}
.corps figcaption,.wp-element-caption{font-family:var(--mono);font-size:11.5px;color:#7A7468;margin-top:8px}
.sombrec .corps a{color:#E08A72;border-bottom-color:rgba(224,138,114,.4)}

/* Alignements natifs de l'éditeur */
.alignleft{float:left;margin:0 1.6em 1em 0}
.alignright{float:right;margin:0 0 1em 1.6em}
.aligncenter{margin-left:auto;margin-right:auto;display:block}
.alignwide{width:min(1100px,100%);margin-left:auto;margin-right:auto}
.alignfull{width:100vw;max-width:100vw;margin-left:calc(50% - 50vw)}

/* Pagination */
.nav-links{display:flex;flex-wrap:wrap;gap:10px;font-family:var(--mono);font-size:12px;letter-spacing:.1em}
.nav-links .page-numbers{padding:9px 14px;border:1px solid var(--ligne);text-decoration:none;color:#55504A}
.nav-links .page-numbers.current,.nav-links .page-numbers:hover{background:var(--encre);color:var(--craie);border-color:var(--encre)}

/* Formulaire fourni par une extension d'emailing */
.form-emailing{margin-top:24px}
.form-emailing input[type=email],.form-emailing input[type=text]{font-family:var(--mono);font-size:14px;padding:0 18px;min-height:56px;
  border:1px solid var(--ligne);background:var(--craie);color:var(--encre);width:100%;max-width:340px}
.form-emailing input[type=submit],.form-emailing button{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;
  background:var(--rouge);color:#FBF9F5;border:1px solid var(--rouge);padding:16px 26px;min-height:56px;cursor:pointer;
  font-family:var(--mono);font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;box-shadow:4px 4px 0 rgba(23,21,15,.85)}
.sombrec .form-emailing input[type=email],.sombrec .form-emailing input[type=text],
footer .form-emailing input[type=email],footer .form-emailing input[type=text]{border-color:#57534B;background:transparent;color:var(--craie)}

/* Barre d'administration */
.admin-bar .entete{top:32px}
@media screen and (max-width:782px){.admin-bar .entete{top:46px}}