/* Lunarscape custom theme — refinements layered on top of theme.json */

.tagline{
	font-family: Jost, "Hanken Grotesk", sans-serif;
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: .32em;
	font-size: 9px;
	color: var(--wp--preset--color--slate);
	margin: 0;
}
.site-footer .tagline{ color: var(--wp--preset--color--grey); }
.fineprint{ color: var(--wp--preset--color--mid); }
.agency-credit{
	color: var(--wp--preset--color--mid);
	letter-spacing: .08em;
	text-transform: uppercase;
}
.agency-credit a{
	color: var(--wp--preset--color--paper);
	text-decoration: none;
	border-bottom: 1px solid rgba(252,251,248,.32);
}
.agency-credit a:hover{
	color: var(--wp--preset--color--grey);
	border-bottom-color: currentColor;
}

.site-header{ border-bottom: 1px solid var(--wp--preset--color--grey); }

/* Full-width page sections should meet directly. WordPress's global block gap
   otherwise renders as unexplained white bands between every section. */
.wp-site-blocks > * + *{
	margin-block-start: 0 !important;
}

.logo-lockup{
	display: inline-flex;
	align-items: center;
	color: inherit;
	text-decoration: none;
}
.logo-lockup:hover{ color: inherit; }

.brand-logo-image{
	display: block;
	height: auto;
	max-width: 100%;
}
.brand-logo-image--header{ width: min(340px, 76vw); }
.site-footer .logo-lockup{ justify-content: flex-start; }
.brand-logo-image--footer{ width: min(430px, 86vw); }

.footer-main{
	display: grid;
	grid-template-columns: minmax(320px, 1.45fr) minmax(150px, .5fr) minmax(250px, .75fr);
	gap: clamp(48px, 7vw, 110px);
	align-items: start;
}
.footer-brand,
.footer-menu,
.footer-cta{
	min-width: 0;
}
.footer-brand .tagline{
	margin-top: 22px;
}
.footer-contact{
	margin: 24px 0 0;
	line-height: 1.9;
}
.footer-contact a{
	color: var(--wp--preset--color--paper);
	text-decoration: none;
}
.footer-contact a:hover{
	color: var(--wp--preset--color--grey);
}
.footer-menu > .tagline,
.footer-cta > .tagline{
	margin-bottom: 22px;
}
.footer-navigation{
	font-size: 13px;
	letter-spacing: .08em;
}
.footer-navigation .wp-block-navigation__container{
	align-items: flex-start;
	gap: 9px;
}
.footer-navigation .wp-block-navigation-item__content{
	color: var(--wp--preset--color--paper);
	text-decoration: none;
}
.footer-navigation .wp-block-navigation-item__content:hover{
	color: var(--wp--preset--color--grey);
}
.footer-cta h3{
	margin: 0 0 14px;
}
.footer-cta > p:not(.tagline){
	margin: 0 0 24px;
}
.footer-cta .wp-block-buttons{
	justify-content: flex-start;
}
.footer-cta .has-paper-background-color:hover{
	color: var(--wp--preset--color--paper) !important;
}
.footer-bottom{
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 28px;
	margin-top: var(--wp--preset--spacing--60);
	padding-top: 28px;
	border-top: 1px solid rgba(252,251,248,.16);
}
.footer-bottom p{
	margin: 0;
}

/* Navigation: small tracked caps */
.wp-block-navigation{
	font-weight: 500;
	letter-spacing: .04em;
	text-transform: uppercase;
	font-size: 12px;
}

/* Buttons: deepen on hover */
.wp-block-button__link:hover,
.wp-element-button:hover{ background-color: var(--wp--preset--color--ink) !important; }

/* Paver + crescent overlay — add the class "paver" to any Group/Cover block
   for a large-format ashlar paver field with varied stone sizes. */
