/* =============================================================================
   RESIDENCES — Single Project Template
   v0.7 — Hero · Galleries · Floor Plans (downloads) · Body · Brochure · Related
   =============================================================================
   File:    wp-content/themes/<child-theme>/assets/css/single-project.css
   Loaded:  is_singular('project')   via wp_enqueue_scripts (priority 20)
            dependency: elementor-frontend
   Scope:   body.single-project       (Astra-safe specificity)

   Section index
     1.  Design tokens
     2.  Astra / Elementor resets
     3.  Hero outer container
     4.  Hero featured image
     5.  Hero text block            [res_hero_block]
         5a. Top row (status pill, GV badge)
         5b. Title + tagline
         5c. Stats grid
         5d. Hero floor plans list  (inline downloads)
         5e. Actions row + buttons
     6.  Galleries                  [res_project_gallery]
     7.  Floor plans grid           [res_project_floorplans]   (download cards)
     8.  Body section               (Post Content widget)
     9.  Brochure card              [res_project_brochure]
     10. Related projects           [res_related_projects]
     11. Mobile sticky CTA          [res_mobile_cta]
     12. Breadcrumbs                [res_breadcrumbs]
     13. Focus-visible (a11y)
     14. Responsive — tablet (≤1024px)
     15. Responsive — mobile (≤640px)
     16. Print
     17. Reduced motion

   Changelog vs v0.6
     - Removed Specs grid, Location map, Inline lead form, Unit-table cells
     - Floor plans gallery rewritten as unified download-card layout
     - Added hero floor plans inline list (5d)
     - Added brochure card section (9)
     - File trimmed from 1665 → ~1080 lines
   ============================================================================= */


/* ---------------------------------------------------------------------------
   1. DESIGN TOKENS
   --------------------------------------------------------------------------- */
body.single-project {
	--c-ink:          #1b1b1b;
	--c-muted:        #6b6457;
	--c-bronze:       #c3a065;
	--c-bronze-text:  #9a7d4f;
	--c-stone:        #e6e1d8;
	--c-taupe:        #7a6a52;
	--c-green:        #1b5e3a;
	--c-white:        #ffffff;
	--c-cream:        #faf7f2;

	--content-inset:      20px;
	--reading-width:      880px;
	--hero-img-h:         78vh;
	--hero-img-h-tablet:  60vh;
	--hero-img-h-mobile:  56vh;

	--ff-serif: "EB Garamond", Georgia, "Times New Roman", serif;
	--ff-sans:  "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

	--ease-out: cubic-bezier(.22, 1, .36, 1);
}

body.single-project ::selection {
	background: var(--c-bronze);
	color: var(--c-white);
}


/* ---------------------------------------------------------------------------
   2. ASTRA / ELEMENTOR RESETS
   --------------------------------------------------------------------------- */
body.single-project .ast-archive-description,
body.single-project .entry-header,
body.single-project .ast-single-post-header,
body.single-project .entry-header .entry-title {
	display: none !important;
}

body.single-project #primary,
body.single-project .site-content,
body.single-project .ast-container,
body.single-project .site-main,
body.single-project .ast-page-builder-template .entry-content {
	max-width: 100%;
	padding: 0;
	margin: 0;
}


/* ---------------------------------------------------------------------------
   3. HERO — outer container
   --------------------------------------------------------------------------- */
body.single-project .res-hero.e-con,
body.single-project .res-hero.e-con > .e-con-inner {
	max-width: 100%;
	width: 100%;
	padding: 0;
}


/* ---------------------------------------------------------------------------
   4. HERO — featured image
   --------------------------------------------------------------------------- */
body.single-project .res-hero__image.e-con,
body.single-project .res-hero__image.e-con > .e-con-inner {
	max-width: 100%;
	width: 100%;
	padding: var(--content-inset) var(--content-inset) 0;
}

body.single-project .res-hero__image .elementor-widget-image,
body.single-project .res-hero__image .elementor-widget-image .elementor-widget-container,
body.single-project .res-hero__image .elementor-widget-image figure {
	margin: 0;
	padding: 0;
}

body.single-project .res-hero__image img {
	display: block;
	width: 100%;
	height: var(--hero-img-h);
	object-fit: cover;
	object-position: center;
}


/* ---------------------------------------------------------------------------
   5. HERO — text block ([res_hero_block])
   --------------------------------------------------------------------------- */
body.single-project .res-hero__text-wrap.e-con,
body.single-project .res-hero__text-wrap.e-con > .e-con-inner {
	max-width: 100%;
	width: 100%;
	padding: 0;
}

