/*
 * PandakPhoto block theme: structure and component styles.
 * Design tokens (colours, fonts, sizes) live in theme.json; this file only uses them.
 */

:root {
	--pk-paper: var(--wp--preset--color--paper);
	--pk-surface: var(--wp--preset--color--surface);
	--pk-ink: var(--wp--preset--color--ink);
	--pk-muted: var(--wp--preset--color--muted);
	--pk-line: var(--wp--preset--color--line);
	--pk-night: var(--wp--preset--color--night);
	--pk-night-ink: var(--wp--preset--color--night-ink);
	--pk-night-muted: var(--wp--preset--color--night-muted);
	--pk-pigment: var(--wp--preset--color--pigment);
	--pk-pigment-soft: var(--wp--preset--color--pigment-soft);
	--pk-display: var(--wp--preset--font-family--display);
	--pk-body: var(--wp--preset--font-family--body);
	--pk-hand: var(--wp--preset--font-family--hand);
	--pk-gutter: var(--wp--custom--gutter, clamp(16px, 4vw, 48px));
	--pk-wide: 1240px;
	--pk-gap-wide: clamp(28px, 5vw, 72px);
	--pk-gap-card: clamp(12px, 2vw, 24px);
	--pk-gap-gallery: clamp(8px, 1.2vw, 14px);
	--pk-section-y: clamp(56px, 9vw, 120px);
}

/* Base */

:where(.pk-main, .pk-site-header, .pk-site-footer) :where(h1, h2, h3, h4, p, ul, ol, figure) {
	margin: 0;
}

:where(.pk-main, .pk-site-header, .pk-site-footer) :where(ul, ol) {
	padding: 0;
}

:focus-visible {
	outline: 3px solid var(--pk-pigment);
	outline-offset: 3px;
}

.pk-night :focus-visible,
.pk-hero :focus-visible,
.pk-footer :focus-visible {
	outline-color: #fff;
}

[hidden] {
	display: none;
}

:where(.pk-main) :where(h1, h2, h3) {
	text-wrap: balance;
}

:where(.pk-main) h3 {
	font-weight: 500;
}

body .wp-site-blocks > * {
	margin-block: 0;
}

body .pk-main > *,
body .pk-main .wp-block-post-content > * {
	margin-block: 0;
}

.pk-main a {
	text-underline-offset: 0.2em;
}

/* Vertical rhythm inside groups */

body .pk-stack > * {
	margin-block: 0;
}

body .pk-stack > * + * {
	margin-top: 18px;
}

/* Sections */

.pk-section {
	padding: var(--pk-section-y) var(--pk-gutter);
}

body .pk-section > * {
	max-width: var(--pk-wide);
	margin: 0 auto;
}

body .pk-section > * + * {
	margin-top: clamp(28px, 4vw, 48px);
}

.pk-surface {
	background: var(--pk-surface);
}

.pk-night {
	background: var(--pk-night);
	color: var(--pk-night-ink);
}

.pk-night .pk-eyebrow {
	color: var(--pk-night-muted);
}

.pk-night p:not(.pk-eyebrow) {
	color: #d3d6d7;
}

.pk-night a {
	color: inherit;
}

.pk-eyebrow {
	font-family: var(--pk-body);
	font-size: 12px;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--pk-muted);
}

.pk-lead {
	max-width: 62ch;
}

.pk-note {
	font-size: 14px;
	color: var(--pk-muted);
}

.pk-main h1 em,
.pk-main h2 em {
	font-style: italic;
}

.pk-two {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--pk-gap-wide);
	align-items: start;
}

.pk-narrow {
	max-width: 680px;
}

/* Placeholder marker (inline code) */

.pk-main code,
.pk-site-footer code {
	font-family: var(--pk-body);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0.06em;
	line-height: 1.9;
	color: var(--pk-pigment);
	background: repeating-linear-gradient(-45deg, var(--pk-pigment-soft) 0 6px, transparent 6px 12px);
	border: 1px dashed var(--pk-pigment);
	border-radius: 3px;
	padding: 3px 8px;
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
}

/* Header */

.pk-site-header {
	position: sticky;
	top: env(safe-area-inset-top, 0);
	z-index: 30;
	border-bottom: 1px solid var(--pk-line);
}

