:root{
  --cream:#fff7e8;--paper:#fffdf8;--gold:#ffd166;--coral:#f9846b;--teal:#77c9d4;--blue:#294b7a;--navy:#24313d;--green:#7fb069;--leaf:#427a4e;--brown:#6a4a3c;--muted:#66717d;--shadow:0 20px 55px rgba(71,45,25,.18);--radius:28px
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Trebuchet MS,Arial,sans-serif;color:var(--navy);background:radial-gradient(circle at top left,#fff1bf 0,#fff7e8 30%,#fffdf8 100%);line-height:1.6;overflow-x:hidden}a{color:inherit}.site-header{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:22px;padding:16px clamp(18px,4vw,60px);background:rgba(255,247,232,.92);backdrop-filter:blur(10px);border-bottom:1px solid rgba(106,74,60,.13)}.brand{display:flex;align-items:center;gap:12px;text-decoration:none}.brand-icon{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:linear-gradient(135deg,var(--gold),var(--coral));box-shadow:0 10px 24px rgba(249,132,107,.3);color:white;font-size:24px}.brand strong{display:block;font-size:1.1rem}.brand small{display:block;color:var(--muted);font-size:.78rem}.site-nav{display:flex;align-items:center;gap:18px;font-weight:800}.site-nav a{text-decoration:none}.nav-cta,.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;font-weight:900;text-decoration:none;transition:.2s transform,.2s box-shadow}.nav-cta{background:var(--navy);color:white;padding:10px 18px}.btn{padding:14px 22px;box-shadow:0 12px 25px rgba(36,49,61,.13)}.btn:hover,.nav-cta:hover{transform:translateY(-2px)}.btn-primary{background:linear-gradient(135deg,var(--coral),#ffb25b);color:white}.btn-secondary{background:white;color:var(--navy);border:2px solid rgba(36,49,61,.08)}.menu-toggle{display:none;border:0;background:white;border-radius:12px;font-size:1.4rem;padding:8px 12px}.hero{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:54px;align-items:center;min-height:720px;padding:80px clamp(22px,6vw,90px)}.sparkles:before,.sparkles:after{content:"★";position:absolute;color:rgba(255,209,102,.8);font-size:64px;animation:float 5s ease-in-out infinite}.sparkles:before{top:120px;left:7%}.sparkles:after{right:8%;bottom:110px;font-size:42px;animation-delay:1s}.eyebrow{margin:0 0 10px;color:var(--coral);font-weight:900;text-transform:uppercase;letter-spacing:.12em;font-size:.78rem}.hero h1,.section h2{font-family:Georgia,serif;line-height:1.02;margin:0;color:#203149}.hero h1{font-size:clamp(3.2rem,7vw,6.8rem);letter-spacing:-.05em}.lead{font-size:1.22rem;max-width:650px;color:#4c5a66}.button-row{display:flex;flex-wrap:wrap;gap:14px;margin:28px 0}.motto{display:inline-block;background:#fff;border:2px dashed rgba(249,132,107,.55);border-radius:999px;padding:10px 18px;font-weight:900;color:var(--brown)}.hero-art{position:relative;min-height:520px}.storybook-frame{position:absolute;inset:20px 30px 35px 30px;background:linear-gradient(135deg,#8a5a3b,#d19a5d 38%,#6a4a3c);border-radius:42px;padding:22px;box-shadow:var(--shadow);transform:rotate(2deg)}.painting-world{position:relative;height:100%;overflow:hidden;border-radius:26px;background:linear-gradient(#7bd2ff 0 38%,#b7e39d 38% 65%,#7fb069 65%);border:8px solid rgba(255,255,255,.55)}.moon{position:absolute;width:90px;height:90px;right:35px;top:34px;background:#fff4b5;border-radius:50%;box-shadow:0 0 50px #fff4b5}.mountains:before,.mountains:after{content:"";position:absolute;bottom:34%;border-left:130px solid transparent;border-right:130px solid transparent;border-bottom:170px solid #6d94b7}.mountains:before{left:5%}.mountains:after{left:34%;border-bottom-color:#89abc8}.jungle{position:absolute;left:-5%;right:-5%;bottom:0;height:38%;background:radial-gradient(circle at 10% 20%,#356c3b 0 22%,transparent 23%),radial-gradient(circle at 35% 25%,#427a4e 0 25%,transparent 26%),radial-gradient(circle at 67% 20%,#356c3b 0 24%,transparent 25%),radial-gradient(circle at 89% 30%,#427a4e 0 25%,transparent 26%),linear-gradient(#4c8b55,#2f6b38)}.boy-placeholder{position:absolute;left:50%;bottom:38px;transform:translateX(-50%);width:145px;height:190px;border-radius:70px 70px 28px 28px;background:linear-gradient(#ff766c 0 58%,#4c7db5 58%);box-shadow:0 10px 25px rgba(0,0,0,.22);display:grid;place-items:center;text-align:center;color:white;font-weight:900}.boy-placeholder span{font-size:.72rem}.floating-card{position:absolute;background:white;border-radius:18px;padding:13px 18px;font-weight:900;box-shadow:0 14px 28px rgba(36,49,61,.16)}.card-one{top:32px;left:0}.card-two{right:0;bottom:20px}.section{padding:84px clamp(22px,6vw,90px)}.section-intro{text-align:center;max-width:850px;margin:0 auto 42px}.section h2{font-size:clamp(2.25rem,4vw,4.2rem);letter-spacing:-.035em}.section-intro p:not(.eyebrow),.split-section p,.parents-panel p,.shop-section p{font-size:1.12rem;color:#52606c}.book-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px}.book-card{background:white;border-radius:var(--radius);padding:16px;box-shadow:0 13px 32px rgba(36,49,61,.09);border:1px solid rgba(36,49,61,.05);transition:.2s transform}.book-card:hover{transform:translateY(-5px)}.book-cover{height:210px;border-radius:20px;display:grid;place-items:center;color:white;font-family:Georgia,serif;font-size:4rem;font-weight:900;margin-bottom:15px;background:linear-gradient(135deg,var(--teal),var(--blue))}.book-card h3{margin:8px 0;font-size:1.08rem}.book-card p{color:#5a6671;font-size:.93rem}.book-card a{font-weight:900;color:var(--coral)}.jungle .book-cover{background:linear-gradient(135deg,#2f7b4f,#a4c957)}.pirate .book-cover{background:linear-gradient(135deg,#255f85,#d49a4a)}.dino .book-cover{background:linear-gradient(135deg,#6ca56a,#d6b266)}.snow .book-cover{background:linear-gradient(135deg,#bce8f8,#6f9ec9)}.space .book-cover{background:linear-gradient(135deg,#1f2a68,#8e74d9)}.dragon .book-cover{background:linear-gradient(135deg,#aa5b35,#ffd166)}.coral .book-cover{background:linear-gradient(135deg,#1aa7b8,#ff9f8f)}.desert .book-cover{background:linear-gradient(135deg,#d19046,#ffd166)}.city .book-cover{background:linear-gradient(135deg,#345c43,#9ac76e)}.first .book-cover{background:linear-gradient(135deg,#7a4eb0,#ffb25b)}.split-section{display:grid;grid-template-columns:.85fr 1.15fr;gap:48px;align-items:center}.reverse{grid-template-columns:1.15fr .85fr}.portrait-card,.video-card{background:white;border-radius:var(--radius);padding:34px;box-shadow:var(--shadow);border:6px solid #fff3cf}.max-badge{height:270px;border-radius:26px;background:radial-gradient(circle at 50% 25%,#ffdca8 0 17%,transparent 18%),linear-gradient(#ff7b6a 0 62%,#477bb5 62%);display:grid;place-items:center;color:white;font-size:4rem;font-family:Georgia,serif;font-weight:900;text-shadow:0 5px 15px rgba(0,0,0,.22)}.portrait-card ul{columns:2;margin:20px 0 0;padding-left:20px;font-weight:800}.trait-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}.trait-row span{background:#fff;border-radius:999px;padding:12px 18px;font-weight:900;box-shadow:0 10px 20px rgba(36,49,61,.08)}.activities-section{background:linear-gradient(180deg,rgba(119,201,212,.16),rgba(255,255,255,0))}.activity-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.activity-card{background:white;border-radius:var(--radius);padding:30px;box-shadow:0 16px 35px rgba(36,49,61,.1)}.activity-card span{font-size:2.4rem}.parents-panel,.shop-section{text-align:center;background:linear-gradient(135deg,#24313d,#294b7a);color:white;border-radius:44px;margin:30px clamp(22px,6vw,90px);padding:70px clamp(22px,6vw,70px)}.parents-panel h2,.parents-panel p,.shop-section h2,.shop-section p{color:white}.parents-panel .eyebrow{color:#ffd166}.video-card{min-height:300px;display:grid;place-items:center;text-align:center;background:linear-gradient(135deg,#fff,#fff3cf)}.play{width:90px;height:90px;border-radius:50%;background:var(--coral);display:grid;place-items:center;color:white;font-size:2rem;box-shadow:0 15px 30px rgba(249,132,107,.35)}.about-section{background:rgba(255,255,255,.48)}.shop-section{background:linear-gradient(135deg,#f9846b,#ffb25b)}.site-footer{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:30px clamp(22px,6vw,90px);background:#203149;color:white}.site-footer p{margin:0}@keyframes float{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-14px) rotate(12deg)}}@media(max-width:1050px){.hero,.split-section,.reverse{grid-template-columns:1fr}.hero-art{min-height:520px}.book-grid{grid-template-columns:repeat(2,1fr)}.activity-grid{grid-template-columns:1fr}.site-nav{display:none;position:absolute;left:18px;right:18px;top:80px;background:white;border-radius:24px;padding:18px;box-shadow:var(--shadow);flex-direction:column}.site-nav.open{display:flex}.menu-toggle{display:block}}@media(max-width:560px){.hero{padding-top:46px}.hero h1{font-size:3.2rem}.storybook-frame{inset:20px 0 50px}.book-grid{grid-template-columns:1fr}.floating-card{display:none}.parents-panel,.shop-section{margin-left:16px;margin-right:16px}.portrait-card ul{columns:1}.site-footer{display:block}.site-footer p+p{margin-top:8px}}.
.book-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)) !important;
  gap: 32px !important;
  align-items: stretch !important;
}

