/* Pages légales des pays (fr/, be/, ch/, lu/) — casinosansdepot.com
   Une colonne de texte et, à droite, les notes qui citent la source de chaque passage,
   comme dans un code annoté. Sous 900 px, chaque note passe sous son paragraphe. */

.pays {
  --pays-encre: #231f20;
  --pays-rouge: #b50303;
  --pays-gris: #585e66;
  --pays-filet: #d9dce1;
  --pays-brume: #f3f4f6;
  --pays-lien: #0a5a8f;
  --pays-aide: #1d6a40;
  --pays-aide-fond: #edf6f0;
  --pays-aide-filet: #cbe3d4;
  --pays-serif: Georgia, "Iowan Old Style", "Palatino Linotype", "Book Antiqua", serif;
  max-width: 70rem;
  margin: 0 auto 3rem;
  padding: 1.6rem 2.4rem 2.2rem;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 1px 3px rgba(35, 31, 32, 0.06);
  color: var(--pays-encre);
  font-size: 1.0625rem;
  line-height: 1.65;
}

.pays p, .pays li, .pays dt, .pays dd { color: var(--pays-encre); line-height: 1.65; }
.pays p { margin: 0 0 1.05rem; font-size: 1.0625rem; }
.pays img { max-width: 100%; height: auto; margin: 0.4rem 0 1.2rem; border-radius: 6px; }

/* liens : soulignés, comme dans un texte de référence */
.pays a { font-size: inherit; color: var(--pays-lien); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 2px; }
.pays a:hover { color: var(--pays-rouge); }
.pays a:focus-visible { outline: 2px solid var(--pays-rouge); outline-offset: 2px; border-radius: 2px; }

/* titres : la serif marque le registre du texte de loi */
.pays h1, .pays h2, .pays h3, .pays .pays-reponse, .pays .pays-aide-tel {
  font-family: var(--pays-serif) !important;
}
.pays h1 {
  font-size: clamp(1.75rem, 1.2rem + 2.2vw, 2.6rem);
  line-height: 1.18;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--pays-encre);
  margin: 1.2rem 0 0.6rem;
}
.pays h2 {
  font-size: clamp(1.35rem, 1.15rem + 0.8vw, 1.65rem);
  line-height: 1.25;
  font-weight: 700;
  color: var(--pays-encre);
  margin: 2.4rem 0 0.75rem;
}
.pays h3 { font-size: 1.2rem; line-height: 1.3; font-weight: 700; color: var(--pays-encre); margin: 1.6rem 0 0.5rem; }

