﻿/* Shared landing-page components live in property-agencies.css. */
.fs .pa-panel { min-height: 243px; }
.fs-mobile-showcase { padding-bottom: 35px; }
.fs-mobile-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 64px; }
.fs-mobile-copy h2 { margin: 16px 0 22px; }
.fs-mobile-copy > p:not(.pa-eyebrow) { color: var(--pa-muted); font-size: 15px; line-height: 1.85; max-width: 440px; }
.fs-mobile-feature { display: flex; gap: 15px; margin-top: 28px; }
.fs-mobile-feature h3 { font-size: 15px; font-weight: 600; margin-bottom: 5px; }
.fs-mobile-feature p { color: var(--pa-muted); font-size: 13px; line-height: 1.8; }
.fs-mobile-copy > .pa-text-link { margin-top: 30px; }
.fs-phone-stage { min-width: 0; width: 100%; max-width: 560px; justify-self: end; padding: 30px 24px 24px; border-radius: 24px; background: radial-gradient(ellipse at 50% 45%, var(--pa-soft), var(--pa-tint) 72%); }
.fs-phone-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 220px)); justify-content: center; align-items: start; gap: 20px; }
.fs-phone-pair figure { margin: 0; min-width: 0; }
.fs-phone-pair figure:last-child { padding-top: 32px; }
.fs-phone-image { display: block; border-radius: 32px; filter: drop-shadow(0 18px 12px rgba(var(--pa-shade), .15)); transition: transform .25s ease, filter .25s ease; }
.fs-phone-pair figure:hover .fs-phone-image { transform: translateY(-7px) scale(1.07); filter: drop-shadow(0 23px 16px rgba(var(--pa-shade), .25)); }
.fs-phone-pair img { display: block; width: 100%; height: auto; }
.fs-phone-pair figcaption { text-align: center; font-size: 12px; font-weight: 600; margin-top: 16px; }
.fs-concept-note { text-align: center; color: var(--pa-muted) !important; font-size: 10px; line-height: 1.7; margin-top: 25px !important; }
.fs-service-section { background: #fbf8f2; }
.fs-service-layout { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); align-items: center; gap: 64px; }
.fs-photo-story { position: relative; display: grid; grid-template-columns: 1.15fr .85fr; gap: 18px; }
.fs-photo-story figure { margin: 0; min-width: 0; }
.fs-photo-story img { width: 100%; display: block; object-fit: cover; border-radius: 16px; }
.fs-photo-field img { height: 370px; object-position: 52% center; }
.fs-photo-customer { padding-top: 70px; }
.fs-photo-customer img { height: 330px; object-position: 49% center; }
.fs-photo-story figcaption { font-size: 11px; color: var(--pa-muted); margin-top: 12px; }
.fs-photo-label { grid-column: 1 / -1; justify-self: start; padding: 13px 18px; border: 1px solid var(--pa-line); border-radius: 8px; background: #fff; font-size: 11px; box-shadow: 0 12px 25px rgba(var(--pa-shade), .05); }
.fs-photo-label i { color: var(--pa-strong); margin-right: 8px; }
@media (max-width: 1100px) {
  .fs-mobile-layout, .fs-service-layout { gap: 35px; }
  .fs-phone-stage { padding: 30px 20px 23px; }
  .fs-phone-pair { gap: 12px; }
}
@media (max-width: 900px) {
  .fs-mobile-layout, .fs-service-layout { grid-template-columns: 1fr; gap: 38px; }
  .fs-mobile-copy > p:not(.pa-eyebrow) { max-width: 580px; }
  .fs-mobile-layout, .fs-service-layout { max-width: 650px; }
  .fs-phone-stage { max-width: 560px; justify-self: center; margin: 0 auto; }
  .fs-photo-story { width: 100%; max-width: 650px; }
}
@media (max-width: 600px) {
  .fs .pa-preview-top { flex-wrap: wrap; }
  .fs .pa-preview-heading h2 { font-size: 19px; }
  .fs-mobile-showcase { padding-bottom: 15px; }
  .fs-phone-stage { padding: 24px 0 20px; border-radius: 16px; }
  .fs-phone-pair { display: flex; justify-content: flex-start; gap: 24px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 0 max(24px, calc((100% - 220px) / 2)) 20px; scrollbar-width: thin; scrollbar-color: var(--pa-line-strong) transparent; }
  .fs-phone-pair figure { flex: 0 0 220px; scroll-snap-align: center; }
  .fs-phone-pair figure:last-child { padding-top: 0; }
  .fs-phone-pair figcaption { font-size: 12px; }
  .fs-concept-note { font-size: 10px; padding: 0 20px; margin-top: 16px !important; }
  .fs-photo-story { gap: 16px 12px; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .fs-photo-field img { height: 230px; }
  .fs-photo-customer img { height: 230px; }
  .fs-photo-customer { padding-top: 28px; }
  .fs-photo-label { font-size: 11px; }
}
