/*
Theme Name:     SDC 2.0
Description:    Default child theme for the PKD parent theme
Author:         Peter King Design
Author URI:     https://peterkingdesign.com
Template:       PKD
Version:        1.0
*/

html {
	scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}


/*--------------------------------------------------------------
Colors
--------------------------------------------------------------*/

/* Add project colors here for quick reference. */



/* Site Colors
--------------------------------------------- */

/* Blue: #2a62a0 */


/*--------------------------------------------------------------
Variables
--------------------------------------------------------------*/

/*
 * Define only project-specific values that override the parent defaults.
 * Remove unused variables.
 */

:root {
	
	/* Font */
	--pkd-font-primary: "Lato", sans-serif;
	--pkd-font-secondary: "Lato", sans-serif;

	
	/* Brand palette */
	--pkd-color-primary: #2a62a0;
	--pkd-color-primary-dark: #1f4a78;
	--pkd-color-secondary: #aaa;
	--pkd-color-tertiary: var(--pkd-color-secondary);

	/* Project-specific roles */
	--pkd-color-link: var(--pkd-color-primary-dark);
	--pkd-color-link-hover: var(--pkd-color-primary);

	/* Header */
	--header-background: rgb(255 255 255 / 0%);
	--header-background-scroll: var(--pkd-color-background);
	--header-menu-color: var(--pkd-color-border);
	--header-menu-color-scroll: var(--pkd-color-background-reverse);
	

	/* Image overlay */
	--pkd-image-overlay: linear-gradient(
		rgb(0 0 0 / 70%) 0%,
		rgb(0 0 0 / 10%) 50%,
		rgb(0 0 0 / 40%) 100%
	);
	
	--header-logo-width: 280px;
	--header-logo-width-scroll: 190px;
	--header-height: 90px;
	--header-height-scroll: 70px;
	--header-height-initial: calc(var(--header-height) + 10px);
	
}

/*
Optional layout and component variables can be added to the same :root block:

	--pkd-site-width
	--pkd-site-gutter
	--pkd-column-gap
	--pkd-row-gap
	--header-logo-width
	--header-logo-width-scroll
	--header-menu-color
	--header-menu-color-scroll
	--pkd-no-hero-bg
	--pkd-blog-gap
	--pkd-blog-ratio
*/



/*--------------------------------------------------------------
Global Typography
--------------------------------------------------------------*/
h1, h2, h3, h4, h5, h6 { 
	font-weight: 300;
	letter-spacing: 4px;
}


/* Contact Form
--------------------------------------------- */


/* Selection
--------------------------------------------- */


/*--------------------------------------------------------------
Custom Fonts
--------------------------------------------------------------*/


/*--------------------------------------------------------------
Structure
--------------------------------------------------------------*/

body {
	position: relative;
}

.site-width {
	--pkd-site-width: clamp(900px, 150vh, 1200px);
}

.site-width--skinny {
	--pkd-site-width: 800px;
}

.site-width--wide {
	--pkd-site-width: clamp(1200px, 150vh, 1600px);
}



.site-ornament {
	position: fixed;
	top:0;
	right:0;
	z-index: 1000;
	pointer-events: none;
	background: var(--pkd-color-primary);
	width:10px;
	height:10px;
}

.site-ornament::before {
	content: "";
	position: absolute;
	top: 0;
	right: 10px;
	width: 1px;
	height: 100vh;
	background: var(--pkd-color-secondary);
}

.site-ornament::after {
	content: "";
	position: absolute;
	top: 10px;
	right: 0;
	width: 100vw;
	height: 1px;
	background: var(--pkd-color-secondary);
}

.section-borderline {
	position: absolute;
	top: 10px;
	left: 0;
	width: 100%;
	height: 1px;
	background: var(--pkd-color-secondary);
	z-index: 10;
}

.image-ornament {
	position: absolute;
	inset:0;
	z-index: 10;
	pointer-events: none;
}
.image-ornament:before {
	content: "";
	position: absolute;
	bottom: 0;
	left: 10px;
	width: 1px;
	height: 100%;
	background: var(--pkd-color-secondary);
}
.image-ornament:after {
	content: "";
	position: absolute;
	bottom: 10px;
	left: 0;
	width: 100%;
	height: 1px;
	background: var(--pkd-color-secondary);
}


/* Site Width
--------------------------------------------- */

/*
 * 37.5em  = 600px
 * 48em    = 768px
 * 56.25em = 900px
 * 75em    = 1200px
 * 100em   = 1600px
 */


/* Page Header and Content Widths
--------------------------------------------- */

/* Example: make standard page content skinny without overriding the template.

.entry-content__inner {
	--pkd-site-width: 50em;
}

*/


/* Alignment
--------------------------------------------- */


/* Section Bands
--------------------------------------------- */


/* Viewport Heights
--------------------------------------------- */


/* Header-Adjusted Heights
--------------------------------------------- */


/* Ratio
--------------------------------------------- */


/* Flex Rows and Columns
--------------------------------------------- */


/* PKD Grid
--------------------------------------------- */

/* Common grid layouts */


/* Two, Four and Five Columns
--------------------------------------------- */


/* Three Columns and Proportional Layouts
--------------------------------------------- */


/* Four and Five Equal Columns
--------------------------------------------- */


/*--------------------------------------------------------------
Header
--------------------------------------------------------------*/

#branding {
	padding-top: 10px;
    height: calc(var(--header-height-current) + 10px);
}

