/* Concept : l'atelier de composition. Bandes raphia (papier) et indigo (encre), objets imprimés dessinés en typographie qui flottent en parallaxe, catalogue de cartes encochées comme des caractères en plomb, fil de couture qui se tire au défilement. Univers clair unique, volontaire : c'est la marque. */
:root{
  --raphia:#EEE6D4; --papier:#F7F3EA; --pierre:#D8CDB6; --indigo:#1E2350; --nuit:#12142F;
  --encre:#16171F; --graphite:#5E5A52; --cuivre:#B4693A; --cuivre-clair:#D08A55;
  --display:"Newsreader","Iowan Old Style","Palatino Linotype",Georgia,serif;
  --sans:"Schibsted Grotesk","Helvetica Neue",Arial,sans-serif;
  --mono:"Martian Mono",ui-monospace,"SFMono-Regular",Menlo,monospace;
  --ease:cubic-bezier(.16,1,.3,1);
  --gl:max(16px,env(safe-area-inset-left,0px)); --gr:max(16px,env(safe-area-inset-right,0px));
  color-scheme:light;
}
@media (min-width:900px){:root{--gl:max(40px,env(safe-area-inset-left,0px));--gr:max(40px,env(safe-area-inset-right,0px))}}
*,*::before,*::after{box-sizing:border-box}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{margin:0;background:var(--raphia);color:var(--encre);font:400 17px/1.6 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:clip}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--raphia)}
h1,h2,h3,h4{font-family:var(--display);font-weight:300;margin:0;text-wrap:balance;letter-spacing:-.015em}
p{margin:0}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--cuivre);outline-offset:3px;border-radius:2px}
::selection{background:var(--indigo);color:var(--raphia)}
.in{padding-left:var(--gl);padding-right:var(--gr)}
.wrap{max-width:1280px;margin:0 auto}
.label{font:400 11px/1.4 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--graphite)}
.ink{background:var(--indigo);color:var(--raphia)}
.ink .label{color:var(--pierre)}
.stitch{display:block;height:0;border:0;border-top:1.5px dashed var(--pierre);margin:0}
.ink .stitch{border-top-color:rgba(238,230,212,.25)}
.btn{display:inline-flex;align-items:center;gap:12px;height:52px;padding:0 24px;border-radius:999px;background:var(--indigo);color:var(--raphia);font-weight:500;font-size:15px;position:relative;overflow:hidden;transition:transform .5s var(--ease)}
.btn::after{content:"";width:9px;height:9px;border-radius:50%;background:var(--cuivre-clair);transition:transform .5s var(--ease)}
.btn:hover::after{transform:scale(1.8)}
.btn.light{background:var(--raphia);color:var(--indigo)}
.btn.line{background:transparent;color:var(--indigo);box-shadow:inset 0 0 0 1.5px var(--indigo)}
.btn.line::after{background:var(--cuivre)}

/* en-tête */
.bar{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:rgba(238,230,212,.86);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid transparent;transition:border-color .3s}
.bar.scrolled{border-bottom-color:var(--pierre)}
.bar .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;height:68px}
.brand svg{height:26px;width:auto;display:block}
.nav{display:none;gap:28px;font-size:14px}
.nav a{position:relative;padding:6px 0}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;border-top:1.5px dashed var(--indigo);transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease)}
.nav a:hover::after{transform:scaleX(1)}
.bar .btn{height:42px;padding:0 18px;font-size:14px}
@media (min-width:980px){.nav{display:flex}}

/* hero */
.hero{position:relative;overflow:hidden}
.hero .wrap{display:grid;gap:28px;padding-block:clamp(36px,6vw,72px) clamp(56px,8vw,110px);position:relative}
.hero-grid{display:grid;gap:20px;align-items:center}
@media (min-width:1000px){.hero-grid{grid-template-columns:1.05fr 1fr}.hero-grid>.table{align-self:start;margin-top:12px}}
.kicker{display:flex;gap:10px;align-items:center}
.kicker i{width:9px;height:9px;background:var(--cuivre);display:block}
.h-hero{font-size:clamp(52px,9.6vw,148px);line-height:.9;letter-spacing:-.035em;color:var(--indigo)}
.h-hero .w{display:inline-block;overflow:hidden;vertical-align:top;padding:.16em .1em .1em;margin:-.16em -.1em -.1em}
.h-hero.done .w{overflow:visible}
.h-hero .w>span{display:inline-block}
.h-hero em{font-style:italic}
.hero-lede{font-size:clamp(17px,1.5vw,20px);color:var(--graphite);max-width:44ch}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px}
.proofs{display:grid;grid-template-columns:repeat(3,auto);gap:10px 28px;justify-content:start;font:400 11px/1.5 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--indigo)}
.proofs span{display:flex;gap:8px;align-items:baseline}
.proofs b{color:var(--cuivre);font-weight:400}
@media (max-width:560px){.proofs{grid-template-columns:1fr}}

