/*  
Theme Name: P+ Architekten 2026
Theme URI: 
Description: Custom Wordpress Theme for kuempellorenz, büro für gestaltung
Version: 1.5
Author: Oliver Hulisz	
Author URI:  http://72dpi.de/
*/

/* reset
-------------------------------------------------------------------------------------------------- */
*, *::before, *::after {
  box-sizing: border-box;
}

img, picture, video {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
}

p, h1, h2, h3, h4, h5, h6 {
  overflow-wrap: break-word;
}

input, button, textarea, select {
  font: inherit;
}

figure {
	margin: 0;
}

:root {
	--clr-text: #323A2E;

	--clr-primary: #EB680D;
	--clr-secondary: #555953;

	--clr-line: #9D9E9C;

}


/* body
-------------------------------------------------------------------------------------------------- */
body {
	margin: 0;
	font-family: 'Unicod-Regular', Verdana, Arial, Helvetica, sans-serif;
	font-size: 1rem;
	color: var(--clr-text);
	background: #fff;
	-webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}


a.site-logo {
	float: right;
	display: block;
	width: 200px;
	height: auto;
}

a.menu-link {
	display: block;
	margin-top: 1.8em;
	width: 42px;
	height: 42px;
}

.pplus-orange,
nav.global ul li.current-menu-item > a,
nav.global ul li.current-menu-parent > a,
nav.global ul li.current-menu-parent ul li.current-menu-item > a,
body.single-post nav.global > ul > li.menu-item-11 > a,
body.single-neues nav.global > ul > li.menu-item-1247 > a {
	color: var(--clr-primary);
}




@media (width >= 720px) {

	a.menu-link {
		display: none;	
	}

}


nav.global ul {
	position: relative;
	margin: 3rem 0 0 0;
	padding: 0;
	list-style: none;
}
	nav.global ul li {
		float: left;
		margin-right: 1.5rem;
	}
		nav.global ul li a {
			color: #333;
			text-decoration: none;
		}
			nav.global ul.sub-menu {
				display: none;
				position: absolute;
				left: 0;
				top: 0;
				line-height: 150%;
			}
				nav.global ul.sub-menu li {
					margin-right: 1.5rem;
				}
			nav.global li.current-menu-item .sub-menu,
			nav.global li.current-menu-parent .sub-menu {
				display: block;
			}


/* MARK: iPhone Mode
---------------------------------------------------------------------------------------------------*/
@media (width <= 720px) {

	.js nav.global {
		position: absolute;
		left: 0;
		top: 117px;
		width: 100%;
		overflow: hidden;
		max-height: 0;
	}

		nav.global.active {
			max-height: 50em;
		}

	nav.global {
		margin: -1px 0 0 0;
		clear: both;
		transition: all 0.4s ease-out;
	}
		nav.global > ul {
			margin: 0;
			padding: 2em 1em 1em 1em;
			background: rgba(0,0,0,.8);
			z-index: 99999;
		}
			nav.global > ul:before {
				position: absolute;
				left: .8em;
				top: -2px;
				content: '';
				width: 0px;
				height: 0px;
				border-style: solid;
				border-left: 20px solid transparent;
				border-right: 20px solid transparent;
				border-top: 20px solid #fff;
				display: inline-block;
			}
			nav.global ul li {
				float: none;
				display: block;
				padding: .4em 0;
				margin-right: 0;
				border-bottom: 1px solid #ddd;
			}
				nav.global ul li:last-child {
					border-bottom: none;
				}
					nav.global ul li a {
						color: #fff;
					}
						nav.global ul.sub-menu {
							position: relative;
							margin: 0 0 0 1.5em;
						}


	

	
	ul.thumbs li img {
		max-width: 75px;
	}	


	#footer-row span {
		display: block;	
	}
		#footer-row span.hide {
			display: none;	
		}

}




/* MARK: Frontpage Swiper
---------------------------------------------------------------------------------------------------*/
ul.bxslider { 
	margin: 0 !important; 
	padding: 0 !important;
}
.bx-pager {
	z-index: 100;
}



