.ville-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 14px;
      margin-top: 24px;
    }
    .ville-card {
      background: var(--white);
      border: 1px solid var(--gray-200);
      border-radius: var(--radius-md);
      padding: 20px 16px;
      transition: var(--transition);
    }
    .ville-card:hover {
      box-shadow: var(--shadow-md);
      transform: translateY(-3px);
      border-color: rgba(75,191,181,0.3);
    }
    .ville-card h4 { font-size: 0.95rem; margin-bottom: 6px; color: var(--navy); }
    .ville-card p { font-size: 0.82rem; line-height: 1.55; color: var(--gray-500); margin: 0; }
    .territoire-card {
      background: rgba(75,191,181,0.05);
      border: 1px solid rgba(75,191,181,0.15);
      border-radius: var(--radius-md);
      padding: 22px 24px;
      margin-bottom: 16px;
    }
    .territoire-card h4 { font-size: 0.95rem; margin-bottom: 10px; color: var(--navy); }
    .territoire-card p { font-size: 0.87rem; margin: 0; color: var(--gray-500); }
    .zone-badge {
      display: inline-flex; align-items: center; gap: 7px;
      background: rgba(75,191,181,0.1); border: 1px solid rgba(75,191,181,0.3);
      color: var(--gold); border-radius: 50px; padding: 7px 16px;
      font-size: 0.82rem; font-weight: 600;
    }
    @media (max-width: 768px) {
      .ville-grid { grid-template-columns: 1fr 1fr; }
    }
    @media (max-width: 480px) {
      .ville-grid { grid-template-columns: 1fr; }
    }