/*
 Theme Name: LET IT UP SHOP
 Theme URI: https://shop.let-it-up.ro/
 Description: Blocksy child theme for LET IT UP SHOP.
 Author: LET IT UP
 Template: blocksy
 Version: 0.2.0
 Text Domain: blocksy-child-letitup-shop
*/

:root {
	--lius-bg: #f2efe7;
	--lius-paper: #fffdf8;
	--lius-ink: #111111;
	--lius-muted: #6d6a63;
	--lius-line: #d8d2c6;
	--lius-accent: #667057;
	--lius-accent-soft: #dfe3d6;
	--lius-max: 1240px;
	--lius-radius: 22px;
	--lius-shadow: 0 24px 70px rgba(17, 17, 17, 0.08);
}

html {
	scroll-behavior: smooth;
}

body {
	background: var(--lius-bg);
	color: var(--lius-ink);
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

body.home .hero-section,
body.home .entry-header {
	display: none;
}

a {
	text-underline-offset: 3px;
}

#main-container {
	background: var(--lius-bg);
}

#header,
.ct-header {
	border-bottom: 1px solid rgba(17, 17, 17, 0.08);
	background: rgba(242, 239, 231, 0.94);
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
}

#header [data-row*="middle"] > div,
.ct-header [data-row*="middle"] > div {
	min-height: 76px;
}

#header .site-title,
.ct-header .site-title {
	margin: 0;
}

#header .site-title a,
.ct-header .site-title a {
	display: block;
	width: 232px;
	max-width: 38vw;
	height: 50px;
	overflow: hidden;
	background: url("assets/logo.svg") left center / contain no-repeat;
	color: transparent;
	font-size: 0;
	line-height: 0;
	text-indent: -9999px;
	white-space: nowrap;
}

#header .menu > li > a,
.ct-header .menu > li > a {
	font-size: 13px;
	font-weight: 800;
	letter-spacing: 0.045em;
	text-transform: uppercase;
}

.liu-home {
	overflow: hidden;
	background:
		linear-gradient(rgba(17, 17, 17, 0.018) 1px, transparent 1px),
		linear-gradient(90deg, rgba(17, 17, 17, 0.018) 1px, transparent 1px),
		var(--lius-bg);
	background-size: 34px 34px;
}

.liu-shell {
	width: min(calc(100% - 40px), var(--lius-max));
	margin-inline: auto;
}

.liu-kicker {
	margin: 0 0 16px;
	color: var(--lius-muted);
	font-size: 12px;
	font-weight: 900;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}

.liu-hero {
	padding: 72px 0 56px;
}

.liu-hero-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.02fr) minmax(380px, 0.98fr);
	gap: 60px;
	align-items: center;
}

.liu-hero-copy h1,
.liu-section h2,
.liu-final-cta h2 {
	margin: 0;
	color: var(--lius-ink);
	font-family: ui-serif, Georgia, Cambria, "Times New Roman", serif;
	font-weight: 600;
	letter-spacing: -0.055em;
}

.liu-hero-copy h1 {
	max-width: 820px;
	font-size: clamp(62px, 8vw, 118px);
	line-height: 0.88;
}

.liu-lead {
	max-width: 680px;
	margin: 28px 0 0;
	color: #383631;
	font-size: clamp(18px, 2vw, 24px);
	line-height: 1.5;
}

.liu-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 34px;
}

.liu-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 52px;
	padding: 0 24px;
	border: 1px solid var(--lius-ink);
	border-radius: 999px;
	font-size: 13px;
	font-weight: 900;
	letter-spacing: 0.05em;
	text-decoration: none;
	text-transform: uppercase;
	transition: transform 160ms ease, background 160ms ease, color 160ms ease;
}

.liu-button:hover {
	transform: translateY(-2px);
}

.liu-button-dark {
	background: var(--lius-ink);
	color: #fff;
}

.liu-button-dark:hover {
	background: #2c2c2c;
	color: #fff;
}

.liu-button-light {
	background: transparent;
	color: var(--lius-ink);
}

.liu-button-light:hover {
	background: var(--lius-paper);
	color: var(--lius-ink);
}

.liu-proof {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 24px;
	margin-top: 28px;
	color: var(--lius-muted);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.02em;
}

.liu-proof span {
	position: relative;
}

.liu-proof span:not(:last-child)::after {
	content: "•";
	position: absolute;
	right: -15px;
	color: var(--lius-accent);
}

.liu-hero-visual {
	min-width: 0;
}

