/* =========================================================================
   DELLUXES LUXURY — HOMEPAGE (front-page.php)
   Loaded only on the front page. Uses tokens from the main style.css :root.
   ========================================================================= */

/* ── Break the homepage out of Astra's boxed .ast-container ───────────── */
body.home #content .ast-container {
	max-width: 100% !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}
body.home #content.site-content { padding: 0 !important; }
body.home #page { overflow-x: clip; }
/* Astra sometimes prints an empty content padding wrapper on the front page */
body.home .ast-container > .site-content,
body.home .entry-content { margin: 0 !important; }

.dlx-home { overflow-x: clip; }

/* Neutralise Astra's default content container so sections go full-bleed. */
.dlx-home .dlx-hero-section,
.dlx-home .dlx-marquee,
.dlx-home .dlx-story,
.dlx-home .dlx-trust,
.dlx-home .dlx-news { width: 100%; }

/* Shared section wrapper */
.dlx-section {
	max-width: 1360px;
	margin-inline: auto;
	padding: clamp(3.5rem, 7vw, 6.5rem) clamp(1.2rem, 4vw, 3rem);
}
.dlx-section--tint {
	max-width: none;
	background: var(--dlx-ivory);
	border-block: 1px solid var(--dlx-line-soft);
}
.dlx-section--tint > * { max-width: 1360px; margin-inline: auto; }

.dlx-section__head { text-align: center; margin-bottom: clamp(2.5rem, 5vw, 4rem); }
.dlx-section__head h2 {
	font-family: var(--dlx-serif);
	font-size: clamp(2rem, 4vw, 3.2rem);
	font-weight: 500;
	margin: 0.2em 0 0;
}
.dlx-eyebrow--light { color: rgba(255,255,255,0.85); }

/* ============================== HERO ============================== */
.dlx-hero-section {
	position: relative;
	min-height: 88vh;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	color: #fff;
	background-color: #26221d;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}
/* Elegant fallback when no hero image is set */
.dlx-hero-section:not([style]),
.dlx-hero-section[style=""] {
	background: radial-gradient(120% 120% at 50% 0%, #3a342c 0%, #26221d 55%, #171410 100%);
}
.dlx-hero-content {
	position: relative;
	z-index: 2;
	max-width: 720px;
	padding: 2rem;
}
.dlx-hero-content h1 {
	color: #fff !important;
	font-family: var(--dlx-serif);
	font-weight: 500;
	font-size: clamp(2.8rem, 6.5vw, 5.5rem);
	line-height: 1.05;
	margin: 0.3em 0 0.5em;
	text-shadow: 0 2px 40px rgba(0,0,0,0.35);
}
.dlx-hero-content p {
	font-size: clamp(1rem, 1.4vw, 1.15rem);
	line-height: 1.7;
	max-width: 52ch;
	margin: 0 auto 2.2rem;
	color: rgba(255,255,255,0.92);
}
.dlx-hero-btn {
	display: inline-block;
	background: var(--dlx-cream);
	color: var(--dlx-charcoal) !important;
	text-transform: uppercase;
	letter-spacing: var(--dlx-track);
	font-size: 0.74rem;
	padding: 1.15em 2.8em;
	border: 1px solid var(--dlx-cream);
	border-radius: var(--dlx-radius);
	transition: background var(--dlx-fast), color var(--dlx-fast);
}
.dlx-hero-btn:hover {
	background: transparent;
	color: #fff !important;
	border-color: #fff;
}

/* ============================ MARQUEE ============================ */
.dlx-marquee {
	background: var(--dlx-charcoal);
	color: var(--dlx-cream);
	overflow: hidden;
	padding: 1.4rem 0;
	white-space: nowrap;
}
.dlx-marquee__track {
	display: inline-flex;
	align-items: center;
	gap: 2.2rem;
	animation: dlx-scroll 38s linear infinite;
}
.dlx-marquee__item {
	font-family: var(--dlx-serif);
	font-size: 1.35rem;
	letter-spacing: 0.12em;
	opacity: 0.9;
}
.dlx-marquee__dot { opacity: 0.4; }
@keyframes dlx-scroll {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
	.dlx-marquee__track { animation: none; justify-content: center; flex-wrap: wrap; white-space: normal; }
}

/* ========================= CATEGORY GRID ========================= */
.dlx-cat-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.8rem;
}
.dlx-cat-card {
	display: flex;
	flex-direction: column;
	text-align: center;
	color: var(--dlx-charcoal) !important;
}
.dlx-cat-card__img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 5;
	/* Logos must show in full — contain, centred, on white, with breathing room */
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	background-origin: content-box;
	padding: 16% 15%;
	background-color: #fff;
	border: 1px solid var(--dlx-line-soft);
	border-radius: var(--dlx-radius);
	transition: transform var(--dlx-slow), box-shadow var(--dlx-fast);
	will-change: transform;
}
.dlx-cat-card:hover .dlx-cat-card__img {
	transform: scale(1.03);
	box-shadow: 0 30px 60px -40px rgba(28,26,23,0.5);
}

