/**
 * Equitech category archive.
 * Everything is scoped under .eqb so nothing leaks into the theme or Elementor.
 */

.eqb {
	--eqb-ink: #033b4c;
	--eqb-teal: #008181;
	--eqb-blue: #2a60ab;
	--eqb-muted: #7d7d7d;
	--eqb-line: #e3e0d2;
	--eqb-cream: #f7f3e4;
	--eqb-media: #f6f6f4;
	--eqb-badge-bg: #e5edff;
	--eqb-badge-ink: #0540a6;
	--eqb-chip-x: #d9d4c2;
	--eqb-check: #c3c9cc;
	/* 1280px of content inside 20px gutters -> 1320px border-box. */
	--eqb-max: 1320px;

	box-sizing: border-box;
	max-width: var(--eqb-max);
	margin-inline: auto;
	padding-inline: 20px;
	font-family: Lato, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
	color: var(--eqb-ink);
}

.eqb *,
.eqb *::before,
.eqb *::after { box-sizing: border-box; }

.eqb :focus-visible {
	outline: 3px solid var(--eqb-teal);
	outline-offset: 2px;
}

/* --------------------------------------------------------------- Stars */
/* Shared by the archive cards and the product page, so it lives here. */

.eqb .eqb-stars {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: #f0a500;
	--eqb-star-empty: #e4e0cf;
	line-height: 0;
	white-space: nowrap;
}
.eqb .eqb-star {
	flex: none;
	width: var(--eqb-star-size, 19px);
	height: var(--eqb-star-size, 19px);
	display: block;
}

/* ---------------------------------------------------------------- Buttons */

