.elementor-kit-376{--e-global-color-primary:#004449;--e-global-color-secondary:#3D1146;--e-global-color-text:#1A1D1E;--e-global-color-accent:#E4FF18;--e-global-color-e378476:#F2F7E9;--e-global-color-48957c3:#E5FFE6;--e-global-color-29450d0:#BCEBFF;--e-global-color-c72f623:#FFB3FD;--e-global-color-2ef81ca:#483CFF;--e-global-color-db98ae6:#FFFFFF;--e-global-color-bbgreig:#F2F7E9;--e-global-color-bbgreen:#E5FFE6;--e-global-color-bbblue0:#BCEBFF;--e-global-color-bbpink0:#FFB3FD;--e-global-color-bbelect:#483CFF;--e-global-color-bbwhite:#FFFFFF;--e-global-typography-primary-font-family:"National";--e-global-typography-primary-font-size:96px;--e-global-typography-primary-font-weight:300;--e-global-typography-primary-line-height:1.04em;--e-global-typography-primary-letter-spacing:-0.025em;--e-global-typography-secondary-font-family:"National";--e-global-typography-secondary-font-size:48px;--e-global-typography-secondary-font-weight:300;--e-global-typography-secondary-line-height:1.1em;--e-global-typography-secondary-letter-spacing:-0.025em;--e-global-typography-text-font-family:"National";--e-global-typography-text-font-size:18px;--e-global-typography-text-font-weight:300;--e-global-typography-text-line-height:1.5em;--e-global-typography-accent-font-family:"Muoto";--e-global-typography-accent-font-size:48px;--e-global-typography-accent-font-weight:500;--e-global-typography-accent-font-style:italic;--e-global-typography-accent-line-height:1.1em;--e-global-typography-bbbody0-font-family:"National";--e-global-typography-bbbody0-font-size:18px;--e-global-typography-bbbody0-font-weight:400;--e-global-typography-bbbody0-line-height:1.5em;--e-global-typography-bblead0-font-family:"National";--e-global-typography-bblead0-font-size:28px;--e-global-typography-bblead0-font-weight:400;--e-global-typography-bblead0-line-height:1.25em;--e-global-typography-bbsub00-font-family:"National";--e-global-typography-bbsub00-font-size:16px;--e-global-typography-bbsub00-font-weight:400;--e-global-typography-bbsub00-line-height:1.375em;--e-global-typography-bblabel-font-family:"National";--e-global-typography-bblabel-font-size:14px;--e-global-typography-bblabel-font-weight:400;--e-global-typography-bblabel-line-height:1.3em;--e-global-typography-bbeyebr-font-family:"National";--e-global-typography-bbeyebr-font-size:12px;--e-global-typography-bbeyebr-font-weight:300;--e-global-typography-bbeyebr-text-transform:uppercase;--e-global-typography-bbeyebr-line-height:1.33em;--e-global-typography-bbeyebr-letter-spacing:0.1em;--e-global-typography-bbkpi00-font-family:"Muoto";--e-global-typography-bbkpi00-font-size:72px;--e-global-typography-bbkpi00-font-weight:500;--e-global-typography-bbkpi00-font-style:italic;--e-global-typography-bbkpi00-line-height:1em;--e-global-typography-bbnav00-font-family:"National";--e-global-typography-bbnav00-font-size:14px;--e-global-typography-bbnav00-font-weight:400;--e-global-typography-bbnav00-line-height:1.43em;--e-global-typography-bbnav00-letter-spacing:0.025em;--e-global-typography-bbbtn0-font-family:"National";--e-global-typography-bbbtn0-font-size:16px;--e-global-typography-bbbtn0-font-weight:400;--e-global-typography-bbbtn0-line-height:1em;background-color:#F2F7E9;color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );line-height:var( --e-global-typography-text-line-height );}.elementor-kit-376 button,.elementor-kit-376 input[type="button"],.elementor-kit-376 input[type="submit"],.elementor-kit-376 .elementor-button{background-color:var( --e-global-color-primary );font-family:var( --e-global-typography-bbbtn0-font-family ), sans-serif;font-size:var( --e-global-typography-bbbtn0-font-size );font-weight:var( --e-global-typography-bbbtn0-font-weight );line-height:var( --e-global-typography-bbbtn0-line-height );color:var( --e-global-color-bbgreig );border-style:none;border-radius:9999px 9999px 9999px 9999px;padding:16px 24px 16px 24px;}.elementor-kit-376 button:hover,.elementor-kit-376 button:focus,.elementor-kit-376 input[type="button"]:hover,.elementor-kit-376 input[type="button"]:focus,.elementor-kit-376 input[type="submit"]:hover,.elementor-kit-376 input[type="submit"]:focus,.elementor-kit-376 .elementor-button:hover,.elementor-kit-376 .elementor-button:focus{background-color:var( --e-global-color-text );color:var( --e-global-color-bbgreig );}.elementor-kit-376 e-page-transition{background-color:#FFBC7D;}.elementor-kit-376 a{color:var( --e-global-color-primary );}.elementor-kit-376 a:hover{color:var( --e-global-color-text );}.elementor-kit-376 h1{color:var( --e-global-color-text );font-family:var( --e-global-typography-primary-font-family ), sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );line-height:var( --e-global-typography-primary-line-height );letter-spacing:var( --e-global-typography-primary-letter-spacing );}.elementor-kit-376 h2{color:var( --e-global-color-text );font-family:var( --e-global-typography-secondary-font-family ), sans-serif;font-size:var( --e-global-typography-secondary-font-size );font-weight:var( --e-global-typography-secondary-font-weight );line-height:var( --e-global-typography-secondary-line-height );letter-spacing:var( --e-global-typography-secondary-letter-spacing );}.elementor-kit-376 h3{color:var( --e-global-color-text );font-family:var( --e-global-typography-bbsub00-font-family ), sans-serif;font-size:var( --e-global-typography-bbsub00-font-size );font-weight:var( --e-global-typography-bbsub00-font-weight );line-height:var( --e-global-typography-bbsub00-line-height );}.elementor-kit-376 h4{color:var( --e-global-color-text );font-family:var( --e-global-typography-bbsub00-font-family ), sans-serif;font-size:var( --e-global-typography-bbsub00-font-size );font-weight:var( --e-global-typography-bbsub00-font-weight );line-height:var( --e-global-typography-bbsub00-line-height );}.elementor-kit-376 h5{color:var( --e-global-color-text );font-family:var( --e-global-typography-bblabel-font-family ), sans-serif;font-size:var( --e-global-typography-bblabel-font-size );font-weight:var( --e-global-typography-bblabel-font-weight );line-height:var( --e-global-typography-bblabel-line-height );}.elementor-kit-376 h6{color:var( --e-global-color-text );font-family:var( --e-global-typography-bbeyebr-font-family ), sans-serif;font-size:var( --e-global-typography-bbeyebr-font-size );font-weight:var( --e-global-typography-bbeyebr-font-weight );text-transform:var( --e-global-typography-bbeyebr-text-transform );line-height:var( --e-global-typography-bbeyebr-line-height );letter-spacing:var( --e-global-typography-bbeyebr-letter-spacing );}.elementor-kit-376 label{color:rgba(26,29,30,0.4);font-family:"National", sans-serif;font-size:12px;font-weight:400;text-transform:uppercase;letter-spacing:0.05em;}.elementor-kit-376 input:not([type="button"]):not([type="submit"]),.elementor-kit-376 textarea,.elementor-kit-376 .elementor-field-textual{font-family:"National", sans-serif;font-size:16px;font-weight:300;color:var( --e-global-color-text );background-color:rgba(0,0,0,0);border-style:solid;border-width:1px 1px 1px 1px;border-color:rgba(26,29,30,0.15);border-radius:12px 12px 12px 12px;padding:12px 16px 12px 16px;}.elementor-kit-376 input:focus:not([type="button"]):not([type="submit"]),.elementor-kit-376 textarea:focus,.elementor-kit-376 .elementor-field-textual:focus{border-style:solid;border-width:1px 1px 1px 1px;border-color:rgba(26,29,30,0.4);}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1280px;}.e-con{--container-max-width:1280px;--container-default-padding-top:0px;--container-default-padding-right:0px;--container-default-padding-bottom:0px;--container-default-padding-left:0px;}.elementor-widget:not(:last-child){--kit-widget-spacing:0px;}.elementor-element{--widgets-spacing:0px 0px;--widgets-spacing-row:0px;--widgets-spacing-column:0px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-kit-376{--e-global-typography-primary-font-size:60px;--e-global-typography-secondary-font-size:40px;--e-global-typography-text-font-size:17px;--e-global-typography-accent-font-size:40px;--e-global-typography-bbbody0-font-size:17px;--e-global-typography-bblead0-font-size:24px;--e-global-typography-bbkpi00-font-size:60px;font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-kit-376 h1{font-size:var( --e-global-typography-primary-font-size );line-height:var( --e-global-typography-primary-line-height );letter-spacing:var( --e-global-typography-primary-letter-spacing );}.elementor-kit-376 h2{font-size:var( --e-global-typography-secondary-font-size );line-height:var( --e-global-typography-secondary-line-height );letter-spacing:var( --e-global-typography-secondary-letter-spacing );}.elementor-kit-376 h3{font-size:var( --e-global-typography-bbsub00-font-size );line-height:var( --e-global-typography-bbsub00-line-height );}.elementor-kit-376 h4{font-size:var( --e-global-typography-bbsub00-font-size );line-height:var( --e-global-typography-bbsub00-line-height );}.elementor-kit-376 h5{font-size:var( --e-global-typography-bblabel-font-size );line-height:var( --e-global-typography-bblabel-line-height );}.elementor-kit-376 h6{font-size:var( --e-global-typography-bbeyebr-font-size );line-height:var( --e-global-typography-bbeyebr-line-height );letter-spacing:var( --e-global-typography-bbeyebr-letter-spacing );}.elementor-kit-376 button,.elementor-kit-376 input[type="button"],.elementor-kit-376 input[type="submit"],.elementor-kit-376 .elementor-button{font-size:var( --e-global-typography-bbbtn0-font-size );line-height:var( --e-global-typography-bbbtn0-line-height );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:85%;}.e-con{--container-max-width:85%;}}@media(max-width:767px){.elementor-kit-376{--e-global-typography-primary-font-size:36px;--e-global-typography-secondary-font-size:32px;--e-global-typography-text-font-size:16px;--e-global-typography-accent-font-size:32px;--e-global-typography-bbbody0-font-size:16px;--e-global-typography-bblead0-font-size:22px;--e-global-typography-bbkpi00-font-size:36px;font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-kit-376 h1{font-size:var( --e-global-typography-primary-font-size );line-height:var( --e-global-typography-primary-line-height );letter-spacing:var( --e-global-typography-primary-letter-spacing );}.elementor-kit-376 h2{font-size:var( --e-global-typography-secondary-font-size );line-height:var( --e-global-typography-secondary-line-height );letter-spacing:var( --e-global-typography-secondary-letter-spacing );}.elementor-kit-376 h3{font-size:var( --e-global-typography-bbsub00-font-size );line-height:var( --e-global-typography-bbsub00-line-height );}.elementor-kit-376 h4{font-size:var( --e-global-typography-bbsub00-font-size );line-height:var( --e-global-typography-bbsub00-line-height );}.elementor-kit-376 h5{font-size:var( --e-global-typography-bblabel-font-size );line-height:var( --e-global-typography-bblabel-line-height );}.elementor-kit-376 h6{font-size:var( --e-global-typography-bbeyebr-font-size );line-height:var( --e-global-typography-bbeyebr-line-height );letter-spacing:var( --e-global-typography-bbeyebr-letter-spacing );}.elementor-kit-376 button,.elementor-kit-376 input[type="button"],.elementor-kit-376 input[type="submit"],.elementor-kit-376 .elementor-button{font-size:var( --e-global-typography-bbbtn0-font-size );line-height:var( --e-global-typography-bbbtn0-line-height );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:90%;}.e-con{--container-max-width:90%;}}/* Start custom CSS *//* ========================================================================== bobine — CSS global À coller dans : Elementor > Réglages du site > CSS personnalisé (déjà inclus dans le kit de réglages ; ce fichier sert de référence) Source : Figma Make « bobine_Website » — src/index.css + composants ========================================================================== */ :root { --bb-black: #1A1D1E; --bb-yellow: #E4FF18; --bb-petrol: #004449; --bb-greige: #F2F7E9; --bb-green-pale: #E5FFE6; --bb-blue-pale: #BCEBFF; --bb-pink-pale: #FFB3FD; --bb-plum: #3D1146; --bb-electric: #483CFF; --bb-rule: 1px; } /* Mots accentués dans les titres (Muoto Medium Italic) */ .ds-accent { font-family: 'Muoto', serif; font-style: italic; font-weight: 500; font-synthesis: none; } body { -webkit-font-smoothing: antialiased; font-synthesis: none; } /* ─── Header fixe ─────────────────────────────────────────────────────────── */ .elementor-location-header { position: fixed; top: 0; left: 0; right: 0; z-index: 50; } .admin-bar .elementor-location-header { top: 32px; } @media (max-width: 782px) { .admin-bar .elementor-location-header { top: 46px; } } .bb-header { background-color: rgba(242, 247, 233, .9); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); transition: background-color .3s; } body.bb-scrolled .bb-header { background-color: rgba(242, 247, 233, .95); } .bb-logo-light { display: none; } /* Accueil : header transparent et blanc tant qu'on n'a pas défilé de 60 px */ body.home:not(.bb-scrolled) .bb-header { background-color: transparent; -webkit-backdrop-filter: none; backdrop-filter: none; } body.home:not(.bb-scrolled) .bb-logo-light { display: block; } body.home:not(.bb-scrolled) .bb-logo-dark { display: none; } body.home:not(.bb-scrolled) .bb-nav .elementor-nav-menu--main .elementor-item { color: rgba(242, 247, 233, .8); } body.home:not(.bb-scrolled) .bb-nav .elementor-nav-menu--main .elementor-item:hover { color: #F2F7E9; } body.home:not(.bb-scrolled) .bb-nav .elementor-nav-menu--main .elementor-item.elementor-item-active { color: #E4FF18; } body.home:not(.bb-scrolled) .bb-nav .elementor-menu-toggle { color: #F2F7E9; } body.home:not(.bb-scrolled) .bb-header-cta .elementor-button { background-color: transparent; border: var(--bb-rule) solid rgba(242, 247, 233, .4); color: #F2F7E9; } /* Menu mobile plein écran blanc */ @media (max-width: 767px) { .bb-nav .elementor-nav-menu--dropdown { background: #fff; } .bb-nav .elementor-nav-menu--dropdown .elementor-item { font-size: 30px; padding: 16px 24px; border-bottom: var(--bb-rule) solid rgba(26, 29, 30, .1); } .bb-header-cta { display: none; } } /* ─── Ratios d'images et de blocs ─────────────────────────────────────────── */ .bb-ratio-34 img { aspect-ratio: 3 / 4; width: 100%; height: auto; object-fit: cover; } .bb-ratio-43 img { aspect-ratio: 4 / 3; width: 100%; height: auto; object-fit: cover; } .bb-ratio-43c img { aspect-ratio: 4 / 3; width: 100%; height: auto; object-fit: cover; object-position: center 43%; } .bb-h-224 img { height: 224px; width: 100%; object-fit: cover; } .bb-h-144 img { height: 144px; width: 100%; object-fit: cover; } .bb-kpi { aspect-ratio: 3 / 4; } .bb-aspect-43 { aspect-ratio: 4 / 3; } @media (max-width: 1024px) { .bb-split-media { aspect-ratio: 8 / 9; min-height: 0 !important; } } /* Image « route » scrollable sur mobile */ @media (max-width: 767px) { .bb-scroll-x { overflow-x: auto; } .bb-scroll-x img { width: 48rem; max-width: none; } } /* ─── Bloc « quadrillé » avec croix centrale (Who we are / Industrial reqs) ── */ .bb-cross { position: relative; } @media (min-width: 768px) { .bb-cross::before, .bb-cross::after { content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); background: var(--bb-cross-color, rgba(26, 29, 30, .1)); pointer-events: none; } .bb-cross::before { width: 12rem; height: var(--bb-rule); } .bb-cross::after { height: 12rem; width: var(--bb-rule); } } .bb-cross--electric { --bb-cross-color: #483CFF; } /* ─── Listes ──────────────────────────────────────────────────────────────── */ .bb-dash-list ul { list-style: none; margin: 0; padding: 0; } .bb-dash-list li { display: flex; gap: .5rem; align-items: flex-start; margin-bottom: .375rem; } .bb-dash-list li::before { content: "—"; color: rgba(26, 29, 30, .2); flex-shrink: 0; } .bb-dash-list--petrol li::before { color: #004449; } .bb-dash-list--petrol li { gap: .75rem; margin-bottom: .75rem; } .bb-disc-list ul { list-style: disc; margin: 0; padding-left: 1.25rem; } .bb-disc-list li { margin-bottom: .5rem; } /* Liste du comité (nom + rôle) */ .bb-committee p { margin: 0; } .bb-committee .bb-name { font-weight: 400; } .bb-committee .bb-role { font-weight: 300; color: rgba(26, 29, 30, .6); margin-bottom: 1.25rem; } /* Liens séparés par des puces (footer) */ .bb-inline-links p { margin: 0; display: flex; flex-wrap: wrap; gap: .75rem 1rem; align-items: center; } .bb-inline-links a { color: inherit; transition: color .15s; } .bb-inline-links a:hover { color: #1A1D1E; } .bb-inline-links .bb-sep { color: rgba(26, 29, 30, .3); user-select: none; } @media (max-width: 767px) { .bb-inline-links p { justify-content: center; } } /* ─── Filets ──────────────────────────────────────────────────────────────── */ .bb-rule { display: block; height: var(--bb-rule); width: 50px; } .bb-rule--pink { background: #FFB3FD; } /* ─── Légende pulsée (bandeaux photo) ─────────────────────────────────────── */ .bb-caption { display: flex; flex-direction: column; align-items: flex-start; gap: .75rem; } .bb-caption__rule { height: var(--bb-rule); width: 50px; background: currentColor; } .bb-caption__row { display: flex; align-items: center; gap: .5rem; font-size: 16px; line-height: 1.3; } .bb-caption__dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; animation: bb-pulse 2s cubic-bezier(.4, 0, .6, 1) infinite; } @keyframes bb-pulse { 50% { opacity: .5; } } /* ─── Slider « Lab v1 / Pilot v2 » (widget Slides) ────────────────────────── */ .bb-slides .swiper-slide-contents { position: absolute; left: 24px; bottom: 32px; max-width: none; } @media (min-width: 1025px) { .bb-slides .swiper-slide-contents { left: 40px; } } .bb-slides .elementor-swiper-button { width: 56px; height: 56px; border-radius: 50%; background: rgba(242, 247, 233, .18); border: var(--bb-rule) solid rgba(242, 247, 233, .55); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); display: flex; align-items: center; justify-content: center; } @media (max-width: 767px) { .bb-slides .elementor-swiper-button { width: 48px; height: 48px; } } /* ─── Bandeaux de logos défilants ─────────────────────────────────────────── */ .bb-marquee { position: relative; overflow: hidden; } .bb-marquee::before, .bb-marquee::after { content: ""; position: absolute; top: 0; bottom: 0; width: 3rem; z-index: 2; pointer-events: none; } .bb-marquee::before { left: 0; background: linear-gradient(to right, #F2F7E9, transparent); } .bb-marquee::after { right: 0; background: linear-gradient(to left, #F2F7E9, transparent); } @media (min-width: 640px) { .bb-marquee::before, .bb-marquee::after { width: 6rem; } } .bb-marquee__track { display: flex; align-items: center; gap: 2.5rem; width: max-content; animation: bb-marquee 60s linear infinite; } @media (min-width: 640px) { .bb-marquee__track { gap: 4rem; } } .bb-marquee--reverse .bb-marquee__track { animation-direction: reverse; } .bb-marquee__item { flex-shrink: 0; height: 64px; display: flex; align-items: center; justify-content: center; } .bb-marquee__item img { width: auto; object-fit: contain; } @keyframes bb-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } } /* ─── Feuille de route (accueil) ──────────────────────────────────────────── */ .bb-roadmap { position: relative; display: flex; align-items: flex-start; } .bb-roadmap::before { content: ""; position: absolute; top: 12px; left: 12px; right: 12px; height: var(--bb-rule); background: rgba(26, 29, 30, .1); } .bb-roadmap__step { flex: 1; display: flex; flex-direction: column; align-items: center; text-align: center; position: relative; z-index: 1; } .bb-roadmap__label { font-size: 16px; margin-bottom: 4px; } .bb-roadmap__detail { font-size: 14px; line-height: 1.375; color: rgba(26, 29, 30, .3); max-width: 70px; } @media (max-width: 639px) { .bb-roadmap__detail { display: none; } } .bb-milestone { margin-top: 32px; display: flex; align-items: flex-start; gap: 16px; padding: 16px 20px; background: rgba(0, 68, 73, .05); border-radius: 16px; } .bb-milestone__eyebrow { color: #004449; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; margin-bottom: 4px; font-weight: 300; } /* Pastilles d'étape */ .bb-dot { width: 24px; height: 24px; border-radius: 50%; border: var(--bb-rule) solid; display: flex; align-items: center; justify-content: center; margin-bottom: 12px; flex-shrink: 0; } .bb-dot--lg { width: 28px; height: 28px; margin-bottom: 0; } .bb-dot--done { background: #004449; border-color: #004449; } .bb-dot--next { background: #E4FF18; border-color: #E4FF18; } .bb-dot--future { background: transparent; border-color: rgba(26, 29, 30, .2); } .bb-dot--next::after { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #1A1D1E; } .bb-dot--small { width: 6px; height: 6px; border: 0; border-radius: 50%; background: #004449; margin: 6px 0 0; } .bb-step-head { display: flex; align-items: center; gap: 12px; } /* ─── Schéma « Change the reactor » ───────────────────────────────────────── */ .bb-flow-arrow { display: flex; justify-content: center; color: rgba(26, 29, 30, .4); padding: 20px 0; } /* ─── Tableau FOAK ────────────────────────────────────────────────────────── */ .bb-foak { border: var(--bb-rule) solid #483CFF; border-radius: 16px; overflow: hidden; background: #BCEBFF; } .bb-foak__phases { display: grid; grid-template-columns: 1fr; } @media (min-width: 768px) { .bb-foak__phases { grid-template-columns: repeat(3, 1fr); } } .bb-foak__phase { display: flex; flex-direction: column; border-bottom: var(--bb-rule) solid #483CFF; } .bb-foak__phase:last-child { border-bottom: 0; } @media (min-width: 768px) { .bb-foak__phase { border-bottom: 0; } } .bb-foak__head { padding: 20px 20px 0; } @media (min-width: 768px) { .bb-foak__head { min-height: 80px; } } @media (min-width: 1025px) { .bb-foak__head { padding: 24px 32px 0; } } .bb-foak__stage { position: relative; display: flex; align-items: center; margin-bottom: 8px; } .bb-foak__stage::before { content: ""; position: absolute; left: 0; right: 0; height: var(--bb-rule); background: #483CFF; } .bb-foak__stage span { position: relative; background: #BCEBFF; padding-right: 12px; } .bb-foak__title { font-size: 24px; line-height: 1.25; color: #1A1D1E; } .bb-foak__body { flex: 1; padding: 12px 20px 20px; } @media (min-width: 1025px) { .bb-foak__body { padding: 16px 32px 24px; } } .bb-foak__cap { display: flex; align-items: flex-start; gap: 12px; padding: 4px 0; font-size: 16px; font-weight: 300; color: #1A1D1E; } @media (min-width: 768px) { .bb-foak__cap { min-height: 32px; } } .bb-foak__cap svg { margin-top: 4px; flex-shrink: 0; } .bb-eyebrow-el { color: #483CFF; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; font-weight: 300; } .bb-foak__grid { display: grid; grid-template-columns: repeat(3, 1fr); } .bb-foak__cell { padding: 2px 12px; min-height: 32px; display: flex; align-items: center; font-size: 18px; font-weight: 300; color: #1A1D1E; } @media (min-width: 640px) { .bb-foak__cell { padding-left: 20px; padding-right: 20px; } } @media (min-width: 1025px) { .bb-foak__cell { padding-left: 32px; padding-right: 32px; } } .bb-foak__rule { margin: 0 12px; height: var(--bb-rule); background: #483CFF; } .bb-foak__rule--soft { background: rgba(72, 60, 255, .25); } @media (min-width: 640px) { .bb-foak__rule { margin: 0 20px; } } @media (min-width: 1025px) { .bb-foak__rule { margin: 0 32px; } } .bb-foak__metric { padding: 12px 12px 0; } @media (min-width: 640px) { .bb-foak__metric { padding-left: 20px; } } @media (min-width: 1025px) { .bb-foak__metric { padding-left: 32px; } } .bb-foak__num { display: none; } @media (max-width: 767px) { .bb-foak__num { display: block; padding: 12px; text-align: center; color: rgba(26, 29, 30, .35); font-size: 12px; letter-spacing: .1em; } } /* ─── Logos partenaires (cartes roadmap) ──────────────────────────────────── */ .bb-logo-tile { height: 48px; border-radius: 8px; background: #fff; padding: 6px 8px; display: flex; align-items: center; justify-content: center; } .bb-logo-tile img { max-height: 100%; max-width: 100%; object-fit: contain; } .bb-logo-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; } /* ─── Formulaire de contact ───────────────────────────────────────────────── */ .bb-form .elementor-field-group-enquiry .elementor-field-subgroup { display: grid; grid-template-columns: 1fr; gap: 8px; } @media (min-width: 640px) { .bb-form .elementor-field-group-enquiry .elementor-field-subgroup { grid-template-columns: repeat(6, 1fr); } .bb-form .elementor-field-group-enquiry .elementor-field-option:nth-child(-n+2) { grid-column: span 3; } .bb-form .elementor-field-group-enquiry .elementor-field-option:nth-child(n+3) { grid-column: span 2; } } .bb-form .elementor-field-group-enquiry .elementor-field-option { margin: 0; } .bb-form .elementor-field-group-enquiry input { position: absolute; opacity: 0; pointer-events: none; } .bb-form .elementor-field-group-enquiry label { display: flex; align-items: center; justify-content: center; height: 48px; padding: 0 20px; border-radius: 9999px; border: var(--bb-rule) solid rgba(26, 29, 30, .15); color: rgba(26, 29, 30, .6); font-size: 16px; line-height: 1; cursor: pointer; transition: all .15s; white-space: nowrap; width: 100%; } .bb-form .elementor-field-group-enquiry label:hover { border-color: rgba(26, 29, 30, .3); color: #1A1D1E; } .bb-form .elementor-field-group-enquiry input:checked + label { background: #004449; border-color: #004449; color: #F2F7E9; } .bb-form .elementor-field-group-enquiry input:focus-visible + label { outline: 2px solid #004449; outline-offset: 2px; } .bb-form .elementor-field-group-enquiry > .elementor-field-label { color: rgba(26, 29, 30, .5); margin-bottom: 16px; } .bb-form-card { border-radius: 16px; overflow: hidden; } /* ─── Accessibilité ───────────────────────────────────────────────────────── */ :focus-visible { outline: 2px solid #E4FF18; outline-offset: 2px; } @media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } } /* ─── Menu : élément visible uniquement dans le menu mobile ───────────────── */ /* Ajouter la classe CSS « bb-mobile-only » à l'élément « Home » du menu WordPress */ @media (min-width: 768px) { .bb-nav .elementor-nav-menu--main .bb-mobile-only { display: none; } }/* End custom CSS */ /* Start Custom Fonts CSS */@font-face { font-family: 'National'; font-style: normal; font-weight: 300; font-display: auto; src: url('https://bobine-chemistry.com/wp-content/uploads/2026/10/national-light.woff2') format('woff2'); } @font-face { font-family: 'National'; font-style: normal; font-weight: 400; font-display: auto; src: url('https://bobine-chemistry.com/wp-content/uploads/2026/10/national-regular.woff2') format('woff2'); } /* End Custom Fonts CSS */ /* Start Custom Fonts CSS */@font-face { font-family: 'Muoto'; font-style: normal; font-weight: 500; font-display: auto; src: url('https://bobine-chemistry.com/PROD2026/wp-content/uploads/2026/10/205TF-Muoto-Medium.woff2') format('woff2'); } @font-face { font-family: 'Muoto'; font-style: italic; font-weight: 500; font-display: auto; src: url('https://bobine-chemistry.com/PROD2026/wp-content/uploads/2026/10/205TF-Muoto-MediumItalic.woff2') format('woff2'); } /* End Custom Fonts CSS */