/*
 * Peak Space Child Theme — peakspace.css
 * Safe styles only. No global resets. No WordPress element overrides.
 * All rules are scoped to Elementor or Peak Space classes.
 */

/* ── CSS Variables (used inside Elementor widgets) ── */
:root {
  --ps-blue:   #2ea3f2;
  --ps-navy:   #1d293e;
  --ps-white:  #ffffff;
  --ps-off:    #f7f7f7;
  --ps-text:   #2e3d49;
  --ps-mid:    #6b7b8d;
  --ps-border: #e0e8ef;
  --ps-gold:   #e8b84b;
  --ps-green:  #27ae60;
  --ps-shadow: 0 6px 24px rgba(30, 60, 100, .12);
  --ps-radius: 8px;
  --ps-trans:  .25s ease;
}

/* ── Elementor container max-width ── */
.elementor-section .elementor-container,
.elementor-section.elementor-section-stretched .elementor-container {
  max-width: 1240px !important;
}

/* ── Prevent horizontal scroll inside Elementor sections ── */
.elementor-section,
.e-con {
  overflow-x: hidden;
}

/* ── Smooth scrolling (page-level, not admin) ── */
html {
  scroll-behavior: smooth;
}

/* ── Body font — Nunito Sans loaded via functions.php ── */
body {
  font-family: 'Nunito Sans', sans-serif;
}

/* ── Headings font ── */
h1, h2, h3, h4, h5, h6 {
  font-family: 'Nunito', sans-serif;
}

/* ── Thin scrollbar (cosmetic only) ── */
::-webkit-scrollbar        { width: 5px; }
::-webkit-scrollbar-track  { background: var(--ps-off); }
::-webkit-scrollbar-thumb  { background: var(--ps-blue); border-radius: 3px; }

/* ── Peak Space button styles (only when class is explicitly used) ── */
.ps-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-family: 'Nunito Sans', sans-serif;
  font-size: 13px;
  font-weight: 800;
  border-radius: 4px;
  transition: var(--ps-trans);
  cursor: pointer;
  border: 2px solid transparent;
  text-decoration: none;
}
.ps-btn-primary {
  padding: 12px 24px;
  background: var(--ps-blue);
  color: var(--ps-white);
  border-color: var(--ps-blue);
  box-shadow: 0 4px 14px rgba(46, 163, 242, .28);
}
.ps-btn-primary:hover {
  background: #1a8fd8;
  border-color: #1a8fd8;
  transform: translateY(-2px);
  color: var(--ps-white);
}
.ps-btn-outline {
  padding: 11px 23px;
  border-color: var(--ps-blue);
  color: var(--ps-blue);
  background: transparent;
}
.ps-btn-outline:hover {
  background: var(--ps-blue);
  color: var(--ps-white);
  transform: translateY(-2px);
}

/* ── Property card (Elementor template use only) ── */
.ps-card {
  background: var(--ps-white);
  border-radius: var(--ps-radius);
  overflow: hidden;
  box-shadow: var(--ps-shadow);
  transition: transform var(--ps-trans), box-shadow var(--ps-trans);
}
.ps-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 14px 48px rgba(30, 60, 100, .18);
}
.ps-card-img {
  position: relative;
  overflow: hidden;
  height: 220px;
}
.ps-card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .4s ease;
}
.ps-card:hover .ps-card-img img {
  transform: scale(1.04);
}
.ps-card-badge {
  position: absolute;
  top: 12px;
  left: 12px;
  background: var(--ps-blue);
  color: var(--ps-white);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 4px;
}
.ps-card-body {
  padding: 18px 20px 20px;
}
.ps-card-price {
  font-family: 'Nunito', sans-serif;
  font-size: 22px;
  font-weight: 800;
  color: var(--ps-blue);
  margin-bottom: 6px;
}
.ps-card-title {
  font-family: 'Nunito', sans-serif;
  font-size: 15px;
  font-weight: 700;
  color: var(--ps-navy);
  margin-bottom: 4px;
  line-height: 1.3;
}
.ps-card-loc {
  font-size: 13px;
  color: var(--ps-mid);
  margin-bottom: 14px;
}
.ps-card-meta {
  display: flex;
  gap: 16px;
  font-size: 12.5px;
  color: var(--ps-mid);
  border-top: 1px solid var(--ps-border);
  padding-top: 12px;
}
.ps-card-meta span {
  display: flex;
  align-items: center;
  gap: 5px;
  font-weight: 600;
}

/* ── Agent card ── */
.ps-agent-card {
  background: var(--ps-white);
  border-radius: var(--ps-radius);
  overflow: hidden;
  box-shadow: var(--ps-shadow);
  text-align: center;
  transition: transform var(--ps-trans);
}
.ps-agent-card:hover { transform: translateY(-4px); }
.ps-agent-card img {
  width: 100%;
  height: 220px;
  object-fit: cover;
}
.ps-agent-info { padding: 16px 18px 20px; }
.ps-agent-name {
  font-family: 'Nunito', sans-serif;
  font-size: 16px;
  font-weight: 800;
  color: var(--ps-navy);
  margin-bottom: 3px;
}
.ps-agent-role { font-size: 13px; color: var(--ps-mid); }
.ps-agent-stats {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--ps-border);
  font-size: 12.5px;
  color: var(--ps-mid);
}
.ps-agent-stats strong {
  display: block;
  font-family: 'Nunito', sans-serif;
  font-size: 16px;
  font-weight: 800;
  color: var(--ps-blue);
}

/* ── City / Category tile ── */
.ps-city-tile {
  position: relative;
  border-radius: var(--ps-radius);
  overflow: hidden;
  cursor: pointer;
}
.ps-city-tile img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .4s ease;
  display: block;
}
.ps-city-tile:hover img { transform: scale(1.06); }
.ps-city-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(29,41,62,.72) 0%, transparent 55%);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 18px;
}
.ps-city-name {
  font-family: 'Nunito', sans-serif;
  font-size: 17px;
  font-weight: 800;
  color: #fff;
}
.ps-city-count { font-size: 12.5px; color: rgba(255,255,255,.65); margin-top: 2px; }

/* ── Section label (blue uppercase tag) ── */
.ps-label {
  display: inline-block;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--ps-blue);
  margin-bottom: 8px;
}

/* ── Responsive helpers for Elementor columns ── */
@media (max-width: 767px) {
  .ps-hide-mobile { display: none !important; }
}
@media (min-width: 768px) {
  .ps-hide-desktop { display: none !important; }
}
