.elementor-2733 .elementor-element.elementor-element-e63828d{--display:flex;--min-height:100vh;--overlay-opacity:0.65;}.elementor-2733 .elementor-element.elementor-element-e63828d:not(.elementor-motion-effects-element-type-background), .elementor-2733 .elementor-element.elementor-element-e63828d > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF00;}.elementor-2733 .elementor-element.elementor-element-e63828d::before, .elementor-2733 .elementor-element.elementor-element-e63828d > .elementor-background-video-container::before, .elementor-2733 .elementor-element.elementor-element-e63828d > .e-con-inner > .elementor-background-video-container::before, .elementor-2733 .elementor-element.elementor-element-e63828d > .elementor-background-slideshow::before, .elementor-2733 .elementor-element.elementor-element-e63828d > .e-con-inner > .elementor-background-slideshow::before, .elementor-2733 .elementor-element.elementor-element-e63828d > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:#000000;--background-overlay:'';}.elementor-2733 .elementor-element.elementor-element-e63828d.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-2733 .elementor-element.elementor-element-bac6972 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-2733 .elementor-element.elementor-element-b1b1a48{--display:flex;--min-height:100vh;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:-15px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2733 .elementor-element.elementor-element-33ae43b.elementor-element{--align-self:stretch;--flex-grow:1;--flex-shrink:0;}.elementor-2733 .elementor-element.elementor-element-747d33f{--display:flex;}.elementor-2733 .elementor-element.elementor-element-b97faac{--display:flex;--min-height:545px;--justify-content:center;--gap:0px 40px;--row-gap:0px;--column-gap:40px;--margin-top:-77px;--margin-bottom:37px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;--z-index:1;}.elementor-2733 .elementor-element.elementor-element-33b3252 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-2733 .elementor-element.elementor-element-17a2a28{--display:flex;--min-height:1440px;--margin-top:-147px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--z-index:5;}.elementor-2733 .elementor-element.elementor-element-3cc2e40 > .elementor-widget-container{margin:0px 0px -30px 0px;padding:0px 0px -1px 0px;}.elementor-2733 .elementor-element.elementor-element-3cc2e40.elementor-element{--align-self:center;}.elementor-2733 .elementor-element.elementor-element-6be5a1b{--display:flex;}.elementor-2733 .elementor-element.elementor-element-0c6ecc3 > .elementor-widget-container{margin:0px 0px -157px 0px;padding:0px 0px 0px 0px;}.elementor-2733 .elementor-element.elementor-element-a761e98{--display:flex;--min-height:0px;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-2733 .elementor-element.elementor-element-7ad1595{--display:flex;}.elementor-2733 .elementor-element.elementor-element-2f750b0{--display:flex;}@media(max-width:767px){.elementor-2733 .elementor-element.elementor-element-b1b1a48{--content-width:500px;}}@media(min-width:768px){.elementor-2733 .elementor-element.elementor-element-e63828d{--width:100%;}.elementor-2733 .elementor-element.elementor-element-b1b1a48{--content-width:1600px;}.elementor-2733 .elementor-element.elementor-element-b97faac{--content-width:1600px;}.elementor-2733 .elementor-element.elementor-element-17a2a28{--content-width:1600px;}.elementor-2733 .elementor-element.elementor-element-a761e98{--width:1600px;}.elementor-2733 .elementor-element.elementor-element-7ad1595{--content-width:1600px;}.elementor-2733 .elementor-element.elementor-element-2f750b0{--content-width:1600px;}}/* Start custom CSS for html, class: .elementor-element-bac6972 *//* ===== HERO — Plan 2D (scope strict) ===== */
#sf-hero.sf-hero-plan2d{
  position: relative;
  width: 100vw; max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  min-height: 100svh;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: #0b0b0b;
  color: #fff;
  isolation: isolate;
}

/* Grille + vignette (fond) */
#sf-hero .sf-hero__bg{
  position: absolute; inset: 0;
  pointer-events: none; z-index: 1;
  background:
    linear-gradient(90deg, rgba(255,255,255,.02) 1px, transparent 1px) 0 0 / 40px 40px,
    linear-gradient(0deg,  rgba(255,255,255,.02) 1px, transparent 1px) 0 0 / 40px 40px,
    radial-gradient(60% 60% at 50% 60%, rgba(255,255,255,.02), transparent 60%);
}

/* Plan SVG */
#sf-hero .sf-hero__plan{
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  z-index: 2;
  pointer-events: none;
}

/* >>> Traits d’architecture (opacité réduite) <<< */
#sf-hero .plan path,
#sf-hero .plan line{
  fill: none;
  stroke: #fff;
  stroke-opacity: .55;            /* ↓ avant: .9 */
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
}

/* >>> Côtes / ticks / chiffres (encore plus discrets) <<< */
#sf-hero .dims{
  opacity: 0;
  transform: translateY(6px);
  transition: opacity .5s ease .25s, transform .5s ease .25s;
}
#sf-hero .dims line{
  stroke: rgba(255,255,255,.28);  /* ↓ avant: .6 */
  stroke-width: 1;
}
#sf-hero .dims text{
  font-family: "Montserrat", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  font-weight: 900;
  font-size: 14px;
  letter-spacing: .08em;
  fill: rgba(255,255,255,.26);    /* ↓ avant: .5 */
  user-select: none;
}

/* Animation de tracé */
@keyframes plan-draw { to { stroke-dashoffset: 0; } }

#sf-hero.is-inview .plan--stage1 path{
  animation: plan-draw 1.2s cubic-bezier(.2,.7,.2,1) forwards;
}
#sf-hero.is-inview .plan--stage2 path{
  animation: plan-draw 1.1s cubic-bezier(.2,.7,.2,1) .6s forwards;
}
#sf-hero.is-inview .dims{
  opacity: 1;
  transform: translateY(0);
  transition-delay: 1.4s;
}

/* Contenu */
#sf-hero .sf-hero__inner{
  position: relative; z-index: 3;
  width: min(1180px, 92vw);
  text-align: center;
  padding: clamp(18px, 4vw, 40px);
}
#sf-hero .sf-hero__title{
  margin: 0 0 clamp(18px, 4.6vw, 42px);
  font-family: "Montserrat", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  font-weight: 900;
  letter-spacing: -.01em;
  line-height: .92;
}
#sf-hero .sf-hero__title .line{
  display: block;
  font-size: clamp(36px, 9.4vw, 120px);
}
#sf-hero .sf-hero__title .line--fr{
  font-size: clamp(40px, 12vw, 200px);
}

/* Boutons */
#sf-hero .sf-hero__actions{
  display: inline-grid;
  grid-auto-flow: column;
  gap: clamp(10px, 2.6vw, 18px);
  align-items: center;
  justify-content: center;
  margin: 0 0 clamp(16px, 3.6vw, 28px);
}
#sf-hero .sf-btn{
  --ink: #fff;
  position: relative;
  display: inline-flex; align-items: center; justify-content: center;
  gap: 10px;
  padding: clamp(10px, 1.4vw, 14px) clamp(16px, 2.4vw, 22px);
  border-radius: 999px;
  text-decoration: none;
  cursor: pointer;
  font-family: "Montserrat", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  font-weight: 900; letter-spacing: .02em;
  color: var(--ink);
  transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease, color .2s ease;
  will-change: transform;
}
#sf-hero .sf-btn--primary{
  background: #fff; color: #111;
  box-shadow: 0 10px 30px rgba(0,0,0,.22);
}
#sf-hero .sf-btn--primary:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(0,0,0,.28);
}
#sf-hero .sf-btn--ghost{
  background: transparent; color: #fff; border: 2px solid rgba(255,255,255,.9);
}
#sf-hero .sf-btn--ghost::after{
  content:""; position:absolute; left:10%; right:10%; bottom:8px; height:2px;
  background:#fff; transform: scaleX(0); transform-origin:left; transition: transform .28s ease;
}
#sf-hero .sf-btn--ghost:hover{ transform: translateY(-2px); }
#sf-hero .sf-btn--ghost:hover::after{ transform: scaleX(1); }

/* Tagline */
#sf-hero .sf-hero__tagline{
  margin: 6px 0 0;
  display: grid; gap: 4px;
  align-items: center; justify-items: center;
}
#sf-hero .sf-hero__tagline .blk{
  font-family: "Montserrat", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  font-weight: 900;
  font-size: clamp(18px, 3.6vw, 42px);
  letter-spacing: .01em;
}
#sf-hero .sf-hero__tagline .scr{
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
  font-weight: 600;
  font-size: clamp(16px, 3vw, 36px);
  letter-spacing: .01em;
  opacity: .95;
}

/* Responsive */
@media (max-width: 640px){
  #sf-hero .sf-hero__actions{ grid-auto-flow: row; }
}

