/* =========================
   Final homepage QA refinement
   Compact spacing + image-led services + corrected social panel + compact form
   ========================= */

/* Overall density */
.services-section,
.why-section,
.about-section,
.process-section,
.property-section,
.social-section,
.area-section,
.faq-section,
.contact-section { padding-block: 84px; }

.section-heading { margin-bottom: 36px; }
.section-heading-grid { gap: 56px; margin-top: 14px; }
.section-heading h2,
.why-intro h2,
.about-copy h2 { font-size: clamp(42px, 3.8vw, 60px); }
.section-heading p { line-height: 1.65; }

/* Hero: keep CTA above the fold on common laptop sizes */
.hero { min-height: 620px; height: min(700px, 100svh); }
.hero-layout {
  min-height: calc(min(700px, 100svh) - var(--header-h) - var(--utility-h));
  padding-top: 18px;
  padding-bottom: 34px;
  gap: 40px;
}
.hero-title { font-size: clamp(50px, 4.6vw, 70px); }
.hero-description { margin-top: 18px; max-width: 590px; font-size: 15px; line-height: 1.6; }
.hero-actions { margin-top: 20px; }
.hero-proof { margin-top: 18px; }
.hero-visual { height: 430px; }
.hero-photo-panel { inset: 34px 18px 32px 50px; }
.hero-scroll { display: none; }

/* Trust strip */
.trust-grid { min-height: 132px; }
.trust-item { padding: 24px 22px; gap: 13px; }
.trust-item p { margin-top: 5px; }

/* Services: image-led compact cards */
.service-grid { gap: 16px; }
.service-card {
  min-height: 0;
  padding: 0;
  display: block;
  overflow: hidden;
  background: #efebe2;
}
.service-card::after { display: none; }
.service-card::before { z-index: 1; }
.service-media {
  position: relative;
  height: 154px;
  overflow: hidden;
  background: #121418;
}
.service-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.72) contrast(1.04) brightness(.88);
  transition: transform .5s var(--ease), filter .4s ease;
}
.service-card:hover .service-media img { transform: scale(1.035); filter: saturate(.9) contrast(1.04) brightness(.92); }
.service-media-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(5,6,7,.16), rgba(5,6,7,.05) 45%, rgba(5,6,7,.5));
}
.service-card-top {
  position: absolute;
  z-index: 2;
  left: 14px;
  right: 14px;
  top: 14px;
}
.service-number {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  color: #090909;
  background: var(--gold);
  font-size: 9px;
  font-weight: 800;
}
.service-tag {
  padding: 7px 9px;
  border-radius: 7px;
  color: rgba(255,255,255,.86);
  background: rgba(5,6,7,.66);
  border-color: rgba(255,255,255,.14);
  backdrop-filter: blur(8px);
}
.service-card-body { padding: 18px 20px 20px; }
.service-card h3 { margin: 0 0 7px; font-size: 22px; }
.service-card p { min-height: 62px; font-size: 12px; line-height: 1.58; }
.service-card-action {
  width: fit-content;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-top: 16px;
  padding: 9px 12px;
  border: 1px solid rgba(23,25,28,.12);
  border-radius: 8px;
  color: #303236;
  background: rgba(255,255,255,.45);
  font-size: 8.5px;
  font-weight: 800;
  letter-spacing: .055em;
  text-transform: uppercase;
  transition: background .2s ease, border-color .2s ease, transform .2s ease;
}
.service-card-action span { color: var(--gold-dark); font-size: 14px; }
.service-card-action:hover { transform: translateY(-1px); background: white; border-color: rgba(200,138,24,.35); }
.service-card-featured .service-card-body { background: var(--charcoal); }
.service-card-featured .service-card-action { color: white; background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.12); }
.service-card-featured .service-card-action span { color: var(--gold); }
.service-card-featured .service-tag { color: rgba(255,255,255,.88); }

