/* ==========================================================================
   DSDMods Dealer Platform
   Everything is scoped to .dsdd- so it can't fight Astra, Elementor or
   the DSD System plugin. Fonts are inherited from the theme on purpose.

   The signature: a "tint fade". Automotive window film graduates from
   limo-dark to clear, so the hero does the same thing. It's the product's
   own material, used as the page's one bold move.
   ========================================================================== */

/* ==========================================================================
   Take the full canvas back from the theme.

   Astra drops custom post types into its blog layout: a narrow #primary
   column with a #secondary sidebar beside it. That is why the hero stopped
   halfway and everything piled up on the left. The PHP filters should handle
   this, but they depend on Astra's version, so we also do it here with the
   body classes WordPress always adds. This cannot fail.
   ========================================================================== */

.single-dsdd_dealer #secondary,
.post-type-archive-dsdd_dealer #secondary,
.tax-dsdd_type #secondary,
.tax-dsdd_service #secondary,
.tax-dsdd_state #secondary { display: none !important; }

.single-dsdd_dealer #primary,
.post-type-archive-dsdd_dealer #primary,
.tax-dsdd_type #primary,
.tax-dsdd_service #primary,
.tax-dsdd_state #primary {
	width: 100% !important;
	max-width: 100% !important;
	flex: 0 0 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
}

.single-dsdd_dealer .ast-container,
.post-type-archive-dsdd_dealer .ast-container,
.tax-dsdd_type .ast-container,
.tax-dsdd_service .ast-container,
.tax-dsdd_state .ast-container {
	max-width: 100% !important;
	width: 100% !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	display: block !important;
}

.single-dsdd_dealer .site-content,
.post-type-archive-dsdd_dealer .site-content,
.tax-dsdd_type .site-content,
.tax-dsdd_service .site-content,
.tax-dsdd_state .site-content { padding: 0 !important; }

/* Astra's boxed "article card" styling — we bring our own. */
.single-dsdd_dealer .ast-article-single,
.single-dsdd_dealer .ast-article-post,
.post-type-archive-dsdd_dealer .ast-article-single,
.post-type-archive-dsdd_dealer .ast-article-post {
	padding: 0 !important;
	margin: 0 !important;
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
}

/* Kill any theme byline/nav that leaks onto our pages. */
.dsdd-single ~ .post-navigation,
.dsdd-archive ~ .post-navigation,
.single-dsdd_dealer .entry-meta,
.single-dsdd_dealer .ast-single-post-navigation,
.single-dsdd_dealer .post-navigation,
.single-dsdd_dealer .entry-title { display: none !important; }

/* Our templates own their layout — don't let a theme column squeeze them. */
.dsdd-single,
.dsdd-archive { width: 100%; max-width: 100%; }

.dsdd-single,
.dsdd-archive {
	--dsdd-ink:      #0b0d10;
	--dsdd-surface:  #15181e;
	--dsdd-blue:     #1f5fff;
	--dsdd-blue-ink: #0e3fc4;
	--dsdd-muted:    #8a94a6;
	--dsdd-line:     #e3e7ee;
	--dsdd-wash:     #f6f8fb;
	--dsdd-radius:   14px;

	color: var(--dsdd-ink);
}

/* ── Hero: the tint fade ─────────────────────────────────────────── */

.dsdd-hero {
	position: relative;
	background: var(--dsdd-ink);
	background-image:
		linear-gradient(180deg, #05070a 0%, #10141b 55%, #1b2028 100%);
	color: #fff;
	overflow: hidden;

	/* Full bleed. The negative margin pulls the band out to the window edges,
	   and the matching padding pushes the content back where it belongs.
	   Works whether or not the theme wraps us in a container, and unlike
	   width:100vw it cannot cause a horizontal scrollbar. */
	margin-left:  calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	padding-left:  calc(50vw - 50%);
	padding-right: calc(50vw - 50%);
}

/* the film itself: a dark band bleeding down into clear */
.dsdd-hero::after {
	content: "";
	position: absolute;
	inset: auto 0 0 0;
	height: 60%;
	background: linear-gradient(180deg, rgba(31, 95, 255, 0) 0%, rgba(31, 95, 255, .16) 100%);
	pointer-events: none;
}

/* the squeegee line where film meets glass */
.dsdd-hero::before {
	content: "";
	position: absolute;
	inset: auto 0 0 0;
	height: 2px;
	background: linear-gradient(90deg, transparent, var(--dsdd-blue), transparent);
	opacity: .8;
}

.dsdd-hero__inner {
	position: relative;
	z-index: 1;
	max-width: 1120px;
	margin: 0 auto;
	padding: 44px 24px 52px;
}

.dsdd-hero__row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 32px;
}

.dsdd-hero__name {
	margin: 6px 0 0;
	font-size: clamp(1.9rem, 4vw, 2.9rem);
	font-weight: 800;
	line-height: 1.08;
	letter-spacing: -.015em;
	color: #fff;
}

