/* Grown ups pages: same bright rooms, calmer reading layout */
.grown-nav { margin-top: var(--s6); margin-bottom: 0; }
.grown-sec { padding-block: var(--s6); }
.grown-sec:last-of-type { padding-bottom: var(--s8); }
.grown-lead { font-size: var(--text-lg); max-width: 60ch; margin: calc(var(--s3) * -1) 0 var(--s5); }

/* audience cards */
.aud { list-style: none; padding: 0; display: grid; gap: var(--s6); grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); }
.aud__card {
  --tone: var(--sun); position: relative; overflow: hidden; display: grid; gap: var(--s3); align-content: start; justify-items: start;
  background: var(--tone); color: var(--navy); border: var(--ink); border-radius: var(--r-tile); padding: var(--s6) var(--s6) var(--s6) var(--s6);
  padding-right: 130px; min-height: 260px; box-shadow: 0 7px 0 var(--navy); transition: transform var(--t-fast) var(--ease-out);
}
.aud__card:hover { transform: translateY(-4px) rotate(-.5deg); }
.aud__card--meadow { --tone: var(--meadow); color: var(--snow); }
.aud__card--navy { --tone: var(--navy); color: var(--snow); box-shadow: 0 7px 0 var(--sun-dark); }
.aud__card h2 { font-size: var(--text-xl); line-height: 1.05; color: inherit; }
.aud__card p { margin: 0 0 var(--s2); font-weight: 700; }
.aud__card img { position: absolute; right: -6px; bottom: -40px; width: 130px; filter: drop-shadow(0 4px 0 rgba(24,33,88,.35)); }

/* values */
.values { list-style: none; padding: 0; display: grid; gap: var(--s4); grid-template-columns: repeat(auto-fill, minmax(min(170px, 100%), 1fr)); }
.value { --tone: var(--lake); display: flex; align-items: center; gap: var(--s3); padding: var(--s4); background: var(--snow); border: var(--ink); border-radius: 20px;
  text-decoration: none; color: var(--navy); font-family: var(--font-display); font-size: 1.2rem; box-shadow: 0 5px 0 var(--tone); transition: transform var(--t-fast) var(--ease-pop); }
.value:hover { transform: translateY(-3px); }
.value__ico { flex: none; width: 46px; height: 46px; display: grid; place-items: center; border-radius: 14px; background: var(--tone); border: 2px solid var(--navy); }
.value__ico svg { width: 28px; height: 28px; }
.value--tie { --tone: var(--tie); } .value--sun { --tone: var(--sun); } .value--meadow { --tone: var(--meadow); }
.value--fox { --tone: var(--fox); } .value--navy { --tone: var(--navy); }

/* facts */
.facts { display: grid; gap: var(--s5); background: var(--snow); border: var(--ink); border-radius: var(--r-tile); padding: var(--s6); box-shadow: 0 7px 0 var(--meadow); }
.facts h2 { font-size: var(--text-xl); }
.facts__head p { margin: var(--s2) 0 0; }
.facts ul { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--s3); }
.facts li { position: relative; padding-left: 40px; }
.facts li::before { content: "✓"; position: absolute; left: 0; top: 0; width: 28px; height: 28px; display: grid; place-items: center; background: var(--meadow); color: var(--snow); border: 2px solid var(--navy); border-radius: 50%; font-weight: 700; }
@media (min-width: 860px) { .facts { grid-template-columns: 260px 1fr; align-items: start; } }

