/* =====================================================================
   bivouak-ui.css — socle visuel de la refonte UX (octobre 2026)
   Référence : docs/refonte-ux/CAHIER-DES-CHARGES-UX.md
   1. tokens   2. base   3. reskin Bootstrap 3   4. composants bk-*
   Chargé après les CSS vendeurs et le thème couleur, avant les CSS de page.
   ===================================================================== */

/* ---------- 1. Tokens ---------- */
:root{
  --bk-accent:#FF7900; --bk-accent-ink:#c95f00; --bk-accent-soft:#fff1e4; --bk-accent-hover:#ff8f2a;
  --bk-ink:#1f262c; --bk-ink-2:#56616b; --bk-ink-3:#8a949d;
  --bk-bg:#f7f5f1; --bk-surface:#ffffff; --bk-line:#e6e1d9; --bk-anth:#2d353c; --bk-anth-2:#1a2025;
  --bk-ok:#2f8f5b; --bk-warn:#d99a1a; --bk-danger:#d9534f; --bk-info:#3b7dd8;
  --bk-ski:#6793C4; --bk-rando:#6DAC54; --bk-vtt:#e0b000; --bk-raq:#D00350; --bk-para:#D3634D; --bk-cheval:#8a6a3e;
  --bk-display:"Outfit",system-ui,-apple-system,"Segoe UI",sans-serif;
  --bk-body:"Source Sans 3","Source Sans Pro",system-ui,-apple-system,"Segoe UI",sans-serif;
  --bk-r:14px; --bk-r-sm:10px;
  --bk-shadow:0 1px 2px rgba(31,38,44,.06),0 8px 24px -12px rgba(31,38,44,.18);
  --bk-shadow-lg:0 2px 4px rgba(31,38,44,.06),0 18px 34px -14px rgba(31,38,44,.3);
  --bk-wrap:1180px; --bk-gutter:20px;
}
@media (max-width:600px){ :root{ --bk-gutter:16px } }

/* ---------- 2. Base ---------- */
html{ -webkit-text-size-adjust:100% }
body{
  background:var(--bk-bg) !important; color:var(--bk-ink);
  font-family:var(--bk-body) !important; font-size:16px; line-height:1.5;
}
body.boxed, .boxed{ background:var(--bk-bg) !important; box-shadow:none !important; max-width:none !important; margin:0 !important }
#sb-site{ background:var(--bk-bg) }
h1,h2,h3,h4,h5,.h1,.h2,.h3,.h4{ font-family:var(--bk-display); color:var(--bk-ink); line-height:1.15; text-wrap:balance; font-weight:600; margin:0 0 .4em; text-transform:none; letter-spacing:normal }
h1,.h1{ font-size:clamp(28px,3.6vw,40px); letter-spacing:-.02em; font-weight:700 }
h2,.h2{ font-size:clamp(22px,2.6vw,30px); letter-spacing:-.01em }
h3,.h3{ font-size:20px }
h4,.h4{ font-size:17px }
p{ margin:0 0 1em }
a{ color:var(--bk-accent-ink); text-decoration:none }
a:hover,a:focus{ color:var(--bk-accent); text-decoration:none }
img{ max-width:100% }
hr{ border:0; border-top:1px solid var(--bk-line); margin:24px 0 }
small,.small{ font-size:13px; color:var(--bk-ink-3) }
b,strong{ font-weight:600 }
:focus-visible{ outline:3px solid var(--bk-accent); outline-offset:2px }
.container{ max-width:var(--bk-wrap); padding-left:var(--bk-gutter); padding-right:var(--bk-gutter) }
@media (min-width:1200px){ .container{ width:auto } }
/* animations du thème précédent : neutralisées */
.animated{ animation:none !important; -webkit-animation:none !important; opacity:1 !important }
[class*="animation-delay-"]{ animation-delay:0s !important }
@media (prefers-reduced-motion:reduce){ *{ transition:none !important; animation:none !important } }

