/* =========================================================================
   Plotarth Realty — main.css
   Presentation + animation layer. Colours reference the CSS custom
   properties generated by theme.json, so editing Global Styles cascades
   here automatically. Loaded on the front end and inside the Site Editor.
   ========================================================================= */

:root {
	--plotarth-radius: 14px;
	--plotarth-ease: cubic-bezier(0.22, 1, 0.36, 1);
	--plotarth-header-h: 88px;
}

/* ---------- Inverted (dark) sections ---------------------------------- */
.plotarth-invert,
.plotarth-invert :where(h1, h2, h3, h4, h5, h6) {
	color: var(--wp--preset--color--base);
}
.plotarth-invert :where(p, li, cite, figcaption, .wp-block-post-date, time) {
	color: rgba(255, 255, 255, 0.82);
}
.plotarth-invert a:where(:not(.wp-block-button__link):not(.wp-element-button)) {
	color: #fff;
	text-decoration: none;
}
.plotarth-invert a:where(:not(.wp-block-button__link):not(.wp-element-button)):hover {
	color: var(--wp--preset--color--accent);
}

/* ---------- Header ----------------------------------------------------- */
.plotarth-site-header {
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	z-index: 100;
	background-color: var(--wp--preset--color--base);
	transition: box-shadow 0.3s var(--plotarth-ease), background-color 0.3s var(--plotarth-ease);
}
.plotarth-site-header.is-scrolled {
	box-shadow: 0 6px 24px rgba(5, 23, 63, 0.08);
}
/* Transparent variant overlays the hero, then docks as a solid bar */
.plotarth-site-header--transparent {
	position: absolute;
	inset: 0 0 auto 0;
	background-color: transparent;
	box-shadow: none;
}
.plotarth-site-header--transparent.is-stuck {
	position: fixed;
	background-color: var(--wp--preset--color--midnight);
	box-shadow: 0 8px 30px rgba(5, 23, 63, 0.28);
	animation: plotarth-slidedown 0.45s var(--plotarth-ease);
}
@keyframes plotarth-slidedown {
	from { transform: translateY(-100%); opacity: 0; }
	to   { transform: translateY(0); opacity: 1; }
}
.plotarth-header__actions { gap: 14px; }

/* Navigation */
.plotarth-nav .wp-block-navigation-item__label { position: relative; }
.plotarth-nav .wp-block-navigation-item > a::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -6px;
	width: 100%;
	height: 2px;
	background: var(--wp--preset--color--accent);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.3s var(--plotarth-ease);
}
.plotarth-nav .wp-block-navigation-item:hover > a::after,
.plotarth-nav .current-menu-item > a::after { transform: scaleX(1); }
/* Submenu / mega dropdown */
.plotarth-nav .wp-block-navigation-submenu .wp-block-navigation__submenu-container {
	border: 0;
	border-radius: 12px;
	padding: 0.5rem;
	min-width: 240px;
	box-shadow: 0 24px 60px rgba(5, 23, 63, 0.18);
	background: var(--wp--preset--color--base);
	margin-top: 10px;
}
.plotarth-nav .wp-block-navigation__submenu-container .wp-block-navigation-item a {
	border-radius: 8px;
	padding: 0.55rem 0.8rem !important;
	color: var(--wp--preset--color--navy);
}
.plotarth-nav .wp-block-navigation__submenu-container .wp-block-navigation-item a:hover {
	background: var(--wp--preset--color--sand);
	color: var(--wp--preset--color--accent);
}
/* WhatsApp + search sit tidily beside the nav */
.plotarth-whatsapp .wp-social-link { padding: 0; }
.plotarth-search .wp-block-search__button { padding: 0.55rem 0.7rem; border-radius: 8px; }
.plotarth-header .wp-block-search__button svg { fill: currentColor; }