/* objets imprimés dessinés en typographie */
.table{position:relative;height:clamp(420px,62vw,640px);perspective:1400px}
.obj{position:absolute;border-radius:3px;will-change:transform}
.obj .face{position:relative;width:100%;height:100%;border-radius:3px;overflow:hidden}
.shadow{box-shadow:0 1px 1px rgba(22,23,31,.08),0 18px 40px -12px rgba(30,35,80,.35),0 40px 80px -30px rgba(30,35,80,.3)}
.o-livret{width:44%;aspect-ratio:148/210;left:6%;top:6%;rotate:-6deg}
.o-livret .face{background:var(--indigo);color:var(--raphia);display:grid;grid-template-rows:auto 1fr auto;padding:9% 9% 8%}
.o-livret .face::before{content:"";position:absolute;inset:4.5%;border:1px dashed rgba(238,230,212,.35);border-radius:2px;pointer-events:none}
.o-livret small{font:300 clamp(7px,.9vw,10px)/1.4 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--pierre);text-align:center}
.o-livret .por{align-self:center;justify-self:center;width:62%;aspect-ratio:3/4;border-radius:50% 50% 4px 4px;background:repeating-linear-gradient(135deg,rgba(238,230,212,.07) 0 6px,transparent 6px 12px),linear-gradient(#2A3066,#151838);box-shadow:inset 0 0 0 1px rgba(238,230,212,.25);display:grid;place-items:end center;padding-bottom:8%}
.o-livret .por span{font:300 clamp(6px,.7vw,8px)/1 var(--mono);letter-spacing:.14em;color:rgba(238,230,212,.5);text-transform:uppercase}
.o-livret h4{font-size:clamp(17px,2.4vw,30px);line-height:1;text-align:center;font-weight:300}
.o-livret h4 em{display:block;font-style:italic;color:var(--cuivre-clair);font-size:.62em;margin-bottom:.25em}
.o-livret .dates{font:300 clamp(7px,.85vw,10px)/1 var(--mono);letter-spacing:.2em;text-align:center;margin-top:.8em;color:var(--pierre)}
.o-fairepart{width:38%;aspect-ratio:5/7;right:4%;top:2%;rotate:5deg}
.o-fairepart .face{background:var(--papier);display:grid;align-content:center;justify-items:center;gap:6%;padding:10%;text-align:center;color:var(--indigo)}
.o-fairepart .face::after{content:"";position:absolute;right:-1px;top:58%;width:22px;height:22px;border-radius:50%;background:var(--raphia);transform:translate(50%,-50%)}
.o-kamdem{width:46%;aspect-ratio:3/4}
.o-kamdem .face{padding:0;background:#1B2550;display:block}
.o-kamdem .face::before{content:none}
.o-kamdem img{display:block;width:100%;height:100%;object-fit:cover}
.o-std{aspect-ratio:4/5;width:41%;border-radius:4px}
.o-std .face{padding:0;background:#E9DCC6!important;border-radius:4px}
.o-std .face::after{content:none}
/* Objets réels : épaisseur du papier, ombre de contact, ombre portée, reflet */
.o-kamdem.shadow,.o-std.shadow{box-shadow:.6px .8px 0 #DCD2BE,1.4px 1.8px 0 #BFB29A,2px 3px 1.5px rgba(40,30,20,.4),2px 6px 6px rgba(28,22,16,.28),8px 18px 26px -6px rgba(28,24,30,.34),22px 40px 60px -20px rgba(30,35,80,.32)}
.o-kamdem .face::after,.o-std .face::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(128deg,rgba(255,250,235,.16),rgba(255,250,235,0) 38%,rgba(0,0,0,0) 62%,rgba(20,15,10,.14)),radial-gradient(120% 90% at 18% 10%,rgba(255,255,255,.07),transparent 60%)}
.o-std img{display:block;width:100%;height:100%;object-fit:cover}
.o-fairepart small{font:300 clamp(6px,.75vw,9px)/1.5 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--graphite)}
.o-fairepart h4{font-size:clamp(20px,3vw,40px);line-height:.95;font-weight:300}
.o-fairepart h4 em{font-style:italic;display:block;font-size:.5em;color:var(--cuivre);margin-block:.35em}
.o-fairepart hr{width:30%;border:0;border-top:1px dashed var(--pierre);margin:0}
.o-livre{width:30%;aspect-ratio:2/3;left:38%;bottom:4%;rotate:-2deg}
.o-rapport{width:41%;aspect-ratio:1000/1111;left:21%;bottom:-2%;border-radius:0;z-index:3}
.o-carte{z-index:4}
.o-rapport img{display:block;width:115%;max-width:none;height:auto;margin:-2.5% 0 0 -2.5%}
.o-livre .face{background:#E2D7BF;display:grid;grid-template-rows:1fr auto;padding:12% 11%;color:var(--encre)}
.o-livre .face::before{content:"";position:absolute;left:0;top:0;bottom:0;width:7%;background:linear-gradient(90deg,rgba(22,23,31,.18),transparent)}
.o-livre h4{font-size:clamp(16px,2.1vw,28px);line-height:1;font-weight:300}
.o-livre h4 em{font-style:italic}
.o-livre p{font:300 clamp(6px,.75vw,9px)/1.5 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--graphite)}
.o-livre .rule{width:40%;height:2px;background:var(--cuivre);margin:14% 0}
.o-carte{width:34%;aspect-ratio:85/55;right:8%;bottom:10%;rotate:8deg}
.o-carte .face{background:var(--indigo);display:grid;place-items:center}
.o-carte svg{width:58%;height:auto}
.o-cartes{width:42%;aspect-ratio:1255/1145;right:0;bottom:3%;border-radius:0}
.o-cartes img{display:block;width:100%;height:100%}
.o-sort{width:6.5%;aspect-ratio:1/3.2;left:2%;bottom:6%;rotate:14deg;container-type:inline-size;box-shadow:none!important;filter:drop-shadow(.8px 1.2px .5px rgba(35,16,4,.7)) drop-shadow(3px 7px 5px rgba(28,18,10,.38)) drop-shadow(10px 20px 20px rgba(30,35,80,.28))}
.o-sort .face{border-radius:1.5px;overflow:visible;-webkit-mask:radial-gradient(circle 30cqw at 100% 58%,transparent 98%,#000 100%);mask:radial-gradient(circle 30cqw at 100% 58%,transparent 98%,#000 100%);background:radial-gradient(circle 33cqw at 100% 58%,rgba(45,22,8,.6) 88%,rgba(45,22,8,0) 100%),linear-gradient(180deg,rgba(60,30,14,.55),rgba(60,30,14,.15) 4%,rgba(0,0,0,0) 7%,rgba(0,0,0,0) 97%,rgba(40,20,8,.35)),repeating-linear-gradient(90deg,rgba(255,236,214,.06) 0 .5px,rgba(0,0,0,0) .5px 2.6px),repeating-linear-gradient(35deg,rgba(255,240,220,.06) 0 .5px,rgba(0,0,0,0) .5px 9px),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .2 0 0 0 0 .1 0 0 0 0 .05 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E") 0 0/60px 60px,linear-gradient(90deg,#5A2C14 0%,#97522A 9%,#D98E5C 20%,#FFD0AC 27%,#F0AE80 31%,#B9693A 42%,#9C5429 60%,#C9804F 76%,#E7A378 82%,#8A4622 93%,#4E2610 100%);box-shadow:inset 0 0 0 .6px rgba(55,26,10,.55),inset 1px 0 0 rgba(255,220,186,.35)}
.o-sort .face::after{content:none}

.table-note{position:absolute;right:0;bottom:-28px;font:400 10px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--graphite)}

/* défilé */
.ticker{overflow:hidden;padding-block:22px;border-block:1px solid rgba(238,230,212,.12)}
.ticker .track{display:flex;width:max-content;gap:0;will-change:transform}
.ticker span{font:300 clamp(28px,4.4vw,60px)/1 var(--display);white-space:nowrap;display:flex;align-items:center;gap:clamp(20px,3vw,44px);padding-right:clamp(20px,3vw,44px)}
.ticker span em{font-style:italic;color:var(--cuivre-clair)}
.ticker span i{width:14px;height:34px;background:var(--raphia);display:inline-block;-webkit-mask:radial-gradient(circle 5px at 100% 62%,transparent 4.5px,#000 5px);mask:radial-gradient(circle 5px at 100% 62%,transparent 4.5px,#000 5px);opacity:.55}

/* sections */
.sec{padding-block:clamp(72px,11vw,150px)}
.sec-head{display:grid;gap:18px;margin-bottom:clamp(36px,5vw,64px)}
@media (min-width:900px){.sec-head{grid-template-columns:1fr 1.1fr;align-items:end;gap:48px}}
.h2{font-size:clamp(40px,6.4vw,92px);line-height:.94;letter-spacing:-.03em}
.h2 em{font-style:italic}
.sec-head p{font-size:18px;color:var(--graphite);max-width:46ch}
.ink .sec-head p{color:var(--pierre)}

/* univers */
.univers{display:grid;gap:14px}
@media (min-width:760px){.univers{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1100px){.univers{grid-template-columns:repeat(4,1fr)}}
.u{position:relative;border-radius:4px;overflow:hidden;min-height:clamp(340px,40vw,480px);display:grid;align-content:end;padding:22px;color:var(--raphia);text-align:left;isolation:isolate}
.u .ph{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.u:hover .ph{transform:scale(1.05)}
.u::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(18,20,47,0) 34%,rgba(18,20,47,.62) 58%,rgba(18,20,47,.96) 82%)}
.u h3{font-size:clamp(34px,3.4vw,46px);line-height:1}
.u h3 em{font-style:italic}
.u p{font-size:14px;color:var(--pierre);margin-top:8px;max-width:30ch}
.u .meta{display:flex;justify-content:space-between;align-items:center;margin-top:18px;padding-top:14px;border-top:1px dashed rgba(238,230,212,.3);font:400 11px var(--mono);letter-spacing:.1em;text-transform:uppercase}
.u .meta b{font-weight:400;color:var(--cuivre-clair)}
.ph-label{position:absolute;top:16px;left:16px;font:400 9.5px/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:rgba(238,230,212,.6);max-width:24ch}
.ph1{background:repeating-linear-gradient(90deg,rgba(238,230,212,.05) 0 2px,transparent 2px 22px),linear-gradient(160deg,#2A3066,#12142F)}
.ph2{background:radial-gradient(120% 80% at 30% 20%,#3a3f74,transparent 60%),linear-gradient(200deg,#1E2350,#0d0f24)}
.ph3{background:radial-gradient(90% 70% at 70% 30%,#c98b5c55,transparent 60%),linear-gradient(170deg,#5a4a3e,#1d1b26)}
.ph4{background:repeating-linear-gradient(0deg,rgba(238,230,212,.05) 0 1px,transparent 1px 18px),linear-gradient(150deg,#363a5e,#16171F)}

/* catalogue */
.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:28px}
.chip{height:40px;padding:0 18px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--pierre);font-size:14px;display:inline-flex;align-items:center;gap:8px;transition:background .3s,color .3s,box-shadow .3s}
.chip span{font:400 10px var(--mono);color:var(--graphite)}
.chip[aria-pressed="true"]{background:var(--indigo);color:var(--raphia);box-shadow:none}
.chip[aria-pressed="true"] span{color:var(--pierre)}
.cards{display:grid;gap:14px;grid-template-columns:1fr}
@media (min-width:640px){.cards{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1040px){.cards{grid-template-columns:repeat(3,1fr)}}
.card{position:relative;text-align:left;background:var(--papier);border-radius:4px;padding:22px 24px 20px;display:grid;gap:12px;align-content:start;min-height:220px;transition:transform .6s var(--ease),background .4s;-webkit-mask:radial-gradient(circle 13px at 100% 64%,transparent 12.5px,#000 13px);mask:radial-gradient(circle 13px at 100% 64%,transparent 12.5px,#000 13px)}
.card:hover{transform:translateY(-4px);background:#fff}
.card .top{display:flex;justify-content:space-between;gap:12px}
.card .t3{display:block;font-family:var(--display);font-size:clamp(25px,2.2vw,30px);line-height:1.08;font-weight:400;color:var(--indigo)}
.card .d{display:block;font-size:14.5px;color:var(--graphite);line-height:1.5}
.card .foot{margin-top:auto;display:flex;justify-content:space-between;align-items:baseline;padding-top:14px;border-top:1px dashed var(--pierre)}
.card .price{font:400 14px var(--mono);color:var(--cuivre)}
.card .price small{color:var(--graphite);font-size:10px;letter-spacing:.08em;text-transform:uppercase;margin-right:6px}
.card .go{font-size:13px;font-weight:500;color:var(--indigo);display:flex;gap:6px;align-items:center}
.card .go::after{content:"→";transition:transform .4s var(--ease)}
.card:hover .go::after{transform:translateX(4px)}
.card.pack{background:var(--indigo)}
.card.pack .t3{color:var(--raphia)}
.card.pack .d{color:var(--pierre)}
.card.pack .foot{border-top-color:rgba(238,230,212,.25)}
.card.pack .price{color:var(--cuivre-clair)}
.card.pack .go{color:var(--raphia)}
.card.pack .label{color:var(--pierre)}
.card.pack:hover{background:var(--nuit)}
.cat-note{margin-top:22px;font-size:14px;color:var(--graphite)}

/* fiche produit / devis en direct */
.sheet{position:fixed;inset:0;z-index:80;display:grid;align-items:end;justify-items:end;pointer-events:none}
.sheet .veil{position:absolute;inset:0;background:rgba(18,20,47,.55);opacity:0;transition:opacity .45s}
.sheet .panel{position:relative;width:min(560px,100%);max-height:100%;overflow:auto;background:var(--raphia);border-radius:14px 14px 0 0;padding:28px max(22px,env(safe-area-inset-right,0px)) calc(28px + env(safe-area-inset-bottom,0px)) max(22px,env(safe-area-inset-left,0px));transform:translateY(102%);transition:transform .6s var(--ease);display:grid;gap:22px;overscroll-behavior:contain}
@media (min-width:760px){.sheet{align-items:stretch}.sheet .panel{border-radius:0;height:100%;transform:translateX(102%);padding:calc(36px + env(safe-area-inset-top,0px)) max(36px,env(safe-area-inset-right,0px)) 36px 36px}}
.sheet.open{pointer-events:auto}
.sheet.open .veil{opacity:1}
.sheet.open .panel{transform:none}
.x{justify-self:end;width:42px;height:42px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--pierre);display:grid;place-items:center;font-size:18px}
.x:hover{background:var(--papier)}
.sheet h3{font-size:clamp(34px,4vw,46px);line-height:1;color:var(--indigo)}
.sheet .inc{color:var(--graphite);font-size:15px}
.opt{display:grid;gap:10px}
.opt legend{padding:0;margin-bottom:10px}
fieldset{border:0;padding:0;margin:0;min-width:0}
.choice{display:grid;gap:8px}
.choice label{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 16px;border-radius:6px;background:var(--papier);box-shadow:inset 0 0 0 1px transparent;cursor:pointer;transition:box-shadow .25s,background .25s;font-size:15px}
.choice label>span:last-child{font:400 12.5px var(--mono);color:var(--graphite);white-space:nowrap;flex:none}
.choice label .lt{min-width:0}
.choice input{position:absolute;opacity:0;pointer-events:none}
.choice input:checked+label{box-shadow:inset 0 0 0 1.5px var(--indigo);background:#fff}
.choice input:focus-visible+label{outline:2px solid var(--cuivre);outline-offset:2px}
.total{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding-top:18px;border-top:1.5px dashed var(--pierre)}
.total b{font:300 clamp(32px,5vw,46px)/1 var(--display);color:var(--indigo);font-variant-numeric:tabular-nums;white-space:nowrap}
.total b small{font:400 13px var(--mono);color:var(--graphite);margin-left:6px}
.pay{font-size:13.5px;color:var(--graphite)}
.actions{display:grid;gap:10px}
.actions .btn{justify-content:center}
.wa-note{font-size:13px;color:var(--graphite)}
.wa-note code{font-family:var(--mono);color:var(--indigo)}

/* la chaîne */
.chain{position:relative}
.chain-pin{padding-bottom:clamp(72px,10vw,120px)}
.chain-track{display:grid;gap:18px}
.step{position:relative;background:var(--nuit);border-radius:4px;padding:26px 24px;display:grid;gap:12px;align-content:start}
.step .n{font:300 clamp(60px,7vw,96px)/1 var(--display);color:var(--cuivre-clair);font-variant-numeric:tabular-nums}
.step h3{font-size:clamp(26px,2.4vw,32px);line-height:1.05;font-weight:400}
.step p{color:var(--pierre);font-size:15px}
.step .t{font:400 11px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--raphia);padding-top:12px;border-top:1px dashed rgba(238,230,212,.25)}
.step .st-img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:3px;margin-bottom:6px}
.step .st-slot{display:grid;place-items:center;background:repeating-linear-gradient(135deg,rgba(238,230,212,.05) 0 8px,transparent 8px 16px),#1A1D45;box-shadow:inset 0 0 0 1px rgba(238,230,212,.12);display:grid;place-items:center}
.st-slot span{font:300 italic clamp(20px,2vw,26px) var(--display);color:var(--pierre)}
@media (min-width:1000px){.step .st-img{aspect-ratio:16/10}.step .n{font-size:clamp(44px,4.4vw,64px)}.chain-pin{padding-top:68px}}
@media (min-width:1000px) and (max-height:880px){.chain .sec-head{margin-bottom:22px!important}.chain .h2{font-size:clamp(34px,4.4vw,60px)}.chain .sec-head p{font-size:16px}.step{padding:18px 20px;gap:8px}.step .st-img{aspect-ratio:2/1}.step .n{font-size:40px}.step h3{font-size:24px}.step p{font-size:14px}}
.thread{display:none}
@media (min-width:1000px){
  .chain-pin{padding-bottom:0;height:100svh;display:grid;align-content:center;overflow:hidden}
  .chain-track{display:flex;gap:22px;width:max-content;padding-right:8vw}
  .step{width:min(30vw,420px)}
  .thread{display:block;position:absolute;left:0;right:0;top:50%;height:2px;pointer-events:none}
}

/* récit */
.story{position:relative;overflow:hidden}
.story .wrap{display:grid;gap:40px}
@media (min-width:1000px){.story .wrap{grid-template-columns:1fr 1fr;align-items:center;gap:72px}}
.quote{font:300 clamp(36px,5.2vw,74px)/1.02 var(--display);letter-spacing:-.025em}
.quote em{font-style:italic;color:var(--cuivre-clair)}
.story p.body{color:var(--pierre);font-size:18px;max-width:48ch}
.story .src{font:400 11px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--pierre)}
.sorts{position:relative;height:clamp(300px,40vw,520px)}
.sort{position:absolute;border-radius:3px;background:linear-gradient(90deg,#7f4a2b,#C7814F 42%,#E3A06B 50%,#9B5A33);box-shadow:0 30px 60px -20px rgba(0,0,0,.5)}
.sort::after{content:"";position:absolute;right:-22%;top:60%;width:44%;aspect-ratio:1;border-radius:50%;background:var(--indigo);transform:translateY(-50%)}
.sort span{position:absolute;inset:auto 0 8px 0;text-align:center;font:400 12px var(--display);color:rgba(22,23,31,.55)}

/* garanties */
.faq{display:grid;gap:0;border-top:1.5px dashed var(--pierre)}
.faq details{border-bottom:1.5px dashed var(--pierre)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;align-items:center;padding:22px 0;font:300 clamp(22px,2.4vw,30px)/1.2 var(--display);color:var(--indigo)}
.faq summary::-webkit-details-marker{display:none}
.faq summary i{flex:none;width:30px;height:30px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--pierre);position:relative;transition:transform .5s var(--ease)}
.faq summary i::before,.faq summary i::after{content:"";position:absolute;left:50%;top:50%;width:11px;height:1.5px;background:var(--indigo);transform:translate(-50%,-50%)}
.faq summary i::after{transform:translate(-50%,-50%) rotate(90deg)}
.faq details[open] summary i{transform:rotate(45deg)}
.faq .a{padding:0 0 24px;color:var(--graphite);max-width:62ch}
.garanties{display:grid;gap:40px}
@media (min-width:1000px){.garanties{grid-template-columns:.8fr 1.2fr;gap:80px}}
.big3{display:grid;gap:24px;align-content:start}
.big3 div{display:grid;gap:4px}
.big3 b{font:300 clamp(48px,6vw,80px)/1 var(--display);color:var(--indigo);letter-spacing:-.03em}
.big3 b em{font-style:italic;color:var(--cuivre)}
.big3 span{color:var(--graphite);font-size:15px}

/* devis express */
.devis{display:grid;gap:40px}
@media (min-width:1000px){.devis{grid-template-columns:1fr 1.1fr;gap:72px}}
.form{display:grid;gap:16px;background:var(--papier);border-radius:4px;padding:clamp(20px,3vw,34px)}
.field{display:grid;gap:8px}
.field label{font:400 11px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--graphite)}
.field input,.field select,.field textarea{width:100%;min-width:0;background:var(--raphia);border:0;border-radius:6px;padding:14px 14px;font-size:16px;box-shadow:inset 0 0 0 1px transparent;transition:box-shadow .25s}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;box-shadow:inset 0 0 0 1.5px var(--indigo)}
.field textarea{min-height:110px;resize:vertical}
.row2{display:grid;gap:16px}
@media (min-width:560px){.row2{grid-template-columns:1fr 1fr}}
.err{font-size:13px;color:#A23B2A;min-height:0}
.result{display:none;gap:12px;padding:18px;border-radius:6px;background:var(--indigo);color:var(--raphia)}
.result.show{display:grid}
.result pre{margin:0;white-space:pre-wrap;font:400 12.5px/1.6 var(--mono);color:var(--pierre)}
.result .btn{justify-self:start;height:44px}

/* pied */
.foot-big{overflow:hidden}
.foot-big .wrap{padding-block:clamp(64px,9vw,120px) 40px;display:grid;gap:56px}
.foot-logo svg{width:100%;height:auto;display:block}
.foot-cols{display:grid;gap:28px}
@media (min-width:800px){.foot-cols{grid-template-columns:repeat(4,1fr)}}
.foot-cols h4{font:400 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--pierre);margin-bottom:12px}
.foot-cols p,.foot-cols a{color:var(--raphia);font-size:15px;display:block;line-height:1.9}
.foot-cols a:hover{color:var(--cuivre-clair)}
.sign{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;padding-top:24px;border-top:1px dashed rgba(238,230,212,.25);font-size:13px;color:var(--pierre)}
.sign a{color:var(--raphia);text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(238,230,212,.4)}

/* bouton flottant mobile */
.fab{position:fixed;right:calc(14px + env(safe-area-inset-right,0px));bottom:calc(14px + env(safe-area-inset-bottom,0px));z-index:45;height:52px;padding:0 20px;border-radius:999px;background:var(--indigo);color:var(--raphia);font-weight:500;font-size:14px;display:flex;align-items:center;gap:10px;box-shadow:0 12px 30px -10px rgba(18,20,47,.6);transform:translateY(140%);transition:transform .5s var(--ease)}
.fab.show{transform:none}
.fab i{width:8px;height:8px;border-radius:50%;background:var(--cuivre-clair)}
@media (min-width:980px){.fab{display:none}}


.hdr-r{display:flex;align-items:center;gap:12px}
.cta-s{display:none}
@media (max-width:560px){.cta-l{display:none}.cta-s{display:inline}}
.lang{display:flex;height:34px;padding:3px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--pierre)}
.lang button{height:28px;min-width:34px;padding:0 9px;border-radius:999px;font:400 11px var(--mono);letter-spacing:.08em;color:var(--graphite);transition:background .3s,color .3s}
.lang button[aria-pressed="true"]{background:var(--indigo);color:var(--raphia)}
@media (max-width:420px){.bar .btn{padding:0 14px;font-size:13px}.hdr-r{gap:8px}.brand svg{height:22px}}
/* calculateur */
.pbody{display:grid;gap:22px}
.pgal{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px;position:relative;margin-inline:-2px}
.pgal figure{margin:0;flex:0 0 auto;height:220px;border-radius:4px;overflow:hidden;scroll-snap-align:start;background:var(--pierre)}
.pgal img{height:100%;width:auto;display:block}
.pgal-n{position:absolute;left:8px;top:8px;font:400 9.5px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--raphia);background:rgba(18,20,47,.6);padding:5px 9px;border-radius:999px}
.cfg{display:grid;gap:22px}
.choice label .lt{display:grid;gap:2px}
.choice label .lt em{font-style:normal;font-size:12.5px;color:var(--graphite)}
.choice input[type=checkbox]+label{position:relative;padding-left:46px}
.choice input[type=checkbox]+label::before{content:"";position:absolute;left:16px;top:50%;width:18px;height:18px;margin-top:-9px;border-radius:4px;box-shadow:inset 0 0 0 1.5px var(--pierre);background:var(--raphia)}
.choice input[type=checkbox]:checked+label::before{background:var(--indigo) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M4.5 9.5l3 3 6-7' fill='none' stroke='%23EEE6D4' stroke-width='2'/%3E%3C/svg%3E") center/14px no-repeat;box-shadow:none}
.qty{display:grid;grid-template-columns:52px 1fr 52px;gap:8px}
.qty input{min-width:0;text-align:center;border:0;border-radius:6px;background:#fff;font:400 22px var(--mono);color:var(--indigo);box-shadow:inset 0 0 0 1.5px var(--indigo);height:52px}
.qty input:focus{outline:none;box-shadow:inset 0 0 0 2px var(--cuivre)}
.qb{height:52px;border-radius:6px;background:var(--papier);font-size:22px;color:var(--indigo)}
.qb:hover{background:#fff}
.presets{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.pre{height:34px;padding:0 14px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--pierre);font:400 12px var(--mono)}
.pre.on{background:var(--indigo);color:var(--raphia);box-shadow:none}
.hint{font-size:13px;color:var(--cuivre);margin-top:8px;min-height:1em}
.hint.bad{color:#A23B2A}
.breakdown{display:grid;gap:8px;padding-top:16px;border-top:1.5px dashed var(--pierre)}
.breakdown div{display:flex;justify-content:space-between;gap:16px;font-size:14px;color:var(--graphite)}
.breakdown div span:last-child{font-family:var(--mono);font-size:12.5px;white-space:nowrap;color:var(--encre)}
.breakdown .good span{color:#2F6B4F!important}
.breakdown .tip span{color:var(--cuivre)}
.btn.off{opacity:.4;pointer-events:none}
.lines{list-style:none;margin:0;padding:0;display:grid}
.lines li{display:flex;justify-content:space-between;gap:16px;padding:16px 0;border-bottom:1px dashed var(--pierre)}
.ln{display:grid;gap:4px;min-width:0}
.ln b{font:400 21px/1.15 var(--display);color:var(--indigo)}
.ln span{font-size:13px;color:var(--graphite)}
.la{display:flex;gap:16px;margin-top:4px}
.la button{font-size:13px;color:var(--indigo);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--pierre)}
.lp{font:400 13px var(--mono);color:var(--encre);white-space:nowrap;text-align:right;display:grid;align-content:start;gap:4px}
.lp small{font-size:10px;color:var(--cuivre);white-space:normal;max-width:14ch}
.field input#o-name{background:var(--papier)}
.linkback{font-size:14px;color:var(--indigo);text-decoration:underline;text-underline-offset:3px;justify-self:center;padding:8px}
.doc{background:#fff;border-radius:4px;padding:24px 22px;display:grid;gap:16px;box-shadow:0 20px 50px -24px rgba(30,35,80,.35);-webkit-mask:radial-gradient(circle 12px at 100% 22%,transparent 11.5px,#000 12px);mask:radial-gradient(circle 12px at 100% 22%,transparent 11.5px,#000 12px)}
.doc-h{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;padding-bottom:14px;border-bottom:1.5px dashed var(--pierre)}
.doc-h svg{width:120px;height:auto;flex:none}
.doc-h div{display:grid;gap:2px;text-align:right}
.doc-h b{font:400 12.5px var(--mono);color:var(--indigo)}
.doc-h span{font-size:12px;color:var(--graphite)}
.doc-to{font-size:14px;color:var(--encre)}
.doc table{width:100%;border-collapse:collapse;font-size:13.5px}
.doc th{font:400 10px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--graphite);text-align:left;padding:0 0 8px}
.doc th:last-child,.doc td:last-child{text-align:right;white-space:nowrap}
.doc td{padding:10px 0;border-top:1px solid #EFE9DC;vertical-align:top}
.doc td:last-child{font-family:var(--mono);font-size:12.5px;padding-left:12px}
.doc td b{font-weight:500;display:block}
.doc td span{font-size:12px;color:var(--graphite)}
.doc tfoot td{color:var(--graphite)}
.doc tr.tt td{color:var(--indigo);font:400 22px var(--display);border-top:1.5px dashed var(--pierre);padding-top:14px}
.doc tr.tt td:last-child{font:400 16px var(--mono)}
.doc-pay{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.doc-pay div{background:var(--papier);border-radius:4px;padding:12px;display:grid;gap:4px}
.doc-pay span{font-size:11.5px;color:var(--graphite)}
.doc-pay b{font:400 15px var(--mono);color:var(--cuivre)}
.doc-n{font-size:12px;color:var(--graphite)}
.incart{font:400 10px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--cuivre);display:flex;align-items:center;gap:6px}
.incart::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--cuivre)}
.card.pack .incart{color:var(--cuivre-clair)}
.cartbar{position:fixed;left:50%;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:70;transform:translate(-50%,160%);width:min(520px,calc(100% - 32px - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px)));display:flex;justify-content:space-between;align-items:center;gap:14px;height:62px;padding:0 10px 0 22px;border-radius:999px;background:var(--indigo);color:var(--raphia);box-shadow:0 18px 40px -14px rgba(18,20,47,.7);transition:transform .6s var(--ease)}
.cartbar.show{transform:translate(-50%,0)}
.sheet.open~.cartbar{transform:translate(-50%,160%)}
.cb-l{display:flex;align-items:center;gap:10px;font-size:14px}
.cb-l i{width:9px;height:9px;border-radius:50%;background:var(--cuivre-clair)}
.cb-r{display:flex;align-items:center;gap:12px}
.cb-r b{font:400 14px var(--mono)}
.cb-r span{height:44px;padding:0 18px;border-radius:999px;background:var(--raphia);color:var(--indigo);display:flex;align-items:center;font-size:14px;font-weight:500}
@media (max-width:420px){.cb-r span{padding:0 14px}.cb-l{font-size:13px}}
.toast{position:fixed;left:50%;top:calc(84px + env(safe-area-inset-top,0px));z-index:90;transform:translate(-50%,-20px);opacity:0;background:var(--encre);color:var(--raphia);font-size:14px;padding:10px 18px;border-radius:999px;transition:opacity .3s,transform .4s var(--ease);pointer-events:none}
.toast.show{opacity:1;transform:translate(-50%,0)}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.une-band{display:grid;gap:32px;align-items:center;background:var(--papier);border-radius:4px;padding:clamp(28px,5vw,64px);overflow:hidden}
@media (min-width:960px){.une-band{grid-template-columns:1fr 1fr;gap:48px}}
.une-txt{display:grid;gap:20px;align-content:start}
.une-txt .h2 em{font-style:italic;color:var(--cuivre)}
.une-txt p{color:var(--graphite);max-width:46ch}
.une-txt .une-price{font:400 12px var(--mono);letter-spacing:.08em;color:var(--cuivre)}
.une-img img{width:100%;height:auto;max-width:560px;margin-inline:auto;display:block;transition:transform .9s var(--ease)}
.une-img:hover img{transform:rotate(-1.5deg) scale(1.02)}
.une-trio{position:relative;display:block;aspect-ratio:1.08/1;max-width:600px;width:100%;margin-inline:auto}
.une-trio img{position:absolute;max-width:none;height:auto}
.une-trio .t-her{width:calc(45% * 1.1327);left:0;top:14%;margin:calc(-45% * .0218) 0 0 calc(-45% * .0218);transform:rotate(-7deg);transform-origin:44% 43%}
.une-trio .t-adx{width:calc(45% * 1.1327);left:55%;top:10%;margin:calc(-45% * .0218) 0 0 calc(-45% * .0218);transform:rotate(6deg);transform-origin:44% 43%}
.une-trio .t-mat{width:calc(47% * 1.1273);left:26.5%;top:2%;margin:calc(-47% * .0209) 0 0 calc(-47% * .0209);z-index:2}
.une-trio:hover .t-her{transform:rotate(-9deg) translateX(-3%)}
.une-trio:hover .t-adx{transform:rotate(8deg) translateX(3%)}
.une-trio:hover .t-mat{transform:translateY(-2%)}

/* ---------- matière : grain du papier sur le raphia, toile de ndop sur l'indigo ---------- */
body,.sheet .panel{background-image:url(tex-papier.png)}
.card,.form,.une-band,.doc-pay div,.choice label,.qb,.o-fairepart .face{background-image:url(tex-papier.png)}
.ink,.card.pack,.step,.o-livret .face,.o-carte .face,.result{background-image:url(tex-ndop.png)!important}
.form,.une-band{box-shadow:0 1px 0 rgba(94,90,82,.16),0 26px 44px -34px rgba(30,35,80,.5)}
h1,h2,.h2{text-shadow:0 1px 0 rgba(255,255,255,.4)}
.ink h1,.ink h2,.ink .h2,.ink .quote{text-shadow:0 -1px 0 rgba(0,0,0,.35)}

/* ---------- en-tête commun et menu plein écran (téléphone) ---------- */
html[lang="fr"] .en,html[lang="en"] .fr{display:none!important}
.brand img{height:26px;width:auto;display:block}
.nav{display:none;gap:26px;font-size:14px}
.nav a{text-decoration:none;position:relative;padding:6px 0}
.nav a[aria-current="page"]{color:var(--cuivre)}
@media (min-width:1100px){.nav{display:flex}}
.hdr-cta{white-space:nowrap}
.burger{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--pierre);position:relative;flex:none;background:transparent;border:0;cursor:pointer}
.burger i{position:absolute;left:13px;right:13px;height:1.5px;background:var(--indigo);border-radius:2px}
.burger i:first-child{top:18px}.burger i:last-child{top:25px;right:19px}
@media (min-width:1100px){.burger{display:none}}
@media (max-width:640px){.hdr-cta{display:none!important}.brand img{height:23px}}
.menu{position:fixed;inset:0;z-index:90;background:var(--indigo) url(tex-ndop.png);color:var(--raphia);display:flex;flex-direction:column;padding:calc(env(safe-area-inset-top,0px) + 12px) var(--gr) calc(env(safe-area-inset-bottom,0px) + 22px) var(--gl);overflow:auto;opacity:0;visibility:hidden;transition:opacity .4s var(--ease),visibility .4s}
.menu.open{opacity:1;visibility:visible}
html.menu-open,html.menu-open body{overflow:hidden}
.menu-top{display:flex;justify-content:space-between;align-items:center;min-height:56px}
.menu-top img{height:24px;width:auto}
.menu-x{width:44px;height:44px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(238,230,212,.35);color:var(--raphia);font-size:18px;background:transparent;border:0;cursor:pointer}
.menu-nav{display:grid;margin-top:22px;border-top:1px dashed rgba(238,230,212,.25)}
.menu-nav a{display:grid;grid-template-columns:42px 1fr auto;align-items:baseline;gap:6px;padding:15px 0;border-bottom:1px dashed rgba(238,230,212,.25);text-decoration:none;color:var(--raphia);transform:translateY(14px);opacity:0;transition:transform .6s var(--ease),opacity .6s var(--ease)}
.menu.open .menu-nav a{transform:none;opacity:1}
.menu.open .menu-nav a:nth-child(2){transition-delay:.04s}.menu.open .menu-nav a:nth-child(3){transition-delay:.08s}.menu.open .menu-nav a:nth-child(4){transition-delay:.12s}.menu.open .menu-nav a:nth-child(5){transition-delay:.16s}.menu.open .menu-nav a:nth-child(6){transition-delay:.2s}.menu.open .menu-nav a:nth-child(7){transition-delay:.24s}
.menu-nav small{font:400 11px var(--mono);color:var(--cuivre-clair);letter-spacing:.08em}
.menu-nav b{font:300 clamp(30px,8.4vw,46px)/1.05 var(--display);letter-spacing:-.02em;font-weight:300}
.menu-nav b em{font-style:italic}
.menu-nav a>span{font:400 10.5px var(--mono);letter-spacing:.06em;color:var(--pierre);text-transform:uppercase;align-self:center;text-align:right;max-width:16ch}
.menu-nav b span{font:inherit;color:inherit;letter-spacing:inherit;text-transform:none}
@media (max-width:420px){.menu-nav a>span{display:none}}
.menu-nav a[aria-current="page"] b{color:var(--cuivre-clair)}
.menu-foot{margin-top:auto;padding-top:28px;display:grid;gap:14px}
.menu-foot .btn{justify-self:stretch;justify-content:center;background:var(--raphia);color:var(--indigo)}
.menu-foot p{font:400 12px var(--mono);letter-spacing:.06em;color:var(--pierre)}
@media (prefers-reduced-motion:reduce){.menu,.menu-nav a{transition:none}}
/* moyens de paiement */
.pay-logos{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.pay-logos span{height:38px;padding:0 12px;border-radius:8px;background:#fff;display:inline-grid;place-items:center;box-shadow:0 1px 0 rgba(0,0,0,.06)}
.pay-logos img{height:20px;width:auto;display:block}
.pay-logos span.soon{opacity:.55}
.foot-partner{display:grid;gap:10px;padding:22px;border-radius:4px;background:rgba(238,230,212,.06);box-shadow:inset 0 0 0 1px rgba(238,230,212,.18)}
.foot-partner b{font:300 clamp(22px,2.4vw,30px)/1.1 var(--display);font-weight:300;color:var(--raphia)}
.foot-partner p{color:var(--pierre);font-size:14.5px}
.foot-partner a{justify-self:start;color:var(--cuivre-clair);font-weight:500;font-size:14.5px;text-decoration:underline;text-underline-offset:4px}

/* ================= SITE À PLUSIEURS PAGES ================= */
.crumbs{font:400 11px/1.6 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--graphite);display:flex;flex-wrap:wrap;gap:8px}
.crumbs a:hover{color:var(--indigo)}
.lead{font-size:clamp(17px,1.5vw,20px);color:var(--graphite);max-width:50ch}
.ink .lead{color:var(--pierre)}
/* ouverture des pages intérieures */
.phero .wrap{display:grid;gap:clamp(24px,4vw,44px);padding-block:clamp(20px,3vw,40px) clamp(56px,8vw,104px)}
.phero-grid{display:grid;gap:clamp(28px,5vw,64px);align-items:end}
@media (min-width:1000px){.phero-grid{grid-template-columns:1.08fr .92fr}}
.h-page{font-size:clamp(54px,9vw,138px);line-height:.88;letter-spacing:-.045em;color:var(--indigo);font-weight:300}
.h-page em{font-style:italic;color:var(--cuivre)}
.phero figure{margin:0;border-radius:4px;overflow:hidden;position:relative;aspect-ratio:4/5;max-height:640px;background:var(--pierre)}
.phero figure img{width:100%;height:100%;object-fit:cover;display:block}
.phero figcaption{position:absolute;left:14px;bottom:12px;font:400 10px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--raphia);background:rgba(18,20,47,.55);padding:6px 10px;border-radius:999px}
.facts{display:grid;grid-template-columns:repeat(3,1fr);border-top:1.5px dashed var(--pierre);border-bottom:1.5px dashed var(--pierre)}
.facts div{padding:16px 12px 16px 0;display:grid;gap:4px;align-content:start}
.facts b{font:300 clamp(26px,3.2vw,40px)/1 var(--display);color:var(--indigo);letter-spacing:-.02em;font-weight:300}
.facts b em{font-style:italic;color:var(--cuivre)}
.facts div>span{font-size:13px;color:var(--graphite);line-height:1.4}
.facts b span{font:inherit;color:inherit}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px}
/* téléphone : l'image d'abord, bord à bord, puis le titre */
@media (max-width:999px){
  .phero .wrap{padding-top:0}
  .phero-grid{display:flex;flex-direction:column-reverse;align-items:stretch}
  .phero figure{aspect-ratio:5/4;max-height:none;margin-inline:calc(var(--gl)*-1) calc(var(--gr)*-1);border-radius:0}
  .phero .crumbs{display:none}
}
@media (max-width:560px){.facts{grid-template-columns:1fr 1fr 1fr}.facts b{font-size:24px}.facts div>span{font-size:11.5px}}

/* sous-navigation des pages d'univers : collée sous l'en-tête */
.subnav{position:sticky;top:calc(68px + env(safe-area-inset-top,0px));z-index:40;background:rgba(238,230,212,.92);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--pierre)}
.subnav .wrap{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding-block:10px}
.subnav .wrap::-webkit-scrollbar{display:none}
.subnav a{flex:none;height:36px;padding:0 15px;border-radius:999px;display:inline-flex;align-items:center;font-size:14px;color:var(--indigo);box-shadow:inset 0 0 0 1px var(--pierre);white-space:nowrap}
.subnav a.on{background:var(--indigo);color:var(--raphia);box-shadow:none}

/* packs */
.packs{display:grid;gap:16px}
@media (min-width:1000px){.packs.n3{grid-template-columns:repeat(3,1fr)}.packs.n2{grid-template-columns:repeat(2,1fr)}}
.pk{background:var(--papier) url(tex-papier.png);border-radius:4px;padding:clamp(24px,2.6vw,34px);display:grid;gap:18px;align-content:start;position:relative;box-shadow:0 1px 0 rgba(94,90,82,.14),0 26px 44px -34px rgba(30,35,80,.45)}
.pk.rec{background:var(--indigo) url(tex-ndop.png);color:var(--raphia)}
.pk .tag{position:absolute;top:-12px;left:clamp(24px,2.6vw,34px);font:400 10px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--nuit);background:var(--cuivre-clair);padding:6px 10px;border-radius:999px}
.pk-h{display:grid;gap:8px}
.pk h3{font-size:clamp(34px,3.2vw,46px);line-height:1;color:var(--indigo);font-weight:300}
.pk.rec h3{color:var(--raphia)}
.pk.rec .label{color:var(--pierre)}
.pp{font:300 clamp(30px,3vw,40px)/1 var(--display);color:var(--cuivre);letter-spacing:-.02em}
.pk.rec .pp{color:var(--cuivre-clair)}
.pp small{font:400 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--graphite);margin-right:8px;vertical-align:middle}
.pk.rec .pp small{color:var(--pierre)}
.pk ul{list-style:none;margin:0;padding:0;border-top:1px dashed var(--pierre)}
.pk.rec ul{border-color:rgba(238,230,212,.22)}
.pk li{padding:10px 0 10px 24px;border-bottom:1px dashed var(--pierre);font-size:15px;color:var(--graphite);position:relative}
.pk.rec li{border-color:rgba(238,230,212,.22);color:var(--pierre)}
.pk li::before{content:"";position:absolute;left:2px;top:17px;width:10px;height:5px;border-left:1.5px solid var(--cuivre);border-bottom:1.5px solid var(--cuivre);transform:rotate(-45deg)}
.pk.rec li::before{border-color:var(--cuivre-clair)}
.pk .btn{justify-self:start}
/* un seul pack : grande fiche en deux colonnes */
@media (min-width:900px){.packs.n1 .pk{grid-template-columns:1fr 1.1fr;gap:20px 56px;align-items:start}.packs.n1 .pk ul{grid-row:span 2}.packs.n1 .pk .btn{grid-column:1}}
/* téléphone : les packs se feuillettent du pouce */
@media (max-width:999px){
  .packs.n3,.packs.n2{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin-inline:calc(var(--gl)*-1) calc(var(--gr)*-1);padding:14px var(--gr) 8px var(--gl);scrollbar-width:none}
  .packs.n3::-webkit-scrollbar,.packs.n2::-webkit-scrollbar{display:none}
  .packs.n3 .pk,.packs.n2 .pk{flex:0 0 86%;scroll-snap-align:center}
}
.swipe-hint{display:none;font:400 10.5px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--graphite);margin-top:12px}
@media (max-width:999px){.swipe-hint{display:block}}

/* pièces rangées par moment */
.grp{display:grid;gap:22px;padding-block:clamp(30px,4vw,48px);border-top:1.5px dashed var(--pierre)}
.grp:first-child{border-top:0;padding-top:0}
.grp-h{display:grid;grid-template-columns:auto 1fr;gap:4px 18px;align-items:baseline}
.grp-h .n{font:300 clamp(34px,3.6vw,48px)/1 var(--display);color:var(--cuivre);grid-row:span 2}
.grp-h h3{font-size:clamp(28px,3vw,40px);color:var(--indigo);line-height:1.05}
.grp-h p{color:var(--graphite);font-size:15.5px;grid-column:2;max-width:56ch}
.note-min{margin-top:20px;font-size:14px;color:var(--graphite)}
.note-min b{font-weight:500;color:var(--indigo)}
/* téléphone : une liste qu'on parcourt, pas des cartes géantes */
@media (max-width:639px){
  .grp .cards{gap:0;border-top:1px dashed var(--pierre)}
  .grp .card{min-height:0;-webkit-mask:none;mask:none;background:transparent;border-radius:0;padding:15px 2px;grid-template-columns:1fr auto 18px;gap:2px 12px;align-items:center;border-bottom:1px dashed var(--pierre)}
  .grp .card:hover{transform:none;background:transparent}
  .grp .card .top{display:none}
  .grp .card .d{display:none}
  .grp .card .t3{font-size:21px;grid-column:1}
  .grp .card .foot{grid-column:2;grid-row:1;margin:0;padding:0;border:0}
  .grp .card .price{font-size:12.5px;white-space:nowrap}
  .grp .card .go{display:none}
  .grp .card::after{content:"→";grid-column:3;color:var(--cuivre);font-size:16px}
}

/* calendrier : la frise des jours */
.tl{list-style:none;margin:0;padding:0;display:grid;gap:0}
@media (min-width:900px){.tl{grid-template-columns:repeat(5,1fr)}}
.tl li{display:grid;gap:8px;align-content:start;padding:22px 20px 22px 0;border-top:1.5px solid rgba(238,230,212,.3);position:relative}
.tl li::before{content:"";position:absolute;top:-5px;left:0;width:8px;height:8px;border-radius:50%;background:var(--cuivre-clair)}
.tl b{font:300 clamp(36px,4vw,56px)/1 var(--display);color:var(--cuivre-clair);letter-spacing:-.03em;font-weight:300}
.tl h3{font-size:22px;color:var(--raphia);font-weight:400}
.tl p{font-size:14.5px;color:var(--pierre)}
@media (max-width:899px){.tl{border-left:1.5px solid rgba(238,230,212,.3);margin-left:4px}.tl li{border-top:0;padding:0 0 28px 26px}.tl li::before{left:-5px;top:12px}.tl b{font-size:34px}}

/* passerelle vers La Une */
.bridge{display:grid;gap:28px;align-items:center;background:var(--papier) url(tex-papier.png);border-radius:4px;padding:clamp(24px,4vw,56px);overflow:hidden}
@media (min-width:900px){.bridge{grid-template-columns:1.2fr .8fr;gap:56px}}
.bridge h2 em{font-style:italic;color:var(--cuivre)}
.bridge p{color:var(--graphite);max-width:48ch}
.bridge img{width:min(320px,70%);height:auto;justify-self:center;transform:rotate(3deg);box-shadow:0 30px 60px -28px rgba(18,20,47,.55);border-radius:3px;transition:transform .8s var(--ease)}
.bridge:hover img{transform:rotate(0)}
@media (max-width:899px){.bridge img{order:-1;width:62%}}

/* bande d'appel finale */
.cta-band .wrap{display:grid;gap:28px;padding-block:clamp(64px,9vw,120px)}
@media (min-width:1000px){.cta-band .wrap{grid-template-columns:1.2fr .8fr;align-items:end;gap:72px}}
.cta-band h2 em{font-style:italic;color:var(--cuivre-clair)}

/* accueil allégé */
.home-gar{display:grid;gap:28px}
@media (min-width:900px){.home-gar{grid-template-columns:repeat(3,1fr)}}
.home-gar div{display:grid;gap:6px;padding-top:18px;border-top:1.5px dashed var(--pierre)}
.more-link{display:inline-flex;gap:8px;align-items:center;font-weight:500;color:var(--indigo);text-decoration:underline;text-underline-offset:5px;text-decoration-color:var(--pierre)}
.more-link:hover{text-decoration-color:var(--indigo)}
/* téléphone : les univers se feuillettent */
@media (max-width:759px){
  .univers{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin-inline:calc(var(--gl)*-1) calc(var(--gr)*-1);padding:0 var(--gr) 6px var(--gl);scrollbar-width:none}
  .univers::-webkit-scrollbar{display:none}
  .univers .u{flex:0 0 80%;scroll-snap-align:center;min-height:440px}
}

/* papiers de l'atelier */
.papers{display:grid;gap:16px}
@media (min-width:900px){.papers{grid-template-columns:repeat(3,1fr)}}
.paper{border-radius:3px;padding:26px;min-height:300px;display:grid;align-content:space-between;gap:24px;background:#F8F4EB url(tex-papier.png);box-shadow:0 1px 0 rgba(94,90,82,.18),0 24px 40px -30px rgba(30,35,80,.5);position:relative}
.paper.p2{background-color:#F4EFE3;box-shadow:0 1px 0 rgba(94,90,82,.2),0 3px 0 -1px #EAE3D3,0 30px 46px -30px rgba(30,35,80,.55)}
.paper.p3{background:#F1EBDD url(tex-papier.png);background-size:180px;box-shadow:0 1px 0 rgba(94,90,82,.2),0 2px 0 -1px #E7DFCC,0 4px 0 -2px #E2D9C4,0 34px 50px -30px rgba(30,35,80,.55)}
.paper .w{font:300 clamp(48px,5vw,72px)/1 var(--display);color:var(--indigo);letter-spacing:-.03em;font-weight:300}
.paper .w em{font-style:italic;font-size:.4em;color:var(--cuivre);margin-left:6px}
.paper h3{font-size:28px;color:var(--indigo)}
.paper p{color:var(--graphite);font-size:15px}
.paper .label{color:var(--cuivre)}

/* page devis : le panier en clair */
.devis-grid{display:grid;gap:18px}
@media (min-width:1000px){.devis-grid{grid-template-columns:1fr 1fr;gap:24px;align-items:start}}
.cartbox{background:var(--papier) url(tex-papier.png);border-radius:4px;padding:clamp(20px,3vw,34px);display:grid;gap:16px;box-shadow:0 1px 0 rgba(94,90,82,.16),0 26px 44px -34px rgba(30,35,80,.5)}
.cartbox h3{font-size:clamp(28px,3vw,38px);color:var(--indigo)}
.cartbox p{color:var(--graphite)}
.cb-go{display:flex;flex-wrap:wrap;gap:8px}
.cb-go a{height:40px;padding:0 16px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--pierre);display:inline-flex;align-items:center;font-size:14px;color:var(--indigo)}
.cb-go a:hover{background:var(--indigo);color:var(--raphia);box-shadow:none}
.cb-list{list-style:none;margin:0;padding:0;border-top:1.5px dashed var(--pierre)}
.cb-list li{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px dashed var(--pierre)}
.cb-list b{display:block;font:400 20px/1.2 var(--display);color:var(--indigo);font-weight:400}
.cb-list span{font-size:13.5px;color:var(--graphite)}
.cb-list em{font-style:normal;font:400 13.5px var(--mono);color:var(--cuivre);white-space:nowrap}
.cb-tot{display:flex;justify-content:space-between;align-items:baseline}
.cb-tot span{font:400 11px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--graphite)}
.cb-tot b{font:300 36px/1 var(--display);color:var(--indigo);font-weight:300}
.cartbox .btn{justify-self:start}
.contact-row{display:grid;gap:16px}
@media (min-width:600px){.contact-row{grid-template-columns:repeat(2,1fr)}}@media (min-width:1000px){.contact-row{grid-template-columns:repeat(4,1fr)}}
.contact-row div{display:grid;gap:6px;padding-top:16px;border-top:1.5px dashed var(--pierre)}
.contact-row b{font:300 24px/1.15 var(--display);color:var(--indigo);font-weight:300}
.contact-row span{color:var(--graphite);font-size:14.5px}
/* choix du paiement dans la commande */
.choice.pays label{align-items:center}
.choice.pays .pl{display:flex;gap:6px;align-items:center}
.choice.pays .pl img{height:20px;width:auto;background:#fff;border-radius:5px;padding:3px 6px;box-sizing:content-box}
.choice input:disabled+label{opacity:.5;cursor:not-allowed}
/* pied de page : logo en image */
.foot-logo img{width:100%;height:auto;display:block}
.foot-big .slog{font:300 clamp(30px,4vw,54px)/1 var(--display);color:var(--raphia);letter-spacing:-.02em}
.foot-big .slog em{font-style:italic;color:var(--cuivre-clair)}
.foot-cols a{text-decoration:none}
.mts{display:flex;flex-wrap:wrap;gap:8px}
.mt{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 14px;border-radius:999px;background:var(--raphia);cursor:pointer;font-size:14px}
.mt input{accent-color:var(--indigo);width:16px;height:16px;margin:0}
.mt:has(input:checked){background:var(--indigo);color:var(--raphia)}

/* partenaire officiel */
.foot-ag{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px 28px;margin-top:-30px;padding:22px 26px;border:1px solid rgba(238,230,212,.16);border-radius:6px;text-decoration:none;color:var(--raphia);transition:border-color .4s var(--ease),background .4s var(--ease)}
.foot-ag:hover{border-color:rgba(238,230,212,.4);background:rgba(238,230,212,.04)}
.foot-ag .label{grid-column:1/-1;color:var(--pierre)}
.foot-ag img{height:44px;width:auto;display:block}
.foot-ag .fa-t{font-size:14px;line-height:1.5;color:rgba(238,230,212,.78);max-width:52ch}
.foot-ag b{font-weight:500;font-size:14px;color:var(--cuivre-clair,#E0A57A);white-space:nowrap}
@media (max-width:699px){.foot-ag{grid-template-columns:1fr;padding:20px}.foot-ag img{height:40px}}

/* ===== compositions : histoire et élément offert ===== */
.pk-s{font-size:15px;line-height:1.55;color:var(--graphite);max-width:42ch}
.pk.rec .pk-s{color:var(--pierre)}
.pk-g{display:flex;gap:10px;align-items:baseline;font-size:14px;color:var(--graphite);padding:10px 14px;border-radius:4px;background:rgba(180,105,58,.08)}
.pk-g span{font:400 10px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--cuivre);flex:none}
.pk.rec .pk-g{background:rgba(238,230,212,.08);color:var(--raphia)}
.pk.rec .pk-g span{color:var(--cuivre-clair)}
.pbody .from{font-size:14px;color:var(--graphite);background:rgba(180,105,58,.08);border-left:2px solid var(--cuivre);padding:10px 14px;border-radius:0 4px 4px 0}

/* ===== trois portes ===== */
.doors{display:grid;gap:16px}
@media (min-width:980px){.doors{grid-template-columns:1.25fr 1fr 1fr;align-items:stretch}}
.door{background:var(--papier) url(tex-papier.png);border-radius:4px;overflow:hidden;display:grid;align-content:start;box-shadow:0 1px 0 rgba(94,90,82,.14),0 26px 44px -34px rgba(30,35,80,.45)}
.door-b{display:grid;gap:14px;padding:clamp(24px,2.6vw,34px);align-content:start}
.door h3{font:300 clamp(28px,2.6vw,38px)/1.05 var(--display);color:var(--indigo);letter-spacing:-.01em}
.door p{font-size:15px;line-height:1.6;color:var(--graphite);max-width:46ch}
.door .btn{justify-self:start;margin-top:4px}
.door.main{background:var(--indigo) url(tex-ndop.png);color:var(--raphia)}
.door.main h3{color:var(--raphia)}.door.main p{color:var(--pierre)}.door.main .label{color:var(--cuivre-clair)}
.door.main img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;display:block}
.doors-n{margin-top:18px;font:400 11px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--graphite)}
@media (max-width:979px){.door.main img{aspect-ratio:4/3}}

/* ===== logo WhatsApp sur les boutons d'envoi ===== */
.wa-i{width:18px;height:18px;flex:none;margin-right:2px}

/* ===== la Consultation ===== */
.cs{position:fixed;inset:0;z-index:120;visibility:hidden;pointer-events:none}
.cs.open{visibility:visible;pointer-events:auto}
.cs-veil{position:absolute;inset:0;background:rgba(18,20,47,.55);opacity:0;transition:opacity .4s var(--ease)}
.cs.open .cs-veil{opacity:1}
.cs-box{position:absolute;inset:0;background:var(--papier) url(tex-papier.png);display:grid;grid-template-rows:auto 1fr auto;transform:translateY(24px);opacity:0;transition:transform .5s var(--ease),opacity .4s var(--ease)}
.cs.open .cs-box{transform:none;opacity:1}
@media (min-width:760px){.cs-box{inset:auto;left:50%;top:50%;width:min(760px,92vw);height:min(820px,90vh);transform:translate(-50%,-46%);border-radius:6px;box-shadow:0 40px 90px -30px rgba(18,20,47,.6)}.cs.open .cs-box{transform:translate(-50%,-50%)}}
.cs-top{position:relative;display:flex;align-items:center;justify-content:space-between;padding:18px var(--gl,20px) 16px;border-bottom:1px solid rgba(94,90,82,.16)}
@media (min-width:760px){.cs-top{padding:20px 32px 18px}}
.cs-k{font:400 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--graphite)}
.cs-x{width:44px;height:44px;border-radius:50%;border:1px solid var(--pierre);background:transparent;color:var(--indigo);font-size:16px;cursor:pointer}
.cs-bar{position:absolute;left:0;right:0;bottom:-1px;height:2px;background:transparent}
.cs-bar i{display:block;height:100%;width:4%;background:var(--cuivre);transition:width .5s var(--ease)}
.cs-body{overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:28px var(--gl,20px) 32px;display:grid;gap:18px;align-content:start}
@media (min-width:760px){.cs-body{padding:36px 32px 36px}}
.cs-q{font:300 clamp(30px,4.4vw,44px)/1.04 var(--display);color:var(--indigo);letter-spacing:-.015em}
.cs-h{font-size:16px;line-height:1.6;color:var(--graphite);max-width:52ch}
.cs-lab{font:400 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--cuivre)}
.cs-how{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:0;border-top:1px dashed var(--pierre)}
.cs-how li{padding:14px 0 14px 28px;border-bottom:1px dashed var(--pierre);position:relative;font-size:16px;color:var(--encre)}
.cs-how li::before{content:"";position:absolute;left:2px;top:21px;width:10px;height:5px;border-left:1.5px solid var(--cuivre);border-bottom:1.5px solid var(--cuivre);transform:rotate(-45deg)}
.cs-opts{display:grid;gap:10px}
.cs-opts.grid{grid-template-columns:repeat(2,1fr)}
@media (min-width:760px){.cs-opts.grid{grid-template-columns:repeat(3,1fr)}.cs-opts.styles{grid-template-columns:repeat(2,1fr)}}
.cs-o{position:relative;display:grid;gap:4px;text-align:left;min-height:60px;padding:16px 48px 16px 18px;border-radius:6px;border:1px solid var(--pierre);background:rgba(255,255,255,.55);color:var(--encre);font:inherit;cursor:pointer;transition:border-color .3s var(--ease),background .3s var(--ease),transform .3s var(--ease)}
.cs-o:hover{border-color:var(--indigo)}
.cs-o:active{transform:scale(.99)}
.cs-o.on{border-color:var(--indigo);background:var(--indigo);color:var(--raphia)}
.cs-ot{font-size:17px;line-height:1.3}
.cs-os{font-size:13px;line-height:1.45;color:var(--graphite)}
.cs-o.on .cs-os{color:var(--pierre)}
.cs-ck{position:absolute;right:16px;top:50%;width:22px;height:22px;margin-top:-11px;border-radius:5px;border:1.5px solid var(--pierre)}
.cs-o.on .cs-ck{border-color:var(--cuivre-clair);background:var(--cuivre-clair)}
.cs-o.on .cs-ck::after{content:"";position:absolute;left:6px;top:4px;width:8px;height:5px;border-left:2px solid var(--nuit);border-bottom:2px solid var(--nuit);transform:rotate(-45deg)}
.cs-st{padding-right:18px}
.cs-sw{display:flex;gap:6px;margin-bottom:6px}
.cs-sw i{width:26px;height:26px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
.cs-ph{font:400 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--graphite);margin-top:8px}
.cs-date,.cs-num{display:grid;gap:8px;max-width:340px}
.cs-date span,.cs-num span{font:400 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--graphite)}
.cs-date input,.cs-num input{height:58px;padding:0 16px;border-radius:6px;border:1px solid var(--pierre);background:#fff;font:400 18px var(--sans);color:var(--encre)}
.cs-date input:focus,.cs-num input:focus{outline:2px solid var(--indigo);outline-offset:1px}
.cs-err{color:#A2361F;font-size:14px;min-height:1em}
.cs-foot{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;padding:14px var(--gl,20px) calc(14px + env(safe-area-inset-bottom));border-top:1px solid rgba(94,90,82,.16);background:rgba(247,243,234,.96)}
@media (min-width:760px){.cs-foot{padding:16px 32px 18px}}
.cs-foot .btn{height:52px}
.cs-next{margin-left:auto}
.cs-next[disabled]{opacity:.38;pointer-events:none}
.cs-back,.cs-call{background:none;border:0;padding:10px 4px;font:inherit;font-size:15px;color:var(--indigo);cursor:pointer;text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--pierre)}
.cs-call{width:100%;text-align:center;font-size:14px;color:var(--graphite);order:3}
@media (max-width:759px){.cs-foot .btn{flex:1 1 100%;justify-content:center}.cs-next{margin-left:0;order:-1}.cs-back{order:2}}
.cs-lines{list-style:none;margin:0;padding:0;border-top:1px solid var(--pierre)}
.cs-lines li{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px dashed var(--pierre)}
.cs-lines b{display:block;font-weight:500;color:var(--encre)}
.cs-lines li div span{display:block;font-size:13px;color:var(--graphite);margin-top:3px;line-height:1.45}
.cs-lp{white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--indigo)}
.cs-lp small{display:block;font-size:11px;color:var(--graphite)}
.cs-sum{display:grid;gap:8px}
.cs-sum>div{display:flex;justify-content:space-between;font-size:15px;color:var(--graphite)}
.cs-sum .cs-tot{padding-top:12px;border-top:1px solid var(--indigo);align-items:baseline}
.cs-tot span{font:400 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--indigo)}
.cs-tot b{font:300 clamp(34px,5vw,46px)/1 var(--display);color:var(--indigo);letter-spacing:-.02em}
.cs-tot small{font:400 12px var(--mono);letter-spacing:.1em}
.cs-ac{font-size:14px;color:var(--graphite)}
.cs-notes{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.cs-notes li{font-size:14px;line-height:1.55;color:var(--encre);padding:12px 14px;border-left:2px solid var(--cuivre);background:rgba(180,105,58,.07);border-radius:0 4px 4px 0}
.cs-cal{list-style:none;margin:0;padding:0;counter-reset:c;display:grid}
.cs-cal li{display:grid;grid-template-columns:auto 1fr;gap:4px 16px;padding:12px 0 12px 22px;position:relative;border-left:1px solid var(--pierre);margin-left:6px}
.cs-cal li::before{content:"";position:absolute;left:-6px;top:17px;width:11px;height:11px;border-radius:50%;background:var(--papier);border:1.5px solid var(--cuivre)}
.cs-cal li:last-child::before{background:var(--cuivre)}
.cs-cal b{grid-column:1/-1;font:400 11px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--cuivre)}
.cs-cal span{grid-column:1/-1;font-size:15px;color:var(--encre)}
@media (max-width:979px){.door:not(.main) p{display:none}.door:not(.main) .door-b{gap:10px}}


/* ===== accueil : la scène La Une ===== */
.une-scene{margin:clamp(36px,5vw,64px) 0 0;position:relative;border-radius:6px;overflow:hidden;box-shadow:0 40px 80px -40px rgba(18,20,47,.5)}
.une-scene img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;object-position:50% 45%}
.une-scene figcaption{position:absolute;left:clamp(16px,3vw,40px);bottom:clamp(16px,3vw,36px);font:300 clamp(24px,3vw,44px)/1.05 var(--display);color:var(--raphia);text-shadow:0 2px 24px rgba(0,0,0,.45);max-width:16ch}
.une-scene figcaption em{font-style:italic;color:var(--cuivre-clair)}
@media (max-width:699px){.une-scene{margin-inline:calc(var(--gl)*-1) calc(var(--gr)*-1);border-radius:0}.une-scene img{aspect-ratio:4/5}}
.une-scene::after{content:"";position:absolute;inset:auto 0 0 0;height:45%;background:linear-gradient(0deg,rgba(18,20,47,.55),rgba(18,20,47,0));pointer-events:none}
.une-scene figcaption{z-index:1}

/* ===== logo du pied de page animé ===== */
.foot-logo svg{width:100%;height:auto;display:block;overflow:visible;cursor:default}
.foot-logo .fl-stem{transform-box:view-box;transform-origin:262px 472px;transform:scaleY(0)}
.foot-logo .fl-dot{transform-box:view-box;transform-origin:262px 160px;transform:translateY(-240px);opacity:0}
.foot-logo .fl-r{transform-box:view-box;transform-origin:330px 300px;transform:scaleX(0)}
.foot-logo .fl-sh{transform:translateX(-400px)}
.foot-logo.on .fl-stem{transform:scaleY(1);transition:transform .9s cubic-bezier(.2,.9,.2,1)}
.foot-logo.on .fl-dot{animation:flDrop 1.1s cubic-bezier(.3,.7,.2,1) .55s both}
.foot-logo.on .fl-r{transform:scaleX(1);transition:transform 1.9s cubic-bezier(.65,0,.25,1) .9s}
.foot-logo.on .fl-sh{animation:flSheen 7s ease-in-out 3.2s infinite}
.foot-logo.on:hover .fl-dot{animation:flHop .7s cubic-bezier(.3,.7,.2,1) both}
@keyframes flDrop{0%{transform:translateY(-240px);opacity:0}45%{transform:translateY(0);opacity:1}62%{transform:translateY(-38px)}78%{transform:translateY(0)}88%{transform:translateY(-9px)}100%{transform:translateY(0);opacity:1}}
@keyframes flHop{0%{transform:translateY(0)}40%{transform:translateY(-70px)}70%{transform:translateY(0)}85%{transform:translateY(-12px)}100%{transform:translateY(0)}}
@keyframes flSheen{0%{transform:translateX(-400px)}35%,100%{transform:translateX(1800px)}}
@media (prefers-reduced-motion:reduce){.foot-logo .fl-stem,.foot-logo .fl-r{transform:none}.foot-logo .fl-dot{transform:none;opacity:1}.foot-logo.on .fl-dot,.foot-logo.on .fl-sh{animation:none}}

/* ===== TEST · ndop Indaprint, page Deuil uniquement ===== */
[data-u="deuil"] .phero figure{position:relative;overflow:visible}
[data-u="deuil"] .phero figure::before{content:"";position:absolute;z-index:2;top:-18px;bottom:46px;left:-22px;width:56px;border-radius:2px;background:#1E2350 url(ndop-colonne.svg) center top/56px auto repeat-y;box-shadow:6px 10px 24px -8px rgba(18,20,47,.55)}
[data-u="deuil"] .phero figure::after{content:"";position:absolute;z-index:2;left:-22px;width:56px;bottom:12px;height:34px;background:repeating-linear-gradient(90deg,#1E2350 0 2px,transparent 2px 5px);-webkit-mask:linear-gradient(#000,#000 60%,transparent);mask:linear-gradient(#000,#000 60%,transparent)}
[data-u="deuil"] .stitch{border:0!important;height:26px;background:url(ndop-frise.svg) left center/auto 26px repeat-x;opacity:.92;border-radius:2px}
[data-u="deuil"] .pk.rec{background:#1E2350 url(ndop-trame.svg) center/220px auto!important;position:relative;isolation:isolate}
[data-u="deuil"] .pk.rec::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:linear-gradient(180deg,rgba(30,35,80,.93),rgba(30,35,80,.86))}
[data-u="deuil"] .pk.rec .tag{z-index:1}
[data-u="deuil"] #calendrier{background:#1E2350 url(ndop-trame.svg) center/300px auto!important;position:relative;isolation:isolate}
[data-u="deuil"] #calendrier::before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(30,35,80,.9)}
[data-u="deuil"] .foot-big{position:relative;padding-top:26px}
[data-u="deuil"] .foot-big::before{content:"";position:absolute;left:0;right:0;top:0;height:26px;background:url(ndop-frise.svg) left center/auto 26px repeat-x}
@media (max-width:899px){[data-u="deuil"] .phero figure::before{left:auto;right:16px;top:-14px;bottom:auto;height:62%;width:44px;background-size:44px auto}[data-u="deuil"] .phero figure::after{left:auto;right:16px;width:44px;bottom:auto;top:calc(62% - 14px)}}
.ndop-note{display:flex;gap:14px;align-items:center;font:300 clamp(17px,1.5vw,20px)/1.4 var(--display);color:var(--indigo);max-width:46ch;padding-top:18px;border-top:1px dashed var(--pierre)}
.ndop-note::before{content:"";flex:none;width:46px;height:46px;border-radius:50%;background:#1E2350 url(ndop-colonne.svg) center top/46px auto no-repeat}
.ndop-note em{font-style:italic;color:var(--cuivre)}

/* ===== contacts en boutons (pas d'adresse lisible par les robots) ===== */
.ct-col{display:grid;gap:4px}
.ct-col .ct,.ct-row .ct{display:inline-flex!important;align-items:center;gap:10px;line-height:1.9;text-decoration:none;color:var(--raphia)}
.ct .ci{width:17px;height:17px;flex:none;color:var(--cuivre-clair)}
.ct:hover{color:var(--cuivre-clair)}
.ct-row{display:flex;flex-wrap:wrap;gap:8px}
.ct-row .ct{padding:8px 14px;border-radius:999px;border:1px solid rgba(238,230,212,.25);font-size:13px;line-height:1.2}
.contact-row b a{color:inherit;text-decoration:underline;text-underline-offset:5px;text-decoration-color:var(--pierre)}

/* ===== accueil : le studio, avant / après ===== */
.ba{position:relative;border-radius:6px;overflow:hidden;aspect-ratio:960/1472;background:#ddd;box-shadow:0 40px 80px -40px rgba(18,20,47,.5);user-select:none;touch-action:pan-y}
.ba img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.ba-b{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--x)) 0 0)}
.ba-r{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0;z-index:3}
.ba-h{position:absolute;top:0;bottom:0;left:var(--x);width:2px;margin-left:-1px;background:var(--cuivre-clair);z-index:2;pointer-events:none}
.ba-h::after{content:"↔";position:absolute;top:50%;left:50%;width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;background:var(--cuivre-clair);color:var(--nuit);display:grid;place-items:center;font-size:18px;box-shadow:0 8px 20px rgba(0,0,0,.3)}
.ba-l{position:absolute;bottom:14px;z-index:2;font:400 10px var(--mono);letter-spacing:.14em;text-transform:uppercase;padding:6px 11px;border-radius:999px;pointer-events:none}
.ba-l1{left:14px;background:#fff;color:var(--encre);box-shadow:0 0 0 1px rgba(0,0,0,.1)}
.ba-l2{right:14px;background:var(--indigo);color:var(--raphia)}
.studio-steps{display:grid;gap:22px}
.studio-grid{display:grid;gap:clamp(28px,4vw,56px);align-items:center}
@media (min-width:900px){.studio-grid{grid-template-columns:minmax(0,520px) 1fr}.studio-steps{gap:34px}}
.studio-steps b{font:300 clamp(36px,4vw,52px)/1 var(--display);color:var(--cuivre)}
.studio-steps h3{font:400 22px/1.2 var(--display);color:var(--indigo);margin:8px 0 6px}
.studio-steps p{font-size:15px;line-height:1.6;color:var(--graphite)}
.studio-offer{display:grid;gap:18px;align-items:center;padding:clamp(22px,3vw,34px);border-radius:6px;background:var(--papier) url(tex-papier.png);box-shadow:inset 0 0 0 1px var(--pierre)}
@media (min-width:860px){.studio-offer{grid-template-columns:1fr auto}}
.studio-offer b{display:block;font:300 clamp(24px,2.6vw,34px)/1.1 var(--display);color:var(--indigo);margin:6px 0}
.studio-offer p{font-size:15px;color:var(--graphite);max-width:56ch}
@media (max-width:699px){.ba{aspect-ratio:960/1200}.ba img{object-position:50% 0}}
@media (max-width:699px){.ba-l{font-size:9px;padding:5px 8px;bottom:10px}.ba-l1{left:10px}.ba-l2{right:10px}}

/* ===== atelier : le studio ===== */
.st-m{list-style:none;margin:0;padding:0;display:grid;border-top:1px solid var(--pierre)}
@media (min-width:900px){.st-m{grid-template-columns:repeat(5,1fr);border-top:0;gap:0}.st-m li{border-left:1px solid var(--pierre);padding:0 22px!important;border-bottom:0!important}.st-m li:first-child{border-left:0;padding-left:0!important}}
.st-m li{display:grid;gap:8px;padding:16px 0;border-bottom:1px dashed var(--pierre)}
.st-m b{font:400 21px/1.2 var(--display)!important;color:var(--indigo)}
.st-m span{font-size:14.5px;line-height:1.55;color:var(--graphite)}
.st-g{display:grid;gap:14px;grid-template-columns:repeat(2,1fr);grid-auto-flow:dense}
@media (min-width:900px){.st-g{grid-template-columns:repeat(3,1fr);grid-auto-rows:270px}.t-big{grid-column:span 2;grid-row:span 2}}
@media (max-width:899px){.t-big,.t-wide{grid-column:span 2}}
.st-t{position:relative;display:block;border-radius:6px;overflow:hidden;background:var(--nuit);aspect-ratio:1/1;text-decoration:none}
@media (min-width:900px){.st-t{aspect-ratio:auto}}
@media (max-width:899px){.t-big,.t-wide{aspect-ratio:3/2}}
.st-t img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease)}
.st-t:hover img{transform:scale(1.05)}
.st-t::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(18,20,47,.82) 0%,rgba(18,20,47,0) 55%)}
.st-c{position:absolute;left:16px;right:16px;bottom:14px;z-index:1;display:grid;gap:3px;color:var(--raphia)}
.st-c small{font:400 10px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--cuivre-clair)}
.st-c b{font:400 clamp(18px,1.7vw,24px)/1.15 var(--display)}
.st-c em{font-style:normal;font-size:13px;color:var(--pierre)}
@media (max-width:599px){.st-c em{display:none}.st-c b{font-size:16px}}

/* ===== accueil : « Comme un ndop » sur fond de trame ndop ===== */
#chaine{background:#1E2350 url(ndop-trame.svg) center/300px auto!important;isolation:isolate}
#chaine::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(30,35,80,.93),rgba(30,35,80,.86) 50%,rgba(30,35,80,.93));pointer-events:none}
#chaine::after{content:"";position:absolute;left:0;right:0;top:0;height:26px;background:url(ndop-frise.svg) left center/auto 26px repeat-x;pointer-events:none}
#chaine .chain-pin{padding-top:26px}

/* ===== pied de page sur téléphone : deux colonnes équilibrées ===== */
@media (max-width:799px){
  .foot-cols{grid-template-columns:1fr 1fr;gap:30px 18px}
  .foot-cols>div:nth-child(3),.foot-cols>div:nth-child(4){grid-column:1/-1}
  .foot-cols>div:nth-child(3) .ct-col{grid-template-columns:1fr 1fr;column-gap:18px}
  .foot-cols>div:nth-child(3) .ct-col+p{margin-top:4px}
  .pay-logos{display:grid!important;grid-template-columns:repeat(4,1fr)}
  .pay-logos span{padding:0 6px!important;justify-content:center}
  .pay-logos img{max-width:100%;height:18px!important;object-fit:contain}
  .foot-partner,.foot-ag{width:100%}
  .sign{justify-content:center;text-align:center}
}

/* ===== mouvement au défilement (nav.js) ===== */
.rv-on .rv{opacity:0;translate:0 34px;transition:opacity 1s var(--ease),translate 1.1s var(--ease);transition-delay:var(--d,0s)}
.rv-on .rv.vu{opacity:1;translate:0 0}
.px-img{will-change:translate}
@media (prefers-reduced-motion:reduce){.rv-on .rv{opacity:1;translate:none;transition:none}}
@media (max-width:799px){.foot-cols .ct{white-space:nowrap;font-size:14px!important}}
.uwide{margin:0;position:relative;border-radius:6px;overflow:hidden;aspect-ratio:16/8}
.uwide img{width:100%;height:100%;object-fit:cover;display:block}
.uwide figcaption{position:absolute;left:16px;bottom:14px;font:400 10px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--raphia);background:rgba(18,20,47,.6);padding:6px 11px;border-radius:999px}
@media (max-width:699px){.uwide{aspect-ratio:4/3;margin-inline:calc(var(--gl)*-1) calc(var(--gr)*-1);border-radius:0}}

