/* ------------------------- Scaling System by Osmo [https://osmo.supply/] -------------------------  */

/* Desktop */
:root {
  --size-unit: 16; /* body font-size in design - no px */
  --size-container-ideal: 1440; /* screen-size in design - no px */
  --size-container-min: 992px;
  --size-container-max: 1920px;
  --size-container: clamp(var(--size-container-min), 100vw, var(--size-container-max));
  --size-font: calc(var(--size-container) / (var(--size-container-ideal) / var(--size-unit)));
}

/* Tablet */
@media screen and (max-width: 991px) {
  :root {
    --size-container-ideal: 834; /* screen-size in design - no px */
    --size-container-min: 768px;
    --size-container-max: 991px;
  }
}

/* Mobile Landscape */
@media screen and (max-width: 767px) {
  :root {
    --size-container-ideal: 550; /* screen-size in design - no px */
    --size-container-min: 480px;
    --size-container-max: 767px;
  }
}

/* Mobile Portrait */
@media screen and (max-width: 479px) {
  :root {
    --size-container-ideal: 390; /* screen-size in design - no px */
    --size-container-min: 320px;
    --size-container-max: 479px;
  }
}

/* Elementor bridge / helpers. The Osmo core variables above are intentionally unchanged. */
.osmo-container--full,
.elementor-element.osmo-container--full {
  width: 100%;
  max-width: var(--size-container);
}

.osmo-container--medium,
.elementor-element.osmo-container--medium {
  width: 100%;
  max-width: calc(var(--size-container) * 0.85);
}

.osmo-container--small,
.elementor-element.osmo-container--small {
  width: 100%;
  max-width: calc(var(--size-container) * 0.7);
}

.osmo-container--custom,
.elementor-element.osmo-container--custom {
  width: 100%;
  max-width: calc(var(--size-container) * var(--osmo-container-multiplier, 1));
}

.osmo-fluid-font {
  font-size: calc(var(--size-font) * var(--osmo-font-multiplier, 1));
}