{"id":9,"date":"2026-02-11T08:58:40","date_gmt":"2026-02-11T08:58:40","guid":{"rendered":"http:\/\/scenographie-rennes.fr\/?page_id=9"},"modified":"2026-05-04T15:20:58","modified_gmt":"2026-05-04T15:20:58","slug":"scenographie-evenementielle-rennes","status":"publish","type":"page","link":"https:\/\/scenographie-rennes.fr\/","title":{"rendered":"Sc\u00e9nographie &#8211; \u00c9v\u00e9nementielle Rennes"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"9\" class=\"elementor elementor-9\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5396ea3 e-con-full e-flex e-con e-parent\" data-id=\"5396ea3\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-92b4a39 elementor-widget elementor-widget-html\" data-id=\"92b4a39\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n  :root{\n    --bg:#030303;\n    --accent:#fff;\n    --text-dim:rgba(255,255,255,.4);\n    --line:rgba(255,255,255,.06);\n    --font-title:'Montserrat',sans-serif;\n    --font-body:'Manrope',sans-serif;\n    --font-mono:'Space Mono',monospace;\n    --ease:cubic-bezier(0.16,1,0.3,1);\n    --accent-highlight:#ededed;\n    --accent-text-dark:#030303;\n    --title-soft:#ededed;\n\n    \/* Bretagne vars (kept) *\/\n    --bzh-ice: rgba(210, 225, 235, .85);\n    --bzh-mint: rgba(145, 190, 175, .75);\n    --bzh-ink: rgba(0,0,0,.55);\n    --bzh-line: rgba(237,237,237,.10);\n    --bzh-glow: rgba(145, 190, 175, .12);\n\n    \/* Mobile tokens *\/\n    --pad-x: 5vw;\n    --pad-y: 120px;\n    --pad-x-m: 8vw;\n    --pad-y-m: 76px;\n    --radius: 14px;\n    --right-col-width: 420px;\n  }\n\n  html, body{ overflow-x:hidden; }\n\n  .sp-paris-wrap{\n    background:var(--bg);\n    color:var(--accent);\n    font-family:var(--font-body);\n    overflow-x:hidden;\n    position:relative;\n    margin-bottom:0!important;\n    padding-bottom:0!important;\n  }\n  .sp-paris-wrap *{box-sizing:border-box; -webkit-font-smoothing:antialiased;}\n\n  \/* NO ANIMS *\/\n  .sp-paris-wrap *{ animation:none!important; transition:none!important; }\n\n  \/* Decorative layers *\/\n  .sp-paris-wrap .grid-overlay{\n    position:absolute; inset:0;\n    background-image:\n      linear-gradient(to right, var(--line) 1px, transparent 1px),\n      linear-gradient(to bottom, var(--line) 1px, transparent 1px);\n    background-size:10vw 10vw;\n    z-index:-2; pointer-events:none;\n  }\n  .sp-paris-wrap .spotlight{\n    position:absolute; top:-20%; left:-10%;\n    width:80vw; height:80vh;\n    background:radial-gradient(circle, rgba(255,255,255,.03) 0%, transparent 70%);\n    z-index:-1; pointer-events:none;\n  }\n\n  .sp-paris-wrap nav{\n    position:absolute; top:0; left:0; right:0;\n    height:100px; padding:0 var(--pad-x);\n    display:flex; justify-content:flex-end; align-items:center;\n    border-bottom:1px solid var(--line);\n    z-index:10;\n  }\n  .sp-paris-wrap .nav-info{\n    font-family:var(--font-mono);\n    font-size:9px;\n    color:var(--text-dim);\n    text-transform:uppercase;\n    letter-spacing:.18em;\n  }\n\n  .sp-paris-wrap section{\n    padding:var(--pad-y) var(--pad-x);\n    border-bottom:1px solid var(--line);\n    position:relative;\n  }\n\n  \/* HERO *\/\n  .sp-paris-wrap .hero{\n    min-height:100vh;\n    display:flex;\n    flex-direction:column;\n    justify-content:center;\n    padding-top:100px;\n    position:relative;\n  }\n  .sp-paris-wrap .title-block{margin-bottom:clamp(40px,8vw,80px);}\n  .sp-paris-wrap .h1-main{\n    font-family:var(--font-title)!important;\n    font-weight:900!important;\n    font-size:clamp(3.5rem,12vw,11rem)!important;\n    line-height:.20!important;\n    letter-spacing:-.07em!important;\n    text-transform:uppercase!important;\n    white-space:nowrap;\n    color:var(--title-soft)!important;\n  }\n  .sp-paris-wrap .h1-sub{display:flex; align-items:center; gap:20px; margin-top:5px;}\n  .sp-paris-wrap .h1-location{\n    font-family:var(--font-title)!important;\n    font-weight:900!important;\n    font-size:clamp(3.5rem,12vw,11rem)!important;\n    line-height:.78!important;\n    letter-spacing:-.07em!important;\n    text-transform:uppercase!important;\n    color:var(--title-soft)!important;\n  }\n  .sp-paris-wrap .h1-marker{\n    font-family:var(--font-mono);\n    font-size:11px;\n    color:var(--text-dim);\n    text-transform:uppercase;\n    writing-mode:vertical-lr;\n    height:clamp(50px,8vw,100px);\n    border-left:1px solid var(--accent);\n    padding-left:10px;\n  }\n\n  .sp-paris-wrap .description-text{\n    font-size:1.05rem;\n    font-weight:200;\n    color:var(--text-dim);\n    line-height:1.45;\n    letter-spacing:0.01em;\n    max-width:720px;\n  }\n  .sp-paris-wrap .description-text strong{color:var(--accent); font-weight:500;}\n\n  .sp-paris-wrap .service-list{list-style:none; margin-top:18px; padding-left:0;}\n  .sp-paris-wrap .service-item{\n    padding:15px 0;\n    border-bottom:1px solid var(--line);\n    display:flex;\n    justify-content:space-between;\n    align-items:center;\n    font-family:var(--font-mono);\n    font-size:10px;\n    letter-spacing:.1em;\n    text-transform:uppercase;\n    color:var(--text-dim);\n    gap:16px;\n  }\n  .sp-paris-wrap .service-item span{\n    color:var(--accent);\n    font-family:var(--font-body);\n    font-weight:600;\n    font-size:14px;\n  }\n\n  .sp-paris-wrap .frame-visual{\n    position:relative;\n    background:#0a0a0a;\n    border:1px solid var(--line);\n    padding:10px;\n    overflow:hidden;\n    border-radius:var(--radius);\n  }\n  .sp-paris-wrap .video-box{\n    position:relative;\n    width:100%;\n    aspect-ratio:16\/10;\n    overflow:hidden;\n    background:#000;\n    border-radius:calc(var(--radius) - 6px);\n  }\n  .sp-paris-wrap video{width:100%; height:100%; object-fit:cover; opacity:.92;}\n  .sp-paris-wrap .frame-visual::after{display:none;}\n\n  .sp-paris-wrap .cta-container{margin-top:30px; display:flex; gap:20px; flex-wrap:wrap;}\n  .sp-paris-wrap .btn-main,\n  .sp-paris-wrap .btn-ghost{\n    padding:20px 40px;\n    font-family:var(--font-mono);\n    font-size:11px;\n    letter-spacing:.2em;\n    text-transform:uppercase;\n    text-decoration:none;\n    display:inline-block;\n    border-radius:12px;\n  }\n  .sp-paris-wrap .btn-main{\n    background:var(--accent);\n    color:#000!important;\n  }\n  .sp-paris-wrap .btn-ghost{\n    color:var(--accent)!important;\n    border:1px solid var(--line);\n    background:rgba(255,255,255,.00);\n  }\n\n  .sp-paris-wrap .h2-editorial{\n    font-family:var(--font-title);\n    font-weight:800;\n    font-size:clamp(2rem,5vw,4.3rem);\n    line-height:1.1;\n    text-transform:uppercase;\n    letter-spacing:-.05em;\n    color:var(--title-soft)!important;\n  }\n  .sp-paris-wrap .editorial-grid{\n    display:grid;\n    grid-template-columns:1fr 1fr;\n    gap:10vw;\n    margin-bottom:100px;\n  }\n\n  .sp-paris-wrap .expertise-container{margin-top:80px;}\n  .sp-paris-wrap .expertise-header{\n    font-family:var(--font-mono);\n    font-size:11px;\n    letter-spacing:.3em;\n    text-transform:uppercase;\n    color:var(--text-dim);\n    margin-bottom:40px;\n    display:flex;\n    align-items:center;\n    gap:20px;\n  }\n  .sp-paris-wrap .expertise-header::after{content:\"\"; flex:1; height:1px; background:var(--line);}\n  .sp-paris-wrap .expertise-grid{\n    display:grid;\n    grid-template-columns:repeat(3,1fr);\n    gap:1px;\n    background:var(--line);\n    border:1px solid var(--line);\n    border-radius:var(--radius);\n    overflow:hidden;\n  }\n\n  .sp-paris-wrap a.expertise-item{\n    display:block;\n    text-decoration:none;\n    color:inherit;\n    background:var(--bg);\n    padding:60px 40px;\n    position:relative;\n    cursor:pointer;\n    outline:none;\n  }\n  .sp-paris-wrap a.expertise-item::before{\n    content:\"[ \" attr(data-code) \" ]\";\n    font-family:var(--font-mono);\n    font-size:9px;\n    color:var(--text-dim);\n    display:block;\n    margin-bottom:25px;\n  }\n  .sp-paris-wrap a.expertise-item::after{\n    content:\"\u2197\";\n    position:absolute;\n    right:18px;\n    top:18px;\n    font-family:var(--font-mono);\n    font-size:11px;\n    color:rgba(237,237,237,.45);\n    opacity:.85;\n  }\n  .sp-paris-wrap .expertise-title{\n    font-family:var(--font-title);\n    font-weight:700;\n    font-size:1.5rem;\n    text-transform:uppercase;\n    line-height:1.2;\n    color:var(--title-soft)!important;\n  }\n\n  .sp-paris-wrap .event-section{\n    display:grid;\n    grid-template-columns:1.2fr .8fr;\n    gap:10vw;\n    align-items:center;\n  }\n  .sp-paris-wrap .event-types{\n    margin-top:40px;\n    display:grid;\n    grid-template-columns:1fr 1fr;\n    gap:20px;\n  }\n  .sp-paris-wrap .event-card{\n    padding:25px;\n    border:1px solid var(--line);\n    background:rgba(255,255,255,.02);\n    border-radius:var(--radius);\n  }\n  .sp-paris-wrap .event-card h4{\n    font-family:var(--font-mono);\n    font-size:11px;\n    letter-spacing:.1em;\n    text-transform:uppercase;\n    margin-bottom:10px;\n    color:var(--title-soft)!important;\n  }\n  .sp-paris-wrap .event-card p{font-size:.9rem; color:var(--text-dim); line-height:1.4;}\n\n  .sp-paris-wrap .stands-section{background:#060606;}\n  .sp-paris-wrap .stands-grid{\n    display:grid;\n    grid-template-columns:1fr 1fr;\n    gap:60px;\n    align-items:center;\n  }\n\n  .sp-paris-wrap .impact-box{\n    border:1px solid var(--accent);\n    padding:clamp(40px,6vw,80px);\n    position:relative;\n    margin-top:60px;\n    border-radius:var(--radius);\n  }\n  .sp-paris-wrap .impact-box::after{\n    content:\"ARCHITECTURAL IMPACT\";\n    position:absolute; top:0; right:40px; transform:translateY(-50%);\n    background:#060606; padding:0 15px;\n    font-family:var(--font-mono); font-size:9px; color:var(--text-dim); letter-spacing:.22em;\n  }\n  .sp-paris-wrap .impact-box h3{\n    font-family:var(--font-title);\n    font-size:1.5rem;\n    text-transform:uppercase;\n    margin-bottom:20px;\n    color:var(--title-soft)!important;\n  }\n\n  \/* FOOTER *\/\n  .sp-paris-wrap footer.site-footer{\n    padding:120px var(--pad-x) 70px;\n    border-top:1px solid var(--line);\n    background:\n      radial-gradient(900px circle at 20% 25%, rgba(255,255,255,.04), transparent 60%),\n      radial-gradient(900px circle at 80% 75%, rgba(255,255,255,.02), transparent 60%);\n    position:relative;\n    overflow:hidden;\n    margin-bottom:0!important;\n  }\n  .sp-paris-wrap .footer-scan{\n    position:absolute; inset:0; pointer-events:none;\n    background:linear-gradient(to bottom, transparent, rgba(255,255,255,.035), transparent);\n    opacity:.35;\n  }\n  .sp-paris-wrap .footer-grid{display:grid; grid-template-columns:1.35fr .85fr; gap:8vw; align-items:start;}\n  .sp-paris-wrap .footer-kicker{\n    font-family:var(--font-mono);\n    font-size:10px;\n    letter-spacing:.26em;\n    text-transform:uppercase;\n    color:var(--text-dim);\n    display:flex;\n    gap:16px;\n    align-items:center;\n    margin-bottom:18px;\n  }\n  .sp-paris-wrap .footer-kicker::after{content:\"\"; flex:1; height:1px; background:var(--line);}\n  .sp-paris-wrap .footer-title{\n    font-family:var(--font-title);\n    font-weight:900;\n    text-transform:uppercase;\n    letter-spacing:-.03em;\n    line-height:1.02;\n    font-size:clamp(2.2rem,5vw,4.6rem);\n    margin-bottom:18px;\n    color:var(--title-soft)!important;\n    position:relative;\n  }\n  .sp-paris-wrap .footer-title::after{\n    content:\"\";\n    position:absolute;\n    left:0;\n    bottom:-10px;\n    width:88px;\n    height:1px;\n    background:rgba(237,237,237,.35);\n    opacity:.9;\n  }\n  .sp-paris-wrap .footer-lead{color:var(--text-dim); font-weight:200; line-height:1.85; font-size:1.05rem; max-width:560px;}\n  .sp-paris-wrap .footer-cta{margin-top:34px; display:flex; gap:14px; flex-wrap:wrap;}\n  .sp-paris-wrap .footer-panel{border:1px solid var(--line); background:rgba(255,255,255,.02); padding:26px; border-radius:var(--radius);}\n  .sp-paris-wrap .footer-list{list-style:none; margin-top:16px; padding-left:0;}\n  .sp-paris-wrap .footer-link{\n    display:flex;\n    justify-content:space-between;\n    gap:18px;\n    padding:12px 0;\n    border-bottom:1px solid var(--line);\n    text-decoration:none;\n    color:var(--accent);\n  }\n  .sp-paris-wrap .footer-link small{\n    font-family:var(--font-mono);\n    font-size:9px;\n    letter-spacing:.22em;\n    text-transform:uppercase;\n    color:var(--text-dim);\n  }\n  .sp-paris-wrap .footer-link span{font-weight:600; font-size:14px;}\n  .sp-paris-wrap .footer-bottom{\n    margin-top:70px;\n    padding-top:24px;\n    border-top:1px solid var(--line);\n    display:flex;\n    justify-content:space-between;\n    align-items:center;\n    gap:20px;\n    flex-wrap:wrap;\n  }\n  .sp-paris-wrap .footer-meta{font-family:var(--font-mono); font-size:9px; letter-spacing:.22em; text-transform:uppercase; color:var(--text-dim);}\n\n  \/* TEXT HIGHLIGHT *\/\n  .sp-paris-wrap .text-highlight{\n    display:inline-block;\n    padding:0.08em 0.32em 0.12em;\n    margin-left:0.08em;\n    background:#ededed;\n    color:#030303;\n    font-weight:900;\n    letter-spacing:-0.02em;\n    line-height:1;\n    border-radius:6px;\n    box-shadow:0 8px 22px rgba(0,0,0,.35);\n  }\n\n  \/* BRETAGNE LAYER *\/\n  .sp-paris-wrap .bzh-layer{position:absolute; inset:0; pointer-events:none; z-index:0; opacity:1; overflow:hidden;}\n  .sp-paris-wrap nav, .sp-paris-wrap main, .sp-paris-wrap section, .sp-paris-wrap footer{position: relative; z-index: 2;}\n  .sp-paris-wrap .bzh-coast{position:absolute; inset:0; width:100%; height:100%; opacity:.70; filter: drop-shadow(0 0 18px rgba(145,190,175,.10));}\n  .sp-paris-wrap .bzh-path{fill: none; stroke: rgba(237,237,237,.12); stroke-width: 1; vector-effect: non-scaling-stroke; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 2 10; opacity: .9;}\n  .sp-paris-wrap .bzh-path-2{fill:none; stroke: rgba(145,190,175,.16); stroke-width: 1; vector-effect: non-scaling-stroke; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1 14; opacity: .7;}\n  .sp-paris-wrap .bzh-tide{\n    position:absolute; inset:0;\n    background:\n      radial-gradient(800px circle at 18% 20%, rgba(145,190,175,.10), transparent 55%),\n      radial-gradient(900px circle at 82% 72%, rgba(210,225,235,.08), transparent 60%),\n      linear-gradient(90deg, transparent 0%, rgba(237,237,237,.07) 48%, transparent 52%);\n    opacity:.35; mix-blend-mode: screen;\n  }\n  .sp-paris-wrap .bzh-topo{\n    position:absolute; inset:0; opacity:.16;\n    background:\n      repeating-radial-gradient(circle at 20% 30%, rgba(237,237,237,.18) 0 1px, transparent 1px 16px),\n      repeating-radial-gradient(circle at 80% 70%, rgba(145,190,175,.16) 0 1px, transparent 1px 18px);\n    mask-image: linear-gradient(to bottom, transparent 0%, rgba(0,0,0,.75) 18%, rgba(0,0,0,.75) 72%, transparent 100%);\n  }\n  .sp-paris-wrap .hero::before,\n  .sp-paris-wrap footer.site-footer::after{\n    content:\"\"; position:absolute; inset:0; pointer-events:none;\n    background:\n      radial-gradient(900px circle at 20% 15%, rgba(145,190,175,.10), transparent 55%),\n      radial-gradient(900px circle at 80% 85%, rgba(210,225,235,.08), transparent 60%);\n    opacity:.70; mix-blend-mode: screen;\n  }\n\n  \/* VIDEO SECTION (NORMAL) *\/\n  .sp-paris-wrap .sp-stage{\n    height:auto;\n    padding:0;\n    border-bottom:1px solid var(--line);\n    position:relative;\n  }\n  .sp-paris-wrap .sp-stage-sticky{position:relative; display:block;}\n  .sp-paris-wrap .sp-stage-video{\n    width:100vw;\n    margin-left:calc(50% - 50vw);\n    margin-right:calc(50% - 50vw);\n    border-left:none;\n    border-right:none;\n    border-radius:0;\n    padding:0;\n    background:#000;\n    overflow:hidden;\n    position:relative;\n  }\n  .sp-paris-wrap .sp-stage-video .video-box{width:100%; aspect-ratio:21\/9; height:auto;}\n  .sp-paris-wrap #stageVideo{width:100%; height:100%; object-fit:cover; opacity:.92;}\n\n  .sp-paris-wrap .sp-stage-vignette{\n    position:absolute; inset:0; pointer-events:none; opacity:.90;\n    background:\n      radial-gradient(900px circle at 18% 82%, rgba(0,0,0,.72), transparent 58%),\n      radial-gradient(900px circle at 88% 78%, rgba(0,0,0,.68), transparent 62%),\n      linear-gradient(to bottom, rgba(0,0,0,.05), rgba(0,0,0,.82));\n  }\n  .sp-paris-wrap .sp-stage-overlay{\n    position:absolute; inset:0;\n    display:flex; align-items:flex-end; justify-content:center;\n    pointer-events:none;\n  }\n  .sp-paris-wrap .sp-stage-inner{\n    width:min(1180px, 92vw);\n    margin:0 auto;\n    padding:0 0 clamp(18px, 5vw, 60px);\n  }\n  .sp-paris-wrap .sp-stage-grid{\n    display:grid;\n    grid-template-columns:1.15fr .85fr;\n    gap:clamp(18px, 6vw, 90px);\n    align-items:end;\n  }\n  .sp-paris-wrap .sp-stage-lead{\n    color:rgba(237,237,237,.82);\n    font-weight:200;\n    line-height:1.55;\n    letter-spacing:.01em;\n    max-width:720px;\n    margin:0 0 18px 0;\n  }\n  .sp-paris-wrap .sp-stage-ctas{\n    display:flex;\n    gap:12px;\n    flex-wrap:wrap;\n    margin:0;\n    pointer-events:auto;\n  }\n  .sp-paris-wrap .sp-stage-ctas a{pointer-events:auto;}\n\n  .sp-paris-wrap .sp-stage-points{\n    margin:0;\n    padding:0;\n    list-style:none;\n    display:flex;\n    flex-direction:column;\n    gap:18px;\n    align-items:flex-end;\n    text-align:right;\n    width:var(--right-col-width);\n  }\n  .sp-paris-wrap .sp-stage-points li{\n    font-family:var(--font-title);\n    font-weight:900;\n    text-transform:uppercase;\n    letter-spacing:.06em;\n    font-size:clamp(0.95rem, 1.35vw, 1.15rem);\n    color:rgba(237,237,237,.92);\n    line-height:1.05;\n  }\n\n  .sp-paris-wrap .sp-stage-steps{\n    list-style:none;\n    margin:18px 0 0 0;\n    padding:0;\n    border-top:1px solid rgba(255,255,255,.10);\n    background:rgba(3,3,3,.55);\n    max-width:520px;\n    border-radius:14px;\n    overflow:hidden;\n  }\n  .sp-paris-wrap .sp-stage-step{\n    display:flex;\n    justify-content:space-between;\n    gap:18px;\n    padding:14px 16px;\n    border-bottom:1px solid rgba(255,255,255,.08);\n  }\n  .sp-paris-wrap .sp-stage-step:last-child{border-bottom:none;}\n  .sp-paris-wrap .sp-stage-step small{\n    font-family:var(--font-mono);\n    font-size:10px;\n    letter-spacing:.14em;\n    text-transform:uppercase;\n    color:rgba(237,237,237,.55);\n    white-space:nowrap;\n  }\n  .sp-paris-wrap .sp-stage-step span{font-weight:600; color:rgba(237,237,237,.80);}\n\n  \/* Align width with right column (desktop) *\/\n  .sp-paris-wrap .agence-section .description-text{\n    width:var(--right-col-width);\n    max-width:var(--right-col-width);\n  }\n\n  \/* Elementor *\/\n  .elementor-widget-html,\n  .elementor-widget-html .elementor-widget-container{\n    margin-bottom:0!important;\n    padding-bottom:0!important;\n  }\n\n  .sp-paris-wrap::after{ content:\"\"; display:block; clear:both; }\n\n  \/* =========================================================\n     MOBILE \u2014 COMPLETE\n  ========================================================= *\/\n  @media (max-width: 1024px){\n    .sp-paris-wrap .editorial-grid{gap:6vw;}\n    .sp-paris-wrap .event-section{gap:6vw;}\n    .sp-paris-wrap .stands-grid{gap:40px;}\n  }\n\n  @media (max-width: 768px){\n    :root{\n      --pad-x: var(--pad-x-m);\n      --pad-y: var(--pad-y-m);\n      --right-col-width: 100%;\n    }\n\n    \/* NAV *\/\n    .sp-paris-wrap nav{\n      height:70px;\n      padding:0 var(--pad-x);\n      border-bottom:0;\n    }\n    .sp-paris-wrap .nav-info{\n      font-size:9px;\n      letter-spacing:.16em;\n      text-align:right;\n      max-width: 70vw;\n    }\n\n    \/* SECTIONS *\/\n    .sp-paris-wrap section{\n      padding:var(--pad-y) var(--pad-x);\n    }\n\n    \/* HERO *\/\n    .sp-paris-wrap .hero{\n      min-height: 92vh;\n      padding-top: 70px;\n    }\n    .sp-paris-wrap .title-block{margin-bottom: 24px;}\n    .sp-paris-wrap .h1-main,\n    .sp-paris-wrap .h1-location{\n      font-size: clamp(2.35rem, 10.2vw, 3.45rem)!important;\n      line-height: .96!important;\n      letter-spacing: -0.045em!important;\n      white-space: normal;\n    }\n    .sp-paris-wrap .h1-sub{\n      flex-direction:column;\n      align-items:flex-start;\n      gap:10px;\n      margin-top: 10px;\n    }\n\n    \/* Marker: vertical -> inline pill *\/\n    .sp-paris-wrap .h1-marker{\n      writing-mode:horizontal-tb;\n      height:auto;\n      border-left:none;\n      padding-left:0;\n      border:1px solid var(--line);\n      padding:10px 12px;\n      border-radius:12px;\n      font-size:10px;\n      letter-spacing:.18em;\n      background:rgba(255,255,255,.02);\n    }\n\n    \/* VIDEO *\/\n    .sp-paris-wrap .sp-stage-video .video-box{\n      aspect-ratio: 4 \/ 5;\n    }\n    .sp-paris-wrap .sp-stage-overlay{\n      align-items:flex-end;\n      padding: 0;\n    }\n    .sp-paris-wrap .sp-stage-inner{\n      width: 100%;\n      padding: 0 var(--pad-x) 18px;\n    }\n    .sp-paris-wrap .sp-stage-grid{\n      grid-template-columns: 1fr;\n      gap: 16px;\n      align-items: start;\n    }\n    .sp-paris-wrap .sp-stage-lead{\n      font-size: 1rem;\n      max-width: 100%;\n      margin-bottom: 14px;\n    }\n    .sp-paris-wrap .sp-stage-ctas{\n      flex-direction:column;\n      gap:10px;\n    }\n    .sp-paris-wrap .sp-stage-ctas a{\n      width:100%;\n      text-align:center;\n      padding:18px 16px;\n    }\n\n    \/* Steps: stack *\/\n    .sp-paris-wrap .sp-stage-steps{\n      max-width: 100%;\n      margin-top: 16px;\n    }\n    .sp-paris-wrap .sp-stage-step{\n      flex-direction:column;\n      align-items:flex-start;\n      gap:6px;\n    }\n    .sp-paris-wrap .sp-stage-step small{white-space:normal;}\n\n    \/* Points: move under content, align left *\/\n    .sp-paris-wrap .sp-stage-points{\n      width:100%;\n      align-items:flex-start;\n      text-align:left;\n      gap:10px;\n      margin-top: 10px;\n      padding-top: 10px;\n      border-top:1px solid rgba(255,255,255,.10);\n    }\n    .sp-paris-wrap .sp-stage-points li{\n      font-size: 1rem;\n      letter-spacing:.04em;\n      line-height: 1.15;\n    }\n\n    \/* AGENCE GRID: 2col -> 1col *\/\n    .sp-paris-wrap .editorial-grid{\n      grid-template-columns: 1fr;\n      gap: 18px;\n      margin-bottom: 52px;\n    }\n    .sp-paris-wrap .agence-section{\n      padding-top: var(--pad-y);\n    }\n    .sp-paris-wrap .agence-section .description-text{\n      width:100%;\n      max-width:100%;\n      font-size: 1rem;\n      line-height: 1.6;\n    }\n\n    \/* Expertise: 3 -> 1 *\/\n    .sp-paris-wrap .expertise-container{margin-top: 42px;}\n    .sp-paris-wrap .expertise-header{margin-bottom: 18px; font-size:10px;}\n    .sp-paris-wrap .expertise-grid{\n      grid-template-columns: 1fr;\n    }\n    .sp-paris-wrap a.expertise-item{\n      padding: 28px 20px;\n    }\n    .sp-paris-wrap a.expertise-item::before{margin-bottom: 14px;}\n    .sp-paris-wrap .expertise-title{font-size: 1.15rem;}\n\n    \/* Event section: 2col -> 1col *\/\n    .sp-paris-wrap .event-section{\n      grid-template-columns: 1fr;\n      gap: 26px;\n      align-items: start;\n    }\n    .sp-paris-wrap .event-types{\n      grid-template-columns: 1fr;\n      gap: 12px;\n      margin-top: 18px;\n    }\n    .sp-paris-wrap .event-card{\n      padding: 18px;\n    }\n    \/* Right column panel: remove left border inline style effects *\/\n    .sp-paris-wrap .event-section .technical-info{\n      border-left: none !important;\n      padding-left: 0 !important;\n      border-top: 1px solid var(--line);\n      padding-top: 18px;\n    }\n    .sp-paris-wrap .service-item{\n      align-items:flex-start;\n      gap:12px;\n    }\n    .sp-paris-wrap .service-item span{\n      font-size: 13px;\n      text-align:right;\n    }\n\n    \/* Stands: 2col -> 1col *\/\n    .sp-paris-wrap .stands-grid{\n      grid-template-columns: 1fr;\n      gap: 22px;\n    }\n    .sp-paris-wrap .stands-section .video-box{\n      aspect-ratio: 4 \/ 5;\n    }\n\n    \/* Impact: keep label readable *\/\n    .sp-paris-wrap .impact-box{\n      margin-top: 34px;\n      padding: 28px 18px;\n    }\n    .sp-paris-wrap .impact-box::after{\n      right: 16px;\n      padding: 0 10px;\n      font-size: 8px;\n      letter-spacing: .18em;\n    }\n\n    \/* Footer: 2col -> 1col + CTAs full width *\/\n    .sp-paris-wrap footer.site-footer{\n      padding: 76px var(--pad-x) 56px;\n    }\n    .sp-paris-wrap .footer-grid{\n      grid-template-columns: 1fr;\n      gap: 22px;\n    }\n    .sp-paris-wrap .footer-cta{\n      flex-direction: column;\n      gap: 10px;\n    }\n    .sp-paris-wrap .footer-cta a{\n      width: 100%;\n      text-align:center;\n      padding: 18px 16px;\n    }\n    .sp-paris-wrap .footer-panel{padding: 20px;}\n    .sp-paris-wrap .footer-bottom{\n      flex-direction: column;\n      align-items:flex-start;\n      gap:10px;\n      margin-top: 38px;\n    }\n  }\n\n  @media (max-width: 420px){\n    .sp-paris-wrap .nav-info{max-width: 78vw;}\n    .sp-paris-wrap .btn-main,\n    .sp-paris-wrap .btn-ghost{\n      font-size:10px;\n      letter-spacing:.18em;\n    }\n    .sp-paris-wrap .footer-title{font-size: clamp(1.85rem, 8vw, 2.6rem);}\n  }\n  \/* ===========================\n   ANIMATIONS (global)\n=========================== *\/\n.sp-paris-wrap .sp-anim{\n  opacity:0;\n  transform: translateY(18px);\n  filter: blur(0.0px);\n  transition:\n    opacity 700ms var(--ease),\n    transform 700ms var(--ease);\n  transition-delay: var(--d, 0ms);\n  will-change: opacity, transform;\n}\n.sp-paris-wrap .sp-anim.is-in{\n  opacity:1;\n  transform: translateY(0);\n}\n\n\/* Micro-interactions (hover) desktop *\/\n@media (hover:hover){\n  .sp-paris-wrap .btn-main,\n  .sp-paris-wrap .btn-ghost{\n    transition: transform 220ms var(--ease), box-shadow 220ms var(--ease), background 220ms var(--ease), color 220ms var(--ease), border-color 220ms var(--ease);\n  }\n  .sp-paris-wrap .btn-main:hover{ transform: translateY(-1px); box-shadow: 0 14px 30px rgba(0,0,0,.35); }\n  .sp-paris-wrap .btn-ghost:hover{ transform: translateY(-1px); border-color: rgba(255,255,255,.22); box-shadow: 0 14px 30px rgba(0,0,0,.25); }\n\n  .sp-paris-wrap .event-card,\n  .sp-paris-wrap .footer-panel,\n  .sp-paris-wrap .frame-visual{\n    transition: transform 260ms var(--ease), border-color 260ms var(--ease), background 260ms var(--ease);\n  }\n  .sp-paris-wrap .event-card:hover,\n  .sp-paris-wrap .footer-panel:hover,\n  .sp-paris-wrap .frame-visual:hover{\n    transform: translateY(-2px);\n    border-color: rgba(255,255,255,.16);\n    background: rgba(255,255,255,.03);\n  }\n\n  .sp-paris-wrap a.expertise-item{\n    transition: transform 260ms var(--ease), background 260ms var(--ease);\n  }\n  .sp-paris-wrap a.expertise-item:hover{\n    transform: translateY(-2px);\n    background: rgba(255,255,255,.02);\n  }\n}\n\n\/* Respect prefers-reduced-motion *\/\n@media (prefers-reduced-motion: reduce){\n  .sp-paris-wrap .sp-anim{\n    opacity:1 !important;\n    transform:none !important;\n    transition:none !important;\n  }\n}\n\/* ==============================\n   FIX MOBILE CTA: ne plus clipper l\u2019overlay\n   ============================== *\/\n\n\/* 1) Le conteneur global NE doit PAS clipper le contenu overlay *\/\n.sp-paris-wrap .sp-stage-video,\n.sp-paris-wrap .frame-visual{\n  overflow: visible !important;\n}\n\n\/* 2) On clippe UNIQUEMENT la vid\u00e9o (et la vignette) *\/\n.sp-paris-wrap .sp-stage-video .video-box{\n  overflow: hidden !important;\n}\n\n\/* 3) On force un stacking clair (vid\u00e9o < vignette < overlay < boutons) *\/\n.sp-paris-wrap .sp-stage-video{ position: relative; }\n.sp-paris-wrap #stageVideo{ position: relative; z-index: 1; }\n.sp-paris-wrap .sp-stage-vignette{ position: absolute; inset: 0; z-index: 2; }\n.sp-paris-wrap .sp-stage-overlay{ position: absolute; inset: 0; z-index: 3; }\n.sp-paris-wrap .sp-stage-inner{ position: relative; z-index: 4; }\n.sp-paris-wrap .sp-stage-ctas{ position: relative; z-index: 9999; }\n\n\/* 4) Bouton blanc au-dessus + zone cliquable OK *\/\n.sp-paris-wrap .btn-main{\n  position: relative;\n  z-index: 10000;\n}\n\n\/* Bonus iPhone notch : \u00e9vite que le bouton touche le haut *\/\n@media (max-width:768px){\n  .sp-paris-wrap .sp-stage-inner{\n    padding-bottom: max(18px, env(safe-area-inset-bottom)) !important;\n  }\n}\n\/* ===========================\n   MOBILE HERO TIGHTENING\n=========================== *\/\n\n@media (max-width:768px){\n\n  \/* 1) Nav plus compacte *\/\n  .sp-paris-wrap nav{\n    height:60px;\n    padding:0 20px;\n  }\n\n  .sp-paris-wrap .nav-info{\n    font-size:8px;\n    letter-spacing:.14em;\n  }\n\n  \/* 2) Hero moins haut *\/\n  .sp-paris-wrap .hero{\n    min-height:auto;\n    padding-top:80px; \/* juste sous la nav *\/\n    padding-bottom:40px;\n    justify-content:flex-start;\n  }\n\n  \/* 3) Bloc titre plus serr\u00e9 *\/\n  .sp-paris-wrap .title-block{\n    margin-bottom:20px;\n  }\n\n  \/* 4) H1 principal *\/\n  .sp-paris-wrap .h1-main{\n    font-size: clamp(2.3rem, 9vw, 3rem) !important;\n    line-height: .9 !important;\n    letter-spacing: -0.04em !important;\n    margin:0;\n  }\n\n  \/* 5) Sous-ligne Nantes *\/\n  .sp-paris-wrap .h1-sub{\n    gap:10px;\n    margin-top:4px;\n  }\n\n  .sp-paris-wrap .h1-location{\n    font-size: clamp(2.3rem, 9vw, 3rem) !important;\n    line-height:.88 !important;\n    letter-spacing:-0.04em !important;\n  }\n\n  \/* 6) Marker vertical plus petit *\/\n  .sp-paris-wrap .h1-marker{\n    height:auto;\n    font-size:9px;\n    padding-left:6px;\n  }\n}\n\/* ===================================\n   MOBILE HERO CLEAN STRUCTURE\n=================================== *\/\n\n@media (max-width:768px){\n\n  \/* NAV *\/\n  .sp-paris-wrap nav{\n    position:relative;\n    height:auto;\n    padding:18px 20px 10px;\n    border-bottom:none;\n    justify-content:center;\n  }\n\n  .sp-paris-wrap .nav-info{\n    font-size:8px;\n    text-align:center;\n  }\n\n  \/* HERO *\/\n  .sp-paris-wrap .hero{\n    min-height:auto;\n    padding:30px 20px 10px;\n    justify-content:flex-start;\n  }\n\n  .sp-paris-wrap .title-block{\n    padding:0;\n    margin-bottom:18px;\n  }\n\n  .sp-paris-wrap .h1-main,\n  .sp-paris-wrap .h1-location{\n    font-size: clamp(2.4rem, 10vw, 3rem) !important;\n    line-height: .9 !important;\n    letter-spacing:-0.04em !important;\n  }\n\n  .sp-paris-wrap .h1-sub{\n    gap:6px;\n    margin-top:2px;\n  }\n\n  .sp-paris-wrap .h1-marker{\n    display:none; \/* inutile en mobile *\/\n  }\n\n  \/* VIDEO SECTION = plus d\u2019overlay absolue *\/\n  .sp-paris-wrap .sp-stage-overlay{\n    position:relative;\n    inset:auto;\n    align-items:flex-start;\n  }\n\n  .sp-paris-wrap .sp-stage-inner{\n    padding:30px 20px 40px;\n  }\n\n  \/* Texte *\/\n  .sp-paris-wrap .sp-stage-lead{\n    font-size:.95rem;\n    line-height:1.5;\n    margin-bottom:18px;\n  }\n\n  \/* CTA *\/\n  .sp-paris-wrap .sp-stage-ctas{\n    flex-direction:column;\n    gap:12px;\n    margin-bottom:20px;\n  }\n\n  .sp-paris-wrap .btn-main,\n  .sp-paris-wrap .btn-ghost{\n    width:100%;\n    text-align:center;\n    border-radius:14px;\n    padding:18px 14px;\n  }\n\n  \/* Points cl\u00e9s plus l\u00e9gers *\/\n  .sp-paris-wrap .sp-stage-points{\n    margin-top:10px;\n    gap:6px;\n  }\n\n  .sp-paris-wrap .sp-stage-points li{\n    font-size:.9rem;\n    letter-spacing:.04em;\n  }\n\n}\n\/* ===================================\n   PATCH \u2014 TRANSITION HERO -> VIDEO\n   (fade \/ d\u00e9grad\u00e9)\n=================================== *\/\n\n\/* s\u2019assure que le fade reste au-dessus des d\u00e9cors *\/\n.sp-paris-wrap .hero{ position: relative; z-index: 2; }\n.sp-paris-wrap .sp-stage{ position: relative; z-index: 2; }\n\n\/* VIDEO OVERLAY \u2014 noir plus long en haut + fade doux sur toute la vid\u00e9o + anti-banding *\/\n.sp-paris-wrap .sp-stage-vignette{\n  position:absolute; inset:0;\n  pointer-events:none;\n\n  \/* tu peux garder ton opacity globale, mais \u00e9vite trop fort *\/\n  opacity: .95;\n\n  background-image:\n    \/* 1) D\u00e9grad\u00e9 vertical FULL HEIGHT :\n       - noir \"plateau\" plus long en haut\n       - puis descente progressive jusqu'en bas (moins prononc\u00e9) *\/\n    linear-gradient(\n      to bottom,\n      rgba(3,3,3,.92) 0%,\n      rgba(3,3,3,.92) 24%,  \/* <- plateau noir plus long *\/\n      rgba(3,3,3,.62) 52%,\n      rgba(3,3,3,.28) 78%,\n      rgba(3,3,3,.10) 100%  \/* <- bas tr\u00e8s l\u00e9ger (pas 0) *\/\n    ),\n\n    \/* 2) Vignettage l\u00e9ger (garde l'effet premium sans \u00e9craser) *\/\n    radial-gradient(900px circle at 18% 82%, rgba(0,0,0,.55), transparent 62%),\n    radial-gradient(900px circle at 88% 78%, rgba(0,0,0,.48), transparent 66%),\n\n    \/* 3) Dithering (anti-banding) *\/\n    url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'\/%3E%3C\/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.14'\/%3E%3C\/svg%3E\");\n\n  background-repeat: no-repeat, no-repeat, no-repeat, repeat;\n  background-size: 100% 100%, 100% 100%, 100% 100%, 220px 220px;\n\n  \/* Le blend qui \u201ccasse\u201d les marches *\/\n  background-blend-mode: normal, normal, normal, soft-light;\n\n  \/* micro-fix rendu *\/\n  transform: translateZ(0);\n}\n\n\n\/* Optionnel mais recommand\u00e9 :\n   l\u00e9ger fade en haut de la vid\u00e9o pour fondre le d\u00e9part *\/\n.sp-paris-wrap .sp-stage-video::before{\n  content:\"\";\n  position:absolute;\n  left:0; right:0; top:0;\n  height: clamp(55px, 8vw, 110px);\n  pointer-events:none;\n  z-index: 4; \/* au-dessus de la vid\u00e9o et de la vignette *\/\n  background: linear-gradient(\n    to bottom,\n    rgba(3,3,3,1) 0%,\n    rgba(3,3,3,.65) 45%,\n    rgba(3,3,3,0) 100%\n  );\n}\n\n\/* Mobile: un peu plus court pour \u00e9viter de \"manger\" la vid\u00e9o *\/\n@media (max-width:768px){\n  .sp-paris-wrap .hero::after{ height: 84px; }\n  .sp-paris-wrap .sp-stage-video::before{ height: 66px; }\n}\n@media (hover:hover){\n  .sp-paris-wrap .sp-stage-video.frame-visual:hover{\n    transform: none !important;\n    background: #000 !important;\n    border-color: var(--line) !important;\n  }\n}\n\/* ===========================\n   REMOVE HERO \u2192 VIDEO GRADIENT ON MOBILE\n=========================== *\/\n\n@media (max-width:768px){\n\n  \/* Si le d\u00e9grad\u00e9 est sur .hero *\/\n  .sp-paris-wrap .hero::after{\n    display:none !important;\n    content:none !important;\n  }\n\n  \/* Si tu l'avais mis sur la section vid\u00e9o *\/\n  .sp-paris-wrap .sp-stage::before{\n    display:none !important;\n    content:none !important;\n  }\n\n}\n\/* HERO background full black pur *\/\n.sp-paris-wrap .hero{\n  background:#030303 !important;\n}\n\n\/* On neutralise les halos d\u00e9coratifs sur la hero *\/\n.sp-paris-wrap .hero::before{\n  display:none !important;\n}\n\/* === HERO CLICK POP IMAGE === *\/\n.sp-paris-wrap .hero{ position: relative; }\n.sp-paris-wrap .hero .hero-click-layer{\n  position:absolute; inset:0;\n  pointer-events:none;\n  z-index: 20;\n}\n\n\/* l'image pop (on FORCE l'animation malgr\u00e9 ton \"NO ANIMS\") *\/\n.sp-paris-wrap .hero .hero-click-img{\n  position:absolute;\n  width: clamp(120px, 18vw, 260px);\n  height:auto;\n  object-fit:contain;\n  transform: translate(-50%,-50%) scale(.85);\n  opacity:0;\n  filter: drop-shadow(0 18px 40px rgba(0,0,0,.55));\n  animation: heroClickPop 900ms cubic-bezier(0.16,1,0.3,1) forwards !important;\n  transition:none !important;\n  will-change: transform, opacity;\n}\n\n@keyframes heroClickPop{\n  0%   { opacity:0; transform: translate(-50%,-50%) scale(.78); }\n  18%  { opacity:1; transform: translate(-50%,-50%) scale(1.02); }\n  70%  { opacity:1; transform: translate(-50%,-50%) scale(.98); }\n  100% { opacity:0; transform: translate(-50%,-50%) scale(.92); }\n}\n\n\/* Desktop only (tu peux enlever si tu veux aussi sur mobile) *\/\n@media (max-width:768px){\n  .sp-paris-wrap .hero .hero-click-img{ display:none; }\n}\n\n<\/style>\n\n<!-- TON HTML EXACT : inchang\u00e9 -->\n<div class=\"sp-paris-wrap\" id=\"top\">\n  <div class=\"grid-overlay\"><\/div>\n  <div class=\"spotlight\"><\/div>\n\n  <div class=\"bzh-layer\" aria-hidden=\"true\">\n    <svg class=\"bzh-coast\" viewBox=\"0 0 1200 600\" preserveAspectRatio=\"none\">\n      <path class=\"bzh-path\"\n        d=\"M75,415 C145,330 168,260 250,235 C340,208 420,165 500,180\n           C585,196 635,148 720,170 C815,193 860,120 950,165\n           C1045,215 1080,320 1125,360 C1160,387 1170,420 1185,450\"\n      \/>\n      <path class=\"bzh-path-2\"\n        d=\"M85,470 C170,410 185,330 270,290 C360,250 440,210 520,232\n           C600,255 660,215 740,230 C830,246 900,190 980,215\n           C1060,255 1100,330 1140,380 C1165,410 1175,445 1190,490\"\n      \/>\n    <\/svg>\n    <div class=\"bzh-tide\"><\/div>\n    <div class=\"bzh-topo\"><\/div>\n  <\/div>\n\n  \n\n  <main class=\"hero\">\n<div class=\"hero-click-layer\" aria-hidden=\"true\"><\/div>\n\n    <div class=\"title-block\" style=\"padding: 0 5vw;\">\n      <h1 class=\"h1-main\">Sc\u00e9nographie<\/h1>\n      <div class=\"h1-sub\">\n        <div class=\"h1-location\">Rennes.<\/div>\n        <div class=\"h1-marker\">Ille-et-Vilaine \u2014 35<\/div>\n      <\/div>\n    <\/div>\n  <\/main>\n\n  <!-- VIDEO SECTION (NORMAL) -->\n  <section class=\"sp-stage\" id=\"stage\">\n    <div class=\"sp-stage-sticky\">\n      <div class=\"sp-stage-video frame-visual\">\n        <div class=\"video-box\">\n          <video\n            id=\"stageVideo\"\n            autoplay\n            muted\n            loop\n            playsinline\n            webkit-playsinline\n            preload=\"auto\"\n            poster=\"https:\/\/scenographie-france.fr\/wp-content\/uploads\/2025\/12\/1.jpg\">\n            <source src=\"https:\/\/scenographie-france.fr\/wp-content\/uploads\/2025\/12\/background-video-final-1-1.mp4\" type=\"video\/mp4\">\n          <\/video>\n        <\/div>\n\n        <div class=\"sp-stage-vignette\" aria-hidden=\"true\"><\/div>\n\n        <div class=\"sp-stage-overlay\" aria-hidden=\"false\">\n          <div class=\"sp-stage-inner\">\n            <div class=\"sp-stage-grid\">\n              <div>\n                <p class=\"sp-stage-lead\">\n                  Architecture \u00e9ph\u00e9m\u00e8re, narration, impact. \u00c0 Rennes, nous fabriquons des <strong>espaces-signatures<\/strong>,\n                  des <strong>stands premium<\/strong> et des <strong>dispositifs immersifs<\/strong> pens\u00e9s pour la marque.\n                <\/p>\n\n                <div class=\"sp-stage-ctas\">\n                  <a href=\"https:\/\/scenographie-france.fr\/projets-de-scenographie-evenementielle\/\" class=\"btn-main\" target=\"_blank\" rel=\"noopener\">Voir nos projets<\/a>\n                  <a href=\"https:\/\/scenographie-france.fr\/contact-agence-scenographie\/\" class=\"btn-ghost\" target=\"_blank\" rel=\"noopener\">Demander un devis<\/a>\n                <\/div>\n\n                <ul class=\"sp-stage-steps\">\n                  <li class=\"sp-stage-step\">\n                    <small>01 \/ Direction<\/small><span>Concept & r\u00e9cit spatial<\/span>\n                  <\/li>\n                  <li class=\"sp-stage-step\">\n                    <small>02 \/ Production<\/small><span>Fabrication atelier<\/span>\n                  <\/li>\n                  <li class=\"sp-stage-step\">\n                    <small>03 \/ D\u00e9ploiement<\/small><span>Logistique rennaise<\/span>\n                  <\/li>\n                <\/ul>\n              <\/div>\n\n              <ul class=\"sp-stage-points\" aria-label=\"Points cl\u00e9s\">\n                <li>CONCEPT & R\u00c9CIT SPATIAL<\/li>\n                <li>FABRICATION ATELIER<\/li>\n                <li>LOGISTIQUE RENNAISE<\/li>\n              <\/ul>\n            <\/div>\n          <\/div>\n        <\/div>\n\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <section class=\"agence-section\">\n    <div class=\"editorial-grid\">\n      <h2 class=\"h2-editorial\">\n        Agence de sc\u00e9nographie<br>\n        \u00e0 <span class=\"text-highlight\">Rennes<\/span>\n      <\/h2>\n\n      <div class=\"technical-info\">\n        <p class=\"description-text\">\n          L\u2019agence Sc\u00e9nographie Rennes assemble <strong>exigence technique<\/strong> et <strong>vision cr\u00e9ative<\/strong>.\n          Notre r\u00f4le : transformer une intention en dispositif spatial clair, beau, et parfaitement ex\u00e9cutable.\n        <\/p>\n      <\/div>\n    <\/div>\n\n    <div class=\"expertise-container\">\n      <div class=\"expertise-header\">Nos champs d'expertise<\/div>\n\n      <div class=\"expertise-grid\">\n        <a class=\"expertise-item\" data-code=\"S-01\" href=\"https:\/\/scenographie-france.fr\/projets-de-scenographie-evenementielle\/\" target=\"_blank\" rel=\"noopener\">\n          <h3 class=\"expertise-title\">Sc\u00e9nographie \u00e9v\u00e9nementielle<\/h3>\n        <\/a>\n\n        <a class=\"expertise-item\" data-code=\"S-02\" href=\"https:\/\/scenographie-france.fr\/projets-de-scenographie-evenementielle\/\" target=\"_blank\" rel=\"noopener\">\n          <h3 class=\"expertise-title\">D\u00e9cors & direction artistique<\/h3>\n        <\/a>\n\n        <a class=\"expertise-item\" data-code=\"S-03\" href=\"https:\/\/scenographie-france.fr\/projets-de-scenographie-evenementielle\/\" target=\"_blank\" rel=\"noopener\">\n          <h3 class=\"expertise-title\">Stands sur mesure<\/h3>\n        <\/a>\n\n        <a class=\"expertise-item\" data-code=\"S-04\" href=\"https:\/\/scenographie-france.fr\/projets-de-scenographie-evenementielle\/\" target=\"_blank\" rel=\"noopener\">\n          <h3 class=\"expertise-title\">Sc\u00e9nographie de marque<\/h3>\n        <\/a>\n\n        <a class=\"expertise-item\" data-code=\"S-05\" href=\"https:\/\/scenographie-france.fr\/projets-de-scenographie-evenementielle\/\" target=\"_blank\" rel=\"noopener\">\n          <h3 class=\"expertise-title\">Installations immersives<\/h3>\n        <\/a>\n\n        <a class=\"expertise-item\" data-code=\"S-06\" href=\"https:\/\/scenographie-france.fr\/projets-de-scenographie-evenementielle\/\" target=\"_blank\" rel=\"noopener\">\n          <h3 class=\"expertise-title\">Exposition & parcours<\/h3>\n        <\/a>\n\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <section class=\"event-section\">\n    <div>\n      <h2 class=\"h2-editorial\">Sc\u00e9nographie \u00e9v\u00e9nementielle \u00e0 Rennes<\/h2>\n      <p class=\"description-text\" style=\"margin-top: 30px;\">\n        \u00c0 Rennes et sur toute la Bretagne, on con\u00e7oit des dispositifs qui structurent l\u2019exp\u00e9rience : circulation, rythme, lumi\u00e8re, d\u00e9tails.\n        Objectif : un rendu premium qui raconte vraiment quelque chose.\n      <\/p>\n\n      <div class=\"event-types\">\n        <div class=\"event-card\"><h4>Marques & Corporate<\/h4><p>Lancements, conf\u00e9rences, soir\u00e9es, exp\u00e9riences B2B.<\/p><\/div>\n        <div class=\"event-card\"><h4>Salons & Exposants<\/h4><p>Stand strat\u00e9gique, visibilit\u00e9, flux, conversion.<\/p><\/div>\n        <div class=\"event-card\"><h4>Culture & Institutions<\/h4><p>Parcours sc\u00e9nographi\u00e9, m\u00e9diation, rythme narratif.<\/p><\/div>\n        <div class=\"event-card\"><h4>Retail & Pop-up<\/h4><p>Activation terrain, immersion, pr\u00e9sence marque.<\/p><\/div>\n      <\/div>\n    <\/div>\n\n    <div class=\"technical-info\" style=\"border-left: 1px solid var(--line); padding-left: 40px;\">\n      <div class=\"nav-info\" style=\"margin-bottom: 20px;\">[ PROCESSUS \u2014 M\u00c9THODE & EX\u00c9CUTION ]<\/div>\n      <ul class=\"service-list\">\n        <li class=\"service-item\">Cadrage <span>Brief + contraintes<\/span><\/li>\n        <li class=\"service-item\">Design <span>Concept + rendus 3D<\/span><\/li>\n        <li class=\"service-item\">Fabrication <span>Atelier + finitions<\/span><\/li>\n        <li class=\"service-item\">Montage <span>Installation sur site<\/span><\/li>\n      <\/ul>\n    <\/div>\n  <\/section>\n\n  <section class=\"stands-section\">\n    <div class=\"stands-grid\">\n      <div class=\"frame-visual\">\n        <div class=\"video-box\">\n          <video autoplay muted loop playsinline>\n            <source src=\"https:\/\/scenographie-france.fr\/wp-content\/uploads\/2025\/12\/POP-UP-STORE-EVO-2025.mp4\" type=\"video\/mp4\">\n          <\/video>\n        <\/div>\n      <\/div>\n\n      <div>\n        <h2 class=\"h2-editorial\">Pop-up & sc\u00e9nographie de marque \u00e0 Rennes<\/h2>\n        <p class=\"description-text\" style=\"margin-top: 30px;\">\n          Le pop-up n\u2019est pas une vitrine : c\u2019est une prise de parole.\n          On cr\u00e9e des architectures temporaires qui installent la marque, posent un univers, et maximisent l\u2019impact sur place.\n        <\/p>\n      <\/div>\n    <\/div>\n\n    <div class=\"impact-box\">\n      <div class=\"editorial-grid\" style=\"margin-bottom: 0;\">\n        <div class=\"technical-info\">\n          <h3>Diff\u00e9renciation<\/h3>\n          <p class=\"description-text\">Des volumes lisibles, une mati\u00e8re juste, un r\u00e9cit net. On construit une <strong>exp\u00e9rience<\/strong> avant de construire un d\u00e9cor.<\/p>\n        <\/div>\n        <div class=\"technical-info\">\n          <h3>R\u00e9alisation<\/h3>\n          <p class=\"description-text\">Plans, production, montage : un pipeline ma\u00eetris\u00e9 pour un rendu final <strong>fid\u00e8le au concept<\/strong> et propre sur site.<\/p>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <footer class=\"site-footer\">\n    <div class=\"footer-scan\"><\/div>\n\n    <div class=\"footer-grid\">\n      <div>\n        <div class=\"footer-kicker\">[ CONTACT \u2014 RENNES \/ 35 ]<\/div>\n        <h2 class=\"footer-title\">On lance ton projet<br>\u00e0 Rennes ?<\/h2>\n        <p class=\"footer-lead\">\n          Concept, 3D, fabrication, installation : on transforme une intention de marque en dispositif concret.\n          Si tu veux un rendu premium, propre, et ma\u00eetris\u00e9, on en parle.\n        <\/p>\n\n        <div class=\"footer-cta\">\n          <a class=\"btn-main\" href=\"https:\/\/scenographie-france.fr\/contact-agence-scenographie\/\" target=\"_blank\" rel=\"noopener\">Demander un devis<\/a>\n          <a class=\"btn-ghost\" href=\"mailto:hello@scenographie-france.fr\">hello@scenographie-france.fr<\/a>\n        <\/div>\n      <\/div>\n\n      <div class=\"footer-panel\">\n        <div class=\"nav-info\">[ ACC\u00c8S RAPIDE ]<\/div>\n        <ul class=\"footer-list\">\n          <li><a class=\"footer-link\" href=\"https:\/\/scenographie-france.fr\/contact-agence-scenographie\/\" target=\"_blank\" rel=\"noopener\"><small>01 \/ Contact<\/small><span>Page contact \u2192<\/span><\/a><\/li>\n          <li><a class=\"footer-link\" href=\"https:\/\/scenographie-france.fr\/\" target=\"_blank\" rel=\"noopener\"><small>02 \/ Agence<\/small><span>Sc\u00e9nographie France \u2192<\/span><\/a><\/li>\n          <li><a class=\"footer-link\" href=\"#top\" onclick=\"window.scrollTo({top:0,behavior:'auto'});return false;\"><small>03 \/ Retour<\/small><span>Haut de page \u2191<\/span><\/a><\/li>\n        <\/ul>\n\n        <div class=\"nav-info\" style=\"margin-top:18px;\">[ LIGNE DIRECTE ]<\/div>\n        <ul class=\"footer-list\">\n          <li><a class=\"footer-link\" href=\"tel:+33299663660\"><small>T\u00e9l.<\/small><span>+33 2 99 66 36 60<\/span><\/a><\/li>\n        <\/ul>\n      <\/div>\n    <\/div>\n\n    <div class=\"footer-bottom\">\n      <div class=\"footer-meta\">\u00a9 2026 \u2014 Sc\u00e9nographie Rennes. byEsteban<\/div>\n      <div class=\"footer-meta\">Rennes \u2014 Bretagne<\/div>\n    <\/div>\n  <\/footer>\n<\/div>\n<script>\ndocument.addEventListener('DOMContentLoaded', () => {\n  const wrap = document.querySelector('.sp-paris-wrap');\n  const hero = wrap?.querySelector('.hero');\n  const layer = hero?.querySelector('.hero-click-layer');\n  if (!wrap || !hero || !layer) return;\n\n  const reduce = window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n  if (reduce) return;\n\n  const IMAGES = [\n    \"https:\/\/scenographie-france.fr\/wp-content\/uploads\/2025\/12\/0ilIyusc.png\",\n    \"https:\/\/scenographie-france.fr\/wp-content\/uploads\/2025\/12\/2.png\",\n    \"https:\/\/scenographie-france.fr\/wp-content\/uploads\/2025\/10\/Sceno-sans-fond-1-scaled.png\"\n  ];\n  IMAGES.forEach(src => { const i = new Image(); i.src = src; });\n\n  let idx = 0;\n  const LIFE = 900;\n  const MAX = 6;\n\n  function spawn(x, y){\n    const r = hero.getBoundingClientRect();\n    if (x < r.left || x > r.right || y < r.top || y > r.bottom) return;\n\n    \/\/ limite le spam\n    if (layer.childElementCount >= MAX) {\n      layer.firstElementChild?.remove();\n    }\n\n    const el = document.createElement('img');\n    el.className = 'hero-click-img';\n    el.src = IMAGES[idx % IMAGES.length];\n    idx++;\n\n    const rot = (Math.random() * 14 - 7);\n    const dx = (Math.random() * 18 - 9);\n    const dy = (Math.random() * 18 - 9);\n\n    el.style.left = ((x - r.left) + dx) + 'px';\n    el.style.top  = ((y - r.top) + dy) + 'px';\n    el.style.transform = `translate(-50%,-50%) scale(.85) rotate(${rot}deg)`;\n\n    layer.appendChild(el);\n    setTimeout(() => el.remove(), LIFE + 60);\n  }\n\n  hero.addEventListener('click', (e) => {\n    \/\/ \u00e9vite que cliquer sur un lien\/CTA d\u00e9clenche le pop\n    if (e.target.closest('a, button')) return;\n    spawn(e.clientX, e.clientY);\n  }, { passive:true });\n});\n<\/script>\n<script type=\"application\/ld+json\">\n{\n  \"@context\": \"https:\/\/schema.org\",\n  \"@graph\": [\n    {\n      \"@type\": \"WebPage\",\n      \"@id\": \"https:\/\/scenographie-france.fr\/scenographie-rennes\/#webpage\",\n      \"url\": \"https:\/\/scenographie-france.fr\/scenographie-rennes\/\",\n      \"name\": \"Sc\u00e9nographie Rennes \u2014 Stands & dispositifs immersifs\",\n      \"description\": \"Sc\u00e9nographie \u00e0 Rennes : conception, 3D, fabrication et installation. Stands sur mesure, pop-up stores, dispositifs immersifs pour marques et \u00e9v\u00e9nements.\",\n      \"inLanguage\": \"fr-FR\",\n      \"about\": [\n        { \"@type\": \"Thing\", \"name\": \"Sc\u00e9nographie Rennes\" },\n        { \"@type\": \"Thing\", \"name\": \"Stand sur mesure Rennes\" },\n        { \"@type\": \"Thing\", \"name\": \"Agence \u00e9v\u00e9nementielle\" }\n      ],\n      \"keywords\": [\n        \"sc\u00e9nographie rennes\",\n        \"stand sur mesure rennes\",\n        \"agence \u00e9v\u00e9nementielle rennes\",\n        \"sc\u00e9nographie \u00e9v\u00e9nementielle rennes\",\n        \"d\u00e9cor \u00e9v\u00e9nementiel rennes\",\n        \"installation immersive rennes\",\n        \"pop-up store rennes\"\n      ],\n      \"primaryImageOfPage\": {\n        \"@type\": \"ImageObject\",\n        \"url\": \"https:\/\/scenographie-france.fr\/wp-content\/uploads\/2025\/12\/1.jpg\"\n      },\n      \"mainEntity\": { \"@id\": \"https:\/\/scenographie-france.fr\/scenographie-rennes\/#business\" }\n    },\n    {\n      \"@type\": [\"ProfessionalService\",\"LocalBusiness\"],\n      \"@id\": \"https:\/\/scenographie-france.fr\/scenographie-rennes\/#business\",\n      \"name\": \"Sc\u00e9nographie Rennes\",\n      \"url\": \"https:\/\/scenographie-france.fr\/scenographie-rennes\/\",\n      \"email\": \"hello@scenographie-france.fr\",\n      \"telephone\": \"+33299663666\",\n      \"areaServed\": [\n        { \"@type\": \"City\", \"name\": \"Rennes\" },\n        { \"@type\": \"AdministrativeArea\", \"name\": \"Ille-et-Vilaine\" },\n        { \"@type\": \"AdministrativeArea\", \"name\": \"Bretagne\" }\n      ],\n      \"address\": {\n        \"@type\": \"PostalAddress\",\n        \"addressLocality\": \"Rennes\",\n        \"addressRegion\": \"Bretagne\",\n        \"addressCountry\": \"FR\"\n      },\n      \"serviceArea\": {\n        \"@type\": \"GeoCircle\",\n        \"name\": \"Zone d'intervention\",\n        \"geoMidpoint\": { \"@type\": \"GeoCoordinates\", \"addressLocality\": \"Rennes\", \"addressCountry\": \"FR\" },\n        \"geoRadius\": 80000\n      },\n      \"knowsAbout\": [\n        \"sc\u00e9nographie rennes\",\n        \"sc\u00e9nographie \u00e9v\u00e9nementielle\",\n        \"stand sur mesure rennes\",\n        \"agence \u00e9v\u00e9nementielle\",\n        \"pop-up store\",\n        \"installation immersive\",\n        \"mus\u00e9ographie\"\n      ],\n      \"hasOfferCatalog\": {\n        \"@type\": \"OfferCatalog\",\n        \"name\": \"Prestations \u2014 Sc\u00e9nographie Rennes\",\n        \"itemListElement\": [\n          {\n            \"@type\": \"Offer\",\n            \"name\": \"Sc\u00e9nographie Rennes\",\n            \"itemOffered\": {\n              \"@type\": \"Service\",\n              \"name\": \"Sc\u00e9nographie Rennes\",\n              \"serviceType\": \"Sc\u00e9nographie\"\n            }\n          },\n          {\n            \"@type\": \"Offer\",\n            \"name\": \"Stand sur mesure Rennes\",\n            \"itemOffered\": {\n              \"@type\": \"Service\",\n              \"name\": \"Stand sur mesure Rennes\",\n              \"serviceType\": \"Stand \/ exposition\"\n            }\n          },\n          {\n            \"@type\": \"Offer\",\n            \"name\": \"Agence \u00e9v\u00e9nementielle \u2014 sc\u00e9nographie\",\n            \"itemOffered\": {\n              \"@type\": \"Service\",\n              \"name\": \"Agence \u00e9v\u00e9nementielle (sc\u00e9nographie & production)\",\n              \"serviceType\": \"\u00c9v\u00e9nementiel\"\n            }\n          }\n        ]\n      }\n    }\n  ]\n}\n<\/script>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-44ddee6 e-con-full e-flex e-con e-parent\" data-id=\"44ddee6\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9cb8e8d elementor-widget elementor-widget-html\" data-id=\"9cb8e8d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n\/* ===================================\n   CALL BUTTON \u2014 PREMIUM FINAL\n=================================== *\/\n\n.sp-call-btn{\n  position:fixed;\n  right:32px;\n  bottom:32px;\n  z-index:99999;\n  display:flex;\n  align-items:center;\n  gap:14px;\n  padding:18px 26px;\n  background:#fff;\n  color:#000 !important;\n  text-decoration:none;\n  border-radius:60px;\n  font-family:'Space Mono', monospace;\n  font-size:12px;\n  letter-spacing:.2em;\n  text-transform:uppercase;\n  box-shadow:0 30px 80px rgba(0,0,0,.55);\n  transition:\n    transform .4s cubic-bezier(0.16,1,0.3,1),\n    box-shadow .4s cubic-bezier(0.16,1,0.3,1),\n    background .4s cubic-bezier(0.16,1,0.3,1),\n    color .4s cubic-bezier(0.16,1,0.3,1);\n}\n\n\/* SVG *\/\n.sp-call-btn svg{\n  width:18px;\n  height:18px;\n  flex-shrink:0;\n  stroke:#000;\n  transition:stroke .4s cubic-bezier(0.16,1,0.3,1);\n}\n\n\/* DESKTOP HOVER \u2014 texte forc\u00e9 noir *\/\n@media (hover:hover){\n  .sp-call-btn:hover{\n    transform:translateY(-6px);\n    box-shadow:0 40px 100px rgba(0,0,0,.65);\n    background:#ededed;\n    color:#000 !important; \/* texte toujours noir *\/\n  }\n\n  .sp-call-btn:hover svg{\n    stroke:#000;\n  }\n}\n\n\/* ===================================\n   MOBILE VERSION (icone only)\n=================================== *\/\n\n@media (max-width:768px){\n\n  .sp-call-btn{\n    right:18px;\n    bottom:18px;\n    padding:0;\n    width:60px;\n    height:60px;\n    border-radius:50%;\n    justify-content:center;\n    font-size:0;\n    letter-spacing:0;\n  }\n\n  .sp-call-btn svg{\n    width:22px;\n    height:22px;\n  }\n\n}\n\n\/* Reduced motion *\/\n@media (prefers-reduced-motion: reduce){\n  .sp-call-btn{\n    transition:none;\n  }\n}\n@media (max-width:768px){\n\n  .sp-call-btn{\n    display:flex;\n    align-items:center;\n    justify-content:center;\n  }\n\n  .sp-call-btn svg{\n    width:24px;\n    height:24px;\n    display:block;\n    margin:0;\n    transform: translateY(1px); \/* micro-correction optique *\/\n  }\n\n}\n\n<\/style>\n\n<a href=\"tel:+33299663660\" class=\"sp-call-btn\" aria-label=\"Appeler l\u2019agence Sc\u00e9nographie Nantes\">\n  <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\"\n     stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n  <path d=\"M6.6 10.8a15.05 15.05 0 006.6 6.6l2.2-2.2a1 1 0 011-.24\n  11.36 11.36 0 003.6.58 1 1 0 011 1V21a1 1 0 01-1 1\n  C10.07 22 2 13.93 2 4a1 1 0 011-1h3.66a1 1 0 011 1\n  11.36 11.36 0 00.58 3.6 1 1 0 01-.24 1L6.6 10.8z\"\/>\n<\/svg>\n\n  Appeler l\u2019agence\n<\/a>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Sc\u00e9nographie Rennes. Ille-et-Vilaine \u2014 35 Architecture \u00e9ph\u00e9m\u00e8re, narration, impact. \u00c0 Rennes, nous fabriquons des espaces-signatures, des stands premium et des dispositifs immersifs pens\u00e9s pour la marque. Voir nos projets Demander un devis 01 \/ DirectionConcept &#038; r\u00e9cit spatial 02 \/ ProductionFabrication atelier 03 \/ D\u00e9ploiementLogistique rennaise CONCEPT &#038; R\u00c9CIT SPATIAL FABRICATION ATELIER LOGISTIQUE RENNAISE Agence [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-9","page","type-page","status-publish","hentry"],"blocksy_meta":[],"_links":{"self":[{"href":"https:\/\/scenographie-rennes.fr\/index.php\/wp-json\/wp\/v2\/pages\/9","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/scenographie-rennes.fr\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/scenographie-rennes.fr\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/scenographie-rennes.fr\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/scenographie-rennes.fr\/index.php\/wp-json\/wp\/v2\/comments?post=9"}],"version-history":[{"count":34,"href":"https:\/\/scenographie-rennes.fr\/index.php\/wp-json\/wp\/v2\/pages\/9\/revisions"}],"predecessor-version":[{"id":55,"href":"https:\/\/scenographie-rennes.fr\/index.php\/wp-json\/wp\/v2\/pages\/9\/revisions\/55"}],"wp:attachment":[{"href":"https:\/\/scenographie-rennes.fr\/index.php\/wp-json\/wp\/v2\/media?parent=9"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}