/* ==========================================================================
   Mehrdooneh – children's & YA publisher theme
   Playful glassmorphism · light/dark · RTL/LTR (logical properties) · self-hosted fonts (SIL OFL)
   ========================================================================== */

/* ---------- fonts (self-hosted, see /assets/fonts/LICENSE.md) ---------- */
@font-face{font-family:"Vazirmatn";src:url(../fonts/vazirmatn-var.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Lalezar";src:url(../fonts/lalezar-arabic.woff2) format("woff2");font-weight:400;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0898-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:"Lalezar";src:url(../fonts/lalezar-latin.woff2) format("woff2");font-weight:400;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Fredoka";src:url(../fonts/fredoka-latin-var.woff2) format("woff2");font-weight:300 700;font-display:swap}
@font-face{font-family:"Nunito";src:url(../fonts/nunito-latin-var.woff2) format("woff2");font-weight:200 1000;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Nunito";src:url(../fonts/nunito-latin-ext-var.woff2) format("woff2");font-weight:200 1000;font-display:swap;unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

/* ---------- tokens: light ---------- */
:root{
  --f-body:"Vazirmatn",Tahoma,"Segoe UI",sans-serif; --f-head:"Lalezar","Vazirmatn",sans-serif; --head-w:400; --head-ls:0;
  --bg:#FFF8EC; --bg-2:#FFEFD6; --ink:#23264A; --ink-2:#464A70; --muted:#585C80; --line:rgba(35,38,74,.12);
  --link:#B03A27; --link-h:#8A2A1B;
  --sun:#FFC83D; --sun-2:#FFD96E; --coral:#FF6B57; --sky:#4CC3E0; --leaf:#6CC24A; --plum:#8E6CD1; --pink:#FF8FB1;
  --glass:rgba(255,255,255,.58); --glass-2:rgba(255,255,255,.78); --glass-b:rgba(255,255,255,.8); --glass-hl:rgba(255,255,255,.9);
  --shadow:0 18px 40px -22px rgba(92,62,160,.42),0 2px 6px rgba(92,62,160,.06);
  --shadow-h:0 26px 50px -22px rgba(92,62,160,.55),0 4px 12px rgba(92,62,160,.1);
  --glow:0 0 0 1px rgba(255,255,255,.6) inset;
  --btn-ink:#23264A; --btn-bg:linear-gradient(135deg,#FFD25E,#FFB938); --btn-shadow:0 10px 22px -10px rgba(230,150,20,.75);
  --ghost-bg:rgba(255,255,255,.6); --ghost-b:rgba(35,38,74,.16);
  --chip-on:#23264A; --chip-on-ink:#FFF8EC;
  --footer-bg:#23264A; --footer-ink:#EDEBFF; --footer-mut:#C9C6EA; --footer-link:#FFD25E;
  --demo-bg:#FFE6A1; --demo-ink:#3A2F00;
  --blob-1:rgba(255,200,61,.55); --blob-2:rgba(76,195,224,.42); --blob-3:rgba(255,107,87,.34); --blob-4:rgba(108,194,74,.36);
  /* tile tints (bg / strong / ink) */
  --sky-t:#D9F3FA; --sky-s:#4CC3E0; --sky-i:#0B5063;
  --sun-t:#FFF0C2; --sun-s:#FFC83D; --sun-i:#6A4A00;
  --coral-t:#FFE1DB; --coral-s:#FF7A66; --coral-i:#8E2617;
  --leaf-t:#E2F5D6; --leaf-s:#6CC24A; --leaf-i:#245E22;
  --plum-t:#ECE4FB; --plum-s:#9B7BDB; --plum-i:#4B2F93;
  --teal-t:#D5F1EC; --teal-s:#2EB3A2; --teal-i:#0A5A52;
  --r:22px; --r-lg:30px; --r-sm:14px; --pad:clamp(18px,2.4vw,30px);
  --container:1200px; --header-h:72px;
  color-scheme:light;
}
html[lang=en]{--f-body:"Nunito",system-ui,"Segoe UI",sans-serif; --f-head:"Fredoka","Nunito",sans-serif; --head-w:600; --head-ls:-.01em}

/* ---------- tokens: dark ---------- */
:root[data-theme=dark]{
  --bg:#141631; --bg-2:#1B1E42; --ink:#F4F1FF; --ink-2:#D6D3F2; --muted:#B7B4DA; --line:rgba(255,255,255,.12);
  --link:#FFB4A4; --link-h:#FFD3C9;
  --glass:rgba(36,40,86,.52); --glass-2:rgba(40,44,92,.82); --glass-b:rgba(255,255,255,.12); --glass-hl:rgba(255,255,255,.18);
  --shadow:0 20px 44px -22px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.03);
  --shadow-h:0 28px 56px -20px rgba(0,0,0,.8),0 0 30px -8px rgba(142,108,209,.45);
  --glow:0 0 0 1px rgba(255,255,255,.07) inset;
  --ghost-bg:rgba(255,255,255,.06); --ghost-b:rgba(255,255,255,.22);
  --chip-on:#FFD25E; --chip-on-ink:#1B1E42;
  --footer-bg:#0D0F25; --footer-ink:#EDEBFF; --footer-mut:#B9B6DE; --footer-link:#FFD25E;
  --demo-bg:#2C2858; --demo-ink:#FFE6A1;
  --blob-1:rgba(255,200,61,.16); --blob-2:rgba(76,195,224,.2); --blob-3:rgba(255,107,87,.16); --blob-4:rgba(142,108,209,.3);
  --sky-t:rgba(76,195,224,.16); --sky-i:#A9E7F6; --sun-t:rgba(255,200,61,.15); --sun-i:#FFE08A; --coral-t:rgba(255,122,102,.16); --coral-i:#FFC2B6;
  --leaf-t:rgba(108,194,74,.16); --leaf-i:#BDEBA6; --plum-t:rgba(155,123,219,.2); --plum-i:#D8C9FF; --teal-t:rgba(46,179,162,.17); --teal-i:#9FE9DE;
  color-scheme:dark;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme=light]){
    --bg:#141631; --bg-2:#1B1E42; --ink:#F4F1FF; --ink-2:#D6D3F2; --muted:#B7B4DA; --line:rgba(255,255,255,.12);
    --link:#FFB4A4; --link-h:#FFD3C9;
    --glass:rgba(36,40,86,.52); --glass-2:rgba(40,44,92,.82); --glass-b:rgba(255,255,255,.12); --glass-hl:rgba(255,255,255,.18);
    --shadow:0 20px 44px -22px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.03);
    --shadow-h:0 28px 56px -20px rgba(0,0,0,.8),0 0 30px -8px rgba(142,108,209,.45);
    --glow:0 0 0 1px rgba(255,255,255,.07) inset;
    --ghost-bg:rgba(255,255,255,.06); --ghost-b:rgba(255,255,255,.22);
    --chip-on:#FFD25E; --chip-on-ink:#1B1E42;
    --footer-bg:#0D0F25; --footer-ink:#EDEBFF; --footer-mut:#B9B6DE; --footer-link:#FFD25E;
    --demo-bg:#2C2858; --demo-ink:#FFE6A1;
    --blob-1:rgba(255,200,61,.16); --blob-2:rgba(76,195,224,.2); --blob-3:rgba(255,107,87,.16); --blob-4:rgba(142,108,209,.3);
    --sky-t:rgba(76,195,224,.16); --sky-i:#A9E7F6; --sun-t:rgba(255,200,61,.15); --sun-i:#FFE08A; --coral-t:rgba(255,122,102,.16); --coral-i:#FFC2B6;
    --leaf-t:rgba(108,194,74,.16); --leaf-i:#BDEBA6; --plum-t:rgba(155,123,219,.2); --plum-i:#D8C9FF; --teal-t:rgba(46,179,162,.17); --teal-i:#9FE9DE;
    color-scheme:dark;
  }
}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;background:var(--bg);scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 16px)}
html,body{overflow-x:clip}
body{margin:0;font-family:var(--f-body);font-size:1.0625rem;line-height:1.85;color:var(--ink);background:transparent;min-height:100vh;display:flex;flex-direction:column;transition:color .3s}
html[lang=en] body{line-height:1.7}
main{flex:1;outline:none}
img,svg{max-width:100%;display:block}
[hidden]{display:none!important}
a{color:var(--link);text-decoration-thickness:.08em;text-underline-offset:.2em}
a:hover{color:var(--link-h)}
:focus-visible{outline:3px solid var(--sky);outline-offset:3px;border-radius:8px}
h1,h2,h3,h4{font-family:var(--f-head);font-weight:var(--head-w);letter-spacing:var(--head-ls);line-height:1.35;margin:0 0 .5em;color:var(--ink);text-align:start}
html[lang=en] h1,html[lang=en] h2,html[lang=en] h3{line-height:1.18}
h1{font-size:clamp(2rem,4.6vw,3.4rem)} h2{font-size:clamp(1.55rem,2.8vw,2.2rem)} h3{font-size:1.2rem}
p{margin:0 0 1em}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:clamp(16px,3vw,28px)}
.container.narrow{max-width:820px}
.section{padding-block:clamp(40px,6vw,80px)} .pt-0{padding-top:0}
.center{text-align:center}
.small{font-size:.9rem;color:var(--muted)}

