/* ========================================= Ready Hit Play — Dial Styles (Barba-aware) - Scoped by data-dial-ns attribute (set by JS) for dial layout - [data-barba="wrapper"]:has() selectors still used for wrapper-level rules - Shared dial styles for home + work ========================================= */ /* Always hide scrollbar — Lenis/CSS scroll lock toggles overflow:auto/hidden which causes layout jumps when the scrollbar appears/disappears. */ html, body { scrollbar-width: none; /* Firefox */ } html::-webkit-scrollbar, body::-webkit-scrollbar { display: none; /* Chrome, Safari, Edge */ } html { font-size: calc(0.7416576964477932rem + 0.21528525296017226vw); } @media screen and (max-width:1920px) { html { font-size: calc(0.7416576964477933rem + 0.21528525296017226vw); } } @media screen and (max-width:991px) { html { font-size: calc(0.85rem + 0.25vw); } } /* Hide Webflow CMS empty-field placeholder images (403 SVG → iOS "?" icon) */ .w-dyn-bind-empty { display: none !important; } /* Hide nav items on home until home-scroll-morph completes and sets .rhp-home-ready. Cursor + dial ticks are visible from the first frame; nav items + step text stay hidden until the 100vh scroll-morph scrub completes and the wrapper gets .rhp-home-ready (home-scroll-morph._applyCompleteState). Until then the page shows #interactive-logo in .home-intro_middle and the small .home-transition-dial in .home-intro_bottom. */ [data-barba="wrapper"]:has([data-barba-namespace="home"]):not(.rhp-home-ready) .nav_logo-link, [data-barba="wrapper"]:has([data-barba-namespace="home"]):not(.rhp-home-ready) .nav_about-link, [data-barba="wrapper"]:has([data-barba-namespace="home"]):not(.rhp-home-ready) .nav_contact-link { opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; } /* Step text stays hidden during the home intro scrub — home-scroll-morph tweens it to opacity:1 in the last 10% of the scrub. This CSS rule covers the gap between first paint and scripts loading so the step text never flashes visible in the dial-small state. */ [data-barba="wrapper"]:has([data-barba-namespace="home"]):not(.rhp-home-ready) .dial_component[data-dial-ns="home"] .heading-style-h7.is-step, [data-barba="wrapper"]:has([data-barba-namespace="home"]):not(.rhp-home-ready) .dial_component[data-dial-ns="home"] [data-text="step"] { opacity: 0 !important; visibility: hidden; pointer-events: none; } /* Page loader — visible until init.js adds .rhp-scripts-loaded to . Inline