/* Header: Mobile */
@media screen and (max-width: 59.9375em) {
	body {
		--header-height-current: 84px;
		--header-height-initial: 84px;
		--mobile-header-logo-width: clamp(190px, 48vw, 260px);
		padding-bottom: calc(60px + env(safe-area-inset-bottom));
	}

	body.scroll {
		--header-height-current: 60px;
		--mobile-header-logo-width: clamp(160px, 40vw, 210px);
	}

	#branding {
		position: fixed;
		inset: auto 0 0;
		height: calc(var(--header-height-current) + env(safe-area-inset-bottom));
		padding: 0 0 env(safe-area-inset-bottom);
		box-sizing: border-box;
		background: var(--header-background-scroll);
		border-top: 1px solid var(--pkd-color-border-light);
		border-bottom: 0;
	}

	#branding .header-flex {
		position: relative;
		align-items: center;
		height: var(--header-height-current);
		padding-inline: clamp(1rem, 4vw, 2rem);
		box-sizing: border-box;
	}

	#branding #logo-container {
		height: var(--header-height-current);
		flex: 0 1 var(--mobile-header-logo-width);
		max-width: var(--mobile-header-logo-width);
	}

	#branding #logo-container.has-scroll-logo #logo {
		z-index: 1;
		opacity: 0;
		pointer-events: none;
	}

	#branding #logo-container.has-scroll-logo #logo-scroll {
		z-index: 2;
		opacity: 1;
		pointer-events: auto;
	}

	#FixedHeaderSpacer {
		height: 0;
	}
}


/*--------------------------------------------------------------
Sliders and Backgrounds
--------------------------------------------------------------*/


/* Gradient Overlay
--------------------------------------------- */


/* Page Hero
--------------------------------------------- */

.page-hero {
	height: calc(100vh - var(--header-height-initial));
	height: calc(100svh - var(--header-height-initial));
}



/* Homepage Hero Scroll Arrow */
.home .home-hero-scroll {
	position: absolute;
	left: 50%;
	bottom: 2em;
	z-index: 10;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 3em;
	height: 3em;
	transform: translateX(-50%);
	color: #fff;
}

.home .home-hero-scroll__arrow {
	display: block;
	width: 1.5em;
	height:  1.5em;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg) translate(-3px, -3px);
	opacity: .5;
	transition: transform 200ms ease, opacity 200ms ease;
}

.home .home-hero-scroll:hover .home-hero-scroll__arrow,
.home .home-hero-scroll:focus-visible .home-hero-scroll__arrow {
	transform: rotate(45deg) translate(3px, 3px);
	opacity: 1;
}


/* No Hero
--------------------------------------------- */


/*--------------------------------------------------------------
Home Page
--------------------------------------------------------------*/

#Section-Home-About { padding-bottom: 0;}

.sdc-about-grid { gap:0; }
.sdc-about-photo {
	background: url(/wp-content/uploads/2022/09/image-9-scaled.jpeg) no-repeat;
	background-size: cover;
	min-height: 50vw;
}
.sdc-about-content {
	background-color:#234973;
	position: relative;
	padding: 10vw;
}
.sdc-about-content::after {
	content:"";
	position: absolute;
	z-index: 1;
	inset:0;
	background: url(/wp-content/uploads/2022/09/image-9-scaled.jpeg) no-repeat;
	background-size: cover;
	transform:scaleX(-1);
	opacity: .06;
	pointer-events: none;
}

.sdc-about-content p {
	font-size: 1.325em;
}

/* About SDC: Mobile */
@media screen and (max-width: 37.5em) {
	.sdc-about-photo {
		width: 100%;
		height: 100vw;
		min-height: 100vw;
	}
}

/* Home Stats
--------------------------------------------- */

.home-stats {
	background-color: #f1f1f1;
	padding: 4vh 0;
}

.home-stats__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(2rem, 5vw, 6rem);
}

.home-stat {
	text-align: center;
}

.home-stat__number {
	color: var(--pkd-color-primary);
	font-size: clamp(3rem, 5vw, 6rem);
	font-weight: 300;
	letter-spacing: -0.04em;
	line-height: 0.95;
}

.home-stat__label {
	max-width: 18rem;
	margin: 1.25rem auto 0;
	color: #707070;
	font-size: clamp(1rem, 1.4vw, 1.25rem);
	line-height: 1.2;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-weight: 600;
	border-top: 1px solid #CCC;
	padding-top: 20px;
}



.founded-in {
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.5em;
    font-weight: 300;
    font-size: clamp(0.8em, 3vw, 1.2em);
    margin: 2em auto 0 auto;
    position: relative;
    display: block;
    width: fit-content;
    align-items: center;
    background: #FFF;
    /* color: #FFF; */
    padding: 0.4em 2em;
    line-height: 1;
    white-space: nowrap;
    border: 1px solid #CCC;

}
.founded-in span { font-weight: 600; }

.founded-in::before,
.founded-in::after {
    content: "";
    position: absolute;
    height: 1px;
    background: #BBB;
    inset: 0;
    transform: translateX(-90%);
    top: 50%;
    width: 10vw;
    left: 0;

}

.founded-in::after {
    transform: translateX(90%);
    left: auto;
    right: 0;

}

@media screen and (max-width: 48em) {
	.home-stats__grid {
		grid-template-columns: 1fr;
	}
}

/* Featured Projects
--------------------------------------------- */

#Featured-Projects {}

.featured-projects {
	padding-block: clamp(60px, 8vw, 120px);
	background-color: var(--pkd-color-background);
	position: relative;
}


.featured-projects__navigation {
    width: var(--pkd-site-width);
    position: absolute;
    height: calc(var(--pkd-site-width) / 2);
}