/* Why / About */
.why-layout { gap: 62px; }
.why-item { padding-block: 25px; }
.about-layout { gap: 62px; grid-template-columns: minmax(390px,.9fr) minmax(0,1.1fr); }
.about-visual-frame { min-height: 500px; }
.about-copy .about-lead { margin-top: 20px; font-size: 16px; }
.about-copy > p { margin-top: 14px; line-height: 1.68; }
.about-principles { margin-top: 26px; }
.about-principles > div { padding-block: 17px; }
.about-actions { margin-top: 26px; }

/* Process */
.process-track { margin-top: 36px; gap: 28px; }
.process-step { padding-top: 62px; }
.process-step h3 { font-size: 32px; }

/* Property cards */
.property-card { min-height: 450px; }
.property-content { left: 26px; right: 26px; bottom: 24px; }
.property-content h3 { font-size: 30px; }
.property-content a { margin-top: 16px; }

/* Local trust panel: fix oversized/zoomed logo composition */
.social-layout { grid-template-columns: minmax(0,.94fr) minmax(390px,1.06fr); gap: 56px; }
.social-copy h2 { margin: 16px 0 14px; font-size: clamp(40px,3.8vw,58px); }
.social-copy p { margin-bottom: 22px; line-height: 1.65; }
.social-panel {
  min-height: 270px;
  grid-template-columns: 160px minmax(0,1fr);
  gap: 24px;
  padding: 26px;
  border-radius: 18px;
}
.social-panel-logo {
  width: 160px;
  height: 160px;
  align-self: center;
  display: grid;
  place-items: center;
  padding: 6px;
  border-radius: 14px;
  background: #050607;
}
.social-panel-logo picture { display: block; width: 100%; height: 100%; }
.social-panel-logo img { width: 100%; height: 100%; aspect-ratio: auto; object-fit: contain; object-position: center; }
.social-panel-copy strong { font-size: 26px; }
.social-panel-copy span { margin-top: 16px; }
.social-panel::after { width: 240px; height: 240px; right: -80px; top: -70px; }

/* Area + FAQ */
.area-layout { gap: 60px; }
.area-card { padding: 28px; }
.area-card h3 { font-size: 26px; }
.faq-layout { gap: 60px; grid-template-columns: minmax(0,.82fr) minmax(480px,1.18fr); }
.faq-item button { padding: 18px 0; font-size: 16px; }
.faq-answer p { padding-bottom: 18px; line-height: 1.62; }

/* Compact conversion section + form */
.contact-layout {
  grid-template-columns: minmax(0,.88fr) minmax(500px,1.12fr);
  gap: 58px;
  align-items: center;
}
.contact-copy h2 { margin: 16px 0 14px; font-size: clamp(42px,3.8vw,60px); }
.contact-copy > p { font-size: 14px; line-height: 1.65; }
.contact-direct { margin-top: 28px; padding-top: 18px; }
.request-form {
  max-width: 680px;
  margin-left: auto;
  gap: 12px;
  padding: 24px;
  border-radius: 18px;
}
.field { gap: 6px; }
.field label { font-size: 9px; }
.field input,
.field select { height: 47px; }
.field input,
.field select,
.field textarea { padding-inline: 13px; border-radius: 8px; }
.field textarea { min-height: 96px; padding-top: 12px; }
.form-submit { gap: 14px; }
.form-submit .btn { min-height: 46px; padding-inline: 18px; }
.form-submit p { max-width: 220px; }

/* Footer density */
.footer-main { padding: 52px 0 44px; }
.footer-grid { gap: 38px; }

@media (max-width: 1199px) {
  .services-section,
  .why-section,
  .about-section,
  .process-section,
  .property-section,
  .social-section,
  .area-section,
  .faq-section,
  .contact-section { padding-block: 72px; }
  .hero { min-height: 600px; height: min(680px,100svh); }
  .hero-layout { min-height: calc(min(680px,100svh) - var(--header-h) - var(--utility-h)); }
  .hero-visual { height: 400px; }
  .service-media { height: 145px; }
  .about-visual-frame { min-height: 460px; }
  .social-layout { gap: 42px; }
  .social-panel { grid-template-columns: 140px 1fr; min-height: 240px; }
  .social-panel-logo { width: 140px; height: 140px; }
}

