.cat_hero {
width:min(1200px, 100% - 2*var(--gouttiere));
margin:30px auto 0;
padding:10px 0
}

.cat_hero h1 {
font-size:clamp(28px, 4vw, 42px);
text-transform:uppercase;
color:#1e2042
}

.cat_intro {
max-width:760px;
font-size:16px;
color:#4a4c6a;
line-height:1.6;
margin:8px 0 0
}

#cat_app {
position:relative;
width:min(1200px, 92%);
margin:20px auto 50px
}

.cat_barre {
position:sticky;
display:flex;
z-index:40;
flex-wrap:wrap;
align-items:center;
gap:10px;
background:#f4f5f9;
border-radius:12px;
top:0;
padding:12px
}

.cat_champRecherche { flex:2 1 220px }

.cat_champRecherche input {
width:100%;
background:#fff;
border:1px solid #d7d9e6;
border-radius:8px;
font-size:15px;
color:#1e2042;
padding:11px 14px
}

.cat_champRecherche input:focus-visible {
border-color:#eeb100;
outline:2px solid #eeb100;
outline-offset:1px
}

.cat_filtre { flex:1 1 140px }

.cat_filtre select {
width:100%;
background:#fff;
border:1px solid #d7d9e6;
border-radius:8px;
font-size:14px;
color:#1e2042;
cursor:pointer;
padding:11px 10px
}

.cat_btnGeoloc {
display:inline-flex;
align-items:center;
gap:6px;
background:#1e2042;
border:none;
border-radius:8px;
font-size:14px;
font-weight:600;
color:#fff;
cursor:pointer;
transition:background .2s cubic-bezier(.4,0,.2,1);
padding:11px 16px
}