.liu-hero-image-link,
.liu-editorial-card {
	position: relative;
	display: block;
	aspect-ratio: 4 / 5;
	overflow: hidden;
	border: 1px solid rgba(17, 17, 17, 0.12);
	border-radius: 34px;
	background: var(--lius-paper);
	box-shadow: var(--lius-shadow);
}

.liu-hero-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: saturate(0.35) contrast(1.04);
}

.liu-hero-caption {
	position: absolute;
	right: 18px;
	bottom: 18px;
	left: 18px;
	display: grid;
	gap: 3px;
	padding: 16px 18px;
	border: 1px solid rgba(255,255,255,.28);
	border-radius: 14px;
	background: rgba(17,17,17,.78);
	color: #fff;
	backdrop-filter: blur(8px);
}

.liu-hero-caption strong {
	font-size: 16px;
}

.liu-hero-caption small {
	opacity: .72;
}

.liu-editorial-card {
	display: grid;
	grid-template-columns: .78fr 1.22fr;
	background:
		radial-gradient(circle at 25% 20%, rgba(102, 112, 87, 0.22), transparent 36%),
		linear-gradient(145deg, #fbfaf6 0%, #e8e4db 100%);
}

.liu-editorial-card::before,
.liu-editorial-card::after {
	content: "";
	position: absolute;
	border-radius: 999px;
	border: 1px solid rgba(17,17,17,.18);
	transform: rotate(-18deg);
}

.liu-editorial-card::before {
	width: 430px;
	height: 160px;
	right: -120px;
	top: 58px;
}

.liu-editorial-card::after {
	width: 520px;
	height: 220px;
	left: -180px;
	bottom: 58px;
}

.liu-editorial-mark {
	display: flex;
	align-items: flex-end;
	padding: 34px 0 34px 34px;
	font-family: ui-serif, Georgia, serif;
	font-size: clamp(48px, 7vw, 92px);
	font-weight: 700;
	line-height: .76;
	letter-spacing: -.08em;
}

.liu-editorial-copy {
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 18px;
	padding: 42px 30px 42px 0;
}

.liu-editorial-copy span,
.liu-editorial-copy small {
	color: var(--lius-muted);
	font-size: 11px;
	font-weight: 900;
	letter-spacing: .18em;
	text-transform: uppercase;
}

.liu-editorial-copy strong {
	font-size: clamp(34px, 5vw, 68px);
	line-height: .92;
	letter-spacing: -.06em;
}

.liu-section {
	padding: 86px 0;
}

.liu-section-tight {
	padding-top: 36px;
}

.liu-section-head {
	max-width: 760px;
	margin-bottom: 34px;
}

.liu-section-head h2,
.liu-final-cta h2 {
	font-size: clamp(40px, 5vw, 72px);
	line-height: .96;
}

.liu-section-head-row {
	max-width: none;
	display: flex;
	align-items: end;
	justify-content: space-between;
	gap: 24px;
}

.liu-text-link {
	padding-bottom: 5px;
	border-bottom: 1px solid var(--lius-ink);
	color: var(--lius-ink);
	font-size: 13px;
	font-weight: 800;
	text-decoration: none;
	white-space: nowrap;
}

.liu-collection-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 16px;
}

.liu-collection-card {
	position: relative;
	display: grid;
	grid-template-rows: auto 1fr auto;
	min-height: 320px;
	padding: 24px;
	border: 1px solid var(--lius-line);
	border-radius: var(--lius-radius);
	background: rgba(255,253,248,.74);
	color: var(--lius-ink);
	text-decoration: none;
	transition: transform 170ms ease, box-shadow 170ms ease, border-color 170ms ease;
}

.liu-collection-card:hover {
	transform: translateY(-4px);
	border-color: rgba(17,17,17,.28);
	box-shadow: 0 22px 52px rgba(17,17,17,.07);
	color: var(--lius-ink);
}

.liu-collection-card-accent {
	background: var(--lius-accent-soft);
}

.liu-card-index {
	color: var(--lius-muted);
	font-size: 12px;
	font-weight: 900;
	letter-spacing: .14em;
}

.liu-collection-card h3 {
	margin: auto 0 10px;
	font-family: ui-serif, Georgia, serif;
	font-size: clamp(34px, 4vw, 52px);
	line-height: .95;
	letter-spacing: -.05em;
}

.liu-collection-card p {
	max-width: 360px;
	margin: 0;
	color: var(--lius-muted);
	line-height: 1.5;
}

.liu-arrow {
	justify-self: end;
	font-size: 26px;
	line-height: 1;
}

.liu-model-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 18px;
}

.liu-model-card {
	min-width: 0;
}

