/* Data pages: /places/ and /places/<city>/ (and the generic pieces of /trends/products/<product>/).
   Built on landing-system.css (cream, ink, TikTok Sans). Mobile first: tables become cards under 640px. */
main.pg{padding-bottom:40px}
main.pg .pg-wrap{max-width:var(--ls-wrap);margin:0 auto;padding:0 var(--ls-gutter)}
main.pg .pg-hero{padding:28px 0 8px}
main.pg .pg-hero h1{font-size:clamp(32px,4.6vw,56px);margin:14px 0 14px;max-width:22ch}
main.pg .pg-hero .pg-lead{font-size:clamp(18px,1.7vw,21px);line-height:1.5;color:var(--ls-ink);max-width:62ch;margin:0 0 16px}
main.pg .pg-eyebrow{display:inline-flex;align-items:center;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ls-ink);background:var(--ls-paper);border:1.5px solid var(--ls-ink);border-radius:999px;padding:6px 14px}
main.pg .pg-stamp{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;font-size:14px;color:var(--ls-muted);margin:0 0 18px}
main.pg .pg-stamp b{color:var(--ls-ink);font-weight:700}
main.pg .pg-actions{display:flex;flex-wrap:wrap;gap:12px;margin:6px 0 4px}
main.pg .pg-actions .ls-btn{min-height:48px;padding:0 20px;font-size:16px;border-radius:18px}
main.pg .pg-section{padding:30px 0 6px}
main.pg .pg-section h2{font-size:clamp(24px,2.7vw,34px);margin:0 0 8px}
main.pg .pg-section>p.pg-sub{font-size:17px;line-height:1.55;color:var(--ls-text);margin:0 0 14px;max-width:70ch}

/* stat cards */
main.pg .pg-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin:14px 0 6px}
main.pg .pg-stat{background:var(--ls-paper);border:1.5px solid var(--ls-line);border-radius:var(--ls-radius-sm);padding:14px 16px;min-width:0}
main.pg .pg-stat strong{display:block;font-size:clamp(24px,2.4vw,32px);line-height:1.12;letter-spacing:-.02em;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
main.pg .pg-stat span{display:block;font-size:14px;line-height:1.4;color:var(--ls-muted);margin-top:4px}
main.pg .pg-stat.is-up strong{color:#2f7a3d}main.pg .pg-stat.is-down strong{color:#a13232}

/* table tools */
main.pg .pg-tools{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:10px 0}
main.pg .pg-tools label{font-size:14px;color:var(--ls-muted);display:flex;align-items:center;gap:8px}
main.pg .pg-tools select,main.pg .pg-tools input[type=search]{min-height:44px;border:1.5px solid var(--ls-line);border-radius:14px;background:var(--ls-paper);font:500 16px var(--ls-font);color:var(--ls-ink);padding:0 12px}
main.pg .pg-tools input[type=search]{min-width:170px;flex:1 1 170px;max-width:280px}
main.pg .pg-tools .pg-btn,main.pg a.pg-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border-radius:14px;border:2px solid var(--ls-ink);background:var(--ls-paper);color:var(--ls-ink);font:700 15px/1.2 var(--ls-font);text-decoration:none;cursor:pointer}
main.pg .pg-tools .pg-btn.primary,main.pg a.pg-btn.primary{background:var(--ls-ink);color:#fff}
main.pg .pg-tools .pg-btn:hover,main.pg a.pg-btn:hover{box-shadow:0 4px 0 rgba(31,30,28,.18)}
main.pg .pg-tools .pg-spacer{flex:1 1 0}

/* tables */
main.pg .pg-tablewrap{background:var(--ls-paper);border:1.5px solid var(--ls-line);border-radius:var(--ls-radius-sm);overflow-x:auto}
main.pg table.pg-table{width:100%;border-collapse:collapse;font-size:16px;line-height:1.4;font-variant-numeric:tabular-nums}
main.pg table.pg-table caption{text-align:left;padding:12px 16px 0;font-size:14px;color:var(--ls-muted)}
main.pg table.pg-table th{font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ls-muted);background:var(--ls-cream);text-align:left;padding:0 14px;border-bottom:1.5px solid var(--ls-line);white-space:nowrap}
main.pg table.pg-table th button{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:5px;min-height:44px;text-transform:inherit;letter-spacing:inherit;font-weight:inherit;color:inherit}
main.pg table.pg-table th button:focus-visible{outline:2px solid var(--ls-blue-deep);outline-offset:2px;border-radius:4px}
main.pg table.pg-table th[aria-sort=ascending] button::after{content:'▲';font-size:9px}
main.pg table.pg-table th[aria-sort=descending] button::after{content:'▼';font-size:9px}
main.pg table.pg-table td{padding:12px 14px;border-bottom:1px solid var(--ls-line);vertical-align:top}
main.pg table.pg-table tr:last-child td{border-bottom:0}
main.pg table.pg-table .num{text-align:right;white-space:nowrap}
main.pg table.pg-table th.num{text-align:right}
main.pg table.pg-table td.rank{color:var(--ls-muted);width:44px}
main.pg table.pg-table td .sub{display:block;font-size:13px;color:var(--ls-muted);margin-top:2px;font-weight:400}
main.pg table.pg-table td strong{font-weight:700}
main.pg table.pg-table a{color:var(--ls-blue-deep)}
main.pg table.pg-table tr[hidden]{display:none}
main.pg .pg-note{font-size:14px;line-height:1.5;color:var(--ls-muted);margin:8px 0 0;max-width:80ch}
main.pg .pg-empty{padding:16px;color:var(--ls-muted)}

/* chips (what people search) */
main.pg .pg-chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:8px 0 4px}
main.pg .pg-chips li{background:var(--ls-paper);border:1.5px solid var(--ls-line);border-radius:999px;padding:7px 14px;font-size:15px;margin:0}

