/*!
Theme Name: STARTEO Starter Theme
Author: Starteo
Author URI: https://www.starteo.pro
Description: 
Version: 1.0
Requires at least: 5.0
Tested up to: 5.7
Requires PHP: 7.2
Text Domain: gbdi-starter
*/

/* Don't overwrite this file. Compile "/assets/main.(less|scss)" to "/assets/css/main.css" */

/* From http://codex.wordpress.org/CSS */

/* GENERAL */
/*
@font-face {
	font-family: "Ganton";
	src: url(assets/_fonts/Ganton.otf) format("opentype");
}
*/

@font-face {
  font-family: "Lie To Me";
  src: url(assets/_fonts/Lie-to-me.otf) format("opentype");
  font-weight: 400;
  font-style: normal;
}

:root {
  font-size: 125%;

  --font-family-acumin: "acumin-pro", sans-serif;
  --font-family-unbounded: "Unbounded", sans-serif;
  --font-family-lie-to-me: "Lie To Me", sans-serif;
  --font-weight-extra-light: 200;
  --font-weight-medium: 500;
  --font-weight-bold: 700;
  --font-style-italic: italic;

  --font-size-14: 0.7rem; /* 14px */
  --font-size-18: 0.9rem; /* 18px */
  --font-size-base: 1rem; /* 20px */
  --font-size-30: 1.5rem; /* 30px */
  --font-size-40: 2rem; /* 40px */
  --font-size-50: 2.5rem; /* 50px */
  --font-size-70: 3.5rem; /* 70px */

  --color-red: #e73c3e;
  --color-beige: #fefdf0;
  --color-green: #003c42;
  --color-green-light: #c4ddbc;
  --color-white: #ffffff;
}

@media (max-width: 1399px) {
  :root {
    --font-size-30: 1rem; 
  }
}

@media (max-width: 992px) {
  :root {
    font-size: 112.5%;

    --font-size-70: 2.5rem; /* 50px */
    --font-size-50: 2rem; /* 40px */
    --font-size-40: 1.75rem; /* 35px */
  }
}

body {
  font-family: var(--font-family-acumin);
  font-size: var(--font-size-base);
  letter-spacing: 1px;
  line-height: 1;
  color: var(--color-green);
}

a{
  color: var(--color-green);
}

h2{
  font-size: 1.5rem;
  font-family: var(--font-family-unbounded);
  font-weight: var(--font-weight-bold);
  padding-top: 20px;
}

.back-to-top {
  display: none; /* Hidden by default */
  position: fixed; /* Fixed/sticky position */
  bottom: 10px; /* Place the button at the bottom of the page */
  right: 10px; /* Place the button 30px from the right */
  z-index: 999; /* Make sure it does not overlap */
  outline: none; /* Remove outline */
  cursor: pointer; /* Add a mouse pointer on hover */
  font-size: 20px; /* Increase font size */
  color: var(--color-green-light);
  background: var(--color-green);
  padding: 14px 16px;
  transition:
    background-color 0.3s,
    opacity 0.5s,
    visibility 0.5s;
  opacity: 0;
  visibility: hidden;
}

.back-to-top.show {
  opacity: 1;
  visibility: visible;
}

.back-to-top:hover {
  background-color: var(--color-green-light);
  color: var(--color-green);
}

.fcz-lie-to-me {
  font-family: var(--font-family-lie-to-me);
  font-size: var(--font-size-70);
  line-height: 1;
  letter-spacing: 3.5px;
  transform: rotate(-3deg);
}

.fcz-title-50-banner {
  font-family: var(--font-family-unbounded);
  font-weight: var(--font-weight-medium);
  font-size: var(--font-size-50);
  line-height: 1.24;
  letter-spacing: 2.5px;
}

.fcz-title-50 {
  text-transform: uppercase;
  font-family: var(--font-family-unbounded);
  font-weight: var(--font-weight-medium);
  font-size: var(--font-size-50);
  line-height: 0.47;
  letter-spacing: 2.5px;
}

.fcz-title-40 {
  font-family: var(--font-family-unbounded);
  font-size: var(--font-size-40);
  line-height: 1.12;
  letter-spacing: 2px;
}

.fcz-intro {
  font-family: var(--font-family-unbounded);
  font-size: var(--font-size-30);
  line-height: 1.2;
  letter-spacing: 1.5px;
}

.fcz-extra-light {
  font-weight: var(--font-weight-extra-light);
}

.fcz-medium {
  font-weight: var(--font-weight-medium);
}

