/* Shared typography and the selected playful palette. */
.playful-toy { display: none; pointer-events: none; user-select: none; }
/* Shared fifth audience card: full-width layout in all three designs. */
.support-grid > .support-card--school { grid-column: 1 / -1; display: grid; grid-template-columns: auto minmax(0, 1fr) minmax(0, 1.65fr) auto; grid-template-areas: "number title copy tag"; gap: 18px 24px; align-items: center; }
.support-grid > .support-card--school :is(.card-index, h3, p, .card-tag) { margin: 0; min-height: 0; }
.support-card--school .card-index { grid-area: number; }
.support-card--school h3 { grid-area: title; }
.support-card--school p { grid-area: copy; }
.support-card--school .card-tag { grid-area: tag; justify-self: start; }
.eyebrow-school { display: none; }
[data-theme="playful"] .hero .eyebrow-default { display: none; }
[data-theme="playful"] .hero .eyebrow-school { display: inline; }
[data-theme="playful"] .hero .eyebrow { max-width: 100%; }
[data-theme="playful"] .hero-bottom { display: flex; align-items: center; gap: 18px; margin-top: 22px; }
[data-theme="playful"] .hero-bottom .hero-note { margin-top: 0; flex: 1; min-width: 0; }
[data-theme="playful"] .hero-bottom .school-supplies { position: static; flex: none; width: 138px; height: 126px; object-fit: contain; }