/* stats */
.stat-row { display: grid; gap: var(--s4); grid-template-columns: repeat(auto-fit, minmax(min(150px, 100%), 1fr)); }
.stat { display: grid; justify-items: center; text-align: center; gap: 2px; padding: var(--s5) var(--s3); background: var(--sun); border: var(--ink); border-radius: 22px; text-decoration: none; color: var(--navy); box-shadow: 0 5px 0 var(--navy); }
.stat:nth-child(2) { background: var(--lake-pale); } .stat:nth-child(3) { background: #ffe1cf; } .stat:nth-child(4) { background: #dff6e8; }
.stat strong { font-family: var(--font-display); font-weight: 400; font-size: 2.6rem; line-height: 1; }
.stat span { font-weight: 700; }

/* call to action */
.grown-cta__card { display: grid; gap: var(--s5); align-items: center; background: var(--tie); color: var(--snow); border: var(--ink); border-radius: var(--r-tile); padding: var(--s6); box-shadow: 0 7px 0 var(--navy); }
.grown-cta__card h2 { font-size: var(--text-2xl); line-height: 1; color: var(--snow); text-shadow: 0 3px 0 var(--navy); margin-bottom: var(--s3); }
.grown-cta__card p { font-size: var(--text-lg); font-weight: 700; margin-bottom: var(--s4); max-width: 46ch; }
.grown-cta__card img { width: 120px; justify-self: center; }
@media (min-width: 700px) { .grown-cta__card { grid-template-columns: 150px 1fr; } .grown-cta__card img { width: 150px; } }

/* parents: four ways */
.ways { list-style: none; padding: 0; display: grid; gap: var(--s5); grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); counter-reset: none; }
.way { --tone: var(--lake); position: relative; display: grid; gap: var(--s2); justify-items: start; align-content: start; background: var(--snow); border: var(--ink); border-radius: 24px; padding: var(--s5); box-shadow: 0 6px 0 var(--tone); }
.way--navy { --tone: var(--navy); } .way--meadow { --tone: var(--meadow); } .way--fox { --tone: var(--fox); }
.way__n { position: absolute; top: -14px; right: 16px; width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; background: var(--sun); border: 3px solid var(--navy); font-family: var(--font-display); }
.way__ico { width: 54px; height: 54px; display: grid; place-items: center; border-radius: 16px; background: var(--tone); border: 2px solid var(--navy); }
.way__ico svg { width: 32px; height: 32px; }
.way h3 { font-size: var(--text-lg); }
.way p { margin: 0 0 var(--s2); }

/* talk about it */
.asks { list-style: none; padding: 0; display: grid; gap: var(--s5); grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); }
.asks__card { background: var(--snow); border: var(--ink); border-radius: 22px; padding: var(--s5); box-shadow: 0 6px 0 var(--sun); }
.asks__card > a { text-decoration: none; color: var(--navy); font-family: var(--font-display); font-size: 1.25rem; }
.asks__card > a strong { font-weight: 400; }
.asks__card ul { margin: var(--s3) 0 0; padding: 0; list-style: none; display: grid; gap: var(--s2); }
.asks__card li { background: var(--lake-pale); border-radius: 14px 14px 14px 4px; padding: 10px 14px; font-weight: 700; }

/* Case Club+ band */
.plus-band { display: grid; gap: var(--s5); align-items: center; background: var(--navy); color: var(--snow); border: var(--ink); border-radius: var(--r-tile); padding: var(--s6); box-shadow: 0 7px 0 var(--sun-dark); overflow: hidden; }
.plus-band h2 { color: var(--sun); font-size: var(--text-xl); margin-bottom: var(--s3); }
.plus-band p { margin-bottom: var(--s4); max-width: 60ch; }
.plus-band .btn { margin: 0 var(--s2) var(--s2) 0; }
.plus-band img { width: 150px; justify-self: center; border-radius: 8px; border: 3px solid var(--snow); transform: rotate(5deg); }
@media (min-width: 760px) { .plus-band { grid-template-columns: 1fr 180px; } }

/* faq */
.faq { display: grid; gap: var(--s3); max-width: 820px; }
.faq details { background: var(--snow); border: var(--ink); border-radius: 18px; box-shadow: 0 4px 0 var(--navy); }
.faq summary { cursor: pointer; padding: var(--s4) var(--s5); font-family: var(--font-display); font-size: 1.2rem; list-style: none; display: flex; justify-content: space-between; gap: var(--s3); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; font-size: 1.6rem; line-height: 1; color: var(--tie); }
.faq details[open] summary::after { content: "–"; }
.faq details p { margin: 0; padding: 0 var(--s5) var(--s5); }

/* teachers: lesson */
.steps30 { list-style: none; padding: 0; display: grid; gap: var(--s5); grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); }
.steps30__step { --tone: var(--lake); position: relative; background: var(--tone); color: var(--navy); border: var(--ink); border-radius: 24px; padding: var(--s6) var(--s5) var(--s5); box-shadow: 0 6px 0 var(--navy); }
.steps30__step--sun { --tone: var(--sun); } .steps30__step--meadow { --tone: var(--meadow); }
.steps30__step--lake, .steps30__step--meadow { color: var(--snow); }
.steps30__step h3 { font-size: var(--text-xl); color: inherit; margin-bottom: var(--s2); }
.steps30__step p { font-weight: 700; }
.steps30__step a { color: inherit; font-weight: 700; }
.steps30__time { position: absolute; top: -16px; left: 18px; background: var(--snow); color: var(--navy); border: 3px solid var(--navy); border-radius: 999px; padding: 2px 14px; font-family: var(--font-display); }
.tips { background: var(--snow); border: var(--ink); border-radius: var(--r-tile); padding: var(--s6); box-shadow: 0 6px 0 var(--lake); }
.tips h2 { font-size: var(--text-xl); margin-bottom: var(--s3); }
.tips ul { margin: 0; padding-left: 1.2em; display: grid; gap: var(--s2); }

