@charset "UTF-8";
@import url(main.css);
a#maps-url { border-radius: 0px !important; }

.logo-footer > .logo_nav { height: 10vh !important; }

.spacer { display: none !important; }

.container.m-4.mx-auto { margin-top: 80px !important; }

/* ================================================== NAVIGATION AVANT LE SCROLL ================================================== */
.navbar { background-color: transparent !important; box-shadow: none !important; transition: background-color 0.3s ease, box-shadow 0.3s ease, backdrop-filter 0.3s ease; }

.navbar .nav-link, .navbar .nav-link span, .navbar .animated-border-button, .navbar .animated-border-button span, .navbar .navbar-nav a, .navbar .navbar-nav a span { color: #ffffff !important; transition: color 0.3s ease; }

.animated-border-button::after { background-color: #ffffff; }

/* ================================================== NAVIGATION APRÈS LE SCROLL ================================================== */
.navbar.scrolled { background-color: rgba(252, 252, 252, 0.92) !important; backdrop-filter: blur(16px); box-shadow: 0 2px 5px rgba(19, 57, 72, 0.2) !important; }

.navbar.scrolled .nav-link, .navbar.scrolled .nav-link span, .navbar.scrolled .animated-border-button, .navbar.scrolled .animated-border-button span, .navbar.scrolled .navbar-nav a, .navbar.scrolled .navbar-nav a span { color: #133948 !important; }

.navbar.scrolled .animated-border-button::after, .animated-border-button.scrolled::after { background-color: #db1132; }

/* ================================================== BOUTON DU HEADER ================================================== */
a.grow.button_header { position: relative; z-index: 1; padding: 0.75rem 1rem !important; overflow: hidden; border: 1px solid #ffffff !important; border-radius: 0 !important; background-color: #db1132 !important; color: #ffffff !important; transition: color 0.8s ease, border-color 0.8s ease, transform 0.8s ease; }

a.grow.button_header::after { content: ""; position: absolute; top: 0; left: -50px; z-index: -1; width: 0; height: 100%; background-color: #ffffff; transform: skewX(45deg); transition: width 0.8s ease; }

a.grow.button_header:hover { border-color: #db1132 !important; color: #db1132 !important; transform: scale(1) !important; }

a.grow.button_header:hover::after { width: 250%; }

.navbar a.grow.button_header, .navbar a.grow.button_header span, .navbar.scrolled a.grow.button_header, .navbar.scrolled a.grow.button_header span { color: #ffffff !important; }

.navbar a.grow.button_header:hover, .navbar a.grow.button_header:hover span, .navbar.scrolled a.grow.button_header:hover, .navbar.scrolled a.grow.button_header:hover span { color: #db1132 !important; }

/*-----------------------------------------------------------------------HERO----------------------------------------------------------------------------------------*/
.charles-hero { position: relative; display: flex; align-items: center; min-height: 520px; overflow: hidden; background-color: #111111; }

.charles-hero__background { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }

.charles-hero__overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(5, 8, 10, 0.88) 0%, rgba(5, 8, 10, 0.68) 34%, rgba(5, 8, 10, 0.2) 63%, rgba(5, 8, 10, 0.04) 100%); }

.charles-hero__container { position: relative; z-index: 2; width: 100%; max-width: 1320px; margin: 0 auto; padding: 80px 50px; }

.charles-hero__content { max-width: 620px; }

.charles-hero__logo { display: block; width: 170px; height: auto; margin-bottom: 22px; object-fit: contain; }

.charles-hero__eyebrow { margin: 0 0 16px; color: #ffffff; font-size: 13px; font-weight: 700; line-height: 1.4; letter-spacing: 1.6px; text-transform: uppercase; }

.charles-hero__title { margin: 0; color: #ffffff; font-size: 48px; font-weight: 700; line-height: 1.12; letter-spacing: -1px; text-shadow: 0 3px 16px rgba(0, 0, 0, 0.35); }

.charles-hero__button { display: inline-flex; align-items: center; justify-content: center; min-height: 45px; margin-top: 30px; padding: 0 24px; border: 1px solid rgba(255, 255, 255, 0.9); color: #ffffff !important; background-color: rgba(0, 0, 0, 0.12); font-size: 12px; font-weight: 700; letter-spacing: 0.8px; text-decoration: none; text-transform: uppercase; transition: background-color 0.3s ease, color 0.3s ease; }

.charles-hero__button:hover { color: #111111 !important; background-color: #ffffff; }

@media screen and (max-width: 900px) { .charles-hero { min-height: 500px; } .charles-hero__background { object-position: 62% center; } .charles-hero__overlay { background: linear-gradient(90deg, rgba(5, 8, 10, 0.9) 0%, rgba(5, 8, 10, 0.72) 48%, rgba(5, 8, 10, 0.25) 100%); } .charles-hero__container { padding: 70px 30px; } .charles-hero__content { max-width: 520px; } .charles-hero__logo { width: 145px; } .charles-hero__title { font-size: 39px; } }

@media screen and (max-width: 600px) { .charles-hero { align-items: flex-end; min-height: 590px; } .charles-hero__background { object-position: 66% center; } .charles-hero__overlay { background: linear-gradient(180deg, rgba(5, 8, 10, 0.15) 0%, rgba(5, 8, 10, 0.48) 42%, rgba(5, 8, 10, 0.94) 100%); } .charles-hero__container { padding: 50px 22px; } .charles-hero__logo { width: 125px; margin-bottom: 18px; } .charles-hero__eyebrow { margin-bottom: 12px; font-size: 11px; } .charles-hero__title { font-size: 33px; line-height: 1.15; letter-spacing: -0.5px; } .charles-hero__button { min-height: 43px; margin-top: 24px; padding: 0 19px; font-size: 11px; } }

/*-----------------------------------------------------------------------INTRO----------------------------------------------------------------------------------------*/
.charles-about-block { padding: 80px 0; background-color: #f7f7f7; }

.charles-about-block * { box-sizing: border-box; }

.charles-about-block__container { display: flex; align-items: center; gap: 44px; max-width: 1380px; margin: 0 auto; padding: 0 32px; }

.charles-about-block__media { flex: 0 0 50%; }

.charles-about-block__image { display: block; width: 100%; height: 560px; border-radius: 0; object-fit: cover; object-position: center; box-shadow: 0 16px 40px rgba(0, 0, 0, 0.12); }

.charles-about-block__content { flex: 1 1 auto; }

.charles-about-block__eyebrow { margin: 0 0 12px; color: #e30613; font-size: 13px; font-weight: 700; line-height: 1.4; letter-spacing: 1.4px; text-transform: uppercase; }

.charles-about-block__title { margin: 0 0 22px; color: #111111; font-size: 46px; font-weight: 700; line-height: 1.08; letter-spacing: -1px; }

.charles-about-block__text { margin: 0 0 16px; color: #4b4b4b; font-size: 16px; font-weight: 400; line-height: 1.75; }

.charles-about-block__text:last-child { margin-bottom: 0; }

@media screen and (max-width: 1100px) { .charles-about-block { padding: 70px 0; } .charles-about-block__container { gap: 30px; padding: 0 24px; } .charles-about-block__media { flex: 0 0 48%; } .charles-about-block__image { height: 520px; } .charles-about-block__title { font-size: 38px; } }

@media screen and (max-width: 768px) { .charles-about-block { padding: 56px 0; } .charles-about-block__container { flex-direction: column; align-items: stretch; gap: 30px; padding: 0 20px; } .charles-about-block__media { flex: none; width: 100%; } .charles-about-block__image { width: 100%; height: 420px; border-radius: 0; } .charles-about-block__title { font-size: 31px; letter-spacing: -0.5px; } .charles-about-block__text { font-size: 15px; line-height: 1.7; } }

@media screen and (max-width: 480px) { .charles-about-block { padding: 45px 0; } .charles-about-block__container { padding: 0 16px; } .charles-about-block__image { height: 320px; } .charles-about-block__title { font-size: 28px; } }

/*-----------------------------------------------------------------------SERVICES----------------------------------------------------------------------------------------*/
.charles-services { width: 100%; overflow: hidden; background-color: #080a0d; font-family: Arial, sans-serif; }

.charles-services * { box-sizing: border-box; }

.charles-services__tabs-wrapper { position: relative; background-color: #080a0d; }

.charles-services__tabs { display: grid; grid-template-columns: repeat(6, 1fr); width: 100%; background-color: #080a0d; }

.charles-services__tab { position: relative; display: flex; align-items: center; justify-content: center; gap: 18px; min-height: 150px; padding: 25px 18px; border: 0; border-right: 1px solid rgba(255, 255, 255, 0.07); color: #ffffff; background-color: transparent; font-family: inherit; text-align: left; cursor: pointer; transition: background-color 0.3s ease, color 0.3s ease; }

.charles-services__tab:last-child { border-right: 0; }

.charles-services__tab::after { position: absolute; bottom: 0; left: 0; width: 100%; height: 3px; background-color: #e30613; content: ""; opacity: 0; transform: scaleX(0); transition: opacity 0.3s ease, transform 0.3s ease; }

.charles-services__tab:hover, .charles-services__tab.is-active { background-color: #202024; }

.charles-services__tab.is-active::after { opacity: 1; transform: scaleX(1); }

.charles-services__tab-icon { display: flex; flex: 0 0 46px; align-items: center; justify-content: center; width: 46px; height: 46px; }

.charles-services__tab-icon svg { width: 42px; height: 42px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }

.charles-services__tab-title { font-size: 14px; font-weight: 500; line-height: 1.35; }

.charles-services__arrow { display: none; }

.charles-services__panel { position: relative; display: flex; align-items: center; min-height: 540px; overflow: hidden; background-color: #222328; }

.charles-services__image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; transition: opacity 0.25s ease; }

.charles-services__image.is-changing { opacity: 0; }

.charles-services__image-overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(5, 7, 10, 0.97) 0%, rgba(5, 7, 10, 0.86) 34%, rgba(5, 7, 10, 0.42) 62%, rgba(5, 7, 10, 0.66) 100%); }

.charles-services__content { position: relative; z-index: 2; width: 58%; max-width: 760px; padding: 80px 65px; }

.charles-services__eyebrow { margin: 0 0 18px; color: #e30613; font-size: 13px; font-weight: 700; line-height: 1.4; letter-spacing: 1.8px; text-transform: uppercase; }

.charles-services__title { max-width: 650px; margin: 0; color: #ffffff; font-size: 52px; font-weight: 700; line-height: 1.06; letter-spacing: -1.5px; transition: opacity 0.2s ease, transform 0.2s ease; }

.charles-services__description { max-width: 650px; margin: 26px 0 0; color: rgba(255, 255, 255, 0.78); font-size: 17px; font-weight: 400; line-height: 1.75; transition: opacity 0.2s ease, transform 0.2s ease; }

.charles-services__button { display: inline-flex; align-items: center; justify-content: center; gap: 14px; min-height: 48px; margin-top: 32px; padding: 0 24px; border: 1px solid #ffffff; color: #ffffff !important; background-color: transparent; font-size: 12px; font-weight: 700; line-height: 1; letter-spacing: 0.8px; text-decoration: none; text-transform: uppercase; transition: color 0.3s ease, background-color 0.3s ease, border-color 0.3s ease; }

.charles-services__button span { font-size: 18px; transition: transform 0.3s ease; }

.charles-services__button:hover { border-color: #e30613; color: #ffffff !important; background-color: #e30613; }

.charles-services__button:hover span { transform: translateX(4px); }

.charles-services__highlight { position: absolute; z-index: 2; top: 50%; right: 6%; display: flex; flex-direction: column; justify-content: center; width: 220px; min-height: 230px; padding: 32px; background-color: #e30613; transform: translateY(-50%); }

.charles-services__highlight-number { color: #ffffff; font-size: 54px; font-weight: 700; line-height: 1; transition: opacity 0.2s ease, transform 0.2s ease; }

.charles-services__highlight-line { width: 45px; height: 2px; margin: 22px 0; background-color: rgba(255, 255, 255, 0.7); }

.charles-services__highlight-text { margin: 0; color: #ffffff; font-size: 16px; font-weight: 500; line-height: 1.45; }

.charles-services__title.is-changing, .charles-services__description.is-changing, .charles-services__highlight-number.is-changing { opacity: 0; transform: translateY(8px); }

@media screen and (max-width: 1150px) { .charles-services__tabs { grid-template-columns: repeat(3, 1fr); } .charles-services__tab { min-height: 125px; border-bottom: 1px solid rgba(255, 255, 255, 0.07); } .charles-services__content { width: 68%; padding: 70px 40px; } .charles-services__title { font-size: 44px; } .charles-services__highlight { right: 35px; width: 190px; min-height: 210px; padding: 26px; } }

@media screen and (max-width: 760px) { .charles-services__tabs-wrapper { padding: 0 46px; } .charles-services__tabs { display: flex; overflow-x: auto; scroll-behavior: smooth; scroll-snap-type: x mandatory; scrollbar-width: none; } .charles-services__tabs::-webkit-scrollbar { display: none; } .charles-services__tab { flex: 0 0 190px; min-height: 112px; padding: 20px 15px; scroll-snap-align: center; } .charles-services__tab-icon { flex-basis: 38px; width: 38px; height: 38px; } .charles-services__tab-icon svg { width: 35px; height: 35px; } .charles-services__arrow { position: absolute; z-index: 5; top: 50%; display: flex; align-items: center; justify-content: center; width: 38px; height: 46px; padding: 0; border: 1px solid rgba(255, 255, 255, 0.18); color: #ffffff; background-color: rgba(8, 10, 13, 0.94); cursor: pointer; transform: translateY(-50%); transition: opacity 0.3s ease, background-color 0.3s ease, border-color 0.3s ease; } .charles-services__arrow svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } .charles-services__arrow--previous { left: 5px; } .charles-services__arrow--next { right: 5px; } .charles-services__arrow:hover { border-color: #e30613; background-color: #e30613; } .charles-services__arrow:disabled { opacity: 0.3; cursor: default; } .charles-services__arrow:disabled:hover { border-color: rgba(255, 255, 255, 0.18); background-color: rgba(8, 10, 13, 0.94); } .charles-services__panel { align-items: flex-end; min-height: 650px; } .charles-services__image { object-position: 62% center; } .charles-services__image-overlay { background: linear-gradient(180deg, rgba(5, 7, 10, 0.2) 0%, rgba(5, 7, 10, 0.55) 40%, rgba(5, 7, 10, 0.97) 100%); } .charles-services__content { width: 100%; max-width: none; padding: 205px 22px 42px; } .charles-services__eyebrow { font-size: 11px; } .charles-services__title { font-size: 36px; letter-spacing: -0.7px; } .charles-services__description { margin-top: 20px; font-size: 15px; line-height: 1.65; } .charles-services__button { width: 100%; margin-top: 26px; padding: 0 16px; } .charles-services__highlight { top: 24px; right: 22px; width: 130px; min-height: 130px; padding: 20px; transform: none; } .charles-services__highlight-number { font-size: 36px; } .charles-services__highlight-line { width: 32px; margin: 13px 0; } .charles-services__highlight-text { font-size: 11px; line-height: 1.35; } }

@media screen and (max-width: 480px) { .charles-services__tabs-wrapper { padding: 0 40px; } .charles-services__tab { flex-basis: 170px; min-height: 106px; gap: 12px; padding: 18px 12px; } .charles-services__tab-title { font-size: 12px; } .charles-services__arrow { width: 34px; height: 42px; } .charles-services__arrow--previous { left: 3px; } .charles-services__arrow--next { right: 3px; } .charles-services__panel { min-height: 620px; } .charles-services__content { padding: 190px 18px 34px; } .charles-services__title { font-size: 31px; line-height: 1.1; } .charles-services__description { font-size: 14px; line-height: 1.6; } .charles-services__highlight { top: 18px; right: 16px; width: 116px; min-height: 116px; padding: 16px; } .charles-services__highlight-number { font-size: 31px; } .charles-services__highlight-line { margin: 10px 0; } .charles-services__highlight-text { font-size: 10px; } }

/*-----------------------------------------------------------------------POURQUOI----------------------------------------------------------------------------------------*/
.charles-why { padding: 90px 0; overflow: hidden; background-color: #ffffff; }

.charles-why * { box-sizing: border-box; }

.charles-why__container { max-width: 1380px; margin: 0 auto; padding: 0 32px; }

.charles-why__header { max-width: 780px; margin: 0 auto; text-align: center; }

.charles-why__eyebrow { margin: 0 0 12px; color: #e30613; font-size: 13px; font-weight: 700; line-height: 1.4; letter-spacing: 1.5px; text-transform: uppercase; }

.charles-why__title { margin: 0; color: #171717; font-size: 46px; font-weight: 700; line-height: 1.1; letter-spacing: -1px; }

.charles-why__line { display: block; width: 44px; height: 3px; margin: 20px auto 24px; background-color: #e30613; }

.charles-why__intro-title { margin: 0 0 10px; color: #232323; font-size: 22px; font-weight: 700; line-height: 1.3; }

.charles-why__intro-text { max-width: 690px; margin: 0 auto; color: #656565; font-size: 16px; font-weight: 400; line-height: 1.75; }

.charles-why__visual { display: flex; align-items: center; justify-content: center; width: 100%; margin: 15px auto 42px; }

.charles-why__image { display: block; width: 100%; max-width: 1080px; height: 420px; object-fit: contain; object-position: center; }

.charles-why__features { display: grid; grid-template-columns: repeat(3, 1fr); gap: 38px; max-width: 1180px; margin: 0 auto; }

.charles-why__feature { display: flex; align-items: flex-start; gap: 17px; min-width: 0; }

.charles-why__icon { display: flex; flex: 0 0 56px; align-items: center; justify-content: center; width: 56px; height: 56px; background-color: #f1c40f; }

.charles-why__icon svg { width: 27px; height: 27px; fill: none; stroke: #171717; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.charles-why__feature-content { flex: 1 1 auto; min-width: 0; }

.charles-why__feature-title { margin: 0 0 9px; color: #1c1c1c; font-size: 21px; font-weight: 700; line-height: 1.25; }

.charles-why__feature-text { margin: 0; color: #666666; font-size: 14px; font-weight: 400; line-height: 1.65; }

@media screen and (max-width: 1000px) { .charles-why { padding: 75px 0; } .charles-why__container { padding: 0 24px; } .charles-why__title { font-size: 39px; } .charles-why__visual { margin: 12px auto 38px; } .charles-why__image { max-width: 920px; height: 360px; } .charles-why__features { gap: 24px; } .charles-why__feature { flex-direction: column; } }

@media screen and (max-width: 768px) { .charles-why { padding: 58px 0; } .charles-why__container { padding: 0 20px; } .charles-why__eyebrow { font-size: 11px; } .charles-why__title { font-size: 32px; letter-spacing: -0.5px; } .charles-why__intro-title { font-size: 20px; } .charles-why__intro-text { font-size: 15px; line-height: 1.7; } .charles-why__visual { margin: 10px auto 35px; } .charles-why__image { max-width: 100%; height: 280px; } .charles-why__features { grid-template-columns: 1fr; gap: 28px; } .charles-why__feature { flex-direction: row; } }

@media screen and (max-width: 480px) { .charles-why { padding: 48px 0; } .charles-why__container { padding: 0 16px; } .charles-why__title { font-size: 28px; } .charles-why__line { margin: 17px auto 21px; } .charles-why__visual { margin: 8px auto 32px; } .charles-why__image { height: 220px; } .charles-why__feature { gap: 14px; } .charles-why__icon { flex-basis: 50px; width: 50px; height: 50px; } .charles-why__icon svg { width: 24px; height: 24px; } .charles-why__feature-title { font-size: 19px; } .charles-why__feature-text { font-size: 13px; } }

/*-----------------------------------------------------------------------CTA----------------------------------------------------------------------------------------*/
.charles-video-cta { position: relative; overflow: hidden; min-height: 560px; background-color: #111111; }

.charles-video-cta * { box-sizing: border-box; }

.charles-video-cta__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }

.charles-video-cta__overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(10, 10, 10, 0.88) 0%, rgba(10, 10, 10, 0.74) 34%, rgba(10, 10, 10, 0.38) 62%, rgba(10, 10, 10, 0.16) 100%); }

.charles-video-cta__container { position: relative; z-index: 2; max-width: 1280px; margin: 0 auto; padding: 90px 32px; }

.charles-video-cta__content { max-width: 520px; }

.charles-video-cta__eyebrow { margin: 0 0 10px; color: #ffffff; font-size: 13px; font-weight: 700; line-height: 1.4; letter-spacing: 1.4px; text-transform: uppercase; }

.charles-video-cta__title { margin: 0; color: #ffffff; font-size: 46px; font-weight: 700; line-height: 1.08; letter-spacing: -1px; }

.charles-video-cta__line { display: block; width: 42px; height: 2px; margin: 18px 0 22px; background-color: #e30613; }

.charles-video-cta__subtitle { margin: 0 0 18px; color: #f1f1f1; font-size: 21px; font-weight: 700; line-height: 1.35; }

.charles-video-cta__text { margin: 0; color: rgba(255, 255, 255, 0.78); font-size: 15px; font-weight: 400; line-height: 1.8; }

.charles-video-cta__button { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; margin-top: 28px; padding: 0 26px; border: 1px solid #e30613; border-radius: 0; color: #ffffff !important; background-color: transparent; font-size: 12px; font-weight: 700; line-height: 1; letter-spacing: 1.1px; text-decoration: none; text-transform: uppercase; transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease; }

.charles-video-cta__button:hover { color: #ffffff !important; border-color: #e30613; background-color: #e30613; }

@media screen and (max-width: 900px) { .charles-video-cta { min-height: 500px; } .charles-video-cta__container { padding: 72px 24px; } .charles-video-cta__title { font-size: 39px; } .charles-video-cta__subtitle { font-size: 19px; } }

@media screen and (max-width: 768px) { .charles-video-cta { min-height: 520px; } .charles-video-cta__video { object-position: center; } .charles-video-cta__overlay { background: linear-gradient(180deg, rgba(10, 10, 10, 0.34) 0%, rgba(10, 10, 10, 0.56) 34%, rgba(10, 10, 10, 0.9) 100%); } .charles-video-cta__container { padding: 56px 20px; } .charles-video-cta__content { max-width: none; } .charles-video-cta__eyebrow { font-size: 11px; } .charles-video-cta__title { font-size: 31px; letter-spacing: -0.5px; } .charles-video-cta__subtitle { font-size: 18px; } .charles-video-cta__text { font-size: 14px; line-height: 1.7; } }

@media screen and (max-width: 480px) { .charles-video-cta { min-height: 500px; } .charles-video-cta__container { padding: 46px 16px; } .charles-video-cta__title { font-size: 27px; } .charles-video-cta__line { margin: 16px 0 18px; } .charles-video-cta__subtitle { font-size: 17px; } .charles-video-cta__button { min-height: 44px; padding: 0 22px; font-size: 11px; } }

/*-----------------------------------------------------------------------HERO PAGE----------------------------------------------------------------------------------------*/
.charles-forest-hero { position: relative; overflow: hidden; min-height: 520px; background-color: #111111; }

.charles-forest-hero * { box-sizing: border-box; }

.charles-forest-hero__bg { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }

.charles-forest-hero__overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(8, 18, 20, 0.72) 0%, rgba(8, 18, 20, 0.52) 34%, rgba(8, 18, 20, 0.28) 62%, rgba(8, 18, 20, 0.2) 100%); }

.charles-forest-hero__container { position: relative; z-index: 2; display: flex; align-items: center; width: 100%; min-height: 520px; max-width: 1400px; margin: 0 auto; padding: 60px 50px; }

.charles-forest-hero__content { width: 100%; max-width: 720px; }

.charles-forest-hero__logo { display: block; width: 190px; height: auto; margin: 0 0 24px; object-fit: contain; }

.charles-forest-hero__title { margin: 0; color: #ffffff; font-size: 48px; font-weight: 600; line-height: 1.1; letter-spacing: -1px; text-transform: uppercase; }

@media screen and (max-width: 1100px) { .charles-forest-hero, .charles-forest-hero__container { min-height: 470px; } .charles-forest-hero__container { padding: 50px 32px; } .charles-forest-hero__content { max-width: 650px; } .charles-forest-hero__logo { width: 170px; margin-bottom: 20px; } .charles-forest-hero__title { font-size: 41px; } }

@media screen and (max-width: 768px) { .charles-forest-hero, .charles-forest-hero__container { min-height: 430px; } .charles-forest-hero__container { align-items: flex-end; padding: 40px 20px; } .charles-forest-hero__overlay { background: linear-gradient(180deg, rgba(8, 18, 20, 0.18) 0%, rgba(8, 18, 20, 0.42) 42%, rgba(8, 18, 20, 0.78) 100%); } .charles-forest-hero__content { max-width: 100%; } .charles-forest-hero__logo { width: 150px; margin-bottom: 18px; } .charles-forest-hero__title { font-size: 32px; line-height: 1.12; letter-spacing: -0.6px; } }

@media screen and (max-width: 480px) { .charles-forest-hero, .charles-forest-hero__container { min-height: 390px; } .charles-forest-hero__container { padding: 32px 16px; } .charles-forest-hero__logo { width: 135px; margin-bottom: 16px; } .charles-forest-hero__title { font-size: 26px; letter-spacing: -0.4px; } }

/*-----------------------------------------------------------------------REDIRECTION----------------------------------------------------------------------------------------*/
.charles-service-links { padding: 55px 0; background-color: #ffffff; }

.charles-service-links * { box-sizing: border-box; }

.charles-service-links__container { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; width: 100%; max-width: 1250px; margin: 0 auto; padding: 0 30px; }

.charles-service-links__card { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 170px; padding: 24px 16px; border: 1px solid #dedede; color: #4a4f58; background-color: #ffffff; text-align: center; text-decoration: none; transition: border-color 0.3s ease, background-color 0.3s ease, color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease; }

.charles-service-links__icon { display: flex; align-items: center; justify-content: center; width: 62px; height: 52px; margin-bottom: 14px; }

.charles-service-links__icon svg { width: 58px; height: 58px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }

.charles-service-links__title { color: inherit; font-size: 14px; font-weight: 500; line-height: 1.35; }

.charles-service-links__card:hover { border-color: #e30613; color: #e30613; background-color: #fafafa; box-shadow: 0 12px 28px rgba(0, 0, 0, 0.1); transform: translateY(-6px); }

.charles-service-links__card:focus-visible { outline: 2px solid #e30613; outline-offset: 3px; }

@media screen and (max-width: 1050px) { .charles-service-links__container { grid-template-columns: repeat(3, 1fr); padding: 0 24px; } }

@media screen and (max-width: 700px) { .charles-service-links { padding: 42px 0; } .charles-service-links__container { grid-template-columns: repeat(2, 1fr); gap: 12px; padding: 0 18px; } .charles-service-links__card { min-height: 155px; padding: 20px 12px; } .charles-service-links__title { font-size: 13px; } }

@media screen and (max-width: 440px) { .charles-service-links__container { grid-template-columns: 1fr; padding: 0 16px; } .charles-service-links__card { min-height: 135px; } }

/*-----------------------------------------------------------------------ENTRETIEN----------------------------------------------------------------------------------------*/
.charles-maintenance { width: 100%; overflow: hidden; background-color: #ffffff; }

.charles-maintenance * { box-sizing: border-box; }

.charles-maintenance__layout { display: grid; grid-template-columns: 58% 42%; width: 100%; min-height: 690px; }

.charles-maintenance__left { display: grid; grid-template-rows: 1fr 275px; min-width: 0; background-color: #031018; }

.charles-maintenance__heading { display: flex; flex-direction: column; justify-content: center; padding: 58px 62px 48px; }

.charles-maintenance__eyebrow { margin: 0 0 8px; color: rgba(255, 255, 255, 0.58); font-size: 13px; font-weight: 500; line-height: 1.45; letter-spacing: 0.3px; }

.charles-maintenance__title { max-width: 610px; margin: 0; color: #ffffff; font-size: 43px; font-weight: 600; line-height: 1.08; letter-spacing: 0.5px; text-transform: uppercase; }

.charles-maintenance__intro { max-width: 520px; margin: 16px 0 0; color: rgba(255, 255, 255, 0.62); font-size: 14px; font-weight: 400; line-height: 1.55; }

.charles-maintenance__stats { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 55px; }

.charles-maintenance__stat { min-width: 0; padding: 0 22px; border-left: 2px solid rgba(255, 255, 255, 0.28); }

.charles-maintenance__stat:first-child { padding-left: 0; border-left: 0; }

.charles-maintenance__stat-label { display: block; margin-bottom: 7px; color: rgba(255, 255, 255, 0.54); font-size: 12px; font-weight: 400; line-height: 1.35; }

.charles-maintenance__stat-value { display: block; color: #ffffff; font-size: 22px; font-weight: 700; line-height: 1.15; }

.charles-maintenance__visual { position: relative; width: 100%; height: 275px; overflow: hidden; }

.charles-maintenance__image { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 58%; }

.charles-maintenance__right { display: flex; flex-direction: column; justify-content: center; gap: 42px; padding: 58px 72px; background-color: #ffffff; }

.charles-maintenance__service { max-width: 460px; }

.charles-maintenance__service-title { margin: 0 0 9px; color: #171717; font-size: 23px; font-weight: 700; line-height: 1.2; }

.charles-maintenance__service-text { margin: 0; color: #686868; font-size: 14px; font-weight: 400; line-height: 1.55; }

@media screen and (max-width: 1100px) { .charles-maintenance__layout { grid-template-columns: 56% 44%; } .charles-maintenance__left { grid-template-rows: 1fr 245px; } .charles-maintenance__heading { padding: 52px 38px 44px; } .charles-maintenance__title { font-size: 36px; } .charles-maintenance__stats { margin-top: 45px; } .charles-maintenance__stat { padding: 0 13px; } .charles-maintenance__stat-value { font-size: 18px; } .charles-maintenance__visual { height: 245px; } .charles-maintenance__right { gap: 34px; padding: 52px 40px; } .charles-maintenance__service-title { font-size: 21px; } }

@media screen and (max-width: 850px) { .charles-maintenance__layout { grid-template-columns: 1fr; } .charles-maintenance__left { grid-template-rows: auto 300px; } .charles-maintenance__heading { padding: 58px 28px 48px; } .charles-maintenance__visual { height: 300px; } .charles-maintenance__right { display: grid; grid-template-columns: repeat(2, 1fr); gap: 34px; padding: 58px 28px; } }

@media screen and (max-width: 600px) { .charles-maintenance__left { grid-template-rows: auto 220px; } .charles-maintenance__heading { padding: 46px 20px 40px; } .charles-maintenance__eyebrow { font-size: 12px; } .charles-maintenance__title { font-size: 29px; } .charles-maintenance__intro { font-size: 14px; } .charles-maintenance__stats { grid-template-columns: 1fr; gap: 20px; margin-top: 36px; } .charles-maintenance__stat, .charles-maintenance__stat:first-child { padding: 0 0 0 15px; border-left: 2px solid rgba(255, 255, 255, 0.28); } .charles-maintenance__visual { height: 220px; } .charles-maintenance__right { grid-template-columns: 1fr; gap: 30px; padding: 46px 20px; } .charles-maintenance__service-title { font-size: 20px; } .charles-maintenance__service-text { font-size: 14px; line-height: 1.6; } }

@media screen and (max-width: 420px) { .charles-maintenance__heading { padding: 40px 16px 34px; } .charles-maintenance__title { font-size: 26px; } .charles-maintenance__visual { height: 190px; } .charles-maintenance__right { padding: 40px 16px; } }

/*-----------------------------------------------------------------------PANNE----------------------------------------------------------------------------------------*/
.charles-diagnostic-focus { overflow: hidden; padding: 80px 0; background-color: #ffffff; }

.charles-diagnostic-focus * { box-sizing: border-box; }

.charles-diagnostic-focus__container { display: grid; grid-template-columns: minmax(0, 1fr) 520px; align-items: center; gap: 60px; width: 100%; max-width: 1280px; margin: 0 auto; padding: 0 32px; }

.charles-diagnostic-focus__content { width: 100%; max-width: 500px; }

.charles-diagnostic-focus__eyebrow { margin: 0 0 18px; color: #e30613; font-size: 11px; font-weight: 700; line-height: 1.4; letter-spacing: 1.4px; text-transform: uppercase; }

.charles-diagnostic-focus__title { margin: 0; color: #1a1d21; font-size: 42px; font-weight: 700; line-height: 1.12; letter-spacing: -1px; }

.charles-diagnostic-focus__intro { margin: 24px 0 10px; color: #777c82; font-size: 15px; font-weight: 400; line-height: 1.7; }

.charles-diagnostic-focus__text { margin: 0 0 22px; color: #777c82; font-size: 15px; font-weight: 400; line-height: 1.7; }

.charles-diagnostic-focus__list-title { margin: 0 0 12px; color: #1f2328; font-size: 14px; font-weight: 700; line-height: 1.5; }

.charles-diagnostic-focus__list { margin: 0; padding: 0; list-style: none; }

.charles-diagnostic-focus__list li { position: relative; margin-bottom: 9px; padding-left: 22px; color: #5c6167; font-size: 14px; font-weight: 400; line-height: 1.6; }

.charles-diagnostic-focus__list li:last-child { margin-bottom: 0; }

.charles-diagnostic-focus__list li::before { position: absolute; top: 0; left: 0; color: #e30613; content: "✓"; font-weight: 700; }

.charles-diagnostic-focus__visual { width: 100%; min-width: 0; }

.charles-diagnostic-focus__image-wrap { width: 100%; height: 560px; overflow: hidden; border-radius: 0; }

.charles-diagnostic-focus__image { display: block; width: 100%; height: 100%; border-radius: 0; object-fit: cover; object-position: center; }

@media screen and (max-width: 1100px) { .charles-diagnostic-focus { padding: 70px 0; } .charles-diagnostic-focus__container { grid-template-columns: minmax(0, 1fr) 440px; gap: 40px; padding: 0 24px; } .charles-diagnostic-focus__title { font-size: 36px; } .charles-diagnostic-focus__image-wrap { height: 500px; } }

@media screen and (max-width: 860px) { .charles-diagnostic-focus { padding: 56px 0; } .charles-diagnostic-focus__container { grid-template-columns: 1fr; gap: 36px; padding: 0 20px; } .charles-diagnostic-focus__content { max-width: 680px; } .charles-diagnostic-focus__title { font-size: 34px; } .charles-diagnostic-focus__visual { max-width: 680px; } .charles-diagnostic-focus__image-wrap { height: 430px; } }

@media screen and (max-width: 600px) { .charles-diagnostic-focus { padding: 46px 0; } .charles-diagnostic-focus__container { gap: 30px; padding: 0 18px; } .charles-diagnostic-focus__eyebrow { margin-bottom: 13px; font-size: 10px; } .charles-diagnostic-focus__title { font-size: 29px; line-height: 1.16; letter-spacing: -0.5px; } .charles-diagnostic-focus__intro { margin-top: 20px; } .charles-diagnostic-focus__intro, .charles-diagnostic-focus__text { font-size: 14px; line-height: 1.65; } .charles-diagnostic-focus__list li { font-size: 14px; } .charles-diagnostic-focus__image-wrap { height: 340px; } }

@media screen and (max-width: 420px) { .charles-diagnostic-focus { padding: 40px 0; } .charles-diagnostic-focus__container { padding: 0 16px; } .charles-diagnostic-focus__title { font-size: 26px; } .charles-diagnostic-focus__image-wrap { height: 280px; } }

/*-----------------------------------------------------------------------CARTE GRISE----------------------------------------------------------------------------------------*/
.charles-card-service { padding: 70px 0; background-color: #fff; }

.charles-card-service * { box-sizing: border-box; }

.charles-card-service__hidden-title { position: absolute; overflow: hidden; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; clip: rect(0 0 0 0); white-space: nowrap; }

.charles-card-service__container { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; max-width: 1280px; margin: 0 auto; padding: 0 24px; }

.charles-card-service__item { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 270px; overflow: hidden; padding: 48px 20px 28px; background-color: #232329; text-align: center; transition: transform 0.3s ease, box-shadow 0.3s ease, background-color 0.3s ease; }

.charles-card-service__item::before { position: absolute; top: 0; left: 0; width: 48px; height: 3px; background-color: #e30613; content: ""; transition: width 0.3s ease; }

.charles-card-service__category { position: absolute; top: 18px; left: 20px; color: #e30613; font-size: 10px; font-weight: 700; line-height: 1.4; letter-spacing: 1.5px; text-transform: uppercase; }

.charles-card-service__icon { display: flex; align-items: center; justify-content: center; width: 58px; height: 58px; margin-bottom: 18px; color: #e30613; }

.charles-card-service__icon svg { width: 42px; height: 42px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.charles-card-service__title { margin: 0; color: #ffffff; font-size: 22px; font-weight: 700; line-height: 1.2; text-transform: uppercase; }

.charles-card-service__subtitle { margin: 8px 0 0; color: rgba(255, 255, 255, 0.7); font-size: 14px; font-weight: 400; line-height: 1.5; }

.charles-card-service__dots { display: block; margin-top: 16px; color: #6f6f76; font-size: 18px; line-height: 1; letter-spacing: 2px; }

@media screen and (max-width: 1100px) { .charles-card-service__container { grid-template-columns: repeat(2, 1fr); } }

@media screen and (max-width: 700px) { .charles-card-service { padding: 54px 0; } .charles-card-service__container { grid-template-columns: 1fr; gap: 14px; padding: 0 18px; } .charles-card-service__item { min-height: 220px; padding: 46px 18px 24px; } .charles-card-service__category { top: 16px; left: 18px; } .charles-card-service__title { font-size: 19px; } .charles-card-service__subtitle { font-size: 13px; } }

@media screen and (max-width: 440px) { .charles-card-service { padding: 44px 0; } .charles-card-service__container { padding: 0 16px; } .charles-card-service__item { min-height: 205px; padding: 44px 16px 22px; } .charles-card-service__category { left: 16px; } }

/*-----------------------------------------------------------------------VENTE----------------------------------------------------------------------------------------*/
.charles-vehicle-sale { overflow: hidden; padding: 105px 0; background-color: #ffffff; }

.charles-vehicle-sale * { box-sizing: border-box; }

.charles-vehicle-sale__container { display: grid; grid-template-columns: minmax(500px, 0.95fr) minmax(600px, 1.05fr); align-items: center; gap: 90px; max-width: 1520px; margin: 0 auto; padding: 0 50px; }

.charles-vehicle-sale__visual { display: flex; align-items: center; justify-content: center; min-width: 0; }

.charles-vehicle-sale__image { display: block; width: 650px; height: auto; object-fit: contain; object-position: center; }

.charles-vehicle-sale__content { min-width: 0; }

.charles-vehicle-sale__heading { width: auto; }

.charles-vehicle-sale__eyebrow { margin: 0 0 14px; color: #e30613; font-size: 14px; font-weight: 700; line-height: 1.4; letter-spacing: 1.6px; text-transform: uppercase; }

.charles-vehicle-sale__title { max-width: 720px; margin: 0; color: #17191d; font-size: 51px; font-weight: 800; line-height: 1.08; letter-spacing: -1px; }

.charles-vehicle-sale__intro { max-width: 680px; margin: 24px 0 0; color: #777b81; font-size: 17px; font-weight: 400; line-height: 1.75; }

.charles-vehicle-sale__intro + .charles-vehicle-sale__intro { margin-top: 10px; }

.charles-vehicle-sale__services { display: grid; gap: 28px; margin-top: 42px; }

.charles-vehicle-sale__service { display: grid; grid-template-columns: 68px minmax(0, 1fr); align-items: center; gap: 22px; }

.charles-vehicle-sale__icon { display: flex; align-items: center; justify-content: center; width: 68px; height: 68px; border-radius: 50%; color: #e30613; background-color: #f7f7f7; box-shadow: 0 8px 22px rgba(0, 0, 0, 0.08); }

.charles-vehicle-sale__icon svg { width: 36px; height: 36px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.charles-vehicle-sale__service-content { min-width: 0; }

.charles-vehicle-sale__service-title { margin: 0 0 7px; color: #1d2024; font-size: 19px; font-weight: 800; line-height: 1.25; text-transform: uppercase; }

.charles-vehicle-sale__service-text { max-width: 530px; margin: 0; color: #7d8186; font-size: 15px; font-weight: 400; line-height: 1.65; }

@media screen and (max-width: 1250px) { .charles-vehicle-sale { padding: 85px 0; } .charles-vehicle-sale__container { grid-template-columns: minmax(410px, 0.9fr) minmax(500px, 1.1fr); gap: 55px; padding: 0 32px; } .charles-vehicle-sale__image { width: 560px; } .charles-vehicle-sale__title { font-size: 43px; } .charles-vehicle-sale__intro { font-size: 16px; } .charles-vehicle-sale__icon { width: 62px; height: 62px; } .charles-vehicle-sale__icon svg { width: 33px; height: 33px; } .charles-vehicle-sale__service { grid-template-columns: 62px minmax(0, 1fr); gap: 18px; } }

@media screen and (max-width: 960px) { .charles-vehicle-sale { padding: 75px 0; } .charles-vehicle-sale__container { grid-template-columns: 1fr; gap: 50px; padding: 0 28px; } .charles-vehicle-sale__visual { order: 1; } .charles-vehicle-sale__content { order: 2; max-width: 780px; margin: 0 auto; } .charles-vehicle-sale__image { width: 650px; } .charles-vehicle-sale__title { max-width: 720px; } }

@media screen and (max-width: 650px) { .charles-vehicle-sale { padding: 58px 0; } .charles-vehicle-sale__container { gap: 36px; padding: 0 20px; } .charles-vehicle-sale__image { width: 480px; max-width: 100%; } .charles-vehicle-sale__eyebrow { margin-bottom: 10px; font-size: 11px; } .charles-vehicle-sale__title { font-size: 32px; letter-spacing: -0.5px; } .charles-vehicle-sale__intro { margin-top: 18px; font-size: 15px; line-height: 1.7; } .charles-vehicle-sale__services { gap: 25px; margin-top: 32px; } .charles-vehicle-sale__service { grid-template-columns: 56px minmax(0, 1fr); gap: 15px; } .charles-vehicle-sale__icon { width: 56px; height: 56px; } .charles-vehicle-sale__icon svg { width: 29px; height: 29px; } .charles-vehicle-sale__service-title { font-size: 16px; } .charles-vehicle-sale__service-text { font-size: 13px; } }

@media screen and (max-width: 420px) { .charles-vehicle-sale { padding: 48px 0; } .charles-vehicle-sale__container { padding: 0 16px; } .charles-vehicle-sale__image { width: 360px; } .charles-vehicle-sale__title { font-size: 28px; } .charles-vehicle-sale__service { grid-template-columns: 50px minmax(0, 1fr); gap: 13px; } .charles-vehicle-sale__icon { width: 50px; height: 50px; } .charles-vehicle-sale__icon svg { width: 26px; height: 26px; } }

/*-----------------------------------------------------------------------PRET----------------------------------------------------------------------------------------*/
.charles-loan-vehicle { position: relative; display: flex; align-items: center; min-height: 560px; overflow: hidden; background-color: #111111; }

.charles-loan-vehicle * { box-sizing: border-box; }

.charles-loan-vehicle__background { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }

.charles-loan-vehicle__overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(10, 10, 10, 0.92) 0%, rgba(10, 10, 10, 0.78) 36%, rgba(10, 10, 10, 0.42) 64%, rgba(10, 10, 10, 0.18) 100%); }

.charles-loan-vehicle__container { position: relative; z-index: 2; width: 100%; max-width: 1280px; margin: 0 auto; padding: 90px 32px; }

.charles-loan-vehicle__content { max-width: 570px; }

.charles-loan-vehicle__eyebrow { margin: 0 0 10px; color: #ffffff; font-size: 13px; font-weight: 700; line-height: 1.4; letter-spacing: 1.4px; text-transform: uppercase; }

.charles-loan-vehicle__title { margin: 0; color: #ffffff; font-size: 48px; font-weight: 700; line-height: 1.08; letter-spacing: -1px; }

.charles-loan-vehicle__line { display: block; width: 42px; height: 2px; margin: 18px 0 22px; background-color: #e30613; }

.charles-loan-vehicle__subtitle { margin: 0 0 18px; color: #f1f1f1; font-size: 22px; font-weight: 700; line-height: 1.35; }

.charles-loan-vehicle__text { margin: 0 0 12px; color: rgba(255, 255, 255, 0.78); font-size: 15px; font-weight: 400; line-height: 1.75; }

.charles-loan-vehicle__notice { position: relative; margin: 20px 0 0; padding-left: 18px; color: #ffffff; font-size: 15px; font-weight: 600; line-height: 1.65; }

.charles-loan-vehicle__notice::before { position: absolute; top: 3px; bottom: 3px; left: 0; width: 3px; background-color: #e30613; content: ""; }

.charles-loan-vehicle__button { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; margin-top: 28px; padding: 0 26px; border: 1px solid #e30613; border-radius: 0; color: #ffffff !important; background-color: transparent; font-size: 12px; font-weight: 700; line-height: 1; letter-spacing: 1.1px; text-decoration: none; text-transform: uppercase; transition: color 0.3s ease, background-color 0.3s ease, border-color 0.3s ease; }

.charles-loan-vehicle__button:hover { border-color: #e30613; color: #ffffff !important; background-color: #e30613; }

.charles-loan-vehicle__button:focus-visible { outline: 2px solid #ffffff; outline-offset: 4px; }

@media screen and (max-width: 900px) { .charles-loan-vehicle { min-height: 520px; } .charles-loan-vehicle__background { object-position: 60% center; } .charles-loan-vehicle__container { padding: 72px 24px; } .charles-loan-vehicle__content { max-width: 520px; } .charles-loan-vehicle__title { font-size: 40px; } .charles-loan-vehicle__subtitle { font-size: 20px; } }

@media screen and (max-width: 768px) { .charles-loan-vehicle { align-items: flex-end; min-height: 620px; } .charles-loan-vehicle__background { object-position: center; } .charles-loan-vehicle__overlay { background: linear-gradient(180deg, rgba(10, 10, 10, 0.2) 0%, rgba(10, 10, 10, 0.52) 38%, rgba(10, 10, 10, 0.94) 100%); } .charles-loan-vehicle__container { padding: 170px 20px 52px; } .charles-loan-vehicle__content { max-width: 100%; } .charles-loan-vehicle__eyebrow { font-size: 11px; } .charles-loan-vehicle__title { font-size: 33px; letter-spacing: -0.5px; } .charles-loan-vehicle__subtitle { font-size: 18px; } .charles-loan-vehicle__text, .charles-loan-vehicle__notice { font-size: 14px; line-height: 1.7; } }

@media screen and (max-width: 480px) { .charles-loan-vehicle { min-height: 610px; } .charles-loan-vehicle__container { padding: 150px 16px 44px; } .charles-loan-vehicle__title { font-size: 29px; } .charles-loan-vehicle__line { margin: 16px 0 18px; } .charles-loan-vehicle__subtitle { font-size: 17px; } .charles-loan-vehicle__button { width: 100%; min-height: 44px; margin-top: 24px; padding: 0 18px; font-size: 11px; } }

/*# sourceMappingURL=custom.css.map */