@media (max-width: 991px) {
  .services-section,
  .why-section,
  .about-section,
  .process-section,
  .property-section,
  .social-section,
  .area-section,
  .faq-section,
  .contact-section { padding-block: 62px; }
  .section-heading { margin-bottom: 30px; }
  .hero-layout { min-height: 570px; padding-top: 20px; padding-bottom: 30px; }
  .hero-title { font-size: clamp(46px,5.5vw,60px); }
  .hero-visual { height: 350px; }
  .about-layout { gap: 38px; }
  .social-layout,
  .area-layout,
  .faq-layout,
  .contact-layout { gap: 36px; }
  .social-panel { max-width: 620px; }
  .request-form { max-width: 700px; margin-left: 0; }
}

@media (max-width: 767px) {
  .services-section,
  .why-section,
  .about-section,
  .process-section,
  .property-section,
  .social-section,
  .area-section,
  .faq-section,
  .contact-section { padding-block: 52px; }
  .section-heading { margin-bottom: 26px; }
  .section-heading-grid { gap: 16px; }
  .hero-layout { padding-top: 24px; padding-bottom: 30px; gap: 8px; }
  .hero-title { font-size: clamp(38px,10.2vw,49px); }
  .hero-description { margin-top: 14px; }
  .hero-actions { margin-top: 16px; }
  .hero-visual { height: min(62vw,280px); }
  .trust-item { padding-block: 20px; }
  .service-media { height: 165px; }
  .service-card-body { padding: 16px 18px 18px; }
  .service-card p { min-height: 0; }
  .why-item { padding-block: 22px; }
  .about-layout { gap: 34px; }
  .about-visual-frame { min-height: 390px; }
  .property-card { min-height: 390px; }
  .social-panel { grid-template-columns: 104px 1fr; min-height: 200px; padding: 20px; gap: 18px; }
  .social-panel-logo { width: 104px; height: 104px; }
  .social-panel-copy strong { font-size: 21px; }
  .area-card { padding: 24px; }
  .request-form { padding: 20px; gap: 11px; }
  .field textarea { min-height: 88px; }
  .form-submit { align-items: start; }
  .footer-main { padding-block: 44px 36px; }
}

@media (max-width: 575px) {
  .services-section,
  .why-section,
  .about-section,
  .process-section,
  .property-section,
  .social-section,
  .area-section,
  .faq-section,
  .contact-section { padding-block: 46px; }
  .hero-layout { padding-top: 20px; padding-bottom: 22px; }
  .hero-visual { height: 210px; }
  .service-media { height: 150px; }
  .service-card-action { margin-top: 14px; padding: 8px 10px; }
  .about-visual-frame { min-height: 350px; }
  .property-card { min-height: 360px; }
  .social-panel { grid-template-columns: 86px 1fr; padding: 18px; }
  .social-panel-logo { width: 86px; height: 86px; }
  .social-panel-copy strong { font-size: 18px; }
  .social-panel-copy span { font-size: 8px; }
  .contact-direct { margin-top: 22px; }
  .request-form { padding: 17px; }
  .form-submit .btn { width: 100%; }
}

/* =========================
   URGENT QA PATCH — user review fixes
   ========================= */

/* tighter layout across the full homepage */
.services-section,
.why-section,
.about-section,
.process-section,
.property-section,
.social-section,
.area-section,
.faq-section,
.contact-section { padding-block: 68px; }

.section-heading { margin-bottom: 28px; }
.section-heading-grid { gap: 28px; }

/* service cards: local images + stable layout */
.service-grid { gap: 18px; align-items: stretch; }
.service-card { display: flex; flex-direction: column; }
.service-card-body { display: flex; flex-direction: column; flex: 1; min-height: 210px; }
.service-card p { min-height: 0; margin-bottom: 0; }
.service-card-action { margin-top: auto; }
.service-media { height: 170px; }