body.single-project .res-hero__block {
	max-width: 1200px;
	margin: 0 auto;
	padding: 96px var(--content-inset);
	font-family: var(--ff-sans);
	color: var(--c-ink);
}

/* 5a. Top row */
body.single-project .res-hero__top-row {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin: 0 0 36px;
	align-items: center;
}

body.single-project .res-status-pill {
	display: inline-flex;
	align-items: center;
	font-family: var(--ff-sans);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	line-height: 1;
	padding: 10px 18px;
	border-radius: 999px;
	background: var(--c-stone);
	color: var(--c-ink);
	white-space: nowrap;
}

body.single-project.status-renovation         .res-status-pill { background: var(--c-taupe);  color: var(--c-white); }
body.single-project.status-available          .res-status-pill { background: var(--c-green);  color: var(--c-white); }
body.single-project.status-under-construction .res-status-pill { background: var(--c-bronze); color: var(--c-white); }
body.single-project.status-completed          .res-status-pill { background: var(--c-stone);  color: var(--c-ink);   }
body.single-project.status-sold-out           .res-status-pill { background: var(--c-ink);    color: var(--c-white); }

body.single-project .res-gv-badge {
	display: inline-flex;
	align-items: center;
	font-family: var(--ff-sans);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	line-height: 1;
	padding: 9px 17px;
	border-radius: 999px;
	background: transparent;
	color: var(--c-bronze-text);
	border: 1px solid var(--c-bronze);
	white-space: nowrap;
}

/* 5b. Title + tagline */
body.single-project .res-hero__title {
	font-family: var(--ff-serif);
	font-weight: 400;
	font-size: clamp(40px, 5.2vw, 72px);
	line-height: 1.04;
	letter-spacing: -0.012em;
	color: var(--c-bronze);
	margin: 0 0 24px;
	text-wrap: balance;
}

body.single-project .res-hero__tagline {
	font-family: var(--ff-sans);
	font-weight: 400;
	font-size: clamp(17px, 1.35vw, 21px);
	line-height: 1.55;
	color: var(--c-muted);
	max-width: 720px;
	margin: 0 0 56px;
}

/* 5c. Stats grid */
body.single-project .res-hero__stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: 32px 40px;
	padding: 36px 0 0;
	margin: 0;
	border-top: 1px solid var(--c-stone);
}

body.single-project .res-hero__stat {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

body.single-project .res-hero__stat-label {
	font-family: var(--ff-sans);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--c-muted);
}

body.single-project .res-hero__stat-label[data-num]::before {
	content: attr(data-num) " · ";
	color: var(--c-bronze-text);
	font-weight: 600;
}

body.single-project .res-hero__stat-value {
	font-family: var(--ff-serif);
	font-size: clamp(22px, 1.9vw, 30px);
	font-weight: 400;
	line-height: 1.2;
	color: var(--c-ink);
}

/* 5d. Hero floor plans inline list */
body.single-project .res-hero__floors {
	margin-top: 48px;
	padding-top: 36px;
	border-top: 1px solid var(--c-stone);
}

body.single-project .res-hero__floors-eyebrow {
	display: block;
	font-family: var(--ff-sans);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--c-bronze-text);
	margin-bottom: 18px;
}

body.single-project .res-hero__floors-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
}

body.single-project .res-floor-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 16px 0;
	border-bottom: 1px solid var(--c-stone);
}

body.single-project .res-floor-row:last-child {
	border-bottom: 0;
}

body.single-project .res-floor-row__main {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	min-width: 0;
}

body.single-project .res-floor-row__icon {
	width: 22px;
	height: 22px;
	flex-shrink: 0;
	color: var(--c-muted);
}

body.single-project .res-floor-row__name {
	font-family: var(--ff-serif);
	font-size: clamp(17px, 1.4vw, 20px);
	font-weight: 400;
	color: var(--c-ink);
	letter-spacing: -0.002em;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

body.single-project .res-floor-row__link {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-family: var(--ff-sans);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--c-ink);
	text-decoration: none;
	padding: 8px 14px;
	border: 1px solid var(--c-ink);
	background: transparent;
	flex-shrink: 0;
	transition: background 0.2s ease, color 0.2s ease, gap 0.25s ease;
}

body.single-project .res-floor-row__link:hover {
	background: var(--c-ink);
	color: var(--c-white);
	gap: 12px;
}

body.single-project .res-floor-row__type {
	display: inline-block;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.18em;
	color: var(--c-bronze-text);
}