/* ---------- Buttons ---------------------------------------------------- */
.wp-block-button__link { transition: transform 0.25s var(--plotarth-ease), background-color 0.25s var(--plotarth-ease), color 0.25s var(--plotarth-ease), box-shadow 0.25s var(--plotarth-ease); }
.wp-block-button:not(.is-style-plotarth-outline):not(.is-style-plotarth-ghost) .wp-block-button__link:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 26px rgba(239, 108, 17, 0.32);
}
/* Outline */
.is-style-plotarth-outline .wp-block-button__link {
	background-color: transparent;
	color: var(--wp--preset--color--navy);
	box-shadow: inset 0 0 0 1.5px var(--wp--preset--color--navy);
}
.is-style-plotarth-outline .wp-block-button__link:hover {
	background-color: var(--wp--preset--color--navy);
	color: #fff;
}
.plotarth-invert .is-style-plotarth-outline .wp-block-button__link {
	color: #fff;
	box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, 0.6);
}
.plotarth-invert .is-style-plotarth-outline .wp-block-button__link:hover {
	background-color: #fff;
	color: var(--wp--preset--color--navy);
}
/* Ghost (for dark backgrounds) */
.is-style-plotarth-ghost .wp-block-button__link {
	background-color: rgba(255, 255, 255, 0.08);
	color: #fff;
	box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, 0.55);
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
}
.is-style-plotarth-ghost .wp-block-button__link:hover {
	background-color: #fff;
	color: var(--wp--preset--color--navy);
}
/* Pill */
.is-style-plotarth-pill .wp-block-button__link { border-radius: 999px; }

/* ---------- Cards ------------------------------------------------------ */
.plotarth-card {
	overflow: hidden;
	border: 1px solid var(--wp--preset--color--line);
	box-shadow: 0 10px 30px rgba(5, 23, 63, 0.06);
	transition: transform 0.4s var(--plotarth-ease), box-shadow 0.4s var(--plotarth-ease);
	height: 100%;
}
.plotarth-card:hover {
	transform: translateY(-6px);
	box-shadow: 0 26px 60px rgba(5, 23, 63, 0.16);
}
.plotarth-card__media img,
.is-style-plotarth-zoom img { transition: transform 0.6s var(--plotarth-ease); width: 100%; }
.is-style-plotarth-zoom { overflow: hidden; }
.plotarth-card:hover .plotarth-card__media img,
.is-style-plotarth-zoom:hover img { transform: scale(1.06); }
.plotarth-card__status a { text-decoration: none; }
.plotarth-card__specs > * { position: relative; padding-left: 1.1rem; margin: 0; }
.plotarth-card__specs > *::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.42em;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--wp--preset--color--accent);
}
.plotarth-readmore a { text-decoration: none; font-weight: 600; font-size: 0.85rem; color: var(--wp--preset--color--navy); }
.plotarth-readmore a:hover { color: var(--wp--preset--color--accent); }

/* ---------- Image styles ---------------------------------------------- */
.is-style-plotarth-soft img { border-radius: var(--plotarth-radius); }
.is-style-plotarth-frame img {
	border-radius: 6px;
	box-shadow: 0 0 0 1px var(--wp--preset--color--line), 18px 18px 0 -2px var(--wp--preset--color--accent);
}

/* ---------- Separator -------------------------------------------------- */
.is-style-plotarth-accent {
	border: 0;
	height: 3px;
	width: 56px;
	margin-left: 0;
	background: var(--wp--preset--color--accent);
	opacity: 1;
}
.has-text-align-center > .is-style-plotarth-accent,
.plotarth-invert.has-text-align-center .is-style-plotarth-accent { margin-inline: auto; }

/* ---------- Lists (checks / features) --------------------------------- */
.is-style-plotarth-checks { list-style: none; padding-left: 0; }
.is-style-plotarth-checks li {
	position: relative;
	padding-left: 2rem;
	margin-bottom: 0.6rem;
}
.is-style-plotarth-checks li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.15em;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: var(--wp--preset--color--accent);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center / 15px no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center / 15px no-repeat;
	background-color: var(--wp--preset--color--accent);
}
.is-style-plotarth-features { list-style: none; padding-left: 0; }
.is-style-plotarth-features li {
	padding: 0.75rem 0;
	border-bottom: 1px solid var(--wp--preset--color--line);
	line-height: 1.5;
}
.plotarth-invert .is-style-plotarth-features li { border-color: rgba(255, 255, 255, 0.14); }

