/*
 * The Lion Sleep — "the-lion-sleep" Elementor widget styles.
 */

.ls-w { position: relative; }
.ls-w * { box-sizing: border-box; min-width: 0; }
.ls-w a { color: inherit; }

/* ---------------------------------------------------------------------
 * Hero
 * ------------------------------------------------------------------- */
.ls-hero {
	position: relative;
	min-height: 640px;
	display: flex;
	align-items: center;
	background-size: cover;
	background-position: center;
	background-color: var( --ls-cream );
}
.ls-hero__scrim {
	position: absolute;
	inset: 0;
	background: linear-gradient( to top, rgba(10,9,7,.62) 0%, rgba(10,9,7,.15) 55%, rgba(10,9,7,.05) 100% );
}
.ls-hero__in {
	position: relative;
	z-index: 1;
	padding-block: 80px;
	text-align: center;
	max-width: 760px;
}
.ls-hero__title {
	color: #fff;
	font-size: clamp( 34px, 5.4vw, 62px );
	margin: 0 0 16px;
}
.ls-hero__lead {
	color: rgba(255,255,255,.9);
	font-size: 17px;
	line-height: 1.6;
	margin: 0 0 30px;
}
.ls-hero__actions { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }

/* ---------------------------------------------------------------------
 * Benefits
 * ------------------------------------------------------------------- */
.ls-benefits__grid {
	display: grid;
	grid-template-columns: repeat( 5, 1fr );
	gap: 28px;
	text-align: center;
}
.ls-benefit__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: var( --ls-cream );
	color: var( --ls-gold-dark );
	margin-bottom: 14px;
}
.ls-benefit__icon svg { width: 24px; height: 24px; }
.ls-benefit__title { font-size: 15px; font-weight: 600; margin: 0; }
.ls-benefits__cta { text-align: center; margin-top: 36px; }

@media ( max-width: 980px ) {
	.ls-benefits__grid { grid-template-columns: repeat( 3, 1fr ); }
}
@media ( max-width: 620px ) {
	.ls-benefits__grid { grid-template-columns: repeat( 2, 1fr ); }
}

/* ---------------------------------------------------------------------
 * Story teaser
 * ------------------------------------------------------------------- */
.ls-story__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 56px;
	align-items: center;
}
.ls-story--img-right .ls-story__media { order: 2; }
.ls-story__media img { width: 100%; height: auto; border-radius: var( --ls-radius ); display: block; }
.ls-story__title { font-size: clamp( 24px, 3vw, 34px ); margin: 0 0 16px; }
.ls-story__text { color: var( --ls-ink-soft ); line-height: 1.7; margin: 0 0 24px; }

@media ( max-width: 820px ) {
	.ls-story__grid { grid-template-columns: 1fr; gap: 28px; }
	.ls-story--img-right .ls-story__media { order: 0; }
}

/* ---------------------------------------------------------------------
 * Recent posts
 * ------------------------------------------------------------------- */
.ls-posts__grid { display: grid; gap: 28px; }
.ls-posts__grid--2 { grid-template-columns: repeat( 2, 1fr ); }
.ls-posts__grid--3 { grid-template-columns: repeat( 3, 1fr ); }
.ls-posts__grid--4 { grid-template-columns: repeat( 4, 1fr ); }

.ls-post-card { display: block; text-decoration: none; color: inherit; }
.ls-post-card__media {
	aspect-ratio: 4 / 3;
	overflow: hidden;
	border-radius: var( --ls-radius );
	background: var( --ls-cream );
	margin-bottom: 16px;
}
.ls-post-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s ease; }
.ls-post-card:hover .ls-post-card__media img { transform: scale(1.04); }
.ls-post-card__placeholder { display: block; width: 100%; height: 100%; }
.ls-post-card__date { font-size: 12px; color: var( --ls-ink-soft ); }
.ls-post-card__title { font-size: 18px; margin: 6px 0 8px; }
.ls-post-card__excerpt { font-size: 14px; color: var( --ls-ink-soft ); line-height: 1.6; margin: 0; }

@media ( max-width: 980px ) {
	.ls-posts__grid--3, .ls-posts__grid--4 { grid-template-columns: repeat( 2, 1fr ); }
}
@media ( max-width: 620px ) {
	.ls-posts__grid--2, .ls-posts__grid--3, .ls-posts__grid--4 { grid-template-columns: 1fr; }
}

/* ---------------------------------------------------------------------
 * CTA banner
 * ------------------------------------------------------------------- */