/* Motion reduce */
@media (prefers-reduced-motion: reduce){
  #sf-hero .plan path,
  #sf-hero .plan line{ stroke-dashoffset: 0 !important; }
  #sf-hero .dims{ opacity: 1 !important; transform: none !important; transition: none !important; }
  #sf-hero .sf-btn,
  #sf-hero .sf-btn::after{ transition: none !important; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-33ae43b *//* ===== Police d’affichage (AvantGardeLT-Bold) ===== */
@font-face{
  font-family: "AvantGardeLT-Bold";
  src: url("/wp-content/uploads/fonts/AvantGardeLT-Bold.woff2") format("woff2");
  font-weight: 700 900;
  font-style: normal;
  font-display: swap;
}

/* ===== Scope : #sf-tri ===== */
#sf-tri{
  --ff-display: "AvantGardeLT-Bold", "Montserrat", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  /* Ambiance identique à la section “SCÉNOGRAPHIE FRANCE” (fond sombre) */
  --bg-hero: #0b0b0b;
  --ink: #fff;
  --muted: rgba(255,255,255,.34);
  --muted-60: rgba(255,255,255,.60);
  --muted-40: rgba(255,255,255,.48);
  --line: rgba(255,255,255,.10);
  --line-strong: rgba(255,255,255,.26);
  --card: rgba(255,255,255,.04);
  --card-hover: rgba(255,255,255,.07);

  /* Couleurs par item */
  --acc-studio-rgb: 58,198,255;   /* cyan */
  --acc-work-rgb:   255,179,0;    /* ambre */
  --acc-contact-rgb:156,255,110;  /* vert acide */

  /* Layout & rythme */
  --w: min(1240px, 92vw);
  --gap: clamp(46px, 8vw, 110px);      /* plus d’espace vertical entre les 3 items */
  --col-gap: clamp(72px, 12vw, 180px); /* texte de droite plus à droite */
  --pad-block: clamp(60px, 10vw, 130px);
  --pad-inline: clamp(18px, 4vw, 32px);

  background: var(--bg-hero);
  color: var(--ink);
  position: relative;
  isolation: isolate;
  overflow: clip;

  /* Full-bleed Elementor */
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.elementor-widget-html .elementor-widget-container > #sf-tri{ padding-left:0 !important; padding-right:0 !important; }
.e-con-inner:has(#sf-tri), .elementor-container:has(#sf-tri){ padding-left:0 !important; padding-right:0 !important; }

/* ===== Fonds sans cadrillage ===== */
#sf-tri .sf-bg{ position:absolute; inset:0; z-index:0; }
#sf-tri .bg{ position:absolute; inset:0; pointer-events:none; opacity:0; transition: opacity .32s ease, filter .32s ease; }

/* Base : sombre + vignette douce (neutre, statique) */
#sf-tri .bg--base{
  opacity: 1;
  background:
    radial-gradient(900px 500px at 50% 45%, rgba(255,255,255,.05), transparent 60%),
    radial-gradient(1200px 600px at 50% 80%, rgba(0,0,0,.30), transparent 70%),
    var(--bg-hero);
}

/* Studio : lavis cyan, simple */
#sf-tri .bg--studio{
  background:
    radial-gradient(900px 520px at 22% 40%, rgba(var(--acc-studio-rgb), .18), transparent 65%),
    linear-gradient(135deg, rgba(var(--acc-studio-rgb), .10), rgba(0,0,0,0) 60%);
}

/* Work : lavis ambre */
#sf-tri .bg--work{
  background:
    radial-gradient(900px 520px at 70% 35%, rgba(var(--acc-work-rgb), .20), transparent 65%),
    linear-gradient(15deg, rgba(var(--acc-work-rgb), .10), rgba(0,0,0,0) 60%);
}

/* Contact : lavis vert acide */
#sf-tri .bg--contact{
  background:
    radial-gradient(1000px 580px at 70% 50%, rgba(var(--acc-contact-rgb), .18), transparent 65%),
    linear-gradient(200deg, rgba(var(--acc-contact-rgb), .10), rgba(0,0,0,0) 60%);
}

/* Voile pour la lisibilité du texte, toujours actif */
#sf-tri .bg--shade{
  opacity: 1;
  background: radial-gradient(1200px 650px at 50% 50%, rgba(0,0,0,0) 0%, rgba(0,0,0,.28) 58%, rgba(0,0,0,.54) 100%);
}

/* ===== Layout interne ===== */
#sf-tri .sf-wrap{
  position: relative; z-index: 1;
  max-width: var(--w); margin: 0 auto;
  padding: var(--pad-block) var(--pad-inline);
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(560px, 1.7fr);
  column-gap: var(--col-gap);
  row-gap: clamp(18px, 3vw, 28px);
  align-items: start;
}

/* Liste gauche */
#sf-tri .sf-list{ position: relative; display: grid; gap: var(--gap); }
#sf-tri .sf-rail{ position: absolute; left: -24px; top: 8px; bottom: 8px; width: 1px; background: var(--line); }

#sf-tri .sf-item{
  position: relative; display: inline-block;
  text-decoration: none; color: var(--muted);
  cursor: pointer; padding: 12px 2px 14px; outline: none;
}
#sf-tri .sf-item__text{
  font-family: var(--ff-display);
  font-weight: 900; letter-spacing: -.01em; line-height: 1.02;
  font-size: clamp(40px, 7vw, 88px);  /* plus grand mais hyper propre */
  transition: transform .28s cubic-bezier(.2,.7,0,1), color .2s ease, text-shadow .28s ease, filter .28s ease;
}
#sf-tri .sf-item__underline{
  position: absolute; left: 0; bottom: 0; height: 2px; width: 0;
  background: #fff; transition: width .28s ease;
}
/* underline color par item */
#sf-tri .sf-item[data-key="studio"]  .sf-item__underline{ background: rgb(var(--acc-studio-rgb)); }
#sf-tri .sf-item[data-key="work"]    .sf-item__underline{ background: rgb(var(--acc-work-rgb)); }
#sf-tri .sf-item[data-key="contact"] .sf-item__underline{ background: rgb(var(--acc-contact-rgb)); }

/* Panneaux droite */
#sf-tri .sf-panels{ display: grid; gap: clamp(16px, 2.4vw, 22px); transform: translateX(10px); }
#sf-tri .sf-panel{
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: clamp(18px, 3vw, 28px);
  color: var(--muted-40);
  box-shadow: 0 10px 30px rgba(0,0,0,.14);
  transition: transform .25s ease, color .25s ease, border-color .25s ease, background .25s ease, box-shadow .25s ease;
}
#sf-tri .sf-panel__title{
  margin: 0 0 10px;
  font: 900 clamp(16px, 1.4vw, 18px) var(--ff-display);
  letter-spacing: .02em;
  color: var(--muted-60);
}
#sf-tri .sf-panel p{
  margin: 0 0 10px;
  font-size: clamp(14px, 1.12vw, 16px);
  line-height: 1.65;
}

/* ===== États au survol / focus (via :has) ===== */
#sf-tri:has(.sf-item[data-key="studio"]:is(:hover,:focus-visible)) .bg--base{ opacity:.6; }
#sf-tri:has(.sf-item[data-key="studio"]:is(:hover,:focus-visible)) .bg--studio{ opacity:1; }
#sf-tri:has(.sf-item[data-key="studio"]:is(:hover,:focus-visible)) .sf-item[data-key="studio"] .sf-item__text{
  color:#fff; transform: translateX(6px);
  text-shadow: 0 0 18px rgba(var(--acc-studio-rgb), .55); filter: saturate(1.2);
}
#sf-tri:has(.sf-item[data-key="studio"]:is(:hover,:focus-visible)) .sf-item[data-key="studio"] .sf-item__underline{ width:100%; }
#sf-tri:has(.sf-item[data-key="studio"]:is(:hover,:focus-visible)) .sf-panel[data-panel="studio"]{
  color:#fff; border-color: rgba(var(--acc-studio-rgb), .40); background: var(--card-hover); transform: translateX(8px);
  box-shadow: 0 0 0 1px rgba(var(--acc-studio-rgb), .18) inset, 0 10px 30px rgba(0,0,0,.18);
}

#sf-tri:has(.sf-item[data-key="work"]:is(:hover,:focus-visible)) .bg--base{ opacity:.6; }
#sf-tri:has(.sf-item[data-key="work"]:is(:hover,:focus-visible)) .bg--work{ opacity:1; }
#sf-tri:has(.sf-item[data-key="work"]:is(:hover,:focus-visible)) .sf-item[data-key="work"] .sf-item__text{
  color:#fff; transform: translateX(6px);
  text-shadow: 0 0 18px rgba(var(--acc-work-rgb), .55); filter: saturate(1.2);
}
#sf-tri:has(.sf-item[data-key="work"]:is(:hover,:focus-visible)) .sf-item[data-key="work"] .sf-item__underline{ width:100%; }
#sf-tri:has(.sf-item[data-key="work"]:is(:hover,:focus-visible)) .sf-panel[data-panel="work"]{
  color:#fff; border-color: rgba(var(--acc-work-rgb), .40); background: var(--card-hover); transform: translateX(8px);
  box-shadow: 0 0 0 1px rgba(var(--acc-work-rgb), .18) inset, 0 10px 30px rgba(0,0,0,.18);
}