.swiper-frontpage {
	--swiper-navigation-size: 22px;
  --swiper-navigation-color: var(--clr-primary);

	--swiper-pagination-bullet-size: 15px;
	--swiper-pagination-color: var(--clr-primary);
	--swiper-pagination-bullet-inactive-color: #fff;
	--swiper-pagination-bullet-inactive-opacity: 1;
}

.swiper-frontpage .swiper-pagination {
	display: none;

	@media (width >= 40rem) {
		display: block;
		bottom: 7.5rem
	}
}

.swiper-frontpage .swiper-pagination-bullet {
	border: 2px solid #fff;
}

.swiper-frontpage :is(.swiper-button-prev, .swiper-button-next) {
	top: calc(50% - 3rem);
}



			
/* MARK: Main Layout
---------------------------------------------------------------------------------------------------*/

.wrap {
	margin-inline: auto;
	max-width: 960px;
}

.row {
	padding-left: .8em;
	padding-right: .8em;	
}


@media (width >=720px) {
	.slot33 {
		float: left;
		width: 30%;
		margin-right: 5%;
	}
		.slot33:last-child {
			margin-right: 0;
		}
		
	.sidebar {
		float: left;
		width: 30%;
		margin-right: 5%;
	}
	.content {
		float: right;
		width: 65%;
	}

}


#header-row {
	margin: 30px 0 0 0;
	height: 150px;
}
	#header-row .wrap {
		padding: 0 0 15px 0;
		border-bottom: 1px solid var(--clr-secondary);	
	}


#visual-row {
	margin-top: -1.5rem;
	margin-bottom: 1.5em;	
}
	#visual-row h2 {
		color: var(--clr-primary);	
	}
	#visual-row p {
		color: var(--clr-line);
	}
	#visual-row a {
		color: var(--clr-line);
		text-decoration: none;		
	}
		#visual-row a:hover {
			color: var(--clr-primary);	
		}



	#projectvisual-row .wrap {
		background: #E2E4DF;
		margin-bottom: 3em;	
	}




	#teaser-row .wrap {
		margin: 0 auto;
		border-top: 1px solid var(--clr-secondary);
	}


#content-row {
	margin: 0 0 1.5em 0;
}


#footer-row {
	font-size: .9em;
	color: var(--clr-secondary);	
}
	#footer-row .wrap {
		border-top: 1px solid var(--clr-secondary);
		margin: 0 auto;
	}
	#footer-row .wrap a {
		color: var(--clr-secondary);
		text-decoration: none;
	}
		#footer-row .wrap a:hover {
			color: var(--clr-primary);
		}
	#footer-box {
		margin: 3em 0 0 0;
		padding: .5em 1em;
		background: #E2E4DF;
	}

	


/* Typo 
-------------------------------------------------------------------------------------------------- */
h1 {
	margin-top: 0;
	font-size: 1.8em;
	font-weight: normal;
	color: var(--clr-primary);	
}
h2 {
	margin: 1em 0 .3em 0;
	font-size: 1.4em;
	font-weight: normal;
}

h3 {
	font-family: Georgia, Times, "Times New Roman", Cambria, serif;
	margin: 1em 0 .3em 0;
	font-size: 1.2em;
	font-weight: normal;
}

article p,
article li {
	font-family: Georgia, Times, "Times New Roman", Cambria, serif;
	font-size: 1em;
	line-height: 150%;
}

article a {
	color: var(--clr-primary);
	text-decoration: none;
}
	article a:hover {
		text-decoration: underline;
	}

p.meta {
	font-size: .8em;
	color: #999;	
}

p.underline {
	text-decoration: underline;	
}



article hr {
	clear: both;
	height: 1px;
	border-style: none;
	color: #d0d0d0;
	background-color: #ddd;
}




hr {
	clear: both;
	height: 1px;
	border-style: none;
	border-top: 1px solid var(--clr-secondary);
}
	hr.semiblack {
		border-top: 1px solid var(--clr-line);
	}

