/* ============================================================
   404 · Responsive — 1280 / 1024 / 768 / 390
   ============================================================ */

/* Laptop */
@media (max-width: 1280px) {
	.entries--grid { grid-template-columns: repeat(2, 1fr); }
	.srcs { grid-template-columns: repeat(2, 1fr); }
}

/* Small laptop / large tablet */
@media (max-width: 1024px) {
	.hero__grid { grid-template-columns: 1fr; gap: var(--s-7); }
	.hero__panel { order: 2; }
	.entry__layout { grid-template-columns: 1fr; }
	.entry__aside { position: static; }
	.tech-grid { grid-template-columns: repeat(2, 1fr); }
	.archive__layout { grid-template-columns: 1fr; }

	/* Filters become a slide-over on tablet & below */
	.filters-open-btn { display: inline-flex; }
	.filters {
		position: fixed;
		top: 0; right: 0;
		height: 100dvh;
		width: min(360px, 90vw);
		background: var(--bg-soft);
		border-left: 1px solid var(--line);
		z-index: var(--z-panel);
		padding: var(--s-5);
		overflow-y: auto;
		transform: translateX(100%);
		transition: transform var(--t-slow) var(--ease);
		box-shadow: -30px 0 60px -30px rgba(0,0,0,.8);
	}
	.filters.is-open { transform: none; }
	.filters__close { display: inline-grid; }
	.filters__head { position: sticky; top: 0; }
}

/* Tablet */
@media (max-width: 900px) {
	.steps { grid-template-columns: 1fr; }
	.statbar { grid-template-columns: repeat(2, 1fr); }
	.stat { border-left: 1px solid var(--line); }
	.stat:nth-child(odd) { border-left: 0; }
	.stat:nth-child(3), .stat:nth-child(4) { border-top: 1px solid var(--line); }

	/* Registry rows collapse to card-ish rows */
	.reg-head { display: none; }
	.reg-row {
		grid-template-columns: 1fr auto;
		grid-template-areas:
			"id status"
			"title title"
			"meta date";
		row-gap: 8px;
	}
	.reg-row__id { grid-area: id; }
	.reg-row .status { grid-area: status; justify-self: end; }
	.reg-row__title { grid-area: title; }
	.reg-row__meta { grid-area: meta; display: flex; gap: 10px; }
	.reg-row__date { grid-area: date; justify-self: end; }
	.reg-row > .arrow { display: none; }
	.reg-row__cell.is-hide-sm { display: none; }
}

/* Mobile */
@media (max-width: 768px) {
	.main-nav { display: none; }
	.header-actions .btn--desktop { display: none; }
	.nav-toggle { display: inline-grid; }

	.footer-nav { grid-template-columns: 1fr; gap: 2px; }
	.footer-nav a { display: block; padding: 10px 0; font-size: 1rem; }
	.site-footer__inner { grid-template-columns: 1fr; gap: var(--s-6); }
	.entries--grid { grid-template-columns: 1fr; }
	.srcs { grid-template-columns: 1fr; }
	.cta { padding: var(--s-6); }
	.cta__inner { grid-template-columns: 1fr; }
	.tech-grid { grid-template-columns: 1fr 1fr; }
	.history__item { grid-template-columns: 1fr; gap: 4px; }

	/* Tap targets >=44px (WCAG 2.5.5) — grow padding, keep icon sizes. */
	.icon-btn, .nav-toggle { width: 44px; height: 44px; }
	.view-toggle__btn { width: 44px; height: 42px; }
	/* >=16px avoids iOS focus zoom-lock on the archive controls. */
	.filters select, .filters input[type="search"], .sort-select { font-size: 16px; }
}

/* Small mobile */
@media (max-width: 420px) {
	:root { --gutter: 16px; }
	.tech-grid { grid-template-columns: 1fr; }
	.statbar { grid-template-columns: 1fr; }
	.stat { border-left: 0; border-top: 1px solid var(--line); }
	.stat:first-child { border-top: 0; }
	.archive__tools { width: 100%; }
	.sort-select { flex: 1; }
}