.fcz-bold {
  font-weight: var(--font-weight-bold);
}

.fcz-red {
  color: var(--color-red);
}

.fcz-beige {
  color: var(--color-beige);
}

.fcz-white {
  color: var(--color-white);
}

.fcz-green-light {
  color: var(--color-green-light);
}

.fcz-green-bg {
  background-color: var(--color-green);
}

.fcz-green-light-bg {
  background-color: var(--color-green-light);
}
/* GENERAL */

/* HEADER */
.fcz-header {
  background-color: var(--color-green);
  height: 138px;
  padding: 47px 0 14px 49px;
}

.fcz-header-home-link img {
  max-height: 77px;
}

/* HEADER */

/* FOOTER */
.fcz-footer {
  background-color: var(--color-green);
  padding-top: 82px;
  padding-bottom: 26px;
}

.fcz-footer-logo {
  max-height: 78px;
}

.fcz-footer-links {
  font-family: var(--font-family-acumin);
  font-style: var(--font-style-italic);
  font-size: var(--font-size-14);
  margin-top: 38px;
  color: var(--color-white);
}

.fcz-footer-links a {
  color: var(--color-white);
}
/* FOOTER */

/* HOME */
.fcz-separator {
  width: 4px;
  height: 191px;
  background-color: var(--color-red);
}

.fcz-banner-intro {
  font-size: var(--font-size-18);
  font-family: var(--font-family-unbounded);
  font-weight: var(--font-weight-medium);
  letter-spacing: 0.9px;
  line-height: 1.3;
  padding-bottom: 24px;
}

