/*
Theme Name: Conseil Maison Bois
Theme URI: https://conseilmaisonbois.com
Author: Conseil Maison Bois
Description: Thème sur-mesure reproduisant à l'identique le design éditorial de Conseil Maison Bois (guide indépendant construction bois). Léger, sans page builder.
Version: 1.1.1
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
Text Domain: conseilmaisonbois
*/

/* ============================================================
   BASE — design partagé (extrait fidèlement du HTML d'origine)
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
  --foret: #2D4A2A; --foret2: #1a2e18; --foret3: #0e1a0d;
  --bois: #C4894A; --bois-clair: #E8B07A;
  --creme: #F7F3EC; --creme2: #EDE8DF; --blanc: #FAFAF7;
  --ardoise: #4A5568; --texte: #2C3340; --pierre: #9E9B8B;
  --ombre: rgba(45,74,42,0.09); --r: 10px;
}
html { scroll-behavior: smooth; }
body { font-family: 'Inter', sans-serif; background: var(--blanc); color: var(--texte); }

/* --- Navigation --- */
nav.site-nav {
  position: fixed; top: 0; width: 100%; z-index: 200;
  background: rgba(250,250,247,0.97); backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(196,137,74,0.18);
  padding: 0.85rem 2rem; display: flex; align-items: center; justify-content: space-between;
}
.logo { display: inline-flex; align-items: center; gap: 0.55rem; font-family: 'Playfair Display', serif; font-size: 1.2rem; color: var(--foret); font-weight: 700; text-decoration: none; }
.logo .logo-txt span { color: var(--bois); }
.logo-ico { height: 34px; width: 34px; display: block; flex: 0 0 auto; }
@media (max-width: 480px) { .logo { font-size: 1.02rem; gap: 0.4rem; } .logo-ico { height: 28px; width: 28px; } }
/* Logo personnalisé téléversé dans WordPress */
.custom-logo-link { display: inline-flex; align-items: center; line-height: 0; }
.custom-logo { height: 58px; width: auto; display: block; }
@media (max-width: 480px) { .custom-logo { height: 44px; } }
.nav-r { display: flex; gap: 0.5rem; list-style: none; margin: 0; padding: 0; }
.nav-r a { font-size: 0.76rem; color: var(--ardoise); text-decoration: none; padding: 0.35rem 0.8rem; border-radius: 4px; font-weight: 500; transition: all 0.2s; display: inline-block; }
.nav-r a:hover { background: var(--creme); }
.nav-r .cta a, .nav-r a.cta { background: var(--foret); color: white !important; }

/* --- Hero de page --- */
.page-hero {
  background: linear-gradient(150deg, var(--foret) 0%, var(--foret2) 100%);
  padding: 8rem 2rem 5rem; position: relative; overflow: hidden;
}
.page-hero::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse at 70% 50%, rgba(196,137,74,0.12) 0%, transparent 60%); }
.hero-inner { max-width: 900px; margin: 0 auto; position: relative; z-index: 1; }
.eyebrow { font-family: 'DM Mono', monospace; font-size: 0.68rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--bois-clair); margin-bottom: 1rem; }
.hero-inner h1 { font-family: 'Playfair Display', serif; font-size: clamp(2rem, 4vw, 2.8rem); color: white; line-height: 1.1; margin-bottom: 1rem; }
.hero-inner h1 em { color: var(--bois-clair); font-style: italic; }
.hero-inner p { color: rgba(250,250,247,0.65); font-size: 0.97rem; line-height: 1.75; max-width: 560px; }

/* --- Contenu de page générique (pages WP éditables) --- */
.page-content { max-width: 820px; margin: 0 auto; padding: 4rem 2rem 6rem; }
.page-content h2 { font-family: 'Playfair Display', serif; font-size: 1.7rem; color: var(--foret); margin: 2.5rem 0 1rem; }
.page-content h3 { font-family: 'Playfair Display', serif; font-size: 1.25rem; color: var(--foret); margin: 2rem 0 0.8rem; }
.page-content p { font-size: 0.95rem; color: var(--ardoise); line-height: 1.8; margin-bottom: 1.2rem; }
.page-content ul, .page-content ol { margin: 0 0 1.2rem 1.4rem; color: var(--ardoise); line-height: 1.8; font-size: 0.95rem; }
.page-content a { color: var(--bois); }
.page-content img { max-width: 100%; height: auto; border-radius: var(--r); }
.page-content blockquote { background: var(--creme); border-left: 4px solid var(--bois); padding: 1.2rem 1.5rem; border-radius: var(--r); margin: 1.5rem 0; }

/* --- Pied de page --- */
footer.site-footer { background: var(--foret3); padding: 2.5rem 2rem; text-align: center; }
.footer-logo { font-family: 'Playfair Display', serif; font-size: 1.3rem; color: white; display: block; margin-bottom: 0.7rem; text-decoration: none; }
.footer-logo span { color: var(--bois); }
footer.site-footer p { color: rgba(250,250,247,0.35); font-size: 0.8rem; line-height: 1.8; }
footer.site-footer a { color: var(--bois-clair); text-decoration: none; }
.footer-menu { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 0.5rem 0; }
.footer-menu li { color: rgba(250,250,247,0.35); font-size: 0.8rem; }
.footer-menu li:not(:last-child)::after { content: '·'; margin: 0 0.6rem; }

/* Menu mobile (hamburger, sans JS) */
.nav-toggle { display: none; }
.nav-burger { display: none; font-size: 1.6rem; line-height: 1; color: var(--foret); cursor: pointer; background: none; border: none; padding: 0.2rem 0.4rem; user-select: none; }
@media(max-width:768px) {
	.nav-burger { display: block; }
	.nav-r { display: none; position: absolute; top: 100%; left: 0; right: 0; flex-direction: column; gap: 0; background: rgba(250,250,247,0.99); padding: 0.4rem 1.2rem 1rem; border-bottom: 1px solid rgba(196,137,74,0.18); box-shadow: 0 10px 24px var(--ombre); }
	.nav-toggle:checked ~ .nav-r { display: flex; }
	.nav-r li { width: 100%; }
	.nav-r a { display: block; width: 100%; padding: 0.75rem 0.4rem; font-size: 0.95rem; border-bottom: 1px solid var(--creme2); }
	.nav-r .cta a, .nav-r a.cta { margin-top: 0.6rem; border-radius: 6px; text-align: center; border-bottom: none; }
}
