@font-face{font-family:Baskervville;src:url("baskervville.ttf") format("truetype");font-weight:400;font-display:swap}
@font-face{font-family:"Source Sans";src:url("sourcesans3.ttf") format("truetype");font-weight:400;font-display:swap}
@font-face{font-family:Caveat;src:url("caveat.ttf") format("truetype");font-weight:500;font-display:swap}
:root{--paper:#f9f7ef;--ink:#203e35;--text:#4a5349;--rule:#d6d5c7;--rust:#95543b;--serif:Baskervville,Georgia,serif;--sans:"Source Sans",Arial,sans-serif;--hand:Caveat,"Bradley Hand",cursive;color-scheme:light}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:18px;line-height:1.48}
h1,h2,h3,p{margin:0}h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.05}
a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}img{max-width:100%;height:auto;display:block}button:focus-visible,a:focus-visible{outline:3px solid #a4552f;outline-offset:5px}
.shell{width:min(1320px,90vw);margin-inline:auto}
.skip{position:fixed;inset-inline-start:1em;inset-block-start:1em;padding:.7em 1em;background:var(--ink);color:white;transform:translateY(-180%);z-index:20}.skip:focus{transform:none}
.mast{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;min-height:84px;border-block-end:1px solid var(--rule);gap:30px}
.logo{width:190px}.brand,footer>a{display:block;width:fit-content}
nav{display:flex;gap:34px;align-items:center}
nav a{font-size:16px;padding:10px 0;position:relative}
nav a:hover,nav a[aria-current]{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:6px}
.language{display:flex;align-items:center;gap:7px;justify-self:end;font-size:14px;background:transparent;border:1px solid #b7bbae;border-radius:24px;padding:6px 13px;min-height:38px}
.language svg{width:17px;height:17px}.chevron{line-height:.6;transform:translateY(-2px)}
.language:hover,.reader-nav button:hover:not(:disabled){background:#e7e9dc}
.hero{display:grid;grid-template-columns:1fr 1.08fr;align-items:center;gap:clamp(22px,4.1vw,76px);padding-block:clamp(40px,4.4vw,69px);border-block-end:1px solid var(--rule)}
.hero-copy{padding-inline-start:clamp(0px,1vw,20px);padding-block:16px 22px}
.eyebrow{font:400 12px/1.35 var(--sans);letter-spacing:.148em;text-transform:uppercase;color:#4b5b4d}
.with-line{display:flex;align-items:center;gap:12px}.with-line:before{content:"";width:27px;height:2px;background:var(--rust)}
.hero h1{font-size:clamp(68px,7.3vw,112px);letter-spacing:-.067em;line-height:.98;margin-block:23px 20px}
.hero h1 em{font-weight:400;color:#50654e;letter-spacing:-.072em}
.hero-intro{max-width:422px;font-size:clamp(18px,1.5vw,22px);color:var(--text);line-height:1.45}
.actions{display:flex;align-items:center;gap:clamp(15px,2.4vw,34px);flex-wrap:wrap;margin-block-start:27px}
.button{border:1px solid var(--ink);border-radius:5px;background:var(--ink);color:var(--paper);font:400 16px/1.3 var(--sans);padding:13px 19px;display:inline-flex;align-items:center;gap:13px;justify-content:center}
.button:hover{background:#355844}.arrow{display:inline-block;font-family:system-ui,sans-serif;font-weight:400;font-size:1.05em;line-height:1}
.text-link{font-size:16px;text-decoration:underline;text-underline-offset:5px;text-decoration-color:#929b86}.text-link:hover{text-decoration-color:currentColor}
.still-life{display:grid;position:relative;isolation:isolate;place-items:center;overflow:hidden;container-type:inline-size;width:100%;min-width:0;aspect-ratio:1.37;border:none;border-radius:3px;padding:0;background:radial-gradient(ellipse at 18% 9%,#ecebd9 0%,#dddfc9 49%,#bdc4aa 100%);box-shadow:inset 0 0 0 1px #68755919}
.still-life:before,.art:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.26;background-image:url("grain.png");mix-blend-mode:multiply}
.scene{width:100%;height:91%;align-self:start;margin-block-start:1.5%;position:relative;display:block;direction:ltr;filter:drop-shadow(2px 5px 4px #303a251f)}
.underbook,.book{position:absolute;display:block;border-radius:3% 7% 6% 3% / 2% 5% 4% 2%;width:38%;height:77%;top:8.4%;left:30%;box-shadow:2px 3px 1px #403b2e91,5px 8px 9px #29322446}
.underbook{border:1px solid #0003;background-image:linear-gradient(90deg,#0003 0,transparent 3%,#ffffff17 7%,#0002 8%,transparent 9%),url("grain.png");background-blend-mode:multiply}
.underbook:after,.book:after{content:"";position:absolute;z-index:-1;bottom:-1.3%;left:2%;right:-.5%;height:5%;border-radius:0 0 12% 8% / 0 0 65% 40%;background:repeating-linear-gradient(0deg,#b0a68c 0px,#e9dfc7 1px,#c5bda6 2px);border-bottom:2px solid #546250}
.wood{background-color:#a36344;transform:translate(23%,10%) rotate(15deg);box-shadow:3px 5px 2px #56433878,9px 16px 17px #443b2c42}
.wood:after{border-color:#8e5036}.petrol{background-color:#344f46;transform:translate(9%,5%) rotate(4deg)}
.book{isolation:isolate;transform:translate(-13%,-1%) rotate(-10deg);transition:transform .3s ease;background:#c2b99b;color:#344433}
.cover{position:absolute;inset:0;isolation:isolate;border-radius:inherit;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;overflow:hidden;border:1px solid #aaa183;background:linear-gradient(110deg,#d7ceb0,#ece6cc 53%,#d9d0ac);box-shadow:inset -1px -1px 1px #817a68,inset 1px 1px 1px #fff8}
.cover:before{content:"";position:absolute;inset:0;background-image:url("grain.png");opacity:.52;mix-blend-mode:multiply;pointer-events:none}
.spine{position:absolute;top:.5%;bottom:.5%;left:0;width:8%;border-radius:14% 0 0 14%;background:linear-gradient(90deg,#605b533f,#e3d8b540 24%,#a29b7e33 73%,#77755d5c 88%,#fffae050 98%)}
.book-kicker{position:relative;margin-block-start:13.5%;font:400 1.35cqw var(--sans);letter-spacing:.24em}
.book-title{position:relative;font:400 5.1cqw/.96 var(--serif);letter-spacing:-.055em;text-align:center;margin-block-start:5%;inline-size:78%;max-inline-size:7ch}
.cover-art{position:absolute;inset-inline:2%;top:43%;width:96%;height:39%;object-fit:contain;mix-blend-mode:multiply;opacity:.89}
.cover-imprint{position:absolute;bottom:7.4%;width:37%;opacity:.88}
.sample-caption{position:absolute;z-index:2;bottom:3.5%;inset-inline-start:4%;font:500 clamp(15px,2.9cqw,23px)/1.1 var(--hand);color:#374835;transform:rotate(-3deg)}
@media(hover:hover){.still-life:hover .book{transform:translate(-15%,-2%) rotate(-12deg)}}
.inside{padding:clamp(31px,3.45vw,57px) 0 clamp(45px,5vw,82px)}.section-heading{margin-block-end:24px}.section-heading h2{font-size:clamp(35px,3.4vw,53px);letter-spacing:-.052em}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,30px)}.story-card{display:block;min-width:0}
.art{isolation:isolate;position:relative;display:grid;place-items:center;overflow:hidden;aspect-ratio:2.04;border-radius:3px;background:var(--tone)}
.sand{--tone:#e8debf}.sage{--tone:#dbe2ce}.clay{--tone:#e9cdbd}
.art img{width:78%;height:88%;object-fit:contain;mix-blend-mode:multiply;transition:transform .25s ease}
@media(hover:hover){.story-card:hover .art img{transform:scale(1.04)}}
.card-copy{padding-block:15px 5px}.card-copy :is(h2,h3){display:flex;align-items:baseline;justify-content:space-between;gap:12px;font-size:clamp(26px,2.5vw,38px);letter-spacing:-.04em;line-height:1.12}.card-copy :is(h2,h3) .arrow{font-size:20px}
.card-copy p{font:400 17px/1.43 var(--sans);margin-block-start:5px;color:var(--text)}.card-copy .eyebrow{display:block;margin-block-end:9px}
footer{display:flex;align-items:center;gap:22px;border-block-start:1px solid var(--rule);min-height:98px;padding-block:22px}
footer .logo{width:132px}footer p{font-size:14px;color:var(--text)}footer nav{margin-inline-start:auto;gap:22px}footer nav a{font-size:14px}
.directory,.detail,.manifesto{padding-block:clamp(40px,6vw,90px) clamp(55px,7vw,110px)}
.directory-heading{display:grid;grid-template-columns:1fr 1fr;align-items:end;border-block-end:1px solid var(--rule);padding-block-end:32px;margin-block-end:32px;gap:20px}
.directory-heading h1,.detail h1,.manifesto h1{font-size:clamp(60px,6.3vw,98px);letter-spacing:-.055em;line-height:1.01}
.directory-heading p,.dek{font:400 clamp(20px,1.8vw,26px)/1.4 var(--sans);color:var(--text);max-width:550px}
.directory .art{aspect-ratio:1.58}.directory .cards{margin-block-end:6vh}
.back,.next a{color:var(--ink);text-decoration:underline;text-underline-offset:5px}.back{font-size:16px}.back span{margin-inline-end:6px}
.detail{padding-block-start:35px}.detail-top{display:grid;grid-template-columns:1.25fr 1fr;align-items:center;gap:6%;padding-block:35px;border-block-end:1px solid var(--rule);margin-block-end:40px}
.detail-top h1,.manifesto h1{margin-block:18px}.detail-top .art{aspect-ratio:1.72}.detail-top .dek{max-width:31em}
.prose{max-width:680px;margin-inline:auto;font-family:var(--serif);font-size:clamp(20px,1.9vw,26px);line-height:1.56;color:#293d32}
.prose p+p,.prose section+section{margin-block-start:1em}.prose h2{font-size:1.3em;letter-spacing:-.035em;margin-block-end:.4em}
.prose .next{display:grid;gap:6px;border-block-start:1px solid var(--rule);margin-block-start:32px;padding-block-start:24px}
.steps{margin:16px 0 30px;padding-inline-start:1.5em}.steps li{padding-inline-start:.3em;margin-block:11px}.steps li::marker{font-family:var(--sans);font-size:.77em;color:var(--rust)}
.example{background:#e9eadb;border-inline-start:3px solid #778569;padding:20px 26px}.example .eyebrow{font:400 12px/1.35 var(--sans);letter-spacing:.15em;margin-block-end:9px}
.example p{font:500 1.27em/1.25 var(--hand)}
.manifesto{max-width:900px;margin:auto}.manifesto header{text-align:center}.manifesto .with-line{justify-content:center}.manifesto .dek{margin:auto;max-width:700px}.manifesto-divider{position:relative;display:grid;place-items:center;margin:24px auto 32px}
.manifesto-divider:before{content:"";position:absolute;top:54%;inset-inline:12%;height:1px;background:var(--rule)}.manifesto-divider img{width:170px;background:var(--paper);padding-inline:15px;position:relative}
.signature{margin-block:30px 20px}.signature img{width:138px}.manifesto .button{margin-block-start:12px}
dialog{color:var(--ink);border:1px solid #a2aa98;padding:0;border-radius:9px;background:var(--paper);max-width:calc(100vw - 28px);width:460px;max-height:90dvh;box-shadow:0 25px 90px #1b2c2940}
dialog::backdrop{background:#21342d83;backdrop-filter:blur(3px)}
body:has(dialog[open]){overflow:hidden}
.dialog-inner{padding:30px;position:relative}.dialog-inner h2{font-size:32px;letter-spacing:-.035em;padding-inline-end:36px}.dialog-inner>p{font-size:16px;color:var(--text);margin-block:9px 22px}.dialog-inner .eyebrow{margin-block:16px 8px}
.close,.reader-nav button{display:grid;place-items:center;background:transparent;border:1px solid var(--rule);border-radius:50%;width:40px;height:40px;font:400 24px/1 var(--sans)}
.dialog-inner .close{position:absolute;inset-block-start:18px;inset-inline-end:18px}.close:hover{background:#e3e7d9}
.langrow{display:flex;align-items:baseline;justify-content:space-between;font-size:18px;gap:9px;padding:6px 1px}.langrow small{font-size:14px;color:var(--text)}
.available{background:#e4e9d9;border-radius:3px;padding:3px 12px}.available [aria-current]:after{content:"✓"}
.language-list{margin:0;padding:0;list-style:none}.language-list .langrow+.langrow{border-block-start:1px solid var(--rule)}
#sample{width:465px}.reader{padding:15px;background:#e4e7d9}.reader-head,.reader-nav{display:flex;align-items:center;justify-content:space-between;gap:12px}
.reader-head{padding:0 2px 13px}.reader-head h2{font:400 17px var(--sans)}
.sample-page{padding:24px 22px;background:var(--paper);border-radius:3px 9px 9px 3px;box-shadow:0 2px 6px #45513f28;border-inline-start:5px solid #b4ab8f;text-align:start}
.sample-page h3{font-size:34px;letter-spacing:-.04em;margin-block:9px 0}
.sample-page img{max-height:22dvh;width:100%;object-fit:contain;margin-block:12px;mix-blend-mode:multiply}
.sample-page p{font:500 25px/1.18 var(--hand);color:#374a3e}
.reader-nav{margin-block-start:14px;padding-inline:2px}.reader-nav button{background:var(--paper);border-color:#969f8c}.reader-nav button:disabled{opacity:.38;cursor:default}.reader-nav span{font-size:15px}
[dir=rtl] .arrow,[dir=rtl] .back span,[dir=rtl] [data-step]{scale:-1 1}
@media(max-width:870px) and (min-width:701px){.hero{grid-template-columns:1fr 1fr;gap:22px}.hero h1{font-size:67px}.actions{gap:12px}.actions .button{padding-inline:13px}.actions .text-link{font-size:15px}.sample-caption{font-size:15px}.logo{width:160px}}
@media(max-width:700px){
.shell{width:min(91%,570px)}.mast{column-gap:10px;row-gap:0;grid-template-columns:1fr auto;min-height:0;padding-block:15px 0}.mast .logo{width:155px}.mast nav{grid-column:1/-1;grid-row:2;gap:25px}.mast nav a{padding-block:9px 10px}.language{grid-column:2;grid-row:1;min-height:34px}
.hero{grid-template-columns:1fr;gap:23px;padding-block:30px}.hero-copy{padding:0}.hero h1{font-size:clamp(59px,12.7vw,84px);line-height:.98;margin-block:16px}.hero-intro{max-width:38ch;font-size:18px}.actions{margin-block-start:20px;gap:21px}.button{font-size:15px;padding:12px 15px}.text-link{font-size:15px}
.still-life{aspect-ratio:1.55}.book,.underbook{width:34%;left:31%;height:79%}.book-title{font-size:4.8cqw}.cards{grid-template-columns:1fr;gap:26px}.card-copy{padding-block:12px 0}.card-copy :is(h2,h3){font-size:32px}.art{aspect-ratio:2.3}
.inside{padding-block:31px 44px}.section-heading{margin-block-end:18px}footer{flex-wrap:wrap;gap:8px 18px}footer nav{width:100%;margin:0}.directory-heading,.detail-top{grid-template-columns:1fr;gap:20px}.directory-heading{padding-block-end:23px}.directory .art{aspect-ratio:2.3}.detail-top{padding-block:25px;gap:22px}.detail-top .art{aspect-ratio:2.35}.directory-heading h1,.detail h1,.manifesto h1{font-size:clamp(49px,12vw,76px)}.prose{font-size:21px}
}
@media(max-width:370px){.actions{gap:13px}.hero h1{font-size:56px}.book,.underbook{height:76%}.dialog-inner{padding:24px 18px}.reader{padding:10px}.sample-page{padding:15px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;scroll-behavior:auto!important}}

/* Store availability and the app walkthrough */
button.text-link{background:transparent;border:0;padding:9px 0;color:var(--ink)}
.store-button{display:inline-flex;align-items:center;gap:11px;text-align:start;padding:8px 19px 9px 15px;border:1px solid #15251e;border-radius:8px;background:#19271f;color:#fffdf4;line-height:1.1;min-height:55px}
.store-button:hover{background:#32483a}.store-button small,.store-button strong{display:block}.store-button small{font-size:12px}.store-button strong{font:600 25px/1.08 var(--sans);letter-spacing:-.035em}
.phone-icon{position:relative;display:block;width:22px;height:33px;border:1.8px solid currentColor;border-radius:5px}
.phone-icon::before,.phone-icon::after{content:"";position:absolute;left:50%;transform:translateX(-50%);width:7px;height:2px;border-radius:3px;background:currentColor}.phone-icon::before{top:3px}.phone-icon::after{bottom:3px;width:8px;height:1px}
.visually-hidden{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.features{padding-block:clamp(38px,4.3vw,66px);border-block-end:1px solid var(--rule);scroll-margin-top:20px}
.features h2,.about h2{font-size:clamp(36px,3.6vw,55px);letter-spacing:-.052em;line-height:1.07}
.features h2{margin-block-end:24px}.features fieldset{border:0;padding:0;margin:0;min-inline-size:0}
.feature-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:clamp(25px,6vw,100px)}
.feature-option{display:contents}.feature-option label{position:relative;grid-column:1;display:flex;flex-direction:column;justify-content:center;cursor:pointer;border-block-start:1px solid var(--rule);padding:20px 50px 20px 0}
.feature-option:last-child label{border-block-end:1px solid var(--rule)}
.feature-option label:hover .feature-name{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.feature-option input:focus-visible+label{outline:3px solid var(--rust);outline-offset:2px}
.feature-name{font:400 clamp(23px,2.15vw,32px)/1.1 var(--serif);letter-spacing:-.043em}
.feature-detail{font:400 17px/1.42 var(--sans);color:var(--text);margin-block-start:7px;max-width:55ch}
.feature-arrow{display:grid;place-items:center;position:absolute;inset-inline-end:3px;inset-block-start:22px;width:28px;height:28px;border:1px solid #9da68e;border-radius:50%;font:400 16px system-ui}
.feature-option input:checked+label .feature-arrow{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.feature-view{display:none;position:relative;isolation:isolate;grid-column:2;grid-row:1 / span 4;margin:0;align-items:center;justify-content:center;overflow:hidden;border-radius:4px;background:radial-gradient(ellipse at 12% 18%,#e9e9d7,#c2ccb1)}
.feature-option input:checked~figure{display:flex}
.feature-view::before{content:"";position:absolute;inset:0;z-index:-1;background:url("grain.png");opacity:.32}
.feature-view img{height:clamp(335px,33vw,456px);width:auto;max-inline-size:84%;object-fit:contain;border:4px solid #38463a;border-radius:20px;background:#f7f5ea;box-shadow:2px 8px 20px #263b2b28;margin-block:22px 35px}
.visual-choose{background:radial-gradient(ellipse at 12% 18%,#f0e9ce,#d8c9a4)}.visual-result{background:radial-gradient(ellipse at 12% 18%,#ebe0cf,#d5bda8)}.visual-export{background:radial-gradient(ellipse at 12% 18%,#dde7df,#b5c9be)}
.visual-result img{height:auto;max-height:370px;width:min(55%,260px);border:0;border-radius:2px;transform:rotate(-3deg)}
.feature-view figcaption{position:absolute;inset-inline-start:20px;bottom:10px;font:500 20px/1.1 var(--hand);color:#40503f}
.about{padding-block-end:clamp(45px,5vw,90px)}.founder{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:center;gap:clamp(35px,7vw,100px);padding-block:clamp(35px,4.2vw,78px);border-block-end:1px solid var(--rule)}
.founder-copy{padding-inline-start:clamp(0px,1vw,20px)}.founder h1{font-size:clamp(63px,6.6vw,100px);line-height:1;letter-spacing:-.063em;margin-block:18px 24px}
.founder .dek{max-width:37ch}.portrait{margin:0;justify-self:center;max-width:400px;width:88%;padding:9px;background:#f6f1e3;border:1px solid #c3c1b2;box-shadow:3px 5px 11px #29332614;transform:rotate(1.3deg)}.portrait img{width:100%;height:auto;filter:grayscale(1)}
.about-why{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(25px,6vw,90px);padding-block:clamp(38px,4.7vw,78px);border-block-end:1px solid var(--rule)}.about-why h2{max-width:11em}.about-why .prose{font-size:clamp(20px,1.75vw,26px);line-height:1.5}
.principles{padding-block-start:clamp(32px,4.2vw,68px)}.principles ol{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,3vw,56px);padding:0;margin:27px 0 0;list-style:none}
.principles li{border-block-start:2px solid #939f85;padding-block:17px 0}.principles h3{font-size:clamp(24px,2.3vw,34px);letter-spacing:-.045em}.principles li p{margin-block-start:9px;color:var(--text);font-size:18px}
@media(max-width:880px) and (min-width:701px){.mast nav{gap:22px}.feature-layout{column-gap:24px}.feature-option label{padding-inline-end:37px}.feature-view img{height:380px}.visual-result img{height:auto}}
@media(max-width:700px){
 .mast nav,footer nav{flex-wrap:wrap;gap:3px 21px}.hero .actions{gap:16px}.store-button{padding:7px 14px;min-height:52px}.store-button strong{font-size:23px}
 .feature-layout{display:block}.features h2{margin-block-end:17px}.feature-option label{padding-block:16px}.feature-arrow{inset-block-start:16px}
 .feature-option input:checked~figure{margin-block-end:18px}.feature-view{min-height:240px}.feature-view img{height:285px;max-width:72%;margin-block:16px 27px;border-radius:14px}
 .visual-result img{width:auto;height:243px;border-radius:2px}.feature-view figcaption{font-size:17px;inset-inline-start:13px;bottom:6px}
 .founder,.about-why{grid-template-columns:1fr;gap:22px}.founder-copy{padding:0}.founder h1{font-size:clamp(52px,12vw,75px);margin-block:12px 15px}.portrait{width:min(86%,340px)}.about-why h2{max-width:none}
 .principles ol{grid-template-columns:1fr;gap:18px;margin-block-start:18px}.principles li{padding-block-start:12px}
}
