/* v28: scoped to the requested buyer overview and Design Questions.
   No selectors here target Portfolio, Marketing, Concierge, or existing detail pages. */
html body.ss18 #main.buyer-overview-v28 {
  background: var(--v27-paper, #f8f7f3) !important;
  color: var(--v27-ink, #30382e) !important;
}
/* Keep the actual approved Concierge/Marketing hero structure and proportions. */
html body.ss18 #main.buyer-overview-v28 .ss22-hero-photo { margin: 0 !important; }
html body.ss18 #main.buyer-overview-v28 .ss22-hero-photo img {
  display: block !important; width: 100% !important; height: auto !important;
  max-height: none !important; aspect-ratio: auto !important; object-fit: contain !important;
}
html body.ss18 #main.buyer-overview-v28 .ss22-hero-caption h1 {
  font: 400 clamp(30px, 3vw, 46px)/1.16 Arial, Helvetica, sans-serif !important;
  letter-spacing: -.025em !important; text-align: center !important;
}
html body.ss18 #main.buyer-overview-v28 .ss22-hero-caption p {
  font: 400 16px/1.75 Arial, Helvetica, sans-serif !important;
  text-align: center !important; color: var(--v27-ink, #30382e) !important;
}
html body.ss18 #main.buyer-overview-v28 .ss22-chapter-links {
  display: flex !important; flex-wrap: wrap !important; gap: 10px 26px !important;
  justify-content: center !important; padding: 20px 24px !important;
  background: var(--v27-sage-soft, #e8e9e1) !important;
}
html body.ss18 #main.buyer-overview-v28 .ss22-chapter-links a {
  font: 400 13px/1.5 Arial, Helvetica, sans-serif !important;
  color: var(--v27-ink, #30382e) !important; padding: 4px 0 !important;
}
html body.ss18 #main.buyer-overview-v28 .buyer-overview-chapter {
  display: grid !important; grid-template-columns: minmax(0, 1.06fr) minmax(0, 1fr) !important;
  align-items: center !important; gap: 28px !important;
  max-width: 1380px !important; margin: 0 auto !important;
  padding: 36px 32px !important; min-height: 0 !important;
  background: var(--v27-paper, #f8f7f3) !important;
  scroll-margin-top: 110px;
}
html body.ss18 #main.buyer-overview-v28 .buyer-overview-reverse { grid-template-columns: minmax(0, 1fr) minmax(0, 1.06fr) !important; }
html body.ss18 #main.buyer-overview-v28 .buyer-overview-reverse .buyer-overview-photo { grid-column: 2; grid-row: 1; }
html body.ss18 #main.buyer-overview-v28 .buyer-overview-reverse .ss24-chapter-copy { grid-column: 1; grid-row: 1; }
html body.ss18 #main.buyer-overview-v28 .buyer-overview-photo {
  margin: 0 !important; padding: 0 !important; width: 100% !important;
  height: auto !important; overflow: visible !important; aspect-ratio: auto !important;
  background: none !important;
}
html body.ss18 #main.buyer-overview-v28 .buyer-overview-photo img {
  width: 100% !important; height: auto !important; max-height: none !important;
  aspect-ratio: auto !important; object-fit: contain !important; transform: none !important;
}
html body.ss18 #main.buyer-overview-v28 .buyer-overview-chapter .ss24-chapter-copy {
  width: 100% !important; max-width: none !important; margin: 0 !important;
  padding: 32px 30px !important; min-height: 0 !important;
  background: #fff !important; border: 1px solid #e6e7df !important;
  box-shadow: none !important; text-align: center !important;
}
html body.ss18 #main.buyer-overview-v28 .buyer-overview-chapter .ss24-number { margin: 0 auto 16px !important; }
html body.ss18 #main.buyer-overview-v28 .buyer-overview-chapter .ss24-number b {
  font: 400 14px/1.4 Arial, Helvetica, sans-serif !important;
  color: var(--v27-sage, #48533e) !important;
}
html body.ss18 #main.buyer-overview-v28 .buyer-overview-chapter .ss24-chapter-copy h2 {
  font: 400 clamp(27px, 2.6vw, 38px)/1.2 Arial, Helvetica, sans-serif !important;
  letter-spacing: -.025em !important; margin: 0 0 20px !important;
  color: var(--v27-ink, #30382e) !important; text-align: center !important;
}
html body.ss18 #main.buyer-overview-v28 .buyer-overview-chapter .ss24-chapter-copy p {
  font: 400 16px/1.75 Arial, Helvetica, sans-serif !important;
  color: var(--v27-ink, #30382e) !important; margin: 0 auto 14px !important;
  text-align: center !important;
}
html body.ss18 #main.buyer-overview-v28 .buyer-stage-link-v28,
html body.ss18 #main.design-hub-v28 .loanLearn a {
  display: inline-flex !important; align-items: center !important; gap: 10px !important;
  margin: 6px auto 0 !important; padding: 7px 0 !important;
  border-bottom: 1px solid var(--v27-sage, #48533e) !important;
  color: var(--v27-sage, #48533e) !important;
  font: 400 13px/1.5 Arial, Helvetica, sans-serif !important;
  letter-spacing: .08em !important; text-transform: uppercase !important;
  text-decoration: none !important;
}
html body.ss18 #main.buyer-overview-v28 .buyer-overview-cta {
  max-width: 1060px !important; width: calc(100% - 64px) !important;
  margin: 16px auto 0 !important;
}
html body.ss18 #main .v28-sr-only {
  position: absolute !important; width: 1px !important; height: 1px !important;
  margin: -1px !important; padding: 0 !important; overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important;
}
/* Static Life Changes-style cards. Content height follows the text, never a flip face. */
html body.ss18 #main.design-hub-v28 .loanHubHero { padding: 34px 24px 28px !important; margin: 0 auto !important; }
html body.ss18 #main.design-hub-v28 .loanHubHero h1 {
  font: 400 clamp(30px, 3vw, 46px)/1.2 Arial, Helvetica, sans-serif !important;
  letter-spacing: -.025em !important; margin: 0 auto 16px !important; text-align: center !important;
}
html body.ss18 #main.design-hub-v28 .loanHubHero p { max-width: 800px !important; margin: 0 auto !important; text-align: center !important; }
html body.ss18 #main.design-hub-v28 .loanHubGridWrap {
  width: 100% !important; max-width: 1380px !important; margin: 0 auto !important;
  padding: 0 32px !important; background: transparent !important;
}
html body.ss18 #main.design-hub-v28 .loanHubGrid {
  display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  width: 100% !important; margin: 0 !important; padding: 0 !important;
  gap: 26px !important; align-items: stretch !important;
}
html body.ss18 #main.design-hub-v28 .loanHubItem {
  display: flex !important; flex-direction: column !important;
  min-width: 0 !important; min-height: 0 !important; height: auto !important;
  align-self: stretch !important; background: #fff !important;
  border: 1px solid var(--v27-rule, #cdd1c3) !important;
}
html body.ss18 #main.design-hub-v28 .loanHubItem .ss18-card-photo,
html body.ss18 #main.design-hub-v28 .loanHubItem .ss18-card-photo img {
  display: block !important; width: 100% !important; height: auto !important;
  aspect-ratio: auto !important; margin: 0 !important; padding: 0 !important;
  max-height: none !important; object-fit: contain !important; background: transparent !important;
}
html body.ss18 #main.design-hub-v28 .loanHubItem .final-static-answer {
  flex: 1 1 auto !important; min-height: 0 !important; padding: 22px !important;
  gap: 12px !important; position: static !important; transform: none !important;
}
html body.ss18 #main.design-hub-v28 .loanHubItem .final-static-answer h2 {
  font: 400 22px/1.32 Arial, Helvetica, sans-serif !important;
  text-align: center !important; letter-spacing: -.02em !important; margin: 0 !important;
  color: var(--v27-ink, #30382e) !important;
}
html body.ss18 #main.design-hub-v28 .loanHubItem .final-static-answer-copy p {
  font: 400 15px/1.7 Arial, Helvetica, sans-serif !important; margin: 0 !important;
  color: var(--v27-ink, #30382e) !important; text-align: left !important;
}
html body.ss18 #main.design-hub-v28 .loanHubItem .topic {
  font: 400 11px/1.4 Arial, Helvetica, sans-serif !important;
  text-transform: uppercase !important; letter-spacing: .08em !important;
  color: var(--v27-sage, #48533e) !important;
}
html body.ss18 #main.design-hub-v28 .loanHubItem .loanLearn {
  flex: 0 0 auto !important; padding: 12px 22px !important; margin: 0 !important;
  border-top: 1px solid var(--v27-rule, #cdd1c3) !important;
  text-align: center !important; position: static !important;
}
html body.ss18 #main.design-hub-v28 .loanLearn a { margin: 0 !important; }
html body.ss18 #main.design-hub-v28 .final-single-cta { max-width: 1060px !important; width: calc(100% - 64px) !important; margin-left: auto !important; margin-right: auto !important; }
/* Individual articles use the existing Life Changes reading layout, with the image inside the paper. */
html body.ss18 #main.design-article-v28 .ss21-article-heading {
  max-width: 940px !important; margin: 0 auto !important; padding: 34px 12px 28px !important;
}
html body.ss18 #main.design-article-v28 .ss21-article-heading h1 {
  font: 400 clamp(29px, 3vw, 42px)/1.22 Arial, Helvetica, sans-serif !important;
  text-align: center !important; color: var(--v27-ink, #30382e) !important;
  letter-spacing: -.025em !important; margin: 0 !important;
}
html body.ss18 #main.design-article-v28 .design-article-paper-v28 {
  width: 100% !important; max-width: 900px !important; padding: 24px 30px 32px !important;
  margin: 0 auto !important; background: #fff !important;
  border: 1px solid var(--v27-rule, #cdd1c3) !important;
}
html body.ss18 #main.design-article-v28 .design-article-paper-v28 .ss21-article-photo {
  width: 100% !important; max-width: none !important; height: auto !important;
  margin: 0 !important; padding: 0 !important; background: transparent !important;
}
html body.ss18 #main.design-article-v28 .design-article-paper-v28 .ss21-article-photo img {
  width: 100% !important; max-width: 100% !important; height: auto !important;
  max-height: none !important; aspect-ratio: auto !important; object-fit: contain !important;
  display: block !important; margin: 0 !important;
}
html body.ss18 #main.design-article-v28 .ss21-opening { padding: 26px 0 !important; }
html body.ss18 #main.design-article-v28 .ss21-opening p {
  font: 400 18px/1.75 Arial, Helvetica, sans-serif !important;
  text-align: left !important; color: var(--v27-ink, #30382e) !important;
}
html body.ss18 #main.design-article-v28 .ss21-section { padding-top: 28px !important; }
html body.ss18 #main.design-article-v28 .ss21-section h2 {
  font: 400 clamp(23px, 2.3vw, 29px)/1.3 Arial, Helvetica, sans-serif !important;
  text-align: center !important; letter-spacing: -.02em !important;
  color: var(--v27-ink, #30382e) !important;
}
html body.ss18 #main.design-article-v28 .ss21-section p {
  font: 400 16px/1.8 Arial, Helvetica, sans-serif !important;
  color: var(--v27-ink, #30382e) !important; text-align: left !important;
}
html body.ss18 #main.design-article-v28 .final-single-cta { width: 100% !important; max-width: 900px !important; margin-left: auto !important; margin-right: auto !important; }
html body.ss18 #main.buyer-overview-v28 a:focus-visible,
html body.ss18 #main.design-hub-v28 a:focus-visible,
html body.ss18 #main.design-article-v28 a:focus-visible {
  outline: 2px solid var(--v27-sage, #48533e); outline-offset: 5px;
}
@media (max-width: 980px) {
  html body.ss18 #main.buyer-overview-v28 .buyer-overview-chapter { padding: 28px 24px !important; gap: 22px !important; }
  html body.ss18 #main.buyer-overview-v28 .buyer-overview-chapter .ss24-chapter-copy { padding: 25px 22px !important; }
  html body.ss18 #main.design-hub-v28 .loanHubGrid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 22px !important; }
}
@media (max-width: 720px) {
  html body.ss18 #main.buyer-overview-v28 .ss22-service-hero { padding: 24px 20px !important; }
  html body.ss18 #main.buyer-overview-v28 .ss22-hero-caption { margin-top: 16px !important; width: 100% !important; margin-left: 0 !important; }
  html body.ss18 #main.buyer-overview-v28 .ss22-chapter-links { gap: 6px 20px !important; padding: 15px 18px !important; }
  html body.ss18 #main.buyer-overview-v28 .buyer-overview-chapter {
    display: flex !important; flex-direction: column !important; gap: 18px !important;
    padding: 26px 20px !important;
  }
  html body.ss18 #main.buyer-overview-v28 .buyer-overview-photo { order: 0 !important; }
  html body.ss18 #main.buyer-overview-v28 .buyer-overview-chapter .ss24-chapter-copy { order: 1 !important; padding: 25px 22px !important; }
  html body.ss18 #main.buyer-overview-v28 .buyer-overview-chapter .ss24-chapter-copy h2 { font-size: 29px !important; }
  html body.ss18 #main.buyer-overview-v28 .buyer-overview-chapter .ss24-chapter-copy p { font-size: 15px !important; }
  html body.ss18 #main.buyer-overview-v28 .buyer-overview-cta { width: calc(100% - 40px) !important; margin-left: auto !important; margin-right: auto !important; }
}
@media (max-width: 620px) {
  html body.ss18 #main.design-hub-v28 .loanHubGridWrap { padding: 0 18px !important; }
  html body.ss18 #main.design-hub-v28 .loanHubGrid { grid-template-columns: 1fr !important; gap: 24px !important; }
  html body.ss18 #main.design-hub-v28 .final-single-cta { width: calc(100% - 36px) !important; }
  html body.ss18 #main.design-article-v28 { padding-left: 18px !important; padding-right: 18px !important; }
  html body.ss18 #main.design-article-v28 .design-article-paper-v28 { padding: 14px 18px 24px !important; }
  html body.ss18 #main.design-article-v28 .ss21-opening p { font-size: 17px !important; }
}