body.single-project .res-floor-row__link:hover .res-floor-row__type {
	color: var(--c-bronze);
}

body.single-project .res-floor-row__size {
	display: inline-block;
	font-size: 10px;
	font-weight: 500;
	letter-spacing: 0.12em;
	color: var(--c-muted);
}

body.single-project .res-floor-row__link:hover .res-floor-row__size {
	color: rgba(255, 255, 255, 0.7);
}

body.single-project .res-floor-row__link svg {
	transition: transform 0.25s ease;
}

body.single-project .res-floor-row__link:hover svg {
	transform: translateY(2px);
}

/* 5e. Actions row + buttons */
body.single-project .res-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 48px;
}

body.single-project .res-btn--ghost {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-family: var(--ff-sans);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	padding: 16px 28px;
	border: 1px solid var(--c-ink);
	color: var(--c-ink);
	background: transparent;
	text-decoration: none;
	transition: background 0.25s ease, color 0.25s ease, transform 0.25s ease;
	cursor: pointer;
}

body.single-project .res-btn--ghost:hover {
	background: var(--c-ink);
	color: var(--c-white);
	transform: translateY(-1px);
}

body.single-project .res-btn--solid {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-family: var(--ff-sans);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	padding: 16px 28px;
	border: 1px solid var(--c-ink);
	background: var(--c-ink);
	color: var(--c-white);
	text-decoration: none;
	transition: background 0.25s ease, color 0.25s ease, transform 0.25s ease;
	cursor: pointer;
}

body.single-project .res-btn--solid:hover {
	background: var(--c-bronze-text);
	border-color: var(--c-bronze-text);
	transform: translateY(-1px);
}

body.single-project .res-btn--ghost svg,
body.single-project .res-btn--solid svg {
	transition: transform 0.25s ease;
}

body.single-project .res-btn--ghost:hover svg,
body.single-project .res-btn--solid:hover svg {
	transform: translateX(3px);
}


/* ---------------------------------------------------------------------------
   6. GALLERIES  ([res_project_gallery])
   Two variants: default (real photos) and .is-renders (architectural renders).
   --------------------------------------------------------------------------- */
body.single-project .res-gallery-section.e-con,
body.single-project .res-gallery-section.e-con > .e-con-inner {
	max-width: 100%;
	width: 100%;
	padding: 0;
}

body.single-project .res-galleries {
	display: flex;
	flex-direction: column;
}

body.single-project .res-gallery {
	background: var(--c-white);
	padding: 80px var(--content-inset);
}

body.single-project .res-gallery.is-renders {
	background: var(--c-cream);
}

body.single-project .res-galleries .res-gallery:only-child.is-renders {
	background: var(--c-white);
}

body.single-project .res-gallery__header {
	max-width: var(--reading-width);
	margin: 0 auto 56px;
	padding-bottom: 32px;
	border-bottom: 1px solid var(--c-stone);
	display: flex;
	flex-direction: column;
	gap: 14px;
}

body.single-project .res-gallery__eyebrow {
	font-family: var(--ff-sans);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--c-bronze-text);
}

body.single-project .res-gallery.is-renders .res-gallery__eyebrow {
	color: var(--c-muted);
}

body.single-project .res-gallery__title {
	font-family: var(--ff-serif);
	font-size: clamp(28px, 2.6vw, 40px);
	font-weight: 400;
	line-height: 1.15;
	letter-spacing: -0.008em;
	color: var(--c-ink);
	margin: 0;
	text-wrap: balance;
}

body.single-project .res-gallery__context {
	font-family: var(--ff-sans);
	font-size: 15px;
	font-style: italic;
	line-height: 1.55;
	color: var(--c-muted);
	margin: 4px 0 0;
	max-width: 720px;
}

