/*
Theme Name:   Bardage Terrasse Cèdre
Theme URI:    https://bardage-terrasse-cedre.com/
Description:  Thème enfant de Twenty Twenty-Five pour Bardage-Terrasse-Cèdre (design aligné sur parquet-lille.fr, accent brun cèdre).
Author:       Les Moulures du Nord
Template:     twentytwentyfive
Version:      1.4.1
Requires at least: 6.7
Requires PHP: 7.4
Text Domain:  bardage-terrasse-cedre
*/

:root {
	--btc-acc: var(--wp--preset--color--accent-1);       /* brun cèdre */
	--btc-acc-light: var(--wp--preset--color--accent-7); /* cèdre clair, sur fond sombre */
	--btc-ink: var(--wp--preset--color--contrast);
	--btc-dark: var(--wp--preset--color--contrast);
	--btc-muted: var(--wp--preset--color--accent-4);
	--btc-soft: var(--wp--preset--color--accent-5);
	--btc-line: var(--wp--preset--color--accent-6);
}

/* Transitions boutons (theme.json ne gère pas transition) */
.wp-element-button,
.wp-block-button__link {
	transition: background-color .25s, color .25s, border-color .25s;
}

/* Évite le scroll horizontal avec les sections alignfull.
   clip et non hidden : hidden casse le header collant. */
html, body {
	overflow-x: clip;
}

/* Boutons empilés pleine largeur sur mobile */
@media (max-width: 781px) {
	main .wp-block-buttons > .wp-block-button { width: 100%; }
	main .wp-block-buttons > .wp-block-button .wp-block-button__link { width: 100%; box-sizing: border-box; }
}

/* Utilitaires de visibilité */
@media (max-width: 781px) { .masquer-mobile { display: none !important; } }
@media (min-width: 782px) { .masquer-desktop { display: none !important; } }

/* ---------------------------------------------------------------------------
 * Header (collant, réduit au défilement : classe is-scrolled posée par functions.php)
 * ------------------------------------------------------------------------ */
header.wp-block-template-part {
	position: sticky;
	top: 0;
	z-index: 100;
}
@media (min-width: 601px) {
	.admin-bar header.wp-block-template-part { top: var(--wp-admin--admin-bar--height, 32px); }
}
header.wp-block-template-part > * { margin-block-start: 0 !important; }