.paver{
	position: relative;
	overflow: hidden;
	background-color: var(--wp--preset--color--paper);
	background-image:
		linear-gradient(180deg, rgba(252,251,248,.62), rgba(252,251,248,.44)),
		url("../images/lunarscape-paver-ashlar-light.svg");
	background-repeat: repeat;
	background-size: auto, 640px 420px;
	background-position: center, center;
}
.wp-block-cover.paver{
	background-color: var(--wp--preset--color--black);
	background-image:
		linear-gradient(180deg, rgba(22,22,22,.18), rgba(22,22,22,.38)),
		url("../images/lunarscape-paver-ashlar-dark.svg");
	background-size: auto, 700px 460px;
}
.paver > *{ position: relative; z-index: 2; }
.paver::before{
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	background:
		radial-gradient(circle at 18% 12%, rgba(255,255,255,.58), transparent 34%),
		radial-gradient(circle at 80% 92%, rgba(22,22,22,.08), transparent 42%);
}
.wp-block-cover.paver::before{
	background:
		radial-gradient(circle at 16% 10%, rgba(255,255,255,.06), transparent 34%),
		radial-gradient(circle at 76% 88%, rgba(0,0,0,.36), transparent 44%);
}
.paver::after{
	content: "";
	position: absolute;
	right: -40px;
	bottom: -50px;
	width: 340px;
	height: 340px;
	z-index: 1;
	pointer-events: none;
	opacity: .78;
	background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20300'%3E%3Cdefs%3E%3Cmask%20id='m'%3E%3Crect%20width='300'%20height='300'%20fill='%23000'/%3E%3Ccircle%20cx='150'%20cy='150'%20r='90'%20fill='%23fff'/%3E%3Ccircle%20cx='184'%20cy='132'%20r='76'%20fill='%23000'/%3E%3C/mask%3E%3C/defs%3E%3Ccircle%20cx='150'%20cy='150'%20r='118'%20fill='none'%20stroke='%23E2DCD0'%20stroke-width='2.5'/%3E%3Crect%20width='300'%20height='300'%20fill='%23EBE5DA'%20mask='url(%23m)'/%3E%3C/svg%3E") no-repeat center / contain;
}
.wp-block-cover.paver::after{ opacity: .32; }

/* Homepage project-fit band. */
.project-fit-band{
	border-top: 1px solid rgba(22,22,22,.18);
	border-bottom: 1px solid rgba(22,22,22,.14);
}
.project-fit-intro{
	display: grid;
	grid-template-columns: minmax(240px, .8fr) minmax(360px, 1.2fr);
	grid-template-areas:
		"label copy"
		"title copy";
	column-gap: clamp(48px, 8vw, 120px);
	row-gap: 12px;
	align-items: end;
}
.project-fit-intro .tagline{
	grid-area: label;
	align-self: end;
}
.project-fit-intro h2{
	grid-area: title;
	margin: 0;
	max-width: 560px;
}
.project-fit-intro > p:last-child{
	grid-area: copy;
	align-self: end;
	max-width: 540px;
	margin: 0;
}
.project-fit-grid{
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 0;
	margin-top: var(--wp--preset--spacing--50);
	border-top: 1px solid rgba(22,22,22,.22);
	border-bottom: 1px solid rgba(22,22,22,.22);
}
.project-fit-item{
	position: relative;
	display: flex;
	flex-direction: column;
	min-width: 0;
	padding: 30px clamp(20px, 2.2vw, 34px) 32px;
}
.project-fit-item + .project-fit-item{
	border-left: 1px solid rgba(22,22,22,.18);
}
.project-fit-icon{
	display: grid;
	place-items: center;
	width: 50px;
	height: 50px;
	margin-bottom: 28px;
	background: var(--wp--preset--color--black);
	color: var(--wp--preset--color--paper);
}
.project-fit-icon svg{
	display: block;
	width: 25px;
	height: 25px;
}
.project-fit-item .tagline{
	color: var(--wp--preset--color--slate);
}
.project-fit-item h3{
	margin: 10px 0 12px;
	line-height: 1.2;
}
.project-fit-item > p:last-child{
	margin: auto 0 0;
	padding-top: 4px;
}

/* Design principles: a strong paver-led statement paired with three readable
   construction principles on a solid field. */