.book-card {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  background: #fff8e8;
  border-radius: 22px;
  padding: 22px;
  text-align: center;
  box-shadow: 0 12px 28px rgba(72, 44, 22, 0.18);
  overflow: hidden !important;
  position: relative !important;
  min-height: 560px;
}

.book-card .book-cover {
  width: 100% !important;
  height: 320px !important;
  min-height: 320px !important;
  max-height: 320px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-bottom: 18px !important;
  position: relative !important;
  overflow: hidden !important;
}

.book-card .book-cover img {
  max-width: 100% !important;
  max-height: 100% !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  display: block !important;
  position: static !important;
  border-radius: 12px;
}

.book-card h3 {
  margin: 12px 0 10px !important;
  line-height: 1.25 !important;
  position: static !important;
  z-index: 2;
}

.book-card p {
  margin: 0 0 18px !important;
  line-height: 1.5 !important;
  position: static !important;
  z-index: 2;
}

.book-card a {
  margin-top: auto !important;
  display: inline-block !important;
  position: static !important;
}
.book-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 24px !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
}

.book-card {
  min-height: 500px !important;
  padding: 18px !important;
}

.book-card .book-cover {
  height: 260px !important;
  min-height: 260px !important;
  max-height: 260px !important;
}

.book-card .book-cover img {
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
}