/* Elegant typographic tile when a brand has no uploaded image */
.dlx-cat-card--text .dlx-cat-card__img {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1.2rem;
	background: linear-gradient(160deg, #efe9df 0%, #e2d9ca 100%);
	border: 1px solid var(--dlx-line);
}
.dlx-cat-card__wordmark {
	font-family: var(--dlx-serif);
	font-size: clamp(1.3rem, 2.4vw, 2rem);
	letter-spacing: 0.04em;
	color: var(--dlx-charcoal);
	text-align: center;
	line-height: 1.15;
	text-transform: uppercase;
}
.dlx-cat-card--text:hover .dlx-cat-card__img { transform: scale(1.03); }
.dlx-cat-card__name {
	font-family: var(--dlx-serif);
	font-size: 1.35rem;
	margin-top: 1.1rem;
}
.dlx-cat-card__count {
	font-size: 0.68rem;
	text-transform: uppercase;
	letter-spacing: var(--dlx-track);
	color: var(--dlx-taupe);
	margin-top: 0.35rem;
}

/* ===================== SHORTCODE PRODUCT GRIDS ===================== */
/* The [products] shortcode inherits the hardened grid from style.css.
   Just ensure it fills the section width. */
.dlx-shortcode-grid .woocommerce,
.dlx-shortcode-grid .columns-4 { width: 100%; }

/* ======================= AUTHENTICITY STORY ======================= */
.dlx-story {
	display: grid;
	grid-template-columns: 1fr 1fr;
	align-items: stretch;
	min-height: 60vh;
}
.dlx-story__text {
	background: var(--dlx-charcoal);
	color: var(--dlx-cream);
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: clamp(2.5rem, 6vw, 6rem);
}
.dlx-story__text h2 {
	color: var(--dlx-cream);
	font-family: var(--dlx-serif);
	font-size: clamp(2rem, 3.5vw, 3rem);
	font-weight: 500;
	margin: 0.3em 0 0.6em;
}
.dlx-story__text p {
	color: rgba(245,241,234,0.8);
	line-height: 1.85;
	max-width: 44ch;
	margin-bottom: 2rem;
}
.dlx-story__text .dlx-link { color: var(--dlx-cream); }
.dlx-story__text .dlx-link::after { background: var(--dlx-cream); }
.dlx-story__img {
	background-color: #cbbfae;
	background-size: cover;
	background-position: center;
	min-height: 340px;
}
/* Fallback pattern if no story image */
.dlx-story__img:not([style]) {
	background: linear-gradient(135deg, #d8ccb8 0%, #b9a88f 100%);
}

/* ============================ TRUST STRIP ============================ */
.dlx-trust {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1px;
	background: var(--dlx-line);
	border-block: 1px solid var(--dlx-line);
}
.dlx-trust__item {
	background: var(--dlx-cream);
	text-align: center;
	padding: 2.6rem 1.5rem;
}
.dlx-trust__k {
	display: block;
	font-family: var(--dlx-serif);
	font-size: 1.25rem;
	color: var(--dlx-charcoal);
}
.dlx-trust__v {
	display: block;
	margin-top: 0.4rem;
	font-size: 0.72rem;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--dlx-taupe);
}

/* ============================ NEWSLETTER ============================ */
.dlx-news {
	text-align: center;
	padding: clamp(3.5rem, 7vw, 6rem) 1.5rem;
	background: radial-gradient(120% 120% at 50% 0%, #2f2a23 0%, #1f1c17 100%);
	color: var(--dlx-cream);
}
.dlx-news h2 {
	color: var(--dlx-cream);
	font-family: var(--dlx-serif);
	font-size: clamp(1.9rem, 3.5vw, 2.8rem);
	font-weight: 500;
	margin: 0.3em 0 0.4em;
}
.dlx-news p { color: rgba(245,241,234,0.8); max-width: 46ch; margin: 0 auto 2rem; }
.dlx-news__form {
	display: flex;
	max-width: 480px;
	margin: 0 auto 1rem;
	gap: 0.6rem;
}
.dlx-news__form input {
	flex: 1;
	background: rgba(255,255,255,0.06) !important;
	border: 1px solid rgba(245,241,234,0.35) !important;
	color: #fff !important;
	padding: 1em 1.2em !important;
	border-radius: var(--dlx-radius) !important;
}
.dlx-news__form input::placeholder { color: rgba(245,241,234,0.55); }
.dlx-news__form button {
	background: var(--dlx-cream) !important;
	color: var(--dlx-charcoal) !important;
	border: 1px solid var(--dlx-cream) !important;
	white-space: nowrap;
}
.dlx-news__form button:hover {
	background: transparent !important;
	color: var(--dlx-cream) !important;
	border-color: var(--dlx-cream) !important;
}
.dlx-news small { font-size: 0.68rem; letter-spacing: 0.04em; }

/* ============================ RESPONSIVE ============================ */
@media (max-width: 1024px) {
	.dlx-cat-grid { grid-template-columns: repeat(2, 1fr); gap: 1.4rem; }
}
@media (max-width: 768px) {
	.dlx-story { grid-template-columns: 1fr; }
	.dlx-story__img { min-height: 300px; order: -1; }
	.dlx-trust { grid-template-columns: 1fr; }
	.dlx-hero-section { min-height: 74vh; }
}
@media (max-width: 480px) {
	.dlx-cat-grid { grid-template-columns: 1fr 1fr; gap: 1rem; }
	.dlx-news__form { flex-direction: column; }
	.dlx-marquee__item { font-size: 1.1rem; }
}