/* ---------- 3. Reskin Bootstrap 3 ---------- */
.btn{ font-family:var(--bk-body); font-weight:600; border-radius:999px; padding:8px 16px; border:1px solid transparent; box-shadow:none; text-transform:none; transition:background .15s,color .15s,border-color .15s }
.btn-primary,.btn-ar.btn-primary,.button-flat-primary{ background:var(--bk-accent) !important; border-color:var(--bk-accent) !important; color:#1a1a1a !important }
.btn-primary:hover,.btn-ar.btn-primary:hover{ background:var(--bk-accent-hover) !important; border-color:var(--bk-accent-hover) !important; color:#1a1a1a !important }
.btn-default,.btn-ar.btn-default,.btn-secondary{ background:var(--bk-surface) !important; border-color:var(--bk-line) !important; color:var(--bk-ink) !important }
.btn-default:hover,.btn-ar.btn-default:hover{ border-color:var(--bk-ink-3) !important; background:var(--bk-surface) !important }
.btn-warning,.btn-ar.btn-warning{ background:var(--bk-warn) !important; border-color:var(--bk-warn) !important; color:#1a1a1a !important }
.btn-danger,.btn-ar.btn-danger{ background:var(--bk-danger) !important; border-color:var(--bk-danger) !important; color:#fff !important }
.btn-success,.btn-ar.btn-success{ background:var(--bk-ok) !important; border-color:var(--bk-ok) !important; color:#fff !important }
.btn-info,.btn-ar.btn-info{ background:var(--bk-info) !important; border-color:var(--bk-info) !important; color:#fff !important }
.btn-xs{ padding:3px 10px; font-size:12px } .btn-sm{ padding:5px 12px; font-size:13px } .btn-lg{ padding:12px 24px; font-size:17px }
.btn-ar{ border-radius:999px !important }
.button,.button-plain,.button-borderless{ font-family:var(--bk-body) }
.form-control,input[type="text"],input[type="email"],input[type="password"],input[type="number"],input[type="search"],input[type="date"],input[type="url"],input[type="tel"],select,textarea{
  font-family:var(--bk-body); font-size:16px; color:var(--bk-ink); background:var(--bk-surface);
  border:1px solid var(--bk-line); border-radius:var(--bk-r-sm); box-shadow:none; padding:9px 12px; height:auto; min-height:42px; transition:border-color .15s,box-shadow .15s }
textarea.form-control,textarea{ min-height:120px }
.form-control:focus,input:focus,select:focus,textarea:focus{ border-color:var(--bk-accent); box-shadow:0 0 0 3px rgba(255,121,0,.18); outline:0 }
.form-control::placeholder{ color:var(--bk-ink-3) }
label{ font-weight:600; color:var(--bk-ink); font-size:14px; margin-bottom:6px }
.help-block{ color:var(--bk-ink-3); font-size:13px }
.input-group-addon{ background:var(--bk-bg); border-color:var(--bk-line); color:var(--bk-ink-2); border-radius:var(--bk-r-sm) }
.input-group .form-control:first-child,.input-group-addon:first-child{ border-top-left-radius:var(--bk-r-sm); border-bottom-left-radius:var(--bk-r-sm) }
.input-group .form-control:last-child,.input-group-addon:last-child,.input-group-btn:last-child>.btn{ border-top-right-radius:var(--bk-r-sm); border-bottom-right-radius:var(--bk-r-sm) }
.has-error .form-control{ border-color:var(--bk-danger) }
.table{ font-size:15px; background:var(--bk-surface); border-radius:var(--bk-r-sm); overflow:hidden }
.table>thead>tr>th{ border-bottom:1px solid var(--bk-line); color:var(--bk-ink-2); font-size:12px; text-transform:uppercase; letter-spacing:.08em; font-weight:600; background:var(--bk-bg) }
.table>tbody>tr>td,.table>tbody>tr>th{ border-top:1px solid var(--bk-line); vertical-align:middle; padding:10px 12px }
.table-striped>tbody>tr:nth-of-type(odd){ background:transparent }
.table-striped>tbody>tr:hover{ background:var(--bk-accent-soft) }
.table-responsive{ border:0 }
.pagination>li>a,.pagination>li>span{ border:1px solid var(--bk-line); color:var(--bk-ink-2); margin:0 2px; border-radius:999px !important; padding:6px 12px; background:var(--bk-surface); font-weight:600; font-size:14px }
.pagination>li>a:hover{ border-color:var(--bk-ink-3); color:var(--bk-ink); background:var(--bk-surface) }
.pagination>.active>a,.pagination>.active>a:hover,.pagination>.active>span{ background:var(--bk-anth); border-color:var(--bk-anth); color:#fff }
.panel{ border:0; border-radius:var(--bk-r); box-shadow:var(--bk-shadow); background:var(--bk-surface) }
.panel-default>.panel-heading{ background:var(--bk-surface); border-bottom:1px solid var(--bk-line); border-radius:var(--bk-r) var(--bk-r) 0 0; font-family:var(--bk-display); font-weight:600; color:var(--bk-ink) }
.panel-body{ padding:18px }
.jumbotron{ background:var(--bk-surface); border-radius:var(--bk-r); padding:20px }
.well{ background:var(--bk-bg); border:1px solid var(--bk-line); border-radius:var(--bk-r); box-shadow:none }
.thumbnail{ border:0; border-radius:var(--bk-r); box-shadow:var(--bk-shadow); padding:0; overflow:hidden; background:var(--bk-surface) }
.alert{ border:0; border-radius:var(--bk-r-sm); padding:12px 16px; font-size:15px }
.alert-info{ background:#e8f1fc; color:#1f4f8f } .alert-success{ background:#e4f5ea; color:#1f6b40 }
.alert-warning{ background:var(--bk-accent-soft); color:#7a4700 } .alert-danger{ background:#fdecec; color:#8f2a26 }
.label{ border-radius:999px; padding:3px 9px; font-weight:600; font-size:12px; display:inline-block; line-height:1.4 }
.label-default{ background:var(--bk-line); color:var(--bk-ink-2) } .label-success{ background:#e4f5ea; color:#1f6b40 }
.label-warning{ background:var(--bk-accent-soft); color:#7a4700 } .label-info{ background:#e8f1fc; color:#1f4f8f } .label-danger{ background:#fdecec; color:#8f2a26 }
.badge{ background:var(--bk-anth); border-radius:999px; font-weight:600 }
.nav-tabs{ border-bottom:1px solid var(--bk-line) }
.nav-tabs>li>a{ border:0; border-bottom:2px solid transparent; color:var(--bk-ink-2); font-weight:600; margin-right:4px; border-radius:0; padding:10px 14px }
.nav-tabs>li>a:hover{ background:transparent; border-color:transparent; color:var(--bk-ink) }
.nav-tabs>li.active>a,.nav-tabs>li.active>a:hover,.nav-tabs>li.active>a:focus{ border:0; border-bottom:2px solid var(--bk-accent); color:var(--bk-ink); background:transparent }
.modal-content{ border:0; border-radius:var(--bk-r); box-shadow:var(--bk-shadow-lg) }
.modal-header{ border-bottom:1px solid var(--bk-line); padding:16px 20px; display:flex; justify-content:space-between; align-items:center }
.modal-title{ font-family:var(--bk-display); font-weight:600; font-size:18px; margin:0 }
.modal-body{ padding:20px } .modal-footer{ border-top:1px solid var(--bk-line); padding:14px 20px }
.modal .close{ font-size:26px; opacity:.5 }
.dropdown-menu{ border:0; border-radius:var(--bk-r-sm); box-shadow:var(--bk-shadow-lg); padding:6px; font-size:15px }
.dropdown-menu>li>a{ border-radius:8px; padding:8px 12px; color:var(--bk-ink) }
.dropdown-menu>li>a:hover{ background:var(--bk-accent-soft); color:var(--bk-ink) }
.breadcrumb{ background:transparent; padding:0; margin:0; font-size:13px; color:var(--bk-ink-3) }
.breadcrumb>li+li:before{ content:"›"; color:var(--bk-ink-3); padding:0 6px }
.breadcrumb a{ color:var(--bk-ink-2) }
.main-header{ background:transparent; padding:0; margin:0; border:0 }
.main-header .container{ padding-top:16px }
.section-title,.page-title{ font-family:var(--bk-display); font-weight:600; text-transform:none; letter-spacing:-.01em; border:0; padding:0; margin:0 0 16px }
.section-title:after,.page-title:after{ display:none }
.tooltip-inner{ background:var(--bk-anth); border-radius:8px; font-family:var(--bk-body) }
.progress{ border-radius:999px; box-shadow:none; background:var(--bk-line) } .progress-bar{ background:var(--bk-accent) }
#back-top{ display:none !important }
.icon-ar{ border-radius:999px }
.switch-btn{ cursor:pointer }
.tag,.tags a{ display:inline-block; background:var(--bk-bg); border:1px solid var(--bk-line); color:var(--bk-ink-2); border-radius:999px; padding:3px 10px; font-size:13px; margin:0 4px 4px 0 }
.img-caption-ar,.caption-ar{ border-radius:var(--bk-r); overflow:hidden }
.post_bookmark{ right:12px; top:12px }
.image-zoom{ border-radius:var(--bk-r); overflow:hidden }

/* ---------- 4. Composants bk-* ---------- */
.bk-wrap{ max-width:var(--bk-wrap); margin:0 auto; padding-inline:var(--bk-gutter); min-width:0 }
.bk-eyebrow{ display:block; font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--bk-accent-ink); font-weight:600; margin-bottom:6px }
.bk-muted{ color:var(--bk-ink-3) } .bk-sec{ color:var(--bk-ink-2) }
.bk-num{ font-variant-numeric:tabular-nums }

/* section */
.bk-section{ padding-block:40px }
@media (min-width:860px){ .bk-section{ padding-block:56px } }
.bk-section--alt{ background:var(--bk-surface); border-block:1px solid var(--bk-line) }
.bk-section--tight{ padding-block:24px }
.bk-sechead{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:20px; flex-wrap:wrap }
.bk-sechead h2,.bk-sechead h3{ margin:0; font-size:clamp(22px,2.6vw,30px); font-weight:600 }
.bk-sechead p{ margin:4px 0 0; color:var(--bk-ink-2) }
.bk-more{ font-weight:600; color:var(--bk-accent-ink); white-space:nowrap }
.bk-more::after{ content:" →" }

/* en-tête de page */
.bk-pagehead{ padding:20px 0 8px }
.bk-pagehead__top{ display:flex; align-items:flex-start; justify-content:space-between; gap:20px; flex-wrap:wrap }
.bk-pagehead h1{ margin:4px 0 0; font-size:clamp(26px,3.4vw,38px) }
.bk-pagehead__sub{ color:var(--bk-ink-2); margin:6px 0 0; font-size:16px }
.bk-pagehead__sub b{ color:var(--bk-ink) }
.bk-pagehead__actions{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin-left:auto }
.bk-pagehead__actions form{ margin:0; display:inline }
.bk-crumbs{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:4px; font-size:13px; color:var(--bk-ink-3) }
.bk-crumbs li+li::before{ content:"›"; margin:0 6px }
.bk-crumbs a{ color:var(--bk-ink-2) } .bk-crumbs a:hover{ color:var(--bk-accent-ink) }
.bk-crumbs li:last-child{ color:var(--bk-ink-3) }
@media (max-width:600px){ .bk-pagehead__actions{ width:100%; margin-left:0 } }

/* boutons */
.bk-btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; border-radius:999px; padding:9px 18px; font:600 15px/1.2 var(--bk-body); border:1px solid transparent; white-space:nowrap; cursor:pointer; color:var(--bk-ink); background:var(--bk-surface); border-color:var(--bk-line); text-decoration:none; transition:background .15s,border-color .15s,color .15s; min-height:40px }
.bk-btn:hover{ border-color:var(--bk-ink-3); color:var(--bk-ink); text-decoration:none }
.bk-btn--accent{ background:var(--bk-accent); border-color:var(--bk-accent); color:#1a1a1a }
.bk-btn--accent:hover{ background:var(--bk-accent-hover); border-color:var(--bk-accent-hover); color:#1a1a1a }
.bk-btn--dark{ background:var(--bk-anth); border-color:var(--bk-anth); color:#fff } .bk-btn--dark:hover{ background:#3c4650; color:#fff }
.bk-btn--ghost{ background:transparent; border-color:rgba(255,255,255,.35); color:#fff } .bk-btn--ghost:hover{ background:rgba(255,255,255,.12); color:#fff; border-color:#fff }
.bk-btn--line{ background:transparent; border-color:var(--bk-line); color:var(--bk-ink) }
.bk-btn--danger{ background:transparent; border-color:var(--bk-danger); color:var(--bk-danger) } .bk-btn--danger:hover{ background:var(--bk-danger); color:#fff }
.bk-btn--sm{ padding:6px 12px; font-size:13px; min-height:32px } .bk-btn--lg{ padding:12px 24px; font-size:17px }
.bk-btn--icon{ width:40px; height:40px; padding:0; border-radius:50% } .bk-btn--icon.bk-btn--sm{ width:32px; height:32px }
.bk-btn[disabled],.bk-btn.is-disabled{ opacity:.5; pointer-events:none }
.bk-btn .fa,.bk-btn .biv{ font-size:1em }
.bk-link{ font-weight:600; color:var(--bk-accent-ink) }

/* chips et pastilles */
.bk-chips{ display:flex; flex-wrap:wrap; gap:8px }
.bk-chip{ display:inline-flex; align-items:center; gap:8px; border-radius:999px; padding:6px 12px 6px 8px; background:var(--bk-surface); border:1px solid var(--bk-line); color:var(--bk-ink); font:600 14px/1.2 var(--bk-body); cursor:pointer; text-decoration:none; transition:background .15s,border-color .15s; min-height:36px }
.bk-chip i{ width:22px; height:22px; border-radius:50%; display:inline-grid; place-items:center; background:var(--c,var(--bk-line)); color:#111; font-size:13px; font-style:normal }
.bk-chip:hover{ border-color:var(--bk-ink-3); color:var(--bk-ink) }
.bk-chip[aria-pressed="true"],.bk-chip.is-active{ background:var(--bk-anth); color:#fff; border-color:var(--bk-anth) }
.bk-chip--light{ background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.35); color:#fff; backdrop-filter:blur(6px) }
.bk-chip--light:hover{ background:rgba(255,255,255,.28); color:#fff }
.bk-chip--light[aria-pressed="true"]{ background:#fff; color:var(--bk-ink); border-color:#fff }
.bk-pill{ display:inline-flex; align-items:center; gap:6px; background:rgba(255,255,255,.92); color:var(--bk-ink); font-weight:600; font-size:12px; border-radius:999px; padding:4px 10px 4px 6px; line-height:1.2 }
.bk-pill i{ width:16px; height:16px; border-radius:50%; background:var(--c,var(--bk-line)); display:inline-grid; place-items:center; font-size:10px; color:#111; font-style:normal }
.bk-pill--solid{ background:var(--c,var(--bk-anth)); color:#fff }
.bk-tag{ display:inline-block; background:var(--bk-bg); border:1px solid var(--bk-line); color:var(--bk-ink-2); border-radius:999px; padding:3px 10px; font-size:13px; font-weight:600 }
.bk-badge{ display:inline-grid; place-items:center; min-width:22px; height:22px; padding:0 7px; border-radius:999px; background:var(--bk-accent); color:#1a1a1a; font-size:12px; font-weight:700 }
.bk-badge--soft{ background:var(--bk-accent-soft); color:var(--bk-accent-ink) }
.bk-sport{ color:var(--c,var(--bk-ink-2)) }

/* grille et dispositions */
.bk-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:20px }
.bk-grid--sm{ grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:16px }
.bk-grid--2{ grid-template-columns:repeat(2,1fr) } .bk-grid--3{ grid-template-columns:repeat(3,1fr) } .bk-grid--4{ grid-template-columns:repeat(4,1fr) }
@media (max-width:860px){ .bk-grid--3,.bk-grid--4{ grid-template-columns:repeat(2,1fr) } }
@media (max-width:600px){ .bk-grid,.bk-grid--2,.bk-grid--3,.bk-grid--4{ grid-template-columns:1fr } .bk-grid--sm{ grid-template-columns:repeat(2,1fr) } }
.bk-grid>*{ min-width:0 }
.bk-layout{ display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:32px; align-items:start }
.bk-layout--wide{ grid-template-columns:minmax(0,1fr) 400px }
.bk-layout--narrow{ grid-template-columns:minmax(0,1fr) 280px }
@media (max-width:960px){ .bk-layout,.bk-layout--wide,.bk-layout--narrow{ grid-template-columns:1fr } }
.bk-main{ min-width:0 } .bk-aside{ min-width:0; display:grid; gap:20px; align-content:start }
.bk-aside--sticky{ position:sticky; top:80px }
@media (max-width:960px){ .bk-aside--sticky{ position:static } }
.bk-row{ display:flex; gap:12px; flex-wrap:wrap; align-items:center }
.bk-row--between{ justify-content:space-between }
.bk-stack{ display:grid; gap:16px }
.bk-prose{ max-width:68ch; font-size:17px; line-height:1.6 }
.bk-prose img{ border-radius:var(--bk-r-sm) }
.bk-narrow{ max-width:720px; margin-inline:auto }

/* cartes */
.bk-card{ background:var(--bk-surface); border-radius:var(--bk-r); box-shadow:var(--bk-shadow); overflow:hidden; display:flex; flex-direction:column; min-width:0; position:relative; transition:transform .15s,box-shadow .15s }
.bk-card:hover{ transform:translateY(-3px); box-shadow:var(--bk-shadow-lg) }
.bk-card--flat{ box-shadow:none; border:1px solid var(--bk-line) } .bk-card--flat:hover{ transform:none; box-shadow:var(--bk-shadow) }
.bk-card--static:hover{ transform:none; box-shadow:var(--bk-shadow) }
.bk-card--feature{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr) }
@media (max-width:600px){ .bk-card--feature{ grid-template-columns:1fr } .bk-card--feature .bk-card__ph{ min-height:180px } }
.bk-card__ph{ position:relative; aspect-ratio:4/3; max-width:100%; display:block; overflow:hidden;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 300' preserveAspectRatio='none'><path d='M0 300V190l60-70 50 45 70-95 60 70 55-40 45 50 60-60v210z' fill='rgba(0,0,0,.18)'/><path d='M0 300V240l80-50 60 35 70-60 70 55 50-30 70 45v65z' fill='rgba(0,0,0,.28)'/></svg>") bottom/100% 100% no-repeat,
  linear-gradient(160deg,var(--c1,#b9c6d2),var(--c2,#4d6071)) }
.bk-card__ph img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block }
.bk-card__ph img[src=""],.bk-card__ph img:not([src]){ display:none }
.bk-card__ph--wide{ aspect-ratio:16/9 } .bk-card__ph--square{ aspect-ratio:1 }
.bk-card__ph .bk-pill{ position:absolute; top:12px; left:12px; z-index:2 }
.bk-card__ph .bk-fav{ position:absolute; top:10px; right:10px; z-index:2; width:34px; height:34px; border-radius:50%; background:rgba(255,255,255,.9); display:grid; place-items:center; color:var(--bk-ink); border:0; cursor:pointer }
.bk-card__ph .bk-fav:hover{ color:var(--bk-raq) }
.bk-card__ph .bk-cap{ position:absolute; left:12px; bottom:10px; right:12px; z-index:2; color:#fff; font-size:13px; font-weight:600; text-shadow:0 1px 6px rgba(0,0,0,.6) }
.bk-card__body{ padding:14px 16px 16px; display:grid; gap:10px; align-content:start }
.bk-card__meta{ display:flex; justify-content:space-between; gap:8px; font-size:13px; color:var(--bk-ink-3); flex-wrap:wrap }
.bk-card__meta a{ color:var(--bk-ink-3) } .bk-card__meta a:hover{ color:var(--bk-accent-ink) }
.bk-card__title,.bk-card h3{ font-size:17px; font-weight:600; margin:0; line-height:1.25 }
.bk-card__title a,.bk-card h3 a{ color:var(--bk-ink) } .bk-card__title a:hover,.bk-card h3 a:hover{ color:var(--bk-accent-ink) }
.bk-card__text,.bk-card p{ margin:0; color:var(--bk-ink-2); font-size:14px }
.bk-clamp-2{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden }
.bk-clamp-3{ display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden }
.bk-card__foot{ display:flex; align-items:center; gap:10px; font-size:13px; color:var(--bk-ink-2); margin-top:auto }
.bk-card__foot a{ color:var(--bk-ink-2) }
.bk-soc{ margin-left:auto; display:flex; gap:12px; color:var(--bk-ink-3); font-variant-numeric:tabular-nums }
.bk-soc span,.bk-soc a{ display:inline-flex; align-items:center; gap:4px; color:var(--bk-ink-3) }
.bk-kpis{ display:flex; flex-wrap:wrap; gap:8px 0; border-top:1px solid var(--bk-line); padding-top:10px; margin-top:2px }
.bk-kpi{ flex:1 0 31%; display:grid; padding-inline:10px; border-left:1px solid var(--bk-line); min-width:0 }
.bk-kpi:nth-child(3n+1){ border-left:0; padding-left:0 }
.bk-kpi:first-child{ border-left:0; padding-left:0 }
.bk-kpi b{ font-family:var(--bk-display); font-weight:600; font-size:15px; font-variant-numeric:tabular-nums; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.bk-kpi span{ font-size:11px; color:var(--bk-ink-3); text-transform:uppercase; letter-spacing:.06em; white-space:nowrap }
.bk-kpis--lg .bk-kpi b{ font-size:22px } .bk-kpis--lg{ border-top:0; padding:0 }
.bk-kpis--boxed{ background:var(--bk-surface); border:1px solid var(--bk-line); border-radius:var(--bk-r-sm); padding:12px 16px; border-top:1px solid var(--bk-line) }

/* carte compacte et rail */
.bk-mini{ display:grid; grid-template-columns:96px 1fr; background:var(--bk-surface); border-radius:var(--bk-r); box-shadow:var(--bk-shadow); overflow:hidden; min-width:0; color:var(--bk-ink) }
.bk-mini:hover{ box-shadow:var(--bk-shadow-lg); color:var(--bk-ink) }
.bk-mini .bk-card__ph{ aspect-ratio:auto; height:100%; min-height:104px }
.bk-mini__body{ padding:12px 14px; display:grid; gap:4px; align-content:center; min-width:0 }
.bk-mini h3,.bk-mini__title{ font-size:15px; font-weight:600; line-height:1.25; margin:0 }
.bk-mini__meta{ font-size:12px; color:var(--bk-ink-3) } .bk-mini__meta b{ color:var(--bk-ink-2); font-weight:600 }
.bk-rail{ display:grid; grid-auto-flow:column; grid-auto-columns:minmax(250px,1fr); gap:18px; overflow-x:auto; padding-bottom:10px; scroll-snap-type:x mandatory; scrollbar-width:thin }
.bk-rail>*{ scroll-snap-align:start }
.bk-rail--photos{ grid-auto-columns:minmax(180px,220px) }

/* stats */
.bk-stats{ display:grid; grid-template-columns:repeat(4,1fr); background:var(--bk-surface); border:1px solid var(--bk-line); border-radius:var(--bk-r); padding:14px 0 }
.bk-stats--3{ grid-template-columns:repeat(3,1fr) } .bk-stats--2{ grid-template-columns:repeat(2,1fr) }
.bk-stat{ padding:6px 18px; border-left:1px solid var(--bk-line); display:grid; gap:2px }
.bk-stat:first-child{ border-left:0 }
.bk-stat b{ font-family:var(--bk-display); font-size:clamp(22px,2.4vw,30px); font-weight:600; font-variant-numeric:tabular-nums; letter-spacing:-.01em; line-height:1.1 }
.bk-stat span{ color:var(--bk-ink-2); font-size:14px }
@media (max-width:700px){ .bk-stats{ grid-template-columns:1fr 1fr; row-gap:14px } .bk-stat:nth-child(3){ border-left:0 } }

/* fiche technique */
.bk-facts{ display:grid; grid-template-columns:auto 1fr; gap:8px 14px; margin:0; font-size:15px; background:var(--bk-surface); border:1px solid var(--bk-line); border-radius:var(--bk-r); padding:16px 18px }
.bk-facts dt{ color:var(--bk-ink-3); font-weight:600; font-size:13px; text-transform:uppercase; letter-spacing:.06em; align-self:center }
.bk-facts dd{ margin:0; font-variant-numeric:tabular-nums }
.bk-box{ background:var(--bk-surface); border:1px solid var(--bk-line); border-radius:var(--bk-r); padding:16px 18px }
.bk-box__title{ font-family:var(--bk-display); font-weight:600; font-size:16px; margin:0 0 10px; display:flex; align-items:center; justify-content:space-between; gap:8px }
.bk-box--accent{ background:var(--bk-accent-soft); border-color:transparent }
.bk-box--dark{ background:var(--bk-anth); color:#fff; border-color:transparent } .bk-box--dark .bk-box__title{ color:#fff }
.bk-list{ list-style:none; margin:0; padding:0; display:grid; gap:8px }
.bk-list li{ display:flex; gap:10px; align-items:center }
.bk-list--lines li{ padding:10px 0; border-top:1px solid var(--bk-line) } .bk-list--lines li:first-child{ border-top:0; padding-top:0 }

/* agenda */
.bk-ev{ display:grid; grid-template-columns:58px 1fr; gap:14px; background:var(--bk-surface); border-radius:var(--bk-r); padding:12px; box-shadow:var(--bk-shadow); align-items:center; min-width:0; color:var(--bk-ink) }
.bk-ev__d{ display:grid; place-items:center; background:var(--bk-accent-soft); color:var(--bk-accent-ink); border-radius:10px; padding:6px 0; line-height:1; font-family:var(--bk-display) }
.bk-ev__d b{ font-size:22px; font-weight:700 } .bk-ev__d span{ font-size:11px; text-transform:uppercase; letter-spacing:.08em; font-weight:600 }
.bk-ev h4{ margin:0; font-size:15px; font-weight:600 } .bk-ev p{ margin:2px 0 0; font-size:13px; color:var(--bk-ink-3) }

/* forum / commentaires */
.bk-topics{ display:grid; background:var(--bk-surface); border-radius:var(--bk-r); box-shadow:var(--bk-shadow); overflow:hidden }
.bk-topic{ display:grid; grid-template-columns:36px 1fr auto; gap:12px; padding:12px 16px; border-top:1px solid var(--bk-line); align-items:center; min-width:0 }
.bk-topic:first-child{ border-top:0 }
.bk-topic h4{ margin:0; font-family:var(--bk-body); font-size:15px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.bk-topic h4 a{ color:var(--bk-ink) } .bk-topic h4 a:hover{ color:var(--bk-accent-ink) }
.bk-topic p{ margin:0; font-size:12px; color:var(--bk-ink-3) }
.bk-topic__n{ font-size:12px; color:var(--bk-ink-3); display:inline-flex; align-items:center; gap:4px; font-variant-numeric:tabular-nums }
.bk-post{ display:grid; grid-template-columns:44px 1fr; gap:14px; padding:16px 0; border-top:1px solid var(--bk-line) }
.bk-post:first-child{ border-top:0 }
.bk-post__head{ display:flex; gap:8px; align-items:baseline; flex-wrap:wrap; font-size:13px; color:var(--bk-ink-3) }
.bk-post__head b{ color:var(--bk-ink); font-size:15px }
.bk-post__body{ margin-top:6px; font-size:15px }
.bk-post__actions{ display:flex; gap:12px; margin-top:8px; font-size:13px }

/* avatar */
.bk-av{ width:36px; height:36px; border-radius:50%; display:inline-grid; place-items:center; font-weight:700; font-size:13px; color:#fff; background:var(--bk-anth); flex:none; overflow:hidden; font-family:var(--bk-display); vertical-align:middle }
.bk-av img{ width:100%; height:100%; object-fit:cover; display:block }
.bk-av--sm{ width:26px; height:26px; font-size:11px } .bk-av--lg{ width:56px; height:56px; font-size:20px } .bk-av--xl{ width:96px; height:96px; font-size:32px }
.bk-author{ display:inline-flex; align-items:center; gap:8px; color:var(--bk-ink-2); font-size:14px; font-weight:600 }
.bk-author:hover{ color:var(--bk-accent-ink) }

/* onglets */
.bk-tabs{ display:inline-flex; background:var(--bk-surface); border:1px solid var(--bk-line); border-radius:999px; padding:4px; gap:2px; max-width:100%; overflow-x:auto }
.bk-tabs button,.bk-tabs a{ border:0; background:transparent; padding:6px 14px; border-radius:999px; font:600 14px var(--bk-body); color:var(--bk-ink-2); white-space:nowrap; cursor:pointer }
.bk-tabs button[aria-pressed="true"],.bk-tabs a.is-active,.bk-tabs button.is-active{ background:var(--bk-anth); color:#fff }
.bk-tabs--line{ border:0; border-radius:0; background:transparent; padding:0; gap:4px; border-bottom:1px solid var(--bk-line); display:flex }
.bk-tabs--line button,.bk-tabs--line a{ border-radius:0; border-bottom:2px solid transparent; padding:10px 14px }
.bk-tabs--line button[aria-pressed="true"],.bk-tabs--line a.is-active,.bk-tabs--line button.is-active{ background:transparent; color:var(--bk-ink); border-bottom-color:var(--bk-accent) }

/* barre de filtres */
.bk-filters{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin:12px 0 20px }
.bk-filters__search{ flex:1 1 240px; display:flex; align-items:center; gap:8px; background:var(--bk-surface); border:1px solid var(--bk-line); border-radius:999px; padding:4px 6px 4px 14px; min-height:42px }
.bk-filters__search input{ border:0 !important; background:transparent !important; flex:1; min-width:0; padding:6px 0 !important; min-height:0 !important; box-shadow:none !important }
.bk-filters__search .fa{ color:var(--bk-ink-3) }
.bk-filters select{ min-height:40px; padding:6px 32px 6px 12px; border-radius:999px; font-size:14px; font-weight:600 }
.bk-filters__more{ width:100%; background:var(--bk-surface); border:1px solid var(--bk-line); border-radius:var(--bk-r); padding:16px }
.bk-filters__more form{ display:flex; gap:12px; flex-wrap:wrap; align-items:flex-end }
.bk-filters__more label{ display:block; margin-bottom:4px }
.bk-filters__more select,.bk-filters__more input{ min-width:160px }

/* formulaires */
.bk-form{ max-width:720px; display:grid; gap:18px }
.bk-form fieldset{ border:0; padding:0; margin:0; display:grid; gap:14px }
.bk-form legend,.bk-form__group-title{ font-family:var(--bk-display); font-weight:600; font-size:18px; padding:0; margin:8px 0 2px; border:0; width:auto; color:var(--bk-ink) }
.bk-field{ display:grid; gap:6px }
.bk-field label{ margin:0 }
.bk-field__help{ font-size:13px; color:var(--bk-ink-3) }
.bk-field__error{ font-size:13px; color:var(--bk-danger) }
.bk-field--inline{ display:flex; align-items:center; gap:10px } .bk-field--inline label{ font-weight:400 }
.bk-field input[type="checkbox"],.bk-field input[type="radio"]{ width:18px; height:18px; accent-color:var(--bk-accent); min-height:0 }
.bk-form__row{ display:grid; grid-template-columns:1fr 1fr; gap:14px } @media (max-width:600px){ .bk-form__row{ grid-template-columns:1fr } }
.bk-form__actions{ display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end; padding-top:8px; border-top:1px solid var(--bk-line) }
.bk-form .form-control,.bk-form select,.bk-form input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),.bk-form textarea{ width:100% }
.bk-steps{ display:flex; gap:6px; list-style:none; margin:0 0 20px; padding:0; counter-reset:step }
.bk-steps li{ flex:1; display:flex; align-items:center; gap:8px; font-size:13px; font-weight:600; color:var(--bk-ink-3); padding-bottom:8px; border-bottom:3px solid var(--bk-line); min-width:0 }
.bk-steps li::before{ counter-increment:step; content:counter(step); width:24px; height:24px; border-radius:50%; display:inline-grid; place-items:center; background:var(--bk-line); color:var(--bk-ink-2); flex:none; font-size:12px }
.bk-steps li.is-done{ color:var(--bk-ink-2); border-color:var(--bk-ok) } .bk-steps li.is-done::before{ background:var(--bk-ok); color:#fff; content:"✓" }
.bk-steps li.is-active{ color:var(--bk-ink); border-color:var(--bk-accent) } .bk-steps li.is-active::before{ background:var(--bk-accent); color:#1a1a1a }
.bk-steps li span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
@media (max-width:600px){ .bk-steps li span{ display:none } .bk-steps li.is-active span{ display:inline } }

/* tableau */
.bk-table-wrap{ overflow-x:auto; background:var(--bk-surface); border:1px solid var(--bk-line); border-radius:var(--bk-r) }
.bk-table{ width:100%; border-collapse:collapse; font-size:15px }
.bk-table th{ text-align:left; font-size:12px; text-transform:uppercase; letter-spacing:.08em; color:var(--bk-ink-2); padding:10px 14px; background:var(--bk-bg); border-bottom:1px solid var(--bk-line); white-space:nowrap }
.bk-table td{ padding:10px 14px; border-top:1px solid var(--bk-line); vertical-align:middle }
.bk-table tr:hover td{ background:var(--bk-accent-soft) }
.bk-table .bk-num{ text-align:right }

/* pagination */
.bk-pager{ display:flex; gap:4px; list-style:none; margin:16px 0; padding:0; flex-wrap:wrap; justify-content:center }
.bk-pager--right{ justify-content:flex-end; margin:0 }
.bk-pager li a,.bk-pager li span{ display:inline-grid; place-items:center; min-width:36px; height:36px; padding:0 10px; border-radius:999px; border:1px solid var(--bk-line); background:var(--bk-surface); color:var(--bk-ink-2); font-weight:600; font-size:14px }
.bk-pager li a:hover{ border-color:var(--bk-ink-3); color:var(--bk-ink) }
.bk-pager li.is-active a,.bk-pager li.is-active span{ background:var(--bk-anth); border-color:var(--bk-anth); color:#fff }

/* état vide, alertes */
.bk-empty{ text-align:center; padding:40px 20px; background:var(--bk-surface); border:1px dashed var(--bk-line); border-radius:var(--bk-r); display:grid; gap:10px; justify-items:center; color:var(--bk-ink-2) }
.bk-empty .fa,.bk-empty .biv{ font-size:32px; color:var(--bk-ink-3) }
.bk-empty h3{ margin:0; font-size:18px }
.bk-alert{ border-radius:var(--bk-r-sm); padding:12px 16px; font-size:15px; background:#e8f1fc; color:#1f4f8f; display:flex; gap:10px; align-items:flex-start }
.bk-alert--ok{ background:#e4f5ea; color:#1f6b40 } .bk-alert--warn{ background:var(--bk-accent-soft); color:#7a4700 } .bk-alert--danger{ background:#fdecec; color:#8f2a26 }
.bk-alert h4{ margin:0 0 2px; font-size:15px; color:inherit }
.bk-alert .close{ margin-left:auto; opacity:.6 }

/* hero et bande sombre */
.bk-hero{ position:relative; color:#fff; isolation:isolate; overflow:hidden; background:var(--bk-anth) }
.bk-hero__bg{ position:absolute; inset:0; z-index:-2; background-size:cover; background-position:center 38% }
.bk-hero__tint{ position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,rgba(20,24,28,.62) 0%,rgba(20,24,28,.18) 40%,rgba(20,24,28,.82) 100%),linear-gradient(100deg,rgba(255,121,0,.22),rgba(20,24,28,.35) 70%) }
.bk-hero .bk-wrap{ padding-block:72px 56px; display:grid; gap:20px; max-width:980px; margin-inline:auto }
@media (min-width:860px){ .bk-hero .bk-wrap{ padding-block:96px 80px } }
.bk-hero h1{ color:#fff; font-size:clamp(32px,4.6vw,54px); font-weight:700; letter-spacing:-.02em; max-width:22ch; margin:0; text-shadow:0 2px 20px rgba(0,0,0,.35) }
.bk-hero h1 em{ font-style:normal; color:#ffb36b }
.bk-hero__lead{ margin:0; font-size:clamp(17px,1.6vw,20px); max-width:52ch; color:#eef1f3; text-shadow:0 1px 10px rgba(0,0,0,.35) }
.bk-hero .bk-eyebrow{ color:#ffb36b }
.bk-hero__sub{ font-size:13px; color:#d8dde2; margin:0 } .bk-hero__sub b{ color:#fff }
.bk-hero__credit{ position:absolute; right:16px; bottom:10px; font-size:11px; color:rgba(255,255,255,.6) }
.bk-hero--compact .bk-wrap{ padding-block:40px 32px } .bk-hero--compact h1{ font-size:clamp(26px,3.4vw,40px) }
.bk-hero--page{ background:var(--bk-anth) } .bk-hero--page .bk-wrap{ padding-block:36px 28px; max-width:var(--bk-wrap) }
.bk-dark{ background:var(--bk-anth); color:#fff } .bk-dark h2,.bk-dark h3{ color:#fff } .bk-dark p{ color:#c9d0d6 }
.bk-dark a:not(.bk-btn){ color:#ffb36b }
.bk-cta{ background:var(--bk-accent-soft); color:var(--bk-ink); border-top:1px solid var(--bk-line) } .bk-cta h2{ color:var(--bk-ink) } .bk-cta p{ color:var(--bk-ink-2) }
.bk-cta .bk-btn--ghost{ border-color:var(--bk-ink); color:var(--bk-ink) } .bk-cta .bk-btn--ghost:hover{ background:var(--bk-ink); color:#fff }
.bk-cta .bk-list li b{ color:var(--bk-ink) } .bk-cta .bk-list li span{ color:var(--bk-ink-2) !important }

/* recherche avec suggestions */
.bk-search{ position:relative; max-width:720px }
.bk-search form{ display:flex; background:#fff; border-radius:999px; padding:6px 6px 6px 18px; align-items:center; gap:10px; box-shadow:0 20px 50px -20px rgba(0,0,0,.5) }
.bk-search .fa{ color:var(--bk-ink-3); flex:none }
.bk-search input{ flex:1; min-width:0; border:0 !important; outline:0; font:inherit; font-size:17px; color:var(--bk-ink); background:transparent !important; padding:8px 0 !important; min-height:0 !important; box-shadow:none !important }
.bk-search .bk-btn{ padding:10px 20px }
.bk-sugg{ position:absolute; left:0; right:0; top:calc(100% + 8px); background:#fff; color:var(--bk-ink); border-radius:16px; box-shadow:0 30px 60px -20px rgba(0,0,0,.5); overflow:hidden; z-index:30; text-align:left }
.bk-sugg:empty{ display:none }
.bk-sugg{ max-height:70vh; overflow:auto }
.bk-sugg h1{ display:none }
.bk-sugg h2,.bk-sugg h3,.bk-sugg h5,.bk-sugg .title{ font:600 11px/1.4 var(--bk-body); letter-spacing:.08em; text-transform:uppercase; color:var(--bk-ink-3); margin:0; padding:10px 18px 4px; background:var(--bk-bg); border-top:1px solid #efece6 }
.bk-sugg h2:first-of-type{ border-top:0 }
.bk-sugg ul{ list-style:none; margin:0; padding:0 }
.bk-sugg li{ display:flex; align-items:baseline; gap:8px; padding:8px 18px; border-top:1px solid #efece6; font-size:15px; cursor:pointer }
.bk-sugg li:hover{ background:var(--bk-accent-soft) }
.bk-sugg li a{ color:var(--bk-ink); font-weight:600; min-width:0 }
.bk-sugg li a:hover{ color:var(--bk-accent-ink) }
.bk-sugg li i{ margin-left:auto; font-style:normal; color:var(--bk-ink-3); font-size:13px; text-align:right; flex:none; max-width:45% }
.bk-sugg .alert{ margin:10px 18px }
.bk-sugg .bk-sugg__k{ display:inline-block; font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--bk-ink-3); width:64px; font-weight:600 }

/* ---------- navigation ---------- */
.bk-nav{ position:sticky; top:0; z-index:1030; background:var(--bk-anth); color:#fff; box-shadow:0 1px 0 rgba(255,255,255,.06) }
.bk-nav .bk-wrap{ display:flex; align-items:center; gap:16px; height:64px; max-width:1400px }
.bk-logo{ display:flex; align-items:center; gap:8px; font-family:var(--bk-display); font-weight:700; font-size:22px; letter-spacing:-.01em; color:#fff; flex:none }
.bk-logo:hover{ color:#fff } .bk-logo picture{ display:block } .bk-logo img{ display:block; height:auto; width:220px }
@media (min-width:1700px){ .bk-logo img{ width:300px } }
@media (max-width:860px){ .bk-logo img{ width:180px } }
@media (max-width:1100px){ .bk-logo img{ width:180px } .bk-nav .bk-wrap{ gap:10px } .bk-nav__links{ gap:0 } .bk-nav__links>li>a{ padding:8px 7px; font-size:14px } .bk-nav__search{ flex-basis:140px; min-width:120px } .bk-nav__actions{ gap:6px } .bk-nav__actions .bk-btn--sm{ padding:6px 10px } }
@media (max-width:860px){ .bk-logo img.bk-logo__d{ display:none } .bk-logo img.bk-logo__m{ display:block } }
.bk-nav__links{ list-style:none; margin:0; padding:0; display:flex; gap:4px; font-weight:600; font-size:15px }
.bk-nav__links{ align-self:stretch }
.bk-nav__links>li{ position:relative; display:flex; align-items:center }
.bk-nav__links>li>a{ display:inline-flex; align-items:center; gap:6px; color:#d8dde2; padding:8px 10px; border-radius:999px; height:40px; white-space:nowrap }
.bk-nav__links>li>a:hover,.bk-nav__links>li.is-current>a{ color:#fff; background:rgba(255,255,255,.08) }
.bk-nav__links>li>a .fa-angle-down{ font-size:12px; opacity:.7 }
.bk-nav__sub{ position:absolute; top:calc(100% - 8px); left:0; min-width:230px; background:#fff; color:var(--bk-ink); border-radius:var(--bk-r-sm); box-shadow:var(--bk-shadow-lg); padding:6px; list-style:none; margin:0; display:none; z-index:40 }
/* pont invisible au-dessus du sous-menu : la souris ne traverse jamais de vide */
.bk-nav__sub::before{ content:''; position:absolute; left:0; right:0; top:-14px; height:14px }
.bk-nav__sub li a{ display:block; padding:8px 12px; border-radius:8px; color:var(--bk-ink); font-weight:500; font-size:15px }
.bk-nav__sub li a:hover{ background:var(--bk-accent-soft); color:var(--bk-ink) }
.bk-nav__sub li.bk-nav__sep{ border-top:1px solid var(--bk-line); margin:6px 0 }
.bk-nav__sub li.bk-nav__title{ font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:var(--bk-ink-3); padding:8px 12px 2px; font-weight:600 }
.bk-nav__links>li.is-open>.bk-nav__sub,.bk-nav__links>li:focus-within>.bk-nav__sub{ display:block }
/* au survol : ouverture immédiate, fermeture différée de 300 ms pour pardonner
   un écart de souris en diagonale */
.bk-nav__links>li>.bk-nav__sub{ display:block; visibility:hidden; opacity:0; transition:opacity .12s ease .3s, visibility 0s linear .42s }
.bk-nav__links>li:hover>.bk-nav__sub,.bk-nav__links>li.is-open>.bk-nav__sub,.bk-nav__links>li:focus-within>.bk-nav__sub{ visibility:visible; opacity:1; transition-delay:0s }
.bk-nav__links>li:hover>a{ color:#fff; background:rgba(255,255,255,.08) }
.bk-nav__sub--right{ left:auto; right:0 }
.bk-nav__spacer{ flex:1 }
.bk-nav__search{ position:relative; flex:1 1 200px; min-width:150px; max-width:300px }
.bk-nav__search form{ display:flex; align-items:center; gap:8px; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.18); border-radius:999px; padding:0 8px 0 12px; height:40px; margin:0 }
.bk-nav__search form:focus-within{ background:#fff; border-color:#fff }
.bk-nav__search .fa{ color:#aab4bd; font-size:14px } .bk-nav__search form:focus-within .fa{ color:var(--bk-ink-3) }
.bk-nav__searchbtn{ background:none; border:0; padding:0 4px 0 0; cursor:pointer; display:inline-grid; place-items:center; color:inherit; height:36px }
.bk-nav__searchbtn:hover .fa{ color:#fff } .bk-nav__search form:focus-within .bk-nav__searchbtn:hover .fa{ color:var(--bk-accent-ink) }
.bk-nav__search input{ flex:1; min-width:0; border:0 !important; background:transparent !important; color:#fff; font-size:15px; padding:6px 0 !important; min-height:0 !important; box-shadow:none !important; outline:0 }
.bk-nav__search form:focus-within input{ color:var(--bk-ink) }
.bk-nav__search input::placeholder{ color:#aab4bd }
.bk-nav__search .bk-sugg{ top:calc(100% + 8px); min-width:360px; right:0; left:auto }
.bk-nav__actions{ display:flex; align-items:center; gap:8px; flex:none }
.bk-nav__user{ position:relative }
.bk-nav__user>button{ display:flex; align-items:center; gap:8px; background:transparent; border:0; color:#fff; padding:2px 6px 2px 2px; border-radius:999px; cursor:pointer; font:600 14px var(--bk-body) }
.bk-nav__user>button:hover{ background:rgba(255,255,255,.08) }
.bk-nav__user .bk-nav__sub{ right:0; left:auto; min-width:240px }
.bk-nav__user.is-open .bk-nav__sub{ display:block }
.bk-nav__user .bk-nav__sub form{ margin:0 } .bk-nav__user .bk-nav__sub button{ width:100%; text-align:left; background:none; border:0; padding:8px 12px; border-radius:8px; color:var(--bk-ink); font:500 15px var(--bk-body); cursor:pointer }
.bk-nav__user .bk-nav__sub button:hover{ background:var(--bk-accent-soft) }
.bk-nav__login{ position:relative }
.bk-nav__login .bk-nav__sub{ right:0; left:auto; min-width:300px; padding:16px }
.bk-nav__login.is-open .bk-nav__sub{ display:block }
.bk-nav__login form{ display:grid; gap:10px; margin:0 }
.bk-nav__login form .bk-field{ gap:4px }
.bk-burger{ display:none; background:none; border:0; color:#fff; width:40px; height:40px; font-size:20px; cursor:pointer; border-radius:50% }
.bk-burger:hover{ background:rgba(255,255,255,.08) }
.bk-nav__sports{ display:none; gap:6px; flex:none }
@media (min-width:1600px){ .bk-nav__sports{ display:flex } }
.bk-nav__sports a{ width:34px; height:34px; border-radius:50%; display:inline-grid; place-items:center; color:#c9d0d6; background:rgba(255,255,255,.06); font-size:17px }
.bk-nav__sports a:hover{ background:rgba(255,255,255,.18); color:#fff }
.bk-nav__sports a.is-active{ background:var(--c); color:#111 }

@media (max-width:960px){ .bk-nav__search{ display:none } }
@media (max-width:860px){
  .bk-nav .bk-wrap{ height:58px; gap:12px }
  .bk-nav__links,.bk-nav__actions .bk-btn--ghost,.bk-nav__actions .bk-nav__login{ display:none }
  .bk-burger{ display:inline-grid; place-items:center }
}
/* menu mobile */
.bk-mobile{ position:fixed; inset:0; z-index:1040; background:var(--bk-anth); color:#fff; overflow:auto; padding:16px var(--bk-gutter) 32px; display:none }
.bk-mobile.is-open{ display:block }
.bk-mobile__top{ display:flex; align-items:center; justify-content:space-between; height:42px; margin-bottom:12px }
.bk-mobile__search{ margin-bottom:16px; position:relative }
.bk-mobile__search form{ display:flex; align-items:center; gap:8px; background:#fff; border-radius:999px; padding:4px 6px 4px 14px; margin:0 }
.bk-mobile__search input{ flex:1; min-width:0; border:0 !important; background:transparent !important; font-size:16px; padding:8px 0 !important; min-height:0 !important; box-shadow:none !important; color:var(--bk-ink) }
.bk-mobile__search .bk-sugg{ position:static; margin-top:8px }
.bk-mobile__sports{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:16px }
.bk-mobile ul{ list-style:none; margin:0; padding:0 }
.bk-mobile>ul>li{ border-top:1px solid rgba(255,255,255,.1) }
.bk-mobile>ul>li>a,.bk-mobile>ul>li>span{ display:flex; align-items:center; justify-content:space-between; padding:14px 4px; font:600 17px var(--bk-display); color:#fff }
.bk-mobile ul ul{ padding:0 0 10px 12px; display:grid; gap:2px }
.bk-mobile ul ul a{ display:block; padding:8px 4px; color:#d8dde2; font-size:15px }
.bk-mobile__actions{ display:grid; gap:10px; margin:16px 0 }
.bk-mobile .bk-btn--ghost{ justify-content:center }
.bk-mobile__user{ display:flex; align-items:center; gap:10px; padding:10px 4px 16px; font-weight:600 }
body.bk-noscroll{ overflow:hidden }

/* ---------- pied de page ---------- */
.bk-footer{ background:var(--bk-anth-2); color:#9aa5ae; font-size:14px; margin-top:56px; text-align:left }
main:has(> .bk-dark--flush:last-child) + .bk-footer{ margin-top:0 }
.bk-footer p,.bk-footer ul,.bk-footer h4{ text-align:left }
.bk-footer a{ color:#c9d0d6 } .bk-footer a:hover{ color:#fff }
.bk-footer__grid{ display:grid; grid-template-columns:1.3fr 1fr 1fr 1.2fr; gap:32px; padding-block:40px 36px }
@media (max-width:860px){ .bk-footer__grid{ grid-template-columns:1fr 1fr } } @media (max-width:600px){ .bk-footer__grid{ grid-template-columns:1fr } }
.bk-footer h4{ color:#fff; font-size:14px; text-transform:uppercase; letter-spacing:.08em; margin:0 0 12px }
.bk-footer ul{ list-style:none; margin:0; padding:0; display:grid; gap:8px }
.bk-footer__brand p{ margin:10px 0 0; max-width:36ch; line-height:1.6 }
.bk-footer__brand > a{ display:block; width:160px; margin:0 }
.bk-footer__brand img{ display:block; width:160px; height:auto; margin:0 }
.bk-footer__legal{ font-size:12px; color:#7f8992; max-width:40ch; margin-top:14px !important }
.bk-footer__social{ display:flex; gap:8px; margin-top:14px }
.bk-footer__social a{ width:36px; height:36px; border-radius:50%; display:inline-grid; place-items:center; background:rgba(255,255,255,.08); color:#fff } .bk-footer__social a:hover{ background:var(--bk-accent); color:#1a1a1a }
.bk-footer__news{ display:grid; gap:8px }
.bk-footer__news input{ background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.18); color:#fff; border-radius:999px; padding:9px 14px; min-height:40px; font-size:14px }
.bk-footer__news input:focus{ border-color:var(--bk-accent); box-shadow:none }
.bk-footer__news input::placeholder{ color:#8a949d }
.bk-footer__news #newsletter-feedback{ display:none; font-size:13px }
.bk-footer__news #newsletter-spinner{ display:none }
.bk-footer__bottom{ border-top:1px solid rgba(255,255,255,.08); padding-block:18px; display:flex; flex-wrap:wrap; gap:12px 24px; justify-content:space-between; align-items:center; font-size:13px }
.bk-footer__bottom p{ margin:0; max-width:70ch }
.bk-footer__bottom nav{ display:flex; flex-wrap:wrap; gap:16px }

/* ---------- utilitaires ---------- */
.bk-hide-mobile{ } @media (max-width:600px){ .bk-hide-mobile{ display:none !important } }
.bk-only-mobile{ display:none !important } @media (max-width:600px){ .bk-only-mobile{ display:initial !important } }
.bk-mt-0{ margin-top:0 } .bk-mt-1{ margin-top:8px } .bk-mt-2{ margin-top:16px } .bk-mt-3{ margin-top:24px } .bk-mt-4{ margin-top:32px }
.bk-mb-0{ margin-bottom:0 } .bk-mb-1{ margin-bottom:8px } .bk-mb-2{ margin-bottom:16px } .bk-mb-3{ margin-bottom:24px } .bk-mb-4{ margin-bottom:32px }
.bk-center{ text-align:center } .bk-right{ text-align:right }
.bk-sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap }
.bk-map{ border-radius:var(--bk-r); overflow:hidden; border:1px solid var(--bk-line); min-height:320px }
.bk-map iframe,.bk-map .leaflet-container{ border-radius:var(--bk-r) }
.bk-photo{ border-radius:var(--bk-r); overflow:hidden; display:block; position:relative }
.bk-photo img{ width:100%; display:block }
.bk-gallery{ display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:8px }
.bk-gallery a,.bk-gallery figure{ margin:0; aspect-ratio:1; border-radius:var(--bk-r-sm); overflow:hidden; display:block; background:var(--bk-line) }
.bk-gallery img{ width:100%; height:100%; object-fit:cover; display:block }
.bk-ratio-43{ aspect-ratio:4/3 } .bk-ratio-169{ aspect-ratio:16/9 }
.bk-divider{ border:0; border-top:1px solid var(--bk-line); margin:24px 0 }
.bk-note{ font-size:13px; color:var(--bk-ink-3) }

/* carte d'ensemble (liste des refuges, clubs) */
.bk-carte{ margin:8px 0 24px; position:relative }
.bk-carte__map{ height:clamp(320px,48vh,480px) }
.bk-carte__legende{ list-style:none; margin:10px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:6px 16px; font-size:13px; color:var(--bk-ink-2) }
.bk-carte__legende li{ display:inline-flex; align-items:center; gap:6px }
.bk-carte__legende i{ width:11px; height:11px; border-radius:50%; border:1.5px solid #fff; box-shadow:0 0 0 1px var(--bk-line) }
.bk-carte__note{ position:absolute; bottom:44px; left:50%; transform:translateX(-50%); z-index:500; background:var(--bk-anth); color:#fff; font-size:13px; padding:6px 12px; border-radius:999px; box-shadow:var(--bk-shadow); white-space:nowrap; max-width:90%; overflow:hidden; text-overflow:ellipsis }

/* lien vers la fiche d'une photo, sur ses cartes */
.bk-photo-card__voir{ margin:0; font-size:13px; font-weight:600 }

/* légende de la galerie plein écran (templates/photos/photoswipe.html) */
.bk-pswp-legende{ position:absolute; left:50%; bottom:16px; transform:translateX(-50%); z-index:20; display:flex; align-items:center; gap:14px; max-width:calc(100% - 32px); padding:8px 10px 8px 16px; border-radius:999px; background:rgba(20,24,28,.78); color:#fff; font:500 14px/1.3 var(--bk-body); backdrop-filter:blur(6px) }
.bk-pswp-legende:empty{ display:none }
.bk-pswp-legende{ transition:opacity .2s }
.pswp:not(.pswp--ui-visible) .bk-pswp-legende{ opacity:0; pointer-events:none }
.bk-pswp-legende__titre{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.bk-pswp-legende__lien{ color:#ffb36b; font-weight:600; white-space:nowrap }
.bk-pswp-legende__lien:hover{ color:#fff }
.bk-pswp-legende__coeur{ width:36px; height:36px; border-radius:50%; border:1px solid rgba(255,255,255,.35); background:transparent; color:#fff; cursor:pointer; display:inline-grid; place-items:center; flex:none }
.bk-pswp-legende__coeur .glyphicon{ top:0 }
@media (max-width:600px){ .bk-pswp-legende{ border-radius:14px; flex-wrap:wrap; justify-content:center; gap:6px 12px; bottom:10px } .bk-pswp-legende__titre{ width:100%; text-align:center } }

/* ---------- Ajouts par lot (phase 2) : sous un commentaire au nom du lot ---------- */