:root{--ink:#3D2B1F;--ink-soft:#5B4636;--accent:#0F5F5C;--paper:#FFFDF7;--wash:#FAF6EE;--hero:#FFFBF3;--desk:#E3ECE5;--number:#9B4232;--mat:#F0DCC0;--line:#EADFCB;--washes:radial-gradient(42% 60% at 0% 0%,rgba(249,211,203,.8),transparent 70%),radial-gradient(40% 55% at 100% 0%,rgba(251,231,176,.8),transparent 70%),radial-gradient(42% 60% at 0% 100%,rgba(211,238,221,.75),transparent 70%),radial-gradient(40% 55% at 100% 100%,rgba(207,227,242,.75),transparent 70%)}
body{font-family:'M PLUS Rounded 1c',sans-serif;font-weight:400;line-height:1.8;line-break:strict}
h1,h2,h3{font-weight:800;line-height:1.55;letter-spacing:0}
h2{font-size:clamp(27px,2.7vw,38px)}
.brand{font-size:22px;font-weight:800}
.hero h1{font-size:50px;line-height:1.45;letter-spacing:0}
.hero-copy .intro{font-size:18px}
.eyebrow{color:#9B4232}
.tape{font-size:18px;letter-spacing:.02em;font-weight:800;background:var(--card);color:#9B4232;clip-path:none;padding:8px 22px;box-shadow:0 2px 6px rgba(76,50,30,.12)}
.tape::before,.tape::after{content:'';position:absolute;top:-7px;width:34px;height:18px;background:rgba(150,207,188,.82)}
.tape::before{left:-14px;transform:rotate(-24deg)}
.tape::after{right:-14px;transform:rotate(22deg)}
.badges{gap:14px;margin:26px 0}
.badge{width:108px;height:108px;padding:12px;display:flex;align-items:center;justify-content:center;text-align:center;border:0;border-radius:50%;outline:2px dashed var(--badge-ring);outline-offset:-7px;font-size:16px;font-weight:800;line-height:1.45;box-shadow:0 3px 0 rgba(61,43,31,.08)}
.badge:nth-child(1){--badge-bg:#CDE9DA;--badge-fg:var(--ink);--badge-ring:#6FA98F}
.badge:nth-child(2){--badge-bg:#F9D3CB;--badge-fg:var(--ink);--badge-ring:#D98A7C}
.badge:nth-child(3){--badge-bg:#FBE7B0;--badge-fg:var(--ink);--badge-ring:#C9A15A;font-size:14px}
.hero-art{padding-top:20px}
.hero,.cta{background:var(--washes),var(--hero)}
.hero::before,.hero::after,.cta::before,.cta::after{display:none}
.section-head{max-width:800px}
.book{border-radius:6px 15px 15px 6px;border-left:8px solid var(--tape);box-shadow:4px 6px 0 rgba(120,88,58,.16),0 10px 20px -12px rgba(76,50,30,.25);transform:rotate(-1.1deg)}
.book:nth-child(even){transform:rotate(1deg)}
.book:nth-child(3n){transform:rotate(-.4deg)}
.book::before{display:none}
.book h3{font-size:22px}
.book-meta{font-size:16px;line-height:1.8}
.tools{font-size:19px}
.steps li{font-size:20px}
.situations li{font-size:21px}
.cta h2 span,.import h2 span,.parents h2 span{display:inline-block}
@media(max-width:1000px){.hero h1{font-size:41px}
.book h3{font-size:19px}
}
@media(max-width:700px){.brand{font-size:16px}
.brand small{font-size:11px}
.hero h1{font-size:33px}
.hero-copy .intro{font-size:17px}
.eyebrow{font-size:15px}
.tape{font-size:16px}
.badges{gap:13px}
.hero-art{padding-top:12px}
.section{padding:60px 0}
h2{font-size:27px}
.book-meta{gap:4px}
.drawing-copy{font-size:17px}
.steps li{font-size:18px;gap:18px}
.parents-grid{gap:30px}
.cta h2{font-size:27px}
footer nav{gap:0}
footer a{padding-inline:7px;font-size:13px}
}


/* Warm-paper r2 typography; fonts are declared only by the Japanese page. */
h1 .phrase, h2 .phrase {display:inline-block;max-width:100%;white-space:nowrap}
.hero h1 {font-size:clamp(32px,3.3vw,46px);line-height:1.5;letter-spacing:0}
.hero h1 small {display:block;font-size:.52em;line-height:1.65;margin-top:12px;font-weight:700}
.content-amount {font-size:20px}
.content-amount .tape {font-size:16px}
.book::before {display:none}
.book h3 {font-size:21px;line-height:1.55;overflow-wrap:normal}
.drawing-copy h3 {font-size:22px;line-height:1.65}
.hero-art {padding-top:0}
@media(max-width:1000px) {
  .book h3 {font-size:18px}
  .hero h1 {font-size:36px}
}
@media(max-width:700px) {
  .hero h1 {font-size:34px}
  .hero h1 small {font-size:21px}
  .hero-copy .intro {font-size:17px}
  .content-amount {font-size:19px}
  .book {padding:23px 10px 14px;border-left-width:6px}
  .book h3 {font-size:18px}
  .book-meta {font-size:15px}
  .badges {gap:12px}
  .badge {width:104px;height:104px}
  .drawing-copy h3 {font-size:21px}
}
@media(max-width:420px) {
  .header {align-items:flex-start;gap:6px}
  .brand {font-size:14px}
  .brand img {width:29px}
  .brand small {font-size:11px}
  .languages a {padding-inline:7px}
  .badges {gap:9px}
  h2 {font-size:25px}
}
@media(max-width:360px) {
  .hero h1 {font-size:30px}
  h2 {font-size:22px}
  .badge {width:84px;height:84px;font-size:13px}
  .book h3 {font-size:16px}
}

/* Explicit two-line Japanese stamps keep each line inside the circle. */
html:lang(ja) .badge > span {white-space:nowrap}
html:lang(ja) .badge:last-child {padding-inline:6px;font-size:13px}
@media(max-width:700px) {html:lang(ja) .badge:last-child {font-size:12px}}

/* Keep short final lines together in Japanese and Traditional Chinese body copy. */
html:is(:lang(ja), :lang(zh)) :is(p, li, figcaption) {text-wrap:pretty;line-break:strict}
html:is(:lang(ja), :lang(zh)) .cta-lead {text-wrap:balance}
html:lang(ja) .cta-lead .phrase {display:inline-block}