.page-accueil{position:relative;background:#050505}.page-accueil:before{content:"";position:fixed;inset:0;z-index:0;background:url("assets/showreel/optimized/scene-02.webp") center center/cover no-repeat;filter:grayscale(1);opacity:.25;pointer-events:none}.page-accueil header,.page-accueil main,.page-accueil footer{position:relative;z-index:1}.page-accueil header{background:transparent;backdrop-filter:none}.page-accueil .hero{min-height:calc(100svh - 110px);display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding-top:60px;padding-bottom:70px}.page-accueil .hero-showreel{display:none}.page-accueil .hero h1{max-width:1050px;text-shadow:0 2px 24px #0005}.page-accueil .intro,.page-accueil .tagline{max-width:740px;color:#f3f4f6;text-shadow:0 1px 12px #0009}.page-accueil .hero .cta{margin-top:10px;background:#05050540}.page-accueil footer{background:transparent}.page-accueil .quick-contact{z-index:90}@media(max-width:950px){.page-accueil header nav{background:#080d19}.page-accueil .hero{min-height:calc(100svh - 100px);padding-top:50px;padding-bottom:50px}}@media(max-width:600px){.page-accueil .hero .cta{width:auto}.page-accueil:before{background-position:55% center}}

/* Shared monochrome background on every test page. */
body{position:relative;background:#050505}body:before{content:"";position:fixed;inset:0;z-index:0;background:url("assets/showreel/optimized/scene-02.webp") center center/cover no-repeat;filter:grayscale(1);opacity:.25;pointer-events:none}body header,body main,body footer{position:relative;z-index:1}body header{background:transparent;backdrop-filter:none}body footer{background:transparent}body .quick-contact{z-index:90}@media(max-width:950px){body header nav{background:#080d19}}@media(max-width:600px){body:before{background-position:55% center}}

/* A distinct photograph per rubric, at ten percent opacity. */
body:before,.page-accueil:before{opacity:.25;background-image:var(--page-photo)}
body[data-background-scene="02"]{--page-photo:url("assets/showreel/optimized/scene-02.webp")}
body[data-background-scene="09"]{--page-photo:url("assets/showreel/optimized/scene-09.webp")}
body[data-background-scene="04"]{--page-photo:url("assets/showreel/optimized/scene-04.webp")}
body[data-background-scene="06"]{--page-photo:url("assets/showreel/optimized/scene-06.webp")}
body[data-background-scene="01"]{--page-photo:url("assets/showreel/optimized/scene-01.webp")}
body[data-background-scene="10"]{--page-photo:url("assets/showreel/optimized/scene-10.webp")}
body[data-background-scene="12"]{--page-photo:url("assets/showreel/optimized/scene-12.webp")}

/* Progressive blur toward the lower edge of each background. */
body:after{content:"";position:fixed;inset:0;z-index:0;background:var(--page-photo) center center/cover no-repeat;filter:grayscale(1) blur(16px);opacity:.25;pointer-events:none;-webkit-mask-image:linear-gradient(to bottom,transparent 35%,#000 80%);mask-image:linear-gradient(to bottom,transparent 35%,#000 80%)}
body:before,.page-accueil:before{-webkit-mask-image:linear-gradient(to bottom,#000 35%,transparent 80%);mask-image:linear-gradient(to bottom,#000 35%,transparent 80%)}
@media(max-width:600px){body:after{background-position:55% center}}

/* Selected project photographs and restored original homepage composition. */
body[data-background-scene="04"]{--page-photo:url("assets/gallery/unilever/p15-2-2048x1536.jpg")}
body[data-background-scene="06"]{--page-photo:url("assets/gallery/cartier/p16-0-2048x1131.jpg")}
body[data-background-scene="01"]{--page-photo:url("assets/gallery/shooting/p18-2-960x640.jpg")}
.page-accueil .hero{display:block;min-height:0;padding-top:65px;padding-bottom:0}
.page-accueil .hero-showreel{display:block}
.page-accueil .hero h1{max-width:none}
@media(max-width:950px){.page-accueil .hero{min-height:0;padding-top:45px;padding-bottom:0}}

/* Midnight-blue and white duotone, applied only to the background photographs. */
body,.page-accueil{background:#070f26}
body:before,.page-accueil:before{filter:grayscale(1) sepia(1) saturate(2.8) hue-rotate(175deg) brightness(.95) contrast(1.2)}
body:after{filter:grayscale(1) sepia(1) saturate(2.8) hue-rotate(175deg) brightness(.95) contrast(1.2) blur(16px)}

/* Revised project backgrounds. */
body[data-background-scene="02"]{--page-photo:url("assets/gallery/apf/p14-3-2048x1366.jpg")}
body[data-background-scene="04"]{--page-photo:url("assets/gallery/unilever/p15-4-2048x1536.jpg")}
body[data-background-scene="10"]{--page-photo:url("assets/gallery/accor/p17-0-1574x832.jpg")}

/* Revised focal points and alternate interior / performance photographs. */
body[data-background-scene="02"]:before,body[data-background-scene="02"]:after{background-position:center top}
body[data-background-scene="04"]{--page-photo:url("assets/gallery/unilever/p15-5-2048x1536.jpg")}
body[data-background-scene="10"]{--page-photo:url("assets/gallery/accor/p17-1-1460x746.jpg")}
body[data-background-scene="10"]:before,body[data-background-scene="10"]:after{background-position:50% 65%}

/* Dior: tablet showing the illustrated bag. */
body[data-background-scene="01"]{--page-photo:url("assets/showreel/optimized/scene-04.webp")}

/* Compact mobile navigation in document flow: no overlap with page content. */
@media(max-width:950px){body header,.page-accueil header{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:14px 20px;background:#070f26;backdrop-filter:none}header .logo img{width:110px}header .language-switch{margin-left:auto;order:2;font-size:12px}header #menu{order:3;padding:7px 11px;font-size:12px;line-height:1.2}body header #navigation{position:static;order:4;flex-basis:100%;width:100%;margin:0;padding:10px 0 0;background:#070f26;gap:0;align-items:stretch;border-top:1px solid #ffffff24}body header #navigation:not(.open){display:none}body header #navigation.open{display:flex;flex-direction:column}body header #navigation a{display:block;padding:10px 4px;font:400 14px/1.35 var(--sans);white-space:normal;text-align:left;border-bottom:1px solid #ffffff12}body header #navigation a:last-child{border-bottom:0}header .header-cta{display:none}}

/* Mobile: persistent navigation and a stable background viewport on iOS. */
@media(max-width:950px){body header,.page-accueil header{position:sticky;top:0;z-index:100;background:#070f26}body:before,body:after,.page-accueil:before{bottom:auto;height:100vh;height:100lvh;background-attachment:scroll}body header #navigation.open{max-height:calc(100vh - 80px);max-height:calc(100svh - 80px);overflow-y:auto;overscroll-behavior:contain}}

/* Center the homepage copy within the same axis as the showreel. */
.page-accueil .hero .eyebrow,
.page-accueil .hero h1,
.page-accueil .hero .intro,
.page-accueil .hero .tagline{
  margin-left:auto;
  margin-right:auto;
  text-align:center;
}

/* Homepage editorial video in place of the reference slideshow. */
.page-accueil .home-feature{width:100%;margin:42px 0 38px;text-align:center}
.page-accueil .home-feature-heading{margin:0 auto 22px}
.page-accueil .home-feature-heading span{display:block;margin-bottom:8px;color:var(--blue);font:600 12px/1.3 var(--sans);letter-spacing:.18em;text-transform:uppercase}
.page-accueil .home-feature-heading strong{display:block;font:400 clamp(42px,5vw,70px)/1.02 var(--serif)}
.page-accueil .home-feature-heading p{margin:8px 0 0;color:var(--muted);font:500 13px/1.4 var(--sans);letter-spacing:.12em;text-transform:uppercase}
.page-accueil .home-feature-video{width:100%;aspect-ratio:16/9;overflow:hidden;border-left:12px solid #020617;background:#03050a}
.page-accueil .home-feature-video iframe{display:block;width:100%;height:100%;border:0}
@media(max-width:600px){.page-accueil .home-feature{margin:30px 0 32px}.page-accueil .home-feature-heading{margin-bottom:18px}.page-accueil .home-feature-video{border-left-width:6px}}
.page-accueil .home-feature-heading .home-feature-date{margin-top:12px;color:var(--ink);font:400 clamp(20px,2.2vw,29px)/1.15 var(--serif);letter-spacing:0;text-transform:none}
.page-accueil .home-feature-heading a{display:inline-block;margin-top:13px;border-bottom:1px solid currentColor;color:var(--blue);font:500 12px/1.4 var(--sans);letter-spacing:.09em;text-transform:uppercase}
.page-accueil .home-feature-heading a:hover,.page-accueil .home-feature-heading a:focus-visible{color:#fff}

/* Give the agile homepage promise a little more presence. */
.page-accueil .hero .tagline{max-width:900px;color:var(--blue);font-size:clamp(17px,1.6vw,22px);line-height:1.35}
.page-accueil .home-feature-heading .home-feature-role{margin:0 0 12px}
