/* Kampen Cup: update-safe responsive layer for PhotoMe and WordPress content. */

:root {
	--kampen-gutter: clamp(18px, 4vw, 48px);
	--kampen-content: 1240px;
	--kampen-touch: 44px;
}

html {
	box-sizing: border-box;
	overflow-x: hidden;
	-webkit-text-size-adjust: 100%;
}

*,
*::before,
*::after {
	box-sizing: inherit;
}

body {
	overflow-wrap: break-word;
}

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
	max-width: 100%;
}

img,
video {
	height: auto;
}

iframe {
	width: 100%;
}

pre,
code {
	white-space: pre-wrap;
	word-break: break-word;
}

table {
	display: block;
	width: 100% !important;
	max-width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

input,
select,
textarea,
button {
	max-width: 100%;
	font: inherit;
}

textarea {
	width: 100%;
	resize: vertical;
}

.page_content_wrapper,
#page_content_wrapper,
.standard_wrapper,
.footer_bar_wrapper,
#footer ul.sidebar_widget {
	max-width: 100%;
}

.page_content_wrapper:not(.wide):not(.fullwidth),
#page_content_wrapper:not(.wide):not(.fullwidth),
.standard_wrapper {
	width: min(100%, var(--kampen-content));
}

.wp-caption,
.wp-caption img,
.alignnone,
.aligncenter,
.alignleft,
.alignright {
	max-width: 100% !important;
}

.wp-caption {
	width: auto !important;
}

.wp-block-cover,
.wp-block-group,
.wp-block-media-text,
.wp-block-columns {
	min-width: 0;
}

.wp-block-embed__wrapper {
	position: relative;
	max-width: 100%;
}

/* Avoid fixed legacy widths in galleries, archives and page-builder rows. */
#portfolio_filter_wrapper,
.portfolio_filter_wrapper,
#blog_grid_wrapper,
#galleries_grid_wrapper,
#photo_wall_wrapper,
.photo_wall_wrapper,
.gallery_mansory_wrapper,
.portfolio3_content_wrapper,
.portfolio4_content_wrapper {
	max-width: 100% !important;
}

.element,
.post,
.galleries,
.portfolio,
.wall_entry {
	min-width: 0;
}

.parallax-image {
	max-width: none;
}

.kampen-gallery-archive-entry .standard_wrapper {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
}

.kampen-gallery-archive-entry .title,
.kampen-gallery-archive-entry p {
	margin-block: 0;
}

/* Sponsors: four uniform logo tiles per row on desktop. */
body.page-id-102 .team_wrapper {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: clamp(20px, 3vw, 36px);
	align-items: stretch;
}

body.page-id-102 .team_wrapper > [class*="one_"] {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	width: auto !important;
	min-width: 0;
	margin: 0 !important;
	float: none !important;
	clear: none !important;
}

body.page-id-102 .post_img.team {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 180px;
	margin: 0;
	padding: 24px;
	background: #fff;
}

body.page-id-102 .post_img.team > a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 120px;
	outline-offset: 8px;
}

body.page-id-102 .post_img.team img.team_pic {
	display: block;
	width: 100% !important;
	height: 120px !important;
	max-width: 220px !important;
	max-height: 120px !important;
	margin: auto;
	object-fit: contain;
	object-position: center;
}

body.page-id-102 .portfolio_desc.team {
	display: none !important;
}

