/*
	Abstracts are helpers, variables and functions
	for scss compliation.
*/
/* Slider */
.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}

.slick-list {
  position: relative;
  overflow: hidden;
  display: block;
  margin: 0;
  padding: 0;
}

.slick-list:focus {
  outline: none;
}

.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
  transform: translate3d(0, 0, 0);
}

.slick-track {
  position: relative;
  left: 0;
  top: 0;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.slick-track:before, .slick-track:after {
  content: "";
  display: table;
}

.slick-track:after {
  clear: both;
}

.slick-loading .slick-track {
  visibility: hidden;
}

.slick-slide {
  float: left;
  height: 100%;
  min-height: 1px;
  display: none;
}

[dir=rtl] .slick-slide {
  float: right;
}

.slick-slide img {
  display: block;
}

.slick-slide.slick-loading img {
  display: none;
}

.slick-slide.dragging img {
  pointer-events: none;
}

.slick-initialized .slick-slide {
  display: block;
}

.slick-loading .slick-slide {
  visibility: hidden;
}

.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}

.slick-arrow.slick-hidden {
  display: none;
}

/**==================================================================================================================================
BREAKPOINT
 ==================================================================================================================================*/
/**==================================================================================================================================
BREAKPOINT ENDS
==================================================================================================================================*/
span.edit-link {
  display: inline-block;
  background-color: yellow;
  font-weight: 700;
  position: fixed;
  left: 0;
  bottom: 3.125rem;
  transform: translateX(-45px);
  transition: all 0.2s;
}

span.edit-link a {
  display: block;
  padding: 0.9375rem;
}

span.edit-link:hover {
  transform: translateX(0);
}

/*
	Variables for compliation
	NB! Colors should be added to base/config file as css root variable.
*/
/**
 * Block section background colors.
 * Include the background options ACF fields group to use these.
 */
/*
 * makes ul/ol as a dropdown select (normaly in mobile)
 * Structure: div > title > list > li > a
*/
/*
	Variables for legacy dc plugins
*/
section.image-product-grid .grid-container .header {
  margin-bottom: 3rem;
  max-width: 45rem;
}

@media print, screen and (min-width: 40em) {
  section.image-product-grid .grid-container .header {
    margin-bottom: 5rem;
  }
}
section.image-product-grid .grid-container .title {
  margin: 0;
  font-size: 2.5rem;
  font-weight: 600;
}

section.image-product-grid .grid-container .text {
  margin-top: 1rem;
  font-size: 1.125rem;
}

section.image-product-grid .grid-container .grid {
  display: grid;
  align-items: start;
  grid-template-columns: 1fr;
  grid-template-rows: none;
  grid-auto-rows: auto;
  row-gap: 2.5rem;
  -moz-column-gap: 0;
       column-gap: 0;
  padding: 0;
}

