@import url('https://fonts.googleapis.com/css2?family=Gothic+A1:wght@400;500;600;700&display=swap');

/* ============================ */
/* Careers page template         */
/* ============================ */
.careers-hero { background: #f7f8f9; }

/* ============================ */
/* Single Project: responsive    */
/* ============================ */
/* Base adjustments under 1280px */
@media (max-width: 1279.98px) {
  /* Single Project hero caption container scaling */
  .project-single .hero-caption-inner.container.mx-auto { max-width: 960px; }
  .project-single .hero-caption-inner .hero-kicker { font-size: 12px; letter-spacing: .16em; }
  .project-single .hero-caption-inner .hero-title { font-size: clamp(28px, 4.2vw, 40px); line-height: 1.15; }
  .project-single .hero-caption-inner .hero-desc { font-size: 15px; line-height: 1.7; }
  .project-single .project-hero .hero-content { gap: 18px; }
  .project-single .project-hero .hero-title { font-size: clamp(28px, 4.2vw, 44px); }
  .project-single .project-hero .hero-desc { font-size: 15px; line-height: 1.7; }
  .project-single .project-tabs .project-tabs-list { font-size: 14px; gap: 10px; }
}
span.unit-status.is-open {
	cursor: pointer;
}
span.unit-status.is-open:hover {
	color: #0f172a;
}
.project-block.block--gallery .gallery-grid {
    display: flex;
    flex-wrap: wrap;
}
.project-block.block--gallery .gallery-grid .gallery-item {
    max-width: 50%;
    border-radius: 0px !important;
}
.project-block.block--gallery .gallery-grid .gallery-item img {
    border-radius: 0px;
	width: 100%;
    height: 100%;
    object-fit: cover;
}
.project-block.block--gallery .gallery-grid .gallery-item:last-child:nth-child(odd) {
    max-width: 100%;
}
/* Tablet and down */
@media (max-width: 1023.98px) {
  /* Hero: stack columns */
  .project-single .project-hero .hero-row { display: grid; grid-template-columns: 1fr; gap: 16px; }
  .project-single .project-hero .hero-left, 
  .project-single .project-hero .hero-right { width: 100%; }
  .project-single .hero-caption-inner.container.mx-auto { max-width: 720px; }
  .project-single .hero-caption-inner .hero-kicker { font-size: 11px; letter-spacing: .18em; }
  .project-single .hero-caption-inner .hero-title { font-size: 30px; line-height: 1.14; }
  .project-single .hero-caption-inner .hero-desc { font-size: 14px; line-height: 1.7; }
  .project-single .project-hero .hero-title { font-size: clamp(26px, 5vw, 38px); }

  /* Tabs: make horizontally scrollable on overflow */
  .project-single .project-tabs .project-tabs-list { display: flex; overflow-x: auto; -webkit-overflow-scrolling: touch; gap: 12px; scrollbar-width: none; }
  .project-single .project-tabs .project-tabs-list::-webkit-scrollbar { display: none; }
  .project-single .project-tabs .tab-item a { padding: 10px 12px; white-space: nowrap; }

  /* Sections: reduce outer spacing */
  .project-single .project-section { padding-top: 24px; padding-bottom: 24px; }

  /* Availability: stack filter above list */
  .project-single .units-availability .units-grid { display: grid; grid-template-columns: 1fr; gap: 20px; }
  .project-single .units-availability .units-filter { position: static; top: auto; width: 100%; }
  .project-single .units-availability .filter-chips { flex-wrap: wrap; row-gap: 8px; }
  .project-single .units-availability .chip { font-size: 13px; }
  .project-single .units-availability .filter-range { padding: 8px 0; }

  /* Make unit table region scrollable horizontally if needed */
  .project-single .units-availability .units-list-wrapper, 
  .project-single .units-availability .units-list { overflow-x: auto; -webkit-overflow-scrolling: touch; }

  /* Unit row typography */
  .project-single .units-availability .unit-row { padding: 10px 12px; gap: 10px; }
  .project-single .units-availability .unit-name { font-size: 16px; }
  .project-single .units-availability .unit-meta, 
  .project-single .units-availability .unit-price, 
  .project-single .units-availability .unit-status { font-size: 12px; }
}

/* Mobile refinements */
@media (max-width: 639.98px) {
  .project-single .hero-caption-inner.container.mx-auto { max-width: 92vw; }
  .project-single .hero-caption-inner .hero-kicker { font-size: 10px; letter-spacing: .2em; }
  .project-single .hero-caption-inner .hero-title { font-size: 24px; line-height: 1.12; }
  .project-single .hero-caption-inner .hero-desc { font-size: 13px; line-height: 1.7; }
  .project-single .project-hero .hero-title { font-size: clamp(22px, 6.5vw, 32px); }
  .project-single .project-tabs .tab-item a { padding: 8px 10px; }
  /* Availability: simplify on phones */
  .project-single .units-availability .units-header { display: none; }
  .project-single .units-availability .unit-row {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-areas:
      "name status"
      "meta price";
    align-items: center;
    row-gap: 6px;
  }
  .project-single .units-availability .unit-name { grid-area: name; font-size: 16px; }
  .project-single .units-availability .unit-status { grid-area: status; justify-self: end; }
  .project-single .units-availability .unit-meta { grid-area: meta; color: #6b7280; }
  .project-single .units-availability .unit-price { grid-area: price; justify-self: end; font-weight: 500; }
  .project-single .units-availability .chip { min-height: 34px; padding: 6px 10px; }
}
/* ============================ */
/* Mobile Nav (hamburger + modal) */
/* ============================ */
.hamburger-btn {
  position: fixed;
  top: 12px;
  right: 16px;
  z-index: 1001;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(15, 23, 42, 0.15);
  border-radius: 8px;
  background: #ffffff;
  display: none; /* hidden by default, enabled on mobile */
  align-items: center;
  justify-content: center;
  padding: 0;
}
.hamburger-btn .hamburger-bar {
  display: block;
  width: 22px;
  height: 2px;
  background: #0f172a;
  margin: 3px 0;
}
@media (max-width: 1023.98px) {
  .hamburger-btn { display: inline-flex; }
}

.nav-modal { 
  position: fixed; inset: 0; z-index: 1000; display: none;
}
.nav-modal.is-open { display: block; }
.nav-modal__backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.45); }
.nav-modal__panel {
  position: absolute;
  top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: min(92vw, 420px);
  max-height: 85vh;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 20px 60px rgba(0,0,0,0.2);
  display: flex; flex-direction: column;
  overflow: hidden;
}
.nav-modal__header { display: flex; align-items: center; justify-content: space-between; padding: 16px 18px; border-bottom: 1px solid #e5e7eb; }
.nav-modal__title { font-size: 16px; margin: 0; color: #0f172a; }
.nav-modal__close { background: transparent; border: 0; font-size: 22px; line-height: 1; padding: 4px 8px; cursor: pointer; color: #0f172a; }
.nav-modal__body { padding: 8px 6px 12px 6px; overflow: auto; }
.nav-modal__list, .nav-modal__list ul { list-style: none; margin: 0; padding: 0; }
.nav-modal__list > li { border-bottom: 1px solid #f1f5f9; }
.nav-modal__list a { display: block; padding: 12px 16px; color: #0f172a; text-decoration: none; }
.nav-modal__list a:hover { background: #f8fafc; }

/* Prevent background scroll when modal open */
.nav-lock { overflow: hidden; }

/* ============================ */
/* Global baseline scaling       */
/* ============================ */
@media (max-width: 1023.98px) {
  main h1 { font-size: 30px; }
  main h2 { font-size: 26px; }
  main h3 { font-size: 22px; }
  main p, main li { font-size: 15px; line-height: 1.75; }
}
@media (max-width: 639.98px) {
  main h1 { font-size: 26px; }
  main h2 { font-size: 22px; }
  main h3 { font-size: 20px; }
  main p, main li { font-size: 14px; line-height: 1.75; }
}
.careers-hero .careers-content { padding: 64px var(--container-pad-x); }
.careers-title { font-size: clamp(32px, 5vw, 56px); font-weight: 400; line-height: 1.05; color: #0f172a; margin: 0 0 12px 0; }
.careers-desc { color: #475569; max-width: 70ch; font-size: 16px; line-height: 1.8; }

.careers-positions { padding: 40px var(--container-pad-x); background: #ffffff; }
/* Two-column layout: intro (left) + list (right) */
.positions-grid { display: grid; grid-template-columns: 1fr; gap: 24px; }
@media (min-width: 1024px) { .positions-grid { grid-template-columns: 1fr 2fr; gap: 32px; } }

/* Left intro */
.positions-intro { padding-right: 0; }
.positions-kicker { color: #0284c7; text-transform: uppercase; font-size: 12px; margin: 0 0 40px 0 !important; letter-spacing: .14em; }
.positions-title { font-size: clamp(28px, 4vw, 44px); font-weight: 400; line-height: 1.1; color: #0f172a; margin: 0 0 10px 0; }
.positions-sub { color: #64748b; font-size: 14px; margin: 0; max-width: 46ch; }

/* Right list */
.positions-list { border-top: 1px solid #e5e7eb; }
.job-row { display: grid; grid-template-columns: 1fr auto auto; align-items: center; column-gap: 24px; padding: 20px 0; border-bottom: 1px solid #e5e7eb; }
.job-row .job-main { display: flex; gap: 18px; align-items: baseline; }
.job-row .job-title { color: #0f172a; text-decoration: none; font-size: 18px; }
.job-row .job-title:hover { text-decoration: underline; }
.job-row .job-dept { color: #318ac7; text-decoration: none; font-size: 16px; }
.job-row .job-dept:hover { text-decoration: underline; }
.job-row .job-date { color: #94a3b8; font-size: 14px; white-space: nowrap; }
.job-row .job-apply { color: #0f172a; text-decoration: none; font-size: 15px; white-space: nowrap; }
.job-row .job-apply:hover { text-decoration: underline; }

.careers-benefits { padding: 56px var(--container-pad-x); }
.benefits-title { font-size: clamp(24px, 3vw, 36px); font-weight: 500; color: #0f172a; margin: 0 0 16px 0; }
.benefits-grid { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 1024px) { .benefits-grid { grid-template-columns: repeat(3,1fr); gap: 22px; } }
.benefit-item { border-left: 2px solid #e5e7eb; padding: 24px; background: #fff; }
.benefit-name { margin: 0 0 8px 0; font-size: 16px; color: #318ac7; text-transform: uppercase; }
.benefit-text { margin: 0; color: #475569; line-height: 1.7; }

.careers-cta { padding: 40px var(--container-pad-x) 80px var(--container-pad-x); }
.careers-cta .cta-inner { border-top: 1px solid #e5e7eb; border-bottom: 1px solid #e5e7eb; padding: 18px 0; display: grid; gap: 12px; grid-template-columns: 1fr; align-items: center; }
@media (min-width: 768px) { .careers-cta .cta-inner { grid-template-columns: auto 1fr auto; gap: 18px; } }
.cta-title { margin: 0; font-size: 18px; color: #0f172a; }
.cta-text { margin: 0; color: #334155; }
.cta-button { display: inline-flex; align-items: center; justify-content: center; height: 36px; padding: 0 14px; background: #2f6fb0; color: #fff; text-decoration: none; }
.cta-button:hover { background: #295f96; }

/* Remove any theme top margin on careers main */
.site-main.careers-template { margin-top: 0 !important; }

/* Neutralize parent wrappers on Careers template */
.page-template-careers-template-php .content-area,
.page-template-careers-template .content-area { width: 100% !important; float: none !important; margin: 0 !important; }
.page-template-careers-template-php .inside-site-container,
.page-template-careers-template .inside-site-container,
.page-template-careers-template-php .site-content,
.page-template-careers-template .site-content { display: block !important; grid-template-columns: none !important; padding-left: 0 !important; padding-right: 0 !important; }
.page-template-careers-template-php .grid-container,
.page-template-careers-template .grid-container { max-width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; }
.page-template-careers-template-php .site.grid-container,
.page-template-careers-template .site.grid-container,
.page-template-careers-template-php #page.grid-container,
.page-template-careers-template #page.grid-container { max-width: none !important; width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; }
.page-template-careers-template-php .widget-area,
.page-template-careers-template .widget-area,
.page-template-careers-template-php .sidebar,
.page-template-careers-template .sidebar,
.page-template-careers-template-php .secondary-navigation,
.page-template-careers-template .secondary-navigation { display: none !important; width: 0 !important; }
/* ============================ */
/* Hero slider overlays          */
/* ============================ */
.hero-slide {
  position: relative;
  background-size: cover;
  background-position: center;
}

/* ============================ */
/* Home: make all kickers blue except hero */
/* ============================ */
.page-template-home-template-php :not(.hero-section) > .section-kicker,
.page-template-home-template-php .services-section .section-kicker,
.page-template-home-template-php .projects-section .section-kicker,
.page-template-home-template-php .about-section .section-kicker {
  color: #0284c7 !important; /* sky-600 */
}
/* Keep hero kicker unaffected (white on hero) */
.page-template-home-template-php .hero-section .hero-kicker {
  color: rgba(255, 255, 255, 0.8) !important;
}

/* ============================ */
/* Projects Page (3-col grid)    */
/* ============================ */
.page-template-projects-template-php .projects-hero {
  padding: 64px 24px;
}
@media (min-width: 768px) {
  .page-template-projects-template-php .projects-hero {
    padding: 80px 40px;
  }
}
@media (min-width: 1024px) {
  .page-template-projects-template-php .projects-hero {
    padding: 96px 64px;
  }
}

.page-template-projects-template-php .projects-container {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--container-pad-x);
  padding-right: var(--container-pad-x);
}
/* Match site container widths at common breakpoints */
@media (min-width: 640px) {
  .page-template-projects-template-php .projects-container {
    max-width: 640px;
  }
}
@media (min-width: 768px) {
  .page-template-projects-template-php .projects-container {
    max-width: 768px;
  }
}
@media (min-width: 1024px) {
  .page-template-projects-template-php .projects-container {
    max-width: 1024px;
  }
}
@media (min-width: 1280px) {
  .page-template-projects-template-php .projects-container {
    max-width: 1280px;
  }
}
@media (min-width: 1536px) {
  .page-template-projects-template-php .projects-container {
    max-width: 1536px;
  }
}

.page-template-projects-template-php .projects-kicker {
  color: #0284c7; /* sky tone */
  text-transform: uppercase;
  font-size: 14px;
  letter-spacing: 0.16em;
  font-weight: 500;
  padding-bottom: 80px; /* spacing between kicker and title */
}

.page-template-projects-template-php .projects-title {
  font-size: clamp(2rem, 4vw, 3.25rem);
  font-weight: 400;
  line-height: 1.15;
  color: #0f172a;
  margin-bottom: 40px;
}

.page-template-projects-template-php .projects-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 32px;
}
@media (min-width: 768px) {
  .page-template-projects-template-php .projects-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
  }
}
@media (min-width: 1024px) {
  .page-template-projects-template-php .projects-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 48px;
  }
}

/* Toolbar */
.projects-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 16px;
  align-items: center;
  justify-content: flex-end;
  margin: 8px 0 24px 0;
}
.projects-toolbar .toolbar-group {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.projects-toolbar label {
  font-size: 14px;
  line-height: 1.2;
  color: #374151; /* slate-700 */
}
@media (min-width: 1024px) {
  .projects-toolbar label {
    font-size: 15px;
  }
}
.projects-toolbar .toolbar-select,
.projects-toolbar .toolbar-input {
  appearance: none;
  -webkit-appearance: none;
  font-size: 14px;
  color: #374151;
  border: 0;
  border-radius: 0;
  padding: 0;
  background: transparent;
  outline: none;
  cursor: pointer;
}
.projects-toolbar .toolbar-input {
  cursor: text;
}
.projects-toolbar .toolbar-select:focus,
.projects-toolbar .toolbar-input:focus {
  box-shadow: none;
}
.projects-toolbar .toolbar-search {
  position: relative;
}
.projects-toolbar .toolbar-search-icon {
  position: relative;
  display: inline-block;
  font-size: 16px;
  color: #374151;
  margin-left: 4px;
}

/* Expandable search: keep input visually minimal, expand on focus */
.projects-toolbar .toolbar-search {
  display: inline-flex;
  align-items: center;
}
.projects-toolbar #prj-search {
  width: 0;
  opacity: 0;
  transition: width 0.2s ease, opacity 0.2s ease;
  margin-left: 6px;
}
.projects-toolbar #prj-search:focus {
  width: 120px;
  opacity: 1;
}
.hero-slide::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: 20.666%;
  /* Bottom gradient that fades upward */
  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.25) 25%,
    rgba(0, 0, 0, 0.45) 55%,
    rgba(0, 0, 0, 0.65) 100%
  );
  z-index: 1;
  pointer-events: none;
}
.hero-caption {
  position: relative;
  z-index: 2;
  padding: 0 0px 48px 0px;
}
.hero-title {
  color: #fff;
}
.hero-desc {
  color: rgba(255, 255, 255, 0.9);
}
/*
Theme Name: RCC Child
Theme URI: https://generatepress.com
Template: rcc
Author: Tom Usborne
Author URI: https://generatepress.com/about
Description: GeneratePress is a lightweight WordPress theme built with a focus on speed and usability. Performance is important to us, which is why a fresh GeneratePress install adds less than 10kb (gzipped) to your page size. We take full advantage of the block editor (Gutenberg), which gives you more control over creating your content. If you use page builders, GeneratePress is the right theme for you. It is completely compatible with all major page builders, including Beaver Builder and Elementor. Thanks to our emphasis on WordPress coding standards, we can boast full compatibility with all well-coded plugins, including WooCommerce. GeneratePress is fully responsive, uses valid HTML/CSS, and is translated into over 25 languages by our amazing community of users. A few of our many features include 60+ color controls, powerful dynamic typography, 5 navigation locations, 5 sidebar layouts, dropdown menus (click or hover), and 9 widget areas. Learn more and check out our powerful premium version at https://generatepress.com
Tags: two-columns,three-columns,one-column,right-sidebar,left-sidebar,footer-widgets,blog,e-commerce,flexible-header,full-width-template,buddypress,custom-header,custom-background,custom-menu,custom-colors,sticky-post,threaded-comments,translation-ready,rtl-language-support,featured-images,theme-options
Version: 3.6.0.1755683262
Updated: 2025-08-20 09:47:42

*/

/* Global link styles - match footer inline look */
a {
  text-decoration: none !important;
  color: inherit !important; /* Use surrounding text color (e.g., footer slate tone) */
}

a:hover,
a:focus {
  text-decoration: underline !important; /* show underline on hover/focus */
}

/* Optional: reduce underline in menus/buttons coming from themes/plugins */
.menu a,
.button a,
.wp-block-button__link {
  text-decoration: none !important;
}

/* Reset default paragraph margins to avoid unexpected gaps */
p {
  margin: 0 !important;
}

/* Footer lists: remove bullets and use muted inline-style links */
footer .text-sm ul,
footer .text-sm ol {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

footer .text-sm li {
  margin: 0.65rem 0 !important; /* spacing similar to mock */
}

footer .text-sm a {
  color: #6b7280 !important; /* slate-500-ish */
  text-decoration: none !important;
}

footer .text-sm a:hover,
footer .text-sm a:focus {
  color: #0f172a !important; /* slate-900-ish on hover */
  text-decoration: none !important;
}

/* ============================ */
/* Footer (custom classes)       */
/* ============================ */
.site-footer {
  background: #f1f5f9; /* slate-100 */
  color: #1f2937;      /* slate-800 */
}
.footer-inner {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-top: 36px;
  padding-bottom: 36px;
  /* Match global container side gutters: container pad + 16px */
  padding-left: calc(var(--container-pad-x) + 16px);
  padding-right: calc(var(--container-pad-x) + 16px);
}
/* Tailwind container max-widths */
@media (min-width: 640px) { .footer-inner { max-width: 640px; } }
@media (min-width: 768px) { .footer-inner { max-width: 768px; } }
@media (min-width: 1024px) { .footer-inner { max-width: 1024px; } }
@media (min-width: 1280px) { .footer-inner { max-width: 1280px; } }
@media (min-width: 1536px) { .footer-inner { max-width: 1536px; } }
.footer-top {
  display: flex;
  flex-direction: row;
  gap: 24px;
}
.footer-brand {
  display: flex;
  gap: 24px;
  width: 100%;
}
.footer-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 28px; /* gap-x-7 approx */
}
.footer-grid-title { grid-column: 1 / -1; border-bottom: 1px solid #e5e7eb; /* slate-200 */ padding-bottom: 10px; }
.footer-heading { font-size: 28px; font-weight: 400; color: #318ac7; /* brand blue */ margin: 0; padding-bottom: 0; }
.footer-section { font-size: 15px; }
.footer-section-title { margin: 0 0 10px 0; font-size: 18px; font-weight: 500; color: #2b2b2b; }
.footer-address { font-style: normal; line-height: 1.6; }
.footer-links { list-style: none; padding: 0; margin: 6px 0 0 0; }
.footer-links li { margin: 12px 0; }
.footer-links a { color: #6d6c68; /* muted gray similar to ref */ text-decoration: none; font-size: 15px; line-height: 1.9; }
.footer-links a:hover, .footer-links a:focus { color: #2b2b2b; text-decoration: underline; }
.footer-social { text-align: left; }
.footer-social-icons { display: flex; gap: 12px; justify-content: flex-start; }
.footer-social-link { color: #1f2937; display: inline-flex; height: 20px; width: 20px; align-items: center; justify-content: center; }
.footer-social-link:hover { color: #0369a1; /* sky-700 */ }
.footer-divider { margin: 20px 0; border: 0; border-top: 1px solid rgba(100, 116, 139, 0.3); /* slate-300/30 */ }
.footer-bottom { display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; gap: 12px; color: #6b7280; font-size: 12px; }
.footer-bottom p { margin: 0; }

@media (min-width: 1024px) {
  .footer-bottom { flex-direction: row; }
  /* Match original: right-align social on large screens */
  .footer-social { text-align: right; }
  .footer-social-icons { justify-content: flex-end; }
}
@media (max-width: 1023.98px) {
  .footer-top { flex-direction: column; }
  .footer-brand { width: 100% !important; }
  .footer-grid { grid-template-columns: 1fr; row-gap: 22px; }
  .footer-heading { font-size: 24px; }
  .footer-section-title { font-size: 16px; font-weight: 500; }
}

/* ============================ */
/* Responsive typography tweaks  */
/* ============================ */
@media (max-width: 1023.98px) {
  /* Hero */
  .hero-title { font-size: clamp(24px, 4vw, 36px); white-space: pre-line; margin-bottom: 1rem; }
  .hero-desc { font-size: 15px; line-height: 1.7; }
  .hero-cta { font-size: 14px; }
  /* Home slider (higher specificity) */
  body.page-template-home-template-php .hero-caption .hero-kicker { font-size: 11px; letter-spacing: .18em; }
  body.page-template-home-template-php .hero-caption .hero-title { font-size: 32px; line-height: 1.15; }
  body.page-template-home-template-php .hero-caption .hero-desc { font-size: 14px; line-height: 1.7; }

  /* Tabs and section headers */
  .project-tabs .project-tabs-list { font-size: 14px; }
  .units-title, .section-kicker { font-size: 12px; }
  .block-title, .projects-section .section-kicker + h3, .services-section .footer-heading { font-size: 22px; }
  .projects-section h3 { font-size: 22px; }
  .projects-section p { font-size: 14px; }
  .section-kicker { letter-spacing: .12em; }

  /* Units list */
  .unit-name { font-size: 17px; }
  .unit-meta { font-size: 13px; }
  .unit-status { font-size: 12px; }
  .unit-price { font-size: 13px; }

  /* Units filters */
  .filter-label { font-size: 11px; }
  .chip { font-size: 13px; }

  /* Services */
  .service-title { font-size: 24px; }
  .service-description { font-size: 13px; }

  /* About */
  .about-section .about-content { min-height: auto; }
  .about-section .block-title { font-size: 24px; }
  .about-section .block-text { font-size: 15px; line-height: 1.7; }

  /* Contact */
  .contact-hero h1, .contact-hero .contact-title { font-size: 28px; }
  .contact-hero p { font-size: 14px; }
}

@media (max-width: 639.98px) {
  /* Hero */
  .hero-title { font-size: clamp(20px, 6vw, 28px); white-space: pre-line; margin-bottom: .9rem; }
  .hero-desc { font-size: 14px; }
  .hero-cta { font-size: 13px; }
  /* Home slider (higher specificity) */
  body.page-template-home-template-php .hero-caption .hero-kicker { font-size: 10px; letter-spacing: .2em; }
  body.page-template-home-template-php .hero-caption .hero-title { font-size: 26px; line-height: 1.12; }
  body.page-template-home-template-php .hero-caption .hero-desc { font-size: 13px; line-height: 1.7; }

  /* Tabs and section headers */
  .project-tabs .project-tabs-list { font-size: 13px; }
  .units-title, .section-kicker { font-size: 11px; }
  .block-title, .projects-section .section-kicker + h3, .services-section .footer-heading { font-size: 20px; }
  .projects-section h3 { font-size: 20px; }
  .projects-section p { font-size: 13px; }

  /* Units list */
  .unit-name { font-size: 16px; }
  .unit-meta { font-size: 12px; }
  .unit-status { font-size: 11px; }
  .unit-price { font-size: 12px; }
  /* Units filters */
  .filter-label { font-size: 10px; }
  .chip { font-size: 12px; }

  /* Services */
  .service-title { font-size: 22px; }
  .service-description { font-size: 12px; }

  /* Footer (reinforce smaller sizes) */
  .footer-heading { font-size: 22px; }
  .footer-section-title { font-size: 15px; }
  .footer-links a { font-size: 14px; }

  /* About */
  .about-section .block-title { font-size: 22px; }
  .about-section .block-text { font-size: 14px; }

  /* Contact */
  .contact-hero h1, .contact-hero .contact-title { font-size: 24px; }
  .contact-hero p { font-size: 13px; }
}

/* Footer responsive layout */
@media (max-width: 1023.98px) {
  /* Stack brand + links grid */
  footer .container > .flex.flex-row {
    flex-direction: column;
    gap: 24px;
  }
  /* Brand block width reset */
  footer .container > .flex.flex-row > div:first-child {
    width: 100% !important;
  }
  /* Make links grid single column on tablet & below */
  footer .container > .flex.flex-row > .grid {
    grid-template-columns: 1fr !important;
    row-gap: 20px;
  }
  /* Left align text blocks on mobile/tablet */
  footer .text-sm {
    text-align: left !important;
  }
}

/* Hero slider sizing */
.hero-slide {
  min-height: 70vh;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  width: 100%; /* fill the slide width */
}

/* Bottom-left caption positioning */
.hero-caption {
  position: absolute;
  left: calc(var(--container-pad-x));
  right: auto; /* anchor to left only */
  bottom: 1.5rem; /* ~24px */
  width: min(680px, calc(100% - 32px));
}
.hero-title { white-space: pre-line; margin-bottom: 1rem; }
@media (min-width: 768px) {
  .hero-caption {
    bottom: 3rem;
  }
}

/* Align hero caption with container at Tailwind breakpoints */
@media (min-width: 640px) {
  .hero-caption {
    left: calc((var(--vw) - 640px) / 2);
  }
}
@media (min-width: 768px) {
  .hero-caption {
    left: calc((var(--vw) - 768px) / 2);
  }
}
@media (min-width: 1024px) {
  .hero-caption {
    left: calc((var(--vw) - 1024px) / 2);
  }
}
@media (min-width: 1280px) {
  .hero-caption {
    left: calc((var(--vw) - 1280px) / 2);
  }
}
@media (min-width: 1536px) {
  .hero-caption {
    left: calc((var(--vw) - 1536px) / 2);
  }
}

@media (min-width: 1024px) {
  .hero-slide {
    min-height: 85vh;
  }
}

/* Layout and header overlay */
:root {
  --site-header-h: 64px;
  --vw: 100vw;
  --container-pad-x: 24px;
}
/* Use a slightly smaller header height on About template */
body.page-template-about-template-php,
body.page-template-about-template {
  --site-header-h: 56px;
}
/* Careers template: reduce header height too */
body.page-template-careers-template-php,
body.page-template-careers-template {
  --site-header-h: 56px;
}
@supports (width: 100dvw) {
  :root {
    --vw: 100dvw;
  }
}

/* Responsive container horizontal padding to align full-bleed rows */
@media (min-width: 768px) {
  :root {
    --container-pad-x: 32px;
  }
}
@media (min-width: 1024px) {
  :root {
    --container-pad-x: 40px;
  }
}

body {
  margin: 0; /* remove browser default 8px margin */
  overflow-x: hidden; /* prevent horizontal scroll */
  font-family: 'Gothic A1', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
  font-synthesis-weight: none;
  font-synthesis-style: none;
}

button, input, select, textarea {
  font-family: inherit;
}

/* Remove horizontal margins on site-main when theme uses separate containers */
.separate-containers .site-main {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* ============================ */
/* Contact page template         */
/* ============================ */
.contact-hero { background: #f7f8f9; padding: 40px 0px; }
.contact-grid { display: grid; grid-template-columns: 1fr; gap: 24px; align-items: start; }
@media (min-width: 1024px) { .contact-grid { grid-template-columns: 1fr 1fr; gap: 32px; } }
.contact-left .section-kicker { color: #0284c7; text-transform: uppercase; letter-spacing: 0.14em; font-size: 12px; margin: 0 0 12px 0; }
.contact-left .contact-lines { color: #334155; line-height: 1.9; }

.contact-right .contact-form { display: grid; grid-template-columns: 1fr; gap: 10px; }
.contact-right .form-label { color: #64748b; font-size: 12px; }
.contact-right .form-input { width: 100%; background: #f1f5f9; border: 1px solid #e5e7eb; padding: 12px; font-size: 14px; color: #0f172a; }
.contact-right .form-input:focus { outline: none; border-color: #cbd5e1; background: #eef2f7; }
.contact-right .form-submit { width: 100%; height: 42px; background: #2f6fb0; color: #fff; border: 0; cursor: pointer; }
.contact-right .form-submit:hover { background: #295f96; }

.contact-map { background: #ffffff; }
.contact-map .map-inner { padding: 0 var(--container-pad-x) 40px 0px; }
.contact-map .map-embed { width: 100%; }

/* Neutralize parent wrappers on Contact template */
.page-template-contact-template-php .content-area,
.page-template-contact-template .content-area { width: 100% !important; float: none !important; margin: 0 !important; }
.page-template-contact-template-php .inside-site-container,
.page-template-contact-template .inside-site-container,
.page-template-contact-template-php .site-content,
.page-template-contact-template .site-content { display: block !important; grid-template-columns: none !important; padding-left: 0 !important; padding-right: 0 !important; }
.page-template-contact-template-php .grid-container,
.page-template-contact-template .grid-container { max-width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; }
.page-template-contact-template-php .site.grid-container,
.page-template-contact-template .site.grid-container,
.page-template-contact-template-php #page.grid-container,
.page-template-contact-template #page.grid-container { max-width: none !important; width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; }

html,
body {
  width: 100%;
}

/* Prevent padding/borders from expanding widths unexpectedly */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Add top padding for pages to avoid content under fixed header (except Home template) */
body:not(.page-template-home-template-php) {
  padding-top: var(--site-header-h);
}

.site-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  background: transparent; /* fully transparent on top */
  box-shadow: none; /* no shadow until scrolled */
  backdrop-filter: none; /* no blur until scrolled */
  transition: background 0.25s ease, color 0.25s ease,
    backdrop-filter 0.25s ease, box-shadow 0.25s ease;
}
.site-header .site-logo svg path {
  transition: fill 0.25s ease;
}
.site-header nav a,
.site-header nav a:link,
.site-header nav a:visited {
  color: #ffffff !important;
  transition: color 0.25s ease;
}
.site-header nav a:hover {
  color: #e6f1ff !important;
}
.site-header .site-search-icon {
  color: #ffffff;
  transition: color 0.25s ease;
}

/* Non-Home (except single Project): header is white at all times */
body:not(.page-template-home-template-php):not(.single-project) .site-header {
  background: #ffffff;
  backdrop-filter: blur(6px);
  border-bottom: 1px solid #e5e7eb;
}
body:not(.page-template-home-template-php):not(.single-project)
  .site-header
  nav
  a,
body:not(.page-template-home-template-php):not(.single-project)
  .site-header
  nav
  a:link,
body:not(.page-template-home-template-php):not(.single-project)
  .site-header
  nav
  a:visited {
  color: #0f172a !important;
}
body:not(.page-template-home-template-php):not(.single-project)
  .site-header
  nav
  a:hover {
  color: #0b1220 !important;
}
body:not(.page-template-home-template-php):not(.single-project)
  .site-header
  .site-logo
  svg
  path {
  fill: #318ac7;
}
body:not(.page-template-home-template-php):not(.single-project)
  .site-header
  .site-search-icon {
  color: #0f172a;
}

.site-header.is-scrolled {
  background: #ffffff;
  backdrop-filter: blur(6px);
  border-bottom: 1px solid #e5e7eb;
}
.site-header.is-scrolled nav {
  color: #0f172a !important;
}
.site-header.is-scrolled nav a,
.site-header.is-scrolled nav a:link,
.site-header.is-scrolled nav a:visited {
  color: #0f172a !important;
}
.site-header.is-scrolled nav a:hover {
  color: #0b1220 !important;
}
.site-header.is-scrolled .site-logo svg path {
  fill: #318ac7;
}
.site-header.is-scrolled .site-search-icon {
  color: #0f172a;
}

/* Primary Menu (wp_nav_menu output) – match hardcoded header nav */
.primary-nav .menu {
  display: flex;
  align-items: center;
  column-gap: 2.5rem; /* bumped spacing */
  list-style: none;
  margin: 0;
  padding: 0;
}
.primary-nav .menu > li { margin: 0; padding: 0; }
.primary-nav .menu > li > a {
  text-decoration: none;
  font-size: 0.875rem; /* text-sm */
  font-weight: 500;     /* font-medium */
  text-transform: capitalize;
  letter-spacing: 0.04em;
}
.primary-nav .menu > li > a:hover,
.primary-nav .menu > li > a:focus {
  text-decoration: underline;
}
.primary-nav .menu > li.current-menu-item > a,
.primary-nav .menu > li.current_page_item > a,
.primary-nav .menu > li.current-menu-ancestor > a {
  color: #318ac7 !important; /* brand blue for active */
}

/* ============================ */
/* About section scoping fixes   */
/* ============================ */
/* Ensure the full-bleed, viewport-height behavior applies only on the dedicated About template */
body.page-template-about-template-php .about-section {
  min-height: 85vh;
  width: var(--vw);
}
/* On Home, keep normal flow and container widths */
body.page-template-home-template-php .about-section {
  min-height: auto;
  width: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}
/* Stack content vertically on Home: Kicker → Title → Stats → Desc */
body.page-template-home-template-php .about-section .about-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
}
body.page-template-home-template-php .about-section .about-title { margin-bottom: 12px; }
body.page-template-home-template-php .about-section .about-stats { margin-bottom: 28px; }

/* Home About banner: dark overlay + light typography/dividers */
body.page-template-home-template-php .about-section::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.25) 0%,
    rgba(0, 0, 0, 0.45) 50%,
    rgba(0, 0, 0, 0.6) 100%
  );
  pointer-events: none;
}
body.page-template-home-template-php .about-section .about-stat {
  border-left: 1px solid rgba(255, 255, 255, 0.5);
}
body.page-template-home-template-php .about-section .about-stat-value {
  color: #ffffff;
}
body.page-template-home-template-php .about-section .about-stat-label {
  color: rgba(255, 255, 255, 0.9);
}
body.page-template-home-template-php .about-section .about-desc {
  color: rgba(255, 255, 255, 0.9);
}
/* Ensure Home About banner title is white */
body.page-template-home-template-php .about-section .about-title {
  color: #ffffff !important;
}

/* About: Values container and title width */
body.page-template-about-template-php #values.about-values {
  padding-left: 0px;
  padding-right: 0px;
}
body.page-template-about-template-php #values.about-values .values-title {
  max-width: 18ch; /* keep title to a tight measure */
}

/* ============================ */
/* Header style on Projects page */
/* ============================ */
.page-template-projects-template-php .site-header {
  background: #ffffff;
  backdrop-filter: blur(6px);
}
.page-template-projects-template-php .site-header nav a,
.page-template-projects-template-php .site-header nav a:link,
.page-template-projects-template-php .site-header nav a:visited {
  color: #0f172a !important;
}
.page-template-projects-template-php .site-header nav a:hover {
  color: #0b1220 !important;
}
.page-template-projects-template-php .site-header .site-logo svg path {
  fill: #318ac7;
}
.page-template-projects-template-php .site-header .site-search-icon {
  color: #0f172a;
}

/* Remove theme default side padding so our .projects-container defines alignment */
.page-template-projects-template-php .site-content {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Remove theme default side padding so our container aligns on archive too */
.post-type-archive-project .site-content {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* ============================ */
/* Career Archive: remove theme wrappers */
/* ============================ */
.post-type-archive-career .content-area {
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
}
.post-type-archive-career .inside-site-container,
.post-type-archive-career .grid-container,
.post-type-archive-career .site-content {
  display: block !important;
  grid-template-columns: none !important;
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.post-type-archive-career #page.grid-container,
.post-type-archive-career .grid-container,
.post-type-archive-career .inside-article,
.post-type-archive-career .content-area,
.post-type-archive-career .inside-site-container,
.post-type-archive-career .site-main,
.post-type-archive-career .entry-content,
.post-type-archive-career .site,
.post-type-archive-career #content {
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
/* Also clear outer margins so our inner container centers with mx-auto */
.post-type-archive-career .site-content,
.post-type-archive-career .content-area,
.post-type-archive-career .site,
.post-type-archive-career #page.grid-container {
  margin-left: 0 !important;
  margin-right: 0 !important;
}
/* Some themes scope with hfeed; ensure no side padding/margins remain */
body.post-type-archive-career.hfeed .site,
body.post-type-archive-career.hfeed .grid-container,
body.post-type-archive-career.hfeed .inside-site-container,
body.post-type-archive-career.hfeed .site-content {
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Make Projects template content not use theme grid wrappers */
.page-template-projects-template-php .content-area {
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
}
.page-template-projects-template-php .inside-site-container,
.page-template-projects-template-php .site-content {
  display: block !important;
  grid-template-columns: none !important;
}

/* ============================ */
/* Single Project flexible blocks */
/* ============================ */
.project-section {
  padding: 0px;
  margin-bottom: 0px !important;
}
.project-block {
  margin: 0 auto 0px auto;
}
.project-block img {
  display: block;
  width: 100%;
  height: auto;
}

/* Text block: two columns (big title + body) */
.block--text {
  padding: 40px 0;
}
.block--text .block-kicker-img {
  width: 80px;
  height: 40px;
  object-fit: contain;
  display: block;
  margin-bottom: 16px;
}
.block--text .block-kicker {
  color: #0284c7;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-size: 12px;
  margin-bottom: 16px;
}
.block--text .block-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 28px;
}
@media (min-width: 1024px) {
  .block--text .block-row {
    grid-template-columns: 1.2fr 1fr;
  }
}
.block--text .block-title {
  font-size: clamp(32px, 5vw, 56px);
  line-height: 1.05;
  font-weight: 400;
  margin: 0;
  white-space: pre-line;
  color: #0f172a;
  max-width: 16ch; /* constrain title line length */
}
.block--text .block-text {
  color: #475569;
  font-size: 16px;
  line-height: 1.8;
  max-width: 560px; /* limit paragraph width */
}

/* Full image block */
.block--image-full img {
  width: 100%;
  margin: 0;
  height: 640px;
  object-fit: cover;
}

/* Image + Text split */
.block--image-text .block-row {
  display: grid;
  grid-template-columns: 1fr;
  align-items: center;
}
/* Ensure a consistent image height in split blocks */
.block--image-text .block-col--image img {
  width: 100%;
  height: 560px;
  object-fit: cover;
  display: block;
}

/* Section containers: add 16px side padding without affecting other paddings */
:where(
  /* Single Project */
  .hero-caption-inner.container.mx-auto,
  .project-tabs-inner.container.mx-auto,
  .units-availability.container.mx-auto,
  /* Home sections - container on the same element */
  .services-section.container.mx-auto,
  .projects-section.container.mx-auto,
  /* Fallback: descendant containers inside sections (other pages) */
  .services-section .container.mx-auto,
  .projects-section .container.mx-auto,
  .about-section .container.mx-auto,
  .contact-hero .container.mx-auto
) {
  padding-inline: 16px !important;
}

/* Apply the same side padding to any container.mx-auto site-wide (all templates) */
:where(.container.mx-auto) {
  padding-inline: 16px !important;
}
@media (min-width: 1024px) {
  .block--image-text .block-row {
    grid-template-columns: 1fr 1fr;
  }
}
.block--image-text .block-row.text-first .block-col--text {
  order: 1;
  padding: 80px;
  background-color: #fff !important;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
@media (max-width: 1024px) {
	.block--image-text .block-row.text-first .block-col--text {
		padding: 40px 24px;
	}
	.footer-inner {
		padding-left: 16px;
    	padding-right: 16px;
	}
}

button#mobile-menu-toggle {
    display: none;
    background: none;
    height: 20px;
    padding: 0px 12px;
    width: 44px;
}
/* Fade-in animation */
@keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

.mobile-menu-fade {
  animation: fadeIn 0.3s ease forwards;
}
nav#mobile-menu {
    background: #fff2;
    backdrop-filter: blur(10px);
    padding: 80px 0 8px;
    margin-top: -56.95px;
}
nav#mobile-menu ul {
    list-style-type: none;
    margin: 0px;
    padding: 0 20px 16px;
}
nav#mobile-menu ul a {
    color: #fff !important;
    line-height: 36px;
}

.mobile-menu {
  opacity: 0;
  transition: opacity 0.3s ease;
  display: none; /* start hidden */
}

.mobile-menu.show {
  display: block; /* show in DOM */
  opacity: 1;     /* fade in */
}

.mobile-menu.hide {
  opacity: 0;     /* fade out */
}
.site-header.is-scrolled button#mobile-menu-toggle path {
    stroke: #0f172a;
}
.site-header.is-scrolled nav#mobile-menu ul a {
	color: #0f172a !important;
}
@media (max-width: 768px) {
	.header-row {
		 z-index: 01;
    	position: relative;
	}
	svg.site-search-icon {
    	margin-right: 4px;
	}
	button#mobile-menu-toggle {
		display: flex;
	}
}
.block--image-text .block-row.text-first .block-col--image {
  order: 2;
}
.block--image-text .block-row.image-first .block-col--image {
  order: 1;
}
.block--image-text .block-row.image-first .block-col--text {
  order: 2;
  padding: 40px;
  background-color: #f7f8f9;
}
.block--image-text .block-kicker {
  color: #0284c7;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-size: 16px;
  margin-bottom: 12px;
}
.block--image-text .block-title {
  font-size: clamp(28px, 3.6vw, 40px);
  line-height: 1.1;
  font-weight: 400;
  margin: 0 0 10px 0;
  color: #0f172a;
  white-space: pre-line;
}
.block--image-text .block-text {
  color: #475569;
  font-size: 15px;
  line-height: 1.8;
  max-width: 560px; /* limit paragraph width */
}

/* Image with text above (stacked) */
.block--image-with-text-top .block-row {
  display: block;
}
.block--image-with-text-top .block-col--text-top {
  max-width: 720px;
  padding: 0 var(--container-pad-x);
  margin: 0 auto 14px auto;
}
.block--image-with-text-top .block-title {
  font-size: clamp(28px, 3.6vw, 40px);
  line-height: 1.1;
  font-weight: 400;
  margin: 0 0 8px 0;
  color: #0f172a;
}
.block--image-with-text-top .block-text {
  color: #475569;
  font-size: 15px;
  line-height: 1.8;
}
/* Overlay variant: image with text on top */
.block--image-with-text-top .ivt-figure {
  position: relative;
}
.block--image-with-text-top .ivt-image {
  width: 100%;
  margin: 0;
  height: 640px; /* same as image_full */
  object-fit: cover;
  display: block;
}
.block--image-with-text-top .ivt-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.3) 0%,
    rgba(0, 0, 0, 0.4) 35%,
    rgba(0, 0, 0, 0.55) 100%
  );
  pointer-events: none;
}
.block--image-with-text-top .ivt-caption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  color: #fff;
  padding: 24px var(--container-pad-x) 28px var(--container-pad-x);
  display: flex;
  flex-direction: column;
  align-items: flex-end; /* push content to the right */
  text-align: right; /* align text to the right */
}
.block--image-with-text-top .ivt-title {
  margin: 0 0 8px 0;
  font-size: clamp(28px, 3.6vw, 40px);
  line-height: 1.1;
  font-weight: 400;
}
.block--image-with-text-top .ivt-text {
  max-width: 560px;
  font-size: 15px;
  line-height: 1.8;
  color: rgba(255, 255, 255, 0.9);
}
/* ============================ */
/* Single Project: Units listing */
/* ============================ */
.units-availability {
  /* padding: 40px var(--container-pad-x) 80px var(--container-pad-x); */
  background: #f7f8f9;
}
.units-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
}
@media (min-width: 1024px) {
  .units-grid { grid-template-columns: 380px 1fr; gap: 32px; }
}

/* Left filter panel */
.units-filter { background: #f7f8f9; border-right: 1px solid #e5e7eb; padding-right: 24px; padding-top: 40px; }
.units-title { color: #318ac7; font-weight: 600; letter-spacing: .06em; margin: 0 0 22px 0; }
.filter-group { margin: 18px 0 22px 0; }
.filter-label { color: #64748b; font-size: 12px; text-transform: uppercase; letter-spacing: .12em; margin: 0 0 12px 0 !important; }
.filter-sep { border: 0; height: 1px; background: #e5e7eb; margin: 14px 0; }
.filter-chips { display: flex; flex-wrap: wrap; gap: 10px; }
.filter-chips--grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 10px; }
.chip { background: #f5f7fa; border: 1px solid #e5e7eb; color: #475569; padding: 8px 12px; font-size: 14px; cursor: pointer; }
.chip.is-active { background: #b8b8b8; color: #fff; border-color: #b8b8b8; }

/* Range UI (visual only for now) */
.range-ui { padding-top: 8px; }
.range-track { position: relative; height: 4px; background: #e5e7eb; margin: 16px 0; }
.range-handle { position: absolute; top: 50%; transform: translate(-50%, -50%); width: 16px; height: 16px; border: 2px solid #2f6fb0; background: #fff; }
.range-minmax { display: flex; justify-content: space-between; color: #6b7280; font-size: 12px; }

.btn-filter { display: inline-flex; align-items: center; justify-content: center; height: 40px; padding: 0 16px; background: #2f6fb0; color: #fff; border: 0; cursor: pointer; }
.btn-filter:hover { background: #295f96; }

/* Right list */
.units-list { border-top: 1px solid #e5e7eb; background: #f7f8f9; }
.unit-items { list-style: none; margin: 0; padding: 0; }
.unit-row { display: grid; grid-template-columns: 1fr; gap: 12px; padding: 22px 16px; border-bottom: 1px solid #eaecef; background: #f7f8f9; }
@media (min-width: 768px) { .unit-row { grid-template-columns: 1fr auto; align-items: center; } }
.unit-row:hover { background: #fafafa; }
.unit-name { font-size: 19px; color: #0f172a; margin: 0 0 6px 0; font-weight: 500; }
.unit-meta { display: flex; align-items: center; gap: 10px; color: #64748b; font-size: 14px; }
.unit-meta .meta-item { display: inline-flex; align-items: center; gap: 6px; color: #318ac7; }
.unit-meta .dot { color: #cbd5e1; }
.unit-aside { display: flex; flex-direction: column; gap: 6px; align-items: flex-end; text-align: right; }
.unit-status { color: #10b981; font-weight: 600; font-size: 13px; text-transform: uppercase; }
.unit-price { color: #9aa0a6; font-size: 14px; white-space: nowrap; }

/* Closed status in red */
.unit-status.is-closed { color: #ef4444; }

/* Floors line under meta */
.unit-floors {
  color: #9aa0a6; /* same gray as price */
  font-size: 12px; /* smaller */
  margin-top: 6px;
}

/* Overall full-bleed image at the end */
.block--image-overall {
  margin: 0;
}
.block--image-overall img {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  display: block;
}

/* Tabs bar below hero */
.project-tabs {
  position: sticky; /* stays at top when scrolling content */
  top: calc(var(--site-header-h) - 12px);
  z-index: 40;
  background: #fff;
  border-bottom: 1px solid #e5e7eb;
}
.project-tabs-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.project-tabs-list {
  list-style: none;
  display: flex;
  gap: 22px;
  margin: 0;
  padding: 0;
}
.project-tabs-list .tab-item a {
  display: inline-flex;
  align-items: center;
  height: 64px;
  padding: 0 10px;
  color: #475569; /* slate-600 */
  text-decoration: none;
  border-bottom: 2px solid transparent;
  transition: color 0.2s ease, border-color 0.2s ease;
}
.project-tabs-list .tab-item a:hover {
  color: #0f172a;
}
.project-tabs-list .tab-item.is-active a {
  color: #0f172a;
  border-bottom-color: #318ac7; /* brand blue underline */
}
.project-tabs-cta .tabs-cta-link {
  color: #0f172a;
  text-decoration: none;
  font-weight: 600;
}
.project-tabs-cta .tabs-cta-link:hover {
  text-decoration: underline;
}
.page-template-projects-template-php .widget-area,
.page-template-projects-template-php .sidebar,
.page-template-projects-template-php .secondary-navigation {
  display: none !important;
  width: 0 !important;
}

/* ============================ */
/* Archive: remove theme wrappers */
/* ============================ */
.post-type-archive-project .content-area {
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
}
.post-type-archive-project .inside-site-container,
.post-type-archive-project .grid-container,
.post-type-archive-project .site-content {
  display: block !important;
  grid-template-columns: none !important;
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.post-type-archive-project .widget-area,
.post-type-archive-project .sidebar,
.post-type-archive-project .secondary-navigation {
  display: none !important;
  width: 0 !important;
}

/* Remove GeneratePress outer container widths on Projects template */
.page-template-projects-template-php #page.grid-container,
.page-template-projects-template-php .grid-container,
.page-template-projects-template-php .inside-article,
.page-template-projects-template-php .content-area,
.page-template-projects-template-php .inside-site-container,
.page-template-projects-template-php .site-main,
.page-template-projects-template-php .entry-content,
.page-template-projects-template-php .site,
.page-template-projects-template-php #content {
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Full-bleed hero on Home template: remove theme padding and stretch to viewport */
.page-template-home-template-php .site-content {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.page-template-home-template-php #primary.site-main {
  margin: 0 !important;
}

.page-template-home-template-php .grid-container,
.page-template-home-template-php .generate-columns-container,
.page-template-home-template-php .inside-article,
.page-template-home-template-php .content-area,
.page-template-home-template-php .inside-site-container,
.page-template-home-template-php .site-main,
.page-template-home-template-php .entry-content,
.page-template-home-template-php .site,
.page-template-home-template-php #content {
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* GeneratePress layout adjustments: make content 100% width and remove sidebars on Home template */
.page-template-home-template-php .content-area {
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
}
.page-template-home-template-php.right-sidebar .content-area,
.page-template-home-template-php.left-sidebar .content-area {
  width: 100% !important;
}
.page-template-home-template-php .widget-area,
.page-template-home-template-php .sidebar,
.page-template-home-template-php .secondary-navigation {
  display: none !important;
  width: 0 !important;
}
.page-template-home-template-php .site-content,
.page-template-home-template-php .inside-site-container {
  display: block !important;
  grid-template-columns: none !important;
}

/* Remove max-width/padding of top-level page wrapper on Home template */
.page-template-home-template-php #page.grid-container {
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.page-template-home-template-php .hero-section {
  width: var(--vw);
  /* center a full-viewport-width element regardless of scrollbar */
  margin-left: 0;
  margin-right: 0;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  overflow: hidden;
}

/* Ensure each slide spans viewport width */
.hero-swiper .swiper-slide {
  width: var(--vw) !important;
}

/* Ensure containers don't introduce padding/gaps */
.hero-section .hero-swiper,
.hero-section .hero-swiper .swiper-wrapper {
  width: var(--vw);
  max-width: var(--vw);
  margin: 0;
  padding: 0;
}

/* Hero Typography */
.hero-title {
  font-weight: 400; /* medium */
  line-height: 1.05;
  letter-spacing: 0;
  font-size: 72px;
  text-shadow: none; /* flat */
}

.hero-desc {
  font-size: 18px;
  line-height: 1.6;
  text-shadow: none;
}

.hero-kicker {
  font-size: 16px;
}

/* Position navigation at bottom-right */
.hero-section .swiper-button-next,
.hero-section .swiper-button-prev {
  position: absolute;
  bottom: 20px;
  top: auto;
  transform: none;
  width: 42px;
  height: 42px;
  border-radius: 9999px;
  background: rgba(0, 0, 0, 0.35);
  color: #fff;
}
.hero-section .swiper-button-prev {
  right: 76px;
  left: auto;
}
.hero-section .swiper-button-next {
  right: 20px;
  left: auto;
}
.hero-section .swiper-button-next:after,
.hero-section .swiper-button-prev:after {
  font-size: 18px;
}

/* Optional: pagination to bottom-left */
.hero-section .swiper-pagination {
  left: 20px;
  right: auto;
  bottom: 24px;
}

/* As a last resort, pull outer wrappers to full-bleed on Home template */
.page-template-home-template-php #page,
.page-template-home-template-php .site,
.page-template-home-template-php .inside-site-container,
.page-template-home-template-php .site-content {
  width: 100%;
}

/* ============================ */
/* Our Projects section styles   */
/* ============================ */
.projects-title {
  font-size: clamp(2rem, 4vw, 3.25rem);
  font-weight: 400;
  line-height: 1.15;
  color: #0f172a; /* slate-900 */
}

/* Spacing for Projects section header */
.projects-section .section-kicker {
  margin-bottom: 80px !important;
}
.projects-section .projects-title {
  margin-bottom: 40px !important;
}

.projects-grid .project-card {
  background: transparent;
}

/* Horizontal scroller layout */
.horizontal-scroller {
  display: flex;
  gap: 24px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  padding: 0 12px 8px 12px; /* small side padding to avoid clip */
  scroll-padding-left: 12px;
  scroll-padding-right: 12px;
  /* Hide scrollbar across browsers */
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* IE/Edge legacy */
}
.horizontal-scroller::-webkit-scrollbar {
  display: none;
} /* WebKit */

/* End gutter so last card isn't clipped */
.horizontal-scroller::after {
  content: "";
  flex: 0 0 12px;
}

/* Ensure the projects section doesn't clip children */
.projects-section {
  overflow: visible;
  padding: 40px 0px !important;
}

/* Full-bleed scroller inside container: stretch to viewport edges */
.projects-section .horizontal-scroller {
  width: var(--vw);
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding-left: 32px;
  scroll-padding-left: 32px;
}
/* Tailwind container widths: 640, 768, 1024, 1280, 1536 */
@media (min-width: 640px) {
  .projects-section .horizontal-scroller {
    padding-left: calc((var(--vw) - 640px) / 2 + 16px);
    scroll-padding-left: calc((var(--vw) - 640px) / 2 + 16px);
  }
}
@media (min-width: 768px) {
  .projects-section .horizontal-scroller {
    padding-left: calc((var(--vw) - 768px) / 2 + 16px);
    scroll-padding-left: calc((var(--vw) - 768px) / 2 + 16px);
  }
}
@media (min-width: 1024px) {
  .projects-section .horizontal-scroller {
    padding-left: calc((var(--vw) - 1024px) / 2 + 16px);
    scroll-padding-left: calc((var(--vw) - 1024px) / 2 + 16px);
  }
}
@media (min-width: 1280px) {
  .projects-section .horizontal-scroller {
    padding-left: calc((var(--vw) - 1280px) / 2 + 16px);
    scroll-padding-left: calc((var(--vw) - 1280px) / 2 + 16px);
  }
}
@media (min-width: 1536px) {
  .projects-section .horizontal-scroller {
    padding-left: calc((var(--vw) - 1536px) / 2 + 16px);
    scroll-padding-left: calc((var(--vw) - 1536px) / 2 + 16px);
  }
}

.project-card .card-media {
  position: relative;
  overflow: hidden;
  border: 1px solid #e5e7eb; /* slate-200 */
}
.horizontal-scroller .project-card {
  flex: 0 0 auto;
  width: 360px; /* card width */
  scroll-snap-align: start;
}
@media (min-width: 1024px) {
  .horizontal-scroller .project-card {
    width: 420px;
  }
  .three-column-scroller.horizontal-scroller .project-card {
	width: 480px;
  }
}
.project-card .card-media img {
  display: block;
  width: 100%;
  height: 340px;
  object-fit: cover;
  transform: scale(1);
  transition: transform 0.5s ease;
}
.project-card:hover .card-media img {
  transform: scale(1.05);
}

.project-card .badges {
  position: absolute;
  top: 14px;
  right: 14px;
  display: flex;
  gap: 8px;
  z-index: 2;
  transition: right 0.25s ease;
}
.project-card .badge {
  display: inline-block;
  padding: 7px 14px; /* a touch taller/wider like reference */
  font-size: 12px;
  line-height: 1;
  color: #ffffff;
  /* frosted bluish glass */
  background: linear-gradient(
    180deg,
    rgba(72, 101, 129, 0.34),
    rgba(72, 101, 129, 0.46)
  );
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-shadow: 0 0 1px rgba(255, 255, 255, 0.35);
}

.project-card .card-arrow {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 56px; /* right panel width */
  height: 56px; /* right panel width */
  display: flex;
  align-items: center;
  justify-content: center;
  background: #ffffff;
  color: #0f172a;
  z-index: 3;
  opacity: 0;
  transform: translateX(100%);
  transition: opacity 0.25s ease, transform 0.25s ease;
}
.project-card:hover .card-arrow {
  opacity: 1;
  transform: translateX(0);
}
/* When arrow panel is visible, nudge badges left to clear the panel */
.project-card:hover .badges {
  right: 66px;
}

/* Title turns blue on card hover (Projects & Home templates) */
.page-template-projects-template-php .project-card:hover .card-title a,
.page-template-home-template-php .project-card:hover .card-title a {
  color: #0284c7 !important;
}

.project-card .card-body {
  padding: 14px 6px 0 6px;
}
.project-card .card-title {
  margin: 0 0 8px 0;
  font-size: 20px;
  font-weight: 600;
  color: #0f172a;
}
.project-card .card-title a {
  color: #0f172a;
  text-decoration: none;
  transition: color 0.2s ease;
}
.project-card .card-title a:hover {
  color: #0284c7 !important;
}
.project-card .card-year {
  font-weight: 400;
  color: #94a3b8; /* slate-400 */
  margin-left: 8px;
}
.project-card .card-excerpt {
  color: #6b7280; /* slate-500 */
  font-size: 15px;
  line-height: 1.65;
  margin-top: 8px !important;
}

@media (min-width: 1024px) {
  .project-card .card-media img {
    height: 360px;
  }
}

/* ============================ */
/* Our Services section styles   */
/* ============================ */
.services-section .section-kicker {
  position: sticky;
  top: var(--site-header-h);
  z-index: 30;
  padding-top: 12px;
  padding-bottom: 12px;
  margin-bottom: 80px !important;
}

/* Grid spacing similar to reference */
.services-grid {
  display: grid; /* ensure grid regardless of utility classes */
  grid-template-columns: 1fr; /* 1 column by default */
  row-gap: 32px;
  align-items: start;
}

@media (min-width: 768px) {
  .services-grid {
    grid-template-columns: 1fr 1fr;
  } /* 2 columns on md+ */
}
/* Force single column under 1024 even if md rules apply */
@media (max-width: 1023.98px) {
  .services-grid {
    grid-template-columns: 1fr !important;
  }
}

.title-and-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}

.title-and-toolbar .projects-toolbar {
    margin-bottom: 40px !important;
}
@media (max-width: 1023.98px) {
  .title-and-toolbar {
    flex-direction: column;
    align-items: baseline;
  }
  .title-and-toolbar h1.projects-title {
	margin-bottom: 12px !important;
  }
	
}
/* Each service produces two cells (image + text) */
/* Two cards per row: each card is a flex row (image + text) */
.service-card {
  display: flex;
  gap: 24px;
  align-items: flex-start;
  padding-top: 16px; /* vertical rhythm between rows */
  padding-bottom: 16px;
  padding-right: 48px; /* vertical rhythm between rows */
  border-top: 1px solid #e5e7eb; /* row divider inside each column */
  position: sticky; /* stacked scroll behavior */
  top: calc(
    var(--site-header-h) + var(--services-kicker-h, 56px) +
      var(--stick-offset, 0px)
  );
  background: #f7f8f9; /* overlap looks clean */
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}
@media (min-width: 768px) {
  .services-grid > .service-card:nth-child(-n + 2) {
    border-top: 0;
  }
}
@media (max-width: 767.98px) {
  .services-grid > .service-card:first-child {
    border-top: 0;
  }
  .three-column-scroller.horizontal-scroller .project-card {
	width: 480px;
  }
}

.service-image {
  width: 260px;
  height: 160px;
  overflow: hidden;
  flex-shrink: 0;
}
@media (min-width: 1024px) {
  .service-image {
    height: 180px;
    width: 300px;
  }
}
/* Between 1024px and 1279.98px: make overall card more compact */
@media (min-width: 1024px) and (max-width: 1279.98px) {
  .service-card {
    gap: 20px;
    padding-right: 32px;
  }
  .service-image {
    width: 260px;
    height: 156px;
  }
  .service-title {
    font-size: 26px;
  }
}
@media (max-width: 767.98px) {
  .service-image {
    height: 140px;
    width: 180px;
  }
}

.service-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Scale down cards slightly on xl (>=1280px) for better breathing room */
@media (min-width: 1280px) {
  .service-card {
    gap: 20px;
    padding-right: 36px;
  }
  .service-image {
    width: 280px;
    height: 168px; /* keep ~16:9 */
  }
  .service-title {
    font-size: 28px;
  }
}

.service-content {
  flex: 1;
}

.service-title {
  font-size: 32px;
  font-weight: 400;
  padding-top: 4px;
  color: #0f172a;
  margin: 0 0 8px 0;
}

.service-description {
  font-size: 14px;
  line-height: 1.6;
  color: #6b7280;
  margin: 0;
}

/* Subtle emphasis when a card is stuck at the top */
.service-card.is-stuck {
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  transform: translateY(-1px);
}

/* Below 1024px: simplify stacking so it feels natural in a single column */
@media (max-width: 1023.98px) {
  .service-card {
    position: static;
    top: auto;
    background: transparent;
    padding-right: 16px;
  }
  .service-image {
    width: 220px;
    height: 140px;
  }
  .service-title {
    font-size: 24px;
  }
}

/* Mobile: stack service card (image top, description below) */
@media (max-width: 767.98px) {
  .service-card {
    flex-direction: column;
    align-items: stretch;
    gap: 14px;
    padding-right: 16px;
  }
  .service-image {
    width: 100%;
    height: auto;
  }
  .service-image img {
    width: 100%;
    height: auto;
    display: block;
  }
}

/* Layering order so newer cards appear above older ones */
.services-grid > .service-card {
  z-index: 1;
}
.services-grid > .service-card:nth-child(1) {
  z-index: 2;
}
.services-grid > .service-card:nth-child(2) {
  z-index: 3;
}
.services-grid > .service-card:nth-child(3) {
  z-index: 4;
}
.services-grid > .service-card:nth-child(4) {
  z-index: 5;
}
.services-grid > .service-card:nth-child(5) {
  z-index: 6;
}
.services-grid > .service-card:nth-child(6) {
  z-index: 7;
}
.services-grid > .service-card:nth-child(7) {
  z-index: 8;
}
.services-grid > .service-card:nth-child(8) {
  z-index: 9;
}
.services-grid > .service-card:nth-child(9) {
  z-index: 10;
}
.services-grid > .service-card:nth-child(10) {
  z-index: 11;
}
.services-grid > .service-card:nth-child(11) {
  z-index: 12;
}
.services-grid > .service-card:nth-child(12) {
  z-index: 13;
}

/* Incremental sticky offsets per card to create the stack */
.services-grid > .service-card:nth-child(1) {
  --stick-offset: 0px;
}
.services-grid > .service-card:nth-child(2) {
  --stick-offset: 0px;
}
.services-grid > .service-card:nth-child(3) {
  --stick-offset: 70px;
}
.services-grid > .service-card:nth-child(4) {
  --stick-offset: 70px;
}
.services-grid > .service-card:nth-child(5) {
  --stick-offset: 140px;
}
.services-grid > .service-card:nth-child(6) {
  --stick-offset: 140px;
}
.services-grid > .service-card:nth-child(7) {
  --stick-offset: 210px;
}
.services-grid > .service-card:nth-child(8) {
  --stick-offset: 210px;
}
.services-grid > .service-card:nth-child(9) {
  --stick-offset: 280px;
}
.services-grid > .service-card:nth-child(10) {
  --stick-offset: 280px;
}
.services-grid > .service-card:nth-child(11) {
  --stick-offset: 350px;
}
.services-grid > .service-card:nth-child(12) {
  --stick-offset: 350px;
}

/* Tune sticky top on small screens (leave a bit more room under header) */
@media (max-width: 767.98px) {
  :root {
    --services-kicker-h: 56px;
  }
}
/* ============================ */
/* About section banner styles   */
/* ============================ */
.about-section {
  position: relative;
  min-height: 85vh;
  width: var(--vw);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  margin-left: calc(50% - 50vw); /* full-bleed */
  margin-right: calc(50% - 50vw);
  background-size: var(--about-zoom, 100%); /* driven by JS */
  background-position: center;
  color: #fff;
  overflow: hidden;
  will-change: background-size, filter;
  transition: background-size 0.4s ease;
}


/* When scrolled into view, gently zoom the background */
/* is-inview no longer required but harmless if present */
.about-section .about-content {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  min-height: 85vh;
}

/* Manual equivalents for container mx-auto px-6 py-16 */
.about-section .about-content {
  width: 100%;
  margin-left: auto; /* mx-auto */
  margin-right: auto; /* mx-auto */
  padding-top: 64px; /* py-16 */
  padding-bottom: 64px; /* py-16 */
}
/* Tailwind container max-widths */
@media (min-width: 640px) {
  .about-section .about-content {
    max-width: 640px;
  }
}
@media (min-width: 768px) {
  .about-section .about-content {
    max-width: 768px;
  }
}
@media (min-width: 1024px) {
  .about-section .about-content {
    max-width: 1024px;
    padding-top: 80px;
    padding-bottom: 80px;
  }
}
@media (min-width: 1280px) {
  .about-section .about-content {
    max-width: 1280px;
  }
}
@media (min-width: 1536px) {
  .about-section .about-content {
    max-width: 1536px;
  }
}

/* ============================ */
/* Single Project page           */
/* ============================ */
.project-single .project-hero {
  position: relative;
}
.project-single .project-hero-media {
  position: relative;
  overflow: hidden;
}
.project-single .project-hero-media img {
  width: 100%;
  height: clamp(320px, 55vw, 620px);
  object-fit: cover;
  display: block;
}
.project-single .project-hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.35) 0%,
    rgba(0, 0, 0, 0.2) 38%,
    rgba(0, 0, 0, 0.45) 100%
  );
  pointer-events: none;
}
.project-single .project-hero-badges {
  position: absolute;
  top: 18px;
  left: 18px;
  display: flex;
  gap: 10px;
  z-index: 2;
}
.project-single .project-hero-badges .badge {
  padding: 7px 14px;
  font-size: 12px;
  color: #fff;
  background: linear-gradient(
    180deg,
    rgba(72, 101, 129, 0.34),
    rgba(72, 101, 129, 0.46)
  );
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-shadow: 0 0 1px rgba(255, 255, 255, 0.35);
}

.project-single .project-hero-content {
  position: relative;
  margin-top: -84px;
  color: #0f172a;
}
.project-single .project-kicker {
  color: #0284c7;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  font-size: 13px;
  font-weight: 500;
  margin-bottom: 16px;
}
.project-single .project-title {
  font-size: clamp(2rem, 4.8vw, 56px);
  font-weight: 400;
  line-height: 1.05;
  margin-bottom: 16px;
}
.project-single .project-title .project-year {
  color: #94a3b8;
  font-size: clamp(1rem, 2.2vw, 22px);
  margin-left: 10px;
}
.project-single .project-excerpt {
  color: #334155;
  font-size: clamp(1rem, 1.3vw, 18px);
  max-width: 70ch;
}

.project-single .project-body {
  padding: 40px 0 80px 0;
}
.project-single .project-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px 24px;
  border-top: 1px solid #e5e7eb;
  border-bottom: 1px solid #e5e7eb;
  padding: 20px 0;
  margin: 24px 0 32px 0;
}
@media (min-width: 768px) {
  .project-single .project-meta {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
.project-single .meta-item {
  display: flex;
  flex-direction: row;
  align-content: center;
  gap: 6px;
}
.project-single .meta-label {
  color: #64748b;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.project-single .meta-value {
  color: #0f172a;
  font-size: 16px;
}

.project-single .project-content {
  color: #334155;
  font-size: 17px;
  line-height: 1.8;
}

/* ============================ */
/* About Us - inner sections     */
/* ============================ */
/* About Hero layout tweaks */
.about-section .about-content {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 24px;
    padding-left: 16px;
    padding-right: 16px;
}
.about-section .about-caption {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
@media (max-width: 767px) {
  .about-section .about-content {
    flex-direction: column;
    align-items: flex-start;
  }
}
/* Remove theme wrappers on About template so our sections control layout */
.page-template-about-template-php .content-area,
.page-template-about-template .content-area {
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
}
.page-template-about-template-php .site.grid-container.container.hfeed,
.page-template-about-template .site.grid-container.container.hfeed,
.page-template-about-template-php .site.grid-container.container,
.page-template-about-template .site.grid-container.container,
.page-template-about-template-php .site.grid-container,
.page-template-about-template .site.grid-container {
  max-width: none !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.page-template-about-template-php #page.grid-container,
.page-template-about-template #page.grid-container,
.page-template-about-template-php #page.grid-container.container,
.page-template-about-template #page.grid-container.container,
.page-template-about-template-php #page.grid-container.container.hfeed,
.page-template-about-template #page.grid-container.container.hfeed {
  max-width: none !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.page-template-about-template-php .grid-container,
.page-template-about-template .grid-container {
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.page-template-about-template-php .site-content .grid-container,
.page-template-about-template .site-content .grid-container {
  max-width: none !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.page-template-about-template-php .inside-site-container,
.page-template-about-template .inside-site-container,
.page-template-about-template-php .site-content,
.page-template-about-template .site-content {
  display: block !important;
  grid-template-columns: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.page-template-about-template-php .widget-area,
.page-template-about-template .widget-area,
.page-template-about-template-php .sidebar,
.page-template-about-template .sidebar,
.page-template-about-template-php .secondary-navigation,
.page-template-about-template .secondary-navigation {
  display: none !important;
  width: 0 !important;
}
.page-template-about-template-php .site-main.about-template,
.page-template-about-template .site-main.about-template {
  margin: 0 !important;
  padding: 0 !important;
}
/* Vision & Mission */
/* .about-vm { padding: 56px var(--container-pad-x); } */
.about-vm .vm-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
}
@media (min-width: 1024px) {
  .about-vm .vm-grid {
    grid-template-columns: 1fr 1fr;
    gap: 24px;
  }
}
.about-vm .vm-card {
  background: #ffffff;
  border: 1px solid #e5e7eb;
  padding: 28px;
}
.about-vm .vm-kicker {
  color: #0284c7;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-size: 18px;
  margin: 0 14px;
  padding: 14px 0px;
}
.about-vm .vm-rule {
  border: 0;
  border-top: 1px solid #e5e7eb;
  margin: 0 0 14px 0;
}
.about-vm .vm-text {
  color: #334155;
  line-height: 1.8;
  margin: 0;
  font-size: 18px;
}

/* History overlay */
.about-history {
  padding: 0;
  margin-bottom: 0px !important;
}
.about-history .history-figure {
  position: relative;
  min-height: 420px;
  background-size: cover;
  background-position: center;
}
.about-history .history-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.55));
}
.about-history .history-caption {
  position: relative;
  z-index: 2;
  padding: 56px 0px;
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: flex-end;
  text-align: right;
  min-height: 420px;
}
.about-history .history-title {
  font-size: clamp(28px, 3.6vw, 44px);
  font-weight: 300;
  margin: 0 0 10px 0;
}
.about-history .history-text {
  max-width: 720px;
  color: rgba(255, 255, 255, 0.9);
  line-height: 1.75;
  margin: 0 0 16px 0;
}
.about-history .history-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  padding: 0 16px;
  background: #318ac7;
  color: #fff;
  text-decoration: none;
  border: 1px solid rgba(255, 255, 255, 0.2);
}
.about-history .history-cta:hover {
  background: #2779b8;
}

/* Strategic Alliance split */
.about-split .split-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
  align-items: center;
}
@media (min-width: 1024px) {
  .about-split .split-grid {
    grid-template-columns: 1.05fr 0.95fr;
    gap: 28px;
  }
}
.about-split .split-title {
  font-size: clamp(28px, 3.6vw, 44px);
  font-weight: 400;
  margin: 0 0 12px 0;
  color: #0f172a;
}
.about-split .split-body {
  color: #334155;
  line-height: 1.8;
  display: grid;
  gap: 12px;
}
.about-split .split-image img {
  width: 100%;
  height: 100%;
  max-height: 560px;
  object-fit: cover;
  display: block;
}

/* Corporate Values */
.about-values {
  padding: 56px 0px;
}
.about-values .values-title {
  font-size: clamp(32px, 4.8vw, 56px);
  font-weight: 400;
  line-height: 1.05;
  margin: 0 0 40px 0;
  color: #0f172a;
}
.about-values .section-kicker { color: #0284c7; }
.about-values .values-grid {
  display: grid;
  grid-template-columns: 1fr;
  row-gap: 80px; /* vertical spacing between rows */
  column-gap: 0;
}
@media (min-width: 1024px) {
  .about-values .values-grid {
    grid-template-columns: repeat(3, 1fr);
    row-gap: 80px; /* keep vertical gap on desktop */
    column-gap: 0;
  }
}
.about-values .value-card {
  padding: 42px 32px; /* py-42px px-32px */
  border: 0;
  border-left: 2px solid #e5e7eb; /* only left border */
}
@media (min-width: 1024px) {
  .about-values .value-card {
    min-height: 180px;
    border-left: 2px solid #e5e7eb; /* keep left border for all cards */
  }
}
.about-values .value-icon {
  color: #318ac7;
  font-size: 26px;
  line-height: 1;
  margin-bottom: 24px;
}
.about-values .value-name {
  color: #318ac7;
  font-size: 16px;
  text-transform: uppercase;
  margin: 0 0 6px 0;
}
.about-values .value-text {
  color: #475569;
  line-height: 1.7;
  margin: 0;
}

/* Corporate Profile strip */
.about-profile {
  padding: 0px 0px;
  border-top: 1px solid #e5e7eb;
  border-bottom: 1px solid #e5e7eb;
}
.about-profile .profile-inner {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  align-items: center;

  padding: 18px 0;
}
@media (min-width: 768px) {
  .about-profile .profile-inner {
    grid-template-columns: auto 1fr auto;
    gap: 18px;
  }
}
.about-profile .profile-kicker {
  color: #0284c7;
  text-transform: uppercase;
  font-size: 16px;
  margin: 0;
}
.about-profile .profile-text {
  color: #334155;
  margin: 0;
  font-size: 18x;
}
.about-profile .profile-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  padding: 0 14px;
  text-decoration: none;
  background: #2f6fb0;
  color: #fff !important;
}
.about-profile .profile-cta:hover {
  background: #295f96;
}

/* Single Project: remove theme side padding so hero can be full-bleed */
.single-project .site-content {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Single Project: remove extra margins so hero sits flush */
.single-project .site-main.project-single {
  margin: 0 !important;
  padding: 0 !important;
}
.single-project .site-main.project-single > .hero-section {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Also remove any theme-introduced top spacing on wrappers */
.single-project #content,
.single-project .inside-article,
.single-project .content-area,
.single-project .inside-site-container,
.single-project .site-content {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Ensure outer containers don't add top spacing */
body.single-project,
.single-project #page,
.single-project .site,
.single-project .site-container,
.single-project .grid-container.container,
.single-project .hfeed.site {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* Single Project: hero uses same dimensions as Home slide */
.hero-section.hero-single .hero-slide {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  position: relative; /* allow absolute caption */
}
.hero-section.hero-single .hero-caption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0; /* absolute bottom */
  width: 100%;
  color: #ffffff;
}
.hero-section.hero-single .hero-caption-inner {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
}
.hero-section.hero-single .hero-left {
  flex: 1 1 auto;
  max-width: 780px; /* constrain title width */
}
.hero-section.hero-single .hero-right {
  flex: 1 1 40%;
  max-width: 560px; /* constrain desc width */
}
.hero-section.hero-single .hero-title {
  color: #fff;
}
.hero-section.hero-single .hero-desc {
  color: rgba(255, 255, 255, 0.9);
}
/* CTA button under description */
.hero-section.hero-single .hero-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 16px;
  height: 44px; /* square corners, consistent height */
  padding: 0 18px; /* horizontal padding for text */
  background: #ffffff;
  color: #0f172a !important;
  border: 1px solid #e5e7eb;
  text-decoration: none;
  font-weight: 600;
  font-size: 14px;
  letter-spacing: 0.02em;
  border-radius: 0; /* square corners */
  transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease,
    border-color 0.2s ease;
}
.hero-section.hero-single .hero-cta:hover {
  background: #f8fafc; /* slight tint */
  color: #0b1220;
  border-color: #d1d5db;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
}
@media (max-width: 767.98px) {
  .hero-section.hero-single .hero-caption {
    flex-direction: column;
    align-items: flex-start;
  }
  .hero-section.hero-single .hero-right {
    max-width: none;
    width: 100%;
  }
}

/* Neutralize theme wrappers on single project so hero can escape containers */
.single-project .inside-site-container,
.single-project .grid-container,
.single-project .content-area,
.single-project .site-content {
  max-width: none !important;
  display: block !important;
  grid-template-columns: none !important;
}

/* ============================ */
/* Projects Archive (3-col grid) */
/* ============================ */
.grid-cards.projects-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 28px;
}
@media (min-width: 768px) {
  .grid-cards.projects-grid {
    grid-template-columns: 1fr 1fr;
  }
}
@media (min-width: 1024px) {
  .grid-cards.projects-grid {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
/* Ensure cards stretch to grid cell width */
.grid-cards.projects-grid .project-card {
  width: 100%;
}

/* ============================ */
/* Project Card shared styles (Home + Archive) */
/* ============================ */
.project-card .card-media {
  position: relative;
  overflow: hidden;
}
.project-card .badges {
  position: absolute;
  top: 12px;
  right: 12px;
  left: auto;
  display: flex;
  gap: 10px;
  z-index: 2;
}
.project-card .badges .badge {
  padding: 7px 12px;
  font-size: 12px;
  color: #fff;
  background: linear-gradient(
    180deg,
    rgba(72, 101, 129, 0.34),
    rgba(72, 101, 129, 0.46)
  );
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-shadow: 0 0 1px rgba(255, 255, 255, 0.35);
}

/* Force translucent badges on archive too (override any theme .badge styles) */
.post-type-archive-project .projects-grid .project-card .badges .badge {
  background-color: transparent !important;
  background-image: linear-gradient(
    180deg,
    rgba(72, 101, 129, 0.34),
    rgba(72, 101, 129, 0.46)
  ) !important;
  box-shadow: none !important;
}

.project-card .card-title a {
  color: #0f172a;
  transition: color 0.25s ease;
}
/* Force hover color change even if parent theme styles anchors */
.projects-grid .project-card:hover .card-title a,
.projects-grid .project-card:focus-within .card-title a,
.project-card.group:hover .card-title a,
.project-card:hover .card-title a,
.project-card:focus-within .card-title a {
  color: #318ac7 !important;
}

.about-section {
  background-color: #f7f8f9;
}

.about-section .about-title {
  font-size: clamp(2rem, 5vw, 56px);
  font-weight: 400;
  line-height: 1.05;
  margin-bottom: 116px;
  color: #0f172a; /* black title */
  max-width: 22ch; /* constrain measure */
}
@media (max-width: 640px) {
  .about-section .about-title { max-width: 100%; }
}

.about-section .about-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  margin-bottom: 116px; /* mb-10 */
}
@media (min-width: 1024px) {
  .about-section .about-stats {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

.about-section .about-stat {
  position: relative;
  padding: 60px;
  border-left: 1px solid #c8ced5;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
/* Vertical dividers between items */

.about-section .about-stat-value {
  font-size: clamp(28px, 5vw, 72px);
  font-weight: 400;
  color: #318ac7; /* blue value */
}
.about-section .about-stat-label {
  font-size: 18px;
  opacity: 1;
  color: #0f172a; /* black label */
}

/* Bottom bar */
.about-section .about-bottom {
  margin-top: auto;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
}
.about-section .about-desc {
  max-width: 560px;
  font-size: 18px;
  line-height: 1.7;
  color: #0f172a; /* black description */
  margin: 0;
}
.about-section .about-link {
  color: rgba(255, 255, 255, 0.9);
  text-decoration: none;
  white-space: nowrap;
}
.about-section .about-link:hover {
  color: #fff;
}

/* Manual equivalents for kicker typography: text-sky-400 text-sm tracking-widest font-medium mb-6 */
.about-section .section-kicker {
  width: 20vw;
  color: #38bdf8; /* sky-400 */
  font-size: 14px; /* text-sm */
  letter-spacing: 0.16em; /* tracking-widest */
  font-weight: 500; /* font-medium */
  margin-bottom: 24px; /* mb-6 */
}

:root {
  --services-kicker-h: 56px;
}

/* ============================ */
/* Projects Map Section          */
/* ============================ */
.projects-map-section {
  width: var(--vw);
  margin-left: calc(50% - 50vw); /* full-bleed */
  margin-right: calc(50% - 50vw);
  background: #2c6fa0; /* blue backdrop */
  color: #e8f2f8;
  position: relative;
  overflow: visible; /* allow sticky children to render fully */
  padding-bottom: 24px; /* room for sticky legend */
}
.projects-map-content {
  max-width: 1280px;
  margin: 0 auto;
  padding: 80px 24px 16px 16px;
  display: grid;
  grid-template-columns: 1fr;
  align-items: start; /* text stays at top */
  min-height: 100vh; /* create scroll room */
}
@media (min-width: 1024px) {
  .projects-map-content {
    grid-template-columns: 1.1fr 0.9fr;
    min-height: 120vh;
  }
}

/* Left column should grow to enable sticky child at bottom */
.projects-map-left {
  display: flex;
  flex-direction: column;
  position: sticky;
  top: calc(var(--site-header-h) + 24px);
  align-self: start; /* ensure sticky works within grid */
  z-index: 2; /* above map background if overlapping */
}

.projects-map-kicker {
  color: #a7d7f3;
  font-size: 14px;
  letter-spacing: 0.16em;
  font-weight: 500;
  margin-bottom: 12px;
}
.projects-map-title {
  color: #fff;
  font-weight: 300;
  line-height: 1.1;
  font-size: clamp(28px, 5vw, 56px);
  margin: 0 0 16px 0;
}
.projects-map-desc {
  color: #e6f1f7;
  max-width: 520px;
  font-size: 15px;
  line-height: 1.65;
  margin: 0;
}

.projects-map-right {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  margin: 64px 0px;
  position: sticky; /* keep map visible while scrolling */
  top: calc(var(--site-header-h) + 24px);
}
.map-graphic {
  width: 240px;
  height: auto;
  filter: drop-shadow(0 10px 20px rgba(0, 0, 0, 0.15));
}
@media (min-width: 1280px) {
  .map-graphic {
    width: 300px;
  }
}

.projects-map-legend {
  align-self: flex-end;
  position: sticky; /* stick to viewport bottom while in section */
  bottom: max(0px, env(safe-area-inset-bottom));
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding: 12px 16px;
  margin-top: 48px;
  background: rgba(
    44,
    111,
    160,
    0.85
  ); /* match section blue with translucency */
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
  z-index: 5; /* above map */
  box-sizing: border-box;
  border-top: 1px solid rgba(255, 255, 255, 0.15);
}
@media (min-width: 1024px) {
  .projects-map-legend {
    grid-column: 1 / 2; /* match left content column */
    width: auto; /* use column width */
  }
}
.projects-map-legend .legend-left {
  display: flex;
  align-items: center;
  gap: 8px;
}
.projects-map-legend .legend-right {
  display: flex;
  align-items: center;
  gap: 8px;
}
.projects-map-legend .legend-text {
  font-size: 12px;
  color: #e6f1f7;
}
.projects-map-legend .legend-box {
  width: 16px;
  height: 16px;
  border: 2px solid #e6f1f7;
  border-radius: 2px;
  display: inline-block;
}
.projects-map-legend .legend-swatch {
  width: 18px;
  height: 12px;
  display: inline-block;
  border-radius: 2px;
}
.projects-map-legend .legend-swatch.sw1 {
  background: #8ecae6;
}
.projects-map-legend .legend-swatch.sw2 {
  background: #5faed3;
}
.projects-map-legend .legend-swatch.sw3 {
  background: #3d8db8;
}

/* Ensure site-wide container side padding wins over other !important rules */
/* Using padding-left/right increases compatibility over padding-inline */
body :where(.container.mx-auto),
body :where(.hero-caption-inner.container.mx-auto),
body :where(.project-tabs-inner.container.mx-auto),
body :where(.units-availability.container.mx-auto),
body :where(.services-section.container.mx-auto),
body :where(.projects-section.container.mx-auto),
body :where(.services-section .container.mx-auto),
body :where(.projects-section .container.mx-auto),
body :where(.about-section .container.mx-auto),
body :where(.contact-hero .container.mx-auto) {
  padding-left: 16px !important;
  padding-right: 16px !important;
}

/* Explicit per-section container gutters (highest priority) */
.projects-section.container.mx-auto,
.services-section.container.mx-auto,
.hero-caption-inner.container.mx-auto,
.project-tabs-inner.container.mx-auto,
.units-availability.container.mx-auto,
.about-section .container.mx-auto,
.contact-hero .container.mx-auto {
  padding-left: 16px !important;
  padding-right: 16px !important;
}

/* Slides hero caption needs side padding too (preserve existing top/bottom) */
.hero-caption {
  padding-left: 16px !important;
  padding-right: 16px !important;
}