/*
Theme Name: Bulle de douceur
Theme URI: https://bulle-de-douceur.be
Author: Fabrice Lowys
Description: Thème premium et apaisant pour Bulle de douceur : bains enveloppés, massages bébé et conseils en allaitement. Tons taupe, beige et rose poudré, formes en arche, mouvements doux, emplacements photo modifiables, polices hébergées localement.
Version: 2.0.0
Requires at least: 6.5
Tested up to: 7.1
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: bulle-de-douceur
*/

/* =====================================================================
   Base
   ===================================================================== */
:root {
	--bd-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
	--bd-bubble: radial-gradient(circle closest-side at 32% 28%, rgba(255, 255, 255, 0.9) 0, rgba(255, 255, 255, 0.2) 55%, rgba(214, 175, 162, 0.32) 99%, rgba(214, 175, 162, 0) 100%);
}
html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; overflow-x: hidden; }
a { text-underline-offset: 0.2em; }
img { max-width: 100%; height: auto; }
.wp-site-blocks > * + * { margin-block-start: 0; }
.wp-block-post-content > .alignfull { margin-block-start: 0; margin-block-end: 0; }
main.wp-block-group { margin-block-start: 0; }
.wp-block-heading em { font-style: italic; color: var(--wp--preset--color--taupe); }
h1.wp-block-heading, h2.wp-block-heading, h3.wp-block-heading { text-wrap: balance; }
.bd-center { text-align: center; }
.bd-narrow { max-width: 760px; margin-inline: auto; }

/* =====================================================================
   En-tête collant
   ===================================================================== */
header.wp-block-template-part { position: sticky; top: 0; z-index: 50; }
.admin-bar header.wp-block-template-part { top: 32px; }
@media (max-width: 782px) { .admin-bar header.wp-block-template-part { top: 46px; } }

.bd-header {
	padding: 1rem clamp(1.25rem, 5vw, 4rem);
	background: rgba(246, 241, 234, 0.88);
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
	border-bottom: 1px solid rgba(119, 106, 86, 0.18);
}
.bd-header-inner { max-width: 1200px; margin-inline: auto; align-items: center; gap: 1rem; }
.bd-brand, .bd-brand a {
	font-family: var(--wp--preset--font-family--cormorant);
	font-weight: 500;
	font-size: clamp(1.3rem, 3vw, 1.65rem);
	letter-spacing: 0.16em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--wp--preset--color--brun);
	margin: 0;
	white-space: nowrap;
}
.bd-header .wp-block-navigation { font-size: 0.95rem; letter-spacing: 0.04em; font-weight: 400; }
.bd-header .wp-block-navigation-item__content { position: relative; text-decoration: none; color: var(--wp--preset--color--brun); padding: 0.25rem 0; }
.bd-header .wp-block-navigation-item:not(.bd-nav-cta) .wp-block-navigation-item__content::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	height: 1px;
	width: 0;
	background: currentColor;
	transition: width 0.35s ease;
}
.bd-header .wp-block-navigation-item:not(.bd-nav-cta) .wp-block-navigation-item__content:hover::after { width: 100%; }
.bd-header .bd-nav-cta .wp-block-navigation-item__content {
	background: var(--wp--preset--color--taupe);
	color: var(--wp--preset--color--creme);
	padding: 0.65rem 1.5rem;
	border-radius: 999px;
	transition: background-color 0.35s ease, transform 0.35s ease;
}
.bd-header .bd-nav-cta .wp-block-navigation-item__content:hover { background: var(--wp--preset--color--brun); transform: translateY(-1px); }
.bd-header .wp-block-navigation__responsive-container.is-menu-open { background: var(--wp--preset--color--creme); color: var(--wp--preset--color--brun); }
.bd-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-size: 1.5rem; }

/* =====================================================================
   Mouvement
   ===================================================================== */
@keyframes bd-rise { to { opacity: 1; transform: none; } }
@keyframes bd-floaty { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(10px, -22px); } }
@keyframes bd-spin { to { transform: rotate(360deg); } }
@keyframes bd-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes bd-revealin { from { opacity: 0; transform: translateY(46px); } to { opacity: 1; transform: none; } }

.bd-rise { opacity: 0; transform: translateY(26px); animation: bd-rise 1s var(--bd-ease) forwards; }
.bd-d1 { animation-delay: 0.1s; }
.bd-d2 { animation-delay: 0.25s; }
.bd-d3 { animation-delay: 0.4s; }
.bd-d4 { animation-delay: 0.55s; }
.bd-d5 { animation-delay: 0.7s; }