/* featured service hover bug fix */
.service-card-featured,
.service-card-featured:hover {
  background: var(--charcoal) !important;
  color: var(--white);
  border-color: rgba(255,255,255,.12);
}
.service-card-featured .service-card-body,
.service-card-featured:hover .service-card-body {
  background: var(--charcoal);
  color: var(--white);
}
.service-card-featured h3,
.service-card-featured:hover h3 {
  color: #fff;
}
.service-card-featured p,
.service-card-featured:hover p {
  color: rgba(255,255,255,.76) !important;
}
.service-card-featured .service-card-action,
.service-card-featured:hover .service-card-action {
  color: #fff;
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.12);
}
.service-card-featured .service-media-overlay {
  background: linear-gradient(180deg, rgba(5,6,7,.12), rgba(5,6,7,.16) 40%, rgba(5,6,7,.62));
}

/* reduce empty space in content sections */
.why-layout,
.about-layout,
.area-layout,
.faq-layout,
.contact-layout,
.social-layout { gap: 40px; }
.why-item { padding-block: 20px; }
.about-layout { grid-template-columns: minmax(340px, .9fr) minmax(0, 1.1fr); }
.about-visual-frame { min-height: 420px; }
.about-principles { margin-top: 22px; }
.about-actions { margin-top: 22px; }
.process-track { margin-top: 28px; gap: 22px; }
.process-step { padding-top: 48px; }
.property-card { min-height: 380px; }
.area-card { padding: 24px; }
.request-form { max-width: 620px; padding: 20px; }

/* social panel / logo zoom out fix */
.social-layout { grid-template-columns: minmax(0, 1fr) minmax(340px, .92fr); align-items: center; }
.social-copy h2 { font-size: clamp(36px, 3.2vw, 52px); }
.social-panel {
  min-height: 220px;
  grid-template-columns: 118px minmax(0,1fr);
  gap: 18px;
  padding: 22px;
}
.social-panel-logo {
  width: 118px;
  height: 118px;
  padding: 12px;
  border-radius: 16px;
}
.social-panel-logo img { object-fit: contain !important; object-position: center; }
.social-panel-copy small { font-size: 9px; }
.social-panel-copy strong { font-size: 22px; line-height: 1.08; }
.social-panel-copy span { margin-top: 12px; font-size: 10px; }
.social-panel::after {
  width: 180px;
  height: 180px;
  right: -58px;
  top: -50px;
  box-shadow: 0 0 0 30px rgba(244,184,45,.02), 0 0 0 60px rgba(244,184,45,.015);
}

/* responsive tightening */
@media (max-width: 1199px) {
  .services-section,
  .why-section,
  .about-section,
  .process-section,
  .property-section,
  .social-section,
  .area-section,
  .faq-section,
  .contact-section { padding-block: 60px; }
  .social-layout,
  .why-layout,
  .about-layout,
  .area-layout,
  .faq-layout,
  .contact-layout { gap: 32px; }
}

@media (max-width: 991px) {
  .services-section,
  .why-section,
  .about-section,
  .process-section,
  .property-section,
  .social-section,
  .area-section,
  .faq-section,
  .contact-section { padding-block: 52px; }
  .service-media { height: 180px; }
  .service-card-body { min-height: 190px; }
  .social-layout { grid-template-columns: 1fr; }
  .social-panel { max-width: 560px; }
  .about-layout { grid-template-columns: 1fr; }
  .about-visual-frame { min-height: 360px; }
  .property-card { min-height: 340px; }
}

@media (max-width: 767px) {
  .services-section,
  .why-section,
  .about-section,
  .process-section,
  .property-section,
  .social-section,
  .area-section,
  .faq-section,
  .contact-section { padding-block: 44px; }
  .section-heading-grid { gap: 14px; }
  .service-media { height: 160px; }
  .service-card-body { min-height: 0; }
  .service-card-action { width: 100%; justify-content: space-between; }
  .social-panel {
    grid-template-columns: 90px 1fr;
    min-height: 0;
    padding: 18px;
    gap: 14px;
  }
  .social-panel-logo {
    width: 90px;
    height: 90px;
    padding: 10px;
  }
  .social-panel-copy strong { font-size: 19px; }
  .social-panel-copy span { font-size: 9px; }
  .about-visual-frame { min-height: 310px; }
  .property-card { min-height: 300px; }
  .request-form { padding: 18px; }
}