:root {
  --fm-black: #0b0b0a;
  --fm-gold: #b8893d;
  --fm-gold-light: #d0aa66;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 68px;
  background: var(--fm-black);
}

body.fm-flour-mills {
	margin: 0;
	overflow-x: hidden;
  background: var(--fm-black);
  -webkit-font-smoothing: antialiased;
}

body.fm-flour-mills *,
body.fm-flour-mills *::before,
body.fm-flour-mills *::after {
  box-sizing: border-box;
}

body.fm-flour-mills a {
  color: inherit;
  text-decoration: none;
}

.fm-page-shell,
.fm-page-shell > .elementor,
.fm-page-shell > .elementor > .elementor-element,
.fm-site {
  width: 100%;
  max-width: none;
  margin: 0;
}

.fm-site img {
  display: block;
}

/* Full-bleed photographs remain normal Image widgets. */
.fm-native-image-section {
	isolation: isolate;
}

.fm-native-image-section::before {
  z-index: 1;
  pointer-events: none;
}

.fm-site button,
.fm-site input,
.fm-site select {
  font: inherit;
}

/* Scroll progress behaviour. Its visible styling is controlled by the widget. */
.fm-progress-widget {
  pointer-events: none;
}

.fm-progress {
  position: relative;
  width: 100%;
}

.scroll-progress {
  display: block;
  width: 0;
  height: 100%;
  background: linear-gradient(90deg, var(--fm-progress-start, var(--fm-gold)), var(--fm-progress-end, var(--fm-gold-light)));
  transition: width 80ms linear;
}

/* Header interaction states. The base layout, background and spacing are native
   Elementor container settings. */
.site-header {
  transition: min-height .35s ease, background-color .35s ease, border-color .35s ease, backdrop-filter .35s ease;
}

.site-header.scrolled {
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
}

.admin-bar .site-header {
	top: 32px;
}

.menu-toggle {
  display: none;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  padding: 0;
  border: 0;
  cursor: pointer;
  transition: background-color .2s ease, border-color .2s ease;
}

.menu-toggle span {
  display: block;
  flex: 0 0 auto;
  transition: transform .25s ease, background-color .2s ease;
}

.menu-toggle[aria-expanded="true"] span:first-child {
  transform: translateY(4px) rotate(45deg);
}

.menu-toggle[aria-expanded="true"] span:last-child {
  transform: translateY(-4px) rotate(-45deg);
}

.mobile-menu {
  display: none;
}

.fm-text-button .elementor-button-text,
.fm-primary-button .elementor-button-text,
.fm-form-submit .elementor-button-content-wrapper {
  transition: transform .2s ease;
}

.fm-text-button:hover .elementor-button-text,
.fm-text-button:focus-within .elementor-button-text,
.fm-primary-button:hover .elementor-button-text,
.fm-primary-button:focus-within .elementor-button-text,
.fm-form-submit:hover .elementor-button-content-wrapper,
.fm-form-submit:focus-within .elementor-button-content-wrapper {
  transform: translateX(5px);
}

.fm-hover-zoom {
  overflow: hidden;
}

.fm-hover-zoom img {
  transition: transform .8s ease, filter .7s ease;
}

.fm-hover-zoom:hover img {
  transform: scale(1.035);
}

.scroll-cue .elementor-button {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}

.scroll-cue {
  transform: translateX(-50%);
}

/* Before/after behaviour. Both photographs are normal Elementor Image widgets. */
.compare {
  position: relative;
  user-select: none;
  touch-action: none;
}

.compare-before {
  clip-path: inset(0 50% 0 0);
  will-change: clip-path;
}

.fm-compare-handle-widget,
.fm-compare-handle-widget > .elementor-widget-container {
  height: 100%;
}

.fm-compare-handle-widget {
  pointer-events: none;
}

.compare-handle {
  --fm-handle-size: 58px;
  position: absolute;
  top: 0;
  bottom: 0;
  width: 1px;
  cursor: ew-resize;
  outline: none;
  pointer-events: auto;
  transform: translateX(-50%);
}

.compare-handle-circle {
	position: absolute;
	top: 50%;
	left: 50%;
  width: var(--fm-handle-size);
  height: var(--fm-handle-size);
  border: 1px solid var(--fm-gold);
  border-radius: 50%;
  box-shadow: 0 8px 30px rgba(0, 0, 0, .35);
	transform: translate(-50%, -50%);
}

.compare-handle-arrow {
	position: absolute;
  top: 50%;
  z-index: 2;
  line-height: 1;
  transform: translateY(-56%);
}

.compare-handle-arrow-previous {
	right: 8px;
}

.compare-handle-arrow-next {
	left: 8px;
}

/* Registration behaviour only. The form layout, labels and CTA are native
   Elementor Containers, Heading widgets and a Button widget. */
.fm-field-label {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.fm-form-control {
  display: block;
  width: 100%;
  outline: 0;
}

.fm-form-control[type="text"],
.fm-form-control[type="email"],
.fm-form-control[type="tel"] {
  appearance: none;
}

select.fm-form-control {
  appearance: none;
}

.fm-form-submit .elementor-button {
  width: 100%;
}

.fm-form-honeypot {
	position: absolute;
	left: -10000px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.form-message {
  display: none;
  margin: 5px 0 0;
  line-height: 1.55;
}

.form-message.is-visible {
  display: block;
}

.form-message.is-busy {
  display: block;
  opacity: .72;
}

.fm-site :focus-visible {
  outline: 2px solid var(--fm-gold-light);
  outline-offset: 4px;
}

/* Elementor editor safeguards: functional layers never block selection. */
body.elementor-editor-active .site-header {
	position: relative;
	top: 0;
}

.elementor-editor-active .fm-progress-widget {
  display: none;
}

.elementor-editor-active .fm-field-label {
  position: relative;
  width: auto;
  height: auto;
  overflow: visible;
  clip: auto;
  white-space: normal;
  opacity: .7;
}

.elementor-editor-active .fm-form-runtime-widget {
  min-height: 8px;
  border: 1px dashed rgba(184, 137, 61, .45);
}

.elementor-editor-active .mobile-menu {
	display: flex;
	position: relative;
	min-height: 460px;
	transform: none;
}

.elementor-editor-active .fm-compare-handle-widget {
  pointer-events: none;
}

@media (max-width: 1100px) {
	.desktop-nav {
		display: none;
  }

  .fm-menu-toggle-widget,
  .menu-toggle {
    display: flex;
  }

	.header-cta {
		margin-left: auto;
  }

  .mobile-menu {
    display: flex;
    transform: translateY(-105%);
    transition: transform .5s ease;
  }

  .mobile-menu.open {
    transform: none;
  }

	.fm-timeline-marker {
		display: none;
	}
}

@media (max-width: 782px) {
	.admin-bar .site-header {
		top: 46px;
  }
}

@media (max-width: 767px) {
	.scroll-cue {
		transform: none;
  }

  .fm-menu-toggle-widget {
    margin-left: auto;
  }
}

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

  .scroll-progress {
    transition: none;
  }
}
