/* =====================================================================
   BONOTŌ — SECTIONS EN BLOCS (pages La Maison, Diagnostic, et vos pages)
   Chaque section est un bloc WordPress avec une classe « bn-… ».
   ===================================================================== */

/* ---------- conteneur de page ---------- */
.bn-page{--bn-pad:40px;}
@media (max-width:900px){ .bn-page{--bn-pad:22px;} }
.bn-page > *{margin-top:0 !important; margin-bottom:0 !important;}
.bn-breadcrumb{max-width:var(--max); margin:0 auto; padding:18px 40px 18px; font-size:.76rem; color:var(--ink-soft); letter-spacing:.02em;}
.bn-breadcrumb a:hover{color:var(--bordeaux);}
.bn-breadcrumb .sep{margin:0 6px; color:var(--stone);}
@media (max-width:900px){ .bn-breadcrumb{padding:16px 22px;} }

/* ---------- sur-titre avec la signature ---------- */
.bn-kicker{display:flex; align-items:center; gap:12px; font-family:var(--font-body); font-weight:500; font-size:.72rem; letter-spacing:.22em; text-transform:uppercase; color:var(--bordeaux); margin:0 0 18px !important; line-height:1.4;}
.bn-kicker::before{content:""; flex:none; width:26px; height:14px; margin-top:12px;
  background:linear-gradient(currentColor,currentColor) 0 0/26px 2px no-repeat,
             radial-gradient(circle at 13px 10px, transparent 0 2.3px, currentColor 2.6px 4.2px, transparent 4.5px);}
.bn-kicker.has-text-align-center{justify-content:center;}

/* ---------- section ---------- */
.bn-section{padding:110px var(--bn-pad, 40px) !important; margin:0 !important;}
/* Thèmes classiques : WordPress ajoute un conteneur interne aux groupes ; on le rend « transparent ». */
.bn-page .wp-block-group__inner-container{display:contents;}
.bn-section > *, .bn-section > .wp-block-group__inner-container > *{max-width:calc(var(--max) - 80px); margin-left:auto !important; margin-right:auto !important;}
.bn-section.bn-narrow > *, .bn-section.bn-narrow > .wp-block-group__inner-container > *{max-width:820px;}
@media (max-width:900px){ .bn-section{padding:66px var(--bn-pad, 22px) !important;} }
.bn-bg-white{background:var(--white);}
.bn-bg-blush{background:var(--blush);}
.bn-bg-ivoire{background:var(--ivoire);}
.bn-bg-bordeaux{background:var(--bordeaux); color:var(--blush);}
.bn-bg-bordeaux h2, .bn-bg-bordeaux h3, .bn-bg-bordeaux h4{color:var(--white);}
.bn-bg-bordeaux .bn-kicker{color:var(--blush);}
.bn-bg-bordeaux .bn-lede{color:rgba(244,224,223,.82);}

.bn-section :where(p, h1, h2, h3, h4, ul, figure){margin-top:0; margin-bottom:0;}
.bn-section h2{font-size:clamp(1.8rem,2.8vw,2.5rem); margin:0 0 22px;}
.bn-section .bn-head{max-width:700px !important; text-align:center;}
.bn-head h2:last-child, .bn-head p:last-child{margin-bottom:0;}
.bn-head + *{margin-top:56px !important;}
.bn-lede{color:var(--ink-soft); font-size:1.02rem;}
.bn-lede + .bn-lede{margin-top:14px;}
.bn-section p + p{margin-top:14px;}
.bn-note{border:1px dashed var(--stone); background:rgba(195,178,155,.12); padding:18px 22px; font-size:.85rem; color:var(--ink-soft); font-style:italic; border-radius:var(--radius); margin-top:14px !important;}
.bn-manifesto{max-width:780px; margin:0 auto !important; text-align:center; font-family:var(--font-heading); font-style:italic; font-weight:400; font-size:clamp(1.4rem,2.4vw,1.9rem); color:var(--bordeaux); line-height:1.5;}

/* ---------- boutons ---------- */
.bn-page .wp-block-buttons{gap:16px; margin-top:30px;}
.bn-page .wp-block-button__link{display:inline-flex; align-items:center; justify-content:center; font-family:var(--font-body); font-size:.82rem; letter-spacing:.08em; text-transform:uppercase; padding:16px 30px; border-radius:var(--radius); background:var(--bordeaux); color:var(--white) !important; border:1.5px solid var(--bordeaux); transition:all .25s ease; text-decoration:none !important;}
.bn-page .wp-block-button__link:hover{background:var(--bordeaux-soft); border-color:var(--bordeaux-soft);}
.bn-page .is-style-outline .wp-block-button__link{background:transparent; color:var(--bordeaux) !important;}
.bn-page .is-style-outline .wp-block-button__link:hover{background:var(--bordeaux); color:var(--white) !important;}