.eqb .eqb-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 0;
	border-radius: 3px;
	color: #fff;
	cursor: pointer;
	font-size: 18px;
	line-height: 18px;
	text-decoration: none;
	transition: filter .15s ease;
}
.eqb .eqb-btn:hover { filter: brightness(.92); color: #fff; }
.eqb .eqb-btn--teal { background: var(--eqb-teal); font-weight: 700; padding: 14px 40px; }
.eqb .eqb-btn--blue { background: var(--eqb-blue); padding: 12px 18px; }
.eqb .eqb-btn--block { display: flex; width: 100%; }

.eqb .eqb-link-btn {
	background: none;
	border: 0;
	padding: 1px 6px;
	color: var(--eqb-teal);
	font-size: 18px;
	font-weight: 700;
	cursor: pointer;
	text-decoration: none;
}
.eqb .eqb-link-btn:hover { text-decoration: underline; }

.eqb .eqb-pill {
	display: inline-block;
	background: var(--eqb-cream);
	border-radius: 3px;
	padding: 4px 14px;
	color: var(--eqb-ink);
	font-size: 18px;
	font-weight: 700;
	line-height: 30.6px;
}

/* ------------------------------------------------------------- Breadcrumb */

.eqb-crumbs { padding-block: 16px; }
.eqb-crumbs__list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.eqb-crumbs__item { margin: 0; font-size: 18px; line-height: 30.6px; }
.eqb-crumbs__item a { color: var(--eqb-muted); text-decoration: none; }
.eqb-crumbs__item a:hover { color: var(--eqb-teal); text-decoration: underline; }
.eqb-crumbs__item span { color: var(--eqb-ink); font-weight: 700; }
.eqb-crumbs__sep { color: #bdb9a8; font-size: 18px; line-height: 30.6px; }

@media (max-width: 560px) {
	.eqb-crumbs__item,
	.eqb-crumbs__sep { font-size: 15px; line-height: 26px; }
	.eqb-crumbs__list { gap: 7px; }
}

/* ------------------------------------------------------------------ Intro */

.eqb-intro {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
	gap: 56px;
	align-items: center;
	padding-bottom: 40px;
}
.eqb-intro__text { display: flex; flex-direction: column; align-items: flex-start; gap: 17px; }
.eqb-intro__eyebrow {
	margin: 0;
	color: var(--eqb-muted);
	font-size: 20px;
	font-weight: 900;
	line-height: 32px;
	letter-spacing: 2.8px;
	text-transform: uppercase;
}
.eqb-intro__title {
	margin: 0;
	color: var(--eqb-ink);
	font-size: 46px;
	font-weight: 700;
	line-height: 49.68px;
}
.eqb-intro__desc,
.eqb-intro__support { color: var(--eqb-muted); font-size: 20px; line-height: 32px; }
.eqb-intro__desc p,
.eqb-intro__support p { margin: 0 0 8px; }
.eqb-intro__media { min-height: 320px; }
.eqb-intro__media img {
	display: block;
	width: 100%;
	height: 320px;
	object-fit: cover;
	border-radius: 14px;
}
.eqb-intro__media-fallback {
	width: 100%;
	height: 320px;
	border-radius: 14px;
	background: linear-gradient(135deg, var(--eqb-media), var(--eqb-cream));
	border: 1px solid var(--eqb-line);
}

/* ----------------------------------------------------------- Subcategories */

.eqb-subcats { padding-block: 14px 40px; }

/* Three tiles to a view, scrolled rather than wrapped. The number per view is
   set on the item's flex-basis, so the breakpoints below only restate that one
   value. */
.eqb-subcats__slider { position: relative; }
.eqb-subcats__grid {
	display: flex;
	align-items: stretch;
	gap: 24px;
	margin: 0;
	/* A scroll container clips its overflow, which would cut the hover lift and the
	   shadow under each tile. The padding makes room and the negative margin takes
	   the same room back, so the section's spacing is unchanged. */
	padding: 6px 0 26px;
	margin-block: -6px -26px;
	list-style: none;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	overscroll-behavior-x: contain;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}
.eqb-subcats__grid::-webkit-scrollbar { display: none; }
.eqb-subcats__item {
	display: flex;
	flex: 0 0 calc((100% - 48px) / 3);
	margin: 0;
	scroll-snap-align: start;
}
.eqb-subcats__item > .eqb-subcat { width: 100%; }

.eqb-subcats__nav {
	position: absolute;
	top: 50%;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	background: #fff;
	border: 1px solid var(--eqb-line);
	border-radius: 50%;
	color: var(--eqb-ink);
	cursor: pointer;
	box-shadow: 0 4px 14px rgba(3, 59, 76, .12);
	transform: translateY(-50%);
	transition: opacity .15s ease, box-shadow .15s ease;
}
.eqb-subcats__nav:hover { box-shadow: 0 6px 20px rgba(3, 59, 76, .18); }
.eqb-subcats__nav svg { width: 18px; height: 18px; }
.eqb-subcats__nav--prev { left: -18px; }
.eqb-subcats__nav--next { right: -18px; }
/* At either end, and when nothing can scroll, the arrow gets out of the way. */
.eqb-subcats__nav[disabled] { opacity: 0; pointer-events: none; }
.eqb-subcats__slider.is-static .eqb-subcats__nav { display: none; }
.eqb-subcat {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 9px;
	height: 100%;
	padding: 27px 25px;
	background: #fff;
	border: 1px solid var(--eqb-line);
	border-radius: 12px;
	text-decoration: none;
	transition: box-shadow .15s ease, transform .15s ease;
}
.eqb-subcat:hover { box-shadow: 0 6px 20px rgba(3, 59, 76, .08); transform: translateY(-2px); }
.eqb-subcat__title { margin: 0; color: var(--eqb-teal); font-size: 22px; font-weight: 700; line-height: 23.76px; }
.eqb-subcat__desc { margin: 0 0 5px; color: var(--eqb-muted); font-size: 18px; line-height: 28.8px; }
.eqb-subcat .eqb-pill { margin-top: auto; }

/* ------------------------------------------------------------------- Shop */

.eqb-shop {
	display: grid;
	grid-template-columns: 320px minmax(0, 1fr);
	gap: 36px;
	align-items: start;
	padding-block: 20px 60px;
}

.eqb-filter-toggle { display: none; }

/* Filters */

.eqb-shop__aside {
    border: 1px solid #9393931A;
    padding: 22px;
    border-radius: 20px;
}

.eqb-filters { width: 100%; }
.eqb-filters__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding-block: 17px;
	border-bottom: 1px solid var(--eqb-line);
}
.eqb-filters__title { margin: 0; color: var(--eqb-ink); font-size: 20px; font-weight: 700; line-height: 24px; }
.eqb-filters__close { display: none; }

.eqb-group { border-bottom: 1px solid var(--eqb-line); }
.eqb-group__heading { margin: 0; font-size: inherit; font-weight: inherit; }
.eqb-group__summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 18px 0;
	background: none;
	border: 0;
	color: var(--eqb-ink);
	font-family: inherit;
	font-size: 18px;
	font-weight: 700;
	line-height: 30.6px;
	text-align: left;
	cursor: pointer;
}
.eqb-chev { flex: none; transition: transform .18s ease; }
.eqb-group__summary[aria-expanded="true"] .eqb-chev { transform: rotate(180deg); }
.eqb-group__panel { padding-bottom: 18px; }