/* ---------- justified body copy ---------- */
p,.prose li,blockquote,.bio{text-align:justify;text-justify:inter-word;text-align-last:start;hyphens:manual}
html[lang=en] p,html[lang=en] .prose li,html[lang=en] blockquote,html[lang=en] .bio{hyphens:auto;-webkit-hyphens:auto}
html[lang=fa] p,html[lang=ar] p{word-spacing:.02em}
/* short labels & UI copy stay ragged */
.eyebrow,.post-meta,.bc-meta,.bc-price,.count,.form-msg,.bd-price,.bd-by,.feat-people,.role,.works,.footer-bottom p,.tags,.nf-code,.chip-label,.c-card p,.demo-bar,.note{text-align:start;text-align-last:auto;hyphens:manual}
.center p,.nf-box p,.person .bio{text-align-last:center}

/* ---------- background blobs ---------- */
.bg-blobs{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.bg-blobs span{position:absolute;border-radius:50%;width:56vmax;height:56vmax;opacity:1;animation:drift 38s ease-in-out infinite alternate}
.bg-blobs .b1{background:radial-gradient(closest-side,var(--blob-1),transparent);inset-block-start:-22vmax;inset-inline-start:-16vmax}
.bg-blobs .b2{background:radial-gradient(closest-side,var(--blob-2),transparent);inset-block-start:10vh;inset-inline-end:-24vmax;animation-delay:-12s}
.bg-blobs .b3{background:radial-gradient(closest-side,var(--blob-3),transparent);inset-block-end:-26vmax;inset-inline-start:20vw;animation-delay:-20s}
.bg-blobs .b4{background:radial-gradient(closest-side,var(--blob-4),transparent);inset-block-end:-10vmax;inset-inline-end:-10vmax;width:40vmax;height:40vmax;animation-delay:-6s}
@keyframes drift{0%{transform:translate(0,0) scale(1)}100%{transform:translate(4vmax,3vmax) scale(1.08)}}

/* ---------- glass ---------- */
.glass{background:var(--glass);-webkit-backdrop-filter:blur(16px) saturate(1.5);backdrop-filter:blur(16px) saturate(1.5);border:1px solid var(--glass-b);border-radius:var(--r);box-shadow:var(--shadow),var(--glow)}
.pad{padding:var(--pad)}

/* ---------- skip / demo bar ---------- */
.skip{position:absolute;inset-inline-start:12px;top:-60px;z-index:200;background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:12px;font-weight:700}
.skip:focus{top:12px;color:var(--bg)}
.demo-bar{background:var(--demo-bg);color:var(--demo-ink);font-size:.86rem;text-align:center;padding:6px 16px;line-height:1.6}

/* ---------- header (blur lives on ::before so the fixed drawer is not clipped) ---------- */
.site-header{position:sticky;top:0;z-index:60}
.site-header::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--glass);-webkit-backdrop-filter:blur(18px) saturate(1.6);backdrop-filter:blur(18px) saturate(1.6);border-block-end:1px solid var(--glass-b);transition:box-shadow .3s,background .3s}
.site-header.scrolled::before{background:var(--glass-2);box-shadow:0 10px 30px -18px rgba(60,40,120,.45)}
.header-row{display:flex;align-items:center;gap:16px;min-height:var(--header-h)}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);flex-shrink:0}
.brand:hover{color:var(--ink)}
/* brand lockup (text-as-path SVG from mehrdooneh-logos; fills themed here) */
.lockup{display:block;height:60px;width:auto;overflow:visible}
.lockup .lk-main{fill:var(--ink)} .lockup .lk-sub{fill:var(--coral-i)}
.lockup .lk-mark{overflow:visible}
.lockup .lk-mark>*{filter:drop-shadow(0 3px 5px rgba(255,170,40,.28))}
/* mascot motion: sprout sway + blink + wave (all off under prefers-reduced-motion) */
.m-sprout{transform-box:view-box;transform-origin:50px 22px;animation:sprout 3.8s ease-in-out infinite alternate}
.brand:hover .m-sprout,.brand:focus-visible .m-sprout{animation-name:sprout-hi}
@keyframes sprout{from{transform:rotate(-5deg)}to{transform:rotate(5deg)}}
@keyframes sprout-hi{from{transform:rotate(-12deg)}to{transform:rotate(12deg)}}
.m-eyes{transform-box:fill-box;transform-origin:50% 50%;animation:blink 5.5s infinite}
@keyframes blink{0%,93%,100%{transform:scaleY(1)}96%{transform:scaleY(.12)}}
.m-wave{transform-box:view-box;transform-origin:76px 62px;animation:wave 2.6s ease-in-out infinite}
@keyframes wave{0%,40%,100%{transform:rotate(0)}10%,30%{transform:rotate(-14deg)}20%{transform:rotate(6deg)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes sway{from{transform:rotate(-6deg)}to{transform:rotate(6deg)}}

.nav{margin-inline-start:auto}
.nav ul{list-style:none;display:flex;gap:2px;margin:0;padding:0}
.nav a{display:block;padding:8px 12px;border-radius:999px;text-decoration:none;color:var(--ink-2);font-weight:700;font-size:.97rem;white-space:nowrap;transition:background .2s,color .2s}
.nav a:hover{background:var(--glass-2);color:var(--ink)}
.nav a[aria-current=page]{background:var(--sun);color:#23264A}
.nav-top{display:none}
.header-actions{display:flex;align-items:center;gap:8px}
.icon-btn{inline-size:42px;block-size:42px;display:inline-grid;place-items:center;border-radius:50%;border:1px solid var(--glass-b);background:var(--ghost-bg);color:var(--ink);cursor:pointer;padding:0;transition:transform .2s,background .2s;text-decoration:none}
.icon-btn:hover{transform:translateY(-2px);background:var(--glass-2);color:var(--ink)}
.ico-svg{width:20px;height:20px}
.menu-toggle{display:none}
.theme-toggle .i-sun{display:none}
:root[data-theme=dark] .theme-toggle .i-sun{display:inline}
:root[data-theme=dark] .theme-toggle .i-moon{display:none}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .theme-toggle .i-sun{display:inline}:root:not([data-theme=light]) .theme-toggle .i-moon{display:none}}
.theme-toggle span{display:inline-grid;place-items:center}
.lang-switch{display:flex;border:1px solid var(--glass-b);background:var(--ghost-bg);border-radius:999px;padding:3px}
.lang-switch a{min-width:34px;height:34px;display:grid;place-items:center;border-radius:999px;text-decoration:none;color:var(--ink-2);font-weight:800;font-size:.85rem;padding-inline:8px;font-family:"Vazirmatn","Nunito",sans-serif}
.lang-switch a[aria-current=true]{background:var(--ink);color:var(--bg)}
.lang-switch a:hover:not([aria-current]){background:var(--glass-2);color:var(--ink)}
.search-panel{display:none;padding-block:0 14px}
.search-panel.open{display:block;animation:fadeDown .25s ease}
.search-form{display:flex;gap:10px}
.search-form input{flex:1}
@keyframes fadeDown{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.nav-backdrop{position:fixed;inset:0;background:rgba(20,22,49,.45);z-index:70;opacity:0;transition:opacity .3s}
.nav-backdrop.show{opacity:1}

/* ---------- forms ---------- */
input,select,textarea{font:inherit;color:var(--ink);background:var(--glass-2);border:1.5px solid var(--ghost-b);border-radius:14px;padding:11px 14px;min-height:46px;width:100%;transition:border-color .2s,box-shadow .2s}
textarea{resize:vertical;min-height:140px}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--sky);box-shadow:0 0 0 4px rgba(76,195,224,.25)}
input::placeholder,textarea::placeholder{color:var(--muted);opacity:1}
.field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.field label{font-weight:700;font-size:.92rem;color:var(--ink-2)}
.form-msg{margin:.6em 0 0;font-weight:700;color:var(--leaf-i);min-height:1em}

/* ---------- buttons, pills, chips ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:10px 22px;border-radius:999px;border:0;font:inherit;font-weight:800;text-decoration:none;cursor:pointer;transition:transform .2s,box-shadow .2s,background .2s;white-space:nowrap}
.btn-primary{background:var(--btn-bg);color:var(--btn-ink);box-shadow:var(--btn-shadow)}
.btn-primary:hover{transform:translateY(-2px) rotate(-1deg);color:var(--btn-ink);box-shadow:0 14px 26px -10px rgba(230,150,20,.85)}
.btn-ghost{background:var(--ghost-bg);color:var(--ink);border:1.5px solid var(--ghost-b);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.btn-ghost:hover{background:var(--glass-2);color:var(--ink);transform:translateY(-2px)}
.btn-sm{min-height:40px;padding:6px 16px;font-size:.92rem}
.btn-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:1.2em}
.btn-row.center{justify-content:center}
.pills{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.pill{display:inline-flex;align-items:center;padding:2px 11px;border-radius:999px;font-size:.78rem;font-weight:800;line-height:1.9;text-decoration:none;background:var(--plum-t);color:var(--plum-i)}
.age-sky,.cat-sky{background:var(--sky-t);color:var(--sky-i)} .age-sun,.cat-sun{background:var(--sun-t);color:var(--sun-i)} .age-coral,.cat-coral{background:var(--coral-t);color:var(--coral-i)}
.age-leaf,.cat-leaf{background:var(--leaf-t);color:var(--leaf-i)} .age-plum,.cat-plum{background:var(--plum-t);color:var(--plum-i)} .age-teal,.cat-teal{background:var(--teal-t);color:var(--teal-i)}
.pill-cat{background:var(--sky-t);color:var(--sky-i)} .pill-sample{background:var(--sun-t);color:var(--sun-i)}
a.pill:hover{filter:brightness(.96)}
.badge{position:absolute;inset-block-start:12px;inset-inline-start:12px;padding:2px 10px;border-radius:999px;font-size:.75rem;font-weight:800;box-shadow:0 4px 10px rgba(0,0,0,.12);line-height:1.9}
.badge-new{background:#2F7D32;color:#fff} .badge-soon{background:#6A48B0;color:#fff} .badge-best{background:#B03A27;color:#fff}
.chip-group{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:12px}
.chip-label{font-weight:800;font-size:.88rem;color:var(--muted);margin-inline-end:4px}
.chip{font:inherit;font-size:.9rem;font-weight:700;padding:6px 14px;min-height:38px;border-radius:999px;border:1.5px solid var(--ghost-b);background:var(--ghost-bg);color:var(--ink);cursor:pointer;transition:all .2s}
.chip:hover{border-color:var(--ink-2)}
.chip[aria-pressed=true]{background:var(--chip-on);color:var(--chip-on-ink);border-color:var(--chip-on)}
.chip-tag{direction:inherit}
.tag{display:inline-block;font-weight:700;font-size:.88rem;text-decoration:none;color:var(--sky-i);background:var(--sky-t);padding:1px 10px;border-radius:999px;margin:2px 0 2px 4px;margin-inline:0 6px}
.tag:hover{color:var(--ink);background:var(--sun-t)}

/* ---------- section heads & decorations ---------- */
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:26px;flex-wrap:wrap}
.sec-head h2{margin:0}
.sec-p{margin:.4em 0 0;color:var(--ink-2);max-width:60ch}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-weight:800;font-size:.88rem;color:var(--coral-i);margin:0 0 .4em;letter-spacing:.01em}
.eyebrow::before{content:"";width:18px;height:18px;flex-shrink:0;background:conic-gradient(from 45deg,var(--sun),var(--coral),var(--sky),var(--leaf),var(--sun));border-radius:50% 50% 50% 6px;transform:rotate(45deg)}
.more-link{font-weight:800;text-decoration:none;display:inline-flex;gap:6px;align-items:center;padding:6px 4px}
.more-link .arr{display:inline-block;transition:transform .2s}
html[dir=ltr] .more-link .arr{transform:scaleX(-1)}
.more-link:hover .arr{transform:translateX(-4px)} html[dir=ltr] .more-link:hover .arr{transform:scaleX(-1) translateX(-4px)}
.deco{position:absolute;width:44px;height:44px;pointer-events:none;animation:bob 6s ease-in-out infinite;z-index:1}
@keyframes bob{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-8px) rotate(8deg)}}
.reveal{transition:opacity .7s ease,transform .7s ease}
.js .reveal{opacity:0;transform:translateY(18px)}
.js .reveal.in{opacity:1;transform:none}

