:root{
  --creme:#F3E9DA; --creme-2:#EADBC4; --sable:#E0CBAA;
  --brun:#6B3A1E; --brun-fonce:#3E2213; --brun-clair:#9A5A33;
  --braise:#D9692B; --texte:#2B1A10; --gris:#6E5D50; --blanc:#fff;
  --rayon:14px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{font-family:Manrope,system-ui,sans-serif;color:var(--texte);background:var(--creme);line-height:1.6;-webkit-font-smoothing:antialiased}
h1,h2,h3,.serif{font-family:Fraunces,Georgia,serif;color:var(--brun-fonce);line-height:1.12}
a{color:inherit}
[hidden]{display:none!important}
.wrap{max-width:1200px;margin:0 auto;padding:0 24px}
section{padding:88px 0;scroll-margin-top:76px}
.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:.76rem;font-weight:700;color:var(--brun-clair)}
.titre-section{max-width:680px;margin-bottom:40px}
.titre-section h2{font-size:clamp(1.9rem,4vw,2.9rem);margin:.3em 0 .4em}
.titre-section p{color:var(--gris);font-size:1.05rem}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;padding:13px 22px;border-radius:999px;font:inherit;font-weight:700;text-decoration:none;border:2px solid var(--brun);cursor:pointer;transition:.2s;white-space:nowrap}
.btn-plein{background:var(--brun);color:var(--creme)}
.btn-plein:hover{background:var(--brun-fonce);border-color:var(--brun-fonce)}
.btn-vide{background:transparent;color:var(--brun)}
.btn-vide:hover{background:var(--brun);color:var(--creme)}
.btn-petit{padding:8px 14px;font-size:.86rem}
.btn:disabled{opacity:.45;cursor:not-allowed}

