/* Scontri da Piaghja a Paese — a tela (la toile) */
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Asap',sans-serif;font-size:1.05rem;line-height:1.75;color:#3a2c20;background:#f5efe4}
img{max-width:100%;display:block}
a{color:#8a5a34}
h1,h2,h3{font-family:'Averia Serif Libre',serif;font-weight:700;color:#5a3d26;line-height:1.18}
.toile{width:min(1020px,92%);margin:0 auto}
.fil{width:min(700px,92%);margin:0 auto}

/* bande utilitaire */
.dessus{background:#5a3d26;color:#f0e6d6;font-size:.88rem}
.dessus .toile{display:flex;justify-content:space-between;gap:14px;padding:7px 0;flex-wrap:wrap}
.dessus a{color:#f0c98a;text-decoration:none}

/* marque centrée, liens à losanges */
.enseigne{text-align:center;padding:26px 0 16px}
.enseigne img{width:74px;height:74px;margin:0 auto 8px}
.enseigne .nom{font-family:'Averia Serif Libre',serif;font-size:clamp(1.5rem,4vw,2.1rem);color:#5a3d26;font-weight:700;text-decoration:none;display:block}
.enseigne .lieu{color:#7a7c46;font-style:italic}
.chemins{text-align:center;padding:10px 0 18px}
.chemins a{color:#3a2c20;text-decoration:none;font-weight:600;font-size:.98rem}
.chemins a:hover{color:#c0623b}
.chemins a.quivi{color:#c0623b;border-bottom:2px solid #c0623b}
.chemins .los{color:#7a7c46;margin:0 12px;font-size:.7rem;vertical-align:2px}

/* bande tissée */
.tissage{height:26px;background:
 url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="48" height="26"><path d="M0 12 l12 -8 12 8 12 -8 12 8 v6 l-12 -8 -12 8 -12 -8 -12 8z" fill="%237a7c46"/><path d="M0 22 l12 -8 12 8 12 -8 12 8 v4 h-48z" fill="%23c0623b"/></svg>') repeat-x bottom}

/* pièces d'étoffe (sections) */
.piece{padding:54px 0}
.piece.ecru{background:#efe6d3}
.piece.chataigne{background:#5a3d26;color:#f0e6d6}
.piece.chataigne h2,.piece.chataigne h3{color:#f0c98a}
.piece.chataigne a{color:#f0c98a}
.piece h1{font-size:clamp(2rem,5.4vw,3.4rem)}
.piece h2{font-size:clamp(1.55rem,3.8vw,2.3rem);margin-bottom:14px}
.piece p{margin-bottom:16px}
.grand-mot{font-size:1.18rem;font-style:italic;color:#6b4a2f}
.piece.chataigne .grand-mot{color:#e8d8bd}

/* encadré cousu */
.cousu{border:2px dashed #c0623b;background:#fdf9f0;padding:30px 28px;margin:28px 0}
.cousu h3{color:#c0623b;font-size:1.25rem;margin-bottom:12px}
.cousu blockquote{font-style:italic;line-height:1.85;color:#3a2c20}
.cousu .fil-source{margin-top:14px;font-size:.9rem;color:#8a7a62}

/* bouton couture */
.couture{display:inline-block;background:#c0623b;color:#fdf9f0;text-decoration:none;font-weight:700;padding:12px 24px;border:2px dashed #fdf9f0;outline:2px solid #c0623b;margin-top:14px;cursor:pointer;font-size:1rem}
.couture:hover{background:#a34c2a;outline-color:#a34c2a}
.couture.olive{background:#7a7c46;outline-color:#7a7c46}
.couture.olive:hover{background:#63652f;outline-color:#63652f}

/* pièces en damier */
.damier{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:26px}
@media(max-width:760px){.damier{grid-template-columns:1fr}}
.damier>div{background:#fdf9f0;border-top:6px solid #7a7c46;padding:24px 22px;box-shadow:0 3px 10px rgba(90,61,38,.12)}
.damier>div:nth-child(even){border-top-color:#c0623b}
.damier h3{font-size:1.28rem;margin-bottom:8px}
.motif{width:46px;height:46px;margin-bottom:10px}

/* plan du village */
.ou-simu{border:6px solid #fdf9f0;outline:2px dashed #7a7c46;outline-offset:4px;margin:24px 0 8px}
.ou-simu iframe{display:block;width:100%;height:340px;border:0}
.mention-plan{font-size:.9rem;color:#8a7a62;font-style:italic}

/* formulaire */
#laisser-un-mot{background:#fdf9f0;border:2px dashed #7a7c46;padding:28px 26px;max-width:600px}
#laisser-un-mot label{display:block;font-weight:600;margin:14px 0 5px;color:#5a3d26}
#laisser-un-mot input,#laisser-un-mot textarea{width:100%;border:1px solid #cbb99a;background:#f5efe4;padding:10px 12px;font:inherit}
#laisser-un-mot input:focus,#laisser-un-mot textarea:focus{outline:2px solid #c0623b}
.a-prestu-note{border:2px dashed #c0623b;background:#fdf3e8;padding:14px 16px;margin-top:16px;font-weight:600;color:#a34c2a}

/* bas de toile */
.ourlet{background:#efe6d3;padding:34px 0 26px;margin-top:64px}
.ourlet .toile{text-align:center}
.ourlet .chemins{padding:0 0 14px}
.ourlet p{font-size:.94rem;max-width:78ch;margin:0 auto 8px}

/* images cousues */
.image-cousue{border:2px dashed #7a7c46;background:#fdf9f0;padding:16px 16px 10px;margin:28px 0}
.image-cousue svg{width:100%;height:auto;display:block}
.image-cousue figcaption{font-style:italic;font-size:.93rem;color:#8a7a62;padding-top:9px;text-align:center}

.image-cousue img{width:100%;display:block}