.cat_btnGeoloc:hover { background:#2c2f5e }

.cat_vues {
display:flex;
background:#fff;
border:1px solid #d7d9e6;
border-radius:8px;
overflow:hidden
}

.cat_btnVue {
background:transparent;
border:none;
font-size:14px;
font-weight:600;
color:#4a4c6a;
cursor:pointer;
padding:11px 16px
}

.cat_btnVue[aria-pressed="true"] {
background:#eeb100;
color:#1e2042
}

.cat_compteur {
font-size:14px;
font-weight:600;
color:#4a4c6a;
margin:16px 4px 12px
}

.cat_grille {
display:grid;
grid-template-columns:repeat(4, minmax(0, 1fr));
gap:20px
}

.cat_chargement .cat_grille {
opacity:.5;
pointer-events:none;
transition:opacity .2s cubic-bezier(.4,0,.2,1)
}

.cat_card {
display:flex;
flex-direction:column;
min-width:0;
background:#fff;
border-radius:14px;
box-shadow:0 4px 14px rgba(30,32,66,.08);
overflow:hidden
}

.cat_cardPhoto {
position:relative;
display:block;
aspect-ratio:8 / 5;
overflow:hidden
}

.cat_cardPhoto img {
display:block;
width:100%;
height:100%;
object-fit:cover;
transition:transform .35s cubic-bezier(.4,0,.2,1)
}

.cat_card:hover .cat_cardPhoto img { transform:scale(1.04) }

.cat_cardPays {
position:absolute;
background:rgba(30,32,66,.85);
border-radius:6px;
font-size:12px;
font-weight:600;
text-transform:uppercase;
color:#fff;
top:10px;
left:10px;
padding:4px 8px
}

.cat_cardDistance {
position:absolute;
background:#eeb100;
border-radius:6px;
font-size:12px;
font-weight:700;
color:#1e2042;
top:10px;
right:10px;
padding:4px 8px
}

.cat_cardCorps {
display:flex;
flex-direction:column;
flex:1;
gap:6px;
padding:14px
}

.cat_cardNom {
font-size:18px;
text-transform:uppercase;
line-height:1.2;
margin:0
}

.cat_cardNom a {
text-decoration:none;
color:#1e2042
}

.cat_cardNom a:hover { color:#e0393e }

.cat_cardVille {
font-size:13px;
color:#4a4c6a;
margin:0
}

.cat_cardNote {
display:flex;
align-items:center;
gap:6px;
font-size:13px;
color:#4a4c6a;
margin:0
}

.cat_etoiles {
font-size:15px;
color:#eeb100;
white-space:nowrap
}

.cat_sansAvis {
font-size:13px;
color:#9a9cb5
}

.cat_cardActions {
display:flex;
flex-wrap:wrap;
gap:8px;
border-top:1px solid #eef0f6;
margin:auto 0 0;
padding:10px 0 0
}

.cat_action {
display:inline-flex;
align-items:center;
gap:4px;
background:#f4f5f9;
border:none;
border-radius:6px;
font-size:12px;
font-weight:600;
text-decoration:none;
color:#1e2042;
cursor:pointer;
transition:background .2s cubic-bezier(.4,0,.2,1);
padding:7px 10px
}

.cat_action:hover { background:#eeb100 }

.cat_voirPlusWrap {
text-align:center;
margin:30px 0 0
}

#cat_voirPlus,
.cat_voirPlusWrap button,
button[data-voir-plus] {
background:#1e2042;
border:none;
border-radius:8px;
font-size:15px;
font-weight:600;
text-transform:uppercase;
color:#fff;
cursor:pointer;
transition:background .2s cubic-bezier(.4,0,.2,1);
padding:13px 34px
}

#cat_voirPlus:hover,
.cat_voirPlusWrap button:hover,
button[data-voir-plus]:hover { background:#e0393e }

.cat_vide {
background:#f4f5f9;
border-radius:14px;
text-align:center;
color:#4a4c6a;
margin:20px 0 0;
padding:40px 20px
}

.cat_videTitre {
font-size:20px;
font-weight:700;
color:#1e2042;
margin:0 0 8px
}

.cat_videCTA {
display:inline-block;
background:#eeb100;
border-radius:8px;
font-weight:700;
text-decoration:none;
color:#1e2042;
margin:16px 0 0;
padding:11px 22px
}

#cat_map {
position:relative;
z-index:1;
width:100%;
height:72vh;
min-height:420px;
overflow:hidden;
background:#e8eaf2;
border-radius:14px;
isolation:isolate
}

.cat_marqueur {
background:#e0393e;
border:2px solid #fff;
border-radius:50%;
box-shadow:0 1px 4px rgba(0,0,0,.4)
}

.cat_toast {
position:fixed;
z-index:200;
background:#1e2042;
border-radius:8px;
box-shadow:0 6px 20px rgba(0,0,0,.3);
font-size:14px;
font-weight:600;
color:#fff;
bottom:24px;
left:50%;
transform:translateX(-50%);
padding:12px 20px
}

.cat_faq {
width:min(1200px, 92%);
margin:0 auto 60px
}

.cat_faq h2 {
font-size:clamp(22px, 3vw, 30px);
text-transform:uppercase;
color:#1e2042;
margin:0 0 16px
}

.cat_faqItem {
background:#fff;
border:1px solid #e5e7f0;
border-radius:10px;
margin:0 0 10px
}

.cat_faqItem summary {
font-size:16px;
font-weight:700;
color:#1e2042;
cursor:pointer;
padding:15px 18px
}

.cat_faqItem p {
color:#4a4c6a;
line-height:1.6;
margin:0;
padding:0 18px 15px
}

.cat_faqCTA {
font-size:15px;
color:#4a4c6a;
margin:20px 0 0
}

.cat_faqCTA a {
font-weight:700;
color:#e0393e
}

.cat_srOnly {
position:absolute;
width:1px;
height:1px;
overflow:hidden;
white-space:nowrap;
clip-path:inset(50%);
margin:-1px
}

@media (prefers-reduced-motion:reduce) {

	.cat_cardPhoto img { transition:none }

	.cat_card:hover .cat_cardPhoto img { transform:none }
}

@media screen and (max-width:1100px) {

	.cat_grille { grid-template-columns:repeat(3, minmax(0, 1fr)) }
}

@media screen and (max-width:820px) {

	.cat_grille { grid-template-columns:repeat(2, minmax(0, 1fr)) }

	.cat_barre { position:static }

	.cat_vues {
	width:100%;
	justify-content:stretch
	}

	.cat_btnVue { flex:1 }
}

@media screen and (max-width:520px) {

	.cat_grille {
	grid-template-columns:minmax(0, 1fr);
	gap:16px
	}

	.cat_btnGeoloc {
	width:100%;
	justify-content:center
	}

	#cat_map {
	height:calc(100dvh - 220px);
	min-height:360px
	}
}

.annu_app {
width:min(1100px, 92%);
margin:0 auto 60px
}

.annu_grille {
display:grid;
grid-template-columns:repeat(auto-fill, minmax(260px, 1fr));
gap:12px;
margin:0 0 26px
}

.annu_card {
position:relative;
display:flex;
align-items:center;
min-width:0;
background:#fff;
border:1px solid #eceef5;
border-radius:14px;
box-shadow:0 3px 10px rgba(30,32,66,.06);
transition:border-color .2s cubic-bezier(.4,0,.2,1), box-shadow .2s cubic-bezier(.4,0,.2,1), transform .2s cubic-bezier(.4,0,.2,1)
}

.annu_card:hover {
border-color:#eeb100;
box-shadow:0 8px 20px rgba(30,32,66,.12);
transform:translateY(-2px)
}

.annu_lien {
display:flex;
flex:1;
align-items:center;
min-width:0;
gap:12px;
text-decoration:none;
color:#1e2042;
padding:12px 14px
}

.annu_drapeau {
width:40px;
height:40px;
object-fit:cover;
border-radius:8px;
flex-shrink:0
}

.annu_drapeauVide {
display:inline-flex;
align-items:center;
justify-content:center;
width:40px;
height:40px;
background:#f4f5f9;
border-radius:8px;
font-size:15px;
color:#9a9cb5;
flex-shrink:0
}

.annu_texte {
display:flex;
flex-direction:column;
flex:1;
min-width:0;
gap:2px
}

.annu_texte strong {
overflow:hidden;
font-size:15.5px;
font-weight:700;
line-height:1.25;
white-space:nowrap;
text-overflow:ellipsis
}

.annu_texte small {
font-size:12px;
color:#9a9cb5
}

.annu_fleche {
font-size:12px;
color:#c8cad8;
transition:transform .2s cubic-bezier(.4,0,.2,1), color .2s cubic-bezier(.4,0,.2,1);
flex-shrink:0
}

.annu_card:hover .annu_fleche {
color:#eeb100;
transform:translateX(3px)
}

.annu_guide {
display:inline-flex;
align-items:center;
justify-content:center;
width:38px;
background:#f4f5f9;
border-radius:0 13px 13px 0;
font-size:13px;
text-decoration:none;
color:#1e2042;
transition:background .2s cubic-bezier(.4,0,.2,1), color .2s cubic-bezier(.4,0,.2,1);
align-self:stretch
}

.annu_guide:hover {
background:#1e2042;
color:#eeb100
}

.annu_groupe {
display:flex;
align-items:center;
gap:10px;
border-bottom:2px solid #eeb100;
font-size:clamp(17px, 2.4vw, 21px);
text-transform:uppercase;
color:#1e2042;
margin:0 0 14px;
padding:0 0 8px
}

.annu_groupe i { color:#eeb100 }

.annu_heroTitre {
display:flex;
align-items:center;
justify-content:center;
gap:14px
}

.annu_heroDrapeau {
width:52px;
height:52px;
object-fit:cover;
border-radius:10px;
box-shadow:0 3px 10px rgba(30,32,66,.18);
flex-shrink:0
}

.annu_heroActions { margin:14px 0 0 }

.annu_clubs {
display:flex;
flex-wrap:wrap;
justify-content:center;
gap:8px;
width:min(1100px, 92%);
margin:0 auto 24px
}

.annu_club {
display:inline-flex;
align-items:center;
gap:8px;
background:#fff;
border:1px solid #eceef5;
border-radius:999px;
font-size:13px;
font-weight:600;
text-decoration:none;
color:#1e2042;
transition:border-color .2s cubic-bezier(.4,0,.2,1);
padding:6px 14px 6px 6px
}

a.annu_club:hover { border-color:#eeb100 }

.annu_club img {
width:30px;
height:30px;
object-fit:contain;
flex-shrink:0
}

@media (prefers-reduced-motion:reduce) {

	.annu_card,
	.annu_fleche { transition:none }

	.annu_card:hover { transform:none }

	.annu_card:hover .annu_fleche { transform:none }
}

@media screen and (max-width:640px) {

	.annu_grille { grid-template-columns:minmax(0, 1fr) }
}