/* ==========================================================================
   Styles des pages de destination (service / emirat)
   Charge APRES style.css, uniquement sur les pages qui en ont besoin.
   Aucune regle existante n'est modifiee : ce fichier n'ajoute que des classes
   nouvelles, utilisees nulle part ailleurs sur le site.
   ========================================================================== */

/* ---------- Fil d'Ariane ---------- */
.page-crumbs{
  font-size:.78rem;letter-spacing:.06em;color:var(--muted);
  margin-bottom:28px;
}
.page-crumbs a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.page-crumbs span{opacity:.55}
.section--dark .page-crumbs{color:#B9C3D4}

/* ---------- Bloc d'introduction en colonne etroite ---------- */
.page-intro{max-width:820px}
.page-intro p{
  font-size:clamp(1rem,1.2vw,1.15rem);line-height:1.7;
  margin-bottom:22px;
}
.page-intro p:last-child{margin-bottom:0}
.page-intro strong{font-weight:700}

/* ---------- Chiffres cles ---------- */
.page-facts{
  display:grid;gap:clamp(16px,2vw,26px);
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
}
.page-fact{
  padding:clamp(22px,2.4vw,32px);border-radius:var(--radius);
  border:1px solid rgba(14,22,34,.10);background:var(--white);
}
.section--dark .page-fact{
  background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.14);
}
.page-fact strong{
  display:block;font-size:clamp(1.9rem,3.2vw,2.7rem);line-height:1;
  letter-spacing:-.03em;color:var(--copper-ink);margin-bottom:12px;
}
.section--dark .page-fact strong{color:var(--copper-soft)}
.page-fact span{
  display:block;font-size:.74rem;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;line-height:1.45;color:var(--muted);
}
.section--dark .page-fact span{color:#B9C3D4}

/* ---------- Boutons sous le chapô ---------- */
.page-actions{margin-top:38px;display:flex;flex-wrap:wrap;gap:14px}

/* ---------- Liste des zones couvertes ---------- */
.areas{display:flex;flex-wrap:wrap;gap:10px;padding:0;margin:26px 0 0;list-style:none}
.areas li{
  padding:9px 16px;border-radius:100px;
  border:1px solid rgba(14,22,34,.14);font-size:.86rem;line-height:1.3;
}
.section--dark .areas li{border-color:rgba(255,255,255,.2)}

/* ---------- Reference chantier mise en avant ---------- */
.ref-card{
  padding:clamp(24px,3vw,40px);border-radius:var(--radius);
  background:var(--ivory-deep);border-left:3px solid var(--copper);
}
.ref-card h3{margin-bottom:6px}
.ref-card .ref-meta{
  font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--copper-ink);margin-bottom:18px;
}
.ref-card p{margin:0;line-height:1.7;color:var(--muted)}

/* ---------- Renvois vers les autres emirats ---------- */
.next-links{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));margin-top:34px}
.next-links a{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:18px 22px;border-radius:var(--radius);
  border:1px solid rgba(14,22,34,.12);font-weight:600;
  transition:border-color .3s var(--ease),transform .3s var(--ease);
}
.next-links a:hover{border-color:var(--copper);transform:translateY(-2px)}
.next-links a::after{content:"\2192";color:var(--copper-ink);font-size:1.05em}