/* ==========================================================================
   BPC AFRICA — couche de design v2
   Chargée après style.css (Tailwind d'origine). Couleurs alignées sur le logo :
   bleu #235B89 et or #F8D268.
   ========================================================================== */

/* ---------- 1. Couleurs de la marque ---------- */
:root,
html.light {
  --bpc-blue: #235b89;
  --bpc-blue-600: #1d4d74;
  --bpc-night: #0e2840;
  --bpc-night-2: #12324f;
  --bpc-gold: #f8d268;
  --bpc-gold-deep: #e9b93a;
  --bpc-mist: #eef3f8;
  --bpc-ink: #1b2e3e;
  --bpc-line: #dbe3ec;

  --primary: var(--bpc-blue);
  --primary-foreground: #fbfcfd;
  --accent: var(--bpc-gold);
  --accent-foreground: var(--bpc-blue);
  --ring: var(--bpc-gold);
  --secondary: var(--bpc-mist);
  --secondary-foreground: var(--bpc-blue);
  --muted: var(--bpc-mist);
  --foreground: var(--bpc-ink);
  --card-foreground: var(--bpc-ink);
  --border: var(--bpc-line);
  --input: var(--bpc-line);
  --gold: var(--bpc-gold);
  --gold-foreground: var(--bpc-blue);
  --ease-elegant: cubic-bezier(.22, .8, .24, 1);
}

html { scroll-padding-top: 6rem; }
body { text-rendering: optimizeLegibility; }
::selection { background: var(--bpc-gold); color: var(--bpc-night); }
:focus-visible { outline: 2px solid var(--bpc-gold-deep); outline-offset: 3px; }

/* ---------- 2. Préchargeur (bouclier qui se dessine + nom en slide) ---------- */
.bpc-preloader {
  position: fixed; inset: 0; z-index: 9999;
  display: grid; place-items: center;
  background: radial-gradient(120% 90% at 50% 40%, var(--bpc-night-2) 0%, var(--bpc-night) 70%);
  color: #fff;
  transition: clip-path .9s var(--ease-elegant), visibility 0s linear .9s;
  clip-path: inset(0 0 0 0);
}
html.preload-skip .bpc-preloader { display: none; }
.bpc-preloader.is-done { clip-path: inset(0 0 100% 0); visibility: hidden; }
.bpc-preloader__inner { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 2rem; }
.bpc-preloader__shield { width: 92px; height: auto; overflow: visible; }
.bpc-preloader__shield path {
  fill: none; stroke: var(--bpc-gold); stroke-width: 9; stroke-linejoin: round; stroke-linecap: round;
}
.bpc-preloader__shield .pl-outline { stroke-dasharray: 900; stroke-dashoffset: 900; animation: pl-draw 1s var(--ease-elegant) .15s forwards; }
.bpc-preloader__shield .pl-check { stroke-dasharray: 520; stroke-dashoffset: 520; animation: pl-draw .6s var(--ease-elegant) .85s forwards; }
.bpc-preloader__name {
  margin-top: 1.4rem; display: flex; overflow: hidden;
  font-family: var(--font-playfair), Georgia, serif; font-weight: 700;
  font-size: clamp(1.9rem, 5vw, 2.6rem); letter-spacing: .06em; line-height: 1.1;
}
.bpc-preloader__name span { display: inline-block; transform: translateY(110%); animation: pl-rise .7s var(--ease-elegant) forwards; }
.bpc-preloader__name .sp { width: .35em; }
.bpc-preloader__tag {
  margin-top: .5rem; overflow: hidden;
  font-family: var(--font-inter), system-ui, sans-serif; font-weight: 500;
  font-size: clamp(.95rem, 2.4vw, 1.15rem); letter-spacing: .04em; color: var(--bpc-gold);
}
.bpc-preloader__tag span { display: inline-block; transform: translateY(110%); opacity: 0; animation: pl-rise .7s var(--ease-elegant) 1.45s forwards; }
.bpc-preloader__bar { margin-top: 1.6rem; width: 140px; height: 2px; background: rgba(255,255,255,.12); border-radius: 2px; overflow: hidden; }
.bpc-preloader__bar i { display: block; height: 100%; width: 100%; background: var(--bpc-gold); transform-origin: left; transform: scaleX(0); animation: pl-bar 1.7s var(--ease-elegant) .2s forwards; }
@keyframes pl-draw { to { stroke-dashoffset: 0; } }
@keyframes pl-rise { to { transform: translateY(0); opacity: 1; } }
@keyframes pl-bar { to { transform: scaleX(1); } }
html.is-preloading { overflow: hidden; }

