/* V76: one visual language across all eight homepage destinations. */
.home-page #home-view .feature-grid {
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  grid-template-rows:none!important;
  grid-auto-rows:auto!important;
  gap:18px!important;
  max-width:1160px;
  margin-inline:auto;
}
.home-page #home-view .feature-box {
  box-sizing:border-box;
  position:relative;
  isolation:isolate;
  display:grid!important;
  grid-template-columns:minmax(0,43%) minmax(0,1fr)!important;
  grid-template-rows:minmax(0,1fr) auto!important;
  column-gap:clamp(22px,4vw,66px)!important;
  row-gap:14px!important;
  width:100%!important;
  height:auto!important;
  min-height:326px!important;
  padding:24px clamp(26px,4vw,54px)!important;
  overflow:hidden;
  border-radius:26px!important;
  border:1px solid rgba(19,65,41,.09)!important;
  box-shadow:0 9px 26px rgba(23,55,49,.09)!important;
  text-align:left!important;
  color:var(--card-text)!important;
  background:var(--card-bg)!important;
}
.home-page #home-view .feature-box::before {
  content:"";position:absolute;z-index:-1;width:280px;height:280px;
  left:-90px;top:-130px;border-radius:50%;background:rgba(255,255,255,.11);
  pointer-events:none;
}
.home-page #home-view .feature-box > img,
.home-page #home-view .feature-box > .ask-pho-art {
  grid-column:1!important;grid-row:1/3!important;
  display:block!important;width:100%!important;height:270px!important;
  max-width:none!important;min-width:0!important;
  align-self:center!important;justify-self:center!important;
  object-fit:contain!important;object-position:center!important;
  border:0!important;border-radius:0!important;
  background:none!important;box-shadow:none!important;
}
.home-page #home-view .feature-box > .ask-pho-art {overflow:visible!important;position:relative}
.home-page #home-view .feature-box > .ask-pho-art img {
  width:100%!important;height:100%!important;object-fit:contain!important;
  object-position:center!important;background:none!important;border:0!important;
}
.home-page #home-view .ask-pho-art-label,
.home-page #home-view .ask-pho-art-symbols {display:none!important}
.home-page #home-view .feature-box > div:not(.ask-pho-art) {
  grid-column:2!important;grid-row:1!important;
  display:flex!important;flex-direction:column!important;
  align-items:flex-start!important;justify-content:flex-end!important;
  align-self:end!important;justify-self:stretch!important;
  width:100%!important;min-width:0!important;
  gap:5px!important;padding:0!important;margin:0!important;
  overflow:visible!important;text-align:left!important;
}
.home-page #home-view .feature-box .box-kicker {display:none!important}
.home-page #home-view .feature-box h2,
.home-page #home-view .feature-box .fun-title {
  display:block!important;width:100%!important;max-width:100%!important;
  margin:0!important;color:var(--card-heading)!important;
  font:900 clamp(2rem,3.65vw,3.3rem)/1.02 system-ui,-apple-system,"Segoe UI",sans-serif!important;
  letter-spacing:-.045em!important;text-shadow:none!important;
  text-wrap:balance;overflow-wrap:normal!important;
}
.home-page #home-view .feature-box .title-accent {color:var(--card-accent)!important}
.home-page #home-view .feature-box .tagline {
  display:block!important;max-width:100%!important;margin:5px 0 1px!important;
  color:var(--card-heading)!important;opacity:.9;
  font:750 clamp(1rem,1.6vw,1.25rem)/1.35 system-ui,-apple-system,"Segoe UI",sans-serif!important;
  text-shadow:none!important;white-space:normal!important;
}
.home-page #home-view .feature-box .box-description {
  display:block!important;max-width:42ch!important;margin:0!important;
  color:var(--card-text)!important;
  font:500 clamp(.94rem,1.25vw,1.08rem)/1.5 system-ui,-apple-system,"Segoe UI",sans-serif!important;
  text-shadow:none!important;-webkit-line-clamp:unset!important;
  overflow:visible!important;
}
.home-page #home-view .feature-box > .box-button {
  box-sizing:border-box;grid-column:2!important;grid-row:2!important;
  width:max-content!important;max-width:100%!important;min-width:0!important;
  height:auto!important;min-height:48px!important;
  padding:11px 25px!important;margin:3px 0 0!important;
  justify-self:start!important;align-self:start!important;
  justify-content:center!important;gap:15px!important;
  border:0!important;border-radius:999px!important;
  background:var(--card-button)!important;color:var(--card-button-text)!important;
  font:850 .95rem/1.2 system-ui,-apple-system,"Segoe UI",sans-serif!important;
  white-space:normal!important;text-decoration:none!important;
  box-shadow:0 8px 16px rgba(27,41,39,.13)!important;
  transition:transform .18s ease,filter .18s ease!important;
}
.home-page #home-view .feature-box > .box-button:hover {transform:translateY(-2px)!important;filter:brightness(1.07)}
.home-page #home-view .feature-box > .box-button:focus-visible {outline:3px solid #fff;outline-offset:3px}
.home-page #home-view .ask-pho-box {--card-bg:linear-gradient(115deg,#153f83,#0c3271 72%,#092b65);--card-heading:#fff;--card-text:#f1f8ff;--card-accent:#75ed9b;--card-button:#62e58b;--card-button-text:#103e28}
.home-page #home-view .learn-box {--card-bg:linear-gradient(110deg,#fff2d0,#ffe7ae);--card-heading:#704820;--card-text:#654c33;--card-accent:#2468b6;--card-button:#2869bf;--card-button-text:#fff}
.home-page #home-view .fly-box {--card-bg:linear-gradient(110deg,#ddf6ff,#c4eafd);--card-heading:#14579f;--card-text:#28536e;--card-button:#f57d53;--card-button-text:#fff}
.home-page #home-view .run-box {--card-bg:linear-gradient(110deg,#ffc7b0,#ffa79b);--card-heading:#842d2e;--card-text:#713c39;--card-button:#ffd75a;--card-button-text:#57391e}
.home-page #home-view .racing-box {--card-bg:linear-gradient(110deg,#e3d4fb,#cebef4);--card-heading:#4a308c;--card-text:#503b7d;--card-button:#62e9b7;--card-button-text:#164f42}
.home-page #home-view .game-box {--card-bg:linear-gradient(110deg,#d8f4dd,#b9e8c9);--card-heading:#145c45;--card-text:#285b4a;--card-button:#ee854c;--card-button-text:#fff}
.home-page #home-view .fun-box {--card-bg:linear-gradient(110deg,#ffddcb,#ffcbbb);--card-heading:#a65043;--card-text:#6f4b43;--card-button:#31aa79;--card-button-text:#fff}
.home-page #home-view .discover-box {--card-bg:linear-gradient(110deg,#cef2ec,#b5e8e7);--card-heading:#11676a;--card-text:#2b6061;--card-button:#3472c1;--card-button-text:#fff}
@media(max-width:700px){
  .home-page #home-view .feature-grid {gap:14px!important}
  .home-page #home-view .feature-box {
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:auto auto auto!important;
    row-gap:8px!important;
    height:auto!important;min-height:0!important;
    padding:18px 18px 22px!important;text-align:center!important;
    border-radius:22px!important;
  }
  .home-page #home-view .feature-box > img,
  .home-page #home-view .feature-box > .ask-pho-art {
    grid-column:1!important;grid-row:1!important;
    width:100%!important;height:clamp(148px,43vw,210px)!important;
    align-self:center!important;justify-self:center!important;
  }
  .home-page #home-view .feature-box > div:not(.ask-pho-art) {
    grid-column:1!important;grid-row:2!important;
    align-items:center!important;justify-content:flex-start!important;
    align-self:start!important;justify-self:center!important;
    gap:3px!important;text-align:center!important;
  }
  .home-page #home-view .feature-box h2,
  .home-page #home-view .feature-box .fun-title {
    font-size:clamp(1.7rem,7vw,2.4rem)!important;line-height:1.08!important;
  }
  .home-page #home-view .feature-box .tagline {font-size:clamp(.9rem,3.8vw,1.05rem)!important;margin:4px 0 0!important}
  .home-page #home-view .feature-box .box-description {
    max-width:37ch!important;font-size:clamp(.85rem,3.5vw,.99rem)!important;
    line-height:1.38!important;margin:4px auto 0!important;
  }
  .home-page #home-view .feature-box > .box-button {
    grid-column:1!important;grid-row:3!important;
    width:max-content!important;max-width:100%!important;
    min-height:44px!important;height:auto!important;
    margin:9px 0 0!important;padding:10px 22px!important;
    justify-self:center!important;align-self:start!important;
    font-size:.88rem!important;
  }
}
@media(max-width:350px){
  .home-page #home-view .feature-box {padding-inline:14px!important}
  .home-page #home-view .feature-box h2 {font-size:1.55rem!important}
}
/* The three destinations hosted inside the homepage share the same visual vocabulary. */
body #fun-view {--activity-ink:#a65043;--activity-accent:#238f69;--activity-bg:#fff1e8}
body #knowledge-view {--activity-ink:#11676a;--activity-accent:#3472c1;--activity-bg:#e5f9f4}
body #game-view {--activity-ink:#145c45;--activity-accent:#d97842;--activity-bg:#e4f6e8}
body #fun-view,
body #knowledge-view,
body #game-view {color:var(--activity-ink);background:var(--activity-bg);border-radius:24px}
body :is(#fun-view,#knowledge-view,#game-view) :is(h1,h2,h3) {
  font-family:system-ui,-apple-system,"Segoe UI",sans-serif;
  letter-spacing:-.035em;text-wrap:balance;
}
body :is(#fun-view,#knowledge-view,#game-view) :is(.back,.primary,.secondary,button) {font-family:system-ui,-apple-system,"Segoe UI",sans-serif}
body :is(#fun-view,#knowledge-view,#game-view) :is(.primary,.back) {border-radius:999px;font-weight:850}
body :is(#fun-view,#knowledge-view,#game-view) .primary {background:var(--activity-accent);color:#fff}
body :is(#fun-view,#knowledge-view,#game-view) :is(.question-card,.knowledge-card,.game-card) {border-radius:24px}
body :is(#fun-view,#knowledge-view,#game-view) button:focus-visible {outline:3px solid var(--activity-accent);outline-offset:3px}
body :is(#fun-view,#knowledge-view) .view-head {
  position:relative;min-height:132px;padding:22px clamp(16px,3vw,34px);
  background:linear-gradient(110deg,var(--activity-bg),#fff);
  border-radius:24px;overflow:hidden;
}
body :is(#fun-view,#knowledge-view) .view-head .activity-art {
  width:clamp(76px,11vw,132px);height:clamp(76px,11vw,132px);
  object-fit:contain;align-self:center;margin-left:auto;flex:none;
}
body #game-view .game-menu {
  background:linear-gradient(160deg,#e6f8e9,#c4eacc 72%,#f8edd9);
  border-radius:26px;overflow:hidden;position:relative;
}
body #game-view .game-menu::before {content:none;display:none}
body #game-view .game-logo-img {object-fit:contain;box-shadow:none;border:0;background:none}
body #game-view .game-intro {max-width:45ch;margin:7px auto 17px;line-height:1.45;color:#285b4a;text-align:center}
body #game-view .game-play {background:linear-gradient(160deg,#f8f2dc,#e4f5e7);border-radius:24px}
body #game-view .order-panel {border-radius:22px}
@media(max-width:700px){
 body :is(#fun-view,#knowledge-view) .view-head .activity-art {width:72px;height:72px}
 body :is(#fun-view,#knowledge-view) .view-head {min-height:0;padding:13px}
 body #game-view .game-intro {font-size:.9rem;padding-inline:12px}
}