/* =====================================================================
   Country and city pages — /uae, /uae/dubai (Web\Services\Places).

   The reference pages' family (product-info.css, tools-pages.css): cards
   with the darker edge and the soft shadow, brand blue #1F3F8F, navy
   #0F1F4A. The band is the shared .ed-hero with its flag (mesteel.css);
   the company cards are the directory's own (directory.css,
   partials/company-card). Sell is green and buy is orange through
   [data-kind] and --accent, never a colour named here.

   Mobile first, no fixed widths: every grid is minmax(0,1fr), long words
   wrap, nothing scrolls the page sideways. Logical properties only
   (inline-start / inline-end), so the page mirrors under dir="rtl".
   ===================================================================== */
.pl-wrap{--pl-edge:#AEB8CA;--pl-edge-hi:#8C98B0;
  --pl-rest:0 1px 2px rgba(15,31,74,.10),0 2px 6px rgba(15,31,74,.08);
  --pl-lift:0 2px 4px rgba(15,31,74,.12),0 4px 10px rgba(15,31,74,.10);
  padding-top:18px;padding-bottom:56px;min-width:0}
.pl-wrap .crumbs{margin:0 0 12px}

/* "On this page" */
.pl-jump ul{list-style:none;margin:0 0 4px;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.pl-jump a{display:inline-block;padding:6px 11px;border-radius:999px;font-size:13.5px;font-weight:600;
  color:var(--navy,#0F1F4A);text-decoration:none;background:#fff;border:1px solid #D5DCE8}
.pl-jump a:hover{border-color:var(--pl-edge-hi);color:var(--blue,#1F3F8F)}

/* ---------- sections ---------- */
.pl-sec{margin:14px 0 0;padding:20px 22px;border:1px solid var(--pl-edge);box-shadow:var(--pl-rest);
  scroll-margin-top:72px;min-width:0}
.pl-sec h2{margin:0 0 12px;font-size:21px;line-height:1.25;color:var(--navy,#0F1F4A);overflow-wrap:anywhere}
.pl-sec h3{margin:16px 0 8px;font-size:15.5px;color:var(--navy,#0F1F4A)}
.pl-sec p{margin:0 0 10px;font-size:15px;line-height:1.6;color:#1E293B;max-width:85ch}
.pl-sec p:last-child{margin-bottom:0}
.pl-sec a:not(.btn):not(.pl-chip):not(.pl-post):not(.pl-price){color:var(--blue,#1F3F8F)}
.pl-sec-h{display:flex;align-items:baseline;justify-content:space-between;gap:6px 14px;flex-wrap:wrap;margin:0 0 12px}
.pl-sec-h h2,.pl-sec-h h3{margin:0}
.pl-all{font-size:14px;font-weight:700;text-decoration:none;white-space:nowrap}
.pl-all:hover{text-decoration:underline}
.pl-n{font-size:12px;font-weight:700;color:var(--mute);background:#EEF2F8;border-radius:999px;padding:2px 8px;vertical-align:2px}
.pl-lead{color:#475569 !important}
.pl-src{font-size:13px !important;color:var(--mute) !important;margin-top:10px !important}
.pl-src a{font-weight:600}
.pl-more{margin-top:14px !important;font-size:14.5px !important}

/* ---------- the numbers ---------- */
.pl-stats{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.pl-stats a,.pl-stats .pl-stat{display:flex;flex-direction:column;gap:2px;height:100%;padding:12px 14px;border:1px solid #D5DCE8;
  border-radius:12px;background:#F8FAFD;text-decoration:none;color:inherit;min-width:0}
.pl-stats a:hover{border-color:var(--pl-edge-hi);box-shadow:var(--pl-rest)}
.pl-stats b{font-size:26px;line-height:1.1;font-weight:800;color:var(--navy,#0F1F4A);font-variant-numeric:tabular-nums}
.pl-stats span span,.pl-stats a > span{font-size:13px;color:var(--mute);overflow-wrap:anywhere}
.pl-official{margin-top:16px;padding-top:14px;border-top:1px solid #E2E8F0}
.pl-official h3{margin:0 0 4px}
.pl-official-v{font-size:15.5px !important}
.pl-official-v b{font-size:22px;color:var(--navy,#0F1F4A)}
.pl-official-v span{color:var(--mute);font-size:14px}

/* ---------- standards ---------- */
.pl-dl{margin:4px 0 0;display:grid}
.pl-dl > div{display:grid;grid-template-columns:minmax(0,1fr);gap:4px;padding:12px 0;border-bottom:1px solid #EEF2F8}
.pl-dl > div:last-child{border-bottom:0}
.pl-dl dt{font-weight:700;color:var(--ink);font-size:15px;overflow-wrap:anywhere}
.pl-dl dd{margin:0;min-width:0}
.pl-dl dd p{margin:0}
.pl-dl dd .pl-src{margin-top:4px !important}

/* ---------- chips: cities, product pages ---------- */
.pl-chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.pl-chip{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid var(--pl-edge);border-radius:999px;
  background:#fff;font-size:14.5px;font-weight:600;color:var(--navy,#0F1F4A);text-decoration:none;box-shadow:0 1px 2px rgba(15,31,74,.06);
  max-width:100%;overflow-wrap:anywhere}
a.pl-chip:hover{border-color:var(--pl-edge-hi);box-shadow:var(--pl-lift);color:var(--blue,#1F3F8F)}
.pl-chip.is-plain{background:#F8FAFD;border-style:dashed;color:#475569;font-weight:500;box-shadow:none}

/* ---------- companies: the directory's cards ---------- */
/* (0,3,1) and (0,4,1): mesteel.css widens every .grid on a wide fluid page
   (body.layout-fluid .grid:not(.list), (0,3,1)); these say how many across. */
body .pl-sec .grid.pl-co-grid,body.layout-fluid .pl-sec .grid.pl-co-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;padding:0}
.pl-co-grid .card{min-width:0}
.pl-sec .pl-co-grid .co-link{color:inherit;text-decoration:none}
.pl-sec .pl-co-grid .co-link:hover{color:var(--blue,#1F3F8F);text-decoration:underline}
.pl-co-grid + h3{margin-top:22px}
.pl-pageof{font-size:13.5px;color:var(--mute)}
.pl-pager{display:flex;flex-wrap:wrap;gap:6px;margin-top:18px}
.pl-pager a,.pl-pager span{display:inline-block;min-width:38px;padding:7px 11px;border:1px solid #D5DCE8;border-radius:10px;text-align:center;
  font-size:14px;font-weight:600;text-decoration:none;color:var(--navy,#0F1F4A);background:#fff}
.pl-pager a:hover{border-color:var(--pl-edge-hi)}
.pl-pager span[aria-current]{background:var(--blue,#1F3F8F);border-color:var(--blue,#1F3F8F);color:#fff}

/* ---------- who buys / who sells ---------- */
.pl-cols{display:grid;grid-template-columns:minmax(0,1fr);gap:8px 24px}
.pl-trade h3{margin-top:4px;display:flex;align-items:center;gap:8px}
.pl-trade[data-kind] h3:before{content:"";width:10px;height:10px;border-radius:50%;background:var(--accent);flex:none}
.pl-rank{list-style:none;margin:0;padding:0;counter-reset:pl}
.pl-rank li{counter-increment:pl}
.pl-rank a,.pl-rank .pl-rank-i{display:flex;align-items:baseline;gap:10px;padding:7px 4px;border-bottom:1px solid #EEF2F8;
  text-decoration:none;color:var(--ink);font-size:14.5px;min-width:0}
.pl-rank a:before,.pl-rank .pl-rank-i:before{content:counter(pl);flex:none;min-width:1.6em;font-size:12.5px;font-weight:700;color:var(--mute)}
.pl-rank a span,.pl-rank .pl-rank-i span{flex:1 1 auto;min-width:0;overflow-wrap:anywhere}
.pl-rank b{flex:none;font-size:13px;font-weight:800;color:var(--accent-ink,var(--navy,#0F1F4A));background:var(--accent-10,#EEF2F8);
  border-radius:999px;padding:1px 8px;font-variant-numeric:tabular-nums}
.pl-rank a:hover span{color:var(--blue,#1F3F8F);text-decoration:underline}

/* ---------- marketplace, news, events, jobs ---------- */
.pl-postcol + .pl-postcol{margin-top:6px}
.pl-postcol h3{margin:4px 0 0}
.pl-postcol[data-kind] h3{color:var(--accent-ink)}
.pl-posts,.pl-news{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
.pl-post,.pl-news a{display:flex;flex-direction:column;gap:4px;padding:12px 14px;border:1px solid #D5DCE8;border-radius:12px;
  text-decoration:none;color:inherit;min-width:0;background:#fff}
.pl-postcol[data-kind] .pl-post{border-inline-start:3px solid var(--accent)}
.pl-post:hover,.pl-news a:hover{border-color:var(--pl-edge-hi);box-shadow:var(--pl-rest)}
.pl-postcol[data-kind] .pl-post:hover{border-inline-start-color:var(--accent)}
.pl-post b,.pl-news b{font-size:15px;line-height:1.35;color:var(--ink);overflow-wrap:anywhere}
.pl-post small,.pl-news small{font-size:12.5px;color:var(--mute);overflow-wrap:anywhere}
.pl-news a span{font-size:14px;line-height:1.5;color:#475569}
.pl-sec .pl-news a,.pl-sec .pl-post{color:inherit}
.pl-news a:hover b,.pl-post:hover b{color:var(--blue,#1F3F8F)}

/* ---------- prices ---------- */
.pl-prices{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
.pl-price{display:flex;flex-direction:column;gap:4px;height:100%;padding:14px;border:1px solid var(--pl-edge);border-radius:12px;
  text-decoration:none;color:inherit;min-width:0;background:#fff;box-shadow:0 1px 2px rgba(15,31,74,.08)}
.pl-price:hover{border-color:var(--pl-edge-hi);box-shadow:var(--pl-lift)}
.pl-price b{font-size:14.5px;color:var(--ink);overflow-wrap:anywhere}
.pl-price-v{font-size:20px;font-weight:800;color:var(--navy,#0F1F4A)}
.pl-price-v small{font-size:12px;font-weight:600;color:var(--mute)}
.pl-price-v.is-locked{font-size:14px;font-weight:700;color:var(--mute)}
.pl-price > small{font-size:12.5px;color:var(--mute)}

/* ---------- reference links ---------- */
.pl-links{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
.pl-links a{display:flex;flex-direction:column;gap:2px;padding:12px 14px;border:1px solid var(--pl-edge);border-radius:12px;text-decoration:none;min-width:0}
.pl-links a:hover{border-color:var(--pl-edge-hi);box-shadow:var(--pl-rest)}
.pl-links b{font-size:14.5px;color:var(--ink)}
.pl-links small{font-size:12.5px;color:var(--mute)}

/* ---------- wider screens ---------- */
@media (min-width:600px){
  .pl-stats{grid-template-columns:repeat(3,minmax(0,1fr))}
  .pl-prices,.pl-links{grid-template-columns:repeat(2,minmax(0,1fr))}
  body .pl-sec .grid.pl-co-grid,body.layout-fluid .pl-sec .grid.pl-co-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (min-width:900px){
  .pl-sec{padding:22px 26px}
  .pl-dl > div{grid-template-columns:minmax(160px,240px) minmax(0,1fr);gap:16px}
  .pl-cols{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pl-cols.pl-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .pl-postcol + .pl-postcol{margin-top:0}
  .pl-news{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pl-prices,.pl-links{grid-template-columns:repeat(4,minmax(0,1fr))}
  .pl-prices{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (min-width:1100px){
  .pl-stats{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
  body .pl-sec .grid.pl-co-grid,body.layout-fluid .pl-sec .grid.pl-co-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .pl-prices{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (min-width:1500px){
  body .pl-sec .grid.pl-co-grid,body.layout-fluid .pl-sec .grid.pl-co-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}

/* The place's own paragraph above its numbers, and the two sub-heads. */
.pl-stats-card .pl-about{margin-bottom:4px}
.pl-stats-card h3{margin:14px 0 10px}
.pl-stats-card .pl-official h3{margin:0 0 4px}
