
/* Pompes animées et comparaison officielle E85 / SP95 — RS Performance Épernay */
.er-page .fuel-live{position:relative;isolation:isolate;background:radial-gradient(ellipse 45% 45% at 36% 52%,rgba(11,180,100,.11),transparent 70%),radial-gradient(ellipse 38% 45% at 73% 50%,rgba(232,20,42,.10),transparent 75%),repeating-linear-gradient(115deg,transparent 0 5px,rgba(255,255,255,.009) 6px 7px),#080e19;padding:73px 0 49px;border-bottom:1px solid #263247;overflow:hidden}
.er-page .fuel-live-inner{text-align:center;position:relative}
.er-page .fuel-live-overline{font-weight:800;color:#8bb9a8;letter-spacing:.23em;font-size:.69rem;display:flex;align-items:center;justify-content:center;gap:10px}
.er-page .fuel-live-dot{height:8px;width:8px;border-radius:50%;background:#13c774;box-shadow:0 0 0 5px #16d08018,0 0 17px #12ba72;animation:fuel-pulse 2.3s infinite}
.er-page .fuel-live h2{font-weight:900;letter-spacing:-.055em;line-height:1.1;font-size:clamp(2rem,4vw,3.5rem);margin:18px 0 12px;color:#f3f8ff}
.er-page .fuel-live h2 span{color:#7cedaf}
.er-page .fuel-live-lead{font-size:.98rem;line-height:1.7;color:#a4b3c7;max-width:670px;margin:0 auto}
.er-page .fuel-live-stage{position:relative;display:flex;justify-content:center;align-items:center;gap:clamp(22px,7vw,93px);padding:52px 0 24px;min-height:355px}
.er-page .fuel-live-vs{position:absolute;left:50%;top:52%;transform:translate(-50%,-50%);font-size:.88rem;font-weight:950;letter-spacing:.15em;color:#5a677d}
.er-page .fuel-pump{--pump-color:#0cb05d;--pump-glow:rgba(16,199,112,.13);position:relative;flex:0 0 183px;min-width:0;text-align:center;filter:drop-shadow(0 0 25px var(--pump-glow));animation:fuel-float 5.4s ease-in-out infinite}
.er-page .fuel-pump-sp{--pump-color:#f2112a;--pump-glow:rgba(241,17,42,.12);animation-delay:-2.6s}
.er-page .fuel-pump-top{height:52px;border-radius:22px 22px 0 0;background:var(--pump-color);color:#07100c;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;z-index:2}
.er-page .fuel-pump-top small{font-weight:900;font-size:.58rem;letter-spacing:.19em}
.er-page .fuel-pump-top strong{font-size:1.45rem;font-weight:1000;line-height:1.2;letter-spacing:-.04em}
.er-page .fuel-pump-body{height:202px;position:relative;border-radius:0 0 21px 21px;background:linear-gradient(130deg,#0b1625,#121b30);border:2px solid #263651;border-top:0;display:flex;flex-direction:column;align-items:center;padding:20px 17px 16px;z-index:2}
.er-page .fuel-pump-screen{width:100%;height:106px;border:1.5px solid var(--pump-color);border-radius:9px;background:#051019;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;padding:10px 9px 9px;color:#79eab2;box-shadow:inset 0 0 18px #0006}
.er-page .fuel-pump-sp .fuel-pump-screen{background:#170c17;color:#fc7483}
.er-page .fuel-pump-screen>span{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;white-space:nowrap;font-weight:900;font-size:.61rem;letter-spacing:.045em;color:var(--pump-color)}
.er-page .fuel-pump-screen strong{align-self:center;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;color:#43eaa1;font-size:2.4rem;font-weight:600;line-height:1;letter-spacing:-.05em;font-variant-numeric:tabular-nums;text-shadow:0 0 24px #25ef8e3b}
.er-page .fuel-pump-sp .fuel-pump-screen strong{color:#ff7f8c;text-shadow:0 0 24px #ed1e403e}
.er-page .fuel-pump-screen small{font-size:.55rem;color:#678875;display:flex;align-items:center;gap:4px}
.er-page .fuel-pump-sp .fuel-pump-screen small{color:#b76d78}
.er-page .fuel-pump-screen small i{display:inline-block;width:7px;height:7px;background:var(--pump-color);border-radius:50%;box-shadow:0 0 10px var(--pump-color)}
.er-page .fuel-pump-controls{display:flex;gap:23px;margin-top:16px}
.er-page .fuel-pump-controls b{height:17px;width:17px;background:#243653;border-radius:50%;box-shadow:inset 0 -2px 0 #0e1b2e}
.er-page .fuel-pump-brand{width:100%;border:1px solid #263651;background:#091221;border-radius:5px;margin-top:auto;color:#9baec8;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.065em;font-size:.62rem;padding:4px 0}
.er-page .fuel-pump-hose{position:absolute;width:51px;height:135px;border:5px dashed var(--pump-color);border-left:0;border-bottom:0;top:36px;right:-28px;border-radius:0 70px 50px 0;opacity:.95;transform:rotate(-5deg);animation:fuel-hose 4s ease-in-out infinite}
.er-page .fuel-pump-hose span{position:absolute;bottom:-5px;left:24px;width:10px;height:22px;background:var(--pump-color);border-radius:4px;transform:rotate(36deg)}
.er-page .fuel-pump-shadow{position:absolute;left:6px;right:-22px;bottom:-23px;height:17px;border-radius:50%;background:#0008;filter:blur(9px)}
.er-page .fuel-live-bottom{max-width:540px;display:flex;justify-content:center;align-items:center;gap:20px;flex-wrap:wrap;margin:0 auto 10px}
.er-page .fuel-live-bottom p{font-size:.8rem;color:#aab9cb;margin:0;line-height:1.6}
.er-page .fuel-live-refresh{font:inherit;color:#84eab3;border:1px solid #315c4c;background:#10241e;font-weight:800;font-size:.72rem;border-radius:20px;padding:8px 13px;cursor:pointer;transition:background .2s,border-color .2s}
.er-page .fuel-live-refresh:hover{background:#1a3b2a;border-color:#69d5a2}
.er-page .fuel-live-refresh[disabled]{opacity:.55;cursor:wait}
.er-page .fuel-live-source{max-width:760px;margin:10px auto 0;font-size:.72rem;color:#8394aa;line-height:1.7}
.er-page .fuel-live-source a{color:#a5d9c0;text-decoration:underline;text-underline-offset:3px}
.er-page .fuel-pump-screen strong.fuel-price-flash{animation:fuel-appear .55s both}
@keyframes fuel-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes fuel-pulse{0%,100%{opacity:1}50%{opacity:.44}}
@keyframes fuel-hose{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(3deg)}}
@keyframes fuel-appear{from{opacity:.15;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:620px){.er-page .fuel-live{padding:51px 0 35px}.er-page .fuel-live-stage{gap:clamp(34px,11vw,65px);padding:40px 0 30px;min-height:300px}.er-page .fuel-pump{flex-basis:clamp(122px,34vw,170px)}.er-page .fuel-pump-top{height:46px;border-radius:15px 15px 0 0}.er-page .fuel-pump-top strong{font-size:1.28rem}.er-page .fuel-pump-top small{font-size:.49rem}.er-page .fuel-pump-body{height:174px;padding:13px 9px;border-radius:0 0 16px 16px}.er-page .fuel-pump-screen{height:99px;padding:9px 6px}.er-page .fuel-pump-screen span{font-size:.49rem}.er-page .fuel-pump-screen strong{font-size:clamp(1.65rem,6vw,2.25rem)}.er-page .fuel-pump-controls{gap:13px;margin-top:11px}.er-page .fuel-pump-controls b{width:13px;height:13px}.er-page .fuel-pump-brand{font-size:.49rem}.er-page .fuel-pump-hose{right:-20px;width:37px;height:108px;border-width:4px}.er-page .fuel-live-vs{font-size:.72rem;top:50%}.er-page .fuel-live-lead{font-size:.88rem}}
@media(max-width:360px){.er-page .fuel-live-stage{gap:34px}.er-page .fuel-pump{flex-basis:114px}.er-page .fuel-pump-screen strong{font-size:1.7rem}.er-page .fuel-pump-screen>span{font-size:.46rem}.er-page .fuel-pump-brand{font-size:.43rem}}
@media(prefers-reduced-motion:reduce){.er-page .fuel-pump,.er-page .fuel-pump-hose,.er-page .fuel-live-dot,.er-page .fuel-pump-screen strong.fuel-price-flash{animation:none!important}}


/* Hero E85 — texte plus compact à gauche et pompes animées à droite. */
.er-page .er-hero{padding:73px 0 80px;min-height:0}
.er-page .er-hero-grid{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(28px,3.3vw,55px);align-items:center}
.er-page .er-hero h1{font-size:clamp(3.05rem,5.2vw,5.25rem);line-height:1.06;letter-spacing:-.064em;margin-bottom:22px}
.er-page .er-hero .er-lead{font-size:1.02rem;line-height:1.72;max-width:590px}
.er-page .er-hero .er-pills{margin-bottom:23px}
.er-page .er-hero-art.er-hero-prices{display:block;min-width:0;min-height:0;width:100%;margin:0}
.er-page .fuel-live.fuel-live-hero{width:100%;padding:27px 17px 19px;border:1px solid #2e5346;border-radius:23px;background:radial-gradient(ellipse at 20% 45%,#13573b37,transparent 70%),radial-gradient(ellipse at 75% 40%,#82203624,transparent 70%),linear-gradient(155deg,#111c2a,#09121e);box-shadow:0 25px 65px #0006;overflow:visible}
.er-page .fuel-live-hero .fuel-live-inner{width:100%;max-width:none;padding:0;text-align:center}
.er-page .fuel-live-hero .fuel-live-overline{font-size:.62rem;letter-spacing:.14em}
.er-page .fuel-live-hero h2{font-size:clamp(1.15rem,2.1vw,1.43rem);line-height:1.2;margin:12px 0 0;letter-spacing:-.03em}
.er-page .fuel-live-hero .fuel-live-stage{gap:clamp(30px,3vw,58px);padding:32px 7px 34px;min-height:305px}
.er-page .fuel-live-hero .fuel-pump{flex:0 1 170px}
.er-page .fuel-live-hero .fuel-live-vs{top:50%}
.er-page .fuel-live-hero .fuel-live-bottom{gap:8px;flex-direction:column;margin-bottom:7px}
.er-page .fuel-live-hero .fuel-live-bottom p{font-size:.72rem}
.er-page .fuel-live-hero .fuel-live-refresh{font-size:.69rem}
.er-page .fuel-live-hero .fuel-live-source{max-width:460px;font-size:.65rem;line-height:1.55;margin:8px auto 0}
@media(max-width:1100px){
 .er-page .er-hero-grid{grid-template-columns:minmax(0,1.03fr) minmax(0,1fr);gap:19px}
 .er-page .fuel-live-hero .fuel-pump{flex-basis:147px}
 .er-page .fuel-live-hero .fuel-live-stage{gap:35px;padding-left:4px;padding-right:4px}
 .er-page .fuel-live-hero .fuel-pump-screen strong{font-size:2.05rem}
 .er-page .fuel-live-hero .fuel-pump-screen>span{font-size:.53rem}
 .er-page .fuel-live-hero .fuel-pump-body{padding-left:12px;padding-right:12px}
}
@media(max-width:760px){
 .er-page .er-hero{padding:52px 0 62px}
 .er-page .er-hero-grid{grid-template-columns:1fr;gap:31px}
 .er-page .er-hero h1{font-size:clamp(2.7rem,9.3vw,4.45rem);line-height:1.09}
 .er-page .er-hero .er-lead{font-size:1rem}
 .er-page .er-hero-art.er-hero-prices{max-width:560px;margin:0 auto}
 .er-page .fuel-live-hero .fuel-pump{flex-basis:170px}
 .er-page .fuel-live-hero .fuel-live-stage{gap:clamp(38px,9vw,63px)}
}
@media(max-width:520px){
 .er-page .er-hero{padding:42px 0 52px}
 .er-page .er-hero h1{font-size:clamp(2.45rem,10.2vw,3.15rem);letter-spacing:-.058em;line-height:1.1}
 .er-page .er-hero .er-topline{letter-spacing:.12em;font-size:.71rem}
 .er-page .fuel-live.fuel-live-hero{padding:21px 12px 18px;border-radius:18px}
 .er-page .fuel-live-hero .fuel-live-overline{font-size:.56rem}
 .er-page .fuel-live-hero .fuel-live-stage{gap:clamp(29px,8vw,44px);padding:29px 0 25px;min-height:257px}
 .er-page .fuel-live-hero .fuel-pump{flex:0 1 clamp(111px,33vw,145px)}
 .er-page .fuel-live-hero .fuel-pump-body{padding:13px 8px;height:174px}
 .er-page .fuel-live-hero .fuel-pump-screen strong{font-size:clamp(1.5rem,6vw,2.05rem)}
 .er-page .fuel-live-hero .fuel-pump-screen>span{font-size:.46rem}
 .er-page .fuel-live-hero .fuel-live-vs{font-size:.66rem}
 .er-page .fuel-live-hero .fuel-live-source{font-size:.63rem}
}
@media(max-width:360px){
 .er-page .fuel-live.fuel-live-hero{padding-left:8px;padding-right:8px}
 .er-page .fuel-live-hero .fuel-live-stage{gap:30px}
 .er-page .fuel-live-hero .fuel-pump{flex-basis:112px}
}


/* Éclat vert discret — page E85 */
@keyframes erSoftGlow{0%,100%{opacity:.4;transform:translateX(-8px)}50%{opacity:.78;transform:translateX(8px)}}
.er-page .er-btn-green,.er-page .er-fuel-card,.er-page .fuel-live-hero .fuel-pump,.er-page .fuel-live-refresh{position:relative;overflow:hidden}
.er-page .er-btn-green:after,.er-page .er-fuel-card:after,.er-page .fuel-live-hero .fuel-pump:after,.er-page .fuel-live-refresh:after{content:"";position:absolute;left:12%;right:12%;bottom:9px;height:2px;border-radius:999px;background:linear-gradient(90deg,transparent,rgba(126,230,173,.92),transparent);opacity:.62;filter:blur(1.4px);pointer-events:none;animation:erSoftGlow 4.9s ease-in-out infinite}
.er-page .er-fuel-card{box-shadow:0 38px 85px #0008,0 0 90px rgba(64,190,129,.20)}
.er-page .fuel-live-hero .fuel-pump{filter:drop-shadow(0 0 22px rgba(67,226,150,.14))}
.er-page .fuel-live-hero .fuel-pump-sp{filter:drop-shadow(0 0 18px rgba(241,17,42,.10))}
.er-page .fuel-pump-screen strong{ text-shadow:0 0 26px rgba(37,239,142,.34)}
@media(prefers-reduced-motion:reduce){.er-page .er-btn-green:after,.er-page .er-fuel-card:after,.er-page .fuel-live-hero .fuel-pump:after,.er-page .fuel-live-refresh:after{animation:none!important}}