.eqb-check { display: flex; align-items: flex-start; gap: 11px; padding-block: 7px; }
.eqb-check input[type="checkbox"] {
	flex: none;
	width: 20px;
	height: 20px;
	margin: 3px 0 0 4px;
	appearance: none;
	-webkit-appearance: none;
	background: #fff;
	border: 2px solid var(--eqb-check);
	border-radius: 4px;
	cursor: pointer;
}
.eqb-check input[type="checkbox"]:checked {
	background: var(--eqb-teal);
	border-color: var(--eqb-teal);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8.5l3.2 3.2L13 4.8' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 14px;
}
.eqb-check label {
	color: var(--eqb-ink);
	font-size: 18px;
	line-height: 26.1px;
	cursor: pointer;
}
.eqb-check__count { color: var(--eqb-muted); }
.eqb-showmore { padding-block: 6px; }

.eqb-price { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.eqb-price input {
	width: 88px;
	padding: 9px 10px;
	border: 2px solid var(--eqb-line);
	border-radius: 6px;
	color: var(--eqb-ink);
	font-family: inherit;
	font-size: 16px;
}
.eqb-price__apply {
	padding: 9px 14px;
	background: var(--eqb-teal);
	border: 0;
	border-radius: 6px;
	color: #fff;
	font-family: inherit;
	font-size: 16px;
	font-weight: 700;
	cursor: pointer;
}

.eqb-quote {
	margin-top: 24px;
	padding: 24px 20px 20px;
	background: var(--eqb-cream);
	border-radius: 10px;
}
.eqb-quote__title { margin: 0 0 8px; color: var(--eqb-ink); font-size: 18px; font-weight: 700; line-height: 19.44px; }
.eqb-quote__text { margin: 0 0 14px; color: var(--eqb-muted); font-size: 18px; line-height: 27px; }

/* Results */

.eqb-shop__results { min-width: 0; }

.eqb-toolbar {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	padding: 16px 20px;
	background: #fff;
	border: 1px solid var(--eqb-line);
	border-radius: 12px;
}
.eqb-count { margin: 0; width: 100%; color: var(--eqb-muted); font-size: 18px; line-height: 30.6px; }
.eqb-count strong { color: var(--eqb-ink); font-weight: 700; }
.eqb-toolbar__controls { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin-left: auto; }
.eqb-field { display: inline-flex; align-items: center; gap: 10px; }
.eqb-field label { color: var(--eqb-muted); font-size: 18px; line-height: 30.6px; white-space: nowrap; }
.eqb-field select {
	padding: 12px 36px 12px 16px;
	background-color: #fff;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M2 5l5 5 5-5' fill='none' stroke='%237d7d7d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 14px center;
	background-size: 14px;
	border: 2px solid var(--eqb-line);
	border-radius: 6px;
	color: var(--eqb-ink);
	font-family: inherit;
	font-size: 18px;
	line-height: 22px;
	appearance: none;
	-webkit-appearance: none;
	cursor: pointer;
}
.eqb-viewswitch { display: inline-flex; gap: 6px; }
.eqb-viewswitch button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	background: #fff;
	border: 2px solid var(--eqb-line);
	border-radius: 6px;
	color: var(--eqb-ink);
	cursor: pointer;
}
.eqb-viewswitch button.is-active { background: var(--eqb-teal); border-color: var(--eqb-teal); color: #fff; }

.eqb-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 22px; }
.eqb-chips__label { color: var(--eqb-ink); font-size: 18px; font-weight: 700; line-height: 30.6px; }
.eqb-chip {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	padding: 9px 17px;
	background: var(--eqb-cream);
	border: 1px solid var(--eqb-line);
	border-radius: 3px;
	color: var(--eqb-ink);
	font-size: 18px;
	line-height: 30.6px;
	text-decoration: none;
}
.eqb-chip:hover { color: var(--eqb-ink); }
.eqb-chip__x {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 20px;
	height: 20px;
	background: var(--eqb-chip-x);
	border-radius: 10px;
	color: var(--eqb-ink);
}

.eqb-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
	margin: 22px 0 0;
	padding: 0;
	list-style: none;
}