@media (max-width: 960px) {
	body.page-id-102 .team_wrapper {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* Accessible tap targets without changing the desktop visual rhythm. */
#mobile_nav_icon,
#close_mobile_menu,
.mobile_main_nav a,
.mobile_menu_wrapper input,
.mobile_menu_wrapper button,
input[type="submit"],
input[type="button"],
button,
a.button,
.button {
	min-height: var(--kampen-touch);
}

#mobile_nav_icon,
#close_mobile_menu {
	min-width: var(--kampen-touch);
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

@media (max-width: 960px) {
	.top_bar {
		width: 100%;
	}

	#menu_wrapper,
	#menu_border_wrapper {
		display: none;
	}

	.mobile_menu_wrapper {
		width: min(86vw, 360px);
	}

	.mobile_menu_wrapper .page_content_wrapper,
	.mobile_menu_wrapper .sidebar_wrapper,
	.mobile_menu_wrapper .sidebar,
	.mobile_menu_wrapper .content,
	.mobile_menu_wrapper .sidebar_widget {
		width: 100%;
		max-width: 100%;
	}

	.mobile_main_nav a {
		display: flex;
		align-items: center;
		padding-block: 10px;
	}

	#page_content_wrapper .inner .sidebar_content,
	.page_content_wrapper .inner .sidebar_content,
	#page_content_wrapper .inner .sidebar_wrapper,
	.page_content_wrapper .inner .sidebar_wrapper {
		width: 100%;
		margin-inline: 0;
		padding-inline: 0;
		float: none;
	}

	.one_half,
	.one_half.last,
	.one_third,
	.one_third.last,
	.two_third,
	.two_third.last,
	.one_fourth,
	.one_fourth.last,
	.one_fifth,
	.one_fifth.last {
		min-width: 0;
	}
}

@media (max-width: 767px) {
	body {
		font-size: 16px;
		line-height: 1.6;
	}

	h1 { font-size: clamp(2rem, 10vw, 3rem) !important; line-height: 1.08; }
	h2 { font-size: clamp(1.65rem, 7.5vw, 2.25rem); line-height: 1.16; }
	h3 { font-size: clamp(1.4rem, 6vw, 1.9rem); line-height: 1.2; }
	h4 { font-size: clamp(1.2rem, 5vw, 1.6rem); line-height: 1.25; }
	h5,
	h6 { line-height: 1.3; }

	.top_bar {
		height: 80px !important;
		padding-inline: var(--kampen-gutter);
	}

	.logo_wrapper img {
		max-width: min(42vw, 170px);
	}

	#page_caption,
	#page_content_wrapper:not(.wide),
	.page_content_wrapper:not(.wide),
	.standard_wrapper,
	.footer_bar_wrapper,
	#footer ul.sidebar_widget {
		width: 100%;
		padding-inline: var(--kampen-gutter);
	}

	#page_caption {
		padding-block: clamp(28px, 8vw, 48px);
	}

	#page_caption h1,
	.post_header h1,
	.post_header h2,
	.post_header h5 {
		word-break: normal;
		hyphens: auto;
	}

	.one_half,
	.one_half.last,
	.one_third,
	.one_third.last,
	.two_third,
	.two_third.last,
	.one_fourth,
	.one_fourth.last,
	.one_fifth,
	.one_fifth.last,
	.one_half_bg,
	.one_third_bg,
	.two_third_bg {
		width: 100% !important;
		float: none !important;
		clear: both;
		margin-inline: 0 !important;
	}

	.one_half_bg:not(.nopadding),
	.one_third_bg:not(.nopadding),
	.two_third_bg:not(.nopadding) {
		padding: clamp(24px, 7vw, 40px) !important;
	}

	#portfolio_filter_wrapper,
	.portfolio_filter_wrapper,
	#portfolio_filter_wrapper.two_cols,
	#portfolio_filter_wrapper.three_cols,
	#portfolio_filter_wrapper.four_cols,
	#portfolio_filter_wrapper.five_cols {
		width: 100% !important;
		margin-inline: 0 !important;
	}

	#portfolio_filter_wrapper .element,
	.portfolio_filter_wrapper .element,
	#blog_grid_wrapper .post,
	#galleries_grid_wrapper .galleries,
	#photo_wall_wrapper .wall_entry,
	.photo_wall_wrapper .wall_entry {
		width: 100% !important;
		max-width: 100%;
		margin-inline: 0 !important;
		float: none !important;
	}

	.post_img,
	.post_img img,
	.gallery_type,
	.gallery_type img,
	.portfolio_type,
	.portfolio_type img {
		width: 100%;
		max-width: 100% !important;
		height: auto !important;
	}

	.comment,
	.comment .right,
	.fullwidth_comment_wrapper .comment .right,
	.fullwidth_comment_wrapper ul.children div.comment .right,
	#about_the_author .description {
		width: 100%;
		max-width: 100%;
		margin-left: 0;
	}

	.comment_wrapper #respond,
	.comment_wrapper ul.children #respond {
		width: 100%;
		margin-left: 0;
	}

	#content_wrapper ul.children,
	#content_wrapper ul.children ul.children {
		width: 100%;
		margin-left: 0;
		padding-left: 16px;
	}

	input:not([type="checkbox"]):not([type="radio"]),
	select,
	textarea {
		width: 100%;
		font-size: 16px;
	}

	input[type="submit"],
	input[type="button"],
	button,
	a.button,
	.button {
		width: auto;
		max-width: 100%;
		padding: 11px 18px;
	}

	.footer_bar,
	#copyright,
	.footer_bar_wrapper .social_wrapper {
		float: none;
		width: 100%;
		text-align: center;
	}

	.kampen-gallery-archive-entry .standard_wrapper {
		align-items: flex-start;
		flex-direction: column;
		gap: 16px;
	}
}

@media (max-width: 420px) {
	:root {
		--kampen-gutter: 18px;
	}

	.mobile_menu_wrapper {
		width: 88vw;
	}

	#page_caption h1 {
		font-size: clamp(1.75rem, 9vw, 2.25rem) !important;
	}

	body.page-id-102 .team_wrapper {
		grid-template-columns: 1fr;
	}

	body.page-id-102 .post_img.team {
		min-height: 160px;
	}
}

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