/* ==========================================================================
   Animations: scroll-reveal, transitions, micro-interactions
   ========================================================================== */

/* Scroll Reveal
   ========================================================================== */

[data-ktv-reveal] {
	opacity: 0;
	transform: translateY(1.25rem);
	transition:
		opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1),
		transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
	transition-delay: var(--ktv-stagger, 0s);
	will-change: opacity, transform;
}

[data-ktv-reveal="left"] {
	transform: translateX(-1.5rem);
}

[data-ktv-reveal="right"] {
	transform: translateX(1.5rem);
}

[data-ktv-reveal="scale"] {
	transform: scale(0.95);
}

[data-ktv-reveal].is-visible {
	opacity: 1;
	transform: none;
}

/* Hero entrance (faster, no scroll needed) */

.ktv-hero [data-ktv-reveal] {
	transition-duration: 0.8s;
}

/* Smooth Accordion
   ========================================================================== */

.ktv-accordion__body {
	display: grid !important;
	grid-template-rows: 0fr;
	transition:
		grid-template-rows 0.35s cubic-bezier(0.16, 1, 0.3, 1),
		padding-bottom 0.35s cubic-bezier(0.16, 1, 0.3, 1);
	padding-block: 0;
	padding-inline: var(--ktv-space-20);
}

.ktv-accordion.is-open .ktv-accordion__body {
	grid-template-rows: 1fr;
	padding-bottom: var(--ktv-space-20);
}

.ktv-accordion__body-inner {
	overflow: hidden;
}

/* Tab Panel Fade
   ========================================================================== */

.ktv-tab-panel--active {
	animation: ktv-fade-in 0.35s cubic-bezier(0.16, 1, 0.3, 1) both;
}

@keyframes ktv-fade-in {
	from {
		opacity: 0;
		transform: translateY(0.5rem);
	}
	to {
		opacity: 1;
		transform: none;
	}
}

/* Card Hover Enhancement
   ========================================================================== */

.ktv-phone-card,
.ktv-country-card,
.ktv-blog-card,
.ktv-feature--card {
	transition:
		border-color var(--ktv-transition),
		box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1),
		transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.ktv-phone-card:hover,
.ktv-country-card:hover,
.ktv-blog-card:hover {
	transform: translateY(-2px);
}

.ktv-feature--card:hover {
	transform: translateY(-3px);
	box-shadow: var(--ktv-shadow-sm);
}

/* Blog Card Image Zoom */