@media (max-width: 1000px) {
  .book-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 600px) {
  .book-grid {
    grid-template-columns: 1fr !important;
  }
}
.activity-card img {
  max-width: 100%;
  width: 100%;
  height: auto;
  display: block;
  margin: 0 auto 18px;
  border-radius: 14px;
}
.activity-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 24px !important;
  max-width: 1100px !important;
  margin: 0 auto !important;
}

.activity-card {
  background: #fff8e8;
  border-radius: 22px;
  padding: 22px;
  text-align: center;
  box-shadow: 0 12px 28px rgba(72, 44, 22, 0.18);
}

.activity-card img {
  max-width: 100%;
  height: auto;
  display: block;
}

.activity-card h3 {
  margin: 12px 0 10px;
}

.activity-card p {
  line-height: 1.5;
}

@media (max-width: 900px) {
  .activity-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 600px) {
  .activity-grid {
    grid-template-columns: 1fr !important;
  }
}

.download-card {
  text-align: center;
}
.download-card h3,
.download-card p,
.download-card a {
  text-align: center;
}

.download-card img {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.max-image-wrap {
  text-align: center;
  background: none;
  box-shadow: none;
  border: none;
  padding: 0;
}

.meet-max-image {
  width: 220px;
  max-width: 50%;
  height: auto;
  display: block;
  margin: 0 auto 18px;
  border-radius: 0;
  background: none;
  box-shadow: none;
}

.max-facts {
  list-style-position: inside;
  text-align: left;
  display: inline-block;
  margin: 0 auto;
  padding-left: 0;
}
.soundcloud-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  background: #ff5500;
  color: #ffffff;
  font-weight: 800;
  text-decoration: none;
  padding: 12px 24px;
  border-radius: 12px;
  box-shadow: 0 8px 18px rgba(255, 85, 0, 0.28);
}

