.tackle-database {
	background: var(--paper);
}

.tackle-hero {
	overflow: hidden;
	padding: 98px 0 104px;
	background:
		linear-gradient(115deg, rgba(0, 77, 85, 0.98) 0 55%, rgba(0, 111, 119, 0.94) 55% 100%),
		var(--ocean-dark);
	color: var(--white);
}

.tackle-hero__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.25fr) minmax(320px, 0.75fr);
	align-items: end;
	gap: 90px;
}

.tackle-hero .eyebrow,
.database-purpose .eyebrow {
	color: var(--lime);
}

.tackle-hero__status {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 6px 10px;
	margin: 0 0 22px;
	background: rgba(255, 255, 255, 0.08);
	border: 1px solid rgba(255, 255, 255, 0.18);
	font-family: ui-monospace, monospace;
	font-size: 9px;
	letter-spacing: 0.12em;
}

.tackle-hero__status span {
	width: 7px;
	height: 7px;
	background: var(--lime);
	border-radius: 50%;
	box-shadow: 0 0 0 5px rgba(215, 239, 104, 0.12);
}

.tackle-hero h1,
.tackle-section-heading h2,
.tackle-taxonomy-header h1 {
	margin: 0;
	font-family: var(--font-serif);
	font-weight: 700;
	letter-spacing: -0.05em;
	line-height: 1.25;
}

.tackle-hero h1 {
	font-size: clamp(46px, 5.8vw, 78px);
}

.tackle-hero h1 em {
	position: relative;
	color: var(--lime);
	font-style: normal;
}

.tackle-hero__lead {
	max-width: 740px;
	margin: 28px 0 36px;
	color: rgba(255, 255, 255, 0.76);
	font-size: 14px;
	line-height: 2.1;
}

.tackle-hero .button--primary {
	background: var(--lime);
	border-color: var(--lime);
	color: var(--ink);
}

.tackle-hero .button--primary span {
	color: var(--ocean-dark);
}

.tackle-hero__panel {
	padding: 28px 30px;
	background: rgba(255, 253, 247, 0.96);
	box-shadow: 26px 26px 0 rgba(16, 34, 39, 0.2);
	color: var(--ink);
}

.tackle-hero__panel-label {
	padding-bottom: 14px;
	margin: 0;
	border-bottom: 1px solid var(--line);
	color: var(--ocean);
	font-family: ui-monospace, monospace;
	font-size: 9px;
	font-weight: 800;
	letter-spacing: 0.18em;
}

.tackle-hero__panel dl {
	margin: 0;
}

.tackle-hero__panel dl > div {
	display: grid;
	grid-template-columns: 74px 1fr;
	align-items: center;
	padding: 17px 0;
	border-bottom: 1px solid var(--line);
}

.tackle-hero__panel dt {
	color: var(--ink-soft);
	font-size: 10px;
	font-weight: 700;
}

.tackle-hero__panel dd {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 14px;
	margin: 0;
}

.tackle-hero__panel dd strong {
	color: var(--ocean);
	font-family: ui-monospace, monospace;
	font-size: 28px;
	line-height: 1;
}

.tackle-hero__panel dd span {
	color: var(--ink-soft);
	font-size: 10px;
}

.tackle-hero__panel-note {
	margin: 18px 0 0;
	color: var(--ink-soft);
	font-size: 10px;
	line-height: 1.8;
}

.tackle-categories,
.product-archive {
	padding: 108px 0;
}

.tackle-section-heading {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 54px;
	margin-bottom: 44px;
}

.tackle-section-heading h2 {
	font-size: clamp(34px, 4vw, 54px);
}

.tackle-section-heading > p {
	max-width: 440px;
	margin: 0 0 6px;
	color: var(--ink-soft);
	font-size: 13px;
	line-height: 2;
}

.tackle-category-grid {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	border-top: 1px solid var(--line);
	border-left: 1px solid var(--line);
}

.tackle-category-card {
	position: relative;
	grid-column: span 2;
	min-height: 290px;
	padding: 28px;
	background: var(--white);
	border-right: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
}

.tackle-category-card:nth-child(4),
.tackle-category-card:nth-child(5) {
	grid-column: span 3;
}

.tackle-category-card--active {
	background: var(--lime);
}

.tackle-category-card__number {
	position: absolute;
	top: 22px;
	right: 24px;
	color: var(--ink-soft);
	font-family: ui-monospace, monospace;
	font-size: 10px;
}

.tackle-category-card > p {
	margin: 0 0 10px;
	color: var(--ocean);
	font-size: 9px;
	font-weight: 800;
	letter-spacing: 0.17em;
}

.tackle-category-card h3 {
	margin: 0;
	font-family: var(--font-serif);
	font-size: 30px;
}

.tackle-category-card ul {
	padding: 0;
	margin: 28px 0 30px;
	color: var(--ink-soft);
	font-size: 11px;
	line-height: 1.9;
	list-style: none;
}