/* ---------- Eyebrow ---------------------------------------------------- */
.plotarth-eyebrow { margin-bottom: 0.35rem; }

/* ---------- Hero & page hero ------------------------------------------ */
.plotarth-hero { display: flex; }
.plotarth-hero .wp-block-cover__inner-container { width: 100%; }
.plotarth-pagehero { text-align: center; }
.plotarth-pagehero .plotarth-breadcrumbs { justify-content: center; display: flex; }

/* ---------- Stats ------------------------------------------------------ */
.plotarth-stats .wp-block-column { text-align: center; }
.plotarth-stat__num { font-variant-numeric: tabular-nums; }

/* ---------- Services icons -------------------------------------------- */
.plotarth-ico { display: inline-flex; color: var(--wp--preset--color--accent); }
.plotarth-service { transition: transform 0.4s var(--plotarth-ease), box-shadow 0.4s var(--plotarth-ease); }
.plotarth-services .wp-block-group { height: 100%; }

/* ---------- Testimonials ---------------------------------------------- */
.is-style-plotarth-testimonial { border: 0; padding-left: 0; }

/* ---------- FAQ (details) --------------------------------------------- */
.plotarth-faq .wp-block-details {
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 12px;
	padding: 0.4rem 1.25rem;
	background: var(--wp--preset--color--base);
	transition: box-shadow 0.3s var(--plotarth-ease), border-color 0.3s var(--plotarth-ease);
}
.plotarth-faq .wp-block-details[open] {
	box-shadow: 0 14px 40px rgba(5, 23, 63, 0.08);
	border-color: transparent;
}
.plotarth-faq summary {
	font-family: var(--wp--preset--font-family--serif);
	font-size: 1.12rem;
	font-weight: 600;
	color: var(--wp--preset--color--navy);
	padding: 0.85rem 0;
	cursor: pointer;
	list-style: none;
	position: relative;
	padding-right: 2rem;
}
.plotarth-faq summary::-webkit-details-marker { display: none; }
.plotarth-faq summary::after {
	content: "+";
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	font-size: 1.5rem;
	color: var(--wp--preset--color--accent);
	line-height: 1;
	transition: transform 0.3s var(--plotarth-ease);
}
.plotarth-faq .wp-block-details[open] summary::after { content: "\2013"; }

/* ---------- Single property ------------------------------------------- */
@media (min-width: 782px) {
	.plotarth-sticky-col > .plotarth-agent { position: -webkit-sticky; position: sticky; top: calc(var(--plotarth-header-h) + 20px); }
}

