@charset "UTF-8";
@import url(main.css);
a:visited { color: black !important; }

div#termsfeed-com---nb { margin: 10px; }

.black-screen { display: none; }

.card.card-cover.h-100.overflow-hidden.rounded-4.shadow-lg { background-color: black; }

.mx-auto.first-activity-div.col-lg-11.px-4.py-4.mb-5.mt-5.bg-primaryColor.text-color-primary.rounded-3.shadow-lg.position-relative, .mx-auto.second-activity-div.col-lg-11.px-4.py-4.mb-5.mt-5.rounded-3.shadow-lg.bg-primaryColor.text-color-primary.position-relative, .mx-auto.third-activity-div.col-lg-11.px-4.py-4.mb-4.mt-5.bg-primaryColor.text-color-primary.rounded-3.shadow-lg.position-relative { padding: 50px 20px !important; margin-top: 70px !important; margin-bottom: 70px !important; }

/*===================================================================================================== NAVBAR FIXE AU SCROLL===================================================================================*/
.fs-6.animated-border-button.obftrucs { text-transform: uppercase; font-weight: 800; font-family: 'Bricolage Grotesque'; font-size: 1.1rem !important; }

a.grow.button_header.text-color-fourth.mx-3.mx-lg-2.my-2.my-lg-1.p-2.rounded-pill.text-decoration-none.button-header-telephone { padding: 12px 28px !important; }

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

nav#navigation-bar-show.cdp-custom-navbar { position: fixed !important; top: 18px !important; left: 24px !important; right: 24px !important; z-index: 99999 !important; margin: 0 !important; padding: 12px 18px !important; border-radius: 999px !important; background: rgba(11, 11, 11, 0.9) !important; border: 1px solid rgba(255, 214, 0, 0.35) !important; box-shadow: 0 18px 45px rgba(0, 0, 0, 0.35) !important; backdrop-filter: blur(14px) !important; -webkit-backdrop-filter: blur(14px) !important; transition: top 0.3s ease, background 0.3s ease, box-shadow 0.3s ease !important; }

nav#navigation-bar-show.cdp-custom-navbar.cdp-nav-scrolled { top: 10px !important; background: rgba(11, 11, 11, 0.96) !important; box-shadow: 0 22px 55px rgba(0, 0, 0, 0.48) !important; }

