/* Main Street Court homepage additions (2026-10-06, preview rev 11)
   1. Signature Privacy(TM) Townhomes feature (#privacy): cream section, white
      living-room card + bedroom feature column. Replaces the navy section.
   2. Sold-out treatment (305, 326, 201B) and Premier XL card alignment.        */

/* ---------- 1. Signature Privacy(TM) feature ---------- */
.sec.spf{background:#FAF9F5}
.spf .shead{max-width:1100px}
.spf .shead h2{color:var(--navy)}
.spf .shead .lede{max-width:62ch}
.spf .shead .lede{color:#4A5568}
.spf-grid{display:grid;grid-template-columns:minmax(0,1.72fr) minmax(0,1fr);gap:clamp(20px,2.4vw,34px);
  margin-top:clamp(26px,3vw,40px);align-items:start}
.spf-main{background:var(--white);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-1);
  border:1px solid rgba(11,17,76,.07);display:flex;flex-direction:column}
.spf-photo{display:block;overflow:hidden;background:#EEE9E0}
.spf-photo img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;
  transition:transform .6s var(--ease)}
.spf-photo:hover img{transform:scale(1.025)}
.spf-photo:focus-visible{outline:3px solid var(--teal);outline-offset:-3px}
.spf-body{padding:clamp(20px,2vw,28px) clamp(20px,2.2vw,30px) clamp(22px,2.2vw,30px)}
.spf-body h3{margin:0 0 12px;font-size:clamp(1.3rem,1.8vw,1.6rem);font-weight:800;letter-spacing:-.02em;
  line-height:1.15;color:var(--navy)}
.spf .spf-rate{margin:0;padding:0;border:0;gap:6px;color:#5F6E7F}
.spf .spf-rate .pprice{font-size:clamp(1.6rem,2.2vw,1.9rem)}
.spf .spf-rate .p3call{color:var(--teal-txt)}
.spf .spf-rate .putil{color:#5F6E7F}
.spf-acts{display:flex;flex-wrap:wrap;align-items:center;gap:12px 22px;margin-top:18px;padding-top:18px;
  border-top:1px solid rgba(11,17,76,.09)}
.spf-acts .fplink{width:auto;margin:0;padding-left:22px;padding-right:22px}
.spf-acts .tlink{margin:0}
.spf-side{display:flex;flex-direction:column;align-items:flex-start}
.spf-photo2{margin:0;width:100%;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-1);background:#EEE9E0}
.spf-photo2 img{display:block;width:100%;height:auto;aspect-ratio:995/749;object-fit:cover}
.spf-side h3{margin:22px 0 14px;font-size:clamp(1.3rem,1.8vw,1.6rem);font-weight:800;letter-spacing:-.02em;
  line-height:1.15;color:var(--navy)}
.spf .sp-avail{margin-top:18px;color:var(--navy);background:var(--white);border:1px solid rgba(11,17,76,.12)}
.spf-btn{margin-top:16px}
@media (max-width:900px){
  .spf-grid{grid-template-columns:1fr}
  .spf-side{margin-top:6px}
}
@media (max-width:520px){
  .spf-acts{flex-direction:column;align-items:stretch}
  .spf-acts .fplink{width:100%;justify-content:center}
  .spf-acts .tlink{justify-content:center;padding:6px 0}
  .spf-btn{width:100%;justify-content:center}
}

/* ---------- 2. /* Unit 305 sold-out treatment (2026-10-06, preview) - reuses The Green XL
   .soldrib/.srb ribbon and .soldchip exactly; only anchors the ribbon on the card photo. */
.pthumb.sold{position:relative;overflow:hidden}
/* 201B sold-out (Main Street Building flats): same ribbon/chip on the card corner */
.bflat.sold{position:relative;overflow:hidden}
.bflat.sold .soldnote{margin-top:8px}
/* keep the Furnished tag visible: it moves under the unit name, clear of the ribbon */
.bflat.sold .bflat-top{flex-direction:column;align-items:flex-start;gap:6px;padding-right:56px}
/* Premier XL (4 cards): equal-height cards; the pricing block sits at the same
   level on every card (cards without the sold-out pill keep that space above
   it), so Rate & per-person share, View Floor Plan and Take the Tour all align. */
#premier .plans-in{align-items:stretch}
#premier .plan .pbody{flex:1 1 auto;display:flex;flex-direction:column}
#premier .plan .prate{margin-top:auto}
/* Last Premier XL card: note under Take the Tour. Every Premier XL card reserves
   the same note-height space at the bottom, so pricing, View Floor Plan and
   Take the Tour stay level across all four cards. */
#premier .tournote,#premier .plan .pbody::after{font-size:.75rem;line-height:1.45;margin:2px 0 0;min-height:2.9em}
#premier .tournote{font-weight:600;letter-spacing:.005em;color:#5F6E7F}
#premier .plan .pbody::after{content:"";display:block}
#premier .plan.has-tournote .pbody::after{display:none}

/* 3. Mobile leasing buttons: in page flow below the Signature Privacy section (replaces the floating bar on this page) */
.spf-mcta{display:none}
@media (max-width:720px){
  #mobcta{display:none!important}
  .spf-mcta{display:flex;gap:12px;justify-content:center;margin-top:28px}
  .spf-mcta .btn{flex:1 1 0;max-width:168px;min-height:44px;padding:10px 14px;font-size:.92rem;justify-content:center;text-align:center;box-shadow:none}
}

/* 4. Approved page background #FAF9F5 (homepage). Replaces the old cream #FBF7EF on
   page-level surfaces only. Cards, form fields, buttons and brand-color sections unchanged. */
body,
.phero,
.sec.cream,
.lcontact,
.mnav{background-color:#FAF9F5}
header#hdr{background-color:rgba(250,249,245,.86)}

/* 5. "Introducing Signature Privacy™" strip, directly below the opening photo */
.sp-intro{display:flex;align-items:center;gap:22px;margin-top:clamp(28px,3.4vw,44px);padding:12px 26px 12px 12px;
  background:#fff;border:1px solid rgba(11,17,76,.08);border-radius:20px;box-shadow:0 10px 28px -18px rgba(11,17,76,.35);
  text-decoration:none;color:var(--navy);transition:transform .25s ease,box-shadow .25s ease}
.sp-intro:hover{transform:translateY(-2px);box-shadow:0 16px 34px -18px rgba(11,17,76,.45)}
.sp-intro img{width:150px;height:96px;object-fit:cover;border-radius:12px;flex:none}
.sp-intro-txt{display:flex;flex-direction:column;gap:3px;flex:1;min-width:0}
.sp-intro-k{font-size:.74rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--teal)}
.sp-intro-h{font-size:clamp(1.05rem,1.5vw,1.3rem);font-weight:800;line-height:1.25;letter-spacing:-.01em;color:var(--navy)}
.sp-intro-l{font-size:.95rem;font-weight:700;color:var(--teal);margin-top:2px}
.sp-intro:hover .sp-intro-l span{display:inline-block;transform:translateX(3px)}
.sp-intro-l span{display:inline-block;transition:transform .2s ease}
@media (max-width:720px){
  .sp-intro{gap:14px;padding:10px 14px 10px 10px;border-radius:16px}
  .sp-intro img{width:84px;height:84px}
  .sp-intro-k{font-size:.62rem;letter-spacing:.07em;white-space:nowrap}
  .sp-intro-h{font-size:1rem}
  .sp-intro-l{font-size:.88rem}
}
@media (prefers-reduced-motion:reduce){.sp-intro,.sp-intro-l span{transition:none}.sp-intro:hover{transform:none}}