#sf-tri:has(.sf-item[data-key="contact"]:is(:hover,:focus-visible)) .bg--base{ opacity:.6; }
#sf-tri:has(.sf-item[data-key="contact"]:is(:hover,:focus-visible)) .bg--contact{ opacity:1; }
#sf-tri:has(.sf-item[data-key="contact"]:is(:hover,:focus-visible)) .sf-item[data-key="contact"] .sf-item__text{
  color:#fff; transform: translateX(6px);
  text-shadow: 0 0 18px rgba(var(--acc-contact-rgb), .55); filter: saturate(1.2);
}
#sf-tri:has(.sf-item[data-key="contact"]:is(:hover,:focus-visible)) .sf-item[data-key="contact"] .sf-item__underline{ width:100%; }
#sf-tri:has(.sf-item[data-key="contact"]:is(:hover,:focus-visible)) .sf-panel[data-panel="contact"]{
  color:#fff; border-color: rgba(var(--acc-contact-rgb), .40); background: var(--card-hover); transform: translateX(8px);
  box-shadow: 0 0 0 1px rgba(var(--acc-contact-rgb), .18) inset, 0 10px 30px rgba(0,0,0,.18);
}

/* Focus clavier */
#sf-tri .sf-item:focus-visible{ outline:2px solid rgba(255,255,255,.85); outline-offset:4px; }

/* Mobile / tablette */
@media (max-width: 1024px){
  #sf-tri .sf-wrap{ grid-template-columns: 1fr; column-gap: 0; }
  #sf-tri .sf-panels{ transform:none; }
  #sf-tri .sf-rail{ left:-12px; }
}

/* SR-only */
#sf-tri .sr-only{
  position: absolute !important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

/* Fallback JS utilitaire (si :has non supporté) */
#sf-tri .sf-item.is-on .sf-item__text{ color:#fff; transform: translateX(6px); }
#sf-tri .sf-item.is-on .sf-item__underline{ width:100%; }/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-b1b1a48 *//* ====== FONDS ANIMÉS (robuste, sans '.elementor-2733 .elementor-element.elementor-element-b1b1a48') ====== */
#triBg{
  position: relative;
  min-height: 100vh;
  background: #000;
  overflow: hidden;

  /* intensité ultra light */
  --ink-05: rgba(255,255,255,.05);
  --ink-03: rgba(255,255,255,.03);
  --ink-02: rgba(255,255,255,.02);

  --pat-default:
    repeating-linear-gradient(0deg,   var(--ink-02) 0 1px, transparent 1px 24px),
    repeating-linear-gradient(90deg,  var(--ink-02) 0 1px, transparent 1px 24px);

  --pat-anim: none;
}

/* couche motif */
#triBg::after{
  content:"";
  position:absolute; inset:0;
  background-image: var(--pat-default);
  background-size: 24px 24px, 24px 24px;
  background-position: 0 0, 0 0;
  opacity: .12;                 /* ↓ augmente/baisse l’intensité globale */
  pointer-events:none;
  will-change: background-position, background-size, opacity;
  animation: var(--pat-anim);
  z-index:0;
}

/* overlay lisibilité (facultatif) */
#triBg::before{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.22), rgba(0,0,0,.22));
  pointer-events:none; z-index:0;
}

/* le contenu par-dessus */
#triBg > .e-con-inner,
#triBg > .elementor-container{ position:relative; z-index:1; }

/* === Variants avec :has() (si supporté par le navigateur) === */
#triBg:has(.big-item.agency:hover),
#triBg:has(.big-item.agency:focus-visible){
  --pat-default:
    repeating-linear-gradient(135deg, var(--ink-05) 0 2px, transparent 2px 16px);
  --pat-anim: slideDiag 12s linear infinite;
}

#triBg:has(.big-item.entertainment:hover),
#triBg:has(.big-item.entertainment:focus-visible){
  --pat-default:
    repeating-linear-gradient(0deg,   var(--ink-03) 0 1px, transparent 1px 22px),
    repeating-linear-gradient(90deg,  var(--ink-03) 0 1px, transparent 1px 22px),
    radial-gradient(ellipse at center, rgba(255,255,255,.035) 0%, rgba(255,255,255,0) 60%);
  --pat-anim: gridPulse 6s ease-in-out infinite;
}

#triBg:has(.big-item.sfx:hover),
#triBg:has(.big-item.sfx:focus-visible){
  --pat-default:
    repeating-linear-gradient(0deg, var(--ink-05) 0 2px, transparent 2px 14px);
  --pat-anim: scanY 5.5s linear infinite;
}

/* === Fallback via data-attr (si :has() non supporté) === */
#triBg[data-bg="agency"]::after{
  background-image:
    repeating-linear-gradient(135deg, var(--ink-05) 0 2px, transparent 2px 16px);
  animation: slideDiag 12s linear infinite;
}
#triBg[data-bg="entertainment"]::after{
  background-image:
    repeating-linear-gradient(0deg,   var(--ink-03) 0 1px, transparent 1px 22px),
    repeating-linear-gradient(90deg,  var(--ink-03) 0 1px, transparent 1px 22px),
    radial-gradient(ellipse at center, rgba(255,255,255,.035) 0%, rgba(255,255,255,0) 60%);
  animation: gridPulse 6s ease-in-out infinite;
}
#triBg[data-bg="sfx"]::after{
  background-image:
    repeating-linear-gradient(0deg, var(--ink-05) 0 2px, transparent 2px 14px);
  animation: scanY 5.5s linear infinite;
}

/* Animations */
@keyframes slideDiag{
  0%{   background-position: 0 0; }
  100%{ background-position: 16px 0; }
}
@keyframes scanY{
  0%{   background-position: 0 0; }
  100%{ background-position: 0 14px; }
}
@keyframes gridPulse{
  0%,100%{ background-size: 22px 22px, 22px 22px, auto; }
  50%    { background-size: 24px 24px, 24px 24px, auto; }
}

/* Motion préférences */
@media (prefers-reduced-motion: reduce){
  #triBg::after{ animation: none !important; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-2eb1eb4 *//* CSS — Curseur custom (scopé par id) */
:root{
  /* Taille et image du curseur —> remplace l’URL ci-dessous par la tienne */
  --sf-cursor-size: 112px;
  --sf-cursor-img: url('https://scenographie-france.fr/wp-content/uploads/2025/09/cursor-scenographie-france.png'); /* ← REMPLACE ICI */
}

html, body { cursor: none; } /* on masque le curseur natif sur desktop */

#sf-cursor.sf-cursor{
  position: fixed; top: 0; left: 0;
  width: var(--sf-cursor-size); height: var(--sf-cursor-size);
  pointer-events: none; z-index: 99999;
  transform: translate(-50%,-50%);
  opacity: 0; will-change: transform, opacity, filter;
  background: var(--sf-cursor-img) center/contain no-repeat;
  filter: drop-shadow(0 6px 18px rgba(0,0,0,.35));
  transition: opacity .18s ease, filter .18s ease;
}

/* états */
#sf-cursor.is-visible   { opacity: 1; }
#sf-cursor.is-link      { filter: drop-shadow(0 10px 26px rgba(0,0,0,.45)); }
#sf-cursor.is-pressed   { transform: translate(-50%,-50%) scale(.96); }

/* masques d’accessibilité : on retire le curseur custom au-dessus de champs */
input:hover ~ #sf-cursor,
textarea:hover ~ #sf-cursor,
[contenteditable="true"]:hover ~ #sf-cursor { display:none; }

/* Touch / mobiles : on ne force pas le curseur custom */
@media (hover:none), (pointer:coarse){
  html, body { cursor: auto; }
  #sf-cursor { display:none !important; }
}

/* Réduction de mouvement : pas de rotation fluide, transitions minimes */
@media (prefers-reduced-motion: reduce){
  #sf-cursor { transition: none; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-33b3252 *//* LOGO WALL — V6.2 (edge-to-edge, sans masque) */
#sf-logo-wall{
  --sf-gap: clamp(48px, 6vw, 120px);    /* espace entre logos */
  --sf-row-pad: 0px;                    /* 0 = bord franc */
  position: relative;
  width: 100%;
  overflow: hidden;                     /* limite à 100% largeur */
  padding: var(--sf-row-pad) 0;
  box-sizing: border-box;
}

#sf-logo-wall .sf-row{
  display: flex;
  justify-content: flex-start;          /* collé à gauche */
  align-items: center;
  overflow: visible;
  pointer-events: none;                 /* le track gère le hover */
}

#sf-logo-wall .sf-track{
  display: flex;
  gap: var(--sf-gap);
  align-items: center;
  justify-content: flex-start;
  white-space: nowrap;
  will-change: transform;
  transform: translate3d(var(--sf-tx, 0px), 0, 0);
  pointer-events: auto;
  margin: 0;
  padding: 0;
}

#sf-logo-wall .sf-track li{
  list-style: none;
  flex: 0 0 auto;
  margin: 0;
  padding: 0;
}

#sf-logo-wall .sf-track img{
  height: clamp(54px, 8vw, 110px);
  width: auto;
  display: block;
  opacity: 0.95;
  transition: transform .25s ease, opacity .25s ease;
  will-change: transform;
}

#sf-logo-wall .sf-track img:hover{
  transform: translateY(-2px);
  opacity: 1;
}

@media (prefers-reduced-motion: reduce){
  #sf-logo-wall .sf-track{ transform: none !important; }
}

/* === V6.3 — Full-bleed dans Elementor (edge-to-edge) === */