body.single-project .res-gallery__items {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

body.single-project .res-gallery__hero {
	margin: 0;
	width: 100%;
	overflow: hidden;
}

body.single-project .res-gallery__hero .res-gallery__img {
	display: block;
	width: 100%;
	height: clamp(420px, 72vh, 760px);
	object-fit: cover;
	object-position: center;
}

body.single-project .res-gallery__pair {
	display: grid;
	grid-template-columns: 6fr 4fr;
	gap: 24px;
}

body.single-project .res-gallery__pair.is-flipped {
	grid-template-columns: 4fr 6fr;
}

body.single-project .res-gallery__pair-item {
	margin: 0;
	overflow: hidden;
}

body.single-project .res-gallery__pair-item .res-gallery__img {
	display: block;
	width: 100%;
	height: clamp(320px, 56vh, 580px);
	object-fit: cover;
	object-position: center;
}

@media (hover: hover) and (pointer: fine) {
	body.single-project .res-gallery__img {
		transition: transform 0.6s var(--ease-out), filter 0.4s ease;
		will-change: transform;
	}
	body.single-project .res-gallery__hero:hover .res-gallery__img,
	body.single-project .res-gallery__pair-item:hover .res-gallery__img {
		transform: scale(1.012);
		filter: brightness(1.02);
	}
}


/* ---------------------------------------------------------------------------
   7. FLOOR PLANS GRID  ([res_project_floorplans])
   Download-card layout. Same look for PDF or image rows.
   --------------------------------------------------------------------------- */
body.single-project .res-gallery.is-floorplans {
	background: var(--c-white);
}

body.single-project .res-gallery.is-floorplans .res-gallery__eyebrow {
	color: var(--c-bronze-text);
}

body.single-project .res-gallery.is-floorplans .res-gallery__items {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}

body.single-project .res-gallery__plan {
	margin: 0;
	background: var(--c-cream);
	border: 1px solid var(--c-stone);
	padding: 32px 28px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: 20px;
	text-align: center;
	min-height: 240px;
	transition: border-color 0.25s ease, transform 0.25s ease;
}

@media (hover: hover) and (pointer: fine) {
	body.single-project .res-gallery__plan:hover {
		border-color: var(--c-bronze);
		transform: translateY(-2px);
	}
}

body.single-project .res-gallery__plan-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--c-bronze-text);
}

body.single-project .res-gallery__plan-icon svg {
	width: 56px;
	height: 70px;
	display: block;
}

body.single-project .res-gallery__plan-caption {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	width: 100%;
}

body.single-project .res-gallery__plan-name {
	font-family: var(--ff-serif);
	font-size: clamp(18px, 1.4vw, 22px);
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: -0.002em;
	color: var(--c-ink);
	margin: 0;
	text-transform: none;
}

body.single-project .res-gallery__plan-size {
	font-family: var(--ff-sans);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--c-muted);
}

body.single-project .res-gallery__plan-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--ff-sans);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--c-ink);
	text-decoration: none;
	padding: 10px 18px;
	border: 1px solid var(--c-ink);
	background: transparent;
	margin-top: 6px;
	transition: background 0.25s ease, color 0.25s ease, gap 0.25s ease;
}

body.single-project .res-gallery__plan-link:hover {
	background: var(--c-ink);
	color: var(--c-white);
	gap: 10px;
}

body.single-project .res-gallery__plan-link svg {
	transition: transform 0.25s ease;
}

body.single-project .res-gallery__plan-link:hover svg {
	transform: translateY(2px);
}


/* ---------------------------------------------------------------------------
   8. BODY SECTION (Post Content widget)
   --------------------------------------------------------------------------- */
body.single-project .res-body-section .elementor-widget-theme-post-content > .elementor-widget-container,
body.single-project .res-body-section .elementor-widget-text-editor > .elementor-widget-container,
body.single-project .res-body-section > .elementor-widget > .elementor-widget-container {
	max-width: var(--reading-width);
	margin: 0 auto;
	padding: 56px var(--content-inset) 96px;
	box-sizing: content-box;
}

body.single-project .res-body-section {
	position: relative;
}

body.single-project .res-body-section::before {
	content: "";
	display: block;
	width: 100%;
	max-width: var(--reading-width);
	margin: 0 auto;
	height: 1px;
	background: var(--c-stone);
}

body.single-project .res-body-section,
body.single-project .res-body-section p,
body.single-project .res-body-section li {
	font-family: var(--ff-sans);
	font-size: 17px;
	line-height: 1.7;
	color: var(--c-ink);
}

body.single-project .res-body-section h2 {
	font-family: var(--ff-serif);
	font-size: clamp(28px, 2.4vw, 38px);
	font-weight: 400;
	line-height: 1.15;
	letter-spacing: -0.005em;
	color: var(--c-ink);
	margin: 64px 0 20px;
}

body.single-project .res-body-section h2:first-child {
	margin-top: 0;
}

body.single-project .res-body-section h3 {
	font-family: var(--ff-serif);
	font-size: clamp(22px, 1.8vw, 26px);
	font-weight: 400;
	line-height: 1.25;
	color: var(--c-ink);
	margin: 40px 0 16px;
}

