/* ============================================================
   GOOD PATH PRESS — design system
   Palette: Deep Forest #1C3A2A · Ink #15130E · Warm Cream #F5EFE2
            Parchment #E9DFC8 · Burnished Gold #B98A2F
   Kids accents: Soft Blue #A9CBE0 · Ember Orange #C9622B
   Type: EB Garamond (display & body) · Montserrat (utility)
   ============================================================ */

:root{
  --forest:#1C3A2A;
  --forest-deep:#132819;
  --ink:#15130E;
  --cream:#F5EFE2;
  --parchment:#E9DFC8;
  --parchment-dk:#D9CCAC;
  --gold:#B98A2F;
  --gold-bright:#D4AC52;
  --blue:#A9CBE0;
  --orange:#C9622B;
  --serif:"EB Garamond", Garamond, "Times New Roman", serif;
  --sans:"Montserrat", "Helvetica Neue", Arial, sans-serif;
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E");
}

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--serif);
  font-size:1.125rem;
  line-height:1.65;
  color:var(--ink);
  background:var(--cream);
  background-image:var(--grain);
}

img,svg{display:block;max-width:100%;}
a{color:inherit;}

/* ---------- utility type ---------- */
.eyebrow{
  font-family:var(--sans);
  font-size:.72rem;
  font-weight:600;
  letter-spacing:.28em;
  text-transform:uppercase;
  color:var(--gold);
}
.eyebrow--onlight{color:#8a6620;}

h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.12;}

/* ---------- header ---------- */
.site-header{
  position:sticky;top:0;z-index:50;
  background:rgba(245,239,226,.94);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--parchment-dk);
}
.site-header .bar{
  max-width:1160px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  padding:.8rem 1.5rem;
}
.brand{display:flex;align-items:center;gap:.75rem;text-decoration:none;}
.brand svg{width:44px;height:44px;}
.brand-name{
  font-family:var(--serif);font-size:1.32rem;letter-spacing:.06em;
  color:var(--forest);text-transform:uppercase;
}
.brand-name b{font-weight:600;color:var(--forest);}
nav.main-nav{display:flex;gap:1.9rem;align-items:center;}
nav.main-nav a{
  font-family:var(--sans);font-size:.78rem;font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;
  text-decoration:none;color:var(--forest);
  padding:.35rem 0;border-bottom:2px solid transparent;
}
nav.main-nav a:hover{border-bottom-color:var(--gold);}
nav.main-nav a.active{border-bottom-color:var(--gold);color:var(--ink);}
nav.main-nav a.nav-kids{color:var(--orange);}
.nav-check{display:none;}
.menu-toggle{display:none;flex-direction:column;justify-content:space-between;width:30px;height:21px;cursor:pointer;}
.menu-toggle span{display:block;height:2.5px;background:var(--forest);}

/* ---------- hero (dark plate) ---------- */
.hero{
  position:relative;
  background:linear-gradient(178deg,var(--forest) 0%,var(--forest-deep) 90%);
  background-blend-mode:overlay;
  color:var(--cream);
  overflow:hidden;
}
.hero::after{
  content:"";position:absolute;inset:0;background-image:var(--grain);opacity:.9;pointer-events:none;
}
.hero .inner{
  position:relative;z-index:2;
  max-width:1160px;margin:0 auto;
  padding:5rem 1.5rem 3.5rem;
  text-align:center;
}
.hero h1{
  font-size:clamp(2.9rem,7vw,5.4rem);
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--cream);
}
.hero h1 .accent{color:inherit;}
.hero .tagline{
  margin-top:1.1rem;
  font-family:var(--sans);
  font-size:.85rem;font-weight:600;
  letter-spacing:.42em;text-transform:uppercase;
  color:var(--gold-bright);
}
.hero .lede{
  max-width:44ch;margin:1.6rem auto 0;
  font-size:1.83rem;color:#e7dfc9;
  font-style:italic;
}
.hero-art{position:relative;z-index:2;max-width:880px;margin:1.5rem auto 0;padding:0 1rem;}
.hero-art svg{width:100%;height:auto;}
.hero .cta-row{
  position:relative;z-index:2;
  display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;
  padding:0 1.5rem 5rem;margin-top:.6rem;
}

