/*
Theme Name: Beauty Bliss
Template: twentytwentyfive
Description: Thème enfant léger pour Cabinet Beauty Bliss (Jouiri Sarra), Ezzahra. Couleurs et typographies seulement.
Version: 1.0.0
Text Domain: beauty-bliss
*/

/* Mobile : le bouton WhatsApp flottant remplace le bouton d'en-tête. */
@media (max-width: 781px) {
	.wp-block-buttons.bb-header-cta { display: none !important; }
	header .wp-block-site-title { font-size: 1.35rem !important; white-space: nowrap; }
	.bb-header-sub { font-size: 0.7rem !important; white-space: nowrap; }
	.bb-photo-slot { min-height: 260px !important; }
}
.bb-header-cta .wp-block-button__link { white-space: nowrap; }

/* Photos : portrait en arche, cartes de soins, galeries. */
.bb-hero-photo img { box-shadow: 0 30px 60px -30px rgba(43, 34, 38, 0.45); }
.bb-cards .wp-block-image img { transition: transform 0.5s ease; }
.bb-cards .wp-block-image { overflow: hidden; border-radius: 20px; }
.bb-cards .wp-block-image:hover img { transform: scale(1.04); }
.bb-gallery.wp-block-gallery figure.wp-block-image img { border-radius: 16px; }
.bb-stats { border-bottom: 1px solid var(--wp--preset--color--accent-1); }
.bb-logo img { display: block; }
@media (max-width: 781px) {
	.bb-logo img { width: 92px !important; }
	.bb-gallery.wp-block-gallery.columns-4 figure.wp-block-image { width: calc(50% - 6px) !important; }
	.bb-row .wp-block-column:has(.wp-block-image) { order: -1; }
}

/* Cartes « Et aussi » de même hauteur. */
.bb-mini > .wp-block-column > .wp-block-group { height: 100%; }

/* FAQ en accordéon et bas de page. */
.bb-faq { border-bottom: 1px solid var(--wp--preset--color--accent-1); padding: 1.1rem 0; }
.bb-faq summary { cursor: pointer; font-family: var(--wp--preset--font-family--vollkorn); font-size: var(--wp--preset--font-size--large); }
.bb-faq p { margin-top: 0.75rem; color: var(--wp--preset--color--accent-4); }

/* ===== Mouvement et graphisme (doux, désactivé si « moins d'animations »). ===== */

/* Transitions fluides entre les pages (navigateurs récents). */
@view-transition { navigation: auto; }

/* En-tête qui reste visible. */
header.wp-block-template-part { position: sticky; top: 0; z-index: 50; transition: box-shadow 0.3s ease; }
/* Pas de backdrop-filter : il enfermait le menu mobile plein écran dans la hauteur de l'en-tête. */
header.wp-block-template-part > .wp-block-group { background: var(--wp--preset--color--base) !important; }
header.wp-block-template-part.is-scrolled { box-shadow: 0 8px 24px -18px rgba(26, 26, 26, 0.45); }
.admin-bar header.wp-block-template-part { top: var(--wp-admin--admin-bar--height, 0); }

/* Apparition au défilement. */
.bb-motion .bb-reveal { opacity: 0; transform: translateY(18px); transition: opacity 0.7s ease, transform 0.7s cubic-bezier(0.2, 0.7, 0.2, 1); }
.bb-motion .bb-reveal.is-visible { opacity: 1; transform: none; }