body.single-project .res-body-section p {
	margin: 0 0 20px;
}

body.single-project .res-body-section strong {
	color: var(--c-ink);
	font-weight: 600;
}

body.single-project .res-body-section a {
	color: var(--c-bronze-text);
	text-decoration: none;
	border-bottom: 1px solid var(--c-bronze);
	transition: color 0.2s ease, border-color 0.2s ease;
}

body.single-project .res-body-section a:hover {
	color: var(--c-ink);
	border-color: var(--c-ink);
}

body.single-project .res-body-section ul,
body.single-project .res-body-section ol {
	margin: 0 0 24px;
	padding-left: 24px;
}

body.single-project .res-body-section ul li,
body.single-project .res-body-section ol li {
	margin: 0 0 10px;
}

body.single-project .res-body-section ul li::marker {
	color: var(--c-bronze);
}

body.single-project .res-body-section blockquote {
	margin: 32px 0;
	padding: 24px 28px;
	border-left: 3px solid var(--c-bronze);
	background: var(--c-cream);
	font-family: var(--ff-serif);
	font-size: clamp(20px, 1.5vw, 24px);
	font-style: italic;
	line-height: 1.4;
	color: var(--c-ink);
}

body.single-project .res-body-section blockquote cite {
	display: block;
	margin-top: 12px;
	font-family: var(--ff-sans);
	font-size: 12px;
	font-style: normal;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--c-muted);
}


/* ---------------------------------------------------------------------------
   9. BROCHURE CARD  ([res_project_brochure])
   --------------------------------------------------------------------------- */
body.single-project .res-brochure {
	background: var(--c-cream);
	padding: 64px var(--content-inset);
	border-top: 1px solid var(--c-stone);
	border-bottom: 1px solid var(--c-stone);
}

body.single-project .res-brochure__inner {
	max-width: 1080px;
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 32px;
	flex-wrap: wrap;
}

body.single-project .res-brochure__content {
	flex: 1 1 320px;
	min-width: 0;
}

body.single-project .res-brochure__eyebrow {
	display: block;
	font-family: var(--ff-sans);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--c-bronze-text);
	margin-bottom: 12px;
}

body.single-project .res-brochure__title {
	font-family: var(--ff-serif);
	font-size: clamp(22px, 2vw, 32px);
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: -0.005em;
	color: var(--c-ink);
	margin: 0 0 14px;
	text-wrap: balance;
}

body.single-project .res-brochure__meta {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin: 0;
	font-family: var(--ff-sans);
	font-size: 13px;
	color: var(--c-muted);
}

body.single-project .res-brochure__meta strong {
	color: var(--c-ink);
	font-weight: 600;
	letter-spacing: 0.06em;
}

body.single-project .res-brochure__icon {
	width: 22px;
	height: 22px;
	flex-shrink: 0;
	color: var(--c-bronze-text);
}

body.single-project .res-brochure__name {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	max-width: 320px;
	display: inline-block;
	vertical-align: bottom;
}

body.single-project .res-brochure__action {
	flex-shrink: 0;
}


/* ---------------------------------------------------------------------------
   10. RELATED PROJECTS  ([res_related_projects])
   --------------------------------------------------------------------------- */
body.single-project .res-related-section.e-con,
body.single-project .res-related-section.e-con > .e-con-inner {
	max-width: 100%;
	width: 100%;
	padding: 0;
}

body.single-project .res-related {
	background: var(--c-cream);
	padding: 96px var(--content-inset);
}

body.single-project .res-related__inner {
	max-width: 1280px;
	margin: 0 auto;
}

body.single-project .res-related__header {
	display: flex;
	flex-direction: column;
	gap: 14px;
	margin: 0 0 56px;
	padding-bottom: 32px;
	border-bottom: 1px solid var(--c-stone);
}

body.single-project .res-related__eyebrow {
	font-family: var(--ff-sans);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--c-muted);
}

body.single-project .res-related__title {
	font-family: var(--ff-serif);
	font-size: clamp(32px, 3.2vw, 48px);
	font-weight: 400;
	line-height: 1.1;
	letter-spacing: -0.01em;
	color: var(--c-ink);
	margin: 0;
}

body.single-project .res-related__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 32px;
	margin: 0 0 56px;
}

body.single-project .res-related__card {
	background: transparent;
}

body.single-project .res-related__link {
	display: block;
	text-decoration: none;
	color: inherit;
	border: 0;
}