/* ---------- bannière de page (bloc Couverture) ---------- */
.bn-page-hero{min-height:78vh !important; max-height:780px; align-items:flex-end !important; padding:0 !important; overflow:hidden;}
.bn-page-hero .wp-block-cover__background{opacity:1 !important; background:linear-gradient(0deg, rgba(30,10,8,.72) 0%, rgba(30,10,8,.16) 55%, rgba(30,10,8,.06) 100%) !important;}
.bn-page-hero .wp-block-cover__image-background{object-position:center 38%;}
.bn-page-hero .wp-block-cover__inner-container{width:100% !important; max-width:var(--max); margin:0 auto; padding:0 40px 70px; color:var(--white);}
.bn-page-hero .wp-block-cover__inner-container > *{max-width:680px;}
.bn-page-hero .bn-kicker{color:var(--blush);}
.bn-page-hero h1{color:var(--white); font-size:clamp(2.1rem,4.2vw,3.3rem); font-weight:400; margin:0 0 16px;}
.bn-page-hero h1 em{color:var(--blush);}
.bn-page-hero p{font-size:1.02rem; opacity:.92; max-width:480px;}
.bn-tagline{font-family:var(--font-heading); font-style:italic; font-size:1.1rem !important; letter-spacing:.02em;}
.bn-hero-sub{margin-top:16px !important; font-size:.76rem !important; letter-spacing:.1em; text-transform:uppercase; opacity:.8;}
@media (max-width:900px){ .bn-page-hero{min-height:64vh !important;} .bn-page-hero .wp-block-cover__inner-container{padding:0 22px 48px;} }

/* variante claire (image à droite, texte sur fond ivoire) */
.bn-page-hero.bn-hero-light{align-items:center !important; min-height:86vh !important;}
.bn-page-hero.bn-hero-light .wp-block-cover__background{background:linear-gradient(90deg, rgba(242,234,225,.96) 0%, rgba(242,234,225,.82) 32%, rgba(242,234,225,.15) 58%, transparent 72%) !important;}
.bn-page-hero.bn-hero-light .wp-block-cover__image-background{object-position:62% center;}
.bn-page-hero.bn-hero-light .wp-block-cover__inner-container{color:var(--ink); padding-bottom:0;}
.bn-page-hero.bn-hero-light .wp-block-cover__inner-container > *{max-width:520px;}
.bn-page-hero.bn-hero-light .bn-kicker{color:var(--bordeaux);}
.bn-page-hero.bn-hero-light h1{color:var(--bordeaux); font-style:italic;}
.bn-page-hero.bn-hero-light p{color:var(--ink-soft); opacity:1;}
@media (max-width:900px){
  .bn-page-hero.bn-hero-light{min-height:0 !important; display:block !important;}
  .bn-page-hero.bn-hero-light .wp-block-cover__image-background{position:static !important; height:56vw; max-height:420px; object-position:65% center;}
  .bn-page-hero.bn-hero-light .wp-block-cover__background{display:none;}
  .bn-page-hero.bn-hero-light .wp-block-cover__inner-container{background:var(--ivoire); padding:34px 22px 44px;}
}

/* ---------- histoire : texte + image ---------- */
.bn-story{display:grid !important; grid-template-columns:1fr 1fr; gap:70px !important; align-items:center !important;}
.bn-story > .wp-block-column{flex:none !important; width:auto !important; margin:0 !important;}
.bn-story.bn-story-rev > .wp-block-column:first-child{order:2;}
.bn-story .wp-block-image, .bn-story .wp-block-image img{width:100%; margin:0;}
.bn-story .wp-block-image img{aspect-ratio:4/5; object-fit:cover; border-radius:var(--radius); box-shadow:0 20px 50px -30px rgba(63,7,7,.3); height:auto;}
.bn-story h2{margin-bottom:20px;}
.bn-story p + p{color:var(--ink-soft);}
@media (max-width:900px){
  .bn-story{grid-template-columns:1fr; gap:32px !important;}
  .bn-story > .wp-block-column:has(.wp-block-image){order:-1;}
  .bn-story.bn-story-rev > .wp-block-column:first-child{order:2;}
}

