/* ------------------------------------------------------------------------ */
/*  BASE STYLE
/* ------------------------------------------------------------------------ */
@font-face {
    font-family: "Proxima";
    src: url("/wp-content/themes/xebia-theme/css/fonts/ProximaNova/ProximaNova-Bold.woff2") format("woff2"),
        url("/wp-content/themes/xebia-theme/css/fonts/ProximaNova/ProximaNova-Bold.woff") format("woff"),
        url("/wp-content/themes/xebia-theme/css/fonts/ProximaNova/ProximaNova-Bold.otf") format("opentype");
    font-display: swap;
    font-style: normal;
    font-weight: 700;
    font-stretch: normal;
}

@font-face {
    font-family: "Proxima";
    src: url("/wp-content/themes/xebia-theme/css/fonts/ProximaNova/ProximaNova-BoldIt.woff2") format("woff2"),
        url("/wp-content/themes/xebia-theme/css/fonts/ProximaNova/ProximaNova-BoldIt.woff") format("woff"),
        url("/wp-content/themes/xebia-theme/css/fonts/ProximaNova/ProximaNova-BoldIt.otf") format("opentype");
    font-display: swap;
    font-style: italic;
    font-weight: 700;
    font-stretch: normal;
}

@font-face {
    font-family: "Proxima";
    src: url("/wp-content/themes/xebia-theme/css/fonts/ProximaNova/ProximaNova-Semibold.woff2") format("woff2"),
        url("/wp-content/themes/xebia-theme/css/fonts/ProximaNova/ProximaNova-Semibold.woff") format("woff"),
        url("/wp-content/themes/xebia-theme/css/fonts/ProximaNova/ProximaNova-Semibold.otf") format("opentype");
    font-display: swap;
    font-style: normal;
    font-weight: 600;
    font-stretch: normal;
}

@font-face {
    font-family: "Proxima";
    src: url("/wp-content/themes/xebia-theme/css/fonts/ProximaNova/ProximaNova-SemiboldIt.woff2") format("woff2"),
        url("/wp-content/themes/xebia-theme/css/fonts/ProximaNova/ProximaNova-SemiboldIt.woff") format("woff"),
        url("/wp-content/themes/xebia-theme/css/fonts/ProximaNova/ProximaNova-SemiboldIt.otf") format("opentype");
    font-display: swap;
    font-style: italic;
    font-weight: 600;
    font-stretch: normal;
}

@font-face {
    font-family: "Proxima";
    src: url("/wp-content/themes/xebia-theme/css/fonts/ProximaNova/ProximaNova-Regular.woff2") format("woff2"),
        url("/wp-content/themes/xebia-theme/css/fonts/ProximaNova/ProximaNova-Regular.woff") format("woff"),
        url("/wp-content/themes/xebia-theme/css/fonts/ProximaNova/ProximaNova-Regular.otf") format("opentype");
    font-display: swap;
    font-style: normal;
    font-weight: 400;
    font-stretch: normal;
}

@font-face {
    font-family: "Proxima";
    src: url("/wp-content/themes/xebia-theme/css/fonts/ProximaNova/ProximaNova-RegularIt.woff2") format("woff2"),
        url("/wp-content/themes/xebia-theme/css/fonts/ProximaNova/ProximaNova-RegularIt.woff") format("woff"),
        url("/wp-content/themes/xebia-theme/css/fonts/ProximaNova/ProximaNova-RegularIt.otf") format("opentype");
    font-display: swap;
    font-style: italic;
    font-weight: 400;
    font-stretch: normal;
}

main .dnd-section .dnd-column {
    padding: 0 0px;
}