.featured-projects__prev,
.featured-projects__next {color: #aaa;}
.featured-projects__prev {left: -50px;}
.featured-projects__next {right: -50px;}

.featured-projects-swiper {
	width: 100%;
}

.featured-projects-swiper .swiper-wrapper {
	align-items: flex-start;
	height: auto;
}

.featured-project {
	position: relative;
	height: auto !important;
	min-height: 0;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background-color: var(--pkd-color-background-reverse);
}

.featured-project__link {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: auto;
	color: var(--pkd-color-text-reverse);
	overflow: hidden;
}

.featured-project__image {
	width: 100%;
	height: 100%;
	margin: 0;
}

.featured-project__image-element {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.7s ease;
}

.featured-project__link::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(
		to top,
		rgb(0 0 0 / 65%) 0%,
		rgb(0 0 0 / 10%) 45%,
		transparent 70%
	);
	pointer-events: none;
}

.featured-project__content {
	position: absolute;
	z-index: 2;
	right: auto;
	bottom: 20px;
	left: 20px;
	padding: 0;
}

.featured-project__name {
	margin: 0;
	color: #FFF;
	font-size: clamp(1rem, 2.5vw, 2rem);
	text-transform: uppercase;
	line-height: 1;
}

.featured-project__link:hover {
	color: var(--pkd-color-text-reverse);
}

.featured-project__link:hover .featured-project__image-element {
	transform: scale(1.04);
}

/* Featured Projects: Mobile */
@media screen and (max-width: 59.9375em) {
	#Featured-Projects {
		overflow: hidden;
	}

	#Featured-Projects .featured-projects__navigation {
		display: none;
	}

	#Featured-Projects .featured-projects-swiper {
		overflow: hidden;
	}
}

/*--------------------------------------------------------------
Slideshow / Swiper
--------------------------------------------------------------*/


/*--------------------------------------------------------------
Menu
--------------------------------------------------------------*/


/* Main Navigation
--------------------------------------------- */


/* Base Menu Structure
--------------------------------------------- */


/* Top-Level Menu
--------------------------------------------- */


/* Submenus
--------------------------------------------- */

#mainnav li:hover > a, #mainnav li:focus-within > a, #mainnav .current-menu-item > a, #mainnav .current-menu-parent > a, #mainnav .current-menu-ancestor > a, #mainnav .current_page_item > a, #mainnav .current_page_parent > a, #mainnav .current_page_ancestor > a, #mainnav .current_parent_item > a {
    color: #FFF;
}


#mainnav a { color: #eee; }

#mainnav .menu > li {
    border-top: 10px solid transparent;
	border-color: transparent;
    transform: translateY(-10px);
	background-color:#FFFFFF00;
	transition: border-color 300ms ease-out, background-color 300ms ease-out;
}
#mainnav .menu > li:hover {
	border-color: var(--pkd-color-primary);
	transition: border-color 200ms ease-in, background-color 200ms ease-out;
	background-color:#FFFFFF11;
}
.scroll #mainnav .menu > li:hover > a,
.scroll #mainnav .menu > li:focus-within > a,
.no-hero #mainnav .menu > li:hover > a,
.no-hero #mainnav .menu > li:focus-within > a {
	color:  var(--pkd-color-primary);
}

	



#mainnav .sub-menu li {
	background: #eee;
	color:#555;
}
#mainnav .sub-menu li a {
	color:#555;
}