@media (max-width: 991px) { nav#navigation-bar-show.cdp-custom-navbar { top: 12px !important; left: 14px !important; right: 14px !important; border-radius: 26px !important; } }

@media (max-width: 560px) { nav#navigation-bar-show.cdp-custom-navbar { top: 10px !important; left: 10px !important; right: 10px !important; padding: 10px 12px !important; } }

a.nav-link.fs-6.dropdown-toggle.px-0.text-color-secondary.text-center { text-transform: uppercase; font-weight: 800; font-family: 'Bricolage Grotesque'; }

/*===================================================================================================== HERO D'ACCUEIL==============================================================================================================*/
:root { --cdp-yellow: #FFD600; --cdp-yellow-dark: #E7B900; --cdp-black: #0B0B0B; --cdp-dark: #151515; --cdp-dark-soft: #242424; --cdp-white: #ffffff; --cdp-light: #F5F5F2; --cdp-gray: #8A8A8A; }

.cdp-hero { position: relative; min-height: 100vh; display: flex; align-items: center; overflow: hidden; color: var(--cdp-white); background: var(--cdp-black); }

.cdp-hero__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; z-index: 0; pointer-events: none; }

.cdp-hero__container { position: relative; z-index: 2; width: 100%; max-width: 1600px; margin: 0 auto; padding: 120px 6%; }

.cdp-hero__content { max-width: 980px; }

.cdp-hero__logo { margin-bottom: 28px; }

.cdp-hero__logo img { display: block; max-width: 230px; max-height: 200px; object-fit: contain; }

.cdp-hero__kicker { display: inline-flex; align-items: center; gap: 12px; margin-bottom: 22px; font-family: "Manrope", sans-serif; font-size: 0.82rem; font-weight: 800; letter-spacing: 0.18em; text-transform: uppercase; color: var(--cdp-yellow); }

.cdp-hero__kicker::before { content: ""; width: 44px; height: 3px; border-radius: 999px; background: var(--cdp-yellow); }

.cdp-hero h1 { margin: 0; max-width: 1120px; font-family: "Bricolage Grotesque", sans-serif; font-size: clamp(2.2rem, 4.4vw, 5.8rem); line-height: 1.02; font-weight: 800; letter-spacing: -0.045em; text-transform: uppercase; }

.cdp-hero h1 span { color: var(--cdp-yellow); }

.cdp-hero p { max-width: 660px; margin: 28px 0 0; font-family: "Manrope", sans-serif; font-size: clamp(1rem, 1.35vw, 1.18rem); line-height: 1.7; color: rgba(255, 255, 255, 0.86); }

.cdp-hero__actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 38px; }

a.grow.button_header.text-color-fourth.mx-3.mx-lg-2.my-2.my-lg-1.p-2.rounded-pill.text-decoration-none.button-header-telephone, .cdp-hero__btn { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 0 28px; border-radius: 999px; color: black !important; font-family: "Manrope", sans-serif; font-size: 0.92rem; font-weight: 800; text-decoration: none; transition: transform 0.25s ease, background 0.25s ease, color 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease; }

a.grow.button_header.text-color-fourth.mx-3.mx-lg-2.my-2.my-lg-1.p-2.rounded-pill.text-decoration-none.button-header-telephone, .cdp-hero__btn--primary, .cdp-hero__btn { background: var(--cdp-yellow); color: var(--cdp-black); border: 1px solid var(--cdp-yellow); box-shadow: 0 14px 30px rgba(255, 214, 0, 0.22); }

a.grow.button_header.text-color-fourth.mx-3.mx-lg-2.my-2.my-lg-1.p-2.rounded-pill.text-decoration-none.button-header-telephone:hover, .cdp-hero__btn--primary:hover, .cdp-hero__btn:hover { transform: translateY(-3px); background: var(--cdp-yellow-dark); border-color: var(--cdp-yellow-dark); color: var(--cdp-black); box-shadow: 0 18px 38px rgba(255, 214, 0, 0.3); }

@media (max-width: 900px) { .cdp-hero { min-height: 82vh; background-position: center; } .cdp-hero__overlay { background: linear-gradient(90deg, rgba(11, 11, 11, 0.94) 0%, rgba(11, 11, 11, 0.8) 58%, rgba(11, 11, 11, 0.48) 100%), linear-gradient(180deg, rgba(255, 214, 0, 0.1) 0%, rgba(11, 11, 11, 0.35) 100%); } .cdp-hero__container { padding: 110px 6% 80px; } .cdp-hero h1 { max-width: 820px; letter-spacing: -0.045em; } .cdp-hero__logo img { max-width: 150px; } }

@media (max-width: 560px) { .cdp-hero { min-height: 78vh; } .cdp-hero__container { padding: 95px 6% 65px; } .cdp-hero__logo { margin-bottom: 22px; padding: 10px 13px; border-radius: 14px; } .cdp-hero__logo img { max-width: 130px; max-height: 70px; } .cdp-hero__kicker { font-size: 0.72rem; letter-spacing: 0.12em; } .cdp-hero__kicker::before { width: 30px; } .cdp-hero h1 { font-size: clamp(1.9rem, 9.5vw, 2.8rem); line-height: 1.05; } .cdp-hero p { margin-top: 22px; font-size: 0.98rem; } .cdp-hero__actions { flex-direction: column; margin-top: 30px; } .cdp-hero__btn { width: 100%; } }

/*======================================================================================================== PRESENTATION DE L'ENTREPRISE================================================================================================*/
:root { --cdp-yellow: #FFD600; --cdp-yellow-dark: #E7B900; --cdp-black: #0B0B0B; --cdp-dark: #151515; --cdp-dark-soft: #242424; --cdp-white: #ffffff; --cdp-light: #F5F5F2; --cdp-gray: #8A8A8A; }

.cdp-about { position: relative; padding: 150px 4vw; background: radial-gradient(circle at 12% 18%, rgba(255, 214, 0, 0.18), transparent 26%), radial-gradient(circle at 88% 76%, rgba(255, 214, 0, 0.08), transparent 28%), linear-gradient(135deg, var(--cdp-black) 0%, var(--cdp-dark) 100%); color: var(--cdp-white); overflow: hidden; }

.cdp-about__pattern { position: absolute; inset: 0; opacity: 0.22; background-image: linear-gradient(rgba(255, 255, 255, 0.08) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.08) 1px, transparent 1px); background-size: 42px 42px; mask-image: linear-gradient(90deg, transparent 0%, #000 18%, #000 82%, transparent 100%); pointer-events: none; }

.cdp-about__bg-text { position: absolute; right: -35px; bottom: 10px; font-family: "Bricolage Grotesque", sans-serif; font-size: clamp(4rem, 13vw, 12rem); line-height: 1; font-weight: 800; letter-spacing: -0.08em; color: rgba(255, 255, 255, 0.045); text-transform: uppercase; white-space: nowrap; pointer-events: none; }

.cdp-about__container { position: relative; z-index: 2; max-width: 1750px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1fr) minmax(520px, 1.15fr); gap: 55px; align-items: center; }

/* Texte */
.cdp-about__eyebrow { display: inline-flex; align-items: center; gap: 12px; margin-bottom: 16px; font-family: "Manrope", sans-serif; font-size: 0.78rem; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; color: var(--cdp-yellow); }

.cdp-about__eyebrow::before { content: ""; width: 42px; height: 3px; border-radius: 999px; background: var(--cdp-yellow); }

.cdp-about__title { margin: 0 0 24px; max-width: 780px; font-family: "Bricolage Grotesque", sans-serif; font-size: clamp(2.1rem, 3.6vw, 4.2rem); line-height: 0.98; font-weight: 800 !important; letter-spacing: -0.055em; color: var(--cdp-white); text-transform: uppercase; }

.cdp-about__title span { color: var(--cdp-yellow); }

.cdp-about__text { margin: 0 0 18px; max-width: 760px; font-family: "Manrope", sans-serif; font-size: 1rem; line-height: 1.78; color: rgba(255, 255, 255, 0.74); }

.cdp-about__text--lead { font-size: clamp(1.08rem, 1.35vw, 1.28rem); line-height: 1.6; color: rgba(255, 255, 255, 0.92); }

.cdp-about__text strong { color: var(--cdp-yellow); }

/* Bouton */
.cdp-about__btn { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; margin-top: 22px; padding: 0 28px; border-radius: 999px; background: var(--cdp-yellow); color: black !important; font-family: "Manrope", sans-serif; font-size: 0.92rem; font-weight: 800; text-decoration: none; box-shadow: 0 14px 30px rgba(255, 214, 0, 0.22); transition: transform 0.25s ease, background 0.25s ease, box-shadow 0.25s ease, color 0.25s ease; }

.cdp-about__btn:hover { transform: translateY(-3px); background: var(--cdp-yellow-dark); color: var(--cdp-black); box-shadow: 0 18px 38px rgba(255, 214, 0, 0.32); }

/* Image */
.cdp-about__visual { position: relative; width: 100%; height: 520px; border-radius: 28px; background: linear-gradient(180deg, rgba(11, 11, 11, 0.05), rgba(11, 11, 11, 0.35)), url("https://storage.googleapis.com/refpro-app-ca244.appspot.com/customers%2FCXmI80TbwwOK8FZmSkr7bSTEHHc2%2Fimages%2Fphoto_daccueil_i85s.webp"); background-size: cover; background-position: center; overflow: hidden; box-shadow: 0 28px 70px rgba(0, 0, 0, 0.38); }

.cdp-about__visual::before { content: ""; position: absolute; inset: 18px; border: 2px solid rgba(255, 214, 0, 0.86); border-radius: 20px; pointer-events: none; }

.cdp-about__visual::after { content: ""; position: absolute; left: -26px; bottom: -26px; width: 160px; height: 160px; background: var(--cdp-yellow); border-radius: 50%; opacity: 0.85; mix-blend-mode: screen; }

.cdp-about__badge { position: absolute; right: 26px; bottom: 26px; z-index: 2; min-width: 125px; padding: 18px 20px; border-radius: 18px; background: rgba(11, 11, 11, 0.88); color: var(--cdp-white); backdrop-filter: blur(8px); border: 1px solid rgba(255, 214, 0, 0.32); }

.cdp-about__badge span { display: block; margin-bottom: 2px; font-family: "Manrope", sans-serif; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--cdp-yellow); }

.cdp-about__badge strong { display: block; font-family: "Bricolage Grotesque", sans-serif; font-size: 2.4rem; line-height: 1; font-weight: 800; letter-spacing: -0.05em; color: var(--cdp-white); }

/* Responsive */
@media (max-width: 980px) { .cdp-about { padding: 85px 6vw; } .cdp-about__container { grid-template-columns: 1fr; gap: 45px; } .cdp-about__visual { height: 360px; } .cdp-about__bg-text { bottom: 40px; font-size: clamp(4rem, 18vw, 8rem); } }

@media (max-width: 560px) { .cdp-about { padding: 70px 6vw; } .cdp-about__title { font-size: clamp(1.85rem, 9vw, 2.8rem); letter-spacing: -0.04em; } .cdp-about__visual { height: 300px; border-radius: 22px; } .cdp-about__visual::before { inset: 12px; border-radius: 16px; } .cdp-about__badge { right: 18px; bottom: 18px; } .cdp-about__btn { width: 100%; } }

/*================================================================================================= LES SERVICES / PRESTATIONS=========================================================================================================*/
.cdp-services { position: relative; padding: 110px 4vw; background: radial-gradient(circle at 10% 15%, rgba(255, 214, 0, 0.18), transparent 25%), radial-gradient(circle at 88% 78%, rgba(255, 214, 0, 0.08), transparent 28%), linear-gradient(135deg, #0B0B0B 0%, #151515 100%); color: #ffffff; overflow: hidden; }

.cdp-services::before { content: ""; position: absolute; inset: 0; opacity: 0.22; background-image: linear-gradient(rgba(255, 255, 255, 0.08) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.08) 1px, transparent 1px); background-size: 44px 44px; pointer-events: none; }

.cdp-services__bg-text { position: absolute; right: -25px; bottom: 8px; font-family: "Bricolage Grotesque", sans-serif; font-size: clamp(4.5rem, 14vw, 13rem); line-height: 1; font-weight: 800; letter-spacing: -0.08em; color: rgba(255, 255, 255, 0.05); text-transform: uppercase; white-space: nowrap; pointer-events: none; }

.cdp-services__container { position: relative; z-index: 2; max-width: 1720px; margin: 0 auto; }

.cdp-services__head { max-width: 1700px; margin-bottom: 54px; }

.cdp-services__eyebrow { display: inline-flex; align-items: center; gap: 12px; margin-bottom: 16px; font-family: "Manrope", sans-serif; font-size: 0.78rem; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; color: #FFD600; }

.cdp-services__eyebrow::before { content: ""; width: 42px; height: 3px; border-radius: 999px; background: #FFD600; }

.cdp-services__head h2 { margin: 0; max-width: 1700px; font-family: "Bricolage Grotesque", sans-serif; font-size: clamp(2.1rem, 3.8vw, 4.5rem); line-height: 0.98; font-weight: 800 !important; letter-spacing: -0.055em; text-transform: uppercase; color: #ffffff; }

.cdp-services__head h2 span { color: #FFD600; }

.cdp-services__head p { max-width: 1500px; margin: 22px 0 0; font-family: "Manrope", sans-serif; font-size: 1.2rem; line-height: 1.75; color: rgba(255, 255, 255, 0.74); }

.cdp-services__head p strong { color: var(--cdp-yellow); }

.cdp-services__grid { display: grid; grid-template-columns: repeat(5, minmax(180px, 1fr)); gap: 22px; align-items: stretch; }

.cdp-service-card { position: relative; display: flex; flex-direction: column; min-height: 430px; padding: 10px; border-radius: 28px; background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.14); text-decoration: none; color: #ffffff; overflow: hidden; isolation: isolate; transition: background 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease; }

.cdp-service-card::before { content: ""; position: absolute; inset: 10px; border-radius: 22px; border: 1px solid rgba(255, 214, 0, 0); z-index: 3; pointer-events: none; transition: border-color 0.35s ease, inset 0.35s ease; }

.cdp-service-card:hover { background: rgba(255, 255, 255, 0.1); border-color: rgba(255, 214, 0, 0.55); box-shadow: 0 24px 52px rgba(0, 0, 0, 0.34); }

.cdp-service-card:hover::before { inset: 14px; border-color: rgba(255, 214, 0, 0.9); }

.cdp-service-card__image { position: relative; height: 260px; border-radius: 22px; overflow: hidden; background: #242424; }

.cdp-service-card__image::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 15%, rgba(11, 11, 11, 0.78) 100%); opacity: 0.62; transition: opacity 0.35s ease; }

.cdp-service-card__image img { width: 100%; height: 100%; object-fit: cover; display: block; filter: saturate(0.9) contrast(1.04); transition: transform 0.55s ease, filter 0.35s ease; }

.cdp-service-card:hover .cdp-service-card__image img { transform: scale(1.06); filter: saturate(1.05) contrast(1.08); }

.cdp-service-card:hover .cdp-service-card__image::after { opacity: 0.42; }

.cdp-service-card__content { position: relative; z-index: 4; padding: 22px 14px 16px; }

.cdp-service-card__content span { display: inline-block; margin-bottom: 12px; font-family: "Bricolage Grotesque", sans-serif; font-size: 0.86rem; font-weight: 800; color: #FFD600; }

.cdp-service-card__content h3 { margin: 0; font-family: "Bricolage Grotesque", sans-serif; font-size: clamp(1.18rem, 1.45vw, 1.55rem); line-height: 1.05; font-weight: 800 !important; letter-spacing: -0.035em; text-transform: uppercase; color: #ffffff; }

.cdp-service-card__content em::after { content: "→"; font-size: 1rem; transition: transform 0.35s ease; }

.cdp-service-card:hover .cdp-service-card__content p { max-height: 90px; margin-top: 12px; opacity: 1; transform: translateY(0); }

.cdp-service-card:hover .cdp-service-card__content em { margin-top: 18px; opacity: 1; transform: translateY(0); }

.cdp-service-card:hover .cdp-service-card__content em::after { transform: translateX(5px); }

@media (max-width: 1250px) { .cdp-services__grid { grid-template-columns: repeat(3, 1fr); } .cdp-service-card { min-height: 410px; } }

@media (max-width: 820px) { .cdp-services { padding: 85px 6vw; } .cdp-services__grid { grid-template-columns: repeat(2, 1fr); gap: 18px; } .cdp-service-card__image { height: 230px; } }

@media (max-width: 560px) { .cdp-services { padding: 70px 6vw; } .cdp-services__head { margin-bottom: 34px; } .cdp-services__head h2 { font-size: clamp(1.85rem, 9vw, 2.8rem); letter-spacing: -0.04em; } .cdp-services__head p { font-size: 1rem; } .cdp-services__grid { grid-template-columns: 1fr; } .cdp-service-card { min-height: auto; } .cdp-service-card__image { height: 260px; } .cdp-service-card__content p, .cdp-service-card__content em { max-height: none; opacity: 1; transform: none; } .cdp-service-card__content p { margin-top: 12px; } .cdp-service-card__content em { margin-top: 18px; } }

/*======================================================================================================= EN TETE : PAGE SECONDAIRE================================================================================================*/
.cdp-page-hero { position: relative; min-height: 520px; display: flex; align-items: center; overflow: hidden; background: #0b0b0b; color: #ffffff; }

.cdp-page-hero__media { position: absolute; inset: 0; z-index: 1; }

.cdp-page-hero__media img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center; filter: brightness(0.78) contrast(1.08) saturate(0.92); }

.cdp-page-hero__overlay { position: absolute; inset: 0; z-index: 2; background: linear-gradient(90deg, rgba(11, 11, 11, 0.92) 0%, rgba(11, 11, 11, 0.78) 38%, rgba(11, 11, 11, 0.42) 72%, rgba(11, 11, 11, 0.18) 100%), linear-gradient(180deg, rgba(255, 214, 0, 0.12) 0%, rgba(11, 11, 11, 0.28) 100%); }

.cdp-page-hero__overlay::after { content: ""; position: absolute; inset: 0; opacity: 0.22; background-image: linear-gradient(rgba(255, 255, 255, 0.08) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.08) 1px, transparent 1px); background-size: 44px 44px; pointer-events: none; }

.cdp-page-hero__container { position: relative; z-index: 3; width: 100%; max-width: 1720px; margin: 0 auto; padding: 120px 4%; }

.cdp-page-hero__content { max-width: 1200px; }

.cdp-page-hero__eyebrow { display: inline-flex; align-items: center; gap: 12px; margin-bottom: 18px; font-family: "Manrope", sans-serif; font-size: 0.78rem; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; color: #ffd600; }

.cdp-page-hero__eyebrow::before { content: ""; width: 42px; height: 3px; border-radius: 999px; background: #ffd600; }

.cdp-page-hero h1 { margin: 0; max-width: 1200px; font-family: "Bricolage Grotesque", sans-serif; font-size: clamp(2.4rem, 5vw, 5.8rem); line-height: 0.98; font-weight: 800 !important; letter-spacing: -0.055em; text-transform: uppercase; color: #ffffff; }

.cdp-page-hero p { max-width: 720px; margin: 24px 0 0; font-family: "Manrope", sans-serif; font-size: clamp(1rem, 1.25vw, 1.15rem); line-height: 1.75; color: rgba(255, 255, 255, 0.78); }

.cdp-page-hero p span { color: #ffd600; text-transform: uppercase; font-weight: 800 !important; }

@media (max-width: 900px) { .cdp-page-hero { min-height: 460px; } .cdp-page-hero__container { padding: 105px 6% 80px; } .cdp-page-hero__overlay { background: linear-gradient(90deg, rgba(11, 11, 11, 0.94) 0%, rgba(11, 11, 11, 0.8) 60%, rgba(11, 11, 11, 0.48) 100%); } }

@media (max-width: 560px) { .cdp-page-hero { min-height: 390px; } .cdp-page-hero__container { padding: 90px 6% 65px; } .cdp-page-hero__eyebrow { font-size: 0.7rem; letter-spacing: 0.12em; } .cdp-page-hero__eyebrow::before { width: 30px; } .cdp-page-hero h1 { font-size: clamp(2rem, 11vw, 3.2rem); letter-spacing: -0.04em; } .cdp-page-hero p { margin-top: 18px; font-size: 0.98rem; } }

/*=============================================================================================== PRESENTATION DU SERVICE==========================================================================================================*/
.cdp-masonry-intro { position: relative; padding: 120px 64px; background: radial-gradient(circle at 86% 12%, rgba(255, 214, 0, 0.22), transparent 260px), linear-gradient(135deg, #f5f5f2 0%, #ffffff 100%); color: #0b0b0b; overflow: hidden; }

.cdp-masonry-intro::before { content: ""; position: absolute; inset: 0; opacity: 0.18; background-image: linear-gradient(rgba(11, 11, 11, 0.08) 1px, transparent 1px), linear-gradient(90deg, rgba(11, 11, 11, 0.08) 1px, transparent 1px); background-size: 44px 44px; pointer-events: none; }

.cdp-masonry-intro__bg-text { position: absolute; right: -35px; bottom: 10px; font-family: "Bricolage Grotesque", sans-serif; font-size: clamp(4rem, 12vw, 11rem); line-height: 1; font-weight: 800 !important; letter-spacing: -0.08em; color: rgba(11, 11, 11, 0.045); text-transform: uppercase; white-space: nowrap; pointer-events: none; }

.cdp-masonry-intro__container { position: relative; z-index: 2; max-width: 1720px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(520px, 1fr); gap: 80px; align-items: start; }

.cdp-masonry-intro__eyebrow { display: inline-flex; align-items: center; gap: 12px; margin-bottom: 16px; font-family: "Manrope", sans-serif; font-size: 0.78rem; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; color: #0b0b0b; }

.cdp-masonry-intro__eyebrow::before { content: ""; width: 42px; height: 3px; border-radius: 999px; background: #ffd600; }

.cdp-masonry-intro h2 { margin: 0; max-width: 780px; font-family: "Bricolage Grotesque", sans-serif; font-size: clamp(2.1rem, 3.7vw, 4.4rem); line-height: 0.98; font-weight: 800 !important; letter-spacing: -0.055em; text-transform: uppercase; color: #0b0b0b; }

.cdp-masonry-intro__lead { margin-top: 28px !important; font-size: clamp(1.08rem, 1.3vw, 1.28rem) !important; line-height: 1.65 !important; color: #0b0b0b !important; }

.cdp-masonry-intro__content p { max-width: 740px; margin: 18px 0 0; font-family: "Manrope", sans-serif; font-size: 1rem; line-height: 1.78; color: rgba(11, 11, 11, 0.68); }

.cdp-masonry-intro__btn { display: inline-flex; align-items: center; justify-content: center; min-height: 54px; margin-top: 34px; padding: 0 32px; border-radius: 999px; background: #ffd600; color: #0b0b0b; font-family: "Manrope", sans-serif; font-size: 0.92rem; font-weight: 800; text-decoration: none; box-shadow: 0 14px 30px rgba(255, 214, 0, 0.24); transition: transform 0.25s ease, background 0.25s ease, box-shadow 0.25s ease; }

.cdp-masonry-intro__btn:hover { transform: translateY(-3px); background: #e7b900; color: #0b0b0b; box-shadow: 0 18px 38px rgba(255, 214, 0, 0.34); }

.cdp-masonry-intro__works { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }

.cdp-masonry-intro__work { position: relative; min-height: 250px; padding: 30px; border-radius: 28px; background: radial-gradient(circle at 90% 10%, rgba(255, 214, 0, 0.22), transparent 110px), #0b0b0b; color: #ffffff; overflow: hidden; border: 1px solid rgba(255, 214, 0, 0.22); transition: border-color 0.3s ease, box-shadow 0.3s ease, background 0.3s ease; }

.cdp-masonry-intro__work::before { content: ""; position: absolute; inset: 0; opacity: 0.14; background-image: linear-gradient(rgba(255, 255, 255, 0.12) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.12) 1px, transparent 1px); background-size: 34px 34px; pointer-events: none; }

.cdp-masonry-intro__work:hover { border-color: rgba(255, 214, 0, 0.9); box-shadow: 0 22px 48px rgba(0, 0, 0, 0.16); background: radial-gradient(circle at 90% 10%, rgba(255, 214, 0, 0.32), transparent 130px), #151515; }

.cdp-masonry-intro__work span { position: relative; z-index: 2; display: inline-block; margin-bottom: 32px; font-family: "Bricolage Grotesque", sans-serif; font-size: 0.9rem; font-weight: 800 !important; color: #ffd600; }

.cdp-masonry-intro__work h3 { position: relative; z-index: 2; margin: 0 0 12px; font-family: "Bricolage Grotesque", sans-serif; font-size: clamp(1.25rem, 1.5vw, 1.7rem); line-height: 1.05; font-weight: 800 !important; letter-spacing: -0.035em; text-transform: uppercase; color: #ffffff; }

.cdp-masonry-intro__work p { position: relative; z-index: 2; margin: 0; font-family: "Manrope", sans-serif; font-size: 0.95rem; line-height: 1.65; color: rgba(255, 255, 255, 0.72); }

@media (max-width: 1100px) { .cdp-masonry-intro { padding: 90px 48px; } .cdp-masonry-intro__container { grid-template-columns: 1fr; gap: 50px; } .cdp-masonry-intro__works { max-width: 900px; } }

@media (max-width: 700px) { .cdp-masonry-intro { padding: 75px 24px; } .cdp-masonry-intro h2 { font-size: clamp(1.85rem, 9vw, 2.8rem); letter-spacing: -0.04em; } .cdp-masonry-intro__works { grid-template-columns: 1fr; } .cdp-masonry-intro__work { min-height: auto; padding: 26px; } .cdp-masonry-intro__btn { width: 100%; } }

/*============================================================================================================== NOTRE APPROCHE=======================================================================================================*/
.cdp-method { position: relative; padding: 120px 64px; background: radial-gradient(circle at 12% 18%, rgba(255, 214, 0, 0.16), transparent 260px), linear-gradient(135deg, #0b0b0b 0%, #151515 100%); color: #ffffff; overflow: hidden; }

.cdp-method::before { content: ""; position: absolute; inset: 0; opacity: 0.16; background-image: linear-gradient(rgba(255, 255, 255, 0.08) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.08) 1px, transparent 1px); background-size: 44px 44px; pointer-events: none; }

.cdp-method__container { position: relative; z-index: 2; max-width: 1720px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 0.95fr) minmax(520px, 1fr); gap: 80px; align-items: center; }

.cdp-method__eyebrow { display: inline-flex; align-items: center; gap: 12px; margin-bottom: 16px; font-family: "Manrope", sans-serif; font-size: 0.78rem; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; color: #ffd600; }

.cdp-method__eyebrow::before { content: ""; width: 42px; height: 3px; border-radius: 999px; background: #ffd600; }

.cdp-method h2 { margin: 0; max-width: 820px; font-family: "Bricolage Grotesque", sans-serif; font-size: clamp(2.1rem, 3.8vw, 4.5rem); line-height: 0.98; font-weight: 800 !important; letter-spacing: -0.055em; text-transform: uppercase; color: #ffffff; }

.cdp-method__lead { margin-top: 28px !important; font-size: clamp(1.08rem, 1.3vw, 1.28rem) !important; line-height: 1.65 !important; color: rgba(255, 255, 255, 0.9) !important; }

.cdp-method__content p { max-width: 780px; margin: 18px 0 0; font-family: "Manrope", sans-serif; font-size: 1rem; line-height: 1.78; color: rgba(255, 255, 255, 0.68); }

.cdp-method__steps { display: grid; gap: 18px; }

.cdp-method__step { position: relative; display: grid; grid-template-columns: 76px 1fr; gap: 22px; align-items: start; padding: 28px; border-radius: 28px; background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.14); overflow: hidden; transition: background 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease; }

.cdp-method__step::before { content: ""; position: absolute; right: -48px; top: -48px; width: 140px; height: 140px; border-radius: 50%; background: rgba(255, 214, 0, 0.16); transition: transform 0.35s ease, opacity 0.35s ease; }

.cdp-method__step:hover { background: rgba(255, 255, 255, 0.1); border-color: rgba(255, 214, 0, 0.7); box-shadow: 0 22px 48px rgba(0, 0, 0, 0.28); }

.cdp-method__step:hover::before { transform: scale(1.25); opacity: 1; }

.cdp-method__step span { position: relative; z-index: 2; width: 56px; height: 56px; display: grid; place-items: center; border-radius: 999px; background: #ffd600; color: #0b0b0b; font-family: "Bricolage Grotesque", sans-serif; font-size: 0.95rem; font-weight: 800 !important; }

.cdp-method__step div { position: relative; z-index: 2; }

.cdp-method__step h3 { margin: 0 0 10px; font-family: "Bricolage Grotesque", sans-serif; font-size: clamp(1.25rem, 1.6vw, 1.8rem); line-height: 1.05; font-weight: 800 !important; letter-spacing: -0.035em; text-transform: uppercase; color: #ffffff; }

.cdp-method__step p { margin: 0; font-family: "Manrope", sans-serif; font-size: 0.96rem; line-height: 1.65; color: rgba(255, 255, 255, 0.68); }

@media (max-width: 1100px) { .cdp-method { padding: 90px 48px; } .cdp-method__container { grid-template-columns: 1fr; gap: 50px; } }

@media (max-width: 700px) { .cdp-method { padding: 75px 24px; } .cdp-method h2 { font-size: clamp(1.85rem, 9vw, 2.8rem); letter-spacing: -0.04em; } .cdp-method__step { grid-template-columns: 1fr; gap: 16px; padding: 26px; } }

/*=========================================================================================================== CTA FINAL=======================================================================================================*/
.cdp-final-cta { position: relative; padding: 95px 64px; color: #ffffff; overflow: hidden; background: #0b0b0b; }

.cdp-final-cta__media { position: absolute; inset: 0; z-index: 1; }

.cdp-final-cta__media img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center; filter: brightness(0.75) contrast(1.08) saturate(0.9); }

.cdp-final-cta__overlay { position: absolute; inset: 0; z-index: 2; background: linear-gradient(90deg, rgba(11, 11, 11, 0.92) 0%, rgba(11, 11, 11, 0.82) 45%, rgba(11, 11, 11, 0.58) 100%), radial-gradient(circle at 12% 20%, rgba(255, 214, 0, 0.22), transparent 280px); }

.cdp-final-cta::before { content: ""; position: absolute; inset: 0; z-index: 3; opacity: 0.16; background-image: linear-gradient(rgba(255, 255, 255, 0.08) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.08) 1px, transparent 1px); background-size: 44px 44px; pointer-events: none; }

.cdp-final-cta__bg-text, .cdp-final-cta__container { position: relative; z-index: 4; }

.cdp-final-cta__bg-text { position: absolute; right: -30px; bottom: 6px; font-family: "Bricolage Grotesque", sans-serif; font-size: clamp(4rem, 12vw, 11rem); line-height: 1; font-weight: 800; letter-spacing: -0.08em; color: rgba(255, 255, 255, 0.045); text-transform: uppercase; white-space: nowrap; pointer-events: none; }

.cdp-final-cta__container { position: relative; z-index: 2; max-width: 1720px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 70px; align-items: center; }

.cdp-final-cta__eyebrow { display: inline-flex; align-items: center; gap: 12px; margin-bottom: 16px; font-family: "Manrope", sans-serif; font-size: 0.78rem; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; color: #ffd600; }

.cdp-final-cta__eyebrow::before { content: ""; width: 42px; height: 3px; border-radius: 999px; background: #ffd600; }

.cdp-final-cta h2 { margin: 0; max-width: 900px; font-family: "Bricolage Grotesque", sans-serif; font-size: clamp(2.1rem, 4vw, 4.8rem); line-height: 0.98; font-weight: 800 !important; letter-spacing: -0.055em; text-transform: uppercase; color: #ffffff; }

.cdp-final-cta p { max-width: 860px; margin: 22px 0 0; font-family: "Manrope", sans-serif; font-size: 1.05rem; line-height: 1.75; color: rgba(255, 255, 255, 0.72); }

.cdp-final-cta p span { color: #FED920; text-transform: uppercase; font-weight: 700 !important; }

.cdp-final-cta__actions { display: grid; gap: 14px; }

.cdp-final-cta__btn, .cdp-final-cta__phone { display: inline-flex; align-items: center; justify-content: center; min-height: 56px; padding: 0 30px; border-radius: 999px; font-family: "Manrope", sans-serif; font-size: 0.94rem; font-weight: 800; text-decoration: none; transition: transform 0.25s ease, background 0.25s ease, color 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease; }

.cdp-final-cta__btn { background: #ffd600; color: #0b0b0b; border: 1px solid #ffd600; box-shadow: 0 14px 30px rgba(255, 214, 0, 0.24); }

.cdp-final-cta__btn:hover { transform: translateY(-3px); background: #e7b900; color: #0b0b0b; border-color: #e7b900; box-shadow: 0 18px 38px rgba(255, 214, 0, 0.34); }

.cdp-final-cta__phone { background: rgba(255, 255, 255, 0.08); color: #ffffff; border: 1px solid rgba(255, 255, 255, 0.24); }

.cdp-final-cta__phone:hover { transform: translateY(-3px); background: #ffffff; color: #0b0b0b; border-color: #ffffff; }

@media (max-width: 950px) { .cdp-final-cta { padding: 85px 48px; } .cdp-final-cta__container { grid-template-columns: 1fr; gap: 40px; } .cdp-final-cta__actions { max-width: 420px; } }

@media (max-width: 600px) { .cdp-final-cta { padding: 70px 24px; } .cdp-final-cta h2 { font-size: clamp(1.85rem, 9vw, 2.8rem); letter-spacing: -0.04em; } .cdp-final-cta p { font-size: 1rem; } .cdp-final-cta__actions { max-width: none; } .cdp-final-cta__btn, .cdp-final-cta__phone { width: 100%; } }

/*============================================================================================================ LES REALISATIONS=============================================================================================*/
.cdp-photo-grid { position: relative; padding: 110px 4vw; background: radial-gradient(circle at 12% 10%, rgba(255, 214, 0, 0.16), transparent 260px), linear-gradient(135deg, #0b0b0b 0%, #151515 100%); overflow: hidden; }

.cdp-photo-grid::before { content: ""; position: absolute; inset: 0; opacity: 0.16; background-image: linear-gradient(rgba(255, 255, 255, 0.08) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.08) 1px, transparent 1px); background-size: 44px 44px; pointer-events: none; }

.cdp-photo-grid__container { position: relative; z-index: 2; max-width: 1720px; margin: 0 auto; display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }

.cdp-photo-grid__item { position: relative; height: 290px; padding: 0; border-radius: 24px; overflow: hidden; background: #242424; border: 1px solid rgba(255, 255, 255, 0.14); cursor: zoom-in; }

.cdp-photo-grid__item::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 25%, rgba(11, 11, 11, 0.45) 100%); opacity: 0.65; transition: opacity 0.35s ease; }

.cdp-photo-grid__item img { width: 100%; height: 100%; display: block; object-fit: cover; filter: brightness(0.82) contrast(1.06) saturate(0.94); transition: transform 0.55s ease, filter 0.35s ease; }

.cdp-photo-grid__item:hover img { transform: scale(1.06); filter: brightness(0.96) contrast(1.08) saturate(1.04); }

.cdp-photo-grid__item:hover::after { opacity: 0.28; }

.cdp-lightbox { position: fixed; inset: 0; z-index: 9999; display: none; align-items: center; justify-content: center; padding: 40px; background: rgba(11, 11, 11, 0.92); }

.cdp-lightbox.is-active { display: flex; }

.cdp-lightbox__image { max-width: 92vw; max-height: 86vh; object-fit: contain; border-radius: 22px; border: 2px solid rgba(255, 214, 0, 0.85); box-shadow: 0 30px 90px rgba(0, 0, 0, 0.55); }

.cdp-lightbox__close { position: absolute; top: 24px; right: 28px; width: 52px; height: 52px; border: 1px solid rgba(255, 214, 0, 0.55); border-radius: 999px; background: #ffd600; color: #0b0b0b; font-size: 2rem; line-height: 1; font-weight: 700; cursor: pointer; }

@media (max-width: 1100px) { .cdp-photo-grid__container { grid-template-columns: repeat(3, 1fr); } .cdp-photo-grid__item { height: 260px; } }

@media (max-width: 760px) { .cdp-photo-grid { padding: 80px 6vw; } .cdp-photo-grid__container { grid-template-columns: repeat(2, 1fr); gap: 14px; } .cdp-photo-grid__item { height: 220px; border-radius: 20px; } .cdp-lightbox { padding: 22px; } .cdp-lightbox__close { top: 16px; right: 16px; } }

@media (max-width: 480px) { .cdp-photo-grid__container { grid-template-columns: 1fr; } .cdp-photo-grid__item { height: 260px; } }

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