/* Quatrième de couverture : quand la dernière section est sombre, elle et le pied de page ne font qu'un seul aplat (même indigo, trame continue), séparés par une couture pointillée */
main>.ink:last-child{background-color:var(--indigo)!important;background-position:center bottom!important;padding-bottom:clamp(56px,7vw,96px)}
main>.cta-band:last-child{padding-bottom:0}
main>.cta-band:last-child .wrap{padding-bottom:clamp(56px,7vw,96px)}
footer.join{background-color:var(--indigo)!important;background-position:center top!important}
footer.join>.wrap{border-top:1.5px dashed rgba(238,230,212,.24);padding-top:clamp(48px,6vw,88px)!important}
[data-u="deuil"] footer.join>.wrap{border-top:0}
.contact-row b span{font:inherit;color:inherit}

/* Promesse de vitesse : « Conçu en 72 heures. Imprimé en 48. » — trois grands chiffres, couture entre les colonnes */
.vitesse .vit-head{display:grid;gap:18px;max-width:880px;margin-bottom:clamp(40px,6vw,72px)}
.vitesse .vit-head .h2{font-size:clamp(40px,6.2vw,92px);line-height:.98;letter-spacing:-.03em}
.vitesse .vit-head .h2 em{font-style:italic;color:var(--cuivre)}
.vitesse .vit-head .lead{max-width:60ch;color:var(--graphite)}
.vit-grid{display:grid;gap:0}
.vit-grid>div{display:grid;grid-template-columns:minmax(118px,.8fr) 1.4fr;column-gap:20px;row-gap:6px;align-items:start;padding:22px 0;border-top:1.5px dashed var(--pierre)}
.vit-grid>div:last-child{border-bottom:1.5px dashed var(--pierre)}
.vit-grid b{grid-row:1/3;font:300 clamp(64px,17vw,96px)/.86 var(--display);color:var(--indigo);letter-spacing:-.045em;font-variant-numeric:lining-nums}
.vit-grid b em{font-style:italic;font-size:.42em;letter-spacing:0;color:var(--cuivre);margin-left:.06em}
.vit-grid h3{font:400 19px/1.2 var(--display);color:var(--indigo);margin:4px 0 0}
.vit-grid p{color:var(--graphite);font-size:15px;line-height:1.55;margin:0}
.vit-note{margin-top:22px;font:400 11.5px/1.6 var(--mono);letter-spacing:.02em;color:var(--graphite);max-width:90ch}
@media (min-width:900px){
  .vit-grid{grid-template-columns:repeat(3,1fr)}
  .vit-grid>div{grid-template-columns:1fr;row-gap:12px;padding:30px 32px 34px;border-top:1.5px dashed var(--pierre);border-bottom:1.5px dashed var(--pierre)}
  .vit-grid>div+div{border-left:1.5px dashed var(--pierre)}
  .vit-grid>div:first-child{padding-left:0}
  .vit-grid>div:last-child{padding-right:0}
  .vit-grid b{grid-row:auto;font-size:clamp(96px,10.5vw,160px)}
  .vit-grid h3{font-size:22px;margin-top:10px}
  .vit-grid p{max-width:34ch}
}
.vit-grid b{display:block;white-space:nowrap;height:.9em}
.vit-grid>div{align-content:start}

