/* =========================================================
   Page-level composition.
   Most styling now lives in tokens.css, nav.css, and
   sections.css. This file only handles the overall page
   skeleton and a few legacy utility classes used by the
   bubble / fish / wave background layers.
   ========================================================= */

.page {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    overflow-x: hidden;
}

/* Keep text content above the animated bubble/fish layer. */
.over-bubbles {
    position: relative;
    z-index: 5;
}

/* The hero's heading cursor feedback (name-scramble effect). */
.hero-title:hover,
.hero-title:focus-visible {
    cursor: pointer;
}