.soundcloud-icon {
  font-size: 1.3rem;
  line-height: 1;
}
.artwork-feature-box {
  max-width: 420px;
  margin: 0 auto;
  padding: 16px;
}

.artwork-preview {
  width: 100%;
  aspect-ratio: 8.5 / 11;
  background: #fffaf0;
  border-radius: 16px;
  border: 4px solid #f0d9a6;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.artwork-preview img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.artwork-submit-link {
  display: block;
  max-width: 420px;
  margin: 18px auto 0;
  padding: 14px 18px;
  text-align: center;
  background: #ffb347;
  color: #3b260f;
  font-weight: 700;
  text-decoration: none;
  border-radius: 999px;
  box-shadow: 0 8px 18px rgba(72, 44, 22, 0.18);
}

.artwork-submit-link {
  transition: transform 0.2s ease;
}
.hero {
  width: 100% !important;
  max-width: none !important;
  margin: 0 auto !important;
  padding: 80px 40px !important;
  display: block !important;
  text-align: center !important;
}

.hero-copy {
  width: 100% !important;
  max-width: 1100px !important;
  margin: 0 auto !important;
  text-align: center !important;
}

.hero-copy h1 {
  max-width: 1000px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.hero-copy .lead {
  max-width: 900px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.button-row {
  justify-content: center !important;
}
.max-feature-row {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  gap: 48px !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
}

.meet-max-side {
  flex: 1 !important;
  max-width: 560px !important;
  display: grid !important;
  grid-template-columns: 220px 1fr !important;
  gap: 28px !important;
  align-items: start !important;
}

.meet-max-side img {
  max-width: 220px !important;
}

@media (max-width: 950px) {
  .max-feature-row {
    flex-direction: column !important;
    align-items: center !important;
  }

  .meet-max-side {
    grid-template-columns: 1fr !important;
    text-align: center !important;
  }
}
* {
  box-sizing: border-box;
}

html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

img {
  max-width: 100%;
  height: auto;
}

.feature-row {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 40px;
  max-width: 1200px;
  margin: 40px auto;
  padding: 0 24px;
  flex-wrap: wrap;
}

@media (max-width: 768px) {
  .feature-row {
    flex-direction: column;
    align-items: center;
    gap: 28px;
    padding: 0 16px;
  }

  .feature-row > div {
    width: 100% !important;
    max-width: 420px !important;
  }

  #meet-max {
    width: 100% !important;
    max-width: 420px !important;
    display: block !important;
    text-align: center;
  }

  #meet-max img {
    width: 220px !important;
    max-width: 80% !important;
  }

  #meet-max ul {
    text-align: left;
    margin-bottom: 20px;
  }
}
@media (max-width: 900px) {
  .book-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 600px) {
  .book-grid {
    grid-template-columns: 1fr !important;
  }

  .book-card {
    width: 100%;
    max-width: 360px;
    margin: 0 auto;
  }
}
@media (max-width: 768px) {
  .activity-grid {
    grid-template-columns: 1fr !important;
  }

  .activity-card {
    max-width: 360px;
    margin: 0 auto;
  }
}

