/* Founder story: an editorial reading layout within the existing public-site palette. */
.founder-story{color:var(--ink)}
.founder-story section{padding:44px 0}
.story-byline{display:flex;justify-content:space-between;gap:24px;border-bottom:1px solid #d3bd8b;padding-bottom:15px;margin-bottom:34px;font-size:11px;color:#806b4d}
.story-byline p{margin:0;font-weight:650}.story-byline span{font-size:10px}
.story-opening-grid{display:grid;grid-template-columns:1fr 1fr;gap:75px;align-items:start}
.founder-story .story-opening h1{font:500 clamp(43px,4.8vw,65px)/1.04 Georgia,serif;letter-spacing:-.04em;margin:0}
.story-opening h1 em{font-weight:500}
.story-opening-grid>div>p{font-size:14px;line-height:1.85;color:#76634a;margin:0 0 17px;max-width:540px}
.story-opening-grid>div>.story-lead{font-size:20px;line-height:1.55;color:#4e3c26;margin-bottom:22px;max-width:520px}
.founder-story .story-voice{background:#efe5d1;border-top:1px solid #d8c6aa;border-bottom:1px solid #d8c6aa;padding:38px 0}
.story-voice-layout{display:grid;grid-template-columns:minmax(220px,300px) minmax(0,1fr);gap:75px;align-items:center}
.founder-portrait{margin:0;max-width:300px}
.founder-portrait img{display:block;width:100%;height:auto}
.story-outlook-copy{min-width:0}
.story-caption{font-size:11px;font-weight:650;line-height:1.7;color:#806b4d;margin:0 0 15px;display:block}
.story-attribution{font-size:13px;line-height:1.8;margin:34px 0 0;color:#51402c}.story-attribution span{font-size:11px;color:#806b4d}
.story-voice blockquote{margin:0}.story-voice blockquote p{font:500 clamp(31px,3.4vw,44px)/1.15 Georgia,serif;letter-spacing:-.03em;margin:0;color:#5c4323;max-width:760px}
.story-chapter-layout,.story-conversation-layout{display:grid;grid-template-columns:.8fr 1.3fr;gap:75px}
.story-chapter h2,.story-conversation h2{font:500 34px/1.13 Georgia,serif;letter-spacing:-.03em;margin:0;max-width:390px}
.story-prose p{font-size:15px;line-height:1.9;color:#746149;margin:0 0 19px;max-width:660px}.story-prose p:last-child{margin-bottom:0}
.founder-story .story-systems,.founder-story .story-community{padding-top:0}.story-community>.container,.story-systems>.container{border-top:1px solid #d3bd8b;padding-top:36px}
.story-links{display:flex;flex-wrap:wrap;gap:24px;margin-top:26px}.story-links a,.story-conversation a{font-size:12px;color:var(--purple-dark);font-weight:650;text-decoration:underline;text-underline-offset:6px;min-height:44px;display:inline-flex;align-items:center;gap:20px}
.founder-story a:focus-visible{outline:2px solid var(--purple-dark);outline-offset:5px}
.founder-story .story-conversation{border-top:1px solid #d8c6aa;background:#f1eade;padding:34px 0}
.story-conversation-layout>div>p{font-size:15px;line-height:1.85;color:#746149;max-width:580px;margin:0 0 12px}
@media(max-width:1000px){.story-opening-grid,.story-voice-layout,.story-chapter-layout,.story-conversation-layout{gap:35px}.story-opening-grid>div>.story-lead{font-size:18px}.story-chapter h2,.story-conversation h2{font-size:31px}}
@media(max-width:760px){.founder-story section{padding:32px 0}.story-opening-grid,.story-voice-layout,.story-chapter-layout,.story-conversation-layout{grid-template-columns:1fr;gap:24px}.story-byline{margin-bottom:24px;gap:16px}.founder-story .story-opening h1{font-size:46px}.story-opening-grid>div>p{font-size:14px;margin-bottom:0}.story-opening-grid>div>.story-lead{font-size:19px;margin-bottom:16px}.founder-story .story-voice{padding:30px 0}.founder-portrait{width:100%;max-width:260px;margin:0 auto}.story-caption{margin-bottom:10px}.story-attribution{margin:22px 0 0;font-size:12px}.story-voice blockquote p{font-size:33px}.story-prose p{font-size:14px;line-height:1.85;margin-bottom:17px}.story-chapter h2,.story-conversation h2{font-size:32px;max-width:550px}.story-community>.container,.story-systems>.container{padding-top:28px}.story-conversation-layout>div>p{font-size:14px}.story-links{gap:16px;margin-top:20px}}

.story-chapter h2{scroll-margin-top:170px}@media(max-width:760px){.story-chapter h2{scroll-margin-top:250px}}

.founder-story .story-caption{padding-left:22px}
.story-outlook-copy #story-voice-title{font-weight:700}
@media(max-width:760px){.founder-story .story-caption{padding-left:14px}}

.story-environment>.container{border-top:1px solid #d3bd8b;padding-top:36px}
@media(max-width:760px){.story-environment>.container{padding-top:28px}}

/* Personal opening quote beneath the story lead. */
.story-opening-quote{margin:0 0 0 22px;max-width:518px}
.story-opening-quote p{font-size:16px;line-height:1.85;color:#76634a;margin:0 0 12px}
.story-opening-quote footer{font:italic 19px/1.4 Georgia,serif;color:#51402c;text-align:right;margin-top:4px;padding-right:12px}
@media(max-width:760px){.story-opening-quote{margin-left:14px;max-width:calc(100% - 14px)}}

/* Keep the signature close to the last quote line; underline only the name. */
.story-opening-quote p{margin-bottom:0}
.story-opening-quote footer{display:flex;justify-content:flex-end;margin:2px 0 0;padding:0 12px 0 0;border:0;background:transparent;min-height:0}
.story-opening-quote footer span{display:inline-block;border-bottom:1px solid #a58c68;padding:0 3px 3px}

/* Full-width signature rule beneath the right-aligned attribution. */
.story-opening-quote footer{border-bottom:1px solid #a58c68;padding-bottom:6px}
.story-opening-quote footer span{border:0;padding:0}

/* First-line paragraph indent for the founder opening quote. */
.story-opening-quote p{text-indent:22px}
@media(max-width:760px){.story-opening-quote p{text-indent:14px}}

/* Give the opening statement a clear hierarchy above the personal quote. */
.story-opening-grid>div>.story-lead{font-family:Georgia,serif;font-size:21px;line-height:1.55;font-weight:400;max-width:540px;margin-bottom:20px}
.story-opening-quote{margin-left:0;max-width:540px}
@media(max-width:760px){.story-opening-grid>div>.story-lead{font-size:20px;margin-bottom:18px}.story-opening-quote{margin-left:0;max-width:100%}}

/* Stagger the opening statement slightly outside the quote column. */
.story-opening-grid>div>.story-lead{font-family:inherit;font-size:21px;font-weight:500;line-height:1.55;margin-left:-18px;max-width:558px;letter-spacing:-.01em}
@media(max-width:760px){.story-opening-grid>div>.story-lead{font-size:20px;margin-left:0;max-width:100%}.story-opening-quote{margin-left:14px;max-width:calc(100% - 14px)}}

/* Compact opening statement, offset slightly left of the quote center. */
.story-opening-grid>div>.story-lead{max-width:360px;margin-left:44px;text-wrap:balance}
@media(max-width:760px){.story-opening-grid>div>.story-lead{max-width:340px;margin-left:14px;width:calc(100% - 28px)}}

/* Center only the compact opening statement over the founder quote. */
.story-opening-grid>div>.story-lead{text-align:center;margin-left:auto;margin-right:auto}
@media(max-width:760px){.story-opening-grid>div>.story-lead{margin-left:auto;margin-right:auto}}

/* Optical offset: retain centered text, slightly left of the quote center. */
.story-opening-grid>div>.story-lead{position:relative;left:-24px}
@media(max-width:760px){.story-opening-grid>div>.story-lead{left:-8px}}

/* Wide title-like statement above the narrower personal quote. */
.story-opening-grid>div>.story-lead{position:static;left:auto;box-sizing:border-box;width:calc(100% + 96px);max-width:none;margin-left:-48px;margin-right:-48px;margin-bottom:32px;text-align:center;text-wrap:balance}
@media(max-width:1000px){.story-opening-grid>div>.story-lead{width:calc(100% + 40px);margin-left:-20px;margin-right:-20px}}
@media(max-width:760px){.story-opening-grid>div>.story-lead{width:100%;max-width:100%;margin-left:0;margin-right:0;margin-bottom:26px}.story-opening-quote{margin-left:14px;margin-right:14px;max-width:calc(100% - 28px)}}

/* Let the main story title lead before the right-hand statement. */
.story-opening-grid>div{padding-top:42px}
@media(max-width:760px){.story-opening-grid>div{padding-top:0}}

/* The fuller founder outlook remains prominent beside the portrait. */
.story-voice blockquote p{font-size:clamp(27px,2.7vw,35px);line-height:1.3;letter-spacing:-.02em}
@media(max-width:760px){.story-voice blockquote p{font-size:27px;line-height:1.35}}

/* Balance the shorter opening quote with the fuller portrait outlook. */
.story-voice blockquote p{font-size:clamp(26px,2.55vw,33px);text-indent:22px}
.story-opening-grid>div>.story-lead{font-size:23px}
.story-opening-quote p{font-size:18px;line-height:1.85}
.story-opening-quote footer{font-size:20px}
@media(max-width:760px){.story-voice blockquote p{font-size:26px;text-indent:14px}.story-opening-grid>div>.story-lead{font-size:21px}.story-opening-quote p{font-size:17px}.story-opening-quote footer{font-size:19px}}

/* Short opening quote reads cleanly without a first-line indent. */
.story-opening-quote p{text-indent:0}

/* Keep the short quote visibly narrower than its opening statement. */
.story-opening-quote{width:calc(100% - 64px);max-width:420px;margin-left:auto;margin-right:auto;box-sizing:border-box}
@media(max-width:760px){.story-opening-quote{width:calc(100% - 40px);max-width:420px;margin-left:auto;margin-right:auto}}

/* Stronger founder attribution and section label beside the portrait. */
.founder-story .story-attribution{font-size:21px;font-weight:600;line-height:1.65}
.founder-story .story-attribution span{font-size:15px;font-weight:400}
.founder-story .story-outlook-copy #story-voice-title{font-size:16px}
@media(max-width:760px){.founder-story .story-attribution{font-size:20px}.founder-story .story-outlook-copy #story-voice-title{font-size:16px}}