/* Apparition au défilement (navigateurs compatibles) ; sinon tout reste visible */
@supports (animation-timeline: view()) {
	.bd-reveal { animation: bd-revealin linear both; animation-timeline: view(); animation-range: entry 0% entry 40%; }
}

/* Bulles qui flottent (décor) */
.bd-bubbles { position: relative; overflow: hidden; }
.bd-bubbles > * { position: relative; z-index: 1; }
.bd-bubbles::before, .bd-bubbles::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; pointer-events: none; background-repeat: no-repeat; z-index: 0; }
.bd-bubbles::before {
	background-image: var(--bd-bubble), var(--bd-bubble), var(--bd-bubble);
	background-size: 96px 96px, 34px 34px, 58px 58px;
	background-position: 4% 12%, 44% 8%, 47% 90%;
	animation: bd-floaty 12s ease-in-out infinite;
}
.bd-bubbles::after {
	background-image: var(--bd-bubble), var(--bd-bubble);
	background-size: 22px 22px, 42px 42px;
	background-position: 94% 14%, 10% 84%;
	animation: bd-floaty 9s ease-in-out infinite reverse;
}

/* Anneaux en pointillés qui tournent (décor) */
.bd-rings { position: relative; overflow: hidden; }
.bd-rings > * { position: relative; z-index: 1; }
.bd-rings::before, .bd-rings::after {
	content: "";
	position: absolute;
	border-radius: 50%;
	border: 1px dashed rgba(246, 241, 234, 0.3);
	pointer-events: none;
	animation: bd-spin 80s linear infinite;
	z-index: 0;
}
.bd-rings::before { width: 520px; height: 520px; left: -160px; top: -200px; }
.bd-rings::after { width: 360px; height: 360px; right: -100px; bottom: -160px; }

/* =====================================================================
   Sections
   ===================================================================== */
.bd-section { padding: clamp(4rem, 10vw, 8rem) clamp(1.25rem, 5vw, 4rem); }
.bd-creme { background: var(--wp--preset--color--creme); }
.bd-sable { background: var(--wp--preset--color--sable); }
.bd-rose { background: var(--wp--preset--color--rose); }
.bd-taupe { background: var(--wp--preset--color--taupe); color: var(--wp--preset--color--creme); }
.bd-taupe h1, .bd-taupe h2, .bd-taupe h3, .bd-taupe a:not(.wp-block-button__link) { color: var(--wp--preset--color--creme); }
.bd-taupe .wp-block-heading em, .bd-rose .wp-block-heading em { color: inherit; }
.bd-eyebrow { font-size: 0.8rem; letter-spacing: 0.22em; text-transform: uppercase; color: var(--wp--preset--color--taupe); font-weight: 400; margin: 0; }
.bd-rose .bd-eyebrow { color: var(--wp--preset--color--brun); }
.bd-taupe .bd-eyebrow { color: var(--wp--preset--color--creme); }
.bd-lead { font-size: clamp(1.1rem, 2vw, 1.3rem); line-height: 1.65; }
.bd-signature { font-family: var(--wp--preset--font-family--cormorant); font-style: italic; font-size: 2.5rem; line-height: 1; color: var(--wp--preset--color--taupe); margin: 0; }
.bd-section .wp-block-heading { margin: 0; }
.bd-section-title { display: flex; flex-direction: column; gap: 1rem; align-items: center; text-align: center; margin-bottom: clamp(2rem, 5vw, 4rem); }