.newsdate {
	display: block;
	font-size: .9rem;
	color: var(--clr-line);
}

.sidebar h2.newstitle {
	margin-top: .2rem;
	font-size: 1rem;
	color: #333;
}

.news-row .content {
	margin-top: .2rem;
}
	.news-row .content .toggle {
		overflow: hidden;
	}
		.news-row .content .toggle p:first-child {
			margin-top: 0;
		}


div.article-box:last-of-type hr.semiblack {
	display: none;
}



/* Template XMas Special 2023 */
.xmas-portrait,
.xmas-landscape {
	background-color: #f5f5f5;
}
.xmas-portrait img,
.xmas-landscape img {
	display: block;
}

.xmas-landscape {
	display: none;
}
	@media(min-width: 720px) {
		.xmas-portrait {
			display: none;
		}
		.xmas-landscape {
			display: block;
		}
	}




figure.zoomable {
	position: relative;
}
	figure.zoomable img.size-full {
		display: block;
	}
	figure.zoomable:after  {
		position: absolute;
		bottom: 0;
		right: 0;
		content: url(css/images/lupe.svg);
		width: 1.2rem;
		height: 1.2rem;
		color: #fff;
		/*background: var(--clr-primary);*/
		padding: .5rem;
		z-index: 1;
	}


a.post-edit-link {
	font-family: Calibri, Verdana, Arial, Helvetica;
	padding: 3px 5px;
	text-decoration: none !important;
  border-bottom: none;
	background: var(--clr-primary);
	color: #fff !important;
	font-size: .9em;
  border-radius: 2px;
}


/* MARK: References 
-------------------------------------------------------------------------------------------------- */
.references {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
  grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
  gap: 1rem;
	margin-block: 1.5rem;
}
	.references a {
		color: #333;
		text-decoration: none;
	}
		/* .references > * {
			border: 1px solid var(--clr-primary);
		} */
		.references a:hover {
			color: var(--clr-primary);
		}
	.references h2 {
		margin: .5rem 0;
		font-size: 1.1em;
		font-weight: normal;
	}
	.references p {
		margin: 0;
		font-size: .8em;
		color: var(--clr-line);
		text-decoration: underline;
	}	

	@media (min-width: 720px) {
		.references {
			gap: 2rem;
		}
	}




/* MARK: Sidebar 
-------------------------------------------------------------------------------------------------- */
.sidebar h3 {
	font-family: 'Unicod-Regular', Verdana, Arial, Helvetica, sans-serif;
	color: var(--clr-line);
}

.sidebar figure {
	padding-top: .5em;
	padding-bottom: .5em;
	border-top: 1px solid var(--clr-line);
	border-bottom: 1px solid var(--clr-line);
	margin-bottom: 1em;
}
	.sidebar figure img {
		display: block;
	}

.sidebar a {
	color: var(--clr-primary);
	text-decoration: none;	
}


dl.sideinfos {
	margin: 4em 0 0 0;
}
	dl.sideinfos dt {
		color: var(--clr-line);
		padding-bottom: .5rem;
		border-bottom: 1px solid var(--clr-line);
		margin-bottom: .5rem;
	}
	dl.sideinfos dd {
		margin: 0;
		color: var(--clr-primary);
		margin-bottom: 1rem;
	}
		dl.sideinfos dd > ul {
			padding-left: 1rem;
			line-height: 150%;
		}


aside.download h4 {
	color: var(--clr-line);
	padding-bottom: .5rem;
	border-bottom: 1px solid var(--clr-line);
	margin-bottom: .5rem;
}
aside.download p:first-of-type {
	margin: 1rem 0 0 0;
	padding: 0;
}
aside.download p:last-child {
	margin-top: 0;
	color: var(--clr-line);
	padding-top: .5rem;
	border-top: 1px solid var(--clr-line);
}