/* 1) Le <section id="sf-logo-wall"> déborde du conteneur Elementor pour toucher les bords */
#sf-logo-wall{
  /* annule tout padding interne éventuel */
  padding: 0 !important;

  /* full-bleed */
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}

/* 2) Supprime le padding horizontal du widget qui contient le mur (ciblage fin Elementor) */
.elementor-widget-html .elementor-widget-container > #sf-logo-wall{
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* 3) (Option robuste) enlève tout padding horizontal du widget HTML
   qui héberge ton mur — n’affecte QUE ce widget */
.elementor-widget-html .elementor-widget-container{
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* 4) Sécurité côté liste : un <ul> a du padding par défaut, on le tue */
#sf-logo-wall .sf-track{
  margin: 0 !important;
  padding: 0 !important;           /* <- enlève le retrait à gauche natif du UL */
}

/* 5) Pas de marge interne sur la rangée */
#sf-logo-wall .sf-row{
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* 6) Si ton parent Elementor a un “gabarit” qui ajoute du padding (rare mais vu) :
   le sélecteur ci-dessous le neutralise UNIQUEMENT quand il contient #sf-logo-wall. 
   (OK navigateurs modernes ; si tu veux éviter :has, laisse tel quel, 1)–5) suffisent 99% du temps) */
.e-con-inner:has(#sf-logo-wall),
.elementor-container:has(#sf-logo-wall){
  padding-left: 0 !important;
  padding-right: 0 !important;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-3cc2e40 *//* ============= CSS — V5.5 scoped #sf-projects-split ============= */
#sf-projects-split.sfp{
  /* Full-bleed (même si conteneur Elementor est boxed) */
  position:relative; left:50%; right:50%; margin-left:-50vw; margin-right:-50vw;
  width:100vw; max-width:100vw;

  --bg:#000; --fg:#fff; --muted:#bdbdbd; --line:#202020; --rad:20px;
  --ease:cubic-bezier(.2,.7,.2,1);
  background:var(--bg); color:var(--fg);
  display:grid; grid-template-columns:minmax(280px,520px) 1fr;
}

/* Colonne gauche sticky */
#sf-projects-split .sfp-left{
  position:sticky; top:0; align-self:start;
  min-height:100svh; padding:clamp(24px,4vw,48px);
  border-right:1px solid var(--line);
  display:flex; flex-direction:column; gap:18px;
  font-family: Inter, Montserrat, system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
}
#sf-projects-split .sfp-eyebrow{ text-transform:uppercase; letter-spacing:.14em; color:var(--muted); margin:0; font-size:12px; }
#sf-projects-split .sfp-title{ margin:.2rem 0 .4rem; font-weight:800; letter-spacing:-.02em; line-height:1.02; font-size: clamp(32px,3.8vw,56px); }
#sf-projects-split .sfp-lead{ color:var(--muted); margin:0 0 .6rem; line-height:1.6; }
#sf-projects-split .sfp-stats{ display:flex; gap:16px; list-style:none; padding:0; margin:.2rem 0 1rem; flex-wrap:wrap; }
#sf-projects-split .sfp-stats strong{ font-weight:800; margin-right:.25rem; }
#sf-projects-split .sfp-count{ color:#d9d9d9; margin-top:auto; font-size:13px; }

/* Grille */
#sf-projects-split .sfp-right{ min-height:100%; }
#sf-projects-split .sfp-grid{
  display:grid; gap:16px; padding:clamp(16px,3vw,32px);
  grid-template-columns: repeat(4, minmax(0,1fr));
}
#sf-projects-split .span-2{ grid-column: span 2; }

/* Card */
#sf-projects-split .sfp-card{
  position:relative; overflow:hidden; border-radius:var(--rad);
  background:#0b0b0b; border:1px solid #1a1a1a;
  box-shadow: 0 12px 36px rgba(0,0,0,.35), 0 2px 8px rgba(0,0,0,.45);
  transition: transform .22s var(--ease), box-shadow .22s var(--ease);
  outline:none;
  --tx:0px; --ty:0px; /* tilt/depth vars */
}
#sf-projects-split .sfp-card:hover{
  transform:translateY(-2px) rotate(-0.2deg);
  box-shadow: 0 18px 50px rgba(0,0,0,.45), 0 3px 12px rgba(0,0,0,.5);
}
#sf-projects-split .sfp-card:focus-visible{ outline:2px solid #fff; outline-offset:2px; }

#sf-projects-split .sfp-media{ position:relative; aspect-ratio:16/11; overflow:hidden; }
#sf-projects-split .sfp-cover{
  width:100%; height:100%; object-fit:cover; display:block;
  transform: translate3d(var(--tx),var(--ty),0) scale(1.02); /* tilt/depth non flou */
  will-change: transform;
  transition: transform .25s var(--ease), filter .25s var(--ease), opacity .25s var(--ease);
}
#sf-projects-split .sfp-gradient{
  position:absolute; inset:0; pointer-events:none;
  background:
    linear-gradient(to top, rgba(0,0,0,.72) 0%, rgba(0,0,0,.35) 36%, rgba(0,0,0,0) 60%),
    radial-gradient(80% 80% at 50% 50%, rgba(0,0,0,0) 40%, rgba(0,0,0,.35) 100%);
}

/* Contact sheet overlay */
#sf-projects-split .sfp-contactsheet{
  position:absolute; right:10px; bottom:10px; display:flex; gap:6px; z-index:2;
  opacity:0; transform: translateY(6px); transition: opacity .2s var(--ease), transform .2s var(--ease);
}
#sf-projects-split .sfp-contactsheet img{
  width:64px; height:46px; object-fit:cover; border-radius:8px;
  border:1px solid rgba(255,255,255,.15); background:#111;
  box-shadow:0 6px 16px rgba(0,0,0,.35);
}
#sf-projects-split .sfp-card:hover .sfp-contactsheet{ opacity:1; transform:none; }

/* Bouton Quick View magnétique */
#sf-projects-split .sfp-qv-btn{
  position:absolute; bottom:10px; right:10px; z-index:3;
  background:rgba(255,255,255,.1); color:#fff; border:1px solid rgba(255,255,255,.28);
  border-radius:12px; padding:9px 12px; font:600 12px/1 Inter,sans-serif; cursor:pointer;
  backdrop-filter: blur(4px);
  opacity:0; transform: translateY(8px); transition: opacity .2s var(--ease), transform .2s var(--ease);
  /* magnet vars */
  --mx:0px; --my:0px;
}
#sf-projects-split .sfp-card:hover .sfp-qv-btn{ opacity:1; transform: translate(var(--mx), var(--my)); }
#sf-projects-split .sfp-qv-btn:focus-visible{ outline:2px solid #fff; outline-offset:2px; }

/* Infos */
#sf-projects-split .sfp-info{ padding:12px 12px 14px; }
#sf-projects-split .sfp-tags{ display:flex; gap:8px; list-style:none; padding:0; margin:0 0 4px; }
#sf-projects-split .sfp-tags li{ font:600 11px/1 Inter,sans-serif; color:#d9d9d9; background:#121212; border:1px solid #222; padding:6px 8px; border-radius:999px; }
#sf-projects-split .sfp-h3{ margin:.2rem 0 .2rem; font-weight:800; letter-spacing:-.01em; font-size: clamp(16px,1.6vw,20px); color:#fff; transition:color .2s var(--ease); }
#sf-projects-split .sfp-card:hover .sfp-h3{ color:#cfcfcf; }
#sf-projects-split .sfp-peek{ margin:0; color:#bdbdbd; font-size:13px; line-height:1.5; }

/* CTA intégrée */
#sf-projects-split .sfp-card--cta{
  display:grid; place-items:center; text-align:center; background:linear-gradient(180deg,#0b0b0b,#0a0a0a);
}
#sf-projects-split .sfp-card--cta .sfp-cta-inner{ padding:clamp(18px,3vw,36px); display:grid; gap:10px; }
#sf-projects-split .sfp-cta-eyebrow{ margin:0; color:#bdbdbd; letter-spacing:.12em; text-transform:uppercase; font:600 12px/1 Inter,sans-serif; }
#sf-projects-split .sfp-cta-title{ margin:0; font-weight:900; letter-spacing:-.02em; font-size:clamp(22px,3.4vw,34px); }
#sf-projects-split .sfp-cta-sub{ margin:0; color:#cfcfcf; }
#sf-projects-split .sfp-cta-arrow{ font-size:24px; opacity:.9; }