* {
  box-sizing: border-box;
}

html,
body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

img {
  max-width: 100%;
  height: auto;
}

/* General section safety */
.section {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 60px 24px;
}

/* Book grid */
.book-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 24px !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
}

.book-card {
  width: 100%;
  min-width: 0;
}

/* Activity grid */
.activity-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 24px !important;
  max-width: 1100px !important;
  margin: 0 auto !important;
}

.activity-card {
  width: 100%;
  min-width: 0;
}

/* Submit artwork + Meet Max section */
.max-feature-layout {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 40px;
  max-width: 1200px;
  margin: 40px auto;
  padding: 0 24px;
  width: 100%;
}

.submitted-art-section {
  width: 42%;
  max-width: 512px;
  min-width: 280px;
  text-align: center;
}

.submitted-art-box {
  width: 100%;
  aspect-ratio: 8.5 / 11;
}

.meet-max-box {
  width: 48%;
  max-width: 560px;
  min-width: 300px;
  display: flex;
  align-items: flex-start;
  gap: 28px;
}

/* Tablet */
@media (max-width: 1000px) {
  .book-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  .activity-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  .max-feature-layout {
    flex-wrap: wrap;
  }

  .submitted-art-section,
  .meet-max-box {
    width: 100%;
    max-width: 560px;
  }
}

/* Phone */
@media (max-width: 600px) {
  .section {
    padding: 42px 16px;
  }

  .book-grid {
    grid-template-columns: 1fr !important;
  }

  .activity-grid {
    grid-template-columns: 1fr !important;
  }

  .book-card,
  .activity-card {
    max-width: 360px;
    margin-left: auto;
    margin-right: auto;
  }

  .max-feature-layout {
    display: block;
    padding: 0 16px;
  }

  .submitted-art-section {
    width: 100%;
    max-width: 360px;
    margin: 0 auto 36px;
  }

  .meet-max-box {
    width: 100%;
    max-width: 360px;
    margin: 0 auto;
    display: block;
    text-align: center;
  }

  .meet-max-box img {
    width: 220px !important;
    max-width: 80%;
  }

  .meet-max-box ul {
    display: inline-block;
    text-align: left;
    margin-bottom: 20px;
  }

  .trait-row {
    justify-content: center;
    flex-wrap: wrap;
  }
* {
  box-sizing: border-box;
}

html,
body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

body {
  margin: 0;
}

img {
  max-width: 100%;
  height: auto;
}

.section {
  width: 100%;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
}
}
.hero {
  width: 100%;
  max-width: none;
  padding: 80px 24px;
  text-align: center;
}

.hero-copy {
  width: 100%;
  max-width: 1100px;
  margin: 0 auto;
  text-align: center;
}

