/* ========================================
   MOBILE HERO
   Desktop layout is preserved; these are
   slight nudges (<=250px in scene space,
   ~100px on screen) pulling edge elements
   just into the phone's visible band.
   Measured content centers: cloud_01 290,
   rainbow 456, brownbird 718, bluebird 1356,
   sun 1518, cloud_00 1564.
   position:relative makes each wrapper the
   containing block for its absolute SVGs.
   ======================================== */

        @media (max-width: 600px) {

            .cloud_01 {
                position: relative;
                left: 200px;
            }

            .cloud_rainbow {
                position: relative;
                left: 150px;
            }

            .brownbird {
                position: relative;
                left: 60px;
            }

            .bluebird {
                position: relative;
                left: -150px;
            }

            .sun {
                position: relative;
                left: -250px;
            }

            .cloud_00 {
                position: relative;
                left: -200px;
            }

            .wave-container {
                height: 135px;
            }
        }