.bg-black .font-bold {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

html,
body {
    overflow-x: hidden;
}

body {
    font-family: 'Proxima', sans-serif;
    /* height: 100%; */
}

a {
    transition: all 0.3s ease;
}

a:hover {
    text-decoration: none !important;
}

main a:not([class]) {
    color: #6a1d57;
    border-bottom: 2px solid rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
}

main a:not([class]):hover {
    color: #6a1d57;
    border-bottom: 2px solid rgba(0, 0, 0, 0.15);
}

main .bg-purple a:not([class]) {
    color: rgba(256, 256, 256, 1);
    border-bottom: 2px solid #6a1d57;
}

main .bg-purple a:not([class]):hover {
    color: rgba(256, 256, 256, 0.7);
    border-bottom: 2px solid #6a1d57;
}

main ul:not([class]) {
    padding-left: 1.5rem;
    padding-bottom: 1.5rem;
}

main ul:not([class]) li {
    list-style: none;
    background: url('https://xebia.com/wp-content/themes/xebia-theme/images/dot.svg')
        no-repeat left 10px;
    background-size: 10px;
    padding: 0 0 8px 24px;
    margin: 0;
}

h2,
main h2:not([class]),
main h3:not([class]),
main h4:not([class]) {
    color: #140126;
}

p {
    line-height: 150%;
    margin-bottom: 1em;
}

@media (min-width: 770px) {
    p {
        line-height: 160%;
        margin-bottom: 1.5em;
    }
}

.text-lg p {
    font-size: 1rem;
}

.text-xl p {
    font-size: 1.25rem;
}

.text-3xl p {
    font-size: 2rem;
}

.text-2xl p,
.md\:text-2xl p,
.p-subtitle {
    font-size: 1.5rem;
}

.text-xl p {
    font-size: 1.25rem;
}

.text-purple p {
    color: #6a1d57;
}

.text-white p {
    color: #fff;
}
.text-grey-300 p {
    color: #bcc3cc;
}
.text-white p {
    color: #fff;
}

p:last-child {
    /* margin-bottom: 0; */
}

.quote-block p:last-child {
    margin-bottom: 0;
}

div > h1:first-child,
div > h2:first-child,
div > h3:first-child,
div > h4:first-child {
    margin-top: 0;
}

span > h1:first-child,
span > h2:first-child,
span > h3:first-child,
span > h4:first-child {
    margin-top: 0;
}

h2 em,
h3 em,
h4 em {
    font-style: normal;
    color: #778394;
    font-weight: normal;
}

main h1 {
    font-size: 1.75rem;
}

@media (min-width: 770px) {
    main h1 {
        font-size: 2rem;
    }
}

.container {
    max-width: 1320px;
    padding-left: 1rem;
    padding-right: 1rem;
}

.box-half {
    max-width: 660px;
}

@media (min-width: 770px) {
    .container {
        margin-left: auto;
        margin-right: auto;
        padding-left: 1rem;
        padding-right: 1rem;
    }
    .box-half {
        width: 660px;
    }
    .text-lg p {
        font-size: 1.125rem;
    }
}

@media (min-width: 1180px) {
    .container {
        max-width: 1300px;
        padding-left: 1rem;
        padding-right: 1rem;
    }
    .box-half {
        max-width: 640px;
    }
}

@media (min-width: 1330) {
    .container {
        max-width: 1320px;
        padding-left: 1rem;
        padding-right: 1rem;
    }
    .box-half {
        max-width: 660px;
    }
}

.img-sq {
    height: 0;
    width: 100%;
    padding-bottom: 100%;
}

.img-wide {
    height: 0;
    width: 100%;
    padding-bottom: 64%;
}

.img-wider {
    height: 0;
    width: 100%;
    padding-bottom: 54%;
}

.img-blog {
    height: 0;
    padding-bottom: 60%;
}

.img-tall {
    height: 0;
    width: 100%;
    padding-bottom: 140%;
}

.multiply {
    mix-blend-mode: multiply;
}

.greyscale {
    filter: grayscale(100);
}

.greyscale:hover {
    filter: grayscale(0);
}

.img-full {
    width: 100%;
    min-height: 400px;
}

@media (min-width: 770px) {
    .img-full {
        width: 100%;
        min-height: 600px;
    }
}

/* Password form */
.post-password-form input[type='password'] {
    padding: 12px 16px;
    border: 1px solid #b8becf;
}

.post-password-form input[type='submit'] {
    padding: 12px 16px;
    color: #fff;
    background-color: #00a09b;
    font-weight: bold;
}

/* Custom utilities */
.element-center {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
}

.element-center-h {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.img-responsive {
    max-width: 100%;
    height: auto;
}

.grayscale {
    filter: grayscale(100);
}

.multiply {
    mix-blend-mode: multiply;
}

.hidden {
    visibility: visible !important;
}

/* Lists */
ul.list-reset {
    padding: 0;
}

.list-reset li {
    list-style: none;
}

.list-logos li {
    display: inline-block;
    vertical-align: middle;
}

.list-logos li img,
.logo-img {
    mix-blend-mode: multiply;
    width: 120px;
    /* max-height: 30px; */
}

.logo-blob {
    /* max-height: 80px; */
    width: 125px;
    max-width: 100%;
    max-height: 100%;
}

@media (min-width: 770px) {
    .list-logos li img,
    .logo-img {
        width: 160px;
        /* max-height: 40px; */
    }
}

.has-list-check ul:not([class]),
.has-list-uncheck ul:not([class]) {
    padding-left: 0;
    padding-top: 1em;
    padding-bottom: 1em;
}

div > ul:not([class]):first-child {
    padding-top: 0;
}

.has-list-uncheck ul:not([class]) li {
    background: url("data:image/svg+xml,%3Csvg width='24' height='24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='12' cy='12' r='12' fill='%23DD3E35'/%3E%3Cpath d='M8 16l8-8M16 16L8 8' stroke='%23fff' stroke-width='2'/%3E%3C/svg%3E")
        no-repeat left 3px;
    background-size: 16px;
    padding: 0 0 0.5em 1.8em;
}

.has-list-check ul:not([class]) li {
    background: url("data:image/svg+xml,%3Csvg width='24' height='24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle opacity='.2' cx='12' cy='12' r='12' fill='%2300A09B'/%3E%3Cpath d='m7.277 11.637 4 4 6.91-6.91' stroke='%2300A09B' stroke-width='2'/%3E%3C/svg%3E")
        no-repeat left 3px;
    background-size: 18px;
    padding: 0 0 0.5em 1.8em;
}

.has-list-check ol li ul:not([class]) {
    padding-left: 2em;
}

.has-list-check ol li ul:not([class]) li {
    display: list-item;
    list-style: circle;
    background: none;
    padding: 0 0 0.5em 0;
}

.list-numbers h3 {
    color: #fff;
    font-size: 20px;
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}

.list-numbers p {
    margin-top: 0;
    color: #98a0bc;
}

.list-numbers,
.list-numbers ol {
    list-style: none;
    counter-reset: custom-counter;
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    padding: 0;
}

.list-numbers li {
    counter-increment: custom-counter;
    /* display: flex; */
    width: 100%;
    padding-left: 80px;
    /* font-size: 0.8rem; */
    margin-bottom: 1.5rem;
    position: relative;
    /* padding-left: 0px; */
}

.list-numbers li::before,
ol li::before {
    content: '0' counter(custom-counter) ' -';
    font-size: 3rem;
    margin-right: 0.5rem;
    font-family: 'Fira Mono', sans-serif;
    font-weight: bold;
    line-height: 1;
    position: absolute;
    color: #6a1d57;
    left: 0;
}

ol {
    counter-reset: custom-counter;
    list-style: none;
    padding-bottom: 1rem;
    padding-left: 0rem;
}

ol li {
    counter-increment: custom-counter;
    position: relative;
    padding-bottom: 1em;
    padding-left: 0;
}

ol li::before {
    font-size: 1em;
    left: 0px;
    top: 0;
    position: relative;
}

ol li ul {
    counter-reset: custom-counter;
}

ol li ul li:before {
  display: none;
}

ol li ul li::marker {
    color: #6a1d57;
}

ol li ol {
    padding-top: 1rem;
    padding-left: 1em;
}

ol li ol li {
    padding-bottom: 0.5rem;
}

@media (min-width: 770px) {
    ol li::before {
        font-size: 1em;
        left: 0px;
        position: relative;
    }

    .list-numbers li {
        width: 50%;
        padding-right: 40px;
        margin-bottom: 2.5rem;
    }
}

/* ------------------------------------------------------------------------ */
/*  HEADER
/* ------------------------------------------------------------------------ */
.header-inner {
    min-height: 540px;
}

.header-image {
    height: 95vh;
    max-height: 640px;
}

@media (min-width: 770px) {
    .header-inner {
        height: 90vh;
        max-height: 720px;
    }
    .header-image {
        height: 95vh;
        max-height: 760px;
    }
    .header-home.header-image {
        height: 95vh;
        max-height: 960px;
    }
}

.btn-scroll {
    bottom: 70px;
    background: rgba(256, 256, 256, 0.1);
    height: 36px;
    width: 36px;
    border-radius: 68% 43% 61% 51% / 51% 51% 60% 58%;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    /* animation: blobout 2s ease-in-out infinite alternate; */
    overflow: hidden;
    transition: all 0.3s ease-out;
}

@keyframes blobout {
    0% {
        border-radius: 68% 43% 61% 51% / 51% 51% 60% 58%;
    }
    100% {
        border-radius: 42% 66% 61% 51% / 57% 51% 53% 57%;
    }
}

.btn-scroll::before {
    content: '';
    width: 100%;
    height: 100%;
    background: #fff;
    position: absolute;
    left: 0;
    top: 0;
    transform: scale(0);
    transition: all 0.4s ease-out;
    border-radius: 42% 66% 61% 51% / 57% 51% 53% 57%;
}

.btn-scroll-img {
    height: 14px;
    width: 16px;
    z-index: 10;
    position: relative;
    transition: all 0.4s ease-out;
}

.header-photo .btn-scroll-img {
    stroke: #fff;
}

.btn-scroll:hover {
    transform: translateX(-50%) scale(1.2);
    background: #fff;
}

.btn-scroll:hover .btn-scroll-img {
    transform: scale(1) translateY(2px);
}

.header-photo .btn-scroll:hover .btn-scroll-img {
    stroke: #6a1d57;
    z-index: 10;
    position: relative;
}

.h-overlay {
    width: 100%;
    height: 100%;
    top: 0;
    bottom: 0;
    left: 0;
    position: absolute;
    z-index: 2;
}

.overlay-gradient {
    background: linear-gradient(180deg, #00162b 0%, rgba(0, 26, 49, 0) 100%);
    mix-blend-mode: multiply;
    opacity: 0.6;
}

.overlay-darken {
    background: rgba(0, 0, 0, 0.3);
    mix-blend-mode: multiply;
}

.overlay-shade {
    background: linear-gradient(180deg, #00162b 0%, rgba(0, 26, 49, 0) 100%);
    mix-blend-mode: multiply;
    opacity: 0.7;
    height: 50%;
}

.header-flexible-content .number-columns .text-purple,
.header-flexible-content .number-columns .text-dusk {
    color: rgb(255 255 255 / var(--tw-text-opacity));
}

/* ------------------------------------------------------------------------ */
/*  FANCYBOX
/* ------------------------------------------------------------------------ */

.fancybox-bg {
    background: #141719;
}

.fancybox-content {
    box-shadow: 0 15px 30px 0 rgba(0, 0, 0, 0.08),
        0 5px 15px 0 rgba(0, 0, 0, 0.08);
    border-radius: 6px;
}

.overlay-box {
    display: none;
    width: 100%;
    max-width: 960px;
    border-radius: 2px;
}

.fancybox-content {
    width: 100%;
    max-width: 960px;
}

/* ------------------------------------------------------------------------ */
/*  CONTENT
/* ------------------------------------------------------------------------ */

.team-slider-box {
    width: 320px;
}

.cases-slider-box {
    width: 360px;
}

@media (min-width: 770px) {
    .cases-slider-box {
        width: 460px;
    }
}

.img-zoom {
    transition: all 0.8s cubic-bezier(0, 0, 0.14, 0.99);
}

.case-post .img-wide {
    overflow: hidden;
}

.case-post:hover .img-zoom {
    transform: scale(1.02);
}

/* Toggles */
.toggle-title {
    display: block;
    position: relative;
    cursor: pointer;
    padding-right: 20px;
    margin-bottom: 0;
}

.toggle-title::before {
    content: '';
    position: absolute;
    top: calc(50% - 4px);
    right: 0;
    width: 13px;
    height: 8px;
    background: url('data:image/svg+xml;utf8,%3Csvg width="14" height="8" xmlns="http://www.w3.org/2000/svg"%3E%3Cg fill="none" fill-rule="evenodd"%3E%3Cpath d="M-1403-1086H237V826h-1640z"/%3E%3Cpath d="M13.027 2.754L6.845 7.337.663 2.754V.027L6.845 4.61 13.027.027z" fill="%2300A09B" fill-rule="nonzero"/%3E%3C/g%3E%3C/svg%3E')
        no-repeat;
    z-index: 10;
    transform-origin: center;
    transition: all 0.2s ease-in-out;
}

.toggle-box .toggle-title.is-open::before {
    transform: rotate(180deg);
}

.toggle-box .toggle-target {
    display: none;
}

.img-case {
    width: 95%;
    height: 400px;
}

.logo-nav {
    opacity: 0.5;
    width: 110px;
}

.text-list {
    font-size: 1.35em;
}

@media (min-width: 770px) {
    .logo-nav {
        width: 140px;
    }
    .text-list {
        font-size: 2em;
    }
}

.logo-list-blob {
    width: 130px;
}

a.logo-list-blob {
    transition: none;
}

.logo-list-blob img {
    max-height: 50px;
}

.logo-nav img {
    max-height: 40px;
    max-width: 125px;
    height: auto;
    width: auto;
}

.logo-nav.is-selected {
    opacity: 1;
}

@media (min-width: 770px) {
    .img-section {
        min-height: 540px;
    }

    .img-case {
        width: 80%;
        height: 600px;
    }

    .logo-list-blob {
        width: 200px;
    }
    .logo-list-blob img {
        max-height: 64px;
        max-width: 140px;
    }
}

.case-slider-quote {
    position: relative;
    z-index: 20;
    width: 100%;
    min-height: 520px;
    opacity: 0.9;
    /* margin-top: -50px; */
    /* margin-left: 20px; */
    /* margin-right: 20px; */
}

@media (min-width: 770px) {
    .case-slider-quote {
        position: absolute;
        max-width: 50%;
        top: 0;
        bottom: 32px;
        margin-left: 50%;
        margin-top: auto;
    }
}

@media (min-width: 1140px) {
    .case-slider-quote {
        max-width: 570px;
    }
}

.news-item {
    width: 320px;
    height: 100%;
}

/* ------------------------------------------------------------------------ */
/*  Slider
/* ------------------------------------------------------------------------ */
.driven-cell {
    width: 78%;
}

@media (min-width: 770px) {
    .driven-cell {
        width: 28%;
    }
}

.flickity-enabled.is-fade .flickity-slider > * {
    pointer-events: none;
    z-index: 0;
}

.flickity-enabled.is-fade .flickity-slider > .is-selected {
    pointer-events: auto;
    z-index: 1;
}

.flickity-viewport {
    transition: height 0.2s;
}

.flickity-slider {
    display: flex;
    /* align-items: center; */
}

.logo-slider .flickity-viewport {
    height: 70px !important;
}

.logo-slider .flickity-slider {
    align-items: center;
    /* height: 100%; */
}

.logo-slider-item {
    /* height: 90px;
    min-width: 150px;
    max-width: 100%; */
}

/* ------------------------------------------------------------------------ */
/*  BLOG
/* ------------------------------------------------------------------------ */
article h2,
article h1 {
    margin-top: 3rem;
    margin-bottom: 2rem;
    font-size: 32px;
}

article h3 {
    margin-top: 2rem;
    margin-bottom: 1rem;
}

article h4 {
    margin-top: 2rem;
    margin-bottom: 1rem;
}

article p {
    margin-top: 1rem;
    margin-bottom: 1rem;
}

article .lead {
    font-size: 20px;
    line-height: 150%;
    margin-bottom: 2.5rem;
    display: block;
    color: #080738;
}

article code,
article pre {
    white-space: pre-wrap;
}

article code.hljs,
.codehilite pre,
pre {
    background: #fbfcfe;
    border: 1px solid #e7ebf4;
    border-radius: 8px;
    font-size: 14px;
    padding: 20px;
    line-height: 140%;
    font-family: 'fira mono', 'Monaco', 'Helvetica Neue', Helvetica, Arial,
        sans-serif;
    white-space: pre-wrap;
    margin-bottom: 2em;
    /* color: #fff; */
}

pre.katex-container {
    padding: 0;
    font-size: 1.4em;
    border: 0;
    line-height: unset;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.ql-img-inline-formula {
    display: inline-block;
}

h2 .ql-img-inline-formula {
    height: 1.5rem;
    width: auto;
}

.footnotes {
    padding-top: 2rem;
    display: block;
    color: #7f869f;
    font-size: 14px;
}

.footnotes hr {
    margin-bottom: 2rem;
    border-color: #00a09b;
}

.latex {
    display: inline-block;
}

article .img-wrap {
    text-align: center;
}

.cat-list {
    padding-left: 0;

    /* padding-bottom: 0; */
    background: none;
}

.cat-list li {
    position: relative;
    list-style: none;
    display: inline;
}

.cat-list li::after {
    content: '/';
    display: inline-block;
    padding-left: 8px;
    margin-right: 8px;
    color: #b8becf;
    opacity: 0.75;
}
.cat-list li:last-child::after {
    content: '';
}

.blog-tile {
    min-height: 320px;
}

blockquote {
    border-left: 4px solid #6a1d57;
    color: #6a1d57;
    padding-left: 2rem !important;
}

blockquote p:first-child {
    color: #6a1d57;
}

.next.page-numbers {
    font-weight: 600;
    position: relative;
    color: #6a1d57;
}

.page-numbers.current {
    color: #6a1d57;
}

.page-numbers {
    padding: 4px;
}

.page-numbers:hover {
    color: #778394;
}

/* ------------------------------------------------------------------------ */
/*  BUTTONS
/* ------------------------------------------------------------------------ */

.btn-full,
.btn-outline {
    display: inline-block;
    position: relative;
    padding: 14px 40px 14px 28px;
    border-radius: 100px;
    font-weight: 500;
    line-height: 100%;
    overflow: hidden;
}

.btn-outline {
    border: 2px solid #6a1d57;
    color: #6a1d57;
}

.btn-outline.btn-reverse {
    padding: 14px 28px 14px 40px;
}

.btn-outline.btn-sm {
    padding: 10px 40px 10px 28px;
}

.bg-purple .btn-outline,
.bg-grey-800 .btn-outline,
.btn-outline.btn-white {
    border: 2px solid #fff;
    color: #fff;
}

.bg-black .btn-outline {
    border: 2px solid #6a1d57;
}

.btn-outline::after,
.btn-full::after {
    content: '';
    position: absolute;
    width: 200%;
    height: 0;
    padding-bottom: 100%;
    border-radius: 82% 35% 58% 60% / 53% 34% 82% 69%;
    background: #6a1d57;
    left: 0%;
    top: 50%;
    transform: translate(-50%, -50%) scale(0);
    transform-origin: left;
    transition: transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1);
    z-index: -1;
}

.btn-outline:hover::after,
.btn-full:hover::after {
    transform: translate(-50%, -50%) scale(1.2);
}

.btn-outline:hover {
    color: #fff;
    /* box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.25); */
    box-shadow: rgba(0, 0, 0, 0.1) 5px 20px 30px 0px;
    transform: translateY(-6px);
}

.btn-outline::before {
    content: '';
    position: absolute;
    right: 24px;
    top: 50%;
    margin-top: -7px;
    width: 7px;
    height: 13px;
    transition: all 0.3s ease;
    /* transition-delay: .2s; */
    background-size: contain;
    background: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 7 12'%3E%3Cpath d='M1 1.761l4.167 4.25-4 4.084' stroke='%236A1D57' stroke-width='2' stroke-miterlimit='10' stroke-linecap='round'/%3E%3C/svg%3E%0A")
        no-repeat center;
}

.btn-outline:hover::before {
    background: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 7 12'%3E%3Cpath d='M1 1.761l4.167 4.25-4 4.084' stroke='%23fff' stroke-width='2' stroke-miterlimit='10' stroke-linecap='round'/%3E%3C/svg%3E%0A")
        no-repeat center;
    /* transition-delay: .15s; */
}

.btn-outline.btn-reverse::before {
    transform: scale(-1);
    right: auto;
    left: 24px;
}

.btn-full::before,
.btn-outline.btn-white::before {
    content: '';
    position: absolute;
    right: 24px;
    top: 50%;
    margin-top: -7px;
    width: 7px;
    height: 13px;
    transition: all 0.3s ease;
    background: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 7 12'%3E%3Cpath d='M1 1.761l4.167 4.25-4 4.084' stroke='%23fff' stroke-width='2' stroke-miterlimit='10' stroke-linecap='round'/%3E%3C/svg%3E%0A")
        no-repeat center;
    background-size: contain;
    z-index: 2;
}

.btn-full:hover::before,
.btn-outline:hover::before {
    right: 20px;
}

.btn-full::before {
    background: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 7 12'%3E%3Cpath d='M1 1.761l4.167 4.25-4 4.084' stroke='%236A1D57' stroke-width='2' stroke-miterlimit='10' stroke-linecap='round'/%3E%3C/svg%3E%0A")
        no-repeat center;
    background-size: contain;
}

.hs-button {
    display: inline-block;
    position: relative;
    padding: 14px 28px;
    border-radius: 100px;
    font-weight: 500;
    line-height: 100%;
    overflow: hidden;
    border: 2px solid #6a1d57;
    color: #6a1d57;
}

.hs-button:hover {
    background-color: #6a1d57;
    box-shadow: rgba(0, 0, 0, 0.1) 5px 20px 30px 0px;
    transform: translateY(-6px);
    color: #fff;
}

.bg-black .btn-outline {
    color: #fff;
}

.bg-black .btn-outline::before {
    background: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 7 12'%3E%3Cpath d='M1 1.761l4.167 4.25-4 4.084' stroke='%23fff' stroke-width='2' stroke-miterlimit='10' stroke-linecap='round'/%3E%3C/svg%3E%0A")
        no-repeat center;
}

.bg-purple .btn-outline:hover,
.bg-grey-800 .btn-outline:hover {
    color: #6a1d57;
}

.bg-purple .btn-outline::before,
.bg-grey-800 .btn-outline::before {
    background: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 7 12'%3E%3Cpath d='M1 1.761l4.167 4.25-4 4.084' stroke='%23fff' stroke-width='2' stroke-miterlimit='10' stroke-linecap='round'/%3E%3C/svg%3E%0A")
        no-repeat center;
}

.bg-purple .btn-outline:hover::before,
.bg-grey-800 .btn-outline:hover::before {
    background: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 7 12'%3E%3Cpath d='M1 1.761l4.167 4.25-4 4.084' stroke='%236A1D57' stroke-width='2' stroke-miterlimit='10' stroke-linecap='round'/%3E%3C/svg%3E%0A")
        no-repeat center;
}

.bg-purple .btn-outline::after,
.bg-grey-800 .btn-outline::after {
    background: #fff;
}

.bg-purple .btn-outline:hover::after,
.bg-grey-800 .btn-outline:hover::after {
    color: #6a1d57;
}

.btn-full {
    background: #fff;
    padding: 16px 40px 16px 28px;
    color: #6a1d57;
    position: relative;
    z-index: 3;
}

.btn-full:hover {
    color: #fff;
    box-shadow: rgba(0, 0, 0, 0.1) 5px 20px 30px 0px;
    transform: translateY(-6px);
}

.btn-white.btn-full:hover {
    color: #fff;
}

.btn-full:hover::before {
    background: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 7 12'%3E%3Cpath d='M1 1.761l4.167 4.25-4 4.084' stroke='%23fff' stroke-width='2' stroke-miterlimit='10' stroke-linecap='round'/%3E%3C/svg%3E%0A")
        no-repeat center;
}

.btn-full::after {
    background-color: #6a1d57;
    z-index: 1;
}

.btn-full > span {
    position: relative;
    z-index: 3;
}

.link-arrow {
    position: relative;
    color: #bcc3cc;
    /* overflow: hidden; */
}

@media (min-width: 770px) {
    .link-arrow::before {
        content: attr(data-text);
        position: absolute;
        top: 0;
        left: 0;
        color: #6a1d57;
        overflow: hidden;
        width: 0;
        white-space: nowrap;
        height: 100%;
        /* transition: 1s; */
        transition: all 0.6s ease;
    }

    .link-arrow:hover::before {
        width: 100%;
    }

    .link-arrow::after {
        content: '';
        position: relative;
        display: inline-block;
        right: 0px;
        top: 50%;
        margin-top: -7px;
        margin-left: 20px;
        width: 27px;
        height: 20px;
        opacity: 0;
        transform: translateX(-6px);
        transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
        transition-delay: 0s;
        background: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 24'%3E%3Cpath d='M27.888 12.004H2M18.457 21.97l9.985-9.985L18.457 2' stroke='%236A1D57' stroke-width='3' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A")
            no-repeat center;
        background-size: contain;
    }

    .link-arrow:hover::after {
        transform: translateX(0);
        opacity: 1;
        transition-delay: 0.25s;
    }
}

.btn-play {
    width: 60px;
    height: 60px;
    background: url(https://xebia.com/wp-content/themes/xebia-theme/images/play.svg)
        no-repeat center;
    background-size: 40px;
    border: 2px solid #fff;
    border-radius: 100%;
    top: 0px;
    left: 0px;
    position: absolute;
    transition: all 0.2s ease-in-out;
}

.has-btn-play:hover .btn-play {
}

.btn-text {
    position: relative;
    font-weight: bold;
    color: #6a1d57;
    padding-right: 16px;
}

.btn-text::after {
    content: '';
    position: absolute;
    right: 0px;
    top: 50%;
    margin-top: -7px;
    width: 7px;
    height: 13px;
    transition: all 0.3s ease;
    /* transition-delay: .2s; */
    background-size: contain;
    background: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 7 12'%3E%3Cpath d='M1 1.761l4.167 4.25-4 4.084' stroke='%236A1D57' stroke-width='2' stroke-miterlimit='10' stroke-linecap='round'/%3E%3C/svg%3E%0A")
        no-repeat center;
}

.btn-text:hover::after {
    right: -4px;
}

/* Slider buttons */
.nav-btn {
    width: 40px;
    height: 40px;
    position: relative;
    border: 2px solid #f7f8fc;
    border-radius: 100px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.4s cubic-bezier(0.32, 0.94, 0.6, 1);
}

@media (min-width: 770px) {
    .nav-btn {
        width: 52px;
        height: 52px;
    }
}

.nav-btn:focus {
    border-color: #eaeff5;
    outline: none;
}

.nav-btn::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 67% 44% 55% 59% / 55% 40% 72% 53%;
    background: #f7f8fc;
    left: 0;
    top: 0;
    transform: scale(0);
    transition: transform 0.4s cubic-bezier(0.32, 0.94, 0.6, 1);
}

.nav-btn:hover::before {
    transform: scale(1.12);
}

.nav-btn .arrow {
    stroke: #6a1d57;
    width: 17px;
    height: 14px;
    position: relative;
    z-index: 10;
}

.flip {
    transform: scaleX(-1);
}

.flipY {
    transform: scaleY(-1);
}

.flipXY {
    transform: scaleX(-1) scaleY(-1);
}

.nav-btn:hover {
    transform: scale(1.1);
}

@media (min-width: 770px) {
    .btn-slider {
        top: 50%;
    }
    .btn-slider.btn-left {
        left: -50px;
    }
    .btn-slider.btn-right {
        right: -50px;
        left: auto;
    }
}

.btn-fill,
.btn-small {
    padding: 14px 32px;
    overflow: hidden;
    position: relative;
    line-height: 100%;
    border: 2px solid #eaeff5;
    border-radius: 100px;
    color: #778394;
    font-size: 16px;
    display: inline-block;
    transition: all 0.4s cubic-bezier(0.32, 0.94, 0.6, 1);
}

.btn-small {
    padding: 7px 16px;
    font-size: 14px;
    border: 1px solid #eaeff5;
    transition: all 0.8s cubic-bezier(0.32, 0.94, 0.6, 1);
}

.header-photo .btn-small {
    color: #fff;
}

.btn-fill:hover,
.btn-small:hover,
.header-photo .btn-small:hover {
    color: #6a1d57;
    /* transform: scale(1.1); */
}

.btn-small::before,
.btn-fill::before {
    content: '';
    position: absolute;
    width: 160px;
    height: 160px;
    border-radius: 100%;
    background: #eaeff5;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(0);
    transform-origin: center;
    transition: transform 0.8s cubic-bezier(0.32, 0.94, 0.6, 1);
    /* z-index: -1; */
}

.btn-small:hover::before,
.btn-fill:hover::before {
    transform: translate(-50%, -50%) scale(1.5);
}

.btn-small > span,
.btn-fill > span {
    position: relative;
    z-index: 10;
}

/* Service blobs */
.blob-hover {
    transition: all 0.4s cubic-bezier(0.32, 0.94, 0.6, 1);
}

.blob-hover:hover {
    box-shadow: rgba(0, 0, 0, 0.1) 5px 20px 30px 0px;
    transform: translateY(-12px);
    /* background: #5F5166; */
    transition: all 0.4s cubic-bezier(0.32, 0.94, 0.6, 1);
}

.blob-hover::before {
    content: '';
    position: absolute;
    width: 600px;
    height: 600px;
    border-radius: 82% 35% 58% 60% / 53% 34% 82% 69%;
    background: #fff;
    left: 0%;
    top: 100%;
    transform: translate(-50%, -50%) scale(0);
    transform-origin: center;
    transition: transform 1.5s ease-in;
}

.blob-hover:hover::before {
    transform: translate(-50%, -50%) scale(2.5);
}

/* Boxes */
.box2col,
.box2col h3,
.box2col p {
    transition: all 0.4s ease-in-out;
}

.box2col:hover,
.box2col:hover h3,
.box2col:hover h4,
.box2col:hover p,
.box2col:hover .text-grey-800,
.box2col:hover .text-purple,
.box2col:hover ul li {
    color: #fff;
}

/* ------------------------------------------------------------------------ */
/*  GRID
/* ------------------------------------------------------------------------ */

@media (min-width: 770px) {
    .cols-offset > div:nth-child(2n) {
        transform: translateY(90px);
    }

    .cols-offset-sm > div:nth-child(2n) {
        transform: translateY(36px);
    }
}

/* ------------------------------------------------------------------------ */
/*  DECORATIONS
/* ------------------------------------------------------------------------ */
.body-wave {
    background-image: url(https://xebia.com/wp-content/themes/xebia-theme/images/footer-grey.svg);
    background-repeat:  no-repeat;
    background-position: bottom;
    background-size: contain;
}
.body-wave--type-2 {
    background-image: url(/wp-content/themes/xebia-theme/images/footer-grey-2.svg);
}
.divider-wave img {
    height: 60px;
}

@media (min-width: 770px) {
    .divider-wave img {
        height: 170px;
    }
}

.header-wave {
}

.footer-wave {
    transform: translateY(-100%);
    width: 120%;
    position: absolute;
    top: 0;
    pointer-events: none;
}

.footer-wave img {
    height: 90px;
}

@media (min-width: 770px) {
    .footer-wave img {
        height: 160px;
    }

    .footer-wave {
        width: 100%;
    }
}

.header-wave img,
.inner-wave img {
    position: absolute;
    bottom: 0;
    width: 100%;
    left: 50%;
    min-width: 70em;
    width: calc(100% + 12px);
    max-width: none;
    transform: translateX(-50%);
    pointer-events: none;
}

.header-blob {
    width: 400px;
    height: 400px;
    padding: 0;
    margin: auto;
}

.cta-wave {
    padding-top: 160px;
}

.cta-wave-top img {
    height: 90px;
}

.cta-wave-top img {
    height: 60px;
}

@media (min-width: 770px) {
    .cta-wave-top img {
        height: 180px;
    }
    .cta-wave-img-top img {
        height: 120px;
    }
}

.cta-wave-bottom {
    /* padding-bottom: 180px; */
}

.cta-wave img {
    position: absolute;
    top: 0;
    width: 100%;
    left: 50%;
    min-width: 70em;
    width: calc(100% + 12px);
    max-width: none;
    transform: translateX(-50%);
    pointer-events: none;
}

.cta-wave-bottom img {
    position: absolute;
    bottom: 0;
    width: 100%;
    left: 0;
    min-width: 70em;
    /* width: calc(100% + 12px); */
    /* max-width: none; */
    /* transform: translateX(-50%); */
    pointer-events: none;
}

.cases-blob {
    /* transform: translate(-10%, 0%); */
    max-width: 600px;
}

.side-blob {
    width: 400px;
    height: 70%;
    background: url(https://xebia.com/wp-content/themes/xebia-theme/images/blob-deco-01.svg)
        center no-repeat;
    background-size: contain;
}

.side-blob-lg {
    width: 50vw;
    height: 51vw;
    background: url(https://xebia.com/wp-content/themes/xebia-theme/images/blob-deco-01.svg)
        left center no-repeat;
    background-size: cover;
    display: block;
    top: -10vw;
    right: -10vw;
}

@media (min-width: 770px) {
    .header-hero {
        min-height: 780px;
        height: auto;
    }
    .header-hero-inner {
        height: 720px;
    }
    .header-hero-small {
        min-height: 680px;
        height: auto;
    }
    .header-blob {
        transform: scale(1.2) translateY(-100px) translateX(80px);
        transform: scale(1.2) translateY(-30px) translateX(0px);
        /* max-width: 660px; */
        max-width: 760px;
        width: 100%;
        height: auto;
        margin: 0;
        transform-origin: left;
    }
    .cta-wave {
        padding-top: 180px;
    }
}

@media (min-width: 1070px) {
    .header-hero {
        height: 720px;
    }
    .header-hero-inner {
        height: 720px;
    }
}

@media (min-width: 1470px) {
    .header-hero {
        height: 900px;
    }
    .header-hero-inner {
        height: 720px;
    }
}

.blob-01 {
    border-radius: 82% 35% 58% 60% / 53% 34% 82% 69%;
}

.blob-02 {
    border-radius: 53% 34% 82% 69% / 82% 35% 58% 60%;
}

.blob-03 {
    border-radius: 53% 61% 50% 50% / 51% 42% 65% 60%;
}

.img-mask {
    mask-image: url(https://xebia.com/wp-content/themes/xebia-theme/images/img-mask.svg);
    -webkit-mask-image: url(https://xebia.com/wp-content/themes/xebia-theme/images/img-mask.svg);
    mask-size: contain;
    -webkit-mask-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    transform: scale(0.9) rotate(2deg); /*Chrome zoom fix*/
}

.is-left .img-mask {
    mask-position-x: right;
    -webkit-mask-position-x: right;
}

.has-blob {
    position: relative;
}

.has-blob::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: url(https://xebia.com/wp-content/themes/xebia-theme/images/blob-bg-01.svg)
        no-repeat;
    background-size: contain;
    /* transform: scale(1.2) translate(-6%, 0%); */
    /* transform: scale(1.2) translate(0%, 0%); */
    pointer-events: none;
}

@media (min-width: 780px) {
    .has-blob.is-right::before {
        left: 5%;
        transform: scale(1) translate(-2%, 0%);
        background: url(https://xebia.com/wp-content/themes/xebia-theme/images/blob-bg-01.svg)
            no-repeat;
        top: 0%;
        background-size: contain;
        /* max-width: 600px; */
    }
    .has-blob.is-left::before {
        left: -5%;
        transform: scale(1) translate(2%, 0%);
        background: url(https://xebia.com/wp-content/themes/xebia-theme/images/blob-bg-01.svg)
            no-repeat top right;
        background-size: contain;
        /* max-width: 600px; */
        right: 0;
        top: 0%;
        position: absolute;
    }
}

.cases-blob::before,
.has-blob-wire::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: url(https://xebia.com/wp-content/themes/xebia-theme/images/blob-outline.svg)
        no-repeat;
    background-size: contain;
    transform: scale(0.93) translate(-3%, 0%);
}

.has-blob-wire--bold::before {
    background-image: url(https://xebia.com/wp-content/themes/xebia-theme/images/blob-outline-bold.svg);
}

.is-left.has-blob-wire::before {
    background-position-x: right;
    transform: scale(1) translate(-5%, 0%);
}

/* ------------------------------------------------------------------------ */
/*  STYLING
/* ------------------------------------------------------------------------ */
.img-zoom {
    transition: all 0.6s ease-out;
}

.has-img-zoom:hover .img-zoom {
    transform: scale(1.05);
}

.link-underline {
    display: inline;
    transition: all 0.3s ease-out;
    /* text-decoration: none; */
}

.link-underline:hover {
    /* border-bottom: 2px solid rgba(188, 195, 204, 0.25); */
    color: #778394;
}

.s-bg-white + .s-numbers-simple {
    margin-top: -64px;
}

.s-bg-white + .s-bg-white,
.s-bg-move-top {
    margin-top: -64px;
}

.s-bg-move-top {
    margin-top: 0px;
}

.s-bg-white.s-boxes + .s-bg-white.s-boxes,
.s-boxes-top {
    margin-top: 0px;
}
.s-intro + .divider-wave {
    margin-top: -32px;
}
.s-img-wave + .s-related {
    margin-top: -32px;
}

@media (min-width: 770px) {
    .s-bg-white + .s-numbers-simple {
        margin-top: -96px;
    }

    .s-bg-white + .s-bg-white,
    .s-bg-move-top {
        margin-top: -96px;
    }
}

/* .pb-lg + .s-quote,
.py-lg + .s-quote {
  padding-top: 0px;
} */

/* Select dropdown */
.select {
    position: relative;
    display: inline-block;
    cursor: pointer;
    background-color: #fff;
    border: 2px solid #eaeff5;
    border-radius: 100px;
    color: #35445a;
    padding: 8px 44px 8px 20px;
    min-width: 200px;
}

.select svg {
    top: 18px;
    right: 18px;
}

.select:hover {
    border-color: #bcc3cc;
    cursor: pointer;
}

.select-dropdown {
}

.criteriaSelector {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23a0aec0'%3e%3cpath d='M15.3 9.3a1 1 0 0 1 1.4 1.4l-4 4a1 1 0 0 1-1.4 0l-4-4a1 1 0 0 1 1.4-1.4l3.3 3.29 3.3-3.3z'/%3e%3c/svg%3e");
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-print-color-adjust: exact;
    color-adjust: exact;
    background-repeat: no-repeat;
    background-color: #fff;
    border-color: #eaeff5;
    border-width: 2px;
    border-radius: 100px;
    padding-top: 0.5rem;
    padding-right: 2.5rem;
    padding-bottom: 0.5rem;
    padding-left: 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    background-position: right 0.5rem center;
    background-size: 1.5em 1.5em;
}

.criteriaSelector::-ms-expand {
    color: #a0aec0;
    border: none;
}

@media not print {
    .criteriaSelector::-ms-expand {
        display: none;
    }
}

@media print and (-ms-high-contrast: active),
    print and (-ms-high-contrast: none) {
    .criteriaSelector {
        padding-right: 0.75rem;
    }
}

.criteriaSelector:focus {
    outline: none;
    /* box-shadow: 0 0 0 3px rgba(66, 153, 225, 0.5); */
    border-color: #bcc3cc;
}

/* Forms */
@media (min-width: 770px) {
    .push-form {
        margin-top: -400px;
    }
}

.push-form h1,
.push-form h2,
.push-form h3 {
    font-size: 32px;
}

/* Prose */
.prose h2 {
    font-size: 2.25rem;
}

.prose h3 {
    font-size: 1.5rem;
}

.prose h4 {
    font-size: 1.125rem;
}

.prose img {
    border-radius: 0.5rem;
}

/* Hubspot */
.hb-form img {
    border-radius: 6px;
    margin: 0 auto !important;
    /* box-shadow: 0px 8px 35px -2px rgba(5, 1, 35, 0.12); */
}

.iconbox-header {
    min-height: 48px;
    display: flex;
    align-items: center;
}

.blog-pagination__link--active {
    color: #6a1d57;
}

.cta-form iframe {
    max-width: 550px;
    margin-left: auto;
    margin-right: auto;
}

.iframe-podcast iframe {
    min-height: 160px !important;
}

.iframe-youtube iframe,
iframe[src^="https://www.youtube.com/"],
iframe[src^="https://www.vimeo.com/"]
{
    aspect-ratio: 16/9;
    width: 100% !important;
    height: auto;
}

/* Wordpress activate page */
.wp-activate-container {
    padding: 96px 0 120px 0;
    max-width: 980px;
    margin: auto;
}

#signup-content {
    position: relative;
    z-index: 30;
}

#submit {
    border: 2px solid #6a1d57;
    border-radius: 36px;
    padding: 12px 20px;
    color: #6a1d57;
    cursor: pointer;
}

#key {
    border: 1px solid #7f869f;
}

/* Toggles */

.tab-title {
    cursor: pointer;
}

.tab-title.is-active {
    overflow: hidden;
}

.tab-title {
    z-index: 10;
    position: relative;
    color: #fff;
}

.tab-title svg {
    fill: #364069;
}

.tab-title.is-active,
.tab-title.is-active:hover,
.tab-title:hover {
    color: #00a09b;
}

.tab-title.is-active {
    border-bottom: 2px solid #00a09b;
}

.tab-title.is-active svg,
.tab-title:hover svg {
    fill: #00a09b;
}

.tab-title.is-active::after {
    display: inline-block;
}

.tab-content {
    opacity: 0;
    transition: all 0.4s ease-in-out;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    height: 100%;
    width: 100%;
    pointer-events: none;
}

.tab-content.is-active {
    opacity: 1;
    pointer-events: all;
}

.tab-content.is-active,
.tab-content-wrap {
    position: relative;
}

.max-width-unset {
    max-width: unset;
}

/* HubSpot form block styles */
.hubspot-form [class^='form-columns-'],
.hubspot-form .hs-form {
    display: flex;
    gap: 24px;
}

.hubspot-form .hs-form {
    flex-direction: column;
}

.hubspot-form [class^='form-columns-'] {
    max-width: initial;
    flex-direction: column;
}

@media (min-width: 400px) {
    .hubspot-form [class^='form-columns-'] {
        flex-direction: row;
    }
}

.hubspot-form .hs-fieldtype-text,
.hubspot-form .hs-fieldtype-textarea,
.hubspot-form .input {
    width: 100%;
    margin-right: 0 !important;
}

.hubspot-form textarea,
.hubspot-form .hs-input[type="text"],
.hubspot-form .hs-input[type="email"],
.hubspot-form .hs-input[type="tel"],
.hubspot-form .hs-input[type="month"],
.hubspot-form .hs-input[type="number"],
.hubspot-form .hs-input[type="password"],
.hubspot-form .hs-input[type="time"],
.hubspot-form .hs-input[type="date"],
.hubspot-form .hs-input[type="datetime-local"] {
    width: 100% !important;
    height: 44px;
    border: 1px solid #dedede;
    border-radius: 4px;
}

.hubspot-form .hs-input[type='file'] {
    padding: 4px;
    background: white;
}

.hubspot-form .hs-input[type='checkbox'] {
    height: 20px;
    width: 20px !important;
    background: white;
    border: 1px solid #dedede;
    border-radius: 4px;
}

.hubspot-form .hs-input[type='checkbox']:not(:checked) {
    appearance: none;
}

.hubspot-form .hs-input[type='checkbox'] + span {
    font-size: 12px;
}

.hubspot-form .hs-input[type='checkbox'] + span {
    margin-left: 32px !important;
}

.hubspot-form legend {
    margin-bottom: 4px;
}

.hubspot-form .hs-form-required {
    color: red;
    margin-left: 0.2em;
}

.hubspot-form .hs-richtext p {
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 0.1px;
    line-height: 20px;
    margin-bottom: 16px;
}

.hubspot-form .hs-richtext strong {
    font-size: 14px;
}

.hubspot-form .hs-richtext a {
    text-decoration: none;
}

.hubspot-form .hs-button {
    margin: 0 auto;
    padding: 12px 58px;
}

.hubspot-form .actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}


/* CF7 Forms */
.wpcf7 p,
.wpcf7-list-item-label {
    font-size: 12px;
}

.wpcf7 p strong {
    font-size: 14px;
}

.wpcf7 label {
    font-size: 1rem;
}

.wpcf7 .wpcf7-list-item {
    margin-left: 0;
}

.wpcf7-list-item > label {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

.wpcf7-list-item input[type="checkbox"] {
    margin-top: 0.12rem;
}

.wpcf7-date,
.wpcf7-number,
.wpcf7-email,
.wpcf7-text,
.wpcf7-textarea {
    width: 100% !important;
    height: 44px;
    border: 1px solid #dedede;
    border-radius: 4px;
    padding: 0.25rem 1rem;
}

.wpcf7-textarea {
    height: auto;
}

.wpcf7-form-control {
    margin-top: 0.25rem;
}

.wpcf7-not-valid-tip {
    margin-top: 0.25rem;
}

.wpcf7-file {
    font-size: 14px;
    margin-top: 0.75rem;
    background-color: white;
    padding: 0.25rem;
}

.wpcf7 .required {
    color: red;
    margin-left: 0.2em;
}

.wpcf7-cols {
    display: grid;
    gap: 1.5rem;
}


@media (min-width: 770px) {
    .wpcf7-cols {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.wpcf7 .wpcf7-response-output {
    display: flex;
    align-items: center;

    border-radius: 4px;
    border-width: 1px !important;
    padding: 12px !important;

    color: #222222;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0.01em;
}

.wpcf7 form.sent .wpcf7-response-output::before,
.wpcf7 form.failed .wpcf7-response-output::before,
.wpcf7 form.aborted .wpcf7-response-output::before {
    height: 20px;
    width: 20px;
    margin-right: 12px;
}

.wpcf7 form.sent .wpcf7-response-output {
    background: #E6F1F0;
    border-color: #06A99C;
}

.wpcf7 form.sent .wpcf7-response-output::before {
    content: url('/wp-content/themes/xebia-theme/images/icon-check-circle-filled.svg');
}

.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output {
    background: #F5E9E9;
    border-color: #C33737;
}

.wpcf7 form.failed .wpcf7-response-output::before,
.wpcf7 form.aborted .wpcf7-response-output::before {
    content: url('/wp-content/themes/xebia-theme/images/icon-alert-circle-filled.svg');
}

.wpcf7-form.submitting {
    opacity: .5;
    pointer-events: none;
    animation: slow-opacity-blink 2s infinite;
}

@keyframes slow-opacity-blink {
    0% {
        opacity: .5;
    }

    50% {
        opacity: .2;
    }

    100% {
        opacity: .5;
    }
}

.fancy-table {
    border-collapse: collapse;
    width: 50%;
    margin-left: auto;
    margin-right: auto;
}

.fancy-table caption {
    font-size: 1.1em;
}

.fancy-table th {
    border: 1px solid #ddd;
    padding: 8px;
    text-align: left;
    background-color: #f2f2f2;
}

.fancy-table td {
    border: 1px solid #ddd;
    padding: 8px;
    text-align: left;
}

#recruitee-form {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

#recruitee-form .form-element {
    margin-bottom: 18px;
    box-sizing: border-box;
}

#recruitee-form label {
    font-size: 16px;
    font-weight: 600;
    line-height: 20px;
    color: #33475b;
    display: block;
    float: none;
    width: auto;
    padding-top: 0;
    margin-bottom: 4px;
}

#recruitee-form .required {
    color: red;
}

#recruitee-form input, #recruitee-form select, #recruitee-form textarea {
    display: inline-block;
    width: 100%;
    height: 40px;
    padding: 9px 10px;
    font-size: 16px;
    font-weight: normal;
    line-height: 22px;
    color: #33475b;
    border: 1px solid #cbd6e2;
    box-sizing: border-box;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    border-radius: 3px;
    background-color: #f5f8fa;
}

#recruitee-form textarea {
    height: auto;
}

#recruitee-form .form-btn {
    margin-top: 18px;
    margin-bottom: 0;
    padding: 17px 0px;
}

#recruitee-form .form-btn input {
    white-space: pre-wrap;
    background: #6c1d5f;
    border-color: #6c1d5f;
    color: #ffffff;
    margin: 0;
    cursor: pointer;
    display: inline-block;
    font-weight: 700;
    line-height: 12px;
    position: relative;
    text-align: center;
    transition: all .15s linear;
    border-radius: 3px;
    border-style: solid;
    border-width: 1px;
    font-size: 14px;
    padding: 12px 24px;
    width: auto;
}

#recruitee-form .response-error {
    color: red;
    font-weight: 600;
    margin-right: 4px;
}

#recruitee-form .response-success {
    color: green;
    font-weight: 600;
    margin-right: 4px;
}

#recruitee-form #cv {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
    cursor: pointer;
}

.file-area {
    width: 100%;
    position: relative;
}

.file-area .file-dummy {
    width: 100%;
    padding: 50px 30px;
    border: 2px dashed #cbd6e2;
    background-color: #fff;
    text-align: center;
    transition: background 0.3s ease-in-out;
    border-radius: 3px;
}

.file-area .file-dummy .success {
    display: none;
}

.file-area:hover .file-dummy {
    border: 2px dashed #cbd6e2;
}

.file-area input[type=file]:valid + .file-dummy {
    background-color: #f5f8fa;
}

.file-area input[type=file]:valid + .file-dummy .success {
    display: inline-block;
}

.file-area input[type=file]:valid + .file-dummy .default {
    display: none;
}

#recruitee-form .checkbox {
    display: flex;
    align-items: flex-start;
}

#recruitee-form .checkbox input {
    width: unset;
    height: unset;
    margin-top: 2px;
    margin-right: 8px;
    cursor: pointer;
}

#recruitee-form .checkbox label {
    font-weight: 400;
    font-size: 14px;
    cursor: pointer;
}

#recruitee-form .form-element-radio {
    display: flex;
    align-items: center;
}

#recruitee-form .form-element-radio input {
    width: unset;
    margin: 0 4px 4px 0;
}

#recruitee-form .form-element-radio label {
    font-weight: unset;
}

#recruitee-form #submit-btn:disabled {
    background: #f5f8fa;
    border-color: #cbd6e2;
    color: #cbd6e2;
    cursor: unset;
}

#search-box {
    position: relative;
    margin-left: 0.75rem;
}

#search-input {
    border-color: #eaeff5;
    padding-right: 40px;
}

#search-input:focus {
    outline: none;
    border-color: #bcc3cc;
}

#search-clear {
    position: absolute;
    height: 100%;
    right: 18px;
    font-weight: 600;
    color: #bcc3cc;
}

/* For GTM event bubbling prevent */
a>svg,
a>span,
a>strong {
    pointer-events: none;
}