/* The blur sits on a pseudo-element: backdrop-filter on the header itself would make it the
   containing block of the position: fixed mobile menu overlay and trap it in the bar. */
.pk-site-header::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background: color-mix(in srgb, var(--pk-paper) 92%, transparent);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}

.has-modal-open .pk-site-header {
	z-index: 60;
}

.pk-bar {
	display: flex;
	align-items: center;
	gap: 20px;
	padding: 14px max(var(--pk-gutter), calc((100% - var(--pk-wide)) / 2));
}

.pk-brand {
	display: grid;
	gap: 2px;
	flex: none;
}

.pk-brand > .pk-brand-name,
.pk-brand > .pk-brand-sub {
	margin-block: 0;
}

.pk-brand-name {
	font-family: var(--pk-display);
	font-size: 24px;
	font-weight: 500;
	line-height: 1;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.pk-brand-name a {
	text-decoration: none;
	color: inherit;
}

.pk-brand-name em {
	font-family: var(--pk-hand);
	font-size: 30px;
	font-style: normal;
	font-weight: 500;
	letter-spacing: 0;
	text-transform: none;
	color: var(--pk-muted);
	margin-left: 4px;
}

.pk-brand-sub {
	font-size: 11px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--pk-muted);
}

.pk-bar .pk-nav {
	margin-left: auto;
}

.pk-nav .wp-block-navigation-item__content {
	padding: 8px 10px;
	border-radius: 4px;
	font-size: 15px;
	font-weight: 500;
	text-decoration: none;
}

.pk-nav .wp-block-navigation-item__content:hover {
	background: var(--pk-pigment-soft);
}

.pk-nav .wp-block-navigation-item__content[aria-current="page"],
.pk-nav .current-menu-item > .wp-block-navigation-item__content {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 6px;
}

.pk-bar .wp-block-navigation__responsive-container.is-menu-open {
	background-color: var(--pk-paper);
	color: var(--pk-ink);
	/* Core sizes the overlay padding from the root padding vars, which this theme does not set. */
	padding-inline: var(--pk-gutter);
}

.pk-bar .is-menu-open .wp-block-navigation-item__content {
	font-family: var(--pk-display);
	font-size: 26px;
}

.pk-nav-actions {
	flex: none;
	margin-left: 8px;
}

@media (max-width: 899px) {
	.pk-nav-actions {
		display: none;
	}
}

@media (max-width: 599px) {
	.pk-brand-sub {
		display: none;
	}

	.pk-bar .pk-nav {
		margin-left: auto;
	}
}

/* Buttons */

.pk-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

.wp-block-button .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 48px;
	text-decoration: none;
	border: 1px solid var(--pk-ink);
}

.wp-block-button.pk-ghost .wp-block-button__link {
	background: transparent;
	color: var(--pk-ink);
	border-color: var(--pk-ink);
}

.wp-block-button.pk-ghost .wp-block-button__link:hover {
	background: var(--pk-pigment-soft);
	color: var(--pk-pigment);
	border-color: var(--pk-pigment);
}

.wp-block-button.pk-light .wp-block-button__link {
	background: var(--pk-night-ink);
	color: var(--pk-night);
	border-color: var(--pk-night-ink);
}

.wp-block-button.pk-light .wp-block-button__link:hover {
	background: #fff;
	color: var(--pk-night);
	border-color: #fff;
}

.wp-block-button.pk-ghost.pk-light .wp-block-button__link {
	background: transparent;
	color: var(--pk-night-ink);
	border-color: var(--pk-night-ink);
}

.wp-block-button.pk-ghost.pk-light .wp-block-button__link:hover {
	background: rgba(255, 255, 255, 0.14);
	color: #fff;
	border-color: #fff;
}

.wp-block-button.pk-nav-cta .wp-block-button__link {
	min-height: 42px;
	padding: 10px 18px;
	font-size: 15px;
}

.wp-block-button.pk-btn-phone .wp-block-button__link::before,
.wp-block-button.pk-btn-msg .wp-block-button__link::before {
	content: "";
	flex: none;
	width: 18px;
	height: 18px;
	background: currentColor;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
}