/* Quick-View enrichi */
#sf-projects-split .sfp-qv-overlay{
  position:fixed; inset:0; background:rgba(0,0,0,.5); backdrop-filter: blur(2px);
  opacity:0; pointer-events:none; transition:opacity .25s var(--ease); z-index:40;
}
#sf-projects-split .sfp-qv-overlay.is-open{ opacity:1; pointer-events:auto; }
#sf-projects-split .sfp-qv{
  position:fixed; top:0; right:0; height:100svh;
  width:clamp(360px, 38vw, 560px); background:#0c0c0c; border-left:1px solid #222;
  transform: translateX(105%); transition: transform .28s var(--ease);
  z-index:41; display:flex; flex-direction:column;
}
#sf-projects-split .sfp-qv[aria-hidden="false"]{ transform:none; }
#sf-projects-split .sfp-qv-close{
  position:absolute; top:10px; right:10px; background:#111; color:#fff; border:1px solid #333; border-radius:10px; padding:6px 10px; cursor:pointer;
}
#sf-projects-split .sfp-qv-body{ margin-top:44px; padding:18px; display:grid; gap:14px; grid-template-columns:1fr; }
#sf-projects-split .sfp-qv-media{ display:grid; gap:8px; }
#sf-projects-split .sfp-qv-img{ width:100%; height:52svh; object-fit:cover; border-radius:12px; border:1px solid #222; background:#111; }
#sf-projects-split .sfp-qv-thumbs{ display:flex; gap:8px; flex-wrap:wrap; }
#sf-projects-split .sfp-qv-thumbs button{
  width:84px; height:60px; border-radius:8px; overflow:hidden; border:1px solid #222; background:#111; cursor:pointer;
}
#sf-projects-split .sfp-qv-thumbs img{ width:100%; height:100%; object-fit:cover; display:block; filter:grayscale(.1); }
#sf-projects-split .sfp-qv-copy{ display:grid; gap:10px; }
#sf-projects-split .sfp-qv-title{ margin:0; font-weight:800; letter-spacing:-.01em; font-size: clamp(18px,2.2vw,24px); }
#sf-projects-split .sfp-qv-text{ margin:0; color:#cfcfcf; line-height:1.6; }
#sf-projects-split .sfp-qv-meta{ list-style:none; padding:0; margin:0; display:flex; gap:10px; flex-wrap:wrap; }
#sf-projects-split .sfp-qv-meta li{ font:600 12px/1 Inter,sans-serif; color:#ddd; background:#121212; border:1px solid #222; padding:6px 8px; border-radius:999px; }
#sf-projects-split .sfp-btn{ display:inline-flex; align-items:center; justify-content:center; padding:12px 16px; border-radius:999px; text-decoration:none; font:700 13px/1 Inter,sans-serif; border:1px solid #333; color:#fff; }
#sf-projects-split .sfp-btn--primary{ background:#fff; color:#000; border-color:#fff; }

/* Responsive */
@media (max-width: 1200px){
  #sf-projects-split .sfp-grid{ grid-template-columns: repeat(3, minmax(0,1fr)); }
}
@media (max-width: 900px){
  #sf-projects-split.sfp{ grid-template-columns:1fr; }
  #sf-projects-split .sfp-left{ position:relative; min-height:auto; border-right:none; border-bottom:1px solid var(--line); }
  #sf-projects-split .sfp-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 600px){
  #sf-projects-split .sfp-grid{ grid-template-columns:1fr; }
}

/* Motion reduce */
@media (prefers-reduced-motion: reduce){
  #sf-projects-split .sfp-card, #sf-projects-split .sfp-cover{ transition:none !important; }
  #sf-projects-split .sfp-qv{ transition:none !important; }
}

/* === CTA “mot entouré au stylo” — V5.5 === */
#sf-projects-split .sfp-card--cta{
  display:grid; place-items:center; text-align:left;
  background:linear-gradient(180deg,#0b0b0b,#0a0a0a);
}
#sf-projects-split .sfp-card--cta .sfp-cta-inner{
  width:min(820px,92%); padding:clamp(20px,3.5vw,40px);
  display:grid; grid-template-columns:1fr auto; gap:12px; align-items:center;
}
#sf-projects-split .sfp-card--cta .sfp-cta-title{
  margin:0;
  color:#fff;  /* blanc fixe */
  font-weight:900; letter-spacing:-.02em; line-height:1.1;
  font-size:clamp(24px,3.8vw,40px);  /* + grand qu’avant */
}
#sf-projects-split .sfp-card--cta .sfp-cta-arrow{
  font-size:24px; color:#fff; opacity:.95;
  transition:transform .25s var(--ease);
}
#sf-projects-split .sfp-card--cta:hover .sfp-cta-arrow{ transform:translateX(4px); }
/* aucun changement de couleur au hover */
#sf-projects-split .sfp-card--cta .sfp-card-link{ color:inherit; }
#sf-projects-split .sfp-card--cta:hover .sfp-cta-title{ color:#fff; }

/* Bloc “mot entouré” */
#sf-projects-split .sfp-ring{ position:relative; display:inline-block; isolation:isolate; }
#sf-projects-split .sfp-ring-word{ position:relative; z-index:2; padding:0 .06em; font-weight:900; color:#fff; }
#sf-projects-split .sfp-ring-svg{
  position:absolute; inset:0; width:100%; height:100%;
  transform:scale(1.1); /* léger débord pour un bel anneau */
  z-index:1; overflow:visible; pointer-events:none;
}
#sf-projects-split .sfp-ring-path{
  fill:none;
  stroke:#ff2a2a;            /* stylo rouge */
  stroke-width:3.2;          /* trait “feutre” */
  stroke-linecap:round; stroke-linejoin:round;
  /* on arme via JS avec --len */
  stroke-dasharray: var(--len,0);
  stroke-dashoffset: var(--len,0);
  filter: drop-shadow(0 0 8px rgba(255,42,42,.35));
}

/* animation “handwriting” (déssine le cercle) */
#sf-projects-split .sfp-ring-path.is-draw{
  animation: sfp-draw 900ms cubic-bezier(.22,.7,.2,1) forwards;
}
@keyframes sfp-draw {
  to { stroke-dashoffset: 0; }
}

/* Focus accessibilité */
#sf-projects-split .sfp-card--cta .sfp-card-link:focus-visible{
  outline:2px solid #fff; outline-offset:4px; border-radius:12px;
}

/* (optionnel) petit tilt sans flou au hover du CTA entier */
#sf-projects-split .sfp-card--cta{ will-change: transform; }
@media (hover:hover){
  #sf-projects-split .sfp-card--cta:hover{ transform: translateY(-2px) rotate(-0.2deg); }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-0c6ecc3 *//* =========================
   CSS — Split Hero Catégories
   À coller dans le CSS global (ou un widget <style>)
   Scopé sur #sf-split-hero
========================= */
#sf-split-hero{
  --bg-left:#F2F2F2;    /* panneau gauche gris clair */
  --bg-right:#fff;      /* panneau droit blanc */
  --fg:#000; --muted:#4a4a4a;
  --ease:cubic-bezier(.2,.7,.2,1);
  --shadow: 0 24px 60px rgba(0,0,0,.08), 0 8px 22px rgba(0,0,0,.06);
  position: relative;
  /* plein écran horizontal, même dans une section Elementor "boxed" */
  left: 50%; right: 50%; margin-left: -50vw; margin-right: -50vw; width: 100vw;
  min-height: min(92vh, 900px);
  color: var(--fg);
  display: grid;
  grid-template-columns: 1fr 1fr;
}

#sf-split-hero .sf-left{
  background: var(--bg-left);
  display:grid; place-items:center;
}
#sf-split-hero .sf-left-inner{
  width:min(900px, 92%);
  /* serrer à gauche comme demandé */
  margin-left: clamp(0px, 2vw, 24px);
  padding: clamp(28px, 4vw, 72px) clamp(24px, 4vw, 56px);
}
#sf-split-hero .sf-eyebrow{
  margin:0 0 .6rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted);
  font: 600 12px/1 Inter, Montserrat, system-ui, sans-serif;
}
#sf-split-hero .sf-title{
  margin:0 0 .4rem; line-height:1.04; letter-spacing:-.01em;
  font: 800 clamp(28px, 4.5vw, 52px)/1.04 Inter, Montserrat, system-ui, sans-serif;
}
#sf-split-hero .sf-lead{
  margin:.4rem 0 1.4rem; color:#333; line-height:1.6; font-size: clamp(14px, 1.15vw, 18px);
}
#sf-split-hero .sf-actions{ display:flex; gap:12px; flex-wrap:wrap; }
#sf-split-hero .sf-btn{
  display:inline-flex; align-items:center; justify-content:center;
  border-radius:999px; padding:14px 22px; text-decoration:none; will-change:transform, box-shadow;
  transition: transform .22s var(--ease), box-shadow .22s var(--ease), background .22s var(--ease), color .22s var(--ease);
  font-weight:700; letter-spacing:.2px;
}
#sf-split-hero .sf-btn--primary{ background:#000; color:#fff; box-shadow: var(--shadow); }
#sf-split-hero .sf-btn--primary:hover{ transform: translateY(-1px) scale(1.015); box-shadow: 0 28px 70px rgba(0,0,0,.12), 0 10px 26px rgba(0,0,0,.08); }
#sf-split-hero .sf-btn--ghost{ background:transparent; color:#000; border:1px solid #111; }
#sf-split-hero .sf-btn:focus-visible{ outline:2px solid #000; outline-offset:3px; }

