/* Server-rendered pages (src/seo.ts): item, where-to-buy, category, city, and the extra sections on the store page.
   Same column and gutters as every page (--tk-max, --tk-gut); lists are rows on a phone and a grid from tablet up, so desktop uses its width. */
.tk-crumbs{margin-top:6px}
.tk-crumbs ol{display:flex;flex-wrap:wrap;gap:2px 0;list-style:none;margin:0;padding:0;font-size:13px;line-height:1.4;color:var(--h-muted)}
.tk-crumbs li{display:inline-flex;align-items:center;min-width:0}
.tk-crumbs li{min-height:44px}
.tk-crumbs li+li::before{content:"/";margin:0 8px;color:var(--h-line-strong,var(--h-muted));opacity:.7}
.tk-crumbs a{color:inherit;text-decoration:none;display:inline-flex;align-items:center;min-height:44px}
.tk-crumbs a:hover{color:var(--h-brand);text-decoration:underline}
.tk-crumbs li[aria-current]{color:var(--h-fg);overflow-wrap:anywhere}

.tk-seo .tk-sec:first-of-type{margin-top:16px}
.tk-seo-head{display:grid;gap:20px}
.tk-seo-copy{min-width:0}
.tk-seo-meta{margin:14px 0 0;font-size:15px;color:var(--h-fg)}
.tk-seo-copy .tk-note{margin:10px 0 0}
.tk-seo-act{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}
.tk-seo-fig{margin:0;min-width:0}
.tk-seo-fig img{display:block;width:100%;max-height:min(460px,60vh);aspect-ratio:4/3;object-fit:contain;background:var(--h-surface);border:1px solid var(--h-line)}

.tk-seo-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.tk-seo-list li{min-width:0;border:1px solid var(--h-line);background:var(--h-surface)}
.tk-seo-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:56px;padding:10px 14px;color:inherit;text-decoration:none}
a.tk-seo-row:hover{background:var(--h-brand-soft)}
a.tk-seo-row:focus-visible{outline:2px solid var(--h-brand);outline-offset:-2px}
.tk-seo-t{display:flex;flex-direction:column;gap:2px;min-width:0}
.tk-seo-t b{font-weight:600;font-size:15px;line-height:1.35;overflow-wrap:anywhere}
.tk-seo-t span{font-size:13px;line-height:1.4;color:var(--h-muted)}
.tk-seo-tag{flex:none;font-size:12.5px;color:var(--h-muted)}
.tk-seo-cols{display:grid;gap:0 clamp(24px,3vw,48px)}

/* the store page's server-rendered item list: the same rows the page script draws as buttons, so nothing moves when it takes over */
.tk-items li>a{display:flex;flex-direction:column;width:100%;box-sizing:border-box;min-height:44px;padding:11px 14px;color:inherit;text-decoration:none;font-size:15px;font-weight:500;line-height:1.35}
.tk-items li>a:hover{background:var(--h-brand-soft)}
.tk-items li:has(>a){padding:0}
.tk-storepage .tk-seo-list{margin-top:0}

@media (min-width:700px){
  .tk-seo-list{grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr));gap:10px 16px}
}
@media (min-width:900px){
  .tk-seo-head{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(28px,4vw,64px);align-items:start}
  .tk-seo-cols{grid-template-columns:minmax(0,3fr) minmax(0,2fr)}
  .tk-seo-cols .tk-seo-list{grid-template-columns:minmax(0,1fr)}
  .tk-seo-fig img{max-height:480px}
}