.wp-block-button.pk-btn-phone .wp-block-button__link::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.96.36 1.9.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.91.34 1.85.57 2.81.7A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.96.36 1.9.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.91.34 1.85.57 2.81.7A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E");
}

.wp-block-button.pk-btn-msg .wp-block-button__link::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z'/%3E%3C/svg%3E");
}

/* Hero and page heads */

.pk-hero {
	position: relative;
	background: var(--pk-night);
	color: #fff;
	overflow: hidden;
}

.pk-hero .pk-hero-art.wp-block-cover {
	min-height: clamp(460px, 78vh, 860px);
	padding: 0;
	width: 100%;
	box-sizing: border-box;
}

.pk-hero .pk-hero-art-narrow.wp-block-cover {
	display: none;
}

.pk-phead .pk-hero-art.wp-block-cover {
	min-height: clamp(380px, 62vh, 720px);
}

.pk-hero .pk-eyebrow {
	color: #d9dcdd;
}

.pk-hero h1 {
	color: #fff;
	max-width: 15ch;
}

.pk-hero .pk-phead h1,
.pk-phead h1 {
	max-width: 22ch;
}

.pk-hero .pk-lead {
	color: #e6e8e8;
}

.pk-hero-copy {
	padding: 32px var(--pk-gutter) 44px;
	background: var(--pk-night);
}

body .pk-hero-copy > * {
	max-width: var(--pk-wide);
	margin: 0 auto;
}

body .pk-hero-copy-in > * {
	max-width: 640px;
}

body .pk-hero-copy-in > h1 {
	max-width: 15ch;
}

body .pk-phead .pk-hero-copy-in > h1 {
	max-width: 22ch;
}

body .pk-hero-copy-in {
	display: grid;
	gap: 18px;
}

body .pk-hero-copy-in > * + * {
	margin-top: 0;
}

.pk-hero-copy .pk-actions {
	margin-top: 6px;
}

@media (min-width: 821px) {
	.pk-hero::after {
		content: "";
		position: absolute;
		inset: 0;
		z-index: 1;
		pointer-events: none;
		background:
			linear-gradient(to right, rgba(10, 12, 14, 0.78) 0, rgba(10, 12, 14, 0.62) 45%, rgba(10, 12, 14, 0.25) 65%, rgba(10, 12, 14, 0) 80%),
			linear-gradient(to top, rgba(10, 12, 14, 0.5) 0, rgba(10, 12, 14, 0) 45%);
	}

	.pk-hero-copy {
		position: absolute;
		inset: auto 0 0 0;
		z-index: 2;
		background: none;
		padding: clamp(28px, 6vw, 72px) var(--pk-gutter);
	}
}

@media (max-width: 820px) {
	.pk-hero .pk-hero-art-wide.wp-block-cover {
		display: none;
	}

	.pk-hero .pk-hero-art-narrow.wp-block-cover {
		display: flex;
		min-height: clamp(320px, 90vw, 520px);
	}

	.pk-phead .pk-hero-art.wp-block-cover {
		min-height: clamp(280px, 80vw, 460px);
	}
}

/* Doors */

.pk-doors {
	display: grid;
	grid-template-columns: 1.35fr 1fr;
	gap: var(--pk-gap-card);
}

.pk-doors-side {
	display: grid;
	grid-template-rows: 1fr auto;
	gap: var(--pk-gap-card);
}

.pk-doors .pk-door.wp-block-cover {
	min-height: 420px;
	padding: 0;
	align-items: flex-end;
	justify-content: flex-start;
	color: #fff;
}

.pk-doors .pk-door.pk-door-big.wp-block-cover {
	min-height: 620px;
}

.pk-doors .pk-door.pk-door-small.wp-block-cover {
	min-height: 200px;
}

.pk-doors .pk-door.wp-block-cover .wp-block-cover__inner-container {
	position: static;
	width: 100%;
	color: #fff;
}

.pk-cap {
	display: grid;
	gap: 8px;
	box-sizing: border-box;
	width: 100%;
	padding: clamp(20px, 3vw, 36px);
	background: linear-gradient(to top, rgba(10, 12, 14, 0.8), rgba(10, 12, 14, 0));
}

body .pk-cap > * {
	margin: 0;
}

.pk-cap .pk-eyebrow {
	color: #d9dcdd;
}