/* Colonne droite */
#sf-split-hero .sf-right{
  position:relative; background: var(--bg-right);
  display:grid; place-items:center; overflow:hidden;
}
#sf-split-hero .sf-cats{
  position:relative; z-index:2; list-style:none; margin:0; padding: clamp(24px, 4vw, 56px);
  width:min(880px, 92%); display:flex; flex-direction:column; gap: clamp(10px, 1.4vw, 18px);
}
#sf-split-hero .sf-row{
  position:relative; display:grid;
  grid-template-columns: auto 1fr auto; align-items:center; gap:14px;
  padding: clamp(12px, 1.2vw, 16px) clamp(12px, 1.6vw, 20px);
  border-radius: 14px; text-decoration:none; color:#111; background: rgba(255,255,255,.86);
  backdrop-filter: blur(2px);
  box-shadow: 0 1px 0 rgba(0,0,0,.04);
  transition: transform .18s var(--ease), box-shadow .18s var(--ease), background .18s var(--ease);
  will-change: transform;
}
#sf-split-hero .sf-row:focus-visible{ outline:2px solid #000; outline-offset:3px; }
#sf-split-hero .sf-row:hover{ transform: translateX(4px); box-shadow: 0 10px 26px rgba(0,0,0,.08), 0 2px 10px rgba(0,0,0,.06); background:#fff; }

#sf-split-hero .sf-dot{ font-weight:900; transform: translateY(-1px); }
#sf-split-hero .sf-label{
  font: 700 clamp(16px, 2.2vw, 28px)/1.1 Inter, Montserrat, system-ui, sans-serif;
  letter-spacing:-.01em; position:relative;
}
/* Souligné directionnel “ink” */
#sf-split-hero .sf-label::before{
  content:""; position:absolute; left:0; bottom:-6px; height:2px; width:100%;
  background:#111; transform-origin:left; transform: scaleX(0);
  transition: transform .18s var(--ease);
}
#sf-split-hero .sf-row:hover .sf-label::before{ transform: scaleX(1); }
#sf-split-hero .sf-arrow{ transition: transform .22s var(--ease), opacity .22s var(--ease); opacity:.9; }
#sf-split-hero .sf-row:hover .sf-arrow{ transform: translateX(12px) rotate(-2deg); }

/* Hint clavier */
#sf-split-hero .sf-hint{
  position:absolute; bottom:18px; right:22px; z-index:2;
  margin:0; font: 500 12px/1 Inter, system-ui, sans-serif; color:#666; opacity:.8;
}

/* Pré-view (fond contrôlé par hover) */
#sf-split-hero .sf-preview{
  position:absolute; inset:0; z-index:1; pointer-events:none; opacity:0;
  transition: opacity .2s var(--ease), transform .2s var(--ease);
  /* masque pour ne pas gêner la lisibilité sous les listes */
  mask-image: linear-gradient(90deg, rgba(0,0,0,0) 0%, #000 10%, #000 100%);
  -webkit-mask-image: linear-gradient(90deg, rgba(0,0,0,0) 0%, #000 10%, #000 100%);
}
#sf-split-hero .sf-preview-img,
#sf-split-hero .sf-preview video{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
}
#sf-split-hero .sf-preview.is-on{ opacity:.94; }

/* “Aimantation” très subtile de la pré-view */
#sf-split-hero[data-magnet="on"] .sf-preview{ transform: translate(var(--mx,0), var(--my,0)); }

/* Responsive */
@media (max-width: 1024px){
  #sf-split-hero{ grid-template-columns: 1fr; }
  #sf-split-hero .sf-left{ order:1; }
  #sf-split-hero .sf-right{ order:2; min-height: 60vh; }
  #sf-split-hero .sf-left-inner{ margin-left: 0; }
}
@media (prefers-reduced-motion: reduce){
  #sf-split-hero .sf-row, #sf-split-hero .sf-preview{ transition:none !important; }
  #sf-split-hero{ --ease: linear; }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-17a2a28 *//* ---------- Base & grille ---------- */
#projets-grid {
  --radius: 20px;
  --gap: 20px;
  --shadow: 0 10px 30px rgba(0,0,0,.12);
  --shadow-hover: 0 18px 50px rgba(0,0,0,.18);
  --text: #121212;
  --muted: #6b6b6b;
  --chip-evenement: #00bcd4; /* cyan */
  --chip-decor: #9b51e0;     /* violet */
  --chip-festival: #ff9800;  /* orange */
  font-family: "Inter","Montserrat",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  color: var(--text);
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--gap);
}

#projets-grid .visually-hidden {
  position: absolute!important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0);
  border: 0;
}

/* Responsive */
@media (max-width: 1199px) {
  #projets-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 991px) {
  #projets-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 479px) {
  #projets-grid { grid-template-columns: 1fr; }
}

/* ---------- Carte ---------- */
#projets-grid .fm-card {
  position: relative;
  display: block;
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow);
  isolation: isolate;
  background: #0b0b0b; /* fallback */
  min-height: 340px;
  /* accessibilité focus */
  outline: none;
}
#projets-grid .fm-card:focus-visible {
  outline: 3px solid #111;
  box-shadow: 0 0 0 4px rgba(0,188,212,.35), var(--shadow-hover);
}

/* Carte mise en avant */
#projets-grid .fm-card.featured {
  grid-column: span 2;
  grid-row: span 2;
  min-height: 520px;
}
@media (max-width: 1199px) {
  #projets-grid .fm-card.featured {
    grid-column: span 2;
    grid-row: span 1;
    min-height: 420px;
  }
}
@media (max-width: 991px) {
  #projets-grid .fm-card.featured { grid-column: span 2; }
}
@media (max-width: 479px) {
  #projets-grid .fm-card.featured { grid-column: span 1; }
}

/* Inner pour tilt & perf */
#projets-grid .fm-card-inner {
  position: relative;
  height: 100%;
  transform-style: preserve-3d;
  transition: transform 220ms ease, box-shadow 220ms ease;
  will-change: transform;
}

/* Ambient glow (reprend l'image comme bg flouté) */
#projets-grid .fm-card::before {
  content: "";
  position: absolute; inset: -12%;
  background-image: var(--bg);
  background-size: cover; background-position: center;
  filter: blur(30px) saturate(1.15) opacity(.45);
  z-index: 0; pointer-events: none;
  transition: filter 220ms ease, opacity 220ms ease;
}

/* Couverture & vidéo */
#projets-grid .fm-cover,
#projets-grid .project-video-bg {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: 1;
}

#projets-grid .project-video-bg {
  opacity: 0;
  transition: opacity 240ms ease;
}

/* Overlay dégradé pour lisibilité texte */
#projets-grid .fm-gradient {
  position: absolute; inset: 0 0 0 0;
  background: linear-gradient(to top, rgba(0,0,0,.65) 0%, rgba(0,0,0,.35) 35%, rgba(0,0,0,0) 60%);
  z-index: 2; pointer-events: none;
}

/* Infos (chips + titre) */
#projets-grid .fm-info {
  position: absolute; left: 0; right: 0; bottom: 0;
  padding: 16px 18px 18px;
  z-index: 3;
  display: grid; gap: 8px;
}

#projets-grid .fm-tags {
  list-style: none; display: flex; gap: 8px; margin: 0; padding: 0;
  flex-wrap: wrap;
}
#projets-grid .chip {
  --bg: #333; --fg: #fff;
  font-size: 12px; line-height: 1;
  padding: 7px 10px;
  border-radius: 999px;
  background: var(--bg); color: var(--fg);
  font-weight: 600; letter-spacing: .2px;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
}
#projets-grid .chip-evenement { --bg: var(--chip-evenement); }
#projets-grid .chip-decor { --bg: var(--chip-decor); }
#projets-grid .chip-festival { --bg: var(--chip-festival); }

#projets-grid .fm-title {
  margin: 0;
  color: #fff;
  font-size: clamp(18px, 2.2vw, 24px);
  font-weight: 700;
  text-shadow: 0 1px 2px rgba(0,0,0,.45);
}

/* Peek panel (apercu) */
#projets-grid .fm-peek {
  position: absolute; left: 12px; right: 12px; bottom: 12px;
  z-index: 4;
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(18,18,18,.7);
  backdrop-filter: blur(6px);
  color: #fff;
  transform: translateY(110%);
  transition: transform 220ms ease, opacity 220ms ease;
  opacity: 0;
}
#projets-grid .fm-peek p { margin: 0 0 8px; font-size: 14px; line-height: 1.35; }
#projets-grid .fm-cta {
  display: inline-block;
  font-weight: 700;
  font-size: 13px;
  padding: 8px 12px;
  border-radius: 10px;
  background: #ffffff;
  color: #111;
}

/* Hover / intention */
#projets-grid .fm-card.is-hovering .fm-peek,
#projets-grid .fm-card:focus-visible .fm-peek {
  transform: translateY(0);
  opacity: 1;
}

/* Micro-motion */
#projets-grid .fm-card:hover .fm-card-inner { box-shadow: var(--shadow-hover); }
#projets-grid .fm-card:hover .fm-cover { transform: scale(1.02); transition: transform 220ms ease; }
#projets-grid .fm-card:hover::before { filter: blur(36px) saturate(1.2) opacity(.55); }

/* Skeleton loading */
#projets-grid .fm-card.is-loading .fm-cover {
  filter: blur(8px) brightness(.9) saturate(.9);
  opacity: .7;
}
#projets-grid .fm-card.is-ready .fm-cover {
  filter: none; opacity: 1; transition: opacity 260ms ease, filter 260ms ease;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  #projets-grid .fm-card-inner,
  #projets-grid .fm-cover,
  #projets-grid .project-video-bg,
  #projets-grid .fm-peek { transition: none !important; }
}