/* Réalisation en portrait (page Mariage : save the date) */
.ureal{display:grid;gap:clamp(28px,4vw,48px);align-items:center}
.ureal-fig{margin:0;position:relative;border-radius:6px;overflow:hidden;box-shadow:0 30px 60px -40px rgba(30,35,80,.55)}
.ureal-fig img{display:block;width:100%;height:auto}
.ureal-fig figcaption{position:absolute;left:14px;bottom:12px;font:400 10px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--raphia);background:rgba(18,20,47,.6);padding:6px 11px;border-radius:999px}
.ureal-txt{display:grid;gap:18px;align-content:start}
.ureal-txt .h2 em{font-style:italic;color:var(--cuivre)}
.ureal-txt .lead{color:var(--graphite);max-width:46ch}
.ureal-list{list-style:none;margin:0;padding:0;display:grid}
.ureal-list li{padding:12px 0;border-top:1.5px dashed var(--pierre);font-size:15.5px;color:var(--encre)}
.ureal-list li:last-child{border-bottom:1.5px dashed var(--pierre)}
.ureal-txt .btn{justify-self:start;margin-top:6px}
@media (min-width:900px){.ureal{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(48px,6vw,96px)}.ureal-fig{max-width:520px}}
@media (max-width:899px){.ureal-fig{margin-inline:calc(var(--gl)*-1) calc(var(--gr)*-1);border-radius:0;box-shadow:none}}
@media (min-width:900px){.ureal-rev .ureal{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}.ureal-rev .ureal-fig{order:2;justify-self:end}}
.ureal-sec+.ureal-sec{padding-top:clamp(24px,4vw,56px)!important}
.ureal-sec:has(+ .ureal-sec){padding-bottom:clamp(24px,4vw,56px)!important}
.ureal-txt .h2{padding-bottom:.06em}
/* Deux rives : Foumban et le Wouri */
.rives .sec-head{margin-bottom:clamp(32px,5vw,64px)}
.rives-g{display:grid;gap:clamp(36px,5vw,56px)}
.rive{display:grid;gap:14px;align-content:start}
.rive h3{font:300 clamp(30px,3.4vw,44px)/1 var(--display);color:var(--indigo);letter-spacing:-.02em}
.rive h3 em{font-style:italic;color:var(--cuivre)}
.rive p{color:var(--graphite);max-width:44ch;font-size:16.5px;line-height:1.6}
.rive-v{height:clamp(120px,14vw,170px);display:flex;align-items:flex-end;margin-bottom:10px}
.rive-v img{width:100%;max-width:380px;height:auto;display:block}
.rive-sort{padding-left:8px}
.rs{display:block;rotate:-8deg;filter:drop-shadow(1px 2px 1px rgba(35,16,4,.55)) drop-shadow(6px 14px 14px rgba(30,35,80,.25))}
.rs b{display:block;width:clamp(34px,3.4vw,44px);height:clamp(110px,11vw,142px);border-radius:2px;background:linear-gradient(180deg,rgba(60,30,14,.5),rgba(0,0,0,0) 7%),linear-gradient(90deg,#5A2C14,#97522A 10%,#D98E5C 22%,#FFD0AC 28%,#B9693A 44%,#9C5429 62%,#E7A378 82%,#4E2610);-webkit-mask:radial-gradient(ellipse 34% 11% at 100% 60%,transparent 97%,#000 100%);mask:radial-gradient(ellipse 34% 11% at 100% 60%,transparent 97%,#000 100%)}
.rives-fil{display:none}
.rives-end{margin-top:clamp(40px,6vw,72px);font:300 clamp(22px,2.6vw,32px)/1.25 var(--display);color:var(--indigo);text-align:center}
.rives-end em{font-style:italic;color:var(--cuivre)}
.rives .more-link{display:block;text-align:center;margin-top:18px}
@media (min-width:900px){.rives-g{grid-template-columns:1fr 1px 1fr;gap:clamp(48px,6vw,96px)}.rives-fil{display:block;border-left:1.5px dashed var(--pierre)}}
/* Souvent commandés ensemble */
.rel-box{display:grid;gap:10px;margin-top:22px;padding-top:18px;border-top:1.5px dashed var(--pierre)}
.rel-list{display:grid;gap:8px}
.rel{display:flex;justify-content:space-between;align-items:baseline;gap:14px;width:100%;text-align:left;padding:13px 16px;border-radius:4px;border:1px solid var(--pierre);background:var(--papier);color:var(--encre);font:inherit;cursor:pointer;transition:border-color .2s,background .2s}
.rel:hover,.rel:focus-visible{border-color:var(--indigo);background:#fff}
.rel-n{font-size:15px;line-height:1.35}
.rel-p{font:400 11px var(--mono);letter-spacing:.06em;color:var(--cuivre);white-space:nowrap}
.rel-pack{background:var(--indigo);border-color:var(--indigo);color:var(--raphia)}
.rel-pack .rel-p{color:var(--cuivre-clair)}
.rel-pack:hover,.rel-pack:focus-visible{background:#262c63}
/* Confirmation dans le devis, à la place d'une bulle flottante qui masquait le contenu */
.flash{display:flex;align-items:center;gap:10px;margin:0 0 18px;padding:12px 16px;border-radius:4px;background:#E7EEDF;color:#2F5A2A;font-size:14.5px;font-weight:500;animation:flashIn .45s var(--ease) both}
.flash::before{content:"";flex:0 0 18px;height:18px;border-radius:50%;background:#3E7A37 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.4l2.6 2.5L12 5.5' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat}
@keyframes flashIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
/* La barre du devis ne masque jamais le bas de la page */
html.has-cartbar footer{padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))}
.pgal figure:only-of-type{flex:1 1 100%;height:auto;max-height:340px}
.pgal figure:only-of-type img{width:100%;height:100%;max-height:340px;object-fit:cover}
.cat-note{margin-top:28px;color:var(--graphite);font-size:14.5px}
/* Catalogue : chaque pièce avec sa photo */
#cards .card{padding-top:0;overflow:hidden}
.c-img{position:relative;display:block;margin:0 -24px 6px;aspect-ratio:4/3;overflow:hidden;background:var(--pierre)}
.c-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1s var(--ease)}
#cards .card:hover .c-img img{transform:scale(1.04)}
.c-none{display:grid;place-items:center;background:#E6DCC7 url(tex-papier.png)}
.c-none svg{width:13%;fill:rgba(30,35,80,.16)}
.card.pack .c-none{background:#262c63}
.card.pack .c-none svg{fill:rgba(238,230,212,.18)}
.card.pack .c-none svg circle{fill:#262c63}
.c-badge{position:absolute;left:14px;top:14px;font:400 10px var(--mono);letter-spacing:.12em;text-transform:uppercase;background:var(--cuivre);color:#fff;padding:6px 10px;border-radius:999px}
.card .price .per{font-style:normal;font-size:10px;letter-spacing:.06em;color:var(--graphite);margin-left:8px}
.card.pack .price .per{color:var(--pierre)}
.c-none svg circle{fill:#E6DCC7}.card.pack .c-none svg circle{fill:#262c63}
/* Pages produit */
.pd .crumbs a{color:inherit}
.pd-grid{display:grid;gap:clamp(24px,4vw,56px);margin-top:18px}
@media (min-width:900px){.pd-grid{grid-template-columns:1.05fr .95fr;align-items:start}}
.pd-img{margin:0;border-radius:6px;overflow:hidden;aspect-ratio:4/3;background:var(--pierre)}
.pd-img img{width:100%;height:100%;object-fit:cover;display:block}
.pd-img.c-none svg{width:12%}
@media (max-width:899px){.pd-img{margin-inline:calc(var(--gl)*-1) calc(var(--gr)*-1);border-radius:0}}
.pd-txt{display:grid;gap:16px;align-content:start}
.pd-h{font-size:clamp(38px,5vw,64px)!important}
.pd-price{font:400 clamp(26px,3vw,34px)/1 var(--display);color:var(--indigo);margin:4px 0 0}
.pd-price small{font:400 11px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--graphite);margin-right:8px}
.pd-price em{font:400 12px var(--mono);color:var(--graphite);font-style:normal;margin-left:8px}
.pd-f{list-style:none;margin:0;padding:0;display:grid}
.pd-f li{display:flex;justify-content:space-between;gap:16px;padding:11px 0;border-top:1.5px dashed var(--pierre);font-size:15.5px}
.pd-f li:last-child{border-bottom:1.5px dashed var(--pierre)}
.pd-f b{font:400 14px var(--mono);color:var(--cuivre);white-space:nowrap}
.pd-cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.pd-trust{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:6px;font-size:14px;color:var(--graphite)}
.pd-trust li::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--cuivre);margin-right:10px;vertical-align:middle}
.pd-rel{margin-top:clamp(40px,6vw,72px);max-width:760px}
.cat-all{margin-top:clamp(48px,7vw,88px);display:grid;gap:28px}
@media (min-width:900px){.cat-all{grid-template-columns:repeat(4,1fr)}}
.cat-all h3{font:400 13px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--graphite);margin:0 0 10px}
.cat-all ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.cat-all a{color:var(--indigo);text-decoration:none;font-size:15px}
.cat-all a:hover{text-decoration:underline}
/* rayons du catalogue */
#cards .shelf-h{grid-column:1/-1;display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:28px 0 6px;border-bottom:1px solid rgba(27,31,77,.14);margin-bottom:4px}
#cards .shelf-h:first-child{padding-top:4px}
#cards .shelf-h h2{margin:0;font-size:clamp(26px,3vw,36px)}
#cards .shelf-more{background:none;border:0;padding:6px 0;font-family:inherit;font-weight:500;font-size:15px;line-height:1.2;color:var(--cuivre,#B5652F);cursor:pointer;white-space:nowrap}
#cards .shelf-more:hover{text-decoration:underline;text-underline-offset:4px}
@media(max-width:700px){#cards .shelf-h{padding-top:22px}#cards .shelf-h h2{font-size:26px}#cards .shelf-more{font-size:14px}}
@media (min-width:1180px){#cards.shelves{grid-template-columns:repeat(4,1fr)}}
/* ================= Votre compte à rebours ================= */
.cr-intro{display:grid;gap:22px;max-width:980px}
.cr-hero .h-page{font-size:clamp(50px,7.4vw,112px)}
.cr-sec{padding-top:0}
.cr-wrap{display:grid;gap:clamp(28px,4vw,56px);align-items:start}
@media (min-width:1000px){.cr-wrap{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr)}.cr-wrap:has(.cr.res){grid-template-columns:1fr}}
.cr{background:var(--papier);border:1px solid rgba(30,35,80,.12);border-radius:6px;padding:clamp(26px,4vw,56px);min-height:560px;display:flex;flex-direction:column;box-shadow:0 30px 60px -40px rgba(18,20,47,.35)}
.cr.res{min-height:0}
.cr-dots{display:flex;gap:6px;margin-bottom:clamp(28px,4vw,44px)}
.cr-dots i{flex:1;height:3px;border-radius:2px;background:rgba(30,35,80,.12);transition:background .4s}
.cr-dots i.on{background:var(--indigo)}
.cr-dots i.now{background:var(--cuivre)}
.cr-screen{flex:1;display:grid;align-content:start;gap:18px}
.cr-k{font:400 11px/1.4 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--graphite)}
.cr-q{font-size:clamp(34px,4.2vw,58px);line-height:1.02;letter-spacing:-.03em;color:var(--indigo);outline:none}
.cr-q em{font-style:italic;color:var(--cuivre)}
.cr-h{color:var(--graphite);max-width:54ch;margin:0}
.cr-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.cr-grid{display:grid;gap:10px;margin-top:10px}
@media (min-width:640px){.cr-grid{grid-template-columns:1fr 1fr}}
.cr-o{display:grid;gap:4px;text-align:left;padding:20px 22px;border:1px solid rgba(30,35,80,.16);border-radius:6px;background:rgba(255,255,255,.45);color:var(--encre);cursor:pointer;font:inherit;transition:border-color .25s,background .25s,transform .25s}
.cr-o b{font:400 25px/1.1 var(--display);color:var(--indigo);letter-spacing:-.015em}
.cr-o span{font-size:14.5px;line-height:1.4;color:var(--graphite)}
.cr-o:hover{border-color:var(--indigo);transform:translateY(-1px)}
.cr-o.on{background:var(--indigo);border-color:var(--indigo)}
.cr-o.on b,.cr-o.on span{color:var(--raphia)}
.cr-date{display:block;margin-top:14px;max-width:440px}
.cr-date input{width:100%;box-sizing:border-box;font:300 clamp(30px,3.6vw,42px)/1.1 var(--display);color:var(--indigo);background:transparent;border:0;border-bottom:2px solid var(--indigo);padding:10px 2px 12px;border-radius:0;-webkit-appearance:none;appearance:none;min-height:64px}
.cr-date input:focus{outline:none;border-bottom-color:var(--cuivre)}
.cr-err{min-height:1.4em;margin:0;color:#9A3B22;font-size:15px}
.cr-chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}
.cr-c{display:inline-flex;align-items:center;gap:10px;height:52px;padding:0 22px;border-radius:999px;border:1px solid rgba(30,35,80,.2);background:rgba(255,255,255,.45);color:var(--indigo);font:500 17px var(--sans);cursor:pointer;transition:background .25s,border-color .25s}
.cr-c:hover{border-color:var(--indigo)}
.cr-c.on{background:var(--indigo);border-color:var(--indigo);color:var(--raphia)}
.cr-other{padding-right:12px}
.cr-other input{width:84px;border:0;border-bottom:1.5px solid currentColor;background:transparent;color:inherit;font:inherit;padding:4px 2px;border-radius:0;-moz-appearance:textfield}
.cr-other input::-webkit-outer-spin-button,.cr-other input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.cr-other input:focus{outline:none}
.cr-unk{font-weight:400;color:var(--graphite)}
.cr-foot{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:clamp(28px,4vw,40px);padding-top:22px;border-top:1px dashed var(--pierre)}
.cr-foot:empty{display:none}
.cr-back{background:none;border:0;font:500 15px var(--sans);color:var(--graphite);cursor:pointer;padding:10px 0}
.cr-back:hover{color:var(--indigo)}
.cr-next[disabled]{opacity:.35;pointer-events:none}
/* l'encart « comment nous comptons » */
.cr-aside{display:grid;gap:16px;padding-top:8px}
.cr-aside[hidden]{display:none}
.cr-aside .h3{font-size:clamp(28px,2.6vw,36px);color:var(--indigo);line-height:1.05}
.cr-how{list-style:none;margin:8px 0 0;padding:0;display:grid}
.cr-how li{display:grid;grid-template-columns:96px 1fr;gap:16px;padding:18px 0;border-top:1px solid rgba(30,35,80,.12)}
.cr-how b{font:300 30px/1 var(--display);color:var(--cuivre);letter-spacing:-.02em}
.cr-how h3{font:500 16px/1.3 var(--sans);color:var(--indigo);letter-spacing:0;margin-bottom:4px}
.cr-how p{margin:0;font-size:14.5px;line-height:1.5;color:var(--graphite)}
/* le résultat */
.cr-sum{margin:0;font:400 12px/1.5 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--graphite)}
.cr-notes{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:8px}
.cr-notes li{padding:14px 18px;border-left:3px solid var(--cuivre);background:rgba(180,105,58,.08);font-size:15.5px;line-height:1.5;color:var(--encre);border-radius:0 4px 4px 0}
.cr-res{display:grid;gap:clamp(28px,4vw,56px);margin-top:clamp(14px,2vw,24px);align-items:start}
@media (min-width:1000px){.cr-res{grid-template-columns:minmax(0,1.5fr) minmax(320px,1fr)}.cr-act{position:sticky;top:96px}}
.cr-tl{list-style:none;margin:0;padding:0}
.cr-tl li{display:grid;grid-template-columns:64px 1fr;gap:18px}
.cr-dt{text-align:right;padding-top:2px}
.cr-dt b{display:block;font:300 40px/1 var(--display);color:var(--indigo);letter-spacing:-.03em}
.cr-dt span{display:block;margin-top:4px;font:400 10.5px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--graphite)}
.cr-tx{position:relative;padding:0 0 28px 26px;border-left:1.5px solid rgba(30,35,80,.2)}
.cr-tl li:last-child .cr-tx{border-left-color:transparent;padding-bottom:0}
.cr-tx::before{content:"";position:absolute;left:-7px;top:9px;width:12px;height:12px;border-radius:50%;background:var(--indigo);box-shadow:0 0 0 4px var(--papier)}
.cr-tx em{display:block;font:400 10.5px/1.4 var(--mono);font-style:normal;letter-spacing:.12em;text-transform:uppercase;color:var(--cuivre)}
.cr-tx h3{margin:5px 0 4px;font:500 18px/1.3 var(--sans);letter-spacing:0;color:var(--indigo)}
.cr-tx p{margin:0;font-size:15px;line-height:1.5;color:var(--graphite)}
.cr-now .cr-tx::before{background:var(--papier);box-shadow:0 0 0 2px var(--cuivre),0 0 0 6px var(--papier)}
.cr-now .cr-dt b{color:var(--cuivre)}
.cr-tl li.t3 .cr-tx h3{font-family:var(--display);font-weight:400;font-size:23px;letter-spacing:-.01em}
.cr-j .cr-tx::before{width:16px;height:16px;left:-9px;top:7px;background:var(--cuivre)}
.cr-j .cr-tx h3{font:italic 300 30px/1.1 var(--display);color:var(--cuivre);letter-spacing:-.02em}
.cr-j .cr-dt b{color:var(--cuivre)}
.cr-tl li.past{opacity:.45}
.cr-act{background:var(--indigo);color:var(--raphia);border-radius:6px;padding:clamp(24px,3vw,34px);display:grid;gap:12px}
.cr-act-k{margin:0 0 4px;font:400 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--cuivre-clair)}
.cr-act .btn{width:100%;justify-content:center;height:auto;min-height:56px;padding:14px 22px;text-align:center;line-height:1.25;white-space:normal}
.cr-act .cr-wa{background:var(--raphia);color:var(--indigo)}
.cr-act .btn.line{color:var(--raphia);box-shadow:inset 0 0 0 1.5px rgba(238,230,212,.55)}
.cr-act .btn::after{display:none}
.wa-i{width:20px;height:20px;flex:none}
.cr-mini{display:grid;margin-top:6px;border-top:1px solid rgba(238,230,212,.18)}
.cr-mini button{display:flex;justify-content:space-between;align-items:center;width:100%;background:none;border:0;border-bottom:1px solid rgba(238,230,212,.18);color:var(--raphia);font:500 15px var(--sans);text-align:left;padding:15px 2px;cursor:pointer}
.cr-mini button::after{content:"→";color:var(--cuivre-clair);transition:transform .3s}
.cr-mini button:hover::after{transform:translateX(4px)}
.cr-mini button[disabled]{opacity:.5}
.cr-fine{margin:6px 0 0;font-size:13px;line-height:1.5;color:rgba(238,230,212,.7)}
.cr-bar{display:none}
.cr-faq .wrap{display:grid;gap:18px;max-width:900px}
@media (max-width:699px){
  .cr-sec .wrap.cr-wrap{padding-inline:0}
  .cr{border-radius:0;border-inline:0;padding:26px 18px 0;min-height:calc(100svh - 150px);box-shadow:none}
  .cr.res{padding-bottom:0}
  .cr-q{font-size:34px}
  .cr-o{padding:16px 18px}
  .cr-o b{font-size:22px}
  .cr-foot{position:sticky;bottom:0;margin:28px -18px 0;padding:14px 18px calc(14px + env(safe-area-inset-bottom,0px));background:var(--papier);border-top:1px solid rgba(30,35,80,.12);z-index:5}
  .cr-foot .cr-next{flex:1;justify-content:center;max-width:260px}
  .cr-aside{padding:6px 16px 0}
  .cr-how li{grid-template-columns:80px 1fr}
  .cr-tl li{grid-template-columns:50px 1fr;gap:14px}
  .cr-dt b{font-size:32px}
  .cr-tx{padding-left:20px}
  .cr-act{margin:0 -18px;border-radius:0}
  .cr-bar{display:block;position:fixed;left:16px;right:16px;bottom:calc(14px + env(safe-area-inset-bottom,0px));z-index:65;transition:transform .5s var(--ease),opacity .5s}
  .cr-bar[hidden]{display:none}
  .cr-bar .btn{width:100%;justify-content:center;box-shadow:0 18px 40px -14px rgba(18,20,47,.7)}
  .cr-bar.away,html.has-cartbar .cr-bar{transform:translateY(160%);opacity:0;pointer-events:none}
}
.cr[data-step="0"] .cr-foot{display:none}
.cr-link{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:clamp(32px,4vw,48px)}
.cr-link span{font-size:15px;color:rgba(238,230,212,.75)}
.cr-link .btn.light,.cr-link .btn.light span{color:var(--indigo)}
.ureal-fig.tall{background:var(--papier);display:grid;place-items:center;padding:clamp(18px,3vw,36px)}
.ureal-fig.tall img{width:auto;max-width:100%;max-height:min(78vh,760px);border-radius:3px;box-shadow:0 24px 50px -30px rgba(18,20,47,.55)}
@media (max-width:699px){.ureal-fig.tall img{max-height:none;width:100%}}