:root{--bg:#101314;--panel:#1b2021;--ink:#f5f3eb;--muted:#a8b0ae;--accent:#ed1848}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.5 Arial,sans-serif}button,input,select,textarea{font:inherit}button,a,input,select,textarea{outline-offset:5px}button{cursor:pointer}a{color:inherit;text-decoration:none}.wrap{max-width:1240px;margin:auto;padding:0 32px}.demo{background:#f4e7cb;color:#433923;text-align:center;padding:7px;font-size:12px}header{display:flex;align-items:center;justify-content:space-between;padding:25px 0;border-bottom:1px solid #ffffff20}.logo{font-size:27px;font-weight:900;letter-spacing:-1px}.logo span{color:var(--accent)}.logo small{display:block;font-size:9px;letter-spacing:4px;font-weight:400}nav{display:flex;gap:28px;align-items:center}button,.button{border:0;border-radius:7px;padding:12px 20px;background:var(--accent);color:#171b1b;font-weight:700;display:inline-block}.ghost{background:transparent;color:var(--ink);border:1px solid #ffffff35}.hero{display:grid;grid-template-columns:1.2fr 1fr;gap:60px;align-items:center;padding:75px 0}.eyebrow{font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--accent);font-weight:700}h1{font-size:clamp(42px,5.4vw,72px);line-height:1.04;letter-spacing:-3px;margin:22px 0}h1 em{font-style:normal;color:var(--accent)}p{color:var(--muted)}.hero p{max-width:460px;font-size:18px}.hero .button{margin-top:18px}.art{position:relative;min-height:370px;overflow:hidden;border-radius:16px;background:radial-gradient(ellipse at 40% 0,#ed184845,transparent 65%),linear-gradient(140deg,#333937,#111617);display:flex;align-items:center;justify-content:center;gap:25px}.speaker{width:110px;height:235px;border:2px solid #4c5351;border-radius:10px;background:repeating-linear-gradient(45deg,#242a29 0 2px,#191e1d 2px 4px);box-shadow:10px 20px 30px #0008;transform:rotate(-9deg)}.speaker:before,.speaker:after{content:'';display:block;border:8px solid #303735;border-radius:50%;width:65px;height:65px;margin:25px auto;background:#131817;box-shadow:inset 0 0 0 10px #232a28}.speaker:after{width:45px;height:45px;margin-top:15px}.speaker.second{height:180px;width:90px;transform:rotate(9deg) translateY(30px)}.second:before{width:55px;height:55px}.second:after{width:30px;height:30px}.art small{position:absolute;bottom:20px;left:22px;color:#c2c7c0;font-size:11px;letter-spacing:2px}.strip{display:flex;gap:30px;padding:20px 0;border-top:1px solid #ffffff20;border-bottom:1px solid #ffffff20;color:#b9c1bc;font-size:13px;justify-content:space-between}.section{padding:65px 0}h2{font-size:36px;letter-spacing:-1px;margin:10px 0}.sectionhead{display:flex;justify-content:space-between;align-items:end;gap:20px}.sectionhead p{margin:5px 0}.search{max-width:300px}.filters{display:flex;gap:10px;flex-wrap:wrap;margin:26px 0}.filters button{background:var(--panel);color:var(--muted);font-size:13px}.filters button.active{background:var(--ink);color:var(--bg)}input,select,textarea{border:1px solid #ffffff28;background:#151a1a;border-radius:6px;padding:11px;color:var(--ink);width:100%}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.card{border:1px solid #ffffff15;border-radius:11px;background:var(--panel);overflow:hidden}.visual{height:150px;display:flex;align-items:center;justify-content:center;font-size:62px;background:radial-gradient(ellipse,#ffffff0c,transparent 70%)}.cardbody{padding:20px}.tag{color:var(--accent);font-size:10px;letter-spacing:1.5px;text-transform:uppercase}.card h3{margin:7px 0;font-size:21px}.card p{font-size:14px;min-height:42px}.cardfoot{display:flex;align-items:center;justify-content:space-between;gap:10px}.cardfoot span{font-size:12px;color:var(--muted)}.cardfoot button{font-size:13px;padding:10px 14px}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:28px}.steps article{border-top:1px solid #ffffff30;padding-top:20px}.steps b{color:var(--accent)}footer{border-top:1px solid #ffffff20;padding:30px 0;color:var(--muted);font-size:13px}dialog{background:var(--bg);color:var(--ink);border:1px solid #ffffff30;border-radius:14px;max-width:680px;width:calc(100% - 24px);max-height:92vh;padding:28px}dialog::backdrop{background:#000b}.dialoghead{display:flex;justify-content:space-between;align-items:center}dialog h2{font-size:27px}.close{padding:6px 12px}.line{padding:15px 0;border-bottom:1px solid #ffffff20;display:flex;align-items:center;justify-content:space-between;gap:15px}.line input{width:75px}.line button{padding:5px 9px;background:transparent;color:var(--muted);font-weight:400}label{display:block;font-size:13px;color:#c5cdc7;margin:15px 0 0}label input,label select,label textarea{margin-top:5px}.fields{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}.notice{background:#ed184812;border:1px solid #ed184835;padding:12px;font-size:12px;border-radius:6px}.status{color:var(--accent);font-size:13px}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:12px 24px;border-radius:8px;display:none;z-index:5}details{font-size:13px;color:var(--muted);margin:10px 0 20px}summary{cursor:pointer}button:disabled{opacity:.45;cursor:default}@media(max-width:760px){.wrap{padding:0 20px}nav a{display:none}.hero{grid-template-columns:1fr;gap:30px;padding:40px 0}.art{min-height:250px}.speaker{height:190px}.strip{flex-wrap:wrap;gap:12px}.grid{grid-template-columns:1fr 1fr}.sectionhead{display:block}.search{margin-top:20px;max-width:none}.steps{grid-template-columns:1fr}.fields{grid-template-columns:1fr}h1{letter-spacing:-2px}.section{padding:40px 0}}@media(max-width:460px){.grid{grid-template-columns:1fr}.logo{font-size:23px}header button{font-size:12px;padding:10px}.hero h1{font-size:45px}}

nav a[aria-current="page"]{color:var(--accent)}nav a:hover{color:var(--accent)}.intro{padding:65px 0 35px;text-align:center}.intro h1{max-width:900px;margin:20px auto}.intro p{max-width:670px;margin:20px auto;font-size:19px}.video-slot{aspect-ratio:16/8;position:relative;border:1px solid #ffffff25;border-radius:16px;overflow:hidden;background:radial-gradient(ellipse at 20% 110%,#ed184855,transparent 55%),radial-gradient(ellipse at 90% 0,#47787744,transparent 60%),#1b2222;display:grid;place-items:center;text-align:center;padding:25px}.video-slot:before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(115deg,transparent 0 12%,#ffffff05 13%,transparent 14% 25%);pointer-events:none}.video-slot h2{font-size:clamp(24px,4vw,48px)}.video-slot p{max-width:500px}.play-mark{display:grid;place-items:center;width:70px;height:70px;border-radius:50%;border:1px solid #ed184880;color:var(--accent);margin:0 auto 20px;font-size:25px}.split{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:start}.paths{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:28px}.path{display:block;padding:35px;border:1px solid #ffffff25;border-radius:12px;background:var(--panel)}.path:hover{border-color:var(--accent)}.path h3{font-size:31px;margin:12px 0}.path p{max-width:420px}.path .arrow{display:inline-block;color:var(--accent);margin-top:20px}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin:35px 0}.service{border-top:1px solid #ffffff40;padding:25px 0}.service h2{font-size:25px}.callout{background:var(--panel);border-radius:12px;padding:35px;margin:35px 0 65px}.callout p{max-width:700px}footer a{color:var(--ink)}@media(max-width:760px){nav{gap:13px;flex-wrap:wrap}nav a{display:inline;font-size:13px}header{gap:18px;flex-wrap:wrap}.intro{padding-top:35px}.split,.paths,.service-grid{grid-template-columns:1fr;gap:20px}.video-slot{aspect-ratio:4/3}.path{padding:25px}.intro h1{font-size:43px}}
/* Identité Oxygène : rouge framboise et rose du logo fourni. */
:root{--accent:#ed1848;--bg:#141114;--panel:#211b20;--muted:#b8adb4}
body{background:var(--bg)}
.brand-logo{display:block;width:180px;height:auto;max-width:100%}
header .logo{display:flex;align-items:center;gap:12px}
.brand-caption{display:block;color:var(--ink);font-size:10px;letter-spacing:2px;font-weight:700}
.button,button{background:#ed1848;color:#16050b}
.button:hover,button:hover{filter:brightness(1.1)}
.ghost{background:transparent;color:var(--ink)}
.filters button{background:var(--panel);color:var(--muted)}
.filters button.active{background:var(--ink);color:var(--bg)}
.demo{background:#361320;color:#ffd7e4}
.video-slot{background:radial-gradient(ellipse at 20% 110%,#ed184855,transparent 55%),radial-gradient(ellipse at 90% 0,#a40e3044,transparent 60%),#21181f}
.play-mark{border-color:#ed184880}
.notice{background:#ed184812;border-color:#ed184850}
.art{background:radial-gradient(ellipse at 40% 0,#ed184845,transparent 65%),linear-gradient(140deg,#392730,#171115)}
footer .brand-logo{width:145px}
@media(max-width:760px){.brand-logo{width:150px}nav{gap:12px}nav a{font-size:12px}}

/* Logo officiel Oxygène Événements, conservé dans ses proportions. */
header .brand-logo{width:230px;height:auto;object-fit:contain}footer .brand-logo{width:200px;height:auto}@media(max-width:760px){header .brand-logo{width:185px}}

:root{--accent:#ed1848} .button,button{background:#ed1848;color:#ffffff} .ghost{background:transparent;color:var(--ink)} .filters button{background:var(--panel);color:var(--muted)} .filters button.active{background:var(--ink);color:var(--bg)}


.home-video{overflow:hidden;border:1px solid #ffffff25;border-radius:16px;background:#000}.home-video video{display:block;width:100%;height:auto;max-height:75vh;object-fit:contain}

/* Vidéo d’illustration, sans commandes visibles. */
.ambient-showcase{position:relative;padding:20px 0 10px;margin:0 0 25px}
.ambient-showcase:before{content:'';position:absolute;inset:35px -25px 10px;background:radial-gradient(ellipse at 15% 75%,#ed184832,transparent 65%);pointer-events:none;z-index:-1}
.ambient-heading,.ambient-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px}
.ambient-heading{padding:0 4px 17px}.ambient-caption{font-size:10px;letter-spacing:2px;color:var(--muted)}
.ambient-frame{position:relative;isolation:isolate;overflow:hidden;border-radius:18px;border:1px solid #ffffff28;border-top:3px solid #ed1848;background:#090909;box-shadow:0 25px 70px #0006}
.ambient-frame video{display:block;width:100%;height:auto;min-height:220px;object-fit:contain}
.ambient-shade{position:absolute;inset:0;background:linear-gradient(0deg,#090408b3,transparent 42%);pointer-events:none}
.ambient-signature{position:absolute;left:35px;bottom:30px;display:flex;flex-direction:column;gap:12px;pointer-events:none;text-shadow:0 2px 14px #000}
.ambient-label{font-size:9px;letter-spacing:3px;border-left:3px solid #ed1848;padding-left:10px}
.ambient-signature>span:last-child{font-size:clamp(22px,3.8vw,46px);line-height:1.05;letter-spacing:-1px}.ambient-signature strong{color:#fff}
.ambient-corner{position:absolute;right:30px;bottom:30px;font-size:10px;letter-spacing:2px;color:#fff9;pointer-events:none}
.ambient-bottom{padding:20px 4px;font-size:12px;color:var(--muted)}.ambient-bottom a{color:var(--ink)}.ambient-bottom a:hover{color:var(--accent)}.ambient-line{height:1px;flex:1;background:linear-gradient(90deg,#ed1848,#ffffff15)}
@media(max-width:760px){.ambient-heading{align-items:start;flex-direction:column;gap:7px}.ambient-caption{font-size:9px}.ambient-signature{left:18px;bottom:20px;gap:7px}.ambient-signature>span:last-child{font-size:25px}.ambient-corner{display:none}.ambient-bottom{font-size:11px;gap:12px}.ambient-line{display:none}.ambient-frame{border-radius:12px}}
@media(prefers-reduced-motion:reduce){.ambient-showcase{scroll-behavior:auto}}

/* Vidéo intégrée en arrière-plan du premier écran. */
body:has(.home-hero){overflow-x:clip}
.home-hero{position:relative;isolation:isolate;width:100vw;margin-left:calc(50% - 50vw);min-height:660px;min-height:min(820px,85svh);display:flex;align-items:center;background:#141114;overflow:hidden}
.home-hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:-3;pointer-events:none}
.home-hero-overlay{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(12,8,11,.83),rgba(12,8,11,.42) 60%,rgba(12,8,11,.18)),linear-gradient(0deg,#141114,transparent 28%,transparent 80%,#14111440);pointer-events:none}
.home-hero-content{width:min(1240px,100%);margin:auto;padding:85px 32px 125px}.home-hero h1{max-width:850px;font-size:clamp(44px,6vw,80px);text-shadow:0 3px 25px #0006}.home-hero p{max-width:540px;color:#f1e7ec;font-size:19px;text-shadow:0 2px 10px #000}.home-hero .eyebrow{color:#fff}.home-hero em{color:#ff496f}
.home-hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}.home-hero .ghost{background:#15101466;border-color:#ffffff70}
.home-hero-bottom{position:absolute;bottom:28px;left:max(32px,calc((100vw - 1176px)/2));right:max(32px,calc((100vw - 1176px)/2));display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:11px;letter-spacing:2px;color:#e7dce2}.home-hero-bottom a{letter-spacing:0}
@media(max-width:760px){.home-hero{min-height:650px}.home-hero-content{padding:65px 20px 120px}.home-hero h1{font-size:clamp(40px,9vw,62px);letter-spacing:-2px}.home-hero p{font-size:17px}.home-hero-bottom{left:20px;right:20px;letter-spacing:1px;font-size:9px}.home-hero-overlay{background:linear-gradient(90deg,#10090dde,#10090d66),linear-gradient(0deg,#141114,transparent 35%)}.home-hero-actions a{font-size:13px}}

/* Galerie des quatre réalisations fournies. */
.ads-showcase{padding:25px 0 45px}.ads-heading{display:flex;align-items:end;justify-content:space-between;gap:25px;margin-bottom:25px}.ads-heading h2{font-size:clamp(32px,4vw,52px);line-height:1.1}.ads-heading em{font-style:normal;color:var(--accent)}.ads-navigation{display:flex;align-items:center;gap:10px}.ads-count{font-size:12px;letter-spacing:2px;color:var(--muted);margin-right:15px}.ads-navigation button{width:46px;height:46px;border-radius:50%;padding:0;font-size:22px}.ads-stage{border:1px solid #ffffff25;border-radius:16px;overflow:hidden;background:radial-gradient(ellipse at 50% 0,#ed184825,transparent 70%),#090809;box-shadow:0 25px 60px #0005}.ads-slide[hidden]{display:none}.ads-player{height:clamp(330px,55vw,600px);display:flex;justify-content:center;background:radial-gradient(ellipse,#292025,#090809 75%)}.ads-player video{display:block;width:100%;height:100%;object-fit:contain;background:transparent}.ads-info{border-top:1px solid #ffffff15;padding:24px 30px;display:flex;justify-content:space-between;align-items:center;gap:20px;background:var(--panel)}.ads-info h3{margin:5px 0 0;font-size:28px;letter-spacing:-.5px}.ads-stamp{font-size:9px;letter-spacing:2px;line-height:1.8;color:var(--muted);border-left:3px solid var(--accent);padding-left:14px}.ads-selector{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:18px}.ads-pick{display:flex;align-items:center;text-align:left;gap:12px;padding:18px 14px;border:1px solid #ffffff20;background:var(--panel);color:var(--ink);font-weight:400;min-width:0}.ads-pick.selected{border-color:var(--accent);background:linear-gradient(130deg,#ed184820,var(--panel));box-shadow:inset 0 -3px var(--accent)}.ads-pick small{display:block;color:var(--muted);font-size:10px;margin-top:5px}.ads-pick strong{font-size:13px}.ads-number{font-size:11px;color:var(--accent)}.ads-pick-play{margin-left:auto;font-size:23px;color:var(--accent)}.ads-announcement{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(max-width:760px){.ads-selector{grid-template-columns:repeat(2,1fr)}.ads-heading{align-items:center}.ads-navigation{gap:6px}.ads-count{margin-right:0;font-size:10px;white-space:nowrap}.ads-navigation button{width:36px;height:36px}.ads-info{padding:20px}.ads-info h3{font-size:23px}.ads-stamp{display:none}.ads-heading h2{font-size:32px}.ads-player{height:470px;max-height:65svh}.ads-pick{padding:13px 10px;gap:8px}.ads-pick-play{font-size:19px}}

/* Les quatre films sont en 9:16 : cartes à leurs proportions natives. */
.reels{padding:25px 0 55px}.reels-heading{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:30px}.reels-heading h2{font-size:clamp(38px,5vw,62px);line-height:1.03;margin:12px 0}.reels-heading em{font-style:normal;color:var(--accent)}.reels-heading p{margin-bottom:0}.reels-arrows{display:flex;gap:10px;padding-bottom:4px}.reels-arrows button{border-radius:50%;width:48px;height:48px;padding:0;font-size:23px}.reels-track{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-left:0;padding:8px 2px 24px;scrollbar-color:#ed1848 #ffffff10;scrollbar-width:thin}.reel{flex:0 0 calc((100% - 48px)/3);min-width:0;scroll-snap-align:start}.reel-screen{aspect-ratio:9/16;overflow:hidden;border-radius:18px;border:1px solid #ffffff25;background:#080708;box-shadow:0 12px 30px #0004}.reel-screen video{display:block;width:100%;height:100%;object-fit:contain}.reel-caption{display:flex;align-items:center;gap:15px;padding:20px 3px}.reel-caption h3{font-size:21px;margin:5px 0 0;letter-spacing:-.5px}.reel-index{font-size:12px;color:var(--muted);border-right:1px solid #ed1848;padding-right:15px}.reels-footer{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #ffffff20;padding-top:17px;font-size:11px;color:var(--muted)}
@media(min-width:1200px){.reel{flex-basis:calc((100% - 72px)/4)}}
@media(max-width:760px){.reel{flex-basis:72%;max-width:340px}.reels-track{gap:18px}.reels-heading{align-items:center}.reels-heading h2{font-size:40px}.reels-heading p{font-size:14px;max-width:240px}.reels-arrows{gap:6px}.reels-arrows button{width:36px;height:36px;font-size:20px}.reel-caption h3{font-size:19px}.reels-footer{font-size:10px;gap:12px}}

.event-films{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.3164fr);align-items:center;gap:24px;padding:15px 0 35px}.event-film{overflow:hidden;border:1px solid #ffffff25;border-radius:16px;background:#080708;box-shadow:0 15px 40px #0004}.event-film video{display:block;width:100%;height:100%;object-fit:contain}.event-film-wide{aspect-ratio:16/9}.event-film-portrait{aspect-ratio:9/16}@media(max-width:760px){.event-films{grid-template-columns:1fr;gap:25px}.event-film-portrait{width:min(100%,340px);justify-self:center}.event-film{border-radius:12px}}

.company-film{aspect-ratio:16/9;overflow:hidden;border:1px solid #ffffff25;border-radius:16px;background:#080708;box-shadow:0 15px 40px #0004}.company-film video{display:block;width:100%;height:100%;object-fit:contain}@media(max-width:760px){.company-film{border-radius:12px}}