.fcz-expert-banner {
  background-image: url("assets/images/fcz-banner-expert.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 639px;
  width: 100%;
}

.fcz-expert-banner-title {
  background-color: var(--color-white);
  border-radius: 0 15px 0 0;
  padding: 62px 128px 0 178px;
  text-transform: uppercase;
  font-family: var(--font-family-unbounded);
  font-size: var(--font-size-50);
  font-weight: var(--font-weight-medium);
  letter-spacing: 2.5px;
  line-height: 1;
}

.fcz-expert {
  padding-top: 98px;
  padding-bottom: 165px;
}

.fcz-expert-section {
  overflow-x: hidden;
  padding: 60px 0;
}

.fcz-expert-section {
  overflow-x: hidden;
  padding: 80px 0;
  position: relative;
}

.fcz-expert-nav {
  border: none;
}

.fcz-expert-tab-link {
  background: transparent !important;
  border: none !important;
  text-align: left;
  padding: 22px 26px 10px 27px;
  color: var(--color-green) !important;
  text-transform: uppercase;
  font-family: var(--font-family-unbounded);
  font-size: var(--font-size-18);
  font-weight: var(--font-weight-medium);
  letter-spacing: 0.9px;
  line-height: 1.3;
  position: relative;
  margin-bottom: 20px;
  transition: all 0.3s ease;
  width: fit-content;
  display: block;
}

.fcz-expert-tab-link.active {
  background-color: rgba(0, 60, 66, 0.07) !important;
  color: #1a3b34 !important;
}

.fcz-expert-tab-link.active::after {
  content: "";
  position: absolute;
  right: -25px;
  top: 0;
  width: 0;
  height: 0;
  border-top: 50px solid transparent;
  border-bottom: 50px solid transparent;
  border-left: 25px solid rgba(0, 60, 66, 0.07);
  z-index: 2;
}

.fcz-expert-main-pane {
  position: relative;
}

.fcz-expert-role-box-absolute {
  position: absolute;
  left: -40%;
  bottom: 0;
  width: 280px;
  text-align: right;
}

.fcz-expert-role-badge {
  background-color: var(--color-red);
  color: var(--color-white);
  padding: 7px 10px;
  text-transform: uppercase;
  font-family: var(--font-family-unbounded);
  font-size: var(--font-size-18);
  font-style: var(--font-weight-medium);
  letter-spacing: 0.9px;
  line-height: 1.3;
  display: inline-block;
  margin-bottom: 10px;
}

.fcz-expert-role-content {
  font-size: var(--font-size-18);
  line-height: 1.3;
  letter-spacing: 0.9px;
}

.fcz-expert-separator-line {
  width: 4px;
  background-color: var(--color-green-light);
  height: 100%;
  min-height: 450px;
}

.fcz-expert-main-title {
  font-family: var(--font-family-unbounded);
  font-size: var(--font-size-30);
  letter-spacing: 1.5px;
  line-height: 1.2;
  margin-bottom: 20px;
  max-width: 90%;
}

.fcz-expert-intro-text {
  font-size: 16px;
  color: #1a3b34;
  margin-bottom: 40px;
}

.fcz-expert-slider-outer {
  margin-right: -50vw;
  padding-right: 50vw;
}

.fcz-expert-card {
  border: 1px solid var(--color-red);
  border-radius: 15px;
  padding: 60px 52px 65px 52px;
  height: 100%;
  min-height: 296px;
  display: flex;
  flex-direction: column;
  background: transparent;
  margin-right: 20px;
}

.fcz-expert-card-title {
  font-family: var(--font-family-unbounded);
  font-size: var(--font-size-18);
  font-weight: var(--font-weight-medium);
  letter-spacing: 0.9px;
  line-height: 1.27;
  margin-bottom: 17px;
}

.fcz-expert-card-body {
  font-size: var(--font-size-18);
  font-weight: var(--font-weight-extra-light);
  letter-spacing: 0.9px;
  line-height: 1.27;
}

.fcz-why-title {
  background-color: var(--color-green-light);
  color: var(--color-green);
  text-transform: uppercase;
  font-family: var(--font-family-unbounded);
  font-weight: var(--font-weight-medium);
  font-size: var(--font-size-18);
  letter-spacing: 0.9px;
  line-height: 1.27;
  display: inline-block;
  padding: 7px 10px;
}

.fcz-why-content {
  line-height: 1.25;
}

.fcz-why-image {
  position: relative;
}

.fcz-why-conclusion {
  font-weight: var(--font-weight-medium);
  font-style: var(--font-style-italic);
  position: absolute;
  bottom: 45px;
  left: 73px;
}

.fcz-who {
  padding-block: 160px;
}

.fcz-separator-who {
  background-color: var(--color-red);
  height: 284px;
  width: 4px;
}

.fcz-who-item-picto {
  height: 67px;
  width: 66px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 52px;
  flex-shrink: 0;
}

.fcz-who-item-picto img {
  max-height: 100%;
  max-width: 100%;
  width: auto;
  height: auto;
  display: block;
}

.fcz-who-item-title {
  font-family: var(--font-family-unbounded);
  font-weight: var(--font-weight-medium);
}

.fcz-who-item-content p {
  margin-bottom: 0;
}

.fcz-approach-title {
  background-color: var(--color-green);
  color: var(--color-green-light);
  text-transform: uppercase;
  font-family: var(--font-family-unbounded);
  font-weight: var(--font-weight-medium);
  font-size: var(--font-size-18);
  letter-spacing: 0.9px;
  line-height: 1.27;
  display: inline-block;
  padding: 7px 10px;
}

.fcz-approach-content {
  line-height: 1.5;
}

.fcz-approach-content strong {
  font-weight: var(--font-weight-bold);
  font-style: var(--font-style-italic);
}

.fcz-contact {
  padding-top: 134px;
  padding-bottom: 150px;
}

.fcz-contact-intro {
  font-family: var(--font-family-unbounded);
  font-size: var(--font-size-18);
  font-weight: var(--font-weight-medium);
  letter-spacing: 0.9px;
  line-height: 1.3;
}

.fcz-contact-separator {
  background-color: var(--color-red);
  width: 4px;
  height: 382px;
}

.wpcf7 input[type="text"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="email"],
.wpcf7-select,
.wpcf7 textarea {
  width: 100%;
}

::placeholder,
textarea,
label,
select {
  font-family: var(--font-family-acumin);
  color: var(--color-green);
  font-size: var(--font-size-base);
  line-height: 1.25;
  letter-spacing: 1px;
}

.wpcf7 input[type="text"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="email"],
.wpcf7-form textarea,
.wpcf7-form select {
  border: none;
  background-color: transparent;
  border-bottom: 1px solid var(--color-red);
  padding-bottom: 18px;
  outline: none !important;
}

.qb-home-contact input[type="text"],
.qb-home-contact input[type="email"],
.qb-home-contact input[type="tel"],
.qb-home-contact textarea {
  color: var(--color-green) !important;
}

textarea {
  height: 97px;
}

.wpcf7-form input.wpcf7-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: transparent;
  border: 1px solid var(--color-green);
  border-radius: 21px;
  font-family: var(--font-family-acumin);
  color: var(--color-green);
  padding: 10px 30px;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.wpcf7-form input.wpcf7-submit:hover {
  background-color: var(--color-green);
  color: var(--color-white);
}

/* HOME */
