/* SPACES HERO */
.spaces-hero { padding: 88px var(--pad-x) 72px; background: var(--bg2); }
.spaces-hero-inner { max-width: var(--max-w); margin: 0 auto; }

/* SPACE FEATURE */
.space-feature { display: grid; grid-template-columns: 1fr 1fr; min-height: 580px; }
.space-feature.reverse { direction: rtl; }
.space-feature.reverse > * { direction: ltr; }
.sf-visual { position: relative; overflow: hidden; }
.sf-visual-bg { width: 100%; height: 100%; background-repeat:no-repeat; background-position:center; background-size:cover; background-color:#eeebe5; }
.sfv-1{background-image:url('assets/byspace-living-room-card-960x580.png'); background-position:center top;}
.sfv-2{background-image:url('assets/byspace-hotel-lobby-card-960x580.png'); background-position:center center;}
.sfv-3{background-image:url('assets/byspace-office-card-960x580.png'); background-position:center center;}
.sfv-4{background-image:url('assets/byspace-restaurant-card-960x580.png'); background-position:center center;}
.sfv-5{background-image:url('assets/byspace-retail-flagship-card-960x580.png'); background-position:center center;}
.sfv-6{background-image:url('assets/byspace-outdoor-terraces-card-960x580.png'); background-position:center center;}
.sf-text { padding: 72px 64px; display: flex; flex-direction: column; justify-content: center; background: var(--bg); }
.sf-label { margin-bottom: 20px; }
.sf-h { font-family: var(--serif); font-size: clamp(30px, 3.5vw, 48px); font-weight: 300; color: var(--coal); line-height: 1.06; margin-bottom: 22px; }
.sf-p { font-size: 14px; line-height: 1.85; color: var(--ink2); font-weight: 300; margin-bottom: 32px; }
.sf-recs { margin-bottom: 32px; }
.sf-recs-label { font-size: 11px; letter-spacing: .15em; text-transform: uppercase; color: var(--stone); margin-bottom: 14px; font-weight: 500; }
.sf-rec-list { display: flex; flex-wrap: wrap; gap: 8px; }
.sf-rec-tag { padding: 7px 16px; border: 1px solid var(--border); font-size: 12px; color: var(--coal); text-decoration: none; font-weight: 400; transition: border-color .2s, background .2s; }
.sf-rec-tag:hover { border-color: var(--coal); background: var(--coal); color: var(--white); }

/* DIVIDER BAND */
.band { background: var(--bg2); padding: 0; }

/* TIP CARD */
.tips-section { padding: var(--pad-section) 0; background: var(--bg2); }
.tips-wrap { max-width: var(--max-w); margin: 0 auto; padding: 0 var(--pad-x); }
.tips-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.tip-card { background: var(--bg); padding: 40px 32px; }
.tip-icon { font-family: var(--serif); font-size: 32px; color: var(--stone); font-weight: 300; margin-bottom: 16px; }
.tip-title { font-size: 11px; letter-spacing: .17em; text-transform: uppercase; color: var(--coal); font-weight: 500; margin-bottom: 12px; }
.tip-text { font-size: 13.5px; color: var(--ink2); font-weight: 300; line-height: 1.75; }

/* SIZE BANNER */
.size-cta { background: var(--coal); padding: 72px var(--pad-x); text-align: center; }
.size-cta-h { font-family: var(--serif); font-size: clamp(28px, 3.5vw, 48px); font-weight: 300; color: var(--white); margin-bottom: 14px; }
.size-cta-p { font-size: 14px; color: rgba(240,237,232,.55); margin-bottom: 36px; font-weight: 300; }
.size-cta-btns { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }

@media (max-width: 960px) {
  .space-feature { grid-template-columns: 1fr; min-height: auto; }
  .space-feature.reverse { direction: ltr; }
  .sf-visual { min-height: 340px; }
  .sf-text { padding: 56px var(--pad-x); }
  .tips-grid { grid-template-columns: 1fr; }
}