.pk-cap h2,
.pk-cap h3 {
	color: #fff;
}

.pk-cap p:not(.pk-eyebrow):not(.pk-go) {
	max-width: 40ch;
	color: #e3e5e5;
}

.pk-go {
	font-weight: 700;
}

.pk-go a {
	color: #fff;
	text-decoration: underline;
	text-underline-offset: 5px;
}

.pk-go a::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 2;
}

.pk-door:hover .pk-go a {
	text-decoration-thickness: 2px;
}

@media (max-width: 820px) {
	.pk-doors {
		grid-template-columns: 1fr;
	}

	.pk-doors-side {
		grid-template-rows: auto;
	}

	.pk-doors .pk-door.wp-block-cover,
	.pk-doors .pk-door.pk-door-small.wp-block-cover {
		min-height: 380px;
	}

	.pk-doors .pk-door.pk-door-big.wp-block-cover {
		min-height: 520px;
	}
}

/* Study (how I look at a frame) */

.pk-two.pk-study {
	grid-template-columns: 1.1fr 1fr;
	align-items: center;
}

.pk-study-fig {
	position: relative;
}

.pk-study-frame {
	position: relative;
}

.pk-study-frame .wp-block-image {
	margin: 0;
}

.pk-study-fig img {
	display: block;
	width: 100%;
	height: auto;
}

.pk-study-fig .pk-switch {
	margin-top: 14px;
}

@media (max-width: 820px) {
	.pk-study-fig .pk-switch {
		position: absolute;
		right: 12px;
		bottom: 12px;
		margin-top: 0;
		min-height: 44px;
		box-shadow: 0 2px 10px rgba(10, 12, 14, 0.35);
	}
}

.pk-over {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
	transition: opacity 0.4s;
}

.pk-over.is-off {
	opacity: 0;
}

.pk-over line,
.pk-over path,
.pk-over circle,
.pk-over rect {
	fill: none;
	stroke: #fff;
	stroke-width: 1.6;
	vector-effect: non-scaling-stroke;
}

.pk-over .frame {
	stroke-dasharray: 8 7;
}

.pk-over text {
	font-family: var(--pk-hand);
	font-size: 30px;
	font-weight: 600;
	fill: #fff;
	stroke: rgba(10, 12, 14, 0.75);
	stroke-width: 5px;
	paint-order: stroke;
	stroke-linejoin: round;
}

.pk-switch {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 8px 14px 8px 8px;
	font: 600 15px/1.2 var(--pk-body);
	color: var(--pk-ink);
	background: var(--pk-surface);
	border: 1px solid var(--pk-line);
	border-radius: 999px;
	cursor: pointer;
}

.pk-switch i {
	position: relative;
	flex: none;
	width: 38px;
	height: 22px;
	background: #80878d;
	border-radius: 999px;
	transition: background 0.2s;
}

.pk-switch i::after {
	content: "";
	position: absolute;
	top: 3px;
	left: 3px;
	width: 16px;
	height: 16px;
	background: #fff;
	border-radius: 50%;
	transition: transform 0.2s;
}

.pk-switch[aria-pressed="true"] i {
	background: var(--pk-pigment);
}

.pk-switch[aria-pressed="true"] i::after {
	transform: translateX(16px);
}

.pk-study-list {
	display: grid;
	gap: 14px;
	list-style: none;
	padding: 0;
}

.pk-study-list li {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 4px 14px;
	align-items: baseline;
	border-top: 1px solid var(--pk-line);
	padding-top: 14px;
}

.pk-study-list strong {
	min-width: 5.2em;
	font-family: var(--pk-hand);
	font-size: 26px;
	font-weight: 600;
	color: var(--pk-pigment);
}

/* Favourite works slider */

.pk-slider {
	position: relative;
}

.pk-slider .wp-block-post-template {
	display: flex;
	gap: clamp(12px, 2vw, 20px);
	margin: 0;
	padding: 0 0 12px;
	list-style: none;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: thin;
	-webkit-overflow-scrolling: touch;
}

.pk-slider .wp-block-post-template > li {
	flex: 0 0 min(320px, 80vw);
	margin: 0;
	scroll-snap-align: start;
}

.pk-slide {
	display: grid;
	gap: 12px;
}

