:root { --paper:#f6f1e7; --ink:#252c28; --muted:#62665d; --line:#d9d7c9; --green:#374f42; --gold:#ad7a37; --white:#fffdf8; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:7rem; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:Arial,Helvetica,sans-serif; font-size:17px; line-height:1.65; }
a { color:var(--green); text-underline-offset:0.2em; }
a:hover { color:#855b24; }
a:focus-visible,button:focus-visible,input:focus-visible { outline:3px solid var(--gold); outline-offset:4px; }
img { display:block; max-width:100%; height:auto; }
h1,h2,h3 { font-family:Georgia,'Times New Roman',serif; font-weight:400; line-height:1.13; letter-spacing:-0.035em; }
h1 { font-size:clamp(2.7rem,6vw,5.7rem); margin:0.65rem 0 1.4rem; }
h2 { font-size:clamp(2rem,3.8vw,3.2rem); margin:0 0 1.2rem; }
h3 { font-size:1.75rem; margin:0.5rem 0 1rem; }
p { margin:0 0 1.25rem; }
button,input { font:inherit; }
.wrap { width:min(1180px,calc(100% - 3rem)); margin:auto; }
.narrow { max-width:760px; }
.skip { position:absolute; left:1rem; top:-5rem; z-index:5; background:var(--white); padding:0.5rem 1rem; }
.skip:focus { top:1rem; }
.header { position:sticky; top:0; z-index:4; background:rgba(246,241,231,0.96); border-bottom:1px solid var(--line); }
.header-inner { min-height:82px; display:flex; align-items:center; justify-content:space-between; gap:1.5rem; padding:0.7rem 0; }
.brand { font-family:Georgia,serif; font-size:1.9rem; text-decoration:none; letter-spacing:-0.045em; color:var(--ink); white-space:nowrap; }
.brand span { color:var(--gold); }
.brand-block { display:flex; flex-direction:column; }
.brand-note { font-size:0.65rem; color:var(--muted); letter-spacing:0.08em; line-height:1; }
.nav { display:flex; align-items:center; flex-wrap:wrap; gap:1.4rem; font-size:0.86rem; }
.nav a { text-decoration:none; color:var(--ink); }
.nav a[aria-current=page] { text-decoration:underline; text-decoration-color:var(--gold); text-decoration-thickness:2px; }
.eyebrow { color:var(--green); font-size:0.72rem; font-weight:700; letter-spacing:0.16em; text-transform:uppercase; }
.hero { padding:5rem 0 4rem; }
.hero-grid { display:grid; grid-template-columns:1.12fr 1fr; align-items:center; gap:4rem; }
.hero .lede { max-width:37rem; }
.lede { font-size:1.16rem; color:var(--muted); line-height:1.7; }
.actions { display:flex; flex-wrap:wrap; gap:0.7rem; margin-top:1.7rem; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:0.6rem; padding:0.78rem 1.25rem; border:1px solid var(--green); border-radius:3px; background:transparent; color:var(--green); text-decoration:none; font-size:0.9rem; font-weight:600; cursor:pointer; }
.button.primary { background:var(--green); color:var(--white); }
.button:hover { background:#e6e6d8; color:var(--ink); }
.button.primary:hover { background:#273b30; color:white; }
.button:disabled { opacity:0.6; cursor:wait; }
.shelf { display:grid; grid-template-columns:1fr 0.88fr; gap:1.4rem; align-items:center; padding:2rem 1rem 2rem 0.5rem; }
.shelf .tall { transform:rotate(-5deg); }
.shelf .pair { display:grid; gap:1.3rem; transform:rotate(3deg); }
.shelf img { width:100%; max-height:390px; object-fit:contain; filter:drop-shadow(7px 12px 12px rgba(37,44,40,0.16)); }
.shelf .pair img { max-height:205px; }
.shelf a:focus-visible { outline-offset:8px; }
.section { padding:4.5rem 0; border-top:1px solid var(--line); }
.section-head { display:flex; justify-content:space-between; align-items:end; gap:2rem; margin-bottom:2.4rem; }
.section-head p { max-width:32rem; margin:0; color:var(--muted); }
.section-head h2 { margin-bottom:0; }
.three { display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; }
.two { display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:start; }
.book-card { display:flex; flex-direction:column; align-items:start; }
.book-art { width:100%; height:300px; display:flex; align-items:end; justify-content:center; background:#ebe7dc; padding:1.5rem; margin-bottom:1.7rem; }
.book-art img { max-height:250px; width:auto; max-width:100%; filter:drop-shadow(4px 7px 6px rgba(37,44,40,0.13)); }
.book-card p { color:var(--muted); font-size:0.95rem; }
.book-card .actions { margin-top:auto; padding-top:0.5rem; }
.credit { font-size:0.82rem; color:var(--muted); margin-top:-0.5rem; margin-bottom:1rem; }
.dark { background:var(--green); color:var(--white); }
.dark .eyebrow,.dark .lede,.dark p { color:#dedfcf; }
.dark a { color:var(--white); }
.dark .button { border-color:#d6d7c5; color:var(--white); }
.dark .button:hover { color:var(--ink); }
.rule-list { margin:0; padding:0; list-style:none; }
.rule-list li { display:flex; gap:1.2rem; border-top:1px solid rgba(255,253,248,0.25); padding:1.25rem 0; }
.rule-list .number { font-family:Georgia,serif; font-size:1.5rem; color:#d4b782; }
.rule-list strong { display:block; font-weight:400; font-family:Georgia,serif; font-size:1.35rem; }
.rule-list p { font-size:0.9rem; margin:0.35rem 0 0; }
.panel { background:var(--white); border:1px solid var(--line); border-radius:4px; padding:2rem; }
.panel h3 { margin-top:0; }
.price { font-family:Georgia,serif; font-size:3.5rem; line-height:1.1; letter-spacing:-0.04em; margin:1rem 0 0.3rem; }
.price-note { color:var(--muted); font-size:0.92rem; }
audio { width:100%; margin:1rem 0; }
.small { font-size:0.85rem; color:var(--muted); }
.signup { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:start; }
.signup form { min-width:0; }
.field-label { display:block; font-size:0.9rem; margin-bottom:0.5rem; font-weight:600; }
input[type=email],input[type=number] { width:100%; background:var(--white); color:var(--ink); padding:0.75rem 1rem; border:1px solid #a9b0a4; border-radius:3px; }
fieldset { border:0; padding:0; margin:1.1rem 0; }
legend { font-size:0.9rem; font-weight:600; margin-bottom:0.5rem; }
.topic { display:inline-flex; align-items:center; gap:0.4rem; margin:0.25rem 1rem 0.25rem 0; font-size:0.9rem; }
.topic input { width:18px; height:18px; accent-color:var(--green); }
.trap { position:absolute; left:-10000px; }
.consent { display:flex; gap:0.6rem; align-items:start; margin:1rem 0; font-size:0.82rem; color:var(--muted); }
.consent input { margin-top:0.4rem; accent-color:var(--green); }
.form-status { min-height:1.5rem; font-size:0.9rem; margin:0.7rem 0 0; }
.form-status.error { color:#983427; }
.reading-list { padding-left:1.4rem; }
.reading-list li { padding:0.4rem 0; }
.quote { border-left:2px solid var(--gold); padding-left:1.5rem; font-family:Georgia,serif; font-size:1.5rem; margin:2rem 0; }
.calculator { margin:1.5rem 0; padding-top:1.5rem; border-top:1px solid var(--line); }
.calculator input { max-width:150px; }
.calculator output { display:block; margin-top:0.6rem; font-weight:600; }
.estimate-fields { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.estimate-fields label { min-width:0; }
.book-detail { display:grid; grid-template-columns:minmax(220px,0.7fr) 1.3fr; gap:4rem; align-items:start; }
.detail-cover { max-width:360px; margin:auto; filter:drop-shadow(5px 10px 8px rgba(37,44,40,0.15)); }
.book-detail h1 { font-size:clamp(2.3rem,4.5vw,4.3rem); }
.breadcrumb { font-size:0.85rem; margin-bottom:1.5rem; }
.sample-story { font-family:Georgia,serif; font-size:1.14rem; max-width:700px; margin:auto; }
.sample-story p { margin-bottom:1rem; }
.faq { max-width:850px; }
.faq details { border-top:1px solid var(--line); padding:1.1rem 0; }
.faq summary { cursor:pointer; font-weight:600; }
.faq details p { margin:0.8rem 0 0; color:var(--muted); }
.link-button { border:0; padding:0; background:none; color:var(--green); text-decoration:underline; text-underline-offset:0.2em; cursor:pointer; font:inherit; }
.share-tools { display:flex; align-items:center; gap:1rem; flex-wrap:wrap; margin-top:1.3rem; font-size:0.85rem; }
.share-tools [role=status] { color:var(--muted); }
.reading-route { display:flex; gap:1rem; flex-wrap:wrap; margin-top:1.5rem; }
.reading-route a { font-size:0.9rem; }
.print-guide { font-size:1rem; }
.print-guide h1 { font-size:3rem; }
.print-guide li { margin:0.8rem 0; }
.steps li { margin-bottom:1.2rem; padding-left:0.3rem; }
.footer { border-top:1px solid var(--line); padding:2rem 0; font-size:0.8rem; color:var(--muted); }
.footer-inner { display:flex; justify-content:space-between; flex-wrap:wrap; gap:1rem; }
.footer-links { display:flex; flex-wrap:wrap; gap:1.2rem; }
@media(max-width:800px) {
  .hero-grid { gap:2rem; }
  .three { gap:1.2rem; }
  .book-art { height:250px; padding:1rem; }
  .book-art img { max-height:220px; }
  .signup { gap:2rem; }
  .header-inner { flex-wrap:wrap; gap:0.4rem; }
  .nav { gap:1.1rem; }
}
@media(max-width:600px) {
  .wrap { width:calc(100% - 2.2rem); }
  .header-inner { display:block; padding:0.55rem 0; }
  .brand { font-size:1.6rem; }
  .brand-block { display:block; }
  .brand-note { display:inline-block; margin-left:0.8rem; }
  .nav { margin-top:0.3rem; gap:1rem; font-size:0.79rem; }
  .hero { padding:3rem 0; }
  .hero-grid,.two,.signup,.three,.book-detail { grid-template-columns:1fr; }
  .hero-grid { gap:1.4rem; }
  .shelf { width:100%; max-width:420px; margin:auto; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0.8rem; padding:0.5rem 0; }
  .shelf .tall { transform:none; }
  .shelf .pair { display:contents; }
  .shelf .tall img,.shelf .pair img { max-height:none; }
  .section { padding:3rem 0; }
  .section-head { display:block; }
  .section-head p { margin-top:1rem; }
  .three { gap:2.5rem; }
  .book-art { height:300px; }
  .book-art img { max-height:260px; }
  .panel { padding:1.5rem; }
  .two { gap:2rem; }
  .book-detail { gap:2rem; }
  .detail-cover { max-width:280px; }
}
@media print {
  .header,.footer,.skip,.no-print,.share-tools,.actions,#updates { display:none !important; }
  body { background:white; color:black; font-size:12pt; }
  .hero,.section { padding:1rem 0; }
  .wrap { width:100%; }
  a { color:black; }
  .panel { break-inside:avoid; }
  h2,h3 { break-after:avoid; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
