/*
Theme Name: Manor East
Theme URI: https://manoreast.co.uk
Author: Manor East
Description: Quiet-luxury full site editing block theme for premium East London estate agency Manor East. Includes Properties, Services, Insights, Testimonials, Team and FAQ content types, all editable from the WordPress Site Editor.
Version: 1.0.0
Requires at least: 6.5
Tested up to: 6.7
Requires PHP: 8.0
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: manor-east
Tags: full-site-editing, block-patterns, real-estate, business, editor-style, block-styles, wide-blocks
*/

/* Base typography ------------------------------------------------------- */
body {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6,
.wp-block-post-title,
.wp-block-site-title {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-weight: 400;
  letter-spacing: -0.01em;
}

.me-eyebrow {
  font-size: 0.72rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--wp--preset--color--gold);
  margin-bottom: 1rem;
}

/* Header ---------------------------------------------------------------- */
.me-header {
  position: sticky;
  top: 0;
  z-index: 40;
  backdrop-filter: blur(14px);
  background: color-mix(in srgb, var(--wp--preset--color--ivory) 88%, transparent);
  border-bottom: 1px solid color-mix(in srgb, var(--wp--preset--color--forest) 10%, transparent);
}

.me-header .wp-block-navigation a {
  font-size: 0.82rem;
  letter-spacing: 0.06em;
}

.me-logo img {
  height: 40px;
  width: auto;
}

/* Cards ----------------------------------------------------------------- */
.me-card {
  border-radius: 24px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--wp--preset--color--forest) 12%, transparent);
  background: var(--wp--preset--color--base);
  transition: box-shadow .45s ease, transform .45s ease;
  height: 100%;
}

.me-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 26px 60px -30px rgba(15, 45, 35, .45);
}