/* link cards (neighbouring cities, next steps) */
main.pg .pg-links{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;list-style:none;padding:0;margin:12px 0}
main.pg .pg-links li{margin:0}
main.pg .pg-links a{display:block;height:100%;background:var(--ls-paper);border:1.5px solid var(--ls-line);border-radius:var(--ls-radius-sm);padding:14px 16px;text-decoration:none;color:var(--ls-text);min-height:44px}
main.pg .pg-links a:hover{border-color:var(--ls-ink)}
main.pg .pg-links strong{display:block;font-size:17px;color:var(--ls-ink);margin-bottom:2px}
main.pg .pg-links span{display:block;font-size:14px;line-height:1.4;color:var(--ls-muted)}

/* city grid on the hub */
main.pg .pg-cities{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px;list-style:none;padding:0;margin:14px 0}
main.pg .pg-cities li{margin:0}
main.pg .pg-cities a{display:block;height:100%;background:var(--ls-paper);border:1.5px solid var(--ls-line);border-radius:var(--ls-radius-sm);padding:14px 16px;text-decoration:none;color:var(--ls-text)}
main.pg .pg-cities a:hover{border-color:var(--ls-ink)}
main.pg .pg-cities strong{display:block;font-size:19px;color:var(--ls-ink)}
main.pg .pg-cities span{display:block;font-size:14px;line-height:1.4;color:var(--ls-muted);margin-top:3px}

/* FAQ */
main.pg .pg-faq details{background:var(--ls-paper);border:1.5px solid var(--ls-line);border-radius:var(--ls-radius-sm);margin:0 0 10px}
main.pg .pg-faq summary{cursor:pointer;list-style:none;font-weight:700;font-size:17px;line-height:1.35;padding:14px 18px;min-height:44px;color:var(--ls-ink)}
main.pg .pg-faq summary::-webkit-details-marker{display:none}
main.pg .pg-faq summary::after{content:'+';float:right;font-weight:800}
main.pg .pg-faq details[open] summary::after{content:'−'}
main.pg .pg-faq .faq-a{padding:0 18px 14px}
main.pg .pg-faq .faq-a p{margin:0;font-size:16.5px;line-height:1.6}

/* closing ask */
main.pg .pg-cta{background:var(--ls-ink);color:#fff;border-radius:var(--ls-radius);padding:26px 28px;margin:34px 0 10px;display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between}
main.pg .pg-cta strong{display:block;font-size:22px;color:#fff;margin-bottom:4px}
main.pg .pg-cta p{margin:0;color:#e9e4da;font-size:16px;max-width:56ch}
main.pg .pg-cta a.ls-btn{background:var(--ls-yellow);border-color:var(--ls-yellow);color:var(--ls-ink)}

@media (max-width:640px){
  main.pg .pg-wrap{padding:0 16px}
  main.pg .pg-hero h1{max-width:none}
  main.pg .pg-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  main.pg .pg-stat{padding:12px}
  main.pg .pg-stat strong{font-size:22px}
  main.pg .pg-stat span{font-size:13px}
  main.pg .pg-actions .ls-btn{flex:1 1 100%}
  main.pg .pg-tablewrap{border:0;background:transparent;overflow:visible}
  main.pg table.pg-table,main.pg table.pg-table tbody{display:block}
  main.pg table.pg-table thead{display:none}
  main.pg table.pg-table caption{padding:0 0 8px}
  main.pg table.pg-table tr{display:block;background:var(--ls-paper);border:1.5px solid var(--ls-line);border-radius:var(--ls-radius-sm);padding:12px 14px;margin:0 0 10px}
  main.pg table.pg-table td{display:flex;justify-content:space-between;gap:14px;border:0;padding:5px 0;text-align:right;font-size:15px}
  main.pg table.pg-table td::before{content:attr(data-label);color:var(--ls-muted);font-size:13px;flex:0 0 auto;text-align:left}
  main.pg table.pg-table td.rank{display:none}
  main.pg table.pg-table td.pk{display:block;text-align:left;font-size:18px;padding:0 0 6px}
  main.pg table.pg-table td.pk::before{content:attr(data-rank) '. ';color:var(--ls-muted);font-weight:700}
  main.pg table.pg-table td .sub{text-align:left}
  main.pg table.pg-table .num{white-space:normal}
  main.pg .pg-tools{gap:8px}
  main.pg .pg-tools .pg-btn,main.pg .pg-tools select,main.pg .pg-tools label{flex:1 1 100%}
  main.pg .pg-tools label{flex-wrap:wrap}
  main.pg .pg-tools select,main.pg .pg-tools input[type=search]{max-width:none;flex:1 1 100%}
  main.pg .pg-cta{padding:20px 18px}
  main.pg .pg-cta a.ls-btn{width:100%}
}
@media (prefers-reduced-motion:reduce){main.pg *{transition:none!important}}
