html { font: #{$base-font-size}/1.2 $font-sans; font-weight: 300; color: #fff; min-width: 320px; word-break: normal; } body { @include font-smooth; background: $color-primary; color: #fff; cursor: default; overflow-x: hidden; overscroll-behavior-y: none; } *, *:before, *:after { text-rendering: optimizeLegibility; -moz-osx-font-smoothing: grayscale; } strong { font-weight: 600; } em { font-style: normal; } figure, p, dl, dt, dd, ul, ol, li { margin: 0; padding: 0; } figure, picture { display: block; } nav li:before { display: none; } label { cursor: pointer; } button { background: none; border: none; cursor: pointer; &[disabled] { cursor: not-allowed; } } // Accessibility outline // Remove default focus styles for mouse users if :focus-visible is supported [data-js-focus-visible] :focus:not([data-focus-visible-added]) { outline: none; } [data-focus-visible-added], *:focus-visible { outline: 1px dashed $color-secondary; } // Selection ::selection { color: #fff; background: $color-secondary; } ::-moz-selection { color: #fff; background: $color-secondary; } // Images glitches fix // img {backface-visibility: hidden;} /* Titles ========================================================================== */ #{headings(1,6)} { margin: 0; font-weight: normal; font-style: normal; } /* Global elements ========================================================================== */ // Split text elements .word, .char { display: inline-block; transform-style: preserve-3d; will-change: transform; } .text-split { span, &__line { display: inline-block; transition: opacity 0.7s var(--ease-quart), transform 0.7s var(--ease-quart); } }