.liu-model-media {
	position: relative;
	display: block;
	aspect-ratio: 4 / 5;
	overflow: hidden;
	border: 1px solid var(--lius-line);
	border-radius: 18px;
	background: var(--lius-paper);
}

.liu-model-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 260ms ease;
}

.liu-model-card:hover .liu-model-media img {
	transform: scale(1.025);
}

.liu-model-placeholder {
	position: absolute;
	right: 22px;
	bottom: 20px;
	left: 22px;
	color: var(--lius-ink);
	font-family: ui-serif, Georgia, serif;
	font-size: clamp(34px, 4vw, 58px);
	font-weight: 700;
	line-height: .86;
	letter-spacing: -.06em;
}

.liu-ink-one {
	background:
		linear-gradient(130deg, transparent 30%, rgba(17,17,17,.09) 30.5%, transparent 31.5%),
		linear-gradient(34deg, #f9f7f2, #d9d4c9);
}

.liu-ink-two {
	background:
		radial-gradient(circle at 28% 20%, rgba(102,112,87,.25), transparent 30%),
		linear-gradient(150deg, #f9f7f1, #e5e0d5);
}

.liu-ink-three {
	background:
		repeating-linear-gradient(115deg, rgba(17,17,17,.05) 0 1px, transparent 1px 18px),
		#f4f1e9;
}

.liu-model-meta {
	display: flex;
	justify-content: space-between;
	gap: 18px;
	padding: 16px 2px 0;
}

.liu-model-meta h3 {
	margin: 0 0 6px;
	font-size: 17px;
	letter-spacing: -.02em;
}

.liu-model-meta h3 a {
	color: var(--lius-ink);
	text-decoration: none;
}

.liu-model-meta p {
	margin: 0;
	color: var(--lius-muted);
	font-size: 14px;
	line-height: 1.45;
}

.liu-mini-arrow {
	color: var(--lius-ink);
	font-size: 22px;
	text-decoration: none;
}

.liu-how {
	border-block: 1px solid var(--lius-line);
	background: rgba(255,253,248,.72);
}

.liu-steps {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	border-top: 1px solid var(--lius-line);
}

.liu-step {
	padding: 28px 30px 8px 0;
}

.liu-step + .liu-step {
	padding-left: 30px;
	border-left: 1px solid var(--lius-line);
}

.liu-step > span {
	color: var(--lius-accent);
	font-size: 12px;
	font-weight: 900;
	letter-spacing: .14em;
}

.liu-step h3 {
	margin: 50px 0 10px;
	font-size: 22px;
	letter-spacing: -.03em;
}

.liu-step p {
	max-width: 340px;
	margin: 0;
	color: var(--lius-muted);
	line-height: 1.55;
}

.liu-future-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(360px, .95fr);
	gap: 70px;
	align-items: start;
}

.liu-future h2 {
	font-size: clamp(42px, 5vw, 70px);
	line-height: .95;
}

.liu-future-list {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	padding-top: 8px;
}

.liu-future-list span {
	display: inline-flex;
	padding: 12px 16px;
	border: 1px solid var(--lius-line);
	border-radius: 999px;
	background: rgba(255,253,248,.7);
	font-size: 13px;
	font-weight: 800;
}

.liu-final-cta {
	padding: 34px 0 92px;
}

.liu-final-cta-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 30px;
	padding: 46px;
	border-radius: 30px;
	background: var(--lius-accent-soft);
}

.liu-final-cta h2 {
	max-width: 720px;
	font-size: clamp(42px, 5vw, 70px);
}

/* Generic content pages */
body.page:not(.home) .site-main,
body.single-liu_model .site-main,
body.post-type-archive-liu_model .site-main {
	background: var(--lius-bg);
}

body.page:not(.home) .entry-content,
body.single-liu_model .entry-content {
	max-width: 900px;
	font-size: 18px;
	line-height: 1.7;
}

/* WooCommerce: make the plugin feel like LET IT UP instead of stock Woo. */
.woocommerce ul.products {
	gap: 22px;
}

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
	overflow: hidden;
	border: 1px solid var(--lius-line);
	border-radius: 18px;
	background: var(--lius-paper);
}

.woocommerce ul.products li.product .ct-media-container,
.woocommerce ul.products li.product > a img {
	background: #ece8df;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce div.product .product_title {
	color: var(--lius-ink);
	letter-spacing: -0.025em;
}

.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price {
	color: var(--lius-ink);
	font-weight: 800;
}

.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
	border-radius: 999px;
	background: var(--lius-ink);
	color: #fff;
	font-weight: 800;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover {
	background: #2c2c2c;
	color: #fff;
}