.pk-slide .wp-block-post-featured-image {
	margin: 0;
	aspect-ratio: 4 / 5;
	overflow: hidden;
	background: #0f1113;
}

.pk-slide .wp-block-post-featured-image a {
	display: block;
	height: 100%;
}

.pk-slide .wp-block-post-featured-image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.pk-slide .wp-block-post-title {
	font-size: 22px;
	margin: 0;
}

.pk-slide .wp-block-post-title a {
	text-decoration: none;
}

.pk-slide .wp-block-post-excerpt {
	margin: 0;
	font-size: 15px;
}

.pk-slider-nav {
	display: flex;
	justify-content: flex-end;
	gap: 8px;
	margin-top: 18px;
}

.pk-slider-btn {
	width: 44px;
	height: 44px;
	padding: 0;
	font: 600 20px/1 var(--pk-body);
	color: var(--pk-night-ink);
	background: transparent;
	border: 1px solid var(--pk-night-muted);
	border-radius: 50%;
	cursor: pointer;
}

.pk-slider-btn:hover:not(:disabled) {
	background: rgba(255, 255, 255, 0.12);
	border-color: var(--pk-night-ink);
}

.pk-slider-btn:disabled {
	opacity: 0.35;
	cursor: default;
}

/* Reviews (screenshot uploads) */

body .wp-block-gallery.has-nested-images.pk-gallery.pk-reviews {
	display: grid;
	columns: auto;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	align-items: start;
}

body .wp-block-gallery.has-nested-images.pk-gallery.pk-reviews figure.wp-block-image:not(#individual-image) img {
	border: 1px solid var(--pk-line);
	border-radius: 4px;
	background: #fff;
}

@media (max-width: 900px) {
	body .wp-block-gallery.has-nested-images.pk-gallery.pk-reviews {
		grid-template-columns: 1fr;
	}
}

/* Story (dark band) */

.pk-story-section .pk-two {
	align-items: center;
}

body .wp-block-gallery.has-nested-images.pk-gallery.pk-pair {
	display: grid;
	columns: auto;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
}

body .wp-block-gallery.has-nested-images.pk-gallery.pk-pair figure.wp-block-image:not(#individual-image):nth-child(2) {
	margin-top: 48px;
}

/* Talk block */

.pk-talk {
	border-top: 1px solid var(--pk-line);
}

.pk-two.pk-talk-grid {
	grid-template-columns: 1.2fr 1fr;
	gap: clamp(28px, 5vw, 64px);
	align-items: end;
}

.pk-phone {
	font-family: var(--pk-display);
	font-size: 28px;
	-webkit-user-select: all;
	user-select: all;
}

.pk-copy {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
}

.pk-copy-btn {
	padding: 6px 14px;
	font: 600 14px/1.2 var(--pk-body);
	color: var(--pk-ink);
	background: var(--pk-surface);
	border: 1px solid var(--pk-line);
	border-radius: 999px;
	cursor: pointer;
}

.pk-copy-btn:hover {
	border-color: var(--pk-pigment);
	color: var(--pk-pigment);
}

/* Packages */

.pk-packs {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	border-top: 1px solid var(--pk-ink);
}