.eqb-card {
	display: flex;
	flex-direction: column;
	margin: 0;
	background: #fff;
	border: 1px solid var(--eqb-line);
	border-radius: 12px;
	overflow: hidden;
}
.eqb-card__media { position: relative; background: var(--eqb-media); }
.eqb-card__media img {
	display: block;
	width: 86.7%;
	height: 240px;
	margin: 0 auto;
	object-fit: contain;
	padding-block: 16px;
}
.eqb-badge {
	position: absolute;
	top: 14px;
	left: 14px;
	padding: 5px 13px;
	background: var(--eqb-badge-bg);
	border-radius: 4px;
	color: var(--eqb-badge-ink);
	font-size: 12px;
	font-weight: 900;
	line-height: 16px;
}
.eqb-card__body { display: flex; flex-direction: column; flex: 1; padding: 20px 22px 22px; }
.eqb-card__cat {
	margin-bottom: 8px;
	color: var(--eqb-teal);
	font-size: 18px;
	font-weight: 700;
	line-height: 30.6px;
	text-decoration: none;
}
.eqb-card__cat:hover { text-decoration: underline; }
.eqb-card__title { margin: 0 0 6px; font-size: 19px; font-weight: 700; line-height: 26.6px; }
.eqb-card__title a { color: var(--eqb-ink); text-decoration: none; }
.eqb-card__title a:hover { color: var(--eqb-teal); }
.eqb-card__meta { margin: 0 0 6px; color: var(--eqb-muted); font-size: 18px; line-height: 30.6px; }
.eqb-card__rating { display: flex; align-items: center; gap: 8px; margin: 0 0 14px; font-size: 16px; }
.eqb-card__rating .eqb-stars { gap: 3px; }
.eqb-card__avg { color: var(--eqb-ink); font-weight: 700; }
.eqb-card__reviews { color: var(--eqb-muted); }
.eqb-card__foot {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-top: auto;
	padding-top: 17px;
	border-top: 1px solid var(--eqb-line);
}
.eqb-card__price { margin: 0; color: var(--eqb-ink); font-size: 20px; font-weight: 700; line-height: 34px; }
.eqb-card__price del { color: var(--eqb-muted); font-weight: 400; }
.eqb-card__sizes { margin: 0; color: var(--eqb-muted); font-size: 18px; line-height: 30.6px; }
.eqb-card__price + .eqb-card__sizes { margin-top: -8px; }

/* List view */
.eqb-grid.is-list { grid-template-columns: minmax(0, 1fr); }
.eqb-grid.is-list .eqb-card { flex-direction: row; }
.eqb-grid.is-list .eqb-card__media { flex: 0 0 260px; }
.eqb-grid.is-list .eqb-card__foot { flex-direction: row; align-items: center; gap: 20px; }
.eqb-grid.is-list .eqb-card__foot .eqb-btn { width: auto; margin-left: auto; }
.eqb-grid.is-list .eqb-card__sizes { margin: 0; }

.eqb-empty {
	margin-top: 22px;
	padding: 48px 24px;
	background: #fff;
	border: 1px solid var(--eqb-line);
	border-radius: 12px;
	text-align: center;
}
.eqb-empty__title { margin: 0 0 6px; font-size: 22px; font-weight: 700; }
.eqb-empty__text { margin: 0 0 20px; color: var(--eqb-muted); font-size: 18px; }

