/* ----------------------------------------------------------------------------------------
   Photo King overrides for the Renovex theme.
   Loaded after custom.css. Keep the theme files untouched so they can be updated.
   ---------------------------------------------------------------------------------------- */

:root{
	/* Theme fonts (DM Sans / Space Grotesk) have no Cyrillic glyphs */
	--default-font				: "Inter", sans-serif;
	--accent-font				: "Manrope", sans-serif;
}

/* Bulgarian reads oddly with Every Word Capitalized */
.btn-default,
.readmore-btn,
.main-menu ul li,
.main-menu ul li a,
.slicknav_nav li a,
.section-footer-text p a,
.section-footer-text p span,
.project-nav ul li a,
.scrolling-content span,
.footer-menu ul li,
.page-header-box ol li.breadcrumb-item,
.page-category-list ul li a,
.tag-links,
.post-tags .tag-links a{
	text-transform: none;
}

/* Cyrillic words are longer; let big headings break instead of overflowing */
h1, h2, h3{
	overflow-wrap: break-word;
	hyphens: auto;
}

/* ---------------- Preloader ---------------- */
#loading-icon{
	max-width: 70px;
}

/* ---------------- Header ---------------- */
/* Language switch inside the nav bar (desktop: between menu and button; mobile: next to the menu toggle) */
.pk-lang{
	display: flex;
	align-items: center;
	gap: 4px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.pk-lang a{
	display: inline-block;
	font-size: 14px;
	font-weight: 600;
	line-height: 1;
	color: var(--white-color);
	padding: 7px 9px;
	border-radius: 5px;
	transition: all 0.3s ease-in-out;
}

.pk-lang a:hover{
	color: var(--accent-color);
}

.pk-lang a.lang-active{
	background: var(--accent-color);
	color: var(--primary-color);
}

.pk-lang-desktop{
	margin-right: 20px;
	padding-right: 20px;
	border-right: 1px solid var(--dark-divider-color);
}

/* the switch sits inside .main-menu, so undo the theme's menu-link sizing */
.main-menu .pk-lang li{
	margin: 0;
}

.main-menu .pk-lang a{
	font-size: 14px;
	padding: 7px 9px !important;
	border-radius: 5px;
}

.main-menu .pk-lang a.lang-active{
	background: var(--accent-color);
	color: var(--primary-color);
}

.navbar-brand{
	flex-shrink: 0;
}

@media only screen and (min-width: 992px) and (max-width: 1199px){
	.main-menu .nav-menu-wrapper ul li a{
		font-size: 14px;
		padding: 12px 5px !important;
	}

	.pk-lang-desktop{
		margin-right: 12px;
		padding-right: 0;
		border-right: none;
	}

	.navbar .navbar-brand img{
		height: 34px;
	}
}

.pk-lang-mobile{
	display: none;
	margin-left: auto;
	margin-right: 12px;
}

@media only screen and (max-width: 991px){
	.pk-lang-mobile{
		display: flex;
	}
}

.navbar-brand img{
	height: 48px;
	width: auto;
}

.main-menu .nav-menu-wrapper > ul{
	margin: 0 20px;
}

.main-menu ul li{
	margin: 0 6px;
}

/* keep two-word items like "За Краля" on one line next to the wide logo */
.main-menu ul li a{
	white-space: nowrap;
}

@media only screen and (min-width: 992px) and (max-width: 1399px){
	.main-menu .nav-menu-wrapper > ul{
		margin: 0 10px;
	}

	.main-menu ul li{
		margin: 0 2px;
	}

	.main-menu ul li a{
		font-size: 15px;
		padding: 12px 7px !important;
	}

	.navbar-brand img{
		height: 40px;
	}
}

/* ---------------- Rotating badge (replaces "years of experience" circle) ---------------- */
.pk-circle{
	display: inline-block;
	position: relative;
	width: 140px;
	height: 140px;
}

.pk-circle svg{
	width: 100%;
	height: 100%;
	animation: infiniterotate 20s infinite linear;
}

.pk-circle text{
	font-family: var(--accent-font);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 2px;
	text-transform: uppercase;
}

.pk-circle-center{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
	line-height: 1;
	font-family: var(--accent-font);
	font-weight: 700;
	color: var(--primary-color);
}

.pk-circle-center strong{
	display: block;
	font-size: 34px;
}

.pk-circle-center span{
	font-size: 11px;
	text-transform: uppercase;
}

.pk-circle.pk-circle-dark .pk-circle-center{
	color: var(--white-color);
}

.pk-circle.pk-circle-dark .pk-circle-center img{
	width: 64px;
}

.about-us-image-box-2 .pk-circle{
	border-radius: 50%;
}

.about-us-image-box-2 .pk-circle{
	position: absolute;
	top: 0;
	left: 0;
	transform: translate(-50%, -50%);
	background: var(--accent-color);
	border: 6px solid var(--bg-color);
	width: 150px;
	height: 150px;
}

/* ---------------- Font Awesome icons in place of the theme's SVG icon images ---------------- */
.icon-box i{
	position: relative;
	z-index: 1;
	font-size: 26px;
	line-height: 1;
	color: var(--primary-color);
	transition: color 0.4s ease-in-out;
}

/* the theme turns its icon images white (filter: invert) when the box fills black on hover;
   do the same for the Font Awesome icons, or they stay black on black */
.about-body-item:hover .icon-box i,
.what-we-do-item:hover .icon-box i,
.faq-contact-box:hover .icon-box i,
.value-counter-box:hover .icon-box i,
.service-why-choose-item:hover .icon-box i,
.service-process-item:hover .icon-box i,
.project-category-item:hover .icon-box i,
.team-experience-item:hover .icon-box i,
.contact-info-item:hover .icon-box i{
	color: var(--white-color);
}

.hero-info-bg-icon i{
	font-size: 120px;
	color: var(--dark-divider-color);
}

/* ---------------- Section backgrounds (our photos instead of the theme's stock images) ---------------- */
.hero{
	background-image: url('../../images/king/19.jpg');
	background-size: cover;
	background-position: center center;
}

/* Full-screen hero like the theme demo: our heading is shorter than the demo's,
   so fixed padding left the hero short and the next sections showed above the fold.
   The info cards overlap the hero by 145px, so the hero is one screen + 145px tall:
   the cards start right at the fold and the content is centred between header and fold. */
@media only screen and (min-width: 992px){
	.hero{
		display: flex;
		align-items: center;
		min-height: calc(100vh + 145px);
		min-height: calc(100svh + 145px);
		padding: 104px 0 145px;
	}

	.hero > .container{
		width: 100%;
	}
}

.our-story,
.pk-counters{
	background-image: url('../../images/camera.photos.jpg');
	background-size: cover;
	background-position: center center;
}

.page-header{
	background-image: url('../../images/king/1.jpg');
}

/* ---------------- Closing call-to-action (_EventCta) ---------------- */
/* Plain black with a soft yellow glow behind the booth instead of a busy photo */
.pk-cta{
	background: var(--primary-color);
	padding: 110px 0;
}

.pk-cta::before{
	background: radial-gradient(circle at 80% 75%, rgba(254, 212, 3, 0.22) 0%, rgba(254, 212, 3, 0) 45%);
	opacity: 1;
}

.pk-cta .cta-box-content{
	margin-right: 0;
}

.pk-cta .section-title p{
	font-size: 18px;
	color: rgba(255, 255, 255, 0.8);
	max-width: 560px;
}

.pk-cta-actions{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 24px 40px;
	margin-top: 40px;
}

.pk-cta-phone{
	display: inline-flex;
	align-items: center;
	gap: 16px;
	color: var(--white-color);
	font-family: var(--accent-font);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.2;
}

.pk-cta-phone small{
	display: block;
	font-family: var(--default-font);
	font-size: 14px;
	font-weight: 400;
	color: rgba(255, 255, 255, 0.7);
	margin-bottom: 4px;
}

.pk-cta-phone-icon{
	width: 54px;
	height: 54px;
	border-radius: 50%;
	border: 1px solid var(--accent-color);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--accent-color);
	font-size: 20px;
	transition: all 0.3s ease-in-out;
}

