/**
 * reset.css — global reset, base styles, and utility classes.
 *
 * Migrated verbatim from Slater 51512.css (2026-09-08). Behaviour is unchanged
 * except that the body scrollbar rule has been un-nested — see the note there.
 *
 * Loaded site-wide via a <link> in Site settings → Custom code → Head.
 */

/* ---------------------------------------------------------------- RESET ---
 * 1. Prevent padding and border from affecting element width
 * 2. Remove default margins and padding
 * 3. Reset all borders
 */
*,
::after,
::before,
::backdrop,
::file-selector-button {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  border: 0 solid;
}

html,
body {
  overscroll-behavior-y: none;
}

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  overscroll-behavior-y: none;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

/* Was written with native CSS nesting (`&::-webkit-scrollbar`) inside the body
 * rule above. Un-nested here: identical behaviour, but it also works in
 * browsers predating native nesting support. */
body::-webkit-scrollbar {
  display: none;
}

/* Selection styling */
::selection {
  color: white;
  background-color: rgb(30 50 77 / 90%);
}

/* Focus state for keyboard navigation */
*[tabindex]:focus-visible,
input[type="file"]:focus-visible {
  outline: 0.125rem solid #4d65ff;
  outline-offset: 0.125rem;
}

/* ------------------------------------------------ TYPOGRAPHY & CONTENT --- */

/* Inherit color for all children */
.inherit-color * {
  color: inherit;
}


/* Reset link and form element inheritance */
a,
.w-input,
.w-select,
.w-tab-link,
.w-nav-link,
.w-dropdown-btn,
.w-dropdown-toggle,
.w-dropdown-link {
  color: inherit;
  text-decoration: inherit;
  font-size: inherit;
}

/* Rich text margin resets */
.w-richtext > :not(div):first-child,
.w-richtext > div:first-child > :first-child {
  margin-top: 0 !important;
}

.w-richtext > :last-child,
.w-richtext ol li:last-child,
.w-richtext ul li:last-child {
  margin-bottom: 0 !important;
}

/* Text truncation */
.text-style-2lines {
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.text-style-3lines {
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}

.truncate-width {
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* --------------------------------------------------- LAYOUT UTILITIES --- */

/* Container alignment lock */
.container-medium,
.container-small,
.container-large {
  margin-right: auto !important;
  margin-left: auto !important;
}

/* Square aspect ratio */
.div-square::after {
  content: "";
  display: block;
  padding-bottom: 100%;
}

/* Display utilities */
.display-inlineflex {
  display: inline-flex;
}

/* Pointer event controls */
.pointer-events-off {
  pointer-events: none;
}

.pointer-events-on {
  pointer-events: auto;
}

/* Webflow design mode helper */
.wf-design-mode [data-horizontal-scroll-wrap] {
  overflow: auto;
}

/* -------------------------------------------------- SPACING UTILITIES --- */

.margin-0 {
  margin: 0 !important;
}

.padding-0 {
  padding: 0 !important;
}

.spacing-clean {
  padding: 0 !important;
  margin: 0 !important;
}

/* Directional margin resets */
.margin-top {
  margin-right: 0 !important;
  margin-bottom: 0 !important;
  margin-left: 0 !important;
}

.margin-right {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  margin-left: 0 !important;
}

.margin-bottom {
  margin-top: 0 !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
}

.margin-left {
  margin-top: 0 !important;
  margin-right: 0 !important;
  margin-bottom: 0 !important;
}

.margin-horizontal {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.margin-vertical {
  margin-right: 0 !important;
  margin-left: 0 !important;
}

/* Directional padding resets */
.padding-top {
  padding-right: 0 !important;
  padding-bottom: 0 !important;
  padding-left: 0 !important;
}

.padding-right {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  padding-left: 0 !important;
}

.padding-bottom {
  padding-top: 0 !important;
  padding-right: 0 !important;
  padding-left: 0 !important;
}

.padding-left {
  padding-top: 0 !important;
  padding-right: 0 !important;
  padding-bottom: 0 !important;
}

.padding-horizontal {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.padding-vertical {
  padding-right: 0 !important;
  padding-left: 0 !important;
}

/* ----------------------------------------------- VISIBILITY UTILITIES --- */

.hide {
  display: none !important;
}

@media screen and (max-width: 991px) {
  .hide-tablet {
    display: none !important;
  }
}

@media screen and (max-width: 767px) {
  .hide-mobile-landscape {
    display: none !important;
  }
}

@media screen and (max-width: 479px) {
  .hide-mobile {
    display: none !important;
  }
}

/* ------------------------------------------------------ REDUCED MOTION --- */

/*
 * Honour prefers-reduced-motion site-wide.
 *
 * Webflow interactions (IX2) do not check this setting themselves, so anything
 * that loops — the availability dot's blink, for one — keeps running unless it
 * is stopped here.
 *
 * Durations collapse to near-zero rather than being removed outright so that
 * animationend and transitionend still fire; code that waits on those events
 * would otherwise stall forever.
 *
 * This does NOT stop GSAP, which animates inline styles from JS and never
 * touches CSS animation or transition. Scripts have to opt in themselves.
 * Both of ours do: text-cycle.js stops cycling, and work-strip.js drops to a
 * variant that never auto-scrolls but stays draggable.
 */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  /*
   * IX2 stamps style="opacity:0" inline at page load and animates up from
   * there. Stopping the animation alone would leave the dot permanently
   * invisible, so its resting state has to be restored explicitly — and an
   * inline style outranks a stylesheet rule, hence !important.
   */
  .available-dot {
    opacity: 1 !important;
  }
}

/* ------------------------------------------------ scroll-into-view --- */

/*
 * Moved here from site-nav.css on 2026-09-14, when that file was deleted along
 * with the old sticky nav. The rule itself was never about that nav.
 *
 * A FIXED bar can land on top of whatever was just scrolled into view — an
 * anchor target, or an element the browser scrolled to because it took focus.
 * scroll-padding-top reserves the bar's height on every scroll-into-view the
 * browser performs, which is the general fix for WCAG 2.4.11 rather than
 * patching scroll-margin onto every individual target. It matters MORE with a
 * fixed bar than it did with a sticky one, and it is what keeps the case study
 * back button's jump to #featured-case-studies from landing under the nav.
 *
 * `html` is not stylable in the Webflow Designer, so this has to live in CSS.
 *
 * Literal values, not var(--site-nav-height): that variable was published by
 * site-nav.js, which is gone. The numbers are the blend nav's height plus 1rem
 * of breathing room, and they track .hero's padding-top.
 *
 * COUPLED to .nav-top's height — its block padding plus the tap-target height
 * of .nav-action. Retune both together.
 */
html {
  scroll-padding-top: 6.75rem;
}

@media (max-width: 767px) {
  html {
    scroll-padding-top: 8rem;
  }
}