/* T30 Guides archive (Figma 50:2868). Page layout only; tokens from css/v2. */
.psb .psb-icon { width: 1em; height: 1em; flex: none; display: inline-block; vertical-align: -.125em; fill: currentColor; } /* shared-fix candidate */

.ga-hero { padding: 32px 0 40px; }
.psb .ga-title { font-size: clamp(2.75rem, 1.6rem + 4.5vw, 5rem); line-height: 1.05; margin: 12px 0 16px; }

.ga-body { padding: 28px 0 72px; border-top: var(--stroke); }
.ga-layout { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 32px; align-items: start; }

.ga-filters { gap: 16px; padding: 20px 18px; }
.psb .ga-filters__h { font: 700 var(--fs-h5)/1.3 var(--font-body); letter-spacing: 0; }
.ga-group { border: 0; margin: 0; padding: 0; display: grid; gap: 6px; min-width: 0; }
.ga-group legend { padding: 0; margin-bottom: 6px; font: 700 10px/1.3 var(--font-body); letter-spacing: .06em; text-transform: uppercase; color: var(--text-muted); }
.ga-group .psb-check { font-size: 13px; color: var(--text-primary); align-items: center; cursor: pointer; }
.ga-group .psb-check input { width: 16px; height: 16px; margin: 0; }
.ga-n { color: var(--text-muted); }

.ga-bar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; min-height: 36px; margin-bottom: 18px; }
.ga-active { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ga-chips { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
.ga-chip { display: inline-flex; gap: 6px; padding: 5px 12px; border: 1.5px solid var(--ink-900); border-radius: var(--radius-pill); background: var(--pine-100); color: var(--ink-900); font: 700 13px/1.2 var(--font-body); cursor: pointer; }
.ga-chip:hover { background: var(--pine-300); }
.ga-clear { font-size: 13px; font-weight: 700; color: var(--text-brand); }
.ga-meta { font-size: 13px; font-weight: 600; color: var(--text-primary); }
.ga-sort { border: 0; background: transparent; color: var(--text-primary); font: 700 13px/1.3 var(--font-body); cursor: pointer; }
.ga-sort option { color: var(--ink-900); background: var(--cream-0); }

.ga-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; }
.ga-card { display: grid; grid-template-columns: 124px minmax(0, 1fr) auto; gap: 18px; align-items: center; padding: 14px 24px 14px 14px; background: var(--bg-surface); border: var(--stroke); border-radius: var(--radius-row); color: var(--text-primary); text-decoration: none; transition: transform 120ms var(--ease-spring), box-shadow 120ms var(--ease-spring); }
.ga-card:hover { transform: translate(-2px, -2px); box-shadow: var(--shadow-row); }
.ga-card:hover .ga-card__t { text-decoration: underline; }
.ga-thumb { display: grid; place-items: center; height: 92px; border: var(--stroke); border-radius: 12px; background: var(--media-bg, var(--bg-subtle)); }
.ga-thumb img { height: 76%; width: auto; }
.ga-thumb .psb-icon { width: 40px; height: 40px; color: var(--tomato-600); }
.ga-card__body { display: grid; gap: 4px; }
.ga-card__body .psb-overline { font-size: 10px; }
.psb .ga-card__t { font: 700 17px/1.3 var(--font-body); letter-spacing: 0; }
.ga-card__d { font-size: 13px; color: var(--text-secondary); }
.ga-go { font-size: 20px; font-weight: 700; }

.ga-item--feature .ga-card { grid-template-columns: minmax(0, 300px) minmax(0, 1fr); gap: 28px; padding: 20px 28px 20px 20px; border-radius: var(--radius-card); box-shadow: var(--shadow-card); }
.ga-item--feature .psb-media { border-radius: 14px; }
.ga-item--feature .psb-media img { width: auto; height: 50%; padding: 0; }
.ga-item--feature .psb-overline { font-size: 11px; }
.psb .ga-item--feature .ga-card__t { font: 400 clamp(1.4rem, 1rem + 1.2vw, 1.75rem)/1.12 var(--font-display); }
.ga-item--feature .ga-card__d { font-size: 15px; }
.ga-item--feature .ga-card__body { gap: 10px; }

.ga-empty { margin-top: 16px; }
.ga-pager { margin-top: 20px; }
.ga-pager a[aria-disabled="true"] { opacity: .45; pointer-events: none; }

@media (max-width: 900px) {
  .ga-layout { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .ga-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ga-filters__h { grid-column: 1 / -1; }
}
@media (max-width: 600px) {
  .ga-card { grid-template-columns: 80px minmax(0, 1fr); gap: 14px; padding: 12px; }
  .ga-thumb { height: 72px; }
  .ga-go { display: none; }
  .ga-item--feature .ga-card { grid-template-columns: minmax(0, 1fr); padding: 14px; }
  .ga-bar { align-items: flex-start; flex-direction: column; }
}