/* Barre du haut */
.btc-topbar p { margin: 0; font-size: 12px; line-height: 1.5; color: rgba(255, 255, 255, .78); }
.btc-topbar__txt { letter-spacing: .02em; }
.btc-topbar__liens { display: flex; flex-wrap: wrap; gap: 4px 22px; }
.btc-topbar__liens a { color: #fff; font-weight: 600; text-decoration: none; }
.btc-topbar__liens a:hover { color: var(--btc-acc-light); }

/* Barre principale */
.btc-header { background: #fff; border-bottom: 1px solid rgba(155, 155, 155, .33); }
.btc-header__bar { transition: min-height .25s ease; }
.btc-header__logo { margin: 0; }
.btc-header__logo img { transition: width .25s ease; }
.is-scrolled .btc-header__bar { min-height: 70px !important; }
.is-scrolled .btc-header__logo img { width: 78px !important; }
@media (prefers-reduced-motion: reduce) {
	.btc-header__bar, .btc-header__logo img { transition: none; }
}

.btc-header .wp-block-navigation { color: #333; }
.btc-header .wp-block-navigation a:hover { color: var(--btc-acc); }
.btc-header .wp-block-navigation .wp-block-navigation__submenu-container {
	text-transform: none;
	font-weight: 500;
	font-size: 14px;
	border: 0 !important;
	box-shadow: 0 0 10px rgba(0, 0, 0, .12);
	min-width: 260px !important;
}
.btc-header .wp-block-navigation .wp-block-navigation__submenu-container a { padding: 8px 16px; }
.btc-header .wp-block-navigation__responsive-container.is-menu-open { padding: 24px; font-size: 17px; text-transform: none; }

/* Pilule Promotions */
.btc-promo .wp-block-button__link {
	border-radius: 24px !important;
	padding: 9px 18px !important;
	font-size: 13px !important;
	font-weight: 700;
	text-transform: uppercase;
}

/* Recherche (icône qui s'ouvre) */
.btc-search .wp-block-search__button { background: transparent; color: #333; border: 0; padding: 6px; }
.btc-search .wp-block-search__button:hover { color: var(--btc-acc); background: transparent; }
.btc-search .wp-block-search__input { border: 1px solid var(--btc-line); font-size: 14px; }

@media (max-width: 781px) {
	.btc-topbar__txt { display: none; }
	.btc-topbar .alignwide { justify-content: center !important; }
	.btc-promo { display: none !important; }
	.btc-header__bar { min-height: 76px !important; }
	.btc-header__logo img { width: 80px !important; }
}

/* ---------------------------------------------------------------------------
 * Footer
 * ------------------------------------------------------------------------ */
footer.wp-block-template-part > * { margin-block-start: 0 !important; }
.btc-footer-top { background: #fff; border-top: 1px solid #e6e6e6; padding-top: 44px; padding-bottom: 34px; }
.btc-footer-top .wp-block-site-logo { margin-bottom: 14px; }
.btc-footer-h { margin: 0 0 12px !important; font-size: 13px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--btc-acc); }
.btc-footer-txt { margin: 0 0 10px !important; font-size: 14px; line-height: 1.7; }
.btc-footer-txt a, .btc-footer-nav a { color: var(--btc-ink); text-decoration: none; }
.btc-footer-txt a:hover, .btc-footer-nav a:hover { color: var(--btc-acc); }
.btc-footer-nav { font-size: 14px; font-weight: 500; text-transform: none; gap: 8px !important; }
.btc-footer-bottom { background: #F6F6F6; border-top: 1px solid #e6e6e6; padding-top: 10px; padding-bottom: 10px; }
.btc-footer-groupe { align-items: baseline !important; }
.btc-footer-groupe p, .btc-footer-groupe ul, .btc-footer-groupe li { margin: 0 !important; padding: 0; line-height: 1.6; }
.btc-footer-label { font-size: 11px; color: #000; }
.btc-footer-groupe ul { list-style: none; display: flex; flex-wrap: wrap; gap: 6px 22px; }
.btc-footer-groupe a { color: #000; font-size: 12px; text-decoration: none; }
.btc-footer-groupe a:hover { color: var(--btc-acc); }

/* ---------------------------------------------------------------------------
 * Accueil et pages vitrines : composants repris de parquet-lille (classes bth-)
 * ------------------------------------------------------------------------ */
.btc-sans-titre > .wp-block-post-content > :first-child { margin-top: 0; }
.bth-sec { max-width: 1320px !important; margin-left: auto !important; margin-right: auto !important; padding: 70px 24px !important; }
.bth-in { max-width: 1320px !important; margin-left: auto !important; margin-right: auto !important; padding: 0 24px !important; }
.bth-hero, .bth-trust, .bth-dark, .bth-final, .bth-soft, .bth-sec, .bth-in { margin-top: 0 !important; margin-bottom: 0 !important; }
.bth-head { text-align: center; max-width: 780px; margin-left: auto !important; margin-right: auto !important; margin-bottom: 42px !important; }
.bth-eyebrow { font-size: 13px !important; font-weight: 700 !important; letter-spacing: .14em; text-transform: uppercase; color: var(--btc-acc) !important; margin: 0 0 10px !important; }
.bth-lead { font-size: 17px !important; line-height: 1.65 !important; color: var(--btc-muted) !important; }
.bth-h2 { font-size: clamp(26px, 3.4vw, 40px) !important; line-height: 1.15 !important; font-weight: 700 !important; margin: 0 0 14px !important; }
.bth-soft { background: var(--btc-soft) !important; }
.bth-white { background: #fff !important; }

/* Boutons des sections */
.bth-btn-o .wp-block-button__link { background: transparent !important; color: #fff !important; border: 2px solid rgba(255, 255, 255, .75) !important; }
.bth-btn-o .wp-block-button__link:hover { background: #fff !important; color: var(--btc-dark) !important; }

/* Hero */
.bth-hero.wp-block-cover { min-height: 78vh !important; }
.bth-hero .wp-block-cover__background { background: linear-gradient(90deg, rgba(37, 33, 32, .88) 0%, rgba(37, 33, 32, .6) 48%, rgba(37, 33, 32, .22) 100%) !important; opacity: 1 !important; }
.bth-hero .wp-block-cover__inner-container { width: 100%; max-width: 1320px; margin: 0 auto; padding: 0 24px; }
.bth-hero-box { max-width: 860px; }
.bth-hero .bth-eyebrow { color: var(--btc-acc-light) !important; }
.bth-h1 { max-width: 680px; font-size: clamp(34px, 5.2vw, 58px) !important; line-height: 1.08 !important; font-weight: 800 !important; color: #fff !important; margin: 10px 0 16px !important; letter-spacing: -.01em; }
.bth-hero-p { font-size: clamp(16px, 1.6vw, 19px) !important; line-height: 1.6 !important; color: rgba(255, 255, 255, .88) !important; max-width: 760px !important; margin: 0 0 28px !important; }

/* Bande de réassurance */
.bth-trust { background: var(--btc-dark) !important; padding: 30px 0 !important; }
.bth-trust .wp-block-columns { display: grid !important; grid-template-columns: repeat(4, 1fr) !important; gap: 34px !important; margin: 0 !important; }
.bth-trust .wp-block-column { flex-basis: auto !important; width: auto !important; margin: 0 !important; border-top: 3px solid var(--btc-acc); padding-top: 14px; }
.bth-trust-t { font-size: 16px !important; font-weight: 700 !important; color: #fff !important; margin: 0 0 3px !important; line-height: 1.25; }
.bth-trust-s { font-size: 13px !important; color: rgba(255, 255, 255, .62) !important; margin: 0 !important; line-height: 1.35; }

/* Cartes de catégories */
.wp-block-columns:has(.bth-cat) { gap: 22px !important; }
.bth-cat { min-height: 300px; overflow: hidden; position: relative; cursor: pointer; }
.bth-cat img.wp-block-cover__image-background { transition: transform .6s ease; }
.bth-cat:hover img.wp-block-cover__image-background { transform: scale(1.07); }
.bth-cat .wp-block-cover__background { background: linear-gradient(180deg, rgba(37, 33, 32, 0) 35%, rgba(37, 33, 32, .85) 100%) !important; opacity: 1 !important; }
.bth-cat .wp-block-cover__inner-container { position: absolute !important; inset: 0; width: 100%; display: flex; flex-direction: column; justify-content: flex-end; padding: 22px; z-index: 2; }
.bth-cat-e { font-size: 12px !important; font-weight: 700 !important; letter-spacing: .09em; text-transform: uppercase; color: var(--btc-acc-light) !important; margin: 0 0 4px !important; }
.bth-cat-t { font-size: 21px !important; line-height: 1.2 !important; color: #fff !important; margin: 0 !important; }
.bth-cat-t a { color: #fff !important; text-decoration: none; }
.bth-cat-t a::after { content: ""; position: absolute; inset: 0; z-index: 3; }

/* Sections texte + photo */
.bth-split { align-items: center !important; gap: 50px !important; }
.bth-split p { font-size: 16px !important; line-height: 1.7 !important; }
.bth-split img { width: 100%; height: auto; max-height: 460px; object-fit: cover; display: block; }
.bth-products { margin-top: 40px !important; }

/* Section sombre (Easiklip, éco-responsable…) */
.bth-dark { background: var(--btc-dark) !important; padding: 74px 0 !important; }
.bth-dark .bth-h2, .bth-dark h2, .bth-dark h3 { color: #fff !important; }
.bth-dark .bth-eyebrow { color: var(--btc-acc-light) !important; }
.bth-dark .bth-lead, .bth-dark p { color: rgba(255, 255, 255, .76) !important; }
.bth-feats { gap: 20px !important; }
.bth-feats .wp-block-column { background: rgba(255, 255, 255, .055); border: 1px solid rgba(255, 255, 255, .1); padding: 24px 20px; }
.bth-feat-t { font-size: 18px !important; font-weight: 700 !important; color: #fff !important; margin: 0 0 8px !important; }
.bth-feats p:not(.bth-feat-t) { font-size: 14px !important; line-height: 1.6 !important; margin: 0 !important; }

/* Galerie de photos */
.bth-galerie { gap: 12px !important; }
.bth-galerie img { aspect-ratio: 4 / 3; object-fit: cover; }

/* Magasin */
.bth-shop { gap: 44px !important; align-items: stretch !important; }
.bth-shop img { width: 100%; height: 100%; min-height: 320px; object-fit: cover; display: block; }
.bth-info { background: #fff; border: 1px solid var(--btc-line); padding: 30px; }
.bth-info-h { font-size: 13px !important; font-weight: 700 !important; letter-spacing: .12em; text-transform: uppercase; color: var(--btc-acc) !important; margin: 0 0 8px !important; padding-bottom: 8px; border-bottom: 1px solid var(--btc-line); }
.bth-info p:not(.bth-info-h) { font-size: 15px !important; line-height: 1.6 !important; margin: 0 0 22px !important; }
.bth-info a { color: var(--btc-ink); text-decoration: none; }
.bth-info a:hover { color: var(--btc-acc); }

/* Bande d'appel final */
.bth-final { background: var(--btc-acc) !important; padding: 56px 0 !important; text-align: center; }
.bth-final h2 { color: #fff !important; margin: 0 0 10px !important; font-size: clamp(24px, 3vw, 34px) !important; font-weight: 800 !important; }
.bth-final p { color: rgba(255, 255, 255, .9) !important; font-size: 17px !important; margin: 0 0 26px !important; }
.bth-final .wp-block-button__link { background: #fff !important; color: var(--btc-ink) !important; border-color: #fff !important; }
.bth-final .wp-block-button__link:hover { background: var(--btc-dark) !important; color: #fff !important; border-color: var(--btc-dark) !important; }
.bth-final .bth-btn-o .wp-block-button__link { background: transparent !important; color: #fff !important; border-color: rgba(255, 255, 255, .75) !important; }

/* Bloc de texte SEO */
.bth-seo { max-width: 900px !important; }
.bth-seo h2 { font-size: clamp(24px, 2.6vw, 30px) !important; line-height: 1.2 !important; margin: 0 0 16px !important; }
.bth-seo h3 { font-size: 20px !important; color: var(--btc-acc) !important; margin: 28px 0 10px !important; }
.bth-seo p, .bth-seo li { font-size: 15px !important; line-height: 1.75 !important; }

@media (max-width: 980px) {
	.bth-split { gap: 28px !important; }
	.bth-trust .wp-block-columns { grid-template-columns: repeat(2, 1fr) !important; gap: 22px 24px !important; }
}
@media (max-width: 781px) {
	.bth-sec { padding: 48px 20px !important; }
	.bth-in { padding: 0 20px !important; }
	.bth-hero.wp-block-cover { min-height: 70vh !important; }
	.bth-hero .wp-block-cover__background { background: linear-gradient(180deg, rgba(37, 33, 32, .74), rgba(37, 33, 32, .86)) !important; }
	.bth-dark { padding: 52px 0 !important; }
}

/* ---------------------------------------------------------------------------
 * Cartes produits [products] (snippet BTC 03) et bandeau « Acheter en ligne » (BTC 08)
 * réhabillés aux couleurs du thème
 * ------------------------------------------------------------------------ */
body .btc-product { border-color: var(--btc-line); }
body .btc-product__title { font-weight: 600; }
body .btc-product__title a { color: var(--btc-ink); }
body .btc-product__title a:hover, body .btc-product__price { color: var(--btc-acc); }
body .btc-acheter { background: var(--btc-soft); border-bottom-color: var(--btc-line); }
body .btc-acheter__txt { color: var(--btc-ink); }
body .btc-acheter__btn { border-radius: 0; font-weight: 600; }
body .btc-acheter__btn--mdn { background: var(--wp--preset--color--accent-3); }
body .btc-acheter__btn--ek { background: var(--btc-dark); }

/* ---------------------------------------------------------------------------
 * Contenus hérités (anciennes galeries et boutons)
 * ------------------------------------------------------------------------ */
.entry-content .gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; margin: 20px 0; }
.entry-content .gallery-item { margin: 0; width: auto !important; max-width: none !important; }
.entry-content .gallery img { width: 100%; height: auto; aspect-ratio: 1/1; object-fit: cover; border: 0 !important; display: block; }
.entry-content .gallery-columns-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.btc-justify { text-align: justify; }

/* Anciennes classes de l'accueil 1.x, encore utilisées sur Location et Partenaires */
.btc-home-h2 { margin-top: 40px !important; font-size: clamp(22px, 2.4vw, 28px); }
.btc-home-h3 { font-size: 17px; }

/* ---------------------------------------------------------------------------
 * Blog « Conseils & actualités »
 * ------------------------------------------------------------------------ */
/* Grille d'articles (page Conseils & actualités, archives, « À lire aussi ») */
.btc-blog-filtres { margin: 26px 0 34px !important; gap: 10px !important; }
.btc-blog-filtres .wp-block-button__link { padding: 8px 18px !important; font-size: 13px !important; }
.btc-blog-grille { margin-top: 30px; }
.btc-blog-grille .wp-block-post-template { gap: 22px !important; }
.btc-blog-grille .wp-block-post { position: relative; background: #fff; border: 1px solid var(--btc-line); display: flex; flex-direction: column; margin: 0; overflow: hidden; transition: box-shadow .25s, transform .25s; }
.btc-blog-grille .wp-block-post:hover { box-shadow: 0 10px 26px rgba(0, 0, 0, .09); transform: translateY(-3px); }
.btc-blog-grille .wp-block-post-featured-image { margin: 0; overflow: hidden; }
.btc-blog-grille .wp-block-post-featured-image img { transition: transform .6s ease; }
.btc-blog-grille .wp-block-post:hover .wp-block-post-featured-image img { transform: scale(1.05); }
.btc-blog-grille .btc-blog-cat { margin: 16px 18px 0 !important; }
.btc-blog-grille .wp-block-post-title { font-size: 18px !important; line-height: 1.35; margin: 10px 18px 8px !important; }
.btc-blog-grille .wp-block-post-title a { color: var(--btc-ink); text-decoration: none; }
.btc-blog-grille .wp-block-post-title a:hover { color: var(--btc-acc); }
.btc-blog-grille .wp-block-post-excerpt { margin: 0 18px 12px; font-size: 14px; }
.btc-blog-grille .wp-block-post-excerpt__excerpt { margin: 0; }
.btc-blog-grille .btc-blog-date { margin: auto 18px 16px !important; }
.btc-blog-grille .wp-block-query-pagination { margin-top: 34px; }
@media (max-width: 980px) { .btc-blog-grille .wp-block-post-template.is-layout-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .btc-blog-grille .wp-block-post-template.is-layout-grid { grid-template-columns: 1fr; } }

/* Catégorie (surtitre) et date */
.btc-blog-cat { font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; margin-bottom: 8px !important; }
.btc-blog-cat a { color: var(--btc-acc); text-decoration: none; }
.btc-blog-date { font-size: 13px; color: #999; margin-top: 0 !important; }

/* Archive de catégorie */
.btc-archive .wp-block-query-title { margin-top: 0; }
.btc-term-desc { max-width: 780px; font-size: 17px; }
.btc-archive .bth-eyebrow a { color: inherit; text-decoration: none; }

/* Article */
.btc-single .wp-block-post-title { margin-top: 0; }
.btc-single-img { margin-top: 26px !important; margin-bottom: 30px !important; }
.btc-single .wp-block-post-content { font-size: 17px; line-height: 1.75; }
.btc-single .wp-block-post-content h2 { margin-top: 2.2em; }
.btc-single .wp-block-post-content h3 { margin-top: 1.8em; }
.btc-single-cta { margin-top: 60px !important; }
.btc-chapo { font-size: 19px !important; line-height: 1.6 !important; color: var(--btc-ink); font-weight: 500; }
.btc-a-retenir, .btc-fiche-chantier { padding: 22px 26px !important; }
.btc-a-retenir ul, .btc-fiche-chantier ul { margin-bottom: 0; }

/* Questions fréquentes (blocs Détails) */
.wp-block-details { background: #fff; border: 1px solid #D9D6CC; border-radius: 6px; margin: 0 0 10px; padding: 0; }
.wp-block-details summary { cursor: pointer; list-style: none; position: relative; padding: 14px 48px 14px 18px; font-weight: 600; line-height: 1.4; color: var(--btc-ink); }
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after { content: "+"; position: absolute; right: 18px; top: 50%; transform: translateY(-50%); font-size: 22px; font-weight: 400; line-height: 1; color: var(--btc-acc); }
.wp-block-details[open] summary::after { content: "\2013"; }
.wp-block-details summary:hover { background: var(--btc-soft); }
.wp-block-details[open] summary { border-bottom: 1px solid var(--btc-line); }
.wp-block-details > :not(summary) { margin: 0; padding: 12px 18px 16px; }