/* ---------- hero ---------- */
.hero{padding-block:clamp(28px,5vw,64px) clamp(20px,4vw,40px);position:relative}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(20px,4vw,56px);align-items:center}
.hero h1{font-size:clamp(2.3rem,5.4vw,4rem);margin-bottom:.35em}
.hl{position:relative;white-space:nowrap;color:var(--coral-i);background:linear-gradient(transparent 62%,var(--sun-t) 62%,var(--sun-t) 92%,transparent 92%);padding-inline:.08em}
:root[data-theme=dark] .hl{color:#FFD25E;background:linear-gradient(transparent 62%,rgba(255,107,87,.35) 62%,rgba(255,107,87,.35) 92%,transparent 92%)}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .hl{color:#FFD25E;background:linear-gradient(transparent 62%,rgba(255,107,87,.35) 62%,rgba(255,107,87,.35) 92%,transparent 92%)}}
.lead{font-size:clamp(1.05rem,1.6vw,1.22rem);color:var(--ink-2);max-width:56ch}
.stats{list-style:none;padding:0;margin:26px 0 0;display:flex;flex-wrap:wrap;gap:10px}
.stats li{background:var(--glass);border:1px solid var(--glass-b);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:6px 14px;border-radius:999px;font-weight:800;font-size:.9rem;color:var(--ink-2)}
.hero-art{position:relative;height:clamp(320px,38vw,470px)}
.hero-sun{position:absolute;inset:8% 10%;border-radius:50%;background:radial-gradient(circle at 40% 40%,var(--sun-2),var(--sun) 55%,rgba(255,200,61,0) 72%);opacity:.75;filter:saturate(1.1)}
.hc{position:absolute;width:44%;border-radius:12px;box-shadow:0 30px 50px -22px rgba(60,30,120,.55);transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.hc .cover{border-radius:12px}
.hc1{inset-inline-start:30%;top:6%;width:46%;transform:rotate(-3deg);z-index:3}
.hc2{inset-inline-start:2%;top:24%;transform:rotate(-11deg);z-index:2}
.hc3{inset-inline-end:2%;top:28%;transform:rotate(9deg);z-index:2}
.hero-art:hover .hc1{transform:rotate(0) translateY(-8px)} .hero-art:hover .hc2{transform:rotate(-14deg) translateX(-6px)} .hero-art:hover .hc3{transform:rotate(12deg) translateX(6px)}
.hero-mascot{position:absolute;z-index:5;bottom:-2%;inset-inline-end:34%;width:clamp(96px,24%,150px);height:auto;filter:drop-shadow(0 16px 18px rgba(60,30,120,.28))}
.ha-1{top:0;inset-inline-start:8%;width:46px;height:46px} .ha-2{top:4%;inset-inline-end:6%;width:84px;height:84px;animation-duration:9s}
.ha-3{bottom:2%;inset-inline-start:12%;width:56px;height:56px} .ha-4{bottom:10%;inset-inline-end:10%;width:40px;height:40px;animation-delay:-2s} .ha-5{top:44%;inset-inline-start:46%;width:30px;height:30px;z-index:4;animation-delay:-3s}

/* ---------- age tiles ---------- */
.age-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:16px}
.age-tile{--t:var(--sky-t);--s:var(--sky-s);--i:var(--sky-i);display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;padding:22px 12px 18px;border-radius:var(--r-lg);text-decoration:none;color:var(--ink);background:var(--t);border:1px solid var(--glass-b);box-shadow:var(--shadow),var(--glow);transition:transform .25s,box-shadow .25s;position:relative;overflow:hidden}
.age-tile::after{content:"";position:absolute;width:120px;height:120px;border-radius:50%;background:var(--s);opacity:.16;inset-block-start:-50px;inset-inline-end:-40px}
.age-tile:hover{transform:translateY(-6px) rotate(-1.5deg);box-shadow:var(--shadow-h);color:var(--ink)}
.age-ico{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:var(--s);color:#fff;box-shadow:0 10px 18px -8px var(--s);margin-bottom:6px}
.age-ico .ico-svg{width:30px;height:30px}
.age-tile strong{font-family:var(--f-head);font-weight:var(--head-w);font-size:1.55rem;line-height:1.2;color:var(--i)}
.age-nick{font-weight:700;font-size:.9rem;color:var(--ink-2)} .age-cnt{font-size:.8rem;color:var(--muted);font-weight:700}
.t-sky{--t:var(--sky-t);--s:var(--sky-s);--i:var(--sky-i)} .t-sun{--t:var(--sun-t);--s:var(--sun-s);--i:var(--sun-i)} .t-coral{--t:var(--coral-t);--s:var(--coral-s);--i:var(--coral-i)}
.t-leaf{--t:var(--leaf-t);--s:var(--leaf-s);--i:var(--leaf-i)} .t-plum{--t:var(--plum-t);--s:var(--plum-s);--i:var(--plum-i)} .t-teal{--t:var(--teal-t);--s:var(--teal-s);--i:var(--teal-i)}

/* ---------- category tiles ---------- */
.cat-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.cat-tile{--t:var(--sun-t);--s:var(--sun-s);--i:var(--sun-i);position:relative;display:flex;flex-direction:column;gap:12px;padding:22px;border-radius:var(--r-lg);text-decoration:none;color:var(--ink);background:linear-gradient(160deg,var(--t),var(--glass));border:1px solid var(--glass-b);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:var(--shadow),var(--glow);transition:transform .25s,box-shadow .25s;min-height:190px}
.cat-tile:hover{transform:translateY(-6px);box-shadow:var(--shadow-h);color:var(--ink)}
.cat-ico{width:56px;height:56px;border-radius:18px 18px 18px 6px;display:grid;place-items:center;background:var(--s);color:#fff;transform:rotate(-6deg);box-shadow:0 10px 18px -8px var(--s)}
.cat-ico .ico-svg{width:28px;height:28px}
.cat-tile strong{display:block;font-family:var(--f-head);font-weight:var(--head-w);font-size:1.3rem;color:var(--i);line-height:1.3}
.cat-desc{display:block;font-size:.9rem;color:var(--ink-2);line-height:1.6;margin-top:4px}
.cat-cnt{position:absolute;inset-block-start:16px;inset-inline-end:16px;min-width:32px;height:32px;padding-inline:8px;display:grid;place-items:center;border-radius:999px;background:var(--glass-2);font-weight:800;font-size:.85rem;color:var(--ink-2)}

/* ---------- tabs ---------- */
.tablist{display:inline-flex;flex-wrap:wrap;gap:6px;padding:6px;border-radius:999px;background:var(--glass);border:1px solid var(--glass-b);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);margin-bottom:22px;box-shadow:var(--glow)}
.tablist [role=tab]{font:inherit;font-weight:800;padding:8px 18px;min-height:42px;border-radius:999px;border:0;background:transparent;color:var(--ink-2);cursor:pointer}
.tablist [role=tab][aria-selected=true]{background:var(--btn-bg);color:#23264A;box-shadow:var(--btn-shadow)}
.tab-panel:focus-visible{outline-offset:8px}

/* ---------- book cards ---------- */
.book-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.book-card{position:relative;display:flex;flex-direction:column;padding:14px;border-radius:var(--r);transition:transform .3s,box-shadow .3s}
.book-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-h),var(--glow)}
.cover-link{position:relative;display:block;border-radius:12px;background:linear-gradient(160deg,var(--glass-hl),transparent);padding:10px 10px 14px;perspective:600px}
.cover{width:100%;height:auto;aspect-ratio:4/5;border-radius:10px;box-shadow:0 18px 26px -16px rgba(40,20,90,.55),0 2px 4px rgba(0,0,0,.08);transition:transform .35s ease}
.book-card:hover .cover{transform:rotate(-2deg) scale(1.03)}
.cv-t{font-family:var(--f-head);font-weight:var(--head-w)}
.bc-body{padding:10px 4px 2px;display:flex;flex-direction:column;flex:1}
.bc-title{font-size:1.06rem;margin:0 0 4px;line-height:1.5}
html[lang=en] .bc-title{line-height:1.3}
.bc-title a{color:var(--ink);text-decoration:none}
.bc-title a::after{content:"";position:absolute;inset:0;border-radius:var(--r)}
.bc-title a:hover{color:var(--link)}
.bc-meta{font-size:.84rem;color:var(--muted);margin:0 0 8px;line-height:1.6}
.bc-price{margin:auto 0 0;font-weight:800;color:var(--ink)}

/* ---------- featured ---------- */
.featured{display:grid;grid-template-columns:minmax(260px,380px) 1fr;gap:clamp(24px,4vw,56px);align-items:center;padding:clamp(22px,4vw,48px);border-radius:var(--r-lg);background:linear-gradient(135deg,var(--leaf-t),var(--glass) 55%,var(--sun-t));position:relative;overflow:hidden}
.feat-cover{position:relative;padding:8px}
.feat-cover .cover{transform:rotate(-4deg);box-shadow:0 34px 50px -24px rgba(40,20,90,.6)}
.fd-1{top:-6px;inset-inline-end:-4px;width:54px;height:54px} .fd-2{bottom:2px;inset-inline-start:-8px}
.feat-people{display:flex;flex-wrap:wrap;gap:6px 18px;font-weight:700;color:var(--ink-2)}
blockquote{margin:1em 0;padding:14px 20px;border-inline-start:5px solid var(--sun);background:var(--glass-2);border-radius:0 16px 16px 0;font-size:1.05rem;color:var(--ink-2)}
[dir=rtl] blockquote{border-radius:16px 0 0 16px}
.facts{list-style:none;padding:0;margin:1.2em 0 0;display:flex;flex-wrap:wrap;gap:12px}
.facts li{background:var(--glass-2);border:1px solid var(--glass-b);border-radius:16px;padding:8px 16px;display:flex;flex-direction:column;line-height:1.5}
.facts span{font-size:.8rem;color:var(--muted);font-weight:700}

/* ---------- parents ---------- */
.section-tint{background:linear-gradient(180deg,transparent,var(--sky-t) 30%,var(--sky-t) 70%,transparent)}
.parents-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:28px;align-items:start}
.parents-panel{padding:clamp(22px,3.6vw,40px);position:relative;overflow:hidden}
.pp-d{top:18px;inset-inline-end:18px}
.checklist{list-style:none;padding:0;margin:1em 0 0;display:grid;gap:10px}
.checklist li{display:flex;gap:12px;align-items:center;font-weight:700;background:var(--glass-2);padding:10px 14px;border-radius:16px;border:1px solid var(--glass-b)}
.checklist .ico-svg{width:22px;height:22px;color:var(--coral-i);flex-shrink:0}
.post-stack{display:grid;gap:16px}
.post-stack .post-card{flex-direction:row;align-items:stretch}
.post-stack .thumb-link{flex:0 0 38%}
.post-stack .thumb{height:100%;aspect-ratio:auto;min-height:130px}