body.single-project .res-related__media {
	position: relative;
	overflow: hidden;
	margin: 0 0 24px;
	background: var(--c-stone);
	aspect-ratio: 4 / 3;
}

body.single-project .res-related__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	transition: transform 0.7s var(--ease-out);
}

body.single-project .res-related__img--placeholder {
	background: linear-gradient(135deg, var(--c-stone) 0%, var(--c-cream) 100%);
}

@media (hover: hover) and (pointer: fine) {
	body.single-project .res-related__link:hover .res-related__img {
		transform: scale(1.04);
	}
}

body.single-project .res-related__pill {
	position: absolute;
	top: 16px;
	left: 16px;
	display: inline-flex;
	align-items: center;
	font-family: var(--ff-sans);
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	line-height: 1;
	padding: 8px 14px;
	border-radius: 999px;
	background: var(--c-stone);
	color: var(--c-ink);
	white-space: nowrap;
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
}

body.single-project .res-related__card.status-renovation         .res-related__pill { background: rgba(122, 106, 82, 0.95);  color: var(--c-white); }
body.single-project .res-related__card.status-available          .res-related__pill { background: rgba(27, 94, 58, 0.95);    color: var(--c-white); }
body.single-project .res-related__card.status-under-construction .res-related__pill { background: rgba(195, 160, 106, 0.95); color: var(--c-white); }
body.single-project .res-related__card.status-completed          .res-related__pill { background: rgba(230, 225, 216, 0.95); color: var(--c-ink);   }
body.single-project .res-related__card.status-sold-out           .res-related__pill { background: rgba(27, 27, 27, 0.92);    color: var(--c-white); }

body.single-project .res-related__gv {
	position: absolute;
	top: 16px;
	right: 16px;
	display: inline-flex;
	align-items: center;
	font-family: var(--ff-sans);
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	line-height: 1;
	padding: 7px 13px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.92);
	color: var(--c-bronze-text);
	border: 1px solid var(--c-bronze);
	white-space: nowrap;
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
}

body.single-project .res-related__body {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 0 4px;
}

body.single-project .res-related__name {
	font-family: var(--ff-serif);
	font-size: clamp(20px, 1.5vw, 24px);
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: -0.005em;
	color: var(--c-ink);
	margin: 0;
	text-wrap: balance;
}

body.single-project .res-related__loc {
	font-family: var(--ff-sans);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--c-muted);
	margin: 0;
}

body.single-project .res-related__tagline {
	font-family: var(--ff-sans);
	font-size: 15px;
	line-height: 1.5;
	color: var(--c-muted);
	margin: 4px 0 8px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

body.single-project .res-related__cta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--ff-sans);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--c-ink);
	margin-top: 8px;
	padding-top: 12px;
	border-top: 1px solid var(--c-stone);
	transition: color 0.2s ease, gap 0.25s ease;
}

@media (hover: hover) and (pointer: fine) {
	body.single-project .res-related__link:hover .res-related__cta {
		color: var(--c-bronze-text);
		gap: 12px;
	}
}

body.single-project .res-related__cta svg {
	transition: transform 0.25s ease;
}

@media (hover: hover) and (pointer: fine) {
	body.single-project .res-related__link:hover .res-related__cta svg {
		transform: translateX(3px);
	}
}

body.single-project .res-related__footer {
	display: flex;
	justify-content: center;
}


/* ---------------------------------------------------------------------------
   11. MOBILE STICKY CTA  ([res_mobile_cta])
   --------------------------------------------------------------------------- */
body.single-project .res-mobile-cta {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 90;
	display: none;
	gap: 8px;
	padding: 12px var(--content-inset);
	background: rgba(255, 255, 255, 0.96);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	border-top: 1px solid var(--c-stone);
	box-shadow: 0 -4px 16px rgba(27, 27, 27, 0.06);
}

body.single-project .res-mobile-cta a {
	flex: 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-family: var(--ff-sans);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	padding: 14px 12px;
	text-decoration: none;
	border: 1px solid var(--c-ink);
	color: var(--c-ink);
	background: transparent;
	white-space: nowrap;
}

body.single-project .res-mobile-cta a.is-primary {
	background: var(--c-ink);
	color: var(--c-white);
}


/* ---------------------------------------------------------------------------
   12. BREADCRUMBS  ([res_breadcrumbs])
   --------------------------------------------------------------------------- */
body.single-project .res-breadcrumbs {
	max-width: 1200px;
	margin: 0 auto;
	padding: 20px var(--content-inset) 0;
	font-family: var(--ff-sans);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--c-muted);
}

