/* ============================================================
   EDF POWER SOLUTIONS — BOUTIQUE B2B
   Design system + Header / Home / Footer
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');

.eps, .eps * { box-sizing: border-box; }
.eps {
  --eps-blue:#001A70; --eps-blue-d:#00104A; --eps-orange:#FE5716; --eps-orange-d:#E0450C;
  --eps-ink:#14171F; --eps-grey:#5B6472; --eps-line:#E3E7EE; --eps-bg:#F5F7FA;
  --eps-max:1320px; --eps-r:4px;
  font-family:'Manrope',-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  color:var(--eps-ink); line-height:1.55; -webkit-font-smoothing:antialiased;
}
.eps img { max-width:100%; height:auto; display:block; }
.eps a { text-decoration:none; color:inherit; }
.eps ul { list-style:none; margin:0; padding:0; }
.eps p { margin:0 0 1em; }
.eps h1,.eps h2,.eps h3,.eps h4 { margin:0 0 .6em; font-weight:800; line-height:1.15; letter-spacing:-.02em; color:var(--eps-blue); }
.eps-container { width:100%; max-width:var(--eps-max); margin:0 auto; padding:0 24px; }

/* --- Boutons --- */
.eps-btn { display:inline-flex; align-items:center; gap:10px; padding:15px 28px; border-radius:var(--eps-r);
  font-weight:700; font-size:15px; line-height:1; border:2px solid transparent; cursor:pointer; transition:.2s; }