/* ---------- posts ---------- */
.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.post-card{position:relative;display:flex;flex-direction:column;overflow:hidden;transition:transform .3s,box-shadow .3s}
.post-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-h),var(--glow)}
.thumb-link{display:block;overflow:hidden}
.thumb{width:100%;aspect-ratio:16/9;height:auto;transition:transform .5s ease}
.post-card:hover .thumb{transform:scale(1.05)}
.pc-body{padding:16px 18px 18px;display:flex;flex-direction:column;flex:1}
.pc-title{font-size:1.12rem;line-height:1.55;margin:0 0 6px}
html[lang=en] .pc-title{line-height:1.3}
.pc-title a{color:var(--ink);text-decoration:none}
.pc-title a:hover{color:var(--link)}
.pc-sum{color:var(--ink-2);font-size:.95rem;margin-bottom:10px}
.post-meta{font-size:.84rem;color:var(--muted);margin:auto 0 6px;display:flex;flex-wrap:wrap;align-items:center;gap:4px}
.post-meta .ico-svg{width:15px;height:15px;display:inline-block;vertical-align:-2px}
.tags{margin:4px 0 0;position:relative;z-index:2}
.load-more-wrap{display:flex;justify-content:center;margin-top:28px}

/* ---------- people ---------- */
.people-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.people-grid.wide{grid-template-columns:repeat(3,1fr)} .people-grid.two{grid-template-columns:repeat(2,1fr)}
.person{padding:22px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;transition:transform .3s}
.person:hover{transform:translateY(-4px)}
.person h3{margin:0;font-size:1.12rem;text-align:center}
.avatar{width:104px;height:104px;border-radius:50%;box-shadow:0 12px 22px -12px rgba(60,30,120,.55);border:4px solid var(--glass-hl)}
.avatar.sm{width:52px;height:52px;border-width:2px}
.role{color:var(--coral-i);font-weight:800;font-size:.88rem;margin:0}
.bio{font-size:.93rem;color:var(--ink-2);margin:6px 0 0}
.works{font-size:.88rem;margin:8px 0 0;color:var(--muted)} .works span{font-weight:800}
.people-grid.two .person,.people-grid.wide .person{flex-direction:row;text-align:start;align-items:flex-start}
.people-grid.two .person h3,.people-grid.wide .person h3{text-align:start}

