:root {
  --sf-navy: #122b45;
  --sf-blue: #275879;
  --sf-cream: #f7efe1;
  --sf-paper: #fffdf8;
  --sf-gold: #b98a3d;
  --sf-ink: #21313d;
  --sf-muted: #5d6d77;
  --sf-line: #ded3c1;
  --sf-soft-blue: #eaf1f4;
}

.solutions-framework, .solutions-framework * { box-sizing: border-box; }
.solutions-framework { margin: 0; background: var(--sf-paper); color: var(--sf-ink); font-family: Arial, Helvetica, sans-serif; }
.solutions-framework a { color: inherit; }
.solutions-framework h1, .solutions-framework h2, .solutions-framework h3 { color: var(--sf-navy); font-family: Georgia, "Times New Roman", serif; }
.solutions-framework .sf-header { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; justify-content: space-between; min-height: 84px; padding: 12px 5vw; background: rgba(255,253,248,.97); border-bottom: 1px solid #e7dfd2; backdrop-filter: blur(8px); }
.solutions-framework .sf-brand { display: flex; align-items: center; gap: 12px; color: var(--sf-navy); text-decoration: none; font-weight: 800; letter-spacing: .06em; }
.solutions-framework .sf-brand img { width: 52px; height: 52px; object-fit: contain; }
.solutions-framework .sf-brand small { display: block; margin-top: 4px; color: var(--sf-muted); font-weight: 400; letter-spacing: 0; }
.solutions-framework .sf-nav { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px; }
.solutions-framework .sf-nav a { padding: 10px 11px; border-radius: 999px; color: var(--sf-navy); text-decoration: none; font-size: .86rem; font-weight: 700; }
.solutions-framework .sf-nav a:hover, .solutions-framework .sf-nav a:focus-visible { background: var(--sf-soft-blue); outline: none; }
.solutions-framework .sf-status { margin: 0; padding: 10px 5vw; background: var(--sf-navy); color: #fff; text-align: center; font-size: .82rem; font-weight: 700; letter-spacing: .025em; }
.solutions-framework .sf-hub-hero { min-height: 520px; display: flex; align-items: center; padding: 80px 7vw; background: linear-gradient(90deg,rgba(248,241,228,.99) 0%,rgba(248,241,228,.93) 46%,rgba(248,241,228,.18) 76%),url('/images/three-generation-family-hero-v2.jpg') 60% center/cover; }
.solutions-framework .sf-hub-hero > div { max-width: 690px; }
.solutions-framework .sf-eyebrow { margin: 0 0 10px; color: #936b2a; font-size: .77rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.solutions-framework .sf-hub-hero h1, .solutions-framework .sf-community-hero h1 { margin: .12em 0 .25em; font-size: clamp(3rem,6vw,5.2rem); line-height: 1.02; }
.solutions-framework .sf-lede { max-width: 670px; margin: 0; color: #43545f; font: 1.22rem/1.65 Georgia,"Times New Roman",serif; }
.solutions-framework .sf-jump-link, .solutions-framework .sf-primary-link, .solutions-framework .sf-return-link { display: inline-block; margin-top: 28px; padding: 14px 20px; border: 1px solid var(--sf-navy); border-radius: 4px; background: var(--sf-navy); color: #fff; text-decoration: none; font-weight: 800; }
.solutions-framework .sf-jump-link:hover, .solutions-framework .sf-primary-link:hover, .solutions-framework .sf-jump-link:focus-visible, .solutions-framework .sf-primary-link:focus-visible { background: var(--sf-blue); outline: 3px solid rgba(39,88,121,.2); }
.solutions-framework .sf-hub-intro, .solutions-framework .sf-community-section, .solutions-framework .sf-boundary-wrap, .solutions-framework .sf-community-grid-section { padding: 72px 6vw; }
.solutions-framework .sf-hub-intro { max-width: 960px; margin: auto; text-align: center; }
.solutions-framework .sf-hub-intro h2, .solutions-framework .sf-section-heading h2 { margin: .18em 0 .35em; font-size: clamp(2rem,4vw,3.25rem); line-height: 1.12; }
.solutions-framework .sf-hub-intro > p:last-child, .solutions-framework .sf-section-heading > p:last-child { color: var(--sf-muted); font: 1.1rem/1.72 Georgia,"Times New Roman",serif; }
.solutions-framework .sf-community-grid-section { background: var(--sf-cream); scroll-margin-top: 112px; }
.solutions-framework .sf-section-heading { max-width: 820px; margin: 0 auto 36px; text-align: center; }
.solutions-framework .sf-community-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 16px; max-width: 1500px; margin: auto; }
.solutions-framework .sf-community-card { display: flex; min-height: 100%; flex-direction: column; overflow: hidden; border: 1px solid var(--sf-line); background: #fff; box-shadow: 0 9px 26px rgba(29,43,54,.07); text-decoration: none; transition: transform .18s ease,box-shadow .18s ease; }
.solutions-framework .sf-community-card:hover, .solutions-framework .sf-community-card:focus-visible { transform: translateY(-4px); box-shadow: 0 16px 32px rgba(29,43,54,.14); outline: 3px solid rgba(39,88,121,.18); }
.solutions-framework .sf-community-card img { width: 100%; height: 168px; object-fit: cover; }
.solutions-framework .sf-community-card > span { display: flex; flex: 1; flex-direction: column; padding: 21px; }
.solutions-framework .sf-community-card h3 { margin: 0; font-size: 1.45rem; }
.solutions-framework .sf-community-card p { flex: 1; color: var(--sf-muted); font-size: .94rem; line-height: 1.55; }
.solutions-framework .sf-community-card em { color: var(--sf-blue); font-size: .88rem; font-style: normal; font-weight: 800; }
.solutions-framework .sf-boundary-card { max-width: 1120px; margin: 0 auto; padding: 28px; border-left: 5px solid var(--sf-gold); background: var(--sf-soft-blue); }
.solutions-framework .sf-boundary-card h2 { margin-top: 0; font-size: 1.55rem; }
.solutions-framework .sf-boundary-card p { margin-bottom: 0; line-height: 1.7; }
.solutions-framework .sf-community-hero { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(320px,.95fr); min-height: 525px; background: var(--sf-cream); }
.solutions-framework .sf-community-hero-copy { display: flex; flex-direction: column; justify-content: center; padding: 70px 7vw; }
.solutions-framework .sf-community-hero-image { min-height: 420px; }
.solutions-framework .sf-community-hero-image img { width: 100%; height: 100%; object-fit: cover; }
.solutions-framework .sf-community-section { max-width: 1250px; margin: auto; }
.solutions-framework .sf-two-column { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 54px; }
.solutions-framework .sf-content-block h2 { margin: 0 0 14px; font-size: clamp(1.8rem,3vw,2.6rem); }
.solutions-framework .sf-content-block > p, .solutions-framework .sf-content-block li { color: #445660; line-height: 1.7; }
.solutions-framework .sf-check-list { margin: 18px 0 0; padding: 0; list-style: none; }
.solutions-framework .sf-check-list li { position: relative; margin: 0 0 13px; padding-left: 26px; }
.solutions-framework .sf-check-list li::before { position: absolute; left: 0; content: "✓"; color: #8b692e; font-weight: 900; }
.solutions-framework .sf-options-section { padding: 72px 6vw; background: var(--sf-cream); }
.solutions-framework .sf-options-section .sf-inner { max-width: 1250px; margin: auto; }
.solutions-framework .sf-options-intro { max-width: 900px; }
.solutions-framework .sf-options-intro h2 { margin: .2em 0; font-size: clamp(2rem,4vw,3rem); }
.solutions-framework .sf-options-intro > p:last-child { color: var(--sf-muted); font: 1.06rem/1.7 Georgia,"Times New Roman",serif; }
.solutions-framework .sf-option-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; margin-top: 32px; }
.solutions-framework .sf-option-card { padding: 24px; border: 1px solid var(--sf-line); background: #fff; }
.solutions-framework .sf-option-card h3 { margin: 0 0 9px; font-size: 1.3rem; }
.solutions-framework .sf-option-card p { margin: 0; color: var(--sf-muted); line-height: 1.6; }
.solutions-framework .sf-program-boundary, .solutions-framework .sf-role-boundary, .solutions-framework .sf-partner-boundary { margin: 28px 0 0; padding: 22px 24px; border: 1px solid #c6d3d9; background: var(--sf-soft-blue); line-height: 1.7; }
.solutions-framework .sf-partner-boundary { border-color: #d1b885; background: #fff7e8; font-weight: 700; }
.solutions-framework .sf-inquiry-section { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 38px; }
.solutions-framework .sf-inquiry-section h2 { margin: .2em 0; font-size: clamp(2rem,4vw,3rem); }
.solutions-framework .sf-inquiry-section p { max-width: 800px; color: var(--sf-muted); line-height: 1.7; }
.solutions-framework .sf-inquiry-action { text-align: center; }
.solutions-framework .sf-inquiry-action small { display: block; max-width: 300px; margin-top: 11px; color: var(--sf-muted); line-height: 1.45; }
.solutions-framework .sf-return-row { border-top: 1px solid var(--sf-line); padding: 30px 6vw 60px; text-align: center; }
.solutions-framework .sf-return-link { margin: 0; background: transparent; color: var(--sf-navy); }
.solutions-framework .sf-footer { display: grid; grid-template-columns: 1.2fr 2fr; gap: 50px; padding: 50px 6vw; background: var(--sf-navy); color: #fff; }
.solutions-framework .sf-footer p { color: #cad6dc; line-height: 1.6; }
.solutions-framework .sf-footer-links { display: flex; flex-wrap: wrap; align-content: flex-start; justify-content: flex-end; gap: 8px 16px; }
.solutions-framework .sf-footer-links a { color: #e1e9ed; text-decoration: none; font-size: .9rem; }
.solutions-framework .sf-footer-links a:hover, .solutions-framework .sf-footer-links a:focus-visible { text-decoration: underline; }
.solutions-framework .sf-footer-note { grid-column: 1/-1; padding-top: 18px; border-top: 1px solid #3d5366; font-size: .82rem; }

@media (max-width: 1120px) {
  .solutions-framework .sf-community-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .solutions-framework .sf-option-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 800px) {
  .solutions-framework .sf-header { align-items: flex-start; padding: 10px 16px; }
  .solutions-framework .sf-brand span { display: none; }
  .solutions-framework .sf-nav { max-width: 360px; }
  .solutions-framework .sf-nav a { padding: 8px 7px; font-size: .75rem; }
  .solutions-framework .sf-status { padding: 9px 18px; font-size: .72rem; }
  .solutions-framework .sf-hub-hero { min-height: 625px; padding: 55px 24px; background: linear-gradient(180deg,rgba(248,241,228,.99) 0%,rgba(248,241,228,.93) 62%,rgba(248,241,228,.28) 100%),url('/images/three-generation-family-hero-v2.jpg') 66% center/cover; }
  .solutions-framework .sf-hub-hero h1, .solutions-framework .sf-community-hero h1 { font-size: clamp(2.75rem,12vw,4rem); }
  .solutions-framework .sf-hub-intro, .solutions-framework .sf-community-section, .solutions-framework .sf-boundary-wrap, .solutions-framework .sf-community-grid-section, .solutions-framework .sf-options-section { padding: 52px 22px; }
  .solutions-framework .sf-community-grid, .solutions-framework .sf-option-grid, .solutions-framework .sf-two-column { grid-template-columns: 1fr; }
  .solutions-framework .sf-community-card { display: grid; grid-template-columns: 118px 1fr; }
  .solutions-framework .sf-community-card img { width: 118px; height: 100%; min-height: 190px; }
  .solutions-framework .sf-community-card > span { padding: 18px; }
  .solutions-framework .sf-community-hero { grid-template-columns: 1fr; }
  .solutions-framework .sf-community-hero-copy { padding: 52px 24px; }
  .solutions-framework .sf-community-hero-image { min-height: 320px; max-height: 400px; }
  .solutions-framework .sf-inquiry-section { grid-template-columns: 1fr; }
  .solutions-framework .sf-inquiry-action { text-align: left; }
  .solutions-framework .sf-footer { grid-template-columns: 1fr; gap: 22px; padding: 42px 22px; }
  .solutions-framework .sf-footer-links { justify-content: flex-start; }
  .solutions-framework .sf-footer-note { grid-column: 1; }
}

@media (max-width: 520px) {
  .solutions-framework .sf-nav a:nth-last-child(-n+2) { display: none; }
  .solutions-framework .sf-community-card { grid-template-columns: 96px 1fr; }
  .solutions-framework .sf-community-card img { width: 96px; }
  .solutions-framework .sf-community-card h3 { font-size: 1.25rem; }
  .solutions-framework .sf-community-card p { font-size: .88rem; }
}

/* Family guided experience */
.sf-family-experience .sf-family-hero { min-height: 610px; }
.sf-family-experience .sf-family-hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 14px 20px; }
.sf-family-experience .sf-family-secondary-link { margin-top: 28px; color: var(--sf-navy); font-weight: 800; text-underline-offset: 4px; }
.sf-family-experience .sf-family-free-note { margin: 18px 0 0; color: var(--sf-muted); font-size: .9rem; font-weight: 700; }
.sf-family-experience .sf-family-section-inner { width: min(1320px, 88vw); margin: 0 auto; }
.sf-family-experience .sf-family-how { padding: 72px 0; background: var(--sf-paper); }
.sf-family-experience .sf-family-how-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin-top: 36px; border-top: 1px solid var(--sf-line); border-bottom: 1px solid var(--sf-line); }
.sf-family-experience .sf-family-how-grid article { min-height: 210px; padding: 28px 24px; }
.sf-family-experience .sf-family-how-grid article + article { border-left: 1px solid var(--sf-line); }
.sf-family-experience .sf-family-how-grid span { color: var(--sf-gold); font: 700 1.55rem/1 Georgia, serif; }
.sf-family-experience .sf-family-how-grid h3 { margin: 18px 0 10px; font-size: 1.42rem; }
.sf-family-experience .sf-family-how-grid p { margin: 0; color: var(--sf-muted); line-height: 1.58; }

.sf-family-experience .sf-family-guidance { padding: 72px 0 88px; scroll-margin-top: 112px; background: linear-gradient(180deg, var(--sf-cream), #fffdf8); }
.sf-family-experience .sf-family-progress { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); margin-bottom: 46px; overflow: hidden; border: 1px solid var(--sf-line); background: #fff; }
.sf-family-experience .sf-family-progress span { display: flex; min-height: 62px; align-items: center; justify-content: center; gap: 9px; padding: 10px; color: var(--sf-muted); font-size: .8rem; font-weight: 800; text-align: center; }
.sf-family-experience .sf-family-progress span + span { border-left: 1px solid var(--sf-line); }
.sf-family-experience .sf-family-progress b { display: grid; width: 27px; height: 27px; place-items: center; border-radius: 50%; background: #e6ebed; color: var(--sf-navy); }
.sf-family-experience .sf-family-progress .is-current { color: var(--sf-navy); box-shadow: inset 0 -4px var(--sf-gold); }
.sf-family-experience .sf-family-progress .is-current b { background: var(--sf-gold); color: #fff; }
.sf-family-experience .sf-family-progress .is-complete { color: var(--sf-navy); }
.sf-family-experience .sf-family-progress .is-complete b { background: var(--sf-navy); color: #fff; }
.sf-family-experience .sf-family-conversation-layout { display: grid; grid-template-columns: minmax(280px, 390px) minmax(0, 760px); justify-content: center; gap: 52px; align-items: start; }
.sf-family-experience .sf-family-conversation-aside h2 { margin: 6px 0 16px; font-size: clamp(2.2rem, 4vw, 3.25rem); line-height: 1.08; }
.sf-family-experience .sf-family-conversation-aside > p:not(.sf-eyebrow):not(.sf-family-privacy) { color: var(--sf-muted); font-size: 1.05rem; line-height: 1.65; }
.sf-family-experience .sf-family-conversation-aside ul { margin: 24px 0 0; padding: 18px 0; list-style: none; border-top: 1px solid #d7c7aa; }
.sf-family-experience .sf-family-conversation-aside li { padding: 7px 0; color: var(--sf-navy); line-height: 1.45; }
.sf-family-experience .sf-family-conversation-aside li::before { margin-right: 10px; content: "—"; color: var(--sf-gold); font-weight: 900; }
.sf-family-experience .sf-family-status { margin-top: 25px; }
.sf-family-experience .sf-family-status strong { display: block; margin-bottom: 8px; color: var(--sf-navy); font-size: .85rem; }
.sf-family-experience .sf-family-status > div { height: 6px; overflow: hidden; background: #dfd3bd; }
.sf-family-experience .sf-family-status i { display: block; width: 18%; height: 100%; background: var(--sf-gold); transition: width .25s ease; }
.sf-family-experience .sf-family-text-button { margin: 18px 0 0; padding: 0; border: 0; background: transparent; color: var(--sf-navy); font-weight: 800; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.sf-family-experience .sf-family-privacy { margin-top: 26px; padding: 15px; border-left: 3px solid var(--sf-gold); background: rgba(255,255,255,.65); color: var(--sf-muted); font-size: .82rem; line-height: 1.5; }

.sf-family-experience .sf-family-chat-card { overflow: hidden; border: 1px solid #d9cdb7; border-top: 5px solid var(--sf-gold); border-radius: 5px; background: #fff; box-shadow: 0 20px 48px rgba(18,43,69,.1); }
.sf-family-experience .sf-family-chat-heading { display: flex; align-items: center; gap: 13px; padding: 19px 24px; border-bottom: 1px solid var(--sf-line); background: #fff9ed; }
.sf-family-experience .sf-family-chat-heading strong, .sf-family-experience .sf-family-chat-heading small { display: block; }
.sf-family-experience .sf-family-chat-heading strong { color: var(--sf-navy); font: 700 1.08rem/1.2 Georgia, serif; }
.sf-family-experience .sf-family-chat-heading small { margin-top: 4px; color: var(--sf-muted); }
.sf-family-experience .sf-family-guide-mark { display: grid; flex: 0 0 42px; width: 42px; height: 42px; place-items: center; border-radius: 50%; background: var(--sf-navy); color: #f3cc77; font: 700 .84rem/1 Georgia, serif; }
.sf-family-experience .sf-family-chat-log { display: flex; min-height: 350px; max-height: 520px; flex-direction: column; gap: 19px; overflow: auto; padding: 30px; }
.sf-family-experience .sf-family-message { display: flex; align-items: flex-start; gap: 12px; }
.sf-family-experience .sf-family-message p { max-width: 84%; margin: 0; padding: 16px 19px; border-radius: 2px 16px 16px; background: #f7efe1; color: var(--sf-navy); font-size: 1.02rem; line-height: 1.58; }
.sf-family-experience .sf-family-message-visitor { justify-content: flex-end; }
.sf-family-experience .sf-family-message-visitor p { border-radius: 16px 2px 16px 16px; background: var(--sf-navy); color: #fff; }
.sf-family-experience .sf-family-suggested-replies { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 0 30px 24px; }
.sf-family-experience .sf-family-suggested-replies button, .sf-family-experience .sf-family-topic-buttons button { border: 1px solid #d3c5aa; border-radius: 4px; background: #fffdf8; color: var(--sf-navy); font-weight: 800; text-align: left; cursor: pointer; }
.sf-family-experience .sf-family-suggested-replies button { padding: 13px 14px; }
.sf-family-experience .sf-family-suggested-replies button:hover, .sf-family-experience .sf-family-suggested-replies button:focus-visible, .sf-family-experience .sf-family-topic-buttons button:hover, .sf-family-experience .sf-family-topic-buttons button:focus-visible { border-color: var(--sf-gold); outline: 3px solid rgba(185,138,61,.18); background: #fff7e5; }
.sf-family-experience .sf-family-chat-form { padding: 19px 24px 24px; border-top: 1px solid var(--sf-line); background: #fff9ed; }
.sf-family-experience .sf-family-chat-form label { display: block; margin-bottom: 7px; color: var(--sf-navy); font-size: .82rem; font-weight: 800; }
.sf-family-experience .sf-family-chat-form > div { display: flex; align-items: stretch; gap: 10px; }
.sf-family-experience .sf-family-chat-form textarea { flex: 1; min-height: 60px; resize: vertical; padding: 13px 14px; border: 1px solid #cfc2aa; border-radius: 4px; background: #fff; color: var(--sf-ink); font: 1rem/1.4 Arial, sans-serif; }
.sf-family-experience .sf-family-send, .sf-family-experience .sf-family-next, .sf-family-experience .sf-family-inquiry-link { padding: 13px 18px; border: 1px solid var(--sf-navy); border-radius: 4px; background: var(--sf-navy); color: #fff; font-weight: 800; text-decoration: none; cursor: pointer; }
.sf-family-experience .sf-family-send:hover, .sf-family-experience .sf-family-send:focus-visible, .sf-family-experience .sf-family-next:hover, .sf-family-experience .sf-family-next:focus-visible, .sf-family-experience .sf-family-inquiry-link:hover, .sf-family-experience .sf-family-inquiry-link:focus-visible { background: var(--sf-blue); outline: 3px solid rgba(39,88,121,.18); }

.sf-family-experience .sf-family-results { padding: 78px 0 90px; scroll-margin-top: 110px; border-top: 1px solid var(--sf-line); background: #fff; }
.sf-family-experience .sf-family-result-screen h2 { margin: .16em 0 .35em; font-size: clamp(2.35rem, 4.6vw, 3.65rem); line-height: 1.08; }
.sf-family-experience .sf-family-result-intro > p:not(.sf-eyebrow), .sf-family-experience .sf-family-result-lede { max-width: 880px; color: var(--sf-muted); font: 1.15rem/1.65 Georgia, serif; }
.sf-family-experience .sf-family-risk-callout { max-width: 960px; margin: 26px 0 0; padding: 20px 23px; border-left: 5px solid #a74b36; background: #fff0eb; }
.sf-family-experience .sf-family-risk-callout strong { color: #7e2f20; }
.sf-family-experience .sf-family-risk-callout p { margin: 6px 0 0; line-height: 1.6; }
.sf-family-experience .sf-family-guide-results { margin-top: 34px; }
.sf-family-experience .sf-family-professional-warning { max-width: 1000px; padding: 25px 27px; border: 1px solid #d7a99b; border-left: 6px solid #a74b36; background: #fff0eb; }
.sf-family-experience .sf-family-professional-warning h3, .sf-family-experience .sf-family-guide-intro h3 { margin: 6px 0 12px; font-size: clamp(1.55rem, 3vw, 2.15rem); }
.sf-family-experience .sf-family-professional-warning p { max-width: 940px; margin: 9px 0 0; color: #553c35; line-height: 1.64; }
.sf-family-experience .sf-family-professional-warning .sf-eyebrow { color: #7e2f20; }
.sf-family-experience .sf-family-warning-boundary { padding-top: 13px; border-top: 1px solid #ddb8ad; font-weight: 700; }
.sf-family-experience .sf-family-guide-intro { max-width: 920px; margin-top: 28px; }
.sf-family-experience .sf-family-guide-intro > p:not(.sf-eyebrow) { color: var(--sf-muted); font: 1.04rem/1.62 Georgia, serif; }
.sf-family-experience .sf-family-guide-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 22px; }
.sf-family-experience .sf-family-guide-card { display: grid; grid-template-columns: 145px 1fr; gap: 22px; padding: 22px; border: 1px solid var(--sf-line); border-top: 5px solid var(--sf-gold); background: #fffdf8; }
.sf-family-experience .sf-family-guide-card.is-secondary { border-top-color: var(--sf-blue); }
.sf-family-experience .sf-family-guide-card img { width: 145px; aspect-ratio: 3 / 4; object-fit: cover; box-shadow: 0 8px 18px rgba(19, 49, 72, .15); }
.sf-family-experience .sf-family-guide-card h4 { margin: 5px 0 9px; font-size: 1.45rem; }
.sf-family-experience .sf-family-guide-card p { margin: 0 0 12px; color: var(--sf-muted); line-height: 1.58; }
.sf-family-experience .sf-family-guide-card a, .sf-family-experience .sf-family-topic-guide a, .sf-family-experience .sf-family-summary-guide a { display: inline-block; margin-top: 12px; color: var(--sf-navy); font-weight: 900; }
.sf-family-experience .sf-family-guide-prices { display: flex; flex-wrap: wrap; gap: 8px; }
.sf-family-experience .sf-family-guide-prices span { padding: 7px 10px; background: var(--sf-soft-blue); color: var(--sf-navy); font-size: .86rem; }
.sf-family-experience .sf-family-commerce-note { margin: 14px 0 0; color: var(--sf-muted); font-size: .83rem; line-height: 1.5; }
.sf-family-experience .sf-family-action-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 38px; }
.sf-family-experience .sf-family-action-grid article { display: flex; min-height: 225px; gap: 14px; padding: 25px; border: 1px solid var(--sf-line); border-top: 4px solid var(--sf-gold); background: #fffdf8; }
.sf-family-experience .sf-family-action-grid article > span { display: grid; flex: 0 0 35px; width: 35px; height: 35px; place-items: center; border-radius: 50%; background: var(--sf-gold); color: #fff; font-weight: 900; }
.sf-family-experience .sf-family-action-grid h3 { margin: 3px 0 10px; font-size: 1.45rem; }
.sf-family-experience .sf-family-action-grid p { margin: 0; color: var(--sf-muted); line-height: 1.62; }
.sf-family-experience .sf-family-screen-actions { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.sf-family-experience .sf-family-back { padding: 13px 18px; border: 1px solid var(--sf-navy); border-radius: 4px; background: transparent; color: var(--sf-navy); font-weight: 800; cursor: pointer; }
.sf-family-experience .sf-family-back:hover, .sf-family-experience .sf-family-back:focus-visible { outline: 3px solid rgba(39,88,121,.15); background: var(--sf-soft-blue); }

.sf-family-experience .sf-family-understanding-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 34px 0; }
.sf-family-experience .sf-family-understanding-grid article { padding: 23px; border: 1px solid var(--sf-line); background: #fffdf8; }
.sf-family-experience .sf-family-understanding-grid span, .sf-family-experience .sf-family-summary-grid article > span { color: #916a29; font-size: .76rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.sf-family-experience .sf-family-understanding-grid p { margin: 10px 0 0; color: var(--sf-muted); line-height: 1.6; }
.sf-family-experience .sf-family-role-box { display: grid; grid-template-columns: .8fr 1.2fr; gap: 32px; padding: 30px; border-left: 5px solid var(--sf-gold); background: var(--sf-soft-blue); }
.sf-family-experience .sf-family-role-box h3 { margin: 5px 0 0; font-size: 1.55rem; }
.sf-family-experience .sf-family-role-box > p, .sf-family-experience .sf-family-wait p { margin: 0; color: #40545f; line-height: 1.68; }
.sf-family-experience .sf-family-wait { grid-column: 1 / -1; padding-top: 22px; border-top: 1px solid #c9d8de; }
.sf-family-experience .sf-family-wait p { margin-top: 6px; }

.sf-family-experience .sf-family-topic-buttons { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 30px 0 22px; }
.sf-family-experience .sf-family-topic-buttons button { min-height: 64px; padding: 13px 16px; }
.sf-family-experience .sf-family-topic-buttons button.is-selected { border-color: var(--sf-navy); background: var(--sf-navy); color: #fff; }
.sf-family-experience .sf-family-topic-detail { padding: 32px; border: 1px solid var(--sf-line); border-top: 5px solid var(--sf-gold); background: #fffdf8; outline: none; }
.sf-family-experience .sf-family-topic-detail h3 { margin: 5px 0 12px; font-size: clamp(1.8rem, 3vw, 2.55rem); }
.sf-family-experience .sf-family-topic-intro { max-width: 930px; color: var(--sf-muted); font: 1.1rem/1.65 Georgia, serif; }
.sf-family-experience .sf-family-topic-detail ol { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin: 28px 0; padding: 0; list-style: none; counter-reset: detail-step; }
.sf-family-experience .sf-family-topic-detail li { position: relative; padding: 21px 20px 21px 52px; border: 1px solid var(--sf-line); background: #fff; color: #40545f; line-height: 1.55; counter-increment: detail-step; }
.sf-family-experience .sf-family-topic-detail li::before { position: absolute; top: 18px; left: 17px; display: grid; width: 25px; height: 25px; place-items: center; border-radius: 50%; background: var(--sf-gold); color: #fff; content: counter(detail-step); font-weight: 900; }
.sf-family-experience .sf-family-detail-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.sf-family-experience .sf-family-detail-pair > div { padding: 21px; background: var(--sf-soft-blue); }
.sf-family-experience .sf-family-detail-pair p { margin: 7px 0 0; color: #40545f; line-height: 1.58; }
.sf-family-experience .sf-family-topic-guide, .sf-family-experience .sf-family-topic-gap { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 22px; padding: 22px; border-left: 5px solid var(--sf-gold); background: #fff7e7; }
.sf-family-experience .sf-family-topic-gap { display: block; border-left-color: #a74b36; background: #fff0eb; }
.sf-family-experience .sf-family-topic-guide h4, .sf-family-experience .sf-family-topic-gap h4 { margin: 5px 0 7px; font-size: 1.25rem; }
.sf-family-experience .sf-family-topic-guide p, .sf-family-experience .sf-family-topic-gap p { margin: 0; color: var(--sf-muted); line-height: 1.58; }

.sf-family-experience .sf-family-summary-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; padding-bottom: 22px; border-bottom: 1px solid var(--sf-line); }
.sf-family-experience .sf-family-summary-heading span { padding: 9px 13px; background: var(--sf-cream); color: var(--sf-navy); font-size: .8rem; font-weight: 800; }
.sf-family-experience .sf-family-summary-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin: 30px 0; }
.sf-family-experience .sf-family-summary-grid article { padding: 26px; border: 1px solid var(--sf-line); background: #fffdf8; }
.sf-family-experience .sf-family-summary-grid article.is-priority { border-top: 5px solid var(--sf-gold); }
.sf-family-experience .sf-family-summary-grid article.is-wide { grid-column: 1 / -1; background: var(--sf-soft-blue); }
.sf-family-experience .sf-family-summary-grid h3 { margin: 10px 0 12px; font-size: 1.45rem; }
.sf-family-experience .sf-family-summary-grid p, .sf-family-experience .sf-family-summary-grid li { color: var(--sf-muted); line-height: 1.62; }
.sf-family-experience .sf-family-summary-grid ul { margin: 10px 0 0; padding-left: 20px; }
.sf-family-experience .sf-family-summary-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.sf-family-experience .sf-family-summary-actions button { padding: 12px 16px; border: 1px solid var(--sf-navy); border-radius: 4px; background: #fff; color: var(--sf-navy); font-weight: 800; cursor: pointer; }
.sf-family-experience .sf-family-summary-actions button:first-child { background: var(--sf-navy); color: #fff; }
.sf-family-experience .sf-family-save-status { margin: 13px 0 0; color: var(--sf-muted); font-size: .85rem; }
.sf-family-experience .sf-family-result-boundary { margin-top: 38px; padding: 22px 24px; border: 1px solid #d8ba81; background: #fff7e7; }
.sf-family-experience .sf-family-result-boundary p { margin: 7px 0 0; color: #5c5448; line-height: 1.62; }

@media (max-width: 1050px) {
  .sf-family-experience .sf-family-how-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sf-family-experience .sf-family-how-grid article:nth-child(3) { border-left: 0; border-top: 1px solid var(--sf-line); }
  .sf-family-experience .sf-family-how-grid article:nth-child(4) { border-top: 1px solid var(--sf-line); }
  .sf-family-experience .sf-family-conversation-layout { grid-template-columns: 1fr; max-width: 800px; margin: auto; }
  .sf-family-experience .sf-family-action-grid, .sf-family-experience .sf-family-topic-detail ol { grid-template-columns: 1fr; }
  .sf-family-experience .sf-family-guide-grid { grid-template-columns: 1fr; }
  .sf-family-experience .sf-family-action-grid article { min-height: 0; }
  .sf-family-experience .sf-family-understanding-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .sf-family-experience .sf-family-section-inner { width: min(100% - 38px, 700px); }
  .sf-family-experience .sf-family-progress { grid-template-columns: repeat(5, minmax(105px, 1fr)); overflow-x: auto; }
  .sf-family-experience .sf-family-progress span { min-width: 105px; flex-direction: column; font-size: .7rem; }
  .sf-family-experience .sf-family-topic-buttons { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sf-family-experience .sf-family-role-box { grid-template-columns: 1fr; }
  .sf-family-experience .sf-family-wait { grid-column: 1; }
  .sf-family-experience .sf-family-summary-grid, .sf-family-experience .sf-family-detail-pair { grid-template-columns: 1fr; }
  .sf-family-experience .sf-family-guide-card { grid-template-columns: 110px 1fr; }
  .sf-family-experience .sf-family-guide-card img { width: 110px; }
  .sf-family-experience .sf-family-summary-grid article.is-wide { grid-column: 1; }
}

@media (max-width: 540px) {
  .sf-family-experience .sf-family-hero-actions { align-items: stretch; flex-direction: column; }
  .sf-family-experience .sf-family-secondary-link { margin-top: 0; }
  .sf-family-experience .sf-family-how { padding: 50px 0; }
  .sf-family-experience .sf-family-how-grid { grid-template-columns: 1fr; }
  .sf-family-experience .sf-family-how-grid article + article { border-top: 1px solid var(--sf-line); border-left: 0; }
  .sf-family-experience .sf-family-how-grid article { min-height: 0; }
  .sf-family-experience .sf-family-guidance, .sf-family-experience .sf-family-results { padding: 50px 0 60px; }
  .sf-family-experience .sf-family-chat-log { min-height: 320px; padding: 20px; }
  .sf-family-experience .sf-family-message p { max-width: 91%; font-size: .97rem; }
  .sf-family-experience .sf-family-suggested-replies { grid-template-columns: 1fr; padding: 0 20px 20px; }
  .sf-family-experience .sf-family-chat-form > div { flex-direction: column; }
  .sf-family-experience .sf-family-send { width: 100%; }
  .sf-family-experience .sf-family-understanding-grid, .sf-family-experience .sf-family-topic-buttons { grid-template-columns: 1fr; }
  .sf-family-experience .sf-family-topic-detail, .sf-family-experience .sf-family-role-box { padding: 23px 20px; }
  .sf-family-experience .sf-family-screen-actions { align-items: stretch; flex-direction: column-reverse; }
  .sf-family-experience .sf-family-screen-actions > * { width: 100%; text-align: center; }
  .sf-family-experience .sf-family-summary-heading { align-items: flex-start; flex-direction: column; }
  .sf-family-experience .sf-family-summary-actions { flex-direction: column; }
  .sf-family-experience .sf-family-guide-card { grid-template-columns: 1fr; }
  .sf-family-experience .sf-family-guide-card img { width: 125px; }
  .sf-family-experience .sf-family-topic-guide { align-items: flex-start; flex-direction: column; }
}

@media print {
  .sf-family-experience .sf-header, .sf-family-experience .sf-status, .sf-family-experience .sf-community-hero, .sf-family-experience .sf-family-how, .sf-family-experience .sf-family-guidance, .sf-family-experience .sf-options-section, .sf-family-experience .sf-boundary-wrap, .sf-family-experience .sf-inquiry-section, .sf-family-experience .sf-return-row, .sf-family-experience .sf-footer, .sf-family-experience .sf-community-section, .sf-family-experience .sf-family-progress, .sf-family-experience .sf-family-screen-actions, .sf-family-experience .sf-family-summary-actions, .sf-family-experience [data-family-screen]:not([data-family-screen="summary"]) { display: none !important; }
  .sf-family-experience .sf-family-results, .sf-family-experience #family-summary-screen { display: block !important; padding: 0; }
  .sf-family-experience .sf-family-section-inner { width: 100%; }
  .sf-family-experience .sf-family-summary-grid { grid-template-columns: 1fr 1fr; }
  .sf-family-experience .sf-family-summary-grid article { break-inside: avoid; }
}
