:root{
  --creme:#f8f3ec; --creme2:#efe7dc; --beige:#e4d8c8; --brun:#54402f; --brun2:#7a6352;
  --bleugris:#6f8596; --sauge:#8fa58e; --sauge-clair:#e3ebe1; --rose:#e9cfc8; --rose-clair:#f6e8e4;
  --blanc:#fffdf9;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--creme);color:var(--brun);font-family:"Nunito Sans",system-ui,sans-serif;font-size:18px;line-height:1.65}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{font-family:"Lora",Georgia,serif;font-weight:600;line-height:1.25;margin:0 0 .6em}
h1{font-size:clamp(2rem,5vw,3.2rem)}
h2{font-size:clamp(1.6rem,3.6vw,2.3rem)}
h3{font-size:1.25rem}
p{margin:0 0 1em}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
.narrow{max-width:720px;margin:0 auto;padding:0 20px}

/* header */
.site-header{background:var(--blanc);border-bottom:1px solid var(--beige);position:sticky;top:0;z-index:10}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:14px;padding-bottom:14px}
.logo{font-family:"Lora",serif;font-size:1.45rem;font-weight:600;text-decoration:none;letter-spacing:.01em}
.logo span{color:var(--sauge)}
nav a{text-decoration:none;margin-left:22px;font-size:.95rem;color:var(--brun2)}
nav a:hover{color:var(--brun)}
.logo{white-space:nowrap}
@media(max-width:640px){nav a{margin-left:10px;font-size:.8rem}.logo{font-size:1.15rem}}

/* buttons */
.btn{display:inline-block;background:var(--brun);color:var(--blanc);text-decoration:none;padding:15px 28px;border-radius:40px;font-weight:700;font-size:1rem;transition:transform .15s,background .15s}
.btn:hover{background:#3f2f22;transform:translateY(-1px)}
.btn.light{background:var(--blanc);color:var(--brun);border:1.5px solid var(--brun)}
.link{color:var(--bleugris);font-weight:700;text-decoration:none}
.link:hover{text-decoration:underline}

/* sections */
section{padding:80px 0}
.bg-blanc{background:var(--blanc)}
.bg-sauge{background:var(--sauge-clair)}
.bg-rose{background:var(--rose-clair)}
.center{text-align:center}
.kicker{text-transform:uppercase;letter-spacing:.14em;font-size:.78rem;font-weight:700;color:var(--sauge);margin-bottom:12px}

/* hero */
.hero{padding:90px 0 70px}
.hero .grid{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center}
.hero p.lead{font-size:1.15rem;color:var(--brun2);max-width:34em}
.hero img{border-radius:24px;box-shadow:0 20px 50px rgba(84,64,47,.15)}
@media(max-width:820px){.hero .grid{grid-template-columns:1fr}.hero img{max-width:380px;margin:0 auto}}

/* quotes */
.quotes{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin:28px 0 34px}
.quotes span{background:var(--blanc);border:1px solid var(--beige);border-radius:30px;padding:10px 20px;font-family:"Lora",serif;font-style:italic}

/* values */
.values{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:30px}
.values div{background:var(--blanc);border-radius:18px;padding:26px;text-align:center}
.values strong{font-family:"Lora",serif;font-size:1.2rem;display:block}
@media(max-width:720px){.values{grid-template-columns:1fr}}

/* book */
.book{display:grid;grid-template-columns:.8fr 1.2fr;gap:56px;align-items:center}
.book img{border-radius:10px;box-shadow:0 22px 50px rgba(84,64,47,.22)}
@media(max-width:820px){.book{grid-template-columns:1fr}.book img{max-width:320px;margin:0 auto}}

/* about strip */
.me{display:grid;grid-template-columns:200px 1fr;gap:36px;align-items:center}
.me img{border-radius:50%;aspect-ratio:1;object-fit:cover;object-position:50% 25%}
@media(max-width:640px){.me{grid-template-columns:1fr;text-align:center}.me img{width:170px;margin:0 auto}}
.caption{font-size:.8rem;color:var(--brun2);margin-top:6px;text-align:center}

/* upcoming */
.tags{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:22px}
.tags span{background:var(--blanc);border-radius:12px;padding:12px 18px;border:1px dashed var(--sauge)}

/* sales page */
.scene p{font-family:"Lora",serif;font-size:1.25rem;line-height:1.7}
.checks{list-style:none;padding:0;margin:20px 0}
.checks li{padding-left:34px;position:relative;margin-bottom:14px}
.checks li:before{content:"";position:absolute;left:0;top:7px;width:20px;height:20px;border-radius:50%;background:var(--sauge)}
.checks li:after{content:"";position:absolute;left:6px;top:11px;width:8px;height:5px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg)}
.twocol{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.twocol>div{background:var(--blanc);border-radius:18px;padding:28px}
@media(max-width:720px){.twocol{grid-template-columns:1fr}}
.buy{background:var(--blanc);border:1px solid var(--beige);border-radius:24px;padding:40px;text-align:center;max-width:560px;margin:0 auto}
.price{font-family:"Lora",serif;font-size:2.4rem;margin:8px 0 18px}
.faq details{background:var(--blanc);border-radius:14px;padding:18px 22px;margin-bottom:12px}
.faq summary{cursor:pointer;font-weight:700;font-family:"Lora",serif}
.faq details p{margin:12px 0 0}
blockquote{margin:0;padding:0 0 0 22px;border-left:3px solid var(--rose);font-family:"Lora",serif;font-size:1.2rem}
.principles{list-style:none;padding:0}
.principles li{padding:10px 0;border-bottom:1px solid var(--beige);font-family:"Lora",serif;font-size:1.1rem}

/* footer */
footer{background:var(--brun);color:var(--creme);padding:46px 0;font-size:.9rem}
footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:20px}
footer a{color:var(--creme);text-decoration:none;margin-right:18px;opacity:.85}
footer a:hover{opacity:1}