/* ---------- newsletter ---------- */
.newsletter{position:relative;display:grid;grid-template-columns:1fr 1.1fr;gap:24px;align-items:center;padding:clamp(24px,4vw,48px);border-radius:var(--r-lg);background:linear-gradient(120deg,var(--plum-t),var(--glass) 50%,var(--coral-t));overflow:hidden}
.newsletter h2{margin-bottom:.2em}
.newsletter p{text-align-last:start}
.nl-form{display:flex;flex-wrap:wrap;gap:10px}
.nl-form input{flex:1 1 220px}
.nl-form .form-msg{flex-basis:100%;margin:0}
.nl-txt{display:flex;align-items:center;gap:clamp(12px,2vw,22px);position:relative;z-index:1}
.nl-mascot{flex:0 0 auto;width:clamp(72px,9vw,108px);height:auto}
.d-a{top:14px;inset-inline-start:46%} .d-b{bottom:-6px;inset-inline-end:4%;width:90px;height:90px;opacity:.8} .d-c{bottom:10px;inset-inline-start:12px}

/* ---------- page hero, crumbs ---------- */
.page-hero{position:relative;padding-block:clamp(26px,4vw,52px) clamp(22px,3vw,36px)}
.page-hero h1{margin-bottom:.25em}
.ph-d1{top:24%;inset-inline-end:8%;width:56px;height:56px} .ph-d2{top:56%;inset-inline-end:22%;width:70px;height:70px;animation-delay:-3s}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:4px;padding:0;margin:0 0 14px;font-size:.88rem;color:var(--muted)}
.crumbs li{display:flex;align-items:center;gap:4px}
.crumbs li+li::before{content:"‹";margin-inline:4px;color:var(--muted)}
[dir=ltr] .crumbs li+li::before{content:"›"}
.crumbs a{color:var(--ink-2);text-decoration:none;font-weight:700} .crumbs a:hover{color:var(--link)}
.crumbs [aria-current]{color:var(--muted);max-width:40ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ---------- filters ---------- */
.filters{padding:20px 22px;margin-bottom:26px}
.filter-row{display:flex;gap:14px;flex-wrap:wrap}
.filter-row .field{margin:0} .filter-row .grow{flex:1 1 260px} .filter-row .field:not(.grow){flex:0 1 220px}
.filter-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:14px;flex-wrap:wrap;min-height:40px}
.count{margin:0;font-weight:800;color:var(--ink-2)}
.empty{padding:28px;text-align:center;font-weight:700;text-align-last:center}
.empty p{margin:0;text-align:center;text-align-last:center}
.empty-mascot{display:block;width:96px;height:auto;margin:0 auto 10px}

