/* The Strategic Stewardship diagnostic. Tokens come from the site's own stylesheet (assets/site.css). */
*{box-sizing:border-box}
html{background:var(--ss-cream,#F7F4EF)}
body{margin:0;min-height:100%;color:var(--text-body,#2b2f38);font-family:var(--font-body,"Open Sans",-apple-system,"Segoe UI",sans-serif);font-size:16px;line-height:1.65}
#root{min-height:100vh;display:flex;flex-direction:column}
a{color:var(--text-heading,#17263D)}
.ssd-header{background:var(--ss-midnight,#17263D);color:var(--ss-on-dark-muted,#C3CBD9);padding:26px 20px 22px;text-align:center}
.ssd-header .mono{display:inline-block;font-family:var(--font-display,Georgia,serif);font-size:44px;letter-spacing:-0.19em;padding-right:.19em;line-height:1;color:var(--ss-cream,#F7F4EF);text-decoration:none;border-bottom:0}
.ssd-header .tagline{font-size:11px;letter-spacing:.28em;text-transform:uppercase;margin-top:8px}
.ssd-progress{display:flex;gap:6px;max-width:640px;margin:18px auto 0}
.ssd-progress span{flex:1;height:3px;background:rgba(255,255,255,.14)}
.ssd-progress span.on{background:var(--ss-gold-leaf,#B7934B)}
.ssd-main{flex:1;width:100%;max-width:680px;margin:0 auto;padding:34px 20px 60px}
.ssd-eyebrow{font-size:12px;letter-spacing:.28em;text-transform:uppercase;color:var(--text-muted,#6b6f78);margin:0 0 12px}
h1.ssd-h{font-family:var(--font-heading,Georgia,serif);font-weight:400;font-size:clamp(26px,3.4vw,36px);line-height:1.2;color:var(--text-heading,#17263D);margin:0 0 18px}
h2.ssd-q{font-family:var(--font-heading,Georgia,serif);font-weight:400;font-size:clamp(20px,2.6vw,25px);line-height:1.3;color:var(--text-heading,#17263D);margin:0 0 20px}
.ssd-lede p{margin:0 0 14px;font-size:17px}
.ssd-opt{display:block;width:100%;text-align:left;cursor:pointer;background:#fff;border:1px solid var(--ss-warm-hairline,#D8CFC2);color:var(--text-heading,#17263D);font-family:inherit;font-size:15.5px;padding:14px 18px;margin:0 0 10px;transition:border-color .15s,transform .15s}
.ssd-opt:hover{border-color:var(--ss-midnight,#17263D);transform:translateX(2px)}
.ssd-opt.on{background:var(--ss-linen,#E7E0D6);border-color:var(--ss-midnight,#17263D)}
.ssd-btn{display:inline-block;cursor:pointer;border:0;background:var(--ss-midnight,#17263D);color:#F7F4EF;font-family:inherit;font-size:13px;letter-spacing:.2em;text-transform:uppercase;padding:14px 26px;text-decoration:none}
.ssd-btn:disabled{opacity:.45;cursor:default}
.ssd-btn.quiet{background:transparent;color:var(--text-heading,#17263D);border:1px solid var(--ss-warm-hairline,#D8CFC2)}
.ssd-row{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-top:18px}
.ssd-back{background:none;border:0;color:var(--text-muted,#6b6f78);font-family:inherit;font-size:13px;cursor:pointer;padding:0}
.ssd-field{display:block;width:100%;font-family:inherit;font-size:16px;line-height:1.5;padding:13px 14px;border:1px solid var(--ss-warm-hairline,#D8CFC2);background:#fff;color:var(--text-heading,#17263D);resize:vertical}
.ssd-field:focus{outline:2px solid var(--ss-midnight,#17263D);outline-offset:1px}
.ssd-hint{font-size:13px;color:var(--text-muted,#6b6f78);margin:8px 0 0}
.ssd-chat{display:flex;flex-direction:column;gap:18px;margin:0 0 20px}
.ssd-msg{display:flex;gap:12px;align-items:flex-start}
.ssd-msg.user{flex-direction:row-reverse}
.ssd-bubble{max-width:84%;padding:13px 17px;font-size:15.5px;line-height:1.62;white-space:pre-wrap}
.ssd-msg.coach .ssd-bubble{background:#fff;border-left:2px solid var(--ss-gold-leaf,#B7934B)}
.ssd-msg.user .ssd-bubble{background:var(--ss-linen,#E7E0D6);color:var(--text-heading,#17263D)}
.ssd-avatar{width:30px;height:30px;flex:0 0 30px;display:flex;align-items:center;justify-content:center;font-family:var(--font-display,Georgia,serif);font-size:15px;letter-spacing:-0.19em;padding-right:.19em;color:var(--ss-cream,#F7F4EF);background:var(--ss-midnight,#17263D);border-radius:50%}
.ssd-dots{display:flex;gap:5px;padding:4px 2px}
.ssd-dots span{width:7px;height:7px;border-radius:50%;background:var(--ss-gold-leaf,#B7934B);animation:ssdpulse 1s infinite ease-in-out}
.ssd-dots span:nth-child(2){animation-delay:.16s}.ssd-dots span:nth-child(3){animation-delay:.32s}
@keyframes ssdpulse{0%,100%{opacity:.3;transform:translateY(0)}50%{opacity:1;transform:translateY(-3px)}}
.ssd-compose{display:flex;gap:10px;align-items:flex-end}
.ssd-compose textarea{flex:1;min-height:52px;max-height:220px}
.ssd-read{background:#fff;padding:30px 28px;border-top:3px solid var(--ss-gold-leaf,#B7934B);margin:0 0 30px}
.ssd-read h3{font-family:var(--font-heading,Georgia,serif);font-weight:400;font-size:21px;line-height:1.3;color:var(--text-heading,#17263D);margin:26px 0 10px}
.ssd-read h3:first-child{margin-top:0}
.ssd-read p{margin:0 0 14px;font-size:16.5px}
.ssd-title{font-family:var(--font-heading,Georgia,serif);font-weight:400;font-size:clamp(22px,3vw,30px);line-height:1.25;color:var(--text-heading,#17263D);margin:0 0 20px}
.ssd-invite{margin:34px 0 0;padding:28px 0 0;border-top:1px solid var(--ss-warm-hairline,#D8CFC2)}
.ssd-invite p{margin:0 0 14px;font-size:16px}
.ssd-doors{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin:22px 0 0}
.ssd-note{font-size:14px;color:var(--text-muted,#6b6f78);margin:14px 0 0}
.ssd-footer{padding:26px 20px 40px;text-align:center;font-size:13px;color:var(--text-muted,#6b6f78)}
.ssd-crisis p{font-size:17px;margin:0 0 14px}
@media (max-width:480px){.ssd-main{padding:26px 16px 50px}.ssd-read{padding:24px 18px}.ssd-bubble{max-width:92%}}
/* Fit Check additions */
.ssd-result{background:#fff;padding:30px 28px;border-top:3px solid var(--ss-gold-leaf,#B7934B);margin:0 0 26px}
.ssd-result p{margin:0 0 14px;font-size:16.5px}
.ssd-result p:last-child{margin-bottom:0}
.ssd-tester{position:fixed;right:12px;bottom:12px;z-index:9;background:#17263D;color:#C3CBD9;font:12px/1.5 monospace;padding:12px 14px;max-width:320px;border-top:2px solid #B7934B}
.ssd-tester b{color:#F7F4EF}.ssd-tester button{margin:6px 6px 0 0;font:inherit;cursor:pointer;background:#2b3a55;color:#F7F4EF;border:0;padding:4px 8px}
.ssd-tester pre{white-space:pre-wrap;word-break:break-word;margin:8px 0 0;max-height:200px;overflow:auto;color:#C3CBD9}
/* The Make More, Keep More Assessment additions (24 Oct 2026): cover sub-line, question line, follow-up box */
.ssd-sub{font-family:var(--font-heading,Georgia,serif);font-size:clamp(18px,2.4vw,22px);line-height:1.4;color:var(--text-heading,#17263D);margin:0 0 22px}
.ssd-lead{font-style:italic;color:var(--text-heading,#17263D)}
.ssd-followup{margin-top:18px;padding:18px 18px 4px;background:#fff;border-left:2px solid var(--ss-gold-leaf,#B7934B)}
.ssd-fu-q{font-family:var(--font-heading,Georgia,serif);font-size:17px;line-height:1.4;color:var(--text-heading,#17263D);margin:0 0 12px}

/* The cover / briefing title crosses the page instead of folding (Abi, 24 Oct 2026): left edge stays on the column */
@media (min-width:760px){h1.ssd-h.wide{width:calc(50vw + 300px);max-width:1100px}}

/* Every outlined (transparent) button lights up gold on hover and keyboard focus (Abi, 24 Oct 2026) */
.ssd-btn.quiet{transition:background .18s,color .18s,border-color .18s}
.ssd-btn.quiet:hover,.ssd-btn.quiet:focus-visible{background:var(--ss-gold-leaf,#B7934B);color:#17263D;border-color:var(--ss-gold-leaf,#B7934B)}

/* The Success (result) screen, Design's layout of 26 Oct 2026: text beside a photo, photo above on a phone */
.ssr{min-height:100vh;display:flex;flex-wrap:wrap-reverse;background:var(--ss-paper,#EFEAE0);color:#3D4759}
.ssr-col{flex:1 1 560px;min-width:0;display:flex;flex-direction:column;padding:40px clamp(24px,6vw,96px)}
.ssr-head{display:flex;align-items:center;gap:16px;padding-bottom:20px;border-bottom:1px solid var(--ss-linen,#E7E0D6)}
.ssr-mono{font-family:var(--font-heading,"Libre Baskerville",serif);font-size:22px;letter-spacing:.08em;color:var(--ss-midnight,#17263D);text-decoration:none;border-bottom:0}
.ssr-tag{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:#7C8598}
.ssr-main{flex:1;display:flex;flex-direction:column;justify-content:center;gap:28px;max-width:620px;padding:56px 0}
.ssr-main p{margin:0;text-wrap:pretty}
.ssr-eyebrow{font-size:13px;letter-spacing:.28em;text-transform:uppercase;color:#7C8598}
.ssr-title{margin:0;font-family:var(--font-heading,"Libre Baskerville",serif);font-weight:400;font-size:clamp(34px,4vw,52px);line-height:1.1;color:var(--ss-midnight,#17263D);text-wrap:pretty}
.ssr-title span{display:block;font-style:italic;color:var(--ss-gold-foil,#AF884F)}
.ssr-rule{width:64px;height:2px;background:var(--ss-gold-foil,#AF884F)}
.ssr-body{font-size:18px;line-height:1.65}
.ssr-pull{font-family:var(--font-heading,"Libre Baskerville",serif);font-style:italic;font-size:clamp(24px,2.4vw,30px);line-height:1.3;color:var(--ss-midnight,#17263D)}
.ssr-doors{display:flex;flex-wrap:wrap;gap:14px;padding-top:8px}
.ssr-btn{display:inline-flex;align-items:center;padding:20px 34px;background:var(--ss-midnight,#17263D);color:#F7F4EF;font-size:14px;letter-spacing:.22em;text-transform:uppercase;text-decoration:none;border:1px solid var(--ss-midnight,#17263D);transition:background .18s,color .18s,border-color .18s}
.ssr-btn:hover{background:#24395A;color:#F7F4EF}
.ssr-btn.quiet{background:transparent;color:var(--ss-midnight,#17263D);border-color:#C5BAAD}
.ssr-btn.quiet:hover,.ssr-btn.quiet:focus-visible{background:var(--ss-gold-leaf,#B7934B);border-color:var(--ss-gold-leaf,#B7934B);color:#17263D}
.ssr-note{font-size:15px;line-height:1.6;color:#7C8598}
.ssr-foot{display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;padding-top:20px;border-top:1px solid var(--ss-linen,#E7E0D6);font-size:13px;color:#7C8598}
.ssr-foot a,.ssr-foot button{color:#7C8598;font:inherit;background:none;border:0;padding:0;text-decoration:underline;cursor:pointer}
.ssr-foot-links{display:flex;gap:20px}
.ssr-photo{flex:1 1 420px;position:relative;min-height:clamp(260px,42vh,100vh);overflow:hidden;background:var(--ss-midnight,#17263D)}
.ssr-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% center}
.ssr-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(to right,rgba(239,234,224,.55),rgba(239,234,224,0) 22%)}