/* Hero */
.bd-hero2 {
	background: linear-gradient(180deg, #F6F1EA 0%, #EFE6D9 100%);
	padding: clamp(2.5rem, 7vw, 6rem) clamp(1.25rem, 5vw, 4rem) clamp(3.5rem, 8vw, 7rem);
}
.bd-pagehero { background: var(--wp--preset--color--sable); padding: clamp(2.5rem, 7vw, 6rem) clamp(1.25rem, 5vw, 4rem) clamp(3rem, 7vw, 6rem); }
.bd-hero-cols, .bd-cols-center { align-items: center; gap: clamp(2.5rem, 6vw, 5rem); }
.bd-hero-cols > .wp-block-column, .bd-cols-center > .wp-block-column { display: flex; flex-direction: column; gap: 1.5rem; align-items: flex-start; }
.bd-hero-cols h1, .bd-pagehero h1 { margin: 0; letter-spacing: -0.01em; }
.bd-h1-xl { font-size: clamp(2.7rem, 6.2vw, 5.4rem) !important; line-height: 1.02 !important; font-weight: 400; }
.bd-pagehero h1 { font-size: clamp(2.5rem, 5.6vw, 4.6rem); line-height: 1.04; font-weight: 400; }
.bd-eyebrow-line { display: flex; align-items: center; gap: 0.9rem; font-size: 0.8rem; letter-spacing: 0.22em; text-transform: uppercase; color: var(--wp--preset--color--taupe); font-weight: 400; margin: 0; }
.bd-eyebrow-line::before { content: ""; display: inline-block; width: 36px; height: 1px; background: currentColor; }
.bd-hero-cols p, .bd-pagehero p { margin: 0; }
.bd-trust { border-top: 1px solid rgba(119, 106, 86, 0.3); padding-top: 1.5rem; margin-top: 0.5rem; font-size: 0.95rem; gap: 0.5rem 1.75rem; width: 100%; }
.bd-trust p { margin: 0; }

/* Photos */
.bd-hero-photo { position: relative; width: 100%; max-width: 500px; margin-inline: auto; padding: 1.5rem; }
.bd-hero-photo::before {
	content: "";
	position: absolute;
	width: 112%;
	aspect-ratio: 1 / 1;
	left: -6%;
	top: 4%;
	border: 1px dashed rgba(119, 106, 86, 0.45);
	border-radius: 50%;
	animation: bd-spin 70s linear infinite;
	pointer-events: none;
}
.bd-hero-photo > * { position: relative; }
.bd-hero-photo > .bd-round { position: absolute; left: -4px; bottom: 3.5rem; width: 36%; margin: 0; z-index: 2; }
.bd-hero-photo > .bd-chip {
	position: absolute;
	right: -6px;
	top: 4.5rem;
	margin: 0;
	z-index: 2;
	background: #fff;
	border-radius: 999px;
	padding: 0.55rem 1.25rem;
	font-size: 0.9rem;
	font-weight: 400;
	box-shadow: 0 16px 36px -18px rgba(74, 63, 53, 0.5);
	animation: bd-floaty 8s ease-in-out infinite;
}
.bd-hero-photo > .wp-block-image:first-child { margin: 0; }

figure.wp-block-image { margin: 0; }
figure.wp-block-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
figure.bd-zoom { position: relative; overflow: hidden; }
figure.bd-zoom img { transition: transform 1.3s var(--bd-ease); }
figure.bd-zoom:hover img { transform: scale(1.05); }
figure.is-style-arch { border-radius: 999px 999px 32px 32px; overflow: hidden; }
figure.is-style-soft { border-radius: 24px; overflow: hidden; }
figure.is-style-rounded { border-radius: 9999px; overflow: hidden; }
figure.is-style-arch img, figure.is-style-soft img, figure.is-style-rounded img { border-radius: inherit; }
figure.bd-round { border: 6px solid var(--wp--preset--color--creme); box-shadow: 0 20px 40px -20px rgba(74, 63, 53, 0.5); }
figure.bd-shadow { box-shadow: 0 40px 70px -40px rgba(74, 63, 53, 0.5); }
figure.bd-tilt { transform: rotate(-3deg); box-shadow: 0 40px 70px -40px rgba(74, 63, 53, 0.55); }
.bd-photo-narrow { max-width: 480px; margin-inline: auto; width: 100%; }
.bd-photo-narrow figure { width: 100%; }

/* Bandeau qui défile */
.bd-marquee { background: var(--wp--preset--color--taupe); color: var(--wp--preset--color--creme); overflow: hidden; padding: 1.25rem 0; }
.bd-marquee p {
	margin: 0;
	width: max-content;
	white-space: pre;
	font-family: var(--wp--preset--font-family--cormorant);
	font-style: italic;
	font-size: 1.75rem;
	line-height: 1.3;
	color: var(--wp--preset--color--creme);
	animation: bd-marquee 42s linear infinite;
}

/* Cartes */
.bd-cards { gap: 1.75rem; align-items: stretch; }
.bd-cards > .wp-block-column { display: flex; }
.bd-card {
	box-sizing: border-box;
	width: 100%;
	background: #fff;
	border-radius: 32px;
	padding: 0.9rem 0.9rem 2rem;
	gap: 1.1rem;
	transition: transform 0.55s var(--bd-ease), box-shadow 0.55s ease;
}
.bd-card:hover { transform: translateY(-10px); box-shadow: 0 30px 60px -30px rgba(74, 63, 53, 0.4); }
.bd-card-body { padding: 0.4rem 1.1rem 0; gap: 0.75rem; flex: 1; }
.bd-card-body > .bd-ulink { margin-top: auto; }
.bd-card .wp-block-heading { font-size: 1.9rem; line-height: 1.1; font-weight: 500; }
.bd-card p { margin: 0; }
.bd-card.bd-price { padding: 2rem 1.75rem; gap: 0.5rem; }
.bd-card.bd-price:hover { transform: none; box-shadow: none; }
.bd-card.bd-note { background: var(--wp--preset--color--rose-clair); padding: 1.75rem; }
.bd-card.bd-note:hover { transform: none; box-shadow: none; }
.bd-num { font-family: var(--wp--preset--font-family--cormorant); font-style: italic; font-size: 1.4rem; line-height: 1; color: var(--wp--preset--color--argile); }
.bd-meta { font-size: 0.95rem; font-weight: 400; }

/* Étapes */
.bd-steps { gap: 2.5rem 3.5rem; }
.bd-step { border-top: 1px solid rgba(119, 106, 86, 0.35); padding-top: 1.5rem; gap: 0.6rem; }
.bd-step p { margin: 0; }
.bd-step-n { font-family: var(--wp--preset--font-family--cormorant); font-style: italic; font-size: 4.5rem; line-height: 1; color: var(--wp--preset--color--argile); }
.bd-step .wp-block-heading { font-size: 1.75rem; line-height: 1.15; }

/* Galerie */
.bd-gallery { gap: 1.25rem; align-items: flex-start; justify-content: center; }
.bd-gallery > figure { flex: 1 1 200px; max-width: 260px; margin: 0; }
.bd-gallery > figure img { aspect-ratio: 3 / 4; }
.bd-gallery > figure:nth-child(odd) { border-radius: 120px 120px 24px 24px; overflow: hidden; }
.bd-gallery > figure:nth-child(even) { border-radius: 24px; overflow: hidden; }
.bd-gallery > figure:nth-child(1) { margin-top: 0; }
.bd-gallery > figure:nth-child(2) { margin-top: 56px; }
.bd-gallery > figure:nth-child(3) { margin-top: 16px; }
.bd-gallery > figure:nth-child(4) { margin-top: 72px; }
.bd-gallery > figure:nth-child(5) { margin-top: 28px; }

/* Liens et boutons */
.bd-ulink { margin: 0; }
.bd-ulink a {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	color: var(--wp--preset--color--taupe);
	text-decoration: none;
	font-weight: 400;
	letter-spacing: 0.03em;
	padding: 0.25rem 0;
	background: linear-gradient(currentColor, currentColor) left bottom / 100% 1px no-repeat;
	transition: background-size 0.4s ease, color 0.3s ease;
}
.bd-ulink a::after {
	content: "";
	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='%23776A56' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
	transition: transform 0.35s ease;
}
.bd-ulink a:hover { background-size: 35% 1px; color: var(--wp--preset--color--brun); }
.bd-ulink a:hover::after { transform: translateX(6px); }

.wp-block-button__link {
	border-radius: 999px;
	padding: 0.95em 2em;
	letter-spacing: 0.04em;
	text-decoration: none;
	transition: transform 0.35s ease, background-color 0.35s ease, color 0.35s ease, box-shadow 0.35s ease;
}
.wp-block-button__link:hover { transform: translateY(-2px); box-shadow: 0 14px 28px -14px rgba(74, 63, 53, 0.55); }
.bd-btn-clair .wp-block-button__link { background: var(--wp--preset--color--creme); color: var(--wp--preset--color--brun); }
.bd-btn-clair .wp-block-button__link:hover { background: var(--wp--preset--color--sable); color: var(--wp--preset--color--brun); }
.bd-btn-ligne .wp-block-button__link { background: transparent; color: inherit; border: 1px solid currentColor; }
.bd-btn-ligne .wp-block-button__link:hover { background: var(--wp--preset--color--brun); border-color: var(--wp--preset--color--brun); color: var(--wp--preset--color--creme); box-shadow: none; }
.bd-taupe .bd-btn-ligne .wp-block-button__link { color: var(--wp--preset--color--creme); }
.bd-taupe .bd-btn-ligne .wp-block-button__link:hover { background: var(--wp--preset--color--creme); border-color: var(--wp--preset--color--creme); color: var(--wp--preset--color--brun); }
.bd-btn-lien .wp-block-button__link { background: transparent; color: var(--wp--preset--color--taupe); padding-inline: 0; border-bottom: 1px solid currentColor; border-radius: 0; padding-block: 0.2em; }
.bd-btn-lien .wp-block-button__link:hover { box-shadow: none; transform: none; color: var(--wp--preset--color--brun); }

/* Soleil décoratif et arche des tarifs */
.bd-sun::before { content: ""; display: block; width: 96px; height: 56px; margin: 0 auto 1.25rem; background: url("assets/sun.svg") center / contain no-repeat; }
.bd-sun-dark::before { background-image: url("assets/sun-dark.svg"); }
.bd-arch {
	background: var(--wp--preset--color--taupe);
	color: var(--wp--preset--color--creme);
	border-radius: 999px 999px 28px 28px;
	max-width: 520px;
	width: 100%;
	margin-inline: auto;
	padding: clamp(6rem, 16vw, 8rem) clamp(1.5rem, 5vw, 3rem) 2.75rem;
	text-align: center;
	box-sizing: border-box;
}
.bd-arch h1, .bd-arch h2, .bd-arch a:not(.wp-block-button__link) { color: var(--wp--preset--color--creme); }
.bd-arch h1 { text-transform: uppercase; letter-spacing: 0.12em; font-weight: 400; font-size: clamp(2.1rem, 7vw, 3rem); margin: 0 0 1rem; }
.bd-arch p { color: var(--wp--preset--color--creme); }
.bd-tarif-liste { width: 100%; }
.bd-tarif { align-items: baseline !important; gap: 1.25rem; padding: 1.1rem 0; border-bottom: 1px solid rgba(246, 241, 234, 0.3); text-align: left; }
.bd-tarif:last-child { border-bottom: 0; padding-bottom: 0; }
.bd-tarif .bd-tarif-nom { margin: 0; font-size: 1.1rem; color: var(--wp--preset--color--creme); }
.bd-tarif .bd-tarif-detail { margin: 0.15rem 0 0; font-size: 0.9rem; color: var(--wp--preset--color--creme); }
.bd-tarif .bd-tarif-prix { margin: 0; font-family: var(--wp--preset--font-family--cormorant); font-size: 1.9rem; line-height: 1; white-space: nowrap; color: var(--wp--preset--color--creme); }
.bd-card .bd-tarif-prix { color: var(--wp--preset--color--brun); margin: 0.25rem 0 0.5rem; }
.bd-price .bd-tarif-prix { font-family: var(--wp--preset--font-family--cormorant); font-size: 2.4rem; line-height: 1; }

/* Texte de page (pages intérieures) */
.bd-prose-sec .wp-block-heading:not(:first-child) { margin-top: 2.25rem; }
.bd-prose-sec h2 { font-size: clamp(1.9rem, 3.4vw, 2.5rem); }
.bd-prose-sec h3 { font-size: 1.5rem; }
.bd-prose-sec .wp-block-list { padding-left: 1.25rem; }

/* =====================================================================
   Pied de page
   ===================================================================== */
.bd-footer { background: var(--wp--preset--color--brun); color: var(--wp--preset--color--creme); padding: 3.5rem clamp(1.25rem, 5vw, 4rem) 2rem; }
.bd-footer a { color: var(--wp--preset--color--creme); }
.bd-footer-inner { max-width: 1200px; margin-inline: auto; }
.bd-footer .bd-footer-nom { font-family: var(--wp--preset--font-family--cormorant); font-size: 1.6rem; letter-spacing: 0.16em; text-transform: uppercase; margin: 0 0 0.6rem; }
.bd-footer p { margin: 0 0 0.35rem; font-size: 0.95rem; }
.bd-footer .bd-footer-bas { margin-top: 2.25rem; padding-top: 1.25rem; border-top: 1px solid rgba(246, 241, 234, 0.25); font-size: 0.85rem; }

/* =====================================================================
   Téléphone
   ===================================================================== */
@media (max-width: 781px) {
	.bd-hero-photo { padding: 1rem; }
	.bd-gallery > figure { flex-basis: 42%; }
	.bd-gallery > figure:nth-child(n) { margin-top: 0; }
	.bd-gallery > figure:nth-child(even) { margin-top: 28px; }
	.bd-tarif { gap: 1rem; }
	.bd-tarif .bd-tarif-prix { font-size: 1.6rem; }
	.bd-marquee p { font-size: 1.4rem; }
}

/* Confort : moins de mouvement si l'appareil le demande */
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { animation: none !important; transition: none !important; }
	.bd-rise, .bd-reveal { opacity: 1 !important; transform: none !important; }
}

/* Éditeur : on désactive les animations pour pouvoir travailler tranquillement */
.editor-styles-wrapper .bd-rise,
.editor-styles-wrapper .bd-reveal { opacity: 1 !important; transform: none !important; animation: none !important; }
.editor-styles-wrapper .bd-marquee p { animation: none !important; }