.design-principles{
	padding: var(--wp--preset--spacing--60) 0;
	background: var(--wp--preset--color--paper);
	border-bottom: 1px solid rgba(22,22,22,.16);
}
.design-principles-layout{
	display: grid;
	grid-template-columns: minmax(360px, .9fr) minmax(500px, 1.1fr);
	gap: 0;
	align-items: stretch;
}
.design-principles-intro.paver{
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: 520px;
	padding: clamp(42px, 5vw, 72px);
	background-color: var(--wp--preset--color--black);
	background-image:
		linear-gradient(180deg, rgba(22,22,22,.36), rgba(22,22,22,.72)),
		url("../images/lunarscape-paver-ashlar-dark.svg");
	background-size: auto, 620px 408px;
}
.design-principles-intro.paver::before{
	background: linear-gradient(145deg, rgba(255,255,255,.04), transparent 58%);
}
.design-principles-intro.paver::after{
	right: -72px;
	bottom: -64px;
	opacity: .3;
}
.design-principles-intro h2{
	max-width: 500px;
	margin: 14px 0 20px;
}
.design-principles-intro > p:last-child{
	max-width: 500px;
	margin: 0;
}
.design-principles-list{
	display: grid;
	grid-template-rows: repeat(3, 1fr);
	background: var(--wp--preset--color--bone);
}
.design-principle{
	display: grid;
	grid-template-columns: 52px minmax(0, 1fr);
	gap: 24px;
	align-items: start;
	padding: 34px clamp(30px, 4vw, 58px);
}
.design-principle + .design-principle{
	border-top: 1px solid rgba(22,22,22,.18);
}
.design-principle-icon,
.process-step-icon{
	display: grid;
	place-items: center;
	width: 52px;
	height: 52px;
	background: var(--wp--preset--color--black);
	color: var(--wp--preset--color--paper);
}
.design-principle-icon svg,
.process-step-icon svg{
	display: block;
	width: 26px;
	height: 26px;
}
.design-principle-copy h3{
	margin: 8px 0 8px;
}
.design-principle-copy > p:last-child{
	margin: 0;
}

/* Process section: one connected four-step path instead of loose columns. */
.process-section{
	border-bottom: 1px solid rgba(22,22,22,.16);
}
.process-intro{
	display: grid;
	grid-template-columns: minmax(300px, 1fr) minmax(360px, .9fr);
	grid-template-areas:
		"label copy"
		"title copy";
	column-gap: clamp(48px, 8vw, 120px);
	row-gap: 12px;
	align-items: end;
}
.process-intro .tagline{ grid-area: label; }
.process-intro h2{
	grid-area: title;
	max-width: 660px;
	margin: 0;
}
.process-intro > p:last-child{
	grid-area: copy;
	max-width: 500px;
	margin: 0;
}
.process-grid{
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 0;
	margin-top: var(--wp--preset--spacing--50);
	border-top: 1px solid rgba(22,22,22,.22);
	border-bottom: 1px solid rgba(22,22,22,.22);
}
.process-step{
	min-width: 0;
	padding: 30px clamp(20px, 2.2vw, 34px) 34px;
}
.process-step + .process-step{
	border-left: 1px solid rgba(22,22,22,.18);
}
.process-step-meta{
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 18px;
	margin-bottom: 28px;
}
.process-step-meta span{
	font-family: Jost, "Hanken Grotesk", sans-serif;
	font-size: 10px;
	font-weight: 400;
	letter-spacing: .26em;
	color: var(--wp--preset--color--slate);
}
.process-step h3{
	margin: 0 0 12px;
}
.process-step > p:last-child{
	margin: 0;
}
.planning-cta{
	border-top: 0;
	border-bottom: 1px solid rgba(252,251,248,.12);
}
.planning-cta .tagline{
	margin-bottom: 14px;
}
.planning-cta .has-paper-background-color:hover{
	color: var(--wp--preset--color--paper) !important;
}

.qualifier-list{
	display: grid;
	gap: 12px;
	margin-top: 22px;
}
.qualifier-list p{
	margin: 0;
	padding-top: 12px;
	border-top: 1px solid var(--wp--preset--color--grey);
}