/* ---------- bandeau citation (Couverture) ---------- */
.bn-quote-band{padding:150px 40px !important; min-height:0 !important; text-align:center;}
.bn-quote-band .wp-block-cover__background{opacity:1 !important; background:rgba(30,10,8,.6) !important;}
.bn-quote{font-family:var(--font-heading); font-style:italic; font-weight:400; font-size:clamp(1.5rem,3vw,2.3rem) !important; max-width:780px; margin:0 auto 24px !important; line-height:1.45; color:var(--white);}
.bn-attr{font-size:.7rem !important; letter-spacing:.18em; text-transform:uppercase; opacity:.85; color:var(--white);}
@media (max-width:900px){ .bn-quote-band{padding:100px 22px !important;} }

/* ---------- liste numérotée (mission, vision…) ---------- */
.bn-section .bn-numbered{max-width:820px !important;}
.bn-num-row{display:grid !important; grid-template-columns:70px 1fr; gap:24px; padding:32px 0; border-top:1px solid var(--stone-line); margin:0 !important;}
.bn-num-row:last-child{border-bottom:1px solid var(--stone-line);}
.bn-num{font-family:var(--font-heading); font-style:italic; color:var(--stone); font-size:1.8rem !important; line-height:1.2;}
.bn-num-row h4{font-family:var(--font-body); font-size:.68rem; letter-spacing:.16em; text-transform:uppercase; color:var(--bordeaux); margin:0 0 10px !important; font-weight:500;}
.bn-num-row p{font-size:.95rem; color:var(--ink); line-height:1.65;}
@media (max-width:600px){ .bn-num-row{grid-template-columns:1fr; gap:4px;} }

/* ---------- engagements ---------- */
.bn-eng{display:flex !important; flex-wrap:wrap; justify-content:center; border-top:1px solid var(--stone-line);}
.bn-eng-item{flex:1; min-width:170px; text-align:center; padding:30px 18px; border-right:1px solid var(--stone-line); border-bottom:1px solid var(--stone-line); margin:0 !important;}
.bn-eng-item:last-child{border-right:none;}
.bn-eng-t{font-family:var(--font-heading); font-style:italic; font-size:1rem; color:var(--bordeaux); margin-bottom:6px !important;}
.bn-eng-d{font-size:.78rem; color:var(--ink-soft); margin-top:0 !important;}
@media (max-width:900px){ .bn-eng-item{min-width:45%; border-right:none;} }

/* ---------- cartes « Et maintenant ? » ---------- */
.bn-cards{display:grid !important; grid-template-columns:repeat(2,1fr); gap:24px !important;}
.bn-cards.bn-cols-3{grid-template-columns:repeat(3,1fr);}
.bn-cards > .wp-block-column{width:auto !important; flex:none !important; margin:0 !important;}
.bn-card{position:relative; height:100%; padding:44px 36px; border:1px solid var(--stone-line); background:var(--white); transition:box-shadow .25s ease, transform .25s ease;}
.bn-card:hover{box-shadow:0 24px 50px -30px rgba(63,7,7,.4); transform:translateY(-3px);}
.bn-card-cat{font-size:.66rem !important; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-soft); margin-bottom:10px !important;}
.bn-card h4{font-size:1.3rem; margin:0 0 12px !important;}
.bn-card p{font-size:.88rem; color:var(--ink-soft);}
.bn-card-go{margin-top:20px !important;}
.bn-card-go a{font-size:.78rem; letter-spacing:.05em; text-transform:uppercase; color:var(--bordeaux); border-bottom:1px solid var(--bordeaux); padding-bottom:2px; text-decoration:none;}
.bn-card-go a::after{content:""; position:absolute; inset:0;} /* toute la carte est cliquable */
@media (max-width:900px){ .bn-cards, .bn-cards.bn-cols-3{grid-template-columns:1fr;} }

/* ---------- piliers avec icônes ---------- */
.bn-pillars{display:grid !important; grid-template-columns:repeat(4,1fr); gap:36px;}
.bn-pillars.bn-cols-3{grid-template-columns:repeat(3,1fr); gap:40px;}
.bn-pillar{text-align:center; padding:0 8px; margin:0 !important;}
.bn-pillar::before{content:""; display:block; width:56px; height:56px; border-radius:50%; border:1px solid var(--bordeaux); margin:0 auto 20px;
  background:var(--bn-icon) center/22px 22px no-repeat;}