body.single-project .res-breadcrumbs a {
	color: var(--c-muted);
	text-decoration: none;
	border-bottom: 1px solid transparent;
	transition: color 0.2s ease, border-color 0.2s ease;
}

body.single-project .res-breadcrumbs a:hover {
	color: var(--c-ink);
	border-color: var(--c-ink);
}

body.single-project .res-breadcrumbs .breadcrumb_last,
body.single-project .res-breadcrumbs [aria-current="page"] {
	color: var(--c-ink);
}


/* ---------------------------------------------------------------------------
   13. FOCUS-VISIBLE (keyboard a11y)
   --------------------------------------------------------------------------- */
body.single-project a:focus-visible,
body.single-project button:focus-visible {
	outline: 2px solid var(--c-bronze);
	outline-offset: 3px;
	border-radius: 2px;
}


/* ---------------------------------------------------------------------------
   14. RESPONSIVE — Tablet (≤1024px)
   --------------------------------------------------------------------------- */
@media (max-width: 1024px) {

	body.single-project {
		--content-inset: 16px;
	}

	body.single-project .res-hero__image img {
		height: var(--hero-img-h-tablet);
	}

	body.single-project .res-hero__block {
		padding: 72px var(--content-inset) 80px;
	}

	body.single-project .res-hero__title {
		font-size: clamp(34px, 6vw, 54px);
	}

	body.single-project .res-gallery {
		padding: 60px var(--content-inset);
	}

	body.single-project .res-gallery__header {
		margin-bottom: 40px;
		padding-bottom: 24px;
	}

	body.single-project .res-gallery__items {
		gap: 20px;
	}

	body.single-project .res-gallery__hero .res-gallery__img {
		height: clamp(360px, 58vh, 540px);
	}

	body.single-project .res-gallery__pair-item .res-gallery__img {
		height: clamp(280px, 44vh, 420px);
	}

	body.single-project .res-gallery.is-floorplans .res-gallery__items {
		grid-template-columns: repeat(2, 1fr);
		gap: 20px;
	}

	body.single-project .res-gallery__plan {
		padding: 28px 24px;
		min-height: 220px;
	}

	body.single-project .res-body-section .elementor-widget-theme-post-content > .elementor-widget-container,
	body.single-project .res-body-section .elementor-widget-text-editor > .elementor-widget-container,
	body.single-project .res-body-section > .elementor-widget > .elementor-widget-container {
		padding: 48px var(--content-inset) 80px;
	}

	body.single-project .res-related {
		padding: 80px var(--content-inset);
	}

	body.single-project .res-related__grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 28px;
	}
}


/* ---------------------------------------------------------------------------
   15. RESPONSIVE — Mobile (≤640px)
   --------------------------------------------------------------------------- */