/* ---------- book detail ---------- */
.bd-grid{display:grid;grid-template-columns:minmax(260px,420px) 1fr;gap:clamp(24px,4vw,56px);align-items:start;margin-top:10px}
.bd-cover{position:relative;padding:18px;position:sticky;top:calc(var(--header-h) + 24px)}
.cover.big{box-shadow:0 40px 60px -28px rgba(40,20,90,.65)}
.bd-cover .badge{inset-block-start:30px;inset-inline-start:30px}
.bd-d1{top:-8px;inset-inline-end:0;width:54px;height:54px} .bd-d2{bottom:-10px;inset-inline-start:-14px;width:90px;height:90px}
.bd-info{padding:clamp(20px,3vw,36px)}
.bd-info h1{font-size:clamp(1.8rem,3.4vw,2.6rem)}
.bd-by{font-weight:700;color:var(--ink-2)}
.spec{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:1.4em 0}
.spec div{background:var(--glass-2);border:1px solid var(--glass-b);border-radius:14px;padding:8px 14px}
.spec dt{font-size:.8rem;color:var(--muted);font-weight:700} .spec dd{margin:0;font-weight:800}
.bd-buy{display:flex;flex-wrap:wrap;align-items:center;gap:14px;padding-top:12px;border-top:1px dashed var(--line)}
.bd-buy .form-msg{flex-basis:100%;margin:0}
.bd-price{font-size:1.4rem;font-weight:900;margin:0}
.sub-h{margin-top:clamp(36px,5vw,60px)}

