/*
Theme Name: Blocksy Child — Bois Italia
Theme URI: http://localhost/wordwood
Description: Tema enfant Blocksy pour Bois Italia (pellet + outils). Charte graphique et CSS custom.
Author: Bois Italia
Template: blocksy
Version: 1.1.0
Text Domain: blocksy-child
*/

:root {
	--ww-noir:  #1A1815;
	--ww-or:    #C8962A;
	--ww-or-d:  #A8791F;
	--ww-creme: #F5F1E8;
	--ww-blanc: #FAF8F3;
	--ww-bois:  #D9B98C;
	--ww-vert:  #2F4A3C;
	--ww-font-titre: "Fraunces", "Playfair Display", Georgia, serif;
	--ww-font-texte: "Inter", system-ui, -apple-system, sans-serif;
}

/* ====================== GLOBAL ====================== */
body {
	background-color: var(--ww-creme) !important;
	font-family: var(--ww-font-texte);
	color: var(--ww-noir);
}
h1, h2, h3, h4, .entry-title, .ww-section__title {
	font-family: var(--ww-font-titre) !important;
	color: var(--ww-noir);
	letter-spacing: -0.01em;
}
a { color: var(--ww-or-d); }

/* Masque le titre de page sur la home statique */
.home .page .entry-header,
.home .entry-header .entry-title { display: none; }

/* ====================== TOP BAR ====================== */
.ww-topbar {
	background: #000;
	color: var(--ww-creme);
	font-size: 13px;
	border-bottom: 1px solid rgba(200,150,42,.25);
}
.ww-topbar__inner {
	max-width: 1280px;
	margin: 0 auto;
	padding: 7px 24px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}
.ww-topbar__msg { letter-spacing: .02em; }
.ww-topbar__link { color: var(--ww-or); font-weight: 600; text-decoration: none; }
.ww-topbar__link:hover { color: #fff; }

/* ====================== HEADER (noir) ====================== */
#header,
#header [data-device],
#header [data-row] {
	background-color: var(--ww-noir) !important;
	box-shadow: 0 1px 0 rgba(200,150,42,.18);
}
#header a,
#header .site-title a,
#header [data-id="menu"] a,
#header .header-menu-1 a,
#header .ct-toggle,
#header [data-device] a {
	color: var(--ww-creme) !important;
}
#header .ct-toggle svg,
#header [data-id="search"] svg { fill: var(--ww-creme); color: var(--ww-creme); }
#header .site-title a {
	font-family: var(--ww-font-titre) !important;
	font-weight: 700;
	letter-spacing: .04em;
	font-size: 26px;
}
#header [data-id="menu"] a:hover,
#header .header-menu-1 a:hover,
#header .ct-toggle:hover,
#header a:hover { color: var(--ww-or) !important; }

/* ====================== BOUTONS WOO + blocs ====================== */
.wp-block-button__link,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce .button,
.woocommerce #respond input#submit,
a.added_to_cart {
	background-color: var(--ww-or) !important;
	color: var(--ww-noir) !important;
	border: 2px solid var(--ww-or) !important;
	font-family: var(--ww-font-texte) !important;
	font-weight: 600 !important;
	border-radius: 4px !important;
	transition: background .2s ease, border-color .2s ease;
}
.wp-block-button__link:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce .button:hover,
a.added_to_cart:hover {
	background-color: var(--ww-or-d) !important;
	border-color: var(--ww-or-d) !important;
	color: #fff !important;
}
/* bouton fantôme (outline) */
.ww-btn--ghost .wp-block-button__link {
	background: transparent !important;
	color: #fff !important;
	border-color: var(--ww-creme) !important;
}
.ww-btn--ghost .wp-block-button__link:hover {
	background: var(--ww-creme) !important;
	color: var(--ww-noir) !important;
}

