:root { --ai-accent:#b1272e; --ai-text:#1f2a33; --ai-muted:#6b7280; --ai-card:#fff; --ai-border:#e5e7eb; }
.ai-annuaire * { box-sizing:border-box; }
.ai-annuaire { color:var(--ai-text); background:transparent; }

.ai-controls {
  display:flex; justify-content:center; align-items:center; gap:12px; flex-wrap:wrap; margin:0 12px 18px;
}
.ai-search {
  width:100%; max-width:480px; padding:10px 12px; font-size:16px;
  border:1px solid #cbd5e1; border-radius:10px; background:#fff;
}
.ai-sort-wrap { display:flex; align-items:center; gap:8px; }
.ai-sort {
  padding:9px 10px; border:1px solid #cbd5e1; border-radius:10px; background:#fff;
}

.ai-list { padding:0 12px 28px; }
.ai-cards { display:flex; flex-wrap:wrap; gap:18px; justify-content:center; max-width:1200px; margin:0 auto; }

.ai-card {
  background:var(--ai-card); border:1px solid var(--ai-border); border-radius:14px; padding:18px;
  flex:1 1 calc(33.333% - 24px); min-width:260px; max-width:420px; display:flex; flex-direction:column; gap:8px; min-height:260px;
  transition:transform .18s ease, box-shadow .18s ease;
}
.ai-card:hover { transform:translateY(-4px); box-shadow:0 6px 22px rgba(0,0,0,.06); }
.ai-card h3 { margin:0 0 6px; font-size:20px; }
.ai-row { margin:2px 0; font-size:15px; color:#374151; line-height:1.45; }
.ai-row i { width:18px; margin-right:8px; color:var(--ai-accent); }

.ai-muted { color:var(--ai-muted); }

.ai-skeleton {
  background:linear-gradient(90deg,#eee,#f7f7f7,#eee);
  background-size:200% 100%;
  animation:ai-sh 1.1s infinite;
  min-height:110px;
}
@keyframes ai-sh { 0%{background-position:200% 0} 100%{background-position:-200% 0} }

@media (max-width: 900px){ .ai-card{flex:1 1 calc(50% - 24px)} }
@media (max-width: 600px){
  .ai-controls{flex-direction:column; align-items:stretch}
  .ai-card{flex:1 1 100%}
}