/* ---------- article / news detail ---------- */
.post-head h1{font-size:clamp(1.9rem,4vw,2.9rem)}
.post-lead{font-size:1.18rem;color:var(--ink-2)}
.byline{display:flex;align-items:center;gap:12px;margin:16px 0 22px}
.byline a{font-weight:800;text-decoration:none;color:var(--ink)}
.byline .post-meta{margin:0}
.post-figure{margin:0 0 18px;overflow:hidden;padding:0}
.thumb.big{aspect-ratio:16/8}
.note{background:var(--sun-t);color:var(--sun-i);font-weight:700;padding:10px 16px;border-radius:14px;font-size:.92rem}
.prose{font-size:1.1rem}
.prose h2{font-size:1.5rem;margin-top:1.6em}
.prose ul{padding-inline-start:1.3em} .prose li{margin-bottom:.4em} .prose li::marker{color:var(--coral)}
.post-foot{margin-top:34px;padding-top:22px;border-top:1px dashed var(--line);display:grid;gap:18px}
.share-h{font-size:1.05rem;margin-bottom:10px}
.share-row{display:flex;flex-wrap:wrap;gap:8px}
.share-btn{display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:6px 14px;border-radius:999px;border:1.5px solid var(--ghost-b);background:var(--ghost-bg);color:var(--ink);font:inherit;font-weight:700;font-size:.92rem;text-decoration:none;cursor:pointer}
.share-btn:hover{background:var(--glass-2);color:var(--ink)}
.share-btn .ico-svg{width:18px;height:18px}
.related{padding-bottom:20px}

/* ---------- about / contact / 404 ---------- */
.about-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:24px;align-items:start}
.age-legend ul{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.age-legend li{display:flex;justify-content:space-between;gap:10px;padding:8px 14px;border-radius:14px;background:var(--t);color:var(--i)}
.age-legend li span{color:var(--ink-2);font-size:.9rem}
.values{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.value{padding:26px}
.v-ico{width:52px;height:52px;flex-shrink:0;border-radius:16px;display:grid;place-items:center;background:var(--btn-bg);color:#23264A;margin-bottom:12px;box-shadow:var(--btn-shadow)}
.v-ico .ico-svg{width:26px;height:26px}
.timeline{list-style:none;padding:0;margin:0;display:grid;gap:12px;position:relative}
.timeline li{display:flex;gap:14px;align-items:baseline}
.tl-y{font-family:var(--f-head);font-weight:var(--head-w);font-size:1.25rem;color:var(--coral-i);min-width:64px}
.ticks{padding-inline-start:1.2em} .ticks li::marker{content:"✓  ";color:var(--leaf-i)}
.contact-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:24px;align-items:start}
.contact-cards{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.c-card{display:flex;gap:14px;padding:18px;align-items:flex-start}
.c-card .v-ico{margin:0;width:46px;height:46px}
.c-card h2{font-size:1.05rem;margin:0 0 2px} .c-card p{margin:0;font-size:.95rem}
.c-card a{font-weight:700;word-break:break-word}
.map-ph{grid-column:1/-1;min-height:180px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;position:relative;background:repeating-linear-gradient(45deg,var(--sky-t) 0 14px,var(--glass) 14px 28px);font-weight:800;color:var(--ink-2)}
.map-ph .ico-svg{width:34px;height:34px;color:var(--coral)}
.m1{top:14px;inset-inline-end:16px}
.nf{text-align:center}
.nf-box{max-width:640px;margin-inline:auto;padding:clamp(24px,5vw,56px);position:relative;text-align:center}
.nf-box h1{text-align:center}
.nf-mascot .m-zz>*{stroke:var(--ink)}
.nf-mascot{display:block;width:min(230px,62%);height:auto;margin-inline:auto;filter:drop-shadow(0 18px 22px rgba(60,30,120,.18))}
.nf-code{font-family:var(--f-head);font-size:3.4rem;line-height:1;margin:18px 0 4px;color:var(--coral-i);text-align:center}
.nf1{top:16px;inset-inline-start:18px} .nf2{top:22px;inset-inline-end:18px;width:80px;height:80px}

/* ---------- footer ---------- */
.site-footer{margin-top:clamp(40px,6vw,80px);background:var(--footer-bg);color:var(--footer-ink);position:relative;padding-top:56px}
.footer-wave{position:absolute;inset-inline:0;top:-28px;height:30px;background:radial-gradient(circle at 20px 30px,var(--footer-bg) 20px,transparent 21px) repeat-x;background-size:40px 30px}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.3fr;gap:32px}
.site-footer .brand,.site-footer .brand:hover{color:var(--footer-ink)}
.site-footer .lk-main{fill:var(--footer-ink)} .site-footer .lk-sub{fill:var(--footer-link)}
.site-footer p{color:var(--footer-mut);font-size:.95rem}
.site-footer .brand{display:inline-block;margin-bottom:6px} .lockup-foot{height:72px}
.f-h{font-size:1.1rem;color:var(--footer-ink);margin-bottom:.7em}
.f-list{list-style:none;padding:0;margin:0 0 14px;display:grid;gap:6px}
.f-list a{color:var(--footer-mut);text-decoration:none} .f-list a:hover{color:var(--footer-link);text-decoration:underline}
.f-contact li{display:flex;gap:8px;align-items:flex-start;color:var(--footer-mut);font-size:.95rem}
.f-contact .ico-svg{width:18px;height:18px;flex-shrink:0;margin-top:5px;color:var(--footer-link)}
.socials{display:flex;gap:8px}
.site-footer .icon-btn{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.16);color:var(--footer-ink)}
.site-footer .btn-ghost{background:rgba(255,255,255,.06);color:var(--footer-ink);border-color:rgba(255,255,255,.26)}
.footer-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-top:36px;padding-block:18px;border-top:1px solid rgba(255,255,255,.12)}
.footer-bottom p{margin:0;font-size:.85rem}