/* ---------- Forms ------------------------------------------------------ */
.plotarth-form { display: flex; flex-direction: column; gap: 1rem; }
.plotarth-form__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin: 0; }
.plotarth-form__field { margin: 0; display: flex; flex-direction: column; gap: 0.35rem; }
.plotarth-form label { font-size: 0.8rem; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--wp--preset--color--muted); }
.plotarth-form input,
.plotarth-form select,
.plotarth-form textarea {
	width: 100%;
	padding: 0.8rem 1rem;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 8px;
	background: var(--wp--preset--color--base);
	font: inherit;
	color: var(--wp--preset--color--contrast);
	transition: border-color 0.25s var(--plotarth-ease), box-shadow 0.25s var(--plotarth-ease);
}
.plotarth-form input:focus,
.plotarth-form select:focus,
.plotarth-form textarea:focus {
	outline: none;
	border-color: var(--wp--preset--color--accent);
	box-shadow: 0 0 0 3px rgba(239, 108, 17, 0.15);
}
.plotarth-form__submit {
	align-self: flex-start;
	border: 0;
	cursor: pointer;
	background: var(--wp--preset--color--accent);
	color: #fff;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	font-size: 0.85rem;
	padding: 1rem 2rem;
	border-radius: 4px;
	transition: transform 0.25s var(--plotarth-ease), background-color 0.25s var(--plotarth-ease);
}
.plotarth-form__submit:hover { background: var(--wp--preset--color--accent-deep); transform: translateY(-2px); }
.plotarth-form__note { font-size: 0.85rem; color: var(--wp--preset--color--muted); }
/* Newsletter */
.plotarth-newsletter { display: flex; gap: 8px; margin-top: 0.75rem; flex-wrap: wrap; }
.plotarth-newsletter input {
	flex: 1 1 150px;
	padding: 0.75rem 1rem;
	border: 1px solid rgba(255, 255, 255, 0.22);
	border-radius: 6px;
	background: rgba(255, 255, 255, 0.06);
	color: #fff;
	font: inherit;
}
.plotarth-newsletter input::placeholder { color: rgba(255, 255, 255, 0.6); }
.plotarth-newsletter input:focus { outline: none; border-color: var(--wp--preset--color--accent); }
.plotarth-newsletter button {
	border: 0;
	cursor: pointer;
	background: var(--wp--preset--color--accent);
	color: #fff;
	font-weight: 600;
	padding: 0.75rem 1.25rem;
	border-radius: 6px;
	transition: background-color 0.25s var(--plotarth-ease);
}
.plotarth-newsletter button:hover { background: var(--wp--preset--color--accent-deep); }
.screen-reader-text {
	border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%);
	height: 1px; width: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute;
}

/* ---------- Footer ----------------------------------------------------- */
.plotarth-footer__links { list-style: none; padding-left: 0; margin: 0.5rem 0 0; }
.plotarth-footer__links li { margin-bottom: 0.55rem; }
.plotarth-footer__links a { color: rgba(255, 255, 255, 0.78); text-decoration: none; }
.plotarth-footer__links a:hover { color: var(--wp--preset--color--accent); }
.plotarth-footer__bottom { border: 0; padding-top: 0.5rem; align-items: center; }
.plotarth-footer__bottom p { margin: 0; color: rgba(255, 255, 255, 0.6); }
.plotarth-footer__bottom a { color: rgba(255, 255, 255, 0.75); }

/* ---------- Breadcrumbs ------------------------------------------------ */
.plotarth-breadcrumbs ol {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	padding: 0;
	margin: 0.75rem 0 0;
	font-size: 0.82rem;
	letter-spacing: 0.03em;
}
.plotarth-breadcrumbs li + li::before { content: "/"; opacity: 0.5; margin-right: 0.5rem; }
.plotarth-breadcrumbs a { text-decoration: none; }
.plotarth-breadcrumbs [aria-current="page"] { opacity: 0.8; }

/* ---------- Query pagination ------------------------------------------ */
.wp-block-query-pagination { gap: 0.4rem; }
.wp-block-query-pagination a,
.wp-block-query-pagination .wp-block-query-pagination-numbers .page-numbers {
	text-decoration: none;
	padding: 0.4rem 0.8rem;
	border-radius: 6px;
}
.wp-block-query-pagination .page-numbers.current { background: var(--wp--preset--color--navy); color: #fff; }

/* ---------- Scroll reveal (progressive enhancement) ------------------- */
.plotarth-js .plotarth-reveal { opacity: 0; transform: translateY(26px); transition: opacity 0.7s var(--plotarth-ease), transform 0.7s var(--plotarth-ease); will-change: opacity, transform; }
.plotarth-js .plotarth-reveal.is-visible { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
	.plotarth-js .plotarth-reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
	.wp-block-button__link,
	.plotarth-card,
	.is-style-plotarth-zoom img,
	.plotarth-card__media img { transition: none !important; }
	.plotarth-site-header--transparent.is-stuck { animation: none !important; }
}

/* ---------- Responsive ------------------------------------------------- */
@media (max-width: 781px) {
	.plotarth-form__grid { grid-template-columns: 1fr; }
	.plotarth-header__actions .plotarth-search,
	.plotarth-header__actions .wp-block-buttons { display: none; }
	.plotarth-pagehero { padding-top: 120px !important; }
	.plotarth-hero { min-height: 82vh !important; }
}