.dsdd-hero__loc {
	margin: 10px 0 0;
	color: var(--dsdd-muted);
	font-size: 1.05rem;
}

.dsdd-hero__sub {
	margin: 14px 0 0;
	max-width: 62ch;
	color: #c3cad6;
	line-height: 1.6;
}

.dsdd-hero__logo {
	flex: 0 0 auto;
	width: 132px;
	height: 132px;
	display: grid;
	place-items: center;
	padding: 14px;
	background: #fff;
	border-radius: var(--dsdd-radius);
}

.dsdd-hero__logo img {
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
	object-fit: contain;
}

/* ── The letter-spaced eyebrow, matching the founder profile ─────── */

.dsdd-eyebrow {
	margin: 0;
	font-size: .68rem;
	font-weight: 700;
	letter-spacing: .22em;
	text-transform: uppercase;
	color: var(--dsdd-blue);
}

.dsdd-eyebrow--dark { color: var(--dsdd-muted); }

.dsdd-crumbs {
	margin: 0 0 22px;
	font-size: .8rem;
	color: var(--dsdd-muted);
}

.dsdd-crumbs a { color: var(--dsdd-muted); text-decoration: none; }
.dsdd-crumbs a:hover { color: #fff; }
.dsdd-crumbs span { margin: 0 8px; }

/* ── Body layout ─────────────────────────────────────────────────── */

.dsdd-body {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 320px;
	gap: 48px;
	max-width: 1120px;
	margin: 0 auto;
	padding: 48px 24px 72px;
}

.dsdd-block { margin: 0 0 40px; }

.dsdd-h2 {
	margin: 0 0 18px;
	padding-bottom: 10px;
	border-bottom: 1px solid var(--dsdd-line);
	font-size: 1.02rem;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
}

.dsdd-prose { margin: 0 0 36px; line-height: 1.7; }

/* ── Services ────────────────────────────────────────────────────── */

.dsdd-services {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.dsdd-service {
	padding: 7px 14px;
	border: 1px solid var(--dsdd-line);
	border-radius: 999px;
	background: var(--dsdd-wash);
	font-size: .875rem;
	font-weight: 500;
}

/* ── Spec sheet ──────────────────────────────────────────────────── */

.dsdd-specs { margin: 0; }

.dsdd-spec {
	display: grid;
	grid-template-columns: 130px minmax(0, 1fr);
	gap: 16px;
	padding: 14px 0;
	border-bottom: 1px solid var(--dsdd-line);
}

.dsdd-spec:last-child { border-bottom: 0; }

.dsdd-spec dt {
	font-size: .7rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--dsdd-muted);
	padding-top: 2px;
}

.dsdd-spec dd { margin: 0; line-height: 1.6; }

.dsdd-link {
	color: var(--dsdd-blue-ink);
	text-decoration: none;
	border-bottom: 1px solid rgba(31, 95, 255, .3);
}

.dsdd-link:hover { border-bottom-color: var(--dsdd-blue); }

/* ── Gallery ─────────────────────────────────────────────────────── */

.dsdd-gallery {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	gap: 12px;
}

.dsdd-shot { margin: 0; }

.dsdd-shot img {
	display: block;
	width: 100%;
	height: 190px;
	object-fit: cover;
	border-radius: 10px;
}

/* ── Action rail ─────────────────────────────────────────────────── */

.dsdd-rail { position: relative; }

.dsdd-rail__card {
	position: sticky;
	top: 24px;
	padding: 24px;
	border: 1px solid var(--dsdd-line);
	border-radius: var(--dsdd-radius);
	background: #fff;
	box-shadow: 0 1px 2px rgba(11, 13, 16, .04), 0 12px 32px rgba(11, 13, 16, .06);
}

.dsdd-btn {
	display: block;
	margin-top: 12px;
	padding: 14px 18px;
	border: 1px solid var(--dsdd-ink);
	border-radius: 10px;
	background: #fff;
	color: var(--dsdd-ink);
	font-weight: 600;
	font-size: .95rem;
	text-align: center;
	text-decoration: none;
	transition: transform .12s ease, background .12s ease, color .12s ease;
}

.dsdd-btn:hover { transform: translateY(-1px); background: var(--dsdd-ink); color: #fff; }

.dsdd-btn--primary {
	border-color: var(--dsdd-blue);
	background: var(--dsdd-blue);
	color: #fff;
}

.dsdd-btn--primary:hover { background: var(--dsdd-blue-ink); border-color: var(--dsdd-blue-ink); color: #fff; }

.dsdd-btn--ghost {
	border-color: var(--dsdd-line);
	color: var(--dsdd-ink);
	font-weight: 500;
}

.dsdd-btn--ghost:hover { background: var(--dsdd-wash); color: var(--dsdd-ink); }

.dsdd-rail__note {
	margin: 18px 0 0;
	font-size: .8rem;
	line-height: 1.5;
	color: var(--dsdd-muted);
}

.dsdd-back {
	display: block;
	margin-top: 18px;
	text-align: center;
	font-size: .85rem;
	color: var(--dsdd-muted);
	text-decoration: none;
}

.dsdd-back:hover { color: var(--dsdd-blue-ink); }

/* ── Locator ─────────────────────────────────────────────────────── */

.dsdd-archive__body {
	max-width: 1120px;
	margin: 0 auto;
	padding: 40px 24px 72px;
}

.dsdd-filters {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 14px;
	padding: 18px;
	border: 1px solid var(--dsdd-line);
	border-radius: var(--dsdd-radius);
	background: var(--dsdd-wash);
}

.dsdd-field { flex: 0 0 200px; }
.dsdd-field--grow { flex: 1 1 260px; }

.dsdd-label {
	display: block;
	margin-bottom: 6px;
	font-size: .68rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--dsdd-muted);
}

.dsdd-input {
	width: 100%;
	padding: 11px 13px;
	border: 1px solid var(--dsdd-line);
	border-radius: 9px;
	background: #fff;
	font-size: .95rem;
	color: var(--dsdd-ink);
}

.dsdd-input:focus {
	outline: 2px solid var(--dsdd-blue);
	outline-offset: 1px;
	border-color: var(--dsdd-blue);
}

.dsdd-clear {
	padding: 11px 18px;
	border: 1px solid var(--dsdd-line);
	border-radius: 9px;
	background: #fff;
	font-size: .9rem;
	font-weight: 600;
	color: var(--dsdd-ink);
	cursor: pointer;
}

.dsdd-clear:hover { background: var(--dsdd-ink); color: #fff; border-color: var(--dsdd-ink); }

.dsdd-count {
	margin: 20px 0 14px;
	font-size: .82rem;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--dsdd-muted);
}

.dsdd-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
	gap: 16px;
}

.dsdd-card {
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 20px;
	border: 1px solid var(--dsdd-line);
	border-radius: var(--dsdd-radius);
	background: #fff;
	text-decoration: none;
	color: inherit;
	overflow: hidden;
	transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease;
}

/* the tint fade again, quietly, on the card edge */
.dsdd-card::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 3px;
	background: linear-gradient(90deg, var(--dsdd-ink), var(--dsdd-blue) 60%, transparent);
	opacity: 0;
	transition: opacity .14s ease;
}

