/* Explo country pages (/country/). Loaded after /blog/blog.css, /visa/visa.css and /tools/tools.css. Prefix: cp-
   Cream page, navy ink, Satoshi (max Medium 500). Flat fills, no pure white, no glows. */

/* Satoshi ships Regular and Medium only: bold text uses Medium too. */
.vp b, .vp strong { font-weight: 500; }

.cp-note { margin: 10px 0 0; font-size: 15px; line-height: 1.55; color: var(--muted); }
.cp-links { margin: 14px 0 16px; font-size: 16px; }
.cp-todo { padding-left: 1.2em; margin: 0 0 8px; }
.cp-todo li { margin: 0 0 10px; }
.vp-head .vp-chips { margin: 18px 0 0; }
.cp-empty { margin: 24px 0; color: var(--muted); }

/* ---- visa picker ---- */
.cp-visa .vp-stats { margin-bottom: 16px; }
.cp-pick { margin: 0 0 6px; }
.cp-pick .tl-field { max-width: 440px; }
.cp-ans { margin: 18px 0 0; }
.cp-ans .vp-answer { margin: 0; }
.cp-ans .vp-answer p { font-size: clamp(19px, 2.6vw, 23px); }
.cp-ans .cp-facts { display: flex; flex-wrap: wrap; gap: 8px 26px; margin: 14px 0 0; padding: 0; list-style: none; font-size: 16px; }
.cp-ans .cp-facts b { font-weight: 500; }
.cp-ans .tl-actions { margin-top: 16px; }
.cp-ans .cp-more { margin: 14px 0 0; font-size: 16px; }

/* ---- weather ---- */
.cp-weather h3 { margin-top: 30px; }
.cp-clim-box[hidden] { display: none; }
.cp-weather [data-now]:empty { display: none; }
.cp-weather [data-now]:empty + .cp-clim-box h3 { margin-top: 0; }

.cp-clim { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 6px; margin: 0 0 12px; }
.cp-col { display: flex; flex-direction: column; align-items: stretch; min-width: 0; text-align: center; }
.cp-hi, .cp-lo { display: block; font-size: 13px; line-height: 1.5; font-variant-numeric: tabular-nums; }
.cp-hi { font-weight: 500; }
.cp-lo { color: var(--muted); }
.cp-track { position: relative; height: 112px; margin: 2px 0; border-radius: 10px; background: var(--soft); }
.cp-track i { position: absolute; left: 22%; right: 22%; border-radius: 8px; background: var(--night); min-height: 4px; }
.cp-mon { display: block; margin: 8px 0 4px; font-size: 14px; font-weight: 500; line-height: 1.2; color: var(--muted); }
.cp-rain { position: relative; height: 56px; margin: 0; border-radius: 8px; background: var(--soft-2); }
.cp-rain i { position: absolute; left: 22%; right: 22%; bottom: 0; border-radius: 6px 6px 3px 3px; background: var(--k-A, #108ae1); min-height: 2px; }
.cp-mm { display: block; margin-top: 3px; font-size: 12px; line-height: 1.4; color: var(--muted); font-variant-numeric: tabular-nums; }
.cp-col.cp-peak .cp-mon { color: var(--fg); }
.cp-key { display: flex; flex-wrap: wrap; gap: 6px 22px; margin: 0; padding: 0; list-style: none; font-size: 14px; color: var(--muted); }
.cp-key li { display: inline-flex; align-items: center; gap: 8px; }
.cp-key i { display: inline-block; width: 12px; height: 12px; border-radius: 4px; }
.cp-k-temp { background: var(--night); }
.cp-k-rain { background: var(--k-A, #108ae1); }

@media (max-width: 720px) {
  .cp-clim { gap: 3px; }
  .cp-track { height: 96px; border-radius: 7px; }
  .cp-track i { left: 16%; right: 16%; border-radius: 5px; }
  .cp-rain i { left: 16%; right: 16%; }
  .cp-hi, .cp-lo { font-size: 11.5px; letter-spacing: -0.02em; }
  .cp-mm { font-size: 10.5px; letter-spacing: -0.03em; }
  .cp-mon { font-size: 12px; }
  .cp-ans .cp-facts { flex-direction: column; gap: 4px; }
}