/* products */
.mini-products { list-style: none; padding: 0; display: grid; gap: var(--s4); grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr)); }
.mini-products li { display: grid; grid-template-columns: 64px 1fr; gap: var(--s3); align-items: center; background: var(--snow); border: var(--ink); border-radius: 18px; padding: var(--s3); box-shadow: 0 4px 0 var(--navy); }
.mini-products img { width: 64px; border-radius: 6px; border: 2px solid var(--navy); grid-row: span 2; }
.mini-products div { display: grid; gap: 2px; }

/* legal */
.origin, .author { display: grid; gap: var(--s5); align-items: center; background: var(--snow); border: var(--ink); border-radius: var(--r-tile); padding: var(--s6); box-shadow: 0 7px 0 var(--navy); }
.origin img { width: 120px; justify-self: center; }
.origin h2, .author h2 { font-size: var(--text-xl); margin-bottom: var(--s3); }
.origin p, .author p { max-width: 62ch; }
@media (min-width: 760px) { .origin { grid-template-columns: 150px 1fr; } .author { grid-template-columns: 220px 1fr; } }
.bridges { list-style: none; padding: 0; display: grid; gap: var(--s3); }
.bridge { --tone: var(--lake); display: grid; grid-template-columns: 48px 1fr; gap: var(--s2) var(--s3); align-items: center; background: var(--snow); border: var(--ink); border-left: 12px solid var(--tone); border-radius: 18px; padding: var(--s3) var(--s4); }
.bridge--sun { --tone: var(--sun); } .bridge--tie { --tone: var(--tie); } .bridge--meadow { --tone: var(--meadow); } .bridge--fox { --tone: var(--fox); } .bridge--navy { --tone: var(--navy); }
.bridge__ico { grid-row: span 2; width: 48px; height: 48px; display: grid; place-items: center; }
.bridge__ico svg { width: 34px; height: 34px; }
.bridge__kid { font-family: var(--font-display); font-size: 1.15rem; }
.bridge__arrow { display: none; }
.bridge__law { font-weight: 700; color: #4a5384; }
@media (min-width: 760px) {
  .bridge { grid-template-columns: 48px 1fr 40px 1fr; }
  .bridge__ico { grid-row: auto; }
  .bridge__arrow { display: block; font-size: 1.6rem; color: var(--tone); text-align: center; font-weight: 700; }
}
.offers { list-style: none; padding: 0; display: grid; gap: var(--s5); grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); }
.offer { display: grid; gap: var(--s2); align-content: start; justify-items: start; background: var(--sun); border: var(--ink); border-radius: 22px; padding: var(--s5); box-shadow: 0 6px 0 var(--navy); }
.offer:nth-child(even) { background: var(--lake-pale); }
.offer h3 { font-size: var(--text-lg); }
.offer p { margin: 0 0 var(--s2); }
.foundation { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--s4); background: var(--meadow); color: var(--snow); text-decoration: none; border: var(--ink); border-radius: 24px; padding: var(--s5) var(--s6); box-shadow: 0 7px 0 var(--navy); }
.foundation strong { display: block; font-family: var(--font-display); font-weight: 400; font-size: var(--text-xl); }
.foundation:hover { transform: translateY(-3px); }

/* about */
.mission { background: var(--snow); border: var(--ink); border-radius: var(--r-tile); padding: var(--s6); box-shadow: 0 7px 0 var(--fox); max-width: 900px; }
.mission h2 { font-size: var(--text-xl); margin-bottom: var(--s3); }
.mission p { font-size: var(--text-lg); max-width: 62ch; }
.author__frame { width: 200px; height: 200px; justify-self: center; border-radius: 50%; background: var(--sun); border: var(--ink); overflow: hidden; display: grid; place-items: end center; }
.author__frame img { width: 130px; margin-bottom: -60px; }
.author__eyebrow { margin: 0; font-family: var(--font-display); color: var(--tie); }
.gang-strip { list-style: none; padding: 0; display: grid; gap: var(--s3); grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); }
.gang-strip a { display: grid; justify-items: center; gap: 4px; text-decoration: none; color: var(--navy); font-family: var(--font-display); background: var(--snow); border: var(--ink); border-radius: 20px; padding: var(--s3) var(--s2) var(--s2); box-shadow: 0 4px 0 var(--navy); overflow: hidden; height: 170px; }
.gang-strip img { height: 120px; width: auto; transition: transform var(--t-med) var(--ease-pop); }
.gang-strip a:hover img { transform: translateY(-6px) scale(1.06); }

