/* Pages villes et fiches clubs WE BJJ, mobile d'abord. */
.wbj-ville { background: #fff; }
body.wbj-annuaire .site-content > .keydesign-container { margin-top: 0; }
.wbj-ville [hidden] { display: none !important; }
.wbj-vhead { padding-top: 14px; }
.wbj-crumbs { font-size: 12.5px; line-height: 18px; color: var(--wbj-muted); margin-bottom: 10px; }
.wbj .wbj-crumbs a { color: var(--wbj-ink); } .wbj-crumbs span { margin: 0 6px; }
.wbj-vhead h1 { font-size: 31px; line-height: 37px; letter-spacing: -.8px; margin: 6px 0 12px; }
.wbj-vhead h1 em { font-style: normal; color: var(--wbj-violet); }
.wbj .wbj-vby { display: flex; align-items: center; gap: 10px; margin: 0 0 12px; font-size: 13px; line-height: 18px; color: var(--wbj-muted); }
.wbj-vby b { color: var(--wbj-ink); font-weight: 600; }
.wbj .wbj-av { width: 28px; height: 28px; border-radius: 50%; border: 1.5px solid var(--wbj-violet); }
.wbj-vintro { font-size: 15.5px; line-height: 25px; } .wbj .wbj-vintro p { margin: 0 0 10px; }
.wbj .wbj-vill { display: none; }

.wbj-vbody { padding-top: 18px; }
.wbj-vtoc { background: var(--wbj-cream); border-radius: 10px; margin: 0 0 8px; }
.wbj-vtoc summary { list-style: none; cursor: pointer; padding: 14px 44px 14px 16px; font-size: 12px; line-height: 16px; letter-spacing: 1.5px; text-transform: uppercase; font-weight: 600; color: var(--wbj-ink); position: relative; }
.wbj-vtoc summary::-webkit-details-marker { display: none; }
.wbj-vtoc summary::after { content: "+"; position: absolute; right: 16px; top: 9px; font-size: 22px; font-weight: 400; color: var(--wbj-violet); letter-spacing: 0; }
.wbj-vtoc[open] summary::after { content: "\2212"; }
.wbj .wbj-vtoc ol { margin: 0; padding: 0 16px 14px 36px; display: grid; gap: 8px; font-size: 14.5px; line-height: 22px; list-style: decimal; }
.wbj .wbj-vtoc a { color: var(--wbj-ink); }
.wbj-vrank-h { padding: 22px 0 4px; }
.wbj-vrank-h h2, .wbj-vmeth h2, .wbj-vfaq h2, .wbj-vlinks h2 { font-size: 26px; line-height: 32px; letter-spacing: -.6px; margin: 4px 0 6px; }
.wbj-vfaq h2 em, .wbj-vlinks h2 em { font-style: normal; color: var(--wbj-violet); }
.wbj .wbj-vrank-h p { margin: 0; font-size: 14px; line-height: 22px; color: var(--wbj-muted); }

.wbj-vclub { background: #fff; border-radius: 10px; box-shadow: 0 2px 18px rgba(16,27,34,.07); padding: 18px 16px; margin: 16px 0 0; scroll-margin-top: calc(var(--wbj-head, 80px) + 12px); }
.wbj-vclub-top { display: grid; grid-template-columns: 32px 56px minmax(0, 1fr); gap: 12px; align-items: center; margin-bottom: 14px; }
.wbj-vlogo { width: 56px; height: 56px; border-radius: 10px; background: #fff; box-shadow: inset 0 0 0 1px var(--wbj-line); display: grid; place-items: center; overflow: hidden; padding: 5px; flex: 0 0 auto; }
.wbj .wbj-vlogo img { width: 100%; height: 100%; object-fit: contain; }
.wbj-vlogo-ini { background: var(--wbj-cream); font-family: "DM Serif Text", serif; font-size: 20px; color: var(--wbj-violet); box-shadow: none; }
.wbj-vlogo-lg { width: 72px; height: 72px; border-radius: 12px; }
.wbj-fhead { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 14px; align-items: center; }
.wbj-fhead h1 { margin: 0 !important; }
/* Le sous-titre reste dans le H1 (mot-clé), affiché plus petit ; le « : » n'est lu que par les moteurs et les lecteurs d'écran. */
.wbj-fsub { display: block; margin-top: 4px; font-family: "DM Sans", system-ui, sans-serif; font-size: 15px; line-height: 22px; letter-spacing: 0; font-weight: 500; color: var(--wbj-muted); }
.wbj-fsub i { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.wbj-vn { font-family: "DM Serif Text", serif; font-size: 18px; line-height: 1; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; background: var(--wbj-violet); color: #fff; }
.wbj-vclub h3 { font-size: 22px; line-height: 27px; letter-spacing: -.45px; }
.wbj-vf { display: inline-flex; align-items: center; gap: 6px; font-family: "DM Sans", system-ui, sans-serif; font-size: 11px; line-height: 16px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; padding: 4px 11px 4px 5px; border-radius: 999px; vertical-align: middle; background: var(--wbj-violet); color: #fff; white-space: nowrap; }
.wbj-vf::before { content: ""; width: 16px; height: 16px; border-radius: 50%; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239b71f7' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 10px no-repeat; flex: 0 0 auto; }
/* Club avec fiche : toute la carte est marquée. */
.wbj .wbj-vclub.is-verified { box-shadow: inset 0 0 0 2px var(--wbj-violet), 0 2px 18px rgba(16,27,34,.07); }
.wbj .wbj-vribbon { margin: 0 0 12px; line-height: 1; }
.wbj-vclub-im { border-radius: 8px; overflow: hidden; background: var(--wbj-cream); margin: 0 0 14px; display: grid; place-items: center; }
.wbj .wbj-vclub-im img { max-height: 220px; width: auto; max-width: 100%; }
.wbj-vclub-tx { font-size: 15.5px; line-height: 26px; } .wbj .wbj-vclub-tx p { margin: 0 0 12px; }
.wbj .wbj-vclub-tx a, .wbj .wbj-answer a, .wbj .wbj-ftext a { color: var(--wbj-ink); font-weight: 500; background: linear-gradient(transparent 68%, rgba(233,187,113,.55) 68%); }
.wbj-vinfos { background: var(--wbj-cream); border-radius: 8px; padding: 14px 16px; margin: 4px 0 14px; }
.wbj .wbj-vinfos-h, .wbj .wbj-finfos h2 { font-family: "DM Sans", system-ui, sans-serif; font-weight: 600; font-size: 12px; line-height: 16px; letter-spacing: 1.4px; text-transform: uppercase; color: var(--wbj-ink); margin: 0 0 10px; }
.wbj .wbj-vinfos dl { margin: 0; display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: 6px 12px; font-size: 14px; line-height: 21px; }
.wbj-vinfos dt { color: var(--wbj-muted); font-weight: 400; } .wbj-vinfos dd { margin: 0; color: var(--wbj-ink); overflow-wrap: anywhere; }
.wbj .wbj-vinfos a { color: var(--wbj-ink); text-decoration: underline; text-underline-offset: 3px; }
.wbj-vact { display: grid; gap: 8px; } .wbj .wbj-vact .wbj-btn { font-size: 13.5px; padding: 16px 12px 15px; white-space: normal; text-align: center; }
.wbj .wbj-vown { margin: 0; font-size: 13px; line-height: 20px; color: var(--wbj-muted); } .wbj .wbj-vown a { color: var(--wbj-ink); text-decoration: underline; text-underline-offset: 3px; }

/* Appel aux clubs : fond sombre (le bloc boutique juste après est violet), vraie hiérarchie surtitre / titre / texte / bouton. */
.wbj-vcta { background: var(--wbj-ink); border-radius: 12px; padding: 26px 20px; color: #fff; margin: 20px 0 0; display: grid; gap: 18px; }
.wbj-vcta small { display: block; font-size: 11px; line-height: 16px; letter-spacing: 1.5px; text-transform: uppercase; font-weight: 600; color: var(--wbj-sand); margin: 0 0 8px; }
.wbj .wbj-vcta p.wbj-vcta-t { font-family: "DM Serif Text", Georgia, serif; font-size: 27px; line-height: 33px; letter-spacing: -.6px; color: #fff; margin: 0 0 10px; }
.wbj-vcta-t em { font-style: normal; background: linear-gradient(transparent 68%, rgba(233,187,113,.55) 68%); }
.wbj .wbj-vcta p { margin: 0; font-size: 15.5px; line-height: 24px; color: rgba(255,255,255,.8); }
.wbj .wbj-vcta p + p { margin-top: 8px; }
.wbj .wbj-vcta p b { color: #fff; }
.wbj .wbj-vcta .wbj-btn { display: flex; width: 100%; font-size: 14px; padding: 17px 20px 16px; background: var(--wbj-sand); color: var(--wbj-ink); }

.wbj-rband { background: var(--wbj-violet); color: #fff; padding-top: 28px; padding-bottom: 28px; margin-top: 28px; }
.wbj .wbj-rband .wbj-cat { color: #fff; }
.wbj .wbj-rband h2 { color: #fff; font-size: 25px; line-height: 31px; letter-spacing: -.55px; margin: 4px 0 14px; }
.wbj-rband .wbj-mid-row { display: flex; gap: 10px; overflow-x: auto; margin-right: -20px; padding: 0 20px 4px 0; scrollbar-width: none; scroll-snap-type: x mandatory; }
.wbj-rband .wbj-mid-row::-webkit-scrollbar { display: none; }
.wbj .wbj-rband .wbj-mid-row .wbj-prod { flex: 0 0 58%; scroll-snap-align: start; }
.wbj-rband .wbj-prod h3 { font-size: 16.5px; line-height: 21px; } .wbj-rband .wbj-pcta { padding: 14px 10px 13px; }
.wbj .wbj-rband .wbj-btn { display: flex; width: 100%; margin-top: 16px; }

.wbj-vmeth, .wbj-vfaq, .wbj-vlinks { padding-top: 36px; scroll-margin-top: calc(var(--wbj-head, 80px) + 12px); }
.wbj .wbj-vmeth dl { margin: 10px 0 0; background: #fff; border-radius: 10px; box-shadow: 0 2px 18px rgba(16,27,34,.07); padding: 4px 16px; display: grid; grid-template-columns: 1fr; font-size: 14.5px; line-height: 22px; }
.wbj-vmeth dt { color: var(--wbj-muted); font-size: 11.5px; letter-spacing: 1.3px; text-transform: uppercase; font-weight: 600; padding-top: 12px; }
.wbj-vmeth dd { margin: 0; padding: 2px 0 12px; color: var(--wbj-ink); border-bottom: 1px solid var(--wbj-line); } .wbj-vmeth dd:last-child { border-bottom: 0; }
.wbj .wbj-vmeth a { color: var(--wbj-ink); text-decoration: underline; text-underline-offset: 3px; }
.wbj .wbj-vfaq-i { margin: 0 0 14px; font-size: 14.5px; line-height: 22px; color: var(--wbj-muted); }
.wbj-vfaq details { background: var(--wbj-cream); border-radius: 8px; margin: 0 0 10px; }
.wbj-vfaq summary { list-style: none; cursor: pointer; padding: 16px 48px 16px 18px; font-size: 16px; line-height: 24px; font-weight: 500; color: var(--wbj-ink); position: relative; }
.wbj-vfaq summary::-webkit-details-marker { display: none; }
.wbj-vfaq summary::after { content: "+"; position: absolute; right: 18px; top: 13px; font-size: 24px; font-weight: 400; color: var(--wbj-violet); }
.wbj-vfaq details[open] summary::after { content: "\2212"; }
.wbj-vfaq .wbj-answer { padding: 0 18px 16px; font-size: 15px; line-height: 25px; } .wbj .wbj-vfaq .wbj-answer p { margin: 0 0 10px; }
.wbj-vlinks { padding-bottom: 56px; }
.wbj-vchips { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.wbj .wbj-vchips a { background: var(--wbj-cream); border-radius: 8px; padding: 11px 14px; font-size: 13.5px; line-height: 18px; color: var(--wbj-ink); }
.wbj .wbj-vchips a:hover { background: #f3eee2; }

/* Questions de FAQ en H3, même apparence */
.wbj .wbj-vfaq summary h3 { display: inline; font: inherit; color: inherit; letter-spacing: inherit; margin: 0; }

/* Présentation repliée */
.wbj-vclub-tx.is-clamped { max-height: 138px; overflow: hidden; position: relative; }
.wbj-vclub-tx.is-clamped::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 48px; background: linear-gradient(rgba(255,255,255,0), #fff); pointer-events: none; }
.wbj .wbj-vmore { background: none; border: 0; padding: 4px 0; margin: 2px 0 12px; font: inherit; font-size: 14px; line-height: 20px; font-weight: 600; color: var(--wbj-ink); text-decoration: underline; text-underline-offset: 4px; cursor: pointer; box-shadow: none; }
.wbj .wbj-vmore:hover { color: var(--wbj-violet); background: none; }

/* Page de garde */
.wbj-hhero { background: var(--wbj-cream); padding-top: 14px; padding-bottom: 30px; }
.wbj-hhero .wbj-wrap { display: block; max-width: 860px; }
.wbj .wbj-hhero h1 { font-size: 34px; line-height: 40px; letter-spacing: -.9px; margin: 6px 0 16px; } .wbj-hhero h1 em { font-style: normal; color: var(--wbj-violet); }
.wbj-hseg { display: inline-grid; grid-template-columns: 1fr 1fr; background: #fff; border-radius: 10px; padding: 4px; margin: 0 0 14px; box-shadow: 0 6px 30px rgba(16,27,34,.07); }
.wbj .wbj-hseg a { padding: 10px 26px 9px; border-radius: 7px; font-size: 12px; line-height: 16px; letter-spacing: 1.5px; text-transform: uppercase; font-weight: 600; color: var(--wbj-ink); text-align: center; text-decoration: none; }
.wbj .wbj-hseg a.is-on { background: var(--wbj-violet); color: #fff; }
.wbj-hsearch { display: grid; gap: 8px; background: #fff; border-radius: 12px; box-shadow: 0 6px 30px rgba(16,27,34,.09); padding: 8px; max-width: 640px; }
.wbj-hfield { display: flex; align-items: center; gap: 10px; padding: 0 12px; height: 52px; color: var(--wbj-muted); margin: 0; border-radius: 8px; }
.wbj-hfield:focus-within { box-shadow: inset 0 0 0 2px var(--wbj-violet); }
.wbj .wbj-hfield input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font: inherit; font-size: 16px; color: var(--wbj-ink); padding: 0; height: 50px; box-shadow: none; }
.wbj .wbj-hsearch .wbj-btn { height: 52px; padding: 0 20px; font-size: 14px; }
.wbj .wbj-hmsg { margin: 10px 0 0; font-size: 14px; line-height: 20px; color: var(--wbj-ink); }
.wbj-hstats { list-style: none; display: flex; gap: 22px; margin: 20px 0 0; padding: 0; }
.wbj-hstats li { margin: 0; font-size: 11.5px; line-height: 16px; letter-spacing: 1.2px; text-transform: uppercase; font-weight: 500; color: var(--wbj-muted); }
.wbj-hstats b { display: block; font-family: "DM Serif Text", Georgia, serif; font-weight: 400; font-size: 30px; line-height: 34px; letter-spacing: -.6px; color: var(--wbj-ink); text-transform: none; }
.wbj-hres, .wbj-hcities { margin-top: 30px; }
.wbj .wbj-hres h2, .wbj .wbj-hcities h2 { font-size: 26px; line-height: 32px; letter-spacing: -.6px; margin: 4px 0 16px; }
.wbj-hres ul { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 6px; }
.wbj-hres li { margin: 0; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2px 12px; background: var(--wbj-cream); border-radius: 8px; padding: 11px 14px; font-size: 14.5px; line-height: 21px; }
.wbj-hres li b, .wbj .wbj-hres li a { color: var(--wbj-ink); font-weight: 600; } .wbj-hres li span { color: var(--wbj-muted); font-size: 13px; }
.wbj-hres li.is-fiche { background: #fff; box-shadow: var(--wbj-sh); } .wbj .wbj-hres li.is-fiche a { text-decoration: underline; text-underline-offset: 4px; } .wbj-hres li.is-fiche span { color: var(--wbj-vdark); font-weight: 600; }
.wbj-hgrid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
.wbj .wbj-hcity { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 18px; gap: 14px; align-items: center; background: #fff; border-radius: 10px; box-shadow: 0 6px 30px rgba(16,27,34,.07); padding: 13px 16px; text-decoration: none; color: var(--wbj-text); transition: transform .2s, box-shadow .2s; }
.wbj .wbj-hcity[hidden] { display: none; }
.wbj .wbj-hcity:hover { transform: translateY(-3px); box-shadow: var(--wbj-sh); }
.wbj-hct { display: grid; min-width: 0; } .wbj-hct small { display: none; }
.wbj-hct b { font-family: "DM Serif Text", Georgia, serif; font-weight: 400; font-size: 20px; line-height: 25px; letter-spacing: -.3px; color: var(--wbj-ink); }
.wbj-hct > span { font-size: 13px; line-height: 18px; color: var(--wbj-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wbj-hct em { font-style: normal; font-size: 12.5px; line-height: 17px; font-weight: 600; color: var(--wbj-violet); } .wbj-hct em:empty { display: none; }
.wbj-hlogos { display: none; } .wbj-harr { grid-row: 1; grid-column: 2; color: var(--wbj-ink); opacity: .35; transition: transform .2s, opacity .2s; } .wbj-hcity:hover .wbj-harr { opacity: 1; transform: translateX(3px); }
.wbj .wbj-hcity.is-top { padding: 16px 18px; }
.wbj-hcity.is-top .wbj-hcity.is-top .wbj-hct small { display: block; font-size: 10.5px; line-height: 14px; letter-spacing: 1.4px; text-transform: uppercase; color: var(--wbj-violet); font-weight: 600; }
.wbj-hcity.is-top .wbj-hct b { font-size: 25px; line-height: 30px; letter-spacing: -.55px; }
.wbj-hcity.is-top .wbj-hlogos { grid-column: 1 / -1; display: flex; gap: 6px; padding-top: 12px; border-top: 1px solid var(--wbj-line); }
.wbj .wbj-hlogos img { width: 40px; height: 40px; border-radius: 8px; object-fit: contain; background: #fff; box-shadow: inset 0 0 0 1px var(--wbj-line); padding: 3px; }
.wbj .wbj-hcity.is-near { box-shadow: inset 0 0 0 2px var(--wbj-violet), 0 6px 30px rgba(16,27,34,.07); }
.wbj-hub .wbj-vcta { margin-top: 34px; }

/* Clubs hors classement */
.wbj-vextra, .wbj-vothers { margin-top: 36px; }
.wbj .wbj-vextra h2, .wbj .wbj-vothers h2 { font-size: 24px; line-height: 30px; letter-spacing: -.5px; margin: 0 0 6px; }
.wbj .wbj-vsub { margin: 0 0 14px; font-size: 14px; line-height: 21px; color: var(--wbj-muted); }
.wbj-vxc { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 12px 14px; align-items: center; background: #fff; border-radius: 12px; box-shadow: var(--wbj-sh); padding: 16px; margin-bottom: 12px; }
.wbj .wbj-vxc h3 { font-size: 20px; line-height: 26px; margin: 0; } .wbj .wbj-vxc p { margin: 3px 0 0; font-size: 14px; line-height: 21px; }
.wbj-vxc .wbj-vact { grid-column: 1 / -1; margin: 0; }
.wbj-vothers ul { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 6px; }
.wbj-vothers li { margin: 0; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2px 12px; background: var(--wbj-cream); border-radius: 8px; padding: 11px 14px; font-size: 14.5px; line-height: 21px; }
.wbj-vothers li b { color: var(--wbj-ink); font-weight: 600; } .wbj-vothers li span { color: var(--wbj-muted); font-size: 13px; }

/* Fiche club */
.wbj-finfos2 { margin-top: 22px; }
.wbj .wbj-finfos2 h2 { font-size: 24px; line-height: 30px; letter-spacing: -.5px; margin: 0 0 12px; }
.wbj-ftiles { display: grid; gap: 10px; }
.wbj-ftile { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 12px; align-items: start; background: var(--wbj-cream); border-radius: 10px; padding: 14px; }
.wbj-fi { width: 40px; height: 40px; border-radius: 50%; background: #fff; color: var(--wbj-violet); display: grid; place-items: center; flex: 0 0 auto; }
.wbj-ftile small, .wbj-fact small { display: block; font-size: 11px; line-height: 15px; letter-spacing: 1.3px; text-transform: uppercase; font-weight: 600; color: var(--wbj-muted); margin-bottom: 3px; }
.wbj .wbj-ftile p { margin: 0; font-size: 15.5px; line-height: 23px; color: var(--wbj-ink); }
.wbj .wbj-ftile a { display: inline-block; margin-top: 4px; font-size: 13.5px; line-height: 18px; font-weight: 600; color: var(--wbj-ink); text-decoration: underline; text-underline-offset: 4px; }
.wbj-fchips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 3px; }
.wbj-fchips span { background: #fff; border-radius: 6px; padding: 5px 9px; font-size: 13px; line-height: 18px; color: var(--wbj-ink); font-weight: 500; }
.wbj-factions { display: grid; gap: 8px; margin-top: 10px; }
.wbj .wbj-fact { display: flex; align-items: center; gap: 12px; border-radius: 10px; padding: 12px 14px; box-shadow: inset 0 0 0 1.5px var(--wbj-line); color: var(--wbj-ink); font-size: 15px; line-height: 21px; font-weight: 600; text-decoration: none; transition: box-shadow .15s; overflow-wrap: anywhere; }
.wbj .wbj-fact:hover { box-shadow: inset 0 0 0 1.5px var(--wbj-ink); }
.wbj .wbj-fact-main { background: var(--wbj-ink); color: #fff; box-shadow: none; }
.wbj .wbj-fact-main small { color: var(--wbj-sand); } .wbj-fact-main .wbj-fi { background: rgba(255,255,255,.12); color: #fff; }
.wbj-fbadges { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin: 0 0 6px; }
.wbj .wbj-vrk { font-size: 10.5px; line-height: 14px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; padding: 3px 7px; border-radius: 5px; background: var(--wbj-ink); color: #fff; }
.wbj-fphoto { border-radius: 10px; overflow: hidden; background: var(--wbj-cream); display: grid; place-items: center; margin-bottom: 16px; }
.wbj .wbj-fphoto img { max-height: 320px; width: auto; max-width: 100%; }
.wbj-ftext { font-size: 16px; line-height: 28px; } .wbj .wbj-ftext p { margin: 0 0 14px; }
.wbj-finfos { margin-top: 18px; } .wbj-flinks { display: flex; gap: 8px; flex-wrap: wrap; margin: 14px 0 0; }
.wbj .wbj-flinks .wbj-btn { font-size: 12.5px; padding: 13px 14px 12px; }
.wbj-fside { margin-top: 24px; scroll-margin-top: calc(var(--wbj-head, 80px) + 12px); }
.wbj-essai { background: var(--wbj-cream); border-radius: 10px; padding: 20px 16px; display: grid; gap: 10px; margin: 0; }
.wbj .wbj-essai h2 { font-size: 23px; line-height: 29px; letter-spacing: -.5px; } .wbj .wbj-essai p { margin: 0; font-size: 14px; line-height: 21px; }
.wbj .wbj-essai label { display: grid; gap: 5px; font-size: 13px; line-height: 18px; font-weight: 500; color: var(--wbj-ink); }
.wbj .wbj-essai input, .wbj .wbj-essai select, .wbj .wbj-essai textarea { width: 100%; min-height: 48px; border-radius: 8px; border: 1.5px solid #e4dfd3; padding: 10px 14px; background: #fff; font: inherit; font-size: 16px; color: var(--wbj-ink); box-shadow: none; margin: 0; }
.wbj .wbj-essai input:focus, .wbj .wbj-essai select:focus, .wbj .wbj-essai textarea:focus { outline: 2px solid var(--wbj-violet); outline-offset: 1px; }
.wbj-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.wbj .wbj-essai button { cursor: pointer; font-size: 14px; padding: 17px 18px 16px; }
/* Le thème repeint les boutons de formulaire au survol et au focus : on garde nos couleurs. */
.wbj .wbj-essai button.wbj-btn, .wbj .wbj-essai button.wbj-btn:hover, .wbj .wbj-essai button.wbj-btn:focus, .wbj .wbj-essai button.wbj-btn:active { background: var(--wbj-sand) !important; color: var(--wbj-ink) !important; border: 0 !important; }
.wbj .wbj-essai button.wbj-btn:hover { box-shadow: 0 8px 24px rgba(233,187,113,.45); transform: translateY(-1px); }
.wbj .wbj-essai button.wbj-btn:focus-visible { outline: 2px solid var(--wbj-violet); outline-offset: 2px; }
.wbj .wbj-essai button.wbj-btn:disabled { opacity: .6; cursor: default; }
.wbj .wbj-essai-note { font-size: 12.5px !important; line-height: 18px !important; color: var(--wbj-muted); }
.wbj .wbj-essai-msg { font-weight: 600; color: #1f7a4d; } .wbj .wbj-essai-msg.is-err { color: #b54708; }
.wbj-fbar { position: sticky; bottom: 0; z-index: 90; background: #fff; border-top: 1px solid var(--wbj-line); box-shadow: 0 -8px 30px rgba(16,27,34,.1); padding: 10px 12px calc(10px + env(safe-area-inset-bottom)); }
.wbj .wbj-fbar .wbj-btn { display: flex; width: 100%; font-size: 14px; padding: 16px 12px 15px; }

@media (min-width: 900px) {
    .wbj-vhead { padding-top: 40px; }
    .wbj-vhead .wbj-wrap { display: grid; grid-template-columns: minmax(0, 1fr) 230px; gap: 56px; align-items: center; }
    .wbj-fiche .wbj-vhead .wbj-wrap { grid-template-columns: minmax(0, 1fr); }
    .wbj .wbj-vill { display: block; width: 100%; max-width: 230px; height: auto; mix-blend-mode: multiply; justify-self: end; }
    .wbj-crumbs { font-size: 13px; margin-bottom: 16px; }
    .wbj-vhead h1 { font-size: 56px; line-height: 64px; letter-spacing: -1.5px; margin: 10px 0 18px; }
    .wbj .wbj-vby { font-size: 14px; } .wbj .wbj-av { width: 40px; height: 40px; border-width: 2px; }
    .wbj-vintro { font-size: 17px; line-height: 29px; }
    .wbj-vbody { padding-top: 40px; } .wbj-vbody > .wbj-wrap { max-width: 860px; } .wbj-vbody > .wbj-wrap.wbj-fgrid { max-width: 1185px; }
    .wbj-vrank-h h2, .wbj-vmeth h2, .wbj-vfaq h2, .wbj-vlinks h2 { font-size: 40px; line-height: 48px; letter-spacing: -1.08px; }
    .wbj-vclub { padding: 32px; margin-top: 24px; }
    .wbj-vclub-top { grid-template-columns: 40px 72px minmax(0, 1fr); gap: 16px; margin-bottom: 18px; }
    .wbj-vlogo { width: 72px; height: 72px; }
    .wbj-vn { width: 40px; height: 40px; font-size: 22px; }
    .wbj-vlogo-lg { width: 96px; height: 96px; }
    .wbj-fhead { grid-template-columns: 96px minmax(0, 1fr); gap: 22px; } .wbj-fsub { font-size: 18px; line-height: 26px; margin-top: 6px; }
    .wbj-vclub h3 { font-size: 30px; line-height: 37px; letter-spacing: -.75px; }
    .wbj-vclub-tx { font-size: 16px; line-height: 28px; }
    .wbj .wbj-vinfos dl { grid-template-columns: 120px minmax(0, 1fr); font-size: 15px; line-height: 23px; }
    .wbj-vact { display: flex; } .wbj .wbj-vact .wbj-btn { font-size: 14px; padding: 16px 22px 15px; }
    .wbj-vcta { padding: 40px 44px; margin-top: 32px; grid-template-columns: minmax(0, 1fr) auto; gap: 40px; align-items: center; }
    .wbj .wbj-vcta p.wbj-vcta-t { font-size: 36px; line-height: 43px; letter-spacing: -.95px; margin-bottom: 12px; }
    .wbj .wbj-vcta p { font-size: 17px; line-height: 27px; }
    .wbj .wbj-vcta .wbj-btn { display: inline-flex; width: auto; font-size: 15px; padding: 19px 26px 18px; }
    .wbj-rband { padding-top: 56px; padding-bottom: 64px; margin-top: 56px; }
    .wbj .wbj-rband h2 { font-size: 40px; line-height: 48px; letter-spacing: -1.08px; margin: 8px 0 28px; }
    .wbj-rband .wbj-mid-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; overflow: visible; margin-right: 0; padding: 0; }
    .wbj .wbj-rband .wbj-mid-row .wbj-prod { flex: none; }
    .wbj .wbj-rband .wbj-btn { display: inline-flex; width: auto; margin-top: 28px; }
    .wbj-vmeth, .wbj-vfaq, .wbj-vlinks { padding-top: 64px; } .wbj-vlinks { padding-bottom: 96px; }
    .wbj .wbj-vmeth dl { grid-template-columns: 150px minmax(0, 1fr); padding: 8px 28px; font-size: 15.5px; line-height: 25px; }
    .wbj-vmeth dt { padding: 16px 0; border-bottom: 1px solid var(--wbj-line); } .wbj-vmeth dd { padding: 14px 0; } .wbj-vmeth dt:last-of-type { border-bottom: 0; }
    .wbj-vfaq summary { padding: 20px 56px 20px 28px; font-size: 18px; line-height: 28px; } .wbj-vfaq .wbj-answer { padding: 0 28px 22px; font-size: 16px; line-height: 28px; }
    .wbj-hhero { padding-top: 40px; padding-bottom: 56px; } .wbj-hhero { text-align: center; } .wbj-hhero .wbj-crumbs { justify-content: center; } .wbj-hsearch { margin: 0 auto; text-align: left; } .wbj-hstats { justify-content: center; }
    .wbj .wbj-hhero h1 { font-size: 54px; line-height: 61px; letter-spacing: -1.5px; margin: 10px 0 24px; }
    .wbj-hsearch { grid-template-columns: minmax(0, 1fr) auto; } .wbj-hstats { gap: 40px; margin-top: 28px; } .wbj-hstats b { font-size: 38px; line-height: 42px; }
    .wbj-hres, .wbj-hcities { margin-top: 56px; } .wbj .wbj-hres h2, .wbj .wbj-hcities h2 { font-size: 38px; line-height: 45px; letter-spacing: -1px; margin: 6px 0 26px; }
    .wbj-hgrid { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 16px; } .wbj .wbj-hcity { grid-column: span 2; } .wbj .wbj-hcity.is-top { padding: 24px; gap: 16px 18px; }
    .wbj-hcity.is-top .wbj-hct b { font-size: 30px; line-height: 36px; } .wbj-hcity.is-top .wbj-hlogos { padding-top: 16px; gap: 8px; } .wbj .wbj-hlogos img { width: 46px; height: 46px; }
    .wbj-hres ul { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 12px; }
    .wbj-hub .wbj-vbody > .wbj-wrap { max-width: 1185px; } .wbj-hub .wbj-vmeth, .wbj-hub .wbj-vfaq { max-width: 860px; margin-left: auto; margin-right: auto; }
    .wbj-vothers ul { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 12px; } .wbj .wbj-vextra h2, .wbj .wbj-vothers h2 { font-size: 30px; line-height: 37px; }
    .wbj-vxc { grid-template-columns: auto minmax(0, 1fr) auto; padding: 18px 20px; } .wbj-vxc .wbj-vact { grid-column: auto; }
    .wbj-ftiles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } .wbj-ftile-w { grid-column: 1 / -1; }
    .wbj-factions { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .wbj .wbj-finfos2 h2 { font-size: 30px; line-height: 37px; }
    .wbj-fgrid { display: grid; grid-template-columns: minmax(0, 1fr) 400px; gap: 64px; align-items: start; }
    .wbj-fside { margin-top: 0; position: sticky; top: calc(var(--wbj-head, 91px) + 16px); }
    .wbj-essai { padding: 28px; }
    .wbj-fbar { display: none; }
}