.pk-cta-phone:hover{
	color: var(--accent-color);
}

.pk-cta-phone:hover .pk-cta-phone-icon{
	background: var(--accent-color);
	color: var(--primary-color);
}

/* The booth stands on the bottom edge of the block (the theme hangs its image from the top) */
.pk-cta .pk-cta-image{
	margin: 0 0 -110px;
	text-align: center;
}

.pk-cta .pk-cta-image figure img{
	width: auto;
	max-width: 100%;
	height: 460px;
	display: block;
	margin: 0 auto;
}

@media only screen and (max-width: 991px){
	.pk-cta{
		padding: 60px 0;
	}

	.pk-cta .section-title p{
		font-size: 16px;
	}

	.pk-cta .pk-cta-image{
		margin: 40px 0 -60px;
	}

	.pk-cta .pk-cta-image figure img{
		height: 300px;
	}
}

@media only screen and (max-width: 767px){
	/* the theme hides .cta-box-image on phones; keep a small booth so the block is not text-only */
	.pk-cta .cta-box-image{
		display: block;
	}

	.pk-cta .pk-cta-image figure img{
		height: 240px;
	}

	.pk-cta-phone{
		font-size: 20px;
	}
}
/* ---------------- Counters band ---------------- */
.pk-counters{
	position: relative;
	padding: 120px 0;
}