/* contact */
.contact { display: grid; gap: var(--s6); }
@media (min-width: 960px) { .contact { grid-template-columns: minmax(0, 1fr) 320px !important; align-items: start; } }
.contact__form { background: var(--snow); border: var(--ink); border-radius: var(--r-tile); padding: var(--s6); box-shadow: 0 7px 0 var(--navy); display: grid; gap: var(--s4); max-width: none; }
.contact__row { display: grid; gap: var(--s4); }
@media (min-width: 640px) { .contact__row { grid-template-columns: 1fr 1fr; } }
.contact__form select, .contact__form textarea { width: 100%; box-sizing: border-box; font: inherit; border: 3px solid var(--navy); border-radius: 14px; padding: 12px 14px; background: var(--snow); }
.contact__form textarea { resize: vertical; min-height: 160px; }
.contact__form .btn { justify-self: start; }
.contact__fine { margin: 0; font-size: .9rem; }
.contact__side { display: grid; gap: var(--s4); }
.contact__side h2 { font-size: var(--text-lg); }
.contact__side p { margin: var(--s2) 0 0; word-break: break-word; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.sent { display: grid; gap: var(--s5); align-items: center; background: var(--sun); border: var(--ink); border-radius: var(--r-tile); padding: var(--s6); box-shadow: 0 7px 0 var(--navy); }
.sent img { width: 120px; justify-self: center; }
.sent h2 { font-size: var(--text-2xl); margin-bottom: var(--s2); }
@media (min-width: 640px) { .sent { grid-template-columns: 140px 1fr; } }
.way__ico, .value__ico { background: color-mix(in srgb, var(--tone) 22%, white); }
.grown-cta { padding-block: var(--s6) var(--s8); }

@media (max-width: 520px) {
  .aud__card { padding-right: var(--s5); padding-bottom: 120px; }
  .aud__card img { width: 100px; bottom: -30px; }
}

/* privacy */
.privacy { max-width: 900px; display: grid; gap: var(--s6); }
.privacy section { display: grid; gap: var(--s3); }
.privacy h2 { font-size: var(--text-xl); }
.privacy p, .privacy li { font-size: 1.05rem; line-height: 1.6; max-width: 70ch; }
.privacy ul { margin: 0; padding-left: 1.3em; display: grid; gap: var(--s2); }
.privacy a { color: var(--lake-dark); font-weight: 700; }
.privacy__date { margin: 0; font-weight: 700; color: #4a5384; }
.privacy__draft { margin: 0; }
.privacy__short { display: grid; gap: var(--s5); align-items: center; background: var(--sun); border: var(--ink); border-radius: var(--r-tile); padding: var(--s6); box-shadow: 0 7px 0 var(--navy); }
.privacy__short img { width: 110px; justify-self: center; }
.privacy__short h2 { margin-bottom: var(--s3); }
.privacy__short li { font-weight: 700; }
@media (min-width: 700px) { .privacy__short { grid-template-columns: 130px 1fr; } }
.privacy__table { overflow-x: auto; border: var(--ink); border-radius: 18px; background: var(--snow); }
.privacy table { width: 100%; border-collapse: collapse; font-size: .98rem; }
.privacy th, .privacy td { padding: 12px 14px; text-align: left; vertical-align: top; border-bottom: 2px dashed var(--lake-pale); }
.privacy thead th { background: var(--navy); color: var(--snow); font-family: var(--font-display); font-weight: 400; }
.privacy tbody tr:last-child td { border-bottom: 0; }
.privacy td:first-child { font-weight: 700; width: 34%; }
mark.todo { background: var(--sun); color: var(--navy); font-weight: 700; padding: 0 4px; border-radius: 4px; }
@media (max-width: 640px) {
  .privacy table, .privacy tbody, .privacy tr, .privacy td { display: block; width: auto !important; }
  .privacy thead { display: none; }
  .privacy tr { border-bottom: 3px solid var(--navy); padding: 6px 0; }
  .privacy td { border: 0; padding: 6px 14px; }
  .privacy td:nth-child(2)::before { content: "When: "; font-weight: 700; }
  .privacy td:nth-child(3)::before { content: "Why: "; font-weight: 700; }
}