.project-card,
.case-study{
	border-top: 1px solid var(--wp--preset--color--grey);
	padding-top: var(--wp--preset--spacing--40);
}
.project-card .tagline,
.case-study .tagline{ color: var(--wp--preset--color--mid); }
.project-media{
	min-height: 280px;
	position: relative;
	overflow: hidden;
	background-color: var(--wp--preset--color--black);
	background-image:
		linear-gradient(180deg, rgba(22,22,22,0), rgba(22,22,22,.44)),
		url("../images/lunarscape-paver-ashlar-dark.svg");
	background-size: auto, 520px 342px;
	background-position: center, center;
	color: var(--wp--preset--color--grey);
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	gap: 10px;
	align-items: flex-end;
	padding: 22px;
}
.project-media::before{
	content: "";
	position: absolute;
	inset: 18px;
	border: 1px solid rgba(252,251,248,.16);
	pointer-events: none;
}
.project-media::after{
	content: "";
	position: absolute;
	right: 22px;
	top: 22px;
	width: 58px;
	height: 58px;
	border-radius: 50%;
	border: 1px solid rgba(252,251,248,.35);
	background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2058%2058'%3E%3Cdefs%3E%3Cmask%20id='m'%3E%3Crect%20width='58'%20height='58'%20fill='%23000'/%3E%3Ccircle%20cx='29'%20cy='29'%20r='15'%20fill='%23fff'/%3E%3Ccircle%20cx='36'%20cy='25'%20r='13'%20fill='%23000'/%3E%3C/mask%3E%3C/defs%3E%3Crect%20width='58'%20height='58'%20fill='%23FCFBF8'%20mask='url(%23m)'/%3E%3C/svg%3E") center / 58px 58px no-repeat;
	opacity: .7;
}
.project-media > *{
	position: relative;
	z-index: 1;
	margin: 0;
}
.project-media .project-media-title{
	max-width: 240px;
	color: var(--wp--preset--color--paper);
	font-family: Jost, "Hanken Grotesk", sans-serif;
	font-size: 22px;
	font-weight: 300;
	line-height: 1.12;
	text-align: right;
}
.project-media .tagline{ color: var(--wp--preset--color--grey); }
.case-study-meta{
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 18px;
	margin-top: 28px;
}
.case-study-meta p{
	margin: 0;
	padding-top: 12px;
	border-top: 1px solid var(--wp--preset--color--grey);
}

.wpforms-container{
	margin-top: 22px !important;
}
.wpforms-container .wpforms-field{
	padding: 0 0 18px !important;
}
.wpforms-container .wpforms-field-label,
.wpforms-container legend.wpforms-field-label{
	font-family: "Hanken Grotesk", sans-serif !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	letter-spacing: .04em !important;
	color: var(--wp--preset--color--black) !important;
}
.wpforms-container input[type="text"],
.wpforms-container input[type="email"],
.wpforms-container input[type="tel"],
.wpforms-container select,
.wpforms-container textarea{
	border: 1px solid var(--wp--preset--color--grey) !important;
	border-radius: 0 !important;
	background: var(--wp--preset--color--paper) !important;
	color: var(--wp--preset--color--black) !important;
	font-family: "Hanken Grotesk", sans-serif !important;
	min-height: 46px !important;
}
.wpforms-container textarea{
	min-height: 140px !important;
}
.wpforms-container button[type="submit"],
.wpforms-submit{
	border-radius: 0 !important;
	background: var(--wp--preset--color--black) !important;
	color: var(--wp--preset--color--paper) !important;
	font-family: "Hanken Grotesk", sans-serif !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	letter-spacing: .18em !important;
	text-transform: uppercase !important;
	min-height: 48px !important;
	padding: 14px 26px !important;
}
.wpforms-container button[type="submit"]:hover,
.wpforms-submit:hover{
	background: var(--wp--preset--color--ink) !important;
}

