/* Page Productions de Ryze AI Studios : codes d'une plateforme de streaming (affiche, rangées, fiches). */
.pr{--nf:#E50914;--card:clamp(150px,17vw,300px);--poster:clamp(140px,14vw,240px);background:#0A0A0C}
.pr .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.pr .mono{font-family:var(--mono)}
.pr .big{font-size:clamp(34px,5vw,76px);line-height:1.02;letter-spacing:-.035em;font-weight:700;margin:14px 0 18px}
.pr .lead{color:var(--mu);font-size:clamp(16px,1.3vw,19px);max-width:640px}
.pr .sec{padding:clamp(70px,9vw,140px) 0}
.pr .btn-g{background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px var(--line2)}
.pr .btn-g:hover{background:rgba(255,255,255,.14)}
.pr video{display:block;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .6s}
.pr video.on{opacity:1}

/* Affiche */
.billboard{position:relative;height:min(92vh,980px);min-height:560px;overflow:hidden;background:#000}
.bb{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity 1.1s,visibility 1.1s}
.bb.on{opacity:1;visibility:visible}
.bbm,.bbm img,.bbm video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.bbm img{transform:scale(1.08);transition:transform 9s linear}
.bb.on .bbm img{transform:scale(1)}
.bbm::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,10,12,.92) 0%,rgba(10,10,12,.55) 38%,rgba(10,10,12,0) 70%),linear-gradient(0deg,#0A0A0C 0%,rgba(10,10,12,0) 32%)}
.bbt{position:absolute;left:0;right:0;bottom:clamp(110px,16vh,190px);z-index:2}
.bbt>*{max-width:620px}
.orig{display:inline-flex;align-items:center;gap:10px;font-size:12px;letter-spacing:.32em;text-transform:uppercase;color:#fff;font-weight:600}
.orig i{width:16px;height:24px;background:var(--nf);clip-path:polygon(0 0,32% 0,100% 100%,68% 100%);box-shadow:0 0 18px rgba(229,9,20,.6)}
.bbtitle{font-family:'Bebas Neue',var(--sans);font-weight:400;font-size:clamp(64px,10vw,170px);line-height:.86;letter-spacing:.01em;margin:16px 0 14px;text-shadow:0 6px 40px rgba(0,0,0,.5)}
.bb.on .bbtitle{animation:bbin 1s cubic-bezier(.2,.8,.2,1) both}
.bb.on .bbmeta,.bb.on .bbtxt,.bb.on .bbctas{animation:bbin 1s .15s cubic-bezier(.2,.8,.2,1) both}
@keyframes bbin{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
.bbmeta{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:14px;color:#ddd;margin-bottom:14px}
.bbmeta span:first-child{color:#46d369;font-weight:700}
.bbmeta span+span::before{content:"·";margin-right:14px;color:#777}
.bbtxt{font-size:clamp(15px,1.3vw,19px);color:#e8e8e8;line-height:1.5;text-shadow:0 2px 12px rgba(0,0,0,.6)}
.bbctas{display:flex;gap:12px;margin-top:24px;flex-wrap:wrap}
.pr .play,.pr .more{display:inline-flex;align-items:center;gap:10px;height:50px;padding:0 26px 0 20px;border-radius:6px;font-weight:700;font-size:17px;transition:background .2s,transform .2s}
.pr .play{background:#fff;color:#000}.pr .play:hover{background:rgba(255,255,255,.78)}
.pr .more{background:rgba(109,109,110,.7);color:#fff}.pr .more:hover{background:rgba(109,109,110,.45)}
.pr .play svg,.pr .more svg{width:26px;height:26px;fill:currentColor}
.bbfade{position:absolute;left:0;right:0;bottom:0;height:120px;background:linear-gradient(0deg,#0A0A0C,transparent);z-index:1;pointer-events:none}
.bbdots{position:absolute;left:0;right:0;bottom:clamp(60px,9vh,110px);z-index:3;display:flex;gap:8px}
.bbdots button{width:28px;height:3px;border-radius:2px;background:rgba(255,255,255,.3);overflow:hidden;position:relative}
.bbdots button.on::after{content:"";position:absolute;inset:0;background:#fff;transform-origin:left;animation:dot 9s linear both}
@keyframes dot{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.mute{position:absolute;right:var(--pad);bottom:clamp(110px,16vh,190px);z-index:3;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.6);display:grid;place-items:center;background:rgba(0,0,0,.25)}
.mute svg{width:20px;height:20px;fill:#fff}
.mute.on .x{display:none}

/* Rangées */
.rows{position:relative;z-index:4;margin-top:clamp(-90px,-8vh,-40px)}
.row{margin:0 0 clamp(26px,3.4vw,48px)}
.rt{font-size:clamp(17px,1.5vw,24px);font-weight:700;letter-spacing:-.01em;margin-bottom:12px;display:flex;align-items:baseline;gap:14px}
.rmore{font-size:13px;color:#54b9c5;font-weight:600}
.rail{position:relative}
.track{display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:22px var(--pad) 36px;margin:-22px 0 -36px;scroll-padding:0 var(--pad)}
@media(min-width:1200px){.track{padding-left:calc((100vw - min(1760px,92vw))/2 + var(--pad));scroll-padding-left:calc((100vw - min(1760px,92vw))/2 + var(--pad))}}
.track::-webkit-scrollbar{display:none}
.ar{position:absolute;top:0;bottom:0;z-index:6;width:clamp(34px,4vw,56px);font-size:44px;color:#fff;background:rgba(10,10,12,.55);opacity:0;transition:opacity .25s}
.ar.l{left:0}.ar.r{right:0}
.rail:hover .ar{opacity:1}.ar[disabled]{visibility:hidden}
@media(hover:none){.ar{display:none}}
.card{flex:0 0 var(--card);scroll-snap-align:start;position:relative;border-radius:6px;transition:transform .35s cubic-bezier(.2,.8,.2,1),z-index 0s .35s;z-index:1}
.cimg{display:block;position:relative;aspect-ratio:16/9;border-radius:6px;overflow:hidden;background:#1a1a1d}
.cimg img,.cimg video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cinfo{display:block;padding:10px 4px 0}
.cinfo b{display:block;font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cmeta{display:flex;gap:8px;font-size:12px;color:var(--mu);margin-top:3px;white-space:nowrap;overflow:hidden}
.cmeta .mt{color:#46d369;font-weight:600}
@media(hover:hover){
  .card:hover{transform:scale(1.14);z-index:5;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
  .card:hover .cimg{box-shadow:0 18px 40px rgba(0,0,0,.7)}
  .track>.card:first-child:hover{transform-origin:left center}.track>.card:last-child:hover{transform-origin:right center}
}
.row-poster .card{flex-basis:var(--poster)}
.row-poster .cimg{aspect-ratio:2/3}
.row-poster .cinfo{position:absolute;left:0;right:0;bottom:0;padding:40px 12px 12px;background:linear-gradient(0deg,rgba(0,0,0,.9),transparent);border-radius:0 0 6px 6px}
.row-poster .cinfo b{font-family:'Bebas Neue',var(--sans);font-weight:400;font-size:clamp(22px,2vw,32px);letter-spacing:.02em;white-space:normal;line-height:.95}
.row-poster .cimg::before{content:"";position:absolute;z-index:2;top:10px;left:10px;width:10px;height:16px;background:var(--nf);clip-path:polygon(0 0,32% 0,100% 100%,68% 100%)}
.card.cta .cimg::after{content:"+";position:absolute;inset:0;display:grid;place-items:center;font-size:72px;font-weight:200;background:rgba(10,10,12,.62);color:#fff}
.card.cta .cimg img{filter:grayscale(1) blur(2px)}
.row-top .card{flex-basis:calc(var(--card) * 1.12);display:flex;align-items:flex-end}
.row-top .rank{flex:0 0 auto;font-family:'Bebas Neue',var(--sans);font-size:clamp(110px,12vw,210px);line-height:.72;color:#0A0A0C;-webkit-text-stroke:3px #595959;margin-right:-18px;position:relative;z-index:0;letter-spacing:-.04em}
.row-top .cimg{flex:1;aspect-ratio:2/3;z-index:1}
.row-top .cinfo{display:none}
.row-resume .cimg::after{content:"";position:absolute;left:0;bottom:0;height:3px;width:var(--pg,40%);background:var(--nf)}

/* Vote (démo) */
.g2v{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(30px,5vw,90px);align-items:center}
@media(max-width:860px){.g2v{grid-template-columns:1fr}}
.vsteps{list-style:none;margin-top:28px;display:grid;gap:12px}
.vsteps li{display:flex;gap:16px;align-items:center;font-size:16px;padding:14px 18px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.02)}
.vsteps .mono{color:var(--gold);font-size:12px}
.phone{justify-self:center;width:min(340px,82vw);aspect-ratio:9/19;border-radius:44px;padding:11px;background:linear-gradient(145deg,#2b2b30,#111);box-shadow:0 40px 90px -20px rgba(255,91,214,.35),0 0 0 1px rgba(255,255,255,.08)}
.screen{position:relative;height:100%;border-radius:34px;overflow:hidden;background:#000}
.pv,.pv img,.pv video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pv::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.85) 0%,rgba(0,0,0,.1) 55%,rgba(0,0,0,.45) 100%)}
.ptop{position:absolute;top:22px;left:20px;right:20px;font-size:11px;letter-spacing:.16em;display:flex;align-items:center;gap:8px;color:#fff}
.ptop::before{content:"";position:absolute;top:-12px;left:0;right:0;height:3px;border-radius:2px;background:linear-gradient(90deg,#fff 62%,rgba(255,255,255,.3) 62%)}
.rec{width:8px;height:8px;border-radius:50%;background:var(--nf);animation:pulse 1.4s infinite}
@keyframes pulse{50%{opacity:.25}}
.pq,.pres{position:absolute;left:16px;right:16px;bottom:22px}
.pq p{font-size:15px;font-weight:600;line-height:1.35;margin-bottom:12px;text-shadow:0 2px 10px #000}
.pchoices{background:#fff;color:#000;border-radius:16px;padding:12px;display:grid;gap:8px;box-shadow:0 10px 30px rgba(0,0,0,.4)}
.pchoices button{display:flex;flex-direction:column;align-items:flex-start;text-align:left;padding:10px 14px;border-radius:10px;background:#efefef;transition:transform .15s,background .2s}
.pchoices button:hover{background:#e4e4e4;transform:scale(1.02)}
.pchoices b{font-size:18px;letter-spacing:.04em;background:linear-gradient(90deg,#a537fd,#ff3b6b,#ffb347);-webkit-background-clip:text;background-clip:text;color:transparent}
.pchoices span{font-size:12px;color:#555}
.pres{background:rgba(10,10,12,.82);backdrop-filter:blur(10px);border:1px solid var(--line2);border-radius:16px;padding:18px;animation:bbin .5s both}
.pres .mono{font-size:10px;letter-spacing:.2em;color:var(--gold)}
.pres b{display:block;font-family:'Bebas Neue',var(--sans);font-size:46px;font-weight:400;line-height:1;margin:6px 0 8px}
.pres p{font-size:14px;color:#ddd}
#preplay{margin-top:14px;font-size:11px;letter-spacing:.16em;color:var(--mu)}
.fine{font-size:13px;color:var(--mu2);margin-top:30px}

/* Chiffres et méthode */
.hstats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;margin-top:40px}
@media(max-width:860px){.hstats{grid-template-columns:repeat(2,1fr)}}
.hs{background:#0A0A0C;padding:clamp(22px,3vw,40px)}
.hs b{display:block;font-family:'Bebas Neue',var(--sans);font-weight:400;font-size:clamp(54px,6vw,96px);line-height:.9;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.hs span{color:var(--mu);font-size:14px}
.gates{list-style:none;display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:44px;counter-reset:g}
@media(max-width:1100px){.gates{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.gates{grid-template-columns:1fr}}
.gates li{position:relative;padding:22px 20px;border:1px solid var(--line);border-radius:14px;background:linear-gradient(180deg,rgba(255,255,255,.03),transparent);opacity:0;transform:translateY(22px);transition:opacity .6s calc(var(--i) * 70ms),transform .6s calc(var(--i) * 70ms),border-color .3s}
.gates.in li{opacity:1;transform:none}
.gates li:hover{border-color:var(--gold)}
.gn{font-size:12px;color:var(--gold);display:block;margin-bottom:12px}
.gates b{display:block;font-size:17px;margin-bottom:6px}
.gd{color:var(--mu);font-size:14px;line-height:1.45}
.fin{text-align:center}
.fin .lead{margin:0 auto}
.fin .ctas{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:32px}
.fin .upd{color:var(--mu2);font-size:12px;margin-top:40px}

/* Fiche plein écran */
.modal{position:fixed;inset:0;z-index:200;overflow-y:auto;overscroll-behavior:contain;padding:clamp(0px,3vw,40px) 0}
.modal[hidden]{display:none}
.mback{position:fixed;inset:0;background:rgba(0,0,0,.75);animation:fd .3s both}
@keyframes fd{from{opacity:0}}
.mbox{position:relative;width:min(1040px,100%);margin:0 auto;background:#181818;border-radius:10px;overflow:hidden;box-shadow:0 30px 120px rgba(0,0,0,.8);animation:pop .4s cubic-bezier(.2,.8,.2,1) both}
@keyframes pop{from{opacity:0;transform:translateY(40px) scale(.96)}}
@media(max-width:700px){.mbox{border-radius:0;min-height:100%}}
.mx{position:absolute;top:14px;right:14px;z-index:5;width:40px;height:40px;border-radius:50%;background:#181818;font-size:18px}
body.mopen{overflow:hidden}
.md{--t:var(--gold)}
.mdhero{position:relative;width:100%;height:max(340px,min(56.25vw,585px));background:#000}
.mdhero>img,.mdhero>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.mdg{position:absolute;inset:0;background:linear-gradient(0deg,#181818 2%,rgba(24,24,24,0) 55%),linear-gradient(90deg,rgba(24,24,24,.7),transparent 60%)}
.mdh{position:absolute;left:clamp(20px,4vw,48px);right:clamp(20px,4vw,48px);bottom:clamp(20px,3vw,36px)}
.mdh h2{font-family:'Bebas Neue',var(--sans);font-weight:400;font-size:clamp(48px,7vw,104px);line-height:.88;margin:12px 0 8px}
.mdacc{font-size:clamp(15px,1.4vw,19px);max-width:560px;color:#eee}
.mdbtn{display:flex;gap:12px;margin-top:18px;flex-wrap:wrap}
.ghost{display:inline-flex;align-items:center;height:50px;padding:0 22px;border-radius:6px;border:1px solid rgba(255,255,255,.5);font-weight:600}
.ghost:hover{border-color:#fff}
.mdbody{padding:clamp(20px,4vw,48px)}
.mdtop{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(20px,4vw,50px)}
@media(max-width:760px){.mdtop{grid-template-columns:1fr}}
.mdstat{display:flex;gap:14px;flex-wrap:wrap;font-size:14px;color:var(--mu);margin-bottom:12px}
.live{color:#46d369;font-weight:700}
.dep{font-size:16px;line-height:1.6;color:#ddd}
.kpis{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-content:start}
.kpi{padding:16px;border-radius:10px;background:rgba(255,255,255,.04);border-left:3px solid var(--t)}
.kpi b{display:block;font-family:'Bebas Neue',var(--sans);font-weight:400;font-size:44px;line-height:1;color:#fff}
.kpi span{font-size:13px;color:var(--mu)}
.md h3{display:flex;align-items:center;gap:14px;font-size:22px;margin:48px 0 6px}
.md h3 .mono{font-size:12px;color:var(--t);border:1px solid var(--t);border-radius:999px;padding:3px 10px}
.hint{color:var(--mu);font-size:14px;margin-bottom:18px}
.strip{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px;scrollbar-width:thin}
.frame{flex:0 0 clamp(170px,26%,250px);scroll-snap-align:start}
.fstage{position:relative;aspect-ratio:9/14;border-radius:8px;overflow:hidden;background:#222}
.fstage .sk,.fstage .rd{position:absolute;inset:0}
.sk img,.rd img,.rd video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.sk img{filter:grayscale(1) contrast(1.8) brightness(1.25) invert(1);mix-blend-mode:normal}
.sk::after{content:"CROQUIS";position:absolute;top:8px;left:8px;font-family:var(--mono);font-size:9px;letter-spacing:.2em;color:#000;background:rgba(255,255,255,.85);padding:2px 6px;border-radius:3px}
.rd{clip-path:inset(0 100% 0 0);transition:clip-path 1.2s cubic-bezier(.7,0,.2,1)}
.frame.in .rd{clip-path:inset(0 0 0 0)}
.frame figcaption{font-size:13px;margin-top:8px;color:#ddd}
.frame figcaption .mono{display:block;font-size:10px;letter-spacing:.18em;color:var(--t);margin-bottom:2px}
.fait{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
@media(max-width:640px){.fait{grid-template-columns:1fr}}
.fait li{display:flex;gap:14px;padding:16px;border-radius:10px;background:rgba(255,255,255,.04);font-size:15px}
.fait i{font-style:normal;font-size:12px;color:var(--t);padding-top:2px}
.fixes{display:grid;gap:10px;margin-top:14px}
.fix{display:grid;grid-template-columns:1fr 1fr;border-radius:10px;overflow:hidden;border:1px solid var(--line)}
@media(max-width:640px){.fix{grid-template-columns:1fr}}
.fix p{padding:14px 16px;font-size:14px;line-height:1.45}
.fix .mono{display:block;font-size:10px;letter-spacing:.2em;margin-bottom:4px}
.fix .a{background:rgba(255,59,48,.07);color:#ccc}.fix .a .mono{color:#ff6b61}
.fix .b{background:rgba(70,211,105,.07)}.fix .b .mono{color:#46d369}
.md .note{margin-top:30px;font-size:13px;color:var(--mu)}
@media(prefers-reduced-motion:reduce){.bbm img,.bb.on .bbm img{transform:none;transition:none}.rd{clip-path:none!important}.gates li{opacity:1;transform:none}*{animation:none!important}}
@media(max-width:640px){.billboard{height:86vh}.bbm::after{background:linear-gradient(0deg,#0A0A0C 8%,rgba(10,10,12,.55) 55%,rgba(10,10,12,.2) 100%)}.bbt{bottom:90px}.bbdots{bottom:50px}.mute{bottom:auto;top:90px}.pr .play,.pr .more{height:44px;font-size:15px}}
.pr .card.cta{margin:0;padding:0;border:0;background:none;display:block;gap:0;border-radius:6px}
.pr .card.cta .cimg{background:linear-gradient(140deg,rgba(255,91,214,.35),rgba(255,179,71,.25)),#141417}
.pr .card.cta .cimg img{opacity:.45}
.pr .md .note{border:0;padding:0}
.card .cimg img,.card .cimg video{object-position:center 22%}