/* Proper Strong blocks: shared styles. Colours come from the theme when it provides them. */
:root {
	--ps-ink: var(--wp--preset--color--ink, #1a1718);
	--ps-paper: var(--wp--preset--color--paper, #fffdf7);
	--ps-cream: var(--wp--preset--color--cream, #fff4cc);
	--ps-butter: var(--wp--preset--color--butter, #ffd84d);
	--ps-pink: var(--wp--preset--color--pink, #f7a8c4);
	--ps-lilac: var(--wp--preset--color--lilac, #cdbbf5);
	--ps-mint: var(--wp--preset--color--mint, #aee3cc);
	--ps-sky: var(--wp--preset--color--sky, #bfe3f0);
	--ps-pop: var(--wp--preset--color--pop, #c92e6f);
	--ps-muted: var(--wp--preset--color--muted, #5c5452);
	--ps-display: var(--wp--preset--font-family--display, inherit);
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	clip-path: inset(50%);
	border: 0;
	white-space: nowrap;
	word-wrap: normal !important;
}

/* Strength Scale */
.ps-strength {
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
}

.ps-strength__dots {
	display: inline-flex;
	gap: 4px;
}

.ps-strength__dot {
	width: 10px;
	height: 10px;
	box-sizing: border-box;
	border: 2px solid var(--ps-ink);
	border-radius: 50%;
}

.ps-strength__dot.is-on {
	background: var(--ps-ink);
}

.ps-strength__label {
	font-size: 0.75rem;
	font-weight: 800;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.ps-strength-block--large {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem;
}

.ps-strength-block--large .ps-strength__caption {
	font-size: 0.8rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ps-muted);
}

.ps-strength--large .ps-strength__dots {
	gap: 6px;
}

.ps-strength--large .ps-strength__dot {
	width: 28px;
	height: 12px;
	border-radius: 6px;
}

.ps-strength--large .ps-strength__label {
	font-size: 0.9rem;
}

.ps-notes {
	margin: 0;
	color: var(--ps-muted);
	font-size: 0.95rem;
}

/* Product picture */
.ps-visual {
	position: relative;
}

.ps-visual--card .ps-visual__link {
	display: grid;
	place-items: center;
	aspect-ratio: 1;
	overflow: hidden;
	border-radius: 18px;
	background: color-mix(in srgb, var(--ps-scent, var(--ps-pink)) 38%, var(--ps-paper));
}

.ps-visual--card .ps-visual__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.4s ease;
}

.ps-visual__illo {
	display: grid;
	place-items: center;
	width: 62%;
	transition: transform 0.3s cubic-bezier(0.2, 0.9, 0.3, 1.3);
}

.ps-visual--card.ps-visual--candle .ps-visual__illo,
.ps-visual--card.ps-visual--pot .ps-visual__illo,
.ps-visual--card.ps-visual--bag .ps-visual__illo,
.ps-visual--card.ps-visual--burner .ps-visual__illo {
	width: 44%;
}

.ps-visual__illo svg {
	display: block;
	width: 100%;
	height: auto;
	filter: drop-shadow(4px 5px 0 rgba(26, 23, 24, 0.12));
}

.ps-visual--card:hover .ps-visual__illo {
	transform: rotate(-4deg) scale(1.05);
}

.ps-visual--card:hover .ps-visual__img {
	transform: scale(1.04);
}

.ps-visual__badge {
	position: absolute;
	top: 12px;
	left: 12px;
	padding: 0.35em 0.8em;
	border: 2px solid var(--ps-ink);
	border-radius: 999px;
	background: var(--ps-pop);
	color: #fff;
	font-size: 0.75rem;
	font-weight: 800;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	transform: rotate(-3deg);
}

.ps-visual__badge--out {
	background: var(--ps-ink);
	color: var(--ps-cream);
}

.ps-visual--single .ps-visual__stage {
	display: grid;
	place-items: center;
	aspect-ratio: 1;
	border: 2px solid var(--ps-ink);
	border-radius: 32px;
	background: color-mix(in srgb, var(--ps-scent, var(--ps-pink)) 42%, var(--ps-paper));
}

.ps-visual--single .ps-visual__illo {
	width: 56%;
}

.ps-visual--single.ps-visual--candle .ps-visual__illo,
.ps-visual--single.ps-visual--pot .ps-visual__illo,
.ps-visual--single.ps-visual--bag .ps-visual__illo,
.ps-visual--single.ps-visual--burner .ps-visual__illo {
	width: 38%;
}

.ps-visual__track {
	display: grid;
	grid-auto-columns: 100%;
	grid-auto-flow: column;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	border: 2px solid var(--ps-ink);
	border-radius: 32px;
	background: var(--ps-paper);
	scrollbar-width: none;
}

.ps-visual__track::-webkit-scrollbar {
	display: none;
}

.ps-visual__slide {
	margin: 0;
	scroll-snap-align: start;
}

.ps-visual__slide img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1;
	object-fit: cover;
}

.ps-visual__thumbs {
	display: flex;
	gap: 0.6rem;
	margin-top: 0.8rem;
	overflow-x: auto;
}

.ps-visual__thumb {
	flex: 0 0 76px;
	overflow: hidden;
	border: 2px solid var(--ps-ink);
	border-radius: 14px;
}

.ps-visual__thumb img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1;
	object-fit: cover;
}

/* Box prices */
.ps-tiers {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 1.75rem;
}

.ps-tier {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.35rem;
	padding: 2.25rem 1.5rem;
	border: 2px solid var(--ps-ink);
	border-radius: 28px;
	background: var(--ps-paper);
	text-align: center;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.ps-tier:hover {
	transform: translate(-4px, -4px) rotate(-0.6deg);
	box-shadow: 8px 8px 0 var(--ps-ink);
}

.ps-tier--pink {
	background: var(--ps-pink);
}

.ps-tier--lilac {
	background: var(--ps-lilac);
}

.ps-tier--mint {
	background: var(--ps-mint);
}

.ps-tier--sky {
	background: var(--ps-sky);
}

.ps-tier__name {
	font-size: 0.9rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.ps-tier__n {
	font-family: var(--ps-display);
	font-weight: 800;
	font-size: clamp(5rem, 4rem + 4vw, 7.5rem);
	line-height: 0.95;
	letter-spacing: -0.06em;
}

.ps-tier__label {
	font-size: 1.05rem;
}

.ps-tier__price {
	margin-top: 0.4rem;
	font-family: var(--ps-display);
	font-weight: 800;
	font-size: 2rem;
}

.ps-tier__price del {
	margin-right: 0.3em;
	font-size: 0.6em;
	opacity: 0.6;
}

.ps-tier__price ins {
	text-decoration: none;
}

.ps-tier__cta.wp-element-button {
	margin-top: 0.75rem;
}

.ps-tier__flag {
	position: absolute;
	top: -26px;
	right: -12px;
	display: grid;
	place-items: center;
	width: 104px;
	height: 104px;
	border: 2px solid var(--ps-ink);
	border-radius: 50%;
	background: var(--ps-pop);
	color: var(--ps-paper);
	font-family: var(--ps-display);
	font-weight: 800;
	font-size: 1.05rem;
	line-height: 1.05;
	text-align: center;
	transform: rotate(12deg);
}

/* Markets */
.ps-markets {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 1.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ps-market {
	display: flex;
	overflow: hidden;
	border: 2px solid var(--ps-ink);
	border-radius: 24px;
	background: var(--ps-paper);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.ps-market:hover {
	transform: translate(-3px, -3px);
	box-shadow: 6px 6px 0 var(--ps-ink);
}

.ps-market__stub {
	display: flex;
	flex: 0 0 104px;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0.15rem;
	padding: 1rem;
	border-right: 2px dashed var(--ps-ink);
	background: var(--ps-pink);
	text-align: center;
}

.ps-market--1 .ps-market__stub {
	background: var(--ps-lilac);
}

.ps-market--2 .ps-market__stub {
	background: var(--ps-butter);
}

.ps-market__dow,
.ps-market__month {
	font-size: 0.8rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.ps-market__day {
	font-family: var(--ps-display);
	font-weight: 800;
	font-size: 2.4rem;
	line-height: 1;
}

.ps-market__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 0.3rem;
	padding: 1.25rem 1.5rem;
}

.ps-market__name {
	margin: 0;
	font-family: var(--ps-display);
	font-weight: 800;
	font-size: 1.35rem;
	line-height: 1.15;
}

.ps-market__where,
.ps-market__time {
	margin: 0;
	color: var(--ps-muted);
}

.ps-market__map {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	color: var(--ps-ink);
	font-weight: 800;
}

.ps-markets__empty {
	margin: 0;
	padding: 1.5rem 1.75rem;
	border: 2px dashed var(--ps-ink);
	border-radius: 24px;
	background: var(--ps-paper);
	font-weight: 600;
}

/* Forms */
.ps-form form {
	margin: 0;
}

.ps-form__row {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 0 1.25rem;
}

.ps-form__field {
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
	margin: 0 0 1.1rem;
}

.ps-form__field label,
.ps-newsletter__label {
	font-weight: 700;
	font-size: 0.95rem;
}

.ps-form input[type="text"],
.ps-form input[type="email"],
.ps-form textarea {
	width: 100%;
	min-height: 52px;
	box-sizing: border-box;
	padding: 0.75rem 1.1rem;
	border: 2px solid var(--ps-ink);
	border-radius: 16px;
	background: var(--ps-paper);
	color: var(--ps-ink);
	font: inherit;
}

.ps-form textarea {
	resize: vertical;
}

.ps-form input:focus-visible,
.ps-form textarea:focus-visible {
	outline: 3px solid var(--ps-pop);
	outline-offset: 2px;
}

.ps-form__hp {
	position: absolute !important;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.ps-form__small {
	margin: 0.5rem 0 1rem;
	font-size: 0.85rem;
	opacity: 0.85;
}

.ps-form__notice {
	margin: 0 0 1.25rem;
	padding: 0.9rem 1.2rem;
	border: 2px solid var(--ps-ink);
	border-radius: 16px;
	background: var(--ps-mint);
	font-weight: 700;
}

.ps-form__notice--error {
	background: var(--ps-pink);
}

.ps-newsletter__row {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin-top: 0.4rem;
}

.ps-newsletter__row input[type="email"] {
	flex: 1 1 240px;
	border-radius: 999px;
	padding-inline: 1.4rem;
}

.ps-newsletter .ps-form__small {
	margin-bottom: 0;
}

/* Editor placeholders */
.ps-editor-placeholder {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	padding: 0.75rem 1rem;
	border: 2px dashed currentColor;
	border-radius: 12px;
	font-size: 0.85rem;
}

@media (prefers-reduced-motion: reduce) {
	.ps-visual *,
	.ps-tier,
	.ps-market {
		transition: none !important;
	}
}