/* ---------- 3. Transition entre les pages ---------- */
.bpc-curtain {
  position: fixed; inset: 0; z-index: 9998; pointer-events: none;
  background: var(--bpc-night); opacity: 0; transition: opacity .28s ease;
}
html.is-leaving .bpc-curtain { opacity: 1; }
@keyframes page-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
html.preload-skip main { animation: page-in .55s var(--ease-elegant) both; }

/* ---------- 4. Barre de progression de lecture ---------- */
.bpc-progress { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 60; pointer-events: none; }
.bpc-progress i { display: block; height: 100%; width: 100%; transform-origin: left; transform: scaleX(0); background: linear-gradient(90deg, var(--bpc-gold-deep), var(--bpc-gold)); }

/* ---------- 5. En-tête transparent au-dessus du slider (accueil) ---------- */
body.has-hero [data-header] { transition: background-color .45s ease, border-color .45s ease, box-shadow .45s ease, backdrop-filter .45s ease; }
body.has-hero [data-header].is-top:not(.menu-open) { background: transparent; border-color: transparent; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
body.has-hero [data-header].is-top:not(.menu-open) nav[aria-label="Navigation principale"] a { color: rgba(255,255,255,.82); }
body.has-hero [data-header].is-top:not(.menu-open) nav[aria-label="Navigation principale"] a:hover,
body.has-hero [data-header].is-top:not(.menu-open) nav[aria-label="Navigation principale"] a.text-primary { color: #fff; }
body.has-hero [data-header].is-top:not(.menu-open) .font-serif.text-primary { color: #fff; }
body.has-hero [data-header].is-top:not(.menu-open) .text-accent-foreground\/70 { color: var(--bpc-gold); }
body.has-hero [data-header].is-top:not(.menu-open) a[href^="tel:"] { color: #fff; }
body.has-hero [data-header].is-top:not(.menu-open) [data-menu-toggle] { color: #fff; }
body.has-hero [data-header].is-top:not(.menu-open) .border-border.rounded-full { border-color: rgba(255,255,255,.35); }
body.has-hero [data-header].is-top:not(.menu-open) a[hreflang].text-muted-foreground { color: rgba(255,255,255,.8); }
body.has-hero [data-header].is-top:not(.menu-open) a[hreflang].bg-primary { background: var(--bpc-gold); color: var(--bpc-night); }
body.has-hero main > .bpc-hero:first-child { margin-top: -5rem; }

/* ---------- 6. Slider d'accueil ---------- */
.bpc-hero {
  position: relative; isolation: isolate; overflow: hidden;
  min-height: max(640px, 100svh); color: #fff; background: var(--bpc-night);
}
.bpc-hero__slide { position: absolute; inset: 0; opacity: 0; visibility: hidden; transition: opacity 1.2s ease, visibility 0s linear 1.2s; }
.bpc-hero__slide.is-active { opacity: 1; visibility: visible; transition: opacity 1.2s ease, visibility 0s; z-index: 1; }
.bpc-hero__media { position: absolute; inset: 0; overflow: hidden; }
.bpc-hero__media img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.08); }
.bpc-hero__slide.is-active .bpc-hero__media img { animation: kenburns 9s ease-out forwards; }
@keyframes kenburns { from { transform: scale(1.12); } to { transform: scale(1); } }
.bpc-hero__shade {
  position: absolute; inset: 0;
  background:
    linear-gradient(90deg, rgba(14,40,64,.92) 0%, rgba(14,40,64,.78) 34%, rgba(14,40,64,.28) 68%, rgba(14,40,64,.08) 100%),
    linear-gradient(0deg, rgba(14,40,64,.65) 0%, rgba(14,40,64,0) 38%);
}
.bpc-hero__content {
  position: relative; z-index: 2; height: 100%; min-height: inherit;
  max-width: 80rem; margin: 0 auto; padding: 8.5rem 1rem 9rem;
  display: flex; flex-direction: column; justify-content: center;
}
@media (min-width: 40rem) { .bpc-hero__content { padding-left: 1.5rem; padding-right: 1.5rem; } }
@media (min-width: 64rem) { .bpc-hero__content { padding-left: 2rem; padding-right: 2rem; } }
.bpc-hero__kicker { display: inline-flex; align-items: center; gap: .6rem; font-size: .95rem; font-weight: 500; color: var(--bpc-gold); }
.bpc-hero__kicker svg { width: 18px; height: 18px; }
.bpc-hero__title {
  margin-top: 1.1rem; max-width: 15ch;
  font-family: var(--font-playfair), Georgia, serif; font-weight: 700;
  font-size: clamp(2.4rem, 5.6vw, 4.6rem); line-height: 1.06; letter-spacing: -.01em; text-wrap: balance;
}
.bpc-hero__text { margin-top: 1.4rem; max-width: 34rem; font-size: clamp(1rem, 1.6vw, 1.15rem); line-height: 1.7; color: rgba(255,255,255,.86); }
.bpc-hero__actions { margin-top: 2.2rem; display: flex; flex-wrap: wrap; gap: .8rem; }
.bpc-hero__slide .bpc-anim { opacity: 0; transform: translateY(26px); }
.bpc-hero__slide.is-active .bpc-anim { animation: hero-in .9s var(--ease-elegant) forwards; }
.bpc-hero__slide.is-active .bpc-anim:nth-child(2) { animation-delay: .12s; }
.bpc-hero__slide.is-active .bpc-anim:nth-child(3) { animation-delay: .24s; }
.bpc-hero__slide.is-active .bpc-anim:nth-child(4) { animation-delay: .36s; }
@keyframes hero-in { to { opacity: 1; transform: none; } }
html.is-preloading .bpc-hero__slide.is-active .bpc-anim { animation-play-state: paused; }

.bpc-hero__nav {
  position: absolute; z-index: 3; left: 0; right: 0; bottom: 2.2rem;
  max-width: 80rem; margin: 0 auto; padding: 0 1rem;
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem;
}
@media (min-width: 40rem) { .bpc-hero__nav { padding: 0 1.5rem; } }
@media (min-width: 64rem) { .bpc-hero__nav { padding: 0 2rem; max-width: 80rem; grid-template-columns: repeat(3, minmax(0, 15rem)); } }
.bpc-hero__tab { text-align: left; color: rgba(255,255,255,.6); font-size: .85rem; font-weight: 500; padding-top: .9rem; position: relative; cursor: pointer; transition: color .3s; }
.bpc-hero__tab:hover, .bpc-hero__tab.is-active { color: #fff; }
.bpc-hero__tab::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 2px; background: rgba(255,255,255,.25); }
.bpc-hero__tab i { position: absolute; top: 0; left: 0; height: 2px; width: 100%; background: var(--bpc-gold); transform: scaleX(0); transform-origin: left; }
.bpc-hero__tab.is-active i { animation: tab-progress var(--slide-duration, 7s) linear forwards; }
.bpc-hero.is-paused .bpc-hero__tab.is-active i { animation-play-state: paused; }
@keyframes tab-progress { to { transform: scaleX(1); } }
.bpc-hero__tab span { display: block; }
@media (max-width: 39.99rem) { .bpc-hero__tab span { font-size: .75rem; } }

/* Boutons réutilisables */
.bpc-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .55rem;
  border-radius: 999px; padding: .95rem 1.7rem; font-weight: 600; font-size: 1rem; line-height: 1;
  transition: transform .25s var(--ease-elegant), background-color .25s, color .25s, border-color .25s, box-shadow .25s;
}
.bpc-btn svg { width: 1.15rem; height: 1.15rem; flex-shrink: 0; }
.bpc-btn:active { transform: scale(.97); }
.bpc-btn--wa { background: var(--whatsapp); color: #fff; box-shadow: 0 10px 30px -12px rgba(37,211,102,.6); }
.bpc-btn--wa:hover { filter: brightness(1.08); transform: translateY(-2px); }
.bpc-btn--ghost { border: 1.5px solid rgba(255,255,255,.55); color: #fff; }
.bpc-btn--ghost:hover { background: #fff; color: var(--bpc-night); border-color: #fff; }
.bpc-btn--gold { background: var(--bpc-gold); color: var(--bpc-night); }
.bpc-btn--gold:hover { background: #fff; transform: translateY(-2px); }
.bpc-btn--blue { background: var(--bpc-blue); color: #fff; }
.bpc-btn--blue:hover { background: var(--bpc-night); transform: translateY(-2px); }
.bpc-btn--line { border: 1.5px solid var(--bpc-blue); color: var(--bpc-blue); }
.bpc-btn--line:hover { background: var(--bpc-blue); color: #fff; }

/* ---------- 7. Sections communes ---------- */
.bpc-section { padding: 5.5rem 0; }
@media (min-width: 48rem) { .bpc-section { padding: 7rem 0; } }
.bpc-wrap { max-width: 80rem; margin: 0 auto; padding: 0 1rem; }
@media (min-width: 40rem) { .bpc-wrap { padding: 0 1.5rem; } }
@media (min-width: 64rem) { .bpc-wrap { padding: 0 2rem; } }
.bpc-h2 { font-family: var(--font-playfair), Georgia, serif; font-weight: 700; color: var(--bpc-blue); font-size: clamp(2rem, 3.6vw, 2.9rem); line-height: 1.12; letter-spacing: -.005em; text-wrap: balance; }
.bpc-lead { font-size: 1.075rem; line-height: 1.75; color: var(--muted-foreground); }
.bpc-rule { width: 56px; height: 3px; border-radius: 3px; background: var(--bpc-gold); }
.bpc-seal { display: inline-block; width: 26px; height: 30px; color: var(--bpc-gold-deep); }

/* Mission */
.bpc-mission { display: grid; gap: 3.5rem; align-items: center; }
@media (min-width: 64rem) { .bpc-mission { grid-template-columns: 1.05fr 1fr; gap: 5rem; } }
.bpc-mission__media { position: relative; }
.bpc-mission__media::before {
  content: ""; position: absolute; inset: 1.4rem -1.4rem -1.4rem 1.4rem; border: 2px solid var(--bpc-gold); border-radius: 1.4rem; z-index: 0;
}
.bpc-mission__media picture, .bpc-mission__media img { position: relative; z-index: 1; display: block; width: 100%; border-radius: 1.4rem; aspect-ratio: 4 / 3.2; object-fit: cover; box-shadow: 0 30px 60px -30px rgba(14,40,64,.45); }
.bpc-mission__badge {
  position: absolute; z-index: 2; left: -1rem; bottom: 2rem;
  display: flex; align-items: center; gap: .8rem; padding: 1rem 1.2rem; border-radius: 1rem;
  background: var(--bpc-night); color: #fff; box-shadow: 0 20px 40px -20px rgba(14,40,64,.6); max-width: 17rem;
}
.bpc-mission__badge svg { width: 34px; height: 40px; flex-shrink: 0; color: var(--bpc-gold); }
.bpc-mission__badge p { font-size: .9rem; line-height: 1.4; }
.bpc-commit { margin-top: 2.2rem; display: grid; gap: 1.3rem; }
.bpc-commit li { display: grid; grid-template-columns: 2.6rem 1fr; gap: 1rem; align-items: start; }
.bpc-commit__icon { width: 2.6rem; height: 2.6rem; border-radius: .8rem; display: grid; place-items: center; background: var(--bpc-mist); color: var(--bpc-blue); }
.bpc-commit__icon svg { width: 1.3rem; height: 1.3rem; }
.bpc-commit h3 { font-family: var(--font-inter), system-ui, sans-serif; font-size: 1.05rem; font-weight: 700; color: var(--bpc-blue); }
.bpc-commit p { margin-top: .2rem; font-size: .95rem; line-height: 1.6; color: var(--muted-foreground); }

/* Méthode (étapes) */
.bpc-method { background: var(--bpc-night); color: #fff; position: relative; overflow: hidden; }
.bpc-method::after {
  content: ""; position: absolute; right: -120px; top: -80px; width: 520px; height: 600px; opacity: .06;
  background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='355 240 290 315'%3E%3Cpath d='M365 272 Q500 240 635 272 L635 408 C622 470 575 522 500 545 C425 522 378 470 365 408 Z' fill='none' stroke='%23F8D268' stroke-width='6'/%3E%3Cpath d='M414 402 L441 375 L478 412 L557 333 L585 360 L478 467 Z' fill='none' stroke='%23F8D268' stroke-width='6' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.bpc-method .bpc-h2 { color: #fff; }
.bpc-steps { margin-top: 3.5rem; display: grid; gap: 1.2rem; counter-reset: step; position: relative; z-index: 1; }
@media (min-width: 48rem) { .bpc-steps { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 80rem) { .bpc-steps { grid-template-columns: repeat(4, 1fr); } }
.bpc-step { position: relative; padding: 2rem 1.6rem 1.8rem; border-radius: 1.2rem; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.1); transition: background-color .35s, border-color .35s, transform .35s var(--ease-elegant); }
.bpc-step:hover { background: rgba(255,255,255,.07); border-color: rgba(248,210,104,.45); transform: translateY(-4px); }
.bpc-step__num { font-family: var(--font-playfair), Georgia, serif; font-size: 2.6rem; line-height: 1; color: var(--bpc-gold); }
.bpc-step h3 { margin-top: 1.1rem; font-family: var(--font-inter), system-ui, sans-serif; font-weight: 700; font-size: 1.12rem; }
.bpc-step p { margin-top: .5rem; font-size: .95rem; line-height: 1.65; color: rgba(255,255,255,.72); }

/* Valeur ajoutée (page À propos) */
.bpc-values { margin-top: 3rem; display: grid; gap: 1.2rem; }
@media (min-width: 48rem) { .bpc-values { grid-template-columns: repeat(2, 1fr); } }
.bpc-value { display: grid; grid-template-columns: 3rem 1fr; gap: 1.1rem; padding: 1.8rem; border-radius: 1.2rem; background: #fff; border: 1px solid var(--bpc-line); }
.bpc-value__icon { width: 3rem; height: 3rem; border-radius: .9rem; display: grid; place-items: center; background: var(--bpc-night); color: var(--bpc-gold); }
.bpc-value__icon svg { width: 1.4rem; height: 1.4rem; }
.bpc-value h3 { font-family: var(--font-inter), system-ui, sans-serif; font-weight: 700; font-size: 1.08rem; color: var(--bpc-blue); }
.bpc-value p { margin-top: .35rem; font-size: .96rem; line-height: 1.65; color: var(--muted-foreground); }

/* Faits clés (À propos) */
.bpc-facts { margin-top: 2rem; display: grid; gap: .8rem; }
.bpc-facts li { display: flex; gap: .75rem; align-items: flex-start; font-size: .98rem; color: var(--bpc-ink); }
.bpc-facts svg { width: 1.2rem; height: 1.2rem; margin-top: .2rem; color: var(--bpc-gold-deep); flex-shrink: 0; }

/* En-tête des pages intérieures avec photo */
.bpc-pagehero { position: relative; isolation: isolate; overflow: hidden; background: var(--bpc-night); color: #fff; }
.bpc-pagehero__img { position: absolute; inset: 0; z-index: -1; }
.bpc-pagehero__img img { width: 100%; height: 100%; object-fit: cover; opacity: .32; }
.bpc-pagehero__img::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(14,40,64,.95) 0%, rgba(14,40,64,.7) 55%, rgba(14,40,64,.35) 100%); }

/* ---------- 8. Veille / actualités ---------- */
.bpc-news-grid { display: grid; gap: 1.2rem; }
@media (min-width: 48rem) { .bpc-news-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 64rem) { .bpc-news-grid { grid-template-columns: repeat(3, 1fr); } }
.bpc-news {
  display: flex; flex-direction: column; height: 100%; padding: 1.5rem; border-radius: 1.1rem;
  background: #fff; border: 1px solid var(--bpc-line); transition: border-color .3s, box-shadow .3s, transform .3s var(--ease-elegant);
}
.bpc-news:hover { border-color: var(--bpc-gold-deep); box-shadow: 0 24px 48px -28px rgba(14,40,64,.35); transform: translateY(-3px); }
.bpc-news__meta { display: flex; align-items: center; justify-content: space-between; gap: .8rem; font-size: .8rem; color: var(--muted-foreground); }
.bpc-news__source { display: inline-flex; align-items: center; gap: .45rem; font-weight: 600; color: var(--bpc-blue); min-width: 0; }
.bpc-news__source span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bpc-news__source img { width: 16px; height: 16px; border-radius: 4px; }
.bpc-news__topic { display: inline-block; padding: .2rem .6rem; border-radius: 999px; background: var(--bpc-mist); color: var(--bpc-blue); font-size: .72rem; font-weight: 600; white-space: nowrap; }
.bpc-news h3 { margin-top: .9rem; font-family: var(--font-inter), system-ui, sans-serif; font-weight: 700; font-size: 1.02rem; line-height: 1.45; color: var(--bpc-ink); }
.bpc-news h3 a::after { content: ""; position: absolute; inset: 0; }
.bpc-news { position: relative; }
.bpc-news__excerpt { margin-top: .5rem; font-size: .9rem; line-height: 1.6; color: var(--muted-foreground); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.bpc-news__foot { margin-top: auto; padding-top: 1rem; display: flex; justify-content: space-between; align-items: center; font-size: .8rem; color: var(--muted-foreground); }
.bpc-news__foot b { color: var(--bpc-blue); font-weight: 600; }
.bpc-news-filters { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1.8rem; }
.bpc-chip { padding: .5rem 1rem; border-radius: 999px; font-size: .85rem; font-weight: 600; background: #fff; border: 1px solid var(--bpc-line); color: var(--bpc-blue); cursor: pointer; transition: all .2s; }
.bpc-chip:hover { border-color: var(--bpc-blue); }
.bpc-chip.is-active { background: var(--bpc-blue); border-color: var(--bpc-blue); color: #fff; }
.bpc-news-empty { padding: 2.5rem; text-align: center; border: 1px dashed var(--bpc-line); border-radius: 1.1rem; color: var(--muted-foreground); }

/* ---------- 9. Assistant (chatbot) ---------- */
.bpc-chat-launch {
  display: flex; align-items: center; justify-content: center; width: 3.5rem; height: 3.5rem; border-radius: 999px;
  background: var(--bpc-night); color: var(--bpc-gold); box-shadow: 0 14px 30px -10px rgba(14,40,64,.65);
  transition: transform .3s var(--ease-elegant); position: relative;
}
.bpc-chat-launch:hover { transform: scale(1.08); }
.bpc-chat-launch svg { width: 1.6rem; height: 1.6rem; }
.bpc-chat-launch__hint {
  position: absolute; right: calc(100% + .7rem); top: 50%; transform: translateY(-50%);
  white-space: nowrap; background: #fff; color: var(--bpc-ink); font-size: .82rem; font-weight: 600;
  padding: .45rem .8rem; border-radius: .7rem; box-shadow: 0 10px 30px -12px rgba(14,40,64,.45);
  opacity: 0; pointer-events: none; transition: opacity .3s;
}
.bpc-chat-launch.show-hint .bpc-chat-launch__hint, .bpc-chat-launch:hover .bpc-chat-launch__hint { opacity: 1; }
.bpc-chat {
  position: fixed; z-index: 70; right: 1.25rem; bottom: 1.25rem; width: min(392px, calc(100vw - 1.5rem)); height: min(600px, calc(100svh - 2.5rem));
  display: flex; flex-direction: column; border-radius: 1.3rem; overflow: hidden; background: #fff;
  box-shadow: 0 40px 80px -30px rgba(14,40,64,.55), 0 0 0 1px rgba(14,40,64,.06);
  transform-origin: bottom right; animation: chat-in .35s var(--ease-elegant);
}
.bpc-chat[hidden] { display: none; }
@keyframes chat-in { from { opacity: 0; transform: translateY(14px) scale(.97); } to { opacity: 1; transform: none; } }
.bpc-chat__head { display: flex; align-items: center; gap: .8rem; padding: 1rem 1.1rem; background: var(--bpc-night); color: #fff; }
.bpc-chat__avatar { width: 2.5rem; height: 2.5rem; border-radius: .8rem; display: grid; place-items: center; background: rgba(248,210,104,.12); color: var(--bpc-gold); flex-shrink: 0; }
.bpc-chat__avatar svg { width: 1.35rem; height: 1.5rem; }
.bpc-chat__title { font-weight: 700; font-size: .98rem; line-height: 1.2; }
.bpc-chat__status { font-size: .76rem; color: rgba(255,255,255,.7); display: flex; align-items: center; gap: .35rem; }
.bpc-chat__status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #3ddc84; }
.bpc-chat__close { margin-left: auto; width: 2.1rem; height: 2.1rem; border-radius: .6rem; display: grid; place-items: center; color: rgba(255,255,255,.8); }
.bpc-chat__close:hover { background: rgba(255,255,255,.1); color: #fff; }
.bpc-chat__close svg { width: 1.1rem; height: 1.1rem; }
.bpc-chat__body { flex: 1; overflow-y: auto; padding: 1.1rem; background: var(--bpc-mist); display: flex; flex-direction: column; gap: .7rem; scroll-behavior: smooth; }
.bpc-msg { max-width: 86%; padding: .75rem .95rem; border-radius: 1rem; font-size: .92rem; line-height: 1.55; white-space: normal; word-wrap: break-word; animation: msg-in .3s var(--ease-elegant); }
@keyframes msg-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.bpc-msg--bot { align-self: flex-start; background: #fff; color: var(--bpc-ink); border-bottom-left-radius: .3rem; box-shadow: 0 1px 2px rgba(14,40,64,.06); }
.bpc-msg--user { align-self: flex-end; background: var(--bpc-blue); color: #fff; border-bottom-right-radius: .3rem; }
.bpc-msg p + p, .bpc-msg ul + p, .bpc-msg p + ul, .bpc-msg ol + p, .bpc-msg p + ol { margin-top: .5rem; }
.bpc-msg ul, .bpc-msg ol { padding-left: 1.1rem; list-style: disc; }
.bpc-msg ol { list-style: decimal; }
.bpc-msg li + li { margin-top: .2rem; }
.bpc-msg a { color: var(--bpc-blue); text-decoration: underline; text-underline-offset: 2px; }
.bpc-msg strong { font-weight: 700; }
.bpc-typing { display: inline-flex; gap: 4px; padding: .9rem 1rem; }
.bpc-typing i { width: 7px; height: 7px; border-radius: 50%; background: var(--bpc-blue); opacity: .35; animation: typing 1s infinite; }
.bpc-typing i:nth-child(2) { animation-delay: .15s; } .bpc-typing i:nth-child(3) { animation-delay: .3s; }
@keyframes typing { 0%, 60%, 100% { opacity: .35; transform: none; } 30% { opacity: 1; transform: translateY(-3px); } }
.bpc-chat__chips { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: .2rem; }
.bpc-chat__chips button { text-align: left; padding: .5rem .8rem; border-radius: .8rem; background: #fff; border: 1px solid var(--bpc-line); color: var(--bpc-blue); font-size: .82rem; font-weight: 600; transition: border-color .2s, background .2s; }
.bpc-chat__chips button:hover { border-color: var(--bpc-blue); background: #f8fbfe; }
.bpc-chat__wa { align-self: flex-start; display: inline-flex; align-items: center; gap: .45rem; margin-top: .1rem; padding: .5rem .85rem; border-radius: 999px; background: var(--whatsapp); color: #fff; font-size: .8rem; font-weight: 600; }
.bpc-chat__wa svg { width: 1rem; height: 1rem; }
.bpc-chat__form { display: flex; align-items: flex-end; gap: .5rem; padding: .8rem; border-top: 1px solid var(--bpc-line); background: #fff; }
.bpc-chat__form textarea { flex: 1; resize: none; max-height: 7.5rem; min-height: 2.75rem; padding: .7rem .9rem; border-radius: .9rem; border: 1px solid var(--bpc-line); font-size: .92rem; line-height: 1.4; color: var(--bpc-ink); background: #fff; }
.bpc-chat__form textarea:focus { outline: none; border-color: var(--bpc-blue); box-shadow: 0 0 0 3px rgba(35,91,137,.12); }
.bpc-chat__send { width: 2.75rem; height: 2.75rem; border-radius: .9rem; display: grid; place-items: center; background: var(--bpc-blue); color: #fff; flex-shrink: 0; transition: background .2s; }
.bpc-chat__send:hover { background: var(--bpc-night); }
.bpc-chat__send:disabled { opacity: .5; }
.bpc-chat__send svg { width: 1.15rem; height: 1.15rem; }
.bpc-chat__legal { padding: 0 .9rem .7rem; background: #fff; font-size: .7rem; color: var(--muted-foreground); text-align: center; }
@media (max-width: 30rem) { .bpc-chat { right: .5rem; bottom: .5rem; height: calc(100svh - 1rem); } }

/* ---------- 10. Détails ---------- */
[data-wa-toggle] { position: relative; }
@media (max-width: 39.99rem) {
  .bpc-hero__nav { padding-right: 5.5rem; bottom: 1.6rem; gap: .6rem; }
  .bpc-hero__tab span { display: none; }
  .bpc-hero__tab { padding-top: 0; height: 14px; }
  .bpc-hero__content { padding-bottom: 6rem; }
}
.bpc-cta-note { display: inline-flex; align-items: center; gap: .5rem; }
.bpc-hide-mobile { display: none; }
@media (min-width: 48rem) { .bpc-hide-mobile { display: initial; } }

/* ---------- 11. Mouvement réduit ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
  .bpc-hero__media img { transform: none !important; }
}