/* drapeaux en CSS : aucune image, aucune police externe */
.pays .drapeau {
  display: inline-block;
  width: 1.3em;
  height: 0.87em;
  margin-right: 0.42em;
  vertical-align: 0.02em;
  border-radius: 2px;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.14);
}
.pays .drapeau--fr { background: linear-gradient(90deg, #002654 0 33.34%, #fff 33.34% 66.67%, #ce1126 66.67%); }
.pays .drapeau--be { background: linear-gradient(90deg, #000 0 33.34%, #fdda24 33.34% 66.67%, #ef3340 66.67%); }
.pays .drapeau--lu { background: linear-gradient(180deg, #ed2939 0 33.34%, #fff 33.34% 66.67%, #00a1de 66.67%); }
.pays .drapeau--ch { position: relative; width: 0.87em; background: #da291c; }
.pays .drapeau--ch::before, .pays .drapeau--ch::after {
  content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); background: #fff;
}
.pays .drapeau--ch::before { width: 62.5%; height: 18.75%; }
.pays .drapeau--ch::after { width: 18.75%; height: 62.5%; }

/* tête de page */
.pays .pays-signature { font-size: 0.9rem; color: var(--pays-gris); margin: 0 0 1.4rem; }
.pays .pays-reponse {
  font-size: clamp(1.18rem, 1.02rem + 0.6vw, 1.38rem);
  line-height: 1.45;
  max-width: 44rem;
  margin: 0 0 1.5rem;
  padding: 0.15rem 0 0.15rem 1.05rem;
  border-left: 3px solid var(--pays-rouge);
}
.pays .pays-intro { max-width: 44rem; }

/* l'essentiel en un coup d'œil */
.pays .pays-bref {
  margin: 2rem 0 0.75rem;
  padding: 1.2rem 1.5rem 0.6rem;
  background: var(--pays-brume);
  border-radius: 10px;
}
.pays .pays-bref h2 { margin: 0 0 0.6rem; font-size: 1.2rem; }
.pays .pays-bref dl {
  margin: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 2.2rem;
}
.pays .pays-bref dl > div {
  display: grid;
  grid-template-columns: 9.25rem minmax(0, 1fr);
  column-gap: 0.9rem;
  padding: 0.62rem 0;
  border-top: 1px solid var(--pays-filet);
}
.pays .pays-bref dt { font-weight: 700; font-size: 0.95rem; }
.pays .pays-bref dd { margin: 0; font-size: 0.95rem; }

/* corps : texte à gauche, notes de source à droite */
.pays .pays-corps {
  display: grid;
  grid-template-columns: minmax(0, 44rem) minmax(0, 16rem);
  column-gap: 3rem;
  align-items: start;
}
.pays .pays-corps > * { grid-column: 1; }
.pays .pays-corps > .pays-note { grid-column: 2; }
.pays .pays-corps > .pays-aide, .pays .pays-corps > .pays-refs { grid-column: 1 / -1; }

.pays .pays-note {
  margin: 0.25rem 0 1rem;
  padding-left: 0.85rem;
  border-left: 1px solid var(--pays-filet);
  font-size: 0.84rem;
  line-height: 1.5;
  color: var(--pays-gris);
}
.pays .pays-note .signe { font-family: var(--pays-serif) !important; color: var(--pays-rouge); margin-right: 0.1em; }
.pays .pays-note a { color: inherit; text-decoration-color: #b9bec6; }

.pays ul, .pays ol { margin: 0 0 1.2rem; padding-left: 1.25rem; }
.pays li { margin-bottom: 0.45rem; font-size: 1.0625rem; }

/* une vraie suite d'étapes : la seule numérotation de la page */
.pays .pays-etapes { list-style: none; padding: 0; counter-reset: etape; }
.pays .pays-etapes li { counter-increment: etape; position: relative; padding-left: 2.5rem; margin-bottom: 0.85rem; }
.pays .pays-etapes li::before {
  content: counter(etape);
  position: absolute; left: 0; top: 0.12em;
  width: 1.65rem; height: 1.65rem;
  border: 1.5px solid var(--pays-rouge); border-radius: 50%;
  color: var(--pays-rouge);
  font: 700 0.9rem/1.6rem var(--pays-serif);
  text-align: center;
}

/* aide : le numéro avant tout */
.pays .pays-aide {
  margin: 1.6rem 0 0.5rem;
  padding: 1.35rem 1.6rem 0.9rem;
  background: var(--pays-aide-fond);
  border: 1px solid var(--pays-aide-filet);
  border-radius: 10px;
}
.pays .pays-aide h3 { margin: 0 0 0.2rem; color: var(--pays-aide); font-size: 1.05rem; }
.pays .pays-aide-tel {
  display: inline-block;
  margin: 0.1rem 0 0.35rem;
  font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.1rem);
  line-height: 1.2;
  font-weight: 700;
  color: var(--pays-aide);
  text-decoration: none;
}
.pays a.pays-aide-tel:hover, .pays a.pays-aide-tel:focus-visible { color: var(--pays-aide); text-decoration: underline; }
.pays .pays-aide ul { margin: 0.6rem 0 0.4rem; padding: 0; list-style: none; border-top: 1px solid var(--pays-aide-filet); }
.pays .pays-aide li { margin: 0; padding: 0.5rem 0; border-bottom: 1px solid var(--pays-aide-filet); font-size: 0.98rem; }
.pays .pays-aide li:last-child { border-bottom: 0; }

/* références */
.pays .pays-refs { margin-top: 0.5rem; }
.pays .pays-refs ul { list-style: none; padding: 0; columns: 2 19rem; column-gap: 2.5rem; }
.pays .pays-refs li { break-inside: avoid; margin: 0; padding: 0.5rem 0; border-top: 1px solid var(--pays-filet); font-size: 0.95rem; line-height: 1.5; }

.pays .pays-fin { margin-top: 2rem; font-size: 0.92rem; color: var(--pays-gris); }

@media (max-width: 900px) {
  .pays .pays-corps { display: block; }
  .pays .pays-note { margin: -0.35rem 0 1.25rem; }
}
@media (max-width: 720px) {
  .pays { font-size: 1rem; padding: 1rem 0.95rem 1.4rem; border-radius: 8px; }
  .pays p, .pays li { font-size: 1rem; }
  .pays .pays-bref { padding: 1rem 1.1rem 0.4rem; }
  .pays .pays-bref dl { grid-template-columns: 1fr; }
  .pays .pays-bref dl > div { grid-template-columns: 1fr; row-gap: 0.1rem; }
  .pays .pays-aide { padding: 1.1rem 1.1rem 0.7rem; }
}
