/* V1: complete playful cloud transitions hide the straight joins between blocks. */
body.clouds-front{overflow-x:clip}
body.clouds-front .cloud-host:not(dialog){isolation:auto}
body.clouds-front .intro-strip{z-index:auto}
body.clouds-front .header-inner{border-bottom:0}
body.clouds-front .cloud-hero,body.clouds-front .partner-section{overflow:visible}
body.clouds-front .cloud-field{z-index:60;pointer-events:none;user-select:none;mask-image:none;-webkit-mask-image:none;opacity:1}
body.clouds-front .cloud-plane{width:148%;left:-24%;bottom:0}
body.clouds-front .cloud-far{height:112%;bottom:11px;opacity:1}
body.clouds-front .cloud-middle{height:106%;bottom:4px;opacity:1}
body.clouds-front .cloud-near{height:100%;bottom:2px;opacity:1;filter:none}
body.clouds-front .cloud-drift{
  transform-origin:50% 100%;
  animation:cloud-drift 64s cubic-bezier(.45,0,.55,1) infinite alternate both,kids-cloud-breathe 16s cubic-bezier(.45,0,.55,1) infinite alternate both;
}
@keyframes kids-cloud-breathe{from{scale:1}to{scale:1.04}}
body.clouds-front main>.kids-cloud-seam.cloud-host{
  --seam-height:220px;--seam-before:65px;--seam-after:65px;
  position:relative;isolation:isolate;z-index:60;height:var(--seam-height);
  margin:calc(-1 * var(--seam-before)) 0 calc(-1 * var(--seam-after));
  padding:0;pointer-events:none;user-select:none;
}
body.clouds-front .kids-cloud-seam>.cloud-field{inset:0;width:100%;height:100%;z-index:0;overflow:hidden}
body.clouds-front main>.kids-cloud-seam--hero.cloud-host{--seam-height:280px;--seam-before:140px;--seam-after:80px}
body.clouds-front .kids-cloud-seam:nth-of-type(2n){--cloud-phase:-17s}
body.clouds-front .kids-cloud-seam:nth-of-type(3n){--cloud-phase:-29s}
body.clouds-front main>.kids-cloud-seam+section{margin-top:0;padding-top:75px}
body.clouds-front main>.kids-cloud-seam--hero+section.intro-strip{padding-top:90px}
body.clouds-front .intro-strip.cloud-host{padding-bottom:70px}
body.clouds-front .brand-footer.cloud-host{padding-top:75px}
/* Retain one small floating cloud at the header and a light dialog decoration. */
body.clouds-front .cloud-host[data-cloud-scene="header"]>.cloud-field{height:90px;bottom:-74px;opacity:1}
body.clouds-front .cloud-host[data-cloud-scene="header"]>.cloud-field .cloud-plane{width:190px;height:90px;left:calc(50% - 95px);bottom:0}
body.clouds-front .cloud-host[data-cloud-scene="header"]>.cloud-field .cloud-far,body.clouds-front .cloud-host[data-cloud-scene="header"]>.cloud-field .cloud-middle{display:none}
body.clouds-front .product-dialog>.cloud-field{height:75px;bottom:0;opacity:.35}
body.clouds-front .mobile-size-link{z-index:80}
@media(max-width:900px){
  body.clouds-front main>.kids-cloud-seam.cloud-host{--seam-height:190px;--seam-before:60px;--seam-after:55px}
  body.clouds-front main>.kids-cloud-seam--hero.cloud-host{--seam-height:245px;--seam-before:120px;--seam-after:70px}
  body.clouds-front .cloud-plane{width:180%;left:-40%}
  body.clouds-front .cloud-far{bottom:10px}
  body.clouds-front main>.kids-cloud-seam+section{padding-top:65px}
  body.clouds-front main>.kids-cloud-seam--hero+section.intro-strip{padding-top:80px}
  body.clouds-front .brand-footer.cloud-host{padding-top:65px}
}
@media(max-width:600px){
  body.clouds-front .partner-art>img{width:100%;max-width:100%;left:0}
  body.clouds-front .hero-cloud-note{left:0;right:auto;top:8px;bottom:auto;transform:rotate(-4deg)}
  body.clouds-front main>.kids-cloud-seam.cloud-host{--seam-height:170px;--seam-before:52px;--seam-after:50px}
  body.clouds-front main>.kids-cloud-seam--hero.cloud-host{--seam-height:210px;--seam-before:100px;--seam-after:60px}
  body.clouds-front .cloud-plane{width:240%;left:-70%}
  body.clouds-front .cloud-far{bottom:8px}
  body.clouds-front main>.kids-cloud-seam+section{padding-top:65px}
  body.clouds-front main>.kids-cloud-seam--hero+section.intro-strip{padding-top:75px}
  body.clouds-front .intro-strip.cloud-host{padding-bottom:60px}
  body.clouds-front .brand-footer.cloud-host{padding-top:65px}
  body.clouds-front .cloud-host[data-cloud-scene="header"]>.cloud-field{height:58px;bottom:-52px}
  body.clouds-front .cloud-host[data-cloud-scene="header"]>.cloud-field .cloud-plane{width:116px;height:58px;left:auto;right:26px}
  body.clouds-front .product-dialog>.cloud-field{height:65px;bottom:0;opacity:.3}
}