/* =====================================================================
 * Semtopic — RankMap : en-tête chiffré, carte agrandie, export, analyse
 * textuelle. Complète styles.css, site.css et keywords.css.
 * ===================================================================== */

/* Carte plus large que dans l'audit : c'est le sujet de la page. */
.rankmap .geo-grid { grid-template-columns: minmax(0, 1.75fr) minmax(280px, 1fr); }

/* En-tête chiffré */
.rm-head {
  position: relative; overflow: hidden;
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
  gap: 28px; align-items: end;
}
.rm-head > *:not(.identity-pattern) { position: relative; }
.rm-id { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.rm-head .identity-domain { font-size: clamp(34px, 3.8vw, 56px); overflow-wrap: break-word; }
.rm-scope { margin: 0; font-family: var(--f-mono); font-size: 13px; color: var(--granit); }
.rm-figs {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px;
}
.rm-figs > div {
  background: var(--neige-2); border-radius: 16px; padding: 12px 14px;
  display: flex; flex-direction: column; gap: 2px; min-width: 0;
}
.rm-figs b {
  font-family: var(--f-serif); font-weight: 400; font-size: 30px; line-height: 1.05;
}
.rm-figs b small { font-family: var(--f-mono); font-size: 13px; color: var(--granit); margin-left: 2px; }
.rm-figs span { font-size: 13px; color: var(--granit); line-height: 1.3; }

/* Export */
.rm-export {
  display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  gap: 28px; align-items: center;
}
.rm-export-text p:last-child { margin: 12px 0 0; font-size: 16px; line-height: 1.55; color: #3f5446; }
.rm-export-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.rm-export-note { flex-basis: 100%; font-family: var(--f-mono); font-size: 13px; color: var(--granit); }

/* Analyse textuelle */
.rm-analysis { display: grid; gap: 20px; grid-template-columns: minmax(0, 1fr); }
.rm-synth { display: flex; flex-direction: column; gap: 12px; }
.rm-synth .card-title { color: #eef0e4; margin-bottom: 4px; }
.rm-synth p { margin: 0; font-size: 17px; line-height: 1.6; color: #dfe4d5; max-width: 980px; text-wrap: pretty; }
.rm-synth p:first-of-type { font-size: 20px; color: #eef0e4; }
.rm-card .kw-read { margin-bottom: 18px; }

.rm-table-wrap { overflow-x: auto; }
.rm-table { width: 100%; min-width: 720px; border-collapse: collapse; font-size: 15px; }
.rm-table th {
  text-align: left; font-family: var(--f-mono); font-size: 12px; font-weight: 500;
  letter-spacing: 0.08em; text-transform: uppercase; color: var(--granit);
  padding: 6px 12px 10px 0; border-bottom: var(--hair) solid var(--sapin);
  white-space: nowrap;
}
.rm-table td { padding: 11px 12px 11px 0; border-bottom: 1px dashed var(--pierre); vertical-align: middle; }
.rm-table .num { text-align: right; font-family: var(--f-mono); font-size: 14px; white-space: nowrap; }
.rm-table th.num { text-align: right; }
.rm-table .rank { color: var(--c1); font-family: var(--f-serif); font-size: 18px; text-align: left; }
.rm-table small { font-family: var(--f-mono); font-size: 12px; }
.rm-table tr.is-empty td { color: var(--granit); }
.rm-table tr.is-empty b { font-weight: 600; }
.rm-share { min-width: 180px; }
.rm-share > div { display: flex; align-items: center; gap: 10px; }
.rm-share > div > span:last-child { font-family: var(--f-mono); font-size: 13px; min-width: 52px; text-align: right; }

.rm-bar {
  flex: 1; display: block; height: 8px; min-width: 60px;
  border-radius: var(--r-pill); background: var(--rail); overflow: hidden;
}
.rm-bar > span { display: block; height: 100%; border-radius: var(--r-pill); background: var(--sapin); }
.rm-bar.tier-gt2 > span { background: var(--c1); }
.rm-bar.tier-gt3 > span { background: oklch(0.76 0.08 145); }
.rm-bar.tier-gt4 > span { background: var(--pierre-2); }

.rm-tiers { display: flex; flex-direction: column; }
.rm-tier {
  display: grid; grid-template-columns: minmax(150px, 0.9fr) minmax(0, 2fr) 110px 170px;
  gap: 16px; align-items: center; padding: 12px 0; border-top: 1px dashed var(--pierre);
}
.rm-tier:first-child { border-top: 0; }
.rm-tier-name { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; font-size: 15px; }
.rm-tier-n { font-family: var(--f-mono); font-size: 14px; text-align: right; }
.rm-tier-s { font-family: var(--f-mono); font-size: 13px; color: var(--granit); text-align: right; }

.rm-cities { list-style: none; margin: 0; padding: 0; }
.rm-cities li {
  display: grid; grid-template-columns: 12px minmax(0, 1fr) auto auto;
  gap: 4px 10px; align-items: center;
  padding: 10px 0; border-top: 1px dashed var(--pierre); font-size: 15px;
}
.rm-cities li:first-child { border-top: 0; }
.rm-cities small { font-family: var(--f-mono); font-size: 12px; color: var(--granit); }
.rm-city-v { font-family: var(--f-mono); font-size: 13px; color: var(--granit); white-space: nowrap; }
.rm-city-ex {
  grid-column: 2 / -1; font-family: var(--f-mono); font-size: 12px; color: #5b6b5f;
}

.rm-bigs {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-wrap: wrap; gap: 8px;
}
.rm-big {
  display: inline-flex; align-items: center; gap: 8px; min-height: 40px;
  padding: 0 14px; border-radius: var(--r-pill);
  border: var(--hair) dashed var(--pierre-2); color: var(--granit); font-size: 14px;
}
.rm-big small { font-family: var(--f-mono); font-size: 11px; }
.rm-big.is-present {
  border-style: solid; border-color: var(--sapin); background: var(--neige);
  color: var(--sapin); font-weight: 600;
}

.rm-limits { margin: 0; padding-left: 20px; }
.rm-limits li { font-size: 15px; line-height: 1.6; color: #3f5446; margin: 6px 0; }

/* ===================== Responsive ===================== */
@media (max-width: 1180px) {
  .rm-head { grid-template-columns: minmax(0, 1fr); align-items: start; }
}
@media (max-width: 1080px) {
  .rankmap .geo-grid { grid-template-columns: 1fr; }
}
@media (max-width: 960px) {
  .rm-export { grid-template-columns: 1fr; gap: 16px; }
  .rankmap .result-duo { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 820px) {
  .rm-figs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rm-figs b { font-size: 24px; }
  .rm-synth p { font-size: 16px; }
  .rm-synth p:first-of-type { font-size: 18px; }
  .rm-tier { grid-template-columns: minmax(0, 1fr) auto; gap: 6px 12px; }
  .rm-tier-bar { grid-column: 1 / -1; grid-row: 2; }
  .rm-tier-s { grid-column: 1 / -1; text-align: left; }
  .rm-export-actions .btn { width: 100%; }
}