/* ==========================================================================
   Responsive: desktop ≥1100 · tablet landscape ~1024 · tablet portrait ~768 · mobile ~390
   ========================================================================== */
@media (max-width:1100px){
  .menu-toggle{display:inline-grid}
  .nav{position:fixed;inset-block:0;inset-inline-end:0;width:min(86vw,340px);z-index:80;background:var(--glass-2);-webkit-backdrop-filter:blur(22px) saturate(1.6);backdrop-filter:blur(22px) saturate(1.6);border-inline-start:1px solid var(--glass-b);box-shadow:-20px 0 50px -20px rgba(20,10,60,.5);padding:18px;transform:translateX(105%);transition:transform .35s cubic-bezier(.2,.8,.2,1),visibility .35s;visibility:hidden;overflow-y:auto;margin:0}
  [dir=rtl] .nav{transform:translateX(-105%)}
  .nav.open{transform:none;visibility:visible}
  .nav-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;font-family:var(--f-head);font-size:1.4rem}
  .nav ul{flex-direction:column;gap:4px}
  .nav a{padding:12px 16px;font-size:1.05rem;border-radius:16px}
  .header-actions{margin-inline-start:auto}
  .cat-grid{grid-template-columns:repeat(3,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:1024px){
  .age-grid{grid-template-columns:repeat(3,1fr)}
  .people-grid{grid-template-columns:repeat(2,1fr)}
  .people-grid.wide{grid-template-columns:repeat(2,1fr)}
  .post-grid{grid-template-columns:repeat(2,1fr)}
  .post-grid>.post-card:nth-child(3):last-child{grid-column:1/-1;flex-direction:row}
  .post-grid>.post-card:nth-child(3):last-child .thumb-link{flex:0 0 45%}
  .post-grid>.post-card:nth-child(3):last-child .thumb{height:100%}
  .values{grid-template-columns:1fr 1fr 1fr;gap:14px}
}
@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr}
  .hero-text{order:1} .hero-art{order:2;max-width:560px;width:100%;margin-inline:auto}
  .parents-grid,.about-grid,.contact-grid{grid-template-columns:1fr}
  .book-grid{grid-template-columns:repeat(3,1fr);gap:16px}
  .newsletter{grid-template-columns:1fr}
  .values{grid-template-columns:1fr}
}
@media (max-width:768px){
  .cat-grid{grid-template-columns:repeat(2,1fr)}
  .featured{grid-template-columns:1fr;text-align:start}
  .feat-cover{max-width:300px;margin-inline:auto}
  .bd-grid{grid-template-columns:1fr}
  .bd-cover{position:relative;top:0;max-width:380px;margin-inline:auto}
  .people-grid.two{grid-template-columns:1fr}
}
@media (max-width:600px){
  body{font-size:1rem}
  .lockup{height:46px}
  .lang-switch a{min-width:30px;height:32px;padding-inline:6px}
  .icon-btn{inline-size:38px;block-size:38px}
  .header-actions{gap:5px}
  .age-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .cat-grid{grid-template-columns:1fr}
  .cat-tile{min-height:0;flex-direction:row;align-items:center;padding:16px}
  .cat-tile .cat-ico{flex-shrink:0}
  .book-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .book-card{padding:10px}
  .cover-link{padding:6px 6px 10px}
  .bc-title{font-size:.98rem}
  .post-grid,.people-grid,.people-grid.wide{grid-template-columns:1fr}
  .post-grid>.post-card:nth-child(3):last-child{flex-direction:column}
  .post-stack .post-card{flex-direction:column}
  .post-stack .thumb{min-height:0;aspect-ratio:16/9}
  .footer-grid{grid-template-columns:1fr}
  .contact-cards{grid-template-columns:1fr}
  .spec{grid-template-columns:1fr 1fr}
  .stats li{font-size:.82rem}
  .sec-head{align-items:flex-start}
  .filters{padding:16px}
  .chip{padding:5px 12px;font-size:.86rem}
  .hero-art{height:300px}
  .people-grid.wide .person{flex-direction:column;align-items:center;text-align:center}
  .people-grid.wide .person h3{text-align:center}
}
@media (max-width:420px){
  .site-header .lockup{height:42px}
  .icon-btn{inline-size:36px;block-size:36px}
  .lang-switch{padding:2px}
  .lang-switch a{min-width:28px;height:30px;font-size:.78rem;padding-inline:5px}
  .header-row{gap:8px}
  .container{padding-inline:14px}
  .age-tile{padding:18px 8px 14px}
  .age-ico{width:54px;height:54px}
  .btn{padding:10px 18px}
  .hero-art{height:260px}
}
@media (max-width:360px){ .site-header .lockup{height:36px} }

/* ---------- motion & print ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .js .reveal{opacity:1;transform:none}
}
@media print{
  .bg-blobs,.site-header,.site-footer,.demo-bar,.share,.filters,.newsletter{display:none!important}
  .glass{background:#fff;box-shadow:none;border:1px solid #ddd;-webkit-backdrop-filter:none;backdrop-filter:none}
  body{color:#000}
}
.nav-open .site-header{z-index:90}
@media (max-width:420px){
  .header-actions{gap:4px}
  html[lang=en] .site-header .lockup{height:38px}
}
/* lazy rendering for below-the-fold blocks (all artwork is inline SVG, so there are no <img> requests to lazy-load) */
main > section:nth-of-type(n+3), .site-footer{content-visibility:auto;contain-intrinsic-size:auto 700px}
@media print{main > section, .site-footer{content-visibility:visible}}