/* draw-in animation for the etching */
.etch path,.etch circle,.etch line{
  stroke-dasharray:var(--len,900);
  stroke-dashoffset:var(--len,900);
  animation:draw 2.4s ease forwards;
}
.etch .d2{animation-delay:.5s;}
.etch .d3{animation-delay:1s;}
.etch .d4{animation-delay:1.5s;}
@keyframes draw{to{stroke-dashoffset:0;}}
@media (prefers-reduced-motion:reduce){
  .etch path,.etch circle,.etch line{animation:none;stroke-dashoffset:0;}
  html{scroll-behavior:auto;}
}

/* ---------- buttons ---------- */
.btn{
  display:inline-block;
  font-family:var(--sans);font-size:.78rem;font-weight:600;
  letter-spacing:.2em;text-transform:uppercase;
  padding:.95rem 1.9rem;text-decoration:none;
  border:1px solid var(--gold);
  transition:background .2s,color .2s;
}
.btn--gold{background:var(--gold);color:var(--ink);}
.btn--gold:hover{background:var(--gold-bright);}
.btn--ghost{color:var(--gold-bright);}
.btn--ghost:hover{background:rgba(212,172,82,.12);}
.btn--forest{border-color:var(--forest);color:var(--forest);}
.btn--forest:hover{background:var(--forest);color:var(--cream);}