.tackle-category-card li::before {
	margin-right: 7px;
	color: var(--ocean);
	content: "—";
}

.tackle-category-card a,
.tackle-category-card__state {
	position: absolute;
	right: 28px;
	bottom: 24px;
	left: 28px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-top: 12px;
	border-top: 1px solid rgba(16, 34, 39, 0.18);
	font-size: 10px;
	font-weight: 800;
}

.tackle-category-card__state {
	color: var(--ink-soft);
}

.database-purpose {
	padding: 100px 0;
	background: var(--ink);
	color: var(--white);
}

.tackle-section-heading--light {
	align-items: flex-start;
}

.database-purpose__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	border-top: 1px solid rgba(255, 255, 255, 0.16);
	border-left: 1px solid rgba(255, 255, 255, 0.16);
}

.database-purpose__grid article {
	min-height: 230px;
	padding: 30px;
	border-right: 1px solid rgba(255, 255, 255, 0.16);
	border-bottom: 1px solid rgba(255, 255, 255, 0.16);
}

.database-purpose__grid article > span {
	color: var(--lime);
	font-family: ui-monospace, monospace;
	font-size: 10px;
}

.database-purpose__grid h3 {
	margin: 42px 0 14px;
	font-family: var(--font-serif);
	font-size: 23px;
}

.database-purpose__grid p {
	margin: 0;
	color: rgba(255, 255, 255, 0.65);
	font-size: 12px;
	line-height: 1.9;
}

.product-archive {
	background: #ecf1eb;
}

.product-archive__notice {
	display: flex;
	flex-direction: column;
	max-width: 430px;
	padding: 14px 18px;
	background: var(--sand);
	border-left: 4px solid var(--ocean);
}

.product-archive__notice strong {
	font-size: 12px;
}

.product-archive__notice span {
	margin-top: 3px;
	color: var(--ink-soft);
	font-size: 10px;
}

.product-archive .woocommerce-notices-wrapper:empty {
	display: none;
}

.product-archive .woocommerce-result-count {
	color: var(--ink-soft);
	font-size: 11px;
}

.product-archive .woocommerce-ordering select {
	min-height: 42px;
	padding: 8px 34px 8px 12px;
	background: var(--white);
	border: 1px solid var(--line);
	border-radius: 0;
	color: var(--ink);
	font-size: 11px;
}

.product-archive ul.products {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 22px;
	clear: both;
	padding-top: 26px;
}

.product-archive ul.products::before,
.product-archive ul.products::after {
	display: none;
}

.product-archive.woocommerce ul.products li.product,
.product-archive .woocommerce ul.products li.product,
.woocommerce-page .product-archive ul.products li.product {
	float: none;
	width: auto;
	margin: 0;
}

.product-archive ul.products li.product img {
	aspect-ratio: 4 / 3;
	margin: 0;
	object-fit: cover;
}

.tackle-taxonomy-header {
	padding: 82px 0 48px;
	background: var(--ocean-pale);
}

.tackle-taxonomy-header h1 {
	font-size: clamp(38px, 5vw, 62px);
}

.tackle-taxonomy-header .term-description {
	max-width: 720px;
	margin-top: 20px;
	color: var(--ink-soft);
}

@media (max-width: 980px) {
	.tackle-hero__grid {
		grid-template-columns: 1fr;
		gap: 58px;
	}

	.tackle-hero__panel {
		max-width: 620px;
	}

	.tackle-category-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.tackle-category-card,
	.tackle-category-card:nth-child(4),
	.tackle-category-card:nth-child(5) {
		grid-column: auto;
	}

	.tackle-category-card:last-child {
		grid-column: 1 / -1;
	}

	.product-archive ul.products {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 680px) {
	.tackle-hero,
	.tackle-categories,
	.database-purpose,
	.product-archive {
		padding: 72px 0;
	}

	.tackle-hero__grid {
		gap: 44px;
	}

	.tackle-hero h1 {
		font-size: 44px;
	}

	.tackle-hero__lead {
		font-size: 13px;
	}

	.tackle-hero__panel {
		padding: 22px 20px;
		box-shadow: 14px 14px 0 rgba(16, 34, 39, 0.2);
	}

	.tackle-section-heading {
		align-items: flex-start;
		flex-direction: column;
		gap: 22px;
	}

	.tackle-section-heading h2 {
		font-size: 36px;
	}

	.tackle-category-grid,
	.database-purpose__grid,
	.product-archive ul.products {
		grid-template-columns: 1fr;
	}

	.tackle-category-card,
	.tackle-category-card:last-child {
		grid-column: auto;
	}

	.database-purpose__grid article {
		min-height: 190px;
	}

	.product-archive .woocommerce-result-count,
	.product-archive .woocommerce-ordering {
		float: none;
	}

	.product-archive .woocommerce-ordering {
		margin-top: 12px;
	}
}