/* Mobile Navigation Drawer */
@media screen and (max-width: 59.9375em) {
	body.mobile-menu-open {
		overflow: hidden;
	}

	#branding #hamburger {
		z-index: 1000;
	}

	#branding #hamburger.active .layer {
		background: var(--pkd-color-primary);
	}

	#mainnav #responsive-menu {
		position: fixed;
		z-index: 900;
		top: 0;
		right: 0;
		bottom: calc(var(--header-height-current) + env(safe-area-inset-bottom));
		left: auto;
		display: block;
		width: min(68vw, 420px);
		min-width: min(280px, 100vw);
		height: auto;
		box-sizing: border-box;
		background: var(--pkd-color-primary-dark);
		overflow: hidden;
		visibility: hidden;
		pointer-events: none;
		transform: translate3d(100%, 0, 0);
		transition:
			transform 350ms ease-out,
			visibility 0s linear 350ms;
	}

	#mainnav.openmenu #responsive-menu {
		left: auto;
		visibility: visible;
		pointer-events: auto;
		transform: translate3d(0, 0, 0);
		transition-delay: 0s;
	}

	#responsive-menu > div:not(.mobile-menu-social) {
		position: absolute;
		top: auto;
		right: clamp(1.5rem, 6vw, 3rem);
		bottom: clamp(1.25rem, 4vh, 2.5rem);
		left: clamp(1.5rem, 6vw, 3rem);
		max-height: calc(100% - clamp(8rem, 18vh, 11rem));
		overflow-y: auto;
		overflow-x: hidden;
	}

	#mainnav #responsive-menu ul,
	#mainnav #responsive-menu ul.menu {
		display: block;
		margin: 0;
		padding: 0;
	}

	#mainnav #responsive-menu ul.menu > li {
		padding: 0 0 .25em 0;
	}

	#mainnav #responsive-menu ul li {
		position: relative;
		display: block;
		width: 100%;
		margin: 0;
		padding: 0;
		border: 0;
		background: transparent;
		transform: none;
	}

	#mainnav #responsive-menu ul li > a {
		position: relative;
		display: block;
		padding: 0;
		color: #fff;
		font-size: clamp(1rem, 4vw, 2rem);
		font-weight: 300;
		line-height: 32px;
		letter-spacing: 0.25em;
		text-align: left;
		text-transform: uppercase;
	}

	#mainnav #responsive-menu ul li > a:hover,
	#mainnav #responsive-menu ul li > a:focus,
	#mainnav #responsive-menu .current-menu-item > a,
	#mainnav #responsive-menu .current-menu-parent > a,
	#mainnav #responsive-menu .current-menu-ancestor > a {
		color: #fff;
	}

	#mainnav #responsive-menu .mobile-submenu-toggle {
		position: absolute;
		top: 0;
		right: 0;
		z-index: 2;
		display: block;
		width: 2rem;
		min-width: 0;
		height: 2rem;
		margin: 0;
		padding: 0;
		border: 0;
		border-radius: 0;
		background: transparent;
		box-shadow: none;
		color: #fff;
		font-size: 1em;
		cursor: pointer;
		appearance: none;
	}

	#mainnav #responsive-menu .mobile-submenu-toggle::before {
		content: "";
		position: absolute;
		top: 50%;
		left: 50%;
		width: 0.55em;
		height: 0.55em;
		border-right: 2px solid currentColor;
		border-bottom: 2px solid currentColor;
		transform: translate(-50%, -70%) rotate(45deg);
		transition: transform 250ms ease-out;
	}

	#mainnav #responsive-menu li.menu-item-has-children.submenu-open > .mobile-submenu-toggle::before {
		transform: translate(-50%, -30%) rotate(-135deg);
	}

	#mainnav #responsive-menu ul li .sub-menu {
		position: static;
		display: block;
		width: 100%;
		min-width: 0;
		max-height: 0;
		padding: 0 0 0 1.35em;
		overflow: hidden;
		opacity: 0;
		visibility: hidden;
		transition:
			max-height 750ms ease,
			opacity 750ms ease,
			visibility 0s linear 750ms;
	}

	#mainnav #responsive-menu ul li.submenu-open > .sub-menu {
		max-height: 300px;
		padding-bottom: 0.25em;
		opacity: 1;
		visibility: visible;
		transition-delay: 0s;
	}

	#mainnav #responsive-menu .sub-menu li,
	#mainnav #responsive-menu .sub-menu li a {
		background: transparent;
	}

	#mainnav #responsive-menu .sub-menu li > a {
		padding: 0.42em 0;
		font-size: clamp(1.1rem, 3vw, 1.5rem);
		line-height: 1.25;
		letter-spacing: 0.1em;
		text-transform: none;
		white-space: normal;
	}

	.mobile-menu-social {
		position: absolute;
		top: clamp(2rem, 6vh, 4rem);
		right: clamp(1.25rem, 5vw, 2.5rem);
		left: clamp(1.25rem, 5vw, 2.5rem);
	}

	#mainnav #responsive-menu .mobile-menu-social .social-menu {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 0.65rem;
		padding: 0;
	}

	#mainnav #responsive-menu .mobile-menu-social .social-menu li {
		position: relative;
		display: grid;
		place-items: center;
		width: 2.35em;
		height: 2.35em;
		border-radius: 50%;
		background: #eee;
		color: #242122;
		font-size: clamp(1rem, 4.5vw, 1.35rem);
		line-height: 1;
	}

	#mainnav #responsive-menu .mobile-menu-social .social-menu li > a {
		position: absolute;
		inset: 0;
		z-index: 2;
		padding: 0;
		overflow: hidden;
		color: transparent;
		font-size: 0;
		text-indent: 200%;
		white-space: nowrap;
	}

	#mainnav #responsive-menu .mobile-menu-social .social-menu li > a::before {
		content: none;
	}
}

@media (prefers-reduced-motion: reduce) and (max-width: 59.9375em) {
	#mainnav #responsive-menu {
		transition-duration: 0s;
	}
}

/* Hover and Current States
--------------------------------------------- */


/* Hamburger
--------------------------------------------- */


/*--------------------------------------------------------------
Top Menu
--------------------------------------------------------------*/


/*--------------------------------------------------------------
Content
--------------------------------------------------------------*/


/* 404 Page
--------------------------------------------- */


/* Notices
--------------------------------------------- */


/* Image Attachments
--------------------------------------------- */


/*--------------------------------------------------------------
Images
--------------------------------------------------------------*/


/*--------------------------------------------------------------
Forms
--------------------------------------------------------------*/


/* Gravity Forms
--------------------------------------------- */


/* Contact Form 7
--------------------------------------------- */


/*--------------------------------------------------------------
Comments
--------------------------------------------------------------*/


/*--------------------------------------------------------------
PKD Content
--------------------------------------------------------------*/



/* Base Typography
--------------------------------------------- */


/* Links
--------------------------------------------- */


/* Lists
--------------------------------------------- */


/* Headers
--------------------------------------------- */

.page-title::after,
.section-title::after,
.footer-title::after {
	content: "";
	position: absolute;
	bottom:0;
	left:-.5em;
	right:0;
	height: 1px;
	width: auto;
	background: #fff;
	transition: all 500ms ease-out;
}


.page-title::before,
.section-title::before,
.footer-title::before {
	content: "";
    position: absolute;
    bottom: -.25em;
    left: -.25em;
    height: .5em;
    width: 1px;
    background: #fff;
	transition: all 500ms ease-out;
}