.me-card--sage { background: #EEF2EE; border-color: #D6E0D8; }
.me-card--champagne { background: #F7F1E4; border-color: #E7D9BC; }
.me-card--ivory { background: #F8F6F1; border-color: #E5E0D5; }

.me-card img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  display: block;
  transition: transform .8s ease;
}

.me-card:hover img { transform: scale(1.05); }

.me-card__body { padding: 1.5rem 1.5rem 1.75rem; }

.me-badge {
  display: inline-block;
  border-radius: 999px;
  padding: .3rem .8rem;
  font-size: .66rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  background: var(--wp--preset--color--forest);
  color: var(--wp--preset--color--ivory);
}

.me-badge--gold { background: var(--wp--preset--color--gold); color: var(--wp--preset--color--forest); }

.me-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  font-size: .8rem;
  color: color-mix(in srgb, var(--wp--preset--color--forest) 68%, transparent);
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid color-mix(in srgb, var(--wp--preset--color--forest) 10%, transparent);
}

.me-price {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1.6rem;
  color: var(--wp--preset--color--forest);
}

.me-grid {
  display: grid;
  gap: 2rem;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
}

/* Filters --------------------------------------------------------------- */
.me-filters {
  display: grid;
  gap: .75rem;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  padding: 1.25rem;
  border-radius: 20px;
  background: #F8F6F1;
  border: 1px solid #E5E0D5;
  margin-bottom: 2.5rem;
}

.me-filters select,
.me-filters input {
  height: 44px;
  border-radius: 12px;
  border: 1px solid #DDD7CA;
  padding: 0 .75rem;
  background: #fff;
  font: inherit;
  font-size: .9rem;
  color: var(--wp--preset--color--forest);
  width: 100%;
}

.me-filters button {
  height: 44px;
  border-radius: 12px;
  border: 0;
  background: var(--wp--preset--color--forest);
  color: var(--wp--preset--color--ivory);
  padding: 0 1.5rem;
  font-size: .8rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  cursor: pointer;
}

/* Property single ------------------------------------------------------- */
.me-prop-hero {
  background: var(--wp--preset--color--forest);
  color: var(--wp--preset--color--ivory);
  padding: 9rem 0 4rem;
  position: relative;
  overflow: hidden;
}

.me-prop-hero__bg {
  position: absolute;
  inset: 0;
  object-fit: cover;
  width: 100%;
  height: 100%;
  opacity: .22;
}

.me-prop-hero__inner { position: relative; }

.me-specs {
  display: grid;
  gap: 1px;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  background: #E5E0D5;
  border: 1px solid #E5E0D5;
  border-radius: 20px;
  overflow: hidden;
}

.me-specs div { background: #fff; padding: 1.25rem; }
.me-specs dt { font-size: .68rem; letter-spacing: .16em; text-transform: uppercase; opacity: .6; }
.me-specs dd { margin: .4rem 0 0; font-size: 1.05rem; }

.me-gallery {
  display: grid;
  gap: .75rem;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}
.me-gallery img { width: 100%; border-radius: 16px; aspect-ratio: 4/3; object-fit: cover; }

/* FAQ / accordion -------------------------------------------------------- */
.me-faq details {
  border-bottom: 1px solid color-mix(in srgb, var(--wp--preset--color--forest) 12%, transparent);
  padding: 1.25rem 0;
}
.me-faq summary {
  cursor: pointer;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1.35rem;
  list-style: none;
}
.me-faq summary::-webkit-details-marker { display: none; }
.me-faq p { margin: .75rem 0 0; color: color-mix(in srgb, var(--wp--preset--color--forest) 70%, transparent); }

/* Contact dock ----------------------------------------------------------- */
.me-dock { position: fixed; right: 20px; bottom: 20px; z-index: 60; }
.me-dock__panel {
  width: 280px;
  background: var(--wp--preset--color--navy);
  color: var(--wp--preset--color--ivory);
  border-radius: 22px;
  padding: 1.25rem;
  margin-bottom: .75rem;
  box-shadow: 0 30px 70px -30px rgba(0,0,0,.6);
  display: none;
}
.me-dock.is-open .me-dock__panel { display: block; }
.me-dock__panel a {
  display: block;
  text-align: center;
  padding: .7rem;
  border-radius: 12px;
  margin-top: .5rem;
  font-size: .85rem;
  text-decoration: none;
  border: 1px solid rgba(248,246,241,.25);
  color: var(--wp--preset--color--ivory);
}
.me-dock__panel a.is-primary {
  background: var(--wp--preset--color--gold);
  color: var(--wp--preset--color--forest);
  border-color: transparent;
}
.me-dock__toggle {
  margin-left: auto;
  display: block;
  width: 56px; height: 56px;
  border-radius: 999px;
  border: 0;
  background: var(--wp--preset--color--gold);
  color: var(--wp--preset--color--forest);
  font-size: 1.4rem;
  cursor: pointer;
  box-shadow: 0 18px 40px -18px rgba(0,0,0,.6);
}

/* Misc ------------------------------------------------------------------- */
.me-rule-gold { position: relative; padding-left: 1rem; }
.me-rule-gold::before {
  content: ""; position: absolute; left: 0; top: .35em; bottom: .35em;
  width: 2px; background: var(--wp--preset--color--gold);
}

.me-reveal { opacity: 0; transform: translateY(18px); transition: opacity .7s ease, transform .7s ease; }
.me-reveal.is-visible { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  .me-reveal { opacity: 1; transform: none; transition: none; }
}

/* ---------- Sticky header states ---------- */
.me-header {
	position: sticky;
	top: 0;
	z-index: 50;
	transition: background-color .4s ease, box-shadow .4s ease;
}
.me-header.is-solid {
	background: rgba(248, 246, 241, .92);
	backdrop-filter: blur(14px);
	box-shadow: 0 1px 0 rgba(15, 45, 35, .08);
}
.me-logo-img { max-height: 40px; width: auto; }

/* ---------- Hero search panel ---------- */
.me-search {
	margin-top: 2.5rem;
	display: grid;
	gap: .75rem;
	grid-template-columns: 1fr;
	background: rgba(248, 246, 241, .9);
	backdrop-filter: blur(16px);
	border: 1px solid rgba(201, 169, 106, .35);
	border-radius: 24px;
	padding: 1.25rem;
}
@media (min-width: 900px) {
	.me-search { grid-template-columns: 1.4fr 1fr 1fr 1fr auto; align-items: center; }
}
.me-search input,
.me-search select {
	width: 100%;
	height: 46px;
	padding: 0 .85rem;
	border-radius: 12px;
	border: 1px solid rgba(15, 45, 35, .16);
	background: #fff;
	color: #0F2D23;
	font-size: .9rem;
}
.me-search input:focus,
.me-search select:focus { outline: none; border-color: #C9A96A; box-shadow: 0 0 0 3px rgba(201, 169, 106, .25); }

.me-btn {
	height: 46px;
	padding: 0 1.6rem;
	border: 0;
	border-radius: 12px;
	background: #C9A96A;
	color: #0F2D23;
	font-size: .78rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color .3s ease;
}
.me-btn:hover { background: #d8bd85; }

/* ---------- Stats ---------- */
.me-stat {
	font-family: 'Cormorant Garamond', Georgia, serif;
	font-size: clamp(2.6rem, 5vw, 4rem);
	line-height: 1;
	margin: 0 0 .5rem;
}

/* ---------- Scroll reveal ---------- */
.me-reveal { opacity: 0; transform: translateY(18px); transition: opacity .7s ease, transform .7s ease; }
.me-reveal.is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
	.me-reveal { opacity: 1; transform: none; transition: none; }
}