.pk-packs.pk-packs-two {
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.pk-pack {
	display: grid;
	gap: 14px;
	align-content: start;
	padding: 28px 24px 30px;
	border-bottom: 1px solid var(--pk-line);
}

.pk-pack + .pk-pack {
	border-left: 1px solid var(--pk-line);
}

.pk-pack.pk-lead-pack {
	background: var(--pk-surface);
}

body .pk-pack > * {
	margin: 0;
}

.pk-pack ul {
	display: grid;
	gap: 6px;
	padding-left: 18px;
	color: var(--pk-muted);
}

.pk-price {
	font-family: var(--pk-display);
	font-size: 36px;
	line-height: 1;
	font-variant-numeric: tabular-nums;
}

.pk-price code {
	white-space: nowrap;
	line-height: 1.4;
}

.pk-price em {
	margin-left: 4px;
	font-family: var(--pk-body);
	font-size: 15px;
	font-style: normal;
	color: var(--pk-muted);
}

.pk-surface .pk-packs-foot {
	margin-top: 18px;
}

@media (max-width: 900px) {
	.pk-packs {
		grid-template-columns: 1fr;
	}

	.pk-pack + .pk-pack {
		border-left: 0;
	}
}

/* Steps */

.pk-steps {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 28px;
}

.pk-step {
	display: grid;
	gap: 10px;
	align-content: start;
	padding-top: 16px;
	border-top: 1px solid var(--pk-ink);
}

body .pk-step > * {
	margin: 0;
}

.pk-step-n {
	font-family: var(--pk-display);
	font-size: 28px;
	font-style: italic;
	color: var(--pk-pigment);
}

@media (max-width: 900px) {
	.pk-steps {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 520px) {
	.pk-steps {
		grid-template-columns: 1fr;
	}
}

/* Calendar */

.pk-year {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 1px;
	background: var(--pk-line);
	border: 1px solid var(--pk-line);
}

.pk-month {
	display: grid;
	gap: 8px;
	align-content: start;
	min-height: 112px;
	padding: 14px 12px 16px;
	background: var(--pk-surface);
}

.pk-month.pk-season {
	background: #fafbfa;
}

body .pk-month > * {
	margin: 0;
}

.pk-month h4 {
	font-family: var(--pk-body);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--pk-muted);
}

.pk-booked {
	display: grid;
	gap: 4px;
	list-style: none;
	padding: 0;
}

.pk-booked li,
.pk-legend-booked {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 15px;
	font-variant-numeric: tabular-nums;
}

.pk-booked li::before,
.pk-legend-booked::before {
	content: "";
	flex: none;
	width: 10px;
	height: 10px;
	background: var(--pk-ink);
	border-radius: 50%;
}

.pk-free {
	font-size: 13px;
	color: var(--pk-muted);
}

.pk-legend {
	display: flex;
	flex-wrap: wrap;
	gap: 18px;
	font-size: 14px;
	color: var(--pk-muted);
}

@media (max-width: 900px) {
	.pk-year {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (max-width: 480px) {
	.pk-year {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* Chips */

.pk-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	list-style: none;
	padding: 0;
}

.pk-chips li {
	padding: 8px 16px;
	font-size: 15px;
	background: var(--pk-surface);
	border: 1px solid var(--pk-line);
	border-radius: 999px;
	overflow: hidden;
}

.pk-chips.pk-filter li {
	padding: 0;
}

.pk-filter a {
	display: block;
	padding: 8px 16px;
	color: inherit;
	text-decoration: none;
}

.pk-filter a:hover {
	background: var(--pk-pigment-soft);
}

.pk-filter a[aria-current="page"] {
	background: var(--pk-ink);
	color: var(--pk-paper);
}

/* FAQ */

.pk-faq {
	border-top: 1px solid var(--pk-line);
}

.pk-faq .wp-block-details {
	padding: 18px 0;
	border-bottom: 1px solid var(--pk-line);
}

.pk-faq summary {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	font-family: var(--pk-display);
	font-size: 22px;
	cursor: pointer;
	list-style: none;
}

.pk-faq summary::-webkit-details-marker {
	display: none;
}

.pk-faq summary::after {
	content: "+";
	flex: none;
	font-family: var(--pk-body);
	color: var(--pk-muted);
}

.pk-faq details[open] summary::after {
	content: "\2013";
}

.pk-faq details p {
	max-width: 62ch;
	margin-top: 10px;
	color: var(--pk-muted);
}

/* About */

.pk-portrait img {
	display: block;
	width: 100%;
	height: auto;
}

.pk-portrait.pk-bw img {
	filter: grayscale(1);
}

.pk-quote {
	max-width: 28ch;
	font-family: var(--pk-display);
	font-size: clamp(24px, 2.6vw, 34px);
	font-style: italic;
	line-height: 1.3;
}

/* Gallery (masonry, edge to edge) */

.pk-gallery-section {
	padding-inline: var(--pk-gap-gallery);
}

body .pk-gallery-section > * {
	max-width: none;
}

body .pk-gallery-head + .pk-gallery-section {
	padding-top: 0;
}

.pk-gal + .pk-gal {
	margin-top: var(--pk-gap-gallery);
}

body .wp-block-gallery.has-nested-images.pk-gallery {
	display: block;
	columns: 3 300px;
	column-gap: var(--pk-gap-gallery);
	margin: 0;
}

body .wp-block-gallery.has-nested-images.pk-gallery figure.wp-block-image:not(#individual-image) {
	width: auto;
	display: block;
	margin: 0 0 var(--pk-gap-gallery);
	break-inside: avoid;
	flex-grow: 0;
}

body .wp-block-gallery.has-nested-images.pk-gallery figure.wp-block-image:not(#individual-image) img {
	display: block;
	width: 100%;
	height: auto;
}

@media (max-width: 520px) {
	body .wp-block-gallery.has-nested-images.pk-gallery {
		columns: 2 140px;
	}
}

.pk-gallery-more {
	margin-top: 24px;
}

body .pk-gallery-section > .pk-gallery-more {
	max-width: var(--pk-wide);
	margin-inline: auto;
	padding-inline: calc(var(--pk-gutter) - var(--pk-gap-gallery));
}

body .pk-gallery-head > * {
	max-width: var(--pk-wide);
}

/* Contact */

.pk-contact-section .pk-two {
	align-items: start;
}

.pk-contact-block {
	padding-top: 18px;
	border-top: 1px solid var(--pk-line);
}

.pk-contact-photo img {
	display: block;
	width: 100%;
	height: auto;
}

/* Plain pages */

.pk-plain-title {
	padding-bottom: 0;
}

/* Footer */

.pk-footer {
	background: var(--pk-night);
	color: var(--pk-night-muted);
	font-size: 15px;
	padding: 48px max(var(--pk-gutter), calc((100% - var(--pk-wide)) / 2));
}

.pk-foot-grid {
	display: grid;
	grid-template-columns: 2fr 1fr 1fr;
	gap: 28px;
}

body .pk-foot-grid > * {
	margin: 0;
}

.pk-foot-name {
	font-family: var(--pk-display);
	font-size: 24px;
	font-weight: 500;
	color: var(--pk-night-ink);
}

.pk-footer a {
	color: var(--pk-night-ink);
	text-decoration: none;
}

.pk-footer a:hover {
	text-decoration: underline;
}

.pk-foot-list {
	display: grid;
	gap: 8px;
	align-content: start;
	list-style: none;
	padding: 0;
}

.pk-footer .pk-legal {
	grid-column: 1 / -1;
	padding-top: 18px;
	font-size: 13px;
	border-top: 1px solid #2b3034;
}

@media (max-width: 820px) {
	.pk-two,
	.pk-two.pk-study,
	.pk-two.pk-talk-grid {
		grid-template-columns: 1fr;
	}

	.pk-foot-grid {
		grid-template-columns: 1fr;
	}

	body .wp-block-gallery.has-nested-images.pk-gallery.pk-pair figure.wp-block-image:not(#individual-image):nth-child(2) {
		margin-top: 0;
	}
}

/* Mobile contact bar */

.pk-mobile-bar {
	display: none;
}

@media (max-width: 700px) {
	.pk-mobile-bar {
		position: fixed;
		inset: auto 0 0 0;
		z-index: 40;
		display: block;
		padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0));
		background: color-mix(in srgb, var(--pk-paper) 94%, transparent);
		-webkit-backdrop-filter: blur(8px);
		backdrop-filter: blur(8px);
		border-top: 1px solid var(--pk-line);
	}

	.pk-mobile-bar .pk-actions {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 8px;
	}

	.pk-mobile-bar .wp-block-button .wp-block-button__link {
		width: 100%;
		padding: 12px 10px;
		font-size: 15px;
	}

	.pk-site-footer {
		padding-bottom: 76px;
	}
}

/* Toast (copy confirmation) */

.pk-toast {
	position: fixed;
	left: 50%;
	bottom: 96px;
	z-index: 50;
	transform: translateX(-50%);
	padding: 10px 16px;
	font-size: 14px;
	color: #fff;
	background: var(--pk-night);
	border-radius: 999px;
}

@media (prefers-reduced-motion: reduce) {
	.pk-over,
	.pk-switch i,
	.pk-switch i::after {
		transition: none;
	}

	.pk-slider .wp-block-post-template {
		scroll-behavior: auto;
	}
}