.ls-cta {
	position: relative;
	min-height: 360px;
	display: flex;
	align-items: center;
	justify-content: center;
	background-size: cover;
	background-position: center;
	background-color: var( --ls-ink );
}
.ls-cta__scrim { position: absolute; inset: 0; background: rgba(10,9,7,.5); }
.ls-cta__in { position: relative; z-index: 1; text-align: center; }
.ls-cta__title { color: #fff; font-size: clamp( 28px, 4vw, 44px ); margin: 0 0 26px; }

/* ---------------------------------------------------------------------
 * Trust badges
 * ------------------------------------------------------------------- */
.ls-trust__grid {
	display: grid;
	grid-template-columns: repeat( 4, 1fr );
	gap: 20px;
}
.ls-trust__item {
	display: flex;
	align-items: center;
	gap: 12px;
	justify-content: center;
	text-align: left;
	padding: 18px;
	border: 1px solid var( --ls-line );
	border-radius: var( --ls-radius );
}
.ls-trust__icon { color: var( --ls-gold-dark ); flex: 0 0 auto; }
.ls-trust__icon svg { width: 22px; height: 22px; }
.ls-trust__label { font-size: 13px; font-weight: 600; }

@media ( max-width: 820px ) {
	.ls-trust__grid { grid-template-columns: repeat( 2, 1fr ); }
}

/* ---------------------------------------------------------------------
 * Countdown bar
 * ------------------------------------------------------------------- */
.ls-countdown { background: var( --ls-ink ); }
.ls-countdown__in {
	padding: 22px 24px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 24px;
	flex-wrap: wrap;
	text-align: center;
}
.ls-countdown__msg { color: #fff; font-weight: 600; margin: 0; }
.ls-countdown__clock { display: flex; gap: 14px; }
.ls-countdown__unit { display: flex; flex-direction: column; align-items: center; color: #fff; }
.ls-countdown__num { font-family: var( --ls-font-heading ); font-size: 20px; font-weight: 700; }
.ls-countdown__label { font-size: 10px; letter-spacing: .06em; opacity: .7; }

/* ---------------------------------------------------------------------
 * Compare button + table
 * ------------------------------------------------------------------- */
.ls-compare-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: transparent !important;
	border: 1.5px solid var( --ls-line ) !important;
	color: var( --ls-ink ) !important;
	border-radius: var( --ls-radius );
	padding: 10px 16px;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	appearance: none;
}
.ls-compare-btn:hover { border-color: var( --ls-ink ) !important; }
.ls-compare-btn.is-active { border-color: var( --ls-gold-dark ) !important; color: var( --ls-gold-dark ) !important; }
.ls-compare-btn svg { width: 16px; height: 16px; }

.ls-compare__empty { text-align: center; padding: 60px 20px; }
.ls-compare__empty p { color: var( --ls-ink-soft ); margin-bottom: 20px; }

.ls-compare-table__scroll { overflow-x: auto; }
.ls-compare-table { width: 100%; border-collapse: collapse; min-width: 640px; }
.ls-compare-table th, .ls-compare-table td {
	border: 1px solid var( --ls-line );
	padding: 16px;
	vertical-align: top;
	text-align: left;
}
.ls-compare-table__label { width: 160px; font-weight: 600; background: var( --ls-cream ); }
.ls-compare-table__thumb { display: block; margin-bottom: 10px; }
.ls-compare-table__thumb img { width: 100%; max-width: 140px; height: auto; border-radius: var( --ls-radius ); }
.ls-compare-table__title { font-weight: 600; text-decoration: none; }
.ls-compare-table__remove {
	float: right;
	background: none !important;
	border: none !important;
	font-size: 18px;
	line-height: 1;
	cursor: pointer;
	color: var( --ls-ink-soft ) !important;
}

/* ---------------------------------------------------------------------
 * Product features
 * ------------------------------------------------------------------- */
.ls-pf-block { max-width: 720px; margin: 0 auto 56px; text-align: center; }
.ls-pf-block:last-child { margin-bottom: 0; }
.ls-pf-block__title { font-size: 22px; margin: 0 0 14px; }
.ls-pf-block__body { color: var( --ls-ink-soft ); line-height: 1.7; }
.ls-pf-block__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: inline-grid;
	gap: 10px;
	text-align: left;
}
.ls-pf-block__list li {
	position: relative;
	padding-left: 26px;
	color: var( --ls-ink-soft );
}
.ls-pf-block__list li::before {
	content: '';
	position: absolute;
	left: 0;
	top: 8px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var( --ls-gold );
}

/* ---------------------------------------------------------------------
 * Standalone section heading
 * ------------------------------------------------------------------- */
.ls-sechead-standalone { padding-block: 20px; }

/* ---------------------------------------------------------------------
 * Legal / prose pages
 * ------------------------------------------------------------------- */
.ls-legal, .ls-prose {
	max-width: 780px;
	margin: 0 auto;
	color: var( --ls-ink-soft );
	line-height: 1.75;
}
.ls-legal h3 { margin: 34px 0 12px; font-size: 19px; color: var( --ls-ink ); }
.ls-legal p, .ls-prose p { margin: 0 0 16px; }
.ls-legal ul { margin: 0 0 16px 20px; }
.ls-contact-block h3 { margin-top: 0; }
.ls-contact-block p { margin: 0 0 10px; }
.ls-contact-block a { font-weight: 600; }

/* ---------------------------------------------------------------------
 * Breadcrumbs (WooCommerce)
 * ------------------------------------------------------------------- */
.ls-breadcrumbs { font-size: 13px; color: var( --ls-ink-soft ); margin-bottom: 20px; }
.ls-breadcrumbs a { color: var( --ls-ink-soft ); text-decoration: none; }
.ls-breadcrumbs a:hover { color: var( --ls-ink ); }