/* ---------- sections ---------- */
section{padding:4.5rem 1.5rem;}
.wrap{max-width:1160px;margin:0 auto;}
.section-head{max-width:640px;margin-bottom:2.8rem;}
.section-head h2{font-size:clamp(1.9rem,4vw,2.7rem);color:var(--forest);margin-top:.5rem;}
.section-head p{margin-top:.9rem;color:#4a4436;}
.center{text-align:center;}
.center .section-head{margin-left:auto;margin-right:auto;}

/* rule with laurel dot */
.rule{
  display:flex;align-items:center;gap:.9rem;
  max-width:1160px;margin:0 auto;padding:0 1.5rem;
}
.rule::before,.rule::after{content:"";flex:1;height:1px;background:var(--parchment-dk);}
.rule svg{width:26px;height:26px;flex:none;}

/* ---------- catalog covers ---------- */
.shelf{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:2.4rem;
}
.book{ text-decoration:none;}
.cover{
  position:relative;
  aspect-ratio:2/3;
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  padding:1.6rem 1.3rem;
  text-align:center;
  background:
    repeating-linear-gradient(90deg,rgba(255,255,255,.03) 0 2px,transparent 2px 4px),
    repeating-linear-gradient(0deg,rgba(0,0,0,.05) 0 1px,transparent 1px 3px),
    linear-gradient(160deg,#24462F,var(--forest) 55%,#16301F);
  box-shadow:inset 0 0 0 1px rgba(212,172,82,.35), 0 14px 28px -14px rgba(21,19,14,.5);
  border-left:7px solid #10241636;
  transition:transform .25s ease, box-shadow .25s ease;
}
.book:hover .cover{transform:translateY(-6px);box-shadow:inset 0 0 0 1px rgba(212,172,82,.55), 0 22px 34px -14px rgba(21,19,14,.55);}
.cover .frame{
  position:absolute;inset:12px;
  border:1px solid rgba(212,172,82,.45);
  pointer-events:none;
}
.cover .c-eyebrow{
  font-family:var(--sans);font-size:.58rem;font-weight:600;
  letter-spacing:.3em;text-transform:uppercase;color:var(--gold-bright);
}
.cover h3{
  margin:.8rem 0;
  font-size:1.45rem;line-height:1.2;color:#F2E6BF;
  text-transform:uppercase;letter-spacing:.05em;
}
.cover .c-sub{font-style:italic;color:#cfc4a0;font-size:.95rem;}
.cover .c-orn{width:54px;height:16px;margin-top:1rem;opacity:.85;}
/* parchment + kids variants */
.cover--parchment{
  background:
    repeating-linear-gradient(90deg,rgba(0,0,0,.02) 0 2px,transparent 2px 4px),
    linear-gradient(165deg,#F2E9D4,#E4D7B4 60%,#D9C99E);
  box-shadow:inset 0 0 0 1px rgba(138,102,32,.4), 0 14px 28px -14px rgba(21,19,14,.35);
  border-left:7px solid #b3a37c55;
}
.cover--parchment h3{color:var(--forest);}
.cover--parchment .c-eyebrow{color:#8a6620;}
.cover--parchment .c-sub{color:#6b5f45;}
.cover--blue{
  background:
    repeating-linear-gradient(90deg,rgba(255,255,255,.06) 0 2px,transparent 2px 4px),
    linear-gradient(165deg,#BAD6E8,var(--blue) 60%,#8FB6CF);
  box-shadow:inset 0 0 0 1px rgba(28,58,42,.3), 0 14px 28px -14px rgba(21,19,14,.35);
  border-left:7px solid #7fa3bb66;
}
.cover--blue h3{color:var(--forest);}
.cover--blue .c-eyebrow{color:var(--orange);}
.cover--blue .c-sub{color:#39536a;}
.cover--orange{
  background:
    repeating-linear-gradient(90deg,rgba(255,255,255,.05) 0 2px,transparent 2px 4px),
    linear-gradient(165deg,#D97B43,var(--orange) 60%,#A84E20);
  box-shadow:inset 0 0 0 1px rgba(245,239,226,.4), 0 14px 28px -14px rgba(21,19,14,.4);
  border-left:7px solid #8c3f1566;
}
.cover--orange h3{color:#FBEED9;}
.cover--orange .c-eyebrow{color:#FBEED9;}
.cover--orange .c-sub{color:#F3D9BC;}
.book figcaption{
  margin-top:1rem;text-align:center;
  font-family:var(--sans);font-size:.72rem;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:#5c543f;
}

/* wax seal — coming soon */
.seal{
  position:absolute;right:-14px;bottom:-14px;
  width:86px;height:86px;border-radius:50%;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:radial-gradient(circle at 34% 30%,#E4C063,var(--gold) 52%,#8a6620 100%);
  box-shadow:0 6px 12px rgba(21,19,14,.35), inset 0 0 0 3px rgba(255,244,214,.35), inset 0 0 18px rgba(90,62,10,.55);
  transform:rotate(-12deg);
  font-family:var(--sans);font-weight:700;font-size:.5rem;
  letter-spacing:.18em;text-transform:uppercase;color:#3d2c08;
  text-align:center;line-height:1.5;
}
.seal::before{
  content:"";position:absolute;inset:7px;border-radius:50%;
  border:1px solid rgba(61,44,8,.55);
}

/* ---------- split feature ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:3.5rem;align-items:center;}
.split .art{background:var(--parchment);padding:2.2rem;box-shadow:inset 0 0 0 1px var(--parchment-dk);}
.split .art svg{width:100%;height:auto;}

/* ---------- dark band / signup ---------- */
.band{
  background:linear-gradient(178deg,var(--forest),var(--forest-deep));
  color:var(--cream);position:relative;
}
.band::after{content:"";position:absolute;inset:0;background-image:var(--grain);pointer-events:none;}
.band .wrap{position:relative;z-index:2;}
.band h2{color:var(--cream);}
.band .eyebrow{color:var(--gold-bright);}
.signup-form{
  display:flex;gap:.8rem;max-width:520px;margin:1.8rem auto 0;flex-wrap:wrap;justify-content:center;
}
.signup-form input[type=email]{
  flex:1;min-width:240px;
  font-family:var(--serif);font-size:1.05rem;
  padding:.9rem 1.1rem;
  background:rgba(245,239,226,.06);
  border:1px solid rgba(212,172,82,.5);
  color:var(--cream);
}
.signup-form input[type=email]::placeholder{color:#b9b09a;}
.signup-form input[type=email]:focus{outline:2px solid var(--gold-bright);outline-offset:1px;}
.fineprint{margin-top:1rem;font-size:.9rem;font-style:italic;color:#bdb397;}

/* ---------- kids theming ---------- */
.kids-hero{
  background:var(--cream);
  border-bottom:1px solid var(--parchment-dk);
  text-align:center;position:relative;overflow:hidden;
}
.kids-hero .inner{max-width:900px;margin:0 auto;padding:4.5rem 1.5rem 3rem;position:relative;z-index:2;}
.kids-hero h1{font-size:clamp(2.6rem,6vw,4.4rem);color:var(--forest);}
.kids-hero h1 .k{color:var(--orange);}
.kids-hero .lede{max-width:52ch;margin:1.3rem auto 0;font-size:1.2rem;color:#4a4436;}
.footprints{display:flex;justify-content:center;gap:1.5rem;margin-top:2rem;}
.footprints svg{width:26px;height:34px;}
.footprints svg:nth-child(odd){transform:rotate(-12deg) translateY(-6px);}
.footprints svg:nth-child(even){transform:rotate(10deg);}

/* ---------- about page ---------- */
.prose{max-width:680px;margin:0 auto;}
.prose p{margin-bottom:1.4rem;}
.prose .drop::first-letter{
  font-size:3.4em;float:left;line-height:.82;
  padding:.06em .12em 0 0;color:var(--gold);font-weight:500;
}
blockquote.verse{
  margin:2.4rem auto;max-width:520px;text-align:center;
  font-size:1.35rem;font-style:italic;color:var(--forest);
}
blockquote.verse cite{
  display:block;margin-top:.7rem;
  font-family:var(--sans);font-style:normal;font-size:.72rem;
  letter-spacing:.24em;text-transform:uppercase;color:var(--gold);
}

/* ---------- footer ---------- */
footer{
  background:var(--ink);color:#b9b09a;position:relative;
}
footer::after{content:"";position:absolute;inset:0;background-image:var(--grain);pointer-events:none;}
footer .wrap{
  position:relative;z-index:2;
  display:flex;justify-content:space-between;align-items:center;gap:2rem;flex-wrap:wrap;
  padding:2.6rem 1.5rem;
}
footer .f-brand{display:flex;align-items:center;gap:.8rem;}
footer .f-brand svg{width:40px;height:40px;}
footer .f-name{font-family:var(--serif);letter-spacing:.08em;text-transform:uppercase;color:var(--cream);}
footer nav{display:flex;gap:1.6rem;}
footer nav a{
  font-family:var(--sans);font-size:.7rem;font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;text-decoration:none;color:#b9b09a;
}
footer nav a:hover{color:var(--gold-bright);}
footer .f-tag{font-size:.85rem;font-style:italic;}

/* ---------- responsive ---------- */
@media (max-width:820px){
  .split{grid-template-columns:1fr;}
  .site-header .bar{position:relative;flex-wrap:nowrap;}
  .menu-toggle{display:flex;}
  nav.main-nav{
    display:none;
    position:absolute;left:0;right:0;top:100%;
    flex-direction:column;gap:1.1rem;
    background:var(--cream);
    border-bottom:1px solid var(--parchment-dk);
    padding:1.2rem 1.5rem 1.4rem;
    box-shadow:0 14px 24px -18px rgba(21,19,14,.4);
  }
  .nav-check:checked ~ nav.main-nav{display:flex;}
  .hero .lede{font-size:1.4rem;}
}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px;}
