/* Atelier Brume — papier coton, bleu de Prusse, cartels de musée */
:root{
  --ct-bg:#f2ede3;--ct-surface:#e8e0d0;--ct-ink:#1e1c18;--ct-muted:#6a6356;--ct-line:#d5ccba;
  --ct-accent:#1f3a5f;--ct-accent-ink:#f6f1e7;--ct-good:#3d6b4a;--ct-warn:#9a5a12;--ct-err:#a3321f;--ct-star:#1f3a5f;
  --ct-radius:2px;--ct-radius-sm:2px;--ct-btn-radius:1px;--ct-btn-case:uppercase;--ct-btn-track:.12em;--ct-btn-weight:600;
  --ct-font-display:"Gloock",Georgia,serif;--ct-font-body:"Karla",system-ui,sans-serif;--ct-card-ratio:5/4;--ct-pdp-ratio:5/4;
  --ct-shadow:0 30px 60px -30px rgba(40,30,15,.45);--ct-ease:cubic-bezier(.25,.8,.25,1);--ct-max:1280px;
  --display-weight:400;--body-size:16.5px;--logo-size:25px;--nav-size:13px;--nav-case:uppercase;--nav-track:.14em;--nav-weight:600;
  --hd-bg:rgba(242,237,227,.94);--announce-bg:#1f3a5f;--announce-ink:#f2ede3;--ft-bg:#1e1c18;--ft-ink:#efe8da;--ft-muted:#a79f90;--ft-line:#3a362f;
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .35 0 0 0 0 .28 0 0 0 0 .18 0 0 0 .09 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")
}
body{background-image:var(--grain)}
::selection{background:#1f3a5f;color:#f2ede3}
.ct-btn{font-size:12.5px;min-height:50px;padding:0 26px}
.ct-btn:hover{background:#16304f;box-shadow:none}
.ct-btn-ghost:hover{background:transparent;border-color:var(--ct-ink)}
.b-link{display:inline-block;font:600 12.5px/1 var(--ct-font-body);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;padding:6px 0;background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat;transition:background-size .35s var(--ct-ease)}
.b-link:hover{background-size:0 1px;background-position:100% 100%}
.eyebrow{letter-spacing:.2em;font-size:11.5px}

/* en-tête : logo centré, typographie de cartel */
.logo{display:inline-flex;flex-direction:column;align-items:center;line-height:.9}
.lg-a{font:600 10px/1 var(--ct-font-body);letter-spacing:.42em;text-transform:uppercase;margin-bottom:4px;padding-left:.42em}
.lg-b{font-family:var(--ct-font-display);font-size:28px;letter-spacing:-.01em}
@media(min-width:900px){
  .hd-center .hd-in{display:grid;grid-template-columns:1fr auto 1fr;min-height:84px}
  .hd-center .logo{grid-column:2;grid-row:1}
  .hd-center .hd-nav{grid-column:1;grid-row:1;margin-left:0}
  .hd-center .hd-act{grid-column:3;grid-row:1}
}
.hd{border-bottom:1px solid var(--ct-line)}

/* cartes : les tirages sont présentés sous passe-partout */
.ct-card-media{background:#e9e1d1}
.ct-card[data-cat=tirages] .ct-card-media{background:#fbf8f1;box-shadow:inset 0 0 0 1px #e2d9c8}
.ct-card[data-cat=tirages] .ct-card-media img{inset:11%;width:78%;height:78%;box-shadow:0 1px 2px rgba(0,0,0,.18),0 12px 22px -14px rgba(40,30,15,.6)}
.ct-card[data-cat=tirages] .ct-card-b{inset:0;width:100%;height:100%;box-shadow:none}
.ct-card-title{font:400 19px/1.25 var(--ct-font-display)}
.ct-card-sub{font-size:13px}
.ct-card-price{font-size:14px;letter-spacing:.02em}
.ct-badge{border-radius:0;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;padding:5px 8px}
.ct-quick{border-radius:0!important}
.ct-pdp[data-cat],[data-cat=tirages] .ct-gallery-main{background:#fbf8f1}
[data-cat=tirages] .ct-shot{padding:9%;display:grid;place-items:center}
[data-cat=tirages] .ct-shot img{height:auto;max-height:100%;object-fit:contain;box-shadow:0 1px 2px rgba(0,0,0,.2),0 30px 50px -28px rgba(40,30,15,.7)}
.ct-title{font-size:clamp(34px,4vw,52px)}
.ct-kicker{letter-spacing:.24em}
.ct-opt span{border-radius:0;font-size:14px}
.ct-chips button{border-radius:0;text-transform:uppercase;letter-spacing:.1em;font-size:12px;font-weight:600}
.ct-search,.ct-sort select{border-radius:0}

/* ACCUEIL */
.b-hero{display:grid;gap:36px;padding-top:clamp(28px,5vw,64px);padding-bottom:clamp(56px,8vw,110px)}
@media(min-width:900px){.b-hero{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:center;gap:clamp(40px,6vw,90px)}}
.b-hero h1{font-size:clamp(40px,5.6vw,78px);line-height:1.02;letter-spacing:-.022em}
.b-hero-p{font-size:clamp(17px,1.5vw,19px);color:var(--ct-muted);max-width:44ch;margin:22px 0 30px}
.b-hero-cta{display:flex;flex-wrap:wrap;align-items:center;gap:22px 30px}
.b-hero-art{margin:0}
.b-frame{position:relative;display:block;padding:clamp(14px,1.6vw,22px);background:#3b2f22;background:linear-gradient(135deg,#6b5134,#3e2f1f 55%,#5a432b);box-shadow:0 40px 70px -35px rgba(40,25,10,.7),0 3px 6px rgba(0,0,0,.2);transform-origin:50% -40px;animation:hang 1.8s cubic-bezier(.3,1.6,.5,1) .15s both}
.b-mat{display:block;padding:clamp(18px,3.2vw,46px);background:#fbf8f1;box-shadow:inset 0 0 0 1px rgba(0,0,0,.06),inset 2px 3px 6px rgba(0,0,0,.14)}
.b-mat img{width:100%;height:auto;box-shadow:0 0 0 1px rgba(0,0,0,.05)}
.b-wire{position:absolute;left:50%;top:-54px;width:44%;height:54px;transform:translateX(-50%);pointer-events:none}
.b-wire::before,.b-wire::after{content:"";position:absolute;top:0;width:54%;height:1px;background:#7a6c57}
.b-wire::before{right:50%;transform-origin:100% 0;transform:rotate(-22deg)}
.b-wire::after{left:50%;transform-origin:0 0;transform:rotate(22deg)}
.b-hero-art{position:relative}.b-hero-art::before{content:"";position:absolute;left:50%;top:-58px;width:9px;height:9px;margin-left:-4px;border-radius:50%;background:#8d7f68;box-shadow:0 2px 3px rgba(0,0,0,.3);z-index:2}
@media(max-width:899px){.b-hero-art::before{display:none}}
@media(max-width:899px){.b-wire{display:none}.b-frame{animation-name:hang-m}}
@keyframes hang{0%{opacity:0;transform:translateY(-26px) rotate(-3.5deg)}40%{opacity:1}70%{transform:rotate(1.2deg)}100%{transform:none}}
@keyframes hang-m{0%{opacity:0;transform:translateY(-14px)}100%{transform:none}}
.b-frame:hover{animation:swing 1.2s ease-in-out}
@keyframes swing{25%{transform:rotate(-1deg)}60%{transform:rotate(.6deg)}}
.b-label{display:inline-block;margin:26px 0 0;padding:10px 14px;background:#fbf8f1;border:1px solid var(--ct-line);font:500 13px/1.4 var(--ct-font-body);color:var(--ct-muted);box-shadow:0 8px 20px -14px rgba(0,0,0,.4)}

/* accrochage « salon » : cadres de tailles et de hauteurs différentes */
.b-wall{padding:clamp(56px,8vw,110px) 0;background:#e6ddcb;background-image:var(--grain)}
.b-wall-head{display:grid;gap:10px;margin-bottom:clamp(30px,5vw,60px)}
@media(min-width:900px){.b-wall-head{grid-template-columns:1fr 1fr;align-items:end}}
.b-wall h2{font-size:clamp(32px,4vw,54px)}
.b-wall-head p{margin:0;color:var(--ct-muted);max-width:46ch}
.b-salon{display:grid;gap:clamp(18px,2.4vw,34px);grid-template-columns:repeat(2,1fr);align-items:start}
@media(min-width:900px){.b-salon{grid-template-columns:repeat(12,1fr);grid-auto-rows:34px}
  .w-a{grid-column:1/6;grid-row:1/10}.w-b{grid-column:6/9;grid-row:2/7}.w-c{grid-column:9/13;grid-row:1/8}
  .w-d{grid-column:6/9;grid-row:7/11}.w-e{grid-column:9/12;grid-row:8/13}.w-f{grid-column:2/5;grid-row:10/15}.w-g{grid-column:5/9;grid-row:11/16}}
.b-piece{position:relative;display:block;text-decoration:none;height:100%;min-height:0}
.b-piece .b-mat{height:100%;padding:9%;background:#fbf8f1;box-shadow:0 0 0 clamp(6px,.8vw,10px) #2b2319,0 30px 40px -24px rgba(30,20,8,.65);transition:transform .5s var(--ct-ease),box-shadow .5s var(--ct-ease)}
.b-piece:nth-child(3n) .b-mat{box-shadow:0 0 0 clamp(6px,.8vw,10px) #c8b48f,0 30px 40px -24px rgba(30,20,8,.55)}
.b-piece:nth-child(4n+1) .b-mat{box-shadow:0 0 0 clamp(5px,.6vw,8px) #f7f3ea,0 0 0 calc(clamp(5px,.6vw,8px) + 1px) #cfc4ae,0 30px 40px -24px rgba(30,20,8,.5)}
.b-piece img{width:100%;height:100%;object-fit:cover}
@media(max-width:899px){.b-salon{row-gap:34px}.b-piece{height:auto}.b-piece .b-mat{aspect-ratio:4/3.3;height:auto}.b-piece .b-mat img{height:100%}}
.b-piece:hover .b-mat{transform:translateY(-6px) rotate(-.4deg)}
.b-cartel{position:absolute;left:50%;bottom:-14px;transform:translate(-50%,6px);z-index:2;width:max-content;max-width:92%;padding:7px 11px;background:#fffdf8;border:1px solid #ddd3c1;font:12px/1.3 var(--ct-font-body);opacity:0;transition:opacity .3s,transform .4s var(--ct-ease);text-align:center;box-shadow:0 8px 18px -10px rgba(0,0,0,.4)}
.b-cartel b{display:block;font:15px/1.2 var(--ct-font-display);font-weight:400}.b-cartel small{color:var(--ct-muted)}
.b-piece:hover .b-cartel,.b-piece:focus-visible .b-cartel{opacity:1;transform:translate(-50%,0)}
@media(hover:none){.b-cartel{position:static;transform:none;opacity:1;margin-top:18px;width:auto;max-width:none;text-align:left;border:0;background:none;box-shadow:none;padding:0}}
.b-wall-more{margin-top:clamp(40px,5vw,70px);text-align:center}

/* procédé */
.b-process{display:grid;gap:40px;padding-top:clamp(64px,9vw,130px);padding-bottom:clamp(64px,9vw,130px)}
@media(min-width:900px){.b-process{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(40px,6vw,96px);align-items:center}}
.b-process-img img{width:100%;aspect-ratio:4/5;object-fit:cover;filter:saturate(.85) contrast(1.02)}
.b-process h2{font-size:clamp(32px,4vw,56px);margin-bottom:34px}
.b-steps{list-style:none;margin:0;padding:0;display:grid;gap:0}
.b-steps li{display:grid;grid-template-columns:110px 1fr;gap:4px 24px;padding:22px 0;border-top:1px solid var(--ct-line)}
.b-steps li:last-child{border-bottom:1px solid var(--ct-line)}
.b-num{grid-row:span 2;font:400 clamp(26px,2.6vw,34px)/1 var(--ct-font-display);color:var(--ct-accent);letter-spacing:-.02em}
.b-steps h3{font:700 15px/1.3 var(--ct-font-body);letter-spacing:.02em}
.b-steps p{margin:4px 0 0;color:var(--ct-muted)}

/* formats à l'échelle */
.b-formats{background:#1f3a5f;color:#efe8da;padding:clamp(64px,9vw,120px) 0}
.b-formats .eyebrow{color:#a9b8cc}
.b-formats-in{display:grid;gap:36px}
@media(min-width:900px){.b-formats-in{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:center;gap:72px}}
.b-formats h2{font-size:clamp(32px,4vw,54px);margin-bottom:14px}
.b-formats p{color:#c8d1dc;max-width:40ch}
.b-fmt-btns{display:flex;flex-wrap:wrap;gap:8px;margin:26px 0 14px}
.b-fmt-btns button{display:grid;min-width:96px;padding:12px 16px;border:1px solid #5d7594;background:transparent;color:#efe8da;font:600 15px var(--ct-font-body);cursor:pointer;text-align:left;transition:background .2s,border-color .2s}
.b-fmt-btns small{font-weight:400;color:#a9b8cc;font-size:12px}
.b-fmt-btns [aria-checked=true]{background:#efe8da;color:#1f3a5f;border-color:#efe8da}
.b-fmt-btns [aria-checked=true] small{color:#4a5e78}
.b-fmt-tip{min-height:3.2em}
.b-scene{width:100%;height:auto}
.sc-floor{stroke:#5d7594;stroke-width:1.5}
.sc-sofa rect{fill:#2f4d74;stroke:#8fa4bf;stroke-width:1}
.sc-f{fill:#6b5134;transition:all .6s cubic-bezier(.5,1.4,.5,1)}
.sc-art{fill:#fbf8f1;transition:all .6s cubic-bezier(.5,1.4,.5,1)}
.sc-t{fill:#a9b8cc;font:12px var(--ct-font-body)}

.b-shop{padding-top:clamp(64px,9vw,120px);padding-bottom:clamp(40px,6vw,80px)}
.b-row-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:28px}
.b-row-head h2{font-size:clamp(28px,3.4vw,44px)}
.b-about{padding:clamp(48px,7vw,100px) 0 clamp(64px,9vw,130px)}
.b-about-in{display:grid;gap:36px}
@media(min-width:900px){.b-about-in{grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(40px,6vw,96px);align-items:center}}
.b-about-img img{width:100%;aspect-ratio:3/2;object-fit:cover}
.b-about h2{font-size:clamp(30px,3.6vw,48px);margin-bottom:18px}
.b-about p{color:var(--ct-muted);max-width:52ch}
.b-next{margin-top:28px;padding:20px;border:1px solid var(--ct-line);background:#f8f4ec;display:grid;gap:14px;justify-items:start}
.b-next p{margin:0;color:var(--ct-ink)}
.b-visit{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px;padding-top:26px;padding-bottom:26px;border-top:1px solid var(--ct-line);margin-bottom:clamp(40px,6vw,80px)}
.b-visit p{margin:0}.b-visit b{font-family:var(--ct-font-display);font-weight:400;font-size:20px;margin-right:10px}

/* À propos */
.ab-hero{padding-top:clamp(32px,6vw,80px)}.ab-hero h1{font-size:clamp(36px,5.4vw,72px);max-width:18ch}
.ab-grid{display:grid;gap:40px;padding-top:40px;padding-bottom:clamp(64px,9vw,120px)}
@media(min-width:900px){.ab-grid{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:80px;align-items:start}.ab-img{position:sticky;top:110px}}
.ab-img img{width:100%;aspect-ratio:4/5;object-fit:cover}
.ab-txt h2{font-size:26px;margin:34px 0 10px}
.ab-txt p,.ab-txt li{color:var(--ct-muted);line-height:1.7}

/* pied */
.ft .logo{color:#efe8da}
.ft-form input{color:#efe8da}
.ft-form{border-color:#6f675a}