.eqb-pagination { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 9px; padding-top: 22px; }
.eqb-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 48px;
	height: 48px;
	padding-inline: 16px;
	background: #fff;
	border: 2px solid var(--eqb-line);
	border-radius: 6px;
	color: var(--eqb-ink);
	font-size: 18px;
	font-weight: 700;
	line-height: 30.6px;
	text-decoration: none;
}
.eqb-pagination .page-numbers.current { background: var(--eqb-teal); border-color: var(--eqb-teal); color: #fff; }
.eqb-pagination a.page-numbers:hover { border-color: var(--eqb-teal); color: var(--eqb-teal); }
.eqb-pagination .dots { border-color: transparent; }

.eqb.is-loading { opacity: .55; pointer-events: none; }

/* ---------------------------------------------------------------- SEO copy */

.eqb-seo { background: var(--eqb-cream, #f7f3e4); padding-block: 70px 88px; }
/* Full-bleed: this block is not held to the 1320px the rest of the archive
   uses. The side gutter stays so the copy never touches the screen edge. */
.eqb-seo__inner { display: flex; flex-direction: column; gap: 18px; max-width: 1280px; }
.eqb-seo__title { margin: 0; color: #033b4c; font-size: 36px; font-weight: 700; line-height: 38.88px; }
.eqb-seo__body { max-width: none; color: #7d7d7d; font-size: 20px; line-height: 33px; }
.eqb-seo__body p { margin: 0 0 14px; }
.eqb-seo__body h2,
.eqb-seo__body h3,
.eqb-seo__body h4 { margin: 26px 0 10px; color: #033b4c; font-weight: 700; line-height: 1.25; }
.eqb-seo__body h2 { font-size: 26px; }
.eqb-seo__body h3 { font-size: 22px; }
.eqb-seo__body h4 { font-size: 20px; }
.eqb-seo__body a { color: var(--eqb-teal, #008181); font-weight: 700; }
.eqb-seo__body ul,
.eqb-seo__body ol { margin: 0 0 14px; padding-left: 22px; }
.eqb-seo__body img { max-width: 100%; height: auto; }

@media (max-width: 880px) {
	.eqb-seo { padding-block: 44px 52px; }
	.eqb-seo__title { font-size: 26px; line-height: 1.2; }
	.eqb-seo__body { font-size: 17px; line-height: 29px; }
}

/* ------------------------------------------------------------- Responsive */

@media (max-width: 1100px) {
	.eqb-intro { gap: 36px; }
	.eqb-intro__title { font-size: 38px; line-height: 1.15; }
	.eqb-shop { grid-template-columns: 252px minmax(0, 1fr); gap: 28px; }
	.eqb-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.eqb-subcats__item { flex-basis: calc((100% - 24px) / 2); }
}

@media (max-width: 880px) {
	.eqb-intro { grid-template-columns: minmax(0, 1fr); padding-block: 28px; }
	.eqb-intro__media { order: -1; min-height: 0; }
	.eqb-intro__media img,
	.eqb-intro__media-fallback { height: 240px; }
	.eqb-intro__title { font-size: 32px; }
	.eqb-intro__eyebrow,
	.eqb-intro__desc,
	.eqb-intro__support { font-size: 17px; line-height: 28px; }

	.eqb-shop { grid-template-columns: minmax(0, 1fr); gap: 0; }

	.eqb-filter-toggle {
		display: inline-flex;
		align-items: center;
		gap: 8px;
		margin-bottom: 16px;
		padding: 13px 22px;
		background: var(--eqb-teal);
		border: 0;
		border-radius: 6px;
		color: #fff;
		font-family: inherit;
		font-size: 17px;
		font-weight: 700;
		cursor: pointer;
	}

	/* Filter drawer */
	.eqb-shop__aside {
		position: fixed;
		inset: 0 auto 0 0;
		z-index: 100000;
		width: min(340px, 88vw);
		padding: 0 20px 24px;
		background: #fff;
		overflow-y: auto;
		transform: translateX(-102%);
		transition: transform .22s ease;
		box-shadow: 0 0 40px rgba(0, 0, 0, .18);
	}
	.eqb-shop__aside.is-open { transform: none; }
	.eqb-filters__head { position: sticky; top: 0; background: #fff; }
	.eqb-filters__close {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 36px;
		height: 36px;
		background: none;
		border: 0;
		color: var(--eqb-ink);
		font-size: 28px;
		line-height: 1;
		cursor: pointer;
	}
	body.eqb-drawer-open { overflow: hidden; }
	.eqb-backdrop {
		position: fixed;
		inset: 0;
		z-index: 99999;
		background: rgba(3, 59, 76, .45);
		border: 0;
	}

	.eqb-toolbar { padding: 14px 16px; }
	.eqb-toolbar__controls { width: 100%; margin-left: 0; }
	.eqb-field { flex: 1 1 240px; }
	.eqb-field select { width: 100%; min-width: 0; }
	.eqb-viewswitch { display: none; }
}

@media (max-width: 560px) {
	.eqb { padding-inline: 16px; }
	.eqb-grid { grid-template-columns: minmax(0, 1fr); }
	.eqb-subcats__item { flex-basis: 100%; }
	/* Inside the 16px gutter there is no room to hang the arrows outside. */
	.eqb-subcats__nav--prev { left: 2px; }
	.eqb-subcats__nav--next { right: 2px; }
	.eqb-intro__title { font-size: 27px; line-height: 1.2; }
	.eqb-card__media img { height: 200px; }
	.eqb-grid.is-list .eqb-card { flex-direction: column; }
	.eqb-grid.is-list .eqb-card__media { flex: none; }
	.eqb-pagination .page-numbers { min-width: 42px; height: 42px; padding-inline: 12px; font-size: 16px; }
}