.pk-counters::before{
	content: '';
	position: absolute;
	inset: 0;
	background: var(--primary-color);
	opacity: 75%;
	z-index: 1;
}

.pk-counters .container{
	position: relative;
	z-index: 2;
}

.pk-counter-item{
	text-align: center;
	padding: 20px 10px;
}

.pk-counter-item i{
	font-size: 42px;
	color: var(--accent-color);
	margin-bottom: 20px;
}

.pk-counter-item h2{
	font-size: 52px;
	color: var(--white-color);
	margin-bottom: 8px;
}

.pk-counter-item p{
	color: var(--white-color);
	opacity: 80%;
	margin: 0;
}

/* ---------------- Testimonials without company logos ---------------- */
.testimonial-item .testimonial-quote-icon{
	font-size: 40px;
	color: var(--accent-color);
	margin-bottom: 20px;
}

/* ---------------- Event pages ---------------- */
.page-category-list ul li.pk-current a{
	color: var(--primary-color);
	font-weight: 600;
}

.page-category-list ul li.pk-current a::before{
	transform: rotate(0);
}

/* the booth photo is tall and narrow; keep it from stretching the sidebar box */
.sidebar-cta-body-image figure{
	margin: 0 0 -40px 0;
	text-align: center;
}

.sidebar-cta-body-image img{
	width: auto;
	max-width: 100%;
	max-height: 280px;
}

.pk-link-inherit{
	color: inherit;
	transition: color 0.3s ease-in-out;
}

.pk-link-inherit:hover{
	color: var(--accent-color);
}

.service-entry h2{
	font-size: 36px;
	margin-bottom: 20px;
}

.service-entry .service-offer-list{
	margin-bottom: 30px;
}

.service-entry .service-offer-list ul li{
	width: 100%;
}

.pk-event-video{
	margin: 40px 0;
	border-radius: 10px;
	overflow: hidden;
}

.pk-event-gallery{
	margin-top: 40px;
}

.pk-event-gallery .photo-gallery{
	margin-bottom: 30px;
}

.pk-event-gallery .photo-gallery img{
	width: 100%;
	aspect-ratio: 1 / 0.7;
	object-fit: cover;
	border-radius: 10px;
}

.pk-external-link{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-family: var(--accent-font);
	font-weight: 600;
	color: var(--primary-color);
	margin-top: 10px;
}

.pk-external-link i{
	color: var(--accent-color);
}

.pk-external-link:hover{
	color: var(--accent-color);
}

/* ---------------- Gallery page ---------------- */
.pk-gallery-filters{
	text-align: center;
	margin-bottom: 50px;
}

.pk-gallery-filters ul{
	gap: 10px 36px;
}

.pk-gallery-filters sup{
	font-size: 12px;
	color: var(--text-color);
	margin-left: 2px;
}

.pk-gallery-item .photo-gallery{
	margin-bottom: 24px;
}

/* fixed tile shape: no layout jumps while lazy images load */
.pk-gallery-item .photo-gallery img{
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 0.7;
	object-fit: cover;
	border-radius: 10px;
}

