/* Kids corner intro «Τι είναι η πραξεολογία;» / "What is praxeology?" (kids_prax_intro.py, owner t1503u-t1505u: a kids' explanation of praxeology, as an intro, in place of the video).
   Kids corner index pages only (GR + EN). Sits where the banner video was: two card columns on desktop, below the heading on tablet/phone.
   Comfortaa ("PL Kids", self-hosted) like the kids books; hand-drawn clean SVG icons; owl = the Kids corner logo. No pop-ups, no JS. */
@font-face{font-family:"PL Kids";src:url(/files/explainers/comfortaa-greek-latin.woff2) format("woff2");font-weight:300 700;font-display:swap}
.kbh-stage>.kbh-in{grid-column:3;grid-row:1}
.kbh-stage>.kpi{grid-column:1/span 2;grid-row:1}
.kpi{--kc:#fffaf0;--kt:#3a2a1c;--km:#6a5440;--kl:#fff;position:relative;margin:0;padding:clamp(18px,2.2vw,26px) clamp(18px,2.4vw,30px) clamp(18px,2.2vw,24px);
  border-radius:16px;border:1px solid var(--gb);background:var(--kc);color:var(--kt);font-family:"PL Kids",var(--disp);font-size:.98rem;line-height:1.62;text-align:left;
  box-shadow:0 26px 50px -30px rgba(90,60,20,.45),0 8px 18px -14px rgba(90,60,20,.3)}
html:not([data-theme=light]) .kpi{--kc:#241d17;--kt:#f1e6d6;--km:#cdbba3;--kl:#2d251e;box-shadow:0 30px 60px -34px rgba(0,0,0,.85),0 10px 22px -16px rgba(0,0,0,.5)}
.kpi-hd{display:flex;align-items:center;gap:14px;margin:0 0 12px}
.kpi-owl{flex:none;width:64px;height:64px;display:block}
.kpi-owl svg,.kpi-ic svg{display:block;width:100%;height:100%}
.kpi h2{font-family:"PL Kids",var(--disp);font-weight:700;font-size:clamp(1.45rem,2.3vw,1.85rem);line-height:1.2;letter-spacing:-.005em;margin:0;color:var(--kt);text-wrap:balance}
.kpi-w{white-space:nowrap}
.kpi-w i{font-style:normal;display:inline-block}
.kpi-w i:nth-child(6n+1){color:#d2472e}.kpi-w i:nth-child(6n+2){color:#cf8410}.kpi-w i:nth-child(6n+3){color:#24855a}.kpi-w i:nth-child(6n+4){color:#2a78ae}.kpi-w i:nth-child(6n+5){color:#7f4fba}.kpi-w i:nth-child(6n+6){color:#c9437d}
html:not([data-theme=light]) .kpi-w i:nth-child(6n+1){color:#ff8a6c}html:not([data-theme=light]) .kpi-w i:nth-child(6n+2){color:#ffc24d}html:not([data-theme=light]) .kpi-w i:nth-child(6n+3){color:#79d39f}html:not([data-theme=light]) .kpi-w i:nth-child(6n+4){color:#7cc2f2}html:not([data-theme=light]) .kpi-w i:nth-child(6n+5){color:#c4a2f4}html:not([data-theme=light]) .kpi-w i:nth-child(6n+6){color:#ff92c1}
.kpi-sub{margin:4px 0 0;font-size:.95rem;color:var(--km)}
.kpi p{margin:0}
.kpi-lead{margin:0 0 10px!important}
.kpi-steps{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:10px}
.kpi-steps li{display:grid;grid-template-columns:48px 1fr;gap:14px;align-items:center;margin:0;padding:10px 14px 10px 10px;border-radius:14px;background:var(--kl);border:1px solid color-mix(in srgb,var(--gb) 70%,transparent)}
.kpi-ic{width:48px;height:48px;display:block}
.kpi-steps b{font-weight:700;color:var(--kt)}
.kpi-steps li:nth-child(1) b{color:#c2412a}.kpi-steps li:nth-child(2) b{color:#2a78ae}.kpi-steps li:nth-child(3) b{color:#24855a}
html:not([data-theme=light]) .kpi-steps li:nth-child(1) b{color:#ff8a6c}html:not([data-theme=light]) .kpi-steps li:nth-child(2) b{color:#7cc2f2}html:not([data-theme=light]) .kpi-steps li:nth-child(3) b{color:#79d39f}
.kpi-ps{display:grid;gap:9px;margin:0 0 12px}
.kpi-ps .kpi-p{display:grid;grid-template-columns:40px 1fr;gap:12px;align-items:start}
.kpi-ps .kpi-p .kpi-ic{width:40px;height:40px}
.kpi-ps .kpi-p.kpi-n{grid-template-columns:1fr;padding-left:52px}
.kpi-end{padding-top:10px;border-top:1px dashed color-mix(in srgb,var(--gold) 55%,transparent);font-weight:700;color:var(--kt)}
@keyframes kpi-rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:no-preference){.kpi{animation:kpi-rise .8s ease .05s both}.kpi-owl{transition:transform .3s cubic-bezier(.3,1.6,.5,1)}.kpi:hover .kpi-owl{transform:rotate(-6deg)}}
@media (max-width:987px){.kbh-stage>.kbh-in,.kbh-stage>.kpi{grid-column:1;grid-row:auto}.kpi{max-width:44rem}}
@media (max-width:720px){.kpi h2{font-size:1.38rem}.kpi{padding:16px 15px 16px;font-size:.95rem;line-height:1.58;border-radius:14px}.kpi-owl{width:52px;height:52px}.kpi-hd{gap:11px}
  .kpi-steps li{grid-template-columns:40px 1fr;gap:11px;padding:9px 11px 9px 8px;align-items:start}.kpi-ic{width:40px;height:40px}
  .kpi-ps .kpi-p{grid-template-columns:34px 1fr;gap:10px}.kpi-ps .kpi-p .kpi-ic{width:34px;height:34px}.kpi-ps .kpi-p.kpi-n{padding-left:44px}}
