/*!*****************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/blocks/home-careers-block/style.scss ***!
  \*****************************************************************************************************************************************************************************************************************************************************************/
:root {
  --color-primary: var(--wp--preset--color--primary);
  --color-secondary: var(--wp--preset--color--secondary);
  --color-text: var(--wp--preset--color--text);
  --color-text-dark: var(--wp--preset--color--text-dark);
  --color-accent: var(--wp--preset--color--accent);
  --color-gray: var(--wp--preset--color--gray);
  --color-white: var(--wp--preset--color--white);
  --color-black: var(--wp--preset--color--black);
  --color-body-bg: #f3f7fb;
  --color-black-two: #141419;
  --color-error: #CE202A;
  --color-success: #28a745;
  --gradient-primary: var(--wp--preset--gradient--primary);
  --gradient-secondary: var(--wp--preset--gradient--secondary);
  --fontBase: var(--wp--preset--font-family--primary);
  --fontSecondary: var(--wp--preset--font-family--secondary);
}

/*********************
* BREAKPOINTS
*
* @example
* for max-width case
* @include breakpoint('smaller') {
*	@content;	
* }
*
* for min-width case
* @include breakpoint('smaller', true) {
*	@content;	
*}
*********************/

/*********************
	Flex 
*********************/

/*********************
	Flex Direction

@example
// If display: flex; is needed
@include flex-column(true);

// If display: flex; is not needed
@include flex-column();
*********************/

/*********************
	Flex Direction

@example
// Center Vertically and horizontally
@include flex-center();

// Center only horizontally
@include flex-center(hr);

// Center only vertically
@include flex-center(vr);

*********************/

/*********************
Flex Grid Width

@example

@include flex-grid-width(5, 30px);

Note: Do not forget to add column-gap in the parent element

*********************/

/*********************
	Flex Width

@example

@include flex-width(calc(100% / 3));
*********************/

/**
* Mixin to declare Font-face
*
*/

/**This is the block Style*/

.fr-careers .container {
  padding-inline: 10px;
  position: relative;
  background-color: var(--color-secondary);
  padding-block: 10px;
  border-radius: 20px 20px 0 0;
}

@media screen and (max-width: 767px) {
  .fr-careers .container {
    border-radius: 16px 16px 0 0;
  }
}

.fr-careers_holder {
  position: relative;
  overflow: hidden;
  border-radius: 14px;
  min-height: 790px;
  display: flex;
  align-items: flex-end;
  padding: 120px 20px 43px 60px;
}

@media screen and (max-width: 1199px) {
  .fr-careers_holder {
    padding: 120px 20px 43px 40px;
  }
}

@media screen and (max-width: 991px) {
  .fr-careers_holder {
    padding: 120px 20px 33px;
    min-height: 551px;
  }
}

.fr-careers_holder::after {
  content: "";
  position: absolute;
  inset: 0;
  height: 100%;
  width: 100%;
  background: linear-gradient(13.85deg, #0E111D 4.29%, rgba(14, 17, 29, 0) 78.72%);
}

.fr-careers_holder * {
  color: var(--color-white);
}

.fr-careers_title {
  letter-spacing: -0.01em;
}

.fr-careers_row {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: flex-end;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 22px;
  width: 100%;
}

@media screen and (max-width: 991px) {
  .fr-careers_row {
    gap: 18px;
  }
}

.fr-careers_leftcol {
  flex: 0 1 47.4%;
}

@media screen and (max-width: 991px) {
  .fr-careers_leftcol {
    flex: 0 1 100%;
  }
}

.fr-careers_leftcol .inner-contents {
  display: grid;
  gap: 18px;
}

@media screen and (min-width: 992px) {
  .fr-careers_leftcol .inner-contents {
    padding-right: 10%;
    gap: 22px;
  }
}

.fr-careers_leftcol .inner-contents h1, .fr-careers_leftcol .inner-contents h2, .fr-careers_leftcol .inner-contents h3, .fr-careers_leftcol .inner-contents h4, .fr-careers_leftcol .inner-contents h5, .fr-careers_leftcol .inner-contents h6 {
  letter-spacing: -0.01em;
}

.fr-careers_rightcol {
  flex: 0 1 39.93%;
}

@media screen and (max-width: 991px) {
  .fr-careers_rightcol {
    flex: 0 1 100%;
  }
}

@media screen and (min-width: 1931px) {
  .fr-careers_rightcol {
    flex: 0 1 38.93%;
  }
}

@media screen and (min-width: 992px) {
  .fr-careers_rightcol .inner-text {
    margin-bottom: 29.9%;
    padding-inline: 20px 54px;
  }
}

.fr-careers_rightcol .inner-text p:not(:has(+ *)) {
  margin-bottom: 0;
}

.fr-careers .abs-bg-img, .fr-careers .abs-bg-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.fr-careers .abs-bg-img img, .fr-careers .abs-bg-img video, .fr-careers .abs-bg-img iframe, .fr-careers .abs-bg-video img, .fr-careers .abs-bg-video video, .fr-careers .abs-bg-video iframe {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.fr-careers_tiles {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

@media screen and (min-width: 992px) {
  .fr-careers_tiles {
    gap: 15px;
    position: absolute;
    bottom: 29px;
    right: 30px;
    width: 37.153%;
  }
}

.fr-careers_tile {
  flex: 0 1 calc(50% - 5px);
  position: relative;
  border-radius: 10px;
  overflow: hidden;
  margin-top: 10px;
  padding: 10px;
  aspect-ratio: 3/2;
}

@media screen and (min-width: 992px) {
  .fr-careers_tile {
    aspect-ratio: 1.71/1;
    flex: 0 1 calc(50% - 7.5px);
    margin-top: 0;
    padding: 20px;
  }
}

.fr-careers_tile::after {
  content: "";
  position: absolute;
  inset: 0;
  height: 100%;
  width: 100%;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0) 100%);
}

.fr-careers_tile .tile-image img {
  transition: 0.4s ease;
}

.fr-careers_tile .tile-contents {
  position: relative;
  z-index: 2;
  display: flex;
  gap: 15px;
  justify-content: space-between;
  flex-direction: column;
  height: 100%;
}

.fr-careers_tile .tile-contents .button-arrow-wrapper {
  line-height: 0;
  text-align: right;
}

@media screen and (min-width: 992px) {
  .fr-careers_tile .tile-contents .button-arrow-wrapper {
    margin-right: -10px;
    margin-bottom: -10px;
    opacity: 0;
    transition: 0.4s all;
  }
}

@media screen and (max-width: 1199px) {
  .fr-careers_tile .mini-title {
    font-size: 12px;
  }
  .fr-careers_tile .mini-title::before {
    top: 3px;
  }
}

@media screen and (max-width: 991px) {
  .fr-careers_tile .mini-title {
    margin: 2px 0 0 5px;
  }
}

@media screen and (min-width: 992px) {
  .fr-careers_tile:hover .tile-contents .button-arrow-wrapper {
    opacity: 1;
  }
}

.fr-careers_tile:hover .tile-image img {
  transform: scale(1.08);
  filter: brightness(0.7);
}

.fr-careers * {
  color: var(--color-white);
}

/*# sourceMappingURL=style-index.css.map*/