:root{--c1:#7a4b2a;--c2:#5a3519;--acc:#c9962b;--bg:#f6f1ea;--card:#ffffff;--ink:#1f2933;--titre:#4a2c14;--lien:#8a4f1d;--bord:#e4d6c2;--fond2:#f3e9dc;--entete:linear-gradient(135deg,#4a2c14 0%,#7a4b2a 60%,#9a6a3f 100%);--font-h:Georgia,'Times New Roman',serif;--font-b:system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;--rayon:6px;--decor:url(../images/decor.svg)}
/* SoluWeb 2026 - theme Mobilier (genere) */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.65 var(--font-b)}
img{max-width:100%;height:auto;border:0}
a{color:var(--lien);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{font-family:var(--font-h);color:var(--titre);line-height:1.25;margin:1.2em 0 .5em}
h1{font-size:clamp(1.7rem,3.2vw,2.3rem);margin-top:0}
h2{font-size:1.45rem}
h3{font-size:1.2rem}
p,ul,ol,blockquote,table{margin:0 0 1em}
.wrap{width:min(1120px,100% - 32px);margin-inline:auto}

/* entete */
#entete{background:var(--entete);color:#fff;position:relative;padding:46px 0 70px;overflow:hidden}
#entete::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:44px;background:var(--decor) repeat-x bottom/auto 44px}
#entete .nom-site{margin:0;font:700 clamp(1.8rem,5vw,3rem)/1.15 var(--font-h);letter-spacing:.01em}
#entete .nom-site a{color:#fff}
#entete .nom-site a:hover{text-decoration:none}
#entete .slogan{margin:.4em 0 0;font-size:1.1rem;opacity:.9;max-width:46em}

/* menu */
#nav{background:var(--bg);position:sticky;top:0;z-index:20;border-bottom:1px solid var(--bord);box-shadow:0 2px 10px rgba(0,0,0,.05)}
#nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px}
#nav li a{display:block;padding:14px 16px;color:var(--titre);font-weight:600;border-bottom:3px solid transparent}
#nav li a:hover{color:var(--c1);border-bottom-color:var(--acc);text-decoration:none}
.nav-t{position:absolute;opacity:0;pointer-events:none}
.nav-b{display:none;padding:14px 0;font-weight:700;color:var(--titre);cursor:pointer}
.nav-b::before{content:"☰ "}

/* corps */
#corps{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:40px;padding:36px 0 48px;align-items:start}
#contenu{background:var(--card);border-radius:var(--rayon);padding:clamp(18px,3vw,36px);box-shadow:0 1px 3px rgba(0,0,0,.06);overflow-wrap:break-word}
#contenu table{max-width:100%;border-collapse:collapse}
#contenu td,#contenu th{padding:6px 10px;vertical-align:top}
#contenu blockquote{border-left:4px solid var(--acc);background:var(--fond2);padding:12px 18px;border-radius:0 var(--rayon) var(--rayon) 0}
#contenu ul{padding-left:1.3em}
#contenu li::marker{color:var(--acc)}
.photo1{width:100%;margin-top:15px;border-radius:var(--rayon)}
.photo2{border:0}
.photo3{width:100%}
.left{float:left;margin:0 18px 10px 0}
.right{float:right;margin:0 0 10px 18px}
.center{display:block;text-align:center;margin:0 auto}
.clearer,.clear{clear:both}

/* lateral */
#lateral>div,#lateral .bloc_gauche,#lateral .rappel,#lateral #rappel{background:var(--card);border-radius:var(--rayon);padding:16px 18px;margin-bottom:20px;box-shadow:0 1px 3px rgba(0,0,0,.06)}
#lateral h2,#lateral .entrappel,#lateral .titre_bloc{font:700 1.05rem var(--font-h);color:var(--titre);margin:0 0 10px;padding-bottom:8px;border-bottom:2px solid var(--acc);text-transform:none}
#lateral h2::first-letter{text-transform:uppercase}
#lateral ul{list-style:none;margin:0;padding:0}
#lateral li a{display:block;padding:7px 0;border-bottom:1px solid var(--bord);color:var(--ink)}
#lateral li a:hover{color:var(--c1);text-decoration:none;padding-left:4px}
#lateral input[type=text]{width:100%;padding:10px 12px;border:1px solid var(--bord);border-radius:8px;font:inherit;background:#fff}
#lateral input[type=text]:focus,#contenu input:focus,#contenu textarea:focus{outline:2px solid var(--acc);outline-offset:1px}
#lateral input[type=submit],#lateral .bouton,#contenu input[type=submit]{margin-top:8px;padding:10px 18px;border:0;border-radius:999px;background:var(--c1);color:#fff;font:700 .95rem var(--font-b);cursor:pointer}
#lateral input[type=submit]:hover,#contenu input[type=submit]:hover{background:var(--c2)}
.rap1,.rap2,.rech1,.rech2{padding:0}
.contbloc{padding:0}

/* formulaires de contact (toutes variantes) */
#contenu form{max-width:560px}
#contenu input[type=text],#contenu textarea,#contenu select{width:100%;padding:10px 12px;border:1px solid var(--bord);border-radius:8px;font:inherit;background:#fff}
#contenu label{font-weight:600}
#contenu .field{margin-bottom:12px}
#contenu .floatleft{float:none;display:block;margin-bottom:4px}
#contenu .divformulaire,#contenu .aligncenter{margin:0}
#contenu input[type=radio]{width:auto;margin:0 4px 0 10px}
#contenu .etoile{color:#c0392b}
#contenu .g-recaptcha{float:none!important}

/* pied */
#pied{background:var(--entete);color:#fff;padding:22px 0;text-align:center;font-size:.92rem}
#pied p{margin:0}
#pied a{color:#fff;text-decoration:underline}

@media (max-width:860px){
  #corps{grid-template-columns:1fr;gap:24px}
  #entete{padding:30px 0 56px}
  .nav-b{display:block}
  #nav ul{display:none;flex-direction:column;padding-bottom:10px}
  #nav .nav-t:checked~ul{display:flex}
  #nav li a{border-bottom:1px solid var(--bord)}
  .left,.right{float:none;margin:0 0 12px}
}
@media print{#nav,#lateral{display:none}#corps{display:block}}

/* contenu saisi par les clients (tableaux, images, blocs a largeur fixe) : jamais plus large que l'ecran */
#contenu *{max-width:100%}
#contenu img,#contenu video{height:auto}
#contenu pre{overflow-x:auto;white-space:pre-wrap}
@media (max-width:860px){
  #contenu table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;width:auto!important}
  #contenu{overflow-wrap:anywhere}
  #contenu table:has(table),#contenu table:has(table)>tbody,#contenu table:has(table)>tbody>tr,#contenu table:has(table)>tbody>tr>td,#contenu table:has(table)>tbody>tr>th{display:block;width:auto!important}
  #contenu table:has(table)>tbody>tr>td,#contenu table:has(table)>tbody>tr>th{padding-left:0;padding-right:0}
  #contenu [style*="width"],#contenu [width]{width:auto!important}
  #contenu img[width]{width:auto!important;height:auto!important}
  #contenu iframe{width:100%!important}
}
/* cellules "nowrap" (ancien HTML de l'editeur) : le texte doit pouvoir passer a la ligne */
#contenu td[nowrap],#contenu th[nowrap],#contenu [style*="nowrap"]{white-space:normal!important}
#contenu nobr{white-space:normal}

/* bandeau photo du client dans l'en-tete (perso) : photo 980x99, titre et slogan en texte par-dessus */
#entete .wrap{background:url(../images/banniere.jpg) no-repeat center top;background-size:cover;max-width:980px;min-height:99px;box-sizing:border-box;margin:0 auto;padding:14px 20px}
#entete .nom-site,#entete .nom-site a,#entete .slogan{color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.7)}
/* ajustement : titre plus petit pour garder la photo a sa taille, slogan plus lisible */
#entete .nom-site{font-size:clamp(1.6rem,4vw,2.2rem)}
#entete .slogan{opacity:1;font-weight:600;text-shadow:0 1px 2px rgba(0,0,0,.9),0 0 8px rgba(0,0,0,.6)}
