/* ============================================================================
   Digitour — visa.css
   Visa hub grid and the per-country template.
   ========================================================================== */

/* ── Hub ─────────────────────────────────────────────────────────────────── */
.visagroup + .visagroup { margin-top: 48px; }

.visagrid { display: grid; gap: 14px; }
@media (min-width: 600px)  { .visagrid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 18px; } }
@media (min-width: 1024px) { .visagrid { grid-template-columns: repeat(3, minmax(0,1fr)); gap: 20px; } }

.visacard {
  display: flex; flex-direction: column; gap: 4px;
  background: var(--white); border: 1px solid var(--line); border-radius: var(--r-lg);
  padding: 20px; text-decoration: none;
  transition: border-color var(--dur-1) ease, box-shadow var(--dur-2) ease, transform var(--dur-2) var(--ease);
}
.visacard:hover { border-color: var(--g600); box-shadow: var(--sh-2); transform: translateY(-2px); }
.visacard__flag { line-height: 0; margin-bottom: 10px; border-radius: 2px; overflow: hidden; box-shadow: 0 0 0 1px var(--line); width: max-content; }
.visacard__name { font-family: var(--serif); font-size: 1.125rem; font-weight: 600; }
.visacard__type { font-size: .75rem; color: var(--muted); }
.visacard__facts { display: grid; gap: 1px; margin: 14px 0 16px; background: var(--line-soft); border-radius: var(--r-sm); overflow: hidden; }
.visacard__facts > div { background: var(--ivory); display: flex; justify-content: space-between; gap: 12px; padding: 8px 11px; }
.visacard__facts dt { font-size: .6875rem; color: var(--muted); }
.visacard__facts dd { font-size: .75rem; font-weight: 600; text-align: right; }
.visacard__go {
  margin-top: auto; display: inline-flex; align-items: center; gap: 6px;
  font-size: .8125rem; font-weight: 600; color: var(--g700);
}
.visacard:hover .visacard__go { gap: 10px; }

/* ── Refusal policy block ────────────────────────────────────────────────── */
.refusal { display: grid; gap: 28px; }
@media (min-width: 1024px) { .refusal { grid-template-columns: 1fr 1.15fr; gap: 56px; align-items: start; } }
.refusal .t-h2 { margin: 6px 0 14px; }
.refusal__note { display: flex; gap: 10px; align-items: flex-start; margin-top: 20px; font-size: .8125rem; line-height: 1.65; }
.refusal__note .i { flex-shrink: 0; margin-top: 2px; color: var(--g600); }
.refusal__cols { display: grid; gap: 28px; }
@media (min-width: 600px) { .refusal__cols { grid-template-columns: 1fr 1fr; gap: 32px; } }

/* ── Country page hero ───────────────────────────────────────────────────── */
.vhero { display: grid; gap: 26px; margin-top: 14px; }
@media (min-width: 1024px) { .vhero { grid-template-columns: 1.5fr 320px; gap: 56px; align-items: start; } }
.vhero__flagline { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.vhero__flagline span { font-size: .75rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--gold); }
.vhero__flagline svg { border-radius: 2px; box-shadow: 0 0 0 1px rgba(255,255,255,.28); }
.vhero__intro { color: var(--g100); font-size: .9375rem; line-height: 1.72; margin-top: 12px; max-width: 62ch; }

.vhero__card {
  background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.16);
  border-radius: var(--r-lg); padding: 20px;
}
.vhero__cardtitle { font-size: .6875rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: var(--gold); margin-bottom: 14px; }
.vhero__card dl { display: grid; gap: 12px; }
.vhero__card dt { font-size: .6875rem; color: var(--on-dark-2); text-transform: uppercase; letter-spacing: .06em; }
.vhero__card dd { font-size: .875rem; color: #fff; margin-top: 2px; line-height: 1.45; }
.vhero__card dd b { font-family: var(--serif); font-size: 1.125rem; color: var(--gold); }

.stat__v--sm { font-size: clamp(1.0625rem, 3.4vw, 1.25rem); line-height: 1.3; }
.datastrip .stat__l { margin-bottom: 6px; }

/* ── Country page layout ─────────────────────────────────────────────────── */
.visa__layout { display: grid; gap: 32px; padding-block: 40px 56px; }
@media (min-width: 1024px) {
  .visa__layout { grid-template-columns: minmax(0,1fr) 340px; gap: 56px; padding-block: 56px 80px; align-items: start; }
}
.acc__count {
  display: inline-grid; place-items: center; min-width: 20px; height: 20px; padding: 0 6px;
  border-radius: 999px; background: var(--g100); color: var(--g700);
  font-family: var(--sans); font-size: .6875rem; font-weight: 700; margin-left: 8px; vertical-align: 2px;
}

/* ── Fees ────────────────────────────────────────────────────────────────── */
.feegrid { display: grid; gap: 16px; }
@media (min-width: 600px) { .feegrid { grid-template-columns: 1fr 1fr; gap: 20px; } }
.feecard {
  border: 1px solid var(--line); border-radius: var(--r-lg); padding: 22px; background: var(--white);
}
.feecard--ours { background: var(--g100); border-color: var(--g100); }
.feecard__label { font-size: .6875rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.feecard--ours .feecard__label { color: var(--g700); }
.feecard__amount { font-family: var(--serif); font-size: 1.75rem; font-weight: 700; color: var(--g900); margin: 6px 0 10px; }
.feecard__note { font-size: .8125rem; color: var(--muted); line-height: 1.62; }
.feegrid__stamp {
  display: flex; gap: 8px; align-items: flex-start;
  font-size: .75rem; color: var(--muted); margin-top: 16px; line-height: 1.55;
}
.feegrid__stamp .i { flex-shrink: 0; margin-top: 2px; }

/* ── Related countries ───────────────────────────────────────────────────── */
.relgrid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
@media (min-width: 768px) { .relgrid { grid-template-columns: repeat(4, minmax(0,1fr)); } }
.relcard {
  display: flex; flex-direction: column; gap: 4px;
  padding: 16px; border: 1px solid var(--line); border-radius: var(--r-md);
  background: var(--white); text-decoration: none;
  transition: border-color var(--dur-1) ease, transform var(--dur-2) var(--ease);
}
.relcard:hover { border-color: var(--g600); transform: translateY(-2px); }
.relcard__flag { line-height: 0; margin-bottom: 6px; border-radius: 2px; overflow: hidden; box-shadow: 0 0 0 1px var(--line); width: max-content; }
.relcard__name { font-weight: 600; font-size: .9375rem; }
.relcard__meta { font-size: .6875rem; color: var(--muted); }