/* Arche : le motif de sa couverture, en contour fin derrière le portrait. */
.bb-hero-photo { position: relative; isolation: isolate; width: fit-content; max-width: 100%; margin-inline: auto; }
.bb-hero-photo::before {
	content: ""; position: absolute; inset: 0; z-index: -1;
	border: 1px solid var(--wp--preset--color--accent-3);
	border-radius: 260px 260px 24px 24px;
	transform: translate(22px, -22px);
	transition: transform 1.2s cubic-bezier(0.2, 0.7, 0.2, 1);
}
.bb-hero-photo:hover::before { transform: translate(14px, -14px); }
.bb-motion .bb-hero-photo img { animation: bb-rise 1.1s cubic-bezier(0.2, 0.7, 0.2, 1) both; }
.bb-motion .bb-hero-photo::before { animation: bb-arch 1.6s cubic-bezier(0.2, 0.7, 0.2, 1) 0.2s both; }
@keyframes bb-rise { from { opacity: 0; transform: translateY(24px) scale(0.985); } to { opacity: 1; transform: none; } }
@keyframes bb-arch { from { opacity: 0; transform: translate(0, 0); } to { opacity: 1; transform: translate(22px, -22px); } }

/* Boutons : léger soulèvement. */
.wp-element-button { transition: transform 0.25s ease, background-color 0.25s ease, color 0.25s ease, box-shadow 0.25s ease; }
.wp-element-button:hover { transform: translateY(-2px); box-shadow: 0 10px 22px -16px rgba(26, 26, 26, 0.6); }

/* Bandeau des soins qui défile lentement. */
.bb-marquee { overflow: hidden; white-space: nowrap; }
.bb-marquee .bb-marquee-track { display: inline-flex; gap: 0; animation: bb-marquee 48s linear infinite; }
.bb-marquee .bb-marquee-track span { font-family: var(--wp--preset--font-family--vollkorn); font-style: italic; font-size: clamp(1.4rem, 2.4vw, 2rem); padding: 0 1.4rem; }
.bb-marquee .bb-marquee-track span.dot { font-style: normal; color: var(--wp--preset--color--accent-3); padding: 0; }
.bb-marquee:hover .bb-marquee-track { animation-play-state: paused; }
@keyframes bb-marquee { to { transform: translateX(-50%); } }

@media (max-width: 781px) {
	.bb-hero-photo::before { transform: translate(12px, -12px); }
	@keyframes bb-arch { from { opacity: 0; transform: none; } to { opacity: 1; transform: translate(12px, -12px); } }
}

@media (prefers-reduced-motion: reduce) {
	@view-transition { navigation: none; }
	.bb-marquee .bb-marquee-track { animation: none; }
	.wp-element-button:hover { transform: none; }
	.bb-hero-photo::before { transition: none; }
}

/* Pas de débordement horizontal (arche, bandeau) ; clip ne casse pas l'en-tête collant. */
html, body { overflow-x: clip; }

/* Listes des pages soins. */
.bb-list { padding-left: 1.1em; margin: 0; }
.bb-list li { margin: 0.35em 0; }
.bb-list li::marker { color: var(--wp--preset--color--accent-3); }
.bb-cards h3 a, .bb-cards p a { text-decoration: none; }
.bb-cards h3 a:hover { text-decoration: underline; text-underline-offset: 4px; }

