.about-story-page { --story-ink:#f4f2eb; --story-muted:#b6bbb3; --story-line:#333a31; --story-gold:#fac875; position:relative; width:100%; background:#111510; color:var(--story-ink); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; font-weight:400; padding-bottom:5rem; }
.about-story-page *, .about-story-page *::before, .about-story-page *::after { box-sizing:border-box; }
.about-story-page .about-page-nav-trigger { position:absolute; top:0; width:1px; height:1px; }
.about-story-page .story-shell { width:calc(100% - 6rem); max-width:74rem; margin-left:auto; margin-right:auto; }
.about-story-page h1,.about-story-page h2,.about-story-page h3 { font-family:var(--font-heading); font-weight:400; letter-spacing:.005em; margin:0; }
.about-story-page h2 { font-size:clamp(2.35rem,4vw,3.5rem); line-height:1.08; }
.about-story-page h2[id] { scroll-margin-top:7rem; }
.about-story-page p { margin:0; }
.about-story-page a { color:inherit; }
.about-story-page a:focus-visible { outline:3px solid var(--story-gold); outline-offset:6px; }
.about-story-page .story-eyebrow { color:var(--story-gold); font-size:.75rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase; line-height:1.5; margin-bottom:1.5rem; }
.story-hero { display:grid; grid-template-columns:1.22fr 1fr; align-items:center; gap:clamp(2rem,5vw,5rem); padding:4.5rem 0 5rem; }
.story-hero h1 { font-size:clamp(3.5rem,6vw,5.5rem); line-height:1.02; max-width:100%; }
.story-hero h1 span { color:var(--story-gold); }
.about-story-page .story-lead { font-size:1.3rem; line-height:1.5; margin:2rem 0 .8rem; }
.story-intro { color:var(--story-muted); font-size:1.05rem; line-height:1.8; max-width:44ch; }
.story-jump-links { display:flex; flex-wrap:wrap; gap:.4rem 1.75rem; margin-top:2rem; }
.story-jump-links a { display:inline-flex; align-items:center; gap:.75rem; min-height:44px; font-size:.8rem; text-decoration:none; border-bottom:1px solid #59634f; }
.story-jump-links a:hover { color:var(--story-gold); border-color:var(--story-gold); }
.story-jump-links span { color:var(--story-gold); }
.story-founder { margin:0; align-self:stretch; display:flex; flex-direction:column; min-width:0; }
.story-founder-art { position:relative; display:flex; align-items:flex-end; justify-content:center; flex:1; overflow:hidden; min-height:29rem; background:#323f2b; border-radius:12rem 12rem .25rem .25rem; }
.story-founder-backdrop { position:absolute; top:8rem; left:50%; transform:translateX(-50%) rotate(-90deg); font-family:var(--font-heading); font-size:8rem; color:#415237; letter-spacing:.02em; line-height:1; }
.story-founder-art img { position:relative; display:block; width:min(100%,25rem); height:auto; z-index:1; }
.story-founder figcaption { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.25rem 0 0; }
.story-founder figcaption strong { display:block; font-size:1rem; line-height:1.4; font-weight:600; }
.story-founder figcaption div > span { display:block; margin-top:.35rem; color:var(--story-muted); font-size:.75rem; line-height:1.5; }
.story-founder figcaption a { display:grid; place-items:center; flex-shrink:0; width:44px; height:44px; border:1px solid #59634f; border-radius:50%; text-decoration:none; font-size:1.3rem; }
.story-founder figcaption a:hover { color:var(--story-gold); border-color:var(--story-gold); }
.story-origin { padding:5rem 0; border-top:1px solid var(--story-line); }
.story-section-grid { display:grid; grid-template-columns:1fr 1.2fr; gap:clamp(2rem,7vw,7rem); }
.story-prose p { color:var(--story-muted); font-size:1rem; line-height:1.8; max-width:60ch; }
.story-prose p + p { margin-top:1.25rem; }
.about-story-page .story-prose-lead { color:var(--story-ink); font-size:1.35rem; line-height:1.5; margin-bottom:1.5rem; }
.story-timeline { list-style:none; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:2rem; padding:0; margin:3.5rem 0 0; }
.story-timeline li { position:relative; border-top:1px solid #536046; padding-top:1.75rem; }
.story-timeline li::before { content:""; width:7px; height:7px; background:var(--story-gold); border-radius:50%; position:absolute; left:0; top:-4px; }
.story-timeline-label { font-size:.7rem; line-height:1.5; letter-spacing:.1em; text-transform:uppercase; color:var(--story-muted); }
.story-timeline h3 { font-size:1.6rem; margin:.65rem 0; }
.story-timeline p { color:var(--story-muted); font-size:.9rem; line-height:1.75; max-width:32ch; }
.story-purpose { padding:4.5rem 0; background:#e9e8dd; color:#192116; }
.about-story-page .story-purpose .story-eyebrow { color:#586348; }
.story-purpose-intro { font-size:1.2rem; line-height:1.75; max-width:46ch; align-self:center; color:#46503f; }
.story-principles { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:3rem; margin-top:3rem; }
.story-principles article { border-top:1px solid #b8beac; padding-top:1.5rem; }
.story-principles article > span { display:block; color:#657057; font-size:.75rem; margin-bottom:1.5rem; }
.story-principles h3 { font-size:1.7rem; line-height:1.15; margin-bottom:.9rem; }
.story-principles p { color:#46503f; font-size:.95rem; line-height:1.75; }
.story-tools { padding:5rem 0; }
.story-text-link { display:inline-flex; align-items:center; gap:1rem; min-height:44px; margin-top:1rem; font-size:.9rem; text-decoration:underline; text-underline-offset:.25em; }
.about-story-page .story-text-link { color:var(--story-gold); }
.story-apps { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1.5rem; margin-top:2.5rem; }
.story-apps a { display:flex; align-items:center; gap:.9rem; padding:1.25rem 0; border-top:1px solid var(--story-line); border-bottom:1px solid var(--story-line); text-decoration:none; min-width:0; }
.story-apps a:hover { border-color:var(--story-gold); }
.story-apps img { width:44px; height:44px; object-fit:contain; border-radius:10px; flex-shrink:0; }
.story-apps strong { display:block; font-size:1rem; font-weight:600; }
.story-apps small { display:block; color:var(--story-muted); font-size:.75rem; margin-top:.3rem; }
.story-apps a > span:last-child { margin-left:auto; color:var(--story-gold); }
.about-story-page .story-invitation { display:flex; align-items:center; justify-content:space-between; gap:2rem; padding:2.5rem 3rem; background:#263020; border:1px solid #465039; border-radius:.5rem; }
.story-invitation h2 { font-size:clamp(2rem,3.5vw,3rem); }
.story-invitation .story-eyebrow { margin-bottom:1rem; }
.story-invitation p:last-child { color:var(--story-muted); font-size:.95rem; line-height:1.7; margin-top:1rem; }
.about-story-page .story-button { display:inline-flex; align-items:center; justify-content:space-between; gap:2.5rem; flex-shrink:0; min-height:50px; padding:.9rem 1.25rem; color:#161c12; background:var(--story-gold); border-radius:4px; text-decoration:none; font-size:.9rem; font-weight:600; }
.story-button:hover { background:#ffdc9d; }
@media(max-width:64rem) {
 .about-story-page .story-shell { width:calc(100% - 4rem); }
 .story-hero { gap:2.5rem; grid-template-columns:1.1fr 1fr; }
 .story-founder-art { min-height:25rem; }
 .story-apps { grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 2rem; }
 .story-principles { gap:2rem; }
}
@media(max-width:48rem) {
 .about-story-page { padding-bottom:3rem; }
 .about-story-page .story-shell { width:calc(100% - 3rem); }
 .story-hero { grid-template-columns:1fr; padding:2.5rem 0 3rem; gap:2.5rem; }
 .story-hero h1 { font-size:clamp(3.2rem,11.5vw,5rem); max-width:100%; }
 .about-story-page .story-lead { margin-top:1.5rem; font-size:1.15rem; }
 .story-intro { font-size:1rem; }
 .story-jump-links { gap:.25rem 1.25rem; margin-top:1.5rem; }
 .story-founder { width:100%; max-width:27rem; justify-self:center; }
 .story-founder-art { min-height:0; }
 .story-founder-art img { width:min(100%,23rem); }
 .story-section-grid { grid-template-columns:1fr; gap:1.75rem; }
 .story-origin,.story-tools { padding:3rem 0; }
 .story-purpose { padding:3rem 0; }
 .story-purpose-intro { font-size:1.1rem; }
 .story-principles { grid-template-columns:1fr; gap:1.75rem; margin-top:2.25rem; }
 .story-principles article { display:grid; grid-template-columns:1.75rem 1fr; column-gap:.75rem; padding-top:1.25rem; }
 .story-principles article > span { grid-row:1 / 3; padding-top:.3rem; margin:0; }
 .story-principles h3 { font-size:1.6rem; margin-bottom:.6rem; }
 .story-principles p { grid-column:2; }
 .story-timeline { grid-template-columns:1fr; gap:0; margin-top:2.5rem; }
 .story-timeline li { border-top:0; border-left:1px solid #536046; padding:0 0 1.75rem 1.5rem; }
 .story-timeline li:last-child { padding-bottom:0; }
 .story-timeline li::before { top:.3rem; left:-4px; }
 .story-timeline p { max-width:none; }
 .story-timeline h3 { margin:.4rem 0; }
 .story-apps { gap:0 1.25rem; margin-top:1.75rem; }
 .story-apps a { gap:.6rem; }
 .story-apps img { width:36px; height:36px; }
 .story-apps strong { font-size:.9rem; }
 .story-apps small { font-size:.7rem; }
 .about-story-page .story-invitation { align-items:flex-start; flex-direction:column; padding:2rem 1.5rem; }
 .story-invitation h2 { font-size:2.25rem; }
}
@media(max-width:23rem) {
 .about-story-page .story-shell { width:calc(100% - 2rem); }
 .story-apps { grid-template-columns:1fr; }
 .story-jump-links { gap:.25rem 1rem; }
}