.section-title {
	color: var(--pkd-primary-color);
	letter-spacing: 4px;
	text-align: left;
	text-indent: -1px;
	line-height: 1.2;
	padding:0;
}
.reverse .section-title { color: #FFF; }

.section-title::after,
.section-title::before { background: #aaa; }
.reverse .section-title::after,
.reverse .section-title::before { background: #fff; }
.section-title span {border:none;}


.page-header {
	transform: translateY(-200px);
    position: relative;
    z-index: 10;
	transition: all 500ms ease-out;
}
.page-title {
	color: #FFF;
	transition: all 500ms ease-out;
	letter-spacing: 4px;
 	text-indent: -1px;
	font-weight: 300;
}
.scroll .page-title,
.no-hero .page-title {
	color: var(--pkd-color-heading);
	transition: all 500ms ease-out;
}
.scroll .page-header,
.no-hero .page-header {
	transform: translateY(0);
}

.scroll .page-title::before,
.scroll .page-title::after,
.no-hero .page-title::before,
.no-hero .page-title::after { background: #aaa;}

/* Tables
--------------------------------------------- */


/* Alignment
--------------------------------------------- */


/* Reverse Content
--------------------------------------------- */


/*--------------------------------------------------------------
Buttons
--------------------------------------------------------------*/


/* Adjacent Buttons
--------------------------------------------- */


/* Hover and Focus
--------------------------------------------- */


/* Reverse
--------------------------------------------- */

/* Works on the button or any parent */

.reverse {
	--pkd-button-color: #FFF;
	--pkd-button-bg: transparent;
	--pkd-button-border: #FFF;

	--pkd-button-hover-color: #FFF;
	--pkd-button-hover-bg: var(--pkd-color-heading);
	--pkd-button-hover-border: #FFF;
}

a.button.reverse {color:#FFF;}

.button::before {
	content:"";
	position: absolute;
	top: -6px;
	right: -6px;
	width: 6px;
	height: 6px;
	border: 1px solid var(--pkd-color-heading);
	border-width: 0 0 1px 1px;
	transition: all 300ms ease-out;
}
.button::after {
	content:"";
	position: absolute;
	bottom: -6px;
	left: -6px;
	width: 6px;
	height: 6px;
	border: 1px solid var(--pkd-color-heading);
	border-width: 1px 1px 0 0 ;
	transition: all 300ms ease-out;

}
.reverse .button::before,
.reverse .button::after,
.button.reverse::before,
.button.reverse::after{ border-color: #FFF; }

.button:hover::before {
	top:0;
	right:0;
	width:0;
	height:0;
}
.button:hover::after {
	left:0;
	bottom:0;
	width:0;
	height:0;
}

/* Sizes
--------------------------------------------- */


/* Optional Color Variations
--------------------------------------------- */


/*--------------------------------------------------------------
Video
--------------------------------------------------------------*/


/*--------------------------------------------------------------
Footer
--------------------------------------------------------------*/
#colophon {
	min-height: 50vw;
}
.sdc-footer-grid {    height: 100%; min-height: 50vw;}
.sdc-footer-image {
	width:100%;
	height:100%;
	background: url(/wp-content/uploads/2022/09/image-17.jpeg) no-repeat;
	background-position: center center;
	background-size: cover;
}

.footer-title {
	color: #FFF;
    font-size: 1.1em;
    position: relative;
    padding: 0;
    margin-bottom: 1.5em;
    text-transform: uppercase;
}

@media screen and (min-width: 48em) {
    .footer-columns {
        grid-template-columns: repeat(2, max-content);
	}
}

.footer-logo {
	width: clamp(200px, 20vw, 400px);
	height: auto; 
	margin: 1vw 0 2em 0; }

#colophon .site-width {
    width: clamp(290px, 50vw, 560px);
    margin: auto;
	padding: clamp(2em, 12vw, 6em) 0 3vw;
}

.footer-columns { column-gap: clamp(1em, 3vw, 4em);}

#copyright {

}

/* Footer Menus
--------------------------------------------- */


/* Footer Contact
--------------------------------------------- */


/* Footer Social
--------------------------------------------- */

#Footer-Social .social-menu {
	display: flex;
	align-items: center;
	gap: 0.75em;
	margin: 0;
	padding: 0;
	list-style: none;
}

#Footer-Social .social-menu li {
	margin: 0;
	padding: 0;
	list-style: none;
}

#Footer-Social .social-menu li.fab,
#Footer-Social .social-menu li.fas {
	position: relative;
	display: grid;
	place-items: center;
	width: 1em;
	height: 1em;
	font-size: 2em;
	line-height: 1;
}

#Footer-Social .social-menu a {
	display: inline-flex;
	align-items: center;
	text-decoration: none;
}

#Footer-Social .fontawesome-text {
	display: none;
}

#Footer-Social .social-menu li.fab > a,
#Footer-Social .social-menu li.fas > a {
	position: absolute;
	inset: 0;
	overflow: hidden;
	text-indent: 200%;
	white-space: nowrap;
}


/* Copyright
--------------------------------------------- */


/*--------------------------------------------------------------
Date Box
--------------------------------------------------------------*/


/*--------------------------------------------------------------
Page
--------------------------------------------------------------*/

.sdc-entry-content-grid {
	
}

.property-content-column {
	display: flex;
	flex-direction: column;
}

.property-actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.75rem;
	margin-top: auto;
	padding: 1vw 0;
}

.sdc-entry-content-grid .sdc-second-featured-image {
	max-height: calc(var(--pkd-site-width) / 2);
	overflow: hidden;
}

.sdc-entry-content-grid .sdc-second-featured-image img {
	object-fit: cover;
	width:100%;
	height: 100%;
}

/* Property Detail: Mobile */
@media screen and (max-width: 37.5em) {
	.single-portfolio .sdc-entry-content-grid > .property-contact-column {
		order: -1;
	}

	.single-portfolio .property-actions {
		flex-direction: column;
		align-items: center;
		width: 100%;
		gap: 0.55rem;
		padding-block: 0.75rem;
	}

	.single-portfolio .property-actions .button {
		width: min(85vw, 100%);
		min-width: 0;
		margin: 0;
		padding: 0.65em 1.2em;
	}

	.single-portfolio .property-actions .button + .button {
		margin-inline-start: 0;
	}
}

/*--------------------------------------------------------------
General Archive
--------------------------------------------------------------*/


/*--------------------------------------------------------------
Portfolio
--------------------------------------------------------------*/



/* Portfolio Mosaic
--------------------------------------------- */

/* Single-project gallery: preserve portrait images inside the 16:9 stage. */
#Section-Property-Swiper,
#Section-Property-Swiper .slideshow,
#Section-Property-Swiper .swiper-slide,
#Section-Property-Swiper .swiper-image {
	background-color: #191919;
}