@media screen and (min-width: 1089px) {
  section.image-product-grid .grid-container .grid {
    grid-template-columns: repeat(18, minmax(0, 1fr));
    grid-template-rows: repeat(16, minmax(0, auto));
    grid-auto-rows: minmax(0, auto);
    -moz-column-gap: clamp(1.5rem, 4vw, 5rem);
         column-gap: clamp(1.5rem, 4vw, 5rem);
    row-gap: clamp(2rem, 4vw, 4rem);
    padding: 0 clamp(0rem, (100vw - 1088px) * 0.45, 8.4375rem);
  }
  section.image-product-grid .grid-container .grid .item:nth-child(1) {
    grid-column: 1/12;
    grid-row: 1/6;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(2) {
    grid-column: 12/19;
    grid-row: 1/8;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(3) {
    grid-column: 1/10;
    grid-row: 9/15;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(4) {
    grid-column: 10/19;
    grid-row: 9/17;
    margin-top: 4rem;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(5) {
    grid-column: 1/12;
    grid-row: 17/22;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(6) {
    grid-column: 12/19;
    grid-row: 17/24;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(7) {
    grid-column: 1/10;
    grid-row: 25/31;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(8) {
    grid-column: 10/19;
    grid-row: 25/33;
    margin-top: 4rem;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(9) {
    grid-column: 1/12;
    grid-row: 33/38;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(10) {
    grid-column: 12/19;
    grid-row: 33/40;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(11) {
    grid-column: 1/10;
    grid-row: 41/47;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(12) {
    grid-column: 10/19;
    grid-row: 41/49;
    margin-top: 4rem;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(13) {
    grid-column: 1/12;
    grid-row: 49/54;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(14) {
    grid-column: 12/19;
    grid-row: 49/56;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(15) {
    grid-column: 1/10;
    grid-row: 57/63;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(16) {
    grid-column: 10/19;
    grid-row: 57/65;
    margin-top: 4rem;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(17) {
    grid-column: 1/12;
    grid-row: 65/70;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(18) {
    grid-column: 12/19;
    grid-row: 65/72;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(19) {
    grid-column: 1/10;
    grid-row: 73/79;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(20) {
    grid-column: 10/19;
    grid-row: 73/81;
    margin-top: 4rem;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(21) {
    grid-column: 1/12;
    grid-row: 81/86;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(22) {
    grid-column: 12/19;
    grid-row: 81/88;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(23) {
    grid-column: 1/10;
    grid-row: 89/95;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(24) {
    grid-column: 10/19;
    grid-row: 89/97;
    margin-top: 4rem;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(25) {
    grid-column: 1/12;
    grid-row: 97/102;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(26) {
    grid-column: 12/19;
    grid-row: 97/104;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(27) {
    grid-column: 1/10;
    grid-row: 105/111;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(28) {
    grid-column: 10/19;
    grid-row: 105/113;
    margin-top: 4rem;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(29) {
    grid-column: 1/12;
    grid-row: 113/118;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(30) {
    grid-column: 12/19;
    grid-row: 113/120;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(31) {
    grid-column: 1/10;
    grid-row: 121/127;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(32) {
    grid-column: 10/19;
    grid-row: 121/129;
    margin-top: 4rem;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(33) {
    grid-column: 1/12;
    grid-row: 129/134;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(34) {
    grid-column: 12/19;
    grid-row: 129/136;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(35) {
    grid-column: 1/10;
    grid-row: 137/143;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(36) {
    grid-column: 10/19;
    grid-row: 137/145;
    margin-top: 4rem;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(37) {
    grid-column: 1/12;
    grid-row: 145/150;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(38) {
    grid-column: 12/19;
    grid-row: 145/152;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(39) {
    grid-column: 1/10;
    grid-row: 153/159;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(40) {
    grid-column: 10/19;
    grid-row: 153/161;
    margin-top: 4rem;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(41) {
    grid-column: 1/12;
    grid-row: 161/166;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(42) {
    grid-column: 12/19;
    grid-row: 161/168;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(43) {
    grid-column: 1/10;
    grid-row: 169/175;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(44) {
    grid-column: 10/19;
    grid-row: 169/177;
    margin-top: 4rem;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(45) {
    grid-column: 1/12;
    grid-row: 177/182;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(46) {
    grid-column: 12/19;
    grid-row: 177/184;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(47) {
    grid-column: 1/10;
    grid-row: 185/191;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(48) {
    grid-column: 10/19;
    grid-row: 185/193;
    margin-top: 4rem;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(49) {
    grid-column: 1/12;
    grid-row: 193/198;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(50) {
    grid-column: 12/19;
    grid-row: 193/200;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(51) {
    grid-column: 1/10;
    grid-row: 201/207;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(52) {
    grid-column: 10/19;
    grid-row: 201/209;
    margin-top: 4rem;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(53) {
    grid-column: 1/12;
    grid-row: 209/214;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(54) {
    grid-column: 12/19;
    grid-row: 209/216;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(55) {
    grid-column: 1/10;
    grid-row: 217/223;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(56) {
    grid-column: 10/19;
    grid-row: 217/225;
    margin-top: 4rem;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(57) {
    grid-column: 1/12;
    grid-row: 225/230;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(58) {
    grid-column: 12/19;
    grid-row: 225/232;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(59) {
    grid-column: 1/10;
    grid-row: 233/239;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(60) {
    grid-column: 10/19;
    grid-row: 233/241;
    margin-top: 4rem;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(61) {
    grid-column: 1/12;
    grid-row: 241/246;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(62) {
    grid-column: 12/19;
    grid-row: 241/248;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(63) {
    grid-column: 1/10;
    grid-row: 249/255;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(64) {
    grid-column: 10/19;
    grid-row: 249/257;
    margin-top: 4rem;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(65) {
    grid-column: 1/12;
    grid-row: 257/262;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(66) {
    grid-column: 12/19;
    grid-row: 257/264;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(67) {
    grid-column: 1/10;
    grid-row: 265/271;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(68) {
    grid-column: 10/19;
    grid-row: 265/273;
    margin-top: 4rem;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(69) {
    grid-column: 1/12;
    grid-row: 273/278;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(70) {
    grid-column: 12/19;
    grid-row: 273/280;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(71) {
    grid-column: 1/10;
    grid-row: 281/287;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(72) {
    grid-column: 10/19;
    grid-row: 281/289;
    margin-top: 4rem;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(73) {
    grid-column: 1/12;
    grid-row: 289/294;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(74) {
    grid-column: 12/19;
    grid-row: 289/296;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(75) {
    grid-column: 1/10;
    grid-row: 297/303;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(76) {
    grid-column: 10/19;
    grid-row: 297/305;
    margin-top: 4rem;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(77) {
    grid-column: 1/12;
    grid-row: 305/310;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(78) {
    grid-column: 12/19;
    grid-row: 305/312;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(79) {
    grid-column: 1/10;
    grid-row: 313/319;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(80) {
    grid-column: 10/19;
    grid-row: 313/321;
    margin-top: 4rem;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(81) {
    grid-column: 1/12;
    grid-row: 321/326;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(82) {
    grid-column: 12/19;
    grid-row: 321/328;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(83) {
    grid-column: 1/10;
    grid-row: 329/335;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(84) {
    grid-column: 10/19;
    grid-row: 329/337;
    margin-top: 4rem;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(85) {
    grid-column: 1/12;
    grid-row: 337/342;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(86) {
    grid-column: 12/19;
    grid-row: 337/344;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(87) {
    grid-column: 1/10;
    grid-row: 345/351;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(88) {
    grid-column: 10/19;
    grid-row: 345/353;
    margin-top: 4rem;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(89) {
    grid-column: 1/12;
    grid-row: 353/358;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(90) {
    grid-column: 12/19;
    grid-row: 353/360;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(91) {
    grid-column: 1/10;
    grid-row: 361/367;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(92) {
    grid-column: 10/19;
    grid-row: 361/369;
    margin-top: 4rem;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(93) {
    grid-column: 1/12;
    grid-row: 369/374;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(94) {
    grid-column: 12/19;
    grid-row: 369/376;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(95) {
    grid-column: 1/10;
    grid-row: 377/383;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(96) {
    grid-column: 10/19;
    grid-row: 377/385;
    margin-top: 4rem;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(97) {
    grid-column: 1/12;
    grid-row: 385/390;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(98) {
    grid-column: 12/19;
    grid-row: 385/392;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(99) {
    grid-column: 1/10;
    grid-row: 393/399;
  }
  section.image-product-grid .grid-container .grid .item:nth-child(100) {
    grid-column: 10/19;
    grid-row: 393/401;
    margin-top: 4rem;
  }
}
section.image-product-grid .grid-container .item {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  min-width: 0;
}

section.image-product-grid .grid-container .media {
  width: 100%;
  overflow: hidden;
  background-color: #f2f2f2;
}

@media screen and (min-width: 1089px) {
  section.image-product-grid .grid-container .item:nth-child(4n+1) .media {
    aspect-ratio: 16/10;
    max-height: 35.625rem;
  }
  section.image-product-grid .grid-container .item:nth-child(4n+2) .media {
    aspect-ratio: 3/5;
    max-height: 40.625rem;
  }
  section.image-product-grid .grid-container .item:nth-child(4n+3) .media {
    aspect-ratio: 2/3;
    max-height: 43.75rem;
  }
  section.image-product-grid .grid-container .item:nth-child(4n+4) .media {
    aspect-ratio: 1.1/1;
    max-height: 34.375rem;
  }
}
section.image-product-grid .grid-container .image {
  width: 100%;
  height: auto;
  display: block;
}

@media screen and (min-width: 1089px) {
  section.image-product-grid .grid-container .image {
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
}
section.image-product-grid .grid-container .tags {
  list-style: none;
  margin: 0 0 1.25rem;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 1.25rem;
}

@media screen and (max-width: 63.99875em) {
  section.image-product-grid .grid-container .tags {
    flex: initial;
    order: 2;
    margin-bottom: 0;
  }
}
section.image-product-grid .grid-container .item-title {
  margin: 0;
  font-size: 2rem;
  font-weight: 600;
  color: var(--color__blue);
}

section.image-product-grid .grid-container .item-text {
  margin: 0;
  font-size: 1.125rem;
  font-weight: 400;
}

section.image-product-grid .grid-container .tag {
  position: relative;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color__blue);
  padding-left: 1.25rem;
  line-height: 1.2;
}

section.image-product-grid .grid-container .tag::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 0.6875rem;
  height: 0.6875rem;
  background-color: var(--color__orange);
  border-radius: 50%;
}