.bn-pnum{font-family:var(--font-heading); font-style:italic; color:var(--stone); font-size:.85rem !important; margin-bottom:6px !important;}
.bn-pillar h3{font-size:1.05rem; margin:0 0 10px !important;}
.bn-pillar p{font-size:.85rem; color:var(--ink-soft);}
@media (max-width:900px){ .bn-pillars, .bn-pillars.bn-cols-3{grid-template-columns:1fr 1fr; gap:38px 20px;} }
@media (max-width:560px){ .bn-pillars, .bn-pillars.bn-cols-3{grid-template-columns:1fr; gap:36px;} }
/* icônes disponibles : ajoutez la classe sur le groupe « bn-pillar » */
.bn-pillar{--bn-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233F0707' stroke-width='1.2'%3E%3Cpath d='M12 2l2.5 6.5L21 11l-6.5 2.5L12 20l-2.5-6.5L3 11l6.5-2.5z'/%3E%3C/svg%3E");}
.bn-icon-eye{--bn-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233F0707' stroke-width='1.2'%3E%3Ccircle cx='12' cy='12' r='3.2'/%3E%3Cpath d='M2 12s3.5-6.5 10-6.5S22 12 22 12s-3.5 6.5-10 6.5S2 12 2 12z'/%3E%3C/svg%3E");}
.bn-icon-clock{--bn-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233F0707' stroke-width='1.2'%3E%3Ccircle cx='12' cy='12' r='8'/%3E%3Cpath d='M12 8v4l3 2'/%3E%3C/svg%3E");}
.bn-icon-spark{--bn-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233F0707' stroke-width='1.2'%3E%3Cpath d='M12 2l2.5 6.5L21 11l-6.5 2.5L12 20l-2.5-6.5L3 11l6.5-2.5z'/%3E%3C/svg%3E");}
.bn-icon-chart{--bn-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233F0707' stroke-width='1.2'%3E%3Crect x='4' y='13' width='6' height='7'/%3E%3Crect x='14' y='9' width='6' height='11'/%3E%3Crect x='9' y='4' width='6' height='16'/%3E%3C/svg%3E");}
.bn-icon-drop{--bn-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233F0707' stroke-width='1.2'%3E%3Cpath d='M12 3c-4 3-7 6-7 10a7 7 0 0014 0c0-4-3-7-7-10z'/%3E%3C/svg%3E");}
.bn-icon-heart{--bn-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233F0707' stroke-width='1.2'%3E%3Cpath d='M12 20s-7-4.5-7-10a4 4 0 017-2.6A4 4 0 0119 10c0 5.5-7 10-7 10z'/%3E%3C/svg%3E");}
.bn-icon-leaf{--bn-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233F0707' stroke-width='1.2'%3E%3Cpath d='M5 19c0-8 6-14 14-14 0 8-6 14-14 14z'/%3E%3Cpath d='M5 19l8-8'/%3E%3C/svg%3E");}

/* ---------- étiquettes ---------- */
.bn-tags{display:flex !important; flex-wrap:wrap; gap:10px; list-style:none; padding:0 !important; margin-top:24px !important;}
.bn-tags li{background:var(--white); border:1px solid var(--stone); font-size:.8rem; padding:8px 16px; border-radius:20px; color:var(--ink); margin:0 !important;}
.has-text-align-center + .bn-tags, .bn-head + .bn-tags{justify-content:center;}

/* ---------- liste à coches ---------- */
.bn-checklist{list-style:none; padding:0 !important; display:flex !important; flex-direction:column; gap:16px; margin-top:24px !important;}
.bn-checklist li{position:relative; padding-left:30px; font-size:.95rem; margin:0 !important;}
.bn-checklist li::before{content:""; position:absolute; left:0; top:4px; width:18px; height:18px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23BA8F29' stroke-width='2'%3E%3Cpolyline points='4,13 9,18 20,6'/%3E%3C/svg%3E") center/contain no-repeat;}
.bn-checklist strong{color:var(--bordeaux); font-weight:500;}

/* ---------- étapes / cartes numérotées ---------- */
.bn-usage-grid{display:grid !important; grid-template-columns:repeat(4,1fr); gap:22px;}
.bn-usage-grid.bn-cols-3{grid-template-columns:repeat(3,1fr);}
.bn-usage-card{background:var(--white); border:1px solid var(--stone-line); padding:28px 24px; border-radius:var(--radius); margin:0 !important;}
.bn-bg-white .bn-usage-card{background:var(--ivoire);}
.bn-usage-num{font-family:var(--font-heading); font-style:italic; color:var(--stone); font-size:1.4rem !important; margin-bottom:12px !important;}
.bn-usage-card h4{font-size:.98rem; margin:0 0 8px !important;}
.bn-usage-card p{font-size:.82rem; color:var(--ink-soft);}
@media (max-width:900px){ .bn-usage-grid, .bn-usage-grid.bn-cols-3{grid-template-columns:1fr 1fr; gap:16px;} }
@media (max-width:560px){ .bn-usage-grid, .bn-usage-grid.bn-cols-3{grid-template-columns:1fr;} }

/* ---------- image large ---------- */
.bn-wide-shot{border-radius:var(--radius); overflow:hidden; box-shadow:0 24px 60px -34px rgba(63,7,7,.35); margin:0 auto 54px !important;}
.bn-wide-shot img{width:100%; height:auto; display:block;}

/* ---------- ce que vous recevez ---------- */
.bn-recv{display:flex !important; flex-direction:column; gap:20px; margin-top:26px !important;}
.bn-recv-item{border-top:1px solid var(--stone-line); padding-top:18px; margin:0 !important;}
.bn-recv-item:first-child{border-top:none; padding-top:0;}
.bn-rt{font-family:var(--font-heading); font-style:italic; color:var(--bordeaux); font-size:1.05rem; margin-bottom:4px !important;}
.bn-rd{font-size:.86rem; color:var(--ink-soft); margin-top:0 !important;}

/* ---------- comparaison ---------- */
.bn-compare{margin-top:26px !important; border-top:1px solid var(--stone-line);}
.bn-compare-row{display:flex !important; gap:16px; padding:16px 0; border-bottom:1px solid var(--stone-line); font-size:.86rem; margin:0 !important;}
.bn-compare-label{flex:none; width:110px; font-weight:500; font-size:.68rem !important; letter-spacing:.1em; text-transform:uppercase; color:var(--bordeaux); padding-top:2px; margin:0 !important;}
.bn-compare-q{font-family:var(--font-heading); font-style:italic; color:var(--ink); margin:0 !important;}

/* ---------- appel final (Couverture) ---------- */
.bn-final-cta{padding:140px 40px !important; min-height:0 !important; text-align:center;}
.bn-final-cta .wp-block-cover__background{opacity:1 !important; background:rgba(30,10,8,.62) !important;}
.bn-final-cta .wp-block-cover__inner-container{color:var(--white);}
.bn-final-cta .bn-kicker{color:var(--blush);}
.bn-final-cta h2{color:var(--white); font-size:clamp(1.9rem,3.2vw,2.6rem); max-width:640px; margin:0 auto 20px !important;}
.bn-final-cta p{max-width:520px; margin:0 auto 6px !important; opacity:.92;}
.bn-final-cta .wp-block-buttons{justify-content:center;}
@media (max-width:900px){ .bn-final-cta{padding:90px 22px !important;} }

/* ---------- FAQ (bloc Détails) ---------- */
.bn-faq{border-top:1px solid var(--stone-line);}
.bn-page details.wp-block-details, .bn-faq details{border-bottom:1px solid var(--stone-line); padding:0; margin:0 !important;}
.bn-page details.wp-block-details summary{cursor:pointer; list-style:none; padding:20px 30px 20px 0; position:relative; font-family:var(--font-heading); font-size:1.05rem; color:var(--ink);}
.bn-page details.wp-block-details summary::-webkit-details-marker{display:none;}
.bn-page details.wp-block-details summary::after{content:"+"; position:absolute; right:4px; top:16px; font-family:var(--font-body); font-size:1.3rem; color:var(--bordeaux); transition:transform .3s ease;}
.bn-page details.wp-block-details[open] summary::after{transform:rotate(45deg);}
.bn-page details.wp-block-details > :not(summary){padding-bottom:20px; color:var(--ink-soft); font-size:.92rem;}

/* ---------- animations (réutilise les réglages du thème) ---------- */
.js-anim.anim-fade-up .bn-section:not(.in), .js-anim.anim-fade-up .bn-anim:not(.in){opacity:0; transform:translateY(26px);}
.js-anim.anim-fade .bn-section:not(.in){opacity:0;}
.js-anim.anim-zoom .bn-section:not(.in){opacity:0; transform:scale(.965);}
.js-anim.anim-slide .bn-section:not(.in){opacity:0; transform:translateX(-30px);}
.js-anim.anim-blur .bn-section:not(.in){opacity:0; filter:blur(8px);}
.js-anim .bn-section{transition:opacity var(--anim-dur) ease, transform var(--anim-dur) cubic-bezier(.2,.7,.2,1), filter var(--anim-dur) ease;}

/* ---------- dans l'éditeur : tout reste visible ---------- */
.editor-styles-wrapper .bn-section{opacity:1 !important; transform:none !important; filter:none !important;}