#Section-Property-Swiper .swiper-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

#Section-Property-Swiper .swiper-slide.is-portrait .swiper-image img {
	object-fit: contain;
}

.portfolio-grid--mosaic {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	grid-auto-flow: dense;
	gap: clamp(4px, 1vw, 8px);
}

.portfolio-grid--mosaic .portfolio-card {
	position: relative;
	min-width: 0;
	aspect-ratio: 1;
	overflow: hidden;
	background-color: var(--pkd-color-background-alt);
}

.portfolio-grid--mosaic .portfolio-card__link,
.portfolio-grid--mosaic .portfolio-card__image {
	display: block;
	width: 100%;
	height: 100%;
}

.portfolio-grid--mosaic .portfolio-card__image-element {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s ease;
}

/* One large tile on the left, then one large tile on the right. */
.portfolio-grid--mosaic .portfolio-card:nth-child(10n + 1) {
	grid-column: 1 / span 2;
	grid-row: span 2;
}

.portfolio-grid--mosaic .portfolio-card:nth-child(10n + 2),
.portfolio-grid--mosaic .portfolio-card:nth-child(10n + 4) {
	grid-column: 3;
}

.portfolio-grid--mosaic .portfolio-card:nth-child(10n + 3),
.portfolio-grid--mosaic .portfolio-card:nth-child(10n + 5) {
	grid-column: 4;
}

.portfolio-grid--mosaic .portfolio-card:nth-child(10n + 6),
.portfolio-grid--mosaic .portfolio-card:nth-child(10n + 8) {
	grid-column: 1;
}

.portfolio-grid--mosaic .portfolio-card:nth-child(10n + 7),
.portfolio-grid--mosaic .portfolio-card:nth-child(10n + 9) {
	grid-column: 2;
}

.portfolio-grid--mosaic .portfolio-card:nth-child(10n) {
	grid-column: 3 / span 2;
	grid-row: span 2;
}

.portfolio-grid--mosaic.portfolio-grid--overlay-titles .portfolio-card__link::after,
.services-section .portfolio-grid--overlay-titles .portfolio-card__link::after,
.about-links-section .portfolio-grid--overlay-titles .portfolio-card__link::after
{
	inset: 0;
	aspect-ratio: auto;
	background: linear-gradient(
		to top,
		rgb(0 0 0 / 62%) 0%,
		rgb(0 0 0 / 8%) 42%,
		transparent 65%
	);
}

.portfolio-grid--mosaic.portfolio-grid--overlay-titles .portfolio-card__title {
	right: auto;
	bottom: 20px;
	left: 20px;
	font-size: 1.25em;
	line-height: 1.1;
	letter-spacing: 2px;
	text-transform: uppercase;
	padding: 0;
}



@media screen and (max-width: 56.25em) {
	.portfolio-grid--mosaic {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.portfolio-grid--mosaic .portfolio-card:nth-child(n) {
		grid-column: auto;
		grid-row: auto;
	}
}

@media screen and (max-width: 37.5em) {
	.portfolio-grid--mosaic {
		grid-template-columns: 1fr;
	}
}

@media (prefers-reduced-motion: reduce) {
	.portfolio-grid--mosaic .portfolio-card__image-element {
		transition: none;
	}
}


.property-location {
	position: absolute;
	right: 0;
	padding-inline: var(--pkd-site-gutter);
	text-transform: uppercase;
	letter-spacing: 5px;
	font-weight: bold;
	color: #bbb;
}

#Section-Property-Swiper{
	background: #efefef;
}

#Section-Property-Swiper .swiper-button-prev,
#Section-Property-Swiper .swiper-button-next { color: #FFF; }

.property-amenities--section {}
.property-amenities--content {
    font-size: 1.25em;
    font-weight: 500;
    margin-top: 2em;
	text-wrap-style:pretty;
	}
.property-amenities--content li {
	line-height: 1.3;
}

.property-map--section {
	background: #abc3dd;
}
.property-map {
	position: relative;
}
.property-map--overlay {
	position: absolute;
    inset: 0;
    background: var(--pkd-color-primary);
    mix-blend-mode: hue;
    pointer-events: none;
}

/*--------------------------------------------------------------
Staff
--------------------------------------------------------------*/



/* Single Staff
--------------------------------------------- */

.single-staff .staff-profile__heading-row .page-title {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: clamp(1.5rem, 4vw, 5rem);
}

.single-staff .staff-profile__heading-row .page-title span {
	flex: 1 1 auto;
}

.single-staff .staff-profile__role {
	flex: 0 1 auto;
	margin: 0;
	font-size: clamp(0.85rem, 1.3vw, 1.5rem);
	line-height: 1.3;
	text-align: right;
	opacity: .9;
}

.staff-profile__portrait-wrap {
	width: 100%;
	height: 100%;
	aspect-ratio: 1;
	position: relative;
}
.staff-profile__portrait-wrap img {
	object-fit: cover;
	width: 100%;
	height: 100%;
}

@media screen and (max-width: 48em) {

	.single-staff .staff-profile__heading-row .page-title {
		flex-flow: column;
        flex-direction: column-reverse;
		gap:0;
	}

	.single-staff .staff-profile__role {
		text-align: left;
	}
}




/* Team Grid
--------------------------------------------- */

.team-grid {
	gap: clamp(10px, 1.5vw, 24px);
}