/* Formulaire de rendez-vous guidé. */
.bb-rdv { display: grid; gap: 0.55rem; }
.bb-rdv label, .bb-rdv legend { font-weight: 600; font-size: 0.95rem; margin-top: 0.6rem; }
.bb-rdv label span { font-weight: 400; color: var(--wp--preset--color--accent-4); }
.bb-rdv select, .bb-rdv input[type="date"], .bb-rdv input[type="text"], .bb-rdv textarea {
	width: 100%; box-sizing: border-box; font: inherit; padding: 0.8rem 1rem; border: 1px solid var(--wp--preset--color--accent-1);
	border-radius: 14px; background: var(--wp--preset--color--base); color: var(--wp--preset--color--contrast);
}
.bb-rdv select:focus, .bb-rdv input:focus, .bb-rdv textarea:focus { outline: 2px solid var(--wp--preset--color--accent-3); outline-offset: 1px; }
.bb-rdv fieldset { border: 0; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 0.6rem 1.4rem; }
.bb-rdv legend { width: 100%; margin-bottom: 0.3rem; }
.bb-rdv .bb-radio { font-weight: 400; margin: 0; display: inline-flex; gap: 0.45rem; align-items: center; }
.bb-rdv .bb-radio input { accent-color: var(--wp--preset--color--contrast); }
.bb-rdv button { margin-top: 1rem; justify-self: start; cursor: pointer; border: 0; }
.bb-rdv .bb-rdv-error { color: #9b2c2c; margin: 0.3rem 0 0; }
.bb-rdv .bb-rdv-note { font-size: 0.85rem; color: var(--wp--preset--color--accent-4); margin: 0.4rem 0 0; }

/* ---- Revue qualité du 05/11 ---- */
/* Bandeau noir : le bouton principal était noir sur noir. */
.bb-cta .wp-block-button:not(.is-style-outline) .wp-block-button__link { background: var(--wp--preset--color--base); color: var(--wp--preset--color--contrast); }
.bb-cta .wp-block-button.is-style-outline .wp-block-button__link { color: var(--wp--preset--color--base); border-color: var(--wp--preset--color--base); }

/* Liens « Découvrir le soin » : lisibles. */
.bb-cards .has-small-font-size a { color: var(--wp--preset--color--contrast); font-weight: 600; font-size: 0.95rem; text-decoration: underline; text-decoration-color: var(--wp--preset--color--accent-1); text-underline-offset: 5px; }
.bb-cards .has-small-font-size a:hover { text-decoration-color: var(--wp--preset--color--contrast); }
.bb-cards h3 { color: var(--wp--preset--color--contrast); font-size: 1.45rem !important; margin-top: 0.4rem; }
.bb-cards .wp-block-image img { box-shadow: 0 18px 40px -30px rgba(26, 26, 26, 0.55); }

/* Encadrés des pages soins. */
.bb-mini h3 { font-size: 1.35rem !important; margin-bottom: 0.6rem; }


/* Logo d'en-tête un peu plus grand pour rester lisible. */
.bb-logo img { width: 132px !important; height: auto; }
@media (max-width: 781px) { .bb-logo img { width: 104px !important; } }

/* Formulaire de rendez-vous : mêmes tailles que le reste du site. */
.bb-rdv label, .bb-rdv legend { font-size: 1rem; }
.bb-rdv .bb-radio { font-size: 1rem; }
.bb-rdv-cols .wp-block-group p { font-size: 1rem; }

/* ===== Direction artistique v3 (éditoriale) ===== */
/* Lecture : texte plus présent, interlignage généreux. */
body { font-size: 1.0625rem; line-height: 1.7; font-weight: 400; -webkit-font-smoothing: antialiased; }
.entry-content p { font-weight: 400; }
h1.wp-block-heading { font-size: clamp(2.5rem, 4.8vw, 4.1rem) !important; line-height: 1.08; letter-spacing: -0.015em; }
h2.has-xx-large-font-size { font-size: clamp(2.05rem, 3.6vw, 3.1rem) !important; line-height: 1.12; letter-spacing: -0.01em; }
h2.has-x-large-font-size { font-size: clamp(1.7rem, 2.6vw, 2.3rem) !important; line-height: 1.15; }
/* Sur-titres : petit trait éditorial. */
p[style*="letter-spacing:0.14em"] { font-size: 0.74rem !important; letter-spacing: 0.22em !important; font-weight: 600; }
p.has-text-align-center[style*="letter-spacing:0.14em"]::before,
p.has-text-align-center[style*="letter-spacing:0.14em"]::after { content: ""; display: inline-block; width: 28px; height: 1px; background: currentColor; vertical-align: middle; margin: 0 12px; opacity: 0.6; }
p:not(.has-text-align-center)[style*="letter-spacing:0.14em"]::before { content: ""; display: inline-block; width: 28px; height: 1px; background: currentColor; vertical-align: middle; margin-right: 12px; opacity: 0.6; }

/* Première visite : grands numéros. */
.bb-steps .bb-num { font-family: var(--wp--preset--font-family--vollkorn); font-style: italic; font-size: 3.2rem; line-height: 1; color: var(--wp--preset--color--accent-3); margin: 0 0 0.6rem; }
.bb-steps .wp-block-column { border-top: 1px solid var(--wp--preset--color--accent-1); padding-top: 1.4rem; }

/* Carte des soins : index typographique. */
.bb-carte h3 { font-size: 1.5rem !important; padding-bottom: 0.8rem; border-bottom: 1px solid var(--wp--preset--color--contrast); }
.bb-index { list-style: none; padding: 0; margin: 0; }
.bb-index li { border-bottom: 1px solid var(--wp--preset--color--accent-1); margin: 0; }
.bb-index li a { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; padding: 0.95rem 0; text-decoration: none; color: var(--wp--preset--color--contrast); font-family: var(--wp--preset--font-family--vollkorn); font-size: 1.2rem; transition: padding 0.25s ease, color 0.25s ease; }
.bb-index li a::after { content: "→"; font-family: var(--wp--preset--font-family--manrope); color: var(--wp--preset--color--accent-3); transition: transform 0.25s ease; }
.bb-index li a:hover { padding-left: 0.4rem; color: var(--wp--preset--color--accent-4); }
.bb-index li a:hover::after { transform: translateX(4px); }

/* Grand visuel du cabinet : photo pleine largeur, voile sombre, texte clair. */
.bb-cover-cabinet { position: relative; isolation: isolate; min-height: 560px; display: flex; flex-direction: column; justify-content: center;
	background: linear-gradient(90deg, rgba(20, 18, 16, 0.78) 0%, rgba(20, 18, 16, 0.45) 55%, rgba(20, 18, 16, 0.15) 100%),
	url("/wp-content/uploads/2026/11/cabinet-salle-appareils.webp") center 60% / cover no-repeat; }
.bb-cover-cabinet > * { max-width: 560px; margin-left: max(var(--wp--preset--spacing--50), calc((100% - 1200px) / 2)) !important; margin-right: auto !important; }
.bb-cover-cabinet .wp-block-button.is-style-outline .wp-block-button__link { color: var(--wp--preset--color--base); border-color: var(--wp--preset--color--base); }

/* Citation de Sarra. */
.bb-quote { border: 0 !important; padding: 0 !important; margin: 0.6rem 0 1.2rem !important; }
.bb-quote p { font-family: var(--wp--preset--font-family--vollkorn); font-style: italic; font-size: clamp(1.9rem, 3vw, 2.6rem) !important; line-height: 1.2; }
.bb-quote cite { font-size: 0.85rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--wp--preset--color--accent-3); font-style: normal; }