/* ---------------- Contact page ---------------- */
.contact-info-item .icon-box i{
	font-size: 22px;
}

.pk-contact-social{
	display: flex;
	align-items: center;
	gap: 18px;
	margin: 12px 0 0;
	line-height: 1;
	padding: 0;
	list-style: none;
}

.pk-contact-social a{
	color: var(--primary-color);
	font-size: 18px;
	transition: color 0.3s ease-in-out;
}

.pk-contact-social a:hover{
	color: var(--accent-color);
}

.pk-form-label{
	display: block;
	font-family: var(--accent-font);
	font-size: 15px;
	font-weight: 600;
	color: var(--primary-color);
	margin-bottom: 8px;
}

.pk-event-types{
	display: flex;
	flex-wrap: wrap;
	gap: 12px 28px;
	margin: 0;
	padding: 18px 20px;
	background: var(--white-color);
	border: 1px solid transparent;
	border-radius: 10px;
}

/* float keeps the legend inside the box instead of sitting on its border */
.pk-event-types legend{
	float: left;
	width: 100%;
	padding: 0;
	margin: 0;
}

.pk-event-types label{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	cursor: pointer;
}

.pk-event-types input{
	width: 18px;
	height: 18px;
	accent-color: var(--accent-color);
}

.contact-form .form-control.is-invalid,
.pk-event-types.is-invalid{
	border: 1px solid var(--error-color);
	background-image: none;
}

.pk-form-note{
	font-size: 14px;
	margin-bottom: 20px;
}

.contact-form-btn{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 15px 25px;
}

.pk-form-status{
	font-weight: 500;
}

.pk-form-status.is-pending{
	color: var(--text-color);
}

.pk-form-status.is-success{
	color: #2e8b57;
}

.pk-form-status.is-error{
	color: var(--error-color);
}

/* The theme's architectural line drawings don't fit a photo booth business */
.our-services,
.our-testimonials{
	background-image: none;
}

/* ---------------- Footer ---------------- */
.footer-logo img{
	height: 56px;
	width: auto;
}

.footer-location-info .readmore-btn{
	color: var(--white-color);
}

.pk-footer-events ul{
	margin: 0;
	padding: 0;
	list-style: none;
}

.pk-footer-events ul li{
	position: relative;
	line-height: 1.5em;
	padding-left: 18px;
	margin-bottom: 12px;
}

.pk-footer-events ul li::before{
	content: '';
	position: absolute;
	top: 8px;
	left: 0;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--accent-color);
}

.pk-footer-events ul li a{
	color: var(--white-color);
	transition: color 0.3s ease-in-out;
}

.pk-footer-events ul li a:hover{
	color: var(--accent-color);
}

/* ---------------- Instagram feed (above footer, theme "what we do" layout) ---------------- */
.pk-instagram{
	border-top: 1px solid var(--divider-color);
}

.pk-instagram-widget iframe{
	display: block;
	width: 100%;
	border: none;
	overflow: hidden;
	border-radius: 10px;
}

.pk-instagram .what-we-do-image figure a{
	display: block;
}

.pk-instagram .satisfy-client-image figure img{
	background: var(--primary-color);
	object-fit: contain;
	padding: 6px;
}

/* ---------------- Back to top ---------------- */
.pk-back-to-top{
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 99;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--accent-color);
	color: var(--primary-color);
	opacity: 0;
	visibility: hidden;
	transition: all 0.3s ease-in-out;
}

.pk-back-to-top.show{
	opacity: 1;
	visibility: visible;
}

.pk-back-to-top:hover{
	background: var(--primary-color);
	color: var(--accent-color);
}

/* ---------------- About page ---------------- */
.pk-section{
	padding: 100px 0;
}

.pk-section-alt{
	background: var(--secondary-color);
}

.pk-about-intro .section-title{
	margin-bottom: 0;
}

.pk-about-intro .pk-event-video{
	margin: 0;
}

.pk-check-list ul{
	columns: 2;
	column-gap: 30px;
	margin-top: 30px;
}

.pk-check-list ul li{
	break-inside: avoid;
}

.pk-about-cards .about-body-item{
	width: 100%;
	background: var(--white-color);
	border-radius: 10px;
	padding: 30px;
	margin-bottom: 30px;
}