/* Header */
header.site{position:sticky;top:0;z-index:50;background:rgba(243,233,218,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--sable)}
.nav{display:flex;align-items:center;justify-content:space-between;height:74px;gap:20px}
.marque{display:flex;align-items:center;gap:12px;text-decoration:none}
.marque img{width:40px;height:40px}
.marque span{font-family:Fraunces,serif;font-weight:800;font-size:1.45rem;color:var(--brun)}
.nav ul{display:flex;gap:28px;list-style:none;align-items:center}
.nav ul a{text-decoration:none;font-weight:600;font-size:.95rem}
.nav ul a:hover,.nav ul a.actif{color:var(--brun-clair)}
.nav ul a.actif{text-decoration:underline;text-underline-offset:6px}
.panier-btn{background:var(--brun);border:0;border-radius:999px;padding:9px 16px;font:inherit;font-weight:700;color:var(--creme);cursor:pointer}
.panier-btn b{background:var(--braise);color:#fff;border-radius:999px;padding:0 7px;margin-left:6px;font-size:.8rem}
.burger{display:none;background:none;border:0;font-size:1.6rem;color:var(--brun);cursor:pointer}

/* Accueil */
.hero{padding:40px 0 72px}
.hero-haut{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:end;margin-bottom:36px}
.hero-haut h1{font-size:clamp(2.4rem,5.2vw,4.2rem);font-weight:800;letter-spacing:-.02em}
.hero-haut h1 em{color:var(--brun-clair)}
.hero-haut p{color:var(--gris);font-size:1.1rem}
.portes{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.porte{display:flex;flex-direction:column;border-radius:22px;overflow:hidden;text-decoration:none;background:#fff;border:1px solid var(--sable);transition:transform .25s,box-shadow .25s}
.porte:hover{transform:translateY(-6px);box-shadow:0 22px 44px rgba(62,34,19,.18)}
.porte .vis{height:250px;position:relative;overflow:hidden}
.porte .vis svg{width:100%;height:100%;display:block}
.porte .txt{padding:24px 24px 26px;display:flex;flex-direction:column;flex:1}
.porte .num{font-family:Fraunces,serif;font-weight:800;color:var(--braise);font-size:.95rem}
.porte h2{font-size:1.8rem;margin:4px 0 8px}
.porte p{color:var(--gris);font-size:.96rem;flex:1;margin-bottom:18px}
.porte .go{font-weight:700;color:var(--brun);display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--sable);padding-top:14px}
.porte .go span:last-child{width:38px;height:38px;border-radius:50%;background:var(--brun);color:var(--creme);display:grid;place-items:center;transition:.2s}
.porte:hover .go span:last-child{background:var(--braise)}
.p1 .vis{background:#EAD7BC}.p2 .vis{background:#E9DCC8}.p3 .vis{background:#3E2213}
.vignettes{position:absolute;inset:0}
.vignettes>div{position:absolute;width:46%;border-radius:12px;overflow:hidden;box-shadow:0 10px 24px rgba(62,34,19,.22);background:#fff}
.vignettes svg{display:block;width:100%;height:auto}
.machines{display:flex;gap:14px;flex-wrap:wrap;margin-top:26px;align-items:center;color:var(--gris);font-size:.9rem}
.machines span.m{background:var(--creme-2);border-radius:999px;padding:6px 14px;font-weight:600;color:var(--brun-fonce)}

.occasions{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.occasion{background:#fff;border:1px solid var(--sable);border-radius:16px;padding:20px 14px;text-align:center;text-decoration:none;font-weight:700;transition:.2s}
.occasion:hover{border-color:var(--brun);transform:translateY(-3px)}
.occasion div{font-size:1.9rem;margin-bottom:6px}

.etapes{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;counter-reset:e}
.etape{padding:28px;border-radius:var(--rayon);background:#fff;border:1px solid var(--sable)}
.etape::before{counter-increment:e;content:"0" counter(e);font-family:Fraunces,serif;font-size:2.4rem;font-weight:800;color:var(--sable);display:block;margin-bottom:6px}
.etape h3{font-size:1.2rem;margin-bottom:6px}
.etape p{font-size:.95rem;color:var(--gris)}

.bandeau-livraison{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.bandeau-livraison div{background:var(--brun-fonce);color:var(--creme);border-radius:var(--rayon);padding:22px}
.bandeau-livraison b{display:block;font-family:Fraunces,serif;font-size:1.15rem;margin:6px 0 2px}
.bandeau-livraison span{color:#d8c4aa;font-size:.88rem}

/* Produits */
.filtres{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px;align-items:center}
.filtres button{border:1.5px solid var(--brun);background:transparent;color:var(--brun);padding:7px 16px;border-radius:999px;font:inherit;font-weight:600;cursor:pointer;font-size:.92rem}
.filtres button.actif{background:var(--brun);color:var(--creme)}
.filtres .lbl{font-weight:700;font-size:.85rem;color:var(--gris);margin-right:4px;min-width:84px}
.grille-produits{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:28px}
.produit{background:#fff;border-radius:var(--rayon);overflow:hidden;display:flex;flex-direction:column;border:1px solid var(--sable)}
.produit .vis{aspect-ratio:4/3;position:relative;background:var(--creme-2);display:grid;place-items:center;overflow:hidden}
.produit .vis svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.produit .tag{position:absolute;top:10px;left:10px;background:rgba(255,255,255,.92);font-size:.7rem;font-weight:700;padding:3px 10px;border-radius:999px;text-transform:uppercase;letter-spacing:.07em}
.produit .tag.perso{top:auto;bottom:10px;background:var(--braise);color:#fff}
.produit .corps{padding:16px 16px 18px;display:flex;flex-direction:column;flex:1}
.produit h3{font-size:1.08rem;margin-bottom:4px}
.produit p{font-size:.86rem;color:var(--gris);flex:1;margin-bottom:12px}
.produit .prix{font-family:Fraunces,serif;font-weight:700;font-size:1.2rem;color:var(--brun);margin-bottom:12px}
.produit .actions{display:flex;gap:8px}
.produit .actions .btn{flex:1;padding:9px 10px;font-size:.84rem}
.vide-filtre{grid-column:1/-1;text-align:center;color:var(--gris);padding:40px}

/* Choix objet perso */
.grille-objets{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.objet{background:#fff;border:1px solid var(--sable);border-radius:18px;overflow:hidden;text-decoration:none;transition:.2s;display:flex;flex-direction:column}
.objet:hover{transform:translateY(-4px);box-shadow:0 16px 30px rgba(62,34,19,.14);border-color:var(--brun)}
.objet .vis{aspect-ratio:4/3;background:var(--creme-2);position:relative;overflow:hidden}
.objet .vis svg{position:absolute;inset:14px;width:calc(100% - 28px);height:calc(100% - 28px)}
.objet .t{padding:16px 18px}
.objet h3{font-size:1.1rem}
.objet span{color:var(--gris);font-size:.88rem}

/* Éditeur */
.editeur{display:grid;grid-template-columns:1fr 380px;gap:28px;align-items:start}
.scene{background:#fff;border:1px solid var(--sable);border-radius:20px;overflow:hidden;position:sticky;top:92px}
.barre{display:flex;gap:8px;flex-wrap:wrap;padding:14px;border-bottom:1px solid var(--sable);background:var(--creme)}
.barre button,.barre label.btn{font-size:.85rem;padding:8px 14px}
.toile{background:repeating-conic-gradient(#f4ede2 0 25%,#efe6d8 0 50%) 0 0/24px 24px;padding:28px;display:grid;place-items:center;min-height:420px}
.toile svg{width:100%;max-height:62vh;touch-action:none;user-select:none;-webkit-user-select:none;overflow:visible}
.aide{padding:12px 16px;font-size:.84rem;color:var(--gris);border-top:1px solid var(--sable);display:flex;gap:16px;flex-wrap:wrap}
.calque{cursor:move}
.poignee{cursor:nwse-resize}
.poignee.rot{cursor:grab}
.panneau{display:grid;gap:16px}
.carte{background:#fff;border:1px solid var(--sable);border-radius:18px;padding:22px}
.carte h3{font-size:1.15rem;margin-bottom:12px}
.carte h2{font-size:1.6rem;margin-bottom:4px}
.pills{display:flex;gap:8px;flex-wrap:wrap}
.pills button{border:1.5px solid var(--sable);background:var(--creme);border-radius:12px;padding:8px 12px;font:inherit;font-size:.86rem;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:8px}
.pills button i{width:16px;height:16px;border-radius:50%;display:inline-block;border:1px solid rgba(0,0,0,.15)}
.pills button.actif{border-color:var(--brun);background:#fff}
.champ{margin-bottom:12px}
.champ label{display:block;font-size:.82rem;font-weight:700;color:var(--gris);margin-bottom:5px}
.champ input,.champ select,.champ textarea{width:100%;padding:11px 13px;border:1.5px solid var(--sable);border-radius:10px;font:inherit;background:var(--creme);color:var(--texte)}
.champ input[type=range]{padding:0;accent-color:var(--brun);background:none;border:0}
.champ input:focus,.champ select:focus,.champ textarea:focus{outline:none;border-color:var(--brun)}
.ligne-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ligne-3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.calques-liste{display:grid;gap:6px}
.calques-liste button{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:9px 12px;border-radius:10px;border:1.5px solid var(--sable);background:var(--creme);font:inherit;font-size:.88rem;cursor:pointer;text-align:left}
.calques-liste button.actif{border-color:var(--brun);background:#fff}
.calques-liste small{color:var(--gris)}
.prix-total{display:flex;justify-content:space-between;align-items:baseline;margin:6px 0 14px}
.prix-total b{font-family:Fraunces,serif;font-size:2rem;color:var(--brun)}
.qte-ctrl{display:flex;align-items:center;gap:10px}
.qte-ctrl button{width:34px;height:34px;border-radius:50%;border:1.5px solid var(--brun);background:none;color:var(--brun);font-weight:700;font-size:1.1rem;cursor:pointer}
.note-perso{font-size:.8rem;color:var(--gris);margin-top:10px}
.fil{font-size:.88rem;margin-bottom:16px;color:var(--gris)}
.fil a{text-decoration:none;color:var(--brun)}

/* Sur mesure */
.machines-cartes{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:56px}
.machine{background:var(--brun-fonce);color:var(--creme);border-radius:18px;padding:24px}
.machine h3{color:var(--creme);font-size:1.3rem;margin:8px 0 6px}
.machine p{color:#d8c4aa;font-size:.92rem}
.machine .ico{width:48px;height:48px;border-radius:12px;background:var(--creme);display:grid;place-items:center}
.devis-grille{display:grid;grid-template-columns:1.35fr .65fr;gap:28px;align-items:start}
.form-devis{background:#fff;border-radius:20px;padding:32px;border:1px solid var(--sable)}
.bloc{margin-bottom:26px}
.bloc .lbl{display:block;font-weight:700;margin-bottom:12px;color:var(--brun-fonce)}
.choix-service{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.choix-service label{border:2px solid var(--sable);border-radius:12px;padding:14px;cursor:pointer;text-align:center;font-weight:600;transition:.15s}
.choix-service input{display:none}
.choix-service span{display:flex;flex-direction:column;align-items:center;gap:6px}
.choix-service label:has(input:checked){border-color:var(--brun);background:var(--creme);color:var(--brun)}
.depot{display:block;border:2px dashed var(--sable);border-radius:12px;padding:22px;text-align:center;cursor:pointer;color:var(--gris);background:var(--creme)}
.depot:hover,.depot.survol{border-color:var(--brun);color:var(--brun)}
.depot input{display:none}
.depot .fichiers{margin-top:6px;font-weight:600;color:var(--brun)}
.options{display:flex;flex-wrap:wrap;gap:10px}
.options label{display:flex;gap:8px;align-items:center;background:var(--creme);padding:8px 14px;border-radius:999px;font-size:.9rem;cursor:pointer;border:1.5px solid transparent}
.options label:has(input:checked){border-color:var(--brun)}
.estimation{position:sticky;top:96px;background:var(--brun);color:var(--creme);border-radius:20px;padding:28px}
.estimation h3{color:var(--creme);font-size:1.25rem}
.estimation .fourchette{font-family:Fraunces,serif;font-size:2.3rem;font-weight:800;margin:12px 0 4px;color:#fff}
.estimation .note{font-size:.8rem;color:#e3cfb5}
.estimation dl{margin:20px 0;border-top:1px solid #8c5a3a}
.estimation dl div{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px solid #8c5a3a;font-size:.88rem}
.estimation dt{color:#e3cfb5}
.estimation dd{font-weight:700;text-align:right}
.estimation .delai{background:#5a3019;padding:12px 14px;border-radius:10px;font-size:.86rem}

/* Commande */
.commande{display:grid;grid-template-columns:1.2fr .8fr;gap:28px;align-items:start}
.recap-ligne{display:flex;gap:14px;align-items:center;padding:12px 0;border-bottom:1px solid var(--sable)}
.recap-ligne .mini{width:72px;height:54px;border-radius:8px;overflow:hidden;background:var(--creme-2);flex-shrink:0}
.recap-ligne .mini svg{width:100%;height:100%}
.recap-ligne .info{flex:1;font-size:.9rem}
.recap-ligne .info small{display:block;color:var(--gris)}
.livraisons{display:grid;gap:10px}
.livraisons label{display:flex;justify-content:space-between;align-items:center;gap:12px;border:2px solid var(--sable);border-radius:12px;padding:14px 16px;cursor:pointer;background:var(--creme)}
.livraisons label:has(input:checked){border-color:var(--brun);background:#fff}
.livraisons small{display:block;color:var(--gris)}
.totaux div{display:flex;justify-content:space-between;padding:6px 0;font-size:.95rem}
.totaux .grand{font-family:Fraunces,serif;font-size:1.5rem;font-weight:700;border-top:1px solid var(--sable);margin-top:6px;padding-top:12px}
.case{display:flex;gap:10px;align-items:flex-start;font-size:.85rem;color:var(--gris);margin:14px 0}
.paiement-logos{display:flex;gap:8px;justify-content:center;margin-top:10px;font-size:.78rem;color:var(--gris)}

/* FAQ / contact / footer */
.faq-grille{display:grid;grid-template-columns:.8fr 1.2fr;gap:56px}
details{border-bottom:1px solid var(--sable);padding:18px 0}
summary{cursor:pointer;font-weight:700;font-size:1.04rem;list-style:none;display:flex;justify-content:space-between;gap:20px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-size:1.5rem;color:var(--brun);line-height:1}
details[open] summary::after{content:"–"}
details p{color:var(--gris);margin-top:10px}
#contact{background:var(--brun-fonce);color:var(--creme)}
#contact h2{color:var(--creme)}
.contact-grille{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.coord{display:grid;gap:14px}
.coord div{display:flex;gap:16px;align-items:center;background:#4b2a18;padding:16px 20px;border-radius:12px}
.coord strong{display:block}
.coord span{color:#d8c4aa;font-size:.9rem}
footer.site{background:#2a170c;color:#bfa98e;padding:36px 0;font-size:.86rem}
footer.site .wrap{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
footer.site a{text-decoration:none;margin-left:18px}

/* Tiroir panier */
.voile{position:fixed;inset:0;background:rgba(43,26,16,.45);opacity:0;pointer-events:none;transition:.25s;z-index:90}
.voile.ouvert{opacity:1;pointer-events:auto}
.tiroir{position:fixed;top:0;right:0;height:100%;width:min(430px,100%);background:var(--creme);z-index:100;transform:translateX(100%);transition:.3s;display:flex;flex-direction:column;box-shadow:-10px 0 40px rgba(0,0,0,.15)}
.tiroir.ouvert{transform:none}
.tiroir .tete{padding:20px 24px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--sable)}
.tiroir .tete button{background:none;border:0;font-size:1.7rem;cursor:pointer;color:var(--brun)}
.tiroir .liste{flex:1;overflow:auto;padding:0 24px}
.tiroir .pied{background:var(--creme-2);padding:20px 24px}
.tiroir .total{display:flex;justify-content:space-between;font-family:Fraunces,serif;font-size:1.35rem;font-weight:700;margin-bottom:12px}
.qte{display:flex;align-items:center;gap:6px}
.qte button{width:26px;height:26px;border-radius:50%;border:1.5px solid var(--brun);background:none;color:var(--brun);cursor:pointer;font-weight:700}
.vide{color:var(--gris);text-align:center;padding:40px 0}

.modale{position:fixed;inset:0;display:none;place-items:center;z-index:120;background:rgba(43,26,16,.55);padding:20px}
.modale.ouvert{display:grid}
.modale .boite{background:var(--creme);border-radius:20px;padding:32px;max-width:540px;width:100%;text-align:center;max-height:90vh;overflow:auto}
.modale .boite img{width:64px;margin:0 auto 12px}
.modale h3{font-size:1.6rem;margin-bottom:10px}
.modale p{color:var(--gris);margin-bottom:10px}
.modale pre{white-space:pre-wrap;text-align:left;background:#fff;border:1px solid var(--sable);border-radius:10px;padding:14px;font-size:.8rem;max-height:220px;overflow:auto;margin:12px 0}
.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,140px);background:var(--brun-fonce);color:var(--creme);padding:13px 22px;border-radius:999px;font-weight:600;transition:.3s;z-index:130}
.toast.vu{transform:translate(-50%,0)}

@media (max-width:1020px){
  .hero-haut,.editeur,.devis-grille,.commande,.faq-grille,.contact-grille{grid-template-columns:1fr}
  .portes,.machines-cartes,.etapes{grid-template-columns:1fr}
  .porte .vis{height:200px}
  .grille-produits,.grille-objets{grid-template-columns:repeat(2,1fr)}
  .occasions{grid-template-columns:repeat(3,1fr)}
  .bandeau-livraison{grid-template-columns:repeat(2,1fr)}
  .scene,.estimation{position:static}
  .nav ul{display:none;position:absolute;top:74px;left:0;right:0;background:var(--creme);flex-direction:column;padding:20px;border-bottom:1px solid var(--sable)}
  .nav ul.ouvert{display:flex}
  .burger{display:block}
}
@media (max-width:600px){
  section{padding:64px 0}
  .grille-produits,.grille-objets{grid-template-columns:1fr 1fr;gap:12px}
  .produit .actions{flex-direction:column}
  .occasions{grid-template-columns:repeat(2,1fr)}
  .ligne-2,.ligne-3,.choix-service,.bandeau-livraison{grid-template-columns:1fr}
  .form-devis{padding:22px}
  .toile{padding:14px;min-height:260px}
}