.hero-copy h1,
.hero-copy .lead,
.hero-copy .motto {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

.hero-copy .lead {
  max-width: 950px;
}

.button-row {
  display: flex;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
}

.max-feature-layout {
  display: grid;
  grid-template-columns: minmax(280px, 420px) minmax(320px, 1fr);
  gap: 40px;
  align-items: start;
  max-width: 1200px;
  margin: 40px auto;
  padding: 0 24px;
}

.submitted-art-section {
  width: 100%;
  text-align: center;
}

.submitted-art-box {
  width: 100%;
  aspect-ratio: 8.5 / 11;
  background: #fffaf0;
  border: 4px dashed #d9a441;
  border-radius: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px;
  box-shadow: 0 10px 24px rgba(72,44,22,0.18);
  overflow: hidden;
}

.submitted-art-box img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.submit-art-button {
  display: block;
  margin-top: 16px;
  padding: 14px 18px;
  background: #ffb347;
  color: #3b260f;
  font-weight: 700;
  text-decoration: none;
  border-radius: 999px;
  box-shadow: 0 8px 18px rgba(72,44,22,0.18);
}

.meet-max-box {
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 28px;
  align-items: start;
  width: 100%;
}

.meet-max-image-area {
  text-align: center;
}

.meet-max-image-area img {
  width: 200px;
  height: auto;
  display: block;
  margin: 0 auto 18px;
}

.meet-max-text {
  min-width: 0;
}

.trait-row {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.book-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 22px !important;
  max-width: 1180px !important;
  margin: 0 auto !important;
}

.book-card {
  width: 100% !important;
  min-width: 0 !important;
  min-height: auto !important;
  padding: 16px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
}

.book-cover {
  width: 100% !important;
  height: 220px !important;
  min-height: 220px !important;
  max-height: 220px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-bottom: 14px !important;
  overflow: hidden !important;
}

.book-cover img {
  max-width: 100% !important;
  max-height: 100% !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  display: block !important;
}

.book-card h3 {
  font-size: 1rem !important;
  line-height: 1.2 !important;
  margin: 8px 0 !important;
}

.book-card p {
  font-size: 0.88rem !important;
  line-height: 1.4 !important;
  margin: 0 0 14px !important;
}

.book-card a {
  margin-top: auto !important;
}

.book-placeholder {
  background: #fff8e8;
  border: 3px dashed #d9a441;
  border-radius: 12px;
  color: #7a4a16;
  font-weight: 800;
  text-align: center;
}

.activity-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 24px !important;
  max-width: 1100px !important;
  margin: 0 auto !important;
}

.activity-card {
  width: 100% !important;
  min-width: 0 !important;
  text-align: center !important;
}

.activity-card img {
  max-width: 260px !important;
  width: 100% !important;
  height: auto !important;
  display: block !important;
  margin: 0 auto 12px !important;
  border-radius: 14px !important;
}

.soundcloud-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  background: #ff5500;
  color: #ffffff;
  font-weight: 800;
  text-decoration: none;
  padding: 12px 24px;
  border-radius: 12px;
}

@media (max-width: 1050px) {
  .book-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  .max-feature-layout {
    grid-template-columns: 360px 1fr;
    gap: 28px;
  }
}

  .meet-max-box {
    grid-template-columns: 170px 1fr;
    gap: 20px;
  }

  .meet-max-image-area img {
    width: 170px;
  }
}

@media (max-width: 820px) {
  .site-header { flex-wrap: wrap; }

  .site-nav {
    width: 100%;
    justify-content: center;
    flex-wrap: wrap;
  }

  .max-feature-layout {
    grid-template-columns: 1fr;
    max-width: 440px;
    gap: 34px;
  }

  .meet-max-box {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .meet-max-text {
    text-align: center;
  }

  .trait-row {
    justify-content: center;
  }

  .book-grid {
    grid-template-columns: repeat(2, minmax(140px, 1fr)) !important;
    gap: 16px !important;
  }

  .book-cover {
    height: 190px !important;
    min-height: 190px !important;
    max-height: 190px !important;
  }
}

.activity-grid {
  grid-template-columns: 1fr !important;
  max-width: 380px !important;
}
}

@media (max-width: 480px) {
  .section {
    padding-left: 14px;
    padding-right: 14px;
  }

  .hero {
    padding: 56px 16px;
  }

  .hero-copy h1 {
    font-size: clamp(2rem, 11vw, 3.2rem);
  }

  .max-feature-layout {
    padding: 0 14px;
    max-width: 100%;
  }

  .submitted-art-section,
  .meet-max-box {
    max-width: 360px;
    margin-left: auto;
    margin-right: auto;
  }

  .book-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }

  .book-card {
    padding: 10px !important;
  }
}
  .book-cover {
    height: 145px !important;
    min-height: 145px !important;
    max-height: 145px !important;
  }

  .book-card h3 {
    font-size: 0.82rem !important;
  }

  .book-card p {
    font-size: 0.74rem !important;
    line-height: 1.25 !important;
  }

  .book-card .btn,
  .book-card a {
    font-size: 0.72rem !important;
    padding: 8px 9px !important;
  }
}
body {
  font-family: "Trebuchet MS", Arial, sans-serif;
}