/* MARK: Showhide 
-------------------------------------------------------------------------------------------------- */
dl.show-hide {
  margin: 1rem 0;
  padding: 0;
}
  dl.show-hide dt {
    padding: .5rem 1rem;
    font-size: 1.1rem;
    background-color: #E2E4DF;
  }
    dl.show-hide dt:before {
      display: inline-block;
      content: '>';
      margin-right: .5rem;
    }
      dl.show-hide dt.expanded:before {
      transform: rotate(90deg);
    }
    
    dl.show-hide dt:hover {
      background-color: var(--clr-primary);
      color: #fff;
      cursor: pointer;
    }
  dl.show-hide dd {
    margin: 0;
    padding: .5rem 1rem;
    font-family: Georgia, Times, "Times New Roman", Cambria, serif;
    background-color: rgba(226,228,223,.50);
    border-top: 2px solid #fff;
  }
  dl.show-hide dd strong {
    color: var(--clr-primary);
  }
  dl.show-hide dd ul {
    margin: .5rem 0;
    padding: 0 0 0 1rem;
  }
	dl.show-hide dd figcaption {
		margin-block-start: .5rem;
		margin-block-end: 2rem;
		font-family: 'Unicod-Regular', Verdana, Arial, Helvetica, sans-serif;
	}

	dl.show-hide.white dd {
    padding: .5rem 0;
    background-color: #fff;
  }
		dl.show-hide.white strong {
			color: var(--clr-text);
		}



	/* body.page-template-page-10years	h1 {
		font-size: clamp(1.5rem, 5vw, 2.3rem);
	}	 */



/* MARK: Social 
-------------------------------------------------------------------------------------------------- */
.socialmedia {
	float: right;
	margin-block-start: 1rem;
	padding: 0;
	list-style: none;
	display: flex;
	gap: .5rem;
}
	.socialmedia img {
		max-width: 1.75rem;
		height: auto;
		fill: #575859;
	}

	@media (max-width : 720px) {
		.socialmedia {
			float: none;
		}
	}


	
/* MARK: Little Helpers
-------------------------------------------------------------------------------------------------- */

.grey,
a.grey-link {
	color: var(--clr-line);
}

.add-space {
	height: 25px;	
}

.group:before,
.group:after {
    content: "";
    display: table;
}
.group:after {
    clear: both;
}













/* MARK: project quote
-------------------------------------------------------------------------------------------------- */
.project-quote {
	margin: 1.5em 0;
	padding: 1.5em 0;
	border-top: 1px solid var(--clr-secondary);	
	border-bottom: 1px solid var(--clr-secondary);
	
}
	.project-quote figure {
		margin-block-end: 1.5rem;	
	}
	.project-quote-quote blockquote {
		margin: 0;
		font-size: 1.4em;
		color: var(--clr-primary);	
	}
	.project-quote-quote blockquote p,
	.project-quote-quote p {
		margin: 0 0 .5em 0;
		font-family: "Unicod-Regular", Verdana, Arial, Helvetica, sans-serif;	
	}
	
@media(width >= 720px) {
	.project-quote figure {
		float: left;
		width: 40%;
		margin-block-end: 0;
	}
	.project-quote .project-quote-quote {
		float: right;
		width: 55%;
	}
}	




/* MARK: projects
-------------------------------------------------------------------------------------------------- */
#projectimage img {
	display: block;	
}

#projectthumbs  {
	padding: 1em;	
}
	ul.thumbs {
		margin: 0;
		padding: 0;
		width: 100%;
		list-style: none;	
	}
		ul.thumbs li {
			float: left;
			margin: 0 .5em .5em 0;
		}
			ul.thumbs li img {
				max-width: 120px;
				display: block;
			}	


/* MARK: new project slider
-------------------------------------------------------------------------------------------------- */
body.single-post:has(#projectslider-row) #header-row {
	height: auto;
	border-bottom: 1px solid #000;
}
	body.single-post:has(#projectslider-row) #header-row .wrap {
		border-bottom: none;
	}
	body.single-post .mfp-title {
		display: inline-block;
		margin-block-start: .25rem;
		font-size: 1rem;
		line-height: 1.5rem;
	}

	/* body.single-post .mfp-figure {
		border: 2px solid red;
		display: flex;
		flex-direction: row;
	}
	body.single-post .mfp-figure figure figcaption {
		order: 1;
	}
	body.single-post .mfp-figure figure {
		order: 2;
	} */