/* 02 · Warm peach: soft portrait, airy cards, pill-shaped controls. */
html[data-theme="peach"] { --blue: #a04f32; --blue-dark: #824028; --ink: #4c342d; --muted: #796056; --mist: #fff0e6; --line: #eed8cb; --yellow: #ffdcad; background: #fffcf8; }
[data-theme="peach"] .site-header { background: #fffcf8f5; border-color: var(--line); }
[data-theme="peach"] .brand-mark { transform: rotate(0deg); gap: 4px; }
[data-theme="peach"] .brand-mark i { border-radius: 50%; }
[data-theme="peach"] .hero { background: radial-gradient(ellipse at 92% 20%, #fbd2bd 0, #fff0e4 40%, #fff8f1 72%); padding-top: 74px; border-radius: 0 0 55px 55px; }
[data-theme="peach"] h1 { font-size: clamp(3rem, 5.25vw, 4.6rem); line-height: 1.1; }
[data-theme="peach"] h1 em { text-decoration: underline; text-decoration-color: #ecc0a7; text-decoration-thickness: 7px; text-underline-offset: 9px; }
[data-theme="peach"] .hero-description { line-height: 1.9; }
[data-theme="peach"] .button { border-radius: 100px; padding-inline: 27px; }
[data-theme="peach"] .button-primary { box-shadow: 0 7px 18px #a04f3218; }
[data-theme="peach"] .nav-contact { border-radius: 100px; }
[data-theme="peach"] .portrait-frame { border-radius: 42% 42% 22px 22px; border-width: 10px; box-shadow: 0 18px 38px #a04f3215; }
[data-theme="peach"] .portrait-backdrop { background: #ebbd9e; border-radius: 45% 42% 26px 28px; transform: rotate(-7deg); inset: 10px 9px 28px 22px; }
[data-theme="peach"] .portrait-caption { border-radius: 18px; border-color: var(--line); background: #fffdf9; }
[data-theme="peach"] .portrait-spark { color: #c8835d; font-size: 4.8rem; text-shadow: none; }
[data-theme="peach"] .experience-stamp { background: #ffe5c5; border-color: #fffaf3; transform: rotate(-7deg); }
[data-theme="peach"] .hero-facts { padding-block: 29px; }
[data-theme="peach"] .about-principle { border: 0; padding: 22px 25px; border-radius: 16px; background: #fff0e4; }
[data-theme="peach"] .support-section { background: #fff0e4; border-radius: 44px; margin-inline: 20px; }
[data-theme="peach"] .support-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
[data-theme="peach"] .support-card { padding: 31px 34px; border-radius: 24px; border-color: #ead5c8; background: #fffcf9; }
[data-theme="peach"] .card-index { margin-bottom: 15px; }
[data-theme="peach"] .support-card h3 { min-height: 0; font-family: Georgia, serif; font-weight: 400; font-size: 1.6rem; }
[data-theme="peach"] .support-card p { max-width: 430px; }
[data-theme="peach"] .card-tag { background: #fbeadd; color: #88563f; border-radius: 50px; padding-inline: 14px; }
[data-theme="peach"] .skill-symbol { background: #f9e2d1; border-radius: 50%; }
[data-theme="peach"] .skill-row { padding-block: 28px; }
[data-theme="peach"] .session-panel { border-radius: 34px; background: #8d503b; }
[data-theme="peach"] :is(.session-copy .eyebrow, .session-copy > p:not(.eyebrow), .duration p, .duration-overline) { color: #ffebdb; }
[data-theme="peach"] .form-panel { background: #fff0e4; border-radius: 30px; border-color: var(--line); }
[data-theme="peach"] .form-field :is(input, textarea) { background: #fffdfa; border-color: #dfc8b9; border-radius: 12px; }
[data-theme="peach"] .form-field :is(input, textarea):focus { outline-color: #a04f3230; border-color: var(--blue); }
[data-theme="peach"] .form-field :is(input, textarea)::placeholder { color: #89736a; }

/* 03 · Playful: rounded typography, pastel panels and small illustrated companions. */
html[data-theme="playful"] { --blue: #286454; --blue-dark: #1d4d40; --ink: #314e42; --muted: #657269; --mist: #f1f5ec; --line: #d8e2d3; --yellow: #f4d17f; background: #fffef8; font-family: "Trebuchet MS", "Segoe UI", sans-serif; }
[data-theme="playful"] :is(h1, h2, h3) { font-family: "Trebuchet MS", "Segoe UI", sans-serif; font-weight: 700; letter-spacing: -.045em; }
[data-theme="playful"] h1 { font-size: clamp(2.8rem, 5vw, 4.3rem); line-height: 1.13; }
[data-theme="playful"] h2 { font-size: clamp(2.15rem, 3.6vw, 3rem); line-height: 1.2; }
[data-theme="playful"] :is(h1, h2) em { font-style: normal; font-weight: 700; }
[data-theme="playful"] h1 em { background: linear-gradient(transparent 64%, #f7dc9d 64%, #f7dc9d 94%, transparent 94%); }
[data-theme="playful"] .site-header { background: #fffef8f5; border-bottom: 2px dashed var(--line); }
[data-theme="playful"] .brand-mark { transform: rotate(9deg); gap: 4px; }
[data-theme="playful"] .brand-mark i:nth-child(2) { background: #e2a4ab; }
[data-theme="playful"] .brand-mark i:nth-child(3) { background: #7a96bf; }
[data-theme="playful"] .hero { position: relative; background: radial-gradient(circle at 4% 22%, #f3d1bf 0 5px, transparent 6px), radial-gradient(circle at 96% 75%, #cbdcbd 0 9px, transparent 10px), radial-gradient(circle at 65% 9%, #d4deed 0 6px, transparent 7px), #f5f5e9; border-radius: 0 0 60px 60px; }
[data-theme="playful"] .eyebrow { letter-spacing: .12em; }
[data-theme="playful"] .hero .eyebrow { display: inline-flex; background: #fffef7; padding: 9px 13px; border-radius: 50px; border: 1px solid #e0e5d5; }
[data-theme="playful"] .button { border-radius: 16px; border: 2px solid transparent; }
[data-theme="playful"] .button-primary { box-shadow: 0 4px 0 #173e34; }
[data-theme="playful"] .button-primary:hover { transform: translateY(-1px); box-shadow: 0 5px 0 #173e34; }
[data-theme="playful"] .nav-contact { border: 2px solid var(--line); border-radius: 15px; }
[data-theme="playful"] .portrait-frame { border-radius: 43% 41% 35% 27%; border-width: 9px; transform: rotate(3deg); box-shadow: 0 14px 28px #38553f15; }
[data-theme="playful"] .portrait-backdrop { background: #d0dfc2; transform: rotate(-4deg); border-radius: 40% 48% 30% 39%; }
[data-theme="playful"] .portrait-spark { color: #e3aa5d; text-shadow: none; font-size: 4.7rem; right: 3px; }
[data-theme="playful"] .portrait-caption { border-radius: 17px; border: 2px solid #e4e3cc; bottom: -3px; background: #fffef7; z-index: 3; }
[data-theme="playful"] .experience-stamp { background: #f5d58a; border-color: #fffef7; transform: rotate(8deg); right: -6px; bottom: 65px; z-index: 2; }
[data-theme="playful"] .experience-stamp strong { font-family: "Trebuchet MS", sans-serif; font-weight: 700; }
[data-theme="playful"] .hero-facts { border-top: 2px dashed #d1d9c5; margin-top: 59px; }
[data-theme="playful"] .hero-facts > div > span { border-radius: 50%; width: 29px; height: 29px; background: #e4ecd9; display: grid; place-items: center; flex: none; }
[data-theme="playful"] .about-principle { border: 2px dashed #d5dfc9; border-radius: 20px; padding: 20px; background: #f6f7ee; }
[data-theme="playful"] .support-section { background: #f8f1e7; position: relative; }
[data-theme="playful"] .support-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
[data-theme="playful"] .support-card { padding: 28px 32px; border: 2px solid #d8e2d0; border-radius: 25px 32px 23px 30px; background: #edf2e5; }
[data-theme="playful"] .support-card:nth-child(2) { background: #fff0cc; border-color: #ebd7a7; border-radius: 32px 22px 32px 24px; }
[data-theme="playful"] .support-card:nth-child(3) { background: #f8e5e2; border-color: #e8cbc8; border-radius: 24px 32px 22px 30px; }
[data-theme="playful"] .support-card:nth-child(4) { background: #e8eff7; border-color: #cfdbe8; }
[data-theme="playful"] .card-index { font-size: .875rem; margin-bottom: 18px; }
[data-theme="playful"] .support-card h3 { min-height: 0; font-size: 1.35rem; }
[data-theme="playful"] .support-card p { color: #56665b; }
[data-theme="playful"] .card-tag { background: #ffffffab; color: #466151; border-radius: 50px; }
[data-theme="playful"] .skill-row { border-bottom: 2px dashed var(--line); }
[data-theme="playful"] .skill-symbol { border-radius: 13px 17px 11px 16px; background: #e6eedb; }
[data-theme="playful"] .skill-row:nth-child(2n) .skill-symbol { background: #fbe6b4; }
[data-theme="playful"] .skill-row:nth-child(3n) .skill-symbol { background: #f1dcd8; }
[data-theme="playful"] .session-panel { background: #356b59; border-radius: 40px 28px 42px 24px; border: 7px solid #e6edda; }
[data-theme="playful"] :is(.session-copy .eyebrow, .session-copy > p:not(.eyebrow), .duration p, .duration-overline) { color: #f0f4dd; }
[data-theme="playful"] .duration strong { font-family: "Trebuchet MS", sans-serif; font-weight: 700; }
[data-theme="playful"] .contact-copy { position: relative; }
[data-theme="playful"] .form-panel { background: #f3f5e9; border: 2px solid #dbe3cb; border-radius: 30px; }
[data-theme="playful"] .form-field :is(input, textarea) { border-color: #cbd7c2; border-width: 2px; border-radius: 12px; background: #fffffa; }
[data-theme="playful"] .form-field :is(input, textarea):focus { outline-color: #28645430; }
[data-theme="playful"] .form-field :is(input, textarea)::placeholder { color: #6d786e; }
[data-theme="playful"] .playful-toy { display: block; position: absolute; object-fit: contain; z-index: 2; }

[data-theme="playful"] .toy-support { width: 140px; height: 140px; right: max(12px, calc((100% - 1370px) / 2)); bottom: -40px; transform: rotate(8deg); }
[data-theme="playful"] .toy-contact { width: 135px; height: 135px; right: 0; bottom: 12px; transform: rotate(5deg); }

@media (max-width: 1100px) {

  [data-theme="playful"] .toy-contact { position: relative; right: auto; bottom: auto; margin: 20px 0 0 auto; }
}
@media (max-width: 850px) {
  .support-grid > .support-card--school { grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "number title tag" ". copy copy"; }
  [data-theme="peach"] .hero { padding-top: 48px; }

  [data-theme="peach"] .support-card, [data-theme="playful"] .support-card { padding: 26px; }
}
@media (max-width: 680px) {
  .support-grid > .support-card--school { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "number tag" "title title" "copy copy"; gap: 15px 18px; }
  [data-theme="peach"] .hero { padding-top: 36px; border-radius: 0 0 32px 32px; }
  [data-theme="peach"] h1 { font-size: clamp(2.65rem, 9.6vw, 4rem); }
  [data-theme="peach"] h1 em { text-decoration-thickness: 5px; text-underline-offset: 5px; }
  [data-theme="peach"] .support-section { margin-inline: 0; border-radius: 28px; }
  [data-theme="peach"] .support-grid, [data-theme="playful"] .support-grid { grid-template-columns: 1fr; gap: 17px; }
  [data-theme="peach"] .support-card, [data-theme="playful"] .support-card { padding: 27px; }
  [data-theme="peach"] .session-panel { border-radius: 25px; }
  [data-theme="playful"] h1 { font-size: clamp(2.35rem, 8.5vw, 3.5rem); }
  [data-theme="playful"] h2 { font-size: 2.15rem; }
  [data-theme="playful"] .hero { border-radius: 0 0 36px 36px; }
  [data-theme="playful"] .hero .eyebrow { font-size: .75rem; letter-spacing: .05em; }
  [data-theme="playful"] .hero-visual { margin-top: 10px; }
  [data-theme="playful"] .hero-bottom { margin-top: 18px; gap: 12px; }
  [data-theme="playful"] .hero-bottom .school-supplies { width: 110px; height: 110px; }

  [data-theme="playful"] .toy-support { width: 105px; height: 105px; bottom: -30px; }
  [data-theme="playful"] .toy-contact { display: none; }
  [data-theme="playful"] .session-panel { border-width: 4px; padding: 29px 23px; }
}
@media print { .playful-toy { display: none !important; } }