@media (max-width: 640px) {

	body.single-project {
		--content-inset: 14px;
	}

	body.single-project .res-hero__image img {
		height: var(--hero-img-h-mobile);
	}

	body.single-project .res-hero__block {
		padding: 56px var(--content-inset) 64px;
	}

	body.single-project .res-hero__top-row {
		margin-bottom: 28px;
	}

	body.single-project .res-status-pill,
	body.single-project .res-gv-badge {
		font-size: 10px;
		padding: 9px 14px;
	}

	body.single-project .res-hero__title {
		font-size: clamp(30px, 8vw, 40px);
		margin-bottom: 20px;
	}

	body.single-project .res-hero__tagline {
		font-size: 16px;
		margin-bottom: 40px;
	}

	body.single-project .res-hero__stats {
		grid-template-columns: repeat(2, 1fr);
		gap: 24px;
		padding-top: 28px;
	}

	body.single-project .res-hero__stat-value {
		font-size: 22px;
	}

	body.single-project .res-hero__actions {
		margin-top: 36px;
	}

	body.single-project .res-btn--ghost,
	body.single-project .res-btn--solid {
		padding: 14px 22px;
		font-size: 11px;
	}

	body.single-project .res-floor-row {
		flex-direction: column;
		align-items: flex-start;
		gap: 12px;
		padding: 14px 0;
	}

	body.single-project .res-floor-row__link {
		align-self: stretch;
		justify-content: center;
	}

	body.single-project .res-floor-row__size {
		display: none;
	}

	body.single-project .res-gallery {
		padding: 48px var(--content-inset);
	}

	body.single-project .res-gallery__header {
		margin-bottom: 32px;
		padding-bottom: 20px;
	}

	body.single-project .res-gallery__title {
		font-size: 24px;
	}

	body.single-project .res-gallery__context {
		font-size: 14px;
	}

	body.single-project .res-gallery__items {
		gap: 14px;
	}

	body.single-project .res-gallery__hero .res-gallery__img {
		height: clamp(260px, 44vh, 420px);
	}

	body.single-project .res-gallery__pair,
	body.single-project .res-gallery__pair.is-flipped {
		grid-template-columns: 1fr;
		gap: 14px;
	}

	body.single-project .res-gallery__pair-item .res-gallery__img {
		height: 280px;
	}

	body.single-project .res-gallery.is-floorplans .res-gallery__items {
		grid-template-columns: 1fr;
		gap: 14px;
	}

	body.single-project .res-gallery__plan {
		padding: 24px 20px;
		min-height: 0;
		gap: 16px;
	}

	body.single-project .res-gallery__plan-icon svg {
		width: 48px;
		height: 60px;
	}

	body.single-project .res-body-section .elementor-widget-theme-post-content > .elementor-widget-container,
	body.single-project .res-body-section .elementor-widget-text-editor > .elementor-widget-container,
	body.single-project .res-body-section > .elementor-widget > .elementor-widget-container {
		padding: 32px var(--content-inset) 64px;
	}

	body.single-project .res-body-section,
	body.single-project .res-body-section p,
	body.single-project .res-body-section li {
		font-size: 16px;
	}

	body.single-project .res-body-section h2 {
		font-size: 26px;
		margin-top: 48px;
	}

	body.single-project .res-body-section h3 {
		font-size: 20px;
		margin-top: 32px;
	}

	body.single-project .res-brochure {
		padding: 48px var(--content-inset);
	}

	body.single-project .res-brochure__inner {
		gap: 24px;
	}

	body.single-project .res-brochure__name {
		max-width: 200px;
	}

	body.single-project .res-brochure__action {
		width: 100%;
		justify-content: center;
	}

	body.single-project .res-related {
		padding: 56px var(--content-inset) 96px;
	}

	body.single-project .res-related__header {
		margin-bottom: 36px;
		padding-bottom: 24px;
	}

	body.single-project .res-related__title {
		font-size: 28px;
	}

	body.single-project .res-related__grid {
		grid-template-columns: 1fr;
		gap: 32px;
		margin-bottom: 40px;
	}

	body.single-project .res-related__pill,
	body.single-project .res-related__gv {
		font-size: 9px;
		padding: 7px 11px;
	}

	body.single-project .res-related__name {
		font-size: 22px;
	}
}

/* Sticky CTA visibility — covers tablet portrait + phone */
@media (max-width: 768px) {
	body.single-project .res-mobile-cta {
		display: flex;
	}
	body.single-project .res-related {
		padding-bottom: 96px;
	}
}


/* ---------------------------------------------------------------------------
   16. PRINT
   --------------------------------------------------------------------------- */
@media print {

	body.single-project {
		--c-cream: #ffffff;
		--c-stone: #d8d4cb;
	}

	body.single-project .site-header,
	body.single-project .site-footer,
	body.single-project .res-mobile-cta,
	body.single-project .res-related,
	body.single-project .res-hero__actions,
	body.single-project .res-brochure {
		display: none !important;
	}

	body.single-project .res-hero__image img {
		height: auto !important;
		max-height: 60vh;
	}

	body.single-project .res-gallery__hero .res-gallery__img,
	body.single-project .res-gallery__pair-item .res-gallery__img {
		height: auto !important;
		max-height: 50vh;
	}

	body.single-project .res-gallery {
		padding: 24px 0;
		page-break-inside: avoid;
	}

	body.single-project .res-gallery__plan {
		page-break-inside: avoid;
	}

	body.single-project a {
		text-decoration: none;
		color: var(--c-ink) !important;
		border: 0 !important;
	}
}


/* ---------------------------------------------------------------------------
   17. REDUCED MOTION
   --------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	body.single-project .res-gallery__img,
	body.single-project .res-btn--ghost,
	body.single-project .res-btn--ghost svg,
	body.single-project .res-btn--solid,
	body.single-project .res-btn--solid svg,
	body.single-project .res-related__img,
	body.single-project .res-related__cta,
	body.single-project .res-related__cta svg,
	body.single-project .res-body-section a,
	body.single-project .res-gallery__plan,
	body.single-project .res-gallery__plan-link,
	body.single-project .res-floor-row__link {
		transition: none !important;
	}
}

/* =================== END Single Project Template v0.7 =================== */