/* Muted paper, sage and ink: local fonts/assets only. */
.reading-site #contactForm{max-width:640px;margin:0 auto;padding:0 0 48px}
.reading-site #contactForm input,.reading-site #contactForm textarea{box-sizing:border-box;display:block;width:100%;padding:16px;border:1px solid #849581;background:#f0ede5;color:#303c38;font:inherit}
.reading-site #contactForm textarea{min-height:180px}
.reading-site #contactForm input::placeholder,.reading-site #contactForm textarea::placeholder{color:#59695e;opacity:1}
.reading-site #contactForm button{color:#253c30;border:1px solid #849581;cursor:pointer}
.reading-site #contactForm button:disabled{opacity:.6;cursor:wait}
.reading-site .contact-notice{font-size:14px;line-height:1.8;color:#46564d}
.reading-site{background:#e9e5dc;color:#303c38;font-family:Georgia,'Microsoft YaHei','PingFang SC',sans-serif;line-height:1.8}
.reading-site h1,.reading-site h2,.reading-site h3{font-family:Georgia,'Noto Serif SC','Songti SC',serif;font-weight:400;letter-spacing:0; font-style:normal}
.reading-site [class*="text-purple"],.reading-site [class*="text-white"]{color:#42574e}
/* Keep legacy dark-theme hover utilities readable on paper backgrounds. */
.reading-site [class*="hover:text"]:hover,
.reading-site .group:hover [class*="group-hover:text"],
.reading-site .group:focus-within [class*="group-hover:text"],
.reading-site .prose-12stages a:hover{color:#253c30}
.reading-site main a:hover,.reading-site main a:focus-visible{text-decoration:underline;text-underline-offset:.2em}
.reading-site .sn{background:#e4e1d8;border-color:#c7cec4;padding-top:22px;padding-bottom:22px}
.reading-site .sn-logo{color:#344c41}
.reading-site .sn-links a{color:#46564d;font-size:12px;letter-spacing:.1em}
.reading-site .sn-links a:hover,.reading-site .sn-links a.sn-on{color:#253c30;border-color:#6d8071}
.reading-site .sn-burger{color:#344c41;border-color:#9aa89a;min-height:44px;min-width:44px}
.reading-site .sn-lang{border-color:#aeb9aa}
.reading-site .sn-lang a.sn-on{background:#d1d9cc;color:#293e32}
/* Footer sits on a lighter panel than the form fields, so the muted ink that
   passes inside an input (4.98) only reached 4.34 here. Darkened to 5.27. */
.reading-site .sf{background:#dfdfd5;color:#4d5c52;font-size:11px;letter-spacing:.12em;border-color:#c7cec4}
.reading-site .aura,.reading-site .aura-glow,.reading-site .blueprint-line{display:none}
.reading-site header[style*="background-image"]{min-height:360px;height:auto;padding:100px 24px;background-blend-mode:soft-light;background-color:#c6ccc3}
.reading-site header[style*="background-image"]>.absolute{background:rgba(220,224,213,.86)}
.reading-site header h1{font-size:clamp(2.5rem,5.5vw,4.6rem);line-height:1.18;max-width:900px;margin-left:auto;margin-right:auto;color:#293e34}
.reading-site header h1 span{color:#526b58}
.reading-site header span,.reading-site header p{letter-spacing:.1em!important;font-size:14px;line-height:1.8;color:#405b49}
.reading-site header h1 span{font-size:inherit;line-height:inherit;letter-spacing:inherit!important}
.reading-site h1{text-wrap:balance}
.reading-site .glass-panel{background:#f0ede5;border:1px solid #cbd0c4;border-radius:14px;box-shadow:none;backdrop-filter:none}
.reading-site .glass-panel:hover{background:#f0ede5;border-color:#a8b5a3}
.reading-site .parallax-bg{display:none}
.reading-site section:has(>.parallax-box){display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;padding:56px 24px;max-width:1160px;margin:auto}
.reading-site .parallax-box{height:auto;min-height:230px;border:1px solid #bcc8ba;border-radius:16px;background:#dce1d5;margin-top:0}
.reading-site .parallax-box:nth-child(2){background:#e2ddd9}
.reading-site .parallax-box:nth-child(3){background:#e4dfcf}
.reading-site .content-overlay,.reading-site .parallax-box:hover .content-overlay{background:transparent;border:0;backdrop-filter:none;width:100%;padding:32px 24px;color:#303c38}
.reading-site .content-overlay h3{font-size:1.9rem;color:#344b3e}
.reading-site .content-overlay p{font-size:16px;line-height:1.9;letter-spacing:0;text-transform:none;color:#425147}
.reading-site a:focus-visible,.reading-site button:focus-visible{outline:3px solid #58765d;outline-offset:4px}
.reading-site main{padding-top:64px;padding-bottom:64px}
.reading-site article.max-w-3xl{max-width:820px;padding:56px 36px}
.reading-site .prose-12stages p,.reading-site .prose-12stages li{color:#35433b;font-size:18px;line-height:1.95;font-weight:400}
.reading-site .prose-12stages p{margin-bottom:1.5em}
.reading-site .prose-12stages h2{font-size:1.7rem;color:#365541;margin:2.4em 0 .8em;font-style:normal;line-height:1.5}
.reading-site .prose-12stages strong{color:#253d2c;font-weight:600}
.reading-site .prose-12stages a{color:#365941;border-color:#7e967d}
.reading-site .prose-12stages blockquote{color:#465848;border-color:#8da58a;background:#dfe5d9;padding:20px 24px;margin:28px 0}
.reading-site .prose-12stages img{border:0;border-radius:16px;display:block;margin:0 0 36px}
.reading-site .tag-pill{font-size:12px!important;letter-spacing:.05em;color:#456049;border-color:#a5b89f;border-radius:20px;padding:3px 12px!important}
/* The post stylesheet sets .hashtags in translucent purple, which was legible on
   the old dark background but fell to 3.15 on paper. The [class*="text-purple"]
   override above does not catch it, since the colour comes from .hashtags itself.
   Matched to .tag-pill (5.53) — hashtags and tags read as the same thing. */
.reading-site .prose-12stages .hashtags{color:#456049}
.reading-site .ruled-line{background:#bec9b8}
.reading-site article>p,.reading-site article>a,.reading-site article>div>a{font-size:12px!important;letter-spacing:.08em!important;color:#52654f}
.reading-site section.text-center{padding-top:56px;padding-bottom:56px;border-color:#c5ccbe}
.reading-site section.text-center>a{border-color:#9bac96;letter-spacing:.12em;color:#344f39}
.reading-site section.text-center>a:hover{background:#d2dccb;color:#263c2b}
/* Homepage: "What is 12Stages" and "Where to begin". Colours reuse the panel,
   border and ink values above, so contrast matches the rest of the theme. */
.reading-site .start-here{max-width:1160px;margin:0 auto;padding:56px 24px 0;text-align:center}
.reading-site .start-paths{padding-top:8px;padding-bottom:64px}
.reading-site .start-eyebrow{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#52654f;margin-bottom:16px}
.reading-site .start-intro{max-width:720px;margin:0 auto;font-size:18px;line-height:1.95;color:#35433b}
.reading-site .start-heading{font-size:1.9rem;color:#344b3e;margin-bottom:28px}
.reading-site .start-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;text-align:left}
.reading-site .start-card{display:flex;flex-direction:column;background:#f0ede5;border:1px solid #cbd0c4;border-radius:14px;padding:32px 28px;color:#303c38;transition:border-color .3s}
.reading-site .start-card:hover{border-color:#6d8071}
.reading-site .start-step{font-size:12px;letter-spacing:.12em;color:#52654f}
.reading-site .start-title{font-family:Georgia,'Noto Serif SC','Songti SC',serif;font-size:1.6rem;line-height:1.4;color:#344b3e;margin:8px 0 12px}
.reading-site .start-text{flex:1;font-size:16px;line-height:1.85;color:#425147}
.reading-site .start-cta{align-self:flex-start;margin-top:20px;font-size:14px;letter-spacing:.04em;color:#344f39;border-bottom:1px solid #9bac96}
.reading-site .start-card:hover .start-cta{color:#253c30;border-color:#344f39}
.reading-site .start-more{margin-top:28px;font-size:15px;line-height:1.85;color:#425147}
.reading-site .start-more a,.reading-site .continue-more a{color:#365941;border-bottom:1px solid #7e967d}
.reading-site .start-more a:hover,.reading-site .continue-more a:hover{color:#253c30}
/* About page: the founder's essay, set like a blog post. */
.reading-site .about-essay .prose-12stages h2:first-child{margin-top:0}
.reading-site .about-figure{margin:44px 0}
.reading-site .about-figure img{margin:0;width:100%;height:auto}
.reading-site .prose-12stages .about-quote{background:transparent;border:0;border-top:1px solid #bec9b8;border-bottom:1px solid #bec9b8;padding:28px 8px;margin:36px 0;text-align:center;font-family:Georgia,'Noto Serif SC','Songti SC',serif;font-style:normal;font-size:1.55rem;line-height:1.6;color:#344b3e}
.reading-site .about-paths{margin-top:48px}
/* End of each post: "Read next". */
.reading-site .continue-block{margin-top:56px}
.reading-site .continue-label{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#52654f;margin-bottom:14px}
.reading-site .continue-card{display:block;background:#f0ede5;border:1px solid #cbd0c4;border-radius:14px;padding:24px 26px;color:#303c38;transition:border-color .3s}
.reading-site .continue-card:hover{border-color:#6d8071}
.reading-site .continue-title{display:block;font-family:Georgia,'Noto Serif SC','Songti SC',serif;font-size:1.3rem;line-height:1.5;color:#344b3e;margin-bottom:8px}
.reading-site .continue-excerpt{display:block;font-size:15px;line-height:1.85;color:#425147}
.reading-site .continue-more{margin-top:20px;font-size:15px;line-height:1.85;color:#425147}
@media(max-width:767px){
 .reading-site .start-here{padding:40px 20px 0}
 .reading-site .start-paths{padding-bottom:40px}
 .reading-site .start-intro{font-size:17px}
 .reading-site .start-grid{grid-template-columns:1fr;gap:16px}
 .reading-site .start-card{padding:26px 22px}
}
@media(max-width:767px){
 .reading-site header[style*="background-image"]{min-height:330px;padding:72px 24px}
 .reading-site section:has(>.parallax-box){grid-template-columns:1fr;padding:32px 20px;gap:16px}
 .reading-site .parallax-box{min-height:160px}
 .reading-site article.max-w-3xl{padding:36px 23px}
 .reading-site .prose-12stages p,.reading-site .prose-12stages li{font-size:17px;line-height:2}
 .reading-site article h1{font-size:2rem;line-height:1.45}
 .reading-site .glass-panel{padding:28px}
 .reading-site .sn-links a{font-size:14px;padding:6px 0}
}
@media(prefers-reduced-motion:reduce){.reading-site *{scroll-behavior:auto!important;transition:none!important}}