h1, h2, h3 {
  font-family: Georgia, "Times New Roman", serif;
}

.btn,
.nav-cta,
.soundcloud-button {
  font-family: "Trebuchet MS", Arial, sans-serif;
}
.max-feature-layout {
  width: 100%;
  max-width: 1200px;
  margin: 50px auto;
  padding: 0 24px;
  display: grid;
  grid-template-columns: 420px 1fr;
  gap: 40px;
  align-items: start;
}

.submitted-art-section {
  width: 100%;
  text-align: center;
}

.submitted-art-box {
  width: 100%;
  aspect-ratio: 8.5 / 11;
  background: #fffaf0;
  border: 4px dashed #d9a441;
  border-radius: 18px;
  padding: 12px;
  box-shadow: 0 10px 24px rgba(72,44,22,0.18);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.submitted-art-box img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.submit-art-button {
  display: block;
  margin-top: 16px;
  padding: 14px 18px;
  background: #ffb347;
  color: #3b260f;
  font-weight: 700;
  text-decoration: none;
  border-radius: 999px;
  box-shadow: 0 8px 18px rgba(72,44,22,0.18);
}

.meet-max-box {
  width: 100%;
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 28px;
  align-items: start;
}

.meet-max-image-area {
  text-align: center;
}

.meet-max-image-area img {
  width: 220px;
  max-width: 100%;
  height: auto;
  display: block;
  margin: 0 auto 18px;
}

.meet-max-image-area ul {
  display: inline-block;
  text-align: left;
  margin: 0 auto;
  padding-left: 20px;
}

.meet-max-text {
  min-width: 0;
}

@media (max-width: 850px) {
  .max-feature-layout {
    display: grid !important;
    grid-template-columns: 1fr !important;
    max-width: 430px !important;
    padding: 0 16px !important;
  }

  .meet-max-box {
    display: grid !important;
    grid-template-columns: 1fr !important;
    text-align: center !important;
  }

  .meet-max-text {
    text-align: center;
  }
}
.max-feature-layout {
  width: 100%;
  max-width: 1200px;
  margin: 50px auto;
  padding: 0 24px;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 36px;
  align-items: stretch;
}

.feature-panel {
  width: 100%;
  min-width: 0;
}

.submitted-art-section {
  text-align: center;
}

.submitted-art-box {
  width: 100%;
  max-width: 100%;
  aspect-ratio: 8.5 / 11;
  background: #fffaf0;
  border: 4px dashed #d9a441;
  border-radius: 18px;
  padding: 12px;
  box-shadow: 0 10px 24px rgba(72,44,22,0.18);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.submitted-art-box img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.submit-art-button {
  display: block;
  margin-top: 16px;
  padding: 14px 18px;
  background: #ffb347;
  color: #3b260f;
  font-weight: 700;
  text-decoration: none;
  border-radius: 999px;
  box-shadow: 0 8px 18px rgba(72,44,22,0.18);
}

.meet-max-box {
  display: grid !important;
  grid-template-columns: 220px 1fr;
  gap: 28px;
  align-items: start;
}

.meet-max-image-area {
  text-align: center;
}

.meet-max-image-area img {
  width: 220px;
  max-width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
}

.meet-max-text {
  min-width: 0;
}

@media (max-width: 850px) {
  .max-feature-layout {
    grid-template-columns: 1fr !important;
    max-width: 430px;
  }

  .meet-max-box {
    grid-template-columns: 1fr !important;
    text-align: center;
  }
}
html {
  scroll-behavior: smooth;
  scroll-padding-top: 210px;
}

section,
#books,
#meet-max,
#activities,
#parents,
#about,
#shop,
#songs {
  scroll-margin-top: 210px;
}