@media (max-width: 760px){
	.brand-logo-image--header{ width: min(300px, 76vw); }
	.brand-logo-image--footer{ width: min(360px, 100%); }
	.footer-main{
		grid-template-columns: 1fr;
		gap: 42px;
	}
	.footer-bottom{
		align-items: flex-start;
		flex-direction: column;
		gap: 14px;
		margin-top: 52px;
	}
	.case-study-meta{ grid-template-columns: 1fr; }
	.project-fit-intro{
		display: block;
	}
	.project-fit-intro h2{
		margin-top: 12px;
	}
	.project-fit-intro > p:last-child{
		margin-top: 18px;
	}
	.project-fit-grid{
		grid-template-columns: 1fr;
		margin-top: 38px;
	}
	.project-fit-item{
		display: grid;
		grid-template-columns: 50px minmax(0, 1fr);
		column-gap: 20px;
		padding: 24px 0;
	}
	.project-fit-item + .project-fit-item{
		border-left: 0;
		border-top: 1px solid rgba(22,22,22,.18);
	}
	.project-fit-icon{
		grid-column: 1;
		grid-row: 1 / span 3;
		margin: 0;
	}
	.project-fit-item .tagline,
	.project-fit-item h3,
	.project-fit-item > p:last-child{
		grid-column: 2;
	}
	.project-fit-item h3{
		margin-top: 8px;
	}
	.project-fit-item > p:last-child{
		margin-top: 0;
		padding-top: 0;
	}
	.design-principles{
		padding: 0;
	}
	.design-principles-layout{
		grid-template-columns: 1fr;
	}
	.design-principles-intro.paver{
		min-height: 440px;
		padding: 48px 28px;
		background-size: auto, 500px 329px;
	}
	.design-principle{
		grid-template-columns: 48px minmax(0, 1fr);
		gap: 18px;
		padding: 28px 20px;
	}
	.design-principle-icon,
	.process-step-icon{
		width: 48px;
		height: 48px;
	}
	.process-intro{
		display: block;
	}
	.process-intro h2{
		margin-top: 12px;
	}
	.process-intro > p:last-child{
		margin-top: 18px;
	}
	.process-grid{
		grid-template-columns: 1fr;
		margin-top: 38px;
	}
	.process-step{
		padding: 24px 0 26px;
	}
	.process-step + .process-step{
		border-left: 0;
		border-top: 1px solid rgba(22,22,22,.18);
	}
	.process-step-meta{
		margin-bottom: 20px;
	}
	.paver,
	.wp-block-cover.paver{
		background-size: auto, 460px 302px;
	}
	.project-media{
		min-height: 240px;
		background-size: auto, 420px 276px;
	}
	.project-media .project-media-title{
		font-size: 20px;
		max-width: 220px;
	}
}

@media (min-width: 761px) and (max-width: 1000px){
	.footer-main{
		grid-template-columns: minmax(0, 1fr) minmax(240px, .8fr);
	}
	.footer-brand{
		grid-column: 1 / -1;
	}
	.design-principles-layout{
		grid-template-columns: minmax(300px, .8fr) minmax(420px, 1.2fr);
	}
	.process-grid{
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	.process-step:nth-child(3){
		border-left: 0;
	}
	.process-step:nth-child(n+3){
		border-top: 1px solid rgba(22,22,22,.18);
	}
}

/* Accessibility — visible keyboard focus + the core block-theme skip link */
:where(a, button, input, select, textarea, .wp-element-button, .wp-block-navigation-item__content):focus-visible{
	outline: 2px solid var(--wp--preset--color--black);
	outline-offset: 3px;
}
.is-dark :where(a, button, .wp-element-button):focus-visible,
.has-black-background-color :where(a, button, .wp-element-button):focus-visible{
	outline-color: var(--wp--preset--color--paper);
}
.skip-link.screen-reader-text:focus{
	display: block;
	left: 16px;
	top: 16px;
	z-index: 100000;
	padding: 12px 22px;
	background: var(--wp--preset--color--black);
	color: var(--wp--preset--color--paper);
	font-family: "Hanken Grotesk", sans-serif;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	text-decoration: none;
	border-radius: 0;
}

/* Respect users who prefer reduced motion */
@media (prefers-reduced-motion: reduce){
	*{ animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}