/* Box sizing rules */

*,
*::before,
*::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

/* Stop mobile Safari and Chrome inflating text in a rotated or narrow
   viewport. Without this the browser silently scales up some blocks and not
   others, which breaks the measured type scale and can introduce horizontal
   overflow that is invisible on desktop. 100% means "use the size we set". */
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

/* by default, ScrollTrigger sets overflow to auto so that the scrollbar is factored in particularly when pinning so that the pinned elements' sizes are correct, but with LocomotiveScroll we want to force that to be hidden because it does its own [fake] scrollbar */
.smooth-scroll {
  overflow: hidden !important;
}

/* Remove default margin */

body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
figure,
blockquote,
dl,
dd {
  margin: 0;
  padding: 0;
}

/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */

ul[role="list"],
ol[role="list"],
li {
  list-style: none;
}

dl,
ol,
ul,
li {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Safari drops a list from the accessibility tree entirely when its
   list-style is none, so a nav or footer link list stops being announced as
   "list, 4 items". A zero-width space in a generated marker keeps the
   semantics without rendering a visible bullet. Scoped to lists that opted
   into list semantics with role="list" so it costs nothing elsewhere. */
ul[role="list"] > li::before,
ol[role="list"] > li::before {
  content: "\200B";
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
}

dd {
  margin-bottom: 0.5rem;
  margin-left: 0;
}

/* Set core root defaults */

html:focus-within {
  scroll-behavior: smooth;
}

/* Set core body defaults */

body {
  min-height: 100vh;
  text-rendering: optimizeSpeed;
  line-height: 1.3;
  /* overflow-x: hidden would create a new scroll container and break position: sticky
     for the navbar (and any other sticky elements). `overflow-x: clip` achieves the
     same visual effect without turning body into a scroll root. */
  overflow-x: clip;
}

/* A elements that don't have a class get default styles */

a:not([class]) {
  text-decoration-skip-ink: auto;
}

a {
  text-decoration: none;
  color: inherit;
}

/* Inherit fonts for inputs and buttons */

input,
button,
textarea,
select {
  font: inherit;
  -webkit-appearance: none;
  border-radius: 0;
}

/* `-webkit-appearance: none` above strips the native select chrome, which on
   Windows in dark mode leaves white-on-white (the UA supplies the colours a
   stripped select no longer inherits). State both explicitly. */
select {
  background-color: var(--clr-white, #ffffff);
  color: var(--clr-body, #1f2937);
}

select option {
  background-color: var(--clr-white, #ffffff);
  color: var(--clr-body, #1f2937);
}

/* Tell the UA this is a light-scheme document, so form controls, scrollbars
   and the caret are rendered against the cream page ground rather than being
   auto-darkened. */
:root {
  color-scheme: light;
}

/* Removes the ~300ms tap delay browsers hold for a possible double-tap zoom,
   without disabling zoom itself (pinch still works — see the viewport meta in
   layouts/theme.liquid). */
html {
  touch-action: manipulation;
}

/* The default grey flash on tap is arbitrary; each control below states its
   own :active / :hover feedback instead. */
a,
button,
input,
select,
textarea,
label,
summary,
[role="button"] {
  -webkit-tap-highlight-color: rgba(38, 34, 30, 0.08);
}

table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
}

/* Remove all animations, transitions and smooth scroll for people that prefer not to see them */

@media (prefers-reduced-motion: reduce) {
  html:focus-within {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}