.pk-about-cards .about-body-item:last-child{
	margin-bottom: 0;
}

.pk-about-cards .about-body-item .icon-box i{
	position: relative;
	z-index: 1;
	font-size: 24px;
	color: var(--primary-color);
	transition: all 0.4s ease-in-out;
}

.pk-about-cards .about-body-item:hover .icon-box i{
	color: var(--white-color);
}

.pk-about-cards .about-body-item-content h3{
	margin-bottom: 8px;
}

.pk-about-cards .about-body-item-content p{
	margin: 0;
}

.pk-feature-grid .project-item{
	display: block;
}

.pk-feature-grid .project-item-image img{
	aspect-ratio: 1 / 0.8;
}

.pk-feature-grid .project-item-content{
	bottom: 30px;
	right: 30px;
	left: 30px;
}

.pk-feature-play{
	position: absolute;
	top: 30px;
	right: 30px;
	z-index: 1;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--accent-color);
	color: var(--primary-color);
}

.pk-mfp-video{
	max-width: 900px;
	margin: 0 auto;
}

.pk-mfp-video video{
	display: block;
	width: 100%;
	max-height: 85vh;
	background: #000;
}

/* ---------------- FAQ page ---------------- */
.page-faqs .faq-accordion .accordion-item{
	margin-bottom: 20px;
}

/* ---------------- Clients page ---------------- */
.pk-client-logos{
	row-gap: 24px;
}

.pk-client-logo{
	height: 100%;
	min-height: 140px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--white-color);
	border: 1px solid var(--divider-color);
	border-radius: 10px;
	padding: 20px;
	transition: all 0.3s ease-in-out;
}

.pk-client-logo img{
	max-width: 100%;
	max-height: 90px;
	object-fit: contain;
	filter: grayscale(100%);
	opacity: 0.8;
	transition: all 0.3s ease-in-out;
}

.pk-client-logo:hover{
	border-color: var(--accent-color);
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
}

.pk-client-logo:hover img{
	filter: none;
	opacity: 1;
}

/* ---------------- Error page ---------------- */
.pk-error-icon{
	font-size: 120px;
	line-height: 1;
	color: var(--accent-color);
	margin-bottom: 30px;
}

.error-page-content-body .btn-default{
	margin-top: 20px;
}

@media only screen and (max-width: 991px){
	.pk-section{
		padding: 50px 0;
	}

	.pk-about-intro .pk-event-video{
		margin-top: 30px;
	}

	.pk-about-cards{
		margin-top: 30px;
	}

	.navbar-brand img{
		height: 40px;
	}

	.pk-counter-item h2{
		font-size: 38px;
	}

	.about-us-image-box-2 .pk-circle{
		width: 120px;
		height: 120px;
	}
}

@media only screen and (max-width: 575px){
	.pk-check-list ul{
		columns: 1;
	}

	.pk-client-logo{
		min-height: 110px;
		padding: 15px;
	}
}

/* ---------------- Footer background (theme style: photo under dark overlay + blur) ---------------- */
.main-footer{
	background-image: url('/assets/images/king/23.jpg');
	background-size: cover;
	background-position: center;
}

/* ---------------- Hero: gallery link in the theme's "watch video" style (icon + text) ---------------- */
.pk-hero-gallery > a{
	width: 50px;
	height: 50px;
	cursor: pointer;
}

/* theme rings assume a 40px icon (64px ring offset by -30%); for 50px the ring must be 80px to stay centred */
.pk-hero-gallery > a::before,
.pk-hero-gallery > a::after{
	top: -15px;
	left: -15px;
	width: 80px;
	height: 80px;
	border-width: 40px;
}

.pk-hero-gallery > a i{
	font-size: 18px;
	margin-left: 0;
}

/* the theme styles every link inside .video-play-button as the round icon; reset the text link */
.pk-hero-gallery h3 a{
	width: auto;
	height: auto;
	display: inline;
	background: none;
	border-radius: 0;
	color: inherit;
	cursor: pointer;
}

.pk-hero-gallery h3 a::before,
.pk-hero-gallery h3 a::after{
	content: none;
}

.pk-hero-gallery:hover h3 a{
	background: none;
	color: var(--accent-color);
}