#projectslider-row {
	padding-block: 1.5rem;
	margin-block-end: 3rem;
	background-color: #E2E4DF;
}
	.swiper-projects {
		--swiper-navigation-size: 42px;
		--swiper-navigation-color: #fff;
	}

		/* slides */
		.swiper-projects .swiper-slide {
			background-color: #c3c5bd;
		}
			.swiper-projects .swiper-slide a {
				display: block;
				position: relative;
			}
				.swiper-projects .swiper-slide img.zoom-icon {
					position: absolute;
					right: 2vw;
					bottom: 2vw;
					width: 2rem;
					height: 2rem;
					opacity: .75;
				}
		.swiper-projects .swiper-slide img {
			width: 100%;
			height: 100%;
			aspect-ratio: 16/10;
			object-fit: contain;
		}

	/* Thumbs */	
	.swiper-projects-thumbs {
		padding: 10px 0;
		height: 4rem;
	}
		.swiper-projects-thumbs img {
			height: 100%;
			width: 100%;
			object-fit: cover;
		}
	
.swiper-projects-thumbs .swiper-slide {
		width: 100%;
		opacity: 0.4;
		cursor: pointer;
	}
		.swiper-projects-thumbs .swiper-slide-thumb-active {
			opacity: 1;
		}






/* MARK: Formulare
-------------------------------------------------------------------------------------------------- */
dl.cform {
	margin: 1em 0;
}
	dl.cform dt label {
		display: block;
		margin: 0 0 .5em 0;
	}
		dl.cform dt small {
			font-weight: normal;
			color: #999;
		}
	dl.cform dd {
		margin: 0 0 1em 0;
	}
		dl.cform dd input,
		dl.cform dd textarea {
			background: #f5f5f5;
			border: none;
			padding: .3em;
			width: 100%;
		}
		dl.cform dd small {
			color: var(--clr-line);
		}
	dl.cform dd img.input-captchaimage {
		vertical-align: top;
		width: 5rem;
		float: left;
		margin-right: .5rem;
	}
	dl.cform dd input[type=text].input-captchacode {
		width: 120px;
	}
	input.wpcf7-submit {
		border: none;
		padding: 5px 15px;
		text-decoration: none;
		background: var(--clr-primary);
		color: #fff;
		border-radius: 2px;
	}




/* MARK: - Jobform
-------------------------------------------------------------------------------------------------- */
.joboffers {
	margin: 1rem 0;
}
	h3.jobtitle {
		background-color: #E2E4DF;
		margin: 0;
		font-family: 'Unicod-Regular', Verdana, Arial, Helvetica, sans-serif;
		font-size: 1rem;
	}
		h3.jobtitle:hover,
		h3.jobtitle.active {
			background-color: var(--clr-primary);
			color: #fff;
		}
			h3.jobtitle a {
				display: block;
				padding: .3rem .8rem;
				color: #323A2E;
				text-decoration: none;
			}
				h3.jobtitle a:hover,
				h3.jobtitle.active a {
					color: #fff;
				}
			

	.jobdetails {
		background-color: #E2E4DF;
		padding: .3rem .8rem;
	}
	.jobform {
		margin-top: .5rem;
		border: 2px solid var(--clr-primary);
		padding: .3rem .8rem;
	}

input.hidden-jobtitle {
	display: none;
}



.is-left {
	float: left;
	width: 48%;
}
.is-right {
	float: right;
	width: 48%;
}

@media (max-width: 720px) {
	.is-left,
	.is-right {
		float: none;
		width: 100%;
	}
}


.left-right label {
	font-size: .9rem;
}
.left-right textarea {
	height: 9rem;
}


/* MARK: CCF7 Styles
-------------------------------------------------------------------------------------------------- */
fieldset {
	border: none;
	padding: 0;
}