/* Galeries : coins et ombres homogènes. */
.bb-gallery img { box-shadow: 0 16px 36px -28px rgba(26, 26, 26, 0.6); }

@media (max-width: 781px) {
	.bb-cover-cabinet { min-height: 460px; background: linear-gradient(180deg, rgba(20, 18, 16, 0.35) 0%, rgba(20, 18, 16, 0.8) 100%), url("/wp-content/uploads/2026/11/cabinet-salle-appareils.webp") center / cover no-repeat; }
	.bb-steps .bb-num { font-size: 2.6rem; }
}
.bb-cards h3 a { color: inherit; }

/* Menu mobile plein écran : grands liens lisibles, sans cadre de focus au tap. */
.wp-block-navigation__responsive-container.is-menu-open { padding: 2rem 1.75rem !important; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { gap: 1.1rem !important; align-items: flex-start !important; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-family: var(--wp--preset--font-family--vollkorn); font-size: 1.9rem; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:focus:not(:focus-visible) { outline: none; }
.wp-block-navigation__responsive-container-open, .wp-block-navigation__responsive-container-close { border: 0; }

/* Pied de page sur mobile : plus compact, liens sans soulignement lourd. */
@media (max-width: 781px) {
	/* Photos encore en basse définition : affichées plus petites pour rester nettes. */
	.bb-photo-lowres { max-width: 300px !important; margin-inline: auto !important; }
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { align-items: flex-start !important; }
/* « Prendre rendez-vous » : seulement dans le menu mobile (sur ordinateur, il y a le bouton). */
.wp-block-navigation .bb-nav-rdv { display: none; }
.wp-block-navigation__responsive-container.is-menu-open .bb-nav-rdv { display: block; margin-top: 1rem; }
.wp-block-navigation__responsive-container.is-menu-open .bb-nav-rdv .wp-block-navigation-item__content { font-family: var(--wp--preset--font-family--manrope); font-size: 1.05rem; background: var(--wp--preset--color--contrast); color: var(--wp--preset--color--base); padding: 0.9rem 1.6rem; border-radius: 999px; }

/* Questionnaire « Trouvez votre soin ». */
.bb-quiz { background: var(--wp--preset--color--base); border-radius: 24px; padding: clamp(1.4rem, 3vw, 2.4rem); box-shadow: 0 24px 50px -40px rgba(26, 26, 26, 0.6); scroll-margin-top: 120px; }
.bb-quiz-count { font-size: 0.74rem; letter-spacing: 0.22em; text-transform: uppercase; font-weight: 600; color: var(--wp--preset--color--accent-3); margin: 0 0 0.6rem; }
.bb-quiz-q { font-family: var(--wp--preset--font-family--vollkorn); font-size: clamp(1.4rem, 2.2vw, 1.8rem); line-height: 1.2; margin: 0 0 1.2rem; }
.bb-quiz-opts { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 0.7rem; }
.bb-quiz-opt { font: inherit; text-align: left; padding: 0.95rem 1.1rem; border-radius: 16px; border: 1px solid var(--wp--preset--color--accent-1); background: var(--wp--preset--color--accent-5); color: var(--wp--preset--color--contrast); cursor: pointer; transition: border-color 0.2s ease, background 0.2s ease, transform 0.2s ease; }
.bb-quiz-opt:hover, .bb-quiz-opt:focus-visible { border-color: var(--wp--preset--color--contrast); background: var(--wp--preset--color--base); transform: translateY(-1px); }
.bb-quiz-title { font-size: clamp(1.6rem, 2.6vw, 2.1rem) !important; margin: 0 0 0.6rem; }
.bb-quiz-actions { display: flex; flex-wrap: wrap; gap: 1rem 1.4rem; align-items: center; margin: 1.2rem 0; }
.bb-quiz-actions .wp-element-button { text-decoration: none; }
.bb-quiz-link, .bb-quiz-alt a { color: var(--wp--preset--color--contrast); font-weight: 600; text-underline-offset: 5px; text-decoration-color: var(--wp--preset--color--accent-1); }
.bb-quiz-note { font-size: 0.9rem; color: var(--wp--preset--color--accent-4); }
.bb-quiz-restart { font: inherit; font-size: 0.9rem; background: none; border: 0; padding: 0; color: var(--wp--preset--color--accent-3); text-decoration: underline; cursor: pointer; }

/* Comparateur avant/après à glisser. */
.bb-ba { position: relative; margin: 0 auto; width: 100%; max-width: 720px; border-radius: 20px; overflow: hidden; user-select: none; box-shadow: 0 20px 44px -32px rgba(26, 26, 26, 0.65); background: var(--wp--preset--color--accent-2); }
.bb-ba img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; margin: 0; }
.bb-ba-before { position: absolute; inset: 0; clip-path: inset(0 calc(100% - var(--pos)) 0 0); }
.bb-ba-handle { position: absolute; top: 0; bottom: 0; left: var(--pos); width: 2px; margin-left: -1px; background: var(--wp--preset--color--base); pointer-events: none; }
.bb-ba-handle::after { content: "‹ ›"; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 44px; height: 44px; border-radius: 50%; background: var(--wp--preset--color--base); color: var(--wp--preset--color--contrast); display: grid; place-items: center; font-size: 1.1rem; letter-spacing: 0.1em; box-shadow: 0 6px 18px -8px rgba(0, 0, 0, 0.5); }
.bb-ba-tag { position: absolute; top: 12px; font-size: 0.7rem; letter-spacing: 0.18em; text-transform: uppercase; font-weight: 600; padding: 0.35rem 0.7rem; border-radius: 999px; background: rgba(252, 250, 247, 0.9); color: var(--wp--preset--color--contrast); pointer-events: none; }
.bb-ba-tag-l { left: 12px; } .bb-ba-tag-r { right: 12px; }
.bb-ba-range { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: ew-resize; -webkit-appearance: none; appearance: none; background: transparent; }
.bb-ba-range:focus-visible + * , .bb-ba:focus-within .bb-ba-handle::after { outline: 2px solid var(--wp--preset--color--accent-3); outline-offset: 2px; }
.bb-ba-duo .bb-ba { max-width: none; }

/* Vidéo « Comment venir au cabinet ». */
.bb-video { margin: 0 auto; max-width: 340px; }
.bb-video video { width: 100%; height: auto; aspect-ratio: 9 / 16; border-radius: 22px; background: var(--wp--preset--color--contrast); box-shadow: 0 24px 50px -34px rgba(26, 26, 26, 0.7); display: block; }
.bb-video figcaption { text-align: center; font-size: 0.9rem; color: var(--wp--preset--color--accent-4); margin-top: 0.7rem; }

/* ===== Pied de page v2 : fond noir, logo clair, icônes, colonnes ===== */
footer.wp-block-template-part { margin-top: 0 !important; }
.bb-footer { border-top: 1px solid rgba(252, 250, 247, 0.12); font-size: 0.98rem; line-height: 1.7; }
.bb-footer, .bb-footer p, .bb-footer li { color: rgba(252, 250, 247, 0.82); }
.bb-footer a { color: inherit; text-decoration: none; border: 0; transition: color 0.2s ease; }
.bb-footer a:hover, .bb-footer a:focus-visible { color: var(--wp--preset--color--accent-1); }
.bb-footer-cols { gap: var(--wp--preset--spacing--60) !important; margin-bottom: 0; }
.bb-footer-logo { margin: 0 0 1.1rem; }
.bb-footer-logo img { width: 190px; height: auto; display: block; }
.bb-footer-tagline { max-width: 30ch; margin: 0 0 1.4rem; }
.bb-footer-cta { margin-bottom: 1.5rem; }
.bb-footer-cta .wp-block-button__link { background: var(--wp--preset--color--base); color: var(--wp--preset--color--contrast); }
.bb-footer-cta .wp-block-button__link:hover { background: var(--wp--preset--color--accent-1); color: var(--wp--preset--color--contrast); }
.home .bb-footer-cta { display: none; }   /* l'accueil a déjà ce bouton juste au-dessus */
.bb-footer-social { gap: 0.6rem !important; margin: 0; }
.bb-footer-social .wp-social-link { border: 1px solid rgba(252, 250, 247, 0.28); border-radius: 50%; padding: 0.4rem; transition: border-color 0.2s ease, background 0.2s ease, transform 0.2s ease; }
.bb-footer-social .wp-social-link:hover { border-color: var(--wp--preset--color--accent-1); background: rgba(252, 250, 247, 0.08); transform: translateY(-2px); }
.bb-footer-social .wp-social-link svg { width: 1.05rem; height: 1.05rem; }
.bb-footer .bb-footer-title { font-family: var(--wp--preset--font-family--manrope); font-size: 0.74rem !important; font-weight: 600; letter-spacing: 0.22em; text-transform: uppercase; color: var(--wp--preset--color--accent-1); margin: 0.4rem 0 1.2rem; }
.bb-footer .bb-ico { position: relative; padding-left: 2rem; margin: 0 0 0.95rem; }
.bb-footer .bb-ico::before { content: ""; position: absolute; left: 0; top: 0.3em; width: 1.1rem; height: 1.1rem; background: var(--wp--preset--color--accent-1); -webkit-mask: var(--ico) center / contain no-repeat; mask: var(--ico) center / contain no-repeat; }
.bb-footer .bb-ico-pin { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E"); }
.bb-footer .bb-ico-clock { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpolyline points='12 6 12 12 16 14'/%3E%3C/svg%3E"); }
.bb-footer .bb-ico-phone { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E"); }
.bb-footer .bb-ico-chat { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z'/%3E%3C/svg%3E"); }
.bb-footer .bb-ico-mail { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z'/%3E%3Cpolyline points='22 6 12 13 2 6'/%3E%3C/svg%3E"); }
.bb-footer-nav { list-style: none; padding: 0; margin: 0; }
.bb-footer-nav li { margin: 0 0 0.6rem; }
.bb-footer-bottom { margin-top: var(--wp--preset--spacing--60); padding-top: 1.3rem; border-top: 1px solid rgba(252, 250, 247, 0.14); gap: 0.4rem 2rem; align-items: center; }
.bb-footer .bb-footer-bottom p { font-size: 0.82rem; margin: 0; color: rgba(252, 250, 247, 0.6); }
.bb-footer .bb-footer-bottom a { color: rgba(252, 250, 247, 0.82); }
.bb-footer .bb-footer-bottom a:hover { color: var(--wp--preset--color--accent-1); }
/* La bulle WhatsApp flottante ne doit pas recouvrir la dernière ligne. */
@media (max-width: 1420px) { .bb-footer-bottom { padding-right: 84px; } }
@media (max-width: 781px) {
	.bb-footer { padding-top: var(--wp--preset--spacing--60) !important; padding-bottom: 92px !important; }
	.bb-footer-cols { gap: 2.2rem !important; }
	.bb-footer-brand { text-align: center; }
	.bb-footer-logo img { margin-inline: auto; width: 170px; }
	.bb-footer-tagline { margin-inline: auto; }
	.bb-footer-cta { justify-content: center; }
	.bb-footer-cta .wp-block-button, .bb-footer-cta .wp-block-button__link { width: 100%; box-sizing: border-box; }
	.bb-footer-social { justify-content: center; }
	.bb-footer-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 0.2rem 1.5rem; }
	.bb-footer-bottom { flex-direction: column; align-items: center; text-align: center; padding-right: 0; gap: 0.5rem; }
}
.bb-footer .bb-footer-social .wp-social-link a.wp-block-social-link-anchor { padding: 0.6rem !important; }
.bb-footer .bb-footer-social .wp-social-link { padding: 0 !important; }
/* Signature ZIWARYX : logo officiel du site ziwaryx.com (brand/logo/SVG/dark.svg), vectoriel, à pleine opacité.
   Le fichier garde sa marge interne ; les marges négatives ne font que l'aligner sur le texte et sur le bord. */
.bb-footer .bb-credit { display: inline-flex; align-items: center; gap: 0.35rem; flex-wrap: wrap; justify-content: center; }
.bb-footer .bb-credit a { display: inline-flex; align-items: center; }
.bb-footer .bb-credit .bb-zwx { height: 23px; width: auto; display: block; margin-left: -10px; transition: transform 0.2s ease; }
.bb-footer .bb-credit a:hover .bb-zwx { transform: translateY(-1px); }
.bb-footer .bb-credit mark { font-size: 0.95em; }
@media (min-width: 782px) { .bb-footer .bb-credit .bb-zwx { margin-right: -14px; } }
@media (max-width: 781px) {
	/* Une seule ligne sur mobile : en colonne, « Conçu avec / ♥ / par / logo » s'empilait sur 4 lignes (13/11). */
	.bb-footer .bb-credit { flex-wrap: nowrap; gap: 0.3rem; white-space: nowrap; }
	.bb-footer .bb-credit .bb-zwx { margin-left: -6px; height: 19px; }
}