.ktv-blog-card__image {
	transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.ktv-blog-card:hover .ktv-blog-card__image {
	transform: scale(1.03);
}

/* Blog Card Arrow */

.ktv-blog-card__arrow {
	transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

.ktv-blog-card:hover .ktv-blog-card__arrow {
	transform: translateX(3px);
}

/* Button Micro-interactions
   ========================================================================== */

.ktv-btn {
	transition:
		background-color var(--ktv-transition),
		color var(--ktv-transition),
		border-color var(--ktv-transition),
		transform 0.2s cubic-bezier(0.16, 1, 0.3, 1),
		box-shadow 0.2s ease;
}

.ktv-btn:active {
	transform: scale(0.97);
}

.ktv-btn--primary:hover {
	box-shadow: 0 4px 12px rgba(83, 56, 158, 0.25);
}

/* Link Arrow Micro-interaction
   ========================================================================== */

.ktv-link .ktv-icon,
.ktv-phone-card__link .ktv-icon {
	transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}

.ktv-link:hover .ktv-icon,
.ktv-phone-card__link:hover .ktv-icon {
	transform: translateX(2px);
}

/* Country Show All Link */

.ktv-country-show-all {
	transition:
		border-color var(--ktv-transition),
		transform 0.3s cubic-bezier(0.16, 1, 0.3, 1),
		box-shadow 0.3s ease;
}

.ktv-country-show-all:hover {
	transform: translateY(-2px);
	box-shadow: var(--ktv-shadow-sm);
}

/* Step Icon Hover */

.ktv-step__icon {
	transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.ktv-step:hover .ktv-step__icon {
	transform: scale(1.08);
}

/* Feature Icon Hover */

.ktv-feature__icon {
	transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.ktv-feature--card:hover .ktv-feature__icon {
	transform: scale(1.1);
}

/* Burger Menu Animation
   ========================================================================== */

.ktv-header__burger span {
	transition:
		transform 0.3s cubic-bezier(0.16, 1, 0.3, 1),
		opacity 0.2s ease;
	transform-origin: center;
}

.ktv-header__burger.is-active span:nth-child(1) {
	transform: translateY(7px) rotate(45deg);
}

.ktv-header__burger.is-active span:nth-child(2) {
	opacity: 0;
	transform: scaleX(0);
}

.ktv-header__burger.is-active span:nth-child(3) {
	transform: translateY(-7px) rotate(-45deg);
}

/* Mobile Nav Slide */

/* iOS scroll lock */
body.ktv-nav-open {
	overflow: hidden;
	position: fixed;
	inset: 0;
	overscroll-behavior: none;
}

/* Při zamčeném scrollu body je sticky neúčinné — hlavičku připnout napevno k top viewportu,
   jinak při otevření menu po odscrollování zmizí logo i křížek. */
body.ktv-nav-open .ktv-header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
}

@media (max-width: 767px) {
	.ktv-header__nav {
		transition: opacity 0.3s ease, visibility 0.3s ease;
		opacity: 0;
		visibility: hidden;
		display: flex !important;
		flex-direction: column;
		position: fixed;
		inset: var(--ktv-header-height, 4rem) 0 0 0;
		background: var(--wp--preset--color--bg-primary, #fff);
		padding: var(--ktv-space-24);
		z-index: 99;
		overscroll-behavior: contain;
		-webkit-overflow-scrolling: touch;
		overflow-y: auto;
	}

	.ktv-header__nav .ktv-header__menu {
		flex-direction: column;
		width: 100%;
	}

	.ktv-header__nav .ktv-header__menu li a {
		font-size: var(--ktv-font-lg);
	}

	/* Focus-visible styles for keyboard navigation */
	.ktv-header__nav .ktv-header__menu li a:focus-visible {
		outline: 2px solid var(--wp--preset--color--primary, #2563EB);
		outline-offset: -2px;
		border-radius: var(--ktv-radius-sm, 4px);
	}

	.ktv-header__nav.is-open {
		opacity: 1;
		visibility: visible;
	}

	.ktv-header__nav .ktv-header__menu li {
		opacity: 0;
		transform: translateY(0.75rem);
		transition:
			opacity 0.3s ease,
			transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
	}

	.ktv-header__nav.is-open .ktv-header__menu li {
		opacity: 1;
		transform: none;
	}

	.ktv-header__nav.is-open .ktv-header__menu li:nth-child(1) { transition-delay: 0.05s; }
	.ktv-header__nav.is-open .ktv-header__menu li:nth-child(2) { transition-delay: 0.1s; }
	.ktv-header__nav.is-open .ktv-header__menu li:nth-child(3) { transition-delay: 0.15s; }
	.ktv-header__nav.is-open .ktv-header__menu li:nth-child(4) { transition-delay: 0.2s; }
	.ktv-header__nav.is-open .ktv-header__menu li:nth-child(5) { transition-delay: 0.25s; }
}

/* Respect reduced motion */
@media (max-width: 767px) and (prefers-reduced-motion: reduce) {
	.ktv-header__nav,
	.ktv-header__nav::before,
	.ktv-header__nav .ktv-header__menu li,
	.ktv-header__burger span {
		transition: none !important;
	}
}

/* Search Bar Focus Enhancement
   ========================================================================== */

.ktv-search-bar {
	transition:
		border-color 0.3s ease,
		box-shadow 0.3s ease;
}

.ktv-search-bar:focus-within {
	border-color: var(--wp--preset--color--accent-primary, #53389E);
	box-shadow: 0 0 0 3px rgba(83, 56, 158, 0.08);
}

/* Stats Bar Value Entrance */

.ktv-stats-bar__item [data-ktv-reveal] {
	transition-duration: 0.5s;
}

/* Empty State Icon Pulse */

.ktv-empty-state__icon {
	transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.ktv-empty-state:hover .ktv-empty-state__icon {
	transform: scale(1.05);
}

/* Pagination Item */

.ktv-pagination__item {
	transition:
		background-color var(--ktv-transition),
		color var(--ktv-transition),
		transform 0.15s ease;
}

.ktv-pagination__item:active:not(.ktv-pagination__item--disabled) {
	transform: scale(0.92);
}

/* About Image */

.ktv-about__image img {
	transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.ktv-about__image:hover img {
	transform: scale(1.02);
}

/* Leaderboard Item Hover */

.ktv-leaderboard-item {
	transition:
		background-color var(--ktv-transition),
		transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.ktv-leaderboard-item:hover {
	transform: translateX(4px);
}

/* Prefix Filter Chips */

.ktv-prefixes-chip {
	transition:
		background-color var(--ktv-transition),
		color var(--ktv-transition),
		transform 0.2s ease;
}

.ktv-prefixes-chip:active {
	transform: scale(0.95);
}

/* Prefix Neighbour Chips */

.ktv-prefix-neighbours__chip {
	transition:
		background-color var(--ktv-transition),
		color var(--ktv-transition),
		transform 0.2s ease;
}

.ktv-prefix-neighbours__chip:hover {
	transform: translateY(-1px);
}

/* Share Buttons */

.ktv-article-share__btn {
	transition:
		background-color var(--ktv-transition),
		color var(--ktv-transition),
		transform 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}

.ktv-article-share__btn:hover {
	transform: scale(1.1);
}

/* Sidebar CTA */

.ktv-article-sidebar-cta {
	transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.ktv-article-sidebar-cta:hover {
	transform: translateY(-2px);
}

/* Review Item */

.ktv-review {
	transition:
		border-color var(--ktv-transition),
		transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.ktv-review:hover {
	border-color: var(--wp--preset--color--accent-primary-light, #EBE9FE);
}

/* Accessibility: Respect reduced motion
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}

	[data-ktv-reveal] {
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
	}

	.ktv-accordion__body {
		transition: none !important;
	}
}
