nav{flex-wrap:wrap;gap:18px}nav a[href="stories.html"]{color:#befaf2}.stories-hero,.stories-section{padding:60px clamp(20px,6vw,90px)}.stories-hero{background:#f6f0e2;text-align:center}.stories-hero h1{font-family:Georgia,serif;font-size:clamp(2.6rem,6vw,5rem);line-height:1.1;margin:20px 0}.stories-hero>p{max-width:850px;margin:20px auto}.tagline{font-size:1.45rem;color:#216e70;font-weight:bold}.stories-hero .actions{justify-content:center}.cast{width:100%;margin:40px auto 0;border-radius:18px}.stories-section{max-width:1600px;margin:auto}.stories-section h2{font-family:Georgia,serif;font-size:clamp(2rem,4vw,3rem);line-height:1.2}.story-values{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:30px 0}.story-values article,.note{background:#eef4f1;padding:24px;border-radius:12px}.dragon-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px;margin-top:35px}.dragon-card{background:#fff;border:1px solid #e6dfd1;border-radius:16px;overflow:hidden;box-shadow:0 6px 20px #13273508}.portrait{width:100%;aspect-ratio:var(--ratio);background-image:url('assets/dragon-cast.png');background-size:var(--size) auto;background-position:var(--x) var(--y);background-repeat:no-repeat;background-color:#f6f0e2}.dragon-copy{padding:22px}.dragon-copy h3{font-family:Georgia,serif;font-size:1.8rem;margin:0}.theme{font-weight:bold;color:#216e70;font-size:.95rem}.first-book{background:#f6f0e2;border-radius:18px;margin-bottom:60px}.first-book>p{max-width:850px}@media(max-width:950px){.dragon-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.story-values{grid-template-columns:1fr}}@media(max-width:580px){.dragon-grid{grid-template-columns:1fr}.stories-hero,.stories-section{padding:40px 20px}.site-header{align-items:flex-start}.first-book{border-radius:0}}
.dragon-card>img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;background:#fcf8ee}.main-dragon{border:2px solid #d6a647}.main-dragon .dragon-copy{background:#fff9e9}
.collection-books{background:#f6f0e2}.story-book-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px;margin:30px 0}.story-book-feature{min-width:0;background:#fff;border-radius:12px;overflow:hidden;scroll-margin-top:24px}.story-book-feature>img{width:100%;aspect-ratio:1;object-fit:contain}.story-book-feature>div{padding:26px}.story-book-feature h3{font-family:Georgia,serif;font-size:1.8rem;line-height:1.2;margin:12px 0}.story-book-feature p{line-height:1.6}@media(max-width:700px){.story-book-grid{grid-template-columns:1fr}.story-book-feature>div{padding:22px}}

/* New dragon family and forthcoming KS2 collections */
.ks2-coming,.poster-downloads{background:#eef4f1}.ks2-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px;margin:28px 0}.ks2-card{min-width:0;background:#fff;border:1px solid #dbe6df;border-radius:16px;padding:28px}.ks2-card h3{font-family:Georgia,serif;font-size:1.8rem;line-height:1.2}.ks2-card p{line-height:1.7}.book-status{display:inline-block;background:#eef4f1;color:#215b59;padding:7px 12px;border-radius:20px;font-weight:bold;font-size:.85rem}.ks2-card .button{max-width:100%;box-sizing:border-box;white-space:normal}section[id]{scroll-margin-top:30px}@media(max-width:700px){.ks2-grid{grid-template-columns:1fr}.ks2-card{padding:22px}}

.dragon-portrait-frame{width:100%;aspect-ratio:1;overflow:hidden;background:#fcf8ee;position:relative}.dragon-portrait-frame>img{display:block;width:100%;height:100%;object-fit:contain;transform:scale(var(--portrait-zoom,1));transform-origin:50% 50%}

.dragon-portrait-frame>img{transform:translateY(var(--portrait-offset,0)) scale(var(--portrait-zoom,1))}

.teacher-dragon{border-color:#a84836}.teacher-dragon .dragon-copy{background:#fff8f0}

.extended-families{background:#f6f0e2}.family-picture{background:#fffaf0}.family-picture img{display:block;width:100%;height:auto}.family-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.family-download{background:#fff;padding:28px;border-radius:16px;margin-top:30px}@media(max-width:700px){.family-grid{grid-template-columns:1fr}}

.moon-meadow-grown-ups{background:#fcf8ee}.grown-up-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;margin-top:32px}.grown-up-grid .dragon-copy{padding:26px}.grown-up-grid .dragon-portrait-frame>img{object-fit:contain;transform:none}.grown-up-grid h3{line-height:1.2}@media(max-width:700px){.grown-up-grid{grid-template-columns:1fr}.grown-up-grid .dragon-copy{padding:22px}}

.moon-meadow-grown-ups{padding:64px 24px}.moon-meadow-grown-ups>.container{max-width:1120px;margin:0 auto}@media(max-width:580px){.moon-meadow-grown-ups{padding:42px 20px}}

/* Shared layout for all Moon Meadow character profiles. */
.dragon-card { display: flex; flex-direction: column; min-width: 0; }
.dragon-card > .dragon-portrait-frame { flex: none; }
.dragon-card .dragon-copy { flex: 1; padding: 22px; }
.dragon-card .dragon-copy h3 { line-height: 1.2; }
.dragon-card .theme { margin: .75rem 0; }
.dragon-card .dragon-bio { margin: 0; }

.reading-stages { margin-top: 40px; }
.reading-stages h3 { font-family: Georgia, serif; font-size: clamp(1.65rem, 3vw, 2.3rem); line-height: 1.2; margin: 0 0 12px; }
.reading-stage-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin: 24px 0 18px; }
.reading-stage { background: #eef4f1; border: 1px solid #dbe6df; padding: 24px; border-radius: 12px; }
.reading-stage h4 { font-family: Georgia, serif; font-size: 1.4rem; line-height: 1.2; margin: .45rem 0 .75rem; }
.reading-stage p { margin: 0 0 1rem; }
.reading-stage p:last-child { margin-bottom: 0; }
.stage-years { color: #216e70; font-size: .9rem; font-weight: bold; }
.reading-stage-links { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; }
.reading-stage-links a { color: #215b59; text-decoration: underline; text-underline-offset: .16em; }
@media (max-width: 950px) { .reading-stage-grid { grid-template-columns: 1fr; } }
.stories-section.moon-meadow-grown-ups { padding: 60px clamp(20px, 6vw, 90px); }
.moon-meadow-grown-ups > .container { max-width: none; }
@media (max-width: 580px) { .stories-section.moon-meadow-grown-ups { padding: 40px 20px; } }

/* Let responsive artwork override the original HTML height attributes.
   A fixed 918/1254px height left huge empty bands around smaller images. */
.story-book-feature > img,
.dragon-card > img,
.family-picture img {
  display: block;
  width: 100%;
  height: auto;
}
.story-book-feature > img { aspect-ratio: 1; }
.story-book-grid, .dragon-grid, .grown-up-grid { align-items: start; }
.dragon-portrait-frame { aspect-ratio: 1; }
.dragon-portrait-frame > img {
  width: 100%;
  height: 100%;
  max-height: 100%;
}
.moon-meadow-posters { background: #eef4f1; }
.moon-poster-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
  margin-block: 28px;
}
.moon-poster-card {
  min-width: 0;
  background: #fff;
  border: 1px solid #dbe6df;
  border-radius: 12px;
  overflow: hidden;
}
.moon-poster-card img { display: block; width: 100%; height: auto; }
.moon-poster-card > div { padding: 24px; }
.moon-poster-card h3 { font-family: Georgia, serif; font-size: 1.6rem; margin: 0 0 12px; }
.moon-poster-card .actions { margin-top: 20px; gap: 12px; }
@media (max-width: 700px) { .moon-poster-grid { grid-template-columns: 1fr; } }