.dsdd-card:hover {
	transform: translateY(-2px);
	border-color: #cdd5e2;
	box-shadow: 0 10px 30px rgba(11, 13, 16, .08);
}

.dsdd-card:hover::before { opacity: 1; }

.dsdd-card:focus-visible {
	outline: 2px solid var(--dsdd-blue);
	outline-offset: 2px;
}

.dsdd-card__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin-bottom: 16px;
}

.dsdd-card__logo {
	width: 52px;
	height: 52px;
	object-fit: contain;
	border-radius: 8px;
}

.dsdd-card__logo--empty {
	display: grid;
	place-items: center;
	background: var(--dsdd-ink);
	color: #fff;
	font-size: .8rem;
	font-weight: 700;
	letter-spacing: .06em;
}

.dsdd-chip {
	padding: 4px 9px;
	border-radius: 999px;
	font-size: .62rem;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.dsdd-chip--center {
	background: rgba(31, 95, 255, .1);
	color: var(--dsdd-blue-ink);
}

.dsdd-card__name {
	margin: 0 0 4px;
	font-size: 1.06rem;
	font-weight: 700;
	line-height: 1.3;
}

.dsdd-card__loc {
	margin: 0 0 14px;
	font-size: .88rem;
	color: var(--dsdd-muted);
}

.dsdd-card__svcs {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0 0 18px;
	padding: 0;
	list-style: none;
}

.dsdd-card__svcs li {
	padding: 4px 9px;
	border: 1px solid var(--dsdd-line);
	border-radius: 6px;
	background: var(--dsdd-wash);
	font-size: .72rem;
	color: #4b5565;
}

.dsdd-card__go {
	margin-top: auto;
	font-size: .78rem;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--dsdd-blue-ink);
}

.dsdd-empty {
	padding: 40px 0;
	text-align: center;
	color: var(--dsdd-muted);
}

/* ── Responsive ──────────────────────────────────────────────────── */

@media (max-width: 900px) {
	.dsdd-body { grid-template-columns: 1fr; gap: 32px; padding: 32px 20px 56px; }
	.dsdd-rail__card { position: static; }
	.dsdd-hero__row { flex-direction: column-reverse; align-items: flex-start; gap: 20px; }
	.dsdd-hero__logo { width: 96px; height: 96px; }
	.dsdd-hero__inner { padding: 32px 20px 40px; }
}

@media (max-width: 600px) {
	.dsdd-spec { grid-template-columns: 1fr; gap: 4px; }
	.dsdd-field, .dsdd-field--grow { flex: 1 1 100%; }
	.dsdd-clear { width: 100%; }
	.dsdd-grid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
	.dsdd-card, .dsdd-btn { transition: none; }
	.dsdd-card:hover, .dsdd-btn:hover { transform: none; }
}