div.wpcf7 {
	margin: 0;
	padding: 0;
}
div.wpcf7-response-output {
	margin: 1em 0;
	padding: .5em;
}
	div.wpcf7 .screen-reader-response {
		position: absolute;
		overflow: hidden;
		clip: rect(1px, 1px, 1px, 1px);
		height: 1px;
		width: 1px;
		margin: 0;
		padding: 0;
		border: 0;
	}
div.wpcf7-mail-sent-ok {
	background: var(--clr-primary);
	color: #fff;
}
	div.wpcf7-mail-sent-ng,
	div.wpcf7-spam-blocked,
	div.wpcf7-validation-errors {
		border: 2px solid var(--clr-primary);
		background: #E2E4DF;
		padding: .5rem;
	}
span.wpcf7-form-control-wrap {
	position: relative;
}
span.wpcf7-not-valid-tip {
	color: var(--clr-primary);
	font-size: 1em;
	display: block;
}
span.wpcf7-list-item {
	margin-left: 0.5em;
}
.wpcf7-display-none {
	display: none;
}
div.wpcf7 img.ajax-loader {
	border: none;
	vertical-align: middle;
	margin-left: 4px;
}
div.wpcf7 div.ajax-error {
	display: none;
}
div.wpcf7 .placeheld {
	color: #888;
}


/* my additions */
.wpcf7-radio label {
	display: block;	
}

input.small-field {
	max-width: 20%;	
}
input.middle-field {
	max-width: 75%;	
}




/* MARK: Magnific Popup
-------------------------------------------------------------------------------------------------- */

.mfp-container {
  padding-inline: 5vw;
}

img.mfp-img {
	padding-inline: 0;
	padding-block: 50px;
}
	.mfp-figure::after {
		box-shadow: none;
		background: transparent;
	}

.mfp-bg {
  background: #0b0b0b;
  opacity: .95;
}

.mfp-arrow-left, .mfp-arrow-right {
  --side-padding: .9rem;
  --button-width: 2.5rem;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  width: var(--button-width);
}
/* 
  https://www.svgviewer.dev/svg-to-data-uri 
  white fill *sadly* added inside the base64 code  
*/
.mfp-arrow-left {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><path fill="white" d="M169.4 297.4C156.9 309.9 156.9 330.2 169.4 342.7L361.4 534.7C373.9 547.2 394.2 547.2 406.7 534.7C419.2 522.2 419.2 501.9 406.7 489.4L237.3 320L406.6 150.6C419.1 138.1 419.1 117.8 406.6 105.3C394.1 92.8 373.8 92.8 361.3 105.3L169.3 297.3z"/></svg>') !important;
  margin-inline-start: var(--side-padding);
}
.mfp-arrow-right {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><path fill="white" d="M471.1 297.4C483.6 309.9 483.6 330.2 471.1 342.7L279.1 534.7C266.6 547.2 246.3 547.2 233.8 534.7C221.3 522.2 221.3 501.9 233.8 489.4L403.2 320L233.9 150.6C221.4 138.1 221.4 117.8 233.9 105.3C246.4 92.8 266.7 92.8 279.2 105.3L471.2 297.3z"/></svg>') !important;
  margin-inline-end: var(--side-padding);
}

.mfp-arrow-left::before, .mfp-arrow-right::before {
  display: none;
  content:''
}
.mfp-arrow-left::after, .mfp-arrow-right::after {
  display: none;
  content:''
}

button.mfp-close {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 2.5rem;
  height: 2.5rem;
	font-size: 3rem;
  margin: 1rem;
  border-radius: 9999px;
  color: #fff;
}



.admin-tools {
  padding: 0;
	list-style-type: none;
	margin-block-start: 3rem;
  display: flex;
  flex-wrap: wrap;
  gap: .25rem;
  font-size: var(--step--1);
  line-height: 1;
  color: var(--clr-text);
}
	.admin-tools li {
		background-color: #f5f5f5;
		border-radius: .25rem;
		padding: .2rem;
		font-size: .9rem;

		& a {
			color: #666;
		}
	}