.woocommerce-message,
.woocommerce-info {
	border-top-color: var(--lius-ink);
	background: var(--lius-paper);
}

.woocommerce-cart .cart-empty {
	margin-top: 50px;
	font-family: ui-serif, Georgia, serif;
	font-size: clamp(34px, 5vw, 56px);
	font-weight: 600;
	letter-spacing: -.04em;
}


.liu-page-hero {
	padding: 78px 0 16px;
}

.liu-page-hero h1,
.liu-model-single-copy h1,
.liu-empty-state h2 {
	margin: 0;
	font-family: ui-serif, Georgia, Cambria, "Times New Roman", serif;
	font-size: clamp(54px, 8vw, 100px);
	font-weight: 600;
	line-height: .9;
	letter-spacing: -.055em;
}

.liu-page-hero > .liu-shell > p:last-child {
	max-width: 720px;
	margin: 24px 0 0;
	color: var(--lius-muted);
	font-size: 19px;
	line-height: 1.55;
}

.liu-pagination {
	margin-top: 44px;
}

.liu-pagination .nav-links {
	display: flex;
	gap: 8px;
	align-items: center;
}

.liu-pagination .page-numbers {
	display: inline-flex;
	min-width: 40px;
	height: 40px;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--lius-line);
	border-radius: 999px;
	color: var(--lius-ink);
	text-decoration: none;
}

.liu-pagination .page-numbers.current {
	background: var(--lius-ink);
	color: #fff;
}

.liu-empty-state {
	padding: 64px 0 100px;
}

.liu-empty-state h2 {
	max-width: 760px;
	margin-bottom: 28px;
	font-size: clamp(46px, 6vw, 78px);
}

.liu-model-single {
	padding: 72px 0 96px;
}

.liu-model-single-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(340px, .95fr);
	gap: 68px;
	align-items: center;
}

.liu-model-single-media {
	overflow: hidden;
	border: 1px solid var(--lius-line);
	border-radius: 28px;
	background: var(--lius-paper);
}

.liu-model-single-media > img {
	display: block;
	width: 100%;
	height: auto;
}

.liu-model-single-copy h1 {
	font-size: clamp(56px, 7vw, 96px);
}

.liu-model-terms {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 28px;
}

.liu-model-terms a {
	padding: 9px 13px;
	border: 1px solid var(--lius-line);
	border-radius: 999px;
	color: var(--lius-ink);
	font-size: 12px;
	font-weight: 800;
	text-decoration: none;
}

@media (max-width: 980px) {
	.liu-hero-grid,
	.liu-future-grid,
	.liu-model-single-grid {
		grid-template-columns: 1fr;
	}

	.liu-hero {
		padding-top: 50px;
	}

	.liu-hero-copy h1 {
		font-size: clamp(58px, 13vw, 92px);
	}

	.liu-hero-visual {
		max-width: 720px;
	}

	.liu-collection-grid,
	.liu-model-grid {
		grid-template-columns: 1fr 1fr;
	}

	.liu-steps {
		grid-template-columns: 1fr;
	}

	.liu-step,
	.liu-step + .liu-step {
		padding: 24px 0;
		border-left: 0;
		border-top: 1px solid var(--lius-line);
	}

	.liu-step:first-child {
		border-top: 0;
	}

	.liu-step h3 {
		margin-top: 26px;
	}
}

@media (max-width: 680px) {
	#header .site-title a,
	.ct-header .site-title a {
		width: 176px;
		height: 42px;
		max-width: 52vw;
	}

	.liu-shell {
		width: min(calc(100% - 28px), var(--lius-max));
	}

	.liu-hero {
		padding: 38px 0 26px;
	}

	.liu-hero-grid {
		gap: 34px;
	}

	.liu-hero-copy h1 {
		font-size: clamp(54px, 17vw, 78px);
	}

	.liu-lead {
		font-size: 18px;
	}

	.liu-proof {
		display: grid;
	}

	.liu-proof span::after {
		display: none;
	}

	.liu-editorial-card {
		border-radius: 22px;
	}

	.liu-section {
		padding: 62px 0;
	}

	.liu-section-head-row {
		align-items: flex-start;
		flex-direction: column;
	}

	.liu-collection-grid,
	.liu-model-grid {
		grid-template-columns: 1fr;
	}

	.liu-collection-card {
		min-height: 250px;
	}

	.liu-final-cta-inner {
		align-items: flex-start;
		flex-direction: column;
		padding: 30px 24px;
	}

	.liu-button {
		width: 100%;
	}

	.liu-actions .liu-button {
		width: auto;
		flex: 1 1 220px;
	}
}