/* Utilitaires */
#projets-grid img { max-width: 100%; display: block; }/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-02d730e *//* === V6 — Full-screen CTA avec maquette en avant-plan === */
#cta-sf-v6.sf{
  --bg:#000; --fg:#fff; --muted:#bdbdbd; --ease:cubic-bezier(.2,.7,.2,1);
  width:100vw; min-height:100svh; position:relative; overflow:hidden; background:var(--bg); color:var(--fg);
  font-family: Inter, Montserrat, system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
}

/* Fond discret (grain + vignette + grille) */
#cta-sf-v6 .sf-bg{ position:absolute; inset:0; z-index:0; pointer-events:none; }
#cta-sf-v6 .sf-noise{
  position:absolute; inset:-50%; opacity:.06; mix-blend-mode:overlay; background:
  radial-gradient(1px 1px at 20% 30%, #fff 30%, transparent 31%),
  radial-gradient(1px 1px at 80% 70%, #fff 30%, transparent 31%),
  radial-gradient(1px 1px at 60% 40%, #fff 30%, transparent 31%),
  radial-gradient(1px 1px at 40% 80%, #fff 30%, transparent 31%);
  background-size: 3px 3px, 3px 3px, 3px 3px, 3px 3px;
  filter: blur(.6px);
}
#cta-sf-v6 .sf-vignette{
  position:absolute; inset:0;
  background:
    linear-gradient(90deg, rgba(0,0,0,.65) 0%, rgba(0,0,0,.45) 34%, rgba(0,0,0,.28) 56%, rgba(0,0,0,.62) 100%),
    radial-gradient(90% 90% at 50% 50%, rgba(0,0,0,0) 38%, rgba(0,0,0,.65) 100%);
}
#cta-sf-v6 .sf-gridlines{
  position:absolute; inset:0; mix-blend-mode:soft-light; opacity:.22;
  background-image:
    linear-gradient(transparent 95%, rgba(255,255,255,.09) 96%),
    linear-gradient(90deg, transparent 95%, rgba(255,255,255,.09) 96%);
  background-size: 100% 24px, 24px 100%;
}

/* Mise en page */
#cta-sf-v6 .sf-shell{ position:relative; z-index:1; min-height:100svh; display:grid; place-items:center; padding:clamp(24px,5vw,64px); }
#cta-sf-v6 .sf-content{
  width:min(1300px,92vw);
  display:grid; grid-template-columns: 1.15fr .85fr; align-items:center; gap:clamp(24px,4vw,56px);
}

/* Maquette en avant-plan (suit la souris) */
#cta-sf-v6 .sf-col--visual{ position:relative; }
#cta-sf-v6 .sf-maquette{
  position:relative; width:100%; aspect-ratio: 16/10; margin:0;
  transform-style:preserve-3d; perspective:1000px; will-change:transform;
  /* apparitions */
  opacity:0; translate:0 24px; transition:opacity .7s var(--ease), translate .7s var(--ease);
}
#cta-sf-v6.sf--inview .sf-maquette{ opacity:1; translate:0 0; }
#cta-sf-v6 .sf-maquette-img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:contain;
  filter: grayscale(1) contrast(1.1);
  transform: translateZ(40px); /* avance dans la profondeur */
  will-change: transform;
}
#cta-sf-v6 .sf-maquette-shine{
  position:absolute; inset:-10%;
  background: radial-gradient(60% 60% at 20% 10%, rgba(255,255,255,.18), transparent 60%);
  mix-blend-mode:screen; filter: blur(8px); opacity:.5; pointer-events:none; transform: translateZ(80px);
}
#cta-sf-v6 .sf-maquette-shadow{
  position:absolute; left:6%; right:6%; bottom:-6%;
  height:18%; background: radial-gradient(60% 80% at 50% 10%, rgba(0,0,0,.55), transparent 70%);
  filter: blur(8px); transform: translateZ(0);
}

/* Texte & CTA */
#cta-sf-v6 .sf-eyebrow{ margin:0 0 .6rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); font-size:12px; }
#cta-sf-v6 .sf-title{ margin:0; font-weight:800; letter-spacing:-.02em; line-height:1.02; font-size: clamp(34px, 6vw, 76px); }
#cta-sf-v6 .sf-sub{ color:var(--muted); line-height:1.6; margin:.8rem 0 1.4rem; font-size: clamp(14px,1.2vw,18px); }
#cta-sf-v6 .sf-stats{ display:flex; gap:20px; flex-wrap:wrap; padding:0; margin:0 0 1.4rem; list-style:none; }
#cta-sf-v6 .sf-stats li{ color:#d9d9d9; } 
#cta-sf-v6 .sf-stats strong{ color:#fff; font-weight:800; margin-right:.35em; }

#cta-sf-v6 .sf-actions{ display:flex; gap:12px; flex-wrap:wrap; }
#cta-sf-v6 .sf-btn{ position:relative; display:inline-flex; align-items:center; justify-content:center; padding:14px 22px; border-radius:999px; text-decoration:none; transition:transform .25s var(--ease), box-shadow .25s var(--ease), background .25s var(--ease); will-change:transform; }
#cta-sf-v6 .sf-btn--primary{ background:#fff; color:#000; border:1px solid #fff; box-shadow:0 12px 32px rgba(0,0,0,.35), 0 2px 6px rgba(0,0,0,.4); }
#cta-sf-v6 .sf-btn--ghost{ background:transparent; color:#fff; border:1px solid #777; }
#cta-sf-v6 .sf-btn:hover{ transform:translateY(-1px) scale(1.02); }
#cta-sf-v6 .sf-btn:focus-visible{ outline:2px solid #fff; outline-offset:2px; }

/* Curseur */
#cta-sf-v6 .sf-cursor{
  position:fixed; top:0; left:0; width:18px; height:18px; border-radius:50%; border:1px solid rgba(255,255,255,.6);
  transform:translate(-50%,-50%); pointer-events:none; z-index:3; opacity:0; transition:opacity .2s var(--ease);
}

/* Responsive */
@media (max-width: 992px){
  #cta-sf-v6 .sf-content{ grid-template-columns:1fr; }
  #cta-sf-v6 .sf-col--visual{ order:-1; }
}
@media (prefers-reduced-motion: reduce){
  #cta-sf-v6 .sf-maquette, #cta-sf-v6 .sf-maquette-img{ transition:none; transform:none !important; }
  #cta-sf-v6 .sf-cursor{ display:none; }
}
/* Patch : garder la maquette en couleur */
#cta-sf-v6 .sf-maquette-img{
  filter: none !important; /* supprime le noir & blanc */
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-a761e98 *//* ===== CTA Scénographie France — Full Screen (applique au conteneur parent) ===== */
.elementor-element.cta-sf-full{
  position: relative;
  width: 100vw;
  min-height: 100svh;            /* plein écran, safe sur mobile */
  margin: 0 !important;
  padding: 0 !important;
  background: #000;
  color: #fff;
  display: flex;
  align-items: center;
  overflow: clip;                 /* coupe les débords d'effets */
  isolation: isolate;            /* pour superposer des effets sans fuite */
}

/* Le inner d’Elementor est souvent boxed : on force full-bleed */
.elementor-element.cta-sf-full > .e-con-inner{
  max-width: none !important;
  width: 100% !important;
  padding: clamp(24px, 6vw, 80px) clamp(20px, 6vw, 80px);
  display: grid;
  row-gap: 24px;
  justify-items: start;
}