.eps-btn--primary { background:var(--eps-orange); color:#fff; }
.eps-btn--primary:hover { background:var(--eps-orange-d); color:#fff; }
.eps-btn--ghost { background:transparent; color:#fff; border-color:rgba(255,255,255,.55); }
.eps-btn--ghost:hover { background:#fff; color:var(--eps-blue); border-color:#fff; }
.eps-btn--blue { background:var(--eps-blue); color:#fff; }
.eps-btn--blue:hover { background:var(--eps-blue-d); color:#fff; }

/* --- Titre de section --- */
.eps-shead { max-width:760px; margin:0 auto 48px; text-align:center; }
.eps-shead .eps-kicker { display:inline-block; font-size:12px; font-weight:800; letter-spacing:.16em;
  text-transform:uppercase; color:var(--eps-orange); margin-bottom:14px; }
.eps-shead h2 { font-size:clamp(26px,3.4vw,40px); }
.eps-shead p { color:var(--eps-grey); font-size:17px; margin:0; }

/* ============================================================
   1. HEADER — v2, inspiré du header corporate EDF power solutions
   ============================================================ */
.eps-header { position:sticky; top:0; z-index:900; background:#fff; border-bottom:1px solid var(--eps-line); }
.eps-head__in { display:flex; align-items:center; gap:30px; min-height:96px; }

.eps-logo { display:flex; align-items:center; gap:18px; flex:0 0 auto; }
.eps-logo img { height:52px; width:auto; }
.eps-tag { display:inline-flex; align-items:center; gap:8px; font-size:11px; font-weight:800;
  letter-spacing:.11em; text-transform:uppercase; color:var(--eps-grey);
  border-left:1px solid var(--eps-line); padding-left:18px; line-height:1.3; }
.eps-tag b { flex:0 0 auto; width:6px; height:6px; border-radius:50%; background:var(--eps-orange); }

.eps-nav { margin-left:auto; }
.eps-nav > ul { display:flex; align-items:center; gap:32px; }
.eps-nav a { position:relative; display:block; padding:37px 0; font-size:15.5px; font-weight:500; color:var(--eps-blue); }
.eps-nav a::after { content:""; position:absolute; left:50%; right:50%; bottom:32px; height:2px;
  background:var(--eps-orange); transition:left .28s ease, right .28s ease; }
.eps-nav a:hover::after, .eps-nav .is-current > a::after { left:0; right:0; }

.eps-sep { flex:0 0 auto; width:1px; height:26px; background:var(--eps-line); }

.eps-lang { display:flex; align-items:center; gap:4px; font-size:13px; font-weight:800; color:var(--eps-blue); }
.eps-lang a { padding:6px 4px; opacity:.4; transition:.15s; }
.eps-lang a:hover { opacity:.75; }
.eps-lang a.is-active { opacity:1; }
.eps-lang i { display:block; width:1px; height:11px; background:var(--eps-line); }

.eps-ico { display:flex; align-items:center; gap:2px; }
.eps-ico > a, .eps-ico > label { position:relative; width:42px; height:42px; border-radius:50%; cursor:pointer;
  display:flex; align-items:center; justify-content:center; color:var(--eps-blue); transition:background .18s; }
.eps-ico > a:hover, .eps-ico > label:hover { background:var(--eps-bg); }
.eps-badge { position:absolute; top:3px; right:3px; min-width:18px; height:18px; padding:0 5px; border-radius:9px;
  background:var(--eps-orange); color:#fff; font-size:10.5px; font-weight:800; line-height:18px; text-align:center; }

.eps-mtoggle { display:flex; align-items:center; gap:12px; cursor:pointer; padding:12px 2px 12px 16px;
  font-size:12px; font-weight:800; letter-spacing:.13em; text-transform:uppercase; color:var(--eps-blue); }
.eps-bars { display:block; width:22px; }
.eps-bars span { display:block; height:2px; background:var(--eps-blue); border-radius:2px; transition:.25s ease; }
.eps-bars span + span { margin-top:5px; }

/* --- Overlay plein écran (CSS-only, aucun JS : CE filtre les <script>) --- */
.eps-mcheck { position:absolute; width:0; height:0; opacity:0; pointer-events:none; }
.eps-ov { position:fixed; inset:0; z-index:990; background:var(--eps-blue); color:#fff; overflow-y:auto;
  opacity:0; visibility:hidden; transform:translateY(-16px); transition:opacity .3s ease, transform .3s ease, visibility .3s; }
.eps-mcheck:checked ~ .eps-ov { opacity:1; visibility:visible; transform:none; }
.eps-mcheck:checked ~ .eps-head .eps-bars span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.eps-mcheck:checked ~ .eps-head .eps-bars span:nth-child(2) { opacity:0; }
.eps-mcheck:checked ~ .eps-head .eps-bars span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

.eps-ov__head { display:flex; align-items:center; justify-content:space-between; min-height:96px;
  border-bottom:1px solid rgba(255,255,255,.14); }
.eps-ov__head img { height:46px; width:auto; }
.eps-ov__close { display:flex; align-items:center; gap:12px; cursor:pointer; color:#fff;
  font-size:12px; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.eps-ov__grid { display:grid; grid-template-columns:1.35fr 1fr; gap:70px; padding:46px 0 80px; }
.eps-ov__nav a { display:block; padding:16px 0; font-size:34px; font-weight:800; letter-spacing:-.025em;
  color:#fff; border-bottom:1px solid rgba(255,255,255,.14); transition:color .2s, padding-left .25s; }
.eps-ov__nav a:hover { color:var(--eps-orange); padding-left:14px; }
.eps-ov__side h4 { color:#fff; font-size:12px; font-weight:800; letter-spacing:.13em; text-transform:uppercase;
  margin:0 0 18px; padding-bottom:14px; border-bottom:1px solid rgba(255,255,255,.14); }
.eps-ov__side li { margin-bottom:12px; }
.eps-ov__side a { color:rgba(255,255,255,.78); font-size:16px; transition:.15s; }
.eps-ov__side a:hover { color:var(--eps-orange); }
.eps-ov__search { display:flex; align-items:center; background:rgba(255,255,255,.09);
  border:1px solid rgba(255,255,255,.22); border-radius:var(--eps-r); height:52px; margin-bottom:38px; }
.eps-ov__search input { flex:1; min-width:0; border:0; background:transparent; outline:0; padding:0 0 0 18px;
  font-family:inherit; font-size:16px; color:#fff; }
.eps-ov__search input::placeholder { color:rgba(255,255,255,.5); }
.eps-ov__search button { border:0; background:transparent; cursor:pointer; padding:0 18px; height:100%;
  display:flex; align-items:center; color:var(--eps-orange); }

@media (max-width:1240px){ .eps-nav > ul { gap:24px; } .eps-nav a { font-size:15px; } }
@media (max-width:1080px){ .eps-nav, .eps-tag { display:none; } .eps-head__in { min-height:78px; } .eps-logo img { height:42px; } }
@media (max-width:780px){
  .eps-mtoggle span:not([class]) { display:none; }
  .eps-mtoggle { padding-left:10px; }
  .eps-ov__grid { grid-template-columns:1fr; gap:40px; padding:34px 0 60px; }
  .eps-ov__nav a { font-size:26px; padding:13px 0; }
  .eps-lang { display:none; }
}

/* ============================================================
   2. HOME
   ============================================================ */
.eps-hero { position:relative; background:var(--eps-blue); color:#fff; overflow:hidden; }
.eps-hero__bg { position:absolute; inset:0; background-image:url('/img/cms/eps-hero.jpg');
  background-size:cover; background-position:center; opacity:.34; }
.eps-hero::after { content:""; position:absolute; inset:0;
  background:linear-gradient(100deg,var(--eps-blue) 8%,rgba(0,26,112,.82) 48%,rgba(0,26,112,.35) 100%); }
.eps-hero__in { position:relative; z-index:2; padding:96px 0 100px; max-width:720px; }
.eps-hero .eps-kicker { display:inline-flex; align-items:center; gap:9px; font-size:12px; font-weight:800;
  letter-spacing:.16em; text-transform:uppercase; color:#fff; background:var(--eps-orange);
  padding:8px 14px; border-radius:var(--eps-r); margin-bottom:26px; }
.eps-hero h1 { font-size:clamp(32px,4.8vw,56px); color:#fff; margin-bottom:22px; }
.eps-hero h1 em { font-style:normal; color:var(--eps-orange); }
.eps-hero__txt { font-size:18px; color:rgba(255,255,255,.86); max-width:560px; margin-bottom:34px; }
.eps-hero__cta { display:flex; flex-wrap:wrap; gap:14px; }

.eps-trust { background:#fff; border-bottom:1px solid var(--eps-line); }
.eps-trust__in { display:grid; grid-template-columns:repeat(4,1fr); }
.eps-trust__it { display:flex; align-items:flex-start; gap:14px; padding:30px 26px; border-left:1px solid var(--eps-line); }
.eps-trust__it:first-child { border-left:0; padding-left:0; }
.eps-trust__ic { flex:0 0 auto; width:40px; height:40px; border-radius:var(--eps-r); background:var(--eps-bg);
  display:flex; align-items:center; justify-content:center; color:var(--eps-orange); }
.eps-trust__it strong { display:block; font-size:15px; color:var(--eps-blue); margin-bottom:3px; }
.eps-trust__it span { font-size:13.5px; color:var(--eps-grey); line-height:1.45; }

.eps-sec { padding:88px 0; }
.eps-sec--alt { background:var(--eps-bg); }

.eps-cats { display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
.eps-cat { position:relative; display:block; overflow:hidden; border-radius:var(--eps-r); background:var(--eps-blue);
  min-height:330px; }
.eps-cat img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  opacity:.62; transition:transform .55s ease, opacity .3s; }
.eps-cat:hover img { transform:scale(1.06); opacity:.5; }
.eps-cat::after { content:""; position:absolute; inset:0;
  background:linear-gradient(to top,rgba(0,16,74,.94) 5%,rgba(0,16,74,.12) 68%); }
.eps-cat__in { position:relative; z-index:2; height:100%; min-height:330px; display:flex; flex-direction:column;
  justify-content:flex-end; padding:30px; }
.eps-cat__in h3 { color:#fff; font-size:23px; margin-bottom:8px; }
.eps-cat__in p { color:rgba(255,255,255,.8); font-size:14.5px; margin:0 0 16px; }
.eps-cat__more { display:inline-flex; align-items:center; gap:9px; font-weight:700; font-size:14px; color:var(--eps-orange); }
.eps-cat__more svg { transition:transform .25s; }
.eps-cat:hover .eps-cat__more svg { transform:translateX(5px); }

.eps-steps { display:grid; grid-template-columns:repeat(3,1fr); gap:26px; counter-reset:eps; }
.eps-step { background:#fff; border:1px solid var(--eps-line); border-radius:var(--eps-r); padding:34px 30px; position:relative; }
.eps-step::before { counter-increment:eps; content:"0" counter(eps); display:block; font-size:34px; font-weight:800;
  color:var(--eps-orange); line-height:1; margin-bottom:16px; }
.eps-step h3 { font-size:19px; margin-bottom:9px; }
.eps-step p { color:var(--eps-grey); font-size:15px; margin:0; }

.eps-cta { background:var(--eps-blue); color:#fff; }
.eps-cta__in { display:flex; align-items:center; justify-content:space-between; gap:40px; padding:66px 0; flex-wrap:wrap; }
.eps-cta h2 { color:#fff; font-size:clamp(24px,3vw,34px); margin-bottom:10px; }
.eps-cta p { color:rgba(255,255,255,.8); margin:0; max-width:560px; font-size:16px; }

@media (max-width:980px){
  .eps-trust__in { grid-template-columns:repeat(2,1fr); }
  .eps-trust__it:nth-child(3) { border-left:0; padding-left:0; }
  .eps-trust__it { padding:24px 20px; }
  .eps-cats, .eps-steps { grid-template-columns:1fr 1fr; }
  .eps-sec { padding:64px 0; }
  .eps-hero__in { padding:70px 0 74px; }
}
@media (max-width:640px){
  .eps-trust__in { grid-template-columns:1fr; }
  .eps-trust__it { border-left:0; padding:20px 0; border-top:1px solid var(--eps-line); }
  .eps-trust__it:first-child { border-top:0; }
  .eps-cats, .eps-steps { grid-template-columns:1fr; }
  .eps-hero__cta .eps-btn { width:100%; justify-content:center; }
}

/* ============================================================
   3. FOOTER
   ============================================================ */
.eps-footer { background:var(--eps-blue-d); color:rgba(255,255,255,.75); font-size:14.5px; }
.eps-footer__top { display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:44px; padding:66px 0 54px; }
.eps-footer__logo img { height:44px; width:auto; margin-bottom:20px; }
.eps-footer__base { max-width:330px; }
.eps-footer__base p { color:rgba(255,255,255,.68); font-size:14.5px; line-height:1.6; }
.eps-footer h4 { color:#fff; font-size:13px; font-weight:800; letter-spacing:.13em; text-transform:uppercase;
  margin-bottom:20px; padding-bottom:14px; border-bottom:1px solid rgba(255,255,255,.16); }
.eps-footer__col li { margin-bottom:11px; }
.eps-footer__col a { color:rgba(255,255,255,.75); transition:.15s; }
.eps-footer__col a:hover { color:var(--eps-orange); }
.eps-footer__contact li { display:flex; gap:11px; margin-bottom:13px; color:rgba(255,255,255,.75); line-height:1.45; }
.eps-footer__contact svg { flex:0 0 auto; margin-top:3px; color:var(--eps-orange); }
.eps-footer__contact a:hover { color:var(--eps-orange); }
.eps-social { display:flex; gap:9px; margin-top:24px; }
.eps-social a { width:38px; height:38px; border-radius:var(--eps-r); border:1px solid rgba(255,255,255,.2);
  display:flex; align-items:center; justify-content:center; color:#fff; transition:.18s; }
.eps-social a:hover { background:var(--eps-orange); border-color:var(--eps-orange); }
.eps-footer__bottom { border-top:1px solid rgba(255,255,255,.13); padding:22px 0; display:flex;
  align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; font-size:13.5px; }
.eps-footer__bottom p { margin:0; color:rgba(255,255,255,.55); }
.eps-footer__legal { display:flex; flex-wrap:wrap; gap:8px 22px; }
.eps-footer__legal a { color:rgba(255,255,255,.65); }
.eps-footer__legal a:hover { color:var(--eps-orange); }
@media (max-width:980px){ .eps-footer__top { grid-template-columns:1fr 1fr; gap:34px; padding:52px 0 40px; } }
@media (max-width:600px){ .eps-footer__top { grid-template-columns:1fr; } .eps-footer__bottom { justify-content:center; text-align:center; } }