/*
Theme Name: KK2026
Theme URI: https://katrinkadelke.de
Author: Katrin Kadelke
Author URI: https://katrinkadelke.de
Description: A minimalist, gallery-style portfolio theme for illustrators and artists. Child theme of Twenty Twenty-Five with light aesthetics, serif typography, and modern block support.
Template: twentytwentyfive
Requires at least: 6.7
Tested up to: 6.9
Requires PHP: 7.4
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: kk2026
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, portfolio, photography, blog
*/

/* Base link styles */
a {
	text-decoration-thickness: 1px !important;
	text-underline-offset: 0.15em;
	transition: color 0.2s ease;
}

/* Focus styles */
:where(.wp-site-blocks *:focus) {
	outline-width: 2px;
	outline-style: solid;
	outline-color: var(--wp--preset--color--accent-1);
}

/* Navigation refinements */
.wp-block-navigation a {
	text-decoration: none !important;
}

.wp-block-navigation a:hover {
	color: var(--wp--preset--color--accent-1);
}

/* Gallery-style image presentation */
.wp-block-image img {
	transition: opacity 0.3s ease;
}

.wp-block-image:hover img {
	opacity: 0.95;
}

/* Portfolio grid styling */
.wp-block-gallery {
	gap: var(--wp--preset--spacing--40) !important;
}

.wp-block-gallery .wp-block-image {
	margin: 0;
}

/* Clean button style */
.wp-block-button__link {
	border-radius: 0 !important;
	transition: background-color 0.2s ease, color 0.2s ease;
}

/* Quote styling for artist statements */
.wp-block-quote {
	font-style: italic;
}

/* Subtle separator */
.wp-block-separator {
	opacity: 0.3;
}

/* Site title elegant styling */
.wp-block-site-title a {
	text-decoration: none !important;
}

/* Full viewport layout — footer starts below the fold */
.wp-site-blocks {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

.wp-site-blocks > main {
	flex-grow: 1;
}

/* Sticky header with backdrop blur */
.wp-site-blocks > header {
	position: sticky;
	top: 0;
	z-index: 100;
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	background-color: rgba(255, 255, 255, 0.85);
}

.admin-bar .wp-site-blocks > header {
	top: var(--wp-admin--admin-bar--height, 32px);
}

/* ── Mobile navigation overlay ── */

/* Fullscreen overlay */
.wp-block-navigation__responsive-container.is-menu-open {
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	width: 100% !important;
	height: 100dvh !important;
	background-color: rgba(255, 255, 255, 0.97) !important;
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 0 !important;
	z-index: 999 !important;
}

/* Center the menu items vertically */
.wp-block-navigation__responsive-container.is-menu-open
	.wp-block-navigation__responsive-container-content {
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 0.25rem !important;
	width: 100% !important;
}

/* Style each menu item */
.wp-block-navigation__responsive-container.is-menu-open
	.wp-block-navigation-item {
	opacity: 0;
	transform: translateY(20px);
	animation: kk-menu-stagger 0.45s ease forwards;
}

.wp-block-navigation__responsive-container.is-menu-open
	.wp-block-navigation-item:nth-child(1) { animation-delay: 0.08s; }
.wp-block-navigation__responsive-container.is-menu-open
	.wp-block-navigation-item:nth-child(2) { animation-delay: 0.16s; }
.wp-block-navigation__responsive-container.is-menu-open
	.wp-block-navigation-item:nth-child(3) { animation-delay: 0.24s; }
.wp-block-navigation__responsive-container.is-menu-open
	.wp-block-navigation-item:nth-child(4) { animation-delay: 0.32s; }
.wp-block-navigation__responsive-container.is-menu-open
	.wp-block-navigation-item:nth-child(5) { animation-delay: 0.40s; }

.wp-block-navigation__responsive-container.is-menu-open
	.wp-block-navigation-item a {
	font-family: var(--wp--preset--font-family--heading) !important;
	font-size: clamp(1.75rem, 5vw, 2.5rem) !important;
	letter-spacing: 0.02em;
	color: var(--wp--preset--color--contrast) !important;
	text-decoration: none !important;
	padding: 0.5rem 1rem !important;
	display: block;
	transition: opacity 0.2s ease;
}

.wp-block-navigation__responsive-container.is-menu-open
	.wp-block-navigation-item a:hover {
	opacity: 0.5;
}

/* Close button styling */
.wp-block-navigation__responsive-container.is-menu-open
	.wp-block-navigation__responsive-container-close {
	position: fixed !important;
	top: var(--wp--preset--spacing--50, 1.5rem) !important;
	right: var(--wp--preset--spacing--50, 1.5rem) !important;
	z-index: 1000 !important;
}

@keyframes kk-menu-stagger {
	to {
		opacity: 1;
		transform: translateY(0);
	}
}