/* Fond discret haut de gamme (grain + vignette + grille fine) */
.elementor-element.cta-sf-full::before{
  content:"";
  position:absolute; inset:-40%;
  background:
    radial-gradient(1px 1px at 20% 30%, #fff 28%, transparent 30%),
    radial-gradient(1px 1px at 75% 70%, #fff 28%, transparent 30%),
    radial-gradient(1px 1px at 55% 45%, #fff 28%, transparent 30%),
    radial-gradient(1px 1px at 35% 80%, #fff 28%, transparent 30%);
  background-size: 3px 3px, 3px 3px, 3px 3px, 3px 3px;
  filter: blur(0.6px);
  opacity:.06; 
  mix-blend-mode: overlay;
  z-index: 0;
  pointer-events:none;
}
.elementor-element.cta-sf-full::after{
  content:"";
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.65)),
    radial-gradient(90% 90% at 50% 50%, transparent 40%, rgba(0,0,0,.55) 100%);
  opacity:.9;
  z-index: 0;
  pointer-events:none;
}

/* Calage du contenu au-dessus des effets */
.elementor-element.cta-sf-full > .e-con-inner > *{
  position: relative;
  z-index: 1;
}

/* Typo & hiérarchie (basé sur ton HTML fourni) */
.elementor-element.cta-sf-full h6.elementor-heading-title{
  margin: 0 0 .6rem 0;
  text-transform: uppercase;
  letter-spacing: .14em;
  font-weight: 600;
  opacity: .75;
}
.elementor-element.cta-sf-full h2.elementor-heading-title{
  margin: 0 0 1.2rem 0;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.02;
  font-size: clamp(32px, 5.2vw, 72px);
}

/* Bouton Elementor – premium noir & blanc */
.elementor-element.cta-sf-full .elementor-widget-button .elementor-button{
  --ease: cubic-bezier(.2,.7,.2,1);
  border-radius: 999px;
  padding: 14px 22px;
  background: #fff;
  color: #000;
  border: 1px solid #fff;
  box-shadow: 0 12px 32px rgba(0,0,0,.35), 0 2px 6px rgba(0,0,0,.4);
  transform: translateZ(0); 
  transition: transform .25s var(--ease), box-shadow .25s var(--ease), background .25s var(--ease), color .25s var(--ease);
}
.elementor-element.cta-sf-full .elementor-widget-button .elementor-button:hover{
  transform: translateY(-2px) scale(1.02);
  box-shadow: 0 18px 48px rgba(0,0,0,.45), 0 4px 10px rgba(0,0,0,.5);
}

/* Micro-layout : centre vertical, largeur lisible */
@media (min-width: 1024px){
  .elementor-element.cta-sf-full > .e-con-inner{
    width: min(1200px, 92vw) !important;
  }
}

/* Respect accessibilité / users qui préfèrent moins d’animations */
@media (prefers-reduced-motion: reduce){
  .elementor-element.cta-sf-full .elementor-widget-button .elementor-button{
    transition: none;
  }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-a7d4f76 *//* ================== LOGOS ================== */
.sf-logos-section{--fade-w:70px;--logo-h:64px;--gap:4rem;background:#fff;padding:64px 0;position:relative;overflow:hidden}
.sf-logos-wrapper{display:flex;flex-direction:column;gap:44px;position:relative}
.sf-logos-wrapper::before,.sf-logos-wrapper::after{content:"";position:absolute;top:0;bottom:0;width:var(--fade-w);pointer-events:none;z-index:2}
.sf-logos-wrapper::before{left:0;background:linear-gradient(90deg,#fff,rgba(255,255,255,0))}
.sf-logos-wrapper::after{right:0;background:linear-gradient(270deg,#fff,rgba(255,255,255,0))}
.sf-row{overflow:hidden}
.sf-row .sf-track{display:flex;gap:var(--gap);align-items:center;will-change:transform;animation:sf-marquee linear infinite;animation-play-state:var(--play, running);animation-direction:var(--dir, normal)}
.sf-row .sf-track>li{list-style:none;flex:0 0 auto}
.sf-row img{height:var(--logo-h);width:auto;object-fit:contain;filter:grayscale(100%);opacity:.9;transition:opacity .25s ease,filter .25s ease;will-change:filter,opacity}
.sf-row img:hover{opacity:1;filter:grayscale(0)}
@keyframes sf-marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
@media (max-width:1024px){.sf-logos-section{--logo-h:56px;--fade-w:50px}}
@media (max-width:640px){.sf-logos-section{--logo-h:44px;--fade-w:36px;--gap:2.25rem}}
@media (prefers-reduced-motion:reduce){
  .sf-row .sf-track{animation:none;transform:none}
}

/* ================== PROJETS ================== */
.sf-projects-section{--radius:16px;--shadow:0 10px 30px rgba(0,0,0,.35);--ease:cubic-bezier(.2,.7,.2,1);--accent:#ff474a;background:#000;color:#fff;padding:96px 24px}
.sf-header{text-align:center;max-width:1100px;margin:0 auto 28px}
.sf-eyebrow{text-transform:uppercase;letter-spacing:.18em;color:#9b9b9b;font:600 12px/1.2 system-ui;margin:0 0 8px}
.sf-title{font-family:Montserrat,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:800;font-size:clamp(28px,5vw,60px);margin:0}
.sf-sub{color:#c9c9c9;margin:.5rem 0 0}
.sf-grid{--cols:4;display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));gap:20px;max-width:1400px;margin:32px auto 0}
@media (max-width:1200px){.sf-grid{--cols:3}}
@media (max-width:900px){.sf-grid{--cols:2}}
@media (max-width:520px){.sf-grid{--cols:1}}

.sf-card{position:relative;overflow:hidden;border-radius:var(--radius);background:#0f0f0f;box-shadow:var(--shadow);transform:translateY(18px);opacity:0;transition:transform .7s var(--ease),opacity .7s var(--ease),box-shadow .3s ease}
.sf-card.visible{transform:translateY(0);opacity:1}
.sf-card:hover{box-shadow:0 14px 40px rgba(0,0,0,.55)}
.sf-media{position:relative;width:100%;padding-top:66%;background-image:var(--img);background-size:cover;background-position:center;transition:opacity .35s ease}
.sf-card h3{position:relative;margin:0;padding:14px 14px 16px;font:700 1.05rem/1.2 Inter,system-ui;color:#fff;z-index:2}
.sf-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 60%,rgba(0,0,0,.55) 100%);opacity:.8;pointer-events:none;z-index:1}

/* Sheen au hover */
@media (hover:hover){
  .sf-card::before{content:"";position:absolute;inset:-20%;background:linear-gradient(110deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.18) 20%,rgba(255,255,255,0) 40%);transform:translateX(-120%);transition:transform .9s var(--ease);mix-blend-mode:screen;z-index:2}
  .sf-card:hover::before{transform:translateX(20%)}
  .sf-card:hover .sf-media{transform:scale(1.02)}
}

/* Vidéo injectée au survol */
.sf-video-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:inherit;z-index:0;opacity:0;transition:opacity .25s ease}
.sf-card.has-video .sf-media{opacity:0}
.sf-video-bg.is-visible{opacity:1}

/* Focus accessibilité */
.sf-card:focus-within,.sf-card:focus{outline:2px solid var(--accent);outline-offset:2px}

/* Reduced motion */
@media (prefers-reduced-motion:reduce){
  .sf-card,.sf-media{transition:none}
  .sf-card{transform:none;opacity:1}
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-08c7f8f *//* SECTION full-bleed, fond noir */
#sf-loop-hero{
  width:100vw; max-width:100vw;
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
  background:#000; color:#fff;
  overflow:hidden;
  /* padding vertical */
  padding-block: clamp(16px, 4vw, 40px);
  /* variables */
  --stroke: 2px;            /* épaisseur contour */
  --speed: 38s;             /* vitesse de défilement (↓ = plus vite) */
}

/* conteneur loop */
#sf-loop-hero .sf-loop{
  position:relative;
  overflow:hidden;
  /* légère atténuation des bords (facultatif) */
  -webkit-mask-image: linear-gradient(to right, transparent 0, #000 8%, #000 92%, transparent 100%);
  mask-image: linear-gradient(to right, transparent 0, #000 8%, #000 92%, transparent 100%);
}

/* piste qui défile (deux contenus identiques = boucle parfaite) */
#sf-loop-hero .sf-track{
  display:flex;
  width:max-content;
  animation: sf-marquee var(--speed) linear infinite;
  will-change: transform;
}

/* bloc de texte */
#sf-loop-hero .sf-content{
  display:flex; align-items:center; gap:2rem;
  padding-inline: 2rem;
  white-space: nowrap;
  font-weight:800;
  letter-spacing:-.02em;
  line-height:1;
  font-size: clamp(42px, 9vw, 270px);
}

/* style outline + plein */
#sf-loop-hero .sf-outline{
  -webkit-text-stroke: var(--stroke) #fff;
  text-stroke: var(--stroke) #fff;
  color: transparent;
}
#sf-loop-hero .sf-fill{ color:#fff; }

/* Fallback Firefox : simuler le contour avec text-shadow */
@supports not (-webkit-text-stroke: 1px #fff) {
  #sf-loop-hero .sf-outline{
    color:transparent;
    text-shadow:
      var(--stroke) 0 0 #fff, calc(-1*var(--stroke)) 0 0 #fff,
      0 var(--stroke) 0 #fff,  0 calc(-1*var(--stroke)) 0 #fff,
      calc(var(--stroke)*.7) calc(var(--stroke)*.7) 0 #fff,
      calc(-1*var(--stroke)*.7) calc(var(--stroke)*.7) 0 #fff,
      calc(-1*var(--stroke)*.7) calc(-1*var(--stroke)*.7) 0 #fff,
      calc(var(--stroke)*.7) calc(-1*var(--stroke)*.7) 0 #fff;
  }
}

/* animation */
@keyframes sf-marquee{
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); } /* -50% car 2 blocs identiques côte à côte */
}

/* Accessibilité : réduire/stopper l’animation si préférence */
@media (prefers-reduced-motion: reduce){
  #sf-loop-hero .sf-track{ animation-duration: 120s; }
}
#sf-loop-hero:hover .sf-track{ animation-play-state: paused; }
/* Avant Garde pour la loop */
#sf-loop-hero .sf-content{
  font-family:
    "itc-avant-garde-gothic-pro",       /* nom Adobe Fonts courant */
    "ITC Avant Garde Gothic Pro",
    "AvantGardeGothicITCW01D",
    "AvantGarde LT Pro",
    "URW Gothic", "Century Gothic",
    Montserrat, system-ui, sans-serif;
  font-weight: 700;
  letter-spacing: -0.03em; /* tracking serré à la Avant Garde */
}/* End custom CSS */