.team-grid--principals {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.team-grid--members {
	grid-template-columns: repeat(4, minmax(0, 1fr));
	margin-top: clamp(10px, 1.5vw, 24px);
}

.team-grid--overlay-titles .team-card__link {
	color: var(--pkd-color-text-reverse);
	overflow: hidden;
}

.team-grid--overlay-titles .team-card__link::after {
	inset: 0;
	aspect-ratio: auto;
	background: linear-gradient(
		to top,
		rgb(0 0 0 / 68%) 0%,
		rgb(0 0 0 / 10%) 42%,
		transparent 68%
	);
}

.team-grid--overlay-titles .team-card__content {
	right: auto;
    bottom: 20px;
    left: 20px;
}

.team-grid--overlay-titles .team-card__name {
	font-size: 1.5em;
	line-height: 1;
	padding:0;
}

.team-grid--overlay-titles .team-card__title {
	margin-top: 4px;
	font-size: .9em;
	line-height: 1.2;
	text-transform: uppercase;
	letter-spacing: 1px;
}

.team-grid--overlay-titles .team-card__link:hover,
.team-grid--overlay-titles .team-card__link:focus-visible {
	color: var(--pkd-color-text-reverse);
}

@media screen and (max-width: 56.25em) {
	.team-grid--principals,
	.team-grid--members {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media screen and (max-width: 37.5em) {
	.team-grid--principals,
	.team-grid--members {
		grid-template-columns: 1fr;
	}
}


/*--------------------------------------------------------------
History
--------------------------------------------------------------*/

.history-section {
	margin-block: clamp(2rem, 5vw, 5rem);
}

.history-timeline {
	position: relative;
}

.history-timeline::before {
	content: "";
	position: absolute;
	z-index: 0;
	top: 0;
	bottom: 0;
	left: 50%;
	width: 1px;
	background-color: var(--pkd-color-secondary);
	transform: translateX(-50%);
}

.history-entry {
	position: relative;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0;
	min-width: 0;
	margin-bottom: 2em;
}

.history-entry::after {
	content: "";
	position: absolute;
	z-index: 3;
	top: 50%;
	left: 50%;
	width: clamp(16px, 1.4vw, 22px);
	aspect-ratio: 1;
	border: 4px solid var(--pkd-color-background);
	border-radius: 50%;
	background-color: var(--pkd-color-primary);
	box-sizing: border-box;
	transform: translate(-50%, -50%);
}

.history-entry::before {
    content: "";
    position: absolute;
    z-index: 2;
    top: 50%;
    left: 50%;
    height: 1px;
    width: 2.5em;
    background-color: var(--pkd-color-primary);
    box-sizing: border-box;
    transform: translate(0%, -50%);
}
.history-entry:nth-child(even)::before {
	 transform: translate(-100%, -50%);
}

.history-entry__media {
	position: relative;
	min-width: 0;
	aspect-ratio: 1;
	overflow: hidden;
	background-color: var(--pkd-color-background-alt);
}

.history-entry__image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.history-entry__content {
	display: flex;
	align-items: center;
	min-width: 0;
	padding: clamp(2rem, 5vw, 5rem);
}

.history-entry__content-inner {
	width: 100%;
}

.history-entry__year {
	margin: 0 0 .4em;
	padding: 0;
	font-size: clamp(2rem, 4vw, 4.5rem);
	line-height: 1;
}

.history-entry__description > :last-child {
	margin-bottom: 0;
}

.history-entry:nth-child(even) .history-entry__media {
	order: 2;
}

.history-entry:nth-child(even) .history-entry__content {
	order: 1;
	text-align: right;
}
.history-entry:nth-child(even) .history-entry__content p {
	text-align: justify;
}

@media screen and (max-width: 48em) {
	.history-timeline::before,
	.history-entry::before,
	.history-entry::after {
		display: none;
	}

	.history-entry {
		grid-template-columns: 1fr;
	}

	.history-entry:nth-child(even) .history-entry__media,
	.history-entry:nth-child(even) .history-entry__content {
		order: initial;
	}

	.history-entry:nth-child(even) .history-entry__content {
		text-align: left;
	}

	.history-entry__content {
		padding: clamp(1.75rem, 8vw, 3rem);
	}
}

/*--------------------------------------------------------------
Locations
--------------------------------------------------------------*/


/*--------------------------------------------------------------
Services
--------------------------------------------------------------*/


.services-section .portfolio-card__title {
	position: absolute;
	bottom: 20px;
	left: 20px;
	z-index: 1;
	color: #FFF;
	margin: 0;
	text-transform: uppercase;
	padding: 0;
	font-size:clamp(1.25rem, 2vw, 2rem);
	line-height: 1;
	text-shadow: 1px 1px 1px #0009;
}


/*--------------------------------------------------------------
About Us
--------------------------------------------------------------*/

.about-links-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(10px, 1.5vw, 24px);
}

.about-link-card {
	min-width: 0;
	margin: 0;
}

.about-link-card__link {
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: 1;
	overflow: hidden;
	background-color: var(--pkd-color-background-alt);
	color: var(--pkd-color-text-reverse);
}

.about-link-card__image,
.about-link-card__image-element {
	display: block;
	width: 100%;
	height: 100%;
	margin: 0;
}

.about-link-card__image-element {
	object-fit: cover;
	transition: transform 0.6s ease;
}

.about-link-card__link::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(
		to top,
		rgb(0 0 0 / 68%) 0%,
		rgb(0 0 0 / 10%) 42%,
		transparent 68%
	);
	pointer-events: none;
}

.about-link-card__content {
	position: absolute;
	z-index: 2;
	right: 20px;
	bottom: 20px;
	left: 20px;
}

.about-link-card__title {
	margin: 0;
	padding: 0;
	font-size: clamp(1.25rem, 2vw, 2rem);
	line-height: 1.1;
	text-transform: uppercase;
	color: #FFF;
	text-shadow: 1px 1px 1px #0009;
}

.about-link-card__link:hover,
.about-link-card__link:focus-visible {
	color: var(--pkd-color-text-reverse);
}

.about-link-card__link:hover .about-link-card__image-element,
.about-link-card__link:focus-visible .about-link-card__image-element {
	transform: scale(1.04);
}

@media screen and (max-width: 56.25em) {
	.about-links-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media screen and (max-width: 37.5em) {
	.about-links-grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (prefers-reduced-motion: reduce) {
	.about-link-card__image-element {
		transition: none;
	}
}


/*--------------------------------------------------------------
Blog
--------------------------------------------------------------*/


/* Blog Archive
--------------------------------------------- */

/* Editorial rows with alternating square image and content columns. */
.blog-feed--archive {
	--pkd-blog-gap: clamp(2rem, 5vw, 5rem);
	--pkd-blog-ratio: 1;
}

.blog-feed--archive .blog-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--pkd-blog-gap);
}

.blog-feed--archive .blog-card {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	align-items: center;
	gap: 0;
	min-width: 0;
	margin: 0;
}

.blog-feed--archive .blog-card__media {
	display: block;
	position: relative;
	min-width: 0;
	aspect-ratio: 1;
	overflow: hidden;
}

.blog-feed--archive .blog-card__image,
.blog-feed--archive .blog-card__placeholder {
	display: block;
	width: 100%;
	height: 100%;
}

.blog-feed--archive .blog-card__image {
	object-fit: cover;
}

.blog-feed--archive .blog-card__body {
	min-width: 0;
	padding: clamp(1rem, 2vw, 3rem);
}

.blog-feed--archive .blog-card:nth-child(even) .blog-card__media {
	order: 2;
}

.blog-feed--archive .blog-card:nth-child(even) .blog-card__body {
	order: 1;
}

@media screen and (max-width: 48em) {
	.blog-feed--archive .blog-card {
		grid-template-columns: minmax(0, 1fr);
	}

	.blog-feed--archive .blog-card:nth-child(even) .blog-card__media,
	.blog-feed--archive .blog-card:nth-child(even) .blog-card__body {
		order: initial;
	}

	.blog-feed--archive .blog-card:nth-child(even) .blog-card__body {
		text-align: left;
	}

	.blog-feed--archive .blog-card__body {
		padding: clamp(1.5rem, 8vw, 3rem) 0 0;
	}
}


.blog-feed--home .blog-grid {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	align-items: start;
}

.blog-feed--home .blog-card {
	height: auto;
	aspect-ratio: auto;
}

.blog-feed--home .blog-card__media {
	display: block;
	aspect-ratio: 1 / 1;
	height: auto;
	overflow: hidden;
}

.blog-feed--home .blog-card__image,
.blog-feed--home .blog-card__placeholder {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.blog-feed--home .blog-card__body {
	position: static;
}

/* Homepage Feed: Mobile */
@media screen and (max-width: 48em) {
	.blog-feed--home .blog-grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.blog-feed--home .blog-card {
		display: block;
		width: 100%;
	}

	.blog-feed--home .blog-card__media {
		width: 100%;
		aspect-ratio: 1 / 1;
	}

	.blog-feed--home .blog-card__body {
		position: static;
		padding-top: clamp(1rem, 5vw, 2rem);
	}
}




/* Homepage Overlay Variation
--------------------------------------------- */

/* Add .blog-feed--overlay to the feed section. */
.blog-feed--overlay .blog-card {
	position: relative;
	overflow: hidden;
}

.blog-feed--overlay .blog-card__media::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(
		to top,
		rgb(0 0 0 / 72%) 0%,
		rgb(0 0 0 / 20%) 45%,
		transparent 72%
	);
	pointer-events: none;
}

.blog-feed--overlay .blog-card__body {
	position: absolute;
	z-index: 2;
	inset: auto 0 0;
	padding: clamp(1rem, 2.5vw, 1.5rem);
	color: var(--pkd-color-text-reverse);
}

.blog-feed--overlay .blog-card__title a,
.blog-feed--overlay .blog-card__summary {
	color: inherit;
}

/* Single Post
--------------------------------------------- */

/* Square featured image and article copy in two columns. */

.single-post .post-article__grid {
	--pkd-grid-align: start;
}

.single-post .post-article__aside {
	position: sticky;
    top: calc(var(--header-height-current) * 3);
	align-self: start;
}

.single-post .post-article__header {
	min-height: var(--sdc-post-heading-space);
	position: sticky;
	top: calc(var(--header-height-scroll) + 10px);
	z-index: 20;
	background: #FFF;
	margin-bottom: 2em;
	padding: 1em 0;
	isolation: isolate;
}

.single-post .post-article__header .page-title {
	margin-top: 0;
}

.single-post .post-article__body {
	position: relative;
	z-index: 1;
}

.single-post .post-article__featured-wrap {
	position: relative;
	width: 100%;
	aspect-ratio: 1;
	overflow: hidden;
}

.single-post .post-article__featured-image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Single Post: Tablet and Mobile */
@media screen and (max-width: 48em) {
	.single-post .post-article__aside {
		position: static;
	}

	.single-post .post-article__header {
		min-height: 0;
		margin-bottom: clamp(2rem, 7vw, 4rem);
	}

	.single-post .post-article__body {
		padding-top: 0;
	}
}

@media screen and (max-width: 37.5em) {
	.single-post .post-article__header {
		position: relative;
		top: auto;
		z-index: auto;
		background: #fff;
	}
}

/*--------------------------------------------------------------
Social Media
--------------------------------------------------------------*/


/*--------------------------------------------------------------
Gravity Forms Overrides
--------------------------------------------------------------*/


/*--------------------------------------------------------------
Plugin Overrides
--------------------------------------------------------------*/


/*--------------------------------------------------------------
WordPress Overrides
--------------------------------------------------------------*/


/*--------------------------------------------------------------
Slide-In Elements
--------------------------------------------------------------*/

/* See JavaScript too */


/*--------------------------------------------------------------
Project Overrides
--------------------------------------------------------------*/