/* Modellsidor (Xenonkungen) - foljer sajtens designsystem.
   Tokens: accent #ff6a00/#f86102, text #1a1a1a, border #e4e5e7, radie 8px.
   Brytpunkter: 1400 / 1100 / 992 / 768 / 460. */

.luxtar-ms {
	max-width: 1600px;
	margin: 0 auto;
	padding: 24px 15px 56px;
	background: #fff;
	color: #1a1a1a;
	box-sizing: border-box;
}
.luxtar-ms *,
.luxtar-ms *::before,
.luxtar-ms *::after { box-sizing: border-box; }

/* Forifylld valjar-modul i toppen ska ha full bredd, inte den smala vyn. */
.luxtar-ms .luxtar-bv { max-width: 100%; }

/* Brodsmulor */
.luxtar-ms__crumbs {
	font-size: 13px;
	color: #6b7280;
	margin: 0 0 14px;
}
.luxtar-ms__crumbs a { color: #6b7280; text-decoration: none; }
.luxtar-ms__crumbs a:hover { color: #f86102; }

/* Rubriker + intro */
.luxtar-ms__h1 {
	font-size: 30px;
	line-height: 1.2;
	margin: 0 0 10px;
	color: #1a1a1a;
}
.luxtar-ms__intro {
	font-size: 16px;
	line-height: 1.6;
	color: #3a444e;
	max-width: 900px;
	margin: 0 0 26px;
}
.luxtar-ms__back {
	display: inline-block;
	font-size: 14px;
	color: #6b7280;
	text-decoration: none;
	margin: 0 0 18px;
}
.luxtar-ms__back:hover { color: #f86102; }

/* Filter: kategoriankare som pills + arsvaljare */
.luxtar-ms__filters {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin: 0 0 30px;
	padding: 14px 0 16px;
	border-bottom: 1px solid #e4e5e7;
	position: sticky;
	top: var(--lms-header-h, 132px);
	z-index: 100;
	background: #fff;
}
.luxtar-ms__cats {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	list-style: none;
	margin: 0;
	padding: 0;
}
.luxtar-ms__cat a,
.luxtar-ms__cat {
	display: inline-block;
	padding: 8px 16px;
	background: #f4f4f5;
	border: 1px solid #e4e5e7;
	border-radius: 999px;
	font-size: 14px;
	color: #1a1a1a;
	text-decoration: none;
	transition: border-color .15s, color .15s;
}
.luxtar-ms__cat a:hover {
	border-color: #ff6a00;
	color: #f86102;
}
/* Arsfilter som tydlig kontroll - skild fran kategori-pillsen (som bara ar hopplankar). */
.luxtar-ms__filter {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-right: 6px;
	padding: 6px 8px 6px 12px;
	background: #fff;
	border: 1.5px solid #cfd1d4;
	border-radius: 10px;
}
.luxtar-ms__filter-ic { color: #ff6a00; flex: 0 0 auto; }
.luxtar-ms__filter-label {
	font-size: 13px;
	font-weight: 600;
	color: #3a444e;
	white-space: nowrap;
}
.luxtar-ms__year {
	padding: 8px 12px;
	border: 1px solid #cfd1d4;
	border-radius: 8px;
	background: #f6f6f7;
	font-size: 14px;
	color: #1a1a1a;
	cursor: pointer;
}
.luxtar-ms__year:focus { outline: 2px solid #ff6a00; outline-offset: 1px; }

/* Sektioner */
.luxtar-ms__section { margin: 0 0 44px; scroll-margin-top: calc(var(--lms-header-h, 132px) + var(--lms-filters-h, 71px) + 14px); }
.luxtar-ms__h,
.luxtar-ms__h2 {
	font-size: 20px;
	margin: 0 0 6px;
	color: #1a1a1a;
}
.luxtar-ms__dd {
	font-size: 15px;
	color: #3a444e;
	margin: 0 0 18px;
}

/* Produktgrid: temat lindar korten i <ul class="products"> - lagg grid:et DAR
   sa korten blir grid-barn. 5 per rad pa desktop, ned till 1 enligt brytpunkterna. */
.luxtar-ms__cards { display: block; }
.luxtar-ms__cards .products {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 16px;
	margin: 0;
	padding: 0;
	list-style: none;
	width: 100%;
}
.luxtar-ms__cards .products::before,
.luxtar-ms__cards .products::after { display: none; content: none; }
.luxtar-ms__cards .products > li,
.luxtar-ms__cards li.product {
	width: auto !important;
	max-width: none !important;
	margin: 0 !important;
	float: none !important;
	clear: none !important;
	list-style: none;
}
.luxtar-ms__cards h3 {
	font-size: 15px;
	line-height: 1.35;
	margin: 8px 0 4px;
}

/* Crawlbara lankvagar som pills (hubb + markessida) */
.luxtar-ms__markeslista,
.luxtar-ms__modellista {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	list-style: none;
	margin: 24px 0 0;
	padding: 0;
}
.luxtar-ms__markeslista a,
.luxtar-ms__modellista a {
	display: inline-block;
	padding: 8px 16px;
	background: #f4f4f5;
	border: 1px solid #e4e5e7;
	border-radius: 999px;
	font-size: 14px;
	color: #1a1a1a;
	text-decoration: none;
	transition: border-color .15s, color .15s;
}
.luxtar-ms__markeslista a:hover,
.luxtar-ms__modellista a:hover {
	border-color: #ff6a00;
	color: #f86102;
}

/* Relaterat */
.luxtar-ms__related { margin: 40px 0 0; padding: 24px 0 0; border-top: 1px solid #e4e5e7; }
.luxtar-ms__related ul { display: flex; flex-wrap: wrap; gap: 10px; list-style: none; margin: 0 0 12px; padding: 0; }
.luxtar-ms__related a {
	display: inline-block; padding: 8px 16px; background: #f4f4f5;
	border: 1px solid #e4e5e7; border-radius: 999px; font-size: 14px;
	color: #1a1a1a; text-decoration: none;
}
.luxtar-ms__related a:hover { border-color: #ff6a00; color: #f86102; }

/* Responsivt: brytpunkter 1400 / 1100 / 992 / 768 / 460 */
@media (max-width: 1400px) { .luxtar-ms__cards .products { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 1100px) { .luxtar-ms__cards .products { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 992px)  { .luxtar-ms__h1 { font-size: 26px; } }
@media (max-width: 768px) {
	.luxtar-ms { padding: 18px 10px 44px; }
	.luxtar-ms__cards .products { grid-template-columns: repeat(2, 1fr); gap: 12px; }
	.luxtar-ms__filter { width: 100%; margin-right: 0; box-sizing: border-box; }
	.luxtar-ms__year { margin-left: auto; }
}
@media (max-width: 460px) {
	.luxtar-ms__cards .products { grid-template-columns: 1fr; }
	.luxtar-ms__h1 { font-size: 22px; }
}