.elementor-kit-6{--e-global-color-primary:#0F373F;--e-global-color-secondary:#113036;--e-global-color-text:#F4EFEA;--e-global-color-accent:#ED7172;--e-global-color-sbsalight:#763047;--e-global-color-sbscyan:#41C1CC;--e-global-color-sbsborder:#E6E1E326;--e-global-typography-primary-font-family:"Alt Picaro";--e-global-typography-primary-font-weight:400;--e-global-typography-secondary-font-family:"Alt Picaro";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Raleway";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Raleway";--e-global-typography-accent-font-weight:400;--e-global-typography-accent-text-transform:uppercase;--e-global-typography-accent-letter-spacing:0.05em;background-color:#113036;color:#113036;font-family:"Raleway", Sans-serif;font-weight:400;}.elementor-kit-6 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}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-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}:root { --sbs-light:#f4efea; --sbs-dark:#113036; --sbs-accent-primary:#0f373f; --sbs-accent-light:#763047; --sbs-accent-dark:#ed7172; --sbs-cyan:#41c1cc; --sbs-font-heading:Alt Picaro; --sbs-font-body:Raleway; }
/* Start custom CSS *//* ==========================================================
   SIDE BY SIDE — styles globaux (kit Elementor)
   Les animations GSAP sont dans Elementor > Code personnalisé
   ========================================================== */

/* ---------- Polices ---------- */
@font-face {
  font-family: "Alt Picaro";
  src: url("https://sbs.moire.dev/wp-content/uploads/sbs-fonts/ALTPicaro-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* ---------- Base fluide (toutes les tailles en rem en dépendent) ---------- */
html { font-size: clamp(0.8rem, calc(0.25rem + 0.75vw), 1.1rem); }
@media (max-width: 1024px) { html { font-size: clamp(0.85rem, calc(0.2rem + 0.9vw), 100vw); } }
@media (max-width: 767px)  { html { font-size: clamp(0.8rem, calc(0.2rem + 0.9vw), 100vw); } }

html, body { overflow-x: clip; }
body {
  margin: 0;
  background-color: #113036;
  color: #113036;
  font-family: "Raleway", sans-serif;
  font-size: 1rem;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
.page-header, .entry-title { display: none; }
.e-paragraph-base, .e-heading-base { cursor: inherit; }
.e-paragraph-base a, .e-heading-base a { color: inherit; }

/* Lenis */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: hidden; }

/* ---------- Header ---------- */
.elementor-location-header { position: relative; z-index: 9999; }
.sbs-header {
  position: fixed !important;
  top: 0; left: 0; right: 0;
  z-index: 9999;
  transition: padding .55s cubic-bezier(.2,.75,.5,1);
}
.admin-bar .sbs-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .sbs-header { top: 46px; } }
.sbs-header-bar {
  transition: margin .55s cubic-bezier(.2,.75,.5,1), padding .55s cubic-bezier(.2,.75,.5,1),
              border-color .55s cubic-bezier(.2,.75,.5,1), max-width .55s cubic-bezier(.2,.75,.5,1),
              background-color .25s, border-radius .25s;
}
.sbs-logo-text { transition: transform .55s cubic-bezier(.2,.75,.5,1); }
html.sbs-scrolled .sbs-header { padding: 0 30px !important; }
html.sbs-scrolled .sbs-header-bar {
  margin-top: 20px !important;
  padding: 10px !important;
  border-color: rgba(15,55,63,.3) !important;
  border-radius: 0 !important;
  max-width: 1740px !important;
  background-color: rgba(17,48,54,0) !important;
  -webkit-backdrop-filter: blur(50px);
  backdrop-filter: blur(50px);
}
@media (min-width: 1025px) {
  html.sbs-scrolled .sbs-header-bar:hover { background-color: rgba(17,48,54,.2) !important; border-radius: 5px !important; }
}
@media (max-width: 1024px) { html.sbs-scrolled .sbs-header { padding: 0 20px !important; } }
html.sbs-scrolled .sbs-logo-text { transform: translateX(-101%); }

/* ---------- Boutons : effet "Reveal" (texte qui défile) ---------- */
.sbs-btn-reveal { transform: translateZ(0); }
.sbs-btn-reveal .sbs-rv { display: block; overflow: hidden; }
.sbs-btn-reveal .sbs-rv-i { display: block; position: relative; transition: transform .55s cubic-bezier(.25,1,.33,1); }
.sbs-btn-reveal .sbs-rv-i::after {
  content: attr(data-text);
  position: absolute; left: 0; bottom: -120%; width: 100%;
  transition: transform .55s cubic-bezier(.25,1,.33,1);
}
.sbs-btn-reveal:hover .sbs-rv-i { transform: translateY(-115%); }
.sbs-btn-reveal:hover .sbs-rv-i::after { transform: translateY(-5%); }

/* ---------- Liens soulignés ---------- */
.sbs-underline, .sbs-underline-alt {
  background-image: linear-gradient(to right, currentColor 0, currentColor 100%) !important;
  background-repeat: no-repeat;
  background-position: right bottom;
  background-size: 0 1px;
  transition: background-size .55s cubic-bezier(.2,.75,.5,1);
}
.sbs-underline-alt:hover { background-size: 100% 1px; background-position: left bottom; }
.sbs-underline { background-size: 100% 1px; background-position: left bottom; }
.sbs-underline:hover { background-size: 0 1px; background-position: right bottom; }

/* ---------- Liste à puces "dot" ---------- */
.sbs-dot-list ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 1px; }
.sbs-dot-list li { display: flex; align-items: center; gap: .2em; }
.sbs-dot-list li::before {
  content: ""; flex: 0 0 1.2em; width: 1.2em; height: 1.2em;
  background: radial-gradient(circle at center, currentColor 0 .1em, transparent .11em);
}

/* ---------- Marquee logos ---------- */
.sbs-marquee {
  --sbs-marquee-gap: 6rem;
  gap: var(--sbs-marquee-gap) !important;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(to right, transparent, #000 15%, #000 85%, transparent);
  mask-image: linear-gradient(to right, transparent, #000 15%, #000 85%, transparent);
}
@media (max-width: 1024px) { .sbs-marquee { --sbs-marquee-gap: 4rem; } }
@media (max-width: 767px)  { .sbs-marquee { --sbs-marquee-gap: 3rem; } }
.sbs-marquee-track {
  flex-shrink: 0 !important;
  min-width: 100%;
  gap: var(--sbs-marquee-gap) !important;
  animation: sbs-marquee 24.5s linear infinite;
}
.sbs-marquee-reverse .sbs-marquee-track { animation-direction: reverse; }
.sbs-marquee-track img { height: 30px !important; width: auto !important; max-width: none !important; }
@media (max-width: 767px) { .sbs-marquee-track img { height: 20px !important; } }
@keyframes sbs-marquee {
  0%   { transform: translateX(0); }
  100% { transform: translateX(calc(-100% - var(--sbs-marquee-gap))); }
}

/* ---------- Grille projets ---------- */
.sbs-work-card { transition: all .75s cubic-bezier(.3,0,0,1); }
.sbs-work-parallax { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }
.sbs-work-parallax img, .sbs-work-parallax video, .sbs-work-parallax .sbs-work-img {
  width: 100% !important; height: 100% !important; max-width: none !important;
  object-fit: cover; object-position: center; display: block;
  aspect-ratio: auto !important;
  transition: transform .75s cubic-bezier(.3,0,0,1);
  pointer-events: none;
}
.sbs-work-card:hover .sbs-work-parallax img,
.sbs-work-card:hover .sbs-work-parallax video { transform: scale(1.08); }
.sbs-work-title .sbs-tw { display: inline-block; overflow: hidden; clip-path: inset(.15em 0 0 0); line-height: 1.3; vertical-align: bottom; }
.sbs-work-title .sbs-tw-i { display: inline-block; position: relative; line-height: 1; transition: transform .75s cubic-bezier(.3,0,0,1); }
.sbs-work-title .sbs-tw-i::after {
  content: attr(data-text);
  position: absolute; left: 0; bottom: -120%; width: 100%;
  transition: transform .75s cubic-bezier(.3,0,0,1);
}
.sbs-work-card:hover .sbs-work-title .sbs-tw-i { transform: translateY(-125%); }
.sbs-work-card:hover .sbs-work-title .sbs-tw-i::after { transform: translateY(0); }
.sbs-work-arrow { overflow: hidden; flex: 0 0 auto; }
.sbs-work-arrow svg { display: block; width: 100%; height: 100%; transform: translate(-90%, 90%); transition: transform .75s cubic-bezier(.3,0,0,1); }
.sbs-work-card:hover .sbs-work-arrow svg { transform: translate(0, 0); }

/* ---------- Icône "retour en haut" ---------- */
.sbs-to-top { transition: border-color .25s; }
@media (min-width: 1025px) { .sbs-to-top:hover { border-color: #1c1c1c !important; } }
.sbs-to-top svg { display: block; width: 100%; height: 100%; }

/* ---------- FAQ (accordéon) ---------- */
.sbs-faq .sbs-faq-item { border-bottom: 1px solid rgba(0,0,0,.2); }
.sbs-faq .sbs-faq-item:first-child { border-top: 1px solid rgba(0,0,0,.2); }
.sbs-faq summary { list-style: none; cursor: pointer; }
.sbs-faq summary::-webkit-details-marker { display: none; }
.sbs-faq .sbs-faq-icon, .sbs-faq .sbs-faq-icon svg { transform: none; }
.sbs-faq .sbs-faq-icon svg { transition: transform .5s; }
.sbs-faq .sbs-faq-icon svg line { stroke-width: 2px; transform-origin: center center; transform-box: fill-box; transition: transform .5s; }
.sbs-faq .sbs-faq-item.is-active .sbs-faq-icon svg { transform: rotate(90deg); }
.sbs-faq .sbs-faq-item.is-active .sbs-faq-icon svg line:nth-child(2) { transform: scaleX(0); }
html.sbs-anim .sbs-faq .sbs-faq-content { overflow: hidden; }

/* ---------- États initiaux des animations (seulement si le JS est actif) ---------- */
html.sbs-anim .sbs-reveal-words,
html.sbs-anim .sbs-blur-chars { opacity: 0; }
.sbs-reveal-words .word { will-change: transform; }

/* ---------- Éléments pilotés par GSAP : pas de transition CSS ---------- */
/* Elementor V4 ajoute « transition: transform .4s » aux conteneurs : cela retarde le scrub GSAP et fait « sauter » l'épinglage. */
.pin-spacer, .pin-spacer > .sbs-features-pin,
.sbs-features-pin, .sbs-cards-row, .sbs-card-1, .sbs-card-2, .sbs-card-3,
.sbs-hero-fade, .sbs-stack-dim, .sbs-slide-up, .sbs-slide-up-touch,
.sbs-work-media, .sbs-work-parallax { transition: none !important; }/* End custom CSS */