/* ====================== SECTIONS (largeur + alternance) ====================== */
.ww-section { padding: 72px 24px; }
.ww-section > :not(.alignfull):not(.wp-block-media-text__media):not(.wp-block-media-text__content) {
	max-width: 1180px;
	margin-left: auto;
	margin-right: auto;
}
.ww-section__title { font-size: clamp(28px, 4vw, 42px); margin-bottom: 8px; }
.ww-section__lead { color: #5a5347; margin-bottom: 36px; }
.ww-categorie { background: var(--ww-blanc); }
.ww-evidenza  { background: var(--ww-creme); }
.ww-blog      { background: var(--ww-blanc); }
.ww-bg-creme  { background: var(--ww-creme); }
.ww-bg-blanc  { background: var(--ww-blanc); }

/* ====================== HERO ====================== */
.ww-hero {
	align-items: center;
	/* repli bois chaud si l'image ne couvre pas */
	background: linear-gradient(135deg, #8a6a3e 0%, #3a2c1a 100%);
}
.ww-hero .wp-block-cover__image-background {
	object-fit: cover !important;
	width: 100% !important;
	height: 100% !important;
	object-position: center 55%;
}
/* overlay sombre chaud (et non gris) par-dessus le bois */
.ww-hero .wp-block-cover__background.has-background-dim {
	background-color: #1A1815 !important;
	opacity: .48 !important;
}
.ww-hero .ww-hero__title {
	color: #fff !important;
	font-size: clamp(34px, 6vw, 68px);
	line-height: 1.05;
	margin-bottom: 14px;
	text-shadow: 0 2px 18px rgba(0,0,0,.35);
}
.ww-hero .ww-hero__sub {
	color: #f3ede0;
	font-size: clamp(16px, 2vw, 20px);
	max-width: 640px;
	margin: 0 auto 30px;
}

/* ====================== RÉASSURANCE ====================== */
.ww-reassurance {
	background: var(--ww-noir);
	padding: 34px 24px;
}
.ww-reassur__row {
	max-width: 1180px;
	margin: 0 auto;
	gap: 18px;
}
.ww-reassur__item { text-align: center; color: var(--ww-creme); }
.ww-reassur__icon { margin: 0 0 10px; color: var(--ww-or); line-height: 0; }
.ww-reassur__icon svg { width: 36px; height: 36px; display: inline-block; vertical-align: middle; }
.ww-reassur__title { font-weight: 700; color: #fff; margin: 0 0 2px; }
.ww-reassur__desc { font-size: 13px; color: #c9c2b3; margin: 0; }

/* ====================== TUILES CATÉGORIES ====================== */
.ww-tiles {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 18px;
}
.ww-tile {
	position: relative;
	min-height: 210px;
	border-radius: 8px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	padding: 20px;
	color: #fff !important;
	text-decoration: none;
	/* texture bois commune + voile sombre pour la lisibilité */
	background-image: linear-gradient(180deg, rgba(26,24,21,.35) 0%, rgba(26,24,21,.78) 100%),
	                  url('assets/wood-texture.jpg');
	background-size: cover, cover;
	background-position: center, center;
	box-shadow: 0 6px 20px rgba(26,24,21,.14);
	transition: transform .25s ease, box-shadow .25s ease;
}
.ww-tile::before { /* renfort du voile (~0.55) */
	content: "";
	position: absolute; inset: 0;
	background: rgba(26,24,21,.30);
	transition: background .25s ease;
}
.ww-tile:hover { transform: translateY(-4px); box-shadow: 0 14px 30px rgba(26,24,21,.28); }
.ww-tile:hover::before { background: rgba(26,24,21,.12); }
.ww-tile__medallion {
	display: none; /* médaillon miniature masqué — le fond de marque suffit */
	position: absolute;
	top: 14px; right: 14px;
	width: 80px; height: 80px;
	object-fit: contain;
	background: #fff;
	border-radius: 10px;
	padding: 5px;
	box-shadow: 0 4px 12px rgba(0,0,0,.28);
	transition: transform .25s ease;
	z-index: 2;
}
.ww-tile:hover .ww-tile__medallion { transform: scale(1.06); }
.ww-tile__body { position: relative; z-index: 2; }
.ww-tile__label {
	display: block;
	font-family: var(--ww-font-titre);
	font-size: 24px;
	font-weight: 700;
	line-height: 1.1;
	color: #fff;
	text-shadow: 0 1px 6px rgba(0,0,0,.4);
}
.ww-tile__cta { display: block; color: var(--ww-or); font-weight: 600; font-size: 14px; margin-top: 4px; }

/* Fond propre à chaque marque (remplace la texture bois commune) */
.ww-tile[href*="/pellet/canadian/"]    { background-image: linear-gradient(180deg, rgba(26,24,21,.30) 0%, rgba(26,24,21,.78) 100%), url('assets/brand-canadian.jpg'); }
.ww-tile[href*="/pellet/pfeifer/"]     { background-image: linear-gradient(180deg, rgba(26,24,21,.30) 0%, rgba(26,24,21,.78) 100%), url('assets/brand-pfeifer.jpg'); }
.ww-tile[href*="/pellet/swiss-warme/"] { background-image: linear-gradient(180deg, rgba(26,24,21,.30) 0%, rgba(26,24,21,.78) 100%), url('assets/brand-swiss-warme.jpg'); }
.ww-tile[href*="/pellet/fiamma/"]      { background-image: linear-gradient(180deg, rgba(26,24,21,.30) 0%, rgba(26,24,21,.78) 100%), url('assets/brand-fiamma.jpg'); }
.ww-tile[href*="/pellet/mywood/"]      { background-image: linear-gradient(180deg, rgba(26,24,21,.30) 0%, rgba(26,24,21,.78) 100%), url('assets/brand-mywood.jpg'); }
.ww-tile[href*="/pellet/firestixx/"]   { background-image: linear-gradient(180deg, rgba(26,24,21,.30) 0%, rgba(26,24,21,.78) 100%), url('assets/brand-firestixx.jpg'); }

/* ====================== PRODUITS WOO (grille) ====================== */
.ww-evidenza ul.products li.product .price { color: var(--ww-vert) !important; font-weight: 600; }
.ww-evidenza ul.products li.product h2,
.ww-evidenza ul.products li.product .woocommerce-loop-product__title {
	font-family: var(--ww-font-titre) !important;
	font-size: 16px;
}
.onsale,
.ww-evidenza .onsale,
.woocommerce span.onsale {
	background: var(--ww-or) !important;
	color: var(--ww-noir) !important;
	font-weight: 700 !important;
	border-radius: 3px;
}

/* ====================== IL NOSTRO BOSCO ====================== */
.ww-bosco { background: var(--ww-blanc); align-items: stretch; }
.ww-bosco .wp-block-media-text__media { align-self: stretch; overflow: hidden; }
.ww-bosco .wp-block-media-text__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ww-bosco .wp-block-media-text__content { padding: 48px clamp(24px, 5vw, 72px); align-self: center; }
.ww-bosco .ww-section__title { font-size: clamp(26px, 3.5vw, 38px); margin-bottom: 16px; }

/* ====================== PER PIZZERIE (sombre) ====================== */
.ww-pizzerie {
	background: var(--ww-noir);
	text-align: center;
}
.ww-pizzerie .ww-pizzerie__title { color: #fff !important; }
.ww-pizzerie .ww-pizzerie__title::after {
	content: "";
	display: block;
	width: 60px; height: 3px;
	background: var(--ww-or);
	margin: 14px auto 0;
}
.ww-pizzerie__lead { color: #d8d1c2; max-width: 620px; margin: 18px auto 28px; }

/* ====================== BLOG ====================== */
.ww-blog__posts { gap: 22px; }
.ww-blog__posts li { background: #fff; border-radius: 8px; padding: 18px; box-shadow: 0 4px 16px rgba(26,24,21,.07); }
.ww-blog__posts .wp-block-latest-posts__post-title { font-family: var(--ww-font-titre); }

/* ====================== FORMULAIRES (CF7) ====================== */
.ww-form { max-width: 640px; margin-left: auto; margin-right: auto; }
.wpcf7-form p { margin: 0 0 14px; font-weight: 600; color: var(--ww-noir); }
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form textarea {
	width: 100%;
	margin-top: 6px;
	padding: 11px 13px;
	border: 1px solid #d8cfbe;
	border-radius: 6px;
	background: #fff;
	font-family: var(--ww-font-texte);
	font-size: 15px;
	font-weight: 400;
}
.wpcf7-form textarea { min-height: 130px; }
.wpcf7-form input:focus, .wpcf7-form textarea:focus { outline: none; border-color: var(--ww-or); box-shadow: 0 0 0 3px rgba(200,150,42,.18); }
.wpcf7-form input[type="submit"] {
	background: var(--ww-or);
	color: var(--ww-noir);
	border: 2px solid var(--ww-or);
	font-weight: 700;
	padding: 12px 28px;
	border-radius: 4px;
	cursor: pointer;
	transition: background .2s ease;
}
.wpcf7-form input[type="submit"]:hover { background: var(--ww-or-d); border-color: var(--ww-or-d); color: #fff; }

/* ============== FORMULAIRES PRO (CF7 v2 — markup .ww-form2) ============== */
.ww-form2 {
	max-width: 720px;
	margin: 0 auto;
	background: #fff;
	border: 1px solid #ece5d8;
	border-radius: 16px;
	padding: 34px 34px 30px;
	box-shadow: 0 14px 38px rgba(26,24,21,.07);
}
.ww-form2__row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 20px; }
.ww-field { margin: 0 0 18px; }
.ww-field label {
	display: block;
	margin-bottom: 7px;
	font-family: var(--ww-font-texte);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--ww-noir);
}
.ww-field label span { color: var(--ww-or-d); }
.ww-form2 input[type="text"],
.ww-form2 input[type="email"],
.ww-form2 input[type="tel"],
.ww-form2 textarea {
	width: 100%;
	box-sizing: border-box;
	padding: 13px 15px;
	border: 1px solid #d8cfbe;
	border-radius: 9px;
	background: #fdfcf9;
	color: var(--ww-noir);
	font-family: var(--ww-font-texte);
	font-size: 15px;
	font-weight: 400;
	transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.ww-form2 input::placeholder, .ww-form2 textarea::placeholder { color: #b3a892; }
.ww-form2 textarea { min-height: 150px; resize: vertical; }
.ww-form2 input:focus, .ww-form2 textarea:focus {
	outline: none;
	background: #fff;
	border-color: var(--ww-or);
	box-shadow: 0 0 0 3px rgba(200,150,42,.18);
}
.ww-submit { margin-top: 6px; }
.ww-form2 input[type="submit"] {
	background: var(--ww-or);
	color: var(--ww-noir);
	border: none;
	border-radius: 9px;
	font-family: var(--ww-font-texte);
	font-weight: 700;
	font-size: 15px;
	letter-spacing: .02em;
	padding: 14px 36px;
	cursor: pointer;
	transition: background .2s ease, transform .15s ease, box-shadow .2s ease;
	box-shadow: 0 6px 16px rgba(200,150,42,.28);
}
.ww-form2 input[type="submit"]:hover {
	background: var(--ww-or-d);
	color: #fff;
	transform: translateY(-2px);
	box-shadow: 0 10px 24px rgba(200,150,42,.38);
}
.ww-form2 .wpcf7-spinner { margin: 16px auto 0; display: block; }
.ww-form2 .wpcf7-not-valid-tip { color: #c0392b; font-size: 13px; margin-top: 5px; font-weight: 600; }
.ww-form2 .wpcf7-not-valid { border-color: #c0392b !important; }
.wpcf7-response-output { border-radius: 9px !important; margin: 20px 0 0 !important; padding: 13px 16px !important; font-size: 14px; }
@media (max-width: 600px) {
	.ww-form2 { padding: 24px 20px; }
	.ww-form2__row { grid-template-columns: 1fr; gap: 0; }
}

/* ====================== SÉLECTEUR DE LANGUE (drapeaux) ====================== */
.ww-topbar__right { display: inline-flex; align-items: center; gap: 16px; }
.ww-lang { display: inline-flex; align-items: center; gap: 9px; list-style: none; margin: 0; padding: 0; }
.ww-lang li { margin: 0; padding: 0; line-height: 0; }
.ww-lang a { display: inline-block; opacity: .5; transition: opacity .2s ease, transform .2s ease; }
.ww-lang a:hover { opacity: 1; transform: translateY(-1px); }
.ww-lang .current-lang a, .ww-lang .current-lang > a { opacity: 1; }
.ww-lang img {
	width: 21px !important; height: 14px !important; display: block; border-radius: 3px;
	box-shadow: 0 0 0 1px rgba(255,255,255,.3);
}

/* ====================== FAQ (accordéon natif <details>) ====================== */
.ww-faq { max-width: 840px; margin: 8px auto 0; }
.ww-faq .wp-block-details {
	background: #fff;
	border: 1px solid #ece5d8;
	border-radius: 12px;
	margin-bottom: 14px;
	padding: 2px 24px;
	box-shadow: 0 6px 18px rgba(26,24,21,.05);
	transition: box-shadow .2s ease;
}
.ww-faq .wp-block-details[open] { box-shadow: 0 10px 26px rgba(26,24,21,.09); }
.ww-faq summary {
	cursor: pointer;
	list-style: none;
	position: relative;
	padding: 19px 34px 19px 0;
	font-family: var(--ww-font-titre);
	font-size: 18px;
	font-weight: 600;
	color: var(--ww-noir);
}
.ww-faq summary::-webkit-details-marker { display: none; }
.ww-faq summary::after {
	content: "+";
	position: absolute;
	right: 2px; top: 50%;
	transform: translateY(-50%);
	font-family: var(--ww-font-texte);
	font-size: 26px; font-weight: 400; line-height: 1;
	color: var(--ww-or-d);
	transition: transform .2s ease;
}
.ww-faq .wp-block-details[open] summary::after { content: "–"; }
.ww-faq .wp-block-details > *:not(summary) {
	margin: 0 0 18px;
	color: #4a443c;
	font-size: 15.5px;
	line-height: 1.7;
}

/* ====================== COMMENTAIRES (blog) ====================== */
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
	width: 100%;
	box-sizing: border-box;
	padding: 12px 14px;
	border: 1px solid #d8cfbe;
	border-radius: 9px;
	background: #fdfcf9;
	font-family: var(--ww-font-texte);
	font-size: 15px;
}
.comment-form input:focus,
.comment-form textarea:focus {
	outline: none;
	border-color: var(--ww-or);
	box-shadow: 0 0 0 3px rgba(200,150,42,.18);
}
.comment-form .form-submit #submit,
.comment-form #submit {
	background: var(--ww-or);
	color: var(--ww-noir);
	border: none;
	border-radius: 9px;
	font-family: var(--ww-font-texte);
	font-weight: 700;
	font-size: 15px;
	padding: 13px 32px;
	cursor: pointer;
	transition: background .2s ease, transform .15s ease, box-shadow .2s ease;
	box-shadow: 0 6px 16px rgba(200,150,42,.28);
}
.comment-form .form-submit #submit:hover,
.comment-form #submit:hover {
	background: var(--ww-or-d);
	color: #fff;
	transform: translateY(-2px);
	box-shadow: 0 10px 24px rgba(200,150,42,.38);
}

/* ====================== WOOCOMMERCE checkout/cart (blocs) ====================== */
.wc-block-components-button:not(.is-link),
.wp-block-woocommerce-cart .wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button {
	background-color: var(--ww-or) !important;
	color: var(--ww-noir) !important;
	border-radius: 4px !important;
	font-weight: 700 !important;
}
.wc-block-components-button:not(.is-link):hover { background-color: var(--ww-or-d) !important; color: #fff !important; }
.woocommerce-account .woocommerce h2,
.woocommerce-cart h1, .woocommerce-checkout h1,
.wc-block-components-title { font-family: var(--ww-font-titre) !important; }

/* ====================== BANDEAU AMBIANCE ====================== */
.ww-ambiance { align-items: center; }
.ww-ambiance .wp-block-cover__image-background { object-fit: cover !important; object-position: center 50%; }
.ww-ambiance__title {
	color: #fff !important;
	font-size: clamp(26px, 3.5vw, 40px);
	margin-bottom: 10px;
	text-shadow: 0 2px 14px rgba(0,0,0,.4);
}
.ww-ambiance__lead {
	color: #f3ede0;
	max-width: 620px;
	margin: 0 auto;
	font-size: clamp(15px, 1.6vw, 18px);
}

/* ====================== FOOTER ====================== */
#footer { display: none !important; } /* masque le footer Blocksy par défaut */
.ww-footer {
	background: var(--ww-noir);
	color: var(--ww-creme);
	padding: 56px 24px 0;
}
.ww-footer__grid {
	max-width: 1180px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1.4fr 1fr 1fr 1fr;
	gap: 32px;
	padding-bottom: 40px;
}
.ww-footer__logo {
	font-family: var(--ww-font-titre);
	font-size: 26px;
	font-weight: 700;
	letter-spacing: .04em;
	color: #fff;
	margin: 0 0 10px;
}
.ww-footer__tag { color: #c9c2b3; font-size: 14px; line-height: 1.6; max-width: 320px; }
.ww-footer__title { font-family: var(--ww-font-titre); color: var(--ww-or); font-size: 16px; margin: 0 0 14px; }
.ww-footer__col ul { list-style: none; margin: 0; padding: 0; }
.ww-footer__col li { margin-bottom: 8px; font-size: 14px; color: #cfc8ba; }
.ww-footer__col a { color: #cfc8ba; text-decoration: none; }
.ww-footer__col a:hover { color: var(--ww-or); }
.ww-footer__pay { margin-top: 14px; font-size: 13px; color: #9a9282; }
.ww-footer__legal {
	max-width: 1180px;
	margin: 0 auto;
	border-top: 1px solid rgba(255,255,255,.1);
	padding: 18px 0;
	display: flex;
	justify-content: space-between;
	gap: 12px;
	font-size: 12.5px;
	color: #8f8777;
}
.ww-footer__legal-links a { color: #b3ab9b; text-decoration: none; }
.ww-footer__legal-links a:hover { color: var(--ww-or); }

/* ====================== RESPONSIVE ====================== */
@media (max-width: 900px) {
	.ww-tiles { grid-template-columns: repeat(2, 1fr); }
	.ww-footer__grid { grid-template-columns: 1fr 1fr; }
}
/* Réassurance : 2x2 sur mobile (override du 100% des colonnes WP) */
@media (max-width: 768px) {
	.ww-reassur__row.wp-block-columns { flex-wrap: wrap !important; gap: 22px 12px; }
	.ww-reassur__row.wp-block-columns .wp-block-column {
		flex: 0 0 calc(50% - 6px) !important;
		flex-basis: calc(50% - 6px) !important;
	}
}
@media (max-width: 600px) {
	.ww-tiles { grid-template-columns: 1fr; }
	.ww-footer__grid { grid-template-columns: 1fr; }
	.ww-topbar__inner { flex-direction: column; gap: 4px; text-align: center; }
	.ww-footer__legal { flex-direction: column; text-align: center; }
}