@charset "UTF-8";
/*
 Theme Path
========================================================================== */
/*
 Font Family
========================================================================== */
/*
 Font Size
========================================================================== */
/*
 Colors
========================================================================== */
/*
 Button Styles
========================================================================== */
/*
 Helpers
========================================================================== */
/*
 Sizes
========================================================================== */
/*
 Columns
========================================================================== */
/*
 Buttons – @include button();
========================================================================== */
/*
 Object Fit – @include object-fit(cover);
========================================================================== */
/*
 Rows – @include rows(4,10px); px or % support
========================================================================== */
/*
 Aspect Ratio – @include aspect-ratio(9,16) 0r @include aspect-ratio(70%,30%)
========================================================================== */
/*
 Align Full – @include alignfull;
========================================================================== */
/*
 Min Width Query – @include media($desktop);
========================================================================== */
/*
 Max Width Query – @include media-height($tablet);
========================================================================== */
/*
 Min Width and Max Width Query – @include media-between($tablet, $desktop);
========================================================================== */
/*
 Min Height Query – @include media-height($tablet);
========================================================================== */
/*
 Truncate – @include truncate-text(ellipsis);
========================================================================== */
/*
 Rem Calculate – @include rem(padding, 30px);
========================================================================== */
/*
 Column width with margin
========================================================================== */
/*
 Generates classes and css variables for custom color scale from of a specific Hexcode or HSLA
 @include generate-color-palette(#6a778c, 'slate', 'variables');
 @include generate-color-palette(hsla(217, 90%, 57%, 1.00), 'cobalt', 'classes');
========================================================================== */
/*
 Counter
========================================================================== */
section.block-countup {
  container-type: inline-size;
}
section.block-countup .counter {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: clamp(2.5rem, 1.9886363636rem + 0.0142045455 * 100vw, 3.125rem);
}
@container (min-width: 530px) {
  section.block-countup .countup,
  section.block-countup .wp-block {
    flex: 1 1 240px;
  }
  section.block-countup .countup .wrapper,
  section.block-countup .wp-block .wrapper {
    max-width: 320px;
    margin-inline: auto;
  }
}
section.block-countup .counter > .block-list-appender {
  width: 100%;
  max-width: 100%;
  position: static;
  border: 1px solid rgba(119, 119, 119, 0.2);
  margin: 10px;
  padding: 10px;
  display: flex;
  gap: 0 10px;
  justify-content: center;
  align-items: center;
}
section.block-countup .counter > .block-list-appender::before {
  content: "Add CountUp Item";
  font-size: 14px;
}
section.block-countup .counter > .block-list-appender button {
  background: #404040;
  color: white;
}
section.block-countup .counter > .block-list-appender button:hover {
  background: rgb(102.2, 102.2, 102.2);
}